|
|
| Line 4: |
Line 4: |
| | <html> | | <html> |
| | <head> | | <head> |
| − | | + | <title>Experiment Design</title> |
| | <meta name="viewport" content="width=device-width, initial-scale=1"> | | <meta name="viewport" content="width=device-width, initial-scale=1"> |
| | <link href="https://fonts.googleapis.com/css?family=Poppins:300,300i,400,700,800&display=swap" rel="stylesheet"> | | <link href="https://fonts.googleapis.com/css?family=Poppins:300,300i,400,700,800&display=swap" rel="stylesheet"> |
| | <link href="https://fonts.googleapis.com/css?family=Lato:300,300i,400,700,700i,900,900i&display=swap" rel="stylesheet"> | | <link href="https://fonts.googleapis.com/css?family=Lato:300,300i,400,700,700i,900,900i&display=swap" rel="stylesheet"> |
| − |
| |
| − | </head>
| |
| | | | |
| | <style> | | <style> |
| − | | + | body{ |
| − | #globalWrapper{
| + | margin: 0; |
| − | padding-bottom: 0px; | + | padding: 0; |
| | } | | } |
| | | | |
| − | /* Text Syling*/
| + | section { |
| − | #HQ_page .landing-text h1{
| + | width: 100%; |
| − | font-size: 650%;
| + | |
| − | font-weight: 500;
| + | |
| − | color: white;
| + | |
| − | font-family:"Poppins";
| + | |
| − | }
| + | |
| − | | + | |
| − | #HQ_page .pagecontainer h1{
| + | |
| − | padding-bottom: 2%;
| + | |
| − | font-size: 2.3rem;
| + | |
| − | font-family:"Poppins";
| + | |
| − | font-weight: 500;
| + | |
| − | }
| + | |
| − | | + | |
| − | #HQ_page .pagecontainer h5{
| + | |
| − | font-size: 1.3rem;
| + | |
| − | font-weight: 500;
| + | |
| − | font-family: "Poppins";
| + | |
| − | }
| + | |
| − | | + | |
| − | #HQ_page .pagecontainer h6{
| + | |
| − | font-size: 1.2rem;
| + | |
| − | font-family: "Lato";
| + | |
| − | }
| + | |
| − | | + | |
| − | | + | |
| − | /*Team Cover*/
| + | |
| − | html,body{
| + | |
| − | height: 100%;
| + | |
| − | width: 100%;
| + | |
| − | scroll-behavior: smooth;
| + | |
| − | overflow-x:visible;
| + | |
| − | }
| + | |
| − | | + | |
| − | #pagecover{
| + | |
| − | background: url(https://static.igem.org/mediawiki/2019/4/45/T--UM_Macau--coverphoto2.jpg) no-repeat center fixed;
| + | |
| − | display: table;
| + | |
| | height: 100vh; | | height: 100vh; |
| − | position: relative; | + | display: flex; |
| − | width: 100%; | + | align-items: center; |
| − | background-size: cover;
| + | justify-content: center; |
| − | text-align: center; | + | |
| | } | | } |
| | | | |
| − | .landing-text{
| + | section h1{ |
| − | display: table-cell; | + | margin: 0; |
| | + | padding: 0; |
| | text-align: center; | | text-align: center; |
| − | vertical-align: middle; | + | font-size: 5em; |
| | + | color: #262626; |
| | + | background: #fff; |
| | + | padding: 10px; |
| | + | text-shadow: 0 2px 5px rgba(0,0,0,.5); |
| | + | box-shadow: 0 2px 25px rgba(0,0,0,.5); |
| | } | | } |
| | | | |
| − | /*for scroll down arrow*/
| + | section:nth-child(1){ |
| − | .arrow{
| + | background: #74b9ff; |
| − | position: absolute;
| + | |
| − | bottom: 10%;
| + | |
| − | width: 100%;
| + | |
| − | cursor: pointer;
| + | |
| − | transition: 0.4s;
| + | |
| − | text-align: center;
| + | |
| | } | | } |
| | | | |
| − | .arrow img{
| + | section:nth-child(2){ |
| − | width: 7%;
| + | background: #6c5ce7; |
| | } | | } |
| | | | |
| − | .arrow:hover{
| + | section:nth-child(3){ |
| − | padding-bottom: 18px;
| + | background: #ff7675; |
| | } | | } |
| | | | |
| − | /*Team Container Styling*/
| + | section:nth-child(4){ |
| − | .pagecontainer{
| + | background: #ffeaa7; |
| − | padding: 10%; | + | |
| | } | | } |
| | | | |
| − | | + | section:nth-child(5){ |
| − | | + | background: #2a9bfe; |
| − | .sectionpadding{
| + | |
| − | padding-left: 5%;
| + | |
| − | padding-right: 5%;
| + | |
| − | padding-bottom: 12%; | + | |
| | } | | } |
| − |
| |
| − |
| |
| − | /*footer styling*/
| |
| − |
| |
| − | .footerall{
| |
| − | padding-right:20px;
| |
| − | padding-left: 20px;
| |
| − | }
| |
| − |
| |
| − | footer{
| |
| − | width: 100%;
| |
| − | background-color:#131111;
| |
| − | padding-top: 50px;
| |
| − | padding-bottom: 50px;
| |
| − | padding-left: 5%;
| |
| − | padding-right: 5%;
| |
| − | color: #fff;
| |
| − | bottom: 0;
| |
| − | left: 0;
| |
| − | }
| |
| − |
| |
| − | footer h4{
| |
| − | font-size: 1.3rem;
| |
| − | font-family: "Lato";
| |
| − | font-weight: 400;
| |
| − | color: #fff;
| |
| − | }
| |
| − |
| |
| − | footer h5{
| |
| − | font-size: 1.2rem;
| |
| − | font-family:"Lato";
| |
| − | font-weight: 300;
| |
| − | color: #fff;
| |
| − | }
| |
| − |
| |
| − | footer h6{
| |
| − | font-size: 1rem;
| |
| − | font-family:"Lato";
| |
| − | font-weight: 300;
| |
| − | color: #fff;
| |
| − | }
| |
| − |
| |
| − | .logo{
| |
| − | text-align: center;
| |
| − | }
| |
| − |
| |
| − | .contact{
| |
| − | border-right: 0.8px solid #fff;
| |
| − | border-left: 0.8px solid #fff;
| |
| − | padding-left: 25px;
| |
| − | height: 220px;
| |
| − | }
| |
| − |
| |
| − | .social{
| |
| − | padding-right: 10px;
| |
| − | width: 32px;
| |
| − | cursor: pointer;
| |
| − | transition: 0.4s;
| |
| − | }
| |
| − |
| |
| − | .social:hover{
| |
| − | opacity: 0.4;
| |
| − | }
| |
| − |
| |
| − | .sponsor{
| |
| − | padding-left: 50px;
| |
| − | padding-right: 50px;
| |
| − | }
| |
| − |
| |
| − | .sponsor img{
| |
| − | vertical-align: middle;
| |
| − | margin-top: 8px;
| |
| − | }
| |
| − |
| |
| − | hr{
| |
| − | border: 0;
| |
| − | height: 0.8px;
| |
| − | background-image: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0));
| |
| − | }
| |
| − |
| |
| − |
| |
| − | /*for media styling*/
| |
| − | @media (max-width: 768px) {
| |
| − | #HQ_page .landing-text h1{
| |
| − | font-size: 200%;
| |
| − | font-weight: 500;
| |
| − | color: white;
| |
| − | font-family:"Poppins";
| |
| − | }
| |
| − | .arrow img{
| |
| − | width: 15%;
| |
| − | }
| |
| − | }
| |
| − |
| |
| | </style> | | </style> |
| − | </head> | + | </head> |
| | | | |
| | <body> | | <body> |
| | | | |
| | + | <section> |
| | + | <h1 data-aos="fade-up">Hello Everyone</h1> |
| | + | </section> |
| | | | |
| − | <!--Team Cover-->
| + | <section> |
| − | <div id="pagecover">
| + | <h1 data-aos="fade-left">Hello Everyone</h1> |
| − | <div class="landing-text"> | + | </section> |
| − | <h1>Experiment Design</h1> | + | |
| − | <div class="arrow text-center" >
| + | |
| − | <a href="#pagestart"><img class="img-fluid" src="https://static.igem.org/mediawiki/2019/3/36/T--UM_Macau--homepicdownarrow.png"></a>
| + | |
| − | </div>
| + | |
| − | </div> | + | |
| − | </div>
| + | |
| − | <!--End of Team Cover-->
| + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | <!--Team Container-->
| + | |
| | | | |
| − | <div id="pagestart" class="pagecontainer"> | + | <section> |
| | + | <h1 data-aos="fade-up-right">Hello Everyone</h1> |
| | + | </section> |
| | | | |
| | + | <section> |
| | + | <h1>Hello Everyone</h1> |
| | + | </section> |
| | | | |
| − | <!--Title--> | + | <section> |
| − | <h1>Students</h1> | + | <h1>Hello Everyone</h1> |
| | + | </section> |
| | | | |
| | | | |
| − | <!--Students Section & Lightbox Images-->
| |
| − | <section class="sectionpadding">
| |
| − | </section>
| |
| − | </div>
| |
| | | | |
| − | <!--Footer-->
| |
| − | <footer class="footerall container-fluid">
| |
| − | <div class="row align-items-center">
| |
| − | <div class="logo col-sm-6 col-lg-3">
| |
| − | <img class="img-fluid" src="https://static.igem.org/mediawiki/2019/9/96/T--UM_Macau--homepicigem.png" style="width:200px">
| |
| − | </div>
| |
| − | <div class="contact col-sm-6 col-lg-3">
| |
| − | <h4>CONTACT US</h4>
| |
| − | <h5>umac.igem@gmail.com</h5>
| |
| − | <br>
| |
| − | <h4>FOLLOW US</h4>
| |
| − | <a href="https://www.facebook.com/igemumac2019/"><img class="img-fluid social" src="https://static.igem.org/mediawiki/2019/8/80/T--UM_Macau--homepicfb.png"></a>
| |
| − | <a href="https://www.instagram.com/igem_ummacau/"><img class="img-fluid social" src="https://static.igem.org/mediawiki/2019/d/da/T--UM_Macau--homepicinsta.png"></a>
| |
| − | </div>
| |
| | | | |
| − | <div class="sponsor col-sm-12 col-lg-6">
| + | <script type="text/javascript"> |
| − | <div class="row align-items-center">
| + | AOS.init({ |
| − | <div class="col-sm-4 "><img class="img-fluid" src="https://static.igem.org/mediawiki/2019/3/3b/T--UM_Macau--homepicum.png" style="width:100%"></div>
| + | offset: 200, |
| − | <div class="col-sm-4 "><img class="img-fluid" src="https://static.igem.org/mediawiki/2019/5/5e/T--UM_Macau--homepicfhs.png" style="width:100% "></div>
| + | duration: 1000, |
| − | <div class="col-sm-4 "></div>
| + | }); |
| − | </div>
| + | </script> |
| − | <div class="row align-items-center">
| + | |
| − | <div class="col-sm-4 "><img class="img-fluid" src="https://static.igem.org/mediawiki/2019/c/c4/T--UM_Macau--homepicidt.png" style="width:100%"></div>
| + | |
| − | <div class="col-sm-4 "><img class="img-fluid" src="https://static.igem.org/mediawiki/2019/a/aa/T--UM_Macau--homepictwist.png" style="width:100%"></div>
| + | |
| − | <div class="col-sm-4 "><img class="img-fluid" src="https://static.igem.org/mediawiki/2019/8/8a/T--UM_Macau--homepiclumicks.png" style="width:100%"></div>
| + | |
| − | </div>
| + | |
| − | <div class="row align-items-center">
| + | |
| − | <div class="col-sm-4 "><img class="img-fluid" src="https://static.igem.org/mediawiki/2019/9/9c/T--UM_Macau--homepicdiagon.png" style="width:100%"></div>
| + | |
| − | <div class="col-sm-4 "><img class="img-fluid" src="https://static.igem.org/mediawiki/2019/4/43/T--UM_Macau--homepicgjb.png" style="width:100%"></div>
| + | |
| − | <div class="col-sm-4"></div>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </div> | + | |
| − | <hr>
| + | |
| − | <div>
| + | |
| − | <div class="row">
| + | |
| − | <div class="col-sm-12 text-center">
| + | |
| − | <h6>iGEM 2019 UM_Macau</h6>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </footer>
| + | |
| | | | |
| | </body> | | </body> |
| | </html> | | </html> |
