/* ===============================================
		CONFIG MODULES
===============================================	*/
/* ===============================================
		Fonts Families

		- Set font display rules in Mixins
===============================================	*/
/* ===============================================
		Font Sizes & Weights
===============================================	*/
/* ===============================================
		Colors
===============================================	*/
/* ===============================================
		Break Points
===============================================	*/
/* ===============================================
		Spacing 
===============================================	*/
/* ===============================================
    Transition
=============================================== */
/* ===============================================
    Grid
=============================================== */
/* ===============================================
    Form Inputs
=============================================== */
/* ===============================================
    Button
=============================================== */
/* ===============================================
		Flexbox
		@include flexbox(row, $mobile);
===============================================	*/
/* ===============================================
		Row Machine
		@include rowMachine(3,5%,$mobile);
===============================================	*/
/* ===============================================
    Responsive Font Size
    @include font-size(12px, 18px); 

    Will scale fronts between the range 12px to 18px
=============================================== */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
main,
nav,
section,
cite {
  display: block; }

html {
  height: 100%; }

body {
  line-height: 1;
  min-height: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -o-font-smoothing: antialiased;
  font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  -webkit-text-size-adjust: none; }

ol,
ul {
  list-style: none; }

blockquote,
q {
  quotes: none; }

blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none; }

*,
*:after,
*:before {
  min-height: 0;
  min-width: 0;
  box-sizing: border-box; }

/* ===============================================
 		Restore Google Maps Images
 ===============================================	*/
.google-maps-link {
  max-width: 100%; }

.gmnoprint img {
  max-width: none;
  z-index: 9999; }

/* ===============================================
		Wordpress admin
===============================================	*/
#wpadminbar #wp-admin-bar-my-account.with-avatar > a img,
#wp-admin-bar-user-info .avatar {
  min-width: 0px; }

/* ===============================================
		Group Clearfix
===============================================	*/
.group:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0; }

.group {
  display: inline-block; }

/* start commented backslash hack \*/
* html .group {
  height: 1%; }

.group {
  display: block; }

/* ===============================================
		No Script 
===============================================	*/
.no-js [data-srcset] {
  display: none; }

#noscript-warning {
  position: fixed;
  top: 150px;
  width: 30%;
  max-width: 450px;
  background: #000000;
  color: #F1EDE5;
  padding-top: 2em;
  padding-bottom: 2em;
  text-align: center;
  z-index: 0;
  line-height: 24px;
  padding-left: 1em;
  padding-right: 1em; }
  @media (max-width: 415px) {
    #noscript-warning {
      display: none; } }

/* Global Styles */
html {
  font-size: 10px; }

@media (min-width: 767px) and (max-width: 1420px) {
  html {
    font-size: calc(10px + 6 * (100vw - 767px) / 653); } }

@media (min-width: 1420px) {
  html {
    font-size: 16px; } }

@media (max-width: 767px) {
  html {
    font-size: 16px; } }

html,
body {
  font-family: "Public Sans", sans-serif;
  line-height: 1.4;
  fill: currentColor; }
  @media (max-width: 415px) {
    html,
    body {
      overflow-x: hidden; } }

body {
  color: #000000;
  background: #F1EDE5;
  overflow-y: scroll;
  overflow-x: hidden;
  max-width: 100vw;
  position: relative; }

.btn a,
.tiny-mce-btn {
  cursor: pointer;
  color: currentColor;
  background: transparent;
  display: inline-block;
  padding: 1rem 1.66rem;
  line-height: .8125rem;
  font-size: .8125rem;
  vertical-align: text-bottom;
  border: 2px solid;
  text-align: center;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  -webkit-appearance: none;
  text-transform: uppercase;
  border-radius: 50em;
  text-shadow: none;
  color: inherit; }
  .btn a:hover,
  .tiny-mce-btn:hover {
    box-shadow: 2px 3px 1px currentColor; }
  .btn a:active,
  .tiny-mce-btn:active {
    box-shadow: 2px 1px 1px currentColor; }
  .btn a:focus,
  .tiny-mce-btn:focus {
    box-shadow: 2px 3px 1px currentColor; }

button {
  background: transparent;
  -webkit-appearance: none;
  color: currentColor;
  border: none;
  padding: 0;
  text-align: left;
  outline: none;
  font-size: inherit;
  font-family: inherit; }
  button:focus {
    background: none; }

