body {
  /*margin:0.2em;*/
  padding:0em;
  text-align:center;
  font-family: 'Montserrat', sans-serif;
  font-size: 16px;
}
  
#bodycontent {
  width:700px;
  height:95%;
  margin:0em auto;
  text-align:left;
  padding:0.2em;
  border:0px dashed #333;
  /*background-color:#eee;*/
}

#m2flags { float:right; margin:1px; }
#m2flags img { border:1px none; margin:1px; cursor:pointer; }
#m2flags font { color:999; }
.toggler { width:600px;position: relative; margin:auto; border:1px none #F90;}
#button { padding: .5em 1em; text-decoration: none; }
#effect {  padding: 0.1em; position: relative; }
#effect h3 { margin: 0; padding: 0.3em; text-align: center; }
#effect p { padding: 0.1em; margin: 0.2em; text-align: justify; }
.bout_edit {cursor:pointer;}

#fichboat { width:100%; position:top; border:1px none #000; margin:5pt; }
/*#fichboat div.titre { font-weight:bold; font-style:italic; font-size:8pt; padding:1pt; padding-top:0pt; border-bottom:1px solid #666;}*/
#fichboat div.sscat { text-align:left; font-weight:normal; font-style:normal; font-size:8pt; padding:1pt; border-bottom:1px solid #CCC;}
#fichboat div.ssval { float:right; text-align:right; font-weight:normal; font-style:normal; font-size:8pt; padding:1pt;}

.indent {
  text-indent: 30px;
}

.itemCrew {
  margin-top: 15px;
  padding-left: 0;
  padding-right: 0;
}

.itemCrew:hover {
  cursor:pointer;
  box-shadow: 0 8px 17px 0 rgba(0, 0, 0, .2), 0 6px 20px 0 rgba(0, 0, 0, .15);
}

.overlay {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: rgb(0,0,0);
  background-color: rgba(0,0,0, 0.9);
  overflow-x: hidden;
  transition: 0.5s;
}

.overlay-content {
  position: relative;
  top: 25%;
  width: 100%;
  text-align: center;
  margin-top: 30px;
}

.overlay a {
  padding: 8px;
  text-decoration: none;
  font-size: 36px;
  color: #818181;
  display: block;
  transition: 0.3s;
}

.overlay a:hover, .overlay a:focus {
  color: #f1f1f1;
}

.overlay .closebtn {
  position: absolute;
  top: 20px;
  right: 45px;
  font-size: 60px;
}

.navbarTop {
  position: sticky;
  top: 0px;
  background-color: #fff;
  z-index: 1;
}

.loader {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  width: 150px;
  height: 150px;
  margin: -75px 0 0 -75px;
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #000000;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;

}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

#header_keypoint, #keypoint_itinerary {
  /* font-weight: bold; */
  font-size: 20px;
  white-space:pre-wrap;
  text-align: justify;
}

.img-full {
  /*height: 600px !important;*/
  margin: 0 auto;
}

.img-half {
  max-height: 500px !important;
  margin: 0 auto;
}

#cw_link {
  font-size:8pt;
}

div.bg-gray {
  background-color: #efefef;
}

div.bg-darkgray {
  background-color: #C4C4C4;
}

div.bg-black {
  background-color: #000000;
  padding:20px;
  text-align: left;
  padding-left:50px;
}

.pd-20 {
  padding:20px;
}

#boatModel {
  font-size: 18px;
}

#priceDetail {
  font-weight: 600;
}

#pricetermDetail {
  white-space:pre-wrap;
  font-weight: bold;
  word-break: break-word;
  text-align: justify;
  --scrollbarBG: #fff;
  max-height: 400px;
  overflow-x: hidden;
  overflow-y: scroll;
}

.type-document{
  width:100%; 
  margin-bottom:20px;
}

.documents {
    padding:20px;    
}

.document {
  float: left;
  width: calc(25% - 20px);
  /*max-width: 240px;*/
  margin: 10px 10px 20px;
  background-color: #fff;
  border-radius: 3px;
  border: 1px solid #dce2e9;
  position: relative;
}

.document .document-body {
  min-height: 130px;
  text-align: center;
  border-radius: 3px 3px 0 0;
  background-color: #fdfdfe;
}

.document .document-body i {
  font-size: 45px;
  line-height: 120px;
}

.document .document-body img {
  width: 100%;
  height: 100%;
}

.document .document-footer {
  border-top: 1px solid #ebf1f5;
  /*height: 46px;;*/
  padding: 12px 12px;
  border-radius: 0 0 2px 2px;
}

