* {
    margin:0;
    padding:0;
}

#logo {
    position:absolute;
    width:170px;
    margin: 20px 0 0 10px;
}

h2 {
    font-family: "teko", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
    margin: 30px auto 10px auto;
}

#drunter {
    color:rgb(44, 43, 43);
    font-family:Verdana, Geneva, Tahoma, sans-serif;
    line-height:140%;
    font-size: 1rem;
	-ms-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
}

body {
    background-image: url('../images/page.gif');
    background-repeat:repeat-y;    
}

nav {
    background-color:rgb(255, 255, 253);
    height:28px;
    top:0;
    text-transform:uppercase;
    font-family:Arial, Helvetica, sans-serif;
    position:sticky;
    padding-left:20px;
    margin-top:-5px;
    text-align:right;
}


nav li {
    line-height:100%;
    display:inline-block;
    list-style-type:none;
    margin:6px 20px 10px 0;
}

nav li:first-child {
    margin-left:20px;
}

li a {
    color:rgb(9, 77, 1);
    text-decoration:none;
}


main {
    position: absolute;
    left: 0;
    right:0;
    margin: 0 auto;
    background: #FFD800;
    max-width: 900px;
    min-height: 100%;
    height:auto !important;
    font-family: 'emerbienmedium', Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
    font-weight: normal;
    font-style: normal;
}

.produkt {
    max-width: 48%;
    /*padding: 15px 15px 0 15px;*/
    float:left;
}

#produkt-bild {
    max-width: 48%;
    margin: 15px 0 0 0;
    float:left;
}

.img-fit {
    max-width: 100%;
    object-fit: contain;
    margin: 0 auto;
}

.product-fit {
    max-width: 100%;
    object-fit: contain;
    margin: 0 auto;
}

#produkt-text {
    margin-left:15px;
}

@media only screen and (min-width: 200px) and (max-width:750px){
    main {
        min-width:500px;
    }
    .header-bild {
        width:100%;
        min-width:500px;
    }

    .produkt {
        width:95%;
        min-width:500px;
        max-width: 900px
    }

    #produkt-bild {
        max-width: 100%;
        margin-right:0;
        margin-left:15px;
    }

    li {
        margin:3px 5px 0 0;
    }
    nav {
        padding-left:20px; 
        min-width:500px; 
    }
}

footer {
    position:fixed;
    bottom:0;
    margin:0 auto;
    width: 100%;
    height: 70px;
    text-align:center;
    background-image: url('../images/mr-bien-footer.png');
    background-repeat:repeat-x;    
}

@font-face {
    font-family: "teko";
    src: url("/fonts/teko.ttf");
    src: url("/fonts/teco.ttf") format('truetype');
    font-weight: 400;
    font-style: normal;
}