@import url('https://fonts.googleapis.com/css2?family=Pacifico&display=swap');
/* 
#33ccad/#cc3352
#b66cae/#6cb675
*/


:root {
    --main: #b66cae;
    --secondary: #6D5591;
    --third: #f2ac3a;
    --white: #ffffff;
    --gray: #242F40;
    --pink:#ffa7a7;
}

* {
    -webkit-tap-highlight-color:  rgba(255, 255, 255, 0);
    font-family: 'Pacifico', cursive;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none;
    outline: none;
    border:none;

}
*, html {scroll-behavior: smooth !important;}
html{overflow: hidden;}
img{object-fit: cover;}

/*Put on a text to disable copying*/
.no-copy {
    -webkit-user-select: none;  /* Chrome all / Safari all */
    -moz-user-select: none;     /* Firefox all */
    -ms-user-select: none;      /* IE 10+ */
    user-select: none;          /* Likely future */     
}


/*Start of navigation*/
nav {
    position: fixed;
    top: 0;
    width: 100%;
    display: flex;
    justify-content: space-around;
    align-items: center;
    min-height: 8vh;
    background: linear-gradient(to top, var(--main), 70%, var(--secondary));

    background-color: var(--main);
    z-index: 1000;
}

.logo {height: 12vh;}

.logo img {
    height: 100%;
    width: auto;
}

.nav-links {
    display: flex;
    justify-content: space-around;
    width: 50%;
}

.nav-links li {list-style: none;}

.nav-links a {
    color: var(--white);
    text-decoration: none;
    letter-spacing: 3px;
    /* font-weight: bold; */
    font-size: 16px;
    padding: 12px 20px;
    transition: .3s linear;
    position: relative;
}

.nav-links a:hover{color: var(--main);}

.nav-links a::before,
.nav-links a::after{
    content: "";
    position: absolute;
    width: 100%;
    height: 0%;
    left: 0;
    box-sizing: border-box;
    z-index: -1;
}

.nav-links a::before{
    bottom: 0;
    border-left: 1px solid var(--white);
    border-right: 1px solid var(--white);
    transition: .3s linear;
}

.nav-links a::after{
    top: 0;
    background-color: var(--white);
    transition: .3s linear .3s;
}

.nav-links a:hover::before,
.nav-links a:hover::after{
    height: 100%;
}

.burger {display: none;}

.burger div {
    width: 25px;
    height: 3px;
    background-color: var(--white);
    margin: 5px;
    transition: all 0.3s ease;
}

.toggle .line1 {transform: rotate(-45deg) translate(-5px, 6px);}
.toggle .line2 {opacity: 0;}
.toggle .line3 {transform: rotate(45deg) translate(-5px, -6px);}
/*End of navigation*/


.container{
    overflow-y: scroll;
    height: 100vh;
}

@media screen and (min-width: 991px) {
    .container{scroll-snap-type: y mandatory;}
}

section{
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    scroll-snap-align: start;
}

/*End of body*/



/*Responisveness*/
@media screen and (max-width: 1480px) {.nav-links {width: 70%;}}
@media screen and (max-width: 1200px) {.nav-links {width: 70%;}}
@media screen and (max-width: 1058px) {.nav-links {width: 75%;}}

@media screen and (max-width: 991px) {

    /* Hide scrollbar for Chrome, Safari and Opera */
    ::-webkit-scrollbar { display:none }
    body::-webkit-scrollbar {display: none;}
    body {
        overflow-x: hidden;
        -ms-overflow-style: none;  /* IE and Edge */
        scrollbar-width: none;  /* Firefox */
    }

    /*Navigation*/
    .nav-links {
        position: fixed;
        right: 0px;
        height: 88vh;
        top: 12vh;
        background: linear-gradient(to bottom, var(--main), 95%, var(--secondary));
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 50%;
        transform: translateX(100%);
        transition: transform 0.5s ease-in;
        padding-bottom: 15vh;
    }
    @keyframes navLinkFade {
        from {
            opacity: 0;
            transform: translateX(50px);
        }
        to {
            opacity: 1;
            transform: translateX(0);
        }
    }
    .nav-active {transform: translateX(0%);}
    .nav-links li {opacity: 0;}
    .burger {
        display: block;
        cursor: pointer;
    } 
}


