﻿/*overriding  the padding left for base */
#base {
    /*padding-left: 0 ;*/ word-wrap: break-word;
}

input[type="search"] {
    box-sizing: border-box;
}

body {
    font-family: 'Roboto';
    background: #fff;
}

.menuBtn {
    background-color: transparent;
    border: none;
    height: 38px;
    margin: 16px 0 0 16px;
    width: 36px;
}

md-toolbar h1 {
    font-weight: normal;
}

md-list .md-button {
    color: inherit;
    font-weight: 500;
    text-align: left;
    width: 100%;
}

.margin-right-sm {
    margin-right: 5px;
}

.margin-right-md {
    margin-right: 10px;
}

.margin-md {
    margin: 15px;
}

.margin-sm {
    margin: 5px;
}

.margin-top-md {
    margin-top: 15px !important;
}

.margin-top-30 {
    margin-top: 30px;
}

.margin-top-25 {
    margin-top: 25px;
}

.section-body:first-child {
    margin-top: 12px;
}
/* Using Data-URI converted from svg until <md-icon> becomes available 
https://github.com/google/material-design-icons
*/
textarea {
    resize: vertical;
}

section.section-account .img-backdrop {
    background-position: center top;
}

.menuBtn {
    background: transparent url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMjRweCIgaGVpZ2h0PSIyNHB4IiB2aWV3Qm94PSIwIDAgMjQgMjQiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDI0IDI0IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGcgaWQ9IkhlYWRlciI+CiAgICA8Zz4KICAgICAgICA8cmVjdCB4PSItNjE4IiB5PSItMjIzMiIgZmlsbD0ibm9uZSIgd2lkdGg9IjE0MDAiIGhlaWdodD0iMzYwMCIvPgogICAgPC9nPgo8L2c+CjxnIGlkPSJMYWJlbCI+CjwvZz4KPGcgaWQ9Ikljb24iPgogICAgPGc+CiAgICAgICAgPHJlY3QgZmlsbD0ibm9uZSIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0Ii8+CiAgICAgICAgPHBhdGggZD0iTTMsMThoMTh2LTJIM1YxOHogTTMsMTNoMTh2LTJIM1YxM3ogTTMsNnYyaDE4VjZIM3oiIHN0eWxlPSJmaWxsOiNmM2YzZjM7Ii8+CiAgICA8L2c+CjwvZz4KPGcgaWQ9IkdyaWQiIGRpc3BsYXk9Im5vbmUiPgogICAgPGcgZGlzcGxheT0iaW5saW5lIj4KICAgIDwvZz4KPC9nPgo8L3N2Zz4=) no-repeat center center;
}

.dvloader {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 99999;
    background: rgba(0, 0, 0, 0.5);
    color: #fff;
}

.global-loader {
    position: fixed;
    z-index: 9999;
    top: 50%;
    left: 50%;
    width: 48px;
    height: 48px; /*background:url('../images/ajax-loader.gif');*/
}


/* manish css */
/*table.table thead tr th, table.table tbody tr td { vertical-align: top; padding: 5px;  }*/
#menubar {
    width: 68px;
}

    #menubar::before {
        box-shadow: none;
    }

.btn-default-bright {
    background: none;
    color: #fff;
}

#footer {
    left: 0 !important;
    z-index: 1007;
    height: 54px;
}

.section-floating-action-row .card .card-head .btn {
    position: static;
}
/* header css */

/* Global Css remove header footer top nav space */
.no-leftNavbar #base {
    padding-left: 0;
}

.no-leftNavbar .btn-icon-toggle.menubar-toggle {
    display: none;
}
/* md-grid-list css */
md-grid-list md-grid-tile {
    overflow: hidden;
}

    md-grid-list md-grid-tile .compare-btn {
        display: block;
    }


md-grid-tile-footer {
    height: auto !important;
    padding: 5px 10px 15px 10px;
}

    md-grid-tile-footer p {
        line-height: normal;
    }

figcaption {
    width: 100%;
}

