@font-face {
    font-family: 'FlamaSemicondensedExtrabold';
    src: url('fontes/flamasemicondensed-extrabold.eot');
    src: url('fontes/flamasemicondensed-extrabold.eot') format('embedded-opentype'),
         url('fontes/flamasemicondensed-extrabold.woff') format('woff'),
         url('fontes/flamasemicondensed-extrabold.ttf') format('truetype'),
         url('fontes/flamasemicondensed-extrabold.svg#FlamaSemicondensedExtrabold') format('svg');
}


* {
	margin: 0;
	padding: 0;
}
body {
	margin: 0;
	color: #333;
	padding: 0;
	font-family:Georgia, "Times New Roman", Times, serif;
}

#texto p a {
  color:#7d894b;
  -webkit-transition:0.3s ease-out; 
  -moz-transition: 0.3s ease-out; 
  -ms-transition:0.3s ease-out; 
  -o-transition:0.3s ease-out; 
  transition: 0.3s ease-out;
  font-weight: bold;
    padding:2px;
}

#texto p a:hover, #texto p a:focus {
  color: #FFFFFF;
  padding:2px;
  text-decoration:none;
  background:#7d894b;
  
}

.box_principal{
	background:#dfdfdf;
	padding:20px;
}

.box_principal h2{
	margin-bottom:15px;
}
.box_principal h3{
	margin-bottom:30px;
}
.credito{
	font-size:17px;	
	 font-family: 'FlamaSemicondensedExtrabold';
	 color:#999;
	 margin-top:-10px;
}




#galeria_esquerda {
	width: 50%;
	float: left;
	margin-right: 20px;
}
#galeria_direita {
	width: 50%;
	float: right;
	margin-left: 20px;
}
#galeria {
	width: 100%;
	margin-bottom: 15px;
	margin-top: 15px;
}



.box_1{
	width:50%;
	float:left;

}
.box_1 ul{
	width: 80%;
}
.box_1 ul li{
	list-style:inside;
	list-style-type:decimal;
	font-size:12px;
	margin-top:20px;

}
.box_2{
	float:right;
	width:50%;
	
}

p {
	margin: 0 0 20px 0;
}


.video_direita{
	float:right;
	width:560px;
	margin-left:20px;
}



.introducao{
	font-size:18px;
	font-style:italic;
}

.foto_cheia{
	float:left;
	position:relative;
	padding:0;
	width:100%;
	height:337px;
	margin-bottom:10px;
	margin-right:20px;
}
.foto_esquerda{
	float:left;
	position:relative;
	padding:0;
	width:400px;
	height:364px;
	margin-right:20px;
	margin-bottom:10px;
}
.foto_direita{
	float:right;
	position:relative;
	padding:0;
	width:400px;
	height:364px;
	margin-left:20px;
	margin-bottom:10px;
}
.foto_esquerda img, .foto_direita img .foto_cheia img{
	line-height:0;
}
.legenda{
	background:	#7d894b;
	position:absolute;
	font:12px Arial, Helvetica, sans-serif;
	bottom:0;
	padding:10px;
	color:#FFF;
}
.desenhos_grande{
	width:960px;
	height:401px;
	position:relative;
}
.lengenda_1{
	width:200px;
	position:absolute;
	font:12px Arial, Helvetica, sans-serif;
	top:0;
}
.lengenda_2{
	width:200px;
	position:absolute;
	font:12px Arial, Helvetica, sans-serif;
	top:250px;
	right:330px;
}



.desenhos_esquerdo{
	float:left;
	margin-right:20px;
	width:300px;
	padding-bottom:20px;
	border-bottom:3px solid #CCC;
}
.desenhos_direita{
	float:right;
	margin-left:20px;
	width:300px;
	padding-bottom:20px;
	border-bottom:3px solid #CCC;
}
.titulo_legenda{
	font-family: "FlamaSemicondensedExtrabold";
	margin-bottom:20px;
	font-size:18px;
}
.legenda_desenho{
	font-size:13px;
	line-height:1.2em;
	font-family:Arial, Helvetica, sans-serif;	
}

