/* ---- Header ---- */

.head {
   position: relative;
   min-height: 112px;
   background: #1A1A1A;
   color: white;
   margin: 0;
/*    padding: 28px 32px 0 64px; */
   padding: 1ex 1em 0 1em;
   z-index: 1;
   border-bottom: 1px solid white;
}

.head a {
   text-decoration: none;
}

.headcontent {
   max-width: 1440px;
   margin: 0 auto;
}

.ucllogo {
   width: 225px;
   height: 92px;
   background: white;
   position: absolute;
   bottom: 0;
   float: left;
}

.ucllinks {
   display: flex;
   float: right;
   height: 112px;
   font-size: 12pt;
   text-align: right;
/*    padding-top: 48px; */
    align-items: center;
    justify-content: center;
    margin-left: 225px;
/*     max-width: 50%; */
}

.ucllinks a {
   font-weight: bolder;
}

.ucllinks a:hover {
   color: DarkOrange;
}

.ucllinks ul {
   list-style-type: none;
   margin: 0;
   border-collapse: collapse;
}

.ucllinks ul li {
   display: inline;
   padding-left: 2em;
   border: none;
   border-collapse: collapse;
   margin: 0;
   white-space: nowrap;
}

/* 
.ucllinks a {
   padding-left: 2em;
}

 */
.compacthead {
   min-height: 71px;
   padding-top: 0;
}

.carousel {
   min-height: 200px;
}

.head h2, .head h3, .head h4 {
   font-size: 0.75em;
   margin: 0;
}

.head h1 {
   font-size: 1em;
   margin: 0;
   text-align: right;
}

.head h1.bolder {
  font-weight:900;
  padding-top: 16px;
}

.head h4 {
   font-variant: small-caps;
   margin: 0;
   text-transform: uppercase;
   text-align: right;
}

.head h5, .head h6 {
   margin: 0;
}

.head a {
   color: white;
}

.head a:active {
   color: red;
}

div.topFooter {
   position: relative;
   width: 100%;
   min-height: 1em;
   background-color: white;
   margin: 0;
   padding: 0;
   vertical-align: middle;
   border: 0;
   border-bottom: 1px solid black;
   z-index: 2;
}


.navBar {
   width: 100%;
   margin: 0;
   padding: 0;
}

img.masthead {
   position: absolute;
   bottom: 0;
   padding: 0 ;
   border: 0;
   background-color: white;
   color: black;
   height: 71px;
   width: 200px;
}

img.whitehead {
   position: absolute;
   bottom: 0;
   padding: 0 ;
/*    margin-top:auto; */
/*    border-top: 23px solid black; */
   float: right ;
   background-color: white;
   color: black;
   height: 71px;
   width: 200px;
   z-index: 4;
}

img.whitebg {
   border: 0;
   width: 241px;
   background-color: white;

}

img.whiteLogo {
   position: relative;
   /* bottom: -97px; */
   /* bottom: -48px; */
   top: 48px;
   padding: 0 ;
   /* margin-top: 53px; */
   /* margin-right: 40px; */
   border-top: 0;
   float: left ;
   /* background-color: #0066cc; */
   /* color: white; */
   /* height: 50px; */
   /* width: 200px; */
   width: 225px;
   z-index: 1;
}

div.carousel img.whiteLogo {
   top: 136px;
}

.topBar {
   position: relative;
   top: 0;
/*    width: 100%; */
   width: auto;
   max-width: 1440px;
   width:expression(document.body.clientWidth > 1440? "1440px" : "auto");
/*    height: 110px; */
   height: 16ex;
/*    height: 82px; */
   line-height: 6ex;
/*    line-height: 30px; */
   background-color: white;
/*    border-bottom: 2px solid lightgray; */
   color: black;
   margin: 0 auto 1ex auto;
/*    padding: 1ex 64px; */
   padding: 1ex 1em;
   vertical-align: middle;
   text-indent: 4px;
   z-index: 2;
}

.topBar h3 {
  margin: 0 0 0 0.6em;
}

.topBar h3 a {
  font-weight: bolder;
}

.topBar h3 a:hover {
  text-decoration: underline;
}

.topBar a, .topBar a:link, .topBar a:visited {
   color: black;
   text-decoration: none;
}

