/* theme-rtl fixes*/
.fa-li {
    right: -2em;
    position: absolute;
    text-align: center;
    width: 2em;
    line-height: inherit;
}

.fa-ul {
    list-style-type: none;
    margin-right: 1.5em !important;
    padding-right: 0;
    margin-left: 0 !important;
}

.accordion-2 li .accordion__title {
    padding-right: 0;
}

.wizard > .steps li:first-child a::after {
    right: 50%;
    left: inherit;
}

.wizard > .steps li:last-child a::after {
    left: 50%;
    right: inherit;
}

.wizard > .content {
    background: #ffffff;
    border: none;
}


    .wizard > .content .table td a {
        color: #000;
        font-size: 16px;
        text-decoration: none;
    }

        .wizard > .content .table td a:hover {
            color: #0062d0;
        }

    .wizard > .content .table td small {
        font-size: 13px;
        color: #777;
    }

    .wizard > .content > .body input.error, .wizard > .content > .body textarea.error {
        background: rgb(251, 227, 228);
        border: 1px solid #fbc2c4;
        color: #ed1c24;
    }

    .wizard > .content > .body label.error {
        color: #ed1c24;
    }


.color--success {
    color: #008f26 !important
}

.color--danger, .color--error {
    color: #ed1c24 !important
}

.float-end {
    float: left;
}


.tabs-container.tabs--vertical {
    overflow: visible;
}

    .tabs-container.tabs--vertical .tabs {
        width: 20%;
    }

    .tabs-container.tabs--vertical .tabs-content {
        width: calc( 80% - 20px );
    }

.tabs li:not(:last-child) {
    border-left: 1px solid #ECECEC;
    border-right: none;
}

.tabs--vertical .tabs {
    border: 1px solid #ECECEC;
    border-radius: 5px;
    margin-bottom: 5px;
}

    .tabs--vertical .tabs li:not(:last-child) {
        border-bottom: 0px;
    }


.tabs--vertical .tabs {
}

    .tabs--vertical .tabs li.active {
        background: #1aba17;
        position: relative;
        border-radius: 5px;
        box-shadow: -2px 1px 2px rgba(0,0,0,0.1)
    }

    .tabs--vertical .tabs li .tab__title i {
        color: #777;
        font-size: 2em;
        display: block;
    }

    .tabs--vertical .tabs li .tab__title span {
        color: #777;
        font-size: 1.2em;
        font-weight: bold;
    }

    .tabs--vertical .tabs li.active span, .tabs--vertical .tabs li.active i {
        color: #fff;
    }

    .tabs--vertical .tabs li.active:after {
        content: '';
        position: absolute;
        left: -10px;
        top: calc( 50% - 10px);
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-right: 10px solid #1aba17;
    }


.tabs--vertical .tabs-content > li.active {
    animation: fadeIn .5s ease forwards;
    -webkit-animation: fadeIn .5s ease forwards;
    backface-visibility: hidden;
}



.input-checkbox.input-checkbox--switch {
    margin: 0;
    margin-left: 5px;
}

    .input-checkbox.input-checkbox--switch label {
        margin: 0 !important;
    }


a.mfn--link--4:before, a.mfn--link--4:after, a.mfn--link--3:after, a:hover.mfn--link--8:after, a:hover.mfn--link--8:before, a.hover.mfn--link--8:after, a.hover.mfn--link--8:before {
    background: #4a90e2 !important;
}

a:hover.mfn--link--3:after, a.hover.mfn--link--3:after {
    -webkit-transform: translateY(-7px);
    -moz-transform: translateY(-7px);
    transform: translateY(-7px);
}

.card-1 .card__avatar img {
    max-height: 2.78571429em;
    margin-left: 0.46428571em;
    margin-right: 0;
    margin-bottom: 0;
}

label {
    font-size: 1em;
}

/* end of theme-rtl fixes*/

body * {
    transition: ease opacity 0.5s, ease color 0.5s;
}

#slider *, #mainSlider * {
    transition: none;
}

body, h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'shabnam', 'Open Sans', 'Helvetica', 'Arial', sans-serif;
    word-spacing: -2px;
}

.block {
    display: block !important;
}

.NoShow {
    position: absolute !important;
    overflow: hidden !important;
    clip: rect(1px, 1px, 1px, 1px) !important;
    width: 1px !important;
    height: 1px !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}


h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    color: inherit;
}

h1, h2, h3, h4 {
    font-weight: bold !important;
}

    h1 small, .h1 small, h2 small {
        font-size: 50% !important;
        display: block;
        opacity: 0.8;
    }

blockquote {
    font-family: 'shabnam';
    font-style: normal;
    font-weight: 300;
}

.imageblock.border--round .background-image-holder {
    border-radius: 0 0 0 0px;
}

.menu-horizontal > li, .menu-vertical > li {
    font-family: 'shabnam', 'Open Sans', 'Helvetica', 'Arial', sans-serif;
}

.bar-1 .menu-horizontal > li > .dropdown__trigger, .bar-1 .menu-horizontal > li > a {
    font-size: 1em;
    display: block;
}

.bar {
    padding: 1.2em 0;
}

    .bar .logo {
        top: -2px;
    }

[dir="rtl"] .menu-horizontal li:not(:last-child) {
    margin-left: 1.5em;
}

.HeaderMenu > ul {
    border-top: 1px solid #013d38;
    margin-top: 5px;
    padding-top: 5px;
}

.HeaderMenu > .menu-horizontal > li > a, .HeaderMenu > .menu-horizontal > li > a:hover, .HeaderMenu > .menu-horizontal > li > span, .HeaderMenu > .menu-horizontal > li > span:hover {
    color: #fff !important;
}


.menu-horizontal > li > a.btn {
    opacity: 1;
    margin-bottom: 0 !important;
    margin-top: -6px;
}

.menu-horizontal > li > .alert {
    margin: 0;
    margin-top: -3px;
    border-radius: 0.25rem !important;
}


.menu-horizontal > li > a.btn:not(.btn--outline) {
    color: #fff !important;
}

    .menu-horizontal > li > a.btn:not(.btn--outline) i {
        color: #fff !important;
    }


.btn {
    font-family: 'shabnam', 'Open Sans', 'Helvetica', 'Arial', sans-serif;
    border-radius: 0px;
}

    .btn:hover {
        transform: none;
        -webkit-transform: none;
    }

.btn--label.loading {
    position: relative;
    padding-right: 40px !important;
}

    .btn--label.loading:before {
        position: absolute;
        content: "\f110";
        font-family: 'Font Awesome 5 Pro';
        animation: spin 2s linear infinite;
        right: 15px;
    }

.btn-card {
    margin-right: 1em !important;
}

a.btn.btn--xs .btn--label {
    padding: 5px 10px;
}

.breadcrumbs {
    margin: 0;
}
/*****************style roundcheck */
ul.iconfont {
    padding-right: 20px;
    list-style: none;
}

ul.round-checkmark li:before, li.round-checkmark:before {
    font-family: 'Font Awesome\ 5 Pro';
    content: '\f058';
    font-size: 16px;
    margin: 0 -24px 0 5px;
    top: 2px;
    position: relative;
    display: inline-block;
}



ul.custom-list {
    list-style: none;
}

    ul.custom-list.arrow li {
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }

        ul.custom-list.arrow li:before {
            font-family: 'Font Awesome\ 5 Pro';
            content: '\f104';
            color: #58585a;
            margin: 0;
            font-weight: bold;
            margin: 0 0 0 5px;
        }

        ul.custom-list.arrow li a {
            color: #58585a;
            opacity: 0.8;
        }

            ul.custom-list.arrow li a:hover {
                color: #58585a;
                opacity: 1;
            }





ul.arrow li:before {
    font-family: 'Font Awesome\ 5 Pro';
    content: '\f104';
    font-size: 10px;
    color: #ed1c24;
    margin: 0 -24px 0 5px;
    font-weight: bold;
}

hr.short {
    margin: 0 0 15px;
}

    hr.short.center {
        margin: 0 auto 15px;
        clear: both;
    }

.text-black-50 {
    color: rgba(0,0,0,.5) !important;
}

.feature img {
    width: 100%;
    height: 25vh;
    object-fit: cover;
    object-position: 50% 50%;
}

ul.DataList li {
    padding: 10px 0;
    border-bottom: 1px solid #ddd;
    margin-bottom: 10px;
    overflow: hidden;
}

    ul.DataList li span.key {
        width: 200px;
        padding-right: 20px;
        float: right;
    }

    ul.DataList li span.value {
        float: right;
        font-weight: bold;
    }


article.feature-1 h5 {
    font-size: 1.2em;
}

article.feature-1 span {
    font-size: .9em;
}

.products-list .product {
    padding: 20px;
    display: block;
    position: relative;
}

    .products-list .product img {
        width: 100%;
        height: 25vh;
        object-fit: contain;
        object-position: 50% 50%;
    }


.product h4 small {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    line-height: 26px;
}

.product .price-pnl {
    line-height: 14px;
    height: 30px;
    overflow: hidden;
    display: flex !important;
    flex-direction: column;
    justify-content: center;
    align-content: center;
}

.product .price {
    font-size: 19px;
    color: #02a500;
}

.DiscountedPrice {
    color: #ed1c24 !important;
}

.product .price.type--strikethrough {
    font-size: 13px;
    color: #777;
}


.product .tools {
    position: absolute;
    left: 10px;
    top: 10px;
    z-index: 10000;
}

    .product .tools .form-check {
        padding: 0;
    }

    .product .tools .form-check-input[type=checkbox] {
        display: block;
    }

        .product .tools .form-check-input[type=checkbox] + label {
            margin: 15px;
            margin-left: 5px;
            padding-right: 20px;
            line-height: 1.85714286em;
            display: none;
        }

