/*
Theme Name: KASK Dark theme
Theme URI: http://kask.be/
Description: A theme made for KASK</a>.
Version: 1.6
Author: Harold Vergucht, Ine Dehandschutter
Author URI: http://kask.be/
Tags: copyrighted

*/

/* You may adapt elements of this CSS in your own projects, but the unique combination of images, colors, sizes, typography, and positioning ('the design') is copyright protected by kask.be and Pixelman */

/* CSS tested on:

	MAC OSX 
	- Safari 2.0.4: OK
	- IE 5.2.3: Not supported
	- Firefox(Mozilla 5) 1.5 / 2.0: OK

	MAC OS9
	- IE 5.0: Not supported

	PC WIN98
	- IE 5.0: Not supported

	PC WINXP WIN2000
	- IE 6.0: OK
	- IE 7.0: OK
	- Firefox(Mozilla 5) 1.5 / 2.0: OK


*/


/********** png transp fix ***********/

* { behavior: url(iepngfix.htc)}


/*********************** basics ***********************/

body {
	margin: 0;
	padding: 0;
	color: #000;
	/*font-family:Verdana, Arial, sans-serif;*/
	font-family: 'Lucida Grande', Geneva, Arial, Verdana, sans-serif;
	font-size: 10px;
	background-color: #FFF;
	line-height: 13px;
	}
		
	
html, dl, div, img, swf, form { 
	margin: 0; 
	padding: 0;
	}
	
a {
	text-decoration: underline;
	color: #999;
	}

a:hover {
	text-decoration: underline;
	color: #000;
	}	

#site { /* whole site */
	}


/*********************** header elements ***********************/

#headerbg {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background-color: #ff7f00;
	background-color: #44c3e3;
	background-color: #5cd700;
	height: 30px;
	width: 100%;
	}

#header {
	position: relative;
	margin: 0 auto 0 auto;
	padding: 0;
	width: 760px;
	background-color: #ff7f00;
	background-color: #44c3e3;
	background-color: #5cd700;
	height: 30px;
	}

	
#logokask {
	float: left;
	margin: 0 15px 0 0;
	padding: 0 0 0 0;
	width: 50px;
	height: 30px;
	background:  url(img/kasklogo_portfolio_neg.png) transparent 0 0 no-repeat;
	/*display: none;*/
	}

#logokaskweek {
	float: left;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	width: 105px;
	height: 30px;
	background: url(img/kaskweeklogo_neg.png) transparent 0 0 no-repeat;
	/*display: none;*/
	}


	
#header h1{
	float: right;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	font-size: 12px;
	color: #fff;
	text-transform: uppercase;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: bold;
	clear: none;
	word-spacing: 0.1em;
	letter-spacing: 1px;
	line-height: 30px;
	}	

#header h1 a {
	color: #fff;
	text-decoration: none;
	}	

#header h1 a:hover {
	color: #000;
	text-decoration: none;
	}	

	
/*********************** banner elements ***********************/

body#open #bannerbg {
	position: absolute;
	top: 30px;
	left: 0;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background-color: #000;
	height: 450px;
	width: 100%;
	}

body#open #banner {
	position: relative;
	margin: 0 auto 0 auto;
	padding: 0;
	width: 760px;
	background-color: #000;
	height: 450px;
	}

body#open #slideshow {
	position: absolute;
	/*bottom: 0;*/
	left: 0;
	top: 0;
	float: left;
	margin: 0 0 0 0;
	padding: 0;
	width: 760px;
	height: 450px;
	}


body#open #bannerbg2 {
	position: absolute;
	top: 30px;
	left: 0;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background-color: #000;
	height: 450px;
	width: 100%;
	}

body#open #banner2 {
	position: relative;
	margin: 0 auto 0 auto;
	padding: 0;
	width: 760px;
	background-color: #000;
	height: 450px;
	}

body#open #slideshow2 {
	position: absolute;
	/*bottom: 0;*/
	left: 0;
	top: 0;
	float: left;
	margin: 0 0 0 0;
	padding: 0;
	width: 760px;
	height: 450px;
	}

