@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Abel&display=swap');

body { margin: 0 auto; background-color: #FEFEFE; font-family: 'Abel', sans-serif; font-size: 18px; color: #0D0C12;}
body a:link { text-decoration: none; color: #0D0C12;}
body a:visited { color: #0D0C12;}
body a:hover { color: #0D0C12;}
body a:active { color: #0D0C12;}
body h1, h2, h3, h4, h5, h6 { font-weight: normal; margin: 0; line-height: 1.5;}
body img { border: 0;}
body input { font-family: 'Abel', sans-serif; font-size: 1em; color: #0D0C12; border: 0; outline: 0;}
body select { font-family: 'Abel', sans-serif; font-size: 1em; color: #0D0C12; border: 0; outline: 0;}
body textarea { font-family: 'Abel', sans-serif; font-size: 1em; color: #0D0C12; border: 0; outline: 0;}

body .sombra { -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);}
body .t7 { -webkit-transition: 0.7s ease-in; -moz-transition: 0.7s ease-in; -o-transition: 0.7s ease-in; transition: 0.7s ease-in;}
body .t4 { -webkit-transition: 0.4s ease-in; -moz-transition: 0.4s ease-in; -o-transition: 0.4s ease-in; transition: 0.4s ease-in;}

header { position: fixed; width: 90%; top: 0; left: 0; z-index: 20; padding: 15px 5% 10px; background: rgb(15,61,63); background: -moz-linear-gradient(0deg, rgba(15,61,63,1) 0%, rgba(10,48,50,1) 100%); background: -webkit-linear-gradient(0deg, rgba(15,61,63,1) 0%, rgba(10,48,50,1) 100%); background: linear-gradient(0deg, rgba(15,61,63,1) 0%, rgba(10,48,50,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#0f3d3f",endColorstr="#0a3032",GradientType=1);}

header .chave { position: absolute; width: 40px; height: 40px; top: 15px; left: 2%; z-index: 5; display: none;}
header .chave .ico { float: left; width: 40px; height: 40px; background-position: 50%; background-repeat: no-repeat;}
header .chave .ico.abre { background-image: url(../imagens/abre.png);}
header .chave .ico.fecha { background-image: url(../imagens/fecha.png); display: none;}

header .mim { float: left; opacity: 0;}

header .menu { float: right; margin: 8px 0 0;}
header .menu a { float: left; padding: 2px; text-transform: uppercase; font-size: 0.9em; color: #178A7C; border-bottom: 2px solid #0D393B;}
header .menu b { float: left; width: 1px; height: 14px; margin: 5px 20px 0; background-color: #178A7C;}
header .menu a.ativo { border-bottom: 2px solid #178A7C;}
header .menu a:hover { border-bottom: 2px solid #178A7C;}
header .menu a.api { padding: 0 10px; background-color: #33A458; color: #FFFFFF; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px;}

header.fixed { padding: 10px 5% 5px;}
header.fixed .mim { opacity: 1;}

footer { float: left; width: 100%; padding: 20px 0 15px; margin: 0; background: rgb(5,93,83); background: -moz-linear-gradient(90deg, rgba(5,93,83,1) 0%, rgba(2,60,53,1) 100%); background: -webkit-linear-gradient(90deg, rgba(5,93,83,1) 0%, rgba(2,60,53,1) 100%); background: linear-gradient(90deg, rgba(5,93,83,1) 0%, rgba(2,60,53,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#055d53",endColorstr="#023c35",GradientType=1);}
footer h4 { float: left; width: 100%; text-align: center; font-size: 0.9em; color: #FFFFFF;}

@media only screen and (max-width: 1000px){
     header { position: relative; width: 100%; padding: 0;}

     header .chave { top: 8px; display: block;}

     header .menu { float: left; width: 100%; margin: 0; background-color: #0C3031; border-top: 1px solid #051A1B; border-bottom: 1px solid #051A1B; display: none;}
     header .menu a { width: 100%; padding: 20px 0 15px; text-align: center; font-size: 1.1em; border-bottom: 0;}
     header .menu b { width: 100%; height: 1px; background-color: #051A1B; margin: 0;}
     header .menu a.ativo { border-bottom: 0;}
     header .menu a:hover{ border-bottom: 0;}
     header .menu a.api { padding: 5px 0; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}

     header .mim { width: 100%; text-align: center; display: none;}

     header.fixed { position: fixed; padding: 7px 0 1px;}
     header.fixed .mim { display: block;}
}