/*

stylesheet for Shifty

*/



body {
width:100%; 
height:100%;
position:relative;
background: #000000;
margin: 0;
font-family:Arial, Helvetica, sans-serif;	
font-weight: normal;
line-height: 1.2em;
font-size: 0.9em;
}



#wrapper {
width: 950px;
margin: 0 auto 3em auto;

background-color: #EEF8F9;

}	


#header{
width: 950px;
height: 230px;
margin: 0 auto 0 auto;
background: #ffffff url(images/background.jpg) bottom left no-repeat;
text-align: left;	
position: relative;

}	


/* title treatment / link */


h2#teotl_title {

/* background: transparent url(images/tt.png) bottom left no-repeat; */

width: 240px;
height:205px;	
margin: 0 0 0 55px;
padding-top: 20px;
}	

h2#teotl_title a {
position: absolute;

height: 175px;
width: 205px;
top: 0px;
left: 60px;

margin: 0;

}




#content {
background: transparent;
color: #222222;
width: 875px;
margin: -50px 0;
clear: both;
padding: 20px 15px 0 60px;
overflow: auto;
/* border: 1px dashed green; */
position: relative;
}



#content_spacer {
margin: 0;
float: left;
width: 1px;
height: 450px;
}

.left_col	 {
margin: 0;
width: 480px;

}





#video_player {
position: absolute;
margin: 0;

width: 360px;
top: 80px;
left: 560px;

text-align: center;
}











/* navigation */

#main_nav {
position: absolute;
margin: 15px 0 0 0;
height: 230px;
width: 300px;
top: 10px;
left: 300px;


}


.nav_hide {

display: none !important;
display: inline;

}


#main_nav ul {
list-style: none;
margin:  0;
padding-left: 0;

}

#main_nav ul li {
margin: 0;
padding-left: 2px;
}


#main_nav ul li a {


font-size: 1.5em;
text-decoration: none;
padding-left: 5px;
color: #ffffff;
margin: 2px 0 0 0;
}


a#introduction {
display: block;
width: 200px;
height: 25px;

background: transparent url(images/nav/main/introduction.png) top left no-repeat !important;
background: transparent;
}


a#teachers_notes {
display: block;
width: 230px;
height: 25px;

background: transparent url(images/nav/main/teachers_notes.png) top left no-repeat!important;
background: transparent;
}



a#key_scene {
display: block;
width: 230px;
height: 25px;
background: transparent url(images/nav/main/key_scene_analysis.png) top left no-repeat!important;
background: transparent;
}



a#activities {
display: block;
width: 230px;
height: 25px;

background: transparent url(images/nav/main/student_activities.png) top left no-repeat!important;
background: transparent;
}




#main_nav .sub_nav span.current, #main_nav .sub_nav a:hover, #main_nav .sub_nav a.current, 

a#key_scene:hover, a#introduction:hover, a#teachers_notes:hover, a#activities:hover, a#game:hover, a#competition:hover, #main_nav a.current {

border-left: 2px solid white;
margin-left: -2px;
}

#main_nav ul li .sub_nav {
clear: both;
position: absolute;
top: 0;
left: 240px;
height: 230px;
width: 220px;

margin: 0;
}


#main_nav ul li .sub_nav li {

}



#main_nav ul li .sub_nav a {
font-size: 1.1em;
text-decoration: none;
margin: 1px 0 0 0;
}


a#cod_overfishing {
display: block;
width: 200px;
height: 20px;

background: transparent url(images/nav/sub/cod_overfishing.png) top left no-repeat!important;
background: transparent;
}

a#technology {
display: block;
width: 200px;
height: 20px;

background: transparent url(images/nav/sub/technology.png) top left no-repeat!important;
background: transparent;
}

a#senegal {
display: block;
width: 200px;
height: 20px;

background: transparent url(images/nav/sub/senegal.png) top left no-repeat!important;
background: transparent;
}


a#fish_farming {
display: block;
width: 200px;
height: 20px;

background: transparent url(images/nav/sub/fish_farming.png) top left no-repeat!important;
background: transparent;
}

a#marine_reserves {
display: block;
width: 200px;
height: 20px;

background: transparent url(images/nav/sub/marine_reserves.png) top left no-repeat!important;
background: transparent;
}

a#issues {
display: block;
width: 200px;
height: 20px;

background: transparent url(images/nav/sub/issues.png) top left no-repeat!important;
background: transparent;
}

a#getting_started {
display: block;
width: 200px;
height: 20px;

