﻿@font-face {
    font-family: IRANSans;
    font-weight: normal;
    font-style: normal;
    src: url("/fonts/IRANSans.eot");
    src: url("/fonts/IRANSans.eot?#iefix") format("embedded-opentype"),url("/fonts/IRANSans.woff") format("woff"),url("/fonts/IRANSans.ttf") format("truetype"),url("/fonts/IRANSans.svg#IRANSans") format("svg");
}

@font-face {
    font-family: IRANSansWeb;
    font-weight: normal;
    font-style: normal;
    src: url("/fonts/IRANSansWeb.eot");
    src: url("/fonts/IRANSansWeb.eot?#iefix") format("embedded-opentype"),url("/fonts/IRANSansWeb.woff") format("woff"),url("/fonts/IRANSansWeb.ttf") format("truetype"),url("/fonts/IRANSansWeb.svg#IRANSansWeb") format("svg");
}

:root {
    --thm-body-background-color: #fff;
    --thm-font-family: IRANSansWeb;
    --thm-color-light: var(--bs-gray-400);
    --thm-color-border: var(--thm-color-light);
    --thm-color-orage-600: #ca6510;
    --thm-color-special-1: #42889b;
    --thm-color-special-2: #eb6502;
    --thm-color-special-3: #d81616;
    --thm-color-special-4: #f5f5f5;
    --thm-color-special-5: #7e7e7e;
    --thm-color-gray: #f8f9fa;

    /* controls */
    --color-main-menu: var(--thm-color-special-1);
    --color-bg-footer: var(--thm-color-gray);
}

/* Bootstrap extended classes */
.w-ico {
    width: 20px !important;
    height: 20px !important;
}
.hr {
    height: 1px;
    background-color: var(--thm-color-light);
}
.inset-inline-auto {
    inset-inline:auto !important;
}
.w-ico-svg {
    opacity: 0.5;
}
    .w-ico-svg:hover {
        opacity: 0.9;
    }

/* Bootstrap overload classes */
.form-control:focus {
    border-color: var(--thm-color-border);
    -webkit-box-shadow: none;
    box-shadow: none;
}
input:focus, [type=button]:focus, [type=reset]:focus, [type=submit]:focus, button:focus {
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.bi {
    position:relative;
    top:2px;
}
.dropdown-toggle::after {
    vertical-align:0px !important;
}

/* Helper classes */
.thm-text-light {
    color: var(--thm-color-light);
}
.thm-border-light {
    border-color: var(--thm-color-border);
}
.thm-bg-badge {
    background-color: var(--bs-orange);
}
.thm-bg-gray {
    background-color: var(--thm-color-gray);
}
.btn-orange {
    background-color: var(--bs-orange) !important;
    color: var(--bs-white);
}
.btn-orange:hover {
    background-color: var(--thm-color-orage-600) !important;
    color: var(--bs-white);
}

/* Theme styles */
body {
    font-family: var(--thm-font-family);
    background-color: var(--thm-body-background-color);
}
::-webkit-scrollbar {
    width: 5px;
}
::-webkit-scrollbar-track {
    background: var(--bs-gray-400);
}
::-webkit-scrollbar-thumb {
    background: var(--thm-color-special-1);
}
    ::-webkit-scrollbar-thumb:hover {
        background: var(--thm-color-special-2);
    }
.thm-title-line-25 {
    height: 15px;
    width: 25px;
    border-bottom: var(--bs-orange) solid 2px;
    margin-right: 5px;
}
.thm-title-line-50 {
    height: 15px;
    width: 50px;
    border-bottom: var(--bs-orange) solid 2px;
    margin-right: 5px;
}
.thm-title-line-100 {
    height: 15px;
    width: 100px;
    border-bottom: var(--bs-orange) solid 2px;
    margin-right: 5px;
}

/* Pages & Controls Styles */
.contact-control-bg-image {
    background: url(/themes/rasha/images/logo-op15.png) no-repeat right center; 
    padding: 20px 10px; 
}
.sponsor-control img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.slideshow-control img {
    height: 442px;
    width: 100%;
    object-fit: cover;
}
.thm-main-menu {
    background-color: var(--color-main-menu);
}
.thm-footer {
    background-color: var(--color-bg-footer);
}

#SideBasket .footer {
    bottom: 0px;
    width: 100%;
    padding: 20px;
    line-height: 35px;
}
#SideBasket .basket-container {
    top: 63px;
    bottom: 113px;
    left: 0px;
    width: 400px;
    overflow-y: auto;
}
#SideBasket .quantity-section {
    width: 100px;
    border: 1px var(--thm-color-light) solid;
    display: flex;
    justify-content: space-between;
    padding: 5px;
}
    #SideBasket .quantity-section a {
        padding: 0 7px;
    }

