|
|
(59 intermediate revisions not shown) |
Line 1: |
Line 1: |
- | @font-face {
| + | {{:Team:INSA-Lyon/template_head}} |
- | font-family: "Roboto";
| + | <html> |
- | src: url('font/RobotoCondensed-Regular.ttf');
| + | <head><link rel="stylesheet" type="text/css" href="https://2014.igem.org/Team:INSA-Lyon/css_home?action=raw&ctype=text/css" /></head> |
- | } | + | |
- | @font-face {
| + | |
- | font-family: "LatoReg";
| + | |
- | src: url('font/Lato-Reg.ttf');
| + | |
- | }
| + | |
- | @font-face {
| + | |
- | font-family: "LatoLig";
| + | |
- | src: url('font/Lato-Lig.ttf');
| + | |
- | }
| + | |
| | | |
- | html, body {
| + | <div id="accueil"> |
- | padding:0;
| + | |
- | margin-top: -10px;
| + | |
- | }
| + | |
| | | |
- | body {
| + | <div id="igem"> |
- | width: 100%;
| + | <a href="https://2014.igem.org/Main_Page"><img src="https://static.igem.org/mediawiki/2014/2/23/Insa_igem.png" alt="IGEM" /></a> |
- | }
| + | <MAP NAME="Link_HP"> |
| + | <AREA SHAPE="rect" COORDS="2,1,600,72" HREF="https://2014.igem.org/Team:INSA-Lyon/notice"></AREA> |
| + | </MAP> |
| + | </div> |
| | | |
- | p {
| + | <img src="https://static.igem.org/mediawiki/2014/f/f0/Igemresult.jpg" width="700px" /> |
- | font-family: "LatoReg", sans-serif;
| + | <div id="icones"> |
- | }
| + | |
| | | |
- | h2 {
| |
- | font-family: "LatoReg", sans-serif;
| |
- | color: #fff;
| |
- | font-size: 6em;
| |
- | bottom-bottom: -10px;
| |
- | font-weight: normal;
| |
- | line-height: 20px;
| |
- | }
| |
| | | |
- | h4 {
| + | <ul> |
- | font-family: "LatoLig", sans-serif;
| + | <li class="icon"><a href="https://2014.igem.org/Team:INSA-Lyon/Project" class="hu-icon"><img src="https://static.igem.org/mediawiki/2014/d/de/Insa_proj.png" alt="Picto Projet" /><br/>PROJECT</a></li> |
- | color: #fff;
| + | <li class="icon"><a href="https://2014.igem.org/Team:INSA-Lyon/Biology" class="hu-icon"><img src="https://static.igem.org/mediawiki/2014/3/3c/Insa_wet.png" alt="Picto Wetlab" /><br/>WETLAB</a></li> |
- | font-size: 3em;
| + | <li class="icon"><a href="https://2014.igem.org/Team:INSA-Lyon/Modeling" class="hu-icon"><img src="https://static.igem.org/mediawiki/2014/d/d1/Mod.png" /><br/>MODELING</a></li> |
- | bottom-bottom: -10px;
| + | <li class="icon"><a href="https://2014.igem.org/Team:INSA-Lyon/HumanPractice" class="hu-icon"><img src="https://static.igem.org/mediawiki/2014/8/83/Hum.png" alt="Picto Human practice" /><br/>HUMAN<br/>PRACTICE</a></li> |
- | font-weight: normal;
| + | <li class="icon"><a href="https://2014.igem.org/Team:INSA-Lyon/Team" class="hu-icon"><img src="https://static.igem.org/mediawiki/2014/archive/3/32/20141003084230%21Team.png" alt="Picto team" /><br/>TEAM</a></li> |
- | line-height: 20px;
| + | </ul> |
- | }
| + | |
| | | |
| + | </div> |
| + | </div> |
| | | |
- | h3 {
| |
- | font-family: "Roboto", sans-serif;
| |
- | color: #fff;
| |
- | font-size: 1.3em;
| |
- | text-align: center;
| |
- | font-weight: normal;
| |
- | }
| |
| | | |
- | ul {
| + | </html> |
- | list-style-type: none;
| + | {{:Team:INSA-Lyon/template_footer}} |
- | }
| + | |
- | | + | |
- | a {
| + | |
- | text-decoration: none;
| + | |
- | font-family: "Roboto", sans-serif;
| + | |
- | color: #fff;
| + | |
- | }
| + | |
- | | + | |
- | | + | |
- | /* MENU */
| + | |
- | #menu {
| + | |
- | position: fixed;
| + | |
- | width: 50px;
| + | |
- | top: 0;
| + | |
- | left: 0;
| + | |
- | bottom: 0;
| + | |
- | right: 0;
| + | |
- | background: #248588;
| + | |
- | }
| + | |
- | | + | |
- | #menuul{
| + | |
- | text-align: center;
| + | |
- | padding-bottom: 10px;
| + | |
- | margin: 0;
| + | |
- | width: 100%;
| + | |
- | padding: 0;
| + | |
- | position: absolute;
| + | |
- | top: 0;
| + | |
- | bottom: 0;
| + | |
- | left: 0;
| + | |
- | right: 0;
| + | |
- | }
| + | |
- | | + | |
- | .menuulli{
| + | |
- | margin: 0;
| + | |
- | display: block;
| + | |
- | height: 18%;
| + | |
- | position: relative;
| + | |
- | text-align: center;
| + | |
- | width: 100%;
| + | |
- | }
| + | |
- | | + | |
- | .menuullia {
| + | |
- | display: block;
| + | |
- | text-align: center;
| + | |
- | position: absolute;
| + | |
- | top: 0;
| + | |
- | bottom: 0;
| + | |
- | left: 0;
| + | |
- | right: 0;
| + | |
- | }
| + | |
- | | + | |
- | .menuullia span {
| + | |
- | -webkit-transform: rotateZ(-90deg);
| + | |
- | -moz-transform: rotateZ(-90deg);
| + | |
- | -o-transform: rotateZ(-90deg);
| + | |
- | transform: rotateZ(-90deg);
| + | |
- | display: block;
| + | |
- | top: 50%;
| + | |
- | position: absolute;
| + | |
- | margin-top: -8px;
| + | |
- | width: 50px;
| + | |
- | color: #FFFFFF;
| + | |
- | }
| + | |
- | | + | |
- | /* Sous menu */ | + | |
- | .ssmenu {
| + | |
- | width: 250px;
| + | |
- | height: 350px;
| + | |
- | top: 0;
| + | |
- | text-align: center;
| + | |
- | background-color: #248588;
| + | |
- | line-height: 32px;
| + | |
- | padding-top: 50px;
| + | |
- | padding-left: 0;
| + | |
- | display: none;
| + | |
- | position: absolute;
| + | |
- | left: 50px;
| + | |
- | position: fixed;
| + | |
- | height: 100%;
| + | |
- | } | + | |
- | | + | |
- | .iconmenu {
| + | |
- | background:#FFF;
| + | |
- | width:130px;
| + | |
- | height:115px;
| + | |
- | text-align:center;
| + | |
- | border-radius:50%;
| + | |
- | margin: auto;
| + | |
- | padding-top: 15px;
| + | |
- | overflow: hidden;
| + | |
- | line-height: 20px;
| + | |
- | margin-bottom: 20px;
| + | |
- | -moz-transition: all 0.3s ease-out;
| + | |
- | -webkit-transition: all 0.3s ease-out;
| + | |
- | transition: all 0.3s ease-out;
| + | |
- | }
| + | |
- | .hu-icon {color: #285459;}
| + | |
- | | + | |
- | .hu-icon li:hover {
| + | |
- | box-shadow: 0 0 65px #285459;
| + | |
- | -moz-box-shadow: 0 0 65px #285459;
| + | |
- | -webkit-box-shadow: 0 0 65px #285459;
| + | |
- | }
| + | |
- | | + | |
- | .hi-icon li:hover {
| + | |
- | background-color: #285459;
| + | |
- | }
| + | |
- | | + | |
- | .ssmenu:nth-child(odd) {background-color: #285459;}
| + | |
- | | + | |
- | .menuulli:nth-child(odd) { background:#46adb2; }
| + | |
- | .menuulli:first-child {
| + | |
- | height:6% !important;
| + | |
- | }
| + | |
- | .menuulli:hover .ssmenu {display:block !important;}
| + | |
- | | + | |
- | | + | |
- | /*FOOTER*/
| + | |
- | | + | |
- | #footer{
| + | |
- | margin-top: 100px;
| + | |
- | width: 100%;
| + | |
- | background-color: #285459;
| + | |
- | bottom: 0;
| + | |
- | }
| + | |
- | | + | |
- | #footer p{
| + | |
- | color:#fff;
| + | |
- | font-family: "Roboto", sans-serif;
| + | |
- | font-size: 0.9em;
| + | |
- | overflow:hidden;
| + | |
- | }
| + | |
- | | + | |
- | #contact{
| + | |
- | float:left;
| + | |
- | display: inline-block;
| + | |
- | background-color: #285459;
| + | |
- | padding-left: 30px;
| + | |
- | margin-left: 50px;
| + | |
- | width: 45%;
| + | |
- | }
| + | |
- | | + | |
- | #address1{
| + | |
- | float: left;
| + | |
- | }
| + | |
- | | + | |
- | #address2{
| + | |
- | float: left;
| + | |
- | margin-left: 30px;
| + | |
- | }
| + | |
- | | + | |
- | #sponsors{
| + | |
- | width: 45%;
| + | |
- | display: inline-block;
| + | |
- | background-color: #285459;
| + | |
- | padding-left: 30px;
| + | |
- | }
| + | |
- | | + | |
- | #copyright {
| + | |
- | text-align: center;
| + | |
- | font-size: 0.8em;
| + | |
- | background-color: #285459;
| + | |
- | padding-bottom: 6px;
| + | |
- | padding-top: 6px;
| + | |
- | }
| + | |
- | | + | |
- | #fb {
| + | |
- | float: right;
| + | |
- | margin-right: 10px;
| + | |
- | margin-top: 20px;
| + | |
- | } | + | |