/* xl */

@media (min-width: 1200px) {
    /* Make Navigation Toggle on Desktop Hover */
    .dropdown:hover .dropdown-menu {
        -webkit-animation: fadeInUp 400ms;
        animation: fadeInUp 400ms;
    }
    .navbar .nav-item .dropdown-menu {
        display: none;
        top: 0;
    }
    .navbar .nav-item:hover .dropdown-menu {
        display: block;
        top: 44px !important;
    }
    .container {
        max-width: 90%;
    }
}

/* lg */

@media (min-width: 992px) and (max-width: 1199px) {
    /* Make Navigation Toggle on Desktop Hover */
    .dropdown:hover .dropdown-menu {
        -webkit-animation: fadeInUp 400ms;
        animation: fadeInUp 400ms;
    }
    .navbar .nav-item .dropdown-menu {
        display: none;
        top: 0;
    }
    .navbar .nav-item:hover .dropdown-menu {
        display: block;
        top: 44px !important;
    }
    #modalNotificationsInbox .notification-list .active:hover p {
        color: #333;
    }
    #modalNotificationsInbox .custom-lists .active p {
        color: #FBFBFD;
    }
    .container {
        max-width: 90%;
    }
}

/* md */

@media (min-width: 768px) and (max-width: 991px) {
    .container {
        padding-right: 15px;
        padding-left: 15px;
        margin-right: auto;
        margin-left: auto;
        max-width: 94%;
    }
    /* Make Navigation Toggle on Desktop Hover */
    .dropdown:hover .dropdown-menu {
        -webkit-animation: fadeInUp 400ms;
        animation: fadeInUp 400ms;
    }
    .navbar .nav-item .dropdown-menu {
        display: none;
        top: 0;
    }
    .navbar .nav-item:hover .dropdown-menu {
        display: block;
        top: 44px !important;
    }
    .navbar-nav>li {
        margin-left: 10px;
    }
    .navbar-collapse {
        padding-left: 0;
        padding-right: 0;
    }
    #modalNotificationsInbox .notification-list .active:hover p {
        color: #333;
    }
    #modalNotificationsInbox .custom-lists .active p {
        color: #FBFBFD;
    }
}

/* sm */

@media (min-width: 576px) and (max-width: 767px) {
    .container {
        padding-right: 0;
        padding-left: 0;
        margin-right: auto;
        margin-left: auto;
        max-width: 96%;
    }
    .navbar .container {
        max-width: 100%;
    }
    .content-page .container .row {
        width: 100%;
        margin: 0;
    }
    .content-page {
        padding-top: 0;
        padding-bottom: 0;
    }
    .navbar-collapse {
        padding-left: 0;
        padding-right: 0;
    }
    .navbar-nav>li {
        padding-bottom: 6px;
        margin-right: 0;
        margin-left: 0;
    }
    .top-bar-icon .navbar-toggle {
        border-color: transparent !important;
        background-color: transparent !important;
        margin: 0;
        border-radius: 0;
        height: 38px;
        padding: 6px;
    }
    .top-bar-icon .navbar-toggle .icon-bar {
        background-color: var(--panelBg) !important;
        height: 4px;
        width: 26px;
        border-radius: 5px;
    }
    .alert-list {
        left: 0 !important;
        top: 12px;
    }
    .navbar-nav .dropdown-menu li a {
        padding-top: 0;
    }
    .btn-submit:focus {
        background-color: var(--buttonBg) !important;
    }
    .btn-submit {
        margin-top: 10px;
    }
    .custom-lists {
        overflow-x: auto;
        height: auto;
        margin-bottom: 12px;
        margin-top: 26px;
    }
    #personal-tooltip.popover,
    #shared-tooltip.popover {
        max-width: 500px !important;
    }
    .custom-lists .list-row {
        display: flex;
        padding: 13px 8px;
        padding-left: 20px !important;
    }
    .navbar-expand-lg .navbar-nav .dropdown-menu {
        box-shadow: none !important;
        border-radius: 0 !important;
        padding-top: 3px;
    }
    .navbar-expand-lg .navbar-nav .dropdown-menu li {
        background-color: #fafafa;
    }
    .navbar-expand-lg .navbar-nav>li>a {
        margin-left: 10px;
    }
}

