/*
 * Dandelion Admin v2.0 - Core Stylesheet
 *
 * This file is part of Dandelion Admin, an Admin template build for sale at ThemeForest.
 * For questions, suggestions or support request, please mail me at maimairel@yahoo.com
 *
 * Development Started:
 * March 25, 2012
 * Last Update:
 * December 07, 2012
 *
 */

/* Colors
================================================== */

.da-highlight {
    color: #d44d24;
}

::-webkit-input-placeholder {
    color: #999;
}

:-moz-placeholder {
    color: #999;
}

.placeholder {
    color: #999;
}

/* Selection Colors
================================================== */

::-moz-selection {
    color: #fff;
    background: #a9ca60;
}

::selection {
    color: #fff;
    background: #a9ca60;
}

/* HTML & Body
================================================== */

html, body {
    height: 100%;
}

body {
    background-color: #f2f2f2;
    padding: 0;
}

/* Main Wrapper
================================================== */

#da-wrapper {
    min-height: 100%;
    position: relative;
    min-width: 320px;
    width: 100%;
}

#da-wrapper .da-container {
    width: 96%;
    margin: auto;
}

#da-wrapper.fixed {
    min-width: 960px;
}

#da-wrapper.fixed .da-container {
    width: 960px;
}

/* Header
================================================== */

#da-header {
    z-index: 200;
    position: relative;
    margin-bottom: 20px;
}

/* Top Header
================================================== */

#da-header-top {
    position: relative;
}

#da-logo-wrap {
    float: left;
}

#da-logo {
    width: 230px;
    height: 55px;
    display: table-cell;
    vertical-align: middle;
}

#da-logo-img a,
#da-logo-img span {
    display: block;
}

#da-logo-img a img,
#da-logo-img span img {
    max-width: 222px;
    max-height: 100px;
    vertical-align: top;
}

/* Top Header Toolbar
================================================== */

#da-header-toolbar {
    float: right;
    border-left: 1px solid #161616;
    border-left: 1px solid rgba(0, 0, 0, 0.6);
}

#da-user-profile-wrap,
#da-header-button-container {
    float: left;
    position: relative;
}

#da-user-profile-wrap {
    border-left: 1px solid #535353;
    border-left: 1px solid rgba(255, 255, 255, 0.2);
    border-right: 1px solid #161616;
    border-right: 1px solid rgba(0, 0, 0, 0.6);
    cursor: pointer;
    height: 100px;
}

#da-user-profile {
    padding: 20px 24px 0 12px;
}

#da-user-profile:before {
    font-family: 'caret';
    content: "\f0d7";
    color: #fff;
    width: 12px;
    height: 12px;
    line-height: 12px;
    text-align: center;
    position: absolute;
    right: 6px;
    top: 50%;
    margin-top: -6px;
}

#da-user-avatar,
#da-user-info {
    float: left;
}

#da-user-avatar {
    height: 32px;
    padding: 12px 0;
    margin-right: 12px;
}

#da-user-avatar img {
    max-width: 32px;
    max-height: 32px;
}

#da-user-info {
    font-size: 12px;
    color: #fff;
    line-height: 1;
    padding: 13px 0;
    font-weight: bold;
    position: relative;
}

#da-user-info .da-user-title {
    color: #eaeaea;
    font-size: 11px;
    margin-top: 6px;
    font-weight: normal;
    display: block;
}

/* Top Header Buttons
================================================== */

#da-header-button-container {
    border-left: 1px solid #535353;
    border-left: 1px solid rgba(255, 255, 255, 0.2);
    padding: 30px 0;
}

#da-header-button-container > ul,
#da-header-button-container > ul > li {
    margin: 0;
    padding: 0;
    list-style: none;
}

#da-header-button-container .da-header-button-wrap {
    float: left;
    position: relative;
    margin-left: 8px;
}

#da-header-button-container .da-header-button-wrap .da-header-button {
    display: block;
    width: 36px;
    height: 36px;
    background: url(../images/toolbar-button.png) no-repeat center top;
}

#da-header-button-container .da-header-button-wrap .da-header-button:active {
    background-position: center bottom;
}

