/* RESET */

html, body, div, span, 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, samp, small, strike, strong, sub, sup, 
tt, var, dl, dt, dd, ol, ul, li, 
fieldset, form, label, legend, 
table, caption, tbody, tfoot, thead, tr, th { margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent; }
table { border-spacing: 0; border-collapse: collapse; }
caption, th, td { text-align: left; font-weight: normal; }
blockquote, q { quotes: none; }
:focus { outline: 0; }

/* RESET END */


body {
background: #0c1b6c url(images/Water_bg_1.jpg) no-repeat ;
}

p {
font-family: Verdana, Arial, Helvetica, sans-serif ;
font-size: 13px ;
}

a {
font-family: Verdana, Arial, Helvetica, sans-serif ;
font-size: 13px ;
color: #0177db ;
}

a:hover {
color: #4bf181 ;
}

tr, td {
font-family: Verdana, Arial, Helvetica, sans-serif ;
font-size: 13px ;
color: #072B4B ;
}

img {
border: none ;
}

h1 {
text-indent: -9999px ;
}

#wrapper {
margin: 0 auto ;
width: 890px ;
padding: 0px 10px 0 10px ;
}

#wrapperWelcome {
margin: 0 auto ;
width: 840px ;
padding: 150px 10px 0 10px ;
}

#welcome {
margin: 0 auto ;
padding: 20px 0 0 0 ;
width: 488px ;
height: 150px; 
background: transparent url(images/Beyond_Deep_Diving.png) no-repeat scroll 0 0 ;
}

#leftWrapper {
float: left ;
width: 451px ;
}

#rightWrapper {
float: right ;
width: 389px ;
}

.left1 {
margin: 0 auto ;
float: left ;
width: 231px ;
}

.right1 {
margin: 0 auto ;
float: right ;
width: 220px ;
}

.left2 {
margin: 0 auto ;
float: left ;
width: 169px ;
}

.right2 {
margin: 0 auto ;
float: right ;
width: 220px ;
}

#footerIndex {
margin: 0 auto ;
padding: 50px 0 0 0 ;
text-align: center ;
color: #052b4d ;
font-size: 11px ;
clear: both ;
}

#footerIndex a {
color: #024074 ;
}



/* links */


.left1 a {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(images/mask_btn.png) no-repeat scroll 0 0;
background-position: 0px -7px ;
display:block;
width:220px;
height:300px;
text-decoration:none;
text-indent:-99999px;
}

.left1 a:hover {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(images/mask_btn.png) no-repeat scroll 0 0;
background-position: 0px -308px ;
display:block;
width:220px;
height:300px;
text-decoration:none;
text-indent:-99999px;
}

.right1 a {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(images/dive_symbol_btn.png)  no-repeat scroll 0 0;
display:block;
width:220px;
height:300px;
text-decoration:none;
text-indent:-99999px;
}

.right1 a:hover {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(images/dive_symbol_btn.png)  no-repeat scroll 0 0;
background-position: 0px -301px ;
display:block;
width:220px;
height:300px;
text-decoration:none;
text-indent:-99999px;
}

.left2 a {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(images/tank_btn.png)  no-repeat scroll 0 0;
display:block;
width:169px;
height:300px;
text-decoration:none;
text-indent:-99999px;
}

.left2 a:hover {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(images/tank_btn.png)  no-repeat scroll 0 0;
background-position: 0px -301px ;
display:block;
width:169px;
height:300px;
text-decoration:none;
text-indent:-99999px;
}


.right2 a {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(images/fin_btn.png)  no-repeat scroll 0 0;
display:block;
width:220px;
height:300px;
text-decoration:none;
text-indent:-99999px;
}

.right2 a:hover {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:transparent url(images/fin_btn.png)  no-repeat scroll 0 0;
background-position: 0px -301px ;
display:block;
width:220px;
height:300px;
text-decoration:none;
text-indent:-99999px;
}


/* Links END */



#container li a {
   background: url(images/csg-4a9efa955f508.png) no-repeat top left;
}



.sprite-dive_symbol_btn { background-position: 0 0; } 
.sprite-fin_btn { background-position: -440px 0; } 
.spriteMaskBtn { background-position: -880px 0; } 
.sprite-tank_btn { background-position: -1320px 0; } 


/* Main Site */

h2 {
color:#0A4375;
font-family:"Trebuchet MS",Arial,Helvetica,Sans-Serif;
font-size:18px;
}

h3#contentH3 {
color:#0A4375;
font-family:"Trebuchet MS",Arial,Helvetica,Sans-Serif;
font-size:16px;
padding: 0 0 0 10px ;
}

