/* Update 2.1  */


/* ==>  Medium devices (tablets, 768px and up) */
@media only screen and (min-width: 768px) 
{
    html, body { font-size:16px; }
    .logout-desktop { display: block; }
    .navbar-expand-md .navbar-collapse { position: absolute; top: 0; right: 40px; }
    .login { margin-top:50px; }
    .pages { margin-top:90px; padding:0 35px !important; }
    /* .vimeo-tour { height: 40vh; } */

    .movil { display: block; }
    .desktop { display: none; }

    .logo-windows { 
        width: auto;
        height: 70px;
        margin-top: 35px;
        float: right;
    }
    .vimeo-evento { height: 41vw; }
}

/* ==>  1024 (desktops, 992px and up)  */
@media only screen and (min-width: 1024px) 
{
    html, body { height: 100%; }
    .modal-home .order1 { order:2; }
    .modal-home .order2 { order:1; }

    .navbar-desktop{ display:block; }
    .colorlib-main-nav, .navbar-movil { display: none; }

    .bg-login,
    .bg-app {
        /* background: var(--bg_desktop); */
        background: url('/image/desktop/bg-login.jpg');
        /* background-size: 100% 100%; */
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        background-color: #2d0053;
    }    
    .bg-lobby {
        /* background:var(--bg_movil); */
        background: url('/image/desktop/bg-lobby.jpg');
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        background-color: #2d0053;
        /* background-size: 100% 100% !important; */
    }
    .bg-call {
        background: url('/image/desktop/bg-call.jpg');
        background-repeat:round;
        background-position: top right;
        /* background-size: cover; */
        -webkit-background-size: 100% 100% !important;
        -o-background-size: 100% 100% !important;
        background-size: 100% 100% !important;
        background-color: #2d0053;
    }
    .bg-event {
        background: url('/image/desktop/bg-call.jpg');
        /* background-repeat:round; */
        background-position: top right;
        /* background-size: cover; */
        -webkit-background-size: 100% 100% !important;
        -o-background-size: 100% 100% !important;
        background-size: 100% 100% !important;
        background-color: #2d0053;
        background-repeat: no-repeat;
    }

    .lobby-image{ display: block; }
    .lobby-content { padding:20px 10px; }

    .login { margin-top:0px; }
    .login .logo { width: 60%; }
    .lobby { margin-top:144px; }
    .pages { margin-top:0px; }

    .movil { display: none; }
    .desktop { display: block; }
    
    .login p { padding:2px 0; }
    .login .p-small { font-size: 12px; }
    .login .p-big { font-size: 14px; }
    .form-control::placeholder { font-size:14px;}

    .logo-windows { 
        width: auto;
        height: 80px;
        position: absolute;
        right: 30px;
        bottom: 30px;
    }
    .vimeo-evento { height: 42vw; }
}


/* ==>  1024 x 1366 ( iPad Pro ) */
@media (min-width:1366px) and (height: 1024px)
{
    .vimeo-tour { height: 30vh; margin:0; }
    .modal-home .order1 { order:1 !important; }
    .modal-home .order2 { order:2 !important; }
    .lobby-content { padding:60px 30px; }
    .lobby { margin-top:240px; }
}


/* ==>  1280 x 720 (Laptops, 1280 px)  */
/* @media only screen and (min-width: 1280px) */
@media only screen and (min-width: 1280px) and (max-height:720px)
{      
    .login { margin-top: 20px !important; }

    .logo-header { height: 80px !important; }
    /* --> Vimeo */
    iframe { max-width: 100% !important; background: transparent !important; }
    .vimeo-evento,
    .vimeo-chat { width: 690px !important; height: 389px !important; background: transparent !important; }
    /* .vimeo-chat { width: 92% !important; height: 64vh !important; background: transparent !important; } */

    .pages { margin-top:0; padding:0 100px !important; }
    .login { padding-top:0 !important; margin-top: 0 !important; }
    .login p { text-align: center; }
    .login .logo { width: auto !important; height:130px !important; }
    .login .p-small { font-size: 14px; }

    .form-check .form-check-input { margin-left: 40px; }

    .lobby { margin-top:140px; }
    .modal-home .order1 { order:1 !important; }
    .modal-home .order2 { order:2 !important; }
    .lobby-content { padding: 0px 10px; }
    .simply-countdown{ margin: 0 !important; }

    .logo-header { height: 70px !important; }

    form.user .form-control-user,
    .form-control-sm {
        padding: 0.3rem 0.7rem !important;
    }
    .login .p-small-login,
    .form-control-sm,
    .form-control::placeholder { font-size: 11px; }
    .login .p-password { font-size: 11px; }

    .logo-lenovo { 
        width: auto;
        height: 80px;
        position: absolute;
        right: 0px;
        top: 35px;
    }
    .logo-windows { 
        width: auto;
        height: 80px;
        position: absolute;
        right: 30px;
        bottom: 30px;
    }

    .btn-bee, .btn-success,
    .btn-bee2, .btn-success2 { line-height: 1.5rem !important; border-radius: 5px; }
    .btn-recovery { width:300px; margin: 0 auto !important; margin-top: 20px !important; } 
    
}


@media only screen and (min-width: 1280px) and (max-height:960px)
{
    .login { margin-top: 70px; }
    
    .logo-header { height: 80px !important; }
    /*--> Vimeo */
    iframe { max-width: 100% !important; background: transparent !important; }
    .vimeo-evento,
    .vimeo-chat { width: 690px !important; height: 389px !important; background: transparent !important; }

    .logo-lenovo { 
        width: auto;
        height: 80px;
        position: absolute;
        right: 0px;
        top: 35px;
    }

    .logo-windows { 
        width: auto;
        height: 80px;
        position: absolute;
        right: 30px;
        bottom: 30px;
    }
    .btn-recovery { width:300px; margin: 0 auto !important; margin-top: 20px !important; } 

}


