/*KKKKKKKKK    KKKKKKKEEEEEEEEEEEEEEEEEEEEEEPPPPPPPPPPPPPPPPP        OOOOOOOOO          KKKKKKKKK    KKKKKKK     OOOOOOOOO     EEEEEEEEEEEEEEEEEEEEEE             CCCCCCCCCCCCC     OOOOOOOOO     KKKKKKKKK    KKKKKKK !!! 
K:::::::K    K:::::KE::::::::::::::::::::EP::::::::::::::::P     OO:::::::::OO        K:::::::K    K:::::K   OO:::::::::OO   E::::::::::::::::::::E          CCC::::::::::::C   OO:::::::::OO   K:::::::K    K:::::K!!:!!
K:::::::K    K:::::KE::::::::::::::::::::EP::::::PPPPPP:::::P  OO:::::::::::::OO      K:::::::K    K:::::K OO:::::::::::::OO E::::::::::::::::::::E        CC:::::::::::::::C OO:::::::::::::OO K:::::::K    K:::::K!:::!
K:::::::K   K::::::KEE::::::EEEEEEEEE::::EPP:::::P     P:::::PO:::::::OOO:::::::O     K:::::::K   K::::::KO:::::::OOO:::::::OEE::::::EEEEEEEEE::::E       C:::::CCCCCCCC::::CO:::::::OOO:::::::OK:::::::K   K::::::K!:::!
KK::::::K  K:::::KKK  E:::::E       EEEEEE  P::::P     P:::::PO::::::O   O::::::O     KK::::::K  K:::::KKKO::::::O   O::::::O  E:::::E       EEEEEE      C:::::C       CCCCCCO::::::O   O::::::OKK::::::K  K:::::KKK!:::!
  K:::::K K:::::K     E:::::E               P::::P     P:::::PO:::::O     O:::::O       K:::::K K:::::K   O:::::O     O:::::O  E:::::E                  C:::::C              O:::::O     O:::::O  K:::::K K:::::K   !:::!
  K::::::K:::::K      E::::::EEEEEEEEEE     P::::PPPPPP:::::P O:::::O     O:::::O       K::::::K:::::K    O:::::O     O:::::O  E::::::EEEEEEEEEE        C:::::C              O:::::O     O:::::O  K::::::K:::::K    !:::!
  K:::::::::::K       E:::::::::::::::E     P:::::::::::::PP  O:::::O     O:::::O       K:::::::::::K     O:::::O     O:::::O  E:::::::::::::::E        C:::::C              O:::::O     O:::::O  K:::::::::::K     !:::!
  K:::::::::::K       E:::::::::::::::E     P::::PPPPPPPPP    O:::::O     O:::::O       K:::::::::::K     O:::::O     O:::::O  E:::::::::::::::E        C:::::C              O:::::O     O:::::O  K:::::::::::K     !:::!
  K::::::K:::::K      E::::::EEEEEEEEEE     P::::P            O:::::O     O:::::O       K::::::K:::::K    O:::::O     O:::::O  E::::::EEEEEEEEEE        C:::::C              O:::::O     O:::::O  K::::::K:::::K    !:::!
  K:::::K K:::::K     E:::::E               P::::P            O:::::O     O:::::O       K:::::K K:::::K   O:::::O     O:::::O  E:::::E                  C:::::C              O:::::O     O:::::O  K:::::K K:::::K   !!:!!
KK::::::K  K:::::KKK  E:::::E       EEEEEE  P::::P            O::::::O   O::::::O     KK::::::K  K:::::KKKO::::::O   O::::::O  E:::::E       EEEEEE      C:::::C       CCCCCCO::::::O   O::::::OKK::::::K  K:::::KKK !!! 
K:::::::K   K::::::KEE::::::EEEEEEEE:::::EPP::::::PP          O:::::::OOO:::::::O     K:::::::K   K::::::KO:::::::OOO:::::::OEE::::::EEEEEEEE:::::E       C:::::CCCCCCCC::::CO:::::::OOO:::::::OK:::::::K   K::::::K     
K:::::::K    K:::::KE::::::::::::::::::::EP::::::::P           OO:::::::::::::OO      K:::::::K    K:::::K OO:::::::::::::OO E::::::::::::::::::::E        CC:::::::::::::::C OO:::::::::::::OO K:::::::K    K:::::K !!! 
K:::::::K    K:::::KE::::::::::::::::::::EP::::::::P             OO:::::::::OO        K:::::::K    K:::::K   OO:::::::::OO   E::::::::::::::::::::E          CCC::::::::::::C   OO:::::::::OO   K:::::::K    K:::::K!!:!!
KKKKKKKKK    KKKKKKKEEEEEEEEEEEEEEEEEEEEEEPPPPPPPPPP               OOOOOOOOO          KKKKKKKKK    KKKKKKK     OOOOOOOOO     EEEEEEEEEEEEEEEEEEEEEE             CCCCCCCCCCCCC     OOOOOOOOO     KKKKKKKKK    KKKKKKK !!!*/

