@charset "utf-8";


body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: normal;
	color: #fff;
	background-attachment: fixed;
	background-color: #111111;
	background-repeat: repeat;
	margin: 0px;
	padding: 0px;
}

a {
	color:#fff;
	text-decoration:none;
	font-weight:bold;
}

h1 {
	text-align: center;
}

#container {
	width:960px;
	margin:50px auto;
}

#pads {
	width:640px;
	height:480px;
	margin:auto;
	clear:both;
	display:block;
	padding:0;
}

#pads li {
	padding:0;
	margin:0;
	display:block;
	width:160px;
	height:160px;
	float:left;
	text-align:center;
	font-size:12px;
}

#pads li a {
	font-weight:normal;
	padding:15px 0 0 0;
	height:145px;
	width:160px;
	display:block;
	background:url(vaj/vaj_off.png);
	background-size:contain;
	font-weight: bold;
}

#pads li a:hover {
	background:url(vaj/vaj_on.png);
	background-size:contain;
}

.sm2_playing {
	background:url(vaj/vaj_on_play.png) !important;
	background-size:contain !important;
}

.sm2_paused {
	background:url(vaj/vaj_on_pause.png) !important;
	background-size:contain !important;
}

@media all and (max-width: 960px) { 
	#container {
		width:600px;
		margin:20px auto;
	}
}
@media all and (max-width: 600px) { 
	#container {
		width:480px;
		margin:20px auto;
	}
}