/***********************************************************
	
	screen.css	
	24-01-2011, Jubile Media Solutions

/***********************************************************/

/***********************************************************
    Font size table (px / %)
************************************************************
	10px
	11px 
	12px 
	13px 100%
	14px 107.7%
	15px 115.4%
	16px 123.1%
	24px 184.6%
	44px 275%

/***********************************************************
    Type
***********************************************************/

body, html {
	background: url(../images/bg-container.gif) repeat; 
	font-family: Arial, Verdana, Helvetica, sans-serif;
}

div#wrapper {
	background: url(../images/bg-header.gif) repeat-x top left;
	padding-top: 15px;	
}

div#innerWrapper {
 	background: url(../images/bg-footer.png) no-repeat 50% bottom;
	height:100%;
}

body.homepage div#innerWrapper {

}

div#logIn {
	background: #fff;
	border: 1px solid #414245;
	padding: 10px 20px 10px 30px;
	position: absolute;
	left: -1px;
	top:10px;
		-moz-border-radius-bottomright: 4px;
		-webkit-border-bottom-right-radius: 4px;
		-moz-border-radius-topright: 4px;
		-webkit-border-bottom-top-radius: 4px;
}

div#logIn ul {
	border-top: 1px solid #D6D3CD;
	margin-top: 7px;
	padding-top:7px;
}

div#container {
	font-size:100%;
	margin: 0 auto;
	width: 960px;
}

h1, h2, h3, h4, h5, h6 {
	line-height:1.2em;
	font-family: "Trebuchet MS", Arial;
}

h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .metaInfo a {
	text-decoration:none;
}

h1 {
	font-size:275%;
}

.home h1 {
	display: none;
}

h1 .sectionHeader,
h2 .sectionHeader {
	color:#656262;
}

h2,
ul#listNavigation li,
h3 {
	font-size:123.1%;
	font-weight:normal;
}

.darkBox h2 a,
h4 {
	color: #fff;
	font-size:107.7%;
	font-weight:bold;	
}

h5 {
	font-style:italic;
	font-weight:bold;
}

h6 {
	font-weight:bold;
}

/***********************************************************
   Margins & Padding & Misc
***********************************************************/

div.widget {
	margin-bottom:20px;
}

div#siteContent {
	margin-bottom: 15px;
}

h1, h2, h3, h4, h5, h6 {
	margin:0 0 0.5em 0;	
}

p, blockquote, ul, ol, .formRow {
	margin: 0 0 1em 0;
}

#gallery-1 .gallery-icon img {
	border: 0;
	margin: 0;
}

.alignLeft,
.alignleft {
	float: left;
}

.alignRight,
.alignright {
	float: right;
}

/***********************************************************
    Frame  
***********************************************************/
div#container {
	overflow: hidden;
}

/***********************************************************
    Common elements
***********************************************************/
a, a:visited,
body.home #listNavigation a:hover,
#listNavigation a:hover,
#articleContent a:hover,
div#sideBar a:hover,
div#breadCrumbs ol li a:hover,
div#logIn a:hover,
ul#mainNav li a:hover,
div#mainContent div.postItem a:hover  {
	color: #252522;
	text-decoration: none;
}

/* Hover hover */
a:hover, a:visited:hover, ul#mainNav li a,
ul#listNavigation li a,
ul#quickLinks a:hover,
#articleContent a,
div#sideBar a,
div#breadCrumbs ol li a,
div#logIn a,
.darkBox h2 a:hover {
	color: #009bdb;
}


/* pretty focus for website */
a:focus {
	color: #009bdb;
	outline: 1px solid #009bdb;
}

#logoHeader a,
#logoHeader a:visited,
div#logoHeader div.logoSubText,
.darkBox h2 a,
ul#quickLinks a,
.darkBox .metaInfo a:hover {
	color: #fff;
}

.clearFix {
	overflow: hidden;
	width: 100%;
}

.source, .source strong {
 	font-style:italic;
}

/* common elements */
blockquote {
	border-left: 2px solid #cccccc;
	min-height:40px;
	padding:4px 0 0 20px;
}

/* Form styles */
div.formRow input,
div.formRow textarea {
	background:#fff;
	border:1px solid #414245;
	padding: 5px;
	width: 300px;
}

