/* --------------------------------------------------------------   
   reset.css
   * Resets default browser CSS.
   
   Based on work by Eric Meyer:
   * meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
-------------------------------------------------------------- */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

body { line-height: 1.5; background: #fff; margin:1.5em 0; }

/* Tables still need 'cellspacing="0"' in the markup. */
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight:400; }

/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

a img { border: none; }



/* -------------------------------------------------------------- 
   typography.css
   * Sets up some sensible default typography.
  
   Based on work by:
   * Nathan Borror     [playgroundblues.com]
   * Jeff Croft        [jeffcroft.com]
   * Christian Metts   [mintchaos.com]
   * Wilson Miner      [wilsonminer.com]
   * Richard Rutter    [clagnut.com]
   
   Read more about using a baseline here:
   * alistapart.com/articles/settingtypeontheweb
-------------------------------------------------------------- */
/* This is where you set your desired font size. The line-heights 
   and vertical margins are automatically calculated from this. 
   The percentage is of 16px (0.75 * 16px = 12px). */
   
body { font-size: 75%; }

/* Default fonts and colors. 
   If you prefer serif fonts, remove the font-family 
   on the headings, and apply this one to the body:
   font: 1em Georgia, "lucida bright", "times new roman", serif; */
   
body { 
  color: #222; 
  font-family: "Helvetica Neue", "Lucida Grande", Helvetica, Arial, Verdana, sans-serif; 
}
h1,h2,h3,h4,h5,h6 { 
  color: #111; 
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 
}

/* Headings
-------------------------------------------------------------- */
h1,h2,h3,h4,h5,h6 { font-weight: normal; }

h1 { font-size: 3em; line-height: 1; margin-bottom: 0.5em; }
h2 { font-size: 2em; margin-bottom: 0.75em; }
h3 { font-size: 1.5em; line-height: 1; margin-bottom: 1em; }
h4 { font-size: 1.2em; line-height: 1.25; margin-bottom: 1.25em; }
h5 { font-size: 1em; font-weight: bold; margin-bottom: 1.5em; }
h6 { font-size: 1em; font-weight: bold; }

/* Text elements
-------------------------------------------------------------- */
p           { margin: 0 0 1.5em; }
p.last      { margin-bottom: 0; }
p img       { float: left; margin: 1.5em 1.5em 1.5em 0; padding: 0; }
p img.top   { margin-top: 0; } /* Use this if the image is at the top of the <p>. */
img         { margin: 0 0 1.5em; }

ul, ol      { margin:0 1.5em 1.5em 1.5em; }
ul          { list-style-type: circle; }
ol          { list-style-type: decimal; }
dl          { margin: 0 0 1.5em 0; }
dl dt       { font-weight: bold; }
dd          { margin-left: 1.5em;}

