/* fontface */
@font-face { font-family: 'plutothin'; src: url('../fonts/pluto_thin-webfont.eot'); src: url('../fonts/pluto_thin-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/pluto_thin-webfont.woff2') format('woff2'), url('../fonts/pluto_thin-webfont.woff') format('woff'), url('../fonts/pluto_thin-webfont.ttf') format('truetype'), url('../fonts/pluto_thin-webfont.svg#plutothin') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'pluto_regularregular'; src: url('../fonts/pluto_regular-webfont.eot'); src: url('../fonts/pluto_regular-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/pluto_regular-webfont.woff2') format('woff2'), url('../fonts/pluto_regular-webfont.woff') format('woff'), url('../fonts/pluto_regular-webfont.ttf') format('truetype'), url('../fonts/pluto_regular-webfont.svg#pluto_regularregular') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'plutobold'; src: url('../fonts/pluto_bold-webfont.eot'); src: url('../fonts/pluto_bold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/pluto_bold-webfont.woff2') format('woff2'), url('../fonts/pluto_bold-webfont.woff') format('woff'), url('../fonts/pluto_bold-webfont.ttf') format('truetype'), url('../fonts/pluto_bold-webfont.svg#plutobold') format('svg'); font-weight: normal; font-style: normal; }

body { font-family: 'pluto_regularregular'; font-size:16px;}
.wrapper { width:100%;}
.logo { text-align:center; padding:20px 0;}
.logo a { display:inline-block; text-decoration:none;}
.head_details { text-align:center;}
.head_details h1 { font-size:2.250em; color:#33291d; text-transform:uppercase; margin:20px 0;}
.head_details h3 { font-size:1.500em; color:#666666; margin:0 0 25px;}
.head_details .follow_instruct { display:block; font-size:0.938em; color:#666666; padding:0 0 25px;}
.choose_veneer_type h6 { font-size:1.125em; color:#32291e; text-align:center; margin:40px 0 20px 0;}
.choose_veneer_type ul { list-style-type:none; width:100%; float:left; padding:0;}
.choose_veneer_type ul li { text-align:center; padding:15px;}
.choose_veneer_type ul li a { display:inline-block; text-decoration:none; padding:10px; background:#fff;}
.choose_veneer_type ul li strong { display:block; font-size:1.125em; color:#33291d; padding:15px 0 5px; font-weight:normal;}
.choose_veneer_type ul li a:focus, .choose_veneer_type ul li a:hover { -moz-box-shadow: 0px 0px 8px rgba(0,0,0,0.5); -webkit-box-shadow: 0px 0px 8px rgba(0,0,0,0.5); box-shadow: 0px 0px 8px rgba(0,0,0,0.5);}
.step_thumb ul { width:100%; text-align:center; list-style-type:none; float:left; padding:0; margin:0; background:url(../images/shadow.png) repeat-x left bottom;}
.step_thumb ul li { display:inline-block; padding:0; width:260px; vertical-align:bottom; margin:0 -2px;}
.step_thumb ul li a { display:block; padding:10px; text-decoration:none; background:#413425; color:#fff; text-align:left; position:relative;}
.step_thumb ul li .edit { width:25px; height:25px; background:url(../images/edit_icon.png) no-repeat 0 0; position:absolute; top:50%; right:15px; margin-top:-12px; display:block;}
.step_thumb ul li a.step_complete { background:#201a12;}
.step_thumb ul li a.active { background:#ffffff; box-shadow:0 0 5px #ccc; color:#33291d; padding:15px 10px;}
.step_thumb ul li a.active span { padding:0 0 10px;}
.step_thumb ul li a.active strong { font-size:0.875em;}
.step_thumb ul li a.active .edit { background:url(../images/edit_icon.png) no-repeat 0 -27px;}
.step_thumb ul li span { display:block; font-size:0.750em;}
.step_thumb ul li strong { display:block; font-size:0.750em; font-weight:normal;}
.bx-wrapper { margin:0 auto; position:relative;}
.bx-wrapper .bx-prev { width:32px; height:32px; background:url(../images/arrows_sprite.png) no-repeat 0 0; position:absolute; top:50%; left:-20px; margin-top:-16px; font-size:0; text-decoration:none;}
.bx-wrapper .bx-next { width:32px; height:32px; background:url(../images/arrows_sprite.png) no-repeat 0 -34px; position:absolute; top:50%; right:-20px; margin-top:-16px; font-size:0; text-decoration:none;}
.bx-wrapper .bx-prev.disabled, .bx-wrapper .bx-next.disabled { display:none;}
.button_style { display:block; background:#33291d; font-size:1.125em; color:#ffffff; text-decoration:none; padding:10px; width:150px; margin:0px auto 40px auto; text-align:center;}
.button_style:hover, .button_style:focus { background:#000; color:#fff; text-decoration:none;}

/*step3*/
.upload_photo_section { padding:0 0 40px;}
.upload_button { text-align:center; padding:30px 0 40px;}
.upload_button input[type="file"] { display:inline-block; opacity:0; z-index:-1; position:relative; width:0; height:0;}
.upload_button .upload_photo { display:inline-block; border:1px solid #111111; width:240px; height:40px; font-size:0.875em; line-height:40px; color:#000000; vertical-align:middle; position:relative;}
.upload_button .upload_photo .note { position:absolute; top:100%; left:0; font-size:10px; line-height:12px; padding:10px 5px;}
.upload_button .or { display:inline-block; font-size:0.875em; color:#413425; margin:0 20px; vertical-align:middle;}
.upload_button .fb_login, .upload_button .fb_login img { display:inline-block; vertical-align:middle;}
.share_button { text-align:center;}
.share_button .button_style { width:150px; display:inline-block;}
.veener_container { text-align:center;}
.veener_container .canvas-container { margin:0 auto;}
#veneerCnvs { width:100%; max-width:1000px;}
.stephide { visibility:hidden; height:0; overflow:hidden;}

.filterbox { padding:20px 0;}
.filterbox .button_style { margin:0;}
.selectbox { width:100%; height:44px; border:1px solid #111111; position:relative; overflow:hidden;}
.selectbox select { width:100%; height:100%; position:absolute; top:0; left:0; background:none; border:none; font-size:0.875em; color:#000000; text-indent:5px;}

.product_thumb { width:100%; background:#f5f5f4; padding:20px 20px 10px; position:relative; margin:0 0 20px;}
.product_thumb ul { list-style-type:none;}
.product_thumb ul li { padding-bottom:10px;}
.product_thumb ul li a { display:block; text-decoration:none; text-align:center; padding:7px; background:#dbdbdb; min-height:210px;}
.product_thumb ul li strong { display:block; font-size:0.750em; color:#201a12;}
.product_thumb ul li img { margin:4px auto 8px;}
.product_thumb ul li a:hover { background:#fff; box-shadow:4px 4px 4px #ccc;}
.product_thumb .bx-wrapper .bx-prev  { left:-50px;}
.product_thumb .bx-wrapper .bx-next  { right:-50px;}
.canvas-container { background:#000;}
.other_veener_container { max-width:1000px; margin:0 auto; overflow:hidden;}
.other_veener_container .frontimage { width: 100%; height: 665px; background-position:center top; background-repeat:no-repeat; background-size:100%; cursor:move;}

#veneerCnvs { width: 100%; max-width: 1000px; position: relative; margin: 0 auto; overflow: hidden; }
#veneerCnvs .bg_image { width:100%; height:auto; display:block;}
.component { position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:no-repeat; background-position:center center; }
.resize-container { position: relative; display: inline-block; cursor: move; margin: 0 auto; }
.resize-container img { display: block; opacity:0.7;}
.resize-container:hover img, .resize-container:active img { outline: 2px dashed rgba(222,60,80,.9); }
.resize-handle-ne, .resize-handle-se, .resize-handle-nw, .resize-handle-sw { position: absolute; display: block; width: 10px; height: 10px; background: rgba(222,60,80,.9); z-index: 999; }
.resize-handle-nw { top: -5px; left: -5px; cursor: nw-resize; }
.resize-handle-sw { bottom: -5px; left: -5px; cursor: sw-resize; }
.resize-handle-ne { top: -5px; right: -5px; cursor: ne-resize; }
.resize-handle-se { bottom: -5px; right: -5px; cursor: se-resize; }
.overlay { position: absolute; left: 0%; top: 0%; margin-left: 0px; margin-top: 0px; z-index: 999; width: 100%; height: 100%; pointer-events: none; }
.upload_photo_section .controls { opacity:0; height:0; overflow:hidden; text-align:center;}
.upload_photo_section .plus, .upload_photo_section .minus {background-color: #000; padding:5px 10px;display: inline-block;margin:0 5px;color: #fff; font-size:20px; line-height:20px; cursor:pointer;}

.copyright {    background: #000;    padding: 15px 0;    font-size: 10px;    line-height: 18px;    color: #c6c9c1;    text-transform: uppercase;}
.disclimer{ text-align: center; font-size: 11px;}
@media (min-width:992px) and (max-width:1200px){
.other_veener_container .frontimage { height:625px;}
}

@media (min-width:768px) and (max-width:991px){
body { font-size:14px;}
.step_thumb.thumb3 ul li { width:33%;}
.other_veener_container .frontimage { height:480px;}
}

@media (max-width:767px){
body { font-size:13px;}
.logo img { width:200px; height:auto;}
.upload_button .or { display:block; margin:40px 0 10px;}
.selectbox { margin:0 0 10px;}
.choose_veneer_type ul li { padding:15px 30px;}
.product_thumb ul li { margin-right:20px !important;}
.bx-wrapper .bx-prev { left:0;}
.bx-wrapper .bx-next { right:0;}
.product_thumb { padding:20px 40px 10px;}
.product_thumb .bx-wrapper .bx-prev { left:-40px;}
.product_thumb .bx-wrapper .bx-next { right:-40px;}
.other_veener_container .frontimage { height:220px;}
.upload_photo_section .controls { opacity:1; height:auto;}
}