div.formRow {
	width: 310px;
}

div.formButtons {
	width: 315px;
}

div.formButtons img {
	display: none;
}

div.formButtons input {
	border: none;
	cursor: pointer;
	padding: 0;
	width: auto;
}

div.formRow input:focus,
div.formRow textarea:focus {
	background: #414245;
	border:1px solid #cecece;
	color:#fff;
}

div.formRow span.wpcf7-not-valid-tip {
	background: #ffaaaa;
	border: 1px solid #c40000;
	font-size: 12px;
	left: 320px;
	top: 0;
	width: 275px;
}

form.wpcf7-form div.wpcf7-validation-errors {
	background: #fed899;
	border: 1px solid #df910e;
}
	
/* Buttons */

a.button, input.button, button.button {
	border:none;
	cursor:pointer;
	text-decoration:none;
}

/* Special colors */

.darkBox,
.darkBox .date {
	color:#bababa; /* IE's messup */
}

div.articleContent ul.arrowBullets {
	list-style:none;
	margin:0;
}

div.articleContent ul.arrowBullets li {
	list-style:none;
}

ul.arrowBullets li {
	padding-left:18px;
	background-repeat:no-repeat;
	background-position:-19px -336px;
	
}

/* Art Collection Box homepage */
#artCollectionContainer {
	margin-bottom: 0;
}

div#authorContent p.leadText {
	font-weight: bold;
}

/* Metainfo */
.metaInfo {
	color: #bababa;
	font-size: 85%;
	margin: 4px 0 0;
}

.postItem .metaInfo {
	margin: 0 0 10px;
}

.darkBox .metaInfo a {
	color: #009bdb;
	text-transform: uppercase;
}

/***********************************************************
    Components
***********************************************************/
#accessLinks {
	position: absolute;
	left: -9999px;
}

#quickLinks {
	float: right;
	margin-right: 10px;
}

/* Logo / title header */
div#logoHeader {
	float: left;
	margin-left:10px;
}

div#logoHeader a {
	font-size: 	461.5%;
	line-height: 0.7em;
}

div#logoHeader div.logoSubText {
	font-size: 215.4%;
	font-style: italic;
}


/* Access Links */
#accessLinks {
	text-indent: -9999px;
}

/* Quick links */
ul#quickLinks li {
	display: inline;
	margin: 0 8px 0 0;
}

ul#quickLinks li.logIn a {
	color: #737373;
}

ul#quickLinks li.lastChild {
	margin: 0;
}

/* Main navigation */
ul#mainNav {
	float: left;
	margin: 20px 0 0 10px;
}

ul#mainNav li {
	display: inline;
	float: left;
	margin: 0 25px 0 0;
}

ul#mainNav li a {
	font-size: 123.1%;
	display: block;
	padding: 6px 0 8px;
}

ul#mainNav li.current_page_item a,
ul#mainNav li.current_page_parent a,
ul#mainNav li.current_page_ancestor a {
	background: url(../images/bg-navigation-active.png) no-repeat bottom center;
	font-weight: bold;
}

ul#mainNav li a:hover {
	background: url(../images/bg-navigation-active.png) no-repeat bottom center;

}

/* Subnavigation */
ul#subNavigation li.current_page_item  a,
ul#subNavigation li.current_page_parent a,
ul#subNavigation li.current_page_parent ul.children li.current_page_item a ,
ul#subNavigation li.current-cat  a {
	font-weight: bold;
}

ul#subNavigation li.current_page_item ul.children a,
ul#subNavigation li.current_page_parent ul.children a {
	font-weight: normal;
}

ul#subNavigation ul {
	margin: 0;
}

ul#subNavigation ul li {
	background: url(../images/sprite.png) no-repeat;
	background-position: 0 -532px;
	border: none;
	font-weight: normal;
	padding: 0 0 0 10px;
	margin: 5px 0 0;
}

ul#subNavigation li ul {
	display: none;
}

ul#subNavigation li.current_page_item ul.children,
ul#subNavigation li.current_page_ancestor ul.children {
	display: block;
}

/* Breadcrumbs */

div#breadCrumbs {
	background: url(../images/box-breadcrumbs.png) no-repeat left top;
	padding: 12px 20px 8px;
}

