/**
 * @package     hubzero-cms
 * @file        templates/sciu/css/pages/home.css
 * @copyright   Copyright 2005-2013 Purdue University. All rights reserved.
 * @license     http://www.gnu.org/licenses/lgpl-3.0.html LGPLv3
 */

/*

	-- -- -- -- -- -- --
	home page CSS
	-- -- -- -- -- -- --

*/

	@font-face {
		font-family: 'Socicons';
		src: url('/media/system/css/fonts/socicons-webfont.eot');
		src: url('/media/system/css/fonts/socicons-webfont.eot?#iefix') format('embedded-opentype'), 
			 url('/media/system/css/fonts/socicons-webfont.woff') format('woff'), 
			 url('/media/system/css/fonts/socicons-webfont.ttf') format('truetype'),
			 url('/media/system/css/fonts/socicons-webfont.svg#SociconsRegular') format('svg');
		font-weight: normal;
		font-style: normal;
	}

	.com_content .contentpaneopen {
		padding: 0px;
	}

	html>body #content {
		*border: none;
		border: none\9;
		margin-top: -1px\9;
	}

/* Splash area */
	#splash .wrap {
		padding: 30px;
	}
	#splash .inner-wrap .inner .wrap:before,
	#splash .inner-wrap .inner .wrap:after {
		display: none;
		*display: none;
	}

/* Welcome message */
	#welcome {
		width: 18em;
		margin: 30px auto 50px auto;
		text-align: left;
		color: #ddd;
		text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
		position: relative;
		padding-left: 5em;
	}
	small.welcome-before,
	#welcome:before {
		height: 1px;
		display: block;
		width: 77.5%;
		position: absolute;
		top: 2.5em;
		left: 4.3em;
		content: "";
		background: #fff;
		background: rgba(255, 255, 255, 0.3);
	}
	small.welcome-after,
	#welcome:after {
		content: "\f002";
		font-family: "Socicons";
		font-size: 5em;
		position: absolute;
		top: 0.35em;
		left: 0.1em;
		color: #fff;
		text-shadow: none;
		color: #fff;
		color: rgba(255, 255, 255, 0.5);
		-webkit-transition: all 0.3s ease-in-out;
		   -moz-transition: all 0.3s ease-in-out;
		     -o-transition: all 0.3s ease-in-out;
		        transition: all 0.3s ease-in-out;
		opacity: 1;
	}
	#welcome:hover:after {
		color: #fff;
		-webkit-animation: whitePulse 2s infinite;
		   -moz-animation: whitePulse 2s infinite;
		     -o-animation: whitePulse 2s infinite;
		        animation: whitePulse 2s infinite;
	}
	@-webkit-keyframes whitePulse {
		from {
			color: rgba(255, 255, 255, 0.5);
			text-shadow: 0 0 9px rgba(255, 255, 255, 0.5);
		}
		50% {
			color: #fff;
			text-shadow: 0 0 18px rgba(255, 255, 255, 0.8);
		}
		to {
			color: rgba(255, 255, 255, 0.5);
			text-shadow: 0 0 9px rgba(255, 255, 255, 0.5);
		}
	}
	@-moz-keyframes whitePulse {
		from {
			color: rgba(255, 255, 255, 0.5);
			text-shadow: 0 0 9px rgba(255, 255, 255, 0.5);
		}
		50% {
			color: #fff;
			text-shadow: 0 0 18px rgba(255, 255, 255, 0.8);
		}
		to {
			color: rgba(255, 255, 255, 0.5);
			text-shadow: 0 0 9px rgba(255, 255, 255, 0.5);
		}
	}
	@-o-keyframes whitePulse {
		from {
			color: rgba(255, 255, 255, 0.5);
			text-shadow: 0 0 9px rgba(255, 255, 255, 0.5);
		}
		50% {
			color: #fff;
			text-shadow: 0 0 18px rgba(255, 255, 255, 0.8);
		}
		to {
			color: rgba(255, 255, 255, 0.5);
			text-shadow: 0 0 9px rgba(255, 255, 255, 0.5);
		}
	}
	@keyframes whitePulse {
		from {
			color: rgba(255, 255, 255, 0.5);
			text-shadow: 0 0 9px rgba(255, 255, 255, 0.5);
		}
		50% {
			color: #fff;
			text-shadow: 0 0 18px rgba(255, 255, 255, 0.8);
		}
		to {
			color: rgba(255, 255, 255, 0.5);
			text-shadow: 0 0 9px rgba(255, 255, 255, 0.5);
		}
	}
	#welcome h2 {
		margin: 0;
		padding: 0;
		color: #fff;
	}
	#welcome a {
		color: #fff;
		border-bottom: 1px dotted #ddd;
	}
	#welcome a:hover {
		color: #fff;
		border-bottom: 1px solid #fff;
	}