p {
font-size: 13px ;
font-family: Verdana,Arial,Helvetica,Sans-Serif ;
line-height: 1.4em ;
color: #072B4B ;
}

ul {
font-size: 13px ;
font-family: Verdana,Arial,Helvetica,Sans-Serif ;
color: #072B4B ;
}

.SSC {
padding: 10px 0  0 190px ;
width: 310px ;
color:#0177DB;
clear: both ;
margin: 0 auto ;
}


h3#sidebarHeader {
margin: 0 auto ;
width: 184px ;
height: 30px ;
background: url(images/sidebar_header.png) bottom center no-repeat ;
font-size: 13px ;
font-family: "Trebuchet MS",Arial,Helvetica,Sans-Serif ;
font-weight: bold ;
text-indent: 8px ;
line-height: 30px ;
color: #fff ;
}

#wrapperMain {
margin: 0 auto ;
width: 890px ;
padding: 0 ;
}

#logo {
width: 250px ;
height: 88px ;
float: left;
padding: 10px ;
}

/* Top right Start */

#topTab {
float: right ;
width: 300px ;
height: 85px ;
background: url(images/top_tab.png) bottom no-repeat ;
padding: 0 0 0 0 ;
}

#topTab span {
font-size: 13px ;
font-family: "Trebuchet MS",Arial,Helvetica,Sans-Serif ;
font-weight: bold ;
color: #fff ;
}

#topTabLeft {
float: left ;
width: 140px  ;
padding: 3px 0 0 5px ;
}

#topTabRight {
float: right ;
width: 125px  ;
padding: 0px 15px 0 0 ;
}

#topTabRight ul {
list-style-type: none ;
}


/* Top right End */

#mainNavWrapper {
clear: both ;
background: url(images/nav.png) no-repeat ;
padding: 0 0 0 6px ;
}

ul#menu{
	margin:0 auto;
	padding: 0;
	list-style-type:none;
	width:885px;
	height:36px;
	font-size:12px;
	background:transparent url("images/MenuSeparator.png") no-repeat top left;
	text-align: center;
}
ul#menu li{
	display:inline;
	float:left;
	margin:0 auto;
	pading:0;
}
	
ul#menu li a{
    text-align: center ;
	display:block;
	float:left;
	color:#fff;
	text-decoration:none;
	padding:12px 8px 0 8px;
	height:24px;
	background:transparent url("images/MenuSeparator.png") no-repeat top right;
	}
	
ul#menu li a:hover{
	background:transparent url("images/nav_hover.png") repeat-x top ;	
	}
	
#pageWrapper {
margin: 0 auto ;
padding: 5px 0 0 0 ;
width: 880px ;
}	

#sidebarWrapper {
float: left ;
width: 192px ;
}

#sidebarWrapper ul {
padding: 10px 0 0 10px ;
list-style-type: none ;
line-height: 1.8em ;
}



/* !!!!!START OF SIDEBAR A !!!!! */  
  
/* Change width to suit */
#sidebarA {
background: transparent;
width: 192px; margin: 0 auto;
}

/* Keeps p text off sides */
#sidebarA p, #sidebarA h1, #sidebarA h2, #sidebarA h4, #sidebarA h5 {
padding: 0 10px;
}

.xtop, .xbottom {
display:block;
background:transparent;
font-size:1px
}

.xb1, .xb2, .xb3, .xb4 {
display:block;
overflow:hidden;
}

.xb1, .xb2, .xb3 {
height:1px;
}

/* When changing BG colour of this, also change BG of .xboxcontent */
.xb2, .xb3, .xb4 {
background:#fff;
border-left:1px solid #08c;
border-right:1px solid #08c;
}

.xb1 {
margin:0 5px;
background:#08c;
}

.xb2 {
margin:0 3px;
border-width:0 2px;
}

.xb3 {
margin:0 2px;
}

.xb4 {
height:2px;
margin:0 1px;
}

/* When changing BG colour of this, also change BG of .xb2, .xb3, .xb4 */
.xboxcontent {
display:block;
background:#fff;
border:0 solid #08c;
border-width:0 1px;
}

/* !!!!!END OF SIDEBAR A !!!!! */ 

/* !!!!!START OF SIDEBAR B !!!!! */  
  
/* Change width to suit */
#sidebarB {
width: 192px; margin: -15px auto 0 auto;
}

/* Keeps p text off sides */
#sidebarB p, #sidebarB h1, #sidebarB h2, #sidebarB h4, #sidebarB h5 {
padding: 0 10px;
}

.xtop, .xbottom {
display:block;
background:transparent;
font-size:1px
}

.xb1, .xb2, .xb3, .xb4 {
display:block;
overflow:hidden;
}

