/* 
	file name: /public/css/embroider.css
	CSS for /inc/embroider.inc.php 
*/

.error div{
	color:red;
	text-align:left;
	font:italic bold 14px Arial;
}

.error_message{
	
	text-align:left;
	
/*
	border: 1px solid yellow;
*/
	
}

.embroidery_option_div{
	white-space: nowrap;
	overflow:hidden;/* hides scroll bars */
    /*overflow-x: auto;*/
	text-align: left;
	padding: 5px 0px 5px 0px;
 	width:98%;
 	margin: 0 auto;
	 
/*	
 	border: 1px solid red;
	-moz-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
*/	
}

.embroidery_option_label{
	
}

.embroidery_option_label_div{
	display: inline-block;
	vertical-align: top;
	width:15%;
	
	font: bold 14px Arial, sans-serif;
	float:left;
	
	text-align:right;
	margin: 0px 5px 0px 0px;
	/*
	border: 1px solid green;
	*/
	
}

.embroidery_option_value_div{
	display: inline-block;
	vertical-align: top;
	width:82%;
	/*
	border: 1px solid yellow;
	*/
}

.label_item {
	margin: 0px 2px 0px 25px;
	opacity: 0.5;
	/*
	padding:5px 0px 5px 0px;
	border: 1px solid green;
	-moz-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	*/
}

.label_item:hover{
	opacity: 1;
	/*
	border: 1px solid green;
    background-color: green;
    */
}

.text_label{
	 color:black;
	 font: bold 18px Arial, sans-serif;
}

.text_line_instructions{
	font: italic bold 12px Arial, sans-serif;
	color: green;
	text-align:left;
	margin: 0px 5px 0px 0px;
	/*
	border: 1px solid green;
	*/
}



.radio_item{
	display: none !important;
	margin: 0px 2px 0px 25px;
	opacity: 1;
}

.radio_item:checked + label {
	opacity: 1;

	/*
	background-color: green;
	border: 1px solid red;
	-moz-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	*/
}

.wrapper {
    white-space: nowrap;
    height: 350px;
    overflow-x: auto;
}

.side-by-side {
    display: inline-block;
    width: 300px;
    height: 300px;
    background-color: #e6e6e6;
    margin-right: 10px;
    vertical-align: top;
}


/* logo css */
#logo_section{
	/*
	border: 1px solid black;
	*/
}

.logo_id_show{
	font: normal 12px Arial, sans-serif;
	text-align:center;
	
	/*border: 1px solid blue;*/
}

.embroidery_logo_row{
	text-align:center;
	
	vertical-align: top;
	padding: 0px 5px 0px 15px;
	margin: 0px 5px 0px 15px;
	height: 65px;
/*	
	border: 1px solid red;
*/	
}

.embroidery_logo_choice{

	text-align:center;
	/*margin: 0px 5px 10px 15px;*/
	margin: 0px 5px 0px 5px;
	
/*	border: 1px solid blue;
	-moz-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px; */

}

.logo_image_choice{
	margin: 5px;/* 10 */
	/*height: 65px;*/
	/*height: 95px;*/
}

.embroidery_option_logo_div{

	vertical-align: top;
	/*
	border: 1px solid orange;
	*/
}

.embroidery_logo_right_column{
	float:left;
	width:82%;
	/*
	border: 1px solid purple;
	*/
}

/* Additional logo CSS*/
.logo_selector input{
    margin:0;padding:0;

    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
}

.logo_selector input:active +.logo_image{
	opacity: .9;
}

.logo_selector input:checked +.logo_image{
    -webkit-filter: none;
       -moz-filter: none;
            filter: none;
}

.logo_image{
    cursor:pointer;
    background-size:contain;
    background-repeat:no-repeat;
    display:inline-block;
    margin: 0px 0px 0px 10px
	
	border: 1px solid red;
	
}

.logo_image:hover{
    -webkit-filter: brightness(1.2) grayscale(.5) opacity(.9);
       -moz-filter: brightness(1.2) grayscale(.5) opacity(.9);
            filter: brightness(1.2) grayscale(.5) opacity(.9);
}
/* END logo css



/* embroidery thread css */
.thread_id_show{
	font: normal 12px Arial, sans-serif;
	text-align:center;
	
	/*border: 1px solid blue;*/
}

.embroidery_thread_row{
	vertical-align: top;
	margin: 0px 0px 0px 0px;
	height: 35px;
	
	/*border: 1px solid blue;*/
}


/* replaced by .thread_color_image
.embroidery_thread_color_swatch img{
	vertical-align: top;
	overflow: auto;
	margin: 1px;
	padding: 1px;
	height: 30px;
	width: 45px;
	background-color: green;
	border: 1px solid gold;
}
*/

