@charset "utf-8";

@import url("core/base.css");
@import url("core/content-viewport.css");

* { margin:0px; padding:0px; }
html, body, div, p, ul, li { margin:0px; padding:0px; }
ul { position: relative; }
a:focus { outline: none; }
.clear {clear:both;}

body {
	display:table;
	width:100%;
	background:url(../img/bg.jpg) repeat-x;
	background-color:#0e3253;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	line-height:16px;
}

#wrapper {
	position:relative;
	width:100%;
	margin:0px auto;
	background:url(../img/framebg.jpg) top center no-repeat;
}

#wrapperFrame {
	position:relative;
	width:920px;
	margin:0px auto;
}

	#wrapperHeader,
	#wrapperBody,
	#wrapperFooter { position:relative; width:920px; }
	
	#wrapperHeader { float:left; height:389px; }
		
		#navigationFrame {width:920px; height:167px;}
		#banner { float:left; width:920px; height:222px; background-repeat:no-repeat; }
		
		.headerType_about-msj #banner { background-image:url(../img/banner/about-msj.jpg); }
		.headerType_faith-and-mission #banner { background-image:url(../img/banner/education-in-faith.jpg); }
		/*.headerType_faith-and-mission #banner { background-image:url(../img/banner/faith-and-mission.jpg); }*/
		.headerType_learning-and-teaching #banner { background-image:url(../img/banner/learning-and-teaching.jpg); }
		.headerType_student-wellbeing #banner { background-image:url(../img/banner/student-wellbeing.jpg); }
		.headerType_school-community #banner { background-image:url(../img/banner/school-community.jpg); }
		.headerType_enrolment-information #banner { background-image:url(../img/banner/enrolment-information.jpg); }
		.headerType_news-and-events #banner { background-image:url(../img/banner/news-and-events.jpg); }
		.headerType_support #banner { background-image:url(../img/banner/site.jpg); }
		
	#wrapperBody {
		float:left;
		background:url(../img/bodyfooterbg.jpg) bottom no-repeat;
		background-color:#fff;
		padding-bottom:100px;
	}
	
	#wrapper > #wrapperBody { min-height:648px; height:648px; }
	
		#columnRight { float:right; margin-right:30px; width:620px; min-height:500px; }
		
		#columnLeft { float:left; margin:0px 0px 0px 30px; padding:0px 20px 0px 0px; width:190px; min-height:400px; background:url(../img/subnavi.jpg) no-repeat; }
	
	#wrapperFooter {
		clear:both;
		width:873px;
		height:75px;
		padding:25px 24px 0px 23px;
	}
	
		#wrapperFooter p { float:left; font-size:11px; color:#fff; }
		#wrapperFooter p a { color:#fff; text-decoration:none; }
		#wrapperFooter p a:hover { color:#26b9e9; text-decoration:none; }
		
		#wrapperFooter #fraynework { float:right; width:126px; height:18px; }
		#wrapperFooter #fraynework a { display:block; width:126px; height:18px; background:url(../img/fraynework.gif) 0 0 no-repeat; }
		#wrapperFooter #fraynework a:hover { background-position:0px -50px; }

/* top navigation */

ul#topNavigation {
	position:relative;
	width:920px;
	height:50px;
	list-style:none;
}

	ul#topNavigation li {
		position:absolute;
		float:left;
		display:inline;
		height:50px;
	}
	
	ul#topNavigation li a {
		display:block;
		height:50px;
		background:url(../img/topnavi.jpg?xxx=987878787) 0 0 no-repeat;
	}
	
	ul#topNavigation li#topNavi01 { right:0; width:48px; }
	ul#topNavigation li#topNavi01 a { background-position:-872px 0px; }
	ul#topNavigation li#topNavi01 a:hover { background-position:-872px -71px; }
	
	ul#topNavigation li#topNavi02 { right:267px; width:107px; }
	ul#topNavigation li#topNavi02 a { background-position:-547px 0px; }
	ul#topNavigation li#topNavi02 a:hover,
	ul#topNavigation li#topNavi02 a.selected { background-position:-547px -71px; }
	
	ul#topNavigation li#topNavi03 { right:137px; width:130px; }
	ul#topNavigation li#topNavi03 a { background-position:-653px 0px; }
	ul#topNavigation li#topNavi03 a:hover,
	ul#topNavigation li#topNavi03 a.selected { background-position:-653px -71px; }
	
	ul#topNavigation li#topNavi04 { right:48px; width:89px; }
	ul#topNavigation li#topNavi04 a { background-position:-783px 0px; }
	ul#topNavigation li#topNavi04 a:hover,
	ul#topNavigation li#topNavi04 a.selected { background-position:-783px -71px; }

	ul#topNavigation li#topNavi05 { right:374px; width:107px; }
	ul#topNavigation li#topNavi05 a { background-position:-445px 0px; }
	ul#topNavigation li#topNavi05 a:hover,
	ul#topNavigation li#topNavi05 a.selected { background-position:-445px -71px; }