div#breadCrumbs ol li {
	background: url(../images/sprite.png) no-repeat;
	background-position: 0 -532px;
	display: inline;
	padding: 0 0 0 10px;
}

div#breadCrumbs ol li.current_item{
	background-position: 0 -565px;
}

div#breadCrumbs ol li.noArrow {
	background:none;
	padding-left:0;
}

/* Theme navigation */
ul#listNavigation  {
	background: url(../images/bg-listnavigation.png) top right no-repeat;
	width: 960px;
}

ul#listNavigation li {
	display: block;
	float: left;
	height: 35px;
	margin: 0 20px 0 0;
	padding: 15px 0 0;
	text-transform:uppercase;
}

ul#listNavigation li a {

}

ul#listNavigation li.noArrow {
	margin: 0 40px 0 20px;	
}

/* Sliding door fields */
.squareBox .sdContent {
	padding: 20px;
}

div.whiteBox320 .sdContent,
div.whiteBox640 .sdContent {
	padding: 10px 20px;
}

.home div.whiteBox320 .sdContent {
	min-height: 285px;
}

div.whiteBox320 .sdContent {
	background: url(../images/box-sd-top-white.png) 0 -9px no-repeat;
}

div.whiteBox320 {
	background: url(../images/box-sd-bottom-white.png) 0 bottom no-repeat;
}

div.whiteBox640 .sdContent {
	background: url(../images/box-640-sd-top-white.png) 0 -7px no-repeat;
}

div.whiteBox640 {
	background: url(../images/box-640-sd-bottom-white.png) 0 bottom no-repeat;
}


/* Box variations */
.darkBox {
	background:url(../images/box_gridart_220.png) 0 0 no-repeat;
}

/* White box */
div.whiteBox320 h3 {
	color: #009bdb;
	border-bottom: 1px solid #009bdb;
	margin-bottom:10px;
	padding-bottom:5px;
}

div.whiteBox320 img {
	float: left;
	margin: 0 10px 10px 1px;
	-webkit-box-shadow: 2px 2px 2px #D6D3CD;
	-moz-box-shadow: 2px 2px 2px #D6D3CD;
}

div.whiteBox320 ul li {
	border-bottom: 1px solid #d6d3cd;
	margin-bottom:8px;
	padding-bottom:7px;
}

div.whiteBox320 ul li span.articleMetaInfo {
	color: #bcbab9;
	float: right;
}

div.readMore {
	text-align: right;
	margin-bottom: 10px;
}

div.readMore a,
div.readMore input {
	background: url(../images/sprite.png) no-repeat;
	background-position: 0 -48px;
	color:#ffffff;
	font-size: 85%;
	padding: 4px 7px 4px 8px;
}

div.readMore a:hover,
div.readMore input:hover {
	background-position: 0 -88px;
	color:#ffffff;
}

div#mainContent div.postItem div.readMore a {
	color:#ffffff;
	text-decoration: none;
}

/***********************************************************
    Big blue buttons, jummie 
***********************************************************/
span.button a {
	background: url(../images/sprite.png) no-repeat;
	background-position: 0 -130px;
	display:block;
	text-indent: -9999px;
	overflow: hidden;
	padding: 7px;
}

span.button.sellArt a:hover {
	background-position: 0 -180px;
}

span.button.workShop a {
	background-position: 0 -229px;
}

span.button.workShop a:hover {
	background-position: 0 -279px;
}

span.button.openDoor a {
	background-position: 0 -329px;
}

span.button.openDoor a:hover {
	background-position: 0 -379px;
}

span.button.workPlace a {
	background-position: 0 -429px;
}

span.button.workPlace a:hover {
	background-position: 0 -479px;
}

/***********************************************************
    Make up - making everything much pretty
***********************************************************/
div#articleContent img {
	background: url(../images/background-images-contentpage.gif) no-repeat bottom left;
	padding-bottom: 7px;
}

div#articleContent ul li,
div#articleContent ol li {
	background: url(../images/sprite.png) no-repeat;
	background-position: 0 -532px;
	padding: 0 0 0 15px;
}

div#articleContent ol li {
	background-position: 0 -565px;
}

div.articleFooter {
	border-top: 1px solid #D6D3CD;
	margin-bottom: 15px;
	padding-top:14px;
}