.footer-fix-height {
    height: 110px;
}


/* Ajax search control */
.asearch-ctrl {
    padding: 15px 15px 0 15px;
    background-color: #fff;
    border-radius: 10px 10px 0 0;
}
.asearch-cnt {
    padding: 10px 15px 0 15px;
    border-radius: 0 0 10px 10px;
}

.captcha_wrap fieldset {
    margin: 0 auto;
}

/* Swiper overrides */
.swiper-pagination-bullet-active {
    width:25px;
    height:7px;
    border-radius:10px;
    background-color:var(--thm-color-special-1);
}


/* Responsive settings */
@media (min-width:992px) {
    /* lg */
    .sponsor-control > div > div:first-child {
        margin-bottom: 12px;
    }
}
@media (max-width:992px) {
    /* md and under */
    .raychat_main_button {
        margin-bottom: 100px!important;
    }
    .slideshow-control img {
        height: 350px;
    }
}
@media (max-width:767px) {
    /* sm and under */
    .sponsor-control > div > div:first-child {
        margin-bottom: 20px;
    }
    .slideshow-control img {
        height: 250px;
    }
}
@media (min-width:576px) {
    /* sm, md, lg */
    .offcanvas-end, .offcanvas-start {
        width: 400px;
    }
}
@media (max-width:576px) {
    /* under sm */
    .offcanvas-end, .offcanvas-start {
        width: 100%;
    }
    #SideBasket .basket-container {
        width: 100%;
    }

    .table-header th.last {
        border-radius: 10px 0 0 10px;
    }
}

/*Compare tab in compare page*/
#divCompare tr > td.param-title, tr > td.param-value {
    border: 1px solid #ccc
}

#divCompare td.param-title {
    background-color: #F2F2F2;
    padding: 8px 10px;
    width: 200px;
    font-family: IRANSansWeb;
    font-size: 16px
}

#divCompare td.param-value {
    background-color: #F9F9F9;
    padding: 2px 2px;
    color: #727272;
    text-align: center
}

#divCompare .compare-header td {
    width: 265px
}

    #divCompare .item_color {
        width: 20px;
        height: 20px;
        display: inline-block;
        margin-top: 8px;
        border: 1px solid #2D818F;
        border-radius:13px;
    }

#divCompare .finder {
    text-align: center;
    background: rgba(245,247,250,.7);
    border: 1px solid #CCC;
    border-left: none
}

    #divCompare .finder span {
        color: #f00;
        font-family: IRANSansWeb;
        font-size: 16px
    }
/*Compare template*/
#compareContainer {
    margin-bottom: 10px
}

#divCompareCardList {
    width: 99.8%
}

#divCompareButton {
    color: #FFF;
    z-index: 2;
    position: relative;
    float: left;
    left: -2px
}

    #divCompareButton a {
        background: #3e9ee8 url(/engine/modules/Sitesaz.Shopping/icon/add-Compare-icon.png) no-repeat center right;
        padding: 5px 40px 6px 8px;
        margin: 4px 6px;
        float: left;
        color: #FFF
    }

.shop-template-Compare img {
    margin: 5px;
    width: 100px;
    min-height: 100px;
    max-height: 100px
}

.shop-template-Compare .title {
    width: 100%;
    display: inline-block;
    color: #a639c3;
    height: 24px;
    display: block;
    overflow: hidden
}

.shop-template-Compare .Price {
    width: 100%;
    display: inline-block;
    color: #71625d
}

.shop-template-Compare-search {
    width: 99.8%;
    float: right;
    background: #fff;
    border-bottom: 1px solid #ccc;
    text-align: center;
    margin-bottom: 2px;
    line-height: 25px
}

    .shop-template-Compare-search a {
        width: 99.8%;
        display: inline-block
    }

    .shop-template-Compare-search:hover {
        background: #E5E5E5
    }

    .shop-template-Compare-search img {
        margin: 5px;
        width: 50px;
        width: 50px;
        float: right
    }

    .shop-template-Compare-search .title {
        color: #a639c3;
        font-size: 11px
    }

    .shop-template-Compare-search .Price {
        font-size: 11px;
        color: #71625d
    }


/* Login - Signup */
/*Signup*/
select {
    width: 100% !important;
    height: 40px !important;
}

textarea {
    width: 100% !important;
    max-width: 100% !important;
}

.Tab {
    border-width: 0px;
    border-radius: 0;
    padding: 15px;
    color: #000 !important;
    font-weight: bold;
    top: 0px !important;
}

    .Tab:hover {
        background-color: #d1d5d5;
    }

