:root {
    --main-color: #EF5F34;
    --main-color-darker: #C2502D;
    --main-color-opacity: #EF603459;
    --secondary-color: #922582;
    --secondary-color-darker: #6E1C62;
    --font-color: #FEFEFE;
    --bg-white: #F0F0F0;
    --title-color-gray: #605F5F;
    --dark-color: #181818;
    --black-color: #000;
    --white-color: #FFF;
}

@font-face {
    font-family: "Raleway Medium";
    src: url("/public/fonts/Raleway-Medium.ttf");
}

@font-face {
    font-family: "Raleway Bold";
    src: url("/public/fonts/Raleway-Bold.ttf");
}

@font-face {
    font-family: "Raleway Light";
    src: url("/public/fonts/Raleway-Light.ttf");
}

@font-face {
    font-family: "Raleway Regular";
    src: url("/public/fonts/Raleway-Regular.ttf");
}

.color-orange {
    color: var(--main-color);
}

.navbar-light .navbar-nav .nav-link, .navbar-dark .navbar-nav .nav-link {
    color: var(--font-color) !important;
    font-family: "Raleway Medium";
    font-size: 15px;
    line-height: 17px;
}

.navbar-light .navbar-nav .nav-link.dark, .navbar-dark .navbar-nav .nav-link.dark {
    color: var(--black-color) !important;
}

.nav-link.active {
    border-bottom: 3px solid var(--main-color);
}

.nav-link.active.light {
    border-bottom: 3px solid var(--white-color);
}

.descr {
    color: var(--font-color);
    font-family: "Raleway Regular";
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 1px;
}

.btn {
    font-family: "Raleway Regular";
    font-size: 10px !important;
    line-height: 21px !important;
    border-radius: 60px !important;
}

.btn-primary {
    color: var(--font-color) !important;
    background-color: var(--main-color) !important;
    border-color: var(--main-color) !important;
}

.btn-primary:hover {
    background-color: var(--main-color-darker) !important;
    border-color: var(--main-color-darker) !important;
}

.btn-secondary {
    color: #fff;
    background-color: var(--secondary-color) !important;
    border-color: var(--secondary-color) !important;
}

.btn-secondary:hover {
    background-color: var(--secondary-color-darker) !important;
    border-color: var(--secondary-color-darker) !important;
}

.bg-white-p {
    background-color: var(--bg-white);
}

.card {
    border-radius: 37px !important;
    border-color: var(--secondary-color);
    overflow: hidden;
}

.card-title {
    font-family: "Raleway Bold";
    color: var(--secondary-color);
    font-size: 18px;
    line-height: 22px;
}

.card-footer {
    background-color: transparent !important;
    border-top: none !important;
}

.descr-b {
    color: var(--font-color);
    font-family: "Raleway Regular";
    font-size: 24px;
    line-height: 43px;
}

.footer-items {
    list-style-type: none;
}

.footer-items .icono-mail {
    height: 9px;
}

.footer-items .icono-tel {
    height: 14px;
}

.footer-items .icono-mapa {
    height: 15px;
}

.text-footer {
    color: var(--title-color-gray);
    font-family: "Raleway Regular";
    font-size: 12px;
    line-height: 20px;
    text-decoration: none;
}

h6.text-footer, .text-important {
    color: var(--main-color);
    font-family: "Raleway Bold";
}

footer hr {
    color: var(--title-color-gray);
    background-color: var(--title-color-gray);
    opacity: 1;
    width: 882.5px;
}

footer hr:not([size]) {
    height: 1px;
}

.w-60 {
    width: 60% !important;
}

#background-contacto {
    background: var(--main-color);
    position: absolute;
    bottom: -20px;
    height: 150px;
    left: -35px;
    right: -35px;
    justify-content: center;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
}

/* ===========================INDEX=========================== */

#main-index {
    background-image: url("/public/images/home.png");
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: auto;
}

#main-index h1, #main-index h2 {
    font-size: 46px;
    line-height: 54px;
}

#main-index h1 strong, #main-index h2, #marcas h3, #section-services h2 strong {
    font-family: "Raleway Bold";
}

#main-index h1 span {
    font-family: "Raleway Light";
}

#main-index h2 {
    color: var(--font-color);
}

#marcas h3 {
    color: var(--title-color-gray);
    font-size: 21px;
    line-height: 27px;
}

.marca-ush {
    height: 80px;
}

.marca-uni {
    height: 67.5px;
}

#section-services {
    background-image: url("/public/images/servicios_Home.png");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

#section-services h2 {
    font-size: 36px;
    line-height: 53px;
    color: var(--font-color);
    font-family: "Raleway Regular";
}

#section-services hr {
    color: var(--font-color);
    background-color: var(--font-color);
    opacity: 1;
    width: 287.5px;
}

#section-services hr:not([size]) {
    height: 2px;
}

#section-solution {
    background-image: url("/public/images/contacto_home.png");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

