/*** HOMEPAGE ***/
/*** externally designed styles implemented EJH 19.07.13 ***/

#hp-tabs {margin: -40px -32px 16px; position: relative; height: 304px; z-index: 0;}
.mceContentBody #hp-tabs {margin: 0;}
#hp-tabs ul.tabs {position: absolute; right: 0; width: 216px; margin: 0; padding: 0; list-style: none;}
#hp-tabs ul.tabs li {
	position: relative;
	padding: 14px 20px 29px;
	margin: 0;
	height: 56px;
	color: #6e6e6e;
	font-size: 15px;
	cursor: pointer;
	border-bottom: 1px solid #e5e5e5;
	display: block;
	background: none;
}
.mceContentBody #hp-tabs ul.tabs li {cursor: text;}
#hp-tabs ul.tabs li span.news-type {display: block; font-size: 9px;}
#hp-tabs ul.tabs li.active {background-color: #0f6677; color: white; border-bottom: 1px solid #0f6677; cursor: text;}

#hp-tabs ul.tabs li.active:before {
	content: "";
	width: 0;
	height: 0;
	border-top: 12px solid transparent;
	border-bottom: 12px solid transparent;
	border-right: 12px solid #0f6677;
	position: absolute;
	left: -11px;
	top: 36px;
	z-index: 1;
}

#hp-tabs .pane .tab-text {
	position: absolute; 
	background-color: white;
	border-left: 4px solid #0f6677;
	width: 220px;
	height: 170px;
	margin: 30px;
	padding: 30px;
	z-index: 1;
}
#hp-tabs .pane .tab-text h3 {margin-top: 0; margin-bottom: 1em;}
#hp-tabs .pane .tab-text a {text-decoration: none;}
#hp-tabs .pane .tab-text a:hover {text-decoration: underline;}
#hp-tabs .pane img {position: absolute; top: 0; z-index: 0;}

/** glossary page styles**/
dd {position: relative; height: 300px;}
dd .tab-text {
	position: absolute; 
	background-color: white;
	border-left: 4px solid #0f6677;
	width: 220px;
	height: 170px;
	margin: 30px;
	padding: 30px;
	z-index: 1;
}
dd .tab-text h3 {margin-bottom: 1em;}
dd .tab-text a {text-decoration: none;}
dd .tab-text a:hover {text-decoration: underline;}
dd img {position: absolute; top: 0; z-index: 0;}


/*** smallscreen ***/

.mobile.only {display: none;}
.is-smallscreen .mobile.only {display: block;}
.is-smallscreen #content-wrapper #main-content .mobile {
	background-color: #575757;
	background-image: url('chevron.png'), url('title-grad.png');
	background-repeat: no-repeat, repeat-x;
	background-position: right 50%, left top; 
	color: white; 
	line-height: 45px; 
	margin-left: -18px; 
	margin-right: -18px; 
	padding-left: 20px; 
	font-size: 15px;
}

.is-smallscreen #library-search {position: absolute; top: 29px; height: auto; margin-right: -16px; margin-left: -16px; width: auto;}

.is-smallscreen #hp-tabs {height: 340px; margin-top: -3px;}
.is-smallscreen #hp-tabs ul.tabs {width: 134px; bottom: -25px; height: 50px; left: 32px;}
.is-smallscreen #hp-tabs ul.tabs li {display: inline-block; border-bottom: none; width: 17px; height: 17px; background: white url('pale-dot.png') no-repeat center top; padding: 0 12px;}
.is-smallscreen #hp-tabs ul.tabs li.active {background-image: url('grey-dot.png');}
.is-smallscreen #hp-tabs ul.tabs li.active:before {display: none;}
.is-smallscreen #hp-tabs .pane .tab-text {left: 12px;}
.is-smallscreen #hp-tabs .pane img {max-width: 960px; right: 0;}
.is-smallscreen .inpage-edit-link {display: none;}
.is-smallscreen .mobile.only.tabs {margin-top: 288px;}

.is-smallscreen #content-wrapper #main-content #library-search .mobile {margin-left: 0; margin-right: 0;}
.is-smallscreen #content-wrapper #main-content .guide {margin-right: -17px;}
.is-smallscreen #content-wrapper #main-content .guide h2 a:link {text-decoration: none;}
.is-smallscreen #content-wrapper #main-content .guide h2.mobile a:link {color: white; text-decoration: none;}
.is-smallscreen #content-wrapper #main-content .opening {margin-top: 24px;}
.is-smallscreen #content-wrapper #main-content .icon-title {margin-right: 0;}

.is-smallscreen #main-content .guide.audience { 
	background-repeat: no-repeat; 
	background-position: left 6px;
	padding-left: 100px;
}

