/*==============================================================================
	DEFAULT STYLES
==============================================================================*/

body {
	font-family: "trebuchet ms", tahoma, arial, sans-serif;
	font-size: 70%;
}

/* Font & Colors ============================================================ */

/* buttons menu . links . h1 . h2 allemaal klein kapitaal zie h1 */
/* list-items check */


h1:first-letter {
	font-size: 1.3em;
}

h1 {
	color: #00529B;
	text-transform: uppercase;
	font-size: 1em;
	letter-spacing: 0.5px;
	margin-top: 2em;
	margin-bottom:  0em;
}

h2:first-letter {
	font-size: 1.2em;
}

h2 {
	color: #7BAECF;
	text-transform: uppercase;
	font-size: 0.9em;
	letter-spacing: 0.5px;
}

h3 {
	color: #A4B1CD;
	text-transform: uppercase;
	font-size: 0.9em;
	letter-spacing: 0.5px;
}

p { 
	width: 410px; 
	margin-right: 0; 
	margin-bottom: 1em; 
	margin-left: 1em; 
}

a {
	color: #00529B;
	text-transform: uppercase;
	font-weight: bold;
}

a:hover {
	text-decoration: none;
}

a:first-letter {
	font-size: 1.2em;
}


a.a-top {
	padding-bottom: 10px;
	border-bottom: 1px solid #CAD3E8;
	display: block;
	clear: both;
}

ul, ol {
	margin: 0 0 0 15px;
	padding:0;
	width: 410px;
	margin-left: 1em;
}

li {
	list-style-type: none;
	padding-left: 10px;
	background-image: url(/images/layout/ul-block.gif);
	background-repeat: no-repeat;
	background-position: 0 6px;
}

li li {
	background-image: url(/images/layout/ul-arrow.gif);
}


.img {
	position: absolute;
	left: 670px;	
}

/* Header =================================================================== */

#header h3,
#header h4,
#header h5 {
	text-transform: uppercase;
	margin: 0;
	padding: 0;
}

#header h3 {
	color: #000000;
	font-size: 3em;
	text-align: left;
	margin-left: 300px;
}

#header h4 {
	color: #88A2CB;
	font-size: 3.5em;
	text-align: left;
	margin-left: 250px;
}

#header h5 {
	color: #A4A6A6;
	font-size: 2em;
	text-align: left;
	margin-left: 350px;
}

/* Header "reageren" =================================================================== */

body#reageren div#header h3,
body#reageren div#header h4,
body#reageren div#header h5 {
	text-transform: uppercase;
	margin: 0;
	padding: 0;
}

body#reageren div#header h3 {
	color: #000000;
	font-size: 3em;
	text-align: right;
	margin-right: 475px;
}

body#reageren div#header h4 {
	color: #88A2CB;
	font-size: 3.5em;
	text-align: left;
	margin-left: 250px;
	}

body#reageren div#header h5 {
	color: #A4A6A6;
	font-size: 2em;
	text-align: left;
	margin-left: 350px;
}

/* Menu ===================================================================== */

#menu ul .active ul a,
#menu ul a {
	color: #999999;
	text-decoration: none;
	font-weight: bold;
	font-size: 1.2em;
}

#menu ul ul .active a,
#menu ul .active a,
#menu ul ul a:hover,
#menu ul a:hover {
	color: #00529B;
	text-decoration: underline;
}

#menu ul .active ul a,
#menu ul ul a {
	font-size: 1.1em;
}

#menu address {
	padding: 12px 0 0 50px;
	font-style: normal;
	color: #999999;
	clear: both;
}

#menu address a {
	text-transform: lowercase;
	font-weight: normal;
	color: #999999;
	text-decoration: none;
}

#menu address a:first-letter {
	font-size: 1em;
}

#menu address a:hover {
	text-decoration: underline;
}

#menu {
	background-image: url(/images/layout/bg-menu.gif);	
	background-repeat: no-repeat;
	position: absolute;
	left: 80px;
	top: 190px;
	height: 135px;
	width: 900px;
	z-index: 99;
}

#menu ul {
	margin: 20px 10px;
	padding: 0;
	width: 1000px;
}

#menu ul ul {
	position: absolute;
	top: 20px;
	left: 50px;
}

#menu li {
	list-style-type: none;
	float: left;
	border-left: 1px solid #999999;
	padding: 0 10px;
	background: none;
}

#menu a {
	display: block;
}

#menu li.active li {
	padding: 0 10px;
}

#menu .item02-1,
#menu .item03-1,
#menu .item01 {
	border: 0;
}

#linkedin {
	position: relative;
	background-image: url(/images/layout/logo-linkedin.gif); 
	width: 156px;
	height: 22px;
	margin: -40px 0 0 298px;
}

#linkedin span {
	display: none;
}

/*==============================================================================
	LAYOUT STYLES
==============================================================================*/

body {
	margin: 0;
	padding: 0;
}

#container {
	position: relative;
	width: 990px;
	margin: 0 auto;
	padding-bottom: 20px;
}

/* Logo ===================================================================== */

#logo /* bring it to the front */ {
	z-index: 1;
	position: relative;
}

#logo a {
	display: block;
	width: 199px;
	height: 71px;
	background-image: url(/images/layout/logo-kessels.gif);
}

#logo span {
	display: none;
}

/* Header =================================================================== */

#header {
	position: absolute;
	top: 15px;
	width: 990px;
}

/* Content ================================================================== */

#main-content /* main-content */ {
	background-image: url(/images/layout/bg-content.gif);	
	background-position: 100px 200px;
	background-repeat: no-repeat;
	background-color: #EAEEF7;
	margin-left: 200px;
	margin-top: 110px;
}

