/*

	STUDIOWEB.NL
	VERSION 2.0
	
	CONTENTS ----------
	
	   BODY
	   DEFAULT STYLING
	   FORMS
	   LAYOUT
	   NAVIGATION
	
    -------------------
    
    COLOURS -----------
    
        green #513988
        blue #004f79
        white #ffffff
    
    -------------------
	
*/

@import url(reset.css); /* RESET CSS */
@import url(fancybox.css);

/* BODY
---------------------------------------------------------------------- */

/* LAYOUT BASIC */
html, body {
	min-height: 100%;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}
* {
	margin: 0px;
	padding: 0px;
}
body {
	margin: 0;
	padding: 0;
	min-width: 807px;
	text-align: left;
	background:#929292;
}
* html body {
	behavior: url("../js/csshover.htc");
}


/* DEFAULT STYLING
---------------------------------------------------------------------- */
body {
	font: normal 12px Helvetica, Arial, sans-serif;
	line-height: 18px;
	color:#71716f;
}
body table, table p {
	font-size: 100%;}
	
p, div, h1, h2, h3, h4, ul, li, form, input, select, option {
	margin:					0;
	padding:				0;
}
p {
	margin-bottom: 12px;
}
strong {
	font-weight: bold;}
em {
	font-style: italic;
}
.small {
	line-break: 14px;
	font-size: 11px;}
.blue, .blue * {
	color: #0055a0;
}
.red, .red * {
	color: #ce0019;
}
.white {
	color: white;
}

a {
	color: #ce0019;
	border-bottom: 1px solid transparent;
	text-decoration: none;
}
a:hover, a.active {
	color: #ce0019;
	border-bottom: 1px dotted #ce0019;
	text-decoration: none;
}
a.active {
	color: #ce0019;
}

/* heading */
h1, h2, h3, h4, h5, h6, p {
	margin: 0;
	padding: 0;
	font-weight: normal;
}
h1 {	
	margin: 1px 0 1px 0;
	display: block;
	font-size: 21px;
	line-height:23px;
	color: #0055a0;
}
h2 {
	display: block;
	font-size: 16px;
	text-align:left;
	line-height: 18px;
	color:  #0055a0;
}
h2 a {
	color:  #0055a0;
}
h3 {
	display: block;
	font-size: 16px;
	text-align:left;
	line-height: 18px;
	color:  #0055a0;
}
h4 {
	display: block;
	font-size: 15px;
	text-align:left;
	line-height: 17px;
	color:  #0055a0;
}
h5 {
	display: block;
	font-size: 12px;
	line-height: 14px;
	font-weight: bold;
	text-align:left;
	color:  #0055a0;
}
h6 {
	display: block;
	font-size: 12px;
	line-height: 14px;
	font-weight: bold;
	text-align:left;
	color:  #ce0019;
}

.button-black {
	background: url("../img/btn_black.png") bottom right no-repeat;
	display: inline-block;
	font-size: 12px;
	line-height: 13px;
	padding: 8px 45px 7px 10px;
}

/* specific styles */
.date {
	color: #ce0019;
}
.price {
	color: #0055a0;
	font-size: 21px;
}
.bread-text {}
.link a{
	color: #ce0019;
	font-style: italic;
}
.link a:hover{
	color: #ce0019;
}
.bold {
	font-weight: bold;
}
.normal {
	font-weight: normal;
}
.uppercase {
	text-transform: uppercase;
}
.inline {
	display: inline;
}
.block {
	display: block;
}
/* lists */
ul, ol {
	margin: 10px 20px;
	padding: 0 20px;
}
ul { 
	list-style: circle;
}
dl { padding: 10px; margin: 0; }

dt {
  font-weight: bold;
  color: #79A62E;
}
dd {
  padding-left: 25px; 
}
ul {
	margin: 9px 0 9px 22px;
	padding: 0;
	line-height: 17px;
}

