@font-face {
  font-family: 'Cocogoose Classic';
  src: url('../fonts/CocogooseClassic-Medium.woff2') format('woff2'),
    url('../fonts/CocogooseClassic-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Cocogoose Classic';
  src: url('../fonts/CocogooseClassic-MediumItalic.woff2') format('woff2'),
    url('../fonts/CocogooseClassic-MediumItalic.woff') format('woff');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Cocogoose Classic';
  src: url('../fonts/CocogooseClassic-Light.woff2') format('woff2'),
    url('../fonts/CocogooseClassic-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Cocogoose Classic';
  src: url('../fonts/CocogooseClassic-LightItalic.woff2') format('woff2'),
    url('../fonts/CocogooseClassic-LightItalic.woff') format('woff');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Cocogoose Classic';
  src: url('../fonts/CocogooseClassic-Bold.woff2') format('woff2'),
    url('../fonts/CocogooseClassic-Bold.woff') format('woff');
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Cocogoose Classic';
  src: url('../fonts/CocogooseClassic-BoldItalic.woff2') format('woff2'),
    url('../fonts/CocogooseClassic-BoldItalic.woff') format('woff');
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Cocogoose Classic';
  src: url('../fonts/CocogooseClassic-Italic.woff2') format('woff2'),
    url('../fonts/CocogooseClassic-Italic.woff') format('woff');
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: 'Cocogoose Classic';
  src: url('../fonts/CocogooseClassic-Regular.woff2') format('woff2'),
    url('../fonts/CocogooseClassic-Regular.woff') format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}


:root {

  /* Brand */
  --Brand-Blue-50: #E7E9ED;
  --Brand-Blue-100: #CDD3DB;
  --Brand-Blue-200: #9CA7B7;
  --Brand-Blue-300: #6A7A93;
  --Brand-Blue-400: #394E6F;
  --Brand-Blue-500: #07224B;
  --Brand-Blue-500-light: #484A67;
  --Brand-Blue-600: #061B3C;
  --Brand-Blue-700: #04142D;
  --Brand-Blue-800: #030E1E;
  --Brand-Green-50: #F3FEF7;
  --Brand-Green-100: #E7FDED;
  --Brand-Green-200: #CEFBDC;
  --Brand-Green-300: #B6F9CA;
  --Brand-Green-400: #9DF7B9;
  --Brand-Green-500: #85F5A7;
  --Brand-Green-600: #6AC486;
  --Brand-Green-700: #509364;
  --Brand-Green-800: #356243;
  --Brand-Grey-25: #F8F9FA;
  --Brand-Grey-50: #ECEDED;
  --Brand-Grey-100: #D9D9DA;
  --Brand-Grey-200: #B2B3B5;
  --Brand-Grey-300: #8C8E90;
  --Brand-Grey-400: #65686B;
  --Brand-Grey-500: #3F4246;
  --Brand-Grey-600: #323538;
  --Brand-Grey-700: #26282A;
  --Brand-Grey-800: #191A1C;
  --Brand-Grey-Black: #000000;
  --Brand-Grey-White: #FFFFFF;
  --Brand-Orange-50: #FEF6EB;
  --Brand-Orange-100: #FDEDD5;
  --Brand-Orange-200: #FBDBAC;
  --Brand-Orange-300: #F8C982;
  --Brand-Orange-400: #F6B759;
  --Brand-Orange-500: #F4A52F;
  --Brand-Orange-600: #C38426;
  --Brand-Orange-700: #92631C;
  --Brand-Orange-800: #624213;
  --Brand-Red-50: #FDE6EA;
  --Brand-Red-100: #F9CDD4;
  --Brand-Red-200: #F39BA9;
  --Brand-Red-300: #EE687D;
  --Brand-Red-400: #E83652;
  --Brand-Red-500: #E20427;
  --Brand-Red-600: #B5031F;
  --Brand-Red-700: #880217;
  --Brand-Red-800: #5A0210;
  --Brand-Sky-Blue-50: #EBF9FF;
  --Brand-Sky-Blue-100: #D6F2FF;
  --Brand-Sky-Blue-200: #ACE6FE;
  --Brand-Sky-Blue-300: #83D9FE;
  --Brand-Sky-Blue-400: #59CDFD;
  --Brand-Sky-Blue-500: #30C0FD;
  --Brand-Sky-Blue-600: #269ACA;
  --Brand-Sky-Blue-700: #1D7398;
  --Brand-Sky-Blue-800: #134D65;
  --Brand-Yellow-50: #FFFDEB;
  --Brand-Yellow-100: #FFFAD5;
  --Brand-Yellow-200: #FFF5AB;
  --Brand-Yellow-300: #FFF182;
  --Brand-Yellow-400: #FFEC58;
  --Brand-Yellow-500: #FFE72E;
  --Brand-Yellow-600: #CCB925;
  --Brand-Yellow-700: #998B1C;
  --Brand-Yellow-800: #665C12;

  /* Alias */
  --Alias-Error-50: var(--Brand-Red-50);
  --Alias-Error-100: var(--Brand-Red-100);
  --Alias-Error-200: var(--Brand-Red-200);
  --Alias-Error-300: var(--Brand-Red-300);
  --Alias-Error-400: var(--Brand-Red-400);
  --Alias-Error-500: var(--Brand-Red-500);
  --Alias-Error-600: var(--Brand-Red-600);
  --Alias-Error-700: var(--Brand-Red-700);
  --Alias-Error-800: var(--Brand-Red-800);
  --Alias-Information-50: var(--Brand-Sky-Blue-50);
  --Alias-Information-100: var(--Brand-Sky-Blue-100);
  --Alias-Information-200: var(--Brand-Sky-Blue-200);
  --Alias-Information-300: var(--Brand-Sky-Blue-300);
  --Alias-Information-400: var(--Brand-Sky-Blue-400);
  --Alias-Information-500: var(--Brand-Sky-Blue-500);
  --Alias-Information-600: var(--Brand-Sky-Blue-600);
  --Alias-Information-700: var(--Brand-Sky-Blue-700);
  --Alias-Information-800: var(--Brand-Sky-Blue-800);
  --Alias-Neutral-25: var(--Brand-Grey-25);
  --Alias-Neutral-50: var(--Brand-Grey-50);
  --Alias-Neutral-100: var(--Brand-Grey-100);
  --Alias-Neutral-200: var(--Brand-Grey-200);
  --Alias-Neutral-300: var(--Brand-Grey-300);
  --Alias-Neutral-400: var(--Brand-Grey-400);
  --Alias-Neutral-500: var(--Brand-Grey-500);
  --Alias-Neutral-600: var(--Brand-Grey-600);
  --Alias-Neutral-700: var(--Brand-Grey-700);
  --Alias-Neutral-800: var(--Brand-Grey-800);
  --Alias-Neutral-Black: var(--Brand-Grey-Black);
  --Alias-Neutral-White: var(--Brand-Grey-White);
  --Alias-Primary-50: var(--Brand-Red-50);
  --Alias-Primary-100: var(--Brand-Red-100);
  --Alias-Primary-200: var(--Brand-Red-200);
  --Alias-Primary-300: var(--Brand-Red-300);
  --Alias-Primary-400: var(--Brand-Red-400);
  --Alias-Primary-500: var(--Brand-Red-500);
  --Alias-Primary-600: var(--Brand-Red-600);
  --Alias-Primary-700: var(--Brand-Red-700);
  --Alias-Primary-800: var(--Brand-Red-800);
  --Alias-Secondary-50: var(--Brand-Blue-50);
  --Alias-Secondary-100: var(--Brand-Blue-100);
  --Alias-Secondary-200: var(--Brand-Blue-200);
  --Alias-Secondary-300: var(--Brand-Blue-300);
  --Alias-Secondary-400: var(--Brand-Blue-400);
  --Alias-Secondary-500: var(--Brand-Blue-500);
  --Alias-Secondary-500-light: var(--Brand-Blue-500-light);
  --Alias-Secondary-600: var(--Brand-Blue-600);
  --Alias-Secondary-700: var(--Brand-Blue-700);
  --Alias-Secondary-800: var(--Brand-Blue-800);
  --Alias-Success-50: var(--Brand-Green-50);
  --Alias-Success-100: var(--Brand-Green-100);
  --Alias-Success-200: var(--Brand-Green-200);
  --Alias-Success-300: var(--Brand-Green-300);
  --Alias-Success-400: var(--Brand-Green-400);
  --Alias-Success-500: var(--Brand-Green-500);
  --Alias-Success-600: var(--Brand-Green-600);
  --Alias-Success-700: var(--Brand-Green-700);
  --Alias-Success-800: var(--Brand-Green-800);
  --Alias-Warning-50: var(--Brand-Orange-50);
  --Alias-Warning-100: var(--Brand-Orange-100);
  --Alias-Warning-200: var(--Brand-Orange-200);
  --Alias-Warning-300: var(--Brand-Orange-300);
  --Alias-Warning-400: var(--Brand-Orange-400);
  --Alias-Warning-500: var(--Brand-Orange-500);
  --Alias-Warning-600: var(--Brand-Orange-600);
  --Alias-Warning-700: var(--Brand-Orange-700);
  --Alias-Warning-800: var(--Brand-Orange-800);

  /* Headings */
  --font-family: "Cocogoose Classic", sans-serif;
  --heading-xl-font-size: 6rem;
  --heading-xl-line-height: 6.625rem;
  --heading-xl-paragraph-spacing: 1.5rem;
  --heading-xl-letter-spacing: -0.125rem;
  --heading-lg-font-size: 4rem;
  --heading-lg-line-height: 4.375rem;
  --heading-lg-paragraph-spacing: 1.5rem;
  --heading-lg-letter-spacing: -0.125rem;
  --heading-md-font-size: 3rem;
  --heading-md-line-height: 3.3125rem;
  --heading-md-paragraph-spacing: 1.5rem;
  --heading-md-letter-spacing: -0.0625rem;
  --heading-sm-font-size: 2rem;
  --heading-sm-line-height: 2.1875rem;
  --heading-sm-paragraph-spacing: 1.5rem;
  --heading-sm-letter-spacing: -0.0625rem;
  --heading-xsm-font-size: 1.25rem;
  --heading-xsm-line-height: 1.5rem;
  --heading-xsm-paragraph-spacing: 1.5rem;
  --heading-xsm-letter-spacing: 0;
}

* {
  box-sizing: border-box;
}

img {
  max-width: 100%;
  height: auto;
}

h1 {
  font-size: 3rem;
  font-size: var(--heading-md-font-size);
  line-height: 3.3125rem;
  line-height: var(--heading-md-line-height);
  margin-bottom: 1.5rem;
  margin-bottom: var(--heading-md-paragraph-spacing);
  letter-spacing: -0.0625rem;
  letter-spacing: var(--heading-md-letter-spacing);
}

@media screen and (min-width: 1024px) {

h1 {
    font-size: 4rem;
    font-size: var(--heading-lg-font-size);
    line-height: 4.375rem;
    line-height: var(--heading-lg-line-height);
    margin-bottom: 1.5rem;
    margin-bottom: var(--heading-lg-paragraph-spacing);
    letter-spacing: -0.125rem;
    letter-spacing: var(--heading-lg-letter-spacing);
}
  }

h2 {
  font-size: 2rem;
  font-size: var(--heading-sm-font-size);
  line-height: 2.1875rem;
  line-height: var(--heading-sm-line-height);
  margin-bottom: 1.5rem;
  margin-bottom: var(--heading-sm-paragraph-spacing);
  letter-spacing: -0.0625rem;
  letter-spacing: var(--heading-sm-letter-spacing);
}

@media screen and (min-width: 1024px) {

h2 {
    font-size: 3rem;
    font-size: var(--heading-md-font-size);
    line-height: 3.3125rem;
    line-height: var(--heading-md-line-height);
    margin-bottom: 1.5rem;
    margin-bottom: var(--heading-md-paragraph-spacing);
    letter-spacing: -0.0625rem;
    letter-spacing: var(--heading-md-letter-spacing);
}
  }

h3 {
  font-size: 2rem;
  font-size: var(--heading-sm-font-size);
  line-height: 2.1875rem;
  line-height: var(--heading-sm-line-height);
  margin-bottom: 1.5rem;
  margin-bottom: var(--heading-sm-paragraph-spacing);
  letter-spacing: -0.0625rem;
  letter-spacing: var(--heading-sm-letter-spacing);
}

@media screen and (min-width: 1024px) {

h3 {
    font-size: 3rem;
    font-size: var(--heading-md-font-size);
    line-height: 3.3125rem;
    line-height: var(--heading-md-line-height);
    margin-bottom: 1.5rem;
    margin-bottom: var(--heading-md-paragraph-spacing);
    letter-spacing: -0.0625rem;
    letter-spacing: var(--heading-md-letter-spacing);
}
  }

h4 {
  font-size: 1.25rem;
  font-size: var(--heading-xsm-font-size);
  line-height: 1.5rem;
  line-height: var(--heading-xsm-line-height);
  margin-bottom: 1.5rem;
  margin-bottom: var(--heading-xsm-paragraph-spacing);
}

@media screen and (min-width: 1024px) {

h4 {
    font-size: 2rem;
    font-size: var(--heading-sm-font-size);
    line-height: 2.1875rem;
    line-height: var(--heading-sm-line-height);
    margin-bottom: 1.5rem;
    margin-bottom: var(--heading-sm-paragraph-spacing);
    letter-spacing: -0.0625rem;
    letter-spacing: var(--heading-sm-letter-spacing);
}
  }

h5,
h6 {
  font-size: 1.25rem;
  font-size: var(--heading-xsm-font-size);
  line-height: 1.5rem;
  line-height: var(--heading-xsm-line-height);
  margin-bottom: 1.5rem;
  margin-bottom: var(--heading-xsm-paragraph-spacing);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Cocogoose Classic", sans-serif;
  font-family: var(--font-family);
  margin-top: 0;
  color: #07224B;
  color: var(--Alias-Secondary-500);
  margin-bottom: 1.75rem;
}

p {
  margin-top: 0;
  margin-bottom: 1.75rem;
}

ul,
ol {
  margin: 0;
  margin-bottom: 1.75rem;
}

body {
  font-family: "Cocogoose Classic", sans-serif;
  font-family: var(--font-family);
  color: #484A67;
  color: var(--Alias-Secondary-500-light);
  background-color: #F8F9FA;
  background-color: var(--Alias-Neutral-25);
  font-size: 1.25rem;
  line-height: 1.4;
  font-weight: normal;
}

/* Page Header */
.page__header {
  display: flex;
  flex-direction: column;
  position: relative;
  background-color: #FFFFFF;
  background-color: var(--Alias-Neutral-White);
  z-index: 1000;
}
@media screen and (min-width: 540px) {
    .page__header::before {
      content: '';
      order: 3;
    }
.page__header {

    display: grid;
    grid-template-columns: 14.625rem 1fr 7.625rem;
    grid-template-areas: ". . ."
    "billboard billboard billboard";
}
  }
@media screen and (min-width: 1200px) {
    .page__header::before {
      display: none;
    }
.page__header {

    grid-template-columns: 1fr 14.625rem 1fr;
    grid-template-areas: none;
}
  }
@media (min-width: 1499.02px) {
.page__header {
    grid-template-columns: 1fr 16.625rem 1fr;
}
  }

@media screen and (min-width: 540px) {

.page__header-third {
    grid-area: billboard;
    height: 4.625rem;
}

    .page__header-third::before {
      content: '';
      position: absolute;
      bottom: 4.625rem;
      left: 0;
      height: 1px;
      width: 100%;
      background: url("../images/line.png") no-repeat center;
    }
  }

@media screen and (min-width: 1200px) {

.page__header-third {
    grid-area: unset;
    height: auto;
    order: 3;
}

    .page__header-third::before {
      display: none;
    }
  }

.page__header-first {
  display: none;
}

@media screen and (min-width: 540px) {

.page__header-first {
    display: block;
    order: 2;
}
  }

@media screen and (min-width: 1200px) {

.page__header-first {
    order: 1;
}
  }

@media screen and (min-width: 540px) {

.page__header-second {
    order: 1;
}
  }

@media screen and (min-width: 1200px) {

.page__header-second {
    order: 2;
}
  }

@media (min-width: 1499.02px) {

.page__header-second {
    position: relative;
    z-index: 2;
}
  }

.region-header-third {

  background-color: #F2F3F5;
}

@media (min-width: 699.02px) {

.region-header-third {
    display: grid;
    grid-template-columns: 1fr auto;
    height: 100%;
}
  }

@media screen and (min-width: 1200px) {

.region-header-third {
    padding-right: 2rem;
    background-color: #FFFFFF;
    background-color: var(--Alias-Neutral-White);
}
  }

@media (min-width: 1359.02px) {

.region-header-third {
    gap: 1rem;
}
  }

@media (min-width: 1399.02px) {

.region-header-third {
    gap: 2rem;
}
  }

@media (min-width: 1499.02px) {

.region-header-third {
    grid-template-columns: auto auto;
}
  }

.region-header-third::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    height: 1px;
    width: 100%;
    background: url("../images/line.png") no-repeat center;
  }

.region-header-first {
  height: 100%;
}

/* Menu */
#block-whale-watching-akureyri-main-menu .menu {

    margin: 0;
  }
