body
{ font-size:10pt;
  font-family:'Raleway',sans-serif;
  color:#0f3e76;
  font-style:normal;
  font-weight:normal;
  text-decoration:none;
  line-height:1.3;
  background-color:white;
}

div.error
{ font-size:10pt;
  font-weight:bold;
  color:white;
  background:#FF4500;
  padding:2pt;
}

colblue1
{ color:#d5eae9;
}

colblue2
{ color:#8dcee4;
}
colblue3
{ color:#0f3e76;
}

colsand
{ color:#d4af8c;
}



article
{ color:#0f3e76;
}

h1,h2,h3,h4
{ margin-top:0.5em;
}

article h1
{ font-size:14pt;
  font-weight:bold;
  text-align:center;
}

article h2
{ font-size:12pt;
  font-weight:bold;
}

article h3
{ font-size:11pt;
  font-weight:bold;
}

article h4
{ font-size:11pt;
  font-weight:bold;
}

article .offeridents
{ font-size:8pt;
  color:#bbb;
}


div.cityshort, div.tourshort
{ margin-top:12pt;
  margin-bottom:12pt;
}


div.booking a
{ display:inline-block;
  padding:2pt 8pt;
  border-radius:8pt;
  color:#fff;
  background:#5d9ded;
  text-align:center;
  font-weight:bold;
  text-decoration:none;
}

div.booking a:hover
{ display:inline-block;
  padding:2pt 8pt;
  border-radius:8pt;
  color:#fff;
  background:#3b7bcb;
  text-align:center;
  font-weight:bold;
}

div.photostipearea
{ overflow:auto;
  white-space:nowrap;
  background:transparent;
  height:220pt;
  margin:16pt 0pt;
}

div.photostipearea div.photostipe
{ display:inline-block;
}

div.photostipearea div.photostipe div.photo
{ display:inline-block;
  margin-right:16pt
}

div.photostipearea div.photostipe div.photo img.photo
{ display:inline-block;
  border-radius:8pt;
  max-height:200pt;
  width:auto
}

div.photolongview
{ display:grid;
  grid-template-columns:repeat(auto-fit, minmax(200pt, 1fr));
  grid-gap:8pt;
  margin:16pt
}

div.photolongview img.photo
{ display:inline-block;
  border-radius:8pt;
  max-width:200pt;
  height:auto
}

hr
{ border:0;
  height:1px;
  background-image:linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}


.main
{ padding:4pt 12pt 4pt 12pt;
}


img
{ max-width:100%;
}

img.extlink
{ margin-left:2pt;
  margin-right:2pt
}

.main .offer.description div.article  img,
.main .vendor.presentation div.article img
{ max-height:20em
}

@media screen and (min-width:650pt) 
{
  .main .offer.description div.article img,
  .main .vendor.presentation div.article img
  { max-width:50em
  }

}


div.vendor.presentation div.article div.img-container
{ float:left;
  margin:0 4pt 4pt 0
}

div.vendor.presentation div.article div.img-container img
{ height:10em;
}

.mce-content-body img
{ max-width:14em;
  max-height:14em
}

div.vendor.contact
{ clear:both
}

.main div.img-container
{ display:inline-block;
  overflow:hidden
}


.main img.align-left
{ display:inline;
  float:left
}

.main img.align-right
{ display:inline;
  float:right
}

.main img.align-center
{ display:block;
  text-align:center
}


img.topbanner 
{ display:block;
  width:100%;
  max-height:20em;
  object-fit:cover;
  object-position:60% 70%;
  max-height:300px;
  height:auto
}

header
{ display:block;
}


header div.sky
{ display:block;
  position:relative;
  margin:0;
  padding:0;
  min-height:50pt;
  background:#5c9ad5;
  background-image:url("/img/sky.jpg");
  overflow:hidden
}

header div.sky a 
{ display:block;
  color:#fff;
  font-size:24pt;
  font-weight:600;  
  text-decoration:none;
  text-align:left;
  padding:6pt 8pt
}

header div.sky div.boats 
{ position:absolute;
  text-align:right;
  bottom:0;
  left:0;
  right:0;
  overflow:hidden;
  white-space:nowrap
}

header div.sky div.boats svg.sailboat
{ width:36pt;
  height:36pt
}

header ul, 
ul.edititemmenu
{ clear:both;
  list-style:none;
  margin:0;
  padding:0;
  overflow:hidden
}