/* School Logo */

#schoolLogo{
	background:url(../img/logo.png) 0 0 no-repeat;
	width:154px;
	height:165px;
	position:absolute;
	top:23px;
	left:42px;
}

/* primary navigation */

ul#primaryNavigation {
 	list-style:none;
	width:680px;
	height:57px;
	padding:60px 0px 0px 240px;
	background:url(../img/headerbg.jpg) no-repeat;
 }
 
 	ul#primaryNavigation li {
		float:left;
		display:inline;
		height:50px;
	}
	
	ul#primaryNavigation li a {
		display:block;
		height:50px;
		background:url(../img/navi.jpg) 0 0 no-repeat;
	}
	
	ul#primaryNavigation li#navi00 { position:absolute; top:0; left:20px; width:200px; height:190px; }
	ul#primaryNavigation li#navi00 a { width:200px; height:190px;  background:none!important; }
	
	ul#primaryNavigation li#navi01 { width:76px; }
	ul#primaryNavigation li#navi01 a { background-position:0px 0px; }
	ul#primaryNavigation li#navi01 a:hover { background-position:0px -50px; }
	ul#primaryNavigation li#navi01 a.selected { background-position:0px -100px; }
	
	ul#primaryNavigation li#navi02 { width:90px; }
	ul#primaryNavigation li#navi02 a { background-position:-76px 0px; }
	ul#primaryNavigation li#navi02 a:hover { background-position:-76px -50px; }
	ul#primaryNavigation li#navi02 a.selected { background-position:-76px -100px; }
	
	ul#primaryNavigation li#navi03 { width:112px; }
	ul#primaryNavigation li#navi03 a { background-position:-166px 0px; }
	ul#primaryNavigation li#navi03 a:hover { background-position:-166px -50px; }
	ul#primaryNavigation li#navi03 a.selected { background-position:-166px -100px; }
	
	ul#primaryNavigation li#navi04 { width:99px; }
	ul#primaryNavigation li#navi04 a { background-position:-278px 0px; }
	ul#primaryNavigation li#navi04 a:hover { background-position:-278px -50px; }
	ul#primaryNavigation li#navi04 a.selected { background-position:-278px -100px; }
	
	ul#primaryNavigation li#navi05 { width:101px; }
	ul#primaryNavigation li#navi05 a { background-position:-377px 0px; }
	ul#primaryNavigation li#navi05 a:hover { background-position:-377px -50px; }
	ul#primaryNavigation li#navi05 a.selected { background-position:-377px -100px; }
	
	ul#primaryNavigation li#navi06 { width:110px; }
	ul#primaryNavigation li#navi06 a { background-position:-478px 0px; }
	ul#primaryNavigation li#navi06 a:hover { background-position:-478px -50px; }
	ul#primaryNavigation li#navi06 a.selected { background-position:-478px -100px; }
	
	ul#primaryNavigation li#navi07 { width:92px; }
	ul#primaryNavigation li#navi07 a { background-position:-588px 0px; }
	ul#primaryNavigation li#navi07 a:hover { background-position:-588px -50px; }
	ul#primaryNavigation li#navi07 a.selected { background-position:-588px -100px; }
	
	ul#primaryNavigation li a.selected { cursor:default; }

/* secondary navigation */

