@font-face {
    font-family: 'open_sans_condensedbold';
    src: url('/academics/majors/css/css/OpenSans-CondBold-webfont.woff') format('woff');
}

#content h1 {
	color: #000;
	font-weight: bold;
	padding: 0.5em 0;
	font-size: 1.7em;
	position: initial !important;
	width: auto  !important;
	height: auto  !important;
	overflow: auto !important;
}

div#hero {
	position: relative;
	color:white;
	margin-bottom: 1.5rem;
}

div#hero_front {
	position: absolute;
	top: 0;
	width: 100%;
	display: flex;
	justify-content: center;
}

div#hero_front img {
	max-height:500px;
}

div#hero_back {
	max-height: 500px;
	width: 100%;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content:center;
}

div#hero_back img {
	filter: blur(5px);
	width: 100%;
}

div#hero h3 {
	color:#FC0 !important;
	background-color:  rgb(102, 51, 153); /*Purple */
	font-family: 'open_sans_condensedbold', 'Open Sans', sans-serif !important;
	font-weight: bold !important;
	position: absolute;
	bottom: 0;
	width: fit-content;
	font-size: clamp(1rem, 3vw, 2.25rem)!important;
	padding:.5em 1em !important;
	letter-spacing: 1px;
}

div#containerMain {
margin:0 15%;
}

div#containerAdmissions {
display:flex;
flex-wrap:wrap;
gap:1em;
align-items:flex-start;
margin:1em 0;
padding:1em 2em;
background:#eee;
border-radius: 10px;
}

div#containerAdmissions>div {
	flex:1 1 45%;
}

#content h4 {
	font-size: clamp(1rem, 1.5vw, 1.5rem) !important;
}

h4.grey {
	color: #2C2C2C !important;
}

div#containerList{
display:grid;
grid-template-columns: repeat(2, 1fr);
gap:6%;
margin:1em 0;
}

a.actionbutton {
    background-color: #3B0D6A;
    border-radius: 10px;
    font-weight:bold !important;
    color: #FFF !important;
	width:fit-content;
    min-width: 200px;
    padding: 10px;
    text-decoration: none!important;
    display: inline-block;
    font-size: 16px;
    margin: 1vw .5vw;
    transition-duration: 0.4s;
    cursor: pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
}

a.actionbutton:hover {
	color:#FC0 !important;
}

.flex {
  display: flex;
  flex-wrap:wrap;
	gap:1rem;
	align-items:flex-start;
}

.flex-center {
	justify-content: center;
}

.flex-center > div {
  text-align: center;
}

ul.toggle-view div.panel div.flex div {
	flex: 1 1 45%;
}

.columns {
	column-width: 350px;
	clear: both;
}

.columns>div {
	break-inside:avoid;
}

/*use for toggle*/
.toggle-view {
	list-style:none;    
	background:#639;
	border-radius: 6px;
	color:#FFF !important;
}

.toggle-view h4, .toggle-view a {
	color:#FFF !important;
}

.toggle-view div.panel {
	border-top:1px solid #FFF;
}

ul.toggle-view>li {
list-style-type: none !important;
}

.toggle-view>li {
margin:10px;
position:relative;
cursor:pointer;
}

.toggle-view span {
position:absolute;
right:5px; top:10px;
font-size:30px;
color:#fff;
}
 
.toggle-view .panel {
	display:none;
	padding-bottom:1em;
}

.toggle-view .panel p, .toggle-view .panel>ul>li {
	color:#FFF !important;
}


div#pathways {
background-color:#639;
border-radius: 10px;
overflow:hidden;
margin:1rem 0;
}

.float{
float:right;
margin:0 0 0 1rem;
}

.half
{
	max-width:50%;
}


@media only screen and (max-width:1024px){
div#containerMain {
margin:0 10%;
}

}




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

.float{
float:none;
margin:1rem 0 4rem 0;
}

div#containerAdmissions img.float {
	margin:1rem 0 !important;
}
	
.half
{
	max-width:100%;
}
	
div#hero {
	margin-bottom: 1rem;
}
	
div#containerMain {
margin:0 5%;
}

div#containerList, div#containerAdmissions {
grid-template-columns: 1fr;
}
	
div#containerAdmissions>img {
	max-width:100%;
}
	
div#containerAdmissions, ul.toggle-view div.panel div.flex {
flex-direction:column;
align-items:center;
}
	
}

@media only screen and (max-width:500px){
div#containerMain {
margin:0 2%;
}
div#hero {
	margin-bottom: 0rem;
}
}