@charset "utf-8";
/* CSS Document */

/*.hero {
    background: url("../img/bg/background.jpg") repeat scroll 0 0 / cover transparent;
    height: 257px;
    width: 100%;
}*/


/*------ VIDEO/HERO CSS --------*/

.hero {
	min-height: 505px;
	background: url("../img/bg/home.jpg") repeat scroll 50% 0 transparent;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	background-size:cover;
	max-height:595px;
	overflow:hidden;
	-webkit-box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, .3);
	box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, .3);
}
.video {
	display:none;
	position: relative;
	height: 595px;
	overflow: visible !important;
}
.videoFF {
	display:none;
}
.video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	height:595px
}
.controls {
    position: relative;
    width: 100%;
}
.controls .play, .controls .play.FF {
    left: 50%;
    margin-left: -80px;
    position: absolute;
	top:227px;
	cursor:pointer;
}
.controls .play.FF {
	display:none !important;
}
.controls .play img, .controls .play.FF img {
    height: 160px;
    width: 160px;
}

/*------ FIREFOX VIDEO HACK --------*/


@-moz-document url-prefix() {
	.controls .play, non-FF{
	display:none !important;
	}
	.controls .play.FF {
		display:block !important;
	}
	#video {
		display:none;
		position: relative;
		height: 595px;
		overflow: visible !important;
	}
	#video iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		height:595px
	}
}

/*------ IE10 VIDEO HACK /EARLIERS VERSION HACKS IN CONDITIONALS --------*/
html[data-useragent*='MSIE 10.0'] .controls .play, non-FF{
	display:none !important;
}
html[data-useragent*='MSIE 10.0'] .controls .play.FF {
	display:block !important;
}
html[data-useragent*='MSIE 10.0'] #video {
	display:none;
	position: relative;
	height: 595px;
	overflow: visible !important;
}
html[data-useragent*='MSIE 10.0'] #video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	height:595px
}
/*------ END HACKS --------*/

.closeVideo {
    margin-left:-50px;
    position: absolute;
	cursor:pointer;
}

/*------ END VIDEO CSS --------*/
.title {
	position:absolute;
	width:100%;
	max-width:1060px;
	margin-top:90px

}
.title h4 {
	font-weight:300;
	color:#ffffff;
	text-transform:uppercase;
	/*font-size:65px;*/
	font-size:52px;
	text-align:center;


}
html[data-useragent*='MSIE 10.0'] .title h4 {
	font-size:51px;
}
html[data-useragent*='MSIE 9.0'] .title h4 {
	font-size:51px;
}
.title p {
    color: #FFFFFF;
    font-size: 22px;
    font-weight: 300;
    margin-top: 10px;
    text-align: center;
}
.sub .hero {
	background: url("../img/bg/background.jpg") 50% 0 no-repeat fixed #2C2D2E;
	height: 257px;
	min-height: 257px;
	max-height: 257px;
	margin: 0 auto;
    width: 100%;
 	overflow:visible;
   -webkit-background-size: auto;
 -moz-background-size: auto;
 -o-background-size: auto;
 background-size: auto;
}

@media only screen and (min-width: 1920px){
	.sub .hero {
		-webkit-background-size: 100% auto;
		 -moz-background-size: 100% auto;
		 -o-background-size: 100% auto;
		 background-size: 100% auto;
	}
}

#headline {
	 background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/bg/stripeBG.jpg") repeat scroll 0 0 transparent;
	 margin-bottom:28px;
}
#headline h1 {
    color: #2C2D2E;
    font-size: 2.46em;
    font-weight: 600;
    line-height: 56px;
    text-transform: uppercase;
}
h1 span {
    color: #9B9B9B;
    font-style: italic;
    font-weight: 400;
    text-transform: lowercase;
}
#contentContainer {
	margin-bottom:30px;
}
#colLeft h4 {
	font-weight:400;
	color: #4c96d2;
	font-size: 36px;
}
.fullWidth {
    background: none repeat scroll 0 0 #EEEFF0;
}
.fullWidth h2 {
    background: none repeat scroll 0 0 #EFF0F1;
    color: #2C2D2E;
    font-size: 30px;
    font-weight: 300;
    min-height: 49px;
    padding-top: 6px;
    text-transform: uppercase;
}