/* full images css */
.full-img {
    display: block;
    width: 100%;
}

    .full-img img {
        width: 100%;
    }

.product-img {
    max-width: 100%;
    max-height: 100%;
    width: 100%;
}

.img-agerating {
    height: 50px;
    display: inline-block;
}

.headerbar .btn-danger, .headerbar .btn-danger:hover, .headerbar .btn-danger:focus, .headerbar .btn-accent, .headerbar .btn-accent:hover, .headerbar .btn-accent:focus, .headerbar .open .dropdown-toggle.btn-danger, .headerbar .btn-warning, .headerbar .btn-warning:hover,
.headerbar .btn-warning :focus, .headerbar .open .dropdown-toggle.btn-warning {
    border: none;
}

#header .headerbar .btn-danger:hover, #header .headerbar .btn-danger:focus #header .headerbar .open .btn-danger:focus, #header .headerbar .open .btn-danger:focus {
    border: none;
    background: rgba(244, 67, 54, 0.9);
}

.headerbar .btn-warning:hover, .headerbar .btn-warning:focus {
    border: none;
    background: rgba(255, 152, 0, 0.9);
}

.headerbar .btn-info:hover, .headerbar .btn-info:focus {
    background: rgba(33, 150, 243, 0.9);
}


#menubar .gui-controls > li {
    margin-bottom: 5px;
}

.menubar-visible .gui-controls > li:not(.gui-folder) > a:hover,
.menubar-pin .gui-controls > li:not(.gui-folder) > a:hover, .gui-icon:hover {
    background-color: #8bc34a;
}

.gui-controls > li > a:hover .title {
    color: #fff !important;
}

.gui-controls > li > a .title {
    width: 70%;
    margin-left: 0;
    white-space: normal;
    word-wrap: break-word;
}

.gui-controls > li > a .gui-icon {
    left: 0;
}

.gui-controls li a {
    margin: 0 2%;
    height: 47px;
    display: table;
    width: 95%;
    padding: 2px 0;
}

#menubar .gui-controls > li:not(.gui-folder) > a {
    border: 1px solid #d5d5d5;
}
/* menubar inverse style */
#menubar.menubar-inverse .gui-controls > li:not(.gui-folder) > a {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.15);
}

    #menubar.menubar-inverse .gui-controls > li:not(.gui-folder) > a:hover,
    #menubar.menubar-inverse .gui-controls > li.activecategory:not(.gui-folder) > a {
        background: #fff;
    }

#menubar.menubar-inverse .gui-controls li a:hover .title, #menubar.menubar-inverse .gui-controls li.activecategory a .title {
    color: #000 !important;
}

#menubar.menubar-inverse .gui-controls li a .title {
    text-shadow: none;
    color: rgba(255, 255, 255, 0.85);
}
/*#menubar.menubar-inverse .gui-controls > li:not(.gui-folder) > a:hover { background: rgba(255, 255, 255, 0.15); border: 1px solid rgba(255, 255, 255, 0.25);  }*/

/* menubar inverse style */

#menubar .gui-controls > li.activecategory a {
    background-color: #8bc34a;
}

    #menubar .gui-controls > li.activecategory a .title {
        color: #fff;
    }

#menubar .gui-controls li a .menu-icon {
    height: 44px;
    width: 55px;
}

#menubar .gui-controls li a .menu-text {
    width: 75%;
}

#menubar .gui-controls li a .menu-icon, #menubar .gui-controls li a .menu-text {
    position: static;
    background-color: transparent;
    display: table-cell;
    vertical-align: middle;
}


.back-icon {
    background-position: -430px -7px;
    width: 42px;
    height: 45px;
    display: block;
}

.fixed-pos {
    position: fixed;
    left: 5px;
    top: 13px;
    z-index: 9999;
}

    .fixed-pos.top {
        top: 0;
    }

    .fixed-pos.bottom {
        bottom: 0;
        top: auto;
    }

#toast-container.fixed-pos.top {
    top: 10px;
    left: 15px;
}