.is-smallscreen #main-content .guide.audience.students {background-image: url('students-mini.jpg');}
.is-smallscreen #main-content .guide.audience.staff {background-image: url('staff-mini.jpg');}
.is-smallscreen #main-content .guide.audience.visitors {background-image: url('visitors-mini.jpg');}

/*** other hp contents ***/

.students h2 {background-image: url('students.jpg');}
.staff h2 {background-image: url('staff.jpg');}
.visitors h2 {background-image: url('visitors.jpg');}
.fifth h2 {background-image: url('guide.jpg');}

.students, .staff, .visitors {
min-height:240px;
}

.guide.group-study {clear: left;}

.using h4 {font-size: 14px;}
.is-smallscreen .using h4 {margin-bottom: 1em;}
#main-content .using h4 a {color: #323232; text-decoration: none;}
#main-content .using h4 a:hover {text-decoration: underline;}

#main-content .using ul {padding-left: 0; margin: 0; list-style: none;}
#main-content .using ul:first-of-type {margin-bottom: 22px;}
#main-content .using ul li {margin-bottom: 2px; font-weight: bold;}
#main-content .using ul li a {text-decoration: none;}
#main-content .using ul li a:hover {text-decoration: underline;}

.using, .fifth {min-height: 469px;}
.is-smallscreen .using, .is-smallscreen .fifth {min-height: 0;}

.promos {
	float: left;
	width: 288px;
	margin: 0px 10px 0 0;
}

.is-smallscreen .promos {float: none;}

#main-content .promos ul {margin: 0; padding: 0; list-style: none;}
#main-content .promos ul li {margin-bottom: 10px; padding-left: 0; background-image: none;}

#main-content .promos ul li a {
	background-color: #bbbbbb;
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	width: 124px;
	height: 82px;
	padding: 16px 150px 16px 16px;
	color: white;
	text-decoration: none;
	font-size: 22px;
	line-height: 1.2em;
}

#main-content .promos ul li a:hover {text-decoration: underline;}

#main-content .promos ul li a.mrc {background-image: url('mrc.jpg');}
#main-content .promos ul li a.research-archive {background-image: url('research.jpg');}
#main-content .promos ul li a.teaching {background-image: url('grid.jpg');}
#main-content .icon-title {width: 850px; margin: 10px 10px 0 0; padding-left: 18px; padding-right:18px; border: 1; background-color: bbbbbb;}
#main-content .icon-title h3 {line-height: 37px;}
#main-content .icon-title.lib-news h3 {background-image: url('news.png');}
#main-content .icon-title.lib-blog h3 {background-image: url('blog.png');}
#main-content .icon-title.lib-twitter h3 {background-image: url('twitter.png');}

#main-content .lib-twitter {float: left;}

#main-content .lib-twitter .twitterbox .twitter-feed {
	position: relative;
	border: none;
	box-shadow: none;
	padding: 0 0 0px 0;
	max-width: 800px;
	height: 170px;
}

#main-content .lib-twitter .twitterbox .twitter-head-titles {width: 55%;}

#main-content .lib-twitter .twitterbox .twitter-head {
	position: absolute;
	bottom: 0;
	background-color: #f9f9f9;
	border: 1px solid #d6d6d6;
	padding: 1px 1px 1px 1px;
	height: 200px;

}

#main-content .lib-twitter .twitterbox .twitter-head .twitter-btn {
	background-color: #0e6f82;
	background-image: none;
	vertical-align: middle;
	border: none;
	height: auto;
	padding: 3px;
	margin-top: 1px;
}

#main-content .lib-twitter .twitterbox .twitter-head .twitter-btn i {display: none;}
#main-content .lib-twitter .twitterbox .twitter-head .twitter-btn .label {color: white;}

.twitterbox .twitter-head {
	display: none;
}

#main-content .lib-twitter .twitterbox .tweet {border: none;}
#main-content .lib-twitter .twitterbox .tweet p.tweet-text {margin-bottom: 0;}
#main-content .lib-twitter .twitterbox .tweet .date-posted a {text-decoration: none; color: #757575;}
#main-content .lib-twitter .twitterbox .tweet .date-posted a:hover {text-decoration: underline;}
#main-content .lib-twitter .twitterbox .tweet-actions {float: none; display: block; margin-top: 10px;}
#main-content .lib-twitter .twitterbox .tweet-actions a {padding-right: 6px;}
#main-content .lib-twitter .twitterbox .tweet-actions .label {display: none; padding: 0 6px;}

/*** blog rss feed ***/

.lib-blog .feed {padding-right: 20px;}

.lib-blog .feedEntry {border-bottom: none; margin-bottom: 1em;}

.lib-blog .entryContent {margin-left: 0;}

#main-content .lib-blog .entryContent img {display: none;}

.lib-blog .entryKeywords {display: none;}

#main-content .lib-blog .entryTitle {
	margin-top: 0;
	margin-bottom: 0;
	font-size: inherit;
}