* {
    margin: 0;
    padding: 0; }
body {
    background: rgb(3, 38, 56); /*color de fondo de la web*/
    color: rgb(236, 190, 65); 
font-family: 'Montserrat', sans-serif;
}
 

hr {
    /*Color de la barra separadora*/
    width: 95%;
    height: 4px;
    background: orange;
    margin-left: 10px;
    margin-top: 40px;
    /* margin: 30px 30px 0px 20px;
   espacio a los lados de la barra separadora*/
}
/*barra de scroll para firefox para html-->*/

html {
     overflow-y: scroll;
     scrollbar-color: #dfc567 #324582;
    scrollbar-width: auto;
 }

 /*fin de barra de scroll para firefox*/
a {
    color: rgb(125, 180, 88);
}

a:visited {
    color: rgb(246, 239, 51);
}
 
.titulo img {
        width: 60%;
    }
    
    .card {
    width: 200px;
    height: 300px; 
    margin: 20px; 
} 

.derec1{
    text-align: right;
    margin-right: 22px;
    line-height: 25px;
    font-size: 14px;
}
.posicion3 img{
width: 80%;

}
.marg{
    margin-left: 55px;
}

.piedra img{
    width: 80%;
}
 
.prespace{
    white-space: pre-wrap;
}
.preresp {
    white-space: pre-wrap;
    word-wrap: break-word; 
    text-align: justify;
}
.text-tit {
    font-size: 24px;
    text-align: center;
    color: rgb(142, 231, 98);
    line-height: 30px;
}
.text6 {
    margin-top: 63px; /*espacio arriba del texto*/
    text-align: justify;
    font-size: 18px;
    line-height: 30px;
    padding: 10px 10px 10px 10px;

}
.text7{
    text-align: center;
}
 .text8 {
     text-align: center;
 }
.text9{
   
    text-align: justify;

 } 
 

.titu1 {
    text-align: center;
    font-size: 21px;

} 

/*
.ceremo2 img{
max-width: 10%;
min-width: 10%;
}  

  .card {
      width: 200px;
      height: 300px;
      margin: 20px;
  }
 
 /*INICIO DE LA GRID*/
 .contenedor {
     width: 100%;
     /* el ancho del contenedor*/
     max-width: 1080px;
     /* y este es el ancho máximo puede variar*/
     margin: 0px auto;
     /* margen arriba y abajo y "auto" para centrar la web*/
     display: grid;
     /* esto formatea el gri*/
     grid-gap: 0px 0px;
     /* margen entre las columnas y filas*/
     grid-template-columns: repeat(4, 1fr);
     /* 3 columnas de un mismo tamaño*/
     grid-template-rows: repeat(5, auto);
    grid-template-columns: repeat(4, 1fr);
        /* 3 columnas de un mismo tamaño*/
    grid-template-rows: repeat(12, auto);
        grid-template-areas:
            "header header header header"
            "titulo titulo1 titulo1 titulo1"
            "posicion1 posicion1 posicion1 posicion1"
            "posicion2 posicion2 posicion2 posicion2"
            "posicion3 posicion3 posicion4 posicion4" 
            "posicion5 posicion5 posicion6 posicion6"
            "posicion7 posicion7 posicion8 posicion8"
            "posicion9 posicion9 posicio10 posicio10"
            "posicio11 posicio11 posicio12 posicio12"
            "posicio13 posicio13 posicio14 posicio14"
            "footer footer footer footer";
        
    }
    
    .contenedor>div,
    .contenedor .header,
    .contenedor .titulo,
    .contenedor .titulo1,
    .contenedor .posicion1,
    .contenedor .posicion2,
    .contenedor .posicion3,
    .contenedor .posicion4, 
    .contenedor .posicion5,
    .contenedor .posicion6,
    .contenedor .posicion7,
    .contenedor .posicion8,
    .contenedor .posicion9,
    .contenedor .posicio10,
    .contenedor .posicio11,
    .contenedor .posicio12,
    .contenedor .posicio13,
    .contenedor .posicio14,
    .contenedor .footer {
   margin: 0; 
   margin-top: 10px;
   
    
 }

 .contenedor .header {
     background: #2d1e05;
     grid-area: header;
     padding: 45px; /*altura del menu*/
 }
.contenedor .titulo {
    grid-area: titulo;
    text-align: center;
    color: coral; }
    
.contenedor .titulo1 {
        grid-area: titulo1;
        text-align: center;
        color: coral;
}

 .contenedor .posicion1 {
     grid-area: posicion1;  
    display: flex;  /* centrar imagen*/
    justify-content: center; /* centrar imagen*/
      
 }

 
 .contenedor .posicion2 {
     grid-area: posicion2; 
     }
 
 .contenedor .posicion3 {
     grid-area: posicion3; 
 }

 .contenedor .posicion4 {
     grid-area: posicion4;  
     
      }
 
 
 .contenedor .posicion5 {
     grid-area: posicion5;
 }

 .contenedor .posicion6 {
    grid-area: posicion6;  

 }

 .contenedor .posicion7 {
     grid-area: posicion7;
 }

 .contenedor .posicion8 {
     grid-area: posicion8; 

 }  