body#closed #bannerbg {
	display: none;
	}

body#closed #banner {
	display: none;
	}

body#closed #slideshow {
	display: none;
	}


/*********************** nav elements ***********************/

body#open #navbg {
	position: absolute;
	top: 480px;
	left: 0;
	margin: 5px 0 0 0;
	padding: 0 0 0 0;
	background-color: #000;
	height: 30px;
	width: 50%;
	}

body#closed #navbg {
	position: absolute;
	top: 35px;
	left: 0;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	background-color: #000;
	height: 30px;
	width: 50%;
	}


#nav {
	position: relative;
	top: 5px;
	left: -10px;
	margin: 0 auto 0 auto;
	padding: 0 0 0 0;
	background-color: #fff;
	height: 30px;
	width: 760px;
	}

#nav ul {
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	list-style: none;
	font-size: 10px;
	color: #828282;
	text-transform: uppercase;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: bold;
	
	
	
	}
	
#nav li {
	float: left;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	list-style: none;
	text-transform: uppercase;
	}
	
#nav li a {
	float: left;
	margin: 0 0 0 0;
	padding: 0 10px 0 10px;
	height: 30px;
	background-color: transparent;
	line-height: 30px;
	text-decoration: none;
	}
	
#nav li a:hover {
	float: left;
	height: 30px;
	background-color: #000;
	background-color: transparent;
	line-height: 30px;
	color: #000;
	text-decoration: none;
	}							

#nav .current_page_item {
	float: left;
	height: 30px;
	background-color: #000;
	line-height: 30px;
	color: #fff;
	text-decoration: none;
	}							


#nav .current_page_item a, #nav .current a:hover  {
	color: #fff;
	}							

#nav .over {
	float: left;
	height: 30px;
	background-color: #000;
	line-height: 30px;
	color: #828282;
	text-decoration: none;
	}							


#nav .over a:hover  {
	color: #fff;
	}							


/*********************** form  nav elements ***********************/

#nav form {
	position: relative;
	float: left;
	margin: 0;
	padding: 6px 0 0 0;
	width: 125px;
	height: 20px;
	z-index: 1;
	
	}

input {
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	display: inline;
	font-size: 10px;
	color: #828282;
	text-transform: uppercase;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: bold;
	line-height: 13px;
	}
	
#search {
	position: relative;
	float: left;
	margin: 0 0 0 0;
	padding: 0;
	width: 100px;
	height: 15px;
	}

#searchbut {
	float: right;
	margin: 0 0 0 0;
	padding: 0;
	}


/*********************** content elements ***********************/

#content {
	position: relative;
	margin: 30px auto 0 auto;
	padding: 0;
	width: 760px;
	background-color: #fff;
	}

#contentleft {
	position: relative;
	float: left;
	margin: 0 0 0 0;
	padding: 0;
	width: 505px;
	display: block;
	/*border: solid 1px #000;*/
	}

#contentright {
	position: relative;
	float: right;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	width: 230px;
	height: 500px;
	/*border: solid 1px #000;*/
	}

.article {
	position: relative;
	margin: 0 0 10px 0;
	padding: 0;
	position: relative;
	clear:both;
	border: solid 1px #fff;
}

p {
	position: relative;
	margin: 0 0 20px 0;
	padding: 0 0 0 0;
	font-size: 10px;
	line-height: 18px;
	color: #000;
	}


h1 {
	position: relative;
	margin: 0 0 5px 0;
	padding: 0 0 0 0;
	font-size: 13px;
	font-size: 25px;
	line-height: 35px;
	font-weight: bold;
	font-family: Helvetica, Arial, sans-serif;
	/*color: #44c3e3;*/
	color: #5cd700;
	text-transform: uppercase;
	clear: both;
	}

h1 a  {
	color: #5cd700;
	text-decoration: none;
	}

h1 a:hover {
	color: #000;
	text-decoration: none;
	}


