/* 	InsiteWebsite Main Style Sheet */
/* html {
	background-color: #BBCBD5;
	} */
body {
	margin: 0;
	padding: 0;
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 76%;/* font sizing in ems, baby. if you want to change anything, just change this.*/
	/*funny thing happens at 75% and lower. opera goes to a nice small size, but moz and ie pc change almost not at all. seems 76% is as small as you can go and stay the same across browsers. poop.*/
	color: #000;
	background-color: #F7F9FA;
	/* background-image: url(pageel/px.gif);
	background-repeat: no-repeat;
	background-position: top left; */
	/* max-width: 900px;
	margin: 0 auto 0 auto; */
	}
div {
	margin: 0;
	padding: 0;
	}
#content {
	margin: 0em;
	padding: 4em 6em 2em 6em;/* use padding instead of margin for multicolumn layouts because of a really odd ie5pc bug where it sometimes relates the width of an unrelated menu div to this div. i*ll, uh, write about that somewhere. it was hard to figure out what was causing it, so i want this note here to remind me. */
	}
	
/*the following classes are to demonstrate better line heights for narrow columns*/	
.narrow1{
	width: 50%;
	line-height: 1.3em;
	}
.narrow2{
	width: 50%;
	line-height: 1.5em;
	}
		
/*typography*/

/* links */
a {
	text-decoration: none;
	font-weight: 400;
	color: #0000CC;
	background-color: transparent;
	}
a:link {
	}
a:visited {
	}
a:active {
	}
a:hover {
	text-decoration: underline;
	}

#header a {
	position: absolute;
	top: 0; left: 0;
	text-decoration: none;
	font-weight: 400;
	color: #000;
	background: transparent;
	background-image: url(../pageel/headerruler700x100.gif);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	/* border:1px solid lime; */
	/* font-size: 40px; */
	}
#header a:link {
	background: transparent url(../pageel/headerruler700x100.gif) no-repeat 50% 50%;
	}
#header a:visited {
	background: transparent url(../pageel/headerruler700x100.gif) no-repeat 50% 50%;
	}
#header a:active {
	background: transparent url(../pageel/headerruler700x100.gif) no-repeat 50% 50%;
	}
#header a:hover {
	background: transparent url(../pageel/headerhover.gif) no-repeat 50% 50%;
	}
h1, h2, h3, h4, h5, h6 {
	position: relative;
	}
h1 {
	font-size: 2.0em;
	font-weight: normal;
	margin-top: 0em;
	margin-bottom: 0em;/*both set to zero and padding in header div is used intead to deal with compound ie pc problems that are beyound summary in a simple comment.*/
	}
h2 {
	font-size: 1.7em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: normal;
	}
h3 {
	font-size: 1.4em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: normal;
	}
h4 {
	font-size: 1.2em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
	}
h5 {
	font-size: 1.0em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
	}
h6 {
	font-size: 0.8em;
	margin: 1.2em 0em 1.2em 0em;
	font-weight: bold;
	}
/* h */ .page-heading {	
	margin: 0em 0em 1.2em 0em;
	}
img {
	border: 0;
	}
ol, ul {/*
	list-style: none;*/
	font-size: 1.0em;
	line-height: 1.8em;
	margin-top: 0.2em;
	margin-bottom: 0.1em; 
	}
li {/*
	list-style: none;*/
	font-size: 1.0em;
	line-height: 1.6em;
	margin-top: 0.2em;
	margin-bottom: 0.1em; 
	text-indent: -1.5em;
	padding-left:1.3em;
	}
ul.top {
	/* list-style-image: url(../pageel/listdot1.gif); */
	list-style-type: none;
	margin-bottom: 1em;
	}
ul.second {
	/* list-style-image: url(../pageel/listdot2.gif); */
	list-style-type: none;
	}
dl.dict, dt.dict {
	font-family: georgia, times, "times new roman", serif;
	font-size: 1.2em;
	line-height: 1.8em;
	list-style-type: decimal;
	color: #440066;
	background-color: transparent;
	}
dd.dict {
	font-family: georgia, times, "times new roman", serif;
	font-size: 1.1em;
	line-height: 1.4em;
	list-style-type: decimal;
	text-indent: -1.5em;
	color: #440066;
	background-color: transparent;
	}
