/*
Theme Name: Masters of Media v2
Theme URI: http://mastersofmedia.hum.uva.nl/
Description: Wordpress theme for the MoM blog
Version: 1.0
Author: Kimberley Spreeuwenburg, Maarten Hoogvliet, Sander Jansma & Erik Borra
Author URI: http://mastersofmedia.hum.uva.nl/
Tags: clean, basic, momblog
*/

@import "css/reset.css";
@import "css/typography.css";
@import "css/layout.css";

/* Color Guide
==============================================================================

red: 				#ea0b0b;	(links)
light-blue: 		#d4dee5;	(sort-border)


/*

/* Global Styles
============================================================================== */
a, a:link {
	font-weight: normal; text-decoration: none; color: #ea0b0b;
	transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
}
	a:hover {
		color: #000;
	}

ul, ol , li{
	list-style: inside;
}

	ul li {
		list-style-type:circle;
	}
	ol li {
		list-style-type:decimal;
	}

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

blockquote {
	font-style: italic; color: #666; 
	padding: 0 0 0 30px;
	border-left: 1px solid #ccc;
}

.article {
	color: #000;
}
.article p {
	margin: 0 0 20px 0;
}
.article h2 {
	margin: 0 0 20px 0;
}
.article img {
	margin: 0 10px 10px 0;
}

/* Header Styles
============================================================================== */
h1 {
	font-family: 'Maven Pro', cursive; font-size: 38px; color: #000; line-height: 1;
}
	h1.pagetitle {
		padding: 10px 0 25px 0;
		margin: 0 0 5px 0;
/*		border-top: 1px solid #cc0000;
/*		border-bottom: 1px solid #cc0000; */
	}
	h1.cattitle {
		margin: 0 0 0 20px;
	}
	h1.authortitle {
		margin: 0 0 0 20px;
	}
	
h2 {
	font-family: 'Maven Pro', cursive; font-size: 20px; line-height: 1.3; margin-bottom: 5px; margin-top: 5px;
}
h3 {
	
}
h4 {}
h5 {}

/* Base Structure
============================================================================== */
body, html {
	font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: 14px; color: #8f8f8f; line-height: 1.8;
	background: #fff;
}
html {
	overflow-y: scroll;
}

#top {
	position: relative;
	background: #fff;
	width: 100%;
	padding: 0; margin: 0;
	height: 27px;
}
	#menu {
		position: absolute;
		right:0;
		z-index: 1001;
	}
	/* logged-in-nav makes a menu items visible only for a logged in user  */
	#menu-main li.logged-in-nav {
		display: none;
	} 
 	body.logged-in #menu-main li.logged-in-nav {
		display: list-item;
	}
	/* menu-noclick makes a menu item unclickable */
	#menu-main ul li.menu-noclick a {
		pointer-events: none;
	}
	/* menu-tab creates some space to the left */
	#menu-main ul li.menu-tab a {
		padding-left: 15px;
		background: #fff;
	}
	#menu-main ul li.menu-tab a:hover {
		padding-left: 15px;
		background: #f3f1f1;
	}

	
	
#header {
	position: relative; z-index: 999;
	width: 100%;
	padding: 0; margin: 0;
	height: 120px;
	background: url(images/mom_logo_lijn.png) repeat-x;
}
	#header .top-content {
		height: 120px;
	}
	#logo a {
		position: absolute;
		left: 10px;
		background: url(images/mom_logo.png) no-repeat;
		display: block;
		width: 536px;
		height: 95px;
	}
	
