@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root {
    --color-dark-1: #181818;
    --color-dark-2: #707070;
    --color-gray: #B8B8B8;
    --color-light-gray: #F1F1F1;
    --color-cian: #98D7F7;
    --color-white: #FFFFFF;
    --color-orange: #ED931F;
}

body {
    font-family: 'Montserrat', sans-serif !important;
}

.blanco{
    color:var(--color-white);
}

.nav-collapse{
    width: 100%;
}
.nav-link {
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    color: var(--color-white) !important;
}

.nav-link.active {
    font-weight: 700;
}

.v-line {
    display: flex;
    border: 1px solid var(--color-white);
    border-radius: 2px;
}

.h-line {
    display: flex;
    border: 1px solid var(--color-white);
}

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

footer h6, footer h5 {
    color: var(--color-white);
}

footer h5 {
    font-size: 14px;
    line-height: 18px;
    font-weight: 700;
}

footer h6 {
    font-size: 12px;
    line-height: 15px;
    font-weight: 600;
}

footer p, footer a, footer span {
    font-size: 12px;
    line-height: 15px;
    font-weight: 400;
    text-decoration: none;
    color: var(--color-white);
}

footer a:hover {
    font-weight: 600;
    color: var(--color-white);
}

footer span {
    color: var(--color-dark-2);
}

#icon-tw-footer {
    max-width: 21.3px;
}

#icon-fb-footer {
    max-width: 20.64px;
}

#icon-ig-footer {
    max-width: 18.65px;
}

#icon-yt-footer {
    max-width: 22.72px;
}

#icon-tw-header {
    max-width: 38.01px;
}

#icon-fb-header {
    max-width: 36.82px;
}

#icon-ig-header {
    max-width: 33.28px;
}

#icon-yt-header {
    max-width: 40.54px;
}

.main-title {
    font-size: 40px;
    line-height: 49px;
    font-weight: bold;
    color: var(--color-white);
}

.main-text {
    font-size: 20px;
    line-height: 24px;
    font-weight: 500;
    color: var(--color-white);
}

.text-regular {
    font-weight: 400 !important;
}

.secondary-title {
    font-size: 24px;
    line-height: 29px;
    font-weight: bold;
    color: var(--color-white);
}

.text-orange {
    color: var(--color-orange) !important;
}

.text-shadow-orange {
    text-shadow: 0px 0px 10px #C53112;
}

.font-semibold {
    font-weight: 600 !important;
}

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