p {
	font-size: 1em;
	line-height: 1.5em;
	margin: 1.2em 0em 1.2em 0em;
	text-indent: 1.4em;
	text-align: justify;
	}
li p {
	margin-top: 0.2em;
	}
pre {/*moz 1.0/1.1/1.2.1, net 7.0/7.01 make this way too small, but i*m not going to go larger because monospace tends to run you into overflow pretty quick. prior moz and net are okay.*/
	font-family: monospace;
	font-size: 1.0em;
	}
strong, b {
	font-weight: bold;
	}
	
/***typography classes***/

/***alignment and indentation, mostly for paragraphs***/
  .noInd { text-indent: 0; }
  .hangInd { text-indent: -1.5em; margin-left: 1.5em; }
  .ltJust { text-align: left; }
  .rtJust { text-align: right; text-indent: 0; }
  .ctJust { text-align: center; text-indent: 0; }
  .blockIn { margin: 1.2em 2em 1.2em 2em; }
  .notopbottom { margin-top: 0; margin-bottom: 0; }
  .extopbottom { margin-top: 1ex; margin-bottom: 1ex; }
  .floatR { float: right; }
  .floatL { float: left; }
  .reveal { margin-bottom: 2.5em; 
    width: 640px;
    padding: 0 2em 2em 2em; 
    border: 1px solid #111111; 
    background-color: #fff; 
    }
  
  .inset0 { margin: 1ex	auto 2em 0; }
  .inset10px { margin: 1ex	auto 2em 10px; }
  .inset20px { margin: 1ex	auto 2em 20px; }
  .inset30px { margin: 1ex	auto 2em 30px; }
  .inset40px { margin: 1ex	auto 2em 40px; }
  .inset50px { margin: 1ex	auto 2em 50px; }
  .inset60px { margin: 1ex	auto 2em 60px; }
  .inset70px { margin: 1ex	auto 2em 70px; }

.quote {
	color: navy;
	background-color: transparent;
	font-style: italic;
	}
.note {	
	color: navy;
	text-indent: 0;
	font-size: .95em;
	line-height: 1.3em;
	text-align: left;
	margin: 0;
	}	
	
/*** layout specs ************************************************/
#headingpic {
	 padding: 20px 0 0 50px;
	}
.screenshot {
	border: 1px solid #4F88C1;
	padding: 6px;
	background-color: white;
	color: #000;
	margin-bottom: 1ex;
	}

/*** functionality bits **************************************/
u {
	text-decoration: none;
	color: #0000CC;
	background-color: transparent;
	cursor: pointer;
	}
.u {
	text-decoration: underline;
	color: #0000CC;
	background-color: transparent;
	cursor: pointer;
	}
h5 u, li u {
	font-weight: 400;
	padding-left: 1em;
	text-decoration: none;
	color: #0000CC;
	background-color: transparent;
	cursor: pointer;
	}
.switch {
	vertical-align: -4px;
	cursor: pointer;
	}
.janus {
	unicode-bidi: bidi-override; 
	direction: rtl;
	}
.not {
	display: none;
	}
.showing {
	display: block;
	}
.notshowing {
	display: none;
	}
/*** structural page elements *************************************/

#aDiv { /* left mid blue spray */
	position: relative;
	color: #000;
	background-color: transparent;
	background-image: url('../pageel/LeftBkgrd.gif');
	background-repeat: no-repeat;
	background-position: 20% 150px;
	z-index: 1;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	}
#bDiv { /* left bottom blue spray */
	position: relative;	
	/* background: transparent url('pageel/h-border.gif') repeat top left; */
	background-color: transparent;
  /* 	background-image: url('../px.gif'); */
  background-image: url('../pageel/FooterBkgrd.gif');  
	background-repeat: no-repeat;
	background-position: bottom left;
	color: #000;
	z-index: 2;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	}
#cDiv { /* right border */
	position: relative;
	color: #000;
	background-color: transparent;
	background-image: url('../px.gif');
	background-repeat: repeat-y;
	background-position: top right;
	z-index: 3;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	}
