@import url("https://fonts.googleapis.com/css2?family=Mea+Culpa&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Mea+Culpa&family=Tinos:ital,wght@0,400;0,700;1,400;1,700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Funnel+Sans:ital,wght@0,300..800;1,300..800&family=Mea+Culpa&family=Tinos:ital,wght@0,400;0,700;1,400;1,700&display=swap");

@keyframes animation1{
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }

}
main {
    animation: animation1 2s 1;

}

body {
    color: #f8f7f4;
    margin: 0;
}


.div1pery {
    width: 50%;
}





.fhotozbrovamy {
    width: 45%;
    height: auto;
    padding: 10px;
}

.fhotozbrovamy img {
    width: 100%;
}



.brovymake-up2section {
    height: max-content;
    padding: 20px;
    color: #f8f7f4;
}

.div1pery {
    width: 49%;
    padding: 10px;
}

.psection2 {
    color: #ffffff;
}

.ulpery li {
    color: #ffffff;

}

.div1pery ul li {
    font-size: 1.2rem;
    list-style-image: url("/img/check_24dp_F8F7F4_FILL0_wght400_GRAD0_opsz24 (1).png");
    margin: 1vh;
}

.div1pery ul li::marker {
    color: white;
}

.div1pery ul {
    padding: 25px;
    background-color: rgb(108, 108, 108);
    border-radius: 0 0 15px 15px;
}

.perydiv2fhoto {
    width: 50%;
    transition: 0.5s;
    padding: 10px;
}

.perydiv2fhoto img {
    width: 100%;
    height: 100%;
}

.divflex {
    display: flex;
    height: 50%;
    justify-content: center;
}

.psection2 {
    font-size: 1.2rem;
}

.h2Div h2 {
    color: #ffffff;
    width: 100%;
    text-align: center;
    font-size: 4rem;
}

.pDiv {
    color: #ffffff;
    width: 100%;
    font-size: 1.7rem;
    text-align: center;
    margin-top: 2vh;
    margin-bottom: 3vh;
}

.ulDiv {
    color: #ffffff;
    width: 40%;
    list-style-image: url("/img/check_24dp_F8F7F4_FILL0_wght400_GRAD0_opsz24 (1).png");
    background-color: #655143;
    border-radius: 20px;
    box-shadow: 0 0 20px black;
}

.div1pery p {
    font-size: 1.7rem;
    background-color: #745e4e;
    margin: 0;
    border-radius: 10px 10px 0 0;
}

.div1pery ul li {
    font-size: 1.4rem;
}

.div1pery ul {
    background-color: #655143;
}

.ulDiv ul {
    width: 100%;
    font-size: 1.4rem;
}

.ulDiv ul li {
    margin-top: 1vh;
}

.ulDiv p {
    font-size: 1.7rem;
    background-color: #745e4e;
    border-radius: 13px;
    padding: 5px;
    padding-left: 15px;
}

.ulMainDiv {
    display: flex;
    justify-content: center;
    margin-bottom: 5vh;
    width: 100%;
}

.divMain {
    width: 50%;
}

.div1pery {
    width: 100%;
}

.hr {
    width: 40%;
    margin: 0 auto !important;
    color: #f8f7f4 !important;
    margin-top: 1vh !important;
    border: 2px solid !important;
}

.ulDiv2 {
    color: #ffffff;
    width: 40%;
    list-style-image: url("/img/close_small_24dp_FFFFFF_FILL0_wght400_GRAD0_opsz24.png");
    background-color: #655143;
    border-radius: 20px;
    margin-left: 5vh;
    box-shadow: 0 0 20px black;
}

.ulDiv2 p {
    font-size: 1.7rem;
    background-color: #745e4e;
    border-radius: 13px;
    padding: 5px;
    padding-left: 15px;
}

.ulDiv2 ul {
    width: 100%;
    font-size: 1.4rem;
}

.ulDiv2 ul li {
    margin-top: 1vh;
}

@media (max-width: 1000px) {
    


    h2 {
        font-size: 6rem;
    }
    

    .h3make-up {
        font-size: 8rem;
        text-align: left;
    }

    .div1pery ul li {
        font-size: 2.5rem;
    }

    .ulDiv ul li {
        font-size: 2rem;
    }

    .ulDiv p {
        font-size: 2.3rem;
    }

    .ulDiv2 ul li {
        font-size: 2rem;
    }

    .ulDiv2 p {
        font-size: 2.3rem;
    }


    .ulDiv {
        width: 55%;
    }

    section {
        padding-left: 22px;
        padding-right: 22px;
    }

    .ulDiv2 {
        width: 55%;
    }

    .h2permake-up {
        font-size: 6rem;
        text-shadow: 1px 15px 50px rgba(0, 0, 0, 0.4);
    }

    .psection2 {
        font-size: 4rem;
        padding: 10px;
    }

    .logo {
        width: 14vh;
        height: 18vh;
    }

    .pDiv {
        font-size: 2.2rem;
    }

    section {
        display: block;
    }

    .fhotozbrovamy {
        width: 100%;
        padding: 0;
    }

    .divMain {
        margin: 0 auto;
        width: 70%;
    }


    .divopisobocive {
        width: 100%;
    }

    .divflex {
        display: block;
    }

    .div1pery {
        width: 100%;
        padding: 0;
    }

    .div1pery ul li {
        font-size: 1.9rem;
        padding: 5px;
        margin-left: 1vh;
    }

    .div1pery p {
        font-size: 3.1rem;
    }

    .perydiv2fhoto {
        width: 100%;
        transition: 0.5s;
        padding: 0;
    }

    .divfhotoobocive {
        width: 100%;
        padding: 0;
    }

    .obocivaP {
        font-size: 3.2rem;
    }

    .h2korekcia {
        font-size: 3.6rem;
    }

    svg {
        height: 60px;
        width: 60px;
        margin: 20px;
    }

}
 



.logo {
    height: 100%;
}