.bg-main {
    background: rgb(237, 147, 31);
    background: -moz-linear-gradient(180deg, rgba(237, 147, 31, 1) 0%, rgba(197, 49, 18, 1) 100%);
    background: -webkit-linear-gradient(180deg, rgba(237, 147, 31, 1) 0%, rgba(197, 49, 18, 1) 100%);
    background: linear-gradient(180deg, rgba(237, 147, 31, 1) 0%, rgba(197, 49, 18, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ed931f", endColorstr="#c53112", GradientType=1);
    mix-blend-mode: normal;
}

.bg-main-2 {
    background: rgb(237, 147, 31);
    background: -moz-linear-gradient(360deg, rgba(237, 147, 31, 1) 0%, rgba(197, 49, 18, 1) 100%);
    background: -webkit-linear-gradient(360deg, rgba(237, 147, 31, 1) 0%, rgba(197, 49, 18, 1) 100%);
    background: linear-gradient(360deg, rgba(237, 147, 31, 1) 0%, rgba(197, 49, 18, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ed931f", endColorstr="#c53112", GradientType=1);
    mix-blend-mode: normal;
}

.bg-main:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-image: url('../images/imagen-home_1920.png');
    background-position: top;
    background-size: contain;
    filter: opacity(0.28);
    mix-blend-mode: overlay;
    background-repeat: no-repeat;
}

.remaining-time {
    font-size: 20px;
    line-height: 24px;
    font-weight: bold;
    color: var(--color-white);
}

.bg-remaining {
    background: rgb(197, 49, 18);
    background: -moz-linear-gradient(90deg, rgba(197, 49, 18, 0) 0%, rgba(197, 49, 18, 1) 10%, rgba(197, 49, 18, 1) 50%, rgba(197, 49, 18, 1) 90%, rgba(197, 49, 18, 0) 100%);
    background: -webkit-linear-gradient(90deg, rgba(197, 49, 18, 0) 0%, rgba(197, 49, 18, 1) 10%, rgba(197, 49, 18, 1) 50%, rgba(197, 49, 18, 1) 90%, rgba(197, 49, 18, 0) 100%);
    background: linear-gradient(90deg, rgba(197, 49, 18, 0) 0%, rgba(197, 49, 18, 1) 10%, rgba(197, 49, 18, 1) 50%, rgba(197, 49, 18, 1) 90%, rgba(197, 49, 18, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c53112", endColorstr="#c53112", GradientType=1);
}

.figuritas-container {
    height: 613px;
    mix-blend-mode: luminosity;
}

.figuritas-container-over {
    height: 613px;
}

.img-figurita {
    filter: drop-shadow(3px 3px 13px rgba(0, 0, 0, 0.25));
}

/* .figuritas-container-over .position-relative::after {
    content: "test";
} */

.figura1 {
    top: 8.1px;
    left: 12.8%;
    max-width: 215.05px;
    transform: rotate(-10deg);
}

.figura2 {
    top: 59px;
    left: 28.5%;
    max-width: 233.83px;
    transform: rotate(8deg);
}

.figura3 {
    top: 55.3px;
    right: 32.7%;
    max-width: 200px;
    transform: rotate(-9deg);
}

.figura4 {
    top: 1.7px;
    right: 15.2%;
    max-width: 214.78px;
    transform: rotate(0deg);
}

.figura5 {
    top: -48.1px;
    left: 1.9%;
    max-width: 214.78px;
    transform: rotate(0deg);
}

.figura6 {
    top: 17px;
    left: 17.1%;
    max-width: 230px;
    transform: rotate(11deg);
}

.figura7 {
    top: 6.3px;
    right: 40.4%;
    max-width: 215.05px;
    transform: rotate(8deg);
}

.figura8 {
    top: -20.8px;
    right: 20.5%;
    max-width: 214.78px;
    transform: rotate(0deg);
}

.figura9 {
    top: -89px;
    right: 0.2%;
    max-width: 233px;
    transform: rotate(0deg);
}

.figura10 {
    top: -63px;
    left: 4.2%;
    max-width: 200px;
    transform: rotate(-10deg);
}

.figura11 {
    top: -34.2px;
    right: 49.1%;
    max-width: 233px;
    transform: rotate(0deg);
}

.figura12 {
    top: -60.6px;
    right: 28.7%;
    max-width: 215.58px;
    transform: rotate(0deg);
}

.figura13 {
    top: -92.9px;
    right: 7.1%;
    max-width: 215.58px;
    transform: rotate(0deg);
}


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

/* ========================================== ILUSTRADORES ========================================= */

#ilustradores-section .card-img-top {
    max-width: 190px;
    border-radius: 190px;
    border: 3px solid var(--color-white);
}

#ilustradores-section .card-title {
    font-size: 27px;
    line-height: 34px;
    font-weight: bold;
    color: var(--color-white);
}

#ilustradores-section .card-text {
    font-size: 17px;
    line-height: 21px;
    font-weight: 400;
    color: var(--color-white);
}

.bg-gradient-red {
    background: rgb(197, 49, 18);
    background: -moz-linear-gradient(0deg, rgba(197, 49, 18, 1) 0%, rgba(141, 36, 14, 1) 100%);
    background: -webkit-linear-gradient(0deg, rgba(197, 49, 18, 1) 0%, rgba(141, 36, 14, 1) 100%);
    background: linear-gradient(0deg, rgba(197, 49, 18, 1) 0%, rgba(141, 36, 14, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c53112", endColorstr="#8d240e", GradientType=1);
}

.bg-gradient-red-1 {
    background: rgb(197, 49, 18);
    background: -moz-linear-gradient(180deg, rgba(197, 49, 18, 1) 0%, rgba(141, 36, 14, 1) 100%);
    background: -webkit-linear-gradient(180deg, rgba(197, 49, 18, 1) 0%, rgba(141, 36, 14, 1) 100%);
    background: linear-gradient(180deg, rgba(197, 49, 18, 1) 0%, rgba(141, 36, 14, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c53112", endColorstr="#8d240e", GradientType=1);
}

.bg-gradient-red-2 {
    background: rgb(197, 49, 18);
    background: -moz-linear-gradient(0deg, rgba(197, 49, 18, 1) 0%, rgba(141, 36, 14, 0) 100%);
    background: -webkit-linear-gradient(0deg, rgba(197, 49, 18, 1) 0%, rgba(141, 36, 14, 0) 100%);
    background: linear-gradient(0deg, rgba(197, 49, 18, 1) 0%, rgba(141, 36, 14, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c53112", endColorstr="#8d240e", GradientType=1);
}

.content-ilustrador {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}

.z-index-1030 {
    z-index: 1030;
}

.btn-collapse {
    margin-top: 5px;
    width: 107.2%;
}

#container-imagenes-padre {
    mix-blend-mode: luminosity;
}

#container-imagenes {
    width: max-content;
    scroll-behavior: smooth;
}

.container-imagenes {
    max-width: 481.78px;
    max-height: 271px;
}

.container-imagenes img {
    object-fit: cover;
    object-position: top;
}

#container-img-gallery {
    z-index: 9999;
}

#container-img-gallery img {
    max-width: 800px;
    max-height: 600px;
}

#txt-gallery {
    font-size: 13px;
    line-height: 19px;
    font-weight: 400;
    color: var(--color-orange);
}

#input-slider {
    /* Override default CSS styles */
    -webkit-appearance: none;

    appearance: none;

    /* Specified height */
    height: 5px;

    border-radius: 25px;

    /* Grey background */
    background: var(--color-white);

    /* Remove outline */
    outline: none;

    /* Set transparency (for mouse-over effects on hover) */
    opacity: 1;

    /* 0.2 seconds transition on hover */
    -webkit-transition: .2s;

    transition: opacity .2s;
}

/* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
#input-slider::-webkit-slider-thumb {
    /* Override default look */
    -webkit-appearance: none;

    appearance: none;

    /* Set a specific slider handle width */
    width: 26px;

    /* Slider handle height */
    height: 26px;

    /* Green background */
    background: #C53112;

    border: 5px solid #ED931F;

    border-radius: 200px;

    /* Cursor on hover */
    cursor: pointer;

    filter: drop-shadow(0px 0px 10px #C53112);
}

#input-slider::-moz-range-thumb {
    /* Set a specific slider handle width */
    width: 26px;

    /* Slider handle height */
    height: 26px;

    /* Green background */
    background: #C53112;

    border: 5px solid #ED931F;

    border-radius: 200px;

    /* Cursor on hover */
    cursor: pointer;

    filter: drop-shadow(0px 0px 10px #C53112);
}

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

/* ============================================== FAQ ============================================== */

.bg-main-3 {
    background: rgb(237, 147, 31);
    background: -moz-linear-gradient(180deg, rgba(237, 147, 31, 1) 0%, rgba(197, 49, 18, 1) 100%);
    background: -webkit-linear-gradient(180deg, rgba(237, 147, 31, 1) 0%, rgba(197, 49, 18, 1) 100%);
    background: linear-gradient(180deg, rgba(237, 147, 31, 1) 0%, rgba(197, 49, 18, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ed931f", endColorstr="#c53112", GradientType=1);
    overflow: hidden;
}

.bg-main-3::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: attr(data-bottom);
    bottom: -400px;
    background-image: url('../images/imagen-home_1920.png');
    background-position: bottom;
    background-size: contain;
    filter: opacity(0.28);
    mix-blend-mode: overlay;
    background-repeat: no-repeat;
    height: 100%;
}

/* .footer-image:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 100%;
    background-image: url('../images/pinceles.png');
    background-position: center;
    background-size: contain;
    filter: drop-shadow(0 0 50px #C53112);
    width: 100%;
    mix-blend-mode: normal;
    background-repeat: no-repeat;*/
    /* TUVE QUE PONER 150 PARA QUE LA IMAGEN SE PUEDA AGRANDAR */
    /* height: 150%;
    max-width: 363px;
    max-height: 583px;
}  */
.img-pinceles{
    max-width: 363px;
   }

.main-text-faq {
    font-size: 12px;
    line-height: 15px;
    font-weight: 400;
    color: var(--color-white);
}

#section-faq .accordion-item {
    border-color: var(--color-white);
    border-width: 2px;
}

#section-faq .accordion-button {
    font-size: 20px;
    line-height: 24px;
    font-weight: 400;
    color: var(--color-white);
    box-shadow: none;
}

#section-faq .accordion-button::before {
    flex-shrink: 0;
    width: 1.67rem;
    height: 1.67rem;
    content: "";
    background-image: url('../images/arrow_down.svg');
    background-repeat: no-repeat;
    background-size: 100%;
    transition: transform .2s ease-in-out;
    background-position: center;
    margin-right: 10px;
}

