/*
    My STYLE
*/

/* arabic */

@font-face {
    font-family: 'Tajawal';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/Tajawal/Tajawal-Medium.ttf);
    unicode-range: U+0600-06FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE80-FEFC;
}

/* latin */

@font-face {
    font-family: 'Tajawal';
    font-style: normal;
    font-weight: 400;
    src: url(../fonts/Tajawal/Tajawal-Medium.ttf);
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

body {
    font-family: Tajawal;
    overflow-x: hidden;
    direction: rtl;
    background-color: #F0F0F0;
}

/* Start Public styles */

@media (min-width: 1240px) {
    .container {
        max-width: 1200px;
    }
}

.dropdown-menu-left {
    right: auto !important;
    left: 0 !important;
}

.pre-wrap {
    white-space: pre-wrap;
    word-wrap: break-word;
}

.no-wrap {
    white-space: nowrap;
}

.editor-content img {
    max-width: 100% !important;
}

.box-list, .box-list-withou-hover {
    margin-bottom: 2px;
}

.box-list a, .box-list-withou-hover a {
    text-decoration: none !important;
    color: #2386C8;
}

.box-list a:hover, .box-list-withou-hover a:hover {
    color: #185a87;
}

.box-list:hover {
    background-color: #F5F5F5 !important;
}

.f-15px {
    font-size: 15px !important;
}

.f-18px {
    font-size: 18px !important;
}

.label-state {
    font-size: 14px;
    padding: 3px 5px;
}

.box-list small, .box-list-withou-hover small {
    font-size: 90%;
}

.border-b {
    border-bottom: 1px solid #EEE;
}

.progress-sm {
    height: 7px;
}

.icon-item {
    width: 30px;
    text-align: center;
    display: inline-block;
}

.card-shadow {
    border: none;
    box-shadow: -3px 9px 22px rgba(0, 0, 0, 0.16);
}

.label {
    display: inline;
    padding: .2em .6em .3em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25em;
}

.w-50px {
    width: 50px !important;
}

.w-75px {
    width: 75px !important;
}

.w-100px {
    width: 100px !important;
}

.w-125px {
    width: 125px !important;
}

.w-150px {
    width: 150px !important;
}

.w-200px {
    width: 200px !important;
}

.w-300px {
    width: 300px !important;
}

.overflow-y-scroll {
    overflow-y: auto;
}

.direction-ltr {
    direction: ltr !important;
}

.direction-rtl {
    direction: rtl !important;
}

.custom-control-label::before, .custom-control-label::after {
    right: -1.5rem;
}

.custom-control-label-center::before, .custom-control-label-center::after {
    margin-right: auto;
    margin-left: auto;
}

.custom-select.is-valid, .was-validated .custom-select:valid, .custom-select.is-invalid, .was-validated .custom-select:invalid {
    padding-left: 1.75rem;
    padding-right: 2.25rem;
    background-position: left 0.5rem center, center right .6rem !important;
}

.input-group>.custom-select:not(:last-child), .input-group>.form-control:not(:last-child) {
    border-top-right-radius: .25rem;
    border-bottom-right-radius: .25rem;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.input-group>.input-group-append>.btn, .input-group>.input-group-append>.input-group-text, .input-group>.input-group-prepend:first-child>.btn:not(:first-child), .input-group>.input-group-prepend:first-child>.input-group-text:not(:first-child), .input-group>.input-group-prepend:not(:first-child)>.btn, .input-group>.input-group-prepend:not(:first-child)>.input-group-text {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: .25rem;
    border-bottom-left-radius: .25rem;
}

.table-center td, .table-center th {
    vertical-align: middle;
    text-align: center;
}

.alert {
    padding-left: 3rem;
    padding-right: 1.25rem;
}

.alert>button {
    left: 0;
    right: unset !important;
}

.alert>ul {
    padding-right: 20px
}

.pagination-center .pagination {
    justify-content: center;
}

.custom-file-label {
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-left: 70px;
}

.custom-file-label::after {
    left: 0;
    right: unset;
    border-left: none;
    border-right: inherit;
    border-radius: .25rem 0 0 .25rem;
    content: "تصفح";
}

.country-img-avatar {
    width: 60px;
    height: 40px;
}

/* End Public styles */

/* Start loadding (spinner) style */

.loader {
    position: relative;
}

.loader .loader-shape {
    border: 15px solid #f3f3f3;
    border-radius: 50%;
    border-top: 15px solid #3498db;
    width: 100px;
    height: 100px;
    -webkit-animation: spin 2s linear infinite;
    /* Safari */
    animation: spin 2s linear infinite;
}

.loader .loader-value {
    position: absolute;
    top: 32px;
    width: 100%;
    right: 0;
    font-size: 24px;
}

/* End loadding (spinner) style */

/* Safari */

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* End loadding style */

/*  Start tags-input    */

.tags-input {
    position: relative;
}

.tags-input .selected-items[data-placeholder]:not([data-placeholder=""]):empty::before {
    content: attr(data-placeholder);
    color: #888;
    margin: 2px 5px;
}

.tags-input .selected-items {
    display: flex;
    flex-wrap: wrap;
    min-height: 38px;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    -webkit-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    -moz-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    -ms-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    -o-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.was-validated .tags-input .selected-items {
    padding-right: 30px !important;
    background-repeat: no-repeat;
    background-position: top calc(.375em + .1875rem) right calc(.375em + .1875rem);
    background-size: calc(.75em + .375rem) calc(.75em + .375rem);
}

.was-validated .tags-input .selected-items:empty, .was-validated .tags-input .selected-items.invalid {
    border-color: #dc3545;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='%23dc3545' viewBox='-2 -2 7 7'%3e%3cpath stroke='%23dc3545' d='M0 0l3 3m0-3L0 3'/%3e%3ccircle r='.5'/%3e%3ccircle cx='3' r='.5'/%3e%3ccircle cy='3' r='.5'/%3e%3ccircle cx='3' cy='3' r='.5'/%3e%3c/svg%3E");
}

.was-validated .tags-input .selected-items:empty~.invalid-feedback, .was-validated .tags-input .selected-items.invalid~.invalid-feedback {
    display: block;
}

.was-validated .tags-input .selected-items.valid {
    border-color: #28a745;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
}

.tags-input .selected-items .badge {
    font-size: inherit;
    font-weight: inherit;
    margin: 2px;
}

.tags-input .selected-items .badge i {
    cursor: pointer;
}

.tags-input .tags-list {
    position: absolute;
    top: 100%;
    margin-top: 4px;
    width: 100%;
    z-index: 999;
    padding: 0;
    overflow: auto;
    max-height: 300px;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: 0;
    box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
    display: none;
    transition: .3s all;
    -webkit-transition: .3s all;
    -moz-transition: .3s all;
    -ms-transition: .3s all;
    -o-transition: .3s all;
}

.tags-input:focus .tags-list {
    display: block;
}

.tags-input .tags-list .tag-item {
    padding: 5px;
    transition: .05s all;
    -webkit-transition: .05s all;
    -moz-transition: .05s all;
    -ms-transition: .05s all;
    -o-transition: .05s all;
}

.tags-input .tags-list .tag-item:hover {
    background-color: #007bff;
    color: #fff;
    cursor: pointer;
}

/*  End tags-input    */

/*  Start image-upload */

.image-upload {
    position: relative;
}

.image-upload .image-upload-delete {
    position: absolute;
    top: -10px;
    left: -10px;
    background: #fb404b;
    color: #fff;
    padding: 1px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    text-align: center;
    cursor: pointer;
    z-index: 9;
}

.image-upload .image-upload-delete:hover {
    opacity: 0.85;
}

.image-upload .img-box {
    height: 190px;
    cursor: pointer;
}

.image-upload .img-box img {
    object-fit: cover;
    object-position: center;
}

.image-upload .img-input {
    position: absolute;
    top: calc(100% - 50px);
    opacity: 0;
    height: 1px;
}

/*  End image-upload */

/*  Start navbar */

.navbar-cp.navbar-dark .navbar-toggler {
    border-color: rgb(240, 240, 240, .5);
}

.navbar-cp.navbar-dark .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgb(240, 240, 240)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.navbar-cp .navbar-nav .nav-link {
    color: #fff;
}

.navbar-cp .dropdown-toggle::after {
    vertical-align: .155em;
    margin-right: .255em;
}

.navbar-cp .navbar-nav .nav-item.dropdown .dropdown-menu {
    text-align: right;
    margin-top: 0;
    transition: 3s all linear;
    -webkit-transition: 3s all linear;
    -moz-transition: 3s all linear;
    -ms-transition: 3s all linear;
    -o-transition: 3s all linear;
}

.navbar-cp .navbar-nav .nav-item.dropdown:hover .dropdown-menu {
    display: block;
}

.navbar-cp .dropdown-menu {
    right: 0;
    left: unset;
}

.navbar-cp .dropdown-item {
    padding-right: 10px;
}

.navbar-cp .navbar-nav .icon {
    display: inline-block;
    vertical-align: middle;
    width: 24px;
    text-align: center;
}

.navbar-cp .navbar-nav .dropdown .dropdown-item .icon {
    color: #565;
}

/*  End navbar  */

/* Start buttong go to top */

#btn-go-top {
    display: none;
    position: fixed;
    bottom: 30px;
    left: 30px;
    padding-top: 12px;
    padding-bottom: 12px;
    z-index: 99;
    border: none;
    outline: none;
    opacity: .7;
    cursor: pointer;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
}

#btn-go-top:hover {
    opacity: .9;
}

/*  End buttong go to top */

/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */

#sidebar {
    width: 250px;
    position: fixed;
    top: 0;
    right: -250px;
    height: 100vh;
    z-index: 999;
    transition: all 0.3s;
    overflow: hidden;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
}

