#svgimgss{
  width: 100%;
}


*{
  margin: 0;
  padding: 0;
}

#langSV h2{
  animation: 5s fade2123 ease-in;
}
#langEN h2{
  animation: 5s fade2123 ease-in;
}
@keyframes fade2123 {
  from{
    opacity: 0;
  }

  to{
    opacity: 1;
  }
}
.fade{
  opacity: 1;
}
.textHead{
  display: flex;
  position: absolute;
  top:97%;
  left: 97%;
  transform: translate(-97%,-97%);
  text-align: center;
  font-size: 10px;
  width: 200px;
  letter-spacing: 1px;
}

.slider{
  width: 100%;
  min-height: 80vh;
  border-radius: 10px;
  overflow: hidden;
}

.slides{
  width: 500%;
  height: 500px;
  display: flex;
}

.slides input{
  display: none;
}

.slide{
  width: 20%;
  transition: 2s;
}
@keyframes zoom {
  0%{
    transform: scale(1.1);
    }15%{
      transform: scale(1);
      }85%{
        transform: scale(1);
        }100%{
          transform: scale(1);
        }
      }

      .slide img{
        width: 100%;
        min-height: auto;

      }

      /*css for manual slide navigation*/

      .navigation-manual{
        position: relative;
        width: 800px;
        margin-top: -40px;
        display: flex;
        justify-content: center;
        visibility: hidden;
      }

      .manual-btn{
        border: 2px solid #40D3DC;
        padding: 5px;
        border-radius: 10px;
        cursor: pointer;
        transition: 1s;
        visibility: hidden;
      }

      .manual-btn:not(:last-child){
        margin-right: 40px;
      }

      .manual-btn:hover{
        background: #40D3DC;
      }

      #radio1:checked ~ .first{
        margin-left: 0;
      }

      #radio2:checked ~ .first{
        margin-left: -20%;
      }

      #radio3:checked ~ .first{
        margin-left: -40%;
      }

      #radio4:checked ~ .first{
        margin-left: -60%;
      }

      /*css for automatic navigation*/

      .navigation-auto{
        position: absolute;
        display: flex;
        width: 800px;
        justify-content: center;
        margin-top: 460px;
        visibility: hidden;
      }

      .navigation-auto div{
        border: 2px solid #40D3DC;
        padding: 5px;
        border-radius: 10px;
        transition: 1s;
      }

      .navigation-auto div:not(:last-child){
        margin-right: 40px;
      }

      #radio1:checked ~ .navigation-auto .auto-btn1{
        background: #40D3DC;
      }

      #radio2:checked ~ .navigation-auto .auto-btn2{
        background: #40D3DC;
      }

      #radio3:checked ~ .navigation-auto .auto-btn3{
        background: #40D3DC;
      }

      #radio4:checked ~ .navigation-auto .auto-btn4{
        background: #40D3DC;
      }

      .blopp{
        width: 100%;
        height: 50px;
      }

      @import url('https://cdn-uicons.flaticon.com/uicons-regular-rounded/css/uicons-regular-rounded.css');
      @import url('https://fonts.cdnfonts.com/css/gotham');
      @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

      body{
        line-height: 1.5;
        font-family: 'Broadsheet LDO', sans-serif;
        animation: 1s fade2123 ease-in;
        overflow-x: hidden;
      }
      *{
        margin:0;
        padding:0;
        box-sizing: border-box;
      }

      .dropbtn {
        color:white;
        text-decoration: none;
        z-index: 1000;
        font-size: 16px;
      }

      .dropdown :hover{
        //color:#E89402;
        color: #a81b2a;
        transition: 0.4s all ease;
        z-index: 100;
        border-radius: 4px;
      }

      .dropdown-content {
        transition: 2.4s all ;
        display: none;
        position: absolute;
        background-color: white;
        min-width: 160px;
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
        z-index: 10;
        border-radius: 5px;
        font-size: 15px;
        animation: growDown 0.5s ease-in-out forwards;
        transform-origin: top center;
        z-index: 100;
        font-style: oblique;
        padding: 10px;
      }
      @keyframes growDown {
        0% {
          transform: rotateX(-90deg)
        }
        70% {
          transform: rotateX(20deg)
        }
        100% {
          transform: rotateX(0deg)
        }
      }

      @keyframes fade {
        from{
          visibility: collapse;
        }
        to{
          visibility: visible;
        }
      }

      /* Links inside the dropdown */
      .dropdown-content a {
        color: black;
        opacity: 0.8;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
      }

      /* Change color of dropdown links on hover */
      .dropdown-content a:hover {
        //background-color: #24262b;
        //color: #E89402;
        color: #a81b2a;
        opacity: 1;
        transition: 0.3s all ease;
      }
      .dropdown-content  a:after {
        background: none repeat scroll 0 0 transparent;
        bottom: 1;
        content: "";
        display: block;
        height: 2px;
        left: 40%;
        position: absolute;
        background: #a81b2a;
        transition: width 0.3s ease 0s, left 0.3s ease 0s;
        width: 0;
        margin:10px;
        z-index: 10000;
      }
      .dropdown-content a:hover:after {
        width: 79%;
        left: 5%;
      }

      /* Show the dropdown menu on hover */
      .dropdown:hover .dropdown-content{
        display: block;
        z-index: 100;
        transition: 1s all ease;
      }


      #nav{

        width: 100%;
        height: 70px;
        font-size: 20px;

        color: white;
        position: fixed;
        transition: 1s all ease;
        z-index: 100;
      }

      #navlogo{
        position: absolute;
        top: 22px;
        left: 20px;
        width: 240px;
        transition: 2s ease;
      }
      #navlogo img{
        width: 100%;

      }


      .nav-links{
        width: 100%;
        height: 70px;
        padding-left: 20%;
        padding-right: 5%;
        display: flex;
        justify-content: space-between;
        align-items:center;
        z-index: 100;

      }

      .nav-links li{
        list-style: none;
        z-index: 100;
      }

      a{
        color:white;
        text-decoration: none;
      }


      header{
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-image: url("copypaste.jpeg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        color: white;
        filter: brightness(70%);
      }

      @keyframes scroll {
        from{
          height: 100vh;
        }
        to{
          height: 70vh;
        }
      }


      #header{
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        color: white;
      }
      #headermovie{
        //position: fixed;
        z-index: -1;
        filter: brightness(0.69);
      }

      @media (min-aspect-ratio: 16/9) {
        #headermovie {
          width:100%;
          height: auto;
        }
      }

      @media (max-aspect-ratio: 16/9) {
        #headermovie {
          width:auto;
          height: 100%;
        }
      }
      @media (max-width: 767px) {
        #headermovie {
          display: none;
        }
        #header {
          background-image: url("word.jpg");
          background-repeat: no-repeat;
          background-size: cover;
          background-position: center center;
          background-attachment: fixed;
        }
      }



      #headerstandard{
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-image: url("imgs/crisp.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        color: white;
        filter: brightness(70%);
      }
      #headerdeluxe{
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-image: url("imgs/crisp2.jpeg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        color: white;
        filter: brightness(70%);
      }
      #headerLandA{
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-image: url("imgs/location.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        color: white;
        filter: brightness(70%);
      }
      #headerHistory{
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-image: url("imgs/history.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        color: white;
        filter: brightness(70%);
      }
      #headerActivities{
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-image: url("imgs/navernasan.jpeg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        color: white;
      }
      #headerSaF{
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-image: url("imgs/servicesaf.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        color: white;
        filter: brightness(80%);
      }

      #headerAlFresco{
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-image: url("resturant.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        color: white;
        //filter: brightness(0%);
      }
      #headeroevent{
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-image: url("nam.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        color: white;
        filter: brightness(70%);
      }
      #headeryevent{
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-image: url("yevent.jpeg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        color: white;
        filter: brightness(65%);
      }
      #headerSpa{
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-image: url("spa.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        color: white;
        filter: brightness(80%);
      }
      #headertreatment{
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-image: url("treatmentimg.webp");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        color: white;
        filter: brightness(80%);
      }
      #headerofferings{
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-image: url("conmeet.jpeg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        color: white;
        filter: brightness(60%);
      }


      #headerBooking{
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-image: url("word.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        color: white;
        filter: brightness(80%);
      }

      #headerPartners{
        width: 100%;
        height: 100vh;
        display: flex;
        justify-content: center;
        align-items: center;
        background-image: url("imgs/partnersHeader.jpeg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        color: white;
        filter: brightness(80%);
      }

      #sirvoy{
        width: 90%;
        margin: auto;
        position: relative;
        margin-bottom: 10vh;
        margin-top: 5vh;
      }

      main{
        width: 100%;
        background-color: #e8e6e7;
        padding: 5%;
      }
      .galleri{
        display: grid;
        grid-template-columns: repeat(2, 40% 60%);
        grid-column-gap: 20px;
        grid-row-gap: 20px;
        //padding: 20px;
        background-color: white;
      }

      .galleri img{
        width: 100%;
      }

      .galleri2{
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        min-height: 60vh;
      }
      .galleri2 img{
        width: 100%;
      }
      /* relevant styles */
      .img__wrap {
        width: 100%;
      }
      .img__wrap img {
        height: 100%;
      }

      .img__wrap2 {
        display: grid;
        position: relative;
        background-color: white;
        background-image: url("dator_fjall.jpg");
        background-size: cover;
        background-color: black;
        height: 100%;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
      }
      .img__wrap3 {
        display: grid;
        position: relative;
        background-color: white;
        background-image: url("dronare_in_action.jpg");
        background-position: center;
        background-size: cover;
        background-color: black;
        height: 100%;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
      }
      .img__wrap4 {
        display: grid;
        position: relative;
        background-color: white;
        background-image: url("canon.jpeg");
        background-size: cover;
        background-color: black;
        height: 100%;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
      }
      .textimg{
        text-align: center;
        color: white;
        padding: 10%;
      }
      .textimg .span{
        padding: 5%;
      }
      .textimg h1{
        font-style: oblique;
      }
      .textimg #learnBtn{
        transform: scale(0.8);
      }
      .img__wrap2 h1{
        text-align: center;
      }

      .text__wrap {
        padding: 50px;
        display: grid;
        position: relative;
      }


      .heading h1{
        font-size: 37px;
        text-align: center;
        padding: 5%;
      }
      .heading h2{
        font-size: 29px;
        text-align: center;
        padding: 5%;
      }
      .heading{
        display: flex;
        justify-content: center;
        font-style: oblique;
      }

      .lineh{
        background-color: #a81b2a;
        width: 15%;
        height: 2px;
        margin-top: 7%;

      }

      #mer{
        text-align: center;
        margin-top: -60px;
        padding-bottom: 50px;
      }
      #restimg{
        background-image: url("marsliden2.jpg");
        background-attachment: fixed;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        width: 100%;
        min-height: 80vh;
        filter: brightness(0.9);

      }
      #textimgres{
        text-align: center;
        padding-top: 120px;
        font-size: 23px;
        color: white;
      }

      #textimgres button{
        margin-top: 35px;
      }




      #learnBtn{
        cursor: pointer;
        overflow: hidden;
        outline: none;
        position: relative;
        letter-spacing: 0.1em;
        font-weight: 400;
        padding: 1rem 2rem 1rem 2rem;
        text-transform: uppercase;
        font-size: 17px;
        font-family: 'Broadsheet LDO', sans-serif;
      }

      .btn-bg.bg-2 .btn-2 button {
        color: rgba(0, 0, 0, 1);
        background: rgba(255, 255, 255, 0.75);
        border: none;
        -webkit-transition: all 0.7s;
        transition: all 0.7s;
      }
      .btn-bg.bg-2 .btn-2 button:hover {
        background: transparent;
        color: #fff;
      }
      .btn-bg.bg-2 .btn-2 button:hover:before,
      .btn-bg.bg-2 .btn-2 button:hover:after {
        -webkit-transition: all 0.7s;
        transition: all 0.7s;
        width: 100%;
      }
      .btn-bg.bg-2 .btn-2 button:before,
      .btn-bg.bg-2 .btn-2 button:after {
        content: '';
        position: absolute;
        top: 0;
        left: 0px;
        width: 0px;
        height: 3px;
        background: #a81b2a;
        transition: all 0.4s;
      }
      .btn-bg.bg-2 .btn-2 button:after {
        top: inherit;
        left: inherit;
        bottom: 0;
        right: 0;
      }

       #learnBtn:active {
        transform: translateY(20px);
      }




      .galleriSpa{
        display: grid;
        grid-template-columns: 1fr  1fr 1fr;
        grid-template-rows: 50% 50% ;
        //grid-gap: 20px;
        width: 100%;


      }

      #imgspa{
        grid-column: 1/3;
        grid-row: 1/4;

      }
      #imgspa span{
        color: white;
        z-index: 100;
      }

      #imgspa img{
        width: 100%;
        min-height: 100%;
      }

      #imgspa2{
        grid-column: 3/4;
        grid-row: 1/3;
      }

      #imgspa2 img{
        width: 100%;
        min-height: 100%;
      }

      #imgspa3{
        grid-column: 3/4;
        grid-row: 2/3;
      }

      #imgspa3 img{
        width: 100%;
        min-height: 100%;
      }

      #imgspa4{
        grid-column: 2/4;
        grid-row: 1/3;
      }

      #imgspa4 img{
        width: 100%;
        min-height: 100%;
      }
      #imgspa5{
        grid-column: 1/2;
        grid-row: 1/3;
      }

      #imgspa5 img{
        width: 100%;
        min-height: 100%;
      }

      #contentevent{
        width: 90%;

        margin: auto;
        background-color: #e8e6e7;
      }

      .galleriEvent{
        display: grid;
        grid-template-columns: 1fr  1fr;
        grid-template-rows: 50% 50% ;
        width: 100%;
        padding: 40px;
      }
      .textbox{
        grid-column: 1/2;
        grid-row: 1/2;
        padding: 40px;
      }
      .imgEvent{
        grid-column: 2/3;
        grid-row: 1/2;
      }
      .imgEvent img{
        width: 100%;
        min-height: 100%;
      }
      .textbox2{
        grid-column: 2/3;
        grid-row: 1/2;
        padding: 40px;
      }
      .imgEvent2{
        grid-column: 1/2;
        grid-row: 1/2;
      }
      .imgEvent2 img{
        width: 100%;
        min-height: 100%;
      }
      #pageName{
        background-color: #24262b;
        width: 100%;
        text-align: center;
        margin: auto;
        //padding: 2vh;
        color: white;
        transition: all 2s ease;

      }
      #pageName img{
        width: 100%;
        position: relative;
        top:40px;
        left:0;
        padding: 0;

      }
      #pageName P{
        font-style: italic;
        font-weight: 400;
        font-size: 13px;
      }
      #pageName2{
        background-color: #24262b;
        width: 100%;
        text-align: center;
        padding: 2vh;
        color: white;
        transition: all 1s ease;
        z-index: 1;
        letter-spacing: 7px;
        //font-style: italic;
        font-size: 21px;
        margin-top: 0px;
        font-weight: 100;
        z-index: 10;
      }
      #pageName2 h1{
        font-weight: 100;
        z-index: 1;
      }
      #lines{
        height: 1px;
      }

      svg{
        //background-color: #24262b;
        width: 100%;
        margin-top: -1px;
      }
      #wave2{
        margin-bottom: -10px;
      }
      #svgimg{
        background-image: url("copypaste2.jpeg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        //background-attachment: fixed;
        height: 120vh;
        z-index: -10;
        margin-top: -14%;
      }

      .sticky{
        position: sticky;
        top: 71px;
      }
      .sticky + body{
        //padding-top: 60px;
      }


      #bookBtn {
        font-family: 'Broadsheet LDO', sans-serif;
        padding: 15px 40px;
        margin-top: 20px;
        margin: 20px;
        background: none;
        border: none;
        color: white;
        position: relative;
        text-transform: uppercase;
        //font-weight: bold;
        letter-spacing: 3px;
        cursor: pointer; }
        #bookBtn:after, #bookBtn:before {
          content: '';
          position: absolute;
          top: 0;
          left: 0;
          bottom: 0;
          right: 0;
          border: 2px solid #fff;
          opacity: 0.8;
          transition: transform .2s;
          border-radius: 30px; }
        #bookBtn:after {
          transform: translate(3px, 3px); }
        #bookBtn:before {
          transform: translate(-3px, -3px); }
        #bookBtn:hover:after, #bookBtn:hover:before {
          transform: translate(0); }

      #bookBtn:active{
        transform: translate(1px, 1px);
      }

      #bookBtn:focus:after, #bookBtn:focus:before {
        border: 2px solid #a81b2a;
        transition: 0.1s;
      }


      #bookBtn2{
        width: 200px;
        height: 40px;
        color: white;
        border: 2px solid white;
        border-radius: 25px;
        background-color: #24262b;
        margin: 1rem;
        font-size: 17px;
        transition: all 2s ease;
        font-family: 'Broadsheet LDO', sans-serif;
      }


      #bookBtn2:hover{
        color: #E89402;
        border: 2px solid #E89402;
        transition: all 0.3s ease;
        cursor: pointer;
      }

      .container{
        max-width: 1170px;
        margin:auto;
      }

      .row{
        display: flex;
        flex-wrap: wrap;
      }

      #conference{
        //background-color: #e8e7e5;
        scroll-margin: 17vh;
      }

      #lastgal{
        display: grid;
        grid-template-columns: 1fr  1fr 1fr 1fr;
        grid-template-rows: 25% 25% 25%;
        width: 100%;
        //grid-gap: 17px;
        //margin: auto;
        margin-bottom: -29%;
      }
      .img1{
        grid-column: 1/4;
        grid-row: 1/2;
        overflow: hidden;
      }
      .img1 img{
        width: 100%;
        min-height: 100%;
        transition: all 0.5s ease ;
      }
      .img1 img:hover{
        transition: all 0.5s ease ;
        transform: scale(1.05);
      }

      .img2{
        grid-column: 4/5;
        grid-row: 1/2;
        background-color:black;
        overflow: hidden;
      }
      .img2 img{
        width: 100%;
        min-height: 100%;
        transition: all 0.5s ease;
      }
      .img2 img:hover{
        transition: all 0.5s ease ;
        transform: scale(1.05);
      }

      .img3{
        grid-column: 1/3;
        grid-row: 2/4;
        background-color:black;
        overflow: hidden;
      }
      .img3 img{
        width: 100%;
        min-height: 100%;
        transition: all 0.5s ease;
      }
      .img3 img:hover{
        transition: all 0.5s ease ;
        transform: scale(1.05);
      }

      .img4{
        grid-column: 3/5;
        grid-row: 2/3;
        background-color:black;
        overflow: hidden;
      }
      .img4 img{
        width: 100%;
        min-height: 100%;
        transition: all 0.5s ease;
      }
      .img4 img:hover{
        transition: all 0.5s ease ;
        transform: scale(1.05);
      }

      .img5{
        grid-column: 3/5;
        grid-row: 3/4;
        background-color:black;
        overflow: hidden;
      }
      .img5 img{
        width: 100%;
        min-height: 100%;
        transition: all 0.5s ease;
      }
      .img5 img:hover{
        transition: all 0.5s ease;
        transform: scale(1.05);
      }

      #galService{
        display: grid;
        grid-template-columns: 1fr  1fr 1fr 1fr 1fr 1fr 1fr;
        grid-template-rows: 33% 33% 33%;
        width: 100%;
        height: 200vh;
        grid-gap: 50px;
        margin: auto;
        //margin-bottom: -100px;
        padding: 40px;
        margin-bottom: 90px;
      }
      #galService2{
        display: grid;
        grid-template-columns: 1fr  1fr 1fr 1fr 1fr 1fr 1fr;
        grid-template-rows: 33% 33% 33%;
        width: 100%;
        height: 200vh;
        grid-gap: 50px;
        margin: auto;
        padding: 40px;
        padding-bottom: 120px;
        background-image: url("imgs/spa-lake.jpg");
        background-attachment: fixed;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        color: white;
        margin-top: -173px;
      }
      #galService3{
        display: grid;
        grid-template-columns: 1fr  1fr 1fr 1fr 1fr 1fr 1fr;
        grid-template-rows: 33% 33% 33%;
        width: 100%;
        height: 225vh;
        grid-gap: 50px;
        margin: auto;
        padding: 40px;
        padding-bottom: 260px;
        background-image: url("imgs/spa-lake.jpg");
        background-attachment: fixed;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        color: white;
      }
      #wave3{
        margin-top: -173px;
        margin-bottom: -10px;
      }
      #wave4{
        margin-bottom: -173px;
      }
      #marginColor{
        background-color: #f4f4f4;
        height: 120px;
        width: 100%;
      }
      #spaimg{
        background-image: url("imgs/spa-lake.jpg");
        background-attachment: fixed;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        width: 100%;
        min-height: 70vh;
      }

      .farg{
        background-color: #e8e7e5;
        padding-bottom: 1px;
      }

      .textfac1{
        grid-column: 1/4;
        grid-row: 1/2;
        padding: 20px;
        line-height: 30px;
        padding-top: 100px;
      }

      .imgs2{
        grid-column: 4/8;
        grid-row: 1/2;
        overflow: hidden;
        padding-top: 60px;
      }
      .imgs2 img{
        width: 100%;
        min-height: 100%;
        transition: all 0.5s ease;
      }
      .imgs2 img:hover{
        transition: all 0.5s ease ;
        transform: scale(1.05);
      }


      .textfac1-3{
        grid-column: 1/4;
        grid-row: 1/2;
        padding: 20px;
        line-height: 30px;
      }

      .imgs2-3{
        grid-column: 4/8;
        grid-row: 1/2;
        overflow: hidden;
      }
      .imgs2-3 img{
        width: 100%;
        min-height: 100%;
        transition: all 0.5s ease;
      }
      .imgs2-3 img:hover{
        transition: all 0.5s ease ;
        transform: scale(1.05);
      }

      .imgs3{
        grid-column: 1/5;
        grid-row: 2/3;
        background-color:black;
        overflow: hidden;
      }
      .imgs3 img{
        width: 100%;
        min-height: 100%;
        transition: all 0.5s ease;
      }
      .imgs3 img:hover{
        transition: all 0.5s ease ;
        transform: scale(1.05);
      }

      .textfac2{
        grid-column: 5/8;
        grid-row: 2/3;

        padding: 20px;
        line-height: 30px;
      }

      .textfac3{
        grid-column: 1/4;
        grid-row: 3/4;

        padding: 20px;
        line-height: 30px;
      }

      .imgs6{
        grid-column: 4/8;
        grid-row: 3/4;
        background-color:black;
        overflow: hidden;
      }
      .imgs6 img{
        width: 100%;
        min-height: 100%;
        transition: all 0.5s ease;
      }
      .imgs6 img:hover{
        transition: all 0.5s ease;
        transform: scale(1.05);
      }

      ul{
        list-style: none;
      }

      footer{
        background-color: #24262b;
        padding: 70px 0;
      }
      .color{
        background-color: #24262b;
      }
      .footermedia{
        width: 100%;
        background-color: #e8e7e5;
        padding: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .media{
        width: 12rem;
        padding: 10px;
        margin-left: 1.5%;
        font-size: 20px;
        text-align: center;
        color: #E89402;
      }
      .media embed{
        width: 100%;
      }
      .media2{

        color: white;
        margin-left: 50px;
        line-height: 30px;
        font-size: 14px
      }
      .media2 span{
        font-size: 19px;
        padding: 0px;
      }
      .media2 a{
        color: black;
      }
      .media2:hover a{
        color: #E89402;
      }
      .media3{
        justify-content: space-around;
        display: flex;
        margin-left: 100px;
        font-size: 15px;
        text-align: center;

      }

      .mediaflex{
        padding-right: 70px;

      }

      .mediaflex a{
        color: #6E6E6E;
      }

      .mediaflex:hover a{
        color: rgba(0,0,0,1);
      }
      .headingTeam{
        padding: 40px;
        text-align: center;
        background-color: #f4f4f4;
        z-index: 10000;
      }

      .headingTeam p{
        padding: 10px;
        font-style: italic;
        font-weight: 300;
      }

      .headingTeam2{
        padding: 40px;
        text-align: center;
        background-color: white;

      }

      .headingTeam2 p{
        padding: 10px;
        font-style: italic;
        font-weight: 300;
      }

      #mainTeam{
        width: 80%;

        margin: auto;
        //margin-top: 50px;
        transition: 1s all ease;

      }

      #galteam{
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: 50vh ;
        background-color: #f4f4f4;
        grid-gap: 25px;
        margin: auto;
      }
      #teamimg {
        background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url('imgs/vito.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        filter: blur(5px);
      }
      #textTeam{
        background: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url('imgs/teamworkres.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        filter: blur(5px);
      }

      #whatWeWork{
        display: grid;
        grid-template-columns: 1fr  1fr 1fr ;
        grid-template-rows: 50vh 50vh ;
        width: 90%;
        grid-gap: 25px;
        margin: auto;
        //margin-bottom: -100px;
        transition: 1s all ease;
        overflow: hidden;
        font-style: italic;
        font-weight: 300;

      }

      #wwwgal1{
        grid-column: 1/2;
        grid-row: 1/3;
        background-color: lightgrey;
        background: linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35)), url('imgs/ceo.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        transition: 2s all ease;
        opacity: 0;
        text-align: center;
      }
      #wwwgal1 h1{
        color: rgba(255,255,255, 1);
        display: flex;
        width: 100%;
        height: 100%;
        align-items: center;
        justify-content: center;
      }
      #wwwgal2{
        grid-column: 2/4;
        grid-row: 1/2;
        background-color: lightgrey;
        background: linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35)), url('imgs/foodres.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        opacity: 0;
        transform: translate(200px,0);
        transition: 2s all ease;
      }
      #wwwgal2 h1{
        color: white;
        display: flex;
        width: 100%;
        height: 100%;
        align-items: center;
        justify-content: center;
      }
      #wwwgal3 {
        grid-column: 2/3;
        grid-row: 2/3;
        background-color: lightgrey;
        background: linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35)), url('imgs/happy2res.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        opacity: 0;
        transform: translate(0,100px);
        transition: 2s all ease;
      }
      #wwwgal3 h1{
        color: white;
        display: flex;
        width: 100%;
        height: 100%;
        align-items: center;
        justify-content: center;
      }
      #wwwgal4{
        grid-column: 3/4;
        grid-row: 2/3;
        background-color: lightgrey;
        background: linear-gradient(rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.35)), url('imgs/happyres.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        opacity: 0;
        transform: translate(0,100px);
        transition: 2s all ease;
      }
      #wwwgal4 h1{
        color: white;
        display: flex;
        width: 100%;
        height: 100%;
        align-items: center;
        justify-content: center;
      }

      #colorRooms{
        background-color: #fafafa;
        padding: 1px;
      }

      #containerstandard{
        display: grid;
        grid-template-columns: 1fr 1fr ;
        grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
        width: 80%;
        padding-top: 40px;
        padding-bottom: 40px;
        height: 200vh;
        grid-gap: 25px;
        margin: auto;
        transition: 1s all ease;
        font-style: italic;
        font-weight: 300;
        line-height: 30px;

      }

      #standardtext1{
        grid-column: 1/2;
        grid-row: 1/3;

        transition: 2s all ease;

        color: black;
      }
      #standardtext2{
        grid-column: 2/3;
        grid-row: 4/6;

        transition: 2s all ease;

        color: black;
      }
      .standardimg1{
        grid-column: 2/3;
        grid-row: 1/4;
        background-color: blue;
        transition: 2s all ease;
        text-align: center;
        color: black;
        background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('imgs/chair.jpeg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
      }
      .standardimg2{
        grid-column: 1/2;
        grid-row: 3/6;
        background-color: blue;
        transition: 2s all ease;
        text-align: center;
        color: black;
        border: 10px;
        background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('imgs/room.jpeg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
      }
      .standardimg3{
        grid-column: 1/3;
        grid-row: 6/9;
        background-color: blue;
        transition: 2s all ease;
        text-align: center;
        color: black;
        border: 10px;
        background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('imgs/chair:room.jpeg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
      }


      #eventimg1{
        grid-column: 2/3;
        grid-row: 1/4;
        background-color: blue;
        transition: 2s all ease;
        text-align: center;
        color: black;
        background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('imgs/eventnam.jpeg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
      }
      #eventimg2{
        grid-column: 1/2;
        grid-row: 3/6;
        background-color: blue;
        transition: 2s all ease;
        text-align: center;
        color: black;
        border: 10px;
        background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('imgs/marknad.webp');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
      }
      #eventimg3{
        grid-column: 1/3;
        grid-row: 6/9;
        background-color: blue;
        transition: 2s all ease;
        text-align: center;
        color: black;
        border: 10px;
        background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('imgs/inkonsert.jpeg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
      }

      #marginEvent{
        width: 100%;
        height: 130px;
        background-color: #f4f4f4;
      }


      #containerArrival{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr ;
        grid-template-rows: 125px 125px 125px 125px 175px 375px;
        width: 90%;
        padding-top: 40px;
        padding-bottom: 40px;
        grid-gap: 25px;
        margin: auto;
        transition: 1s all ease;
        font-style: italic;
        font-weight: 300;
        line-height: 30px;
      }
      .wrapper{
        background-color: #f4f4f4;
      }

      #arrivalText1{
        grid-column: 1/2;
        grid-row: 1/4;
        font-size: 12px;
        transition: 2s all ease;
        padding: 10px;
        line-height: 25px;
        color: black;
      }
      .arrivalImg1{
        grid-column: 2/4;
        grid-row: 1/4;
        transition: 2s all ease;
        overflow: hidden;
      }
      .arrivalImg1 iframe{
        width: 100%;
        height: 100%;
      }

      .arrivalImg2{
        grid-column: 1/2;
        grid-row: 3/6;
        margin-top: 60px;
        transition: 2s all ease;
        //overflow: hidden;
        background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('imgs/locationH.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
      }

      .arrivalImg3{
        grid-column: 2/4;
        grid-row: 6/6;
        transition: 2s all ease;
        margin-top: -85px;
        //overflow: hidden;
        background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('imgs/history.jpg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
      }

      #arrivalText2{
        grid-column: 2/4;
        grid-row: 4/6;
        font-size: 12px;
        transition: 2s all ease;
        //padding: 10px;
        line-height: 25px;
        color: black;
        display: flex;
        justify-content: space-around;
      }
      #arrivalText3{
        grid-column: 1/2;
        grid-row: 6/7;
        font-size: 12px;
        transition: 2s all ease;
        padding: 10px;
        line-height: 25px;
        color: black;
      }
      .hoverArrival a{
        color: black;
        text-decoration: underline;

      }
      .hoverArrival {
        cursor: pointer;
      }
      .arrivalFlexText {
        padding: 35px;
      }

      .hoverArrival:hover a{
        text-decoration: none;

      }


      #containerAlFresco{
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        grid-template-rows: 250px 175px 175px 250px 175px 250px 250px;
        width: 80%;
        padding-top: 40px;
        padding-bottom: 40px;
        grid-gap: 25px;
        margin: auto;
        transition: 1s all ease;
        font-style: italic;
        font-weight: 300;
        line-height: 30px;
      }
      #wrapper2{
        background-color: #f4f4f4;
        margin-top: -20px;
      }

      #al1{
        grid-column: 1/3;
        grid-row: 1/2;
        font-size: 14px;
        padding: 10px;
        line-height: 25px;
        color: black;
      }
      #al2{
        grid-column: 3/5;
        grid-row: 1/3;
        font-size: 12px;
        padding: 10px;
        line-height: 25px;
        color: black;
        background-color: pink;
        background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('imgs/food2.jpeg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
      }
      #al3{
        grid-column: 1/3;
        grid-row: 2/4;
        font-size: 12px;
        padding: 10px;
        line-height: 25px;
        color: black;
        background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('imgs/food1.jpeg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
      }
      #al4{
        grid-column: 3/5;
        grid-row: 3/6;
        font-size: 12px;
        padding: 10px;
        line-height: 25px;
        color: black;
        background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('imgs/mussla.jpeg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
      }
      #al5{
        grid-column: 1/3;
        grid-row: 4/5;
        font-size: 12px;
        padding: 10px;
        line-height: 25px;
        background-color: #24262b;
      }

      #ev2{
        grid-column: 3/5;
        grid-row: 1/3;
        font-size: 12px;
        padding: 10px;
        line-height: 25px;
        color: black;
        background-color: pink;
        background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('imgs/frukost.jpeg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
      }
      #ev3{
        grid-column: 1/3;
        grid-row: 2/4;
        font-size: 12px;
        padding: 10px;
        line-height: 25px;
        color: black;
        background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('imgs/konsert.jpeg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
      }
      #ev4{
        grid-column: 3/5;
        grid-row: 3/6;
        font-size: 12px;
        padding: 10px;
        line-height: 25px;
        color: black;
        background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('imgs/wedding.jpeg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
      }

      #ev6{
        grid-column: 1/3;
        grid-row: 5/8;
        font-size: 12px;
        transition: 2s all ease;
        padding: 10px;
        line-height: 25px;
        background-color: black;
        background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('imgs/sjo.jpeg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
      }

      .tecken{
        font-size: 40px;
        margin-top: 8px;
        margin-bottom: -10px;
      }
      .menutext{
        text-align: center;
        color: white;
        padding: 20px;
        font-family: none;
      }
      .menutext h2{
        font-size: 22px;
      }
      .hoverMenu a{
        color: white;
        text-decoration: underline;
      }
      .hoverMenu {
        cursor: pointer;
        padding: 2px;
        margin-top: -2px;
        font-size: 14px;
      }

      .hoverMenu:hover a{
        text-decoration: none;
      }
      #al6{
        grid-column: 1/3;
        grid-row: 5/8;
        font-size: 12px;
        transition: 2s all ease;
        padding: 10px;
        line-height: 25px;
        background-color: black;
        background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url('imgs/desert.jpeg');
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
      }
      #al7{
        grid-column: 3/5;
        grid-row: 6/7;
        font-size: 12px;
        transition: 2s all ease;
        padding: 10px;
        line-height: 25px;

      }
      #al8{
        grid-column: 3/5;
        grid-row: 7/8;
        font-size: 12px;
        transition: 2s all ease;
        padding: 10px;
        line-height: 25px;
        background-color: #24262b;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      .openHours{
        font-size: 14px;
      }

      #eventCrossover{
        padding-top: 50px;
        padding-bottom: 50px;
        //background-color: #f4f4f4;
      }

      .colorEvent{
        background-color: #f4f4f4;
      }
      #eventContainer{
        padding: 40px;
        width: 70%;
        margin: auto;
      }
      #eventContainer h1{
        letter-spacing: 3px;
      }
      #eventContainer h2{
        letter-spacing: 1px;
        font-size: 20px;
      }

      .lineEvent{
        width: 300px;
        height: 1px;
        background-color: black;
        margin-top: 5px;
        margin-bottom: 5px;
      }

      #svgimgSpa{
        background-image: url("imgs/bastuPic.jpeg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        height: 80vh;
        z-index: -10;
        margin-top: -14%;
        text-align: center;
        color: white;
        font-size: 22px;
      }
      #svgimgSpa2{
        background-image: url("imgs/sparelax.jpeg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        background-attachment: fixed;
        height: 60vh;
        z-index: -10;
        margin-bottom: -13%;
        text-align: center;
        color: white;
        font-size: 22px;
      }
      #svgimgSpa2 h1{
        padding-top: 10%;
        font-size: 30px;
        font-style: oblique;

        letter-spacing: 3px;
      }
      .displaySpaText h2{
        font-size: 30px;
        font-style: oblique;
        padding: 20px;
        letter-spacing: 3px;
      }
      .displaySpaText{
        padding-top: 200px;
        width: 60%;
        margin: auto;
        font-size: 14px;
        line-height: 28px;
      }
      .contactAndOpen{
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        min-height: 60vh;
      }
      .contactAndOpen img{
        width: 100%;
      }


      #spaF1 {
        display: grid;
        position: relative;
        background-color: white;
        background-image: url("lobby.jpg");
        background-size: cover;
        background-color: black;
        height: 100%;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
      }
      #spa {
        scroll-margin: 18vh;
      }
      #restaurant {
        scroll-margin: 18vh;

      }
      #spaF2 {
        display: grid;
        position: relative;
        background-color: white;
        background-image: url("lobby2.jpg");
        background-size: cover;
        background-color: black;
        height: 100%;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
      }
      .teckenSpa{
        font-size: 50px;
        margin-top: -5px;
        margin-bottom: -40px;
      }
      #wave2spa{
        margin-bottom: -10px;

      }







      #liMars{
        display: none;
      }

      #liApril{

      }

      #liMaj{
        display: none;
      }

      .eventlist{
          width: 100%;
          height: 40px;
          padding: 30px;
          justify-content: flex-start;
          align-items: center;
          display: flex;
      }
      .eventlist2{
          width: 100%;
          height: 40px;
          padding: 30px;
          background-color: #313036;
          justify-content: flex-start;
          align-items: center;
          display: flex;
          color: white;
      }

      .eventlist span{
          margin-left: 50px;
          color: white;
      }
      .eventlist2 span{
          margin-left: 50px;
          color: white;
      }


      #arrowbuttonback{
        background: none;
        border: none;
        transition: 0.2s ease;
      }
      #arrowbuttonforward{
        background: none;
        border: none;
        margin-top: -13px;
        transition: 0.2s ease;
      }

      #arrowbuttonback:hover{
        transform: translateX(3px);
      }
      #arrowbuttonforward:hover{
      transform: translateX(3px);

      }


      .crossover{
        display: grid;
        grid-template-columns: 1fr  1fr 1fr;
        grid-template-rows: 1fr 1fr 1fr;
        //grid-gap: 25px;
        height: 100vh;
        padding: 0;
      }

      #imgcross{
        grid-column: 1/2;
        grid-row: 1/2;
        text-align: center;
        background-color: white;

        display: flex;
        justify-content: center;
        align-items:center;
        overflow: hidden;
      }
      .flex{
        width:100%;
        height: 100%;
        margin-top: 180px;
        font-size: 25px;
        letter-spacing: 3px;
      }

      #rotate{
        transform:rotate(180deg);
        margin-top: -17px;
      }

      .flex img{
        width: 35px;
        height: 80px;
        margin-right: 20px;
        margin-left: 20px;
      }
      #manad{
        margin-top: 5px;
      }

      #list{
        grid-column: 1/2;
        grid-row: 2/4;
        background-color: #24262b;
        color: white;
      }


      #imgcross2{
        grid-column: 2/3;
        grid-row: 1/3;
      }
      #imgcross2 img{
        width: 100%;
        min-height: 100%;
      }

      #imgcross3{
        grid-column: 2/3;
        grid-row: 3/4;
      }
      #imgcross3 img{
        width: 100%;
        min-height: 100%;
      }

      #imgcross4{
        grid-column: 3/4;
        grid-row: 1/2;
      }
      #imgcross4 img{
        width: 100%;
        min-height: 100%;
      }

      #imgcross5{
        grid-column: 3/4;
        grid-row: 2/4;
        overflow: hidden;
      }
      #imgcross5 img{
        width: 100%;
        min-height: 100%;
      }



      #gridSvg{
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(20vh, 1fr));
        grid-gap: 50px;
        margin-top: 100px;
        margin-bottom: 100px;
        padding: 0 15px;
      }
      .svgRooms img{
        width: 40px;
        margin-bottom: 25px;
      }
      .lineSvg{
        width: 25px;
        height: 2px;
        margin-top: 10px;
        margin-bottom: 10px;
        background-color: #a3313d;
      }


      .footer-col{
        width: 25%;
        padding: 0 15px;
      }

      .footer-col h4{
        font-size: 18px;
        color: #ffffff;
        text-transform: capitalize;
        margin-bottom: 35px;
        font-weight: 500;
        position: relative;
      }

      .footer-col h4::before{
        content: '';
        position: absolute;
        left:0;
        bottom: -10px;
        //background-color: #E89402;
        background-color: #a3313d;
        height: 2px;
        box-sizing: border-box;
        width: 50px;
      }

      .footer-col ul li:not(:last-child){
        margin-bottom: 10px;
      }

      .footer-col ul li a{
        font-size: 16px;
        color: #ffffff;
        text-decoration: none;
        font-weight: 300;
        color: #bbbbbb;
        display: block;
        transition: all 0.3s ease;
      }

      .footer-col ul li a:hover{
        color: #ffffff;
        padding-left: 8px;
      }

      .footer-col .social-links a{
        display: inline-block;
        height: 40px;
        width: 40px;
        background-color: rgba(255,255,255,0.2);
        margin:0 10px 10px 0;
        text-align: center;
        line-height: 40px;
        border-radius: 50%;
        color: #ffffff;
        transition: all 0.5s ease;
      }

      .footer-col .social-links a:hover{
        color: #24262b;
        background-color: #ffffff;
      }


      .conHeaderText{
        width: 100%;
        height: 20vh;
        margin-top: 10vh;
        text-align: center;
        font-size: 17px;
        letter-spacing: 1px;
        line-height: 25px;
        scroll-margin: 25vh;

      }
      .conHeaderText h1{
        font-size: 26px;
        margin-bottom: 10px;
        letter-spacing: 2px;
      }

      .galleriCon{
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(40vh, 1fr));
        min-height: 60vh;
        grid-gap: 50px;
        margin: 50px;
      }
      .galleriCon img{
        width: 100%;
      }

      .galleriCon2{
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
        min-height: 60vh;
        grid-gap: 100px;
        margin-left: 150px;
        margin-right: 150px;
        margin-top: 50px;
        margin-bottom: 50px;
      }
      .galleriCon2 img{
        width: 100%;
      }

      .img__wrapCon {
        text-align: left;
        color: black;
        padding: 40px;
        font-size: 15px;
        line-height: 25px;
      }
      .img__wrapCon h2{
        text-align: left;
        color: black;
        font-size: 28px;
        margin-bottom: 20px;
      }
      .img__wrapConText {
        display: grid;
        position: relative;
        background-color: white;
        background-image: url("it-konsult.jpeg");
        background-size: cover;
        background-color: black;
        height: 100%;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
      }
      .img__wrapConText2 {
        display: grid;
        position: relative;
        background-color: white;
        background-image: url("imgs/urkult.jpeg");
        background-size: cover;
        background-color: black;
        height: 100%;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
      }

      .img__wrap_om_oss {
        display: grid;
        position: relative;
        background-color: white;
        background-image: url("profilbild2.jpg");
        background-size: cover;
        background-color: black;
        height: 100%;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
      }

      #conBtn {
        padding: 15px 40px;
        margin-top: 20px;
        background: none;
        border: none;
        color: black;
        position: relative;
        text-transform: uppercase;
        letter-spacing: 3px;
        cursor: pointer;
        font-family: 'Broadsheet LDO', sans-serif;
      }
        #conBtn:after, #conBtn:before {
          content: '';
          position: absolute;
          top: 0;
          left: 0;
          bottom: 0;
          right: 0;
          border: 2px solid #000;
          opacity: 0.8;
          transition: transform .2s;
          border-radius: 0px; }
        #conBtn:after {
          transform: translate(3px, 3px); }
        #conBtn:before {
          transform: translate(-3px, -3px); }
        #conBtn:hover:after, #conBtn:hover:before {
          transform: translate(0); }

      #conBtn:active{
        transform: translate(1px, 1px);
      }

      #conBtn:focus:after, #conBtn:focus:before {
        border: 2px solid #a81b2a;
        transition: 0.1s;
      }

      #conPackages{
        width: 100%;
        background-color: #fafafa;
      }
      #conPackagesimg{
        width: 60%;
        height: 70vh;
        background-image: url("marsfjalletstopp.jpg");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        margin: auto;
      }

      #conPackagesText{
        width: 60%;
        margin: auto;
        padding-top: 50px;
        padding-bottom: 100px;
      }
      #conPackagesText h3{
        text-align: left;
        color: black;
        font-size: 28px;
        margin-bottom: 20px;
      }




      @media(max-width: 767px){
        .footer-col{
          width: 50%;
          margin-bottom: 30px;
        }

      }
      @media(max-width: 574px){
        .footer-col{
          width: 100%;
        }
      }



      @media screen and (max-width: 1068px) {
        .media{
          width: 400px;
        }
        .line1{
          width: 30px;
          height: 3px;
          background: white;
          margin: 5px;
          transition: all 1s ease;
        }
        .line2{
          width: 30px;
          height: 3px;
          background: white;
          margin: 5px;
          transition: all 1s ease;
        }
        .line3 {
          width: 30px;
          height: 3px;
          background: white;
          margin: 5px;
          transition: all 1s ease;
        }

        .line1.toggle {
          transform: rotate(-45deg) translate(-5px, 6px);
          transition: all 0.6s ease 0.3s;
        }
        .line2.toggle {
          opacity: 0;
          transform: translate(-100px, 0);
          transition: all 1s ease;
        }
        .line3.toggle {
          transform: rotate(45deg) translate(-5px, -6px);
          transition: all 0.6s ease 0.3s;
        }

        #lines{
        display: none;
        }

        .hamburger {
          position: absolute;
          cursor: pointer;
          right: 5%;
          top: 50%;
          transform: translate(-5%, -50%);
          width: 70px;
          z-index: 2;
        }

        .nav-links {
          height: 100vh;
          width: 100%;
          flex-direction: column;
          clip-path: circle(100px at 90% -15%);
          -webkit-clip-path: circle(100px at 90% -15%);
          transition: all 1s ease-out;
          pointer-events: none;
          justify-content:flex-start;
          align-items: flex-start;
          padding-top: 40px;
        }
        .nav-links.open {
          clip-path: circle(1000px at 90% -10%);
          -webkit-clip-path: circle(1000px at 90% -10%);
          pointer-events: all;
        }
        .nav-links li {
          opacity: 0;
        }
        .nav-links li a {
          font-size: 25px;
        }
        .nav-links li:nth-child(1) {
          transition: all 0.5s ease 0.2s;
        }
        .nav-links li:nth-child(2) {
          transition: all 0.5s ease 0.4s;
        }
        .nav-links li:nth-child(3) {
          transition: all 0.5s ease 0.6s;
        }
        li.fade {
          opacity: 1;
        }
        .dropdown-content {
          position: static;
          background-color: inherit;
          min-width: 160px;
          box-shadow: none;
          z-index: 10;
          border-radius: none;
          font-size: 13px;
          animation: fade 1.5s ease ;
          transform-origin: top center;
          z-index: 100;
        }
        .dropdown-content a{
          color: white;
          z-index: 100;
        }
        .dropdown{
          padding: 10px;
          margin-left: 20px;
          z-index: 100;

        }

        .dropdown-content a:hover:after {
          width: 15%;
          left: 23%;
          z-index: 100;
        }
      }

      @media(max-width: 1200px){
        .galleri{
          grid-template-columns: 1fr;
        }

        @media(max-width: 600px){
          .galleri2{
            grid-template-columns: 1fr;
          }