/*
Copyright (c) 2006, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 0.12.0
*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
ol,ul {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym {border:0;}/*
Copyright (c) 2006, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 0.12.0
*/

/**
 * 84.5% for !IE, keywords for IE to preserve user font-size adjustment
 * Percents could work for IE, but for backCompat purposes, we are using keywords.
 * x-small is for IE6/7 quirks mode.
 *
 */
body {font:13px arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}
table {font-size:inherit;font:100%;}

/**
 * 99% for safari; 100% is too large
 */
select, input, textarea {font:99% arial,helvetica,clean,sans-serif;}

/**
 * Bump up !IE to get to 13px equivalent
 */
pre, code {font:115% monospace;*font-size:100%;}

/**
 * Default line-height based on font-size rather than "computed-value"
 * see: http://www.w3.org/TR/CSS21/visudet.html#line-height
 */
body * {line-height:1.22em;}
/*___________________________________________________________________________________________________________________

	mediaCT webinterieur - www.mediact.nl - info@mediact.nl - 050 5799393 - Groningen - The Netherlands
	copyright: http://creativecommons.org/licenses/by-nc-nd/2.0/deed.nl

_____________________________________________________________________________________________________________________*/

body {
	behavior:url("templates/css/lib/csshover.htc");
}

/* begin_screen_mct_beheer_editor */

body {
	background-color: #000;
}

body,td,th,input,select,textarea {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 12px;
	color: #b6b4a3;
}

body * { line-height: 19px; }

input,textarea { line-height: normal; }

p { margin-bottom: 15px; }

a { color: #bababa; }
a:hover { text-decoration: none; color: #ff6600; }
a:active { text-decoration: none; }

strong { font-weight: bold; }
em { font-style: italic; }

img { border: none; }
fieldset { border: none; }
caption { display: none; }

ul { list-style-type: circle; margin-left: 25px; padding-left: 0; }
ol { margin-left: 25px; padding-left: 0; }

table { border-collapse: collapse; }
th, td {}
th {}
thead th {}
tbody th {}
tfoot th {}
tfoot td {}

dl dt {}
dl dd {}

small { color: #222; }





/*__________________________________________________________ HEADINGS __________________________________________________________*/

h1,h2,h3,h4,h5,h6 {
	color: #fff;
	font-size: 30px;
	font-weight: normal;
	font-family: "times new roman", georgia, serif;
	line-height: 36px;
	margin-bottom: 10px;
}

h4,h5,h6 {
	font-family: arial, verdana, helvetica;
	font-size: 16px;
	line-height: 24px;
}

h1 a,h2 a,h3 a,h4 a,h5 a,h6 a { text-decoration: none; color: #fff; }

h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover,h5 a:hover,h6 a:hover { color: #ff6600; }







/*__________________________________________________________ ALGEMENE CLASSES __________________________________________________________*/

.meer { background: url("img/bullets/bullet_readmore.gif") no-repeat right 6px; padding-right: 10px; }

a.rss { padding-left: 18px; background: url("img/bullets/bullet_rss.gif") no-repeat left 4px; }

a.exLink { padding-right: 10px; background: url("img/bullets/bullet_exlink.gif") no-repeat right 6px; }

ul.li_spacing li {	margin-bottom: 15px; }

.afbeelding-rechts-wittelijn { margin: 0 0 10px 10px; border: 1px solid #fff; }
.afbeelding-links-wittelijn { margin: 0 10px 10px 0; border: 1px solid #fff; }
.afbeelding-rechts { margin: 0 0 10px 10px; }
.afbeelding-links { margin: 0 10px 10px 0; }

.oranje_kop { color: #ff6600; }
.groot_font { font-size: 14px; }
.groot_font_oranje { color: #ff6600; font-size: 14px; }

/* end_screen_mct_beheer_editor */

.clear { clear: both; }


/*__________________________________________________________ CONTAINER __________________________________________________________*/

#container {
	position: relative;
	width: 944px;
	margin: 30px 0 0 30px;
}






/*__________________________________________________________ HEADER _____________________________________________________________*/

#header {
	width: 205px;
	height: 60px;
	border-bottom: 1px solid #aaa;
}

#header h1 {
	position: relative;
	width: 205px;
	height: 33px;
}

#header h1 a {
	display: block;
	width: 205px;
	height: 33px;
	text-indent: -1234em;
	overflow: hidden;
	background-image: url("img/logo_byfrank.gif");
}






/*__________________________________________________________ CONTENT ____________________________________________________________*/

#content {
	margin: -1px 0 0 235px;
	min-height: 400px;
	_height: 400px;
}






/*__________________________________________________________ MAIN CONTENT _______________________________________________________*/

#maincontent {
	float: left;
	width: 470px;
	border-top: 1px solid #aaa;
	border-bottom: 1px solid #aaa;
	padding: 25px 0;
}

#maincontent .article {}

#maincontent .imagewrapper {
	position: relative;
	width: 470px;
	height: 450px;
	overflow: hidden;
}

#maincontent .imagewrapper img {
	position: absolute;

}









/*__________________________________________________________ LEFT CONTENT _________________________________________________________*/

#rightcontent {
	float: right;
	width: 209px;
	border-top: 1px solid #aaa;
}

