//trbl
//trbl
@zi1002: 99;
@zi1003: 999;
@zi1004: 9999;
@zi1005: 99999;
@zi1006: 999999;
@zi1007: 9999940;
@zi1007x: 9999999;
@zi1008: 9999950;
@zi1009: 9999960;
@zi1010: 9999970;
@zi1011: 9999980;
@ziMax: 9999999;

@ColorN0: #FC8621 ;
@cart-lcolor: #FC8621;
@ColorT0: rgba(30, 33, 45,0.7);
@ColorT1:rgba(57, 49, 25, 0.6);
@bodyBackColor: rgba(57, 49, 25, 0.6);
@ColorT2: rgba(57, 49, 25, 0.3);
@notification-bcolor: rgba(57, 49, 25, 0.3);
@ColorT3: rgba(57, 49, 25, 0.5);
@ColorT4: rgba(57, 49, 25, 0.7) ;
@ColorT5: rgba(57, 49, 25, 0.9) ;
@gx:12;

.posRel {
    position: relative;
}

.backkorda {
    background-image: url(bg-title5.png);
    background-repeat: no-repeat;
    background-position-x: right;
    background-color: #585858;
    opacity: 0.7
}

.pr {
    position: relative;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.boxInOut {
    -webkit-box-shadow: 0px 0px 3px 2px rgba(255, 0, 0, 0.75);
    -moz-box-shadow: 0px 0px 3px 2px rgba(255, 0, 0, 0.75);
    box-shadow: 0px 0px 3px 2px rgba(255, 0, 0, 0.75);
}

.lkdlGrad {
    background: rgba(237,237,237,1);
    background: -moz-linear-gradient(left, rgba(237,237,237,1) 0%, rgba(246,246,246,1) 53%, rgba(255,255,255,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(237,237,237,1)), color-stop(53%, rgba(246,246,246,1)), color-stop(100%, rgba(255,255,255,1)));
    background: -webkit-linear-gradient(left, rgba(237,237,237,1) 0%, rgba(246,246,246,1) 53%, rgba(255,255,255,1) 100%);
    background: -o-linear-gradient(left, rgba(237,237,237,1) 0%, rgba(246,246,246,1) 53%, rgba(255,255,255,1) 100%);
    background: -ms-linear-gradient(left, rgba(237,237,237,1) 0%, rgba(246,246,246,1) 53%, rgba(255,255,255,1) 100%);
    background: linear-gradient(to right, rgba(237,237,237,1) 0%, rgba(246,246,246,1) 53%, rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#ffffff', GradientType=1 );
}

.x input[type=text], .x input[type=search], .x input[type=password], .x input[type=button], .x input[type=submit], .x input[type=reset], select {
    height: 40px;
    line-height: 30px;
    padding-left: 5px;
    padding-right: 5px;
    margin-left: 5px;
    margin-right: 5px;
    margin-bottom: 0px;
    box-sizing: border-box;
    border: 1px solid rgb(150,150,150);
    border-radius: 2px;
    direction: rtl;
    text-align: right;
    font-size: 14px;
}

.x select {
    line-height: 30px;
}

.x input[type=button], .x input[type=submit], .x input[type=reset] {
    background-color: #264bb1;
    border: none;
    color: white;
    text-decoration: none;
    cursor: pointer;
    text-align: center;
    display: inline-block;
}

.x input[type=text]:focus, .x input[type=search]:focus, .x input[type=password]:focus, .x input[type=button]:focus, .x input[type=submit]:focus, .x input[type=reset]:focus, .x input[type=button]:hover, .x input[type=submit]:hover, .x input[type=reset]:hover {
    background-color: #d5e3ea;
    -webkit-box-shadow: 0 0 5px 0 #0099FF;
    box-shadow: 0 0 5px 0 #0099FF;
}

.x input[type=button]:hover, .x input[type=submit]:hover, .x input[type=reset]:hover {
    background-color: #0099ff;
}

#registerBoxC select {
    margin-left: 0px;
    margin-right: 0px;
}

@keyframes fi {
    0% {
        opacity: 0;
        display: block;
    }

    1% {
        opacity: 0;
    }

    99% {
        opacity: 1;
    }

    100% {
        opacity: 1;
    }
}

@keyframes foi {
    0% {
        opacity: 0;
        display: block;
    }

    1% {
        opacity: 0;
    }

    99% {
        opacity: 1;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fo {
    0% {
        opacity: 1;
    }

    1% {
        opacity: 1;
    }

    99% {
        opacity: 0;
    }

    100% {
        opacity: 0;
        display: none;
    }
}



@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeout {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

textarea {
    padding-left: 5px;
    padding-right: 5px;
    box-sizing: border-box;
}

body {
    margin: 0px;
    padding: 0px;
}

.gGold {
    background: linear-gradient(to right, #BF953F, #FCF6BA, #B38728, #FBF5B7, #AA771C);
}

.gGoldForeColor {
    background-image: linear-gradient(to right, #BF953F, #FCF6BA, #B38728, #FBF5B7, #AA771C);
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
}

@font-face {
    font-family: "FAB";
    font-style: normal;
    font-weight: normal;
    font-display: auto;
    src: url(/Fonts/fa-brands-400.eot);
    src: url(/Fonts/fa-brands-400.eot?#iefix) format("embedded-opentype"),url(/Fonts/fa-brands-400.woff2) format("woff2"),url(/Fonts/fa-brands-400.woff) format("woff"),url(/Fonts/fa-brands-400.ttf) format("truetype"),url(/Fonts/fa-brands-400.svg#fontawesome) format("svg");
}

@font-face {
    font-family: "FAR";
    font-style: normal;
    font-weight: 400;
    font-display: auto;
    src: url(/Fonts/fa-regular-400.eot);
    src: url(/Fonts/fa-regular-400.eot?#iefix) format("embedded-opentype"),url(/Fonts/fa-regular-400.woff2) format("woff2"),url(/Fonts/fa-regular-400.woff) format("woff"),url(/Fonts/fa-regular-400.ttf) format("truetype"),url(/Fonts/fa-regular-400.svg#fontawesome) format("svg");
}


@font-face {
    font-family: "FAS";
    font-style: normal;
    font-weight: 900;
    font-display: auto;
    src: url(/Fonts/fa-solid-900.eot);
    src: url(/Fonts/fa-solid-900.eot?#iefix) format("embedded-opentype"),url(/Fonts/fa-solid-900.woff2) format("woff2"),url(/Fonts/fa-solid-900.woff) format("woff"),url(/Fonts/fa-solid-900.ttf) format("truetype"),url(/Fonts/fa-solid-900.svg#fontawesome) format("svg");
}

.fawb {
    font-family: "FAB";
    font-size: 1.4em;
}

.fawr {
    font-family: "FAR";
    font-size: 1.4em;
}

.faws {
    font-family: "FAS";
    font-weight: 900;
    font-size: 1.4em;
}

@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: 900;
    src: url('/FontsIRANSansWeb_Black.eot?v=5.50');
    src: url('/FontsIRANSansWeb_Black.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('/Fonts/IRANSansWeb_Black.woff2?v=5.50') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('/Fonts/IRANSansWeb_Black.woff?v=5.50') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('/Fonts/IRANSansWeb_Black.ttf') format('truetype');
}

@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: bold;
    src: url('/Fonts/IRANSansWeb_Bold.eot?v=5.50');
    src: url('/Fonts/IRANSansWeb_Bold.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('/Fonts/IRANSansWeb_Bold.woff2?v=5.50') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('/Fonts/IRANSansWeb_Bold.woff?v=5.50') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('/Fonts/IRANSansWeb_Bold.ttf') format('truetype');
}

@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: 500;
    src: url('/Fonts/IRANSansWeb_Medium.eot?v=5.10');
    src: url('/Fonts/IRANSansWeb_Medium.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('/Fonts/IRANSansWeb_Medium.woff2?v=5.10') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('/Fonts/IRANSansWeb_Medium.woff?v=5.10') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('/Fonts/IRANSansWeb_Medium.ttf') format('truetype');
}

@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: 300;
    src: url('/Fonts/IRANSansWeb_Light.eot?v=5.10');
    src: url('/Fonts/IRANSansWeb_Light.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('/Fonts/IRANSansWeb_Light.woff2?v=5.10') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('/Fonts/IRANSansWeb_Light.woff?v=5.10') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('/Fonts/IRANSansWeb_Light.ttf') format('truetype');
}

@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: 200;
    src: url('/Fonts/IRANSansWeb_UltraLight.eot?v=5.50');
    src: url('/Fonts/IRANSansWeb_UltraLight.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('/Fonts/IRANSansWeb_UltraLight.woff2?v=5.50') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('/Fonts/IRANSansWeb_UltraLight.woff?v=5.50') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('/Fonts/IRANSansWeb_UltraLight.ttf') format('truetype');
}

@font-face {
    font-family: IRANSans;
    font-style: normal;
    font-weight: normal;
    src: url('/Fonts/IRANSansWeb.eot?v=5.50');
    src: url('/Fonts/IRANSansWeb.eot?#iefix') format('embedded-opentype'), /* IE6-8 */
    url('/Fonts/IRANSansWeb.woff2?v=5.50') format('woff2'), /* FF39+,Chrome36+, Opera24+*/
    url('/Fonts/IRANSansWeb.woff?v=5.50') format('woff'), /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
    url('/Fonts/IRANSansWeb.ttf') format('truetype');
}


@keyframes rotateFull {
    0% {
        /* Safari */
        -webkit-transform: rotate(0deg) scale(1.0, 1.0);
        /* Firefox */
        -moz-transform: rotate(0deg) scale(1.0, 1.0);
        /* IE */
        -ms-transform: rotate(0deg) scale(1.0, 1.0);
        /* Opera */
        -o-transform: rotate(0deg) scale(1.0, 1.0);
        transform: rotate(0deg) scale(1.0, 1.0);
    }

    25% {
        /* Safari */
        -webkit-transform: rotate(90deg) scale(0.8, 0.8);
        /* Firefox */
        -moz-transform: rotate(90deg) scale(0.8, 0.8);
        /* IE */
        -ms-transform: rotate(90deg) scale(0.8, 0.8);
        /* Opera */
        -o-transform: rotate(90deg) scale(0.8, 0.8);
        transform: rotate(90deg) scale(0.8, 0.8);
    }

    50% {
        /* Safari */
        -webkit-transform: rotate(180deg) scale(1.2, 1.2);
        /* Firefox */
        -moz-transform: rotate(180deg) scale(1.2, 1.2);
        /* IE */
        -ms-transform: rotate(180deg) scale(1.2, 1.2);
        /* Opera */
        -o-transform: rotate(180deg) scale(1.2, 1.2);
        transform: rotate(180deg) scale(1.2, 1.2);
    }

    75% {
        /* Safari */
        -webkit-transform: rotate(270deg) scale(0.8, 0.8);
        /* Firefox */
        -moz-transform: rotate(270deg) scale(0.8, 0.8);
        /* IE */
        -ms-transform: rotate(270deg) scale(0.8, 0.8);
        /* Opera */
        -o-transform: rotate(270deg) scale(0.8, 0.8);
        transform: rotate(270deg) scale(0.8, 0.8);
    }

    100% {
        /* Safari */
        -webkit-transform: rotate(360deg) scale(1.0, 1.0);
        /* Firefox */
        -moz-transform: rotate(360deg) scale(1.0, 1.0);
        /* IE */
        -ms-transform: rotate(360deg) scale(1.0, 1.0);
        /* Opera */
        -o-transform: rotate(360deg) scale(1.0, 1.0);
        transform: rotate(360deg) scale(1.0, 1.0);
    }
}

@keyframes glow1 {
    0%,100%, 90%,92%,94%,96% {
        text-shadow: 0 0 0px #000, 0 0 0px #fff, 0 0 6px #fff, 0 0 0px #b1c1ce, 0 0 0px #b1c1ce, 0 0 0px #b1c1ce, 0 0 0px #b1c1ce, 0 0 0px #b1c1ce;
    }

    91%,93%,95% {
        text-shadow: 0 0 2px #000, 0 0 4px #fff, 0 0 6px #fff, 0 0 8px #b1c1ce, 0 0 10px #b1c1ce, 0 0 12px #b1c1ce, 0 0 14px #b1c1ce, 0 0 18px #b1c1ce;
    }

    97% {
        text-shadow: 0 0 2px #000, 0 0 4px #fff, 0 0 6px #fff, 0 0 8px #b1c1ce, 0 0 10px #b1c1ce, 0 0 20px #b1c1ce, 0 0 22px #b1c1ce, 0 0 30px #fff;
    }
}

@keyframes glow2 {
    0% {
        text-shadow: 0 0 0px #000, 0 0 0px #fff, 0 0 6px #fff, 0 0 0px #C5B358, 0 0 0px #C5B358, 0 0 0px #C5B358, 0 0 0px #C5B358, 0 0 0px #C5B358;
    }

    30% {
        text-shadow: 0 0 2px #000, 0 0 4px #fff, 0 0 6px #fff, 0 0 8px #CFB53B, 0 0 10px #CFB53B, 0 0 12px #CFB53B, 0 0 14px #CFB53B, 0 0 18px #CFB53B;
    }

    60% {
        text-shadow: 0 0 2px #000, 0 0 4px #fff, 0 0 6px #fff, 0 0 8px #C5B358, 0 0 10px #C5B358, 0 0 20px #C5B358, 0 0 22px #C5B358, 0 0 30px #fff;
    }
}


.gradientLine {
    background: rgba(255,255,255,1);
    background: -moz-linear-gradient(left, rgba(255,255,255,1) 1%, rgba(164,179,87,1) 55%, rgba(117,137,12,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(1%, rgba(255,255,255,1)), color-stop(55%, rgba(164,179,87,1)), color-stop(100%, rgba(117,137,12,1)));
    background: -webkit-linear-gradient(left, rgba(255,255,255,1) 1%, rgba(164,179,87,1) 55%, rgba(117,137,12,1) 100%);
    background: -o-linear-gradient(left, rgba(255,255,255,1) 1%, rgba(164,179,87,1) 55%, rgba(117,137,12,1) 100%);
    background: -ms-linear-gradient(left, rgba(255,255,255,1) 1%, rgba(164,179,87,1) 55%, rgba(117,137,12,1) 100%);
    background: linear-gradient(to right, rgba(255,255,255,1) 1%, rgba(164,179,87,1) 55%, rgba(117,137,12,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#75890c', GradientType=1 );
}

.gradientLine2 {
    background: rgba(133,133,133,1);
    background: -moz-linear-gradient(left, rgba(133,133,133,1) 0%, rgba(254,254,254,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(133,133,133,1)), color-stop(100%, rgba(254,254,254,1)));
    background: -webkit-linear-gradient(left, rgba(133,133,133,1) 0%, rgba(254,254,254,1) 100%);
    background: -o-linear-gradient(left, rgba(133,133,133,1) 0%, rgba(254,254,254,1) 100%);
    background: -ms-linear-gradient(left, rgba(133,133,133,1) 0%, rgba(254,254,254,1) 100%);
    background: linear-gradient(to right, rgba(133,133,133,1) 0%, rgba(254,254,254,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#858585', endColorstr='#fefefe', GradientType=1 );
}

.gradientLine3 {
    background: rgba(226,226,226,1);
    background: -moz-linear-gradient(left, rgba(226,226,226,1) 0%, rgba(173,171,173,1) 100%);
    background: -webkit-gradient(left top, right top, color-stop(0%, rgba(226,226,226,1)), color-stop(100%, rgba(173,171,173,1)));
    background: -webkit-linear-gradient(left, rgba(226,226,226,1) 0%, rgba(173,171,173,1) 100%);
    background: -o-linear-gradient(left, rgba(226,226,226,1) 0%, rgba(173,171,173,1) 100%);
    background: -ms-linear-gradient(left, rgba(226,226,226,1) 0%, rgba(173,171,173,1) 100%);
    background: linear-gradient(to right, rgba(226,226,226,1) 0%, rgba(173,171,173,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2e2e2', endColorstr='#adabad', GradientType=1 );
}

.gradientStart {
    background: #ffffff;
    background: -moz-linear-gradient(left, #ffffff 0%, #ffffff 94%, #bfbfbf 100%);
    background: -webkit-linear-gradient(left, #ffffff 0%,#ffffff 94%,#bfbfbf 100%);
    background: linear-gradient(to right, #ffffff 0%,#ffffff 94%,#bfbfbf 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#bfbfbf',GradientType=1 );
}

.gradientEnd {
    background: #bfbfbf;
    background: -moz-linear-gradient(left, #bfbfbf 0%, #ffffff 6%, #ffffff 100%);
    background: -webkit-linear-gradient(left, #bfbfbf 0%,#ffffff 6%,#ffffff 100%);
    background: linear-gradient(to right, #bfbfbf 0%,#ffffff 6%,#ffffff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bfbfbf', endColorstr='#ffffff',GradientType=1 );
}

.boxShadow1 {
    overflow: hidden;
    .borderRadius(10%);
    border: 1px solid #555555;
    margin-bottom: 10px;
}

.boxShadow2 {
    border: 1px solid rgba(250,219,95,1);
    -webkit-box-shadow: 0px 0px 5px 2px rgba(250,219,95,1);
    -moz-box-shadow: 0px 0px 5px 2px rgba(250,219,95,1);
    box-shadow: 0px 0px 5px 2px rgba(250,219,95,1);
}

.boxShadow5 {
    border: 1px solid rgba(255,255,255,1);
    -webkit-box-shadow: 0px 0px 3px 1px rgba(255,255,255,1);
    -moz-box-shadow: 0px 0px 3px 1px rgba(255,255,255,1);
    box-shadow: 0px 0px 3px 1px rgba(255,255,255,1);
}

.boxShadow6 {
    -webkit-box-shadow: 0px 0px 1px 1px rgba(255,255,255,1);
    -moz-box-shadow: 0px 0px 1px 1px rgba(255,255,255,1);
    box-shadow: 0px 0px 1px 1px rgba(255,255,255,1);
}

.boxShadowLight {
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
}

.boxShadow5Logo {
    border: 1px solid #4286F7;
    -webkit-box-shadow: 0px 0px 3px 1px #4286F7;
    -moz-box-shadow: 0px 0px 3px 1px #4286F7;
    box-shadow: 0px 0px 3px 1px #4286F7;
}

.boxShadow3 {
    -webkit-box-shadow: 0px 1px 3px 0px rgba(119,119,119,1);
    -moz-box-shadow: 0px 1px 3px 0px rgba(119,119,119,1);
    box-shadow: 0px 1px 3px 0px rgba(119,119,119,1);
}

.boxShadow4 {
    .borderRadius(4px);
    -webkit-box-shadow: 0px 0px 3px 0px #bfbfbf;
    -moz-box-shadow: 0px 0px 3px 0px #bfbfbf;
    box-shadow: 0px 0px 3px 0px #bfbfbf;
    overflow: hidden;
}

.boxShadowInset1 {
    -webkit-box-shadow: inset 0px 0px 2px 1px #cdcdcd;
    -moz-box-shadow: inset 0px 0px 2px 1px #cdcdcd;
    box-shadow: inset 0px 0px 2px 1px #cdcdcd;
}

.boxShadowInset2 {
    -webkit-box-shadow: inset 0px 0px 1px 0px rgba(0,0,0,0.05);
    -moz-box-shadow: inset 0px 0px 1px 0px rgba(0,0,0,0.05);
    box-shadow: inset 0px 0px 1px 0px rgba(0,0,0,0.05);
}

.blur2px {
    -webkit-filter: blur(2px);
    filter: blur(2px);
}

.blur1px {
    -webkit-filter: blur(1px);
    filter: blur(1px);
    color: darkolivegreen;
}

@maxw: 1600px;
@myCyan: #49b9ff;
@menuActive: #FC8621;
@menuHighlight: midnightblue;

@errorColor: #f00;

@counterb: #3b3b3b;
@countert: #fff;

@footercolorf: White;

@srateb: #444a6f;
@sratef: #fff;

@offerOldb: #444a6f;
@offerOldf: #eee;
@offerf: #ffffff;
@oactiveb: #fe5353;
@oactivef: #fff;
@offerb: #0095ff;
@offerbh: #444a6f;
@offercontentb: #fff;
@offerborderright: #e5e5e5;

@notavailablebackcolor: #fffcda;
@notavailablecolor: #ff0000;

@thColor: #efefef;
@tdColor: #fafafa;

@cart-rcolor: #10b03e;
@cart-lcolor: #ccccff;

@like-color: gray;
@liked-color: #fe5353;

@cart-rcolorH: #5cad5f;
@cart-lcolorH: #46a349;
@cart-colorf: #bbb;

@sp-color1: #00ff49;
@sp-color2: #5555ff;
@sp-color3: #7777ff;
@sp-colorf: white;

@gTitleColor: #000;
@backcolor2: rgba(255,255,255,0.5);
@containersBackColor: rgba(255,255,255,0.3);
@backcolor2Title: rgba(255,255,255,0.2);
@veryFade-color: #e5e5e5;
@ultraFade-color: #f5f5f5;
@fade-color: #999;
@halfFade-color: black;
@hhalfFade-color: #333;

@price-color: #000000;
@nav-color: #d5d7e8;
@notification-bcolor: rgba(255,255,255,0.9);
@notification-tcolor: #444a6f;
@hover1-color: #8e6a0f;
@hover2-color: #FFB602;
@links1-color: #444a6f;
@links2-color: black;
@links3-color: mediumblue;
@links4-color: darkblue;
@links5-color: midnightblue;
@star-colorE: #555;
@star-colorF: gold;

@ttip-bcolor: #8084a0;
@ttip-fcolor: #fff;
@gbar-bcolor: #e8eaf7;
@menu-bcolor: transparent;
@search-bcolor1: #eceff1;
@search-bcolor2: #f9faff;
@search-bcolorHighligh: #eff1ff;
@autocomplete-suggestionColor: #444;
@searchBoxBtn_hover: gold;
@close-color: #f00;


@logo-bcolor: #555;
@logo-bcolor: #fe5353;
@logo-flash: #fff;
@logoRight: 5px;
@logoWidth: 140px;
@logoHeight: 140px;


@options_bcolor: transparent;
@options_tcolor: transparent;

@hl1H-bcolor: #D4D490;
@hl1N-bcolor: #222;

@hl1H-tcolor: #222;
@hl1N-tcolor: #D4D490;
@kordaGreen: #5555ff;
@mainmenubcolor: @menu-bcolor;



.noSelect {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.fw {
    width: 100%;
}

.fw-10 {
    width: calc(100% - 10px);
}

.fullWidth {
    width: 100%;
    height: auto;
}

.paddings(@pads: 10px) {
    padding: @pads;
}

.stretch(@w: 1, @h: 1) {
    -webkit-transform: scale(@w,@h); /* Safari and Chrome */
    -moz-transform: scale(@w,@h); /* Firefox */
    -ms-transform: scale(@w,@h); /* IE 9 */
    -o-transform: scale(@w,@h); /* Opera */
    transform: scale(@w,@h); /* W3C */
    transform-origin: top left;
}

.borderRadius(@border: 5px) {
    -webkit-border-radius: @border;
    -moz-border-radius: @border;
    border-radius: @border;
}

.borderRadiusTlTrBlBr(@Tl: 5px, @Tr: 5px, @Bl: 5px,@Br: 5px) {
    -moz-border-radius-topleft: @Tl;
    -webkit-border-top-left-radius: @Tl;
    border-top-left-radius: @Tl;
    -moz-border-radius-topright: @Tr;
    -webkit-border-top-right-radius: @Tr;
    border-top-right-radius: @Tr;
    -moz-border-radius-bottomright: @Br;
    -webkit-border-bottom-right-radius: @Br;
    border-bottom-right-radius: @Br;
    -moz-border-radius-bottomleft: @Bl;
    -webkit-border-bottom-left-radius: @Bl;
    border-bottom-left-radius: @Bl;
}

.transAllEase(@easetime: 100ms) {
    transition: all @easetime ease-in-out;
    -webkit-transition: all @easetime ease-in-out;
    -ms-transition: all @easetime ease-in-out;
    -o-transition: all @easetime ease-in-out;
}

.transAllNone() {
    transition: all 0 none;
    -webkit-transition: all 0 none;
    -ms-transition: all all 0 none;
    -o-transition: all all 0 none;
}

.backfadeTR {
    background: #ffffff;
    background: -moz-linear-gradient(45deg, transparent 85%, #787878 95%, transparent 98%);
    background: -webkit-gradient(left bottom, right top, color-stop(85%, transparent), color-stop(95%, #787878), color-stop(98%, transparent));
    background: -webkit-linear-gradient(45deg, transparent 85%, #787878 95%, transparent 98%);
    background: -o-linear-gradient(45deg, transparent 85%, #787878 95%, transparent 98%);
    background: -ms-linear-gradient(45deg, transparent 85%, #787878 95%, transparent 98%);
    background: linear-gradient(45deg, transparent 85%, #787878 95%, transparent 98%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000F', endColorstr='#000000F', GradientType=1 );
}

@-webkit-keyframes blurAnimation {
    0% {
        letter-spacing: -17px;
        opacity: 0;
    }

    30% {
        letter-spacing: 4px;
        opacity: 1;
    }

    100% {
        letter-spacing: 0px;
        opacity: 1;
    }
}


.basics {
    box-sizing: border-box;
    position: relative;
    .transAllEase(100ms);
}

.basicsNoTrans {
    box-sizing: border-box;
    position: relative;
    transform: unset;
}

.hover1 {
    color: @hover1-color;
}

.hover2 {
    color: @hover2-color;
}

.nodecor {
    text-decoration: none;
    cursor: pointer;
}

.shadow1 {
    text-shadow: 0px 0px 16px rgba(16, 0, 0, 1);
}

.shadow2 {
    text-shadow: 0px 0px 8px #fc8621;
}

.shadow3 {
    text-shadow: 0 0 4px rgba(255, 255, 255, .2), 0 0 5px rgba(255, 255, 255, 1), 0 0 10px rgba(255, 255, 255, 1), 0 0 14px rgba(255, 255, 255, 1), 0 0 18px rgba(255, 255, 255, 1), 0px 0px 24px rgba(255, 255, 255, 1);
}

.shadow4 {
    text-shadow: 0 0 1px rgba(255, 255, 255, .2), 0 0 3px rgba(255, 255, 255, 1), 0 0 5px rgba(255, 255, 255, 1), 0 0 7px rgba(255, 255, 255, 0.7), 0 0 9px rgba(255, 255, 255, 0.5), 0px 0px 12px rgba(255, 255, 255, 0.35);
}

.shadow5 {
    text-shadow: 0 0 1px rgba(255, 255, 255, .2), 0 0 3px rgba(255, 255, 255, 1), 0 0 5px rgba(255, 255, 255, 1), 0 0 7px rgba(255, 255, 255, 0.5);
}

.shadowX {
    text-shadow: 0 0 1px rgba(255, 255, 255, 1), 0 0 3px rgba(255, 255, 255, 1), 0 0 5px rgba(255, 255, 255, 0.5), 0 0 7px rgba(255, 255, 255, 0.3);
}

.shadow6 {
    text-shadow: 0 0 1px rgba(0, 0, 0, 0.7), 0 0 3px rgba(255, 255, 255, 1), 0 0 5px rgba(255, 255, 255, 1), 0 0 7px rgba(255, 255, 255, 0.5);
}

.shadowLogoOld {
    text-shadow: 0 0 1px rgba(254, 83, 83, .2), 0 0 3px rgba(254, 83, 83, 1), 0 0 5px rgba(254, 83, 83, 1), 0 0 7px rgba(254, 83, 83, 0.7), 0 0 9px rgba(254, 83, 83, 0.5), 0px 0px 12px rgba(254, 83, 83, 0.35),0px 0px 20px rgba(254, 83, 83, 0.75),0px 0px 30px rgba(254, 83, 83, 0.5),0px 0px 160px rgba(254, 83, 83, 0.75);
}

.logoxOld img {
    box-shadow: 0 0 10px rgba(254, 83, 83, .2), 0 0 15px rgba(254, 83, 83, 1), 0 0 25px rgba(254, 83, 83, 1), 0 0 37px rgba(254, 83, 83, 0.7), 0 0 49px rgba(254, 83, 83, 0.5), 0px 0px 52px rgba(254, 83, 83, 0.35),0px 0px 60px rgba(254, 83, 83, 0.75),0px 0px 75px rgba(254, 83, 83, 0.5),0px 0px 90px rgba(254, 83, 83, 0.75);
    -webkit-box-shadow: 0 0 10px rgba(254, 83, 83, .2), 0 0 15px rgba(254, 83, 83, 1), 0 0 25px rgba(254, 83, 83, 1), 0 0 37px rgba(254, 83, 83, 0.7), 0 0 49px rgba(254, 83, 83, 0.5), 0px 0px 52px rgba(254, 83, 83, 0.35),0px 0px 60px rgba(254, 83, 83, 0.75),0px 0px 75px rgba(254, 83, 83, 0.5),0px 0px 90px rgba(254, 83, 83, 0.75);
    -moz-box-shadow: 0 0 10px rgba(254, 83, 83, .2), 0 0 15px rgba(254, 83, 83, 1), 0 0 25px rgba(254, 83, 83, 1), 0 0 37px rgba(254, 83, 83, 0.7), 0 0 49px rgba(254, 83, 83, 0.5), 0px 0px 52px rgba(254, 83, 83, 0.35),0px 0px 60px rgba(254, 83, 83, 0.75),0px 0px 75px rgba(254, 83, 83, 0.5),0px 0px 90px rgba(254, 83, 83, 0.75);
}


.certificates::before {
    .faws;
    content: "\f0a3\00a0";
}

.rules::before {
    .faws;
    content: "\f0e3\00a0";
}

.faq::before {
    .faws;
    content: "\f059\00a0";
}

.gal::before {
    .faws;
    content: "\f083\00a0";
}

.news::before {
    .faws;
    content: "\f02d\00a0";
}

.about::before {
    .faws;
    content: "\f129\00a0";
}

.contacts::before {
    .faws;
    content: "\f095\00a0";
}

.clear {
    clear: both;
    float: none;
    display: block;
}

.closeBox {
    top: 6px;
    left: 2px;
    width: 25px;
    height: 25px;
    position: absolute;
    line-height: 20px;
    color: @close-color;
    z-index: @zi1005;
    font-size: 22px;
    cursor: pointer;
}

.closeBox:hover {
    .shadow1;
}

h1 {
    color: #4d4d4d;
    font-size: 1.1em;
}

h2 {
    color: #494949;
    font-size: 1.1em;
}

h5 {
    color: #7e7e7e;
    font-size: 0.8em;
    line-height: 12px;
    padding-top: 0px;
    padding-bottom: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
}

.H10 {
    height: 10px;
}

.col4r .gh h1 {
    line-height: 18px;
    padding-top: 5px;
    padding-bottom: 0px;
    margin-top: 5px;
    margin-bottom: 5px;
}

.height10 {
    height: 10px;
    line-height: 10px;
}

.height30 {
    height: 30px;
    line-height: 30px;
}

.height40 {
    height: 40px;
    line-height: 40px;
}






.effect1 {
    -webkit-box-shadow: 0 10px 6px -6px #777;
    -moz-box-shadow: 0 10px 6px -6px #777;
    box-shadow: 0 10px 6px -6px #777;
}

.effect6 {
    position: relative;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

.effect6::before, .effect6::after {
    content: "";
    position: absolute;
    z-index: -1;
    -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow: 0 0 20px rgba(0,0,0,0.8);
    box-shadow: 0 0 20px rgba(0,0,0,0.8);
    top: 50%;
    bottom: 0;
    left: 10px;
    right: 10px;
    -moz-border-radius: 100px / 10px;
    border-radius: 100px / 10px;
}


.effect2 {
    box-shadow: none;
}


.effect3 {
    position: relative;
}

.effect3::before {
    z-index: -1;
    position: absolute;
    content: "";
    bottom: 15px;
    left: 10px;
    width: 50%;
    top: 80%;
    max-width: 300px;
    background: #777;
    -webkit-box-shadow: 0 15px 10px #777;
    -moz-box-shadow: 0 15px 10px #777;
    box-shadow: 0 15px 10px #777;
    -webkit-transform: rotate(-3deg);
    -moz-transform: rotate(-3deg);
    -o-transform: rotate(-3deg);
    -ms-transform: rotate(-3deg);
    transform: rotate(-3deg);
}

.effect4 {
    position: relative;
}

.effect4::after {
    z-index: -1;
    position: absolute;
    content: "";
    bottom: 15px;
    right: 10px;
    left: auto;
    width: 50%;
    top: 80%;
    max-width: 300px;
    background: #777;
    -webkit-box-shadow: 0 15px 10px #777;
    -moz-box-shadow: 0 15px 10px #777;
    box-shadow: 0 15px 10px #777;
    -webkit-transform: rotate(3deg);
    -moz-transform: rotate(3deg);
    -o-transform: rotate(3deg);
    -ms-transform: rotate(3deg);
    transform: rotate(3deg);
}

.effect5 {
    position: relative;
}

.effect5::before, .effect5::after {
    z-index: -1;
    position: absolute;
    content: "";
    bottom: 25px;
    left: 10px;
    width: 50%;
    top: 80%;
    max-width: 300px;
    background: #777;
    -webkit-box-shadow: 0 35px 20px #777;
    -moz-box-shadow: 0 35px 20px #777;
    box-shadow: 0 35px 20px #777;
    -webkit-transform: rotate(-8deg);
    -moz-transform: rotate(-8deg);
    -o-transform: rotate(-8deg);
    -ms-transform: rotate(-8deg);
    transform: rotate(-8deg);
}

.effect5::after {
    -webkit-transform: rotate(8deg);
    -moz-transform: rotate(8deg);
    -o-transform: rotate(8deg);
    -ms-transform: rotate(8deg);
    transform: rotate(8deg);
    right: 10px;
    left: auto;
}

.effect6 {
    position: relative;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

.effect6::before, .effect6::after {
    content: "";
    position: absolute;
    z-index: -1;
    -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow: 0 0 20px rgba(0,0,0,0.8);
    box-shadow: 0 0 20px rgba(0,0,0,0.8);
    top: 50%;
    bottom: 0;
    left: 10px;
    right: 10px;
    -moz-border-radius: 100px / 10px;
    border-radius: 100px / 10px;
}

.effect7 {
    position: relative;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

.effect7 .gTitle {
    background-color: transparent;
}

.effect7::before, .effect7::after {
    content: "";
    position: absolute;
    z-index: -1;
    -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow: 0 0 20px rgba(0,0,0,0.8);
    box-shadow: 0 0 20px rgba(0,0,0,0.8);
    top: 0;
    bottom: 0;
    left: 10px;
    right: 10px;
    -moz-border-radius: 100px / 10px;
    border-radius: 100px / 10px;
}

.effect7::after {
    right: 10px;
    left: auto;
    -webkit-transform: skew(8deg) rotate(3deg);
    -moz-transform: skew(8deg) rotate(3deg);
    -ms-transform: skew(8deg) rotate(3deg);
    -o-transform: skew(8deg) rotate(3deg);
    transform: skew(8deg) rotate(3deg);
}

.effect8 {
    position: relative;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

.effect8::before, .effect8::after {
    content: "";
    position: absolute;
    z-index: -1;
    -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow: 0 0 20px rgba(0,0,0,0.8);
    box-shadow: 0 0 20px rgba(0,0,0,0.8);
    top: 10px;
    bottom: 10px;
    left: 0;
    right: 0;
    -moz-border-radius: 100px / 10px;
    border-radius: 100px / 10px;
}

.effect8::after {
    right: 10px;
    left: auto;
    -webkit-transform: skew(8deg) rotate(3deg);
    -moz-transform: skew(8deg) rotate(3deg);
    -ms-transform: skew(8deg) rotate(3deg);
    -o-transform: skew(8deg) rotate(3deg);
    transform: skew(8deg) rotate(3deg);
}

* {
    font-family: IRANSans;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.height20 {
    height: 20px;
}

.fasolid {
    font-family: FAw;
    font-size: 1.8em;
}

p {
    margin-top: 0px;
    margin-bottom: 0px;
}

body {
    direction: rtl;
    background-color: @bodyBackColor;
    font-size: 0.8em;
}


.cke_editable, .cke_editable_themed {
    font-size: 1.27em;
}

.divBody {
    .basics;
    width: 100%;
}

.dBack {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-image: url(/Theme/bg06.jpg);
    background-size: cover;
    opacity: 0.3;
}

._uArea {
    .basics;
    .fullWidth;
    background-color: @ColorT2;
    min-height: 30px;
}

.uArea {
    .basics;
    .fullWidth;
    .paddings(10px);
    background-color: transparent;
    text-align: center;
    color: @notification-tcolor;
    min-height: 30px;
    max-width: @maxw;
    margin: 0 auto;
}

._uArea {
    height: 90px;
}

.uArea {
    text-align: right;
    padding: 2px @logoRight+@logoWidth+10 2px 10px;
    height: 74px;
}

#imgCaptcha {
    width: 120px;
    height: 40px
}

.headerNav {
    .basics;
    .fullWidth;
    .paddings(10px);
    background-color: @nav-color;
}

.footerNav {
    .basics;
    .fullWidth;
    .paddings(30px);
    padding-bottom: 65px;
    background-color: @ColorT4;
    color: @footercolorf;
    line-height: 30px;
    display: table;
    max-width: 1600px;
    margin: 0 auto;
}

.footerNav a {
    .basics;
    .nodecor;
    color: @footercolorf;
}

.footerNav a:hover {
    color: @menuActive;
}

.logoCen {
    width: 100px;
    height: 100px;
    position: absolute;
    perspective: 1000px;
    transform: scale(0.235);
    top: 2px;
    right: 23px;
    z-index: 99999999;
}

#cube {
    width: 100%;
    height: 100%;
    position: absolute;
    transform-style: preserve-3d;
    animation: rotatecube 4s infinite;
    outline: 1px solid transparent;
    transform-origin: 50% 160%;
}

#cube div {
    width: 200px;
    height: 200px;
    display: block;
    position: absolute;
    border: none;
    line-height: 200px;
    text-align: center;
    font-size: 50px;
    font-weight: bold;
    border: 4px solid khaki;
    opacity: 0.7
}

@keyframes rotatecube {
    0% {
        transform: rotateX(0deg) rotateY(90deg) rotateZ(45deg);
    }

    30% {
        transform: rotateX(0deg) rotateY(90deg) rotateZ(45deg);
    }

    70% {
        transform: rotateX(0deg) rotateY(450deg) rotateZ(45deg);
    }

    100% {
        transform: rotateX(0deg) rotateY(450deg) rotateZ(45deg);
    }
}



.front {
    background: rgba(46,44,103,1.0);
}

.back {
    background: rgba(30,27,85,1.0);
}

.right {
    background: rgba(0,0,45,1.0);
}

.left {
    background: rgba(44,46,129,1.0);
}

.top {
    background: rgba(70,70,144,1.0);
}

.bottom {
    background: rgba(30,27,85,1.0);
}

#cube .front {
    transform: rotateY(0deg ) rotateX(45deg ) translateZ( 100px );
}

#cube .back {
    transform: rotateX( 225deg ) translateZ( 100px );
}

#cube .right {
    transform: rotateY( 90deg ) rotateZ( 45deg ) translateZ( 100px );
}

#cube .left {
    transform: rotateY( -90deg ) rotateZ( 45deg ) translateZ( 100px );
}

#cube .top {
    transform: rotateX( 135deg ) translateZ( 100px );
}

#cube .bottom {
    transform: rotateX( -45deg ) rotateY( 0deg ) translateZ( 100px );
}

.containerx {
    transform: rotateY( -10deg ) rotateX( 0deg );
}

.uAreaU, .uAreaX {
    box-sizing: border-box;
    position: absolute;
    top: 10px;
    left: 0px;
    height: 74px;
    width: auto;
    margin-left: 5px;
    padding-top: 13px;
}


.uAreaX {
    display: none;
}

.loginNav, .cartM, .bookmarksM, .idealHelp, .idealGallery {
    .basics;
    .paddings(10px);
    display: inline-block;
    color: white;
    font-size: 1.0em;
    position: relative;
    height: 48px;
    z-index: @zi1004;
    line-height: 48px;
    padding-top: 0px;
    cursor: pointer;
}

.loginNav span::before, .cartM::before, .bookmarksM span::before, .idealHelp span::before, .idealGallery span::before {
    font-size: 1.3em;
    line-height: 30px;
}

.loginNav span::before, .articlesD a::before {
    .fawr;
    font-size: 2em;
    content: "\f007\00a0";
    color: darkblue;
}

.articlesD a::before {
    .faws;
    content: " ";
    background-image: url(books6.svg);
    background-size: cover;
    position: absolute;
    right: 2px;
    top: 2px;
    height: 42px;
    width: 42px;
}

.cartM::before {
    content: "\f07a";
    position: absolute;
    right: 15px;
    top: 0px;
    .faws;
    font-size: 2em;
    color: #fc8621;
    background-size: contain;
    height: 48px;
    width: 48px;
}


.bookmarksM span::before {
    .fawr;
    font-size: 2em;
    content: "\f004";
    color: red;
}

.idealHelp span::before {
    color: lawngreen;
    .faws;
    font-size: 2em;
    content: "\f128";
}

.idealGallery span::before {
    color: lightblue;
    .faws;
    font-size: 2em;
    content: "\f083";
}

.bookmarksM span::after, .cartM::after {
    position: absolute;
    vertical-align: central;
    display: table-cell;
    text-align: center;
    font-size: 0.50em;
    content: attr(data-content);
    color: #bbb;
    line-height: 30px;
}

.bookmarksM span::after {
    top: 2px;
    right: 7px;
    width: 30px;
    height: 30px;
    color: @links1-color;
}

.cartM {
    padding-left: 45px;
    padding-right: 45px;
    .borderRadius(6px);
    border: 1px solid gray;
    min-width: 100px;
}

.cartM::after {
    .borderRadius(18px);
    top: 0px;
    left: 3px;
    width: 36px;
    height: 36px;
    line-height: 36px;
    font-size: 0.70em;
    color: black;
}

.cartM::after {
    .borderRadius(25px);
    background-color: @cart-lcolor;
}

.loginNav span, .cartM span, .bookmarksM span, .idealGallery span, .idealHelp span {
    display: block;
    position: relative;
    .transAllEase(100ms);
    animation-duration: 2.3s;
    width: 100%;
    height: 100%;
}

.loginNav:hover span, .bookmarksM:hover span, .idealGallery:hover span, .idealHelp:hover span {
    .rubberBand;
}

.cartM:hover span {
    .fadeInDown;
}

.mainNav {
    .basics;
    .paddings(10px);
    padding-top: 5px;
}


.condiDispNone {
    display: none;
}

.condiDispNoneM {
    display: block;
}

.mainNavNavs {
    display: inline-block;
    position: relative;
}

.mainNavNavs a {
    .nodecor;
    .paddings(10px);
    .transAllEase(200ms);
    font-size: 0.9em;
    white-space: nowrap;
    color: white;
    width: calc(50% - 20px);
    display: inline-block;
}

.mainNav a:hover {
    .shadow6;
    color: black;
    font-weight: bolder;
    cursor: pointer;
}

.logo {
    .transAllEase(200ms);
    position: absolute;
    right: @logoRight;
    top: 0px;
    width: @logoWidth;
    height: @logoHeight;
    z-index: @zi1007x;
    margin: auto 0;
    vertical-align: middle;
    display: table-cell;
    white-space: nowrap;
    text-align: center;
    margin: 0 0;
    overflow: hidden;
}


.logo p {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.logo a {
    display: inline-block;
    vertical-align: middle;
    max-height: @logoHeight;
    max-width: @logoWidth;
    width: @logoWidth;
    height: auto;
}

.logo a img {
    vertical-align: middle;
    max-height: @logoHeight;
    max-width: @logoWidth;
    width: @logoWidth;
    height: auto;
}

.goodsNavC {
    .basics;
    .fullWidth;
    background-color: @ColorT4;
    border-bottom: 2px solid rgba(105, 125, 255, 0.8);
    height: 47px;
    right: 0px;
    width: 100%;
}

.stickyH .goodsNavC {
    right: 0px;
    width: 100%;
}

.mainContent {
}

.mainContentI {
    max-width: @maxw;
    margin: 0 auto;
}

.stickyH {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: @zi1009;
    .fadeInDown;
}

.stickyHx, #stickyHx {
    position: relative;
    width: 100%;
    z-index: @zi1009;
    max-width: 1600px;
    margin: 0 auto;
}

#stickyHx.stickyH {
    max-width: unset;
    margin: unset;
    opacity: 1;
    background-color: #f5f5f5;
    position: fixed;
}

.stickyH {
    max-width: unset;
    margin: unset;
    opacity: 1;
    background-color: #f5f5f5;
}
/* Add some top padding to the page content to prevent sudden quick movement (as the navigation bar gets a new position at the top of the page (position:fixed and top:0) */
.stickyH + .mainContent {
    padding-top: 47px;
}

.goodsNav {
    box-sizing: border-box;
    .basics;
    .fullWidth;
    width: 100%;
    background-color: @menu-bcolor;
    position: relative;
    max-width: @maxw;
    margin: 0 auto;
    padding-right: 120px;
}

.goodsNav a, .goodsNav p {
    .nodecor;
    padding: 12px 10px 0px 10px;
    .transAllEase(200ms);
    font-size: 1.0em;
    font-weight: bold;
    white-space: nowrap;
    line-height: 33px;
    color: white;
}

.goodsNavDeactive, .goodsNavDeactive a {
    padding-right: 0px;
}

.goodsNavDeactive::before {
    .faws;
    vertical-align: middle;
    font-size: 1em;
    content: "\f053\00a0";
    color: @menuHighlight;
}

.ind2 {
    text-indent: 20px;
}

.goodsNavActive::before {
    .faws;
    font-size: 1.4em;
    vertical-align: middle;
    content: "\f106\00a0";
}

.goodsNav a:hover::before, .goodsNav p:hover::before {
    font-size: 1.3em;
    font-weight: 400;
}

.goodsNav a:hover, .goodsNav p:hover {
    text-shadow: 0px 0px 4px #fff;
    cursor: pointer;
    color: @menuActive;
    font-weight: 700;
    opacity: 1;
}

.menuL0 {
    width: calc(100% - 230px);
}

.menuRespC {
    position: fixed;
    top: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: @zi1009;
}

.menuResp {
    .transAllEase(300ms);
    position: fixed;
    top: 0px;
    right: 0px;
    width: 80%;
    background-color: @menu-bcolor;
    height: 100vh;
    overflow-x: hidden;
    overflow-y: scroll;
    z-index: @zi1009;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#616161+0,a1a1a1+100 */
    background: rgb(97,97,97); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(68,74,111,1) 0%, rgba(161,161,161,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(68,74,111,1) 0%,rgba(161,161,161,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(68,74,111,1) 0%,rgba(161,161,161,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='@menu-bcolor', endColorstr='#a1a1a1',GradientType=0 ); /* IE6-9 */
}

.condiDispNoneM {
    right: -100%;
}

.menuResp > h1 {
    position: absolute;
    display: block;
    top: 0px;
    right: 10px;
    width: calc(100% - 150px);
    height: 40px;
    line-height: 40px;
    font-size: 0.90em;
    color: white;
    box-sizing: border-box;
    .shadow3;
}

.logoM {
    transform: scale(0.8);
    margin-top: -10px;
    right: unset;
    left: 0px;
}

.mls {
    .transAllEase(400ms);
    position: absolute;
    display: block;
    left: -200%;
    top: 50px;
    width: calc(100% - 20px);
    min-height: calc(100vh - 50px);
    background-color: @menu-bcolor;
    background-color: white;
    box-sizing: border-box;
}

.mls a {
    .nodecor;
    color: white;
    cursor: pointer;
    display: block;
    height: 30px;
    line-height: 30px;
}

.mls a:hover, .mls a:active {
    .shadow3;
}

.mlsBack, .mlsAll {
    text-indent: 30px;
}

.mlsBack::before, .mlsAll:before {
    .faws;
    content: '\f55a';
    position: absolute;
    right: 25px;
    width: 25px;
    height: 30px;
    line-height: 30px;
    transform: rotate(180deg);
}

.mlsAll:before {
    content: '\f141';
}

.articlesD {
    box-sizing: border-box;
    background-color: rgba(49,53,81,0.1);
    width: 100px;
    position: absolute;
    top: 0px;
    left: 5px;
    height: 47px;
    border-bottom: 2px solid rgba(105, 125, 255, 0.8);
}

.articlesD a {
    width: 85px;
    text-align: center;
    padding-left: unset;
    padding-right: 20px;
    position: relative;
    display: inline-block;
    line-height: 40px;
}

.articlesD a::before {
}

.searchBox {
    .basics;
    .paddings(10px);
    .borderRadius;
    .transAllEase(300ms);
    position: absolute;
    height: 40px;
    width: 450px;
    right: calc((((100% - 645px) / 2 ) - 225px ) + 115px);
    right: calc(((50% - 322px) - 225px ) + 115px);
    right: calc(50% - 432px);
    top: 25px;
    background-color: @search-bcolor1;
    display: inline-block;
    border: 1px solid #d5dadd;
}

.searchBox:hover {
    background-color: @search-bcolor2;
}

.autocomplete-suggestions {
    .effect8;
    .borderRadiusTlTrBlBr(0px,0px,5px,5px);
    border: 1px solid #bbb;
    background-color: @search-bcolor2;
    text-align: right;
    direction: rtl;
    cursor: pointer;
    margin-left: 4px;
    z-index: @zi1009;
    width: calc(450px - 39px);
}

.autocomplete-suggestion {
    background-color: @search-bcolor2;
    text-align: right;
    direction: rtl;
    cursor: pointer;
    padding: 10px 5px 10px 5px;
    margin-left: 0px;
    color: @autocomplete-suggestionColor;
    font-size: 0.8em;
    line-height: 17px;
    z-index: @zi1009;
    border-bottom: 1px solid #ddd;
    min-height: 50px;
}

.autocomplete-suggestion a {
    .nodecor;
    color: @links1-color;
    font-size: 1.2em;
}

.autocomplete-suggestion a span {
    .faws;
}

.autocomplete-suggestion img {
    width: 48px;
    height: 48px;
    display: inline-block;
    float: right;
    margin-left: 5px;
}

.autocomplete-suggestion:hover {
    background-color: @search-bcolorHighligh;
}

.searchBoxT {
    left: 31px;
    top: 0px;
    width: calc(100% - 31px);
    position: absolute;
    text-align: center;
    height: 40px;
    line-height: 40px;
}

.showSearchBox .searchBoxT {
    height: 30px;
    line-height: 30px;
}

.searchBoxT input[type=search] {
    border: none;
    line-height: 30px;
    box-sizing: border-box;
    background-color: transparent;
    padding-right: 5px;
    padding-left: 5px;
    -webkit-box-shadow: 0 0 0 0 #f00;
    box-shadow: 0 0 0 0 #f00;
    outline: none;
}

.searchBoxT input[type=search]:focus {
    outline: none;
}

.searchBoxBtn {
    .faws;
    font-size: 1.7em;
    left: 0px;
    top: 0px;
    width: 40px;
    height: 40px;
    position: absolute;
    text-align: center;
    line-height: 40px;
    cursor: pointer;
    border-right: 1px solid @nav-color;
    background-color: @cart-lcolor;
    .borderRadiusTlTrBlBr(5px,0px,5px,0px);
    color: black;
    margin-top: -1px;
}

.searchBoxBtn:hover {
    color: @searchBoxBtn_hover;
    .shadow1;
    .transAllEase(500ms);
}

.showSearchBox .searchBoxBtn {
    width: 30px;
    height: 30px;
    line-height: 30px;
    margin-top: 0px;
}

.options {
    margin-top: 10px;
    .basics;
    .transAllEase(500ms);
    width: calc(100% - 10px);
    background-color: @options_bcolor;
    color: @options_bcolor;
    text-align: center;
    line-height: 50px;
    height: 50px;
    vertical-align: central;
    margin-right: 5px;
}

.optionsCen {
    margin: 0 auto;
    display: inline-block;
}

.optionsCen p {
    .faws;
}

.options a {
    .nodecor;
    position: relative;
    display: inline-block;
    color: @options_tcolor;
    line-height: 50px;
    float: right;
    padding-left: 20px;
}

.options a:hover {
    .hover2;
    .shadow1;
    cursor: pointer;
}

.options .sp {
    display: none;
}

.options p {
    position: relative;
    display: inline-block;
    font-size: 28px;
    line-height: 50px;
    height: 50px;
    color: @options_tcolor;
    float: right;
    padding-left: 5px;
    width: 50px;
}

.rC {
    .basicsNoTrans;
    width: 34%;
    margin-left: 0px;
    float: right;
    padding: 0px 5px 0px 10px;
    z-index: 10;
    max-width: 529px;
}

.lC {
    .basicsNoTrans;
    max-width: 1056px;
    width: 66%;
    margin-left: 0px;
    float: left;
    text-align: center;
    z-index: 11;
}

.og {
    .basics;
    display: inline-block;
    width: 100%;
    height: auto;
    margin: 10px;
}

.fullInfo {
    position: absolute;
    .transAllEase(100ms);
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 40px;
    background-size: contain;
    background-repeat: no-repeat;
    cursor: pointer;
}

.info1 {
    position: absolute;
    .transAllEase(100ms);
    left: 0px;
    right: 0px;
    bottom: 40px;
    height: 40px;
    background-color: @hl1N-bcolor;
    cursor: pointer;
}

.llButton {
    display: block;
    clear: both;
    width: 100%;
    margin-top: 10px;
    height: 40px;
    background-color: @hl1N-bcolor;
    cursor: pointer;
}

.info1 a, .llButton a {
    .nodecor;
    line-height: 40px;
    color: @hl1N-tcolor;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.og:hover .info1, .divCl1:hover .llButton, .divCl2:hover .llButton, .divCl3:hover .llButton, .divCl4:hover .llButton, .divCl5:hover .llButton {
    background-color: @hl1H-bcolor;
}

.og:hover .info1 a, .divCl1:hover .llButton a, .divCl2:hover .llButton a, .divCl3:hover .llButton a, .divCl4:hover .llButton a, .divCl5:hover .llButton a {
    .nodecor;
    color: @hl1H-tcolor;
}

.n {
    .basics;
    .fullWidth;
    height: 74px;
    padding-bottom: 10px;
    margin-top: 10px;
    float: none;
    clear: both;
    cursor: pointer;
}

.n:hover .nT a img {
    .boxShadow2;
    transform: scale(1.05);
}


.gTemp {
    margin-left: 0px;
}

.nT a img {
    margin-top: -5px;
    .basics;
    width: 64px;
    height: 64px;
    float: right;
    display: inline-block;
    .boxShadow1;
    margin-top: 5px;
    transform: scale(1.0);
    margin-left: 5px;
}

.nT {
    .basics;
    width: 100%;
    padding-right: 5px;
    padding-left: 5px;
    height: 64px;
    line-height: 25px;
    display: inline-block;
    text-overflow: ellipsis;
}

.nT a {
    .nodecor;
    font-size: 1.0em;
    color: @halfFade-color;
}

.nT a:hover {
}

.nD {
    .basics;
    position: static;
    top: 55px;
    left: 0px;
    text-align: left;
    font-size: 0.75em;
    color: @fade-color;
}

.n:hover .nT {
    .bounceIn;
}

.gbar {
    .basics;
    .fullWidth;
    .boxShadowLight;
    .borderRadius(4px);
    position: relative;
    margin-top: 17px;
    margin-left: 20px;
    margin-right: 20px;
    width: calc(100% - 40px);
    min-height: 30px;
    background-color: @backcolor2;
    padding-right: 10px;
    padding-left: 10px;
    display: inline-block;
    line-height: 30px;
}

.chapters {
    .boxShadowLight;
    .borderRadius(4px);
    background: -moz-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 40%, rgba(255,255,255,0) 80%, rgba(255,255,255,0) 100%);
    background: -webkit-linear-gradient(left, rgba(255,255,255,1) 0%,rgba(255,255,255,0.8) 40%,rgba(255,255,255,0) 80%,rgba(255,255,255,0) 100%);
    background: linear-gradient(to left, rgba(255,255,255,1) 0%,rgba(255,255,255,0.8) 40%,rgba(255,255,255,0) 80%,rgba(255,255,255,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00ffffff',GradientType=1 );
    position: relative;
    display: block;
    margin-top: 17px;
    margin-right: 20px;
    padding: 10px;
}

.gbar hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ddd;
    margin: 1em 0;
    padding: 0;
}

.gbar a {
    .nodecor;
    color: @links3-color;
    display: inline-block;
    line-height: 30px;
    font-size: 0.9em;
}

.gbar a:hover {
    color: @links5-color;
}

.crumB li {
    font-size: 1.2em;
    display: inline-block;
}

.crumB li::after {
    .basics;
    .faws;
    content: "\f104";
    font-size: 1.0em;
    color: @links4-color;
    display: inline-block;
    line-height: 30px;
    padding-left: 5px;
    padding-right: 5px;
}

.crumB li:last-child::after {
    content: none;
    display: none;
}

.col4 {
    .basics;
    width: 64%;
    display: table-cell;
    float: left;
}

.col4l {
    .basics;
    width: 34%;
    display: table-cell;
    float: left;
    padding: 10px;
    padding-top: 40px;
    line-height: 30px;
}

.col4l ul, .gbar ul {
    list-style-type: square;
    padding-right: 30px;
    color: @links4-color;
}

.col4r {
    .basics;
    width: 64%;
    display: table-cell;
    float: left;
    padding: 10px;
}

.col4r span {
    font-size: 1.0em;
    color: @links4-color;
}

.col4r a {
    font-size: 1.0em;
    color: @links3-color;
}

.col4r a:hover {
    color: @links5-color;
}

.col2 {
    .basics;
    width: 34%;
    height: 100%;
    display: table-cell;
    float: right;
    padding: 10px;
    margin: auto;
    margin-bottom: 10px;
}

.col3 {
    .basics;
    box-sizing: border-box;
    width: 33.333333%;
    height: 100%;
    display: table-cell;
    float: right;
    padding: 10px;
    margin: auto;
}

.gImage {
    .basics;
    .fullWidth;
    display: table-cell;
    background-color: #fff;
    margin: auto 0;
    overflow: hidden;
    padding-top: 50px;
    padding-bottom: 10px;
}

.gImage .imgx {
    margin-top: 2px;
    margin-right: 2px;
    width: 100%;
    height: auto;
    z-index: 80;
}

.tmbC {
    .basics;
    .fullWidth;
    position: relative;
    clear: both;
    height: 80px;
    overflow: hidden;
}

.pArrow, .nArrow {
    .faws;
    .basics;
    position: absolute;
    left: 0px;
    top: 0px;
    width: 30px;
    height: 80px;
    font-size: 20px;
    color: @halfFade-color;
    background-color: #fff;
    text-align: center;
    line-height: 80px;
    cursor: pointer;
    z-index: 10;
}

.pArrow:hover, .nArrow:hover {
    color: @links3-color;
}

.nArrow {
    left: calc(100% - 30px);
}

.tmbs {
    .basics;
    left: 30px;
    top: 0px;
    height: 80px;
    width: 80px;
    width: attr(data-width);
    position: absolute;
    direction: ltr;
    text-align: left;
    margin-left: 0px;
    z-index: 9;
}

.tmb {
    .basics;
    .boxShadow3;
    position: relative;
    display: inline-block;
    width: 80px;
    height: 60px;
    margin: 5px;
    cursor: pointer;
}

.tmbs:first-child {
    margin-left: 0px;
}

.tmb img {
    width: 80px;
    height: 60px;
}

.starsE, .starsF, .starsS {
    .fawr;
    font-size: 1.0em;
}

.starsE div, .starsF div, .starsS div {
    font-family: IRANSans !important;
}

.starsE, .starsF {
    top: 10px;
    left: 10px;
    width: 75px;
    height: 30px;
    position: absolute;
    z-index: 10;
    color: @star-colorE;
    text-align: left;
}

.starsE div {
    display: inline-block;
    padding: 0px;
    font-size: 0.9em;
    cursor: pointer;
}

.starsE div:hover {
    color: @links3-color;
}

.starsF {
    .faws;
    font-size: 1.0em;
    z-index: 11;
    .gGoldForeColor;
}

.starsS {
    font-family: IRANSans;
    font-size: 1.0em;
    top: 25px;
    left: 10px;
    width: 60px;
    height: 30px;
    position: absolute;
    z-index: 12;
    color: @links4-color;
    text-align: right;
}

.gh {
    .basics;
    .fullWidth;
    .effect7;
    padding-right: 30px;
}

.gSep {
    .basics;
    .fullWidth;
    height: 20px;
}

.propsG {
    vertical-align: top;
}

.props, .propsG {
    .basics;
    .fullWidth;
}

.props span, .propsG span {
    display: inline-block;
    height: 30px;
    line-height: 30px;
    width: 130px;
    position: relative;
}

.propsG span::before {
    .gradientLine2;
    content: " ";
    display: inline-block;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 0.5px;
    margin-top: 23px;
}

.props select, .propsG select {
    line-height: 20px;
    height: 30px;
    float: unset;
    width: 200px;
    color: @links4-color;
}

.props input[type=radio], .propsG input[type=radio] {
    .basics;
    line-height: 20px;
    float: unset;
    color: @links4-color;
}

.props label, .propsG label {
    .basics;
    line-height: 20px;
    float: unset;
    font-size: 1.0em;
    color: @links4-color;
}

.gu, .gs, .gt {
    .faws;
    font-size: 20px;
    color: green;
    display: inline-block;
    line-height: 30px;
    height: 30px;
}

.gu {
    margin-top: 15px;
    line-height: 20px;
    height: 20px;
}

.gs {
    color: @halfFade-color;
    font-size: 1.0em;
}

.gt {
    color: @links3-color;
    font-size: 1.2em;
}

.hrZero {
    height: 1px;
    display: block;
}


.he1 {
    .fullWidth;
    .gradientLine3;
    height: 1px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.priceST {
    display: inline-block;
    font-size: 1.2em;
    color: @halfFade-color;
}

.priceSR {
    display: inline-block;
    font-size: 1.2em;
    color: @halfFade-color;
}

.priceLT {
    display: inline-block;
    font-size: 1.4em;
    color: @halfFade-color;
}

.priceLR {
    display: inline-block;
    font-size: 1.4em;
    color: @price-color;
}


.spr {
    background-color: @sp-color1;
    color: @sp-colorf;
    display: table-cell;
}

.spr span {
    .height30;
    color: @sp-colorf;
    padding-left: 10px;
    padding-right: 10px;
}

.spr::before {
    .faws;
    content: "\f0d9";
    color: #fff;
}

.spl {
    background-color: @sp-color2;
    color: @sp-colorf;
    display: table-cell;
    .borderRadiusTlTrBlBr(2px,0px,2px,0px);
}

.spl::before {
    content: "";
    color: #fff;
}

.spl span {
    .height30;
    color: @sp-colorf;
    padding-left: 10px;
    padding-right: 10px;
}


.cartc {
    .basics;
    cursor: pointer;
}

.cartc:hover .cartr {
    background-color: @cart-rcolorH;
}

.cartc:hover .cartl {
    background-color: @cart-lcolorH;
}

.cartr {
    .basics;
    .height40;
    background-color: @cart-rcolor;
    color: @cart-colorf;
    display: inline-block;
    .borderRadiusTlTrBlBr(0px,2px,0px,2px);
    font-size: 20px;
    width: 40px;
    text-align: center;
    float: right;
}

.cartl {
    .basics;
    .height40;
    background-color: @cart-lcolor;
    color: @cart-colorf;
    display: inline-block;
    .borderRadiusTlTrBlBr(2px,0px,2px,0px);
    padding-right: 10px;
    padding-left: 10px;
    text-align: center;
    float: right;
}

.cartCurrent {
    display: block;
    float: none;
    clear: both;
}

.gdetail {
    .basics;
    .fullWidth;
    .boxShadow4;
    position: relative;
    margin-top: 17px;
    margin-left: 20px;
    margin-right: 20px;
    width: calc(100% - 40px);
    min-height: 30px;
    display: table;
    .height40;
    background-color: @backcolor2Title;
}

.act {
}

.gusersreview {
    display: inline-block;
    padding: 0px 10px 0px 10px;
    cursor: pointer;
    font-size: 1.3em;
}

.gusersreview:hover, .gusersreview:hover::before {
    color: @links3-color;
}

.act {
    background-color: @backcolor2;
    border-top: 1px solid @links3-color;
    color: @links3-color;
}

.gusersreview::before {
    .fawr;
    content: "\f086";
    color: darkgray;
    font-size: 20px;
    margin-left: 10px;
    color: @myCyan;
}




.w300 {
    .basics;
    .fullWidth;
    position: relative;
    width: 100%;
    direction: rtl;
    text-align: right;
}

.w100 {
    .basics;
    margin: 0px;
    width: 100%;
    display: block;
    padding: 10px;
    position: relative;
}

.w100 table {
    border-spacing: 2px;
    border-collapse: separate;
}

.w100 table td:last-child {
    width: 100%;
}

.w100 table th, .w100 table td {
    background-color: @thColor;
    color: #222;
    font-size: 0.9em;
    padding: 10px;
    margin: 3px;
    white-space: nowrap;
}

.w100 table td {
    background-color: @tdColor;
    color: @menu-bcolor;
    font-size: 0.9em;
}

.xSpacer {
    margin: 0 auto;
    height: 340px;
    text-align: center;
    padding-top: 70px;
    box-sizing: border-box;
}

.xClose {
    .transAllEase(150ms);
    position: absolute;
    top: 5px;
    left: 5px;
    width: 32px;
    height: 32px;
    cursor: pointer;
}

.xClose::after {
    .faws;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    line-height: 32px;
    font-size: 1.3em;
    content: '\f410';
}

#postBoxCT .xClose::after {
    .faws;
    content: '\f102';
}

.xClose:hover {
    color: red;
}

#userBox {
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: @ziMax;
    overflow: hidden;
}

#userBoxC {
    .boxShadow5;
    .transAllEase(300ms);
    .borderRadiusTlTrBlBr(2px,2px,5px,5px);
    .effect7;
    box-sizing: border-box;
    position: absolute;
    top: 50px;
    left: -1000px;
    width: 150px;
    height: 250px;
    background-color: @notification-bcolor;
    z-index: @ziMax;
    line-height: 30px;
    padding: 10px 2px 10px 2px;
}

#userBoxC a {
    padding: 0px 10px 0px 10px;
    display: block;
    text-decoration: none;
    color: @links1-color;
}

#userBoxC a span, .mainNavNavsvv a span {
    .faws;
}

#userBoxC a:hover {
    .effect6;
    .hover1;
    .shadow3;
}

#loginBox, #registerBox, #activeBox, #favBox, #cartBox, #saveBox, .profileBox, .bAlbum, #headerNotification {
    display: none;
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-color: rgba(51, 51, 51,.9);
    z-index: @zi1007x+1;
}

#headerNotification {
    display: block;
    line-height: 27px;
}

#saveBox, .profileBox {
    display: block;
    position: relative;
    bottom: unset;
    height: auto;
    z-index: initial;
    background-color: transparent;
}

#postBox {
    .fullWidth;
    .transAllEase(400);
    position: relative;
    display: block;
    max-height: 0px;
    overflow: hidden;
}

#postBox .tbTitle {
    width: 100%;
}

#postBox .tbDescription {
    width: 100%;
    max-width: 100%;
    height: 200px;
}

#loginBoxC, #registerBoxC, #activeBoxC, #favBoxC, #cartBoxC, #saveBoxC, .profileBoxC, .headerNotificationC {
    position: relative;
    margin: auto;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background-color: @nav-color;
    width: 400px;
    height: 370px;
}

#registerBoxC, .profileBoxC {
    height: 590px;
}

#favBoxC, #cartBoxC, #saveBoxC {
    height: calc(100% - 100px);
    width: calc(100% - 100px);
}

#saveBoxC, .profileBoxC {
    top: 0px;
    margin-top: 40px;
    height: auto;
    -webkit-transform: initial;
    -ms-transform: initial;
    transform: initial;
    background-color: transparent;
}

.scrollB {
}

.scrollB::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.3);
    border-radius: 6px;
    background-color: #F5F5F5;
}

.scrollB::-webkit-scrollbar {
    width: 8px;
}

.scrollB::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #555;
}

.favBoxCn, .cartBoxCn, .saveBoxCn, .profileBoxCn {
    position: absolute;
    top: 50px;
    left: 10px;
    height: calc(100% - 70px);
    width: calc(100% - 20px);
    margin: 10px auto;
    overflow: auto;
}

.saveBoxCn, .profileBoxCn {
    height: auto;
    width: 100%;
    top: initial;
    left: unset;
    box-sizing: border-box;
    padding: 20px;
    margin: initial;
    position: relative;
    min-height: calc(100vh - 407px);
}

.favBoxCn h1, .cartBoxCn h1, .saveBoxCn h1 {
    width: 100%;
    height: 50px;
    line-height: 50px;
    margin-top: 50px;
    color: red;
    text-align: center;
    position: relative;
}

.loading {
    animation: rotateFull 1.2s linear infinite;
    position: relative;
    width: 200px;
    height: 200px;
    font-size: 100vh;
    margin: 0 auto;
}

.loading::after {
    .faws;
    content: '\f110';
    font-size: 10vw;
    position: absolute;
    top: 20%;
    left: 0%;
    width: 100%;
    height: 60%;
    text-align: center;
}

.loginErr, .registerErr, .profileErr {
    text-align: right;
    color: @errorColor;
    position: relative;
    width: 300px;
    display: inline-block;
    margin-left: 50px;
    margin-right: 50px;
    line-height: 25px;
}

.imgl {
    float: left;
    height: auto;
    margin: 10px;
    text-align: justify;
    max-width: calc(100% - 40px);
}

.imgr {
    float: right;
    height: auto;
    margin: 10px;
    text-align: justify;
    max-width: calc(100% - 40px);
    margin-right: 25px;
}

.imgc, .gshow2 img {
    float: none;
    height: auto;
    margin: 10px auto;
    text-align: center;
    max-width: calc(100% - 0px);
}

.imgc, .imgr, .imgl {
    position: relative;
    display: block;
}

.loginErr::before, .registerErr::before, .profileErr::before {
    .faws;
    content: '\f06a';
    color: @errorColor;
    font-size: 2em;
    position: absolute;
    top: 0px;
    left: calc(100% + 22px);
    width: 20px;
    height: 100%;
    line-height: 100%;
}

#loginBoxCT, #registerBoxCT, #activeBoxCT, #favBoxCT, #cartBoxCT, #saveBoxCT, #postBoxCT, .profileBoxCT, .headerNotificationCT {
    .basics;
    .borderRadius(30px);
    height: 40px;
    position: absolute;
    width: calc(100% - 40px);
    padding: 10px;
    margin: 10px 10px;
    background-color: @notification-bcolor;
    color: @notification-tcolor;
    text-align: center;
    font-size: 1.5em;
}

#postBoxCT {
    background-color: #0095ff;
    color: #fff;
    width: calc(100% - 20px);
    line-height: 40px;
    padding: 0px;
}

#saveBoxCT, .profileBoxCT {
    position: relative;
    width: calc(100% - 30px);
}

.loginBoxC input[type=text], .loginBoxC input[type=password], .loginBoxC input[type=button], .loginBoxC input[type=submit], .loginBoxC input[type=reset], .postBox input[type=text], .postBox input[type=password], .postBox input[type=button], .postBox input[type=submit], .postBox input[type=reset] {
    margin: 0 auto;
    display: block;
    height: 40px;
    position: relative;
    float: none;
}

#registerBoxC input[type=text], #registerBoxC input[type=password], #registerBoxC input[type=button], #registerBoxC input[type=submit], #registerBoxC input[type=reset] {
    display: inline-block;
}

.loginBoxC a {
    .nodecor;
    font-size: 1.0em;
    color: @links1-color;
}

.loginBoxC a:hover {
    color: @links3-color;
}

.captcha {
    .basics;
    display: block;
    position: relative;
    height: 40px;
    margin: 10px auto;
    width: 300px;
}

.refresh {
    .faws;
    .basics;
    .transAllEase(200ms);
    position: relative;
    display: inline-block;
    width: 40px;
    height: 40px;
    border: 1px solid #666;
    color: #264bb1;
    cursor: pointer;
    font-size: 30px;
    float: right;
    clear: none;
    vertical-align: top;
    line-height: 38px;
    padding-top: 4px;
}

.refresh:hover {
    color: #0099ff;
}

.captcha img {
    display: inline-block;
    position: relative;
    float: right;
    clear: none;
    vertical-align: top;
}

.captcha input[type=text] {
    display: inline-block;
    position: relative;
    float: right;
    clear: none;
    margin: 0;
    vertical-align: top;
}

.notAvailable {
    .basics;
    .fullWidth;
    .boxInOut;
    .borderRadiusTlTrBlBr(4px,4px,4px,4px);
    color: @notavailablecolor;
    height: auto;
    text-align: center;
    display: block;
    vertical-align: central;
    margin-bottom: 50px;
    line-height: 25px;
    padding: 20px 10px 10px 10px;
    background-color: white;
    font-size: 1.2em;
}

.extraclear {
    float: none;
    clear: both;
}

.extraclearPR {
    position: relative;
    float: none;
    clear: both;
}

.cThread {
    .effect6;
    position: relative;
    background-color: white;
    margin-bottom: 15px;
    padding: 10px;
    margin: 10px 10px 0px 10px;
}

.cBuyer, .cNBuyer {
    position: relative;
    width: 110px;
    height: 60px;
    float: right;
    font-size: 0.9em;
    vertical-align: bottom;
    line-height: 90px;
    text-align: center;
    color: green;
}

.cNBuyer {
    color: #aaa;
}

.cBuyer::before, .cNBuyer::before {
    .faws;
    .shadow2;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    line-height: 40px;
    content: '\f0a3';
    font-size: 3em;
    color: green;
}

.cNBuyer::before {
    .fawr;
    content: '\f4ad';
    color: #555;
    font-size: 3em;
}

.cTitle {
    position: relative;
    display: block;
    font-size: 1.5em;
    color: #777;
}

.cDescription {
    position: relative;
    font-size: 1.2em;
    color: #333;
    padding: 10px;
}

.cWInfo, .cWInfoR {
    position: relative;
    display: block;
    font-size: 1.2em;
    color: #999;
    border-bottom: 1px solid #ddd;
}

.cWInfoR {
    font-size: 0.8em;
}

.cThread .cpPs, .cThread .cpDs {
    line-height: 20px;
}

.cThread .cpPs span::before, .cThread .cpCs span::before {
    .fawr;
    content: '\0020\f058\0020';
    height: 100%;
    line-height: 20px;
    color: green;
}

.cThread .cpCs span::before {
    .fawr;
    content: '\0020\f057\0020';
    color: red;
}

.gOffer {
    .basics;
    width: calc(100% - 5x);
    height: 385px;
    overflow: hidden;
    margin-left: 5px;
    background-color: white;
}

.loffers {
    .basics;
    .transAllEase(200ms);
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    width: 30%;
    overflow-y: auto;
    min-height: 385px;
    background-color: white;
}

.loffersC {
    .basics;
    .transAllEase(200ms);
    width: calc(100% - 40px);
    border-right: 1px solid @offerborderright;
    background-color: @offerbh;
    min-height: 385px;
    float: left;
}

.roffers {
    .basics;
    position: absolute;
    left: 30%;
    top: 0px;
    bottom: 0px;
    width: calc(70% - 0px);
    background-color: @offercontentb;
}

.offer {
    .basics;
    .fullWidth;
    height: 38px;
    line-height: 38px;
    color: @offerf;
    cursor: pointer;
    padding: 0px 5px 0px 5px;
}

.offer:hover {
    background-color: @offerb;
}

.oactive {
    background-color: @oactiveb;
    color: @oactivef;
}

.oactive:hover {
    background-color: @oactiveb;
    color: @oactivef;
}

.oactive::after {
    .transAllEase(200ms);
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-top: 19px solid transparent;
    border-bottom: 19px solid transparent;
    border-left: 19px solid @oactiveb;
    position: absolute;
    top: 0px;
    left: 100%;
    z-index: @zi1004;
}

.offerD {
    .basics;
    .transAllEase(500ms);
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 0;
    background-color: @offercontentb;
    width: 0px;
    height: 0px;
    overflow: hidden;
}

.dispok {
    width: 100%;
    height: 100%;
}

.offerGTitle {
    .basics;
    .transAllEase;
    position: absolute;
    top: 30px;
    left: 20px;
    width: 45%;
    height: 50px;
    line-height: 25px;
    color: @halfFade-color;
    direction: rtl !important;
}

.offerD a, .offerGTitle a {
    .nodecor;
    color: @halfFade-color;
    line-height: 25px;
    cursor: pointer;
}

.offerImg {
    .basics;
    .transAllEase;
    position: absolute;
    top: 110px;
    left: 20px;
    max-width: 45%;
    height: calc(100% - 115px);
}

.offerImg img {
    width: auto;
    max-width: 100%;
    height: 100%;
}

.offerSP {
    .basics;
    .transAllEase;
    color: @oactiveb;
    font-size: 1.4em;
    position: absolute;
    top: 16px;
    right: 15px;
    width: 45%;
    height: 20px;
    line-height: 20px;
    text-align: right;
}

.offerPrice {
    .basics;
    .transAllEase;
    position: absolute;
    top: 40px;
    right: 15px;
    width: 45%;
    height: 30px;
    line-height: 30px;
    text-align: right;
}

.offerOld {
    .basics;
    padding: 0px 5px 0px 5px;
    position: relative;
    display: inline-block;
    background-color: @offerOldb;
    color: @offerOldf;
    height: 30px;
    line-height: 30px;
    text-align: right;
    z-index: 1;
}

.offerOld::after {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right: 10px solid @offerOldb;
    position: absolute;
    top: 7px;
    left: -10px;
    z-index: @zi1004;
}

.offerOld::before {
    border-top: 2px solid @oactiveb;
    content: "";
    margin: 0 auto;
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    bottom: 0;
    width: 95%;
    z-index: -1;
}

.offerNew {
    .basics;
    background-color: @oactiveb;
    padding: 0px 25px 0px 15px;
    position: relative;
    display: inline-block;
    color: @oactivef;
    height: 30px;
    line-height: 30px;
    text-align: right;
}

.offerDetail {
    .basics;
    .transAllEase;
    position: absolute;
    top: 100px;
    right: 15px;
    width: 45%;
    height: 210px;
    line-height: 30px;
    text-align: right;
    overflow: hidden;
}

.offerR {
    position: absolute;
    top: 313px;
    right: 10px;
    height: 70px;
    width: 230px;
    white-space: nowrap;
}

.offerRT {
    position: relative;
    width: 100%;
    font-size: 1.6em;
    line-height: 20px;
    height: 20px;
    text-align: right;
    color: @halfFade-color;
}

.offerRC {
    position: relative;
    width: 100%;
    line-height: 40px;
    height: 40px;
    text-align: right;
    direction: ltr;
    font-size: 0;
}

.offerRCC, .offerRCS, .offerRCD {
    font-size: 18px;
    color: @counterb;
    text-align: center;
    height: 40px;
    line-height: 40px;
    display: inline-block;
    width: 2px;
    padding: 0px;
    margin: 2px;
    float: none;
}

.offerRCC {
    background-color: @counterb;
    color: @countert;
    .borderRadius(3px);
    width: 25px;
    margin: 1px;
}

.offerRCD {
    background-color: @counterb;
    color: @countert;
    .borderRadius(23px);
    font-size: 14px;
    width: 46px;
    height: 46px;
    line-height: 12px;
    padding-top: 8px;
    box-sizing: border-box;
}

.g {
    background-color: @containersBackColor;
}

.gTitle {
    .basics;
    .fullWidth;
    position: relative;
    height: 35px;
    line-height: 35px;
    display: block;
    color: @gTitleColor;
    padding: 0px 5px 0px 5px;
    font-size: 1.2em;
    font-weight: bold;
    text-align: right;
    .backkorda;
}

.gTitle::before {
    content: ""; /* This is necessary for the pseudo element to work. */
    display: block; /* This will put the pseudo element on its own line. */
    position: absolute;
    width: calc(100% - 20px);
    left: 0px;
    bottom: 0px;
    height: 1px;
    border-bottom: 1px solid @veryFade-color; /* This creates the border. Replace black with whatever color you want. */
    z-index: 0;
}

.gTitle span {
    position: relative;
    display: inline-block;
    height: 33px;
    line-height: 33px;
    color: white;
}

.gTitle span::after {
    content: ""; /* This is necessary for the pseudo element to work. */
    display: block; /* This will put the pseudo element on its own line. */
    position: absolute;
    width: calc(100% + 4px);
    left: 0px;
    bottom: -1px;
    height: 1px;
    border-bottom: 1px solid lightgreen; /* This creates the border. Replace black with whatever color you want. */
    z-index: 1;
}

.gTitle span::before {
    content: "\f107"; /* This is necessary for the pseudo element to work. */
    display: block; /* This will put the pseudo element on its own line. */
    position: absolute;
    width: 20px;
    left: -20px;
    top: 6px;
    height: calc(100% - 5px);
    z-index: 1;
    background-color: transparent;
    font-family: FAS;
    font-size: 1.3em;
    text-align: left;
    color: @kordaGreen;
}

.gBody {
    position: relative;
    background-color: @containersBackColor;
    height: auto;
    overflow: hidden;
    display: block;
    vertical-align: central;
}

.gsCon {
    height: auto;
    position: relative;
    left: 25px;
    right: 25px;
    display: block;
    overflow: hidden;
}

.btnL, .btnR {
    .faws;
    width: 22px;
    height: 50%;
    top: 0px;
    right: 0px;
    font-size: 16px;
    font-weight: 100;
    color: whitesmoke;
    display: flex;
    position: absolute;
    cursor: pointer;
    align-items: center;
    .stretch(1,2);
    z-index: @zi1008;
    .transAllEase(200ms);
}

.btnL::before, .btnR::before {
    content: "";
    position: absolute;
    left: 0px;
    width: 20px;
    height: 30px;
    top: calc(50% - 16px);
    .borderRadiusTlTrBlBr(55px,0px,55px,0px);
    .boxShadowLight;
    background-color: rgba(26, 28, 32, 0.5);
    z-index: -1;
    .transAllEase(300ms);
}

.btnR::before {
    .borderRadiusTlTrBlBr(0px,25px,0px,25px);
}

.btnR {
    left: 0px;
    right: unset;
    direction: ltr;
}

.btnL:hover, .btnR:hover {
    color: #F2A154;
}

.btnL:hover::before, .btnR:hover::before {
    box-shadow: 0px 0px 3px 1px #f2a154;
}

.gShow {
    .basics;
    width: 300%;
    height: 230px;
    line-height: 45px;
}

.gItem {
    .basics;
    width: 232px;
    height: auto;
    margin: 10px;
    display: inline-block;
    padding: 5px;
}

.gItem a {
    .nodecor;
    font-size: 1.0em;
    color: @links4-color;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 210px;
    height: auto;
    line-height: 20px;
    cursor: pointer;
    margin: 5px;
}

.gItem a img {
    width: 210px;
    height: auto;
    cursor: pointer;
    box-sizing: border-box;
}

.gItem a:hover {
    color: @links3-color;
}

.gItem:hover {
    .boxShadowLight;
}

.gItem:hover a {
    .flipInX;
}

.gItem a label {
    display: block;
    width: 200px;
    height: 90px;
    line-height: 20px;
    text-align: center;
    cursor: pointer;
}

.gItem a span, .showPrice {
    box-sizing: border-box;
    background-color: #646464;
    color: @sp-colorf;
    display: block;
    clear: both;
    padding: 0px 5px 0px 5px;
    line-height: 20px;
    height: 20px;
    text-align: center;
    position: relative;
    margin: 0px 10px 0px 10px;
    cursor: pointer;
}

.gItem a span::before, .showPrice::before {
    content: "";
    position: absolute;
    left: -10px;
    top: 0px;
    width: 20px;
    height: 100%;
    background-color: #646464;
    z-index: 10;
    .borderRadius(30px);
}

.gItem a span::after, .showPrice::after {
    content: "";
    position: absolute;
    left: calc(100% - 10px);
    top: 0px;
    width: 20px;
    height: 100%;
    background-color: #555555;
    z-index: 10;
    .borderRadius(30px);
}

.divCl2, .divCl3, .divCl1, .divCl4, .divCl5 {
    .basics;
    .transAllEase(150ms);
    position: relative;
    display: inline-block;
    width: calc(50% - 10px);
    height: auto;
    margin: 10px 5px 10px 5px;
    cursor: pointer;
}

.btnV {
    .transAllEase(250ms);
    .borderRadius(6px);
    position: relative;
    display: block;
    background-color: cornflowerblue;
    width: 220px;
    height: 60px;
    font-size: 1.3em;
    overflow: hidden;
    cursor: pointer;
    color: white;
}

.btnV span {
    z-index: 0;
}

.btnV label {
    z-index: 1;
    position: absolute;
    display: block;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    text-align: center;
    text-indent: 50px;
    line-height: 60px;
    cursor: pointer;
}

.btnV span::after {
    .faws;
    .transAllEase(250ms);
    position: absolute;
    display: block;
    top: 0px;
    right: 0px;
    width: 50px;
    height: 60px;
    line-height: 60px;
    content: attr(data-content);
    text-indent: 0px;
    text-align: center;
    font-size: 1.5em;
    background-color: #5555ff;
    .borderRadiusTlTrBlBr(0px,6px,0px,6px);
}

.btnV span::before {
    .transAllEase(250ms);
    content: ' ';
    position: absolute;
    width: 50px;
    height: 100px;
    top: -20px;
    right: 10px;
    .borderRadiusTlTrBlBr(50px,0px,50px,0px);
    background-color: #5555ff;
}

.cartPayment .btnV {
    width: 100%;
}


.cThread .btnV {
    position: relative;
    height: 30px;
    font-size: 1em;
    display: inline-block;
    margin-right: 10px;
    .lkdlGrad;
}

.cThread .btnV span::before {
    top: -10px;
    height: 50px;
    width: 30px;
}

.cThread .btnV label {
    line-height: 30px;
}

.cThread .btnV span::after {
    height: 30px;
    width: 30px;
    line-height: 35px;
}

.btnV:hover span::before {
    width: 100%;
}

.tbProes, .tbCones {
    width: 100%;
    height: 30px;
    .borderRadius(15px);
    position: relative;
    display: block;
    border: 1px solid @halfFade-color;
    background-color: white;
    margin-right: -10px;
}

.cm2FixCr .tbProes, .cm2FixCr .tbCones {
    margin-right: 0px;
}

.tbProes:hover, .tbCones:hover {
    border: 1px solid blue;
}

.tbProes input[type=text], .tbCones input[type=text] {
    border: none;
    margin: 5px 25px 5px 5px;
    ;
    width: calc(100% - 30px);
    height: 20px;
    background-color: transparent;
}

.tbProes input[type=text]:focus, .tbCones input[type=text]:focus {
    border: none;
    outline-style: none !important;
    outline: 0 !important;
    box-shadow: none;
}

.tbProes span, .tbCones span {
    .faws;
    .shadow1;
    content: '\f055';
    position: absolute;
    top: 2px;
    right: 5px;
    width: 20px;
    height: 28px;
    line-height: 28px;
    color: white;
    cursor: pointer;
}

.tbProes span::after, .tbCones span::after {
    .faws;
    content: '\f055';
    position: absolute;
    top: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    line-height: 30px;
}

.tbProes span:hover, .tbCones span:hover {
    .shadow2;
    color: blue;
}

.proes div, .cones div {
    position: relative;
    display: block;
    width: 100%;
    line-height: 20px;
}

.proes div span, .cones div span {
    width: 20px;
    height: 20px;
    position: relative;
    display: block;
    float: right;
}

.proes div span::before, .cones div span::before {
    .faws;
    position: absolute;
    content: '\f057';
    line-height: 20px;
    color: #fe5353;
    cursor: pointer;
    top: 0px;
    right: 0px;
    width: 20px;
    height: 20px;
}

.cpP, .cpC {
    margin-bottom: 10px;
    border-bottom: 1px dotted gray;
    font-size: 1.2em;
    color: blue;
}

.cpC {
    color: red;
}

.proes div span:hover, .cones div span:hover {
    .shadow2;
    color: red;
}

.rotate20 {
    -ms-transform: rotate(-5deg) scale(0.8); /* IE 9 */
    -webkit-transform: rotate(-5deg) scale(0.8); /* Safari */
    transform: rotate(-5deg) scale(0.8); /* Standard syntax */
}

.cm2, .proes, .cones, .cm2Fix {
    .basics;
    .transAllEase(150ms);
    position: relative;
    display: block;
    width: calc(50% - 20px);
    height: auto;
    margin: 10px;
    float: right;
}

.proes, .cones, .cm2Fix {
    width: calc(50% - 20px);
}

.cm2FixCr {
    width: 50%;
    margin-right: 0px;
    margin-left: 0px;
}

.cm2 p, .proes p, .cones p, .cm2Fix p {
    color: @halfFade-color;
}

.convSlider {
    width: calc(100% - 20px);
    margin: 10px;
    position: relative;
    direction: ltr;
    text-align: left;
}

.convSlider .spanR {
    position: relative;
    width: 100%;
    margin-bottom: 10px;
    direction: rtl;
    line-height: 10px;
    display: block;
}

.oldPaper {
    background-color: #f8f5de;
    background-image: linear-gradient(to right, rgba(255,210,0,0.4), rgba(200, 160, 0, 0.1) 11%, rgba(0,0,0,0) 35%, rgba(200, 160, 0, 0.1) 65%);
    box-shadow: inset 0 0 75px rgba(255,210,0,0.3), inset 0 0 20px rgba(255,210,0,0.4), inset 0 0 30px rgba(220,120,0,0.8);
    color: rgba(0,0,0,0.5);
}

.rBarC {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    background-color: white;
}

.rBarCI {
    position: relative;
    display: block;
    width: calc(100% - 40px);
    height: auto;
    padding: 20px;
}

.rBar {
    width: 90%;
    margin-right: 4%;
    display: block;
    position: relative;
    clear: both;
    float: none;
    margin-top: 20px;
    height: 20px;
}

.rBar span, .rBar .rBarB, .rBar label {
    position: relative;
    display: block;
    float: right;
    line-height: 20px;
}

.rBar label {
    width: 100px;
}

.rBar span {
    width: 180px;
}

.rBarB {
    .borderRadius(1px);
    width: calc(100% - 300px);
    margin: 13px 10px 0px 10px;
    height: 2px;
    background-color: #9f9f9f;
    overflow: visible;
}

.rBarF {
    .borderRadius(1px);
    position: absolute;
    top: -1px;
    height: 4px;
    right: 0px;
    .gGold;
    background-size: 800% 800%;
    -webkit-animation: guageAnim 5s ease infinite;
    -moz-animation: guageAnim 5s ease infinite;
    -o-animation: guageAnim 5s ease infinite;
    animation: guageAnim 5s ease infinite;
}

@-webkit-keyframes guageAnim {
    0% {
        background-position: 0% 50%
    }

    100% {
        background-position: 100% 50%
    }
}

@-moz-keyframes guageAnim {
    0% {
        background-position: 0% 50%
    }

    100% {
        background-position: 100% 50%
    }
}

@-o-keyframes guageAnim {
    0% {
        background-position: 0% 50%
    }

    100% {
        background-position: 100% 50%
    }
}

@keyframes guageAnim {
    0% {
        background-position: 0% 50%
    }

    100% {
        background-position: 100% 50%
    }
}

.divCl1 {
    margin: 0px;
    width: 100%;
}

.divCl3 {
    width: calc(32% - 10px);
}

.divCl4 {
    width: calc(25% - 10px);
}

.divCl5 {
    width: calc(20% - 10px);
}

.divCl1:hover, .divCl2:hover, .divCl3:hover, .divCl4:hover, .divCl5:hover {
    .boxShadow3;
}

.divCl1 a, .divCl2 a, .divCl3 a, .divCl4 a, .divCl5 a {
    display: block;
    border: none;
    width: 100%;
    height: auto;
}

.bookCn {
    padding: 10px;
    direction: rtl;
    text-align: justify;
    font-size: 1.3em;
    line-height: 25px;
}

.bookCn img {
    width: 30%;
    float: right;
    margin: 5px;
}

.bookCn a {
    text-decoration: none;
    cursor: pointer;
    display: inline-block;
    width: auto
}

.ggM, .gg1M, .ggM1, .gg2M {
    display: inline-block;
}

.menuL0 {
    margin: 0px;
}

.menuL0 ul, .menuL0 li, .menuL0 li p, .articlesD, .articlesD a {
    display: inline-block;
}

.menuL0 {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
}

.menuL2 li {
    display: list-item;
}

.menuL1 ul {
    display: list-item;
}

.menuL1 ul li {
    display: list-item;
}

.gg1C, .gg2C {
    .basics;
    .transAllEase(200ms);
    .effect7;
    position: absolute;
    top: 47px;
    left: 0px;
    right: 0px;
    height: 180px;
    z-index: @zi1005;
    display: none;
    background-color: @ColorT5;
    padding: 10px;
    width: 100%;
}

.gg2C {
    top: 0px;
}

.gg1CC, .gg2CC {
    .basics;
    .transAllEase(200ms);
    .fullWidth;
    .height30;
}

.gg1C {
    justify-content: space-between;
    overflow: hidden;
}

.fbox {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
}

.fbox ul {
    margin: 0px;
    list-style: none;
    flex-direction: row;
    flex-wrap: wrap;
    height: 100%;
}

.fbox ul li a, .fbox ul li ul li a {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fbox ul li, .fbox ul li ul li {
    line-height: 30px !important;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    list-style: none;
    align-items: center;
    text-align: right;
    direction: rtl;
    height: 30px;
    padding-left: 20px;
}

@keyframes dmenu {
    0% {
        left: 50%;
        width: 0%;
    }

    50% {
        left: 25%;
        width: 50%;
    }

    100% {
        left: 0%;
        width: 100%;
    }
}

.menuL0 li:hover p, .articlesD:hover a {
    .effect7;
    .hover2;
    color: @menuActive;
    font-weight: 700;
    opacity: 1;
}

.menuL0 li:hover P::after, .articlesD:hover a::after {
    .transAllEase(200mx);
    animation: dmenu 0.2s ease-in-out forwards;
    position: absolute;
    top: 100%;
    left: 0px;
    width: 100%;
    height: 2px;
    background-color: @menuActive;
    opacity: 1;
    content: " ";
}

.menuL0 li::before {
    content: ' ';
    height: 100%;
    width: 3px;
    right: 0;
    color: slategray;
    line-height: 20px;
    font-size: 2.5em;
    margin-right: 5px;
    margin-left: 5px;
    border-right: 1px solid transparent;
    -webkit-border-image: -webkit-gradient(linear, 0 16, 0 100%, color-stop(0, transparent), color-stop(0.3, gray), color-stop(0.4, gray), color-stop(0.7, transparent)) 0 100%;
    border-right-width: 1px;
    border-left-width: 0px;
    border-top-width: 0px;
    border-bottom-width: 0px;
}

.menuL0 li:first-of-type::before {
    content: unset;
    height: unset;
    width: unset;
    right: unset;
    color: unset;
    line-height: unset;
    font-size: unset;
    margin-top: unset;
}

.fbox li::before {
    content: unset;
    height: unset;
    width: unset;
    right: unset;
    line-height: unset;
    font-size: unset;
    margin: unset;
}

.menuL0 li:hover .gg1C {
    display: block;
}

.menuL0 li:hover .gg1C .fbox {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-content: space-between;
    justify-content: flex-end;
}

.fbox {
    height: 390px;
    width: 100%;
    padding-right: 120px;
}

.fboxC {
    position: relative;
    top: 0px;
    width: 100%;
    left: 0px;
    height: 100%;
    position: absolute;
}

.fboxC img {
    position: absolute;
    bottom: 0px;
    left: 20px;
}



.menuDisp1, .menuDisp2 {
    top: 40px;
    left: 0px;
    right: 0px;
    height: 30px;
    z-index: @zi1006;
    display: block;
    background-color: @mainmenubcolor;
    .boxShadow3;
}

.menuDisp2 {
    top: 30px;
    height: 50px;
    line-height: 40px;
}

.menuDisp2 a::before {
    content: "";
}

.menuDisp1 a:hover, .menuDisp2 a:hover {
    font-size: 1.05em;
}

.showgT, .seperator {
    display: inline-block;
    font-size: 20px;
    color: @halfFade-color;
    padding-left: 10px;
    line-height: 30px;
}

.showgT {
    width: 100%;
}

.seperator {
    font-size: 30px;
}

.showRes {
    display: inline-block;
    font-size: 1.0em;
    color: @halfFade-color;
    line-height: 30px;
    margin-bottom: 10px;
}

.showSearchBox {
    .basics;
    .borderRadius;
    .boxShadowLight;
    display: inline-block;
    float: none;
    height: 30px;
    width: 250px;
    margin-right: 10px;
    margin-left: 10px;
    background-color: @backcolor2 + #111;
}

.showSearchBox .searchBoxT {
    position: unset;
}

.searchBox:hover {
    background-color: @search-bcolor2;
}

.showOrder {
    .basics;
    .fullWidth;
    text-align: left;
    color: @halfFade-color;
}

.clFloat {
    .basics;
    display: inline-block;
}

.showOrder .clFloat .items, .showOrder .clFloat .itemsTitle {
    display: inline-block;
    font-size: 0.9em;
    padding-left: 5px;
    padding-right: 5px;
    cursor: pointer;
    height: 40px;
}

.showOrder .clFloat .active {
    border-bottom: 2px solid @links3-color;
}

.showOrder .clFloat .items:hover {
    color: @links3-color;
}

.showLC {
    .basicsNoTrans;
    top: 0px;
    width: 100%;
    float: none;
    padding: 0px 5px 0px 5px;
    margin: 0px;
    min-height: 500px;
}

.showLC .gbar {
    box-sizing: border-box;
    width: 100%;
    margin: 0px;
}

.fixBot, .fixBotL, .fixBotLx, .lC, .rC {
    transform: translate(0, 0); /* For browsers don't support translate3d. */
    transform: translate3d(0, 0, 0);
    will-change: position, transform, top, left, max-width;
}

.showCl4 {
    .basics;
    .borderRadius(5px);
    position: relative;
    display: inline-block;
    height: auto;
    cursor: pointer;
    width: calc(16% - 20px);
    margin: 3px;
    background-color: rgba(255,255,255,0.6);
    padding: 5px;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: top;
}

.showCl4:hover {
    .boxShadow3;
    .borderRadius(0px);
    margin-bottom: 0px;
    max-height: 1000px;
}

.showCl4 img {
    .transAllEase(100ms);
    width: 100%;
    height: auto;
}

.showCl4 a {
    color: @halfFade-color;
    font-size: 1.0em;
    overflow: hidden;
    position: relative;
}

.showCl4 a p {
    width: 90%;
    overflow: hidden;
    line-height: 22px;
    min-height: 80px;
    display: block;
}

.showCl4:hover img {
    .flipInX;
}

.showDesc {
    .transAllEase(100ms);
    box-sizing: border-box;
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: #646464;
    opacity: 0.9;
    color: white;
    padding: 5px;
}

.showCl4 a .showDesc p {
    width: unset;
    overflow: unset;
    min-height: unset;
    display: unset;
}

.showDesc ul {
    padding-right: 20px;
    color: white;
}

.showCl4:hover .showDesc {
    .flipInX;
    display: block;
    -webkit-animation-duration: 1.0s;
    animation-duration: 1.0s;
}

.showCl4:hover a {
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
    min-height: 88px;
}

.showStar {
    .basics;
    .borderRadiusTlTrBlBr(10px,2px,2px,10px);
    .fawr;
    background-color: @srateb;
    color: @sratef;
    display: inline-block;
    font-size: 0.8em;
    padding: 5px;
    line-height: 10px;
}

.showRate {
    .basics;
    font-size: 0.9em;
    display: inline-block;
    color: @halfFade-color;
}

.showOldPrice {
    .basics;
    display: block;
    font-size: 1.0em;
    color: @halfFade-color;
    line-height: 30px;
}

.showPrice {
    .basics;
    font-size: 1.0em;
    color: @sp-colorf;
    line-height: 22px;
}

.showCl4:hover .showPrice {
    animation: glow2 0.9s ease-in-out infinite;
    font-size: 1.1em;
}

.xxx {
}

.xxx p, .oClose p {
    display: block;
    font-size: 1.0em;
    color: @halfFade-color - #666;
    line-height: 30px;
}

.xTbar, .xUbar {
    .basics;
    .transAllEase(250ms);
    width: calc(100% - 40px);
    box-sizing: border-box;
    margin: 0 20px 0 20px;
}

.xMbar {
    .basics;
    .transAllEase(250ms);
    width: calc(100% - 25px);
    box-sizing: border-box;
    margin: 15px 5px 0px 20px;
}

.xAbar {
    .basics;
    .transAllEase(250ms);
    width: calc(100% - 30px);
    box-sizing: border-box;
    margin: 15px 20px 0px 10px;
}

.oClose {
    .transAllEase(250ms);
    max-height: 30px;
    overflow: hidden;
    cursor: pointer;
}

.oClose p {
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0px 5px 0px 25px;
    color: @hhalfFade-color;
    margin: 0px;
}

.oClose p::after, .oCloseC p::after {
    position: absolute;
    left: 0px;
    top: 2px;
    width: 20px;
    height: 20px;
    font-size: 1.3em;
    color: @fade-color;
}

.oClose p::after {
    .faws;
    content: "\f107";
}

.oCloseC {
    max-height: 1000px;
    overflow: visible;
}

.oCloseC p::after {
    .faws;
    content: "\f106";
}

.xxx span, .xxx label, .oClose span, .oClose label {
    display: block;
    font-size: 0.95em;
    color: @halfFade-color;
    line-height: 25px;
}

.xxx span .irs span {
    font-size: 0.88em;
    line-height: 15px;
    transform: scale(1);
}

.xxx span .ui-checkbox, .xxx .ui-checkbox, .oClose span .ui-checkbox, .oClose .ui-checkbox, .xxx .ui-checkbox, .oClose .ui-checkbox, .xxx span .ui-radio, .oClose span .ui-radio {
    display: inline-block;
    direction: rtl;
    clear: right;
    cursor: pointer;
}

.oClose label, .xxx label {
    display: inline-block;
    direction: rtl;
    text-align: right;
    clear: right;
    cursor: pointer;
}

.xxx .ui-select, .oClose .ui-select, .xxx select, .oClose select {
    height: 25px;
    width: calc(100% - 10px);
    font-family: Tahoma;
    font-size: 1.0em;
    background-color: @backcolor2 - #111;
    margin-bottom: 15px;
}

.xxx .options {
    cursor: pointer;
}

.gBody {
    .transAllEase(300ms);
}

.gsShow {
    position: relative;
    float: right;
    width: 10000%;
    text-align: right;
}

.gsShowC {
    .transAllEase(300ms);
    position: relative;
    text-align: right;
}

.btnhome {
    .transAllEase(10ms);
    width: 70px;
    height: 40px;
    bottom: -5px;
    right: calc(50% - 35px);
    position: fixed;
    display: none;
    z-index: @zi1006;
    cursor: pointer;
}

.btnhome span {
    .transAllEase(10ms);
    .faws;
    .boxShadow5;
    .shadow4;
    position: absolute;
    display: block;
    top: 0px;
    width: 100%;
    height: 100%;
    right: calc(50% - 35px);
    line-height: 50px;
    .borderRadiusTlTrBlBr(25px,25px,0px,0px);
    border: 0px solid #666666;
    font-size: 40px;
    background-color: #31355155;
    transform-origin: center;
    color: #fc8621;
    text-align: center;
}

.btnhome:hover span {
    .shadow3;
    .bounceIn;
    font-size: 80px;
    right: calc(50% - 40px);
    background-color: #313551;
}




.spORC {
    padding-left: 100px;
    margin-left: -60px;
    margin-top: -10px;
    position: relative;
    height: 80px;
    direction: rtl;
    text-align: right;
}

.spOR {
    box-sizing: border-box;
    width: 80px;
    height: 80px;
    background-color: skyblue;
    display: block;
    position: absolute;
    top: -30px;
    right: -80px;
    width: 150px;
    height: 16px;
    transform-origin: bottom left;
    transform: rotate(50deg);
    background-color: @links5-color;
    color: @links2-color;
    text-align: center;
    padding: 0px 30px 0px 5px;
    line-height: 16px;
    font-size: 1.0em;
    z-index: 4;
}


.bfTR {
    .backfadeTR;
    position: absolute;
    top: 9px;
    right: 9px;
    width: calc(100% - 9px);
    height: calc(100% - 9px);
    box-sizing: border-box;
    background-color: transparent;
}

.bfTR::after {
    position: absolute;
    content: "";
    top: 2px;
    right: 2px;
    width: 100%;
    height: 100%;
    background-color: #fff;
}

.filter {
    .basics;
    .transAllEase(700ms);
    .borderRadiusTlTrBlBr(2px,7px,7px,7px);
    background-color: @menu-bcolor;
    display: inline-block;
    font-size: 0.95em;
    color: @sp-color2;
    padding: 2px 5px 0 15px;
    cursor: pointer;
    margin: 2px;
    max-width: 0px;
    max-height: 0px;
    overflow: hidden;
}

.filter p {
    line-height: 15px;
}

.filter span {
    font-size: 0.8em;
    color: #b1c1ce;
}

.filter::after {
    .faws;
    color: red;
    position: absolute;
    left: 2px;
    top: -6px;
    width: 13px;
    height: 13px;
    font-size: 0.9em;
    content: "\f057";
}


.gitS, .gitSh {
    .basics;
    .transAllEase(200ms);
    .borderRadiusTlTrBlBr(7px,2px,7px,7px);
    border: 1px solid @fade-color;
    display: inline-block;
    height: 30px;
    cursor: pointer;
    padding-left: 5px;
    padding-right: 5px;
    margin-right: 5px;
    margin-top: 0px;
}

.gitS:hover, .gitSh:hover {
    background-color: @fade-color + #333;
}

.gitS label, .gitSh label {
    .borderRadiusTlTrBlBr(10px,10px,10px,10px);
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-left: 5px;
    top: 5px;
    float: none;
}

.gitS label + p {
    top: -2px;
}

.gitS p, .gitSh p {
    position: relative;
    display: inline-block;
    line-height: 20px;
    cursor: pointer;
    font-size: 1.0em;
    color: @links4-color;
    float: none;
}

.gitS:hover p, .gitSh:hover p {
    color: @links3-color;
}

.gitsActive::before {
    .faws;
    .transAllEase(200ms);
    content: "\f00c";
    display: block;
    top: 0px;
    left: calc(100% - 18px);
    width: 10px;
    height: 10px;
    position: absolute;
    z-index: @zi1004;
    text-shadow: 0 0 2px #c4d2ff, 0 0 4px #c4d2ff, 0 0 8px #5b82ff, 0 0 12px #5b82ff;
}

.gitSh::before {
    top: 10px;
}

.propsV {
    display: inline-block;
    vertical-align: unset;
}

.Disabled {
    display: none;
}

.propsG input[type='radio'][disabled] {
    background-color: red;
    display: none;
}

.propsG input[type='radio'][disabled] + label {
    background-color: red;
    display: none;
}

.propsG input[type='radio'] + label::after {
    content: "";
    display: block;
}

#shopsL {
    .basics;
    display: inline-block;
}

.gitSh {
    height: 50px;
    line-height: 10px;
}

.gitSh p {
    line-height: 10px;
}

.clU {
    clear: both;
}

.gTitleL {
    display: none;
}

.gSepN {
    display: none;
}

#divDiscountT {
    margin-right: 20px;
}


.easyzoom {
    position: relative;
    display: inline-block;
    *display: inline;
    *zoom: 1;
}

.easyzoom img {
    vertical-align: bottom;
}

.easyzoom.is-loading img {
    cursor: progress;
}

.easyzoom.is-ready img {
    cursor: crosshair;
}

.easyzoom.is-error img {
    cursor: not-allowed;
}

.easyzoom-notice {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 150;
    width: 10em;
    margin: -1em 0 0 -5em;
    line-height: 2em;
    text-align: center;
    background: #FFF;
    box-shadow: 0 0 10px #888;
}

.easyzoom-flyout {
    position: absolute;
    z-index: 100;
    overflow: hidden;
    background: #FFF;
}

.easyzoom--overlay .easyzoom-flyout {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.easyzoom--adjacent .easyzoom-flyout {
    top: 0;
    left: 100%;
    width: 100%;
    height: 100%;
    margin-left: 20px;
}


.lCAs {
    .gbar;
    box-sizing: border-box;
    margin: 0px 0px 0px 5px;
    width: calc(100% - 5px);
}

.abar {
    .effect6;
    margin-top: 10px;
    display: block;
    padding: 10px;
}

.abar a {
    .nodecor;
}

.abar .showSearchBox {
    margin: 0px;
    width: 100%;
}

.allAs {
    margin-bottom: 20px;
    position: relative;
    display: block;
    clear: both;
    float: none;
}

.allAs a {
    .nodecor;
    display: block;
    position: relative;
}

.allAs a label {
    clear: both;
}

.allAs a img {
    float: right;
    width: 300px;
    height: auto;
    margin: 10px;
    max-height: 300px;
    text-align: justify;
}

.allAs a p {
    color: @gTitleColor;
}

.allAs a .dx {
}

.allAs a span {
    display: block;
    color: @halfFade-color;
    max-height: 100%;
    text-align: justify;
    font-size: 0.9em;
    margin: 0px 10px 0px 10px;
}




.n::after, .allAs::after {
    width: 100%;
    height: 1px;
    display: block;
    clear: both;
    content: " ";
    margin-top: 5px;
    .gradientLine;
}

.allAs:nth-last-child(1)::after {
    display: none;
}

.allAs a label {
    display: block;
    color: @fade-color;
    font-size: 0.7em;
    width: 100%;
    text-align: left;
}

.gLike, .gRev, .gAlbum {
    border: 1px solid gray;
    .borderRadius(10px);
    position: absolute;
    top: 10px;
    left: 10px;
    width: 45px;
    height: 40px;
    font-size: 2.0em;
    color: @like-color;
    z-index: @zi1003;
    cursor: pointer;
    text-align: center;
    line-height: 45px;
}

.gRev {
    left: 60px;
}

.gAlbum {
    left: 110px;
}

.gLike {
    color: @liked-color;
}

.liked {
    color: @like-color;
}

.gLike:hover, .gSpec:hover, .gRev:hover, .gPriceH:hover, .gAlbum:hover {
    color: @myCyan;
}

.gRev {
    .fawr;
    font-size: 2.5em;
}

.gLike, .gSpec, .gPriceH, .gAlbum {
    .faws;
    font-size: 2.5em;
}

.gLike:hover::after, .gSpec:hover::after, .gRev:hover::after, .gPriceH:hover::after, .gAlbum:hover::after {
    .borderRadius(5px);
    background-color: @ttip-bcolor;
    color: @ttip-fcolor;
    font-size: 0.45em;
    position: absolute;
    top: 45px;
    left: -55px;
    width: 170px;
    height: 30px;
    line-height: 30px;
    content: attr(data-content);
    text-align: center;
    font-family: IRANSans;
    font-weight: 100;
}

.gSpec:hover::after {
    content: 'مشخصات فنی';
}

.gRev:hover::after {
    content: 'نظرات کاربران';
}

.gPriceH:hover::after {
    content: 'نمودار تغییر قیمت';
}

.gAlbum:hover::after {
    content: 'آلبوم تصاویر';
}

.favDisabled {
    .fawr;
    font-size: 2.5em;
    color: @like-color;
}


.favg {
    display: inline-block;
    padding: 5px;
    position: relative;
    background-color: white;
    .borderRadius(3px);
    height: 250px;
    width: calc(50% - 25px);
    margin: 5px;
    float: right;
}

.favg a {
    position: absolute;
    display: block;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    cursor: pointer;
    text-decoration: none;
}

.favg a img {
    padding-left: 5px;
    float: right;
    width: 256px;
    height: 256px;
    display: inline-block;
}

.favg a .cn {
    margin-top: 20px;
    display: inline-block;
    float: left;
    position: relative;
    width: calc(100% - 270px);
}

.favg a .cn p {
    display: block;
    font-size: 1.2em;
    font-family: Tahoma;
    min-height: 40px;
    line-height: 30px;
    color: @gTitleColor;
}

.favg a .cn span {
    display: block;
    font-size: 1.0em;
    min-height: 30px;
    line-height: 20px;
    padding-left: 30px;
    color: @links3-color;
}

.favg a .cn label {
    display: block;
    font-size: 1.3em;
    line-height: 30px;
    color: red;
}

.favg .rem {
    position: absolute;
    font-size: 0.8em;
    cursor: pointer;
    line-height: 30px;
    height: 30px;
    display: block;
    bottom: 0px;
    left: 20px;
    width: 160px;
    text-align: left;
}

.favg .rem::before {
    .fawr;
    content: '\f146\00a0';
    width: 20px;
    line-height: 30px;
    height: 30px;
}

.invoice, .invoiceS {
    width: 100%;
    position: relative;
    box-sizing: border-box;
    padding: 10px;
    height: 100%;
}

.invoice table, .invoiceS table {
    width: 100%;
    font-size: 0.9em;
    line-height: 20px;
}

.invoice table thead th, .invoiceS table thead th {
    text-align: right;
    padding-right: 2px;
}

.invoice table thead, .invoice table tfoot, .invoiceS table thead, .invoiceS table tfoot {
}

.invoice table thead tr, .invoice table tfoot tr, .invoiceS table thead tr, .invoiceS table tfoot tr {
    height: 30px;
    background-color: #bfc4ff;
}

.invoice table tfoot tr td:first-child {
    text-align: left;
}

.invoice table tfoot tr td, .invoiceS table tfoot tr td {
    border-top: 1px solid #999;
    font-weight: bold;
}

.invoice table tfoot tr:last-child td {
    border-bottom: 1px solid #999;
}

.invoice table thead th, .invoiceS table tfoot td, .invoice table thead th, .invoiceS table tfoot td {
    font-size: 1em;
    padding: 5px;
}

.invoice table tbody {
}

.invoice table tbody tr:nth-child(even) {
    background-color: #d9dcff;
}

.invoice table tbody tr:nth-child(odd) {
    background-color: #ededf7;
}

.invoice table tbody tr:nth-child(even) td:nth-child(3), .invoice table tbody tr:nth-child(odd) td:nth-child(3) {
    word-break: keep-all;
    overflow-wrap: normal;
    white-space: nowrap;
}

.invoice table tbody tr:nth-child(even) td:nth-child(4) {
    background-color: #d1d4ff;
    font-size: 0.9em;
}

.invoice table tbody tr:nth-child(even) td:nth-child(5) {
    background-color: #bfc4ff;
    font-size: 0.9em;
}

.invoice table tbody tr:nth-child(even) td:nth-child(6) {
    background-color: #b5b6ff;
}

.invoice table tbody tr:nth-child(odd) td:nth-child(4) {
    background-color: #e9e9ff;
    font-size: 0.9em;
}

.invoice table tbody tr:nth-child(odd) td:nth-child(5) {
    background-color: #e0e0ff;
    font-size: 0.9em;
}

.invoice table tbody tr:nth-child(odd) td:nth-child(6) {
    background-color: #cfd4ff;
}

.invoice table tbody tr td, .invoiceS table tbody tr td {
    padding: 5px;
}

.invoiceS table tbody tr:hover {
    cursor: pointer;
    background-color: #fff;
}

.invRegistered {
    background-color: khaki;
}

.invAuthorization {
    background-color: lightyellow;
}

.invGathering {
    background-color: khaki;
}

.invReadyToSent {
    background-color: aquamarine;
}

.invSent {
    background-color: greenyellow;
}

.invDelivered {
    background-color: lightgreen;
}

.invCanceled {
    background-color: salmon;
}

.invInc, .invDec, .invQty, .invDel {
    position: relative;
    display: inline-block;
    min-width: 20px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
}

.invInc, .invDec, .invDel {
    cursor: pointer;
    font-size: 1.3em;
    color: blue;
    padding-top: 5px;
    .fawr;
}

.invInc:hover, .invDec:hover, .invDel:hover {
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75);
}

.invDec, .invDel {
    color: red;
}

.invQty {
    width: unset;
}

.invoicePropsV {
    color: #555;
}

.invoicePropsN {
    color: blue;
}

.invoice table tfoot tr td select {
    background-color: #bfc4ff;
    color: blue;
}

.cartPayment {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    margin-top: 10px;
    line-height: 25px;
}

.cartPayment p {
    margin: 10px 0px 10px 0px;
}

.cartPayment textarea {
    position: relative;
    box-sizing: border-box;
    width: calc(100% - 20px);
    padding: 10px;
    margin-top: 10px;
    line-height: 25px;
    height: 110px;
}

.cartPayment select {
    position: relative;
    box-sizing: border-box;
    width: 100%;
    margin: 0px;
    margin-top: 10px;
    line-height: 25px;
    margin-bottom: 10px;
}

#cbPayment {
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
}


.cartChanged {
    position: relative;
    box-sizing: border-box;
    padding: 20px;
    width: 100%;
    text-align: center;
    font-weight: bold;
    color: red;
    line-height: 25px;
}

.TL {
    text-align: left;
}

.BB {
    border-bottom: 1px solid #555;
}

.repW, .repT {
    position: relative;
    display: inline-block;
    width: 92px;
    height: 56px;
    float: right;
    padding: 5px;
    box-sizing: border-box;
}

.repW {
    border: 1px solid #777;
    .borderRadiusTlTrBlBr(5px,0px,5px,0px);
}

.repT {
    width: calc(100% - 92px);
    height: auto;
}

.repL, .repD, .repS {
    position: relative;
    float: right;
    width: 40px;
    font-size: 0.8em;
    color: green;
    height: 20px;
    line-height: 20px;
    margin-bottom: 2px;
    cursor: pointer;
}

.repD {
    color: red;
    text-align: left;
}

.repS {
    color: #555;
    float: none;
    font-size: 0.76em;
    width: 80px;
    display: block;
    clear: both;
}

.repL::before, .repD::before, .repS::before {
    .faws;
    width: 18px;
    height: 20px;
    content: '\f164';
}

.repL:hover, .repD:hover, .repS:hover {
    .shadow1;
}

.repD::before {
    line-height: 24px;
    content: '\f165';
}

.repS::before {
    content: '\f4ad\0020';
}

.myPostsB {
    .effect6;
    position: relative;
    display: block;
    clear: both;
    float: none;
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
    margin-bottom: 20px;
}

.myPostsB img {
    .effect6;
    margin-top: 68px;
    width: 240px;
    float: right;
}

.myPostsTitle {
    width: calc(100% - 260px);
    margin: 10px;
}

.myPostsTitle a {
    text-decoration: none;
    font-size: 1.3em;
    cursor: pointer;
}

.myPostsTitle a span {
    font-size: 0.8em;
}

.myPostsB p {
    font-size: 1.1em;
    padding: 5px;
}

.myPostsB textarea {
    width: calc(100% - 260px);
    height: 80px;
}

.myPostsB input[type=text] {
    width: calc(100% - 260px);
}

.saveBoxCn .cm2Fix {
    width: calc(50% - 140px);
    float: right;
}

.saveBoxCn .tbProes, .saveBoxCn .tbCones {
    .borderRadiusTlTrBlBr(10px,10px,0px,0px);
    height: 110px;
    background-color: #ffe2e2;
}

.saveBoxCn .tbProes textarea, .saveBoxCn .tbCones textarea {
    width: 100%;
    height: 80px;
    background-color: #ffe2e2;
}

.saveBoxCn .tbProes textarea, .saveBoxCn .tbProes {
    background-color: #f2fff9;
}

.myPostsDT {
    float: left;
    font-size: 0.8em;
    color: #777;
    margin-left: 30px;
    height: 30px;
}

.gshow strong, .gshow strong a, .gshow a, .lCAs strong, .lCAs strong a, .lCAs a {
    font-weight: normal;
    font-size: 1em;
    text-decoration: none;
}

.gshow strong, .gshow strong a, .lCAs strong, .lCAs strong a {
    font-weight: bold;
}

.gshow strong, .lCAs strong {
    font-weight: bold;
    color: #494949;
    font-family: IRANSans;
    font-size: 0.95em;
}

.notiLert {
    display: none;
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-color: rgba(0, 0, 0,.7);
    .transAllEase(200ms);
    animation: noti 0.5s ease-in-out forwards;
    vertical-align: central;
    z-index: @ziMax;
}

.notiLertC h1 {
    border-bottom: 1px solid #888888;
}

.notiLertC h1, .notiLertC p {
    width: 100%;
    height: 40px;
    padding: 10px;
    box-sizing: border-box;
    text-align: center;
    display: block;
    animation: fadein 1.0s ease-in-out forwards;
    color: black;
}

.notiLertC p {
    height: 100px;
}

.notiLertC {
    display: block;
    position: relative;
    width: 100%;
    height: 240px;
    margin-top: -120px;
    position: absolute;
    top: calc(50% - 120px);
    text-align: center;
    background-color: #cdd6d5;
    .transAllEase(200ms);
    animation: notiC 0.5s ease-in-out forwards;
    overflow: hidden;
}

.notiLertC .btnV {
    animation: notiB 0.8s ease-in forwards;
}

.notiLertx {
    display: inline-block;
}

@keyframes noti {
    0% {
        width: 0%;
    }

    50% {
        width: 100%;
    }

    100% {
        width: 100%;
    }
}

@keyframes notiC {
    0% {
        top: -30%;
    }

    50% {
        top: -30%;
    }

    100% {
        top: 50%;
    }
}

@keyframes notiB {
    0% {
        margin-bottom: -300px;
    }

    70% {
        margin-bottom: -300px;
    }

    100% {
        margin-bottom: 0px;
    }
}

.uCom {
    position: relative;
    padding: 10px;
    box-sizing: border-box;
}

.uCom h1 {
    font-size: 1em;
}

.uCom p {
    font-size: 0.8em;
    text-align: justify;
}

.bAlbum {
    .transAllEase(300ms);
}

.bAlbumC {
    .transAllEase(300ms);
    position: fixed;
    background-color: white;
    top: 10px;
    left: 10px;
    width: calc(100% - 20px);
    height: calc(100vh - 20px);
}

.baDispNone {
    .transAllEase(300ms);
    display: none;
}

.baDispBlock {
    .transAllEase(300ms);
    display: block;
}

.bAlbumClose {
    .transAllEase(100ms);
    position: absolute;
    top: 5px;
    left: 5px;
    width: 30px;
    height: 35px;
    line-height: 40px;
    font-size: 2em;
    cursor: pointer;
    color: gray;
    z-index: @zi1006;
}

.bAlbumClose:hover {
    color: red;
}

.bAlbumClose:after {
    .faws;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 30px;
    height: 35px;
    content: '\f057';
}

.tumbs {
    .transAllEase(300ms);
    position: absolute;
    right: 0px;
    top: 0px;
    width: 120px;
    height: calc(100% - 0px);
    overflow: hidden;
}

.tumbsC {
    .transAllEase(300ms);
    position: relative;
    display: block;
    margin-top: calc(50vh - 50px);
    width: 120px;
}

.curAlbum {
    .transAllEase(300ms);
    position: relative;
    display: block;
    width: calc(100% - 160px);
    margin-left: 30px;
    height: calc(100% - 60px);
    margin-top: 30px;
    float: left;
}

.curAlbumC {
    .transAllEase(300ms);
    position: absolute;
    display: block;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    z-index: 1;
    background-color: white;
    text-align: center;
}

.curAlbumC img {
    .transAllEase(300ms);
    position: relative;
    background-color: white;
    max-width: 100%;
    max-height: 100%;
    display: block;
    margin: auto;
}

.noOpac {
    .transAllEase(300ms);
    opacity: 0;
}

.fullOpac {
    .transAllEase(300ms);
    opacity: 1;
}

.tumbsC .tmb, .tumbsC .tmb img {
    .transAllEase(300ms);
    display: block;
    margin: 0px;
    opacity: 0.7;
}

.tumbsC .tmb, .tumbsC .tmb img {
    .transAllEase(300ms);
    width: 120px;
    height: auto;
}

.tumbsC .tmb img {
    .transAllEase(300ms);
    width: 118px;
    height: auto;
}

.tumbsC .tbmCur, .tumbsC .tbmCur img {
    .transAllEase(300ms);
    opacity: 1;
}

.tumbsC .tbmCur img {
    .transAllEase(300ms);
    border-left: 2px solid @myCyan;
}

.cirUp, .cirDn {
    .transAllEase(300ms);
    position: absolute;
    width: 60px;
    height: 60px;
    border-radius: 30px 30px;
    border: 1px solid #cccccc;
    top: -10px;
    right: 40px;
    z-index: @zi1007;
    background-color: white;
    color: #666666;
    opacity: 0.8;
    cursor: pointer;
}

.cirUp:hover, .cirDn:hover {
    color: @myCyan;
}

.cirDn {
    .transAllEase(300ms);
    top: unset;
    bottom: -10px;
}

.cirUp:after, .cirDn:after {
    .faws;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 60px;
    height: 60px;
    font-size: 2em;
    line-height: 70px;
    text-align: center;
    content: '\f078';
}

.cirUp:after {
    content: '\f077';
}



@-webkit-keyframes flipInX {
    from {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }

    40% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    60% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1;
    }

    80% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    }

    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }
}

@keyframes flipInX {
    from {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
        opacity: 0;
    }

    40% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    60% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1;
    }

    80% {
        -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    }

    to {
        -webkit-transform: perspective(400px);
        transform: perspective(400px);
    }
}

