Team:UNITN-Trento/CSS/About us

From 2013.igem.org

(Difference between revisions)
(Started styling map)
(New map styling)
Line 51: Line 51:
     position: absolute;
     position: absolute;
     top: 225px;
     top: 225px;
-
     left: 230px;
+
     left: 310px;
      
      
     height: 100px;
     height: 100px;
Line 57: Line 57:
      
      
     background-color: transparent;
     background-color: transparent;
-
}
 
-
 
-
.container .sheet .map td {
 
-
    margin: 0 !important;
 
-
    padding: 0.1em !important;
 
}
}
Line 74: Line 69:
     border-radius: 10px;
     border-radius: 10px;
     box-shadow: 1px 1px 2px #323232;
     box-shadow: 1px 1px 2px #323232;
 +
}
 +
 +
.container .sheet .map #spot1 {
 +
    position: absolute;
 +
    top: 25px;
 +
    left: 80px;
 +
}
 +
 +
.container .sheet .map #spot2 {
 +
    position: absolute;
 +
    top: 25px;
 +
    left: 230px;
 +
}
 +
 +
.container .sheet .map #spot3 {
 +
    position: absolute;
 +
    top: 25px;
 +
    left: 380px;
 +
}
 +
 +
.container .sheet .map #spot4 {
 +
    position: absolute;
 +
    top: 50px;
 +
    left: 80px;
 +
}
 +
 +
.container .sheet .map #spot5 {
 +
    position: absolute;
 +
    top: 50px;
 +
    left: 230px;
 +
}
 +
 +
.container .sheet .map #spot6 {
 +
    position: absolute;
 +
    top: 50px;
 +
    left: 380px;
 +
}
 +
 +
.container .sheet .map .label {
 +
    font-family: "Cabin", sans-serif;
 +
}
 +
 +
.container .sheet .map #label1 {
 +
    position: absolute;
 +
    top: 0;
 +
    left: 60px;
 +
}
 +
 +
.container .sheet .map #label2 {
 +
    position: absolute;
 +
    top: 0;
 +
    left: 200px;
 +
}
 +
 +
.container .sheet .map #label3 {
 +
    position: absolute;
 +
    top: 0;
 +
    left: 365px;
 +
}
 +
.container .sheet .map #label4 {
 +
    position: absolute;
 +
    top: 75px;
 +
    left: 55px;
 +
}
 +
 +
.container .sheet .map #label5 {
 +
    position: absolute;
 +
    top: 75px;
 +
    left: 210px;
 +
}
 +
 +
.container .sheet .map #label6 {
 +
    position: absolute;
 +
    top: 75px;
 +
    left: 360px;
 +
}
 +
 +
.container .sheet .map #line1 {
 +
    position: absolute;
 +
    top: 30px;
 +
    left: 99px;
 +
    width: 130px;
 +
}
 +
 +
.container .sheet .map #line2 {
 +
    position: absolute;
 +
    top: 30px;
 +
    left: 249px;
 +
    width: 130px;
 +
}
 +
 +
.container .sheet .map #line3 {
 +
    position: absolute;
 +
    top: 55px;
 +
    left: 99px;
 +
    width: 130px;
 +
}
 +
 +
.container .sheet .map #line4 {
 +
    position: absolute;
 +
    top: 55px;
 +
    left: 249px;
 +
    width: 130px;
}
}

Revision as of 21:10, 22 September 2013

.container .sheet { 

   position: relative;
   min-height: 410px;

}

.container .sheet .guide { 

   position: absolute;
   top: 0px;
   left: 0px;
   
   width: 250px;
   transform:rotate(-15deg);

}

.container .sheet .bubble { 

   position: absolute;
   top: 10px;
   left: 230px;
   
   padding: 15px;
   width: 620px;
   
   background-color: white;
   border: 2px solid black;
   border-radius: 0.5em;
   
   font-family: "Cabin", cursive;

} .container .sheet .bubble .title { 

   font-size: 1.5em;
   margin: 0;

}

.container .sheet .bubble .title b { 

   font-size: 1.2em;
   font-family: "Boogaloo", sans-serif;
   color: green;

}

.container .sheet .bubble .pointer { 

   position: absolute;
   top: 20px;
   left: -23px;
   
   transform:rotate(90deg);
   -ms-transform:rotate(90deg);
   -webkit-transform:rotate(90deg);

}

.container .sheet .map { 

   position: absolute;
   top: 225px;
   left: 310px;
   
   height: 100px;
   width: 500px;
   
   background-color: transparent;

}

.container .sheet .map .spot { 

   display: block;
   
   width: 20px;
   height: 20px;
   
   background-color: #545454;
   border-bottom: 2px solid black;
   border-radius: 10px;
   box-shadow: 1px 1px 2px #323232;

}

.container .sheet .map #spot1 { 

   position: absolute;
   top: 25px;
   left: 80px;

}

.container .sheet .map #spot2 { 

   position: absolute;
   top: 25px;
   left: 230px;

}

.container .sheet .map #spot3 { 

   position: absolute;
   top: 25px;
   left: 380px;

}

.container .sheet .map #spot4 { 

   position: absolute;
   top: 50px;
   left: 80px;

}

.container .sheet .map #spot5 { 

   position: absolute;
   top: 50px;
   left: 230px;

}

.container .sheet .map #spot6 { 

   position: absolute;
   top: 50px;
   left: 380px;

}

.container .sheet .map .label { 

   font-family: "Cabin", sans-serif;

}

.container .sheet .map #label1 { 

   position: absolute;
   top: 0;
   left: 60px;

}

.container .sheet .map #label2 { 

   position: absolute;
   top: 0;
   left: 200px;

}

.container .sheet .map #label3 { 

   position: absolute;
   top: 0;
   left: 365px;

} .container .sheet .map #label4 { 

   position: absolute;
   top: 75px;
   left: 55px;

}

.container .sheet .map #label5 { 

   position: absolute;
   top: 75px;
   left: 210px;

}

.container .sheet .map #label6 { 

   position: absolute;
   top: 75px;
   left: 360px;

}

.container .sheet .map #line1 { 

   position: absolute;
   top: 30px;
   left: 99px;
   width: 130px;

}

.container .sheet .map #line2 { 

   position: absolute;
   top: 30px;
   left: 249px;
   width: 130px;

}

.container .sheet .map #line3 { 

   position: absolute;
   top: 55px;
   left: 99px;
   width: 130px;

}

.container .sheet .map #line4 { 

   position: absolute;
   top: 55px;
   left: 249px;
   width: 130px;

}

.container .sheet .map .spot:hover { 

   background-color: red;
   border-bottom: 2px solid #545454;
   box-shadow: 1px 1px 2px #323232 inset;

}

.container .sheet .map .line { 

   display: block;
   
   width: 100px;
   height: 5px;
   
   border-bottom: 2px dashed black;

}

Retrieved from "http://2013.igem.org/Team:UNITN-Trento/CSS/About_us"