body {background-color: black;}
/* #masthead {background: url(/newsite14/bootstrap/images/topbanner-belltower-2000.jpg) fixed no-repeat center 0; height: 700px; background-color: black;} */
#masthead {padding-bottom: 150px; position: relative; /*background-image: url(/images/2015/TowerFrame1.png); */
			background-repeat: no-repeat; background-position: center; min-height: 700px; min-height: 100vh; min-height: calc(100vh - 50px); 
			/*background-color: black;*/ background-attachment: fixed; background-size: cover;}			
#masthead h2 {text-align: center; margin: 50px 0 0 0; color: white; font-family: 'League Gothic'; font-size: 575%; line-height: 1; text-shadow: 1px 1px 10px rgba(0,0,0,0.4); text-transform: uppercase;}
#masthead h2 span#theunited {display: block; text-transform: uppercase; font-weight: normal; font-size: 60%; font-family: PeriodicoText-Rg; line-height: .7;}
#masthead h2 span#theand {text-transform: uppercase; font-family: 'League Gothic'; font-size: 60%;}
#masthead img.branding {margin: 14vh auto 40px; display: block; width: 320px;}
#masthead img.branding2 {margin: -70px auto 0; display: block; width: 220px;}
#masthead p {color: white; padding-top: 20px; font-family: PeriodicoText-Rg; font-size: 140%; line-height: 1.5em; text-shadow: 1px 1px 8px rgba(0,0,0,0.5);}
#masthead .down-arrow {position: absolute; bottom: 50px; left: 0; animation: bouncer 3s linear 1; -webkit-animation: bouncer 4s linear 1;}