ul.sites { 
	list-style: none;
	list-style-type: none;
	margin:0px 0px; 
	padding:0 0 0 0px; 
	width: 200px;
}
ul.sites li { 
	margin: 0; 
	padding: 0; 
}
ul.sites a { 
	display:block; 
	padding-left:21px; 
	padding-top:3px; 
	padding-bottom:3px; 
	border: 0;
	background: url("../img/arrow_square_blue.png") 0px 4px no-repeat; 
	font-size: 14px;
	line-height: 16px;
	color: #0055a0;
}
ul.sites a:hover,ul.sites a.active { 
	background-image: url("../img/arrow_square_red.png");
	text-decoration: none;
	border: 0;
} 

/* blockquote, img, hr */
blockquote, pre {
	padding: 10px 30px;
}
blockquote {
	font: italic 12px Georgia, Times, serif;
	margin: 8px 0;
}
* html ul, * html ol {
	margin-left: 22px;
}
img {
	margin: 0;
	padding: 0;
	border-color: #fff;
}
a:hover {
	border-color: transparent;
}
.pointerhand {
	cursor: pointer;
}
hr {
	border: solid #fff 0px;
	border-top-width: 1px;
	height: 0px;
	padding: 0px;
	line-height: 0px;
	margin-top: 4px;
	margin-bottom: 4px;
}
div.page-hr, div.hr, div.hr2 {
	background: url("../img/ruler.png") 0px 7px repeat-x; 
	clear: both;
	margin: 0;
	height:15px;}
div.hr2 {
	background-position: 0px 10px;
	height: 21px;}
div.page-hr {
	background-position: 0px 5px;
	height: 10px;}
div.page-hr hr,div.hr hr,div.hr2 hr {
	margin: 0;
	display:none}

/* images */
img {}
img.right {
	float: right;
  	margin: 5px 0px 10px 10px;  
}
img.left {
	float: left;
  	margin: 5px 10px 10px 0px;
}
img#loading_bar {display: none;}


code {
  	margin: 5px 0;
  	padding: 15px;
  	text-align: left;
  	display: block;
  	overflow: auto;  
  	font: 500 1em/1.5em 'Lucida Console', 'Courier New', monospace;
  	/* white-space: pre; */
  	border: 1px solid #EEE8E1; 
	background: #FAF7F5;
}
acronym {
	cursor: help;
	border-bottom: 1px dotted #895F30;
}
blockquote {
	margin: 15px 10px;
 	padding: 5px 7px 5px 40px;  	
	font-weight: normal;
	font-size: 17px;
	line-height: 1.6em;
	font-style: italic;
	font-family: Georgia, 'Times New Roman', Times, serif;		
	color: #80614D;	
	border: 1px solid #EEE8E1; 
}


/* LAYOUT
---------------------------------------------------------------------- */
#wrapper {
	background:#333330;
	border: 0;
	position: relative;
	margin: 0 auto;
	text-align: left;
	width: 1024px;
	min-height: 100%;
	height: auto;
	background:url(../img/wrapperbg.png) top left repeat-y;
}
 html #wrapper {
	height: 100%;
}
html>body #wrapper {
	height: auto;
}
#header {
	background: url('../img/header.png') 0px 0px no-repeat;
	position: relative;
	width: 990px;
	margin: 0;
	padding: 14px 0 0 10px;
	text-align: left;
	clear: both;
}

#logo{
	position: absolute;
	top: 55px;
	left: 22px;
	z-index: 10;
}

#content {
	width: 1024px;
	margin: 0;
	min-height: 600px;
	padding: 0x 0 0 0;
	text-align: left;
	}
#content-left{
	position:relative;
	float:left;
	margin:0;
	padding:0;
	width:252px;
	min-height:600px;
	display:none;
}
#content-center{
	position:relative;
	float:left;
	margin:0;
	padding:6px;
	width:508px;
	min-height:600px;
}
#content-right{
	position:relative;
	float:left;
	margin:0;
	padding:0;
	width:252px;
	min-height:600px;
	display:none;
}
#logo{
	position:absolute;
	margin:0;
	padding:0;
	width:252px;
	height:77px;
	top:0px;
	left:0px;
	background:url(../img/logo.png) top left no-repeat;
	
}
#logo a {
  display:block;
  width:100%;
  height:100%;
  text-decoration:none;
}