.products-list .product:hover .tools .form-check-input[type=checkbox] + label, .products-list .product .tools .form-check-input[type=checkbox]:checked + label {
    display: block;
}

.product .colors {
    position: absolute;
    top: 25px;
    right: 25px;
}

    .product .colors li {
        border-radius: 100%;
        height: 16px;
        width: 16px;
        border: 1px solid silver;
        overflow: hidden;
        position: relative;
        margin: 2px !important;
    }


.currency-rls:after {
    font-size: 0.6em;
    content: "ریال";
    margin-right: 2px;
}

.currency-tmn:after {
    font-size: 0.7em;
    content: "تومان";
    margin-right: 2px;
}

.product-price-pnl .h4 {
    margin: -5px 0 -20px 0;
}

.product-price-pnl .h2 {
    font-weight: bold;
    margin: 0;
    letter-spacing: 2px;
    margin-top: 10px;
}

.product-price-pnl .currency-rls:after {
    font-size: 0.5em;
    letter-spacing: 0px;
}

.product a:hover img {
    transform: none;
    -webkit-transform: none;
}

.product h4 {
    display: block;
    height: 65px;
    overflow: hidden;
    margin-bottom: 5px;
    line-height: 1.1em;
}

.products-list .product:hover {
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.15);
}


[dir="rtl"] .product .label {
    right: auto !important;
    left: 2em;
}

.product .label:not([class*='bg--']) {
    background: #f31c02 !important;
}

.list .product .label {
    top: 10px;
}

.product .label {
    display: inline-block;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .5px;
    color: #fff;
    text-transform: uppercase;
    height: 26px;
    min-width: 42px;
    padding: 1px 6px;
    text-align: center;
    border-radius: 50px;
    position: absolute;
    z-index: 3;
    top: 1.8em;
}



.product a.img-container {
    display: block;
    height: 200px;
    margin-bottom: 0.92857143em;
}

    .product a.img-container img {
        max-height: 100%;
        margin: 0;
    }

    .product a.img-container:hover img {
        transform: none;
        -webkit-transform: none;
    }


.wizard > .steps .done a:before, .wizard > .steps .done a:after {
    background: #1aba17;
}

.wizard > .steps .number {
    display: none;
}

.wizard > .actions {
    display: none;
}

.wizard > .content > .body {
    position: relative;
}

.RTL, .rtl {
    direction: rtl !important;
}

.LTR, .ltr {
    direction: ltr !important;
}

div.input-icon.right {
    float: inherit;
}

#saleconsulting[novalidate="novalidate"] .flag-container .selected-flag {
    height: 60%;
}


/** Forms **/

.form > div[class*="col-"]:not(:last-child), .form > .row > div[class*="col-"]:not(:last-child) {
    margin-bottom: 0.92857143em;
}

.form + span.type--fine-print {
    margin-top: 1.08333333333334em;
    display: inline-block;
}

form .form-title {
    color: #58585a;
    font-size: 1.2em;
    font-weight: bold;
    border-bottom: 1px solid #ccc;
    padding: 20px 0;
    margin-bottom: 20px;
}

    form .form-title:before {
        content: '\f111';
        font-family: "Font Awesome 5 Pro";
        font-weight: bold;
        margin-left: 10px;
        font-size: 1em;
        color: #4285f4;
    }


.text-muted {
    color: #4285f4 !important
}

.form-control:focus {
    border-color: #80bdff;
    box-shadow: none;
}


select.form-control:not([size]):not([multiple]) {
    height: calc(2.25rem + 7px);
}

.custom-select {
    background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat left 0.75rem center;
    background-size: 8px 10px;
}

input[type], textarea, select {
    background: #fcfcfc;
    border-radius: 0px !important;
}

[dir="rtl"] input[type], [dir="rtl"] select, [dir="rtl"] textarea {
    padding-left: .84375em;
    padding-right: .84375em;
}

[dir="rtl"] .input-icon input[type] {
    padding-left: 3.6em;
    padding-right: .84375em;
}


.input-icon i {
    top: 12px;
    font-size: 15px;
    color: #9c9393;
    border-right: 1px solid #ddd;
    padding: 0 10px 0 5px;
}

input[type], textarea, select {
    border-radius: 0;
}


[type=checkbox]:checked, [type=checkbox]:not(:checked) {
    opacity: 0;
    padding: 0 !important;
    width: 100%;
    height: 23px;
    z-index: 1;
    margin: 0;
}