button.btn {
  cursor: pointer;
  color: currentColor;
  background: transparent;
  display: inline-block;
  padding: 1rem 1.66rem;
  line-height: .8125rem;
  font-size: .8125rem;
  vertical-align: text-bottom;
  border: 2px solid;
  text-align: center;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  -webkit-appearance: none;
  text-transform: uppercase;
  border-radius: 50em;
  text-shadow: none;
  color: inherit; }
  button.btn:hover {
    box-shadow: 2px 3px 1px currentColor; }
  button.btn:active {
    box-shadow: 2px 1px 1px currentColor; }
  button.btn:focus {
    box-shadow: 2px 3px 1px currentColor; }

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

a:focus {
  outline: none; }

img {
  max-width: 100%;
  -o-object-fit: contain;
     object-fit: contain; }

figure.image {
  font-size: 0; }

/* ===============================================
		Responsive helper classes. 
===============================================	*/
@media (max-width: 767px) {
  .large-screen {
    display: none; } }

@media (min-width: 767px) {
  .small-screen {
    display: none !important; } }

.touch-screen {
  display: none; }

@media (hover: none) and (pointer: coarse) {
  .touch-screen {
    display: block; } }

/* ===============================================
    Buttons
=============================================== */
/* ===============================================
		js classes
===============================================	*/
.visually_hidden {
  opacity: 0;
  visibility: hidden; }

/* ===============================================
		Overflows
===============================================	*/
.overflow-x {
  overflow-x: visible; }

/* ===============================================
		IE WARNING
===============================================	*/
.ie-warning {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  min-height: 150px;
  padding: 20px;
  background: red;
  color: white;
  z-index: 9999; }
  .ie-warning h1 {
    font-size: 22px; }

abbr {
  border-bottom: none;
  text-decoration: none; }

/* ===============================================
    Titles & Text Styles
=============================================== */
/* ===============================================
    Grid Wrap
=============================================== */
body {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
  -webkit-box-pack: center;
          justify-content: center;
  -webkit-box-align: center;
          align-items: center; }

.main {
  display: grid;
  grid-template-columns: auto 1rem repeat(12, 96.6666666667px) 1rem auto;
  grid-gap: 0;
  box-sizing: content-box; }
  @media (max-width: 1420px) {
    .main {
      grid-template-columns: 5% 1rem repeat(12, 1fr) 1rem 5%; } }
  @media (max-width: 767px) {
    .main {
      display: grid;
      grid-template-columns: auto 1rem repeat(2, 580px) 1rem auto;
      grid-gap: 0;
      box-sizing: content-box; } }
  @media (max-width: 767px) and (max-width: 1420px) {
    .main {
      grid-template-columns: 5% 1rem repeat(2, 1fr) 1rem 5%; } }

.adrift-surf-logo {
  grid-column: 5/10;
  grid-row: 1/2; }

.the-other-side-of-surfing {
  grid-column: 10/12;
  grid-row: 1/2;
  -webkit-transform: translateY(3rem);
          transform: translateY(3rem); }

.sufboard-fin {
  grid-column: 4/7;
  grid-row: 3/5;
  -webkit-transform: translateY(-40%);
          transform: translateY(-40%); }

.wave {
  grid-column: 10/13;
  grid-row: 1/4;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;
  -webkit-box-pack: center;
          justify-content: center;
  -webkit-transform: translateY(10%);
          transform: translateY(10%); }

.text-container {
  grid-column: 6/10;
  text-align: center;
  grid-row: 2/3;
  padding: 2rem 0; }

.address,
.opening-hours,
.contact-phone {
  padding-bottom: 1rem; }

@media (max-width: 767px) {
  svg {
    width: 100%; }
  .adrift-surf-logo {
    grid-column: 3/4;
    grid-row: 1/2;
    -webkit-transform: translateY(1rem);
            transform: translateY(1rem); }
  .the-other-side-of-surfing {
    grid-column: 4/5;
    grid-row: 1/2;
    -webkit-transform: translateY(0rem);
            transform: translateY(0rem); }
  .sufboard-fin {
    grid-column: 3/4;
    grid-row: 4/5;
    -webkit-transform: translateY(0);
            transform: translateY(0);
    margin-top: -4rem; }
  .wave {
    grid-column: 4/5;
    grid-row: 3/4;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-direction: column;
    -webkit-box-pack: center;
            justify-content: center;
    -webkit-transform: translateY(-10%);
            transform: translateY(-10%); }
  .text-container {
    grid-column: 2/5;
    text-align: center;
    grid-row: 2/3;
    padding: 2rem 0; }
  .address,
  .opening-hours,
  .contact-phone {
    padding-bottom: 1rem; } }