#sidebar.active {
    right: 0;
}

#sidebar #dismiss {
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    position: absolute;
    top: 10px;
    left: 10px;
    cursor: pointer;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

#sidebar>ul {
    height: calc(100% - 70px);
}

#sidebar ul {
    padding-right: 0;
    overflow-x: hidden;
}

#sidebar>ul>li:last-of-type {
    margin-bottom: 25px;
}

#sidebar a, #sidebar a:hover, #sidebar a:focus {
    color: inherit;
    text-decoration: none;
    transition: all 0.3s;
}

#sidebar ul li a {
    padding: 10px;
    font-size: 1.1em;
    display: block;
}

#sidebar ul li a:hover {
    color: #185a87;
    background: #E8EAED;
}

#sidebar ul ul li a {
    padding-right: 30px;
}

#sidebar .icon {
    width: 24px;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    color: #565;
}

#sidebar a:hover .icon {
    color: inherit;
}

#sidebar .dropdown-toggle {
    position: relative;
}

#sidebar .dropdown-toggle::after {
    display: block;
    position: absolute;
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}

#sidebar ul ul a {
    font-size: 1em !important;
    padding-right: 30px;
}

.overlay {
    display: none;
    position: fixed;
    top: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.7);
    z-index: 998;
    opacity: 0;
    transition: all 0.5s ease-in-out;
}