.form-check-input[type=checkbox] + label {
    position: relative;
    padding-right: 30px;
    cursor: pointer;
    display: inline-block;
    font-size: 1em;
    line-height: 2em;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .form-check-input[type=checkbox] + label:before, .form-check-input[type=checkbox]:not(.filled-in) + label:after, label.btn input[type=checkbox] + label:before, label.btn input[type=checkbox]:not(.filled-in) + label:after {
        content: '';
        position: absolute;
        top: 0;
        right: 0;
        width: 18px;
        height: 18px;
        z-index: 0;
        border: 2px solid #8a8a8a;
        -webkit-border-radius: 1px;
        border-radius: 1px;
        margin-top: 3px;
        -webkit-transition: .2s;
        -o-transition: .2s;
        transition: .2s;
    }

.form-check-input[type=checkbox]:not(.filled-in) + label:after, label.btn input[type=checkbox]:not(.filled-in) + label:after {
    border: 0;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
}

.form-check-input[type=checkbox]:not(:checked):disabled + label:before, label.btn input[type=checkbox]:not(:checked):disabled + label:before {
    border: none;
    background-color: #bdbdbd;
}

.form-check-input[type=checkbox]:checked + label:before, label.btn input[type=checkbox]:checked + label:before {
    top: -4px;
    right: 10px;
    width: 12px;
    height: 1.375rem;
    border-top: 2px solid transparent;
    border-left: 2px solid transparent;
    border-right: 2px solid #4285f4;
    border-bottom: 2px solid #4285f4;
    -webkit-transform: rotate(40deg);
    -ms-transform: rotate(40deg);
    transform: rotate(40deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform-origin: 100% 100%;
    -ms-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
}

.form-check-input[type=checkbox]:checked:disabled + label:before, label.btn input[type=checkbox]:checked:disabled + label:before {
    border-right: 2px solid #bdbdbd;
    border-bottom: 2px solid #bdbdbd;
}

.form-check-input[type=checkbox]:indeterminate + label:before, label.btn input[type=checkbox]:indeterminate + label:before {
    top: -11px;
    right: -12px;
    width: 10px;
    height: 1.375rem;
    border-top: none;
    border-left: none;
    border-right: 2px solid #4285f4;
    border-bottom: none;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform-origin: 100% 100%;
    -ms-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
}

.form-check-input[type=checkbox]:indeterminate:disabled + label:before, label.btn input[type=checkbox]:indeterminate:disabled + label:before {
    border-right: 2px solid rgba(0,0,0,.46);
    background-color: transparent;
}

.form-check-input[type=checkbox].filled-in + label:after, label.btn input[type=checkbox].filled-in + label:after {
    -webkit-border-radius: .125rem;
    border-radius: .125rem;
}

.form-check-input[type=checkbox].filled-in + label:after, .form-check-input[type=checkbox].filled-in + label:before, label.btn input[type=checkbox].filled-in + label:after, label.btn input[type=checkbox].filled-in + label:before {
    content: '';
    right: 0;
    position: absolute;
    -webkit-transition: border .25s,background-color .25s,width .2s .1s,height .2s .1s,top .2s .1s,left .2s .1s;
    -o-transition: border .25s,background-color .25s,width .2s .1s,height .2s .1s,top .2s .1s,left .2s .1s;
    transition: border .25s,background-color .25s,width .2s .1s,height .2s .1s,top .2s .1s,left .2s .1s;
    z-index: 1;
}

.form-check-input[type=checkbox].filled-in:not(:checked) + label:before, label.btn input[type=checkbox].filled-in:not(:checked) + label:before {
    width: 0;
    height: 0;
    border: 3px solid transparent;
    right: 6px;
    top: 10px;
    -webkit-transform: rotateZ(37deg);
    -ms-transform: rotate(37deg);
    transform: rotateZ(37deg);
    -webkit-transform-origin: 100% 100%;
    -ms-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
}

.form-check-input[type=checkbox].filled-in:not(:checked) + label:after, label.btn input[type=checkbox].filled-in:not(:checked) + label:after {
    height: 20px;
    width: 20px;
    background-color: transparent;
    border: 2px solid #5a5a5a;
    top: 0;
    z-index: 0;
}

.form-check-input[type=checkbox].filled-in:checked + label:before, label.btn input[type=checkbox].filled-in:checked + label:before {
    top: 0;
    right: 1px;
    width: 8px;
    height: 13px;
    border-top: 2px solid transparent;
    border-left: 2px solid transparent;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    -webkit-transform: rotateZ(37deg);
    -ms-transform: rotate(37deg);
    transform: rotateZ(37deg);
    -webkit-transform-origin: 100% 100%;
    -ms-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
}

.form-check-input[type=checkbox].filled-in:checked + label:after, label.btn input[type=checkbox].filled-in:checked + label:after {
    top: 0;
    width: 20px;
    height: 20px;
    border: 2px solid #a6c;
    background-color: #a6c;
    z-index: 0;
}

.form-check-input[type=checkbox].filled-in.filled-in-danger:checked + label:after, label.btn input[type=checkbox].filled-in.filled-in-danger:checked + label:after {
    background-color: #f44336;
    border-color: #f44336;
}

.form-check-input[type=checkbox]:disabled:not(:checked) + label:before, label.btn input[type=checkbox]:disabled:not(:checked) + label:before {
    background-color: #bdbdbd;
    border-color: #bdbdbd;
}

.form-check-input[type=checkbox]:disabled:not(:checked) + label:after, label.btn input[type=checkbox]:disabled:not(:checked) + label:after {
    border-color: #bdbdbd;
    background-color: #bdbdbd;
}

.form-check-input[type=checkbox]:disabled:checked + label:before, label.btn input[type=checkbox]:disabled:checked + label:before {
    background-color: transparent;
}

.form-check-input[type=checkbox]:disabled:checked + label:after, label.btn input[type=checkbox]:disabled:checked + label:after {
    background-color: #bdbdbd;
    border-color: #bdbdbd;
}

/**/
[type="radio"]:not(:checked), [type="radio"]:checked {
    position: absolute;
    pointer-events: none;
    opacity: 0
}

.form-check-input[type="radio"]:not(:checked) + label, .form-check-input[type="radio"]:checked + label, label.btn input[type="radio"]:not(:checked) + label, label.btn input[type="radio"]:checked + label {
    position: relative;
    display: inline-block;
    height: 1.5625rem;
    padding-right: 35px;
    line-height: 1.5625rem;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition: .28s ease;
    transition: .28s ease
}

.form-check-input[type="radio"] + label:before, .form-check-input[type="radio"] + label:after, label.btn input[type="radio"] + label:before, label.btn input[type="radio"] + label:after {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
    width: 16px;
    height: 16px;
    margin: 4px;
    content: "";
    -webkit-transition: .28s ease;
    transition: .28s ease
}

.form-check-input[type="radio"]:not(:checked) + label:before, .form-check-input[type="radio"]:not(:checked) + label:after, .form-check-input[type="radio"]:checked + label:before, .form-check-input[type="radio"]:checked + label:after, .form-check-input[type="radio"].with-gap:checked + label:before, .form-check-input[type="radio"].with-gap:checked + label:after, label.btn input[type="radio"]:not(:checked) + label:before, label.btn input[type="radio"]:not(:checked) + label:after, label.btn input[type="radio"]:checked + label:before, label.btn input[type="radio"]:checked + label:after, label.btn input[type="radio"].with-gap:checked + label:before, label.btn input[type="radio"].with-gap:checked + label:after {
    border-radius: 50%
}

.form-check-input[type="radio"]:not(:checked) + label:before, .form-check-input[type="radio"]:not(:checked) + label:after, label.btn input[type="radio"]:not(:checked) + label:before, label.btn input[type="radio"]:not(:checked) + label:after {
    border: 2px solid #5a5a5a
}

.form-check-input[type="radio"]:not(:checked) + label:after, label.btn input[type="radio"]:not(:checked) + label:after {
    -webkit-transform: scale(0);
    transform: scale(0)
}

.form-check-input[type="radio"]:checked + label:before, label.btn input[type="radio"]:checked + label:before {
    border: 2px solid transparent
}

.form-check-input[type="radio"]:checked + label:after, .form-check-input[type="radio"].with-gap:checked + label:before, .form-check-input[type="radio"].with-gap:checked + label:after, label.btn input[type="radio"]:checked + label:after, label.btn input[type="radio"].with-gap:checked + label:before, label.btn input[type="radio"].with-gap:checked + label:after {
    border: 2px solid #4285f4
}

.form-check-input[type="radio"]:checked + label:after, .form-check-input[type="radio"].with-gap:checked + label:after, label.btn input[type="radio"]:checked + label:after, label.btn input[type="radio"].with-gap:checked + label:after {
    background-color: #4285f4
}

.form-check-input[type="radio"]:checked + label:after, label.btn input[type="radio"]:checked + label:after {
    -webkit-transform: scale(1.02);
    transform: scale(1.02)
}

.form-check-input[type="radio"].with-gap:checked + label:after, label.btn input[type="radio"].with-gap:checked + label:after {
    -webkit-transform: scale(0.5);
    transform: scale(0.5)
}

.form-check-input[type="radio"].with-gap:disabled:checked + label:before, label.btn input[type="radio"].with-gap:disabled:checked + label:before {
    border: 2px solid rgba(0,0,0,0.46)
}

.form-check-input[type="radio"].with-gap:disabled:checked + label:after, label.btn input[type="radio"].with-gap:disabled:checked + label:after {
    background-color: rgba(0,0,0,0.46);
    border: 0
}

.form-check-input[type="radio"]:disabled:not(:checked) + label:before, .form-check-input[type="radio"]:disabled:checked + label:before, label.btn input[type="radio"]:disabled:not(:checked) + label:before, label.btn input[type="radio"]:disabled:checked + label:before {
    background-color: transparent;
    border-color: rgba(0,0,0,0.46)
}

.form-check-input[type="radio"]:disabled + span, label.btn input[type="radio"]:disabled + span {
    color: rgba(0,0,0,0.46)
}

.form-check-input[type="radio"]:disabled:not(:checked) + span:before, label.btn input[type="radio"]:disabled:not(:checked) + span:before {
    border-color: rgba(0,0,0,0.46)
}

.form-check-input[type="radio"]:disabled:checked + span:after, label.btn input[type="radio"]:disabled:checked + span:after {
    background-color: rgba(0,0,0,0.46);
    border-color: #bdbdbd
}

.form-check-input[type="radio"]:checked + label:after .disabled-material, label.btn input[type="radio"]:checked + label:after .disabled-material {
    background-color: rgba(66,133,244,0.2)
}


.swal-button {
    color: #4285f4 !important;
    background-color: #fff !important;
    border: 2px solid #4285f4 !important;
    box-shadow: none;
    border-radius: 5px;
    font-weight: normal;
    font-size: 14px;
    padding: 8px 25px 10px;
    margin: 0;
    cursor: pointer;
}

.swal-button--confirm {
    border: 2px solid #1aba17 !important;
    color: #1aba17 !important;
}

.swal-button--cancel {
    border: 2px solid #ed1c24 !important;
    color: #ed1c24 !important;
}

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

.error {
    color: #f98c8f;
}

.help-block {
    color: #0d9dc8;
}

.form-control {
    border-radius: 0;
}

[dir="rtl"] .input-select:after {
    border-right: 0;
    font-size: 24px;
    top: 5px;
}

.msg-validation, #email-existance, #cellphone-existance {
    color: red;
}

.help-block {
    color: #0d9dc8;
}

.help-block-error {
    color: #ed1c24 !important;
}


.form-group input.error, .form-group textarea.error, .form-group select.error, .form-group label.error {
    border-color: red;
}

.form-group.FileUploader label {
    display: block;
}

.form-group.FileUploader .btn:before {
    content: '\f0ee';
    margin-left: 4px;
    font-family: 'Font Awesome\ 5 Pro';
}

.form-group.FileUploader .btn--sm {
    padding-right: 0.85714286em;
    padding-left: 0.85714286em;
}

    .form-group.FileUploader .btn--sm * {
        cursor: pointer;
    }

.form-group.FileUploader input[type="file"] {
    font-size: 12px !important;
    top: -8px;
    height: 50px;
}


.form-group .FileUploadInput {
    width: auto !important;
    padding: 0 !important;
    border: none;
    background: transparent;
}







input[type]::-webkit-input-placeholder,
textarea::-webkit-input-placeholder,
select::-webkit-input-placeholder {
    color: #b3b3b3;
    font-size: 1em;
}

input[type]:-moz-placeholder,
textarea:-moz-placeholder,
select:-moz-placeholder { /* Firefox 18- */
    color: #b3b3b3;
    font-size: 1em;
}

input[type]::-moz-placeholder,
textarea::-moz-placeholder,
select::-moz-placeholder { /* Firefox 19+ */
    color: #b3b3b3;
    font-size: 1em;
}

input[type]:-ms-input-placeholder,
textarea:-ms-input-placeholder,
select:-ms-input-placeholder {
    color: #b3b3b3;
    font-size: 1em;
}

/* ---- /Forms */

.menu-horizontal > .dropdown > .dropdown__trigger:after {
    content: '\f107';
    margin-left: 4px;
    font-family: 'Font Awesome\ 5 Pro';
}

.user-menu .dropdown {
    background: #fff;
    border-radius: 20px;
    padding: 0px 10px;
}

    .user-menu .dropdown > .dropdown__trigger .image--xxs {
        margin-left: 5px;
        margin-right: 0;
    }

    .user-menu .dropdown > .dropdown__trigger {
        color: #777 !important
    }

    .user-menu .dropdown .dropdown__container::before {
        height: 10px;
    }

.dropdown > .dropdown__trigger::after {
    font-size: 1em;
    bottom: -1px;
}

/*#ContactForm .btn {
    border-color: #ececec !important;
    color: #ececec !important;
}

    #ContactForm .btn:hover ,#ContactForm .btn:hover .btn--icon i {
        background-color: #ececec !important;
        color: #fff !important;
    }*/


.UserFullTitle span {
    font-size: .8em;
    display: block
}

#ContactForm .btn--icon i {
    color: #6c757d !important;
}

#ContactForm .btn:hover .btn--icon i {
    color: #fff !important;
}


.contact-us li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.13);
    padding: 10px;
}

.instafeed img {
    height: 100%;
    width: 100%;
}

.alert:not([class*="alert-outline-"]) {
    border: none !important;
}

.alert:not(:last-child) {
    margin-bottom: 1.85714286em !important;
}

.alert-dismissible .close {
    right: inherit;
    left: 0;
    height: inherit;
}

    .alert-dismissible .close::after {
        content: '×';
        position: relative;
        font-size: 1.6em;
        color: #000;
        text-shadow: 0 1px 0 #fff;
        background: none;
    }

.alert.alert-error {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
}

.alert.alert-right-icon i {
    float: right;
    margin: 5px 5px 5px -25px;
    font-size: 1.4em;
    vertical-align: middle
}

.process-stepper > li {
    transition: all .3s ease;
    display: inline-block;
    float: right;
    text-align: center;
    position: relative;
}

    .process-stepper > li:first-child:after {
        right: 50%;
    }

    .process-stepper > li:last-child:after {
        left: 50%;
    }