.flipInX {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: flipInX;
    animation-name: flipInX;
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
}

@-webkit-keyframes rubberBand {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }

    30% {
        -webkit-transform: scale3d(1.25, 0.75, 1);
        transform: scale3d(1.25, 0.75, 1);
    }

    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
        transform: scale3d(0.75, 1.25, 1);
    }

    50% {
        -webkit-transform: scale3d(1.15, 0.85, 1);
        transform: scale3d(1.15, 0.85, 1);
    }

    65% {
        -webkit-transform: scale3d(0.95, 1.05, 1);
        transform: scale3d(0.95, 1.05, 1);
    }

    75% {
        -webkit-transform: scale3d(1.05, 0.95, 1);
        transform: scale3d(1.05, 0.95, 1);
    }

    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes rubberBand {
    from {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }

    30% {
        -webkit-transform: scale3d(1.25, 0.75, 1);
        transform: scale3d(1.25, 0.75, 1);
    }

    40% {
        -webkit-transform: scale3d(0.75, 1.25, 1);
        transform: scale3d(0.75, 1.25, 1);
    }

    50% {
        -webkit-transform: scale3d(1.15, 0.85, 1);
        transform: scale3d(1.15, 0.85, 1);
    }

    65% {
        -webkit-transform: scale3d(0.95, 1.05, 1);
        transform: scale3d(0.95, 1.05, 1);
    }

    75% {
        -webkit-transform: scale3d(1.05, 0.95, 1);
        transform: scale3d(1.05, 0.95, 1);
    }

    to {
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.rubberBand {
    -webkit-animation-name: rubberBand;
    animation-name: rubberBand;
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
}

@-webkit-keyframes fadeInDown {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }

    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
}

@-webkit-keyframes bounceIn {
    from, 20%, 40%, 60%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    0% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }

    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1);
    }

    40% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03);
    }

    80% {
        -webkit-transform: scale3d(0.97, 0.97, 0.97);
        transform: scale3d(0.97, 0.97, 0.97);
    }

    to {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

@keyframes bounceIn {
    from, 20%, 40%, 60%, 80%, to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    0% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }

    20% {
        -webkit-transform: scale3d(1.1, 1.1, 1.1);
        transform: scale3d(1.1, 1.1, 1.1);
    }

    40% {
        -webkit-transform: scale3d(0.9, 0.9, 0.9);
        transform: scale3d(0.9, 0.9, 0.9);
    }

    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03, 1.03, 1.03);
        transform: scale3d(1.03, 1.03, 1.03);
    }

    80% {
        -webkit-transform: scale3d(0.97, 0.97, 0.97);
        transform: scale3d(0.97, 0.97, 0.97);
    }

    to {
        opacity: 1;
        -webkit-transform: scale3d(1, 1, 1);
        transform: scale3d(1, 1, 1);
    }
}