/*---- FEATURED AREA START ---*/
.featuredContainer {
	margin: auto;
	width: 1080px;
}
#featured {
	height:379px;
	background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/bg/featured.jpg") 50% 0 no-repeat #2C2D2E;
	-webkit-box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, .3);
	box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, .3);
	padding-top: 26px;
}

@media only screen and (min-width: 1440px){
	#featured  {
		-webkit-background-size: 100% auto;
		 -moz-background-size: 100% auto;
		 -o-background-size: 100% auto;
		 background-size: 100% auto;
	}
}

.item {
	height:319px;
	background: #ffffff;
	margin: 0 10px;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, .3);
	box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, .3);
}
.item img {
	width:100%;
	margin-top:-25px;
}
.itemText {
	padding: 10px;
}
.item h5{
	text-align:center;
	font-size:22px;
	color: #2c2d2e;
	font-weight:500;
	padding-bottom: 10px;
}
.item p {
    color: #5D5D5D;
    font-size: 15px;
    padding-bottom: 10px;
    text-align: center;
}
.item .more {
    top: 284px;
    position: relative;
}

.item .more p {
    background: none repeat scroll 0 0 #4C96D2;
    color: #FFFFFF;
    line-height: 25px;
    margin: 0 10px;
    padding-bottom: 0;
    width: auto;
}

/*---- FEATURED AREA END ---*/



#programs {



}

/*---- ANIMATED HEADER START ---*/
	#stickyNav {
		display:none;
		width:250px;
		margin-left: 810px;
		z-index: 50;

	}
	#headlineScroll {
		display:none;
	}

