@font-face {
    font-family: 'SolaimanLipi';
    src: url(../fonts/SolaimanLipi.eot);
    src: url(../fonts/SolaimanLipi.woff) format('woff'), url(../fonts/SolaimanLipi.ttf) format('truetype'), url(../fonts/SolaimanLipi.eot?#iefix) format('embedded-opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'SolaimanLipi_normal';
    src: url(../fonts/SolaimanLipi.eot);
    src: url(../fonts/SolaimanLipi.woff) format('woff'), url(../fonts/SolaimanLipi.ttf) format('truetype'), url(../fonts/SolaimanLipi.eot?#iefix) format('embedded-opentype');
    src: url(../fonts/SolaimanLipi_Normal_Regular.ttf);
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'AtomicAge-Regular';
    src: url(../fonts/Coda-Regular.ttf);
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/MaterialIcons-Regular.eot); /* For IE6-8 */
}
/*@import url('https://fonts.maateen.me/solaiman-lipi/font.css');*/
body {
    /*font-family: "SolaimanLipi", Arial, sans-serif !important;*/
    /*font-family: 'SolaimanLipi_normal', Arial, sans-serif;*/
    font-family: 'AtomicAge-Regular', Arial, sans-serif;
    font-size: 13px;
    background-color: #efefef;
    color: #373a39;
}

.page-style {
    margin-top: 10px;
}

.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: inherit; /* Preferred icon size */
    display: inline-block;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;
    /* Support for all WebKit browsers. */
    -webkit-font-smoothing: antialiased;
    /* Support for Safari and Chrome. */
    text-rendering: optimizeLegibility;
    /* Support for Firefox. */
    -moz-osx-font-smoothing: grayscale;
    /* Support for IE. */
    font-feature-settings: 'liga';
}

.material-position {
    position: relative;
    top: 2px;
}
/* width */
::-webkit-scrollbar {
    width: 8px;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #c5c5c5;
}

    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
        background: #888;
    }

.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}

.special-padding-col {
    padding-right: 5px;
    padding-left: 5px;
}

a {
    /*color: #FF6F00;*/
}

    a:hover {
        /*color: #7E57C2;*/
        text-decoration: none;
        cursor: pointer;
    }

.center {
    text-align: center !important;
}

.right {
    text-align: right !important;
}

.left {
    text-align: left !important;
}

.not-set {
    color: rgba(0, 0, 0, 0.24);
    text-shadow: none;
}

.w-100-p {
    width: 100%;
}

.text-truncate-multi-line-2 {
    display: block;
    display: -webkit-box;
    max-width: 100%;
    height: 37px;
    margin: 3px auto;
    font-size: 16px;
    line-height: 20px;
    color: #000000;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.required:after {
    content: '*';
    color: red;
    padding-left: 5px;
}

.unselectable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.table td {
    padding: 5px;
    vertical-align: middle;
}

.table thead th {
    vertical-align: middle;
    border-bottom: 2px solid #dee2e6;
    padding: 10px 5px;
}

div.dataTables_wrapper div.dataTables_info {
    float: left;
}

.ckeck-all-head, .ckeck-all-head::after, .ckeck-all-head::before {
    content: '' !important;
    padding-right: 10px !important;
}

.dt-check-all {
    border: 1px solid #868686;
    border-radius: 5px;
    text-align: center;
    background: #fff;
    width: 20px;
    height: 20px;
}

.allChecked::after {
    content: "✔";
    margin-top: -11px;
    margin-left: -2px;
    text-align: center;
}

.group {
    position: relative;
    margin: 20px 0;
    margin-bottom: 25px;
}

textarea {
    resize: none;
}

input,
textarea {
    background: none;
    color: #717171;
    font-size: 15px;
    padding: 10px 10px 10px 5px;
    display: block;
    width: 100%;
    border-radius: 0;
    border: 1px solid #c6c6c6;
}

    input:focus,
    textarea:focus {
        outline: none;
    }

        input:focus ~ label, input:valid ~ label,
        textarea:focus ~ label,
        textarea:valid ~ label {
            top: -18px;
            font-size: 12px;
            color: #2196f3;
            left: 0px;
        }

        input:focus ~ .bar:before,
        textarea:focus ~ .bar:before {
            width: 100%;
        }

    input[type="password"] {
        letter-spacing: 0.3em;
    }

.group > label {
    color: #bbbbbb;
    font-size: 16px;
    font-weight: normal;
    position: absolute;
    pointer-events: none;
    left: 10px;
    top: 10px;
    -webkit-transition: 300ms ease all;
    transition: 300ms ease all;
}

.bar {
    position: relative;
    display: block;
    width: 100%;
}

    .bar:before {
        content: "";
        height: 2px;
        width: 0;
        bottom: 0px;
        position: absolute;
        background: #2196f3;
        -webkit-transition: 300ms ease all;
        transition: 300ms ease all;
        left: 0%;
    }

/*.btn {
  background: #fff;
  color: #959595;
  border: none;
  padding: 10px 20px;
  border-radius: 3px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-decoration: none;
  outline: none;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.btn:hover {
  color: #8b8b8b;
  box-shadow: 0 7px 14px rgba(0, 0, 0, 0.18), 0 5px 5px rgba(0, 0, 0, 0.12);
}
.btn.btn-link {
  background: #2196f3;
  color: #d3eafd;
}
.btn.btn-link:hover {
  background: #0d8aee;
  color: #deeffd;
}
.btn.btn-submit {
  background: #2196f3;
  color: #bce0fb;
}
.btn.btn-submit:hover {
  background: #0d8aee;
  color: #deeffd;
}
.btn.btn-cancel {
  background: #eee;
}
.btn.btn-cancel:hover {
  background: #e1e1e1;
  color: #8b8b8b;
}

.btn-box {
  text-align: center;
  margin: 50px 0;
}*/

.display-flex {
    display: inline-flex;
}

.top-nav {
    /*background: #FF9100;*/
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.6);
    padding: 0px;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030;
    height: 70px;
    margin-bottom: 20px;
    border: 1px solid transparent;
}

.brand-logo, .brand-logo-footer {
    width: 200px;
    height: 68px;
    padding: 10px;
}

.search-bar {
    position: relative;
    width: 100%;
    height: 0px;
    top: 16px;
}

.top-search {
    width: 80%;
    margin: 0 auto !important;
}

.search-field {
    border: none;
    border-radius: 5px !important;
    background: #fcfcfc !important;
    margin-bottom: 8px !important;
    margin-top: 0px !important;
}

