Difference between revisions of "Team:Colegio EmelinaU"

Line 238: Line 238:
 
margin-left: 150px;
 
margin-left: 150px;
 
                                 margin-top:-42px;
 
                                 margin-top:-42px;
−
    -webkit-animation-duration: 1s;
 
−
    animation-duration: 1s;
 
−
    -webkit-animation-fill-mode: both;
 
−
    animation-fill-mode: both;
 
−
}
 
−
 
−
@-webkit-keyframes lightSpeedIn {
 
−
  0% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; }
 
−
    60% { -webkit-transform: translateX(-20%) skewX(30deg); opacity: 1; }
 
−
    80% { -webkit-transform: translateX(0%) skewX(-15deg); opacity: 1; }
 
−
    100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; }
 
−
}
 
−
@keyframes lightSpeedIn {
 
−
    0% { transform: translateX(100%) skewX(-30deg); opacity: 0; }
 
−
    60% { transform: translateX(-20%) skewX(30deg); opacity: 1; }
 
−
    80% { transform: translateX(0%) skewX(-15deg); opacity: 1; }
 
−
    100% { transform: translateX(0%) skewX(0deg); opacity: 1; }
 
−
}
 
−
.lightSpeedIn {
 
−
    -webkit-animation-name: lightSpeedIn;
 
−
    animation-name: lightSpeedIn;
 
−
    -webkit-animation-timing-function: ease-out;
 
−
    animation-timing-function: ease-out;
 
−
}
 
−
.animated.lightSpeedIn {
 
−
    -webkit-animation-duration: 0.5s;
 
−
    animation-duration: 0.5s;
 
  
  
Line 302: Line 275:
 
     padding-top: 5px;
 
     padding-top: 5px;
 
             }
 
             }
 +
.animated {
 +
    -webkit-animation-duration: 1s;
 +
    animation-duration: 1s;
 +
    -webkit-animation-fill-mode: both;
 +
    animation-fill-mode: both;
 +
}
  
 +
@-webkit-keyframes flipInY {
 +
    0% {
 +
        -webkit-transform: perspective(400px) rotateY(90deg);
 +
        opacity: 0;
 +
    }
 +
    40% {
 +
        -webkit-transform: perspective(400px) rotateY(-10deg);
 +
    }
 +
    70% {
 +
        -webkit-transform: perspective(400px) rotateY(10deg);
 +
    }
 +
    100% {
 +
        -webkit-transform: perspective(400px) rotateY(0deg);
 +
        opacity: 1;
 +
    }
 +
}
 +
@keyframes flipInY {
 +
    0% {
 +
        transform: perspective(400px) rotateY(90deg);
 +
        opacity: 0;
 +
    }
 +
    40% {
 +
        transform: perspective(400px) rotateY(-10deg);
 +
    }
 +
    70% {
 +
        transform: perspective(400px) rotateY(10deg);
 +
    }
 +
    100% {
 +
        transform: perspective(400px) rotateY(0deg);
 +
        opacity: 1;
 +
    }
 +
}
 +
.flipInY {
 +
    -webkit-backface-visibility: visible !important;
 +
    -webkit-animation-name: flipInY;
 +
    backface-visibility: visible !important;
 +
    animation-name: flipInY;
 +
}
  
 
</style>
 
</style>
Line 323: Line 340:
  
 
<!-- This list is your menu, every list item is a menu button and nested listed become submenu buttons -->
 
<!-- This list is your menu, every list item is a menu button and nested listed become submenu buttons -->
−
<ul>
+
<ul class="animated flipInY">
 
<a href="https://2015.igem.org/Team:Example2"><li>HOME</li></a>
 
<a href="https://2015.igem.org/Team:Example2"><li>HOME</li></a>
  

Revision as of 04:50, 7 September 2015

Description:

According to the Ministry of Health in Chile in the last 5 years there have been 20-25 cases of skin cancer per 100 inhabitants. One of the main factors causing skin cancer is the ultraviolet radiation (UV). This is a natural radiation which in low dose is harmless to the cells, even it can be beneficial for an organism survival. However, when a certain amount is exceeded, it can cause a serious cell damage. The highest levels of UV radiation are reported in Chile. Our team proposes a system that alerts the intensity of UV radiation. In detail, the project it is represented in a bracelet which it is composed by Bacillus subtilis bacteria that is modified genetically with a system that senses ultraviolet light and according to the intensity it generate the correct coloration . This will allow people to protect themselves from UV rays when its intensity is harmful for the cells.