/*
==============================================
* Filename: styles.css
* Version: 1.0.0 (2008-05-01) YYYY-MM-DD
* Website: http://www.scitechchallenges.com/
* Author: Dimith de Alwis / Umut Ahmet
* Description: Main site styles.

============================================== 
== STRUCTURE: ================================
* Page width: 900 px
* Number of columns: 2

==============================================
== INDEX: ====================================
_colours
_defaults
_globals

_frame : Site Frame
_container : Inner Wrapper
_header : Site Header
_nav : Site Navbar
_content : Site Content
_footer : Site Footer

==============================================
== _colours: =================================

* Silver - #DADADA
* Grey - #999999
* Turqoise - #5E91A8

============================================== 
== _defaults: ==============================*/
@charset "utf-8";

html { 
    margin: 0; 
    padding: 0;
    }
    body {
        /*font: font-style (italic/normal) font-variant (small-caps) font-weight font-size/line-height font-family; */
        font: normal 12px/1.7 Arial, Verdana, Tahoma; 
        margin: 0; 
        padding: 0; 
        text-align: center; 
        background: white; 
        }
        h1, h2, h3, h4 {
			color: #5E91A8; 
            margin: 0; 
            padding: 0; 
        }
				h1 { font: normal 24px/1.7 Arial, Verdana, Tahoma; } 
				h2 { font: normal 16px/1.7 Arial, Verdana, Tahoma; } 
				h3 { font: normal 14px/1.7 Arial, Verdana, Tahoma; } 
				h4 { font: normal 12px/1.7 Arial, Verdana, Tahoma; }
        
        a { 
            color: #5E91A8; 
        }
        a:visited, a:active {
            color: #5E91A8; 
        }
        a:hover { 
            text-decoration: none; 
        }
        a:active {
            color: red; 
        }

    input { 
        font: normal 11px/1.7 "lucida grande",tahoma,verdana,arial,sans-serif; 
    }
    input.nb { 
        border: none; 
    }
    select { 
        font: normal 11px/1.7 "lucida grande",tahoma,verdana,arial,sans-serif;  
        padding:2px; 
    }
    #alpha img { 
        border: 1px solid #DADADA;
				padding: 5px;
				clear: both; 
    }
    table {
				width: 98%;
      	margin: 0 auto; 
    }
    table th { 
        border-bottom: 1px solid #DADADA; 
        background: #F0F0F0; 
    }

/*
============================================
== _globals: ===============================
*/

.inner { 
    padding: 10px;
}
.clear { 
    display: block; 
    clear: both;
}
.box { 
    padding: 5px; 
    border: 1px solid #DADADA; 
}
.wrap {
		margin-bottom: .5em;
}
.sml { 
    font-size: 11px;
}
.bt { 
    padding-top: .5em; 
		margin-top: .5em; 
		border-top: 1px solid #DADADA; 
}  
.colomn { 
    float: left; 
    margin-right: 1em; 
}

hr { border: 0; height: 1px; border-top: 1px solid #dadada; }
/*
==========================================
== _frame: ===============================
*/

#frame {
}

/*
==========================================
== _container: =============================
*/

#container {
    text-align: left;
    width: 920px;
    margin: 0 auto;
		margin-bottom: 2em;
		}

/*
==========================================
== _header: ==============================
*/

