@font-face {
    font-family: 'Montserrat-Thin';
    src: url('../fonts/Montserrat-Thin.otf');
}

@font-face {
    font-family: 'Montserrat';
    src: url('../fonts/Montserrat-Regular.otf');
}

@font-face {
    font-family: 'Montserrat-Light';
    src: url('../fonts/Montserrat-Light.otf');
}

@font-face {
    font-family: 'Montserrat-SemiBold';
    src: url('../fonts/Montserrat-SemiBold.otf');
}

@font-face {
    font-family: 'Montserrat-Bold';
    src: url('../fonts/Montserrat-Bold.otf');
}

@font-face {
    font-family: 'Merriweather';
    src: url('../fonts/Merriweather-Regular.ttf');
}

@font-face {
    font-family: 'Merriweather-Bold';
    src: url('../fonts/Merriweather-Bold.ttf');
}

/* css reset */
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, font, 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 {
	margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;
}
body {line-height: 1;}
ol, ul {list-style: none;}
table {border-collapse: collapse; border-spacing: 0;}
td, th {text-align: left; vertical-align: top}
header, section, article, aside, nav, footer {display: block;}

body {background: #fff; color: #191919; font-family: 'Montserrat-Light', sans-serif; font-size: 16px; position: relative;}

/*
colors

*/

.l {text-align: left !important;}
.r {text-align: right;}
.c {text-align: center;}
.nowrap {white-space: nowrap;}
.pt10 {padding-top: 10px}


a {color: white; text-decoration: none; outline: none; transition: all .3s;}
.hilight {background-color: yellow !important;}

p {margin: 0 0 1em;}
hr {border: 6px solid #eee; border-width: 6px 0 0; margin: 3em 0; height: 1px; clear: both;}

h1 span {display: block; font-size: 30px; line-height: 1;}
h1 {font-family: 'Merriweather',serif; font-weight: normal; font-size: 46px; margin: 0 0 .2em; line-height: 1;max-width: 1200px;}
h2 {font-family: 'Merriweather', serif; font-weight: normal; font-size: 30px; margin: 0 0 .4em;line-height: 38px;}
.orange{ color: #e28e17;}
h3 {font-family: 'Merriweather', serif;font-size: 28px; margin:30px 0;line-height: 32px;}
a.button {color: #fff; display: inline-block; text-transform: uppercase; background: #e1660b; padding: 10px 14px; letter-spacing: .65px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; text-align: center;}
a.button:hover {background-color: #c85b0a !important;}
article.content h1 {margin-top: 100px; text-align: center;color: #022c52;}
article.content h2 {
  font-size: 35px;
  line-height: 45px;
  margin: 40px auto;
  color: #17b3c0;
  text-align: center;
}
article.content h4 {text-align: center;margin-top: 30px;font-size: 25px;font-weight: normal;}
article.content a {color: #17b3c0;}

strong {font-weight: 500;}
#index strong {font-size: 120%;}

#index h1{font-size: 40px;}
#index h1 span{font-size: 30px;margin-top: 10px;}

.fancybox.video {position: relative; cursor: pointer;}
.fancybox.video:before {content: ""; background: #333; width: 50px; height: 50px; position: absolute; top: 50%; left: 50%; margin: -40px 0 0 -25px; z-index: 1; -webkit-border-radius: 500px; -moz-border-radius: 500px; border-radius: 500px;}
.fancybox.video:after {content: ""; width: 0; height: 0; border-top: 12px solid transparent; border-bottom: 12px solid transparent; border-left: 20px solid #fff; position: absolute; top: 50%; left: 50%; margin: -27px 0 0 -6px; z-index: 1;}
.fancybox.video:hover:before {background: #df5327;}

header {background: rgba(255,255,255,.95); position: fixed; width: 100%; z-index: 10000;}
.touch header {position: relative;}
.logo {float: left; margin: 20px 0 20px 20px;}
.mobile-logo {display: none; position: absolute;  top: 24px; width: 250px;left: 15px;}
nav {float: right; margin: 8px 16px;}
nav li {display: inline; text-transform: uppercase; font-size: 16px; font-weight: 400;font-family: 'Montserrat';padding:15px 5px;-webkit-font-smoothing: antialiased;}
nav li.active {background-color: white;border-top-right-radius: 4px;border-top-left-radius: 4px;border: 2px solid #15b3cb;border-bottom: 0;padding:15px 3px;}
nav li.active a {color:#15b3cb !important;position: relative;z-index: 2; }
nav li a {padding: 10px;cursor: pointer;}
@media only screen and (min-width: 1024px) and (max-width : 1200px) {
  nav li a {
    padding: 10px 5px;
  }
}
@media only screen and (min-width : 1200px) {
  nav li a {
    padding: 10px;
  }
}
nav li a, nav li a:visited {color: #000;}
nav li a:hover {color: #df5327;}
nav li.current a {color: #888;}
nav li a.button {color: #fff; margin-left: 30px; font-size: 14px;line-height: 17px;width: 180px;}
nav li .submenu {
  display: none;
  position: absolute;
  background-color: white;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
  border: 2px solid #15b3cb;
  width: 300px;
  height: 240px;
  z-index: -1;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  border-top-right-radius: 4px;-webkit-box-shadow: -2px 12px 15px 0px rgba(0,0,0,0.2);
  -moz-box-shadow: -2px 12px 15px 0px rgba(0,0,0,0.2);
  box-shadow: -2px 12px 15px 0px rgba(0,0,0,0.2);
}
nav li .submenu .menu-item { color:  #15b3cb; text-transform: uppercase; padding: 10px;padding-top: 0;}
nav li .submenu .menu-item a { display: block; border-top: 1.5px solid #e3e4e9; width: calc(100% -20px); padding-left: 2px;padding-bottom: 0;}
nav li .submenu .menu-item a#first-link {border-top: none;}
nav li .submenu .menu-item a:hover {font-family: 'Montserrat-SemiBold'; color: #022c52 !important;}
section {line-height: 1.3;}
.touch section {padding-top: 0;}
.inner {max-width: 1200px; margin: 0 auto; position: relative;}
#index .highlight{ font-weight: bold;}

#index article, #banner {color: #fff; font-size: 16px; min-height: 435px; -webkit-background-size: cover !important; -moz-background-size: cover !important; -o-background-size: cover !important; background-size: cover !important; position: relative; clear: both;}
#index article .content, #banner .content {position: relative; z-index: 100; min-width: 400px; max-width: 42%; padding: 20px;}
body:not(#index) article {padding: 60px; overflow: auto;}
#banner {text-align: center; font-size: 22px; min-height: 150px; background: url(../img/bg-effortless-color.jpg) center center no-repeat; border: none;}
#banner .inner {height: 100%;}
#banner h1 {
  margin-top: 50px;
	font-size: 60px;
	letter-spacing: 1px;
	text-align: center;
	line-height: 70px;
  max-width: 100%;
}


#index #effortless {min-height: 440px; background: url(../img/banners/home.jpg) center center no-repeat;padding-top: 66px;}
#index #effortless .inner {width: 1200px;}
#index #effortless .content {float: left; max-width: 65%;}
#index #effortless hr {margin: 30px 0; border-top: dashed 1px; width: 90%}
#index #effortless li {margin: 0 0 .4em;}

#index #integrations {min-height: 0; color: #aaa ; padding: 10px 0; text-align: center;}
#index #integrations h2 {font-size: 16px; margin: 10px 0; float: left; border-right: 3px solid #eee; padding: 35px 30px;}
#index #integrations li {display: inline-block; margin: 10px 10px;}
#index #integrations li img {width: 120px; height: auto; vertical-align: middle;}

#index #comprehensive {background: linear-gradient(105deg, rgb(244, 188, 27), rgb(225, 102, 11));background: -webkit-linear-gradient(105deg, rgb(244, 188, 27), rgb(225, 102, 11)); padding-top: 50px;}
#index #comprehensive .content {float: right; width: 40%;}
#index #comprehensive #tablet-image-desktop {width: 526px;margin-bottom: -10px;}
#index #comprehensive #tablet-image-mobile {display: none;}
#index #customers {min-height: 0; color: #1b8fbf; padding: 20px;}
#index #customers h2 {font-size: 32px;}
#index #customers ul {text-align: center;}
#index #customers li {float: left; width: calc(100% / 6 - 12px); min-width: 150px; margin: 5px; text-align: center; font-size: 16px; position: relative; background: #d9edf5; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;}
#index #customers li strong {text-align: center; padding: 0 20px; display: block; position: relative; z-index: 1;}
#index #customers li img {position: absolute; bottom: 0; left: 0; width: 100%; height: auto; z-index: 0;}

#index #support {background: url(../img/banners/support.jpg) bottom right no-repeat; padding-bottom: 60px; margin-bottom: -40px;}
#index #support .content {float: left; width: 40%;}

#index #testimonials, #testimonials {color: #1b8fbf; padding: 30px 20px; font-size: 18px; clear: both; background: #fff; font-weight: 500; min-height: 0; }
#index #testimonials blockquote, #testimonials blockquote {background: #d9edf5; padding: 20px 30px 4px; margin: 0 0 1em; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; position: relative;}
#index #testimonials blockquote:after, #testimonials blockquote:after {content: ""; width: 0; height: 0; border-style: solid; border-width: 30px 40px 0 0px; border-color: #d9edf5 transparent transparent transparent; position: absolute; bottom: -16px; left: 50px;}
#index #testimonials .attr, #testimonials .attr {font-size: 14px; margin-left: 30px;}
#index #testimonials a.button, #testimonials a.button {font-size: 18px;}

#index #reservations h2 {margin-bottom: 10px;}
#index #reservations h3 {font-family: 'Montserrat-Light', sans-serif; margin: 0 20px 25px 0; font-weight: normal;}
#index #reservations strong {font-size: 16px;}

#capterra {float: right; width: 150px; margin-right: 7%;}
.slideshow {margin: 0 auto; position: relative; padding: 0 7%; float: left; width: calc(79% - 150px);}
/*.slideshow:before {content: "\201C"; font-size: 210px; position: absolute; top: -50px; left: 0; color: rgba(33,122,174,.1); z-index: 1; line-height: 1; font-weight: 600; font-family: times;}*/
.slideshow .carousel {overflow: hidden;}
.slideshow .slides-pagination, .slideshow .slides-next, .slideshow .slides-prev {display: none;}

#index #backoffice {background: url(../img/bg-backoffice.jpg) top right no-repeat; padding-top: 60px;}
#index #backoffice .content {background: rgba(35,127,178,.8); float: left; width: 40%;}

#index #features {min-height: 0; color: #000; padding: 20px;}
#index #features li {float: left; width: calc(100% / 4 - 12px); text-align: center; font-size: 16px; margin: 40px 5px ;}
#index #features img {display: block; margin: 0 auto 30px;}
#index #features a.button {display: table; margin: 2em auto; clear: both;}

#index #devices {min-height: 0; background: #62bae0; text-align: center; padding: 20px; font-weight: 600; font-size: 16px;}
#index #devices span {display: inline-block;}
#index #devices img {display: inline-block; margin: 0 1em; vertical-align: middle;}

#index #readysetgo {background: url(../img/bg-readysetgo.jpg) left top no-repeat;min-height: 550px;}
#index #readysetgo .inner {width: 1200px;}
#index #readysetgo .content {float: right; width: 40%;}
#index #readysetgo .content a {color: #fff;}
#index #readysetgo .content a:hover {color: #e28e17;}
#index #readysetgo a.button {color: #fff; border-color: #fff;}
#index #readysetgo a.button:hover {background: #fff; color: #118cc1;}

#mobilefooter {display: none;}

.content ul {list-style: disc outside none; margin-left: 30px}

.columnswheading h2, .columnswheading .video {float: left; width: 35%; clear: left;}
.columnswheading ul {width: 60%; float: right;}
.columnswheading li {float: left; width: calc(100%/3 - 60px); margin: 0 60px 60px 0;}
.columnswheading .video img {width: 100%; display: block; margin: 0 0 40px;}
.columnswheading li:nth-child(3n+1) {clear: left;}

article.content {max-width: 1200px; margin: 0 auto;}


.column {width: 46%;margin-top: 30px;}
.columnl {float: left;}
.columnr {float: right;}

.note {font-size: 90%; color: #555;}

.content img {display: block; width: 100%; margin: 1em auto;}
.content li {margin: 0 0 1em;}
.check li {list-style: none; padding-left: 0; position: relative;}
.check li:before {content: "+"; color: #53a007; font-weight: bold; font-size: 160%; position: absolute; top: -9px; left: -24px; font-family: helvetica;}

#ticketingfee {max-width: 400px; margin: 0 1em 1em 0; float: left}

#address {padding-top: 3em; font-size: 90%;}

#news section nav, #newsdetail nav {float: left; width: 200px; margin: 40px 0 0; position: relative; z-index: 1;}
#news section nav ul, #newsdetail nav ul {background: #eee; margin: 0 0 1em; border-right: 1px solid #e5e5e5; padding: 6px 0 6px 6px;}
#news section nav li, #news section nav a, #newsdetail nav li, #newsdetail nav a {float: none; display: block; font-size: 16px; text-transform: none; margin: 0 0 2px;}
#news section nav a, #newsdetail nav a {display: block; padding: 6px; color: #217aae;}
#news section nav a:hover, #news section nav a.current, #newsdetail nav a:hover {background: #fff; color: #df5327;}
#news section nav a.current {color: #000; margin-right: -7px;}

#news .content article, #newsdetail article {float: right; width: calc(100% - 206px); border: 6px solid #eee; border-width: 6px 0 0 6px !important; padding: 0 !important;}
#newsdetail article {border-top: 0 !important; padding: 40px 40px 20px !important; width: calc(100% - 286px);}
#news .content article a {display: block; padding: 20px 40px 40px; color: #000;}
#news .content article a:hover {background: rgba(33,122,174,.1);}
#news section h2 {margin: 0 0 .6em !important; color: #217aae;}
#newsdetail h2 {margin: 0 0 .6em !important;}
#news section h2 span, #newsdetail h2 span {font-size: 70%; color: #000;}
#news section h2 span.type, #newsdetail h2 span.type {text-transform: uppercase; font-size: 60%; color: #777;}

table {margin: 1em 0; clear: both;}
th {border-bottom: 3px solid #eee; text-transform: uppercase; font-size: 90%; color: #555;}
td {border-bottom: 1px solid #eee;}
th, td {padding: 8px 16px 8px 0;}

#footer {padding: 20px; background: #022c52 repeat-x; color: #fff; clear: both; letter-spacing: 0.1em;padding-bottom: 70px;}
#footer .inner {
  height: 80%;
  padding-top: 50px;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex; 
  -ms-flex-align: baseline;
  -webkit-align-items: baseline;
  align-items: baseline;
}
#footer h3 {font-family:'Montserrat-Light'; color: #4d7ca7;margin-bottom: 40px;font-size: 16px;}
#footer h2 {font-family:'Montserrat-Light'; color: white;margin-bottom: 25px;font-size: 16px;}
#footer #link-col-2 {margin-left: 50px;}
#footer #wsia-logo {margin-right: 20px;}
#footer #aoa-logo {margin-right: 20px;}
#footer li {margin-top: 15px;text-transform: uppercase;}
#footer p {margin:15px 0 0 0;font-size: 12px;}
#footer a {font-size: 12px;color:white !important;}
#footer a.mail {color: #17b3c0 !important;}
#footer a.button {color: #fff; border-color: #fff; font-size: 20px; padding: 8px 20px; float: right;}
#footer a.button:hover {border-color: #fff; background: #fff; color: #122b51;}
#footer p.copy-right {color: #4d7ca7;margin-top: 75px;}
#footer small {display: block; clear: both; font-size: 12px; margin: 280px 20px 20px;}
#footer img {vertical-align: middle;}


#no_such_file {background: #217aae; color: white; text-align: center; font-size: 24px;}
#no_such_file footer {display: none}
#no_such_file section {padding: 200px 0 0;}
#no_such_file section a {color: #fff; border-color: #fff; text-decoration: underline}
#no_such_file section a:hover {background: #fff; color: #217aae;}

.landing_testimonial{
	font-style: italic;
}

.clearfix:before,
.clearfix:after {content: " "; display: table;}
.clearfix:after {clear: both;}
.clearfix {*zoom: 1;}

#habla_topbar_div.hbl_pal_title_bg {background-color: #df5327 !important}

@media only screen and (min-width : 1300px) {
	#index #effortless {min-height: 661px;}
}

@media only screen and (max-width : 1260px) {
	.columnswheading li {width: calc(50% - 60px);}
	.columnswheading li:nth-child(3n+1) {clear: none;}
	.columnswheading li:nth-child(2n+1) {clear: left;}
}
@media only screen and (max-width : 1200px) {
	#ticketingfee {float: none; margin: 1em auto;}
}

@media only screen and (min-width : 1200px) {
	nav {
    -ms-flex-pack: space-between;
    -webkit-justify-content: space-between;
    justify-content: space-between;
  }
}

@media only screen and (max-width : 1072px) {
	.logo {width: calc(100% - 676px); height: auto;}
}

@media only screen and (max-width : 1000px) {
	.columnswheading h2, .columnswheading ul, .columnswheading .video {float: none; width: 100%;}
}

@media only screen and (max-width : 1006px) {
	#index #customers li, #index #features li {width: calc(100% / 3 - 12px);}
	#index #features li {margin: 30px 5px ;}
	#index #devices img {display: block; margin: 4px auto;}
}

@media only screen and (max-width: 996px) {

  #index #comprehensive #tablet-image-mobile {display: block;width: 300px; margin:0 auto 20px auto;}
  #index #comprehensive #tablet-image-desktop {display: none;}

	#index #effortless {min-height: 0; padding: 70px 0 5px;}
	#index #support .content {float: none; min-width: calc(100% - 40px); margin: 0 !important;background: rgba(38,95,174,0.8);}

	#banner .content {padding: 100px 0 5px;}
	#index #support {margin-bottom: -16px;}
  #footer .inner {display: none;}
}



@media only screen and (max-width : 830px) {

	#news section nav, #newsdetail nav {float: none; width: 100%; margin: 2em 0; text-align: center;}
	#news section nav ul, #newsdetail nav ul {border-right: 0; padding: 8px 8px 4px;}
	#news section nav li, #newsdetail nav li {padding: 0; margin: 0 0 4px;}
	#news section nav a, #newsdetail nav a {padding: 6px; margin: 0;}
	#news section nav a.current {margin-right: 0;}

	#news .content article, #newsdetail article {float: none; width: auto; border: 6px solid #eee; border-width: 6px 0 0 !important;}
	#newsdetail article {border-top: 0 !important; padding: 40px 40px 20px !important; width: auto;}
}

@media only screen and (max-width : 800px) {
	#index #integrations h2 {float: none; text-align: center; border: 0; padding: 0 0 20px; margin: 10px 0 0;}
}

@media only screen and (max-width : 752px) {
	#index #testimonials {padding: 30px 0;}
	.slideshow {width: auto; float: none;}
	#capterra {float: none; clear: both !important; display: block !important; margin: 40px auto 10px !important;}
	.column {width: 100%;}
	.columnl, .columnr {float: none;}
}

@media only screen and (max-width : 556px) {
	#index #customers li, #index #features li {width: calc(100% / 2 - 12px);}
	.columnswheading {padding: 20px;}
	.columnswheading li {float: none; width: 100%; margin: 0 0 30px;}
	body:not(#index) article  {padding: 20px;}
	#news section nav, #newsdetail nav {margin: 2em 20px; width: auto;}
	#news .content {padding: 0;}
	#news .content article a, #newsdetail article {padding: 20px 20px 40px;}
	#banner .content {min-width: 100%; text-align: left; padding: 80px 0 0;}
}

@media only screen and (max-width : 500px) {
	.logo {width: calc(100% - 95px); height: auto;}
}

@media only screen and (max-width : 465px) {
	#index article .content {min-width: calc(100% - 40px);}
	#index #customers li, #index #features li {width: calc(100% - 12px);}
	#index #features li {margin: 20px 5px 0;}
}

/* helpers */
.flex {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}
.flex-center {
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center; 
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}
.flex-jc-center {
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center; 
}
.flex-ai-center {
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}
.flex-jc-end {
  -ms-flex-pack: flex-end;
  -webkit-justify-content: flex-end;
  justify-content: flex-end;
}
.flex-ai-end {
  -ms-flex-align: flex-end;
  -webkit-align-items: flex-end;
  align-items: flex-end;
}
.space-between {
  -ms-flex-pack: space-between;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
.flex-col {
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}

.one-fifth {width: 20%;}
.two-fifth {width: calc(40% - 10px);}
.three-fifth {width: calc(60% - 10px);}
.one-quarter {width: calc(25% - 10px);}
.three-quarters {width: calc(75% - 10px);}
.one-third {width: calc(33.3333% - 33px);}
.two-thirds {width: calc(66.6666% - 32px);}
.one-half {width: calc(50% - 10px);}
.full {width: calc(100% - 22px);}

.circle{border-radius: 50%;}
.text-orange {color: #e1660b !important;}
.bg-orange {background-color: #e1660b !important;}
.text-blue {color: #15b3cb !important;}
.bg-blue {background-color: #15b3cb !important;}

.text-left {text-align: left !important;}
.text-right {text-align: right !important;}
.text-center {text-align: center !important;}

/* unscoped */

.btn {
	height: 55px;
	width: 238px;
	color: white;
	text-transform: uppercase;
	border-radius: 5px;
	font-size: 18px;
  padding: 0 10px;
}

.btn:hover {color: white !important;}

.cards-container {
  -ms-flex-wrap: wrap;
  -webkit-flx-wrap: wrap;
  flex-wrap: wrap;
}

.card {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  -webkit-align-items: center;
	align-items: center;
	text-align: center;
	border: 1px solid #e6e6e6;
	border-radius: 4px;
	max-height: 230px;
	margin: 10px;
	font-size: 16px;
	line-height: 18px;
	letter-spacing: 0.65px;
	padding: 5px;
}
.card .icon {display: block; width: 48px; }
.card p {font-size: 14px;color: gray;margin-top: 15px;padding: 0 10px;}
.card strong {font-family: 'Montserrat-SemiBold';color: #222222;font-size:16px;text-align: center;line-height: 18px;text-transform: uppercase;}
.card a {font-family: 'Montserrat';}

hr.ferry, hr.tube {
	height: 1px;
	color: #e6e6e6;
	background: #e6e6e6;
	font-size: 0;
	border: 0;
	max-width: 1200px;
	margin: 70px auto;
	position: relative;
}

hr.ferry::after {
	content: '';
	position: absolute;
	display: block;
	background-image: url('/img/ferry.png');
	background-color: white;
	background-size: 58px 29px;
	height: 29px;
	width: 58px;
	bottom: -14px;
	border-left: solid white 12px;
	border-right: solid white 12px;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
}

hr.tube::after {
	content: '';
	position: absolute;
	display: block;
	background-image: url('/img/tube.png');
	background-color: white;
	background-size: 41px 41px;
	height: 41px;
	width: 41px;
	bottom: -20px;
	border-left: solid white 12px;
	border-right: solid white 12px;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
}

/* circles module */
#circles {text-align: center;color: #222222;}
#circles h2 {color: #17b3c0;}
#circles img {width: 190px;border-radius: 50%;}
#circles .circle-container {min-height: 300px;}
#circles p {color: #222222;font-family: 'Montserrat';padding: 0 30px;}
#circles p a, #circles p a:hover {color: #e1660b;}

/* home page cards */
.cards-centered {text-align: center; padding: 75px 0;letter-spacing: 0.65px;}
.cards-centered h2 {color: #17b3c0;}
.cards-centered h3 {font-size: 18px;color: #222222;}
.cards-centered p {font-family: 'Montserrat';color: #343434;font-size: 14px;line-height: 18px; max-width: 100%;}
.cards-centered p.text-orange {font-size: 16px;}
.cards-centered .card {height: 350px;margin-top: 40px;}
.cards-centered .card img.icon {width: 100px; background-color: white;}
.card p, .card strong, .cards-centered strong, .cards-centered p {
  max-width: 100%;
}
/* all breakpoints, scoped */
#sticky-nav {padding: 0;}
#solutions section {padding-top: 0;}
#solutions a, #solutions a:hover {color: white;}
#solutions strong {font-weight: 600;}

#solutions h2 a{color: #17b3c0;}
#solutions h2 a:hover {color: #17b3c0; text-decoration: underline;	}

#banner {
  background-repeat: no-repeat; 
  background-position: center; 
  background-size:cover; 
  height: 500px;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
}
#solutions #banner .btn {
	margin-top: 60px;
	width: 393px;
	max-width: 90%;
	font-size: 20px;
	text-align: center;
	letter-spacing: 0.65px;
}
#solutions #tools h2 {font-family: 'Montserrat';}
#solutions #main-title, #solutions #quote,#solutions #featured {padding:20px; }
#solutions #main-title h2 {
	margin-top: 50px;
	font-family: 'Merriweather', serif;
	font-size: 48px;
	color: #17b3c0;
	text-align: center;
	font-weight: 400;
	line-height: 75px;
}
#solutions #tools {
	background-color: #0ab4bf;
	padding: 60px 20px;
}

#solutions #tools h2{
	font-size: 28px;
	color: #ffffff;
	text-align: center;
	font-weight: 400;
	letter-spacing: 0.65px;
	line-height: 46px;
	margin: 0;
	text-transform: uppercase;
}

#solutions #tools h3{
	font-size: 21px;
	color: #ffffff;
	text-align: center;
	letter-spacing: 0.65px;
	line-height: 32px;
	font-weight: 100;
}

#solutions #quote img {width: 350px;height: 350px;}
#solutions #quote #quote-container {min-height: 500px;}
#solutions #quote #quote-alternative p {
  font-family: 'Merriweather', serif;
  font-size: 26px;
}
#solutions #quote blockquote {
	font-family: 'Merriweather', serif;
	font-size: 26px;
	margin: 50px auto;
	position:relative;
}
#solutions #quote blockquote::before {
  font-family: serif;
	content: "\201C";
	font-size: 150px;
	position:absolute;
	top: -90px;
	color: #0ab4bf;
}
#solutions #quote .attribution {font-size: 20px; text-transform: uppercase;}
#solutions #quote .attribution-bold { font-size: 20px; text-transform: uppercase; font-family: 'Montserrat-Bold'; }
#solutions #quote a{color: #191919; text-decoration: underline}
#solutions #quote a:hover {text-decoration: none}
#solutions #quote {margin-bottom: 75px;}

#solutions .section-intro {
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
  margin: 10px auto;
}
#solutions .section-intro h3 {font-size: 50px;line-height: 54px;margin: 0;font-family: 'Merriweather', serif;font-weight: normal;}
#solutions .section-intro p {
	margin: 20px auto;
	font-size: 16px;
	color: #222222;
	text-align: left;
	line-height: 26px;
}
#solutions .featured-body {
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
  flex-direction: column;
  padding: auto 1em;height: auto;
}
#solutions .featured-body h4 {
	font-size: 20px;
  font-style: normal;
  font-family: 'Montserrat-SemiBold';
	line-height: 24px;
  padding-bottom: 10px;
}
#solutions .featured-body p {
	font-size: 16px;
	color: #484848;
	line-height: 26px;
}

#solutions .featured-image img {
  margin: 0;
  width:100%;
  height:100%;
  -ms-flex-pack: flex-start; 
  -webkit-justify-content: flex-start; 
  justify-content: flex-start;
  -ms-flex-align: flex-start;
  -webkit-align-items: flex-start;
  align-items: flex-start;
}

#solutions .btn-outline {
	height: 55px;
	width: 238px;
	color: #ff7800;
	font-weight: normal;
	background-color: white;
	border: 1.5px solid #ff7800;
	text-transform: uppercase;
	border-radius: 5px;
	font-size: 18px;
}
#solutions .btn-outline:hover {
  color: #ff7800;
}

#solutions #sailing {
	background: url('/img/people-sailing.jpg') no-repeat center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height: 514px;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-direction: column;
  -webkit-flex-direction: column;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

#solutions #sailing h2 {
	font-family: 'Merriweather', serif;
	max-width: 962px;
	font-size: 69px;
	color: white;
	text-align: center;
	font-weight: 400;
	margin: 0;
}

#solutions #sailing h3 {
	margin-top: 50px;
	font-weight: 100;
	letter-spacing: 0.65px;
	max-width: 820px;
	font-size: 18px;
	color: #ffffff;
	text-align: center;
	line-height: 31px;
	text-transform: uppercase;
}

#about #banner {height: 400;}
#about article.content {
  font-size: 18px;
  color: #343434;
  line-height: 30px;
}

#about article.content h4 {
  margin-top: 10px;
}
#about #info-graphic div {text-align: left;color: #de6a00;letter-spacing: 0.65px;padding: 20px 0;}
#about img {margin: 0;}
#about #info-graphic img {
  width: 100px;
  margin-bottom: 30px;
  float: left;
}
#about #info-graphic h3 {
  font-size: 48px;
  line-height: 30px;
  margin: 0;
}
#about #info-graphic h4 {
  font-size: 24px;
  line-height: 30px;
  padding-top: 10px;
}
#about #info-graphic p {
  font-size: 16px;
  color: #020202;
  line-height: 24px;
}
#about #our-story {
  max-width: 800px;
  margin: auto auto;
  text-align: center;
}
/* desktop only*/
@media (min-width: 996px) {
	header {
		background: transparent;
		position: fixed;
		width: 100%;
		z-index: 10000;
		padding:10px 0;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
		-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;
	}
	.touch header {position: fixed;}
	.logo {float: left;height: auto;width: 271px;margin: 0;}
	nav {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex; 
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    margin: 0; 
    width: 100%;
    max-width: 1200px;
  }
	nav ul {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-pack: space-between;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    
  }
	nav li {display: inline; font-size: 13px;text-transform: uppercase;}
	nav li a {letter-spacing: 0.65px;}
	nav li a, nav li a:visited {color: white;}
	nav li.current a {color: #888;}

  header.white {
    background-color: white;
  }

  header.white li a, nav li a:visited {
    color: #002b51;
  }
  header.white li a.button {
    background-color: #e1660b;
    color: white !important;
  }

	body#solutions article {padding: 60px 0;border: 0;}
	.mar-l-40 {margin-left: 40px !important;}
	.mar-r-40 {margin-right: 40px !important;}

	header.teal {
		background-color:#04b4c1;
		-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;
	}
  header.teal a.button-bg-orange {background-color: #e1660b;}
  #solutions-menu {width: 115px; }
  .cards-centered .card img.icon,.cards-centered .card p,.cards-centered .card strong,.cards-centered .card a {transform: translateY(-50px);}

  #about #our-mission-text,#about #get-in-touch {text-align: left; padding-left: 100px;}
  #about #we-are-hiring h2, #about #get-in-touch h2 {text-align: left;}
  #smartwaiver img {width: 386px !important; height: 193px  !important; }
}

#navtoggle {display: none;}
nav#mobile-menu {display: none;}
@media (max-width: 1024px) {
  .mobile-top-banner {
    background-color: #17b3c0 !important;
    height: 59px !important;
    width:100%;
  }
  article.content h1 {margin-top: 20px;}
  .mobile-logo {display: block;}
  nav#desktop-menu {display: none;}
  header {position: relative;}
  .touch header {position: relative;}
  #navtoggle {
    display: block;
    height: 40px;
    position: absolute;
    font-size: 11px;
    padding-top: 7px;
    right: 15px;
    top: 10px;
    color: #fff !important;
  }
  #navtoggle:before {
    content: "";
    font-size: 25px;
    position: absolute;
    top: 20px;
    width: 1.3em;
    height: 0.125em;
    border-top: 0.375em double  #fff;;
    border-bottom: 0.125em solid  #fff;;
  }
  nav#mobile-menu {
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: flex-start; -webkit-justify-content: flex-start; justify-content: flex-start;
    -ms-flex-align: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    width: 300px;
    margin: 0;
    position: absolute;
    right: -300px;
    height: 100vh;
    background-color: #002b51;
    z-index: 10;
  }
  nav#mobile-menu ul {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    padding: 10px;
    -ms-flex-align: flex-start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
  }
  nav#mobile-menu .submenu-mobile {display: none;}
  nav#mobile-menu .submenu-mobile li {padding-bottom: 0;}
  nav#mobile-menu li a,
  nav#mobile-menu li a:visited {color: white;padding: 0;}
  nav#mobile-menu li a.button {margin: 0; padding: 10px;letter-spacing: 0}
  nav#mobile-menu .logo.mobile {display: block; width: 200px;margin:20px 10px 0 10px;}
}
@media (min-width: 1025px) {
  nav li a.button {
    height: auto;
    background:none;
    border: 1px solid white;
    padding:5px 10px;
    padding-left: 12px;
    min-width: 255px;
    -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;
  }
}
.hidden-desktop {display: none;}
.hidden-mobile {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}

/* mobile only */
@media (max-width: 996px) {
  .hidden-desktop {
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}
  .hidden-mobile {display: none;}
  .mobile-100 {width: 100% !important;}
	.mobile-95 {width: 95% !important;}
	.cards-container {
    -ms-flex-direction: row;
    -webkit-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 0;margin: 0;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center; 
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    width: 96.5%;
  }
  .card {margin: 5px 0; max-height: 260px;width: 100%;}
  .cards-container .card.marketing_and_seo {
    -ms-order: 1;
    -webkit-order: 1;
    order: 1;
  }
  .cards-container .card.booking {
    -ms-order: 2;
    -webkit-order: 2;
    order: 2;
  }
  .cards-container .card.email_automation {
    -ms-order: 3;
    -webkit-order: 3;
    order: 3;
  }
  .cards-container .card.remarketing {
    -ms-order: 6;
    -webkit-order: 6;
    order: 6;
  }
  .cards-container .card.management_and_reporting {
    -ms-order: 5;
    -webkit-order: 5;
    order: 5;
  }
  .cards-container .card.check_in {
    -ms-order: 4;
    -webkit-order: 4;
    order: 4;
  }
	#solutions .content { 
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column; 
    border:none; 
    padding: 15px !important;
  }
	#solutions a {align-self: center !important;}
  #solutions .featured-body, #solutions .featured-body h4 {text-align: left !important;}
	#solutions #banner h1,#solutions #sailing h2, #solutions #main-title h2 { font-size: 40px; line-height: 50px;}
  #circles .circles-row,#hiring-touch,#our-mission {
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
  }
  #our-mission img {margin-bottom: 40px;}
  #hiring-touch {text-align: center;}
  #about #info-graphic {
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
  }
  #index #comprehensive .inner {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
  }
}
#suite_of_tools_desktop {
  min-height: 400px;
}
#suite_of_tools_mobile {
  min-height: 500px;
}