/*
2 - navbar
3 - jumbotron
4 - footer
5 - copyright
6 - endereco
7 - empresa
8 - clientes
9 - apresentacao
10 - nossos-servicos
11 - produtos
12 - servicos
13 - fale-conosco
14 - portfolio
15 - pareceiros
16 - Carousel
*/

h2 {
	font-family: 'Raleway', sans-serif;
	font-size: 26px;
	color: #1e97be;
}

body {
	/*font-family: "Roboto";*/
	font-family: 'Raleway', sans-serif;
}

.btn {
	background-color: #1e97be;
	border-radius: 0px;
	color: #fff;
	transition: all 0.5s ease 0s;
}

.btn:HOVER,
.btn:ACTIVE,
.btn:VISITED {
	opacity: 0.85;
	color: #eeeeee;
}

/*2 - navbar*/
.navbar {
	background: rgba(255, 255, 255, 1);
	margin: 0px;
	max-height: 115px;
}

.navbar .nav > li > a {
	margin-bottom: 26px;
	color: #000;
	transition: all 0.5s ease 0s;
	font-family: 'Raleway', sans-serif;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	padding: 30px 0px 3px 0px;
	margin-right:15px;
	margin-left:15px;  
}

.navbar .nav > li > a:focus, 
.navbar .nav > li > a:hover {
	background: rgba(255, 255, 255, 0);
	color: #1e97be;
}

.navbar .img-responsive {
	height: 50px;
	transition: all 0.5s ease 0s;
}

@media (max-width: 767px){
	nav {
		margin-top: -5px;
	}
	
	header .navbar-header {
		height: 85px;
	}
	
	header .navbar-header button,
	header .navbar-header button:FOCUS,
	header .navbar-header button:HOVER,
	header .navbar-header button:VISITED,
	.navbar .navbar-toggle:FOCUS {
		background-color: #1e97be !important;
		border-color: #1e97be !important;
	}
	
	.navbar .navbar-toggle {
		margin-top: 15px !important;
		background-color: #1e97be !important;
		border-color: #1e97be !important;
	}
	
	.navbar .navbar-toggle .icon-bar {
	    background-color: #fff;
	    color: #fff;
	}
	
	header .navbar-collapse {
		background-color: #1e97be;
		opacity: 0.9;
	}
	
	.navbar .nav > li > a {
		padding-top: 10px;
		margin-bottom: 0px;
		padding-bottom: 10px;
		color: #fff;
	}
	
	.navbar .nav > li > a:HOVER {
		color: #000;
	}
}

.navbar .navbar-nav>.active>a, 
.navbar .navbar-nav>.active>a:focus, 
.navbar .navbar-nav>.active>a:hover {
    border-bottom: solid 2px #1e97be;
    z-index: 204;
}

.navbar .nav > li a:hover:after {
    -webkit-transform: scaleX(1);
    -moz-transform: scaleX(1);
    -ms-transform: scaleX(1);
    -o-transform: scaleX(1);
    transform: scaleX(1);
    opacity: 1;
}

.navbar .nav > li a:after {
    content: '';
    height: 2px;
    background-color: #1e97be;
    width: auto;
    position: absolute;
    right: 0;
    bottom: -2px;
    left: 0;
    -webkit-transform: scaleX(0);
    -moz-transform: scaleX(0);
    -ms-transform: scaleX(0);
    -o-transform: scaleX(0);
    transform: scaleX(0);
    opacity: 0;
    -webkit-transition: all .6s cubic-bezier(.165,.84,.44,1);
    -moz-transition: all .6s cubic-bezier(.165,.84,.44,1);
    transition: all .6s cubic-bezier(.165,.84,.44,1);
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}


/*3 - jumbotron*/
.jumbotron {
	padding: 0px;
	margin: 0px;
	margin-top: 80px;
 }
 
 /*4 - footer*/
