/* 
	Southampton University - Learning Object CSS - p.14 Plagiarism
	(Oct 2013 - www.sjward.org)
	-------------------------------------------------------------- */

@media screen and (max-device-width: 480px){
	body{ -webkit-text-size-adjust: none;	}
}

*		{ margin:0; padding:0; }
html	{ height:100%; }
body	{ height:100%; background:#fff; font:normal normal 500 100% 'arial', 'Lucida Grande', sans-serif; color:#303030; }


#main_wrap, 
#footer_wrap, 
#footer_spacer,
#offset_top { 
	position:relative; width:100%; cursor:default;  
}		
#main_wrap		{ min-height:100%; background:#fff; min-width:650px; }
#footer_spacer	{ height:35px; background:none; width:600px; }
#footer_wrap	{ height:30px; margin-top:-30px;  background:none; min-width:650px; }
#offset_top 	{ height:20px; margin:0px; }


div.alignment-L, 
div.alignment-C, 
div.alignment-R { 
	position: relative; width: 630px; overflow:visible; background:#fff; height:640px; border:0px solid #aaa; padding:10px;
}
	div.alignment-L { margin: 0; }
	div.alignment-C { margin: 0 auto; background:#fff url('images/road.png') no-repeat 225px 50px; }
	div.alignment-R { margin: 0 0 0 auto;}

div.alignment-Cf { 
	position:relative; width:650px; overflow:visible; background:none; min-height:20px; border:0; margin:0 auto; text-align:center; color:#888; font-size:12px;
}


/* ---------------------------------- */

img { border:0; outline:none; }

.reveal_wrap {
	position:relative;
	margin:0 0 0px 300px;
}
div.reveal {
	position:absolute;
	padding:10px;
	width:310px;
	background:#eaeaea;
	border:1px dotted #eee;
	-webkit-box-shadow: 3px 4px 5px rgba(50, 50, 50, 0.46);
	-moz-box-shadow:    3px 4px 5px rgba(50, 50, 50, 0.46);
	box-shadow:         3px 4px 5px rgba(50, 50, 50, 0.46);
	-webkit-border-radius:	3px;
	-moz-border-radius:		3px;
	border-radius:			3px; 
	display:none;
}


div.closer {
	position:absolute;
	padding:5px 10px 5px 10px;
	right:0px;
	top:0px;
	font-size:14px;
	line-height:16px;
	color:#fff;
	background:#dadada;
	-webkit-border-bottom-left-radius:3px;
	-moz-border-radius-bottomleft:3px;
	border-bottom-left-radius: 3px;
}
div.closer:hover {
	background:#c9c9c9;
}


a { color:#404040; text-decoration:none; outline:none; background:#ebe5c7; padding:10px; margin:0 20px 0 0; } 
a:hover	{ color:#fff; background:#b02e2e; padding:10px; }


.alpha {
	opacity:0.5;
	filter:alpha(opacity=50);
}
.alpha:hover {
	opacity:0.6;
	filter:alpha(opacity=60);
}


.selected {
	opacity:1;
	filter:alpha(opacity=100);
	color:#fff;
}


.feedback_wrap {
	position:relative;
	margin:190px 0 0px 0px;
}
div.feedback {
	position:absolute;
	padding:0px;
	width:270px;
	background:#eaeaea;
	border:0px dotted #eee;
	-webkit-box-shadow: 3px 4px 5px rgba(50, 50, 50, 0.46);
	-moz-box-shadow:    3px 4px 5px rgba(50, 50, 50, 0.46);
	box-shadow:         3px 4px 5px rgba(50, 50, 50, 0.46);
	-webkit-border-radius:	3px;
	-moz-border-radius:		3px;
	border-radius:			3px; 
	display:none;
}
.fhead { 
	width:100%;
}
.togglebutton {
	position:absolute;
	width:40px;
	height:35px;
	top:0px;
	right:0px;
	background:#c00;
}
.fbody { display:none; }


p, ul { line-height: 17px; color:#606060; }
p { text-align:left; margin-bottom:25px; font-size:14px; }

	.fbody p { margin:15px 10px 25px 15px; }


h1, h2, h3, h4 { margin:0; padding:0;
	font-weight:700;
}
h1 { font-size:17px; margin:20px 0 20px 0px; padding:0 0 0 0px; color:#b02e2e; }
h2 { font-size:17px; margin:0 0 5px 0; color:#8c3e3e; }
h3 { font-size:16px; font-weight:500; margin:0px; padding:10px; color:#fff; }
h4 { font-size:19px; margin:0px 0 20px 0; color:#b02e2e; }
	

ul { 
	list-style: disc outside none; 
	font-size: 15px;
	font-weight:700;
	margin:0 0 20px 20px;
}
ul li {
	line-height:18px;
	margin-bottom:4px;
	color:#014311;
}


.fL { float:left; }	


.tabletop { 
	position:relative;
	background:url('images/table-40pc.png') no-repeat left top;
	width:267px;
	height:245px;
}

.stephen { position:absolute; top:0px; left:80px; width:80px; height:88px; border:0px solid #00f; overflow:hidden; font-size:150px/* prevent IE bug */; }
.claud { position:absolute; top:98px; left:150px; width:115px; height:60px; border:0px solid #00f; overflow:hidden; font-size:150px/* prevent IE bug */; }
.anna { position:absolute; top:163px; left:80px; width:80px; height:80px; border:0px solid #00f; overflow:hidden; font-size:150px/* prevent IE bug */; }
.mary { position:absolute; top:98px; left:0px; width:90px; height:65px; border:0px solid #00f; overflow:hidden; font-size:150px/* prevent IE bug */; }

.stephen:hover, .selected.stephen { background:url('images/table-H-40pc.png') no-repeat -80px 0px; }
.claud:hover, .selected.claud { background:url('images/table-H-40pc.png') no-repeat -150px -98px; }
.anna:hover, .selected.anna { background:url('images/table-H-40pc.png') no-repeat -80px -163px; }
.mary:hover, .selected.mary { background:url('images/table-H-40pc.png') no-repeat 0px -98px; }

.arrow-open { background:url('images/arrow-open.png') no-repeat left 12px; }
.arrow-close { background:url('images/arrow-close.png') no-repeat left 10px; }

.s-col { color:#4b5981; }
.c-col { color:#489a99; }
.a-col { color:#898ec6; }
.m-col { color:#d78089; }

.s-bg { background:#4b5981; }
.c-bg { background:#489a99; }
.a-bg { background:#898ec6; }
.m-bg { background:#d78089; }

