.modal-header{ margin-right: 10px; margin-top: 10px; }
.modal-footer { position: relative; border-top: 1px white solid !important; height: 150px; padding-top: 50px; overflow-x: hidden; }
.modal-title { font-weight: 500; }
.modal-footer > div, .modal-footer > button { position: relative; z-index: 2; }
button.close{ width: 30px; height: 30px; border-radius: 50%; border: 1px gray solid; font-size: 30px; font-family: "Times New Roman", Times, serif; display: flex; justify-content: center; align-items: center;color:var(--colorText2) }
.image{ height: 80px; background-size: 100% 200%; background-position: center; }
.gray{ border-right: 1px black solid; }
.number{ height: 75px; width: 75px; border: 1px gray solid; border-radius: 50%; color: gray; padding-top: 5px; }
.border-top{ border-top: 1px black solid !important; }
@media screen and (min-width: 768px) {
    .ul-two-column { columns: 2; }
}
.modal-content{
    background-color: #151515;
    color: var(--colorText2)!important;
    border: 2px solid #595e88;
}
.modal-header{
    border-bottom: none!important;

}
.modal-header button{
    background-color: unset!important;
    border: none!important;
}
.modal-footer{
    border-top: none!important;
}
.hg-cargar h1, .hg-cargar h2, .hg-cargar h3, .hg-cargar h4 { color: var(--colorText2); }
.hg-cargar .modal-footer::before { content: ''; width: 100%; max-width: 500px; height: 100%;position: absolute; left: -24px; bottom: 0; opacity: 0.4; }
.hg-cargar .dropbox { background: #110f10; margin: 20px 10px; }
.hg-cargar .dropbox:hover { background: var(--colorBackground); }

.hg-instrutions .modal-content { overflow: hidden; }
.hg-instrutions .modal-content::before { content: ''; width: 100%; height: 30%; max-height: 200px;  position: absolute; left: -30px; bottom: 0; opacity: 0.4; }
.hg-instrutions .ctn-ins { padding: 10px 20px 20px 20px; }
.hg-instrutions .cabecera-ins { position: relative; margin-bottom: 50px; }
.hg-instrutions .cabecera-ins::after { content: ''; width: 90%; height: 1px; background-color: #000000; position: absolute; bottom: -20px; left: 0; right: 0; margin: auto; }
.hg-instrutions .cabecera-ins .logo-ins { height: 80px; display: flex; align-items: center; justify-content: center; }
.hg-instrutions .cabecera-ins .logo-ins img { width: 80%; max-width: 250px; margin: 0 10px; }
.hg-instrutions .cabecera-ins .nombre-ins { height: 80px; border-left: 1px #000000 solid; text-align: center;  display: flex; align-items: center; justify-content: center; }
.hg-instrutions .cabecera-ins .nombre-ins h3 { color: #99abb4; }
.hg-instrutions .instrucion-ins { margin-bottom: 40px; }
.hg-instrutions .instrucion-ins .box-ins { display: flex; align-items: flex-start; justify-content: flex-start; }
.hg-instrutions .instrucion-ins .number-ins { margin-right: 20px; } 
.hg-instrutions .instrucion-ins .circle-ins { width: 69px; height: 69px; border: 1px #191460 solid; display: flex; align-items: center; justify-content: center; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; -o-border-radius: 50%; }
.hg-instrutions .instrucion-ins .circle-ins span { font-size: 22px; color: #191460; }
.hg-instrutions .instrucion-ins .text-ins p { margin-bottom: 10px!important; }
.hg-instrutions .instrucion-ins .text-ins ul { color: #67757c; margin-bottom: 10px; }
.hg-instrutions .img-ins { margin-top: 10px; width: 100%; text-align: center; }
.hg-instrutions .img-ins img { max-width: 100%; max-height: 300px; margin: auto; }
.hg-instrutions .modal-footer { border: none!important; height: auto; padding: 0 30px 30px 20px; }
@media screen and (min-width: 768px) {
    .hg-instrutions .img-ins img { max-width: 80%; }
}