footer {
    color: #f4f4f4;
    background-color: #2a2a2a;
    border-bottom: 0 solid;
    border-top: 0 solid;
    font-size: 14px;
    padding-top: 70px;
    padding-bottom: 70px;
    text-align: justify;
}

footer a,
footer a:HOVER,
footer a:VISITED,
footer a:ACTIVE {
	color: #f4f4f4;
}

/* Mapa do site*/
footer ul {
	padding: 0px;
}

footer li {
	list-style-type: none;
}

footer li a {
	color: #fff;
}

footer .fa-caret-right:before {
    content: "\f0da";
}

footer .fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transform: translate(0, 0);
    margin-right: 5px;
}

@media (max-width: 767px){
	footer .col-sm-4,
	footer .col-sm-3 {
		padding-bottom: 30px;
	}
	
	footer {
		padding-bottom: 0px;
	}
}
	
/*5 - copyright*/
.copyright {
	background: #222222;
	padding: 20px 0 20px;
	color: #f4f4f4;
}

.copyright a {
	color: #f4f4f46;
	text-decoration: none;
}

.copyright .pull-right a {
	background-clip: padding-box;
	height: 25px;
	width: 25px;
	display: inline-block;
	text-indent: -9999px;	
	border-radius:15px;	/*Círculo. Sempre a metade da altura e largura*/
	transition: all 0.3s ease-out 0s;
}

.copyright .pull-right a:hover {
	border-top-left-radius: 0; /*bordar superior direita 0*/
}

.copyright .pull-right a[href*="facebook.com"] {
	background-image: url(../img/facebook.png);
	background-repeat:none;	
}

.copyright .pull-right a[href*="facebook.com"]:hover {
	background-color: #005580 !important;
	background-image: url(../img/facebook.png);	
}

/*6 - endereco*/
.endereco {
	background-color: rgb(51, 51, 51);
	color: #fff;
}

.endereco h3 {
	font-size: 18px;
	padding-top: 40px;
	position: relative;
	padding-bottom: 20px; /*Distancia a borda do titulo*/
	margin-bottom: 20px; /*Distancia o texto seguinte da borda*/
}

.endereco h3:AFTER { /*Borda a baixo do titulo*/
	content: "";
    position: absolute;
    display: inline-block;
    left: 0;
    bottom: 0;
    width: 30px;
    background-color: #fff;
    height: 1px;
}

@media (max-width: 767px){
	.endereco .col-sm-6:FIRST-CHILD {
		padding-bottom: 30px;
	}
}

.endereco #map {
	height: 400px;		
}

.endereco a,
.endereco a:hover,
.endereco a:VISITED,
.endereco a:ACTIVE {
	background-color: #1e97be;
	border-radius: 0px;
	margin-top: 20px;
	text-decoration: none;
	color: #fff;
	transition: all 0.5s ease 0s;
}

.endereco a:hover,
.endereco a:ACTIVE {
	opacity: 0.85;
	color: #eeeeee;
}

/*7 - empresa*/
.empresa {
	margin-top: 50px;
	margin-bottom: 50px;
	text-align: justify;
	font-size: 15px;
	font-family: 'Raleway', sans-serif;
	background-color: #f4f5f6;
	overflow: hidden;
}

.empresa img {
	height: 432px;
}

@media (max-width: 1199px){
	.empresa img {
		height: 474px;
	}
}

@media (max-width: 992px){
	.empresa img {
		height: 600px;
	}
}

.empresa .col-sm-6:FIRST-CHILD {
	padding-bottom: 20px;
}

.empresa h2 {
	position: relative;
	padding-bottom: 20px; /*Distancia a borda do titulo*/
	margin-bottom: 20px; /*Distancia o texto seguinte da borda*/
}

.empresa h2:AFTER { /*Borda a baixo do titulo*/
	content: "";
    position: absolute;
    display: inline-block;
    left: 0;
    bottom: 0;
    width: 30px;
    background-color: #000;
    height: 1px;
}

