/* --- CSS FOR JENNY THOMPSON SITE --- */

/* --- GENERAL LAYOUT STYLES --- */

* {
padding: 0;
margin: 0;
border: 0;
outline: 0;
}

html {
text-align: center;
}

body {
width: 100%;
height: 100%;
background-color: #f7f6f2;
}

#container {
position: relative;
width: 1024px;
height: 768px;
margin: 0 auto;
}

body.information #container {
height: 700px;
}

body.information02 #container {
height: 700px;
}

#headerbox {
width: 960px;
height: 100px;
margin: 0 auto;
}

#maincontent {
position: relative;
width: 960px;
height: 550px;
margin: 0 auto;
}

body.home #maincontent {
height: 500px;
}

body.paintingslarge #maincontent {
height: 580px;
}

body.drawingslarge #maincontent {
height: 580px;
}

body.stilllifelarge #maincontent {
height: 580px;
}

body.pairslarge #maincontent {
height: 580px;
}

body.information #maincontent {
height: 650px;
}

body.information02 #maincontent {
height: 650px;
}

#innerlining {
position: absolute;
top: 0;
left: 0;
width: 960px;
height: 552px;
}

#footer {
position: relative;
clear: both;
width: 960px;
height: 140px;
margin: 20px auto 0 auto;
}

/* --- TEXT STYLES --- */

h1, h2 {
font-family: Tahoma, sans-serif;
color: #4f6166;
font-weight: normal;
}

h3, h4, p, a, li {
font-family: Tahoma, sans-serif;
color: #111133;
font-weight: normal;
}

h1 {
text-align: left;
font-size: 2.5em;
}

li.header {
text-align: left;
font-size: 2.5em;
color: #4f6166;
}

h2 {
text-align: left;
font-size: 1.5em;
margin: 0 0 10px 0;
}

h2 a {
font-size: 1em;
}

h3 {
text-align: left;
font-size: 1em;
margin: 0 0 5px 0;
text-transform: uppercase;
}

h4 {
text-align: center;
font-size: .7em;
padding: 10px 0 0 0;
text-transform: uppercase;
}

#homeimage h4, #profileimage h4, #exhibitionsimage h4 {
text-align: left;
font-size: .7em;
padding: 10px 0 0 0;
text-transform: uppercase;
}

#profileimage h4  {
padding: 10px 0 0 100px;
}

p {
font-size: .95em;
margin: 0 0 20px 0;
}

/* --- GENERAL LIST STYLES --- */

ul {
list-style-type: none;
}

li {
font-size: .85em;
}

.instruction {
font-size: .95em;
margin: 0 0 20px 0;
}

/* --- GENERAL LINK STYLES --- */

a {
text-decoration: none;
}

a:hover {
color: #a15d62;
text-decoration: none;
}

.selected {
color: #a15d62;
}

/* --- TOP NAVIGATION --- */

#nav {
position: relative;
width: 960px;
height: auto;
text-align: left;
margin: 0 auto;
padding: 0;
}

#nav li {
display: inline;
margin: 0 12px 0 0;
padding: 0;
}

#header {
position: relative;
width: 960px;
height: 75px;
margin: 0 auto;
}

li.navlink {
font-size: 1.0em;   /* was .8em */
}

#nav table {
    border-collapse: collapse;
    width: 100%;
}

#nav th, td {
    padding: 8px;
    text-align: left;
}

/* --- FOOTER --- */

#copyright {
position: absolute;
top: 0;
left: 0;
font-size: .75em;
text-align: left;
}

#webdesign {
position: absolute;
top: 0;
right: 0;
font-size: .75em;
text-align: right;
}

/* --- MAIN CONTENT AREA ---*/

/* --- PROFILE PAGE --- */

#profiletext {
float: left;
width: 460px;
height: 500px;
text-align: left;
}

#profiletext p {
width: 440px;
}

#profileimage {
width: 500px;
height: 500px;
float: left;
}

.profileimage {
margin: 10px 0 0 0;
}

/* --- INFORMATION & EXHIBITIONS PAGES --- */

body.information #footer {
margin: 30px 0 0 0;
}

#informationtext {
width: 360px;
height: 700px;
float: left;
text-align: left;
margin: 0 0 0 40px;
}

#exhibitionstext{
width: 460px;
height: 700px;
float: left;
text-align: left;
margin: 0 0 0 40px;
}

#informationimage, #exhibitionsimage {
float: left;
width: 460px;
height: 700px;
text-align: left;
}

