Team:UCLA/Template/CSS

From 2014.igem.org

(Difference between revisions)
Line 577: Line 577:
     background-position: 0% 65%;
     background-position: 0% 65%;
}
}
-
.slider .slider_imgs #slide5{
+
</style>
 +
 
 +
 
 +
 
 +
<!--HP SLIDER-->
 +
<style type="text/css">
 +
.hpslider{
 +
    position: relative;
 +
    width: 1150px;
 +
    height: 350px;
 +
    margin: auto;
 +
    overflow: hidden;
 +
    z-index: 13;
 +
    background-image: url('http://2014.igem.org/wiki/images/c/c3/Debut_light.png');
 +
}
 +
.hpslider .hpslider_left{
 +
    position: absolute;
 +
    background-color:black;
 +
    top: 0px;   
 +
    left: 0px;
 +
    width: 50px;
 +
    height: 100%;
 +
    opacity: 0.5;
 +
    z-index: 2;
 +
}
 +
.hpslider .hpslider_left img{
 +
    position: relative;
 +
    width: 100%;
 +
    height: 200px;
 +
    top: 25%;
 +
    left: 10px;
 +
}
 +
.hpslider .hpslider_right{
 +
    position: absolute;
 +
    background-color:black;
 +
    top: 0px;
 +
    left: 1100px;
 +
    width: 50px;
 +
    height: 100%;
 +
    opacity: 0.5;
 +
    z-index: 2;
 +
}
 +
.hpslider .hpslider_right img{
 +
    position: relative;
 +
    width: 100%;
 +
    height: 200px;
 +
    top: 25%;
 +
    left: -10px;
 +
}
 +
.hpslider .hpslider_imgs{
 +
    position: absolute;
 +
}
 +
.hpslider .hpslider_imgs div{
 +
  float: left;
 +
  width: 1150px;
 +
  height: 350px;
 +
}
 +
.hpslider .hpslider_imgs #slide1{
 +
  float: left;
 +
    background-image:url('http://2014.igem.org/wiki/images/d/d1/Silkworms.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 25% 50%;
 +
}
 +
.hpslider .hpslider_imgs #slide2{
 +
  float: left;
 +
    background-image:url('http://2014.igem.org/wiki/images/8/81/Classroom.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 0% 50%;
 +
}
 +
.hpslider .hpslider_imgs #slide3{
 +
  float: left;
 +
    background-image:url('http://2014.igem.org/wiki/images/f/fa/Cocoons.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
}
 +
.hpslider .hpslider_imgs #slide4{
 +
  float: left;
 +
    background-image:url('http://2014.igem.org/wiki/images/f/fd/Uclateam.JPG');
 +
    background-size: cover;
 +
    background-repeat: no-repeat;
 +
    background-position: 0% 65%;
 +
}
 +
.hpslider .hpslider_imgs #slide5{
   float: left;
   float: left;
     background-image:url('http://2014.igem.org/wiki/images/2/28/Fahrion_UCLA_iGEM_statement.JPG');
     background-image:url('http://2014.igem.org/wiki/images/2/28/Fahrion_UCLA_iGEM_statement.JPG');
Line 584: Line 668:
     background-position: 0% 65%;
     background-position: 0% 65%;
}
}
-
.slider .slider_imgs #slide6{
+
.hpslider .hpslider_imgs #slide6{
   float: left;
   float: left;
     background-image:url('http://2014.igem.org/wiki/images/9/96/Fahrion_Non_Fluoresce.JPG');
     background-image:url('http://2014.igem.org/wiki/images/9/96/Fahrion_Non_Fluoresce.JPG');
Line 591: Line 675:
     background-position: 0% 65%;
     background-position: 0% 65%;
}
}
-
.slider .slider_imgs #slide7{
+
.hpslider .hpslider_imgs #slide7{
   float: left;
   float: left;
     background-image:url('http://2014.igem.org/wiki/images/b/b3/Fahrion_Blue_Fluoresce_side.JPG');
     background-image:url('http://2014.igem.org/wiki/images/b/b3/Fahrion_Blue_Fluoresce_side.JPG');
