/*
Theme Name: Kipdev theme by Elephant
Theme URI: http://kipdev.nl
Description: Nieuw thema voor de site.
Version: 1.0
Author: Elephant Creative Studio
Author URI: http://elephantcs.nl
*/

@import url("reset.css");


/* Global styles */

body {
	background: #0072bc url("images/body-bg.png") center 0 fixed no-repeat;
	font-family: verdana, sans-serif;
	font-size: 0.88em;
	margin: 0;
	color: #494744;
}

h1, h2, h3 {
	color: #0072bc;
}

h1 {
	margin: 0 0 25px 0;
}

a {
	color: #0072bc;
	text-decoration: none;
} 

a:hover {
	color: #000;
}

a img {
	border: 0;
}


/* Global classes */


.box-top {
	height: 42px;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

.box-bottom {
	height: 42px;
	width: 100%;
	position: absolute;
	left: 0;
	bottom: 0;
}

.box-body {
	position: relative;
	z-index: 2;
	padding: 27px 27px 27px 27px;
	font-size: 1em;
}

.wide-separator {
	width: 684px;
	height: 16px;
	float: left;
	background: url("images/wide-separator-bg.png") 0 7px repeat-x;
	clear: both;
	margin: 0 0 25px -20px;
}

.alignleft {
	float: left;
}

.alignright {
	float: right;
}

.more-link {
	font-style: italic;
}

.post .entry {
	clear: both;
}

.post .wide-separator {
	margin-top: 40px;
	margin-bottom: 18px;
}

.post h1 {
	font-size: 1.01em;
	margin: 0;
}


/* Main containers */

#relative-container {
	position: relative;
 	width: 700px; 
	margin: 0 auto;
	padding-top: 95px;
	left: 110px;
	overflow: hidden;
}

#fixed-container {
	position: fixed;
	left: 50%;
 	margin-left: -504px;
	width: 179px;
}


/* Sidebar */

#sidebar {
	width: 100%;
 	margin: 0 40px 0 45px;
}

#logo {
	width: 135px;
	height: 46px;
 	margin: 23px 22px 23px 22px;
}

#quote {
	font-style: italic;
	min-height: 125px;
}

#links {
	text-align: center;
	min-height: 125px;
	color: #0072bc;
	font-weight: bold;
	font-family: tahoma, verdana, sans-serif;
}

#links li {
	margin: 0 0 10px 0;
}

#links .box-body {
	padding-bottom: 10px;
}

#menu {
	overflow: hidden;	/* Fixes IE 7 background-position problem */
}

#menu .box-body {
	padding: 7px;
	font-weight: bold;
	font-family: tahoma, verdana, sans-serif;
}

#menu li {
	line-height: 34px;
 	padding: 0 0 0 41px;
	border-bottom: 1px solid #bcc8d2;
	border-top: 1px solid #fff;
}

#menu li:hover, #menu li.menu-li-hover {
	cursor: pointer;
	background: #fff;
}

#menu li.first, #menu li.page-item-135 {
	border-top: 0;
}

#menu li.last, #menu li.cat-item-13 {
	border-bottom: 0;
}

#menu li.current-cat, #menu li.current_page_item, #menu li.current-cat-parent,
#menu li.current-cat a, #menu li.current-cat-parent a, #menu li.current_page_item a {
	background: #fff;
	color: #000;
}

.sidebar-box {
	border: 1px solid #004676;
	margin-bottom: 29px;
	background:  url("images/sidebar-box-bg.png") repeat-y;
	position: relative;
	font-size: 0.9em;
	overflow: visible;
}

.sidebar-box ul, .sidebar-box li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sidebar-box h2 {
	margin: 0 0 10px 0;
}

.sidebar-box-top {
	background: url("images/sidebar-box-top.png") no-repeat;
}

.sidebar-box-bottom {
	background: url("images/sidebar-box-bottom.png") no-repeat;
}

.quote-box-top {
	background: url("images/quote-top.png") no-repeat;
	height: 48px;
}

.quote-box-bottom {
	background: url("images/quote-bottom.png") no-repeat;
	height: 48px;
}
	

/* Content area */

#content {
	background: #004676 url("images/content-bg.png") 0 0 repeat-y;
	border: 1px solid #004676;
	position: relative;
	width: 698px;
}

#content-body {
	min-height: 100px;
	overflow: hidden;
}

#content-top {
	background: url("images/content-top.png") no-repeat;
}

#content-bottom {
	background: url("images/content-bottom.png") no-repeat;
}

#intro {
	border: 1px solid #cedfe3;
	color: #555;
	background: #fff;
	font-size: 1.14em;
	position: relative;
	z-index: 2;
	padding: 34px 19px 30px 19px;
	margin-bottom: 30px;
}


/* Footer area */

#footer {
	height: 61px;
	color: #fff;
 	line-height: 61px;
	font-size: 0.78em;
	position: relative;
	margin-bottom: 30px;
}

#footer img {
	position: absolute;		/* IE 6 and 7 don't seem to like float: right; here... */
	top: 10px;
	right: 0;
}

#footer a {
	color: #fff;
}

