@keyframes zoomOut {
  0% {
      opacity: 0;
      transform: scale(2.0);
      -webkit-transform: scale(2.0);
  }
  100% {
      opacity: 1;
      transform: scale(1.0);
      -webkit-transform: scale(1.0);
  }
}
@-webkit-keyframes zoomOut {
  0% {
      opacity: 0;
      transform: scale(2.0);
      -webkit-transform: scale(2.0);
  }
  100% {
      opacity: 1;
      transform: scale(1.0);
      -webkit-transform: scale(1.0);
  }
}

@-webkit-keyframes fadeIn {
	0% {opacity: 0;}	
	100% {opacity: 1;}
}

@-moz-keyframes fadeIn {
	0% {opacity: 0;}	
	100% {opacity: 1;}
}

@-o-keyframes fadeIn {
	0% {opacity: 0;}	
	100% {opacity: 1;}
}

@keyframes fadeIn {
	0% {opacity: 0;}	
	100% {opacity: 1;}
}

.fadeIn {
	-webkit-animation-name: fadeIn;
	-moz-animation-name: fadeIn;
	-o-animation-name: fadeIn;
	animation-name: fadeIn;
}

@-webkit-keyframes fadeIn {
	0% {opacity: 0;}	
	100% {opacity: 1;}
}

@-moz-keyframes fadeIn {
	0% {opacity: 0;}	
  50% { opacity: 0;}
	100% {opacity: 1;}
}

@-o-keyframes fadeIn {
	0% {opacity: 0;}	
  50% { opacity: 0;}
	100% {opacity: 1;}
}

@keyframes fadeIn {
	0% {opacity: 0;}	
  50% { opacity: 0;}
	100% {opacity: 1;}
}

.fadeIn {
	-webkit-animation-name: fadeIn;
	-moz-animation-name: fadeIn;
	-o-animation-name: fadeIn;
	animation-name: fadeIn;
}

@keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: 0;}
}

@-moz-keyframes fadeOut {
	0% {opacity: 1;}
	100% {opacity: 0;}
}

@-webkit-keyframes fadeOut {
	0% {opacity: 1;}
  	100% {opacity: 0;}
}

.fadeOut {
	-webkit-animation-name: fadeOut;
	-moz-animation-name: fadeOut;
	-o-animation-name: fadeOut;
	animation-name: fadeOut;}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
  50% { opacity: 0;}
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}
@keyframes popIn {
  0% {
    opacity: 0;
  }
  99% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.popIn {
  -webkit-animation-name: popIn;
  animation-name: popIn;
}

.ar_animation { 
  width: 946px;
  height: 328px;
  position: absolute; 
  top: 0; 
  left: 0;
  -webkit-animation: fadeOut 5s;
  -moz-animation: fadeOut 5s;
  animation: fadeOut 5s;
  opacity: 0;
}
.ar_logo { 
  padding: 0;
  animation: zoomOut 3.5s ease-in-out ;
  -webkit-animation: zoomOut 3.5s ease-in-out ;
  margin: auto auto;
  text-align: center;
  width: 261px;
  margin-top: 75px;
  position: relative;
  z-index: 100;
}
.ar_logo img {
  width: 261px;
  height: 125px;
}
.ar_action { 
  animation: popIn 3.75s;
  -webkit-animation: popIn 3.75s;
  text-align: center;
  position: relative;
  margin: 29px auto 0;
}
.ar_action img {
  width: 189px;
  height: 29px;
}

.ar_container {     
  background: url("https://pitt.edu/sites/default/files/365/365_bg.jpg") no-repeat #0c1226;
  width: 946px;
 height: 328px;
 position: relative;
 overflow: hidden;
  
}
@media screen and (max-width: 959px) {
}
@media screen and (max-width: 768px) {
  .ar_container, .ar_animation {
    width: 754px;
    height: 327px;
  }
}
@media screen and (max-width: 767px) {
  .ar_container {
    width: auto;
  }
  .ar_animation {
    position: absolute;
    margin-left: -50%;
    max-width: none;
  }
}
@media screen and (max-width: 320px) {
}