html, body {height: 100%;padding: 0; margin: 0;}
a:link, a:visited {outline: none;}

body {}

/* Background CSS
#
#
#
#
*/

.level
{
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
}
.transition {height: 944px;}

.stars        {height: 100%; background: url('../images/stars-trans.png') left top;}
.upper-clouds {height: 100%; background: url('../images/upper-clouds.gif') -500px top;}
.lower-clouds {height: 100%; background: url('../images/lower-clouds.gif') -100px top;}

#outer-space {background: url('../images/outerspace-bg.gif') left top;}
#inner-space {background: url('../images/innerspace-bg.gif') left top;}
#upper-sky   {background: url('../images/bluesky-bg.gif') left top;}
#lower-sky   {background: url('../images/lightsky-bg.gif') left top;}
#ground-level{background: url('../images/lightsky-bg.gif') left top;}

#outer-to-inner {background: url('../images/outer-to-inner.gif') left top;}
#inner-to-blue  {background: url('../images/inner-to-blue.gif') left top;}
#blue-to-light  {background: url('../images/blue-to-light.gif') left top;}

#universe {height: 100%; background: url('../images/universe.gif') left top repeat-x;}
#moon
{
    position: absolute;
    right: 100px;
    top: 10px;
    width: 300px;
    height: 300px;
    background: url('../images/moon-trans.png') left top no-repeat;
}
#sun
{
    position: absolute;
    right: 70px;
    top: 0px;
    width: 290px;
    height: 290px;
    background: url('../images/sun.gif') left top no-repeat;
}
#hills    
{
	height: 176px; 
	width: 100%;
	background: url('../images/hills.png') center bottom repeat-x;
	position: absolute;
	left: 0px;
	top: -176px;
}
#ground   
{
	background: #acd373;
	position: absolute;
	top: 600px;
	left: 0px;
	right: 0px;
	bottom: 0px;
}
#blue-to-light .upper-clouds {height: 100%; background: url('../images/upper-clouds.gif') -500px -883px repeat-x;}

/* Navigation CSS
#
#
#
#
*/

#fixed
{
    position: absolute;
    top: 0px;
    z-index: 99;
    width: 165px;
}

.nav-string     {background: url('../images/nav-string-trans.png') repeat-y;width: 165px;}
.content-string {background: url('../images/content-string-trans.png') 280px top repeat-y;}

#site-logo
{
    background: url('../images/schooltrends-logo-trans.png') left top no-repeat;
    width: 275px;
    height: 130px;
}
#logo-string {margin-left: 48px; height: 5px;}

#home-button
{
    display: block;
    background: url('../images/home-button-trans.png') left top;
    width: 165px;
    height: 82px;
    margin-left: 1px;
}
#home-string {background-position: 1px top;height: 10px;}

#whatwedo-button
{
    display: block;
    background: url('../images/whatwedo-button-trans.png') left top;
    width: 165px;
    height: 82px;
}
#whatwedo-string {background-position: -2px top;height: 12px;}

#portfolio-button
{
    display: block;
    background: url('../images/portfolio-button-trans.png') left top;
    width: 165px;
    height: 79px;
}
#portfolio-string {background-position: left top;height: 13px;}

#resources-button
{
    display: block;
    background: url('../images/news-button-trans.png') left top;
    width: 165px;
    height: 80px;
}
#resources-string {background-position: -1px top;height: 17px;}

#enquires-button
{
    display: block;
    background: url('../images/enquires-button-trans.png') left top;
    width: 165px;
    height: 80px;
    margin-left: 2px;
}
#enquires-string {background-position: 2px top;height: 14px;}

.main-nav {}

/* Anchor position CSS
#
#
#
#
*/

#enquires
{
    position: absolute;
    left: 0px;
    top: 16935px;
}

#resources
{
    position: absolute;
    left: 0px;    
    top: 11730px;
}

#portfolio
{
    position: absolute;
    left: 0px;
    top: 7830px;
}

