/*
	Responsive Aeon Grid v2.0
	Designed & Built by Fernando Monteiro, http://www.newaeonweb.com.br	
	Licensed under GPL license, http://www.gnu.org/licenses/gpl-3.0-standalone.html
	
	Base stylesheet with CSS Body, quotes, typography, lists, Hyperlinks, tables, forms, clearfix and lights
*/

/* BODY Optmized */
body {margin: 0; min-height: 100%; -webkit-font-smoothing:antialiased; font-smoothing:antialiased; text-rendering:optimizeLegibility;}

/* Typography
============================================================================================== */
/*FONTS*/
@font-face {
	font-family: "titilliumtext25l004";
	src: url("titilliumtext25l004.eot");
	src: local("titilliumtext25l004"), url("../fonts/titilliumtext25l004.ttf") format("truetype");
}
@font-face {
	font-family: "titilliumtext25l";
	src: url('titilliumtext25l.eot');
	src: local("titilliumtext25l"), url("../fonts/titilliumtext25l.ttf") format("truetype");
}
@font-face {
	font-family: "Lato-Bol";
	src: url("Lato-Bol.eot");
	src: local("Lato-Bol"), url("../fonts/Lato-Bol.ttf") format("truetype");
}


body, button, input, select, textarea {font: 100%/1.5 "titilliumtext25l004",Georgia,Palatino,"Palatino Linotype",Times,"Times New Roman", sans-serif; *font-size: 1em; color:#333;} /* IE7 and older can't resize px based text */
p, blockquote, q, pre, address, hr, code, samp, dl, ol, ul, form, table, fieldset, menu, img {margin: 0 0 1.5em; padding: 0}
h1, h2, h3, h4, h5, h6 {font-family: "titilliumtext25l", Futura, "Century Gothic", AppleGothic, sans-serif;color:#222;text-shadow:1px 1px 1px rgba(0,0,0,.10)}
span.ampersand{font-family:Adobe Caslon Pro,Baskerville,"Goudy Old Style","Palatino","Palatino Linotype","Book Antiqua",Georgia,"Times New Roman",Times,serif;font-style:italic;font-size:110%;line-height:0;position:relative;vertical-align:baseline} /* Best available ampersand */

h1 {margin: 0; font-size: 2.5em; line-height: 1.2em; margin-bottom: 0.4em} /* 60px / 72px */
h2 {margin: 0; font-size: 2em; line-height: 1em; margin-bottom: 0.5em} /* 48px / 48px */
h3 {margin: 0; font-size: 1.5em; line-height: 1.3333333333333333333333333333333em; margin-bottom: 0.6667em} /* 36px / 48px */ 
h4 {margin: 0; font-size: 1.0em; line-height: 1em; margin-bottom: 1em} /* 24px / 24px */
h5 {margin: 0; font-size: 0.835em; line-height: 1.1428571428571428571428571428571em; margin-bottom: 1.1428571428571428571428571428571em} /* 21px / 24px */
h6 {margin: 0; font-size: 0.80em; line-height: 1.3333333333333333333333333333333em; margin-bottom: 1.3333333333333333333333333333333em} /* 18px / 24px */
p, ul, blockquote, pre, td, th, label {margin: 0; font-size: 1em; line-height: 1.5em; margin-bottom: 1.5em} /* 16px / 24px */
small, p.small {margin: 0; font-size: 0.875em; line-height: 1.7142857142857142857142857142857em; margin-bottom: 1.7142857142857142857142857142857em} /* 14px / 24px */

/* Quotes
============================================================================================== */
blockquote, q {quotes: none}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none}
blockquote, q, cite {font-style: italic}
blockquote {padding-left: 1.5em; border-left: 3px solid #ccc}
blockquote > p {padding: 0}

/* Lists
============================================================================================== */
ul, ol { margin-bottom: 18px; padding-left: 10px;}
ul { list-style: none outside; }
ol { list-style: decimal; }
ol, ul.square, ul.circle, ul.disc { margin-left: 30px; }
ul.square { list-style: square outside; }
ul.circle { list-style: circle outside; }
ul.disc { list-style: disc outside; }
li { margin-bottom: 0px; }
ul.large li { line-height: 21px; }

/* Navigation
============================================================================================== */
nav {
	width: 100%;
	float: left;
	margin: 0 0 0.2em 0;
	padding: 0;
	list-style: none; }
nav li {
	float: left;
	margin-right:20px; cursor: pointer;}
/* Hyperlinks
============================================================================================== */
a {text-decoration: none; color:#FFF}
a:hover {text-decoration: none}
a:focus {outline: thin dotted}
a:hover, a:active {outline: none;} /* Better CSS Outline Suppression */

/* Tables
============================================================================================== */
table {border-collapse: collapse; border-spacing: 0; margin-bottom: 1.5em}
th {text-align: left}
tr, th, td {padding-right: 1.5em; border-bottom: 0 solid #333}

/* Forms
============================================================================================== */
form {margin: 0}
fieldset {border: 0;padding: 0}
textarea {overflow: auto; vertical-align: top}
legend {*margin-left: -.75em}
button, input, select, textarea {vertical-align: baseline; *vertical-align: middle} /* IE7 and older */
button, input {line-height: normal; *overflow: visible}
button, input[type="button"], input[type="reset"], input[type="submit"] {cursor: pointer;-webkit-appearance: button}
input[type="checkbox"], input[type="radio"] {box-sizing: border-box;}
input[type="search"] {-webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box;	box-sizing: content-box}
input[type="search"]::-webkit-search-decoration {-webkit-appearance: none}
button::-moz-focus-inner, input::-moz-focus-inner {border: 0; padding: 0}

/* Clearfix helps
============================================================================================== */
.clear:before, .clear:after {content:"";display:table} /* For modern browsers */
.clear:after {clear:both}
.clear {zoom:1} /* For IE 6/7 (trigger hasLayout) */

/* Light and HIghlight text
============================================================================================== */
.light {color:#ff7c00;}
.lightgreen {color:#73880A;}
.highlight { background-color: #ff0; }

/* Floats and Hides
============================================================================================== */
.left  {float: left;}
.right {float: right;}
.hide  {display: none;}
.center{margin: 0 auto;}
.centerTxt{text-align: center;}

/*======================================================Place your Style Here======================================================*/
/*SECTIONS*/
#social {margin-top: 50px;}
#social img{margin: 0;}

#destaques h1 a{
    border-radius: 4px;
    margin: 0 auto;
    position: relative;
    text-align: center;
    text-transform: uppercase;
    width: 75%;
    z-index: 1;
    font-size: 22px;
    display: block;
    line-height: 1.5em;
}

#destaques p{color:#FFF;font-family: "titilliumtext25l004", Arial;}
#destaques img{border-bottom: 2px solid #C22428; margin-bottom: -20px;}

#blog{ background: url(../images/content/bg-saude-da-visao.jpg) center 0 #FFF;font-family: "titilliumtext25l004";}
#blog h1{padding-top: 15px;}
#blog h1 img{margin:0;}

#blog .data{
	margin: 0;
}
#blog .data p{
	width: 30%;
	background: #c22428;
	padding: 1% 1%;
	position: relative;
	z-index: 2;
}
#blog .titulo p{
	background: #c22428;
	padding: 1% 1%;
	text-transform: uppercase;
	width: 80%;
	position: relative;
	z-index: 2;
}
#blog .link{
	position: relative;
	z-index: 2;
	bottom: 6.4%;
	width: 15%;
	background: #000;
	padding-left: 1%;
}
#blog article{margin-bottom: 15px;}

#destaquesSub{font-family: "titilliumtext25l004";}
#destaquesSub p{color: #FFF;}

#blog2{ background: #000;font-family: "titilliumtext25l004";}
#blog2 h1{padding-top: 15px;}
#blog2 h1 img{margin:0;}

#blog2 .data{
	margin: 0;
	color: #FFF;
}
#blog2 .data p{
	width: 30%;
	background: #c22428;
	padding: 1% 1%;
	position: relative;
	z-index: 2;
}
#blog2 .titulo p a{
	display: block;
	padding: 1% 3%;
	text-transform: uppercase;
	position: relative;
	z-index: 2;
	color: #C22428;
	font-family: "titilliumtext25l", Arial;}
	
