/*
Links Colour ETC. =P
*/

a:link {color: #1679be; text-decoration: none; }
a:active {color: #1679be; text-decoration: none; }
a:visited {color: #1679be; text-decoration: none; }
a:hover {color: #3dafe1; text-decoration: none; }

.fade {
   opacity: 1;
   transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
   }
 
   .fade:hover {
      opacity: 0.5;
      }

'  
body, div, h1, h2, h3, h4, h5, h6, p, ul, img {margin:0px; padding:0px; }  

body { color: white }
html { overflow-y:hidden }
body { overflow-y:auto }
body { background-color: black;}
body { font-family: calibri; } 
html {height:100%; margin:0; padding:0;}   
body {height:100%; margin:0; padding:0;}   

/*
Containers and Images
950px
*/

#page-background {

    position:absolute; z-index:-1

}

#lowernotice{
	background: url(../images/contentbg.jpg) repeat;
	height: 100px;
	color: #878787;
	margin: 20px;
	float: left;
	padding: 20px;
	padding-top: 40px;
	width: 904px;
	-moz-box-shadow: 0 0 15px #000000;
    -webkit-box-shadow: 0 0 15px #000000;
    box-shadow: 0 0 15px #000000; 
}

#google_translate_element {
    margin-left: 18px;
    float: left;
    overflow: hidden;
}

#main {
    background: url(../images/contentbg.png) repeat;  
    margin-left: auto;
    margin-right: auto;
    margin-bottom: auto;
    margin-top: 20px;
    width: 980px;
    -moz-box-shadow: 0 0 15px #000000;
    -webkit-box-shadow: 0 0 15px #000000;
    box-shadow: 0 0 15px #000000; 
    overflow: auto;
}

#header {
    background: url(../images/header.jpg) repeat-x;  
    -moz-box-shadow: 0 0 10px #000000;
    -webkit-box-shadow: 0 0 10px #000000;
    box-shadow: 0 0 10px #000000; 
	height: 128px;
    overflow: hidden;
/*
    height: 180px; 
	394px
*/
}

#logo {  
        height: 128px;  
        width: 228px;
    	float: left; 
        overflow: hidden; 
    }


#title {  
    height: 49px;  
    width: 316px;
    float: left;  
    margin-top: 45px; 
    overflow: hidden; 
} 

#school {  
    padding-right: 32px;
    height: 128px;  
    width: 228px;
    float: right;
    overflow: hidden;    
}

#navigation {  
    background: url(../images/navbar.jpg) repeat-x;
    margin-top: 15px;
    height: 50px;
    color: #333333;
    float: center;  
    overflow: hidden;
    -moz-box-shadow: 0 0 15px #000000;
    -webkit-box-shadow: 0 0 15px #000000;
    box-shadow: 0 0 15px #000000; 
} 

#navigation2 {  
    background: url(../images/navbar.jpg) repeat-x;
    height: 50px;
    color: #333333;
    float: center;  
    overflow: hidden;
} 

#back {   
    width: 110px; 
    height: 50px;
    float: left; 
    }

#page {  
	background: url(../images/contentbg.jpg) repeat;
    background-color: #000000;
    margin-top: 15px;
    width: 100%;
    height: 620px;
    color: #E8E8E8;
    float: left;  
	overflow: auto;
    -moz-box-shadow: 0 0 15px #000000;
    -webkit-box-shadow: 0 0 15px #000000;
    box-shadow: 0 0 15px #000000; 
} 

#welcomemsg{  
	background: url(../images/welcomebar.jpg) repeat;
    background-color: #000000;
    margin-top: 13px;
	padding-top: 8px;
    width: 674px;
	padding-left: 20px;
    height: 27px;
	color: #CCCCCC;
	overflow: hidden;
    float: right;  
    -moz-box-shadow: 0 0 15px #000000;
    -webkit-box-shadow: 0 0 15px #000000;
    box-shadow: 0 0 15px #000000; 
} 

#content {    
    float: center; 
    margin-left: 18px;
    margin-right: 18px;
}

#principal{
	color: #8F8F8F;
	font-size: 13px;
	margin-right: 20px;
	margin-top: 36px;
	float: right;
	padding: 10px;
	background-color: #1F1F1F;
	-moz-box-shadow: 0 0 15px #000000;
    -webkit-box-shadow: 0 0 15px #000000;
    box-shadow: 0 0 15px #000000; 
}

#principaltext{
	font-size: 13px;
	margin-top:-16px;
	width:220px;
	height:100px;
	float: left;
}

#webcam {
    background: url(../images/contentbg2.jpg) repeat;
    margin-top: 20px;
    width: 256px;
    height: 280px;
	margin-left: 20px;
    float: right;
    -moz-box-shadow: 0 0 15px #000000;
    -webkit-box-shadow: 0 0 15px #000000;
    box-shadow: 0 0 15px #000000; 
    overflow: auto;
}

