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

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

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

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

.ucllinks {
   float: right;
   font-size: 15pt;
   text-align: right;
   padding-top: 48px;
}

.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;
}

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

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

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

div.head a {
   color: #fff;
}

div.head a:active {
   color: #f00;
}

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


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

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

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

img.masthead {
   position: relative;
   bottom: 0;
/*   top: 0; */
   padding: 0 ;
   margin-top:auto;
   border-top: 23px solid black;
   float: right ;
   background-color: #06c;
   color: #000000;
   height: 71px;
   width: 200px;
   z-index: 4;
}

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

.whitebg {
   background-color: white;
}

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;
}

/* ---- 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
  }
}