@media only screen and (min-width: 750px){
	#headlineScroll {
		 background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/bg/stripeBG.jpg") repeat scroll 0 0 transparent;
		 margin-bottom:28px;
	}
	#headlineScroll h1{
		color: #2C2D2E;
		font-size: 29px;
		font-weight: 600;
		line-height: 56px;
		text-transform: uppercase;
	}
	#headlineScroll.ha-header {
		/*position: fixed;
		top: 0;
		left: 0;*/
		width: 100%;
		/*padding: 0;*/
		z-index: 50;
		-webkit-transform: translateY(0%);
		-moz-transform: translateY(0%);
		transform: translateY(0%);

	}
	#headlineScroll.ha-header-normal {
		display:none;
	}

	#headlineScroll.ha-header-hide {
		top:0;
		margin-top: -5000px;
		position:fixed;
		display:block;
		opacity:0;
	}

	#headlineScroll.ha-header-margin {
		display:block;
		position:fixed;
		top:0;
		margin-top: -56px;
		-webkit-transition: all 0.8s;
		-moz-transition: all 0.8s;
		transition: all 0.8s;
		opacity:0;
	}

	#headlineScroll.ha-header-show {
		opacity:1;
		display:block;
		margin-top: 0;
		position:fixed;
		top:0;
		-webkit-box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, .3);
		box-shadow: 0px 3px 5px 0px rgba(0, 0, 0, .3);
		-webkit-transform: translateY(0%);
		-moz-transform: translateY(0%);
		transform: translateY(0%);
		-webkit-transition: all 0.8s;
		-moz-transition: all 0.8s;
		transition: all 0.8s;
	}
	#headlineScroll.ha-header-hide h1, #headline.ha-header-margin h1, #headline.ha-header-show h1  {
		/*-webkit-transition: all .2s ease;
		-moz-transition: all .2s ease;
		-o-transition: all .2s ease;
		transition: all .2s ease;*/
		font-size: 29px;

	}
	#headlineScroll.ha-header-show h1  {
		/*font-size: 29px;
		-webkit-transition-delay: .4s;
		-moz-transition-delay: .4s;
		-o-transition-delay: .4s;
		transition-delay: .4s;*/

	}


	#stickyNav h3 {
		font-size:29px;
		line-height:40px;
		min-height: 40px;
		color: #4c96d2;
		background: none repeat scroll 0 0 #FFFFFF;
		padding: 0 5px 0 20px;
		margin: 8px 0;
		border-left: 10px solid #4c96d2;
		text-transform: uppercase;
		font-weight:500;


	}
	#stickyNav h3 span{
		background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/linksClose.png") no-repeat scroll 0 0 transparent;
		height:30px;
		width:30px;
		display:inline-block;
		float:right;
		margin-top:5px;
	}
	#stickyNav h3.linksOpen span{
		background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/linksOpen.png") no-repeat scroll 0 0 transparent;
	}

	#stickyNav ul{
		background: none repeat scroll 0 0 #4c96d2;
		display:none;
		-webkit-box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.3);
		box-shadow: 0 3px 5px 0 rgba(0, 0, 0, 0.3);
		z-index:40;

	}


	#stickyNav li{
		background: none repeat scroll 0 0 #DEE1E4;
		border-bottom: 1px solid #ffffff;
		line-height: 39px;
		padding: 0 20px;
	}
	#stickyNav a li{
		color: #2c2d2e;

	}
	#stickyNav li a{
		color: #2c2d2e;

	}
	#stickyNav li:hover {
		margin-left:10px;
		-webkit-transition: all .2s ease;
		-moz-transition: all .2s ease;
		-o-transition: all .2s ease;
		transition: all .2s ease;

	}


	#stickyNav.ha-nav {

		-webkit-transform: translateY(0%);
		-moz-transform: translateY(0%);
		transform: translateY(0%);
		opacity:0;
	}
	#stickyNav.ha-nav.ha-header-hide {

	}

	#stickyNav.ha-nav.ha-header-margin {
		display:block;
		position:fixed;
		top:0;
		margin-top: -500px;
		overflow:hidden;
		-webkit-transition: all 0.5s;
		-moz-transition: all 0.5s;
		transition: all 0.5s;
	}
	#stickyNav.ha-nav.ha-header-margin ul{
		display:none;
	}
	#stickyNav.ha-nav.ha-header-show {
		opacity:1;
		display:block;
		margin-top: 0px;
		position:fixed;
		top:0;
		/*overflow:hidden;*/
		-webkit-transition: all .8s ease;
		-moz-transition: all .8s ease;
		transition: all .8s ease;
		cursor: pointer;
	}
}

/*---- ANIMATED HEADER END ---*/
	#academicPrograms {
		position:absolute;
		margin-top:-140px;

	}
/*---- SCHOOL ICONS START ---*/


@font-face {
	font-family: 'ecoicon';
	src:url('../icons/icomoon.eot');
	src:url('../icons/icomoon.eot?#iefix') format('embedded-opentype'),
		url('../icons/icomoon.woff') format('woff'),
		url('../icons/icomoon.ttf') format('truetype'),
		url('../icons/icomoon.svg#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}


#schoolIcons {
    margin-top: 5px;
    margin-bottom: 60px;
}
#schoolDesc {
  float: left;

  line-height: 18px;
  margin: 70px 0 auto;
  max-width: 250px;
  padding-left: 20px;
}
#schoolDesc p {
  color: #9B9B9B;
  font-size: 14px;
}
#schoolDesc a{
	color: #4C96D2;
}
.hi-icon-wrap {
    border-right: 1px solid #DCDFE2;
    float: left;
    padding: 24px 22px 24px 0;
}
.hi-icon {
	display: inline-block;
	cursor: pointer;
	margin: 0px 18px;
	width: 217px;
	height: 217px;
	border-radius: 50%;
	text-align: center;
	position: relative;
	z-index: 1;
	color: #fff;
}

.hi-icon p {
    color: #FFFFFF;
    margin-top: 15px;
}

.hi-icon:after {
	pointer-events: none;
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	content: '';
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}

