/****************************************/
/* common styles used for v1 through v4 */
/****************************************/

body          { font-family: 'Press Start 2P', cursive; }
body, html {
    width: 100%;
    height: 100%;
    overflow: hidden;
    margin: 0;
    padding: 0;
}
* {
    cursor: url(https://gameathlon.eu/wp-content/themes/gameathlon_summer_2019/css/purple_cur.cur), auto !important;
}
.clickable,.clickable *{
cursor: url(https://gameathlon.eu/wp-content/themes/gameathlon_summer_2019/css/blue_cur.cur), auto !important;	
}
#stats        { border: 2px solid black; }
#controls     { float: left; padding: 1em; font-size: 0.7em; }
#controls th  { text-align: right; vertical-align: middle; }
#instructions { clear: left; float: left; width: 17em; padding: 1em; border: 1px solid black; box-shadow: 0 0 5px black; }
#racer        { position: relative; z-index: 0; width: 100% !important; height: 100% !important; margin: 0; border: 2px solid black; }
#canvas       { position: absolute; z-index: 0; width: 100% !important; height: 100% !important; z-index: 0; background-color: #140927; }
#mute         { display:none; background-position:   0px 0px; width: 32px; height: 32px; background: url(images/mute.png); cursor: pointer; position: absolute; margin-left: 20em; }
#mute.on      { background-position: -32px 0px; }

/**************************************************/
/* rudimentary heads up display (only used in v4) */
/**************************************************/

#hud                   { position: absolute; z-index: 1; width: 100% !important; padding: 5px 0;font-family: 'Press Start 2P', cursive; font-size: 0.8em; color: white;box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; }
#hud .hud              { padding: 5px; margin: 0 5px; transition-property: background-color; transition-duration: 2s; -webkit-transition-property: background-color; -webkit-transition-duration: 2s; }
#hud #speed            { float: right; }
#hud #current_lap_time { float: left;  }
#hud #last_lap_time    { float: left; display: none;  }
#hud #fast_lap_time    { display: inline-block; width: 14em;  margin: 0 auto; text-align: center; transition-property: background-color; transition-duration: 2s; -webkit-transition-property: background-color; -webkit-transition-duration: 2s; }
#hud #my_lap_time {
    display: inline-block;
    width: 14em;
    margin: 0 auto;
    text-align: center;
    transition-property: background-color;
    transition-duration: 2s;
    -webkit-transition-property: background-color;
    -webkit-transition-duration: 2s;
}
#hud .value            {     color: white;
    display: inline-block;
    margin-top: 5px; }