.topBar .menu {
   max-width: 1440px;
   width:expression(document.body.clientWidth > 1440? "1440px" : "auto");
}

hr.headerbottom {
   border: 1px solid lightgray; 
   width: 99.5%; 
   height: 0;
   position: relative; 
   margin: 0 auto 2ex auto; 
   padding: 0; 
   z-index: 2; 
}

/* ---- Responsive screen size adjustments ---- */

@media only screen and (min-width: 610px) {

   .topBar {
      height: 13ex;
   }

   .ucllinks {
      font-size: 15pt;
   }

}

@media only screen and (min-width: 900px) {

   .head {
      padding: 28px 32px 0 64px;
   }

   .topBar {
      padding: 1ex 64px;
      position: sticky;
/*       border-bottom: none; */
/*       box-shadow: 0 2px 2px 0px lightgray; */
   }

   hr.headerbottom {
      position: sticky; 
      top: 15ex;
   }

}

@media only screen and (min-width: 1170px) {

   div.topBar {
      height: 10ex;
   }

   hr.headerbottom {
      top: 12ex;
   }

}

/* ---- Main title image animations ---- */

div.imageHead .uclText {
   font-size: 4.5em;
   font-weight: bold;
   color: #0066cc;
   position: absolute;
   bottom: -16px;
   right: 0.8em;
   width: 100px;
   text-align: right;
}

div.imageHead .uclText a {
   color: #0066cc;
   text-decoration: none;
}

.blockheight {
  height: 400px;
}

.crossfade > figure {
  animation: imageAnimation 30s linear infinite 0s;
  backface-visibility: hidden;
  background-size: cover;
  background-position: center center;
  color: transparent;
  height: 100%;
  max-height: 500px;
  left: 0px;
  opacity: 0;
  position: absolute;
  top: 0px;
  width: 100%;
  z-index: -1;
}

.crossfade > figure:nth-child(1) {
  background-image: url('/images/header/LUX-PMTs-3000x1000.jpg');
}

.crossfade > figure:nth-child(2) {
  animation-delay: 6s;
  background-image: url('/images/header/CERN-PHOTO-201802-030-2_CDS-2302977_LHCTunnel_3000x1000.jpg');
}

.crossfade > figure:nth-child(3) {
  animation-delay: 12s;
  background-image: url('/images/header/CERN-EX-0610026-03_CDS-995912_CMSInnerTracker_3000x1000.jpg');
}

.crossfade > figure:nth-child(4) {
  animation-delay: 18s;
  background-image: url('/images/header/AWAKETunnel2017-3000x1000.jpg');
}

.crossfade > figure:nth-child(5) {
  animation-delay: 24s;
  background-image: url('/images/header/ANITALaunch-1800x600.jpg');
}

/*
.crossfade > figure:nth-child(6) {
  animation-delay: 50s;
  background-image: url('/images/header/PBTTreatmentRoom-1500x500.jpg');
}

.crossfade > figure:nth-child(7) {
  animation-delay: 60s;
  background-image: url('/images/header/ATLAS-EndCap-3000x1000.jpg');
}

.crossfade > figure:nth-child(8) {
  animation-delay: 70s;
  background-image: url('/images/header/PhotonCollision-1944x648.jpg');
}

.crossfade > figure:nth-child(9) {
  animation-delay: 80s;
  background-image: url('/images/header/AWAKESpectrometer-2017-3000x1000.jpg');
}

.crossfade > figure:nth-child(10) {
  animation-delay: 90s;
  background-image: url('/images/header/g-2Ring-3000x1000.jpg');
}

.crossfade > figure:nth-child(11) {
  animation-delay: 100s;
  background-image: url('/images/header/ATLAS-InnerCabling-3000x1000.jpg');
}

.crossfade > figure:nth-child(12) {
  animation-delay: 110s;
  background-image: url('/images/header/CruciformAndQuadDusk-2400x800.jpg');
}
 */

@keyframes
imageAnimation {
  0% {
   animation-timing-function: ease-in;
   opacity: 0;
  }
  8% {
   animation-timing-function: ease-out;
   opacity: 1;
  }
  17% {
   opacity: 1
  }
  25% {
   opacity: 0
  }
  100% {
   opacity: 0
  }
}