#header1 {
	    color: #F9F9F9; height: 180px; width: 920px;
		background: url(../images/header_1.jpg) top center no-repeat;
		border-bottom: 0px solid #DADADA;
    }
    #header2 {
	    color: #F9F9F9; height: 180px; width: 920px;
		background: url(../images/header_2.jpg) top center no-repeat;
		border-bottom: 0px solid #DADADA;
    }
    #header3 {
	    color: #F9F9F9; height: 180px; width: 920px;
		background: url(../images/header_3.jpg) top center no-repeat;
		border-bottom: 0px solid #DADADA;
    }
    #header4 {
	    color: #F9F9F9; height: 180px; width: 920px;
		background: url(../images/header_4.jpg) top center no-repeat;
		border-bottom: 0px solid #DADADA;
    }
    #header5 {
	    color: #F9F9F9; height: 180px; width: 920px;
		background: url(../images/header_5.jpg) top center no-repeat;
		border-bottom: 0px solid #DADADA;
    }
    #header6 {
	    color: #F9F9F9; height: 180px; width: 920px;
		background: url(../images/header_6.jpg) top center no-repeat;
		border-bottom: 0px solid #DADADA;
    }
    #header7 {
	    color: #F9F9F9; height: 180px; width: 920px;
		background: url(../images/header_7.jpg) top center no-repeat;
		border-bottom: 0px solid #DADADA;
    }
    #header8 {
	    color: #F9F9F9; height: 180px; width: 920px;
		background: url(../images/header_8.jpg) top center no-repeat;
		border-bottom: 0px solid #DADADA;
    }
    #header9 {
	    color: #F9F9F9; height: 180px; width: 920px;
		background: url(../images/header_9.jpg) top center no-repeat;
		border-bottom: 0px solid #DADADA;
    }
    #header10 {
	    color: #F9F9F9; height: 180px; width: 920px;
		background: url(../images/header_10.jpg) top center no-repeat;
		border-bottom: 0px solid #DADADA;
    }
    #header11 {
	    color: #F9F9F9; height: 180px; width: 920px;
		background: url(../images/header_11.jpg) top center no-repeat;
		border-bottom: 0px solid #DADADA;
    }
    #header12 {
	    color: #F9F9F9; height: 180px; width: 920px;
		background: url(../images/header_12.jpg) top center no-repeat;
		border-bottom: 0px solid #DADADA;
    }
    #header13 {
	    color: #F9F9F9; height: 180px; width: 920px;
		background: url(../images/header_13.jpg) top center no-repeat;
		border-bottom: 0px solid #DADADA;
    }
    
    #header1 a, #header2 a, #header3 a, #header4 a, #header5 a, #header6 a, #header7 a, #header8 a, #header9 a, #header10 a, #header11 a, #header12 a, #header13 a {
        color: #333333;
        text-decoration: none;
    }
    #header1 a:hover, #header2 a:hover, #header3 a:hover, #header4 a:hover, #header5 a:hover, #header6 a:hover, #header7 a:hover, #header8 a:hover, #header9 a:hover, #header10 a:hover, #header11 a:hover, #header12 a:hover, #header13 a:hover {
        color: #5E91A8;
    }
				
    #header-top {
        height: 175px;
				clear: both;
				border-bottom: 1px solid #DADADA;
        }

    #header-bottom {
				padding-right: 1em;				
        }  
        #navbar {
            float: right;
            text-align: right;   
            border: 0px solid green; 
            }
            #navbar ul {
            	 margin-top: -23px;
            	 float: right;
            	 padding-bottom: 1.5em; 		         	 
            } 
            #navbar li {
				font: bold 13px/1.7 Arial, Verdana, Tahoma;	
                padding: 0 0 0 1.6em;
				display: inline;
            }
            #navbar .on a {
				font-weight: bold;
				/* padding: 0 1em 2px 1em; */
				color: #5E91A8;
				background: url(../images/page-arrow.gif) no-repeat 0px 20px;
				padding-bottom: 1.5em; 
			}

	#logo-link { 
		position: relative;
		border: 0px solid #c00;
		top: 10px;
		left: auto;
		
	}
	#logo-link a{ position: absolute; width: 180px; height: 150px; text-decoration: none; border: 0px solid #c00; }

/*
==========================================
== _content: =============================
*/