.clear {
	clear: both;
	height: 0px;
	line-height: 0px;
	font-size: 0;
}
#sidebarleft{
	position:relative;
	margin:0;
	padding:0;
	width:237px;
	padding-top:110px;
	padding-left:15px;
}
#leftmenu {
	position:relative;
	margin:0;
	padding:0;
	width:237px;
	padding-bottom:40px;
	background:url(../img/leftseperator.png) left bottom no-repeat;
}
#news{
	position:relative;
	margin:0;
	padding:0;
	width:237px;
	padding-bottom:40px;
	min-height:280px;
	background:url(../img/leftseperator.png) left bottom no-repeat;
}
#address{
	position:relative;
	margin:0;
	padding:0;
	width:237px;
	padding-bottom:40px;
	padding-top:27px;
	
}
#search{
	position:relative;
	margin:0;
	padding:0;
	width:237px;
	padding-bottom:40px;
	background:url(../img/leftseperator.png) right bottom no-repeat;
	min-height:56px;
}
#submenu {
	position:relative;
	margin:0;
	padding:0;
	width:202px;
	margin-left:34px;
	margin-top:11px;
	padding-bottom:20px;
	background:url(../img/leftseperator.png) right bottom no-repeat;
}
#submenu a{
	display:block;
	width:93px;
	height:97px;
	float:left;
	color:#000;
	font-size:10px;
	background-color:#fff;
	padding-left:8px;
	padding-bottom:4px;
}
#submenu img{
	border:0;
	margin-left:-8px;
}

#submenu a:hover {
	color:#f0b510;
}
#banner{
	position:relative;
	margin:0;
	margin-top:20px;
	padding:0;
	width:79px;
	height:29px;
}
#bigmenu a{
	position:relative;
	float:left;
	display:block;
	margin:0;
	padding:0;
	width:239px;
	height:200px;
	padding-left:15px;
	color:#000;
}
#bigmenu img{
	margin-left:-15px;
}
#bigmenu a:hover{
	color:#f0b510;
}
#back {
	position:relative;
	margin:0;
	padding:0;
	height:35px;
	text-align:right;
	padding-right:15px;
	background:url(../img/bigseperator.png) bottom center no-repeat;
	font-size:11px;
	
}
#back a{
	color:#000;
	margin-top:4px;
	font-size:10px;
	cursor: pointer;
}
#back a:hover{
	color:#f0b510;

}
#head{
	position:relative;
	margin:0;
	padding:0;
	padding-left:15px;
	background:url(../img/bigseperator.png) bottom center no-repeat;
}
#head h1 {
	font-size:38px;
	margin:0;
	padding:0;
	color:#000;
	height:55px;
	line-height:55px;
	font-weight:bold;
	
}
#head .littlesub {
	position:absolute;
	list-style:none;
	right:15px;
	top:16px;

}
#head .littlesub li{
	float:left;
	margin-left:12px;
}
#head .littlesub li a{
	font-size:10px;
	color:#000;
	
}
#head .littlesub li:hover a{
	color:#f0b510;
	
}
#content-body{
	position:relative;
	margin-top:20px;
	padding-left:15px;
	color:#000;
	padding-bottom:40px;
	background:url(../img/bigseperator.png) bottom center no-repeat;
}
#content-body h1{
	font-size:20px;
	color:#000;
	margin-bottom:10px;
}
#cat-menu {
	position:relative;
	margin-top:4px;
	padding-bottom:10px;
	background: url(../img/bigseperator.png) bottom center no-repeat;
}
#cat-menu a{
	position:relative;
	float:left;
	display:block;
	margin:0;
	padding:0;
	width:239px;
	height:200px;
	padding-left:15px;
	color:#000;
}
#cat-menu img{
	margin-left:-15px;
}
#cat-menu a:hover{
	color:#f0b510;
}
#print {
	position:relative;
	margin:0;
	padding:0;
	height:35px;
	text-align:right;
	font-size:11px;
	padding-right:15px;
	padding-top:8px;
}
#print a{
	color:#000;
	margin-top:4px;
	font-size:10px;
	cursor: pointer;
}
#print a:hover{
	color:#f0b510;

}
/* NAVIGATION
---------------------------------------------------------------------- */
#leftmenu ul{
	list-style:none;
	width:237px;
	margin:0;
	padding:0;	
}
#leftmenu ul li{


}
#leftmenu ul li a{
	text-decoration:none;
	color:#71716f;
	line-height:14px;
}
#leftmenu ul li:hover a{
	color:#f0b510;
}
/* FORMS
---------------------------------------------------------------------- */
form {
	margin: 0; 
}
form {
	margin: 0;
	padding: 0;
	font-size: 100%;
}
form p {
	margin-bottom: 1px;
}
fieldset {
	clear: both;
	font-size: 100%;
	background-color: #dde8f2;
	border-color: #0055a0;
	border-width: 1px 0 0;
	border-style: solid none none;
	padding: 3px 10px;
	margin: 0;
}
fieldset legend {
	margin-left: -2px;	
	font-size: 16px;
	font-weight: normal;
	color: #0055a0;
	margin: 0 0 0 0;
	padding: 0 3px 8px 3px;
}
label.float-left{
	float: left;
	clear: left;
	text-align: left;
	width: 200px;
	font-size: 12px;
	padding-top: 1px;
}
.fieldset-content {
	float: left;
	width: 285px;
}	
label {
	padding: 3px 0;
	font-size: 100%;
}

