body { background: url(../images/subpage_back.jpg) #0f0f0f no-repeat center top fixed; font-size: 15px; margin:  }

a { color: #7e7e7e }
a:hover { color: #e1e1e1}

#wrapper { 
	margin: auto; position: relative;
	width: 858px; }
	
#sidebar {
	float: left;
	margin-top: 35px;
	width: 103px; display: inline; }

#sidebar a.logo {
	background: url(../images/subpage_logo.gif) no-repeat;
	display: block;
	height: 110px;
	margin-bottom: 36px;
	text-indent: -9999px;
	width: 159px; }

#sidebar ul { margin: 0 0 0 28px; padding: 0; line-height: 38px; list-style: none; text-transform: lowercase}
#sidebar ul li { font-size: 28px; float: left; display: block; clear: both; }
#sidebar ul li a { color: #8d8d8d }
#sidebar ul li ul { line-height: 27px; margin: 0 0 9px 0; padding: 0;}
#sidebar ul li ul li { display: block; float: none; font-size: 16px; width: 180px; line-height: 24px }
#sidebar ul li a:hover, #sidebar ul li.active a { color: #ffffff }
#sidebar ul li.self ul li a { color: #8d8d8d }
#sidebar ul li a.self, 
#sidebar ul li.active ul li a:hover, 
#sidebar ul li.current_page_item a,
#sidebar ul li.current_page_parent a { color: #ffffff }
#sidebar ul li.current_page_item ul li a { color: #8d8d8d}

#main-content {
	background: #000000;
	background: rgba(0,0,0,.65);
	margin: 0;
	padding-bottom: 25px;
	width: 634px; float: right}

#main-content .slider { color: #5d5d5d; height: 180px; padding-top: 40px;margin: 0 0 0 17px; overflow: hidden;position: relative; width: 100%; z-index: 2} 
#main-content .slider #carousel { float: left; height:150px; margin: 0 5px; position: relative; overflow: hidden; width: 550px}
#main-content .slider ul li { float: left; list-style: none; display: inline; width: 113px; height: 150px}
#main-content .slider ul li a img { border: 0}

#main-content #page-content {
	background: transparent;
	font-size: 14px;
	position: relative;
	line-height: 1.3;
	margin-top: 0;
	color: #cccccc ;
	z-index: 2;
	padding: 0 22px; }

	
#main-content #page-content h1 {font-size: 24px; color: #ffffff; font-weight: bold}
#main-content #page-content h2 {font-size: 24px; color: #ffffff; font-weight: normal}
#main-content #page-content h3 {font-size: 18px; color: #ffffff; font-weight: normal}
#main-content #page-content h4 {font-size: 16px; color: #ffffff; font-weight: normal}
#main-content #page-content h5 {font-size: 15px; color: #ffffff; font-weight: normal}


a.work-image { text-align: center; display: block; margin: 0 0 25px 0 }
a.enlarge { text-transform: lowercase; display: block; width: 200px; float: left; padding-bottom: 100px;}

div.slideshow { min-height: 650px; background: transparent}
div.slideshow a.work-image { display: block; text-align: center; margin: 0 auto 25px auto;width: 580px; background: transparent; }

div.details { 
	background: #131313;
	color: #787878;
	float: right; 
	padding: 15px; 
	width: 210px; display: block; }
.details h2 {font-size: 20px; font-weight: normal; line-height: 1; margin: 0 0 8px 0}
div.details.slide { float: none; margin: auto;}


.blog-content { padding: 25px; background: #111; float: left; margin: auto auto 25px auto; width: 545px; }
.blog-content h2 { margin: 0}
.jcarousel-container {
    position: relative;
    width: 630px;
}

.jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0;
    width: 565px;
    overflow: hidden;
    position: relative;
}

.jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-list li,
.jcarousel-item {
    float: left;
    list-style: none;
    /* We set the width/height explicitly. No width/height causes infinite loops. */
    width: 75px;
    height: 75px;
}

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
.jcarousel-next {
    z-index: 3;
    display: none;
    height: 100px; width: 15px; float: right;
    background: url(../images/right-arrow.gif) no-repeat 0 5px;
    margin: 0 32px 0 0;
    position: relative;
    cursor: pointer;
}

.jcarousel-prev {
    z-index: 3;
    display: none;
    height: 100px; width: 15px; float: left;
    background: url(../images/left-arrow.gif) no-repeat 0 5px;
    cursor: pointer;

}