/* Base style removal, global fixes and browser/platform fixes */
:link, :visited {
	text-decoration: none
}

ul {
	list-style: none;
}

h1, h2, h3, h4, h5, h6, pre, code {
	font-size: 1em;
}

ul, li, h1, h2, h3, h4, h5, h6, pre, form, body, html, p, blockquote, fieldset, dl, dt, dd, input {
	margin: 0;
	padding: 0
}

a img, :link img, :visited img {
	border: none
}

address {
	font-style: normal
}

a, a:link, a:visited, a:hover, a:active {
	outline: 0;
}

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

html, body {
	height: 100%;
	font: 12px/16px "Trebuchet MS", Arial, Helvetica, sans-serif;
}

a {
	color: #666;
}

a:hover {
	text-decoration: underline;
}

img {
	border: 0;
}

body {
	background: url(../images/body-bg.jpg);
	margin: 0;
	padding: 0;
	min-height: 550px;  /* For Mozilla/Opera/Safari */
}

.leftBG {
	position: absolute;
	width: 50%;
	height: 365px;
	background: url(../images/bgleft.gif) #6e1527;
	top: 85px;
	left: 0;
	z-index: 1;
}

.rightBG {
	position: absolute;
	width: 50%;
	height: 365px;
	top: 85px;
	right: 0;
	z-index: 1;
	background: url(../images/bgright.gif) #8a7853;
}

.leftBGstatic {
	position: absolute;
	top: 93px;
	left: 5px;
	display: block;
	height: 349px;
	width: 63px;
	background: url(../images/contemporary-impressionism.gif);
}

.rightBGstatic {
	position: absolute;
	top: 93px;
	right: 16px;
	display: block;
	height: 349px;
	width: 28px;
	background: url(../images/right.gif);
}

#container {
	margin: 0 auto;
	width: 100%;
	height: 100%;
}

#page {
	margin: auto;
	display: block;
	width: 100%;
	position: absolute;
	height: 550px;
	top: 50%;
	margin-top: -275px;  /* Half of splash height */
}

#contentwrapper {
	position: relative;
	width: 968px;
	height: 550px;
	margin: 0 auto;
	z-index: 2;
}

#contentarea {
	position: absolute;
	top: 93px;
	left: 64px;
	height: 349px;
	width: 863px;
	padding: 0;
	margin: 0;
}

/* home page specific */
#leftHome {
	float: left;
	width: 467px;
	border-left: 1px solid white;
	border-right: 1px solid white;
}

#leftHome .arrow {
	position: absolute;
	top: 265px;
	left: 436px;
}

#leftHome .arrow a {
	display: block;
	width: 32px;
	height: 33px;
	background: url(../images/painting-arrow.gif);
}

#leftHome .arrow a:hover {
	background: url(../images/painting-arrow.gif) 0 -33px;
}

#leftHome .arrow a b {
	display: none;
}

#rightHome {
	float: left;
}

#rightHome #top {
	width: 390px;
	height: 265px;
	background: url(../images/rightHomeTop.gif) 0 -7px repeat-x #2f2a37;
	border-right: 1px solid white;
}

#rightHome #top p.intro {
	padding: 50px 0 0 25px;
	width: 140px;
	color: #fff;
	font-size: 16px;
	line-height: 21px;
}

#rightHome .thumbsHome {
	position: absolute;
	top: 0;
	right: 5px;
	height: 265px;
	width: 210px;
}

#rightHome .thumbsHome p {
	position: absolute;
	right: 20px;
	top: 170px;
	width: 100px;
	color: #fff;
}

#rightHome .thumbsHome p a {
	color: #fff;
	border-bottom: 1px dotted #fff;
}

#rightHome .thumbsHome p a:hover {
	text-decoration: none;
	color: #ccc;
}

#rightHome .thumbsHome p b {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	padding: 0 0 0 5px;
}

#rightHome .thumbsHome p a:hover b {
	color: #fff;
}

#rightHome .thumbsHome img {
	border: 3px solid #fff;
}

.thumbsHome .one {
	position: absolute;
	top: 50px;
	right: 130px;
}

.thumbsHome .two {
	position: absolute;
	top: 80px;
	right: 40px;
}

.thumbsHome .three {
	position: absolute;
	top: 140px;
	right: 130px;
}

#rightHome #bottom {
	color: #fff;
	height: 84px;
	width: 390px;
	background-color: #756e6e;
	border-right: 1px solid white;
}

#rightHome #bottom .info {
	padding: 12px 0 0 25px;
}

#rightHome #bottom .name {
	font-size: 14px;
}

#rightHome #bottom .description {
	font-size: 12px;
}

#rightHome #bottom .category {
	font-size: 18px;
	padding: 7px 0 0 0;
}

#rightHome #bottom .category a {
	color: #fff;
	font-weight: bold;
	text-transform: capitalize;
}

#rightHome #bottom .category a:hover {
	color: #ccc;
	text-decoration: none;
}

