Difference between revisions of "Template:TPHS San Diego"

 
(122 intermediate revisions by 2 users not shown)
Line 5: Line 5:
 
#home_logo, #sideMenu { display:none; }
 
#home_logo, #sideMenu { display:none; }
 
#sideMenu, #top_title, .patrollink  {display:none;}
 
#sideMenu, #top_title, .patrollink  {display:none;}
body{background: white}
+
body{background: #444444}
 
#content { margin-left:0px; margin-top:-7px; padding:0px; margin:0px; width:100%;}
 
#content { margin-left:0px; margin-top:-7px; padding:0px; margin:0px; width:100%;}
  
Line 20: Line 20:
 
*/
 
*/
  
html, body{
+
*{
 
     margin: 0;
 
     margin: 0;
 
     padding: 0;
 
     padding: 0;
 
}
 
}
 
hr {
 
  display:inline-block;
 
  position:relative;
 
  top:100px;
 
  border-bottom: 1px solid red;
 
  margin: 1em 0;
 
  padding: 0;
 
}
 
 
.logo
 
{
 
  display:inline-block;
 
  position:relative;
 
  top:-55px;
 
  left:30px;
 
  padding-top:20px;
 
  padding-bottom:20px;
 
  height:150px;
 
  width:180px;
 
  float:left;
 
  background-color:#FFF;
 
  border-bottom-style:solid;
 
  border-bottom-color:red;
 
  border-radius:50%;
 
}
 
 
 
.navbar
 
{
 
  margin-top:-8px;
 
  overflow: hidden;
 
  background-color:#FFF;
 
  font-family: Arial;
 
  font-size:16px;
 
  padding-top:0px;
 
  padding-bottom:20px;
 
  padding-left:150px;
 
  border-bottom-style:solid;
 
  border-bottom-color:red;
 
}
 
 
/* Links inside the navbar */
 
.navbar a
 
{
 
  position:relative;
 
  top:-10px;
 
  float: left;
 
  font-size: 18px;
 
  font-weight:450;
 
  color:black;
 
  text-align: center;
 
  padding: 14px 50px;
 
  text-decoration: none;
 
}
 
 
/* The dropdown container */
 
.dropdown
 
{
 
  float: left;
 
  overflow: hidden;
 
}
 
 
/* Dropdown button */
 
.dropdown .dropbtn
 
{
 
  display:inline-block;
 
  font-size: 16px;
 
  border: none;
 
  outline: none;
 
  color: black;
 
  font-weight:700;
 
  font-size:20px;
 
  padding: 14px 50px;
 
  background-color: inherit;
 
  font-family: inherit; /* Important for vertical align on mobile phones */
 
  margin: 0; /* Important for vertical align on mobile phones */
 
}
 
 
/* Add a red background color to navbar links on hover */
 
.navbar a:hover, .dropdown:hover .dropbtn
 
{
 
  background-color:rgba(255, 229, 7, 0.47);
 
}
 
 
/* Dropdown content (hidden by default) */
 
.dropdown-content
 
{
 
  display: none;
 
  position: absolute;
 
  background-color: #f9f9f9;
 
  min-width: 160px;
 
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
 
  z-index: 1;
 
}
 
 
/* Links inside the dropdown */
 
.dropdown-content a
 
{
 
  float: none;
 
  color: black;
 
  padding: 12px 16px;
 
  text-decoration: none;
 
  display: block;
 
  text-align: left;
 
}
 
 
/* Add a grey background color to dropdown links on hover */
 
.dropdown-content a:hover
 
{
 
  background-color: #ddd;
 
}
 
 
/* Show the dropdown menu on hover */
 
.dropdown:hover .dropdown-content
 
{
 
  display: block;
 
}
 
 
  
 
.fullscreen_section{
 
.fullscreen_section{
 
     width: 100vw;
 
     width: 100vw;
 
     height: 100vh;
 
     height: 100vh;
 +
background: #444444;
 
}
 
}
  
Line 152: Line 34:
 
     width: 100vw;
 
     width: 100vw;
 
     height: 30vh;
 
     height: 30vh;
 +
    box-shadow: inset 0 0 20px #333333;
 
}
 
}
  
Line 230: Line 113:
  
 
#section4{
 
#section4{
     margin-bottom: 10vh;
+
     background-color: #EEEEEE;
    background-color: rgb(68, 68, 68);
+
margin: 0;
 
}
 
}
  
Line 250: Line 133:
 
     left: 15vw;
 
     left: 15vw;
 
     width: 70vw;
 
     width: 70vw;
    margin-bottom: 5vh;
 
 
}
 
}
  
