/*
####################################################
M E D I A  Q U E R I E S
####################################################
*/

/*
::::::::::::::::::::::::::::::::::::::::::::::::::::
Bootstrap 4 breakpoints
*/

/*
Extra small devices (portrait phones, less than 576px)
No media query since this is the default in Bootstrap because it is "mobile first"
*/


/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {

}

/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (min-width: 768px) {

}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {

}

@media (min-width: 993px) {
    .nav-tabs-navigation-scroll .nav {
        display: flex !important;
    }
}

@media (min-width: 1025px) {
    a .drift-img {
        cursor: pointer;
    }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

}

@media (min-width: 1500px) {
    .container {
        max-width: 1440px;
    }
}

@media (min-width: 1980px) {
    .container {
        /*max-width: 1770px;*/
    }
}


/*
::::::::::::::::::::::::::::::::::::::::::::::::::::
Custom media queries
*/

/* Set width to make card deck cards 100% width */
@media (max-width: 1499px) {
    .container, .container-sm {
        max-width: 100%;
    }
}

@media (max-width: 1199px) {

    .div-table-body-row {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin: 0;
    }

    .div-table-body .div-table-th,
    .div-table-body .div-table-td {
        display: flex;
        flex: 0 0 50%;
        max-width: 50%;
        margin-top: -1px;
    }

}

@media (max-width: 1024px) {
    .drift-zoom-pane.drift-open, .drift-zoom-pane {
        display: none !important;
    }

    .lightbox-image {
        margin-bottom: 1rem;
    }
}

@media (max-width: 992px) {
    html {
        font-size: 14px;
    }

    .web-app-layout main .main-inner .simplebar-scroll-content {
        margin-top: 0;
        padding-top: 2rem;
    }

    .stage {
        margin-bottom: 0.5rem;
        min-height: 180px;
        max-height: 180px;
    }

    .nav-tabs-navigation-scroll-dropdown {
        display: block;
    }

    .nav-tabs-navigation-scroll-tabs {
        display: none;
    }

    .nav-tabs-navigation-scroll .nav-link {
        text-align: left;
        padding-left: 0;
    }

    .nav-tabs-navigation-scroll .nav {
        padding-bottom: 0.5rem;
    }

    .nav-tabs-navigation-scroll-indicator {
        display: none;
    }

    .side-content-box {
        display: inline-block;
    }
}

@media (max-width: 768px) {
    .stage h1 {
        font-size: 1.2rem;
    }

    .stage h2 {
        font-size: 0.8rem;
    }

    .stage {
        min-height: 80px;
        max-height: 80px;
    }

    .stage-content {
        margin: auto 0 1.5rem;
    }

    .web-app-layout main .main-inner .simplebar-scroll-content {
        padding-top: 1rem;
    }
}

@media (max-width: 576px) {
    .container, .container-sm {
        max-width: 100%;
    }

    .navbar-select label {
        display: none;
    }

    .div-table-body .div-table-th, .div-table-body .div-table-td {

    }
}