/*
Language Cafe
copyright: University of Southampton
Updated: 30 Aug 2008 rej
*/

/* ---( font parameters )------------------------------- */

body {
	font-size: small;
}

* html body {
	font-size: x-small; /* for IE5/Win */
	f\ont-size: small; /* for other IE versions */
}

img {
	border: none;
}

	
/* ---( text )------------------------------- */

body, td, th, ul {	
	font-family: arial, helvetica, sans-serif;
}

h1, h2, h3, h4 {
	font-family: "Trebuchet MS", Verdana, arial, helvetica, sans-serif;
}

p {
	font-weight: normal;
	color:#666;
	padding: 8px 0 0 0;
	margin: 0;
	line-height: 1.5em;
}

h1 {
	font-size: 200%;
	font-weight: normal;
	padding: 5px 0 0 0;
	margin: 0;
	text-align: left;
	letter-spacing: -0.02em;	
}

.tagline {
	font-size: 120%;
	font-weight: normal;
	padding: 0;
	margin: 0 0 15px 0;
	line-height: 1em;
}


h2 {
	font-size: 150%;
	font-weight: normal;
	padding: 10px 0 0 0;
	margin: 0;
	letter-spacing: -0.02em;
	
}

h3 {
	font-size: 100%;
	padding: 10px 0 0 0;
	margin: 0;
	letter-spacing: -0.02em;
	
}

.intro {
	font-family: arial, helvetica, sans-serif;
	color: #999;
	font-size: 130%;
	line-height: 1.3em;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 10px 0 15px 0;
	margin: 5px 0 0 0;
	
}

a:link {
    color: #36f;
    text-decoration: none;
    background-repeat: no-repeat;
    }

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

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

a:hover {
    color: #c06;
    text-decoration: underline;
		
    }

/* ---( layout )------------------------------- */
body {
	margin: 0px;
	padding: 0px;
	background: #666;
	text-align: center;
	}
#wrap {
	width: 960px;
	background: url("../images/wrap_background.png") repeat-y;
	margin: 10px auto 0px auto;
	padding: 0;
	text-align:left;
	border-top: 1px solid #fff;
	border-left: 1px solid #fff;
	border-right: 1px solid #fff;
	}

#wrap_bottom {
	background: url("../images/wrap_bottom.png") no-repeat;
	width: 962px;
    height: 20px;
    margin:auto;
    margin-bottom: 50px;
}	


/* ---( header - logo and strapline )------------------------------- */
#logo {
    position: relative;
    height: 140px;
    padding: 0px;
    margin: 0px;
    z-index: 10;
    }

#cafe_logo {
    position:absolute;
	top: 6px;
	left: 20px;
    }

#printlogo {
    display: none;
    }

#strapline {
	position:relative;
	float: right;
	padding: 20px 20px 0 0 ;
}

#strapline h2 {
	font-size: 150%;
	text-align: right;
	font-weight: bold;
	line-height: 1.2em;	
	color: #999;
}
	
	
/* ---( content )------------------------------- */

#main-body {
	float: left;
	width: 550px;
	background:#fff;
	padding: 0 0 20px 0;
	background: url(../images/main_background.png) no-repeat #fff;
	margin:0;
	min-height:520px;
	}




#content {
	width: 500px;	
	margin: 0 25px 0 25px;
	}


#content ul {
	color: #666;
	padding: 0;
	margin: 10px 0 0 10px;
}	

#content li {
	color: #666;
	padding: 0 0 5px 0;
	margin: 0;
}	


#content hr {
	border: 0;
	height: 1px;
	color:#ccc;
	background-color: #ccc;
}

#content .box {
	background: #eee;
	padding: 0px 10px 10px 10px;
	border-bottom: 1px solid #ccc;

}

#content_bottom {
	margin-bottom: -3px;   
	}


/* ---( wrapper for side bar navigation )------------------------------- */

#left-sidebarnav {
	float: left;
	width: 200px;	
	margin: 5px 0 5px 5px;	
	}
	
#right-sidebarnav {
	float: right;
	width: 200px;	
	margin: 5px 5px 5px 0px;
	}

/* ---( side bar navigation )------------------------------- */

.sidebarnav {
	background: url("../images/sidebarnav_background.png") repeat-y #eee;
	margin: 0 0 5px 0;
	padding: 10px 0 0 0;
	}

.sidebarnav h2 {
	padding: 0 0 0 15px;
	margin: 0 0 5px 0;
	line-height: 1.2em;
	
}

.sidebarnav h3 {
	padding: 0 0 10px 15px;
	margin: 0;
	
}

.sidebarnav p {
	padding: 0 0 10px 15px;
	margin: 0;
	font-size: 85%;
	line-height: 1.2em;
	
}

.sidebarnav ul {
	margin:0;
	padding:0;	
	list-style-type: none;
}

.sidebarnav ul li{
	margin:0;
	padding:0 0px 5px 0;	
}

.sidebarnav ul li a{
	text-decoration: none;
	display: block;	
	padding: 5px 5px 5px 27px;
	margin: 0px;
	font-size: 85%;
	line-height: 1.3em;
	font-weight: bold;
}

.sidebarnav li a:link{
	color: #666;	
}

