Team:UNITN-Trento/CSS/Products

From 2013.igem.org

(Difference between revisions)

Revision as of 16:16, 22 September 2013

.container .sheet {

   position: relative;
   min-height: 510px;

}

.container .sheet .guide {

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

}

.container .sheet .bubble {

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

}

.container .sheet .bubble .pointer {

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

}

.container .sheet .dots {

   position: absolute;
   top: 180px;
   right: 10px;
   width: 650px;

}

.container .sheet .dots > div {

   display: inline-block;
   width: 300px;
   margin: 10px;
   text-align: center;
   vertical-align: top;

}

.container .sheet .dots div .circle {

   height: 250px;
   width: 250px;
   filter: grayscale(100%);
   -ms-filter: grayscale(100%);
   -webkit-filter: grayscale(100%);

}

.container .sheet .dots div .circle:hover {

   filter: grayscale(0%);
   -ms-filter: grayscale(0%);
   -webkit-filter: grayscale(0%);

}

.container .sheet .dots .descr {

   padding: 10px;
   text-align: justify;

}

@@ Line 1: / Line 1: @@
 .container .sheet {
      position: relative;
-     min-height: 600px;
+     min-height: 510px;
 }
@@ Line 51: / Line 51: @@
      margin: 10px;
      text-align: center;
+    vertical-align: top;
 }
@@ Line 56: / Line 57: @@
      height: 250px;
      width: 250px;
+    filter: grayscale(100%);
+    -ms-filter: grayscale(100%);
+    -webkit-filter: grayscale(100%);
+}
+.container .sheet .dots div .circle:hover {
+    filter: grayscale(0%);
+    -ms-filter: grayscale(0%);
+    -webkit-filter: grayscale(0%);
 }