@charset "UTF-8";
/* CSS Document */

@import url(http://fonts.googleapis.com/css?family=Montserrat:400);
@import url(http://fonts.googleapis.com/css?family=Muli:300,300italic);


body {
	margin:0;
	padding:0;
	font-family: 'Muli', sans-serif;
	font-size:11px;
	line-height:14px;
	font-weight:300;
	color:#888;
}

em {
	font-family: 'Muli', sans-serif;
	font-style:italic;
}

h3 {
	margin:0;
	font-family: 'Montserrat', sans-serif;
	font-size:12px;
	font-weight:400;
	letter-spacing:2px;
	color:#aaa;
}

p {
	padding:0;
	margin:0;
	margin-bottom:8px;
}

.clear {
	clear:both;
}

.fade {
	opacity: 1;
	transition: opacity .25s ease-in-out;
	-moz-transition: opacity .25s ease-in-out;
	-webkit-transition: opacity .25s ease-in-out;
}

.fade:hover {
	opacity: 0.6;
}

.container {
	width: 960px;
    height: 700px;

    position: absolute;
    top:0;
    bottom: 0;
    left: 0;
    right: 0;

    margin: auto;
}

.content {
	float:left;
	width:460px; 
	margin-right:20px;
}

a.nav-link {
	display:block;
	margin-bottom:38px;
	font-family: 'Montserrat', sans-serif;
	font-size:12px;
	font-weight:400;
	letter-spacing:2px;
	color:#888;
	text-decoration:none;
	
	transition: .4s ease-in-out;
	-moz-transition: .4s ease-in-out;
	-webkit-transition: .4s ease-in-out;
}

a.nav-link:hover {
	color:#000;
}

a.link {
	color:#aaa;
	text-decoration:none;
	
	transition: .4s ease-in-out;
	-moz-transition: .4s ease-in-out;
	-webkit-transition: .4s ease-in-out;
}

a.link:hover {
	color:#000;
}

a.selected {
	color:#000;
}

/*** JCAROUSEL ***/

/*
	This is the visible area of you carousel.
	Set a width here to define how much items are visible.
	The width can be either fixed in px or flexible in %.
	Position must be relative!
	*/
	.jcarousel {
		float:left;
		width:480px;
		height:700px;
		position: relative;
		overflow: hidden;
	}
	
	/*
	This is the container of the carousel items.
	You must ensure that the position is relative or absolute and
	that the width is big enough to contain all items.
	*/
	.jcarousel ul {
		width: 480px;
		position: relative;
	
		/* Optional, required in this case since it's a <ul> element */
		list-style: none;
		margin: 0;
		padding: 0;
	}
	
	/*
	These are the item elements. jCarousel works best, if the items
	have a fixed width and height (but it's not required).
	*/
	.jcarousel li {
		width:480px;
		height:130px;
		margin-bottom:10px;
	}