/*
Responsive 996px grid system ~ Style CSS.
Copyright 2013, Josh Cope
*/

/* =============================================================================
   Site Styles
   ========================================================================== */
   
body{
	font-family: 'Open Sans', sans-serif;
	font-size:12px;
	background:
	url(../images/mv_fondo-header.png) top left repeat-x,
	url(../images/mv_fondo-footer.png) bottom left repeat-x;
	}
h1, h2, h3, nav, article b, paginacion b{
	font-family: 'Merriweather', serif;
	}
h1, h2{
	color:#007932;
	font-style:italic;
	}
h2 a{
	color:#007932;
	}
h1{
	font-size:30px;
	line-height:28px;
	}
h2{
	font-size:20px;
	line-height:22px;
	}
h3{
	font-size:14px;
	color:#007932;
	font-weight: bold;
	}
p{
	font-size:1em;
	}
.linea{
	border-bottom:#999999 dotted 1px;
	}
a{
	text-decoration:none;
	}
li{
	color:#454545;
	}

/* =============================================================================
   Page Styles
   ========================================================================== */
   
/*HEADER*/
header{
	height:125px;
	text-align:right;
	}
#social{
	height:32px;
	margin-top:25px;
	}
#social img{
	margin-left:5px;
	}
nav{
	height:auto;
	background-color:#4F9C3A;
	padding-bottom:10px;
	border-radius:3px;
	opacity:0.9;
	}
nav ul{
	list-style:none;
	}
nav li{
	float:left;
	margin-right:4px;
	}
nav li a{
	text-transform:uppercase;
	color:#fff;
	font-weight:bold;
	font-size:14px;
	}
	
/*LEFT*/
left{
	min-height:800px;
	}
#marca{
	box-shadow:2px 1px 4px #333333;
	}
#botonera{
	height:auto;
	position:relative;
	float:left;
	}
#botonera ul{
	padding:0px;
	}
#botonera li{
	list-style:none;
	height:30px;
	}
#botonera li a{
	text-decoration:none;
	color:#333333;
	font-size:14px;
	font-weight:bold;
	}
#botonera img:hover{
	opacity:0.7;
	filter:alpha(opacity=100); /* For IE8 and earlier */
	}
#botonera, .caja-bottom{
	margin-left:0px;
	}
.caja-bottom{
	background:#DDEEC5;
	margin-bottom:13px;
	}
.caja-bottom a{
	color:#000;
	font-size:12px;
	padding-left:13px;
	}
.caja-bottom a:hover{
	color:#007932;
	}
#slider{
	}
	
/*CONTENT Y RIGHT*/
section{
	}
article{
	width:33%;
	height:auto;
	position:relative;
	float:left;
	background:#DDEEC5;
	}
article img{
	margin-bottom:8px;
	}
article b{
	color:#007932;
	font-size:13px;
	padding-top:5px;
	}
article p{
	color:#454545;
	margin:0px;
	}
article a{
	color:#007932;
	text-decoration:none;
	font-style:italic;
	}
.article-texto{
	height:auto;
	position:relative;
	float:left;
	padding:0px 13px;
	font-size:11px;
	}
.banner-content{
	width:100%;
	height:auto;
	position:relative;
	float:left;
	margin:13px 0px;
	}
aside img{margin-top:5px;}

/*LINKS*/
.lugares{
	width:100%;
	height:auto;
	position:relative;
	float:left;
	border-bottom:#999999 dotted 1px;
	}
.lugares-datos{
	width:60%;
	height:auto;
	position:relative;
	float:left;
	}
.lugares-links{
	width:38%;
	height:auto;
	position:relative;
	float:right;
	margin-top:30px;
	text-align:right;
	}
.lugares-links img{
	margin-left:3px;
	}

/*PIE*/
footer{
	height:62px;
	margin-top:8px;
	}
#pie{
	height:22px;
	margin-top:20px;
	background-color:#8DC63F;
	padding-top:5px;
	border-radius:5px;
	font-size:10px;
	text-align:center;
	}


/* =============================================================================
   Media Queries
   ========================================================================== */

/* Tablet Portrait size to Base 996px */
@media only screen and (min-width: 768px) and (max-width: 995px) {
	#botonera li{
		height:24px;
	}
	nav{
		height:45px;
		margin-top:-8px;
	}
	article{
		width:50%;
	}
	article img{
		width:100%;
	}
	}

/* All Mobile Sizes */ 
@media only screen and (max-width: 767px) {
	#slider, .banner-content{
		visibility:hidden;
		display:none;
	}
	article{
		width:50%;
	}
	article img{
		width:100%;
	}
	#marca{
		width:223px;
	}
	#social{
		height:50px;
	}
	}

/* Mobile Landscape Size to Tablet Portrait */
@media only screen and (min-width: 480px) and (max-width: 767px) {
	#pie{
		height:30px;
		padding-top:0px;
	}
	}

/* Mobile Portrait Size to Mobile Landscape Size */
@media only screen and (max-width: 479px) {
	aside{
		visibility:hidden;
		display:none;
	}
	article{
		width:100%;
	}
	#pie{
		height:60px;
		padding-top:2px;
	}
	}


/* =============================================================================
   Font-Face
   ========================================================================== */
/* This is the proper syntax for an @font-face file

/* @font-face {
font-family: 'FontName';
src: url('../fonts/FontName.eot');
src: url('../fonts/FontName.eot?iefix') format('embedded-opentype'),
url('../fonts/FontName.woff') format('woff'),
url('../fonts/FontName.ttf') format('truetype'),
url('../fonts/FontName.svg#FontName') format('svg');
font-weight: normal;
font-style: normal; }
*/