background: transparent url(images/nav/sub/getting_started.png) top left no-repeat!important;
background: transparent;
}

a#vocabulary {
display: block;
width: 200px;
height: 20px;

background: transparent url(images/nav/sub/vocabulary.png) top left no-repeat!important;
background: transparent;
}

a#researching_what_we_eat_1 {
display: block;
width: 200px;
height: 20px;

background: transparent url(images/nav/sub/researching_what_we_eat_1.png) top left no-repeat!important;
background: transparent;
}

a#researching_what_we_eat_2 {
display: block;
width: 200px;
height: 20px;

background: transparent url(images/nav/sub/researching_what_we_eat_2.png) top left no-repeat!important;
background: transparent;
}

a#creating_awareness {
display: block;
width: 200px;
height: 20px;

background: transparent url(images/nav/sub/creating_awareness.png) top left no-repeat!important;
background: transparent;
}



.sub_nav a:hover  {

text-decoration: underline;
}







/* general content */

#content a {
text-decoration: underline;
color: #000000;
}

#content a:visited {
text-decoration: underline;
color: #444444;
}

#content a:hover {


text-decoration: underline;
}

img {
margin: 0;
float: right;
}


p {

margin-top: 0.5em;

}




.hide {
display: none;
}




#content ul
{
margin-top: 1.5em;	
margin-left: 0;
padding-left: 0;
list-style: none;
}

#content  li
{
padding-left: 40px;
background-image: url(images/bullet.gif);
background-repeat: no-repeat;
background-position: 2px 0;
margin-bottom: 1em;	
}



#content li ul.no_bullets li {

padding-left: 10px;
background: none;
}


#content ul.normal_bullets li {
list-style: disc;
background: none;
padding-left: 0;
margin: 0 0 0.5em 15px;
}



/* tables */

table {
width: 835px;
padding: 0;
margin:0;
border-left: 1px solid black;
border-top: 1px solid black;
}

th {
height: 1em;
}

th, td {


padding: 0 0.5em;
vertical-align: top;
text-align: left;
border-right: 1px solid black;
border-bottom: 1px solid black;
}



td#table_activity, td#skills {
width: 285px;
}

td#timing {
width: 85px;
}




/* headings */

h2 {
margin: 1em 0;
}

h3 {
margin: 1em 0 0 0;
}



h2 span.heading, h3 span.heading {
display: none !important;	
display: inline;
	
}


#heading_introduction {
width: 130px;
height: 27px;
background: transparent url(images/headings/introduction.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}


#heading_synopsis {
width: 130px;
height: 27px;
background: transparent url(images/headings/synopsis.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}


#heading_teachers_notes {
width: 200px;
height: 27px;
background: transparent url(images/headings/teachers_notes.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}


#heading_collapsed_timetable_programme {
width: 350px;
height: 27px;
background: transparent url(images/headings/collapsed_timetable_programme.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}

#heading_key_scene_1 {
width: 350px;
height: 27px;
background: transparent url(images/headings/key_scene_1.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}


#heading_key_scene_1_transcript {
width: 450px;
height: 27px;
background: transparent url(images/headings/key_scene_1_transcript.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}


#heading_key_scene_2 {
width: 350px;
height: 27px;
background: transparent url(images/headings/key_scene_2.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}


#heading_key_scene_2_transcript {
width: 450px;
height: 27px;
background: transparent url(images/headings/key_scene_2_transcript.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}


#heading_key_scene_3 {
width: 350px;
height: 27px;
background: transparent url(images/headings/key_scene_3.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}


#heading_key_scene_3_transcript {
width: 450px;
height: 27px;
background: transparent url(images/headings/key_scene_3_transcript.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}


#heading_key_scene_4 {
width: 350px;
height: 27px;
background: transparent url(images/headings/key_scene_4.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}


#heading_key_scene_4_transcript {
width: 450px;
height: 27px;
background: transparent url(images/headings/key_scene_4_transcript.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}



#heading_key_scene_5 {
width: 350px;
height: 27px;
background: transparent url(images/headings/key_scene_5.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}


#heading_key_scene_5_transcript {
width: 470px;
height: 27px;
background: transparent url(images/headings/key_scene_5_transcript.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}


#heading_student_activities {
width: 470px;
height: 27px;
background: transparent url(images/headings/student_activities.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}