.absoluateDiv {
    position: absolute;
    z-index: 999;
}

    .absoluateDiv.right25 {
        right: 25px;
    }

/*.header-nav-options .dropdownscroll  { max-height: 400px; }*/
/*Auto complete*/
.header-nav .form-group {
    position: static;
}

.header-nav .navbar-search .dropdown-menu {
    position: absolute;
    top: 96%;
}

.dropdown-menu li a {
    clear: both;
    color: #313534;
    display: block;
    font-weight: normal;
    line-height: 1.84615;
    padding: 3px 15px;
    white-space: nowrap;
}

    .dropdown-menu li a.alert {
        margin: 5px 10px;
    }

.dropdown-menu ul {
    list-style: none;
}

.navbar-search .form-group {
    overflow: visible;
}

#footer .input-group-content.dropup {
    position: static;
}

.autocomplete-dropdown {
    border-radius: 0;
    border-top: 1px solid #ececec;
    padding: 6px 0;
    cursor: pointer;
    z-index: 999999;
    margin-top: 0px;
    width: 100%;
    float: left;
    display: block;
    background-color: #ffffff;
    max-height: 415px;
    overflow: auto;
}

    .autocomplete-dropdown a {
        color: #000;
    }

.autocomplete-searching {
    color: #acacac;
    font-size: 14px;
}

.autocomplete-description {
    font-size: 14px;
}

.autocomplete-dropdown h4 {
    font-size: 1.2em;
    padding: 5px 10px;
    margin: 0 -7px;
    background: #6c6a6a !important;
    color: #fff;
}

.autocomplete-row {
    margin: 0;
    color: #000000;
    border-bottom: 1px solid #ddd;
    display: block;
    float: left;
    width: 100%;
}

    .autocomplete-row > a {
        display: block;
        float: left;
        width: 98%;
        padding: 5px 1%;
    }

    .autocomplete-selected-row, .autocomplete-row:hover {
        background-color: #e7e2e2;
        color: #ffffff;
    }

.autocomplete-image-holder {
    padding-top: 1px;
    float: left;
    margin-right: 2px;
    margin-left: 4px;
    height: 40px;
    width: 54px;
}

.autocomplete-image {
    border-radius: 50%;
    border-color: #ececec;
    border-style: solid;
    border-width: 1px;
    max-width: 100%;
    max-height: 100%;
}

.autocomplete-image-default {
    /* Add your own default image here*/
    /*background-image: url('/assets-lib/images/1_front.png');*/
    background-position: center;
    background-size: contain;
    max-height: 34px;
    width: 44px;
}

.autocomplete-highlight {
    background-color: #32cd32;
}

.yscroll200 {
    height: 200px;
    overflow-y: auto;
}

.yscroll330 {
    height: 330px;
    width: 22%;
    margin-right: 2%;
    overflow-y: auto;
}
/*product detail page specificton tab */
.product-setting table tbody, .product-setting table thead {
    display: block;
}

.specific-tab.dl-horizontal dt {
    margin-bottom: 10px;
    text-overflow: inherit;
    overflow: visible;
    white-space: normal;
    line-height: normal;
}

.notify:before {
    position: absolute;
    left: -9px;
    top: 10px;
    border-top: 9px solid transparent;
    border-bottom: 9px solid transparent;
    border-right: 9px solid #eee;
}

.notification-box {
    position: absolute;
    top: 0px;
    left: 25%;
    z-index: 1006;
    box-shadow: 0 0 7px rgba(198, 4, 4, 0.7);
}

    .notification-box .hbox-column {
        cursor: move;
    }

.stick-top-right.close-btn {
    top: 2px;
    right: 2px;
    z-index: 99999;
}

.compare-box {
    position: fixed;
    bottom: 0;
    left: 50%;
    margin-left: -530px;
    z-index: 9999;
}

    .compare-box .container {
        padding: 15px;
        background: #EEE;
        box-shadow: 0 -2px 6px rgba(0,0,0,.4);
        position: relative;
    }

    .compare-box p {
        line-height: normal;
    }

    .compare-box .compare-content {
        width: 24%;
        margin-right: 1%;
        float: left;
        padding: 10px;
        position: relative;
        border: 1px dashed #ccc;
    }