.document .document-footer .document-name {
  display: block;
  margin-bottom: 0;
  font-size: 15px;
  font-weight: 600;
  width: 100%;
  line-height: normal;
  overflow-x: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.document .document-footer .document-description {
  display: block;
  margin-top: 5px;
  font-size: 11px;
  font-weight: 600;
  color: #8998a6;
  width: 100%;
  line-height: normal;
  overflow-x: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.document.info .document-footer >*, .document.success .document-footer >*,
.document.danger .document-footer >*, .document.warning .document-footer >*,
.document.dark .document-footer >* {
  color: #fff;
}

.document.info .document-footer {
  background-color: #2da9e9;
}

.document.success .document-footer {
  background-color: #0ec8a2;
}

.document.warning .document-footer {
  background-color: #ff9e2a;
}

.document.danger .document-footer {
  background-color: #f95858;
}

.document.dark .document-footer {
  background-color: #314557;
}

.folders {
  width: 100%;
}

.folders li {
  font-size: 14px;
  padding: 3px 4px 3px 12px;
}

.folders li a {
  text-decoration: none;
  color: #4a4d56;
}

.folders li a i {
  color: #5e6168;
  font-size: 16px;
  margin-right: 5px;
}

.utilities li {
  font-size: 1.5em;
}

.description {
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

.text {
  color: white;
  font-size: 16px;
  padding: 16px 32px;
}

.document:hover .document-body {
  opacity: 0.3;
}

.document:hover .description {
  cursor: pointer;
  opacity: 1;
}

.darkred-bold {
    color: #990000;
    font-weight: bold;
}

.img-slide {
  max-height: 250px;
}

.container-fluid {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

/*header {
  position: relative;
  width: 100%;
  height: 100vh;
  min-height: auto;
  text-align: center;
  color: #fff;
  background-image: url(https://cdn.sednasystem.com/view/img/CRokwIGieamF2Zcxp04_FUMCucRP2mSm32NX-GQW01g=?s=100);
  background-position: center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  -o-background-size: cover;
}*/

header h1 {
  margin-top: 0px;
  padding: 40vh 0;
}

#boatname {
  font-size: 8vh;
  text-shadow: -2px 3px 0px black;
}

span.header {
  /*font-weight: 600;*/
  /*color: #526EED;*/
  font-size: 5vh;
  /*text-transform: uppercase;*/
}

.no-padding {
  padding-left: 0;
  padding-right: 0;
}

.navbar-nav.navbar-center {
    position: absolute;
    left: 50%;
    transform: translatex(-50%);
    height: auto;
}
.navbar-default .navbar-center>li>a, .navbar-default .navbar-text {
    color: #FFF;
    font: 13 2.2vmin/2vh Montserrat, cursive;
    font-weight: bold;
    /*text-shadow: 1px 0px 2px black;*/
    text-align: center;
    /*mix-blend-mode: difference;*/
}
.navbar-default .navbar-center>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
    color: #526EED;
    text-shadow: 1px 0px 2px black;
    background-color: transparent;
}

.navbar-default .navbar-left>li>a, .navbar-default .navbar-text {
    color: #FFF;
    font-weight: bold;
    /*text-shadow: 1px 0px 2px black;*/
    text-align: center;
    /*mix-blend-mode: difference;*/
}
.navbar-default .navbar-left>li>a:focus, .navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a.active {
    color: #526EED;
    text-shadow: 1px 0px 2px black;
    background-color: transparent;
}

.boatinfo {
  line-height: 35px;
  font-size: 20px;
  margin-top: 20px;
}

.header-black {
  font-weight: 600;
  color: #000;
  font-size: 3.5vh;
}

#price, #priceterm, #amenities, #gallery, #videoBoat, #crew, #crewDetail, #keypoint, #keypointDetail, #itinerary, #menu, #menuInfo, #itineraryDetail, #document, #documentInfo, #itinerary, #itineraryDetail, .amenitiesContent, #boatInfo {
  margin-top:  20px;
}

ul#tabCategory > li > a, ul#tabDay > li > a {
  color: white;
  font-size: 16px;
  font-weight: bold;
  background-color: #9F9E9E;
  border-radius: 0;
  padding: 5px;
}

ul#tabCategory > li > a:hover, ul#tabDay > li > a:hover {
  color: #526EED;
}

ul#tabCategory > li.active > a, ul#tabDay > li.active > a {
  color: #526EED;
  background-color: #FFFFFF;
}

