@charset "utf-8";
/* CSS Document */
* {	margin: 0;
	padding: 0;
	text-decoration:none;
}
html{
	min-height:100%;
}

body {
	height: 100%;
   margin:0;
   padding:0;
   font-family: arial, helvetica, sans-serif;
   font-size: 82.5%;
   font-style:normal;
   font-weight:normal;
   line-height: 1.0em;
   font-color:#fff;
   background: url(../images/dark_fish_skin.png);
} 

*{  margin:0;  
    padding:0;  
}  
	
#container {
   height:100%;
   height: auto !important; /* prevents newer browser from seeing next line     which they don't need*/
   min-height:100%;  /*doesn't work  with ie6*/
   margin: 0px auto; 
   width:900px;
   position:relative;
   padding-bottom: -150px; 
   	box-shadow:0px 10px 5px 5px rgba(0, 0, 0, 0.3); 
  	background-image:-moz-linear-gradient(top, #00F 0%, #333 90%);
	background-image:-ms-linear-gradient(top, #00F 0%, #333 90%);
	background-image:-webkit-linear-gradient(top, #00F 0%, #333 90%);
	background-image:linear-gradient(top, #00F 0%, #333 90%)
	background-repeat: no-repeat; 
}

* html #container { height: 100%; } /* for IE */
   
#header {
   background:none;
   width:900px;
   margin: 0px auto;
}
#header1 {
   position:fixed;
   height:61px;
   width:778px;
   top: -55px;
   margin: 5px 0 0 120px;
   text-align:center;
}
#header2 {
   position:fixed;
   height:61px;
   width:778px;
   top: -5px;
   margin: 5px 0 0 120px;
   text-align:center;
}

#navbar{
	display:block;
	height:30px;
	width:auto;
	margin: 0px auto; 
	margin-top:0px;
	text-align:center;
	background: none;
	top:0px;
	z-index: 200;
	padding: 0 0 0 0px;
	background: #f26017;  
    	background-image: -moz-linear-gradient(top, #f26017, #222);  
    	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f26017), 		to(#222));
		background-image: -ms-linear-gradient(top, #f26017, #222); 
} 

#body {
   padding: 0px 0px 0px 0px; /* padding height is height of the footer */
   width:900px;
   text-align:center;
   margin: 0px auto; 
   min-height: 100%;
   height: 100%;
}

#footer {
   clear: both;
   position:relative;
   bottom:0;
   min-width: 900px;  /* width of logo and masthead */
   width:100%;
   height:150px;   /* Height of the footer */
   padding-top: 15px;
   background:#000064;
}

div#footerC{
	width: 900px;  /* width of content */
	position: relative;
	top: 20px;
	margin: 0px auto;  /* Required for centered content */
	padding: 0px 0px;
	background-color:#000 /*2D2D2D */;
	z-index:302;
}

/* first navigation row */
#testnav ul {width: 900px; padding:0;margin:0px auto; height:.0em; } 
#testnav li { 
	display: inline-block;
    list-style-type: none;
	top: 0px; 
	text-align:center; 
	position:relative;
	margin:0px auto;
	margin-left:0px;  /* aligns drop-down with navi button */
	font: .8em verdana, sans-serif; 
	z-index: 200
}

#testnav a {
	display: block;
	width: 11em;
	color: #fff;
	line-height: 30px; /* height of nav bar */
	text-decoration: none;
	border-right: .06em solid #999;  
	margin: 0 0px -1px 0;
	background: #f26017;  
    	background-image: -moz-linear-gradient(top, #f26017, #222);  
    	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#f26017), 		to(#222));
	background-image: -ms-linear-gradient(top, #f26017, #222); 
	moz-border-top-right-radius: 8px;
	-webkit-border-top-right-radius: 8px;
	-khtml-border-top-right-radius: 8px;
	border-top-right-radius: 8px;
}

#testnav :hover > a { background:#999; /* color of button on hover */
         color: #000; }	 
#testnav li ul {
	display: none;
	width:11em; /* Width to help Opera out */
	background-color: #000;
} 	 

#testnav :hover > ul { visibility:visible; }
#testnav li:hover ul {
	display: block;
	position: absolute;
