Team:Heidelberg/css/frontpage

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
#ring {
#ring {
-
  position: absolute;
+
  position: absolute;
-
  z-index: 1025;
+
  z-index: 1025;
}
}
.container {
.container {
-
  position: relative;
+
  position: relative;
-
  overflow: hidden;
+
  overflow: hidden;
}
}
.slide {
.slide {
-
  position: relative;
+
  position: relative;
-
  margin-bottom: 0;
+
  margin-bottom: 0;
}
}
-
.first {
+
.dark-grey {
-
    background-color: #515151;
+
  background-color: #515151;
}
}
-
.second {
+
.grey {
-
    background-color: #e0e0e0;
+
  background-color: #e0e0e0;
}
}
-
.third {
+
.red {
-
    background-color: #ad342a;
+
  background-color: #ad342a;
-
    color: white;
+
  color: white;
}
}
.arrow {
.arrow {
-
    position: absolute;
+
  position: absolute;
-
    right: 0;
+
  right: 0;
-
    background-repeat: no-repeat;
+
  background-repeat: no-repeat;
-
    z-index: 1020;
+
  z-index: 1020;
-
    height: 50px;
+
  height: 50px;
-
    bottom: -50px;
+
  bottom: -50px;
}
}
.arrow-right {
.arrow-right {
-
    background-position: 85% 0;
+
  background-position: 85% 0;
}
}
.arrow-left {
.arrow-left {
-
    background-position: 15% 0;
+
  background-position: 15% 0;
}
}
-
.arrow-dark {
+
.grey .arrow {
-
    background-image: url("/wiki/images/0/03/Heidelberg_Dreieck.png");
+
  background-image: url("/wiki/images/0/0b/Heidelberg_Dreieck-light.png");
}
}
-
.arrow-light {
+
.dark-grey .arrow {
-
    background-image: url("/wiki/images/0/0b/Heidelberg_Dreieck-light.png");
+
  background-image: url("/wiki/images/0/03/Heidelberg_Dreieck.png");
 +
}
 +
 
 +
.red .arrow {
 +
  background-image: url("/wiki/images/0/0b/Heidelberg_Dreieck-light.png");
 +
}
 +
 
 +
.arrow-red {
 +
  background-image: url("/wiki/images/0/0b/Heidelberg_Dreieck-light.png");
}
}
.impressiv h1{
.impressiv h1{
Line 64: Line 72:
#nav-wrapper{
#nav-wrapper{
-
width:100%;
+
  width:100%;
-
position: fixed;
+
  position: fixed;
-
z-index: 1030;
+
  z-index: 1030;
-
height: 0;
+
  height: 0;
-
overflow: visible;
+
  overflow: visible;
}
}

Revision as of 14:29, 25 September 2014

  1. ring { 
 position: absolute;
 z-index: 1025;

}

.container { 

 position: relative;
 overflow: hidden;

}

.slide { 

 position: relative;
 margin-bottom: 0;

}

.dark-grey { 

 background-color: #515151;

}

.grey { 

 background-color: #e0e0e0;

}

.red { 

 background-color: #ad342a;
 color: white;

}

.arrow { 

 position: absolute;
 right: 0;
 background-repeat: no-repeat;
 z-index: 1020;
 height: 50px;
 bottom: -50px;

}

.arrow-right { 

 background-position: 85% 0;

}

.arrow-left { 

 background-position: 15% 0;

}

.grey .arrow { 

 background-image: url("/wiki/images/0/0b/Heidelberg_Dreieck-light.png");

}

.dark-grey .arrow { 

 background-image: url("/wiki/images/0/03/Heidelberg_Dreieck.png");

}

.red .arrow { 

 background-image: url("/wiki/images/0/0b/Heidelberg_Dreieck-light.png");

}

.arrow-red { 

 background-image: url("/wiki/images/0/0b/Heidelberg_Dreieck-light.png");

} .impressiv h1{ 

 text-transform: uppercase;
 font-weight: bold;

}

.impressiv { 

 color:white;
 text-align: right;
 display: inline-block;
 vertical-align: middle;

}

  1. nav-wrapper{ 
 width:100%;
 position: fixed;
 z-index: 1030;
 height: 0;
 overflow: visible;

}

  1. front-nav { 
 overflow: visible;
 position:relative;
 margin: 20px;
 margin-left: auto;
 margin-right: auto;

}

  1. front-nav > ul { 
 position:absolute;
 right:0;
 list-style-type: none;
 margin: 0;
 padding-right: 40px;

}

  1. front-nav > ul > li { 
 display: inline;

}

  1. front-nav > ul > li a { 
 display:inline-block;
 width:50px;

}

  1. front-nav > ul > li > a > img{ 
 height: 40px;

}

  1. front-nav { 
 width: 100%;

}

.arrow { 

 width: 100%;

}

@media (min-width: 768px){ 

 #front-nav {
   width: 750px;
 }
 .arrow {
   width: 750px;
 }

}


@media (min-width: 992px) { 

 #front-nav {
   width: 970px;
 }
 .arrow {
   width: 970px;
 }

}

@media (min-width: 1200px) { 

 #front-nav {
   width: 1170px;
 }
 .arrow {
   width: 1170px;
 }

}

Retrieved from "http://2014.igem.org/Team:Heidelberg/css/frontpage"