/*! -- Stack Tables -- */
table {
    border-collapse: collapse;
}

.table-dark {
    color: #fff;
    background-color: rgba(0,0,0,0.1) !important;
}

.bg--dark table th {
    background: none;
    color: #fff;
}

.bg--dark .breadcrumbs li, .bg--dark .breadcrumbs a {
    color: #fff !important;
}

.table-dark thead tr {
    background-color: rgba(0,0,0,0.3) !important;
}

.table-dark thead th {
    border: 0 !important;
}

.table-hover tbody tr:hover {
    background-color: rgba(0, 0, 0, 0.025);
}


.table-fixed {
    overflow: hidden;
    margin-top: 20px;
}

    .table-fixed tbody {
        height: 500px;
        overflow-y: auto;
        width: 100%;
    }

    .table-fixed thead {
        width: 100%;
        overflow: hidden;
        height: 100%;
        padding-left: 17px;
    }

        .table-fixed thead tr {
            background-color: #fbfbfb;
        }

    .table-fixed thead,
    .table-fixed tbody,
    .table-fixed tr,
    .table-fixed td,
    .table-fixed th {
        display: flow-root;
        text-align: center;
    }

        .table-fixed tbody td,
        .table-fixed thead > tr > th {
            float: right;
        }

        .table-fixed tbody td {
            padding: 17px 8px !important;
            position: relative;
        }


.nav-pills .nav-link {
    background-color: rgba(0,0,0,0.1);
    margin: 1px;
}

ul.nav-pills li {
    list-style: none !important;
}

ul.nav-pills.checkmarked li a.active:before {
    content: '\f00c';
    font-family: 'Font Awesome 5 Pro';
    color: #fff;
    padding: 5px;
    font-size: 15px;
    vertical-align: middle;
}


.list-group-item:first-child, .list-group-item:last-child {
    border-radius: 0;
}

.list-group .badge {
    margin-top: 5px;
}

.list-group.selectable .active {
    background: #fff;
    border-color: #1aba17;
    color: #39434d !important;
}

    .list-group.selectable .active .badge {
        background: #1aba17;
        color: #fff;
    }

.list-group.selectable .list-group-item {
    padding-right: 100px;
    color: #39434d;
}

    .list-group.selectable .list-group-item.active:before {
        content: '\f00c';
        font-family: "Font Awesome 5 Pro";
        font-weight: 900;
        background: #1aba17;
        border-left: 1px solid #1aba17;
        color: #fff;
    }

    .list-group.selectable .list-group-item:before {
        content: '\f0c8';
        font-family: "Font Awesome 5 Pro";
        font-weight: 400;
        font-size: 20px;
        display: block;
        float: right;
        height: 100%;
        padding-top: 25px;
        position: absolute;
        right: 0;
        text-align: center;
        top: 0;
        width: 85px;
        border-left: 1px solid #ddd;
    }

    .list-group.selectable .list-group-item .price {
        border-right: 1px solid #ddd;
        float: left;
        padding: 0 10px 0 0;
        min-width: 100px;
        text-align: left;
        font-size: 18px;
        line-height: 24px;
    }

    .list-group.selectable .list-group-item.active .price {
    }

    .list-group.selectable .list-group-item .price .currency {
        font-size: 12px;
    }

.list-group.selectable.narrow .list-group-item:before {
    padding-top: 12px;
}


.list-group.not-selectable .list-group-item {
    padding-right: 12px;
    cursor: default;
}

    .list-group.not-selectable .list-group-item:hover {
        background: none;
    }

    .list-group.not-selectable .list-group-item.disabled:hover, .list-group-item.disabled:focus {
        cursor: not-allowed;
        background-color: #eee;
    }

    .list-group.not-selectable .list-group-item .price {
        border-right: 1px solid #ddd;
        float: left;
        padding: 0 10px 0 0;
        min-width: 100px;
        text-align: left;
        font-size: 18px;
        line-height: 24px;
    }

        .list-group.not-selectable .list-group-item .price .currency {
            font-size: 12px;
        }

.list-group.not-selectable.narrow .list-group-item:before {
    padding-top: 12px;
}

.list-group-icon {
    font-size: 21px;
    padding: 5px 0 5px 10px;
    vertical-align: middle;
}

#OnlineGateways {
    margin-top: 10px;
}

    #OnlineGateways li {
        list-style: none;
        display: inline-block;
        padding: 5px;
        border: #ced6de 1px solid;
        margin-left: 5px;
        position: relative;
    }

        #OnlineGateways li.select {
            border: #1aba17 1px solid;
        }

            #OnlineGateways li.select:before {
                content: '';
                width: 0;
                height: 0;
                border-top: 20px solid #1aba17;
                border-left: 20px solid transparent;
                position: absolute;
                top: 0;
                right: 0;
            }

        #OnlineGateways li img {
            width: 55px;
            height: 55px;
        }

.padding-left-0 {
    padding-right: 0 !important;
}

.padding-right-0 {
    padding-left: 0 !important;
}

.CartTab table td {
    vertical-align: middle;
}

    .CartTab table td a.delete i {
        color: #ddd;
    }

    .CartTab table td a.delete:hover i {
        color: red;
    }

.pl-0 input[type], input.TouchSpin {
    border-top-left-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
}

.pr-0 input[type] {
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}

.cart-item a.delete {
    font-size: 13px;
    ;
}


.cart-item {
    padding: 1.85714286em 0;
    border-bottom: 1px solid #ececec;
}

    .cart-item:first-child {
        padding-top: 0;
    }

    .cart-item:last-child {
        padding-bottom: 0;
        border-bottom: none;
    }


.shopping-cart.btn .btn--icon {
    padding: 8px 13px;
}

.shopping-cart.btn .btn--label {
    padding: 8px 20px;
}


.menu-cart a {
    position: relative !important;
    display: inline !important;
    padding: 0 !important;
}

.menu-cart i {
    font-size: 1.5em;
    top: 5px;
    position: relative;
}

.menu-cart .menu-cart-count {
    background: #eb2227;
    color: #fff;
    position: absolute;
    right: -11px;
    top: 11px;
    height: 16px;
    padding: 0 2px;
    min-width: 16px;
    border-radius: 100px;
    text-align: center;
    font-size: 12px;
    line-height: 19px;
}


.text-last-center {
    text-align-last: center;
}


i.icon.icon--sm.stack-interface.stack-menu {
    line-height: 1.5em;
}

.contact-us .fa-li {
    right: -1.2em;
    top: 11px;
}

    .contact-us .fa-li i {
        color: #fd9800;
    }

footer .type--fine-print:not(p) {
    opacity: .85;
}

footer {
    font-size: .9em;
}

    footer p {
        margin-bottom: 0.8em;
    }

    footer .logo {
        max-height: 2.5em;
    }

    footer .footer__lower p {
        font-size: .9em;
    }

    footer i.fa-copyright {
        font-size: .8em;
    }



ul.social-list {
    margin: 10px 0 5px 0 !important;
}

ul.partners-logo a img {
    opacity: 0.5;
}

ul.partners-logo a:hover img {
    opacity: 1;
}

ul.partners-logo img {
    height: 15px;
}

/********************************Project*/
.masonry-filters--horizontal .masonry__filters {
    display: inline-block;
    position: relative;
    margin-right: 0.92857143em;
    border: 1px solid rgba(0,0,0,.07);
    border-radius: 5px;
}

    .masonry-filters--horizontal .masonry__filters ul li {
        transition: all .3s ease;
        cursor: pointer;
        display: inline-block;
        padding: 0.92857143em;
        border-left: 1px solid rgba(243, 243, 243, 0.25);
        float: right;
    }

        .masonry-filters--horizontal .masonry__filters ul li:last-child {
            border-left: none;
        }

        .masonry-filters--horizontal .masonry__filters ul li:not(:last-child) {
            margin-right: 0;
        }

.masonry-filter-container > span + .masonry-filter-holder {
    margin-left: 0em;
}

.masonry-filter-container > span {
    margin-bottom: 1.2em;
}


.hover-item-scroll {
    margin-left: auto !important;
    margin-right: auto !important;
    transition: background-position 1s ease-out 0.2s;
    background-position: top center;
    background-size: 100% auto !important;
    height: 300px;
    background-repeat: no-repeat;
}


    .hover-item-scroll:hover {
        background-position: bottom center !important;
        transition: background-position 2s linear 0s;
    }

.hover-item-scroll {
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-duration: .2s;
    animation-duration: .2s;
}
/********************************Project*/
/********************************menu*/
.bar .menu-horizontal.main--menu {
    top: 0 !important;
}

nav .btn {
    margin-bottom: 8px !important;
}


/********************************menu*/
.tabs li:not(:last-child) {
    border: 1px solid #ECECEC;
    margin-left: -2px;
}


.bg-gradient-orange.svg-divider .fancy-divider.bottom-divi {
    bottom: -160px;
}

.bg-gradient-orange.svg-divider .fancy-divider {
    z-index: 4 !important;
}

.pricing:not(.boxed--border):hover {
    border: none !important;
}



.pricing .plan-inside, .pricing .plan-footer, .pricing .plan-header {
    padding: 10px;
}

.pricing .plan-footer, .pricing .plan-header {
    background-color: rgba(179, 179, 181, 0.22);
}

.pricing-box .pricing .plan-inside {
    background-color: #fff;
}

    .pricing-box .pricing .plan-inside p:first-child {
        height: 157px;
    }

.plugin .boxed i {
    color: inherit !important;
}

.price span {
    font-size: 21px;
    font-weight: bold;
}

.pricing .plan-header.btn-orange h3 {
    color: #fff !important;
}

.pricing .price sup {
    font-weight: bold;
}

