/* CSS Document */

/* ––––––––––––––––––––––––––––––––––––––––––––––––––
Body
–––––––––––––––––––––––––––––––––––––––––––––––––– */
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, 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, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
	background-color:#FFF;
}




/* Style for our header texts
	* --------------------------------------- */
h1{
	font-size: 3vw;
	font-family: 'Spectral', serif;
	font-weight:500;
	text-align:left;
	color: #FFF;
}

h2{
	font-size: 4em;
	font-family: 'Open Sans', sans-serif;
	color: #00A859;
	margin:0;
	padding:0;
}

h3{
	font-size: 1.75vw;
	font-family: 'Open Sans', sans-serif;
	font-weight:300;
	text-align:left;
	color: #FFF;
}

a{
	color:#FFF;
	text-decoration:underline;
}

p, li{
	
	font-family: 'Open Sans', sans-serif;
	font-weight:300;
	font-size: 1.5vw;
	line-height:140%;
	font-weight:300;
	text-align:left;
	color: #FFF;
}



.logo{
	width: 100%;
	margin-top:0%;
	float:left;
}

.overlay{
	width:100%;
	height:100%;
	z-index:5;
	opacity:1;
	position: absolute;
	background:url(../Images/Layout/bg_pattern.png) center repeat;
	 display: flex;
  align-items: center;
}


.slogan{
	margin:auto;
	width:60%;
	float:left;
}


.imagecontentcontainer{
	width:80%;
	max-width:1730px;
	margin:auto;
	z-index:1;
	
}

.imagecontenttext{
	width:50%;
	display:block;
	position:absolute;
	bottom:5%;
}


.whitetextcontainer{
	margin: 10% auto 0 auto;
	width:80%;
	max-width:1730px;
}

.whitetextcontainer li{

 	list-style-position: outside;
	margin-left:5%;
	list-style-type: disc;
	list-style-position: inside;
	text-indent: -5%;

}

.whitetextleft{
	width:45%;
	padding-right:5%;
	float:left;
}

.whitetextright{
	width:55%;
	padding-left:5%;
	float:left;
	border-left:1px solid #FFF;
}

.navarrows{
	width:50px;
	position:absolute;
	bottom:30px;
	right:30px;
	z-index:100;

}

.navarrows img{
	width:50px;
	height:50px;
	margin-top:10px
}




/* Style for our calendar
 * --------------------------------------- */
	
.calendarcontainer{
	margin:auto;
	width:80%;
	max-width:1730px;
}

.calendartextleft{
	width:25%;
	padding-right:5%;
	float:left;
}

.calendartextright{
	width:45%;
	padding-left:5%;
	float:left;
	border-left:1px solid #FFF;
}

.year{
	color:#FFF;
	text-align:center;
}

.year td{
	width:33%;
	padding:2%;
	text-align:center;
}

.month{
	width:100%;
	font-family: 'Open Sans', sans-serif;
	font-size:120%;
	color:#666;
	background:#CCC;

}

.month td{
	background: #FFF;
	width:14%;
	padding:2%;
}

.month td.booked{
	background: #999;
	color:#FFF;
}

