/* ---------------------
Defaults Perch Blog
--------------------- */
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, blockquote, pre, a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,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 {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%; 
	font: inherit; 
	vertical-align: baseline; 
}

body {
	background: #fff; 
	line-height: 1;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after { 
	content: ''; 
	content: none;
}

ins {
	text-decoration: none; 
	background: #fff75c;
}

del {
	text-decoration: line-through;
}

em {
	font-style:italic;
}


abr {
	border-bottom:1px dotted;
}

input[type=submit], button {
	cursor:pointer;-webkit-appearance:none;
} 

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
	display: block;
} 

/* make sure the page doesn't shift horizontally */
html {
	overflow-y:scroll
}

a img { 
    border: none; 
 }




/* ------------------
Fonts
------------------ */

@font-face {
    font-family: 'OstrichSansMedium';
    src: url('ostrich-regular-webfont.eot');
    src: url('ostrich-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('ostrich-regular-webfont.woff') format('woff'),
         url('ostrich-regular-webfont.ttf') format('truetype'),
         url('ostrich-regular-webfont.svg#OstrichSansMedium') format('svg');
    font-weight: normal;
    font-style: normal;

}

*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
body, html { font-size: 100%; padding: 0; margin: 0;}

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }

body {
    color: #414141;
    font-family: Arial, sans-serif;
    font-size: 84%;
    line-height: 1.4;
    padding: 20px 0 0 0;
    background: #FFF;
    background-image: url("../images/background.jpg"); /* fallback */
    
}

.underline {
    border: 1px dotted #dee0e0;
    margin-bottom: 30px;
    width: 800px;
}


#twitter img{
     opacity:1;
    -webkit-transition: opacity;
    -o-transition:.4s;
    -ms-transition:.4s;
    -moz-transition:.4s;
    -webkit-transition:.4s;
    transition:.4s;
}

#twitter img:hover {
    opacity: 0.6;
-webkit-transition: opacity;
    -o-transition:.4s;
    -ms-transition:.4s;
    -moz-transition:.4s;
    -webkit-transition:.4s;
    transition:.4s; 
}

#facebook img{
     opacity:1;
    -webkit-transition: opacity;
    -o-transition:.4s;
    -ms-transition:.4s;
    -moz-transition:.4s;
    -webkit-transition:.4s;
    transition:.4s;
}

#facebook img:hover {
    opacity: 0.6;
    -webkit-transition: opacity;
    -o-transition:.4s;
    -ms-transition:.4s;
    -moz-transition:.4s;
    -webkit-transition:.4s;
    transition:.4s;
}


/* ------------------
Navigation
------------------ */

.navigation {
    position: relative;
    width: 500px;
    margin: 20px auto;
    margin-top: -30px; 
}

.main-title {

    text-align: center;

    margin-top: 29px;

    margin-bottom: 2px;

    }

.nav-items {

    text-align: center;

    position: relative;

    font-family: 'OstrichSansMedium', arial;

    letter-spacing: 1px;

    font-size: 25px;

    z-index:5;

    padding-bottom: 2px;

    -webkit-backface-visibility: hidden;
    -webkit-animation: imageAnimation 36s linear infinite 0s;
    -moz-animation: imageAnimation 36s linear infinite 0s;
    -o-animation: imageAnimation 36s linear infinite 0s;
    -ms-animation: imageAnimation 36s linear infinite 0s;
    animation: imageAnimation 36s linear infinite 0s;
    
    }


.nav-items li {

    list-style-type: none;

    display: inline;
    
    padding-right: 28px;

    }


.last {

    margin-right: -29px;

    }


.nav-items li a {
    text-decoration: none;
    color: #414141;
    -o-transition:.4s;
    -ms-transition:.4s;
    -moz-transition:.4s;
    -webkit-transition:.4s;
    transition:.4s; 
}

.nav-items li a:hover {

    color: #bf0a03;

    }

.nav-items li.active a {
    
    color: #bf0a03;
    
    }

.nav-items li.active-link a{

  color: #bf0a03;

    }

.background {

    position:absolute;

    opacity:0.05;
  
    filter: alpha(opacity=5);  

    -moz-opacity: 0.05; 

    -khtml-opacity: 0.05; 

    border-radius: 6px; 
  
    -moz-border-radius: 6px; 
  
    -webkit-border-radius: 6px; 

    background-color: #000;

    height: 215px;

    width: 500px;

    margin: 20px auto;

    margin-top: -210px;

    }