.bounceIn {
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-animation-name: bounceIn;
    animation-name: bounceIn;
}

.gshow1 {
    height: 46px;
    line-height: 30px;
    padding-right: 10px;
    margin-top: 0px;
    .borderRadiusTlTrBlBr(5px,5px,0px,0px);
}

.gshow2 {
    height: auto;
    padding: 10px 50px 10px 50px;
    margin-top: 0px;
    font-size: 1.2em;
    line-height: 35px;
    .borderRadiusTlTrBlBr(0px,0px,5px,5px);
}

.slBoxC {
    .borderRadius(5px);
    box-sizing: border-box;
    position: relative;
    width: calc(100% - 5px);
    height: auto;
    display: block;
    overflow: hidden;
    margin-left: 5px;
    margin-bottom: 10px;
}

.slBoxT {
    box-sizing: border-box;
    position: relative;
    width: 30%;
    min-height: 100%;
    display: block;
    overflow: hidden;
    float: right;
}

.slBoxTx {
    box-sizing: border-box;
    position: absolute;
    width: 100%;
    height: calc(100% - 25px);
    top: 0px;
    left: 0px;
    display: block;
    overflow: hidden;
}

.slBoxTc {
    .backkorda;
    box-sizing: border-box;
    position: absolute;
    width: 100%;
    height: 25px;
    top: calc(100% - 25px);
    left: 0px;
    display: block;
    overflow: hidden;
    color: darkgrey;
    cursor: pointer;
    direction: ltr;
}