@media screen and (min-width: 540px) {
#block-whale-watching-akureyri-main-menu .menu {
      display: grid;
      align-items: center;
  }
    }
@media screen and (min-width: 648px) {
#block-whale-watching-akureyri-main-menu .menu {
      grid-template-columns: 1fr 1fr;
  }
    }
@media screen and (min-width: 780px) {
#block-whale-watching-akureyri-main-menu .menu {
      grid-template-columns: 1fr 1fr 1fr;
  }
    }
@media screen and (min-width: 900px) {
#block-whale-watching-akureyri-main-menu .menu {
      grid-template-columns: 1fr 1fr 1fr 1fr;
  }
    }
#block-whale-watching-akureyri-main-menu  > .menu {
    height: 5.8125rem;
  }
#block-whale-watching-akureyri-main-menu > .menu  > .menu-item span {
      cursor: pointer;
      text-align: center;
    }
#block-whale-watching-akureyri-main-menu > .menu > .menu-item--expanded .menu {
        opacity: 0;
        transition: all 325ms cubic-bezier(0.895, 0.030, 0.685, 0.220);
        pointer-events: none;
      }
#block-whale-watching-akureyri-main-menu > .menu > .menu-item--expanded:hover .menu {
        opacity: 1;
        pointer-events: auto;
      }