label.error {
	color: red;
}
label u {
	font-style: normal;
	text-decoration: underline;
}
input, select, textarea {
	font-family: Arial, sans-serif;
	color: #0055a0;
	margin: 1px 2px;
	padding: 3px;
	font-size: 12px;
}
input.error, input.error:focus {
	border: 1px dotted red;
}
/*input:focus, select:focus, textarea:focus {
	color: #393936;
	border-color: #393936;
}*/
input.submit, input.button {
	background: #023e63;
	color: white;
	padding: 2px 4px;
}
textarea {
	overflow: auto;
}
.activeField
{
        background-image: none;
        background-color: #ffffff;
        border: solid 1px #0055a0;
}
.idle
{
    border: solid 1px #6a9cc8;
    background-image: url('../img/blue_bg.png');
    background-repeat: repeat-x;
    background-position: top;
}

input.input-text {
	width: 160px;
}
input.input-text-30 {
	width: 30px;
}
input.input-text-50 {
	width: 50px;
}
.text-format {
	background: transparent;
	margin: 0;
	padding: 0;
	border: none;
}
.comment-form {
	width: 460px;
}
.input-comment {
	width: 460px;
}
.filter-menu select, .filter-menu input {
	width: 200px;
	margin: 4px 0;
}
.filter-menu input {
	width: 196px;
}

/* MISCELLANEOUS
---------------------------------------------------------------------- */

.sidebox1 {
	width:266px;
	margin-bottom: 20px;
	height:auto;
	margin-left:16px;
	background: url('../img/sidebox-wrapper.png') bottom left repeat-y;
}
.sidebox2 {
	width:266px;
	margin-bottom: 20px;
	margin-left:16px;
	height:auto;	
}

.sidebox1 .sidebox-bodywrap{
	width:266px;
	height:auto;
	min-height: 169px;
	border-top: 1px #dddfe0 solid;
}
.sidebox1 .sidebox-item{
	position: relative;
	min-height:22px;
	background: url('../img/sidebox1-item-bg.png') bottom left no-repeat;
}
.sidebox1 .sidebox-image{
	float: left;
	width:110px;
}
.sidebox1 .sidebox-image img{
	display: block;
	position: relative;
	border: none;
}
.sidebox1 .sidebox-body{
	padding: 2px 5px;
}