header ul.mainmenu 
{ background:#0f3e76;
  background-image:url("/img/water.jpg");
}
header.nologin ul.mainmenu 
{ border-bottom:8pt solid #d4af8c;
}

header.partnerlogin ul.mainmenu 
{ 
}

header ul.partner1menu 
{ background:#d4af8c;
}

header ul.mainmenu li,
header ul.submenu li,
header ul.partner1menu li,
header ul.partner2menu li,
header ul.partner3menu li
{ float:left
}

header ul.mainmenu li:last-child 
{ float:right
}

ul.edititemmenu
{ text-align:center
}

ul.edititemmenu li
{ display:inline-block
}

header ul.mainmenu li a,
header ul.submenu li a,
header ul.partner1menu li a,
header ul.partner2menu li a,
header ul.partner3menu li a,
ul.edititemmenu li a
{ display:block;
  text-decoration:none;
  text-align:center
}

header ul.mainmenu li a
{ color:#d5eae9;
  font-size:1rem;
  font-weight:600;
  padding:6pt 8pt
}

header ul.partner1menu li a
{ color:#f8f2ec;
  font-size:1rem;
  font-weight:400;
  padding:6pt 8pt
}
header ul.submenu li a,
header ul.partner2menu li a,
header ul.partner3menu li a
{ color:#999;
  font-size:1rem;
  font-weight:300;
  padding:6pt 8pt;
}

ul.edititemmenu li a
{ color:#999;
  font-size:1rem;
  font-weight:300;
  padding:0pt 8pt 8pt 8pt;
}

header ul.mainmenu li a.selected,
header ul.partner1menu li a.selected 
{ color:#fff;
  text-decoration:underline
}

header ul.mainmenu li a:hover,
header ul.partner1menu li a:hover
{ color:#fff;
  text-decoration:underline
}

header ul.submenu li a.selected,
header ul.partner2menu li a.selected,
header ul.partner3menu li a.selected,
ul.edititemmenu li a.selected
{ color:#000;
  text-decoration:underline
}

header ul.submenu li a:hover,
header ul.partner2menu li a:hover,
header ul.partner3menu li a:hover,
ul.edititemmenu li a:hover
{ color:#000;
  text-decoration:underline
}



form.searchbox.from,
form.searchbox.fromto
{ text-align:center;
}

div.searchbox.from,
div.searchbox.fromto
{ display:flex;
  justify-content:center;
  align-items:center;
  padding-bottom:8pt
}

div.searchbox.from div.searchlabel,
div.searchbox.fromto div.searchlabel
{ padding-right:4pt
}

div.searchbox.from div.fromlabel,
div.searchbox.fromto div.fromlabel
{ padding-right:8pt;
}

div.searchbox.from div.fromcity,
div.searchbox.fromto div.fromcity
{ padding-right:8pt;
}

div.searchbox.fromto div.tolabel
{ padding:0 8pt;
}

div.searchbox.fromto div.tocity
{ padding-right:8pt;
}

div.searchbox.fromto input.submit
{ 
}

@media screen and (max-width:500pt) 
{
  div.searchbox.from div.searchlabel,
  div.searchbox.fromto div.searchlabel
  { text-align:left;
    grid-column:span 2
  }

  div.searchbox.from,
  div.searchbox.fromto
  { display:inline-grid;
    grid-template-columns:auto 1fr;
    padding-bottom:8pt
  }

  div.searchbox.fromto input.submit
  { grid-column: 3 / 4;
    grid-row: 1 / 3;
    align-self:stretch;
  }
}


div.offer h1
{ font-size:14pt;
  font-weight:bold;
  text-align:center;
  text-transform: uppercase;
}

div.main div.vendor.contact + div.offer.description,
div.main div.offer.description + div.vendor.contact
{ padding-top:12pt;
}

div.main div.offer.description:last-child,
div.main div.vendor.contact:last-child
{ padding-bottom:12pt;
}


@keyframes price-shaking {
    0% { transform:rotate(5deg)  translateY(0pt); }
  100% { transform:rotate(15deg) translateY(40pt);}
}

div.offer
{ position:relative;
}

div.offer div.price
{ display:inline-block;
  position:absolute;
  top:8pt;
  right:8pt;
  font-family:sans;
  font-size:20pt;
  text-align:center;
  font-weight:bold;
  line-height:1;
  padding:2pt 8pt;
  border-radius:8pt;
  color:#fff;
  background:#f00;
  overflow:hidden;
  white-space:nowrap;
  opacity:0.7;
  animation:price-shaking 20s linear infinite alternate;
}

