/* 
   Author: Cagatay KARA
   Author URI: http://www.ckara.com
*/

/*** FRENCH PATTERN ***/
.frenchPattern{
	float:left;
    position: relative;
    width:200px;
    height:200px;
    margin:0;
    background:url("../resource/french.png");
    background-size:cover;
	margin-top:0px;
	margin-bottom:0px;
    
}

/*** ITEM SIZE TABLE ***/
.itemSizeTable{
	display:block;
	float:left;
    position: relative;
    width:calc(100% - 200px);
    height:auto;
    padding:3px !important;
    margin:0;
    /*background-color: #fff;*/
}


.itemSizeRow{
	float:left;
    position: relative;
    display:block;
    width:100%;
    height:auto;
    padding:3px !important;
    text-align:left;
	
}

.itemSizeRow.Header{
    height:200px;
    overflow:hidden;
	
}

.itemSizeCol{
	float:left;
    position: relative;
    border:#999 1px solid;
    padding:3px !important;
    white-space:nowrap;
    width:30px;
    height:30px;
    overflow:hidden;
	text-align:left;
  	white-space: nowrap;
  	vertical-align:bottom;
  	
}


.itemSizeCol.Header{
	position:relative;
	height:270px !important;
}

.itemSizeCol.Header span{
		height:190px !important;
		writing-mode: tb-rl;
        transform: rotate(180deg);
}


.itemSizeCol.Header.Main,
.itemSizeCol.Sub.Main{
	width:100px !important;
	
}


.itemSizeCol.checked:before{
  	  content: '✓';
  display: inline-block;
  width: 20px;
  color:orange;
  margin-left:5px; 
  	
}


/*** ITEM SIZE TABLE - MINIMIZED ***/
.itemSizeMinTable{
	display:block;
	float:left;
    position: relative;
    width:calc(100% - 200px);
    height:auto;
    padding:3px !important;
    margin:0;
    /*background-color: #fff;*/
}


.itemSizeMinRow{
	float:left;
    position: relative;
    display:block;
    width:100%;
    height:auto;
    padding:3px !important;
    text-align:left;
	
}

.itemSizeMinRow.Header{
    height:130px;
    overflow:hidden;
	
}

.itemSizeMinCol{
	float:left;
    position: relative;
    border:#999 1px solid;
    padding:3px !important;
    white-space:nowrap;
    width:30px;
    height:30px;
    overflow:hidden;
	text-align:left;
  	white-space: nowrap;
  	vertical-align:bottom;
  	
}


.itemSizeMinCol.Header{
	position:relative;
	height:200px !important;
}

.itemSizeMinCol.Header span{
		height:120px !important;
		writing-mode: tb-rl;
        transform: rotate(180deg);
}


.itemSizeMinCol.Header.Main,
.itemSizeMinCol.Sub.Main{
	width:200px !important;
	
}


.itemSizeMinCol.checked:before{
  	  content: '✓';
  display: inline-block;
  width: 20px;
  color:orange;
  margin-left:5px; 
  	
}


.itemInfoSpace{
	float:left;
	position:relative;
	width:100%;
	height:15px;
	
}
/*  META  */

@media only screen and (min-width: 1180px){
	.frenchPattern{
	    width:200px;
	    height:200px;
	}
	
	.itemSizeTable{
	 	display:block;
    	width:calc(100% - 200px);
	}

	.itemSizeMinTable{
	 	display:none;
	}
	
}


@media only screen and (max-width: 1180px){


	
	.frenchPattern{
	    width:400px;
	    height:400px;
	    margin-left:auto;
	    margin-right:auto;
	    
	}
	
	.itemSizeTable{
	 	display:none;
    	width:100%;
	}

	.itemSizeMinTable{
	 	display:block;
	 	width:calc(100% - 400px);
	}
	
}

@media screen and (max-width: 945px) {

	.frenchPattern{
	    width:200px;
	    height:200px;
	    margin-left:auto;
	    margin-right:auto;
	    
	}
	
	.itemSizeTable{
	 	display:none;
    	width:100%;
	}

	.itemSizeMinTable{
	 	display:block;
	 	width:calc(100% - 200px);
	}
	

}
    

@media screen and (max-width: 700px) {

	.frenchPattern{
		margin-top:10px;
		margin-bottom:10px;
		
	    width:400px;
	    height:400px;
	    margin-left:auto;
	    margin-right:auto;
	    
	}
	
	.itemSizeTable{
	 	display:none;
    	width:100%;
	}

	.itemSizeMinTable{
	 	display:block;
	 	width:100%;
	}
	

}

}