/* xs */

@media (max-width: 575px) {
    .container {
        max-width: 100%;
    }
    .navbar .container {
        max-width: 100%;
    }
    .navbar {
        min-height: 0;
    }
    .container>.navbar-header,
    .container>.navbar-collapse {
        margin-left: 0;
    }
    .navbar-nav>li {
        padding-bottom: 6px;
        margin-right: 0;
        margin-left: 0;
    }
    .nav-tabs>li.active>a:after {
        display: none;
    }
    #footer .col-sm-6 {
        text-align: center;
    }
    #footer .pull-right {
        float: none !important;
    }
    ul.nav-tabs {
        padding: 0 10px;
    }
    .top-bar-icon .navbar-toggle {
        border-color: transparent !important;
        background-color: transparent !important;
        margin: 0;
        border-radius: 0;
        height: 38px;
        padding: 6px;
    }
    .top-bar-icon .navbar-toggle .icon-bar {
        background-color: var(--panelBg) !important;
        height: 4px;
        width: 26px;
        border-radius: 5px;
    }
    .content-page {
        padding-bottom: 0;
        padding-top: 0;
    }
    .popover.right .arrow {
        display: none !important;
    }
    .alert-list {
        left: 0 !important;
        top: 12px;
    }
    .navbar-nav .dropdown-menu li a {
        padding-top: 5px;
    }
    .btn-submit:focus {
        background-color: var(--buttonBg) !important;
    }
    .btn-submit {
        margin-top: 10px;
    }
    .dropdown-notifications {
        margin-right: 12px;
    }
    .dropdown-view-profile {
        margin-right: 12px;
    }
    .display-name-profile {
        margin-right: 12px;
    }
    .brokerage-login-description {
        margin-bottom: 30px !important;
    }
    .custom-new-record-panel {
        top: 56px;
    }
    .custom-lists .list-row {
        display: flex;
        padding: 13px 8px;
        padding-left: 20px !important;
    }
    .custom-lists {
        overflow-x: auto;
        height: auto !important;
        border: none;
        margin-top: 26px;
        margin-bottom: 12px;
    }
    .notification-list {
        margin-top: 0;
        margin-bottom: 0;
    }
    .custom-loading-sm {
        font-size: 18px;
        font-weight: bold;
        color: var(--fontColor);
        margin-left: 10px;
        z-index: 5;
        margin-top: 3px;
    }
    .custom-loading-lg i {
        font-size: 30px;
        margin-right: 4px;
    }
    .link-group {
        text-align: left;
    }
    #modalNotificationsInbox .notification-date {
        position: absolute;
        top: 46px;
        right: 10px;
    }
    .popover {
        max-width: 97% !important;
        left: 0 !important;
        margin-left: 3px !important;
        margin-right: 3px !important;
    }
    .custom-switch {
        left: 20px;
        margin-top: 0;
        position: initial;
    }
    #modalNotificationsInbox .modal-body .notification-details-panel {
        z-index: 6;
    }
    .custom-card .panel-header {
        padding: 22px 12px;
        font-size: 21px;
    }
    #personal-tooltip.popover.bottom .arrow,
    #shared-tooltip.popover.bottom .arrow {
        left: 90% !important;
    }
    .btn-group-crop .btn {
        margin-right: 20px !important;
    }
    .navbar-expand-lg .navbar-nav .dropdown-menu {
        box-shadow: none !important;
        border-radius: 0 !important;
        padding-top: 3px;
    }
    .navbar-expand-lg .navbar-nav .dropdown-menu li {
        background-color: #fafafa;
    }
    .navbar-expand-lg .navbar-nav>li>a {
        margin-left: 10px;
    }
    #modalNotificationsInbox .modal-dialog {
        max-width: unset;
    }
}