#da-header-button-container .da-header-button-wrap .da-header-button a {
    text-decoration: none;
    display: block;
    margin: auto;
    cursor: pointer;
    width: 36px;
    height: 36px;
    outline: none;
    text-align: center;
}

#da-header-button-container .da-header-button-wrap .da-header-button a [class^="icon-"],
#da-header-button-container .da-header-button-wrap .da-header-button a [class*=" icon-"] {
    color: #fff;
    line-height: 36px;
}

#da-header-button-container .da-header-button-wrap .da-header-button .btn-count {
    position: absolute;
    color: #fff;
    left: 100%;
    margin-left: -12px;
    top: -4px;
    font-size: 10px;
    display: block;
    padding: 4px;
    line-height: 1;
    z-index: 250;
    min-width: 10px;
    text-align: center;
    background: #e15656;
    border: 1px solid #900;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
    -webkit-border-radius: 9px;
    -moz-border-radius: 9px;
    border-radius: 9px;
}

#da-header-button-container .da-header-button-wrap .da-header-button.active .btn-count {
    top: -3px;
}

#da-header-toolbar .dropdown-menu:before {
    position: absolute;
    top: -7px;
    left: 9px;
    display: inline-block;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #ccc;
    border-left: 7px solid transparent;
    border-bottom-color: rgba(0, 0, 0, 0.2);
    content: '';
}

#da-header-toolbar .dropdown-menu:after {
    position: absolute;
    top: -6px;
    left: 10px;
    display: inline-block;
    border-right: 6px solid transparent;
    border-bottom: 6px solid #fff;
    border-left: 6px solid transparent;
    content: '';
}

#da-header-toolbar .dropdown-menu.pull-right:before {
    left: auto;
    right: 9px;
}

#da-header-toolbar .dropdown-menu.pull-right:after {
    left: auto;
    right: 10px;
}

#da-header-toolbar .dropdown-menu .da-dropdown-sub-title {
    font-size: 14px;
    line-height: 1;
    display: block;
    font-weight: bold;
    padding: 10px 15px;
}

#da-header-toolbar .dropdown-menu .da-dropdown-sub-footer {
    padding-top: 8px;
    padding-bottom: 8px;
    border-top: 1px solid #ddd;
}

#da-header-toolbar .dropdown-menu .da-dropdown-sub {
    margin: 0;
    padding: 0;
    list-style: none;
}

#da-header-toolbar .dropdown-menu .da-dropdown-sub li > a {
    padding: 8px 15px;
    line-height: 1;
    border-bottom: 1px solid #fff;
    border-top: 1px solid #e9e9e9;
    *zoom: 1;
}

#da-header-toolbar .dropdown-menu .da-dropdown-sub li > a:before,
#da-header-toolbar .dropdown-menu .da-dropdown-sub li > a:after {
    display: table;
    content: "";
    line-height: 0;
}

#da-header-toolbar .dropdown-menu .da-dropdown-sub li > a:after {
    clear: both;
}

#da-header-toolbar .dropdown-menu .da-dropdown-sub-footer:hover,
#da-header-toolbar .dropdown-menu .da-dropdown-sub li > a:hover {
    border-color: #84a637;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

#da-header-toolbar .dropdown-menu .da-dropdown-sub .thumbnail {
    width: 48px; height: 48px;
    float: left;
    padding: 2px;
    background-color: #fff;
    margin-right: 8px;
}

#da-header-toolbar .dropdown-menu .da-dropdown-sub .info {
    display: block;
    overflow: hidden;
}

#da-header-toolbar .dropdown-menu .da-dropdown-sub .name,
#da-header-toolbar .dropdown-menu .da-dropdown-sub .message,
#da-header-toolbar .dropdown-menu .da-dropdown-sub .time {
    display: block;
    font-size: 11px;
}

#da-header-toolbar .dropdown-menu .da-dropdown-sub .name {
    font-weight: bold;
    margin-bottom: 8px;
}

#da-header-toolbar .dropdown-menu .da-dropdown-sub .message {
    max-width: 240px;
    overflow: hidden;
    margin-bottom: 6px;
    text-overflow: ellipsis;
}

#da-header-toolbar .dropdown-menu .da-dropdown-sub li > a:hover .time {
    color: #fff;
}