.plugin .pricing .price {
    display: inline-block;
    padding: 10px;
    border-left: 1px solid #ddd;
    margin-right: -2px;
}

    .plugin .pricing .price:last-child {
        border-left: none;
    }

    .plugin .pricing .price span {
        font-size: 15px;
    }

.slider .pricing:hover {
    box-shadow: none;
}

.pricing-2 ul:first-child {
    margin-top: 3em;
}

.plugin .feature a.btn {
    position: relative;
    width: 100%;
    bottom: 0;
    left: 0;
    border-radius: 0;
    display: inline;
    padding: 5px;
    margin-right: 4px !important;
}

    .plugin .feature a.btn + a.btn {
        margin-right: 4px !important;
    }

.featurs-conference .text-block p {
    height: 64px;
    font-size: 0.85em;
    line-height: 1.2em;
}

.lead {
    font-size: 1.1em !important;
    line-height: 1.5em !important;
    text-align: justify;
}

.slider .slide h3 {
    font-size: 1.5em;
}


.FooterMenu {
    margin-top: 10px !important;
    margin-bottom: 0 !important;
}

    .FooterMenu li {
        display: inline;
    }

        .FooterMenu li:not(:last-child):after {
            content: '\f111';
            font-family: "Font Awesome 5 Pro";
            font-weight: bold;
            margin: 0 10px;
            font-size: 8px;
            color: #343a40;
        }


footer .social-list i {
    font-size: 1.5em;
    background-color: #ddd;
    width: 35px;
    height: 35px;
    padding-top: 10px;
    text-align: center;
    vertical-align: middle;
    display: inline-block;
    margin: 0px;
    text-align: center;
    display: inline-block;
    margin: 0px;
    text-align: center;
    margin: 0 1px !important;
}

.footer-1 .footer-links li a {
    font-weight: bold;
    font-size: 1.2em
}

.footer-links-2 img.logo {
    margin-left: 30px !important;
}

.footer-links-2 .copyright {
    margin-left: 30px !important;
}

.footer-links-2 a {
    margin-left: 15px !important;
}
/**********************************bootstrap-tagsinput********/
.bootstrap-tagsinput {
    display: block !important;
    border-radius: 0 !important;
    overflow: hidden;
    padding: 0 6px !important;
}

    .bootstrap-tagsinput .tag {
        padding: 5px 8px 5px 15px;
        margin: 1px 0 0 1px;
        position: relative;
        border-radius: 0;
        min-width: 40px;
        top: 6px;
        left: 0;
        background: #89C4F4;
    }

    .bootstrap-tagsinput .tag, .bootstrap-tagsinput input {
        float: right;
    }

        .bootstrap-tagsinput .tag [data-role="remove"]:after {
            content: "\f057" !important;
            font-family: "Font Awesome 5 Pro";
            position: absolute;
            top: 4px;
            left: 5px;
        }
/**********************************bootstrap-tagsinput********/


/*********************intl-tel-input*/
.intl-tel-input.separate-dial-code.allow-dropdown input[type=tel] {
    width: 100%;
}

.intl-tel-input {
    width: 100%;
}

    .intl-tel-input.separate-dial-code .selected-dial-code {
        padding-right: 15px;
        padding-left: 0;
        direction: ltr;
    }

    .intl-tel-input .flag-container {
        bottom: inherit;
        top: 18px;
    }

.cover {
    position: relative;
}

    .cover h2 {
        color: #39434d !important;
        margin: 0 auto;
        font-size: 3em;
        text-align: center;
    }

    .cover p.lead {
        font-size: 2em;
        color: #58585a;
        text-align: center;
    }

    .cover a.scroll-main {
        text-align: center;
        position: absolute;
        bottom: 10px;
    }

        .cover a.scroll-main i {
            color: #777;
            opacity: 0.5;
        }

    .cover a:hover.scroll-main i {
        color: #777;
        opacity: 1;
    }



.media-item {
    margin-bottom: 20px;
}

    .media-item .media-item-inner {
        height: 210px;
        position: relative;
        border-radius: 10px;
        overflow: hidden
    }

        .media-item .media-item-inner:before {
            background: linear-gradient(to bottom, transparent, rgba(0,0,0,0.8));
            position: absolute;
            content: '';
            width: 100%;
            height: 100%;
            top: 0;
            left: 0;
            z-index: 4;
            transition: all ease-in-out .5s;
            opacity: 0.7;
        }

        .media-item .media-item-inner:hover:before {
            opacity: 1;
        }

    .media-item i {
        position: absolute;
        top: calc(50% - 25px);
        right: 0;
        left: 0;
        text-align: center;
        font-size: 50px;
        color: #fff;
        z-index: 999;
    }

    .media-item h5 {
        position: absolute;
        z-index: 99;
        color: #fff;
        left: 0;
        right: 0;
        bottom: 20px;
    }


.intl-tel-input .country-list {
    z-index: 4 !important;
    margin: 0 0 0 0px;
    left: 0;
    direction: ltr !important;
}

.intl-tel-input.allow-dropdown input {
    border: 1px solid #ececec;
}
/*********************intl-tel-input*/


/*********************datepicker*/
.ui-widget-content {
    box-shadow: none !important;
    border-radius: 0 !important;
}

.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
    padding: 5px 15px;
    box-shadow: none;
    font-size: 21px;
    display: inline-block;
    margin-bottom: 0;
    margin-right: 0;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border-radius: 0;
    border-color: transparent;
    background: none;
    top: 10px;
    margin: 0 !important
}

.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year {
    width: 49%;
    padding-left: .5em;
    padding-right: 0.5em;
    font-size: 12px;
}


a.btn.ui-datepicker-prev i, a.btn.ui-datepicker-next i {
    color: #000 !important;
}

a.btn.ui-datepicker-prev:after, a.btn.ui-datepicker-next:after {
    content: none;
}

a.btn.ui-datepicker-next i:before {
    content: "\f105" !important;
}

a.btn.ui-datepicker-next {
    left: 2px;
    right: inherit;
}

a.btn.ui-datepicker-prev {
    right: 2px;
    left: inherit;
}

a.btn.ui-datepicker-next i:before {
    content: "\f104" !important;
}

a.btn.ui-datepicker-prev i:before {
    content: "\f105" !important;
}




/*********************datepicker*/

.cursor {
    cursor: pointer;
}

.template {
    transition: opacity 1s ease-out;
    opacity: 0;
    height: 0;
    overflow: hidden;
}

    .template.active {
        opacity: 1;
        height: auto;
    }


.g-recaptcha {
    transform: scale(0.88,1);
    transform-origin: 100% 0;
}

.imageblock.imageblock--sm > .container,
.imageblock.imageblock--sm > div[class*='col-']:not(.imageblock__content) {
    padding-top: 1em;
    padding-bottom: 1em;
}


#input-assigned-0 {
    display: none;
}


.intl-tel-input.separate-dial-code.allow-dropdown input[type=tel] {
    width: 100%;
}

.intl-tel-input {
    width: 100%;
}

    .intl-tel-input.separate-dial-code .selected-dial-code {
        padding-right: 15px;
        padding-left: 0;
        direction: ltr;
    }

    .intl-tel-input .selected-flag .iti-flag {
        left: 10px;
    }

    .intl-tel-input .country-list {
        z-index: 4 !important;
        margin: 0 0 0 0px;
        left: 0;
        direction: ltr !important;
    }


.list-inline li {
    margin-left: 0.5em;
    margin-right: 0.5em;
}


.counter-value {
    font-size: 40px;
    font-weight: bold;
    color: #ed1c24;
}

.highlight-right:after {
    content: "";
    position: absolute;
    width: 50%;
    height: 100%;
    top: 0;
    background: #f5f5f5;
}

.lightboxOverlay {
    z-index: 10000;
}


footer.footer-2 .row:last-child {
    margin-top: 0;
}

footer.footer-2 #Newsletter .btn {
    color: #fff !important;
}

.input-select:after {
    padding: 5px 13px;
}

.link-Projects a {
    left: -9.875em !important;
    top: 0px !important;
}


[dir="rtl"] .input-select:after {
    border-right: none;
}

.imageblock > .container, .imageblock > div[class*='col-']:not(.imageblock__content) {
    padding-top: 2em;
    padding-bottom: 2em;
}

.modal-loading {
    padding: 50px 0;
    text-align: center;
}

.modal-header .close {
    margin: -1rem auto -1rem -1rem;
    height: auto;
}

.modal-header .modal-title {
    font-size: 1.2em !important;
    margin: 0;
}

.modal-sale .list-inline li:not(:last-child) {
    margin-left: 0.6875em;
    margin-right: 0;
}

.close-modal {
    position: absolute;
    top: 15px;
    left: 15px;
    font-size: 1.5em;
    color: #ddd
}

    .close-modal:hover {
        color: #013d38
    }


.login .logo {
    max-height: 4em;
}

.bg--white hr {
    opacity: 1 !important;
}



.pricing-esocity .boxed {
    border-radius: 0 !important;
}

.pricing-esocity .pricing-1 .btn:last-child {
    border-radius: 0 !important;
}

.swal-footer {
    text-align: center;
}

.swal-button {
    border-radius: 0;
}


.background-image {
    position: absolute;
    top: 54px;
    left: 101px;
    right: 99px;
    overflow: hidden;
}

    .background-image .hover-item-scroll {
        height: 343px;
    }


.notification {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    position: fixed;
    z-index: 9999999 !important;
    pointer-events: none;
    padding: 0;
    margin: 1em;
    opacity: 0;
    transition: 0.3s linear;
    -webkit-transition: 0.3s linear;
    -moz-transition: 0.3s linear;
}

.link-demo {
    transition: opacity 1s ease-out;
    opacity: 0;
    height: 0;
    overflow: hidden;
}

    .link-demo.active {
        opacity: 1;
        height: auto;
    }