#blog2 .link{
	position: relative;
	z-index: 2;
	bottom: 6.4%;
	width: 15%;
	background: #000;
	padding-left: 1%;
	margin-top: 32%;
}
#blog2 article{margin-bottom: 15px;background: #FFF;}
#blog2 article img{margin-top: -58px;}
#blog2 #tabs img{margin-top: 0;}
#tabs .Vermelho{color:#c22428; margin-bottom: 0;}
#tabs{font-size: 0.8em;}

#conteudo p{color:#FFF;}
#sidebar .titulo a{color:#c22428;}
#breadcrumb {color: #fff;margin-top: -20px;padding: 20px 0;}
#breadcrumb a{color: #C22428;}

footer{
	background: #cbcbcb;
	padding-top: 2%;
	font-family: "titilliumtext25l004";
}
footer li{
	list-style: none;
	font-style: italic;
	display: block;
	width: 100%;
	border-bottom: 1px solid #000;
	margin-bottom: 4.5%;
}
/*SOLUTIONS*/
.alpha{opacity: 0;}
.Branco{color: #FFF;}
.Preto{color: #000;}
.Vermelho{color: #c22428;}
.Margem-Top{margin-top: 5%;}
article{list-style: none;}
/*NAVBAR*/
nav {
	list-style:none;
	font-family: TitilliumText25l, Arial;
}

ul.drop a {
	display:block;
	font-size:14px;
	text-decoration:none;
	padding:10px 25px;
	color: #FFF;
	border-right: 1px solid #c34347;
}

ul.drop,ul.drop li,ul.drop ul {
	list-style:none;
	margin:0;
	padding:0;
	color:#fff
}

ul.drop {
	position:relative;
	z-index:40;
	float:right
}

ul.drop li {
	float:left;
	line-height:2.7em;
	vertical-align:middle;
	zoom:1;
}

ul.drop li.hover,ul.drop li a:hover {
	position:relative;
	z-index:599;
}

ul.drop ul {
	visibility:hidden;
	position:absolute;
	top:100%;
	left:auto;
	z-index:598;
	width:195px;
	background:#fec10e
}

ul.drop ul li {
	float:none;
	border-bottom:1px solid #FFFFFF
}

ul.drop ul li a {
	color:#005042;
	padding: 4px 29px;
}

ul.drop ul li a:hover {
	padding: 4px 29px;
	color: #999
}
ul.drop ul ul {
	top:-2px;
	left:100%
}

ul.drop li:hover > ul {
	visibility:visible
}

/*THEME STYLES*/
body{
	background: #5a5a5a; /* Old browsers */
	background: -moz-radial-gradient(center, ellipse cover,  #5a5a5a 0%, #000000 100%); /* FF3.6+ */
	background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#5a5a5a), color-stop(100%,#000000)); /* Chrome,Safari4+ */
	background: -webkit-radial-gradient(center, ellipse cover,  #5a5a5a 0%,#000000 100%); /* Chrome10+,Safari5.1+ */
	background: -o-radial-gradient(center, ellipse cover,  #5a5a5a 0%,#000000 100%); /* Opera 12+ */
	background: -ms-radial-gradient(center, ellipse cover,  #5a5a5a 0%,#000000 100%); /* IE10+ */
	background: radial-gradient(ellipse at center,  #5a5a5a 0%,#000000 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5a5a5a', endColorstr='#000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

.navbar{background: url(../images/bgNavbar.png) repeat-x #0055a5;}
ul.drop{background-color: #B32D31;}
ul.drop a {
	border-right: 1px solid #c34347;
}
.active a {
	background: #c22428; 
	-webkit-box-shadow: inset 0px 0px 5px 4px #8b1a1c;        
	box-shadow: inset 0px 0px 5px 4px #8b1a1c;
	padding:2px 10px
}

.hover{
	background: #c22428; 
	-webkit-box-shadow: inset 0px 0px 5px 4px #8b1a1c;        
	box-shadow: inset 0px 0px 5px 4px #8b1a1c;
	height:63px;
	margin-top:-63px;
	display:none;
}
#destaques h1 a{    
	background: none repeat scroll 0 0 #C22428;
    color: #FFFFFF;
}
#blog h1{color: #FFFFFF;}
#blog p{color: #FFFFFF;}
#blog .Preto{color: #000;}

#blog2 h1{color: #FFFFFF;}
#blog2 a{color: #000;padding-left: 0;display: block;}
#blog2 .Preto p a{color: #000;}

.BgPreto{background: #040404;}
.Bola1{background-size:100%; background-repeat: no-repeat;}
/*======================================================/Place your Style Here======================================================*/

/* CSS for jQuery Reveal Plugin
 * Maintained for Foundation. foundation.zurb.com
 * Free to use under the MIT license.
 * http://www.opensource.org/licenses/mit-license.php
 * Adapted to Responsive Aeon Framework by Fernando Monteiro

/*	--------------------------------------------------
	Reveal Modals
	-------------------------------------------------- */
		
	.reveal-modal-bg { 
		position: fixed; 
		height: 100%;
		width: 100%;
		background-color: #000;
		z-index: 40;
		display: none;
		top: 0;
		left: 0; 
		}
	
	.reveal-modal {
		visibility: hidden;
		top: 100px; 
		left: 50%;
		margin-left: -300px;
		width: 520px;
		background: #eee url(../images/modal-gloss.png) no-repeat -200px -80px;
		position: absolute;
		z-index: 41;
		padding: 30px 40px 34px;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		-moz-box-shadow: 0 0 10px rgba(0,0,0,.4);
		-webkit-box-shadow: 0 0 10px rgba(0,0,0,.4);
		box-shadow: 0 0 10px rgba(0,0,0,.4);
		behavior:url(js/pie.htc);
		}
		
	.reveal-modal.small 		{ width: 200px; margin-left: -140px;}
	.reveal-modal.medium 		{ width: 400px; margin-left: -240px;}
	.reveal-modal.large 		{ width: 600px; margin-left: -340px;}
	.reveal-modal.xlarge 		{ width: 800px; margin-left: -440px;}
	
	.reveal-modal .close-reveal-modal {
		font-size: 22px;
		line-height: .5;
		position: absolute;
		top: 8px;
		right: 11px;
		color: #aaa;
		text-shadow: 0 -1px 1px rgba(0,0,0,.6);
		font-weight: bold;
		cursor: pointer;
		} 
	
	.reveal-modal .row {
		min-width: 0;
	}
	
	/* Mobile */
		
		@media handheld, only screen and (max-width: 1023px) {
			.reveal-modal-bg { position: absolute; }
			
			.reveal-modal,
			.reveal-modal.small,
			.reveal-modal.medium,
			.reveal-modal.large,
			.reveal-modal.xlarge { width: 60%; top: 60px; left: 15%; margin-left: 0; padding: 20px; height: auto; }
		}
		
		@media handheld, only screen and (max-width: 767px) {
			.reveal-modal-bg { position: absolute; }
			
			.reveal-modal,
			.reveal-modal.small,
			.reveal-modal.medium,
			.reveal-modal.large,
			.reveal-modal.xlarge { width: 80%; top: 15px; left: 5%; margin-left: 0; padding: 20px; height: auto; }
		}
	
	
	/*
			
	NOTES
	
	Close button entity is ×
	
	Example markup
	
	<div id="myModal" class="reveal-modal">
		<h2>Awesome. I have it.</h2>
		<p class="lead">Your couch.  I it's mine.</p>
		<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In ultrices aliquet placerat. Duis pulvinar orci et nisi euismod vitae tempus lorem consectetur. Duis at magna quis turpis mattis venenatis eget id diam. </p>
		<a class="close-reveal-modal">&#215;</a>
	</div>
	
	*/
ui-tabs-hide{
	visibility: hidden;
}
/* Custom sizes
============================================================================================== */

@media screen and (max-width: 480px) {
 /* Add your styles for devices with a maximum width of 480 */
#social{display:none;}
#slide{display:none;}
#destaquesSub{display:none;}
}

/*CUSTOM TO FACEBOOK APP*/
@media screen and (max-width: 810px) {
	/* Add your styles for devices with a maximum width of 768 */
	ul.drop a{
		padding-left: 14px;
		padding-right: 14px;
	}
	header img{
		max-width:140%;
	}
}

@media screen and (max-width: 768px) {
 /* Add your styles for devices with a maximum width of 768 */
  #social{display:none;}
  #destaquesSub{display:none;}
}

@media screen and (max-width: 320px) {
 /* Add your styles for devices with a maximum width of 320 */
  #social{display:none;}
  #slide{display:none;}
}

@media screen and (max-width: 1024px) {
 /* Add your styles for devices with a maximum width of 1024 */
}