/*.empresa .col-sm-6 #img-empresa{
	background-image: url("../img/banner-clickpag.jpg");	
	background-repeat: no-repeat;
	
	content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 80%;
    background: url(../images/banner-clickpag.jpg) no-repeat -95px bottom;
}*/


.missao {
	margin-bottom: 50px;
} 
.missao img {
	margin: 0 auto;
}

.missao ul {
	list-style: none;
	padding-left: 0px;
}

.missao .valores {
	padding: 30px;
	height: 250px;
	border: 1px solid #dadbdb;
	text-align: center;
}

/*Redimensionando a altura da div para cada resolução*/
@media (max-width: 1199px){
	.missao .valores {
		height: 280px;
	}
}

@media (max-width: 992px){
	.missao .valores {
		height: 320px;
	}
}

@media (max-width: 767px){
	.missao .valores {
		margin-bottom: 30px;
		height: 250px;
	}
}

@media (max-width: 400px){
	.missao .valores {
		margin-bottom: 30px;
		height: 300px;
	}
}

/*8 - clientes*/
.clientes{
	background-color: #fff;
	margin-bottom: 60px;
	font-family: 'Raleway', sans-serif;	
}

.clientes p {
	text-align: center;
	padding-left: 15%;
	padding-right: 15%;
	font-size: 19px;
}

.clientes .row .col-xs-12 {
	margin-bottom: 30px;
}

.clientes img {
	/*margin: 0 auto;*/	
	/*display: block;*/
	/*height: 150px;*/
	/*width: auto;*/
	border: 1px solid #cfcfcf;
	margin-bottom: 30px;
	
	-webkit-filter: grayscale(1);
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);	
	filter: gray;
	transition: all 0.5s ease 0s;	
}

.clientes img:HOVER {
	border: 1px solid #000;
	-webkit-filter: grayscale(0);
	-webkit-filter: grayscale(0%);
	filter: grayscale(0%);	
}

/*9 - apresentacao*/
.nossos-servicos .apresentacao {
	margin-bottom: 80px;
	font-family: 'Raleway', sans-serif;
}

.nossos-servicos  .apresentacao p {
	text-align: center;
	padding-left: 15%;
	padding-right: 15%;
	font-size: 19px;
}

/*10 - nossos-servicos*/
.nossos-servicos {
	padding-top: 80px;
	padding-bottom: 100px;
	margin-bottom: 60px;
	background: #f9f9f9;
}

@media (max-width: 767px){
	.nossos-servicos {
		padding-top: 30px;		
	}
}

.nossos-servicos .servico {
	background-color: #1e97be;
	padding: 30px;
	color: #fff;
	text-align: center;
	
	transition: .3s ease;
  	box-shadow: 0 1px 1px rgba(0,0,0,.3);	
}

.nossos-servicos .servico:hover {
  box-shadow: 0 5px 20px rgba(0,0,0,.8);
  transform: translateY(-10px) scale(1.02);  	
}

@media (max-width: 767px){
	.nossos-servicos .servico {
		margin-bottom: 30px;
	}
}

.nossos-servicos i {
	display: block;
	font-size: 70px;
	padding-bottom: 15px;
}

.nossos-servicos p {
	font-size: 20px;
	margin-bottom: 30px;
}

/*11 - produtos*/
.produtos {
	padding: 50px 0px;
	overflow: hidden;
	background-color: #f4f5f6;
}

.produtos h2 {
	position: relative;
	padding-bottom: 20px; /*Distancia a borda do titulo*/
	margin-bottom: 20px; /*Distancia o texto seguinte da borda*/
}

.produtos h2:AFTER { /*Borda a baixo do titulo*/
	content: "";
    position: absolute;
    display: inline-block;
    left: 0;
    bottom: 0;
    width: 30px;
    background-color: #000;
    height: 1px;
}