.last{height: 25vh;}
footer {bottom: 0;}

@media (max-height:800px) {
    footer {position: static;}
    header {padding-top: 40px;}
}

.footer-distributed {
    background-color: #2d2a30;
    box-sizing: border-box;
    width: 100%;
    text-align: left;
    font: bold 20px sans-serif;
    padding: 30px 50px 60px 50px;
    margin-top: 30px;
}

@media (min-width: 1030px) {
    .footer-distributed {
        margin-top: 100px;
    }
}
/*Tezi 2 media query-ta opravqt dupka mejdu body-to i footer-a*/
@media (min-width: 1200px) {
    .footer-distributed {
        margin-top: 90px;
    }
}

.footer-distributed .footer-left, .footer-distributed .footer-center, .footer-distributed .footer-right {
    display: inline-block;
    vertical-align: top;
}

/* Footer left */
.footer-distributed .footer-left {width: 30%;}
.footer-distributed h3 {
    color: #ffffff;
    font-size:32px;
    margin: 0;
}
.footer-distributed h3 span {
    color: var(--main);
}
/* Footer links */
.footer-distributed .footer-links {
    color: #ffffff;
    margin: 20px 0 12px;
}
.footer-distributed .footer-links a {
    display: inline-block;
    line-height: 1.8;
    text-decoration: none;
    color: inherit;
}
.footer-distributed .footer-company-name {
    color: #8f9296;
    font-size: 18px;
    font-weight: normal;
    margin: 0;
}

/* Footer Center */
.footer-distributed .footer-center {width: 35%;}
.footer-distributed .footer-center i {
    background-color: #33383b;
    color: #ffffff;
    font-size: 25px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    text-align: center;
    line-height: 42px;
    margin: 10px 15px;
    vertical-align: middle;
}
.footer-distributed .footer-center i.fa-envelope {
    font-size: 17px;
    line-height: 38px;
}
.footer-distributed .footer-center p {
    display: inline-block;
    color: #ffffff;
    vertical-align: middle;
    margin: 0;
}
.footer-distributed .footer-center p span {
    display: block;
    font-weight: normal;
    font-size: 20px;
    line-height: 2;
}
.footer-distributed .footer-center p a {
    color: var(--main);
    text-decoration: none;
}

/* Footer Right */
.footer-distributed .footer-right {
    width: 30%;
}
.footer-distributed img{
    object-fit: contain;
    height: 12em;
    width: 100%;
}
.footer-distributed .footer-company-about {
    line-height: 20px;
    color: #92999f;
    font-size: 13px;
    font-weight: normal;
    margin: 0;
}
.footer-distributed .footer-company-about span {
    display: block;
    color: #ffffff;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 20px;
}
.footer-distributed .footer-icons {
    margin-top: 25px;
}
.footer-distributed .footer-icons a {
    display: inline-block;
    width: 35px;
    height: 35px;
    cursor: pointer;
    background-color: #33383b;
    border-radius: 2px;
    font-size: 20px;
    color: #ffffff;
    text-align: center;
    line-height: 35px;
    margin-right: 3px;
    margin-bottom: 5px;
}
.footer-distributed .footer-icons a:hover {
    background-color: var(--main);
}
.footer-links a:hover {
    color: var(--main);
}
@media (max-width: 880px) {
    .footer-distributed .footer-left, .footer-distributed .footer-center, .footer-distributed .footer-right {
        display: block;
        width: 100%;
        margin-bottom: 40px;
        text-align: center;
    }
    .footer-distributed .footer-center i {
        margin-left: 0;
    }
    .last{
        height: 60vh;
    }
}       


/*Loader*/
.loader-wrapper {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: var(--main);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}
/*End of loader*/

@keyframes appear {
    from {
        opacity: 0;
        scale: 0.5;
    }
    to{
        opacity: 1;
        scale: 1;
    }
}


@media screen and (max-width: 991px) {
    @keyframes appear {
        from {
            opacity: 1;
            scale: 1;
        }
        to{
            opacity: 1;
            scale: 1;
        }
    }
}