/* ==> 1366 x 768 */
@media only screen and (min-width: 1366px) and (max-height:768px)
{
    .pages { margin-top: 0; }
    .logo-header { height: 40px !important; }
    /* .vimeo-tour{ max-width: 100%; height: 74vh !important; } */

    /* --> Vimeo */
    iframe { max-width: 100% !important; background: transparent !important; }
    .vimeo-evento,
    .vimeo-chat { width: 780px !important; height: 432px !important; background: transparent !important; }
    
    .pages { margin-top:0; padding:0 100px !important; }

    .modal-home .order1 { order:1 !important; }
    .modal-home .order2 { order:2 !important; } 
    /* .label-event { font-size: 18px !important; font-weight: 500; } */
    .simply-countdown{ margin: 0 !important; }

    .logo-header { height: 80px !important; }
    .login { padding-top:10px !important; }
    .login .logo { width: auto !important; height:150px !important; }
}


/* ==> 1366 x 1024 */
/* @media only screen and (min-width: 1366px)  */
@media only screen and (min-width: 1366px) and (max-height:1024px)
{
    .pages { padding-top:0; padding:0 100px !important; }
    .login { padding-top:0; }
    .login .logo { width: auto !important; height:150px !important; }

    form.user .form-control-user,
    .form-control-sm {
        padding: 0.3rem 0.7rem !important;
    }
}

/* ==> 1440 x 900 */
@media only screen and (min-width: 1440px)
{
    .login { padding-top:30px !important; margin-top: 0 !important; }
    .login .logo { height: 180px !important; }
    .lobby { margin-top:240px; }
    .modal-home .order1 { order:1 !important; }
    .modal-home .order2 { order:2 !important; }
    /* .label-event { font-size: 18px !important; font-weight: 500; } */
    .simply-countdown{ margin: 0 !important; }

    .logo-header { height: 90px !important; }

    .login .p-big {
        font-size: 18px;
    }
    .logo-lenovo { 
        width: auto;
        height: 85px;
        position: absolute;
        right: 0px;
        top: 35px;
    }

    .logo-windows { 
        width: auto;
        height: 80px;
        position: absolute;
        right: 30px;
        bottom: 30px;
    }

    .btn-bee, .btn-success,
    .btn-bee2, .btn-success2 { line-height: 2rem !important; border-radius: 5px; }

    iframe { max-width: 100% !important; background: transparent !important; }
    .vimeo-evento,
    .vimeo-chat { width: 900px !important; height: 507px !important; background: transparent !important; }

    
}

/* ==> 1500 and up */
@media only screen and (min-width: 1536px)
{
    /* --> Vimeo */
    iframe { max-width: 100% !important; background: transparent !important; }
    .vimeo-evento,
    .vimeo-chat { width: 900px !important; height: 507px !important; background: transparent !important; }

    .label-event { font-size:26px !important; }
    .event-date { font-size: 20px !important; }

    .login { padding-top:0px !important; margin-top: 0 !important; }
    
    .login p { line-height: 26px; }
    .login .logo { height: 160px !important; margin-top: 40px; }

    .login .p-small-login,
    .form-control-sm,
    .form-control::placeholder { font-size: 14px; }
    .login .p-password { font-size: 14px; }

    .btn-bee, .btn-success,
    .btn-bee2, .btn-success2 { line-height: 2rem !important; }
    
}

/* ==> 1920 and up */
@media only screen and (min-width: 1920px)
{
    /* --> Vimeo */
    iframe { max-width: 100% !important; background: transparent !important; }
    .vimeo-evento,
    .vimeo-chat { width: 1200px !important; height: 675px !important; background: transparent !important; }
    /* .vimeo-chat { width: 1250px !important; height: 705px !important; background: transparent !important; } */

    body {
        font-size: 20px;
    }
    .container-xl, 
    .container-lg, 
    .container-md, 
    .container-sm, 
    .container {
        max-width: 85% !important;
    }
    .navbar { padding: 1rem 2rem; }

    /*:: LOGIN */
    .login{ margin-top: 50px; }
    .login .logo { width: auto; height: 245px !important; }

    
    
    /* :: Pages */  
    .pages { margin-top:15px; padding:0 100px !important; }
    .modal-xl { max-width: 1500px; }
    .modal-home .owl-item .item img {
        width: 100% !important;
        height:150px !important; 
    }

    /* :: PAGE ZOOM */
    .meeting-client{ top:0 !important; height: 100% !important; }
    .bhold { margin-top: 0 !important; }

    .lobby-content { padding: 0px 40px; }

    .login .p-big { font-size: 22px; }
    .login .p-password { font-size: 14px; }

    .login p { line-height: 25px; }
    
    .form-check-label { margin-left: -20px;}
    .login .p-small-login,
    .form-control-sm,
    .form-control::placeholder { font-size: 16px; }
    .login .p-password { font-size: 16px; }
    .login .btn,
    .form-check-label { font-size: 15px; }

    .btn-sm, .btn-group-sm > .btn {
        --bs-btn-padding-y: 0.375rem;
        --bs-btn-padding-x: 0.75rem;
        --bs-btn-font-size: 1rem;
        --bs-btn-border-radius: 0.3rem;
    }

    .logo-windows { height: 110px; }

    .login .p-small {
        font-size: 18px;
    }

    .btn-call,
    .btn-call:link,
    .btn-call:visited { font-size: 18px; }
    .btn-recovery { width:400px; margin: 0 auto !important; margin-top: 20px !important; } 


}


/* ==> 1920 and up */
@media only screen and (min-width: 2560px)
{
    .login .logo { height: 345px !important; }

}