@charset "utf-8";
/* CSS Document */
 
/* DESIGNER: Kadu Santos */
/* FRONT-END: Josemberg Gomes */
 
html {background: url(../img/imagem-fundo-site-rancho-alegre.png) no-repeat center top; height: 100%; background-size: cover; background-attachment: fixed;}
body { font-family:Arial, Helvetica, sans-serif; font-size:12px; color: #023c52; }

#all {max-width: 960px; margin: 0 auto; position: relative; padding-bottom: 10px;}
a {color: #023c52; text-decoration: none;}
a:hover {text-decoration: none;}
p {margin: 0; padding: 0; line-height: 16px; }
h1, h2, h3, h4, h5 {display: block; background-position: 0 0; background-repeat: no-repeat;}
header, figure, section, aside, article, nav, footer {display: block;}


/*--------------------- HEADER -------------------------*/

#logo {background: url(../img/logo.png) no-repeat left top; display: block; float: left; height: 105px; width: 347px; margin: 43px 0 0 309px;}

#header{height:230px; width: 100%; margin: 0 0 0 0; position:relative; margin:0 auto }

.centro{ max-width:960px; margin:0 auto; }
.logo{ margin-top:50px;}

.suport-top {display: none;}
.barra-top {display: none; position: relative; z-index: 10000;}
.pull {display: none; background: url(../img/pull.png) no-repeat right top; width: 36px; height: 36px; margin-right: 20px;}

/*--------------------- NAV -------------------------*/
#menu{ height:50px; width:100%; float: left; background: #097b4a; left: 0; bottom:20px; position:absolute; z-index:99; }
#menu ul{display: block; text-align: center; margin: 0; padding: 0;}
#menu li{ display: inline-block; vertical-align: top;}
#menu li a{ 
	font-size: 18px; display: block; font-weight:bold; 
	height: 50px; padding: 0px 18px;
	position: relative;
	font-family: 'Open Sans', Arial, sans-serif; line-height: 49px; color:#FFF; text-transform: uppercase;
 }
 #menu li a span{ 
 -webkit-text-shadow: 2px 1px 5px rgba(50, 50, 53, 0.3);
-moz-text-shadow:    2px 1px 5px rgba(50, 50, 53, 0.3);
text-shadow:         2px 1px 5px rgba(50, 50, 53, 0.3);}
#menu li{height: 49px;}
#menu li a:hover{ color:#fff; background: #115227;  }
#menu li a:before{
	position: absolute;
	width: 1px;
	height: 25px;
	background: #fff;
	right: -3.5px;
	top: 12px;
	content: "";
}
#menu li:last-child a:before{
	display: none;
}

.nav-fixed {position: fixed !important; left: 0; top:0 !important; bottom: auto; z-index: 99999 !important;
background-image: none !important; }
/*--------------------- PAINEL HOME -------------------------*/
.p1 {background: url(../img/painel/1.jpg) no-repeat 0 0; display: block; height: 214px; width: 188px;}
.p1:hover {background: url(../img/painel/1.jpg) no-repeat 0 -214px;} 
.p2 {background: url(../img/painel/2.jpg) no-repeat 0 0; display: block; height: 214px; width: 188px;}
.p2:hover {background: url(../img/painel/2.jpg) no-repeat 0 -214px;} 
.p3 {background: url(../img/painel/3.jpg) no-repeat 0 0; display: block; height: 214px; width: 188px;}
.p3:hover {background: url(../img/painel/3.jpg) no-repeat 0 -214px;} 
.p4 {background: url(../img/painel/4.jpg) no-repeat 0 0; display: block; height: 214px; width: 188px;}
.p4:hover {background: url(../img/painel/4.jpg) no-repeat 0 -215px;} 
.p5 {background: url(../img/painel/5.jpg) no-repeat 0 0; display: block; height: 214px; width: 188px;}
.p5:hover {background: url(../img/painel/5.jpg) no-repeat 0 -214px;} 
.p1, .p2, .p3, .p4 {*margin: 2px 0 0 0;} /*fix ie*/

/*---------------------- TITULOS -------------------------*/
.tt-ult-noticias {background: url(../img/tt/ultimas-nots.png);width: 175px;height: 25px; text-indent: -9999px;}

/*---------------------- HOME -------------------------*/
.centro-home{ max-width:960px; margin:0 auto; }

