@import url('https://fonts.googleapis.com/css2?family=Bai+Jamjuree&family=Roboto+Slab:wght@300;400;500;600&display=swap');

* {
    --white_text: #dbcbd8;
    --black_text: #2e0626;
    --green: #5b9c51;
}

html {
    min-height: 100%;
    color:var(--white_text);
    font-family: 'Bai Jamjuree', sans-serif;
    font-family: 'Roboto Slab', serif;
    user-select: none;
    display: flex;
    flex-direction: column;
}

body {
    background-image: linear-gradient(322deg ,#562061, #2e0626);
    background-repeat: no-repeat;
    height:100%;
}

body > * > *, body > * > * > * {
    animation-name: bigBang;
    animation-duration: .4s;
}




.frame {
    display: flexbox;
    margin-right: auto;
    margin-left: auto;
    min-height: 565px;
}

.banner {
    font-size: 25px;
    font-weight: 600;
    padding: 1rem;
}
.banner::after {content: "🌿";}

.bod {
    background-color: #eecbe7;
    box-shadow: #d294c5 2px 2px 1px;
    color: var(--black_text);
    font-size: 25px;
    font-weight: 600px;
    margin: 0; margin-bottom: 1.4rem;
    padding: 0.1rem;
    display: flex;
    gap: .4rem;
    align-items: center;
}
.bod .mid_text {margin-left: auto;}
.bod > * { margin: 0; padding: 0;}

.gbtn {
    color: var(--black_text);

    width: 40px; height: 40px;

    box-shadow: #4b7f43 2px 2px 1px;

    margin-left: auto;
    margin-right: .4rem;
    background-color: var(--green);
    display: flex;
    align-items: center;

    transition: .2s;
}
.gbtn > * {padding: 0;margin: 0;}
.gbtn:hover {transform: translateY(-2px);}

.r0 {border-radius: 10rem;padding: .2rem .5rem;}
.r1 {border-radius: 2rem;}

.cp {background-color: #96519c;box-shadow: rgb(111, 62, 100) 2px 2px 1px;}

.c {font-weight: 600;}

.p1 {padding: 1rem;}


.insta {background-color: #e956ba;box-shadow: rgb(206, 143, 182) 2px 2px 1px !important}
.insta p {color: aliceblue;}
.insta h5 {color: aliceblue;}
.insta .gbtn {background-color: #e790d3;box-shadow: rgb(206, 143, 198) 2px 2px 1px !important;}

.twitt {background-color: #56c9e9;box-shadow: rgb(143, 183, 206) 2px 2px 1px !important}
.twitt p {color: aliceblue;}
.twitt h5 {color: aliceblue;}
.twitt .gbtn {background-color: #90dee7;box-shadow: rgb(143, 183, 206) 2px 2px 1px !important;}
.twitt img{filter: invert(100%);width: 50px;padding: .2rem;}

.white_text {color: var(--white_text);}
.black_text {color: var(--black_text);}


.footer{
    color: #8b508c;
    font-weight: 600;
    /* min-height: 37px;
    padding: .5rem; */
    display: flex;
    align-items: center !important;
}
.footer > * {margin: 0;}
.footer p {margin-left: auto; margin-right: auto;}


@media screen and (min-width: 450px) {
    body {display: flexbox;}
    .frame:first-child {max-width: 450px;}
    .bod {margin-left: 0;margin-right: 0}
}


/* #5b9c51 */

@keyframes bigBang {
    from {
        transform: scale(.1);
    }
    to {
        transform: scale(1);
    }
}