/* FEATURE PANEL - HOMEPAGE V3 MEDIA AND NUMBERS BASE */
/* NAME: homepage-V3-nine-three-numbers-base.css */
/* LOCATION: http://luc.edu/media/home/stylesheets/ */

/* NOTE: The base presentation is QUOTE - NUMBERS on a 9 column - 3 column layout */

#feature-panel { width: 100%; }  /* main wrapper */

#feature-panel .container.container-padding { padding: 60px 0; border-bottom: solid 1px #cccccc; }

.features-wrapper-one { /* wrapper for the left column - full width - parent */
	position: relative;
	right: 0%;
	background: #eeeeee;
	overflow: hidden;
}

.features-wrapper-two { /* wrapper for the right column - full width - offset right 30% - nested child */
	position: relative;
	right: 30%;
	margin-right: 3%;
	background: #eeeeee;
}

.column-equal-one {  /* wrapper for the left column - full width - offset left 30% */
	position: absolute;
	top: 0;
	bottom: 0;
	float: left;
	margin-right: 3%;
	left: 30%; width: 70%;
	background: #ffffff;
}

.column-equal-two { /* wrapper for the left column - full width - float right */
	float: right;
	position: relative;
	left: 30%;
	display: table-cell;
	bottom: 0;
	width: 27%;
}

.column-spacer { /* spacer between column-equal-one and column-equal-two */
	position: absolute;
	right: 27%;
	content: ".";
	width: 3%;
	min-width: 3%;
	max-width: 3%;
	height: 100%;
	color: #ffffff;
	background: #ffffff;
}

.column-equal-one h4, #column-equal-two h4 {
	display; block;
	margin: 0;
	padding: 15px 0 0 0;
	width: 100.24%;
}

.column-equal-two h4 {
	padding: 15px 0 24px 0;
	background: #ffffff;
}

.homepage-features-content { /* wrapper for html-content of column-equal-one and column-equal-two */
	position: relative;
	margin: 0;
	padding: 30px 9.09%;
	background: #eeeeee;
}

.column-equal-one .homepage-features-content {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	padding: 30px 3.663%;
	width: 92.674%;
}

.column-equal-two .homepage-features-content {
	display: block;
	margin: 0;
	padding: 30px 11.7647%;
	width: 76.4706%;
/*	border-bottom: solid 1px #aaaaaa;
*/}

.homepage-features-content .content-wrapper:first-child {
	margin: 0;
}

.column-equal-one .homepage-features-content a {
	position: absolute;
	top: 30px;
	bottom: 0;
	display: inline-block;
	margin: 0;
	padding: 0;
	width: 100%;
	border-bottom: 0 none;
	overflow: hidden; 
}

.column-equal-two .homepage-features-content .content-wrapper {
	margin: 20px 0 0 0;
	padding: 0 0 20px 0;
	border-bottom: solid 1px #cccccc;
}

.column-equal-two .homepage-features-content .content-wrapper:first-child { margin: 0; }

.column-equal-two .homepage-features-content a,
.column-equal-two .homepage-features-content a img { display: none; }


/* image - typography */

.content-wrapper img { margin: 0; padding: 0; }

.column-equal-one img {
	position: absolute;
	left: 30px;
	top: 0;
	margin: 0;
	padding: 0;
	width: 31%;
	height: auto;
}

.column-equal-one p.content-title,
.column-equal-one p.content-body,
.column-equal-one p.content-readout { float: right; margin: 0 3% 0 0; padding: 0; width: 57%; }

.content-title, .content-body, .content-readout {
	font-family: "Antenna Light", sans-serif;
	font-weight: normal;
	font-style: normal;
	letter-spacing: -.075em;
}

.column-equal-two .homepage-features-content p.content-body {
	margin: 0;
	padding: 0;
	font-family: "Antenna Light", sans-serif;
	font-size: 3.5vw;
	font-weight: normal;
	font-style: normal;
	line-height: 55px;
	letter-spacing: -0.05em;
	color: #525252;
	width: auto;
}

.content-title {
	font-family: "Antenna Bold", sans-serif;
	font-size: 1.45em;
	font-weight: normal;
	font-style: normal;
	line-height: 1.25;
	letter-spacing: .015em;
}

.column-equal-two .homepage-features-content .content-title { font-size: 1.15em; }

.column-equal-two .homepage-features-content img { display: none; }

.content-readout {
	margin: 5px 0 0 0;
	padding: 0;
	width: 80%;
	font-size: .875em;
	font-weight: normal;
	font-style: normal;
	line-height: 1.45;
	letter-spacing: .05em;
	color: #525252;
	text-align: left;
	text-transform: uppercase;
}

/* ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||  FO turn off mobile head   ||||||||||||||||||||||||||||||||||||||||
=================================================================================================================================

html.wf-museosans-n3-active.wf-museosans-n5-active.wf-museoslab-n5-active.wf-museoslab-n7-active.wf-minionpro-n4-active.wf-myriadpro-n7-active.wf-myriadpro-n4-active.wf-active body.subsite.backstretch.home.no-touch div.main div#feature-panel.fullbleed div.container.container-padding div#home-nine-three-gallery.row.alpha.override div.span12.alpha.features-wrapper-one div.span12.alpha.features-wrapper-two div.column-equal-two div.homepage-features-content div.content-wrapper h4.mobile-head {
	display:none !important;
}
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
=================================================================================================================================
*/


/* ====================================================
MEDIA QUERIES
==================================================== */

@media ( max-width: 980px ) {

.features-wrapper-one,
.features-wrapper-two,
.homepage-features-content,
.column-equal-one,
.column-equal-two,
.column-equal-one a,
.column-equal-two,
.column-equal-one .homepage-features-content,
.column-equal-two .homepage-features-content {  /* overrides all positions to relative and adds float left */
	position: relative;
	display: block;
	float: left;
	width: 100%;
}

.features-wrapper-one, .features-wrapper-two { background: #ffffff; }

.features-wrapper-two { right: 0; margin: 0; }

.column-equal-one, .column-equal-two { left: 0; }

.column-equal-one .homepage-features-content,
.column-equal-two .homepage-features-content { padding: 30px 3%; width: 94%; } /* switches padding to .homepage-features-content */

.column-equal-one .homepage-features-content a { position: relative; top: 0; }

.column-equal-one p.content-title,
.column-equal-one p.content-body,
.column-equal-one p.content-readout { float: left; margin: 0 0 0 3%; }

.column-equal-one p.content-body { margin: 20px 0 20px 3%; }

.column-spacer { display: none; }

.column-equal-one { margin: 0 0 30px 0; }

.column-equal-one img { position: relative; float: left; left: 0; }

.column-equal-one .homepage-features-content { width: 96%; height: 350px; overflow: hidden; }

.column-equal-two .homepage-features-content { /*adjusts stacked content in right column - column-equal-two */
	display: block;
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	min-width: 100%;
	max-width: 100%;
	border-bottom: 0 none;
	border-left: 0 none;
}

.column-equal-two .homepage-features-content .content-wrapper:first-of-type {
	border-left: 0;
	margin: 0;
	padding: 0;
}



/* typography - adjustments */

.column-equal-two .homepage-features-content p.content-body { margin-top: -8px; font-size: 5vw; }

.column-equal-two .homepage-features-content p.content-readout { width: 100%; }

}

/* ====================================================
MEDIA QUERIES
==================================================== */

@media ( max-width: 980px ) {

.column-equal-two .homepage-features-content p.content-body {	font-size: .95em; }




/*  ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| FO attempt at creating h4 on mobile only ||||||||||||||||||||||||||||||||||
===============================================================  NOT working at all                      ==================================

html.wf-museosans-n3-active.wf-museosans-n5-active.wf-museoslab-n5-active.wf-museoslab-n7-active.wf-minionpro-n4-active.wf-myriadpro-n7-active.wf-myriadpro-n4-active.wf-active body.subsite.backstretch.home.no-touch div.main div#feature-panel.fullbleed div.container.container-padding div#home-nine-three-gallery.row.alpha.override div.span12.alpha.features-wrapper-one div.span12.alpha.features-wrapper-two div.column-equal-two div.homepage-features-content div.content-wrapper h4 {
	display:block !important;	
	font-family: 'Antenna Black', sans-serif !important;
    font-size: 1.55em !important;
    font-weight: normal !important;
    font-style: normal !important;
    text-transform: uppercase !important;
	background-color:#eeeeee !important;
}
*/
}


@media ( max-width: 736px ) {

#feature-panel .container.container-padding { padding: 15px 0 0; border-bottom: 0 none;}

.column-equal-two .homepage-features-content {
	display: block;
	float: left;
	margin: 20px 0 0;
	padding: 0;
	width: 100%;
	min-width: 100%;
	max-width: 100%;
	border-left: 0 none;
}

.column-equal-two .homepage-features-content p.content-body {
	margin: 10px 0;
	font-size: 9vw;
}

}


@media ( max-width: 568px ) {

#tiertwo #newsfeatures { margin-bottom: 40px; } /* adjusts padding on news-features panel */

.column-equal-two .homepage-features-content p.content-body { font-size: 12vw; line-height: 32px; }

}