$icons-sprite-dimensions: true;
$icons-spacing: 40px;

@font-face {
    font-family: 'ChunkFiveRegular';
    src: url('/www/fonts/ChunkFive/Chunkfive-webfont.eot');
    src: url('/www/fonts/ChunkFive/Chunkfive-webfont.eot?#iefix') format('embedded-opentype'),
         url('/www/fonts/ChunkFive/Chunkfive-webfont.woff') format('woff'),
         url('/www/fonts/ChunkFive/Chunkfive-webfont.ttf') format('truetype'),
         url('/www/fonts/ChunkFive/Chunkfive-webfont.svg#ChunkFiveRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@import 'vars.scss';
@import 'mixins/collection.scss';
@import "compass/css3/box-shadow";
@import 'normalise.scss';
@import 'mixins/grids.scss';
@import 'icons/*.png';


html, body {

}

html {
	background:url('#{$structure}/globeLines.png') bottom center no-repeat;
}

body {
	
}

/* =============================================================================
   Header
   ========================================================================== */

header {
	background:$blue url('#{$structure}/header/texture.jpg') top center no-repeat;
	padding:30px 0;
	position:relative;
	z-index:10;
	overflow:hidden;
	height:121px;

	.no-js & {
		border-bottom:5px solid #4c5d7e;
	}

	#home & {
		height:257px;
	}

	.group {
		position:relative;
	}

	.bartsLogo {
		position:absolute;
		right:12px;
		top:0;

		#home & {
			top:auto;
			bottom:0;
		}
	}

}

#intro {
	@include span(6);
	z-index:1;

	h1 {
		color:#fff;
		text-shadow:0 5px 0 rgba(43,63,102,0.75);
		letter-spacing:-2px;
		margin:0;

		a {
			color:#fff;

			&:hover {
				text-decoration:none;
			}
		}

		span {
			font: 1.857em/58px $chunkFive;
		}
	}

	p {
		display:block;
		font-size:1.5em;
		color:#fff;
		padding-top:15px;
		margin:9px 0 15px;
		border-top:1px solid;
		text-shadow:0 1px 0 rgba(43,63,102,0.75);
	}
}

#illustration {
	height: 359px;
	position: absolute;
	right: 0;
	top: -50px;
	width: 947px;
	background:url('#{$structure}/header/dots.png') top right no-repeat;
}

#crosses {
	position:absolute;
	width:363px;
	height:246px;
	right:0;
	top:-9px;
}

#crossesImage {
	width:363px;
	height:246px;
	background:url('#{$structure}/header/crosses.png') top right no-repeat;
	position:absolute;
	top:0;
	left:0;
}

#globe {
	position:absolute;
	top:-216px;
	right:-63px;
	width:468px;
	height:468px;
}

#globeImage {
	background:url('#{$structure}/header/globe.png') top right no-repeat;
	width:468px;
	height:468px;
	position:absolute;
	top:0;
	left:0;
}

/* =============================================================================
   Map
   ========================================================================== */

@import 'map.scss';

/* =============================================================================
   Page
   ========================================================================== */
#page {
	@include grid;
	@include clearfix;
	padding:54px 0 132px;
	background:url('#{$structure}/map/mapArrows.png') 50% 15px no-repeat;

	.no-js & {
		background:none;
		padding-top:24px;
	}
}

#content {
	h1 {
		font-size:2.5em;
	}

	h2 {
		font-size:2em;
		color:$orange;
		font-family:$arial;
		font-weight:normal;
		letter-spacing:-0.05em;

		.ie7 & {
			zoom:1;
		}
	}
}

#pageContent {
	@include col(9);
	@include push(3);

	&.fullPage {
		@include col(12);
		@include push(0);
		margin: 0 12px;
	}

	h2, h3, h4, h5, h6 {
		font-family: Arial, Tahoma, sans-serif;
		font-weight: normal;
	}

	h3 {
		font-size: 1.75em;
	}

	h4 {
		font-size: 1.4em;
	}

	h5 {
		font-size: 1.167em;
	}

	h6 {
		font-size: 1em;
	}

	h1 + p,
	h2 + p,
	h3 + p {
		font-size: 1.3em;
	}

	p {
		line-height: 1.5em;
	}

 
}







