@charset "utf-8";

@import url("fonts.css");

/* ******** FONTES 
robotothin
robotolight
robotoregular
robotomedium
robotobold
robotoblack
*************** */

*{margin:0px; padding:0px; list-style:none; text-decoration:none; outline: none;}
body{margin:0px; padding:0px; color:#000; font:18px/21px 'robotomedium';}

.ocultar{position:absolute; top:0px; left:-9999px;}
section{width:100%; float:left; clear:both;}
h1{text-transform: uppercase;}

p{margin:0px 0px 15px 0px; padding:0px;}
a{color:#333333; text-decoration:none;}
.clear{display: block; clear: both;}

.btn{display: inline-block; padding: 15px 35px; color: #000; background-color: #f0c424; font:16px 'robotolight'; text-transform: uppercase;}

#loading{width: 100%; height: 100%; display: block; position: fixed; top: 0px; left: 0px; z-index: 99999999; background: #000 url(../image/loading.gif) no-repeat center center;}

.embed { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; }
.embed iframe, .embed object, .embed embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* *********************
HEADER
********************* */
header{width: 100%; float: left; padding: 0px; background: #000; position: fixed; top: -71px; left: 0px; z-index: 999; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -o-transition: all linear .3s; transition: all linear .3;}

header .container{max-width: 1180px; margin: 0px auto; padding: 0px 25px; position: relative;}
header .idioma-menu{font-size: 14px; color: #fff; float: left; padding: 25px 0px;}
header .idioma-menu a{color: #FFF; display: inline-block; padding: 0px 4px;}
header .idioma-menu a.ativo{color: #000; background-color: #f0c424;}

header .menu{position: relative;}
header .menu li{height: auto; float: left; padding: 15px 0px 17px 0px; margin: 0px 50px 0px 0px; position: relative;}
header .menu li a{color: #f0c424; font: 20px/15px 'robotolight'; padding: 5px 0px; margin: 0px; text-transform: uppercase;}
header .menu li a span{    clear: both; color: #FFF; font-size: 12px; display: table;}
header .menu li a:hover span{background: #f0c424; padding: 0px 3px; color: #000;}
header .menu li a.ativo span{background: #f0c424; padding: 0px 3px; color: #000;}
header .menu li.icons {float: right; padding: 19px 0px 0px 0px; margin: 0px;}
header .menu li.icons div{font-size: 24px; color: #f0c424; position: relative; display: inline-block; padding: 0px 0px 24px 0px;}
header .menu li.icons .phone-header span{width:230px; padding:15px; background: #232422; display: none; font:14px "robotoregular"; color:#FFF; position: absolute; left: -230px; top: 48px;}
header .menu li.icons .phone-header span strong{color: #f0c424;}
header .menu li.icons .phone-header:hover span{display: block;}
header .menu li.icons .email-header span{width:165px; padding:15px; background: #232422; display: none; font:14px "robotoregular"; color:#FFF; position: absolute; left: -160px; top: 48px;}
header .menu li.icons .email-header span a{color: #f0c424; font-size: 12px;}
header .menu li.icons .email-header:hover span{display: block;}

header .menu-interno{position: relative;}
header .menu-interno li{height: auto; float: left; padding: 15px 0px 17px 0px; margin: 0px 50px 0px 0px; position: relative;}
header .menu-interno li a{color: #f0c424; font: 20px/15px 'robotolight'; padding: 5px 0px; margin: 0px; text-transform: uppercase;}
header .menu-interno li a span{    clear: both; color: #FFF; font-size: 12px; display: table;}
header .menu-interno li a:hover span{background: #f0c424; padding: 0px 3px; color: #000;}
header .menu-interno li a.ativo span{background: #f0c424; padding: 0px 3px; color: #000;}
header .menu-interno li.icons {float: right; padding: 19px 0px 0px 0px; margin: 0px;}
header .menu-interno li.icons div{font-size: 24px; color: #f0c424; position: relative; display: inline-block; padding: 0px 0px 24px 0px;}
header .menu-interno li.icons .phone-header span{width:230px; padding:15px; background: #232422; display: none; font:14px "robotoregular"; color:#FFF; position: absolute; left: -230px; top: 48px;}
header .menu-interno li.icons .phone-header span strong{color: #f0c424;}
header .menu-interno li.icons .phone-header:hover span{display: block;}
header .menu-interno li.icons .email-header span{width:165px; padding:15px; background: #232422; display: none; font:14px "robotoregular"; color:#FFF; position: absolute; left: -160px; top: 48px;}
header .menu-interno li.icons .email-header span a{color: #f0c424; font-size: 12px;}
header .menu-interno li.icons .email-header:hover span{display: block;}


header .gatilho-menu{display: none;}

header.fixed{top: 0px;}
header.interna{top: 0px;}

/* *********************
MAIN PAGE
********************* */
#main-page{background: url(../image/backgrounds/main-page.jpg) no-repeat center center; background-size: auto 100%;}
#main-page .logo{display: block; position: absolute; top:80px; right: 80px;}
#main-page .gatilho-menu-inicial{font-size: 25px; margin: 75px 32px 35px 32px; display: block; cursor: pointer;}
#main-page .gatilho-menu-inicial i{font-size: 35px;}
#main-page .menu-inicial {margin: 0px 35px; display: none;}
#main-page .menu-inicial li{margin: 0px 0px 15px 0px;}
#main-page .menu-inicial li a{color: #000; font: 50px/50px 'robotolight'; display: block;}
#main-page .menu-inicial li a span{font: 30px 'robotothin'}
#main-page h1{width: 300px; font: 45px/55px 'robotolight'; margin: 50px 35px 35px 35px;}
#main-page h1 span{display: block; font: 40px/50px 'robotothin'; padding: 35px 0px 0px 0px;}

/* *********************
ABOUT US
********************* */
#about-us{background: url(../image/backgrounds/about.jpg) no-repeat center top; padding: 100px 0px 0px 0px;}
#about-us .box-text{max-width: 1090px; margin: 0px auto; padding: 0px 0px 0px 250px; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#about-us .box-text h1{width: 170px; position: absolute; top: 5px; left: 0px; text-align: right; font: 55px/50px 'robotolight';}
#about-us .box-text h1 span{font: 25px/25px 'robotothin';}
#about-us .box-text h2{font-family: 'robotolight';}
#about-us .box-text p{font-family: 'robotolight';}
#about-us .box-text .pt{display: block; margin: 0px 0px 55px 0px;}
#about-us .box-text .pt h2{font-size: 40px; line-height: 45px;}
#about-us .box-text .pt p{font-size: 30px; line-height: 35px;}
#about-us .box-text .usa{display: block; margin: 0px 0px 100px 0px;}
#about-us .box-text .usa h2{font-size: 30x; font-style: italic; line-height: 35px;}
#about-us .box-text .usa p{font-size: 25px; font-style: italic; line-height: 30px;}

#about-us .banner-about-us{width: 100%; height: 545px; clear: both; background: url(../image/banners/about.jpg) no-repeat center top;}

/* *********************
SERVICES 
********************* */
#services{background: url(../image/backgrounds/services.jpg) repeat 0 0; padding: 100px 0px 0px 0px;}
#services .box-text{max-width: 1230px; margin: 0px auto; padding: 0px 0px 0px 350px; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#services .box-text h1{width: 260px; position: absolute; top: 0px; left: 0px; text-align: right; font: 55px/50px 'robotolight';  color: #FFF;}
#services .box-text h1 span{font: 25px/25px 'robotothin';}
#services .box-text p{font-family: 'robotolight'; color: #FFF;}
#services .box-text .pt{display: block; margin: 0px 0px 55px 0px;}
#services .box-text .pt p{font-size: 26px; line-height: 35px;}
#services .box-text .usa{display: block; margin: 0px 0px 100px 0px;}
#services .box-text .usa p{font-size: 22px; font-style: italic; line-height: 30px;}
#services .list-services{width: 100%; float: left; clear: both;}
#services .list-services li{width: 25%; float: left; background: #000; position: relative; overflow: hidden;}
#services .list-services li:nth-child(even){background: #1a1a1a;}

#services .list-services li .bg{position: relative; display: block;}
#services .list-services li .bg .base{width: 100%; height: auto;}
#services .list-services li .bg .image{width: 70%; height: 70%; margin: 15%; position: absolute; top: 0px; left: 0px; z-index: 1; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -o-transition: all linear .3s; transition: all linear .3s;}
#services .list-services li:hover .bg .image{width: 80%; height: 80%; margin: 10%;}

#services .list-services li h2{position: absolute; top: 0px; left: -99999px;}
#services .list-services li .bg-hover{width: 100%; height: 100%; display: block; position: absolute; top: -100%; left: 0px; background-color: #000; z-index: 2; opacity:0.85; -moz-opacity: 0.85; filter: alpha(opacity=85); -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -o-transition: all linear .3s; transition: all linear .3s;}
#services .list-services li:hover .bg-hover{top: 0%;}

#services .list-services li .text{width: 100%; height: 100%; display: block; padding: 30px; position: absolute; top: 0px; left: 0px; z-index: 9; opacity:0.00; -moz-opacity: 0.00; filter: alpha(opacity=00); -webkit-transition: all linear .5s; -moz-transition: all linear .5s; -o-transition: all linear .5s; transition: all linear .5s; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#services .list-services li:hover .text{opacity:0.99; -moz-opacity: 0.99; filter: alpha(opacity=99);}
#services .list-services li .text .pt{font: 18px/21px "robotolight"; color: #FFF;}
#services .list-services li .text .usa{font: 16px/19px "robotolight"; color: #7D7D7D; font-style: italic;}


/* *********************
PORTFOLIO
********************* */
#portfolio{width: 100%; float: left; clear: both; background-color: #f0c424; position: relative; z-index: 2;}
#portfolio ul{width: 100%; float: left; clear: both;}
#portfolio ul li{width: 20%; float: left; position: relative; overflow: hidden;}
#portfolio ul li a{display: block;}
#portfolio ul li .base{width: 100%; height: auto; position: relative; float: left;}
#portfolio ul li .thumb{width: 100%; height: auto; position: absolute; top: 0px; left: 0px;   -webkit-transition: all linear .2s; -moz-transition: all linear .2s; -o-transition: all linear .2s; transition: all linear .2;}
#portfolio ul li:hover .thumb{width: 106%; height: auto; top: -3%; left: -3%;}
#portfolio ul li a:before{content: ""; width: 100%; height: 100%; position: absolute; top: -100%; left: 0px;  z-index: 1; background: #000; opacity:0.77; -moz-opacity: 0.77; filter: alpha(opacity=77); -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -o-transition: all linear .3s; transition: all linear .3s;}
#portfolio ul li a:hover:before{top: 0px;}
#portfolio ul li .info{width: 100%; height: 200px; display: block; margin: -100px 0px 0px 0px; text-align: center; color: #FFF; position: absolute; top: 50%; left: 0px; opacity:0.00; -moz-opacity: 0.00; z-index: 3; filter: alpha(opacity=0); -webkit-transition: all linear .1s; -moz-transition: all linear .3s; -o-transition: all linear .3s; transition: all linear .3s;}
#portfolio ul li:hover .info{opacity:0.99; -moz-opacity: 0.99; filter: alpha(opacity=1);}
#portfolio ul li .info h2{font: 25px 'robotomedium'; margin: 0px 0px 10px 0px; padding: 5px 0px 0px 0px; text-transform: uppercase;}
#portfolio ul li .info p{font: 13px 'robotolight'; color: #e3e4e5;}

#portfolio .box-text{max-width: 1230px; margin: 0px auto; padding: 120px 0px 0px 380px; position: relative;  z-index: 3; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#portfolio .box-text h1{width: 306px; position: absolute; top: 100px; left: 15px; text-align: right; font: 55px/35px 'robotolight'; color: #FFF;}
#portfolio .box-text h1 span{font: 25px/25px 'robotothin';}
#portfolio .box-text p{font-family: 'robotolight'; color: #FFF;}
#portfolio .box-text .pt{display: block; margin: 0px 0px 0px 0px;}
#portfolio .box-text .pt p{font-size: 26px; line-height: 35px;}
#portfolio .box-text .usa{display: block; margin: 0px 0px 100px 0px;}
#portfolio .box-text .usa p{font-size: 22px; font-style: italic; line-height: 30px;}

.pg-interna{background-color: #1B1B1B;}
#job{width: 100%; float: left; clear: both; padding: 100px 0 0 0;}
#job .informacoes{width: 280px; position: absolute; top: 0; right: 0; color: #FFF;}
#job .informacoes .dados{width: 100%;  padding: 25px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#job .informacoes .like{width: 100%; padding: 15px 0 0 0; border-top: 1px solid #171717}
#job .informacoes h1{font: 18px 'robotobold';  color: #f0c424; margin: 0px;}
#job .informacoes h2{font: 14px 'robotolight'; margin: 0;}
#job .informacoes .pt{font: 14px/18px "robotolight"; color: #FFF; margin: 0px 0px 15px 0px; padding: 20px 0 0 0;}
#job .informacoes .usa{font: 14px/18px "robotolight"; color: #7D7D7D; font-style: italic; margin: 0px 0px 15px 0px;}
#job .informacoes .like{width: 100%; float: left; clear: both; margin: 0 0 25px; padding: 25px;}
#job .informacoes .compartilhamento{position: fixed; bottom: 0px; right: 5%; padding: 25px;}
#job .informacoes .compartilhamento li{float: left;}
#job .informacoes .compartilhamento li a{font-size: 28px; color: #fff;}
#job .informacoes .compartilhamento li a.icon-whats{margin-left: 5px;}

#job .container{max-width: 90%; margin: 0px auto; background: #000; position: relative;}
#job .image{width: 100%; padding: 0 280px 0 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#job .image img{width: 100%; height: auto; float: left; clear: both;}



/* *********************
CUSTOMERS
********************* */
#customers{background: url(../image/backgrounds/services.jpg) repeat 0 0;}
#customers .box-text{max-width: 1230px; margin: 0px auto; padding: 0px 0px 0px 350px; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#customers .box-text h1{width: 260px; position: absolute; top: 10px; left: 0px; text-align: right; font: 55px/35px 'robotolight'; color: #FFF;}
#customers .box-text h1 span{font: 25px/25px 'robotothin';}
#customers .box-text p{font-family: 'robotolight'; color: #FFF;}
#customers .box-text .pt{display: block; margin: 0px 0px 0px 0px;}
#customers .box-text .pt p{font-size: 26px; line-height: 35px;}
#customers .box-text .usa{display: block; margin: 0px 0px 100px 0px;}
#customers .box-text .usa p{font-size: 22px; font-style: italic; line-height: 30px;}
#customers ul{width: 100%; float: left; clear: both; background: #e3e4e5;}
#customers ul li{width: 16.66%; float: left; position: relative; border: solid 1px #ccc; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#customers ul li .logo{width: 70%; height: 70%; margin: 15%; position: absolute; top: 0; left: 0; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -o-transition: all linear .3s; transition: all linear .3;}
#customers ul li:hover .logo{width: 76%; height: 76%; margin: 12%;}
#customers ul li .base{width: 100%; height: auto; position: relative; float: left;} 

/* *********************
CONTACT US
********************* */
#contact{background: #f1c524; color: #000; clear: both; padding: 100px 0px 80px 0px;}
#contact .container{max-width: 1230px; margin: 0px auto;}
#contact .col-contact{width: 60%; float: left;}
#contact .col-contact .box-text{max-width: 1230px; margin: 0px; padding: 0px 0px 0px 300px; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#contact .col-contact .box-text h1{width: 245px; position: absolute; top: 10px; left: 0px; text-align: right; font: 55px/35px 'robotolight';  color: #000;}
#contact .col-contact .box-text h1 span{font: 25px/25px 'robotothin';}
#contact .col-contact .box-text .pt{display: block; margin: 0px 0px 0px 0px;}
#contact .col-contact .box-text .pt p{font-size: 21px; line-height: 35px; font-family: 'robotoregular';}
#contact .col-contact .box-text .usa{display: block; margin: 0px 0px 35px 0px;}
#contact .col-contact .box-text .usa p{font-size: 18px; font-style: italic; line-height: 30px; font-family: 'robotolight';}
#contact .col-contact .email{font-size: 35px; color: #000; margin: 0px 0px 35px 0px; display: block;}

#contact .col-contact .box-endereco div{width: 100%; float: left; position: relative; margin: 0px 0px 35px 0px;}
#contact .col-contact .box-endereco h2{width: 140px; float: left; text-align: justify; margin: 0px 35px 0px 0px; font: 35px/40px 'robotobold';} 
#contact .col-contact .box-endereco h2 span{display: block; font: 20px/15px 'robotolight'; text-align: right;}
#contact .col-contact .box-endereco p{padding: 26px 0px 0px 28px; position: relative; font: 25px/25px 'robotolight'; float: left; display: block;}
#contact .col-contact .box-endereco p:before{content: '\e881'; font-family: "fontello"; font-style: normal; font-weight: normal; font-size: 35px; speak: none; display: block; position: absolute; left: 0px; bottom: 6px;}
#contact .col-contact .list-social{width: 100%; float: left; clear: both;}
#contact .col-contact .list-social li{float: left; margin: 0px 20px 0px 0px;}
#contact .col-contact .list-social li a{width: 46px; height: 46px; display: block; background: url(../image/icons/social-midia.png);}
#contact .col-contact .list-social li.titulo{padding: 14px 0px;}
#contact .col-contact .list-social li.facebook a{background-position: 0px 0px;}
#contact .col-contact .list-social li.behance a{background-position: -47px 0px;}
#contact .col-contact .list-social li.linkedin a{background-position: -93px 0px;}
#contact .col-contact .list-social li.youtube a{background-position: -140px 0px;}

#contact .form-contato{width: 37%; float: right;}
#contact .form-contato h2{text-align: center; font: 35px/40px 'robotobold'; margin: 0px 0px 25px 0px; text-transform: uppercase;}
#contact .form-contato h2 span{display: block; font: 25px/25px 'robotothin';}
#contact .form-contato div{width: 100%; clear: both; position: relative; margin: 0px 0px 15px 0px;}

.input01{width: 100%; padding: 18px; background: #957b21; border: solid 1px #957b21; font:18px/21px 'robotolight'; color: #f1c524; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.input01:focus{border: solid 1px #000; background: #000;}
.textarea01{width: 100%; height: 180px; padding: 18px; background: #957b21; border: solid 1px #957b21; font:18px/21px 'robotolight'; overflow: auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.textarea01:focus{border: solid 1px #000; background: #000; color: #f1c524;}
.submit01{width: 100%; padding: 15px 0px; text-align: center; background: #000; border-color: 0px; font:18px/21px 'robotolight'; color: #FFF; border: 0px; cursor: pointer; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}

::-webkit-input-placeholder {color: #FFF;}
:-moz-placeholder {color: #FFF;}
::-moz-placeholder {color: #FFF;}
:-ms-input-placeholder {color: #FFF;}

#copyright{width: 100%; padding: 25px 20px 10px 20px; clear: both; background-color: #000; color: #fff; text-align: center; font: 13px/18px "robotolight"; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#copyright .atrios{display: inline-block; position: relative; padding: 0px 0px 0px 28px; color: #fff;}
#copyright .atrios:before{content: ""; width: 18px; height: 18px; display: block; position: absolute; top: 0px; left: 3px; background: url(../image/agencia-atrios.png) no-repeat 0 0; -webkit-transition: all linear .3s; -moz-transition: all linear .3s; -o-transition: all linear .3s; transition: all linear .3;}
#copyright .atrios:hover:before{background-position: 0px -18px;}


@media screen and (max-width: 1024px) {
	header .menu{position: fixed; top: 50px; left: 0px; display: none;}
	header .menu li{width: 100%; text-align: center; background-color: #000;}
	header .menu li a span{clear: both; color: #FFF; display: block;}

	header .menu li.icons {float: right; padding: 19px 0px 35px 0px; margin: 0px;}
	header .menu li.icons a{font-size: 24px; color: #f0c424;}
	
	header .gatilho-menu{display: block; text-align: center; color: #fff; font: 23px/50px "robotolight"; cursor: pointer; padding: 0px 0px 5px 0px;}
	
	#main-page{background: url(../image/backgrounds/main-page2.png) repeat 0 0; background-size: inherit;}
	#main-page .logo{width: 100px; display: block; position: absolute; top:15px; right: 40px;}
	#main-page .logo img{width: 100%; height: auto;}

	#about-us .box-text{max-width: 1090px; margin: 0px auto; padding:0px 15px; position: relative;}
	#about-us .box-text h1{width: 100%; position: relative; top: inherit; left: inherit; text-align: left; font: 35px/35px 'robotolight'; margin: 0px 0px 35px 0px;}
	#customers .box-text{max-width: 1090px; margin: 0px auto; padding:0px 15px; position: relative;}
	#customers .box-text h1{width: 100%; position: relative; top: inherit; left: inherit; text-align: left; font: 35px/35px 'robotolight'; margin: 0px 0px 35px 0px;}
	#portfolio .box-text{max-width: 1090px; margin: 0px auto; padding:0px 15px; position: relative;}
	#portfolio .box-text h1{width: 100%; position: relative; top: inherit; left: inherit; text-align: left; font: 35px/35px 'robotolight'; margin: 0px 0px 35px 0px;}
	#services .box-text{max-width: 1090px; margin: 0px auto; padding:0px 15px; position: relative;}
	#services .box-text h1{width: 100%; position: relative; top: inherit; left: inherit; text-align: left; font: 35px/35px 'robotolight'; margin: 0px 0px 35px 0px;}

	#portfolio ul li{width: 33.3%;}
	
	#job .informacoes{width: 40%; float: left;}
	#job .image{width: 60%; float: right;}

	#customers ul li{width: 25%;}

	#services .list-services li{width: 50%; background-color: #1a1a1a;}
	
	#contact{padding: 100px 20px 0px 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
	#contact .col-contact{width: 100%; clear: both;}
	#contact .col-contact .email{font-size: 21px;}
	#contact .col-contact .box-text{max-width: 1230px; margin: 0px; padding: 0px; position: relative;}
	#contact .col-contact .box-text h1{width: 100%; position: relative; top: inherit; left: inherit; text-align: left; font: 55px/35px 'robotolight';  color: #000;}
	
	#contact .col-contact .box-endereco h2{width: 100%; float: left;} 
	#contact .col-contact .box-endereco h2 span{display: block; font: 20px/15px 'robotolight'; text-align: left;}

	#contact .col-contact .box-endereco p{padding: 26px 0px 0px 28px; position: relative; font: 25px/25px 'robotolight'; float: left; display: block;}
	#contact .col-contact .box-endereco p:before{content: '\e881'; font-family: "fontello"; font-style: normal; font-weight: normal; font-size: 35px; speak: none; display: block; position: absolute; left: 0px; bottom: 6px;}

	#contact .form-contato{width: 100%; float: right;}
	#contact .col-contact .box-text h1{width: 100%; position: relative; top: inherit; left: inherit; text-align: left; font: 35px/35px 'robotolight'; margin: 0px 0px 35px 0px;}
	#contact .col-contact .box-text h1 span{font: 25px/25px 'robotothin';}
	
	#contact .col-contact .list-social{text-align: center; margin: 0px 0px 35px 0px;}
	#contact .col-contact .list-social li.titulo{padding: 25px 0px; width: 100%; text-align: center;}
	#contact .col-contact .list-social li{display: inline-block; float: initial;}
}

@media screen and (max-width: 860px) {
	#portfolio ul li{width: 50%;}
	#job .informacoes{width: 100%; float: left; clear: both;}
	#job .image{width: 100%; float: right; clear: both;}
}

@media screen and (max-width: 560px) {
	#portfolio ul li{width: 100%;}
	#customers ul li{width: 50%;}
	#services .list-services li{width: 100%;} 
}