.slBoxTc span, .slBoxTc label {
    cursor: pointer;
    font-family: FAS;
    font-size: 1.0em;
    line-height: 25px;
    position: relative;
    display: inline-block;
    width: 25px;
    height: 25px;
}


.slBoxTc span:hover, .slBoxTc label:hover {
    color: cyan;
}

.slBoxP {
    box-sizing: border-box;
    position: relative;
    width: 70%;
    height: auto;
    display: block;
    overflow: hidden;
    direction: ltr;
    padding-right: 3px;
}

.slBoxPi, .slBoxTi {
    box-sizing: border-box;
    position: relative;
    display: table;
    width: 100%;
    height: auto;
    direction: ltr;
    overflow: hidden;
}

.slBoxTi {
    width: 100%;
    height: 100%;
    display: block;
}

.slBoxPi img, .slBoxTi img {
    width: 100%;
    height: auto;
    float: left;
    z-index: 1;
}

.slBoxPi img {
    .transAllEase(300ms);
}

.posAbsI, .posAbsT1, .posAbsT2 {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: auto;
    float: none;
}

.posAbsT1, .posAbsT2 {
    top: 0px;
    height: 50%;
}

.posAbsT2 {
    top: 50%;
}

.slBoxTi img {
    width: 100%;
    height: calc(50% - 3px);
    float: none;
    margin-bottom: 3px;
}

