@charset "utf-8";

body {
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 13px; 
	font-weight: normal; 
	color: #FFFFFF;
	background: #09C url(images/seastar-bg.jpg) right bottom no-repeat;
}

h1, h2, h3 {
	text-align: center;
}

h2 {
	padding:  20px 0 0 0;
}

h4 {
	padding-bottom: 0;
	font-size:14px;
}

a:link {
	color:#FF0;
}
a:hover {
	color:#CF9;
}

/* emphasise first line of a paragraph */
p.intro:first-line, p.introprice:first-line {
	font-size: 14px;
	font-style:italic;
	font-weight:bold;
	color: #FFF;
}

ul.intro {
	margin-top:0;
	padding-top:0;
}

p.comic {
	font-family:"Comic Sans MS", cursive;
	font-size: 16px;
	text-align: center;
}

#mainwrapper {
	width: 80%;
	min-width: 600px;
	max-width: 1600px;
	margin: 20px auto 0 auto;
	min-height: 1200px;
	padding: 0px;
}

#header {
	padding: 5px;
	margin: 15px;
	background-image: url(images/logo-manta.png);
	background-repeat:no-repeat;
	background-position:center;
	height: 200px;
}

#padilogo {
	position: absolute;
	top: 35px;
	left: 20px;
}

#awarelogo {
	position: absolute;
	top: 35px;
	right: 30px;
}

#footerwrapper {
	padding: 15px;
	margin: 0px;
	height: auto;
	clear: both;
	text-align: center;
	border-top: 1px solid #999;
}



/* positioning and container for main nav bar*/
#sidebar-l {
	float: left;
	padding: 10px;
	margin-right: 20px;
}


/* positioning and container for rh links bar*/
#sidebar-r {
	float: right;
	clear: right;
	padding: 10px 10px 0 10px;
	margin-left:20px;
}

/* positioning and container for lower rh links bar*/
#sidebar-r2 {
	float: right;
	clear: right;
	padding: 0 10px 0 10px
}

/* style the UL for the nav bars.  border-bottom applied as removed from individual links */
ul.nav {
	list-style-type: none;
	padding-left: 0;
	margin-left:0;
	width: 130px;
	border-bottom: 1px dashed #999;
	color: #FFF;
	font-size: 14px;
	font-weight: bold;
}

/* style the links for the nav lists */
ul.nav a {
	color: #FFF;
	font-size: 14px;
	font-weight: bold;
	text-decoration: none;
	border: none;
	border-top: 1px dashed #999;
	padding: 7px 5px;
	display: block;
}

/* set the link colour for the current page based on the body id*/
body#home a#lnkhome,
body#centre a#lnkcentre,
body#about a#lnkabout,
body#site a#lnksite,
body#try a#lnktry,
body#course a#lnkcourse,
body#fun a#lnkfun,
body#price a#lnkprice,
body#accom a#lnkaccom,
body#photo a#lnkphoto,
body#contact a#lnkcontact,
body#event a#lnkevent,
body#links a#lnklinks,
body#offer a#lnkoffer,
body#carhire a#lnkcarhire,
a {
	color: #FF0;
}

/* set the link colour for the current page so it appears no change*/
body#home a#lnkhome,
body#centre a#lnkcentre,
body#about a#lnkabout,
body#divesites a#lnkdivesites,
body#try a#lnktry,
body#course a#lnkcourse,
body#fun a#lnkfun,
body#price a#lnkprice,
body#accom a#lnkaccom,
body#photo a#lnkphoto,
body#contact a#lnkcontact,
body#event a#lnkevent,
body#links a#lnklinks,
body#offer a#lnkoffer,
body#carhire a#lnkcarhire,
a:hover {
	color: #FF0;
	background-color: transparent;
}

/* set the hover colour for the nav bars */
ul.nav a:hover {
	color:#FF0;
	background-color: #999
}

/* no hover colour for the image based links */
#sidebar-r  a:hover {
	background-color: transparent;
}

#sidebar-r a {
	text-align: right;
}
#sidebar-r img {
	border: none;
}

/* elearning banner */
#elearn {
    margin-left: auto;
    margin-right: auto;
	padding-bottom: 15px;
}

/* frontpage main image */
img.frontpage {
	width: 50%;
	border: 3px solid #FFF;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/* staff main image */
img.staff {
	width: 300px;
	border: 3px solid #FFF;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/* style list for images at bottom of page */
#imagebanner ul {
	text-align: center;
	margin:0;
	padding:0;
	clear:both;
}
#imagebanner li {
	list-style-type: none;
	display: inline;
}
#imagebanner img {
	border: none;
}

.alignL {
	float:left;
	margin-right: 1em;
	}
.alignR { 
float:right;
 margin-left:  1em;
 }

a img.alignL, a img.alignR {
	border: 1px solid #FFF;
}

/* container for descriptions */
.sitedesc, .sitedesc-upr {
	display:block;
	padding: 10px 15px 10px 15px;
	min-height:180px;
}

/* shorter container for descriptions to avoid wrapping*/
.sitedesc-upr {
	margin-left: 155px;
	margin-right: 155px;
}

table, div.pricedetails {
	width: 500px;
	padding-top:10px;
	padding-bottom:10px;
	text-align:left;
	margin-left:auto;
	margin-right:auto;
	border-bottom:1px solid #FF0;
}
th {
	font-size: 14px;
	font-style:italic;
	font-weight:bold;
	color: #FFF;
}

td:first-child {
	width: 400px;
}

td, th {
	padding:5px;
}

/* old image gallery 

.gallery ul {
	clear:both;
}

.gallery li {
        display: inline;
        list-style: none;
        width: 205px;
        height: 225px;
        float: left;
        margin: 0 10px 10px 0;
        text-align: center;
		border: dotted #CCF 1px;
}

.gallery a img {
	border: solid #FF0 2px;
}

 */
 
 
 
#info {position:relative; z-index:10;}
#gallery {width:650px; position:relative; margin-left:auto; margin-right:auto;}
#gallery .default {position:absolute; left:89px; top:53px; border:1px solid #888; z-index:-1;}
#gallery ul {list-style:none; padding:0; margin:0; width:180px; float:right;}
#gallery ul li {display:inline; width:60px; height:60px; float:left;}

#gallery ul li a {display:block; width:50px; height:50px; text-decoration:none; padding:4px; border:1px solid #fff;}
#gallery ul li a img {width:50px; height:50px; border:0;}

#gallery ul li a b {position:absolute; left:-9999px; display:block; width:470px; height:360px; background:#fff;}

#gallery ul li a:hover,
#gallery ul li a:active,
#gallery ul li a:focus {white-space:normal; border-color:#000; outline:0;}

#gallery ul li a:hover b {position:absolute; left:0; top:5px; z-index:100;}
#gallery ul li a:active b,
#gallery ul li a:focus b {position:absolute; left:0; top:5px;}


#gallery ul li a b i {display:block; width:470px; height:360px; text-align:center; display:table-cell; vertical-align:middle;}
#gallery ul li a b i img {width:auto; height:auto; border:1px solid #888;}






.map {
	width: 450px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 40px;
	padding-top: 30px;
	height: 350px;
	border: 0;
}