.produtos img {
	height: 30px;
	margin-bottom: 20px;
}

.produtos a {
	color: #fff;
}

.produtos .produto {
	background-color: #1e97be;
	padding: 30px;
	color: #fff;
	text-align: center;
	height: 300px;
}

@media (max-width: 1199px){
	.produtos .produto {
		height: 330px;
	}
}

@media (max-width: 992px){
	.produtos .produto {
		height: 450px;
	}
}

@media (max-width: 767px){
	.produtos .produto {
		height: auto;
		margin-bottom: 30px;
		margin-left: 20%;
		margin-right: 20%;
	}
}

/*12 - servicos*/
.servicos {
	margin: 50px 0px;
}

.servicos h2 {
	position: relative;
	padding-bottom: 20px; /*Distancia a borda do titulo*/
	margin-bottom: 20px; /*Distancia o texto seguinte da borda*/
}

.servicos h2:AFTER { /*Borda a baixo do titulo*/
	content: "";
    position: absolute;
    display: inline-block;
    left: 0;
    bottom: 0;
    width: 30px;
    background-color: #000;
    height: 1px;
}

/*13 - fale-conosco*/
.fale-conosco {
	padding: 50px 0px;	
}

.fale-conosco .container > .row:FIRST-CHILD {
	padding-bottom: 50px;
}

.fale-conosco input,
.fale-conosco textarea {
	border-radius: 0px;
	background-color:transparent;
	border: 1px solid #000;
	color: #000;
}

.fale-conosco input::-webkit-input-placeholder {
   color: #000;
   font-family: 'Raleway', sans-serif;
   font-weight: 400;
   letter-spacing: 1px;
}
.fale-conosco textarea::-webkit-input-placeholder {
   color: #000;
   font-family: 'Raleway', sans-serif;
   font-weight: 400;
   letter-spacing: 1px;
}

.fale-conosco input:-moz-placeholder { /* Firefox 18- */
   color: #000;  
   font-family: 'Raleway', sans-serif;
   font-weight: 400;
   letter-spacing: 1px;
}
.fale-conosco textarea:-moz-placeholder { /* Firefox 18- */
   color: #000;  
   font-family: 'Raleway', sans-serif;
   font-weight: 400;
   letter-spacing: 1px;
}

.fale-conosco input::-moz-placeholder {  /* Firefox 19+ */
   color: #000;  
   font-family: 'Raleway', sans-serif;
   font-weight: 400;
   letter-spacing: 1px;
}
.fale-conosco textarea::-moz-placeholder {  /* Firefox 19+ */
   color: #000;  
   font-family: 'Raleway', sans-serif;
   font-weight: 400;
   letter-spacing: 1px;
}

.fale-conosco input:-ms-input-placeholder {  
   color: #000;  
   font-family: 'Raleway', sans-serif;
   font-weight: 400;
   letter-spacing: 1px;
}
.fale-conosco textarea:-ms-input-placeholder {  
   color: #000;  
   font-family: 'Raleway', sans-serif;
   font-weight: 400;
   letter-spacing: 1px;
}

.fale-conosco h2 {
	text-align: center;
	padding-bottom: 20px;
}

/*14 - portfolio*/
.portfolio {
	margin: 60px 0;
}

.portfolio .content-site {
	padding: 20px;
}

.portfolio .content-site hr {
	margin-top: 5px;
	margin-bottom: 10px;
}

.portfolio p {
	font-size: 12px;
	text-align: justify;
}

.portfolio h2 {
	position: relative;
	padding-bottom: 20px; /*Distancia a borda do titulo*/
	margin-bottom: 20px; /*Distancia o texto seguinte da borda*/
}

.portfolio h2:AFTER { /*Borda a baixo do titulo*/
	content: "";
    position: absolute;
    display: inline-block;
    left: 0;
    bottom: 0;
    width: 30px;
    background-color: #000;
    height: 1px;
}