.overlay.active {
    display: block;
    opacity: 1;
}

/* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */

#content {
    width: 100%;
    min-height: 100vh;
    transition: all 0.3s;
}

/*  Start Statistics */

.statistics .statistics-counts a.card-body::before {
    position: absolute;
    content: '';
    right: -5px;
    top: 10px;
    bottom: 10px;
    width: 5px;
    background-color: #007bff;
    transition: .2s all;
    -webkit-transition: .2s all;
    -moz-transition: .2s all;
    -ms-transition: .2s all;
    -o-transition: .2s all;
    border-radius: 0 10px 10px 0;
    -webkit-border-radius: 0 10px 10px 0;
    -moz-border-radius: 0 10px 10px 0;
    -ms-border-radius: 0 10px 10px 0;
    -o-border-radius: 0 10px 10px 0;
}

.statistics .statistics-counts a.card-body:hover::before {
    width: 7px;
    top: 0;
    bottom: 0;
    border-radius: 0 6px 6px 0;
    -webkit-border-radius: 0 6px 6px 0;
    -moz-border-radius: 0 6px 6px 0;
    -ms-border-radius: 0 6px 6px 0;
    -o-border-radius: 0 6px 6px 0;
}

.statistics .statistics-counts a.card-body {
    text-decoration: none;
    position: relative;
    color: #333;
}