.notify {
    padding: 5px;
}

    .notify .nano > .nano-pane {
        display: block !important;
    }

#menubar .nano {
    height: 100% !important;
}

.scrollNotification {
    max-height: 330px;
    overflow-y: scroll;
}

.compare-content .stick-top-right {
    z-index: 9999;
}

.overlap-filter {
    position: absolute;
    bottom: 0 !important;
    left: 0;
    overflow: hidden;
    height: 100%;
    width: 100%;
    line-height: 17px !important;
}

    .overlap-filter .fa-filter {
        color: #8bc34a;
        overflow: hidden;
        height: 55%;
        left: 18px;
        top: 0;
        bottom: 20px;
        position: absolute;
    }

.filter-icon .fa-filter {
    left: 18px;
    top: 0;
    bottom: 20px;
    position: absolute;
}

body [class*=" md-"].edit-icon {
    margin-bottom: -0.1em;
}

.fa.excel-icon {
    margin-top: 2px;
}

.header-nav > li > a:hover, .header-nav > li > a:focus {
    opacity: 0.9;
}

.ht_master .wtHolder { /*width: 100%!important; overflow: visible!important; overflow-x: visible!important; */
}

.handsontableDiv .modal-dialog {
    min-width: 75%;
    left: auto;
}

.popupStyle .input-group-addon {
    opacity: 1;
}

.popupStyle .popover {
    max-width: 500px;
}

.admin-deopdown {
    position: relative;
    z-index: 999999;
}

.border-size {
    border-width: 10px;
}

.pro-text {
    max-height: 32px;
    overflow: hidden;
    width: 100%;
}

.handsontable .columnSorting:after {
    position: absolute;
    content: "";
    width: 19px;
    height: 19px;
    right: -17px;
    top: -2px;
    background: url(../../content/whitelabel/sort_both.png) no-repeat;
}

.handsontable .columnSorting.ascending::after, .handsontable .columnSorting.descending::after {
    background: none;
}

#refineBy {
    max-width: 400px;
    max-height: 500px;
}

.refinecontent {
    height: 100%;
}

.refineScroll {
    height: 80%;
    overflow-y: auto;
}

.leftspace {
    margin-left: 10px;
    float: left;
}

.productdeatilImg {
    display: table;
    width: 100%;
}

    .productdeatilImg .pro_detail {
        display: table-cell;
        vertical-align: top;
        text-align: center;
    }

        .productdeatilImg .pro_detail img {
            margin: auto;
        }

.productDetail pre {
    background: none;
    border: none;
    font-size: 1em;
    color: #313335;
    font-family: 'Roboto';
}

.productDetail h3.text-muted pre {
    color: #96999c;
    font-size: 14px;
    line-height: normal;
    padding: 0;
}

.input-group .autocomplete-holder .form-control {
    width: 90%;
    padding-right: 0;
}

#logoutForm .input-group-content {
    padding-top: 10px;
}

.customepadding .control {
    padding-left: 45px;
}

@media only screen and (min-width:768px) and (max-width: 1200px) {
    .leftMenuExpand #menubar {
        width: 240px;
    }

    .leftMenuExpand #base {
        padding-left: 240px;
    }

    .leftMenuExpand #menubar .gui-controls li a .menu-text .title {
        margin-left: 10px;
        opacity: 1;
        display: block;
    }

    .leftMenuExpand .gui-controls li .title {
        left: 0;
    }

    .leftMenuExpand #menubar .gui-controls > li:not(.gui-folder) > a {
        border: 1px solid #d5d5d5;
    }

    md-grid-list md-grid-tile-footer .no-y-padding {
        padding: 0 12px;
    }
}

@media (min-width: 769px) {
    /*.full-content #base,*/
    .full-content #content {
        height: 100%;
    }

    .header-nav .autocomplete-holder {
        width: 200px;
    }

    .compare-box {
        margin-left: 0;
    }
}