.search-addon {
    position: absolute;
    right: 12px;
    z-index: 9;
    top: 11px;
    color: #b3b3b3 !important;
    cursor: pointer;
}

.search-loader {
    width: 20px;
    position: relative;
    top: 1px;
    right: 0px;
}

.top-search-result {
    max-height: 300px;
    background: #fcfcfc;
    width: 50%;
    margin: 0 auto;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.6);
    border-radius: 5px;
    display: none;
}

.search-header {
    top: 0;
    padding: 0px 10px;
    font-size: 12px;
    color: #adadad;
    list-style-type: none;
    background: #fcfcfc;
    width: 100%;
    max-height: 300px;
    overflow: auto;
    left: -11px;
    display: block;
    box-shadow: 0 4px 16px rgba(20,23,28,.25);
    border-top: 1px solid #dedede;
}

.for-top-arrow:after {
    border-style: solid;
    border-width: 7px 7px;
    content: "" !important;
    height: 0;
    position: fixed;
    width: 0;
    margin-left: 15px;
    margin-top: -13px;
    border-color: transparent transparent #fcfcfc;
}

.arrow-for-profile-menu-header {
    font-size: 12px;
    color: #adadad;
    text-align: left;
    display: block;
    padding: 2px;
    padding-left: 10px;
    border-bottom: 1px solid #e2e2e2;
}

.arrow-for-profile-menu:after {
    margin-left: -27px;
}

.search-thumb-img {
    width: 20px;
    height: 20px;
    margin-right: 5px;
}

.search-text {
    display: block;
    padding: 5px 10px;
    padding-bottom: 3px;
    background: #fcfcfc;
    text-decoration: none !important;
    font-size: 14px;
    border-bottom: 1px solid #f5f5f5;
    transition: ease-in-out 0.3s;
    cursor: pointer;
}

    .search-text:hover {
        background: #f3f3f3;
    }

.search-not-found {
    font-size: 14px;
    display: block;
    text-align: center;
    color: #a9a9a9;
    margin: 10px;
}

.search-box-hide {
    display: none;
    transition: ease-in-out 0.3s;
}

.tip-nav-right-part {
    position: relative;
    top: 4px;
}

.top-img-circle {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    border: 1px solid #fcfcfc;
    display: inline-flex;
    background: #fcfcfc;
    padding: 2px;
    position: relative;
    top: 12px;
    cursor: pointer;
}

    .top-img-circle:hover {
        color: #212529;
        background-color: #f8f9fa;
        border-color: #f8f9fa;
    }

.top-nav-right {
    text-align: right;
}

.top-image-down-icon {
    position: relative;
    font-size: 22px;
    left: 4px;
    color: #fcfcfc;
    top: -10px;
}

.top-search-icon {
    width: 20px;
    height: 20px;
    position: absolute;
    margin: 4px;
}

.top-track-icon {
    width: 30px;
    height: 30px;
    position: absolute;
    margin: -1px;
}

.top-img-track {
    margin-right: 10px;
}

.top-profile-info {
    width: 70px;
    display: inline-block;
    position: relative;
    top: 7px;
    padding-right: 10px;
    padding-bottom: 3px;
}

.info-pro-top {
    width: 70px;
    display: inline-block;
    position: relative;
    padding-right: 10px;
    padding-bottom: 3px;
    transition: ease-in-out 0.3s;
    cursor: pointer;
}

    .info-pro-top:active {
        background: #fff;
        border-radius: 5px;
    }

.user-num-top {
    margin-left: 20px;
}

.top-profile-img {
    width: 36px;
    height: 36px;
    position: relative;
    margin: -4px;
    display: block;
}

.profile-img-top {
    top: 5px;
}

.top-profile-menu {
    min-height: 100px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.6);
    border-radius: 5px;
    width: 200px;
    position: absolute;
    top: 58px;
    background: #fcfcfc;
    right: -9px;
    padding-bottom: 37px;
    z-index: 1;
}

.login-reg-btn {
    position: relative;
    top: -2px;
    background: #fcfcfc;
    color: #6d6d6d;
}

.lan-text {
    position: absolute;
    margin: 3px;
    color: #636363;
    font-size: 11px;
    top: 6px;
}

.container {
    width: 85%;
    max-width: 85%;
}

.app-main {
    margin-top: 69px;
    display: block;
    overflow: auto;
    min-height: 100vh;
}

.main-row {
    display: flex;
    width: 100%;
    overflow: hidden;
}

.col-main-left {
    width: 295px;
}

.col-main-right {
    width: calc(100% - 300px);
}

.main-view {
    min-height: 100vh;
}

.margin-10 {
    margin: 10px;
}

.margin-top-10 {
    margin-top: 10px;
}

.margin-bottom-10 {
    margin-bottom: 10px;
}

.margin-top-100 {
    margin-top: 100px;
}

.padding-10 {
    padding: 10px;
}

.padding-0 {
    padding: 0px !important;
}


.padding-top-0 {
    padding-bottom: 0px;
}

.padding-botom-0 {
    padding-bottom: 0px;
}

.panel-disabled {
    pointer-events: none;
    /* for "disabled" effect */
    opacity: 0.5;
    background: #CCC;
}
/*#page-left-menu{
    position: fixed;
    top: 60px;
    height: 100vh;
    overflow: auto;
    max-width: 290px;
    padding-bottom: 100px;
}*/
.chk-input {
    position: relative;
    top: 1px;
    margin-right: 5px;
}

.d-menu-link {
    display: block;
    text-align: left;
    padding: 8px 10px;
    background: #fcfcfc;
    border-bottom: 1px solid #e2e2e2;
    transition: ease-in-out 0.3s;
}

.d-menu-link-logout {
    display: block;
    text-align: left;
    padding: 8px 10px;
    background: #eee;
    position: absolute;
    bottom: 0;
    width: 100%;
    border-radius: 0px 0px 5px 5px;
}

.d-menu-link-profile {
    padding-left: 10px;
}

.d-menu-icon {
    width: 20px;
    font-size: 14px;
}

.d-menu-link:hover, .d-menu-link-logout:hover {
    cursor: pointer;
    /*background: #FF6F00;*/
    color: #ffffff !important;
}

/*Notification*/
.top-notification-info {
    display: inline-block;
    position: relative;
    top: 0px;
}

.top-notification {
    min-height: 100px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.6);
    border-radius: 5px;
    width: 250px;
    position: absolute;
    top: 56px;
    background: #fcfcfc;
    right: 3px;
    padding-bottom: 0px;
}

