/** 
 * Custom Styles for Academics Section
 * Added per Andy Porter's request - April 2014
 **/

#academics-content p {
	padding: 10px 0px;
}

#banner-btns {
	z-index: 999;
	width: 100%;
	font-size: 20px;
	background: url(//www.gse.upenn.edu/system/files/u63/bg_red_80.png);
	text-align: left;
	padding-left: 35px !important;
	line-height: 24px;
	position: absolute;
	bottom: 140px;
	left: 0;
}
#second-special-btn {
        width: 330px;
}
#open-programs {
	/*width: 300px;*/
        width: 330px;
}

#open-what-distinguishes {
	width: 370px;
}

#what-distinguishes h2 {
	color: #666;
	font-family: "Crimson",Georgia,serif;
	font-size: 44px;
	line-height: 1em;
	margin-bottom: 20px;
	text-transform: none;
}

#what-distinguishes .bordered-image {
	max-width: 100%;
	height: auto;
	border-width: 3px;
}

#what-distinguishes p {
	font-size: 20px;
	margin-top: 5px;
	margin-bottom: 30px;
	line-height: 1.2em;
}

#what-distinguishes .col-md-8 h3 {
	margin-top: 25px;
}

#what-distinguishes .col-md-4 {
	padding-right: 0;
}
/*
.ie #open-programs-academics {
	width: 100% !important;
}

.ie .btn-front {
	width: 32% !important;
	margin-right: 1% !important;
}*/

#open-programs:hover {
	background: url(../img/red_bg_over.png);
}
#open-programs span {
	font-family: "Lato", Arial, sans-serif !important;
	display: inline;
}

#open-programs em {
	text-transform: none;
}

#open-programs-academics {
	width: 85%;
	font-size: 26px;
	border-bottom: 5px solid #f80624;
}

#arrow-btn {
	background-image: url(../img/right_arrow.png);
	background-repeat: no-repeat;
	display: inline-block;
	height: 20px;
	width: 20px;
	position: absolute;
	top: 40%;
	left: 15px;
}

.btn-front {
	width: 27% !important;
	margin-right: 2% !important;
}

.degree-list {
	width: 100% !important;
}

/* === Parallax Links in Home Panel === */
.para, .para li {
	width: 320px;
}

#what-distinguishes-btn,
#degree-programs-btn {
	float: left;
}

#what-distinguishes-btn a,
#degree-programs-btn a {
	background: transparent; 
	border: none;
	margin: 0;
	border-right: 1px solid #eaaeae;
	text-align: left !important;
	padding: 15px 20px 10px !important;
	font-family: 'Crimson', Georgia, Times, serif;
	font-size: 26px;
	line-height: 30px;
	text-transform: none !important;
	letter-spacing: 1px;
}

#what-distinguishes-btn a:hover,
#degree-programs-btn a:hover {
	background-image: none;
	background-color: #d30000;
}

#what-distinguishes-btn a {
	border-left: 1px solid #eaaeae; 
}

#what-distinguishes-btn span,
#degree-programs-btn span {
	font-family: 'Lato', sans-serif !important;
	display:inline;
	font-size: 19px;
}

span.upper {
	text-transform: uppercase !important;
	color: #eaaeae;
}

/** For Centennial Button **/
#centennial-btn {
    font-family: 'Lato';
    font-weight: bold;
    text-transform: uppercase;
    line-height:1em;
    padding: 10px;
    padding-top: 15px;
    height: 75px !important;
    border-bottom: 8px solid #d30000;
    top: 40%;
    font-size: 17px !important;
    position: absolute;
    letter-spacing: 0.05em;
    background: url(http://www.gse.upenn.edu/system/files/u63/bg_red_80.png);
    z-index: 99;
    right: 0;
    width: 320px;
    margin-top: -35px;
    color: #eaaeae;
    font-family: 'Lato';
}

#centennial-btn:hover {
    background-color: #d30000;
}

#centennial-btn span.upper {
    font-family: Crimson;
    color: #fff;
    font-weight: bold;
    font-size: 25px;
    line-height: 34px;
    letter-spacing:0.05em;
}

#centennial-btn span.lower {
    color: #fff;
    font-weight: bold;
    text-transform: lowercase;
    font-size: 17px !important;
    margin-left: 3px;
}
/** --------------------- **/

/* Styles for long thing browsers. */
@media (max-width: 2400px) and (min-width: 1025px) and (max-height:840px) {
    section.home {
        min-height: 500px;
    }

    #banner-btns {
        bottom: auto !important;
        top: 550px !important;
    }
    
    #intro {
        padding-top: 0% !important; 
    }

}

@media (max-width: 1329px) and (min-width: 581px) {
	.front .degree-list {
		width: 100% !important;
	}
	#open-programs-academics {
	    font-size: 1.1em !important;
	}
	#academics-content a.btn-front {
	    font-size: 0.8em;
	}
	#academics-content p,
	#academics-content {
		margin-top: 15px !important;
	}
}
@media (max-width: 1200px) and (min-width: 1024px) {
	#academics-content a.btn-front {
		float: none !important;
		width: 50% !important;
		font-size: 1.0em;
	}
	.ie #open-programs-academics {
		width: 95% !important;
	}
}
@media (max-width: 1027px) {
	/** Hide this for 1024px view **/
	img.hidden-sm {
		display: none !important;
	}

	#what-distinguishes .col-md-8 {
		width: 100% !important;
	}
}

@media (max-width: 1023px) and (min-width: 801px) {
	#academics-content a.btn-front {
		/*width: 20% !important; */
	}
}
@media (max-width: 1023px) and (min-width: 582px) {
	#academics-title {
		margin-top: 25% !important;
	}
	#more-academics {
		z-index: 9999;
	}
	section.leaders {
		min-height: 960px !important;
	}
}
@media (max-width: 710px) {
	#banner-btns {
		padding-left: 0px !important;
	}
	#degree-programs-btn, #what-distinguishes-btn {
		width: 100%;
	}

	#what-distinguishes-btn a, #degree-programs-btn a {
		padding-left: 35px !important;
		width: 100%;
		border: none;
	}

	#degree-programs-btn a {
		border-top: 1px solid #eaaeae;
	
}
@media (max-width: 800px) and (min-width: 581px) {
	#open-programs-academics {
		width: 75% !important;
	}
	#academics-content a.btn-front {
		width: 31% !important;
	}
	.degree-list {
		margin-left: 0 !important;
	}
	.degree-list a:nth-child(2) {
		margin-left: 1%;
		margin-right: 3% !important;
	}
	.degree-list a:nth-child(3) {
		margin-right: 0 !important;
	}
	#programs-readmore {
		width: 50% !important;
	}
	
}
@media (max-width: 580px) {
	#open-programs span {
	}
	.leaders #academics-content {
		margin-left: 0;
	}
	#academics-content {
		margin-top: 15px !important;
	}

	#open-programs-academics {
	    font-size: 1.1em !important;
	    width: 100%;
	}

	#more-academics {
		z-index: 9999;
	}
	#browse-programs h5 {
		margin-bottom: 7px;
	}
	#programs-readmore {
		width: 80% !important; 
	}

	#arrow-btn {
		display: none;
	}
	
}
@media (max-width: 400px) {
	#open-programs-academics em {
		display: block;
	}
}
@media (min-height: 825px) {
	.front #academics-middle {
		margin-top: 15% !important;
	}	
}
@media (max-height: 990px) {
	#programs-readmore {
		position: relative;
		top: 20px;
		right: -40px !important;
	}
}
