body{
    background-color:#1A1A1A;
}
/* Nav */
.navigation_outer {
    border: 1px solid #000;
    margin: 30px;
    height: 90px;
    min-width: 920px;
    background-color:#FFF;
    min-width:1024px;
}

.navigation_inner{
    display:inline-block;
    height:100%;
    float:right;
}

.title {
    margin-left: 50px;
    color: #aa0000;
    font-size: 42px;
    font-family: Britannic;
    font-weight: bold;
    vertical-align: middle;
    margin-top: 10px;
    display: inline-block;
}

.navigation_outer img{
    vertical-align: middle;
    margin-top: 10px;
    margin-left: 10px;
}

.menu_items {
    vertical-align: middle;
    list-style: none;
}

.menu_items li {
    font-size: 22px;
    font-family: Calibri;
    display: inline-block;
    margin:10px;
}

.menu_items li:last-child{
    margin-right:30px;
}

.menu_items li a {
    text-decoration: none;
    color: #9e9e9e;
}

.menu_items li a:hover {
    color: #FFCE44;
}

.menu_items li span {
    vertical-align: middle;
    margin-top: 20px;
    display: inline-block;
}

/*footer*/
.footer{
    background-color:#aa0000;
    border:1px solid #000;
    margin: 30px 30px 0px 30px;
    height: 90px;
    min-width: 920px;
}

.footer div{
    color:#FFF;
    font-size: 22px;
    font-family: Calibri;
    display: inline-block;
    margin-top:20px;
    width:23%;
    padding-right:10px;
    text-align:center;
}

.footer div:first-child{
    text-align:left;
    padding-left:10px;
}

.footer div:last-child{
    text-align:right;
    float:right;
}

.footer a {
    text-decoration: none;
    color: #FFF;
    font-size: 22px;
    font-family: Calibri;
    display: inline-block;
    margin:10px;
    vertical-align:middle;
}

.contactus_inner a:hover {
    color: #FFCE44;
}

/*content*/
.homeHeader {
    color: #9e9e9e;
    font-size: 120%;
    text-align: left;
}

.content {
    /*border: 1px solid #000;*/
    margin: 30px;
    min-width: 920px;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    /*font-family:'Verdana','sans-serif';*/
}

.mainImage{
    text-align:center;
}

.mainImage img
{
    position: relative;
    display: inline-block;
    padding-top: 10px;
    margin-left:auto;
    margin-right:auto;
    width: 44vw;
}
.subImage img
{
    position: relative;
    display: block;
    padding-top: 30px;
    margin: auto;
    width: 44vw;
}
.rightImage{
    display: inline-block;
    margin-left: 100px;
    vertical-align: top;
    margin-top: 10px;
}
.rightImage img
{
    position: relative;
    display: block;
    margin: auto;
    width:18vw;
}
.content_inner{
    margin:auto;
    position:relative;
    width:100%;
    text-align:center;
}
.star {
    position: absolute;
    z-index: 100;
    width: 15vw;
    left:0;
    top:50px;
}

.Go1{
    position: absolute;
    z-index: 100;
    bottom:50%;
    left:10%;
}

.Go2{
    position: absolute;
    z-index: 100;
    bottom:50%;
    right:10%;
}


.featured{
    padding-top:30px;
}

.featured a {
    color: #2aadff;
    font-size: 36px;
}


.downloadmeh{
    /*background: #3498db;
    background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
    background-image: -moz-linear-gradient(top, #3498db, #2980b9);
    background-image: -ms-linear-gradient(top, #3498db, #2980b9);
    background-image: -o-linear-gradient(top, #3498db, #2980b9);
    background-image: linear-gradient(to bottom, #3498db, #2980b9);
    -webkit-border-radius: 28px;
    -moz-border-radius: 28px;
    border-radius: 28px;
    font-family: Arial;
    color: #ffffff;
    font-size: 20px;
    padding: 10px 20px 10px 20px;*/
    text-decoration: none;
    display:inline-block;
    position:absolute;
    top:0px;
    left:20px;
    z-index:120;
    background-image:url(../Images/btndownload.png);
    background-size:100% 100%;
    width:240px;
    height:55px;
    user-select:none;
    -webkit-user-drag:none;
}

