﻿/** CSS - Superior Cabinets
==============================================================================*/



/** Body
==============================================================================*/

html, body {
font-family:  Arial, Verdana, Helvetica, sans-serif;
font-size: 12px;
line-height: 18px;
margin: 0 auto;
background: #ffffff;
background-image: url(images/body_bg.gif);
background-position: 0px 13px;
background-repeat: repeat-x;
}

* {
	/* removes defaults from all elements */
	margin: 0;
	padding: 0;
}

/** Main Container
==============================================================================*/

#container {
width: 760px;
margin: 0 auto;
}

div.thumbnail {
width: 760px;
margin-bottom: 20px;
}
div.thumbnail p {
	font-size: 18px;
}


div.float {
  float: left;
  width: 85px;
  padding: 10px;
  }
  
div.float p {
   text-align: center;
   }

div.spacer {
  clear: both;
  }

/** Ticker
==============================================================================*/

#so_oTickerContainer {
	width: 470px;
	margin: auto;
	font: 1.2em verdana,arial;
	background-color: lightyellow;
	border-top: 1px solid yellow;
	border-bottom: 1px solid yellow;
	margin-bottom: 10px;
	padding-bottom: 10;
}

#so_oTickerContainer h1 {
	font:bold 1.2em verdana,arial;
	margin:0;
	padding:0;
	margin-bottom: 10px;
}
	
.so_tickerContainer {
	position:left;
	margin:auto;
	width:470px;
	background-color:lightyellow;
	border-top:1px solid yellow;
	border-bottom:1px solid yellow;
	margin-bottom: 10px;
}

#so_tickerAnchor, #so_oTickerContainer a {
	text-decoration: none;
	color: black;
	font: bold 1em arial, verdana;
	border-right: 1px solid #000;
	padding-right: 2px;
	margin-bottom: 10px;
}

#so_oTickerContainer a {
	border-style:none;
}

#so_oTickerContainer ul {
	margin-top:0px;
}

#so_tickerDiv {
	display:inline;
	margin-left:5px;
}

#so_tickerH1 {
	font:bold 1.2em arial,verdana;
	display:inline;
}

#so_tickerH1 a {
	text-decoration:none;
	color:#000;
	padding-right:2px;
}

#so_tickerH1 a img {
	border-style:none;
}



/** Top Contact Information
==============================================================================*/

#topinfo {
float: left;
width: 760px;
margin-top: 0px;
background-color: #333333;
color: #cccccc;
font-size: 10px;
}

p.left {
float: left;
padding-left: 20px;
margin-top: 4px;
margin-bottom: 4px;
}

p.right {
float: right;
padding-right: 20px;
margin-top: 0px;
margin-bottom: 0px;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 20px;
background-color: #f2ce45;
color: #333333;
}

h1 {
display:none
}

h2 {
display:none
}

/** Logo
==============================================================================*/

img#logo {
float: left;
margin-top: 3px;
margin-right: 62px;
margin-bottom: 4px;
height: 75px;
overflow: hidden;
padding-bottom: 6px;
}

/** Navigation
==============================================================================*/

ul#nav {
float: left;
width: 450px;
padding: 0px;
margin: 0px;
list-style-type: none;
height: 69px;
overflow: hidden;
}

ul#nav li {
display: block;
float: left;
}

li#home a {
display: block;
float: left;
width: 75px;
height: 75px;
background-image: url(images/nav_home.gif);
background-position: 0 0;
background-repeat: no-repeat;
overflow: hidden;
}

li#fleet a {
display: block;
float: left;
width: 75px;
height: 75px;
background-image: url(images/nav_fleet.gif);
background-position: 0 0;
background-repeat: no-repeat;
overflow: hidden;
}

li#charters a {
display: block;
float: left;
width: 75px;
height: 75px;
background-image: url(images/nav_charters.gif);
background-position: 0 0;
background-repeat: no-repeat;
overflow: hidden;
}

li#about a {
display: block;
float: left;
width: 75px;
height: 75px;
background-image: url(images/nav_about.gif);
background-position: 0 0;
background-repeat: no-repeat;
overflow: hidden;
}

li#contact a {
display: block;
float: left;
width: 75px;
height: 75px;
background-image: url(images/nav_contact.gif);
background-position: 0 0;
background-repeat: no-repeat;
overflow: hidden;
}

li#links a {
display: block;
float: left;
width: 75px;
height: 75px;
background-image: url(images/nav_links.gif);
background-position: 0 0;
background-repeat: no-repeat;
overflow: hidden;
}

li#home a:hover, li#fleet a:hover, li#charters a:hover, li#about a:hover, li#contact a:hover, li#links a:hover {
background-position: 0px -170px;
}

li#home a#current, li#fleet a#current, li#charters a#current, li#about a#current, li#contact a#current, li#links a#current {
background-position: 0px -86px;
}

li#home a span, li#fleet a span, li#charters a span, li#about a span, li#contact a span, li#links a span {
display: none;
}


/** Header Images
==============================================================================*/

#headerimages {
float: left;
height: 234px;
width: 760px;
}

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

/** Misc
==============================================================================*/

a img {
border: none;
}

.clear {
clear: both;
}
/** Center Column
==============================================================================*/

#centercol {
float: center;
margin-top: 30px;
width: 490px;
background-image: url(images/home_para_bg.gif);
background-position: top right;
background-repeat: no-repeat;
}