#section-faq .accordion-button:not(.collapsed)::before {
    background-image: url('../images/arrow_down.svg');
    background-position: center;
    transform: rotate(-180deg);
}

#section-faq .accordion-button::after {
    display: none;
}

#section-faq .accordion-button:not(.collapsed)::after {
    display: none;
}

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

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

.contacto-input {
    background-color: rgba(24, 24, 24, 0.15);
    border: 1px solid var(--color-orange);
    border-radius: 5px;
    font-size: 14px;
    line-height: 18px;
    font-weight: 400;
    color: var(--color-white) !important;
    resize: none;
}

.contacto-input::placeholder {
    color: var(--color-orange);
}

.contacto-input::-moz-placeholder {
    color: var(--color-orange);
}

.contacto-input::-webkit-input-placeholder {
    color: var(--color-orange);
}

.contacto-input:focus {
    box-shadow: 0 0 12px var(--color-orange);
    outline: none;
}

.contacto-input:-webkit-autofill,
.contacto-input:-webkit-autofill:hover,
.contacto-input:-webkit-autofill:focus {
    border: 1px solid var(--color-orange);
    -webkit-text-fill-color: var(--color-orange);
    -webkit-box-shadow: none;
    box-shadow: none;
    transition: background-color 5000s ease-in-out 0s;
}