#sidebar {
	@include col(3);
	@include pull(9);

	h2 {
		height: 43px;
		overflow: hidden;
		background: #61708c url(#{$structure}/sidebarTitle.png) top left no-repeat;
		font-family: $chunkFive;
		color: #fff;
		text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
		padding: 0 15px;
		line-height: 43px;
		margin: 0 0 3px;
	}

	.box {
		background: #eff5fc;
		margin: 0 0 20px;
		padding: 15px;
	}

	ul {
		list-style: none;
		margin: 0 0 20px;
		padding: 0;
	}

	li {
		background: #eff5fc;
		margin: 0 0 3px;

		span {
			display: block;
			margin: 0 0 5px;
		}

		a {
			padding: 15px;
			display: block;
			color: #637490;
			font-weight: bold;

			&:hover {
				text-decoration: none;
			}
		}

		p {
			margin: 0;
			color: #859bbf;
			font-weight:normal;
		}

		&.active {
			a {
				background: #f07208 url(#{$structure}/sidebarActive.png) center center;
				color: #fff;

				p {
					color: #fff;
				}
			}
		}

		&:hover {
			background: #859bbf;

			a {
				color: #fff;
				
				p {
					color: #fff;
				}
			}
		}

	}

}


#filter {
	.tags {
		overflow: hidden;
	}

	p {
		border-top: 1px solid #b9c3d2;
		clear: both;
		margin: 10px 0 0 0;
		padding: 10px 0 0 0;
	}
	
}


#relatedDocs li a {
	padding-right: 60px;
	position: relative;
	
	.icons {
		position: absolute;
		right: 15px;
		top: 15px;
	}
}


/* =============================================================================
   Home
   ========================================================================== */

#welcome {
	@include col(7);

	h1 {
		margin:0;
		color:#616f8b;
	}

	ol {
		list-style:none;
		margin:10px 0 0;
		padding:0;
		font-size:1.5em;
		letter-spacing:-0.04em;
		color:#6f6f6f;

		li {
			margin:0 0 10px;
		}
	}
}

