/**
 *---------------------------------------------------------
 * Front stylesheet (Homepage styles)
 *---------------------------------------------------------
 * Author: Kris Kelly, Bri Ward
 * Date: May 2014
 *
 */


#main .pure-g{
    display:block;
}

.field-name-field-body{
        letter-spacing: normal;
        width:100%;
}
.field-name-field-body,
.field-name-field-view{
        display:block;
        float:left;
}
.field-name-field-view{
        clear:left;
}
.field-name-field-body > div{
        padding-right:20px;
}
.field-name-field-content-highlights{
        /*float:right;*/
        display:inline-block;
}

/**
 *---------------------------------------------------------
 * header slideshow styles (mobile first)
 *---------------------------------------------------------
**/
	#header-slideshow-container {
		position: relative;
		z-index: 1;
		display: block;
		background-color: #7B015B; /* create a darker background for fade transitions between slides*/
	}

	#header-slideshow,
	#header-slideshow * {

		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-ms-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}
	#header-slideshow {
		height: 22em;
		overflow: hidden;
		position: relative;
		z-index: 1;
	}

	#header-slideshow-nav-container {
		position: absolute;
		top: 15%;
		width: 100%;
		z-index: 10;
	}

		#header-slideshow-nav {
			margin: 0 auto;
			max-width: 1370px;
			width: 100%;
		}
			#header-slideshow-next,
			#header-slideshow-prev {
				background-repeat: no-repeat;
				width: 32px;
				height: 57px;
				background-color: transparent;
				border: none;
				padding: 0;
			}

			#header-slideshow-next {
				background-image: url('../images/home/slideshow/btn-next.png');
				float: right;
				-webkit-background-size: 50%;
				background-size: 50%;
				background-position: 100% 0;
				margin-right:28px;
			}

			#header-slideshow-prev {
				background-image: url('../images/home/slideshow/btn-prev.png');
				-webkit-background-size: 50%;
				background-size: 50%;
				margin-left:28px;
			}
	#header-slideshow .slide {
		background-size: contain;
		background-position: 50% 0;
		background-repeat: no-repeat;
		min-height: 615px;
		position: absolute;
		width: 100%;
	}
	.slide {
		opacity: 0;
	}
	.slide.first {
		opacity: 1;
	}
		#header-slideshow .slide .slide-inner {
			margin: 0 auto;
			max-width: 1140px;
		}


			#header-slideshow .slide .slide-text {
				margin-top: 9.5em;
				background-color: #7b0154;
				color: #fff;
				border-radius: 0;
				width: 100%;
				min-height: 250px;
				text-align: center;
				/*background-image: url('../images/home/slideshow/logo.png');*/
				/*background-image: url('../images/home/slideshow/panel-logo.gif');*/
				background-position: 50% 90%;
				background-repeat: no-repeat;

				-webkit-transition: margin 0.5s ease;
				-moz-transition: margin 0.5s ease;
				-ms-transition: margin 0.5s ease;
				-o-transition: margin 0.5s ease;
				transition: margin 0.5s ease;
				margin-left: 0;
			}


				#header-slideshow .slide .slide-text .inner {
					padding: 2rem;
				}
				#header-slideshow .slide .slide-text a,
				#header-slideshow .slide .slide-text h1,
				#header-slideshow .slide .slide-text h2,
				#header-slideshow .slide .slide-text h3,
				#header-slideshow .slide .slide-text h4,
				#header-slideshow .slide .slide-text h5 {
					color: #fff;
				}

				#header-slideshow .slide .slide-text a {
					text-decoration: underline;
				}


	#header-slideshow-nav-container {

		position: absolute;
	}
		#header-slideshow-pages-container-inner {

			margin: 0 auto;
			width: 100%;
		}
#header-slideshow-pages {
	display: none;
}

/**
 *---------------------------------------------------------
 * Call to action
 *---------------------------------------------------------
 */

@media screen and (min-width: 48em) { /* medium  or larger */
	.field-name-landing-page-call-to-action {
		position: relative;
		height: 1px;
		display: block;
		width: 100%;
	}

		.view-call-to-action {
			/*position: absolute;
			top: 58px;*/
			width: 100%;
		}
	#footer-wrapper {/* shift the footer down to compensate for the CTA */
		padding-top: 3rem;
	}
    .field-name-field-body{
            letter-spacing: normal;
            width:50%;
    }


}

/**
 *---------------------------------------------------------
 * small or larger (i.e. tablet -> desktop)
 *---------------------------------------------------------
 */