.xb1, .xb2, .xb3 {
height:1px;
}

/* When changing BG colour of this, also change BG of .xboxcontent */
.xb2, .xb3, .xb4 {
background:#fff;
border-left:1px solid #08c;
border-right:1px solid #08c;
}

.xb1 {
margin:0 5px;
background:#08c;
}

.xb2 {
margin:0 3px;
border-width:0 2px;
}

.xb3 {
margin:0 2px;
}

.xb4 {
height:2px;
margin:0 1px;
}

/* When changing BG colour of this, also change BG of .xb2, .xb3, .xb4 */
.xboxcontent {
display:block;
background:#fff;
border:0 solid #08c;
border-width:0 1px;
}

/* !!!!!END OF SIDEBAR B !!!!! */ 

/* SIDEBAR CTA A START */

#sidebarCtaA {
width: 192px; margin: -15px auto 0 auto;
}

#sidebarCtaA img:hover {
opacity:0.8;
filter:alpha(opacity=80)
}

/* SIDEBAR CTA A END */

#contentWrapper {
float: right ;
width: 685px ;
}

#contentWrapper ul {
list-style-type:none
}

#plainUl {
margin: 0 0 0 -20px ;
}

#contentWrapper li {
background:transparent url(images/PostBullets.png) no-repeat scroll left center;
padding: 0 0 0 20px ;
}

#plainUl li {
background:transparent url(images/PostBullets.png) no-repeat scroll left 0px;
padding: 0 0 0 20px ;
}


/* !!!!!START OF CONTENT A !!!!! */  
  
/* Change width to suit */
#contentA {
background: transparent;
width: 685px; margin: 0 auto;
}

/* Keeps p text off sides */
 #contentA h1, #contentA h2, #contentA h4, #contentA h5 {
padding: 0 10px;
}

.xtop, .xbottom {
display:block;
background:transparent;
font-size:1px
}

.xb1, .xb2, .xb3, .xb4 {
display:block;
overflow:hidden;
}

.xb1, .xb2, .xb3 {
height:1px;
}

/* When changing BG colour of this, also change BG of .xboxcontent */
.xb2, .xb3, .xb4 {
background:#fff;
border-left:1px solid #08c;
border-right:1px solid #08c;
}

.xb1 {
margin:0 5px;
background:#08c;
}

.xb2 {
margin:0 3px;
border-width:0 2px;
}

.xb3 {
margin:0 2px;
}

.xb4 {
height:2px;
margin:0 1px;
}

/* When changing BG colour of this, also change BG of .xb2, .xb3, .xb4 */

.learnContent {
background: #fff ;
display:block;
border:0 solid #08c;
border-width:0 1px;
}

#LEFT {
float: left ;
padding: 0 0 10px 10px ;
}

#LEFT  p {
padding: 20px 0 0 0 ;
}

#LEFTcontact {
float: left ;
width: 315px ;
padding: 0 0 10px 10px ;
}

#LEFT ul {
padding: 15px 0 0 30px ;
}

#LEFT span {
padding: 0 0 0 200px ;
}

#contentCtaA {
padding: 20px 0 0 10px ;
}

.floatRight {
float: right ;
padding: 0 10px 0 5px ;
}

.floatRightPic {
background: url(images/image_holder.png) no-repeat ;
width: 340px ;
height: 285px ;
float: right ;
padding: 0 10px 0 5px ;
margin: 0 0 0 5px ;
}

.floatRightPic  img {
margin: 0 auto ;
padding: 8px 5px 0 5px ;
}

#map {
float: right ;
width: 340px ;
height:285px ;
padding: 0 10px 0 5px ;
}

#BOTTOMlearning {
background: #fff url(images/giantocto.jpg) bottom center no-repeat ;
display: block ;
height: 391px ;
}


#BOTTOMvisiting {
background: #fff url(images/crab.jpg) bottom center no-repeat ;
display: block ;
height: 431px ;
}

#BOTTOMrentals {
}


#BOTTOMservices {
}

#BOTTOMcontact {
margin: 0 auto ;
width: 670px ;
padding: 20px 0 0 0 ;
}


/* !!!!!END OF CONTENT A !!!!! */   


/* Certified Divers Page Start */



#certifiedBoxes {
width: 645px ;
margin: 0 auto ;
padding: 10px 0 0 0 ;
}

.certBox {
width: 200px ;
padding: 0 0 0 10px ;
}

.certBox img:hover {
opacity:0.8;
filter:alpha(opacity=80)
}

#wrappedTextCertified {
float: right ;
background: url('http://www.sunstarcreative.ca/images/nudibranch.jpg') no-repeat top right ;
line-height: 1.4em;
color: #072B4B;
width: 670px; /* fixed width, just an example */
}