#heading_getting_started {
width: 470px;
height: 27px;
background: transparent url(images/headings/getting_started.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}

	#heading_individual_awareness {
	width: 470px;
	height: 18px;
	background: transparent url(images/headings/individual_awareness.png) top left no-repeat !important;	
	background: transparent;
	display: block;
	margin-bottom: 0;
	}
	
	#heading_links{
	width: 470px;
	height: 18px;
	background: transparent url(images/headings/useful_links.png) top left no-repeat !important;	
	background: transparent;
	display: block;
	margin-bottom: 0;
	}

#heading_vocabulary {
width: 470px;
height: 27px;
background: transparent url(images/headings/vocabulary.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}

	#heading_question_1{
	width: 470px;
	height: 18px;
	background: transparent url(images/headings/question_1.png) top left no-repeat !important;	
	background: transparent;
	display: block;
	margin-bottom: 0;
	}
	

#heading_researching_what_we_eat {
width: 470px;
height: 27px;
background: transparent url(images/headings/researching_what_we_eat.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}
	
	#heading_investigating {
	width: 470px;
	height: 20px;
	background: transparent url(images/headings/investigating.png) top left no-repeat !important;	
	background: transparent;
	display: block;
	margin-bottom: 0;
	}

#heading_using_the_information {
width: 470px;
height: 27px;
background: transparent url(images/headings/using_the_information.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}	

	#heading_task_1 {
	width: 470px;
	height: 18px;
	background: transparent url(images/headings/task_1.png) top left no-repeat !important;	
	background: transparent;
	display: block;
	margin-bottom: 0;
	}
	
	#heading_task_2 {
	width: 470px;
	height: 18px;
	background: transparent url(images/headings/task_2.png) top left no-repeat !important;	
	background: transparent;
	display: block;
	margin-bottom: 0;
	}	
	
	#heading_further_research {
	width: 470px;
	height: 18px;
	background: transparent url(images/headings/further_research.png) top left no-repeat !important;	
	background: transparent;
	display: block;
	margin-bottom: 0;
	}		

#heading_creating_awareness {
width: 470px;
height: 27px;
background: transparent url(images/headings/creating_awareness.png) top left no-repeat !important;	
background: transparent;
display: block;
margin-bottom: 0;
}		

	#heading_your_brief {
	width: 470px;
	height: 18px;
	background: transparent url(images/headings/your_brief.png) top left no-repeat !important;	
	background: transparent;
	display: block;
	margin-bottom: 0;
	}
	
	#heading_top_tips {
	width: 470px;
	height: 18px;
	background: transparent url(images/headings/top_tips.png) top left no-repeat !important;	
	background: transparent;
	display: block;
	margin-bottom: 0;
	}	
	
	
	
/* footer */
	

#footer {
background: transparent url(images/footer.jpg) top left no-repeat;
color: #222222;
width: 950px;
margin: -30px 0;
height: 65px;
color: #ffffff;
padding-top: 155px;
}

#footer p {
color: #ffffff;
margin-left: 170px !important;
margin-left: 60px;
margin-top: 0 !important;
margin-top: -20px;
}

#footer a {
margin-left: 1.5em !important;
margin-left: 0.5em;
color: #ffffff;
}




#footer a#marviva {

float: left;
width: 107px !important;;
width: 120px;
height: 40px;
margin-top: 7px !important;
margin-top: 0;
background: transparent url(images/logos/marviva.png) top left no-repeat !important;
background: transparent;
}

#footer a#c4 {

float: left;
width: 123px !important;;
width: 200px;
height: 50px;
background: transparent url(images/logos/c4.png) top left no-repeat !important;
background: transparent;
}

#footer a#clore {

float: left;
width: 80px !important;;
width: 120px;
height: 50px;
background: transparent url(images/logos/clore.png) top left no-repeat !important;
background: transparent;
}

#footer a#waitt {

float: left;
width: 94px !important;;
width: 120px;
height: 50px;
margin-top: -3px !important;;
margin-top: 0;
background: transparent url(images/logos/waitt.png) top left no-repeat !important;
background: transparent;
}


#footer a#waitrose {

float: left;
width: 98px !important;;
width: 120px;
height: 20px;
margin-top: 15px !important;;
margin-top: 0;
background: transparent url(images/logos/waitrose.png) top left no-repeat !important;
background: transparent;
}



#footer a#weston {

float: left;
width: 130px !important;;
width: 120px;
height: 30px;
margin-top: 15px !important;;
margin-top: 0;
background: transparent url(images/logos/weston.png) top left no-repeat !important;
background: transparent;
}






#footer .hide {
display: none !important;
display: inline;
}