/*reglaas para ancho y largo estandar */

.w-14 {
    width: 3.5rem;
}

.h-14 {
    height: 3.5rem;
}

.w-16 {
    width: 5.5rem;
}

.h-16 {
    height: 5.5rem;
}

/* ----------------------------------------*/
/* reglas para margenes y padding estandar */

.mt-16 {
    margin-top: 4rem;
}

.mb-16 {
    margin-bottom: 4rem;
}

/* -----------------------------------------*/
/* reglas para alineacion y posicionamiento */

.items-center {
    align-items: center;
}

.justify-center {
    justify-content: center;
}

.rounded-full {
    border-radius: 9999px;
}


/* ---------------------------------*/
/* reglas para imagenes responsivas */

.img-50 {
    max-width: 50%;
    height: auto;
}

.img-75 {
    max-width: 75%;
    height: auto;
}

.img-fluid-inversa-lg-xl {
    height: 100%;
    width: auto;
}

@media (max-width: 991.98px) {
    .img-fluid-inversa-lg-xl {
        max-width: 100%;
        height: auto;
        width: 100%;
    }
}

/* ---------------------------------*/
/* reglas para colores de fondo */

.bg-white-20 {
    background-color: rgba(255, 255, 255, 0.2);
}

.bg-white-75 {
    background-color: rgba(255, 255, 255, 0.75);
}

.bg-cian-soft {
    background: linear-gradient(135deg, #e0f7fa 0%, #f4f7fb 100%);
}

.bg-logo-gradient-110 {
    background: linear-gradient(135deg, #1fc1c7 0%, #1e98a3 100%);
}

.bg-logo-gradient-110:hover {
    background: linear-gradient(135deg, #1e9fa9 0%, #317881 100%);
}

.bg-logo-gradient {
    background: linear-gradient(135deg, #1fc0c7 0%, #4a5568 100%);
}

.bg-logo-gradient:hover {
    background: linear-gradient(135deg, #0b93a2 0%, #4a5568 100%);
}

.bg-logo-gradient-active {
    background: linear-gradient(135deg, #0b93a2 0%, #4a5568 100%);
}

.bg-store-gradient {
    background: linear-gradient(135deg, #f6ad55 0%, #ed8936 100%);
    color: white;
}

.bg-store-gradient:hover {
    background: linear-gradient(135deg, #f97316 0%, #c05621 100%);
}



.bg-logo-gradient-outline {
    background: transparent !important;
    border: 2px solid #0b93a2 !important;
    color: #0b93a2 !important;
}

.bg-logo-gradient-outline:hover {
    background: #0b93a2 !important;
    color: white !important;
}

.bg-store-gradient-outline {
    background: transparent !important;
    border: 2px solid #ed8936 !important;
    color: #ed8936 !important;
}

.bg-store-gradient-outline:hover {
    background: #ed8936 !important;
    color: white !important;
}
.bg-store-gradient-active {
    background: linear-gradient(135deg, #f97316 0%, #c05621 100%);
    color: white;
}

.bg-cian-active{
    background-color: #0b93a2 !important;
    color: whitesmoke !important;
}


/* ---------------------------------*/
/* reglas para bordes y sombras */

.outline-cian {
    border: solid 1px #20b7c4;
    border-radius: 5px;
}
.border-none {
    border: none;
}

/* --------------------------------*/
/* reglas para colores de texto */
.text-slate {
    color: rgb(71 85 105);
}

.text-cian {
    color: #0b93a2 !important;
}

.text-gradient-cian {
    background: linear-gradient(135deg, #1bb8c0 0%, #4a5568 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}

.text-gradient-cian-110 {
    background: linear-gradient(135deg, #05f6ff 0%, #4a5568 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}

.text-gradient-cian-120 {
    background: linear-gradient(135deg, #05f6ff 0%, #1facb4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}

/* ---------------------------------*/
/* reglas para tipografía */
.fs-10 {
    font-size: 10px;
}

.fs-12 {
    font-size: 12px;
}

.fs-14 {
    font-size: 14px;
}

.fs-16 {
    font-size: 16px;
}

.fs-18 {
    font-size: 18px;
}

.fs-20 {
    font-size: 20px;
}

.fs-22 {
    font-size: 22px;
}

.fs-24 {
    font-size: 24px;
}

@media (max-width: 768px) {
    .fs-sm-12 {
        font-size: 12px;
    }

    .fs-sm-14 {
        font-size: 14px;
    }

    .fs-sm-16 {
        font-size: 16px;
    }

    .fs-sm-18 {
        font-size: 18px;
    }
}

@media (max-width: 576px) {
    .fs-xs-12 {
        font-size: 12px !important;
    }

    .fs-xs-14 {
        font-size: 14px !important;
    }

    .fs-xs-16 {
        font-size: 16px !important;
    }

    .fs-xs-18 {
        font-size: 18px !important;
    }
}

.underline-none{
    text-decoration: none !important;
}