Difference between revisions of "Team:Grenoble-Alpes/Microfluidics"

 
(36 intermediate revisions by the same user not shown)
Line 54: Line 54:
 
               float:left;
 
               float:left;
 
               display:inline;
 
               display:inline;
 +
              z-index:2;
 
             }
 
             }
  
Line 61: Line 62:
 
               left: 47.5%;
 
               left: 47.5%;
 
               top: 31.5%;
 
               top: 31.5%;
 +
              z-index:3;
 
             }
 
             }
 
              
 
              
Line 69: Line 71:
 
               top: 15%;
 
               top: 15%;
 
               transform:rotate(90deg);
 
               transform:rotate(90deg);
 +
              z-index:3;
 +
              -webkit-filter: brightness(0.5);
 +
              -moz-filter: brightness(0.5);
 +
              -o-filter: brightness(0.5);
 +
              -ms-filter: brightness(0.5);
  
 +
              filter: brightness(0.5);
 
             }
 
             }
  
Line 79: Line 87:
 
               top: 42%;
 
               top: 42%;
 
               transform:rotate(180deg);
 
               transform:rotate(180deg);
−
            }
+
              z-index:3;
 +
              -webkit-filter: brightness(0.5);
 +
              -moz-filter: brightness(0.5);
 +
              -o-filter: brightness(0.5);
 +
              -ms-filter: brightness(0.5);
 +
 
 +
              filter: brightness(0.5);
 +
                }
  
 
.bobine_bot {
 
.bobine_bot {
Line 87: Line 102:
 
               top: 71%;
 
               top: 71%;
 
               transform:rotate(270deg);
 
               transform:rotate(270deg);
 +
              z-index:3;
 +
              -webkit-filter: brightness(0.5);
 +
              -moz-filter: brightness(0.5);
 +
              -o-filter: brightness(0.5);
 +
              -ms-filter: brightness(0.5);
 +
 +
              filter: brightness(0.5);
 
             }
 
             }
  
Line 94: Line 116:
 
               left: 38.5%;
 
               left: 38.5%;
 
               top: 42%;
 
               top: 42%;
−
            }         
+
              z-index:3;
−
     
+
−
 
+
−
 
+
−
.fond_motor:hover .bobine_left {
+
 
               -webkit-filter: brightness(0.5);
 
               -webkit-filter: brightness(0.5);
 
               -moz-filter: brightness(0.5);
 
               -moz-filter: brightness(0.5);
Line 105: Line 123:
  
 
               filter: brightness(0.5);
 
               filter: brightness(0.5);
 +
            }         
 +
     
 +
 +
 +
.stator_motor:hover .bobine_top {
 +
              -webkit-filter: brightness(1);
 +
              -moz-filter: brightness(1);
 +
              -o-filter: brightness(1);
 +
              -ms-filter: brightness(1);
 +
 +
              filter: brightness(1);
 
               }
 
               }
 +
 +
.stator_motor:hover .bobine_right {
 +
    -webkit-animation: illuminate_right 4s linear infinite;
 +
    -moz-animation: illuminate_right 4s linear infinite;
 +
    animation: illuminate_right 4s linear infinite;
 +
              }
 +
 +
 +
.stator_motor:hover .bobine_bot {
 +
    -webkit-animation: illuminate_bot 4s linear infinite;
 +
    -moz-animation: illuminate_bot 4s linear infinite;
 +
    animation: illuminate_bot 4s linear infinite;
 +
                }
 +
 +
.stator_motor:hover .bobine_left {
 +
    -webkit-animation: illuminate_left 4s linear infinite;
 +
    -moz-animation: illuminate_left 4s linear infinite;
 +
    animation: illuminate_left 4s linear infinite;
 +
              }
 +
 +
 +
.stator_motor:hover .bobine_top {
 +
    -webkit-animation: illuminate_top 4s linear infinite;
 +
    -moz-animation: illuminate_top 4s linear infinite;
 +
    animation: illuminate_top 4s linear infinite;
 +
              }
 +
 +
 +
.stator_motor:hover .rotor_motor {
 +
    -webkit-animation: turn 4s linear infinite;
 +
    -moz-animation: turn 4s linear infinite;
 +
    animation: turn 4s linear infinite;
 +
}
 +
 +
 +
 +
 +
@-moz-keyframes turn {
 +
    0% {transform: rotate(0deg)}
 +
    100% {transform: rotate(360deg)}
 +
}
 +
 +
@keyframes turn {
 +
    0% {transform: rotate(0deg)}
 +
    100% {transform:rotate(360deg)}
 +
}
 +
 +
@-webkit-keyframes turn {
 +
    0% {transform:rotate(0deg)}
 +
    100% {transform:rotate(360deg)}
 +
}
 +
 +
/************ Anim stepper right coal **********/
 +
 +
@-moz-keyframes illuminate_right {
 +
    0%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    13%  {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    37%  {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    50% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    100% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
}
 +
 +
@keyframes illuminate_right {
 +
    0%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    13%  {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    37%  {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    50% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    100% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
}
 +
 +
@-webkit-keyframes illuminate_right {
 +
    0%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    13%  {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    37%  {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    50% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    100% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
}
 +
 +
/************ Anim stepper bot coal **********/
 +
 +
@-moz-keyframes illuminate_bot {
 +
    0%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    25%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    38% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    62% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    75% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    100% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
}
 +
 +
@keyframes illuminate_bot {
 +
    0%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    25%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    38% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    62% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    75% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    100% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
}
 +
 +
@-webkit-keyframes illuminate_bot {
 +
    0%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    25%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    38% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    62% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    75% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    100% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
}
 +
 +
/************ Anim stepper left coal **********/
 +
 +
@-moz-keyframes illuminate_left {
 +
    0%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    50%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    63% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    87% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    100% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
}
 +
 +
@keyframes illuminate_left {
 +
    0%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    50%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    63% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    87% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    100% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
}
 +
 +
@-webkit-keyframes illuminate_left {
 +
    0%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    50%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    63% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    87% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    100% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
}
 +
 +
 +
/************ Anim stepper top coal **********/
 +
 +
@-moz-keyframes illuminate_top {
 +
    0%  {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    12%  {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    25%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    75% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    88% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    100% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
}
 +
 +
@keyframes illuminate_top {
 +
    0%  {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    12%  {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    25%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    75% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    88% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    100% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
}
 +
 +
@-webkit-keyframes illuminate_top {
 +
    0%  {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    12%  {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    25%  {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    75% {
 +
        filter: brightness(0.5);
 +
        -webkit-filter: brightness(0.5);
 +
    }
 +
    88% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
    100% {
 +
        filter: brightness(1);
 +
        -webkit-filter: brightness(1);
 +
    }
 +
}
  
  

Latest revision as of 08:21, 30 August 2017

Engineering

Microfluidics

Test

Test

Designed by iGEM Grenoble-Alpes 2017 team | Site Map