#rightHome #bottom .category b {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: normal;
	padding: 0 0 0 5px;
}


/* Right Interior */
#rightInterior {
	position: absolute;
	width: 573px;
	height: 349px;
	top: 0;
	left: 285px;
	background-color: #462c14;
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;
}

#rightInterior #top {
	width: 573px;
	height: 62px;
	background: url(../images/interior-top.png);
}

#rightInterior #top h1 {
	float: left;
	margin: 8px 0 0 23px;
	height: 47px;
	width: 101px;
	text-align: center;
	text-indent: -12345px;
	color: #fff;
}

.paintings #rightInterior #top h1 {
	background: url(../images/h1-paintings.png) no-repeat;
}

.city-life #rightInterior #top h1 {
	background: url(../images/h1-gallery-one.png) no-repeat;
}

.french-country #rightInterior #top h1 {
	background: url(../images/h1-gallery-two) no-repeat;
}

.florals #rightInterior #top h1 {
	background: url(../images/h1-florals.png) no-repeat;
}

.bio #rightInterior #top h1 {
	background: url(../images/h1-bio.png) no-repeat;
}

.artist-statement #rightInterior #top h1 {
	background: url(../images/h1-artist-statement.png) no-repeat;
}

.cv #rightInterior #top h1 {
	background: url(../images/h1-cv.png) no-repeat;
}

.exhibits #rightInterior #top h1 {
	background: url(../images/h1-exhibits.png) no-repeat;
}

.contact #rightInterior #top h1 {
	background: url(../images/h1-contact.png) no-repeat;
}

#rightInterior #top .htwo {
	float: left;
	display: table;
	margin-left: 100px;
	padding: 0 0 0 0;
	height: 58px;
	width: 260px;
	text-align: center;
}

#rightInterior #top h2 {
	font: normal 18px/18px Arial, Helvetica, sans-serif;
	color: #666;
	display: table-cell;
	vertical-align: middle;
}

#rightInterior #content {
	position: relative;
	width: 573px;
	height: 252px;
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
}


/* Interior Background Colours */
.bio #rightInterior #content {
	background-color: #ece4d2;
	color: #333;
}

#rightInterior #content {
	background-color: #ece4d2;
	color: #333;
}

.paintings #rightInterior #content, .florals #rightInterior #content, .city-life #rightInterior #content, .french-country #rightInterior #content {
	height: 246px;
	width: 567px;
	padding-top: 6px;
	padding-left: 6px;
	background-color: #424652;
	color: #333;
	text-align: left;
}

.paintings #rightInterior #content img, .florals #rightInterior #content img, .city-life #rightInterior #content img, .french-country #rightInterior #content img {
	border: 1px solid #424652;
	padding: 0;
	margin: 0;
}

.paintings #rightInterior #content img:hover, .florals #rightInterior #content img:hover, .city-life #rightInterior #content img:hover, .french-country #rightInterior #content img:hover {
	border: 1px solid white;
}

.paintings #rightInterior {
	background-color: #333333;
}

.florals #rightInterior {
	background-color: #7b7b51;
}

.city-life #rightInterior {
	background-color: #2f2a37;
}

.french-country #rightInterior {
	background-color: #a04c15;
}

.cv #rightInterior {
	background-color: #b6802b;
}

.artist-statement #rightInterior, .bio #rightInterior {
	background-color: #543c21;
}

.exhibits #rightInterior {
	background-color: #b58642;
}

.contact #rightInterior {
	background-color: #a4ad66;
}

.city-life #rightInterior #content, .french-country #rightInterior #content, .florals #rightInterior #content {
	background-color: #333;
}

#rightInterior #content p {
	font-size: 13px;
	line-height: 16px;
	padding: 5px 0;
}

#rightInterior #bottom {
	width: 223px;
	height: 33px;
	background: url(../images/interior-bottom.png);
}

#header {
	display: block;
	width: 968px;
	height: 93px;
	background: url(../images/marjolynvanderhart.gif) -3px 0;
}

#header h1 a {
	position: absolute;
	display: block;
	width: 530px;
	height: 100px;
	text-indent: -9999px;
	outline: none;
}

#nav {
	position: absolute;
	top: 68px;
	right: 35px;
}

#nav a {
	padding: 3px 8px;
}

#nav a:hover {
	color: #6e1527;
	text-decoration: none;
}

#nav ul {
	color: #9a8645;
}

#nav ul li {
	float: left;
}

#nav .paintings ul {
	display: none;
	position: absolute;
	bottom: 13px;
	right: 210px;
	padding: 10px 20px 0 0;
}

#nav .paintings:hover ul, #nav .bio:hover ul {
	display: block;
}

#nav .paintings:hover a, #nav .bio:hover a {
	color: #6e1527;
}

#nav .paintings:hover ul a, #nav .bio:hover ul a {
	color: #666;
}