#block-whale-watching-akureyri-main-menu  > .menu > .menu-item {
    padding: 0;
    display: none;
    height: 100%;
    position: relative;
  }
#block-whale-watching-akureyri-main-menu > .menu > .menu-item::before {
      content: '';
      position: absolute;
      width: 1px;
      height: 86%;
      right: 0;
      background: url("../images/line3.png") no-repeat center;
      display: none;
    }
#block-whale-watching-akureyri-main-menu > .menu > .menu-item svg path {
        transition: 0.3s;
      }
@media screen and (min-width: 540px) {
    #block-whale-watching-akureyri-main-menu  > .menu > .menu-item:nth-child(1) {
      display: flex;
      justify-content: center;
      align-items: center;
    }

      #block-whale-watching-akureyri-main-menu > .menu > .menu-item:nth-child(1)::before {
        display: block;
      }

      #block-whale-watching-akureyri-main-menu > .menu > .menu-item:nth-child(1) .icon {
        margin-bottom: 1px;
      }
  }
@media screen and (min-width: 648px) {
    #block-whale-watching-akureyri-main-menu  > .menu > .menu-item:nth-child(2) {
      display: flex;
      justify-content: center;
      align-items: center;
    }

      #block-whale-watching-akureyri-main-menu > .menu > .menu-item:nth-child(2)::before {
        display: block;
      }

      #block-whale-watching-akureyri-main-menu > .menu > .menu-item:nth-child(2) .icon {
        margin-bottom: 9px;
      }

      #block-whale-watching-akureyri-main-menu > .menu > .menu-item:nth-child(2) svg {
        transform: translateY(3px);
      }
  }
