/* ==========================================================
Master Stylesheet

version:   Fergus Hall Master Paintings www.hallmasterpaintings.com B10 February 25 2009
updated:   May 13 2010
author:    Duncan Marshall
email:     dm@chromadesign.co.uk
website:   http://www.chromadesign.co.uk

============================================================ */

* {margin: 0; padding: 0;}
html{height:100%; margin-bottom:1px}
ul{list-style-type: none; margin: 0px; padding: 0px;}
a{outline:none; text-decoration: none; border: none;}
a IMG{border:none;}

span{position: relative; left: -3000px;}
body {margin: 0px; padding: 0px; background: #666666; font-family: Garamond, Georgia, "Palatino Linotype", "Times New Roman", times, serif; font-size: 12px; line-height: 24px; text-align: center; color: #fff;}

#wrapper{width: 980px; height: auto; margin: auto; text-align: left; }
#header{width: 980px; height: 112px; background: url(../i/str/banner05.jpg) 0px 0px no-repeat;}
body#homepage #header{width: inherit; height: 111px; background: url(../i/str/banner06.jpg);}
body#zoompage #header{height: 20px; background: url(../i/str/banner07.jpg) 0px bottom;}


/* Navigation */
ul#navigation{width: 858px; padding-left: 122px; height: 100px; float: left; background: url(../i/str/right_shadow.jpg) top right no-repeat;}
body#homepage #navigation{width: 868px; padding-left: 112px; background: url(../i/str/navigation03.jpg) 0px 0px no-repeat;} 
/* switch back to this version when Notable Sales is restored */
/* ul#navigation{width: 788px; padding-left: 192px; height: 100px; float: left; background: url(../i/str/right_shadow.jpg) top right no-repeat;} 
body#homepage #navigation{width: 778px; padding-left: 182px; background: url(../i/str/navigation03.jpg) 0px 0px no-repeat;}
Use this one when Notable Sales is hidden */

ul#navigation li{float: left; height: 30px;}
ul#navigation li a{display: block; height: 30px; background-repeat: no-repeat;}
ul#navigation li a,
a:link
a:visited
a:active{background-position: 0px 0px;}
ul#navigation li a:hover, ul#navigation li a.crt{background-position: 0px -30px;}

li#home{width: 73px;}
li#woa{width: 150px;}
li#about{width: 98px;}
li#fairs{width: 182px; }
li#sales{width: 141px;}
li#contact{width: 96px;}

body#homepage li#home a{background-image: url(../i/nv1/home.png);}
body#homepage li#woa a{background-image: url(../i/nv1/woa.png);}
body#homepage li#about a{background-image: url(../i/nv1/about.png);}
body#homepage li#sales a{background-image: url(../i/nv1/sales.png);}
body#homepage li#fairs a{background-image: url(../i/nv1/fairs.png);}
body#homepage li#contact a{background-image: url(../i/nv1/contact.png);} /* combine all of these images into common stacks */

li#home a{background-image: url(../i/nv2/home.png);}
li#woa a{background-image: url(../i/nv2/woa.png);}
li#about a{background-image: url(../i/nv2/about.png);}
li#sales a{background-image: url(../i/nv2/sales.png);}
li#fairs a{background-image: url(../i/nv2/fairs.png);}
li#contact a{background-image: url(../i/nv2/contact.png);}

ul#navigation ul.dropdown{width: 150px; height: 60px;}
body#homepage ul.dropdown{border: 1px solid #a8a7a7;}
ul#navigation ul.dropdown li{display: block; width: 150px; height: 20px;}
ul#navigation ul.dropdown li a{display: block; width: 150px; height: 20px;}
ul#navigation ul.dropdown li a,
a:link
a:visited
a:active{background-position: 0px 0px;}
ul#navigation ul.dropdown li a:hover, ul#navigation ul.dropdown li a.crt{background-position: 0px -20px;}

ul#navigation ul li#old a{background-image: url(../i/sub/oldmasters.png);}
ul#navigation ul li#british a{background-image: url(../i/sub/british.png);}
ul#navigation ul li#complete a{background-image: url(../i/sub/complete.png);}

body#homepage ul#navigation ul li#old a{background-image: url(../i/sub/oldmasters_home.png);}
body#homepage ul#navigation ul li#british a{background-image: url(../i/sub/british_home.png);}
body#homepage ul#navigation ul li#complete a{background-image: url(../i/sub/complete_home.png);}

/* Suckerfish Dropdown */
body.sf ul#navigation li ul { /* second-level lists */
position: absolute;	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}
body.sf2 ul#navigation li ul { /* second-level lists */
position: absolute;	left: -999em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}
body.sf ul#navigation li:hover ul ul, body.sf ul#navigation li.sfhover ul ul {left: -999em;}
body.sf ul#navigation li:hover ul, body.sf ul#navigation li li:hover ul, body.sf ul#navigation li.sfhover ul, body.sf ul#navigation li li.sfhover ul { /* lists nested under hovered list items */ top: 122px; left: auto; padding-top: 20px; background: url(../i/str/woa.png) 0px -10px no-repeat;}
body.sf2 ul#navigation li:hover ul ul, body.sf2 ul#navigation li.sfhover ul ul {left: -999em;}
body.sf2 ul#navigation li:hover ul, body.sf2 ul#navigation li li:hover ul, body.sf2 ul#navigation li.sfhover ul, body.sf2 ul#navigation li li.sfhover ul {top: 5px; left: auto; padding-top: 22px; background: url(../i/str/woa2h.png) 0px -5px no-repeat;}


