/*
css:versão 17/08/2022
Reset Stylesheet
03-08-2022
Author: Giovani T. Alves
Jomville/SC-Brasil
*/


/* para aumentar ou domiuir alargua d alamina  classe: bloco >> elemento>> width: */

html,
body,
a,
abbr,
acronym,
address,
applet,
big,
cite,
code,
center,
caption,
b,
blockquote,
div,
dfn,
del,
dl,
dt,
dd,
em,
font,
fieldset,
form,
h1,
h2,
h3,
h4,
h5,
h6,
iframe,
img,
ins,
label,
legend,
p,
pre,
span,
object,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
u,
i,
ol,
ul,
li,
table,
tbody,
tfoot,
thead,
tr,
th,
td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

main,
article,
aside,
figure,
footer,
header,
nav,
section,
details,
summary {
    display: block;
}

@font-face {
    font-family: Montserrat-ExtraBold;
    src: url('Montserrat-ExtraBold.ttf');
}

@font-face {
    font-family: Montserrat-Regular;
    src: url('Montserrat-Regular.ttf');
}

*,
*:before,
*:after {
    box-sizing: inherit;
}

img,
object,
embed {
    max-width: 100%;
}

html,
body {
    background-color: rgb(255, 255, 255);
    width: 100%;
    height: auto;
    left: 0;
    top: 0;
    margin: 0;
    box-sizing: border-box;
}

img {
    margin: 0;
    left: 0;
    top: 0;
    padding: 0;
    box-sizing: border-box;
    /* retira os espaços entre as imagens */
    border-bottom: 0px solid rgb(155, 158, 162);
    display: block;
    /* retira o espço entre as imagens */
}

.bloco {
    background-color: rgb(255, 255, 255, 0.0);
    left: 0;
    margin: 0;
    width: 70%;
    /* Determnia a largura da lamina em porcentage ou Pix */
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    /* Firefox */
    -webkit-box-sizing: border-box;
    /* Safari */
    display: block;
    margin-top: 0px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
}

.conteudo {
    background-color: rgba(0, 0, 0, 0.0);
    color: rgba(255, 255, 255, 0.0);
    position: absolute;
    width: 100%;
    height: 100%;
    padding: 20%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    /* Firefox */
    -webkit-box-sizing: border-box;
    /* Safari */
    font-family: Helvetica, sans-serif;
    font-family: 'Montserrat-ExtraBold', sans-serif;
    font-weight: 800;
    transition: all 0.4s ease-out;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    font-size: calc(16px + (16 - 16) * ((100vw - 300px) / (1600 - 300)));
    /* font-size: calc([minimum size] + ([maximum size] - [minimum size]) * ((100vw - [minimum viewport width]) / ([maximum viewport width] - [minimum viewport width]))); */
}

.conteudo:hover {
    background-color: rgb(13, 13, 13, 0.0);
    transition: all 0.4s ease-out;
    color: rgb(0, 204, 0, 0.0);
}

#desktop {
    display: block;
}

#mobile {
    display: none;
}

@media only screen and (max-width:990px) {
    .bloco {
        width: 100%;
        left: 0;
    }
    #desktop {
        display: none;
    }
    #mobile {
        display: block;
    }
}

#slider-desktop {
    display: none;
    opacity: 1.0;
    -webkit-animation: mymove-desktop 14s infinite;
    -moz-animation: mymove-desktop 14s infinite;
    -o-animation: mymove-desktop 14s infinite;
    animation: mymove-desktop 14s infinite;
    box-sizing: border-box;
    background-repeat: no-repeat;
    border-style: solid;
    border-width: 0px;
    border-color: rgb(180, 243, 9);
    display: none;
}

#slider-desktop:hover {
    animation-play-state: paused;
    cursor: grabbing;
    border-width: 0px;
    display: none;
}

#slider-mobile {
    display: none;
    display: none;
    -webkit-animation: mymove-mobile 9s infinite;
    -moz-animation: mymove-mobile 9s infinite;
    -o-animation: mymove-mobile 9s infinite;
    animation: mymove-mobile 9s infinite;
    background-size: 50%;
    display: none;
}

#slider-mobile:hover {
    animation-play-state: paused;
    cursor: grabbing;
    display: none;
}

@-moz-keyframes mymove-desktop {
    0% {
        background: url(1.webp);
        background-size: 100%;
    }
    10% {
        background: url(2.webp);
        background-size: 100%;
    }
    25% {
        background: url(3.webp);
        background-size: 100%;
    }
    50% {
        background: url(4.webp);
        background-size: 100%;
    }
    75% {
        background: url(5.webp);
        background-size: 100%;
    }
    100% {
        background: url(1.webp);
        background-size: 100%;
    }
}

