@font-face {
  font-family: 'HelveticaNeueLTStd-Th';
  src: url('../fonts/HelveticaNeueLTStd-Th.eot?#iefix') format('embedded-opentype'),  url('../fonts/HelveticaNeueLTStd-Th.otf')  format('opentype'),
	     url('../fonts/HelveticaNeueLTStd-Th.woff') format('woff'), url('../fonts/HelveticaNeueLTStd-Th.ttf')  format('truetype'), url('../fonts/HelveticaNeueLTStd-Th.svg#HelveticaNeueLTStd-Th') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'HelveticaNeueLTStd-Md';
  src: url('../fonts/HelveticaNeueLTStd-Md.eot?#iefix') format('embedded-opentype'),  url('../fonts/HelveticaNeueLTStd-Md.otf')  format('opentype'),
	     url('../fonts/HelveticaNeueLTStd-Md.woff') format('woff'), url('../fonts/HelveticaNeueLTStd-Md.ttf')  format('truetype'), url('../fonts/HelveticaNeueLTStd-Md.svg#HelveticaNeueLTStd-Md') format('svg');
  font-weight: normal;
  font-style: normal;
}


body{
background:#eee;
background-image: url('../images/seniorBkg.jpg');
background-size: cover;
background-repeat: no-repeat;
background-position: top;
position: relative;
height:100vh;
width:100vw;
margin:0;
overflow:hidden;
}

main{

  position: absolute;
  top: 54%;
  left: 50%;
  transform: translate(-50%, -50%);
  width:100%;
  max-width:1000px;
}
h1{
  font-family: 'HelveticaNeueLTStd-Th';
  font-weight: 100;
  text-align:center;
  font-size: 40pt;
  color:#4B286D;
}
h1 sup{
  font-size: 13pt;
  position: relative;
  top:-8px;
  left:4px;
}

nav{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  font-family: 'HelveticaNeueLTStd-Md';
  text-align: center;
}
nav a{
  margin-bottom:30px;
  text-decoration: none;
  color:#4B286D;
  font-size: 15pt;
  width: 18%;
  padding: 0 2%;
  box-sizing: border-box;
}

nav div{
  background-color:white;
  width:100%;
  height:140px;;
  margin: 15px auto ;
  position: relative;
  box-sizing: border-box;
  border-radius: 16px;
  transition: .1s ease;
  background-repeat: no-repeat;
  background-position: center;
  background-size:;
}

nav .nav1{
  background-image: url('../images/nav1.png')
}
nav .nav2{
  background-image: url('../images/nav2.png')
}
nav .nav3{
  background-image: url('../images/nav3.png')
}
nav .nav4{
  background-image: url('../images/nav4.png')
}
nav .nav5{
  background-image: url('../images/nav5.png')
}
nav .nav6{
  background-image: url('../images/nav6.png')
}
nav .nav7{
  background-image: url('../images/nav7.png')
}
nav .nav8{
  background-image: url('../images/nav8.png')
}
nav .nav9{
  background-image: url('../images/nav9.png')
}


nav a:hover div{
  background-color:#4B286D;
}
nav a:focus{
    outline:none !important;
}
nav a:focus div{
  background-color:#4B286D;

}

#return:focus{
    outline:none !important;
}


nav a:hover .nav1, nav a:focus .nav1{
  background-image: url('../images/nav1-w.png')
}
nav a:hover .nav2, nav a:focus .nav2{
  background-image: url('../images/nav2-w.png')
}
nav a:hover .nav3, nav a:focus .nav3{
  background-image: url('../images/nav3-w.png')
}
nav a:hover .nav4, nav a:focus .nav4{
  background-image: url('../images/nav4-w.png')
}
nav a:hover .nav5, nav a:focus .nav5{
  background-image: url('../images/nav5-w.png')
}
nav a:hover .nav6, nav a:focus .nav6{
  background-image: url('../images/nav6-w.png')
}
nav a:hover .nav7, nav a:focus .nav7{
  background-image: url('../images/nav7-w.png')
}
nav a:hover .nav8, nav a:focus .nav8{
  background-image: url('../images/nav8-w.png')
}
nav a:hover .nav9, nav a:focus .nav9{
  background-image: url('../images/nav9-w.png')
}
nav img{
  display: inline-block;
  margin: auto;
  max-width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#screensaver {
  position: absolute;
  width: 100%;
  height:100%;
  left:0px;
  top: 0px;
  display: none;
  z-index:9999;
}



.return-btn{
  opacity: 0;
  z-index:999;
  position: absolute;
  color:white;
  top: 40px;
  left:50px;
  font-family: 'HelveticaNeueLTStd-Th';
  font-weight: 100;
  text-align:center;
  font-size: 16pt;
  text-transform: uppercase;
  letter-spacing: 2px;
  border:2px solid white;
  border-radius: 5px;
  text-decoration: none;
  padding: 10px 20px;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
  transition: .3s ease;
}
.return-btn.show{
  opacity:1;
}
.return-btn:hover{
  background:white;
    color:#4B286D;
    border:2px solid #4B286D;
}