ul#secondaryNavigation { list-style:none; margin-top:-5px; }
	
	ul#secondaryNavigation li {
		margin:0px;
		padding:10px 0px 10px 0px;
		font-size:13px;
		font-weight:bold;
		border-top:1px solid #e3e3e3;
		}
		
	ul#secondaryNavigation li:first-child,
	ul#secondaryNavigation li.first-child { border-top:none; }
		
	ul#secondaryNavigation li a { display:block; color:#077a9f; text-decoration:none; background:url(../img/li_arrow.gif) 2px 8px no-repeat; padding-left:14px; }
	ul#secondaryNavigation li a:hover { color:#12ad42; text-decoration:underline; }
	ul#secondaryNavigation li a.selected { color:#12ad42; text-decoration:none; cursor:default; }
	
	ul#secondaryNavigation ul {
		margin:5px 0px 10px 17px;
		padding:0px;
		list-style:none;
		}
		
		ul#secondaryNavigation ul li {
			margin:0px;
			padding:4px 0px 4px 0px;
			font-size:12px;
			font-weight:normal;
			border:none;
			}
		
		ul#secondaryNavigation ul li a { display:block; color:#3c3c3c; text-decoration:none; background:url(../img/li_bullet.gif) 0px 8px no-repeat; padding-left:9px; }
		ul#secondaryNavigation ul li a:hover { color:#12ad42; text-decoration:underline; background:url(../img/li_bullet_selected.gif) 0px 8px no-repeat; }
		ul#secondaryNavigation ul li a.selected { color:#12ad42; text-decoration:none; cursor:default; background:url(../img/li_bullet_selected.gif) 0px 8px no-repeat; }
		
/* news */
/*
ul#news_listing,
ul#events_listing {
	width:620px;
	margin:0px;
	padding:0px;
	list-style:none;
	}
	
	ul#news_listing li {
		position:relative;
		float:left;
		width:620px;
		min-height:150px;
		margin:0px;
		padding:14px 0px 14px 0px;
		background:url(../img/news_thumb.jpg) 0 14px no-repeat;
		border-top:1px dotted #8a897f;
		}
		
	ul#news_listing li:first-child,
	ul#news_listing li.first-child { border-top: none; }
	
	ul#news_listing li img { float:left; width:250px; height:150px; overflow:hidden; border:none; }
	ul#news_listing li h2 { float:right; width:350px; margin:-1px 0px 5px 0px; padding:0px; font-size:18px; line-height:21px; font-weight:normal; }
	ul#news_listing li h2 a { color:#20b886; text-decoration:none; }
	ul#news_listing li h2 a:hover { color:#20b886; text-decoration:underline; }
	ul#news_listing li p { float:right; width:350px; font-size:12px; line-height:18px; margin-bottom:20px; }
	ul#news_listing li p a { position:absolute; bottom:8px; right:0px; background-position:0px 5px; }
*/

a.drillDown { font-size:12px; background:url(../img/drilldown_arrow.gif) 0px 3px no-repeat; color:#353535; text-decoration:none; font-weight:bold; padding-left:10px; }
a.drillDown:hover { color:#353535; text-decoration:underline; }

p.date_category { font-size:11px!important; color:#A9A9A9!important; }
	
/* -----------------------  NEWS LISTING  --------------------------- */

#newsListing {
	width:620px;
	margin:0px;
	padding:0px;
}
	#newsListing div.listItem {
		position: relative;
		width: 365px;
		background:url(../img/news_thumb.jpg) 0 0px no-repeat;
		margin: 0px 0px 26px;
		padding: 0px 0px 0px 255px;
	}
	
		#newsListing img {
			position: absolute;
			border:none;
			top:0px;
			left:0px;
			width:230px;
			height:140px;
			overflow: hidden;
			padding-bottom:1px;
		}
	
		#newsListing .buttonFindOutMore {
			height: 20px;
			width: 50px;
		}
			#newsListing .buttonFindOutMore a {
				background: url(../img/pods.gif) no-repeat 0px 0px;
				background-position: 0px -66px !important;
				display: block;
				height: 20px;
				width: 50px;
			}
			#newsListing .buttonFindOutMore a:hover {
				background-position: -351px -66px !important;
			}

