/* styles for back pages */
/* Will / should eventually be merged with style.css to form the basis of a new layout */

body  { color: #000; font-family: arial, sans-serif; background: #ffdaf1; }
.bgdark { background-color: #3B495B; }
.bgmedium { background-color: #6F89AA; }
.bglight { background-color: #D1E0F4; }

a:link          {color: #FFFFFF}
a:visited       {color: #FFFFFF}
a:active        {color: #FFFFFF}
a:hover         {color: #f79cc6}

#container { width: 1050px; height: auto; margin: 0px auto; }

#header { width: 1000px; height: 140px; margin: 2px auto; border-bottom: 1px solid #000; position: relative;}
#header-right {width:440px; height: 120px;  position: absolute; top: 10px; left: 550px;}
#header-right h2 {font-size: 12pt; margin:0px; padding:0px;}

#header-right ul.toplistrow { list-style-type: none; display: block; width: 215px; float: left;  margin:0px; padding:0px;}
#header-right ul.toplistrow li { margin-left: 5px; padding: 2px; display: block; }
#header-right ul.toplistrow li a { font-size: 12pt; font-weight: bold; text-decoration: none; }


#logo { width: 590px; height: 20px; position: absolute; top: 115px; }
#logo h1 { color: #333333; font-size: 14pt; font-style: italic; margin: 0px 0px 0px 25px; padding: 0px; }
#logo h1 a {color: #333333; text-decoration: none;}
#logo h1 a:hover {color: #666666; text-decoration: underline;}

.cats { margin: 0px auto 5px auto; width: 1000px; padding: 2px; text-align:center;}
.cats ul {list-style: none; display: inline; margin: 0px; padding: 0px; }
.cats ul li {display:block; float:left;}
.cats ul li a {display: block; width: 94px; border: 1px solid #808080; text-decoration: none; margin: 2px; float: left; 
               font-size: 10pt; font-weight: bold; color: #fff; padding: 2px 0px;}
.cats ul li a:hover {color: #f79cc6; }

#topad {width:480px; height:65px; margin: 10px 0px 0px 40px; padding: 0px; }
#topad img {border: 2px solid #ffdaf1;}
#topad a:hover img {border: 2px solid #f00;}

.midad { clear:both;  width: 1050px; text-align: center; margin-top:20px; padding:10px;}
.midad img {border: 2px solid #ffdaf1;}
.midad a:hover img {border: 2px solid #f00;}
.midad a { color: #ee00ee; font-size: 12pt; font-weight: bold; font-style: italic;  padding:9px; text-decoration:none;}
.midad a:hover {color:#f79cc6; text-decoration:underline;}

#btmad { width: 1050px; text-align: center; margin-top:20px; padding:10px;}
#btmad a { color: #ee00ee; font-size: 16pt; font-weight: bold; font-style: italic;  padding:9px; text-decoration:none;}
#btmad a:hover {color:#f79cc6; text-decoration:underline;}
#btmad img {border: 2px solid #ffdaf1;}
#btmad a:hover img {border: 2px solid #f00;}


.toplistrow1 { padding-top: 5px; }
.toplistrow1 ul.toplistrow { list-style-type: none; display: inline;  margin:0px; padding:0px;}
.toplistrow1 ul.toplistrow li { margin-left: 5px; padding-right: 5px; padding-left: 5px; display: inline; }
.toplistrow1 ul.toplistrow li a { font-size: 12pt; font-weight: bold; }

.toplistrow2 { text-align: center; width: 1050px; clear: both; padding: 15px 0px; }
.toplistrow2 ul.toplistrow { list-style-type: none; display: block;  margin:0px; padding:0px; clear:both;}
.toplistrow2 ul.toplistrow li { margin-left: 5px; padding-right: 5px; padding-left: 5px; display: block; width: 180px; float: left; }
.toplistrow2 ul.toplistrow li a { font-size: 12pt; font-weight: bold; }

.toplistcolumn ul { list-style-type: none; margin: 0; padding: 0; }
.toplistcolumn ul li { margin: 0px 0px 5px 10px; }
.toplistcolumn ul li a { font-size: 12pt; font-weight: bold; }
.toplistcolumn h2 { margin:0px 0px 10px 10px; color: #7f004f; font-size: 12pt; padding:0px;}

.toplistcolumn { width: 200px; float: left; }
.panel { width: 1050px; clear: both; }

/* the magic centred variable width div... */
#toplistbottom { text-align: center; width: 100%; clear: both; float:left; overflow:hidden;}
#toplistbottom h3 { margin-top: 40px; font-size: 12pt; color: #fff; }
.tlbinner {clear:left; float:left; position:relative; left:50%; }
.tlcol { font-weight: bold; text-align: left; width: 190px; float: left; margin-bottom: 10px; position:relative; right:50%;}
.tlcol ol { font-size: 10pt; color:#fff;  }
.tlcol ol li {  }
.tlcol ol li a { font-size: 10pt; font-weight: bold; }

.toplistother {width: 70%; text-align: center; margin: 20px auto; }
.toplistother ul {list-style: none; margin: 5px 0px; padding: 0px;}
.toplistother ul li {display: inline; padding-left: 10px; font-weight: bold; }

#bkmark1, #bkmark2, #bkmark3, #bkmark4 { width: 1020px; text-align: center; height: 40px; margin: 10px;}

#pagefooter { color: #000; text-align: center; width: 1050px; margin-top:40px;}
#pagefooterleft { width: 370px; float: left; }
#pagefootercentre { font-size: 8pt; width: 520px; float: left; }
#pagefooterright { width: 250px; float: left; }
.parfooter {font-size: 8pt; color:#000; width:500px; text-align:center; margin: 0px auto;}

.thumbs {border: 1px solid #000;  width:998px; padding-top: 8px; margin: 0px auto; }
.thumbheader { height: 39px; text-align: left;}
.thumbrow { width: 980px; padding: 0px; height: 214px; margin: 0px auto; }

div.thumb { font-size: 7pt; font-family: Verdana, Arial, Helvetica, sans-serif; text-align: center; width: 156px; float: left; margin: 3px 4px; }
div.thumb img { background-color: #6f89aa; width: 150px; height: 200px; float: left; border: solid 2px #000; margin: 0px 3px;}
div.thumb a { color: #000; text-decoration: none; }
div.thumb a:hover img { border: solid 2px #f00; }
div.thumb a:hover {color:#f00} /* dummy to fix IE hover bug */

.thumb-header-text { padding-left: 10px; text-align: left; color: #7f004f; width: 702px; height: 25px; float: left; 
 margin-left: 8px;  color: #fff;margin-bottom: 2px;}
.thumb-header-text h2 { font-size: 16pt; font-style: italic; padding: 1px; margin: 0px; font-weight:normal;}
.thumb-header-text-right { padding-right: 10px; text-align: right; color: #fff; font-size: 12pt; width: 250px; height: 25px; float: left; margin-bottom: 2px; }
.thumb-header-text-right p {font-size:10pt; margin:0px; padding:2px;}
.thumb-header-text-right p a {font-weight:bold; text-decoration: none;}

.adstextblock { width: 1050px; text-align: center; margin-top:20px; padding:10px;}
.adstextblock a { color: #ff6afd; font-size: 16pt; font-weight: bold; font-style: italic;                   background-color: #ffe6f7; border: solid 
1px #c7007c; padding:9px; text-decoration:none;}
.adstextblock a:hover {color:#f79cc6; text-decoration:underline;}

.archivelist { margin: 0px auto 5px auto; width: 1000px; padding: 2px; text-align:center; color: #fff}
.archivelist ul {display: inline; list-style-type: none; margin: 0; padding: 0;}
.archivelist ul li {display: block; float: left; width: 24px; border: 1px solid #808080;margin: 2px;padding: 2px 0px;}
.archivelist ul li a {display: block; width: 24px; float: left;  text-decoration: none; 
 font-size: 12pt; font-weight: normal; color: #fff; }
.archivelist ul li a:hover {color: #f79cc6; text-decoration:underline; }
.archivelist h4 {display: inline; float:left; margin:5px 10px 0 0; font-weight: normal;}

.featured { margin: 0px auto 15px auto; width: 960px; padding: 2px 20px; text-align:left; color: #fff;}
.featured ul {list-style-image: url('/artwork/fct/butterfly-bullet.gif'); margin: 0 10px; padding: 0px 20px;}
.featured ul li a { color: #fff; }
.featured ul li a:hover { color: #f79cc6; }
.featured h3 {margin-bottom:5px;}