#rightcontent .article {
	padding: 25px 0 10px 0;
	border-bottom: 1px solid #aaa;
}

#rightcontent .article .componentwrap {
	border-bottom: 1px solid #aaa;
	padding-top: 25px;
}

#rightcontent h2, #rightcontent h3, #rightcontent h4, #rightcontent h5, #rightcontent h6 {
	line-height: 26px;
}

#rightcontent h2 { font-size: 24px; }
#rightcontent h3 { font-size: 24px; }

#rightcontent ul { margin: 0 0 15px 0; list-style-type: none; }








/*__________________________________________________________ NIEUWS NEWS _________________________________________________________*/

#newsarticles {
	margin-top: -25px;
}

#newsarticles .article {
	border-bottom: 1px solid #aaa;
	padding: 25px 0 10px 0;
	min-height: 150px;
	_height: 150px;
}

#newsarticles .article.noimage {
	min-height: 50px !important;
	_height: 50px !important;
}

#newsarticles .article h4 {
	font-family: arial, verdana, helvetica;
	font-size: 16px;
}

#newsarticles .article h3 a {}

#newsarticles .article div.fixedimage {
	float: left;
	width: 100px;
	height: 100px;
	overflow: hidden;
	margin: 5px 10px 0 0;
}

.newsarticle .article { padding-bottom: 20px; } /* vervolg nieuwsartikel */







/*__________________________________________________________ PRODUCTEN  _________________________________________________________*/

.category {
	padding-bottom: 24px;
	margin-bottom: 24px;
	border-bottom: 1px solid #333;
}

.productrij {
	padding-bottom: 19px;
	margin-bottom: 24px;
	border-bottom: 1px solid #333;
}

.productrij .clear { clear: left; }

.productoverzicht {
	width: 33%;
	float: left;
}

.nr_1, .nr_4, .nr_7, .nr_10, .nr_13, .nr_16 { text-align: left; }
.nr_2, .nr_5, .nr_8, .nr_11, .nr_14, .nr_17 { text-align: center; }
.nr_3, .nr_6, .nr_9, .nr_12, .nr_15, .nr_18 { text-align: right; }

.productoverzicht h3 {
	font-family: arial, verdana, helvetica, sans-serif;
	font-size: 12px;
	line-height: normal;
}

.productoverzicht .imagewrapper {}

a.bekijk_galerij {
	clear: both;
	display: block;	
	text-align: right;
	position: relative;
	top: 21px;
	text-decoration: none;
	color: #aaa;
}

a.bekijk_galerij:hover {
	color: #ff6600;
}

#rightcontent .sidephoto {
	display: block;
	margin-bottom: 10px;
}

#side_products {
	position: absolute;
	left: 0;
	top: 360px;
	height: 300px;
	width: 205px;
}

#side_products h2 {
	line-height: 26px;
	font-size: 24px;
}

