.gray {color:#777777;}.b-gray {background:#777777;}
.white{color:#FFFFFF;}.b-white {background:#FFFFFF;}
.yellow{color:#ffeb3b;}.b-yellow {background:#ffeb3b;}
.black{color:#000000;}.b-black {background:#000000;}
.red{color:#cc2036;}.b-red {background:#cc2036;}
.blue{color:#2054cc;}.b-blue {background:#2054cc;}
.light01 {color:rgba(255,255,255,.55)}
ul.menu li a {color:red;}
ul.menu li a {color:green;}

.example {
    width:1980px;
    height:40px;
    margin:0px auto;
 position:absolute;
 margin-bottom:60px;
 top:95px;
}

.menuholder {
    font: normal bold 11px/35px verdana, sans-serif;
    overflow: hidden;
    position: relative;
    width: fit-content;
    margin: 20px auto 10px;
    z-index: 1;
    float: left;
    
}
/*
.menuholder .shadow {
    -moz-box-shadow:0 0 20px rgba(0, 0, 0, 1);
    -o-box-shadow:0 0 20px rgba(0, 0, 0, 1);
    -webkit-box-shadow:0 0 20px rgba(0, 0, 0, 1);
    
    box-shadow:0 0 20px rgba(0, 0, 0, 1);
    height:10px;
    left:5%;
    position:absolute;
    top:-9px;
    width:100%;
    z-index:100;
}
*/
.menuholder .back {
  /* 
  -moz-transition-duration:.4s;
    -o-transition-duration:.4s;
    -webkit-transition-duration:.4s;
 */
  background-color:rgba(0, 0, 0, 0.08);
    height:0;
    width:980px; /*100%*/
}

.menuholder2:hover div.back {
    height:280px;
}
ul.menu {
    display: grid;
    /* float: left; */
    list-style: none;
    margin: auto;
    /* padding: 0 125px; */
    position: relative;
    text-align: center;
}

ul.menu li {
    float: left;
    margin: auto;
    padding: 5px;
    width: 240px;
}
ul.menu li {
    float:left;
    margin:0 10px 0 0;
}
ul.menu li > a{
    -moz-border-radius:0 0 10px 10px;
    -moz-box-shadow:2px 2px 4px rgba(0, 0, 0, 0.9);
    -moz-transition:all 0.3s ease-in-out;
    -o-border-radius:0 0 10px 10px;
    -o-box-shadow:2px 2px 4px rgba(0, 0, 0, 0.9);
    -o-transition:all 0.3s ease-in-out;
    -webkit-border-bottom-left-radius:10px;
    border-bottom-left-radius:10px;
    -webkit-border-bottom-right-radius:10px;
    border-bottom-right-radius:10px;
    -webkit-box-shadow:2px 2px 4px rgba(0, 0, 0, 0.9);
    -webkit-transition:all 0.3s ease-in-out;
    border-radius:0 0 10px 10px;
    box-shadow:2px 2px 4px rgba(0, 0, 0, 0.9);
    color:#eee;
    display:block;
    
    text-decoration:none;
    transition:all 0.3s ease-in-out;
}
ul.menu li > a {
    font-size:240px;
}

/*
ul.menu li a.red {
    background:#a00;
}
ul.menu li a.orange {
    background:#da0;
}
    background:#aa0;
}
ul.menu li a.green {
    background:#060;
}
*/
ul.menu li a.blue {
    background:#073263;
}
ul.menu li a {
    font-size: 18px;
    text-align: center;
}
ul.menu li a:hover {color:red;}
/*
ul.menu li a.violet {
    background:#682bc2;
}
*/
.menu li div.subs {
    left:0;
    overflow:hidden;
    position:absolute;
    top:35px;
    width:0;
}

.menu li div.subs dl {
    -moz-transition-duration:.2s;
    -o-transition-duration:.2s;
    -webkit-transition-duration:.2s;
    transition-duration:.2s;
    float:left;
    margin:0 130px 0 0;
    overflow:hidden;
    padding:40px 0 5% 2%;
    width:0;
}
.menu dt {
    color:#fc0;
    font-family:arial, sans-serif;
    font-size:12px;
    font-weight:700;
    height:20px;
    line-height:20px;
    margin:0;
    padding:0 0 0 10px;
    white-space:nowrap;
}
.menu dd {
    margin:0;
    padding:0;
    text-align:left;
}
.menu dd a {
    background:transparent;
    color:#fff;
    font-size:12px;
    height:20px;
    line-height:20px;
    padding:0 0 0 10px;
    text-align:left;
    white-space:nowrap;
    width:80px;
}
.menu dd a:hover {
    color:#fc0;
}
/*
.menu li:hover div.subs dl {
    -moz-transition-delay:0.2s;
    -o-transition-delay:0.2s;
    -webkit-transition-delay:0.2s;
    margin-right:2%;
    width:21%;
}
ul.menu li:hover > a,ul.menu li > a:hover {
    background:#aaa;
    color:#fff;
    padding:10px 10px 0;
}

ul.menu li a.red:hover,ul.menu li:hover a.red {
    background:#c00;
}
ul.menu li a.orange:hover,ul.menu li:hover a.orange {
    background:#fc0;
}
ul.menu li a.yellow:hover,ul.menu li:hover a.yellow {
    background:#cc0;
}
ul.menu li a.green:hover,ul.menu li:hover a.green {
    background:#080;
}
ul.menu li a.blue:hover,ul.menu li:hover a.blue {
    background:#00c;
}
ul.menu li a.violet:hover,ul.menu li:hover a.violet {
background:#8a2be2;
}
.menu li:hover div.subs,.menu li a:hover div.subs {
    width:100%;
  
  
}
*/
.menu-ikon , .menu-close{
    display: none;
    width: 70px;
    height: auto;

}


/*   mobil tall    */
@media only screen and (max-width: 800px) {
    p.hest {
      background-color: rgb(241, 241, 209);
      
    }
    
    body {
      width:auto;
     /* background-color: rgb(46, 30, 189);
     */ 
     border : 0px solid rgb(228, 207, 91);
      text-align: center;
      display: block;
    }
  
    div.hold {
      display: inline-block;
      width: auto;
      margin : auto;
      padding: 10px;
      border : 0px solid blueviolet;
    }
    
    .menu-ikon {
        display: block;
        width: 90px;
        height: auto;
        float: left;
        
    }
    
   
    /* new ul*/
    ul.menu {
        display: none;
    float: none;
    list-style: none;
    /* padding: 0 125px; */
    position: relative;
    text-align: center;
    }    
   
    
    ul.menu li {
        clear: both;
        margin: auto;
        padding: 5px;
        width:450px;

    }
    ul.menu li {
        float:left;
        margin:0 10px 0 0;
    }
    ul.menu li > a{
        color:#eee;
        font-size: 16px;
        
        
    }
    
    .menuholder {
        
        float:none;
        
    }
       
    /* new ul*/
    
  }
  /*css*/
  
  .susanne-img {
      position: relative;
      width:80%;
      max-width: 200px;
      margin:2px;

  }

  .body-head {
      border: 2px solid black;
  }
  .body-head2 {
    border: 2px solid black;
}

#info {
    display: none;
}

.footer {
    display: none;
    font-family: 'Roboto', sans-serif;
    font-size: 2.1rem;
    align-content: center;
    justify-content: space-between;
    align-items: center;
    justify-items: center;
    height: 20px;
}

.calcs {
   /*
   grid-column-gap: 2px;
   grid-row-gap: 2px;
   */
   display: grid;
   grid-template-columns: 1fr 1fr 1fr;
   grid-gap: 2px;
   grid-auto-rows: minmax(41px,auto);
   margin: 13px auto;
   justify-items: stretch;
   align-items: stretch;
   min-width: 385px;
   font-size: 20px;
   max-width: 780px;

}
.calcs > div {
    padding: 10px;
    text-align: center;
    color:white;
}


.calcs > div:nth-child(1) {
background-color: darkolivegreen;

    
    
}

.calcs > div:nth-child(1) {
grid-column: 1/4;
    
}
.run1 {
    background-color: #566672;
}
.run2 {
    background-color: #678b5a;
}
.run3 {
    background-color: #566672;
}

.run1:nth-child(odd) {
    background-color:#678b5a;
}
.run2:nth-child(odd) {
    background-color:#566672;
}
.run3:nth-child(odd) {
    background-color:#678b5a;
}
.num {
    background-color: teal;
}
.menu21 {
    /*
    grid-column-gap: 2px;
    grid-row-gap: 2px;
    */
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 6px;
    grid-auto-rows: minmax(34px,auto);
    margin: 13px auto;
    justify-items: start;
    align-items: center;
    min-width: 323px;
    /* font-size: 17px; */
    max-width: 780px;
    /* border: 1px solid black; */
    /* align-content: stretch; */
    /* justify-content: start; */
}
.menu2 > div a{
    padding: 8px;
    color: white;
    text-decoration: none;
    background: linear-gradient(177deg, rgba(0,212,255,1) 0%, rgba(27,27,136,1) 34%, rgba(18,87,174,1) 76%, rgba(0,212,255,1) 100%);
    font-family: "comic sans";
    font-size: 23px;
    border-radius: 10px;
    margin: 5px auto;

}
.menu21 > div {
    padding: 10px;
    text-align: left;
}

.menu2 {
    /*
    grid-column-gap: 2px;
    grid-row-gap: 2px;
    */
    
    /*
    grid-template-columns: 1fr;
    grid-gap: 6px;
    grid-auto-rows: minmax(34px,auto);
    margin: 13px auto;
    justify-items: start;
    align-items: center;
    
    */
    /* font-size: 17px; */
    min-width: 323px;
    /* border: 1px solid black; */
    /* align-content: stretch; */
    /* justify-content: start; */
    margin: 10px;
    display: flex;
    /* font-size: 17px; */
    /* min-width: 323px; */
    /* max-width: 780px; */
    /* border: 1px solid black; */
    align-content: center;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: center;
}

.menu2 > div {
    margin: 7px 4px;
}

.btn-block {
    padding-bottom: 20px;
}