/*
 * CSS for Crowd Surfing
 * Author: Jeroen Dijkstra | Crowd Surfing 2010
 */

/* GENERAL CSS RESET */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
body { line-height: 1; color: black; background: white; }
:focus { outline: 0; } /* Outline for input fields in Webkit */
/* END GENERAL CSS RESET */

/* GENERAL STYLES */
html
{
	font-family: Arial, Sans-serif;
	font-size: 15px;
}

html, body, div#Container
{
	width: 100%;
}

body
{
	background-color: #FFFFFF;
	color: white;
	margin: 0;
	text-align: center;
}

abbr
{
	border-bottom: 	1px dotted #CCCCCC;
	cursor: 		help;
}

div#Container
{
	margin: 25px auto;
	text-align: left;
	width: 957px;
}

div#Content
{
	background-color: #FFFFFF;
	color: #808080;
	margin-bottom: 25px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
	width: 900px;
}

	div#Content h2
	{
		font-size: 		24px;
		margin-bottom: 	0;
	}

	div#Content div#LeaderContent
	{
		color:			#909090;
		font-style: 	italic;
		line-height:	1.6;
		margin-bottom:	20px;
	}


	/* BLOG */
	div#Content div.AuthorInformation
	{

	}

		div#Content div.AuthorInformation img.AuthorImage
		{
			float:			left;
		}

	div#Content div.Comment
	{
		line-height:	1.5;
		margin-bottom: 	25px;
		padding:		2px 5px;
	}

	div#Content div.Comment.Even
	{
		background-color:	#f5f5f5;
	}

	div#Content div.Comment.Odd
	{
		background-color:	#fcfcfc;
	}

		div#Content div.Comment span.CommentMessage
		{
			display: 		block;
			margin-bottom:	10px;
		}

	div#Content div.CommentMessage
	{
		line-height:	1.5;
		margin-bottom: 	25px;
	}

	div#Content div#Medewerkers div.AuthorInformation
	{
		border:		none;
	}

		div#Content div#Medewerkers div.AuthorInformation img.AuthorImage
		{
			margin-top:		32px;
			padding-bottom: 0;
			width:			185px;
		}

	div#Content div.NewsItem
	{
		border-bottom:		1px dotted #808080;
		line-height:		1.5;
		margin-bottom:		30px;
	}

		div#Content div.NewsItem h2
		{
			font-size: 		26px;
			margin-bottom: 	10px;
		}

		div#Content div.NewsItem span.Subtitle
		{
			color:				#909090;
			display:			block;
			font-size: 			13px;
			margin-bottom:		15px;
		}

		div#Content div#NewsContent
		{
			margin-bottom: 		15px;
		}

		div#Content div.NewsItem div.ImageContainer
		{
			float: 				right;
			padding-left: 		10px;
			padding-bottom: 	5px;
		}

			div#Content div.NewsItem div.ImageContainer img
			{
				border: 				1px solid #808080;

				-moz-box-shadow: 		1px 1px 4px #CCCCCC;
  				-webkit-box-shadow: 	1px 1px 4px #CCCCCC;
          		box-shadow: 			1px 1px 4px #CCCCCC;
			}

			div#Content div.NewsItem div.PostedIn
			{
				line-height: 			1;
				margin-top: 			20px;
			}

			div#Content div.TagsContainer
			{
				margin-bottom: 		45px;
			}

				div#Content div.PostedIn label,
				div#Content div.PostedIn a,
				div#Content div.TagsContainer label,
				div#Content div.TagsContainer a
				{
					font-size: 		11px;
    				font-style: 	italic;
				}

			div#Content div.NewsItem div.TagsContainer
			{
				line-height: 			1;
				margin-bottom:			10px;
			}

				div#Content div.NewsItem div.PostedIn label,
				div#Content div.NewsItem div.PostedIn a,
				div#Content div.NewsItem div.TagsContainer label,
				div#Content div.NewsItem div.TagsContainer a
				{
					font-size: 			11px;
					font-style: 		italic;
				}

	div#Content div.AuthorInformation
	{
		border-bottom: 	1px dotted #CCCCCC;
		border-top: 	1px dotted #CCCCCC;
		margin-bottom: 	30px;
		overflow: 		auto;
		padding-top: 	10px;
	}

		div#Content div.AuthorInformation h2
		{
			font-size: 		21px;
			margin-bottom: 	15px;
		}

		div#Content div.AuthorInformation img.AuthorImage
		{
			padding-bottom:	20px;
			padding-right: 	10px;
		}

		div#Content div.AuthorInformation p
		{
			margin-bottom: 		10px;
		}

	div#Content form#CommentForm
	{
		margin-bottom:		45px;
	}

		div#Content form#CommentForm h2
		{
			font-size: 		16px;
			font-weight: 	bold;
			margin-top: 	10px;
		}

		div#Content form#CommentForm p
		{
			font-style: 	italic;
		}

		div#Content form#CommentForm input,
		div#Content form#CommentForm textarea
		{
			font-family:		inherit;
			font-size:			inherit;
			width:				100%;
		}

			div#Content form#CommentForm input.Submit
			{
				margin-top:			10px;
				width:				auto;
			}

		div#Content form#CommentForm label
		{
			display:			block;
			line-height:		1.5;
			width:				200px;
		}

		div#Content form#CommentForm textarea
		{
			height:				65px;
		}

		div#BlogOptions
		{
			margin-bottom:  40px;
			margin-left: 	23px;
		}

			div#BlogOptions h2
			{
				font-size: 		16px;
				margin-bottom:	5px;
				margin-top: 	10px;
			}

	div#BlogOptions div#Categories,
	div#BlogOptions div#Archive,
	div#BlogOptions div#Follow
	{
		margin-bottom: 		20px;
	}

	div#BlogOptions div#Follow
	{
		line-height: 	1.2;
	}

	div#Content ul#ArchiveControls
	{
		margin: 	10px 0;
		overflow: 	auto;
	}

		div#Content ul#ArchiveControls li:first-child
		{
			float: 		left;
		}

		div#Content ul#ArchiveControls li
		{
			float: 				right;
			list-style-type: 	none;
		}

	div#Categories ul li
	{
		background-position: 	left center;
		background-repeat: 		no-repeat;
		margin-bottom: 			5px;
		padding-left: 			20px;
	}

	div#Categories ul li.CrowdSurfing
	{
		background-image: 	url('/Includes/Themes/CrowdSurfing/Images/Icons/icon_cs.jpg');
	}

	div#Categories ul li.Design
	{
		background-image: 	url('/Includes/Themes/CrowdSurfing/Images/Icons/icon_design.png');
	}

	div#Categories ul li.FrontEnd
	{
		background-image: 	url('/Includes/Themes/CrowdSurfing/Images/Icons/icon_css.png');
	}
	
	div#Categories ul li.Nieuws
	{
		background-image: 	url('/Includes/Themes/CrowdSurfing/Images/Icons/icon_news.jpg');
	}

	div#Categories ul li.Seo
	{
		background-image: 	url('/Includes/Themes/CrowdSurfing/Images/Icons/icon_seo.png');
	}

	div#Categories ul li.Techniek
	{
		background-image: 	url('/Includes/Themes/CrowdSurfing/Images/Icons/icon_techology.png');
	}

		div#Categories ul li a
		{
			line-height: 	16px;
			padding-top: 	1px;
		}

	div#FollowSocial ul
	{
		margin-bottom:		10px;
		overflow: 			auto;
	}

		div#FollowSocial ul li
		{
			float: 			left;
			padding-right: 	5px;
		}

	/* END BLOG */

