#wrapper {
    width: 100%;
}
#page-wrapper {
    padding:5em 2em 2.5em;
	background-color: #F1F1F1;
}
.navbar-top-links {
    margin-right: 0;
}

.navbar-top-links li {
    display: inline-block;
}

.navbar-top-links li:last-child {
    margin-right: 15px;
}

.navbar-top-links li a {
    padding: 15px;
    min-height: 50px;
}

.navbar-top-links .dropdown-menu li {
    display: block;
}

.navbar-top-links .dropdown-menu li:last-child {
    margin-right: 0;
}

.navbar-top-links .dropdown-menu li a {
    padding: 3px 20px;
    min-height: 0;
}

.navbar-top-links .dropdown-menu li a div {
    white-space: normal;
}

.navbar-top-links .dropdown-messages,
.navbar-top-links .dropdown-tasks,
.navbar-top-links .dropdown-alerts {
    width: 310px;
    min-width: 0;
}
.navbar-top-links .dropdown-messages {
    margin-left: 5px;
}
.navbar-top-links .dropdown-tasks {
    margin-left: -59px;
}

.navbar-top-links .dropdown-alerts {
    margin-left: -123px;
}

.navbar-top-links .dropdown-user {
    right: 0;
    left: auto;
}

.sidebar .sidebar-nav.navbar-collapse {
    padding-right: 0;
    padding-left: 0;
}

.sidebar .sidebar-search {
    padding: 15px;
}
.sidebar .arrow {
    float: right;
}

.sidebar .fa.arrow:before {
    content: "\f105";
}

.sidebar .active>a>.fa.arrow:before {
    content: "\f107";
}

.sidebar .nav-second-level li,
.sidebar .nav-third-level li {
    border-bottom: 0!important;
	margin-bottom: 0;
}

.sidebar .nav-second-level li a {
	padding:10px 0;
    padding-left: 65px;
    font-size: .9em;
}
.sidebar .nav-third-level li a {
    padding-left: 52px;
}

#addUserForm #country_code,
#addSubAdminForm #country_code,#country_code {
    width: 100%;
    height: auto;
    border: 0px;
    /* border-radius: 10px; */
    padding: 0px;
    padding-left: 85px;
}
.header-left {
    transition: .5s all;
    -webkit-transition: .5s all;
    -moz-transition: .5s all;
}
body.cbp-spmenu-push.cbp-spmenu-push-toright .header-left {
    margin-left: 2% !important;
}
.form-control .iti__selected-flag {
    padding-left: 0px;
    background: none !important;
}



@media (max-width: 1366px){
    /*.header-left {
        margin-left: 19%;
    }*/
}

@media(min-width:768px){
    .navbar-top-links .dropdown-messages,
    .navbar-top-links .dropdown-tasks,
    .navbar-top-links .dropdown-alerts {
        margin-left: auto;
    }

    /* ------------------------------------------------------------------
       Desktop sidebar scroll fix
       ------------------------------------------------------------------
       The admin sidebar is a long list of menu items. On a MacBook 14-inch
       (1512x982 logical) the viewport is roughly 830-870px tall after browser
       chrome, while the menu needs about 990px. The overflow sat outside a
       position:fixed element, so it could not be reached by scrolling the
       page - only by zooming out.

       The structure is:

           aside.sidebar-left          <- flex column, full viewport height
             nav.navbar                <- wrapper, must relay the constraint
               div.navbar-header       <- logo, natural height
               div.navbar-collapse     <- menu, scrolls

       The nav wrapper is the important part. Flex item properties only apply
       to DIRECT children, so styling .navbar-header / .navbar-collapse while
       nav.navbar sat between them and the flex container had no effect: nav
       kept height:auto, grew to its content, and .navbar-collapse never had a
       constrained height to overflow. Making nav both a flex item and a flex
       container completes the chain.
       ------------------------------------------------------------------ */
    .sidebar-left {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .sidebar-left > .navbar {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        /* Lets the nav shrink below its content height so the menu can scroll
           instead of pushing past the bottom of the viewport. */
        min-height: 0;
        /* Bootstrap's .navbar margin-bottom would waste 20px of an already
           short viewport and leave a gap under the menu. */
        margin-bottom: 0;
    }

    .sidebar-left .navbar-header {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }

    .sidebar-left .navbar-collapse {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        /* Bootstrap sets overflow: visible !important on .navbar-collapse.collapse.
           custom.js strips the "collapse" class above 768px so that rule usually
           does not apply, but !important here keeps the menu scrollable even in
           the moment before that script runs. */
        overflow-y: auto !important;
        overflow-x: hidden !important;
        min-height: 0;
    }
}