#dDiv { /* center */
	position: relative;
	color: #000;
	background-color: transparent;
	background-image: url(../pageel/menubkgrdstrip250.gif);
	background-position: 97% 0%;
	background-repeat: repeat-y;
	border-width: 0 0 0 0;
	border-style: dashed;
	border-color: red;
	width: 760px;
	margin: 0 auto 0 auto;
	padding: 110px 0px 0px 0px;
	z-index: 4;
	}
#bottomborder {
	position: relative;
	color: #000;
	background-color: transparent;
	width: 100%;
	height: 44px;
	bottom: 0px;
	background-image: url('../px.gif');
	background-repeat: repeat-x;
	background-position: bottom left;
	}
/* ********* footer details *************************** */
/* -----#shoe not in use-------- */
/* #shoe {
	position: absolute;
	z-index: 3;
	bottom: -20px;
	left: 0;
	color: #000;
	background-color: transparent;
	width: 100%;
	height: 150px;
	background-image: url('../pageel/FooterBkgrd.gif');
	background-repeat: no-repeat;
	background-position: bottom left;
	margin: 0 0 0 0;
	border: 0px dashed aqua;
	} */
#footer {
	position: relative;
	color: gray;
	background-color: transparent;
	background-image: url(../px.gif);
	background-position: 100% 0%;
	background-repeat: repeat-y;
	z-index: 102;
	left: 50%;
	width: 760px;
	margin: 0 auto 0 -380px;
	padding: 50px 0 2em 0;
	text-align: center;
	border: 0px solid #D9E9EF;
	clear: both;
	}
#footer p {
	font-size: .85em;
	line-height: 1em;
	margin: 1em 0em .8em 0em;
	text-indent: 0em;
	text-align: center;
	}
#footmenu {
	position: relative;
	padding: 1ex 0 1ex 0;
	z-index: 99;
	border: 0px dashed red;
	}
#footmenu span {
	border-left: 1px solid #C9DCE3;
	padding-left: .8ex;
	z-index: 99;
	}
#footmenu a {
	border-right: 1px solid #C9DCE3;
	padding: 0 1ex 0 .5ex;
	text-decoration: none;
	font-weight: 400;
	color: #000;
	background-color: transparent;
	z-index: 99;
	}
#footmenu a:link {
	color: #4F88C1;
	background-color: transparent;
	}
#footmenu a:visited {
	color: #8BACCE;
	background-color: transparent;
	}
#footmenu a:active {
	color: #822626;
	background-color: transparent;
	}
#footmenu a:hover {
	color: green;
	background-color: transparent;
	text-decoration: underline;
	}
#w3chtml {
	/* position: absolute;
	border-width: 0px;
	left: 0px;
	bottom: 0px; */
	position: relative;
	float: left;
	}
#w3chtml a { border-width: 0px; }
#w3ccss {
	/* position: absolute;
	border-width: 0px;
	right: 0px;
	bottom: 0px; */
	position: relative;
	float: right;
	}
#w3ccss a { border-width: 0px; }
#navbox {
	/* float: right; */
	width: 750px;
	border: 0px solid silver;
	text-align: right;
	margin: 20px 0px 0px auto;
	padding: 0px;
	}
#navbox p {
	margin: 0 0 1em 0;
	}
.browserbutton {
	height: 60px;
	width: 45px;
	overflow: hidden;
	position: relative;
	float: right;
	margin: 0 0 0 0;
	}
.browsercontrol a {
	position:relative;
	left: 0px;
	}

.browserbutton a:hover {
	position:relative;
	left: -45px;
	}
#backbutton, #topbutton {
	position: relative;
	left: 0px;
	top: 0px;
	}
#suggnext {
	text-align: right;
	clear: both;
	padding: 1em 0 0 0;
	}
#suggnext a {
	text-decoration: none;
	}
#suggnext a:visited, #suggnext a:visited em {
	display: none;
	}
#suggnext a:hover {
	color: green;
	text-decoration: none;
	}
#suggnext a em {
	color: gray;
	text-decoration: none;
	display: inline-block;
	}
#suggnext a:hover em {
	color: gray;
	text-decoration: none;
	display: inline-block;
	}
/* ********header details******************************* */
#header {
	position: absolute;
	top: 14px;
	left: 50%;
	margin-left: -350px;
	z-index: 80;
	color: #000;
	background: transparent;
	background-image: url(../pageel/headerhover.gif);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	}