@media screen and (min-width: 780px) {
    #block-whale-watching-akureyri-main-menu  > .menu > .menu-item:nth-child(3) {
      display: flex;
      justify-content: center;
      align-items: center;
    }

      #block-whale-watching-akureyri-main-menu > .menu > .menu-item:nth-child(3)::before {
        display: block;
      }

      #block-whale-watching-akureyri-main-menu > .menu > .menu-item:nth-child(3) .icon {
        margin-bottom: 3px;
      }
  }
@media screen and (min-width: 900px) {
    #block-whale-watching-akureyri-main-menu  > .menu > .menu-item:nth-child(4) {
      display: flex;
      justify-content: center;
      align-items: center;
    }

      #block-whale-watching-akureyri-main-menu > .menu > .menu-item:nth-child(4)::before {
        display: block;
      }
  }
@media screen and (min-width: 1200px) {

      #block-whale-watching-akureyri-main-menu > .menu > .menu-item:nth-child(4)::before {
        display: none;
      }
  }
#block-whale-watching-akureyri-main-menu a {
    -webkit-text-decoration: none;
    text-decoration: none;
    font-size: 0.9375rem;
    font-weight: bold;
    color: #07224B !important;
    color: var(--Alias-Secondary-500) !important;
    display: block;
    text-align: center;
    line-height: 1.1;
  }