h2 {
	position: relative;
	clear: both;
	margin: 10px 0 10px 0;
	padding: 0 0 0 0;
	font-size: 14px;
	line-height: 18px;
	font-weight: bold;
	font-family: Helvetica, Arial, sans-serif;
	color: #828282;
	color: #5cd700;
	text-transform: uppercase;
	}

h3 {
	position: relative;
	clear: both;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	font-size: 10px;
	line-height: 16px;
	font-weight: bold;
	font-family: Helvetica, Arial, sans-serif;
	color: #44c3e3;
	color: #5cd700;
	text-transform: none;
	}

/* student elements - small box */

.student {
	position: relative;
	margin: 0 0 0 0;
	width: 168px;
	height: 210px;
	padding: 0;
	float: left;
	/*border: solid 1px #000;*/
}

.studentportret {
	position: relative;
	border-bottom: solid #5cd700 5px;
	margin: 0 0 5px 0;
	
	}

.student h1 {
	font-size: 12px;
	display: block;
	line-height: 17px;
	clear: both;
	}

.student h1 a  {
	color: #5cd700;
	text-decoration: none	;
	}

.student h1 a:hover {
	color: #000;
	text-decoration: none;
	}	
	

/* studentb elements - big box */

.studentb {
	position: relative;
	margin: 0 0 20px 0;
	width: 100%;
	/*height: 210px;*/
	padding: 0;
	float: left;
	/*border: solid 1px #000;*/
}

.studentboxleft {
	position: relative;
	float: left;
	width: 140px;
	width: auto;
        margin: 0 30px 0 0;
	}

.studentboxright {
	position: relative;
	float: left;
	/*width: 310px;*/
	/*border: solid 1px #000;*/
        
	}



.studentportretb {
	position: relative;
	border-right: solid #5cd700 5px;
	margin: 0 0 5px 0;
		
	}

.studentb h1 {
	font-size: 12px;
	display: block;
	line-height: 17px;
	}

.studentb h1 a  {
	color: #5cd700;
	text-decoration: none	;
	}

.studentb h1 a:hover {
	color: #000;
	text-decoration: none;
	}




/*********************** footer elements ***********************/

#footer {
	position: relative;
	margin: 60px 0 0 0;
	padding: 0;
	width: 490px;
	background-color: #fff;
	color: #999;
	line-height: 11px;
	font-size: 9px;
	float: left;
	clear: both;
	height: 100px;
	}

#footer p {
	color: #999;
	font-size: 9px;
	line-height: 14px;
	}

#hogentlogo {
	position: absolute;
	top: 0;
	right: 0;
	margin: 0 0 0 0;
	padding: 0;
	width: 113px;
	z-index: 1;
	}

#hogentlogo a {
	display: block;
	width: 113px;
	height: 26px;
	margin: 0;
	padding: 0;
	background: url(img/hogentlogo.gif) no-repeat 0 -26px;
	/*border: #000 solid 1px;*/
	}

#hogentlogo a:hover {
	background: url(img/hogentlogo.gif) no-repeat 0 0;
	}


/*********************** list elements ***********************/

#contentleft ul {
	position: relative;
	margin: 0 0 10px 0;
	padding: 0 0 0 0;
	font-size: 10px;
	line-height: 15px;
	color: #828282;
	}
	
#contentleft li {
	list-style: none;
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 0 10px;
	background: url(img/bullet.gif) no-repeat 0 5px;
	}	

#contentleft li a {
	text-decoration: underline;
	}

#contentleft li a:hover {
	text-decoration: underline;
	color: #000;
	}	


#contentright ul {
	position: relative;
	margin: 0 0 10px 0;
	padding: 0 0 0 0;
	font-size: 10px;
	line-height: 15px;
	color: #828282;
	}
	
#contentright li {
	list-style: none;
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 0 10px;
	background: url(img/bullet.gif) no-repeat 0 5px;
	}	

#contentright li a {
	text-decoration: underline;
	}

#contentright li a:hover {
	text-decoration: underline;
	color: #000;
	}	