#sort {
	position: relative; z-index: 99;
	padding: 0 0 5px 0;
}
	#sort h3 {
		float: left;
		margin: 7px 15px 0 6px;
		color: #000;
	}
	
	/* list & browse authors */
	
	#list-authors {
	}

	ul#sort-list {
		position: relative;
		float: right;
		padding: 0 0 5px 0;
		margin: 5px 0 0 0;
	}

		ul#sort-list li{
			float: right;
			list-style: none;
			margin: 0;
			padding: 0;
			overflow: hidden;
			-moz-border-radius: 2px;
			-webkit-border-radius: 2px;
			-khtml-border-radius: 2px;
			border-radius: 2px;
		}
		
			ul#sort-list li a {
				position: relative;
				height: 20px;
				margin: 0;
				padding: 5px 15px 0px 5px;				
				line-height: 1;
				border: 1px solid #e2e0e0;
				-moz-border-radius: 2px;
				-webkit-border-radius: 2px;
				-khtml-border-radius: 2px;
				border-radius: 2px;
				display: block;
			}
			ul#sort-list li.relevance a {
				padding: 5px 5px 0px 5px;	
			}			
			
				ul#sort-list li a.sort-off{
					color: #9f9f9f;
					border: none;
					padding-top: 7px;	
				}
					ul#sort-list li a.sort-off:hover {
						color: #000;
					}
					ul#sort-list li a.sort-off span {
						position: absolute; 
						width: 6px;
						height: 5px;	
						top: 12px; 
						right: 5px;
						background: url(images/arrow-sort-desc-off.jpg) no-repeat;
					}
					
					
				ul#sort-list li a.sort-desc {
						/* color: #9f9f9f; */
									}
				
					ul#sort-list li a.sort-desc:hover{
						color: #ea0b0b;
					}
					
					ul#sort-list li a.sort-desc span {
						position: absolute; 
						width: 6px;
						height: 5px;	
						top: 10px; 
						right: 5px;
						background: url(images/arrow-sort-desc.jpg) no-repeat;
						display: block;
					}
					
				ul#sort-list li a.sort-asc {
						/* color: #9f9f9f; */
									}
				
					ul#sort-list li a.sort-asc:hover{
						color: #ea0b0b;
					}
					
					ul#sort-list li a.sort-asc span {
						position: absolute; 
						width: 6px;
						height: 5px;	
						top: 10px; 
						right: 5px;
						background: url(images/arrow-sort-asc.jpg) no-repeat;
						display: block;
					}
				ul#sort-list li.header {
					padding-right: 5px;
				}
	#sort-form {
		position: relative;
		float: left;
		width: 100px;
		margin: 5px 20px 0 0;
	}
	#sort-search {
		margin-left: 0px;
		padding-left: 0px;
	}
	#sort-search input {
		float: right;
	}
	#sort-search div {
		float: right;
	}
		#sort-search input#s {
			background-color: transparent;
			color: #8f8f8f;
			font-style: italic;
			width: 173px;
			height: 19px;
			padding: 5px;
			margin: 0 5px 0 0;
			
			border: 1px solid #e2e0e0;
			-moz-border-radius: 2px;
			-webkit-border-radius: 2px;
			-khtml-border-radius: 2px;
			border-radius: 2px;
		}
		
		#sort-search input#s.left-bar-search {
			height: 17px;
			float: left;
		}
		
		#searchsubmit {
			background: url(images/looking-glass-big.png) no-repeat center center;
			background-size: 15px;
			font-size: 14px; 
			color: #9f9f9f; 
			font-weight: bold;
			cursor: pointer; *cursor: hand;
			padding: 5px;
			margin: 0 5px 0 0;
			height: 30px;
			width: 30px;
			border: 1px solid #e2e0e0;
			-moz-border-radius: 2px;
			-webkit-border-radius: 2px;
			-khtml-border-radius: 2px;
			border-radius: 2px;
		}
			#searchsubmit:hover{
				color: #000;
			}		
			
	.search-highlight {
			border-bottom: 2px solid #EA0B0B;
	}
			
	#refine-button {
		position: relative;
		height: 22px;
		margin: 0 0 2px 0;
		padding: 7px 15px 0px 5px;
		line-height: 1;
		cursor: pointer;
		border: 1px solid #e2e0e0;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		-khtml-border-radius: 2px;
		border-radius: 2px;	
	}
	#refine-sort {	
		position: absolute; 
		width: 7px;
		height: 7px;	
		top: 11px; 
		right: 5px;
		background: url(images/pijlomlaag_zwart.png) no-repeat;
		display: block;
	}

	#searchform {
		/* padding-top: 85px; */
	}		
	#refine {
		display: none;
		margin-top: 5px;
	}
	#refine select {
		float: right;
		
		margin: 0 0 0 5px;
		padding: 5px;
		
		font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; 
		font-size: 14px; 
		line-height: 1;
		color: #8f8f8f;
		background: transparent;
		cursor: pointer;
		-webkit-appearance: none;
		-moz-appearance: textfield;
		-khtml-appearance: none;

		border: 1px solid #e2e0e0;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		-khtml-border-radius: 2px;
		border-radius: 2px;	
	}
	#refine select option {
		padding: 0px 5px 0px 5px;
	}
	#refine div {
		float: right;
	}
	