/* Freatured items */
	#features {
		background: #fff;
		padding: 0;
	}
	#features .wrap {
		padding: 0;
	}
	#features h2 {
		display: none;
	}
	#features h3 {
		border-bottom: 1px dashed #bAbAbA;
		font-size: 1.5em;
		padding: 20px 30px 30px 30px;
		margin: 0;
		font-weight: normal;
		background: #f9f9f9 url("/templates/sciu/images/layout/noise-lite.png");
		position: relative;
	}
	#features h3:before,
	#features h3:after {
		position: absolute;
		top: -20px;
		left: 0;
		content: "";
		display: block;
		border: 10px solid #f9f9f9;
		border-color: transparent #f9f9f9 #f9f9f9 transparent;
	}
	#features h3:after {
		left: auto;
		right: 0;
		top: -20px;
		border-color: transparent transparent #f9f9f9 #f9f9f9;
	}
	#features .columns {
		position: relative;
		margin: 0;
		padding: 0;
		width: 33.33%;
	}
	#features .columns.first {
		width: 33.34%;
	}
	#features .columns:after {
		position: absolute;
		top: -20px;
		left: 20px;
		right: 20px;
		content: "";
		display: block;
		background: #f9f9f9;
		height: 20px;
	}

	#features .columns p,
	#features .columns ul {
		border: none;
	}
	#features .columns p,
	#features .columns form {
		margin: 0;
		padding: 30px 30px 30px 30px;
	}
	#features .columns form p,
	#features .columns p + p {
		padding-top: 0;
	}
	#features .columns form {
		padding-bottom: 0;
	}
	#features .columns p.btn-container {
		text-align: center;
	}
	#features .columns div:first-child {
		position: relative;
		background: #fff;
		margin: 0 0 0 -1px;
		padding: 0;
		border-left: 1px solid #e1e1e1;
		border-right: 1px solid #e1e1e1;
		min-height: 401px;
	}
	#features .columns.first div:first-child {
		border-left: none;
		margin-left: 0;
	}
	#features .columns.third div:first-child {
		border-right: none;
	}
	html.firefox #features .columns div:first-child {
		min-height: 411px;
	}
	#features .poll h4 {
		margin: 0;
		padding: 0 0 1em 0;
	}
	#features .poll ul {
		margin: 0;
		list-style: none;
	}
	#features .poll li {
		background: #f9f9f9;
		padding: 0.5em;
		margin: 1px 0 0 0;
	}
	#features .poll li:hover {
		background: #fff;
	}
	#features .columns .poll p {
		margin: 1em 0 0 0;
		padding-left: 0;
		padding-right: 0;
	}
	#features .poll a {
		float: right;
	}
	#features .columns div.question:after {
		content: "\f086";
	}
	#features .columns .featured-resource .featured-img {
		float: left;
		padding-bottom: 15px;
	}
	#features .columns .featured-resource .featured-img a {
		border: none;
	}
	#features .columns .featured-resource p {
		padding: 30px;
	}
	#features .columns .featured-resource:after {
		content: ".";
		visibility: hidden;
		height: 1px;
		clear: left;
	}