#side_products ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	border-top: 1px solid #222;
}

#side_products ul * {
	line-height: 12px !important;
}

#side_products ul li {
	border-bottom: 1px solid #222;
}

#side_products ul li a {
	display: block;
	padding: 5px 0 5px 1px;
	font-size: 11px;
	text-decoration: none;
	color: #aaa;
}

#side_products ul li a:hover {
	color: #ff6600 ;
}

#side_products ul li a:hover {
	background-color: #0f0f0f;
}





/*__________________________________________________________ NIEUWS ARTICLESLIST _________________________________________________________*/

.articlelist ul {
	border-top: 1px solid #333;
}

.articlelist a {
	display: block;
	text-decoration: none;
	border-bottom: 1px solid #333;
	padding: 5px 0;
}

.articlelist a.archief {
	border-bottom: none;
	padding: 0;
}







/*__________________________________________________________ META INFO - PRINT / AUTEUR / DATE  _______________________________________*/

ul.meta {
	margin: 0;
	padding: 0;
	list-style-type: none;
	padding-top: 10px;
	font-size: 9px;
	color: #777;
	border-top: 1px solid #aaa;
}

ul.meta li {
	float: left;
	padding-right: 5px;
	margin-right: 2px;
	height: 18px;
}








/*__________________________________________________________ ITEM NAVIGATION _______________________________________________________*/

#itemnavigation {
	clear: both;
}

#itemnavigation ul {
	z-index: 10;
	width: 330px;
	position: relative;
	margin: 10px 0 -13px 0;
	height: 25px;
	list-style-type: none;
	border-left: 1px solid #333;

}

#itemnavigation ul li {
	float: left;
	background-image: none;
	padding: 0 4px;
	margin: 0;
	border-right: 1px solid #333;
}

#itemnavigation ul li a {
	display: block;
	float: left;
	padding: 3px 8px;
	text-decoration: none;
}

#itemnavigation ul li a:hover {
	background-color: #aaa;
	color: #000;
}

#itemnavigation ul li em {}

#itemnavigation ul li strong {
	display: block;
	float: left;
	padding: 3px 8px;
	background-color: #333;
	font-weight: normal;
}

#itemnavigation a.back {
	z-index: 9;
	position: relative;
	display: block;
	top: -9px;
	text-align: right;
	margin: 0 0 0 10px;
}








/*__________________________________________________________ BREADCRUMB ______________________________________________________________*/

#breadcrumb {
	display: none;
	position: absolute;
	top: -45px;
	margin: 0 0 15px 0;
	border-bottom: 1px solid #C9C9C9;
	width: 100%;
}

body.vervolg #breadcrumb { display: block; }

#breadcrumb ul { list-style-type: none; margin: 0; }

#breadcrumb li {
   display: inline;
   background: url("img/bullets/bullet_breadcrumb.gif") no-repeat left 5px;
   padding-left: 7px;
   margin-right: 3px;
   text-transform: lowercase;
   font-style: italic;
   font-size: 10px;
}

#breadcrumb li.first { padding-left: 0; background-image: none; }

#breadcrumb a { text-decoration: none; }

#breadcrumb a:hover {
	text-decoration: underline;
} 








/*__________________________________________________________ CONTACT FORM ____________________________________________________________*/

#contactform {}

#contactform .formField, #contactform .formArea { clear: left; height: 40px; overflow: hidden; }
#contactform .formArea { height: auto; }

#contactform div label, #contactform input.submit { display: block; }

#contactform div label {
	float: left;
	width: 90px;
	margin: 2px 0 5px 0;
	padding: 0 3px 0 0;
}

#contactform div input, #contactform div textarea {
	float: left;
	width: 374px;
	padding: 0 0 0 3px;
	background-color: #111;
	border: none;
	border-bottom: 1px solid #444;
}

#contactform div input {
	display: inline;
	height: 20px;
	padding-top: 3px;
}

#contactform  div input.inputerror,#contactform  div textarea.inputerror  {
	border-bottom: 1px solid #ff6600;
}

