@font-face {
  font-family: museo;
  src: url(../fonts/Museo300-Regular.otf);
}

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

/*=========== CONTAINER ==========*/
.body-header{background: url(../img/bg-header.jpg)repeat-x;}
.container {width: 100%; float: left; padding: 3% 4%; text-align: center;}
.container-linha {width: 100%; float: left; padding: 1% 0%; text-align: center;}
.container-header {width: 100%; float: left; padding: 0% 0%; text-align: center;}
.container-nav {width: 100%; float: left; padding: 3% 10% 0% 10%; text-align: center;}
.container-banner {width: 100%; float: left; padding: 25% 2% 10% 2%; text-align: center;}
.container-about {width: 100%; float: left; padding: 10% 2%; text-align: center;}
.container-servicos {width: 100%; float: left; padding: 2% 2%; text-align: center;}
.container-top {width: 100%; float: left; padding: 0% 0%; text-align: center;background-color: #263A7F;}
.container-depoiment {width: 100%; float: left; padding: 4% 2%; text-align: center;}
/*=========== BG COLORS ==========*/
.bg-gradient {background: linear-gradient(to top,#263575,#0080FF);}
.bg-black {background-color: #ccc; }
.bg-white {background-color: #fff;}
.bg-blue {background-color: #293176;}
.bg-orange {background: linear-gradient(to left,#FFA701,#DE8301);}
.bg-location {background: url(../img/bg-white.jpg)no-repeat;}
.bg-cinza {background-color: #CCCCCC;}

/*=========== HELPERS ==========*/
.radius {border-radius: 30px;}
.btn-top{padding: 8px;background: linear-gradient(to left,#87116A,#FF007F);}
.sombra{-webkit-box-shadow: 0px 0px 40px -5px rgba(56,56,56,0.83);
    -moz-box-shadow: 0px 0px 40px -5px rgba(56,56,56,0.83);}
/* CABEÇALHO */

.top {position:;background-color:#;z-index:4;}
header {position:;background-color:#;z-index:4; }
.logo {width: 400px; height: 200px; float: left; background: url(../img/logo-mobile.png) center center/250px no-repeat;
font-size: 0;}
.btn-menu {width: 56px; height: 56px; float: right; text-align: center; color: #000; background-color:;  cursor: pointer;}
/* MENU */
.menu {display:none; width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 4; background-color: rgba(0,0,0,0.9);}
.btn-close {font-size: 1.5em; color: #fff; float: right; cursor: pointer; margin: 2% 3% 0 0;}
.menu ul {width: 100%; float: left; text-align: center;}
.menu li {padding: 1.5%;}
.menu li a {font-size: 1.2em; color: #fff; padding: 1.5% 3%; font-weight: 300;}
.menu li a:hover {border:1px solid #da6709;}
/* BANNER */
.banner {background: url(../img/bg.jpg) no-repeat fixed; margin-top:4%;}


.buttons {width: 100%; margin-top: 2%;}
.buttons i {float: right;}

.livros {width: 100%; margin-top: 1%;}
.livros i {float: left;}



.title-left {width: 100%;}
.title-left h2 {font-size: 0.8em; color: #fff; font-weight: 300;}


.title {width: 100%;}
.title h2 {font-size: 1.2em; color: #fff; font-weight: 700;}
.title h3 {font-size: 1.1em; color: #fff;}

.title-about {width: 100%;}
.title-about h2 {font-size: 1.5em; color:#293176; font-weight: 700;}
.title-about h3 {font-size: 1em; font-weight:bold; color: #293176;} 

.title-depoiment {width: 100%;}
.title-depoiment h2 {font-size: 1.5em; color: #fff; font-weight: 700;}
.title-depoiment h3 {font-size: 1.2em; font-weight: 500; color: #fff;}  
    
.btn {width: 100%; font-size: 1em; font-weight: 500; text-align: center; cursor: pointer; padding: 5%; background-color: #FFF;}
.btn-saiba {width: 60%; border:1px solid #fff; color:; margin-top: 2%;}
.btn-saiba:hover { border:1px solid #3D61A8; color:#fff; background-color: #3D61A8;} 

.btn-two {width: 100%; font-size: 1em; font-weight: 500; text-align: center; cursor: pointer; padding: 3%; }
.btn-orcamento {width:60%; border:2px solid #000; color:#; background-color: #fff; margin-top: 3%;} 
.btn-orcamento:hover { border:2px solid #3D61A8; color:#fff; background-color: #3D61A8;} 

.btn-serv {width: 100%; font-size: 1.0em;font-weight: 300; text-align: center; cursor: pointer; padding: 3%; }
.btn-servico {width: 60%; border:1px solid #000; color:; margin-top: 3%; background-color: #fff;} 
.btn-servico:hover { border:1px solid #3D61A8; color:#fff; background-color: #3D61A8;} 

.btn-depo {width: 100%; font-size: 1.2em;font-weight: 500; text-align: center; cursor: pointer; padding: 3%; }
.btn-depoiment {width: 60%; border:1px solid #000; color:; margin-top: 3%; background-color: #fff;} 
.btn-depoiment:hover { border:1px solid #3D61A8; color:#fff; background-color: #3D61A8;} 

/* SERVIÇOS */
.servico {width: 100%;  text-align: center;  margin-bottom: 3%; border-radius: 7px ;}
.servico img {border-radius: 7px 7px 0 0; text-align: center;}

.inner {padding: 7%;}
.inner a {font-size: 1.2em; color: #130400; font-weight: 700; text-align: center;}
.inner h4 {font-size: 1.2em; color: #130400; margin-top: 2%; }
.inner p {margin-top: 6%; color: #130400; line-height: 1.5em;text-align: center;}


.rdp {width: 100%;  text-align: left;  margin-bottom: 3%;}
.rdp img {border-radius: 7px 7px 0 0; text-align: center;}

.inner-rdp {padding: 7%;}
.inner-rdp a { font-size: 1.0em; color: #000;line-height: 1.7em; font-weight: 700; text-align: left;}
.inner-rdp a:hover {  color: #3D61A8;}
.inner-rdp h4 {font-size: 1.2em; color: #000; margin-top: 2%; margin-bottom: 6%; }
.inner-rdp p {margin-top: 6%; color: #000; line-height: 1.5em;text-align: left;}



/* NEWSLETTER */
.newsletter h2 {font-size: 1.5em; color: #fff; font-weight: 700;}
.newsletter h3 {color: #fff;}
.newsletter form {margin-top: 2%;}
.newsletter input {width: 100%;  color: #fff; border: 1px solid rgba(255,255,255,0.3); padding: 5%; }
.newsletter button {width: 100%;  color:#130400; padding: 5%; cursor: pointer; margin-top: 2%; }
/* RODAPÉ */
.social-icons a {font-size: 1.5em; color: rgba(0,0,0,0.7); margin-right: 3%;}
.social-icons a:last-child {margin-right: 0;}
.social-icons a:hover {color: rgb(61,97,168);}
.copyright {color: #000; margin-top:1%;}
.copyright a{text-decoration: none;color: #000;}

.embed-container { position: relative; padding-bottom:0%; height:0; overflow: hidden; max-width: 100%; height:250px;margin-top: 10px;margin-bottom:0; } 
.embed-container iframe, .embed-container object, .embed-container embed {position: absolute; top: 0; left: 0; width: 100%; height:250px;}



/* ========== MOBILE FIRST ==========*/
/* SMALL DEVICES - SMARTPHONES */
@media screen and (min-width: 480px) {
.logo {width: 340px; background: url(../img/logo.png) center center/350px no-repeat;}
.btn {font-size: 1em;}
    
 
}
/* SMALL DEVICES - TABLETS*/
@media screen and (min-width: 768px) {
.servico {width: 49%; float: left; margin-right: 2%;}
.servico:nth-child(2){margin-right: 0;}
    
.rdp {width: 49%; float: left; margin-right: 2%;}
.rdp:nth-child(2){margin-right: 0;}
    
.newsletter h2 {font-size: 2em;}
.newsletter h3 {font-size: 1.3em;}
.newsletter input {width: 70%; padding: 2%; float: left; margin-right: 1%;}
.newsletter button {width: 29%; padding: 2%; float: right; margin-top: 0;}
    
    
 
}


/* MEDIUM DEVICES - TABLETS & DESKTOPS*/
@media screen and (min-width: 960px) {
  .livro {width: 280px; height:280px; float: right; background: url(../img/livros.png) center center/280px no-repeat;
}     

.btn-menu {display: none;}
.btn-close {display: none;}
.menu {width: auto; height: 80px; line-height: 80px; float: right; background-color: ; 
display: block !important; position: static;}
.menu li {padding: 0; float: left;}
.menu li a {color:#130400; font-size: 0.7em; padding: 28px 15px; }
.menu li a:hover {border:none;  color:#263A7F;  }
   
    
    
 .body-header{background: url(../img/bg-header-hd.jpg)repeat-x;}   
.container {width: 100%; float: left; padding: 5% 4%; text-align: center;}

.container-header {width: 100%; float: left; padding: 0% 0%; text-align: center;}
.container-nav {width: 100%; float: left; padding: 2% 10% 0% 10%; text-align: center;}    
    
.container-banner {width: 100%; float: left; padding: 10% 10% 7% 10%; text-align: center;}
.container-about {width: 100%; float: left; padding: 3% 10%; text-align: center;}
.container-servicos {width: 100%; float: left; padding: 3% 10%; text-align: center;}
.container-top {width: 100%; float: left; padding: 0.5% 10%; text-align: center;background-color: #263A7F;}    
.container-depoiment {width: 100%; float: left; padding: 2% 10%; text-align: center;}    
    
    
.title {width: 100%; float: left; text-align: left;}
.title h2 {font-size: 1.5em;}
.title h3 {font-size: 1em;font-weight: 500;}
    
.title-left{width: 100%; float: left; text-align: left;}
.title-left h2 {font-size: 0.8em;font-weight: 300;}
 
    

    
.title-about {width: 50%; float: left; text-align: left;}
.title-about h2 {font-size: 1.5em;}
.title-about h3 {font-size: 1em; font-weight:bold;} 
    
.title-depoiment {width: 70%; float: left; text-align: left;}
.title-depoiment h2 {font-size: 1.5em;}
.title-depoiment h3 {font-size: 1.2em; font-weight: 500;}  
    
   
    
    
.btn {width: 100%; font-size: 1.0em; text-align: center; cursor: pointer; padding: 2%;background-color: #FFF; }
.btn-saiba {width: 20%; border:2px solid #fff; color:; margin-top: 3%;}
.btn-saiba:hover { border:2px solid #3D61A8; color:#fff; background-color: #3D61A8;}
    
.btn-two {width: 100%; font-size: 1.0em;font-weight: 500; text-align: center; cursor: pointer; padding: 3%; }
.btn-orcamento {width: 40%; border:2px solid #000; color:; margin-top: 3%;}
.btn-orcamento:hover { border:2px solid #3D61A8; color:#fff; background-color: #3D61A8;}
    
.btn-serv {width: 100%; font-size: 1.0em;font-weight: 300; text-align: center; cursor: pointer; padding: 3%; }
.btn-servico {width: 40%; border:1px solid #000; color:; margin-top: 3%; background-color: #fff;} 
.btn-servico:hover { border:1px solid #3D61A8; color:#fff; background-color: #3D61A8;} 
    
.btn-depo {width: 100%; font-size: 0.7em;font-weight:500; text-align: center; cursor: pointer; padding: 3%; }
.btn-depoiment {width: 100%; border:1px solid #000; color:; margin-top: 3%; background-color: #fff;} 
.btn-depoiment:hover { border:1px solid #3D61A8; color:#fff; background-color: #3D61A8;} 
    
  .livros{width: 30%; float:right; margin-top: -15%; padding-right: 15%;}  
.buttons {width: 30%; float:right; margin-top: 0%; }

    
.servico {width: 23.5%; }
.servico:nth-child(2){margin-right: 2%;}
.servico:nth-child(3){margin-right: 2%;}
.servico:nth-child(4){margin-right: 0%;}   

    
    
.rdp {width: 23.5%; }
.rdp:nth-child(2){margin-right: 2%;}
.rdp:nth-child(3){margin-right: 2%;}
.rdp:nth-child(4){margin-right: 0;}   
    
    
.newsletter input {width: 60%; float: none;}
.newsletter button {width: 20%; float: none;}
       
.embed-container { position: relative; padding-bottom:0; height: auto; overflow: hidden; max-width: 100%;height:420px;margin-top: 5%;margin-bottom:0; } 
.embed-container iframe, .embed-container object, .embed-container embed {position: absolute; top: 0; left: 0; width: 100%; height:315px;}  
    
    
    
}



/* LARGE DEVICES - WIDE SCREENS <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< */
@media screen and (min-width: 1280px) 
{
    
.logo {width: 240px;  height: 140px;background: url(../img/logo.png) center center/250px no-repeat;} 
    
.body-header{background: url(../img/bg-header-hd.jpg)repeat-x;}
    
.container {width: 100%; float: left; padding: 0% 4%; text-align: center;}
.container-model {width: 100%; float: left; padding: 1% 4% 2% 4%; text-align: center;}
.container-header {width: 100%; float: left; padding: 0% 0%; text-align: center;}
.container-nav {width: 100%; float: left; padding: 0% 15% 0% 15%; text-align: center;}
.container-banner {width: 100%; float: left; padding: 1% 17% 1% 17%; text-align: center;}
.container-about {width: 100%; float: left; padding: 2% 20% 3% 20%; text-align: center;}
.container-servicos {width: 100%; float: left; padding: 0% 20%; text-align: center;}
.container-top {width: 100%; float: left; padding: 0.5% 20%; text-align: center;background-color: #263A7F;}     
.container-depoiment {width: 100%; float: left; padding:4% 20% 4% 20%; text-align: center;}  
 .livro {width: 180px; height:180px; float: right; background: url(../img/livros.png) center center/180px no-repeat;
}   
    
    
.btn-menu {display: none;}
.btn-close {display: none;}
.menu {width: auto; height: 80px; line-height: 150px; float: right; background-color:rgba(0,0,0,0.0); 
display: block !important; position: static;}
.menu li {padding: 0; float: left;}
.menu li a {color:#171F6B; font-size: 1.0em; padding: 2px 20px; }
.menu li a:hover { color:#2DB200;  }
 
}





/* LARGE DEVICES - FULL WIDE SCREENS <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/ 
@media screen and (min-width: 1400px)
{
  
.logo {width: 340px; height: 160px; background: url(../img/logo.png) center center/350px no-repeat;}    
    
    
 .livro {width: 280px; height:280px; float: right; background: url(../img/livros.png) center center/280px no-repeat;}   
.body-header{background: url(../img/bg-header.jpg)repeat-x;}    
.container {width: 100%; float: left; padding: 3% 4%; text-align: center;}
.container-model {width: 100%; float: left; padding: 1% 4% 2% 4%; text-align: center;}
.container-header {width: 100%; float: left; padding: 0% 0%; text-align: center;}
.container-nav {width: 100%; float: left; padding: 0% 20% 0% 20%; text-align: center;}
.container-banner {width: 100%; float: left; padding: 3% 15% 1% 15%; text-align: center;}
.container-about {width: 100%; float: left; padding: 2% 20% 3% 20%; text-align: center;}
.container-servicos {width: 100%; float: left; padding: 0% 20%; text-align: center;}
.container-top {width: 100%; float: left; padding: 0.5% 20%; text-align: center;background-color: #263A7F;}     
.container-depoiment {width: 100%; float: left; padding: 4.5% 20% 4% 20%; text-align: center;}   
    

.title {width: 100%; float: left; text-align: left;}
.title h2 {font-size: 1.5em;}
.title h3 {font-size: 1em;font-weight: 500;}
    
.title-left{width: 100%; float: left; text-align: left;}
.title-left h2 {font-size: 0.8em;font-weight: 300;}
 
    

    
.title-about {width: 50%; float: left; text-align: left; margin-top: 6%;}
.title-about h2 {font-size: 2.5em;}
.title-about h3 {font-size: 1.3em; font-weight:bold;} 
    
.title-depoiment {width: 70%; float: left; text-align: left;}
.title-depoiment h2 {font-size: 1.5em;}
.title-depoiment h3 {font-size: 1.7em; font-weight: 500;}      
    
    
    
.btn-menu {display: none;}
.btn-close {display: none;}
.menu {width: auto; height: 80px; line-height: 180px; float: right; background-color:rgba(0,0,0,0.0); 
display: block !important; position: static;}
.menu li {padding: 0; float: left;}
.menu li a {color:#171F6B; font-size: 1.3em; padding: 2px 20px; }
.menu li a:hover { color:#2DB200;  }
 .livros {width:50%; float:right; margin-top: 0; } 
 .buttons {width:30%; float:right; margin-top: 0; }   
 .title-left {width: 100%; float: left; text-align: left; }
.title-left h2 {font-size: 0.8em;}
      
    
.title {width: 50%; float: left; text-align: left; }
.title h2 {font-size: 3em;}
.title h3 {font-size: 2em;font-weight: 500;padding:0 20px 0 0;}
    
.
.btn {width: 100%; font-size: 1.5em; text-align: center; cursor: pointer; padding: 5%; background-color: #FFF;}
.btn-saiba {width: 50%; border:2px solid #fff; color:; margin-top: 1%;}
.btn-saiba:hover { border:2px solid #3D61A8; color:#fff; background-color: #3D61A8;}   
    
.btn-two {width: 100%; font-size: 1.2em;font-weight: 500; text-align: center; cursor: pointer; padding: 3%; }
.btn-orcamento {width: 45%; border:0px solid ; color:#293176; font-weight:bold; margin-top: 12%; background-color: #7FE601; }
.btn-orcamento:hover { border:0px solid #FFC926; color:#7FE601; font-weight: bold; background-color:#293176; }
    
.btn-serv {width: 100%; font-size: 0.8em;font-weight: 300; text-align: center; cursor: pointer; padding: 3%; }
.btn-servico {width: 45%; border:1px solid #000; color:; margin-top: 3%; background-color: #fff;} 
.btn-servico:hover { border:1px solid #3D61A8; color:#fff; background-color: #3D61A8;}
    
.btn-depo {width: 100%; padding: 5%; }
.btn-depo h1{ font-size: 1.5em;font-weight: 500; text-align: center; cursor: pointer; margin-right: 10px; }
.btn-depoiment {width:100%; border:1px solid #fff; color:; margin-top: 3%; background-color: ;} 
.btn-depoiment:hover { border:1px solid #3D61A8; color:#fff; background-color: #3D61A8;}
}

#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
    font-weight: 500;
  right: 30px;
  z-index: 99;
  font-size:2.3em;
  border: none;
  outline: none;
  background-color: #000;
  color: white;
  cursor: pointer;
  padding: 15px 25px 10px 25px;
  border-radius: 6px;
}

#myBtn:hover {
  background-color: #999;
}