a {
	color: #888;
	text-decoration: none;
}

a:hover,
a:active {
	color: #414141;
}

/* Header Style */
.container > header {
	margin: 0 auto;
	padding: 2em;
	text-align: center;
	background: rgba(0,0,0,0.01);
}

.container > header h1 {
	font-size: 2.625em;
	line-height: 1.3;
	margin: 0;
	
}






/* -------------------------------------------------------------------
First Break: max-width: 579px - Mobile Portrait to Mobile Landscape
------------------------------------------------------------------ */

@media screen and (max-width: 660px) { 

.background {

    width: 100%;
    height: 221px;
}

.navigation {

    width: 100%;

    }

.nav-items {

    font-size: 18px;
    
    }



.nav-items li {
    list-style-type: none;
    display: inline;
    padding-right: 15px;
    margin-left:-6px;
}

.footer {

    margin-top: 15px;

    margin-bottom: 10px;

    margin-left: 5%;

    margin-right: 5%;

    text-align: center;

    font-family:  arial;

    font-size: 13px;

}

#facebook {
 text-align: center;
 margin-left: -20px;
 margin-top: -25px;
 margin-bottom: 20px
}

#twitter {

    text-align: center;

    margin-left: 26px;

    }



#texto-introducao{
	width: 100%;
	padding-left: 15px;
	padding-right: 15px;
	text-align:justify;
	margin-bottom: -20px;
}

.horizontalRule {
    clear:both; 
    width:90%;
}

#top {
    text-align:center; 
    margin-bottom: 13px; 
    margin-top: -20px;   
}

.main-title {
    margin-bottom: 6px;
}

.footer a{
    color: #414141; 
    text-decoration: underline;
}

.underline {
    border: 1px dotted #dee0e0;
    margin-bottom: 20px;
    width: 90%;
}




}

/* ------------------------------------------------------------------------------------
Second Break: 580px to 1024px - All Mobile Sizes + Tablet Portrait to Tablet Landscape 
------------------------------------------------------------------------------------ */
    
@media screen and (min-width: 661px) and (max-width: 1024px) { 


.footer {

    margin-top: 15px;

    margin-bottom: 10px;

    margin-left: 5%;

    margin-right: 5%;

    text-align: center;

    font-family:  arial;

    font-size: 13px;

}

#facebook {

 text-align: center;

 margin-left: -20px;

 margin-top: -25px;

  margin-bottom: 20px

    }

#twitter {

    text-align: center;

    margin-left: 26px;

    }

    .horizontalRule {

    clear:both; 

    width:90%;

    margin-top:-10px;

    }

    #texto-introducao{
	width: 100%;
	padding-left: 15%;
	
	padding-right: 15%;
	text-align:justify;
	margin-bottom: -20px;

}

#top {
    display: none; 
}

.underline {
    border: 1px dotted #dee0e0;
    margin-bottom: 20px;
    width: 70%;
}

.footer a{
    color: #414141; 
    text-decoration: underline;
}

}








/* ----------------------------------------------
Third Break: min-width: 1025px - Standard Desktop
---------------------------------------------- */

    
@media screen and (min-width: 1025px) { 

.footer {

    margin-top: 15px;

    margin-bottom: 20px;

    margin-left: 5%;

    margin-right: 5%;

    font-family:  arial;

    font-size: 13px;

}

#facebook {

    margin-right: 7%;

    margin-top: -42px;

    float: right;

    }

#twitter {

    margin-right: 5%;

    margin-top: -42px;

    float: right;

    }

.horizontalRule {

    clear:both; 

    width:90%;

    margin-top:-10px;

    }

#texto-introducao{
    margin: 20px auto;
	text-align:justify;
	margin-bottom: -10px;
    width: 800px;
}



#wrapper {
    width: 1050px;
    margin: 20px auto;
}
#top {
    display: none; 
}

}

#sobre-nos{
	width: 100%;
	text-align: center;
	font-family: 'OstrichSansMedium', arial, sans-serif;
    letter-spacing: 1px;
    font-size: 23px;
    margin-bottom: -22px;
    margin-top: 35px;

}


#teste {
    visibility:hidden;
	margin-top: -120px;
	margin-left: -10px;
}