#masthead video { display: block; position: absolute; height: 100vh; width: auto; top: 50%; top: 0; left: 50%; /*z-index: -1;*/
		-webkit-transform: translate(-50%,0); transform: translate(-50%,0); -webkit-transition: -webkit-filter .1s linear; -moz-transition: -moz-filter .1s linear; 
		transition: filter .1s linear; background-color: black;}
		
 @media screen and (min-aspect-ratio: 16/9) {#masthead  video { width: 100vw; height: auto; } }

a#undergrad-button:link,  a#undergrad-button:visited {background-color: #737475 !important; color: white !important;}
a#undergrad-button:hover,  a#undergrad-button:active {background-color: white !important; color: black !important;}
a#grad-button:link,  a#grad-button:visited {background-color: #386C91 !important; color: white !important;}
a#grad-button:hover,  a#grad-button:active {background-color: white !important; color: black !important;}
a#adult-button:link,  a#adult-button:visited {background-color: #990026 !important; color: white !important;}
a#adult-button:hover,  a#adult-button:active {background-color: white !important; color: black !important;}


@keyframes bouncer {
0% {transform: translateY(0)}
12.5% {transform: translateY(-25px); opacity: 0.3;}
25% {transform: translateY(10px); opacity: 1;}
37.5% {transform: translateY(-20px); opacity: 0.3;}
50% {transform: translateY(8px); opacity: 1;}
62.5% {transform: translateY(-15px); opacity: 0.3;}
75% {transform: translateY(3px); opacity: 1;}
87.5% {transform: translateY(-8px); opacity: 0.3;}
100% {transform: translateY(0); opacity: 1;}
}

@-webkit-keyframes bouncer {
0% {-webkit-transform: translateY(0)}
12.5% {-webkit-transform: translateY(-25px); opacity: 0.3;}
25% {-webkit-transform: translateY(10px); opacity: 1;}
37.5% {-webkit-transform: translateY(-20px); opacity: 0.3;}
50% {-webkit-transform: translateY(8px); opacity: 1;}
62.5% {-webkit-transform: translateY(-15px); opacity: 0.3;}
75% {-webkit-transform: translateY(3px); opacity: 1;}
87.5% {-webkit-transform: translateY(-8px); opacity: 0.3;}
100% {-webkit-transform: translateY(0); opacity: 1;}
}

.header-video {
  display: block;
  position: relative;
  position: fixed;
  top: 0;
  left: 0;
  margin: 0;
  padding: 0;
  width: 100%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: -1;
  background-size: cover;
  background-position: top middle;
  background-repeat: no-repeat;
}

.header-video::before {
  content: "";
  display: block;
  width: 100%;
  padding-bottom: 56.25%;
}

.header-video::after {
  content: "";
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.header-video > iframe {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.header-video--playing > iframe {
  display: block;
}

.down-arrow {text-align: center; width: 100%; padding-top: 150px}

.front-section-vertical {margin-top: 100px; margin-top: 12vh; margin-bottom: 100px; margin-bottom: 15vh;}

section { position: relative; }

#apply {background-color: white;}
#applyheader h2 {text-align: center; font-family: 'League Gothic'; font-size: 500%; text-transform: uppercase; margin-top: 0; margin-bottom: 3vh;  line-height: 1em;}
#applyheader p {font-family: PeriodicoText-Rg; font-size: 140%; line-height: 1.5em; margin-bottom: 3vh;}
#applybody {text-align: center; font-family: PeriodicoText-Rg; font-size: 125%; margin-bottom: 125px;}
#applybody em {font-variant: normal;}
#applybody a {font-family: 'League Gothic'; font-size: 200%; text-transform: uppercase; }
#applybody a:link, #applybody a:visited {background-color: #444444; color: white;}
#applybody a:hover, #applybody a:active {background-color: white; color: black;}

#visit {background-color: white;}
#visitheader h2 {text-align: center; font-family: 'League Gothic'; font-size: 500%; text-transform: uppercase; margin-top: 0; margin-bottom: 3vh;  line-height: 1em;}
#visitheader p {font-family: PeriodicoText-Rg; font-size: 140%; line-height: 1.5em; margin-bottom: 3vh;}
#visitbody {text-align: center; font-family: PeriodicoText-Rg; font-size: 125%; margin-bottom: 125px;}
#visitbody a {font-family: 'League Gothic'; font-size: 200%; text-transform: uppercase; }
#visitbody a:link, #visitbody a:visited {background-color: #ef4036; color: white !important;}
#visitbody a:hover, #visitbody a:active {background-color: white !important; color: black !important;}

#explore {background-image: url(/images/2024/home-explore-2000.jpg); background-size: cover; background-repeat: no-repeat; background-position: center; /* height: 1000px; */ min-height: 1000px; min-height: 100vh; background-color: black; background-attachment: fixed;}
#explorebody {background-color: rgba(255,255,255,0.85); color: #666666; margin-top: 200px; margin-top: 20vh; margin-bottom: 200px; margin-bottom: 20vh;  padding: 25px 40px; text-align: center;}
#explorebody h2 {font-family: 'League Gothic'; font-size: 500%; text-transform: uppercase; line-height: 1em;}
#explorebody p {text-align: left; font-family: PeriodicoText-Rg; font-size: 140%; line-height: 1.5em;}
#explorebody a {font-family: 'League Gothic'; font-size: 200%; text-transform: uppercase;}
#explorebody a:link, #explorebody a:visited {background-color: #737475 !important; color: white !important;}
#explorebody a:hover, #explorebody a:active {background-color: white !important; color: black !important;}

#engage {background-image: url(/images/2024/home-engage-2000.jpg); background-size: cover; background-repeat: no-repeat; background-position: center; /* height: 1000px; */ min-height: 1000px; min-height: 100vh; background-color: black; background-attachment: fixed;}
#engagebody {background-color: rgba(255,255,255,0.85); color: #666666; margin-top: 200px; margin-top: 20vh; margin-bottom: 200px; margin-bottom: 20vh;  padding: 25px 40px; text-align: center;}
#engagebody h2 { font-family: 'League Gothic'; font-size: 500%; text-transform: uppercase; line-height: 1em;}
#engagebody p {text-align: left; font-family: PeriodicoText-Rg; font-size: 140%; line-height: 1.5em;}
#engagebody a {font-family: 'League Gothic'; font-size: 200%; text-transform: uppercase;}
#engagebody a:link, #engagebody a:visited {background-color: #386C91 !important; color: white !important;}
#engagebody a:hover, #engagebody a:active {background-color: white !important; color: black !important;}

#connect {background-color: white; padding-bottom: 25px;}
#connectbody, #connectbody2 {text-align: center; margin-top: 50px; margin-bottom: 25px;}
#connectbody h2 {font-family: 'League Gothic'; font-size: 500%; text-transform: uppercase; color: #45B6E0;  line-height: 1em;}
#connectbody p {font-family: PeriodicoText-Rg; font-size: 140%; line-height: 1.5em;}
#connectbody2 {padding: 25px 0; text-align: center;}
#connectbody2 a {font-family: 'League Gothic'; font-size: 200%; text-transform: uppercase;}
#connectbody2 a#button-recentnews:link, #connectbody2 a#button-recentnews:visited {background-color: #386C91 !important; color: white !important;}
#connectbody2 a#button-recentnews:hover, #connectbody2 a#button-recentnews:active {background-color: gray !important;}
#connectbody2 a#button-allevents:link, #connectbody2 a#button-allevents:visited {background-color: #2e9fc9 !important; color: white !important;}
#connectbody2 a#button-allevents:hover, #connectbody2 a#button-allevents:active {background-color: gray !important;}

.event-panels {background-color: #999999;}
.event-panel {padding: 50px 50px 20px 50px;}
.event-box {background-color: #c8c8c8; margin-bottom: 25px;}
.event-event {padding: 10px 5px 5px 20%; max-height: 70px; font-size: 95%;}
.event-date {width: 15%; background-color: #990026; color: white; text-align: center; padding-top: 12px; float: left; font-weight: bold; min-height: 70px;}
.event-date-date {font-stretch: narrower; font-family: 'League Gothic'; font-size: 190%; margin-top: -4px;} 
.event-jump {font-family: 'League Gothic'; font-size: 200%; text-transform: uppercase;}
.event-jump a:link, .event-jump a:visited {color: black;}
.event-jump a:hover, .event-jump a:active {color: #990026;}


@media only screen and (max-width: 992px) {
#masthead h2 {font-size: 500%;}
/* .flippers em {font-size: 85%;} */
#explore {background-image: url(/images/2024/home-explore-1200.jpg);}
#engage {background-image: url(/images/2024/home-engage-1200.jpg);}
}

@media only screen and (max-width: 768px) {
#masthead {background-image: url(/images/2015/MobileHome1-768.jpg); background-attachment: scroll;}
#masthead h2 {margin: 50px 0 0 -10px; font-size: 450%;}
#masthead p {margin: 0 0 0 -10px; font-size: 125%;}
#masthead img.branding, #masthead img.branding2, #secondary-head img, .breadcrumb, .secondary-header-image .breadcrumb-space {display: none;}
.sidepopout {display: none;}
/* .flippers {margin: 25px 0;} */
}

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

}


@media only screen and (max-width: 600px) {
#masthead h2 {margin: 50px 0 0 -10px; font-size: 420%;}
#explore {background-image: url(/images/2024/home-explore-768.jpg); background-attachment: scroll;}
#explorebody {text-align: center; padding: 25px;}
#explorebody h2 {font-size: 400%; }
#engage {background-image: url(/images/2024/home-engage-768.jpg); background-attachment: scroll;}
#engagebody {text-align: center; padding: 25px;}
#connectbody {margin-bottom: 5px;}
.event-event {padding: 5px 5px 5px 25%; max-height: 80px;}
.event-date {width: 20%; font-size: 95%; min-height: 80px;}
.event-date-date {font-size: 170%;} 
.event-panel {padding: 25px 25px 10px 25px;}
.event-event {font-size: 85%;}
}

@media only screen and (max-device-width: 750px) {
#explore {background-attachment: scroll;}
#engage {background-attachment: scroll;}
}

/***** Styles for Small Displays / Mobile Devices *****/
@media only screen and (max-width: 768px) {

}

/***** Styles for Landscape Orientation *****/
@media only screen and (max-width: 768px) and (max-height: 420px) {
body {padding-right: 60px; padding-bottom: 0;}
}

.stripe{
  position: relative;
}
.stripe:before { 
  content: "";
  height: 2px;
  position: absolute;
  top: -4px;
  width: 100%;
  background-color: #3C040E;
}