.hamburger-toggle i {
    color: #252525;
    font-size: 1.6em;
    margin: 16px;
}

/********************************slider*/
#slider .flickity-rtl .flickity-prev-next-button.previous {
    left: auto;
    right: -40px;
}

#slider .flickity-rtl .flickity-prev-next-button.next {
    right: auto;
    left: -40px;
}

.flickity-rtl .flickity-prev-next-button.previous {
    left: auto;
    right: -50px;
}

.flickity-rtl .flickity-prev-next-button.next {
    right: auto;
    left: -50px;
}

.flickity-prev-next-button {
    background: transparent;
}

    .flickity-prev-next-button:hover {
        background: transparent;
    }


.slider[data-paging="true"]:not(section) .flickity-page-dots .dot {
    vertical-align: middle;
}

.slider[data-paging="true"]:not(section) .flickity-page-dots .is-selected {
    width: 12px;
    height: 12px;
    background: #eb2227;
}

.flickity-prev-next-button:before {
    font-family: 'Font Awesome\ 5 Pro';
    content: "\f104";
    font-size: 2.5em;
}


.flickity-prev-next-button.previous:before {
    content: "\f105";
    font-size: 2.5em;
}


.flickity-rtl .flickity-prev-next-button.previous {
    right: 0;
    color: #fff !important;
}

.flickity-rtl .flickity-prev-next-button.next {
    left: 0;
}

.flickity-prev-next-button:before {
    color: #000 !important;
}

.slider.image--light .flickity-prev-next-button.previous:before, .slider.image--light .flickity-prev-next-button.next:before {
    color: #bdbdbd !important;
}

.carousel-gallery {
}

    .carousel-gallery img {
        display: block;
        height: 200px;
    }


    .carousel-gallery .background-image-holder img {
        display: none;
        height: auto;
    }


    .carousel-gallery.cover-fullscreen .slide {
        height: 100%;
    }

    .carousel-gallery.cover-fullscreen {
        height: 100vh !important;
    }


.mega-slide {
    height: 400px;
    overflow: hidden;
    padding: 0 !important;
}

    .mega-slide img.objectfit {
        width: 100%;
        height: 350px;
        object-fit: contain;
    }

    .mega-slide img.fullscreen {
        width: 100%;
    }





@media screen and ( min-width: 768px ) {
    .carousel-gallery img {
        height: 400px;
    }


    .carousel-gallery .background-image-holder img {
        display: none;
        height: auto;
    }
}

/********************************slider*/
#main-header {
}

    #main-header h1 {
        font-weight: bold;
    }

    #main-header .dropdown {
        margin-top: 55px;
    }



.newsticker {
    position: relative;
    vertical-align: middle;
}

    .newsticker:before {
        content: 'اطلاعیه‌ها';
        color: #fff;
        border-radius: 3px;
        background: #ed1c24;
        padding: 5px;
        float: right;
        margin: -4px 0 0 20px;
        font-weight: bold;
    }

    .newsticker .newsticker-items, .newsticker .newsticker-items li {
        margin: 0;
        padding: 0;
        line-height: 2em;
    }

        .newsticker .newsticker-items li span.date:before {
            content: '\f111';
            font-family: 'Font Awesome 5 Pro';
            margin: 0 8px 0;
            font-size: .7em;
            font-weight: bold
        }


.newsticker-buttons {
    position: absolute;
    top: 0;
    left: 0;
    font-family: 'Font Awesome 5 pro';
    cursor: pointer;
    font-size: 1.5em
}

    .newsticker-buttons span:hover {
        opacity: 1;
    }

    .newsticker-buttons span {
        opacity: .5;
    }

    .newsticker-buttons .up:after {
        content: '\f106'
    }

    .newsticker-buttons .down:after {
        content: '\f107';
    }


.timer {
    background-color: rgba(0,0,0,0.1);
    padding: 15px 0 10px 0;
    border-radius: 10px;
}

    .timer span {
        font-size: 21px;
        color: #777;
        font-weight: bold;
    }

/*******************************************************Audio**/
.plyr--audio .plyr__controls {
    background-color: transparent;
    border-radius: 34px;
    color: #0153dc;
    padding: 10px;
}

.plyr--audio .plyr__control.plyr__tab-focus, .plyr--audio .plyr__control:hover, .plyr--audio .plyr__control[aria-expanded=true] {
    background: #0153dc;
    color: #fff;
}

.plyr__control.plyr__tab-focus {
    box-shadow: 0 0 0 5px rgba(1, 83, 220, 0.45);
    outline: 0;
}

.plyr--full-ui input[type=range] {
    color: #0153dc;
}

#tracks {
    text-align: center;
}

    #tracks a {
        cursor: pointer;
        margin: 0 5px;
        color: #0153dc;
    }


#plList li {
    cursor: default;
    display: block;
    margin: 0 0 5px 0px;
    padding: 10px 0;
    border-radius: 5px;
}

    #plList li:hover {
        background-color: rgba(0,0,0,.1);
    }

.plItem {
    position: relative;
}

.plTitle {
    left: 50px;
    overflow: hidden;
    position: absolute;
    right: 65px;
    text-overflow: ellipsis;
    top: 0;
    white-space: nowrap;
}

.plNum {
    padding-right: 21px;
    width: 25px;
}

.plLength {
    padding-right: 21px;
    position: absolute;
    left: 21px;
    top: 0;
    cursor: pointer;
}

.plSel,
.plSel:hover {
    background-color: rgba(0,0,0,.1);
    color: #0153dc;
    cursor: default !important;
}

.plyr button {
    height: 2.5em;
}

/**************Begin Counter**************/
.counter-wrapper {
    background: #222222 none repeat scroll 0 0;
    padding-bottom: 40px;
    padding-top: 41px;
    text-align: center;
}

.counters-count {
    font-size: 22px;
    font-weight: 800;
    line-height: 20px;
    margin-bottom: 8px;
}

.counters-label {
    color: rgba(0, 0, 0, 0.6);
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
}

.counters-entry {
    border-left: 1px solid #4e4e4e;
    float: right;
    width: 95px;
    padding: 10px 0;
}

    .counters-entry:last-child {
        border-left: none;
    }

.counter-title {
    display: inline-block;
    font-size: 23px;
    font-weight: 400;
    line-height: 40px;
    vertical-align: top;
}

    .counter-title small {
        display: block;
        font-weight: normal;
        font-size: 78%;
    }

.counters-block {
    display: inline-block;
    margin-top: 2px;
}
/**************End Counter**************/

#MeetingCover h1 {
    font-size: 4.5em;
    text-shadow: 1px 1px 1px rgba(0,0,0,1)
}

#loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: #fff;
    opacity: 1;
    transition: all ease-in-out 0.5s;
}

    #loader i {
        position: absolute;
        top: 50%;
        left: 50%;
        font-size: 40px;
        animation: spin 2s linear infinite;
    }

.avatar-list li {
    font-weight: bold;
    font-size: 14px;
}

    .avatar-list li img {
        margin-left: 10px;
    }

.selectable-list li {
    list-style: none;
    background: #fafafa;
    border-radius: 5px;
    padding: 10px;
    margin-bottom: 2px;
    cursor: pointer;
}

    .selectable-list li:hover {
        background: #02a500;
        color: #fff;
    }

.card-1 .avatar--sm img {
    max-height: 4.78571429em;
    margin-left: 0.46428571em;
    margin-right: 0;
    margin-bottom: 0;
}

.card-1 .avatar--sm .card__meta {
    margin-top: 18px;
}

    .card-1 .avatar--sm .card__meta i {
        margin-right: 5px;
        font-size: 1.3em;
    }

.card-selectable {
    cursor: pointer;
    position: relative;
}

    .card-selectable:hover {
        cursor: pointer;
        border: #fff 1px solid;
    }

    .card-selectable[data-overlay]:hover:before {
        opacity: .2;
        background: #1aba17;
        transition: 0.3s ease;
        -webkit-transition: 0.3s ease;
        -moz-transition: 0.3s ease;
    }

    .card-selectable[data-overlay]:hover:after {
        content: '\f067';
        text-align: center;
        font-size: 48px;
        font-family: "Font Awesome 5 Pro";
        color: #1aba17;
        vertical-align: middle;
        position: absolute;
        top: 50%;
        left: 50%;
        margin-left: -18px;
        margin-top: -18px;
        z-index: 10;
    }

.tabs-content > li:not(.active) .tab__content {
    position: absolute;
    left: 0;
    top: 0;
    visibility: hidden;
    opacity: 0;
    display: none;
    transition: visibility 0s, opacity 0.5s linear;
    pointer-events: none;
    animation: fadeOutRight .5s ease forwards;
    -webkit-animation: fadeOutRight .5s ease forwards;
}


.slider .slides {
    opacity: 0;
    transition: 0.5s opacity ease-in-out;
}

    .slider .slides.flickity-enabled {
        opacity: 1
    }


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

    100% {
        transform: rotate(360deg);
    }
}

#start.diactive {
    opacity: 0;
    visibility: hidden;
}

.boxed {
    overflow: initial !important;
}

.dropdown .dropdown__trigger {
    cursor: pointer;
    user-select: none;
    display: block;
}

article .article-title {
    text-align: center
}

    article .article-title h1 {
        font-weight: bold;
        font-size: 2.3em;
        margin-bottom: 10px;
    }

    article .article-title h4 {
        font-weight: bold;
        margin: 0;
    }

article .article-meta {
    text-align: center
}

    article .article-meta > span > day, article .article-meta > span > month {
        padding-left: 2px;
    }

    article .article-meta > span:not(:last-child):after {
        content: '\f111';
        font-family: 'Font Awesome 5 Pro';
        font-size: 0.8em;
        margin: 8px;
        display: inline-block
    }

    article .article-meta .date, article .article-meta .month, article .article-meta .year {
        padding: 0 2px;
    }