.Tab-Active {
    background-color: #5aa9ff;
    color: #fff !important;
    border-bottom: none;
    border-radius: 5px 5px 0 0 !important;
}

    .Tab-Active:hover {
        background-color: #5aa9ff;
    }

.Tab-Container {
    border: 2px solid #5aa9ff;
    padding: 20px 15% 30px 15%;
    border-radius: 10px 0 10px 10px;
    margin-bottom: 20px;
}

.Tab-Container-Start {
    border: 2px solid #5aa9ff;
    border-bottom: none;
    padding: 20px 15% 30px 15%;
    border-radius: 10px 0 0 0;
    margin-bottom: 0;
}

.Tab-Container-Content {
    border: 2px solid #5aa9ff;
    border-top: none;
    border-bottom: none;
    padding: 20px 15% 30px 15%;
    margin-top: 0;
    margin-bottom: 0;
}

.Tab-Container-End {
    border: 2px solid #5aa9ff;
    border-top: none;
    padding: 20px 15% 30px 15%;
    border-radius: 0 0 10px 10px;
    margin-top: 0;
    margin-bottom: 20px;
}

.switch-container {
    display: flex;
}

.switch-button {
    margin-left: 10px;
    display: flex;
    align-items: flex-end;
}

    .switch-button span {
        border: 1px solid #000;
        width: 20px;
        display: inline-block;
        height: 28px;
        text-align: center;
        line-height: 30px;
        padding: 6px;
        background-color: #fafafa;
        border: 1px solid #aaa; display: none;
    }

    .switch-button input {
        color: #000;
        padding: 10px 15px;
        background-color: #fafafa !important;
        background-image: none !important;
        border: 1px solid #aaa;
        text-shadow: none;
    }

        .switch-button span.active,
        .switch-button input.active {
            background-color: #5aa9ff !important;
            color: #fff !important;
        }

.BtnGreen {
    padding: 10px 15px;
}

@media screen and (max-width:600px) {
    .Tab-Container {
        padding: 20px 8% 30px 10%;
    }

    .Tab-Container-Start {
        padding: 20px 8% 30px 10%;
    }

    .Tab-Container-Content {
        padding: 20px 8% 30px 10%;
    }

    .Tab-Container-End {
        padding: 20px 8% 30px 10%;
    }
}

@media screen and (max-width:480px) {
    .Tab-Container-Start {
        padding: 20px 2% 30px 2%;
    }
}
/*Login*/
.login-container {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
}

    .login-container .box-login {
        width: 50%;
        border: 1px solid #ddd;
        border-radius: 10px;
        margin: 0 5px;
    }

        .login-container .box-login .User {
            background: #bb1e79 url(/userimages/pic-login/user-login.png) no-repeat top right;
        }

        .login-container .box-login .Buyer {
            background: #239973 url(/userimages/pic-login/buyer-login.png) no-repeat top right;
            ;
        }

        .login-container .box-login .box-header span {
            color: #fff;
            font-family: IRANSans;
            font-size: 18px;
            margin: 7% 3%;
            display: block;
        }

        .login-container .box-login .box-header {
            overflow: hidden;
            position: relative;
            border-radius: 10px;
            cursor: pointer;
        }

            .login-container .box-login .box-header .Logo {
                position: absolute;
                right: 10px;
            }

            .login-container .box-login .box-header img {
                float: left;
                margin: 0 2%;
            }

        .login-container .box-login .box-content {
            padding: 10px;
            border-radius: 0 0 10px 10px;
        }

            .login-container .box-login .box-content .upLogin {
                width: 90%;
                margin: 0 auto;
            }

                .login-container .box-login .box-content .upLogin input[type="text"] {
                    background: #fff !important;
                }

                .login-container .box-login .box-content .upLogin textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"],
                input[type="email"], input[type="url"], input[type="search"],
                input[type="tel"], input[type="color"] {
                    background: #fff !important; border:1px solid #ddd;
                }

.captcha_wrap fieldset {
    margin: 0 auto;
}


@media screen and (max-width:800px) {
    .login-container {
        flex-direction: column;
    }

        .login-container .box-login {
            width: 100%;
            margin: 0 0 20px 0;
        }
}
/* template */
.linkMain { text-align: center;}
.pic-mask  .Circel {  position: relative; height: 80px; width: 80px; border-radius: 100%; transition: all ease-in-out 0.5s; text-align: center; margin: 10px auto;  }
.pic-mask  .Circel img { height: 60px; margin: -12px auto; }
.pic-mask  .Circel:hover { transform: scale(0.9);}
.pic-mask  p a { margin-top: 15px; text-decoration: none; font-size: medium; color: #333; }