.downloadmeh:hover{
    background-image:url(../Images/btndownloadhighlight.png);
}

.downloadmeh:active{
    background-image:url(../Images/btndownloadpressed.png);
}

.viewGames {
    text-decoration: none;
    display: inline-block;
    position: absolute;
    bottom: 15px;
    right: 10px;
    z-index: 120;
    background-image: url(../Images/btndownload.png);
    background-size: 100% 100%;
    width: 240px;
    height: 55px;
    user-select: none;
    -webkit-user-drag: none;
}

.viewGames:hover{
    background-image:url(../Images/btndownloadhighlight.png);
}

.viewGames:active{
    background-image:url(../Images/btndownloadpressed.png);
}



/* maps */
.regionMap{
    display:flex;
}
.regionMap img{
    max-width:2048px;
    width:100%;
}
.regionMap p{
    color:#FFCE44;
}
.regionMap div:not(last-child){
    padding-right:10px;
}

/*Monsters*/
.monsters{
    display:flex;
    flex-wrap:wrap;
}

.monster {
    display: inline-block;
    width: 150px;
    border: 1px solid #fff;
    margin: 5px;
}

.monster img {
    height: 90px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    position: relative;
    display: block;
}

.monster p {
    color: #ffce44;
    padding: 10px;
}

/*Ships*/
.ship {
    display: inline-block;
    width: 150px;
    border: 1px solid #fff;
    margin: 5px;
    height: 275px;
    vertical-align: top;
    position:relative;
    background-color:#000;
}


.ship img {
    height: 90px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    position: relative;
    display: block;
}

.ship p {
    color: #ffce44;
    padding: 10px;
}

.shipMakeModel{
    height:35px;
}

.spaceWarsControls{

}

.spaceWarsControls p{
    display:inline-block;
    padding-left:10px;
    vertical-align:top;
}

.spaceWarsControls img{
    display:inline-block;
}

.shipsCrew{

}

.shipsCrew p{
    display:inline-block;
    padding-left:10px;
    vertical-align:top;
}

.shipsCrew img{
    display:inline-block;
    border:none !important;
}


/*medals*/
.medals{
    display:flex;
    flex-wrap:wrap;
}

.medal {
    display: inline-block;
    width: 200px;
    border: 1px solid #fff;
    margin: 5px;
}

.medal img {
    height: 75px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    position: relative;
    display: block;
    padding:10px;
}

.medal p {
    color: #fff;
    padding: 10px;
    height:30px;
    text-align:center;
}

.gold p{
    color: #ffce44;
}

.gold .medal{
    border: 1px solid #ffce44;
}

.silver p{
    color: #E3E5E0;
}

.silver .medal{
    border: 1px solid #E3E5E0;
}

.bronze p{
    color: #C77745;
}

.bronze .medal{
    border: 1px solid #C77745;
}

/*help*/
.help{
    color:#fff;
    font-size:large;
}

.help summary{
    color:#ffce44;
    font-size:larger;
}
.help p{
    margin-top:20px;
}
.help details{
    padding:20px;
}
.help ul{
    margin-left:40px;
    margin-top:20px;
}
.help ol{
    margin-left:40px;
    margin-bottom:10px;
}
.help li > img{
    margin-left:50px;
}
.help img{
    border:1px solid #666666;
    margin:5px 0;
    max-width:800px;
}


@media (max-width:1024px) {
    .title{}
    .navigation_outer{min-width:0;width:100%;height:160px;}
    .menu_items{display:block;}
    .Go1 {bottom:50%;left:0px;}
    .Go2 {bottom:50%;right:-75px;}
    .footer div {display:block;margin-top:10px;width:100%;padding-top:0;text-align:center;border:1px solid #000;background-color:#aa0000;}
    .footer div:last-child{text-align:center;float:none;margin-bottom:30px;}
    .footer div:first-child{text-align:center;float:none;padding-left:0px;}
    .footer {background-color:transparent;border:none;width:100%;}
    .footer a{margin:20px;}
    .mainImage img{width:100vw;}
}