/* events */	
	ul#events_listing li {
		position:relative;
		float:left;
		width:620px;
		margin:0px;
		padding:15px 0px 10px 0px;
		background:none;
		border-top:1px dotted #8a897f;
		}
	
	ul#events_listing li:first-child,
	ul#events_listing li.first-child { border-top: none; }
	
	ul#events_listing li p.events_date {
		float:right;
		text-align:right;
		width:90px;
		text-transform:uppercase;
		font-size:18px;
		margin:0px;
		padding:0px;
		color:#077A9F;
		}
		
	ul#events_listing li h2 { float:left; width:530px; margin:0px 0px 5px 0px; padding:0px; color:#20b886; font-size:18px; line-height:21px; font-weight:normal; }
	ul#events_listing li h2 a { color:#20b886; text-decoration:none; }
	ul#events_listing li h2 a:hover { color:#20b886; text-decoration:underline; }
	ul#events_listing li p { float:left; width:530px; font-size:12px; line-height:18px; margin-bottom:10px; }
	ul#events_listing li p a { background-position:0px 3px; }
	
	
	
/* -----------------------  EVENTS, RESOURCES LISTING  --------------------------- */

#eventsListing,
#resourcesListing {
	width:620px;
	margin:0px;
	padding:0px;
}
	#eventsListing div.listItem,
	#resourcesListing div.listItem {
		position: relative;
		margin: 0px 0px 26px 0px;
	}
		#eventsListing .date {
			float: left;
			width: 130px;
			margin:0 0 30px 0;
		}
		#resourcesListing .note {
			position: absolute;
			top: 0; 
			right: 0;
			margin-top: 0;
			font-weight: bold;
			text-transform:uppercase;
		}
	
		#eventsListing .details {
			padding:0px 0px 0px 130px;
		}
		#resourcesListing .details { 
			padding: 0;
		}
	
		#eventsListing .buttonFindOutMore {
			height: 20px;
			width: 50px;
		}
			#eventsListing .buttonFindOutMore a {
				background: url(../img/pods.gif) no-repeat 0px 0px;
				background-position: 0px -66px !important;
				display: block;
				height: 20px;
				width: 50px;
			}
			#eventsListing .buttonFindOutMore a:hover {
				background-position: -351px -66px !important;
			}
			
		#resourcesListing .buttonDownload {
			height: 20px;
			width: 80px;
		}
			#resourcesListing .buttonDownload a {
				background: url(../img/btns.gif) no-repeat 0px 0px;
				background-position: 0px 0px !important;
				display: block;
				height: 20px;
				width: 80px;
			}
			#resourcesListing .buttonDownload a:hover {
				background-position: 0px -20px !important;
			}
			
		#resourcesListing .buttonVisitLink {
			height: 20px;
			width: 80px;
		}
			#resourcesListing .buttonVisitLink a {
				background: url(../img/btns.gif) no-repeat 0px 0px;
				background-position: -80px 0px !important;
				display: block;
				height: 20px;
				width: 80px;
			}
			#resourcesListing .buttonVisitLink a:hover {
				background-position: -80px -20px !important;
			}
	
@media print {
	html,body,
	#wrapper,
	#wrapperIndex,
	#wrapperFrame,
	#wrapperHeaderIndex,
	#wrapperBodyIndex,
	#wrapperBody,
	#welcome,
	#wrapperLeft,
	#wrapperRight,
	#wrapperFooter
	{ background: none !important; }
	
	#wrapperHeader,
	#topNavigation,
	#primaryNavigation,
	#columnLeft,
	#wrapperFooter p,
	#wrapperFooter div
	{ display: none !important; }
	
	#wrapperBody,
	#columnRight {
		float: none;
		clear: both;
		width: 550pt;
		padding-bottom: 3em !important;   	
	}
	#wrapperFooter {
		margin: 0 !important;
		padding: 0 !important; 
		position: static !important; 	
	}
	#wrapperFooter:before {
		font-size: 10pt;
		content: "© Copyright 2011 Mount St. Joseph's Girls College";
		display: block;
		margin: 1em 0 !important;
	}		
}