@charset "UTF-8";

/*** keyframes ***/
@-webkit-keyframes fading { 
    0% { opacity: 0; }
    2% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}

@keyframes fading { 
    0% { opacity: 0; }
    2% { opacity: 1; }
    98% { opacity: 1; }
    100% { opacity: 0; }
}

@keyframes drop {
    from { margin-top: -20px; opacity: 0; }
    to { margin: 0px; }
}

@-webkit-keyframes drop {
    from { margin-top: -20px; opacity: 0; }
    to { margin: 0px; }
}

@keyframes take {
    0%   { margin-bottom: -60px; opacity: 0; }
    30%  { opacity: 0; }
    100% { margin: 5px 0; }
}

@-webkit-keyframes take {
    0%   { margin-bottom: -60px; opacity: 0; }
    30%  { opacity: 0; }
    100% { margin: 5px 0; }
}
/*** keyframes ***/

/* Reset */
* { margin: 0; padding: 0; font-family: Calibri; }
/* Suavização dos movimentos */
* { transition: color .5s, opacity .5s, background .5s, border .5s, top .5s, left .5s, right .5s, width .5s, height .5s, margin .5s, transform .5s; } 

/*** basico ***/
body {  }

left  { width: 48%; padding: 1%; float: left; display: block; }
right { width: 48%; padding: 1%; float: right; display: block; }

