* { margin:0; padding:0; }

html, body {
//    background: url("1.jpg");
//    background-repeat:no-repeat;
//	background-size: cover;
//    background-position:center center;
//    background-color: #000; 
//    background-attachment: fixed;
//    overflow: hidden; 
//    height: 100vh;
}

#gplaylogo {
position: absolute; 
	bottom: 30px;
	right: 20px;
	border: 2px solid #fff;
	border-radius: 15px 15px;
	background: rgba(255, 255, 255, 0.4);
	backdrop-filter: blur(12px);
	box-shadow: 0 6px 18px rgba(0,0,0,0.4), 0 16px 28px rgba(0,0,0,0.4);
}

.gplaylogo {
animation: gplaylogo 5s 0s both infinite;
}

@keyframes gplaylogo {
	0%, 20% {
		transform: translate3d(0, 0, 0);
	}
	10%, 14%, 18%, 2%, 6% {
		transform: translate3d(-7px, 0, 0);
	}
	12%, 16%, 4%, 8% {
		transform: translate3d(7px, 0, 0);
	}
}


#space {
position: absolute; 
    height: 80px;
    width: 80px;
	top: 900px;
}

#googleplay {
position: absolute; 
width: 99%;
height:550px;
top: 0px;
left: 0px;
//border:5px solid #fff;
}

#gplay {
position: absolute; 
//width: 400px;
height:40px;
	top: -50px;
	left: 50%;
	margin-left: -200px; 
float:left; 
color:#ffffff;  
font-family: 'Electrolize', arial, serif;
font-size: 45px;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 1),
3px 3px #000,
-1px -1px 5px #000,
5px 5px 7px #000;
}

#t1, #t2, #t3, #t4, #t5, #t6, #t7, #t8, #t9, #t10 ,#t11 ,#t12 {
//position: absolute; 
//z-index: 3;
    height: 80px;
    width: 80px;
border-radius: 15px 15px;
}

#r1, #r2, #r3, #r4, #r5, #r6, #r7, #r8, #r9, #r10, #r11, #r12 {
position: absolute; 
width: 80px;
//height:40px;
	top: 100px;
	left: 0px;
//	margin-left: -260px; 
text-align: center;
float:left; 
color:#ffffff;  
font-family: 'Electrolize', arial, serif;
font-size: 18px;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 1),
3px 3px #000,
-1px -1px 5px #000,
5px 5px 7px #000;
}

#g1, #g2, #g3, #g4, #g5, #g6, #g7, #g8, #g9, #g10, #g11, #g12 {
position: absolute; 
//z-index: 3;
    height: 80px;
    width: 80px;
border-radius: 20px 20px;
border-color: #FFFFFF;
border-style: solid; 
border-width: 5px;

-webkit-box-shadow: 4px 4px 25px 5px rgba(0, 0, 0, 0.9);
-moz-box-shadow: 4px 4px 25px 5px rgba(0, 0, 0, 0.9);
box-shadow: 4px 4px 25px 5px rgba(0, 0, 0, 0.9);
}

#g1 {
	top: 10px;
	left: 50%;
	margin-left: -160px; 
}

#g2 {
	top: 10px;
	left: 50%;
	margin-left: -40px; 
}

#g3 {
	top: 10px;
	left: 50%;
	margin-left: 80px; 
}

#g4 {
	top: 180px;
	left: 50%;
	margin-left: -160px; 
}

#g5 {
	top: 180px;
	left: 50%;
	margin-left: -40px; 
}

#g6 {
	top: 180px;
	left: 50%;
	margin-left: 80px; 
}

#g7 {
	top: 350px;
	left: 50%;
	margin-left: -160px; 
}

#g8 {
	top: 350px;
	left: 50%;
	margin-left: -40px; 
}

#g9 {
	top: 350px;
	left: 50%;
	margin-left:  80px; 
}

#g10 {
	top: 520px;
	left: 50%;
	margin-left:  -160px; 
}

#g11 {
	top: 520px;
	left: 50%;
	margin-left:  -40px; 
}
#g12 {
	top: 520px;
	left: 50%;
	margin-left:  80px; 
}

#loads1 {
z-index:100;
    position : absolute;    
    width    : 100%;
   left     : 0px;
    top      : 50%;
    margin-top  : -140px; /* half of the height */
color: rgb(255, 255, 255);
font-size: 50px;
font-weight: regular;
font-style: normal;
text-align: center;
font-family: 'Oswald', arial, serif;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 1),
3px 3px #000,
-1px -1px 5px #000,
5px 5px 7px #000;
}

#loads2 {
z-index:100;
    position : absolute;    
    width    : 80%;
    left     : 10%;
    top      : 50%;
    margin-top  : -50px; /* half of the height */
color: rgb(255, 255, 255);
font-size: 80px;
//font-weight: bold;
font-style: normal;
text-align: center;
font-family: 'Electrolize', arial, serif;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 1),
3px 3px #000,
-1px -1px 5px #000,
5px 5px 7px #000;
}

#loads3 {
z-index:100;
  padding-right: 25px;
  padding-left: 25px;
    position : absolute;    
//    width    : 100%;
   left     : 0px;
    bottom      : 40px;