.top-content {
	position: relative;
	width: 950px;
	margin: 0 auto;
}

#container {
	position: relative;
	width: 100%;
	padding: 0; margin: 0;
}
	#container.gr {
		background: #f3f1f1;
	}

#content {
	position: relative; 
	width: 970px;
	margin: 0 auto;
	padding: 0;
}

#container.gr #content {
	padding-top: 10px;
}

	.tagcloud {
		position: relative;
		margin: 0 0 10px 20px;
	}
		.tagcloud h3 {
			float: left; display: inline;
			font-weight: bold;
			color: #000;
			width: 110px;
			line-height: 1.3;
		}
		
		.tagcloud-content {
			position: relative;
			float: left; 
			display: inline;
			width: 900px;
			border: 1px solid #e2e0e0;
			text-align: center;
			padding: 20px;
			background: #fff;
			color: #8f8f8f; line-height: 1.4;
			-moz-border-radius: 2px;
			-webkit-border-radius: 2px;
			-khtml-border-radius: 2px;
			border-radius: 2px;

		}
		.tagcloud-content a {
			padding-right: 5px;
		}

	/* bio above cloud - css copied and modified from .tagcloud class */
	.biosearch {
		position: relative;
		margin: 0 0 10px 20px;
	}
		.biosearch h3 {
			float: left; display: inline;
			font-weight: bold;
			color: #000;
			width: 110px;
			line-height: 1.3;
		}

		.biosearch-content {
			position: relative;
			float: left; 
			display: inline;
			width: 900px;
			border: 1px solid #e2e0e0;
			text-align: left;
			padding: 20px;
			background: #fff;
			color: black; line-height: 1.4;
			-moz-border-radius: 2px;
			-webkit-border-radius: 2px;
			-khtml-border-radius: 2px;
			border-radius: 2px;
			margin-bottom: 10px;
			z-index: 1002;

		}
		.biosearch-caption {
			font-weight: bold;
		}
		.biosearch-caption a {
			font-weight: bold;
			color: black;
		}



#footer {
	position: relative;
	background: #f3f1f1;
	border-top: 1px solid #d4dee5;
	padding: 30px 0 30px 0;
	width: 100%;
	padding: 0; margin: 0;
}
	.footer-content {
		position: relative;
		width: 970px;
		margin: 0 auto;
		padding-top: 10px;
	}
	.footer-content #single-related h2.subtitle {
		margin-bottom: 10px;
		padding-bottom: 0px;
	}

/* Contributors pages
============================================================================== */
.contributors-authors-header {
	color: black;
	margin-bottom: 15px;
}

#contributors-authors-lists {
	color:black;
	line-height: 1.8;
}

#contributors-authors-lists a {
	color: #EA0B0B;
}

#contributors-authors-lists ul li {
	list-style-type: none;
}

/* Category Structure
============================================================================== */
#category {
	position: relative;
}
	.post.medium,
	.page.medium{
		position: relative;
		width: 300px;
		float: left; /* needed for jquery isotope */
		margin: 0 0 0 20px;
	}
		.post-content {
			position: relative;
			display: block;
			border: 1px solid #e2e0e0;
			padding: 20px;
			background: #fff;
			color: #8f8f8f;
			-moz-border-radius: 2px;
			-webkit-border-radius: 2px;
			-khtml-border-radius: 2px;
			border-radius: 2px;
			font-weight: normal;
			cursor: pointer; *cursor: hand;
		}
			.page.medium .post-content {
				background: #efefef;
			}
			
			.post-content a {
				color: #8f8f8f;
			}
			.post-content h2 a{
				color: #000;
			}
			.post-content:hover {
				background: #f4f4f4;
				color: #000;
			}
			.post-excerpt {
				position: relative;
			}
				.post-excerpt a img, .post-excerpt img {
					display: none;
				}
		
		.post-meta {
			position: relative;
			font-size: 11px; color: #959394; font-style: italic;
			height: 40px;
		}
			
			.page.medium .post-meta {
				display: none;
			}
			span.post-author {
				background: url(images/icon-author.jpg) no-repeat 7px;
				padding: 0 0 0 20px;
			}
			span.post-date {
				margin: 0;
			}
			span.post-comments {
				background: url(images/icon-comments.jpg) no-repeat left;
				padding: 0 0 0 15px;
				margin: 0 0 0 5px;
			}

