a{color:#9C00FF}
a:hover{color:#7B19BA}
h1,h2,h3,h4{color:#7B19BA}
hr{	border-color: #7B19BA;}
nav{
	height: 48px;
	background-color: rgba(156,0,255,0.5);
	position:fixed; z-index: 10; right:0;
}
nav .logo{
	width: 82px; height:18px; display:block;
	position:absolute;
	background: url('../../images/m-chelci-logo.png')
	no-repeat center;
	right:20px; top:15px;
}
nav .items{
	height:100%; width: 150px;
	float: left;
	display:flex;
}
nav .items >li{
	width: 48px; height:100%;
	cursor: pointer;
}

nav .items .m-menu{
	background: url('../../images/m-menu.png')
	no-repeat center;
}
nav .items #home{
	background: url('../../images/m-home.png')
	no-repeat center;
}
nav .items #cart{
	background: url('../../images/m-cart-empty.png')
	no-repeat center;
}
 .cart-full{
	background: url('../../images/m-cart-full.png')
	no-repeat center !important;
	background-color: rgba(0, 255, 10, 1) !important;
}

.selected-menu{
	background-color: rgba(156,0,255,0.9);
}
nav .m-menu-back{
	background: url('../../images/m-back.png')
	no-repeat center;
	background-color: rgba(255,255,255,0.9);
}
nav .m-submenu{
	position: absolute; top : 48px;
	width: 100%; z-index: 20;
	background-color:rgba(255,255,255,0.9);
	height:0; overflow: hidden;
	opacity:0;
}
nav .m-submenu-open{
	height: 336px ; opacity: 1 ;
}
nav .m-submenu li{
	height:48px;
	border-bottom:1px solid rgba(0,0,0,0.05);
	padding-left: 48px;
}
nav .m-submenu li:last-child{
	border-bottom:none;
}
nav .m-submenu li:hover{
	background-color:rgba(156,0,255,0.2);
}
nav .m-submenu li a{
	line-height: 48px;
}
.d-menu{display:none;}
nav .flag {
	width: 29px; height:18px; display: block;
	background: url('../../images/ir-flag.png')
	no-repeat center;
	position: absolute; right: 20px; bottom: -18px;
}
.new-prods{
	min-height:500px;height: auto;
}
.intro{height: auto;}
.blogs{
	min-height: 600px; height: auto; position:relative;
}
.blogs .item{
	height: 330px;background-color: #000;
	margin:5px auto;
}
.blogs .gradient{height:200px;}
.blogs h4{bottom:130px}
.blogs p{
	position: absolute; color:#fff;
	z-index: 4; bottom: 50px; left:15px;
	font-weight:100;
}
.blogs .more, .blogs img.ver-d{display:none;}
.button{
	width: 175px; height: 35px;
	position: absolute; z-index: 5;
	background-color: rgba(156, 0, 255, 0.6);
}
.item .button{bottom:10px; right:10px;}
.blogs .side{display:none;}
.iv-column{
	min-height: 450px; height: auto; position:relative;
	padding-bottom: 30px;
}
.iv-column ul{
	height: auto; overflow: hidden;
	display: flex;
	flex-direction: column;
}
.iv-column li{
	width:300px; height:370px; position:relative;
	margin: auto;
}
.iv-column div{
	width:100px; height:95px; display:block;
	margin:30px auto 20px; auto;
	background:url(../../images/4-column.png) center no-repeat;
}
.iv-column #i01{
	background-position: 0px 0px;
}
.iv-column #i02{
	background-position: -100px 0px;
}
.iv-column #i03{
	background-position: -200px 0px;
}
.iv-column #i04{
	background-position: -300px 0px;
}
.iv-column h3{text-align: center;}
.iv-column p{text-align: justify;}
.iv-column .button{	right:20px; bottom:20px; }
.footer{
	min-height: 450px; height: auto;
	background: #ebebeb; padding:0;
}
.footer >ul{
	display: flex;
	flex-direction: column;
}
.footer >ul >li{
	margin:30px 0; padding:0 10px;
}
.footer h3{color:#a58eb4}
.footer ul ul{padding:0 20px;}
.footer ul ul li a{line-height:2.5em; }
.footer ul  li a{color: #383838}
.footer ul li p{
	color: #383838; padding: 3px;
}
.footer ul li a:hover{color:#7B19BA}
.footer ul li p{padding-left:20px;}
.footer ul li p span{direction:ltr; float:right;}
.footer #homepage-link{
	display: block;	text-align: center;
}
.social-gen{
	width:250px; height:42px; position:relative;
	display: flex; flex-direction: row;
	margin: 20px auto;
}
.social-gen li{
	width:42px; height:100%; opacity: 0.6;
	margin:0 5px;
	background: url(../../images/social-all.png) center no-repeat;
}
.social-gen li:hover{opacity:1}
.social-gen li#f{	background-position: 0px ;}
.social-gen li#g{	background-position: -42px;}
.social-gen li#t{	background-position: -86px;}
.social-gen li#tlg{	background-position: -130px;}

.footer #google-map{
	width:100%; height:350px;
	border: 2px solid #fff;
}
.footer #google-map *{
	font-family: "Trebuchet MS", arial, tahoma;
	text-align: left; direction: ltr;
}
#back-to-top{
	font-size:3em; color:#7B19BA; cursor: pointer;
	position: fixed; bottom: 35px; right:20px;
	z-index: 500; opacity: 0;
}

