@charset "utf-8";
/* CSS Document - version 2.0 */

/* -----------------------------*\
	CONTENTS
\* -----------------------------*/

/*
	RESET STYLES
	MAIN
	CONTENT
	HOMEPAGE
	HEADER
	NAVIGATION
	HEADINGS
	EXERCISES AND GAMES
	AUDIO
	FOOTER
	MISC

*/



/* -----------------------------*\
	$RESET STYLES
\* -----------------------------*/

p, img, h1, h2, h3, li {
	margin: 0;
	padding: 0;
}

/* -----------------------------*\
	$MAIN
\* -----------------------------*/

body {font-family: Tahoma, Geneva, sans-serif;}


/* -----------------------------*\
	$CONTENT
\* -----------------------------*/

#container {
	width: 1024px;
	margin: 0 auto;
	}
	
#middle_matter {
	background: url(../project/images/Homepage_bkground.jpg) no-repeat top center; 
	height: 803px;
	padding-bottom: 10px;
	position: relative;
	margin: 0 auto;
	}
	


#banner, #book_logo, #book_image, #navigation, #menus {display:none;}


/* -----------------------------*\
	$HOMEPAGE
\* -----------------------------*/

#header{background-color:#fff; clear:both}

ul.covers {
		width:1000px;
		position: relative;
		left: 12px;
		}
	
ul.covers li {
		list-style-type: none;
		display:inline-block;
		margin: 350px 15px 0 0;
		overflow:hidden;
		zoom: 1;/* bug fix for IE */
        *display: inline; /* bug fix for IE */
		}

ul.covers a {
		text-decoration: none;
		color: rgb(255,255,255);	
		font-weight: 600;
		}
	
ul.covers a:hover {opacity: .5;}

#project3eCovers {
		float:right;
		color: rgb(255,255,255);	
		margin: 30px 40px 0 0;
		}

#project3eCovers a {
		text-decoration: none;
		color: rgb(255,255,255);	
		text-align:center;
		}
	
#project3eCovers a:hover {opacity: .5;}

.project3eLink {margin-left: 50px;}



/* Character */


img[src*="charac_"] {
		position: absolute;
		bottom: 46px;
		left: 30px;
		}

img[src*="mainCharac_"] {
		position: absolute;
		bottom: 88px;
		right: 265px;
		}
		
/* Level character */		

img[src*="projectchar_"] {
		position: absolute;
		bottom: 10px;
		left: 25px;
		}


/* -----------------------------*\
	$HEADER
\* -----------------------------*/


/* OUP logo */

#oup_logo {
	float:left;
	padding-left:10px
}
#oup_logo img {
	padding-bottom:8px;

	}


/* Breadcrumb */

#breadcrumb {
	padding:4px 4px 4px 20px;
	clear:both;
	background: rgb(176,227,246);
	color: rgb(0,103,178);
	font-size: .9em;
	}

#breadcrumb a {color: rgb(0,103,178);}
	
#breadcrumb a:hover {text-decoration:underline}



/* -----------------------------*\
	$NAVIGATION
\* -----------------------------*/


#navigation1 {
	position: relative;
	top: 180px;
	}

#navigation1 ul {
	width: 580px;
	margin: 0 auto;
	overflow: hidden;
	}
	
.choice1 {
	list-style-type: none;	
	display: inline;
    float: left;
	margin: 5px 20px 0px 20px;
}

.choice1 a {
	font-family: Tahoma, Geneva, sans-serif;
	font-weight:bold;
	font-size: 1.5em;
	color: rgb(255,255,255);
	text-decoration:none;
	text-align: center;
	float: left;
	width: 243px;
    height: 58px;
	padding-top: 13px;
	}
	
.a:hover {opacity: .5;}


.audionav a {
	width: 525px;
    height: 58px;
	}
	
.choice1 a:hover {opacity: .5;}

#children {
	position:relative;
	top:170px;
	margin: 0 auto;
	width: 580px;
	color: rgb(255,255,255);
	}
	
#children>li {list-style-position:inside;}
	
#children a {
	text-decoration:none;
	color: #fff;
	font: 1.9em Tahoma, Geneva, sans-serif;
	position:relative;
	display: block;
	}


#children a:hover {opacity: .5;}



/* -----------------------------*\
	$HEADINGS
\* -----------------------------*/