#navbar .nav-tabs>li.active>a, #navbar .nav-tabs>li.active>a:focus, #navbar .nav-tabs>li.active>a:hover {
  color: #526EED;
  background-color:#FFFFFF;
  border: none !important;
  border-bottom-color:transparent;
  cursor:default
}

#contentAmenities {
  font-weight: bold;
}

#container {
  width: 90%;
  margin: auto;
}

figure {
  display: flex;
  /* align-items: center; */
  background: #efefef;
  position: relative;
  width: 100%;
  /* height: 180px; */
  /*background-color: #C4C4C4;*/
}

figcaption {
  --scrollbarBG: #efefef;
  padding: 20px;
  vertical-align: top;
  text-align: left;
  width: 100%;
  top: 0;
  height: auto;
  /* position: absolute; */
  top: 0;
  right: 0;
  /* height: 180px; */
  line-height: 24px;
  font-size: 13px;
  /*font-weight: bold;*/
  /* text-align: center; */
  color: #000;
  text-transform: uppercase;
  /* writing-mode: vertical-rl; */
  /* height: 180px; */
  line-height: 24px;
  /* writing-mode: vertical-rl; */
  max-height: 400px;
  overflow-x: hidden;
  overflow-y: scroll;
}

.img-crew {
  max-width: 40%;
  height: 100%;
}

.galleryRow, .sliderBoat {
  margin-top:  8px;
}

#navbar {
  background-color: rgba(0,0,0,.55)!important;
  color: #000;
}

#langDropdown {
  color: #FFF;
  background: transparent;
}

#langDropdown:hover, #langDropdown:active {
  color: #526EED;
}

#template {
  /*margin-top:  30px;*/
}

.navbar-default .navbar-nav>li>a, .navbar-default .navbar-text {
  color: #FFF;
}

.navbar-default .navbar-center>li>a:focus, .navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a.active {
  color: #526EED;
}

[id^="category"] {
  margin-right: -1px;
  margin-left: 0.5px;
}

#sliderShow {
  padding: 0px;
}

.sk-cube-grid {
  width: 60px;
  height: 60px;
  /* margin: 100px auto; */
  position: relative;
  /*left: 45%;
  top: 45%;*/
  z-index: 1;
}

.sk-cube-grid .sk-cube {
  width: 33%;
  height: 33%;
  background-color: #526EED;
  float: left;
  -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
          animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out; 
}
.sk-cube-grid .sk-cube1 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s; }
.sk-cube-grid .sk-cube2 {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s; }
.sk-cube-grid .sk-cube3 {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s; }
.sk-cube-grid .sk-cube4 {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s; }
.sk-cube-grid .sk-cube5 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s; }
.sk-cube-grid .sk-cube6 {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s; }
.sk-cube-grid .sk-cube7 {
  -webkit-animation-delay: 0s;
          animation-delay: 0s; }
.sk-cube-grid .sk-cube8 {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s; }
.sk-cube-grid .sk-cube9 {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s; }

@-webkit-keyframes sk-cubeGridScaleDelay {
  0%, 70%, 100% {
    -webkit-transform: scale3D(1, 1, 1);
            transform: scale3D(1, 1, 1);
  } 35% {
    -webkit-transform: scale3D(0, 0, 1);
            transform: scale3D(0, 0, 1); 
  }
}

@keyframes sk-cubeGridScaleDelay {
  0%, 70%, 100% {
    -webkit-transform: scale3D(1, 1, 1);
            transform: scale3D(1, 1, 1);
  } 35% {
    -webkit-transform: scale3D(0, 0, 1);
            transform: scale3D(0, 0, 1);
  } 
}

.navbar-brand {
  /*height: auto;*/
}

