/* CSS */

/* Ancho para móviles por defecto */
.card-responsive-width {
    width: 20rem; 
}

/* Laptops y pantallas grandes */
@media (min-width: 992px) { 
    .card-responsive-width {
        width: 30rem;
    }
}

/* -------------------------------------------------------------------- */
/*  Sweetalert2                                                         */
/* -------------------------------------------------------------------- */

/* Swal personalizado del popup */
.custom-swal-popup {
    font-size: 0.7rem;
    line-height: 1.7;
    padding: 0.7rem;
}

/* Swal personalizado del texto del mensaje */
.custom-swal-text {
    font-size: 1.1rem;
}

/* Swal personalizado del icono */
.custom-swal-icon {
    transform: scale(0.8) !important;
    transition: none !important;
    margin-top: 0;
}

/* Swal Titulo */
.custom-swal-title {
    font-size: 0.7rem;
    font-weight: bold;
    color: #43505e;
    margin-bottom: 7px;
}

/* -------------------------------------------------------------------- */
/* Estilos                                                              */
/* -------------------------------------------------------------------- */

/* Variables */
:root {
    --color_1: #9D5C90;
    --color_1-hover: #b173a9;
    --color_2: #66BECF;
    --color_3: #B0C948;
    --color_4: #E78190;
    --color_5: #F3A638;
	--color_6: white;
	--color_7: #E6E6E6;
    --color_8: dimgray;

    --font_family: 'Baloo 2', Arial, sans-serif;
    --bs-body-font-family: 'Baloo 2', Arial, sans-serif !important;
    --bs-body-font-size: 1.15rem !important;
}

body {
    background-color: #fffff1 !important;   /* Background general */
}

input, textarea, select, button {
    font-weight: 500 !important;
}

select option {
    font-weight: 500;
}

p, ul, li, ol {    
    color: var(--color_8); 
    font-family: var(--font_family);
}

h1, h2 {
    color: var(--color_1); 
    font-family: var(--font_family);
}

h4{
    color: var(--color_4); 
    font-family: var(--font_family);
}

h5 {    
    color: var(--color_1); 
    font-family: var(--font_family);
}

h3, h6 {
    color: var(--color_4); 
    font-family: var(--font_family);
}

small {
    color: var(--color_7); 
    font-family: var(--font_family);
}

/* Nav Link Color */
.nav-item a {
    color: var(--color_1);
}

.nav-item a:hover {
    background: var(--color_4);
    color: var(--color_6);
}

.bg-navbar { background: var(--color_7); }

.bg-footer { background: var(--color_7); }

.bg-footer-copy { background: var(--color_1); }

.a-link-color-1 {
    color: var(--color_1);
    text-decoration: none;
}

.bg-card-header-all { background: var(--color_7); }

.btn-dark {
  background: var(--color_1) !important;
  color: white !important;
  border-color: var(--color_1) !important;
}

.btn-dark:hover {
  background: var(--color_1-hover) !important;
}

/* -------------------------------------------------------------------- */
/*  Carousel                                                            */
/* -------------------------------------------------------------------- */

/* Fotos */ 
.carousel-img {
    width: 450px;
    height: 450px;
    object-fit: cover;
    box-shadow: 2px 0px 6px rgba(0, 0, 0, 0.3);
}

@media (max-width: 576px) {
    .carousel-img {
        width: 250px;
        height: 250px;
    }
}

/* Logos */
.carousel-fixed-height {
    min-height: 160px;
}

.carousel-logo {            /* Pantalla Móvil */
    max-width: 95%;
    max-height: 155px; 
    object-fit: contain;
}

@media (min-width: 992px) { /* Pantalla grande */
    .carousel-logo {
        max-width: 80%;
        max-height: 160px;
    }
}

/* Fondo Login */ 
.bg-gradient-two {
    background: #e38ae3;
    background: radial-gradient(circle, rgba(227, 138, 227, 1) 0%, rgba(231, 129, 144, 0.33) 50%);
}

/* -------------------------------------------------------------------- */
/* SVG                                                                  */
/* -------------------------------------------------------------------- */

.hero-ondas-solo-color {
    position: relative;
    background-color: #fffff1;
    overflow: hidden;
}

.hero-ondas-solo-color .container {
    position: relative;
    z-index: 1; 
}

/* Onda superior */
.hero-ondas-solo-color .onda-superior {
    display: block;
    width: 100%;
    height: 113px;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(5px);
}

/* Onda inferior */
.hero-ondas-solo-color .onda-inferior {
    display: block;
    width: 100%;
    height: 130px; 
    position: absolute;
    bottom: 0;
    left: 0;
    transform: translateY(62px);
}

/* -------------------------------------------------------------------- */
/* Contador imagen                                                      */
/* -------------------------------------------------------------------- */

.icono-img-i {
    width: 106px;
    height: 106px;
    object-fit: cover;
    /*box-shadow: 2px 0px 6px rgba(0, 0, 0, 0.3);*/
}

/* -------------------------------------------------------------------- */
/* Back To Top Button                                                   */
/* -------------------------------------------------------------------- */

#myBtn {
	position: fixed; 
  	z-index: 99; 
	bottom: 20px; 
	right: 20px; 
	display: none; 
	width: 52px;
	height: 52px;
	border: none; 
	border-radius: 50%; 
	outline: none; 
	background-color: var(--color_1); 
	cursor: pointer; 
}

#myBtn:hover { background-color: var(--color_4); }

#myBtn img {
	margin-bottom: 0.25rem;
	width: 18px;
}