.slBoxCL, .slBoxCR {
    color: lightgray;
}

.slBoxCI {
    color: white;
}

.slBoxCA {
    color: @kordaGreen;
    opacity: 1;
}

.slBoxCPause {
    color: @kordaGreen;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    -webkit-animation-name: fadein;
    animation-name: fadein;
    -webkit-animation-duration: 0.25s;
    animation-duration: 0.25s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

.slBoxPrev, .slBoxNext {
    color: gray;
}

.slBoxCI:hover, .slBoxCA:hover, .slBoxPrev:hover, .slBoxNext:hover {
    color: cyan;
}

.slBoxCL:after, .slBoxCR:after, .slBoxCI:after, .slBoxCA:after, .slBoxCPause:after, .slBoxPrev:after, .slBoxNext:after {
    font-family: FAS;
    content: '\f137';
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}

.slBoxPrev:after {
    content: '\f100';
    font-size: 1.6em;
}

.slBoxNext:after {
    content: '\f101';
    font-size: 1.6em;
}

.slBoxCR:after {
    content: '\f138';
}

.slBoxCI:after {
    content: '\f111';
}

.slBoxCPause:after {
    content: '\f28b';
}

.noAnimI, .noAnimT {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -o-transition: none !important;
    transition: none !important;
    z-index: 0;
    left: -100%;
}

.noAnimT {
    left: 0px;
    top: 100%;
}

.outImgI {
    left: 100%;
}

.outImgT {
    position: absolute;
    top: -50%;
    left: 0px;
}

@media screen and (max-width:1920px) {
    .showCl4 {
        width: calc(18% - 20px);
    }
}

@media screen and (max-width:1600px) {
    .showCl4 {
        width: calc(18% - 20px);
    }
}

@media screen and (max-width:1440px) {
    .showCl4 {
        width: calc(25% - 20px);
    }


    .gg1C {
        height: 180px;
    }

    .fbox {
        height: 490px;
    }
}

@media screen and (max-width:1280px) {
    .favg {
        min-height: 250px;
        width: calc(50% - 25px);
        float: right;
    }

    .favg a img {
        width: 186px;
        height: 186px;
    }

    .favg a .cn {
        margin-top: 20px;
        width: calc(100% - 195px);
    }

    .favg a .cn p {
        font-size: 1.1em;
        min-height: 40px;
        line-height: 25px;
        margin-bottom: 10px;
    }

    .favg a .cn span {
        font-size: 0.9em;
        line-height: 17px;
    }

    .favg a .cn label {
        font-size: 1.1em;
        line-height: 20px;
    }

    .favg .rem {
        position: absolute;
        font-size: 0.8em;
        line-height: 15px;
        height: 15px;
        width: 140px;
    }

    .favg .rem::before {
        width: 20px;
        line-height: 15px;
        height: 15px;
    }

    .gTitleL {
        .basics;
        .effect7;
        position: relative;
        top: -20px;
        width: calc(100% - 80px);
        background-color: @backcolor2;
        line-height: 30px;
        display: block;
        color: @gTitleColor;
        padding: 0px 5px 0px 5px;
        font-size: 1.2em;
    }

    .gSep {
        display: none;
    }

    .col2 {
        width: 40%;
    }

    .col4 {
        width: 58%;
        display: flex;
        flex-direction: column;
    }

    .col4r {
        order: 1;
        width: 100%;
    }

    .col4l {
        order: 2;
        width: 100%;
    }
}

@media screen and (max-width:1200px) {
    .goodsNav a, .goodsNav p {
        font-weight: normal;
    }

    .rBar {
        height: 35px;
    }

    .rBar:last-of-type {
        height: 40px;
    }

    .rBar span {
        display: block;
        float: none;
    }

    .rBar .rBarB {
        width: calc(100% - 120px);
    }

    .showCl4 {
        width: calc(33.333333% - 25px);
    }

    .loffersC {
        width: calc(100% - 23px);
        margin-right: 23px;
        font-size: 1.0em;
    }

    .loffers {
        position: absolute;
        top: 0px;
        left: calc(27px - 30% );
        bottom: 0px;
        width: 30%;
        text-align: right;
        z-index: 99;
    }

    .loffers:hover, .loffers_hover {
        left: 0px;
    }

    .roffers {
        position: absolute;
        top: 0px;
        left: 27px;
        bottom: 0px;
        width: calc(100% - 27px);
        z-index: 98;
    }

    .gOfferC {
        width: 100%;
    }

    .fbox ul li, .fbox ul li ul li {
        width: auto;
    }

    .fbox {
        font-size: 0.9em;
    }

    .searchBox {
        width: 350px;
        right: calc(50% - 382px);
    }
}

@media screen and (max-width:1080px) {
    html {
        min-width: unset;
    }


    .articlesD {
        display: none;
    }

    .favg {
        min-height: 250px;
        width: calc(100% - 25px);
        float: none;
    }

    .favg a img {
        width: 256px;
        height: 256px;
    }

    .favg a .cn {
        margin-top: 20px;
        width: calc(100% - 270px);
    }

    .allAs a img {
        display: block;
        float: none;
        clear: both;
        margin: 0 auto;
    }

    .allAs a p {
        text-align: center;
        margin: 10px;
    }



    .showCl4 {
        width: calc(50% - 25px);
    }

    .mainNavMenu::after {
        .faws;
        position: absolute;
        top: 0px;
        right: 10px;
        color: @links2-color;
        width: 47px;
        height: 47px;
        line-height: 47px;
        content: "\f0c9";
        cursor: pointer;
        font-size: 2.2em;
    }

    .condiDispNone {
        padding-top: 20px;
        display: none;
    }

    .mainNavNavs {
        padding-top: 20px;
    }

    .mainNav a {
        width: 150px;
        display: block;
    }

    .menuL0 {
        display: block;
        flex-wrap: unset;
        width: 200px;
        box-sizing: border-box;
    }

    .menuL0 ul, .menuL0 li, .menuL0 li p {
        display: block;
    }

    .goodsNav {
        display: none;
    }

    .gg1C {
        display: none;
    }

    .fboxC img {
        display: none;
    }

    .fbox {
        display: none;
        height: 100%;
        width: 100%;
    }

    .fbox ul li, .fbox ul li ul li {
        height: 25px;
        line-height: 25px !important;
    }

    .uAreaU { /*width:270px;*/
    }

    .searchBox {
        width: calc(100% - 120px);
        right: 115px;
    }

    .uAreaX {
        display: block;
        height: 47px;
        padding-top: 5px;
        top: 0px;
        /*width:190px;*/
    }

    .uAreaU {
        display: none;
    }

    .cartM, .bookmarksM, .loginNav, .idealGallery, .idealHelp {
        font-size: 0.8em;
    }

    .cartM {
        padding-left: 30px;
        padding-right: 30px;
        min-width: 70px;
        height: 38px;
    }

    .cartM::before {
        width: 32px;
        height: 32px;
    }

    .cartM::after {
        width: 26px;
        height: 26px;
        top: 4px;
        line-height: 26px;
        .borderRadius(13px);
    }

    .cartM:after, .bookmarksM:after, .loginNav:after, .idealGallery:after, .idealHelp:after {
        color: white;
    }

    .logo {
        z-index: @zi1006;
    }

    .logo, .logo a, .logo a img {
        width: 90px;
        height: 90px;
        max-height: 90px;
        max-width: 90px;
    }
}

@media screen and (max-width:1020px) {
    .slBoxT {
        display: none;
    }

    .slBoxP {
        width: 100%;
    }

    .divBody {
        width: 100%;
        height: auto;
    }

    .notiLertC {
        height: 340px;
        top: calc(50% - 170px);
    }

    .notiLertC p {
        height: 200px;
    }

    .col2 {
        width: 50%;
    }

    .col3 {
        width: 50%;
    }

    .col3:last-of-type {
        margin-left: 25%;
        margin-right: 25%;
    }

    .col4 {
        width: 48%;
    }

    .showOrder .clFloat .itemsTitle {
        margin-top: 20px;
        height: 20px;
        line-height: 20px;
    }

    .clFloat {
        float: right;
    }

    .showRes {
        display: none;
    }

    .showCl4 {
        width: calc(50% - 35px);
    }

    .showCl4 a {
        font-size: 1.0em;
    }

    .showOrder .items {
        font-size: 1.1em;
    }

    .loffersC {
        width: calc(100% - 23px);
        margin-right: 23px;
        font-size: 1.0em;
    }

    .loffers {
        left: calc(27px - 40% );
        width: 40%;
    }

    .loffers:hover, .loffers_hover {
        left: 0px;
    }

    .offerSP {
        top: 5px;
        width: calc(100% - 20px);
    }

    .offerPrice {
        top: 30px;
        width: calc(100% - 20px);
    }


    .offerDetail {
        position: absolute;
        top: 160px;
        right: 15px;
        width: calc(50% - 50px);
        height: 210px;
        line-height: 25px;
        text-align: right;
        overflow: hidden;
    }

    .offerImg {
        top: 80px;
        left: 20px;
        max-width: calc(50% - 40px);
        height: calc(100% - 85px);
    }

    .offerImg img {
        width: auto;
        height: 100%;
    }

    .offerGTitle {
        top: 80px;
        right: 20px;
        height: 50px;
        line-height: 25px;
        text-align: right;
    }

    .offerR {
        top: 313px;
        left: 10px;
        right: unset;
        height: 70px;
        width: 230px;
        white-space: nowrap;
    }
}


@media screen and (max-width:880px) {
    .mainNavMenu::after {
        right: 10px;
    }

    .cm2 {
        width: calc(100% - 20px);
        float: none;
    }

    .cm2Cr {
        width: calc(100% - 20px);
        margin-right: 10px;
    }


    .showCl4 {
        width: calc(100% - 35px);
    }

    .showCl4 a {
        white-space: normal;
        overflow: visible;
        text-overflow: unset;
    }

    .showOrder .clFloat {
        direction: rtl;
        text-align: center;
    }

    .showOrder .clFloat .items, .showOrder .clFloat .itemsTitle {
        font-size: 0.70em;
    }

    .logoM {
        max-width: 90px;
        max-height: 90px;
    }

    .logoM a {
        max-width: 90px;
        width: 90px;
    }

    .logoM a img {
        max-width: 90px;
        width: 90px;
    }

    .searchBox {
        right: 100px;
        width: calc(100% - 105px);
    }

    .menuResp > h1 {
        right: 10px;
    }

    .goodsNavC {
        right: 0px;
        width: 100%;
    }
}

@media screen and (max-width:800px) {
    .gshow2 {
        padding: 10px;
    }

    .allAs a img {
        width: 200px;
    }

    .gImage {
        display: block;
        text-align: center;
    }

    .gbarGood {
        display: flex;
        flex-direction: column;
    }

    .col2 {
        width: 100%;
        order: 1;
    }

    .col3 {
        width: 100%;
    }

    .col3:last-of-type {
        margin-left: unset;
        margin-right: unset;
    }

    .col4 {
        width: 100%;
        order: 2;
    }

    .xMbar {
        margin-left: 5px;
        margin-right: 5px;
        width: calc(100% - 10px);
    }

    .offerGTitle {
        top: 80px;
        width: calc(100% - 60px);
        right: 30px;
    }

    .offerDetail {
        display: none;
    }

    .loffers {
        left: calc(27px - 75% );
        width: 75%;
    }

    .loffers:hover, .loffers_hover {
        left: 0px;
    }

    .offerImg {
        top: 140px;
        height: calc(100% - 190px);
        max-width: calc(100% - 40px);
        width: calc(100% - 40px);
    }

    .offerImg img {
        margin: 0 auto;
    }

    .offerR {
        transform: scale(0.8);
        top: 320px;
        left: 10px;
        width: calc( 100% - 20px);
        text-align: center;
    }

    .offerRT, .offerRC {
        text-align: center;
    }

    .rC {
        width: 45%;
    }

    .lC {
        width: 55%;
    }

    .og {
        width: 90%;
        max-width: 300px;
        height: 340px;
    }

    .options {
        height: auto;
    }

    .optionsCen {
    }

    .options a {
        width: 200px;
        text-align: right;
    }

    .options .sp {
        display: block;
        clear: both;
    }

    .showOrder .clFloat .items, .showOrder .clFloat .itemsTitle {
        font-size: 0.62em;
    }
}





@media screen and (max-width:720px) {
    .favg a img {
        width: 186px;
        height: 186px;
    }

    .favg a .cn {
        margin-top: 20px;
        width: calc(100% - 195px);
    }

    .showOrder .clFloat .items, .showOrder .clFloat .itemsTitle {
        font-size: 0.80em;
    }

    .xUbar {
        margin-left: 5px;
        margin-right: 5px;
        width: calc(100% - 10px);
    }



    .xxx {
        max-height: 32px;
        overflow: hidden;
    }


    .showCl4 {
        width: calc(50% - 35px);
    }

    h1 {
        font-size: 1.1em;
    }

    h1 {
        font-size: 1.0em;
    }
}

@media screen and (max-width:600px) {
    .slBoxC {
        width: calc(100% - 10px);
        margin-right: 5px;
    }

    .notiLertC {
        height: 390px;
        top: calc(50% - 195px);
    }

    .notiLertC p {
        font-size: 0.8em;
        height: 250px;
    }

    #favBoxC, #cartBoxC, #saveBoxC {
        width: 100%;
    }

    .favg {
        height: auto;
    }

    .favg a img {
        width: 256px;
        height: 256px;
        display: block;
        float: none;
        margin: 5px auto;
    }

    .favg a {
        position: relative;
        height: auto;
        text-align: center;
        margin-bottom: 30px;
    }

    .favg a .cn {
        position: relative;
        margin-top: 20px;
        width: calc(100% - 20px);
        float: none;
        display: block;
        height: auto;
    }

    .favg .rem {
        left: 30px;
        text-align: center;
        width: calc(100% - 40px);
    }

    .rCH {
        display: none;
    }

    .xAbar {
        width: calc(100% - 0px);
        margin: 15px -10px 0px 15px;
    }

    .gspecifications, .gusersreview, .gpricehistory {
        font-size: 1.0em;
    }

    .showCl4 {
        width: calc(100% - 35px);
    }

    .gOffer {
        .basics;
        width: calc(100% - 10px);
        height: 385px;
        overflow: hidden;
        margin-left: 5px;
        margin-right: 5px;
    }

    .rC {
        width: 100%;
        margin: 0px;
        float: none;
        padding: 0px;
        max-width: unset;
    }

    .lC {
        position: relative;
        .fullWidth;
        text-align: center;
        float: none;
    }

    .lCAs {
        .basics;
        .effect8;
        box-sizing: border-box;
        padding: 10px;
        text-align: justify;
        margin: 0px 0px 0px 5px;
        width: calc(100% - 5px);
    }

    .g {
        position: relative;
        text-align: center;
        width: calc(100% - 10px);
        margin-left: 5px;
        margin-right: 5px;
    }



    .xTbar .g {
        margin-right: 0px;
        margin-left: 0px;
        width: 100%;
    }

    .xUbar .g {
        margin-right: 0px;
        margin-left: 0px;
        width: 100%;
    }

    .xMbar .g {
        margin-right: 0px;
        margin-left: 0px;
        width: calc(100% - 0px);
    }

    .gTemp {
        margin-left: 20px;
        margin-right: 20px;
    }

    .og {
        margin: 0px;
        float: none;
        padding: 20px;
    }

    .options {
        line-height: 20px;
        padding-top: 10px;
    }

    .options a {
        width: 110px;
        font-size: 0.9em;
        line-height: 20px;
    }

    .options .sp {
        display: block;
        clear: both;
    }

    .options p {
        font-size: 1.3em;
        line-height: 20px;
        height: 30px;
        color: @options_tcolor;
        float: right;
        padding-left: 5px;
        width: 35px;
    }

    .logo {
        transform: scale(0.9);
    }

    .logoM {
        transform: scale(1);
    }

    .logoM, .logoM a, .logoM a img {
        max-width: 70px;
        max-height: 70px;
    }

    .searchBox {
        left: calc(80px + @logoRight );
    }



    h1 {
        font-size: 1.0em;
    }

    h1 {
        font-size: 0.9em;
    }

    .gTitleL {
        font-size: 1.0em;
        overflow: hidden;
    }

    .gTitle {
        font-size: 1.0em;
    }

    .gbar {
        font-size: 0.9em;
    }

    .w100 table {
        width: 100%;
    }

    .w100 table th, .w100 table td {
        width: 50%;
        white-space: normal;
        font-size: 1.0em;
    }

    .w100 table td {
        font-size: 0.9em;
    }
}



