
a.brand:link {
    color: azure;
    text-decoration: none;
}

a.brand:visited {
    color: azure;
    text-decoration: none;
}

a.brand:hover {
    color: cadetblue;
    text-decoration: none;
}

a.brand:active {
    color: azure;
    text-decoration: none;
}

body{
    background-color: #0E1214;
    margin: 0px;
    padding: 0px;
    height: 100%;
    overflow: hidden;
}

header {
    display: block;
    background-color: #1F2325;
    text-align: center;
    font-family: "Helvetica", sans-serif;
    color: azure;
    padding: 0em;
	position: fixed;
	top: 0px;
	left: 0px;
	right: 0px;
    z-index: 10;
}

a.email:link {
    color: azure;
    text-decoration: none;
}

a.email:visited {
    color: azure;
    text-decoration: none;
}

a.email:hover {
    color: cadetblue;
    text-decoration: none;
}

a.email:active {
    color: azure;
    text-decoration: none;
}

.nav {
    text-align: center;
    margin-left: -3%;
}

.nav li {
    width: auto;
    border-bottom: none;
    height: 5px;
    line-height: 5px;
    font-size: 1.0em;
    display: inline-block;
	}
 
.nav a {
	text-decoration: none;
	font-size: 1.0em;
	color: azure;
	display: block;
	padding-left: 15px;
	padding-right: 15px;
}
 
.nav a:hover {
	color: cadetblue;
    transition: .2s color;
}

a.centered1 {
    position: absolute;
    left: 0px;
    height: 100%;
    bottom: 0px;
    max-width: 100%;
    width: 33.3333%;
    background-image: url(images/links/egypt.jpg);
    background-size: cover;
    background-position: center;
    display: block;
    overflow:hidden;
    text-indent:100%;
    white-space:nowrap;
    z-index: 1;
    transition: all 0.4s ease;
}

a.centered1:hover {
    position: absolute;
    left: 0px;
    height: 100%;
    bottom: 0px;
    max-width: 100%;
    width: 35%;
    background-image: url(images/links/egypt.jpg);
    background-size: cover;
    background-position: center;
    display: block;
    overflow:hidden;
    text-indent:100%;
    white-space:nowrap;
    z-index: 2;
}

a.centered2 {
    position: absolute;
    left: 33.333%;
    height: 100%;
    bottom: 0px;
    max-width: 100%;
    width: 33.3333%;
    background-image: url(images/links/vbg.jpg);
    background-size: cover;
    background-position: center;
    display: block;
    overflow:hidden;
    text-indent:100%;
    white-space:nowrap;
    z-index: 1;
    transition: all 0.4s ease;
}

a.centered2:hover {
    position: absolute;
    left: 32.333%;
    height: 100%;
    bottom: 0px;
    max-width: 100%;
    width: 35%;
    background-image: url(images/links/vbg.jpg);
    background-size: cover;
    background-position: center;
    display: block;
    overflow:hidden;
    text-indent:100%;
    white-space:nowrap;
    z-index: 2;
}

a.centered3 {
    position: absolute;
    right: 0px;
    height: 100%;
    bottom: 0px;
    max-width: 100%;
    width: 33.333%;
    background-image: url(images/links/protocol.jpg);
    background-size: cover;
    background-position: center;
    display: block;
    overflow:hidden;
    text-indent:100%;
    white-space:nowrap;
    z-index: 1;
    transition: all 0.4s ease;
}

a.centered3:hover {
    position: absolute;
    right: 0px;
    height: 100%;
    bottom: 0px;
    max-width: 100%;
    width: 35%;
    background-image: url(images/links/protocol.jpg);
    background-size: cover;
    background-position: center;
    display: block;
    overflow:hidden;
    text-indent:100%;
    white-space:nowrap;
    z-index: 2;
}

