header {
    width: 100%;
    height: 110px;
    margin-left: auto;
    margin-right: auto;
    }

section {
    background-color: #CDDADC;
    width: 100%;
}

#MQR1 {
width: 100%;
height: 14840px;
background-color: #CDDADC;
}

#MQR2 {
width: 100%;
height: 7280px;
background-color: #CDDADC;
}

#MQR3 {
width: 100%;
height: 1340px;
background-color: #CDDADC;
}

#MQR4 {
width: 100%;
height: 12000px;
background-color: #CDDADC;
}

#MQR5 {
width: 100%;
height: 1340px;
background-color: #CDDADC;
}

#MQR6 {
width: 100%;
height: 12000px;
background-color: #CDDADC;
}

#MQR7 {
width: 100%;
height: 10620px;
background-color: #CDDADC;
}

#MQR8 {
width: 100%;
height: 3290px;
background-color: #CDDADC;
}

#MQR9 {
width: 100%;
height: 2620px;
background-color: #CDDADC;
}
        
/* .......... Flecha, para subir .......... */

#subir {
    width: 90px;
    height: 60px;
    background-color: white;
    position: fixed;
    left: 10px;
    bottom: 10px;
    color:2B06;
    padding: 20px;
    box-sizing: border-box;
}

/* .......... Flecha, para subir .......... */

#caja1 {
    display: flex;
    width: 350px;
    margin: 2em;
    background-color: #CDDADC;
    color: black;
    box-shadow: 6px 6px 10px black;
    border-radius: 10px;
    height: 420px;
    flex-direction:row;
    flex-wrap: wrap;
    justify-content: space-around;
    margin-left: auto;
    margin-right: auto;
}

#caja1:hover {
    box-shadow: 6px 6px 10px orange;
}

#CajaAux1 {
    width: 360px;
    height: 200px;
    margin-left: auto;
    margin-right: auto;
}

#caja2 {
    display: flex;
    width: 350px;
    margin: 2em;
    background-color: #CDDADC;
    color: black;
    box-shadow: 6px 6px 10px black;
    border-radius: 10px;
    height: 400px;
    flex-direction:row;
    flex-wrap: wrap;
    justify-content: space-around;
    float: center;
    margin-left: auto;
    margin-right: auto;
}

#caja2:hover {
    box-shadow: 6px 6px 10px orange;
}

#CajaAux2 {
    width: 360px;
    height: 200px;
    margin-left: auto;
    margin-right: auto;
}

img{
    width: 0px;
    flex-grow:1;
    object-fit: cover;
    opacity: .8;
    transition: .5s ease;
}

img:hover {
    cursor: crosshair;
    width: 300px;
    opacity: 1;
    filter: contrast(120%);
}

h1 {
    margin: 0;
    text-align: center;
    color: white;
    font-family: 'Anton', sans-serif;
    font-family: 'Bebas Neue', sans-serif;
    font-family: 'Dancing Script', cursive;
    font-family: 'Playfair Display', serif;
    background-color: #727272d1;
}

h2 {
    margin: 0;
    text-align: center;
    color: white;
    font-family: 'Anton', sans-serif;
    font-family: 'Bebas Neue', sans-serif;
    font-family: 'Dancing Script', cursive;
    font-family: 'Playfair Display', serif;
    background-color: #727272d1;
}

#botoneraprincipal {
    width: 97%;
    height: 90px;
    float: right;
    background-color: #727272d1;
    margin: 20px;
    border-radius: 20px 20px 20px 20px;
    font-family: Verdana;
}

#botoneraprincipal ul {
    margin:0;
    padding: 0;
    list-style-type: none;
    display: flex;
    justify-content: space-around;
}

#botoneraprincipal ul li {
    flex-grow: 1;
    text-align: center;
}

#botoneraprincipal ul li a {
    display: block;
    color: white;
    text-decoration: none;
    font-weight: bold;
    padding: 15px;
}

/*RESPONSIVE*/

/* Adaptación a dispositivos de  de 600px a 1023px */
    
@media all and (min-width: 600px) and (max-width: 1023px) {
        
header {
width: 580px;
height: 300px;
background-image: url(image/logo/LOGO\ DE\ DIVERSO\ -580\ X\ 300.png);
}
        
section {
width: 580px;
height: 1350px;
}

h1 {
margin: 0;
text-align: center;
color: white;
background-color: #727272d1;
font-family: 'Anton', sans-serif;
font-family: 'Bebas Neue', sans-serif;
font-family: 'Dancing Script', cursive;
font-family: 'Playfair Display', serif;
}
        
h2 {
margin: 0;
text-align: center;
color: white;
background-color: #727272d1;
font-family: 'Alkatra', cursive;
}
        
        
      
#caja1 {
display: flex;
width: 350px;
margin: 2em;
background-color: #CDDADC;
color: black;
box-shadow: 6px 6px 10px black;
border-radius: 10px;
height: 420px;
flex-direction:row;
flex-wrap: wrap;
justify-content: space-around;
margin-left: auto;
margin-right: auto;
}
        
#caja1:hover {
box-shadow: 6px 6px 10px orange;
}

#CajaAux1 {
width: 360px;
height: 200px;
margin-left: auto;
margin-right: auto;
}
        
