body { margin: 0; font-family: Georgia, serif; color: #233168;}

/*HEADER*/
.header {  background-color:white;  color: #1D2166;}

/*language menu*/
.lang {float:right; padding-right:15px;}
.lang img {border-style: solid; border-width: 1px; border-color:#292D71;background:#292D71;}
.lang img:hover {border-style: solid; border-width: 1px; border-color: #292D71;  width:30px;}
.lang .active img {border-style: solid; border-width: 1px; border-color: #292D71; display:none; }

/*top menu*/
.topnav {  overflow: hidden;  background-color: #292D71;}
.topnav a {  float: left;  display: block;  color: #f2f2f2;  text-align: center;  padding: 10px 15px;  text-decoration: none;  font-size: 16px;}
.topnav a:hover {  background-color: #0099CC;  color: #232B83;}
.topnav a.active {  background-color: #0099CC;  color: white;}
.topnav .icon {  display: none;}

@media screen and (max-width: 720px) {
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {    float: right;    display: block;  }
}

@media screen and (max-width: 720px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {    position: absolute;    right: 0;    top: 0;  }
  .topnav.responsive a {    float: none;    display: block;    text-align: left;  }
}

/*top line menu*/
.topline {float:left; padding-left:20px; font-size:0.8em;}
.topline a { text-decoration:none; color: #808080;}
.topline a:hover {text-decoration:none; color:#233168;}
.topline a.active {color:#233168;font-weight:bold;}

/*---------------------------------------*/



* {  box-sizing: border-box;}

.row::after {  content: "";  clear: both;  display: table;}

[class*="col-"] {  float: left;  padding: 15px;}

/*MENU LEFT*/
.menu-left{	}
.menu-left ul {  list-style-type: none; margin: 0;  padding: 0; min-width:230px; }
.menu-left li {padding: 12px; margin-bottom: 7px; background-color: #33b5e5; color: #ffffff; box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);  border-radius: 2px;  border-radius: 15px;}
.menu-left li a {  color: #ffffff;  text-decoration:none;}
.menu-left li.active {  background-color: #0099cc;}
.menu-left li.sec {  background-color: #6CC9EC;}

.menu-left div  { height:30px; font-weight:bold; white-space: nowrap; }
.menu-left div a {  color: #33b5e5;  text-decoration:none; padding-left:20px; }
.menu-left div.sec a {  color: #292D71;  text-decoration:none;}
.menu-left div a:hover {  color: #292D71;  text-decoration:none;}

.menu-left li:hover {  background-color: #0099cc;}


/*MENU RIGHT*/
.menu-right {  background-color: #33b5e5;  padding: 15px;  color: #ffffff;  text-align: center;  font-size: 14px;  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);  border-radius: 15px;  list-style-type: none;}
.menu-right li a {  background-color: #33b5e5;  color: #ffffff;  text-decoration:none;}
.menu-right li a.active {  color: #232B83;}
.menu-right li a:hover {  color: #232B83;}

/*MENU TARIF*/
.tarif {   text-align: center;  list-style-type: none; border:thin gray dotted; font-size:0.8em;}
.tarif tr td { border:thin gray dotted;   }
.tarif-title {color: #FFFFFF; background-color: #33B5E5;  height:40px; text-align:center;}

/*MENU BAF*/
.baf {   color: #232B83;  text-align: left;  list-style-type: none;}
.baf a {  color: #232B83;  text-decoration:none;}
.baf a.active {  color: #0099CC;}
.baf a:hover {  color: #0099CC;}

  /* BAF table */
.baf-tab {  list-style-type: none; border:thin gray dotted; font-size:0.8em; }  
.baf-tab tr td {  border:thin gray dotted;   }
.baf-title {color: #FFFFFF; background-color: #33B5E5;  height:40px; text-align:center; }
.mid-cel {text-align: center;	white-space: nowrap; border-left:thin gray dotted;}

/* TABLE FOR SEA */
.tab-tab {  width: 100%; text-align: center; }  
.tab-tab tr td {   }
.tab-title-1 {height:40px; background-color: #33b5e5; box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); text-align:left; color:#FFFFFF; border-radius: 5px 0px 0px 5px;  white-space:nowrap; padding-left:10px;  }
.tab-title-2 {height:40px; background-color: #33b5e5; box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); text-align: center; color:#FFFFFF; }
.tab-title-3 {height:40px; background-color: #33b5e5; box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); text-align: center; color:#FFFFFF; border-radius: 0px 5px 5px 0px; padding-right:5px;}
.tab-1st-col {text-align:left; white-space: nowrap; padding-left:10px; }



/* Book trip */
ul#pribook { list-style-type:none;  color:white; margin:0 0 0 0px;  }
ul#pribook li  {text-align:center; position:relative;  margin:0 3px 0 3px; width:300px;  }
ul#pribook a {text-decoration:none; display:block;  height:40px; line-height:20px; color:white;  background-color:#33b5e5; border:1px #0099cc solid; padding:10px 20px 10px 20px;font-weight:bold;border-radius:15px;}
ul#pribook li:hover a {background-color: #FFF; color:#292D71; border: 2px solid rgba(0, 0, 0, 0.15);height:40px; line-height:20px; }

/*FOOTER*/
.footer {  background-color: #0099cc;  color: #ffffff;  text-align: center;  font-size: 14px;  padding: 15px;}

/* For mobile phones: */
[class*="col-"] {  width: 100%;}

@media only screen and (min-width: 720px) {
  /* For tablets: */
  .col-s-1 {width: 8.33%;}
  .col-s-2 {width: 16.66%;}
  .col-s-3 {width: 35%;}
  .col-s-4 {width: 33.33%;}
  .col-s-5 {width: 41.66%;}
  .col-s-6 {width: 50%;}
  .col-s-7 {width: 58.33%;}
  .col-s-8 {width: 66.66%;}
  .col-s-9 {width: 65%;}
  .col-s-10 {width: 83.33%;}
  .col-s-11 {width: 91.66%;}
  .col-s-12 {width: 100%;}
}
@media only screen and (min-width: 1100px) {
  /* For desktop: */
  .col-1 {width: 8.33%;}
  .col-2 {width: 16.66%;}
  .col-3 {width: 25%;}
  .col-4 {width: 33.33%;}
  .col-5 {width: 41.66%;}
  .col-6 {width: 50%;}
  .col-7 {width: 58.33%;}
  .col-8 {width: 66.66%;}
  .col-9 {width: 75%;}
  .col-10 {width: 83.33%;}
  .col-11 {width: 91.66%;}
  .col-12 {width: 100%;}
}

  /* FORM: */
* {box-sizing: border-box;}

input[type=text], select, textarea {
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  margin-top: 6px;
  margin-bottom: 16px;
  resize: vertical;
}

input[type=submit] {
  background-color: #33B5E5;
  color: white;
  padding: 12px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
}

input[type=submit]:hover {
  background-color: #0099CC;
}

.container {
  border-radius: 5px;
  background-color: #f2f2f2;
  padding: 20px;
}


  /* AUTO STYLE */
.auto-style1 {text-align: left; padding-left:6px;}
.auto-style2 {font-weight: bold;text-align: left; padding-left:6px; white-space: nowrap;}
.auto-style3 {text-align: right;}
.auto-style4 {border-width: 0px;}
.auto-style5 {text-align: center; padding-left: 6px;}