#contactform div textarea {
	height: 100px;
}

#contactform input.submit {
	position: relative;
	top: 10px;
	margin: 0 0 0 93px;
	padding: 2px 10px;
	clear: left;
	font-weight: bold;
	background-color: #111;
	border: 1px solid #444;
	color: #fff;
	font-weight: normal;
	cursor: pointer;
}







/*__________________________________________________________ SITEMAP _________________________________________________________________*/

#sitemap li {
	margin-left: 0;
	list-style-image: none;
	list-style-type: none;
	min-height: 22px;
}

#sitemap li a { display: block; font-weight: bold; text-decoration: none; padding-top: 10px; }

#sitemap li a:hover { text-decoration: underline; }

#sitemap li li a {
	height: 22px;
	margin: 0; padding: 0;
	padding-left: 25px;
	font-weight: normal;
	background: url("img/bullets/bullet_list.gif") no-repeat 10px 4px;
}

#sitemap li li li a {
	padding-left: 40px;
	background: url("img/bullets/bullet_list.gif") no-repeat 28px 8px;
}

#sitemap li li li li a {
	padding-left: 55px;
	background-position: 45px top;
}

#sitemap li li li li li a {
	padding-left: 70px;
	background-position: 60px top;
}







/*__________________________________________________________ MENU _________________________________________________________________*/

#menu {
	position: absolute;
	left: 0;
	top: 90px;
	width: 205px;
}

#menu ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#menu ul li { margin-bottom: 3px; }

#menu ul li a {
	display: block;
	height: 18px;
	text-decoration: none;
	padding-top: 2px;
	border-bottom: 1px solid #000;
}


#menu .cls_collectie a,
#menu .cls_portret_koningin_beatrix a{
	color: #ff6600;
}

#menu ul li a:hover {
	border-bottom: 1px solid #333;
	color: #666;
}

#menu ul li a.active {
	color: #ff6600;
}


#menu .cls_select_by_frank,
#menu .cls_nieuws_uit_de_kunstwereld{
	margin-bottom: 20px;
}








/*__________________________________________________________ ADDRESS ________________________________________________________________*/

#address {
	display: none;
	position: absolute;
	top: 0;
	left: 235px;
}

#address .galerie {}

#address .galerie span {
	width: 210px;
}

#address .galerie span.left {
	position: absolute;
	top: 0;
	left: 60px;
}

#address .galerie span.right {
	position: absolute;
	top: 0;
	left: 250px;
}

#address .ontwerpbureau {
	position: absolute;
	top: 0;
	left: 500px;
	height: 100px;
	width: 200px;
}






#printinfo { display: none; visibility: hidden; }





/*__________________________________________________________ FOOTER ________________________________________________________________*/

#footer {
	position: relative;
	top: 20px;
	height: 60px;
	clear: both;
	margin: 0 0 0 235px;
}

#footer p { font-size: 10px; }

#footer small a { color: #222; }#lightbox{
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url("../../img/lightbox/blank.gif") no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url("../../img/lightbox/prevlabel.gif") left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url("../../img/lightbox/nextlabel.gif") right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	color: #333 !important;
	}

#imageData{
	padding:0 10px;
	}
#imageData #imageDetails{ width: 75%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}
#imageData #bottomNavPrev { width: 20px; float: right;  padding-bottom: 0.7em;	}
#imageData #bottomNavPrev img { display:block; margin:3px auto 0 auto; }
#imageData #bottomNavNext { width: 20px; float: right;  padding-bottom: 0.7em; margin:0 10px 0 0; }
#imageData #bottomNavNext img { display:block; margin:3px auto 0 auto; }			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	}
	

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}

* html>body .clearfix {
	display: inline-block; 
	width: 100%;
	}

* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}	
	/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash #maincontent h2, .sIFR-hasFlash #maincontent h3 {
	visibility: hidden;
	/*line-height: 117%;
	font-size: 218%;*/
}

.sIFR-hasFlash #rightcontent h2, .sIFR-hasFlash #rightcontent h3 {
	visibility: hidden;
}