/*
Theme Name: Portfolio.css
Description: Thema voor mijn wordpress based portfolio
Version: 1.1
Author: Saro Van Cleynenbreugel and Jeff Starr
Author URI: www.saromedia.nl
Tags: HTML5 Wordpress Portfolio Blog
*/


/* BASICS */

header, footer, section, article, aside, nav {
	display: block;
	font-family: Tahoma, Geneva, Verdana;
    
	color: #555555;
	}
body {
	margin: auto;
	width: 98%;
	}
nav+section {
	overflow: hidden;
	
	float: left;
	clear: none;
	color: Black;
	}
    


/* == LINKS == */

a:link, a:visited {
	text-decoration: none;
	color: #0077ff;
	}
a:hover, a:active {
	text-decoration: none;
	color: black;
	}

/* == HEADER == */

body>header {
	padding: 1.2em;
	color: #222;
	font-size: 0.7em;
	}
	body>header h1 {
		margin: 0;
		}
		body>header h1 a:link, body>header h1 a:visited {
			text-decoration: none;
			color: #222;
			}
		body>header h1 a:hover, body>header h1 a:active {
			text-decoration: none;
			color: #0077ff;
			}



/* == POSTS == */

article[id*=post-] {
	width: 150%;
    max-width: 900px;
	font-size: 0.9em;
	padding-left: 1.2em;
	float: left;
	}
article>header p, 
article>footer p {
	font-style: italic;
	font-size: 0.8em;
	}	
	
article>footer p {
	float: left;
    padding-top: 10px;
	}	

article+nav {
	font-weight: bold;
	}
section>h1 {
	padding-top: 1.2em;
	font-size: 1.2em;
	}
	
section{
float: left;
width: 70%;
}


/* == NAVIGATION == */

nav {
	text-align: right;
	font-size: 1.2em;
	clear: both;
	float: right;
	}
body>nav {
	padding: 0 0;
	}
	body>nav ul {
		text-align: right;
		margin: 0;
		padding-top: 0px;
		}
		body>nav li {
			margin-right: 2em;
			font-weight: bold;
			display: inline;
			}
			body>nav li a:link, body>nav li a:visited{
				color: #000000;
				}
			body>nav li a:hover, body>nav li a:active{
				color: #333333;
				}
                
#HOME{
    text-align: right;
	font-size: 1em;
	clear: both;
	float: left;
    
    margin-right: 2em;
    font-weight: bold;
    display: inline;	
}
a#HOME:link, a#HOME:visited{
    color: #000000;
}
a#HOME:hover, a#HOME:active{
    color: #000000;
}

/* == COMMENTS == */

article[id*=comment-] {
	margin: 15px 0;
	padding: 10px;
	float: left;
	}
	article[id*=comment-] h4 {
		margin: 0;
		}
	.alt {
		border: 1px solid #ddd;
		background: #eee;
		}
form[method=post] label {
	display: block;
	}
form[method=post] input {
	margin: 2px 0 12px 0;
	display: block;
	}

/* == SIDEBAR == */

aside {
	color: black;
	margin-top: 3em;
	overflow: hidden;
	width: 30%;
	clear: none;
	}
	body>aside h2{
		font-size: 1.2em;
		font-weight: normal;
		text-align: left;
		padding-left: 63px;
		color: #0077ff;
	}
	body>aside li a:link, body>aside li a:visited{
		color: #000000;
		}
	body>aside li a:hover, body>aside li a:active{
		color: #0077ff;
		}
	aside li {
            
		font-style: normal;
		font-weight: normal;
		font-size: 1em;
		list-style: none;
		text-align: left;
		}
		aside li ul li {
			list-style: none;   
			}

/* == FOOTER == */
footer{
float: bottom, left;
margin-right:100px;
}

body>footer {
	padding-top: 2em;
	text-align: left;
	overflow: hidden;
	width: 100%;
	clear: both;
	}

/* == SEARCH == */

label[for=s] {
	display: none;
	}
    