.arrow-for-notification-menu:after {
    margin-left: 104px;
}

.top-notify-icon {
    width: 20px;
    height: 20px;
    position: absolute;
    margin: 4px;
}

.notify-unseen-counter {
    position: absolute;
    top: -5px;
    left: 17px;
    color: white;
    background: #ff0e0e;
    border-radius: 3px;
    padding: 0px 4px;
    font-size: 12px;
}
/*Modal*/
.modal-close {
    padding: 0px;
    position: absolute;
    right: -5px;
    width: 35px;
    height: 35px;
    background: #ffffff;
    top: -5px;
    z-index: 99;
    border: 2px solid #7d7d7d;
    border-radius: 50%;
    opacity: 1;
    font-size: 26px;
    margin: 0px;
    color: #868686;
}

    .modal-close:hover {
        color: #ff8383;
        cursor: pointer;
    }

.modal-crose-icon {
    position: relative;
    top: -6px;
}

.modal-body {
    padding: 0px;
}

.modal-footer {
    padding: 5px;
    border: none;
    display: block;
    text-align: center;
    margin: 10px;
    margin-top: 0px;
}

.modal-body-part {
    padding: 10px 20px;
    padding-bottom: 0px;
}

.modal-body-header-part {
    padding: 10px;
    padding-bottom: 0;
    color: #FF6F00;
}

button:focus {
    outline: none !important;
}
/*meterial Button*/
.pure-material-button-contained {
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    border: none;
    border-radius: 4px;
    padding: 5px 10px;
    margin-bottom: 4px;
    width: auto;
    vertical-align: middle;
    text-align: center;
    text-overflow: ellipsis;
    color: #fff;
    /*background-color: #FF6F00;*/
    box-shadow: 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
    font-size: 12px;
    font-weight: 500;
    overflow: hidden;
    outline: none;
    cursor: pointer;
    transition: box-shadow 0.2s;
}

.material-button-cancel {
    background-color: rgba(0, 0, 0, 0.5) !important;
}

.pure-material-button-contained::-moz-focus-inner {
    border: none;
}

/* Overlay */
.pure-material-button-contained::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #ffffff;
    opacity: 0;
    transition: opacity 0.2s;
}

/* Ripple */
.pure-material-button-contained::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    border-radius: 50%;
    padding: 50%;
    width: 32px; /* Safari */
    height: 32px; /* Safari */
    background-color: #ffffff;
    opacity: 0;
    transform: translate(-50%, -50%) scale(1);
    transition: opacity 1s, transform 0.5s;
}

/* Hover, Focus */
.pure-material-button-contained:hover,
.pure-material-button-contained:focus {
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
    color: #fff;
}

    .pure-material-button-contained:hover::before {
        opacity: 0.08;
    }

    .pure-material-button-contained:focus::before {
        opacity: 0.24;
    }

    .pure-material-button-contained:hover:focus::before {
        opacity: 0.3;
    }

/* Active */
.pure-material-button-contained:active {
    box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
}

    .pure-material-button-contained:active::after {
        opacity: 0.32;
        transform: translate(-50%, -50%) scale(0);
        transition: transform 0s;
    }

/* Disabled */
.pure-material-button-contained:disabled {
    color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.38);
    background-color: rgba(var(--pure-material-onsurface-rgb, 0, 0, 0), 0.12);
    box-shadow: none;
    cursor: initial;
}

    .pure-material-button-contained:disabled::before {
        opacity: 0;
    }

    .pure-material-button-contained:disabled::after {
        opacity: 0;
    }

.edit-btn {
    background-color: #008e84;
}

.edit-cust-btn {
    padding: 2px 5px;
}

    .edit-cust-btn > span {
        font-size: 20px;
    }

.delete-btn {
    background-color: #fb5454;
}
/*input field*/
.field-wrapper {
    position: relative;
    margin-bottom: 25px;
}

    .field-wrapper .field-placeholder {
        font-size: 16px;
        position: absolute;
        /* background: #fff; */
        bottom: 10px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        color: #80868b;
        left: 0px;
        padding: 0 8px;
        -webkit-transition: transform 150ms cubic-bezier(0.4,0,0.2,1),opacity 150ms cubic-bezier(0.4,0,0.2,1);
        transition: transform 150ms cubic-bezier(0.4,0,0.2,1),opacity 150ms cubic-bezier(0.4,0,0.2,1);
        z-index: 1;
        text-align: left;
        width: 85%;
    }

        .field-wrapper .field-placeholder span {
            background: #ffffff;
            padding: 0px 8px;
        }

    .field-wrapper input:focus {
        outline: 1px solid #FF6F00 !important;
    }

    .field-wrapper input {
        border: 1px solid #DADCE0;
        padding: 12px;
        border-radius: 4px;
        width: 100%;
        font-size: 13px;
    }

        .field-wrapper input:not([disabled]):focus ~ .field-placeholder {
            color: #FF6F00;
        }

        .field-wrapper input:not([disabled]):focus ~ .field-placeholder,
        .field-wrapper.hasValue input:not([disabled]) ~ .field-placeholder {
            -webkit-transform: scale(.75) translateY(-39px) translateX(-60px);
            transform: scale(.80) translateY(-30px) translateX(-50px);
            transition: ease-in-out 0.3s;
            left: 10px;
        }
    /*textarea*/
    .field-wrapper textarea:focus {
        outline: 1px solid #FF6F00 !important;
    }

    .field-wrapper textarea {
        border: 1px solid #DADCE0;
        padding: 12px;
        border-radius: 4px;
        width: 100%;
        font-size: 13px;
    }

        .field-wrapper textarea:not([disabled]):focus ~ .field-placeholder {
            color: #FF6F00;
        }

        .field-wrapper textarea:not([disabled]):focus ~ .field-placeholder,
        .field-wrapper.hasValue textarea:not([disabled]) ~ .field-placeholder {
            -webkit-transform: scale(.75) translateY(-39px) translateX(-60px);
            transform: scale(.80) translateY(-30px) translateX(-50px);
            transition: ease-in-out 0.3s;
            left: 10px;
        }

.textarea-place {
    top: 12px !important;
    height: 22px;
}

.field-wrapper select {
    height: 45px !important;
}

/*login style*/
.mh-login-section {
    margin: 0 auto;
    text-align: center;
}

.mh-login-section-up {
    max-width: 500px;
    margin: 0 auto;
    margin-top: 50px;
    text-align: center;
}

