@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,500;1,100;1,500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bree+Serif&family=Roboto+Slab:wght@900&family=Roboto:ital,wght@0,100;0,500;1,100;1,500&display=swap');




	/* ________________________________ */










    /* Responsive CSS */
    @media only screen and (max-width: 600px) {
		
		

.recuadro {
    text-align: left;
	font-size: 13px;
	color: #4A4A4A;
	border-left-width: 8px;
	border-top-style: solid;
	border-top-width: 8px;
	padding-left: 10px;
	padding-top: 2px;
	border-left-color: #f78d1e;
	border-top-color: #f78d1e;
	border-left-style: solid;
    }

.menuSeccion {
    
	/* Alinea al centro vertical / align-items: center;*/      
	text-align: center;
      padding: 10px;
    }

    .menu-buttonSeccion {
      display: inline-block;
      padding: 0px 5px;
      margin: 0 5px;
    
      color: #333;
      text-decoration: none;
   
    }

.menu-buttonSeccion:hover {
  color: red;
}
	
		
		
		
		.fecha {
    overflow: hidden;
	width: 100%;
	/* position: fixed; */
	
	font-family: 'Gill Sans', 'Gill Sans MT', 'Myriad Pro', 'DejaVu Sans Condensed', Helvetica, Arial, 'sans-serif'; 
	color: #404040; 
	font-size: 16px;
	line-height: 1;
	text-align: center;
	background-color: white;
	margin-top: -10px;
	vertical-align: bottom;
    }
		
		.logotipo {
	margin-top: 10px;
	
	width: 100%;
	height: 115px;
	/* position: fixed; */

	overflow: hidden;
	text-align: center;
    }
		
      .menuSeccion {
        flex-wrap: wrap;
		  
      }

      .menu-buttonSeccion {
        margin: 5px;
        flex-basis: 45%;
		  text-decoration: none;
      }
    }


.imageTXTwrap-container {
      float: right;
      margin-left: 10px;
      margin-bottom: 10px;
    }
    
    .imageTXTwrap-container img {
      max-width: 100%;
      height: auto;
    }
    
    .text-container {
      overflow: hidden;
    }

.text-containerScroll {
      height: 400px;
	overflow-y: scroll;
	overflow-x: hidden;
	padding-right: 20px;
    }




.imageTXTwrap-delCampus {
      float: right;
      margin-left: 10px;
      margin-bottom: 10px;
    }
    
    .imageTXTwrap-delCampus img {
      max-width: 100%;
      height: auto;
    }
    
    .text-delCampus {
      overflow: hidden;
    }

.text-delCampusScroll {
     height: 400px;
	overflow-y: scroll;
	overflow-x: hidden;
	padding-right: 20px;
    }



.text-GerminalScroll {
     height: 800px;
	overflow-y: scroll;
	overflow-x: hidden;
	padding-right: 20px;
    }






@media (min-width: 600px) {
  
	

.recuadro {
    text-align: left;
	font-size: 13px;
	color: #4A4A4A;
	border-left-width: 8px;
	border-top-style: solid;
	border-top-width: 8px;
	padding-left: 10px;
	padding-top: 2px;
	border-left-color: #f78d1e;
	border-top-color: #f78d1e;
	border-left-style: solid;
    }

.menuSeccion {
    
	/* Alinea al centro vertical / align-items: center;*/      
	text-align: center;
      padding: 10px;
    }

    .menu-buttonSeccion {
      display: inline-block;
      padding: 0px 5px;
      margin: 0 5px;
    
      color: #333;
      text-decoration: none;
   
    }

.menu-buttonSeccion:hover {
  color: red;
}
	
	
	
.fecha {
    overflow: hidden;
	width: 100%;
	/* position: fixed; */
	
	font-family: 'Gill Sans', 'Gill Sans MT', 'Myriad Pro', 'DejaVu Sans Condensed', Helvetica, Arial, 'sans-serif'; 
	color: #404040; 
	font-size: 16px;
	line-height: 1;
	text-align: center;
	background-color: white;
	height: 40px;
	margin-top: -10px;
	vertical-align: bottom;
    }
	
	.logotipo {
	margin-top: 10px;
	
	width: 100%;
	height: 150px;
	/* position: fixed; */

	overflow: hidden;
	text-align: center;
    }
	
	
.menu {
	padding: 0 0 20px 0;
  list-style-type: none;
	/* position: fixed; */
  margin: 0;	
	text-align: center;
	width: 100%;
	background-color: white;
	font-size: 18px;
}



.menu li {
  display: inline-block;

}

.menu li a {
  display: block;
padding: 10px;
  text-decoration: none;
	color: white;
	width: 100px;

}

.menu li a:hover {
  background-color: gray;
}
	
	
section {
  background-color: white;
	margin: 0 auto;
	margin-left: 10%; margin-right: 10%;
	font-family: 'Roboto', sans-serif;
	font-weight: 100;
	padding-left: 20px;
	padding-right: 20px;
	line-height: 1.5;
	text-align: justify;

}
	
	
section a {
text-decoration: none;
}
	
	
	section .titulo {
 font-family: 'Bree Serif', serif;
		font-size: 46px;
		line-height: 1;
		text-align: center;

}
	

.double-column {
      column-count: 2;
      column-gap: 30px;
    }

	
.triple-column {
      column-count: 3;
      column-gap: 20px;
    }
	
	

		
	
	
/* Used in this example to enable scrolling */
}