article .article-summary {
    text-align: justify;
    /*text-align-last: center;*/
    font-size: 1.4em;
    line-height: 1.7em;
    padding-bottom: 30px;
    margin: 30px 0;
    padding-right: 80px;
    border-bottom: 1px solid rgba(0, 0, 0, .1);
    position: relative
}

    article .article-summary:before {
        content: '\f10e';
        font-family: 'Font Awesome 5 Pro';
        font-weight: bold;
        color: rgba(0, 0, 0, .1);
        font-size: 58px;
        position: absolute;
        top: 15px;
        right: 0;
        text-align: justify;
    }



article .article-media {
    margin: 30px 0;
}

    article .article-media img {
        border-radius: 10px;
    }

article .article-body p {
    text-align: justify;
    line-height: 1.8em;
    font-size: 1.2em;
    margin-bottom: 1em;
}


.lb-prev:after {
    content: '\f053';
}

.lb-next:after {
    content: '\f054';
}

.lb-prev:after, .lb-next:after {
    font-family: 'Font Awesome 5 Pro';
    position: fixed;
}


.content-body {
}

.nav--bar {
    padding: 20px 0;
    border-bottom: 1px solid #ddd;
}

    .nav--bar h3 {
        margin: 0;
    }

    .nav--bar breadcrumbs li {
        margin-bottom: 0 !important;
    }

.breadcrumbs li:not(:last-child)::after {
    content: '\f104';
    margin-right: 0.5em !important;
    font-family: 'Font Awesome\ 5 Pro';
    font-weight: normal;
    top: 2px;
    position: relative;
    font-size: 1.1em;
}


.badge.badge--md {
    padding: 6px 10px;
    font-size: 100%;
}

.badge.badge--lg {
    padding: 10px 15px;
    font-size: 120%;
}

.pagination > li > a, .pagination > li > span,
.pagination > li:first-child > a, .pagination > li:first-child > span,
.pagination > li:last-child > a, .pagination > li:last-child > span {
    border-radius: 25px !important;
    border: none;
    color: #868c93;
}

    .pagination > li > span,
    .pagination > li > span:hover {
    }

.pagination > li:first-child > a,
.pagination > li:last-child > a {
}


.Pagination {
    font-size: 1.2em;
    text-align: center;
    /*border-top: 1px solid #ddd;*/
    padding: 30px 0;
}

    .Pagination li {
        vertical-align: middle;
        display: inline-block;
        margin: 5px;
    }

    .Pagination .current a {
        background: #0153dc;
        color: #fff !important;
        font-weight: bold;
    }

        .Pagination .current a:hover {
            background: #0153dc;
            color: #fff !important;
            cursor: default;
        }

    .Pagination a:hover {
        background: rgba(0,0,0,0.1);
    }

    .Pagination > li > a, .Pagination > li > span,
    .pagination > li:first-child > a, .pagination > li:first-child > span,
    .pagination > li:last-child > a, .pagination > li:last-child > span {
        border-radius: 25px !important;
        border: none;
        color: #39434d;
        width: 40px;
        height: 40px;
        text-align: center;
        display: block;
        transition: 0.5s background ease-in-out;
        padding: 5px 0;
    }


    .Pagination .next a, .Pagination .prev a, .Pagination .LastPage a, .Pagination .FirstPage a {
        display: block;
        font-size: 1.5em;
        font-weight: lighter
    }



        .Pagination .next a:after {
            content: "\f104";
            font-family: 'Font Awesome 5 Pro';
            margin-right: 3px;
        }

        .Pagination .prev a:before {
            content: "\f105";
            font-family: 'Font Awesome 5 Pro';
            margin-left: 3px;
        }

        .Pagination .LastPage a:after {
            content: "\f100";
            font-family: 'Font Awesome 5 Pro';
            margin-right: 3px;
        }

        .Pagination .FirstPage a:before {
            content: "\f101";
            font-family: 'Font Awesome 5 Pro';
            margin-left: 3px;
        }

    .Pagination .dots:after {
        content: "\f141";
        font-family: 'Font Awesome 5 Pro';
        color: #767f88;
    }

footer.bg--secondary {
    border-top: 1px solid #fff !important;
}

/* badge-list */

.badge-list li {
    display: inline-block;
}

    .badge-list li a {
        display: inline-block;
        padding: 3px 10px;
        margin: 1px;
        transition: ease background-color 0.5s;
    }

.badge-list.light li a {
    background: rgba(255,255,255,0.5);
    color: #777
}

    .badge-list.light li a:hover {
        background: rgba(255,255,255,.7);
        color: #58585a
    }

.badge-list.dark li a {
    background: rgba(0,0,0,0.6);
    color: #ffffff;
}

    .badge-list.dark li a:hover {
        background: rgba(0,0,0,0.8);
        color: #ffffff
    }

.badge-list.item-pill li a {
    border-radius: 100px;
}

.modal-container[data-modal-id="reg-login"] .modal-content .modal-close-cross {
    display: none;
}

/* instagram
==================================================*/

.instagram-image {
    position: relative;
    overflow: hidden;
}

a.instagram-image i {
    display: none;
}

a.instagram-video i, a.instagram-images i {
    position: absolute;
    top: 10px;
    right: 10px;
    text-align: center;
    font-size: 1.5em;
    color: #fff;
    text-shadow: 1px 1.5px 1.9px rgba(0, 0, 0, 0.58)
}

.instagramfeed.instagram-video, .instagramfeed.instagram-images {
    position: relative;
}

.instagramfeed .info {
    opacity: 1;
    visibility: visible;
}

.ribbon {
    width: 150px;
    height: 150px;
    overflow: hidden;
    position: absolute;
}

    .ribbon::before,
    .ribbon::after {
        position: absolute;
        /*z-index: -1;*/
        content: '';
        display: block;
        border: 5px solid #028700;
    }

    .ribbon span {
        position: absolute;
        display: block;
        width: 245px;
        padding: 15px 0;
        background-color: #1aba17;
        box-shadow: 0 5px 10px rgba(0,0,0,.1);
        color: #fff;
        text-shadow: 0 1px 1px rgba(0,0,0,.2);
        text-transform: uppercase;
        text-align: center;
    }



/* top left*/
.ribbon-top-left {
    top: -10px;
    left: -10px;
}

    .ribbon-top-left::before,
    .ribbon-top-left::after {
        border-top-color: transparent;
        border-left-color: transparent;
    }

    .ribbon-top-left::before {
        top: 0;
        right: 0;
    }

    .ribbon-top-left::after {
        bottom: 0;
        left: 0;
    }

    .ribbon-top-left span {
        right: -25px;
        top: 30px;
        transform: rotate(-45deg);
    }

/* top right*/
.ribbon-top-right {
    top: -10px;
    right: -10px;
}

    .ribbon-top-right::before,
    .ribbon-top-right::after {
        border-top-color: transparent;
        border-right-color: transparent;
    }

    .ribbon-top-right::before {
        top: 0;
        left: 0;
    }

    .ribbon-top-right::after {
        bottom: 0;
        right: 0;
    }

    .ribbon-top-right span {
        left: -25px;
        top: 30px;
        transform: rotate(45deg);
    }

/* bottom left*/
.ribbon-bottom-left {
    bottom: -10px;
    left: -10px;
}

    .ribbon-bottom-left::before,
    .ribbon-bottom-left::after {
        border-bottom-color: transparent;
        border-left-color: transparent;
    }

    .ribbon-bottom-left::before {
        bottom: 0;
        right: 0;
    }

    .ribbon-bottom-left::after {
        top: 0;
        left: 0;
    }

    .ribbon-bottom-left span {
        right: -25px;
        bottom: 30px;
        transform: rotate(225deg);
    }

/* bottom right*/
.ribbon-bottom-right {
    bottom: -10px;
    right: -10px;
}

    .ribbon-bottom-right::before,
    .ribbon-bottom-right::after {
        border-bottom-color: transparent;
        border-right-color: transparent;
    }

    .ribbon-bottom-right::before {
        bottom: 0;
        left: 0;
    }

    .ribbon-bottom-right::after {
        top: 0;
        right: 0;
    }

    .ribbon-bottom-right span {
        left: -25px;
        bottom: 30px;
        transform: rotate(-225deg);
    }



/*.ribbon
{
    position: absolute;
    top: 15px;
    left: -7px;
    background: #ccc;
    padding: 0 25px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}*/



.instagramfeed:hover .info {
    opacity: 1;
    visibility: visible;
}

@media (max-width: 1200px) and (min-width: 992px) {
    [dir="rtl"] .menu-horizontal li:not(:last-child) {
        margin-left: 0.5em !important;
    }
}

@media (max-width: 1200px) {

    .pricing h3 {
        font-size: 20px;
    }

    .pricing h4 {
        font-size: 15px;
    }

    .plugin .pricing .price {
        padding: 8px;
    }

        .plugin .pricing .price span {
            font-size: 13px;
        }

    .background-image {
        position: absolute;
        top: 45px;
        left: 87px;
        right: 85px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 286px;
        }
}


@media (max-width: 992px) {
    .clients-grid li:last-child:after {
        width: 100%;
        height: 0;
        top: auto;
        left: 0;
        bottom: -1px;
        border-bottom: none;
    }


    .highlight-right:after {
        background: none;
    }

    ul.clients-grid.grid-2.nobottommargin.bg.clearfix.text-center.m-3 {
        border-bottom: 1px dashed #DDD;
    }

    .highlight-right .row {
        background: rgba(250, 250, 250, 0.82);
    }

    .tabs li {
        padding: 0.92857143em 0.857143em;
    }


    .background-image {
        position: absolute;
        top: 28px;
        left: 60px;
        right: 59px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 177px;
        }
}