/* Single
============================================================================== */
#single {
	position: relative;
	margin: 0 0 0 20px;
}	
	#single-overview {
		position: relative;
		margin: 0 0 30px 0;
	}
		#single-overview a {
			background: #c21313 url(images/arrow-prev.jpg) 10px 9px no-repeat;
			padding: 5px 10px 5px 25px;
			color: #fff; font-size: 15px; text-shadow: 0 -1px 0 #000;
		}
	
	#single-content {
		position: relative;
	}
	
	#single-left {
		position: absolute; top:0; left:0;
		font-size: 14px; font-weight: normal; color: #000;
	}
	#single-left a {
		font-weight: normal;
	}
		#single-author,
		#single-author-bio,
		#single-share,
		#single-print,
		#single-meta {
			position: relative;
			margin: 0;
			padding: 0;
		}
			.single-share-label {
				float: left; display: inline;
				width: 80px;
			}
			.single-share-buttons {
				float: left; display: inline;
				margin-top: 7px;
			}
				.single-share-button {
					position: relative;
					margin: 0 0 6px 0;
				}
			#single-print, #single-print a {
			color: #000;
		}
		.single-share-buttons {
				float: left; display: inline;
				padding: 0;
		}
		.printfriendly a img {
			height: 16px;
			padding: 5px 0 5px 0;
		}		
	#single-right {
		position: relative;
		margin: 0 0 0 235px;
		padding-top: 0;
	}
		
		#single-tags {
			position: relative;
			margin: 0 0 20px 0;
			border-top: 1px solid #ccc;
			padding: 20px 0 0 0;
			width: 700px;
		}
		
		#author-bio {
			display: none;
			position: relative;
			width: 661px;
			border: 1px solid #e2e0e0;
			padding: 10px 20px 10px 20px;
			margin-bottom: 10px;
			background: #f4f4f4;
			color: #000; line-height: 1.8;
			-moz-border-radius: 2px;
			-webkit-border-radius: 2px;
			-khtml-border-radius: 2px;
			border-radius: 2px;
		}
		#author-bio-link-off {
			position: absolute;
			bottom: 10px;
			right: 20px;
			background: url(images/biopijl_links_rood.png) center center no-repeat;
		}
		.author-bio-link-off {
			cursor: pointer;
		}
		a.author-bio-link-off {
			background: url(images/biopijl_links_rood.png) center center no-repeat;
		}
		.author-bio-link-on {
			cursor: pointer;
		}
		a.author-bio-link-on {
			background: url(images/biopijl_rood.png) center center no-repeat;
		}

	#single-comments {
		position: relative;
		border-top: 1px solid #cc0000;
		padding: 20px 0 0 0;
		margin: 0 0 20px 0;
	}
	
	#single-nav 	{
		position: relative;
		height: 70px;
		border-top: 1px solid #cc0000;
	}
		#single-nav .post-next{
			position: absolute; top: 30px; right: 0;
		}
			#single-nav .post-next a {
				background: #c21313 url(images/arrow-next.jpg) 90px 9px no-repeat;
				padding: 5px 25px 5px 10px;
				color: #fff; font-size: 15px; text-shadow: 0 -1px 0 #000;
			}
		
		#single-nav .post-home {
			position: absolute; left: 50%; top: 30px;
			margin-left: -45px;
		}
			#single-nav .post-home a {
				display: block;
				width: 90px;
				height: 30px;
				background: url(images/logo-small.jpg) no-repeat;
			}
		
		#single-nav .post-prev {
			position: absolute; top: 30px; left: 0;
		}
			#single-nav .post-prev a {
				background: #c21313 url(images/arrow-prev.jpg) 10px 9px no-repeat;
				padding: 5px 10px 5px 25px;
				color: #fff; font-size: 15px; text-shadow: 0 -1px 0 #000;
			}
			
	#single-related {
		position: relative;
	}
		#single-related h2.subtitle {
			color: #000;
			margin: 0 0 20px 20px;
		}
		
		ul#related-posts {
			position: relative;
		}
			ul#related-posts li {
				list-style: none;
				float: left;
			}
				ul#related-posts li .post h2 {
					font-size: 18px;
				}