.sidebox1 .sidebox-item.firstitem{
	padding-left:1px;
	min-height:102px;
	background: url('../img/sidebox1-firstitem-bg.png') bottom left no-repeat;
}
.sidebox1 .sidebox-item.lastitem{
	padding-left:1px;
	width:266px;
	min-height:22px;
	background: url('../img/sidebox1-lastitem-bg.png') bottom left no-repeat;
}


.sidebox1-link2{
	width:266px;
	height:auto;
	background:  #fff url('../img/sidebar-wrapper.png') top left repeat-y;
}
.sidebox1-link2-body{
	width:266px;
	height:auto;
	background:  url('../img/sidebox-bottom.png') bottom left no-repeat;
}

.sidebox-top div{
	padding: 3px 0 0 5px;
	font-size: 14px;
	font-weight: bold;
	color: #fff;
}
.sidebox-top {
	min-height:26px;
	width:264px;
	height:auto;
	border-left:1px #dddfe0 solid;
	border-right:1px #dddfe0 solid;
	background: url('../img/sidebox-top.png') top left repeat-x;
}

.sidebox2 .sidebox-body{
	width:266px;
	height:auto;
	background:  #fff url('../img/sidebox-wrapper.png') top left repeat-y;
}
.sidebox2 .sidebox-item{
	position: relative;
	min-height: 38px;
	background: url('../img/sidebox-item-bg.png') bottom left no-repeat;
	padding: 4px 5px;
}
.sidebox2 .sidebox-item.lastitem{
	position: relative;
	min-height: 38px;
	background: url('../img/sidebox-item-bg-last.png') bottom left no-repeat;
	padding: 4px 5px;
}
.sidebox-link{
	position: absolute;
	right: 5px;
	bottom: 3px;
	padding-right:10px;
	background: url('../img/li.png') right 7px no-repeat;
	color:#ed1c25;
}


/* frontpage */
#frontpage{}
#frontpage h1 {
	margin-bottom: 1px;
}

#frontpage .col-s {
	width: 170px;
	margin-right: 15px;
}
#frontpage .col-s p{
	margin-bottom: 0px;
}

/* portfolio */

.portfolio-item {
	display: block;
	margin-bottom: 12px;
	text-align: left;
}
.portfolio-item .inner{
	background: #e3e9f2;
	padding: 8px 9px 2px 9px;
}
.portfolio-item.odd {
	margin-left: 0;
	clear: left;
}
.portfolio-item .portfolio-image{
	float: left;
	width: 210px;
	min-height: 120px;
}
.portfolio-item .portfolio-image img{
	display: block;
	border: 0;
}
.portfolio-item .portfolio-body{
	display: block;
	padding: 5px 10px 5px 10px;
	overflow: hidden;
	border: none;
	border-top: 1px #dddfe0 solid;
	border-bottom: 1px #dddfe0 solid;
	min-height: 110px;
}
* html .portfolio-item .portfolio-body{
	height: 120px; he\ight: 110px;
}
.portfolio-item .portfolio-title{
	display: block;
	padding: 3px 1px 0 1px;
	height: 20px;
	overflow: hidden;
	border: none;
}
.portfolio-customers {
	background: #96b7d1 url("../img/screenshot.png") bottom left repeat-x;
	padding: 10px;
	text-align: left;
}
.portfolio-customers .inner{
	background: #e3e9f2;
	padding: 8px 10px 2px 10px;
}
.portfolio-customers .col{
	float: left;
	padding: 0;
	width: 140px;
}

.portfolio-detail-images {
	float: left;
	width: 350px;
	min-height: 250px;
}
.portfolio-detail-description {
	float: left;
	width: 225px;
}

.portfolio-detail-images .big-photo {
	background: url("../img/screenshot_shadow.png") top left no-repeat;
	width: 340px;
	height: 250px;
	overflow: hidden;
}
.portfolio-detail-images .big-photo img{
	position: relative;
	border: 0;
}
.portfolio-detail-images .thumbnails {
	padding-top: 1px;
}
.portfolio-detail-images .thumbnail {
	float: left;
	width: 84px;
	height: 63px;
}
.portfolio-detail-images .thumbnail img{
	position: relative;
	border: 0;
}
#portfolio .website-url {
	padding-top: 10px;
	padding-left: 55px;
	font-weight: bold;
}
#nav-thumbnails { margin: 0; padding: 0; }
#nav-thumbnails li { 
	width: 84px;height: 63px; float: left; list-style: none }