abbr, 
acronym     { border-bottom: 1px dotted #666; }
address     { margin-top: 1.5em; font-style: italic; }
del         { color:#666; }

a:focus, 
a:hover     { color: #000; }
a           { color: #009; text-decoration: underline; }

blockquote  { margin: 1.5em; color: #666; font-style: italic; }
strong      { font-weight: bold; }
em,dfn      { font-style: italic; background: #ffc; }
dfn         { font-weight: bold; }
pre,code    { margin: 1.5em 0; white-space: pre; }
pre,code,tt { font: 1em 'andale mono', 'monotype.com', 'lucida console', monospace; line-height: 1.5; } 
tt          { display: block; margin: 1.5em 0; line-height: 1.5; }

/* Tables
-------------------------------------------------------------- */

table   { margin-bottom: 1.4em; }
th      { border-bottom: 2px solid #ccc; font-weight: bold; }
td      { border-bottom: 1px solid #ddd; }
th,td   { padding: 4px 10px 4px 0; }
tfoot   { font-style: italic; }
caption { background: #ffc; }

/* Use this if you use span-x classes on th/td. */
table .last { padding-right: 0; } 

/* Some default classes
-------------------------------------------------------------- */
.small      { font-size: .8em; margin-bottom: 1.875em; line-height: 1.875em; }
.large      { font-size: 1.2em; line-height: 2.5em; margin-bottom: 1.25em; }
.quiet      { color: #666; }

.hide       { display: none; }
.highlight  { background:#ff0; }
.added      { color:#060; }
.removed    { color:#900; }

.top        { margin-top:0; padding-top:0; }
.bottom     { margin-bottom:0; padding-bottom:0; }



/* -------------------------------------------------------------- 
Formula Boats stylesheet V1 - 21/11/2007
Author - benbailey.com.au
-------------------------------------------------------------- */
.googleMap {
float: right;
width: 380px;
}

.container {
margin: 0 auto;
background: #FFF;
width: 856px;
padding-bottom: 40px;
}

#header {
height: 71px;
background: #3C6E91;
}

#header img { margin: 0; }

/* =primaryNavigation - primary navigation of the website 
--------------------------------------------------------------------------
*/
#primaryNavigation {
background: url(../i/bgNavigation2.jpg) repeat-x;
height: 32px;
border-bottom: 1px solid #3C6E91;
}

#primaryNavigation ul { margin: 0; }

#primaryNavigation li {
display: inline;
list-style-type: none;
}

#primaryNavigation a {
text-indent: -9999em;
display: block;
float: left;
height: 32px;
outline: 0;
}

#nav01 { width: 66px; background: url(/i/bgNavigation.jpg); }
#nav01:hover, #nav01:focus, #home #nav01 { background: url(/i/bgNavigation.jpg) 0 -34px; }

#nav02 { width: 145px; background: url(/i/bgNavigation.jpg) -66px 0; }
#nav02:hover, #nav02:focus, #formula_boat_range #nav02 { background: url(/i/bgNavigation.jpg) -66px -34px; }

#nav03 { width: 69px; background: url(/i/bgNavigation.jpg) -211px 0 ; }
#nav03:hover, #nav03:focus, #dealers #nav03 { background: url(/i/bgNavigation.jpg) -211px -34px; }

#nav04 { width: 59px; background: url(/i/bgNavigation.jpg) -280px 0; }
#nav04:hover, #nav04:focus, #news #nav04 { background: url(/i/bgNavigation.jpg) -280px -34px; }

#nav05{ width: 99px; background: url(/i/bgNavigation.jpg) -339px 0; }
#nav05:hover, #nav05:focus, #owners_club #nav05 { background: url(/i/bgNavigation.jpg) -339px -34px; }

#nav06 { width: 79px; background: url(/i/bgNavigation.jpg) -438px 0; }
#nav06:hover, #nav06:focus, #about_us #nav06 { background: url(/i/bgNavigation.jpg) -438px -34px; }

#nav07 { width: 87px; background: url(/i/bgNavigation.jpg) -517px 0; }
#nav07:hover, #nav07:focus, #contact_us #nav07 { background: url(/i/bgNavigation.jpg) -517px -34px; }

/* =banner 
--------------------------------------------------------------------------
*/
#banner {
position: relative;
height: 190px;
}

#banner blockquote {
position: absolute;
top: 0;
left: 15px;
}

#banner blockquote p {
color: #1D6DA6;
font-style: normal;
font-size: 1.2em;
width: 21em;
font-weight: bold;
}

#formula_boat_range #banner div {
position: absolute;
top: 20px;
left: 30px;
width: 35em;
}

#formula_boat_range .feature .featureImage a img:hover {
opacity: 0.7;
}

/* =secondary-navigation 
--------------------------------------------------------------------------
*/
#secondaryNavigation {
	float: left;
	width: 223px;
	margin: 20px 0 30px 0;
}

#secondaryNavigation ul {
	list-style-type: none;
	padding: 0 0 10px 0;
	margin-left: 5px;
	margin-right: 0;
}

#secondaryNavigation li {
	line-height: 1em;
}

#secondaryNavigation li a {
	display: block;
	_width: 210px;
	_height: auto;
	padding: 0.5em;
	margin: 0 0 0 8px;
	text-decoration: none;
	border-bottom: 1px solid #ccc;
}

#secondaryNavigation li a:hover, #secondaryNavigation li a:focus, #secondaryNavigation li a.current {
	background: #F0F0F0 url(../i/bgSecondaryNav.jpg) repeat-x left bottom;
}

#secondaryNavigation li a.current {
	font-weight: bold;
}

/* =content - Main content of the website
--------------------------------------------------------------------------
*/
ul#breadCrumbs {
padding-left: 0;
margin-left: 0;
margin-bottom: 2em;
}