/* ----------------------other pages----------------------------- */
.wrapper{
	min-height:300px; height:auto;
	padding:60px 0 20px 0;
}
.wrapper h1{
	margin-top:30px; margin-bottom:15px;
	line-height: 1.3em;
}
.prod-big{display: none;}
.prod-detail .item{
	margin-top:20px; height:240px;
}
.order{
	width:100%; height:40px; cursor: pointer;
	left:0 !important; bottom:0px !important;
	border-radius: 0; line-height: 40px;
	font-size:1.2em;
	background: url(../images/m-cart-empty.png)
		no-repeat 95% 45%;
	background-color: #9C00FF;
}
.order-add{
	background-image: url(../images/m-cart-full.png) ;
}
.order:hover{background-color:#7B19BA}
.prod-detail .table-li{height: auto;}
.m-p-table{
	width:100%; border: 2px solid #d7baea;}
.m-p-table li{
	height:30px; border-bottom: 2px solid #d7baea;
	color:#9C00FF  ; line-height: 30px; padding: 0 20px;
}
.m-p-table li.n2{
	background-color: #f3e0ff;
	text-align: right;
}
.m-p-table li:last-child{border:none;}
.d-p-table{display: none;}

#about-logo{
	width:210px; height: 90px;
	background: url(../../images/logo-about-us.png)
		no-repeat center;
	margin: 30px auto;
}
.about-cover{
	width:300px; height:200px;
	margin:20px auto 30px auto;
}
.about-title-m{
	font-size: 1.5em;
	line-height: 1.5em;
}
.about-title-d{display:none}
.about-mid-image{
	width:300px; height:200px;
	margin:30px auto;
}
.certification{display:none}
#contact-map{display:none;}
.address-m {margin:30px auto;}
.address-m p{
	line-height:2em; max-width:600px;
	margin: auto;
}
.address-m span{
	text-align:right; float: right;
	direction: ltr;
}
.address a{color:#383838;}
.address a:hover{color:#7B19BA}
.address #homepage-link{
	display:block; text-align: center;
}
.address .social-gen{width:205px;}
.address-d{display:none}

.contact{
	max-width:900px; margin:30px auto;
	position: relative;
}
.contact .button{
	width:60%; height:50px; right:0;
	font-size:1.2em;
}
.cart_result{
	max-width: 700px; width: 100%;
	min-height: 80px;
	background-color: #F3E6FB;
	border-radius: 3px;
	padding:20px; display: none;
	margin: 30px auto;
}
.cart_result p{color: #7B19BA}
.cart_result p:first-child{font-size: 1.5em;color: #15C0DA;}
.cart_result span{
	font-size: 1em;color: #00B5CB; direction: ltr; text-align: left;
}
.m-cart-item{height:310px;margin-bottom:20px;}
.m-cart-item .gradient{height:200px;}
.m-cart-item h4,.m-cart-item .item-code{bottom:122px}
.cart-table{display:none;}
.cart-specifi{
	max-width:900px; margin:0px auto 30px auto;
	position: relative;
}
.m-cart-dtl{
	display: flex;
	flex-direction: column;
	width:100%; height: 112px;
	background: #9C00FF;
	position: absolute; z-index: 3;
	bottom: 0;
}
.m-cart-dtl li,.m-cart-dtl li span,
.m-cart-dtl li span ul{
	display: flex;
	flex-direction: row;

}
.m-cart-dtl li{margin: auto; width:90%; height:30px}
.m-cart-dtl li p{
	width: 32%; color: #fff;
	height:100%;
}
.m-cart-dtl span{
	width:170px; height:30px;
	position:absolute; right:10px;
}
.m-cart-dtl span ul{width:72px; height:23px;}
.m-cart-dtl span input{
	width:90px; height:23px; padding-top:0px;
	border:none; text-align: center;
	margin-right:5px; border-radius:1px;
}
.m-cart-dtl span .arrows li{
	width: 35px; height:100%;
	background: url(../../images/m-up-down.jpg)
		no-repeat;
	cursor: pointer;
	border-radius:1px;
}
.m-cart-dtl span .arrows li:hover{
	opacity: 0.5
}
.m-cart-dtl span .arrows li.up{
	background-position:0;
	margin-right:2px;
}
.m-cart-dtl span .arrows li.down{
	background-position: -37px 0px;
}
.m-cart-dtl .price span{
	color: #fff; line-height: 0.5em;
	font-size: 1.7em; text-align: center;
	position: relative; display: inline;
}
.m-cart-dtl .price p{
	position: relative;
	top: 15px; right:5px;
}
.cart-table{
	display:none;
	max-width: 1200px; width: 100%;
	min-height:140px;
}
.cart-table tr#head{
	height:60px;
	background: #9C00FF;
}
.cart-table tr {height:80px}
.cart-table th {
	font-size: 1.5em; color: #fff;
	text-align: center; font-weight:100;
	position: relative;
}
.cart-table th span{
	font-size:14px; color: #fff;
	position: absolute;
	right:5px; bottom:5px;
}
.cart-table td {
	font-size: 1.3em; color: #7B19BA;
	text-align: center;
	width:13%; position: relative;
	background: #ebebeb;
}
.cart-table td.name{width:;}
.cart-table td.sum{width:200px;}
.cart-table .sum span {
	font-size: 1.3em; color: #7B19BA;
	text-align: center;
}
.cart-table td.sum a {
	width: 35px; height: 35px;
	position: absolute;
	top:0; right: 0; color: #fff;
	background: #fc3030;
	text-align: center;
	font-size:1.2em;
}
.cart-table td.sum a:hover{
	background: #dc2020;
}
.cart-table .item{
	width: 400px; height:90px;
	margin-right:5px;
}
.cart-table .item img{
	width:130px; height:90px;
	position: absolute;
	left:0;
}
.cart-table .item h4{
	left:140px; top: 25px;
}
.cart-table .item h4 a{
	color: #7B19BA;
	font-size: 1.1em;
}
.cart-table .item h4 a:hover{
	color: #9C00FF;
}
.cart-table td div{
	width: 150px; height:55px;
	margin:auto;
	display: flex;
	flex-direction: row;
}
.cart-table .arrows{
	width: 35px; height: 55px;
	border-radius:1px;
	background: #fff;
}
.cart-table .arrows li{
	height:26px;
	background: url(../../images/d-up-down.jpg)
		no-repeat;
	cursor: pointer;
}
.cart-table .arrows li:hover{opacity:0.5}
.cart-table .arrows .up{
	margin-bottom:3px;
	background-position: 0 0;
}
.cart-table .arrows .down{
	background-position: 0 -29px;
}
.cart-table input{
	width:110px; height:55px; padding-top:2px;
	border:none; text-align: center;
	font-size: 1.5em; margin-right: 3px;
}
.cart-table .fee #all_fee{
	text-align: inherit; display: inline;
	font-size:2.5em;
	color: #7B19BA;
}
.cart-table .fee span{
	color:#7B19BA;
	position: relative;
	top: 10px; right:10px;
}
.cart-specifi textarea{
	min-height:100px; max-width:900px;
}
.cart-table #empty-table{display: none;}
.pay{margin-bottom:80px;}
.pay .m-sum{
	width: 100%; height:130px;
	display:flex;
	flex-direction: column;
	background: #9C00FF;
	padding-top: 10px;
}
.pay .m-sum li{
	color: #fff; text-align: center;
	font-size: 1.3em;
	line-height: 2.2em;
	position: relative;
}
.pay .m-sum li:first-child{width:100%;}
.pay .m-sum li #m_all_fee{
	color:#fff; font-size:2em;
	display:inline-block; line-height: 1.1em;
}
.pay .m-sum li span{
	color:#fff; font-size: 14px;
	position: relative; top:15px;
}
.buy-btns{
	width: 100%; height:170px;
	display:flex;
	flex-direction: column;
	margin-top: 30px;
}
.buy-btns *{color: #fff;}
.buy-btns li{
	margin: auto; height: 60px;
	max-width: 550px; width:100%;
}
.buy-btns li input, .buy-btns li a{
	width:100%; height: 100%;
	display: block;
	font-size: 1.4em;
	text-align: center;
	cursor: pointer;
	margin: auto;
}
.buy-btns .online{
	background: #18ff00;
}
.buy-btns .online:hover{
	background: #17cb05;
}
.buy-btns .enter{
	background: #00bd81;
}
.buy-btns .enter:hover{
	background: #05a572;
}
.buy-btns .cancel{
	background: url(../images/trash.png)
		no-repeat 85% 40% ;
	background-color: #f23232;
	line-height:2.6em;
	font-size: 1.1em;
}
.buy-btns li:last-child{height:50px;}
.buy-btns .cancel:hover{
	background-color: #c82323;
	color:#fff;
}

.comments-icon{
	max-width: 90px; min-width:60px;
	width:100%;
	height: 38px;
	font-family: "Trebuchet MS" , tahoma, arial;
	font-size: 2em;
	text-align: left;
	padding-left: 50px;
	background: url(../../images/comments.png)
		no-repeat left center;
	color: #7B19BA;
}
.like, .dislike{
	width:90px; height: 38px;
	margin: 10px;
	display: flex;
	flex-direction: row-reverse;
}
.like span ,.dislike span{
	font-family: "Trebuchet MS" , tahoma, arial;
	font-size: 2em;
	color: #01B5D0;
	width:70px; text-align: center;
}
.dislike span{color:#FF0018}
.like a ,.dislike a{
	width: 31px; height:35px;
	display: inline-block;
	background: url(../../images/like.png)
		no-repeat right center;
	left:0; right:0; bottom: 0; top: 0;
}
.dislike a{
	background: url(../../images/dislike.png)
		no-repeat right center;
}
.like a:hover, .dislike a:hover{opacity:0.6}
.pagination{
	width:100%; max-width: 350px;
	height:70px; margin:20px auto;
	display: flex;
	flex-direction: row-reverse;
}
.pagination li{
	width:100%; max-width:50px;
	height: 40px; margin: auto;
	background-position: center;
	background-repeat: no-repeat;
	font-size:1.5em;
	line-height:1.5em;
	font-family: "Trebuchet MS", tahoma, arial;
	font-weight:100;
	text-align: center;	direction: ltr;
	color: #9C00FF;
	border-radius: 2px;
	cursor: default;
}
.pagination .page{max-width: 100px;}
.pagination .page:hover{
	-webkit-filter: hue-rotate(0deg);
	-moz-filter: hue-rotate(0deg);
	-ms-filter: hue-rotate(0deg);
	filter: hue-rotate(0deg);
}
.pagination .first{
	background-image: url(../../images/pages-first.png);
}
.pagination .prev{
	background-image: url(../../images/pages-prev.png);
}
.pagination .next{
	background-image: url(../../images/pages-next.png);
}
.pagination .last{
	background-image: url(../../images/pages-last.png);
}
.pagination li:hover,
#back-to-blogs:hover{
	-webkit-filter: hue-rotate(30deg);
	-moz-filter: hue-rotate(30deg);
	-ms-filter: hue-rotate(30deg);
	filter: hue-rotate(30deg);
}

#back-to-blogs{
	width:30px; height:30px;
	display: block;
	background: url(../../images/pages-next.png)
		no-repeat center;
	margin:5px 10px ;
	transform: rotate(180deg);
}
.news{
	position:relative;

}
.news-title{line-height:1.5em;}
.news .img-holder{
	width:300px; height:200px;
	margin: 60px auto 30px auto;
	position: relative;
}
.news img{width:100%; height:100%;}
.news .date{
	top:-40px; height: 30px;
	line-height: 30px;
	background: #9C00FF;
}
.news h3{font-size:1.3em;}
.news .share{
	width: 220px; height:50px;
	margin: 30px auto 20px auto;
	display: flex;
	flex-direction: row;
}
.news .b-social{
	display: flex;
	flex-direction: column;
	margin: 20px auto;
	width:160px
}
.news .b-social p{
	text-align: center;
	color: #7B19BA; line-height: 3em;
}
.news .b-social ul{
	width:160px; margin:0;
}
.cmt-wrap{
	display: flex;
	flex-direction: column;
	margin-bottom:30px;
}
.comments{width: 100%; }
.comments >h4{
	width: 200px; height: 35px;
	font-size: 1.3em;
	font-weight: 100;
	background:url(../../images/comment.png)
		no-repeat left;
	color: #9C00FF;
	margin: 20px;
	margin-left: 00px;
	padding-left: 40px;
	display: block;
}
.comments .form .button{right: 0;}
.other-cmts .comments-icon {
	max-width: 200px;
	color: #9C00FF;
}
.comments-icon span{
	color: inherit;
	font-size: 0.7em;
	position: relative;
    top: -3;
}
.comment{
	width: 100%; min-height: 160px;
	display: block;
	position: relative;
	margin: 20px auto;
}
.comment h4, .smlr-blogs >h4{
	padding-left: 20px;
	font-weight: 100;
	color: #9C00FF;
}
.comment span{
	position: absolute;
	top: 10px; left: 70%;
	color: #999;
	font-size: 0.8em;
}
.smlr-blogs{
	display:none; padding:10px;
	width: 30%;
}
.smlr-blogs >h4{
	padding-top: 25px;
}
.smlr-blogs .item{
	width:100%; max-width: 250px;
	height:150px;
	margin: 30px auto;
	border-radius: 2px;
}
.smlr-blogs .item:hover{
	box-shadow: 0 0 20px #bbb;
}
.smlr-blogs .item h4{
	font-size: 0.9em;
	line-height: 1.2em;
}
#m-empty-cart{
	display: none; margin: 1em auto;
	max-width: 1000px; width:100%;
	font-size:2.2em; height: 5em;
	line-height: 5em; text-align: center;
	color:rgba(156,0,255,0.15);
	background: #fbfbfb;
	border-radius: 5px;
}
.cntr-notifi{
	height: 40px; display: block;
	width:300px; margin: auto;
	line-height: 40px; padding: 0;
	margin-bottom: 20px !important;
}
.m-agents{
	width:95%; max-width: 900px;
	min-height:200px;
	margin: auto;
}
.m-agents li{
	margin-bottom: 20px;
	padding: 10px; position: relative;
	background: rgba(156,0,255,0.1);
}
.m-agents .inline{
	display: flex;
	flex-direction: row;
}
.m-agents p.no-padd {
	padding-right: 10px;
}
.m-agents h3, .m-agents p {
	padding-right: 40px;
}
.m-agents .agent-name{
	background: url(../../images/agent_name.png) no-repeat right center;
}
.m-agents .agent-tel{
	background: url(../../images/agent_tel.png) no-repeat right center;
}
.m-agents .agent-loc{
	background: url(../../images/agent_loc.png) no-repeat right center;
}
.m-ag-reg-form{
	width: 60%; height: 60px;
	margin: 30px auto;
	display: block; line-height: 60px;
	font-size: 1.5em;
	position: relative;
}