.mh-login-pnl {
    padding: 20px;
}

.mh-login-title {
    line-height: 30px;
    font-weight: bold;
    font-size: 20px;
}

.mh-login-subtitle {
    line-height: 30px;
}

.mh-login-pnl-footer {
    padding: 15px;
    background: #eeefef;
    border-radius: 0px 0px 5px 5px;
}

.mh-forget-pass {
    padding: 20px;
}

    .mh-forget-pass a {
        font-weight: normal;
        text-decoration: none !important;
    }

.login-button {
    font-size: 14px;
    padding: 5px 45px;
}

.mh-btn-login {
    padding: 5px 25px;
    font-size: 15px;
}

.mh-login-body {
    margin: 20px 10px;
}

.mh-form-control {
    width: 100%;
    height: 40px;
    border: 1px solid #eee;
    text-align: left;
    padding: 10px;
}

.login-password-show-hide-icon {
    position: absolute;
    right: 10px;
    top: 10px;
    font-size: 20px;
    cursor: pointer;
    color: #908c8c;
}

.error-msg-show {
    position: absolute;
    right: 5px;
    margin-top: 0px !important;
    color: red !important;
    text-align: right;
}

/*Registration*/
.reg-container {
    max-width: 450px;
    margin: 10px auto;
    text-align: center;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.12), 0 1px 0px rgba(0, 0, 0, 0.24);
    background: #fff;
    border-radius: 4px;
    border: 1px solid #eee;
    height: auto;
    padding: 15px 5px;
}

.body-box {
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    -ms-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    -o-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    background: #f3f3f3;
    border-radius: 3px;
    margin: 10px 0px;
    height: auto;
    border: none;
}

.body-box-header {
    /*background: linear-gradient(60deg,rgba(103, 58, 183, 0.8),rgba(103, 58, 183, 0.3));*/
    padding: 5px 10px;
    border: 0;
    font-size: 15px;
    /*color: rgba(255, 145, 0, 1);*/
    word-break: break-all;
    /*box-shadow: 0 1px 3px rgba(134, 99, 196, 0.83), 0 1px 2px rgba(123, 90, 181, 0.28);*/
}

.body-box-body {
    padding: 10px 20px;
    padding-bottom: 30px;
}

.body-box-footer {
    border-top: none;
    /*background: rgb(221, 216, 228);*/
    padding: 5px 10px;
    font-size: 14px;
    color: #7147bc;
    word-break: break-all;
    position: absolute;
    bottom: 0;
    width: 100%;
    background-color: rgba(255, 145, 0, 0.07) !important;
}

.index-footer {
    background: rgba(255, 145, 0, 0.3);
    margin-top: 10px;
    padding: 10px 0px;
}

.font-size-30 {
    font-size: 30px;
}

.tb-product-img {
    width: 30px;
    height: 40px;
}

.cart-item-quantity {
    position: absolute;
    height: 22px;
    width: 22px;
    /*background: #ff6a00;*/
    font-size: 12px;
    text-align: center;
    line-height: 22px;
    border-radius: 50%;
    color: #ffffff;
    top: -5px;
    right: -10px;
    padding: 1px;
}

.cart-open-left .cart-aside-left {
    opacity: 1;
    visibility: visible;
}

.cart-open-left .cart-inner-left {
    transform: translateX(0);
    transition: .3s;
}

.cart-aside-left {
    z-index: 300;
    position: fixed;
    overflow: hidden;
    margin-top: 65px;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    opacity: 0;
    visibility: hidden;
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    cursor: pointer;
    transition: .5s;
}

.overlay {
    height: 100%;
    width: 100%;
    background-color: rgba(0,0,0,.5);
}

.cart-inner-left {
    width: 250px;
    cursor: default;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    background-color: #fff;
    -webkit-transform: translateX(100%);
    transform: translateX(-100%);
    transition: .3s;
}

.cart-open .cart-aside {
    opacity: 1;
    visibility: visible;
}

.cart-open .cart-inner {
    transform: translateX(0);
    transition: .3s;
}

.cart-aside {
    z-index: 300;
    position: fixed;
    overflow: hidden;
    margin-top: 65px;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    opacity: 0;
    visibility: hidden;
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    cursor: pointer;
    transition: .5s;
}

.cart-inner {
    width: 360px;
    padding-left: 20px;
    padding-right: 20px;
    cursor: default;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    background-color: #fff;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    transition: .3s;
}

.cart-aside .head {
    margin-top: 20px;
    display: flex;
    align-items: center;
    -webkit-box-align: center;
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}

    .cart-aside .head .list-close {
        font-size: 20px;
        cursor: pointer;
    }

    .cart-aside .head h5 {
        font-size: 16px;
        color: red;
    }

.cart-items {
    overflow: auto;
    position: absolute;
    max-height: calc(100% - 150px);
    width: 100%;
    left: 0;
    padding: 5px 20px;
}

.cart-sub-total-title {
    font-size: 15px;
    font-weight: bold;
}

.cart-sub-total {
    font-size: 15px;
    font-weight: bold;
}

.cart-footer {
    padding: 10px 20px;
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 0;
    background: #eee;
    box-shadow: 0px 7px 12px #000;
}

    .cart-footer .total-count {
        margin-bottom: 5px;
    }

.u-flex--item-center {
    -webkit-align-items: center;
    align-items: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
}

.u-flex--content-between {
    -webkit-box-pack: justify;
    -moz-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}

.u-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
}

