.world
{
	position:absolute;
    top: calc(50% - 0px);
    left: calc(50% - 5px);
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);

    background-color: #333;
}

.world-container
{
	width: 100%;
	height: 100%;
}
html,body 
{
    position:relative;
	overflow: hidden;
    height: 100%;
    font-size: 30px;
    line-height: 1;
	font-family: courier;

}

.left-sea 
{
	position: absolute;
	font-family: courier;
	height: 100%;
}

.loc-marker{
	color: white;
}
.right-sea
{
	position: absolute;
	font-family: courier;
	height: 100%;
}

.words, .title
{
    color: black;
    font-weight: bold;
}

.land, .title-border {
    color: #193e53;
    opacity: 0.8;
}

.info {
    width: 630px;
    margin: auto;
    color: #DDD;
    height: 0px;
    overflow: scroll;
    font-size: 25;
}   

.content {
    padding-top: 10px;
    padding-bottom: 10px;
    overflow: scroll;
}

.numbers {
    position: relative;
    float: left;
    height: 0px;
    color: gray;
    overflow: hidden;
    text-align: right;
}

.marginTen {
    padding-top: 10px;
    padding-right: 20px;
}

@media only screen and (max-width: 1000px) and (orientation: portrait) {
    body{
        font-size: 40px;    
    }
    
    .world {
        left: calc(50% - 12px);
        top: calc(50% + 6px);
    }

    .info {
        min-width: 910px;
        font-size: 45px;
    }
    
    .content {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .marginTen {
        padding-top: 52px;
    }
}

@media only screen and (max-width: 1000px) and (orientation: landscape) {
    body{
        font-size: 25px;    
    }

    .info {
        width: 650px;
        font-size: 25px;
    }
}

.bottom-half, .top-half, .middle-half {
    position: relative;
    background-color: #DDD;
}

.water, .border, .sponsor-border, .about-border, .faq-border {
    /*color: #DCC;*/
    color: #5D7F97;
    opacity: 0.2;
}

.darker-border {
}

.shadow-top {
    box-shadow: 0px -3px 3px #000;
}

.shadow-bottom {
    box-shadow: 0px 3px 3px #000;
}

.middle-half {
    z-index: 1000;
}

.bottom-half {
    margin-top: -1px;
}

.top-half {
    margin-bottom: -1px;
}

.invisible {
    float: right;
}

.button {
    color: pink;
}

.button:hover {
    color: pink;
}

.btn-click {
    color: black;
}

.back {
    color: orange;
}

.back:hover {
    color: orange;
}

.filler-div {
    position: relative;
    width: 100%;
    height: 0px;
    overflow: hidden;
}

.header-navbar {
    z-index: 2;
    -webkit-transition: opacity 1s, top 1s, background-color .4s ease-out, box-shadow .4s ease-out;
    -o-transition: opacity 1s, top 1s, background-color .4s ease-out, box-shadow .4s ease-out;
    -moz-transition: opacity 1s, top 1s, background-color .4s ease-out, box-shadow .4s ease-out;
    -ms-transition: opacity 1s, top 1s, background-color .4s ease-out, box-shadow .4s ease-out;
    transition: opacity 1s, top 1s, background-color .4s ease-out, box-shadow .4s ease-out;
}

#alt-logo {
    position: absolute;
    width: 62px;
    height: 60px;
    margin: 20px 40px;
    opacity: 1;
    z-index: 1;
    background: url('/assets/img/logo_dark.png') no-repeat;
}