* {
    scroll-behavior: smooth;
    margin: 0;
    padding: 0;
    --primary-color: #4717F6;
    --background-color: rgb(18, 18, 18);
    --text-color: rgb(215, 215, 215);
    --white-color: rgb(230, 230, 230);
}

html,
body {
    height: 100%;
}

body {

    background: url('https://b2btecnologia.io/assets-intranet/background.jpg') no-repeat;
    overflow-x: hidden;
    background-size: 100% 100%;
}

:focus-visible {
    outline: none;
}

::-webkit-scrollbar {
    width: 7px;
    scroll-behavior: smooth;
}

::-webkit-scrollbar-track {
    background: #353535;
    border-radius: 15px;
}

::-webkit-scrollbar-thumb {
    background: rgb(12, 12, 12);
    border-radius: 15px;
    border: 2px solid #353535;
}

#logo {
    width: 40px;
    filter: invert(20%);
    cursor: pointer;
}

#logout {
    filter: invert(80%);
    width: 30px;

}

header {
    padding: 10px 35px;
}


/* template; */
.manualicon {
    width: 40px;
    filter: invert(70%);
}

.manuaisbox {
    border-radius: 10px;
    border-bottom: 1px solid var(--white-color);
    margin: 30px;
}

.downloadicon,
.viewicon {
    width: 33px;
    margin: 0 10px;
    filter: invert(70%);
}

.manuaisbox {
    color: var(--text-color);
    padding: 10px 10px;
    width: 400px;
}

.manuaisbox span {
    margin: 0 30px;
    word-break: break-word;
}

/* main  */

#chipoustoretext {
    background: url("../../img/logo-letra.png") no-repeat;
    
    height: 73px;
    width: 300px;
    background-size: contain;


}

#mainbox {
    width: 90vw;
    position: relative;
    right: 0;
    transition: all 0.2s linear;
}

#manual-vector {
    background: url("../../img/manual-vector.png") no-repeat;
    height: 150px;
    width: 120px;
    filter: invert(60%);
    animation: papel 3s linear infinite;
    background-size: contain;
    cursor: pointer;

}

#secoundPageManual {
    position: absolute;
    /* left: 100vw; */
    top: -100vh;
    width: 100vw;
    transition: all 0.3s linear;
    overflow-y: scroll;
}

.home,
#secoundPageManual {
    height: 75vh;
}

/* main,
body {

    overflow-y: hidden;
} */
.videos {
    width: 120px;
    margin: 0 40px;
}

@keyframes papel {
    40% {
        filter: drop-shadow(0px 0px 10px #ffffff00)invert(60%);

    }

    50% {
        filter: drop-shadow(0px 0px 10px #ffff) invert(60%);
    }

    60% {
        filter: drop-shadow(0px 0px 10px #ffffff00) invert(60%);
    }
}

@media (max-width:800px) {
    #mainbox {
        flex-direction: column !important;
        align-items: center !important;
        justify-content: space-around !important;
    }
}