#quickSearch {
	@include col(5);

	form {
		background:none;
		border:none;
		@include box-shadow(none);
	}

	.module {
		margin:0 0 5px;
		@include clearfix;
	}

	.tagbox {
		width:350px;
	}

	ul {
		list-style:none;
		margin:0;
		padding:0;
		text-align:right;
	}

	button, .advancedSearch {
		padding-left: 0;
		padding-right: 0;
		text-align: center;
		width: 175px;
	}

	button {
		float:left;
	}

	.advancedSearch {
		float:right;
		background:#aeaeae;
		height:34px;
		display:block;
		@include border-radius(5px);
		@include box-shadow(0 1px 0 #fff, 0 2px 7px rgba(0,0,0,0.39) inset);
		color:#fff;
		line-height:34px;
		font-size:1.167em;
		font-family:$chunkFive;
		text-shadow:0 1px 1px rgba(0, 0, 0, 0.5);

		&:hover {
			@include box-shadow(0 1px 0 #fff);
			text-decoration:none;
		}
	}
}

#homeFeature {
	clear:both;
	width:960px;
	height:368px;
	margin:20px 12px;
	background:url(#{$structure}/homeFeature/background.jpg) top left no-repeat;
	position:relative;

	.block {
		background:#616f8b;
		position:absolute;
		display:none;
	}

	.pos1  { width:48px;  height: 48px;   top: 86px;  left: 0; }
	.pos2  { width:48px;  height: 48px;   top: 28px;  left: 51px; }
	.pos3  { width:48px;  height: 48px;   top: 189px; left: 21px; }
	.pos4  { width:12px;  height: 12px;   top: 107px; left: 53px; }
	.pos5  { width:64px;  height: 64px;   top: 103px; left: 69px; }
	.pos6  { width:32px;  height: 32px;   top: 52px;  left: 106px; }
	.pos7  { width:128px; height: 128px;  top: 81px;  left: 143px; }
	.pos8  { width:78px;  height: 78px;   top: 226px; left: 188px; }
	.pos9  { width:50px;  height: 50px;   top: 47px;  left: 278px; }
	.pos10 { width:24px;  height: 24px;   top: 104px; left: 311px; }

	.pos11 { width:106px; height: 106px;  top: 161px;  left: 278px; }
	.pos12 { width:32px;  height: 32px;   top: 110px;  left: 348px; }
	.pos13 { width:128px; height: 128px;  top: 75px;   left: 395px; }
	.pos14 { width:79px;  height: 79px;   top: 214px;  left: 451px; }
	.pos15 { width:79px;  height: 79px;   top: 108px;  left: 533px; }
	.pos16 { width:64px;  height: 64px;   top: 192px;  left: 564px; }
	.pos17 { width:32px;  height: 32px;   top: 85px;   left: 623px; }
	.pos18 { width:46px;  height: 46px;   top: 125px;  left: 627px; }
	.pos19 { width:24px;  height: 24px;   top: 179px;  left: 654px; }
	.pos20 { width:79px;  height: 79px;   top: 212px;  left: 667px; }

	.pos21 { width:32px;  height: 32px;   top: 101px;  left: 689px; }
	.pos22 { width:64px;  height: 64px;   top: 142px;  left: 688px; }
	.pos23 { width:64px;  height: 64px;   top: 44px;   left: 758px; }
	.pos24 { width:128px; height: 128px;  top: 113px;  left: 758px; }
	.pos25 { width:48px;  height: 48px;   top: 258px;  left: 846px; }
	.pos26 { width:32px;  height: 32px;   top: 74px;   left: 844px; }
	.pos27 { width:12px;  height: 12px;   top: 94px;   left: 894px; }
	.pos28 { width:12px;  height: 12px;   top: 64px;   left: 913px; }
	.pos29 { width:32px;  height: 32px;   top: 93px;   left: 924px; }
	.pos30 { width:64px;  height: 64px;   top: 141px;  left: 894px; }
}

.homepageReport {
	@include col(6);
	position:relative;

	.module {
		overflow: hidden;
		position: relative;
	}

	.details {
		position:relative;
		z-index:2;
		width:300px;
	}

	img {
		position:absolute;
		@include border-top-right-radius(3px);
		right:0;
		top:0;
		background-position:top right;
		z-index:1;
	}


}

.module {
	background:#f4f4f4;
	border:1px solid #c9c9c9;
	@include box-shadow(0 1px 0 #fff inset);
	@include border-radius(3px);
	padding:10px;
	border-bottom-width:2px;
	margin-bottom:15px;

	h3 {
		color:$orange;
		font-size:2em;
		font-family:$chunkFive;
		text-shadow:0 1px 0 #fff;
		font-weight:normal;
	}

	a.btn, .btn, button, input[type=button], input[type=submit] {
		font-size:1.167em;
		padding:8px 10px;

		&:active,
		&:hover {
			padding-bottom:6px;
		}

		&:active {
			top:2px;
			padding-bottom:4px;
		}
	}

}

.orangeBox {
	background: #f48506;
	@include border-radius(5px);
	padding: 10px;
	color:#fff;
	margin:0 0 15px;

	h2, a {
		color: #fff !important;
		margin: 0;
	}
	.btn {
		float: right;
	}
}

/* =============================================================================
   Other Pages
   ========================================================================== */

@import 'search.scss';
@import 'countries.scss';
@import 'contact.scss';

/* =============================================================================
   Paging
   ========================================================================== */

.paging {
	clear: both;
	margin: 7px 0 15px 0;
	padding:7px 69px 0 93px;
	overflow: hidden;
	text-align: center;
	font-weight:bold;
	border-top:1px solid #c2c9d4;
	position:relative;

	span,
	a {
		display:block;
		padding:3px 6px;
		color:$blue;
	}

	.previous,
	.next {
		position:absolute;
		top:7px;
		width:auto !important;
	}

	.previous {
		left:0;
		@extend .icons-arrowLeft;
		background-position:0 3px !important;
		padding-left:27px;
	}

	.next {
		right:0;
		@extend .icons-arrowRight;
		background-position:37px -52px !important;
		padding-right:27px;
	}

	.pagination {
		@include inline-block;
		position: relative;
		list-style:none;
		margin:0 auto;
		padding:0;

		li {
			float:left;

			&.active {
				margin-top:-0.4em;

				a {
					font-size:1.5em;
					color:$orange;
				}
			}
		}
	}
}


/* =============================================================================
   Top Navigation
   ========================================================================== */
#siteNav {
	position:relative;
	padding:0 12px;
	font-size:2em;
	font-family: $chunkFive;
	margin:0 0 52px;

	a {
		color:#c15412;
		text-shadow:0 1px 0 rgba(255,255,255,0.71);
		padding:6px 21px;
		display:block;
		float:left;
		position:relative;
		z-index:2;

		&:hover {
			text-decoration:none;
		}
	}

	ul {
		background:url(#{$structure}/navigationBg.png) top left repeat-x;
		height:50px;

		li {
			float:left;
			position:relative;
		}

		&:before {
			content:"";
			display:block;
			position:absolute;
			top:-18px;
			left:0;
			@include image-replace('#{$structure}/navigationEnds.png',12px,94px);
		}

		&:after {
			content:"";
			display:block;
			position:absolute;
			top:-18px;
			right:0;
			@include image-replace('#{$structure}/navigationEnds.png',12px,94px);
			background-position:bottom right;
		}
	}
}

#siteNav a:hover,
#siteNav li.active a {
	color:#fff;
	text-shadow:0 1px 1px rgba(0,0,0,0.39);
}

#siteNav li.active span {
	display:block;
	position:absolute;
	top:-14px;
	left:50%;
	z-index:1;
	margin-left:-37px;
	@include image-replace('#{$structure}/navigationSpiralArrow.png',75px,108px);
}

