* {  
  -webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	margin:0;	
  }


body {
	 background: url('/image-files/underwater_background2.jpg') no-repeat center center fixed ; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;	

		font: size 1em;
	margin:3px;  font-family: Titillium, sans-serif;
  color:#444;


  
  }
 .sitesbox {
           margin-left:30px;  
           float:left; 
           width:90%; 
           height:auto; 
           overflow:scroll; 
           overflow-x: hidden; 
	}


  .sites {
  
	float: left;
	padding:5px; 
	margin:5px; 
	width: 295px; 
	height:125px; 
	cursor: pointer;	
 border:thin  black dashed;
}
.sites img {border:1px solid #ccc; margin-right:5px;}

h1, h2, h3, h4 {
  color:#444;
  font-weight: normal;
  margin:0.6em 0 0.8em 0;  text-align:center; 
}
h5, h6
{
  color:#999;
  font-weight: normal;margin-left: 25px;

   
}
h1 {font-size:2em; }
h2 {font-size:1.8em;}  
h3 {font-size:1.6em;}  
h4 {font-size:1.4em;}  
h5 {font-size:1.4em;}  
h6 {font-size:1.4em;}
p {font-family: Titillium, sans-serif;
   font: size 1em; padding: 3px;
		padding-bottom: 9px;
	
     word-wrap:break-word;overflow:hidden ; line-height:1.2em;
}
.text-warp {
  float: right; 
   margin-right: 5px;
}
b2 {font-family:  Verdana, Arial, sans-serif;    color:rgba(0, 0, 0, 0.28);
   font-size:17px; margin: 1px;

	padding-bottom: 3px;

     word-wrap:break-word;overflow:hidden ; line-height:1em;
}
hr {
    max-width: 80%;
 margin-right:auto; margin-left: auto;
	}
	ul {
	margin-left: 35px;
     }
a {
}
 a:visited, a:hover, a:active {
	
  text-decoration: none;
	}

a.top, a.name, a.id  { /* this code is for anchor space tothe top */

position: relative;
top:100px;
display: block;
height: 0;
width:0;
}


.table1 {
    border-collapse: collapse;
  
    
    margin-left:25%;margin-right:25%; 
}

 td {
    padding: 8px;
     border-bottom: 1px solid #ddd;
}
th { text-align:center;
    background-color: #4894EC;
    color: white;}
tr:hover{background-color:#f5f5f5}

.line2 { align-content:center;}

.size-960 .line {
  margin:0 auto;
  
  padding:0 0.625em;
}
.size-1140 .line {
  max-width:1080px;
   margin:0 auto;   box-shadow: 0px 0px 8px 4px #e0e0e0;
}
.size-960.align-content-left .line,.size-1140.align-content-left .line {margin-left:0;}
form {line-height:0.4em;}

.padding {
  display:list-item;
  list-style:none outside none;
  padding:10px;
}
.margin {margin:0 -0.625em;}
.line {clear: both;}
.line .line {padding:0;}
.hide-l {display:none;}
.box {
 background:none repeat scroll 0 0 #fff;
  display:block;
  padding:0.25em;
  width:100%;
 
 
 
}
.margin-bottom {margin-bottom:1.25em;}
.s-1, .s-2,.s-five,.s-3, .s-4, .s-5, .s-6, .s-7, .s-8, .s-9, .s-10, .s-11, .s-12, .l-1, .l-2, .l-five, .l-3, .l-4, .l-5, .l-6, .l-7, .l-8, .l-9, .l-10, .l-11, .l-12 {
  float:left;
  position:relative;clear: both; } 
.s-1 {width:8.3333%;}
.s-2 {width:16.6666%;}
.s-five {width:16.6666%;}
.s-3 {width:25%;}
.s-4 {width:33.3333%;}
.s-5 {width:41.6666%;}
.s-6 {width:50%;}
.s-7 {width:58.3333%;}
.s-8 {width:66.6666%;}
.s-9 {width:75%;}
.s-10 {width:83.3333%;}
.s-11 {width:90%;}
.s-12 {width:100%; }
.margin > .s-1,.margin > .s-2,.margin > .s-five,.margin > .s-3,.margin > .s-4,.margin > .s-5,.margin > .s-6,.margin > .s-7,.margin > .s-8,.margin > .s-9,.margin > .s-10,.margin > .s-11,.margin > .s-12,
.margin > .l-1,.margin > .l-2,.margin > .l-five,.margin > .l-3,.margin > .l-4,.margin > .l-5,.margin > .l-6,.margin > .l-7,.margin > .l-8,.margin > .l-9,.margin > .l-10,.margin > .l-11,.margin > .l-12 {padding:0 0.5em;}
.margin > .s-1 {width:8.3333%;}
.margin > .s-2 {width:16.6666%;}
.margin > .s-five {width:20%;}
.margin > .s-3 {width:25%;}
.margin > .s-4 {width:33.3333%;}
.margin > .s-5 {width:41.6666%;}
.margin > .s-6 {width:50%;}
.margin > .s-7 {width:58.3333%;}
.margin > .s-8 {width:66.6666%;}
.margin > .s-9 {width:75%;}
.margin > .s-10 {width:83.3333%;}
.margin > .s-11 {width:90%;}
.margin > .s-12 {width:100%;}
.l-1 {width:8.3333%;}
.l-2 {width:16.6666%;}
.l-five {width:20%;}
.l-3 {width:25%;}
.l-4 {width:33.3333%;}
.l-5 {width:41.6666%;}
.l-6 {width:50%;}
.l-7 {width:58.3333%;}
.l-8 {width:66.6666%;}
.l-9 {width:75%;}
.l-10 {width:83.3333%;}
.l-11 {width:90%;}
.l-12 {clear:left;width:100%;}
.margin > .l-1 {width:8.3333%;}
.margin > .l-2 {width:16.6666%;}
.margin > .l-five {width:20%;}
.margin > .l-3 {width:25%;}
.margin > .l-4 {width:33.3333%;}
.margin > .l-5 {width:41.6666%;}
.margin > .l-6 {width:50%;}
.margin > .l-7 {width:58.3333%;}
.margin > .l-8 {width:66.6666%;}
.margin > .l-9 {width:75%;}
.margin > .l-10 {width:83.3333%;}
.margin > .l-11 {width:90%;}
.margin > .l-12 {width:100%;}
.right {float:right;} 
@media screen and (max-width:800px) {
.size-960 {max-width:800px;}
.size-1140 {max-width:800px;}
.hide-l {display:block;}
.hide-s {display:none;}
.count-number {margin-right:-1.25em;} 
.l-1 {width:8.3333%;}
.l-2 {width:16.6666%;}
.l-five {width:20%;}
.l-3 {width:25%;}
.l-4 {width:33.3333%;}
.l-5 {width:41.6666%;}
.l-6 {width:50%;}
.l-7 {width:58.3333%;}
.l-8 {width:66.6666%;}
.l-9 {width:75%;}
.l-10 {width:83.3333%;}
.l-11 {width:90%;}
.l-12 {width:100%;}
.margin > .l-1 {width:8.3333%;}
.margin > .l-2 {width:16.6666%;}
.margin > .l-five {width:20%;}
.margin > .l-3 {width:25%;}
.margin > .l-4 {width:33.3333%;}
.margin > .l-5 {width:41.6666%;}
.margin > .l-6 {width:50%;}
.margin > .l-7 {width:58.3333%;}
.margin > .l-8 {width:66.6666%;}
.margin > .l-9 {width:75%;}
.margin > .l-10 {width:83.3333%;}
.margin > .l-11 {width:90%;}
.margin > .l-12 {width:100%;}
.s-1 {width:8.3333%;}
.s-2 {width:16.6666%;}
.s-five {width:20%;}
.s-3 {width:25%;}
.s-4 {width:33.3333%;}
.s-5 {width:41.6666%;}
.s-6 {width:50%; }
.s-7 {width:58.3333%;}
.s-8 {width:66.6666%;}
.s-9 {width:75%;}
.s-10 {width:83.3333%;}
.s-11 {width:90%;}
.s-12 {width:100%;float:none;}
.margin > .s-1 {width:8.3333%;}
.margin > .s-2 {width:16.6666%;}
.margin > .s-five {width:20%;}
.margin > .s-3 {width:25%;}
.margin > .s-4 {width:33.3333%;}
.margin > .s-5 {width:41.6666%;}
.margin > .s-6 {width:50%;}
.margin > .s-7 {width:58.3333%;}
.margin > .s-8 {width:66.6666%;}
.margin > .s-9 {width:75%;}
.margin > .s-10 {width:83.3333%;}
.margin > .s-11 {width:90%;}
.margin > .s-12 {width:100%;}
}

.center {
  
  margin:0 auto;
  margin-right:auto; margin-left: auto; text-align:center;
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
.center1 {position: fixed;
  left: 50%;
  margin-top: -50px;
  margin-left: -100px;margin-right:auto; margin-left: auto; text-align:center;
}
.center2 {max-width: 90%; background-color:#4894EC; text-align:center; padding:5px; margin:50px; text-decoration-color:none, #fff;
}
.center2 a{font:#fff;
}
.center2 a hover{text-decoration:none;
}
.clear{content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }
.box1 {
 float:right; 
}
.box2 {
  font-family:Verdana, Arial, sans-serif; font-size:17px;  width:100%;

}
.box-right {
 float:right; max-width:200px; padding:15px;display:block;
 }
.box-left {
 float:left; max-width:200px;padding:15px; display:block;

}
.text-box {float:left; padding:15px; margin:20px;display:block;
}
.box4 { background-color:#4894EC;  text-align:center; margin-right:auto; margin-left: auto; width:100%;
}
.textwarp-right {
 float:right; margin: 10px;
}
.textwarp-left {
  overflow: hidden; /* this will clear the float from .item img */
	
}
.textwarp-none {
  clear: both;
    margin-bottom: 2px;
	
}
  .text_line {
    clear: both;
    margin-bottom: 2px;
}  
  #text_line {
    clear: both;
    margin-bottom: 2px;
}    
   #text_line1 {
    clear: both;
    margin-bottom: 2px;
} 
.promo {float:left; max-width:220px; max-height:150px; align-content:center; font-family:Verdana, Arial, sans-serif; font-size:17px; border: 1px solid #ccc; text-align:center;
}
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx

************************************************************************************/
   /* HorizontalTab sites */
   .divbox { float:left;width:300px;height:auto; overflow:hidden;
	
	}

************************************************************************************/
.imageHolder { max-width: 950px; height: 30px;  margin-right:auto; margin-left: auto;}  
.imageHolder .caption { margin-right:auto; margin-left: auto;
bottom: 0px; left: 0px; color: #000; 
background: #e4dddd; text-align:center;  font-weight:bold; opacity:0.7; }
.caption a{color: #474747; text-decoration: none;}
.caption a:hover {color: #DA251D; text-decoration: none;}

************************************************************************************/
.tooltip {
  text-decoration:none;
  position:relative;
}
 
.tooltip span {
  display:none;
  -moz-border-radius:6px;
  -webkit-border-radius:6px;
  border-radius:6px;
  color:black;
  background:white; 
}
 
.tooltip span img {
  float:left;
  margin:0px 0px 0px 0;
}
 
.tooltip:hover span {
  display:block;
  position:absolute;
  top: 100%;
  left: 50%;
  margin-left: -220px; /* Use half of the width (120/2 = 60), to center the tooltip */
  z-index:1;
  width:auto;
  max-width:420px;
  min-height:160px;
  border:1px solid black;
  
 
  overflow:hidden;
  padding:1px;
}


************************************************************************************/


************************************************************************************/
.gallary-table {
	width: 90%;
    padding:15px;
    margin-left:auto; margin-right:auto;margin-bottom:20px;
    overflow: auto; 
	background: #fff; 
    border: 2px solid #969191;
    border-radius:20px;-moz-border-radius:20px;-webkit-border-radius:20px;
   box-shadow: 0px 0px 8px 4px #666;
}
************************************************************************************/ 
.button{cursor: pointer;color: #ffffff;line-height: 10px;font-family: Arial, Helvetica, sans-serif;font-size: 13px;font-weight: bold;	background: #4894EC;display: inline-block;text-decoration: none;padding: 5px 12px 5px 12px;border:1px solid #ccc;}
.button:hover, visited{text-decoration: none;}
***********************************************************************************/ 

.cssbox {
    float: none;
    border:1px solid #ccc;
    border-radius: 20px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    box-shadow: 0px 0px 4px 2px #f7f4f2;
    margin: 8px;
    padding: 5px;
    width: 100%;
    height: auto;
}


**************************************************************************************
.block {  }
.block1 { float:left;background-color:#FFF; border:1px solid #CCC;margin:7px; padding: 4px;max-width:25%;min-height:350px;}
.block1 p{text-align:center; padding-bottom:0px;}
.block1 img{border:0px solid #CCCCCC;}


.block2 { float:left;background-color:#FFF; border:1px solid #CCC;margin:5px; padding: 4px; max-width:95%;}
.block3 { float:left;background-color:#FFF; border:1px solid #CCC;margin:7px; padding: 4px;max-width:300px; height:220px;border-radius:20px;-moz-border-radius:20px;-webkit-border-radius:20px;
   box-shadow: 0px 0px 4px 2px #ccc;}
.block3 img{border:2px solid #CCCCCC;margin:5px;}
.block4 { float:left;background-color:#FFF; border:1px solid #CCC;margin:7px; padding: 4px;max-width:200px; max-height:280px;}
.block5 { float:left;background-color:#FFF; border-radius:20px;-moz-border-radius:20px;-webkit-border-radius:20px;
   box-shadow: 0px 0px 4px 2px #f7f4f2; margin:8px; padding:5px;}
.block5 img{border:1px solid #CCCCCC;margin:5px;}
.block6 { float:left;border:1px solid #CCC; margin:7px; padding: 4px; }
.block6 img{margin:10px;}
.block7 { float:left;background-color:#FFF; border-radius:20px;-moz-border-radius:20px;-webkit-border-radius:20px;
   box-shadow: 0px 0px 4px 2px #ccc; margin:5px; padding:5px;width:360px; height:180px;}
.block7 img{margin:5px;}
.block8 { float:left;background-color:#FFF; border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;
   box-shadow: 0px 0px 4px 2px #ccc; margin:5px; }
      
   /* block9 use for Diving Accessories page */
   .block9 { float:left;background-color:#FFF;  border: thin silver solid;
  border-radius: 15px; margin:5px; display:block;
   }
     .block95 { width:45%; height:260px; float:left; background-color:#FFF; border: thin silver solid;
  border-radius: 15px; margin:5px; display:block; 
   }

   .block99 { width:30%; height:280px; float:left; background-color:#FFF; border: thin silver solid;
  border-radius: 15px; margin:5px; display:block; 
   }

**************************************************************************************

**************************************************************************************
#show1, #show2, #show3, #show3 { }
#content1, #content2, #content3 {
    display: block;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out;
    opacity: 0; 
    height: 0;
    font-size: 0;
    overflow: hidden;
}
#show1, #show2, #show3, #show3 :before {
    content: ""
}
#show1, #show2, #show3, #show3:active.#show1, #show2, #show3, #show3:before {
    content: ""
}
#show1, #show2, #show3, #show3 :active ~ span#content1, span#content2, span#content3 {
    opacity: 1;
    font-size: 120%;
    height: auto;
}



/* extra */
#content, #content1, #content2 {
    
    margin: 10px auto;
}

xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
.css-slideshow {
position: relative;
max-width: 495px;
height: 370px;
margin: 1em auto .5em auto;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
font-weight: 300;
}
.css-slideshow figure {
margin: 0;
max-width: 495px;
height: 370px;
background: #fff;
position: absolute;
}
.css-slideshow img {
-webkit-box-shadow: 0 0 2px #666;
box-shadow: 0 0 2px #666;
}
.css-slideshow figcaption {
position: absolute;
top: 5px;
color: #fff;
background: rgba(0,0,0, .3);
font-size: .8em;
padding: 8px 12px;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
opacity: 0;
-webkit-transition: opacity .5s;
-moz-transition: opacity .5s;
-o-transition: opacity .5s;
-ms-transition: opacity .5s;
transition: opacity .5s;
}
.css-slideshow:hover figure figcaption {
-webkit-transition: opacity .5s;
-moz-transition: opacity .5s;
-o-transition: opacity .5s;
-ms-transition: opacity .5s;
transition: opacity .5s;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
opacity: 1;
}
.css-slideshow-attr {
max-width: 530px;
text-align: right;
font-size: .7em;
font-style: italic;
}
.css-slideshow-attr a {
color: #666;
}
.css-slideshow figure:nth-child(1),.css-slideshow figure:nth-child(2),.css-slideshow figure:nth-child(3),.css-slideshow figure:nth-child(4),.css-slideshow figure:nth-child(5),.css-slideshow figure:nth-child(6),.css-slideshow figure:nth-child(7) {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
opacity: 0;
}
.css-slideshow figure:nth-child(1) {
-webkit-animation: xfade 48s 42s  infinite;
-moz-animation: xfade 48s 42s  infinite;
-ms-animation: xfade 48s 42s infinite;
-o-animation: xfade 48s 42s infinite;
animation: xfade 48s 42s infinite;
}
.css-slideshow figure:nth-child(2) {
-webkit-animation: xfade 48s 36s infinite;
-moz-animation: xfade 48s 36s infinite;
-ms-animation: xfade 48s 36s infinite;
-o-animation: xfade 48s 36s infinite;
animation: xfade 48s 36s infinite;
}
.css-slideshow figure:nth-child(3) {
-webkit-animation: xfade 48s 30s infinite;
-moz-animation: xfade 48s 30s infinite;
-ms-animation: xfade 48s 30s infinite;
-o-animation: xfade 48s 30s infinite;
animation: xfade 48s 30s infinite;
}
.css-slideshow figure:nth-child(4) {
-webkit-animation: xfade 48s 24s infinite;
-moz-animation: xfade 48s 24s infinite;
-ms-animation: xfade 48s 24s infinite;
-o-animation: xfade 48s 24s infinite;
animation: xfade 48s 24s infinite;
}
.css-slideshow figure:nth-child(5) {
-webkit-animation: xfade 48s 18s infinite;
-moz-animation: xfade 48s 18s infinite;
-ms-animation: xfade 48s 18s infinite;
-o-animation: xfade 48s 18s infinite;
animation: xfade 48s 18s infinite;
}
.css-slideshow figure:nth-child(6) {
-webkit-animation: xfade 48s 12s infinite;
-moz-animation: xfade 48s 12s infinite;
-ms-animation: xfade 48s 12s infinite;
-o-animation: xfade 48s 12s infinite;
animation: xfade 48s 12s infinite;
}
.css-slideshow figure:nth-child(7) {
-webkit-animation: xfade 48s 6s infinite;
-moz-animation: xfade 48s 6s infinite;
-ms-animation: xfade 48s 6s infinite;
-o-animation: xfade 48s 6s infinite;
animation: xfade 48s 6s infinite;
}
.css-slideshow figure:nth-child(8) {
-webkit-animation: xfade 48s 0s infinite;
-moz-animation: xfade 48s 0s infinite;
-ms-animation: xfade 48s 0s infinite;
-o-animation: xfade 48s 0s infinite;
animation: xfade 48s 0s infinite;
}
@keyframes "xfade" {
 0% {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
   	filter: alpha(opacity=100);
   	opacity: 1;
 }
14.67% {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}
16.67% {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
}
 98% {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
   	filter: alpha(opacity=0);
   	opacity: 0;
 }
 100% {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
   	filter: alpha(opacity=100);
   	opacity: 1;
 }
}
@-moz-keyframes xfade {
 0% {
   filter: alpha(opacity=100);
   opacity: 1;
 }
14.67% {
	filter: alpha(opacity=100);
	opacity: 1;
}
16.67% {
	filter: alpha(opacity=0);
	opacity: 0;
}
 98% {
   filter: alpha(opacity=0);
   opacity: 0;
 }
 100% {
   filter: alpha(opacity=100);
   opacity: 1;
 }
}
@-webkit-keyframes "xfade" {
 0% {
   filter: alpha(opacity=100);
   opacity: 1;
 }
14.67% {
	filter: alpha(opacity=100);
	opacity: 1;
}
16.67% {
	filter: alpha(opacity=0);
	opacity: 0;
}
 98% {
   filter: alpha(opacity=0);
   opacity: 0;
 }
 100% {
   filter: alpha(opacity=100);
   opacity: 1;
 }
}
@-ms-keyframes "xfade" {
 0% {
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
 }
14.67% {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}
16.67% {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
}
 98% {
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
   filter: alpha(opacity=0);
   opacity: 0;
 }
 100% {
   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
   filter: alpha(opacity=100);
   opacity: 1;
 }
}
@-o-keyframes "xfade" {
 0% {
   filter: alpha(opacity=100);
   opacity: 1;
 }
14.67% {
	filter: alpha(opacity=100);
	opacity: 1;
}
16.67% {
	filter: alpha(opacity=0);
	opacity: 0;
}
 98% {
   filter: alpha(opacity=0);
   opacity: 0;
 }
 100% {
   filter: alpha(opacity=100);
   opacity: 1;
 }
}
xxxxxxxxxxxxxxxxxxxxxxxxxxxx