@media (min-width: 768px) {

    .menu-horizontal {
        display: inline-block;
    }

    .bar--transparent:not(.bar--dark) .logo-dark {
        display: none;
    }
}


@media (max-width: 767px) {
    .product .tools .form-check-input[type=checkbox] + label {
        display: block;
    }

    [dir="rtl"] .dropdown .dropdown__content {
        padding-right: 31px !important;
    }

    [dir="rtl"] .dropdown__container {
        right: -25px !important;
    }

    .col-xs-6:nth-child(even) {
        padding: 0 7.5px;
    }

    .col-xs-6:nth-child(odd) {
        padding: 0 7.5px;
    }

    .masonry-filters--horizontal .masonry__filters ul li {
        width: 50%;
        border-bottom: 1px solid rgba(255, 255, 255, 0.26);
    }

    .counter-value {
        font-size: 20px;
    }



    h3, .h3 {
        margin-bottom: 0.5em;
    }

    hr {
        margin: 0.5em 0;
    }

    .imageblock > .container, .imageblock > div[class*='col-']:not(.imageblock__content) {
        padding-top: 0.571429em;
        padding-bottom: 0.571429em;
    }

    section, footer {
        padding-top: 2em !important;
        padding-bottom: 2em !important;
    }

    .pricing-2 ul:first-child {
        margin-top: 0em;
    }

    ul.round-checkmark.iconfont.text-sm-right {
        text-align: right;
    }

    .footer-2 .col-md-4 {
        margin-bottom: 1.5rem;
    }

    .footer-2 h4 {
        margin-bottom: 0 !important;
    }

    .footer__lower .col-md-6 {
        text-align: center !important;
    }

    .type--fine-print {
        display: none;
    }

    .customer .switchable__text {
        text-align: center;
    }

        .customer .switchable__text h3 {
            margin-top: 5px;
        }

    .strategy .tab__content h3 {
        text-align: center;
    }

    .strategy .tab__content p {
        text-align-last: center;
    }

    footer .logo {
        margin-bottom: 0;
    }

    .footer__lower p {
        margin-bottom: 15px;
    }

    .contactus .img {
        display: none;
    }

    .pricing-box .pricing .plan-inside p:first-child {
        height: auto;
    }

    .link-Projects a {
        left: 0 !important;
        top: 36px !important;
    }

    .streatgy {
        text-align: center;
    }

    .imageblock .imageblock__content {
        display: none;
    }


    [dir="rtl"] .btn:not(.block) + .btn {
        margin-left: 0;
        margin-right: 1.6875em;
        margin-bottom: 1.85714286em;
    }

    .tabs {
        margin-top: 1.9em;
        border: none !important;
    }

        .tabs li {
            display: inline-block !important;
        }

            .tabs li:last-child {
                border-bottom: 1px solid #ececec !important;
            }

            .tabs li .h5 {
                font-size: 0.9em;
            }


    .pricing.pricing-1.boxed.boxed--lg.text-center ul, .pricing.pricing-1.boxed.boxed--lg.text-center p.webdesign-special {
        height: auto !important;
    }

    .background-image {
        position: absolute;
        top: 43px;
        left: 84px;
        right: 83px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 276px;
        }

    .background-slider h2 {
        font-size: 2em;
    }

    .background-slider p.lead {
        font-size: 1.5em;
    }
}

.rounded-xxs {
    border-radius: 3px;
    overflow: hidden;
}

.rounded-xs {
    border-radius: 6px;
    overflow: hidden;
}

.rounded-sm {
    border-radius: 12px;
    overflow: hidden;
}

.rounded-md {
    border-radius: 20px;
    overflow: hidden;
}

.rounded-lg {
    border-radius: 50px;
    overflow: hidden;
}

.powered-by {
    float: left;
    margin-right: 10px;
}

    .powered-by img {
        height: 12px;
    }

#copyright {
    font-size: 12px;
}


.overlayCutter {
    overflow: hidden;
    height: 100%;
}


    .overlayCutter:before {
        content: '';
        position: absolute;
        top: 0;
        bottom: 0;
        margin: 0;
        width: var(--width, 50%);
        height: 100%;
        border-radius: 0;
        -ms-transform: var(--ms-transform,skew(10deg, 0deg) translateX(75px));
        -webkit-transform: var(--webkit-transform,skew(10deg, 0deg) translateX(75px));
        transform: var(--transform,skew(10deg, 0deg) translateX(75px));
        background-color: var(--background-color, #000);
        opacity: var(--opacity, 0.8);
        z-index: 1;
        left: var(--left,auto);
    }

.overlaybg:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    margin: 0;
    width: var(--width, 50%);
    height: 100%;
    border-radius: 0;
    background: var(--backgroundGradient,linear-gradient(to right, transparent, rgba(0,0,0)));
    right: var(--right,0);
    opacity: var(--opacity, 0.8);
    left: var(--left,auto);
}

.overlay:before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    margin: 0;
    width: var(--width, 100%);
    height: 100%;
    border-radius: 0;
    background-color: var(--background-color, #000);
    right: 0;
    opacity: var(--opacity, 0.3);
}

#overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.1);
    visibility: visible;
    z-index: 1000;
    top: 0;
    display: none;
}

    #overlay.show {
        display: block;
    }

    #overlay.hide {
        display: none;
    }

    #overlay .overlay-container {
        text-align: center;
        top: calc( 50% - 100px);
        position: relative;
        z-index: 10001;
        width: 200px;
        margin: auto;
        background: #fff;
        border-radius: 10px;
        padding: 20px;
    }

.switch {
    opacity: .5;
    cursor: pointer;
    transition: 1s all ease;
}

    .switch.active {
        color: #4a90e2;
        cursor: pointer;
        opacity: 1;
    }


/* Timer */
.countdown {
    text-align: center;
    direction: ltr;
    font-weight: bold;
    font-size: 1.2em;
}

.jst-hours {
    display: none;
}

.jst-minutes {
    display: inline
}

.jst-seconds {
    display: inline
}

.jst-clearDiv {
}

.jst-timeout {
    color: red;
}


h4.FulTitle {
    display: block;
}

    h4.FulTitle span {
        display: block;
        font-size: 80%
    }

    h4.FulTitle span {
        display: block;
        font-size: 80%
    }

.radial:not(:last-child) {
    margin-bottom: 0.2em !important;
}


@media (max-width: 576px) {
    a .btn .btn--label {
        float: none;
    }

    .label {
        min-width: 40px;
        font-size: 9px;
        height: 23px;
        padding: 0 7px;
        top: 0.5em;
    }

    .tabs li {
        width: 48%;
    }

    .background-image {
        position: absolute;
        top: 52px;
        left: 135px;
        right: 134px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 381px;
        }

    img.image-tablet {
        transform: rotate(270deg);
        top: 59px;
        position: relative;
        max-width: 104%;
    }

    .project-detail {
        text-align: center;
    }

        .project-detail hr.short {
            margin: 13px auto;
        }

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

        .planlast-left .col-lg-3 {
            margin: 10px 0;
        }

    .background-slider h2 {
        font-size: 1.5em;
    }
}


@media (max-width: 576px) and (min-width: 550px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 120px;
        right: 140px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 390px;
        }
}

@media (max-width: 550px) and (min-width: 540px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 113px;
        right: 133px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 377px;
        }
}

@media (max-width: 540px) and (min-width: 530px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 112px;
        right: 128px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 370px;
        }
}

@media (max-width: 530px) and (min-width: 520px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 110px;
        right: 129px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 366px;
        }
}

@media (max-width: 520px) and (min-width: 510px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 104px;
        right: 122px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 348px;
        }
}

@media (max-width: 510px) and (min-width: 500px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 106px;
        right: 124px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 358px;
        }
}

@media (max-width: 500px) and (min-width: 495px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 105px;
        right: 122px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 345px;
        }
}

@media (max-width: 495px) and (min-width: 480px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 104px;
        right: 121px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 341px;
        }
}

@media (max-width: 480px) and (min-width: 475px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 100px;
        right: 116px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 328px;
        }
}

@media (max-width: 475px) and (min-width: 465px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 100px;
        right: 115px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 324px;
        }
}

@media (max-width: 465px) and (min-width: 450px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 95px;
        right: 111px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 307px;
        }
}

@media (max-width: 450px) and (min-width: 445px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 94px;
        right: 111px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 304px;
        }
}

@media (max-width: 445px) and (min-width: 430px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 94px;
        right: 110px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 304px;
        }
}

@media (max-width: 430px) and (min-width: 420px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 90px;
        right: 105px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 289px;
        }
}

@media (max-width: 420px) and (min-width: 410px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 88px;
        right: 102px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 284px;
        }
}



@media (max-width: 410px) and (min-width: 400px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 90px;
        right: 104px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 284px;
        }
}

@media (max-width: 400px) and (min-width: 380px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 88px;
        right: 103px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 283px;
        }
}

@media (max-width: 380px) and (min-width: 375px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 84px;
        right: 98px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 266px;
        }
}

@media (max-width: 375px) and (min-width: 360px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 84px;
        right: 98px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 267px;
        }
}

@media (max-width: 360px) and (min-width: 355px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 81px;
        right: 94px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 253px;
        }
}

@media (max-width: 355px) and (min-width: 340px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 80px;
        right: 92px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 249px;
        }
}

@media (max-width: 340px) and (min-width: 330px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 77px;
        right: 88px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 328px;
        }
}



@media (max-width: 330px) and (min-width: 320px) {
    .background-image {
        position: absolute;
        top: 52px;
        left: 74px;
        right: 86px;
        overflow: hidden;
    }

        .background-image .hover-item-scroll {
            height: 231px;
        }
}

@media (max-width: 992px) and (min-width: 768px) {
    .bar-2 .menu-horizontal > li, .bar-1 .menu-horizontal > li {
        display: block;
    }
}