#content {
		padding: 10px 20px 20px 20px; 
    	}
		#select {
				height: 20px;
			}
			/*
			.home { background: url(../images/page-arrow.gif) no-repeat 88px 0; }
			
			.abou {	background: url(../images/page-arrow.gif) no-repeat 378px 0; }
				.time { background: url(../images/page-arrow.gif) no-repeat 358px 0; }
				.fund { background: url(../images/page-arrow.gif) no-repeat 358px 0; }
				.supp { background: url(../images/page-arrow.gif) no-repeat 358px 0; }
			.cham { background: url(../images/page-arrow.gif) no-repeat 438px 0; }
			.chal { background: url(../images/page-arrow.gif) no-repeat 528px 0; }
			.acad { background: url(../images/page-arrow.gif) no-repeat 648px 0; }
			.subm { background: url(../images/page-arrow.gif) no-repeat 778px 0; }	
			.faqs { background: url(../images/page-arrow.gif) no-repeat 868px 0; }	
			/*
			.supp { background: url(../images/page-arrow.gif) no-repeat 828px 0; }
			*/
		#alpha {
				float: left;
				width: 267px;

				}
				#sidenav {
					margin: 0;
					padding: 0;
					list-style: none;
					}
					#sidenav li {
						border-bottom: 1px solid #DADADA;
						text-indent: 1.5em;
					}
					#sidenav a {
						display: block;
						color: #5E91A8;
						text-decoration: none;
						padding: .5em 0;
					}
					#sidenav a:hover {
							color: #333333;
					}
					#sidenav .sub-on {
						display: block;
						color: #333333;
						text-decoration: none;
						padding: .5em 0;
					}
				#feature_box {
					background: url(../images/feature_box_top-bg.gif) repeat-y top right;	
					}
					#feature_box_inner {
						background: url(../images/feature_box_bottom-bg.gif) no-repeat bottom left;
						padding-bottom: 7px;
					}
					#feature_box_bottom {
						margin-bottom: -1px; 
						margin-top: -.5em;
						width: 250px; 
						padding: 5px; 
						border: 1px solid #dadada; 
						border-top: 0; 
						text-align: center;
						background: url(../images/alpha-watermark.gif) no-repeat top left;
					}
					#feature_box_bottom h2 {
						font-size: 14px;
					}
		#beta {

				float: right;
				width: 600px;				
				
				}
				#action {
						border-top: 1px solid #DADADA;
						border-bottom: 1px solid #DADADA;
						padding: 10px 0;

						}
						#a-inner {
								background: transparent;
								color: #5E91A8;
								font: normal 22px/1.3 Arial, Verdana, Tahoma; 
						}
						.step {
								margin: 0 auto;
								width: 33%;
								height: 68px;
								float: left;
								background: #E7EFF2 url(../images/step-arrow-small.gif) no-repeat top left;
						}
						/*
						.step a:hover {
								display: block;
								margin: -6px 0 0 -40px;
								padding-left: 40px;
								padding-top: 6px;
								height: 62px;
								background: #d8dfe2 url(../images/step-arrow-small.gif) no-repeat top left;
						}
						*/
						.step a:hover {
								display: block;
								margin: -6px 0 0 -50px;
								padding-left: 50px;
								padding-top: 6px;
								height: 62px;
								width: 90%;
								
								background: #d8dfe2 url(../images/step-arrow-small.gif) no-repeat top left;
						}
						.step-text {
								width: 166px;
								margin: 6px 0 0 50px;
								vertical-align: text-top;
								border: 0px solid black;
								
						}
						.step-text a {
								display: block;
								text-decoration: none;								
						}
						.pad-t {
								/*padding-top: 15%; */
						}
						#beta ul, dl, ol { 
				            list-style: url(../images/st-b.gif); 
				        }
/*
==========================================
== _footer: ==============================
*/