#da-header-toolbar .dropdown-menu .da-dropdown-sub .time {
    color: #999;
}

/* Bottom Header
================================================== */

#da-header-bottom {
    background: url(../images/header-bottom.png) repeat-x left top;
    padding-bottom: 9px;
}

/* Search
================================================== */

#da-search {
    float: left;
    width: 180px;
    padding-top: 9px;
    padding-bottom: 5px;
    position: relative;
}

#da-search .search-query {
    width: 100%;
    background-color: #f0f0f0;
    background-image: url(../images/search-icon.png);
    background-repeat: no-repeat;
    background-position: right center;
    border-color: #cecece;
    padding: 4px 12px;
    padding-right: 24px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}

#da-search input[type="text"]:focus {
    background-color: inherit;
}

/* Breadcrumbs
================================================== */

#da-breadcrumb {
    margin-left: 250px;
}

#da-breadcrumb ul,
#da-breadcrumb ul li {
    margin: 0;
    padding: 0;
    list-style: none;
}

#da-breadcrumb ul li {
    display: inline-block;
    *display: inline;
    *zoom: 1;
    padding: 8px 0 9px;
    position: relative;
    margin-right: 24px;
}

#da-breadcrumb li [class^="icon-"],
#da-breadcrumb li [class*=" icon-"] {
    margin-right: 3px;
    font-size: 14px;
}

#da-breadcrumb li a,
#da-breadcrumb li span {
    text-decoration: none;
    color: #444;
    line-height: 16px;
}

#da-breadcrumb li span {
    cursor: default;
}

#da-breadcrumb .active {
    border-top: 5px solid #a9ca60;
}

#da-breadcrumb .active:after,
#da-breadcrumb .active:before {
    content: '';
    left: 50%;
    position: absolute;
    border: solid transparent;
}

#da-breadcrumb .active:after {
    border-width: 9px;
    border-top-color: #fff;
    bottom: -18px;
    margin-left: -9px;
}

#da-breadcrumb .active:before {
    border-width: 10px;
    border-top-color: #bbb;
    bottom: -20px;
    margin-left: -10px;
}

/* Main Content
================================================== */

#da-content {
    clear: both;
    padding-bottom: 59px; /* sticky footer needs this padding */
}

/* Sidebar Separator
================================================== */

#da-sidebar-separator {
    position: absolute;
    left: 180px;
    width: 50px;
    margin-left: 2%;
    top: 0;
    bottom: 0;
    background: url(../images/container-separator.png) repeat-y center top;
}

.fixed #da-sidebar-separator {
    left: 50%;
    margin-left: -300px;
}

/* Sidebar
================================================== */

#da-sidebar {
    position: relative;
    float: left;
    z-index: 150;
    width: 180px;
}

#da-sidebar-toggle {
    display: none;
}

#da-sidebar .btn-container {
    padding: 2px;
    border: 1px solid #cacaca;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 0 #fff;
    -moz-box-shadow: inset 0 1px 0 #fff;
    box-shadow: inset 0 1px 0 #fff;
    background-color: #fff;
    background-image: linear-gradient(bottom, #fff 0%, #f1f1f1 100%);
    background-image: -o-linear-gradient(bottom, #fff 0%, #f1f1f1 100%);
    background-image: -moz-linear-gradient(bottom, #fff 0%, #f1f1f1 100%);
    background-image: -webkit-linear-gradient(bottom, #fff 0%, #f1f1f1 100%);
    background-image: -ms-linear-gradient(bottom, #fff 0%, #f1f1f1 100%);
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #fff), color-stop(1, #f1f1f1));
}

/* Main Navigation
================================================== */

#da-main-nav ul,
#da-main-nav ul li {
    margin: 0;
    padding: 0;
    list-style: none;
    display: block;
}

#da-main-nav a,
#da-main-nav span {
    display: block;
    color: #444;
    outline: none;
    position: relative;
    text-decoration: none;
}

#da-main-nav > ul {
    border: 1px solid #cacaca;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

#da-main-nav > ul > li > a,
#da-main-nav > ul > li > span {
    padding: 18px 32px 18px 48px;
    background: #fdfdfd url(../images/menu-bulb-off.png) right center no-repeat;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #cbcbcb;
    -webkit-box-shadow: inset 0 1px 0 #fff;
    -moz-box-shadow: inset 0 1px 0 #fff;
    box-shadow: inset 0 1px 0 #fff;
}

#da-main-nav > ul > li.active > a,
#da-main-nav > ul > li.active > span {
    background-image: url(../images/menu-bulb-on.png);
}