#hasting{
	background:#DFDFDF;
	width:460px;
	float:right;
	padding:10px;
	font-size:12px;
	height:	400px;
	margin-left:20px;
	margin-bottom:20px;
	overflow-y:auto;
}
.livros{
	float:left;
	margin-right:20px;	
}


#hasting p{
	margin-top:10px;
	margin-bottom:10px;

}
#hasting h3{
	margin-bottom:10px;

}

.thumb_1{
	border:5px solid #CCC;
	display:block;
	float:left;
	line-height: 0;
	margin-right:20px;
}
.thumb_1:hover{
	border:5px solid #7d894b;
	display:block;
	
	background:#FFF;
}

.intro_sub {
	font-family: "FlamaSemicondensedExtrabold";
	font-size: 50px;
	color: #FFF;
	margin:auto;
	width:960px;
	line-height:50px;


}
#tarja_titulo{
	margin:0;
	background:#7d894b;
	width:100%;
	height:80px;
	padding-top:25px;
}

.mapa_1916_ofensiva {
	
	padding: 10px;
	width: 470px;
	float: right;
	margin-left: 20px;
	margin-bottom: 6px;
}
.mapa {

	padding: 10px;
	width: 700px;
	float: right;
	margin-left: 20px;
	margin-bottom: 20px;
}
.mapa_cheio {
	width: 100%;
	margin-top:30px;
	margin-bottom: 20px;
}
.foto {
	width: 100%;
	height: 200px;
	margin-bottom: 20px;
	text-align: center;
	border: 1px solid #CCC;
}
img {
	border: 0;
}
#titulo {
	font-family: Lucida Fax;
	font-size: 3em;
	float: left;
	margin-top: 150px;

}

#rodape{
		
	width:100%;
	position:fixed;
	height:54px;
	bottom:0;
	z-index:600;
	background:#000;
	
}

.linha_fina{
	font-size:18px;
	color:#666;
	border-left:5px solid #7d894b;
	padding-left:20px;
	margin-left:20px;
	margin-bottom:30px;
	margin-top:20px;
}

.citacao{
	font-size:20px;
	color:#666;
	font-style:italic;
	line-height:30px;
	margin-top:40px;
	margin-bottom:40px;
	padding:10px;
	
}
.citacao:before{
	content: url(images/aspas.png);
	vertical-align:bottom;
		float:left;
		margin-right:20px;
	
}

#autor{
	width:100%;
	height:150px;
	margin-top:30px;
	margin-bottom:30px;
	position:relative;
}

.foto_andrei{
	background:url(images/foto_andrei.png) no-repeat;
	height:150px;
	width:150px;
	float:left;
}
#titulo_andrei{
	position:absolute;
	left:180px;
	top:20px;
	color:#7d894b;

}
.informacao_andrei{
	position:absolute;
	top:55px;
	left:180px;	
}
.informacao_andrei p{
	font-size:12px;
	margin-top:5px;
}



#nav {
	font-family: "FlamaSemicondensedExtrabold";
	list-style: none;
	margin: auto;
	width: 970px;
	white-space:nowrap;
	margin-top: 15px;
	    
}
#nav li {
	display: inline;
}
#nav li a {
	
	display: inline;
	color: #7d894b;
	font-size: 20px;
	text-decoration: none;
	padding:19px 7px 19px 7px;
	margin-left:-3px;
	border-right:2px solid #CCC;
	white-space: pre;
	
	
}
#nav li a:hover {
	background:#DBDBDB;
	border-bottom:  4px solid #7d894b;
		
	
}
.ativo {
	
	background: #DBDBDB;
	white-space: pre;
	margin-left:-3px;
	padding:19px 0px 19px 0px;
	border-bottom:  4px solid #7d894b;

}
.cap9_link{
	

}

#nav_2 {
	list-style: none;
	font-family: "FlamaSemicondensedExtrabold";
	position:absolute;
	left:320px;
	top:10px;
}