/* =============================================================================
   Footer
   ========================================================================== */
footer {
	height:138px;
	clear:both;
}

#footerLinks {
	background:$blue url('#{$structure}/header/texture.jpg') top center no-repeat;
	padding:30px 0;
	overflow:hidden;
	height:40px;
	border-top:2px solid #4c5d7e;
	border-bottom:2px solid #4c5d7e;
	margin:0 0 10px 0;

	.group {
		position:relative;
	}

	ul {
		padding:0;
		margin:0;
		@include col(7);
		list-style:none;
		

		li {
			float:left;
			margin:0 0 10px;

			.ie7 & {
				white-space:nowrap;
			}

			&.newLine {
				clear:left;
				
				a {
					padding-left:0;
					border-left:none;
				}
			}
		}

		a {
			color:#fff;
			text-decoration:none;
			padding:0 10px;
			border-left:1px solid #fff;
			float:left;

			&:hover {
				text-decoration:underline;
			}
		}

		li:first-child a {
			border-left:none;
			padding-left:0;
		}

		li:last-child {
			padding-right:0;
		}
	}

	.qmulLogo {
		float:right;
		margin:-7px 12px 0 0;
	}
}

#copyright,
#siteCredit {
	@include col(6);
}

#siteCredit {
	text-align:right;

	a {
		color:#6f6f6f;
		
		&:hover {
			color:$orange;
		}
	}
}

/* =============================================================================
   Buttons
   ========================================================================== */

a.btn, .btn, button, input[type=button], input[type=submit] {
	@include btn(#b2dc41,#82ad0d,3px,10px);
	@include vertical-gradient(#b2dc41,#82ad0d,50px,'b2dc41','82ad0d');
	font:1.5em/18px $chunkFive;
	color:#fff;
	text-shadow:0 1px 1px rgba(0,0,0,0.5);

	&.pdf {
		@include vertical-gradient(#f48506,#e74a05,50px,'f48506','e74a05');
	}
}

/* =============================================================================
   helper classes
   ========================================================================== */
.bartsLogo {
	@include image-replace('#{$content}/bartsLogo.png',306px,54px);
	margin:0;
}

.qmulLogo {
	@include image-replace('#{$content}/qmulLogo.png',206px,54px);
	margin:0;
}

.imageAlignRight {
	float:right;
	margin:0 0 5px 15px;
}

.imageAlignLeft {
	float:left;
	margin:0 15px 5px 0;
}

.imageAlignCenter {
	display:block;
	margin:15px auto;
}

/* Hide for both screenreaders and browsers:
   css-discuss.incutio.com/wiki/Screenreader_Visibility */
.hidden {
    display: none;
    visibility: hidden;
}
/* Hide only visually, but have it available for screenreaders: by Jon Neal.
  www.webaim.org/techniques/css/invisiblecontent/  &  j.mp/visuallyhidden */
.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}
/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: drupal.org/node/897638 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}
/* Hide visually and from screenreaders, but maintain layout */
.invisible {
    visibility: hidden
}
/* Contain floats: nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before,
.clearfix:after {
    content: "";
    display: table;
}
.clearfix:after {
    clear: both
}
.clearfix {
    zoom: 1
}

.overlay {
	background:rgba(0,0,0,0.8);
	/* For IE 5.5 - 7*/
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000, endColorstr=#b2000000);
	/* For IE 8*/
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2000000, endColorstr=#b2000000)";

	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	z-index:9;
}

.systemMessages {
	display: block;
	clear: both;
}

.message, .error, .success, .warning {
	padding: 15px 15px 15px 70px;
	border: 2px solid;
	color: #fff;
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4);
	font-weight: bold;
	font-size: 1.5em;
	@include border-radius(5px);
	margin: 0 0 15px;
	position: relative;

	p {
		margin: 0;
	}

	span {
		position: absolute;
		left: 15px;
		top: 10px;
	}
}

.disabled {
	@include opacity(.5);
}

.error {
  background: #eb9999;
  border-color: #e52525;
}

.success {
  background: #90bb1d;
  border-color: #64a420;
}

.warning {
  background: #fff17e;
  border-color: #f9ce5b;
  color: #f07208;
  text-shadow: 0 1px 0 #fff;
}

@include all-icons-sprites;
.icons {
	display:block;
}


.loading {
	background:url(#{$icons}/loader.gif) top center no-repeat;
	min-height:50px;
}

@import 'tags.scss';
@import 'media-queries.scss';
/*@import 'print.scss';*/