Team:UNITN-Trento/CSS/About us

From 2013.igem.org

(Difference between revisions)
(Created page with ".container .sheet { position: relative; min-height: 410px; } .container .sheet .guide { position: absolute; top: 0px; left: 0px; width: 250px; t...")
(Started styling map)
Line 46: Line 46:
     -ms-transform:rotate(90deg);
     -ms-transform:rotate(90deg);
     -webkit-transform:rotate(90deg);
     -webkit-transform:rotate(90deg);
 +
}
 +
 +
.container .sheet .map {
 +
    position: absolute;
 +
    top: 225px;
 +
    left: 230px;
 +
   
 +
    height: 100px;
 +
    width: 500px;
 +
   
 +
    background-color: transparent;
 +
}
 +
 +
.container .sheet .map td {
 +
    margin: 0 !important;
 +
    padding: 0.1em !important;
 +
}
 +
 +
.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 .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;
}
}

Revision as of 20:50, 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: 230px;
   
   height: 100px;
   width: 500px;
   
   background-color: transparent;

}

.container .sheet .map td {

   margin: 0 !important;
   padding: 0.1em !important;

}

.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 .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;

}