@font-face {
  font-family: 'Roboto Slab';
  src: url(roboto-slab.woff2) format('woff2');
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: 'Oxygen';
  src: url(oxygen.woff2) format('woff2');
  font-weight: 400;
  font-display: swap;
}

/*   -- main css    */

body {

background: #1b2546 url(bak2.png) repeat;


}

h1 {
    font-family: 'Roboto Slab', Georgia, Times, serif;
    font-size: 80px;
    line-height: 50px;
	text-align: center;
	color: #e1faf6;
	text-shadow: 2px 2px #000000;
	padding: 0.1em 0em 0em 0em;
	letter-spacing: 0.04em;

}

h2 {
    font-family: 'Roboto Slab', Georgia, Times, serif;
    font-size: 45px;
    line-height: 45px;
	margin: 0em 0em 0em 0em;
	text-align: center;
	color: #ffffff;
}


h3 {
    font-family: 'Oxygen', Helvetica, Arial, serif;
    font-size: 23px;
	text-align: center;

}

h4 {
    font-family: 'Oxygen', Helvetica, Arial, serif;
    font-size: 18px;
    line-height: 12px;
	margin: 0em 0em 2em 0em;
	text-align: center;
	text-shadow: 2px 2px #000000;
	color: #ffffff;
	letter-spacing: 0.06em;
}

h5{
    font-family: 'Oxygen', Helvetica, Arial, sans-serif;
    font-size: 17px;
	margin: 1em 0em 0em 0em;
    line-height: 36px;
}
 


h6 {
    font-family: 'Oxygen', Helvetica, Arial, sans-serif;
    font-size: 17px;
    line-height: 22px;
	font-weight: 400;
	margin: 0em 0em 0em 8em;

}

h6 em {
    font-family: 'Oxygen', Helvetica, Arial, sans-serif;
    font-size: 17px;
	font-weight: 600;
	margin: 1em 0em 0em 6.5em;
	display: block;
}


		
hr
{
	margin:30px 0 30px 0;
	padding:0;
	border:0;
	outline:0;

	overflow:hidden;

	height:20px;
}

hr:after
{
	content:"";

	margin:0 auto;

	position:relative;
	top:-35px;
	display:block;
	width:95%;
	height:16px;

	box-shadow:0px 25px 10px rgba(213, 205, 184, .7);

	-webkit-border-radius:50%;
	-moz-border-radius:50%;
	border-radius:50%;
}


#centralMessage{

margin: 160px 0px 30px 0px;   
padding: 30px;
text-align: center;
}




.movedRight{

}

.question{

margin: 0 auto;
width: 420px;
padding: 25px;
background: #c8c2a9 url(bak2.png) repeat;;
color: #362819;
text-shadow: 1px 1px 1px rgba(255,255,255, .3);

	-moz-box-shadow:     0 0px 42px rgba(0,0,0,.6);
	-webkit-box-shadow:  0 0px 42px rgba(0,0,0,.6);
	box-shadow:          0 0px 42px rgba(0,0,0,.6);

 -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;

}


.question2{

margin: 300px auto;
padding: 25px;
}



#links {
 position: fixed;
  top: 95%;
  left: 50%;
  margin-top: -40px;
  margin-left: -194px;
}


#links ul {
list-style-type:none;
display:inline;
}

#links li {

 	 margin:6;
	padding:6;
	display:inline;

}


#links a {

 color: white;
   font-size: 12px;
   font-family: 'Oxygen', Georgia, Serif;
   text-decoration: none;

}




.readyButton {

  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -140px;
  margin-left: -220px;

}



#page {

margin: 0 auto 40px;
width: 888px;
padding: 50px;
background: #c8c2a9 url(bak2.png) repeat;;
color: #362819;
text-shadow: 1px 1px 1px rgba(255,255,255, .3);

	-moz-box-shadow:     0 0px 42px rgba(0,0,0,.6);
	-webkit-box-shadow:  0 0px 42px rgba(0,0,0,.6);
	box-shadow:          0 0px 42px rgba(0,0,0,.6);

}


#footer {
font-family: 'Oxygen', Georgia, Times, serif;
    font-size: 16px;
    line-height: 15px;
	text-align: center;
	padding: 20px;
	margin:40px 0 0 0;
color: #662214;
}




#buttonStart{


margin: auto;   
width: 212px;

  border-top: 1px solid #f79797;
   background: #d665d2;
   background: -webkit-gradient(linear, left top, left bottom, from(#cc125d), to(#d665d2));
   background: -webkit-linear-gradient(top, #cc125d, #d665d2);
   background: -moz-linear-gradient(top, #cc125d, #d665d2);
   background: -ms-linear-gradient(top, #cc125d, #d665d2);
   background: -o-linear-gradient(top, #cc125d, #d665d2);
   padding: 13px 26px;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   font-size: 40px;
   font-family: 'Oxygen', Georgia, Serif;
   text-decoration: none;
   vertical-align: middle;
   }
#buttonStart:hover {
   border-top-color: #bf005c;
   background: #bf005c;
   color: #ffffff;
   }
#buttonStart:active {
   border-top-color: #c2004e;
   background: #c2004e;
   }





.commonB{
margin: 20px 0px;
  border-top: 1px solid #f79797;
   background: #d665d2;
   background: -webkit-gradient(linear, left top, left bottom, from(#cc125d), to(#d665d2));
   background: -webkit-linear-gradient(top, #cc125d, #d665d2);
   background: -moz-linear-gradient(top, #cc125d, #d665d2);
   background: -ms-linear-gradient(top, #cc125d, #d665d2);
   background: -o-linear-gradient(top, #cc125d, #d665d2);
   padding: 13px 26px;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;

   color: white;
   font-size: 17px;
   font-family: 'Oxygen', Georgia, Serif;
   text-decoration: none;
   vertical-align: middle;
text-align: center;


   }
.commonB:hover {
   border-top-color: #bf005c;
   background: #bf005c;
   color: #ffffff;
   }
.commonB:active {
   border-top-color: #c2004e;
   background: #c2004e;
   }





.button1 {

}

.button2 {

}

.button3 {

}

.button4 {

}

.button5 {

}

.button6 {

}







#mainstuff {

margin: -40px 0px 0px 0px;   
padding: 10px;

}









#clear {

clear: both;

}



#header {

width:100%;
position:fixed;
top:0px;
margin-left:-10px;

background-image: url(bak2.png), url(back.png);
background-repeat: repeat, repeat;
background-color: #01253c;

//background: #01253c url(back.png) repeat-y fixed 50% top;
color: #01253c;
text-shadow: 1px 1px 1px rgba(255,255,255, .4);

	-moz-box-shadow:     0 0px 42px rgba(0,0,0,.6);
	-webkit-box-shadow:  0 0px 42px rgba(0,0,0,.6);
	box-shadow:          0 0px 42px rgba(0,0,0,.6);

z-index: 9999;

}


