/*
*************************************************

file : screen.css
client : M&J Engineering
use : The main presentation stylesheet used for screen and projection
author : Karl BRIGHTMAN
date created: 12th March 2007
the song : Gotye - Coming Back
on this day : 1938 - Anschluss Österreichs: Austria was occupied by the Wehrmacht, and subsequently became Ostmark, a province within the German Reich.

*************************************************
*/

@import "cmxform.css";

/*-------------------------------------------    
    General Selectors
-------------------------------------------*/
* { line-height: 1.4; margin: 0; padding: 0; }
body {
	background: #002536 url(../images/core/bg.jpg) no-repeat 0 0;
	color: #6f6f6f;
	font: normal 62.5% "Verdana", Arial, Helvetica, sans-serif;
}

h1 { color: #da520c; margin-bottom: .5em; }
h2 { color: #b14711; margin-bottom: .5em; }
h3 { color: #6f6f6f; }

img { display: block; border: none; }

p { margin-bottom: 1.3em; }

hr.clear {
	border: 0;
	border-top: 1px solid #e0dfdf;
	clear: both;
	display: block;
	height: 0;
	margin: 10px 0;
}

.clear {
	clear: both;
	display: block;
}

#container { background: #fff; margin: 20px auto; padding: 10px; width: 930px; }

/*-------------------------------------------    
    Header
-------------------------------------------*/
#header {
	height: 195px;
	background: url(../images/core/header_bg.jpg) no-repeat 0 0;
	position: relative;
}

#header h1 { margin: 0; }

#header a#logo {
	background: url(../images/core/logo.jpg) no-repeat 0 0;
	display: block;
	height: 42px;
	left: 49px;
	overflow: hidden;
	position: absolute;
	text-indent: -9999px;
	top: 142px;
	width: 416px;
}
#header a#logo:hover, #header a#logo:focus { background-position: 0 -42px; }

/*-------------------------------------------    
    Navigation
-------------------------------------------*/
ul#navigation {
	height: 45px;
	list-style: none;
}
ul#navigation li { float: left; }
ul#navigation li a {
	display: block;
	height: 45px;
	overflow: hidden;
	text-decoration: none;
	text-indent: -9999px;
}
ul#navigation li a:hover, ul#navigation li a:focus { background-position: 0 -45px !important; }

ul#navigation li a#nav-home { background: url(../images/navigation/home.jpg) no-repeat 0 0; width: 56px; }
ul#navigation li a#nav-kit_boats { background: url(../images/navigation/kit_boats.jpg) no-repeat 0 0; width: 77px; }
ul#navigation li a#nav-marine_products { background: url(../images/navigation/marine_products.jpg) no-repeat 0 0; width: 90px; }
ul#navigation li a#nav-distributors { background: url(../images/navigation/distributors.jpg) no-repeat 0 0; width: 102px; }
ul#navigation li a#nav-sea_strainers { background: url(../images/navigation/sea_strainers.jpg) no-repeat 0 0; width: 109px; }
ul#navigation li a#nav-propellers { background: url(../images/navigation/propellers.jpg) no-repeat 0 0; width: 90px; }
ul#navigation li a#nav-size_changing_propellers { background: url(../images/navigation/size_changing_propellers.jpg) no-repeat 0 0; width: 113px; }
ul#navigation li a#nav-shell_cleaning_equipment { background: url(../images/navigation/shell_cleaning_equipment.jpg) no-repeat 0 0; width: 118px; }
ul#navigation li a#nav-engineering { background: url(../images/navigation/engineering.jpg) no-repeat 0 0; width: 98px; }
ul#navigation li a#nav-contact { background: url(../images/navigation/contact.jpg) no-repeat 0 0; width: 77px; }

/*-------------------------------------------    
    Banner - Replaced by flash if available
-------------------------------------------*/
#banner {
	height: 124px;
	margin-top: 9px;
}

#banner ul { list-style: none; }
#banner ul li {
	float: left;
	margin-left: 11px;
}
#banner ul li.first { margin-left: 0; }

#banner ul li a {
	display: block;
	height: 124px;
	overflow: hidden;
	text-decoration: none;
	text-indent: -9999px;
	width: 224px;
}
#banner ul li a:hover, #banner ul li a:focus { background-position: 0 -124px; }

#banner ul li a#banner-pearling_equipment { background-image: url(../images/core/banner-pearling_equipment.jpg);}
#banner ul li a#banner-mikado_propellers { background-image: url(../images/core/banner-mikado_propellers.jpg); }
#banner ul li a#banner-sea_strainers { background-image: url(../images/core/banner-sea_strainers.jpg); }
#banner ul li a#banner-marine_products { background-image: url(../images/core/banner-marine_products.jpg); }

/*-------------------------------------------    
    Primary Content
-------------------------------------------*/
#primary_content {
	float: right;
	font-size: 1.3em;
	margin-top: 9px;
	width: 695px;
}

#primary_content h1 { font-size: 1.6em; font-weight: normal; }
#primary_content h2 { font-size: 1.3em; font-weight: normal; }
#primary_content h3 { font-size: 1.1em; font-weight: bold; 
}
#primary_content h4 { font-size: 1.1em; }
#primary_content h5 { font-size: 1em; }

#primary_content ul, #primary_content ol { margin-left: 2em; }
#primary_content ul, #primary_content ol, #primary_content dl { margin-bottom: 1.3em; }

#primary_content a { color: #f63b10; text-decoration: underline; }
#primary_content a:hover, #primary_content a:focus { color: #8d2c16; }

#primary_content h1 small {
	display: block;
	font-size: 75%;
}

#primary_content ul.gallery_thumbnails li {
	float: left;
	margin: 5px 5px 3em 5px;
	list-style: none;
}

#primary_content ul.gallery_thumbnails2 li {
	float: left;
	margin: 5px 5px 3em 5px;
	list-style: none;
}

#primary_content img.right {
	float: right;
	margin: 10px 0 10px 10px;
}

#primary_content img.left {
	float: left;
	margin: 10px 10px 10px 0;
}

/*-------------------------------------------    
    Secondary Content
-------------------------------------------*/

#secondary_content {
	float: left;
	font-size: 1.1em;
	margin-top: 9px;
	width: 225px;
}

#secondary_content h1 { font-size: 1.4em; font-weight: bold; }
#secondary_content h2 { font-size: 1.3em; font-weight: bold; }
#secondary_content h3 { font-size: 1.2em; }
#secondary_content h4 { font-size: 1.1em; }
#secondary_content h5 { font-size: 1em; }

#secondary_content a { color: #da520c; text-decoration: underline; }
#secondary_content a:hover, #primary_content a:focus { color: #000; }

/*-------------------------------------------    
    Footer
-------------------------------------------*/
#footer p { margin-bottom: 0; }

#footer a { color: #f63b10; text-decoration: none; }
#footer a:hover, #footer a:focus { color: #8d2c16; }
#footer { height:50px; }

#brochures-margin { margin-left:10px; }