/*  ========================================================================
	Nerocom Digital
	========================================================================
	web				: http://www.nerocom.com.br
	version			: 15/06/2012
	copyright		: (c) 2006/2012 Nerocom digital Ltda.
	layout design	: Anderson Rossi
	css/html/js		: Jerry R. Orza
	========================================================================
*/

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video, input, textarea, select {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
transition:all .4s linear;
-o-transition:all .4s linear;
-moz-transition:all .4s linear;
-webkit-transition:all .4s linear;
}

/* =============FONT-FACE============== */
@font-face {
    font-family: 'Aller';
    src: url('fonts/Aller_Lt.eot');
    src: url('fonts/Aller_Lt.woff') format('woff'),
         url('fonts/Aller_Lt.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* =============================================================================
   HTML5 display definitions
   ========================================================================== */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {display:block;}
audio, canvas, video {display:inline-block; *display: inline; *zoom: 1;}
audio:not([controls]) {display:none;}

html, body {background:#e3e4e5;}

/* =============================================================================
   Minimal Base Style
   ========================================================================== */
/* Always force a scrollbar in non-IE */
html {overflow-y:scroll;}
a:hover, a:active { outline: 0; }
ol { list-style-type: decimal; }
nav ul, nav li { margin: 0; list-style:none; list-style-image: none; }
strong, b, th { font-weight: bold; }
i, em {font-style:italic;}
td { vertical-align: top; }

::-moz-selection{ background: rgba(241,95,34,.8);/* orange color */ color:#ffffff; text-shadow: none; }
::selection { background: rgba(241,95,34,.8);/* orange color */ color:#ffffff; text-shadow: none; }

a:link { -webkit-tap-highlight-color:#444444;}

/* =============================================================================
   Tweak These
   ========================================================================== */
body, select, input, textarea {
	color: #fff;
	/* Set your base font here, to apply evenly */
	font-size:100%; /* default body font-size&line-height: 100% -> 1em = 16px */
	line-height: 1.4em; /* setting up the baseline, line-height= 24px/16px */
	font-family: Aller, Tahoma, Arial, Helvetica, sans-serif; 
	/* line-height set to 1.125em = 18px 18px / 16px = target line height / font-size -- this is a suitable line-height for body copy to ensure vertical rhythm */
}

.fleft						{float:left !important;}
.fright						{float:right !important;}
.clear						{clear:both !important;}
a.btm:link,
a.btm:visited,
a.btm						{background:url(images/bg_btm.png) repeat-x left top; display:inline-block; margin:1em 0 2em 0; padding:.8em 4em; font-weight:bold; color:#fff; font-size:1.1em; -webkit-border-radius:15px; -moz-border-radius:15px; -ms-border-radius:15px; -o-border-radius:15px; border-radius:15px;}
a.btm:hover					{text-decoration:none; color:#fff; opacity:.9; filter:alpha(opacity=90);}

/* Contain floats: nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before,
.clearfix:after 					{content:""; display:table;}
.clearfix:after 					{clear:both;}
.clearfix 						{zoom:1;}

/* =============================================================================
	BASIC FONT STYLES: Headings (From H1 to H6) and Body Text
   ========================================================================== */
h1, h2, h3, 
h4, h5, h6 			{font-weight:bold; -webkit-transition:all 0.1s ease-in-out; -moz-transition:all 0.1s  ease-in-out; -o-transition:all 0.1s  ease-in-out; transition:all 0.1s  ease-in-out;}
h1, h2, h3 			{font-family:Aller, Tahoma, Arial, Helvetica, sans-serif; color:#fff; font-weight:normal;}
h1 					{font-size:2.625em; line-height:1em; margin:0;}
h2 					{display:block; margin:0 0 .6em 0; text-transform:uppercase; color:#2f3e5a; text-shadow:1px 1px 2px #000; font-size:2em; line-height:1.2em;}
#pg_home h2			{border-bottom:2px solid #999; padding-bottom:.1em; font-size:1.6em; margin-bottom:1em;}
h3 					{font-size:1.1em; text-transform:uppercase; line-height:1.33em; margin-bottom:.3em; color:#2f3e5a; font-weight:bold;}
h4 					{font-size:1.1em; line-height:1.33em; margin-bottom:.2em; color:#2f3e5a; font-weight:bold;}
p 					{font:0.875em/1.714285714285714em Tahoma, Arial, Helvetica, sans-serif; margin:0 0 1.4em 0; color:#444;}

/*------------------------------------------------------------------------------------------------------------------------------------
	MEDIA SECTION
 --------------------------------------------------------------------------------------------------------------------------------------*/	 
img, object {max-width: 100%;}

/*---------------------------------------------------------------------------------------------------------------------------------------
   LINKS SECTION
-----------------------------------------------------------------------------------------------------------------------------------------*/
a, a:visited {color:#3A4B6B; text-decoration:none; outline:none;}
a:active {position:relative; top:1px;}
a:hover {
	color: #333;
	text-decoration:underline;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear;
	-o-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	transition: all 0.2s linear; /* future proofing */
}

/*-----------------------------------------------------------------------------------------------------------------------------------------
	LAYOUT STRUCTURE
	-------------------------------
	The Mastermind behind this awesome site -> Javier Lo.
-----------------------------------------------------------------------------------------------------------------------------------------*/
.container 					{max-width:960px; width:92%; margin:0 auto;}
#wrapper					{}
#header, 
#main, #footer				{width:100%; position:relative;}
#main						{}
#main .box					{background:#d6d7d8; padding:3em 1.5em 1.5em 1.5em;}
#pg_home #main .box			{padding:1em;}

#content					{float:left; width:69%; border-right:1px dotted #bbb; padding-right:1.5%;}
#sidebar					{float:right; width:28%; margin-top:3.6em;}
#pg_home #sidebar			{margin-top:0;}

#pg_logi #content			{padding-right:0; border:0; width:100%;}
#content a img:hover			{opacity:.9; filter:alpha(opacity=90);}

/*------------------------------------------------------------------------------------------------------------------------------------
	HEADER SECTION
 --------------------------------------------------------------------------------------------------------------------------------------*/
#header 						{background:url(images/bg_top.png) repeat-x left top; margin-bottom:1em;}
#logo 						{display:block; width:30%; float:left;}
#logo img					{max-width:100%; padding:15px 3em 16px 3em; background:#e3e4e5;}
#top_cont					{width:65%; float:right; text-align:right; margin:1.8em 2% 0;}	
#top_cont span				{font-size:2.2em; color:#fff;}
#top_cont span span			{font-size:.6em;}
#top_cont a					{font-size:1em; color:#fff;}
	
#nav 						{width:69%; clear:right; float:right; margin-top:3em;}
#nav ul						{float:right;}
#nav ul li 						{float:left; margin:0 0 1em 0; border-right:1px solid #fff;}
#nav ul li a 					{display:block; color:#fff; font-size:1.1em; line-height:1em; padding:0 1em; text-transform:uppercase; text-decoration:none;}
#nav ul li.last				{border-right:0;}
#pg_home .m_home,
#pg_inst .m_inst,
#pg_serv .m_serv,
#pg_faqs .m_faqs,
#pg_link .m_link,
#pg_cont .m_cont,
#nav ul li a:hover 				{color:#1e2d49; text-decoration:none;}
#nav ul li a:visited			{text-decoration:none;}
#nav ul li a:active 			{text-decoration:none;}

#footer 						{padding:2em 0 1.5em 0; background:#a2a2a3 url(images/bg_rod.png) repeat-x left top;}
#footer address				{text-align:center; color:#1f2b40;}
#footer address a				{color:#1f2b40;}

#footer .container			{position:relative;}
#footer #nero				{position:absolute; right:0px; bottom:2px; width:16px; height:19px;}
#footer #nero a				{display:block; width:16px; height:19px; background:transparent url(http://www.nerocom.com.br/images/nero_logo.png) no-repeat 0 0; outline:none;}
#footer #nero a:hover		{background-position:0 -19px;}

/*------------------------------------------------------------------------------------------------------------------------------------
	CONTENT SECTION
 ------------------------------------------------*/

#slider						{width:100%; position:relative; z-index:1; margin-bottom:10px;}
#slider ul					{width:100%; list-style:none; overflow:hidden; margin:0 auto;}
#slider li					{width:100%; position:relative;}
#slider li a					{width:100%; display:block;}
#slider li a .slider_img		{float:left; width:70%; height:370px; overflow:hidden;}
#slider li a .slider_img img	{width:100%; height:100%;}
#slider li a .slider_box		{float:right; width:30%; height:370px; color:#fff; text-align:center; background:url(images/bg_slider.png) no-repeat left top;}
#slider li a .slider_box div	{padding-left:16px;}
#slider li a h2				{font-weight:bold; font-size:1.2em; margin:8em 1em .5em; border:0; text-transform:none; text-shadow:none; color:#fff;}
#slider li a span				{font-size:14px; margin:0 1em; display:block;}
#slider li a:hover				{text-decoration:none;}
.slider_controls			{padding:5px 5px 5px 15px; text-align:center;}
.slider_controls a			{text-align:center; display:inline-block; background: url(images/slider_2.png) no-repeat center center; margin:0 5px; width:20px; height:20px; text-decoration:none; text-align:center; font-size:10px; color:transparent; text-indent:-5000em;}
.slider_controls a.activeSlide{background-image: url(images/slider_1.png);}

#twittercontainer			{border:3px solid; border-radius:20px; background-color:lightgrey; opacity:0.7; max-width:500px; margin:auto;}

.img_h2_serv				{width:100%; height:14em; overflow:hidden; margin-bottom:1.5em;}
.img_h2_serv img				{width:100%;}

.box_serv					{margin:0 1% 1.5em 0; float:left;}
.box_serv a					{width:100%; display:block; border:1px solid #bbb;}
.box_serv a div				{width:96%; padding:2% 2% 0 2%;}
.box_serv a div img			{max-width:100%; display:block;}
.box_serv a span				{text-align:center; display:block; background:#589c43; padding:.6em 0; color:#fff; font:.875em/1em Aller, Tahoma, Arial, Helvetica, sans-serif;}
.box_serv a:hover			{text-decoration:none; border-color:#999;}
.box_serv a:hover img			{opacity:.9; filter:alpha(opacity=90);}
.box_serv a:hover span		{background:#478b32;}
.box_serv.box_serv3un		{width:32%; margin-right:1.65%;}
.box_serv.box_serv4un		{width:48.5%; margin-right:3%;}
.box_serv.box_serv3un.last,
.box_serv.box_serv4un.last	{margin-right:0;}

ul.list						{margin:.8em 0 2em 2.5em; list-style:outside disc; color:#444;}
ul.list li						{margin-bottom:.5em;}

/* =============CONTATO============= */
.form 						{font-size:.875em; margin:0 0 1em 0;}
.form input,
.form select,
.form textarea,
.form label					{display:block; margin-bottom:5px; color:#444;}
.form select,
.form input,
.form textarea					{width:60%; border:1px solid #bbb; padding:.3em; margin-bottom:1em; color:#333; background:#fff;}
.form input.half				{width:30%;}
.form input.hhalf				{width:12%;}
.form textarea					{height:8em;}
.form input.submit			{width:auto; padding:.8em 1.5em; background:#3A4B6B; border:0; color:#fff; text-transform:uppercase; display:inline; margin-right:15px;}
.form input.submit:hover		{background:#444; cursor:pointer;}
.form select					{margin-bottom:10px; margin-bottom:1.2em; width:auto; max-width:61.6%;}
.form select:focus,
.form input:focus,
.form textarea:focus,
.form select:hover,
.form input:hover,
.form textarea:hover			{border-color:#999; background:#f3f3f3;}
.form .input_inline			{display:inline; width:auto;}
.forms label					{float:left; width:20%; margin-right:1em; text-align:right; height:1.5em;}
.forms span					{font-size:.875em; color:#777; display:inline;}
.forms span.fright			{margin-right:2em;}
.forms.half					{float:left; width:48%; margin-right:2%;}
.forms.half label				{width:60%;}
.forms.half input				{width:20%;}

fieldset						{border:1px solid #aaa; padding:1em 0; margin:1em 0;}
fieldset legend					{color:#fff; background:#3A4B6B; padding:.2em 1em; margin:0 1em; font-size:.775em;}

.notice_success				{color:#386F42; font-size:.825em; font-weight:bold; margin:1em 0px; padding:.5em; background:#eee;}
.notice_error				{color:#f00; font-size:.825em; font-weight:bold; margin:1em 0px; padding:.5em; background:#eee;}

.form select.error,
.form input.error,
.form textarea.error			{border:1px solid #d66;}
.form select.valid,
.form input.valid,
.form textarea.valid			{border:1px solid #386F42;}
.form label.error				{color:#f00; font-size:.9em; display:none !important;}

#form_login					{background:#ddd; border:1px solid #bbb; width:50%; margin-left:21%; padding:3% 2% 2%;}

#content address				{display:block; margin:1.5em 0 .5em 0;}
#content address,
#content address a				{color:#3A4B6B; font-weight:bold; font-size:1.1em;}

#twtr-widget-1				{}
#twtr-widget-1 p,
#twtr-widget-1 h3,
#twtr-widget-1 h4			{font-size:inherit !important; text-transform:inherit !important; font-family:inherit !important;}

@media only screen and (max-width: 800px) { /* if smaller than  768px hence.. Style adjustments for viewports 768px and over go here */ /* Resolutions for tablets*/
	#logo						{width:121px;}
	#nav						{width:60%; margin-top:2em;}
	#nav ul li a 					{padding:0 .8em;}
	#slider li a .slider_img,
	#slider li a .slider_box		{width:50%;}	
}

@media only screen and (max-width: 600px) {
	
}

@media only screen and (max-width: 480px) { /*if smaller than 480px, hence...*/ /* Resolutions for Iphone4/Retina Display */
	#logo						{width:84px;} /*50%*/
	p 							{font-size:0.875em;}
	h2 							{font-size:1.5em;}
	#content					{width:100%; border:0; padding:0 0 1em 0;}
	#sidebar,
	#slider						{display:none;}
	#main .box					{background:transparent; padding:0;}
	#top_cont					{margin-top:2em;}
}

@media only screen and (max-width: 320px) {  /* if smaller than 320px, hence...*/ /* Resolutions for Iphone3GS */
	body 						{overflow-x:hidden;}
	#logo						{width:60px;} /*33%*/
	#logo_marca					{width:85px;} /*33%*/
	#logo_moto					{width:205px;} /*33%*/
	.logotag h3 					{text-align:center; margin:10px 0;}
	.footer-main, 
	.footer-side  				{width:auto;}
	.footer-side1 				{width:auto; margin-left:0;}
	.footer-side2 				{width:100%; margin-left:0;}		
	.credit 						{float:none; text-align:center;}
	.contact 					{display:none; visibility:hidden;}
	.thumbnail-alignleft 		{float:none;}
}

@media print {
	* 							{background:transparent !important; color:black !important; text-shadow:none !important; filter:none !important; -ms-filter:none !important;}
	a, a:visited 				{text-decoration:underline;}
	a[href]:after 				{content:" (" attr(href) ")";}
	abbr[title]:after 			{content:" (" attr(title) ")";}
	.ir a:after, 
	a[href^="javascript:"]:after, 
	a[href^="#"]:after 			{content:"";}
	pre, blockquote 				{border:1px solid #999; page-break-inside:avoid;}
	thead 						{display:table-header-group;}
	tr, img 						{page-break-inside:avoid;}
	img 							{max-width:100% !important;}
	@page 						{margin:0.5cm;}
	p, h2, h3 					{orphans:3; widows:3;}
	h2, h3 						{page-break-after:avoid;}
}