.btn-contacto {
    width: 100%;
    background-color: var(--color-orange);
    border-radius: 5px;
    font-size: 14px;
    line-height: 18px;
    font-weight: bold;
    color: #C53112;
    filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.16));
    border: none;
}

.btn-contacto a {

    font-size: 14px;
    line-height: 18px;
    font-weight: bold;
    color: #C53112;
}
.btn-contacto.disabled {
    mix-blend-mode: multiply;
}

.btn-contacto.disabled:hover {
    color: #C53112;
    background-color: var(--color-orange);
    mix-blend-mode: multiply;
}

.btn-contacto.disabled:focus {
    color: #C53112;
    background-color: var(--color-orange);
    mix-blend-mode: multiply;
}

.btn-contacto:hover {
    color: var(--color-white);
    background-color: #C53112;
}

.btn-contacto:focus {
    color: var(--color-white);
    background-color: #88220E;
}

.btn-contacto:hover a {
    color: var(--color-white);
    background-color: #C53112;
}

.btn-contacto:focus a {
    color: var(--color-white);
    background-color: #88220E;
}
.img-mapa {
    position: absolute;
    max-width: 322px;
    max-height: 624px;
    left: -2%;
    filter: drop-shadow(0 0 50px #C53112);
}

.msg-alert-success{
    border-radius: 10px;
    background-color: var(--color-orange);
    color: #C53112;
    filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.16));
}
.msg-alert-success p{
    font-size: 14px;
    color: #C53112;
    font-weight: 700;
}

.msg-alert-danger{
    background-color:red !important;
}
.msg-alert-danger p{
    font-size: 14px;
    color: white;
    font-weight: 500;
}
.btn-close{
    color: white;
    background-color: transparent !important;
    border: none;
}

.modal-custom{
    background: rgb(237, 147, 31);
    background: -moz-linear-gradient(180deg, rgba(237, 147, 31, 1) 0%, rgba(197, 49, 18, 1) 100%);
    background: -webkit-linear-gradient(180deg, rgba(237, 147, 31, 1) 0%, rgba(197, 49, 18, 1) 100%);
    background: linear-gradient(180deg, rgba(237, 147, 31, 1) 0%, rgba(197, 49, 18, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ed931f", endColorstr="#c53112", GradientType=1);
    mix-blend-mode: normal;
}

.modal-title{
    font-size: 25px !important;
}
.modal-custom p, .modal-custom h5 {
    color: white;
}
.dropdown-menu.show{
    min-width: 100% !important;
    transform: none !important;
    max-height: 100px !important;
    position: relative !important;
}
.btn-light{
    background-color: transparent !important;
    border-color: transparent !important;
}
/* ================================================================================================= */