#block-whale-watching-akureyri-main-menu a span {
      transition: 0.3s;
    }
#block-whale-watching-akureyri-main-menu a span:nth-child(2) {
      display: block;
    }
#block-whale-watching-akureyri-main-menu a:hover span {
      color: #E20427;
      color: var(--Alias-Primary-500);
    }
#block-whale-watching-akureyri-main-menu a:hover svg path {
        fill: #E20427;
        fill: var(--Alias-Primary-500);
      }
#block-whale-watching-akureyri-main-menu .hover:hover span {
      color: #E20427;
      color: var(--Alias-Primary-500);
    }
#block-whale-watching-akureyri-main-menu .menu-item--expanded .menu {
      position: absolute;
      background-color: #FFFFFF;
      background-color: var(--Alias-Neutral-White);
      display: block;
      top: calc(100% - 1px);
      z-index: 2;
      padding: 2rem;
      width: 18.25rem;
      box-shadow: 0 0 38px 0 rgba(106, 122, 147, 0.24);
      border-radius: 2rem;
    }
#block-whale-watching-akureyri-main-menu .menu-item--expanded .menu  > li {
        margin-bottom: 1rem;
      }
#block-whale-watching-akureyri-main-menu .menu-item--expanded .menu  > li:last-child {
        margin-bottom: 0;
      }
#block-whale-watching-akureyri-main-menu .menu-item--expanded .menu li::before {
        display: none;
      }
#block-whale-watching-akureyri-main-menu .menu-item--expanded .menu a {
        transition: 0.3s;
      }
#block-whale-watching-akureyri-main-menu .menu-item--expanded .menu a:hover {
        color: #E20427 !important;
        color: var(--Alias-Primary-500) !important;
      }
#block-whale-watching-akureyri-main-menu .menu-item--expanded .menu svg path {
          transition: 0.3s;
        }
#block-whale-watching-akureyri-main-menu .menu-item--expanded .hover:hover svg path {
          fill: #E20427;
          fill: var(--Alias-Primary-500);
        }

.page__mobile-menu {
  position: absolute;
  width: 100vw;
  height: 100vh;
  overflow: auto;
  left: 0;
  top: 0;
  background-color: #FFFFFF;
  background-color: var(--Alias-Neutral-White);
  z-index: -1;
  opacity: 0;
  padding: 4rem 1.5rem;
  text-align: center;
  transition: all 425ms cubic-bezier(0.895, 0.030, 0.685, 0.220);
  transform: translateY(40%);
}

.page__mobile-menu nav,.page__mobile-menu .region-mobile-menu {
    display: inline-flex;
    position: relative;
    flex-direction: column;
  }

.page__mobile-menu .icon {
    display: none;
  }

.page__mobile-menu a {
    font-size: 1.5rem;
    line-height: 1.2;
    -webkit-text-decoration: none;
    text-decoration: none;
    font-weight: bold;
    color: #07224B !important;
    color: var(--Alias-Secondary-500) !important;
    display: block;
    text-align: center;
    transition: 0.3s;
  }

.page__mobile-menu a:hover {
    color: #E20427 !important;
    color: var(--Alias-Primary-500) !important;
  }

.page__mobile-menu .hover a:hover {
      color: #07224B !important;
      color: var(--Alias-Secondary-500) !important;
    }

.page__mobile-menu .menu-item--expanded {
    list-style-image: none;
    list-style-type: none;
  }

.page__mobile-menu .menu-item--expanded > span a:hover {
        color: #07224B !important;
        color: var(--Alias-Secondary-500) !important;
      }

.page__mobile-menu nav > .menu {
    display: inline-flex !important;
    flex-direction: column !important;
    gap: 2rem;
    margin: 0 auto;
  }

.page__mobile-menu nav > .menu .menu-item--expanded span {
        display: block;
        margin-bottom: 1rem;
      }

.page__mobile-menu nav > .menu > .menu-item::before {
        content: '';
        position: absolute;
        width: 100%;
        height: 1px;
        left: 0;
        bottom: -1rem;
        background: url("../images/line.png") no-repeat center;
      }