.contenedor .posicion9 {
    grid-area: posicion9;
}


.contenedor .posicio10 {
    grid-area: posicio10;
}

.contenedor .posicio11 {
    grid-area: posicio11;
}

.contenedor .posicio12 {
    grid-area: posicio12;
}


.contenedor .posicio13 {
    grid-area: posicio13;
}

.contenedor .posicio14 {
    grid-area: posicio14; 
}
 
 .contenedor .footer {
     background: #040d1f;
     grid-area: footer;
     text-align: center;
     font-size: 13px;
     display: inline-block;
 }

 /*FIN DE LA GRID*/

@media screen and (max-width: 1000px) {
  
      .univ1, .odo1 img {
          display: none;
      } 
    
        .text1 {
            text-align: justify;
            color: rgb(193, 170, 78);
            font-size: 15px;
        }
    
    }
         
 @media screen and (max-width: 920px) {
 .contenedor {
         grid-template-areas:
        "header header header header"
            "titulo titulo1 titulo1 titulo1"
            "posicion1 posicion1 posicion1 posicion1"
            "posicion2 posicion2 posicion2 posicion2"
            "posicion3 posicion3 posicion4 posicion4"
            "posicion5 posicion5 posicion6 posicion6"
            "posicion7 posicion7 posicion8 posicion8"
            "posicion9 posicion9 posicio10 posicio10"
            "posicio11 posicio11 posicio12 posicio12"
            "posicio13 posicio13 posicio14 posicio14"
            "posicio15 posicio15 posicio16 posicio16"
            "posicio17 posicio17 posicio18 posicio18"
            "posicio19 posicio19 posicio20 posicio20"
            "posicio21 posicio21 posicio22 posicio22" 
            "posicio23 posicio23 posicio24 posicio24"
            "footer footer footer footer";
     }

     .navbar .logo a {
         color: rgb(210, 210, 35);
         margin-left: -270px;
         /*espacio del logo a la izquierda*/
     }

     .univ1, .odo1 img {
         display: none;
     } 
    .contenedor .header {
             padding: 35px;
             /*altura del menu*/
         }
 }    

 @media screen and (max-width: 760px) {

     

         .text1 {
             text-align: justify;
             color: rgb(235, 160, 99);
             font-size: 13px;
         }

.contenedor .header {
    padding: 35px;
    /*altura del menu*/
}

 }

 @media screen and (max-width: 620px) {

    .contenedor {
            grid-template-areas:
                "header header header header"
                    "titulo titulo titulo titulo"
                    "titulo1 titulo1 titulo1 titulo1"
                    "posicion1 posicion1 posicion1 posicion1"
                    "posicion2 posicion2 posicion2 posicion2"
                    "posicion3 posicion3 posicion3 posicion3"
                    "posicion4 posicion4 posicion4 posicion4"
                    "posicion5 posicion5 posicion5 posicion5"
                    "posicion6 posicion6 posicion6 posicion6"
                    "posicion7 posicion7 posicion7 posicion7"
                    "posicion8 posicion8 posicion8 posicion8"
                    "posicion9 posicion9 posicion9 posicion9"
                    "posicio10 posicio10 posicio10 posicio10"
                    "posicio11 posicio11 posicio11 posicio11"
                    "posicio12 posicio12 posicio12 posicio12"
                    "posicio13 posicio13 posicio13 posicio13"
                    "posicio14 posicio14 posicio14 posicio14"
                    "posicio15 posicio15 posicio15 posicio15"
                    "posicio16 posicio16 posicio16 posicio16"
                    "posicio17 posicio17 posicio17 posicio17"
                    "posicio18 posicio18 posicio18 posicio18"
                    "posicio19 posicio19 posicio19 posicio19"
                    "posicio20 posicio20 posicio20 posicio20"
                    "posicio21 posicio21 posicio21 posicio21"
                    "posicio22 posicio22 posicio22 posicio22"
                    "posicio23 posicio23 posicio23 posicio23"
                    "posicio24 posicio24 posicio24 posicio24"
                    "footer footer footer footer";
        }
     .navbar .logo a {
         color: rgb(210, 210, 35);
         margin-left: -270px;
         /*espacio del logo a la izquierda*/
     }
 
     .univ1,  .odo1 img {
         display: none;
     }  

.text6 { 
    font-size: 16px; 

}
     .text1 {
         text-align: justify;
         color: wheat;
         font-size: 14px;
     }

.titulo img{
    width: 40%;


}
   .posicion4 img {
       width: 100%;
   }
.contenedor .header { 
    padding: 35px;
    /*altura del menu*/
}
}