/****************************************************
*      Desenvolvido por Portal G2 - 16/05/2017      *
****************************************************/

@charset "UTF-8";

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

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

a { text-decoration: none; color: #333333; }
a:hover { color: #8F0306; }

p { text-align: justify; margin: 10px 0px; }

h1, h2, h3, h4 { font-weight: 100; text-align: justify; }

h1 { font-size: 35px; margin: 10px 0px; text-align:left; }
h2 { font-size: 32px; margin: 10px 0px; text-align:left; }
h3 { font-size: 26px; margin: 10px 0px; text-align:left; }
h4 { font-size: 20px; margin: 10px 0px; }


.primary_color      { color: #57A9FB; } /* Cor principal do site */
.secundary_color    { color: #333333; } /* Cor secundario do site */

/* Cores Basicas para fundo */
.bg_red         { background: red; }
.bg_yellow      { background: yellow; }
.bg_orange      { background: orange; }
.bg_blue        { background: blue; }
.bg_white       { background: white; }
.bg_black       { background: #555555; }

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

.table { display: table; }
.block { display: block; }

/*** containers ***/
.cont_5 { width: 50%; float: left; }
/*** containers ***/

/*** Things ***/
.img_aling { width: 20%; border-radius: 10px; margin: 10px 10px 10px 0px; float: left; }

.btn { font-size: 25px; padding: 10px 25px; margin: 20px; border: solid 3px #FFFFFF; color: #FFFFFF; background: rgba(0, 0, 0, .7); display: table; float: left; }
.btn:hover { color: #000000; background: rgba(255, 255, 255, .7); cursor: pointer; }
/*** Things ***/



/*** social ***/
.social         { position: fixed; width: 72px; height: 207px; top: 250px; left: 0px; z-index: 5; }
.social a       { width: 36px; height: 36px; margin: 5px 0px; background: #fff; border-radius: 0px 5px 5px 0px; display: table; box-shadow: #666 2px 3px 2px;  }
.social a:hover { width: 72px; background: #C6040A; }
.social a img   { width: 36px; height: 36px; float: right; }
/*** social ***/

/*** up ***/
#up         { position: fixed; width: 45px; height: 45px; right: 5px; bottom: 5px; border-radius: 5px; background: rgba(198, 4, 10, .5); box-shadow: 3px 3px 3px #333; } 
#up:hover   { background: #C6040A; cursor: pointer; }
/*** up ***/

/*** Corpo do Site ***/
body { background: url(../_img/bg.jpg) fixed center top no-repeat #fff; background-size: 100%; }

header, center, footer { width: 90%; max-width: 1360px; margin: 0px auto; display: table; }

section { width: 90%; margin: 50px auto; display: table; }
/*** Corpo do Site ***/

/*** Header ***/
header { width:100%; height:auto; background:#232738; }
header .logo { width: 30%; float:  left; } .logo img { width: 100%; margin-left:15px; }
header .fone { width: 70%; float: right; } .fone p { font-size:21px; text-align: right; color: #FFFFFF; margin: 30px 15px; }
/* menu */
header .menu { width: 100%; background: linear-gradient(135deg, #BF953F, #FCF6BA, #B38728); background-size:100%; display: table; font-weight:500; }
header .menu nav { width: auto; margin: auto; display: table; }
header .menu nav ul { list-style: none; }
header .menu nav ul li { float: left; display: table; }
header .menu nav ul li a { color: #000; padding: 9px 12px; display: block; border-radius: 10px; margin:5px;}
header .menu nav ul li a:hover { color: #C6040A; background: #FFF; box-shadow: #000 1px 1px 1px; }
header .menu nav ul li .c { background: #fff; color:#f00; margin: 5px auto; box-shadow: #000 1px 1px 1px; }


/*** slider ***/
.container_slider { position: relative; width: 90%; max-width: 1360px; margin: 0px auto; }
.container_slider ul { list-style: none; }

.slider { width: 100%; -webkit-animation: fading 20s infinite; animation: fading 20s infinite; }
.slider img { width: 100%; border-radius: 0px 0px 15px 15px; }

.caption { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; color: #FFFFFF; }
.caption h2  { font-size: 32px; margin: 0px; padding: 15px 30px; background: rgba(0, 0, 0, .5); text-align: center; }
.caption h3  { font-size: 16px; margin: 0px; padding: 15px 30px; background: rgba(0, 0, 0, .8); text-align: center; }

.container_bullets { position: absolute; left: 50%; transform: translate(-50%,-140%); }
.bullets { display: inline-block; padding: 5px; text-align: center; border-radius: 50%; border: 1px solid #CCC !important; }
.bullets:hover { background: rgba(225, 255, 255, .5); cursor: pointer; }
.bullet_activated { background: rgba(225, 255, 255, .5); }

.prev { position: absolute; top: 50%; left: 0%; transform: translate(25%,-90%); }
.next { position: absolute; top: 50%; right: 0%; transform: translate(-25%,-90%); }

.button_floating { 
    font-size: 25px; 
    color: #FFFFFF; background: rgba(0, 0, 0, .5); 
    width: 40px; height: 40px; 
    line-height: 40px; 
    display: inline-block; 
    text-align: center; 
    overflow: hidden;
    border-radius: 50%;
    cursor: pointer;
}

.button_floating:hover { color: #000000; background: rgba(255, 255, 255, .5); }
/*** slider ***/

/*** banner ***/
.banner { width: 100%; max-width: 1360px; margin: 0px auto; }
.banner img { width: 100%; height:200px; }
/*** banner ***/
.fundo-pg { width: 100%; height:auto; background: url(../_img/bg1.jpg) #fff; }
.fonte-cor p { height: auto; color:#FFF; background: rgba(35, 39, 56, .5); padding:10px; border-radius:7px; }
.fonte-cor h1 { color:#FFF; }
.fonte-cor h2 { color:#FFF; }
.clientes { width:16%; height:12%; float:left; margin:2px; }
.clientes img{ width:98%; height:120px; border-radius:6px; }
/*** center ***/
center {  }
    /* destaque */
    center .destaque { width: 20%; height:330px; margin: 2.5%; float: left; }
    center .destaque .cont_img { border-radius: 100%; border: solid 0px #000; background: #003; display: table; }
    center .destaque img { width: 100%; border-radius: 100%; }
    center .destaque img:hover { background: #ccc; opacity: .5; }
    center .destaque h4 { text-align: center; }
    center .destaque p { height: 100px; display: block; }
    /* destaque */
				
    /*** Galeria ***/
    center #galeria { width: 100%; display: table; }
    center #galeria a { width: 10%; margin: 1.2%; float: left; display: block; }
    center #galeria a img { width: 96%; border-radius: 15px; border: solid 3px #C6040A; }
    center #galeria a img:hover { opacity: .5; }
    /*** Galeria ***/
    /*** Contato ***/
    center .contato { width: 100%; display: table; }
    center .contato label { width: 25%; height: 30px; display: block; float: left; border-radius: 5px; }
    center .contato input { width: 75%; height: 30px; border-radius: 5px; color: #222; }
    center .contato select { width: 75%; height: 30px; border-radius: 5px; color: #222; }
    center .contato textarea { width: 75%; height: 100px; border-radius: 5px; color: #222; }
    center .contato .bt { width: auto; height: auto; padding: 10px; color: #FFF; background: rgb(198,4,10); border: 0px; border-radius: 5px; }
    /*** Contato ***/
/*** center ***/

/*** footer ***/
footer { width: 100%; margin: 0px auto;  background:#232738; padding: 55px 0px;  border-top: solid 30px  #C6040A; }
footer p { color: #FFFFFF; text-align: center; font-size: 15px; }
footer p a { color:#C03; }
/*** footer ***/

/*** Responsive ***/
@media only screen and (max-width: 768px){
    body { background-size: 150%; }
    
    h1 { font-size: 32px; }
    h2 { font-size: 26px; }
    h3 { font-size: 20px; }
    h4 { font-size: 18px; }
    
    p { font-size: 12px; }
    
    .img_aling { width: 90%; margin: auto; float: none; }
    center .destaque .cont_img { display: table; margin: auto;  }
    center .destaque img { width: 100%; margin: auto; }
				header .menu { width: 100%; height: 30px; background:url(../_img/bg-menu.); background: linear-gradient(135deg, #BF953F, #FCF6BA, #B38728); }
				
    header .logo { width: 50%; } .logo img { width: 80%; margin: 25px 5%; }
    header .fone { width: 50%; }
    center .destaque { width: 98%; margin: 2.5%; float: left; }
    /*** slider ***/
    .caption h2 { font-size: 12px; padding: 5px; }
    .caption h3 { font-size: 9px; padding: 5px; }
    /*** slider ***/
}

@media only screen and (max-width: 480px){
    body { background-size: 520%; }
    h1 { font-size: 19px; }
    h2 { font-size: 17px; }
	h3 { font-size: 17px; }
	/*** social ***/
	.banner img { width: 100%; height:100px; }
.social         { position: fixed; width: 72px; height: 207px; top: 355px; left: 0px; z-index: 5; }
.social a       { width: 26px; height: 26px; margin: 5px 0px; background: #D6D6D6; border-radius: 0px 5px 5px 0px; display: table; }
.social a:hover { width: 72px; background: #C6040A; }
.social a img   { width: 26px; height: 26px; float: right; }
/*** social ***/
    .img_aling { width: 100%; }
    header .fone { width: 70%; float: right; } .fone p { text-align: center; color: #FFFFFF; margin:0px 0px 10px; }
    header .logo { width: 100%; } .logo img { width: 90%; margin: 1px 5%; }
    header .fone { width: 100%; }
	.clientes { width:98%; height:12%; float:left; margin:2px; }
    /* menu */
    header .menu nav ul li a { font-size: 12px; color: #FFF; padding: 9px 2px; display: block; border-radius: 10px; margin:2px;}
    header .menu { width: 100%; background: #BF9C5B; }
	header .menu nav ul li .c { background: #fff; color:#f00; margin: 3px auto; }
    /* destaque */
    center .destaque { width: 98%; margin: 2.5%; background: #CCC; }
    /* destaque */
    /* Contato */
    center .contato label, center .contato input, center .contato select, center .contato textarea { width: 50%; }
    /* Contato */
	footer p { font-size: 13px; }
}
/*** Responsive ***/