/* css help :

- "not_allowed" on loead page not allowed option (2nd, 3rd, ... attributes have this class on option) and every option who not exsist in selection
.colorswatch-attribute .colorswatch-swatch-container.not_allowed

- "not_clickable" Element who not match any selection combination (in magento backend do not exsist simple product who use that attribute option and is assinged to current confgurable product)
.colorswatch-attribute .colorswatch-swatch-container.not_clickable

- "not_allowed_in_current_selection" added only from javascript, possibile to be in 2nd, 3rd,.. attribute when option not meatch selection, familiar with "not_allowed" class but show only when we have selection
.colorswatch-attribute .colorswatch-swatch-container.not_allowed_in_current_selection

To get swatch element:
[activ colorswatch option swatch span]  .colorswatch-swatch-container.active span.swatch
[hover colorswatch option status span]  .colorswatch-swatch-container:hover span.swatch

To get span element (by default is display:none;) who can use to show extra image like is cecked/active, disabled
[activ colorswatch option status span]  .colorswatch-attribute .colorswatch-swatch-container.active span.status
[hover colorswatch option status span]  .colorswatch-attribute .colorswatch-swatch-container:hover span.status
etc...

*/


.colorswatch-attribute-wrapper {
	clear:both;
}

.colorswatch-wrapper label {
	display:block;
}

.colorswatch-attribute .colorswatch-swatch-container {
	float:left;
	cursor:pointer;
	display:block;
	padding:1px;
	position:relative;
}

.colorswatch-attribute .colorswatch-swatch-container.active {

}

.colorswatch-attribute .colorswatch-swatch-container {

}

.colorswatch-attribute .colorswatch-swatch-container.not_clickable,
.colorswatch-attribute .colorswatch-swatch-container.not_allowed {

}

.colorswatch-attribute .colorswatch-swatch-container.not_clickable,
.colorswatch-attribute .colorswatch-swatch-container.not_allowed_in_current_selection {
	display:none;
}

.colorswatch-swatch-container span.swatch {
	display:block;
	height:30px;
	width:30px;
	line-height: 30px;
	text-align:center;
}

.colorswatch-swatch-container span.swatch {
	border:1px solid #DDD;
}

.colorswatch-swatch-container:hover span.swatch {
	border:1px solid #F90;
}
.colorswatch-swatch-container.active span.swatch {
	border:1px solid #F00;
}
.colorswatch-attribute .colorswatch-swatch-container span.status {
	/*background: transparent url(../images/colorswatch/selection.png);*/
	position:absolute;
	display:none;
	bottom:-5px;
	right:0;
	height:20px;
	width:20px;
}

.colorswatch-attribute .colorswatch-swatch-container.active span.status {
	background-position:0 20px;
	display:none; /*change to block and uncomment background of span.status to show checked arrow */
}

.colorswatch-attribute .colorswatch-swatch-container:hover span.status {
	background-position:0 20px;
	display:none;
}
/*
.colorswatch-attribute .colorswatch-swatch-container.not_clickable span.status,
.colorswatch-attribute .colorswatch-swatch-container.not_clickable:hover span.status,
.colorswatch-attribute .colorswatch-swatch-container.not_allowed span.status,
.colorswatch-attribute .colorswatch-swatch-container.not_allowed:hover span.status {
	background-position:0 0px;
	display:block;
}

.product-image img {
	max-width:262px;
}
*/
.colorswatch.debugger .label {
	display:block;
	width:120px;
	float:left;
}
.colorswatch.debugger br {
	clear:both;
	margin:0px;
	padding:0px;
}

select option.not_clickable,
select option.not_allowed {
 display:none;
}
.colorswatch-wrapper {
	margin-top:10px;
}
.colorswatch-clear {
clear:both;
margin:0px;
padding:0px;
}