*{opacity:1;-webkit-transition:all .5s ease-out;-moz-transition:all .4s ease-out;transition:all .2s ease-out}:hover{opacity:2;-webkit-transition:all .4s ease-out;-moz-transition:all .4s ease-out;transition:all .4s ease-out}
@font-face {
	font-family: 'SkolaSans';
	src: url('../fonts/webfontkit/skolasans-bold-webfont.eot');
	src: url('../fonts/webfontkit/skolasans-bold-webfont.ttf?#iefix') format('embedded-opentype'),
    url('../fonts/webfontkit/skolasans-bold-webfont.ttf#SkolaSans') format('svg'),
    url('../fonts/webfontkit/skolasans-bold-webfont.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
body{
	font-family: 'Arial', sans-serif;
	font-size: 15px;
	line-height: 20.5px;
	color: #363636;
}
.align_left{
	float: left;
}
.align_right{
	float: right;
}
.justify{
	text-align: justify;
}
.link_cursor{
	cursor: pointer;
}
a{
	color: #363636;
}
a:hover{
	color: #363636;
	text-decoration: none;
	-moz-text-shadow: 0px 1px 3px #9e9e9e;
	-webkit-text-shadow: 0px 1px 3px #9e9e9e;
	text-shadow: 0px 1px 3px #9e9e9e;
}
/*TÍTULOS*/
h1, h2, h3, h4, h5{
	font-family: 'SkolaSans', sans-serif;
	margin: 0;
}
h1{
	font-size: 62px;
	font-weight: bold;
	text-transform: uppercase;
	text-align: center;
	margin: 0;
	padding: 80px 0 70px 0;
}
h2{
	text-transform: lowercase;;
	font-size: 24px;
	padding: 0 0 20px 0;
}
.tt-a-ello span,  .tt-solucoes span, .tt-contato span {
	background: #fff;
	padding: 0 10px;
}
.tt-servicos span{
	background: #f0f4d4;
	padding: 0 10px;
}
.tt-jobs span{
	background: #dceee1;
	padding: 0 10px;
}
.tt-por-que-a-ello span{
	background: #e7e7f3;
	padding: 0 10px;
}
.tt-a-ello{
	background: url('../../imagens/layout/bg-tt-a-ello.png') top center no-repeat;
}
.tt-servicos{
	background: url('../../imagens/layout/bg-tt-servicos.png') top center no-repeat;
}
.tt-solucoes{
	background: url('../../imagens/layout/bg-tt-solucoes.png') top center no-repeat;
}
.tt-jobs{
	background: url('../../imagens/layout/bg-tt-jobs.png') top center no-repeat;
}
.tt-contato{
	background: url('../../imagens/layout/bg-tt-contato.png') top center no-repeat;
}
.tt-por-que-a-ello{
	background: url('../../imagens/layout/bg-tt-solucoes.png') top center no-repeat;
}
/*--*/
.img-center{
	margin: 0 auto;
}
/*SERVIÇOS*/
.roww{
	height: 294px;
}
#servicos .row figure{
	padding: 40px 0 0 0;
	margin: 0;
}
#servicos .row figure div{
	padding: 120px 40px 0 55px;
	position: absolute;
	display: block;
	z-index: 10;
	top: 0;
	left: 0;
	color: #fff;
	opacity: 0.0;
}
.img-hover{
	position: absolute;
	z-index: 9;
	opacity: 0.0;
}
#servicos .row figure div, .img-hover, #jobs .job-over{
	-webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;	
}
.img-out{
	position: absolute;
}
#servicos .row figure:hover div{
	padding: 130px 40px 0 55px;
	opacity: 0.9;
}
#servicos .row figure:hover .img-hover{
	opacity: 0.9;
}
#servicos .row figure img{
	max-width: 90%
}
/*HEADER*/
#topo{
	background: #ffdd00;
	width: 100%;
}
#menu-float{
	position: fixed;
	top: 0;
	z-index: 99;
	width: 100%;
	height: auto;
	background: #ffdd00;
	padding-top: 10px;
	display: none;
}
#menu-float img{
	padding: 10px 0 10px 0;
}
#menu-float ul.nav{
	padding-top: 10px!important;
}
#menu-float ul.nav li a:hover{
	background: transparent;
}
.logo {
    padding: 20px 0;
}
.nav {
    padding-top: 35px!important;
    float: right;
}
.nav > li > a{
	font-family: 'SkolaSans', sans-serif;
	text-transform: uppercase;
	color: #363636!important;
	font-size: 16px!important;
	font-weight: bold;
	padding: 0;
	margin: 0 0 0 15px;
}
.nav > li > a:hover{
	color: #fff!important;
	-webkit-text-shadow: 0 0 3px #ffdd00;
    -moz-text-shadow: 0 0 3px #ffdd00;
    text-shadow: 0 0 3px #ffdd00;
}
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus{
	background: transparent;
	background-color: transparent;
}
.navbar-default .navbar-collapse, .navbar-default .navbar-form, .navbar-default, .container-fluid{
	background: transparent;
	background-color: transparent;
	border: none; 
	margin: 0px!important;
	padding: 0px!important;
}
.container > .navbar-header, .container-fluid > .navbar-header, .container > .navbar-collapse, .container-fluid > .navbar-collapse {
	margin-right: -15px;
	margin-left: -15px;
}
/*BANNER*/
#banner{
	min-height: 400px;
}
/*CONTENT*/
.box, .box-servicos, .box-por-que-a-ello{
	padding-bottom: 80px!important;
}
.box-jobs{
	padding-bottom: 50px!important;
}
.box-jobs figure{
	padding-bottom: 40px;
}
.box-servicos{
	background: #f0f4d4;
}
.box-jobs{
	background: #dceee1;
}
.box-por-que-a-ello{
	background: #e7e7f3;
}
#jobs div{
	height: 400px;
}
#jobs div img{
	position: absolute;
}
#jobs .job-over{
	z-index: 9;
	opacity: 0.0;
}
#jobs .job-over:hover{
	opacity: 0.6;
}
#solucoes figure{
	padding-bottom: 30px;
}
/*CONTATO*/
.phone{
	display: block;
	padding-bottom: 30px;
	font-size: 24px;
	font-family: 'SkolaSans', sans-serif;
}
ul.redes-sociais{
	list-style-type: none;
	padding: 0;
	margin: 0;
}
ul.redes-sociais li{
	float: left;
	padding-right: 10px;
}
ul.redes-sociais li a:hover img{
	-webkit-transform:scale(1.1,1.1);
	-moz-transform:scale(1.1,1.1);
	-o-transform:scale(1.1,1.1);
	transform:scale(1.1,1.1);
}
#mapa iframe {
	max-width: 100%;
	min-width: 100%
}
/*RODAPÉ*/
#rodape{
	padding: 60px 0!important;
}
#rodape span{
	color: #999;
}
@media (min-width: 1199px) {
}
@media (min-width: 980px) and (max-width: 1199px) {
	.nav > li > a{
		margin: 0 10px!important;
		font-size: 15px!important;
	}
}
/* BOOTSTRAP = SM - tables em formato retrato até desktos paisagem */
@media (min-width: 768px) and (max-width: 979px) {
	.logo{
		padding: 30px 0;
	}
	.nav{
		padding-top: 40px!important;
		padding-left: 15px;
	}
	.nav > li > a{
		margin: 0 10px!important;
		font-size: 15px!important;
	}
	h2{
		text-align: left;
	}
	#menu-float ul.nav{
		padding-top: 6px!important;
	}
	#menu-float ul.nav a{
		font-size: 14px!important;
		margin: 0 0 0 10px!important;
	}
	.roww{
		height: 214px;
	}
	#servicos .row figure div{
		padding: 60px 40px 0 55px;
	}
	#servicos .row:hover figure div{
		padding: 70px 40px 0 55px;
	}
}
/* BOOTSTRAP XS = dispositivo em paisagem até tablets formato porta-retrato */
@media (max-width: 767px) {
	.logo{
		padding: 20px 0;
	}
	/*MENU*/
	#menu{
		width: 100%;
		background: #fff;
		border-radius: 8px;
		padding: 15px 5px!important;
		position: absolute;
		z-index: 99;
		background: #fbb033;
	}
	#menu ul{
		width: 100%;
		padding-right: 0;
		padding-left: 0;
		margin: 0;
		text-align: center;
	}
	.nav{
		padding-top: 0px!important;
	}
	.nav > li > a{
		padding: 0 0 10px 0;
	}
	.nav > li > a:hover{
		border: none;
		color: #363636!important;
	}
	.navbar-header {
    	margin-top: 25px!important;
	}
	.navbar-toggle{
		background: #fbb033;
	}
	nav .navbar-nav{
		border-top: none!important;
	}
	/*RODAPÉ*/
	footer{
		margin-bottom: 0;
	}
	#aello-img{
		text-align: center!important;
		padding-bottom: 30px
	}
	#aello-img img{
		margin: 0 auto
	}
	.nav > li > a{
		font-size: 13px!important;
		margin: 0;
	}
	/*SERVIÇOS*/
	.row p.text-center{
		padding: 0 15px;
	}
	.roww{
		height: 340px;
	}
	#servicos .row figure{
		text-align: center;
	}
	#servicos .row figure div{
		text-align: center;
		padding: 100px 0 0 0;
		position: initial;
		display: block;
		z-index: 10;
		top: initial;
		left: initial;
		color: #363636;
		opacity: 1.0;
		float: right;
		text-align: left;
		width: 58%;
	}
	.img-out{
		position: initial;
		margin: 0 auto;
		float: left;
	}
	/*SOLUÇÕES*/
	#solucoes .row div{
		padding-top: 20px;
		padding-bottom: 30px;
	}
	/*JOBS*/
	#jobs div{
		height: 420px;
	}
	#jobs .row div{
		text-align: center!important;
		padding-top: 20px;
		padding-bottom: 20px;
	}
	#jobs .row div img{
		position: initial;
		margin: 0 auto!important
	}
	#contato  address{
		text-align: center;
	}
	ul.redes-sociais li{
		text-align: center;
	}
	#solucoes div, #solucoes figure{
		text-align: center;
	}
	#solucoes figure img{
		margin: 0 auto
	}
	.redes-sociais li{
		width: 33.33%;
		text-align: center;
	}
	address{
		padding: 30px 0
	}
}
/* Celulares no formato paisagem e abaixo */
@media (max-width: 480px){
	/*MENU*/
	#menu{
		width: 100%;
		background: #fff;
		border-radius: 8px;
		padding: 15px 5px!important;
		position: absolute;
		z-index: 99;
		background: #fbb033;
	}
	#menu ul{
		width: 100%;
		padding-right: 0;
		padding-left: 0;
		margin: 0;
		text-align: center;
	}
	.nav{
		padding-top: 0px!important;
	}
	.nav > li > a{
		padding: 0 0 10px 0;
	}
	.nav > li > a:hover{
		border: none;
	}
	.navbar-header {
    	margin-top: 25px!important;
	}
	.navbar-toggle{
		background: #fbb033;
	}
	/*BANNER*/
	#banner{
		min-height: 200px;
	}
	/*RODAPÉ*/
	footer{
		margin-bottom: 0;
	}
	h1{
		font-size: 50px;
	}
	/*SERVIÇOS*/
	.row p.text-center{
		padding: 0 15px;
	}
	.roww{
		height: 415px;
		text-align: center;
	}
	#servicos .row{
		text-align: center;
	}
	#servicos .row figure div{
		text-align: center;
		padding: 0;
		position: absolute;
		display: block;
		z-index: 10;
		top: 325;
		left: initial;
		color: #363636;
		opacity: 1.0;
		width: 100%;
	}
	.img-out{
		position: initial;
		margin: 0 auto;
		float: initial;
	}
	.redes-sociais li{
		width: 33.33%;
		text-align: center;
	}
	address{
		padding: 30px 0
	}
}