/* Class given to divs in HTML */
.growScroll{
    transform: scale(1);
    /* transition: all 2s; */
    /* transition-timing-function: ; */
}
/* Class given to divs with app.js */
.grownScroll {
    animation-name: grownScroll;
    animation-duration: 3s;
    animation-iteration-count: 1;
    animation-timing-function: cubic-bezier(.57,.21,.69,3.25);
}
@keyframes grownScroll{
    from{
        transform: scale(1)
    }
    to {
        transform: scale(1.2)
    }
}


.fly {
    animation: superman-fly-right ease-in-out 2s forwards;
}
.icon_fly_container {
    transition: 1s all
}

.icon_fly_container div, a, li {
    position: relative
}

@keyframes transitionLeft {
    100% {
        left: 0
    }
}

@keyframes transitionRight {
    100%{
        right: 0;
    }
}
@keyframes transitionRightLi {
    100% {
        left: 0;
        opacity: 1;
        z-index: 2;
    }
}
@keyframes type{
    from{width:0;}
}
.icon_fly_container div:nth-child(odd) {       
    right: 600%;
    animation: 2s transitionRight forwards;
  }
  
  .icon_fly_container div:nth-child(even) {
    right: 600%;
    animation: 2s transitionRight forwards;
  }
.icon_fly_container a:nth-child(odd) {       
    right: 600%;
    animation: 2s transitionRight forwards;
  }
  
  .icon_fly_container a:nth-child(even) {
    right: 600%;
    animation: 2s transitionRight forwards;
  }
  .icon_fly_container li:nth-child(odd) {       
    left: -5%;
    opacity: 0;
    animation: 1s transitionRightLi forwards;
    z-index: -1;
  }
  
  .icon_fly_container li:nth-child(even) {
    left: -5%;
    opacity: 0;
    z-index: -1;
    animation: 1s transitionRightLi forwards;
  }
  .icon_fly_container a:nth-child(1) { animation-delay: 1.0s; }
  .icon_fly_container a:nth-child(2) { animation-delay: 2.0s; }
  .icon_fly_container a:nth-child(3) { animation-delay: 3.0s; }

  .icon_fly_container div:nth-child(1) { animation-delay: 2.0s; }
  .icon_fly_container div:nth-child(2) { animation-delay: 3.0s; }
  .icon_fly_container div:nth-child(3) { animation-delay: 4.0s; }
  .icon_fly_container div:nth-child(4) { animation-delay: 5.0s; }
  .icon_fly_container img:nth-child(0) { animation-delay: 6.0s; }
  .icon_fly_container img:nth-child(1) { animation-delay: 7.0s; }
  .icon_fly_container img:nth-child(2) { animation-delay: 8.0s; }
  .icon_fly_container img:nth-child(3) { animation-delay: 9.0s; }
  
  /* Control the schedule list flying in on About Us page */
  .icon_fly_container li:nth-child(1) { animation-delay: 1.25s; }
  .icon_fly_container li:nth-child(2) { animation-delay: 1.5s; }
  .icon_fly_container li:nth-child(3) { animation-delay: 1.75s; }
  .icon_fly_container li:nth-child(4) { animation-delay: 2.0s; }
  .icon_fly_container li:nth-child(5) { animation-delay: 2.25s; }
  .icon_fly_container li:nth-child(6) { animation-delay: 2.5s; }
  .icon_fly_container li:nth-child(7) { animation-delay: 2.75s; }
  .icon_fly_container li:nth-child(8) { animation-delay: 3.0s; }
  .icon_fly_container li:nth-child(9) { animation-delay: 3.25s; }
  .icon_fly_container li:nth-child(10) { animation-delay: 3.5s; }
  .icon_fly_container li:nth-child(11) { animation-delay: 3.75s; }
  .icon_fly_container li:nth-child(12) { animation-delay: 4.0s; }
  .icon_fly_container li:nth-child(13) { animation-delay: 4.25s; }
.glow {
    animation-name: glow;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-timing-function: linear;
}
@keyframes glow{
    from{
        text-shadow: 0 0 12px gold,
                    1px 0 12px gold,
                    0 1px 12px gold,
                    1px 1px 12px gold;
        color: white;
    }
    to {
        text-shadow: 0 0 12px #ffffff;
        color: gold;
    }
}
@keyframes gradient {
	0% {
		background-position: 100% 100%;
	} 
	40% {
		background-position: 100% 50%;
	} 
}
/* .icon_fly_container li{
    width: auto;
    animation: type 4s steps(40, end); 
} */
/* Imported from TCP */
/* Possibly make .anim class to control transition time */
.anim {
    transition: all 1.5s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.bw_border>*{
    border: 1px solid #00000000;
}
.bw_border>*:hover{
    border: 1px solid white;
}
.grow>*{
    transition: all 1.5s cubic-bezier(0.075, 0.82, 0.165, 1);
    opacity: 0.8;
}
.grow>*:hover{
    transform: scale(1.05) translateY(-10px);
}
.remove_shadow>*:hover{
    box-shadow: inset 0 0 0 1000px rgba(8, 0, 27, 0.349);
    border: 1px solid gold;
    filter: none;
}
.extend_hr{
    width: 0%;
    transition: all 2s;
    background-color:rgb(5, 55, 129);
    border-radius:20%;
    height:2px
}
.extended_hr{
    width: 20%
}
.tran_delay_1 { transition-delay: .5s }
.tran_delay_2 { transition-delay: 1s }
.tran_delay_3 { transition-delay: 1.5s }