.content-header  /* content-header */ {
	background-image: url(/images/layout/bg-content-header.gif);	
	background-repeat: no-repeat;
}

.content-footer {
	background-image: url(/images/layout/bg-content-footer.gif);	
	background-repeat: no-repeat;
	background-position: 0 100%;
}

.content {
	width: 600px;
	padding: 140px 0 100px 30px;

}

/* Home ===================================================================== */

#section-home #logo {
	visibility: hidden;
}

#section-home #header {
	background: url(/images/layout/logo-home-kessels.gif) 80px 0 no-repeat;
}

#section-home #header h3,
#section-home #header h4,
#section-home #header h5 {
	letter-spacing: 0.2em;
}

#section-home #header h3 {
	text-align: left;
	margin: 0 0 0 150px;
}

#section-home #header h4 {
	margin: 0 0 0 45px;
	text-align: left;
}

#section-home #header h5 {
	margin: 0 0 0 155px;
}

/* Portfolio intro ========================================================== */

#intro {
	border-bottom: 1px solid #CAD3E8;
}

#intro p {
	margin: 1em 0 0 0;
	padding-bottom: 10px;
}

/* Profiel reflecties =============================================================== */

#profiel {
	width: 191px; /* breedte van de afbeelding */
	position: absolute;
	top: 300px;
	left: 0;
	background: url(/images/layout/bg-aankeilers.gif); /* achtergrond 1500px lang zorg ervoor dat de bovenkant een ronding heeft en de lijnen tot onderaan */
	padding-top: 13px;
*	padding-top: 40px;
	z-index: 1;
}

.profiel {
	padding: 0 13px; /* zorgt voor de ruimte tussen de blauwe lijn en tekst */
}

.profiel p {
	margin: 1em 0 0 0px;
	width: auto;
	padding-bottom: 10px;
}

.profiel hr {
	margin-top: 15px;
	width: 60%;
	position: relative;
	left: 0;
	height: 1px;
	border: 0;
	border-bottom: 1px solid #CAD3E8;
}

/* footer zorgt ervoor dat de ronding aan de onderkant wordt afgesloten */
#profiel-footer {
	background: url(/images/layout/bg-aankeilers-footer.gif);
	height: 42px;
}

/* instellingen pasfoto bij profiel */
.post p {
	margin: 0em 0 0 00px;
	width: auto;
	padding-bottom: 10px;
}

p.img-profiel a {
	display: block;
}

.img-profiel img {
	float: centre;
	margin: 0;
	display: block;
	padding-bottom: 0px;
	margin-left: 2em;
	margin-top: 0em;
}

/* Reflecties =============================================================== */

.post p {
	margin: 1em 0 0 00px;
	width: auto;
	padding-bottom: 10px;
}

p.img-reflecties a {
	display: block;
}

.post .img-reflecties {
	float: right;
	margin: 0;
}

.post .img-reflecties img {
	display: block;
	padding-bottom: 20px;
	margin-left: 2em;
	margin-top: 1em;
}

/* Portfolio ================================================================ */

.portfolio p,
.portfolio ul {
	margin: 1em 0 0 120px;
	width: auto;
}

p.img-portfolio a {
	display: block;
}

.portfolio .img-portfolio {
	float: left;
	margin: 0;
}

.portfolio .img-portfolio img {
	display: block;
	padding-bottom: 5px;
	margin-top: 1em;
}

/* Portfolio - flash ======================================================== */

body.flash {
	background: #404040 url(/images/layout/bg-portfolio-flash.gif) 50% 0 no-repeat;
}

body.flash .back {
	display: block;
	color: #fff;
}

body.beschuitje {
	background: #666666 url(/images/layout/bg-beschuitje-eten.gif) 50% 0 no-repeat;
}

body.beschuitje .back {
	display: block;
	color: #fff;
}

/* Ankeilers =============================================================== */

#ankeilers {
/*	border: 2px solid red;*/
	width: 191px; /* breedte van de afbeelding */
	position: absolute;
	top: 300px;
	left: 0;
	background: url(/images/layout/bg-aankeilers.gif); /* achtergrond 1500px lang zorg ervoor dat de bovenkant een ronding heeft en de lijnen tot onderaan */
	padding-top: 13px;
*	padding-top: 40px;
	z-index: 1;
}

.ankeiler {
	padding: 0 13px; /* zorgt voor de ruimte tussen de blauwe lijn en tekst */
}

.ankeiler p {
	margin: 1em 0 0 0px;
	width: auto;
	padding-bottom: 10px;
}

.ankeiler hr {
	margin-top: 15px;
	width: 60%;
	position: relative;
	left: 0;
	height: 1px;
	border: 0;
	border-bottom: 1px solid #CAD3E8;
}

/* footer zorgt ervoor dat de ronding aan de onderkant wordt afgesloten */
#ankeilers-footer {
	background: url(/images/layout/bg-aankeilers-footer.gif);
	height: 42px;
}


/* Definities =============================================================== */

.definitie p {
	margin: 1em 0 0 00px;
	width: auto;
	padding-bottom: 10px;
}

p.img-definities a {
	display: block;
}

.definitie .img-definities {
	float: right;
	margin: 0;
}

.definitie .img-definties img {
	display: block;
	padding-bottom: 20px;
	margin-left: 2em;
	margin-top: 1em;
}

#wpstats	{
	border: 1px solid red;
}

img {
	border: 0;
}

div.twitterTweet p a {
	text-transform: none;
	color: black;
	text-decoration: none;
	font-weight: normal;
}

div.twitterTweet h1 a {
  text-decoration: none;
}

h1#twitterLink {
	padding: 0 13px;
}