#whatwedo
{
    position: absolute;
    left: 0px;    
    top: 3920px;
}

#home
{
    position: absolute;
    left: 0px;
    top: 0px;
}

.main-nav span {position: absolute; left: -3000px;}

/* Content CSS
#
#
#
#
*/

#site-wrapper
{
    position: relative;
    width: 780px;
    height: 100%;
    left: 50%;
    top: 0px;
    margin: 0 0 0 -390px;
}

#content {padding-left: 220px;} 
.content-string {background: url('../images/content-string-trans.png') 277px top repeat-y;}

.content-box
{
    position: relative;
    width: 556px;
    height: 610px;
    background: url('../images/page-background-trans.png') left top no-repeat;
    padding: 1px 4px;
    font-family: arial;
    font-size: 14px;
}

.contact-details {position: absolute; left: 12px; bottom: 35px;width: 531px;}
.wee-me {position: absolute; right: 10px; bottom: 57px;width: auto;cursor: pointer;}

#home-content-string {height: 50px;}
#whatwedo-content-string {height: 3330px;margin-top: -7px;}
#portfolio-content-string {height: 3310px;margin-top: -7px;}
#resources-content-string {height: 3300px;margin-top: -7px;}
#enquires-content-string {height: 4620px;margin-top: -7px;}

/* Effects CSS
#
#
#
#
*/

.tabs {margin-top: -10px;height: 44px;}

.tabs a
{
    display: block;
    float: left;
    background: url('../images/tab-sel-right.png') right top no-repeat;
    padding-right: 13px;
    text-decoration: none;
    color: #ccc;
    cursor: pointer;
}