input[id=s]{
    float: left;
    width: 60%;
    margin-left: 63px;
    }
    
input[id=but]{
    margin-left: 63px;
    float: bottom;
    }

/* == ELEMENTS == */

/* a place for misc. styles */
/*Lijn element onder het menu*/
#lijn{
display: block;
width: auto;
height: 5px;
background-color: #000000;
}
#lijn2{
display: block;
width: auto;
height: 3px;
background-color: #0077ff;
}
#lijn3{
display: block;
width: auto;
height: 3px;
background-color: #5bc9ff;
}
#lijn4{
display: block;
width: auto;
height: 12px;
background-color: #e4f9ff;
}


/* Headings */
h2 {font-size: 1.571em} /* 22px */
h3 {font-size: 1.429em} /* 20px */
h4 {font-size: 1.286em} /* 18px */
h5 {font-size: 1.143em} /* 16px */
h6 {font-size: 1em} /* 14px */

h2, h3, h4, h5, h6 {
font-weight: 400;
line-height: 1.1;
margin-bottom: .8em;
}

/* Paragraphs */
p {margin-bottom: 1.143em;}
* p:last-child {margin-bottom: 0;}

strong, b {font-weight: bold;}
em, i {font-style: italic;}

::-moz-selection {background: #F6CF74; color: #fff;}
::selection {background: #F6CF74; color: #fff;}

/* Lists */
ul {
list-style: outside disc;
margin: 1em 0 1.5em 1.5em;
}

ol {
list-style: outside decimal;
margin: 1em 0 1.5em 1.5em;
}

dl {margin: 0 0 1.5em 0;}
dt {font-weight: bold;}
dd {margin-left: 1.5em;}

/****** CSS Voor projects Page *******/

i.infowork{
	font-size:0.8em;
}


/*subteksten voor uitleg en dergelijken bij video en afbeeldingen */
div#sub{
	font-size:0.9em;
}


/* projecten */

a#intdesign, a#intdesign:visited{
	display: block;
	width: 100px;
	height: 75px;
	background: url(images/IDfruits.png) 0 0 no-repeat;
}

a#intdesign:hover{
	margin-left: 15px;
}
a#intdesign:active{
	margin-left: 15px;
}

a#flashproject:link, a#flashproject:visited{
	display: block;
	width: 100px;
	height: 75px;
	background: url(images/blokMini.jpg) 0 0 no-repeat;
}

a#flashproject:hover{
	margin-left: 15px;
}
a#flashproject:active{
	margin-left: 15px;
}

a#driedsmaxcursus:link, a#driedsmaxcursus:visited{
	display: block;
	width: 100px;
	height: 75px;
	background: url(images/3dsmax.gif) 0 0 no-repeat;
}
a#driedsmaxcursus:hover{
	margin-left: 15px;
	border-width: 0px;
}
a#driedsmaxcursus:active{
	margin-left: 15px;
	border-width: 0px;
}
div#driedsmax{
	display:block;
	width:453px;
	height:325px;
	background: url(3DsmaxProject.png) 0 0 no-repeat;
}

a#actionscript:link, a#actionscript:visited{
	display: block;
	width: 100px;
	height: 75px;
	background: url(images/actionscript.png) 0 0 no-repeat;
}
a#actionscript:hover{
	margin-left: 15px;
	border-width: 0px;
}
a#actionscript:active{
	margin-left: 15px;
}

a#digitaalmuseum:link, a#digitaalmuseum:visited{
	display: block;
	width: 100px;
	height: 75px;
	background: url(images/kg.jpg) 0 0 no-repeat;
}
a#digitaalmuseum:hover{
	margin-left: 15px;
}
a#digitaalmuseum:active{
	margin-left: 15px;
}

a#digitaledummy:link, a#digitaledummy:visited{
	display: block;
	width: 100px;
	height: 75px;
	background: url(images/dd.jpg) 0 0 no-repeat;
}
a#digitaledummy:hover{
	margin-left: 15px;
}
a#digitaledummy:active{
	margin-left: 15px;
}