h1
{
	color: #FFAE00;
	font-size: 26px;
	font-weight: normal;
	line-height: 1.1;
}

h2
{
	color: 				#808080;
	font-size: 			36px;
	font-weight: 		normal;
	margin-bottom: 		5px;
	line-height:		1;
	margin-bottom:		25px;
}

h3
{
	color: #808080;
	font-size: 21px;
	font-weight: bold;
	margin: 5px 0;
	margin-bottom: 25px;
}

a
{
	color: #FFAE00;
	text-decoration: none;
}

a:hover
{
	text-decoration: underline;
}

a:visited
{
	color: #FFAE00;
}

p
{
	color: #808080;
	line-height: 1.3;
	margin-bottom: 25px;
	word-spacing: 3px;
}

strong
{
	font-weight: bold;
}

em
{
	color: #FFAE00;
	font-style: italic;
}

li
{
	list-style-type: none;
}

textarea
{
	overflow: auto; /* No scrollbars in IE when there is enough room */
}

blockquote
{
	border-left: 2px solid #808080;
	margin: 5px 0 15px 15px;
	padding-left: 15px;
}

blockquote,
blockquote p
{
	font-size: 16px;
	font-style: italic;
	text-align: justify;
}

blockquote p:before
{
	/* content doesn't work in IE6/7 and IE8 as IE7 */
	content: open-quote; /* open-quote doesn't work in Webkit and Opera gives ugly quotes */
	font-family: Georgia, Arial, Sans-serif;
	font-size: 30px;
	line-height: 1;
}