.tabs a.selected {color: #093878;}

.tabs a b
{
    display: block;
    height: 44px;
    background: url('../images/tab-sel-left.png') left top no-repeat;
    padding-left: 13px;
    line-height: 44px;
    width: 100px;
    text-align: center;
}

.tabs.home {margin-left: 92px;}
.tabs.whatwedo {margin-left: 24px;}
.tabs.portfolio{margin-left: 92px;}
.tabs.enquires {margin-left: 150px;}
.tabs.latestnews {margin-left: 150px;}

/* Content CSS
#
#
#
#
*/

h1 {font-size: 26px;text-align: center;}
h3 {font-size: 16px;}
h1,h2,h3,h4,h5 {color: #093878; margin: 0;padding: 0 4px;}

a {color: #083878; font-weight: bold; text-decoration: none;}
a.content-email {margin: 5px 1px; display: block; float: left;}
a.content-telephone {margin: 5px 2px; display: block; float: right;}

.panel{height: 510px; width: 550px;}

.clear
{
    height: 0;
    clear: both;
    visibility: hidden;
    overflow: hidden;
}


#home-banner
{
    position: relative;
    width: 552px;
    height: 240px;
    background: url('../images/banner-bg.jpg') left top no-repeat;
    padding: 1px;
}

.home-banner-text
{
    width: 255px;
    padding: 5px;
    margin: 5px 0 0 15px;
    display: none;
    font-weight: bold;
}

#website-button
{
    position: absolute;
    left: 390px;
    top: 20px;
    width: 63px;
    height: 63px;
}

#webshop-button
{
    position: absolute;
    left: 460px;
    top: 140px;
    width: 63px;
    height: 63px;
}

#learning-button
{
    position: absolute;
    left: 320px;
    top: 140px;
    width: 63px;
    height: 63px;
}

.speech-quote
{
    width: 239px;
    background: url('../images/speech-mid.jpg') left top repeat-y;
    font-size: 10px;
    font-weight: bold;
}
.speech-quote.png {background: url('../images/speech-mid.png') left top repeat-y;}

.speech-quote .top
{
    height: 7px;
    width: 239px;
    background: url('../images/speech-top.jpg') left top no-repeat;
}
.speech-quote.png .top {background: url('../images/speech-top.png') left top no-repeat;position: absolute; top: -7px;left: 0px;}

.speech-quote.left .bot
{
    height: 20px;
    width: 239px;
    background: #fff url('../images/speech-bot-left.jpg') left top no-repeat;
    font-weight: normal;
    text-align: right;
    padding: 5px 5px 0 0;
}

.speech-quote.right .bot
{
    height: 20px;
    width: 239px;
    background: #fff url('../images/speech-bot-right.jpg') left top no-repeat;
    font-weight: normal;
    text-align: left;
    padding: 5px 0 0 5px;
}
.speech-quote.left.png .bot {background: url('../images/speech-bot-left.png') left top no-repeat;position: absolute; bottom: -25px;left:0px;}

.speech-quote p
{
    margin: 0;
    padding: 2px 7px;
}

#home-latestnews, #home-testimonials, .column {float: left; margin-left: 10px;width: 239px;}
#home-testimonials {margin-right: 40px;}

#home-latestnews p   {font-size: 10px;font-weight: bold;margin: 0;padding: 7px 6px 0px;}
#home-latestnews .bot{font-weight: normal;text-align: left;padding: 5px 0 0 5px;font-size: 10px;}

.divider
{
    clear: both;
    overflow: hidden;
    width: 531px;
    height: 5px;
    background: url('../images/divider.jpg') left bottom no-repeat;
    margin: auto;
}

.inpt {padding: 3px;}
.inpt input {width: 262px; background: #efefef; border: 0px;padding: 3px;font-family: arial;}
.inpt textarea {width: 262px; height: 207px; background: #efefef; border: 0px;padding: 3px;font-family: arial;font-size: 14px;}
.inpt-title {margin: 0 3px;font-size: 10px; border-bottom: 1px solid #ccc;}
.inpt input[type='submit'] {width: 268px;cursor: pointer;font-weight: bold;background: #00478F; color: #fff;height: 24px;}
.inpt input[type='submit']:hover {background: #eee; color: #00478F;border: 1px solid #00478F;}
.inpt select {width: 268px; background: #efefef; border: 0px;padding: 3px;font-family: arial;}

.enquires-panel form {float: left;}

#message-box
{
    float: right;
    width: 268px;
    height: 250px;
    margin-right: 6px;
    font-family: arial;
    font-size: 10px;
}

#message-box p,
.latestnews-panel p
{margin-left: 3px;}


#user-enquiry {margin-left: 3px; height: 373px; overflow: auto;}

ul.websites-list, li.question, ul, li {list-style-image: url('../images/b1.jpg');}
ul.webshop-list, li.answer {list-style-image: url('../images/b2.jpg');}
ul.online-list {list-style-image: url('../images/b3.jpg');}
ul.websites-list li, ul.webshop-list li, ul.online-list li, li  {padding: 3px;}
li.answer {margin-bottom: 20px;}

.portfolio-panel {text-align: center;}
.exple
{
    margin: 3px 10px;
}

.portfolio-panel .column {margin-top: 10px;}
.portfolio-panel .speech-quote p {margin: 2px;}

a img {border: 0px;}

.xhtml1-1, .css
{
    position: absolute;
    bottom: -35px;
    right: 0px;
}

.xhtml1-1 {right: 65px;}

.linker {position: absolute; bottom: -33px; left: 0px;}

#customer-map
{
    width: 510px;
    height:420px;
    border: 0px;
    margin: 0px;
}

.content-box form
{
    width: 275px;
}

.loading {background: url('../images/ajax-loader.gif') center center no-repeat;}

#portfolio-container
{
    overflow: hidden;
    height: 476px;
    width: 550px;
    position: relative;
}

#portfolio-scroller
{
    position: absolute;
    top: 0px;
    left: 0px;
    width: 550px;
}

img.top {position: absolute; top: 0px; left: 0px;}
img.bot {position: absolute; bottom: 0px; left: 0px;}

.homeH1
{
	display:none;
}

.chain-controls {overflow: hidden;}
.next, .previous {float: right;}
.next {margin-left: 5px;}