/* WC-3d-Product-Frontend CSS */

@font-face {
    font-family: "flaticon_mycollection";
    src: url("./fonts/flaticon_mycollection.woff2?86ccf06027d4c7609150a1d0ae549846") format("woff2"),
url("./fonts/flaticon_mycollection.woff?86ccf06027d4c7609150a1d0ae549846") format("woff"),
url("./fonts/flaticon_mycollection.eot?86ccf06027d4c7609150a1d0ae549846#iefix") format("embedded-opentype"),
url("./fonts/flaticon_mycollection.ttf?86ccf06027d4c7609150a1d0ae549846") format("truetype"),
url("./fonts/flaticon_mycollection.svg?86ccf06027d4c7609150a1d0ae549846#flaticon_mycollection") format("svg")
}

/* Global */
.wc_3d_product_canvas { cursor: move; position: relative; min-height: 450px; }
@media (min-width: 768px) {
	.single-product div.product .woocommerce-product-gallery, .storefront-full-width-content.single-product div.product .woocommerce-product-gallery {
    	width: 46%;
    }
    .single-product div.product .summary {
    	width: 48%;
	}
}

/* Player CSS */
.wc_3d_player { text-align: left; display: flex; justify-content: right; position: absolute; color: #fff; height: 40px; width: 100%; bottom: 15px; left: 0; z-index: 1; font-family: Arial, Helvetica, sans-serif; padding: 5px; }
.wc_3d_player .rc_icons { margin: 0 5px; cursor: pointer; font-size: 16px; width: 30px; height: 30px; text-align: center; background: #000; border-radius: 50%; display: flex; justify-content: center; align-items: center; }
.wc_3d_player .rc_icons:hover, .wc_3d_player .rc_icons:focus { background: #3a3a3a; color: #2196F3; }

i[class^="flaticon-"]:before, i[class*=" flaticon-"]:before {
    font-family: flaticon_mycollection !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.flaticon-rotation:before {
    content: "\f101";
}
.flaticon-maximize:before {
    content: "\f102";
}
.flaticon-download-file:before {
    content: "\f103";
}
.flaticon-close:before {
    content: "\f104";
}


/* Full Screen CSS */
.wc-3d-product-wrapper.fullscreenmode { position: fixed; top: 0; left: 0; width: 70%; height: 100%; z-index: 9999; background:#fff; }
.wc_3d_materials.fullscreenmode { position: fixed; width: 30%; height: 100%; top: 0; right: 0; z-index: 10000; background: #fff; }

/*Progress Bar*/
.loaderhtml { position:absolute; width:100%; height: 100%; background: #3a3a3a; -webkit-transition: visibility 2s; transition: visibility 2s; visibility: visible; z-index: 2;  }
.progressbar { position:absolute; width:80%; height: 6px; background: #f1f1f1; top: 50%; margin-top: -3px; left: 10%; }
.progress { width: 5px; height: 6px; background: #2196F3; -webkit-transition: width 2s; transition: width 2s; border: none; border-radius: 0; }

/*Mat Options*/
.wc_config_title { padding: 5px 10px; font-size: 18px; background: #000; color: #fff; font-weight: normal; }
.obj_option, .pattern_option, .mat_option, .img_option, .gradient_option, .font_color { width: 50px; height: 50px; display: inline-block; cursor: pointer; position: relative; overflow: hidden; transition: all 0.4s; }
.obj_option:hover, .obj_option:focus, .obj_option.active, .pattern_option:hover, .pattern_option:focus, .pattern_option.active, .font_color:hover, .font_color:focus, .font_color.active, .gradient_option:hover, .gradient_option:focus, .gradient_option.active, .mat_option:hover, .mat_option:focus, .mat_option.active, .img_option:hover, .img_option:focus, .img_option.active { border: 2px solid blue; border-radius: 50%; }
.obj_option.active:before, .pattern_option.active:before, .font_color.active:before, .gradient_option.active:before, .mat_option.active:before, .img_option.active:before { content: '\2713'; text-align: center; position: absolute; width: 100%; height: 100%; color: #fff; background: rgba(0, 0, 0, 0.3); padding: 0.2em; }
.option_price { float: right; color: #FFF; margin-right: 15px; }

.material_group { margin-bottom: 15px; }
.material_options { padding: 0 10px; max-height: 0; overflow: hidden; transition: all 0.3s ease-out; }
.material_group.active .material_options { padding: 0 10px; max-height: 500px; }

/* Text Options */
.field_text { width: 100%; }
.text_options_block { padding-top: 10px; padding-bottom: 10px; }
.text_options_block select { width: 100%; display: inline-block; padding: 5px; font-size: 14px; }
 /*{ width: 47%; display: inline-block; height: 32px; vertical-align: middle; margin-left: 3%; }*/
.text_options_heading { margin-top: 15px; }
.fontFamily { display: inline-block; padding: 10px; font-size: 14px; cursor: pointer; border: 1px solid #000; vertical-align: middle; }

/* User Upload */
.dropzone { min-height: 50px; padding: 10px 10px; }
.dropzone .dz-message { margin: 1em 0; }
.dz-details { display: none; }
.dropzone .dz-preview { margin: 0px; min-height: 50px; }
.dropzone .dz-preview:hover .dz-image img { -webkit-filter: none; filter: none; }
.dropzone .dz-preview .dz-image { width: 50px; height: 50px; border-radius: 0; }
.dropzone .dz-preview .dz-image:hover, .dropzone .dz-preview .dz-image:focus, .dropzone .dz-preview.active .dz-image { border: 2px solid blue; border-radius: 50%; }
.dropzone .dz-preview.active .dz-image:before { content: '\2713'; text-align: center; position: absolute; width: 100%; height: 100%; color: #fff; background: rgba(0, 0, 0, 0.3); padding: 0.2em; }
.dropzone .dz-preview .dz-remove { width: 50px; height: 14px; font-size: 12px; overflow: hidden; }