#mainmenu {
	position: absolute;
	top: 160px;
	left: 570px;
	z-index: 80;
	width: 180px;
	color: #000;
	background-color: transparent;
	}
#maincontent {
	position: relative;
	width: 500px;
	padding: 0 0 0 10px;
	}

/* page detail stuff */

#mainimage {
	position: relative;
	padding: 0;
	margin: 0;
	z-index: 30;
	}
	
/*  homepage elements */
#vermeer {
	position: relative;
	left: 130px;
	z-index: 30;
  	padding: 0 0 0 0;
  	width: 300px;
  	margin: 0 0 0 0;
	}
#vermeerPopNote{
	position: absolute; 
	top: 330px;
	left: 148px;
	/* margin: 0 auto 0 auto; */
	font-size: .8em;
	width:250px;
	border:1px solid silver;
	background-color:#FFF2B5;
	color:#000;
	padding: 5px 5px 10px 5px;
	text-align: center;
	z-index: 100;
	}
#vermeer a {
	position: relative;
	display: block;
	text-decoration: none;
	font-weight: 400;
	color: #000;
	background: transparent url(../art/vermeerRollover600x340.jpg) no-repeat 0px 0px;
	height: 340px;
	width: 300px;
	margin: auto;
	z-index: 10;
	}
#vermeer a:link {
	background-position: 0px 0px;
	}
#vermeer a:visited {
	background-position: 0px 0px;
	}
#vermeer a:active {
	background-position: 0px 0px;
	}
#vermeer a:hover {
	background-position: -300px 0px;
	}

#mouseovers{
	position: relative;
	height: 500px;
	padding: 0 0 0 100px;
	}
	
/* details page */
#vaneyckimage {
	position: relative;
	margin: 0 0 0 80px;
	}
#arnolfini {
	z-index: -1; 
	cursor:wait;
	}
#arnofinistandardimage {
	position:absolute; 
	left:0; 
	top:0; 
	width:364px; 
	height:500px; 
	background:url(../js/loupe/images/arnolfini/small.jpg) no-repeat transparent; 
	/* background:url(px.gif) no-repeat transparent; */
	}
#mirrordetail {
	position:absolute; 
	z-index: 20;  
	cursor: pointer; 
	left:-67px; 
	top:0; 
	width:500px; 
	height:502px; 
	background:url(../art/arnolfinimirror498x500.jpg) no-repeat 50% 50% #F7F9FA; 
	border: 1px solid silver;
	}
#starter /* loupe initiator */ {
	position:absolute; 
	left:0; 
	top:0; 
	width:100%; 
	height:100%; 
	z-index:102; 
	background-color: transparent; 
	}

/* slideshow pages */
#RvRslideshow {
	margin: 0 0 0 110px;
	}
#splashslideshow {
	margin: 0 0 0 40px;
	}
#splashslideshow td { text-align: center; }
.slidecaptions /* for splash show */ {
	color: gray;
	background-color: transparent;
	font-size: .9em;
	}
#RvRhref {
	cursor: default;
	}
#RvRheading {
	color: #900;
	background-color: transparent;
	font-style: italic;
	}

.slideshowcontrols {
	border: 1px solid #D9E9EF; 
	padding: 4px 0px 2px 0px; 
	margin: 1ex auto; 
	width: 9em;
	}
.previousnext {
	color: blue;
	background-color: transparent;
	cursor: pointer;
	}
.autostop {
	cursor: pointer;
	vertical-align: 1px;
	position: relative;
	}
	/*** biopage details ***/
#bioflash {
	padding: 0 0 0 70px;
	margin: 0 auto 0 auto;
	width: 366px;
	}
	/*** imagepage details ***/
#rvrflash {
	padding: 2em 0 1em 130px;
	margin: 0 auto 0 auto;
	width: 366px;
	}
	/*** websitespage details ***/
#lunarpages {
	width:90px;
	float: left;
	padding: 20px 0 0 0;
	/* position:relative;
	top:30px;
	left:260px; */
	z-index:103;
	}
	
/* --- clearfix --- */
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
/* End hide from IE-mac */