.fn-blue{color:#51c5e2!important;}
.fn-yellow{color:#efd593!important;}
.fn-skyblue{color:#5cd9ec!important;}
.fn-orange{color:orange!important;}
.fn-red{color: red!important;}
.fn-bold{font-weight: bold}

.fl-left{float: left!important;}
.fl-right{float: right!important;}

.align-left{text-align: left!important;}
.align-right{text-align: right!important;}
.align-center{text-align: center!important;}

.cursor{cursor: pointer}
.dp-none{display: none!important;}

.hv-orange:hover{color: #f3b100;}
.hv-orange:hover *{color: #f3b100;}
.hv-white{color: #FFFFFF}

a{color: #FFF;text-decoration: none}
hr {border-color: rgba(255, 255, 255, 0.3);border-style: solid none none;border-width: 1px 0 0;height: 0.5%;margin: 11% 2% auto;text-indent: -9999px;}

/*==============================================================================
 *preload
 *==============================================================================*/
.preload{position: fixed;width: 100%;height: 100%;left: 0;top:0;background: #000;z-index: 99999;margin: auto}
.preload .preload-main{width: 37%;max-width: 500px;position: relative;margin: auto;top:33.2%;text-align: center;}
.preload .preload-main div{height: 3px;background:rgba(255, 255, 255, 0.1);border-radius:2px;text-align: center;position: relative;margin-top: 5%;margin-bottom: 5%}
.preload .percent-bar-preload{height: 3px;background: #FFFFFF!important;margin: auto;border-radius:2px;width: 0px}
.preload .percent-txt-preload{font-size: 160%;font-weight: 100;text-shadow: 0 0 5px yellow}

.toolbar li {
    display: inline-block;
}
.toolbar a {
    font-size: 100%;
    letter-spacing: 2px;
}

/*==============================================================================*/
/* MAIN
/*==============================================================================*/
html{background-color: #140B06;overflow: auto;font-family: ProximaNova;color: #FFF}
body {background: url("../jpg/background1920.jpg") no-repeat scroll center top;margin: auto;position: relative}
#footer{background: url("../png/seperate.png") no-repeat scroll center top #140B06;}
#container{width: 1024px;margin: auto;overflow: hidden;position: relative}
#logo-itailor{text-align: center;width: 100%;}

/*==============================================================================*/
/*MENU
/*==============================================================================*/
#menu{float: left;width: 28.5%;overflow: hidden; height: 1000px;margin-right: 0.5%;position: relative;clear: both}
#menu a{color: #dbd8c1;font-size: 98%}
#menu-main{background:rgba(0, 0, 0, 0.5);width: 50%;height: 100%;position: relative;font-size: 90%}
#menu li{cursor: pointer;margin: 15px 0;overflow: hidden;padding: 2%;position: relative; font-size: 120%; letter-spacing: 2px;}
#menu *{white-space:nowrap;text-transform: capitalize;text-overflow: ellipsis}
#menu li p:nth-child(1){margin-bottom: 5%}
#menu li .block-regular {
    display: inline-block;
    position: relative;
    color: #46D5FE;
}
#menu li .regular-line {
    position: absolute;
    top: 45%;
    left: -5%;
    width: 107%;
    border-top: solid 1px rgba(219, 219, 219, 0.5);
}
#menu li .category-price{color: #46D5FE;}
#menu li .discount{color: #fe3a14;font-weight: bold;font-size: 120%;margin-left: 2%}
/*#menu li .category-price{font-size: 80%;position: relative}*/
/*#menu li .category-price:after{content: "";position: absolute;left: 0;top:0;bottom: 0;right: 0;width: 100%;height: 1px;background: rgba(255,255,255,.7);margin: auto}*/

.menu-active{background:rgba(255, 255, 255, 0.1);color: #AC650A}
#menu li.menu-active a,#menu li.menu-active span{color: #edd392}

.sub-menu-active{background:rgba(0, 0, 0, 0.3);color: #edd392;}
.sub-menu-active > span,.menu-active > span{color: #edd392;}
.bg-sub-menu-main{ background:rgba(0, 0, 0, 0.2);height: 100%;width: 100%;left: 100%;position: absolute;text-indent: -99999px}
#ul-fabric li.sub-menu-active p{color: #edd392!important;}
#ul-fabric li{margin-bottom: 5%;}
#ul-fabric li.sub-menu-active{background: url("../png/hilightfabric.png") no-repeat scroll center top}

/*submenu*/
#menu .sub-menu-main{height: 100%;position: absolute;width: 100%}
#menu .sub-menu-main ul{list-style: none;display: none}
#menu .sub-menu-main ul:nth-child(1){text-align: center;margin-top: 22%}
#menu .sub-menu-main ul:nth-child(2){margin-top: 50%;}
#menu .sub-menu-main ul:nth-child(3){padding-top: 66%;}
#menu li:hover ul{color: #dbd8c1;}
#menu-fabric ul:last-child{text-align: center}

#shipping-bag-main{text-align: right;padding: 3%;position: relative;min-height: 13%;font-size: 85%;letter-spacing: 1px;}
#shipping-bag-main p{padding: 3%}
.txt-checkout{cursor: pointer;text-align: center;font-size: 100%;padding: 2% 0 2% 0;background: url("../png/bg-checkout.png") no-repeat scroll center top;color: #d6d6d6}
.txt-checkout:hover{color: #FFF;text-shadow: 0px 0px 0px #FFF;}
.iconArrow{vertical-align: middle}
/*slide vdo*/
#slide-vdo{width: 100%;position: relative;background: #FFF;margin-top: 10%;height: 98px;margin-bottom: 10%}
#slide-vdo img{width: 100%;position: absolute;cursor: pointer}
a#menu-main-link-magazine:hover{color: #FFFFFF;text-shadow: 2px 2px 2px #FFF;}

/*==============================================================================*/
/*MAIN DESIGN
/*==============================================================================*/
#design-main-box{overflow: hidden}
.tab-main{width: 71%;float: left;position: relative;height: 100%}
#design-main-detail{width: 500px;height: 420px;float: left;margin-top: 4%;}
.bannerMenuL{left: 10%!important;}
#design-main-detail #main-3design{position: relative;height: 100%;overflow: hidden;top:20%}
#design-main-detail #main-3design li{display: none}
#design-main-detail img{position: absolute;margin: auto;left: 12%}
#design-main-detail #tie-width .img-main{left: 28.4%;top:31px}
#design-main-detail #tie-width .sizeStr{bottom: 94px;color: #87CEEB;margin: auto;position: absolute;text-align: center;width: 83%;font-size: 90%}

.btn-step{cursor: pointer; font-size: 22px; letter-spacing: 2px;}
.btn-step:hover{color: #FFFFFF;text-shadow: 1px 1px 2px #FFFFFF;}
#btn-back-step{margin-left: 2%}
#btn-next-step{float: right;margin-right: 2%}

#product-detail{position: absolute;font-size: 80%;top:50px;right: 5%;width: 300px}
#product-detail ul{list-style: none}
#product-detail ul li{clear: both;height: 20px}
#product-detail span:first-child{width: 100px;float: left;text-align: right;margin-right: 10px; text-overflow: ellipsis;white-space: nowrap;width: 100px;overflow: hidden}
#product-detail span:last-child{margin-left: 10px}
#product-detail .special-detail{padding-left: 15%}
#product-detail .box-price{color: #ff4500;font-size: 120%;padding-top: 5%}
#product-detail .box-price *{color: #ff4500;font-size: 120%;font-weight: bold}
#product-detail .detail-str{height: 170px;overflow: hidden}

#main-3design .mongarm-view{position: absolute;width: 200px;z-index: 999;text-align: center;font-size: 70%;font-family:'Mtcorsva'}
#main-3design .position-Center_front3{top: 200px;right: 150px;transform: rotate(-60deg);-ms-transform: rotate(-60deg);-webkit-transform: rotate(-60deg);-o-transform: rotate(-60deg);-moz-transform: rotate(-60deg);}
#main-3design .position-Center_front10{top: 147px;right: 263px;transform: rotate(-75deg);-ms-transform: rotate(-75deg);-webkit-transform: rotate(-75deg);-o-transform: rotate(-75deg);-moz-transform: rotate(-75deg);}
#main-3design .position-Slanted{top: 235px;right: 110px;transform: rotate(-20deg);-ms-transform: rotate(-20deg);-webkit-transform: rotate(-20deg);-o-transform: rotate(-20deg);-moz-transform: rotate(-20deg);}
#main-3design .position-CutCenter_front3{top: 235px;left: 45px;transform: rotate(44deg);-ms-transform: rotate(44deg);-webkit-transform: rotate(44deg);-o-transform: rotate(44deg);-moz-transform: rotate(44deg);}
#main-3design .position-CutCenter_front10{top: 146px;left: 132px;transform: rotate(30deg);-ms-transform: rotate(30deg);-webkit-transform: rotate(30deg);-o-transform: rotate(30deg);-moz-transform: rotate(30deg);}
#main-3design .position-On_linning{top: 260px;left: 35px;transform: rotate(40deg);-ms-transform: rotate(40deg);-webkit-transform: rotate(40deg);-o-transform: rotate(40deg);-moz-transform: rotate(40deg);}

/*==============================================================================
* menu s
*===============================================================================*/
#menu-s{width: 100%;position: absolute}
.tab-menu-s{display: none}
#menu-s #title ,.tab-menu-s .title span,.title span{margin-bottom: 2%;letter-spacing: 2px;}
#list-monogram-slide-detail span{font-size: 85%!important;font-weight: 100;margin-bottom: 2%}
#menu-s-slide{min-height: 200px;margin-left: 4.5%;margin-right: 6%;margin-top: 1%;overflow: hidden;position: relative;width: 91%;}
#menu-s-slide .option-unit{white-space: nowrap}

#menu-s ul,.tab-menu-s ul{overflow: hidden;width: 100000px;}
#menu-s ul li,.tab-menu-s li{float: left;position: relative;list-style: none;margin-left: 3px;cursor: pointer}
#menu-s ul li img,.tab-menu-s li img{width: 100%;}
#monogramHole li img{width: auto; height: 50px;}
img.menu-s-button{z-index: 100}
img.menu-s-buttom-Hole{z-index: 95}
#menu-s .button-slide-menuS{position: absolute;z-index: 999;top: 3%;cursor: pointer}
#menu-s .button-slide-menuS:hover{opacity: 0.8}
#menu-s #button-back{left: 0}
#menu-s #button-next{right: 0}

#menu-s li ,#menu-s-contrast li{cursor: pointer;position: relative}
.monogram-slide-menuS{height: 170px;position: absolute;width: 400px;}
.monogram-slide-menuS li{cursor: pointer}
#list-monogram-slide-detail #input-monogram-text{background:rgba(0, 0, 0, 0.3);border-radius: 2px 2px 2px 2px;border: 1px solid #E2DFC7;outline: medium none;padding: 2px;font-size: 85%;margin-left: 5%}
.monogram-input{background: rgba(0, 0, 0, 0.3);border: 1px solid #E2DFC7;border-radius: 2px 2px 2px 2px;font-size: 95%;height: 20px;margin-left: 2%;outline: medium none;padding: 2px;color: #FFF}
.icon-check-item{bottom: 0;position: absolute;right: 0;z-index: 999;width: 30px!important;height: 29px!important;}
[data-main="style"] .icon-check-item{right: 25px;bottom: 40px}
[data-main="width"] .icon-check-item{bottom: 25px}
[data-main="monogram"] .icon-check-item{right: 15px;bottom: 40px}

/*Menu S size item*/
[data-main="fabric"]{position: absolute}
[data-main="fabric"] li{width: 70px;height: 70px;}
#menu-s-slide  .styleStr{text-align: center;font-size: 80%}
#menu-s-slide [data-main="style"] li{width: 140px;height: 175px;margin-right: 10px}
#menu-s-slide [data-main="width"]{width: 350px;line-height: 8px;float: left}
#menu-s-slide [data-main="width"] li{width: 73px;height: 170px;margin-right: 10px}
#menu-s-slide .option-unit p{margin-bottom: 1%}
#menu-s-slide [data-main="width"] .option-unit{width: 304px;position: relative;float: left;font-size: 80%}

#menu-s-slide [data-main="monogram"] li{width: 72px;height: 119px;margin: 0}
#menu-s-slide [data-main="monogram"] li img{position: absolute}
#menu-s-slide [data-main="monogram"] li .styleStr{position: absolute;font-size: 50%;top: 66%;margin: auto;width: 100%;}

#menu-s-style-width{width: 100%}
#menu-s-style-width #menu-s-slide{width: 100%;margin: 1% 0}

#menu-s-monogram #menu-s-slide{margin: 0;width: 100%}

#title{font-size: 95%}
#FrmAddTie .button-add-cart{display: inline-block;padding: 2% 5%;cursor: pointer;background: #39a724;color: #FFF;font-weight: 500;animation: 3s linear 0s normal none infinite boxGrow;margin-top: 8%;}
#FrmAddTie .button-add-cart:hover{background:  rgba(0, 148, 178, 0.95);}

/*------------------------------------------------------------------------------*/
/*CHECKBOX AND RADIO MEDIA*/
/*------------------------------------------------------------------------------*/
input[type="checkbox"] {display:none;}
input[type="checkbox"] + label {color:#f2f2f2;font-size:94%;cursor: pointer}
input[type="checkbox"] + label span {display:inline-block;width:19px;height:19px;margin:-1px 4px 0 0;vertical-align:middle;background:url(../png/check_radio_sheet.png) left top no-repeat;cursor:pointer;}
input[type="checkbox"]:checked + label span {background-position: -19px}

input[type="radio"] {display:none;}
input[type="radio"] + label {color:#f2f2f2;font-size:14px;cursor: pointer}
input[type="radio"] + label span {display:inline-block;width:19px;height:19px;margin:-1px 4px 0 0;vertical-align:middle;background:url(../png/check_radio_sheet.png) -38px top no-repeat;cursor:pointer;}
input[type="radio"]:checked + label span {background-position: -57px}