@import url('https://fonts.googleapis.com/css2?family=Stardos+Stencil:wght@700&display=swap');
body,
footer,
header,
nav,
section,
h1,
h2,
ul
{
    display: block;
}

ul {
  list-style:none;
  margin-left: 1em;
  line-height: 1.5em;
}

li::before {
    display:inline-block;
    content: "♫"; /* Insert content that looks like bullets */
    width:1.1em;
    margin-left: -1.5em;
    color:green;
  }

li {
  margin-top: 1em;
  margin-bottom: 1em;
}

/* kun basunicon i teksten */
.trb {
  display:inline-block;
  position:relative;
  height: 40px;
  width: 60px;
  vertical-align:top;
  }
/* kun basunicon i topnav */
.trblink {
  display:inline-block;
  margin-right:-12px;
  position:relative;
  height: 30px;
  width: 43px;
  vertical-align:top;
  }

img.trb {
  width: 66px;
  -webkit-filter: drop-shadow(3px 3px 1px #666666);
  filter: drop-shadow(3px 3px 1px #666666);
  }

h1
  {

    margin: 0;
    padding:1em .8em ;
    font-size: 1.45em;
    color:black;
    font-weight: lighter;
    background-color: #7be;
  }
h2
  {
    margin:0;
    padding:.5em 0 0 0;
    font-weight: normal;
  }
.logo
  {
  display: inline;
  font-size: xx-large ;
  font-weight: normal;
  }

.brand
  {
  display:inline-block;
  font-family: bbb;
  font-size:large;
  margin:0 3em 0 0em;
  padding:.5em 1em .3em 1.3em;
  color:gold;
  text-shadow:
  -1px -1px 1px navy, -1px 1px 1px navy, 1px -1px 1px navy,1px 1px 1px navy,
  -2px -2px 20px white, -2px 2px 30px white, 2px -2px 30px white,2px 2px 30px white;
  background-color:navy;
  border-radius: 2.2em;
  }

.pulter
  {
    display:inline-block;
    padding:2% 1.8em 4em 0;
   }

.loftgang
  {
    display:inline-flex;
  }

  @font-face {
     font-family: bbb;
     src: url(Adlanta-Light.woff);
  }
  @font-face {
     font-family: bbb;
     src: url(Adlanta.woff);
     font-weight: bold;
   }
 @font-face {
    font-family: sms;
    src: url(fontawesome-webfont.woff);
  }
@font-face {
    font-family: 'Saira Stencil One';
  }

body
	{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:small;
	font-weight: normal;
	padding:0;
	margin:0;
	text-align:left;
  background-color: white;
	}
.indhold
  {
    display: block;
    margin:1em 1em 1.5em 1em;
    padding-top: 1em;
  }
.afsnit
  {
    max-width: 44em;
    margin:1em 0em;
      }
.H1underrubrik
  {
    column-width: 21em ;
    column-fill: balance;
    column-gap: 4em;
    padding: 1.5em 1.2em;
    background-color: #7be;
  }
  .H1undertekst
    {
    margin:0 0 1em 0em ;
    padding:.5em 0em;
    color:black;
    font-weight: lighter;
    background-color: #7be;
    }

  .stempel
    {
      display:block  ;
      transform: rotate(30deg);
      margin:0 0.5em 0 10em !important;
      padding: 12px 6px !important;
      text-align: center !important;
      line-height: 14px;
      font-family: 'Saira Stencil One';
      font-size: 1em !important ;
      color:green !important;
      border-style:solid;
      border-color: green !important;
      border-width: thin;
      border-radius: 50% ;
        }

  .co2
    {
    display:inline;
    font-size:.6em !important;
        }

  .krone
    {
    display:block  ;
    margin:0;
    padding: 0 ;
    font-family: bbb;
    color:gold;
        }


  .ramme
    {
      display: inline-block;
      margin-bottom:1em;
      padding:1.5em .5em .5em 1em;
      color:gold;
      text-shadow:
      -1px -1px 1px navy, -1px 1px 1px navy, 1px -1px 1px navy,1px 1px 1px navy,
      -2px -2px 20px white, -2px 2px 30px white, 2px -2px 30px white,2px 2px 30px white;
      background-color:navy;
      border-radius: 1em;
      }
  .lilleramme
    {

      display: inline-block;
      margin:0 .1em 0 .8em;
      padding:.8em 1em .3em 1.3em;
      color:gold;
      text-shadow:
      -1px -1px 1px navy, -1px 1px 1px navy, 1px -1px 1px navy,1px 1px 1px navy,
      -2px -2px 20px white, -2px 2px 30px white, 2px -2px 30px white,2px 2px 30px white;
      background-color:navy;
      border-radius: 2.2em;
      }

  .iframe-container{
    position: relative;
    width: 100%;
    padding-bottom: 24em;
    height: 0;
  }
  .iframe-container iframe{
    position: absolute;
    top:0;
    left: 0;
    width: 43em;
    height: 24em;
    border: none;
  }

  .kontaktikoner{
    margin:0;
    display:inline-block;
    text-align: right;
    font-size: xx-large;
    }


  .handset{
    line-height:34px;
    font-family: sms;

  }

  .sms{
    line-height:34px;
    height:0px;
    font-family: sms;
    line-height:34px;

  }
  .kuvert{
    line-height:34px;
    font-family: sms;
    line-height:34px;

  }

  .menu{
    margin-right:4em;
  }



  /* topnav er hentet fra https://www.w3schools.com/howto/howto_js_topnav_responsive.asp
    Den rå topnav alene laver baserammen
    for menuen - dvs. den sætter baggrundsfarven.
  */

  .topnav
  {
    overflow: hidden;
    background-color: white;
    padding-top:2%;
    padding-bottom: 3%;
  }

/* Style the links inside the navigation bar */
  .topnav a {
    float:left;
    display:block;
    color: navy;
    text-align: left;
    padding:1.5% 36px 22px 36px;
    text-decoration: none;
    font-size: 1.4em;
  }
  /* Change the color of links on hover */
    .topnav a:hover {
      color: royalblue;
    }


/* Add an active class to highlight the current page */
  .topnav a.active {
    background-color: #111;
    color: grey;
  }

/* Hide the link that should open and close the topnav
on small screens */
  .topnav .icon {
    display: none;
  }


.footer    {
	 display: inline-block;
		font-weight:normal;
    bottom: 0;
    text-align: center;
    clear: both;
    float: left;
    width: 100%;
    line-height: 2em;
    background-color:navy;
    color: white;
    padding: 0.8em 0 2.7em 0;
    margin-left: auto;
    margin-right: auto;
    }
.tot {
    color: white;
    text-align: center;
    font-weight:100;
    display:inline-block;
    margin: 0 3%;
        }
.tol {

		text-align: center;
		display:inline-block;
        }

.nylinje{

    padding: 1em;
        }

/* Her angives farven på hamburgeren, når der klikkes på den */
a:active {
  background-color: white;
  color: aquamarine  !important;}

a.linkwhite:link,a.linkwhite:visited,hover,focus,active
 	{
	color:white;
    text-decoration: none;
	text-transform: none;
	}

a.linkblaaudenstreg:link {
	color:black;
	text-decoration: none;
	font-weight: normal;
	text-transform: none;
	font-size:12px;
  background-color: gold;
	}

a.linkblaastor:link {
  color:navy;
	text-decoration: none;
	font-weight: normal;
	text-transform: none;
  border-radius: 4em;
  padding:.5em;
  	}
a.linkblaastor:visited {		text-transform: inherit;font-weight: normal; color: black; text-decoration: none;}
a.linkblaastor:hover {		text-transform: inherit;font-weight: normal; color:white; background-color:navy; text-decoration: none; }

.bluemailknap
        {
    position: relative;
    top: 3px;
    height: 14px;
    width: 160px;
        	}
.mailknapt
        {
    display: none;
    visibility: collapse;
    position: relative;
    top: -330px;
    margin-left: 25px;
    height: 14px;
    width: 140px;
    clear: both;
    	}


@media (pointer: coarse)and (hover: none)
{

.brand {font-size: large;}

/* gælder kun for linket i teksten - ikke topnavlinket*/
  .trb {
    display:none;
    }

/* gælder kun for  topnavlinket   - ikkel inket i teksten*/
  .trblink {
    display:inline-block;
    position:relative;
    height: 22px;
    width: 35px;
    vertical-align:top;
    }


  a.linke:link,  :visited {
    display:inline;
      color:black;
      text-decoration:none;
      font-weight:100;
      text-transform:none;
      background-color:
      rgba(173, 173, 173, 0.7 );
      padding:8px ;
      border-style:none;
      border-color:royalblue;
      border-width:1px;
      border-radius:10px;
      line-height:19px;}


  .topnav a {
      float:left;
      display:block;
      color: navy;
      text-align: left;
      margin:0 0 1em 1em;
      padding:10px 26px 12px 26px;
      border-style:outset;
      border-color: silver;
      border-width: 1px;
      border-spacing: 7px;
      border-radius:7px;
      text-decoration: none;
      background-color: #cccccc;
      font-size: 1.4em;
        }

      .topnav.responsive
      {
        padding-top:1em;
        background-color:black !important;
        z-index: 100;
      }

      .topnav.responsive .icon {
        position: absolute;
        background-color: black !important;
        color:aquamarine;
        right: 0;
        top: 0;
        padding-top: 1em;
      }
      /*Her formateres menuens elementer*/
      .topnav.responsive a {
        float: none;
        display: block;
        text-align: left;
        background-color: black !important;
        border-style: none;
        color:white;
      z-index: 100;
      }
      .topnav.responsive a:hover {
        float: none;
        display: block;
        text-align: left;
        color:royalblue;
            z-index: 100;
      }


.stempel
        {
      display:block  ;
      transform: rotate(30deg);
      margin:0 0.5em 0 10em !important;
      padding: 12px 6px !important;
      text-align: center !important;
      line-height: 14px;
      font-family: 'Saira Stencil One';
      font-size: 1em !important ;
      color:green !important;
      border-style:ridge !important;
      border-color: lime green green lime !important;
      border-width: 1px !important;
      border-radius: 50% !important;
            }

        }



@media screen and (max-width: 1200px)
{
  .bluemailknap
        {
    position: relative;
    top: 2.5px;
    height: 13px; /* 18px */
    width: 145px; /* 120px */
        	}
    .footer    {
    font-weight:normal;
    font-size: small;
    }
.toe    {
	white-space: nowrap;
    font-size: inherit;
    margin-left: 0px;
    margin-right: 0px;
    }


}
@media screen and (max-width: 880px)
{

.footer    {

    bottom: 0;
    font-size:large;
    text-align: center;
    clear: both;
    float: left;
    width: 100%;
    line-height: 2em;
    background-color: navy;
    color: white;
    padding: 0.8em 0 2.7em 0;
    margin-left: auto;
    margin-right: auto;
    }




}


@media screen and (max-width: 896px)
{
  .bluemailknap
      {
  position: relative;
  top: 3px;
  height: 18px;
  width: 200px;
      	}
}
@media screen and (max-width: 750px)
{
}
@media screen and (max-width: 600px)
{
  body
  	{
  	font-size:.9em;
  	}


  .brand
    {
    font-size:2em;
    }

  a.linke:link,  :visited {
    display:inline;
    color:black;
    text-decoration:none;
    font-weight:100;
    text-transform:none;
    background-color:
    rgba(173, 173, 173, 0.7 );
    padding:8px ;
    border-style:none;
    border-color:royalblue;
    border-width:1px;
    border-radius:10px;
    line-height:19px;}

  .iframe-container{
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
    height: 0;
  }
  .iframe-container iframe{
    position: absolute;
    top:0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .pulter
  {
    padding:1em 1.8em 1.5em 0;
  }

  .stempel
    {
     border-radius: 15px !important;
     border-style: ridge !important;
     border-color: green !important;
     border-width: 1px !important;
     }

  .topnav
    {
      position:absolute;
      padding-top:0px;
      right:0;
      overflow: hidden;
      color:royalblue;
    }

  /* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home").
  Show the link that contains should open and close the topnav (.icon) */
    .topnav a:not(:first-child) {display: none;}
  /* Skjuler logo (som er second child) når ikke responsive */
    .topnav a:not(:nth-of-type(2)) {display: none;}

    /* Hamburgerens farver sættes her når ikke responsive */
    .topnav a:last-child {color: royalblue !important}

    .topnav a.icon {
      float: right;
      display: block;
      padding: 1em 1em 0 0;
      color:black;
      border-style: none;
      background-color: white;
      z-index: 100;
    }

  /* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon.
  This class makes the topnav look good on small screens
  (display the links vertically instead of horizontally) */
      .topnav.responsive
  {
    padding-top:1em;
    background-color:black;
    z-index: 100;
  }
  .topnav.responsive .icon {
    position: absolute;
    background-color: black;
    color: royalblue !important; text-shadow: 2px 2px navy !important;
    right: 0;
    top: 0;
    padding-top: 1em;
  }
  /*Her formateres menuens elementer*/
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
    color:white;
  z-index: 100;
  }
  .topnav.responsive a:hover {
    float: none;
    display: block;
    text-align: left;
    color:royalblue;
        z-index: 100;
  }
}
@media only screen and (max-width : 514px)
{
.bluemailknap
        {
    position: relative;
    top: 3px;
    height: 18px;
    width: 200px;
        	}

.footer    {
	display: inline-block;
		font-weight:normal;
    bottom: 0;
    text-align: center;
    clear: both;
    float: left;
    width: 100%;
    line-height: 2em;
    background-color: navy;
    color: white;
    padding: 0.8em 0 2.7em 0;
    margin-left: auto;
    margin-right: auto;
    }
  }


@media only screen and (max-width : 320px)
{
  .bluemailknap
  	        {
  	    position: relative;
  	    top: 3px;
  	    height: 17px;
  	    width: 200px;
  	        	}
}
/*Congratulations! No Error Found.*/
