﻿
/*------------- Reset styles (removes browser defaults for level playing field) and some utility classes ---------------------*/
html{overflow-y:scroll;}div,ul,ol,li,dt,dd,dl,blockquote,fieldset,table,td,th,p,h1,h2,h3,h4,h5,h6,body,form{margin:0;padding:0;}ul,ol{list-style:none;}abbr,img,fieldset{border:0;}.tr{text-align:right;}.tl{text-align:left;}.fl{float:left;}.fr{float:right;}.tc{text-align:center;}.hide{display:none;}textarea{overflow-y:auto;}select,input,textarea{margin:0;}table{border-collapse:collapse;}

/*------ float clearing. see http://www.positioniseverything.net/easyclearing.html for reason and explaination --------*/ 
/*------------- Browsers that support css generated content (everything non-IE) -----------*/ 
.content:after, .clear-after:after, #header ul:after, 
#list-showcase:after, 
#list-showcase a:after, 
#list-showcase li:after,
.list-events li:after,
.list-news li:after,
.list-fields li:after,
.list-details li:after,
.list-fields:after 

{content:".";display:block;visibility:hidden;height:0px;clear:both;}
/*------------- float clearing for IE --------------------*/
.content, .clear-after, #header ul, 
#list-showcase, 
#list-showcase a, 
#list-showcase li,
.list-details li,
.list-events li,
.list-news li,
.list-fields li,
.list-fields {zoom:1;} 
/* 
	'zoom' is one way of triggering 'hasLayout' (IE proprietary) - fixes a lot of random bugs in IE.
	see http://www.satzansatz.de/cssd/onhavinglayout.html for details
*/