.embroidery_thread_color_choice{
	float:right;
	width:75px;
	text-align:center;

	/*border: 1px solid blue;*/
}

/* Additional Thread CSS*/
.thread_selector input{
    margin:0;padding:0;

    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
}

.thread_selector input:active +.thread_color_image{
	opacity: .9;
}

.thread_selector input:checked +.thread_color_image{
    -webkit-filter: none;
       -moz-filter: none;
            filter: none;
}

.thread_color_image{
    cursor:pointer;
    background-size:contain;
    background-repeat:no-repeat;
    display:inline-block;
    width:50px;
    height:35px;
/*	
    -webkit-transition: all 100ms ease-in;
       -moz-transition: all 100ms ease-in;
            transition: all 100ms ease-in;
    -webkit-filter: brightness(1.8) grayscale(1) opacity(.7);
       -moz-filter: brightness(1.8) grayscale(1) opacity(.7);
            filter: brightness(1.8) grayscale(1) opacity(.7);
*/	
}

.thread_color_image:hover{
    -webkit-filter: brightness(1.2) grayscale(.5) opacity(.9);
       -moz-filter: brightness(1.2) grayscale(.5) opacity(.9);
            filter: brightness(1.2) grayscale(.5) opacity(.9);
}

.monogram_charge{
	font: normal 12px Arial, sans-serif;
	text-align:left;
	
}


.display_vars{
	font: normal 10px Arial, sans-serif;	
	
}

.var_value {
    font-weight: bold;
}


/* Embroidery Preview CSS */

#locate_pixel_pos{
	position:absolute;
	top:100px;
	left:100px;
}


#preview_section{
	position: relative;
	margin: 5px auto;
	/*
	border: 1px solid red;
	*/
}

.preview_field{
	width:95%;
	margin: 0 auto;
	padding: 5px;
	
	/*border: 1px solid blue;*/
	
}

.preview_logo{
	height:30px;
	text-align:center;
}

.back{
	position:relative;
	/*left:0px;200px;*/
}

.logo {
	width:100%;
}


#emb_right {
	position:absolute;
	top:290px;
	left:230px;

	height:50px;
	width:180px;
	
	text-align:center;
	font-size: 15px;/*<?php echo $font_sz; ?>;*/
	font-family: Cookie;
	font-weight:bold;/*<?php echo $bold; ?>*/
	color:#F57D32;/*<?php echo $rgb_thread; ?>*/;
	/*
	border: 1px solid red;
	*/
}

#emb_left {
	position:absolute;
	top:290px;
	left:450px;

	height:50px;
	width:180px;
	
	text-align:center;
	font-size: 15px;/*<?php echo $font_sz; ?>;*/
	font-family: Cookie;
	font-weight:bold;/*<?php echo $bold; ?>*/
	color:#F57D32;/*<?php echo $rgb_thread; ?>*/;
	/*
	border: 1px solid red;
	*/
}


.monogram_place_preview{
	/*1/8" = 6px*/
	position:absolute;
	/*top:190px;*/
	bottom:34px;

	/*height:50px;*/
	width:373px;/*180px*/
	
	text-align:center;
	 opacity:1;
	
	/*border: 1px solid red;*/

}

.logo_place_preview{
	position:absolute;
	top:64px;/*160px;*/
	
	height:40px;
	width:180px;
	
	/*border: 1px solid blue;*/
}
#edit_emb{	
text-align:center;
	font-size:1emb;
	font-family:helvetica;
	position:absolute;
	top:325px;
	left:115px;
	
}
	
.disclaimer {
	font: bold 15px helvetica;
	color:red; 
/* 	width:99%; */
/* 	text-align:center; */
	/*loat:right;
	margin-top:-300px;*/
}

.debug_emb{
	border: 1px solid red;
}


.ui-tooltip {
 white-space: pre-line;
}

/* END Embroidery Preview CSS */

#scale {
	background-size: 136px 136px;
    background-repeat: no-repeat;
	background-image:url('/images/embroidery/logo/scale.png');
	height:136px;
	width:136px;
}



/* vvvv delete vvv */

/*
.logo_right {
	position:absolute;
	top:250px;
	left:230px;
	
	height:40px;
	width:180px;
	
	border: 1px solid blue;
	
}

.logo_left {
	position:absolute;
	top:250px;
	left:450px;
	
	height:40px;
	width:180px;
	
	border: 1px solid blue;
	
}
*/
/*
span
{
    white-space:nowrap
}


#preview_pane {
	width:780;
	height:500px;
	border:1px solid black;
	overflow:hidden;
}
*/