html, body {
   height: 100%;
   /*text-align: center;*/
}
 ferry {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   display: inline-block;
   width: 64px;
   height: 32px;
   border-radius: 3px 0 0 0;
   background-color: #2b2b2b;
   z-index: 1;
   animation: bop 0.48s ease-in-out alternate infinite;
   box-shadow: inset 0 -5px 0 0 #e74c3c, inset 0 -15px 0 0 #2b2b2b, inset 0 -17px 0 0 #f0cf3c;
   border-top: 4px solid #ecf0f1;
}
 @keyframes bop {
   to {
     transform: translateY(-40%);
  }
}
 ferry:after {
   content: "";
   position: absolute;
   top: -18px;
   right: 0;
   display: block;
   width: 45px;
   height: 15px;
   background-color: #ecf0f1;
   z-index: 1;
   border-radius: 3px 3px 0 0;
}
 ferry:before {
   content: "";
   position: absolute;
   transform: rotate(-25deg);
   top: -5px;
   left: -3px;
   width: 10px;
   height: 50px;
   background-color: white;
}
 ferry chimney {
   position: absolute;
   top: -35px;
   display: block;
   width: 17px;
   height: 22px;
   background-color: #f0cf3c;
   left: 32px;
   z-index: -1;
   transform: rotate(8deg);
   box-shadow: inset 0 3px 0 0 #2b2b2b;
}
 ferry waves {
   position: absolute;
   bottom: -37px;
   display: block;
   width: 100px;
   height: 50px;
   background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+Cjxzdmcgd2lkdGg9IjE1NSIgaGVpZ2h0PSI4NSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KIDwhLS0gQ3JlYXRlZCB3aXRoIE1ldGhvZCBEcmF3IC0gaHR0cDovL2dpdGh1Yi5jb20vZHVvcGl4ZWwvTWV0aG9kLURyYXcvIC0tPgogPGc+CiAgPHRpdGxlPmJhY2tncm91bmQ8L3RpdGxlPgogIDxyZWN0IGZpbGw9Im5vbmUiIGlkPSJjYW52YXNfYmFja2dyb3VuZCIgaGVpZ2h0PSI4NyIgd2lkdGg9IjE1NyIgeT0iLTEiIHg9Ii0xIi8+CiAgPGcgZGlzcGxheT0ibm9uZSIgb3ZlcmZsb3c9InZpc2libGUiIHk9IjAiIHg9IjAiIGhlaWdodD0iMTAwJSIgd2lkdGg9IjEwMCUiIGlkPSJjYW52YXNHcmlkIj4KICAgPHJlY3QgZmlsbD0idXJsKCNncmlkcGF0dGVybikiIHN0cm9rZS13aWR0aD0iMCIgeT0iMCIgeD0iMCIgaGVpZ2h0PSIxMDAlIiB3aWR0aD0iMTAwJSIvPgogIDwvZz4KIDwvZz4KIDxnPgogIDx0aXRsZT5MYXllciAxPC90aXRsZT4KICA8ZyBpZD0ic3ZnXzkiPgogICA8ZWxsaXBzZSByeT0iMjYiIHJ4PSIyNiIgaWQ9InN2Z18xIiBjeT0iMzMuNSIgY3g9IjM0LjUiIHN0cm9rZS13aWR0aD0iMS41IiBmaWxsPSIjZmZmIi8+CiAgIDxlbGxpcHNlIHJ5PSIyNiIgcng9IjI2IiBpZD0ic3ZnXzMiIGN5PSIzMy41IiBjeD0iNjMuODY4NDkzIiBzdHJva2Utd2lkdGg9IjEuNSIgZmlsbD0iI2ZmZiIvPgogICA8ZWxsaXBzZSByeT0iMjYiIHJ4PSIyNiIgaWQ9InN2Z182IiBjeT0iMzMuNSIgY3g9IjkxLjcxODg4IiBzdHJva2Utd2lkdGg9IjEuNSIgZmlsbD0iI2ZmZiIvPgogICA8ZWxsaXBzZSByeT0iMjYiIHJ4PSIyNiIgaWQ9InN2Z183IiBjeT0iMzMuNSIgY3g9IjEyMS4wODczNzMiIHN0cm9rZS13aWR0aD0iMS41IiBmaWxsPSIjZmZmIi8+CiAgIDxyZWN0IGlkPSJzdmdfOCIgaGVpZ2h0PSI0NiIgd2lkdGg9IjE0MC4wMDAwMDYiIHk9IjMyLjUiIHg9IjcuNSIgc3Ryb2tlLXdpZHRoPSIxLjUiIGZpbGw9IiNmZmYiLz4KICA8L2c+CiA8L2c+Cjwvc3ZnPg==');
   background-size: 133% 144%;
   animation: sail 4s linear infinite;
}
 @keyframes sail {
   to {
     background-position: 400px 0;
  }
}

#divAmenities, #divItinerary {
  padding: 0;
}

#divAmenities .panel, #divItinerary .panel {
  border-radius: 0;
}

#divAmenities .panel-heading, #divItinerary .panel-heading {
  color: #000;
  font-size: 16px;
  font-weight: bold;
}

.amenitiesList {
  margin: 10px;
  white-space: pre-line;
}

.panel-group .panel-heading a:before {
  content: '+';
  left: 10px;
  top: 10px;
}

.panel-group .panel-heading a {
  font-size: 16px;
  font-weight: bold;
}