.agents-map{
	display: none;
	width: 1000px ; height: 1000px;
	margin: auto; position: relative;
}
.agents-map svg{
	margin: auto;
	position: relative;
	1background: blue;
}
.agents-map .ard-home{
	width: 25px; height: 25px;
	position: absolute;top: 100px; left: 200px;
	z-index: 15; font-size: 1.2em;
	color: #fff; cursor: pointer;
}
.ag-wrapper{
	width: 100%; height: 100%;
	display: none;
	background-color: rgba(0, 0, 0, 0.2);
	position: fixed;
	z-index: 1000;
}
.ag-detail{
	width: 70%;
	min-height: 40%; max-height:90%;
	background-color: rgba(255, 255, 255, 0.95);;
	position: fixed;
	right: 15%; left: 15%; top: 5%;
	border-radius: 3px;
	overflow-y: auto;
}
.ag-close{
	position: absolute; top: 0px; left: 0px;
	width: 70px; height: 70px;
	background: rgba(255, 0, 0, 0.9);
	color: #fff; text-align: center;
	font-size: 40px;
	line-height: 80px;
	border-radius: 3px 0 5px 0;
	cursor: pointer; opacity: 0.7;
}
.ag-close:hover{opacity: 1;}
.ag-detail h2{
	position: absolute; top: 10px; right: 30px;
}
.ag-pc {
		padding-top: 100px;
		display: flex;
		flex-direction: column;
}

