/*-------------------------------------------------------------------
Grid elements
-------------------------------------------------------------------*/
body { 
    background: #f1f1f1 url("../images/bg_white.png") repeat-x top left;
	}
	
body.inloggen {
	background-color: #FFF;
}

#container {
	width: 1000px;
	background-color: #e3e3e3;
	margin: 0 auto;
	padding-bottom: 40px;
	position: relative;
}

.inloggen #container {
	background-color: #FFF;
}

/*-------------------------------------------------------------------
blocks
-------------------------------------------------------------------*/
.main { 
	background-color: white;
	margin: 0 20px;
	width: 960px;
	padding-top: 20px;
	}
	
.inloggen .main { 
	padding-top: 119px;
}
		
.block { 
	border: 1px solid #f1f1f1; 
	position: relative;
}

.three-columns .block { border-top: 1px solid #B32119; }

.block .content { 
	padding: 10px 10px 40px 10px;
}

.block .footer{ 
	width: auto;
	padding: 10px;
	position: absolute;
	bottom:0;
}

.content { padding: 10px;}

.three-columns .image,
.four-columns .image { position: relative; margin: -1px -1px 0 -1px;} 

.image img
 { 
    max-height: 100%;
    max-width: 100%; 
 }

/*-------------------------------------------------------------------
Header
-------------------------------------------------------------------*/
.header {
	position: absolute;
	z-index: 100;
	background-color: white;
	width: 960px;
	height: 116px;
	border-bottom: 3px solid #d2322a;
	margin: 0 20px;
}

.inloggen .header { border: none;} 


	.header #logo {
		display:block;
		font-size:12px;
		height:85px;		
		overflow:hidden;
		float: left;
		width:229px;
		/*margin-left: 10px;*/
	}
	
/*-------------------------------------------------------------------
slideshow
-------------------------------------------------------------------*/

.caroussel { 
	width: 1000px;
	height: 553px;
	overflow: hidden;
	position: relative
}

#slideshow { 
	list-style-type: none;
	margin: 0;
	padding: 0;
	display: block;
	width: 1000px;
	height: 504px;
}

#slideshow .slide{ 
	position: absolute;
}

#slideshow .slide > a{ 
	text-decoration: none;
}

#slideshow .caption { 
	width: 369px;
	height: 157px;
	position: absolute;
	z-index: 50;
	color: #FFF;
	padding: 10px;
}

.slide-summary { max-height: 54px; overflow: hidden; margin: 0;}

#slideshow .left { 
	top: 269px;
	left:20px;
}

#slideshow .right { 
	top: 269px;
	left: 577px;
}

#slideshow .red { 
	background-color: rgb( 159, 47, 39);
	background-color: rgba( 159, 47, 39, 0.8);
}

#slideshow .black { 
	background-color: rgb( 26, 23, 28);
	background-color: rgba( 26, 23, 28, 0.8);
}

.carousel-nav {
	position: absolute;
	z-index: 10;
	top: 269px;
	left: 967px;
	width: 33px;
	height: 177px;
}

.carousel-nav ul{
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.carousel-nav li a{
	display: block;
	width: 33px;
	height: 88px;
	text-indent: -999em;
	margin-bottom: 1px;
	background-color: rgb (26, 23, 28);
	
}

.carousel-nav li a.next{
	background: #000000 url(../images/arrow_right.png) center center no-repeat;
	background: rgba(26, 23, 28, 0.8) url(../images/arrow_right.png) center center no-repeat;
}

.carousel-nav li a.prev{
	background: #000000 url(../images/arrow_LEFT.png) center center no-repeat;
	background: rgba(26, 23, 28, 0.8) url(../images/arrow_left.png) center center no-repeat;
}

.carousel-nav li a:hover{
	background-color: #000000;
}

.pager-caroussel{ 
	height: 48px;
	width: 100%;
	clear: both;
	float: left;
	overflow: hidden;
	position: relative;
}

.pager {
	List-style-type: none;
	margin: 0;
	padding: 0;
	clear: both;
	float: left;
	padding: 20px;
	position: relative;
	left: 50%;
}

.pager li{
	display: block;
	float: left;
	margin-right: 5px;
	position: relative;
	right: 50%;
}

.pager li a{
	display: block;
	width: 37px;
	height: 5px;
	background-color: white;
	text-indent: -999em;
}

.pager li a:hover,
.pager .activeSlide a{
	background-color: #d2322a;
}


/*-------------------------------------------------------------------
footer
-------------------------------------------------------------------*/
#footer { 
	width: 100%;
	background-color: white;
	clear: both;
}
	
