body { background: #333; margin: 20px; padding: 0; font: normal 0.8em Lucida Grande, arial; }

table tr td.aligntop { vertical-align: top; }

#main hr { color: #9E0017; border: none; height: 1px; background: #9E0017; }

#wrapper { width: 800px; margin: 0 auto; padding: 0; border: 5px solid #666; background: #9E0017 url(images/wrapper_bg.gif) 0 0 repeat-y; }

#wrapperbooking { width: 800px; margin: 0 auto; padding: 0; border: 5px solid #666; background: #FFF; }

#wrapperbookingwide { width: 940px; margin: 0 auto; padding: 0; border: 5px solid #666; background: #FFF; }

#header { position: relative; width: 800px; height: 160px; background: #9E0017 url(images/header_bridge_bg5.jpg) 0px -30px no-repeat; padding: 0; margin: 0 0 0px 0; }

#headerwide { position: relative; width: 940px; height: 100px; background: #9E0017 url(images/header_bridge_bg_940w.jpg) 0px -115px no-repeat; padding: 0; margin: 0 0 0px 0; }

#logo { position: absolute; z-index: 3; top: -19px; left: -44px; width: 226px; height: 150px; }

#logosmall { position: absolute; z-index: 3; top: -19px; left: -24px; width: 150px; height: 100px; }

#logo h1 { text-indent: -9999px; height: 0px; }

#logo a { display: block; }

.logo { 
	position: absolute; 
	z-index: 3; 
	top: -12px; 
	left: -44px; 
	width: 226px; 
	height: 150px; 
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/logo_large_shadow.png'); } 

.logo[class] { background: url(images/logo_large_shadow.png); } 

.logo h1 { text-indent: -9999px; height: 100px; }

.banner { 
	position: absolute; 
	z-index: 2; 
	top: 40px; 
	left: 157px; 
	width: 450px; 
	height: 70px; 
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/San_Francisco_Cruises_banner_shadow_500w.png'); } 

.banner[class] { background: url(images/San_Francisco_Cruises_banner_shadow_500w.png); } 

.banner h2 { display: none; }

#banner { 	
	position: absolute; 
	z-index: 2; 
	top: 112px; 
	left: -27px; 
	width: 350px; 
	height: 60px; 
	}
	
#bannersmall { position: absolute; z-index: 2; top: 68px; left: -23px; width: 200px; height: 34px; }
	
#banner h2 { display: none; }



.biodiesel { 
	position: absolute; 
	z-index: 2; 
	top: 40px; 
	left: 157px; 
	width: 450px; 
	height: 70px; 
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/cruises_powered_by_biodiesel.png'); } 

.biodiesel[class] { background: url(images/cruises_powered_by_biodiesel.png); } 

.biodiesel h2 { display: none; }

#biodiesel { 	
	position: absolute; 
	z-index: 3; 
	top: -25px; 
	left: 705px; 
	width: 120px; 
	height: 120px; 
	}
	
#biodiesel h2 { display: none; }


#historicbanner { position: relative; width: 800px; height: 150px; margin: 0; padding: 0; background: url(images/historic_banner.jpg) 0 0 no-repeat; border: 0px solid#FFF; }

#seventyyearsbadge { position: absolute; left: -30px; top: -5px; width: 100px; height: 100px; z-index: 7; border: 0px solid#FFF; }



#topborder { clear: both; width: 800px; height: 25px; background: #9E0017 url(images/top_graphic_red_wave_800x25.gif) 0 0 no-repeat; }

.topborder { 
	z-index: 5;
	width: 800px; 
	height: 25px; 
	margin: 0 0 -4px 0; 
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/top_graphic_red_wave_800x25_reversed.png'); } 

.topborder[class] { z-index: 5; background: url(images/top_graphic_red_wave_800x25_reversed.png); } 


#topnav2 { width: 800px; height:36px; margin: 0; padding: 0; background: url(images/top_nav/top_nav_bg.jpg) repeat-x; }


#topnav { z-index: -1; color: #FFF; background: #FFF; width: 800px; padding: 22px 0 12px 0; text-align: center; font-weight: bold; overflow: auto; margin: 0; border-bottom: 5px solid #BBB; }

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

#topnav li { margin: 0; padding: 6px; display: inline; }

#topnav li a { color: #9E0017; background: #FFF; padding: 6px 6px 6px 6px; text-decoration: none; border: 2px solid #9E0017;}

#topnav a:hover { color: #FFF; background: #9E0017; }


#noscripttopmenu a { color: #9E0017; text-decoration: none; font-weight: bold; }

#noscripttopmenu a:hover { text-decoration: underline; }


#leftcolumn { float: left; width: 160px; background: #666; margin:0; padding: 0; }

#leftcolumn ul { margin: 0; padding: 0; list-style: none; font-weight: bold; text-align: center;  }

#leftcolumn li { margin: 0; padding: 0; }

#leftcolumn li a { display: block; text-decoration: none; color: #FFF; padding: 8px 4px 8px 4px; background: #002D46; border-bottom: 1px solid #666; }

#leftcolumn li a:hover { background: #005343; border-bottom: 1px solid #666; }



#contactus { color: #FFF; font-size: 90%; line-height: 130%; padding: 6px 6px 6px 8px; margin: 0px 0 0 0; border-bottom: 1px solid #666; }

#contactus h3 { margin: 0 0 3px 0; padding: 0; font-size: 130%; }



#main { float: left; width: 480px; padding: 20px; background: #FFF; margin: 0 0 -10px 0; }

#main h1 { color: #9E0017; font-size: 160%; margin: 0 0 20px 0; }

#main h2 { color: #9E0017; font-size: 140%; margin: 0 0 20px 0; }

#main h3 { color: #9E0017; font-size: 130%; margin: 0 0 20px 0; }

#main h4 { color: #9E0017; font-size: 120%; margin: 0 0 20px 0; }


/* industry template styles */

#mainbooking { float: left; width: 760px; padding: 20px; background: #FFF; margin: 0 0 0px 0; }

#mainbooking h1 { color: #9E0017; font-size: 160%; margin: 0 0 20px 0; }

#mainbooking h2 { color: #9E0017; font-size: 140%; margin: 0 0 20px 0; }

#mainbooking h3 { color: #9E0017; font-size: 130%; margin: 0 0 20px 0; }

#mainbooking h4 { color: #9E0017; font-size: 120%; margin: 0 0 20px 0; }

#mainbooking strong { color: #9E0017; }

#mainbooking b { color: #9E0017; }

#mainbooking a { color: #9E0017; }

#mainbooking ul { margin: 0 0 0 10px; padding: 0 0 0 5px; }

#mainbooking ul li { margin: 0 0 0 10px; padding: 2px 0 0 0px; }

#mainbooking .emphasis { color: #9E0017; font-size: 110%; font-weight: bold;  }

#mainbooking .emphasiswhite { color: #FFF; font-size: 110%; font-weight: bold;  }

#mainbooking .emphasisblack { color: #000; font-size: 105%; font-weight: bold;  }

#mainbooking .boldblack { color: #000; font-weight: bold; }

#mainbooking .boldblack1 { color: #000; font-weight: bold; text-align: right; }

#mainbooking #calendar a { color: #FFF; }

#mainbooking #calendar thead a { color: #9E0017; }

#mainbooking input { border: 1px solid #999; }

#mainbooking select { border: 1px solid #999; }

#mainbooking textarea { border: 1px solid #999; }

/* end industry template styles */




#main h4.ggb { color: #A11211; font-size: 120%; margin: 0 0 2px 0; }

#main h4.fbl { color: #16532A; font-size: 120%; margin: 0 0 2px 0; }

#main h4.cs { color: #002D46; font-size: 120%; margin: 0 0 2px 0; }

#main h4.ggb a { color: #A11211; font-size: 120%; margin: 0 0 2px 0; text-decoration: none; }

#main h4.ggb a:hover { text-decoration: underline; }

#main h4.fbl a { color: #16532A; font-size: 120%; margin: 0 0 2px 0; text-decoration: none; }

#main h4.fbl a:hover { text-decoration: underline; }

#main h4.cs a { color: #002D46; font-size: 120%; margin: 0 0 2px 0; text-decoration: none; }

#main h4.cs a:hover { text-decoration: underline; }

#main a.ggb { color: #A11211; text-decoration: none; }

#main a:hover.ggb { text-decoration: underline; }

#main a.fbl { color: #16532A; text-decoration: none; }

#main a:hover.fbl { text-decoration: underline; }

#main a.cs { color: #002D46; text-decoration: none; }

#main a:hover.cs { text-decoration: underline; }

#main strong { color: #9E0017; }

#main b { color: #9E0017; }

#main a { color: #9E0017; }

#main ul { margin: 0 0 0 10px; padding: 0 0 0 5px; }

#main ul li { margin: 0 0 0 10px; padding: 2px 0 0 0px; }

#main .emphasis { color: #9E0017; font-size: 110%; font-weight: bold;  }

#main .emphasiswhite { color: #FFF; font-size: 110%; font-weight: bold;  }

#main .emphasisblack { color: #000; font-size: 105%; font-weight: bold;  }

#main .boldblack { color: #000; font-weight: bold; }

#main .boldblack1 { color: #000; font-weight: bold; text-align: right; }

#main #calendar a { color: #FFF; }

#main #calendar thead a { color: #9E0017; }

#main input { border: 1px solid #999; }

#main select { border: 1px solid #999; }

#main textarea { border: 1px solid #999; }


#directions { position: relative; }

#ticketbooth { position: absolute; left: 365px; top: -80px; }


#departureinnertable { border-top: 1px solid #FFF; margin-top: -4px; }

.departuretabletoprowcell { border-top: 1px solid #FFF; margin-top: -1px; }



#hometitle { z-index: 3; font-size: 116%; /*position: absolute; height: 40px;*/ }



#imageright { float: right; margin: 0 0 8px 10px; padding: 5px; background: #BBB; }

#imageleft { float: left; margin: 0 10px 8px 0; padding: 5px; background: #BBB; }



#slideshow { margin: 0px 0 20px 0; padding: 0; }


#homerotator script { width: 120px; background: #990000; margin: 0 0 0 0; padding: 0 0 0 0; }

#homerotator a img { margin: 0 0 0 0; padding: 0 0 0 0; } 


#newsletter { width: 98px; margin: 5px 0 10px 9px; padding: 0; border: 2px solid #FFF; font-size: 11px; text-align: center; }

#newsletter a { color: #FFF; text-decoration: none; padding: 6px 7px 6px 7px; display: block; } 

#newsletter a:hover { color: #9E0017; } 

#newsletter:hover { background: #FFF; color: #9E0017; }


#cruises { margin: 0; padding: 0; line-height: 120%; }

#cruises h3 { margin: 0 0 3px 0; padding: 0; }


#bottomwave { clear:both; margin-top: -10px; }


#rightcolumn { float: right; width: 120px; margin: 0 0 7px 0; padding: 0; background: #666; }

#rightcolumn ul { margin: 0; padding: 0; list-style: none; font-weight: bold; }

#rightcolumn li { margin: 0; padding: 0; text-align: center; }

#rightcolumn li a { color: #FFF; text-decoration: none; background: #002D4A; display: block; padding: 8px 4px 8px 4px; border-bottom: 1px solid #666; }

#rightcolumn li a:hover { background: #005343; }



#allstars { color: #FFF; padding: 7px; text-align: center; } 

#allstars h4 { font-size: 13px; margin: 0; padding: 0; }

#allstars a { color: #fff; text-decoration: none; padding: 0px 0 1px 0; border-bottom: 1px dotted #FFF; line-height: 1.5em; }

#allstars a:hover { border-bottom: 1px solid #FFF; }



#googleadarea { padding: 8px 0 0 9px; margin: 0; }

#googleadarea img { padding: 0; margin: 0 auto; text-align: center; }

#bottomborder { clear: both; width: 800px; height: 25px; background: #9E0017 url(images/bottom_graphic_red_wave_800x25.gif) 0 0 no-repeat; }



.bottomborder { 
	clear: both; 
	z-index: 5;
	width: 800px; 
	height: 25px; 
	margin: 0 0 0 0; 
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/bottom_graphic_red_wave_800x25.png'); } 

.bottomborder[class] { clear: both; z-index: 5; background: url(images/bottom_graphic_red_wave_800x25.png); } 



#footer { font-size: 100%; color: #FFF; background: #9E0017; padding: 2px 10px 10px 10px; text-align: center; }

#footer a { color: #FFF; text-decoration: none; padding-bottom: 1px; border-bottom: 1px dotted #FFF; margin: 0 2px 0 2px;}

#footer a:hover { border-bottom: 1px solid #FFF; }


/* CALENDAR GRAPHIC STYLES */

.calendar { color: #FFF; background: #CCC; margin: 0 auto 20px auto; text-align: center; font-weight: bold; }

.calendar thead { color: #9E0017; font-weight: bold; font-size: 120%; }

.calendar thead td a { color: #9E0017; background: #FFF; text-decoration: none; }

.calendar  thead a:hover { text-decoration: underline; }

.calendar .days { color: #000; font-weight: bold; }

.calendar tr { background: #FFF; }

.calendar td { padding: 11px; }

.calendar td a { color: #FFF; text-decoration: none; }

.calendar td a:hover { text-decoration: underline; }

.ggb1 { color: #FFF; background: #FFF url(images/calendar_graphics/ggb1.gif) 50% 50% no-repeat; }

.ggb1 a { color: #FFF; }

.ggb2 { background: #FFF url(images/calendar_graphics/ggb2.gif) 50% 50% no-repeat; }

.ggb4 { background: #FFF url(images/calendar_graphics/ggb4.gif) 50% 50% no-repeat; }

.ggb4fbl1 { background: #FFF url(images/calendar_graphics/ggb4_fbl1.gif) 50% 50% no-repeat; }

.ggb2cs1 { background: #FFF url(images/calendar_graphics/ggb2_cs1.gif) 50% 50% no-repeat; }

.ggb4cs2 { background: #FFF url(images/calendar_graphics/ggb4_cs2.gif) 50% 50% no-repeat; }

.ggb2fbl1cs1 { background: #FFF url(images/calendar_graphics/ggb2_fbl1_cs1.gif) 50% 50% no-repeat; }

.ggb2fbl1cs2 { background: #FFF url(images/calendar_graphics/ggb2_fbl1_cs2.gif) 50% 50% no-repeat; }

.ggb2fbl2cs2 { background: #FFF url(images/calendar_graphics/ggb2_fbl2_cs2.gif) 50% 50% no-repeat; }

.ggb3 { background: #FFF url(images/calendar_graphics/ggb3.gif) 50% 50% no-repeat; }

.ggb3cs1 { background: #FFF url(images/calendar_graphics/ggb3_cs1.gif) 50% 50% no-repeat; }

.ggb2fbl1 { background: #FFF url(images/calendar_graphics/ggb2_fbl1.gif) 50% 50% no-repeat; }

.ggb1fbl1cs1 { background: #FFF url(images/calendar_graphics/ggb1_fbl1_cs1.gif) 50% 50% no-repeat; }

.ggb3fbl1cs1 { background: #FFF url(images/calendar_graphics/ggb3_fbl1_cs1.gif) 50% 50% no-repeat; }

.ggb3fbl1 { background: #FFF url(images/calendar_graphics/ggb3_fbl1.gif) 50% 50% no-repeat; }

.ggb4fbl1cs2 { background: #FFF url(images/calendar_graphics/ggb4_fbl1_cs2.gif) 50% 50% no-repeat; }

.ggb4fbl2cs2 { background: #FFF url(images/calendar_graphics/ggb4_fbl2_cs2.gif) 50% 50% no-repeat; }


/* IMAGE POPUP STYLES FOR OUR FLEET PHOTOS */

/*Credits: Dynamic Drive CSS Library */
/*URL: http://www.dynamicdrive.com/style/ */

.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: #BBB;
padding: 5px;
left: -1000px;
border: 0px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: -10px;
left: -150px; /*position where enlarged image should offset horizontally */
}

.strikethrough { text-decoration: line-through; }