.hi-icon:before {
	font-family: 'ecoicon';
	speak: none;
	font-size: 90px;
	line-height: 90px;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	display: block;
	padding-top: 23px;
	-webkit-font-smoothing: antialiased;

}
.hi-icon-cog:before {
	content: "\e001";
}

.hi-icon-clock:before {
	content: "\e000";
}
.hi-icon-effect-2 .hi-icon {
	color: #ffffff;
	box-shadow: 0 0 0 4px #4c96d2;;
	-webkit-transition: color 0.3s;
	-moz-transition: color 0.3s;
	transition: color 0.3s;
}

.hi-icon-effect-2 .hi-icon:after {
	top: -8px;
	left: -8px;
	padding: 8px;
	z-index: -1;
	/*background: #4c96d2;*/
	background: none repeat scroll 0 0 #8EB7D9;
	-webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
	-moz-transition: -moz-transform 0.2s, opacity 0.2s;
	transition: transform 0.2s, opacity 0.2s;
}

/* Effect 2a */
/*.no-touch .hi-icon-effect-2a */.hi-icon:hover {
	color: #ffffff;
}

/*.no-touch .hi-icon-effect-2a */.hi-icon:hover:after {
	-webkit-transform: scale(0.85);
	-moz-transform: scale(0.85);
	-ms-transform: scale(0.85);
	transform: scale(0.85);
	background: #4c96d2;
}






/*---- SCHOOL ICONS END ---*/

dl {
	/*float:left;*/
	font-size: 15px;
	margin-bottom:20px;

}
dt {
  clear: left;
  float: left;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  /*white-space: nowrap;*/
  width: 50%;
}
dd {
  margin-bottom: 10px;
  margin-left: 50%;
  width: 50%;
}
.col2 {
	float:left;
	width:50%;
	padding-right:10px;
}
.col2 h1, .col1 h1{
	font-size:24px;
	margin-bottom:10px;
}
.col2 p, .col1 p{
	font-size: 15px;
	margin-bottom:10px;
}
.col1 h2 {
  color: #4C96D2;
  font-size: 20px;
  margin-bottom: 15px;
}
hr {
	margin:10px 0;
}


/* FIRST BREAKPOINT - LANDSCAPE TABLET */
/* ----------------------------------------------------------------------------------------------------------------- */

/* ----------------------------------- WIDTH of 1150px ------------------------------------------------------------- */

/* ----------------------------------------------------------------------------------------------------------------- */
@media only screen and (max-width: 1150px){

	#headline h1 {
		font-size: 33.4px;
	}
	/*------ VIDEO/HERO CSS --------*/

	.hero {
		max-height: 505px;
	}
	#video, .video {
		height:505px;
	}
	#video iframe, .video iframe {
		height:505px;
	}
	/*------ IE10 VIDEO HACK /EARLIERS VERSION HACKS IN CONDITIONALS --------*/
	html[data-useragent*='MSIE 10.0'] #video {
		height:505px;
	}
	html[data-useragent*='MSIE 10.0'] #video iframe {
		height:505px;
	}
	.title {
		max-width: 900px;
	}
	.title h4 {
		font-size: 44px;
	}
	html[data-useragent*='MSIE 10.0'] .title h4 {
		font-size:44px;
	}

	/*------ VIDEO/HERO CSS END --------*/


	/*---- FEATURED AREA START ---*/
	.featuredContainer {
		margin: auto;
		width: 920px;
	}


	/*---- FEATURED AREA END ---*/


	/*---- ANIMATED HEADER START ---*/

		#headlineScroll.ha-header-hide h1, #headlineScroll.ha-header-margin h1, #headlineScroll.ha-header-show h1  {
			font-size: 24px;
		}
		#stickyNav {
			margin-left: 650px;
		}
		#stickyNav H3 {
			font-size: 24px;
		}


	/*---- ANIMATED HEADER END ---*/

	/*---- SCHOOL ICONS START ---*/
	#schoolIcons {
		/*margin-top:80px;*/
		width:511px;
	}
	.hi-icon-wrap {
		border-right: none;
		padding: 0;
		float:none;
	}
	#schoolDesc {
		float: none;
		max-width: 511px;
		padding: 0px;
		margin: 40px 0 auto;
		text-align:center;
	}



	/*---- SCHOOL ICONS END ---*/

}
@media only screen and (max-width: 1000px){
	.closeVideo {
		margin-left:0px;
		z-index:1;
	}

}


