/* CSS Document */

body {
    display: flex;
    margin: 8px;
	background:#F36523;
}

 
  
h1 {
 	color:#FFFFFF;
	text-align:center;
	font-family:Arial Black; 
	font-size: 24px;
 }
 
h3 {
 	color:#FFFFFF;
	text-align:left;
	font-family:Arial Black; 
	font-size: 16px;
 } 
 
.Estilo1 {	font-size: 18px;	font-family: "Arial Black";	color: #0066CC;}
.Estilo2 {font-family: Arial}
.Estilo4 {font-size: 12px}
.Estilo5 {color: #0066CC}
.Estilo11 {font-family: Arial; color: #0066CC; font-weight: bold; font-size: 12px; }
.Estilo12 {	font-family: Arial;	font-size: 12px;	color: #0066CC;}
.Estilo14 {font-family: Arial; font-size: 12px; color: #FFFFFF; font-weight: bold; }
.style4 {font-size: 12px; font-style: italic; }
.style20 {font-size: 14px}
.Estilo19 {font-size: 8px; font-family: Verdana, Arial, Helvetica, sans-serif; color: #FF9933; }

body {	background-image: url(websantogrial/images/10.gif);}
 
 /*Estilos de la galeria*/
 
.galeria {
 	width:90%;
	margin:auto; 
	list-style:none;
	padding:20px;
	box-sizing: border-box;
	
	display:flex;
	flex-wrap: wrap;
	justify-content: space-around:
 }
 
 .galeria li { 
 	margin:5px;
	
	}
 
 .galeria img {
 	width:150px;
	height:100px;
 }
 
 /*Estilos del modal*/
 .modal {
 	display: none;
 }
 
 .modal:target {
 	display:block;
 	position: fixed;
	background:rgba(0,0,0,0.8);
	top:0;
	width:100%;
	height:100%;
 }
 
 
 .modal h3 {
 	color:#FFFFFF;
	font-size:30px;
	text-align:center;
	margin:15px 0;
 }
 
 .imagen {
 	width:100%;
	height:70%;
	
	display:flex;
	justify-content: center;
	align-items:center;
 }
 
 .imagen a {
 	color:#FFFFFF;
	font-siza:40px;
	text-decoration:none;
	margin:0 10px;
 }
 
 .imagen a:nth-child(2) {
 	margin:0;
	height:100%;
	flex-shrink:2;
 }
 
 .imagen img {
 	width:700px;
	height:100%; 
	max-width: 100%;
	border:7px solid #FFFFFF;
	box-sizing: border-box;	
 }