@charset "UTF-8";
/* CSS Document */

@font-face {
    font-family: "Cochin";
	src: url('../fonts/Cochin.html'); /* IE9 Compat Modes */
    src: url('../fonts/Cochind41d.html?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	url("../fonts/Cochin-2.html#Cochin") format("svg"), /* Safari, Android, iOS */
         url('../fonts/Cochin.woff') format('woff'), /* Modern Browsers */
         url('../fonts/Cochin.ttf')  format('truetype');
		 
}

html,
body {
  font-size: 1em; }
html{
	
    } 

body {
  color: #222222;
  padding: 0;
  margin: 0;
  font-family: "Cochin";
  font-weight: normal;
  font-style: normal;
  line-height: 1;
  position: relative;
  -webkit-font-smoothing: antialiased; 
  height: 100%;}

/* Default Link Styles */
a {
  text-decoration: none;
  line-height: inherit;
 	color: #333333;
 }
  a:hover, a:focus {color:inherit; }
  a img {
    border: none; }

/* Default paragraph styles */
p {
  font-family: inherit;
  font-weight: normal;
  font-size: 1em;
  line-height: 1.6;
  margin-bottom: 1.25em; 
  color:#333333;}
  p aside {
    font-size: 0.875em;
    line-height: 1.35;
    font-style: italic; }

/* Default header styles */
h1, h2, h3, h4, h5, h6, h7 {
  font-family: calibri;
  font-weight: normal;
  font-style: normal;
  text-rendering: optimizeLegibility;
  margin-top: 0.2em;
  margin-bottom: 0.5em;
  line-height: 1.1em;
  color: #333333; }
  h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
    font-size: 60%;
    color: #6f6f6f;
    line-height: 0; }

h1 {
  font-size: 2em; }

h2 {
  font-size: 1.25em; 
  color:blue;
  
  }

h3 {
  font-size: 1.55em; 
  line-height: 2em;
  margin-left: -0.35em;
  margin-right: -0.35em;
   color: #333333; }

h4 {
  font-size: 1.25em; 
  line-height: 1em; 
   margin-left: -0.5em;
  margin-right: -0.5em; 
   }

h5 {
  font-size: 1em;
  margin-left: -0.5em;
  margin-right: -0.5em; }

h6 {
  font-size: 0.75em; }

  
.thankyou {
	padding-top: 1em;
  font-size: 4em; 
   color: #333333; 
  }
.flipbeach {color:#999; text-align:center;}
.flipbeach.active-highlight {color:#333333;}
.flipbeach:hover {color:#333333;}

hr {
  border: solid #dddddd;
  border-width: 1px 0 0;
  clear: both;
  margin: 1.25em 0 1.1875em;
  height: 0; }

/* Lists */
ul,
ol,
dl {
  font-size: 1em;
  line-height: 1;
  margin-bottom: 1.25em;
  list-style-position: outside;
  font-family: inherit; }

/* Unordered Lists */
ul li ul,
ul li ol {
  margin-left: 0;
  margin-bottom: 0;
  font-size: 1em;
  /* Override nested font-size change */ }
ul.square li ul, ul.circle li ul, ul.disc li ul {
  list-style: inherit; }
ul.square {
  list-style-type: square; }
ul.circle {
  list-style-type: circle; }
ul.disc {
  list-style-type: disc; }
ul.no-bullet {
  list-style: none; }

.containermenu2{
	background: rgba(200, 200, 200, 0.3); /* White with 0.7 opacity */
	color:#000;
	padding-top: 2em;
	border-bottom-left-radius:15px;
	border-bottom-right-radius: 15px;
	-moz-border-bottom-left-radius: 15px;
	-moz-border-bottom-right-radius: 15px;}
	

.containermenua2{
	background: rgba(255, 255, 255, 0.7); /* White with 0.7 opacity */
	color:#000;
	padding-top: 2em;
	border-bottom-left-radius:15px;
	border-bottom-right-radius: 15px;
	-moz-border-bottom-left-radius: 15px;
	-moz-border-bottom-right-radius: 15px;}

 
 .barre{
	margin-top: 1rem;
	margin-left:-4.5em;
 }
.containerreservation{
	background: #0263b0;
	text-align:center;
	}

 
.musicon{display:none;}

.musicoff{}

.showtext{display:none;}

.hidetext{}



.containertexte2{
	height: 37em;
	}
.containertexte3{
	height: 47em;
	}
 .containersocialmedia{
	text-align:right;
	margin-top: 1rem;
 }
 
 .containersocialmedia2{
	text-align:right;
	margin-top:2em;
	margin-bottom:1em;
 }
 
 .music1{
	margin-top:2em;
	margin-bottom:1em;
	background: rgba(255, 255, 255, 0.7); /* White with 0.7 opacity */
	border-radius:5px;
	-moz-border-radius:5px;
 }
	 
 .containersocialmedia3{
	position:absolute;
	top:-3em;
 }
 .containersocialmedia4{
	margin-top:20em;
	margin-bottom: 1em;
 }
 
.socialmedia{
	margin-right: 1rem;
	text-align:right;
 }

 
.menu{
	font-family: 'Calibri', cursive;
	font-size:18px;
	height: 15rem;
	padding-top: 1rem;
	
	
	}

li {
	font-size: 1.5em;
	line-height: 2;
	list-style:none;
	margin-left:0;
	}

.textbox {
	background: rgba(255, 255, 255, 0.7);
	padding:1em;
	font-size: 1.1em;
	color: #333333;
	border-radius: 15px;
	-moz-border-radius: 15px;
	 }

.textboxbig {
	background: rgba(255, 255, 255, 0.7);
	font-size: 1.1em;
	padding-left:1em;
	padding-right:1em;
	color: #333333;
	border-radius: 15px;
	-moz-border-radius: 15px;
	 }
	 	
.textbox1 {
	font-size: 1em;
	color: #333333;
	margin-top:1em;
	}	

.textbox2 {
	background: rgba(255, 255, 255, 0.7);
	padding: 0.5em 1em;
	font-size: 1em;
	color: #333333;
	}
.textbox3 {
	background: rgba(255, 255, 255, 0.7);
	padding: 0.5em 1em;
	font-size: 1em;
	color: #333333;
	margin-top:2em;
	}

.pad {
	height: 1em;
	}	
.pad2 {
	height: 2em;
	}
.pad3 {
	height: 3em;
	}	
.pad3 h1{color:#fff;}	
	
#text_1 {
	margin-top: 3em;
	float: left;
	width: 30em;
	}
	#text_1b {
	margin-top: 25em;
	float: left;
	width: 50em;
	}
#text_2 {
	margin-top: 2em;
	float: right;
	width: 30em;
	}
#text_3 {
	margin-top: 2em;
	float: left;
	width: 30em;
	}
#text_4 {
	margin-top: 2em;
	float: right;
	max-width: 40em;
	margin-bottom:1em;
	}
#text_31 {
	margin-top: 3em;
	float: left;
	width: 30em;
	}
#text_32 {
	margin-top: 2em;
	float: right;
	width: 30em;
	}