/* Page navigation
============================================================================== */
#pagenav {
	position: relative;
}

	#subpage-menu {
		position: relative;
	}
		#subpage-menu ul {
		
		}
			#subpage-menu ul li {
				float: left; display: inline;
				list-style: none;
			}
				#subpage-menu ul li a {
					float: left;
				}
				
	#pagenav .pagenavi {
		position: relative;
		text-align: center;
	}
		#pagenav .pagenavi a {
			border: 0;
		}
		#pagenav .pagenavi span {
			border: 0;
		}
		#pagenav .pagenavi .current {
			color: #000;
		}
		
		.navigation {
			border-top: 1px solid #CC0000;
			padding: 5px 0 5px 0;
			position: relative;
			height: 30px;
		}
		.navigation a {
			padding: 0 5px 0 5px;
		}
		.navigation a:hover {
			position: relative;
			background-color: #fff;
			z-indeX: 1;
		}

/* Page
============================================================================== */

#page {
	position: relative;
	margin: 0 0 20px 20px;
	padding-bottom: 20px;
}
	#page-content {
		position: relative;
		background: #fff;
		border: 1px solid #e2e0e0;
		padding: 20px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		-khtml-border-radius: 2px;
		border-radius: 2px;
	}

#page-logos {
	position: relative;
	text-align: center;
	margin: 30px 0 40px 0;
}
	.logo-rood {
		margin: 0 60px 0 0;
	}

/* Comments
============================================================================== */
#comments {
	position: relative;
}
	#comments h3 {
		font-family: 'Maven Pro', cursive; font-size: 22px; color: #000;
	}
	#comments ul {
		position: relative;
	}
		#comments ul li {
			position: relative;
			list-style: none;
			border-bottom: 1px solid #e0e0e0;
			padding: 10px 0 10px 0;
			margin-left: 235px;
		}
			#comments ul li.trackback {
				font-size: 12px;
			}
				#comments ul li.trackback .comment-author-name {
					font-size: 12px;
				}
			.comment-author {
				position: relative;
				float: left; display: inline;
				width: 220px;
				margin: 0 15px 0 0;
			}
				.comment-author-avatar {}
				.comment-author-name {
					font-family: 'Maven Pro', cursive; font-size: 18px; 
				}
				.comment-reply a{
					color: #000;
					font-size: 10px;
				}
				
			.comment-content {
				position: relative;
				float: left; display: inline;
				width: 700px;
			}
				.comment-date {
				
				}
				.comment-text {
					color: #000;
				}
				
				#comment-submit {
					background: #fff;
					cursor: pointer; *cursor: hand;
					padding: 5px;				
					line-height: 1;
					border: 2px solid #e2e0e0;
					-moz-border-radius: 2px;
					-webkit-border-radius: 2px;
					-khtml-border-radius: 2px;
					border-radius: 2px;
					margin-top: 5px;
				}
				#comment-form input, #comment-form textarea {
					border: 2px solid #e2e0e0;
					-moz-border-radius: 2px;
					-webkit-border-radius: 2px;
					-khtml-border-radius: 2px;
					border-radius: 2px;	
					margin: 0;
					padding: 0;			
				}
		#comments b {
			color: #000;
		}
		.commentlist {
			margin-bottom: 20px;
		}

#respond {
	position: relative;
	font-size: 12px;
}
	#commentform-left {
		position: relative;
		float: left; display: inline;
		width: 220px;
		margin: 0 15px 0 0;
	}
	#commentform-right {
		position: relative;
		float: left; display: inline;
		width: 700px;
	}
		span.req {
			color: #ea0b0b;
		}
	#respond b {
		color: #000;
	}
	#respond-open {
		display: none;
	}
	.respond-toggle {
		cursor: pointer;
	}
	b.respond-toggle {
		margin-left: 235px;
	}
	a.respond-toggle {
		background: url(images/biopijl_rood.png) center center no-repeat;
	}

/* Special
============================================================================== */
.clear {clear: both;}

/* tooltips */
.tooltipsy {
    padding: 10px;
    max-width: 200px;
    color: #303030;
    background-color: #f5f5b5;
    border: 1px solid #deca7e;
}