/*
*
*
*
*/

/*================== Layout =========================*/

html, body, .capa{
	height: 100%;
	overflow: auto;
}

body{
	background: url('imagens/capa.png'),
				url('imagens/sobrecapa1.png'),
				linear-gradient(50deg,#552200ff,#0b280bff);
	background-attachment: fixed;
	font-family: Helvetica, Arial, sans-serif;
	overflow-x: hidden;

}


/* --- barra de navegacao ---*/
.img-logo{
	height: 60px;
	width: 260px;
	background: url('imagens/logo.png') no-repeat;
	display: block;
	background-size: contain;
	color: transparent;
	
}

nav.navbar-transparente{
	padding: 15px 0px;
	background: rgba(0, 0, 0, 0.6);
	border: none;

}

nav.navbar-transp{
	padding: 15px 0px;
	background: url('imagens/capa.png'),
				url('imagens/sobrecapa1.png'),
				linear-gradient(50deg,#552200ff,#0b280bff);
	background-attachment: fixed;
	border: none;

}

.navbar-brand{
	padding: 5px 15px;
}

.divisor{
	width: 1px;
	height: 16px;
	background: white;
	margin: 16px 10px;

}

.navbar-inverse .navbar-nav>li>a, footer .nav a{
	color: #ff8723ff;
}

.navbar-inverse .navbar-nav>li>a:hover, footer .nav a:hover{
	color: #80ff80ff;
	background: none;
}

/* --- Imagem de capa ---*/

.capa{
	display: table;
	width: 100%;
}

.capa-quem-somos{
	display: table;
	width: 100%;
	height: 10%
}

.texto-capa{
	text-align: center;
	color: white;
	display: table-cell;
	vertical-align: middle;
}

.empresa{
	color: white;
	display: table-cell;
	vertical-align: middle;
}

/* --- Botões ---*/

.btn-custom{
	color: white;
	border-radius: 500px;
	-webkit-border-radius: 500px;
	-moz-border-radius: 500px;
	text-transform: uppercase;
	transition: background 0.4s, color 0.4s;
}

.btn-roxo{
	background: #00aa00ff;
}

.btn-roxo:hover{
	background-color: #005500ff;
	color: white;
}

.btn-branco{
	border: 2px solid white;

}

.btn-branco:hover{
	background-color: white;
	color: black; 

}


/* --- Secao Serviços ---*/
#servicos{
	background: white;
	padding-top: 20px;
	padding-bottom: 20px; 
}

.albuns{
	padding: 10px 0px 10px 0px;
}

/* --- recursos ---*/
#recursos{
	padding-top: 20px;
	padding-bottom: 20px;
	color: white; 
}

.rotacionar{
	transform: rotate(30deg);
	-ms-transform: rotate(30deg);
	-webkit-transform: rotate(30deg);
	padding-left: 50px;
}

/* --- rodapé ---*/

footer{
	background: #000;
	padding: 35px 0px 20px 0px;
	position: relative;
}

.itens-redes-sociais, .socios{
	float: right;
}


/* --- Empresa ---*/

#empresa{
	background: #FFF;
	padding-top: 20px;
	padding-bottom: 20px; 
	color: green;
}

#sistema{
	height: 75%;
	background: #FFF;
	padding-top: 20px;
	padding-bottom: 20px; 
	color: green;
}

#empresa p{
	text-align: justify;
}

#tb{
	margin-left: 10px;
	margin-right: 10px;
	text-align: center;
	padding: 5px;

}

.redondo {
   width: 100px;
   height: 100px;
   background-color: #FFF;
   border-radius: 15%;
}

.fonte-equipe{
	font-size: 12px;
}


.e{
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.espaco{
	padding-left: 30px;
	font-family: Helvetica, Arial, sans-serif;
}

.redondo-equipe {
   width: 80px;
   height: 80px;
   background-color: #fff;
   border-radius: 15%;
}

#equipe{
	color: white; 
}

.sp{
	margin-left: 8px;
	padding: 0px;
}

.radio-espaco{
	margin-left: 10px;
	
}

.op{
	margin-top: 20px;
	margin-bottom: 20px;
}

#galeria-turma{
	background: #d7f4d7ff;
	width:225px;
	padding: 5px;
	float: left;
	margin: 8px;
	border-radius: 4%;
}

.obs-turma{
	padding: 5px 15px;
}

#conteudo-principal{
	background: #332424f1;
	padding: 10px;
	width: 700px;
	height: 900;
	margin: 20px auto;
}

.conteudo{
	width: 600px;
	margin: 30px auto;
	padding: 5px
}

#observacao{
	margin-left: 10px;
}

.folder a {
	border: 0px solid transparent;
	height: 25px;
	margin: 15px;
	padding: 2px;
}

/*================== Tipografia =========================*/

h1{
	font-weight: 900;
	letter-spacing: -0.02em;
	margin-bottom: 50px;

}

h2{
	font-size: 38px;
	font-weight: 900;
	letter-spacing: -0.02em;
}

h3{
	font-size: 26px;
	font-weight: 900;
	letter-spacing: -0.02em;
}

#servicos h2, #servicos h3, #equipe h3{
	color: #ff6600ff;
}

#equipe h2{
	font-size: 25px;
	color: #ff6600ff;
	text-shadow: 2px 0px black;
}

#recursos h3{
	color: #9bf0e1;
}

#rodape h4{
	color: #919496;
	font-size: 12px;
	text-transform: uppercase;
}

#rodape span{
	color: white;
}

#socios p{
	text-align: center;
}

.contato{
	background: #FFF;
	padding-top: 20px;
	padding-bottom: 20px; 
	color: #ccffaaca;
}

#form-msg select{
	color: green;
	width: 100%;
	height: 40px;
	border-radius: 4px;

}

form select{
	width: 50%;
	height: 30px;
}

#observacao p{
	font-size: 12px;

}



/* - Midia queries -*/
/* - xs < 768 -*/
@media screen and (max-width: 767px){

	h1{
		font-size: 50px;
	}

	.btn-custom{
		margin: 10px 15px;
	}

}

/* - sm -*/
@media screen and (min-width: 768px){

	h1{
		font-size: 70px;
	}
}

/* - md -*/
@media screen and (min-width: 992px){

	h1{
		font-size: 80px;
	}
}

/* - lg -*/
@media screen and (min-width: 1200px){

	h1{
		font-size: 100px;
	}
}