@import url('https://fonts.googleapis.com/css?family=Montserrat:400,700');
@import url('https://fonts.googleapis.com/css?family=Libre+Franklin%3A300%2C300i%2C400%2C400i%2C600%2C600i%2C800%2C800i&subset=latin%2Clatin-ext');

.custom-form { font-family: 'Montserrat', sans-serif;}

/* reset bootstrap*/
input[type='text'], input[type='email'], input[type='url'], input[type='password'], input[type='search'], input[type='number'], input[type='tel'], input[type='range'], input[type='date'], input[type='month'], input[type='week'], input[type='time'], input[type='datetime'], input[type='datetime-local'], input[type='color'], textarea {padding:0 20px; }
.form-control {line-height:52px; height:52px; padding:0 20px; font-size:20px;}
#product_delivery_info .error-input {border-color:#ff6766}
#product_delivery_info .form-control:focus { border-color:#19cad5; box-shadow:none;}

.form-control { box-shadow:none;}

#product_delivery_info .error-input {border-color:#ff6766}
#product_delivery_info .form-control:focus { border-color:#04CE9C; box-shadow:none;}
.form-control { box-shadow:none;}


.btn-success { background-color:#00ce9d; border:none; border-bottom:solid 4px #207e5a; color:#fff;}
.btn-success:hover {background-color:#21bd98;}
.btn-success.disabled:hover {background-color:#00ce9d; border-color: #207e5a;}

.btn-primary { background-color:#1acad4; border:none; font-weight:600;}
.btn-primary:hover{ background-color:#17a1a9;}



.page-template-page-custom .site-content { padding-top:0px;}
.custom-form fieldset { border-top:none;}

/*Radio button*/
.radio-btn {display: inline-block;}
input[type="radio"] + label {padding-left: 50px;position: relative; font-size: 21px; font-weight: 400;}
input.input-radio[type="radio"] {border: 0 none;clip: rect(0px, 0px, 0px, 0px);height: 0;margin: 0;overflow: hidden;padding: 0;position: absolute;width: 0;}
/*input[type="radio"] + label:before {background-color: #ffffff;border: 1px solid #000000;border-radius: 50%;content: "";cursor: pointer;display: inline-block;height: 25px;left: 0;line-height: 25px;margin-right: 20px;padding: 0;position: absolute;top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);vertical-align: baseline;width: 25px;}
input[type="radio"]:checked + label::before {background-color: #fff;content: "";display: inline-block;}

input[type="radio"]:checked + label::after {background-color: #04ce9c;border-radius: 50%;content: "";display: block;height: 16px;left: 5px;position: absolute;top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);width: 16px;}*/

label .text-muted{display: block; font-size: 13px; color:inherit;}

/* Form Desing */
form.container {max-width: 850px;width: 100%;}
.title {font-size: 18px;font-weight: 600;text-align: center; margin-bottom: 15px; font-family: 'Montserrat', sans-serif;}
.custom-form fieldset{border: none; padding: 20px 0;}
.custom-form fieldset {border-top: 1px solid #cbcbcb;}
.custom-form fieldset:first-child {border: medium none;}
form fieldset legend {border: medium none;color: #212121;display: inline-block;font-size: 18px;font-weight: 600;padding: 0;text-align: center;text-transform: capitalize;}

/* Product color */
#product_color{text-align: center;}
#product_color .radio-btn {display: inline-block;margin: 0 8px;}
#product_image{padding-bottom: 60px;}

/* Dimension */
#product_dimension{text-align: center;}
#product_dimension .radio-btn{padding: 0 15px;}
#product_dimension .radio-btn:first-child input[type="radio"] + label::before, #product_dimension .radio-btn:first-child input[type="radio"] + label::after {left: auto;right: 0; margin-right: 0;}
#product_dimension .radio-btn:first-child input[type="radio"] + label::after{right: 4px;}


#product_size {text-align: center; padding-bottom: 50px;}
select.form-control {background: #1acbd5 none repeat scroll 0 0;color: #ffffff;font-style: italic; -webkit-appearance: none; -moz-appearance: none; appearance: none;}
select.form-control:focus{outline: none; border-color: transparent; box-shadow: none;}


#product_size select.form-control {display: inline-block;margin: 0 10px;max-width: 160px;}
small { font-size:11px;}
.btn-upload  { position:relative; overflow:hidden; min-width:230px; font-size:20px;}
.btn-upload input{ opacity:0; position:absolute; left:0 ;top:0; width:100%; height:100%; cursor:pointer;}

.image-caption { padding:10px 0;}

h3.title { padding:40px 0 0; font-size:30px;font-family: 'Montserrat', sans-serif;}
#product_upload_image h3 { padding:40px 0;}
#product_delivery_info h3 { padding:20px 0;}

.image-interface { clear:both; padding:60px 0 0px;}


.panel-danger { background:#ff6766; color:#fff;border:none; font-size:14px; position:relative;}
.panel-primary { background:#05c7d0; color:#fff;border:none; font-size:14px;position:relative;}
.panel-success { background:#00ce9d; color:#fff;border:none; font-size:14px;}

.image-interface {text-align:center;}
.image-interface .panel-body { padding-left:80px; position:relative;}
.panel-info .panel-body .fa { bottom: 0;display: block;font-size: 50px;left: 30px;line-height: 85px;margin: auto;position: absolute;top: 0;} 
.panel-info .icon-info { background: url(../assets/images/info.png) no-repeat center center; display: block; width: 20px; height: 42px; background-size: 18px auto; top: 0; bottom: 0; left: 30px; position: absolute; margin: auto;}
.panel-msg,.panel-info {  display:inline-block;}
.panel-info  { text-align:left; font-size:20px; max-width:680px}
.panel-msg .panel-body{ padding-left:80px; font-size:18px;}
.panel-msg .fa { bottom: 0;display: block;font-size: 20px;left:0px;line-height: 55px;margin: auto;position: absolute;top: 0; border-right:solid 1px #fff; padding:0 20px;}


#product_delivery_info .form-group { margin-bottom:30px; }
#product_price_mode { text-align:center;}
#product_price_mode .radio-btn { padding:10px 10px;}
#product_price_mode h3 { padding:20px 0 0;}
.radio-btn.rightdot label { padding:0 50px 0 0}
.radio-btn.rightdot label .fa.button{ right:0px;left:auto;}


.bg-success { background:#01cd9c; color:#fff; font-weight:600; display:inline-block;line-height:36px;padding:20px 35px;vertical-align:middle; margin:0 10px; border:none;}
.tprice { font-size:30px; vertical-align:middle; padding-left:70px;}
.well span { vertical-align:middle; font-size:20px; font-weight:normal;}
.btn-submit { font-size:22px; display:inline-block; line-height:36px;vertical-align:middle;margin:0 10px; padding:20px 35px;}

.radio-btn label { padding-left:42px}
.radio-btn label .fa.button { font-size:30px; padding:4px; border:solid 2px #000; border-radius:50%; height:42px; width:42px; line-height:normal; text-align:center; position:absolute; top:0; bottom:0; margin:auto; left:0;}
.radio-btn label .fa.button:before { content:"";}
.radio-btn input:checked + label .fa.button:before { content:"\f111";}
.min-container { max-width:530px; margin:0 auto;} 

#product_price_mode .radio-btn label { font-size:15px;}


.custom-form input{font-weight: 400; font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif;}
.form-control::-moz-placeholder{font-style:italic;}
.form-control::-ms-input-placeholder{font-style:italic;}
.form-control::-webkit-input-placeholder{font-style:italic;}


.form-control.framesize:focus { border-color:#19cad5; box-shadow:none;}
.form-control.framesize::-moz-placeholder{color:#f3f3f3;opacity:1}
.form-control.framesize::-ms-input-placeholder{color:#f3f3f3}
.form-control.framesize::-webkit-input-placeholder{color:#f3f3f3}





.form-control.framesize { color:#fff !important;border-color:#19cad5; background:#19cad5 url(../assets/images/heightwidth.png) no-repeat 95% 11px; background-size:30px auto; padding-right:60px; -webkit-appearance: none;-moz-appearance:    none; appearance:none; font-family: "Libre Franklin", "Helvetica Neue", helvetica, arial, sans-serif; font-weight: 400;}
.form-control.framesize.width { background-position:90% -55px;}

#product_color .radio-btn label { padding:50px 0 0; font-size:15px; min-width:70px;}
#product_color .radio-btn label .fa.button { left:0; right:0; bottom:auto; top:1px; }
#product_color .radio-btn input:checked + label .fa.button { border:solid 5px #04ce9b; width:45px; height:45px; line-height:28px;top:0px;}
#product_color .radio-btn label .fa.button:before {content:"\f111"}
.jcrop-active, .jcrop-box { margin:0 auto;}
.jcrop-selection .jcrop-box{ border:solid 5px #fff200; border-radius:0px;}
.jcrop-selection .jcrop-box:focus { background:none !important; outline:none;}
.jcrop-border { background:#FFF200; opacity:1 !important; }
.jcrop-border.ord-w, .jcrop-border.ord-e { height:30px; width:5px !important;}
.jcrop-border.ord-e { right:-10px; bottom:-10px; top:auto;}
.jcrop-border.ord-w { left:-10px; top:-10px;}
.jcrop-border.ord-n, .jcrop-border.ord-s{ width:30px; height:5px !important;}
.jcrop-border.ord-n { top:-10px; left:-10px;}
.jcrop-border.ord-s { bottom:-10px; right:-10px; left:auto;}

.ord-n,.ord-e,.ord-s,.ord-w { display: none;}
/*.ord-n,.ord-e,.ord-s,.ord-w, .ord-ne, .ord-sw { display: none;}*/
.jcrop-border.ord-s,.jcrop-border.ord-n,.jcrop-border.ord-e,.jcrop-border.ord-w  { display:block; }
.jcrop-handle { opacity: 0 !important;}

h3.order-success {color: #04ce9b;font-size: 19px;padding: 40px 0 0; text-align:center;}
#product_type { border-top:none;}

#product_dimension {padding-bottom:40px; }
#product_dimension h3 { padding-bottom:20px; }
#product_dimension input[type="radio"] + label { font-size:15px; }
#product_dimension .radio-btn.disabled label { font-size:15px; color:#c1c1c1;}
#product_dimension .radio-btn.disabled label .fa.button{ border-color:#c1c1c1;}




.page-loader { position:fixed;background:rgba(255,255,255,.5) url(../assets/images/loader.gif) no-repeat center center; height:100%; width:100%; left:0; top:0; z-index:55;}
#target { display:block; clear:both;}

.jcrop-shades div { cursor: default;}
.img-box { clear: both;  background: #848484;margin: 30px auto; max-width: 675px; width: 100%;}
#product_size .input-group-addon { background: #19cad5; border: none; color: #fff; border-right:solid 1px #c4f2f3; }
.waitmessage { padding: 10px 0 0;}

.hidden-device { display: none !important; }
@media screen and (max-width:991px) {
	h3.title { font-size:26px;}
	input[type="radio"] + label { font-size:18px;}
	label .text-muted { font-size:12px;}
    .btn-submit,.well { margin: 10px 10px;}
	
}
@media screen and (max-width:767px) {
	h3.title { font-size:20px;}
	input[type="radio"] + label { font-size:14px;}
	label .text-muted { font-size:10px;}
	h3.title { padding-top:0px;}	
	.image-interface .panel-body { padding-left:60px;}
	.panel-msg .panel-body { padding-left:70px;}
	.panel-info .panel-body .fa { font-size:40px; left:25px; line-height:60px;}
	.panel-msg .panel-body { font-size:14px; text-align:left;}
	.panel-info { font-size:14px;}
	
	#product_dimension .radio-btn { padding:10px 20px;}
	#product_dimension .radio-btn label { padding:0 0 0 50px;}
	#product_price_mode .radio-btn { display: block;padding: 10px 20px 10px 0;text-align: left;}
	#product_price_mode .radio-btn label { padding:0 0 0 50px;}
	.radio-btn.rightdot label .fa.button { right:auto; left:0;}
	.bg-success { max-width:100%;}
	.image-interface .jcrop-active { width:100% !important; height:auto !important}
    .panel-info .icon-info { left: 20px;}
    .bg-success { padding: 10px 25px;}
    .well span { font-size: 18px; display: block;}
    .tprice { font-size: 24px; padding: 0px;}
    .btn-submit { padding: 10px 25px;}
	
}