/* Behaviour required to fix problems with the :hover pseudo class in IE.
Author  - Peter Nederlof, http://www.xs4all.nl/~peterned*/
body {
	 behavior:url("csshover311.htc");
}

* {
	margin: 0;
	padding: 0;
}

body {
	font-size: 10pt;
	font-family: verdana, Tahoma, helvetica, arial, sans-serif;
        width:952px;
        margin: 0 auto;

}


h1{
    margin-bottom: .5em;
    color: gray;
}

h2 {
    font-size: 1.2em;
    color: gray;
    margin-bottom: .4em;
}

h3 {
    font-size: 1em;
    color: gray;
    margin-bottom: .4em;
    font-weight: bold;
}

p {
    margin-bottom: .5em;
}

/*******************************************************
** Styles for the HEADER div. The header div contains the **
** LOGO div, and the MENU div.                                       **
** The LOGO div contains LOGO_HEADER h1                    **
*******************************************************/
div#header {
        margin: 0 auto;
        background: transparent url(../images/sunburst_logo.jpg) no-repeat scroll bottom left;
        height: 80px;
        margin: 20px 0 20px 20px;
}


/*The menu*/

div#menu {
    width: 100%;
    height: 40px;
    border-bottom: solid #d3d3d3 1px;
    margin-bottom: 10px;
    
}
div#menu ul {
		margin: 0pt; /*Remove indent from Opera and IE*/
		padding: 0pt; /*Remove indent from Mozilla and NN7*/
}
			
#menu li {
	float: left;
	list-style-type: none;
	font-size: 15px;
	white-space: nowrap;
        border-right: solid gray 1px;
        width: 140px;
        ;
}
div#menu a {
	font-weight: bold;
	text-decoration: none;
        color: black;
        height: 30px;
        display: block;
        padding-top:10px;
        padding-left: 15px;
}

div#menu a.current {
    color: gray;
}

/*Home_menu styling*/
div#menu a.goto:hover {
    border-bottom: solid gray 1px;
    height: 29px;
    color: gray;
}



/*STYLES THAT BUILD THE THREE COLUMNS*/
/*Containers*/
/*Styles specific to the right column.*/
 /*Column container*/
.colmask {
    position:relative;	/* This fixes the IE7 overflow hidden bug */
    clear:both;
    width:100%;			/* width of whole page */
    overflow:hidden;		/* This chops off any overhanging divs */
    border: solid #d3d3d3 1px;
    background: url(../images/side_bg.gif) repeat-y scroll top right;                 
}


.column {
	position: relative; /*fixes IE7 over flow bug */
	width: 100%;
	float: left;
}

/*Styles specific to the left column*/
#left {
	right:300px; /*This off set to the right (relative to its containing div "middle") is the width of the middle column*/
        border-right: solid #d3d3d3 1px;
}
#right {
	overflow:hidden; /*to hide the background of left and right which are off set in relation to this div*/

}


/*Styles specific to middlecolumn*/
#leftcolumn {
	width: 630px; /*width of left less 2% padding each side*/
	left: 310px; /*Middle off set plus left off set (i.e. 75% in this example) minus the width of left (75 - 46 = 29) plus 2% padding*/
}

/*Styles specific to rightcolumn*/
#rightcolumn {
	width: 280px; /*width of left less 2% padding each side*/
	left:332px; /*width of left minus  width of columnleft minus width of columnmiddle (100-21-46=33) plus width of left off set (50%) plus 2% for padding*/
 }

/*Classess*/
/*The class Column is used for the common style attributes of the three column containers -
i.e right middle and left*/


.columncontent {
	position: relative;	
	float: left;
	padding: .5em 0 .5em 0;/*No padding for the sides. This is taken care of by the sizing and placement*/
        overflow: hidden;
	/*You could consider hiding overflow as well if you want to be sure there are no nasty side effects from narrowing the browser window*/
}


/***********************************************************
** Styles for the contacts table                          **
************************************************************/
.contacts, .measurer {
    border-collapse: collapse;
    margin-left: 10px;
    margin-bottom: 10px;
}

.contacts td, .measurer td {
    border: solid black 1px;
    padding: 5px;
    text-align: center;}

.role {
    width: 110px;
    font-weight: bold;
}

.name {
    width: 150px;
}

.phone {
    width: 100px;
    
}

.email {
    width: 200px;
}

.sub {
    font-size: 1.2em;
    font-weight: bold;
}

caption {
    font-weight: bold;
    margin-bottom: 4px;
}

/*********************************************************
** Styles for The Boat Page                             **
**********************************************************/


#rudder_prices td, #t_wooden_prices td {
    width: 45%;
    vertical-align: top;
    border: black solid 1px;
    padding: .5em;
    
}

/*****************************************
** General class for doing stuff        **
******************************************/
.center_text {
    text-align: center;
}

.b_collapse {
    border-collapse: collapse;
}

.right_text{
    text-align: right;
}

.table_div {
    margin: 1em 0;
}

/*******************************************************
** THREADWEB div - let the people know who built it.  **
********************************************************/

div#threadweb {
	clear: both;
	margin-top: 2em;
	font-size: .75em;
	text-align: center;
}


/*******************************************************
** Classes in alphabetical order                                        **
********************************************************/
.ajax_page {
    padding:1em 1em;
    margin: 0;
    background-color: lightgrey;
}



.invisible {
	display: none;
}

.c_address {
    font-size: .75em;
}

.branch_link {
    margin-left: 40px;
}

/*Margin for list in the boddy - need to move right*/
.list_margin {
    margin-left: 2em;
}

.separator {
    width: 80%;
    margin: 15px 0 5px 20px;
}

/*Styles for boats sell buy*/
.sellbuy {margin:1.5em;}
.posted {font-size: .75em;}