a#fotografie:link, a#fotografie:visited{
	display: block;
	width: 100px;
	height: 75px;
	background: url(images/fotografie.jpg) 0 0 no-repeat;
}
a#fotografie:hover{
	margin-left: 15px;
}
a#fotografie:active{
	margin-left: 15px;
}

a#artisproject:link, a#artisproject:visited{
	display: block;
	width: 100px;
	height: 75px;
	background: url(images/ap.jpg) 0 0 no-repeat;
}
a#artisproject:hover{
	margin-left: 15px;
}
a#artisproject:active{
	margin-left: 15px;
}

a#individueelproject:link, a#individueelproject:visited{
	display: block;
	width: 100px;
	height: 75px;
	background: url(images/ipro.jpg) 0 0 no-repeat;
}
a#individueelproject:hover{
	margin-left: 15px;
}
a#individueelproject:active{
	margin-left: 15px;
}

a#animatiefilm:link, a#animatiefilm:visited{
	display: block;
	width: 100px;
	height: 75px;
	background: url(images/avd.jpg) 0 0 no-repeat;
}
a#animatiefilm:hover{
	margin-left: 15px;
}
a#animatiefilm:active{
	margin-left: 15px;
}
div#flashplayer{
	display:block;
	width:320px;
	height:240px;
}

a#filmscreen:link, a#filmscreen:visited{
	display:block;
	height:250px;
	width:400px;
	background: url(images/strook.png) 0 0 no-repeat;
	margin-bottom:10px;
	margin-left:20px;
}
a#filmscreen:hover{
	margin-left: 15px;
}
a#filmscreen:active{
	margin-left: 15px;
}

a#vdscreen:link, a#vdscreen:visited{
	display:block;
	height:300px;
	width:400px;
	background: url(images/newDesignvb.png) 0 0 no-repeat;
	margin-bottom:10px;
	margin-left:20px;
}
a#vdscreen:hover{
	margin-left: 15px;
}
a#vdscreen:active{
	margin-left: 15px;
}

a#isvarascreen:link, a#isvarascreen:visited{
	display:block;
	height:205px;
	width:400px;
	background: url(images/isvaraDesign.png) 0 0 no-repeat;
	margin-bottom:10px;
	margin-left:20px;
}
a#isvarascreen:hover{
	border-right-style: solid;
	border-right-color: #b3b3b3;
	border-right-width: 5px;
}
a#isvarascreen:active{
}

a#interactiondesign:link, a#interactiondesign:visited{
	display: block;
	width: 100px;
	height: 75px;
	background: url(images/id.jpg) 0 0 no-repeat;
}
a#interactiondesign:hover{
	margin-left: 15px;
}
a#interactiondesign:active{
	margin-left: 15px;
}

a#visualdesign:link, a#visualdesign:visited{
	display: block;
	width: 100px;
	height: 75px;
	background: url(images/vd.jpg) 0 0 no-repeat;
}
a#visualdesign:hover{
	margin-left: 15px;
}
a#visualdesign:active{
	margin-left: 15px;
}

a#isvara:link, a#isvara:visited{
	display: block;
	width: 100px;
	height: 75px;
	background: url(images/isvara.jpg) 0 0 no-repeat;
}
a#isvara:hover{
	margin-left: 15px;
}
a#isvara:active{
	margin-left: 15px;
}

a#monodot:link, a#monodot:visited{
	display: block;
	width: 100px;
	height: 75px;
	background: url(images/md.jpg) 0 0 no-repeat;
}
a#monodot:hover{
	margin-left: 15px;
}
a#monodot:active{
	margin-left: 15px;
}

a#minor:link, a#minor:visited{
	display: block;
	width: 100px;
	height: 75px;
	background: url(images/minor.png) 0 0 no-repeat;
}
a#minor:hover{
	margin-left: 15px;
}
a#minor:active{
	margin-left: 15px;
}






/* == ALL YOUR CODE ARE BELONG TO POETRY == */