/*
     _ _      _       _
 ___| (_) ___| | __  (_)___
/ __| | |/ __| |/ /  | / __|
\__ \ | | (__|   < _ | \__ \
|___/_|_|\___|_|\_(_)/ |___/
                   |__/

 Version: 1.6.0
  Author: Ken Wheeler
 Website: http://kenwheeler.github.io
    Docs: http://kenwheeler.github.io/slick
    Repo: http://github.com/kenwheeler/slick
  Issues: http://github.com/kenwheeler/slick/issues

 */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent; }

.slick-list {
  position: relative;
  display: block;
  overflow: visible;
  margin: 0;
  padding: 0; }

.slick-list:focus {
  outline: none; }

.slick-list.dragging {
  cursor: pointer;
  cursor: hand; }

.slick-active:focus,
.slick-slide:focus {
  outline: 0; }

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0); }

.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block; }

.slick-track:before,
.slick-track:after {
  display: table;
  content: ''; }

.slick-track:after {
  clear: both; }

.slick-loading .slick-track {
  visibility: hidden; }

.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px; }

[dir='rtl'] .slick-slide {
  float: right; }

.slick-slide img {
  display: block; }

.slick-slide.slick-loading img {
  display: none; }

.slick-slide.dragging img {
  pointer-events: none; }

.slick-initialized .slick-slide {
  display: block; }

.slick-loading .slick-slide {
  visibility: hidden; }

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent; }

.slick-arrow.slick-hidden {
  display: none; }

.post-previews--prev,
.post-previews--next {
  fill: #163e49;
  cursor: pointer;
  width: 66px; }
  .post-previews--prev:hover,
  .post-previews--next:hover {
    fill: #b69588; }

.slick-dots-container {
  position: absolute;
  bottom: 3rem;
  display: grid;
  grid-template-columns: auto 1rem repeat(12, 96.6666666667px) 1rem auto;
  grid-gap: 0;
  box-sizing: content-box;
  width: 100%; }
  @media (max-width: 1420px) {
    .slick-dots-container {
      grid-template-columns: 5% 1rem repeat(12, 1fr) 1rem 5%; } }
  .slick-dots-container .slick-dots {
    grid-column: 3/14; }
  .slick-dots-container li {
    display: inline-block;
    padding-right: .5rem; }
  .slick-dots-container button {
    height: 1rem;
    width: 1rem;
    font-size: 0px;
    background: #F1EDE5;
    border-radius: 100%;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out; }
    .slick-dots-container button:hover {
      background: #163e49; }

/* ===============================================
    Lightbox 
=============================================== */
#lightbox-container.lightbox-active {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.8);
  z-index: 50; }

#imagelightbox {
  position: fixed;
  z-index: 51;
  touch-action: none; }

body.lightbox-active {
  background: yellow; }

/* ===============================================
		Modules
===============================================	*/
/* ===============================================
	 Posts
=============================================== */
/* ===============================================
		Partials
===============================================	*/
.animate-load {
  opacity: 0;
  -webkit-transition: opacity .6s ease-in-out, -webkit-transform 1s ease-in-out;
  transition: opacity .6s ease-in-out, -webkit-transform 1s ease-in-out;
  transition: opacity .6s ease-in-out, transform 1s ease-in-out;
  transition: opacity .6s ease-in-out, transform 1s ease-in-out, -webkit-transform 1s ease-in-out; }

.animate-transform {
  -webkit-transform: translate(-0.5rem, -0.5rem) scale(1);
          transform: translate(-0.5rem, -0.5rem) scale(1); }

.view-detected.animate-load {
  opacity: 1;
  -webkit-transform: translate(0, 0) scale(1);
          transform: translate(0, 0) scale(1); }

/* ===============================================
  opacity    
=============================================== */
.load-delay--01,
.load-delay--1 {
  -webkit-transition-delay: .2s;
          transition-delay: .2s; }

.load-delay--02,
.load-delay--2 {
  -webkit-transition-delay: .4s;
          transition-delay: .4s; }

.load-delay--03,
.load-delay--3 {
  -webkit-transition-delay: .6s;
          transition-delay: .6s; }

