/* ------------------------- SZÍNEK ----------------------------- */
.bro_box {
	background-color: #c4a691;
}  
	
.bro_sa	 {
	background: url('../img/bro.png') no-repeat;
}

.per_box {
	background-color: #4d4d4d;
}  
	
.per_sa	 {
	background: url('../img/per.png') no-repeat;
}

.blu_box {
	background-color: #59cdeb;
}  
	
.blu_sa	 {
	background: url('../img/blu.png') no-repeat;
}

.gra_box {
	background-color: #dddddd;
}  
	
.gra_sa	 {
	background: url('../img/gra.png') no-repeat;
}

.dgra_box {
	background-color: #cccccc;
}  
	
.dgra_sa	 {
	background: url('../img/dgra.png') no-repeat;
}

.ora_box {
	background-color: #eb9c59;
}  
	
.ora_sa	 {
	background: url('../img/ora.png') no-repeat;
}



/* ------------------------- 10 PIXELES LEKEREKÍTÉS ----------------------------- */
.tl10, .tr10, .bl10, .br10 {
	position: relative;
	display: block;
	height: 10px;
	width: 10px;
	font-size: 1px;
}

.tl10{
	top: 0px;
	left: 0px;
}

.tr10{
	background-position:-10px 0;
}

.bl10{
	top: 0px;
	left: 0px;
	background-position:0 -10px;
}

.br10{
	background-position:-10px -10px;
}

/* ------------------------- 20 PIXELES LEKEREKÍTÉS ----------------------------- */
.tl20, .tr20, .bl20, .br20 {
	position: relative;
	display: block;
	height: 20px;
	width: 20px;
	font-size: 1px;
}

.tl20{
	top: 0px;
	left: 0px;
}

.tr20{
	background-position:-20px 0;
}

.bl20{
	top: 0px;
	left: 0px;
	background-position:0 -20px;
}

.br20{
	background-position:-20px -20px;
}

/* ------------------------- SZÉLESSÉGEK ----------------------------- */
.x300_10{
	left: 290px;
}

.x600_10{
	left: 590px;
}

.x920_10{
	left: 910px;
}

.x293_10{
	left: 283px;
}

.x200_20{
	left: 180px;
}

.x100_20{
	left: 80px;
}