Difference between revisions of "Team:Uppsala/InterLab"

m (grammar)
Line 11: Line 11:
  
 
         </style>
 
         </style>
 +
 +
 +
 +
 +
 +
<style/>
 +
 +
 +
            :root{
 +
                --primary: #8b1a32;
 +
                --secondary:#969696;
 +
                --tertiary: #f15025;
 +
                --whiteish: #fcf7ff;
 +
                --light-blue:#cde6f5;
 +
                --alt-secondary: #554640;
 +
 +
            }
 +
 +
 +
            html{
 +
                width: 100%;
 +
                height: 100%;
 +
            }
 +
            *{
 +
                margin: 0;
 +
                padding: 0;
 +
                box-sizing: border-box;
 +
            }
 +
           
 +
            .parallax {
 +
                /* The image used */
 +
                background-image: url("https://static.igem.org/mediawiki/2018/6/6a/T--Uppsala--HEADER_IMPROVE.jpeg");
 +
 +
                /* Set a specific height */
 +
                min-height: 99vh;
 +
 +
                /* Create the parallax scrolling effect */
 +
                background-attachment: fixed;
 +
                background-position: center;
 +
                background-repeat: no-repeat;
 +
                background-size: cover;
 +
                /*background: linear-gradient(to bottom, transparent 90%);*/
 +
            }
 +
           
 +
            .blur-box {
 +
            background-color: var(--whiteish);
 +
            box-shadow: 0 0 10px 10px var(--whiteish);
 +
            }
 +
 +
            .sub-header{
 +
 +
                /* Set a specific height */
 +
                height:20vw;
 +
                min-height: 150px;
 +
               
 +
 +
                /* Create the parallax scrolling effect */
 +
                /*background-attachment: fixed;*/
 +
                background-position: center;
 +
                background-repeat: no-repeat;
 +
                background-size: cover;
 +
               
 +
             
 +
            }
 +
           
 +
            .sub-header h1{
 +
                font-size: 60;
 +
                text-align: center;
 +
                position:absolute;
 +
                left:0;
 +
                right:0;
 +
                margin-top:6.5% ;
 +
                margin-left:auto;
 +
                margin-right: auto;
 +
                color:white;
 +
                bottom: px;
 +
            }
 +
 +
/* TODO: CHANGE */
 +
            #blue{
 +
                background-image: url(redbanner.jpg);
 +
            }
 +
 +
            h1, h2{
 +
 +
                color: #661325;
 +
            }
 +
            h1{
 +
                margin-top:2em;
 +
                margin-bottom: 0.5em;
 +
            }
 +
            #first-title{
 +
                top:100px;
 +
                margin-top: 0;
 +
            }
 +
           
 +
            .content{
 +
                position:relative;
 +
             
 +
                background-color: var(--whiteish);
 +
            }
 +
 +
            .content-text{
 +
                margin-top:2em;
 +
                min-width: 400px;
 +
                width:70%;
 +
                position: relative;
 +
                margin: auto;
 +
                /*background-color: #8c7cff;*/
 +
 +
            }
 +
 +
 +
            .scroll-pointer{
 +
                top:85%;
 +
                position:absolute;
 +
                /*margin-left:auto;
 +
                margin-right:auto;*/
 +
                width: 100%;
 +
                padding: 0;
 +
            }
 +
 +
            .scroll-pointer img{
 +
                color: var(--primary) ;
 +
 +
            }
 +
 +
            .center-icon{
 +
                width:100px;
 +
                position: relative;
 +
                display: block;
 +
                margin-right: auto;
 +
                margin-left: auto;
 +
                opacity: 0.8;
 +
            }
 +
.center {
 +
    display: block;
 +
    margin-left: auto;
 +
    margin-right: auto;
 +
    width: 50%;
 +
}
 +
 +
 +
 +
</style>
 +
 +
 +
 +
 +
 +
 +
  /*****Code related to Animations*/
 +
       
 +
 +
      <div class="svg-wrapper">
 +
 +
   
 +
 +
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 +
viewBox="0 0 2041 335" style="enable-background:new 0 0 2041 335;" xml:space="preserve">
 +
<style type="text/css">
 +