#caja2 {
display: flex;
width: 350px;
margin: 2em;
background-color: #CDDADC;
color: black;
box-shadow: 6px 6px 10px black;
border-radius: 10px;
height: 400px;
flex-direction:row;
flex-wrap: wrap;
justify-content: space-around;
float: center;
margin-left: auto;
margin-right: auto;
}
        
#caja2:hover {
box-shadow: 6px 6px 10px orange;
}
        
#CajaAux2 {
width: 360px;
height: 200px;
margin-left: auto;
margin-right: auto;
}

img{
width: 0px;
flex-grow:1;
object-fit: cover;
opacity: .8;
transition: .5s ease;
}
        
img:hover {
cursor: crosshair;
width: 300px;
opacity: 1;
filter: contrast(120%);
}
        
h1 {
margin: 0;
text-align: center;
color: white;
font-family: 'Anton', sans-serif;
font-family: 'Bebas Neue', sans-serif;
font-family: 'Dancing Script', cursive;
font-family: 'Playfair Display', serif;
background-color: #727272d1;
}
        
h2 {
margin: 0;
text-align: center;
color: white;
font-family: 'Anton', sans-serif;
font-family: 'Bebas Neue', sans-serif;
font-family: 'Dancing Script', cursive;
font-family: 'Playfair Display', serif;
background-color: #727272d1;
}
        
#botoneraprincipal {
width: 93%;
height: auto;
float: center;
background-color: #727272d1;
margin: center;
border-radius: 20px 20px 20px 20px;
font-family: Verdana;
}
        
#botoneraprincipal ul {
margin-left: 0;
margin-right: 0;
padding: 0;
list-style-type: none;
display: block;
}
        
#botoneraprincipal ul li {
flex-grow: 1;
text-align: center;
}
        
#botoneraprincipal ul li a {
display: block;
color: white;
text-decoration: none;
font-weight: bold;
padding: 6px;
}
}

/* Adaptación a dispositivos de  de 599px*/

@media all and (max-width: 599px) {

header {
width: 96%;
height: 525px;
background-image: url(image/logo/LOGO\ DE\ DIVERSO\ -\ 382\ x\ 525.png);
position: relative;
}
        
section {
width: 96%;
height: 1350px;
padding: 10px;
box-sizing: border-box;
}
    
#MQR1 {
width: 100%;
height: 14900px;
background-color: #CDDADC;
}
                
#MQR2 {
width: 100%;
height: 7350px;
background-color: #CDDADC;
}
                
#MQR3 {
width: 100%;
height: 1460px;
background-color: #CDDADC;
}
                
#MQR4 {
width: 100%;
height: 12050px;
background-color: #CDDADC;
}
                
#MQR5 {
width: 100%;
height: 1350px;
background-color: #CDDADC;
}
                
#MQR6 {
width: 100%;
height: 11950px;
background-color: #CDDADC;
}
                
#MQR7 {
width: 100%;
height: 10650px;
background-color: #CDDADC;
}
                
#MQR8 {
width: 100%;
height: 3340px;
background-color: #CDDADC;
}
                
#MQR9 {
width: 100%;
height: 2680px;
background-color: #CDDADC;
}
                        
#caja1 {
display: flex;
width: 300px;
margin: 2em;
background-color: #CDDADC;
color: black;
box-shadow: 6px 6px 10px black;
border-radius: 10px;
height: 420px;
flex-direction:row;
flex-wrap: wrap;
justify-content: space-around;
margin-left: auto;
margin-right: auto;
}
                
#caja1:hover {
box-shadow: 6px 6px 10px orange;
}
        
#CajaAux1 {
width: 300px;
height: 200px;
margin-left: auto;
margin-right: auto;
}
                
#caja2 {
display: flex;
width: 300px;
margin: 2em;
background-color: #CDDADC;
color: black;
box-shadow: 6px 6px 10px black;
border-radius: 10px;
height: 400px;
flex-direction:row;
flex-wrap: wrap;
justify-content: space-around;
float: center;
margin-left: auto;
margin-right: auto;
}
                
#caja2:hover {
box-shadow: 6px 6px 10px orange;
}
                
#CajaAux2 {
width: 300px;
height: 200px;
margin-left: auto;
margin-right: auto;
}

        
h1 {
text-align: center;
color: white;
background-color: #727272d1;
font-family: 'Anton', sans-serif;
font-family: 'Bebas Neue', sans-serif;
font-family: 'Dancing Script', cursive;
font-family: 'Playfair Display', serif;
}
        
h2 {
margin: 0;
text-align: center;
color: white;
background-color: #727272d1;
font-family: 'Anton', sans-serif;
font-family: 'Bebas Neue', sans-serif;
font-family: 'Dancing Script', cursive;
font-family: 'Playfair Display', serif;
}
        
#botoneraprincipal {
width: 92%;
height: auto;
float: center;
background-color: #727272d1;
margin: center;
border-radius: 20px 20px 20px 20px;
font-family: Verdana;
}
        
#botoneraprincipal ul {
margin-left: 0;
margin-right: 0;
padding: 0;
list-style-type: none;
display: block;
}
        
#botoneraprincipal ul li {
flex-grow: 1;
text-align: center;
}
        
#botoneraprincipal ul li a {
display: block;
color: white;
text-decoration: none;
font-weight: bold;
padding: 15px;
}
          
         
footer {
width: 100%;
height: 640px;
padding: 10px;
box-sizing: border-box;
}
        
}