/* Many thanks to Paul O'Brien at Sitepoint.com forums for his contributions to this CSS code */

html, body {height:100%}

* html body {
	margin-left: 1px !important;
    margin-left: 0px;
    margin-left/**/:/**/1px;
	} /* to combat IE 1px jog of backgrnd */

#minHeight{float:left;width:0px;height:100%;margin-bottom:-50px;} /*safari wrapper thanks to Tim Connor*/

body {
	margin: 0;
	padding: 0;
	text-align:center;
	font: 12px Verdana,Arial,  sans-serif;
	color: #333;
	background-color: #184C85;
	background-image: url(images/bkrd_main.jpg);
	background-repeat: repeat-y;
	background-position: center top;
}


#container {
	position:relative;
	width: 650px;
	height:100%;
	min-height:100%;
	margin: 0px;
	margin-left: auto;
	margin-right: auto;
	background-color: #ffffff;/* this is the background colour of the right column */
	border-left: 0px solid #000;
	text-align:left;
	margin-bottom:-50px;/* make room for footer */
}

html>body #container{height:auto;} /*for mozilla as IE treats height as min-height anyway*/

#header {
	background:#ffffff url(images/header.jpg);
	text-align:center;
	height: 81px;
}


/* CONTENT DIV
------------------------------*/

#content {
	position: relative;
	border: 0px solid #000;
	padding: 0;
	margin-bottom: 145px;
}

#left {
	position: relative;
	float:left;
	border-right: 0px dotted #999;
	width:190px;
	margin-top: 50px;
	margin-bottom: auto;
	
}

#right {
	position: relative;
	float:right;
	width:397px;
	border:0px dashed #000;
	margin-top: 45px;
	background: url(images/vert_dots.gif) repeat-y left top;
	min-height: 466px;
	margin-bottom: 0px;
	height: 800px;
	padding-top: 0;
	padding-right: 20px;
	padding-bottom: 0;
	padding-left: 30px;
}

* html #right {width:397px;w\idth:397px;height:auto;}

#right ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#cosmos {
	background: url(images/cosmos.jpg) no-repeat;
	height: 86px;
	margin: 10px 0 5px 0;
}	

/* FOOTER
--------------------------------*/
		
#footer {
	position: absolute;
	width: 650px;
	background:#f5f5f5 url(images/horiz_bar.jpg) repeat-x top;
	text-align:center;
	bottom: 0;
	clear:both;
	margin: auto;
	padding-top: 35px;
	height: 70px !important;
    height: 110px;
    height/**/:/**/70px;
}

/* TOP NAVIGATION
-------------------------------*/

#topnav {
	position: relative;
	background:#ffffff url(images/nav_bkrdfull.jpg) top left no-repeat;
	height: 34px;
}

* html a:hover {visibility:visible}

.navhome {
	position: absolute;
	height: 22px;
	width: 92px;
	left: 440px;
	padding: 0;
	background: url(images/nav_home_roll.gif) top left no-repeat;	
	z-index: 1;
}

.navhome a {display:block }
.navhome img {width: 100%; height: 100%; border: 0; }
.navhome a:hover img{visibility:hidden}

.navhomestatic {  /* no rollover image for home tab */
	position: absolute;
	height: 22px;
	width: 397px;
	left: 740px;
	padding: 0;
	z-index: 1;
	top: 74px;
}

.navhomestatic a {display:block }
.navhomestatic img {width: 100%; height: 100%; border: 0; }

.navcontact {
	position: absolute;
	left: 422px;
	height: 22px;
	width: 353px;
	margin:0;
	padding: 0;
	background: url(images/nav_contact_roll.gif) top left no-repeat;
	z-index: 1;
	top: -22px;
}

.navcontact a {display:block }
.navcontact img {width: 100%; height: 100%; border: 0; }
.navcontact a:hover img{visibility:hidden}

.navcontactstatic {  /* no rollover image for contact tab */
	position: absolute;
	height: 22px;
	width: 92px;
	left: 538px;
	padding: 0;
	z-index: 1;
}

.navcontactstatic a {display:block }
.navcontactstatic img {width: 100%; height: 100%; border: 0; }


.horizbarcover1 {
	position: absolute;
	top: 21px;
	left: 441px;
	z-index: 1;
}

.horizbarcover2 {
	position: absolute;
	top: 21px;
	left: 539px;
	z-index: 1;
}

/* NAVIGATION BOX
-------------------------------*/