@media screen and (max-width:500px) {
    .showSearchBox {
        width: calc(100% - 20px);
    }

    .cThread .btnV {
        display: block;
        margin-bottom: 5px;
    }
}

@media screen and (max-width:440px) {
    .mainNavMenu::after {
        right: 10px;
    }

    #loginBoxC, #registerBoxC, .profileBoxC, .headerNotificationC {
        width: 100%;
    }

    .gSepN {
        display: block;
        height: 10px;
    }

    #divDiscountT {
        margin-right: 0px;
    }

    .gspecifications, .gusersreview, .gpricehistory {
        font-size: 0.8em;
        padding: 0px 3px 0px 3px;
    }

    .gspecifications::before, .gpricehistory::before, .gusersreview::before {
        font-size: 1.2em;
        margin-left: 5px;
    }

    .uArea .logo {
        display: none;
    }

    .searchBox {
        right: 7px;
        width: calc(100% - 12px);
    }



    .showOrder .clFloat .items, .showOrder .clFloat .itemsTitle {
        font-size: 0.70em;
    }

    .uAreaX .idealGallery, .uAreaX .idealHelp {
        display: none;
    }
}

@media screen and (max-width:380px) {
    .menuResp > h1 {
        font-size: 0.75em;
    }

    .showOrder .clFloat .items, .showOrder .clFloat .itemsTitle {
        font-size: 0.60em;
        padding-left: 0px;
    }

    .options a {
        width: 95px;
        font-size: 0.8em;
    }

    .options p {
        font-size: 1.2em;
        line-height: 20px;
        height: 30px;
        color: @options_tcolor;
        float: right;
        padding-left: 5px;
        width: 25px;
    }
}