.page__mobile-menu nav > .menu .menu {
    display: flex !important;
    flex-direction: column !important;
    gap: 1rem;
    margin: 0;
  }

.page__mobile-menu nav > .menu .menu  > .menu-item a {
      font-weight: normal;
      font-size: 1.125rem;
    }

.page__mobile-menu .menu-item {
    position: relative;
    padding: 0;
  }

.active-mobile-menu .page__mobile-menu {
    display: block;
    z-index: 1000;
    opacity: 1;
    transform: translateY(0);
  }

.close-mobile-menu {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 2.2rem;
  cursor: pointer;
  font-size: 1.125rem;
}

.close-mobile-menu span {
    transition: 0.3s;
  }

.close-mobile-menu path {
    transition: 0.3s;
  }

.close-mobile-menu:hover span {
    color: #E20427;
    color: var(--Alias-Primary-500);
  }

.close-mobile-menu:hover path {
    fill: #E20427;
    fill: var(--Alias-Primary-500);
  }

.overflow-y-hidden {
  overflow: hidden;
}

#block-whale-watching-akureyri-burgermobilemenu {
  position: absolute;
  top: 2rem;
  right: 0.8rem;
}

@media (min-width: 539.02px) {

#block-whale-watching-akureyri-burgermobilemenu {
    right: 2rem;
}
  }

@media (min-width: 1199.02px) {

#block-whale-watching-akureyri-burgermobilemenu {
    position: relative;
    top: auto;
    display: flex;
    align-items: center;
    right: auto;
}
  }

@media (min-width: 1399.02px) {
    #block-whale-watching-akureyri-burgermobilemenu::before {
      position: absolute;
      content: "";
      height: 100%;
      width: 1px;
      background: url("../images/line3.png") no-repeat center;
      left: -1rem;
      top: 0;
    }
  }

@media (min-width: 1499.02px) {
    #block-whale-watching-akureyri-burgermobilemenu::before {
      left: -2rem;
    }
  }

.burger {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  cursor: pointer;
}

.burger path {
    fill: #FFFFFF;
    fill: var(--Alias-Neutral-White);
    transition: 0.3s;
  }

@media (min-width: 539.02px) {

.burger path {
      fill: #07224B;
      fill: var(--Alias-Secondary-500);
  }
    }

@media (min-width: 1199.02px) {

.burger {
}}

.burger span {
    color: #FFFFFF;
    color: var(--Alias-Neutral-White);
    font-weight: 750;
    font-size: 0.9375rem;
    line-height: 1;
    transform: translateY(1px);
    transition: 0.3s;
  }

@media (min-width: 539.02px) {

.burger span {
      color: #07224B;
      color: var(--Alias-Secondary-500);
  }
    }

@media (min-width: 1199.02px) {

.burger span {
      display: none;
  }
    }

@media (min-width: 1279.02px) {

.burger span {
      display: block;
  }
    }

@media (min-width: 539.02px) {

.burger:hover path {
      fill: #E20427;
      fill: var(--Alias-Primary-500);
  }
    }

@media (min-width: 539.02px) {

.burger:hover span {
      color: #E20427;
      color: var(--Alias-Primary-500);
  }
    }

/* Site Logo Branding */
.block-system-branding-block .site-name,.block-system-branding-block .site-slogan {
    position: absolute;
    left: -9999em;
  }

.site-logo {

  transition: 0.3s;
}

.site-logo svg {
    display: block;
  }

@media (min-width: 1023.02px) {

.site-logo {
    display: flex;
    justify-content: center;
    background-color: #E20427;
    background-color: var(--Alias-Primary-500);
}
  }

#block-whale-watching-akureyri-site-branding {
  background-color: #E20427;
  background-color: var(--Alias-Primary-500);
  padding: 0.4rem 0.8rem;
  position: relative;
  transition: 0.3s;
}

@media (min-width: 1499.02px) {
    #block-whale-watching-akureyri-site-branding::before {
      content: '';
      position: absolute;
      background-color: #E20427;
      background-color: var(--Alias-Primary-500);
      width: 100%;
      height: 1.5625rem;
      left: 0;
      bottom: -1.5625rem;
      border-bottom-left-radius: 1rem;
      border-bottom-right-radius: 1rem;
      transition: 0.3s;
    }

    #block-whale-watching-akureyri-site-branding svg {
      transform: translateY(0.8125rem);
    }

      #block-whale-watching-akureyri-site-branding svg path {
        transition: 0.3s;
      }
  }

#block-whale-watching-akureyri-site-branding:hover {
  background-color: #07224B;
  background-color: var(--Alias-Secondary-500);
}

@media (min-width: 1499.02px) {
    #block-whale-watching-akureyri-site-branding:hover::before {
      background-color: #07224B;
      background-color: var(--Alias-Secondary-500);
    }
  }

#block-whale-watching-akureyri-site-branding:hover .site-logo {
    background-color: #07224B;
    background-color: var(--Alias-Secondary-500);
  }

/* Layout */
.region-content {
  max-width: 90rem;
  margin: 0 auto;
  padding: 2.5rem 1.25rem 0;
}
@media screen and (min-width: 720px) {
.region-content {
    padding: 3.75rem 1.5rem 0;
}
  }