/* Certified Divers Page End */

#visitingCopy {
width: 650px ;
margin: 0 auto ;
padding: 0 0 20px 0 ;
}

#visitingCopy p {
font-size: 13px ;
font-family: Verdana,Arial,Helvetica,Sans-Serif ;
line-height: 1.4em ;
color: #072B4B ;
}



/* Instructor Page START */
#instructorWrapper {
clear: both ;
margin: 0 auto ;
padding: 0 0 0 10px ;
}

.letterHeaders {
float: left ;
width: 40px ;
color:#0A4375;
font-family:"Trebuchet MS",Arial,Helvetica,Sans-Serif;
font-size:18px;
font-weight: bold ;
padding: 0 10px 0 0 ;
clear: both ;
}

.letterHeaders a {
float: right ;
font-size: 13px ;
font-weight: normal ;
padding: 3px 0 0 0 ;
}

.instructor {
width: 675px ;
padding: 0px 0 0 0 ;
clear:both ;
}


.instructorImage {
float: left ;
}

.instructorBio {
float: right ;
width: 420px ;
}

.instructorDivider {
width: 380px ;
height: 70px ;
margin: 0 auto ;
background: url(images/team_divider.jpg) no-repeat top ;
clear: both ;
}

#instructorBotImage {
width: 380px ;
margin: 0 auto ;
}


/* Instructor Page END */

/* Gallery page START */

#galleryWrapper {
margin: 0 auto ;
}

#galleryTable {
width: 560px ;
margin: 0 auto ;
padding: 15px 0 0 0 ;
}

#galleryTable td {
padding: 5px
}

#galleryTable img {
}


/* Gallery Page END */

/* Rentals Form START */

.mandatory {
color:#990000 ;
}

.whiteTableHeaderText {
padding: 10px 0 10px 10px ;
color: #fff ;
background: #004778 ;
}

.items tr, .items td {
border: #ABC8CE thin solid ;
}

/* Rentals Form END */

/* TEMPLATE CONTENT START */


#templateContent {
padding: 0 0 0 10px ;
width: 670px ;
}

/* TEMPLATE CONTENT END */

/* FOOTER LOGOS START */

#footerLogoWrapper {
float: right ;
height: 100px ;
padding: 0 ;
clear: both ;
}

#box1 {
float: left ;
width: auto ;
height: 100px ;
padding: 0 18px ;
}

#box2 {
float: left ;
width: auto ;
height: 100px ;
padding: 0 18px ;
}

#box3 {
float: left ;
width: auto ;
height: 100px ;
padding: 0 18px ;
}

#box4 {
float: left ;
width: auto ;
height: 100px ;
padding: 0 18px ;
}

#box5 {
float: left ;
width: auto ;
height: 100px ;
padding: 0 18px ;
}
			
/* FOOTER LOGOS END */

/* Main Site END */

/* !!!! TEMP FORM CSS START !!!! */

.tbmain{ 
 /* Changes on the form */
 background: white !important; 
}
.left{
  /* Changes on the form */
  color: black !important; 
  font-family: Verdana !important;
  font-size: 12px !important;
}
.head{
  color:#333333;
  font-size:20px;;
  text-decoration:underline;
  font-family:"Verdana";
}
td.left {
  font-family:"Verdana";
  font-size:12px;
  color:black;
}
.pagebreak{
  font-family:"Verdana";
  font-size:12px;
  color:black;
}
.tbmain{
  height:100%;
  background:white;
}
div.backButton{
    background: transparent url("http://jotform.com//images/btn_back.gif") no-repeat scroll 0 0;
    height:16px;
    width:53px;
    float:left;
    margin-bottom:15px;
    padding-right:5px;
}
div.backButton:hover{
    background: transparent url("http://jotform.com//images/btn_back_over.gif") no-repeat scroll 0 0;
}
div.backButton:active{
    background: transparent url("http://jotform.com//images/btn_back_down.gif") no-repeat scroll 0 0;
}
div.nextButton{
    background: transparent url("http://jotform.com//images/btn_next.gif") no-repeat scroll 0 0;
    height:16px;
    width:53px;
    float: left;
    margin-bottom:15px;
    padding-right:5px;
}
div.nextButton:hover{
    background: transparent url("http://jotform.com//images/btn_next_over.gif") no-repeat scroll 0 0;
}
div.nextButton:active{
    background: transparent url("http://jotform.com//images/btn_next_down.gif") no-repeat scroll 0 0;
}
.pageinfo{
    padding-right:5px;
    margin-bottom:15px;
    float:left;
}