.sidebarnav li a:visited{
	color: #666;	
}

.sidebarnav li a:hover{
	color: #fff;	
	text-decoration: none;
}
/* ---( icons side bar navigation )------------------------------- */


#home {
	background: url(../images/icon_home.gif) no-repeat 8px 50%; 
}

#stories {
	background: url(../images/icon_stories.gif) no-repeat 8px 50%; 
}

#link {
	background: url(../images/icon_weblink.gif) no-repeat 8px 50%; 
}

#intro {
	background: url(../images/icon_intro.gif) no-repeat 8px 50%; 
}

.word {
	background: url(../images/icon_word.gif) no-repeat 8px 50%; 
}

.pdf {
	background: url(../images/icon_pdf.gif) no-repeat 8px 20%; 
}

.cup {
	background: url(../images/icon_cup.gif) no-repeat 8px 10%; 
}



/* ---( right side bar navigation )------------------------------- */

.rsidebarnav {
	background: url("../images/rsidebarnav_background.png") repeat-y #eee;
	margin: 0 0 5px 0;
	padding: 10px 0 0 0;
	overflow: auto;
	}

.rsidebarnav h2 {
	padding: 0 0 0 10px;
	margin: 0;
	
}

.rsidebarnav h3 {
	padding: 0 0 10px 10px;
	margin: 0;
	
}

.rsidebarnav p {
	padding: 0 15px 5px 15px;
	margin: 0;
	font-size: 85%;
	line-height: 1.5em;
	
}

.rsidebarnav ul {
	margin:0;
	padding:0;	
	list-style-type: none;
}

.rsidebarnav ul li{
	margin:0;
	padding:0 0 5px 0;	
}

.rsidebarnav ul li a{
	text-decoration: none;
	display: block;	
	padding: 5px 0 5px 10px;
	margin: 0px;
	font-size: 85%;
	line-height: 1.5em;
}

.rsidebarnav li a:link{
	color: #666;	
}

.rsidebarnav li a:visited{
	color: #666;	
}

#cafelist { 	
	background:#fff;
	border: 1px solid #ccc;
	margin: 0 10px 0px 10px;
}
#cafelist ul li { padding: 0px; overflow: hidden;}
#cafelist ul li.cup a { padding: 0 0 5px 30px; height: 50px;}

button.list { height: 16px; width: 16px; margin-bottom: 10px; cursor:pointer; border: none /*this bit to fix ie 6 and 7 */  1px #ccc; }
button.listup { margin-left: 10px; background-image: url('/themes/languagecafe/images/scroll_up.gif');}
button.listdown { background-image: url('/themes/languagecafe/images/scroll_down.gif'); margin: 0 0 10px 5px;}

/* ---( register button )----------------------------------------- */

.rsidebarnav #register {
	

}
/* ---( registration form )------------------------------- */



fieldset {
	margin: 0 0 10px 0;
	border: 1px solid #ccc;
}

fieldset div {
	overflow:hidden; /* Contain the floating elements */
	display:block;
	_display:inline-block; /* Give layout in ie to contain float */
	padding: 2px 0 2px 0;
	font-weight: normal;
	color:#666;
}

	
fieldset p {
	font-weight: normal;
	color:#666;
	margin: 0 15px 5px 20px;
}

label {
	float:left; /* Take out of flow so the input starts at the same height */
	width:10em; /* Set a width so the inputs line up */
	margin-right: 5px;
	text-align: right;
}


legend {
	font-weight: bold;
	/**margin-left:-7px;*/
	font-size: 130%;
} 



/* ---( misc )----------------------------------------- */
.url {
	color: #999;
	font-weight: normal;
	font-size: 90%;
	line-height: 1em;
}



.photobox {
	border: 1px solid #ccc;
	padding: 3px;
}

.photo {
	float: right;
     margin: 10px -10px 0 0;
     }



.logo_box {
	float: right;
	padding: 0 0 0 5px;
	margin: 0;

}

.logo_box p{
	font-size: 90%;
	color: #999;
	text-align: center;
	padding: 0 0 0 5px;
	margin: 0;
}

.logo_box img{
	border:none;
}


#country {
	padding: 0 0 10px 10px;
	margin: 0;
}


#country #form{
	padding: 0;
	margin: 0;
}

#country h3 {
	padding: 0;
	margin: 0;
}

/* ---( footer )------------------------------- */
#footer {
	clear: both;
	padding: 20px 20px;
	background: #666;
	height:6em;
	}
	
#footer p{
	padding:0;
	margin:0;
	font-size: 90%;
	color: #fff;
}

#footer a:link {
    color: #69f;
    text-decoration: none;
    background-repeat: no-repeat;
    }

#footer a:active {
    color: #c60;
    text-decoration: none;
	
    }

#footer a:visited {
    color: #69f;
    text-decoration: none;
    }

#footer a:hover {
    color: #c06;
    text-decoration: underline;
		
    }

#copyright {
	float: left;
	width: 430px;
	/*padding: 0 10px 0 0;*/
	
}

#lingua {
	float: right;
	width: 420px;
	border-left: 1px solid #999;
	padding: 0 0 0 35px;
}

#lingua img {
	padding: 0 0 0 10px;
}