@font-face {font-family: "ProximaNova"; src: url("../../../environment/assets/font/ProximaNova/ProximaNova-Light.otf"); font-weight: normal; font-style: normal;}
@font-face {font-family: "ProximaNova"; src: url("../../../environment/assets/font/ProximaNova/ProximaNova-Bold.otf"); font-weight: bold; font-style: normal;}
@font-face {font-family: "ProximaNova"; src: url("../../../environment/assets/font/ProximaNova/ProximaNova-LightItalic.otf"); font-weight: normal; font-style: italic;}
@font-face {font-family: "ProximaNova"; src: url("../../../environment/assets/font/ProximaNova/ProximaNova-BoldIt.otf"); font-weight: bold; font-style: italic;}

body {position: relative; margin: 0; padding: 0; background:url("../../../images/Web/bg1920.jpg") no-repeat fixed center top #1c130e; font-family: ProximaNova; color: rgba(242, 232, 201, 0.93);}
a{color: rgba(242, 232, 201, 0.93);text-decoration: none}
.row {display: table; width: 100%;}
.pull-left{float:left!important;}
.pull-right{float:right!important;}
.payment {padding-top:20px;}
.payment-method {margin-bottom:10px!important;}
.payment > dd.payment-method {border-bottom:1px solid #fff;padding-bottom:15px;position:relative;}
.payment > dd.payment-verified{color:#fff;position:relative;}
dd.payment-verified > a {display: inline-block; width:49%; word-wrap: break-word;}
dd.payment-verified > a img {width: 100%;}
dd.payment-verified > span {float: right;width:51%;font-size: 70%}
.paypal-button {min-height: 53px; margin-top: 8px; text-align: center;}

.modal-desc {display: table; position: fixed; z-index: 101; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.9); opacity: 0; pointer-events: none; -webkit-transition: opacity 0.15s linear 0s; transition: opacity 0.15s linear 0s;}
.modal-desc-active {opacity: 1; pointer-events: auto;}
.modal-desc .modal-dialog {display: table-cell; vertical-align: middle; pointer-events: none;}
.modal-desc .modal-dialog .modal-content {width: 100%; max-height: 600px; margin: 0 auto; overflow: auto; pointer-events: auto;}
.modal-desc .panel-popup {padding: 20px; color: #fff; font-size: 20px; text-align: center;}
.modal-desc .panel-popup .loader {
    border: 10px solid #f3f3f3; /* Light grey */
    border-top: 10px solid rgba(22 221 231 / 0.8); /* Blue */
    border-radius: 50%;
    width: 50px;
    height: 50px;
    margin: 15px auto;
    animation: spin 2s linear infinite;
  }
  
  @keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }

.css-lghgwg {color: rgba(242, 232, 201, 0.93) !important;}
.shipping-address-section p:first-child {color: rgba(242, 232, 201, 0.93) !important;}

/*------------------------------------
 * NEW CSS CHECKOUT
 *------------------------------------*/
.money{font-weight: bold;font-family: Century-Regular}
.total-str{font-weight: bold;color: rgba(22, 221, 230, 0.8);font-size: 110%}

.view-detail{position: relative; z-index: 5; width: 100%;}
.view-detail a{cursor: pointer;color: rgba(22, 221, 230, 0.8)}
.view-detail a:hover{color: #FFF}
.item-desc {position: relative; padding: 5px 2px; line-height: 15px;}
.item-desc .save-design {bottom: 0; right: 0; color: #ff8400; text-transform: uppercase;}
.model-no{color: #fb7600};

/*coupon*/
.submitFrmCheckout {cursor: pointer;}
/*.submitFrmCheckout img{width: 100%; animation: boxGrow 3s linear infinite;-webkit-animation: boxGrow 3s linear infinite;-moz-animation: boxGrow 3s linear infinite;}*/
.submitFrmCheckout img{width: 100%;}
.coupon{clear: both; padding-top: 2%; white-space: nowrap;}
.coupon input{width: 140px; margin: 0 3%; padding: 6px; border: 1px solid #FFF; box-sizing: border-box; background:rgba(0, 0, 0,.9); outline: medium none; color: #FFFFFF;}
.coupon input:focus{box-shadow: 0 1px 2px #FFF}
.itailor-shopping .txt-coupon{margin-left: 27%;color: #00b3ee;font-weight: bold;display: none;margin-top: 3%}
#gift-balance{width: 115%;color: #FF5C1D;margin: 10px 0}

/*------------------------------------
 * table checkout
 *------------------------------------*/
.itmdetail {display: table; width: 100%;}
#order-list tb{width: 100%;height: 100%;margin: auto;position: relative;vertical-align:middle}
.custom-info{text-align: center;font-size: 130%}
.custom-info,#order-list tb hh{color: #79C483;font-weight: bold}
#order-list tb hh,rr{width: 97%;display: block;margin: 0;}
#order-list tb .list-item{background-color: rgba(0,0,0,.3);}
#order-list tb .list-item dd:last-child{background-color: rgba(0,0,0,.7);}
#order-list tb rr{height: 117px;margin: 3px 0;overflow: hidden;font-size: 75%}
#order-list tb rr:last-child{margin-bottom: 50px}
#order-list tb hh dd{border: none;padding: 7px .5%}
#order-list tb hh dd:last-child{border: none}
#order-list .list-item:hover{background: rgba(0, 0, 0, 0.6);}
#order-list tb hh{overflow: hidden;margin: 0 0 3px;background: rgba(0,0,0,.3);font-size: 80%;width: 100%}
#order-list tb dd{float: left;text-align: center;padding: 0.5%;overflow: hidden;height: 100%;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;position: relative}
#order-list tb dd:last-child{text-align: center}
#order-list tb dd:nth-child(1) {display: none;width: 7%;}
#order-list tb dd:nth-child(2) {width: 65%;}
#order-list tb dd:nth-child(3) {display: none;width: 10%;}
#order-list tb dd:nth-child(4) {width: 25%;}
#order-list tb dd:nth-child(5) {display: none;width: 9%;}
#order-list tb dd:nth-child(6) {display: none;width: 5%;}
#order-list tb dd:nth-child(7) {width: 6%;}
#order-list tb dd:nth-child(8) {display: none;width: 10%;}
#order-list tb dd:nth-child(2) img {width: 72px}

#order-list tb rr:nth-child(1n) dd:nth-child(2n+3){padding-top: 8%}
#order-list tb rr:nth-child(1n) dd:nth-child(2n+4){padding-top: 8%}
#order-list tb rr:nth-child(1n) dd:nth-child(3){padding-top: 5%}
#order-list tb rr:nth-child(1n) dd:nth-child(7){padding-top: 7%}
.delete:hover{cursor: pointer;opacity: 0.8}

/* Check out */
.wrapper {position:relative;width:100%;}
.masthead{padding: 5px 0 0 0;height: 25px;}
.masthead,.mastcontainer {position:relative; max-width: 1024px; margin: 0 auto 15px;}
.mastcontainer {margin-bottom:0px;}
.option {width:97%!important;}
label.itc2 {width:87%!important;}
    
.list-number {display: none; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 38px; height: 38px; margin: auto; overflow: hidden; background: url("../../../itailor-data/webroot/img/bg/bg-list-number.png") no-repeat; background-size: 100% 99%; line-height: 38px;}
.contleft, .contright {height: 0px; overflow: hidden; -webkit-transition: height 300ms ease 0s; transition: height 300ms ease 0s;}
.contleft {position: relative; background: rgba(0, 0, 0, 0.3);}
.contleft-toggled {height: 700px;}
.contright {position: relative; background: rgba(0,0,0,.3); font-size: 90%; font-weight: bold;}
.contright-toggled {height: auto; padding: 5px 0;}
.cont-desc-list {position: relative; width: 95%; margin: 0; padding: 0 0 0 4%; border-left: 2px solid rgba(255,255,255,0);}
.cont-desc-list > dd {display: table; width: 98%; margin: 0px; padding-top: 4px;}
.cont-desc-list > dd > span:nth-child(3) {margin-left:25%; padding-top: 2px;}
.cont-desc-list > dt {margin-bottom:10px;}
input[class*="itc"], input[class*="itc-hidden"] {border: solid 1px rgba(255,255,255,.3);background:rgba(0, 0, 0, 0.8);width:94%;padding:6px 2px;outline:none;color:#FFF;float: right;font-size: 18px;}
input:focus{box-shadow:0 0 5px #fff}
select {width: 94%; margin-left: 6px; padding: 3px; border: solid 1px rgba(255, 255, 255, 0.3); box-sizing: border-box; background: rgba(0, 0, 0, 0.8); color: #FFFFFF; text-transform: capitalize; font-size: 18px;}
.wf-1 {width:25%;float:left;line-height:36px;position:relative;text-overflow: ellipsis;white-space: nowrap;overflow: hidden; font-size: 14px;}
.wf-2 {width:72%;float:left;position:relative;}
.wr-1 {width:100%;position:relative;margin-top: 2%}
.cont-lstdetail {position: relative;float: left;height: 100%; width: 100%;}
.mod-phone {width: inherit;}
.mod-phone .country-code {width: 80px;}
.mod-phone .phone-2 {width: 130px;}

.itailor-shopping,.itailor-process{font-size: 80%;}
.itailor-shopping {position: relative; padding: 2%;}
.itailor-shopping a {color: rgba(255, 255, 255, 0.8);}
.itailor-shopping a:hover{color: #FFF}
.itailor-shopping .credit-value {display: none;}
#linkCoupon{font-weight: bold;text-decoration: underline;font-size: 115%; cursor: pointer;}

.itailor-process{position:relative; padding: 0 10px; box-sizing: border-box; font-weight: bold;}
.itailor-process > div > span:first-child {width:60%;margin-right:5%;position:relative;text-align:right;}
.itailor-process > div > span:nth-child(2) {width:22%;position:relative;text-align:right;font-family: Century-Regular}
.itailor-process > div:nth-child(4) > span:nth-child(2) ,.itailor-process > div:nth-child(4) > span:nth-child(3){border-bottom:1px solid #eee;font-family:Century-Regular}
.itailor-process > div:nth-child(5) > span:nth-child(2),.itailor-process > div:nth-child(5) > span:nth-child(3) {border-bottom:3px double #eee;padding-bottom: 2%;font-family: Century-Regular}
.itailor-process > div > span:nth-child(3) {padding-left: 4px; font-family: Century-Regular;}
.itailor-process table {width: 100%;}
.itailor-process table th, .itailor-process table td {padding: 1px 0;}
.itailor-process table tr > td {font-size: 1.1em;}
.itailor-process table tr > th {text-align: right; font-family: Century-Regular; font-size: 1.15em;}
.itailor-process table tr > td.cell-total {padding: 5px 0; color: #FE3A14; font-size: 1.8em;}
.itailor-process table tr > th.cell-total {padding: 5px 0; border-top: 3px double #eee; color: #FE3A14; font-size: 1.8em;}
.itailor-process .sub-total {font-size: 1.25em;}
.itailor-process .lite-text {font-size: 100%; font-weight: normal;}
.itailor-process .lite-text > th {font-size: 1em;}
.itailor-process .option-express {font-size: 12px;}
.itailor-process .option-express input[type="checkbox"] {display: none;}
.itailor-process .option-express input[type="checkbox"] + label span:first-child {display: inline-block; height: 22px; width: 22px; margin-top: -4px; background: url(../img/icon/check_radio_sheet.png) no-repeat scroll left top; vertical-align: middle; cursor: pointer;}
.itailor-process .option-express input[type="checkbox"]:checked + label span:first-child {background: url("../img/icon/check_radio_sheet.png") no-repeat scroll -22px top rgba(0, 0, 0, 0);}
.itailor-process .ccc-info {display:  inline-block;}
.itailor-process .ccc-info .button-ccc-info {
    display: inline-block;
    width: 18px;
    height: 18px;
    padding-top: 1px;
    border: solid 1px rgba(242, 232, 201, 0.93);
    border-radius: 100%;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    line-height: 15px;
    cursor: pointer;
    box-sizing: border-box;
}
.itailor-process .price-value {display: inline-block; position: relative;}
.itailor-process .price-value .line-through {position: absolute; top: 45%; right: -5%; width: 110%; border-top: solid 1px rgba(219, 219, 219, 0.8);}
.itailor-process .free-shipping {opacity: 0.7;}
.itailor-process .block-banner {text-align: center;}
.itailor-process .block-banner img {width: 250px;}
.itailor-process .no-tariffs {padding-right: 0 !important; color: #4FCF6A; text-align: center; letter-spacing: 2px; text-transform: uppercase;}
.mastcontainer .button{display: inline-block;padding: 2% 5%;text-align: center;text-transform: uppercase;background:rgba(22, 221, 230, 0.8);border: none;cursor: pointer;color: #FFF;font-weight: 500;border: 1px solid rgba(255, 255, 255, 0.3);letter-spacing: 1px}
.mastcontainer .button:hover{background-color: rgba(31, 154, 194, 0.53)}
.mastcontainer .button-coupon{background: rgba(22, 221, 230, 0.8)}
.mastcontainer .button-coupon:hover{background:#399E26}
.mastcontainer .btn-continue{position: absolute;bottom: 1px;margin: 5px;padding: 4px; z-index: 50;}
.mastcontainer .total-item{position: absolute; right: 20px; bottom: 5px;}

.product-recommend{transition: background-color 1s ease-in-out;-webkit-transition: background-color 1s ease-in-out;-moz-transition: background-color 1s ease-in-out;background:url("../../../itailor-data/webroot/img/bg/border-color-colorful.png") no-repeat rgba(0,0,0,.5);background-size: 99.75% 98%;cursor: pointer;display: inline-block;font-size: 120%;padding: 0% 5%;}
.product-recommend a {display: block; color: #FFF; padding: 5px 10px; box-sizing: border-box; white-space: nowrap;}

.link-str a{color: #69c9dd; font-size: 80%}
.link-str a:hover{color:#FFF}
#list-country{width: 218px;margin-left: 10px;background:url("../../../itailor-data/webroot/img/bg/border-color-silver.png") no-repeat rgba(0,0,0,.9);background-size: 100% 99%;}
#list-country ul{background: rgba(0,0,0,.9)}

.validation-error{border: solid 1px red!important;box-shadow: 0 0 10px red}
.validation{position: relative;margin-left: 45%}
.validation-arrow{position: absolute;border: solid 10px red!important;border-bottom-color: transparent!important;border-right-color: transparent!important;border-left-color: transparent!important;left: 2%;margin-top: -10px;}
.validation-tooltip{background-color: red;border-radius:4px!important;color: #FFFFFF!important;padding: 5px 6px!important;position: absolute;width: 140px;text-align:center;z-index: 101;font-size: 13px!important;left: 0%;margin-top: -35px;}

#country-box{position:relative}
#country-box:after{content:'>';font:14px "Consolas";-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);right:5px;top:0px;position:absolute;pointer-events:none;color: #FFF}
#country-box:before{background:rgba(0, 0, 0, 1);content: "";display: block;height: 24px;pointer-events: none;position: absolute;right: 1px;top: -4px;width: 20px;}

.nav-checkout {margin-top: 20px;}
.nav-checkout a {display: block; width: 95%; margin: 0px auto; padding: 20px 10px; box-sizing: border-box; background-color: #4bbb10; color: #ffffff; font-size: 1.1em; font-weight: bold; text-align: center; cursor: pointer; text-transform: uppercase; letter-spacing: 1px;}
.nav-checkout a:active {position: relative; top: 1px;}
.nav-checkout-shipping-cart {position: absolute; z-index: 50; width: 55px; height: 55px; margin-top: -5px;}
.nav-checkout-shipping-cart img.checkout-shipping-cart {display: block; cursor: pointer;}
.FrmCheckout {position: relative;}

/*.payment-method > a {display: inline-block; width: 49%; cursor: pointer;}*/
.payment-method ul > li .submitFrmCheckout img {display: block; width: 80%; margin: 0 auto;}
.payment-method #tzp-button {
    width: 250px;
    margin: 0 auto 20px auto;
    border-radius: 4px;
    background-color: #16b3bb;
    cursor: pointer;
}
.payment-method #tzp-button:active, .payment-method #amex-button:active {
    position: relative;
    top: 1px;
}
.payment-method #tzp-button > img {
    display: block;
}
.payment-method #amex-button {
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    width: 250px;
    margin: 0 auto;
    border-radius: 4px;
    background-color: #fff;
    text-align: center;
    cursor: pointer;
}
.payment-method #amex-button > img {
    display: inline-block;
}
.payment-method #amex-button .amex {
    height: 34px;
}
.payment-method #amex-button .american-express {
    width: 188px;
}
.popupMaya .popupMaya-data{width: 100% !important;}
.toolbar {margin-top: 5px;}
.toolbar .menuRight a {font-size: 18px;}

@media only screen and (min-width: 768px) {
    .itailor-process .block-banner {text-align: right;}
    .itailor-process .block-banner img {width: 280px;}
    .itailor-process .no-tariffs {text-align: right;}
}

@media only screen and (min-width: 1024px) {
    .contleft, .contright {float: left; height: auto; min-height: 595px;}
    .contleft {width: 65%;}
    .contright {display: block; width: 35%;}
    .toolbar {margin-top: 0px}
    .toolbar .menuRight a {font-size: inherit;}
    .list-number {display: block;}
    #order-list tb dd:nth-child(1) {display: block;}
    #order-list tb dd:nth-child(2) {width: 34%;}
    #order-list tb dd:nth-child(3) {display: block; width: 10%;}
    #order-list tb dd:nth-child(4) {width: 10%;}
    #order-list tb dd:nth-child(5) {display: block; width: 10%;}
    #order-list tb dd:nth-child(6) {display: block;}
    #order-list tb dd:nth-child(8) {display: block;}
    .itailor-shopping, .itailor-process {float: left;}
    .itailor-shopping {width: 46%; min-height: 130px;}
    .itailor-shopping .credit-value {display: block; position: absolute; bottom: 0;}
    .itailor-process {width: 50%; padding: 0 18px;}
    .itailor-process table td {text-align: right; padding-right: 15px !important; box-sizing: border-box;}
    .itailor-process table tr > td.cell-total {color: #69c9dd; font-size: 1.5em;}
    .itailor-process table tr > th.cell-total {color: #69c9dd; font-size: 1.5em;}
    .itailor-process .black-friday {color: red;}
    .itailor-process .option-express label {font-size: inherit;}
    .itailor-process .block-banner img {width: 250px;}
    .mastcontainer .btn-continue{padding: 5px}
    .nav-checkout {display: none;}
    .wf-1 {width: 30%; font-size: 90%; line-height:22px;}
    .wf-2 {width: 67%;}
    .cont-desc-list > dd > span:nth-child(3) {margin-left: 30%;}
    input[class*="itc"], input[class*="itc-hidden"] {padding:5px 2px; font-size: 90%;}
    select {font-size: 90%;}
}