.cart-footer .order-end .btn-order {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    align-items: center;
    width: 60%;
    margin-top: 5px;
    border-style: solid;
    border-width: 1px;
    color: #fff;
    fill: #fff;
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: #41b468;
    border-color: #3aa15d #338f52 #2d7c48;
    background: -webkit-gradient(linear,left top,left bottom,from(#57c27b),to(#41b468));
    background: linear-gradient(180deg,#57c27b,#41b468);
    -webkit-box-shadow: 0 1px 0 hsla(0,0%,100%,.4) inset;
    box-shadow: inset 0 1px 0 hsla(0,0%,100%,.4);
}

.box {
    border: 1px solid #d0cfcf;
    border-radius: 5px;
    box-shadow: 0px 1px 2px #d4d4d4;
    background: #fff;
}

.logo-change-box {
    padding: 10px;
    text-align: center;
    margin-top: 10px;
}

.logo-img-box {
    border: 2px groove #ffffff;
    border-radius: 5px;
    background: #f9f9f9;
    width: 200px;
    height: 68px;
    min-width: 200px;
    min-height: 68px;
    margin-bottom: 10px;
}

.slider-img-box {
    border: 2px groove #ffffff;
    border-radius: 5px;
    background: #f9f9f9;
    width: 300px;
}

.slider-loading {
    height: 350px;
}

.info-text {
    color: #FF6F00;
    font-size: 12px;
}

.config-box {
    padding: 10px;
    margin: 10px 0px;
    border-bottom: 1px solid #cecccc;
    border: 1px solid #d0cfcf;
    border-radius: 5px;
    box-shadow: 0px 1px 2px #d4d4d4;
    background: #fff;
}

.config-title {
    font-size: 20px;
    color: #a0a0a0;
}

.accordion .card-header:after {
    content: "\25B2";
    float: right;
    border: 1px solid #d2d2d2;
    padding: 0px 4px;
    border-radius: 3px;
    font-size: 12px;
    color: #929292;
    position: absolute;
    right: 10px;
    margin-top: -22px;
}

.accordion .card-header.collapsed:after {
    /* symbol for "collapsed" panels */
    content: "\25BC";
}

.menu-bar-left {
    max-width: 290px;
    padding-right: 30px;
}

    .menu-bar-left .head {
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        border-radius: 0px;
        color: #333;
        font-size: 14px;
        font-family: 'Open Sans', sans-serif;
        padding: 12px 17px;
        text-transform: uppercase;
        /*background-color: #ff9100;
        border: 1px solid #e28102;*/
        font-weight: 700;
        letter-spacing: 0.5px;
        /*border-bottom: 1px #f1ce3c solid;*/
        margin-top: 10px;
    }

.seb-menu-text {
    background: #eee;
    margin: 5px;
    padding: 10px;
    font-size: 14px;
    display: block;
    border: 1px solid #eee;
    border-radius: 5px;
    padding-left: 20px;
}

.index-top-ctg {
    padding: 0px 10px;
    padding-top: 6px;
    margin: 10px 0px;
    border-bottom: 1px solid #cecccc;
    border: 1px solid #d0cfcf;
    border-radius: 3px;
    box-shadow: 0px 1px 2px #d4d4d4;
    background: #fff;
    /*border-left: 7px solid #ff5200;
    color: #ff5200;*/
}

.view-more-btn {
    display: inline-flex;
    position: absolute;
    right: 10px;
    margin-top: 6px;
}

.more-arrow {
    font-size: 24px;
    position: relative;
    top: -8px;
    margin-left: 3px;
}

.product-box {
    border: 1px solid #d0cfcf;
    border-radius: 5px;
    box-shadow: 0px 1px 2px #d4d4d4;
    background: #fff;
    margin: 15px;
    margin-bottom: 25px;
    transition: ease-in-out 0.3s;
}

    .product-box:hover {
        cursor: pointer;
        /*color: #FF6F00;*/
    }

.product-img-show-panel {
    width: 100%;
    border-radius: 5px 5px 0px 0px;
    height: 250px;
    padding: 5px;
    margin-bottom:10px;
}

.product-img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    display: block;
    margin: 0 auto;
}

.product-price-show {
    font-size: 15px;
    text-align: center;
    margin: 5px;
    font-weight: bold;
}

.product-title-show {
    padding: 0px 7px;
    font-size: 14px;
    height: 46px;
    width: 100%;
    line-height: 1.5;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.margin-0-5 {
    margin: 0 -5px;
}

.card-body {
    padding: 0px;
}

.card-header {
    padding: .75rem 10px;
    padding-right: 35px;
    cursor: pointer;
}

.card-header-single {
    padding-right: 35px;
    cursor: pointer;
    margin-bottom: 0;
    background-color: rgba(0,0,0,.03);
    border-bottom: 1px solid rgba(0,0,0,.125);
}

.card-parent-title {
    font-size: 15px;
    position: relative;
    top: -6px;
    line-height: 1.87;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    display: block;
    margin-bottom: -6px;
}

.card-title {
    font-size: 15px;
    position: relative;
    top: -6px;
    line-height: 1.87;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    display: block;
    margin-bottom: -6px;
    padding: 10px;
}

.category-icon {
    font-size: 24px;
    position: relative;
    top: 6px;
}

.sub-ctg-edit-panel {
    position: absolute;
    right: 10px;
    margin-top: -25px;
}

.sub-ctg-not-found {
    padding: 10px;
    text-align: center;
}

.stepwizard-step > .btn-active {
    border-color: #ff9100 !important;
    color: #fff !important;
    background: #ff9100 !important;
}

    .stepwizard-step > .btn-active > .step-arrow {
        border-left-color: #ff9100 !important;
    }

.pure-material-button-contained.disabled {
    background: #949494;
    box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.2), 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12);
    cursor: no-drop;
}

.page-item.active .page-link {
    background-color: #ff9100;
    border-color: #c37003;
}

.selected {
    background: rgba(255, 145, 0, 0.5) !important;
}

.min-height-100vh {
    min-height: 100vh;
}

.product-img-show {
    width: 200px;
    height: 250px;
    margin: 10px;
    border-radius: 5px;
    display: inline-flex;
    border: 1px solid #eee;
    padding: 10px;
}

.offer-img-show {
    width: 100%;
    height: 100px;
    border: 1px solid #eee;
    padding: 5px;
    border-radius: 5px;
}

.offer-image {
    position: relative;
    height: 250px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border-radius: 3px;
}

    .offer-image:before {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        background: rgba(0,0,0,0.1);
        border-radius: 3px;
    }

.offer-text {
    color: #ffffff;
    position: relative;
    font-size: 20px;
    padding: 10px;
    background: #0000004d;
    border-radius: 3px 3px 0px 0px;
}

.offer-showing-box {
    border: 1px solid #d0cfcf;
    border-radius: 5px;
    box-shadow: 0px 1px 2px #d4d4d4;
    background: #fff;
    padding: 5px;
    min-height: 150px;
    display: block;
    transition: ease-in-out 0.3s;
    margin-bottom: 10px;
}

    .offer-showing-box:hover .offer-text {
        color: #FF6F00;
    }

.modal {
    overflow: auto;
}

.remove-btn-additional-product-img {
    position: absolute;
    background: #ffe1e1;
    color: red;
    border-radius: 50px;
    width: 35px;
    height: 35px;
    border: 1px solid red;
    text-align: center;
    padding: 8px;
    margin-left: 0px;
    margin-top: -3px;
    font-weight: bold;
    cursor: pointer;
}
.product-row{
    position: relative;
}
.col-product{
    width: 300px;
    display: inline-block;
    position: relative;
    text-align:center;
}
.product-cat-header-load {
    height: 40px;
    margin: 20px 0px;
    border: 2px solid #ddd;
    border-radius: 5px;
}

.product-box-loading {
    height: 250px;
    border: 2px solid #ddd;
    border-radius: 5px;
    width: 100%;
}

.product-detail-content {
    margin-top: 10px;
    padding: 10px;
}

    .product-detail-content .show-id {
        position: relative;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        /*background: #FF6F00;*/
        height: 17px;
        color: #fff;
        text-decoration: none;
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        min-width: 150px;
        height: 25px;
        margin-bottom: 10px;
    }

        .product-detail-content .show-id:before {
            content: "";
            height: 0;
            width: 0;
            display: block;
            position: absolute;
            top: 0;
            right: -8.5px;
            border-right: 8.5px solid transparent;
            border-left: 8.5px solid transparent;
            z-index: 0;
            right: -12.5px;
            /*border-top: 12.5px solid #FF6F00;
            border-bottom: 12.5px solid #FF6F00;*/
            border-right: 12.5px solid transparent;
            border-left: 12.5px solid transparent;
        }

        .product-detail-content .show-id .inner {
            color: #fff;
            position: relative;
            padding-left: 5px;
            padding-right: 5px;
            line-height: 1.11;
            width: 100%;
            display: -webkit-inline-box;
            display: -ms-inline-flexbox;
            display: inline-flex;
            -webkit-box-pack: justify;
            -ms-flex-pack: justify;
            justify-content: space-between;
            font-size: 16px;
            padding-left: 10px;
            padding-right: 10px;
        }

.product-detail-name {
    font-size: 18px;
}

.product-detail-sub-title {
    margin-bottom: 10px;
    font-size: 16px;
    color: #9e9d9d;
}

.product-detail-price {
    font-size: 18px;
    margin-bottom: 10px;
    color: #ff485a;
}

.detail-panel-btn {
    font-size: 16px;
    margin-bottom: 10px;
}

.add-cart-btn {
    background: #09b109 !important;
}

.product-detail-btn-panel {
    margin-bottom: 20px;
    margin-top: 20px;
}

.product-detail-description {
    padding: 10px;
    background: #eee;
    font-size: 18px;
}

.descrip {
    padding: 10px;
}

.page-nav {
    background: transparent;
    padding: 0;
    margin-bottom: 10px;
    margin-top: -8px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    list-style: none;
    border-radius: .25rem;
}

    .page-nav li a:after {
        content: ">";
        font-family: "themify";
        font-size: 9px;
        margin-left: 8px;
        margin-right: 8px;
    }

    .page-nav li {
        font-size: 12px;
    }

        .page-nav li.active {
            font-weight: 600;
        }

.sub-ctg-link {
    padding: 5px;
    display: inline-block;
    border-radius: 5px;
    font-size: 16px;
    text-align: center;
    width: 100%;
    margin-bottom: 10px;
}

.sub-ctg-icon {
    display: block;
    text-align: center;
    font-size: 40px;
    width: 100%;
    height: 150px;
}

.product-detail-quantity {
    width: 190px;
    margin-bottom: 15px;
}

.quantity-field {
    text-align: center !important;
    background: #fff !important;
}

.qnt-adon:hover {
    cursor: pointer;
}

.cart-item-body {
    display: flex;
    background: #f3f3f4;
    padding: 2px;
    min-height: 65px;
    border: 1px solid #d6d6d6;
    margin: 3px;
}

.cart-item-quantity-panel {
    width: 30px;
    text-align: center;
    height: auto;
    min-height: 50px;
    float: left;
    margin-right: 5px;
}

.item-box {
    display: block;
    text-decoration: none !important;
}

.cart-item-img {
    margin-top: 3px;
    width: 70px;
    display: inline-block;
    float: left;
    border: 1px solid #cccbcb;
    height: 100%;
    border-radius: 5px;
    overflow: hidden;
}

.cart-item-name {
    width: 100%;
    display: inline-block;
    float: left;
    height: auto;
    padding: 2px;
    padding-left: 5px;
}

.cart-item-name-t {
    line-height: 14px;
    display: inline-block;
    width: 180px;
}

.cart-item-per {
    color: #a5a5a5;
    font-size: 11px;
    font-weight: bold;
    width: 100%;
    display: inline-block;
}

.cart-item-total {
    font-weight: bold;
    border-radius: 5px;
    color: #ff1000;
    text-align: right;
    display: inline-block;
    width: 100%;
    font-size: 13px;
}

.cart-item-remove {
    color: red;
    background: #ffd5d5;
    padding: 1px 5px;
    border-radius: 2px;
    width: 20px;
    float: right;
    cursor: pointer;
}

.cart-up-down {
    display: block !important;
    padding: 3px 0px;
}

    .cart-up-down:hover {
        cursor: pointer;
        background: #FF9100;
    }

.form-check-input {
    position: absolute;
    margin-top: 4px;
    margin-left: -1.25rem;
    width: auto;
}

.delivery-chk {
    margin: 10px 0px;
    font-size: 14px;
    background: #eee;
    padding: 5px;
    border-radius: 5px;
}

.form-check-label {
    cursor: pointer;
}

.total-pay {
    font-size: 18px;
    color: #FF6F00;
}

.btn-coupon-apply {
    color: #fff;
    /*background-color: #ff9100;
    border-color: #ff9100;*/
}

.p-unit-name {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.4);
}