.st0{fill:#fff;stroke:#FFFFFF;stroke-width:3;stroke-miterlimit:10;}
 +
</style>
 +
<g>
 +
<path class="st0" d="M22.8,31.3l24.4,0.8c16,0.5,26.5,0.8,31.4,0.8c4.4,0,23.1-0.5,56.1-1.6l1.6,1.4v9.8l-1.6,1.4
 +
c-9,0.3-15.9,0.7-20.8,1.2c-4.9,0.5-8.4,1.5-10.6,2.9c-2.2,1.4-3.7,4.8-4.4,10.1c-0.7,5.3-1.1,12.6-1.1,22l-0.4,44.9v90.4l0.2,38.1
 +
c0.1,14.7,0.5,24.2,1.2,28.5c0.6,4.3,1.6,7.2,2.8,8.6c1.2,1.4,3.6,2.6,7.1,3.6s12.2,1.7,26,2.2l1.6,1.2v9.8l-1.6,1.6
 +
c-0.7,0-12.1-0.4-34.4-1.2c-9.2-0.3-16.5-0.4-21.7-0.4c-4,0-22.7,0.5-55.9,1.6l-1.6-1.6v-9.8l1.6-1.2c12.1-0.5,20.2-1.2,24.2-2
 +
c4-0.8,6.7-1.8,8.1-3c1.4-1.2,2.5-3.9,3.3-7.9c0.8-4,1.3-13,1.5-27l0.2-41.2v-90.4l-0.4-38.1c-0.1-14.8-0.5-24.4-1.1-28.7
 +
s-1.5-7.2-2.7-8.6c-1.2-1.4-3.6-2.6-7.1-3.5c-3.5-0.9-12.2-1.6-26-2.1l-1.6-1.4v-9.8L22.8,31.3z"/>
 +
<path class="st0" d="M158.9,308.6l-1.8-1.8v-9l1.8-1.6c7.9-0.1,14.3-0.6,19-1.4c4.8-0.8,7.8-2.1,9.2-3.9c1.4-1.8,2.3-4.8,2.7-8.8
 +
c0.5-4,0.9-13.1,1.4-27.3c0.5-14.2,0.7-24.3,0.7-30.5V66.6c0-6.6-1.2-11.6-3.6-14.7c-2.4-3.2-5.7-5.2-9.9-6.1
 +
c-4.2-0.8-11.3-1.3-21.3-1.5l-1.6-1.6v-9.2l1.6-1.8c18,0.7,29.8,1,35.4,1c13.1,0,24-0.3,32.4-1l62.3,80.9l91.6,114.8
 +
c11.1,13.9,22.3,27.1,33.8,39.6V116.1c0-4.7-0.2-14.7-0.7-30c-0.5-15.3-1-25-1.7-29.1c-0.7-4.1-1.8-6.9-3.4-8.3
 +
c-1.6-1.4-4.7-2.5-9.2-3.2c-4.5-0.7-10.6-1.1-18.3-1.3l-1.6-1.6v-9l1.6-1.8c10.5,0.7,25.6,1,45.1,1c17.8,0,30.8-0.3,38.9-1l1.8,1.8
 +
v9l-1.6,1.6c-8.6,0.1-15.2,0.6-19.9,1.5c-4.7,0.8-7.6,2.2-8.8,4.2s-2,4.8-2.4,8.6c-0.5,3.8-0.9,12.8-1.4,27
 +
c-0.5,14.2-0.7,24.4-0.7,30.7v92.8l0.2,53.7c0.3,17.6,0.5,35.2,0.8,52.9c-6.5-2.2-17.8-5-33.8-8.2l-13.9-16.4l-41.6-50.8
 +
L209.7,74.7v149.8c0,6,0.2,16.7,0.7,32c0.5,15.4,1,24.7,1.7,27.9c0.6,3.3,1.5,5.5,2.5,6.7c1,1.2,3.3,2.4,6.7,3.4
 +
c3.4,1,10.6,1.6,21.4,1.8l1.6,1.6v9.2l-1.6,1.6c-6.8-0.9-17.7-1.4-32.8-1.4C190.5,307.3,173.5,307.7,158.9,308.6z"/>
 +
<path class="st0" d="M714.2,31.3l1.8,1.8c-1.2,11.7-1.8,32.2-1.8,61.3l-1.6,1.6h-9.2l-1.6-1.8l-2.1-18c-1-9.6-1.9-15.5-2.4-17.7
 +
s-1.5-3.7-2.8-4.7c-1.3-1-5.5-1.8-12.7-2.4c-7.2-0.6-15.2-1-24-1h-36.9c-1,29.4-1.6,46.4-1.6,51v113.9l0.4,38.1
 +
c0.1,14.7,0.5,24.3,1.1,28.6c0.6,4.4,1.5,7.2,2.7,8.6c1.2,1.4,3.6,2.5,7.1,3.5s12.2,1.7,26.2,2.2l1.4,1.2v9.8l-1.4,1.6
 +
c-33.3-1-52-1.6-55.9-1.6c-4.2,0-22.7,0.5-55.7,1.6l-1.6-1.6v-9.8l1.6-1.2c12.2-0.5,20.3-1.2,24.3-2c4-0.8,6.6-1.8,8-3
 +
c1.4-1.2,2.5-3.9,3.4-7.9c0.9-4,1.4-13,1.4-27l0.4-41.2V101.4c0-2.1-0.5-19.1-1.6-51h-29.1c-12,0-22.3,0.3-31.1,0.8
 +
c-8.7,0.5-13.8,1.9-15.1,4s-2.6,9.1-3.8,21l-2,18l-1.8,1.8h-9l-1.6-1.6c-0.3-31.4-0.8-51.8-1.8-61.3l1.8-1.8
 +
c22.7,1,60.4,1.6,113.1,1.6C654.7,32.9,692.5,32.3,714.2,31.3z"/>
 +
<path class="st0" d="M737.8,32.7l1.6-1.4c44.7,0.8,73.2,1.2,85.7,1.2c42.7,0,80.7-0.4,114.1-1.2l1,1.4c-3.3,12.5-5.7,32.1-7.2,58.8
 +
l-1.2,1.6h-9.6l-1.8-1.6c0.1-1.2,0.2-2.2,0.2-3.1c0-11.1-0.8-21.6-2.5-31.6c-8.2-3.6-19.6-6-34.1-7.1c-14.5-1.1-25.4-1.7-32.7-1.7
 +
c-10.3,0-23.4,0.7-39.5,2.1l-0.8,31.3l-0.6,35.7l-0.6,39.6c14.1,0.8,27,1.2,38.9,1.2c12,0,22-0.4,30.1-1.2
 +
c8.1-0.8,12.8-1.6,14.2-2.4c1.4-0.8,2.4-2.5,3.1-4.9c0.7-2.4,1.3-6.7,1.9-12.8l0.8-12.1l1.6-1.6h9l1.6,1.6
 +
c-0.3,14.2-0.6,28.5-1,42.8l1,43.9l-1.6,1.6h-9l-1.6-1.6l-1.4-11.7c-1.2-9.1-2-14.6-2.5-16.3c-0.5-1.8-1.7-3.3-3.6-4.6
 +
c-1.9-1.3-6.7-2.3-14.6-3.1s-18.6-1.2-32.2-1.2c-7.6,0-19.1,0.3-34.6,1c-0.7,10.9-1,29.2-1,54.7c0,27.3,0.3,47.5,1,60.4h35.9
 +
c31.6,0,51.4-0.4,59.4-1.2c7.9-0.8,15.5-2.7,22.7-5.7c1.2-3,3.1-9.9,5.8-20.8c2.7-10.9,4.2-17.7,4.6-20.4l2-1.4h9.4l1.6,1.4
 +
c-1.2,5.6-2.3,15.4-3.4,29.3c-1.1,13.9-1.7,25.8-1.7,35.7l-1.4,1.6c-24.9-0.8-57.4-1.2-97.7-1.2l-53.1-0.4
 +
c-12.4,0-25.3,0.5-38.7,1.6l-1.6-1.6v-6.4l1.6-2c7.7-3.9,12.1-6.3,13.2-7.3c1.1-1,2-12.4,2.7-34.2c0.7-21.8,1.1-38.4,1.1-49.9
 +
v-71.7L772,91.5c0-9.6-0.1-17.5-0.4-23.5c-0.3-6.1-0.7-10.4-1.4-13c-0.7-2.6-1.4-4.4-2.2-5.5c-0.8-1-2.2-1.9-4.1-2.6
 +
c-1.9-0.7-5.1-1.3-9.7-1.9l-14.8-1.2l-1.6-1.4V32.7z"/>
 +
<path class="st0" d="M976.1,32.7l1.6-1.4c23.8,1,42.4,1.6,55.7,1.6c14.7,0,34.6-0.5,59.6-1.4c9.2-0.3,15.9-0.4,20.1-0.4
 +
c32.9,0,55.3,6,67,18c11.7,12,17.6,26.2,17.6,42.6c0,10.9-2.9,21.7-8.6,32.2c-5.7,10.5-14.2,19.6-25.4,27.1
 +
c-11.2,7.5-26.6,13.1-46.3,16.9c3.6,5.1,10.2,13.9,19.7,26.4l27.7,36.7c9,12.1,18.6,24.9,28.9,38.4c10.3,13.5,16.9,21.1,19.9,22.9
 +
c3,1.8,5.6,2.8,7.7,3.2s5.6,0.6,10.3,0.6l1.6,1.6v9.2l-1.8,1.8c-6.3-0.8-13.7-1.2-22.3-1.2c-9.2,0-19.3,0.4-30.3,1.2
 +
c-9-10.9-23.1-29.9-42.4-56.8c-22.4-31.3-45.3-60.2-68.8-86.9l2-6.1c6.8,0.4,12,0.6,15.8,0.6c22.5,0,40.2-5.4,52.9-16.2
 +
c12.8-10.8,19.1-25.8,19.1-44.9c0-17.2-5.7-30.2-17.2-39c-11.5-8.8-27-13.2-46.5-13.2c-13.7,0-26.6,1.9-38.7,5.7
 +
c-2,2.9-2.9,27.3-2.9,73.2v90.4l0.2,38.1c0.1,14.7,0.5,24.2,1.2,28.5c0.7,4.3,1.6,7.2,2.8,8.6c1.2,1.4,3.6,2.6,7.1,3.6
 +
s12.2,1.7,26,2.2l1.6,1.2v9.8l-1.6,1.6c-0.7,0-12.1-0.4-34.4-1.2c-9.2-0.3-16.5-0.4-21.7-0.4c-4,0-22.7,0.5-55.9,1.6l-1.6-1.6v-9.8
 +
l1.6-1.2c12.1-0.5,20.2-1.2,24.2-2c4-0.8,6.7-1.8,8.1-3c1.4-1.2,2.5-3.9,3.3-7.9c0.8-4,1.3-13,1.5-27l0.2-41.2v-90.4l-0.4-38.1
 +
c-0.1-14.8-0.5-24.4-1.1-28.7s-1.5-7.2-2.7-8.6c-1.2-1.4-3.6-2.6-7.1-3.5c-3.5-0.9-12.2-1.6-26-2.1l-1.6-1.4V32.7z"/>
 +
<path class="st0" d="M1242.3,32.7l1.6-1.4c32.3,1,50.9,1.6,55.9,1.6c4.4,0,23.1-0.5,56.1-1.6l1.6,1.4v9.8l-1.6,1.4
 +
c-9,0.3-15.9,0.7-20.8,1.2c-4.9,0.5-8.4,1.5-10.6,2.9c-2.2,1.4-3.7,4.8-4.4,10.1c-0.7,5.3-1.1,12.6-1.1,22l-0.4,44.9v86.3
 +
c0,21.6,0.1,36.7,0.4,45.3l1,33.8h39.8c31.8,0,51.6-0.4,59.5-1.2c7.9-0.8,15.5-2.7,22.8-5.7c1.4-3.3,3.5-10.7,6.2-22.5
 +
c2.7-11.7,4.1-18.5,4.2-20.3l1.8-1.6h9.6l1.4,1.6c-1,5.2-2.1,15.3-3.2,30.3c-1.1,15-1.7,27.1-1.7,36.3l-1.6,1.6
 +
c-24.7-0.8-57.2-1.2-97.5-1.2l-57-0.4c-13,0-26.3,0.5-39.8,1.6l-1.6-1.6v-6.4l1.6-2c8.1-4.2,12.5-6.7,13.3-7.6
 +
c0.8-0.9,1.6-9.3,2.4-25.2c0.8-15.9,1.3-35,1.3-57.4v-83.8l-0.4-38.1c-0.1-14.8-0.5-24.4-1.1-28.7s-1.5-7.2-2.7-8.6
 +
c-1.2-1.4-3.6-2.6-7.1-3.5c-3.5-0.9-12.2-1.6-26-2.1l-1.6-1.4V32.7z"/>
 +
<path class="st0" d="M1488,308.8l-1.8-1.6v-10.2l1.8-1.6c9.5-0.1,15.6-0.6,18.4-1.5c2.7-0.8,5.2-2.5,7.3-5.1s6.5-10.8,13-24.9
 +
l20.5-44.5l53.1-120.3c10-23.6,20-47.1,29.9-70.7h12.7l83.4,196.1l11.1,26.2c3.3,7.4,7,15.5,11.2,24.2c4.2,8.7,7.2,13.9,8.8,15.4
 +
c1.6,1.6,3.6,2.8,6.1,3.6c2.4,0.8,7.8,1.3,16.1,1.5l1.6,1.6v10.2l-1.6,1.6c-13.8-1.2-26.2-1.8-37.3-1.8
 +
c-21.6,0.7-43.2,1.2-64.8,1.8l-1.6-1.6v-10.2l1.6-1.6c14.6-0.3,23.7-0.9,27.3-1.9c3.6-1,5.5-3.2,5.5-6.7c0-2.9-0.9-6.6-2.7-11.3
 +
l-24-59.6h-113.1l-21.3,50c-3.8,9-5.7,15.6-5.7,19.7c0,3.3,1.8,5.7,5.3,7.2s12.4,2.4,26.6,2.5l1.8,1.6v10.2l-1.6,1.6
 +
c-16.8-1-31.5-1.6-44.1-1.6C1517.1,307.3,1502.6,307.8,1488,308.8z M1577.1,199.3h98.8l-49-117.8L1577.1,199.3z"/>
 +
<path class="st0" d="M1797.6,43.8l-1.6-1.4v-9.8l1.6-1.4c22.3,1,39.5,1.6,51.6,1.6c4.6,0,22.6-0.5,54.1-1.6
 +
c10.2-0.3,17.5-0.4,22.1-0.4c17.6,0,31.5,1.8,41.8,5.3c10.3,3.5,18.6,9.7,24.8,18.7c6.3,8.9,9.4,19,9.4,30.4
 +
c0,14.5-5.2,27.9-15.6,40.2c-10.4,12.4-27.3,21.2-50.8,26.6c14.1,1.3,25.7,3.2,34.8,5.7c9.1,2.5,17,6.3,23.6,11.4
 +
c6.6,5.1,11.9,11.8,15.7,20c3.8,8.2,5.8,17.7,5.8,28.5c0,8.5-1.3,17.1-3.9,25.8c-2.6,8.7-7.4,17.4-14.4,26
 +
c-7,8.6-15.4,16-25.3,22.1c-9.9,6.1-20,10.5-30.4,13.3s-23.2,4.1-38.6,4.1c-3.1,0-12.5-0.3-28.1-1c-17.3-0.4-26.7-0.6-28.1-0.6
 +
c-8.9,0-19.7,0.5-32.6,1.6l-1.6-1.6v-6.4l1.6-2c7.5-3.4,11.9-5.7,13.1-7c1.2-1.3,2.1-12.8,2.8-34.6c0.7-21.7,1.1-38.3,1.1-49.8
 +
v-71.7l-0.2-44.3c0-9.6-0.1-17.5-0.4-23.5c-0.3-6.1-0.6-10.4-1.1-13c-0.5-2.6-1.2-4.4-2.2-5.5c-1-1-2.5-1.9-4.4-2.6
 +
c-1.9-0.7-5.1-1.3-9.7-1.9L1797.6,43.8z M1867.7,146.3c6.5,0.5,13.9,0.8,22.1,0.8c27,0,45.7-4.8,56.3-14.5
 +
c10.5-9.6,15.8-22.9,15.8-39.6c0-9.8-2-18.1-6.1-24.9c-4-6.8-10.4-12.1-19-15.7c-8.7-3.6-20.4-5.5-35.3-5.5c-12.1,0-22.8,1-32,2.9
 +
c-1.2,11.7-1.8,32.2-1.8,61.3V146.3z M1868.1,288.7c10,2.3,20.3,3.5,30.9,3.5c18.6,0,33.2-3,43.8-9c10.5-6,18.3-14.3,23.3-24.9
 +
c5-10.6,7.5-22.2,7.5-34.7c0-18.8-5.3-33.8-15.9-45c-10.6-11.3-33.6-16.9-68.8-16.9c-5.9,0-12.9,0.3-21.1,0.8v66.6L1868.1,288.7z"
 +
/>
 +
 +
</g>
 +
</svg>
 +
 +
 +
 +
</div>
 +
 +
 +
 +
 +
 +
 +
 
     </head>
 
     </head>
  
Line 27: Line 273:
 
                 <div style="height:5em;"></div>
 
                 <div style="height:5em;"></div>
 
                 <!-- FROM THIS POINT DOWNWARDS YOU START ADDING YOUR STUFF -->
 
                 <!-- FROM THIS POINT DOWNWARDS YOU START ADDING YOUR STUFF -->
 +
ING YOUR STUFF -->
 
                  
 
                  
 
  <h1>Purpose</h1>
 
  <h1>Purpose</h1>

Revision as of 00:24, 12 October 2018



/*****Code related to Animations*/