#footer {
	    text-align: left;
	    font: normal 10px/1.5 "lucida grande",tahoma,verdana,arial,sans-serif;	
	    clear: both;
		border-top: 1px solid #DADADA;
		text-indent: 10px;
		position: relative;
    }

    #footer a {
        color: black;
        text-decoration: none;
    }
    #footer a:hover {
        text-decoration: underline;
    }
		#footer ul {
				padding: 0;
				margin: 0;
		}
    #footer li {
	    display: inline;
    }
	
    #foot-nav { margin-left: auto; float: left;}
    #foot-nav p { margin: 1.5em 0 0 0 ; padding: 0;} 
       	
   	
   	#foot-logos {
				height: 100px;
				clear: both;
				}
				.champ { position: relative; float: left; padding: 0; width: 712px; height: 100px; border: 0px solid green; }
   				.sup { clear: right; padding: 0; width: 205px; height: 100px; border: 0px solid red; }
				/*
				.l-home {
					float: left;
					border: 1px solid red;
				}
				.l-sub {
					clear: both;
					position: relative; 
					border: 1px solid green;
				}	
				*/
				#foot-logos a.bbc { top: 15px; left: 0; width: 110px; height: 90px; position: absolute; }
				#foot-logos a.ice { top: 15px; left: 110px; width: 110px; height: 90px; position: absolute; }
				#foot-logos a.lsx { top: 15px; left: 220px; width: 130px; height: 90px; position: absolute; }
				#foot-logos a.npl { top: 15px; left: 350px; width: 120px; height: 90px; position: absolute; }
				#foot-logos a.sus { top: 15px; left: 470px; width: 140px; height: 90px; position: absolute; }
				#foot-logos a.uks { top: 15px; left: 610px; width: 100px; height: 90px; position: absolute; }
				#foot-logos a.lda { top: 15px; left: 710px; width: 110px; height: 90px; position: absolute; }
				#foot-logos a.wlp { top: 15px; left: 820px; width: 110px; height: 90px; position: absolute; }

/*----------------------- MISC GENERIC styles --------------------------------------------*/


.hidden {
	position: absolute;
	left: -2000px;
	width: 1000px;
}

.r { float: right; }
.l { float: left; }

img {
	border: 0;
}
input, select { border: 1px solid #999; font-size: 95%; padding: 1px;}

.smalltext { font-size: 85%; font-weight: bold; }
.note { color: red; }
.smaller { font-size: 85%; }

#admin {
	background-color: #f8f8f8;
	margin: auto;
	margin-bottom: 5px;
	width: 900px; 
	min-height: 36px;

	padding: 10px;
	border: 1px solid #8c8c8c;
	font-size: 95%;
}

#admin p {
	position: relative;
	margin: 0px;
	padding: 0px;
}

#admin h1 {
	display: none;
}

.label {
	padding: 0px 3px;
	width: 150px;
	float: left;
	display: block;
	clear: left;
	font-weight: bold;
	vertical-align: text-top;
}

.labelo {
	padding: 1px 5px;
	width: 150px;
	float: left;
	display: block;
	min-height: 30px;
	font-weight: bold;
	vertical-align: text-top;
}

.but {
	clear: both;
	font-size: 80%;
	font-weight: bold;
	background-color: #fff;
	padding: 1px 3px;
	border: 1px solid #666;
	text-decoration:none;
}

.but:hover {
	text-decoration:none;
	background-color: #999;
	color: #FFF;
	border: 1px solid #666;
}

.drawer {
	
	display: block;
	background: transparent;
	border-top: 1px solid #dadada;
	/*border-bottom: 0;*/
	margin-bottom: 1.0em;
	margin-top: 1.5em;
	padding: .5em .7em 1.5em .7em;
	min-height: 35px;
}

.drawer-faq {
	
	display: block;
	background: transparent;
	border: 1px solid #dadada;
	margin-bottom: 0;
	margin-top: 1.0em;
	padding: .5em .7em .5em .7em;
	min-height: 20px;
}

.drawer-show {
	width: 100%;
	display: block;
	background: transparent;
	border-top: 1px solid #dadada;
	margin-bottom: 0;
	margin-top: 1.0em;
	padding: .5em .7em .5em .7em;
	min-height: 75px;
	clear: both;
}

.expandable {
	clear: left;
	display: block;
	border: 1px dotted #dadada;
	background-color: transparent;
	/* margin-top: .5em; */
	padding: .5em 1.0em;
	
	
}
.expandable ul, .expandable img {
	margin: .5em 1em;
	
}
.drawer a:hover, .drawer-faq a:hover, .drawer-show a:hover{
	color: #666; 
	text-decoration: none;
}

.drawer a, .drawer-faq a, .drawer-show a {
	text-decoration: none;
}

.charcoal { color: #990000; font-weight: bold; }