#intro-sites {background: url(../img/bg-hack-intro-sites.png) repeat-x left 2px; height: 287px; width: 952px; border-left: 3px solid #fff; border-right: 3px solid #fff; position: relative;}
.lista-sites li {background: #fff; float: left; height: 287px; width: 188px; margin: 0 3px 0 0;}
.mask-painel {background: url(../img/mask-painel.png) no-repeat left top; height: 28px; width: 960px; position: absolute; left: 0; bottom: 0; z-index: 9999;}

.painel {max-width: 980px; width: 100%;   }
.painel-home{width: 100%; float:left; }
.painel-home .bxslider{ width: 100%; }

/* Ultimas noticias */
.ult-noticias {
float: right;
background:url(../img/bg/noticias.jpg) repeat-y;
width: 32.8%;
}

.wrap-not {padding: 12px 15px 15px 20px;}


.lista-ult-noticias {
width: 295px;
min-height: 50px;
padding: 5px;
margin-top: 5px;
display: block;
float: left;
}

.lista-ult-noticias li {
	float: left;
	display: block;
	width:100%;
	margin: 5px 0 3px 0;
	padding-bottom: 5px;
	border-bottom: 1px #929191 dotted;
}
.lista-ult-noticias li a { background:url(../img/icones/seta.png) no-repeat left top; padding-left:20px; display:block; color:#FFF;font-size: 12px; margin-bottom:5px;}

.lista-ult-noticias li a:hover { text-decoration:underline; }
.saibamais{ color:#FFF; text-transform:uppercase;  background:url(../img/bt-saibamais.png) no-repeat center left; font-size:10px; width:129px; height:41px; display: block; text-indent: -9999px; float: left;}

.barra {display: block; margin: 0 auto;}


/* Subfeatured */
.subfeatured { max-width: 997px; margin: 0 auto;}
.box-subfeatured {width: 33.333333%; float: left;  background: #097b4a;}

.ult-noticias h2 {background: url(../img/ico-tt.png) no-repeat 0 3px; font-family: 'Open Sans', Arial, sans-serif; color: #fff; padding: 0 0 5px 20px; text-transform: uppercase; font-size: 16px;}

.box-subfeatured h2{
	font-family: 'Open Sans', Arial, sans-serif; 
	color: #fff;
	font-weight: 700;
	margin-bottom: 10px;
	text-transform: uppercase; 
	font-size: 16px;
}

.wrap-parceiros {background: #fff; height: 140px; border-radius: 15px;}
.itens { height: 150px;}
.itens td {text-align: center; vertical-align: middle; height: 100%;}

.wrap-feat{
	padding: 15px;
}
.dois_subfeatured{
	background: #dadada;
}
	.dois_subfeatured h2{
		color: #097b4a !important;
	}
/*---------------------- INTERNAS -------------------------*/


.madeira{ background:url(../img/bg/madeira.jpg) center top no-repeat; width:49px; height: 75px;  position:absolute; z-index:1;bottom: 0;}


.bg-internas {max-width: 999px; margin: 0 auto; padding: 19px 0;}

.central{ padding: 20px 20px 30px 20px; max-width:920px; background:#FFF; margin:0 auto; border-radius: 10px; min-height: 400px;}
.central p {color: #385109; padding: 20px 0 0 0;}

.tit{ background:#1b1101; padding:10px;font-family: 'Open Sans', Arial, sans-serif; margin: 0 0 19px 15px; font-weight:bold; color:#fff; font-size:24px; float:left; text-transform: uppercase;  }

/* Empresa */
.tts-int {background: url(../img/bg-tts-int.png) no-repeat left 8px; min-height: 22px;  font-family: 'Open Sans', Arial, sans-serif; font-size: 20px; color: #385109; text-transform: uppercase; margin: 25px 0 0 0; padding: 0 0 10px 30px; position: relative;}
.tts-int img {position: absolute; left: 0; bottom: 0;}

.list {padding: 20px 0 0 0;}
.list li {background: url(../img/border-bottom.png) repeat-x left bottom; padding: 10px 0 10px 20px; margin: 0 0 10px 0; color: #385109; position: relative;}

.list li strong {font-size: 14px; }
.ico-green {position: absolute; left: 8px; top: 13px;}

/* Produtos */
.cols-prod {width: 31%; float: left; margin: 0 2% 0 0;}
.list-prod li {padding: 0 0 5px 20px; }
.list-prod li strong, .list-prod li {font-size: 12px;}
.list-prod .ico-green {top: 3px;}
 

/* Parceiros */
.marca {height: 141px; width: 210px; float: left; border: 2px solid #c2dd6a; position: relative; text-align: center; margin: 0 8px 36px 8px;} 
.marca .link {position: absolute; left: 0; bottom: 10px; display: block; text-align: center; width: 100%; color: #385109;} 
.tts-parceiros {font-size: 13px; width: 200px; padding-bottom: 12px; background-position: 0 3px; float: left; margin-top: 0;}
.tts-parceiros img {position: absolute; left: 0; bottom: 8px;}


/*Lojas*/
.mr{ margin-right:17px;}
.lojas{ width:441px; display:inline-table; height:186px;}
.lojas h4{ background:url(../img/cicle.png) left center no-repeat; padding:0 0 2px 15px; margin:20px 0 10px 0; font-size:14px; font-weight:bold; border-bottom:1px solid #cdded5; }
.foto-loja{ float:left; margin-right:10px; border:1px solid #b8d752; padding:5px;}
.foto-loja img{ width:164px}
.text-loja{ width:255px; float:left;}
.text-loja p{ margin-bottom:5px; border-bottom:1px dashed #d59b1b; padding-bottom:5px; padding-top: 5px; }
.text-loja span{ font-weight:bold; color:#022c15; width:60px; float:left}
.text-loja a{ color:#d59b1b}

.bgbottom{ background:url(../img/bg/bg-bottom.jpg) center; width:980px; height:16px; }
.footer{ margin: 35px auto 0 auto; width:100%; height: 82px;  position:relative;  }


.rodape{ margin-top: 0; color:#FFF; text-align:left;}

.logo-rodape{
	float: left;
	width: 50%;
	margin-bottom: 15px;
	margin-top: -15px;
}

img.logofooter{ float:left; margin-right:40px; }
.pratica {
background: url(../img/pratica.png) no-repeat left top;
margin: 35px 30px 0 0;
float: right;
height: 19px;
width: 77px;
} 

.lista-not {padding: 0;}
.lista-not li {border-bottom:1px dotted #ccc; padding:12px 10px; margin:5px 0 20px;}
.lista-not li a { padding-left:9px; font-size:14px; color:#452403; font-weight: bold; font-size: 18px;}

/*---------------------- Formulários ------------------------*/
#form {width: 634px; float: left; padding: 0 0 0 0;}
#form label, #form div.hora {display: block; float: left; padding: 0 0 20px 0; min-height: 50px;}
#form .lr {float: right;}
#form input { border: 1px solid #b3d445; height: 29px; padding: 0 0 0 5px; line-height: 31px;}
#form input.cmp-maior {width: 628px;}
#form input.cmp-menor {width: 297px;}
#form input.cmp-menor2 {width: 100px;}
#form select {width: 633px; padding:  5px ; height: 31px; border: 1px solid #b3d445;  }
#form textarea {border: 1px solid #b3d445; width: 621px; padding: 5px; height: 178px; }
button.btn-enviar {background: url(../img/btn-enviar.png) no-repeat left top; float: right; height: 43px; width: 79px; border: 0; cursor: pointer;}


.tts-form {font-size: 13px; width: 100%; padding-bottom: 12px; background-position: 0 3px; min-height: 15px; margin-top: 0; display: block; padding-left: 22px;}
.tts-form img {position: absolute; left: 0; bottom: 7px;}

/*--------------------- CLASSES IMPORTANTES -------------------------*/

img {max-width: 100%;}

.clear {clear: both;}
.no-text {display: none;}
.fl {float: left;}
.fr {float: right;}
.fz14 {font-size: 14px;}
.offset1-marcas {margin-left: 234px;}
.offset2-marcas {float: right;}
.no-margin, .mr0 {margin-right: 0px !important;}
.no-border {border-bottom: none !important;}
.error {margin: 0 !important; padding: 0 !important; color: #f00 !important; font-size: 10px;}

.mr0 {margin-right: 0;}


.visuallyhidden {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}


@media screen and (max-width: 970px) {
	.subfeatured,
	.centro-home,
	.wrap-barra,
	.bg-internas {margin: 0 10px;}
	.bg-internas {padding-left: 10px; padding-right: 10px;}

	.central {padding: 15px;}

	#content #colRight {float: none; width: auto; margin: 0;}

	#header h1 {float: none; text-align: center;}

	#header {padding: 36px 0 20px;  margin: 0 0 20px; height: auto;}

	.madeira {display: none;}

	.suport-top {float: left; display: block; font-size: 1.4em; color: #fff; padding: 10px 0 0;}
	.barra-top {background: #097b4a; display: block; position: fixed; left: 0; top: 0; padding: 0 10px; width: 100%; }
	.barra-top span {float: right; line-height: 36px; font-size: 1.2em; color: #fff;}

	/* Menu */
	.pull {display: block; float: right; padding: 0 40px 0 0; }
	#menu ul,
	#menu ul li,
	#menu ul li:first-child {width: auto; margin: 0; height: auto; float: none;}
	#menu {background: #39200e; position: fixed; left: -100%; top: 0; z-index: 90000; width: 200px; height: 100%; overflow-y: scroll; overflow-x: hidden;transition-property: left; transition-duration: 0.5s; transition-timing-function:  ease-in-out; margin: 0; padding: 0;}
	#menu li {width: 200px; display: block; float: none; height: 45px; border-bottom: 1px solid #6a3b03;}
	#menu li a {text-align: left; color: #fff; font-size: 1.5em;  text-indent: 0px; width: auto; height: auto;  padding: 0 0 0 10px; border-bottom: 0;  }
	#menu li a:hover {background: #f3d660; color: #000; border-bottom: 0;}
	#menu li.separador {display: none;}
	#menu.off-canvas {left: 0;}
	.bgplb {background-position: right bottom;}

	.mobile {display: block;}

	.lojas {width: 100%;   margin: 0 0 20px; height: auto;}
	.text-loja {width: auto;}

	.ft-contato {display: none;}

	#form,
	#form label, #form div.hora {width: 100%;}

	#form input.cmp-maior,
	#form input.cmp-menor,
	#form select,
	#form textarea {width: 100%; box-sizing: border-box;}

	.tts-form {width: auto;}
	.lista-ult-noticias{
		width: 100%;
	}
	.lista-ult-noticias li a{
		text-align: left;
	}

}

@media screen and (max-width: 768px) {
	.cols-prod {float: none; width: auto;}

	.foto-loja,
	.text-loja {float: none; width: auto;}

	.foto-loja {border: 0; padding: 0; margin: 0;}
	.foto-loja img {border:1px solid #b8d752; padding:5px;}
	.logo {max-width: 80%;}
}

@media screen and (max-width: 600px) {

	.painel-home,
	.ult-noticias {float: none; width: auto; margin: 0;}
	.wrap-not {padding: 0; margin: 25px 0 0;}
	.wrap-not a {text-align: center; display: block;}

	.box-subfeatured {float: none; width: 100%; margin: 0 0 0;}
	.wrap-feat,
	.wrap-parceiros {text-align: center; max-width: 307px; margin: 0 auto;}

	.ult-noticias h2 {background-color: #352002; padding: 2px 4px 2px 25px; margin: 0 0 10px; background-position: 4px center; border-radius: 5px;}

	.logo-rodape{
		width: 100%;
		margin-left: 0;
		text-align: center;
		margin-top: 10px;
	}
	img.logofooter{
		float: none;
		max-width: 43% !important;
		margin: 0 1%;
	}
	.pratica{
		margin: 0 30px 25px 0;
	}
}

@media screen and (max-width: 480px) {
	.marca {width: 170px;}

	.logofooter{
		display: inline-block;
		vertical-align: middle;
		max-width: 50%;
	}
}



/* INICIO PAGINAÇÕES */
#paginacao {margin: 0px 0 0 0;	clear:both;	padding: 5px; width:100%; height:20px;text-align:center; vertical-align:middle;	float:left;}
#paginacao a{color:#333; text-decoration: none;	border:1px solid #784903; line-height:20px;	padding:3px 6px; margin-left:3px; font-size:12px;}
#paginacao a.anterior{margin-left:0;}
#paginacao p {padding: 0;}
#paginacao strong{background:#784903;border:1px solid #784903;line-height:0;padding:3px 6px;margin-left:3px;color:#fff;}
/* FIM PAGINAÇÕES */