html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    background: transparent;
}
#loader {
    position: absolute;
    text-align: center;
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index: 9999999999;
    /* left: 20px; */
    display: block;
}
#loader img{
    margin-top: 72%;
    text-align: center;
}
.main-class{
		width: 320px;
		position: relative;
		top:0;
		margin: 0 auto;
		text-align: center;
		height: 568px;
		overflow: hidden;
	}
.page{
		/*display: none;*/
		padding: 0 0;
		margin: 0 auto;
		width: 320px;
		height: 568px;
		/* background-size: 100% 100%; */
		
		background-size: 100% 100%;
		background-position: top center;
		background-repeat: no-repeat;
		overflow: hidden;
		display: none;
		position: absolute;top:0;
	}
	#page1{
		display: block;
		background-image: url('../assets/bluebg.jpg');
		background-size: 100%;
		height: 568px;
		overflow: hidden;
	}
	#filesarea{
		display: block;
		width: 100%
		height:568px;

	}
	#page2{
		display: none;
		background-image: url('../assets/bluebg.png');
		background-size: 100%;
		height: 568px;
		overflow: hidden;
	}
	#page3{
		display: hidden;
		background-image: url('../assets/endscreen.jpg');
		background-size: 100%;
		height: 568px;
		overflow: hidden;
	}
    #page3 img{
        width: 100%;
    }
	#videosrc {
	    width: 100%;
	}
	#exitlink{
		width: 100%;
	    height: 300px;
	    position: absolute;
	    border: 0px solid red;
	    position: absolute;
	    top: 171px;
	}
	#yellow1 {
    width: 120px;
    position: absolute;
    transform: rotate(19deg);
    left: -62px;
    top: -56px;
}
#yellow7 {
    width: 126px;
    position: absolute;
    transform: rotate(0deg);
    right: 46px;
    top: 516px;
}
#yellow6 {
    width: 94px;
    position: absolute;
    transform: rotate(38deg);
    right: -32px;
    top: 265px;
}
#yellow5 {
    width: 71px;
    position: absolute;
    transform: rotate(-29deg);
    left: 53px;
    top: 233px;
}
#yellow4 {
    width: 102px;
    position: absolute;
    transform: rotate(37deg);
    left: -89px;
    top: 293px;
}
#yellow3 {
    width: 71px;
    position: absolute;
    transform: rotate(4deg);
    left: -36px;
    top: 143px;
}
#yellow2 {
    width: 113px;
    position: absolute;
    transform: rotate(-28deg);
    left: 152px;
    top: 83px;
}
#green7 {
    width: 126px;
    position: absolute;
    transform: rotate(139deg);
    left: 296px;
    top: 65px;
}

#green6 {
    width: 126px;
    position: absolute;
    transform: rotate(51deg);
    left: -44px;
    top: 503px;
}
#green5 {
    width: 97px;
    position: absolute;
    transform: rotate(50deg);
    left: 137px;
    top: 413px;
}
#green4 {
    width: 69px;
    position: absolute;
    transform: rotate(40deg);
    left: 74px;
    top: 198px;
}
#green3 {
    width: 116px;
    position: absolute;
    transform: rotate(0deg);
    left: 235px;
    top: 190px;
}
#green2 {
    width: 117px;
    position: absolute;
    transform: rotate(0deg);
    left: 98px;
    top: 234px;
    /* display: none; */
}
#green1 {
    width: 102px;
    position: absolute;
    transform: rotate(51deg);
    left: 78px;
    top: -37px;
    z-index: 2;
}
#red7 {
    width: 103px;
    position: absolute;
    transform: rotate(-30deg);
    left: 260px;
    top: 511px;
}
#red6 {
    width: 120px;
    position: absolute;
    transform: rotate(30deg);
    left: 105px;
    top: 336px;
}
#red5 {
    width: 68px;
    position: absolute;
    transform: rotate(27deg);
    left: -27px;
    top: 408px;
}
#red4 {
    width: 68px;
    position: absolute;
    transform: rotate(-17deg);
    left: 160px;
    top: 219px;
}
#red3 {
    width: 82px;
    position: absolute;
    transform: rotate(-15deg);
    left: 252px;
    top: 65px;
}
#red2 {
    width: 122px;
    position: absolute;
    transform: rotate(30deg);
    left: 88px;
    top: 58px;
}
#red1 {
    width: 96px;
    position: absolute;
    transform: rotate(-14deg);
    left: 153px;
    top: -63px;
}
#video6 {
    /* display: none; */
    width: 79px;
    position: absolute;
    transform: rotate(28deg);
    left: 56px;
    top: 470px;
}
#video7 {
    /* display: none; */
    width: 86px;
    position: absolute;
    transform: rotate(29deg);
    left: 303px;
    top: 399px;
}
#video5 {
    /* display: none; */
    width: 86px;
    position: absolute;
    transform: rotate(1deg);
    left: 62px;
    top: 134px;
}
#video4 {
    width: 81px;
    position: absolute;
    transform: rotate(-30deg);
    left: 171px;
    top: 300px;
}#video3 {
    width: 79px;
    position: absolute;
    transform: rotate(-31deg);
    left: 21px;
    top: 327px;
}

#video2 {
    width: 86px;
    position: absolute;
    transform: rotate(-31deg);
    left: 257px;
    top: -47px;
}
#video1 {
    width: 86px;
    position: absolute;
    transform: rotate(-31deg);
    left: -9px;
    top: 51px;
}
#files {
    position: relative;
    width: 140px;
    top: 255px;
    opacity: 0;
}
#instructions {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 22;
}