h1.Unit {
		text-indent: -9999px;
		background: url(../project/images/Unit1_Title.png) no-repeat;
		height: 59px;
		width: 543px;
		position: relative;
		top: 230px;
		margin: 0 auto;
		padding-bottom: 90px;
		}
	
h1.U2 {background: url(../project/images/Unit2_Title.png) no-repeat;}

h1.U3 {background: url(../project/images/Unit3_Title.png) no-repeat;}

h1.U4 {background: url(../project/images/Unit4_Title.png) no-repeat;}

h1.U5 {background: url(../project/images/Unit5_Title.png) no-repeat;}

h1.U6 {background: url(../project/images/Unit6_Title.png) no-repeat;}
	

/* Menu - Grammar */	

h1.Grammar1 {background: url(../project/images/unit1Grammar.png) no-repeat;}
	
h1.Grammar2 {background: url(../project/images/unit2Grammar.png) no-repeat;}
	
h1.Grammar3 {background: url(../project/images/unit3Grammar.png) no-repeat;}
	
h1.Grammar4 {background: url(../project/images/unit4Grammar.png) no-repeat;}
	
h1.Grammar5 {background: url(../project/images/unit5Grammar.png) no-repeat;}

h1.Grammar6 {background: url(../project/images/unit6Grammar.png) no-repeat;}
	
	
/* Menu - Vocab */	

h1.Vocab1 {background: url(../project/images/unit1Vocab.png) no-repeat;}
	
h1.Vocab2 {background: url(../project/images/unit2Vocab.png) no-repeat;}
	
h1.Vocab3 {background: url(../project/images/unit3Vocab.png) no-repeat;}
	
h1.Vocab4 {background: url(../project/images/unit4Vocab.png) no-repeat;}
	
h1.Vocab5 {background: url(../project/images/unit5Vocab.png) no-repeat;}

h1.Vocab6 {background: url(../project/images/unit6Vocab.png) no-repeat;}

	
/* Menu - Pronunciation */	

h1.Pronunc1 {background: url(../project/images/unit1Pronunc.png) no-repeat;}
	
h1.Pronunc2 {background: url(../project/images/unit2Pronunc.png) no-repeat;}
	
h1.Pronunc3 {background: url(../project/images/unit3Pronunc.png) no-repeat;}
	
h1.Pronunc4 {background: url(../project/images/unit4Pronunc.png) no-repeat;}
	
h1.Pronunc5 {background: url(../project/images/unit5Pronunc.png) no-repeat;}

h1.Pronunc6 {background: url(../project/images/unit6Pronunc.png) no-repeat;}
	

/* Menu - Games */	

h1.Games {
	text-indent: -9999px;
	background: url(../project/images/games.png) no-repeat;
	height: 59px;
	width: 543px;
	position: relative;
	top: 230px;
	margin: 0 auto;
	padding-bottom: 90px;
	}

h1.Games1 {background: url(../project/images/unit1Games.png) no-repeat;}
	
h1.Games2 {background: url(../project/images/unit2Games.png) no-repeat;}
	
h1.Games3 {background: url(../project/images/unit3Games.png) no-repeat;}
	
h1.Games4 {	background: url(../project/images/unit4Games.png) no-repeat;}
	
h1.Games5 {background: url(../project/images/unit5Games.png) no-repeat;}

h1.Games6 {background: url(../project/images/unit6Games.png) no-repeat;}


/* Headings and rubric */ 

h3 {font-size: 1em;}

p#rubric {font-size: .9em;}


/* -----------------------------*\
	$EXERCISES AND GAMES
\* -----------------------------*/

.rubric {
	position: relative;
	top: 185px;
	left: 220px;
	font-weight: bold;
	color: rgb(102,102,102);
	}

#exerciseBackground {
	  background: url(../project/images/backgroundExercise.jpg) no-repeat top center; 
	  height: 803px;
	  padding-bottom: 10px;
	  position: relative;
	  margin: 0 auto;
	  }

object {
	  position: relative;
 	  top: 180px;
	  left: 200px;
	  }

#exercise {font-size: .9em;}

#exercise1 {
	 position: relative;
	 top: 180px;
	 }

.exercise_text {
     font-weight: normal;
     margin: 0 0 25px;
	}

.exercise_number {
    margin: 0 10px 0 0;
    padding: 0;
	}
	
