html {
    height: 100%;
    background-color: white;

}

body {

    margin: 0;
    overflow: hidden;
}

a {
    -ms-touch-action: manipulation;
    touch-action: manipulation;
}

#container {
    background-color: white;
    width: 0;
    height: 0;
    position: absolute;
    /*opacity: 1;*/
    /*transition: opacity 5s;*/
    overflow: hidden;
}

#namebox {
    width: 13%;
    height: 5%;
    position: absolute;
    top: 4%;
    right: 5%;
    font-family: 'Open Sans Condensed', sans-serif;
    color: black;
    padding: 0;
    font-size: 100%;
    opacity: 0;
}

#top-border {
    position: absolute;
    width: 100%;
    height: 3%;
    z-index: 3;
}

#top-border img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#bottom-border {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 3%;
    z-index: 3;
}

#bottom-border img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

}

#rectangle {
    width: 90%;
    height: 45%;
    position: absolute;
    left: 5%;
    top: -45%;
    font-family: 'Open Sans Condensed', sans-serif;
    z-index: 1;
    /*TODO: add background to rectangle*/
    /*background-image: url('images/footerSmall_mini.jpeg');*/
    /*	box-shadow: 0px 0px 3px 3px #A23535;*/
    /*	border: 3px #A23535 solid;*/
}

#rectangle img {
    position: absolute;

    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*	border:3px #A23535 solid;*/
}

#rectangle p {
    text-align: center;
}

#rectContent {
    height: 100%;
    width: 100%;
    overflow: hidden;
    position: absolute;
}

#leftbox {
    left: 3%;
    top: 13%;
    width: 30%;
    z-index: 2;
    /*font-family: 'Pompiere', cursive;*/
    font-family: 'Just Another Hand', cursive;
    /*	font-family: 'Open Sans Condensed', sans-serif;font-size:150%;*/

    position: absolute;

}

#line {

    width: 90%;
    height: 5%;
    position: absolute;
    left: 5%;
    bottom: -5%;
    text-align: center;
    font-family: 'Open Sans Condensed', sans-serif;
}

#line img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

}

#menu {
    /*	background-image:url('images/Untitled.png');*/
    /*	background-size:cover;*/
    background-color: white;
    width: 20%;
    height: 45%;
    position: absolute;
    right: -21%;
    top: 45%;
    /*	border: 5px #E6D5AC solid;*/
    box-shadow: 0 0 5px 3px #A23535;
    z-index: 4;

}

#menu ul {
    list-style: none;
    height: 100%;
    margin: 0;
    padding: 0;
    font-family: 'Open Sans Condensed', sans-serif;
}

#menu ul li {
    height: 20%;
    text-align: center;
    width: 100%;
    float: left;

    line-height: 200%;
    /*	border-bottom:thin black solid;*/

}

#menu ul li a {
    display: block;
    color: black;
    text-decoration: none;
    height: 100%;
}

#menu ul li a:hover {
    color: white !important;
    background-color: #A23535 !important;
}

#backgroundtext {
    position: absolute;
    width: 80%;
    height: 45%;
    left: 7%;
    bottom: 20%;
    color: rgb(190, 158, 91);
    font-size: 1000%;
    font-family: 'Open Sans Condensed', sans-serif;
}

#backgroundtext img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

}