/*=========================== FONT =============================*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

/*=========================== RESPONSIVE =============================*/
@media (max-width:567px) {
    img.logo-bos {
        top: 7rem;
    }

    img.foto-bos {
        top: 8rem;
    }

    .author-box h1 {
        letter-spacing: 0;
    }

    .promo {
        font-size: 30px;
        box-shadow: none;
    }
}


@media(min-width:768px) {
    img.logo-bos {
        margin-top: 3rem;
        top: 3rem;
    }

    img.foto-bos {
        top: 10rem;
    }
}


@media (min-width: 992px) {
    img.logo-bos {
        top: 7rem;
    }

    img.foto-bos {
        top: 11rem;
    }
}

@media (min-width: 1200px) {
    img.logo-bos {
        top: 5rem;
    }

    img.foto-bos {
        top: 15rem;
    }
}

@media (min-width: 1440px) {
    img.logo-bos {
        top: 7rem;
    }

    img.foto-bos {
        top: 11rem;
    }
}

/*=========================== AUTHOR SECTION =============================*/
.author-box {
    margin-top: 1rem;
    text-align: center;
}

.author-box h1 {
    display: block;
    font-size: 30px;
    font-style: italic;
    color: white;
}

.author-box small {
    display: block;
    font-size: 15px;
    color: white;
    text-align: center;
    letter-spacing: 0.5rem;
}

.box-icons {
    display: block;
    text-align: center;
    margin-top: 2rem;
}

.box-icons a {
    color: white;
    font-size: 2rem;
    margin: 2rem;
}

body {
    overflow: hidden;
    height: 100vh;
    margin: 0;
    padding: 0;
}

html,
h1 {
    margin: 0;
    padding: 0;
}

.slides {
    font-family: 'Poppins', sans-serif;
    text-transform: uppercase;
    font-size: 3.2em;
    scroll-behavior: smooth;
}

.slide-1,
.slide-2,
.slide-3 {
    position: relative;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0.8;
}

.slide-1 {
    background: linear-gradient(to bottom right, rgb(1 160 255 / 70%), rgb(255 122 97 / 80%)),
        url(../images/1.jpeg);
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

img.logo-bos {
    width: 250px;
    position: absolute;
}

img.foto-bos {
    position: absolute;
    width: 150px;
    border-radius: 100%;
}

.slide-2 {
    background: linear-gradient(to bottom, rgb(0 0 0 / 18%), rgb(7 4 187 / 70%)),
        url(../images/2.jpeg);
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.slide-3 {
    background: linear-gradient(to bottom, rgba(0, 47, 75, 0.3), rgba(220, 66, 37, 0.77)), url(../images/3.jpeg);
    background-size: cover;
}

.promo {
    z-index: 5;
    text-align: center;
    color: white;
    text-decoration: none;
    padding: 0 10px;
}

.button-down,
.button-up {
    position: absolute;
    bottom: 40px;
    z-index: 20;
    width: 30px;
    height: 30px;
    margin: auto;
    left: 0;
    right: 0;
    opacity: 0.7;
    transition: ease 1s;
    animation: bouncey 1.6s linear infinite;
}

.button-down:hover,
.button-up:hover {
    opacity: 1
}

.button-down:before {
    transform: rotateZ(-45deg);
    content: '';
    width: 30px;
    height: 2px;
    background: #fff;
    position: absolute;
    bottom: 14px;
    left: 6px;
}

.button-down:after {
    transform: rotateZ(-45deg);
    content: '';
    width: 2px;
    height: 30px;
    background: #fff;
    position: absolute;
}

.button-up:before {
    transform: rotateZ(45deg);
    content: '';
    width: 30px;
    height: 2px;
    background: #fff;
    position: absolute;
    bottom: 14px;
    left: 6px;
}

.button-up:after {
    transform: rotateZ(45deg);
    content: '';
    width: 2px;
    height: 30px;
    background: #fff;
    position: absolute;
}


@media only screen and (max-width: 400px) {
    .slides {
        font-size: 2em;
    }
}

@keyframes bouncey {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    50% {
        -webkit-transform: translateY(5px);
        transform: translateY(5px);
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}