@import "reset.css";
@import "superfish.css";
@import "flexslider.css";

@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,800);
article,aside,audio,canvas,command,datalist,details,embed,figcaption,figure,footer,header,hgroup,keygen,meter,nav,output,progress,section,source,video{display:block}mark,rp,rt,ruby,summary,time{display:inline}
/* Global properties ======================================================== */
html {width:100%}

body {font-family: 'Open Sans', sans-serif;font-size:13px; line-height:19px; color:#424242; min-width:1030px; background-color:#ebebeb}
.back-white{background-color:#FFF}
.back-blue{background-color:#25a9e1}
.back-green{background-color:#98c33c}
.back-light-gray {background-color:#f9f9f9;}

.tx-white{color:#FFF !important}

a.bt-green{background-color:#98c33c; color:#fff; padding:5px 15px; font-weight:700; font-size:20px}
a.bt-green:hover{background-color:#4e4e4e; color:#fff;}

.space-box{padding-top:50px; padding-bottom:50px}

.main{width: 980px;margin: 0 auto; }
.icons-fontes{font-family:'FontAwesome'; height: 58px; display: block; margin-bottom: 14px; color:#4e4e4e}
.icons-fontes:hover{ color:#FFF}

.midias-sociais{ margin-top:20px; float:left; width:100%}
.midias-sociais a{margin-right:5px}
.midias-sociais a:hover{opacity:0.7}

a.button-blue{    background: #0888ca;color:#fff; padding:10px 15px; font-size:15px; margin-left: 10%; clear:both; font-weight:normal; margin-top:-16px; position:relative; float:left}
a.button-blue:hover{    background: #98c33c;color:#fff;}

.mart10 {margin-top:10px;}
.mart20 {margin-top:20px;}
.mart30 {margin-top:30px;}
.mart40 {margin-top:40px;}
.mart50 {margin-top:50px;}

.marb10 {margin-bottom:10px;}
.marb20 {margin-bottom:20px;}
.marb30 {margin-bottom:30px;}

/*********************************fonts*************************************/
.reg {text-transform:uppercase}
.f_left {float:left}
.f_right {float:right}
.align_right {text-align:right}
.align_center {text-align:center}

.it{font-style:italic}
.let{letter-spacing:-1px}

/*********************************CLASSES**********************************/
.m_bottom_zero{ margin-bottom:0 !important;}
.m_left_zero{ margin-left:0 !important;}
.p_bottom_zero{ padding-bottom:0 !important;}
.p_left_zero{ padding-left:0 !important;}
	
.clear {clear:both;width:100%;line-height:0;font-size:0;}
.wrapper {width:100%;overflow:hidden}
.extra_wrapper{ overflow:hidden;}
.container{width:100%}
.extra_last, .last{ margin-bottom:0 !important; padding-bottom:0 !important;}
.extra_last{ border:none !important; background:none !important;}
.bg_none{ background:none !important;}
.bg_none:after{display: none !important;}

/*==================================== Links ======================================================== */
a {color:#424242;outline:none; text-decoration:none; cursor:pointer;}
a:hover{ color:#ff4800; text-decoration:none;}

/*********************************Displays*************************************/
.block{ display:block;}
.inline-block{ display:inline-block;}

/*********************************header*************************************/

header {
	width: 100%;
	position: fixed;
	background: #a0a0a0;
	height: 106px;
	left: 0;
	top: 0;
	z-index: 10;
}
header .inner{padding: 9px 0 0 0;}

header h1 a {
display: block;
width: 293px;
height: 70px;
text-decoration: none;
float:left
}



.logo-pag{z-index:9999999; width:100%; text-align:center; background-color:#FFF; padding:0; margin:0 auto; border-bottom:#CCC solid 3px; float:left}
.logo-pag img{ width:25%; }

/*********************************content*************************************/
#content {padding:0 0px 0px;position: relative;z-index: 1;}
.cont_pad{padding:0 0 0 0 !important;}

/*===============================>> Paragraphs <<=============================*/

p {margin-bottom:19px}
.p2{ margin-bottom:41px;}

/*================================>> H <<========================================*/
h2,h3,h4, h5{ font-weight:normal;}
h2{font-size: 23px; line-height: 29px; color:#4e4e4e;margin-bottom: 10px;}
h2.h2{background: url('../images/stripe1.png') 0 bottom repeat-x;padding-bottom: 26px;}

h2.ind{ margin-bottom:46px;}
h2.ind1{ margin-bottom:px;}
h2.ind2{ margin-bottom:px;}

h3, .h3{font-size: 28px; line-height: 34px; color:#4e4e4e;}
h3.ind1{ margin-bottom:px;}
h3.ind2{ margin-bottom:px;}
h3.ind3{ margin-bottom:px;}

h4, h4 a{font-size: 24px; line-height: 29px; color: #4e4e4e;}
h4 a:hover{color: #0888ca;}

h5{font-size: 20px; line-height: 24px; color: #4e4e4e;margin-bottom: 21px;}
h5.ind{margin-bottom: 19px;}
/*================================>> GOOGLE FONTS  <<========================================*/
.h3, .sf-menu a{font-family: 'Open Sans', sans-serif;}


/*================================>> hovers <<========================================*/
.sf-menu li, .element, #portfolio .element a, #portfolio .element .description, #portfolio .element .text, #filter a, .button, .portfolio1 a, .portfolio1 .text, .service .inner{-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;}

.flex-direction-nav a, .social_box img, .sf-menu a{-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease;}
/*********************************page_1*************************************/
.ext_list>li, .ext_box, .ext_box1{ overflow:hidden;}
.ext_list>li>figure, .ext_box>figure, .ext_box1>div{ float:left;}
.ext_list>li>div, .ext_box>div, .ext_box1>figure{overflow:hidden;}
.ext_box1>figure{display: block;}
/*================================>> PAGES <<========================================*/

#pages{position: relative;}
#pages>li{width: 100%;}

#home>.inner{padding-top: 86px;}

.responsive-video{width: 100%; height: 100%; margin: 0 100px;max-height:326px;max-width:580px}


/********************************* Services Page *************************************/

.divider{border-top:solid 1px #cacaca;}

.box1{position: relative;padding: 23px 0 27px;}
.box1 h2{ color:#de232a; font-size:30px; font-family:"Open Sans", sans-serif; }
.box1 h3{ color:#4e4e4e; font-size:30px; font-family:"Open Sans", sans-serif; line-height:40px; text-align:center }
.box1 p{ font-family:"Open Sans", sans-serif; text-align:justify; font-size:14px; line-height:22px; margin-top:30px}
.box1 span { font-weight:800}

.box2{padding: 20px 0; height:200px; margin-top:10px;}
.box2 h2{ color:#de232a; font-size:40px; font-family:"Open Sans", sans-serif; padding-bottom:20px }
.box2 h4{ color:#4e4e4e; font-size:20px; font-family:"Open Sans", sans-serif; text-align:left}
.box2 p{ font-family:"Open Sans", sans-serif; text-align:justify; font-size:14px; line-height:22px; margin-top:30px}
.box2 span { font-weight:800}

.box-tablet-logo{float:left; width:25%; }
.box-tablet-logo img{ width:90%; }
.box-tablet-tx{float:left; width:50%}
.box-tablet-video{float:left; width:25%}
.box-tablet-video img{width:100%}

#services>.inner, #blog>.inner, #portfolio>.inner, #our_team>.inner, #get_in_touch .inner{padding-top: 110px;}

.service{float: left;text-align: center;position: relative;padding: 0px 0 0;}
.service .img_wrap{height: 58px;display: inline-block;overflow: hidden;margin-bottom: 14px;}
.service:hover .icons-fontes{ color:#FFF}
.service .inner:hover{position: relative;background: #de232a;color: #fff;}
.service .inner:hover .h3{color: #fff;}
.service .h3{margin-bottom: 16px;display: block; font-family:"Open Sans", sans-serif; font-weight:800}
.service>.inner{margin-right: 11px;padding: 15px 15px 26px;border-radius:4px; position: relative;display: block;}
.service span{display: block;}
.service span:hover{color:#FFF}
.service .inner:hover img{}
.service .text {font-family:"Open Sans", sans-serif;  font-size:15px; line-height:22px; font-weight:400}

.service1, .service3{width: 320px;}
.service2{width: 330px;}
.service2>.inner{margin: 0 11px;}
.service3>.inner{margin-left: 11px;}

.service2:after, .service2:before{width: 1px;display: block;position: absolute;top: 0;height: 100%;background: url('../images/stripe2.png') repeat-y;content: "";}
.service2:after{right: 0;}
.service2:before{left: 0;}

/*.bot_stripe:after{left: 10px;bottom: -10px;position: absolute;display: block;height: 1px;width: 95%;background: url('../images/stripe1.png') repeat-x;content: "";}*/

.bot_ind{padding-bottom: 10px;margin-bottom: 10px;}

.service1 a, .service2 a, .service3 a{cursor:default}

#planos .table-planos .tab-col1 {width:25%; float: left;}
#planos .table-planos .tab-col2 {width:25%; float: left;}
#planos .table-planos .title {font-size:14px; padding:20px; text-transform:uppercase; border:1px solid #d8d8d8; text-align:center; font-weight:600;}
#planos .table-planos .item {font-size:12px; padding:20px 10px; border:1px solid #d8d8d8; text-align:center;}
#planos .table-planos .item i.fa-check{font-size:18px; color:#98c33c;}
#planos .table-planos .item i.fa-times{font-size:18px; color:#f0283f;}


/*********************************Portfolio*************************************/
#portfolio{z-index: 10;}
#portfolio .main{padding-top: 24px;}

.filter_box{background: url('../images/stripe1.png') 0 bottom repeat-x;padding-bottom: 31px;margin-bottom: 23px;}
#portfolio .element {float:left;}
#portfolio .element>a{display: block;}
#portfolio .element .description{height: 0;color: #fff;left: 0;bottom: 0;display: block;position: absolute;width: 100%;overflow: hidden;background: url('../images/description_bg.png') repeat;}
#portfolio .element .description .inner{display: block;padding: 10px 10px 10px ;}
#portfolio .element .text, .portfolio1 .text{display: block;background: url('../images/marker.png') 270px -100% no-repeat #b8b8b8;padding: 14px 0 16px 10px;font-weight: bold;border-radius: 0 0 4px 4px; font-family:"Open Sans", sans-serif;  font-size:14px; line-height:22px;  color:#FFF}
#portfolio .element figure{position: relative;}
#portfolio .element a:hover .description{height: 76px;}
#portfolio .element a.text:hover, .portfolio1 a.text:hover{background-color: #0888ca;background-position: 270px 50%;}
#portfolio .element a:hover, .portfolio1 a:hover{color: #fff;}
.portfolio_box{position: relative;}

#container{/*min-height: 867px;*/}

.social_plugins{overflow: hidden;}
.social_plugins>div{margin: 10px 0 0;display: inline-block;}

.tags{position: absolute;top: -1px;right: 0;}

.info_box{margin-bottom: 25px;}
.info_box>div{width: 290px;margin-right: 29px;}
.info_box>figure{margin: 4px 0px 0 0;}

.button{margin-top: 25px;}

.portfolio1{width: 300px;float: left;}

.m_left{margin-left: 20px;}

.m_bot1{margin-bottom: 50px;}


/* =============================== Team Box========================*/

.team_box{}
.team{width: 300px;float: left;margin-left: 20px;text-align: center;position: relative;padding-bottom: 17px;}
.team>figure{margin-bottom: 23px;}
.team h3{margin-bottom: 16px;}
.team .text{ margin-bottom:10px; font-family:"Open Sans", sans-serif;  font-size:14px; line-height:22px; font-weight:400}
.social_box{text-align: center;padding: 27px 0 0;overflow: hidden;}
.social_box a{height: 24px;overflow: hidden;margin: 0 7px;display: inline-block;}
.social_box a:hover img{margin-top: -24px;}

.team_box .team:first-child{margin-left: 0;}

/*********************************page_5*************************************/

#get_in_touch{z-index: 1;padding-bottom: 150px;}
#contactForm .row{overflow: hidden;}
#contactForm .row label{width: 300px;display: block;float: left;margin-left: 20px;}
#contactForm .row label:first-child{margin-left: 0;}

.info{float: left;width: 300px; font-family:"Open Sans", sans-serif; font-weight:400; font-size:14px}
.info h5{margin-bottom: 19px;}
.contact_info{}
.contact_info span{color: #909090;}
.contact_info{}


/* Contact form */
#contactForm {padding:0px 0 0 0;width: 640px;float: left;}
#contactForm .success {width:246px;  padding:10px;}
#contactForm textarea, #contactForm input {margin:0;font-size:13px; border:1px solid #cacaca; border-radius: 3px; color:#909090; padding:13px 18px 15px;outline:none; position:relative; font-family: 'Open Sans', sans-serif;background:#f6f6f6;font-weight:400}
#contactForm input {width:262px;}
#contactForm textarea {overflow:auto; width:582px; height:128px;resize:none; float:left; margin: 0 0 0 0;}	
#contactForm label {display:block; min-height:67px; overflow:hidden;}	
#contactForm label.message { display:block; padding-bottom:0; }
#contactForm .button {margin-left:8px;}	
#contactForm .error, #contactForm .empty, #contactForm .success {display:none;}	
#contactForm .error, #contactForm .empty {text-align:left; color:red; font-size:11px; clear:both;}

#contactForm .buttons2 {overflow:hidden; position:relative; clear:both; padding-top:20px;}
#contactForm .buttons2 a{cursor:pointer;	margin-right:4px;	display: inline-block;text-align:center;font-size:18px;line-height:29px;color:#fff;background: #4e4e4e;border-radius: 3px;padding: 7px 18px 8px; font-family:"Open Sans", sans-serif; font-weight:800}
#contactForm .buttons2 a:hover{background: #0888ca;color: #fff;}

#contactForm button {overflow:hidden; position:relative; clear:both; padding-top:20px; margin-top:20px}
#contactForm button{cursor:pointer;	margin-right:4px;	display: inline-block;text-align:center;font-size:18px;line-height:29px;color:#fff;background: #4e4e4e;border-radius: 3px;padding: 7px 18px 8px; font-family:"Open Sans", sans-serif; font-weight:800}
#contactForm button:hover{background: #0888ca;color: #fff;}


#contactForm span{ display:block; margin: 0px 0 0 5px;}


.adress{}
.adress span{ display:inline-block; width:74px;}
.adress dt{ margin-bottom:14px;} 

.demo{}
.demo:hover{ text-decoration:underline;}

/****************************footer************************/
#footer{background: #a0a0a0 !important;border-top: 7px solid #de232a;height: 150px !important;color: #fff;}

.footer {padding:30px 0 26px;}
.social{ overflow:hidden;padding-right: 2px;float: left; margin-top: 10px}
.social a{ display:block; float:left;height:50px; overflow:hidden; margin-left:17px;}
.social a:first-child{margin: 0 0 0 0;}
.privacy{float: left;padding-top: 2px;}

ul.links-footer { float:left}
ul.links-footer li{float:left; border-left:#333 solid 1px; padding-left:10px}
ul.links-footer li:first-child{ border:none; padding:0}
ul.links-footer li a{color:#FFF; margin-right:10px; }
ul.links-footer li a:hover{color:#98c33c;}

.selos{ float:right; margin-top:10px}

/* Banner Conac 2017 */
.conac2017 .mobile {display:none !important;}


/*==================================RESPONSIVE LAYOUTS===============================================*/


@media screen and (min-width: 1000px) and (max-width: 1023px) {
	nav a{font-size:20px;}
}
@media only screen and (max-width: 1300px) and (min-width: 768px) {
    .responsive-video iframe{width: 330px; height: 195px; }
}


@media only screen and (max-width: 1024px) {
	body{min-width:960px;}
	nav{margin: 0;}
	.box1{padding-left: 10px;padding-right: 10px;}

    .main.planos-tab {width:90%;}
    .sf-menu>li>a{font-size: 14px;line-height: 24px;}
    #planos .table-planos .tab-col1 {width:55%; float: left;}
    #planos .table-planos .tab-col2 {width:15%; float: left;}
    #planos .table-planos .item {height:30px;}
}
@media only screen and (max-width: 995px) {
 body{min-width:920px;}
 .main{width: 900px;}
 .service{width: 300px;}
	ul.blog_list > li{position: relative;}
	#blog .col1{width: 640px;}
	#container .element img, #blog img, .info_box img, .portfolio1 img, .team img{width: 100%;}
	#blog .last{background: none;}
	#container .element, .portfolio1, .team{width: 286px;}
	#contactForm{width: 600px;}
	#contactForm .row label{width: 280px;}
	#contactForm input{width: 240px;}
	#contactForm textarea{width: 540px;}
}


@media only screen and (max-width: 767px) {
header h1 a {float:none; width: auto; height: auto; text-align: center;}
 body{min-width:420px;}
 ul.blog_list > li > figure{margin: 0;position: absolute;top: 192px;left: 0;}
 .main{width: 400px;}
.logo-pag{ margin:70px 0}
.logo-pag img{ width:50%; }
 #contactForm .row label{width: 100%;margin: 0;}
 .service, #blog .col, .info_box > div, .portfolio1, .team, #contactForm, .info{float: none;width:100%;margin: 0 0 20px;}
 #contactForm textarea, #contactForm input{width: 360px;}
 .service2:before, .service:after{display: none;}
 ul.blog_list > li > figure{float: none;}
 .pad_box{padding-left: 100px;}
	#blog .col1{margin-bottom: 30px;}
	#blog .last{background: inherit;}
	#search input{width: 328px;}
	#filter, .tags{position: relative;top: 0;left: 0;}
	.tags{margin-bottom: 20px;}
	#container{margin: 20px 0 0;}
	#container .element{margin-left: 0;width: 100%;height: 345px;}
	#footer{height: auto !important;}
	.footer{padding-top: 20px;}
	.footer>div{float: none;}
	.footer .privacy{margin-bottom: 10px;}
	#get_in_touch{padding-bottom: 30px;}

	.service .bg_none:after{display: block !important;}
	
	ul.links-footer{ margin-bottom:30px;}
	ul.links-footer li{float:left; border-top:#333 solid 1px; width:100%; border-left:none; padding-bottom:10px; padding-left:0}
ul.links-footer li:first-child{ border:none;padding-top:10px;padding-bottom:10px;}
ul.links-footer li a{color:#FFF; display:block; padding-top:10px;}
ul.links-footer li a:hover{color:#98c33c;}


.box2{height:600px;}

.box2 h2{margin-top:10px; line-height: normal}
.box2 h4{text-align:center}
.box2 p{ margin-top:20px; text-align:center}


.box-tablet-logo{width:100%; text-align:center}
.box-tablet-logo img{ width:60%; }
.box-tablet-tx{width:100%; text-align:center}
.box-tablet-video{width:100%; text-align:center; margin-bottom:50px}
.box-tablet-video img{width:70%; }

.flexslider .banner{position: static;width: 100%;top: 0;left: 0;text-align: center !important;}
.imgbannervideo{display:none!important}
.bannervideo{background:#387ca5}
.flexslider .inner, .flexslider .inner2{  color: #fff;padding-top: 0;}
.flexslider .title1, .flexslider .title2{padding: 8px 20px 12px;display: inline-block;margin:0 auto 10px}
.flexslider .title1{background:#0888ca;margin-bottom:3px;font-size:18px;line-height:21px;margin-top:-25%;width:110px;margin-left: -55%;}
.flexslider .title2{font-size: 18px; line-height: 24px; background-color:#98c33c}
.flex-direction-nav a{z-index: 999;width:40px;height:40px;font-size:40px;line-height:40px;margin-top:-20px;}
.responsive-video {margin: 30px 0 0 0;}
.responsive-video iframe{width: 330px; height: 195px;margin-bottom: 10px}

/* Banner Conac 2017 */
.conac2017 .desktop {display:none !important;}
.conac2017 .mobile {display:block !important;}
}



/* Contact form */



#validacaoqrcode .button {
	margin-left: 8px;
}

#validacaoqrcode .error, #validacaoqrcode .empty, #validacaoqrcode .success {
	display: none;
}

#validacaoqrcode .error, #validacaoqrcode .empty {
	text-align: left;
	color: red;
	font-size: 11px;
	clear: both;
}


#validacaoqrcode button {
	overflow: hidden;
	position: relative;
	clear: both;
	padding-top: 20px;
	margin-top: 20px
}

#validacaoqrcode button {
	cursor: pointer;
	margin-right: 4px;
	display: inline-block;
	text-align: center;
	font-size: 18px;
	line-height: 29px;
	color: #fff;
	background: #4e4e4e;
	border-radius: 3px;
	padding: 7px 18px 8px;
	font-family: "Open Sans", sans-serif;
	font-weight: 800
}


#validacaoqrcode span {
	display: block;
	margin: 0px 0 0 5px;
}

#validacaoqrcode .field-validation-error {
	color: red;
}

#validacaoqrcode a {
	margin-left: 8px;
}


#validacaoqrcode a {
	overflow: hidden;
	position: relative;
	clear: both;
	padding-top: 20px;
	margin-top: 20px
}

#validacaoqrcode a {
	cursor: pointer;
	margin-right: 4px;
	display: inline-block;
	text-align: center;
	font-size: 18px;
	line-height: 29px;
	color: #fff;
	background: #4e4e4e;
	border-radius: 3px;
	padding: 7px 18px 8px;
	font-family: "Open Sans", sans-serif;
	font-weight: 800
}




@media only screen and (max-width: 670px) {
	#planos .table-planos .title {padding:12px;}
    #planos .table-planos .tab-col1 {width:40%; float: left;}
    #planos .table-planos .tab-col2 {width:20%; float: left;}
}

@media only screen and (max-width: 479px) {
 body{min-width:300px;}
 .main{width: 90%;margin:auto}
 header h1 a {width: 70%;margin-top: 5px;}
 header h1 a img {width:100%}

 ul.blog_list > li > figure{top: 143px;}
 #search input{width: 208px;}
 #container .element{height: 255px;}
 #portfolio .element a.text:hover, .portfolio1 a.text:hover{background-position: 250px 50%;}
 #filter>li{margin-bottom: 10px;}
 #contactForm textarea, #contactForm input{width: 240px;}
 #contactForm .button1{margin-bottom: 10px;}
 .flex-direction-nav a{top:60px;width:30px;height:30px;font-size:30px;line-height:30px;    display: none;}

 #planos .table-planos .title {font-size:3vw;}
 #planos .table-planos .item {font-size:3vw;}
 #planos .table-planos .tab-col1 {width:40%; float: left;}
 #planos .table-planos .tab-col2 {width:20%; float: left;}
}

@media only screen and (max-width: 340px) {
    .flexslider .title1{font-size: 16px;width: 100px;margin-left:-160px}
    .flexslider .title2 {font-size: 16px;width: 270px;}
    .responsive-video iframe{width:320px;height:185px;margin: 20px auto 10px;}
    
}

.topBarlogin {
	background: #424244;
	color: #bbbbbb;
}
.topBarText {
	text-align: right;	
	font-size: smaller;
	font-weight: bold;
}
.topBarText i {
	margin-top: 6px;
}
.linktplogin {
	color:#bbbbbb;
}