/* Home Page */
#content{width: 980px; height: auto; background: url(../i/str/content.jpg) bottom left no-repeat;}
body#homepage #content{width: 960px; height: 475px; padding-bottom: 0px; border: 1px solid #4a4a5d; position: relative; left: 10px; background-color: #c3c3c3; background-image: none;}
.panel{float: left; width: 320px; height: 208px; background-position: 0px 0px; background-repeat: no-repeat;} /* need to redo graphics */
#one{background-image: url(../i/str/panel1.jpg);}
#two{background-image: url(../i/str/panel2.jpg);}
#three{background-image: url(../i/str/panel3.jpg);}
#base{clear: both; width: inherit; height: 167px; background: url(../i/str/base02.jpg) 0px 0px no-repeat;}
#base h2{width: 560px; height: 35px; background: url(../i/str/specialists_02.png) 0px 0px no-repeat; position: relative; top: 8px; left: 200px;}
#minithumbs{width: 590px; position: relative; top: 6px; left: 190px; }
.minithb{margin-left: 8px;}
.minithb IMG{border: 1px solid #4a4a5d;}

/* Gallery Page */
#thumbs{width: 955px; height: auto; padding-left: 25px; background: url(../i/str/right_shadow.jpg) right -30px no-repeat;}
.thb{float: left; width: 456px; height: auto; margin-right: 14px; text-align: center;} /* width was 222px */
.thb IMG{border: 1px solid #4a4a5d; margin-bottom: 12px;}


/* Catalogue Page */
#description{width: 980px; background: url(../i/str/right_shadow.jpg) right -100px no-repeat;}
body#aboutpage #description, body#fairspage #description{height: 700px;}
body#zoompage #description, body#cataloguepage #description{min-height: 700px; padding-top: 20px;}
body#contactpage #description{height: 466px;}
body#mappage #description{height: 460px;}
body#mappage #description p{margin-left: 50px;}

#description IMG{float: left; border: 1px solid #4a4a5d; margin: 0px 15px 24px 25px; }
#form{float: right; width: 455px; height: auto; margin-right: 25px;}
#summary{float: right; width: 455px; height: auto; margin-right: 25px;}
body#zoompage #summary{width: 470px;}
#condition{margin: 0px 25px 0px 25px;}
body#zoompage #condition{margin-left: 35px;}
#text{width: 930px; margin-left: 25px;}

ul#process{float: right; width: 125px; height: 30px;}
ul#process li{float: left; display: block; width: 17px; height: 19px; margin-left: 8px;}
ul#process li a{display: block; width: 17px; height: 19px; background-repeat: no-repeat; background-position: 0px 0px;}
li#previous a{background: url(../i/process/previous.jpg);}
li#tozoom a{background: url(../i/process/zoom.jpg);}
li#unzoom a{background: url(../i/process/unzoom.jpg);}
li#togallery a{background: url(../i/process/gallery.jpg);}
li#print a{background: url(../i/process/print.jpg);}
li#next a{background: url(../i/process/next.jpg);}

ul#process li a,
a:link
a:visited
a:active{background-position: 0px 0px;}
ul#process li a:hover{background-position: 0px -19px;}

/* Substitute LI images for direct links, zoom, etc */
ul#process.direct li{background-position: 0px 0px; background-repeat: no-repeat;}
ul#process.direct li#previous{background: url(../i/process/previous_dark.jpg);}
ul#process.direct li#togallery{background: url(../i/process/gallery_dark.jpg);}
ul#process.direct li#print{background: url(../i/process/print_dark.jpg);}
ul#process.direct li#next{background: url(../i/process/next_dark.jpg);}


/* Zoom Page */
#zoom{float: left; width: 456px; height: 550px; border: 1px solid #666; margin-left: 25px;}
a#backto{margin: 0px 0px 0px 25px;}
a#backto,
a:link
a:visited
a:active{color: #fff; font-family: verdana, Arial, Helvetica, sans-serif; font-size: 10px;}

/* About Us Page */
#abouttext{width: 930px; margin-left: 25px; height: 600px; background: url(../i/str/right_shadow.jpg) right -30px no-repeat;}


/* Exhibitions and Fairs Page */
.event{float: left; margin-left: 25px; width: 930px;}
.event IMG{float: left; margin-right: 10px;}

/* Contact Page */
div#contact{float: left; width: 456px; height: 360px; margin-left: 25px;}
body#contactpage p{margin: 0px 0px 12px 0px;}
body#contactpage p a.fergus, body#contactpage p.inline a,
a:link
a:visited
a:active{color: #fff; font-weight: 600;}
body#contactpage p a.fergus:hover{border-bottom: 1px solid #fff;}
body#contactpage #form p{margin-bottom: 0px;}
.antispam{color: #666666; margin-left: -5px;}

#form{}
#form p{width: 450px; clear: both; margin-bottom: 10px;}
label{float: left; text-align: right; width: 80px; font-weight: 500;}
input{float: right; text-align: left; width: 355px; height: 20px; line-height: 20px; margin-top: 0px; margin-bottom: 0px;}
input#send{width: 110px; color: #fff; height: 22px; padding-bottom: 2px; text-align: center;}
input#search{padding-left: 0px;}
input#maillist{width: 20px; position: relative; top: 2px; left: -170px; background: none; border: none;}
textarea{float: right; text-align: left; width: 355px;}
input, textarea{background-color: #707070; border: 1px solid #5d5d5d; color: #fff;}
p.inline{float: left; width: 190px; display: inline;}
p.chroma{clear: left; position: relative; top: 20px;}
p.privacy{float: left; clear: left; width: 450px; font-size: 11px;}
#form p.fields{width: 355px; margin-left: 95px;}
#privacy{width: 920px; margin-left: 45px;}

/* Map Page */
p.location{position: absolute; top: 212px; left: 76px; width: 200px;}
#description IMG.noborder{border: none;}


/* Headers and Paragraphs */
h2{margin: 0px 0px 0px 0px; font-size: 16px; line-height: 18px; font-variant: small-caps}
h3{font-weight: 600; font-family: Georgia, serif; margin: 0px 0px 8px 0px; font-size: 12px; line-height: 12px; font-style: italic;} /* for thumb titles */
h3.artist{font-style: normal;}
body#cataloguepage h3{line-height: 18px; }
h4{font-size: 16px; line-height: 18px; margin: 12px 0px 0px 0px;}
body#fairspage h2{margin: 0px 0px 2px 0px;}
body#fairspage h3{margin: 0px 0px 0px 0px;}
body#fairspage h4{font-size: 12px; margin: 0px 0px 0px 0px;}
p{margin: 0px 0px 0px 0px; font-size: 15px; line-height: 24px;}
p a,
a:link
a:visited
a:active{color: #520f0f; border-bottom: 1px solid gray;}
p a:hover{color: #fff; border-bottom: 1px solid #fff;}
#text p, body#aboutpage p{margin: 0px 0px 12px 0px;}
#text p{font-size: 16px;} /* added May 13 2010 */
#test p:first{color: red;}
#text p.notes{margin-bottom: 12px; line-height: 18px; font-size: 14px; /* was 11px */}
.linebreak{width: inherit; height: 7px; margin: 24px 0px 24px 0px; background: url(../i/str/linebreak3.png) top center no-repeat;clear: both;}


/* Footer */
#footer{clear: both; display: block; width: 980px; height: 50px; line-height: 50px; text-align: center; font-family: Georgia, "Times New Roman", Times, serif}
#footer p{font-size: 11px;}
#footer p a,
a:link
a:visited
a:active{color: #fff; border-bottom: 1px solid gray;}
#footer p a:hover{border-bottom: 1px solid #fff;}

/* search box */
form#searchform{position: absolute; top: 86px; left: 940px;}
input#search{width: 100px; height: 18px; font-size: 14px; color: #4a4949; line-height: 22px; padding-bottom: 2px;}
input#go{display: block; width: 30px; height: 22px; color: #4a4949;}

/* Clearing */
.clear{width: 940px; height: 20px; clear: both;}
#form .clear{width: 450px; height: 10px;}