#nav_2 li {
	display: inline;
}
#nav_2 li a {
	color: #FFFFFF;

	font-size: 28px;
	margin-right:-3px;
	border-left:1px solid #999;
	padding:10px;
	text-decoration: none;
	 -webkit-transition:0.3s ease-out; /* Saf3.2+, Chrome */
  	-moz-transition: 0.3s ease-out; /* Firefox 4+ */
  	-ms-transition:0.3s ease-out; /* IE10+ */
  	-o-transition:0.3s ease-out; /* Opera 10.5+ */
  	transition: 0.3s ease-out;
}
#nav_2 li a:hover {
	color: #ccc;
	font-size: 28px;
	padding:10px;
margin-right:-3px;
	text-decoration: none;
	background:#7d894b;
}
.ativo_2 {

	background:#7d894b;

	margin-right:-4px;
		padding:22px 3px 15px 0px;
	text-decoration: none;
	 -webkit-transition:0.3s ease-out; /* Saf3.2+, Chrome */
  	-moz-transition: 0.3s ease-out; /* Firefox 4+ */
  	-ms-transition:0.3s ease-out; /* IE10+ */
  	-o-transition:0.3s ease-out; /* Opera 10.5+ */
  	transition: 0.3s ease-out;
}
#video {
	padding: 0;
	position: relative;
}
.titulo_menu{
	font-size:21px;
	color: #7d894b;
	width:220px;
	font-family: "FlamaSemicondensedExtrabold";
	text-align:right;
	padding-bottom:10px;
	background:url(images/seta_menu.png) no-repeat 7px 9px;
	border-bottom:3px solid #7d894b;
}




#menu_anos{
	float: right;
	width:220px;
}

#menu_anos ul{
	list-style: none;
	margin-bottom:20px;
}
#menu_anos li {
	font-family: "FlamaSemicondensedExtrabold";
}
#menu_anos li a:link, #menu_anos li a:visited {
	text-decoration: none;
	display: block;
	color: #FFFFFF;
	font-size: 30px;
	padding-left: 25px;
	border-bottom: 1px solid #CCCCCC;
		 -webkit-transition:0.3s ease-out; /* Saf3.2+, Chrome */
  	-moz-transition: 0.3s ease-out; /* Firefox 4+ */
  	-ms-transition:0.3s ease-out; /* IE10+ */
  	-o-transition:0.3s ease-out; /* Opera 10.5+ */
  	transition: 0.3s ease-out;
}
#menu_anos li a:hover {
	background: #999;
}

#facebook{
	width:42px;
	background:transparent url(images/facebook.png) no-repeat;
	height:42px;
	display:block;
	float:left;
	margin-right:26px;
	margin-left:20px;
	text-indent:-999999px;
	-webkit-transition:0.3s ease-out; 
  	-moz-transition: 0.3s ease-out; 
  	-ms-transition:0.3s ease-out; 
  	-o-transition:0.3s ease-out; 
  	transition: 0.3s ease-out;
}
#facebook:hover{

	background:url(images/facebook_hover.png) no-repeat;


}

#twitter{
	width:42px;
	background:transparent url(images/twitter.png) no-repeat;
	height:42px;
	display:block;
	float:left;
	margin-right:26px;
	text-indent:-999999px;
	-webkit-transition:0.3s ease-out; 
  	-moz-transition: 0.3s ease-out; 
  	-ms-transition:0.3s ease-out; 
  	-o-transition:0.3s ease-out; 
  	transition: 0.3s ease-out;
}
#twitter:hover{

	background:url(images/twitter_hover.png) no-repeat;


}


#google{
	width:54px;
	background:transparent url(images/google.png) no-repeat;
	height:42px;
	display:block;
	float:left;
	text-indent:-999999px;
	border:none;
	-webkit-transition:0.3s ease-out; 
  	-moz-transition: 0.3s ease-out; 
  	-ms-transition:0.3s ease-out; 
  	-o-transition:0.3s ease-out; 
  	transition: 0.3s ease-out;
}
#google:hover{
	background:url(images/google_hover.png) no-repeat;
}