.statistics .statistics-counts i {
    color: #576777;
    font-size: 2.5rem;
}

/*  End Statistics */

/*  Start Customers */

/* Start flip-card */

.flip-card {
    background-color: transparent;
    height: 220px;
    border-bottom: 1px solid #ddd;
    perspective: 1000px;
    /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */

.flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transform-style: preserve-3d;
    transition: all linear 0.8s;
    -webkit-transition: all linear 0.8s;
    -moz-transition: all linear 0.8s;
    -ms-transition: all linear 0.8s;
    -o-transition: all linear 0.8s;
}

.flip-card:hover .flip-card-inner {
    transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
}

/* Position the front and back side */

.flip-card-front, .flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #fff;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    overflow: hidden;
}

.flip-card-front {
    transition: all linear .4s;
    -webkit-transition: all linear .4s;
    -moz-transition: all linear .4s;
    -ms-transition: all linear .4s;
    -o-transition: all linear .4s;
}

.flip-card-back {
    transform: rotateY(180deg);
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
}

/* End flip-card */

/*  Start customer-card */

.customer-card {
    border: none;
    height: 100%;
    box-shadow: -3px 9px 22px rgba(0, 0, 0, 0.16);
    border-right: 4px solid;
}

.customer-card.active {
    border-right-color: #007bff;
}

.customer-card.new {
    border-right-color: #28a745;
}

.customer-card.disable {
    border-right-color: #f44336;
}

