﻿#contents {
/*	display: none ;*/
	z-index: 1000 ;
}

/* Header definitions */

#header{
	position: relative ;
}

#header:after{
	position: absolute ;
	top: 0px ;
	left: 0px ;
	width: 100% ;
	height: 100% ;
	content: "" ;
	background-color: rgba( 0, 0, 0, 0 ) ;
	
	transition: opacity .25s ;
}

.noafter:after{
	opacity: 0.1 ;
}

div.conteudos{
	max-width: 906px;
	margin: auto;
	position:relative ;
}

p.conteudos, ul.conteudos{
	font-size: 16px;
	text-align: justify;
	line-height: 150%;
}

p.conteudos{
	padding: 0px 18px ;
}

.group{
	position: relative ;
	border-top: 5px solid #008db2 ;
	border-bottom: 0px none ;
}

.group:before{
	content: "" ;
	border-radius: 50% ;
	background-color: #008db2 ;
	width: 80px ;
	height: 80px ;
	position: absolute ;
	top: -40px ;
	left: 50% ;
	transform: translateX( -50% ) ;
	background-image: url('../images/news.png') ;
	background-position: center center ;
	background-repeat: no-repeat ;
	
	transition: height 0.25s, width 0.25 ;
}

.group.inverse{
	border-color: #f8b52d ;
}

.group.inverse:before{
	background-color: #f8b52d ;
	background-image: url('../images/pictures.jpg')
}

.group.pictures:before{
	background-image: url('../images/_pictures.jpg')
}

.group.osgatos{
	border-color: #FF6600 ;
	background-color: #DFDFDF ;
}

.group.osgatos:before{
	background-color: #FF6600 ;
	background-image: url('../images/osgatos.png')
}

.group.grey{
	border-color: #505050 ;
	background-color: rgba( 0, 0, 0, .9 )
}

.group.grey:before{
	background-color: #505050 ;
	background-image: url('../images/diverse.png') ;
}

.group.courses:before{
	background-image: url( '../images/courses.png' ) ;
}

.group .center1360{
	padding-top: 56px ;
	padding-bottom: 56px ;
}

.group.grey .center1360{
	padding-bottom: 36px ;
}

.group.school:before{
	background-image: url( '../images/school.png' ) ;
}

.contacts{
	font-size: 15px ;
	color: #EFEFEF ;
	font-family: HN, "Helvetica Neue", Arial, Helvetica, sans-serif ;

	display: inline-block ;
	width: 50% ;
	
	vertical-align: middle ;
	text-align: center ;
}

div.divisor{
	position: relative ;
	height: 5px ;
	background-color: #fbde9b ;
	margin-top: 36px ;
	margin-bottom: 48px ;
}

.clearBoth{
	clear: both ; 
}

div.divisor:before{
	content: "" ;
	position: absolute ;
	left: 50% ;
	width: 55px ;
	height: 55px ;
	border-radius: 50% ;
	top: 50% ;
	transform: translateX( -50% ) ;
	margin-top: -28px ;
	
	background-color: #f9cd69 ;
	
	background-position: center center ;
	background-repeat: no-repeat ;
	background-image: url('../images/pictures.jpg') ;
	background-size: 45% ;
}

div.divisor.grey{
	background-color: #888 ;
}

div.divisor.grey:before{
	background-color: #666 ;
}

div.divisor.nobgi{
	margin: 0px ;
	margin-bottom: 24px ;
}

div.divisor.nobgi:before{
	background-image: none ;
	display: none ;
}

div.divisor.noticias:before{
	background-image: url( '../images/news.png' );
}

div.divisor.links:before{
	background-image: url( '../images/links.png' );
	background-size: 60% ;
}

div.divisor.projectos:before, .group.projects:before{
	background-image: url( '../images/projects.png' );
	background-size: 60% ;
}

.center1360 p.conteudos:last-child:after{
	display: table ;
	content: "" ;
	clear: both ;
}

img#slide{
	width: 100% ;
	visibility: hidden ;
}

div.image_slider{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-image: url('./headers/e9cf25c94f61372dde7db163074dbb90.jpg') ;
	background-position: center center;
	background-size: auto 100%;
	background-repeat: no-repeat;
}

.center1360{
	position: relative ;
	max-width: 1360px ;
	margin: 0px auto ;
	overflow: hidden
}

.table{
	display: table ;
	height: 90px ;
}