#hud .fastest,#hud .fastest .value          { color: rgb(221, 0, 255); } 
  @keyframes credits {
0% { background-position-x: 100%; }
100% { background-position-x: -100%; }
}
  div#main_menu {
    position: absolute;
    width: 100%;
    height: 100%;
    background: black;
    z-index: 5;
	background-image: url(/_archive-assets/images/99a933a7fbd0a38877c7.jpg);
    background-repeat-y: no-repeat;
    background-size: auto 40%;
	animation: 90s credits linear infinite;
}
.main_menu_wrap {
    position: relative;
    width: 100%;
    height: 100%;
}
.main_menu {
    position: absolute;
    font-family: 'Press Start 2P', cursive;
    left: 50%;
       top: 62%;
    transform: translate(-50%,-50%);
	    COLOR: #FFF;
    text-align: center;
	    /* display: none; */
}
.main_menu ul {
    padding: 0;
}
.main_menu ul li {
    list-style: none;
    margin-bottom: 20px;
    font-size: 1.5rem;
}
.main_menu ul li span {
    position: relative;
}
.main_menu ul li.chosen span:before {
    content: "*";
    position: absolute;
    left: -30px;
}
.credz {
    font-family: 'Press Start 2P', cursive;
    COLOR: #FFF;
    text-align: center;
    position: absolute;
    width: 100%;
    z-index: 6;
    bottom: 20px;
	font-size: 0.7rem;
}
.game_logo {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    top: 80px;
}
div#high_score {
    position: absolute;
    font-family: 'Press Start 2P', cursive;
    left: 50%;
    top: 68%;
    transform: translate(-50%,-50%);
    COLOR: #FFF;
    text-align: left;
    width: 500px;
	display:none;
}
#high_score td, #high_score th,#paused td, #paused th {
    padding: 5px;
}
.go_back {
    text-align: center;
    margin-top: 50px;
}
.go_back span
{
position: relative;
}
.go_back span:before {
    content: "*";
    position: absolute;
    left: -30px;
}
div#enter_name {
    position: absolute;
    font-family: 'Press Start 2P', cursive;
    left: 50%;
    top: 68%;
    transform: translate(-50%,-50%);
    COLOR: #FFF;
    text-align: left;
    width: 500px;
	display:none;
}
.user_editors{
    TEXT-ALIGN: center;
    MARGIN-BOTTOM: 50px;
    color: #ffffff;
    font-size: 1.3rem;
}
.user_editors span{
position:relative;
}
.user_editors.chosen span:before {
    content: "*";
    position: absolute;
    left: -30px;
}
.go_back_menu {
    text-align: center;
    margin-top: 40px;
}
.go_back_menu span
{
position: relative;
}
.go_back_menu.chosen span:before {
    content: "*";
    position: absolute;
    left: -30px;
}
.start_game_storage {
    text-align: center;
    margin-top: 80px;
}
.start_game_storage span
{
position: relative;
}
.start_game_storage.chosen span:before {
    content: "*";
    position: absolute;
    left: -30px;
}
.save_profile_storage{
    text-align: center;
    margin-top: 80px;
}
.save_profile_storage span
{
position: relative;
}
.save_profile_storage.chosen span:before {
    content: "*";
    position: absolute;
    left: -30px;
}
.load_game_storage{
    text-align: center;
    margin-top: 80px;
}
.load_game_storage span
{
position: relative;
}
.load_game_storage.chosen span:before {
    content: "*";
    position: absolute;
    left: -30px;
}
.delete_game_storage{
    text-align: center;
    margin-top: 20px;
}
.delete_game_storage span
{
position: relative;
}
.delete_game_storage.chosen span:before {
    content: "*";
    position: absolute;
    left: -30px;
}



.go_back_menu_editors{
    text-align: center;
    margin-top: 80px;	
}
.go_back_menu_editors span
{
position: relative;
}
.go_back_menu_editors.chosen span:before {
    content: "*";
    position: absolute;
    left: -30px;
}
.go_back_main_menu{
    text-align: center;
    margin-top: 80px;	
}
.go_back_main_menu span
{
position: relative;
}
.go_back_main_menu.chosen span:before {
    content: "*";
    position: absolute;
    left: -30px;
}
.go_back_menu_enter_name_load{
    text-align: center;
    margin-top: 80px;	
}
.go_back_menu_enter_name_load span
{
position: relative;
}
.go_back_menu_enter_name_load.chosen span:before {
    content: "*";
    position: absolute;
    left: -30px;
}
div#user_editors_name,#user_editors_email,#enter_name_saved,#enter_name_load,#user_editors_playerid {
    position: absolute;
    font-family: 'Press Start 2P', cursive;
    left: 50%;
    top: 68%;
    transform: translate(-50%,-50%);
    COLOR: #FFF;
    text-align: left;
    width: 504px;
    display: none;
}
.letters_n span,.letters_e span,.letters_l span {
    padding: 5px;
    margin: 5px;
    display: inline-block;
cursor: url(https://gameathlon.eu/wp-content/themes/gameathlon_summer_2019/css/blue_cur.cur), auto !important;		
}
.letters_n span.chosen,.letters_l span.chosen,.letters_e span.chosen , .letters_n span:hover,.letters_e span:hover,.letters_l span:hover{
color: #ff00ff;	
}
#paused {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    background: #000000bd;
    z-index: 5;
}
#paused .paused {
    position: relative;
    width: 100%;
    height: 100%;
}
#paused .paused .paused_info {
    position: absolute;
    width: 500px;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    background: #730373;
    color: #fff;
    padding: 20px;
}