.EngNum, em, em * {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-family: IRANSans;
    direction: ltr;
    font-style: italic !important;
}

.EngNum + label {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    direction: ltr;
}

.EngNum2, .EngNum2 ~ *, .EngNum2 * {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    direction: ltr;
}

.FTahomax {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}

.FTahomax span, .FTahomax p, .FTahomax div, .FTahomax div span, .FTahomax div span span, .FTahomax span span, .FTahomax ul, .FTahomax li {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}

.goodsNavDeactive a {
    .shadow2;
    font-size: 1.1em;
    color: white;
}

.rtlImp {
    direction: rtl !important;
    width: 100%;
    height: 100%;
}

.dispBlock {
    left: 10px;
    display: block;
    background-color: transparent;
}

.notiYes, .notiNo, .btnvEnter {
    width: 300px;
    clear: none;
}

.btnVIL {
    display: inline-block;
}

.registerColor {
    color: #808080;
}

.registerFontW {
    font-weight: 900 !important;
}

.clInlineB {
    display: inline-block;
}

.w110 {
    width: 110px;
}

.w240 {
    width: 240px;
}

.w120 {
    width: 120px;
}

.w90p {
    width: 90%;
}

.w100-10p {
    width: calc(100% - 10px);
}

.w100-40p {
    width: calc(100% - 40px);
}