#footer .container { 
	width: 960px;
	margin: 0 auto;
	background-color: #FFF;
}

.sitemap { padding: 40px 0;}

.sitemap ul { 
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.sitemap .column  { margin-bottom: 20px;}

.sitemap .column:nth-child(5) { clear: both; float: left;}
.sitemap .last { clear: both; float: left;}

.sitemap h3 a { color: #1a171c;}

.sitemap a { 
    display: block;
    width: 220px;
    color: #999999; 
    cursor: pointer;
    }   

.socialmedia-bar {
	width: 100%;
	background-color: white;
	clear: both;
	border-top: 1px solid #f1f1f1;
}

.socialmedia-bar .container {
	width: 960px;
	margin: 0 auto;
	padding: 20px 0 0 0;
}

.socialmedia-bar ul li {
    list-style-type: none; 
	float: left; 
	margin-right: 7px; 
	line-height: 26px; 
	font-weight: bold;
}

.socialmedia-bar li a { 
	display: block;
	width:26px;
	height:26px;
	text-indent: -999em;
}

.facebook a{ background: url(../images/icon_facebook.jpg) top left no-repeat;}
.twitter a{ background: url(../images/icon_twitter.jpg) top left no-repeat;}

.bar-fixed { 
    width: 40px;
    height: 73px;
    position: absolute;
    border: 0;
    left: -40px;
	top: 553px;
    background-color: #e3e3e3;	
}

.bar-fixed ul{ 
   margin: 0;
   padding: 7px;
   list-style-type: none;
}

.bar-fixed ul li{ 
   margin: 0 0 7px 0;
}

/*-------------------------------------------------------------------
media list vacancies, news and agenda
-------------------------------------------------------------------*/

.media { list-style-type: none; margin-left: 0; }
.media li{ margin-bottom: 10px; }
.ie7 .media li { display: inline-block;}
.media h3,
.media a { 
    font-size: 13px;
    color: #1a171c;
    line-height: 18px;
}

.media .date,
.media .date dd { margin: 0; padding: 0;}

.media .date dd { color: #c2c2c2; font-size: 12px;}

.media-vacancies-list li a {
    display: block;
    color: #1a171c;
    padding: 0 0 0 13px;
    background: url(../images/arrow_list.png) transparent no-repeat 2px 0.65em;
    font-weight: bold;
}

/*-------------------------------------------------------------------
Login
-------------------------------------------------------------------*/
.two-columns-login .block { padding: 5px;}
.two-columns-login .last .block { border: 0; border-left: 1px dotted #000;; padding: 0; }
.two-columns-login .block .login { background-color: #f1f1f1; padding: 20px;} 
.two-columns-login .block .benefits { padding: 20px;} 
.two-columns-login .login img { vertical-align: middle;}
.two-columns.login a {
    text-decoration: underline;
    color: #9A9A9A;      
    }

.teaser-list {
	margin-left:0;
}

.teaser-list li{
	list-style-type: none;
	line-height: 50px;
	font-size: 14px;
}

.teaser-list li img {
	vertical-align: middle;
	margin-right: 15px;
}

/*-------------------------------------------------------------------
vcard
-------------------------------------------------------------------*/
.vcard {color: #999999; }
.vcard .org, 
.vcard .tel, 
.vcard .email,
.vcard .street-address { display: block;}

.vcard a {display: inline;}


/*-------------------------------------------------------------------
Generic 
-------------------------------------------------------------------*/
.teaser-link:link,
.teaser-link:visited {
	background: url(../images/arrow_list.png) 100% 50% no-repeat ;
	color:rgb(210,50,42);
	padding-right: 12px;
}

.teaser-link:focus,
.teaser-link:hover,
.teaser-link:active { text-decoration:none;}

.teaser-link:active { 
	position:relative;
	top:1px;
	outline: none;
	}
/*-------------------------------------------------------------------
misc
-------------------------------------------------------------------*/
.hidden { 
    margin-left: -999em !important;
    position: absolute;
}

.group {
  *zoom: 1;
}
.group:before,
.group:after {
  display: table;
  content: "";
}
.group:after {
  clear: both;
}

.error-message {
    display: none;
    width: 100%;
    background: #BF4140;
    border-color: #741716;
    border-style: solid;
    border-width: 1px 0 1px;
}

.error-message .container {
    width: 1000px;
    margin: 0 auto;
}

.error-message p {
	background:url(/images/quantoreportal/20091221_icon_warning.gif) no-repeat top left;
	color:#FFF;
	font-size:1.6em;
	margin:0.5em 0;
	padding:0.25em 0 0.25em 2em;
}