.table_cell{
	display: table-cell ;
	vertical-align: middle ;
}

/* End header definitions */

/* Bars definitions */

.bars{
	text-align: right;
	position:absolute; 
	top: 0px ;
	left: 0px;
	width: 100%;
	
	transition: padding 0.35s ;
}

#navbar{
	text-align: left ;
	top: 90px ;
	background-image: url('../images/mask_imagem_escola_17_18i.png'), url('../images/mask_imagem_escola_17_18.png') ;
	background-color: rgba( 247, 189, 55, 0.5 ) ;
}

#navbar img.epfa{
	height: 90px ;
	
	transition: height 0.35s ;
}

#navbar img.epfa:nth-of-type( 2 ){
	display: none ;
}

#optionbar{
	float: right ;
}

#navbar.fixbar{
	position: fixed ;
	background-color: #FFF ;
	background-image: none;
	top: 0px ;
	
	transition: background-color 0.35s
}


.light_shadow{
	box-shadow: 0px 10px 10px -10px #BFBFBF ;
}

#navbar.fixbar img.epfa, #navbar.fixbar #optionbar, #navbar.fixbar #mopen{
	height: 65px ;
}

#navbar.fixbar img.epfa:nth-of-type( 1 ){
	display: none ;
}

#navbar.fixbar img.epfa:nth-of-type( 2 ){
	display: inline ;
}

#navbar.fixbar a.menu:after{
	bottom: -70% ;
	
	transition: bottom 0.35s
}

div.social{
	display: inline-block ;
	border-radius: 9px/50% ;
	padding: 9px  ;
	cursor: pointer ;
	font-size: inherit ;
	margin-left: 18px ;
	background-color: rgba( 0, 166, 192, 0.5 ) ;
	position: relative ;
}

div.social img{
	height: 21px ;
}

div.social:hover{
	background-color: rgba( 247, 189, 55, 0.5 ) ;
}

div.social.kitten{
	padding: 3px 9px ;
	/*background-color: transparent ;*/
	vertical-align: top ;
	background-image: url( '../images/osgatos.png' ) ;
	background-repeat:no-repeat ;
	background-position: center center ;
}

div.social.kitten:after{
	content: "" ;
	position: absolute ;
	top: -4000px;
	background-image: url( '../images/_osgatos.png' ) ;
}

div.social.kitten:hover{
	background-image: url( '../images/_osgatos.png' ) ;
}

div.social.kitten img{
	height: auto ;
	visibility: hidden ;
}

ul, ol{
	margin: 0px ;
	margin-left: 18px ;
	list-style-type: none;
}

li{
	position: relative ;
}

li:before{
	content: "" ;
	width: 9px ;
	height: 9px ;
	bottom: 6px ;
	left: -18px ;
	position: absolute ;
	border-radius: 50% ;
	border: 1px solid #FF6600 ;
}

li.Y:before{
	border: 1px solid #f8b52d ;
}

li.B:before{
	border: 1px solid #008db2 ;
}

a{
	font-size: 16px;
	color: #00a6c0 ;
}

a:hover{
	color: #007282;
	color: #f7bd37 ;
	color: #F3AD0A ;
}

.inscricoes_online div a:hover{
	color: #007282 ;
}

a.links{
	display: table ;
	text-align: left ;
	margin: 9px 0px ;
}

a.menu{
	color: #FFFFFF ;
	font-size:14px;
	margin: 0px 18px ;
	display: inline-block;
	font-family: HN, "Helvetica Neue", Arial, Helvetica, sans-serif ; 
	font-weight: 700 ;
	text-transform: uppercase ;
	position: relative ;
}

#navbar.fixbar a.menu{
	color: #101010 ;
}

a.menu:hover{
	color: #f7bd37;

	transition: 0.35s;
}

#navbar.fixbar a.menu:hover{
	color: #00a6c0 ;
}

a.menu.active:hover{
	color: #00a6c0;
}

a.menu:hover:after{
	background-color: #00a6c0 ;
	
	transition: 0.35s ;
}

#navbar.fixbar a.menu:hover:after{
	background-color: #f7bd37;
}

a.menu:after, a.menu.active:after{
	background-color: #f7bd37;
	position: absolute ;
	bottom: -100% ;
	left: 0px ;
	content: "" ;
	width: 100% ;
	height: 2px ;

	padding: 0px 0px ;
}