/*------------------------------------------------ Global styles --------------------------------------------------------*/
body {font:12px arial,sans-serif;color:#444;background:#00448f;line-height:1.2;}
h1,h2,h3,h4 {color:#00448f;line-height:1;}
h1 em {font-style:normal;color:#80AFCC;}
.content h1 a, .content h2 a, .content h3 a {text-decoration:none;color:#00448f;}
h1 a:hover, h2 a:hover, h3 a:hover {color:#80AFCC;}

/*
	#80AFCC - Light blue
	#00448F - Dark Blue
*/

/* ----------------------------------------------- Styles for form input tags ----------------------------------- */
input.text,
textarea {width:180px;border:1px solid #e5e5e5;border-color:#aaa #ddd #ddd #aaa;padding:2px 2px;background-color:#f8f8f8;border-top-width:2px;font-size:110%;}
textarea {width:90%;font-family:arial,sans-serif;height:70px;} 


/*----------------------------------------- Containing div and aesthetic 'trim' divs -------------------------------*/
#wallpaper {background:#fff url(../i/wallpaper.png) repeat-x;height:700px;padding-top:14px;margin:5px 0px 0;}
#wallpaper[id] {min-height:700px;height:auto;}
#wrap {width:960px;margin:0 auto 0;padding:1px;border:2px solid #fff;position:relative;}
#wrap-trim {background:#fff;height:550px;}
#wrap-trim[id] {min-height:550px;height:auto;} 

/*----------------------------------------------------- Footer ---------------------------------------------------*/
#bottom {border-top:4px solid #80afcc;height:10px;}
#footer {width:960px;margin:0 auto 0;color:#fff;padding:25px 0 25px;text-align:center;}

/*--------------------------------------------- Header and Child elements ----------------------------------*/
#header {background:url(../i/header-bg.png) repeat-x left bottom;padding-bottom:3px;}
#header h1 {position:absolute;top:7px;left:2px;}
#header h1 a {padding:0;}
#header ul {margin-left:309px;line-height:11px;background:#00448f;min-height:52px;_height:52px;padding-left:5px;font-size:100%;}
#header li {float:left;}
#header ul a {text-decoration:none;color:#fff;display:block;float:left;white-space:nowrap;padding:15px 8px 14px;zoom:1;position:relative;top:15px;border-bottom:3px solid #fff;}
#header ul a:hover {text-decoration:underline;}
		
/* ----------------------------------------------- Global styles for content area ----------------------------------- */	
.content {position:relative;padding:20px 20px;}
.content a {color:#0000ee;}
.content a:hover {text-decoration:none;}
.content h1 {padding:0 0 10px;font-size:181%;font-weight:normal;}
.content h2 {font-size:130%;padding:15px 0 7px;}
.content div[class^="layout"] > h2:first-child {padding-top:0px;}
.content h1 + h2,
.content h2 + h3 {padding-top:0;}
.content p {color:#444;padding:0 0 10px;line-height:1.4;max-width:555px;}
.content div:empty {display:none;}
.content .btns {clear:both;padding:15px 0;text-align:center;}

		
/*------------------------------------- Layout Styles -------------------------------------*/
.layout-a {float:left;width:200px;}
.layout-b {float:right;width:670px;padding:0 5px 0 0;}
.layout-a .nav {list-style:none;line-height:14px;}
.layout-a .nav a {display:block;background:#ddd;padding:5px 15px 5px 5px;zoom:1;text-decoration:none;text-align:right;margin-bottom:1px;color:#00448f;}
.layout-a .nav a:hover {background:#ccc;} 
.layout-a .nav .on a {background:#fff;font-weight:bold;font-size:110%;padding-right:10px;} 
.layout-a .nav .on {position:relative;border-right:3px solid red;}
.nav-models h1 {padding:0 0 8px;font-size:128%;font-weight:bold;}
	
/* Faqs Sub Navigation */
.layout-a .nav ul{display:none;}
	
.layout-a .nav .on ul,
.layout-a .nav .on ul a
{display:block;border-right:none;background-color:#f5f5f5;}
	
.layout-a ul.nav li.on ul a{font-size:8pt;font-weight:normal;border-right:none;background:none;}
	
.layout-a .nav .on ul .first a{border-top:1px dashed red;}
	
.layout-a .nav .on ul a:hover{background-color:#e7e7e7;}

.layout-event-a {float:left;width:210px;min-height:100px;}
.layout-event-b {float:left;width:550px;padding:0 5px 0 0;margin-left:35px;}

.layout-newsarticle-a {float:left;width:210px;overflow:hidden;min-height:100px;}
.layout-newsarticle-b {float:left;width:550px;padding:0 5px 0 0;margin-left:35px;}
.layout-newsarticle-b .postingdate {font-size:100%;font-weight:normal;font-style:italic;color:#888;border-bottom:1px solid #80AFCC;margin-bottom:15px;}

.layout-configurator-a {float:left;width:210px;overflow:hidden;min-height:100px;}
.layout-configurator-b {float:left;width:600px;padding:0 5px 0 0;margin-left:35px;}
.table-configurator {width:100%;line-height:1.75;}
.table-configurator td,
.table-configurator th {vertical-align:top;border:2px solid #fff;padding:6px 13px;}
.table-configurator td {background:#eee;}
.table-configurator th {background:#80AFCC;text-align:right;width:80px;color:#fff;}
.table-configurator .total td {text-align:right;font-weight:bold;color:#fff;background:#00448F;line-height:1.2;border-top:1px solid #80AFCC;padding:6px 20px 4px;}

.layout-admin-a {float:left;width:46%;} /* used in 2 column layout */
.layout-admin-b {float:right;width:46%;}
	
.layout-product {background:#e5e5e5;padding:0px 0px 0px 0px;}
.layout-product .b,
.layout-product h1  {border-color:#ddd;border-style:solid;color:#00448f;}
.layout-product h1 {background:#fff;padding:7px 20px 5px;border-width:1px 1px 4px 1px;border-bottom-color:#80AFCC;}
.layout-product .a {float:left;width:208px;padding:12px 10px 10px 20px;}
.layout-product .product img {width:375px;margin-top:14px;padding:1px;border:4px solid #ccc;}
.layout-product .b {float:right;width:415px;background:#fff;text-align:center;border-width:0 1px 1px 1px;}
.layout-product .btns {padding:15px 0 10px 5px;clear:both;text-align:center;}
.layout-product .btns a {margin:0 2px;}


/*------------------------------------- Table styles -------------------------------------*/
.table {width:100%;border-right:2px solid #fff;margin:0 0 1em;}
.table th,
.table td {padding:2px 10px;}
.table th {text-align:left;}
.table td {border-right:1px solid #ccc;background:#e8e8e8;}
.table tr.alt td {background:#f8f8f8;} 
.table td a {text-decoration:none;color:#293fa2;background:#d4eaff;}
.table td a:hover {text-decoration:underline;}
.table input.button {font-size:97%;}


/*--------------------------------------- Admin styles -------------------------------------*/
.combo-listeditor {border:1px dotted #aaa;padding:5px;margin:1px 0 2px;}
.combo-listeditor div {padding-left:2px;}
.combo-listeditor div input.button {font-size:90%;}

.Admin .content {padding:20px 60px;}
.Admin .content h1 {border-bottom:1px dotted;margin:0 0 20px;padding:0 0 5px;}
.Admin .content h1 a {color:#80AFCC;text-decoration:underline;}
.Admin .content h1 a:hover {color:#80AFCC;text-decoration:none;}

#loading {position:absolute;width:200px;text-align:center;left:50%;margin-left:-100px;background:#fff;opacity:.8;z-index:20000;top:20%;border:3px solid #888;padding:50px 0;visibility:hidden;}


/*------------------------------------- Homepage -------------------------------------*/
.Home .layout-a,
.Home .layout-b {display:none;}
.layout-home-a {width:94%;margin:0px auto 20px;padding:15px 0 20px;background:url(../i/showcase-bg.gif) #00448f -190px -10px;position:relative;}
.layout-home-a h1 {text-align:center;padding:2px 0 9px;font-size:187%;color:#fff;}
.layout-home-a img {width:175px;height:120px;}
.layout-home-a i.c, #upcoming-events i.c {width:15px;height:15px;position:absolute;background:url(../i/corner-15.gif) no-repeat;}
.layout-home-a i.c[class],#upcoming-events i.c[class]  {background-image:url(../i/corner-15.png)}
.layout-home-a i.tl,#upcoming-events i.tl {top:0;left:0;}
.layout-home-a i.tr,#upcoming-events i.tr {background-position:right top;top:0;right:0;_right:-1px;}
.layout-home-a i.bl,#upcoming-events i.bl {background-position:left bottom;bottom:0;left:0;_bottom:-1px;}
.layout-home-a i.br,#upcoming-events i.br {background-position:right bottom;bottom:0;right:0;_bottom:-1px;_right:-1px;}
#upcoming-events {font-family:Tahoma;background:#00448F;padding:5px 12px 4px;text-decoration:none;font-size:13px;color:#fff;letter-spacing:normal;overflow:hidden;margin:0 0 10px;width:845px;margin:0 auto;position:relative;left:0;height:80px;padding:10px; }
#upcoming-events p{display:block;float:none;max-width:100%;}
	
#upcoming-events div{float:right;}
	
#upcoming-events a#scrollbarTitle{color:yellow;text-decoration:none;font-weight:bold;font-size:11pt;font-family:"Trebuchet MS";letter-spacing:-1px;}
#upcoming-events a{color:White;text-decoration:none;}
	
#upcoming-events a:hover {text-decoration:underline;}
	
#list-showcase {background:0;padding:0;width:850px;margin:0 auto;line-height:1;}
#list-showcase li {float:left;width:25%;padding:0;margin:0;}
#list-showcase strong {display:block;padding:5px 30px 0;font-size:115%;}
#list-showcase a {display:block;margin:0 0px;text-align:center;text-decoration:none;
padding:8px 0 10px;color:#fff;}
#list-showcase a:hover {background:0;}
#list-showcase[id] a:hover {background:url(../i/showcase-hover.png);}
#list-showcase a:hover strong {text-decoration:underline} 
#list-showcase a:hover img {border-color:#fff;}
#list-showcase img {height:120px;width:175px;padding:3px;background:#fff;border:3px solid #80AFCC;
border-color:#80AFCC;margin:0;}
#list-showcase .last {width:24.8%;}
#list-showcase-sub {width:800px;margin:25px auto 0;font-size:110%;}
#list-showcase-sub li {float:left;width:20%;padding:0;margin:0;}
#list-showcase-sub a 
{
display:block;
margin:0 5px;
text-align:center;
text-decoration:none;
padding:7px 0;
color:#fff;
border:1px solid #80AFCC;
margin-bottom:5px;
line-height:12px;
/*zoom:1; Not Required */

}
#list-showcase-sub a:hover {font-weight:bold;}
#logo-big {text-align:center;padding:10px 0 10px;}


/*------------------------------------- News and Events Page -------------------------------------*/	
.Offers .layout-a, .NewsEvents .layout-a {width:48%;}
.Offers .layout-b, .NewsEvents .layout-b {width:48%;}
.Offers .content h1, .NewsEvents .content h1 {border-bottom:2px solid #80AFCC;padding:0 0 3px;margin:0 0 15px;}
.Offers .content h3, .NewsEvents .content h3 {padding:0 0 5px;font-size:130%;}
.Offers .content img, .NewsEvents .content img {width:auto;height:80px;float:left;padding:3px 7px 0px 0;}
.Offers .content li, .NewsEvents .content li {margin:0 0 12px;padding:0 0 8px;}
em.date {font-weight:normal;font-size:80%;color:#888;padding-left:7px;}


/*-------------------------------------------- News -------------------------------------*/	
.layout-newsarchive-a {padding:0px 60px;}
.table-newsarchive td {border-right:0;padding:3px 7px;background:#e3f1f6;}
.table-newsarchive tr.alt td {background:#f6fafc;}
.table-newsarchive td a {background:#fbffc2;font-size:112%;padding:0 6px;}
.table-newsarchive td.date {text-align:center;width:10px;padding-left:20px;padding-right:20px;
font-weight:bold;font-size:90%;}
.table-newsarchive span {font-size:80%;margin-left:5px;}


/*------------------------------------- Accordion -------------------------------------*/	
#accordion {}
#accordion h3 {background:#00448f url(../i/accordion-arrow.png) no-repeat 10px 0;color:#fff;
font-size:100%;padding:5px 15px 5px 5px;text-align:right;margin-bottom:1px;cursor:pointer;zoom:1;}
#accordion ul {padding:6px 10px 15px 5px;text-align:right;line-height:1.4;}
#accordion h3.on {background-color:red;background-position:10px -21px;cursor:default;}
#accordion ul a {text-decoration:none;}
#accordion ul a:hover {text-decoration:underline;}
#accordion h3:hover {background-color:#2e66a3;}
#accordion h3.on:hover {background-color:red;}
#accordion li.on {font-weight:bold;}
#accordion li.on a {text-decoration:none;display:block;
background:red;color:#fff;padding:0px 10px 0px 0;margin:2px -10px 2px 0;zoom:1;}

.layout-a #accordion {}
.layout-a #accordion div {background:#fff;}

.layout-manufacturer-a #accordion ul {text-align:left;background:url(../i/trans-white.png);
width:135px;height:173px;padding:20px;}
.layout-manufacturer-a #accordion h3 {text-align:left;padding-left:30px;margin:1px 0 0;}
.layout-manufacturer-a #accordion .container div {height:213px;}
.layout-manufacturer-a #accordion .container {background-repeat:no-repeat}

.Sheerline .container {background-image:url(../i/sheerline.jpg);} /*-- Sheerline default background --*/
.SeaOtter .container {background-image:url(../i/seaotter.jpg);} /*-- Sea Otter " --*/
.Jeanneau .container {background-image:url(../i/merry-fisher.jpg);} /*-- Jeanneau " --*/


/* ----------------------------------- Microformat event date (view event page) --------------------*/
.vevent {background:#eee;margin:.4em 0 1.5em;font-size:90%;line-height:1.2;}
.vevent th,
.vevent td {padding:2px 10px;border-top:1px solid #fff;color:#000;} 
.vevent th {text-align:right;width:47px;padding:2px 5px 1px 10px;color:yellow;background:#00448f;}
.vevent td {font-size:120%;}


/*--------------------------------- Secondary content boxes (see view event/view office) -------------------------------------*/
.box {background:#ddd;padding:0px 12px 10px;
margin:12px 0 17px;}
.box h2 {background:#80AFCC;color:#fff;padding:3px 12px 3px;
margin:0 -24px 7px 0;position:relative;left:-12px;font-size:118%;zoom:1;}
.vcard {line-height:1.2;padding:0 0 10px 10px;}
.box .list-fields {padding:15px 0 0;}
.box .list-fields li {float:left;width:212px;}
.box .list-fields li.last {float:none;padding:5px 0 0px 211px;
clear:both;width:auto;}
.box .list-details {margin-bottom:-3px;}
.box2 {background:#fff;padding:0px 12px 10px;margin:0px 0;}
.box2-trim {border:1px solid #bbb;margin:0px;padding:0px;}
.box2 h2 {background:#888;color:#fff;padding:3px 10px 3px;
margin:0 -20px 13px 0;top:2px;position:relative;left:-10px;font-size:90%;zoom:1;
text-transform:uppercase;font-weight:normal;}


/*------------------------------------- Lists ----------------------------------------*/
.list-details {font-size:100%; padding-left: 113px; clear: both}
.list-details span {display:inline;padding:1px 10px 3px 0;float:left;width:100px;text-align:right;
font-weight:bold;font-size:90%; margin-left: -113px; position: absolute;}
.list-details li {padding:0 0 4px;}
.list-details li.last {padding:5px 0 8px;}

.list-sponsors {text-align:center;}
.list-sponsors li {display:inline;padding:0 12px;}

.list-employees {margin-bottom:-5px;}
.list-employees strong {padding:0 2px 0 0;}
.list-employees .divider {padding:0 3px;font-weight:bold;position:relative;
vertical-align:middle;}
.list-employees li {padding:0 0 10px;}
.list-employees p {padding:0 0 0 10px;line-height:1.2;font-size:90%;max-width:1000px;}
.list-employees h3 {padding:4px 10px 3px;font-size:100%;background:#e5e5e5;color:#222;margin:0 0 4px;
font-weight:normal;}

.list-fields {font-size:90%;}
.list-fields span {display:block;padding:0 0 2px;}
.list-fields .horz span {float:left;padding:0 7px 2px 0px;}
.list-fields li {padding:0 0 7px;}
.list-fields li.last {padding:5px 0 8px;}

/*
#80AFCC - Light blue
#00448F - Dark Blue
*/

/* ----------------------------------- Region Navigation Highlighting (uses the class on body tag) --------------------------- */
.NewsEvents #nav-newsevents a,
.News #nav-newsevents a,
.Offices #nav-offices a,
.Company #nav-company a,
.Used #nav-used a,
.Jeanneau #nav-jeanneau a,
.SeaOtter #nav-seaotter a,
.Sheerline #nav-sheerline a,
.Offers #nav-offers a,
.OtherServices #nav-otherservices a,
.Admin #nav-admin a,
.MarinaAdmin #nav-marinaadmin a,
#header li.on a {border-bottom-color:red;font-weight:bold;font-size:110%;}

/* ----------------------------------- Offices ----------------------------------- */

.officeTop
{
float:left;
width:100%;
padding-bottom:10px;
}

.officeTop img
{
float:left;
margin-right:10px;
}

.officeTop p,
.officeTop p span
{
display:block;
width:100%;
max-width:100%;
float:none;
}

/* New showcase */
table.showcase {background:0;padding:0;margin:0 auto;line-height:1;}
table.showcase div {width:212px;padding:0;margin:0; }
table.showcase { text-align: center; }
table.showcase td { vertical-align: top; width:212px; padding: 0 25px}


table.showcase strong {display:block;padding:5px 30px 0;font-size:115%;}
table.showcase a {display:block;margin:0 0px;text-align:center;text-decoration:none;
padding:8px 0 10px;color:#fff;}
table.showcase a:hover {background:0;}
table.showcase[class] a:hover {background:url(../i/showcase-hover.png);}
table.showcase a:hover strong {text-decoration:underline} 
table.showcase a:hover img {border-color:#fff;}
table.showcase img {height:120px;width:175px;padding:3px;background:#fff;border:3px solid #80AFCC;
border-color:#80AFCC;margin:0;}
}

div.stacked{text-align:center;}
div.stacked img {margin-bottom: 10px;}