#centercol p {
width: 470px;
font-size: 14px;
margin-bottom: 20px;
margin-top: 20px;
}

ul.list {
list-style-type: none;
font-size: 14px;
line-height: 28px;
}

ul.list li {
padding-left: 25px;
background-image: url(images/tick_white_bg.gif);
background-position: 0 6px;
background-repeat: no-repeat;
}

ul#links {
list-style-type: none;
font-size: 14px;
line-height: 28px;
}

ul#links li {
padding-left: 25px;
background-image: url(images/link_go.gif);
background-position: 0 6px;
background-repeat: no-repeat;
}

img.fleet {
padding-top: 15px;
padding-bottom: 25px;
}

p.note {
margin-top: 25px;
background-color: #c4d4da;
color: #333333;
text-align: center;
width: 400px;
padding: 15px;
}

ol.fund {
font-size:14px;
margin-left:45px;
}

ol.fund li {
padding: 0 0 5px 5px;
}

ul.direc {
font-size:14px;
margin-left:40px;
list-style-type: square;
}

ul.direc li {
padding: 0 0 5px 5px;
}


/** Left Column
==============================================================================*/

#leftcol {
float: left;
margin-top: 30px;
width: 600px;
background-image: url(images/home_para_bg.gif);
background-position: top right;
background-repeat: no-repeat;
}

#leftcol p {
width: 600px;
font-size: 14px;
margin-bottom: 20px;
margin-top: 20px;
}

ul.list {
list-style-type: none;
font-size: 14px;
line-height: 28px;
}

ul.list li {
padding-left: 25px;
background-image: url(images/tick_white_bg.gif);
background-position: 0 6px;
background-repeat: no-repeat;
}

ul#links {
list-style-type: none;
font-size: 14px;
line-height: 28px;
}

ul#links li {
padding-left: 25px;
background-image: url(images/link_go.gif);
background-position: 0 6px;
background-repeat: no-repeat;
}

img.fleet {
padding-top: 15px;
padding-bottom: 25px;
}

p.note {
margin-top: 25px;
background-color: #c4d4da;
color: #333333;
text-align: center;
width: 400px;
padding: 15px;
}

ol.fund {
font-size:14px;
margin-left:45px;
}

ol.fund li {
padding: 0 0 5px 5px;
}

ul.direc {
font-size:14px;
margin-left:40px;
list-style-type: square;
}

ul.direc li {
padding: 0 0 5px 5px;
}

/** Right Column
==============================================================================*/

#rightcol {
float: right;
margin-top: 30px;
width: 239px;
}

.markermenu{
list-style-type: none;
margin: 5px 0;
padding: 0 0 0 0;
width: 200px;
}

.markermenu li a{
background: white url(images/arrow-list.gif) no-repeat 2px center;
font: bold 13px Arial, "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: #918d8c;
display: block;
width: auto;
padding: 8px 0;
padding-left: 20px;
text-decoration: none;
border-bottom: 1px solid #B5B5B5;
}


* html .markermenu li a{ /*IE only. Actual menu width minus left padding of LINK (20px) */
width: 150px;
}

.markermenu li a:visited, .markermenu li a:active{
color: #918d8c;
}

.markermenu li a:hover{
color: black;
background-color: #ffffcb;
background-image:url(images/arrow-list-red.gif); /*onMouseover image change. Remove if none*/
}

.markermenu li a#selected {
color:#000;
background-image:url(images/arrow-list-red.gif)
}

#map {
width: 252px;
height: 350px;
overflow: hidden;
border: 1px solid #333333;
}

p#name {
font-weight: bold;
font-size: 14px;
margin-bottom: 0px;
}

p#location {
font-style: italic;
margin-top: 0px;
padding-top: 0px;
}

#cal {
float:left;
margin-right:5px;
border:1px solid #b49b3c;
}

#thumb {
	margin-top: 4px;
	margin-bottom: 4px;
	margin-left: 4px;
	margin-right: 4px;
	padding:4px;
	border:1px solid #b49b3c;
}

/** Contact Form
==============================================================================*/

label{
float: left;
width: 390px;
font-weight: bold;
}

input, textarea{
width: 400px;
margin-bottom: 5px;

}

textarea{
width: 400px;
height: 150px;
}

.boxes{
width: 100px;
}

#submitbutton{
margin-left: 120px;
margin-top: 5px;
width: 90px;
}

br{
clear: left;
}

input:focus, textarea:focus, input.sffocus, textarea.sffocus {
background: #ffffde;
}

#submitbutton{
margin-left: 305px;
margin-top: 0px;
width: 100px;
}

/** Footer
==============================================================================*/

#footer {
float: left;
width: 760px;
margin-top: 35px;
border-top: 1px solid #aaaaaa;
}

#footer ul {
margin-top: 15px;
list-style-type: none;
}

#footer ul li {
display: block;
float: left;
}

#footer ul li a {
display: block;
float: left;
padding-left: 10px;
padding-right: 10px;
border-right: 1px solid #aaaaaa;
color: #aaaaaa;
text-decoration: none;
}

#footer ul li a:hover {
color: #b49b3c;
}

#footer ul li#first a {
padding-left: 0px;
}

#footer ul li#last a {
border-right: none;
}

#copyright {
font-size: 10px;
color: #aaaaaa;
padding-top: 15px;
}

#siteby {
margin-top: 0px;
color: #aaaaaa;
font-size: 10px;
}

#footer a:link {
color: #aaaaaa;
}
