body{
	padding: 0;
	margin: 0;
}


.master_div{
	position: fixed;
	width: 100%;
	height: 100%;
	left: 0%;
	right: 0%;
	padding: 0;
	margin: 0;
	z-index:10;
}



.topbar{
	position: absolute;
	top: 0%;
	width: 100%;
	height: 3%;
	left: 0%;
	background-color: #ddddff;
	text-align: center;
	line-height: 20px;
	font-size: 20px;
	z-index: 90;
}


.timer_div{
	position: absolute;
	top: 12%;
	left: 43%;
	height: 16%;
	width: 14%;
	border: dotted 2px black;
	background-color: #eeeeee;
	border-radius: 4%;
	text-align: center;
	z-index:11;
}
.lefttop_div{
	position: absolute;
	top: 4%;
	left: 2%;
	width: 40%;
	height: 40%;
	border: dotted 2px black;
	font-size: 30vmin;
	text-decoration: none;
	color: #000000;
	background-color: #eeeeee;
	border-radius: 4%;
	text-align: center;
	z-index:11;
}
.leftbottom_div{
	position: absolute;
	bottom: 8%;
	left: 2%;
	width: 40%;
	height: 40%;
	border: solid 1px black;
	border: dotted 2px black;
	font-size: 30vmin;
	text-decoration: none;
	color: #000000;
	background-color: #eeeeee;
	border-radius: 4%;
	text-align: center;
	z-index:11;
}

.righttop_div{
	position: absolute;
	top: 4%;
	right: 2%;
	width: 40%;
	height: 40%;
	border: solid 1px black;
	border: dotted 2px black;
	font-size: 30vmin;
	text-decoration: none;
	color: #000000;
	background-color: #eeeeee;
	border-radius: 4%;
	text-align: center;
	z-index:11;
}
.rightbottom_div{
	position: absolute;
	bottom: 8%;
	right: 2%;
	width: 40%;
	height: 40%;
	border: solid 1px black;
	border: dotted 2px black;
	font-size: 30vmin;
	text-decoration: none;
	color: #000000;
	background-color: #eeeeee;
	border-radius: 4%;
	text-align: center;
	z-index:11;
}

.center_div{
	position: absolute;
	bottom: 37%;
	right: 35%;
	width: 28%;
	height: 28%;
	border: solid 1px black;
	border: dotted 2px black;
	font-size: 20vmin;
	text-decoration: none;
	color: #000000;
	background-color: #ffffff;
	border-radius: 4%;
	text-align: center;
	padding: 1%;
	z-index:11;
}

.bigcenter_div{
	position: absolute;
	bottom: 16%;
	right: 10%;
	width: 80%;
	height: 76%;
	border: solid 1px black;
	border: dotted 2px black;
	font-size: 20vmin;
	text-decoration: none;
	color: #000000;
	background-color: #ffffff;
	border-radius: 4%;
	text-align: center;
	padding: 1%;
	z-index:11;
}

img{
	max-width: 98%;
	max-height: 98%;	
}
.controls_div{
	position: absolute;
	bottom: 8%;
	width: 100%;
	height: 6%;
	left: 0%;
	background-color: #ffffff;
	text-align: center;
	line-height: 20px;
	font-size: 20px;
	z-index:11;
}

.adjuster{
	font-size: 2vmin;
	height: 100%;
	margin-left: 0.5%;
	margin-right: 0.5%;
	border-radius: 15px;
}

.minus{
	background-color: #ff3333;
}
.plus{
	background-color: #33ff33;
}
.tidnu{
	background-color: #eeffee;
}

.playbutton{
	height: 100%;
	width: 60%;
	font-size: 4vmin;
	background:linear-gradient(to bottom, #599bb3 5%, #408c99 100%);
	text-shadow:0px 1px 0px #3d768a;
	box-shadow: 0px 10px 14px -7px #276873;
	border-radius: 8px;
	cursor: pointer;
	font-weight:bold;
}
.playbutton:hover{
	background:linear-gradient(to bottom, #408c99 5%, #599bb3 100%);
}

.playbutton:active {
	position:relative;
	top:1px;
}

.a1{
	position: absolute;
	top: 42%;
	left: 1%;
	width: 8%;
	height: 12%;
	border: dotted 2px black;
	font-size: 10vmin;
	text-decoration: none;
	color: #000000;
	background-color: #ffffff;
	border-radius: 4%;
	text-align: center;
	z-index:11;
}

.a2{
	position: absolute;
	top: 42%;
	left: 11%;
	width: 8%;
	height: 12%;
	border: dotted 2px black;
	font-size: 10vmin;
	text-decoration: none;
	color: #000000;
	background-color: #ffffff;
	border-radius: 4%;
	text-align: center;
	z-index:11;
}
.a3{
	position: absolute;
	top: 42%;
	left: 21%;
	width: 8%;
	height: 12%;
	border: dotted 2px black;
	font-size: 10vmin;
	text-decoration: none;
	color: #000000;
	background-color: #ffffff;
	border-radius: 4%;
	text-align: center;
	z-index:11;
}
.a4{
	position: absolute;
	top: 42%;
	left: 31%;
	width: 8%;
	height: 12%;
	border: dotted 2px black;
	font-size: 10vmin;
	text-decoration: none;
	color: #000000;
	background-color: #ffffff;
	border-radius: 4%;
	text-align: center;
	z-index:11;
}
.a5{
	position: absolute;
	top: 42%;
	left: 41%;
	width: 8%;
	height: 12%;
	border: dotted 2px black;
	font-size: 10vmin;
	text-decoration: none;
	color: #000000;
	background-color: #ffffff;
	border-radius: 4%;
	text-align: center;
	z-index:11;
}
.a6{
	position: absolute;
	top: 42%;
	left: 51%;
	width: 8%;
	height: 12%;
	border: dotted 2px black;
	font-size: 10vmin;
	text-decoration: none;
	color: #000000;
	background-color: #ffffff;
	border-radius: 4%;
	text-align: center;
	z-index:11;
}
.a7{
	position: absolute;
	top: 42%;
	left: 61%;
	width: 8%;
	height: 12%;
	border: dotted 2px black;
	font-size: 10vmin;
	text-decoration: none;
	color: #000000;
	background-color: #ffffff;
	border-radius: 4%;
	text-align: center;
	z-index:11;
}
.a8{
	position: absolute;
	top: 42%;
	left: 71%;
	width: 8%;
	height: 12%;
	border: dotted 2px black;
	font-size: 10vmin;
	text-decoration: none;
	color: #000000;
	background-color: #ffffff;
	border-radius: 4%;
	text-align: center;
	z-index:11;
}
.a9{
	position: absolute;
	top: 42%;
	left: 81%;
	width: 8%;
	height: 12%;
	border: dotted 2px black;
	font-size: 10vmin;
	text-decoration: none;
	color: #000000;
	background-color: #ffffff;
	border-radius: 4%;
	text-align: center;
	z-index:11;
}
.a10{
	position: absolute;
	top: 42%;
	left: 91%;
	width: 8%;
	height: 12%;
	border: dotted 2px black;
	font-size: 10vmin;
	text-decoration: none;
	color: #000000;
	background-color: #ffffff;
	border-radius: 4%;
	text-align: center;
	z-index:11;
}