.tbRPassword1, .tbRPassword2, .tbRFirstName, .tbRLastName {
    display: inline-block;
}

.tbRDay {
    margin-right: 3px;
}

.taCenter {
    text-align: center;
}

.taRight {
    text-align: right;
}

.greenFAR {
    font-family: FAR;
    font-size: 20px;
    color: green;
}

.redFAS {
    font-family: FAS;
    font-size: 17px;
    color: red;
}

.colorGreen {
    color: green;
}

.colorRed {
    color: red;
}

.colorGray {
    color: #333;
}

.changepassBTNV {
    width: calc(100% - 10px);
    display: block;
    clear: both;
}

.marginTop40 {
    margin-top: 40px;
}

.marginTop10 {
    margin-top: 10px;
}

.marginTop20 {
    margin-top: 20px;
}


.lh10 {
    line-height: 10px;
}

.rtl {
    direction: rtl;
}

.ltr {
    direction: ltr;
}

.padL30 {
    padding-left: 30px;
}

.gbarFlex {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.vAlignTop {
    vertical-align: top;
}


.fontS13 {
    font-size: 13px;
}

.fontS1p1em {
    font-size: 1.1em
}

.hAuto {
    height: auto;
}

.margin0Auto {
    margin: 0 auto;
}

#gbardet {
    height: auto;
    padding: 10px;
    margin-top: -1px;
    border-top: 0px;
    overflow: hidden;
    padding: 0px;
    display: block;
}

#priceChart {
    height: 500px;
    direction: ltr;
    text-align: left;
}

.gshow2 u {
    text-decoration-color: @cart-lcolor;
}

.gshow2 u {
    text-decoration-color: @cart-lcolor;
}

.gshow2 blockquote {
    color: #0095ff;
    font-size: 1.05em;
    font-style: italic;
}

.fixBot, .fixBotLx {
    position: fixed;
    top: 0px;
}

.fixBotL, .fixBotLx {
    right: unset;
}

.xToolbC {
    display: block;
    position: relative;
    width: 100%;
    height: 40px;
    box-sizing: border-box;
    background-color: #264bb1;
}

.xToolb {
    display: block;
    position: relative;
    width: 100%;
    height: 60px;
    top: 0px;
    left: 0px;
    margin: 0 auto;
    max-width: 1600px;
    box-sizing: border-box;
    background-color: #264bb1;
}

.stickyH2 {
    position: fixed;
    top: 47px;
    width: 100%;
    z-index: 9999960;
    .fadeInDown;
}

.showCl4 .hlnk {
    width: 90%;
    height: 1px;
    left: 0px;
    top: 0px;
    position: absolute;
    display: block;
}

.fadeIn {
    animation-name: fi;
    animation-duration: 0.85s;
    animation-iteration-count: 1;
}

.fadeOutIn {
    animation-name: foi;
    animation-duration: 0.55s;
    animation-iteration-count: 1;
}

.fadeOut {
    animation-name: fo;
    animation-duration: 0.45s;
    animation-iteration-count: 1;
}

.dNo {
    display: none;
}

.dBlock {
    display: block;
}