/*-----------------------------------------------------------------------------
	DEFAULT GLOBAL
-----------------------------------------------------------------------------*/

* {margin: 0; padding: 0;}

body {font: 62.5% arial,helvetica,sans-serif; color: #333333; background: #ffffff; text-align: center;}

.smaller {font-size: 0.9em;}
.smallest {font-size: 0.8em;}
.larger {font-size: 1.1em;}
.largest {font-size: 1.2em;}

.left {text-align: left;}
.center {text-align: center;}
.right {text-align: right;}
.top {vertical-align: top;}
.middle {vertical-align: middle;}
.bottom {vertical-align: bottom;}
.floatleft {float: left;}
.floatright {float: right;}

p {margin: 0 0 0.9em 0;}

.strong {font-weight: bold;}
.em {font-style: italic;}
.hide {display: none;}
.block {display: block;}
.inline {display: block;}

hr {margin: 1em 0 1em 0; background: #e6e6e6; width: 100%; height: 1px; color: #e6e6e6; border: none; clear: both;}
.hr {margin: 1em 0 1em 0; border-top: 1px solid #e6e6e6;}
	.hr hr {display: none;}
	
.clear {position: relative; width: 100%; clear: both; line-height: 0; height: 0; display: block;}

img {border: 0;}
	img.img-left {margin: 0 10px 10px 0;}
	img.img-right {margin: 0 0 10px 50px;}
	
.quote {font-size: 2.5em; font-weight: bold; color: #999999; line-height: 1em;}
	
/* for flash and similar */
embed, object {position: relative; z-index: 0;}

/*-----------------------------------------------------------------------------
	TABLES
-----------------------------------------------------------------------------*/

table, td, th {vertical-align: top; text-align: left; font-size: 1em; line-height: 1em;}

/*-----------------------------------------------------------------------------
	DEFAULT LINKS
-----------------------------------------------------------------------------*/

a {color: #888888; text-decoration: none; cursor: pointer;}
	a:hover {color: #770000;}
	a:focus {-moz-outline: none;}
	a.more {font-weight: bold; font-size: 0.9em;}
	
/*-----------------------------------------------------------------------------
	DEFAULT HEADINGS
-----------------------------------------------------------------------------*/

h1 {font-size: 2.5em; color: #770000; margin: 0 0 0.5em 0;}
	h1 em {font-size: 0.9em; color: #888888; font-style: normal;}
	h1 strong {font-size: 0.7em; color: #666666;}
h2 {font-size: 1.8em; color: #c1c1c1; margin: 0 0 0.5em 0;}
h3 {font-size: 1.6em; font-weight: bold; color: #999999; margin: 0 0 0.3em 0;}
h4 {font-size: 1.3em; font-weight: bold; color: #888888; margin: 0.5em 0 0.2em 0;}
h5 {font-size: 1.1em; font-weight: bold; color: #770000; margin: 0.5em 0 0.1em 0;}
h6 {font-size: 1em; font-weight: bold; color: #000000; margin: 0.5em 0 0 0;}

/*-----------------------------------------------------------------------------
	DEFAULT LISTS
-----------------------------------------------------------------------------*/

ul {margin: 0 0 1em 1.1em;}
	ul li {margin: 0 0 0.2em 0;}
	ul.spaced li {margin: 0 0 1em 0;}
	
ul.videos {margin: 0 0 1em 0.1em; list-style: none;}
	ul.videos li {margin: 0 0 0.2em 0;	padding: 0 0 0 15px; background: transparent url(../images/icon_video.gif) 0 0.3em no-repeat;}
	ul.videos a {color: #770000; display: block;}
		ul.videos a:hover {color: #666666;}
	
ol {margin: 0 0 1em 3em;}
	ol li {margin: 0 0 0.2em 0;}
	ol.spaced li {margin: 0 0 1em 0;}

/*
----------------------------------------------------------------------------- 
Forms
-----------------------------------------------------------------------------*/

form {font-size: 1em;}

fieldset {margin: 0; border: none; padding: 0;}
label {padding: 0 10px 0 0;}

input, textarea, select {font-size: 1em; color: #333333; background: #eeeeee; margin: 0 0 2px 0; padding: 1px 3px 1px 3px; border: 1px solid #c1c1c1; font: 1em arial,helvetica,sans-serif;}
	textarea {overflow: auto; height: 100px;}
	select {padding: 0;}

	input.btn {float: none; border: none; color: #ffffff; background: #770000; margin: 5px 0 0 0; cursor: pointer; text-transform: uppercase; font-weight: bold; font-size: 0.9em; width: auto !important;}
		input.btn:hover {background: #838383;}
	
optgroup {font-style: normal;}
	optgroup option {padding: 0 0 0 20px;}

input[type="radio"], input[type="checkbox"] {width: auto; margin: 0 2px 0 5px;}
input[type="hidden"] {display: none;}
select[multiple="multiple"] {margin-left: 0;}

form br {clear: both; line-height: 0; height: 0;}

form .required {border: 1px solid #770000;}
.error-message {font-weight: bold; color: #770000;}

form#login-form {}
	form#login-form label, form#login-form input {display: block;}
	
form.custom1 {}
	form.custom1 fieldset {margin: 0 0 5px 0; border-top: 5px solid #838383; background: #f3f3f3; padding: 10px 10px 10px 10px;}
	form.custom1 input, form.custom1 textarea, form.custom1 select {float: left; width: 177px;}
		form.custom1 select {width: 185px;}
		form.custom1 input.file {border: none; width: 100%;}
	form.custom1 label {float: left; width: 250px; text-align: right;}

/*-----------------------------------------------------------------------------
	LAYOUT
-----------------------------------------------------------------------------*/

#container {position: relative; width: 970px; margin: 0 auto; text-align: left; font-size: 1em;}

#top-links {padding: 3px 10px; background: #f3f3f3; color: #888888; text-align: right;}
	#top-links a {color: #888888;}
		#top-links a:hover {color: #333333;}

h1#logo {float: left; display: block; margin: 0; padding: 15px 20px 20px 10px; color: #333333; background: transparent url(../images/logo_keppel.gif) 10px 15px no-repeat;}
	h1#logo a {display: block; width: 180px; height: 32px;}
		h1#logo a span {display: none;}

#header {position: relative; clear: both; width: 100%; height: 180px; overflow: hidden; margin: 0 0 1px 0;}
	#header #header-img {position: absolute; top: 0; left: 0;}
	#header h1 {position: absolute; top: 120px; left: 10px; width: 432px; padding: 10px 0; background: #660000; font-size: 2.5em; font-weight: normal; color: #ffffff; letter-spacing: 0.03em; text-align: center; z-index: 10;}
	
	#home #header {height: 300px;}
		#home #header h1 {top: 160px;}
		#home #header .content {position: absolute; top: 160px; right: 10px; width: 484px; padding: 15px 12px; background: #ffffff; font-size: 1.2em; color: #660000; z-index: 10;}

#boxes {clear: both; background: transparent url(../images/bg_boxes.gif) 100% 0 repeat-y; border-bottom: 1px solid #e6e6e6; font-size: 1.1em;}
	#boxes .box {float: left; width: 242px; background: transparent url(../images/bg_box1.gif) 0 0 repeat-x;}
	#boxes .box2 {background: transparent url(../images/bg_box2.gif) 0 0 repeat-x;}
	#boxes .latest-news {width: 244px;}
	#boxes .testimonials {width: 484px;}
	#boxes .video {width: 244px; background: none;}
	#boxes h2 {font-size: 1.2em; font-weight: bold; color: #770000; text-align: center; background: transparent url(../images/bg_box_hd1.gif) 0 0 no-repeat; padding: 7px 0 0 0; margin: 8px 0 0 31px; width: 180px;}
		#boxes .latest-news h2 {background: transparent url(../images/bg_box_hd2.gif) 0 0 no-repeat;}
		#boxes .box2 h2 {padding: 7px 0 0 0; margin: 5px 0 0 31px;}
		#boxes .video h2 {background: #660000; color: #ffffff; padding: 0; margin: 0 0 1px 17px; width: 210px; line-height: 25px;}
	#boxes h3 {font-size: 1em; font-weight: bold; color: #770000; padding: 0; margin: 0 0 0.3em 0; width: 180px;}
	#boxes .content {padding: 10px 31px 10px 31px;}
		/*#boxes .latest-news .content {padding: 10px 17px 10px 17px;}*/
		#boxes .video .content {padding: 0 17px 10px 17px;}
	#boxes img {width: 180px; height: 60px; margin: 0 0 10px 0;}
		#boxes .video img {width: auto; height: auto; margin: 0;}
		#boxes .testimonials img {margin: 0 0 10px 10px;}

#breadcrumbs {background: #838383; color: #ffffff; padding: 3px 10px 4px 10px; margin: 0 0 1px 0;}
	#breadcrumbs a {color: #ffffff;}
		#breadcrumbs a:hover {color: #000000;}

#main {clear: both; background: transparent url(../images/bg_main.gif) 0 0 repeat-y; border-top: 5px solid #838383; border-bottom: 1px solid #e6e6e6; font-size: 1.1em;}

#sidebar {float: left; width: 210px;}
	#sidebar .content {padding: 15px 10px;}

#content {float: left; margin: 15px 0 20px 20px; width: 740px;}
	#content .content-left {float: left; width: 465px; margin: 0 20px 0 0; font-size: 1.1em;}
	#content .content-right {float: right; width: 255px;}
		#content img {margin: 0 0 10px 0; border: 1px solid #e6e6e6; padding: 1px; width: 250px;}

#footer {clear: both; padding: 20px 10px; width: 950px; color: #888888;}
	#footer a {color: #888888;}
	#footer a:hover {color: #333333;}
	
/*-----------------------------------------------------------------------------
	TOP NAVIGATION
-----------------------------------------------------------------------------*/
#nav {float: right; margin: 7px 0 0 0;}

/*** ESSENTIAL STYLES ***/
.nav, .nav * {
	margin: 0;
	padding: 0;
	list-style: none;
}
.nav {
	line-height: 1em;
}
.nav ul {
	position: absolute;
	top: -999em;
	width: 10em;
}
.nav ul ul {
	width: 11em;
}
.nav li {
	float: left;
	position: relative;
	z-index: 99;
}
.nav a {
	display: block;
}
.nav li:hover ul, ul.nav li.sfHover ul {
	left: -1px;
	top: 5em;
}
.nav li:hover li ul, .nav li.sfHover li ul {
	top: -999em;
}
.nav li li:hover ul, ul.nav li li.sfHover ul {
	left: 11em;
	top: 0;
}
.superfish li:hover ul, .superfish li li:hover ul {
	top: -999em;
}

/*** ORIGINAL SKIN ***/
.nav {
	float: left;
	font-size: 1.2em;
}
.nav li {
	width: auto;
	font-weight: bold;
	background: transparent url(../images/divider_nav.gif) 100% 100% no-repeat;
}
.nav li a {
	color: #838383;
	padding: 3em 0.75em 1em 0.75em;
	width: auto;
}
.nav li:hover, .nav li.sfHover, .nav li a:hover {
	color: #770000;
}
.nav li li {
	border-left: 1px solid #fff;
	border-bottom: 1px solid #fff;
	background: #f2f2f2;
	font-weight: normal;
}
.nav li li a {
	color: #770000;
	padding: 0.4em 0.75em 0.4em 0.75em;
	width: 9.5em;
}
.nav li li:hover, .nav li li.sfHover, .nav li li a:hover {
	color: #ffffff;
	background: #838383;
}

/*-----------------------------------------------------------------------------
	LEFT NAVIGATION
-----------------------------------------------------------------------------*/

ul.subnav {margin: 0 0 1em 0.1em; list-style: none;}
	ul.subnav li {margin: 0 0 0.2em 0;	padding: 0 0 0 12px; background: transparent url(../images/icon_logo.gif) 0 0.3em no-repeat;}
	ul.subnav a {color: #770000; display: block;}
		ul.subnav a:hover {color: #666666;}