/************************************************************************************
smaller than 980
*************************************************************************************/
@media screen and (max-width: 980px) {
	
.grid_4{
	width: 30%;
	margin-left:20px;
	margin-right:0px;
	}
.grid_7{
	width: 91%;
	margin-left:20px;
	margin-right:0px;
	}
.cuadro{
	height:auto;
	min-height:250px;}

#logo{
	margin-left:20px;
	width:20%;
	}
#universidad{
	margin-right:20px;
	width:40%;
}
	


}

/************************************************************************************
smaller than 650
*************************************************************************************/
@media screen and (max-width: 650px) {
	
header{
	margin-bottom:20px;
	background-color:none;
	height:auto;}
#logo{
	margin-top:20px;
	float:none;
	width:100%;
	text-align:center;
	margin-bottom:0px;
	}
#universidad{
	float:none;
	text-align:center;
	width:100%;
}

nav ul{
	height:auto;
	
	}
nav li{
	margin-left:0px;
	float:none;
	display:block;
	width:100%;
	line-height:20px;
	}
.wrap{
	width:100%;
	float:left;
}

.sp-slideshow{
	display:none;}

.cuadro{
	height:auto;
	}

footer{
	height:auto;
	}

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
	margin: 20px 20px 20px 20px;
	float:none;
	display: block;
	width:90%;
}

.contact_form input[type="text"],
.contact_form textarea {
	width:100%;}
	
.ui-tabs .ui-tabs-nav{
	width:95%;
	height:200px;
}

.ui-tabs .ui-tabs-nav li{
	float: left;
	width:100%;
}

.ui-tabs .ui-tabs-nav li a {
	width:94%;
}
    
.bloqueind {
  width: 80% !important;
}

.bloquevideo{
	width: 100% ;
}

.bloque{
	padding: 20px;
}

 .fold{
    height: 1200px;
     background-size: cover; 
    }
    
.bloquevideo {
  padding: 5%;
  width: 100%;
  border-radius: 10px;
  height: 430px;
}  

.bloque1 {
	padding: 6%;
	border-radius: 3px;
	height: auto;
  }
  .bloqueinfo2 {
	border-radius: 10px;
	width: 90% !important;
	background-color: #fff;
  }
    
    .map{
    margin: 20px!important;
}

/* Ejemplo de configuración de ancho de columna */
.col-3 { flex: 0 0 100%; max-width: 100%; }
.col-4 { flex: 0 0 100%; max-width: 100%; margin-bottom: 40px; }
.col-5 { flex: 0 0 100%; max-width: 100%; }
.col-6 { flex: 0 0 100%; max-width: 100%; }
.col-7 { flex: 0 0 58.3333%; max-width: 58.3333%; }
.col-8 { flex: 0 0 66.6667%; max-width: 66.6667%; }
.col-9 { flex: 0 0 75%; max-width: 75%; }
.col-10 { flex: 0 0 83.3333%; max-width: 83.3333%; }
.col-11 { flex: 0 0 91.6667%; max-width: 91.6667%; }
.col-12 { flex: 0 0 100%; max-width: 100%; }

.banner{
	display: none;
}

.bloquevideo{
	width: 90%!important;
}

.hero
{height: auto;}
    
/************************************************************************************
smaller than 560
*************************************************************************************/
@media screen and (max-width: 320px) {
	
	#logo{
	margin-top:20px;
	float:none;
	width:85%;
	text-align:center;
	margin-bottom:0px;
	}
	
	#logo img{
		width:100%;}

	


}