.portfolio .print-site {
	border: 1px solid #1e97be;
	margin-bottom: 50px;
	height: 546px;
	background: #f9f9f9;
}

.portfolio .imagem {
	position: relative;
}

.portfolio .imagem .retina {
	position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.4);
    text-align: center;
    padding: 30px;
    color: white;
 
    -webkit-transition:	 all .8s cubic-bezier(.190, 1.000, .220, 1.000);
	    -moz-transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000);
	     -ms-transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000);
	      -o-transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000);
	         transition: all .8s cubic-bezier(.190, 1.000, .220, 1.000); 
}

.portfolio .imagem:HOVER .retina {
	opacity: 1;
    box-shadow: inset 0 0 100px 50px rgba(0,0,0,.5);
}

.portfolio .imagem:hover .retina .glyphicon {
    color: #fff;
    padding-top: 7px;
    padding-bottom: 7px;
    padding-left:8px;
    padding-right:7px;
    border: 2px solid #fff;    
    border-radius: 50%;  
    top:44%;
  	transition: opacity .5s ease-in-out;
}

/*Redimensionando a altura da div para cada resolução*/
@media (max-width: 1199px){
	.portfolio .print-site {
		height: 500px;
	}
}

@media (max-width: 767px){
	.portfolio .col-sm-4 {
		padding-right: 22%;
		padding-left: 22%;
	}
	
	.portfolio .print-site {
		height: auto;
	}
}

.portfolio .print-site a,
.portfolio .print-site a:HOVER,
.portfolio .print-site a:VISITED,
.portfolio .print-site a:ACTIVE {
	color: #333;
}

/*15 - parceiros*/
.parceiros {
	padding-top: 60px;
	padding-bottom: 50px;	
	background: #f2f2f2;
}

.parceiros h2 {
	padding-bottom: 30px;
}

.parceiros img {
	border: 1px solid #cfcfcf;
	margin-bottom: 30px;
	-webkit-filter: grayscale(1);
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);	
	filter: gray;
	transition: all 0.5s ease 0s;	
}

.parceiros img:HOVER {
	border: 1px solid #000;
	-webkit-filter: grayscale(0);
	-webkit-filter: grayscale(0%);
	filter: grayscale(0%);	
}

/*16 - Carousel*/
@media (min-width: 768px){
	.carousel-inner img {
		width: 100%;
	}
}

@media (max-width: 767px){
	.carousel-inner img {
		max-width: none !important;
		width: 200%;
	}
}

@media (max-width: 450px){
	.carousel-inner img {
		max-width: none !important;
		width: 250%;
	}
}

.carousel-control{
	background-image: none !important;
}

.carousel-control .glyphicon-arrow-left,
.carousel-control .glyphicon-arrow-right {
  position: absolute;
  top: 50%;
  z-index: 5;
  display: inline-block;
  margin-top: -10px;
}

.carousel-control .glyphicon-arrow-left {
  left: 50%;
  margin-left: -10px;
}

.carousel-control .glyphicon-arrow-right {
  right: 50%;
  margin-right: -10px;
}

@media screen and (min-width: 768px) {
  .carousel-control .glyphicon-arrow-left,
  .carousel-control .glyphicon-arrow-right{
    width: 30px;
    height: 30px;
    margin-top: -10px;
    font-size: 30px;
  }
  .carousel-control .glyphicon-arrow-left{
    margin-left: -10px;
  }
  .carousel-control .glyphicon-arrow-right{
    margin-right: -10px;
  }  
}

/*Botão para retornar ao topo da página*/
#return-to-top {
    position: fixed;
    bottom: 90px;
    right: 30px;    
    width: 40px;
    height: 40px;
    display: block;
    text-decoration: none;
    display: none;    
    z-index: 99999;
}

a:focus#return-to-top, a:hover#return-to-top{
	color: #337ab7
}