.load-delay--04,
.load-delay--4 {
  -webkit-transition-delay: .8s;
          transition-delay: .8s; }

.load-delay--05,
.load-delay--5 {
  -webkit-transition-delay: 1.0s;
          transition-delay: 1.0s; }

.load-delay--06,
.load-delay--6 {
  -webkit-transition-delay: 1.2s;
          transition-delay: 1.2s; }

.load-delay--07,
.load-delay--7 {
  -webkit-transition-delay: 1.4s;
          transition-delay: 1.4s; }

.load-delay--08,
.load-delay--8 {
  -webkit-transition-delay: 1.6s;
          transition-delay: 1.6s; }

.load-delay--09,
.load-delay--9 {
  -webkit-transition-delay: 1.8s;
          transition-delay: 1.8s; }

.load-delay--10 {
  -webkit-transition-delay: 2s;
          transition-delay: 2s; }

.load-delay--11 {
  -webkit-transition-delay: 2.2s;
          transition-delay: 2.2s; }

.load-delay--12 {
  -webkit-transition-delay: 2.4s;
          transition-delay: 2.4s; }

.load-delay--13 {
  -webkit-transition-delay: 2.6s;
          transition-delay: 2.6s; }

.load-delay--14 {
  -webkit-transition-delay: 2.8s;
          transition-delay: 2.8s; }

.load-delay--15 {
  -webkit-transition-delay: 3.0s;
          transition-delay: 3.0s; }

.load-delay--16 {
  -webkit-transition-delay: 3.2s;
          transition-delay: 3.2s; }

.load-delay--17 {
  -webkit-transition-delay: 3.4s;
          transition-delay: 3.4s; }

.load-delay--18 {
  -webkit-transition-delay: 3.6s;
          transition-delay: 3.6s; }

.load-delay--19 {
  -webkit-transition-delay: 3.8s;
          transition-delay: 3.8s; }

.load-delay--20 {
  -webkit-transition-delay: 4s;
          transition-delay: 4s; }

.load-delay--21 {
  -webkit-transition-delay: 4.2s;
          transition-delay: 4.2s; }

.load-delay--22 {
  -webkit-transition-delay: 4.4s;
          transition-delay: 4.4s; }

.load-delay--23 {
  -webkit-transition-delay: 4.6s;
          transition-delay: 4.6s; }

.load-delay--24 {
  -webkit-transition-delay: 4.8s;
          transition-delay: 4.8s; }

.load-delay--25 {
  -webkit-transition-delay: 5.0s;
          transition-delay: 5.0s; }

.load-delay--26 {
  -webkit-transition-delay: 5.2s;
          transition-delay: 5.2s; }

.load-delay--27 {
  -webkit-transition-delay: 5.4s;
          transition-delay: 5.4s; }

.load-delay--28 {
  -webkit-transition-delay: 5.6s;
          transition-delay: 5.6s; }

.load-delay--29 {
  -webkit-transition-delay: 5.8s;
          transition-delay: 5.8s; }

.load-delay--30 {
  -webkit-transition-delay: 6s;
          transition-delay: 6s; }

/* ===============================================
    Transform
=============================================== */
.load-move--up {
  -webkit-transform: translate(0, 10px);
          transform: translate(0, 10px); }

.load-move--down {
  -webkit-transform: translate(0, -10px);
          transform: translate(0, -10px); }

.load-move--left {
  -webkit-transform: translate(10px, 0px);
          transform: translate(10px, 0px); }

.load-move--right {
  -webkit-transform: translate(-10px, 0px);
          transform: translate(-10px, 0px); }

.load-move--up-left {
  -webkit-transform: translate(10px, 10px);
          transform: translate(10px, 10px); }

.load-move--up-right {
  -webkit-transform: translate(-10px, 10px);
          transform: translate(-10px, 10px); }

.load-move--down-left {
  -webkit-transform: translate(10px, -10px);
          transform: translate(10px, -10px); }

.load-move--down-right {
  -webkit-transform: translate(-10px, -10px);
          transform: translate(-10px, -10px); }

/* ===============================================
    Scale 
=============================================== */
.load-scale--up {
  -webkit-transform: scale(0.8);
          transform: scale(0.8); }

.load-scale--down {
  -webkit-transform: scale(1.6);
          transform: scale(1.6); }