@media (min-width: 992px) {
    .compare-box {
        margin-left: -424px;
    }
}

@media (min-width: 1200px) {
    .menubar-pin.full-content .section-action {
        left: 240px;
    }

    /*.header-nav .autocomplete-holder {
        width: 400px;
    }*/
    .headerSearch .autocomplete-holder {
        width: 400px;
    }

    .compare-box {
        margin-left: -530px;
    }
    /*.pro_detail { max-height: 390px; }*/
    .pro_detail .product-img {
        max-height: 390px;
    }
}

@media (max-width: 1200px) {
    #menubar .gui-controls > li:not(.gui-folder) > a {
        border: none;
    }

    .full-content #menubar .gui-controls li a .gui-icon {
        display: block;
    }

    .notification-box {
        margin-left: 0;
        /*left: 100px;*/
    }

    body:not(.menubar-visible) .gui-controls li .title {
        display: none;
    }

    body.menubar-visible .gui-controls li .title {
        display: block;
    }
}

@media (max-width: 990px) {
    .header-nav .autocomplete-holder {
        width: 130px;
    }

    .header-nav .navbar-search input {
        padding: 0 24px 0 10px;
    }

    .compare-box {
        left: 150px;
    }
}

@media (max-width: 768px) {
    section {
        padding: 12px;
    }

    .full-content section.has-actions {
        padding-bottom: 64px;
    }

    .full-content .section-action {
        left: 0;
    }

    .global-loader {
        left: 40%;
    }

    .notification-box {
        width: 100%;
        left: 0;
    }

    .compare-box {
        width: 100%;
        margin: 0;
        left: 0;
    }

        .compare-box .compare-content {
            width: 50%;
            margin: 0;
            min-height: 80px;
        }

        .compare-box .small-padding {
            padding: 2px;
            z-index: 1;
        }

    .absoluateDiv {
        position: static;
    }

    .navbar-search.expanded .form-group {
        width: 300px;
    }

    /* left tab design changes on mobile */
    ul.card-head.nav.nav-tabs {
        width: 100%;
        text-align: center;
    }

        ul.card-head.nav.nav-tabs li {
            display: inline-block;
        }

            ul.card-head.nav.nav-tabs li.active a {
                border-bottom: 2px solid #8bc34a;
                border-right: 0;
            }

    .headerSearch {
        position: absolute;
        top: 69px;
        right: 125px;
        z-index: 9999999;
    }
}

@media (max-width: 480px) {
    .navbar-search.expanded .form-group {
        width: 100%;
    }

    .compare-box .compare-content {
        width: 100%;
        margin: 0;
    }
}

@media (max-width: 360px) {
    .compare-box {
        left: 0;
    }

    .navbar-search.expanded .form-group {
        width: 180px;
    }

    #refineBy {
        min-width: 280px;
    }
}

@media (max-width: 320px) {
    .navbar-search.expanded .form-group {
        width: 160px;
    }
}

button {
    display: none;
}

.compare-product:hover button {
    display: block;
}

.display-none {
    display: none !important;
}

.display-inline {
    display: table-row !important;
}

.table-hover > tbody > tr td.urgent {
    background-color: red;
    color: #ffffff !important;
}

[ng\:cloak], [ng-cloak], .ng-cloak {
    display: none !important;
}

@media (max-height: 600px) {

    .refineScroll {
        height: 65%;
    }
}

.ace-editor {
    width: 100%;
    min-height: 300px;
    line-height: 2 !important;
}

.headerbar-left {
    float: left;
    position: static;
}

.headerSearch {
    float: right;
    margin-top: 14px;
}

.disabled {
    cursor: not-allowed;
}

.message-container {
    border: 5px double #0070d6;
    box-shadow: 0px 0px 0px #ddd;
    border-radius: 4px;
    padding: 50px;
    text-align: center;
    min-height: 150px;
    vertical-align: central;
    line-height: 140px;
}