.pnl-head {
    border: 1px solid #d0cfcf;
    padding: 10px;
    font-size: 18px;
    background: #e2e2e2;
    color: #7b7b7b;
    cursor: pointer;
    margin: -11px;
    border-bottom: none;
}

    .pnl-head:after {
        content: "\25BC";
        float: right;
        border: 1px solid #7b7b7b;
        padding: 0px 4px;
        border-radius: 3px;
        font-size: 12px;
        color: #7b7b7b;
        position: absolute;
        right: 31px;
        margin-top: 3px;
    }

.pnl-body {
    padding-top: 20px;
    transition: ease-in-out 0.3s;
}

.cart-pay-btn {
    padding: 10px 30px;
    font-size: 18px;
}

.inactive-panel {
    display: none !important;
}

.v-sms-info {
    position: relative;
    top: 15px;
    text-align: center;
}

.payment-section {
    padding: 20px;
    margin-top: 10px;
}

.i-checks {
}

.unavailable-service-msg {
    font-size: 18px;
    text-align: center;
    color: rgba(0, 0, 0, 0.24);
    margin-top: 20px;
}

.verification-success-msg {
    padding: 10px;
    margin-top: 20px;
    font-size: 18px;
    color: #00c100;
}

.cart-item-showing-panel {
    position: relative;
    padding: 0px;
}