a { text-decoration: none; color: #0080FF; }
a:hover { color: #111111; }

p { font-size: 21px; margin: 10px 0px; }

list { font-size: 14px; display: block; }
list li {  }

h1 { font-size: 50px; margin: 15px 0px; font-weight: 600; }
h2 { font-size: 30px; margin: 15px 0px; font-weight: 600; }
h3 { font-size: 20px; margin: 15px 0px; font-weight: 600; }
h4 { font-size: 23px; margin: 15px 0px; font-weight: 600; }

.primary    { color: #0080FF; }
.secondary  { color: #001A66; }

.justify    { text-align: justify; }
.left       { text-align: left; }
.center     { text-align: center; }
.right      { text-align: right; }

.img_left { width: 30%; height: auto; margin: 10px 20px 10px 0; float: left; border-radius:6px; }

/* Whatsapp */
.whatsapp { 
    position: fixed; width: 76px; height: 76px; margin: 0; padding: 0px; 
    right: 30px; bottom: 90px; display: table; z-index: 10000;
    box-shadow: 0 0 0 0px rgba(40,135,106,1); background: #fff; border-radius: 100%;
    animation: pulse 1s; animation-iteration-count: infinite;
}
.whatsapp img { width: 60%; padding: 20%; z-index: 100; }
/* Whatsapp */
/* Keyframe Whatsapp*/
@keyframes pulse {
    from { box-shadow: 0 0 0 0px rgba(40,135,106,1); }
    to { box-shadow: 0 0 0 45px rgba(40,135,106,0); }
}

@-webkit-keyframes pulse {
    from { box-shadow: 0 0 0 0px rgba(40,135,106,1); }
    to { box-shadow: 0 0 0 45px rgba(40,135,106,0); }
}
.whatsappb img { width: 152px; height: auto; position: fixed; margin: 0; padding: 0px; 
    right: 69px; bottom: 108px; display: table; z-index: 10; }
/* Keyframe Whatsapp*/



.base { width: 95%; margin: 0px auto; display: table; }
section { width: 95%; max-width: 1360px; padding: 50px 2.5%; display: table; margin: auto; }
/*** basico ***/

/*** Social ***/
.social { position: fixed; width: 64px; height: auto; top: 176px; left: 0px; display: table; z-index: 9000; }
.social a { position: relative; width: 32px; height: 32px; margin: 2px 0; padding: 0; background: #0080FF; display: block; border-radius:6px; box-shadow:1px 1px 3px #000; }
.social a img { width: 20px; margin: 6px; float: right; border-radius:6px; }
.social a:hover { width: 64px; background: #000; }
/*** Social ***/

/*** Header ***/
header { position: fixed; width: 95%; height: auto; padding: 0 2.5%; top: 0; left: 0; background: rgba(255, 255, 255, .6); z-index: 10000; border-top: solid 5px #000; border-bottom: solid 10px #0080FF; }

header .logo { width: 14%; float: left; }
header .logo img { width: 100%; border-radius:6px; }

.fone-topo { width: 23%; height:auto; font-size:19px; float: right; margin:15px 0px 0px 100px; font-weight: 900; text-align:center; background: rgba(255, 255, 255, .6); }

header .menu { width: 30%; margin: 20px auto; display:table; } 
header .menu #menu { z-index: 9000; }
header .menu #menu ul { width: auto; margin: 0px; float: right; list-style: none; display: table; }
header .menu #menu ul li { position: relative; float: left; display: table; }
header .menu #menu ul li a { font-size: 23px; font-weight: bolder; font-weight: 0; margin: 10px 3px; padding: 10px; color: #333333; display: block; border-radius:6px; 
}
header .menu #menu ul li:hover a { background: #0080FF; color: #FFFFFF; text-shadow: none; border-radius:6px; }
header .menu #menu ul li .ativo { background:#0080FF; margin: 10px 3px; padding: 10px; border-radius:6px; color:#fff; }


header .menu #menu ul li ul { position: absolute; width: auto; display: none; background: rgba(0,0,0,.6); border-radius: 0 0 12px 12px; z-index: 5000; }
header .menu #menu ul li ul li { float: none; display: table; }
header .menu #menu ul li ul li a { font-size: 17px; font-weight: 100; width: 220px; margin: 1px 2px; padding: 10px 10px; display: block; }
header .menu #menu ul li:hover ul li:hover a { background: #0080FF; color: #FFFFFF; }
header .menu #menu ul li:hover ul li .active { color: #0088AA; }
header .menu #menu ul li:hover ul li a { background: none; }
header .menu #menu ul li:hover ul { display: table; animation: drop .5s; }
    

header .menu-mobile { display: none; margin: 0px 60px; float: right; }
/*** Header ***/

/*** Banner ***/
.banner { width: 100%; margin: 0 auto; }
/*** Banner ***/

/*** Center ***/
center { width: 100%; margin: 0 auto; display: table; }

center .destaque { width: 31.333%; padding: 1.5%; background: #FFFFFF; text-align: justify; float: left; display: table; }
center .destaque:first-child { padding: 1.5% 1.5% 1.5% 0; }
center .destaque:last-child { padding: 1.5% 0 1.5% 1.5%; }
center .destaque img { width: 100%; height:250px; border-radius:6px; }

.decor { float:left; margin:9px; }
center .servicos { width: 95%; height: auto; margin: 10px; border-radius: 6px; padding:130px 0px 0px 0px; margin: auto; }
center .servicos img { width: 30%; height:250px; margin: 10px; float: left; border-radius: 6px; }

center .galeria a { width: 11%; margin: .5; padding: .5%; border-radius: 5px; float: left; background: #F0F0F0; display: table; }
center .galeria a img { width: 100%; border-radius: 5px; }

center .contato left {  }

center .contato right {  }
center .contato right .form { width: 100%; display: table; }
center .contato right .form input { width: 100%; padding: 1%; }
center .contato right .form textarea { width: 100%; padding: 1%; }
center .contato right .form .button { width: auto; float: right; }
/*** Center ***/

/*** Info  ***/
.info { width: 100%; background: url("../_img/fundo.jpg")  fixed center no-repeat #D4CCCC; background-size: cover; color: #FF7F00; display: table; margin: 5% 0%;  }
.info p { font-size: 29px; text-align: center; color: #fff; text-shadow:1px 1px 3px #000; font-family: coneria; padding: 70px 0; font-weight: 700; }
/*** Info  ***/

/*** Footer ***/
.fone { text-align:center; }
footer { width: 95%; height:150px; padding: 0 2.5%; color: #FFFFFF; background: #000; display: table; border-top: solid 50px #0080FF; }
/*** Footer ***/

/*** Responsive ***/
@media only screen and (max-width: 930px){
    /*** basico ***/
    h1 { font-size: 32px; }
    h2 { font-size: 26px; }
    h3 { font-size: 20px; }
    h4 { font-size: 18px; }
    /*** basico ***/
    
    /*** header ***/
    header .menu { width: 100%; margin: 0px; float: right; }
    header .menu #menu { position: fixed; width: 30%; height: 100%; padding: 0 10%; top: 0; left: 0; background: rgba(160, 160, 160, .9); display: none; }
    header .menu #menu ul { width: auto; float: left; margin: 0px auto; }
    header .menu #menu ul li { width: 100%; margin: 0; padding: 0; float: left; display: table; }
    header .menu #menu ul li a { width: 80%; padding: 15% 10%; text-align: center; margin: 0px; display: table; }
    header .menu #menu ul li a:hover { background: #0080FF; color: #FFFFFF; }
	
    header .menu-mobile { display: block; }
    /*** header ***/
    
    /*** center ***/
    center .galeria img { width: 40%; margin: 5%; }
    /*** center ***/
}
@media only screen and (max-width: 640px){
    /*** basico ***/
	p { text-align: left; }
    .left { text-align: center; }
    .right { text-align: center; }
    
    left  { width: 99%; padding: .5%; float: none; }
    right { width: 99%; padding: .5%; float: none; }
    
    section { width: 80%; padding: 5px 10%; }
    /*** basico ***/
    .social { top: 450px; }
	
	center .galeria a { width: 100%; margin: .1; padding: .1%; border-radius: 5px; float: left; background: #F0F0F0; display: table; }
	center .galeria a img { width: 90%; border-radius: 5px; }
	
    /*** header ***/
    header { position: relative; display: table; }
    
	header .menu #menu ul li:hover ul { display: none; }
	
    header .logo { width: 100%; }
	.fone-topo { font-size:21px; width: 90%; height:auto; margin:10px auto; }
	
	center .servicos { width: 90%; height: auto; padding:30px 0px 0px 0px; }
    center .servicos img { width: 90%; height:150px; margin: 3px; float: left; border-radius: 6px; }
    /*** header ***/
    
    /*** center ***/
    .whatsapp { display: table; }
    /*** center ***/
    left  { text-align: center; }
    /*** footer ***/
footer { text-align: center; width: 100%; height: auto; padding: 0%;}
    /*** footer ***/
}
@media only screen and (max-width: 540px){
    /*** basico ***/
    .img_left { width: 100%; height: auto; margin: 20px 0; float: left; }
    /*** basico ***/
    
    /*** center ***/
    center .destaque { width: 100%; padding: 50px 0; }
    center .destaque:first-child { padding: 0; }
    center .destaque:last-child { padding: 0; }
    /*** center ***/
	
}
/*** Responsive ***/