html, body{
    padding : 0;
    margin : 0;
}

html {
    height : 100%;
}

body {
    min-height : 100%;
    height : 100%;

    background-color : #000000;

    overflow : hidden;
}

.text-noselect {
    cursor : default;

    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

#menuLayer {
    display : none;

    position : absolute;

    width : 100%;
    height : 100%;

    opacity : 0.0;
    background-color : transparent;

}

#menuContent {
    margin-left : 30%;
    padding-top : 140px;

    color : #FFFFFF;

    width : 40%;
    height : 100%;

}

#demoTitle {
    color: #F0F0F0;
    font-size: 32px;
    font-style: italic;
}

#demoText {
    color : #F0F0F0;
    font-size : 20px;
}

#demoTags {
    color : #F0F0F0;
    font-size : 24px;
}

#opacityLayer{
    display: none;

    position : absolute;

    width : 100%;
    height : 100%;

    opacity: 0.0;
    background-color : #101020;
}

#menuHover {
    position : absolute;

    margin-left : 40%;

    bottom : 0;

    width : 20%;
    height : 80px;

    background-color : #A01010;

}

iframe {

    width : 100%;
    height : 100%;
    border : none;

}

#panel {

    position: absolute;

    background-color : #F0F0F0;

    margin-left: 40%;

    width: 20%;
    height: 14%;

    opacity: 0.4;

    margin-bottom : -4%;

    border-radius : 50% 50% 0 0;

    bottom: 0;

    box-shadow: 0px 0px 25vh 3vh rgba(200,200,200,0.75);


}

#about
{
    display : none;

    position : absolute;

    text-align : center;

    left : 1vw;
    bottom : 1vh;


    opacity : 0.4;
}

#about:hover
{
    opacity : 1.0;
}

#contact
{
    display : none;

    position : absolute;

    text-align : center;

    right : 0;
    padding-right : 3%;
    padding-top : 2%;


}

#email {
    margin-top : 1vh;
    display : block;
    text-align : right;
}

#linkedinLogo {
    width : 6vh;
    height : 6vh;

    opacity : 0.8;
}

#linkedinLogo:hover {
    opacity : 1.0;
}

#nav {

    display : none;

    text-align : center;

    margin-left : 20%;
    margin-right : 20%;

    margin-top : 3%;

    width : auto;
    height : auto;

}

.navElement {

    display : inline-block;

    margin-left : 2%;
    margin-right : 2%;

    width : 5vh;
    height : 5vh;
    background : url('nav_element_noselect.png') no-repeat;
    background-size : contain;
}

.navElement:hover {
    width: 5vh;
    height: 5vh;
    background: url('nav_element_select.png') no-repeat;
    background-size: contain;
}