#da-main-nav > ul > li:first-child > a,
#da-main-nav > ul > li:first-child > span {
    border-top: 0;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
}

#da-main-nav > ul > li:last-child > a,
#da-main-nav > ul > li:last-child > span {
    border-bottom: 0;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px;
}

#da-main-nav > ul > li .da-nav-count {
    position: absolute;
    left: 0;
    top: -1px;
    font-size: 10px;
    line-height: 1;
    text-align: center;
    background: #f0f0f0;
    border: 1px solid #bbb;
    min-width: 10px;
    padding: 2px 4px;
    border-left: 0;
    border-top: 0;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.25);
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.25);
    -webkit-border-radius: 0 0 2px 0;
    -moz-border-radius: 0 0 2px 0;
    border-radius: 0 0 2px 0;
}

#da-main-nav > ul > li .da-nav-icon {
    width: 32px;
    height: 32px;
    position: absolute;
    left: 8px;
    top: 50%;
    text-align: center;
    margin-top: -16px;
}

#da-main-nav > ul > li .da-nav-icon [class*="icon-"] {
    text-align: center;
    line-height: 32px;
    font-size: 21px;
}

/* Sub Navigation
================================================== */

#da-main-nav ul ul {
    background-color: #e9e9e9;
    -webkit-box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.015);
    -moz-box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.015);
    box-shadow: inset 0 2px 0 rgba(0, 0, 0, 0.015);
    border-bottom: 1px solid #cacaca;
}

#da-main-nav ul ul.closed {
    display: none;
}

#da-main-nav ul ul li {
    font-size: 12px;
}

#da-main-nav ul ul li:hover {
    background-color: #dadada;
}

#da-main-nav ul ul li a,
#da-main-nav ul ul li span {
    padding: 6px 0;
    padding-left: 48px;
}

/* Main Container
================================================== */

#da-content-wrap {
    margin-left: 250px;
    padding-bottom: 20px;
}

#da-content-area {
    float: left;
    width: 100%;
}

/* Footer
================================================== */

#da-footer {
    background: #fff;
    border-top: 1px solid #d0d0d0;
    padding: 20px 0;
    text-align: center;
    position: absolute;
    bottom: 0;
    width: 100%;
}

#da-footer p {
    margin: 0;
}

/* Media Queries
================================================== */

/* Smaller than 1024px
 *
 * 1. Ignore fixed layout
 *
================================================== */

@media only screen and (max-width: 1023px) {

    /* Main Container
    ================================================== */

    #da-wrapper.fixed {
        min-width: 0;
    }

    #da-wrapper.fixed .da-container {
        width: 96%;
    }
}

/*
 * 1. Move breadcrumb's position
 * 2. Resize sidebar menu
 *
================================================== */

@media only screen and (min-width: 481px) and (max-width: 979px) {
    /* Search
    ================================================== */

    #da-search {
        width: 115px;
    }

    /* Breadcrumbs
    ================================================== */

    #da-breadcrumb {
        margin-left: 165px;
    }

    /* Sidebar
    ================================================== */

    #da-sidebar {
        width: 115px;
    }

    #da-sidebar-separator,
    #da-wrapper.fixed #da-sidebar-separator {
        left: 115px;
    }

    #da-wrapper.fixed #da-sidebar-separator {
        margin-left: 2%;
    }

    /* Main Navigation
    ================================================== */

    #da-main-nav > ul > li .da-nav-icon {
        position: relative;
        width: auto;
        height: auto;
        left: auto;
        top: auto;
        text-align: center;
        margin: 0 0 4px 0;
    }

    #da-main-nav > ul > li .da-nav-icon [class*="icon-"] {
        font-size: 28px;
    }

    #da-main-nav > ul > li > a,
    #da-main-nav > ul > li > span {
        padding: 16px;
        text-align: center;
        background-position: right top;
    }

    #da-main-nav ul ul li a,
    #da-main-nav ul ul li span {
        padding: 6px 0;
        text-align: center;
    }

    /* Main Container
    ================================================== */

    #da-content-wrap {
        margin-left: 165px;
    }
}