blockquote p:after
{
	/* content doesn't work in IE6/7 and IE8 as IE7 */
	content: close-quote; /* close-quote doesn't work in Webkit and Opera gives ugly quotes */
	font-family: Georgia, Arial, Sans-serif;
	font-size: 30px;
	line-height: 1;
}

::-moz-selection 	{ background-color: #FFAE00; color: #000000; }
::selection			{ background-color: #FFAE00; color: #000000; }
a::-moz-selection 	{ color: #808080; }
a::selection 		{ color: #808080; }

div#Content img#NoShadow,
div#Content img.NoShadow /* Forward compatible? */
{
	box-shadow: none;
	-moz-box-shadow: none;
	-webkit-box-shadow: none;
}

	/* GENERAL STYLES CONTENT */
	div#Content ol,
	div#Content ul
	{
		line-height: 1.3;
		list-style-position: inside; /* To make it show up in IE */
		margin-bottom: 10px;
		margin-left: 15px;
	}

	div#Content ol li
	{
		list-style-type: decimal;
	}

	div#Content ul li
	{
		list-style-type: disc;
	}

	/* END GENERAL STYLES CONTENT */

/* END GENERAL STYLES */

/* HEADER */
div#Header
{
	border-bottom: 2px solid #999999;
	padding-bottom: 15px;
	overflow: hidden;
}

	div#Header a.Logo
	{
		float: left;
		margin-right: 38px;
	}
		div#Header a.Logo img
		{
			display: block;
			height: 255px;
			width: 413px;
		}

	div#Header h1 span
	{
		display: block;
	}

	div#Header div.ContactDetails
	{
		float: left;
		margin-bottom: 78px;
		margin-top: 18px;
		width: 470px;
	}

		div#Header div.ContactDetails p
		{
			display: block;
			line-height: 1.3;
			margin: 0;
		}

/* END HEADER */

/* NAVIGATION */
div#Navigation
{
	background-image: url('/Includes/Themes/CrowdSurfing/Images/PijlSingleKlein.png');
	background-repeat: no-repeat;
	background-position: left center;
	color: #CCCCCC;
	float: right;
	margin-bottom: 20px;
	margin-top: 10px;
	line-height: 1.2;
	padding-left: 10px;
	width: 515px;
}

	div#Navigation a
	{
		color: #CCCCCC;
		margin: 0 10px;
	}

/* END NAVIGATION */

/* BLOCKS */
div#Blocks
{
	float: left;
	margin-right: 18px;
	overflow: hidden;
	padding-left: 20px;
	width: 413px;
}

	div#Blocks div.Left,
	div#Blocks div.Right
	{
		float: left;
		width: 188px;
	}

	div#BlockWrapper
	{
		height: 118px;
		width: 188px;
	}

	div#Blocks div.Block
	{
		background-image: url('/Includes/Themes/CrowdSurfing/Images/MenuBox.jpg');
		background-position: center top;
		height: 118px;
		margin-bottom: 10px;
		position: relative;
		width: 188px;
	}

	div#Blocks div.Block:hover,
	div#Blocks div.Active
	{
		background-position: center bottom;
	}

		div#Blocks div.Block:hover a
		{
			color: #FFFFFF;
		}

		div#Blocks div.Block:hover a:hover
		{
			color: #666666;
		}

		div#Blocks div.Block a
		{
			color: #666666;
			display: block;
			font-size: 17px;
			left: 23px;
			line-height: 1.1em;
			margin-bottom: 4px;
			position: relative;
			top: 18px;
			width: 145px;
		}

		div#Blocks div.Block a:hover
		{
			color: #FFFFFF;
			text-decoration: none;
		}

		div#Blocks div.Active a
		{
			color: #FFFFFF;
		}

		div#Blocks div.Active a:hover
		{
			color: #666666;
		}

			div#Blocks div.Block a.SubItem
			{
				font-size: 15px;
			}

/* END BLOCKS */

/* CONTENT */
div#Content
{
	float: left;
	width: 480px;
}

	div#Content a:active
	{
		left: 1px;
		position: relative;
		top: 1px;
	}

	div#Content p img
	{
		box-shadow: 3px 3px 5px #CCCCCC;
		-moz-box-shadow: 3px 3px 5px #CCCCCC;
		-webkit-box-shadow: 3px 3px 5px #CCCCCC;
	}

	div#Content div#PageNavigation
	{
		margin-bottom: 10px;
		line-height: 29px;
		height: 29px;
		width: 490px;
	}

	div#Content a.PreviousPage
	{
		background-image: url('/Includes/Themes/CrowdSurfing/Images/PijlDubbelKlein.jpg');
		background-position: left top;
		background-repeat: no-repeat;
		float: left;
		height: 17px;
		line-height: 1.1;
		margin-top: 6px;
		padding-left: 25px;
	}

	div#Content a.PreviousPage:hover
	{
		background-position: left bottom;
	}

	div#Content a.NextPage
	{
		background-image: url('/Includes/Themes/CrowdSurfing/Images/PijlDubbel.jpg');
		background-position: left top;
		background-repeat: no-repeat;
		display: block;
		float: right;
		height: 29px;
		width: 33px;
	}

	div#Content a.NextPage:hover
	{
		background-position: left bottom;
	}


div#SlideContainer
{
	height: 200px;
	overflow: hidden;
	width: 480px;
}

	div#SlideContainer div.SlideBox
	{
		background-image: url('/Includes/Themes/CrowdSurfing/Images/HomeSlides/ProConference.jpg');
		background-position: left top;
		background-repeat: no-repeat;
		height: 154px;
		margin: 10px 0 15px 0;
		width: 448px;
	}

		div#SlideContainer div.SlideBox img
		{
			height: 154px;
			width: 448px;
		}

div#SlideBoxBig
{
	background-image: url('/Includes/Themes/CrowdSurfing/Images/Portfolio/Silversnake.jpg');
	background-position: left top;
	background-repeat: no-repeat;
	height: 240px;
	margin: 10px 0 40px 0;
	width: 450px;
}

	div#SlideBoxBig img
	{
		height: 281px;
		width: 470px;
	}

/* END CONTENT */

/* CAROUSELS */
div#Content ul.Carousel
{
	margin-left: 0;
}

	div#Content ul.Carousel li
	{
		list-style-type: none;
		height: 128px;
		margin-right: 4px;
	}

	ul.Carousel li a
	{
		color: #808080;;
		display: block;
		font-size: 17px;
		height: 124px;
		position: relative;
		width: 228px;
	}

	ul.Carousel li a:hover span
	{
		cursor: pointer;
		text-indent: 0;
	}

		ul.Carousel li a span
		{
			display: inline-block;
			position: absolute;
			text-align: center;
			text-indent: -9999px;
			text-shadow: 1px 1px 3px #CCCCCC;
			top: 43px;
			width: 220px;
		}

	/* No JavaScript */
	div#Content ul.NoJs li
	{
		float: left;
	}

		div#Content ul.NoJs li span
		{
			color: #FFFFFF;
			text-shadow: 0 0 5px #000000;
		}

	/* End No JavaScript */

/* END CAROUSELS */

/* FOOTER */
div#Footer
{
	clear: both; /* Just for IE6 */
	color: #999999;
	font-size: 11px;
	margin-bottom: 20px;
	padding: 0 0 5px 5px;
}

	div#Footer p
	{
		color: #FFAE00;
		font-size: 14px;
		margin-bottom: 2px;
		text-align: center;
		word-spacing: 4px; /* Safari on the Mac makes this just a little bigger so watch out! */
	}

	div#Footer a
	{
		color: #999999;
	}

	div#Footer div.FooterBottom
	{
		border-top: 2px solid #999999;
	}

 /* END FOOTER */