/* Highlight section */
	.highlight-section {
		padding: 0 30px;
		margin: 0 -30px;
		text-align: center;
		background: #e1e1e1 url("../../images/layout/noise-lite.png");
		color: #5a5a5a;
		text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.8);
		-webkit-box-shadow: none;
		   -moz-box-shadow: none;
		    -ms-box-shadow: none;
		     -o-box-shadow: none;
		        box-shadow: none;
		font-size: 2em;
	}
	.highlight-section p {
		padding: 60px;
		margin: 0;
		-webkit-box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.2);
		   -moz-box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.2);
		    -ms-box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.2);
		     -o-box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.2);
		        box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.2);
	}
	.highlight-section a {
		padding: 0.5em 0.7em;
		text-align: center;
		text-shadow: 0px -1px 1px rgba(0, 0, 0, 0.7);
		color: #fff;
		-webkit-background-clip: padding-box;
		font-size: 0.75em;
		margin-bottom: 2px;
		display: inline-block;
		-webkit-border-radius: 0.25em;
		   -moz-border-radius: 0.25em;
		    -ms-border-radius: 0.25em;
		     -o-border-radius: 0.25em;
		        border-radius: 0.25em;
		background: #37aecd;
		background: -webkit-gradient(linear, left top, left bottom, from(#59c7e7), to(#37aecd));
		background: -webkit-linear-gradient(#59c7e7, #37aecd);
		background: -moz-linear-gradient(center top, #59c7e7 0%, #37aecd 100%);
		background: -moz-gradient(center top, #59c7e7 0%, #37aecd 100%);
		background: -ms-linear-gradient(#59c7e7, #37aecd);
		background: -o-linear-gradient(#59c7e7, #37aecd);
		background: linear-gradient(#59c7e7, #37aecd);
		filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#59c7e7,endColorstr=#37aecd);
		-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#59c7e7, endColorstr=#37aecd)";
		border: 1px solid #37aecd;
		-webkit-box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.25);
		   -moz-box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.25);
		    -ms-box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.25);
		     -o-box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.25);
		        box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.25);
	}
	.highlight-section a:hover {
		-webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
		   -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
		    -ms-box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
		     -o-box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
		        box-shadow: 0 0 4px rgba(0, 0, 0, 0.4);
	}

/* Section wrap */
	.wrap {
		padding: 30px 30px 0px 30px;
	}
	.wrap ul,
	.wrap li {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	.wrap h3 {
		border-bottom: 1px dashed #dadada;
		margin: 0 0 0.5em 0;
		padding: 0 0 0.8em 0;
		font-weight: normal;
	}
	.wrap .first,
	.wrap .second {
		margin-bottom: 2em;
	}
	.wrap .first ul {
		margin: 1.7em 1em;
		border-top: 1px dashed #E5E5E5;
	}
	.wrap .two p {
		margin: 1.7em 0;
	}
	.resources-section .two fieldset,
	.resources-section .two p {
		margin: 1.7em;
	}
	.wrap .first li {
		border-bottom: 1px dashed #E5E5E5;
		padding: 0.5em 0.7em;
	}
	.wrap ol.tags {
		margin: 1.7em 1em 1.7em 2em;
	}
	.wrap ol.tags li {
		margin: 2px 12px 2px 0px;
	}
	.wrap .first li a {
	}
	.wrap .first h2 {
		margin-top: 0;
		text-shadow: 0 -1px 1px rgba(255, 255, 255, 0.8);
	}
	.wrap .first p {
		padding: 0 0 2em 0;
		border-bottom: 1px dashed #bAbAbA;
	}

	.resources-section {
		background: #ececec url("/templates/sciu/images/layout/noise-lite.png");
		position: relative;
		z-index: 1;
	}
	.resources-section .two {
		background: #fff;
		position: relative;
		-webkit-box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.2);
		   -moz-box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.2);
		    -ms-box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.2);
		     -o-box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.2);
		        box-shadow: 0 0 0.25em rgba(0, 0, 0, 0.2);
	}
	.resources-section .two p {
		margin: 1.7em;
	}
	.resources-section h3 {
		padding: 0.8em 1em;
		border-bottom: 1px solid #E5E5E5;
		background: #f4f4f4;
	}

