/**
 * Title:  Loonbedrijf Toering
 * Description: This stylesheet defines the layout of the website of  Loonbedrijf Toering
 * Copyright: Pronamic Internet, Vormgeving en Software
 * Company: Pronamic Internet, Vormgeving en Software
 * Author: Remco Tolsma, Jelke Boonstra
 * Version: 1.0
 */

body {
	background: #002E5F url("back.gif") repeat-x;

	color: #FFF;

	font: 80%/1.5 Arial, Helvetica, sans-serif;

	margin: 50px 0;
}

/**
 * Headings
 */
h1 {
	color: #CBCC32;

	font-size: 140%;
	font-style: italic;
}

h2 {
	color: #921728;

	font-size: 110%;
	font-style: italic;
}

#slogan {
	margin-top: -25px;
	color: #b0b355;
	margin-bottom: 20px;
}

/**
 * Anchors
 */
a {
	color: #FFF;
}

a img {
	border: none;
}

/**
 * Other
 */
.clear {
	clear: both;
}

/**
 * Container
 */
#container {
	background: #FFF url("container-back.gif") repeat-y;

	color: #494949;

	margin: 0 auto;
	padding: 0 10px 6px 10px;

	width: 780px;
}

/**
 * Head
 */
#head {
	background: url("head.jpg") no-repeat;

	float: left;

	height: 220px;
	width: 100%;

	margin-top: -20px;

	position: relative;
}

/**
 * Company name
 */
#company-name {
	margin: 0;

	position: absolute;

	top: 23px;
	left: 11px;
}

#company-name a {
	background: url("logo.png") no-repeat center center;

	display: block;

	padding: 10px;

	width: 304px;
	height: 111px;
}

#company-name a span {
	display: none;
}

/**
 * By pass
 */
#by-pass-section {
	display: none;
}

/**
 * Main menu
 */
#main-menu {
	background: #333 url("main-menu/border.gif") repeat-x bottom;

	clear: both;

	color: #FFF;

	font-size: 90%;
	font-weight: bold;

	text-transform: uppercase;
}

#main-menu ul {
	background: url("main-menu/back.gif") repeat-x;

	list-style: none;

	margin: 0;
	padding: 10px 10px 0 10px;
}

#main-menu li {
	float: left;
}

#main-menu a.active {
	border-color: #CBCC32;

	color: #CBCC32;
}

#main-menu a:hover {
	border-color: #CBCC32;
}

#main-menu a {
	background: #333;
	background-position: center 6px;
	background-repeat: no-repeat;

	border-bottom: 3px solid #010101;

	color: #FFF;

	display: block;

	padding: 5px 10px;

	text-decoration: none;

}

#main-menu a.active, 
#main-menu a:hover {
	background-position: center -85px;
}

/* specific items */
#menu-item-home a { width: 42px; height: 11px; background-image: url("main-menu/home.gif"); }
#menu-item-home a span { display: none; }

#menu-item-actual a { width: 59px; height: 11px; background-image: url("main-menu/actueel.gif"); }
#menu-item-actual a span { display: none; }

#menu-item-projects a { width: 73px; height: 11px; background-image: url("main-menu/projecten.gif"); }
#menu-item-projects a span { display: none; }

#menu-item-machines a { width: 111px; height: 11px; background-image: url("main-menu/nieuwe-machines.gif"); }
#menu-item-machines a span { display: none; }

#menu-item-machinepark a { width: 111px; height: 11px; background-image: url("main-menu/machinepark.gif"); }
#menu-item-machinepark a span { display: none; }

#menu-item-other a { width: 97px; height: 11px; background-image: url("main-menu/overig-nieuws.gif"); }
#menu-item-other a span { display: none; }

#menu-item-newsletter a { width: 99px; height: 11px; background-image: url("main-menu/nieuwsbrieven.gif"); }
#menu-item-newsletter a span { display: none; }

#menu-item-media a { width: 77px; height: 11px; background-image: url("main-menu/in-de-media.gif"); }
#menu-item-media a span { display: none; }

#menu-item-agency a { width: 84px; height: 11px; background-image: url("main-menu/loonbedrijf.gif"); }
#menu-item-agency a span { display: none; }

#menu-item-earthmoving a { width: 90px; height: 11px; background-image: url("main-menu/grondverzet.gif"); }
#menu-item-earthmoving a span { display: none; }

#menu-item-individuals a { width: 92px; height: 11px; background-image: url("main-menu/particulieren.gif"); }
#menu-item-individuals a span { display: none; }

#menu-item-trade a { width: 124px; height: 11px; background-image: url("main-menu/handelsmaterialen.gif"); }
#menu-item-trade a span { display: none; }

#menu-item-links a { width: 43px; height: 11px; background-image: url("main-menu/links.gif"); }
#menu-item-links a span { display: none; }