.input::-webkit-input-placeholder {
  color: inherit;
  opacity: 1;
  font-family: "Public Sans", sans-serif;
  -webkit-transition: color .5s ease-in;
  transition: color .5s ease-in;
  font-size: 1rem; }
  .input::-webkit-input-placeholder:focus {
    color: #F1EDE5; }

.input:-ms-input-placeholder {
  color: inherit;
  opacity: 1;
  font-family: "Public Sans", sans-serif;
  -webkit-transition: color .5s ease-in;
  transition: color .5s ease-in;
  font-size: 1rem; }
  .input:-ms-input-placeholder:focus {
    color: #F1EDE5; }

.input:-moz-placeholder {
  color: inherit;
  opacity: 1;
  font-family: "Public Sans", sans-serif;
  -webkit-transition: color .5s ease-in;
  transition: color .5s ease-in;
  font-size: 1rem; }
  .input:-moz-placeholder:focus {
    color: #F1EDE5; }

.input::-moz-placeholder {
  color: inherit;
  opacity: 1;
  font-family: "Public Sans", sans-serif;
  -webkit-transition: color .5s ease-in;
  transition: color .5s ease-in;
  font-size: 1rem; }
  .input::-moz-placeholder:focus {
    color: #F1EDE5; }

/* ===============================================
		Autofill 
===============================================	*/
/* This overides the google autofill background yellow styling. Puts a white box shadow over it */
input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px lightgrey inset; }

/* ===============================================
		Form Defaults
===============================================	*/
.input__label {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
          flex-direction: row-reverse;
  -webkit-box-align: center;
          align-items: center;
  width: 100%;
  margin-bottom: 1rem;
  font-family: "Public Sans", sans-serif; }
  .input__label span {
    font-size: 0;
    padding-right: 1em;
    -webkit-transition: font-size 0.3s ease-in-out;
    transition: font-size 0.3s ease-in-out; }
  .input__label .input_label--always-visible {
    font-size: 1rem;
    -webkit-box-flex: 1;
            flex: 1; }

.input__label--checkbox {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
  -webkit-box-align: center;
          align-items: center; }
  .input__label--checkbox span {
    -webkit-box-flex: 1;
            flex: 1;
    padding-left: 1rem; }
  .input__label--checkbox a {
    color: #163e49; }

.input:focus + span {
  font-size: 1rem; }

.input,
.input--text-area,
.input-text {
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  border-radius: 0;
  border: 1px solid #163e49;
  background: #F1EDE5;
  font-family: "Public Sans", sans-serif;
  padding: .88rem 1.66rem;
  line-height: 1;
  font-size: 1rem;
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  -webkit-box-flex: 3;
          flex: 3; }
  .input:focus,
  .input--text-area:focus,
  .input-text:focus {
    outline: none; }

.input--select {
  border: 1px solid #163e49;
  border-radius: 0;
  background: #F1EDE5;
  font-size: 1rem;
  width: 100%;
  padding: .88rem 1.66rem;
  color: #8c8c8c; }
  .input--select option:first-of-type {
    color: #595959; }
  .input--select option:hover,
  .input--select option:checked {
    color: #000000; }

/* ===============================================
	Text Area
=============================================== */
.input--text-area {
  resize: vertical;
  min-height: 6rem; }

/* ===============================================
		Radion Button 
=============================================== */
.radio__container {
  font-size: 1rem;
  padding-bottom: 1rem; }

.input--radio-option {
  display: block;
  margin-top: .4rem;
  margin-bottom: .4rem; }

.input--radio-option-label {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
  -webkit-box-align: center;
          align-items: center;
  background: #F1EDE5;
  padding: .2rem 0;
  border: 1px solid transparent;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }

.radio__button {
  display: none; }

.radio__button:hover + .input--radio-option-label {
  cursor: pointer; }
  .radio__button:hover + .input--radio-option-label .radio-button-icon {
    fill: #39a2bf; }

.radio__button:checked + .input--radio-option-label .radio-button-icon {
  fill: #163e49; }

.radio-button-icon {
  width: 1rem;
  fill: #F1EDE5;
  margin-right: 1rem; }

#radio-button-icon-border {
  fill: #163e49; }

.radio__button:checked + .input--radio-option-label .radio-button-icon #radio-button-icon-check {
  fill: #163e49; }

.input--radio-option {
  outline: none; }

/* ===============================================
		Error 
===============================================	*/
.error::-webkit-input-placeholder,
.error:-moz-placeholder,
.error::-moz-placeholder,
error:-ms-input-placeholder {
  color: #cc0000; }

/* ===============================================
		Button 
=============================================== */
.button-container .required {
  float: left; }

.button-container .form_submit_button {
  float: right; }

.form_submit_button {
  cursor: pointer;
  color: currentColor;
  background: transparent;
  display: inline-block;
  padding: 1rem 1.66rem;
  line-height: .8125rem;
  font-size: .8125rem;
  vertical-align: text-bottom;
  border: 2px solid;
  text-align: center;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  -webkit-appearance: none;
  text-transform: uppercase;
  border-radius: 50em;
  text-shadow: none;
  color: inherit; }
  .form_submit_button:hover {
    box-shadow: 2px 3px 1px currentColor; }
  .form_submit_button:active {
    box-shadow: 2px 1px 1px currentColor; }
  .form_submit_button:focus {
    box-shadow: 2px 3px 1px currentColor; }

/* ===============================================
    Image Proportions / Ratios
=============================================== */
.image--image__square {
  padding-bottom: 100%; }

.image--image__portrait {
  padding-bottom: 125%; }

.image--image__landscape {
  padding-bottom: 68%; }

.image--image__panorama {
  padding-bottom: 24%; }

/* ===============================================
		Background Image
===============================================	*/
.image {
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  z-index: 1; }

.background-size--cover {
  background-size: cover; }

.background-size--contain {
  background-size: contain; }

/* ===============================================
		CMS Helper Functions
===============================================	*/
.background-position--center--top {
  background-position: center top; }

.background-position--left--top {
  background-position: left top; }

.background-position--right--top {
  background-position: right top; }

.background-position--left--center {
  background-position: left center; }

.background-position--center--center {
  background-position: center center; }

.background-position--right--center {
  background-position: right center; }

.background-position--left--bottom {
  background-position: left bottom; }

.background-position--center--bottom {
  background-position: center bottom; }

.background-position--right--botton {
  background-position: right bottom; }

.module--bookings-modal {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 20;
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
  -webkit-box-pack: center;
          justify-content: center;
  -webkit-box-align: center;
          align-items: center;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
  padding-top: 4em; }
  .module--bookings-modal .module-content {
    background: #163e49;
    border: 25px solid #F1EDE5;
    padding: 25px;
    position: relative;
    max-width: 500px;
    width: 40vw; }
    @media (max-width: 767px) {
      .module--bookings-modal .module-content {
        width: 80vw;
        font-size: 14px; } }
  .module--bookings-modal .title {
    text-align: center;
    color: #F1EDE5;
    font-size: 36px;
    line-height: 1.16;
    padding-bottom: .5em; }
    @media (max-width: 767px) {
      .module--bookings-modal .title {
        text-align: left; } }

.bookings_visible {
  overflow: hidden; }
  .bookings_visible .module--bookings-modal {
    opacity: 1;
    visibility: visible;
    -webkit-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
    padding-top: 0; }

.close-modal-button {
  stroke: #F1EDE5;
  width: 44px;
  height: 44px;
  position: absolute;
  top: -70px;
  right: -70px; }
  @media (max-width: 767px) {
    .close-modal-button {
      height: 30px;
      width: 30px;
      right: -22px; } }

.module-content {
  position: relative; }

.overlay-container {
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: grid;
  grid-template-columns: auto 1rem repeat(12, 96.6666666667px) 1rem auto;
  grid-gap: 0;
  box-sizing: content-box; }
  @media (max-width: 1420px) {
    .overlay-container {
      grid-template-columns: 5% 1rem repeat(12, 1fr) 1rem 5%; } }
  .overlay-container .overlay-content {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
            flex-direction: column;
    -webkit-box-pack: center;
            justify-content: center; }
  .overlay-container .overlay-alignment--left {
    grid-column: 3/7; }
  .overlay-container .overlay-alignment--center {
    grid-column: 7/12; }
  .overlay-container .overlay-alignment--right {
    grid-column: 11/15; }

/* ===============================================
    Overlay Positioning
=============================================== */
.overlay-position--top {
  -webkit-box-pack: start;
          justify-content: flex-start; }

.overlay-position--center {
  -webkit-box-pack: center;
          justify-content: center; }

.overlay-position--bottom {
  -webkit-box-pack: end;
          justify-content: flex-end; }

.social-media-icons .social-icon {
  width: 2rem; }

.social-icon {
  fill: #F1EDE5;
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out; }
  .social-icon:hover {
    fill: #163e49; }