/* ---------------------------------------------------
    MEDIAQUERIES
----------------------------------------------------- */
@media (max-width: 1200px) {
  .signIn-section-inner {
      max-width: 95%;
      height: 80vh;
  }
  .col-signIn {
    flex: 0 0 360px;
}
.signIn-image img {
    object-fit: cover;
}
}
@media (max-width: 991px) {
    .content-block.pe-md-4 {
        padding: 0 !important;
        margin-bottom: 20px;
    }

    .manage-content.border-bottom-0 {
        border-bottom: 1px solid #e4e5e7 !important;
        margin-bottom: 20px;
    }


    .new-servers, .servers-specs {
        grid-template-columns: repeat(3, 1fr);
    }








}
@media (max-width: 767px) {
    #sidebar {
        margin-left: -260px;
    }
    #sidebar.active {
        margin-left: 0;
    }
    #content {
        width: 100%;
    }
    /* #content.active {
        width: calc(100% - 260px);
    } */
    #sidebarCollapse span {
        display: none;
    }
    .header {
    grid-template-columns: 120px auto;
    padding-left: 60px;
    padding-right: 10px;
}
.site-host-grid {
    margin-top: 15px;
    margin-bottom: 15px;
}
    p.support {
        display: none;
    }

    .sidebar-trigger {
        position: absolute;
        left: 0;
        top: 0;
        display: block;
        background-color: transparent;
        border: 0;
        width: 60px;
        padding: 0;
        height: 100%;
    }
    .sidebar-trigger svg {
        color: #fff;
        width: 40px;
        height: 40px;
    }

    .sub-header .col-5 {
        flex: 0 0 auto;
        width: 100%;
    }
    body.overflow div#content::after {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        background-color: #00000094;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }
    .signIn-image{
      display: none;
    }
    .col-signIn {
    flex: 0 0 100%;
}
.signIn-section-inner {
    max-width: 90%;
    height: 85vh;
}
.sub-header {
    padding-left: 0;
    padding-right: 8px;
}
.table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
.manage-tab-content .tab-col {
    flex: 100%;
}
.manage-site-tabs .nav-pills .nav-link {
    padding-left: 30px;
    font-size: 14px;
    padding-right: 0;
}
.manage-site-tabs .nav-pills .nav-link svg {
    left: 6px;
    width: 14px;
}
.manage-site-tabs .nav.flex-column {
    max-width: 130px;
    padding-right: 10px;
    text-align: left;
    margin-right: 10px;
}
.manage-site-header a.btn.btn-primary{
  display: none;
}
#content {
    padding: 10px;
}
.manage-site-header .manage-site-left > ul > li {
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 10px;
}
.manage-site-header .manage-site-left > ul > li > a > svg {
    height: 15px;
    margin-right: 0;
}
.manage-tab-content .d-flex.justify-content-between.align-items-center {
    display: block !important;
}
.manage-content .d-flex.justify-content-between.align-items-center p {
    color: #202223;
    margin-bottom: 20px;
}
.new-servers, .servers-specs {
    grid-template-columns: repeat(2, 1fr);
}
.row.two-factor {
    margin-top: 20px;
}
.barcode-image {
    text-align: center;
    padding-right: 0;
    margin-top: 30px;
}
.server-reflect {
    grid-template-columns: 100%;
    grid-row-gap: 10px;
    color: #fff;
}
.row.mt-5.pt-2.pb-5 {
    padding-bottom: 150px !important;
}
}
@media (max-width: 400px) {
    .main-logo img {
        max-width: 100px;
    }
    .header {
        grid-template-columns: 100px auto;
    }
    .avatar-text {
        font-size: 10px;
        width: 28px;
        height: 28px;
        margin-right: 6px;
    }
    .subheader-right p {
        font-size: 12px;
    }
}