#menu-item-contact a { width: 62px; height: 11px; background-image: url("main-menu/contact.gif"); }
#menu-item-contact a span { display: none; }


/* Sublevel */
#main-menu ul ul {
	background: #333;

	position: absolute;
	left: -999em;

	padding: 0;

	width: 59px;

	z-index: 2;
}

#main-menu li li {
	background: #333;
	
	width: 130px;
}

#main-menu li li a {
	background-position: 10px 6px;
	
	border-color: #000;
	
	color: #CBCC32;
	
	padding-left: 10px;
	
	width: 110px;
}

#main-menu li li a:hover {
	background-position: 10px -85px;
	
	border-color: #000;
}


#main-menu li:hover ul,
#main-menu li.hover ul {
	background: #333;	
	left: auto;
}

#main-menu li li a.active {
	background-position: 10px -85px;

	border-color: #000;
}

/**
 * Main
 */
#main {
	background: url("main-back.gif") no-repeat bottom;

	padding: 30px 0 140px 25px;
}

#main a {
	color: #002E5F;
}

#main a:hover {
	color: #8E1421;
}

/**
 * Core
 */
#core {
	float: left;

	width: 450px;
}

/**
 * Images list
 */
.images-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.images-list li {
	float: left;

	margin: 0 8px 8px 0;
}

.images-list a {
	border: none;

	display: block;
}

.images-list img {
	background: url("pic-list-back.gif") no-repeat;

	border: none;

	display: block;

	width: 120px;
	height: 90px;
	
	padding: 11px;
}

.contract-work-item {
	clear: both;
}

/**
 * Flickr image list
 */
.preview-list {
	list-style: none;

	margin: 0;
	padding: 0;
}

.preview-list li { 
	
	
}


/**
 * Categories
 */
#categories {
	padding: 10px 0 0 0;
}

.category {
	display: block;
}

.category .article { 
	padding: 10px 0 10px 160px;

	position: relative;

	min-height: 130px;
}

.category .article h3,
.category .article p {
	padding: 0;
	margin: 0;
}

.category h2 {
	background: #333333 url("back-heading.gif") no-repeat top left;

	color: #FFF;

	padding: 10px 5px 5px 5px;
}

.category .article .images-list {
	position: absolute;

	top: 10px;
	left: 0;
}

.content-navigation {
	float: right;
}

/**
 * Forms
 */
label {
	cursor: pointer;

	display: block;

	font-weight: bold;
}

.field {
	margin-bottom: 15px;
}

input.text,
select, 
textarea{
	border: 1px solid #757070;

	font-size: 1em;
	font-family: Arial, Verdana, Helvetica, sans-serif;

	padding: 5px;
}

input:focus,
textarea:focus {
	border-color: #333;
}

.error,
.required-indicator {
	color: #ED1C24;
}

/**
 * Extra
 */
#extra {
	float: right;

	width: 275px;
}

/**
 * Extra - block
 */
#extra .block {
	background: #C9C52E url("block-back.gif") no-repeat bottom right;

	font-weight: bold;

	margin-bottom: 20px;
	padding: 10px 20px 20px 10px;
}

#extra .block h1 {
	color: #FFF;

	font-size: 125%;

	margin: 0;
}

#extra .block p {
	margin: 0;
}

#extra .block a {
	color: #FFF;

	text-decoration: none;
}

#extra .block a:hover {
	text-decoration: underline;
}

#extra .block a.view-more-link {
	background-image: url("view-more-link-1.gif");

	display: block;

	float: right;

	font-size: 90%;

	text-transform: uppercase;

	width: 77px;
	height: 12px;
}

#extra .block a.view-more-link span {
	display: none;
}

/* specific blocks */
#materials-block.block {
	background-color: #8C1324;
	background-image: url("materials-back.gif");

	color: #FFF;
}

#materials-block.block a.view-more-link {
	background-image: url("view-more-link-2.gif");

	float: none;

	margin: 1em 0;
}

#materials-block.block a.view-more-link span{
	display: none;
}

/**
 * Foot
 */
#foot {
	background: #333;

	color: #FFF;

	padding: 5px 5px 15px 5px;

	text-align: center;
}

#foot p {
	margin: 0;
}

#foot a {
	color: #FFF;
}

#foot a:hover {
	color: #AAA;
}

#foot .separator {
	color: #8E1421;

	padding: 0 5px;
}

/**
 * Bottom
 */
#bottom {
	color: #8097AF;

	font-size: 85%;

	margin: 0 auto;

	width: 780px;
}

#bottom a {
	color: #8097AF;
}

#bottom a:hover {
	color: #ccd5df;
}

#bottom .separator {
	padding: 0 5px;
}

/**
 * Copyright
 */
#copyright {
	float: left;
}

/**
 * Bottom menu
 */
#bottom-menu {
	float: right;
}

/**
 * Pronamic
 */
#pronamic {
	clear: left;
}