#text_33 {
	margin-top: 2em;
	float: left;
	width: 30em;
	}
#text_34 {
	margin-top: 2em;
	float: right;
	max-width: 40em;
	margin-bottom:1em;
	}
#text_51 {
	margin-top: 3em;
	float: left;
	width: 30em;
	}
#text_52 {
	margin-top: 2em;
	float: right;
	width: 30em;
	}
#text_53 {
	margin-top: 2em;
	float: left;
	width: 30em;
	}
#text_54 {
	margin-top: 2em;
	float: right;
	max-width: 40em;
	margin-bottom:1em;
	}

#text_5 {
	height: 6em;
	}
#text_6 {
	height: 16em;
	}
#text_7 {
	height: 10em;
	}
#text_8 {
	height: 6em;
	}
#text_9 {
	margin-top: 3em;
	margin-bottom: 3em;
	}
#text_39 {
	margin-top: 3em;
	}
#text_40 {
	margin-top: 3em;
	}
#text_41 {
	margin-top: 3em;
	}
#text_10 {
	margin-top: 4em;
	max-width: 12em;
	margin-bottom: 1em;
	}
	
.containerbutton {
	padding-top: 6em;
	text-align:center;
	margin-right:0.5em;
	}
.containerbutton img {
	min-height: 3em;
	min-width: 3em;
	}
.containerbutton2 {
	padding-top: 14em;
	text-align:center;
	}
.containerbutton2 img {
	min-height: 3em;
	min-width: 3em;
	}
.shadow {
	height:1.5em;
	width: 6.25em;
	padding: 0.25em 0.75em;
	margin-top: 2em;
	
	-moz-box-shadow: 5px 5px 5px rgba(68,68,68,0.6);
	-webkit-box-shadow: 5px 5px 5px rgba(68,68,68,0.6);
	box-shadow: 5px 5px 5px rgba(68,68,68,0.6);

	filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=3,MakeShadow=true,ShadowOpacity=0.30);
	-ms-filter: "progid:DXImageTransform.Microsoft.Blur(PixelRadius=3,MakeShadow=true,ShadowOpacity=0.30)";
	zoom: 1;
	}
.nomargin{margin-top:0;}
.shadow a:hover{color:#000;}
.padtext {
	height: 8em;
	}
.pad5 {
	height: 5em;
	}
.padtext2 {
	height: 22em;
	}
.padtext3 {
	height: 18em;
	}
#text_11 {
	margin-top: 1.5em;
	margin-bottom: 0.5em;
	}
#text_12 {
	height: 4em;
	}
#text_13 {
	height: 15em;
	}
#text_14 {
	height: 4em;
	}
#text_15 {
	height: 17em;
	margin-right: 2em;
	}
#text_23 {
	height: 5em;
	margin-right: 2em;
	}
#text_24 {
	height: 10em;
	margin-right: 2em;
	}
#text_25 {
	height: 4em;
	margin-right: 4em;
	}
#text_26 {
	height: 6em;
	margin-right: 2em;
	}
