.margincontent{
    padding-top: 10vh!important
}

.dt-input{
    padding: 4px 8px 4px 8px!important;
    border: none!important;
    border: 1px solid #ccc!important;
    border-radius: 5px!important;
    font-weight: bold!important;
    box-sizing: border-box!important;
    color: #2C3E50!important;
    font-size: 14px!important; 
}

.dt-input:focus {
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    padding: 4px 8px 4px 8px!important;
    box-shadow: none !important;
    border: none!important;
    border: 2px solid #00b4d8!important;
    font-weight: bold!important;
    border-radius: 5px!important;
    outline-width: 0!important;
    font-size: 14px!important; 
}


.previous{
    font-family: 'Varela Round', sans-serif;
    background-color: #ececec!important;
    border-radius: 5px!important;
    border: 0!important;
    font-size: 12px!important;
}

.current{
    font-family: 'Varela Round', sans-serif;
    background-color: #ffffff!important;
    border-radius: 5px!important;
    border: 0!important;
    font-size: 12px!important;
    font-weight: bold!important;
    color: #e1e1e1!important;
}


.next{
    font-family: 'Varela Round', sans-serif;
    background-color: #ececec!important;
    border-radius: 5px!important;
    border: 0!important;
    font-size: 12px!important;
}


.push{
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
    
.push:hover {
    -webkit-transform: scale(1.1) !important;
    transform: scale(1.04) !important;
}

.btn-darkblue{
    background-color: #00447F!important;
    color: #eaeaea!important;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
    
.btn-darkblue:hover {
    background-color: #013969!important;
    color: #eaeaea!important;
    -webkit-transform: scale(1.1) !important;
    transform: scale(1.04) !important;
}

.text_blueDark{
    color: #00447F!important;
}

.text_blue{
    color: #0074da!important;
}

.text_orange{
    color: #ff8c10!important;
}

.text_justificy{
    text-align: justify!important;
}

.bigText{
    font-size: 50px!important;
}

.superText{
    font-size: 60px!important;
}

.fs-9{font-size: 11px!important;}

.tittleText{
    font-size: 50px!important;
    font-family: 'Arial Black','Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif!important;
}

.front_bold{ font-family: 'Arial Black','Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif!important;}

.TextSubtitle{
    font-size: 25px!important;
}

.numberBig{
    font-size: 50px!important;
    font-weight: bold!important;
    font-family: 'Arial Black','Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif!important;
}

.iconBig{
    font-size: 40px!important;
}

.imgpost{width: 250px!important;}
.imgpost2{width: 350px!important;}
.margin_extra{margin-top: -400px!important;}
.pointer_none{pointer-events: none!important;}
.smallText{
    font-size: 12px!important;
}

.bg_greylight{
    background-color: #eaeaea!important;
}

.bg_grey{
    background-color: #b6b6b6!important;
}

.bg_blueDark{
    background-color: #00447F!important;
}

.bg_yellow{
    background-color: #FFBB21!important;
}

.bg_blue{
    background-color: #21C5DE!important;
}

.bg_lightSuccess{
    background-color: #93d0a6!important;pointer-events: none !important;
}

.bg_lightDanger{
    background-color: #d57070!important;pointer-events: none !important;
}

.bg_lightBlue{
    background-color: #9fc8d8!important;pointer-events: none !important;
}

.bg_lightOrange{
    background-color: #ffce8f!important;pointer-events: none !important;
}

.bg_gradientBlue{
    background-color: #00aec8!important;
    background-image: linear-gradient(160deg, #00a0b9 0%, #01d1f0 100%)!important;
}

.bg_gradientPurple{
    background-color: #9843f1;
    background-image: linear-gradient(135deg, #9843f1 0%, #1d70c0 100%)!important;
}

.textBigBold{
    font-size: 35px!important;
    font-weight: bold!important;
    font-family: 'Arial Black','Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif!important;
}

.bolderLeftBlueDark{
    border-left: 12px solid #00447F!important;
}

.bg_gradientInicial{
    background-color: #2943d6;
    background-image: linear-gradient(43deg, #2943d6 0%, #50b7c8 46%, #19ffc7 100%);
}

.circleBlueDark{
    --size: 170px;  
    width: var(--size);
    height: var(--size);
    background-color: #00447F;
    border-radius: 50%;
}

.bg_gradientYellow{
    background-color: #FF8F17!important;
    background-image: linear-gradient(160deg, #FF8F17 0%, #ffc846 100%)!important;
}

.bolderLeftWhite{
    border-left: 12px solid #fafafa!important;
}

.cardPortada{width:95%;height: 50vh; object-fit: cover;}
.cardimg_info{width:100%!important;height:50vh!important;object-fit: cover!important;}
.cardall{max-width: 100%;height:50vh;}
.cardbody{max-width: 100%;height:40vh;}
.cardfooter{max-width: 100%;height:10vh;}

@media screen and (max-width:600px) { 
    .margincontent{ padding-top: 6vh!important;}

    .bigText{
        font-size: 30px!important;
    }

    .tittleText{
        font-size: 30px!important;
        font-family: 'Arial Black','Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif!important;
    }

    .TextSubtitle{
        font-size: 30px!important;
    }

    .numberBig{
        font-size: 35px!important;
        font-weight: bold!important;
        font-family: 'Arial Black','Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif!important;
    }

    .iconBig{
        font-size: 45px!important;
    }

    .imgpost{width: 200px!important;}
    .imgpost2{width: 300px!important;}
    .margin_extra{margin-top: 0px!important;}

    .circleBlueDark{
        --size: 130px;  
        width: var(--size);
        height: var(--size);
        background-color: #00447F;
        border-radius: 50%;
    }

    .cardPortada{width:95%;height: 20vh; object-fit: cover;}
    .cardimg_info{max-width: 100%!important;height:30vh!important;object-fit: cover!important;}
    .cardbody{max-width: 100%;height:40vh;}
    .cardfooter{max-width: 100%;height:8vh;}
    .imgarchivo{max-width: 100%;height:30vh;object-fit: cover;}
    .imgarchivo2{max-width: 100%;height:50vh;object-fit: contain;}

    .imgesdetalle{max-width: 100%;height:80vh;object-fit: contain;}
    .imgesdetalle2{max-width: 100%;height:80vh;object-fit: contain;}
}

.imgarchivo{max-width: 100%;height:40vh;object-fit: cover;}
.imgarchivo2{max-width: 100%;height:40vh;object-fit: contain;}

.imgesdetalle{max-width: 100%;height:90vh;object-fit: contain;}
.imgesdetalle2{max-width: 100%;height:90vh;object-fit: contain;}


/* -------------------------Load File Area2----------------------------------------- */
.drop-container2 {position: relative;display: flex;gap: 10px;flex-direction: column;justify-content: center;align-items: center; height: 300px;padding: 5px;border-radius: 10px;border: 2px dashed #555;color: #444;cursor: pointer;transition: background .2s ease-in-out, border .2s ease-in-out;}
.drop-container2:hover { background: #eee; border: 2px dashed #4c85ff; /* border-color: #9f0d0d; */ }
.drop-container2:hover .drop-title {color: #222;}
.drop-title2 { color: #444; font-size: 20px; font-weight: bold; text-align: center; transition: color .2s ease-in-out; }
.drop-container2 input[type=file] { width: 350px; max-width: 100%; color: #444; padding: 15px; background: #ffffff; border: none; }
.drop-container2 input[type=file]:hover{ width: 350px; max-width: 100%; color: #444; padding: 15px; background: #eee; border: none; }
.drop-container2 input[type=file]::file-selector-button {margin-right: 20px;border: none;background: #0082de;padding: 10px 20px;border-radius: 20px;color: #fff;cursor: pointer;transition: background .2s ease-in-out;}
.drop-container2 input[type=file]::file-selector-button:hover {background: #444;}