#footer a:hover {
	color: #000;
}


/* Project category post-related classes */

.project-post {
	float: left;
	width: 300px;
	height: 380px;
	overflow: hidden;
	padding: 10px 10px 20px 10px;
	margin-bottom: 20px;
}

.project-post:hover, .project-post-hover {
	background: #deebee;
	border: 1px solid #c1cfd5;
	cursor: pointer;
	padding: 9px 9px 19px 9px;		/* Prevents lay-out from 'jumping' */
}

.project-post .project-thumb {
	width: 284px;
	height: 184px;
	padding: 8px;
	background: #fff;
	border: 1px solid #c0c8d3;
	margin: 0 auto 15px;
	display: block;
}

.project-post h2 {
	margin-bottom: 6px;
}


/* Homepage post-related classes */

.home-blog-post {
	border-bottom: 1px solid #bcc8d2;
	border-top: 1px solid #bcc8d2;
	overflow: visible;
	padding: 10px 0 10px 20px;
	font-size: 0.8em;
	width: 664px;
	margin: -1px 0 0 -20px;
	float: left;
}

.home-blog-post:hover, .home-blog-post-hover {
	background: #fff;
	cursor: pointer;
}

.home-blog-meta {
	color: #494744;
	font-size: 0.77em;
	width: 100px;
	float: left;
}

.home-blog-post h2 {
	float: left;
	width: 500px;
	margin: 0 0 0 10px;
}


/* Other categories post-related classes */

.blog-post {
 	clear: both;
	overflow: hidden;
	border-bottom: 1px solid #bcc8d2;
	margin-bottom: 26px;
	padding-bottom: 26px;
	width: 100%;
}

.blog-post-meta {
	font-variant: small-caps;
	background: url("images/metadata-bg.png") no-repeat;
	height: 53px;
	font-size: 8pt;
	overflow: hidden;
	line-height: 53px;
}

.blog-post .entry, .blog-post-meta {
	float: left;
	width: 454px;
	clear: none;
}


/* Thumbnails */

.blog-thumb {
	float: left;
	width: 156px;
	height: 156px;
	padding: 6px;
	background: #fff;
	border: 1px solid #bcc8d2;
	margin-right: 16px;
}

.size-thumbnail {
	width: 160px;
	height: 120px;
	padding: 6px;
	background: #fff;
	border: 1px solid #bcc8d2;
	margin: 6px;
}	


/* Comments */

li.comment {
	background: #fff;
	border: 1px solid #bcc8d2;
 	width: 602px;
	overflow: auto;
	padding: 20px;
	margin: -1px 0 0 0;
}

.commentlist {
	width: 644px;
	margin: 20px 0 30px 0;
	padding: 0;
	list-style: none;
}

.comment-text {
	float: left;
	word-wrap: break-word;
	width: 454px;
	margin-left: 20px;
	font-size: 0.91em;
}

.comment-text p {
	margin: 0;
	padding: 0;
}

.comment-author {
	float: left;
	text-align: center;
	color: #0072bc;
	width: 94px;
	word-wrap: break-word;
	font-size: 0.78em;
}

.comment-author cite {
	text-transform: uppercase;
	font-style: normal;
	font-weight: bold;
}

.avatar {
	width: 80px;
	height: 80px;
	background: #e7f3f6;
	border: 1px solid #c6d4d9;
	padding: 6px;
	display: block;
	margin-bottom: 10px;
}

#respond form {
	text-transform: uppercase;
	font-size: 0.78em;
}

#respond .alignleft, #respond .alignright {
	width: 49%;
}

#respond label {
	width: 100%;
	display: block;
	font-size: 1em;
	margin: 25px 0 10px 0;
}

#respond textarea {
	width: 100%;
}

#respond textarea, #respond input {
	border: 1px solid #bcc8d2;
	color: #494744;
	padding: 3px 2px 3px 2px;
}

#respond input {
	width: 260px;
}

#respond #submit {
	border: 0;
	margin-top: 20px;
	float: right;
	padding: 0;
	width: 80px;
	height: 28px;
}


/* Tabbar */

ul.tabbar {
	width: 646px;
	height: 27px;
	background: url("images/tabs-bg.png") 0 bottom no-repeat;
	color: #0072bc;
	font-size: 0.78em;
	position: relative;
	margin: 0 0 24px 0;
	padding: 0;
	list-style: none;
}

ul.tabbar li {
	float: left;
	height: 10px;
	line-height: 10px;
	padding: 10px 10px 6px 10px;
	margin-left: 10px;
	border-left: 1px solid #c1cfd5;
	border-right: 1px solid #c1cfd5;
	border-top: 1px solid #c1cfd5;
	-moz-border-radius-topleft: 6px 6px;
	-moz-border-radius-topright: 6px 6px;
	-webkit-border-top-left-radius: 6px 6px;
	-webkit-border-top-right-radius: 6px 6px;
}

ul.tabbar li:hover, ul.tabbar .tab-hover {
	background: #c1cfd5;
	cursor: pointer;
}

ul.tabbar li.current-cat {
	background: #e6f2f5 url("images/active-tab-bg.png") repeat-x;
}