/*------------------------------------------------------------------
[Master Stylesheet]
Project:    	Pixel Supply
Version:    	0.1
Last change:    23-01-2011
Author:   		Rudy Mens
Changed:		-
-------------------------------------------------------------------*/

@import "reset.css";
@import "master.css";
@import "content.css";
@import "jsocial.css";

body {
	background:url(images/bg.png) repeat-x;
	background-color: #222;
	font-family: Arial, sans-serif;
	font-size:13px;
	text-align:left;
	line-height:15px;
	color:#fff;
}
.topbar{height:100px;padding-top:10px;}
.topbar h1{color:#eeebe5;font-size:32px;font-weight:normal;float:left;}
.topbar-menu ul{padding-top:50px;list-style:none;width:660px;float:right;}
.topbar-menu li a:link,.topbar-menu li a:visited,.topbar-menu li a:active{
	float:left;
	text-decoration:none;
	list-style:none;
	padding-left:7px;
	padding-right:10px;
	font-size:18px;
	text-transform:uppercase;
	letter-spacing:-1px;
	color:#eeebe5;
	height:30px;
	font-family:Times;
}
.topbar-menu li a:hover {color:#2595a5;text-decoration:none;}
.topbar-menu li .bar{
	margin-top:-1px;
	height:19px;
	width:2px;
	overflow:visible;
	margin-right:5px;
	float:left;
}
.bluebar{background-color:#2595a5;}
.orangebar{background-color:#d28235;}
.greybar{background-color:#ccc;}
.greybar:hover{background-color:#0084ff;}
.frontlogo{background:url(images/logofront.png) no-repeat;}

.big_frame {
	width: 950px;
	min-height:500px;
	margin: 0 auto;
}
div.container {
	width:900px;
	margin: 0 auto;
	text-align: left;
}
#header{
	font-family:Helvetica;
	font-size:40px;
	color:#96dd00;
	margin-top:20px;
}

.tekst{
	background-position:right;
	height:150px;
	width:500px;
	padding-top:150px;
	padding-left:500px;
}
#slider-wrapper{
	width:600px;
	float:left;
	margin-bottom:-30px;
}
#slider-sidetext{
	width: 250px;
	float:left;
	margin-left:50px;
}
#slider-description{
	width: 600px;
	margin-top:-50px;
	font-family:arial;
	line-height:20px;font-size:14px;
}
#slider-description h2{
	text-align:left;
	letter-spacing:0;
	margin-bottom:5px;
	color:#eeebe5;
	font-size:20px;
}
#content{
	padding-top:50px;
	font-family:arial;
	font-size:12px;
	min-height:150px;
}
#content .block{
	margin-left:60px;
	width:250px;
	float:left;
	border-bottom:2px solid #aaa;
	padding-bottom:10px;
}
#subcontent{
	clear:both;
}
#subcontent .bottom{
	width:400px;
	margin-left:60px;
	
}
#subcontent .bottom h1{
	font-family:georgia;
	font-style:italic;
	color:#333;
	padding-bottom:10px;
}
#collecties{
	margin-top:10px;
}
#collecties .colimage{
	height:100%;
	margin-right:10px;
	margin-top:30px;
	background-color:#cbc9c9;
	border:1px solid #cbc9c9;
	color:#333;
	padding:3px 3px 10px 3px;
	float:left;
	-moz-box-shadow:0px -1px 5px #000;
	-webkit-box-shadow:0px 0px 5px #000;
	box-shadow:0px 0px 5px #000;
}
#collecties .colimage:hover{
	background-color:#eee;
}
#collecties .colimage img{
	border:1px solid #333;
	height:125px;
	margin-bottom:2px;	
}
#collecties .colimage a:link, .colimage a:visited{
	color:#000;
	text-decoration:none;
}
#collecties .colimage a:active{
	color:#333;
	text-decoration:none;
}
.port{
 float:left;
 width:320px;
 height:400px;
 margin-left:100px;
}
.port .imageholder{
	background: url(images/designBg.png) no-repeat;
	padding:10px 0 0 10px;
	height:220px;
	width:320px;
}
.port .text{
	width:300px;
	margin-left:10px;
}
.port h1 a:hover{color:#068ff9;text-decoration:underline;}
.port span{color:#666;font-size:12px;}

.spacer{
	min-height: 100px;
}
#footer{
	clear:both;
	background: url(images/footer_spacer.png) repeat-x;
	background-color:#2e2725;
	min-height:100px;
	width:100%;
	color:#fff
}
#footer .container{
	width:950px;
}
#footer .col{
	width:300px;
	float:left;
	text-align:left;
	padding-right:30px;
	color:#ccc;
}
#footer h3{font-family:Arial;font-size:1.34em;color:#eeebe5;margin-top:20px;font-weight:normal;}
#footer ul{list-style:none;}
#footer a:link, #footer a:visited {color:#fff;text-decoration:none;}
#footer a:hover {color:#2595a5;}
#footer img{padding-right:10px;height:100px;}

.clear{clear:both;}
.left{float:left;}
.right{float:right;}

.DemoButton {
	background: #96c518;
	color:#fff;
	display: inline-block;
	outline:none;
	cursor:pointer;
	text-align:center;
	text-decoration:none;
	font: 16px Arial;
	padding: .5em 2em .55em;
	text-shadow:0 1px 1px rgba(0,0,0,.3);
	-webkit-border-radius: .5em;
	-moz-border-radius: .5em;
	border-radius: .5em;
	-webkit-box-shadows: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadows: 0 1px 2px rgba(0,0,0,.2);
	box-shadows: 0 1px 2px rgba(0,0,0,.2);
}
.DemoButton:link {
	color:#fff;
	text-decoration:none;
	background: #96dd00;
	cursor: pointer;
}
.DemoButton:hover {
	background: #96dd00;
	cursor: pointer;
}
.DemoButton:active {
	background: #96ee00;
	cursor: pointer;
}
.contactformbutton input[type="submit"] {
	background:url(contact_files/img/submit.png) no-repeat;
	border:1px;
	border-color:#0C0;
	text-indent:25px;
	padding: 10px 8px;
	cursor: pointer;
}
.contactformbutton input[type="reset"] {
	background:url(contact_files/img/cancel.png) no-repeat;
	border:1px;
	border-color:#0C0;
	text-indent:25px;
	padding: 10px 8px;
	cursor: pointer;
}
.contactformbutton input, .contactformbutton textarea, .contactformbutton select { border: 1px solid #9C3; }
.contactformbutton input[type="radio"] { border: none; }
.contactformbutton input:focus, .contactformbutton textarea:focus { border: 1px dashed #9C3; }
.contactformbutton input.error, .contactformbutton textarea.error { border: 1px dashed #F93; }
form.contactme label {
	display: inline-block;
	width:120px;
	line-height: 1.8;
	vertical-align: top;
	cursor: hand;
	color: #666;
}