#breadCrumbs li {
font-size: 1.1em;
list-style-type: none;
display: inline;
padding: 0;
}

#breadCrumbs li a {
background: url(/i/bgArrow.png) no-repeat right;
padding-right: 15px;
margin-right: 7px;
border-bottom: 0;
}

/* =content - Main content of the website
--------------------------------------------------------------------------
*/
.content, #slideWrap, #reviews {
float: left;
width: 550px;
padding: 20px 30px;
}

#home .content, #contact_us .content { width: auto; }

#slideWrap, #reviews {
width: 460px;
padding: 0 10px;
}

#slideWrap {
padding-top: 15px;
}


#reviews blockquote {
font-weight: bold;
font-style: normal;
color: #000;
margin: 1.5em 0;
}

#reviews blockquote p { margin-bottom: -14px;
}

#reviews .content blockquote cite {
font-style: italic;
}

.newsItem {
float: left;
width: 30%;
padding-right: 3%;
}

.newsItem h3 {
font-weight: bold;
}

.newsDate {
margin: -5px 0 0.5em 0;
color: #666;
font-size: 0.95em;
}

.right, .featureImage {
float: right;
background: #e6edf5;
border: 1px solid #ecdfce;
padding: 5px;
}

.featureImage {
margin-left: 20px;
}

.featureImage img {
margin: 0;
padding: 0;
}

.feature {
clear: left;
margin-bottom: 1.7em;
}

#dealers .content .feature dt {
float: left;
width: 4.5em; 
clear: left;
}

#dealers .content .feature dd {
float: left;
width: auto; 
}

/* =product page - Boat products page
--------------------------------------------------------------------------
*/

#techSpecs { margin-top: 28px; }

.techSpecsTable {
background: #e6edf5;
padding: 5px;
width: 365px;
min-height: 380px;
height: 380px;
overflow-y: scroll;
}

.techSpecsTable td {
background: #FFF;
padding: 6px;
border: 1px solid #ecdfce;
border-right: 0;
border-bottom: 0;
}

#formula_boat_range #techSpecs .feature {
padding: 8px;
margin-right: 0;
/*background: #e6edf5;*/
margin-bottom: 0;
margin-top: -10px;
}

#formula_boat_range #techSpecs .feature .pdf {
padding: 0;
margin: 2px 4px 0 0;
}

/* =related - Related information - usually the right hand column
--------------------------------------------------------------------------
*/
.related {
float: left;
width: 280px;
padding: 20px 0;
}

#formula_boat_range .related {
width: 365px;
padding: 0;
}

#formula_boat_range .related blockquote {
margin: 1.5em 0;
}

#formula_boat_range .related cite {
font-style: normal;
color: #000;
display: block;
margin-top: -15px;
}

/* =footer
--------------------------------------------------------------------------
*/
#footer {
clear: both;
height: 10px;
}

/* =form layout
--------------------------------------------------------------------------
*/
form label {
	display: block;
}

form input, form textarea, form select {
padding: 4px 2px;
background: #F3F3F3;
border: 1px solid #999;
margin-bottom: 14px;
margin-top: 3px;
}

input:focus, select:focus, textarea:focus { background: #FFF; }

.btnSubmit {
border: 3px double #999;
border-top-color: #CCC;
border-left-color: #CCC;
background-color: #F5F5F5;
}

#txtEmail {
font-size: 1.14em;
}

