html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* Começo */
* {
    box-sizing: inherit;
}

:root{
  --start-position-bg: 0%;  
  --end-position-bg: 10000px -10000px;
}

@keyframes bgMovimento {
    from {background-position-x: var(--start-position-bg);}
    to {background-position: var(--end-position-bg);}
}

@keyframes navbarMovimento {
    to {
        transform: translateX(40px);
    }
}

html {
    height: 100%;
    box-sizing: border-box;
    background-image:
    repeating-conic-gradient(
      rgba(255,255,255,0.1) 0% 25%,
      rgba(0,0,0,0.1) 0% 50%);
    background-repeat: repeat;
    background-size: 15vw 15vw;
    background-position: 0% 0%; 
    animation: bgMovimento 550s linear infinite;
}

body {
    min-height: 100vh;
    height: 100%;
}

.content-wrapper {
    min-height: 100%;
    display: grid;
    grid-template-columns: auto 1fr 1fr auto;
    grid-template-rows: 45px 1fr 1fr auto;
    
}

header.geral-top {
    grid-area: 1/1/2/4;
    background: linear-gradient(to bottom, rgb(0, 0, 0, 50%) 0%, rgba(34, 32, 35, 0)90%);
}

footer.geral-bottom {
    grid-area: 4/1/4/4;
    background: linear-gradient(to top, rgb(0, 0, 0, 100) 55%, rgba(34, 32, 35, 0)100%);
    font-size: 1rem;
    color: white;
    padding: 20px 0 10px 0;
    text-align: center;
    align-content: center;
}

div.gradient-style-top {
    height: 45px;
    width: 100%;
}

div.gradient-style-bottom {
    height: 25px;
    width: 100%;
}

nav.menu-desktop {
    grid-area: 2/1/4/2;
    align-content: center;
    max-height: auto;
    max-width: 10%;
    min-width: fit-content;
}

nav.menu-desktop li a button {
    height: 24px;
    margin: 16px 0 0 0;
    border-radius: 0 15cm 15cm 0;
    background-color: #222034;
    border: none;
    width: 90%;
    padding: 0 80px 0 0px;

}

nav.menu-desktop li a button p{
    text-align: right;
    width: 200%;
    font-size: 1em;
    color: white;
}

nav.menu-desktop li a button:hover {
    width: 100%
}

main {
    margin-right: 10%;
    grid-area: 2/2/4/4;
    max-width: 100%;
    align-content: center;
    align-items: center;
}

div.manutencao{
    user-select: none;
    -webkit-user-drag: none;
    display: flex;
    flex-direction: column;
    max-height: fit-content;
    align-items: center;
    justify-content: center;
    margin-right: 10%;
}

div.manutencao p {
    text-align: center;
}

.someevolta {
    display:block;
    background-color:rgba(0, 0, 0, 0.356);
    width: auto;
    height: 100%;
}