div.articleFooter .articleFunctions {
	float: right;
}

div.articleFooter a.goUp,
div.articleFooter a.print,
div.articleFooter a.email {
	background: url(../images/sprite.png) no-repeat;
	background-position: 0 -532px;
	padding: 0 0 0 25px;
}

div.articleFooter a.print {
	background-position: 0 -809px;
	margin: 0 20px 0 0;
}

div.articleFooter a.email {
	background-position: 0 -843px;
}

div.articleFooter a.goUp {
	background-position: -1px -876px;
	padding: 0 0 0 19px;
}

/* Archief */
body.archive div#articleContent ul li {	
	background: none;
	padding: 0;
}

body.archive div#articleContent ul li span.date {
	border-right: 1px solid #bfbfbf;
	float: left;
	line-height:21px;
	margin: 0 20px 0 0;
	padding: 0 20px 0 0;
	text-transform:uppercase;
	width: 100px;
}

/* Post */
.postItem {
	overflow: hidden;
} 

div#mainContent div.postItem a,
div#mainContent div.postItem p a {
	color:#009bdb;
}

div#mainContent div.postItem p a {
	text-decoration: underline;
}

div#mainContent div.postItem p a:hover {
	text-decoration: none;
}

div#mainContent div.postItem p,
div#mainContent div.postItem ul li {
	line-height: 18px;
}

div.postItem img {
	margin: 0 20px 10px 0;
}

div#mainContent div.postItem strong {
	font-weight: bold;
}


div#mainContent div.postItem em {
	font-style:italic;
}

.categoryThumb {
	margin: 0 0 10px;
}

.postThumb {
	width: 200px;
}

/***********************************************************
    Footer
***********************************************************/
div#footer {
	min-height: 460px;
}

div#footer,
div#footer a {
	color:#fff;
}

div#footer a:hover {
	color:#009bdb;
}

div.boxListItems {
	margin-top: 15px;
}

div.boxListItems div.box {
	margin-bottom: 20px;
}

div#footer ul {
	margin: 0;
}

div#footer div ul li {
	padding: 5px 0;
}

div#footer div ul ul li {
	font-weight: normal;
}

div#footer div ul ul li a,
a#twitterIcon,
div#mainContent div.postItem ul li {
	background: url(../images/sprite.png) no-repeat;
	background-position: 0 -532px;
	padding: 0 0 0 10px;
}

div#footer div ul ul ul li {
	margin-left: 10px;
}

div#footer div ul ul ul li a {
	background-position: 0 -565px;
}

/* social icons */
div.socialDestinations {
	margin-top: 20px;
}

div#footer ul#socialMedia {
	margin-bottom: 20px;
	font-weight: bold;
}

ul#socialMedia li a,
div.vcard .tel {
	background: url(../images/sprite.png) no-repeat;
	background-position: 0 0;
	padding: 0 0 0 25px;
}

ul#socialMedia li#flickrIcon a {
	background-position: 0 -593px;
}

ul#socialMedia li#youtubeIcon a {
	background-position: 0 -629px;
}

ul#socialMedia li#plaxoIcon a {
	background-position: 0 -665px;
}

ul#socialMedia li#linkedIcon a {
	background-position: 0 -737px;
}

ul#socialMedia li#twitterIcon a,
a#twitterIcon {
	background-position: 0 -701px;
}

a#twitterIcon {
	padding: 0 0 0 25px;
}

/* Microformats */
div.vcard {
	line-height: 21px;
}

div.vcard span.fn {
	display: none;
}

div.vcard .tel {
	background-position: 0 -771px;
}

div.vcard div.mail a {
text-decoration: underline;
}

/* Navigation */
div.wp-pagenavi {
	padding-bottom:10px;
}

div.wp-pagenavi span {
	margin: 0 10px 0 0;
}

div.wp-pagenavi a,
div.wp-pagenavi span.current {
	background: #009BDB;
	color: #fff;
	display: inline-block;
	margin: 0 10px 0 0;
	padding: 4px 8px;
}

div.wp-pagenavi a:hover {
	background: #fff;
	color: #009BDB; 
}

div.wp-pagenavi span.current {
	background: #fff;
	border: 1px solid #009BDB;
	color: #009BDB;
	padding: 3px 8px;
}