
/**********************

************************************************************************/ 
/********* responsive styles *******************************************/ 
/**********************************************************************************************/ 


@media ( max-width: 1200px){  



#header a.logo{ float:left; width:22%; margin:0; padding:0; margin-top:10px;  }

 #menu { float:right; width:70%; margin:0; padding:0; 
}
  
#menu ul li a {  line-height:1em;  
	padding: 10px 13px  10px 14px  ; 
 
}


 
.wrapper{ width:98%; margin-left:10px;}

#slider {
	clear : both; width:100%;min-height:430px;
}
#slider img { 
	margin : 0;width:100%; min-height:420px;
	background-color:transparent;
}

#sidebar form { margin-top:5px; margin-left : 5px; margin-bottom:40px;
}
 

 
#list ul li { 
	/*background : #fbfdf4;*/ width:43%; 
}
#content div#galerias ul li {
	float : left; width:42%; margin:10px; padding:10px;
}


}


@media ( max-width: 967px){    

#header { margin:5px auto;
	width : 100%; position:relative;
	height : 150px;
}

#header .logo{ width:100%; clear:both; text-align:center; top:0; left:35%;position:relative;}
#header .logo a{   width:35%; margin:0; padding:0; margin:10px auto; display:block;;
 
}
#header .logo a img{ width:100%; max-width:330px; 

}

 #menu {top:0px; left:0;position:relative;  float:none; width:100%; margin:0; padding:0;  display:block; clear:both;
}
   #menu ul{ padding:0;  
	  margin: 0px auto;   
}
#menu ul  li { float:left; 
	line-height : 0; text-align:center; 
	margin : 0; padding:0;

}
#menu ul li a {  line-height:1em;  
	padding: 10px 19px  10px 19px  ; 
 
}



#slider {
	clear : both; width:100%; min-height:auto;
}
#slider img { 
	margin : 0;width:100%; min-height:auto;
	background-color:transparent;
}





#noticias ul li { 
	border : 1px solid #dedede; width:95%;
	padding : 10px; clear:both; display:block;
	margin-top : 10px;
}

#noticias ul li  img{ float:left; width:30%; background:#dedede;
	padding : 10px;
	margin : 10px;
}
#noticias ul li  h3,#noticias ul li  p{ float:left; width:50%; margin-left:25px; margin-top:35px; 
}


#footer .center  p.slogan{ color:#dc7171;font-size:20px; }

}

 

@media only screen and (max-width: 768px) { /************* MENU RESPONSIVE *********************/
 

#header .logo{ width:50%; float:left;  text-align:center; top:0; left:50px;;position:absolute;}
#header .logo a{   width:100% ; clear:none;
 
}
#header .logo a img{ width:100%; max-width:330px; 

}
 
  
  
	nav ul {
		  display: none;
	}

	label#nav {
  		display: block;
  		background: none;
		  width: 110px; 
		  padding:6px;
  		height: 40px;
		margin:0; text-align:center;
		color:#fff;
  		cursor: pointer; 
		  position: absolute;
		  right: 15px;
  		top:  50px;
	} 
	label#nav span{ float:right; color:#fff; padding:8px;font-size:1.2em; line-height:1em; font-weight:300}
	
label#nav:after{
  content:'';
  display: block;
  width: 35px;
  height: 3px; 
  background: #fff;
  margin: 7px 5px;
  box-shadow: 0px 10px 0px #fff, 0px 20px 0px #fff
}

	[type="checkbox"]:checked ~ ul { width:100;
  		display: block;
  		z-index: 999999999;
  		position: absolute;
  		background: #D60000;
	}

 #menu ul { border-radius:0; 
  		z-index: 999999999; right:0; width:100%; top:108px; 
  		position: absolute;}
#menu ul  li a { text-indent:20px; text-align:center;
	padding:  19px  ; border-top:1px solid #EB4141; color:#fff;  
}
	 
 #menu ul  a.active { color:#000; 
}


	nav ul li {
		  display: block;
  		float: none;
  		width: 100%;
  		text-align: left;
		  text-indent:  0px;
	} 
 
 