@media screen and (min-width: 1440px) {
.region-content {
    padding: 7.5rem 1.5rem 0;
}
  }
@media screen and (min-width: 1488px) {
.region-content {
    padding: 7.5rem 0 0;
}
  }

.path-frontpage {
  background-color: #FFFFFF;
  background-color: var(--Alias-Neutral-White);
}

.path-frontpage .region-content {
    max-width: none;
    padding: 0;
  }

.path-frontpage .region-content .paragraph--type--section > .layout {
      max-width: calc(90rem + 2.5rem);
      padding: 0 1.25rem;
      margin: 0 auto;
    }

.path-frontpage .region-content .section-title,.path-frontpage .region-content .section-description {
      max-width: calc(60rem + 2.5rem);
      padding: 0 1.25rem;
      margin: 0 auto;
    }

.path-frontpage .hero-video {
    padding: 0;
  }

.hero-video  > .layout {
    max-width: none !important;
    padding: 0 !important;
  }

/* Footer */
.page__footer {
  max-width: 100rem;
  margin: 0 auto;
  background-color: #07224B;
  background-color: var(--Alias-Secondary-500);
  color: #FFFFFF;
  color: var(--Alias-Neutral-White);
  border-radius: 1.5rem;
  padding: 2.5rem;
}
.page__footer .block {
    margin-bottom: 2rem;
  }
.page__footer .social-media-footer__icons {
    display: flex;
    flex-wrap: wrap;
    gap: 0 1.5rem;
  }
.page__footer .social-media-footer__icons svg {
      display: block;
    }
.page__footer .social-media-footer__icons a {
      display: block;
      transition: 0.3s;
    }
@media screen and (min-width: 1024px) {
.page__footer {
    padding: 3.75rem;
}
  }
@media screen and (min-width: 1400px) {
.page__footer {
    border-radius: 2.125rem;
    padding: 5rem 6.25rem;
}
  }
@media screen and (min-width: 1600px) {
.page__footer {
    border-radius: 2.125rem;
    padding: 5rem 9.0625rem;
    margin-bottom: 5rem;
}
  }
.page__footer .menu {
    margin: 0;
  }
.page__footer a,.page__footer a.is-active {
    color: #FFFFFF !important;
    color: var(--Alias-Neutral-White) !important;
    -webkit-text-decoration: none;
    text-decoration: none;
    font-weight: 650;
    transition: 0.3s;
  }
.page__footer a:hover {
    color: #83D9FE !important;
    color: var(--Alias-Information-300) !important;
  }
.page__footer h2 {
    color: #83D9FE;
    color: var(--Alias-Information-300);
    margin-bottom: 1.25rem;
    line-height: 1.5rem;
    font-size: 1.5rem;
  }
.page__footer .region-footer-top-second {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    justify-content: space-between;
  }

#block-whale-watching-akureyri-ourpartners .field--name-body {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  justify-content: space-between;
}

@media screen and (min-width: 1024px) {

#block-whale-watching-akureyri-ourpartners .field--name-body {
    justify-content: start;
}
  }

@media screen and (min-width: 1200px) {

#block-whale-watching-akureyri-ourpartners .field--name-body {
    justify-content: space-between;
}
  }

#block-whale-watching-akureyri-ourpartners .field--name-body svg {
    display: block;
  }

#block-whale-watching-akureyri-ourpartners .field--name-body a {
    display: block;
  }

#block-whale-watching-akureyri-info .menu {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
}

@media screen and (min-width: 1024px) {

.page__footer-middle {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5rem;
    align-items: center;
}
  }

@media screen and (min-width: 1400px) {

.page__footer-middle {
    display: grid;
    grid-template-columns: 13.1875rem 1fr;
    grid-column-gap: 4.25rem;
}
  }

@media screen and (min-width: 1200px) {

.page__footer-bottom {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
  }

@media screen and (min-width: 1200px) {

.region-footer-bottom-first .block {
    padding-right: 0.75rem;
}
  }

@media screen and (min-width: 1200px) {

.region-footer-bottom-second .block {
    padding-left: 0.75rem;
}
  }

.region-footer-bottom-first::before {
  content: "";
  height: 1px;
  width: 100%;
  background-color: #83D9FE;
  background-color: var(--Alias-Information-300);
  display: block;
  margin-bottom: 32px;
}

@media screen and (min-width: 1200px) {

.region-footer-bottom-second::before {
    content: "";
    height: 1px;
    width: 100%;
    background-color: #83D9FE;
    background-color: var(--Alias-Information-300);
    display: block;
    margin-bottom: 32px;
}
  }

@media screen and (min-width: 1400px) {

.page__footer-top {
    display: grid;
    grid-template-columns: auto 1fr;
    grid-column-gap: 4.25rem;
}
  }

/* Layout */
@media screen and (min-width: 720px) {
.paragraph--type--hero-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 1.25rem;
}
  }
@media screen and (min-width: 1024px) {
.paragraph--type--hero-cards {
    grid-column-gap: 1.875rem;
}
  }

@media screen and (min-width: 520px) {

.paragraph--type--tours-card-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 1.25rem;
}
  }

@media screen and (min-width: 720px) {

.paragraph--type--tours-card-layout {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 1.25rem;
}
  }

