body{
background-color:#101412;
margin-left:200px;
margin-right:200px;
margin-top:100px;
margin-bottom:100px;
}
h1{
font-family: 'Allerta', sans-serif;
color:#03ce83;
font-size:50px;
text-shadow:0px 0px 10px #47ba80;
}

p1{
font-family: 'Allerta', sans-serif;
color:#03ce83;
font-size:25px;
text-shadow:0px 0px 10px #47ba80;
}

p1.artigo{
color:white;
font-size:17px;
font-family: 'Roboto', sans-serif;
text-shadow:0px 0px 2px white;
}
p1.branco{
color:white;
font-size:17px;
font-family: 'Roboto', sans-serif;
text-shadow:0px 0px 1px white;
}


p4{
font-family: 'Allerta', sans-serif;
color:#ba3b32;
font-size:25px;
}

p2{
font-family: 'Allerta', sans-serif;
color:#03ce83;
font-size:15px;
text-shadow:0px 0px 15px #47ba80;
opacity:10%
}
@keyframes logo{
0%{
color:white;
text-shadow:0px 0px 5px white;
}
50%{
color:#03ce83;
text-shadow:0px 0px 5px #03ce83;
}
100%{
color:white;
text-shadow:0px 0px 5px white;
}
}
p3{
font-family: 'Merriweather', serif;
color:white;
animation:logo 3s infinite;
}

hr{
color:#03ce83;
background-color:#03ce83;
box-shadow:0px 0px 5px #03ce83;
}

div.copyright{
position:absolute;
margin-right:-500px;
}
@keyframes aparece{
from{opacity:0%;}
to{opacity:100%;}
}
@keyframes desaparece{
from{opacity:100%;}
to{opacity:0%;}
}
.menu{
display:none;
transition:all 0.3s;
animation:aparece 2s;
}
.menu-regras{
display:none;
transition:all 0.3s;
animation:aparece 2s;
border:solid #03ce83 2px;
box-shadow:0px 0px 2px #03ce83;
padding:10px 10px;
}
button{
color:#03ce83;
font-family: 'Allerta', sans-serif;
background-color:#1b2b23;
border:#65dba0 2px solid;
font-size:20px;
padding:10px 10px;
cursor:pointer;
transition:all 0.5s;
}
button:hover{
color:#1b2b23;
font-family: 'Allerta', sans-serif;
background-color:#03ce83;
border:#65dba0 2px solid;
font-size:20px;
padding:10px 20px;
cursor:pointer;
transition:all 0.5s;
box-shadow:0px 0px 10px #65dba0;
text-shadow:0px 0px 5px #1b2b23;
}

img.home{
width:100px;
transition:all 1.5s;
cursor:pointer;
filter: grayscale(100%);
}

img.home:hover{
width:100px;
transition:all 0.5s;
cursor:pointer;
transform:matrix(0.53,0.73,-0.81,0.59,0,0);
-ms-transform:matrix(0.53,0.73,-0.81,0.59,0,0);
-webkit-transform:matrix(0.53,0.73,-0.81,0.59,0,0);
filter:drop-shadow(0px 0px 5px #65dba0)  grayscale(0%);
}

img.git{
border:#03ce83 solid 2px;
box-shadow:0px 0px 10px #47ba80;
}

img.icone{
margin-bottom:-11px;
margin-right:5px;
transition:all 0.5s;

}
img.kaler{
margin-bottom:-11px;
margin-right:15px;
filter:brightness(5%) drop-shadow(0px 0px 2px black);
transition:all 0.5s;
}
div.artigo{
color:#03ce83;
font-family: 'Allerta', sans-serif;
background-color:#1b2b23;
border:#65dba0 2px solid;
font-size:20px;
padding:10px 10px;
cursor:pointer;
transition:all 0.5s;
width:max-content;
}

div.artigo > p6{
bottom:5px;
position:relative;
}
div.artigo:hover{
color:#1b2b23;
font-family: 'Allerta', sans-serif;
background-color:#03ce83;
border:#65dba0 2px solid;
font-size:20px;
padding:10px 20px;
cursor:pointer;
transition:all 0.5s;
box-shadow:0px 0px 10px #65dba0;
text-shadow:0px 0px 5px #1b2b23;
width:max-content;
}
div.artigo:hover > img{
filter:drop-shadow(0px 0px 2px black) brightness(2%);
margin-left:-12px;
transition:all 0.5s;
}

a{
color:transparent;
transition:all 0.5s;
color:red;
text-shadow:0px 0px 1px red;
}
a:hover{
color:white;
background-color:red;
transition:all 0.5s;
cursor:pointer;
}

img.artigo{
border:solid 4px #03ce83;
display: block;
margin-left: auto;
margin-right: auto;
width: 50%;
box-shadow:#03ce83 0px 0px 10px;
border-radius:2%;
background-color:#333333;
}

video.artigo{
border:solid 4px #03ce83;
display: block;
margin-left: auto;
margin-right: auto;
width: 50%;
box-shadow:#03ce83 0px 0px 10px;
border-radius:2%;
background-color:#333333;
}

p4{
font-family: 'Allerta', sans-serif;
color:#03ce83;
font-size:25px;
text-shadow:0px 0px 10px #03ce83;
background-color:#1b2b23;
}
p5{
font-family: 'Allerta', sans-serif;
color:#1b2b23;
font-size:25px;
text-shadow:0px 0px 10px #03ce83;
background-color:#03ce83;
}

div.perfil{
background-color:#03ce83;
width:100%;
height:65%;
}
img.perfil{
position:center;
border-radius:55%;
margin-top:30px;
margin-bottom:30px;
margin-left:20px;
border:solid 2px black;
top:2px;
}

p1.perfil{
font-family: 'Allerta', sans-serif;
color:black;
font-size:25px;
text-shadow:0px 0px 3px black;
position:relative;
bottom:250px;
left:400px;
}
p1.perfil1{
font-family: 'Allerta', sans-serif;
color:black;
font-size:25px;
text-shadow:0px 0px 3px black;
}

hr.perfil{
color:black; 
background-color:black; 
border:none; height:5px; 
margin-left:5px; 
margin-right:5px;
}
div.perfilbotao{
color:#03ce83;
width:max-content;
font-family: 'Allerta', sans-serif;
background-color:black;
border:#03ce83 2px solid;
font-size:20px;
padding:10px 10px;
cursor:pointer;
transition:all 0.5s;
}

div.perfilbotao:hover{
color:black;
width:max-content;
font-family: 'Allerta', sans-serif;
background-color:#03ce83;
border:black 2px solid;
font-size:20px;
padding:10px 10px;
cursor:pointer;
transition:all 0.5s;
}

div.perfilbotao:hover > p1{
color:black;
transition:all 0.5s;
}

div.perfilbotao > p1 > img.bota{
width:40px;
position:relative;
bottom:-10px;
filter: drop-shadow(0px 0px 2px #03ce83);
}
div.perfilbotao > p1{
position:relative;
bottom:2px;
}

div.perfilbotao:hover > p1 > img.bota{
width:40px;
position:relative;
bottom:-10px;
filter: brightness(0%) drop-shadow(0px 0px 2px black);
transition:all 0.5s;
}

div.menuzin{
transition:all 1.5s;
animation:aparece 1s;
}