#menu {
	background: #FFFFFF;
	height: 60px;
	position: fixed;
	top:30px;
	z-index: 300;
	width: 100%;
	border-bottom:4px solid #333;
	box-shadow: 0px 0px 5px #333;
}
.iframe_topo{
	position:fixed;
	top:0;
	height:33px;
	z-index:400;
	background:#FFF;	
	border-bottom:1px solid #CCC;
}



.vermelho {
	font-size: 2em;
}
.assinatura_andrei{

	margin-right:20px;
	margin-bottom:0px;
	float:left;
	line-height:1.8em;
	font-size:11px;
	font-style:italic;
	border-bottom:1px solid #333;
}
.assinatura_andrei strong{
	font-size:16px;
}
#foto_1 {
	background: url(images/foto-1.jpg) 50% 0 no-repeat fixed;
	color: white;
	height: 500px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;

}
#foto_2 {
	background: url(images/foto-2.jpg) 50% 0 no-repeat fixed;
	color: white;
	height: 500px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
}
#foto_3 {
	background: url(images/foto-3.jpg) 50% 0 no-repeat fixed;
	color: white;
	height: 500px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
}
#foto_4 {
	background: url(images/foto-4.jpg) 50% 0 no-repeat fixed;
	color: white;
	height: 500px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
}
#foto_5 {
	background: url(images/foto-5.jpg) 50% 0 no-repeat fixed;
	color: white;
	height: 500px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
}
.story {
	margin: 0 auto;

	overflow: auto;
	width: 970px;
}
#topo {
	margin: 0 auto;
	min-width: 980px;
	overflow: auto;
	width: 970px;
}
#texto {
	width: 970px;
	margin: auto;
	padding-top: 20px;
	margin-bottom:120px;
	font-size: 17px;
	color:#333333;
	line-height: 25px;
}

#titulo {
	width: 970px;
	z-index: 100;
	position: absolute;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
	
}
#titulo_logo {
	background: url(images/logo.png) no-repeat;
	width: 258px;
	height: 337px;
	text-indent: -99999px;
	float: left;
	
}
#titulo_pequeno {
	background: url(images/logo_pequeno.png) no-repeat;
	width: 180px;
	height: 202px;
	text-indent: -99999px;
	float: left;
	display: none;
}
.header-unit {
	height: 800px;
	position: relative;
	overflow: hidden;
}
#video-container {
	position: absolute;
}
#video-container {
	height: 100%;
	width: 100%;
	overflow: hidden;
}
video {
	position: absolute;
	z-index: 0;
}
video.fillWidth {
	width: 100%;
}
#centralizar {
	background: url(images/background.png);
	width: 960px;
		height:54px;
	margin:auto;
	position:relative;
}

#subir a:link {
	float:left;
	background: url(images/subir.png) no-repeat;
	width: 294px;
	height: 26px;
	display: block;
	margin-top: 14px;
	text-indent: -9999px;
		 -webkit-transition:0.3s ease-out; /* Saf3.2+, Chrome */
  	-moz-transition: 0.3s ease-out; /* Firefox 4+ */
  	-ms-transition:0.3s ease-out; /* IE10+ */
  	-o-transition:0.3s ease-out; /* Opera 10.5+ */
  	transition: 0.3s ease-out;
}
#subir a:hover {
	background: url(images/subir_hover.png) no-repeat;
}


.tarja{
	background: url(images/tarja.png);
	height:150px;
	margin-top:360px;

}