.text-itinerary {
  margin: 10px;
  white-space: pre-line;
}

#tabDay {
  background: white;
  margin-left: -1px;
}

.text-menu {
  white-space: pre-line;
}

.caption {
  white-space: pre-wrap;
  background: #efefef;
}

.mg-top-30 {
  margin-top: 30px;
}

.mg-top-10 {
  margin-top: 10px;
}

.crewDetail {
  padding-top: 10px;
  white-space: pre-wrap;
}

.mgt-5 {
  margin-top: 5px;
}

.pd-15 {
  padding: 15px;
}

#logoUser {
  max-height: 50px;
  /*background: url(../operator/pict/36/sednaHD-Bleu79C.png) center / contain no-repeat;*/
  width: 200px;
  transform: translateX(-50%);
  left: 50%;
  position: absolute;
}

#manageBrochure {
  padding-bottom: 20px;
  background-repeat: no-repeat;
}

.pd-5 {
  padding: 5px
}

.mg-left-30 {
  margin-left: 30px;
}

.fa-15x {
  font-size: 15em;
}

i.img-crew {
  min-width: 40%;
}
.itemCrew.visible-xs.visible-sm i {
  min-width: 100%;
  font-size: 10em;
}

#menuInfo {
  overflow: hidden;
}

#flags {
  margin-top: -4px;
}

.details {
  max-height: 540px;
  overflow-y: scroll;
  overflow: auto;
}

* {
  --scrollbarBG: #fff;
  --thumbBG: #526EED;
}
*::-webkit-scrollbar {
  width: 11px;
}
* {
  scrollbar-width: thin;
  scrollbar-color: var(--thumbBG) var(--scrollbarBG);
}
*::-webkit-scrollbar-track {
  background: var(--scrollbarBG);
}
*::-webkit-scrollbar-thumb {
  background-color: var(--thumbBG) ;
  border-radius: 6px;
  border: 3px solid var(--scrollbarBG);
}
.full-width-tabs > ul.nav.nav-tabs {
    display: table;
    width: 100%;
    table-layout: fixed;
}
.full-width-tabs > ul.nav.nav-tabs > li {
    float: none;
    display: table-cell;
    width:100%;
}
.full-width-tabs > ul.nav.nav-tabs > li > a {
    text-align: center;
}

.full-width-tabs .nav-tabs>li:last-child>a {
  margin-right: -1px;
}

/*.document-name i:first-child {
  margin-right: 5px;
}*/

.tooltip-inner {
  background-color: #526EED;
  color: #FFF;
  font-weight: bold;
}

@media screen and (max-width: 600px) {
  .document  {
    width: 100%;
    margin: 5px 0;
    max-width: none;
  }

  #boatname {
    font-size: 5vh;
  }

  #boatname span.header {
    /*font-weight: 600;*/
    /*color: #526EED;*/
    font-size: 3vh;
    /*text-transform: uppercase;*/
  }

  #boatInfo span.header {
    font-size: 4vh;
  }
}

@media screen and (max-height: 450px) {
  .overlay a {font-size: 20px}
  .overlay .closebtn {
  font-size: 40px;
  top: 15px;
  right: 35px;
  }
}

@media (min-width:1200px){
  #itinerary .row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:         flex;
  }
  #itinerary .row > #itinerary[class*='col-'], #itinerary .row > #itineraryDetail[class*='col-'] {
     display: flex;
     flex-direction: column;
  }

  #itineraryDetail {
    background: #efefef;
    padding: 0;
  }

  .boatSpec.col-md-8 {
    border-right: #526EED 2px solid;
  }
}

@media (max-width: 767px) {
  .navbar-default .navbar-nav .open .dropdown-menu>li>a {
    color: #FFF;
  }
}

#loader {
  display: block;
  width: 60px;
  height: 60px;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 60px;
  right: 0;
  margin: auto;
}

.navbar-brand {
  height: 35px;
}

select[name=showWeekPrice] {
  width: auto;
  display: initial;
}

#contentDay {
  --scrollbarBG: #efefef;
  max-height: 435px;
  overflow-x: hidden;
  overflow-y: scroll;
}

.sliderBoat img {
  box-shadow: 0 0 5px rgb(0 0 0 / 57%);
}

.sliderBoat img:hover {
  transform: scale(1.2);
  transform-origin: 50% 50%;
}

.sliderBoat {
  overflow: hidden;
}

#keypoint_itinerary {
  --scrollbarBG: #fff;
  max-height: 400px;
  overflow-x: hidden;
  overflow-y: scroll;
}