body { background-color: #4C4948; font-family: 'Source Sans Pro', sans-serif; color: #fff; font-size: 14px; }

.img { max-width: 100%; }
.middle { display: table-cell; text-align: center; vertical-align: middle; }
.row { margin: 0 !important; }

/* Header */
header { background-color: #2F2E2E; }
header .container { height: 48px; position: relative; }

header .logo { text-align: center; display: block; }
header .logo .logo-img { width: 174px; height: 45px; }

header .menu { position: absolute; top: 70px; right: 54px; z-index: 10000; width: 223px; }
header .menu nav { background-color: #F7931D; border: solid 2px #fff; display: block; padding: 40px 0; border-radius: 20px; position: relative; margin: 0; }
header .menu nav a { display: block; color: #fff; font-weight: 300; text-transform: uppercase; font-size: 23px; line-height: 23px; text-align: center; padding: 7px 0; cursor: pointer;  }
header .menu nav a:hover, header .menu nav a:active { color: #D3D3D3; }

header .menu nav:after, header .menu nav:before { content: ""; position: absolute; display: block; width: 0; height: 0;  -moz-transform: rotate(35deg); -webkit-transform: rotate(35deg); -o-transform: rotate(35deg); -ms-transform: rotate(35deg); transform: rotate(35deg); }
header .menu nav:after { top: -32px; right: -21px; border-left: 25px solid transparent; border-right: 25px solid transparent; border-bottom: 50px solid #fff; z-index: 1; }
header .menu nav:before { top: -28px; right: -18px; border-left: 25px solid transparent; border-right: 25px solid transparent; border-bottom: 50px solid #F7931D; z-index: 2; }

header .toggle-menu { position: absolute; top: 0; right: 0; height: 48px; width: 48px; padding-top: 10px; cursor: pointer; }
header .toggle-menu .bar { display: block; background-color: #F7931D; width: 25px; height: 6px; border-radius: 4px; margin: 2px auto; }
header .toggle-menu:hover .bar, header .toggle-menu:active .bar { background-color: #CC720E; }

/* Footer */
footer { background-color: #2F2E2E; padding: 20px 0; }
footer .telefone { font-size: 32px; line-height: 32px; color: #F7931D; font-weight: 300; text-align: center; }
footer .telefone span { color: #fff; }
footer .infos { color: #908C8C; font-size: 12px; line-height: 32px; text-align: center; }
footer .infos .logo { display: block; margin: 10px auto 0 auto; }

/* Welcome */
.welcome-slider { width: 100%; overflow: hidden; display: block; position: relative; }
.welcome-slider .sy-caption-wrap { left: 0; width: 100%; height: 75px; bottom: inherit; top: 50%; display: table; margin-top: -37px; }
.welcome-slider .sy-caption-wrap .sy-caption { display: table-cell; vertical-align: middle; left: 0; background-color: transparent; padding: 0; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; text-align: center; }
.welcome-slider .sy-caption-wrap .sy-caption { font-size: 16px; line-height: 18px; text-shadow: 0 0 12px #000000; }

/* Empresa */
.empresa {}
.empresa h1 { font-size: 28px; line-height: 28px; color: #fff; text-align: center; margin: 0; display: block; position: relative; background-color: #F7931D; font-weight: 300; padding: 5px 0; }
.empresa .texto { background-color: #fff; padding: 7px 15px; }
.empresa .texto p { color: #6D6E70; text-align: justify; margin: 0; padding: 7px 0; }
.empresa .left-title { display: none; }

.empresa-colunas { background-color: #fff; color: #6D6E70; }
.empresa-colunas .bloco { display: none; }
.empresa-colunas .coluna { padding: 0 15px;  }
.empresa-colunas .coluna p { text-align: justify; margin-top: 5px; }
.empresa-colunas h2 { color: #00ADEF; font-size: 18px; line-height: 18px; margin: 10px 0 0 0; display: block; font-weight: 400; }

/* Servicos */
.servicos { background: #1f6ba7 url('../img/bg-blue.jpg') no-repeat top center; }
.servicos h2 { margin: 20px 0; font-weight: 300; color: #F7931D; line-height: 30px; font-size: 30px; display: block; text-align: center; }
.servicos .lista { position: relative; margin: 0; padding-bottom: 20px; text-align: center; }

.servicos .lista .item { display: inline-block; margin: 10px; }
.servicos .lista .item .circulo { margin: 0 auto; color: #fff; padding: 0 10px; background-color: #F7931D; display: table; width: 176px; height: 176px; -webkit-border-radius: 88px; border-radius: 88px; } 
.servicos .lista .item .circulo h3 { font-size: 26px; line-height: 26px; font-weight: 700; margin: 0; padding: 0; display: block; }
.servicos .lista .item .circulo p { margin: 5px 0 0; font-size: 18px; line-height: 19px; }
.servicos .lista .item .circulo:hover { background-color: #fff; color: #F7931D; cursor: pointer; }

.servicos .lista .item .detalhes { text-align: left; display: none; background-color: #fff; color: #6D6E70; padding: 0 20px 20px; -webkit-border-radius: 10px; border-radius: 10px; }
.servicos .lista .item .detalhes h4 { font-weight: 700; font-size: 18px; text-transform: uppercase; margin: 20px 0 0; padding: 0; }
.servicos .lista .item .detalhes p { font-size: 14px; margin: 0; }

.servicos .lista .item.active .circulo { color: #F7931D; background-color: #fff; }
.servicos .lista .item.active .detalhes { display: block; }

/* Suporte */
.suporte { background: #fff; }
.suporte h2 { margin: 20px 0; font-weight: 300; color: #F7931D; line-height: 30px; font-size: 30px; display: block; text-align: center; }

.suporte .diagrama { text-align: center; padding: 0 10px 30px; }
.suporte .diagrama .small { display: inline-block; }
.suporte .diagrama .big { display: none; }

/* Certificacoes */
.certificacoes {}
.certificacoes h1 { font-size: 28px; line-height: 28px; color: #F7931D; text-align: center; margin: 0; display: block; position: relative; font-weight: 300; padding: 5px 0; }
.certificacoes .lista { padding: 10px; }
.certificacoes .lista .item { padding: 10px; text-align: center }
.certificacoes .lista .item .img { -webkit-border-radius: 6px; border-radius: 6px; display: inline-block; }
.certificacoes .left-title { display: none; }

/* Parceiros */
.parceiros { background-color: #F7931D; }
.parceiros .bloco { display: none; }
.parceiros h2 { margin: 20px 0 0; font-weight: 300; line-height: 30px; font-size: 30px; display: block; text-align: center; }
.parceiros .texto { padding: 0 20px; text-align: justify; }
.parceiros .lista { padding: 10px; }
.parceiros .lista .item { padding: 10px; text-align: center }
.parceiros .lista .item .img { -webkit-border-radius: 6px; border-radius: 6px; display: inline-block; }

/* Itil */
.itil { background-color: #fff; padding: 20px 20px; }
.itil h2 { font-size: 28px; line-height: 28px; color: #F7931D; font-weight: 300; margin: 0; padding: 0; text-align: center; }
.itil p { color: #6D6E70; text-align: justify; }
.itil .image { text-align: center; display: block; clear: both; }
.itil .image img { display: inline-block; }

/* Contato */
.contato { padding: 20px; }
.contato h2 { color: #F7931D; font-weight: 300; margin: 0; padding: 0; font-size: 31px; line-height: 24px; }
.contato p { font-size: 17px; line-height: 17px; color: #fff; font-weight: 300; }
.contato .endereco { clear: both; text-align: center; }
.contato .endereco .pin { display: block; margin: 0 auto; }
.contato .endereco address { font-size: 17px; line-height: 17px; color: #fff; font-weight: 300; font-style: normal; margin-top: 10px; }

/* Forms */
.form-group { position: relative; }

.form-group input[type=text],
.form-group input[type=email],
.form-group input[type=password],
.form-group select,
.form-group textarea { color: #000; font-weight: 400; padding: 5px; display: block; width: 100%; height: 34px; background-color: #fff; border: solid 2px #f3f3f3; outline: none; -webkit-border-radius: 0; border-radius: 0; }

.form-group input[type=text]:focus,
.form-group input[type=email]:focus,
.form-group input[type=password]:focus,
.form-group select:focus,
.form-group textarea:focus { border-color: #F7931D; }

.form-group textarea { resize: none; height: 120px; }

.form-group label.error { color: #ff5151; white-space: nowrap; font-weight: 400; position: absolute; bottom: -14px; right: 0px; text-align: right; font-size: 12px; line-height: 14px; font-weight: 400; }
.form-group input[type=text].error,
.form-group input[type=email].error,
.form-group input[type=password].error,
.form-group select.error,
.form-group textarea.error { border-color: #ff5151; }

.form-group button, .btn { font-size: 14px; text-align: center; text-transform: uppercase; display: block; width: 100%; outline: none; height: 32px; border: solid 2px #F7931D; background-color: #F7931D; color: #fff; letter-spacing: 1px; font-weight: 300; }
.form-group button:hover, .btn:hover { color: #fff; border-color: #fab716; background-color: #fab716; }
.form-group button:active , .btn:active { color: #fff; border-color: #2F2E2E; background-color: #2F2E2E; }
.form-group.interest { display: none; }


@media (min-width: 768px) {
	/* Header  */
	header .logo { float: left; }
	header .toggle-menu { display: none; }
	header .menu { display: block; position: relative; float: right; top: inherit; right: inherit; width: auto; }
	header .menu nav { padding: 0; background-color: inherit; border: none; white-space: nowrap; }
	header .menu nav a { float: left; padding: 12px 0; margin-left: 40px; }
	header .menu nav:after, header .menu nav:before { display: none; }
	
	/* Footer */
	footer .telefone { text-align: left; }
	footer .infos { text-align: right; vertical-align: middle; }
	footer .infos .logo { margin: 4px 0 0 10px; float: right; }
	
	/* Welcome */
	.welcome-slider .sy-caption-wrap { height: 200px; margin-top: -100px; }
	.welcome-slider .sy-caption-wrap .sy-caption { font-size: 54px; line-height: 51px; }
	
	/* Empresa */
	.empresa { padding-top: 40px; overflow: hidden; }
	.empresa .container { position: relative; padding: 0 0 40px; background: url('../img/orange-background.png') repeat-y top left; }
	.empresa h1 { display: none; }
	.empresa .texto { margin-left: 98px; position: relative; }
	.empresa .texto:after { background-color: #fff; left: 100%; width: 100%; height: 100%; top: 0; position: absolute; z-index: 12; content: ""; }
	.empresa .texto p { font-size: 18px; }
	.empresa .left-title { display: block; position: absolute; left: 15px; top: 50%; margin-top: -229px;  z-index: 50; width: 75px; height: 458px; }
	
	.empresa-colunas .container { position: relative; padding-bottom: 30px; }
	.empresa-colunas .bloco { display: block; width: 98px; height: 98px; background-color: #F7931D; position: absolute; top: 0; left: 0; }
	.empresa-colunas .coluna { width: 50%; float: left;  margin-top: 20px }
	.empresa-colunas .coluna.first { margin-top: 120px; }
	.empresa-colunas .coluna p { text-align: left; font-size: 20px; line-height: 26px; font-weight: 300; }
	.empresa-colunas h2 { font-size: 40px; font-weight: 300; line-height: 40px; }
	
	/* Servicos */
	.servicos h2 { margin: 65px 0 30px; padding-left: 40px; line-height: 96px; font-size: 80px; text-align: left; }
	.servicos .lista { margin: 0 40px; padding-bottom: 40px; }
	.servicos .lista .item { margin: 0; display: inherit; float: left; }
	.servicos .lista .item .circulo { margin: 0 0 40px 40px; padding: 0 10px; float: left; }
	.servicos .lista .item .detalhes { width: 430px; margin-left: 20px; float: left; }
	
	/* Suporte */
	.suporte h2 { margin: 65px 0 30px; padding-left: 40px; line-height: 96px; font-size: 80px; text-align: left; }
	.suporte .diagrama { padding-bottom: 70px; }
	.suporte .diagrama .small { display: none; }
	.suporte .diagrama .big { display: inline-block; }
	
	/* Certificacoes */
	.certificacoes { padding-top: 40px; }
	.certificacoes .container { position: relative; padding: 0 0 40px; background: url('../img/orange-background.png') repeat-y top left; min-height: 500px; }
	.certificacoes h1 { display: none; }
	.certificacoes .left-title { display: block; position: absolute; left: 15px; top: 30px; z-index: 50; width: 75px; height: 458px; }
	.certificacoes .lista { padding: 20px;  margin-left: 98px; }
	.certificacoes .lista .item { padding: 20px; }
	
	/* Parceiros */
	.parceiros .container { position: relative; padding-top: 160px; padding-bottom: 60px; }
	.parceiros .bloco { display: block; width: 98px; height: 98px; background-color: #fff; position: absolute; top: 0; left: 0; }
	.parceiros h2 { line-height: 60px; font-size: 60px; display: block; text-align: right; margin: 0; padding: 0; }
	.parceiros .texto { text-align: left; font-weight: 300; }
	
	/* Itil */
	.itil {  padding: 20px 0; }
	.itil h2 { font-size: 50px; line-height: 50px; text-align: right; }
	.itil p { text-align: left; font-size: 20px; line-height: 24px; font-weight: 300; }
	
	/* Contato */
	.contato { padding: 40px 0; }
	.contato h2 { font-size: 40px; line-height: 30px; }
	.contato p { font-size: 23px; line-height: 23px;  }
	.contato .btn { float: right; width: 100px; }
	.contato .endereco address { font-size: 23px; line-height: 23px; }
	
}

@media (min-width: 992px) {
	/* Header  */
	header { background: #2F2E2E url('../img/header-background.png') repeat-y top center; }
	header .container { height: 98px; }
	header .logo { margin: 15px 0 0 45px; }
	header .logo .logo-img { width: 316px; height: 67px; }
	header .menu nav a { padding: 37px 30px; margin-left: 40px; }
	
	/* Welcome */
	.welcome-slider .sy-caption-wrap { height: 200px; margin-top: -100px; }
	.welcome-slider .sy-caption-wrap .sy-caption { font-size: 54px; line-height: 51px; }
	
	/* Empresa */
	.empresa .texto { padding: 14px 0 14px 28px; }
	.empresa .texto p { padding: 14px 0; }
	
	.empresa-colunas h2 { margin-bottom: 10px; }
	
	/* Servicos */
	.servicos h2 { margin: 85px 0 50px; padding-left: 60px; }
	.servicos .lista { margin: 0 140px; }
	.servicos .lista .item .circulo { margin: 0 0 40px 40px; }
	.servicos .lista .item .detalhes {width: 450px; }
	
	/* Suporte */
	.suporte h2 { margin: 85px 0 50px; padding-left: 60px; }
	
	/* Certificacoes */
	.certificacoes { padding-top: 50px; }
	.certificacoes .container { min-height: 650px; }
	.certificacoes .lista { padding: 70px 20px 20px; }
	
	/* Parceiros */
	.parceiros .container { position: relative; padding-top: 160px; padding-bottom: 60px; }
	.parceiros h2 { line-height: 80px; font-size: 80px; }
	.parceiros .texto { font-size: 23px; line-height: 24px; }
	
	/* Itil */
	.itil h2 { font-size: 80px; line-height: 72px; }
	.itil p { font-size: 23px; line-height: 32px; }
	
	/* Contato */
	.contato { padding: 40px 0; }
	.contato .container { padding: 0 60px; }
}

@media (min-width: 1200px) { .container { width: 970px; } }