.titulo_box {
	font-size: 18px;
	font-family: Lucida Fax;
	margin-bottom:10px;
}
.subtitulos, .subtitulos_capitulo{
	font-family: "FlamaSemicondensedExtrabold";
	font-size: 50px;
	color: #333;
	line-height:52px;
	margin-top: 50px;
	margin-bottom: 10px;
	text-transform:uppercase;
}
.subtitulos_capitulo{
	margin-top:120px;
	
}
.titulo_mapa{
	color:#7d894b;
	font-size:22px;
	font-family: Lucida Fax;	
}
.titulo_mapa_sub{
	color:#333;
	font-size:16px;
	font-family: Lucida Fax;
	margin-bottom:10px;
}
.anos {
	font-size: 140px;
	color: #FFF;
	float: right;
	margin-bottom: 0;
	font-family: "FlamaSemicondensedExtrabold";
}
.box_direita {
	float: right;
	width: 40%;
	padding: 2%;
	background: #E9E9E9;
	font-size: 15px;
	margin-left: 20px;
	margin-bottom: 20px;
}
.box_esquerda {
	float: left;
	width: 40%;
	padding: 2%;
	background: #E9E9E9;
	font-size: 15px;
	margin-right:20px;
	margin-bottom: 15px;
}
.box {

	width: 96%;
	padding: 2%;
	background: #E9E9E9;
	font-size: 15px;
	float:left;
	margin-bottom: 10px;
}
.box_foto {
	float: left;
	margin-right: 20px;
}



#facebook_rodape{
	background: url(images/facebook_rodape.png) no-repeat center;
	width:42px;
	height:57px;
	display:block;
	position:absolute;
	right:85px;
	top:0px;
	text-indent:-999999px;
	-webkit-transition:0.3s ease-out; 
  	-moz-transition: 0.3s ease-out; 
  	-ms-transition:0.3s ease-out; 
  	-o-transition:0.3s ease-out; 
  	transition: 0.3s ease-out;
	
	}

#facebook_rodape:hover{
	background: url(images/facebook_rodape.png) #3B579D no-repeat center;

}
#twitter_rodape{
	background: url(images/twitter_rodape.png) no-repeat center;
	width:42px;
	height:57px;
	display:block;
	position:absolute;
	right:43px;
	top:0px;
	text-indent:-999999px;
	-webkit-transition:0.3s ease-out; 
  	-moz-transition: 0.3s ease-out; 
  	-ms-transition:0.3s ease-out; 
  	-o-transition:0.3s ease-out; 
  	transition: 0.3s ease-out;
	
	}

#twitter_rodape:hover{
	background: url(images/twitter_rodape.png) #1AB2E8 no-repeat center;		
}
#google_rodape{
	background: url(images/google_rodape.png) no-repeat center;
	width:42px;
	height:57px;
	display:block;
	position:absolute;
	right:0;
	text-indent:-999999px;
	-webkit-transition:0.3s ease-out; 
  	-moz-transition: 0.3s ease-out; 
  	-ms-transition:0.3s ease-out; 
  	-o-transition:0.3s ease-out; 
  	transition: 0.3s ease-out;
	
	}

#google_rodape:hover{
	background: url(images/google_rodape.png) #B53021 no-repeat center;		
}


.foto_destaque{
	width:960px;
	height:363px;
	background:url(images/destaque-1914.jpg) no-repeat;
	margin-top:20px;
	margin-bottom:20px;
	border-radius: 10px;
	-webkit-box-shadow: 0px 0px 13px 0px rgba(50, 50, 50, 0.49);
-moz-box-shadow:    0px 0px 13px 0px rgba(50, 50, 50, 0.49);
box-shadow:         0px 0px 13px 0px rgba(50, 50, 50, 0.49);
	}
}


 @media screen and (max-width:960px) {
#texto {
	width: 100%;
}
#video-container {
	margin-bottom: -200px;
}
#galeria_esquerda {
	width: 100%;
}
#galeria_direita {
	width: 100%;
}
#galeria {
	width: 100%;
}
#menu {
	background: #FFFFFF;
	position: relative;
	width: 100%;

}
#nav {
	list-style: none;
	margin: auto;
	width: 100%;
	background: #FFF;
	font-family: Lucida Fax;
}
#nav li {
	display: block;
}
#nav li a {
	display: inline;
	color: #7d894b;
	font-size: 22px;
	text-decoration: none;
	border-bottom: 0px transparent;
}
#video-container {
	height: 500px;
	width: 100%;
	overflow: hidden;
}
video {
	position: relative;
	z-index: 0;
}
video.fillWidth {
	width: 100%;
}
#titulo_logo {
	display: none;
}
#titulo_pequeno {
	display: block;
}
}