#nav-thumbnails a { width: 104px; display: block; }
#nav-thumbnails a.activeSlide { }
#nav-thumbnails a:focus { outline: none; }
#nav-thumbnails img { 
	border: none; display: block; 	position: relative;
 }

/* news */
.news{}
.news .news-item {
	display: block;
	background: #fff;
	margin-bottom: 15px;
	height: auto;
}
.news .news-item.firstitem {
	width: 491px;
	height: 238px;
	float: left
}
.news .news-item-inner {
	padding: 10px 15px;
}
.news .news-item-image {
	float: left;
	width: 270px;
	min-height: 150px;
	padding: 0;
}
.news .news-item-body {
	padding: 0;
}
.news .news-item.odd {
	margin-left: 0;
	clear: left;
}
.news .news-item img.news-image{
	border: none;
}
.news .news-item .news-image:hover{}
.news-photo{
	float: left;
	width: 150px;
}
.news-description{
}
.news .news-item .news-body.long{
	width: auto;
}
.news-item h4 a{
	text-decoration: none;
}
.news .news-item .news-date{
	font-weight: bold;
}


/* comments */
.comments{}
.comments .comment-item {
	display: block;
	float: left;
	margin-bottom: 20px;
	padding: 0;
	height: auto;
}
.comments .member-photo{
	background: url("../img/member_photo.png") 0px 0px no-repeat;
	display: block;
	float: left;
	margin-top: 5px;
	width: 90px;
	min-height: 60px;
}
.comments .member-photo img{
	margin: 2px 0 0 2px;
}
.comments .comment-item-inner {
	background: #fff;
	display: block;
	float: left;
	padding: 10px 15px;
	width: 371px;
	overflow-x: hidden;
}
* html .comments .comment-item-inner {
	width: 401px; w\idth: 371px;
}

/* blog */
.blog{
	padding: 10px 15px;
}
.blog .blog-item {
	clear: both;
	padding: 0;
}
.blog .blog-item.odd {
	margin-left: 0;
}
.blog-image{
	float: left;
	width: 140px;
	min-height: 100px;
	text-align: left;
}
* html .blog-image{
	height: 100px
}
.blog-image img{
	display: block;
	border: none;
}
.blog-body{
	float: left;
	margin: 0;
	padding: 0;
	width: 320px;
}
.blog-description{}
.blog .blog-item .blog-body.long{
	width: auto;
}
.blog-item h4 a{
	text-decoration: none;
}


/* standard table */
#content .table {
	border-collapse: collapse;
	margin: 15px 10px;		
}
#content .table th {
	height: 38px;
	padding-left: 12px;
	padding-right: 12px;
	color: #fff;
	text-align: left;
	background: #ADD163;	
	border-width: 1px;
  	border-style: solid;
  	border-color: #C4DE8F #93C138 #93C138 #C4DE8F;	
}
#content .table tr {
	height: 34px;
	background: #fff;
}
#content .table td {
	padding-left: 11px;
	padding-right: 11px;
	border: 1px solid #E7F0CC;	
}	

/* pagination */
.pagination {
	margin: 0 0 5px 0;
	font-size: 12px;
	color: #004f79;
	text-align: left;
}
.pagination.float-right {
	float: right;
}
.pagination a {
    display: block;
    text-decoration: none;
}
.pagination a:hover {
	background-color: white;
	color: #004f79;
}
.pagination a, .pagination span {
    display: block;
    float: left;
    padding: 3px 5px;
    background: #3391ce;
    border: 1px #3391ce solid;
    margin-left: 2px;
    margin-right: 2px;
    color: #fff;
}
.pagination span.current_page {
	background-color: #fff;
	color: #3391ce;
	border-color: #3391ce;
}
.pagination .current.next, .pagination .current.prev {
	color: #004f79;
}