|
|
| Line 434: |
Line 434: |
| | } | | } |
| | | | |
| − |
| |
| − | .laser{
| |
| − | width:50%;
| |
| − | height:1px;
| |
| − | position:fixed;
| |
| − | background-color: #f6cd61;
| |
| − | top:50%;
| |
| − | z-index:-1;
| |
| − | border-radius: 50%;
| |
| − | transition: all 0.7s ease;
| |
| − | /* border:2px solid #f6cd61; */
| |
| − | opacity: 0.25;
| |
| − | box-shadow: 0 0 1px 1px #f6cd61;
| |
| − | -webkit-animation-name: laserAnimation;
| |
| − | -webkit-animation-duration: 1800ms;
| |
| − | animation-name: laserAnimation;
| |
| − | animation-duration: 1800ms;
| |
| − | animation-iteration-count: infinite;
| |
| − |
| |
| − |
| |
| − | }
| |
| − |
| |
| − | @-webkit-keyframes laserAnimation {
| |
| − | 0% {width: 0;left:0;}
| |
| − | 50% {width: 50%;left: 50px;}
| |
| − | 100% {width: 0;left:0;}
| |
| − | }
| |
| − |
| |
| − | @keyframes laserAnimation {
| |
| − | 0% {width: 0;left:0;}
| |
| − | 50% {width: 50%;left: 50%;}
| |
| − | 100% {width: 0;left:0;}
| |
| − | }
| |
| | | | |
| | #overlay { | | #overlay { |
| Line 699: |
Line 666: |
| | <a href="#" id="close-menu" >✕</a> | | <a href="#" id="close-menu" >✕</a> |
| | <div id="overlay"></div> | | <div id="overlay"></div> |
| − | <div class="laser" style="top:15%;"></div>
| |
| − | <div class="laser" style="top:30%;animation-delay:360ms"></div>
| |
| − | <div class="laser" style="top:45%;animation-delay:720ms"></div>
| |
| − | <div class="laser" style="top:60%;animation-delay:1080ms"></div>
| |
| − | <div class="laser" style="top:75%;animation-delay:1460ms"></div>
| |
| | <video autoplay muted loop id="Video"> | | <video autoplay muted loop id="Video"> |
| | <source src="https://2019.igem.org/wiki/images/4/4a/T--Vilnius-Lithuania--blue.mp4" type="video/mp4"> | | <source src="https://2019.igem.org/wiki/images/4/4a/T--Vilnius-Lithuania--blue.mp4" type="video/mp4"> |