/*
 * 1. Remove user avatar's margin
 * 2. Hide username
 *
================================================== */

@media only screen and (max-width: 767px) {
    #da-user-avatar {
        margin: 0;
    }

    #da-user-info {
        display: none;
    }
}

/*
 * 1. Remove margins on all container
 * 2. Center header logo
 * 3. Fix positions for header toolbar
 * 4. Move header dropdown menu's caret position
 * 5. Hide search
 * 6. Hide breadcrumbs
 * 7. Hide sidebar separator
 * 8. Hide main navigation, make it collapsible
 * 9. Hide customizer
 *
================================================== */

@media only screen and (max-width: 480px) {

    /* Main Container
    ================================================== */

    #da-wrapper .da-container {
        width: 100%;
    }

    /* Header
    ================================================== */

    #da-header {
        margin: 0;
    }

    #da-header-bottom {
        height: auto;
        padding: 0;
    }

    #da-logo-wrap {
        float: none;
        position: absolute;
        width: 100%;
        height: 55px;
        border-bottom: 1px solid #161616;
    }

    #da-logo {
        position: absolute;
        left: 50%;
        text-align: center;
        margin-left: -115px;
    }

    /* Header Toolbar
    ================================================== */

    #da-header-toolbar {
        border: 0;
        float: none;
        display: block;
        margin-top: 56px;
        border-top: 1px solid #535353;
    }

    #da-user-profile-wrap {
        border: 0;
        margin-left: 8px;
        float: left;
    }

    #da-user-profile {
        padding: 0 24px 0 0;
    }

    #da-header-button-container {
        border: 0;
        margin-right: 8px;
        float: right;
    }

    /* Search
    ================================================== */

    #da-search {
        display: none;
    }

    /* Breadcrumbs
    ================================================== */

    #da-breadcrumb {
        display: none;
    }

    /* Sidebar
    ================================================== */

    #da-sidebar-separator {
        display: none;
    }

    #da-sidebar {
        float: none;
        width: auto;
        margin-bottom: 15px;
    }

    #da-sidebar-toggle {
        display: block;
        height: 40px;
        width: 100%;
        position: relative;
        cursor: pointer;
        background: url(../images/header-bottom.png) repeat-x left top;
        border-bottom: 1px solid #cbcbcb;
    }

    #da-sidebar-toggle:after,
    #da-sidebar-toggle:before {
        content: '';
        width: 16px;
        border-bottom: 1px solid #777;
        position: absolute;
        left: 50%; margin-left: -8px;
        top: 50%;
    }

    #da-sidebar-toggle:after {
        border-top: 1px solid #777;
        height: 2px;
        margin-top: -1px;
    }

     #da-sidebar-toggle:before {
        margin-top: 5px;
     }

    #da-main-nav.btn-container {
        width: 100%;
        padding: 0;
        background: none;
        border: 0;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;
        -webkit-box-shadow: 0;
        -moz-box-shadow: 0;
        box-shadow: 0;
    }

    #da-main-nav > ul {
        border: 0;
        padding-bottom: 5px;
        background-color: #fff;
        border-bottom: 1px solid #d0d0d0;
        -webkit-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.03);
        -moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.03);
        box-shadow: 0 2px 0 rgba(0, 0, 0, 0.03);
    }

    #da-main-nav > ul,
    #da-main-nav > ul > li,
    #da-main-nav > ul > li:last-child,
    #da-main-nav > ul > li:first-child {
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;
    }

    #da-main-nav > ul > li:last-child {
        border-bottom: 1px solid #d0d0d0;
    }

    /* Main Navigation
    ================================================== */

    #da-main-nav {
        display: none;
        top: 41px;
    }

    #da-main-nav.open {
        display: block;
    }

    /* Main Content
    ================================================== */

    #da-content {
        margin-top: auto;
    }

    /* Main Container
    ================================================== */

    #da-content-wrap {
        margin: 0 2%;
    }

    /* Customizer
    ================================================== */

    #da-customizer {
        display: none;
    }
}