html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Courier New', Courier, monospace;
    font-size: larger;
    color: rgb(252, 132, 156);
    text-align: center;
    background: url("dot.png"), linear-gradient(180deg, rgb(255, 219, 247) 0%, rgb(255, 176, 197) 100%);
}

::-webkit-scrollbar {
    width: 5px;
    background: rgb(255, 247, 247);
}

::-webkit-scrollbar-thumb {
    background: rgb(255, 160, 176);
    border-radius: 20px;
}

::-webkit-scrollbar-thumb:hover {
    background:rgb(218, 95, 115);
}


.header {
    position: relative;
    font-family: 'Courier New', Courier, monospace;
    font-size: medium;
    word-spacing: 10px;
    text-align: center;
    animation-name: headerz;
    animation-duration: 1s;

}

fieldset {
    position: relative;
    border-radius: 30px;
    border: 5px dotted rgb(255, 158, 158);
    margin-bottom: 10%;
    background-image: url("square.png");

}

.fieldset {
    animation-name: welcomz;
    animation-duration: 2.5s;
    max-width: 1300px;
    margin:auto;
}

.fieldset-inline {
    /*display:inline-block;*/
    animation-name: welcomz;
    animation-duration: 2.5s;
    max-width: 1300px;
    margin:auto;
}

.fil2 {
    animation-name: welcomz;
    animation-duration: 2.5s;
    max-width: 1300px;
    margin:auto;
}

@keyframes headerz {
    0% {
        opacity: 0;
        top: -2vh;
    }

    50% {
        opacity: 1;
        top: 0.5vh
    }

    100% {
        opacity: 1;
        top: 0vh
    }

}

@keyframes welcomz {
    0% {
        opacity: 0%;
        top: -2vh;
    }

    50% {
        opacity: 1;
        top: 1vh
    }

    100% {
        opacityy: 1;
        top: 0vh
    }
}

.aa {
    color: rgb(252, 132, 156);
    border: solid 1px rgb(252, 132, 156);
    border-radius: 5px;
    background-color: rgba(252, 132, 156, 0.080);
    padding: 5px;
    display: inline-block;
    margin: 2px 0;
    transition: 0.2s;
    text-decoration: none;
}


.aa:hover {
    color: rgb(96, 196, 89);
    background-color: rgba(96, 196, 89, 0.080);
    border-color: rgb(96, 196, 89);
    transition: 0.4s;
    text-decoration: none;
}

.back {
    margin-top: 5%;
        margin-bottom: 3%;
    }

img {
    border-radius: 50%;
    max-width: 10%;
    min-width: 80px;
    height: auto;
    text-align: center;
    border: 6px dotted rgb(255, 158, 158);
    margin-bottom: 10px;
}

.image {
    border-radius: 10%;
    border: 4px solid;
    max-width: 20%;
    height: auto;
    background-color: rgba(255, 201, 221, 0.452);

}

.imageblue {
    border-radius: 10%;
    max-width: 20%;
    height: auto;
    background-color: rgba(201, 205, 255, 0.452);
    border: 4px solid rgb(169, 174, 241);
}

.imageyel {
    border-radius: 10%;
    max-width: 20%;
    height: auto;
    background-color: rgba(255, 244, 188, 0.393);
    border: 4px solid rgb(234, 219, 143);
}

.welcome {
    color: rgb(242, 127, 157);
    text-align: center;
    font-family: 'Courier New', Courier, monospace;
    margin-top: 5%;
    margin-bottom: 10%;
    text-shadow: 2px 3px rgba(225, 159, 159, 0.441);
}

h1 {
    text-shadow: 2px 3px rgba(225, 159, 159, 0.441);
}

h2 {
    text-shadow: 2px 2px rgba(253, 176, 176, 0.441);
}

.terms {
    color: rgb(242, 127, 157);
    text-align: center;
    font-family: 'Courier New', Courier, monospace;
    margin-top: 7%;
    margin-bottom: 5%;
    text-shadow: 2px 3px rgba(225, 159, 159, 0.441);
    text-decoration: underline 3.5px;
}

.h3-1 {
    color: rgb(255, 197, 211);
    text-shadow: 2px 1px rgba(241, 202, 202, 0.342);
    font-style: italic;
}

h3 {
    font-weight: bolder;
    color: rgb(255, 115, 152);
    margin-bottom: 5%;
    text-decoration: underline;
}

span {
    font-weight: bold;
    color: rgb(255, 155, 178);
    text-shadow: 0px 2px rgba(231, 180, 180, 0.199);
}

hr {
    border: 0;
    border-top: 4px dotted rgb(255, 115, 152);
    width: 70%;
}

.inbetween {
    border: 0;
    border-top: 3.5px dotted rgb(255, 115, 152);
    width: 10%;
    margin-top: 4%;
    margin-bottom: 7%;
}

.limit {
    border: 0;
    border-top: 3.5px dashed rgb(255, 115, 152);
    width: 32%;
    margin-top: 7%;
    margin-bottom: 9%;
}



.welcome-fieldset {
    align-items: center;
}




.socialsimg {
    vertical-align: middle;
    border: none;
    border-radius: 0%;
    min-width: 20px;
    max-width: 3%;
    max-height: auto;
    margin-bottom: 0%;

}

.socials {
    color: rgb(252, 132, 156);
    transition: 0.2s;
    text-decoration: none;
    position: relative;
    padding: 5px;
    display: block;
}

.socials:hover {
    color: rgb(96, 196, 89);
    transition: 0.4s;
    text-decoration: none;
    padding-top: 6px;

}


.socialstext {
    display: inline-block;
    font-family: 'Courier New', Courier, monospace;
    font-size: larger;
}

.pricesimg {
    color: rgb(252, 132, 156) ;
    border: 2px solid ;
    border-radius: 20px ;
    max-width: 15%;
    max-height: auto;
}

.pricesemots {
    border: none;
    border-radius: 2px;

}

.pricespanel {
    border: none;
    border-radius: 0px;
    max-width: 30%;
    max-height: auto;
}

.pricescard {
    border: 2px solid rgb(218, 95, 115);
    border-radius: 5px;
    width: 300px;
    max-height: auto;
}