Line 256: Line 138:
 
     font-family: Arial;
 
     font-family: Arial;
 
     font-size: 2em;
 
     font-size: 2em;
     color: rgb(68, 68, 68);
+
     color: #EEEEEE;
     margin: 20px;
+
     padding: 20px;
 +
    z-index: 10;
 
}
 
}
  
Line 346: Line 229:
 
     background-size: cover;
 
     background-size: cover;
 
     display: inline-block;
 
     display: inline-block;
 +
}
 +
 +
.fullscreen {
 +
background-color: #111111;
 +
  background-image:url("https://static.igem.org/mediawiki/2018/0/0f/T--TPHS_San_Diego--Fungal_wall.jpg");
 +
  -webkit-background-size: contain;
 +
  -moz-background-size: contain;
 +
  -o-background-size: contain;
 +
  background-size: contain;
 +
background-repeat: no-repeat;
 +
padding-bottom: 200px;
 +
}
 +
 +
slider {
 +
                display:block;
 +
                width:100%;
 +
                height:100%;
 +
                background-color:#1f1f1f;
 +
                overflow:hidden;
 +
                position:relative;
 +
            }
 +
           
 +
            slider > * {
 +
                position:absolute;
 +
                display:block;
 +
                width:100%;
 +
                height:100%;
 +
                background:#1f1f1f;
 +
                animation: slide 12s infinite;
 +
                overflow:hidden;
 +
box-shadow: inset 0 0 20px black;
 +
            }
 +
           
 +
            slide:nth-child(1){
 +
                left:0%;
 +
                animation-delay: -1s;
 +
                background-image: url("https://static.igem.org/mediawiki/2018/5/52/T--TPHS_San_Diego--back_1.jpg");
 +
                background-size:cover;
 +
                background-position:center;
 +
background-attachment: fixed;
 +
visibility: hidden;
 +
image-rendering: -webkit-optimize-contrast;
 +
background-size: cover;
 +
background-position:50% 50%;
 +
            }
 +
           
 +
            slide:nth-child(2){
 +
                left:0%;
 +
                animation-delay: 2s;
 +
                background-image: url("https://static.igem.org/mediawiki/2018/2/2a/T--TPHS_San_Diego--back_2.jpg");
 +
                background-size:cover;
 +
                background-position:center;
 +
background-attachment: fixed;
 +
visibility: hidden;
 +
image-rendering: -webkit-optimize-contrast;
 +
background-size: cover;
 +
background-position:50% 50%;
 +
            }
 +
           
 +
            slide:nth-child(3){
 +
                animation-delay: 5s;
 +
                background-image: url("https://static.igem.org/mediawiki/2018/1/11/T--TPHS_San_Diego--back_3.jpg");
 +
                background-size:cover;
 +
                background-position:center;
 +
background-attachment: fixed;
 +
visibility: hidden;
 +
image-rendering: -webkit-optimize-contrast;
 +
background-size: cover;
 +
background-position:50% 50%;
 +
            }
 +
           
 +
            slide:nth-child(4){
 +
                left:0%;
 +
                animation-delay: 8s;
 +
                background-image: url("https://static.igem.org/mediawiki/2018/b/b3/T--TPHS_San_Diego--Homepage4.png");
 +
                background-size:cover;
 +
                background-position:center;
 +
background-attachment: fixed;
 +
visibility: hidden;
 +
image-rendering: -webkit-optimize-contrast;
 +
background-size: cover;
 +
background-position:50% 50%;
 +
            }
 +
         
 +
 +
            .slide_container {
 +
display:inline-block;
 +
                position: absolute;
 +
bottom: 0;
 +
                font-family:Arial;
 +
                font-size:30px;
 +
                text-align:center;
 +
margin: 50px;
 +
                padding: 20px;
 +
                width:40%;
 +
               
 +
                /*height: 40%;*/
 +
                background: #333333;
 +
                color:#fff;
 +
box-shadow: 0 0 20px black;
 +
line-height: 30px;
 +
            }
 +
           
 +
            @keyframes slide {
 +
                0% {left: 100%; width:100%;visibility: visible;}
 +
                5% {left: 0%; visibility: visible;}
 +
                25% {left: 0%;visibility: visible;}
 +
                30%{left :-100%; width:100%;visibility: visible;}
 +
                30.001%{left:-100%; width:0%;visibility: visible;}
 +
                100% {left:100%; width:0%;visibility: visible;}
 +
            }
 +
 +
p{
 +
margin: 0 !important;
 +
padding: 0 !important;
 
}
 
}
 
</style>
 
</style>
 
</html>
 
</html>

Latest revision as of 00:34, 18 October 2018