html{
	overflow:auto;
}
body{
	font-family: 'Open Sans', sans-serif;
	font-size:15px;
	background-color:#000020;
	margin:0;
	padding:0;
}
h1{font-size:2.143em;font-weight:700}
h2{font-size:1.429em}
h3{font-size:1.214em}
h4{font-size:1.071em}
p{font-family:"Varela Round",sans-serif;line-height:2em}
a{color:#000}

/* BOTÃO DO MENU
---------------------------------*/
.menuText{
	visibility:hidden;
}
@media (min-width:768px){
.menuText{
	position:fixed;
	top:7%;
	left:10%;
	font-size:20px;
	color:white;
	visibility:visible;
}
}
.button-container{
	position:fixed;
	top:7%;
	left:7%;
	height:21px;
	width:29px;
	cursor:pointer;
	-webkit-transition:opacity .25s ease;
	transition:opacity .25s ease;
	z-index:200;
}
.button-container:hover{opacity:.7}
.button-container span{
	background:yellow;
	border:none;
	height:4px;
	width:100%;
	position:absolute;
	top:0;
	left:0;
	-webkit-transition:all .35s ease;
	transition:all .35s ease;
	cursor:pointer;
}
.button-container span:nth-of-type(2){top:9px}
.button-container span:nth-of-type(3){top:18px}
.top.active{
	-webkit-transform:translateY(9px) translateX(0) rotate(45deg);
	-ms-transform:translateY(9px) translateX(0) rotate(45deg);
	transform:translateY(9px) translateX(0) rotate(45deg);
	background:yellow;
}
.middle.active{opacity:0;background:yellow}
.bottom.active{-ms-transform:translateY(-9px) translateX(0) rotate(-45deg);-webkit-transform:translateY(-9px) translateX(0) rotate(-45deg);tranform:translateY(-9px) translateX(0) rotate(-45deg);background:yellow}
.overlay{
	position:fixed;
	background:#036;
	top:0;
	left:0;
	width:0;
	height:100%;
	opacity:0;
	visibility:hidden;
	-webkit-transition:opacity .35s,visibility .35s,width .35s ease-in-out;
	transition:opacity .35s,visibility .35s,width .35s ease-in-out;
	overflow:hidden;
	z-index:100;
}
.overlay.open{
	opacity:.7;
	visibility:visible;
	width:250px;
	overflow:hidden;
}
.overlay nav{
	position:relative;
	height:60%;
	top:50%;
	-webkit-transform:translateY(-50%);
	-ms-transform:translateY(-50%);
	transform:translateY(-50%);
	font-size:20px;
	font-family:Montserrat,sans-serif;
	font-weight:200;
	text-align:left;
}
.overlay nav ul{
	list-style:none;
	padding:0;
	margin:0 auto;
	margin-left:25px;
	display:inline-block;
	position:relative;
	height:100%;
}
.overlay nav ul li{
	display:block;
	height:20%;
	height:-webkit-calc(100% / 5);
	height:calc(100% / 5); /* altura relativa dos itens do menu*/
	min-height:32px;
	position:relative;
	opacity:0;
	font-size:20px;
}
.overlay.open nav ul li{
	-webkit-animation:menuFade .5s ease forwards;
	animation:menuFade .5s ease forwards;
	-webkit-animation-delay:.35s;
	animation-delay:.35s;
}
.overlay.open nav ul li:nth-of-type(2){
	-webkit-animation-delay:.4s;
	animation-delay:.4s;
}
.overlay.open nav ul li:nth-of-type(3){
	-webkit-animation-delay:.45s;
	animation-delay:.45s;
}
.overlay.open nav ul li:nth-of-type(4){
	-webkit-animation-delay:.5s;
	animation-delay:.5s;
}.overlay.open nav ul li:nth-of-type(5){-webkit-animation-delay:.55s;animation-delay:.55s}@-webkit-keyframes menuFade{0%{opacity:0;left:-25%}100%{opacity:1;left:0}}@keyframes menuFade{0%{opacity:0;left:-25%}100%{opacity:1;left:0}}.overlay nav ul li a{display:block;position:relative;color:#FFF;overflow:hidden}
.overlay nav ul li a:hover{
	text-decoration:none;
}
.overlay nav ul li a:after{
	content:'';
	position:absolute;
	bottom:0;
	left:0;
	-webkit-transform:translateX(-105%);
	-ms-transform:translateX(-105%);
	transform:translateX(-105%);
	height:3px;
	width:100%;
	background:yellow; /* COR DA LINHA DO MENU */
	-webkit-transition:.35s ease;
	transition:.35s ease;
}
.overlay nav ul li a:hover:after{
	-webkit-transform:translateX(0%);
	-ms-transform:translateX(0%);
	transform:translateX(0%);
}
#supra{
	color:#FFF;
	font-size:1.214em;
}
#sub{
	color:#FFF;
	font-size:1.214em;
	-webkit-animation-delay:1s;
	animation-delay:1s;
	-webkit-animation-duration:1s;
	animation-duration:1s;
}

/* body
---------------------------------*/
.central{text-align:center}

.direita{text-align:right}

.esquerda{text-align:left}

.amarelo{color:yellow}

.branco{color:white}

.droid{font-family: 'Droid Serif', serif}

.shadow{
	text-shadow:-0.1em 0.1em 0.2em black;
}

/* FOOTER
---------------------------------*/
.footer{
	border-top:5px yellow solid;
	background-color:#003;
	padding:40px;
}

.direitos{
	background-color:#000020;
	padding:20px;
	font-size:12px;
	color:#515E7B;
}

/* HOME
---------------------------------*/
.painel{
	background-image:url(../figuras/azuis.jpg);
	padding: 80px 30px 80px 30px;
	background-repeat: no-repeat;
	background-position: center top;
}
.fornerTitulo{color:yellow}
.quadro{padding:20px}
.quadroExplicativo{
	border-top:3px yellow solid;
	background-color:#333;
}
.explicativo{padding:10px 50px 10px 50px}
.bordado{border:10px solid #333}

.linkAzul a, h:hover{
	color:#5E6BAE;
}

/* PAGES
---------------------------------*/
.header{
	height:100px;
	background-image: url(../figuras/azuisMini.jpg);
	background-repeat: no-repeat;
	background-position: center;
	padding-top:23px;
	margin-bottom:30px;
}
.pageItem{
	border-top:3px solid yellow;
	background-color:#333;
	padding:40px;
	color:white;
}

/* PORTIFÓLIO
---------------------------------*/
.panel-default{
	background-color:#1C1C1C;
	border:0;
	border-top:yellow solid 1px;
}
.panel .panel-heading{
	background-color: #040A26;
	border:0;
}
.panel .panel-body{
	color:#999;
	padding:30px;
}
.portImgQuadro{
	padding:10px;
}
.imgPort{
	border:3px solid white;
}
.imgPort:hover{
	border:3px solid yellow;
}

/* SOCIOCULTURAL
---------------------------------*/
.divCultural{
	padding:10px;
	border-top:1px solid yellow;
	background-color: #282828;
}

.gradiente{
	background-color:#000020;
}
.gradientes{
	background: -webkit-linear-gradient(top, black, #003);
	background: -o-linear-gradient(top, black, #003);
	background: -moz-linear-gradient(top, black, #003);
	background: linear-gradient(to top, black, #003);
}