/* STRUCTURAL LAYOUT CSS CODE FOR A PAGE HAVING THE STRUCTURE:
/* **********************************************************
/* * Header *
/* **********************************************************
/* * index collumn * content collumn *
/* * * *
/* * * *
/* * * *
/* * * *
/* * * *
/* **********************************************************
/* * Footer *
/* **********************************************************
/*
/* the gnu layout uses only the two collumns and the footer
/* note that some of this may need to be changed with ie7
/* note that there is here some css specific to juliuspaintings.co.uk
/* which I have not removed yet.
*/
body {
font-size: 100%; /* historical to avoid IE wierdness when using ems */
background-color: white;
font-family: helvetica,arial,sans-serif;
font-weight: 400;
margin:0px 5px 0px 10px;
}
div.header {
width: 780px;
}
div.spacer {
clear: both;
}
div.twoColumns {
width: 784px;
}
div.contentColumn {
padding: 10px;
float:right;
}
/* this is the ie 5 and be nice to opera bug fix
/* we want the box to be 560px wide and and for there to be a 10 pix interior
/* margin so that the content of the box is 540 pix wide
*/
div.contentColumn {
width:540px;
voice-family: "\"}\"";
voice-family:inherit;
width:520;
}
html>body .contentColumn {
width:520;
}
/* end bug fix
*/
div.indexColumn {
padding: 10px;
float:left;
}
div.indexColumn {
width:220px;
voice-family: "\"}\"";
voice-family:inherit;
width:200px;
}
html>body .indexColumn {
width:200px;
}
div.footer {
width: 780px;
clear:both;
}
/* end structural layout
/* layout of the two w3 validation and code_by_juliuspaintings images in the footer
/* All this ie and be nice to opera stuff deeves my head
/* the images are 2 by 81 pix plus 1 by 100 pix wide
/* the footer comes after a spacer and contains a set of image divs as follows
/* <div class='spacer'>
/* </div> <!-- end class=spacer -->\n";
/* <div class='footer'>\n";
/* <div class="w3images">
/* <!-- allocate width of 360 pix -->
/* <div class="footImg1">
/* <!-- allocate width of 120 pix of which 2 x 5 pix is padding-->
/* <img height="35" width="100" class="w3icon" />
/* </div>
/* <div class="footImg2">
/* <!-- allocate width of 120 pix of which 2 x 5 pix is padding-->
/* <img height="31" width="88" class="w3icon" />
/* </div>
/* <div class="footImg2">
/* <!-- allocate width of 120 pix of which 2 x 5 pix is padding-->
/* <img height="31" width="88" class="w3icon" />
/* </div>
/* </div> <!-- end class w3images -->
/* </div> <!-- end class='footer' -->
*/
div.w3images {
width: 360px;
}
div.footImg1 {
padding: 5px;
float:left;
}
/* this is the ie 5 and be nice to opera bug fix
/* we want the box to be 120px wide and for there to be an 5 pix interior
/* margin so that the content of the box is 110 pix wide
*/
div.footImg1 {
width:110px;
voice-family: "\"}\"";
voice-family:inherit;
width:100px;
}
html>body .footImg1 {
width:100px;
}
div.footImg2 {
padding: 5px;
float:right;
}
div.footImg2 {
width:110px;
voice-family: "\"}\"";
voice-family:inherit;
width:100px;
}
html>body .footImg2 {
width:100px;
}
/*
/* LAYOUT OF CONTENT
*/
div.thePicture {
margin-top: 0.5em;
text-align: center;
}
div.pictureTitle {
text-align: center;
}
div.willProvidePrintIfAsked {
font-style: italic;
font-size:1.0em;
font-weight: 600;
margin-top: 2.5em;
margin-bottom: 0.0em;
}
div.preFormatedText {
margin-top: 0.5em;
}
.preFormatedText p{
margin-top: -0.5em;
margin-bottom: 0.0em;
font-size:0.8em;
/* background: #aaaa99;
*/
}
/*
/* LAYOUT INDEX
*/
ul.constantIndexElements { /* ok */
list-style-type:none;
margin-top: -0.1em;
font-size: 1em;
margin-left: 0px;
padding-left: 0px;
}
li.constantIndexElements { /* ok */
clear:both;
margin-top: 0.5em;
}
ul.predAndSuccGroups { /* ok */
list-style-type:none;
margin-top: -0.1em;
font-size: 1em;
font-weight: 800;
text-align:right;
margin-left: 0px;
padding-left: 0px;
}
li.predAndSuccGroups { /* ok */
clear:both;
margin-top: 0.5em;
}
ul.indexElements { /* ok */
list-style-type:none;
/*margin-top: -0.1em;*/
font-size: 1em;
margin-left: 0px;
padding-left: 0px;
}
li.indexElements { /* ok */
clear:both;
/*margin-left: -40px; */
}
div .indexImg {
margin-top: 0.5em;
text-align: center;
}
ul.bigPrintList { /* ok */
list-style-type:none;
/*margin-top: -0.1em;*/
margin-top: 0em;
font-size: 1em;
margin-left: 0px;
padding-left: 0px;
}
li.bigPrintList { /* ok */
clear:both;
margin-top: 0.5em;
/*margin-left: -40px;*/
}
ul.commentList { /* ok */
list-style-type:none;
/*margin-top: -0.1em;*/
margin-top: 0.2em;
font-size: 1em;
font-weight: 700;
text-align: center;
margin-left: 0px;
padding-left: 0px;
}
li.commentList { /* ok */
clear:both;
margin-top: 0.5em;
/*margin-left: -40px;*/
}
/* paintImages.css
*/
/* css for image appearance - non layout
*/
img.idex {
border-width: 1px;
border-color: #000000;
border-style: solid;
}
.w3icon {
border-width: 1px;
border-color: #ffffff;
border-style: solid;
}
img.contentImage {
border-width: 1px;
border-color: #000000;
border-style: solid;
}
img.payPalImage {
border-width: 1px;
border-color: #ffffff;
border-style: solid;
}
/* paintFonts.css
*/
body {
font-family:Arial,sans-serif;
}
.preFormatedText {
white-space: pre;
font-family: Courier,monospace;
}
h2 {
font-size:1.2em;
font-weight: 900;
margin-top: 0.5em;
margin-bottom: 0.0em;
}
h3 {
font-size:1.1em;
font-weight: 700;
margin-top: 0.2em;
margin-bottom: 0.0em;
}
h1.content {
font-size:1.4em;
font-weight: 900;
margin-top: 1.0em;
margin-bottom: 0.0em;
}
h2.content {
font-size:1.2em;
font-weight: 900;
margin-top: 0.5em;
margin-bottom: 0.0em;
}
h2.pictureTitle {
font-size:1.1em;
font-weight: 700;
margin-top: 0.2em;
margin-bottom: 0.0em;
}
h3.pictureTitle {
font-size:1.0em;
font-weight: 700;
margin-top: 0.2em;
margin-bottom: 0.0em;
}
.mainIndex {
font-size: 1.0em;
font-weight: 700;
margin-top: -0.1em;
margin-bottom: 0.2em;
}
h2.mainIndex {
font-size:1.2em;
font-weight: 900;
margin-top: 0.5em;
margin-bottom: 0.0em;
}
h3.mainIndex {
font-size:1.0em;
font-weight: 700;
margin-top: 0.2em;
margin-bottom: 0.0em;
}
#siteTitle h1 {
text-align:center;
font-size:2.0em;
font-weight: 900;
margin-top: 0.2em;
margin-bottom: 0.0em;
}
#siteTitle h2 {
text-align:center;
font-size: 1.2em;
font-weight: 700;
color:black;
margin-top: -0.1em;
margin-bottom: 0.2em;
}
.payPalPictureTitle h2 {
text-align:center;
font-size:1.0em;
font-weight: 400;
margin-top: 0.2em;
margin-bottom: 0.0em;
}
.payPalPrintOneItemButton {
text-align:center;
}
h3.payPalPrintOneItemButton {
font-size: 1.0em;
font-weight: 700;
margin-top: 0.2em;
margin-bottom: 0.0em;
}
h4.payPalPrintOneItemButton {
font-size: 1.0em;
font-weight: 500;
margin-bottom: 0.0em;
}
h5.payPalPrintOneItemButton {
font-size: 0.9em;
font-weight: 450;
margin-top: 0.5em;
margin-bottom: 0.0em;
}
.constantIndexElements {
text-align:right;
font-size: 1.0em;
font-weight: 600;
}
.bigPrintList {
text-align:right;
font-size: 1.0em;
font-weight: 600;
}
#friendsEmailForm {
font-size:1.0em;
font-weight: 500;
margin-top: 0.2em;
margin-bottom: 0.0em;
}
#friendsEmailForm h1 {
font-size:1.3em;
font-weight: 900;
margin-top: 0.5em;
margin-bottom: 0.0em;
}
#friendsEmailForm h2 {
font-size:1.2em;
font-weight: 900;
margin-top: 0.5em;
margin-bottom: 0.0em;
}
#friendsEmailForm .error{
font-style: italic;
background-color: #ffff60 ;
}
#friendsEmailForm h2.error{
font-style: normal;
color: #ff0000;
background-color: #ffffff ;
}
ul.unorderedListSequence { /* ok */
list-style-type:disc;
margin-top: 0.2em;
font-size: 1em;
/* margin-left: -1.5em;
padding-left: 0px;
*/
background-color: #fcfcfc ;
}
.unorderedListSequence li {
margin-top: -0.5em;
font-size: 1em;
margin-left: -1.5em;;
background-color: #fefefe ;
/* padding-left: 0px;
*/
}
/*img.idex {
border-width: 1px;
border-color: #000000;
border-style: solid;
}
*/
a:link {
color: #600000 ;
}
a:visited {
color: #500060 ;
}
a:hover {
/*font-style: italic;*/
background-color: #ffff00 ;
}
a:hover img {
border:1px;
border-color: #808080;
background-color: #ffffff ;
border-style: solid
}
/*
a.footImg1:hover {
border:none;
background-color: #ffffff ;
}
a.footImg2:hover {
border:none;
background-color: #ffffff ;
}
*/
h1.centered {
text-align:center;
font-size:1.5em;
font-weight:700;
margin-top: 0.2em;
margin-bottom: 0.3em;
}
h2.centered {
text-align:center;
font-size:1.4em;
font-weight:700;
margin-top: 0.2em;
margin-bottom:0.3em;
}
h3.centered {
text-align:center;
font-size:1.2em;
font-weight:700;
margin-top: 0.2em;
margin-bottom: 0.3em;
}