#gapfill_wordsfill {
	font-weight: bold;
	word-spacing: 20px;
	margin: 25px 0;
	}
	
.play {float: left;}

/* Dropdown exercise */

.exercise_dropdown {margin-left:10px;}

/* Spot the mistake exercise */

#spotthemistake .exercise_text a {
	  color: rgb(0,0,0);
	  text-decoration:none;	
	  border: 1px solid white;
	  }

#spotthemistake .exercise_text a:hover {border: 1px solid red;}

/* Multiple choice1 exercise */



.multiplechoice_col{
    float: left;
    margin: 0 0 20px;
    padding-top: 2em;
    width: 44%;
    }


.multiplechoice p {
    float: left;
    margin: 0 10px 10px 0;
    padding-top: 2em;
    vertical-align: top;
    }

.multiplechoice_radiobutton {margin: 5px 10px 0 18px;}

.multiplechoice1 {
    clear: both;
    margin: 0;
    padding-top: 0.2em;
    }

.multiplechoice1_col {
    float: left;
    margin: 0 0 20px;
    padding-top: 0.2em;
    width: 44%;
    }

.multiplechoice1 p {width:40%;}


/* Sentence matching exercise */

.sentencematching {
    clear: both;
    margin: 0;
    padding: 10px 0;
    }

.sentencematching input {float: left;}

.sentencematching .exercise_text {width: 35%;}

.sentencematching span {
    display: block;
    float: left;
	}

.sentencematching span {
    display: block;
    float: left;
	}

.upper_alpha {margin: 0 15px 0 10px;}


/* Wordordering exercise*/

#wordordering a {
    border: 1px solid #ccc;
    color: #333;
    padding: 2px;
    text-decoration: none;
	}

.wordordering_gapfillbox {
    border: 0;
	border-bottom: 1px dashed #333;
    margin: 10px 0;
    width: 90%;
	}

/* Yes/No */

.yesno {float: left;}

#exercise_yesno {
	float: left;
	width: 55%;
	margin: 2em 0 0 1em;
	}

.yes {
	position: relative;
	left: 29em;
	}

#exercise_yesno img {margin-right: 3em;}

#exercise_yesno input {
	position: relative;
	right: 3em;
	}

#exercise_yesno .exercise_buttons {
	float: right;
	margin-right: 4em;
	}

#exercise_yesno p {height: 2em;}

#exercise_yesno .exercise_text {
	width: 70%;
	margin: 0px 10px 0px 0px;
	}


	
/* -----------------------------*\
	$AUDIO
\* -----------------------------*/

#audio {padding: 10em 0 0 2em;}
	
#content .audio {
	width: 30%;
	margin: 0; 
	padding: 0;
	position: relative;
	right: 2.5em;
	float: left;
	}

#content .audio li {
	list-style-type: none;

	padding-bottom: .5em;

	}

#content .audio a {
		text-decoration: none;
		color: rgb(0,0,0);
		background-color: rgb(242,138,7);
		padding: .5em;
		text-align: center;
		color: rgb(255,255,255);
		display: block;
		width: 230px;
		margin-right: 3.8em;
		}
		
#content .audio a:hover {opacity: .5;}



	
#audioplayer object {
	width: 500px;
	height: 27px;
	position: relative;
	top: 2px;
	left: 2px;
	}

/* -----------------------------*\
	$FOOTER
\* -----------------------------*/


#footer {
	background-color: rgb(0,33,71);
	line-height: 2em;
	overflow:hidden;
	}

#footer a {color:rgb(255,255,255);}

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

#footer p, #footer ul {
	font-family: Arial, Helvetica, sans-serif;
	display:inline;
	color:rgb(255,255,255);
	font-size: .8em;
}

#footer ul {list-style:none;}

#footer li {
	display:inline;
	color:rgb(255,255,255);
	font-size:10pt
	}
	
.fl-left {float:left;}

.fl-right {float:right;}

#footerinner {
	width:80%;
	margin: 0 auto;
	text-align:left;
	}



/* -----------------------------*\
	$MISC
\* -----------------------------*/

img {border: 0;}

.clear {clear:both;}

a {text-decoration:none;}

#title {
    position: relative;
	top: 12em;
	padding-left: 2rem;
	}

/* -----------------------------*\
	Locaize script styles
\* -----------------------------*/


.hr {display:none}