#section-solution .card-title {
    font-family: "Raleway Regular";
    color: var(--main-color);
    font-size: 36px;
    line-height: 53px;
}

#section-solution .card-title strong {
    font-family: "Raleway Bold";
}

#section-solution .descr {
    color: var(--dark-color);
}

#section-solution hr {
    color: var(--main-color);
    background-color: var(--main-color);
    opacity: 1;
    width: 287.5px;
}

#section-solution hr:not([size]) {
    height: 3px;
}

/* =========================================================== */

/* =========================NOSOTROS========================== */

#main-nosotros h1 {
    font-family: "Raleway Regular";
    color: var(--main-color);
    font-size: 36px;
    line-height: 53px;
}

#main-nosotros h1 strong {
    font-family: "Raleway Bold";
}

#main-nosotros p {
    font-family: "Raleway Regular";
    color: var(--dark-color);
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 1px;
}

/* =========================================================== */

/* =========================SERVICIOS========================= */

#main-servicios h1 {
    font-family: "Raleway Regular";
    color: var(--secondary-color);
    font-size: 36px;
    line-height: 53px;
}

#main-servicios h1 strong, #main-servicios .card-text span {
    font-family: "Raleway Bold";
}

#main-servicios .container-img {
    background-color: var(--bg-white);
    border-right: 10px solid transparent;
    border-image: linear-gradient(to bottom, var(--secondary-color), var(--main-color)) 1;
}

#main-servicios .card-title {
    font-size: 24px;
    line-height: 53px;
}

#main-servicios .card-text {
    font-family: "Raleway Regular";
    color: var(--dark-color);
    font-size: 16px;
    line-height: 22px;
    letter-spacing: 1px;
}

/* =========================================================== */

/* ==========================CONTACTO========================= */

#main-contacto-bg {
    background-image: url("/public/images/fondo_network.png");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

#main-contacto h1 {
    font-family: "Raleway Regular";
    color: var(--main-color);
    font-size: 36px;
    line-height: 53px;
}

#main-contacto h1 strong {
    font-family: "Raleway Bold";
}

#main-contacto header .descr {
    color: var(--dark-color);
}

#main-contacto .card {
    border-radius: 26px !important;
    border: none;
}

label {
    font-family: "Raleway Medium";
    color: var(--main-color);
    font-size: 12px;
    line-height: 14px;
    letter-spacing: 2px;
}

input {
    border: none;
    border-bottom: 1px solid var(--main-color);
    width: 100%;
    font-family: "Raleway Medium";
    color: var(--title-color-gray);
}

textarea {
    padding: 4px;
    border: 1px solid var(--main-color);
    border-radius: 12px;
    width: 100%;
    resize: none !important;
    font-family: "Raleway Medium" !important;
    color: var(--title-color-gray);
}

input::placeholder, textarea::placeholder {
    font-size: 12px;
    line-height: 22px;
    color: var(--title-color-gray) !important;
}

input:focus, textarea:focus {
    outline: none;
    background-color: var(--main-color-opacity);
}

/* =========================================================== */

@media (min-width: 992px) {
    .px-lg-4-5 {
        padding-right: 2rem!important;
        padding-left: 2rem!important;
    }
}
@media (max-width: 768px) {
    footer hr {
        width: 100%;
    }
    .px-sm-4-5 {
        padding-right: 2rem!important;
        padding-left: 2rem!important;
    }
    #mainNav{
        border-bottom: 1px solid #707070;
    }
    .navbar-light .navbar-nav .nav-link, .navbar-dark .navbar-nav .nav-link{
        color: rgba(0,0,0,.9) !important;
    }
    
}
@media (max-width: 414px) {
    #main-index h1, #main-index h2 {
        font-size: 42px;
    }
    .px-4-5 {
        padding-right: 3rem!important;
        padding-left: 3rem!important;
    }
    .btn {
        font-size: 18px !important;
    }
    .marca-uni {
        height: 40.5px;
    }
    .marca-ush {
        height: 54px;
    }
    .btn {
        font-size: 15px !important;
    }
    .descr-b {
        font-size: 15px;
        line-height: 29px;
    }
    #section-solution .card-title {
        line-height: 40px;
    }
    #section-solution hr {
        width: auto;
    }
    #main-servicios .container-img {
        border-right: none;
        border-bottom: 10px solid transparent;
        border-image: linear-gradient(to left, var(--secondary-color), var(--main-color)) 1;
    }
    #main-servicios .container-img img{
        width: 50% !important;
    }
}
@media (max-width: 320px) {
    .marca-uni {
        height: 36.5px;
    }
    .marca-ush {
        height: 44px;
    }
    #section-services h2 {
        line-height: 38px;
    }
    #section-solution .card-title {
        font-size: 22px;
    }
    .px-4-5 {
        padding-right: 2rem!important;
        padding-left: 2rem!important;
    }
    #section-solution .card-title {
        line-height: 29px;
    }
}