#contentright .inlinelist {
	position: relative;
	margin: 0 0 10px 0;
	padding: 0 0 0 0;
	font-size: 10px;
	line-height: 16px;
	color: #828282;
	}
	
#contentright .inlinelist li {
	list-style: none;
	position: relative;
	/*float: left;*/
	margin: 0 5px 0 0;
	padding: 0 0 0 10px;
	background: url(img/bullet.gif) no-repeat 0 5px;
	display: inline;
	}	

#contentright .inlinelist  li a {
	text-decoration: underline;
	}

#contentright .inlinelist li a:hover {
	text-decoration: underline;
	color: #000;
	}	




/*********************** comment box elements ***********************/

.commentbox {
	position: relative;
	margin: 0 0 40px 0;
	display: block;
	padding: 5px 0 0 0;
	color: #000000;
	border-top: #ccc solid 1px;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none;
	text-transform: uppercase;
	float: left;
	clear: both;
	width: 100%;
	z-index: 1;
	}

#contentleft .commentbox ul {
	position: relative;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	font-size: 9px;
	line-height: 14px;
	color: #000000;
	display: block;
	}
	
#contentleft .commentbox ul li {
	position: relative;
	list-style: none;
	float: left;
	margin: 0 10px 0 0;
	padding: 0 0 0 10px;
	background: url(img/bullet.gif) no-repeat 0 4px;
	}	

.commentbox li a {
	text-decoration: underline;
	}

.commentbox li a:hover {
	text-decoration: underline;
	color: #000;
	}	




#contentleft .student ul li {
	margin: 0 5px 0 0;
}




/* Begin Images */
p img {
	padding: 0;
	max-width: 100%;
	}

/*	Using 'class="alignright"' on an image will (who would've
	thought?!) align the image to the right. And using 'class="centered',
	will of course center the image. This is much better than using
	align="center", being much more futureproof (and valid) */


#sidebar img a {
	border:0;
	}
	
img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

img.alignright {
	padding: 4px;
	margin: 0 0 2px 7px;
	display: inline;
	}

img.alignleft {
	padding: 4px;
	margin: 0 7px 2px 0;
	display: inline;
	}

.alignright {
	float: right;
	}

.alignleft {
	float: left
	}
/* End Images */





/* Begin Form Elements */
#searchform {
	margin: 10px auto;
	padding: 5px 3px;
	text-align: left;
	}

#sidebar #searchform #s {
	width: 108px;
	padding: 2px;
	}

#sidebar #searchsubmit {
	padding: 1px;
	}

.entry form { /* This is mainly for password protected posts, makes them look better. */
	text-align:center;
	}

select {
	width: 130px;
	}

#commentform input {
	width: 170px;
	padding: 2px;
	margin: 5px 5px 1px 0;
	}

#commentform {
	margin: 5px 10px 0 0;
	}
#commentform textarea {
	width: 100%;
	padding: 2px;
	}
#respond:after {
		content: "."; 
	    display: block; 
	    height: 0; 
	    clear: both; 
	    visibility: hidden;
	}
#commentform #submit {
	margin: 0 0 5px auto;
	float: right;
	}
/* End Form Elements */



/* Begin Comments*/
.alt {
	margin: 0;
	padding: 10px;
	}

.commentlist {
	padding: 0;
	text-align: justify;
	}

.commentlist li {
	margin: 15px 0 10px;
	padding: 5px 5px 10px 10px;
	list-style: none;

	}
.commentlist li ul li { 
	margin-right: -5px;
	margin-left: 10px;
}

.commentlist p {
	margin: 10px 5px 10px 0;
}
.children { padding: 0; }

#commentform p {
	margin: 5px 0;
	}

.nocomments {
	text-align: center;
	margin: 0;
	padding: 0;
	}

.commentmetadata {
	margin: 0;
	display: block;
	}
/* End Comments */



label {
	line-height: 25px;
	width: 120px;
	float: left;
	text-align:left;
	clear:left;
}