/* SECOND BREAKPOINT - PORTRAIT TABLET */
/* ----------------------------------------------------------------------------------------------------------------- */

/* ----------------------------------- WIDTH of 950px ------------------------------------------------------------- */

/* ----------------------------------------------------------------------------------------------------------------- */


@media only screen and (max-width: 950px){

	#headline h1 {
		font-size: 26px;
	}


	/*------ VIDEO/HERO CSS START --------*/

	.hero {
		min-height: 311px;
	}
	.hero {
		max-height: 392px;
	}
	#video, .video {
		height:392px;
	}
	#video iframe, .video iframe {
		height:392px;
	}
	html[data-useragent*='MSIE 10.0'] #video {
		height:392px;
	}
	html[data-useragent*='MSIE 10.0'] #video iframe {
		height:392px;
	}

	.title {
		max-width: 700px;
		margin-top: 35px;
	}
	.title h4 {
		font-size: 34px;
	}
	html[data-useragent*='MSIE 10.0'] .title h4 {
		font-size:34px;
	}

	.title p {
		color: #FFFFFF;
		font-size: 18px;
		font-weight: 300;
		text-align: center;
	}
	.controls .play, .controls .play.FF {
		height: 130px;
		margin-left: -65px;
		top: 145px;
		width: 130px;
	}
	.controls .play img, .controls .play.FF img{
		height: 130px;
		width: 130px;
	}
	.closeVideo {
		margin-left:-50px;

	}
	.closeVideo img{
		width:50px;
		height:50px;
	}

	/*------ VIDEO/HERO CSS END --------*/


	/*---- FEATURED AREA START ---*/
	.featuredContainer {
		margin: auto;
		width: 720px;
	}

	/*---- FEATURED AREA END ---*/

	/*---- ANIMATED HEADER START ---*/

		#headlineScroll.ha-header-hide h1, #headlineScroll.ha-header-margin h1, #headlineScroll.ha-header-show h1  {
			font-size: 16px;
		}
		#stickyNav {
			margin-left: 450px;
		}
		#stickyNav h3 {
			font-size: 16px;
		}
		#stickyNav li {
			font-size: 14px;
		}


	/*---- ANIMATED HEADER END ---*/
	/*---- SCHOOL ICONS START ---*/
	#schoolIcons {
		/*margin-top:100px;*/
		width:inherit;
	}
	.hi-icon-wrap {
		border-right: none;
		padding: 0;
		float:none;
		min-height:220px;
		/*margin-left:-10px;*/
	}
	#schoolDesc {
		display:none;
	}
	.hi-icon {
		margin:0 16px;
		width: 180px;
		height: 180px;

	}
	.hi-icon p{
		margin-top:65px;
		color: #9b9b9b;
	}
	.hi-icon:hover p {
		color: #4c96d2;
	}
	.hi-icon-effect-2 .hi-icon:after {
	top: -6px;
	left: -6px;
	padding: 6px;
	}

	.hi-icon-effect-2 .hi-icon {
		color: #ffffff;
		box-shadow: 0 0 0 2px #4c96d2;
		-webkit-transition: color 0.3s;
		-moz-transition: color 0.3s;
		transition: color 0.3s;

	}
	.hi-icon:before {

	font-size: 100px;
	line-height: 100px;

	padding-top: 50%;
	margin-top:-50px

}
#programs {
		display:block;
	}


	/*---- SCHOOL ICONS END ---*/

}
@media only screen and (max-width: 800px){
	.closeVideo {
		margin-left:0px;
		z-index:1;
	}


}

/* THIRD BREAKPOINT - MOBILE */
/* ----------------------------------------------------------------------------------------------------------------- */