#text_27 {
	height: 3em;
	margin-right: 2em;
	}


.panelcontent{
	right: 40px;
	left: 280px;
	top: 20px;
	position: absolute;
	padding-bottom: 30px;
}
.slidingpanel {
	min-width: 100%;
	height: 98%;
	overflow-y: auto;
	overflow-x: hidden;
	margin-top: -150%;
	position: absolute;
	background: #000;
	box-shadow: 0px 4px 7px rgba(0,0,0,0.6);
	z-index: 2;
	-webkit-transition: all .8s ease-in-out;
	-moz-transition: all .8s ease-in-out;
	-o-transition: all .8s ease-in-out;
	transition: all .8s ease-in-out;
	}	
#slidingpanel1 {
	}
#slidingpanel2 {
	background-color:#FF0;
	}
#slidingpanel3 {
	background-color:#F00;
	}
.slidingpanel:target{
	margin-top: 0%;
}
.contenu{
	background-color:transparent;
	background:none;
	z-index:-1;
}
.plus-button {
	position: absolute;
	bottom: 73px;
	left: 30em;
	cursor: pointer;
}

.plus-button + .text-block {
	display: none;
	color: #333333;
	background-color: #000;
	background-color: rgba(255, 255, 255, 0.7); 
	position: absolute;
	bottom: 15em;
	left: 35em;
	width: 25em;
	padding:15px 12px 21px 12px; 
}

.plus-button.open + .text-block {
	display: block;
}

.text-block p {
	margin: 0;
}

.justifie {text-align: justify;}

.panelbeach{
	padding-top:2em;}
	
.black {background-color: #000;}
.dark {
	color: #fff;
	text-align: center;
	min-height: 100%;
	padding-top:2em;
	padding-bottom:2em; }
.dark h1{color: #fff;}
.dark h5{color: #fff;}

.dark img{margin-top: 1em;}

.blackbackground {
	background-color:rgba(0,0,0,1);
	background-size:cover;}
	
fieldset {
	margin: 0;
    }
fieldset legend {
    background: transparent;
    }
textarea {
	min-height:100px;
  box-shadow: none;
   }
.legend{
	font-weight:bold;
	padding-left: 1em;}
	
.details{color: #333333; font-family: "Cochin"; font-size:1em; line-height:1; padding-left: 2em;}
.detailssmall{color: #333333; font-family: "Cochin"; font-size:0.85em; line-height:1; padding-left: 0.75em;}

#submit{
	background:transparent;
	border:none;
	color:#222222;
	padding:0;
	margin:0;
}
#submit:hover{color:#3333333;}
.smallimg {text-align: center;}
.logo {height: 100%; width: 100%; max-height:210px; max-width: 180px;}
.logocontainer {text-align: center;}
.services {min-height:100%;}
#panel_1{display: none;}
#panel_2{display: none;}
#panel_5{display: none;}


.dark1{background-color: rgba(0,0,0,0.4);}
.dark2{background-color: rgba(0,0,0,0.6);}
.dark3{background-color: rgba(0,0,0,0.8);}
.pad14{height: 14em;}

.returnhome{text-align:right; padding-right: 1em; height:2em; padding-top:0.5em;}
table{
border-collapse:collapse;
width:100%;
}
table,th, td{
border: 1px solid #666666;
}
td{
text-align: center;
padding:5px;
background: rgba(255, 255, 255, 0.7);
}
.emptycell{
	background-color:transparent;
	border-color:transparent;
}

.topleftcorner{
	border-top-left-radius: 10px;
	border-top-color: transparent;
	border-left-color: transparent;
}
.toprightcorner{
	border-top-right-radius: 10px;
	border-top-color: transparent;
	border-right-color: transparent;
}
.bottomleftcorner{
	border-bottom-left-radius: 10px;
	border-bottom-color: transparent;
	border-left-color: transparent;
}
.bottomrightcorner{
	border-bottom-right-radius: 10px;
	border-bottom-color: transparent;
	border-right-color: transparent;
}

.firstline{
	border-top-color: transparent;}
.firstcolumn{
	border-left-color: transparent;}	
.lastline{
	border-bottom-color: transparent;}
.lastcolumn{
	border-right-color: transparent;}	
.reservationbox{
	background-color:rgba(255, 255, 255, 0.7);
	border-radius:10px;
	height: 200px;
	padding: 1em;}
	
#deck7{padding-left:0; padding-right:0;}
	
	
@media only screen and (max-width: 767px) {
	#panel_1{display: block;}
#panel_2{display: block;}
#panel_5{display: block;}
}

.seabackground{background:url(../img/backgroundindex.jpg); background-size:cover;}
.mag{text-align:center;}
.bxslider>.mag>img{float:none; margin-right:auto; margin-left:auto; vertical-align:middle;}
.quotation{margin: 2em;}

.credits{text-align: right; padding-top: 0.3em;}
.credits>a:hover span {display:none}
.credits>a:hover:before {content:"Do Future"}
.credits2{text-align:center;}
.credits2>h5{color:white;}