/*	top: -15px; *//* creates space between top of navi button and drop-down */
	margin-left: -3px; /* aligns drop-down with navi button */
	padding: 0;}
#testnav li:hover li {
	float: none;}
#testnav li:hover li a {
	background-color: #595CD2;
	border-bottom: 0px solid #000099; /* color of bottom edge of drop-down on hover */
	color: #fff;
}
#testnav li li a:hover {
	background-color: #0000C1; border:1px solid #666666;}
	
.col_1 {
	width:50%;
	display:inline;
	float: left;
	position: absolute;
	margin-left: 5px;
	margin-right: 5px;
}  	

.col_2 {
	width:50%;
    display:inline;  
   	float: left;  
   	position: relative;  
   	margin-left: 5px;  
   	margin-right: 5px;  
}  	

#bannerL {
	float: left;
	margin-left: 10px;
	margin-right: 10px;
	padding:0 10 0 10x;
	width: 40px;
	background-color: none;
}

#box1 {
	/* do not specify height on floating divs */
	position: relative;
	float:left; 
	top: 0px;
	left:0px;
/*	min-width: 690px; */
	width: 56%;
	background-color: none;
	padding-left:10px;
	padding-right:10px;
    margin: 10px 10px 10 0;
	display: inline;
	text-align: left;
	z-index:100;
}

#box1W /* for parts page*/{
	/* do not specify height on floating divs */
	position: relative;
	float:left; 
	top: 0px;
	left:55px;
/*	min-width: 690px; */
	width: 75%;
	padding-left:10px;
	padding-right:10px;
    margin: 10px 10px 10px 10px;
	display: inline;
	text-align: left;
	z-index:100;
}

#box1Wb /* for engine rebuild page*/{
	/* do not specify height on floating divs */
	position: relative;
	float:left; 
	top: 0px;
	left:50px;
/*	min-width: 690px; */
	width: 75%;
	background-color: none;
	padding-left:10px;
	padding-right:10px;
    margin: 10px 10px 10 0;
		display: inline;
	text-align: left;
	z-index:100;
}

#box1C /* for contact page*/{
	position: relative;
	float:left; 
	top: 20px;
	left:50px;
/*	min-width: 690px; */
	width: 75%;
	background-color: none;
	padding-left:10px;
	padding-right:10px;
	margin: 10px 10px 20px 0px;
    display: inline;
	text-align: left;
	z-index:100;
}

#box1Wc /* for paypal logo*/{
	position: relative;
	float:left; 
	top: 0px;
	left:140px;
/*	min-width: 690px; */
	width: 75%;
	background-color: none;
	padding-left:10px;
	padding-right:10px;
    margin: 10px 10px 10 0;
		display: inline;
	text-align: left;
	z-index:100;
}

#box2A {
	/* do not specify height on floating divs */
	position: relative;
	float:right;
	top: 15px;
	left:-10px;
	width: 300px;
	background-color: none;
	margin-top: 6px;
	display: inline;
	text-align: left;
	z-index:100;
	padding-left:5px;
	padding-right:5px;
}

#box2 {
	/* do not specify height on floating divs */
	position: relative;
	float:right;
	top: 15px;
	left:-200px;
	width: 300px;
	background-color: none;
	margin-top: 6px;
	display: inline;
	text-align: left;
	z-index:100;
	padding-left:5px;
	padding-right:5px;
}

#box2a {
	/* do not specify height on floating divs */
	position: relative;
	float:right;
	top: 15px;
	left:-50px;
	width: 150px;
	background-color:none;
	margin-bottom: 15.0px;
	display: inline;
	text-align: left;
	z-index:100;
	padding-left:0px;
	padding-right:5px;
}

#box2aW {
	/* do not specify height on floating divs */
	position: relative;
	float:right;
	top: 15px;
	left:-50px;
	width: 150px;
	background-color:none;
	margin-left:650px;
	margin-bottom: 15.0px;
	display: inline;
	text-align: left;
	z-index:100;
	padding-left:0px;
	padding-right:5px;
}

#box2pL /* for parts page*/{
	/* do not specify height on floating divs */
	position: relative;
	float:left;
	top: 15px;
	left:60px;
	width: 300px;
	background-color: none;
	margin-top: 6px;
	margin-bottom: 30px;
	display: inline;
	text-align: left;
	z-index:100;
	padding-left:5px;
	padding-right:5px;
}