@media screen and (min-width: 35.5em) {

	#header-slideshow {
		height: 415px;
		overflow: hidden;
		position: relative;
		z-index: 1;
	}

		#header-slideshow .slide {
			background-size: cover;
			background-position: 50% 50%;
			min-height: 415px;
		}

			#header-slideshow .slide .slide-text {
				background-color: #7B0155;
				background-color: rgba(123,1,85,0.9);
				border-radius: 50%;
				height: 290px;
				line-height: 1.25em;
				margin-top: 20px;
				width: 290px;
				margin-left: 2em;
			}

				#header-slideshow .slide .slide-text .inner {
					padding: 4em 3em 2em;
					padding: 4rem 3rem 2rem;
				}

	#header-slideshow-nav-container {
		top: 40%;
	}

		#header-slideshow-prev,
		#header-slideshow-next {
			-webkit-background-size: auto;
			background-size: auto;
		}
	#header-slideshow-pages {
		text-align: center;
		display: inline-block;
		width: 100%;
		margin: 0;
		padding: 0;
	}

	#header-slideshow-pages-container {
		bottom: 20px;
		position: absolute;
		width: 100%;
		z-index: 10;
	}

			#header-slideshow-pages .page {
				width: 45px;
				height: 45px;
				-webkit-transition: all 0.5s ease;
				-moz-transition: all 0.5s ease;
				-ms-transition: all 0.5s ease;
				-o-transition: all 0.5s ease;
				transition: all 0.5s ease;
				margin: 0 12px 0 0;

				background-color: #000;
				color: #fff;
				border-radius: 50%;
				border: none;
				padding: 0;
				background-position: 50% 50%;

			}
				#header-slideshow-pages .pure-slideshow-active .page {
					background-color: #7b0154;
					-webkit-box-shadow: 1px 1px 6px #000   ;
					-moz-box-shadow: 1px 1px 6px #000   ;
					box-shadow: 1px 1px 6px #000   ;
					-webkit-transition: box-shadow 0.5s;
					-moz-transition: box-shadow 0.5s;
					-ms-transition: box-shadow 0.5s;
					-o-transition: box-shadow 0.5s;
					transition: box-shadow 0.5s;
				}

	#header-slideshow-pages .page {
		-webkit-background-size: 50%;
		background-size: 50%;
	}

	#header-slideshow-pages .page.item_type_research {
		-webkit-background-size: 40%;
		background-size: 40%;
	}
	/**
	 *---------------------------------------------------------
	 * Homepage slideshow icons
	 *---------------------------------------------------------
	 */

	#header-slideshow-pages .page.item_type_welcome {
		background-image: url('../images/home/slideshow/icons/crm-logo.png');
	}

	#header-slideshow-pages .page.item_type_research {
		background-image: url('../images/home/slideshow/icons/clipboard.png');
	}

	#header-slideshow-pages .page.item_type_students {
		background-image: url('../images/home/slideshow/icons/mortar-board.png');
	}

	#header-slideshow-pages .page.item_type_collaboration {
		background-image: url('../images/home/slideshow/icons/people.png');
	}

	#header-slideshow-pages .page.item_type_public {
		background-image: url('../images/home/slideshow/icons/speech-bubbles.png');
	}

	#header-slideshow-pages .page.item_type_building {
		background-image: url('../images/home/slideshow/icons/building.png');
	}

	#header-slideshow-pages .page.item_type_news {
		background-image: url('../images/home/slideshow/icons/megaphone.png');
	}

	#header-slideshow-pages .page.item_type_events {
		background-image: url('../images/home/slideshow/icons/calendar.png');
	}


}
/**
 *---------------------------------------------------------
 * small or larger
 *---------------------------------------------------------
 */

@media screen and (min-width: 35.5em) {
	.view-seminars {
		padding-right: 1em;
	}

}

/**
 *---------------------------------------------------------
 * large or larger
 *---------------------------------------------------------
 */
@media screen and (min-width: 48em) {


	#header-slideshow-pages-container-inner {
		max-width: 71.25em;
	}


	#header-slideshow-pages .page {
		width: 67px;
		height: 67px;
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		-ms-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
		margin: 0 24px 0 0;
	}
}

/**
 *---------------------------------------------------------
 * break point for when window size would make nav arrows overlap text circle on slideshow
 *---------------------------------------------------------
 */

@media screen and (min-width: 78.25em) {

	#header-slideshow-pages .page {
		height: 70px;
		width: 70px;
		-webkit-background-size: 50%;
		background-size: 50%;
	}

	#header-slideshow-pages .page.item_type_research {
		-webkit-background-size: 40%;
		background-size: 40%;
	}
}
/**
 *---------------------------------------------------------
 * break point for when window size would make nav arrows overlap text circle on slideshow
 *---------------------------------------------------------
 */

@media screen and (min-width: 35.5em) and (max-width: 78.25em) {

	#header-slideshow .slide .slide-text {
		-webkit-transition: margin 0.5s ease;
		-moz-transition: margin 0.5s ease;
		-ms-transition: margin 0.5s ease;
		-o-transition: margin 0.5s ease;
		transition: margin 0.5s ease;
		margin-left: 5em;
		margin-left: 5rem;
	}
}
/**
 *---------------------------------------------------------
 * break point for small desktop or some tablets landscape
 *---------------------------------------------------------
 */
 @media screen and (min-width: 48em) and (max-width: 64em) {
	 #main-content #new-and-noted-slideshow img {
		 width: 100%;
		 height: auto;
	 }

 }