color: rgb(255, 255, 255);
font-size: 25px;
font-weight: regular;
font-style: normal;
text-align: center;
font-family: 'Electrolize', arial, serif;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 1),
3px 3px #000,
-1px -1px 5px #000,
5px 5px 7px #000;
}



#texts1 {
position: absolute; 
width: 100%;
//left: 30px;
margin-left:10%;
top: 35px;
float:left; 
color:#FFFFFF;
font-size: 44px;
//text-align: center;
//font-weight: bold;
font-family: 'Electrolize', arial, serif;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 1),
3px 3px #000,
-1px -1px 5px #000,
5px 5px 7px #000;
}


#email {
font-family:Arial; 
text-indent: 7px;
 font-size:24pt; 
 width:80%; 
 margin-left:10%; 
 padding-left:14px; 
 padding-right:4px; 
 padding-top:1px; 
 padding-bottom:1px; 
 background-color:#FFFFFF;
// background-color: rgba(255, 255, 255, 0.8);
 height:74px; 
// font-weight:bold;
// border:5px solid #FFCC00; 
 border:5px solid #FFFFFF;
 border-radius:8px;
-webkit-box-shadow: 0px 5px 15px 5px rgba(0, 0, 0, 0.5) inset, 1px 1px 22px 0px rgba(0,0,0,1);
-moz-box-shadow: 0px 5px 15px 5px rgba(0, 0, 0, 0.5) inset, 1px 1px 22px 0px rgba(0,0,0,1);
box-shadow: 0px 4px 15px 5px rgba(0, 0, 0, 0.5) inset, 1px 1px 22px 0px rgba(0,0,0,1);
}

#button {
font-family: Arial; 
font-size: 30pt; 
width: 80%; 
margin-left: 10%; 
margin-top: 8px;
padding-left: 4px; 
padding-right: 4px; 
padding-top: 1px; 
padding-bottom: 1px; 
background-color: #009900;
color:#ffffff;
height:74px; 
//font-weight:bold;
border:5px solid #FFFFFF;
border-radius:8px;
-webkit-box-shadow: 1px 1px 22px 0px rgba(0,0,0,1);
-moz-box-shadow: 1px 1px 22px 0px rgba(0,0,0,1);
box-shadow: 1px 1px 22px 0px rgba(0,0,0,1),
inset 0px 0px 10px 4px rgba(255,255,255,1);
}

#texts2 {
position: absolute; 
width: 100%;
//left: 5px;
margin-left:10%;
top: 100px;
float:left; 
color:#FFFFFF;
font-size: 26px;
//text-align: center;
// font-weight: bold;
//font-family: 'Electrolize', arial, serif;
font-family: Geneva, Arial, Helvetica, sans-serif;
text-shadow: 2px 2px 4px rgba(0, 0, 0, 1),
3px 3px #000,
-1px -1px 5px #000,
5px 5px 7px #000;
}

#texts3 {
position: absolute; 
width: 80%;
margin-left: 10%;
left: 0px;
top: 460px;
color:#FFFFFF;
font-size: 26px;
text-align: center;
font-family: Geneva, Arial, Helvetica, sans-serif;
//font-family: 'Oswald', arial, serif;
text-shadow: 2px 2px 7px rgba(0, 0, 0, 0.8),
-2px -2px 7px rgba(0, 0, 0, 0.5),
2px -2px 7px rgba(0, 0, 0, 0.5),
-2px 2px 7px rgba(0, 0, 0, 0.5);
}


#form {
position: absolute; 
//width: 100%;
//left: 45px;
top: 175px;
float:left; 
}

#center {
position: absolute; 
	width:600px;
	top: 55px;
	left: 50%;
	height:545px;
	margin-left: -100px; 
	background: rgba(0, 0, 0, 0.2);
	border:5px solid #fff;
      border-radius:28px;
     -moz-border-radius:28px;
     -webkit-border-radius:28px;
backdrop-filter: blur(12px);
box-shadow: 0px 0px 9px 3px rgba(0,0,0,0.4), 
0px 0px 16px 15px rgba(0,0,0,0.4),
inset 0px 0px 20px 3px rgba(255,255,255,1);
}

#card {
position: absolute; 
	width:495px;
	top: 365px;
	left: 50%;
	height:88px;
	margin-left: -245px; 
//	background: #000;
}

#ssl {
position: absolute; 
	width:210px;
	top: 440px;
	left: 50%;
	height:88px;
	margin-left: -245px; 
//	background: #000;
}

#EN, #RU {
position: absolute; 
	width:130px;
	top: -4px;
//	left: 50%;
	height:55px;
	right: -4px;
//	margin-left: 214px;
	border:3px solid #fff;
-webkit-border-top-right-radius: 28px;
-webkit-border-bottom-left-radius: 28px;
//-webkit-top-bottom-left-radius: 28px;
-moz-border-radius-topright: 28px;
-moz-border-radius-bottomleft: 28px;
border-top-right-radius: 28px;
border-bottom-left-radius: 28px;
//border-top-left-radius: 28px;
//background: #FFFFFF;
-webkit-box-shadow: -5px 5px 17px -3px rgba(0,0,0,1);
-moz-box-shadow: -5px 5px 17px -3px rgba(0,0,0,1);
box-shadow: -5px 5px 17px -3px rgba(0,0,0,1);
}


#secimg {
position: absolute; 
	width:160px;
	height:72px;
	right:20px;
	bottom: 10px;
}