#nav .paintings ul a:hover, #nav .bio ul a:hover {
	color: #6e1527;
}

#nav .paintings ul a:hover b, #nav .bio ul a:hover b {
	color: #6e1527;
}

#nav .paintings ul li a b, #nav .bio ul li a b {
	padding-left: 3px;
	color: #bf9136;
}

#nav .paintings ul li, #nav .bio ul li {
	float: none;
}

#nav .paintings ul li a {
	display: block;
	width: 200px;
	padding: 0;
	text-align: right;
}

#nav .paintings .frenchcountry {
	position: relative;
	right: 25px;
}

#nav .paintings .citylife {
	position: relative;
	right: 40px;
}

#nav .bio ul {
	display: none;
	position: absolute;
	bottom: 13px;
	right: 140px;
	padding: 10px 20px 5px 0;
}

#nav .bio ul li a {
	display: block;
	width: 200px;
	padding: 0;
	text-align: right;
}

#nav .bio .statement {
	position: relative;
	right: 8px;
}

#footer {
	position: absolute;
	bottom: -28px;
	width: 968px;
	height: 136px;
	background: url(../images/footer-bg.gif) 3px 0;
	overflow: hidden;
}

#footer h3 {
	position: absolute;
	text-indent: -9999px;
}

#footer #links {
	position: absolute;
	top: 35px;
	left: 67px;
}

#footer #links ul, #footer #links ul li {
	list-style: disc;
	list-style-position: inside;
	color: #666;
}

#footer #links ul strong {
	color: #666;
	font-weight: normal;
}

#footer #links a {
	color: #317391;
	border-bottom: 1px dotted #91bace;
}

#footer #links a:hover {
	color: #2f2a37;
	border-bottom: 1px dotted #2f2a37;
	text-decoration: none;
}

#footer #social {
	float: right;
	margin: 20px 40px 0 0;
	width: 300px;
}

#footer #social-profile {
	float: right;
	margin: 10px 40px 0 0;
}

#footer #social-profile p {
	float: left;
	padding-right: 5px;
	font-size: 11px;
}

#footer #social-profile ul {
	float: left;
	list-style: none;
}

#footer #social-profile ul li {
	float: left;
	margin-left: 5px;
	padding-top: 0;
	text-indent: -9999px;
	width: 16px;
	height: 16px;
}

#footer #social-profile ul li.facebook {
	background: url(../images/icon-facebook.gif) no-repeat 0 center;
}

#footer #social-profile ul li.flickr {
	background: url(../images/icon-flickr.gif) no-repeat 0 center;
}

#footer #social-profile ul li.youtube {
	background: url(../images/icon-youtube.gif) no-repeat 0 center;
}

#footer #social-profile ul li a {
	position: static;
	display: block !important;
	margin: 0 !important;
	padding: 0 !important;
	width: 16px !important;
	height: 16px !important;
	border-bottom: none;
}


/* Scroller */
.masktop, .maskbottom {
	position: absolute;
	height: 30px;
	width: 550px;
	top: 0;
	background: url(../images/content-mask-top.png) repeat-x 0 -25px;
	z-index: 20;
}

.maskbottom {
	height: 49px;
	top: 203px;
	background: url(../images/content-mask-bottom.png);
}

#content #copy {
	overflow: auto;
	position: relative;
	display: block;
	width: 550px;
	height: 252px;
	top: 0px;
	left: 0px;
	text-align: left;
}

#content #copy.paragraph {
	width: 450px;
	height: 192px;
	padding: 25px 50px 35px 50px;
}

#content a {
	color: #317391;
	border-bottom: 1px dotted #317391;
}

#content a:hover {
	color: #2F2A37;
	border-bottom: 1px dotted #2F2A37;
	text-decoration: none;
}

.contactIntro {
	font-size: 12px;
}

#downloadCV {
	padding: 0 0 0 8px;
	position: relative;
	top: -8px;
}

.exhibitsTable tr td {
	font-size: 12px !important;
}

#portrait {
	float: right;
	padding: 0 0 5px 20px;
}

#scroller {
	position: absolute;
	top: 0;
	right: 0px;
	height: 252px;
	width: 20px;
	border-left: 1px solid #fff;
	background-color: #f3ede2;
}

#scrollup {
	position: absolute;
	top: 1px;
	left: 1px;
	display: block;
	width: 18px;
	height: 19px;
	text-indent: -9999px;
	overflow: hidden;
}

#scrolldown {
	position: absolute;
	bottom: 1px;
	left: 1px;
	display: block;
	width: 18px;
	height: 19px;
	text-indent: -9999px;
	overflow: hidden;
}

#scrollup {
	background: url(../images/uparrow.gif) 0 0;
}

#scrolldown {
	background: url(../images/downarrow.gif) 0 -19px;
}

#scrollup:hover {
	background: url(../images/uparrow.gif) 0 -19px;
}

#scrolldown:hover {
	background: url(../images/downarrow.gif) 0 0;
}