.month td.fridaystart{
	background: linear-gradient(to right bottom, #FFF 50%, #999 50%);
	color:linear-gradient(to right bottom, #FFF 50%, #999 50%);
}

.month td.fridayend{
	background: linear-gradient(to right bottom, #999 50%, #FFF 50%);
	color:linear-gradient(to right bottom, #FFF 50%, #999 50%);
}


.month thead{
	color:#0080FF;
}




/* Style for datasheet
 * --------------------------------------- */


.datasheet {  
    color: #333;
    width:80%;
	max-width:1730px;
    border-collapse: collapse; 
	border-spacing: 0;
	margin:220px auto 0 auto;
}

.datasheet h2{
	font-size: 2.5vw;
	font-family: 'Open Sans', sans-serif;
	font-weight:500;
	text-align:left;
	color: #FFF;
	padding:1vw;
}


.datasheet li{
	font-family: 'Open Sans', sans-serif;
	font-weight:300;
	font-size: 1.5vw;
	line-height:140%;
	font-weight:300;
	text-align:left;
	color: #FFF;
	text-align:left;
	list-style: disc;
	width:29%;
  float:left;
  margin-left:4%;
}

.datasheet li.single{
	font-family: 'Open Sans', sans-serif;
	font-weight:300;
	line-height:140%;
	font-weight:300;
	text-align:left;
	color: #FFF;
	text-align:left;
	list-style: disc;
	width:90%;
  float:left;
  margin-left:4%;
}
	
.datasheet td, th {  
    border: 1px solid transparent; /* No more visible border */
	padding:1vw;
	vertical-align:middle;
}

.datasheet th {  
    background: #DFDFDF;  /* Darken header a bit */
    font-weight: bold;
}

.datasheet td {  
    background: #FAFAFA;
    text-align: center;
}

.datasheet img{
	width:100%;
	height:auto;
}


/* Style for Application Form
 * --------------------------------------- */


.application {  
    color: #333;
    width:80%;
	max-width:1730px;
    border-collapse: collapse; 
	border-spacing: 0;
	margin:220px auto 0 auto;
}

.application td, th {  
    border: 1px solid transparent; /* No more visible border */
	padding:1vw;
	vertical-align:middle;
}

/* Cells in even rows (2,4,6...) are one color */        
.datasheet tr:nth-child(even) td { background: #355AB5; }   

/* Cells in odd rows (1,3,5...) are another (excludes header cells)  */        
.datasheet tr:nth-child(odd) td { background: #4D72CA; }  



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

.overlay{
	background:url(../Images/Layout/bg_pattern.png) center repeat;
}

.logo{
	width:70%;
}

h1{
	font-size: 200%;;
	padding:3% 0 2% 0;
}

h3{
	font-size: 120%;
}

p, li{
	font-size: 120%;
	line-height:130%;
}


.slogan{
	width:100%;
	margin:auto;
}



.imagecontentcontainer{
	width:70%;
	margin:5px auto;
	z-index:1;
	
}

.imagecontenttext{
	width:50%;
	font-size:100%;
	bottom:4%;
}

.whitetextcontainer{
	width:95%;
	border-top:0px solid #FFF;
	padding-top:10px;
	margin-top:10%;
}


.whitetextleft{
	width:100%;
	float:left;
}

.whitetextright{
	display:none;
}

.whitetextleft, .whitetextright p{
	font-size: 90%;
	line-height:100%;
	padding:0 20px;
}

.calendarcontainer{
	margin:10% auto auto auto;
}

.calendartextleft{
	width:20%;
	padding:5% 2% 0 0;
	float:left;
	font-size:70%;
}

.calendartextright{
	width:75%;
	padding-left:5%;
	float:left;
	border-left:1px solid #FFF;
}

.year{
	font-family: 'Open Sans', sans-serif;
	font-size:80%;
	color:#FFF;
	text-align:center;

}

.year td{
	width:33%;
	padding:0%;
	text-align:center;
}

.month{
	width:100%;
	font-family: 'Open Sans', sans-serif;
	font-size:80%;
	color:#666;
	background:#CCC;

}

.month td{
	background: #FFF;
	width:14%;
	padding:2%;
}

.navarrows{
	width:30px;
	position:absolute;
	bottom:10px;
	right:10px;
	z-index:100;

}

.navarrows img{
	width:30px;
	height:30px;
	margin-top:10px
}



.datasheet {  
    width:100%;
	margin:100px 0 0 0;
}

.datasheet h2{
	font-size: 3vw;
}

.datasheet li{
	width:45%;
	margin-left:4%;
	font-size:2.5vw;
} 


.application {  
    width:80%;
	margin:80px auto 0 auto;
}


}

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

.overlay{
	background:url(../Images/Layout/bg_pattern.png) center repeat;
}

.logo{
	width:70%;
}

h1{
	font-size: 180%;

}

h3{
	font-size: 120%;
}

p, li{
	font-size: 120%;
	line-height:130%;
}


.slogan{
	width:100%;
	margin:auto;
}



.imagecontentcontainer{
	width:80%;
	margin:5px auto;
	z-index:1;
}

.imagecontenttext{
	width:100%;
	font-size: 100%;
	bottom:5%;
}

.whitetextcontainer{
	width:100%;
	max-width:1730px;
	margin-top:15%;
}


.whitetextleft{
	width:100%;
	float:left;
}

.whitetextright{
	display:none;
}

.whitetextleft, .whitetextright p{
	font-size: 100%;
	padding:0 20px;

}


.calendarcontainer{
	width:100%;
	margin: auto;
	border-top:0px solid #FFF;
	margin:10% 0 0 0;
}


.calendartextleft{
	display:none;
}

.calendartextright{
	width:90%;
	border:none;
	padding:0 0 0 10%;

}

.year{
	font-family: 'Open Sans', sans-serif;
	font-size:100%;
	color:#FFF;
	text-align:center;

}

.year td{
	width:33%;
	padding:0%;
	text-align:center;
}

.month{
	width:100%;
	font-family: 'Open Sans', sans-serif;
	font-size:80%;
	color:#666;
	background:#CCC;

}

.month td{
	background: #FFF;
	width:14%;
	padding:5%;
}

.datasheet {  
    width:100%;
	margin:100px 0 0 0;
	float:left;
}

.datasheet h2{
	font-size: 5.5vw;
}

.datasheet li{
	width:90%;
	margin-left:4%;
	font-size:4vw;
}

.application {  
    width:100%;
	margin:80px auto 0 auto;
	float:left;
}


}