/* ------------------------------------------- */
/*                    BODY                     */
/* ------------------------------------------- */
*, *::after, *::before {
    box-sizing: border-box;
    font-family: roboto, arial;
    line-height: 2;
    margin: 0; }
    
body 
{
 background-color: #4D4D4D;
 /*font-family: Verdana, Arial, Helvetica, sans-serif;*/
 overflow-x: hidden; 
}

/* ------------------------------------------- */
/*                   BANNER                    */
/* ------------------------------------------- */
#banner 
{
 height: 8em;
 background-image: url(/images/banner.jpg);
 background-position: bottom right;
 background-attachment: scroll;
 background-repeat: no-repeat;
}

@media only screen and (min-width : 1224px) {
    #banner {
        background-image: url(/images/banner-wide_1280x130.jpg);
    }
}

/* ------------------------------------------- */
/*                  TOPPMENY                   */
/* ------------------------------------------- */
#toppmeny 
{
 margin: 0;
 /*height: 3.2em;*/
 display: flex;
 flex-direction: column;
 list-style: none;
 background-color: #4D4D4D;
 background-repeat: no-repeat;
 font-family: Helvetica, 'Trebuchet MS', 'Lucida Grande',
	Verdana, Lucida, Geneva,
	Arial, sans-serif;
 font-weight: bold;
 font-size: 14px;
}


.innimeny 
{
 height: 3.2em;
 line-height: 3.2em;
 display: block;
 padding-left: 5em;
 padding-right: 5em;
 border-bottom-width: 1px;
 border-bottom-style: solid;
 border-bottom-color: Black;
 /*float: right;*/
 /*display: inline;*/
 background-color: #222222;
 font-family: Helvetica;
 text-align: center;
}
@media only screen and (min-width : 650px) {
    #toppmeny {
        height: 3.2em;
        display: flex;
        flex-direction: row;
        justify-content: flex-end;
        
    }
    .innimeny 
    {
        border-left-width: 1px;
        border-left-style: solid;
        border-left-color: Black;
        border-bottom: none;
    }
}

.innimeny:hover 
{
 background-color: #444444;
 text-decoration: none;
}

/* ------------------------------------------- */
/*                   LINKER                    */
/* ------------------------------------------- */
a:link 
{
 text-decoration: none;
 color: #76DEFC;
}

a:visited 
{
 text-decoration: none;
 color: #76DEFC;
}

a:active 
{
 text-decoration: none;
 color: #76DEFC;
}

div.klikkforbildelinkliste 
{
 position: relative;
 top: 12.9em;
 left: -11.9em;
 text-decoration: underline;
 float: left;
 font-size: smaller;
 margin-bottom: -1em;
}

/* ------------------------------------------- */
/*                   BILDER                    */
/* ------------------------------------------- */
img 
{
 border-style: none;
}

/*.bilde 
{
 padding-top: 1em;
 padding-right: 1.5em;
 padding-bottom: 0.5em;
 padding-left: 0.5em;
}*/





/* ------------------------------------------- */
/*              SKRIFTFORMATERING              */
/* ------------------------------------------- */
.u 
{
 text-decoration: underline;
}

h1 
{
 padding-left: 0;
 padding-top: 0.5em;
}
@media only screen and (min-width : 440px) {
    h1 {
        /*padding-left: 2.5em;*/
        padding-top: 1.5em;
    }
}

/* ------------------------------------------- */
/*             FORMATERING (TABELL)            */
/* ------------------------------------------- */

div.format 
{
 width: 100%;
 margin: auto;
 border-color: #999999;
 border-width: 3px;
 border-style: solid;
 line-height: 130%;
 color: White;
 background-color: #222222;
 padding: 0;
 box-sizing: border-box;
}




div.toppcontainer 
{
 color: white;
 clear: left;
 border-bottom-color: #999999;
 border-bottom-width: 3px;
 border-bottom-style: solid;
 padding: 0;
}



div.menycontainer 
{
 float: left;
 width: 9em;
 margin: 0;
 padding-right: 0;
 padding-bottom: 0;
 padding-left: 1em;
 background-color: #222222;
 height: 100%;
 font-size: 0.9em;
}

.hoyrecontainer 
{
 border-left-style: none;
 padding: 0 1em;
 /*background-color: #222222;*/
}
#produktside .menycontainer {
    width: 90%;
}

div.bunncontainer 
{
 color: white;
 clear: both;
 padding: 2em 0 0 2em;
}

@media only screen and (min-width : 820px) {
    div.format 
    {
        width: 50em;
        box-sizing: initial;
        line-height: 150%; 
        border-width: 0.5em;
    }
    div.menycontainer, #produktside div.menycontainer {
        width: 10em;
        font-size: 1em;
        padding-top: 1em;
        display: inline-block;
        float: left;
    }
    .hoyrecontainer {
        margin-left: 0.2em;
        float:right;
        display: inline-block;
        width: 38em;
    }
    div.toppcontainer {
        border-bottom-width: 0.5em;
    }
}
/* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
    div.format 
    {
        width: 60em;
    }
    .hoyrecontainer {
        width: 47em;
    }
}

/* Large screens ----------- */
@media only screen  and (min-width : 1824px) {
    div.format 
    {
        width: 70em;
    }
    .hoyrecontainer {
        width: 57em;
    }
}
/* ------------------------------------------- */
/*         FORMATERING (TABELL) SLUTT          */
/* ------------------------------------------- */