form abbr { color: #F00; font-weight: bold; border-bottom: 0; }


/* =HTML elements
--------------------------------------------------------------------------
*/
a:link { color: #1D6DA6; text-decoration: none; }
a:visited { color: #666; text-decoration: none;  }
a:hover, a:focus { text-decoration: underline; }
a:active { color: #000; text-decoration: none;  }

body {
font-family: Arial, Helvetica, Verdana, sans-serif; 
background: #3C6E91 url(/i/bgBody.jpg) repeat-x bottom fixed;
margin: 0;
}

em { background: none; }

h1 { font-size: 1.7em; }
h2 { font-size: 1.4em; }
h3 { font-size: 1.1em; }
h4 { font-size: 1.1em; }
h5 { font-size: 1em; }
h6 { font-size: 1em; }

h2 {
color: #5E5950;
border-bottom: 1px solid #E9D3B5;
}

h3, h4, h5, h6 { font-weight: bold; margin-bottom: 0.5em; }

th { border-bottom: 1px solid #ddd; }





/* --------------------------------------------------------------   
Strip viewer CSS on the homepage and products pages - this CSS declares the coda slider and tabs UI css
-------------------------------------------------------------- */
.stripViewer .panelContainer .panel ul {
text-align: left;
margin: 0 15px 0 30px;
}

/* These 2 lines specify style applied while slider is loading */
.csw {width: 100%; height: 220px; background: #fff; overflow: scroll}
.csw .loading {margin: 100px 0 100px 0; text-align: center}

.stripViewer { /* This is the viewing window */
position: relative;
overflow: hidden; 
border: 0px solid #39c; /* this is the border. should have the same value for the links */
margin: auto;
width: 770px; /* Also specified in  .stripViewer .panelContainer .panel  below */
_width: 763px;
min-height: 220px;
clear: both;
}

.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
position: relative;
left: 0; 
top: 0;
width: 100%;
list-style-type: none;
/* -moz-user-select: none; // This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy fools. */
}

.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
float:left;
height: 100%;
position: relative;
width: 770px; /* Also specified in  .stripViewer  above */
_width: 763px;
padding-top: 5px;
}

#home .stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
padding-top: 10px;
}

.stripViewer .panelContainer .panel img { 
float: right;
background: #E6EDF5;
padding: 7px;
margin-left: 15px;
}

.stripViewer .panelContainer .panel a img:hover { 
opacity: 0.7;
}

.stripViewer .panelContainer .panel h2, .stripViewer .panelContainer .panel p, .stripViewer .panelContainer .panel li { 
width: 330px;
+*width: 325px;
_width: 320px;
}

.container .stripNav { /* This is the div to hold your nav (the UL generated at run time) */
background: url(/i/bgTabShadow.jpg) repeat-x bottom;
width: 100%;
float: left;
padding-bottom: 9px;
}

.stripNav ul, #slideWrap ul { /* The auto-generated set of links */
list-style: none;
width: 100%;
_width: 780px;
margin: 0;
padding-top: 20px;
}

#slideWrap ul { /* The auto-generated set of links */
_width: auto;
}

.stripNav ul li, #slideWrap ul li {
float: left;
margin-right: 2px; /* If you change this, be sure to adjust the initial value of navWidth in slideviewer.js */
_margin-right: 1px; /* If you change this, be sure to adjust the initial value of navWidth in slideviewer.js */
}

.stripNav a, #slideWrap ul li a { /* The nav links */
display: block;
width: 110px;
_width: 109px;
height: 33px;
font-weight: bold;
text-align: center;
line-height: 35px;
_line-height: 33px;
background: url(/i/bgTabs.jpg) repeat-x 0 2px;
color: #1D6DA6;
text-decoration: none;
outline: none;
}

.stripNav a:hover, #slideWrap ul li a:hover, .stripNav a:focus, #slideWrap ul li a:focus, .stripNav a.current, #slideWrap ul li a.current {
background: url(/i/bgTabs.jpg) repeat-x 0 -31px;
text-decoration: none;
}

.stripNavL, .stripNavR {
display: none;
}

#formula_boat_range .stripViewer { /* This is the viewing window */
width: 460px; /* Also specified in  .stripViewer .panelContainer .panel  below */
min-height: 220px;
/*_height: 220px;*/
clear: both;
}

#formula_boat_range .stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
width: 460px; /* Also specified in  .stripViewer  above */
}

#formula_boat_range .stripNav ul { /* The auto-generated set of links */
width: 460px;
}

/* =hacks
--------------------------------------------------------------------------
*/

/* Clearing floats without extra markup
   Based on How To Clear Floats Without Structural Markup by PiE
   [http://www.positioniseverything.net/easyclearing.html] */

.clear { display: inline-block; }   
.clear:after, .container:after {
  content: "."; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden;
}
* html .clear { height: 1%; }
.clear { display: block; }


/*-------------------------*/
#formula_boat_range .stripViewer .panelContainer .panel img { 
float: none;
background: #FFF;
padding: 0;
margin-left: 0;
}




/* Caution! Ensure accessibility in print and other media types... */
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .ui-tabs-hide {
        display: none;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .ui-tabs-nav {
        display: none;
    }
}