@charset "UTF-8";

<!--

body {
	background-image: url(images/leisuresail-sun2.png);
	background-repeat: no-repeat;
	background-position: center center;
	background-attachment: fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	font: 90%/1.5 Lucida Grande, Verdana, Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
	color: #000;
}

.container {
	width: 960px;
	min-height:500px;
	background-color:#fff; color:#000; opacity:0.90;
	background-color:#fff; color:#000; filter: alpha(opacity=90);
	background-color:#fff; color:#000; -moz-opacity:0.2; -webkit-opacity:0.90;
	-webkit-box-shadow: 0 0 20px rgba(0,0,0, .75));
	-moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
	box-shadow: 0 0 20px rgba(0,0,0, .75);
	-webkit-border-radius: 8px; 
	-moz-border-radius: 8px; 
	border-radius:8px;
	margin: 0 auto 24px auto; 
}

.header {
	margin:22px 22px 30px 22px;
}

.footer{
	height: 80px;
	text-align:center;
	margin:25px auto 25px auto;
}

ul, ol, dl {
	padding: 0;
	margin: 0 auto 0 22px;
}
	
li {
	margin-left:22px;
}
	
h1, h2, h3, h4, h5, h6, p {
	margin-top: 20;	 
	margin-bottom: 0;
	padding-right: 22px;
	padding-left: 22px; 
}

h2 {
	color:#f8951d;
	font-size:125%;
}

h3 {
	color:#0085ac;
	font-size:120%;
}

a img {border: none;}

a:link {
	color:#414958;
	text-decoration: underline; 
}
a:visited {
	color: #4E5869;
	text-decoration: underline;
}
a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
	text-decoration: none;
}


.photos {
	width: 542px;
	margin: 22px;
	float: right;
}



/* Expand image on hover */

ul.enlarge{
list-style-type:none; /*remove the bullet point*/
margin-left:80px;
}
ul.enlarge li{
display:inline-block; /*places the images in a line*/
position: relative;
z-index: 0; /*resets the stack order of the list items*/
margin:20px;
}
ul.enlarge img{
background-color:#eae9d4;
padding: 6px;
-webkit-box-shadow: 0 0 6px rgba(132, 132, 132, .75);
-moz-box-shadow: 0 0 6px rgba(132, 132, 132, .75);
box-shadow: 0 0 6px rgba(132, 132, 132, .75);
-webkit-border-radius: 4px; 
-moz-border-radius: 4px; 
border-radius: 4px; 
}
ul.enlarge span{
position:absolute;
left: -9999px;
background-color:#eae9d4;
padding: 10px;
font-family: 'Droid Sans', sans-serif;
font-size:.9em;
text-align: center; 
color: #495a62; 
-webkit-box-shadow: 0 0 20px rgba(0,0,0, .75));
-moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
box-shadow: 0 0 20px rgba(0,0,0, .75);
-webkit-border-radius: 8px; 
-moz-border-radius: 8px; 
border-radius:8px;
}
ul.enlarge li:hover{
z-index: 50;
cursor:pointer;
}
ul.enlarge span img{
padding:2px;
background:#ccc;
}
ul.enlarge li:hover span{ 
top: -300px; /*the distance from the bottom of the thumbnail to the top of the popup image*/
left: -20px; /*distance from the left of the thumbnail to the left of the popup image*/
}
ul.enlarge li:hover:nth-child(2) span{
left: -100px; 
}
ul.enlarge li:hover:nth-child(3) span{
left: -200px; 
}
/**IE Hacks - see http://css3pie.com/ for more info on how to use CS3Pie and to download the latest version**/
ul.enlarge img, ul.enlarge span{
behavior: url(pie/PIE.htc); 
}



/* the frame behind the large image, to make it match the hover images */
.frame {
background-color:#eae9d4;
padding: 10px;
text-align: center; 
-webkit-box-shadow: 0 0 20px rgba(0,0,0, .75));
-moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
box-shadow: 0 0 20px rgba(0,0,0, .75);
-webkit-border-radius: 8px; 
-moz-border-radius: 8px; 
border-radius:8px;
}


/* layout information */

.content {
	padding: 22px 0;
}

/* This grouped selector gives the lists in the .content area space */
.content ul, .content ol { 
	padding: 0 22px 15px 40px; /* this padding mirrors the right padding in the headings and paragraph rule above. Padding was placed on the bottom for space between other elements on the lists and on the left to create the indention. These may be adjusted as you wish. */
}

img.center {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

p.center { 
	text-align: center; 
}

div.center {
	margin-left: auto;
	margin-right: auto;
	width: 8em; 
}

.vcenter {
	min-height: 12em;   
	display: table-cell;
	vertical-align: middle; 
}

.clearfloat {
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}

</style>