.help-line-panel {
    background-image: url(../images/black-back.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-block;
    width: 100%;
    padding: 10px;
    text-align: center;
    margin: 10px 0px;
    /*border: 2px solid #ff9100;*/
    border-radius: 10px;
    color: #fff;
    max-width: 300px;
}

.help-img {
    float: left;
    padding: 10px;
    font-size: 40px;
}

.help-text {
    font-size: 20px;
}

.help-number {
    font-size: 30px;
}

.offer-img {
    width: 100%;
    height: 100%;
}

.offer-box {
    margin-bottom: 20px;
    display: block;
    max-height: 150px;
    border-radius: 5px;
    overflow: hidden;
}

.order-status-for-profile {
    display: inline-block;
    width: auto;
    position: absolute;
    right: 45px;
    margin-top: -5px;
}

.profile-order-card {
    margin-bottom: 10px;
}

.profile-order-card-body {
    padding: 10px;
}

.cart-item-count-bottom {
    left: 5px;
    background: #eee;
    top: 3px;
    color: #fff;
    padding: 1px;
}

.cart-inside-total-count {
    position: initial;
    background: none !important;
    color: #ff3434;
    font-size: 16px;
}
/*FOOTER*/

footer {
    background: #16222A;
    background: -webkit-linear-gradient(59deg, #3A6073, #16222A);
    background: linear-gradient(59deg, #3A6073, #16222A);
    color: white;
    margin-top: 20px;
    position: absolute;
    width: 100%;
}

    footer a {
        color: #fff;
        font-size: 14px;
        transition-duration: 0.2s;
    }

        footer a:hover {
            color: #FA944B;
            text-decoration: none;
        }

.copy {
    font-size: 12px;
    padding: 10px;
    border-top: 1px solid #FFFFFF;
}

.footer-middle {
    padding-top: 2em;
    color: white;
}


/*SOCİAL İCONS*/

/* footer social icons */

ul.social-network {
    list-style: none;
    display: inline;
    margin-left: 0 !important;
    padding: 0;
}

    ul.social-network li {
        display: inline;
        margin: 0 5px;
    }

.footer-pad-first {
    padding-right: 15px;
}

.footer-tagline {
    text-align: justify;
}

.pay-witdh-img {
    width: 100%;
}

.footer-seperator {
    margin: 10px;
}
/* footer social icons */

.social-network a.icoFacebook:hover {
    background-color: #3B5998;
}

.social-network a.icoLinkedin:hover {
    background-color: #007bb7;
}

.social-network a.icoYoutube:hover {
    background-color: red;
}

    .social-network a.icoFacebook:hover i,
    .social-network a.icoLinkedin:hover i,
    .social-network a.icoYoutube:hover i {
        color: #fff;
    }

.social-network a.socialIcon:hover,
.socialHoverClass {
    color: #44BCDD;
}

.social-circle li a {
    display: inline-block;
    position: relative;
    margin: 0 auto 0 auto;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
    text-align: center;
    width: 30px;
    height: 30px;
    font-size: 15px;
}

.social-circle li i {
    margin: 0;
    line-height: 30px;
    text-align: center;
}

.social-circle li a:hover i,
.triggeredHover {
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -ms--transform: rotate(360deg);
    transform: rotate(360deg);
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    -ms-transition: all 0.2s;
    transition: all 0.2s;
}

.social-circle i {
    color: #595959;
    -webkit-transition: all 0.8s;
    -moz-transition: all 0.8s;
    -o-transition: all 0.8s;
    -ms-transition: all 0.8s;
    transition: all 0.8s;
}

.social-network a {
    background-color: #F9F9F9;
}

/*Status*/
.order-status {
    padding: 5px;
    border-radius: 5px;
}

.order-status-new {
    background: rgba(255, 145, 0, 0.5);
}

.order-status-processing {
    background: rgba(65, 208, 230, 0.5);
}

.order-status-on-the-way {
    background: rgba(183, 141, 253, 0.5);
}

.order-status-success {
    background: rgba(40, 167, 69, 0.5);
}

.order-status-cancel {
    background: rgba(160, 160, 160, 0.5);
}

.order-status-return {
    background: rgba(251, 102, 116, 0.5);
}

.order-id-admin-show {
}

.btn-cust-panel {
    padding: 5px;
    text-align: center;
    border-bottom: 1px solid #dddddd;
    background: #ffffff;
    margin-bottom: 10px;
}

.btn-cust { /*dent around button*/
    display: inline-block;
    position: relative;
    text-decoration: none;
    color: rgba(3, 169, 244, 0.54);
    width: 100px;
    height: 100px;
    border-radius: 50%;
    text-align: center;
    background: #efefef;
    box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.08);
    margin-bottom: 30px;
    color: rgba(0, 0, 0, 0.6);
}

    .btn-cust:hover { /*dent around button*/
        color: #FF6F00 !important;
    }

    .btn-cust .count { /*Button itself*/
        position: absolute;
        content: '';
        width: 80px;
        height: 80px;
        line-height: 80px;
        vertical-align: middle;
        left: 10px;
        top: 9px;
        border-radius: 50%;
        font-size: 20px;
        background-image: -webkit-linear-gradient(#e8e8e8 0%, #dadada 100%);
        background-image: linear-gradient(#e8e8e8 0%, #dadada 100%);
        text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.66);
        box-shadow: inset 0 2px 0 rgba(255,255,255,0.5), 0 2px 2px rgba(0, 0, 0, 0.19);
        border-bottom: solid 2px #b5b5b5;
    }

        .btn-cust .count:active {
            background-image: -webkit-linear-gradient(#efefef 0%, #9c9c9c 100%);
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.5), 0 2px 2px rgba(0, 0, 0, 0.19);
            border-bottom: solid 2px #828282;
        }

    .btn-cust .active {
        background-image: -webkit-linear-gradient(#efefef 0%, #ff9100 100%);
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.5), 0 2px 2px rgba(0, 0, 0, 0.19);
        border-bottom: solid 2px #828282;
        text-shadow: 1px 1px 1px rgba(68, 68, 68, 0.85);
    }

    .btn-cust .btn-cust-label {
        position: relative;
        top: 100px;
        font-size: 16px;
    }

.btn-cust-new {
    color: rgba(255, 145, 0, 1);
}

.btn-cust-processing {
    color: rgba(65, 208, 230, 1);
}

.btn-cust-on-the-way {
    color: rgba(183, 141, 253, 1);
}

.btn-cust-success {
    color: rgba(40, 167, 69, 1);
}

.btn-cust-cancel {
    color: rgba(160, 160, 160, 1);
}

.btn-cust-return {
    color: rgba(251, 102, 116, 1);
}

.showing-res {
    padding: 5px;
    font-weight: bold;
}

.tb-top-bar {
    display: table-cell;
}

.prod-panel-ord {
    background: #efefef;
    margin-bottom: 10px;
    border-radius: 5px;
    padding: 5px;
    display: flex;
}

.prod-img-ord {
    width: 20%;
    display: inline-block;
    border: 1px solid #eee;
    border-radius: 5px;
    float: left;
}

.prod-dtl-ord {
    display: inline-block;
    position: relative;
    width: 80%;
    padding-left: 5px;
}

.prod-name-ord {
    font-size: 15px;
}

.prod-total-items-ord {
    background: #d6d6d6;
    padding: 5px;
    margin-bottom: 5px;
    font-size: 18px;
}

.prod-price-ord {
    margin-bottom: 5px;
}

.order-view-info-sec {
    border: 1px solid #eee;
    margin: 5px;
    padding: 5px;
    border-radius: 5px;
    font-size: 15px;
    margin-top: 0px;
}

.your-order-loading {
    height: 40px;
    border-radius: 5px;
    margin-bottom: 20px;
}

.old-price-show {
    color: #adadad;
    text-decoration: line-through;
    padding-right: 10px;
}

.offer-batch {
    width: 200px;
    height: 200px;
    overflow: hidden;
    position: absolute;
    margin: 13px;
    top: -12px;
    right: -7px;
}

.offer-batch-tag {
    display: block;
    width: 120px;
    height: 24px;
    background-color: #ff910080;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    text-align: center;
    line-height: 24px;
    right: -26px;
    top: 22px;
    font-family: arial;
    font-size: 13px;
}

.sold-out {
    position: relative;
    top: -50%;
    text-align: center;
    width: 100%;
    color: red;
    font-size: 25px;
    background: #ff910080;
}

.sold-out-for-detail {
    max-width: 150px;
    position: absolute;
    left: 20px;
    top: 10px;
}

.ctg-thumb {
    width: 50px;
    height: 40px;
    margin-right: 10px;
}



/*container*/
/*@media (min-width: 576px) {
    .container {
        max-width: 540px;
    }
}

@media (min-width: 768px) {
}

.container {
    max-width: 720px;
}

@media (min-width: 992px) {
}

.container {
    max-width: 960px;
}

@media (min-width: 1200px) {
}

.container {
    max-width: 1140px;
}

@media (min-width: 1280px) {
    .container {
        width: 1230px;
        max-width: 1230px;
    }
}*/

/* REQUIRED for core functionality */

.responsive-tabs__heading {
    display: none;
}

.responsive-tabs__list__item {
    display: inline;
    cursor: pointer;
}

.videoEmbed iframe {
    width: 100% !important;
}

.carousel-fade .carousel-item {
    opacity: 0;
    transition-duration: .6s;
    transition-property: opacity;
}

    .carousel-fade .carousel-item.active,
    .carousel-fade .carousel-item-next.carousel-item-left,
    .carousel-fade .carousel-item-prev.carousel-item-right {
        opacity: 1;
    }

.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-right {
    opacity: 0;
}

.carousel-fade .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-prev {
    transform: translateX(0);
    transform: translate3d(0, 0, 0);
}

.disable-div {
    pointer-events: none;
    opacity: 0.4;
}

.switch-group {
    display: block;
    position: sticky;
    margin-bottom: 10px;
}

.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 20px;
    margin-bottom: 0px;
}

    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 17px;
        width: 17px;
        left: 2px;
        bottom: 2px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider {
    background-color: #2196F3;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
    -webkit-transform: translateX(39px);
    -ms-transform: translateX(39px);
    transform: translateX(39px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }

/* END - Optional - Basic Skin */
.load-animate {
    -webkit-animation: load 1s linear infinite;
    animation: load 1s linear infinite;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    background: #dddddd;
    background-image: -webkit-gradient(linear, left top, right top, from(#dddddd), color-stop(20%, #f5f5f5), color-stop(40%, #efefef), to(#dddddd));
    background-image: linear-gradient(left, #dddddd 0%, #f5f5f5 20%, #efefef 40%, #dddddd 100%);
    background-repeat: no-repeat;
    background-size: cover;
}

    .load-animate.profile-pic {
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
    }

@-webkit-keyframes load {
    0% {
        background-position: -680px 0;
    }

    100% {
        background-position: 680px 0;
    }
}

@keyframes load {
    0% {
        background-position: -680px 0;
    }

    100% {
        background-position: 680px 0;
    }
}

@-webkit-keyframes load-image {
    0% {
        background-position: -680px 0;
    }

    100% {
        background-position: 680px 0;
    }
}

@keyframes load-image {
    0% {
        background-position: -680px 0;
    }

    100% {
        background-position: 680px 0;
    }
}

.intro-banner-vdo-play-btn {
    position: relative;
    top: -50px;
    z-index: 99;
    left: -4px;
}

.pinkBg {
    background-color: #ff9100 !important;
    background-image: linear-gradient(90deg, #ff9100, #ff3b00);
}

.intro-banner-vdo-play-btn .ripple {
    position: absolute;
    width: 50px;
    height: 50px;
    left: 0;
    top: 0;
    opacity: 0;
    border-radius: 100px;
    -webkit-animation: ripple 1.8s infinite;
    animation: ripple 1.8s infinite;
}

    .intro-banner-vdo-play-btn .ripple:nth-child(2) {
        animation-delay: 0.3s;
        -webkit-animation-delay: 0.3s;
    }

    .intro-banner-vdo-play-btn .ripple:nth-child(3) {
        animation-delay: 0.6s;
        -webkit-animation-delay: 0.6s;
    }

@-webkit-keyframes ripple {
    0% {
        opacity: 1;
        -webkit-transform: scale(0);
        transform: scale(0);
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@keyframes ripple {
    0% {
        opacity: 1;
        -webkit-transform: scale(0);
        transform: scale(0);
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}