/* ----------------------------------- WIDTH of 750px (Mobile) ------------------------------------------------------------- */

/* ----------------------------------------------------------------------------------------------------------------- */
@media only screen and (max-width: 750px){


	#headline {
		margin-bottom:10px;
	}

	#headline h1 {
		font-size: 22px;
		line-height: inherit;
		padding: 10px;
	}
	#headlineScroll {
		display: none !important;
	}
	.sub .hero {
		display:none;
	}


	.fullWidth h2 {
		font-family: 'Whitney SSm A','Whitney SSm B';
		font-size: 18px;
		line-height: 40px;
		min-height: 40px;
		padding-left: 10px;
		padding-top: 0;
	}


	#colLeft h4 {
		font-size: 20px;
	}

	/*------ VIDEO/HERO CSS START --------*/

	.hero {
		min-height: 154px;
	}

	.title {
		width:100%;
		max-width: inherit;
		margin-top: 17px;
	}
	.title h4 {
		font-size: 15px;
	}
	html[data-useragent*='MSIE 10.0'] .title h4 {
		font-size:15px;
	}
	.title p {
		display:none;
	}
	.controls .play, .controls .play.FF {
		height: 86px;
		margin-left: -43px;
		top: 50px;
		width: 86px;
	}
	.controls .play img, .controls .play.FF img{
		height: 86px;
		width: 86px;
	}

	/*------ VIDEO/HERO CSS END --------*/

	/*---- FEATURED AREA START ---*/

	.featuredContainer {
		margin: auto;
		max-width: 610px;
		padding: 0 35px;
		width: auto;
	}

	/*---- FEATURED AREA END ---*/

	#programs {
		max-height:0;
		min-height:0;
		overflow:hidden;
		padding: 0 5px;
		-webkit-transition: all 0.8s;
		-moz-transition: all 0.8s;
		transition: all 0.8s;
	}
	#programs.showPrograms {
		max-height: 2000px;
		min-height:809px;
		padding: 4px 5px 5px;

	}

	.show_hidePrograms span, .show_hideAbout span {
		background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/accordion.png") no-repeat scroll 0 0 transparent;
		display: block;
		float: right;
		height: 25px;
		margin: 8px 15px 0 0;
		transform: rotate(90deg);
		-webkit-transform: rotate(90deg);
		-moz-transform: rotate(90deg);
		width: 15px;
		-webkit-transition: all 0.2s;
		-moz-transition: all 0.2s;
		transition: all 0.2s;
	}
	.show_hidePrograms span.rotate, .show_hideAbout span.rotate {
		transform: rotate(270deg);
		-webkit-transform: rotate(270deg);
		-moz-transform: rotate(270deg);
	}

	#mobileSchoolIcons {
		margin: 16px 5px;
	}

	#mobileSchoolIcons p {
		background: none repeat scroll 0 0 #4C96D2;
		border-left: 5px solid #FFFFFF;
		border-right: 5px solid #FFFFFF;
		float: left;
		font-size: 14px;
		padding: 10px 8px;
		text-align: center;
		width: 50%;
	}
	/*#mobileCallout {
		padding: 0px 10px 16px;
	}
	#mobileCallout p{
		font-size: 14px;
		text-align: center;
		background: none repeat scroll 0 0 #8d9398;
		line-height:40px;
	}
	#mobileCallout a{
	}*/

#academicPrograms {
    margin-top: 0px;
    position: absolute;
}
.video {
    display: block;
    height: 0;
    overflow: hidden !important;
}

.col2 {
  float: none;
  padding-right: 0;
  width: 100%;
}
dt {
  clear: none;
  float: none;
  font-weight: 500;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  width: 100%;
}
dd {
  font-weight: 300;
  margin-bottom: 10px;
  margin-left: 0;
  width: 100%;
}
.col1 h2 {
	padding-top:0 !important;
}


}

/* FOURTH BREAKPOINT - MOBILE */
/* ----------------------------------------------------------------------------------------------------------------- */

