body {background-color: #FFCE88;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin-left: 10px;
            transition: background-color 0.5s ease; /* Para que el cambio no sea brusco */
            font-family: sans-serif;
            }
.multimedia {display: inline-block; max-width: 400px;}
#colorPicker {height: 10px;}
#btnCambiar {margin: 10px;
            height: 40px;
            padding: 10px;
            font-size: 1.2rem;
            cursor: pointer;
            border: none;
            border-radius: 8px;
            background-color: #333;
            color: white;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1); width: 100%;
        }

 #btnCambiar:hover {
            background-color: #5a6;
        }

#linea {background-color: whitesmoke; /* Color de fondo */
  		background-image: radial-gradient(#000 20%, transparent 20%); /* Punto negro y transparencia */
  		background-size: 20px 20px; /* Tamaño del patrón y espaciado */
		}
#secciones {text-align: center;background-color: #c4954f;margin-left: -10px;padding: 10px;}        
.seccion-container {display: flex; flex-wrap: wrap; align-content: flex-start; justify-content: center; text-align: center; margin-top: 5px; }
.seccion {font-size: clamp(.8rem, 2vh, 5rem);background-color: rgb(39, 176, 204); margin: 5px; height: 120px; min-width: 140px;text-align: left;  
        word-break: break-word; border-radius: 16px; max-width: 160px; padding: 8px 12px;border: 2px solid red; color:#000;}
.seccion:hover{ border: 2px solid goldenrod; background-color: aqua;}
.seccion-container a{text-decoration: none;}

#apoyo { padding: 10px 10px;font-size: 1.2rem;
        cursor: pointer;border: none; border-radius: 8px;
        background-color: #414141;color: white; box-shadow: 0 4px 6px rgba(0,0,0,0.1);
        display: flex; align-items: center; margin-bottom: 10px; flex-wrap: wrap; justify-content: center;}   
#apoyo a{margin: 0 4px;}    
#apoyo img { height: 35px; border-radius: 8px; object-fit: fill;display: block;}

.divpadre1 {border: 5px solid black;background-color: dimgray; display: inline-block;}
.divhijo1{ border: 3px solid red;}
#hijo11 {background-color: whitesmoke;}
#hijo21 {background-color: floralwhite;}
#hijo31 {background-color: skyblue;}

.divpadre2 {border: 5px solid black;background-color: dimgray;}
.divhijo2{ border: 3px solid red;display: inline-block;}
#hijo12 {background-color: whitesmoke;}
#hijo22 {background-color: floralwhite;}
#hijo32 {background-color: skyblue;}

.divpadre3 {border: 5px solid black;background-color: dimgray;display:inline-block;}
.divhijo3{ border: 3px solid red;display: inline-block;}
#hijo13 {background-color: whitesmoke;}
#hijo23 {background-color: floralwhite;}
#hijo33 {background-color: skyblue;}

.divpadre4 {border: 5px solid black;background-color: dimgray;display: inline-block;}
.img{ width:100px;display: inline-block;}
#img1 {width:100px;}
#img2 {width:300px;}
#img3 {width:200px;}

.divpadre5 {border: 5px solid black;background-color: dimgray;}
.img1{ width:100px;display: inline-block;}
#img11 {width:100px;}
#img12 {width:300px;}
#img13 {width:200px;}

.divpadre6 {border: 5px solid black;background-color: dimgray;}
.img2{ width:100px;display: block;}
#img21 {width:100px;}
#img22 {width:300px;}
#img23 {width:200px;}

.divpadre7 {border: 5px solid black;background-color: dimgray; display: inline-block;}
.img3{ width:100px;display: block;}
#img31 {width:100px;}
#img32 {width:300px;}
#img33 {width:200px;}