@media (max-width: 600px) {
  

h2{
	font-size: 20px;
}

	
.menu {
	padding: 0px 0px 20px 0px;
  list-style-type: none;
	
  margin: 0;	
	text-align: center;
	width: 100%;
	background-color: #FFFFFF;
	font-size: 12px;
}



.menu li {
  display: inline-block;

}

.menu li a {
  display: block;
  text-decoration: none;
	color: white;
	width: 70px;
	padding-top: 10px;
	padding-bottom: 10px;
	


}

.menu li a:hover {
  background-color: gray;
}

	
	section {
  background-color: white;
	margin: 0 auto;
	font-family: 'Roboto', sans-serif;
		font-weight: 100;
		line-height: 1.5;

}

	section .titulo {
 font-family: 'Bree Serif', serif;
		font-size: 28px;
		line-height: 1;
	

		
}
	
	
	
	 .imageTXTwrap-container {
        float: none;
        margin: 0;
        text-align: center;
      }
	
	 .imageTXTwrap-delCampus {
        float: none;
        margin: 0;
        text-align: center;
      }
	



	
/* Used in this example to enable scrolling */
}



.pie-foto  {
        font-size: 12px;
	margin-top: -5px;
	margin-right: 10px;
      }
	


section .periodista {
	
	border: 1px solid black;
	width: 210px;
	font-size: 12px;
	padding: 2px 10px;
	margin-top: 10px;
	margin-bottom: 10px;


}

section .fuente-foto {
	
	font-size: 14px; 
	font-style: italic;


}






#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 12px;
  border: none;
  outline: none;
  background-color: #3078b6;
	opacity: 0.8;
  color: black;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}
#myBtn:hover {
  background-color: #555;
}



.fixed-icons {
      position: fixed;
      top: 80%;
      left: 0;
      transform: translateY(-50%);
      z-index: 999;
    
      padding: 10px;
    }
    
    .fixed-icons a {
      display: block;
      margin-bottom: 10px;
    }
    
    .fixed-icons img {
      width: 40px;
      height: 40px;
    }



.containerDelCampus {
	display: flex;
	height: 100%;
	 
        }



.containerExplanada {
	display: flex;
	height: 100%;
	 
        }






 .containerCriterios {
	display: flex;
	height: 650px;
	 
        }

.columnCriteriosZ {
	flex-basis: 50%;
    overflow-y: scroll;
	overflow-x: hidden;
	
	padding-right: 10px;
	padding-left: 20px;
			
        }

.columnCriteriosD {
	flex-basis: 50%;
    overflow-y: scroll;

	overflow-x: hidden;
	padding-left: 20px;
	padding-right: 10px;
	
        }


  @media (max-width: 800px) {
    .containerDelCampus {
    flex-direction: column;
	height: 100%;
		 }

	  .columnDelCampus   {
    flex-basis: 100%;
	overflow-y: hidden;
		overflow-x: hidden;
    padding-left: 10px;
	padding-right: 10px;
		
            }
	  
	  .containerExplanada {
    flex-direction: column;
	height: 100%;
		 }
	  
	  .columnExplanada   {
    flex-basis: 100%;
	overflow-y: hidden;
		overflow-x: hidden;
    padding-left: 10px;
	padding-right: 10px;
		
            }
	  
	  
	  .containerCriterios {
    flex-direction: column;
	height: 100%;
		 }

	.columnCriteriosZ   {
    flex-basis: 100%;
	overflow-y: hidden;
		overflow-x: hidden;
    padding-left: 10px;
	padding-right: 10px;
		margin-bottom: 15px;
			
            }
	  
	.columnCriteriosD {
    flex-basis: 100%;
	overflow-y: hidden;
		overflow-x: hidden;
    padding-left: 10px;
	padding-right: 10px;
			
            }
	  
        }



/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: auto; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #888; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555; 
}