


.refresh {
	margin-top: 3px;
	margin-bottom: 3px;
	margin-left: 15px;
	padding-top: 5px;
	padding-bottom: 5px;
}

/*---signage---*/
.listskweeze {
	height:44px;
}

.mainlistskweeze {
	height: 38px;
	background-color: #fff;	
}

.ui-li-count
{
	/*color: #00FF00;#a1dd3a;*/
	color: #fff;
	font-weight: bold;
}

.ooh {
	float: left;
	width: 20%;
	margin-right: 10px;
}
.namecontainer {

	margin-left: -4px;
	font-size: 20px;
	margin-top: 10px;
	width: 20%;		
}


.barcontainer {
	width:70%;
	float:left;
	padding-left: 15%;
	margin: 0px;
	margin-right: 1px;
	margin-bottom:0px;
	margin-top:-24px;
	
}

.free {
	height: 25px;
	background-image: url(../images/greenbar2.gif);
	background-repeat: repeat;
	/* border-radius: 3px 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px; 
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
	-webkit-box-shadow: 2px 2px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 2px 2px rgba(0, 0, 0, 0.1);*/
	float:left;
	padding: 0px;
	margin-right: 1px;		
}
.used {
	height: 25px;
	background-image: url(../images/redbar2.gif);
	background-repeat: repeat;
	float:left;
	/*box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
	-webkit-box-shadow: 2px 2px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 2px 2px rgba(0, 0, 0, 0.1);*/
	margin: 0px;
	padding: 0px;	
}


.bartext{
	float:left;
	margin-top: 0px;
	color: #000;
	padding-top: 3px;
	padding-right: 0px;
	margin-right: 5px;
	padding-left: 0;	
}


.keycontainer {
	width:240px;
	float: right;
	padding: 0px;
	margin-top: 10px;
	text-align: right;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	font-size: 18px;	
}








/*iPads (portrait and landscape) */
@media only screen and (min-width:480px) and (max-width:1024px){

.namecontainer {
	margin-left: -8px;
	font-size: 16px;
	margin-top: 14px;
	width: 30%;

				
} 

.barcontainer {
   width:65%;
    padding-left: 30%;
	}
	
.ooh {
	float: left;

}
.listskweeze {
	height:40px;
}
.mainlistskweeze {
	height:40px;
}	




}


@media only screen and (max-width:480px){


.listskweeze {height:25px;}
.mainlistskweeze {
	height:25px;
}

.ui-li-count
{ 
	font-size:5px;
}

.ooh {
	float: left;
	width: 30%;	
}

.namecontainer {
	font-size: 14px;
	vertical-align: middle;
	width: 39%;
		

	
}
.barcontainer {
	width:55%;
	padding-top: -12px;
    padding-left: 35%;
	margin-left: 3px;
	
	
}
.keycontainer {
	width:260px;
	float: right;
	padding: 0px;
	text-align: left;
	margin-top: 5px;
	font-size:12px;
	margin-bottom:5px;
	

}
.free {
	height: 20px;
	}
	
.used {
	height: 20px;
	background-repeat: repeat;
	float:left;
	box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
	-webkit-box-shadow: 2px 2px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 2px 2px rgba(0, 0, 0, 0.1);
	margin: 0px;
	padding: 0px;	
}



}


@media only screen and (max-width:320px){
.barcontainer {
	width:40%;
	padding-top: 5px;
	padding-left: 50%;


}
}