#box2pR /* for parts page*/{
	/* do not specify height on floating divs */
	position: relative;
	float:right;
	top: 15px;
	left:-85px;
	width: 300px;
	background-color: none;
	margin-top: 6px;
	margin-bottom: 30px;
	display: inline;
	text-align: left;
	z-index:100;
	padding-left:5px;
	padding-right:5px;
}

.imgcontain1 {
	float:left;
	margin-top: 10px;
	margin-right:10px;
}

/* box around image margin:0 px 0 5; */
#over img {
	display: block;
/*	width: 300px;
	height: 440px;  */
	margin: 0em 0em 1.5em .50em;
	padding: 2px 2px 2px 2px;
	float:right;
	border:.06em solid #999;
 }
   
p.box {
 	font-family:"arial", helvetica, san-serif;
    font-size:1.3em ;
    font-style:normal;.
    font-weight:normal;
    color:#ffffff;
	line-height: 20px;
	text-align: center; 
	margin-top: 10px;
}

p.desc   {
   text-align:left;
   font: san-serif;
   font-size:.75em;
   font-style:italic;.
   font-weight:normal;
   line-height: 1.1em;
   color:#ccc;
   width:180px;
   margin-top:8px;
   margin-bottom:2px;
   margin-left:2px;
} 
p.descCC   {
   text-align:left;
   font: san-serif;
   font-size:.75em;
   font-style:italic;.
   font-weight:normal;
   line-height: 1.1em;
   color:#ccc;
   width:300px;
   
} 

p.descL   {
   margin-top:-3px;
   text-align:left;
   font: san-serif;
   font-size:.75em;
   font-style:italic;.
   font-weight:normal;
   line-height: 1.2em;
   color:#fff;
   background:#333;
   width:auto;
   padding-top:4px;
   padding-bottom:4px;
   padding-left:2px;
} 