@media screen and (min-width: 1024px) {

.paragraph--type--tours-card-layout {
    grid-column-gap: 1.875rem;
}
  }

.paragraph--type--section {
  padding-bottom: 1.5rem;
}

@media screen and (min-width: 1440px) {

.paragraph--type--section {
    padding-bottom: 6rem;
}
  }

/* Whale diary */

.whale_diary .section-title,.whale_diary .section-description {
    position: absolute;
    left: -9999em;
  }

.view-content-placeholder {
  max-width: 62rem;
  margin: 0 auto 1.5rem;
  text-align: center;
}

@media screen and (min-width: 520px) {

.view-content-placeholder {
    display: flex;
    justify-content: center;
    flex-direction: column;
}
  }

.view-content-placeholder h2,.view-content-placeholder h3,.view-content-placeholder h4,.view-content-placeholder h5 {
    text-align: center;
    font-size: 3rem;
    font-size: var(--heading-md-font-size);
    line-height: 3.3125rem;
    line-height: var(--heading-md-line-height);
    letter-spacing: -0.0625rem;
    letter-spacing: var(--heading-md-letter-spacing);
  }

@media screen and (min-width: 520px) {

.view-content-placeholder h2,.view-content-placeholder h3,.view-content-placeholder h4,.view-content-placeholder h5 {
      text-align: left;
  }
    }

@media screen and (min-width: 1024px) {

.view-content-placeholder h2,.view-content-placeholder h3,.view-content-placeholder h4,.view-content-placeholder h5 {
      font-size: 4rem;
      font-size: var(--heading-lg-font-size);
      line-height: 4.375rem;
      line-height: var(--heading-lg-line-height);
      letter-spacing: -0.125rem;
      letter-spacing: var(--heading-lg-letter-spacing);
  }
    }

.view-content-placeholder p {
    font-size: 1.25rem;
    line-height: 1.4;
    letter-spacing: -0.01875rem;
    text-align: center;
    max-width: 62rem;
    margin: 0 auto 2.5rem;
    text-align: center;
  }

@media screen and (min-width: 520px) {

.view-content-placeholder p {
      text-align: left;
  }
    }

@media screen and (min-width: 1024px) {

.view-content-placeholder p {
      font-size: 1.875rem;
  }
    }

@media screen and (min-width: 520px) {

.diary-short-list .view-content {
      display: grid;
      grid-template-columns: 1fr 1fr;
      grid-column-gap: 1.25rem;
  }
    }

@media screen and (min-width: 1024px) {

.diary-short-list .view-content {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      grid-column-gap: 1.25rem;
  }
    }

@media screen and (min-width: 1440px) {

.diary-short-list .view-content {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr 1fr;
      grid-column-gap: 1.25rem;
  }
    }

.page-node-type-activity .page-title {
    text-align: center;
    max-width: 70rem;
    margin: 0 auto 1.75rem;
  }

.paragraph--type--main-title {
  max-width: 70rem;
  margin: 0 auto;
}

.paragraph--type--main-title h1,.paragraph--type--main-title h2 {
    text-align: center;
  }

.paragraph--type--main-title h2 {
    max-width: 47.5rem;
    font-size: 1.5rem;
    line-height: 1.4;
    font-weight: normal;
    margin: 0 auto;
  }

.region-content a {
    -webkit-text-decoration: underline;
    text-decoration: underline;
    color: #E20427;
    color: var(--Alias-Primary-500);
    font-weight: 750;
  }

.region-content a:hover {
    -webkit-text-decoration: none;
    text-decoration: none;
  }

@media (min-width: 519.02px) {

.page-card-layout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 1.25rem;
    grid-row-gap: 1.25rem;
}
  }

@media (min-width: 719.02px) {

.page-card-layout {
    grid-template-columns: 1fr 1fr 1fr;
}
  }

@media (min-width: 1023.02px) {

.page-card-layout {
    grid-column-gap: 1.875rem;
    grid-row-gap: 1.875rem;
}
  }

.align-item-left {
  text-align: left;
}

.align-item-center {
  text-align: center;
}

.align-item-right {
  text-align: right;
}

#user-login-form,
#user-pass {
  padding: 3.75rem 1.25rem;
  max-width: 64rem;
  margin: 0 auto;
}

#user-login-form input,#user-pass input {
    border-radius: 0.625rem;
    padding: 0.8rem 1rem;
  }

#user-login-form #edit-actions .button,#user-pass #edit-actions .button {
      display: flex;
      width: 100%;
      max-width: 10.75rem;
      padding: 1rem 1.1875rem;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      border-radius: 0.625rem;
      background: #07224B;
      background: var(--Alias-Secondary-500);
      color: #FFFFFF !important;
      color: var(--Alias-Neutral-White) !important;
      font-size: 1rem;
      font-weight: bold;
      line-height: 1;
      -webkit-text-decoration: none;
      text-decoration: none;
      cursor: pointer;
      transition: 0.3s;
      border: none;
    }

#user-login-form #edit-actions:hover .button,#user-pass #edit-actions:hover .button {
      background: #E20427;
      background: var(--Alias-Primary-500);
    }

.paragraph--type--stories-text {
  max-width: 62rem;
  margin: 0 auto;
}