.customer-card .customer-img {
    margin: 30px auto 0;
    width: 160px;
    height: 160px;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

.list-with-icon {
    list-style: none;
    text-align: right;
    padding: 0;
}

.list-with-icon li {
    position: relative;
    padding-right: 30px;
    margin-bottom: 5px;
}

.list-with-icon li .item-icon {
    position: absolute;
    right: 0;
    top: 0;
    display: inline-block;
    text-align: center;
    width: 30px;
}

/*  End customer-card   */

.label-state.active {
    background-color: #007bff;
}

.label-state.new {
    background-color: #28a745;
}

.label-state.disable {
    background-color: #f44336;
}

.my-nav-tabs .active {
    border-top: 3px solid #007bff !important;
    border-radius: 0 !important;
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    -ms-border-radius: 0 !important;
    -o-border-radius: 0 !important;
}

.avatar-customer {
    width: 150px !important;
    height: 150px !important;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

/*  End customers   */

/*  Start Addresses   */

.table-address-info td:first-of-type {
    text-align: right;
    font-weight: bold;
}

.table-address-info td:nth-child(2) {
    text-align: center;
}

.table-address-info td:nth-child(3) {
    text-align: left;
    font-weight: bold;
}

.address-type-icon {
    width: 62px;
    height: 40px;
    display: inline-block;
    text-align: center;
}

/*  End Addresses   */

.border-state-active {
    border-right: 4px solid #007bff !important;
}

.border-state-disable {
    border-right: 4px solid #f44336 !important;
}

/*  Start invoices  */

.avatar-invoice-item {
    width: 164px !important;
    height: 140px !important;
}

.comments .media {
    border-bottom: 1px solid rgba(0, 0, 0, .125);
}

.comments .media.customer {
    border-right: 5px solid #007bff;
}

/*  End invoices    */

/* Start Purchase orders */

.orders-list li {
    border-bottom: 2px solid #E9ECEF;
}

.orders-list li:nth-of-type(even) {
    background-color: #f9f9f9;
}

.orders-list li .item-order {
    padding-top: 40px;
}

.orders-list .item-control-buttons {
    padding-top: 40px;
}

.order-item-color {
    padding: 2px;
    background-color: #fff;
}

/* End Purchase orders */

/* ---------------------------------------------------
    Posts styles
----------------------------------------------------- */

/*  Start box-posts  */

.overly {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    /* for edge and internet Explorer*/
    background-color: rgba(0, 0, 0, 0.733);
    background-color: #000b;
}

.box-posts {
    position: relative;
}

.box-posts .post-img {
    position: relative;
    overflow: hidden;
}

.box-posts .overly {
    opacity: .25;
}

.box-posts .post-img img {
    width: 100%;
    height: auto;
    transition: .5s all;
    -webkit-transition: .5s all;
    -moz-transition: .5s all;
    -ms-transition: .5s all;
    -o-transition: .5s all;
}

.box-posts .post-img:hover img {
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
}

.box-posts .post-flag {
    position: absolute;
    top: 0;
    right: 5px;
}

.box-posts .post-flag::after {
    border-width: 0 0 10px 10px;
    border-color: transparent transparent transparent #333a;
    right: 0px;
    content: '';
    position: absolute;
    top: 24px;
    border-style: solid;
}

.box-posts .post-date {
    position: absolute;
    right: 0;
    bottom: 0;
    background-color: #007bff;
    display: block;
    padding: 2px 10px;
    color: #fff;
}

.box-posts .post-edit {
    position: absolute;
    left: 15px;
    top: 15px;
    color: #fff;
}

.box-posts .post-title {
    margin-top: 5px;
}

.box-posts .post-title a {
    text-decoration: none;
    color: #111;
    transition: .2s all;
    -webkit-transition: .2s all;
    -moz-transition: .2s all;
    -ms-transition: .2s all;
    -o-transition: .2s all;
}

.box-posts .post-title a:hover {
    color: #007bff;
}

.box-posts .post-tags {
    list-style: none;
    margin: 0;
    overflow: hidden;
    padding: 0;
}

.box-posts .post-tags li, .box-posts .post-tags .tag {
    /* float: right; */
    display: inline-block;
}

.box-posts .post-tags .tag {
    background: #007bff;
    color: #fff;
    display: inline-block;
    height: 26px;
    line-height: 26px;
    padding: 0 18px 0 8px;
    position: relative;
    margin: 0 0 10px 10px;
    text-decoration: none;
    border-radius: 0 3px 3px 0;
    -webkit-border-radius: 0 3px 3px 0;
    -moz-border-radius: 0 3px 3px 0;
    -ms-border-radius: 0 3px 3px 0;
    -o-border-radius: 0 3px 3px 0;
    transition: .2s all;
    -webkit-transition: .2s all;
    -moz-transition: .2s all;
    -ms-transition: .2s all;
    -o-transition: .2s all;
}

.box-posts .post-tags .tag::before {
    background: #fff;
    border-radius: 10px;
    box-shadow: inset 0 1px rgba(0, 0, 0, 0.25);
    content: '';
    height: 6px;
    right: 8px;
    position: absolute;
    width: 6px;
    top: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}

.box-posts .post-tags .tag::after {
    border-bottom: 13px solid transparent;
    border-right: 10px solid #007bff;
    border-top: 13px solid transparent;
    content: '';
    position: absolute;
    right: 100%;
    top: 0;
}

.box-posts .post-tags .tag:hover {
    opacity: .8;
}

.box-posts .post-tags .tag:hover::after {
    border-left-color: fff;
}

/*    End box-posts    */

/*  Start last-posts    */

.last-posts .box-img {
    position: relative;
    overflow: hidden;
}

.last-posts .box-img img {
    transition: .3s all linear;
    -webkit-transition: .3s all linear;
    -moz-transition: .3s all linear;
    -ms-transition: .3s all linear;
    -o-transition: .3s all linear;
}

.last-posts .box-img:hover img {
    transform: scale(1.2);
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
}

.last-posts .box-img .overly {
    opacity: .5;
}

.last-posts a {
    text-decoration: none;
}

/*  End last-posts    */

/* ---------------------------------------------------
    START WRAPPER CLIENT STYLE
----------------------------------------------------- */

/*  Start client-sidebar   */

.client-wrapper #client-sidebar {
    position: fixed;
    width: 250px;
    top: 0;
    right: 0;
    height: 100vh;
    z-index: 999;
    transition: all 0.3s;
    overflow: hidden;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
}

.client-wrapper.active-full #client-sidebar {
    right: -250px;
}