#news{
    background: url(../images/contentbg.jpg) repeat;
    margin-top: 20px;
    height: 280px;
    width: 418px;
    float: right;
    -moz-box-shadow: 0 0 15px #000000;
    -webkit-box-shadow: 0 0 15px #000000;
    box-shadow: 0 0 15px #000000; 
    overflow: auto;
}

#notices{
    background: url(../images/shadow.png) repeat-x;
    padding-top: 28px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 10px;
	color: #CCCCCC;

}

#webcamcontent{
    background: url(../images/shadow_white.png) repeat-x;
	padding-top: 38px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 10px;
}

#ulinks{
    color: #031b25;
    padding-top: 10px;
    padding-left: 10%;
    padding-bottom: 10px;
    float: center;
}

#sidebarlist{
margin: 22px;
}

#webcamimage{
	padding: 2px;
	margin-top: 6px;
	background-color: #212121;
	height: 163px;
	width: 216px;
	overflow: hidden;
	-moz-box-shadow: 0 0 5px #000000;
    -webkit-box-shadow: 0 0 5px #000000;
    box-shadow: 0 0 5px #000000; 
}

#ulinksc{
    color: white;
    background: url(../images/usefullinks.jpg) repeat;
    width: 158px;
    height: 210px;
    padding-top: 30px;
    padding-left: 30px;
    -moz-box-shadow: 0 0 15px #000000;
    -webkit-box-shadow: 0 0 15px #000000;
    box-shadow: 0 0 15px #000000; 
    overflow: auto;
}

#pagecontent{
	padding-left: 20px;
	width: 75.6%;
	height: 620px;
	overflow: hidden;
	scrolling: no;
	float:left;
}

#sidebar {  
    background: url(../images/contentbg2.jpg) repeat;
    width: 210px; 
	height: 100%;
    color: #333333;
    float: left;  
	-moz-box-shadow: 0 0 15px #000000;
    -webkit-box-shadow: 0 0 15px #000000;
    box-shadow: 0 0 15px #000000; 
    overflow: hidden;
} 

#sbmenu {
	padding-top: 20px;
	padding-left: 10px; 
    	width: 190px;
	height: 100%;
    	float: center; 
    	overflow: auto; 
    }

#sbmenu a:link {
color: #031b25; text-decoration: none;
}

#sbmenu a:active {
color: #031b25; text-decoration: none;
}

#sbmenu a:visited {
color: #031b25; text-decoration: none;
}

#sbmenu a:hover {
color: #0c5f80; text-decoration: none;
}

#sidebarglow {  
    background: url(../images/sidebarglow.png) repeat-x;
    width: 100%; 
    height: 618px;
} 

#footer {  
    background: url(../images/footer.jpg) repeat;  
    width: 100%;
    height: 35px;
    padding-top: 15px;
    float: right;
    -moz-box-shadow: 0 0 15px #000000;
    -webkit-box-shadow: 0 0 15px #000000;
    box-shadow: 0 0 15px #000000; 
    overflow: hidden;
} 

#credits {
    padding-right: 20px;
    text-align: right;
    float: right;
}

#bablogo {
    padding-right: 5px;
    text-align: right;
    float: right;
}

#ulinksc a:link {
color: #FFFFFF; text-decoration: none;
}

#ulinksc a:active {
color: #FFFFFF; text-decoration: none;
}

#ulinksc a:visited {
color: #FFFFFF; text-decoration: none;
}

#ulinksc a:hover {
color: #3dafe1; text-decoration: underline;
}

/*
Top Bar
113
*/

#internet {   
    width: 130px; 
    height: 50px;
    float: left; 
    }
    
#separator {  
    background: url(../images/topbarsep.png) no-repeat;  
    width: 6px; 
    height: 50px;
    float: left; 
    }
#email{   
    width: 130px; 
    height: 50px;
    float: left; 
    }
    
#search{  
    margin-top: 14px;
    padding-right: 10px;
    float: right; 
    }

/*
Front Page Tiles
*/
#fronttiles {
    background: url(../images/lowerbuttons_bg.png) repeat-x; 
    width: 944px; 
    height: 40px;
    float: left;
    margin-top: 18px;
    margin-left: 18px;
    margin-right: 18px;
    -moz-box-shadow: 0 0 15px #000000;
    -webkit-box-shadow: 0 0 15px #000000;
    box-shadow: 0 0 15px #000000; 
    }
#ftile1 {
    background-color: #000000;
    width: 215px; 
    height: 40px;
    overflow: hidden;
    float: left;
    margin-right: 28px;
    }
#ftile2 { 
    background-color: #000000;
    width: 215px; 
    height: 40px;
overflow: hidden;
    float: left;
    margin-right: 28px;
    }
#ftile3 {
    background-color: #000000;
    width: 215px; 
    height: 40px;
overflow: hidden;
    float: left;
    margin-right: 28px;

    }
#ftile4 { 
    background-color: #000000;
    width: 215px; 
    height: 40px;
overflow: hidden;
    float: left;
    }