/* Events section */
	.events-section {
		background: #f9f9f9 url("/templates/sciu/images/layout/noise-lite.png");
		padding: 0;
		margin: 0;
	}
	.events-section .wrap {
		position: relative;
		display: block;
		margin: 0;
		z-index: 1;
	}
	.events-section .wrap .first,
	.events-section .wrap .second {
		margin-bottom: 0;
	}
	.events-section table.latest_events_tbl,
	.events-section table.latest_events_tbl td, 
	.events-section table.latest_events_tbl th {
		border: none;
	}

	/* Events */
	.events-section .mod_events_calendar {
		position: relative;
	}
	.events-section .mod_events_calendar caption {
		position: relative;
		border-bottom: 1px dashed #dadada;
		font-size: 1.6em;
		line-height: 1;
		padding: 0 0 0.8em 0;
		margin: 0;
		text-align: center;
		font-weight: normal;
		font-family: 'Share-Regular', 'RopaSansRegular', 'LacunaRegular', 'Impact', 'Arial Narrow', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	}
	.events-section .mod_events_calendar caption a {
		color: #555;
		border: none;
	}
	.events-section table.mod_events_calendar td {
		border-bottom: 1px solid #eee;
		text-align: center;
	}
	.events-section table.mod_events_calendar tr td:first-child,
	.events-section table.mod_events_calendar tr td:last-child {
		background-color: #f9f9f9;
	}
	.events-section table.mod_events_calendar tr td.daywithevents:first-child,
	.events-section table.mod_events_calendar tr td.daywithevents:last-child,
	.events-section table.mod_events_calendar .daywithevents {
		background-color: #f1f1f1;
	}
	.events-section table.mod_events_calendar .prev, 
	.events-section table.mod_events_calendar .next {
		display: block;
		width: 1em;
		height: 1em;
		font-size: 1em;
		line-height: 1em;
		overflow: hidden;
		border: none;
		position: absolute;
		top: 0;
		color: #bbb;
	}
	.events-section table.mod_events_calendar .prev {
		left: 0;
	}
	.events-section table.mod_events_calendar .next {
		right: 0;
	}
	.events-section table.mod_events_calendar .prev:hover, 
	.events-section table.mod_events_calendar .next:hover {
		border: none;
		color: #333;
	}
	.events-section table.mod_events_calendar .prev:before {
		font-family: 'Fontcons';
		content: '\f0a8';
		margin-right: 2em;
	}
	.events-section table.mod_events_calendar .next:before {
		font-family: 'Fontcons';
		content: '\f0a9';
		margin-right: 2em;
	}

	.event-date {
		width: 40px;
		text-align: center;
	}
	.events-section .event-date span.month {
		display: block;
		text-transform: uppercase;
		color: #fff;
		background-color: #555;
		border-color: #555;
		font-weight: bold;
		padding: 2px;
		font-size: x-small;
		text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.8);
		letter-spacing: 0.1em;
		-webkit-border-radius: 0.25em 0.25em 0 0;
		-moz-border-radius: 0.25em 0.25em 0 0;
		-ms-border-radius: 0.25em 0.25em 0 0;
		-o-border-radius: 0.25em 0.25em 0 0;
		border-radius: 0.25em 0.25em 0 0;
	}
	.event-date .upcoming {
		background: rgb(0, 104, 55);
		color: #f6f6f6;
	}
	.events-section .event-date span.day {
		display: block;
		padding: 2px;
		background-color: #f1f1f1;
		border: 1px solid #f1f1f1;
		line-height: 20px;
		letter-spacing: 0.1em;
		text-shadow: 0 1px 1px #fff;
		-webkit-border-radius: 0 0 0.25em 0.25em;
		   -moz-border-radius: 0 0 0.25em 0.25em;
		    -ms-border-radius: 0 0 0.25em 0.25em;
		     -o-border-radius: 0 0 0.25em 0.25em;
		        border-radius: 0 0 0.25em 0.25em;
	}
	.event-date {
		width: 40px;
		margin-right: 0.5em;
		margin-bottom: 1em;
		margin-top: 3px;
	}
	.event-headline {
		font-weight: normal;
		margin-left: 50px;
	}
	.event-headline .time {
		display: block;
	}

/* [!] Ie 7 */
	html.ie7 #welcome {
		*zoom:expression(this.runtimeStyle['zoom']='1', this.innerHTML='<small class="welcome-before"></small>' + this.innerHTML + '<small class="welcome-after">&#xf002;&nbsp;</small>');
	}
	html.ie7 small.welcome-before {
		*background: #b1c1ca;
	}
	html.ie7 small.welcome-after {
		*color: #b1c1ca;
		*line-height: 1;
		*top: 0.1em;
	}
	html.ie7 #features h3 {
		*padding-top: 30px;
	}