.client-wrapper #client-sidebar a, .client-wrapper #client-sidebar a:hover, .client-wrapper #client-sidebar a:focus {
    color: inherit;
    text-decoration: none;
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
}

.client-wrapper #client-sidebar ul {
    padding-right: 0;
    overflow-x: hidden;
    height: 100%;
    padding-bottom: 40px;
}

.client-wrapper #client-sidebar ul li a {
    padding: 10px;
    font-size: 1.1em;
    display: block;
}

.client-wrapper #client-sidebar ul li a:hover, .client-wrapper #client-sidebar ul li a.active {
    color: #185a87;
    background: #f8f9fc;
}

.client-wrapper #client-sidebar ul ul li a {
    padding-right: 30px;
}

.client-wrapper #client-sidebar .icon {
    width: 24px;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
}

.client-wrapper #client-sidebar .dropdown-toggle {
    position: relative;
}

.client-wrapper #client-sidebar .dropdown-toggle::after {
    display: block;
    position: absolute;
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}

.client-wrapper #client-sidebar ul ul a {
    font-size: 1em !important;
    padding-right: 30px;
}

/*  End client-sidebar   */

/* Start client-content  */

.client-wrapper #client-content {
    width: 100%;
    min-height: 100vh;
    background-color: #f8f9fc;
    padding-right: 250px;
    overflow-x: hidden;
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
}

.client-wrapper.active-full #client-content {
    padding-right: 0;
}

.client-wrapper #client-content .notifications>a {
    position: relative;
}

.client-wrapper #client-content .notifications>a i {
    font-size: 1.5em;
}

.client-wrapper #client-content .notifications>a .notifications-count {
    position: absolute;
    top: 5px;
    right: 2px;
    background-color: #007bff;
    color: #fff;
    line-height: 1;
    border-radius: 50%;
    padding: 1px 5px;
    font-size: 90%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

.client-wrapper #client-content .notifications .dropdown-menu {
    width: 320px;
    padding-top: 0;
    padding-bottom: 0;
    overflow-x: hidden;
}

@media(max-width: 400px) {
    .client-wrapper #client-content .notifications .dropdown-menu {
        left: -50px !important;
    }
}

.client-wrapper #client-content .notifications .dropdown-menu .notifications-list {
    max-height: calc(80vh - 110px);
    overflow-x: hidden;
    overflow-y: auto;
}

.client-wrapper #client-content .notifications .dropdown-menu .dropdown-item {
    border-bottom: 1px solid #e9ecef;
    padding-top: 1rem;
    padding-bottom: 1rem;
    white-space: normal;
    font-size: 90%;
}

.client-wrapper #client-content .notifications .dropdown-menu .dropdown-item:last-of-type {
    border-bottom: none;
}

.client-wrapper #client-content .navbar .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgb(125, 125, 125)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.client-wrapper #client-content .navbar .dropdown-toggle::after {
    content: unset;
}

/* End client-content  */

/* Start statistical-card */

.statistics-card .statistics-card-count {
    font-size: 70px;
}

/* End statistical-card */

/*  Start Messages */

.message-info .info-icon {
    width: 24px;
    display: inline-block;
    text-align: center;
}

/*  End Messages */

/* Start notifications-page */

.notifications-page .notification-icon {
    width: 60px;
    height: 60px;
    border: 3px solid #eee;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #718089;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

/* End notifications-page */