/* Small Tablet (500px a 768px) */
@media (min-width: 501px) and (max-width: 768px) {
    	.titulo-modal, 
		.text-modal, 
		.text-modal2,modal-body button {
			text-align: center;
		}

    .close {
        margin-right: 10px;
        margin-top: 10px;
    }
    #wizardRegButton{
        margin-top: -40px;
        padding-top: 0px;
    }

    .step-container
    {
        width: 100vw!important;
    }
    .imgrecup
    {
        width: 90vw!important;
    }

.form-horizontal .getCedula {
    position: relative !important;
    padding-top: 30px !important;
    overflow: visible !important;
    background-color: #f5f7fa;
    border-radius: 16px;
    height: auto;
    margin: 0px;
    width: 100%;
    margin-left: 2%;
}


    .img-logo {
        position: static !important;   
        margin: 0 10px 0 0 !important; 
        .img-logo {
        width: 10px;
        height: 13px;
}
    }

    .parrafo-peque {
        margin: 0 !important;
        padding: 0 !important;
        font-size: 13px !important;
        white-space: nowrap !important;
    }

    .step-indicator {
        order: 2 !important;
        margin: 0 0 10px 0 !important;
        width: fit-content !important;
    }

    .formHeadline {
        order: 3 !important;
        margin: 0 0 20px 0 !important;
        text-align: left !important;
    }

    .bbva-select-wrapper, 
    .input-wrapper-step1 {
        order: 4 !important;
        width: 100% !important;
        max-width: 100% !important;
        margin-bottom: 15px !important;
    }

    .login-sidebar {
        width: 60% !important;
        order: 5 !important;
        margin: 0px !important;
    }

    .notification {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        /* position: static !important; */
        margin: 0 !important;
        display: block !important;
    }
    .form-group {
        margin-bottom: 22px;
        padding: 1rem;
    }
    .wizard .button-bar {
        order: 6 !important;
        width: 100% !important;
        padding: 0 !important;
        display: flex !important;
        justify-content: flex-start !important;
        margin-top: 50px;
        margin-left: 10px !important;
    }

    #wizardNext {
        width: auto !important;
        min-width: 130px !important;
        float: none !important;
    }

    .wizard-progress-bar {
        display: none !important;
    }

    .headerRight {
        font-size: 14px;
    }

    .rstep1btn {
        margin-top: -300px;
    }

    /* ==========================================================================
        Para modal del step1
    ========================================================================== */
    
    #miModal .modal-content {
        width: 90% !important;
        margin: 30px auto !important;
    }
    #miModal .modal-header.modal-body {
        display: flex !important;
        flex-direction: column-reverse !important;
        align-items: center !important;
    }
    #miModal .parte1 { width: 100% !important; }
    #miModal .parte2 { display: none; }

    .boton-modal {

        margin-left: 50% !important;
    }

    .titulo-modal {

        padding-left: 20px;
        margin-bottom: 12px;
    }

    .titulo-modal {
        font-size: 40px;
    }

    .text-modal{
        margin-bottom: 10px;
        padding-left: 20px;
    }

    .text-modal2{
        padding-left: 20px;
    }


    /* ==========================================================================
        step 2 
    ========================================================================== */

    .formHeadline {
        order: 1 !important;
        margin: 0 !important; 
        text-align: left !important;
        font-size: 30px !important;
    }

    .boton-cerrar {
        order: 2 !important;
        cursor: pointer !important;
        width: 24px !important; 
        height: 24px !important;
    }
    
    .img21 {
        width: 158px;
        height: 158px;
    }
    .img12 {
        width: 158px;
        height: 158px;
    }


    td {
        height: 57%!important;
        width: 27%!important;
        padding-top: 1%!important;
    }

    #Registro-step2 .sub-step {
        margin: 10px 25px auto !important;
    }

    .verdatos {
        height: 550px;
    }



      /* ==========================================================================
    Inicio clave digital
    ========================================================================== */

    .messagesAEM p {
        /* margin-top: 5px !important; */
        font-size: 16px !important;

    }   
    .img-text {
         margin-top: 1% !important;
    }

    #Registro-step2 .sub-step {
        height: 600px;
        margin: 3vw !important;
    }

    .claveDigbtn {
        margin-top: -20px;
    }

    .timer-container {
        width: 135px;
        height: 135px;
        position: relative;
        margin: 0px auto;
        font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    }

    .imagenesssss {
        width: 70px;
        height: 70px;
        margin-bottom: 15px;
    }


        /* ==========================================================================
    Inicio Clave de acceso
    ========================================================================== */


    .mega-content{
        max-width: 500px !important;
        margin-bottom: 10px !important;
    }


    .notification {
        max-width: 190px !important;
    }

    .form-control {
        width: 100%;
    }

    label.esp {
        margin-left: 10px;
    }

    .wrapped-CmbClave{
		display: flex;
		column-gap: 3rem;
		margin-top: 46px;
	}

    /* .wrapped-CmbClave {
        display: block;
    } */

    .form-horizontal .esp {
        font-size: 12px;
        margin-top: -36px;
    }
    
    .input-icons-2 {

        padding-right: 0px;
    }


        /* ==========================================================================
    Mensaje de cierre de sesion
    ========================================================================== */

    .modal-content {
        width: 80vw;

    }

    /* ==========================================================================
    Msg error: no podemos continuar  
    ========================================================================== */

    .errorWizard {

        display: flex;
        flex-direction: column;
    }

    .ocultar {
        margin: auto;
    }

    .erbtn10{
        margin-left: 30%!important;
        margin-top: -280px;
    }

    .parraF2 {
        margin-top: -30px;
    }

}