@charset "utf-8";
/*Eric Meyer's*/
html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{margin:0; line-height: 0;}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block;}
audio,canvas,progress,video{display:inline-block; vertical-align:baseline}
audio:not([controls]){display:none;height:0}
[hidden],template{display:none}
a{background-color:transparent; transition:linear .2s;}
a:active,a:hover{outline:0;}
abbr[title]{border-bottom:1px dotted}
b,strong{font-weight:bold}
dfn{font-style:italic}
h1{font-size:2em;margin:0.67em 0}
mark{background:#ff0;color:#000}
small{font-size:80%}
sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sup{top:-0.5em}sub{bottom:-0.25em}
img{border:0}
svg:not(:root){overflow:hidden}
figure{margin:1em 40px}
hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}
pre{overflow:auto}
code,kbd,pre,samp{font-family:monospace, monospace;font-size:1em}
button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}
button{overflow:visible}
button,select{text-transform:none}
button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}
button[disabled],html input[disabled]{cursor:default}
button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}
input{line-height:normal}
input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}
input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}
input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}
input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}
fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}
form{margin:0;}
legend{border:0;padding:0}
textarea{overflow:auto}
optgroup{font-weight:bold}
table{border-collapse:collapse;border-spacing:0;}
td,th,ol,ul,li{padding:0; margin:0;}
ul,ol{padding-right:20px;}
p{margin:0;}
h1,h2,h3{font-weight:normal; padding:0px; margin:0;}
textarea, input[type="text"], input[type="button"], input[type="submit"] { -webkit-appearance: none; border-radius: 0; }


@font-face{
	font-family: 'Samim';
    src: url('includes/fonts/Samim.eot');
    src: url('includes/fonts/Samim.eot?#iefix') format('embedded-opentype'),
		 url('includes/fonts/Samim.woff') format('woff'),
		 url('includes/fonts/Samim.ttf') format('truetype');
	font-weight: normal;
	}
@font-face{
    font-family: 'SamimBold';
    src: url('includes/fonts/Samim-Bold.eot');
    src: url('includes/fonts/Samim-Bold.eot?#iefix') format('embedded-opentype'),
		 url('includes/fonts/Samim-Bold.woff') format('woff'),
		 url('includes/fonts/Samim-Bold.ttf') format('truetype');
	font-weight: bold;
	}

::-moz-selection{background:rgba(0,0,0,0.1)}
* {
    box-sizing: border-box;
}
*:focus,
*:active,
a:active,
a:focus,
input:focus,
input:active { 
    -moz-outline-style: none;
	outline:none;
	outline: 0;
}
/* light blue at 80% opacity */
html {
    -webkit-tap-highlight-color: transparent;
}

/***** hide input number spinner ****/
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  direction:rtl !important;
  text-align:right;
  font-size: 14px;
}
::-moz-placeholder { /* Firefox 19+ */
  direction:rtl !important;
  text-align:right;
  font-size: 14px;
}
:-ms-input-placeholder { /* IE 10+ */
  direction:rtl !important;
  text-align:right;
  font-size: 14px;
}
:-moz-placeholder { /* Firefox 18- */
  direction:rtl !important;
  text-align:right;
  font-size: 14px;
}

a{text-decoration:none; transition:all linear 0.2s;}
b, strong{font-family:'samimBold'; font-weight:normal;}
.ltr, .ltext{ direction: ltr; display: inline-block !important;}