/* ----------------------------------- WIDTH of 530px (Mobile) ------------------------------------------------------------- */

/* ----------------------------------------------------------------------------------------------------------------- */
@media only screen and (max-width: 550px){
	.featuredContainer {
		margin: auto;
		max-width: 270px;
		padding:0;
	}



}

<!------ Retina Displays ------->


/* 1.25 dpr */
@media
(-webkit-min-device-pixel-ratio: 1.25),
(min-resolution: 120dpi){
    #stickyNav h3 span {
	  background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/linksCloseX2.png") no-repeat scroll 0 0 transparent;
	  -webkit-background-size: contain;
	 -moz-background-size: contain;
	 -o-background-size: contain;
	 background-size: contain;
	}

	#stickyNav h3.linksOpen span {
	  background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/linksOpenX2.png") no-repeat scroll 0 0 transparent;
	  -webkit-background-size: contain;
	 -moz-background-size: contain;
	 -o-background-size: contain;
	 background-size: contain;
	}
	.show_hidePrograms span, .show_hideAbout span {
		background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/accordionX2.png") no-repeat scroll 0 0 transparent;
		-webkit-background-size: contain;
		 -moz-background-size: contain;
		 -o-background-size: contain;
		 background-size: contain;
	}


}

/* 1.3 dpr */
@media
(-webkit-min-device-pixel-ratio: 1.3),
(min-resolution: 124.8dpi){
   #stickyNav h3 span {
	  background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/linksCloseX2.png") no-repeat scroll 0 0 transparent;
	  -webkit-background-size: contain;
	 -moz-background-size: contain;
	 -o-background-size: contain;
	 background-size: contain;
	}

	#stickyNav h3.linksOpen span {
	  background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/linksOpenX2.png") no-repeat scroll 0 0 transparent;
	  -webkit-background-size: contain;
	 -moz-background-size: contain;
	 -o-background-size: contain;
	 background-size: contain;
	}
	.show_hidePrograms span, .show_hideAbout span {
		background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/accordionX2.png") no-repeat scroll 0 0 transparent;
		-webkit-background-size: contain;
		 -moz-background-size: contain;
		 -o-background-size: contain;
		 background-size: contain;
	}
}

/* 1.5 dpr */
@media
(-webkit-min-device-pixel-ratio: 1.5),
(min-resolution: 144dpi){
    #stickyNav h3 span {
	  background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/linksCloseX2.png") no-repeat scroll 0 0 transparent;
	  -webkit-background-size: contain;
	 -moz-background-size: contain;
	 -o-background-size: contain;
	 background-size: contain;
	}

	#stickyNav h3.linksOpen span {
	  background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/linksOpenX2.png") no-repeat scroll 0 0 transparent;
	  -webkit-background-size: contain;
	 -moz-background-size: contain;
	 -o-background-size: contain;
	 background-size: contain;
	}
	.show_hidePrograms span, .show_hideAbout span {
		background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/accordionX2.png") no-repeat scroll 0 0 transparent;
		-webkit-background-size: contain;
		 -moz-background-size: contain;
		 -o-background-size: contain;
		 background-size: contain;
	}
}

/*2.0 dpr */
@media
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi){
    #stickyNav h3 span {
	  background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/linksCloseX2.png") no-repeat scroll 0 0 transparent;
	  -webkit-background-size: contain;
	 -moz-background-size: contain;
	 -o-background-size: contain;
	 background-size: contain;
	}

	#stickyNav h3.linksOpen span {
	  background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/linksOpenX2.png") no-repeat scroll 0 0 transparent;
	  -webkit-background-size: contain;
	 -moz-background-size: contain;
	 -o-background-size: contain;
	 background-size: contain;
	}
	.show_hidePrograms span, .show_hideAbout span {
		background: url("http://www.philau.edu/designengineeringandcommerce/inc/img/accordionX2.png") no-repeat scroll 0 0 transparent;
		-webkit-background-size: contain;
		 -moz-background-size: contain;
		 -o-background-size: contain;
		 background-size: contain;
	}

}