#noticias,
#list,
#content {
	float : left; 
	width : 100%;  height:auto; padding-bottom:40px; margin-top:40px;
	overflow : hidden;
}

 #sidebar {
	float : none; clear:both; width :95%; margin:0; padding-right:15px; padding-left:15px; padding-bottom:40px;text-align:center
}


 #sidebar a  img{ width:95%; max-width:350px; margin:0 auto; text-align:center}


/**REDES SOCIALES*****************************/
.redes{ margin-top:20px;  border-radius:10px;  text-align:center; width:95%; max-width:350px; margin:0 auto;   height:auto; border-radius:4px; display:block; clear:both; background : #fff url('images/siguenos.png')  top center no-repeat; background-size:100%; padding-top:95px; }
 
  #footer .center  { font-size:0.9em; line-height:1em;}
 
 #footer .center  p.slogan{ color:#dc7171;font-size:1.2em; font-weight:bold;; }

 
 
 
 
 
 
 

.contact{
	width:99%; margin-top:20px; float:none; background:none}


fieldset { 
	width:95%;
	display: block; 
	padding: 5px;
	margin-left: 5px;  
}

 

}
 	
	
 
@media (max-width: 420px) {   
 
#header .logo{ width:90%; float:left;  text-align:center; top:-10px; left: 13px;;position:absolute;}
#header .logo a{   width:100% ; clear:none;
 
}
#header .logo a img{ width:100%; max-width:230px; 

}
 
  
  
	nav ul {
		  display: none;
	}

	label#nav {
  		display: block;
  		background: none;
		  width: 110px; 
		  padding:6px;
  		height: 40px;
		margin:0; text-align:center;
		color:#fff;
  		cursor: pointer; 
		  position: absolute;
		  right: 30%;
  		top:  100px;
	} 
	label#nav span{ float:right; color:#fff; padding:8px;font-size:1.2em; line-height:1em; font-weight:300}
	
label#nav:after{
  content:'';
  display: block;
  width: 35px;
  height: 3px; 
  background: #fff;
  margin: 7px 5px;
  box-shadow: 0px 10px 0px #fff, 0px 20px 0px #fff
}

	[type="checkbox"]:checked ~ ul { width:100;
  		display: block;
  		z-index: 999999999;
  		position: absolute;
  		background: #D60000;
	}

 #menu ul { border-radius:0; 
  		z-index: 999999999; right:0; width:100%; top:138px; 
  		position: absolute;}
#menu ul  li a { text-indent:20px; text-align:center;
	padding:  19px  ; border-top:1px solid #EB4141; color:#fff;  
}
	 
 #menu ul  a.active { color:#000; 
}


	nav ul li {
		  display: block;
  		float: none;
  		width: 100%;
  		text-align: left;
		  text-indent:  0px;
	} 
	
	
 #slider {padding:10px 0 10px 0; 
}

  #content h2 {
	font-size : 1.8em; 
}

 
 
#list ul li { 
	/*background : #fbfdf4;*/ width:87%; 
}
#content div#galerias ul li {
	float : left; width:87%; margin:10px; padding:10px;
}
 
 
 
 
 #footer .center p{  text-align:center;color:#fff; line-height:16px;
	top : 0px; margin:0; padding:0;font-size:0.8em;  
}

 
 
 
 
 
.contact{ width:90%; padding-left:10px; margin-top:30px;}
.contact h3{ ; margin-left:20px;; padding-top:10px; padding-bottom:5px;}
 
.contact input{ border:1px solid #ccc; width:90%; padding:3px;background:#eee; color:#333;}
.contact textarea{ border:1px solid #ccc; width:90%;; padding:3px; background:#eee;color:#333;}
#submit{ border:1px solid #b64646; background:#dd4242; width:100px; height:40px; margin-left:140px; padding:3px;}
#captcha{ padding-top:3px;width:66px;}
.contact textarea{ border:1px solid #ccc; width:90%;; padding:3px; background:#eee;color:#333;}
#captcha{ padding-top:3px;width:90px;}

 }
 
 