@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:400,700');

body { margin: 0 auto; background-color: rgb(245, 245, 245); font-family: 'Roboto Condensed', sans-serif; font-size: 15px; color: rgb(2, 4, 6);}
body a:link { text-decoration: none; color: rgb(2, 4, 6);}
body a:visited { color: rgb(2, 4, 6);}
body a:hover { color: rgb(2, 4, 6);}
body a:active { color: rgb(2, 4, 6);}
body h1, h2, h3, h4, h5, h6 { font-weight: normal; margin: 0; line-height: 1.2;}
body img { border: 0;}
body input { background-color: rgb(255, 255, 255); font-family: 'Roboto Condensed', sans-serif; font-size: 1em; color: rgb(2, 4, 6); border: 0; outline: 0;}
body select { background-color: rgb(255, 255, 255); font-family: 'Roboto Condensed', sans-serif; font-size: 1em; color: rgb(2, 4, 6); border: 0; outline: 0; cursor: pointer;}
body textarea { background-color: rgb(255, 255, 255); font-family: 'Roboto Condensed', sans-serif; font-size: 1em; color: rgb(2, 4, 6); border: 0; outline: 0;}

body .border { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
body .sombra { -webkit-box-shadow: 0 0 7px 0 rgb(0, 0, 0, 10%); -moz-box-shadow: 0 0 12px 0 rgb(0, 0, 0, 10%); box-shadow: 0 0 12px 0 rgb(0, 0, 0, 10%);}
body .tempo { -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: 100%; height: 50px; top: 0; left: 0; background-color: rgb(255, 255, 255); z-index: 20;}

header .chave { position: absolute; width: 40px; height: 40px; top: 7px; 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 .logo { float: left; width: 100%; margin: 5px 0 0; text-align: center;}

header .menu { position: absolute; top: 12px; left: 2%;}
header .menu em { float: left; width: 25px; height: 25px; margin: 0 10px 0 0; background-image: url(../imagens/casa.png); background-position: 0 100%; background-repeat: no-repeat;}
header .menu a { float: left; margin: 6px 0 0;}
header .menu b { float: left; width: 2px; height: 12px; margin: 9px 8px 0; background-color: rgb(100, 100, 100);}
header .menu a:hover { text-decoration: underline;}

header .aluno { position: absolute; top: 8px; right: 2%;}
header .aluno .foto { float: left; width: 35px;}
header .aluno .foto img { float: left; width: 35px; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px;}
header .aluno .detalhes { float: left; margin: 4px 0 0 5px; line-height: 1;}
header .aluno .detalhes b { color: rgb(2, 4, 6);}
header .aluno .detalhes a { color: rgb(100, 100, 100);}
header .aluno .detalhes a:hover { text-decoration: underline;}

footer { float: left; width: 100%; position: relative; z-index: 20;}
footer .copyright  { float: left; width: 90%; padding: 14px 5% 10px; background-color: rgb(64, 86, 95); text-align: center; font-size: 1em; color: rgb(184, 194, 202);}
footer .criacao { float: left; width: 100%; height: 35px; border-top: 1px solid rgb(52, 68, 74); background-color: rgb(64, 86, 95); background-image: url("../imagens/d10web.png"); background-position: 50% 100%; background-repeat: no-repeat;}
footer .criacao:hover { background-position: 50% 0;}

@media only screen and (max-width: 1000px){
  header { float: left; height: auto; position: relative;}
  header .chave { display: block;}

  header .logo { margin: 5px 0;}

  header .menu { float: left; width: 100%; display: none; position: relative; top: 0; left: 0;}
  header .menu em { position: absolute; top: 6px; left: 2%; margin: 0;}
  header .menu a { width: 50%; padding: 8px 0 6px; margin: 0; text-align: center; font-size: 1.2em; background: rgb(238,238,238); background: -moz-linear-gradient(90deg, rgba(238,238,238,1) 0%, rgba(221,221,221,1) 100%); background: -webkit-linear-gradient(90deg, rgba(238,238,238,1) 0%, rgba(221,221,221,1) 100%); background: linear-gradient(90deg, rgba(238,238,238,1) 0%, rgba(221,221,221,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#eeeeee",endColorstr="#dddddd",GradientType=1);}
  header .menu b { display: none;}
}