p.dotted {font-family:"arial", helvetica, san-serif;
    font-size:0.75em ;
    font-style:normal;.
    font-weight:normal;
    line-height: 20px; 
 	border-bottom-style:dotted; border-bottom-color:#A6A6FF;}

p.divider {font-family:"arial", helvetica, san-serif;
    font-size:1.1em ;
    font-style:normal;.
    font-weight:normal;
    line-height: 1.5em; 
 	border-bottom-style:solid; 
	border-bottom-width:.06em;
	border-bottom-color:#A6A6FF;}
	
/* p for drop cap with no margin at top */
p.drop {font-family:"arial", helvetica, san-serif;
    font-size:.9em ;
    font-style:normal;.
    font-weight:normal;
    line-height: 20px;
}

p.foot   {
   text-align:center;
   font: san-serif;
   font-size:.75em;
   line-height: 1.2em;
   font-style:italic;.
   font-weight:normal;
   color:#51A8FF;
   margin-top:20px;
} 

p.head   {
   text-align:center;
   font: san-serif;
   font-size:.75em;
   line-height: 1.0em;
   font-style:italic;.
   font-weight:normal;
   color:#51A8FF;
   margin-top:3px;
}

p {font-family:"arial", helvetica, san-serif;
    font-size:1.1em ;
	font-style:normal;.
    font-weight:normal;
    line-height: 1.5em;
	margin-top:1.0em;
	color:#CCC;
}

p.clock {font-family:"arial", helvetica, san-serif;
    font-size:.8em ;
    font-style:normal;.
    font-weight:normal;
	color:#fff;
	text-align: center; 
}

strong {line-height:2.5em;font: bold 120% san-serif; color: #424242; font-family: arial, helvetica, san-serif;}

p.header2 {
	font-family:'Syncopate', sans-serif;
	font-size:3.8em;
	font-weight:normal;
	line-height: 1.3em;
	color: #ccc;
	margin-left: auto;
    margin-right: auto;
	text-align:center; 
	text-shadow:2px 2px #000;
}	
p.header {
	font-family: 'Prosto One', cursive;
	font-size:4.0em;
	font-weight:normal;
	font-variant: small-caps;
    text-transform: capitalize;
	line-height: 1.0em;
	color: #1111e7;
	padding-top:3px;
    margin-left: auto;
    margin-right: auto;
	text-align:center; 
	text-shadow:2px 2px #000;
}	

H1 {
	text-align: center; 
	font-size: 2.8em;
    font-family: Arial, Helvetica, Tahoma, sans-serif;
    line-height:1em;
	font-weight:normal;
	color: #c3c3c3; 
	text-shadow:1px 1px #333; 
	padding:15px 0px 15px 0px;
}	


	
h2 {
	text-align: center; 
	font-size: 2.8em;
    font-family: Arial, Helvetica, Tahoma, sans-serif;
    line-height:1em;
	font-weight:normal;
	color: #c3c3c3; 
	text-shadow:1px 1px #333; 
	padding:15px 0px 15px 0px;
}
	
h3 {text-align: left; font: normal 1.7em serif; color: #E9E9E9; margin-top: .9em; margin-bottom:.4em;}

h3.left {float: left;text-align: left; font: normal 1.7em serif; color: #fff; margin-top: .9em; margin-bottom:.4em;}
H4 {text-align: left; font: 130% sans-serif; color: red; margin:1.5em;
}

h3.parts {float: left;text-align: left; font: normal 1.7em serif; color: #fff; margin-top: .4em; margin-bottom:.4em;}

H4 {text-align: left; font: 130% sans-serif; color: red; margin:1.5em;
}
li {font-family:"arial", helvetica, san-serif;
    font-size:1.1em ;
    font-style:normal;.
    color:#ccc;
	font-weight:normal;
    line-height: 1.5em;
  }
li.bullet {
	font-family:"arial", helvetica, san-serif;
	font-size:1.1em;
	font-style:normal;
    text-indent:10x;
    padding-top: 10px;
	padding-left: 10px; 
	color:#ccc;
	font-weight:normal;
	line-height: 1.5emem;
	margin-left:15px;
}
	
/* links to external sites */
A {
	text-decoration: none;
}

A:link {color: #FFFFFF; font-weight:normal; text-decoration: none;}
A:visited {color: yellow; font-weight:bold; text-decoration: none;}
A:hover {
	text-decoration: none;
	color:#cE7B00;
	background-position: center center;
	background-repeat: no-repeat;
} 
/* links to external sites resources page */

a.sitelink
 {
text-decoration: none 
 }
a.sitelink:link  {
 font-weight:normal;
 color: #000;
 text-align:left;
 padding:0px;
 
}
 a.sitelink:visited {
 font-weight:normal;
 color: #663366;
 text-align:left;
 padding:0px;
 
}
 a.sitelink:active {
 color: #060;
 text-decoration: none;
 
 }
a.sitelink:hov {
	color:#red
	font-weight:normal; 
	text-decoration: none; 
}

/* telephone */
a[href^="tel:"]:before {
    content: "\260E";
    margin-right: 0.5em;
} 

.largeimg   {
   border-bottom:.06em solid #fff auto;
   height:auto;
   width:auto;
   float:left;
   text-align:center;
   margin-right: 20px;
   margin-bottom: 20px;
}
   
div.img   {
   margin:2px;
   border:1px solid #fff;
   height:auto;
   width:auto;
   float:left;
   text-align:center;
}
   
div.imgparts   {
   padding: 0px;
   height:auto;
   width:auto; 
   float:left;
   margin: 0px 20px 10px 0px;
   border: 1px solid #333;
}

div.imgeng   {
   padding: 0px;
   height:auto;
   width:298px; 
   text-align:center;
   margin-left:190px;
   margin-top:20px;
   border: 1px solid #333;
}

div.partsdesc   {
   padding: 0px;
   height:auto;
   width:680px; 
   float:left;
   margin: 0px 0px 10px 0px;
   border-top: .06em solid #c3c3c3;
}

div.imgmain   {
   margin-right:0px;
   border:0px solid #fff;
   height:auto;
   width:298px;
   text-align:center;
   margin-top:20px;
   margin-left:200px;
   margin-bottom:20px;
   border: 0px solid #333;
}

 div.imgmainT   {
  top:100px;
   margin-right:0px;
   border:0px solid #fff;
   height:auto;
   width:auto;
   text-align:center;
   margin-top:50px;
   margin-bottom:20px;
   padding-bottom:50px;
}  
   
div.largeimg img   {
   display:inline;
   margin:2 5 2 2px;
   border:1px solid #fff;
}
  
 div.img img   {
   display:inline;
   margin:3px;
   border:1px solid #ffffff;
}

 div.img a:hover img   {
   border:1px solid #0000ff;
}

 div.desc   {
   text-align:left;
   font: san-serif;
   font-size:.75em;
   font-style:italic;.
   font-weight:normal;
   width:220px;
   margin:2px;
} 

Script-RORY IAN M. BUALAN A {text-decoration: none}
 
/*footer text*/
.wrap {	
		position:relative;
		margin:0 auto;
               /*replace 960 with your width*/
		width:828px;
}

/* fading background */
H4.one{
	background-color:#2c2c2c;
	background: linear-gradient(-90deg, #2c2c2c 30%, #444 70%);
	border:0em solid #444;
	width: 445px;
}

/* table code */
table{
	border-collapse:collapse;
}

th{	background-color:#000064;
	color:white;
	font-family: "arial", helvetica, san-serif;
	font-size:1.1em;
	height: 1.8em;
	padding:5px;
	text-align: left;
	vertical-align:middle;
}

tr.alt td {
	background-color:#33f;
	color:#fff;
	height:1.48em;
	vertical-align:bottom;
	font-family: arial, helvetica, san-serif;
	font-size: 0.9em;
	padding:4px 4px 4px 4px;
	padding-bottom:4px;
}

tr.one td{
	background-color:#66f;
	color:#000;
	height:1.48em;
	vertical-align:bottom;
	font-family: arial, helvetica, san-serif;
	font-size: 0.9em;
	padding:4px 4px 4px 4px;
	padding-bottom:4px;
	
}

/* POP-UP IMAGES */ 

    /***Style the unordered list with the class 'enlarge'***/
    ul.enlarge{
    list-style-type:none; /*remove the bullet point*/
    }
    ul.enlarge li{
	display:inline-block; /*places the images in a line*/
	position: relative; /*allows precise positioning of the popup image when used with position:absolute - see support section */
	z-index: 0; /*resets the stack order of the list items - we'll increase in step 4. See support section for more info*/
	margin:0px 0px 0px 0px; /*space between the images*/
}

/* HIDE LARGE IMAGES */ 
ul.enlarge span{
position:absolute; /*see support section for more info on positioning*/
left: -9999px; /*moves the span off the page, effectively hidding it from view*/
}

/* STYLE SMALL IMAGES */
ul.enlarge img{
padding: 0px; /*frame size*/
/*add a drop shadow to the frame*/
-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);*/
border: 1px solid #222; 
}

/* STYLE LARGE IMAGES */

    /***Override the styling of images set in step 3 to make the frame smaller and the background darker***/
    ul.enlarge span img{
    padding: 2px; /*size of the frame*/
}
    /***Style the <span> containing the framed images and the caption***/
    ul.enlarge span{
    /**Style the frame**/
    padding: 4px; /*size of the frame*/
    /*add a drop shadow to the frame*/
    -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);
    /**Style the caption**/
    font-family: 'Droid Sans', sans-serif; /*Droid Sans is available from Google fonts*/
    font-size:.9em;
    text-align: left;
    color: #fff;
    }

/*  pop-up when the thumbnail is hovered */
 ul.enlarge li:hover{
z-index: 50; /*places the popups infront of the thumbnails, which we gave a z-index of 0 in step 1*/
cursor:pointer; /*changes the cursor to a hand*/
}
/***We bring the large image back onto the page by reducing left from -9999px (set in step 2) to figures below***/
ul.enlarge li:hover span{ /*positions the <span> when the <li> (which contains the thumbnail) is hovered*/
top: -30px; /*the distance from the bottom of the thumbnail to the top of the popup image*/
left: 150px; /*distance from the left of the thumbnail to the left of the popup image*/
}
/***To make it look neater we used :nth-child to set a different left distance for each image***/
ul.enlarge li:hover:nth-child(2) span{
left: -100px;
}
ul.enlarge li:hover:nth-child(3) span{
top: 20px;
left: 20px;
}
ul.enlarge li:hover:nth-child(4) span{
top: 20px;
left: 20px;
}