div.teasers div.offer div.price
{ font-size:14pt;
}

div.offer div.price div.applicable
{ font-size: 8pt;
  font-weight: normal;
}

div.teasers div.offer div.price div.applicable
{ font-size: 6pt;
}


footer
{ display:block;
  color:#fff;
  font-size:10pt;
  min-height:48pt;
  background:#d4af8c;
  border-top:2pt solid #b9975a;
  padding:8pt;
}
footer div
{ padding-bottom:8pt;
}

@media screen and (min-width:500pt) 
{
  footer
  { display:grid;
    grid-template-columns:1fr 1fr;
    grid-template-rows:auto;
    grid-template-areas:
    'summary  movetop '
    'summary  topquery'
    'partners internal'
    'partners copy    ';
    column-gap:16pt;
  }
  footer div
  { padding-bottom:0pt;
  }
}

@media screen and (min-width:700pt) 
{
  footer
  { display:grid;
    grid-template-columns:1fr 1fr 1fr 1fr;
    grid-template-rows:auto;
    grid-template-areas:
    'summary topquery partners movetop '
    'summary topquery partners internal'
    'summary topquery partners copy    ';
     column-gap:16pt;
  }
  footer div
  { padding-bottom:0pt;
  }
}

footer div.movetop
{ grid-area:movetop;
}
footer div.summary
{ grid-area:summary;
}
footer div.topquery
{ grid-area:topquery;
}
footer div.partners
{ grid-area:partners;
}
footer div.internal
{ grid-area:internal;
}
footer div.copy
{ grid-area:copy;
}

@media screen and (max-width:600px) 
{
  footer .column 
  { width:100%;
  }
}

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

footer a:hover
{ color:white;
  text-decoration:underline;
}


img.toplogo
{ width:10em;
  max-height:40pt;
  height:auto;
  padding:1em 2em 1em 1em;
}

div.taglist span.tag 
{ display:inline-block;
  border-radius:4pt;
  border:1pt solid #ff0000;
  padding:2pt 8pt;
  margin:4pt;
}
div.taglist span.highlight
{ display:inline-block;
  color:#ffffff;
  background:#ff0000;
  border-radius:4pt;
  border:1pt solid #44aaff;
  padding:2pt 8pt;
  margin:4pt;
}
div.taglist span.tag:hover
{ color:#ff0000;
}
div.taglist span.highlight:hover
{ color:#ffffff !important;
}

p.borderindent
{ padding-left:5pt;
  border-left:2pt solid #ccc;
}

@keyframes headsailing {
  from {right:-500pt;}
  to {right:2500pt;}
}

header div.sky div.boats svg:nth-of-type(1) { right:-50pt; animation:headsailing 78s linear 3s infinite normal; }
header div.sky div.boats svg:nth-of-type(2) { right:-100pt; animation:headsailing 75s linear 2s infinite normal; }
header div.sky div.boats svg:nth-of-type(3) { right:-150pt; animation:headsailing 60s linear 12s infinite normal; }
header div.sky div.boats svg:nth-of-type(4) { right:-200pt; animation:headsailing 79s linear 72s infinite normal; }
header div.sky div.boats svg:nth-of-type(5) { right:-250pt; animation:headsailing 87s linear 70s infinite normal; }
header div.sky div.boats svg:nth-of-type(6) { right:-300pt; animation:headsailing 84s linear 102s infinite normal; }
header div.sky div.boats svg:nth-of-type(7) { right:-350pt; animation:headsailing 75s linear 182s infinite normal; }
header div.sky div.boats svg:nth-of-type(8) { right:-400pt; animation:headsailing 63s linear 240s infinite normal; }
header div.sky div.boats svg:nth-of-type(9) { right:-450pt; animation:headsailing 72s linear 225s infinite normal; }
header div.sky div.boats svg:nth-of-type(10) { right:-500pt; animation:headsailing 60s linear 440s infinite normal; }



#toast 
{ visibility: hidden; 
  min-width: 250px;
  margin-left: -125px; 
  background-color: #333; 
  color: #fff; 
  text-align: center; 
  padding: 8px 16px; 
  position: fixed;
  z-index: 1; 
  left: 50%; 
  bottom: 60px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
#toast.show 
{ visibility: visible;
  -moz-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  -o-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  -ms-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  animation: fadein 0.5s, fadeout 0.5s 2.5s;
}