@import 'reset.css';

html {
	height:100%;
}

body {
	font-family: Arial, Verdana, Tahoma, sans-serif;
	font-size: 16px;
	color: #3d3d3d;
	margin:0; 
	padding:0; 
	background-color: #000;
}
#page {
	width: 45%;
	min-width: 530px;
	padding: 10px;
	display: inline;
	margin: 3% 12% 0 0;	
	float: right;
	/*background-color: #52905d;*/
	/*background: transparent url(images/bg.png);*/
	background-image:none;
}
#company .order, #company .order2 {
	background: transparent url(images/1.png) no-repeat center center;
}
#film-projects .order, #film-projects .order2 {
	background: transparent url(images/2.png) no-repeat center center;
}
#commercials .order, #commercials .order2 {
	background: transparent url(images/3.png) no-repeat center center;
}
#video4business .order, #video4business .order2 {
	background: transparent url(images/4.png) no-repeat center center;
}
#clients .order, #clients .order2 {
	background: transparent url(images/5.png) no-repeat center center;
}
#contact .order, #contact .order2 {
	background: transparent url(images/6.png) no-repeat center center;
}
#company.current .order,
#film-projects.current .order,
#clients.current .order,
#video4business.current .order,
#commercials.current .order,
#contact.current .order,
#company.current .order2,
#film-projects.current .order2,
#clients.current .order2,
#video4business.current .order2,
#commercials.current .order2,
#contact.current .order2 {
	background: transparent url(images/0.png) no-repeat center center;
}

.content p {
	font-size:13px;
} 

.content .txt a {
	color:#3d3d3d;
	text-decoration:none;
} 

.content .txt a.read_more {
	clear:both;
	float:right;
	font-size:12px;
}

.content .txt a:hover {
	color:#3d3d3d;
	text-decoration:underline;
} 

strong {
	font-weight:bold;
}

.content {
	margin-bottom:5px;
	background-color:#fff;
}

	.section {
		clear: both;
		margin-bottom:5px;
	}
	.section .header {
		height: 55px;
		background: transparent url(images/1px-white-60.png);
		cursor: pointer;
		margin-bottom: 5px;
	}
	.section .header2 {
		height: 40px;
		background: transparent url(images/1px-white-60.png);
		cursor: pointer;
		margin-bottom: 5px;
	}
	.section.hover .header, .section.hover .header2 {
		background-image: url(images/1px-white-80.png);
	}
	.section.current .header, .section.current .header2 {
		background-image: url(images/1px-black-80.png);
		color: #FFF;
	}
	.section .order {
		width: 30px;
		height: 55px;
		float: left;
		margin-left: 15px;
		display: inline;
		text-align: center;
		line-height: 55px;
		margin-right: 10px;
	}
	.section .order2 {
		width: 30px;
		height: 40px;
		float: left;
		margin-left: 15px;
		display: inline;
		text-align: center;
		line-height: 40px;
		margin-right: 10px;
	}
	.section h1 {
		padding-top: 10px;
		text-transform: lowercase;
	}
	.section h1.notext {
		padding-top: 8px;
		text-transform: lowercase;
	}
	.section .title {
		font-size: 20px;
		display: block;
	}
	.section .title-sd {
		font-size: 10px;
		display: block;
	}
	.section .content {
		padding:0px 4px 0px 0px;
		width:100%;
		height:100%;
	}
	.content p {
		line-height: 20px;
	}
	.content .project {
		display: inline;
		float: left;
		width: 245px;
		height: 190px;
		cursor: pointer;
		margin: 10px 0px;
		text-align: center;
	}
	.content .video {
		margin: 5px 10px;
		display: inline;
		float: left;
		cursor: pointer;
		border: 5px solid #3d3d3d;
		background: #3d3d3d;
	}
		.content .video-info {
			background: #3d3d3d;
			font-size: 11px;
			padding-left: 3px;
			color: #FFF;
			font-weight: bold;
			line-height: 16px;
			padding-bottom: 5px;
			text-align:left;
		}
	.content .project img {
		width: 216px;
		height: 135px;
	}
	.content .project h2{
		font-size: 11px;
		font-weight: bold;
		line-height: 26px;
		padding-left: 15px;
		text-align: left;
	}
	
div.scrollable {
	position:relative;
	overflow:hidden;
	width: 460px;
	height: 240px;
	margin: 0 auto;
	float:left;
}

.fleft {
	float:left;
}

div.video-desc {
	text-align:left;
	width: 180px;
	margin: 5px 10px;
}

div.scrollable div.items {	
	width:20000em;	
	position:relative;
	clear:both;
}

.prev, .less{
	cursor:pointer;
	float:left;
	font-size: 12px;
	font-weight:bold;
	color:#3d3d3d;
	display:block;
	width:18px;
	height:18px;
	background:transparent url('images/left.png') no-repeat;
	margin-top:90px;
}

.next, .more{
	cursor:pointer;
	float:right;
	font-size: 12px;
	font-weight:bold;
	color:#3d3d3d;
	width:18px;
	height:18px;
	display:block;
	background:transparent url('images/right.png') no-repeat;
	margin-top:90px;
}

.prev:hover, .less:hover{
	background:transparent url('images/left.png') no-repeat 0 -18px;
	text-decoration:underline;
}

.next:hover, .more:hover {
	background:transparent url('images/right.png') no-repeat 0 -18px;
	text-decoration:underline;
}

.navi {
	width:460px;
	clear:both; 
	margin:0 auto;
}

.scroller {
	width:500px; 
	/*width:465px;*/
}
.projects-container{
	width:460px;
	margin:0px auto;
	position:relative;
}

/*
html*.scroller {
	width:465px;
}
*/
.disabled {
	visibility:hidden;
}

.shortdesc{
	width:500px; 
}

.txt {
	padding:5px 20px 0px 20px;
	margin-left:5px;
}
.texter {
	text-align:justify;
}

.image {
	float:right; 
	margin-left:10px;
}

.image img {
	border:8px solid #fff;
	margin-right:13px;
}

input.field { background:#ccc; font-family:Tahoma, Arial, Helvetica, sans-serif; font-size:9pt; color:#333333; border:0px; padding:2px; margin-top:5px; }

input.submit { background:#36587b; font-family:Tahoma, Arial, Helvetica, sans-serif; color:#fff; padding:3px 5px; border:0px; margin-top:5px; cursor:pointer; }