@-ms-keyframes mymove-desktop {
    0% {
        background: url(1.webp);
        background-size: 100%;
    }
    10% {
        background: url(2.webp);
        background-size: 100%;
    }
    25% {
        background: url(3.webp);
        background-size: 100%;
    }
    50% {
        background: url(4.webp);
        background-size: 100%;
    }
    75% {
        background: url(5.webp);
        background-size: 100%;
    }
    100% {
        background: url(1.webp);
        background-size: 100%;
    }
}

@-o-keyframes mymove-desktop {
    0% {
        background: url(1.webp);
        background-size: 100%;
    }
    10% {
        background: url(2.webp);
        background-size: 100%;
    }
    25% {
        background: url(3.webp);
        background-size: 100%;
    }
    50% {
        background: url(4.webp);
        background-size: 100%;
    }
    75% {
        background: url(5.webp);
        background-size: 100%;
    }
    100% {
        background: url(1.webp);
        background-size: 100%;
    }
}

@keyframes mymove-desktop {
    0% {
        background: url(1.webp);
        background-size: 100%;
    }
    10% {
        background: url(2.webp);
        background-size: 100%;
    }
    25% {
        background: url(3.webp);
        background-size: 100%;
    }
    50% {
        background: url(4.webp);
        background-size: 100%;
    }
    75% {
        background: url(5.webp);
        background-size: 100%;
    }
    100% {
        background: url(1.webp);
        background-size: 100%;
    }
}

@-moz-keyframes mymove-mobile {
    0% {
        background: url(1m.webp);
        background-size: 100%;
    }
    10% {
        background: url(2m.webp);
        background-size: 100%;
    }
    25% {
        background: url(3m.webp);
        background-size: 100%;
    }
    50% {
        background: url(4m.webp);
        background-size: 100%;
    }
    75% {
        background: url(5m.webp);
        background-size: 100%;
    }
    100% {
        background: url(1m.webp);
        background-size: 100%;
    }
}

@-ms-keyframes mymove-mobile {
    0% {
        background: url(1m.webp);
        background-size: 100%;
    }
    10% {
        background: url(2m.webp);
        background-size: 100%;
    }
    25% {
        background: url(3m.webp);
        background-size: 100%;
    }
    50% {
        background: url(4m.webp);
        background-size: 100%;
    }
    75% {
        background: url(5m.webp);
        background-size: 100%;
    }
    100% {
        background: url(1m.webp);
        background-size: 100%;
    }
}

@-o-keyframes mymove-mobile {
    0% {
        background: url(1m.webp);
        background-size: 100%;
    }
    10% {
        background: url(2m.webp);
        background-size: 100%;
    }
    25% {
        background: url(3m.webp);
        background-size: 100%;
    }
    50% {
        background: url(4m.webp);
        background-size: 100%;
    }
    75% {
        background: url(5m.webp);
        background-size: 100%;
    }
    100% {
        background: url(1m.webp);
        background-size: 100%;
    }
}

@keyframes mymove-mobile {
    0% {
        background: url(1m.webp);
        background-size: 100%;
    }
    10% {
        background: url(2m.webp);
        background-size: 100%;
    }
    25% {
        background: url(3m.webp);
        background-size: 100%;
    }
    50% {
        background: url(4m.webp);
        background-size: 100%;
    }
    75% {
        background: url(5m.webp);
        background-size: 100%;
    }
    100% {
        background: url(1m.webp);
        background-size: 100%;
    }
}

@media only screen and (max-width:990px) {
    #slider-desktop {
        display: none;
    }
    #slider-mobile {
        display: block;
    }
}

@keyframes color {
    0% {
        background-position: 0%;
    }
    50% {
        background-position: 100%;
    }
    100% {
        background-position: 0%;
    }
}

#rgb {
    font-family: 'Montserrat', sans-serif;
    font-family: Helvetica, sans-serif;
    font-weight: 800;
    color: transparent;
    background: linear-gradient( to left, #f6051d, #ff7c01, #fcda00, #06f351, #0090fd, #b006e4, #f104be, #f10606, #ff7c01, #ffdd01);
    background-clip: text;
    background-size: 400%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation-direction: alternate-reverse;
    -webkit-animation-direction: alternate-reverse;
    -webkit-animation: color 6s linear infinite;
    animation: color 6s linear infinite;
    animation: color 6s linear infinite;
    background-size: 400%;
    filter: blur(0.0px);
}

@-webkit-keyframes color {
    0% {
        background-position: 0%;
    }
    50% {
        background-position: 100%;
    }
    100% {
        background-position: 0%;
    }
}