.map-guid{
	width: 200px;
	position: absolute; top:10px; right: 10px;
	border-radius: 5px;
	padding: 20px;
}
.map-guid li{
	height: 40px; line-height: 40px;
}
.map-guid li span{
	width: 15px; height: 15px;
	display: inline-block;
	border-radius: 2px;
}
.map-guid .ok-ag span{background: #30c5e0}
.map-guid .no-ag span{background: #E6E7E8}
.ag-reg{
	display: none;
	min-height: 700px;
	border: 1px solid #ccc;
	border-radius: 5px;
	padding: 10px;
	margin-top: 120px;
	background-color: #fbfbfb;
}
.ag-reg h2{
	margin:-40px 20px 30px;
	background-color: #9C00FF; color: #fff;
	width: 400px; text-align: center;
	height:60px; line-height: 60px;
	border-radius: 3px;
}
.ag-form{margin-bottom: 20px;}
.ag-form li{
	padding: 5px 20px;
}
.ag-form .name{
	margin-bottom:10px; font-weight: bold;
}
.ag-form .radio-title{margin-bottom: 20px;}
input[type="radio"]{display: none;}
input[type="radio"] + label{
	width: 60px; margin-left: 20px; color: #444;
}
input[type="radio"] + label span{
	display: inline-block;
	width: 25px; height:25px;
	vertical-align: middle;
	border-radius: 12px;
	cursor: pointer;
	margin: 0 0 0 10px ;
	background-color: #eee;
}
input[type="radio"]:checked + label span{
	background-color: #9c00ff;
}
.ag-btns{
	min-height: 60px;
}
.ag-btns input{
	width: 60%; height: 50px;
	display: inline-block;
	line-height: 50px;
	font-size: 1.2em; float: left;
	margin: auto 20px auto 0; position: relative;
}
.ag-btns input[type="reset"]{
	width:30%;
	background: rgba(156,0,255,0.4);
}
.ag-msg{
	display: block;
	min-width: 30%;
	margin: 20px auto; height:60px;
	line-height: 53px;
	font-size: 1.2em;
}