/* Default CSS */
.drtl{direction:rtl;}.dltr{direction:ltr;}.FloatR{float:right;}.FloatL{float:left;}
.clr, .clear{clear:both;}.Tright{text-align:right;}.Tleft{text-align:left}.Tjustify{text-align:justify;}.Tcenter{text-align:center;}
.Ared{color:#A70000;} .Agreen{color:#0b9b36;} .Aorange{color:#f7941e;} .Ablue{ color: #2d97b7;}

html, body{ width:100%; height:100%; padding:0; margin:0;}
html{ overflow-x: hidden;}
body{ direction:rtl; font-size:15px; font-family:'samim'; line-height:27px; color:#1B1B1B;}
.main{max-width:1350px; margin:auto; display:block; padding:0 15px;}
.main_panel{max-width:900px; margin:0; display:block;}
.flexbox{ display:flex; display:-webkit-flex; display:-ms-flexbox; flex-wrap:wrap;} 
.c_align{ align-items: center;}
.end_align{ align-items: flex-end;}
.more{ padding: 7px 15px; margin: 20px auto; background: transparent; color: #048f96; font-family: "samimBold"; font-size: 14px; line-height: 24px; text-align: center; border: 1px solid #048f96; border-radius: 5px; display: inline-block; transition: all linear 0.2s; cursor: pointer;}
.more:hover{ background: #048f96; color: #fff;}
.more i{ padding-right: 8px; transition: all linear 0.2s;}
.more .fa-shopping-bag{ padding: 0 0 0 5px !important;}
.more:hover i{ color: #fff !important;}
.more2{ background: #048f96; color: #fff;}
.more2:hover{ background: transparent; color: #048f96;}
.more2:hover i{ color: #048f96 !important;}
@media only screen and (max-width:1024px){
	.more{ padding: 10px 15px !important; background: #048f96; color: #fff;}
	.more:hover{ opacity: 1;}
    .more2:hover{ background: #048f96; color: #fff;}
	.more2:hover i{ color: #fff !important;}
}
#hide_overflow { position: relative; overflow: hidden;}
.scroll{ width: 100%; overflow:hidden;}
.title{ margin-bottom: 15px; font-family: "samimBold"; font-size: 18px; line-height: 30px; display: block;}
.mrg_bt{ margin-bottom: 0 !important;}

/******************************************** header ***************************************/
header{ position: relative; z-index: 1000;}
#fix_box{ background: #fff;}
#middle{ max-height: 106px; padding: 20px 0; background: #85d8d0;; transition: all linear .2s;}
#middle > .flexbox{ align-items: center;}
#middle .logo{ margin-left: 20px; display: block;}
#middle .logo img{ max-width: 83px; width: 100%!important; height: inherit!important; display: block;}
#middle form, #LeftBox form{ max-width: 100%; width: 350px; height: 37px; position: relative;}
#middle form input,#LeftBox form input{ width: 100%; height: 100%; line-height: 50px; padding: 0 55px 0 10px; background: transparent; color: #555; font-size: 14px; border: 1px solid #1b1b1b; border-radius: 50px; transition: all linear 0.3s;}
#middle form input:focus,#LeftBox form input:focus{ border-color: #919191;}
#middle form input::placeholder,#LeftBox form input::placeholder{ color: #333 !important; font-size: 12px !important;}
#middle form button,#LeftBox form button{ width: 50px; height: 100%; line-height: 40px; background: transparent; position: absolute; right: 0; top: 0; border: none; border-radius: 0 50px 50px 0;}
#middle form button:hover i,#LeftBox form button:hover i{ opacity: 0.6; transition: all linear 0.2s;}
#middle form button i,#LeftBox form button i{ color: #1b1b1b; font-size: 18px; transition: all linear 0.2s;}
#LeftBox form{ width: 300px; margin-bottom: 25px;}
#phone{ margin-right: auto; font-size: 13px;}
#phone a{ color: #1B1B1B; display: block;}
#phone a i{ margin-right: 8px; color: #1B1B1B; font-size: 13px; transform: rotate(110deg);}
#phone a b{ font-size: 15px;}
#phone span{ color: #1B1B1B;}

#bt_head{ background: #fafafa; -webkit-box-shadow: rgba(0,0,0,.04) 0 7px 8px 0; box-shadow: 0 7px 8px 0 rgba(0,0,0,.04);}
#bt_head .main{ position: relative;}
#menu{ transition: all linear .2s;}
#menu nav ul{ padding: 0; margin: 0; font-size: 0;}
#menu nav ul{ font-size: 14px;}
#menu nav > ul > li{ font-family: "samimBold"; font-size: 13px; display: inline-block;}
#menu nav ul li a{ color: #333; display: block;}
#menu nav > ul > li > a{ padding: 11px 20px;}
#menu nav > ul > li .open_li{ padding: 17px 20px; color: #1cbfc8; position: absolute; left: 0; top: 0; font-size: 17px; display: none;}
#menu nav > ul > li .i_down{ margin-right: 8px; color:#c7c7c7; font-size: 16px; position: relative; top: 5px;}
#menu nav > ul > li .mode{ padding-left: 2px; color: #555; font-size: 10px;}
#menu nav > ul > li span{ position: relative; display: inline-block;}
#menu nav > ul > li span:before, #menu nav > ul > li.active span:before{ content: ""; width: 100%; height: 2px; background: #1cbfc8; position: absolute; bottom: -10px; opacity: 0; visibility: hidden; transition: all linear 0.2s;}
#menu nav > ul > li.active span:before, #menu nav > ul > li:hover > a span:before{ visibility: visible; opacity: 1;}
#menu nav ul ul{ width: Calc(100% - 30px); padding: 20px; margin: auto; background: #fff; position: absolute; top: Calc(100% + 30px); right: 0; left: 0; box-shadow: 2px 5px 8px 0px rgba(0, 0, 0, 0.1); opacity: 0; visibility: hidden; transition: all linear 0.2s; z-index: 500;}
#menu nav > ul > li:hover > ul{ top: 100%; opacity: 1; visibility: visible;}

#menu nav ul ul li{ width: 17%; padding: 0 10px; font-family: "samim"; font-size: 13px; display: block;}
#menu nav ul ul li:last-child{ width: 32%; padding-left: 0; margin-right: auto; border: none;}
#menu nav ul ul li a{ padding: 0 5px;}
#menu nav ul ul li a:hover{ color: #048f96;}
#menu nav ul ul li img{ width: 100%; max-width: 450px; height: inherit !important; margin: auto; background: #f4f4f4; display: block;}
#menu nav .cat_b{ color: #1b1b1b; font-size: 14px; font-family: "samimBold";}

.add_alert, #after_login{ width: 100%; height: 100%; padding: 0 15px; background: rgba(0,0,0,0.4); position: fixed; left: 0; right: 0; top: 0; bottom: 0; display: none; z-index: 10000;} 
.add_alert > div{ max-width: 400px; width: 90%; padding: 30px 10px; font-family: "samimBold"; text-align: center; background: #fff; position: absolute; left: 0; right: 0; margin: auto; top: 50%; transform: translateY(-50%);}
.add_alert .shopping{ margin: 0 5px 10px; font-size: 40px; color: #048f96;}
.add_alert .check{ width: 25px; height: 25px; line-height: 25px; background: #15c215; color: #fff; position: absolute; top: 23px; right: 43%; font-size: 14px; border-radius: 100%; text-align: center; animation: check 0.7s linear ;}
.add_alert .fa-times{ padding: 15px 20px; font-size: 30px; color: gray; position: absolute; left: 0; top: 0; cursor: pointer; transition: all linear 0.2s;}
.add_alert .fa-times:hover{ opacity: .7;}
#after_login{ background: rgba(0,0,0,0.8); display: block;}
#after_login > .flexbox{ height: 100%; align-items: center; justify-content: center;}
#after_login > .flexbox > div{ padding: 20px; margin-bottom: 20px; background: #fff; color: #000; font-size: 22px; line-height: 35px; font-family: samimBold; text-align: center; border-radius: 5px;}
#after_login > .flexbox .more{ margin-bottom: 0;}
@media only screen and (max-width:768px){
	#after_login > .flexbox{ height: 100%; align-items: flex-end;} 
}
@keyframes check{
  from { right: 0; opacity: 0}
  to { right: 43%; opacity: 1}
}

#userbox{ margin-right: auto;} 
#userbox .head_icons{ width: 100%; padding: 0; color: #1cbfc8; font-size: 18px; vertical-align: middle; cursor: pointer;}
#basket{ width: 50px; height: 49px; position: relative; text-align: center; border: 1px solid transparent; cursor: pointer; display: flex; align-items: center;}
#basket .num_pro{ width: 17px; height: 17px; line-height: 18px; text-align: center; background: #333; color: #fff; position: absolute; right: 6px; top: 5px; font-family: "samimBold"; font-size: 12px; border-radius: 50%;}
#cartbox{ max-width: 300px; width: 100%; padding: 10px; background: #fff; position: absolute; top : 100%; left: 15px; border: 1px solid #ddd; display: none; z-index: 1000;}
.view, .view1, .view2{ background: #fff; border: 1px solid #ddd !important; border-bottom: none !important; transition: all linear 0.5s;}
#cartbox:after, #login.view1:after, #hide_srch:after{ content: ""; width: 48px; height: 2px; background: #fff; position: absolute; left:0; top: -1px; display: block;}
#res_search{ position: relative; display: none;}
#res_search .src_icon{ width: 60px; line-height: 48px; color: #1cbfc8; font-size: 25px; text-align: center; border: 1px solid transparent; border-bottom: none; cursor: pointer;}
#hide_srch{ width: Calc(100% - 30px); margin: auto; position: absolute; top: 49px; left: 0; right: 0; background: #fff; text-align: left; border: 1px solid #ddd; display: none;}
#hide_srch:after{ width: 58px;}
#hide_srch input{ width: 100%; padding: 10px 15px 10px 70px; border: none;}
#hide_srch button{ width: 60px; height: 100%; background: transparent; color: #1cbfc8; position: absolute; left: 0; top: 0; font-size: 18px; border: none;}
.logo_res{ display: none;}
.logo_res img{ width: 65px !important; height: inherit!important; display: block;}

#login{ width:auto; height: 49px; padding: 0 15px; position: relative; text-align: center; border: 1px solid transparent; display: flex; align-items: center;}
#login.view1:after{ width: 100%; top: Calc(100% - 1px); z-index: 1000;}
#login .head_icons{ width: auto; padding: 0; }
#login ul{ min-width: 250px; padding: 0; margin: 0; background: #fff; font-size: 0; text-align: right; position: absolute; top : 100%; left: -1px; border: 1px solid #ddd; display: none; z-index: 1000;}
#login ul li{ font-size: 13px; display: block;}
#login ul li a{ padding: 8px 25px; color: #333; font-family: samim; display: block; position: relative;}  
#login ul li a:hover{ background: #f4f4f4;}
#login ul li a:after{ content: ""; width: Calc(100% - 30px); height: 1px; margin: auto; border-top: 1px solid #eee; position: absolute; left: 0; right: 0; bottom: 0;}
#login ul li a i{ color: #1cbfc8;}
#login ul li:last-child a:after{ display: none;}
#login ul li a i{ margin-left: 3px; vertical-align: middle;}
.log_txt{ padding: 0 5px 0 0; color: #048f96; font-family: "samimBold"; font-size: 13px; cursor: pointer;}

#login .user_li img{ width: 30px; border: 1px solid #333; border-radius: 100%; display: block;}
#login .user_li .user_info{ width: 100%; margin-right: auto;}
.user_info .user_name{ font-family: "samimBold"; font-size: 15px; line-height: 21px;}
.user_info .user_link{ font-size: 12px; line-height: 20px; color: #048f96;}
#login .user_li a{ display: flex;}

.cost_process{ margin: 30px 0; position: relative;}
.cost_process ul{ height: 4px; padding: 0; margin: 0; font-size: 0; background: #ddd;}
.cost_process ul li{ width: 50%; height: 100%; display: inline-block; vertical-align: top; position: relative;}
.cost_process ul i{ color: #ddd; font-size: 12px; position: absolute; top: -4px; right: -2px; z-index: 10;}
.cost_process ul i.c_left{ left:-2px; right: inherit;}
.cost_process ul li:last-child i{ left: -2px; right: inherit;}
.cost_process .active{ background: #048f96;}
.cost_process .active i{ color: #048f96;}
.cost_process .c_min, .cost_process .c_max{ font-size: 12px; position: absolute; right: 0; display: block;}
.cost_process .c_max{ left: 0; right: inherit;}
.cost_process .bike{ font-size: 12px; line-height: 18px; position: absolute; top: -25px; right: 50%; transform: translatex(50%); white-space: nowrap; display: inline-block;}
.cost_process .bike i{ margin-right: 5px; color: #048f96; font-size: 28px; vertical-align: middle; -webkit-transform: scaleX(-1); transform: scaleX(-1); position: relative; top: 1px;}

.cart_rows{ padding: 10px 0; border-bottom: 1px solid #f0f0f1;}
#cart_list .cart_rows:last-child{ border: none;}
.rows_info .row_img{ width: 75px; display: block;}
.rows_info .row_img img{ width: 100% !important; height: inherit !important; display: block;}
.rows_info .info_row{ width: Calc(100% - 80px); margin-right: auto;}
.rows_info h3 a{ color: #333; font-family: "samim"; font-size: 13px; line-height: 21px; display: block;}
.rows_info h3 a:hover{ color: #048f96;}
.rows_cost{ margin-right: auto; font-family: "samimBold"; font-size: 14px;} 
#all_rows{ padding-top: 10px; font-family: "samimBold"; font-size: 22px; text-align: right; border-top: 1px solid #f0f0f1; display: none;}
#all_rows #cost_all{ margin-left: auto;}
#all_rows .more{ margin: 0; background: #048f96; color: #fff;}
#cost_all .f_tiny{ font-size: 10px; font-family: samim;}

#num_link{ padding: 5px 0 10px 0; border-bottom: 1px solid #f0f0f1;}
#num_link > div{ color: gray; font-size: 13px;}
#num_link > a{ margin-right: auto; color: #048f96; font-size: 14px;}
#num_link > a i{ margin-right: 5px; vertical-align: middle;}
#num_link > a:hover{ opacity: 0.7;}
.del_item{ color: gray; font-size: 12px; line-height: 20px; margin-right: 5px;}
.del_item > span{ margin-left: 10px; padding-left: 10px; display: inline-block;} 
.del_item > span:nth-last-of-type(2){ border-left: 1px solid #f0f0f1;}
.del_item .n_pro i{ font-style: normal;}
.del_item .p_color span{ width: 13px; height: 13px; margin-left: 2px; border-radius: 100%; box-shadow: 0px 1px 1px 1px #d6d6d6; display: inline-block; vertical-align: middle;}
.del_item .p_black{ background: #000;}


.del_item .trash{ padding: 10px 15px 10px 10px; margin-right: auto; font-size: 14px; display: inline-block; cursor: pointer; transition: all linear .2s;}
.del_item .trash:hover{ color: rgba(237,54,57,1.00);} 
#list_scroll{ height: 285px; padding-bottom: 55px; overflow: auto;}
#list_scroll .basket_empty{ width: 100%; max-width: 210px; margin: auto; display: none;}
#cart_list.emptybox .basket_empty{ max-width: 145px; height: inherit !important; margin: 45px auto; display: block;}
#cart_list.emptybox #all_rows{ display: none;}
#cart_list.emptybox #list_scroll{ height: auto; padding-bottom: 0;} 
#cart_list #all_rows{ width: 100%; padding: 0 10px 10px; background: #fff; position: absolute; bottom: 0; left: 0; right: 0; display: flex;}
@media only screen and (max-width:320px){
	#cartbox{ width: Calc(100% - 20px); left: 15px; right: 5px; margin: auto;}
}

header.fix_head #middle{ max-height: 0; padding: 0; overflow: hidden; opacity: 0; visibility: hidden; transition: all linear 0.2s;}
header.fix_head #fix_box{ position: fixed; top: 0; left: 0; right: 0; border-top: none; z-index: 10000;}
header.fix_head #fix_box.static{ position: static;}
header #fix_box #middle.show, header.focus #middle{ max-height: 100px; padding: 20px 0; overflow: hidden; opacity: 1; visibility: visible; transition: all linear 0.2s;}

.space{ height: 142px; display: none;}
.resmenu_cover, .search_cover{ margin: auto; background: rgba(0,0,0,.5); position: fixed; top: 0px; bottom: 0px; left: 0px; right: 0px; z-index: 1000; display: none;}
.search_cover{ display: none; z-index: 900;} 
#menu_bar{ padding: 8px 0 8px 15px; color: #333; font-size: 30px; display: none; cursor: pointer; transition: all linear 0.2s;}
#close{ display: none;}
@media only screen and (min-width:1025px){
	.resmenu_cover, #hide_srch{ display: none !important;}	
}
@media only screen and (max-width:1024px){
	#menu_bar{ display: block;}
	#close{ width: 100%; max-width: 300px; padding: 7px 20px; margin-bottom: 20px; background: #85d8d0; color: #fff; font-size: 35px; text-align: right; display: block; z-index: 100;}
	#middle{ display: none;}
	#userbox .head_icons{ font-size: 25px;}
	#login{ padding: 13px 15px;}
	#basket{ width: 60px;}
	#cartbox:after{ width: 58px;}
	#bt_head{ background: #85d8d0;}
	#basket .num_pro{ background: #fff; border: 1px solid #ddd; right: 10px;} 
	#userbox .head_icons, #res_search .src_icon, .log_txt, #basket .num_pro{ color: #333;}
	#menu{ max-width: 300px; width: 100%; height: 100vh; margin-bottom: 50px; background: #f4f4f4; position: fixed; top: 0; right: -300px; overflow: auto; z-index: 1050; transition: all linear 0.2s;}
	#menu .main{ padding: 0;}
	#menu.show{ right: 0; transition: all linear 0.2s;}
	#menu.show nav{ width: 100%;}
	#menu nav > ul > li{ font-size: 15px; position: relative; display: block;}
	#menu nav > ul > li:hover > a span:before{ visibility: hidden; opacity: 0;}
	#menu nav > ul > li.active span:before{ bottom: -5px; visibility: visible !important; opacity: 1 !important;}
	#menu nav > ul > li:last-child{ margin-bottom: 60px;}
	#menu nav ul ul{ position: static; visibility: visible; opacity: 1; box-shadow: none; display: none; transition: none;}
	#menu nav ul ul li{ width: 100% !important; margin-bottom: 20px; border: none;}
	#menu nav ul ul li a{ padding: 10px 5px; border-bottom: 1px solid #eee;}
	#menu nav ul ul li:last-child{ padding-left: 10px;}
	#menu nav > ul > li > a{ padding: 12px 20px 12px 54px; position: relative;}
	#menu nav > ul > li > a i{ display: none;}
	#menu nav > ul > li .open_li{ display: block;}
	#menu nav > ul > li .mode{ display: inline-block;}
	#menu nav > ul > li.back_col > a{ color: #1cbfc8;}
	
	#res_search{ display: block;}
	#cartbox{ left: 75px;}
	.logo_res{ display: block;}
	.space{ height: 49px;}
}
@media only screen and (max-width:650px){
	#phone{ display: none;}
	#middle form{ margin-right: auto;}
}
@media only screen and (max-width:520px){
	#middle .logo{ margin-left: 10px;}
	#middle form{ width: Calc(100% - 110px);}
}


/** slider **/
/*.swiper-container{margin: 40px 0;}*/
#topslider{ height: Calc(50vh - 72px);}
#topslider .title{ margin:auto; padding-right: 20%; position:absolute; right: 0 !important; left: 0 !important; bottom:30px; font-weight: bold; text-align:center; text-shadow: 1px 1px 0px #333; transition: all 2s;}
#topslider .title > div{ width: 100%; padding:30px 15px 30px 0; margin:auto; text-align:right; display:inline-block;}
#topslider .title > div > div{ margin-bottom:10px; color:#fff; font-size:13px; line-height: 24px;}
#topslider .title h1{ padding-bottom: 20px !important; line-height:60px; color:#fff; font-size:40px; font-family:samimBold; border-bottom: 3px solid #1cbfc8;}
#topslider .title span{ width:100px; margin-top:20px; background:#2f9cae; color:#fff; padding:6px; text-shadow:1px 1px 0px rgba(99,99,99,0.8); display:inline-block; transition:all linear .2s; border-radius:5px; font-size:14px;}
#topslider .title span:hover{ background:#102048; text-shadow:none;}

.swiper-slide{ height:auto !important;}
.wrap-opi{display: flex;flex-wrap: wrap;height: 100%!important;align-items: center; position: relative;}
.wrap-opi > img{width: 100%; height: 100%; object-fit: cover !important; object-position: center !important;}
.wrap-opi .more{ min-width: inherit; padding: 5px 10px; margin-top: 10px; font-size: 12px; line-height: 22px; display: inline-block;}
.wrap-opi .more:hover{ background: #fff; color: #333; text-shadow: none;}
.arrow{ margin: auto; font-size: 18px; color: #333; text-align: center; position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%); display: block;}
.swiper-button-next, .swiper-button-prev{ width: 40px !important; height: 40px !important; background-image: none !important; background: #fff; border-radius: 100%; top: inherit!important; bottom: 25px; left: inherit !important; transition: all .3s!important;}
.swiper-button-next{ right: 70px !important;}
.swiper-button-prev{ right: 25px !important;}
@media screen and (min-width: 785px) {
	.swiper-button-next, .swiper-button-prev{ display: none!important;}
	.swiper-container:hover .swiper-button-next{display: block!important;}
	.swiper-container:hover .swiper-button-prev{display: block!important;}	
}
@media only screen and  (max-width: 785px){
	.swiper-button-next, .swiper-button-prev{display: block!important;}
}
@media only screen and  (max-width: 768px){
	#topslider{ display: none;}
	#topslider .title{ padding-right: 10%;}
	#topslider .title h1, #topslider .title > div > div{ padding:0 10px;}
}
@media only screen and  (max-width: 550px){
	#topslider .title h1{ font-size:25px; line-height:35px;}
	#topslider .title a{ font-size:23px;}
}



/***********************************************/
#indexSlider{ width: 100%; height: Calc(50vh - 72px); padding-bottom: 20px;}/*background:#192849;*/
#indexSlider>.InSlide{ position: relative; }
#indexSlideBox{ height: Calc(50vh - 72px); position: relative; overflow: hidden; }
#indexSlideBox a{animation: slideShow 24s linear infinite 0s;-o-animation: slideShow 24s linear infinite 0s;-moz-animation: slideShow 24s linear infinite 0s;-webkit-animation: slideShow 24s linear infinite 0s;}
#indexSlideBox .title.opa{opacity: 1}
.indexSlideImg{ width: 100%; height: Calc(50vh - 72px); position: absolute; opacity: 0; transition: all 1s linear; }
.indexSlideImg img{ max-width: 700px; width:100%; margin: auto; display: block; }
.indexSlideImg.pre{ opacity: 0;transition:all linear 0.3s;transform: scale(1)}
.indexSlideImg.next{ opacity:0;transition:all linear 0.3s;transform: scale(1)}
.indexSlideImg.show{  opacity:1;z-index:90;transition:all linear 0.3s;}

.indexSlideArrow{ width: 60px; height: 60px; margin: auto; text-align: center; font-size: 30px !important; position: absolute; bottom: 20px; cursor: pointer; display:block; z-index:100;}
#indexSlideBox:hover > .indexSlideArrow i{ opacity:0.5;}
.indexSlideArrow:hover i{ opacity:1 !important;}
.indexSlideArrow i{ width: 40px; height: 40px; line-height: 40px; margin: auto; background: #fff; font-size: 20px; position: absolute; top: 0; bottom: 0; left:0; right:0; text-shadow: 1px 1px 1px #000; border-radius: 100%; opacity: 0; transition:all linear 0.2s;}
.indexSlideArrow img{ width: 18px;}
#indexLeftSlide{ right: 75px;}
#indexRightSlide{ right: 25px;}

#indexSlideBtn{ width:100%; margin-top: 30px; position:absolute; bottom:15px; text-align: center;z-index: 100;}
#indexSlideBtn>span{ width: 20px; height: 2px; margin: 0 1px; background: rgba(37,29,18,.5); display: inline-block; cursor: pointer; }
#indexSlideBtn>span.indexSlideActive{ background: rgba(255,255,255,.5); }
#indexSlideBox.oneslide a{ animation: none !important;}
#indexSlideBox.oneslide .indexSlideArrow, #indexSlideBox.oneslide #indexSlideBtn{ display: none;}
@-moz-keyframes slideShow {  
	0% {-moz-transform:scale(1);} 
	10% {-moz-transform:scale(1.02) rotate(0.1deg);} 
	20% {-moz-transform:scale(1.04) rotate(0.1deg);} 
	30% {-moz-transform:scale(1.06) rotate(0.1deg);} 
	40% {-moz-transform:scale(1.08) rotate(0.1deg);} 
	50% {-moz-transform:scale(1.1) rotate(0.1deg);}
	60% {-moz-transform:scale(1.12) rotate(0.1deg);} 
	70% {-moz-transform:scale(1.14) rotate(0.1deg);} 
	80% {-moz-transform:scale(1.16) rotate(0.1deg);} 
	90% { -moz-transform:scale(1.18) rotate(0.1deg);} 
	100% {-moz-transformm:scale(1.2) rotate(0.1deg);}
}
@-webkit-keyframes slideShow {  
	0% {-webkit-transform:scale(1);} 
	10% {-webkit-transform:scale(1.02) rotate(0.1deg);} 
	20% {-webkit-transform:scale(1.04) rotate(0.1deg);} 
	30% {-webkit-transform:scale(1.06) rotate(0.1deg);} 
	40% {-webkit-transform:scale(1.08) rotate(0.1deg);} 
	50% {-webkit-transform:scale(1.1) rotate(0.1deg);}
	60% {-webkit-transform:scale(1.12) rotate(0.1deg);} 
	70% {-webkit-transform:scale(1.14) rotate(0.1deg);} 
	80% {-webkit-transform:scale(1.16) rotate(0.1deg);} 
	90% {-webkit-transform:scale(1.18) rotate(0.1deg);} 
	100% {-webkit-transform:scale(1.2) rotate(0.1deg);}
}

@media only screen and  (max-width: 1024px){
	.indexSlideArrow i{ opacity: 1 !important;}
}

/** affiliate **/
#indexSlider1{ width: 100%; height:Calc(50vh - 72px); padding-bottom: 20px; }/*height:Calc(100vh - 392.8px)*/
#indexSlider1>.InSlide1{ position: relative; }
#indexSlideBox1{ height:Calc(50vh - 72px); position: relative; overflow: hidden; }
.indexSlideImg1{ width: 100%; height:Calc(50vh - 72px); position: absolute; opacity: 0; transition: all 1s linear; }
.indexSlideImg1 img{ width:100%; height: 100%; margin: auto; object-fit: cover !important; object-position: center !important; display: block;}
.indexSlideImg1 .mobpic{ display: none;}
.indexSlideImg1.pre{ opacity: 0;transition:all linear 0.3s;}
.indexSlideImg1.next{ opacity:0;transition:all linear 0.3s;}
.indexSlideImg1.show{  opacity:1;z-index:90;transition:all linear 0.3s;}
#indexSlideBtn1{ width:100%; margin-top: 30px; position:absolute; bottom:15px; text-align: center;z-index: 100;}
#indexSlideBtn1>span{ width: 20px; height: 2px; margin: 0 1px; background: rgba(37,29,18,.5); display: inline-block; cursor: pointer; }
#indexSlideBtn1>span.indexSlideActive1{ background: rgba(255,255,255,.5); }
#indexSlideBox1.oneslide a{ animation: none !important;}
#indexSlideBox1.oneslide .indexSlideArrow1, #indexSlideBox1.oneslide #indexSlideBtn1{ display: none;}
@media only screen and  (max-width: 768px){
	#indexSlider1, .indexSlideImg1, #indexSlideBox1{ height:auto;}
	.indexSlideImg1 .mobpic{ display: block;}
	.indexSlideImg1 .deskpic{ display: none;}
}

/******* offer *****/
#indexSlider2{ width: 100%; height:Calc(50vh - 72px); padding-bottom: 20px; }/*background:#192849;*/
#indexSlider2>.InSlide2{ position: relative; }
#indexSlideBox2{ height:Calc(50vh - 72px); position: relative; overflow: hidden; }
#indexSlider2>.InSlide2 .title{ margin:auto; color: #fff; font-size: 30px; text-align: center; line-height: 45px; position:absolute; right: 0 !important; left: 0 !important; bottom: 40px; font-weight: bold; text-shadow: 1px 1px 0px #333; transition: all 2s; z-index: 100; display: inline-block;}
#indexSlider2>.InSlide2 .title b{ padding: 2px 10px; background: #3333338c;}
.indexSlideImg2{ width: 100%; height:Calc(50vh - 72px); position: absolute; opacity: 0; transition: all 1s linear; }
.indexSlideImg2 img{ max-width: 700px; width:100%; margin: auto; display: block; }
.indexSlideImg2.pre{ opacity: 0;transition:all linear 0.3s;}
.indexSlideImg2.next{ opacity:0;transition:all linear 0.3s;}
.indexSlideImg2.show{  opacity:1;z-index:90;transition:all linear 0.3s;}
.indexSlideArrow2{ width: 60px; margin: auto; text-align: center; font-size: 30px !important; position: absolute; top: 0; bottom: 0; cursor: pointer; display:block; z-index:100;}
.indexSlideArrow2:hover i{ opacity:1;}
.indexSlideArrow2 i{ height: 31px; margin: auto; position: absolute; top:0; bottom:0; left:0; right:0; text-shadow: 1px 1px 1px #000; opacity:0.3; transition:all linear 0.2s;}
.indexSlideArrow2 img{ width: 18px;}
#indexLeftSlide2{ left: 0px; }
#indexRightSlide2{ right: 0px; }
#indexSlideBtn2{ width:100%; margin-top: 30px; position:absolute; bottom:15px; text-align: center;z-index: 100;}
#indexSlideBtn2>span{ width: 20px; height: 2px; margin: 0 1px; background: rgba(37,29,18,.5); display: inline-block; cursor: pointer; }
#indexSlideBtn2>span.indexSlideActive2{ background: rgba(255,255,255,.5); }
#indexSlideBox2.oneslide a{ animation: none !important;}
#indexSlideBox2.oneslide .indexSlideArrow2, #indexSlideBox2.oneslide #indexSlideBtn2{ display: none;}
@media only screen and  (max-width: 768px){
	#indexSlider2, .indexSlideImg2, #indexSlideBox2{ height:300px;}
	#indexSlider2>.InSlide2 .title{ padding-right: 15%;}
}
@media only screen and  (max-width: 550px){
	#indexLeftSlide2{ width:30px; left: 0; }
	#indexRightSlide2{ width:30px; right: 0; }
}

#all_slider{ /*display: flex; flex-wrap: wrap; flex-direction:column-reverse;*/}
#offer{ width: 100%; flex-direction: row-reverse;}
#offer #today{ width: 400px;}
#offer #affiliate{ width: Calc(100% - 400px);}

@media only screen and (max-width:768px){
	#offer #today{ display: none !important;}
	#offer #today, #offer #affiliate{ width: 100%;}
	#offer{ flex-direction: row;}
	#all_slider{ flex-direction: column;}
}

/**** delivery ****/
#delivery img{ width: 100% !important; height: inherit !important; display: block;}

/**** advantages ****/
#advantages{ padding: 70px 0; background: #2c2c2c;}
#advantages .each_item{ width: 25%;}
.each_item > div{ width: Calc(100% - 65px); margin-right: auto;}
.each_item i{ color: #1cbfc8; font-size: 38px; display: block}
.each_item .subject{ color: #fff; font-family: "samimBold"; font-size: 14px;}
.each_item .info{ color: #a1a1a1; font-size: 14px; line-height: 24px;}
.each_item .info a{ color: #a1a1a1;}
@media only screen and (max-width:1024px){
	#advantages .each_item{ width: 50%; margin: 15px 0;}
}
@media only screen and (max-width:500px){
	#advantages .each_item{ width: 100%;}
}

/***** brand *****/
#brand{ padding: 40px 0; background: #f4f4f4;} 
#brand .carousel{ margin: 20px 0;}
#brand .team-item{ width: 154px !important; min-height: max-content !important; padding: 0 !important; margin: 5px 11px !important;}
#brand .team-item-img{ margin: 0 !important;}
#brand .team-members .slick-prev::before, #brand .team-members .slick-next::before{ color: #333; font-size: 30px;}
#brand .slick-arrow{ width: 50px; background: #f4f4f4 !important; z-index: 10;}
#brand .slick-prev { left: -32px;}
#brand .slick-next { right: -32px;}
@media only screen and (max-width:850px){
	#brand .team-members { width: Calc(100% - 60px);}
}
/*******/

#flex-box > div > div > a i{ color:#a9d10a; vertical-align:middle;}
#flex-box{ padding: 2px; display:flex; display:-webkit-flex; flex-wrap:wrap;}
#flex-box > div{ width: Calc(50% - 1px); margin-left: 2px;}
#flex-box > div:last-child{ margin-left: 0;}
#flex-box .right-flex > div{ height: 450px;}
#flex-box .right-flex > div h3{ font-size: 35px; line-height: 55px;}
#flex-box > div > div, #sortstyle > div{ background-size:cover !important; background-position:center !important; position:relative; display:flex; display:-webkit-flex; justify-content:center; align-items:flex-end;} 
#flex-box > div > div > a, #sortstyle > div > a{ background:rgba(255,255,255,0); position:absolute; top:0; left:0; right:0; bottom:0; margin:auto; transition:all linear 0.3s;}
#flex-box > div > div h3{ width:100%; font-family:'samimBold'; text-align: left; text-shadow:1px 1px 1px #000; position: relative; z-index: 10;}
#flex-box > div > div h3 a{ padding: 10px 20px; color:#fff; display: block;}
#flex-box > div > div h3 i{ color: #1cbfc8; opacity: 0; visibility: hidden; vertical-align: middle; transition: all linear 0.2s;}
#flex-box > div > div:hover h3 i{ visibility: visible; opacity: 1;}
#flex-box > div > div:hover > a, #sortstyle > div:hover > a{ background: rgba(0,0,0,.5);}
#flex-box .left-flex{ display:flex; display:-webkit-flex; flex-wrap:wrap;}
#flex-box .left-flex > div{ width: Calc(50% - 1px); margin-left: 2px;}
#flex-box .left-flex > div:last-child{ margin-left: 0;}
#flex-box .left-flex > div h3{ font-size: 27px; line-height: 43px;}
#flex-box .left-flex > div:first-child{ width:100%; margin-bottom: 2px; margin-left: 0; font-size: 30px;}
#flex-box .left-flex > div:first-child h3{ font-size: 35px; line-height: 55px}
#sortstyle > div{ width: Calc(50% - 1px); height: Calc(50% - 1px); margin: 0 0 2px 2px;}
#sortstyle > div:nth-child(2n){ margin-left: 0;}
#sortstyle > div:nth-child(3){ margin-bottom: 0;}
#sortstyle > div:nth-child(4){ margin-bottom: 0;}
#sortstyle > div h3{ font-size: 20px !important; line-height: 30px !important;}
#flex-box > div > #sortstyle:hover h3 i{ visibility: hidden; opacity: 0;}
#sortstyle > div:hover h3 i{ visibility: visible !important; opacity: 1 !important;}

@media only screen and (max-width:850px){
	#flex-box .right-flex > div{ height:300px;}
	#flex-box .left-flex > div{ height:300px;}
	#flex-box > div{ width:100%; margin-left: 0 !important;}
	#flex-box > div:first-child{ margin-bottom: 2px;}
	#flex-box .right-flex > div h3, #flex-box .left-flex > div h3{ font-size: 30px !important; line-height: 50px !important;}
	#flex-box #sortstyle > div h3{ font-size: 20px !important; line-height: 30px !important;}
	#flex-box > div > div h3 i{ position: relative; top: 3px; opacity: 1; visibility: visible; vertical-align: inherit;}
	#flex-box > div > #sortstyle h3 i{ visibility: visible !important; opacity: 1 !important;}
}
@media only screen and (max-width:600px){
	#flex-box .left-flex > div{ width:100%; margin: 0 0 2px !important;}
	#flex-box .left-flex > div:last-child{ margin-bottom: 0 !important;}
}

/* ********************************* carousel ********************************** */
.team-item{ direction: rtl; position: relative;}
.team-item .more{ width: 100%; margin: 20px auto auto;}
.team-item:hover .more{ background: #048f96; color: #fff;}
.team-item:hover img{ transform: scale(1.1,1.1);}
.team-item > div.flexbox{ position: absolute; left: 10px; right: 10px; bottom: 10px; align-items: flex-end;}
.carousel{ margin: 100px 0; direction: ltr;}
.heart{ color: #ff6969 !important;}

.no_effect_1 .slick-track, .no_effect_3 .slick-track, .no_effect_5 .slick-track{ width: 100% !important; transform: translate3d(0px, 0px, 0px) !important; display: flex; justify-content: center; direction: rtl;}
.no_effect_1 .slick-dots, .no_effect_3 .slick-dots, .no_effect_5 .slick-dots{ display: none;}
.no_effect_1 .slick-list, .no_effect_3 .slick-list, .no_effect_5 .slick-list{ padding: 0 !important;}

.slick-dots{ direction: rtl;}
.team-members{
	margin-bottom: 0 !important;
	width: 1250px;
	display: flex;
	margin: 0 auto;
}

.team-item{
	cursor: grab;
	min-height: 385px !important;
	width: 231px !important;
	text-align: center;
	margin: 5px 10px !important;
	padding: 10px 10px 100px;
	background-color: #fff;
	border: 1px solid #E4E1E1;
	border-radius: 5px;
	transition: all linear 0.2s;
}
.team-item:hover{ box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1);}
.team-item form{ width: 100%; display: block;} 
#car_pro .team-item{ min-height: 318px !important; padding: 10px 10px 0;}
#team-header{
	font-size: 40px;
	color: rgb(245, 92, 92);
	padding: 10px 0;
	margin:60px auto;
	display: block;
	text-align: center;
	font-family: 'Avenir LT Std';
	font-weight: bolder;
}
#team-top{
	display: flex;
	width: 37.5%;
	justify-content: center;
	margin: 10px auto 0 auto;
	color: #505050;
}
.team-top-item{
	width: 45%;
	height: 100%;
	margin: 15px auto;
}
.team-item-name{
	text-align: right;
	font-size: 13px;
	line-height: 25px;
	font-family: 'samim';
}
.team-item-name a{ color: #1B1B1B; display: block;}
.team-item-name a:hover{ color: #048f96;}
.team-item-img{
	width: 100%;
	margin-bottom: 10px;
	display: flex;
	align-items: center;
	position: relative;
	transition: all linear .2s;
	overflow: hidden;
}
.team-item-img img{ width: 85%; height: inherit !important; margin: auto; display: block; transition: all linear .2s;}
.team-item-bio{
	text-align: center;
	line-height: 1.5;
	margin: 0 15px;
	font-size: 14px;
}
#team-middle-top{
	display: flex;
	width: 95%;
	margin: 30px auto 0 auto;
	color: #3f3f3f;
}
#team-middle-bottom{
	display: flex;
	width: 95%;
	margin: 30px auto 0 auto;
	color: #3f3f3f;
	margin-bottom: 100px;
}
#team-bottom{
	display: flex;
	width: 37.5%;
	margin: 30px auto 60px auto;
	color: #3f3f3f;
}
.team-bottom-item{
	width: 19%;
	margin: 15px auto;
}
.team-bottom-bottom-item{
	width: 47%;
	margin: 0 auto 20px auto;
}
.jadid .team-item-img{
 transform: scale(1.3, 1.3);
}
@media only screen and (max-width: 1300px){
	.team-members{
		width: 750px;
	}
}
@media only screen and (max-width: 1024px){
	.team-item{ box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1)} 
	.team-item:hover img { transform: scale(1);}
}
@media only screen and (max-width: 850px){
	.team-members{
		width: 370px;
	}
	.team-item{
		padding-bottom: 30px !important;
		margin: 5px 75px !important;
	}
}
@media only screen and (max-width: 800px){
	.carousel{ margin: 60px 0;}
	#team-header{
		font-size: 30px;
	} 
	.team-item .more{ padding: 6px 5px;}
}
@media only screen and (max-width: 450px){
	.team-members{
		width: 270px;
	}
	.team-item{
		padding-bottom: 30px !important;
		margin: 5px 15px !important;
	}
}
.team-members .slick-prev:before {
    content: "\f053" !important;
	font-family:"Font Awesome\ 5 Free"; 
	font-weight:900;
    font-size: 40px;
	color: #1cbfc8;
}
.team-members .slick-next:before {
    content:"\f054";
	font-family:"Font Awesome\ 5 Free"; 
	font-weight:900;
    font-size: 40px;
	color: #1cbfc8;
}
.slick-arrow{
	height: 200px;
}

/*** today offer in responsive ***/
#today_offer{  display: none;}
#today_offer .slick-arrow, #today_offer .slick-dots{  display: none !important;}
#today_offer .team-members{ width: 100%;}
#today_offer .team-item{ margin: 5px 10px !important;}
@media only screen and (max-width:768px){
	#today_offer{  display: block;}
}

/******* Latest Products ******/
.titlebox{ margin-bottom: 35px; text-align: center;}
.titlebox i{ width: 35px; padding: 0 5px; margin: auto; background: #fff; color: #1cbfc8; font-size: 19px; position: absolute; left: 0; right: 0; top: -10px;}
.titlebox span{ height: 1px; width: 120px; margin: 20px auto auto; background: #ddd; display: block; position: relative;}
.t_title{ font-family: "samimBold"; font-size: 23px; line-height: 38px; text-align: center;}

.latest{ margin: 90px 0;}
.latest .main{ max-width: 1400px;}
.latest .items{ width: Calc(20% - 8px); padding: 10px 10px 65px; margin: 0 0 10px 10px; position: relative; border-radius: 5px; transition: all linear 0.2s}
.latest .items:hover{ box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.1);}
.latest .items:hover .more{ background: #048f96; color: #fff;}
.latest .items:last-child, .latest .items:nth-child(5n){ margin-left: 0;}
.latest .item_img{ margin-bottom: 10px; overflow: hidden; display: block;}
.latest .items img{ width: 80%; margin: auto; display: block; transition: all linear 0.2s;}
.latest .items:hover img{ transform: scale(1.1,1.1);}
.latest .items h3 a{ color:#1b1b1b; font-size: 13px; line-height: 25px; display: block;}
.latest .items h3 a:hover{ color: #048f96;}
.latest .items .more{ width: Calc(100% - 20px); margin: 5px auto 0 0; position: absolute; left: 10px; right: 10px; bottom: 10px;}
.latest .items .percent{ top: 10px; right: 10px;}
.costbox{ align-items: center;}
.costbox .cost{ font-family: "samimBold"; text-align: left;}
@media only screen and (max-width:1100px){
	.latest .all_items{ max-width: 760px; margin: auto;}
	.latest .items{ width: Calc(50% - 10px); padding: 10px 10px 75px; margin: 0 0 20px 20px;} 
	.latest .items:nth-child(5n){ margin-left: 20px;}
	.latest .items:nth-child(2n){ margin-left: 0;}
	.latest .items:nth-last-child(1){ margin-bottom: 0;}
}
@media only screen and (max-width:1024px){
	.latest .items{ box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.1);}
	.latest .items h3 a:hover{ color: #1b1b1b;}
	.latest .items:hover img{ transform: scale(1);}
}
@media only screen and (max-width:600px){
	.latest .all_items{ max-width: 370px; margin: auto;}
	.latest .items{ width: 100%; margin: 0 0 20px !important;} 
	.latest .items:nth-last-child(1){ margin-bottom: 0 !important;}
}

/*** blog news index ***/
#blog{ padding: 90px 0 0;}
#blog > .flexbox{ align-items: stretch; justify-content: center;}
#blog .newsbox{ width: Calc(25% - 7.5px); padding: 20px 20px 50px; margin: 0 0 0 10px; border-radius: 5px; box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1); position: relative;}
#blog .newsbox:last-child{ margin-left: 0;}
#blog .newsbox .news_img{ height: 200px; width: 100%; background-size: cover !important; background-position: center !important; display: block;}
#blog .newsbox .news_img:hover{ opacity: 0.7;} 
#blog .newsbox h3 a{ margin: 15px 0 5px; color: #048f96; font-size: 16px; line-height: 24px; font-family: "SamimBold"; font-weight: bold; display: block;}
#blog .newsbox h3 a:hover{ opacity: 0.7;}
#blog .newsbox .txt{ padding: 5px 0; font-size: 13px; line-height: 22px;}
#blog .more{ min-width: 300px; margin: 20px 0 0;}
.b_more{ padding: 12px 20px; color: #048f96; position: absolute; bottom: 0; left: 0; right: 0; font-size: 14px; text-align: left; display: block; transition: all linear .2s;}
.b_more:hover{ opacity: 0.7;}
@media only screen and (max-width:1024px){
	#blog .newsbox{ width: Calc(50% - 5px); margin: 0 0 10px 10px;}
	#blog .newsbox:nth-child(2n){ margin-left: 0;}
}
@media only screen and (max-width:768px){
	#blog{ padding: 60px 0 40px;}
}
@media only screen and (max-width:600px){
	#blog .newsbox h3 a{ font-size: 18px; line-height: 30px;}
	#blog .newsbox .txt { font-size: 15px; line-height: 27px;}
	#blog .newsbox{ width:100%; margin: 0 0 10px;}
	#blog .newsbox:nth-child(2n){ margin-left: 0;}
	#blog .more{ width: 100%;}
	#blog .b_more{ font-size: 15px;}
}
	
/****** seo text *****/
#seo_txt{ padding: 90px 0;}
#seo_txt a{ color: #048f96; }
#seo_txt a:hover{ opacity: 0.7;}
#seo_txt .txt{ font-size: 14px;}
#seo_txt video{ max-width: 600px; width: 100%; margin: auto auto 30px; display: block;}


/******************************* show more seo text **************************************/
.add_bt{ background:#fff; color:#FFF; text-align:center; font-size:14px; cursor:pointer; position: relative; z-index: 3; transition: all .5s linear; }
.add_bt i{ color: #048f96; font-size: 20px; vertical-align: middle; transition: all .5s linear;}
.add_bt:before{ content:""; height:100px; background: -moz-linear-gradient(90deg, rgb(12, 6, 6) 10%, rgba(242,242,242,0.05) 99%, rgba(242,242,242,0.05) 100%, rgba(0,0,0,0.05) 100%); /* ff3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0,0,0,0.05)), color-stop(0%, rgba(242,242,242,0.05)), color-stop(1%, rgba(242,242,242,0.05)), color-stop(90%, rgba(242,242,242,1))); /* safari4+,chrome */
    background: -webkit-linear-gradient(90deg, rgba(255,255,255,0.9) 10%, rgba(242,242,242,0.05) 99%, rgba(242,242,242,0.05) 100%, rgba(0,0,0,0.05) 100%); /* safari5.1+,chrome10+ */
    background: -o-linear-gradient(90deg, rgba(255,242,255,0.9) 10%, rgba(242,242,242,0.05) 99%, rgba(242,242,242,0.05) 100%, rgba(0,0,0,0.05) 100%); /* opera 11.10+ */
    background: -ms-linear-gradient(90deg, rgba(255,255,255,0.9) 10%, rgba(242,242,242,0.05) 99%, rgba(242,242,242,0.05) 100%, rgba(0,0,0,0.05) 100%); /* ie10+ */
    background: linear-gradient(0deg, rgba(255,255,255,0.9) 10%, rgba(242,242,242,0.05) 99%, rgba(242,242,242,0.05) 100%, rgba(0,0,0,0.05) 100%); /* w3c */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#f2f2f2',GradientType=0 ); /* ie6-9 */  position:absolute; left:0; right:0; bottom:36px; display:block;}
.add_bt .addButton{ padding: 5px 10px; line-height: 26px; font-family:'samimBold'; color: #048f96; transition: all .5s linear; border-radius: 5px 5px 0 0; display: inline-block;}
.add_bt.open{ background:transparent; bottom:-10px; margin: 20px auto 0 auto; color:#FFF;}
.add_bt.open i{ transform: rotateX(180deg);}
.add_bt{ position:absolute; left:0; right:0; bottom:0; text-align: center;}
.add_bt .addButton:hover{ opacity:0.6;}
.add_bt.open:before{ display:none;}
/******************************* /show more seo text **************************************/

/**************************************** productlist ***************************************/ 
#top_box{ padding: 10px 0 15px; background: #f4f4f4; background-size: cover !important; background-position:  100% 0; color: #fff;}
#top_box h1{ color: #333; font-family: "SamimBold"; font-size: 17px; line-height: 28px; display: inline-block;}
.bann_txt .p_txt{ margin-right: 5px; color: #666; font-size: 13px; line-height: 25px; display: inline-block;}
#scroll_pro > div{ overflow-x: auto; overflow-y: visible; position: relative; z-index: 10;}
#pro_box{ padding: 40px 0 20px;}
#pro_box h1{ margin: 0 0 30px;  font-family: "SamimBold"; font-size: 30px; line-height: 45px; display: block;}
#pro_box h1 span{ color: gray;}
#pro_box .flexbox{ align-items: stretch;}
#pro_box .items{ width: Calc(16.666% - 10px); margin: 5px; border-bottom: 4px solid transparent; border-radius: 5px; position: relative; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1); transition: all linear .2s;}
#pro_box .items:hover{ border-color: #048f96;}
#pro_box .item_pic{ overflow: hidden; display: block;}
#pro_box .item_pic img{ width: 80%; margin: auto; border-radius: 3px 3px 0 0; display: block; transition: all linear 0.2s;}
#pro_box .item_pic:hover img{ transform: scale(1.1);} 
#pro_box .items h3{ font-family: "SamimBold"; font-size: 14px; text-align: center;}
#pro_box .items h3 a{ padding: 10px; color: #1b1b1b; display: block;}
#pro_box .items:hover h3 a{ color: #048f96;}
#pro_box .see_other{ cursor: pointer;} 
#pro_box .see_other > div{ height: 100%; display: flex; flex-flow: column; align-items: center; justify-content: center;}
#pro_box .see_other .num{ margin-bottom: 30px; font-family: "SamimBold"; font-size: 35px;}
#pro_box .see_other .num i{ font-size: 25px;}
#pro_box .see_other .text{ font-size: 15px;}
#pro_box .items.hidden{ display: none;}
@media only screen and (max-width:1024px){
	#scroll_pro > .flexbox{ flex-wrap: nowrap;}
	#pro_box .items{ min-width: 150px;}
	#pro_box .items:nth-child(6n){ margin-left: 10px;}
	#pro_box .see_other{ display: none;}
	#pro_box .items.hidden{ display: block;}
}

#dv_sort{ width:100%; padding-bottom: 5px; margin:20px 0; border-bottom: 1px dashed #ddd; flex-direction: row-reverse;}
.help_txt{ width: 200px; margin-right: auto; color: gray; font-size:14px; text-align: left;}
.bluebg{ width:Calc(100% - 200px); color:#333;}
.bluebg ul{ padding:0; margin:0 15px 0 0; font-size:0; display: inline-block;}
.bluebg ul li:first-child{ font-size:15px;}
.bluebg ul li{ font-size:14px; display:inline-block;}
.bluebg ul li a{ padding:5px 15px; margin:3px; color:#333; border-radius: 5px; display:block; transition:all linear 0.3s;}
.bluebg ul li a:hover{ background: #eee;}
.bluebg ul li:last-child a{ margin-left:0;}
.bluebg ul li a.active{ background: #eee;}
#exist{ margin-bottom: 20px;}
#exist label{ font-family: "SamimBold"; cursor: pointer;} 
/** swich input **/
.switch {
  position: relative;
  display: inline-block;
  width: 42px;
  height: 23px;
  margin: 3px 7px 0 0;
}

.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 15px;
  width: 15px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #1cbfc8;
}


input:checked + .slider:before {
  -webkit-transform: translateX(19px);
  -ms-transform: translateX(19px);
  transform: translateX(19px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

#sort_box{ display:block;}
#sort_box .res_li{ display: none;}
#sort_icon .change_txt{ display: none;}
@media only screen and (max-width:768px){
	#sort_box{ padding: 0 15px; position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.3); display: none; z-index: 10000;}
	#sort_box ul{ max-width: 400px; width: 90%; margin: auto; padding: 15px; background: #fff; position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-50%);}
	#sort_box ul li{ width: 100%; display: block;}
	#sort_box .fa-times{ padding: 15px 20px; position: absolute; left: 0; top: 0; font-size: 25px; }
	#sort_box .res_li{ padding-bottom: 15px; margin-bottom: 10px; font-family: "SamimBold"; font-size: 17px; border-bottom: 1px solid #ddd; display: block;}
	#sort_icon{ width: 100%; background: #eee; padding: 7px 10px;}
	#sort_icon .hide_txt{ display: none;}
	#sort_icon .change_txt{ display: inline-block;}
	
	.bluebg > .flexbox{ justify-content: center;}
	.bluebg{ width:100%; display: block; text-align: center; padding:10px 0;}
	.help_txt{ display: none;}
	#exist label{ font-size: 18px;}
	.switch { width: 63px; height: 30px;}
	.slider::before{ height: 22px; width: 22px; bottom: 4px; left: 5px;}
	input:checked + .slider:before {
	  -webkit-transform: translateX(31px);
	  -ms-transform: translateX(31px);
	  transform: translateX(31px);
	}
	#dv_sort{ margin: 13px 0;}
}

#filter{ padding-bottom: 20px; position: relative;}
#filter:after{ display: block; content: ""; clear: both;}
#filter #right{ width: 300px; padding: 18px 10px; background: #f4f4f4; border-radius: 3px; float: right; display: flex; flex-direction: column; justify-content: center;}
#right i{ color: #1cbfc8; position: relative; top: 1px;}
.filter_form{ margin-top: 20px;}
#right .close_bt{ padding: 10px 20px; color: #1cbfc8; position:absolute; left: 0; top: 6px; font-size: 25px; display: none; cursor: pointer; z-index: 900;}
.top_title{ font-size: 17px;}
.filter_info{ margin: 0 0 20px 0; font-size: 15px;}
.filter_info .proper{ margin-top: 5px;}
.filter_info .proper .together{ width: Calc(100% - 45px);}
.filter_info .proper select{ width: 100%; height: 40px; padding: 0 5px; background: transparent; font-size: 14px; border: 1px solid #d5d5d5; border-radius: 5px;}
.filter_info .proper select option{ font-family: tahoma;}
.filter_info .proper:nth-of-type(1){ margin-bottom: 5px;} 
.filter_info .proper b{ width: 45px; font-family: "Samim"; font-size: 14px; display: block;}
#s_color label{ width: 100%; padding: 2px 0px; margin: 0 0 4px 4px; font-size: 13px; display: block;}
#s_color label span{ width: 15px; height: 15px; border-radius: 3px; display: inline-block; vertical-align: middle;}
#s_color label input{ margin-left: 2px;}
.brand_box,#s_color{ max-height: 160px; overflow: auto;}
.brand label{ padding: 2px 0px; margin: 2px 0 2px 0px; font-size: 11px; display: block; cursor: pointer;}
input[type="checkbox"], input[type="radio"]{ height: 12px; width: 12px; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none;	border: 1px solid #D1D1D1;	background:#FFFFFF;	border-radius:2px;	position:relative; top:2px; margin-left:5px; display:inline-block;	transition:all .2s; cursor: pointer;}
input[type="checkbox"]:checked, input[type="radio"]:checked  { background: #048f96; border: 1px solid #048f96;}	
#right form button{ width: 100%; padding: 7px; margin: 5px auto auto; color: #373737; font-family: "SamimBold"; font-size: 14px; border-color: #373737;}
#right form button:hover{ background: #373737 !important; color: #fff;}
#right .add_butt{ display: flex;}
#right .add_butt .more{ width: 49%;}
#right .add_butt .more:first-child{ margin-left: 2%;}
#right .add_butt .more2{ background: transparent; color: #dc0b0b; border-color: #dc0b0b;}
#right .add_butt .more2:hover{ background: #dc0b0b !important; color: #fff;}
#rangcost_sort{ margin-bottom: 10px;}
#rangslide_min{ float: right; font-size: 14px; color: #555; }
#rangslide_max{ float: left; font-size: 14px; color: #555; }
#rangslide_min,#rangslide_max{ font-size: 12px; }
#rang_ui_slide{ margin: 0 8px 0 9px; }
#rang_ui_slide span.radius{ border-radius:50% !important;}
.filter_item{ cursor: pointer;}
.filter_item .fa-plus{ display: none;}
.showbox{ display: block;}
#filter #left{ width: calc(100% - 320px); margin-right: auto; text-align: center; float: left;}
.item_box > .flexbox{ align-items: stretch;}
.item_box .pro_items{ width: Calc( 33.33% - 20px); padding: 10px 10px 115px; margin: 0 0 30px 30px; text-align: center; border-radius: 5px; position: relative; transition: all linear .2s;}
.item_box .pro_items:last-child, #left .pro_items:nth-child(3n){ margin-left: 0;}
.item_box .pro_items:hover{ box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.1);}
.item_box .pro_items:hover .more{ background: #048f96; color: #fff;}
.item_box .pro_items:hover .pro_pic img{ transform: scale(1.05);}
.item_box .pro_items .pro_pic{ position: relative; display: flex; align-items: center;}
.not_exist{ padding: 0 8px; background: #9f9f9f; color: #fff; font-size: 12px; text-align: center; border-radius: 3px; position: absolute; top: 5px; left: 5px; z-index: 10;}
.no_pro{ text-align:right !important; display:block;}
.labels{ color: #fff; font-size: 12px; text-align: center ; position: absolute; left: 5px; top: 5px; display: flex; z-index: 10;}
.labels b{ padding: 0 8px; margin-right: 3px; color: #fff; border-radius: 3px; display: inline-block;}
.labels .offer{ background: #333;}
.labels .popular{ background: #333;}
.percent{ width: 26px; height: 26px; line-height: 26px; color: #d11366; font-size: 17px; text-align: center; border-radius: 100%; position: absolute; top: 5px; right: 5px; display: inline-block; z-index: 10;}
.item_box .pro_items .pro_pic img{ width: 80%; margin: auto; display: block; transition: all linear 0.2s;}
.item_box .pro_items h3{ margin-top: 10px; font-size: 13px; line-height: 25px; text-align: right;}
.item_box .pro_items h3 a{ color: #333; display: block;}
.item_box .pro_items h3 a:hover{ color: #048f96;}
.item_box .pro_items > div.flexbox{ position: absolute; left: 10px; right: 10px; bottom: 10px; align-items: flex-end;}
.item_box .pro_items .more{ width: 100%; margin: 0; }
.item_box .pro_items .more i{ font-size: 15px; padding:0 3px;} 
.not_available b{ display: block;}
.not_available{ background: #9f9f9f; color: #fff; border-color: #fff;}
.not_available:hover, .team-item:hover .not_available, .item_box .pro_items:hover .not_available{ background: #9f9f9f; opacity: 1;}

#extra_box{ margin-top: 20px;}
.filter_input{ height: 35px; padding: 5px 10px 5px 35px; margin: 0 0 3px 3px; font-size: 13px; position: relative; border-radius: 5px; border: 1px solid #ddd; display: inline-block;}
.filter_input i{ padding: 7px 10px; font-size: 18px; position: absolute !important; left: 0px; transition: all linear 0.2s;}
.filter_input i:hover{ opacity: 0.6;}

#s_paging{ margin: 30px 0;}
#s_paging ul{ padding: 0; margin: 0; font-size: 0; text-align: center;}
#s_paging ul li{ width: 40px; height: 40px; line-height: 40px; margin-bottom: 3px; background: #eee; color: #333; font-size: 16px; font-family: "SamimBold"; text-align: center; display: inline-block;}
#s_paging ul li.active{ background: #373737;}
#s_paging ul li.active a{ color: #fff;}
#s_paging ul li a{ color: #333; display: block;}
#s_paging ul li a:hover{ opacity: 0.7;}
#s_paging ul li i{ font-size:13px;}
#s_paging.p_phone{ display: none;}
@media only screen and  (max-width: 1100px){
	#left .pro_items{ width: Calc( 50% - 15px);}
	#left .pro_items:nth-child(3n){ margin-left: 30px;}
	#left .pro_items:last-child, #left .pro_items:nth-child(2n){ margin-left: 0;}
}
@media only screen and  (max-width: 1024px){
	.item_box .pro_items{ padding: 10px 10px 125px; box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.1);}
	.item_box .pro_items:hover{ box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.1);}
	.item_box .pro_items:hover .pro_pic img{ transform: scale(1);}
	#right form button{ background: #373737; color: #fff;}
}
@media only screen and  (min-width: 851px){ 
	.filter_form{ display: block !important;}
}
@media only screen and  (max-width: 850px){
	#filter #left, #filter #right{ width: 100%; min-height: inherit; float: none;}
	#filter #right{ padding:50px 20px 10px 20px; position: fixed; left: 0; right: 0; bottom: 0; border-top: 1px solid #ddd; border-radius: 0; z-index: 900;}
	#filter #right #flow{ overflow: auto; max-height: 400px;}
	#filter #right .top_title{ width: 100%; padding: 16px 20px  16px 0; background: #f4f4f4; position: absolute; top: 0; left: 0; right: 0; border-bottom: 1px solid transparent; z-index: 100;}
	#right .close_bt{ display: block;}
	.brand label{ min-width: 120px; margin: 5px 0 5px 5px; font-size: 15px;}
	#s_color label{ padding: 4px 0;}
	#s_color label span{ height: 20px; width: 20px;}
	.filter_info input[type="checkbox"], .filter_info input[type="radio"]{ width: 16px; height: 16px; position: relative; top: 4px;}
	.filter_info{ padding: 5px 0; font-size: 18px; line-height: 30px;}
	.top_title{ font-size: 20px;}
	.filter_form{ display: none;}
	#right form button{ background: #373737 !important; color: #fff !important; font-size: 19px !important;}
	#right .add_butt .more2{ background: #dc0b0b !important;}
	#back_up.hide{ display: none !important;}
	#rangslide_min, #rangslide_max{ font-size: 16px;}
	#fix_bt{ width: calc(100% - 40px); margin: auto; position: absolute; bottom: 0; left: 0; right: 0; z-index: 100;}
	#right.show{ padding-bottom: 40px !important;}
	#filter #right.show .top_title{ border-color: #ccc;}
	.filter_item .fa-angle-down{ display: none;}
	.filter_item .fa-plus{ display: inline-block;}
	.showbox{ display: none;}
}
@media only screen and  (max-width: 768px){
	.item_box .pro_items .more{ padding: 6px 10px;}
	#right form button, .bluebg ul li a{ padding: 10px; font-size: 16px;}
	#s_paging.p_phone{ display: block;}
	#s_paging.p_list{ margin: 0 0 15px;}
	#s_paging{ display: flex !important; justify-content: center;}
	#s_paging ul{ display: flex; flex-wrap: nowrap; overflow-x: auto; overflow-y: visible;}
	#s_paging ul li{ min-width: 40px; margin-bottom: 0;}

}
@media only screen and  (max-width: 550px){
	.item_box .pro_items{ width:100% !important; margin: 0 0 30px !important;}
	.item_box .pro_items .pro_pic{ height: auto;}
	.item_box .pro_items .pro_pic{ min-height: inherit !important;}
}

/******************************* show more seo text **************************************/
#seo_text,#s_text{ overflow:hidden; position:relative;}
#seo_text a{ color:#0000FF; transition: all linear 0.2s;}
#seo_text a:hover{ color: #0066FF;}
/******************************* /show more seo text **************************************/

/**************************************** product *****************************************/
#product{ padding: 0 0 30px; align-items: stretch; border-bottom: 1px solid #ddd;}
#product #navigator{ padding: 10px 0 30px;}
#product_info.flexbox{ align-items: flex-start;}
#product_info > div:last-child{ width: Calc(67% - 50px); margin-right: auto;}
#product_info > div:first-child{ width: 33%; padding: 20px 0; background: #fff; position: relative;}
#product_info img{ width: 70%; height: auto; margin: auto; display: block;}
.h_title{ padding-bottom: 3px; margin-bottom: 20px; border-bottom: 1px solid transparent;}
.h_title.in_desk{ display: none;}
#product_info h1, .h_title h1, .h_title h2{ margin-bottom: 10px; font-family: 'SamimBold'; font-size: 25px; font-weight: bold; line-height: 44px; display: inline-block;}
#product_info span.status{ margin: 8px 5px 8px 0; padding: 3px 10px; color: #fff; font-size: 14px; line-height: 23px; border-radius: 3px; display: inline-block; vertical-align: middle; position: relative; bottom: 4px;}
#product_info .brand, .h_title .brand{ font-size: 13px; line-height: 23px; color: gray; font-family:tahoma;}
#product_info .brand i{ color: #9fb1c3; font-size: 14px;}
#product_info .txt{ font-size: 14px; line-height: 25px;}
.unavailable_pro{ display: none;}

#pro_color{ margin: 20px 0 0; position: relative;}
#pro_color ul{ padding: 0; margin:8px 0 0; font-size: 0;}
#pro_color li{ margin:0 0 5px 5px; font-size: 16px; display: inline-block; vertical-align: top;}
#pro_color label{ width: 35px; height: 35px; padding: 4px 10px; text-align: center; border: 5px solid #fff; color: #B3B3B3; box-shadow: 1px 1px 2px 1px #e2e2e2; border-radius: 100%; display: block; cursor: pointer; position: relative;}
#pro_color label.active{ border-color: #1cbfc8;}
#pro_color label.disabled{ opacity:0.1; cursor: default;}
#pro_color label input[type="radio"]{ visibility: hidden; opacity: 0; position: absolute;}
#pro_color .pro_col{ width: 25px; height: 25px; margin-right: 5px; border-radius: 100%; box-shadow: 1px 1px 2px 1px #e2e2e2; position: relative; top: 5px; display: inline-block;}

#product_info .brand p{ display: inline;} 
.top_sub{ margin-left: 10px; font-family: "samimBold"; font-size: 14px;}

#pro_details{ margin-top: 20px;}
#pro_details > div span{ min-width: 80px; display: inline-block; }
#pro_details > div{ margin-bottom: 10px;}
#pro_details > div:first-child{ margin-left: 30px;}

#pro_details select{ min-width: 100px; padding: 5px; background: transparent; border: 1px solid #ccc;}
#pro_details select option{ font-family: tahoma;}

.cost_box{ height: 54px; display: flex; align-items: center; flex-wrap: wrap; margin-right: auto; margin-bottom: 10px;}
.discount{ width: 100%; justify-content: flex-end;}
.discount .text_gray{ color:gray; text-decoration: line-through;}
.discount span{ width: 32px; height: 32px; line-height: 32px; margin-right: 3px; font-size: 12px; text-align: center; background: #d11366; color: #fff; border-radius: 100%; display: inline-block; }
.discount i{font-size: 8px;}
.cost{ width: 100%; text-align: left; font-size: 16px; font-family:'SamimBold'; color: #333;}
.cost i{ vertical-align: middle; color: #d11366; font-size: 19px;}

.off_price{ margin: 0 20px 0 50px;}
.pro_cost{ color: #1B1B1B; font-family: 'SamimBold'; font-size: 18px; line-height: 30px;} 
.pro_cost span{ width: 135px; font-size: 28px; text-align: left; display: inline-block;}
#shop_price{ margin: 30px 0;}
#shop_price .more{ min-width: 220px; margin: 0;}
#shop_ico{ padding: 0; background: #f4f4f4; text-align: center;}
#shop_ico a{ width: 20%; padding: 18px 10px; color: #333; border-left: 1px solid #fff; display: inline-block;}
#shop_ico a:hover{ opacity: 0.7;}
#shop_ico i{ color: #1cbfc8; font-size: 20px;}
#shop_ico h3{ font-size: 11px; line-height: 20px;}
.mrg_box{ margin-top: 75px;}
.mrg_box2{ margin-top: 140px;}
.limit_num{ margin: 15px 0 0; font-size: 14px; color: #b59009;}
.just_cont{ justify-content: flex-end;}
.if_exist{ padding: 2px 0px; border-radius: 5px; font-size: 12px; display: inline-block; margin-bottom: 20px; color: rgb(4, 143, 150)}
.no_exist{ padding: 0px 7px; border-radius: 5px; background: rgb(234, 234, 234); font-size: 12px; display: inline-block; margin-bottom: 20px; margin-top: 20px;}
#send_bann{ width: Calc(100% - 260px);}
#send_bann img{ width: 100%; max-width: 100% !important; margin: 30px auto; display: block;}
@media only screen and  (max-width: 768px){
	#shop_price{ margin: 30px 0 40px 0 !important;}
	#shop_price .more{ padding: 18px 15px !important; font-size: 18px; position: fixed; bottom: 0; left: 0; right: 0; margin: auto; opacity: 1 !important; z-index: 800;}
	#pro_color label{ height: 40px; width: 40px;}
	.off_price{ margin: 0 auto 0 0;}
	#product .more{ border-radius: 0;}
	#shop_ico a{ width: 33.33%; border-bottom: 1px solid #fff;}
	.mrg_box{ margin-top: 0;}
}
@media only screen and  (max-width: 600px){
	#shop_price > div{ width: 100%;}
	#shop_price .stars{ text-align: right !important;}
	.wd100{ width: 100%;}
}
@media only screen and  (max-width: 430px){
	#shop_ico a{ width: 50%;}
}

@media only screen and  (max-width: 1024px){
	#product_info > div:last-child{ width: 100%; padding-top: 15px;}
	#product_info > div:first-child{ max-width: 400px; width: 100%; margin: auto; background: transparent;}
	#product_info img{ width: 100%; max-width: 400px;} 
	#product_info h1{ margin-top: 15px;}
	.h_title.in_desk{ display: block;}
	#product_info .h_title{ display: none;}
	#product_info .rating > label:before { font-size: 45px;}
}

/***** digikala album ******/
#first_album{ width: 100%; height: 100%; margin: auto; position: fixed; left: 0; right: 0; top: 0; bottom: 0; display: none; z-index: 100000000;}
.flexible_box{ background: #fff;}
.pic_txt > div{ width: 100%;}
.pic_txt > div img{ width: 90% !important; margin: 0; /*object-fit: cover !important;*/ display: block;}
#close_album{ padding: 10px 15px; font-family:'SamimBold'; text-align: center; border-bottom: 1px solid #eee; position: relative;}
#close_album i{ color: #048f96; font-size: 25px; position: absolute; left: 10px; top: 10px;}
#album_carousel.flexbox{ margin: 5px 0 5px; flex-wrap: nowrap; justify-content: center; overflow: auto;}
#album_carousel .box_pic{ max-width: 100px; min-width: 100px; margin: 0 5px; border: 2px solid #ddd;}
#album_carousel .box_pic.active{ border: 2px solid #048f96;}
#album_carousel .box_pic img{ width: 100%;}
#album_carousel .box_pic .p_num{ display: none;}
.this_img .img_record{ margin: 20px 0 0; color: #666; font-size: 13px; direction: ltr; display: inline-block; text-align: center;}
.pic_txt > .this_img{ text-align: center;}

/*** gallery albm **/
#album_box{ position:relative; overflow: hidden; margin-top: 20px;} 
#galleryBox{ padding:0; margin:auto; font-size:0; text-align:center; background:#fff; transition: all .5s linear; white-space:nowrap;}
#galleryBox:after{ content:''; clear:both; display:block;}
#galleryBox li{ height:80px; background-size:cover !important; background-position:center !important; position:relative; font-size:14px; display:inline-block; vertical-align:bottom; cursor: pointer; list-style:none;}
#galleryBox li.has_video{ background: #fff !important;}
#galleryBox li video{ height: 100%; width: 100%; display: block}
#galleryBox li:before{ content:"\f00e"; padding-top:85px; color:#fff; position:absolute; top:0; right:0; left:0; bottom:0; font-family:"Font Awesome\ 5 Free"; font-weight:900; font-size:30px; visibility:hidden; opacity:0; transition:all linear 0.5s;}
#galleryBox li.has_video:before{ content:"\f04b"; padding-top:28px; color:#fff; position:absolute; top:0; right:0; left:0; bottom:0; font-family:"Font Awesome\ 5 Free"; font-weight:900; font-size:25px; visibility:visible; opacity:1; text-shadow: 1px 1px 1px #333;}

#galleryBox li:hover{ -webkit-filter: grayscale(0); /* Safari 6.0 - 9.0 */
    filter: grayscale(0);}
#galleryBox li:hover:before{ visibility:visible; opacity:0.8;}
#galleryBox li:hover:after{ visibility:hidden; opacity:0;}
#galleryShow{ max-width: 100%; max-height: 100%; padding:0 10px 10px 10px; background: rgba(0,0,0,.88); position: fixed; top: 0; bottom: 0; left: 0; right: 0; overflow: auto; transform-origin: 50% 0; opacity: 0; visibility: hidden; transition: all .5s linear; z-index: 20000; }
#galleryShowClose{ padding:20px 50px 10px; color: #FFF; font-size: 35px; line-height: 30px; cursor: pointer; transition: all .3s linear; position:relative; z-index:13;}
#galleryShowClose:hover{ opacity:0.5;}
#galleryShowImg{ height: Calc(100vh - 80px); display: flex; flex-direction: column; justify-content: center; overflow: hidden; margin-top: 5px; opacity: 1; transition: all .8s linear; text-align:center; position: relative; cursor: pointer;}
#galleryShowImg > span{ position:relative; display:inline-block;}
#galleryShowImg > span > div{ position:absolute; bottom:5px; left:5px; margin:auto; padding:3px 15px; text-shadow:1px 1px 1px #000; background:rgba(0,0,0,0.5); color:#fff; font-size:13px; display:inline-block;}
#galleryShowImg > span > div:empty{ display:none;}
#galleryShowImg img{ max-width: 100%; width: auto; max-height:460px; margin:auto; display: block;}
#galleryShowImg video{ max-width: 550px; width: 100%; display: none;}
#galleryShowImg video.has_video{ margin: auto; display: block;}
#galleryShowImg i{ width: 50%; height:25px; padding-bottom:100px; margin: auto; font-size: 36px; color: #FFF; text-shadow: 0px 1px 2px #000; position: absolute; top: 0; bottom: 0; z-index: 12; cursor: pointer; transition: all .3s linear; opacity: 0;}
#galleryShowImg i:hover{ opacity:0.5;}
#leftGallerySlide{ padding-left:20px; left: 0; text-align:left;}
#rightGallerySlide{ padding-right:20px; right: 0; text-align:right;}
#galleryShowInfo{ margin-top: 10px; color: #c2c2c2; text-align: center; }
#galleryShowTxt{ line-height: 30px; font-size: 18px; font-family:'SamimBold'}
#galleryShowdetail{ line-height: 18px; font-size: 12px; }
#galleryShow.active{ opacity: 1; visibility: visible; }
#morePic{ width:120px; padding:5px; margin:20px auto 53px; background: #d72d30; font-family:'SamimBold';  border: 2px solid #fff; color: #fff; font-size: 14px; text-align:center; cursor:pointer; display:none; transition: all linear 0.2s;}
#morePic:hover{ opacity:0.5;}
#morePic i{ margin-right: 5px; color: #fff; vertical-align: middle;}
#nex_mtlbkh,#pre_mtlbkh{ width:30px; padding-top:30px; font-size: 20px; text-align:center; margin: auto; position: absolute; top: 0; bottom: 0; color: #FFFFFF; cursor: pointer; transition: all .3s linear; z-index:800; opacity:.7;}
#pre_mtlbkh{ padding-left:5px; right: 0px; color: #048f96; text-align: right;}
#nex_mtlbkh{ padding-right:5px; left: 0px; color: #048f96; text-align: left;}
#nex_mtlbkh:hover,#pre_mtlbkh:hover{ opacity:0.4;}

@media only screen and  (max-width: 768px){
	#leftGallerySlide, #rightGallerySlide{ opacity:0.5 !important;}
}

#pro_explain table{ max-width:100%; width: 100%; margin:10px 0; text-align:center;}
#pro_explain table tr td{ padding:5px 8px; background:#F8F8F8; font-size: 15px; border:1px solid #fff; transition:all linear .2s;}
#pro_explain table tr td:last-child{ text-align: right;}
#pro_explain table tr:nth-child(2n-1) td{ background:#eee; border-colr:#fff;} 
#pro_explain table tr:first-child td{ background:#373737; color:#fff; font-size:16px; font-family: "SamimBold";}
#pro_explain .textbox{ max-width: 900px; margin: auto; font-size: 15px; text-align: right;}
#gray_sec{ background: #f4f4f4; padding: 1px 0;}
#gray_sec .titlebox i{ background: #f4f4f4;}
@media only screen and  (max-width: 768px){
	#pro_explain img{ width: 100%; max-width: 400px; height: auto; margin: 20px auto; display: block; float: none !important;}
}
@media only screen and  (max-width: 600px){
	#pro_explain table tr td, #pro_explain table tr{ display: block; text-align: center !important;} 
	#pro_explain table tr:first-child{ display: none;}
	#pro_explain table tr td:nth-child(1){ background:#373737; color:#fff; font-family: "SamimBold";}
	#pro_explain table tr td:nth-child(1):before{ content:'ویژگی: ';}
	#pro_explain table tr td:nth-child(2):before{ content:'توضیحات: '; color: #373737; font-family: "SamimBold"; }
}

#pro_explain{ margin-top: 30px;}
#each_sec{ margin-bottom: 70px;}
.info_table .info_row > div{ padding: 5px 10px; margin-bottom: 3px; background: #f4f4f4; font-size: 14px;}
.info_table .info_row > div:first-child{ width: 20%; color: #373737; font-family: "SamimBold"; border-left: 3px solid #fff;}
.info_table .info_row > div:last-child{ width: 80%;}
.info_item .info_row:nth-of-type(2n) > div{ background: #ededed;}
.info_row .fa-times{ color: #0f8f77;}
.info_row .fa-check{ color: #ff3e3e;}
.info_item .subject{ margin-bottom: 5px; font-size: 17px; display: block;}
.info_item .subject i{ color: #1cbfc8; padding-left: 4px;}
.info_item h3{display: inline-block; font-family: "SamimBold"; padding-right: 5px; padding-top: 20px; padding-bottom: 5px; font-size: 16px;}
.info_item h3:nth-of-type(1){padding-top: 0px;}
.info_item i{display: inline-block; color: #1cbfc8; font-size: 5px;}
@media only screen and  (max-width: 600px){
	.info_table .info_row > div{ width: 100% !important; background: #fff;}
	.info_table .info_row > div:first-child{ background: #f4f4f4 !important; border: none;}
	.info_table .info_row > div:last-child{ margin-bottom: 20px;}
	.info_item .info_row:nth-of-type(2n) > div{ background: #fff;}
}


/** rating **/
.stars{ width:100%; min-height: 50px; margin:20px 0 20px; text-align:right;}
.stars img{ width: 30px; height:auto; float: right !important;}
.stars i{color:#F7BB06 !important; font-size:18px; vertical-align:middle;}
.stars span{font-size:14px; display:inline-block; margin-top:10px; }
#star1,#star2,#star3,#star4,#star5{width:85px; background:url(images/symbol/stars.png) no-repeat; height:15px; }
#star1{background-position:0px 0}
#star2{background-position:0px -15px}
#star3{background-position:0px -30px}
#star4{background-position:0px -45px}
#star5{background-position:0px -60px;}
/****** Style Star Rating Widget *****/
.rating { 
  border: none;
  padding:0;
  margin:7px 0 0;
  text-align:center;
  direction:ltr;
  display:inline-block;
}

.rating > input { display: none; } 
.rating > label:before { 
  font-size: 30px;
  display: inline-block;
  font-family:"Font Awesome\ 5 Free";
  font-weight:900; 
}
.rating #s1:before { content: "\f556";}
.rating #s2:before { content: "\f119";}
.rating #s3:before { content: "\f11a";}
.rating #s4:before { content: "\f118";}
.rating #s5:before { content: "\f599";}

.rating > .half:before { 
  content: "\f089";
  position: absolute;
  font-family:"Font Awesome\ 5 Free"; 
  font-weight:900;
 }

.rating > label { 
  color: #bcbcbc; 
  cursor:pointer;
  display:inline-block;
}

/***** CSS Magic to Highlight Stars on Hover *****/
.rating > input:checked ~ label, /* show gold star when clicked */
.rating:not(:checked) > label:hover, /* hover current star */
.rating:not(:checked) > label:hover ~ label { color: #F7BB06;  } /* hover previous stars in list */
.rating > input:checked + label:hover, /* hover current star when changing rating */
.rating > input:checked ~ label:hover,
.rating > label:hover ~ input:checked ~ label, /* lighten current selection */
.rating > input:checked ~ label:hover ~ label { color: #F7BB06;  } 
#wantstar{ padding:0 0 3px; margin-right: 10px; border:none; border-bottom:3px solid #fc3; font-family:"SamimBold"; font-size:13px; transition:linear .2s; cursor:pointer;}
#wantstar:hover{background:transparent; opacity:0.6;}
#givestar{transition: visibility 0s, opacity 0s linear;}
#givestar button{ -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none;  border: none; font-size:13px; position:relative; top:4px; color:#413F3F; transition:linear .2s; left:5px; border-radius:3px; background:#fc3; min-width: 120px; padding: 0 0 1px 0; float:left; margin-right:15px; margin-left:-5px;}
#givestar button:hover{background:#F3B600; cursor:pointer;}
.results{ margin-top:0 !important; font-size:15px; background: #faf8a0d1; padding:8px 20px; color: #333; border-radius: 20px; font-family: SamimBold;}
.results i{ margin-left:4px; color:#fff;}
.results a{ text-shadow: none;}
.rate_box{ margin-top: 0 !important; padding:8px 15px; background: #F4F4F4; direction: ltr;}
.rate_text{ margin:0 0 0 15px !important; display:inline-block; direction:rtl; font-size:12px !important;}
.rate_text b{ font-size:15px}
.stars .gray{ color:gray !important;}
#starBox .rating{ margin:7px 15px 0 0;}
#starBox .stars span{ margin-right: 15px;}
#starBox .rate_box{ padding: 8px 0;}
.dis_none{ display: none;}
@media only screen and  (max-width: 1160px){
	#starBox .stars{ min-height: 89px;}
}
@media only screen and  (max-width: 500px){
	.stars{ min-height: 92px;}
	#showstar{ display: block;}
}
@media only screen and  (max-width: 900px){
	.rate_box{ background: transparent;}
	#starBox #showstar{ display: flex; justify-content: center;}
	#starBox .stars span, #starBox .rating{ margin-right: 0;}
	#starBox #wantstar{ margin-right: 15px !important;}
	#starBox .stars{ min-height: 50px; text-align: center;}
}
@media only screen and  (max-width: 380px){
	#starBox .stars{ min-height: 86px;}
	#starBox .rate_box{ width: 100%;}
	#starBox .w100{ width: Calc(100% - 20px);}
	#starBox #wantstar{ width: Calc(100% - 20px); padding: 0 20px 3px; margin-right: 0 !important;}
}
/** end rating **/

/**** handle counter ****/
.handle-counter { overflow: hidden; font-size: 0; background: #fff; border: 1px solid #ccc; border-radius: 5px;}
.handle-counter .counter-minus,  .handle-counter .counter-plus, .handle-counter input { width: 40px; height: 40px; padding: 0; background: transparent; font-size: 17px; vertical-align: bottom; text-align: center; transition: all linear 0.2s;}
.handle-counter input {
	border-width: 1px;
	border-left: none;
	border-right: none;
	font-family: "SamimBold";
	background: transparent;
	color: #1cbfc8;
	border: none;
}

.btn {
  padding: 6px 12px;
  border: 1px solid transparent;
  color: #fff;
}

.btn:disabled, .btn:disabled:hover {
  color: darkgrey;
  cursor: not-allowed;
}
.btn-primary { vertical-align: top; color: #1cbfc8;}
.btn-primary i{ padding: 0; vertical-align: baseline; font-size: 13px;}
.btn-primary:hover, .btn-primary:focus {}
@media only screen and (max-width:768px){
	.handle-counter input, .handle-counter .counter-minus, .handle-counter .counter-plus{  font-size: 20px;}
	.btn-primary i{ font-size: 18px;}
}
/**** end handle counter ****/

/******************************* order ******************************/
#order_head{ padding: 25px 15px 35px; background: #fff; border:10px solid #eeeff1;}
#order_head .flexbox{ justify-content: center;}
#order_head img{ width: 115px; display: block;}
#order_head #level{ width: 100%; margin: auto;}

#level{ max-width: 100%; width: 100%; padding: 30px 0 0; margin: auto; font-size: 0;}
#level li{ width: Calc(20% + 5px); height: 5px; background: #dbdbdb; color: #999; font-size: 13px; font-family: samimBold; display: inline-block; position: relative; vertical-align: top;}
#level li span{ width: 25px; height: 25px; line-height: 27px; background: #dbdbdb; position: absolute; top: -11px; right: -2px;  text-align: center; border-radius: 100%; display: inline-block;} 
#level li b{ width: 88px; margin-top: 15px; line-height: 20px; position: relative; left: 32px; text-align: center; display: inline-block;}
#level li.active{ background:#1cbfc8; color: #333;}
#level li.active span{ background: #1cbfc8; color: #fff;}
#level li:first-child{ width: Calc(20% - 20px);}
#level li:last-child{ width: 0; background: none; white-space: nowrap;}
@media only screen and (max-width:768px){
	#level li b{ width: 77px; font-size: 12px; left: 27px;}
}
@media only screen and (max-width:320px){
	#level li b{ width: inherit; left: 15px;}
}

#register{ margin: 50px 0;}
#register .bg_gray{ padding: 20px; background: #f5f5f5; border-radius: 5px;}
.bg_gray > .flexbox{ align-items: stretch;}
.bg_gray > .flexbox > div{ width:Calc(33.33% - 7px); padding: 10px; margin: 0 0 10px 10px; background: #f5f5f5; border: 1px dashed #ddd; display: flex; align-items: flex-end;}
.bg_gray > .flexbox > div > div{ width: 100%;}
.bg_gray > .flexbox > div:nth-child(5n),.bg_gray > .flexbox > div:last-child{ margin-left: 0;}
.bg_gray > .flexbox > div input{ width: 100%; height: 40px; padding: 5px; background: transparent; font-size: 16px; border: 1px solid #ccc; color: #333;} 
.bg_gray > .flexbox > div .sub_top{ padding: 5px 5px 3px; font-size: 14px; line-height: 22px; font-family: "samimBold"; display: block;}
.bg_gray > .flexbox > div .sub_top b{ color: red; font-size: 12px; font-family: samim; line-height: 20px;}
.sub_top .num_cnt{ margin: 0 10px 0 0; font-family: "samim"; font-size: 12px; text-align: right; color: gray; display: inline-block;}
.bg_gray select{ width: 100%; height: 40px; padding: 5px; background: transparent; font-size: 16px; border: 1px solid #ccc; color: #333;}
.bg_gray select option{ font-family: "tahoma";}
.bg_gray .birthday select:first-child{ width:26%;}
.bg_gray .birthday select:nth-child(2){ width: 40%; margin: 0 2%;}
.bg_gray .birthday select:nth-child(3){ width: 30%;}
.bg_gray > .flexbox textarea{ width: 100%; padding: 5px; background: transparent; font-size: 16px; border: 1px solid #ccc; color: #333; resize: none;}
.bg_gray > #part_bt{ align-items: flex-end;} 
.bg_gray > #part_bt > div{ width: Calc(67% - 7px); margin-bottom: 0;}
.bg_gray > #part_bt.w100 > div{ width: 100%;}
.bg_gray > #part_bt button{ width: Calc(33.33% - 8px); margin: 0; position: relative; bottom: 1px;}
.bg_gray > .flexbox > .w40{ width: Calc(67% - 7px);}
#send_time{ margin: 20px 0 0;}
#send_time .more{ margin-bottom: 0;}
#hidetime{ display: none;}
#hidetime .text{ font-size: 15px;}
#hidetime .text i{ margin-left: 5px; color: #1cbfc8;}
#citySectionLegal{ height: 40px; font-family: "samim" !important; font-size: 14px; display: flex; align-items: center;}

#sending > div{ margin: 0 0 20px 15px;}
#sending .gray{ color: #999; font-size: 12px; line-height: 23px;}
#sending .interval label{ padding: 10px; margin: 0 0 0 3px; border: 2px solid #eee; border-radius: 5px; cursor: pointer; position: relative;}
#sending .interval label.active,#method label.active{ border-color: #048f96; background: #d0fdff;}
#sending input[type="radio"]{ position: absolute; visibility: hidden; opacity: 0;}

#method{ margin: 20px 0 0;}
#method label,#showmess{ padding: 10px; margin: 5px 0; border: 2px solid #eee; border-radius: 5px; display: inline-block;}
#showmess{ width: max-content; margin: 30px auto; background: #ffd6d6; border-color: #ff5151; display: block;}
#showmess a{ color: #048f96; font-family: "samimBold"}

@media only screen and (max-width:1024px){
	.bg_gray > .flexbox > .w40, .bg_gray > #part_bt > div{ width: Calc(67% - 7px);}
	.bg_gray > #part_bt button{ width: Calc(33.33% - 7px);}
}
@media only screen and (max-width:700px){
	.bg_gray > .flexbox > div{ width: 100% !important; margin: 0 0 10px !important;}
	.bg_gray > #part_bt button{ width: 50%;}
	.bg_gray > .flexbox > div input, .bg_gray select{ height: 50px; font-size: 18px;}
	.bg_gray > .flexbox textarea, #citySectionLegal{ font-size: 18px;}
	.bg_gray > .flexbox > div .sub_top{ font-size: 17px; line-height: 30px;}
	.bg_gray > .flexbox > div .sub_top b{ font-size: 14px; line-height: 24px;}
}
@media only screen and (max-width:500px){
	.bg_gray > #part_bt button{ width: 100%;}
}

#freeze_order{ margin: 30px 0 60px 0;}
#box_right{ width: Calc(100% - 320px); padding: 20px; border: 4px solid #f4f4f4; border-radius: 5px; float: right;}
#box_right #register{ margin: 0;}
#box_right .bg_gray{ padding: 0; background: none;}
#box_right .bg_gray > .flexbox > div{ background: none;}

#cart{ margin: 30px 0 60px;}
.no_login{ max-width: max-content; padding: 5px 10px; margin-bottom: 15px; background: #222; color: #fff; border-radius: 5px;}
.no_login .more{ margin: 5px;}
.h2_title{ margin-bottom: 20px; font-family: "samimBold"; font-size: 23px; line-height: 35px;} 
.h2_title i{ color: #1cbfc8; font-size: 22px;}
#freeze:after, #freeze_order form:after{ content: ""; clear: both; display: block;}
#left_freeze, #l_freeze{ width: 300px; margin-right: 20px; padding: 15px; background: #f4f4f4; border-radius: 5px; float: left;}
#left_freeze .cost_num, #l_freeze .cost_num{ padding-bottom: 3px; color: gray; font-size: 14px; border-bottom: 1px solid #ddd;}
#left_freeze .off_cost, #l_freeze .off_cost{ color: #d11366;}
.mrg_right{ margin-right: auto;}
.off_code{ color: #d11366 !important;}
#left_freeze .costbox, #l_freeze .costbox{ padding-top: 10px; font-family: "samimBold"; font-size: 14px;}
#left_freeze .costbox .price, #l_freeze .costbox .price{ margin-right: auto;}
#left_freeze .more, #l_freeze .more{ width: 100%; margin-bottom: 0;}
#left_freeze .more i, #l_freeze .more i{ position: relative; top: 2px;}
#fix_cost .fix_price{ display: none;}
.send_txt{ font-size: 12px; line-height: 20px; color: gray;}
.go_bank{ width: 80%;margin: auto;font-size: 25px;color: #d35757;text-align: center;margin-top: 50px;font-family: samimBold;padding: 20px;}
.price_off{ max-width: 350px; margin-top: 10px;}
.price_off input{ width: Calc(100% - 80px); height: 35px; padding: 5px; background: #ffebf4; border: 1px dashed #d11366 !important; border-radius: 5px;}
.price_off #count_off{ width: 75px; margin-right: auto; height: 35px; line-height: 35px; background: #d11366; color: #fff; font-size: 14px; text-align: center; border-radius: 5px; display: inline-block; cursor: pointer; transition: all linear 0.2s;}
.price_off #count_off:hover{ opacity: 0.7;}

#cart_box{ width: Calc(100% - 320px); padding: 20px; border: 4px solid #f4f4f4; border-radius: 5px; float: right;}
#cart_box .cart_item{ padding-bottom: 10px; margin-bottom: 10px; align-items: stretch; border-bottom: 1px dashed #ddd;}  
#cart_box .cart_item:last-child{ margin-bottom: 0; padding-bottom: 0; border-bottom: none;}
#cart_box .cart_item .pointing{ align-items: flex-end;}
#cart_box .cart_img{ width: 120px;}
#cart_box .cart_img img{ width: 100%; display: block; transition: all linear 0.2s;}
#cart_box .cart_img img:hover{ opacity: 0.7;}
#cart_box .cart_info{ width: calc(100% - 120px); padding: 0 30px 0 0;}
#cart_box .cart_info h3{ margin-bottom: 7px; color: #333; font-size: 17px; line-height: 28px; font-family: "samimBold"; font-weight: bold;}
.cart_cost{ margin-right: auto; text-align: left;}
.cart_cost .cost_pro{ font-size: 17px; font-family: "samimBold";}
.cart_cost .cost_pro b,.toman{ font-size: 12px; font-family: "samim";}
.cart_cost .cart_off{ margin-bottom: 5px; color: #d11366; font-size: 12px;}
.cart_cost .cart_off span{ display: inline-block;} 
.font15{ font-size: 15px;}
.cart_del{ padding: 10px 10px 0; margin-right: 20px; color: #666; font-size: 14px; cursor: pointer; transition: all linear 0.2s;}
.cart_del:hover{ color: rgba(237,54,57,1.00);}
.pro_details{ font-size: 14px; line-height: 25px;}
.pro_details > div{ margin-left: 20px;} 
.pro_details i{ vertical-align: middle;}
.return{ margin-top: 7px; color: #1795e1; font-size: 14px; display: inline-block;}
.return:hover{ opacity: 0.7;}
.return i{ margin-left: 3px; font-size: 17px; vertical-align: middle;}

@media only screen and (max-width:1024px){
	#cart_box, #box_right{ width: 100%;}
	#box_right{ margin-bottom: 0;}
	#left_freeze, #l_freeze{ width: 100%; margin: 20px 0 0 !important; position: static !important;}
	#fix_cost{ padding: 10px; background: #fff; position: fixed; bottom: 0; left: 0; right: 0; box-shadow: 0px 1px 6px 0px #9d9d9d; flex-direction: row-reverse; z-index: 900;}
	#fix_cost .fix_price{ font-size: 17px; font-family: "samimBold"; text-align: left; display: block;}
	.fix_price .p_sub{ color: gray; font-size: 12px; font-family: "samim";}
	#left_freeze .more, #l_freeze .more{ width: inherit; margin: 0 0 0 auto !important;}
	#l_freeze .more span{ display: none;}
	#freeze_order{ margin: 30px 0 60px;}
}
@media only screen and (max-width: 550px){
	.pointing{ margin-top: 15px; display: block;}
	.pointing .cart_cost{ margin: 10px 0 0; text-align: right;}
	#cart_box .cart_info{ width: Calc(100% - 90px); padding: 0px 10px 0 0;}
	#cart_box .cart_img{ width: 90px;}
	#cart_box .cart_info h3{ font-size: 15px; line-height: 26px;}
	.cart_cost .cart_off{ margin-bottom: 0;}
	.cart_cost .cost_pro{ line-height: 17px;}
	.cart_cost .cost_pro span{ min-width: 55px; display: inline-block;}

}
@media only screen and (max-width:500px){
	.cart_cost{ width: 100%; margin-top: 15px;}
	#cart_box .cart_img img{ max-width: 100%;}
}

/*** if empty ***/
.if_empty img{ width: 170px; margin: auto; display: block;}
.if_empty > div:first-child{ margin-left: 30px;}
.if_empty .more{ margin: auto;}
.if_empty .new_link{ margin-top: 5px; font-size: 14px;}
.if_empty .new_link a{ color: #048f96;}
.if_empty .new_link a:hover{ opacity: 0.7;}
.if_empty .more i{ position: relative; top: 3px;}
@media only screen and (max-width:600px){
	.if_empty{ text-align: center; display: block;}
	.if_empty > div:first-child{ margin: 0 0 20px;}
}

/****** login ******/
#input-phone::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  direction:ltr !important;
  text-align:left;
  font-size: 23px;
}
#input-phone::-moz-placeholder { /* Firefox 19+ */
  direction:ltr !important;
  text-align:left;
  font-size: 23px;
}
#input-phone:-ms-input-placeholder { /* IE 10+ */
  direction:ltr !important;
  text-align:left;
  font-size: 23px;
}
#input-phone:-moz-placeholder { /* Firefox 18- */
  direction:ltr !important;
  text-align:left;
  font-size: 23px;
}

.titr_lgn{ font-size: 30px; line-height: 40px; font-family:'samimBold';color: #fff; margin: 0px auto 30px;z-index: 2;position: relative;width: max-content;}
#go_login{ background:url(images/background/login.jpg); background-size: cover !important; background-position: center !important;}
#go_login .top_course{ position: relative; overflow: hidden; flex-direction:row;}
#go_login .top_course.second{ flex-direction:row; background: radial-gradient(circle, rgba(59,55,56,1) 0%, rgba(25,25,25,1) 100%);}
#go_login .top_course .picbox{ min-height:620px; width: 100%; max-width:700px; background-size:cover !important; background-position:50% 50% !important; position: relative; z-index: 1;text-align: center;padding: 20px 0 30px;display: flex;background: #09090b87;flex-direction: column;    justify-content: flex-start;align-items: center;}
#go_login .lnk_sit{width: 100%;text-align: right;}
#go_login .lnk_sit a{padding: 5px 20px 5px;background: #ffffff21;font-family: samim;color: white;margin: 0;font-size: 13px; line-height:25px; display: inline-flex; align-items: center;justify-content: center;transition: all linear 0.2s; border-bottom-left-radius: 50px;border-top-left-radius: 50px;}
#go_login .lnk_sit a i{margin-left: 4px;font-size: 17px;}
#go_login .lnk_sit a:hover{background: #ffffff47}
#go_login .lnk_pos{ position: absolute; right: 0; bottom: 20px;}
#go_login .top_course .picbox > div.login{ padding-top: 20px;}
#go_login .pico{min-height: 100vh!important;align-items: center;}
#go_login .pico .login{margin: auto;}
@media only screen and (max-width:1024px){
	#go_login .top_course{ flex-direction:row;}
	#go_login .top_course .picbox{ max-width: 100%; width:100%; min-height: 300px; padding: 10px 0 80px;} 	
}

#cer-ind #course_step{ max-width:600px; padding: 0; font-family:samim; justify-content: center; list-style:none; font-size:0; text-align:center; margin:auto; display:flex; display:-webkit-flex; display:-ms-flexbox;}
#cer-ind #course_step li{ height: 60px; margin:5px 0px 5px;color: white; padding:15px 18px; position:relative; text-shadow:1px 1px 1px #333; display:flex; display:-webkit-flex; display:-ms-flexbox; flex-wrap:wrap; align-items:center;}
#cer-ind #course_step li:nth-child(1){ background:#00BDC6; border-radius: 0 5px 5px 0;}
#cer-ind #course_step li:nth-child(1):after{ border-right: 12px solid #00BDC6;}
#cer-ind #course_step li:nth-child(2){ background:#19A8AF;}
#cer-ind #course_step li:nth-child(2):after{ border-right: 12px solid #19A8AF;}
#cer-ind #course_step li:nth-child(3){ background:#048f96; border-radius: 5px 0 0 5px;}
#cer-ind #course_step li:after{ content:""; width: 0; height: 0; position:absolute; right:100%; top:0; z-index:10; border-top: 30px solid transparent; border-bottom: 30px solid transparent;}
#cer-ind #course_step li:last-child:after{ display:none;}
#cer-ind #course_step li .numerical{ width:30px; font-size:35px; color: #fffef1; font-family:samimBold; display:block; vertical-align:top; position:relative; top:5px;}
#cer-ind #course_step li .SelectCourse{ font-size:15px; line-height:25px; text-align:right; display:block;}
#cer-ind #course_step li div{display: flex;margin: auto;text-align: right;justify-content: center; align-items:center;}
.btn-grn { background: #048f96; color: white; border: 1px solid #048f96; border-radius: 5px; margin: 10px 0 0; font-size:16px; font-family:samim; transition: all .2s; height: 45px; width: 250px;}
.btn-grn:hover { opacity: 0.7;}
@media only screen and (max-width: 580px){
	#cer-ind #course_step{ max-width:580px; display:block;width: 95%;}
	#cer-ind #course_step li{ width:100%; padding:15px 10px; margin:0px auto !important; display:inline-block;}
	#cer-ind #course_step li:nth-child(1){ border-radius: 5px 5px 0 0;}
	#cer-ind #course_step li:nth-child(3){ border-radius: 0 0 5px 5px;}
	#cer-ind #course_step li:after{ top:100%; left:0; right:0; margin:auto; border-bottom:none; border-left: 20px solid transparent; border-right: 20px solid transparent !important; border-top: 15px solid transparent;}
	#cer-ind #course_step li:nth-child(1):after{ border-top: 10px solid #00BDC6;}
	#cer-ind #course_step li:nth-child(2):after{ border-top: 10px solid #19A8AF;}
	#cer-ind #course_step li span{ display:inline-block !important;}
	#cer-ind #course_step li{padding: 20px 10px;}
	#cer-ind #course_step li div{justify-content: center;}
	#cer-ind #course_step li .SelectCourse{ font-size:20px; line-height:32px;}
}

.box-phone{ max-width:100%; width:100%; height: auto; min-height: 231px; background: rgba(193, 206, 204,.1);display: flex;flex-direction: column;align-items: center;margin:5px 0px 50px;border-radius: 5px;justify-content: space-around;padding:20px; font-family:samim;}
.box-phone form{display: flex;align-items: center;flex-direction: column}
.text-box-phone{text-align: center;}
.text-box-phone p{font-size: 15px; line-height:28px; text-align: center;color:white;}
.error-style p{color: #f8afaf;text-align:center;font-family: samimBold; line-height:28px;}
.error-style{ display: flex;align-items:center;justify-content: center; margin: 10px auto 15px; border-radius:4px; background:#ffffff26; padding:5px; max-width:600px; width:100%;}
.cng-mobile { color: #a8fbff; border-bottom: 1px dashed #a8fbff; font-size: 12px;}
#input-phone{ border: 1px solid #ddd; height: 45px;width: 250px;margin: 20px 0 0;background: #ddd;letter-spacing: 8px;font-size: 23px; font-family:samim; padding: 0 10px;border-radius: 5px;}
#input-num{ direction: ltr; border: none;-webkit-box-shadow: none;box-shadow: none;outline: none;letter-spacing: 38px;font-size:25px;width:270px; margin-bottom: 0; padding-bottom: 0;background: transparent;color: #fff; position: relative; left: 18px;}
.border-input {height: 2px;width: 250px; margin-top: 0;padding-top: 0;background-image: -webkit-gradient(linear,left top,right top,from(#ffffff ),color-stop(75%,#ffffff ),color-stop(75%,transparent),to(transparent));background-image: linear-gradient(90deg,#ffffff ,#ffffff  75%,transparent 0,transparent); background-size: 3.5em 1px;border: none; }
#alarm-text{color: white;min-width: 200px;display: flex;justify-content: center; line-height:28px;}
.alarm-ntfc { text-align: center;background: #ffdeab7a;color: white; border-radius: 3px;width: 95%;margin:auto auto 20px; padding: 8px;line-height: 42px;font-size: 16px;max-width:600px;height:max-content}
.alarm-ntfc a {color:#1064ac}
#timer{ width:50px;}
.reg_text{ color: #fff; font-size: 15px; text-decoration: underline; transition: all linear 0.2s;}
.reg_text:hover{ opacity: 0.7;}
.padL7px{padding-left:7px}
#recive-code-again{ padding: 3px; background: #373737;border: 1px dashed #656565;border-radius: 5px;color: white;min-width: 200px; display: none; line-height:28px; font-family:samim;}
.hligt { border-bottom: 1px dashed #f8bbd9; color: #f8bbd9; font-size: 15px;}
.pos_rel{ position: relative;}
@media only screen and (max-width: 1139px){
	.error-style{margin: 10px auto 35px;}
	.box-phone{margin: 15px auto 0;}
}
@media only screen and (max-width: 768px){
	#input-phone, .btn-grn{ height:55px; }
}
@media only screen and (max-width: 600px){
	.box-phone{width: 95%;}
}

#head_panel{ background: #f4f4f4; padding: 10px 0 15px;}
#head_panel h1{ margin: 0 0 30px;  font-family: "SamimBold"; font-size: 26px; line-height: 38px; display: block;}
#head_panel h1 span{ color: gray;}

/**** register ****/
#reg_box input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  font-size: 16px;
}
#reg_box input::-moz-placeholder { /* Firefox 19+ */
  font-size: 16px;
}
#reg_box input:-ms-input-placeholder { /* IE 10+ */
  font-size: 16px;
}
#reg_box input:-moz-placeholder { /* Firefox 18- */
  font-size: 16px;
}
#reg_box{ padding: 20px;}
#reg_box .text-box-phone{ margin-bottom: 15px; color: #fff; font-size: 15px; line-height: 28px;}
#reg_box input[type="text"], #reg_box input[type="number"]{ height: 45px; width: 250px; margin: 10px 0 0; background: #ddd; font-size: 16px; font-family: samim; padding: 0 10px; border-radius: 5px; border: 1px solid #ddd;}
#reg_box #sex{ max-width: 250px; width: 100%;} 
#reg_box #sex label{ width: Calc(50% - 5px); height: 45px; line-height: 45px; padding:0 10px; color: #fff; border: 1px dashed #ccc; border-radius: 2px; cursor: pointer;}
#reg_box #sex label:first-child{ margin-left: 10px;}
#reg_box #sex label.active{ border-color: #58ce76;}
#reg_box input[type="radio"]:checked { background: #58ce76; border: 1px solid #58ce76;}
@media only screen and (max-width: 768px){
	#reg_box input[type="text"], #reg_box input[type="number"], #reg_box #sex label{ height:55px; line-height: 55px; font-size: 20px;}
	#reg_box .text-box-phone, .reg_text, .text-box-phone p{ font-size: 17px;}
	.btn-grn{ font-size: 20px;}
}

/*********** profile ***********/
.top_mess{ margin: 50px 0; padding: 20px; background: #f4f4f4; font-size: 18px; font-family:"samimBold"; border: 1px dashed #ddd; border-radius: 5px; text-align: center;}
.top_mess i{ margin-left: 5px; color: #1cbfc8; font-size: 22px;}
.lnh_35{ line-height: 35px;}
.fsahel{ font-family: samim;}
.a_color{ color: #0b9de3;}
.a_color1{ color: #2f608b;}
.font18{ font-size: 18px;}
.just_flex{ justify-content: center !important;}
.t_center{ text-align: center !important;}
.full_hgt{ height: Calc(100vh - 320px);}
.full_hgt1{ height: Calc(100vh - 295px);}
#mem_info{ margin: 60px 0;}
.m_width{ max-width: 1040px; margin: 60px 0 !important;}
.mem_column{ font-size:15px; line-height:27px; padding:20px; background: #f4f4f4; border: 1px dashed #ddd; border-radius: 5px;}
.mem_column .flexbox{ align-items: stretch;}
.mem_column .flexbox > div{ width:Calc(50% - 7.5px);} 
.mem_column .flexbox > div:first-child{ margin-left:15px;}
.mem_column .flexbox > div span{ padding:5px; font-family:"samimBold"; display:inline-block;}
.mem_column .flexbox > div .ltext{ font-family: "samim";}
.mem_column .flexbox > div .more{ margin: 0; }
.mem_column .flexbox > div > div{ padding: 5px 8px; margin-bottom: 8px; background: #fbfbfb; border-right: 2px solid #1cbfc8;}
.mem_column .more{ margin-bottom: 0;}
.mem_column .more i{ padding-right: 0; margin-bottom: 0;}
@media only screen and  (max-width: 768px){
	.mem_column .flexbox > div{ width:100%; padding:0 !important; margin: 0 !important;}
	.mem_column{ font-size:18px; line-height:30px;}
}

/*********** history list ***********/
#list_his{ width: 100%;}
#list_his tr td{ padding: 5px 8px; font-size: 14px; border-bottom: 1px dashed #ddd; border-left: 1px dashed #ddd;} 
#list_his tr td:first-child{ width: 50px; text-align: center;}
#list_his tr td:last-child{ width: 150px; text-align: center;}
#list_his tr td:last-child{ border-left: none;}
#list_his tr:first-child td{ height: 52px; font-family: "samimBold"; font-size: 15px; background: #f4f4f4;} 
#list_his tr:last-child td{ border-bottom: none;}
#list_his .more{ width: 100%; margin: 0;}
@media only screen and  (max-width: 600px){
	#list_his tr td, #list_his tr{ width: 100% !important; text-align: right; display: block;}
	#list_his tr:last-child td{ border-bottom: 1px dashed #ddd;}
	#list_his tr td{ padding: 8px; border-left: none; text-align: right !important;}
	#list_his tr td:last-child{ border-bottom: none;}
	#list_his tr{ margin-bottom: 20px; border: 1px solid #ddd;}
	#list_his tr:first-child{ display: none;}
	#list_his td:first-child{ background: #f4f4f4; font-size: 18px;}
	#list_his td:before{ padding-left: 5px; font-family: "samimBold";}
	#list_his td:nth-child(1):before{ content: "ردیف";}
	#list_his td:nth-child(2):before{ content: "نوع ثبت:";}
	#list_his td:nth-child(3):before{ content: "تاریخ:";}
	#list_his td:nth-child(4):before{ content: "مبلغ:";}
	#list_his td:nth-child(5):before{ content: "وضعیت:";}
	#list_his td:nth-child(6):before{ content: "مشاهده جزییات:";}
}

#date_filter{ padding: 35px 0 10px; margin-bottom: 20px; border-bottom: 2px solid #ddd;}
#date_filter ul{ padding: 0; margin: 0; font-size: 0;}
#date_filter ul li{ margin:10px 0 0 15px; font-size: 14px; display: inline-block;}
#date_filter ul select{ height: 40px; padding: 5px; border: 1px solid #eee; font-size: 14px;}
#date_filter ul select option{ font-family: tahoma;}
#date_filter .more{ min-width: 100px; height: 40px; padding: 0 !important; margin: 0;}
@media only screen and  (max-width: 500px){
	#date_filter ul li{ margin-left: 0; display: block;}
	#date_filter ul li span{ margin-bottom: 5px; display: block;}
	#date_filter ul select{ height: 50px;}
	#date_filter .more{ height: 45px;}
}

.historypg{ font-size: 14px; text-align:left; display: block; margin: 5px 0;}
.historypg a{ color: #069; }
.historypg a:hover{ color: #0f8f77; }
.historypg i{ margin: 0 3px; position: relative; top: 2px; }

/****** register *******/
.alert{margin: 0px auto 30px;color: #e3995a;padding: 10px 0;width: 95%;border-radius: 5px;background: #fff0cd1a;}
.not_01{background: rgb(193, 206, 204);padding-top: 10px;padding-bottom: 10px;width: 95%;margin:0 auto 30px;color: #22723b;font-size: 17px;line-height: 40px;height: max-content; border-radius: 5px;}
.not_01 a{color:#1064ac;}
.wrong-code{color:red;font-size: 12px;margin-top: 5px;line-height: 18px}
.correc-code{color:#048f96;font-size: 12px;margin-top: 5px;line-height: 18px}


/*********** history ***********/
#status{ max-width: 400px; width: 100%; margin: 30px 0; padding: 20px; background: #f4f4f4; font-size: 18px; line-height: 30px; text-align: center; border: 1px dashed #ddd; border-radius: 5px;}

/*pish faktor css*/
#bpishfaktor{
    max-width:1040px;
    padding: 20px;
	background: #f4f4f4;
    line-height: 20px;
    font-size: 17px;
	font-family:samim;
	border:1px dashed #ddd;
	border-radius: 5px;
}
.dv_butt{ margin-top:20px; justify-content:center;}
.dv_butt .more{ width:160px; margin:3px;}
.dv_butt .more i{ padding:0 0 0 5px;}
@media only screen and  (max-width: 680px){
	.dv_butt{ display:block;}
	.dv_butt .more{ margin:8px auto; display:block;}
}
#bpish_head{
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px dashed #bbb;
}
#bpishfaktor label{
    color: #048f96;
	font-family: "samimBold";
}
#bpish_head a{
    float: right;
}
#bpish_head img{ width:65px; display: block;}
#bpish_date{
    float: left;
	font-size:15px;
}
#bpish_date div:first-child{
    margin-bottom: 5px;
}
#bpish_date label{
    width: 40px;
    display: inline-block;
}
#bpish_titr{
    padding: 0 5px;
	margin: 15px 0 8px;
    text-align: center;
    font-size: 19px;
	line-height:30px;
    color: #444444;
	font-family:samimBold;
}
#bpishfaktor table{
    width: 100%;
    margin: 5px 0;
}
#bpishfaktor td{
    padding: 8px 5px;
    font-size: 14px;
	line-height:25px;
    vertical-align: middle;
    border: 1px solid #c2c2c2;
}
#bpish_buyer input{
    padding: 0 5px;
    font-size: 14px;
    background: #f6f6f6;
    font-family: samim;
    border: 1px solid #C2C2C2;
}
#bpish_buyer tr:first-child td, #bpish_seller tr:first-child td:first-child{
    width: 60px;
    text-align: center;
	font-family: "samimBold";
}
#bpish_seller .ltext a{ color:#1b1b1b;}

#bpish_seller td:nth-last-child(2){ width: 160px; }
#bpish_buyer td:last-child,#bpish_seller td:last-child{
    width: 195px;
}
#bpish_buyer tr:nth-child(2) td:nth-child(2){
    width: 160px;
}
#bpish_buyer.real tr:nth-child(2) td:nth-child(2){
    width: 100px;
}
#bpish_buyer label{
    /**width: 80px;**/
    display: inline-block;
}
#bpish_services tr:first-child{
    height: 40px;
}
#bpish_services tr:first-child td{
    font-size: 15px !important;
    font-family: samimBold !important;
}
#bpish_services td{
    text-align: center;
}
#bpish_services td:nth-child(2){
    text-align: right;
}
#bpish_services td:nth-child(1){
    width: 50px;
	text-align: center;
}

#bpish_services tr:last-child td{
    background: #048f96;
    color: #ffffff;
	text-align: center !important;
}

#bpish_services tr:last-child td:last-child{
    font-family: samimBold;
    font-size: 15px !important;
}
#bpish_services tr:last-child td:first-child{
    text-align: left !important;
    font-family: samimBold !important;
    font-size: 15px !important;
    color: #048f96 !important;
    background: transparent;
}
#maliat{
    display: none;
}
.w40{ width:40px;}
.Ared{color:#900!important;}.Anarenji{color:#FF5C26;}.Agreen{color:#390!important;}
@media only screen and  (max-width: 800px){
	#bpish_seller tr, #bpish_seller td, #bpish_buyer tr, #bpish_buyer td, #bpish_services tr, #bpish_services td{ width:100% !important; border-top:none !important; display:block;}
	#bpish_seller tr:first-child td:first-child, #bpish_buyer tr:first-child td:first-child{ background:#373737; color:#fff; font-family:samimBold; text-align:center; border-color:#424141;}
	#bpish_services td{ text-align:right;}
	#bpish_services tr:first-child{ display:none;}
	#bpish_services tr td:before{ padding-left:4px; color:#048f96; font-family: samimBold;}
	#bpish_services tr td:nth-child(1){ background: #373737; color:#fff; font-family:samimBold; text-align:center;}
	#bpish_services tr td:nth-child(1):before{ content:"ردیف"; color:#fff;}
	#bpish_services tr td:nth-child(2):before{ content:"شرح کالا:";}
	#bpish_services tr td:nth-child(3):before{ content:"تعداد:";}
	#bpish_services tr td:nth-child(4):before{ content:"مبلغ واحد:";}
	#bpish_services tr td:nth-child(5):before{ content:"مبلغ کل:";}
	#bpish_services tr:last-child td{ font-size:15px !important; text-align: right !important;}
	#bpish_services tr:last-child td:before{ display: none;}	
	#bpish_services tr:last-child td:first-child{ text-align:right !important; color: #fff !important; background: #373737 !important;}
}
@media only screen and  (max-width: 400px){
	#bpish_head a, #bpish_date{ text-align:center; float:none; display:block;}
	#bpish_head img{ margin:auto auto 20px; display:block;}
	#bpish_date{ padding-top:0;}
}
/* end pish faktor css */

/*404 and Error*/
.errorbg{background: #c6f0ef url(images/background/404.jpg) no-repeat right; background-size:800px !important;}
.errorblock{width:960px; margin:auto; padding-top:40px;}
.lefttxt{float:left; line-height:45px; color:#46261b; border-radius:10px; width:60%; background: #ffffffb5; padding:20px; font-size:25px; margin-top:20px;}
.lefttxt a{color:#333; transition:all 0.3s;}.lefttxt a:hover{color:#CB5645;}
.lefttxt input{padding:6px; border:1px solid #FFF; font-size:15px; border-radius:5px;}
.lefttxt input:last-child{background:#ff626d; color:#FFF; border:none; transition:all 0.2s;}
.lefttxt input:last-child:hover{background:#CB5645; cursor:pointer;}
.lefttxt > div{font-size:30px; line-height:42px; color:#ff626d;}
.lefttxt > span{padding-right:20px; font-size:17px; line-height: 30px;}
.lefttxt .circlet{float:right; border-radius:200px; background:#ff626d; color:#8fd0d4; border:2px solid #ff626d; display:inline-block; width:40px; height:40px; line-height:40px;}
.lefttxt .circlet span{padding-top:20px;}
.lefttxt .circlet i{margin-top:8px; color: #fff;}
.rowt{display:table; padding-bottom:10px;}
.rowt div:last-child{display:table-cell; vertical-align:middle; padding-right:10px;}
.designed{color:#FFF; font-size:13px; padding:10px; border-radius:5px 0px 0px 5px; text-align:left; width:100px; background:#FFF; margin-top:10px;}
.designed a{color:#378E93; text-shadow: 0px 1px 2px rgba(0, 0, 0, 0.2);}

@media only screen and (min-width: 40px) and (max-width: 1024px) {
	.errorblock{width:90%; padding-top:0px; margin:auto;}
	.lefttxt{float:none; width:100%;}
}

/************************************** complaint **************************************/
.window .result{ padding:20px 0; color:#198200; font-size:16px; line-height:28px; text-align:center;}
.window .result i{ font-size:21px; vertical-align:middle;} 
.mess_div{ text-align: center; font-size:18px; line-height:32px; color:#830002;}
.pad20bt{ padding-bottom:20px;}

#navigator{ padding: 5px 0 10px 0; color:#666; font-size:11px;}
#navigator i{ padding:0 5px; color:#9c9c9c; font-size: 12px; position: relative; top: 1px; text-shadow:none;}
#navigator a{ color:#1b1b1b; transition:all linear 0.3s;}
#navigator a:hover{ color: #048f96 !important; text-shadow: none;}
#navigator.mainbox{ background:transparent; box-shadow:none; border:none;}

#head_box { padding: 10px 0 15px; background:url("images/background/bg.jpg"); background-size: cover !important;}
#head_box h1{ color: #1b1b1b; font-family: "SamimBold"; font-size: 26px; line-height: 38px; display: inline-block;}
#contact{ margin: 70px auto 80px;}
#contact #map{ width: 40%;}
#contact #map iframe{ width: 100%; height: 100%; display: block;}

#contact #c_right{ width: calc(60% - 20px); margin-left: 20px;}
#contact .c_title{ padding:20px 0; color:#333; font-family:'SamimBold'; line-height: 32px; font-size: 20px;}
#contact .c_title i{ color:#1cbfc8; position: relative; top: 1px;}
#contact iframe{width:100%;}
#contact form ul{ font-size:0; padding:0; margin:0 0 5px 0; list-style: none;}
#contact form #part_one li{ width:33%; display:inline-block;}
#contact form #part_one li:nth-child(2){ margin:0 0.5%;}
#contact form ul input{ width:100%; height:40px; padding:0 5px; font-family: 'Samim'; font-size:14px; color:#333; border:1px solid #ccc; vertical-align:bottom; border-radius: 5px;}
#contact form #part_two{ display: flex; flex-wrap: wrap; align-items: flex-end;}
#contact form #part_two li{ width:66.5%; display:inline-block;}
#contact form #part_two li:nth-child(2){ width: 33%; margin-right: 0.5%; position:relative;}
/*#contact form #part_two li:nth-child(2) iframe{ width:304px; position:relative;}*/
#contact form li textarea{ width:100%; height:90px; padding:0 5px; color: #333; font-family: 'Samim'; font-size:14px; border:1px solid #ccc; border-radius: 5px; resize:none; display: block;}
#contact form #part_two input[type="submit"]{ margin: 0; background: transparent; color: #048f96; font-family:'SamimBold'; font-size: 15px; border: 1px solid #048f96; transition: all linear 0.2s;}
#contact form #part_two input[type="submit"]:hover{ background: #048f96; color: #fff; border-color: #048f96;}
#contact .num_cnt{ padding: 5px 5px 0 0; font-size: 12px; text-align: right; color: gray;}
#contact .Agreen:before{ content: "\f00c"; font-family:"Font Awesome\ 5 Free"; font-weight:900; margin-left: 5px; font-size: 18px;}
#contact .g-recaptcha > div{ position: relative; top: 1px;}
@media only screen and (max-width:768px){
	.res_align{ text-align:center;}
	#contact form ul{ margin:0;}
	#contact form ul input, #contact form ul select{ height:55px; font-size: 17px;}
	#contact form #part_one li, #contact form #part_two li{ width:100% !important; margin-bottom:10px; display: block;}
	#contact form #part_one li:nth-child(2){ margin:0 0 10px 0;}
	#contact form #part_one, #contact form #part_two{ max-width:450px; margin:auto; text-align:center;}
	#contact form #part_two li:nth-child(2){ margin:0 0 10px 0 !important;} 
	#contact form #part_two li:nth-child(2) iframe{ margin:0; position:static; vertical-align:inherit;}
	#contact form #part_two input[type="submit"]{ position:static;}
	#contact form li textarea{ font-size: 17px;}
	#contact .g-recaptcha > div{ margin: auto; display: block;}
	#contact .num_cnt{ padding-top: 0;}
	#contact #map,#contact #c_right{ width: 100% !important;}
	#contact #c_right{ margin: 0 0 20px;}
	#contact #map iframe{ height: 200px;}
}

/************************************** about **************************************/
.blogtxt{ max-width: 800px; margin: 40px 0; text-align: justify;}
.blogtxt > h3:first-child{ margin-top: 0;}

/** seo **/
#seo{ padding: 60px 0; border-top: 1px dashed #ccc;}
#seo .main h3:first-child{ margin-top: 0;}

/************************************** blog **************************************/
.coverinfo{ position: relative; background-size:cover !important; z-index:10;}
.coverinfo .infotr { padding: 20px; line-height: 30px; width: 100%;}
.coverinfo .infotr span { color: #1b1b1b; display: block; font-size: 18px; padding-bottom: 5px;}
.newsbody{ max-width:900px; padding:40px 30px 40px 30px; margin:auto; font-size: 15px; display:block;}
.newsbody .example1, .blogtxt .example1, #seo .example1{ color: #888888; position: relative; bottom: 9px; font-size: 13px; font-style: italic; text-align: center; display: block; background: white;} 
.example2{ max-width: max-content; margin: 20px auto auto; padding:10px 30px; color: #fff !important; font-size:23px;font-family:'samimBold'; text-align: center; display: block; position: relative; text-decoration: none; color: #fff !important; text-transform: capitalize; background-color: #1cbfc8; min-width: 265px; border-radius: 6px; overflow: hidden; transition: all 0.2s linear 0s;}
.example2 a{ color: #0e1414 !important;}
.example2 i{ vertical-align:middle;}
.example2::before { content: "\f053"; font-family:"Font Awesome\ 5 Free"; font-weight:900; display: flex; align-items: center; justify-content: center; position: absolute; top: 0; right: 0px; height: 100%; width: 30px; background-color: rgba(255, 255, 255, 0.3); border-radius: 50% 0 0 50%; -webkit-transform: scale(0, 1); transform: scale(0, 1); -webkit-transform-origin: right center; transform-origin: right center; transition: all 0.2s linear 0s;}
.example2::after{ content: "\f360"; text-indent: 0; padding-right:5px; font-family:"Font Awesome\ 5 Free"; font-weight:900; vertical-align:middle; display:inline-block;}
.example2:hover{ text-indent:30px;}
.example2:hover:before{ transform: scale(1,1); text-indent: 0;}
.example2:hover:after{ text-indent: 0;}
@media only screen and (max-width: 300px) {
	.example2{ padding:10px 20px; font-size:19px; min-width: 200px;}
}
/*end button effect*/
.newsbody img, .blogtxt img,  #seo img{max-width:100%; height:auto; margin:15px auto 10px; display:block;}
.newsbody h3, .blogtxt h3, #seo h3{ margin:40px 0 10px; line-height:30px; font-family:'samimBold'; font-size:17px; border-bottom:3px solid #1cbfc8; display:inline-block;}
.newsbody h1, #seo h1{line-height: 43px; font-family: 'samimBold'; padding-bottom:10px; font-size:26px;}
.newsbody h2, #seo h2{ line-height: 35px; font-family: 'samimBold'; padding-bottom: 10px; font-size: 21px; display: inline-block; background: #F4F4F4; padding: 5px 10px; margin: 50px 0 10px; border-right: 3px solid #1cbfc8;}
.toptxt{font-size:13px; color:#939393; padding-bottom:10px;}
.toptxt i{font-size:11px; color:#1cbfc8;}
.newsbody ul, .newsbody ol, .blogtxt ul, .blogtxt ol, #seo ul, #seo ol{ padding-right:30px;}
.newsbody a, #seo a,#pro_explain a{ color:#048f96; transition:all linear 0.2s;}
.newsbody a:hover, #seo a:hover,#pro_explain a:hover{ opacity: 0.7;}
.newsbody table, .blogtxt table, #seo table{ width: 100%; margin:10px 0; text-align:center;}
.newsbody table tr td, .blogtxt table tr td, #seo table tr td{ padding:5px; background:#F8F8F8; font-family: "samim"; font-size:15px; border:1px solid #fff; transition:all linear .2s;}
.newsbody table tr:nth-child(2n-1) td, .blogtxt table tr:nth-child(2n-1) td, #seo table tr:nth-child(2n-1) td{ background:#eee; border-colr:#fff;} 
.newsbody table tr:first-child td, .blogtxt table tr:first-child td, #seo table tr:first-child td{ background:#2c3e50; color:#fff; font-family: "samimBold"; font-size:16px;}
.newsbody #navigator{ padding: 0;}
.newsbody .rotitr{ padding: 15px 0 2px; color: gray; font-size: 13px; display: block;}
.attach i{ margin-left: 3px; color: #1cbfc8; position: relative; top: 1px;}
.attach .head{ font-size:14px; font-family: 'samimBold';}
.attach .file{ font-family:Tahoma; font-size:13px; direction: ltr;}
/** iframe **/
.h_iframe-aparat_embed_frame{position:relative;} 
.h_iframe-aparat_embed_frame .ratio {display:block;width:100%;height:auto;} 
.h_iframe-aparat_embed_frame iframe {position:absolute;top:0;left:0;width:100%; height:100%; border:none;}

.vtours{ display:inline-block; width:48%; margin:1% 1% 0; position:relative; padding-top:5px; transition:all linear .2s;}
.vtours:hover img{ opacity: .7;}
.vtours img{display:block; width:100%; border:5px solid white; transition:all linear .2s;}
.vtours b{position:absolute; bottom:5px; right:5px; padding:7px 10px 5px; background:rgba(0,0,0,.5); left:5px;}
.vije .title{font-size:18px; padding-right:15px; padding-bottom:3px; padding-top:10px;}
.vije .title i{font-size:17px; padding-left:5px; color:#FFC621;}
.vije p{font-size:14px; padding-right:15px;}
.vtours b h2{font-size:14px; font-family:'samimBold'; color:white; display:inline-block; padding-left:3px;}
.vtours b span{font-size:12px; font-family:'samim'; color:#A3A3A3;}
.vtours b a.button{margin-top:0; z-index:3; left:10px; bottom:3px; position:absolute; font-size: 12px; padding:0 5px; font-family:'samim';}
.vtours:hover{opacity:.8;}
#news .vtours:hover{ opacity:1;}
#news .vtours a:hover{ opacity:0.7;}
#has_bg{ min-height:230px; height:auto !important; background: #f4f4f4; background-size: cover !important; background-position: center !important;}
.eslash{ font-family:samim; display:inline-block !important;}
.shorttxt{background:#F4F4F4; padding:5px 10px;}
.vije{ font-size:0; background:url(images/background/bg.jpg); padding-top:20px; padding-bottom:20px !important;}
@media only screen and (max-width:900px){
	.vtours{ width:100%; margin:10px 0; display:block;}
	.vtours img{ border-bottom:none;}
	.vtours b{ padding:10px; background:rgba(0,0,0,.8); position:static; border:5px solid white; border-top:none; display:block;}
	.vtours b a.button{ bottom:15px; left:15px; margin-top:5px;}
}
@media only screen and (max-width:450px){
	.vtours b{ text-align:center;}
	.vtours b a.button{ max-width:200px; margin:5px auto auto auto !important; position:static; display:block !important;}
}

.tagsin{font-size:0; text-align:right;}
.tagsin b{ margin-bottom: 15px; font-size: 18px; line-height: 30px; display: block;}
.tagsin b i{ font-size: 17px; padding-left: 5px; color: #1cbfc8;}
.tagsin a{display:inline-block; font-size:13px; padding:5px 10px; margin:0 0 5px 5px; background:#eee; color:#1b1b1b; border-radius: 5px;}
.tagsin a:hover{ opacity: 1; background: #ddd;}
/*#news #navigator, #news #navigator a{ color: #fff;}*/

 /* Style the header: fixed position (always stay at the top) */
.header {
  position: fixed;
  top: 0;
  z-index: 300;
  width: 100%;
}

/* The progress container (grey background) */
.progress-container {
  width: 100%;
  height: 3px;
  background: none ;
}

/* The progress bar (scroll indicator) */
.progress-bar {
  height: 4px;
  background: #1cbfc8;
  width: 0%;
} 

/*writer*/
.writer{ display:table; width:100%; background:#f4f4f4; padding:0 20px 0; color:#5B5B5B; border-top:2px solid #1cbfc8; border-bottom:2px solid #1cbfc8;}
.writer > a{font-size:18px; display:inline-block; padding-bottom:5px;}
.writer p{font-size:14px; margin:0; line-height:26px;}
.writer > div:after{content:""; clear:both; display:block;}
.writer > div:first-child{width:110px; display:table-cell; padding:2% 0 2% 2%;}
.writer > div:first-child img{width:100%; margin:0; border-radius:50%; border:4px solid #FFF;}
.writer > div:last-child{display:table-cell; vertical-align:middle; width:Calc(100% - 110px);}
.end{ margin-top: 7px; line-height: 23px; font-size: 12px;}
@media only screen and (max-width:725px){
	.writer{padding:0 3% 0;}
	.writer > div:first-child{ width:90px; padding:2% 0 2% 2%;}
	.writer > div:last-child{ width:Calc(100% - 90px); padding:2% 0 4%;}
}

/*ghabli badi*/
#matlab_prenext{
    margin: 20px 0;
}
#matlab_prenext > div{ background:#eee; margin-bottom:5px;}
#matlab_prenextbox1{
    width: 100%;
    position: relative;
    overflow: hidden;
	border-right:3px solid #1cbfc8;
}
#matlab_prenextbox2{
    width: 100%;
    position: relative;
    overflow: hidden;
	text-align:left;
	border-left:3px solid #1cbfc8;
}
#matlab_prenext a{
    padding: 8px 10px;
    line-height: 27px;
    display: block;
    color: #000;
    font-size: 15px;
    transition: all .3s linear;
    position: relative;
}
#matlab_prenext a:hover{ opacity: 0.7;}
#matlab_prenext a b{ color:#333;}
#matlab_prenext a i{
    margin: 0px 6px;
	vertical-align:middle;
	font-size:17px;
	color:#1cbfc8;
}

/***** comment ********/
#matlab_comm{
    /*padding: 50px 0px;*/
    padding: 0px 0px 50px;
    background: #fff;
}
#matlab_comm .container{
    padding: 0px 16.666667%;
	border-top:1px dashed #cccccc;
	padding-top:20px;
	
}
.comment{
    width: 95%;
    margin-bottom: 50px;
    position: relative;
}
#comment_header{
    margin-bottom: 30px;
	font-family:'samimBold';
    font-size: 18px;
    line-height: 30px;
}
.comm_img{
    margin-left: 10px;
    font-size: 32px;
    color: #fb8686;
    text-align: center;
    position: absolute;
}
.comm_img i{
	width: 28px;
	background:#1cbfc8;
	line-height:28px;
	font-size:11px;
	color:#fff;
	position:relative;
	right: 10px;
	bottom: 5px;
}
.comment_info{
    padding: 5px 0px;
    color: #aaaaaa;
    font-family: 'samim';
    font-size: 13px;
}
.comment_info i{
    margin-right: 10px;
    color: #a6a6a6;
    display: inline-block;
}
.comment_info div{
    display: inline-block;
}
.comment_info div:first-child{
    padding-left: 3px;
}
.comment .comm_box{
    padding-right: 50px;
}
.comment_txt{
    padding: 5px 0px;
    font-family: 'samim';
    font-size: 15px;
    line-height: 28px;
    text-align: justify;
    text-justify: auto;
}
.comment_ans{
    margin: 15px 60px 0px 0px;
}
.comment_ans .comm_img{
	margin:0;
	background:none;
    font-size: 25px;
	text-align:left;
}
.comment_ans .comm_img i{ color:#1cbfc8; background:none; font-size:12px; position:relative; right: 12px; bottom: 3px;}
.comm_reply{
    color: #aaaaaa;
    line-height: 30px;
    font-size: 15px;
    display: inline-block;
    cursor: pointer;
    transition: all .2s linear;
}
.comm_reply i{
    margin-left: 2px;
}
.comm_reply:hover{
    color: #ff4f4f;
}
.comm_result{ padding: 8px 20px; background: #faf8a0d1; color: #333; font-size: 14px; font-family: 'samimBold'; display: inline-block; border-radius: 20px;}
.comm_result i{ margin-left: 4px; color: #F7BB06; vertical-align: middle; font-size: 18px;}
/******* form ersale nazar **********/
#comform_header{
    margin: 15px 0px 10px 0px;
    color: #444444;
    font-size: 18px;
    line-height: 30px;
}
#comform_header span{ font-size: 12px; color: #9D9B9B; font-family: 'samim';}
#cancel_reply{
    padding: 0px 10px 0px 0px;
    color: #ff4f4f;
    cursor: pointer;
    font-size: 18px;
    display: none;
    transition: all .3s linear;
}
#cancel_reply:hover{
    color: #b91217;
}
#comment_form label{
    line-height: 25px;
    padding: 0 5px 3px 0;
    font-size: 14px;
    color: #696969;
    display: block;
    font-family: 'samim';
}
#comment_form label i{
    margin-right: 3px;
    font-size: 9px;
    color: #ff4f4f;
    position: relative;
    top: -3px;
}
#comment_form textarea{
    min-width: 100%;
    max-width: 100%;
    min-height: 130px;
    max-height: 130px;
	line-height:28px;
    margin-bottom: 15px;
    padding: 5px 10px;
    background: #f4f4f4;
    border: 1px solid #cccccc;
    font-family: 'samim';
    font-size: 15px;
	border-radius: 5px;
    transition: all .3s linear;
}
#comment_form .comf_float{
    width: 50%;
    float: right;
}
#comment_form .comf_float:first-child{
    padding: 0px 0px 0px 10px;
}
#comment_form .comf_float:nth-child(2){
    padding: 0px 10px 0px 0px;
}
#comment_form input[type="text"]{
    width: 100%;
    height: 40px;
    padding: 5px 10px;
    background: #f4f4f4;
    border: 1px solid #cccccc;
    font-family: 'samim';
    font-size:15px;
	border-radius: 5px;
    transition: all .3s linear;
}
#comment_form input[type="text"]:hover,#comment_form textarea:hover,
    #comment_form input[type="text"]:focus,#comment_form textarea:focus{
	box-shadow: 0px 0px 5px #1cbfc8; 
	border-color:#1cbfc8;
}
#comment_form .ltext{
    font-family: Tahoma !important;
}
#matcom_sub{
    text-align: left;
    padding-bottom: 10px;
}
@media only screen and (max-width:1000px){ /************ responsive matlab 1000 px *****************/
    #matlab_comm .container{
        padding: 20px 30px 0;
    }
}
@media only screen and (max-width:700px){ /************ responsive matlab 700 px *****************/
    #comment_form .comf_float{
        width: 100%;
        float: none;
    }
    #comment_form .comf_float:first-child{
        padding: 0px;
        margin-bottom: 10px;
    }
    #comment_form .comf_float:nth-child(2){
        padding: 0px;
    }
    .comm_img{
        margin-top: -10px;
        font-size: 30px;
    }
	.comm_img i{ width:30px; line-height:30px; right:0; bottom:-3px;}
    .comment .comm_box{
        padding-right: 35px;
    }
    .comment_ans{
        margin: 15px 5px 0px 0px;
    }
    .comment_ans .comm_img{
        font-size: 30px;
    }
	.comment_ans .comm_img i{ right:0;}
}
@media only screen and (max-width:500px){ /************ responsive matlab 500 px *****************/
    #matlab_comm .container{
        padding: 20px 10px;
    }
    .comment_info{
        line-height: 25px;
    }
	.comment_ans .comm_img i{ bottom:0;}
}

/*** services ***/
.coverinfo .infotr h1 { display: block !important; font-size: 30px; line-height: 45px; font-family: 'samimBold';}
.b_slider{ min-height:250px; height:auto !important; padding-bottom: 15px;}
.b_slider .infotr{ position:static !important; background: rgba(255,255,255,.5);}
.infotr .under{ padding-top:5px;}
.infotr .under div{  display:inline-block;}
.infotr .under div:after{ content:"/"; margin: 0 5px; color:#1b1b1b;}
.infotr .under div:last-child:after{display:none;}
.infotr .under a{ padding:5px 10px; font-size:15px; color:#1b1b1b; display:inline-block; transition:all linear 0.3s;}
.infotr .under a:hover{ color:#888;}
.infotr .under a.active{opacity:.5; cursor:default;}
.infotr .under a.active:hover{ color:#fff !important;}
.mainbox #RightBox{ width:68%; margin-left:2%; float:right;}
.mainbox #RightBox .RightMain a{ display:block; transition:all linear 0.2s;}
.mainbox #LeftBox{ width:30%; margin-top:20px; float:right;}
#RightBox .RightMain{ text-align:center; position:relative; padding:20px; border-bottom:1px solid #ddd; overflow:hidden; transition:linear .3s;}
#RightBox .RightMain:last-of-type{ border: none;}
#RightBox .RightMain:hover{ background:#f4f4f4;}
#RightBox .RightMain:hover .more{ left:15px !important;}
#RightBox .RightMain > div:first-child{ width:43%; float:right;}
#RightBox .RightMain > div:first-child a{ position:relative;}
#RightBox .RightMain > div:first-child img{ width:100%; height: 195px; object-fit: cover; display:block; padding-left:20px;}
#RightBox .RightMain > div:last-child{ width:57%; text-align:right; float:right;}
.width100s{ width:100% !important; float:none !important;}
#RightBox .RightMain > div:last-child h2{ margin:0 !important; padding:5px 0 10px 0; line-height: 37px; font-size:22px; font-family:'samimBold';}
.suptitr{font-size:13px; color:gray; line-height:10px;}
#RightBox .RightMain > div:last-child h2 a{ color:#333;}
#RightBox .RightMain > div:last-child h2 a:hover{ opacity:.8;}
#RightBox .RightMain > div:last-child .matn{ line-height:26px; font-size:14px;}
#RightBox .RightMain > div:last-child .more{ display:inline-block; position:relative; bottom:0px; left:0; float:left;}
#RightBox .RightMain > div:last-child .more:hover{ opacity:.8;}
#MaxChr{width:20px; display:inline-block;}
#RightBox #paging ul{ margin: 20px 0 50px 0; padding:0; font-size: 0; text-align: left !important;}
#RightBox #paging ul li{ width: 45px; height: 45px; line-height: 45px; background: #ECECEC; font-size: 16px; text-align: center; transition: all 0.3s linear; vertical-align: top; display: inline-block; font-family:'samimBold';}
#RightBox #paging ul li a{ color:#333; display:block;}
#RightBox #paging ul li a:hover{ opacity:.5;}
#RightBox #paging ul li.active{ background:#2e3434; text-shadow:1px 1px 2px #000;}
#RightBox #paging ul li.active a{ color:#fff;}
#RightBox #paging ul li i{ font-size:13px;}
#RightBox .paging{ padding: 5px 0; font-size:14px; text-align:left;}
#RightBox .paging i{ vertical-align:middle;}
#RightBox .paging span{ color:#ababab;}
#RightBox .paging a{ color:#1cbfc8; transition:all linear 0.2s;}
#RightBox .paging a:hover{ opacity:0.6;}
#label{ padding:10px; font-size:0;} 
#LeftBox .tags h3{ font-size: 21px; padding: 10px 5px 10px 10px; margin-top:0; font-family:'samimBold';}
#LeftBox .tags > div{ font-size:0;}
#LeftBox .tags a, #label a{ display:inline-block; padding:5px 10px; margin:5px 0 0 5px; background:#f4f4f4; color: #333; font-size: 14px; text-align:center; border-radius: 5px; transition: all linear 0.2s;}
#LeftBox .tags a:hover, #label a:hover{ background:#ddd;}
#LeftBox .tags a.active{ background:#048f96; color:#fff;}
#LeftBox .tags a.active:hover{ color:#fff;}
#LeftBox .tags a.active span{ color:#fff;}
#LeftBox .tags a span{ color: #1cbfc8; font-size: 12px;}
#LeftBox .tags h3 i{ color:#1cbfc8; font-size:17px;}
.RightMain::after{ content:""; clear:both; display:block;}
@media only screen and (max-width: 1000px){
	.mainbox #RightBox, .mainbox #LeftBox{ width:100%; margin-bottom:30px; border-right:none; float:none;}
	#LeftBox .tags{ max-width:450px; margin:auto; text-align:center;}
	#LeftBox .tags h3{ padding:10px !important; border-bottom:2px solid #1cbfc8;}
	#LeftBox .tags a{ margin-left:0; display:block;}
	#LeftBox .tags a:last-child{ border-bottom:none;}
	#RightBox #paging ul{ text-align:center !important;}
	#RightBox .RightMain:hover{ background:none;}
}
@media only screen and (max-width: 780px){
	#RightBox{ margin-left:0 !important;}
	#RightBox .RightMain{ margin-bottom:0; padding-bottom:15px;}
	#RightBox .RightMain > div:last-child h2{ padding:0 0 15px 0;}
	#RightBox .RightMain > div:first-child, #RightBox .RightMain > div:last-child{ width:100%; max-width:600px; margin:auto; padding:15px 0 5px 0; float:none;}
	#RightBox .RightMain > div:first-child a{ max-width:600px; margin:auto;}
	#RightBox #paging ul{ margin-bottom:40px; text-align:center !important;}
	#RightBox .RightMain > div:first-child img{padding-left:0px;}
	#RightBox .RightMain:nth-of-type(1) > div{ padding-top:0;}
	#RightBox .paging{text-align:center; background:#f4f4f4; padding:5px; margin-bottom:10px;}
	.b_slider .infotr{ background: rgba(255,255,255,.8);}
	#RightBox .RightMain:hover .more{ left: inherit !important;}

}
@media only screen and (max-width: 450px){
	#RightBox #paging ul li{ width:40px; height:40px; line-height:40px;}
}

/************************ search *************************/
#p_form{ max-width: 350px; height: 40px; position: relative;}
#p_form input{ width: 100%; height: 100%; line-height: 50px; padding: 0 20px 0 50px; color: #555; font-size: 14px; border: 1px solid #ddd; border-radius: 50px; transition: all linear 0.3s;}
#p_form button{ width: 55px; font-family: "samimBold"; font-size: 19px; color:  rgba(49,81,80,1.00); height: 100%; text-align: center; padding: 0; background: transparent; position: absolute; left: 0; top: 0; border: none; transition: all linear 0.2s;}
#p_form button i{ position: relative; top: 2px; color: #a8a9ac;}
#p_form button:hover i{ color: #1cbfc8;}

.s_result{ padding: 30px 0; color: rgb(234, 29, 36); font-size: 18px; font-family: "samimBold";}
#p_search .latest{ margin: 40px 0;}
.find_rec{ font-family: samimBold; font-size: 18px;}
.find_rec i{ color: #0f8f77; font-size: 20px;}

/* table result for news search */
#TabNews table{ width: 100%; font-size: 14px; border-collapse: collapse; clear:both;}
#TabNews tr:nth-child(1){ background: #f4f4f4 !important; }
#TabNews tr:nth-child(1) td{ padding: 3px 5px !important; }
#TabNews tr{ transition: all .3s linear; }
#TabNews .ini_sbody td{ padding: 12px 5px !important; text-align: left !important; }
#TabNews .ini_sbody span{ background-color:#CF0;}
#TabNews tr:hover + .ini_sbody{ background: rgba(255, 153, 51, 0.22) !important; }
#TabNews tr:hover{ background:#F4F4F4;}
#TabNews td{ padding: 5px 5px; border: 1px solid #f1f1f1; }
#TabNews td:nth-child(1),#TabNews td:nth-child(3),#TabNews td:nth-child(4),#TabNews td:nth-child(5){ text-align: center; }
#TabNews td:nth-child(3){ width: 40px;}
#TabNews a{ color: #048f96; }
#TabNews a:hover{ opacity: 0.7;}
.Searchpg{ font-size: 13px; text-align:right; float:left; margin: 10px 0;}
.Searchpg a{ color: #069; }
.Searchpg a:hover{ color: #f93; }
.Searchpg i{ margin: 0 3px; position: relative; top: 1px; }

@media only screen and (max-width: 650px) {	/* responsiv */
	#TabNews table,#TabNews table tbody,#TabNews table tr,#TabNews table td{ display: block !important; }
	#TabNews table{ margin: 5px auto; }
	#TabNews tr:first-child{ display: none !important; }
	#TabNews tr{ height: auto; margin-bottom: 5px; }
	#TabNews td{ width: 100% !important; padding: 5px 10px; text-align: right !important; border-top: none !important; }
	#TabNews td:before{ font-size: 14px; color: #048f96; }
	#TabNews td:nth-child(1){ font-size: 17px; background: #f4f4f4; text-align: center !important; }
	#TabNews td:nth-child(1):before { content: "ردیف: "; color: #444; }
	#TabNews td:nth-child(2):before { content: "عنوان: "; }
	#TabNews td:nth-child(3):before { content: "کد: "; }
	#TabNews td:nth-child(4):before { content: "زمان انتشار: "; }
	#TabNews .ini_sbody td{ background: transparent; }
	#TabNews .ini_sbody td:before{ display: none !important; }
	#TabNews a{ display: inline-block; }
}

/************************************** landing **************************************/
#banner{ margin-bottom: 60px; position: relative;}
#banner img{ width: 100%; display: block;}
#banner img.bann_mob{ display: none;}
#banner .back_to{ padding: 5px 15px; background: #fff; color: #333; position: absolute; top: 20px; left: 20px; font-size: 13px; border-radius: 5px; display: block;}
#banner .back_to:hover{ background: #1cbfc8; color: #fff;}
#banner .back_to i{ margin-right: 5px; color: #1cbfc8; position: relative; top: 1.5px; transition: all linear .2s;}
#banner .back_to:hover i{ color: #fff;}
@media only screen and (max-width: 768px){
	#banner img.bann_desk{ display: none;}
	#banner img.bann_mob{ display: block;}
}

.titlebox .text{ margin-top: 30px;}
#for_landing{ margin: 60px 0 40px;}
#for_landing.item_box .pro_items{ width: Calc( 25% - 23px); padding-bottom: 130px;}
#for_landing.item_box .pro_items:nth-child(4n){ margin-left: 0;}
#for_landing.item_box .cost_box{ height: 75px;}
#for_landing .countdown,.countdown2 { width: 100%; color: #d11366; font-family: samimBold; font-size: 13px; text-align: left; direction: ltr;}
@media only screen and (max-width: 1024px){
	#for_landing{ margin-top: 80px;}
	#for_landing.item_box .pro_items{ width: Calc( 50% - 15px);}
	#for_landing.item_box .pro_items:nth-child(2n){ margin-left: 0;}
}

/************************************** footer **************************************/
.en_font{ font-family: tahoma;}
#back_up{ width: 40px; height: 40px; line-height: 35px; border-radius: 100%; text-align: center; background: rgba(55,55,55,.7); color: #FFF; font-size: 20px; position: fixed; bottom: 10px; right: 10px; z-index: 999; cursor: pointer; border: 1px solid #555; transition: all .3s linear; display: none;}
#back_up:hover{ background: rgba(55,55,55,1);}
#back_foot{ background: url(images/background/foot_logo.png) no-repeat; background-position: -25% 55% !important; background-size: 700px !important;}
footer{ background: rgb(17,28,34); background: linear-gradient(180deg, rgba(17,28,34,1) 0%, rgba(26,71,76,1) 100%); color: #48878c;}
#footer{ padding: 40px 0;}
.foot_logo{ width: 15%; margin-right: auto; text-align: center; flex-direction: column; justify-content: center;}
.foot_logo a{ display: block;}
.foot_logo img{ max-width: 150px; width: 100%; display: block;}
.socials{ margin: 10px 22px 0 0;}
.socials a{ margin: 0 10px; font-size: 18px; color: #818285; display: inline-block;}
.socials a:hover{ opacity: 0.6;}
.socials img{ width: 22px; position: relative; top: 4px; display: block;}

.column{ width: 17%; padding: 0 5px;}
.column b{ margin-bottom: 15px; color: #c1ebe1; font-size: 16px; line-height: 26px; display: block;}
.column a{ margin-bottom: 5px; color: #48878c; font-size: 14px; display: block;}
.column a:hover{ color: #c1ebe1;}
.column.phone i{ margin-right: 8px; color: #48878c; font-size: 20px; transform: rotate(110deg); position: relative; top: 2px;}
.column.phone a{ padding: 0; color:#48878c; font-family: samimBold; display: block;}
.column.phone a:hover{ color: #c1ebe1;}
.column.namad img{ max-width: 70px; width: 100%; display: block;}
.column.namad a{ margin: 0 5px; border: none !important;}
@media only screen and (max-width:1100px){
	footer{ background-position: 75% 55% !important; }
	.foot_logo{ width: 50%;}
	.column{ width: 50%; margin-bottom: 30px;}
	.column a{ padding: 10px; border: 1px solid #214043; border-radius: 5px;}
	.column.phone a{ padding: 10px;}
	.foot_logo{ margin: 0 !important;}
}
@media only screen and (max-width:450px){
	.column,.foot_logo{ width: 100%; text-align: center;}
	.foot_logo{ margin: auto !important;}
	.namad{ justify-content: center;}
}

.copyright{ padding: 17px 0 17px; color: #48878c; font-size: 13px; border-top: 1px solid #153136;}
.copyright a{ color: #48878c; transition: all linear .2s;}
.copyright a:hover{ color: #c1ebe1;}
.copyright .en_copy{ margin-right: auto; font-family:tahoma;}
@media only screen and (max-width:600px){
	.copyright .flexbox > div{ width: 100%; margin: 0 !important; text-align: center;}
}
@media only screen and (max-width:1024px){
	.foot_padd3, .foot_padd4{ padding: 10px 0 85px 0;}
	#back_up.go_up{ bottom: 80px;}
}
@media only screen and (max-width:850px){
	.foot_padd2{ padding: 17px 0 85px 0;}
}
@media only screen and  (max-width: 768px){
	.foot_padd{ padding: 17px 0 77px 0 !important;}
}
@media only screen and (max-width:600px){
	.copyright .flexbox > div{ width: 100%; margin: 0 !important; text-align: center;}
}
@media only screen and (max-width:400px){
	.foot_padd4{ padding: 10px 0 150px 0;}
}


/** print - enteha bayad bashe **/
@media print {
	.noprint{display:none!important;}
}
@media only screen and  (max-width: 800px){
	 #finance_rec tr, #finance_rec td{ width:100% !important; border-top:none !important; display:block;}
	 #finance_rec tr:first-child{ display:none;}
	 #finance_rec td:before{ padding-left:4px; color:#048f96;}
	#finance_rec tr td, #rel_files tr td, #tracking tr td, #brief_state tr td{ text-align:right}
	#finance_rec tr td:nth-child(1), #rel_files td:nth-child(1), #tracking td:nth-child(1){ background: #444; color:#fff; font-family:SamimBold; text-align:center;} 
	#finance_rec tr td:nth-child(1):before, #rel_files tr td:nth-child(1):before, #tracking tr td:nth-child(1):before{ content:"ردیف"; color:#fff; font-family:SamimBold;}
	#finance_rec tr td:nth-child(2):before{ content:"شناسه:";}
	#finance_rec tr td:nth-child(3):before{ content:"مبلغ:";}
	#finance_rec tr td:nth-child(4):before{ content:"نوع تراکنش:";}
	#finance_rec tr td:nth-child(5):before{ content:"شماره پیگیری:";}
	#finance_rec tr td:nth-child(6):before{ content:"زمان واریز:";}
	#finance_rec tr td:nth-child(7):before{ content:"واریز‌کننده:";}
	#finance_rec tr td:nth-child(8):before{ content:"زمان تایید:";}
}
.tb_style{ width:100%; font-family:"samim";}
.tb_style tr{ background: #f1f1f1; transition:all linear 0.2s;}
.tb_style tr:nth-child(2n-1){ background: #f8f8f8;}
.tb_style tr:hover{ background: #DFDFDF;}
.tb_style tr:first-child{ background:#444; color:#fff; text-shadow: 1px 1px 1px #333;}
.tb_style tr:first-child td{ font-size:16px !important;}
.tb_style td{ padding:5px 10px; font-size:15px; line-height:27px; text-align:center; border:1px solid #fff; vertical-align:middle;}
.tb_style td a{ color:#0260c1; transition:all linear 0.2s;}
.tb_style td a:hover{ opacity:0.7;}
.tb_style td .more{ color:#fff;}