#exhibitionstext a {
font-size: .65em;
text-decoration: none;
border: 1px solid #4f6166;
}

#exhibitionstext a.selected {
font-size: .65em;
text-decoration: none;
border: 1px solid #bf6a2f;
}

#informationtext a {
text-decoration: none;
}

#exhibitionstext a:hover {
border: 1px solid #bf6a2f;
}

#informationtext ul, #exhibitionstext ul {
margin: 0 0 10px 0;
}

/* --- CONTACT PAGE --- */

#contacttext {
width: 460px;
height: 550px;
float: left;
text-align: left;
}

#contactimage {
float: left;
width: 460px;
height: 500px;
text-align: left;
}

h3 .email {
font-size: 1em;
text-transform: lowercase;
}

/* --- PAINTINGS, DRAWINGS, STILL LIFE, PAIRS AND PRINTS PAGES --- */

#thumbnails {
position: absolute;
top: 0;
left: 0;
width: 330px;
height: 580px;
float: left;
border: 1px solid #eee;
}

#thumbnails.pairs {
position: absolute;
top: 0;
left: 0;
width: 220px;
height: 580px;
float: left;
border: 1px solid #eee;
}

#thumbnails img {
width: 100px;
height: 100px;
border: 1px solid #eee;
margin: 10px 0 0 0;
}

#thumbnails ul {
width: 330px;
height: 120px;
}

#thumbnails.pairs ul {
width: 220px;
height: 120px;
}
#thumbnails.pairs2 ul {
width: 600px;
height: 120px;
}
#thumbnails li {
width: 100px;
height: 100px;
display: inline;
}

#thumbnails a {
width: 100px;
height: 100px;
}

#thumbnails a:hover img {
border: 1px solid #a15d62;
}

#bigpicture {
position: absolute;
top: 0;
left: 356px;
width: 600px;
height: 580px;
border: 1px solid #eee;
}

#bigpicture h2 {
text-align: center;
margin: 10px 0 0 0;
}

#bigpicture img {
margin: 10px 0 0 0;
}

.picturenav a {
font-size: .75em;
}

.drawingsnav a {
font-size: .75em;
}

.biggerpic {
width: 958px;
height: 600px;
border: 1px solid #eee;
}

img.enlarged {
margin: 10px 0 0 0;
}

#pictitles {
position: relative;
width: 600px;
height: 50px;
}

#pictitles.portrait {
position: relative;
width: 300px;
height: 50px;
margin: 0 auto;
}

#pictitles.portrait250 {
position: relative;
width: 250px;
height: 50px;
margin: 0 auto;
}

#pictitles.square {
position: relative;
width: 400px;
height: 50px;
margin: 0 auto;
}

#pictitles.skinny {
position: relative;
margin: 0 auto;
}

#namesize {
position: absolute;
top: 0;
left: 0;
}

#pictitles.skinny #namesize {
position: relative;
}

#namesize h4 {
padding: 0 0 0 20px;
text-align: left;
}

#pictitles.skinny #namesize h4 {
text-align: center;
padding: 0;
}

#pictitles.portrait #namesize h4 {
padding: 0;
text-align: left;
}

#pictitles.portrait250 #namesize h4 {
padding: 0;
text-align: left;
}

#pictitles.square #namesize h4 {
padding: 0;
text-align: left;
}

#materialprice {
position: absolute;
top: 0;
right: 0;
}

#pictitles.skinny #materialprice {
position: relative;
}

#materialprice h4 {
text-align: right;
padding: 0 20px 0 0;
}

#pictitles.skinny #materialprice h4 {
text-align: center;
padding: 0;
}

#pictitles.portrait #materialprice h4 {
text-align: right;
padding: 0;
}

#pictitles.portrait250 #materialprice h4 {
text-align: right;
padding: 0;
}

#pictitles.square #materialprice h4 {
text-align: right;
padding: 0;
}

h4.clickinstruction {
color: #888;
font-size: .7em;
text-transform: lowercase;
text-align: left;
padding: 30px 0 0 0;
}

#clickback {
position: absolute;
top: 0;
left: 0;
width: 100px;
height: 30px;
}

h4.back {
color: #888;
text-align: center;
font-size: .75em;
text-transform: lowercase;
}

h4.backleft {
color: #888;
text-align: left;
font-size: .75em;
text-transform: lowercase;
padding: 10px 0 0 5px;
}