/* CSS Document main styles*/

/*styles written by dw75@le.ac.uk*/

body {margin: 0; padding: 0; background: url(../images/body_bg.png) #000 repeat-x 0 0; font-family: Verdana, Arial, Helvetica, sans-serif;}

.centre {clear: both; width: 920px; margin: 0 auto 60px auto; }
.flexible {width: 905px; margin: 0 0 0 0;}
.flexible .transparent1 {width: 347px;}
.frame {overflow: auto; height: 300px; width: 100%; }

.logos {float: right; margin: 5px 0 0 0;} 

.transparent1 {background: url(../images/transparent1.png) transparent no-repeat bottom right; padding: 6px 30px 6px 10px; color: #fff;}
.transparent2 {background: url(../images/transparent2.png) transparent no-repeat bottom left; text-align: center;}
/*.transparent3 {background: url(../images/transparent3.png) transparent repeat bottom left;}
.transparent4 {background: url(../images/transparent4.png) transparent no-repeat top left;}*/

.box1 {background: url(../images/box1.png) transparent no-repeat bottom left; padding: 4px 0 4px 15px; color: #fff; width: 130px;}
.box2 {background: url(../images/box2.png) transparent no-repeat bottom left; padding: 4px 0 4px 15px; color: #fff; width: 130px;}
.box3 {background: url(../images/box3.png) transparent no-repeat bottom left; padding: 4px 0 4px 15px; color: #fff; width: 108px;}
.box4 {background: url(../images/box4.png) transparent no-repeat bottom left; padding: 4px 0 4px 15px; color: #fff; width: 128px;}
.box5 {background: url(../images/box5.png) transparent no-repeat bottom left; padding: 4px 0 4px 15px; color: #fff; width: 130px;}

.box1 a, .box2 a, .box3 a, .box4 a, .box5 a {font-weight: bold; color: #fff; text-decoration: none;}
.box1 a:hover, .box2 a:hover, .box3 a:hover, .box4 a:hover, .box5 a:hover {color: #333;}

.gcse {width: 300px; float: right; margin: 0 0 40px 30px;}
.alevel {width: 300px; float: right;}

.gcse h3,  .alevel h3 {text-align: left; color: #fff; background: none ; margin: 0 0 10px 0; padding: 0; font-size: 140%;}
.gcse ul, .alevel ul {margin: 0 0 15px 0; padding: 0;}
.gcse a, .alevel a {color: #fff;}
.gcse ul li, .alevel ul li {color: #fff; margin: 0; padding: 5px 0 5px 0; list-style-type: none;}
.gcse h3 a, .alevel h3 a {color: #fff; text-decoration: none; font-weight: normal;}
.gcse h3 a:hover, .alevel h3 a:hover  {color: #ccc;}

.gcse a.aqabiology {color: #91D700; font-weight: bold;}
.gcse a.aqahuman {color: #8AC5FF; font-weight: bold;}
.gcse a.edexcel {color: #FF934A; font-weight: bold;}
.gcse a.ocr {color: #DE7ABD; font-weight: bold;}
.gcse a.wjec {color: #FF2D2D; font-weight: bold;}

.transparent2 img {margin: 0 auto 0 auto; display: inline; padding: 0 2px 0 2px;}
img {border: none;}

p {font-size: 82%;  line-height: 150%; margin: 0 0 15px 0; padding: 0; color: #fff;}
img.home-image {float: right; margin: -40px 0 10px 30px;}
.highlight, .special {border: 1px solid #A01B75; padding: 1em; margin: 15px 0 15px 0 !important;}
h2 {font-size: 160%; color: #fff; font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; font-weight: normal; margin: 0 0 35px 0; padding: 20px 0 0 0; text-align: center; clear: both;}
h3 {font-size: 120%; color: #333; font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; margin: 20px 0 10px 0; padding: 0 0 7px 0; font-weight: normal; background: url("../images/dotty.png") transparent repeat-x bottom left; clear: both;}

img.image-right {float: right; margin: 5px 0 10px 30px;}
img.image-left {float: left; margin: 5px 30px 10px 0;}
img.image-middle {margin: 5px auto 10px auto; display: block;}

.clear {clear: both;}
.right {float: right;}
.left {float: left;}
.no-background {background: none !important;}
.search-form {position: absolute; left: 8px; top: 70px;}
.search-form ul {margin: 0; padding: 0;}
.search-form ul li {float: left; font-size: 70%; list-style: none; margin: -7px 0 0 0; padding: 0;}
.spacer {margin: -7px 0 0 6px !important;}
.search-button {width: 3em; margin: 0 0 1em 0;}
#words {width: 10em; margin: 0 0 1em 0; border: 1px solid #ccc; padding: 2px;}
#words:focus, #words:hover {border: 1px solid #E14DB1;} 

form {margin: 0; padding: 0;}

.useful-links {width: 200px; float: right; min-height: 200px; margin: 0 0 20px 40px;}
.useful-links h4 {font-size: 130%; margin: 0 10px 10px 0; padding: 0; font-weight: normal;}
.useful-links ul {margin: 0; padding: 0;}
.useful-links ul li {margin: 0; padding: 4px 0 4px 0; color: #fff; list-style-type: none; line-height: 140%;}

table {border: collapse; width: 100%; font-size: 82%; padding: 0 10px 0 10px;}
table td {border: none; padding: 5px; vertical-align: middle; margin: 0;}
table th {color: #333; font-weight: bold; border: none; padding: 5px;}
table p {font-size: 100%;}
table ul li, table ul ul li, table ul ul ul li {font-size: 100% !important; padding: 0; line-height: 100% !important;}

/*This sets the colour of the bar containing the bottom navigation */
.bottomnav {background: transparent; clear: both; padding: 0;}
/*This sets the colour of the five boxes*/
.bottomnav a {background: transparent; border: 1px solid #999;}
/*This sets the colour of the text within the five boxes*/
.bottomnav a:link, .bottomnav a:visited, .bottomnav a:active {color: #999;}
/*This sets the colour of the five boxes and text within, when the mouse is rolled over*/
.bottomnav a:hover {color: #333; background: #fff; border: 1px solid #fff;}


/*This sets the colour for the bar underneath the bottom navigation*/
.maintainer {background: transparent; color: #fff;}
/*This sets the colour of the text for the updated date*/
.maintainerleft {color: #fff;}
/*This sets the colour of the text for the maintainer text*/
.maintainerright a:link, .maintainerright a:visited, .maintainerright a:active {color: #fff; text-decoration: none !important;}
/*This sets the colour of the text for the maintainer text, when the mouse is rolled over*/
.maintainerright a:hover {color: #E44CB2; text-decoration: underline !important;}
/*This sets the colour of the approved text at the very bottom of the screen*/
.approved {color:#fff;}


/************ New bits 23/05/08 **************/

#aqabiology .transparent1 {width: 261px;}
#aqabiology .box1 {width: 89px;} 

#edexcel .transparent1 {width: 345px;}
#edexcel .box3 {width: 146px;}

#ocrbiology .transparent1 {width: 179px;}
#ocrbiology .box4 {width: 77px;}

#wjecbiology .transparent1 {width: 445px;}
#wjecbiology .box4 {width: 70px;}