img.egyptIco {
    position: absolute;
    width: 6%;
    bottom: 1%;
    z-index: 5;
    left: 3%;
    -webkit-filter: drop-shadow(0px 0px 2px #AAA);
    filter: drop-shadow(0px 0px 2px #AAA);
    pointer-events: none
}

img.zeroIco {
    position: absolute;
    width: 6%;
    bottom: 1%;
    z-index: 5;
    left: 36.3333%;
    -webkit-filter: drop-shadow(0px 0px 2px #AAA);
    filter: drop-shadow(0px 0px 2px #AAA);
    pointer-events: none
}

img.spaceIco {
    position: absolute;
    width: 6%;
    bottom: 1%;
    z-index: 5;
    left: 69.6666%;
    -webkit-filter: drop-shadow(0px 0px 1px #AAA);
    filter: drop-shadow(0px 0px 2px #AAA);
    pointer-events: none;
}

p.egyptText {
    position: absolute;
    padding: 5px;
    font-size: 3vw;
    font-family: "Helvetica", sans-serif;
    color: azure;
    text-align: left;
    top: 110px;
    left: 3%;
    width: 100%;
    z-index: 20;
    -webkit-filter: drop-shadow(0px 0px 1px #000);
    filter: drop-shadow(0px 0px 2px #000);
    pointer-events: none;
    transition: all 0.3s ease;
}

p.zeroText {
    position: absolute;
    padding: 5px;
    font-size: 3vw;
    font-family: "Helvetica", sans-serif;
    color: azure;
    text-align: center;
    top: 110px;
    width: 100%;
    z-index: 20;
    -webkit-filter: drop-shadow(0px 0px 1px #000);
    filter: drop-shadow(0px 0px 2px #000);
    pointer-events: none;
    transition: all 0.3s ease;
}

p.spaceText {
    position: absolute;
    padding: 5px;
    font-size: 3vw;
    font-family: "Helvetica", sans-serif;
    color: azure;
    text-align: right;
    top: 110px;
    width: 100%;
    right: 5.5%;
    z-index: 20;
    -webkit-filter: drop-shadow(0px 0px 1px #000);
    filter: drop-shadow(0px 0px 2px #000);
    pointer-events: none;
    transition: all 0.3s ease;
}

@media only screen and (orientation: portrait)
{

    a.centered1 {
        position: absolute;
        height: 31.5%;
        top: 110px;
        max-width: 100%;
        width: 100%;
        background-image: url(images/links/egypt.jpg);
        background-size: cover;
        background-position: center;
        display: block;
        overflow:hidden;
        text-indent:100%;
        white-space:nowrap;
        z-index: 1;
        transition: all 0.2s ease;
    }

    a.centered1:hover {
        position: absolute;
        height: 33.5%;
        top: 110px;
        max-width: 100%;
        width: 100%;
        background-image: url(images/links/egypt.jpg);
        background-size: cover;
        background-position: center;
        display: block;
        overflow:hidden;
        text-indent:100%;
        white-space:nowrap;
        z-index: 3;
        transition: all 0.2s ease;
    }

    a.centered2 {
        position: absolute;
        height: 31.5%;
        bottom: 31.5%;
        left: 0px;
        max-width: 100%;
        width: 100%;
        background-image: url(images/links/vbg.jpg);
        background-size: cover;
        background-position: center;
        display: block;
        overflow:hidden;
        text-indent:100%;
        white-space:nowrap;
        z-index: 1;
        transition: all 0.2s ease;
    }

    a.centered2:hover {
        position: absolute;
        height: 33.5%;
        bottom: 30.5%;
        left: 0px;
        max-width: 100%;
        width: 100%;
        background-image: url(images/links/vbg.jpg);
        background-size: cover;
        background-position: center;
        display: block;
        overflow:hidden;
        text-indent:100%;
        white-space:nowrap;
        z-index: 3;
        transition: all 0.2s ease;
    }

    a.centered3 {
        position: absolute;
        height: 31.5%;
        bottom: 0px;
        left: 0px;
        max-width: 100%;
        width: 100%;
        background-image: url(images/links/protocol.jpg);
        background-size: cover;
        background-position: center;
        display: block;
        overflow:hidden;
        text-indent:100%;
        white-space:nowrap;
        z-index: 1;
        transition: all 0.2s ease;
    }

    a.centered3:hover {
        position: absolute;
        height: 33.5%;
        bottom: 0px;
        left: 0px;
        max-width: 100%;
        width: 100%;
        background-image: url(images/links/protocol.jpg);
        background-size: cover;
        background-position: center;
        display: block;
        overflow:hidden;
        text-indent:100%;
        white-space:nowrap;
        z-index: 1;
        transition: all 0.2s ease;
    }

    img.egyptIco {
        position: absolute;
        width: 10%;
        bottom: 66.666%;
        z-index: 5;
        left: 3%;
        -webkit-filter: drop-shadow(0px 0px 2px #AAA);
        filter: drop-shadow(0px 0px 2px #AAA);
        pointer-events: none
    }

    img.zeroIco {
        position: absolute;
        width: 10%;
        bottom: 33.3333%;
        z-index: 5;
        left: 3%;
        -webkit-filter: drop-shadow(0px 0px 2px #AAA);
        filter: drop-shadow(0px 0px 2px #AAA);
        pointer-events: none
    }

    img.spaceIco {
        position: absolute;
        width: 10%;
        bottom: 1%;
        z-index: 5;
        left: 3%;
        -webkit-filter: drop-shadow(0px 0px 1px #AAA);
        filter: drop-shadow(0px 0px 2px #AAA);
        pointer-events: none;
    }

    p.egyptText {
        position: absolute;
        padding: 5px;
        font-size: 5vw;
        font-family: "Helvetica", sans-serif;
        color: azure;
        text-align: center;
        top: 110px;
        left: 0%;
        width: 100%;
        z-index: 7;
        -webkit-filter: drop-shadow(0px 0px 1px #000);
        filter: drop-shadow(0px 0px 2px #000);
        pointer-events: none;
    }

    p.zeroText {
        position: absolute;
        padding: 5px;
        font-size: 5vw;
        font-family: "Helvetica", sans-serif;
        color: azure;
        text-align: center;
        top: 36%;
        left: 0%;
        width: 100%;
        z-index: 7;
        -webkit-filter: drop-shadow(0px 0px 1px #000);
        filter: drop-shadow(0px 0px 2px #000);
        pointer-events: none;
    }

    p.spaceText {
        position: absolute;
        padding: 5px;
        font-size: 5vw;
        font-family: "Helvetica", sans-serif;
        color: azure;
        text-align: center;
        top: 70%;
        left: 0%;
        width: 100%;
        z-index: 7;
        -webkit-filter: drop-shadow(0px 0px 1px #000);
        filter: drop-shadow(0px 0px 2px #000);
        pointer-events: none;
    }
}