#navwelcome {
 background: url(images/navbox_welcome.gif) no-repeat left top;
 width: 160px;
 height: 20px;
 padding: 0;
 margin-left: 0 
}
#navtop {
 background: url(images/navbox_menu.gif) no-repeat left top;
 width: 160px;
 height: 20px;
 padding: 0;
 margin-left: 0 
}
#navigation {
   margin-left: 20px;
   padding: 0;
   width: 160px 
 }
#navigation ul {
   padding: 0;
  margin: 0;
   list-style-type: none;
   color: #FFFFFF;
   width: 100%;
   text-align: left;
  background: url(images/navbox_bkrd.gif) no-repeat left bottom;
   overflow:hidden; 
}
#navigation li,  #navigation li a{
  text-decoration: none;
  width: 160px;
  height: 20px;
 clear:both;   
 float:left;
}
#navigation li a.about { background: url(images/navbox_about.gif) no-repeat left top;}
#navigation li a.equip { background: url(images/navbox_equip.gif) no-repeat left top;}
#navigation li a.offer { background: url(images/navbox_special.gif) no-repeat left top;}
#navigation li a.ordering {background: url(images/navbox_ordering.gif) no-repeat left top;}
#navigation li a.contact { background: url(images/navbox_contact.gif) no-repeat left top;}
#navigation li a:hover { background-position: -180px 0px; }
 
 
/* current page markers */
body#about #navabout {
	background: url(images/navbox_about_on.gif) no-repeat left top;
	}

body#equip #navequip {
	background: url(images/navbox_equip_on.gif) no-repeat left top;
	}

body#offer #navoffer {
	background: url(images/navbox_special_on.gif) no-repeat left top;
	}

body#order #navorder {
	background: url(images/navbox_ordering_on.gif) no-repeat left top;
	}

body#contact #navcontact {
	background: url(images/navbox_contact_on.gif) no-repeat left top;
}

/* FEATURED BOX 
------------------------------*/

#featured {
	margin: 40px 0px 0px 20px;
	width: 160px;
	height: 230px !important;
    height: 200px;
    height/**/:/**/230px;
}

#featuredheader {
	height: 20px;
	background-image: url(Inkstone%20Web/Images/ADSPECTYPE.png);
	background-repeat: no-repeat;
	background-position: left top;
}

/* BOX
------------------------------*/

.boxspace {
	background: url(images/box_space.gif) left top;
	height: 100%;
	overflow: hidden;
}

.boxbottom {
	background: url(images/box_bottom.gif) no-repeat;
	height: 18px;
	width: 160px;
	margin: 0;
	padding: 0;
}

/* BREADCRUMBS
-------------------------------*/

#breadcrumbs {
		margin: 10px 25px -26px 204px;
		padding: 0 0 3px 0px;
		border-bottom: 1px solid #d5d5d5;
		color: #b3b3b3;
		font: 10px verdana, arial, sans-serif;
		}
		
.crumb {
		font: 10px verdana, arial, sans-serif;
		color: #b3b3b3;
		}


/* TEXT
-------------------------------*/
p {
	margin: 0 0 10px 0;
	padding: 0;
	line-height: 18px;
}

h1 {
	font-family: Arial, Verdana, sans-serif;
	font-size: 16px;
	color: #1C5DA0;
	margin-bottom: 18px;
}

h1.first { /* 10px top margin for the heading on each page */
	margin-top: 10px;
}

h2 {
	font-family: Arial, Verdana, sans-serif;
	font-size: 14px;
	color: #666;
	margin-bottom: 10px;
}



h3 {
	font-family: Arial, Verdana, sans-serif;
	font-size: 13px;
	color: #6AD153;
	margin-bottom: 10px;
}

#featured p {
	margin: 0 0px 0 0px;
	text-align:center;
}

#content p {
	
}

#footer p {
	text-align: center;
	line-height: 14px;
	margin-bottom: 10px;
	font-size: 10px;
}

#right p {
	margin: 0 10px 10px 0;
	padding: 0;
	line-height: 18px;
}

#right p.first {
	margin-top: 10px;
}

.dots {
	color: #6AD153;
}

img {
border: 0;
}

/* LINKS
-------------------------------*/

a, a:link, a:visited {
	text-decoration: none;
	color: #1C5DA0;
}

a:hover {
	text-decoration: underline;
	color: #6AD153;
}

/* CONTACT
--------------------------------*/

#maincontact input {
		border: 1px solid #999;
		font: 12px verdana, Lucida Sans Unicode, lucida , sans-serif;
		background: #ffffff;
		color: #1C5DA0;
		
		}

#maincontact textarea {
		border: 1px solid #999;
		font: 12px verdana, arial, Lucida Sans Unicode, lucida , sans-serif;
		background: #ffffff;
		color: #1C5DA0;
		}