@font-face {
	font-family: Manksans;
	src: url('fonts/MankSans-Medium.ttf');
}

*{
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

body
{
	background-image:url('graphics/debut_dark.png');
	text-align: center;
	font-family: Georgia;
	font-size:16px;
	color:white;
}

#box {
	margin-top:30px;
	border:1px; 
	background-color: black; 
	min-height: 400px; 
	width: 600px; 
	padding: 10px; 
	margin-right: auto; 
	margin-left: auto;
	padding-bottom:50px;
}

div.botright{
    font-size:15px;
    display:block;
    width:360px;   
    text-align:center;
    width:90%;
    margin:auto;
    margin-top:10px;
    color:grey;
}

.meny a{ 
	text-decoration: none; color:grey; font-size:30px; font-family: "Futura";
}
.meny{
	margin:0;
	padding:0;
	display:block;
	overflow:auto;
	width:330px;
	margin:auto;
	margin-top:20px;
	margin-bottom:20px;
}

.menuitem{
	float:left;
	margin-left:30px;
	list-style:none;
}

.menuitem a:hover { 
	color: white; text-decoration: none; 
}
.menuitem a#current{
	color: white;
}

.maillink{
	color:grey;
	font-size:20px;
}

@media screen and (max-width: 470px) {
    #box {
        width:100%;
        margin:0;
        padding:10px 15px;
      	min-height: 500px; 

    }
    #box img{
    	width:100%;
    }
    body{
    	font-size:22px;
    }
    .meny{
    	background:lightgrey;
    	width:110%;
    	margin-left:-10%;
    }
    .menuitem a{
    	font-size:32px;
    }
}
@media screen and (max-width: 400px) {
    #box{
    	padding-bottom:10%;
    }
    .meny{
    	background:none;
    	width:100%;
    	overflow:auto;
    	margin:0;
    	margin-bottom:20px;
    	padding:0;

    }
    .menuitem{
    	width:100%;
    	clear:both;
        text-align:center;
        background:lightgrey;
        margin:0px;
        margin-top:10px;

    }
    .menuitem a{
    	display:block;
    	width:100%;
    	font-size:30px;
    }
}