/* ===== reset ===== */
* {margin: 0; padding: 0; font-size: 100%; border: none; outline: none; font-weight: 300; box-sizing: border-box; font-family: 'Roboto', sans-serif;}
body {background-color: #f5f1f1;}
a {text-decoration: none;}
ul {list-style: none;}
img{max-width: 100%;}

/* ==== cabecalho ==== */
.cabecalho {width: 100%; float: left; padding: 3% 4%;}
.logo {width: 117px; height: 56px; float: left; background: url(../img/logo.png) center center/117px no-repeat; font-size: 0;}
/*.logo {width: 56px; height: 56px; float: left; background: url(../img/mobile.png) center center/56px no-repeat; font-size: 0;}*/
.btn-menu{width: 56px; height: 56px; float: right; text-align: center; color: #fff; border-radius: 56px; cursor: pointer; background: linear-gradient(to right,#150958,#00487a);}
.btn-menu:hover{color: #00c0ff;}

/* ==== menu ==== */
.menu {display: none; width: 100%; height: 100%; position: fixed; background: linear-gradient(to right,#150958,#00487a); top: 0; left: 0; z-index: 100;}
.btn-close {font-size: 1.5em; color: #fff; float: right; cursor: pointer; margin: 2% 4% 2% 2%;}
.btn-close:hover{color: #00c0ff;}
.menu ul {width: 100%; float: left; text-align: left;}
.menu li {padding: 2.5%;}
.menu li a {font-size: 1.0em; color: #fff; padding: 1.5% 10%; font-weight: 700}
.menu li a:hover {color: #00c0ff;}
.submenu {width: 100%; float: left; text-align: left; padding: 0 0 0 4%;}
.submenu td{padding: 1.5% 1%;}
.submenu a {font-size: 0.8em; color: #fff; padding: 1.5% 15%;}
.submenu a:hover {color: #00c0ff;}

/* ==== BANNER ROTATIVO ==== */
.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  z-index: 1;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }

/* ==== lightbox ==== */
.fundobox {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #000000; opacity:.0; -moz-opacity:.0; filter:alpha(opacity=0); z-index:100; display: none;}
.box {position: absolute; top: 20%; left: 30%; width: 500px; height: 500px; background-color: #ffffff; z-index:101; padding: 14px; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius: 4px; box-shadow: 2px 2px 2px #333333; -moz-box-shadow: 2px 2px 2px #333333; -webkit-box-shadow: 2px 2px 2px #333333; display: none;}
.closebox {float: right; margin-right: 10px; cursor: pointer;}

/* ==== conteudo ==== */
.categoria{width: 100%; float: left; padding: 4% 0% 0% 4%; font-size: 1.0em; color: #150958;}
.servicos {width: 100%; float: left; padding: 3% 4%;}
.servico {width: 100%; background: #fff; text-align: left; border-radius: 7px; margin-bottom: 3%;}
.servico img {border-radius: 7px 7px 0 0;}
.inner {padding: 7%;}
.inner a {font-size: 1.4em; color: #150958; font-weight: 900;}
.inner h4 {font-size: 1.1em; color: #130400; margin-top: 2%;}
.inner p {font-size: 0.9em; color: #000000; margin-top: 0%; line-height: 1.2em; text-align: justify;}
.inner h1 {font-size: 1.0em; color: #150958; font-weight: 900; margin-top: 0%; line-height: 0em;}
.inner h2 {font-size: 0.9em; color: #000000; margin-top: 0%; line-height: 0em;}
.sub {display: none; width: 100%; background: #fff; text-align: left; border-radius: 7px; padding: 7%;}
.sub a {font-size: 0.8em; color: #150958; padding: 0; line-height: 2.0em;}
.sub a:hover {color: #00c0ff;}

/* ==== conteudo empresa==== */
.empresa {width: 100%; background: #fff; text-align: left; border-radius: 7px; margin-bottom: 3%;}
.empresa img {border-radius: 7px 7px 0 0; margin: 0;}
.inempresa {padding: 15px;}
.inempresa h1 {font-size: 1.0em; color: #150958; font-weight: 900; margin-top: 0%; line-height: 1.5em;}
.inempresa p{font-size: 0.9em; color: #000000; margin-top: 0%; line-height: 1.2em; text-align: justify;}
.horario {width: 100%; background: #fff; text-align: center; border-radius: 7px; padding: 0;}
.horario i {font-size: 5.0em; color: #bdbdbd; margin-top: 0%; line-height: 1.3em;}
.horario h1 {font-size: 1em; color: #150958; font-weight: 900; margin-top: 0%; line-height: 1.3em;}
.horario p {font-size: 0.9em; color: #150958; margin-top: 0%; line-height: 1.1em;}
.cartao i {font-size: 1.8em; color: #a7a7a7; margin-top: 0%; line-height: 1em;}

/* ==== conteudo local==== */
.local {width: 100%; background: #fff; text-align: left; border-radius: 7px; margin-bottom: 3%;}
.local img {border-radius: 7px 7px 0 0;}
.inlocal {padding: 15px;}
.inlocal h1 {font-size: 1.0em; color: #150958; font-weight: 900; margin-top: 0%; line-height: 1.5em;}
.inlocal p {font-size: 0.9em; color: #000000; margin-top: 0%; line-height: 1.2em; text-align: justify;}


/* ==== formulario ==== */
.formulario {width: 100%;}
.formulario h4 {font-size: 1.4em; color: #150958; font-weight: 900;}
.formulario  input {border: 1px solid rgba(0,0,0,0.2); padding: 5px 5px; margin-top: 10px;}
.formulario  select {border: 1px solid rgba(0,0,0,0.2); padding: 5px 5px; margin-top: 10px;}
.formulario  textarea {border: 1px solid rgba(0,0,0,0.2); padding: 5px 5px; margin-top: 10px;}
.botao {cursor: pointer; padding: 8px;}

/* ==== newsletter ==== */
.newsletter {width: 100%; float: left; text-align: center; padding: 3% 4%; background-color: #000000;}
.newsletter h2 {font-size: 1.4em; color:#fff; font-weight: 900;}
.newsletter h3 {color: #fff;}
.newsletter form {margin-top: 2%;}
.newsletter input {width: 100%; background-color: #000000; color: #fff; border: 1px solid rgba(255,255,255,0.3); padding: 5%; border-radius: 5px;}
.newsletter button {width: 100%; background-color: #fff; color: #000000; padding: 5%; border-radius: 5px; cursor: pointer; margin-top: 2%;}

/* ==== rodape ==== */
.rodape {width: 100%; float: left; padding: 3% 4%; text-align: center; background: linear-gradient(to right,#150958,#00487a);}
.social-icons a {font-size: 1.5em; color: rgba(255,255,255,0.7); margin-right: 3%;}
.social-icons a:last-child{margin-right: 0;}
.social-icons a:hover{color: rgb(255,255,255);}
.copyright {font-size: 0.80em; margin-top: 2%; margin-bottom: 2%; color: rgba(255,255,255,0.7);}

/* ==== MOBILE FIRST ==== */
/* Smartphone */
@media screen and (min-width: 480px){
}
/* tablet */
@media screen and (min-width: 500px){
.servico {width: 49%; float: left; margin-right: 2%;}
.servico:nth-child(1){width: 0; margin-right: 0;}
.servico:nth-child(3){margin-right: 0;}
.servico:nth-child(5){margin-right: 0;}
.servico:nth-child(7){margin-right: 0;}
.servico:nth-child(9){margin-right: 0;}
.servico:nth-child(11){margin-right: 0;}
.servico:nth-child(13){margin-right: 0;}
.servico:nth-child(15){margin-right: 0;}
.rodape {padding: 1% 4%;}
}

/* Smartphone */
@media screen and (min-width: 620px){
.empresa {width: 49%; float: left; margin-right: 0;}
.empresa:nth-child(2){width: 65%; margin-right: 2%;}
.empresa:nth-child(3){width: 33%; margin-right: 0;}
}

/* tablet */
@media screen and (min-width: 800px){
.servico {width: 32%;}
.servico:nth-child(2){margin-right: 2%;}
.servico:nth-child(3){margin-right: 2%;}
.servico:nth-child(4){margin-right: 0;}
.servico:nth-child(5){margin-right: 2%;}
.servico:nth-child(8){margin-right: 2%;}
.servico:nth-child(9){margin-right: 2%;}
.servico:nth-child(10){margin-right: 0;}
.servico:nth-child(11){margin-right: 2%;}
.rodape {padding: 1% 4%;}

.empresa {width: 65%; float: left; margin-right: 2%;}
.empresa:nth-child(2){width: 65%; margin-right: 2%;}
.empresa:nth-child(3){width: 33%; margin-right: 0;}
}

/* wide screen */
@media screen and (min-width: 1000px){
.tudo {width: 1000px; margin:0 auto;}
.cabecalho {padding: 15px 15px 15px 20px;}
.categoria{padding: 15px 0 0 15px;}
.servicos {padding: 15px 0 0 0;}
.rodape {padding: 0%;}
.copyright {margin-top: 20px; margin-bottom: 20px;}

.servico {width: 23.5%; float: left; margin-right: 2%;}
.servico:nth-child(1){width: 23.5%; margin-right: 2%;}
.servico:nth-child(3){margin-right: 2%;}
.servico:nth-child(4){margin-right: 0;}
.servico:nth-child(6){margin-right: 2%;}
.servico:nth-child(7){margin-right: 0;}
.servico:nth-child(8){margin-left: 25.5%; margin-right: 2%;}
.servico:nth-child(9){margin-right: 2%;}
.servico:nth-child(10){margin-right: 0;}
.servico:nth-child(11){margin-left: 25.5%; margin-right: 2%;}
.servico:nth-child(12){margin-right: 2%;}
.servico:nth-child(13){margin-right: 0;}
.servico:nth-child(14){margin-left: 25.5%; margin-right: 2%;}

.empresa {width: 49%; float: left; margin-right: 2%;}
.empresa:nth-child(1){width: 23.5%; margin-right: 2%;}
.empresa:nth-child(2){width: 49%; margin-right: 2%;}
.empresa:nth-child(3){width: 23.5%; margin-right: 0;}

.btn-menu {display:none;}
.btn-close {display:none;}
.sub {display:block;}
.sub i{display:none;}
.menu {width: auto; height: 56px; line-height: 56px; float: right; background: #f5f1f1; display: block !important; position: static;}
.menu li {padding: 0; float: left;}
.menu li a {color: #150958; font-size: 1em; padding: 15px;}
.submenu {display:none;}

.rslides img{width: auto; height: 300px; border-radius: 7px;}

}