@charset "UTF-8";
/* CSS Document */


/* ==================================================
  Hero para home Pagina inicial
================================================== */

.hero:before {
    background-color: #000;
}

.cover-index {
    background-color: #6b615d;
}

.hero-brand a:focus-visible {
    box-shadow: 0 0 0 0.15rem rgba(242, 242, 242, 0.7);
    outline: 0;
    border: 3px solid #fff;;
}

.cover-title h1 {
    color: #fff;
}

.tagline {
    color: #fff;
}

.hero .btn {
    color: #222;
    background-color: #31BDCD;
}

.hero .btn:hover, .hero .btn:focus-visible {
    background-color: #ffe495;
    color: #333;
}


.hero .btn:focus-visible {
    border: 3px solid #fff;
    box-shadow: 0 0 0 0.15rem rgba(242, 242, 242, 0.7);
}

.logos {
    color: #fff;
}


/* ==================================================
  Nav PRINCIPAL
================================================== */

.alpha-menu {
    border-top: 13px solid #31BDCD;
    background-color: #FFDE82 !important;
}

#nav-principal a {
    border:1px solid transparent;
}

#nav-principal .nav-link, .titulo-left, #nav-principal .navbar-toggler {
    color: #333;
}
#nav-principal a.active, #nav-principal a:hover, #nav-principal a:focus {
    background-color: #CCB168;
    color:#222;
}

#nav-principal .dropdown-item:hover, #nav-principal .dropdown-item:focus {
    background-color: rgba(255,222,130, 0.5);
    
}
#nav-principal .dropdown-item:focus-visible {
    border:solid 2px #CCB168;
    outline: 0;
}

#nav-principal .nav-link:focus-visible {
    box-shadow: 0 0 0 0.15rem rgba(242, 242, 242, 0.7);
    border: 3px solid #fff;
  }
  




/* ==================================================
SECCIONES
================================================== */
section.claro {
    background-color: #fff;
}

section.oscuro {
    background-color: #FCF2D9;
}

.wrapper-act {
    background-color: #CEF0EA;
    color: #444;
}

.wrapper-act .content-act {
    background-color: #80D8D0;
}

.content-act {
    background-color: #fff;
}

.wrapper-autoe {
    background-color: #e3f8f7;
}

/* ==================================================
TEXTO
================================================== */

main {
    color: #444;
}
main h2, #fuentes-info h3 {
    color: #196169;
}

main .oscuro h2 {
    color: #17575E;
}

/* actividades y autoevaluaciones */
.wrapper-act {
    color: #333;
}
.content-act h2 {
    border-bottom: 2px solid #fff59f;
}
.wrapper-act h2 {
    color: #0A2629;
}
.wrapper-autoe h2 {
    color: #196169;
}

#fuentes-info .icono {
    color: #444;
}


/* fuentes de información */
/* #fuentes-info .envolv {
	background-color: #575757;
	color: #fff;
  } */


/* ==================================================
BOTONES DE CONTENIDO
================================================== */

.btn-comenzar {
    background-color: #ffe495;
    color: #333;
}


.content-act button {
    border:2px solid #ffe495;
}

.content-act button:focus-visible {
    box-shadow: 0 0 0 0.15rem rgba(68, 68, 68, 1);
}

.content-act button:hover, .content-act button:focus {
    background-color: #CCB168 !important;
    color:#222 !important;
    border-color:#fff !important;
}

.btn-outline-secondary:focus, .btn-close:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.15rem rgba(68, 68, 68, 1);
    border:3px solid #fff;
}


/* ==================================================
FIGURAS 
================================================== */

.note {
    color: #333;
    background: #ffe38e;
}

.note:before {
    border-color: rgba(255, 255, 255, 0) rgba(255, 255, 255, 0) #F0B400 rgba(255, 255, 255, 0);
    background-color: #ffffff;
}


/* ==================================================
  FOOTER  
================================================== */

footer {
    background-color: #4d4d4d;
    color: #fff;
}

footer .link-cuaieed:focus-visible, .btn-link:focus-visible, .ir-arriba:focus-visible {
    box-shadow: 0 0 0 0.15rem rgba(242, 242, 242, 0.7);
    outline: 0;
    border: 3px solid #fff;
}

footer .btn-link {
    color: #fff;
}

.btn-link:focus-visible {
    color: #eee;
}

footer .btn-link:hover {
    color: #eee;
}

#creditos h1 {
    color: #555;
}

#creditos p {
    color: #222;
}

#creditos ul li {
    border: 1px solid #ddd;
}

#creditos ul li:nth-child(2n) {
    background-color: #f2f2f2;
}



/* botón para subir */
.ir-arriba {
    background-color: rgba(38,55,79, .9);
    color: #fff;
    border-color: transparent;
}
	

.ir-arriba:hover {
    color: #fff;
    background-color: rgba(38,55,79, .6)
}


@media (min-width: 992px) {
    #creditos ul li div:first-child {
		background-color: #ddd;
	}

	#creditos ul li:nth-child(2n) div:first-child {
		background-color: #f2f2f2;
	}

	#creditos ul li div:nth-child(2) {
		background-color: #fff;
	}
}



/* ==================================================
  RECURSOS DE CONTENIDO
================================================== */

/* carusel */

.carousel-inner {
    background-color: #fff;
}
.carousel-item {
    background-color: #f2f2f2;
}

.carousel-dark .carousel-indicators [data-bs-target] {
    border: 2px solid #444;
    background-color: #fff;
}
.carousel-dark .carousel-indicators .active {
    background-color: #31BDCD;
    border-color:#31BDCD;
}

.carousel-indicators [data-bs-target]:focus {
    outline: 3px solid #444;
    opacity: 1;
}


.carousel-control-prev:focus, .carousel-control-next:focus {
    border:3px solid #444;
}