@import url('https://fonts.googleapis.com/css2?family=Patrick+Hand&display=swap');

*{padding: 0; margin: 0; box-sizing: border-box;transition: 1s all; }

/* Estilos generales */
/* MOBILE */

body{ font-family: Candara; }
header{ color: deeppink; background: #5d0056; padding: 1rem; background-color: transparent; background-image: url("https://www.wallpaperup.com/uploads/wallpapers/2014/03/25/308925/d5779ec7ffff396fcaf7de62c0900ad1.jpg"); background-position: right } 


header h1{ padding-left: 1.5rem ; font-size: 2.6rem;background-color: transparent;}
header img{padding-left: 9rem; width: 60%; }
header h2{font-size: 1.2rem; padding-left: 8.5rem; color: #a8fffc; }


main section article h4{text-decoration: underline;font-size: 1.1rem;}
main section aside h5{text-decoration: underline;font-size: 1.1rem;}
main section article{padding: 1rem;}
main section aside{padding: 1rem;}
main section article h3{font-size: 1.5rem;}
main section article{background: #5d0056;}


h1{font-family: 'Patrick Hand', cursive;}

.inicio { background: #b70063; }
.columna-2{ background: #d4a7fc;width: 100%; border-radius: 50px; border-color: #ff80c5; border-style: double; text-align: center;}
.columna-3{ background: #ffbde1;width: 100%; border-radius: 50px; border-color: #ff80c5; border-style: double; text-align: center;}

.inicio2{ display: flex; justify-content: space-around; background: #b70063;}
.columna-4{width: 33%; text-align: center; background-color: #b70063; }
.columna-5{width: 33%;text-align: center;background-color: #b70063;}
.columna-6{ width: 33%;text-align: center; background-color: #b70063;}
main section article h7 a {text-decoration: none; color: #a8fffc; font-size: 1rem; font-size: bold; }
main section article h8 a {text-decoration: none;color: #a8fffc;font-size: 1rem;}
main section article h9 a {text-decoration: none;color: #a8fffc;font-size: 1rem;}



footer{ background: #b5b5b5; padding: 1rem;}
footer p{ font-size: 0.8rem; font-weight: 800; color: deeppink; text-align: center;}

/* Menu */
nav{ background: #b70063; padding: 0.5rem; }
nav ul li {display: flex; font-size: 1rem; display: inline-block;padding-left: 0.5rem;} 
nav ul li a {color:deeppink; text-decoration: none;background: #000000; border-top-left-radius: 70px; border-top-right-radius: 70px; border-bottom-left-radius: 70px; border-bottom-right-radius: 70px; }
.link-activo{background: #ff6eff;}



/* cuando es mayor a 768px aparece esto */
/* escritorio */

@media screen and (min-width:48rem) { 
    
    nav{background: black ; display: flex; ; }
   
.inicio { display: flex; justify-content: space-around;background: #5d0056; }
.columna-2{ background: #d4a7fc;width: 35%; border-radius: 50px; border-color: #ff80c5; border-style: double; text-align: center; font-size: 0.9rem;}
.columna-3{ background: #ffbde1;width: 35%; border-radius: 50px; border-color: #ff80c5; border-style: double; text-align: center; font-size: 0.9rem;}
    
header h1{ padding-left: 31rem; font-size: 3.5rem;background-color: #5d0056; background-color: transparent;}
header img { padding-left: 39rem; }
header h2{padding-left: 40.5rem; color: #8cff19; font-size: 1.8rem;}



nav ul li {display: flex; justify-content:center;font-size: 1.5rem; display: inline-block; padding: 0rem; padding-left: 6.8rem; }   
nav ul li a {padding-bottom: 0.5rem; padding-left: 1rem; padding-top: 0.5rem; padding-right: 1rem;}    
    
.inicio2{ display: flex; justify-content: space-around; background: #5d0056;}
.columna-4{width: 33%; text-align: center; text-decoration: none;background-color: #5d0056;}
.columna-5{width: 33%;text-align: center;background-color: #5d0056;}
.columna-6{ width: 33%;text-align: center; background-color: #5d0056;}
main section article h7 a {text-decoration: none; color: #8cff19; font-size: 1.3rem; font-size: bold; }
main section article h8 a {text-decoration: none;color: #8cff19;font-size: 1.3rem;}
main section article h9 a {text-decoration: none;color: #8cff19;font-size: 1.3rem;}
.columna-7{ ; background: #d4a7fc; width: 35%; border-radius: 50px; border-color: #ff80c5; border-style: double; text-align: center; font-size: 0.9rem; }    
  
    
}