a.menu:after{
	background-color: transparent;
}

#mopen{
	float: right ;
}

#menu_icon {
	display: none ;
	cursor: pointer;
	background-color: #FFF ;
}

.bar{
	height: 5px;
	width: 35px;
	background-color: #EC7600;
	margin: 6px 0px;
	border-radius: 3px/50%;
	transition: 0.4s;
}

#menu_icon:hover .bar{
	background-color: #FF8000;
}

.change #bar1{
	transform: translate( 0px, 11px ) rotate( -45deg ) ;
}

.change #bar2 {opacity: 0;}

.change #bar3{
	transform: translate( 0px, -11px ) rotate( 45deg ) ;
}
/* End bars definitions */

.debugger{
	position:fixed ;
	top: 50% ;
	left: 0px ;
	background-color: #FFF ;
	color: #000 ;
	z-index: 10000;
	font-size: 14px ;
}

.contacts:nth-of-type( 2 ){
	padding: 0px 24px ;
}

#map{
	width: 100% ;
	min-height: 350px ;
}

a[goto^="#"]{
	cursor: pointer ;
	display: none ;
}

span#more{
	font-size: 15px ;
	text-transform: uppercase ;
	cursor: pointer ;
	color: #000 ;
	position: relative ;
	font-weight: 700 ;
}

span#more:hover{
	color: #FF8000;
}

span#more.loading{
	font-size: 0px ;
	border-style: solid;
	border-width: 5px;
	width: 50px;
	height: 50px;

	border-color: #C0C0C0 #F8F8F8 #C0C0C0 #F8F8F8 ;
	
	animation: spinning 0.75s linear 0s infinite;
	border-radius: 50% ;
	
	display: inline-block ;
}

h1, .tituloConteudo{
	margin: 0px;
	font-size: 20px;
	margin-bottom: 24px;
	position: relative;
	color: #00384D ;
}

@media ( max-width: 1380px ){
	.bars{
		padding: 0px 24px ;
	}
	
	img#slide{
		height: 540px ;
	}
	
/*	.group{
		border-left: 0px none ;
		border-right: 0px none ;
	}*/
}

@media ( max-width: 1048px ){
	img#slide{
		height: 490px ;
	}
}

@media ( max-width: 900px ){

	#navbar img.epfa:nth-of-type( 1 ){
		display: none ;
	}
	
	#navbar img.epfa:nth-of-type( 2 ){
		display: inline ;
	}

	#optionbar, #navbar{
		float: none ;
		text-align:center ;
		width: 100% ;
	}
		
	.contacts{
		display: block ;
		width: 100% ;
	}
	
	.center1360.footer{
		text-align: center ;
	}
	
	#map{
		border-radius: 0px ;
		min-height: 400px ;
	}
	
	.contacts:nth-of-type( 2 ){
		margin-top: 36px ;
	}
		
/*}

@media ( max-width: 715px ){*/
	#optionbar, #socialbar{
		display: none ;
	}
	
	#navbar img.epfa, #navbar #mopen{
		height: 65px ;
	}
	
	#header{
		margin-top: 65px ;
	}
	
	#header:after{
		display: none ;
	}
	
	img#slide{
		width: 100% ;
		height: 345px ;
		height: 42.5vw ;
	}
	
	#navbar{
		text-align: left ;
		top: 0px ;
		position: fixed ;
		background-color: #FFF ;
		background-image: none ;
		
		padding-left: 8px ;
		
		box-shadow: 0px 10px 10px -10px #BFBFBF ;
	}
	
	#optionbar{
		height: auto ;
		width: 100% ;
		float: none ;
		margin-bottom: 9px ;
	}
	
	#optionbar .table_cell{
		display: block ;
		width: 100% ;
	}
	
	a.menu{
		position: relative ;
		display: block ;
		width: 100% ;
		color: #101010 ;
		text-align: center ;
		padding: 9px 0px ;
	}
	
	a.menu:after{
		top: 90% ;
		background-color: #EFEFEF ;
	}
	
	#menu_icon{
		display: inline-block ;
		cursor: pointer ;
	}
}

@media ( max-width: 700px ){	
	.group:before{
		height: 70px ;
		width: 70px ;
	}
	
	img#slide{
		height: 300px ;
		height: 45vw ;
	}
}

@media ( max-width: 500px ){
	img#slide{
	/*	height: 250px ;*/
	}
}