.cf:before,
.cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}
.cf {
    *zoom: 1;
}


* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2 { text-transform: uppercase; }

h1 { padding: 0; margin: 0; font-size: 26px; font-weight: bold; }

h3 { color: #666; }

.pack h3, .pack h4, .pack h5, .pack h6 { color: #fff; }
.pack img { margin-bottom: 20px; }

header { padding-top: 15px; }

.logo-holder { width: 45%; display: block; float: left; margin-left: 20px; }

.logo-holder svg { width: 20%; }
.logo-holder h1 { margin-top: -20px; }

@media only screen and (max-width: 1024px) { 
  .logo-holder svg { width: 30%; }
  .logo-holder h1 { font-size: 22px; }
}

@media only screen and (max-width: 768px) { 
  .logo-holder { float: none; margin: auto; text-align: center; }
  .logo-holder svg { width: 40%; }
  .logo-holder h1 { line-height: 26px; }
}

@media only screen and (max-width: 414px) { 
  .logo-holder { width: 90%; }
  .logo-holder svg { width: 32%; }
}

nav { padding: 30px 15px 30px 0; font-family: 'ralewaymedium', Helvetica, sans-serif; color: #666; font-size: 20px;
 width: 50%; float: right; }

nav ul { width: 100%; float: right; text-align: right; margin-bottom: 15px; }

nav a { color: #666; }

nav li { list-style-type: none; display: inline-block; margin-left: 2%; text-transform: uppercase; }

nav ul li a,
nav ul li a:after,
nav ul li a:before,
footer ul li a,
footer ul li a:after,
footer ul li a:before {
  transition: all .5s;
}
nav ul li a:hover {
  color: #555;
}

a.speclink, a.speclink:after,  a.speclink:before, .contentblocks a, .contentblocks a:after, .contentblocks a:before { color: #364e6b; transition: all .5s ease-in-out; }

nav.stroke ul li a, footer.stroke ul li a, a.speclink, .contentblocks a {
  position: relative;
}
nav.stroke ul li a:after,
a.speclink:after, .contentblocks a:after,
footer.stroke ul li a:after {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 0%;
  content: '.';
  color: transparent;
  background: #aaa;
  height: 1px;
}
a.speclink:after, .contentblocks a:after {
  background: #364e6b;
}
nav.stroke ul li a:hover:after, footer.stroke ul li a:hover:after, a.speclink:hover:after, .contentblocks a:hover:after {
  width: 100%;
}

@media only screen and (max-width: 768px) { 
  nav { float: none; }
  nav.stroke { display: none; }
  h2 { font-size: 24px; }
  h3 { font-size: 18px; line-height: 24px; margin-bottom: 5px; }
  .product-types h3 { text-align: center; font-size: 24px; }
}

@media only screen and (max-width: 414px) { 
  h2 { font-size: 20px; }
}

@media only screen and (max-width: 375px) { 
  h2 { font-size: 18px; }
}

.secondary { width: 15%; text-align: left; float: none; position: absolute; z-index: 10; opacity: 0; background-color: #ffffff; margin-left: -4px; padding: 20px 6px 6px 6px; -webkit-box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.12); 
box-shadow: 6px 6px 5px 0px rgba(0,0,0,0.12); transition: all .2s ease-in-out; }
.secondary li { margin-bottom: 8px; }
.secondary li a { color: #ababab; }
.secondary:hover { opacity: 1; }
.dropdown:hover ~ .secondary { opacity: 1; }

.search-icon { opacity: 0.3; width: 35px; position: absolute; right: 11px; top: 108px; cursor: pointer; }


.navigation { position: absolute; left: 2%; top: 25px; z-index: 10; display: none; }

.navigation ul li { list-style-type: none; margin-bottom: 5px;}
.navigation ul.mobilesecondary li { padding: 4px; }
.navigation .menu-container { background-color: #fff; margin: 0; display: none; text-transform: uppercase; font-size: 20px; padding: 10px; webkit-box-shadow: 6px 6px 5px 0px rgb(0 0 0 / 12%);
    box-shadow: 6px 6px 5px 0px rgb(0 0 0 / 12%); }
.navigation .menu-container a { color: #666; }

body a:link {
    -webkit-tap-highlight-color: transparent;
}

@media screen and (max-width: 1366px) {
  .secondary { width: 18%; }
}

@media screen and (max-width: 1024px) {
  .secondary { width: 24%; }
}

@media screen and (max-width: 768px) {
  .navigation { display: block; }
}

@media screen and (max-width: 414px) {
  .navigation .menu-container { font-size: 22px; padding: 20px; }
  .navigation ul li { margin-bottom: 10px;}
}

@media screen and (max-width: 320px) {
  .navigation .menu-container { padding: 16px; }
}

/* HAMBURGER */
.hamburger {
  padding: 15px 15px;
  outline: none;
  z-index: 10;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: #787878;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  overflow: visible; }
  .hamburger:hover {
    opacity: 0.7; }
  .hamburger.is-active:hover {
    opacity: 0.7; }
  .hamburger.is-active .hamburger-inner,
  .hamburger.is-active .hamburger-inner::before,
  .hamburger.is-active .hamburger-inner::after {
    background-color: #787878; }

.hamburger-box {
  width: 40px;
  height: 30px;
  display: inline-block;
  position: relative; }

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px; }
  .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 40px;
    height: 5px;
    background-color: #787878;
    border-radius: 5px;
    position: absolute;
    transition-property: transform;
    transition-duration: 0.15s;
    transition-timing-function: ease;
    }
  .hamburger-inner::before, .hamburger-inner::after {
    content: "";
    display: block; }
  .hamburger-inner::before {
    top: -10px; }
  .hamburger-inner::after {
    bottom: -10px; }



/* 3DXY */
.hamburger--3dxy .hamburger-box {
  perspective: 80px; }

.hamburger--3dxy .hamburger-inner {
  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1); }
  .hamburger--3dxy .hamburger-inner::before, .hamburger--3dxy .hamburger-inner::after {
    transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1); }

.hamburger--3dxy.is-active .hamburger-inner {
  background-color: transparent !important;
  transform: rotateX(180deg) rotateY(180deg); }
  .hamburger--3dxy.is-active .hamburger-inner::before {
    transform: translate3d(0, 10px, 0) rotate(45deg); }
  .hamburger--3dxy.is-active .hamburger-inner::after {
    transform: translate3d(0, -10px, 0) rotate(-45deg); }

/* END HAMBURGER */






.main { max-width: 1600px; margin: auto; width: 100%; position: relative; }

.topspace { display: block; height: 50px; clear: both; }

img.banner { width: 100%; }

.banner-container { position: relative; text-align: center; margin-top: 10px; clear: both; }

.banner-container h2 { left: 0; right: 0; color: #fff; font-size: 44px; position: absolute; top: 300px; text-shadow: 0px 0px 10px rgba(0,0,0,0.8); font-weight: bold; margin: auto; }

@media only screen and (max-width: 1366px) { 
  .banner-container h2 { top: 242px; }
}

@media only screen and (max-width: 1024px) { 
  .banner-container h2 { font-size: 36px; top: 180px; }
}

@media only screen and (max-width: 768px) { 
  .banner-container h2 { font-size: 28px; top: 136px; }
}

@media only screen and (max-width: 600px) { 
  .banner-container h2 { font-size: 24px; top: 110px; }
}

@media only screen and (max-width: 414px) { 
  .banner-container h2 { font-size: 28px; top: 50px; }
}

@media screen and (max-width: 320px) {
  .banner-container h2 { font-size: 26px; top: 33px; }
}

.carousel div div { position: relative; }

.lone-booking { color: #999; border: 1px solid #999; display: block; clear: both; border-radius: 6px; padding: 12px; font-size: 16px; text-transform: uppercase;  position: absolute; display: block; background-color: transparent; left: 0; right: 0; margin: auto; width: 7%; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }
.lone-booking:hover { background-color: #858ce2; color: #fff; }

.booking { color: #858ce2; border: 1px solid #858ce2; border-radius: 6px; padding: 12px; font-size: 16px; text-transform: uppercase; display: block; position: absolute; background-color: transparent; margin: auto; width: 12%; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }

.booking:hover { background-color: #858ce2; color: #fff; }

.logo { width: 12%; }
.footer-logo { width: 50%; margin-bottom: 20px; }
.call { clear: both; float: right; font-size: 26px; color:#f8af00; font-family: Helvetica, sans-serif; }
.call a { font-weight: bold; color:#f8af00; }
.avatar { border-radius: 50px; width: 100px; margin-top: 10px; margin-bottom: 60px; float: left; }

.intro { display: block; width: 50%; text-align: center; padding: 60px 0; margin: auto; position: relative; }

.prev, .prevone { position: absolute; top: 39%; left: -20%; opacity: .5; width: 60px; height: 60px; border-left: 3px solid #f8af00; border-top: 3px solid #f8af00; transform: rotate(-45deg);}
.next, .nextone { transform: rotate(-45deg); position: absolute; top: 39%; right: -20%; opacity: .5; width: 60px; height: 60px; border-right: 3px solid #f8af00; border-bottom: 3px solid #f8af00; }

.prevcarousel { position: absolute; top: 40%; left: 3%; width: 90px; cursor: pointer; height: 90px; border-top: 3px solid #fff; border-left: 3px solid #fff; display: block; transform: rotate(-45deg);}
.nextcarousel { transform: rotate(-45deg); position: absolute; top: 40%; right: 3%; width: 90px; height: 90px; border-bottom: 3px solid #fff; border-right: 3px solid #fff; cursor: pointer; }



.prev:hover, .prevone:hover, .next:hover, .nextone:hover { opacity: 1; cursor: pointer; }

.packs, .benefits, .services, .stories, .clients { text-align: center; padding: 80px 0; position: relative;  }

@media only screen and (max-width: 1024px) { 
  .intro { width: 60%; padding: 30px 0; }
  .packs, .benefits, .services, .stories, .clients { padding: 40px 0; }
  .prevcarousel { width: 45px; height: 45px; }
  .nextcarousel { width: 45px; height: 45px; }
  .prev, .prevone { width: 40px; height: 40px; top: 44%; }
  .next, .nextone { width: 40px; height: 40px; top: 44%; }
}

@media only screen and (max-width: 768px) { 
  .services { padding: 20px 2%; }
  .benefits, .stories, .clients { padding: 0px 0; }
  .packs { padding: 0px 2%; }
}

@media only screen and (max-width: 414px) { 
      .intro { width: 94%; padding: 30px 0; }
      .prevcarousel { display: none; }
      .nextcarousel { display: none; }
  .prev, .prevone { width: 30px; height: 30px; top: 12%; left: 5%; }
  .next, .nextone { width: 30px; height: 30px; top: 12%; right: 5%; }
}

@media only screen and (max-width: 320px) { 
  .prev, .prevone { top: 11%; left: 2%; }
  .next, .nextone { top: 11%; right: 2%; }
}

.clients { padding-bottom: 20px; clear: both; } 

.clients img { width: 16%; } 

.products-holder { text-align: center; }

.products-holder a { max-width: 20%; float: left; margin: 30px 2% 30px 0; border: 1px solid #FFF; padding-bottom: 10px;
    color: #999;-webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }
.products-holder a.products-last { margin-right: 0; }

.products-holder a:hover { border: 1px solid #f8af00; color: #f8af00; }

.products-container { padding-left: 12%; }

.products { width: 100%; }


.benefits { position: relative; }
.benefits-booking { color: #999; border: 1px solid #999; bottom: 0px; display: block; clear: both; border-radius: 6px; padding: 12px; font-size: 16px; text-transform: uppercase;  position: absolute; display: block; background-color: transparent; left: 0; right: 0; margin: auto; width: 12%; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }

.benefits-booking:hover { background-color: #858ce2; color: #fff; border-color: #858ce2; }

.ask-a-question { text-align: center; float: none; color: #999; border: 1px solid #f8af00; bottom: 0px; display: block; clear: both; border-radius: 6px; padding: 12px; font-size: 16px; text-transform: uppercase; display: block; background-color: transparent; margin: auto; width: 12%; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }

.ask-a-question:hover { background-color: #f6c03f; color: #fff; border-color: #f8af00; cursor: pointer; }

@media only screen and (max-width: 1024px) { 
  .ask-a-question { width: 15%; }
}

@media only screen and (max-width: 768px) { 
  .ask-a-question { width: 20%; }
}

@media only screen and (max-width: 600px) { 
  .ask-a-question { width: 30%; }
  .products-holder a { max-width: 47%; }
  .products-container { padding-left: 2%; }
  .clients img { width: 40%; } 
}

@media only screen and (max-width: 414px) { 
  .ask-a-question { width: 44%; }
}

.stories { display: block; width: 40%; text-align: center; padding: 60px 0 10px 0; margin: auto; position: relative;  }

.pack { width: 27.5%; float: left; margin-bottom: 17px; text-align: center; color: #fff; padding: 2% 2% 5% 2%; position: relative; min-height: 220px; }



.pack h4 { font-size: 80px; line-height: 84px; margin-bottom: 0; font-weight: bold; }
.pack h5 { font-size: 34px; line-height: 38px; position: absolute; bottom: 84px; margin: auto; width: 86%; }
.pack h6 { font-size: 28px; line-height: 34px; font-weight: bold; margin-bottom: 0; }
.pack p { font-size: 22px; line-height: 26px; margin-bottom: 0; }

.packs-book { color: #fff; border: 1px solid #fff; bottom: 0px; display: block; clear: both; border-radius: 3px; padding: 12px; font-size: 16px; text-transform: uppercase;  position: absolute; display: block; background-color: #364e6b; left: 0; right: 0; margin: auto; width: 38%; bottom: 7%; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }

.pack-two .packs-book { background-color: #364e6b; }
.pack-three .packs-book { background-color: #364e6b; }
.pack-four .packs-book{ background-color: #364e6b; }
.pack-five .packs-book { background-color: #364e6b; }

@media only screen and (max-width: 1024px) { 
  .packs-book { width: 44%; }
}

@media only screen and (max-width: 768px) { 
  .packs-book { width: 64%; }
  .pack h5 { font-size: 22px; line-height: 26px; margin: auto; width: 88%; }
}

@media only screen and (max-width: 600px) { 
  .pack h5 { width: 95%; }
  .packs-book { width: 40%; }
}

@media only screen and (max-width: 414px) { 
  .packs-book { width: 50%; }
  .pack { min-height: 180px; }
}

@media only screen and (max-width: 320px) { 
  .packs-book { width: 56%; }
}

.packs-book:hover { background-color: #191e59; color: #fff; }

.wellbeing { width: 31.5%; float: left; margin-bottom: 30px; text-align: center; color: #666; min-height: 440px; }

@media only screen and (max-width: 1024px) { 
  .wellbeing { min-height: 370px; }
}

@media only screen and (max-width: 600px) { 
  .wellbeing { width: 48.5%; }
}

@media only screen and (max-width: 414px) { 
  .wellbeing { width: 94%; margin: auto; float: none; }
}

.wellbeingBox { 
    display: inline-block;
    overflow: hidden;
    width: 100%;
  }
  .wellbeingBox img {
    display: block; /* no whitespace */
    transition: .3s ease-in-out;
  }
  .wellbeingBox:hover img {
    transform: scale(1.1);
  }


.wellbeing-question { color: #999; border: 1px solid #999; bottom: 0px; display: block; clear: both; border-radius: 6px; padding: 12px; font-size: 16px; text-transform: uppercase;  position: absolute; display: block; background-color: transparent; left: 0; right: 0; margin: auto; width: 12%; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }

.wellbeing-question:hover { background-color: #858ce2; color: #fff; border-color: #858ce2; }


.pack-one { background-color: #f6c03f; }
.pack-two { background-color: #85b145; }
.pack-three { background-color: #4e6f1e; }
.pack-four { background-color: #708FDF; background-image:url("../images/ron-yoga.jpg"); background-size: 100% auto; }
.pack-five { background-color: #52C7CE; background-image:url("../images/more-nutrition.jpg"); background-size: 100% auto; }

.pack-right, #Tile1, #Tile4 { margin-right: 2.75%; }
.pack-left, #Tile3, #Tile6 { margin-left: 2.75%; }
.centered { width: 40%; margin: auto; }

.wide-pack { width: 45.2%; margin-bottom: 30px; margin-right: 1.1%; }
.wide-pack-right { margin-right: 0; }

.wellbeing-img { width: 100%; }

.benefit { width: 29.333333333%; height: 200px; float: left; margin-bottom: 30px; padding: 2%; text-align: center; font-family: 'ralewaymedium', Helvetica, sans-serif; font-size: 24px; color: #999; position: relative; }
.benefit img { margin-bottom: 15px; }

.img-top { position: absolute; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }

.img-top:hover { opacity: 0; }

@media only screen and (max-width: 768px) { 
  .centered { width: 60%; }
}

@media only screen and (max-width: 600px) { 
  .centered { width: 80%; }
  .pack-left, #Tile3, #Tile6 { margin-left: 0; }
  .pack-right, #Tile1, #Tile3, #Tile5 { margin-right: 2.75%; }
  #Tile4, #Tile6 { margin-right: 0; }
  .pack { width: 70%; float: none; margin: 0 auto 20px auto; }
}

@media only screen and (max-width: 414px) { 
  #Tile4, #Tile6 { margin-right: auto; }
  .pack-left, #Tile3, #Tile6 { margin-left: auto; }
  .pack-right, #Tile1, #Tile3, #Tile5 { margin-right: auto; }
  .pack { margin: 0 auto 40px auto; }
}

.content-holder { padding: 50px 10%; }
.content-holder p { font-size: 16px; width: 60%; }

.contentintro p { font-size: 20px; margin: 0 auto 0 auto; width: 60%; line-height: 24px; }
.contentintro { padding-bottom: 90px; }



.contentblocks { width: 100%; margin: 60px auto; text-align: left; display: block; clear: both; }
.contentblocks h2 { margin-bottom: 30px; }
.contentblocks p { float: left; }
.contentblockimg { width: 20%; float: left; margin-right: 30px; }


.contentblocklogo { width: 15%; text-align: center; float: left; padding-right: 5%; margin-bottom: 90px; }
.contentblocklogoimg { width: 100%; }

.brandlogo { width: 15%; margin: auto; display: inline-block; padding: 0 2%; }
.brandlogo img { width: 100%; }

.ProductsHolderPage .content-holder, .ProductTypePage .content-holder { text-align: center; padding: 30px 0; }
.ProductsHolderPage .content-holder > p { width: 50%; margin: 0 auto 60px auto; }
.product-type-image { width: 250px; float: left; }
.product-type-image-large { width: 500px; }
.product-type-content { float: left; width: 75%; padding-left: 5%; }
.product-type-content-half { width: 50%; }
.product-types { text-align: left; border-bottom: 1px solid #eaeaea; clear: both; padding-bottom: 10px; margin: 30px auto; width: 80%; }
.product-types p { float: left; width: 60%; padding-top: 100px; }
.product-type-content-half p { width: 100%; }
.ProductTypePage .product-types p { padding-top: initial; }

.detail { padding-top: 30px; color: #999; }

.view-products { clear: both; text-align: center; color: #999; border: 1px solid #f8af00; display: block; border-radius: 6px; padding: 12px; font-size: 16px; text-transform: uppercase; background-color: transparent; width: 17%; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }

.view-products:hover { background-color: #f6c03f; color: #fff; border-color: #f8af00; cursor: pointer; }

.go-back { clear: both; text-align: center; color: #999; border: 1px solid #f8af00; display: block; border-radius: 6px; padding: 12px; font-size: 16px; text-transform: uppercase; background-color: transparent; width: 7%; margin: auto; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }

.go-back:hover { background-color: #f6c03f; color: #fff; border-color: #f8af00; cursor: pointer; }


footer { background-image:url("../images/footer-bg.png"); background-position: 50% 50%; background-size: cover; background-repeat: no-repeat; padding: 2%; color: #fff; position: relative; margin-top: 30px; }

footer svg { width: 30%; }

.mobilefooternav { display: none; }


footer h3 { font-size: 22px; text-transform: uppercase; margin-top: -20px; margin-bottom: 50px; line-height: 23px; }
footer h4 { font-size: 20px; }

footer h2, footer h3, footer h4 { color: #fff; }

footer a { color: #fff; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; transition: all 1s ease-in-out; padding-bottom: 2px; }
footer a:hover { color: #fff; }

footer .border-bottom { width: 100%; height: 2px; background-color: #fff; display: block; }

.footer-column-a { width: 30%; display: block; float: left; margin-top: -20px; }

.footer-column-b { width: 13.3333333%; display: block; float: left; }

.footer-column-c { width: 70%; display: block; float: right; }

.footer-column-b ul { list-style-type: none; text-transform: uppercase; padding: 0; margin: 0; }

.footer-column-b li { list-style: none; font-size: 15px; }

.footer-column-b h4 { margin-bottom: 15px; }

.footer-column-c ul { padding: 0; margin: 0; width: 99%; }

.footer-column-c li { list-style: none; float: right; padding-left:	8%; }
.footer-column-c li.first { padding-left: 0; }

.footer-column-c p { position: absolute; right: 3%; bottom: 1%; }



.footer-booking { margin-top: 10px; color: #fff; border: 1px solid #fff; border-radius: 6px; padding: 12px; font-size: 16px; text-transform: uppercase; display: block; background-color: transparent; width: 30%; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }

.footer-booking:hover { background-color: #f6c03f; border-color: #f8af00; cursor: pointer; }

@media only screen and (max-width: 1366px) { 
  .product-type-content { width: 70%; }
  .view-products { width: 20%; }
  .footer-booking { width: 36%; }
}

@media only screen and (max-width: 1024px) { 
  .content-holder { padding: 50px 6%; }
  .content-holder p { width: 90%; }
  .view-products { width: 30%; }
  .contentblockimg { margin-bottom: 60px; }
  .product-type-content { width: 60%; }
  .footer-column-a { width: 20%; }
  .footer-column-c { width: 80%; }
  footer svg { width: 50%; }
  .footer-booking { width: 70%; }
}

.footer-column-c ul.submenu { width: 100%; }
.submenu li { float: none; padding-left: 0; }

.pack img { width: 38%; }
.pack-two img { width: 35%; }
.pack-one img { width: 50%; margin-top: -25px; }

.intro p { font-size: 20px; line-height: 25px; }

@media only screen and (max-width: 1024px) { 
  .intro p { font-size: 14px; line-height: 20px; }
}

@media only screen and (max-width: 768px) {
  .product-type-content { width: 100%; padding-left: 0; }
  .product-types {  text-align: center; }
  .content-holder p { width: 100%; }
  .contentintro > p { width: 90%; }
  .product-types p {  padding-top: 0; }
  .product-type-image { width: 80%; float: none; margin:auto;} 
  .view-products { margin: 0 auto 30px auto; }
  .pack img { width: 52%; }
  .pack-one img { width: 80%; margin-top: -25px; }
  .pack-two img { width: 60%; }
  .go-back { width: 24%; }
  .contentblocklogo { width: 25%; }
  .footer-column-a { width: 100%; float: none; text-align: center; margin-top: -20px; padding-top: 20px; }
  .footer-booking { width: 30%; margin: auto; float: none; }
  .footer-column-c { width: 100%; }
  .footer-column-c ul { width: 100%; margin-top: 40px; margin-bottom: 70px; }
  .footer-column-c ul.submenu { margin-top: 0; }
  footer svg { width: 16%; }
  .footer-column-c li { padding-left: 0; padding-right: 7%; }
  .footer-column-c p { position: absolute; right: 0; left: 0; margin: 0 auto 30px auto; width: 100%; text-align: center; bottom: 1%; }
  footer h3 { margin-bottom: 20px; }
}

@media only screen and (max-width: 600px) { 
  .pack img { width: 31%; }
  .pack-one img { width: 40%; margin-top: -20px; }
  .pack-two img { width: 30%; }
  .contentblockimg { margin-bottom: 120px; }
  form { width: 70%; }
  .footer-column-c li { padding-right: 4%; }
}

@media only screen and (max-width: 414px) { 
  form { width: 96%; }
  .content-holder p { width: 100%; }
  .view-products { width: 40%; }
  .contentintro > p { width: 90%; }
  .contentblockimg { width: 100%; float: none; margin-right: 0; margin-bottom: 28px; }
  .contentblocklogo { width: 40%; }
  .footernav { display: none; }
  .mobilefooternav { display: block; }
  .footer-booking { width: 44%; }
  .footer-column-c li { padding-right: 0; float: none; width: 100%; text-align: center; }
  .footer-column-c { margin-bottom: 100px; }
  .footer-column-c ul { margin-bottom: 20px; }
  .footer-column-c p { width: 90%; }
  footer svg { width: 30%; }
}

@media only screen and (max-width: 375px) { 
  .contentblocklogo { width: 70%; }
}

@media only screen and (max-width: 320px) { 
  .contentintro{ padding-bottom: 30px; }
}

.modal-window {
  position: fixed;
  background-color: rgba(0, 0, 0, 0.5);
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 999;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transition: all 0.3s;
}
.modal-window:target {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
  }
.modal-window > div {
    width: 400px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 2em;
    background: white;
    border-radius: 9px;
  }

  .modal-close {
  color: #aaa;
  line-height: 50px;
  font-size: 50px;
  position: absolute;
  right: 0;
  text-align: center;
  top: 0;
  width: 70px;
  text-decoration: none;
  transform: rotate(45deg);
  font-family: 'ralewaymedium', Helvetica, sans-serif;
}
  .modal-close:hover {
    color: black;
  }

#Form_PopForm { width: 96%; }
#Form_PopForm input, #Form_PopForm textarea, #Form_ContactForm input, #Form_ContactForm textarea { outline: none; -webkit-box-shadow: none; box-shadow: none; }
#Form_PopForm_action_sendPopForm, #Form_ContactForm_action_sendContactForm { text-align: center; float: none; color: #999; border: 1px solid #f8af00; bottom: 0px; display: block; clear: both; border-radius: 6px; padding: 12px; font-size: 16px; text-transform: uppercase; display: block; background-color: transparent; width: 40%; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; }
#Form_PopForm_action_sendPopForm:hover, #Form_ContactForm_action_sendContactForm:hover { background-color: #f6c03f; color: #fff; border-color: #f8af00; cursor: pointer; }


@media only screen and (max-width: 414px) { 
  .modal-window > div { width: 76%; }
}

@media only screen and (max-width: 375px) { 
  .view-products { width: 50%; }
  footer h3 { font-size: 20px; }
}

@media only screen and (max-width: 320px) { 
  .view-products { width: 54%; }
  footer h3 { font-size: 20px; }
}


.text-justify { text-align: justify; }



#Form_ContactForm_ConfirmEmail_Holder, #Form_PopForm_ConfirmEmail_Holder { margin-left: -5000px; }