/*
Theme Name: ivwt 2011
Description: ivwt slideshow / Wordpress Theme
Version: 0.9
Author: Robert Schulke
Author URI: http://heartshapedwork.com/
Tags: ajax, slideshow, fullscreen
*/



/*
--- Misc -----------------------------------------------------------------------------
*/

*{
	margin: 0;
	padding: 0;
}

a img {
	border: none;
}

ul, li {
	list-style-type: none;
	list-style-image: none;
	display: inline;
}

.clear {
	clear: both;
}

.hidden {
	display: none;
}

html {
	height: 100%;
	width: 100%;
}



/*
--- Font-Face -----------------------------------------------------------------------------

Generated by Font Squirrel (http://www.fontsquirrel.com) on January 15, 2011
By Dharma Type (http://dharmatype.com)
*/

@font-face {
	font-family: 'BebasNeueRegular';
	src: url('assets/fonts/bebasneue-webfont.eot');
	src: local('☺'), url('assets/fonts/bebasneue-webfont.woff') format('woff'), url('assets/fonts/bebasneue-webfont.ttf') format('truetype'), url('assets/fonts/bebasneue-webfont.svg#webfontGymBME68') format('svg');
}

body {
	height: 100%;
	width: 100%;
	font-family: 'BebasNeueRegular', 'Helvetica Neue', Helvetica, Arial, Sans-Serif;
	color: #000;
	text-rendering: optimizeLegibility;
	font-size: 14px;
	line-height: 20px;
	overflow: hidden;
}

#logo{
	position: fixed;
	top: 20px;
	left: 35px;
	z-index: 999;
}



/*
--- Gallery -----------------------------------------------------------------------------
*/

#gallery {
	position: absolute;
	z-index: 1;
	overflow: hidden;
}

	#caption, #meta, #nav {
		position: absolute;
		left: 215px;
		top: 16px;
		width: 300px;
		height: 40px;
		padding: 23px 20px 13px 20px;
		z-index: 25;
	}

	#nav {
		left: 552px;
		width: 100px;
		padding: 27px 20px 13px 20px;
	}

		#prevslide, #nextslide {
			margin-right: 12px;
		}

	#meta {
		left: 664px;
		width: 200px;
		padding: 27px 20px 13px 20px;
	}

		#meta li {
			margin-right: 12px;
		}



/*
--- Container -----------------------------------------------------------------------------
*/

#container {
	position: absolute;
	left: 215px;
	top: 108px;
	width: 700px;
	padding-left: 20px;
	z-index: 888;
	overflow: auto;
}

	#content {
		z-index: 20;
	}

		#copy {
			position: absolute;
			width: 680px;
			z-index: 333;
		}

			#slides {
				overflow: hidden;
			}

				.slide {
					position: absolute;
					-ms-interpolation-mode: bicubic;
				}

				.contentback {
				//	position: fixed;
					background: #000;
					z-index: 3;
					filter:alpha(opacity=0);
					opacity: 0;
				}

			.description {
				margin: 54px 12px 0 0;
				width: 212px;
				float: left;
			}
			
			.description h4 {
				margin-bottom: 20px;
			}

			.tags {
				margin-top: 54px;
				width: 212px;
				float: left;
			}

			.tags h4 {
				margin-bottom: 20px;
			}

			.thumb436 {
				float: left;
				margin: 54px 0 0 0;
				width: 436px;
				height: 212px;
			}

			.thumb324 {
				float: left;
				margin: 54px 12px 0 112px;
				width: 324px;
				height: 212px;
			}
			
			.thumbnails {
				float: left;
				margin-right: 12px;
				margin-bottom: 12px;
				width: 212px;
				height: 132px;
			}

				.imgDesc {
					margin-top: -132px;
					width: 212px;
					height: 132px;
				}

					.imgDescBack {
						width: 212px;
						height: 132px;
						filter:alpha(opacity=70);
						opacity: 0.7;
					}

					.imgDesc h4 {
						position: relative;
						text-align: center;
						top: -132px;
						z-index: 33;
					}

					.imgDesc h4 a, .imgDesc h4 a:hover {
						height: 82px;
						padding: 50px 0 0 0;
						display: block;
						text-decoration: none;
					}

			.about-p {
				float: left;
				width: 326px;
				margin: 0 10px 24px 0;
			}

				.about-p h2 {
					margin-bottom: 20px;
				}

				.about-p p {
					margin-bottom: 20px;
				}



/*
--- Scrollbar -----------------------------------------------------------------------------
*/

#scrollbar1 {
	width: 680px;
	clear: both;
	margin: 20px 0 10px;
}

	#scrollbar1 .viewport {
		width: 660px;
		height: 413px;
		overflow: hidden;
		position: relative;
	}

	#scrollbar1 .overview {
		list-style: none;
		position: absolute;
		left: 0;
		top: 0;
	}

	#scrollbar1 .scrollbar {
		position: relative;
		float: right;
		width: 5px;
	}

	#scrollbar1 .track {
		background-color: #dddddd;
		height: 100%;
		width:5px;
		position: relative;
		padding: 0;
		filter:alpha(opacity=70);
		opacity: 0.7;
	}

	#scrollbar1 .thumb, #scrollbar1 .thumb .end {
		background-color: #333333;
	}

	#scrollbar1 .thumb {
		height: 20px;
		width: 5px;
		cursor: pointer;
		overflow: hidden;
		position: absolute;
		top: 0;
	}

		#scrollbar1 .thumb .end {
			overflow: hidden;
			height: 5px;
			width: 5px;
		}

	#scrollbar1 .disable{
		display: none;
	}



/*
--- Fonts -----------------------------------------------------------------------------
*/

h1, h2, h3, h4 {
	text-decoration: none;
	font-size: 24px;
	text-transform: uppercase;
	font-weight: normal;
}

#copy h2, #copy h2 a {
	margin: 0 0 20px 0;
}

#caption h2, #caption h3 {
	display: inline;
}

h3, h3 a {
	font-size: 14px;
	line-height: 20px;
}

#caption h3 {
	margin-left: 12px;
}



/*
--- Links -----------------------------------------------------------------------------
*/

a {
	color: #eee;
	text-decoration: none;
	outline: none;
}

a:hover{
	text-decoration: underline;
}

a.dark{
	color: #222;
	text-decoration: none;
	outline: none;
}

a.dark:hover{
	color: #111;
	text-decoration: underline;
}

.dark{
	color: #222;
}

a.light{
	color: #eee;
	text-decoration: none;
	outline: none;
}

a.light:hover{
	color: #fff;
	text-decoration: underline;
}

.light{
	color: #fff;
}

a.active {
	text-decoration: underline;
}

.inactive {
	filter:alpha(opacity=50);
	opacity: 0.5;
}