Difference between revisions of "Team:Uppsala/InterLab"

Line 8: Line 8:
 
<html>
 
<html>
 
     <head>
 
     <head>
         <style type="text/css">
+
         <style type="text/css">
 
+
        </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 {
 
             .parallax {
 
                 /* The image used */
 
                 /* The image used */
 
                 background-image: url("https://static.igem.org/mediawiki/2018/f/f3/T--Uppsala--HEADER_INTERLAB_3.jpeg");
 
                 background-image: url("https://static.igem.org/mediawiki/2018/f/f3/T--Uppsala--HEADER_INTERLAB_3.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%;
+
}
+
  
  
Line 158: Line 22:
  
  
 
+
</head>
  
  
Line 257: Line 121:
  
  
     </head>
+
      
  
 
     <div class="body">
 
     <div class="body">

Revision as of 13:51, 16 October 2018



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