Line 598: Line 682:
     background-position: 0% 65%;
     background-position: 0% 65%;
}
}
-
.slider .slider_imgs #slide8{
+
.hpslider .hpslider_imgs #slide8{
   float: left;
   float: left;
     background-image:url('http://2014.igem.org/wiki/images/4/4c/Fahrion_process_Anuved_Dewal.JPG');
     background-image:url('http://2014.igem.org/wiki/images/4/4c/Fahrion_process_Anuved_Dewal.JPG');
Line 605: Line 689:
     background-position: 0% 65%;
     background-position: 0% 65%;
}
}
-
.slider .slider_imgs #slide9{
+
.hpslider .hpslider_imgs #slide9{
   float: left;
   float: left;
     background-image:url('http://2014.igem.org/wiki/images/9/95/Fahrion_Process_full.JPG');
     background-image:url('http://2014.igem.org/wiki/images/9/95/Fahrion_Process_full.JPG');
Line 612: Line 696:
     background-position: 0% 65%;
     background-position: 0% 65%;
}
}
-
.slider .slider_imgs #slide10{
+
.hpslider .hpslider_imgs #slide10{
   float: left;
   float: left;
     background-image:url('http://2014.igem.org/wiki/images/f/f4/Fahrion_full_nonfluoresce.JPG');
     background-image:url('http://2014.igem.org/wiki/images/f/f4/Fahrion_full_nonfluoresce.JPG');
Line 619: Line 703:
     background-position: 0% 65%;
     background-position: 0% 65%;
}
}
-
.slider .slider_imgs #slide11{
+
.hpslider .hpslider_imgs #slide11{
   float: left;
   float: left;
     background-image:url('http://2014.igem.org/wiki/images/5/58/Fahrion_Group.JPG');
     background-image:url('http://2014.igem.org/wiki/images/5/58/Fahrion_Group.JPG');
Line 626: Line 710:
     background-position: 0% 65%;
     background-position: 0% 65%;
}
}
-
.slider .slider_imgs #slide12{
+
.hpslider .hpslider_imgs #slide12{
   float: left;
   float: left;
     background-image:url('http://2014.igem.org/wiki/images/b/be/Fahrion_David_Discussion.JPG');
     background-image:url('http://2014.igem.org/wiki/images/b/be/Fahrion_David_Discussion.JPG');
Line 633: Line 717:
     background-position: 0% 65%;
     background-position: 0% 65%;
}
}
-
.slider .slider_imgs #slide13{
+
.hpslider .hpslider_imgs #slide13{
   float: left;
   float: left;
     background-image:url('http://2014.igem.org/wiki/images/5/59/Fahrion_Process_Aal.JPG');
     background-image:url('http://2014.igem.org/wiki/images/5/59/Fahrion_Process_Aal.JPG');
Line 640: Line 724:
     background-position: 0% 65%;
     background-position: 0% 65%;
}
}
-
.slider .slider_imgs #slide14{
+
.hpslider .hpslider_imgs #slide14{
   float: left;
   float: left;
     background-image:url('http://2014.igem.org/wiki/images/f/fa/Cocoons.JPG');
     background-image:url('http://2014.igem.org/wiki/images/f/fa/Cocoons.JPG');
Line 647: Line 731:
     background-position: 0% 65%;
     background-position: 0% 65%;
}
}
-
.slider .slider_imgs #slide15{
+
.hpslider .hpslider_imgs #slide15{
   float: left;
   float: left;
     background-image:url('http://2014.igem.org/wiki/images/e/ef/Fahrion_Blue_Straight.JPG');
     background-image:url('http://2014.igem.org/wiki/images/e/ef/Fahrion_Blue_Straight.JPG');
Line 654: Line 738:
     background-position: 0% 65%;
     background-position: 0% 65%;
}
}
-
.slider .slider_imgs #slide16{
+
.hpslider .hpslider_imgs #slide16{
   float: left;
   float: left;
     background-image:url('http://2014.igem.org/wiki/images/6/62/Fahrion_Process_Observers.JPG');
     background-image:url('http://2014.igem.org/wiki/images/6/62/Fahrion_Process_Observers.JPG');
Line 661: Line 745:
     background-position: 0% 65%;
     background-position: 0% 65%;
}
}
-
.slider .slider_imgs #slide17{
+
.hpslider .hpslider_imgs #slide17{
   float: left;
   float: left;
     background-image:url('http://2014.igem.org/wiki/images/f/fd/Uclateam.JPG');
     background-image:url('http://2014.igem.org/wiki/images/f/fd/Uclateam.JPG');
Line 668: Line 752:
     background-position: 0% 65%;
     background-position: 0% 65%;
}
}
-
.slider .slider_imgs #slide18{
+
.hpslider .hpslider_imgs #slide18{
   float: left;
   float: left;
     background-image:url('http://2014.igem.org/wiki/images/5/57/Fahrion_Historical_Wall.JPG');
     background-image:url('http://2014.igem.org/wiki/images/5/57/Fahrion_Historical_Wall.JPG');
-
    background-size: cover;
 
-
    background-repeat: no-repeat;
 
-
    background-position: 0% 65%;
 
-
}
 
-
 
-
 
-
.slider #hp{
 
-
    z-index:100;
 
-
}
 
-
</style>
 
-
 
-
 
-
 
-
<!--HP SLIDER-->
 
-
<style type="text/css">
 
-
.hpslider{
 
-
    position: relative;
 
-
    width: 1150px;
 
-
    height: 350px;
 
-
    margin: auto;
 
-
    overflow: hidden;
 
-
    z-index: 13;
 
-
    background-image: url('http://2014.igem.org/wiki/images/c/c3/Debut_light.png');
 
-
}
 
-
.hpslider .hpslider_left{
 
-
    position: absolute;
 
-
    background-color:black;
 
-
    top: 0px;   
 
-
    left: 0px;
 
-
    width: 50px;
 
-
    height: 100%;
 
-
    opacity: 0.5;
 
-
    z-index: 2;
 
-
}
 
-
.hpslider .hpslider_left img{
 
-
    position: relative;
 
-
    width: 100%;
 
-
    height: 200px;
 
-
    top: 25%;
 
-
    left: 10px;
 
-
}
 
-
.hpslider .hpslider_right{
 
-
    position: absolute;
 
-
    background-color:black;
 
-
    top: 0px;
 
-
    left: 1100px;
 
-
    width: 50px;
 
-
    height: 100%;
 
-
    opacity: 0.5;
 
-
    z-index: 2;
 
-
}
 
-
.hpslider .hpslider_right img{
 
-
    position: relative;
 
-
    width: 100%;
 
-
    height: 200px;
 
-
    top: 25%;
 
-
    left: -10px;
 
-
}
 
-
.hpslider .hpslider_imgs{
 
-
    position: absolute;
 
-
}
 
-
.hpslider .hpslider_imgs div{
 
-
  float: left;
 
-
  width: 1150px;
 
-
  height: 350px;
 
-
}
 
-
.hpslider .hpslider_imgs #slide1{
 
-
  float: left;
 
-
    background-image:url('http://2014.igem.org/wiki/images/d/d1/Silkworms.JPG');
 
-
    background-size: cover;
 
-
    background-repeat: no-repeat;
 
-
    background-position: 25% 50%;
 
-
}
 
-
.hpslider .hpslider_imgs #slide2{
 
-
  float: left;
 
-
    background-image:url('http://2014.igem.org/wiki/images/8/81/Classroom.JPG');
 
-
    background-size: cover;
 
-
    background-repeat: no-repeat;
 
-
    background-position: 0% 50%;
 
-
}
 
-
.hpslider .hpslider_imgs #slide3{
 
-
  float: left;
 
-
    background-image:url('http://2014.igem.org/wiki/images/f/fa/Cocoons.JPG');
 
-
    background-size: cover;
 
-
    background-repeat: no-repeat;
 
-
}
 
-
.hpslider .hpslider_imgs #slide4{
 
-
  float: left;
 
-
    background-image:url('http://2014.igem.org/wiki/images/f/fd/Uclateam.JPG');
 
     background-size: cover;
     background-size: cover;
     background-repeat: no-repeat;
     background-repeat: no-repeat;

Revision as of 12:29, 17 October 2014