Template:CSS/style2

From 2014.igem.org

(Difference between revisions)
 
(396 intermediate revisions not shown)
Line 2: Line 2:
<style rel='stylesheet' type='text/css'>
<style rel='stylesheet' type='text/css'>
-
.container{
+
.container3636{
-
width:1349px;
+
width:100%;
-
height:1830px;
+
height:2620px;
-
background-image: url(https://static.igem.org/mediawiki/2014/8/89/Newbackground.png);
+
position:relative;
-
position:absolute;
+
top:-10px;
top:-10px;
left:0px;
left:0px;
padding:0px;
padding:0px;
margin:0px;
margin:0px;
 +
}
 +
 +
.namastegif{
 +
width:100%;
 +
height:100%;
 +
margin:auto auto;
 +
background-image:url("https://static.igem.org/mediawiki/2014/e/ee/Namaste.gif");
 +
z-index:100;
}
}
.topblack{
.topblack{
-
width:1349px;
+
width:100%;
height:28px;
height:28px;
position:fixed;
position:fixed;
Line 20: Line 27:
left:0px;
left:0px;
background-color:#373737;
background-color:#373737;
 +
z-index:99;
}
}
.topwhite{
.topwhite{
-
width:1349px;
+
width:100%;
height:68px;
height:68px;
position:fixed;
position:fixed;
Line 29: Line 37:
left:0px;
left:0px;
background-color:white;
background-color:white;
 +
z-index:100;
 +
}
 +
 +
 +
.logo{
 +
width:65px;
 +
height:61px;
 +
position:absolute;
 +
top:3px;
 +
left:10px;
 +
-webkit-transition: all .2s ease;
 +
    -moz-transition: all .2s ease;
 +
      -o-transition: all .2s ease;
 +
      -ms-transition: all .2s ease;
 +
          transition: all .2s ease;
 +
z-index:10;
 +
}
 +
 +
.logo:hover{
 +
width:128px;
 +
}
 +
 +
.logotext{
 +
width:50px
 +
height:61px;
 +
position:absolute;
 +
top:20px;
 +
left:85px;
 +
}
 +
 +
.logotext img{
 +
width:80px;
 +
}
 +
 +
 +
 +
.links{
 +
width:123px;
 +
height:69px;
 +
position:absolute;
 +
top:-5px;
 +
left:168px;
 +
}
 +
 +
.followus{
 +
font-family:Arial,Helvetica,Sans serif;
 +
size:10px;
 +
color:#0158aa;
 +
position:absolute;
 +
top:0px;
 +
right:0px;
 +
}
 +
 +
.link_bg{
 +
width:123px;
 +
height:61px;
 +
position:absolute;
 +
top:29px;
 +
left:2px;
 +
 +
}
 +
 +
 +
.menu{
 +
width:550px;
 +
position:absolute;
 +
top:0px;
 +
left:300px;
 +
 +
}
 +
 +
#topmenu{
 +
color:#7b7a7a;
 +
font-family:Arial, Helvetica, sans-serif;
 +
text-decoration:none;
 +
}
 +
#topmenu:hover{
 +
color:#0066FF;
 +
}
 +
 +
.menuelt{
 +
padding:20px 15px 16px 15px;
 +
}
 +
 +
.menuelt:hover{
 +
background-color:#fcf7f5;
 +
padding:20px 15px 16px 15px;
 +
border-bottom:solid thick #f53e06;
 +
}
 +
 +
 +
#nav {
 +
width:1000px;
 +
position:absolute;
 +
top:0px;
 +
left:320px;
 +
}
 +
#nav_wrapper{
 +
width:1000px;
 +
margin:0, auto;
 +
text-align:left;
 +
}
 +
#nav ul{
 +
list-style-type:none;
 +
padding:0;
 +
margin:1px;
 +
position:relative;
 +
}
 +
#nav ul li{
 +
display:inline-block;
 +
border:5px, solid, #4daf7a;
 +
color:#46dd11;
 +
text-decoration:none;
 +
padding:6px 3px 0px 3px;
 +
}
 +
 +
#nav ul li a,visited{
 +
color:#3b3a3a;
 +
padding:15px;
 +
display:block;
 +
font-family: Open sans, Helvetica, Arial;
 +
text-decoration:none;
 +
font-weight:300;
 +
}
 +
 +
#nav ul li:hover{
 +
background-color:#fbf7f5;
 +
padding:6px 2px 0px 2px;
 +
/*border-bottom:solid thick #f02b05;*/
 +
}
 +
#nav ul li a:hover{
 +
color:black;
 +
font-weight:300;
 +
}
 +
 +
 +
 +
 +
.nav_item_achievements,visited{
 +
background-color:#fbf7f5;
 +
padding:6px 2px 0px 2px;
 +
border-bottom:solid thick #000000;
 +
}
 +
.nav_item_home,visited{
 +
background-color:#fbf7f5;
 +
padding:6px 2px 0px 2px;
 +
border-bottom:solid thick #00b1ff;
 +
}
 +
.nav_item_project,visited{
 +
background-color:#fbf7f5;
 +
padding:6px 2px 0px 2px;
 +
border-bottom:solid thick #b80028;
 +
}
 +
.nav_item_modeling,visited{
 +
background-color:#fbf7f5;
 +
padding:6px 2px 0px 2px;
 +
border-bottom:solid thick #757116;
 +
}
 +
.nav_item_team,visited{
 +
background-color:#fbf7f5;
 +
padding:6px 2px 0px 2px;
 +
border-bottom:solid thick #f4a204;
 +
}
 +
.nav_item_parts,visited{
 +
background-color:#fbf7f5;
 +
padding:6px 2px 0px 2px;
 +
border-bottom:solid thick #a95613;
 +
}
 +
.nav_item_attributions,visited{
 +
background-color:#fbf7f5;
 +
padding:6px 2px 0px 2px;
 +
border-bottom:solid thick #b904f4;
 +
}
 +
.nav_item_safety,visited{
 +
background-color:#fbf7f5;
 +
padding:6px 2px 0px 2px;
 +
border-bottom:solid thick #03b224;
 +
}
 +
.nav_item_notebook,visited{
 +
background-color:#fbf7f5;
 +
padding:6px 2px 0px 2px;
 +
border-bottom:solid thick #24e4fb;
 +
}
 +
.achievements a:hover{
 +
border-bottom:solid thick #000000;
 +
}
 +
.home a:hover{
 +
border-bottom:solid thick #00b1ff;
 +
}
 +
.project a:hover{
 +
border-bottom:solid thick #b80028;
 +
}
 +
.modeling a:hover{
 +
border-bottom:solid thick #757116;
 +
}
 +
.team a:hover{
 +
border-bottom:solid thick #f4a204;
 +
}
 +
.notebook a:hover{
 +
border-bottom:solid thick #24e4fb;
 +
}
 +
.attributions a:hover{
 +
border-bottom:solid thick #b904f4;
 +
}
 +
.safety a:hover{
 +
border-bottom:solid thick #03b224;
 +
}
 +
.parts a:hover{
 +
border-bottom:solid thick #a95613;
 +
}
 +
 +
.igemlogo{
 +
width:75px;
 +
height:62px;
 +
position:absolute;
 +
top:3px;
 +
right:20px;
 +
z-index:15;
 +
}
 +
 +
.fb{
 +
width:39px;
 +
height:39px;
 +
position:absolute;
 +
top:0px;
 +
left:0px;
 +
background-image:url("https://static.igem.org/mediawiki/2014/6/6c/Fbhover.png");
}
}
.footer{
.footer{
width:1349px;
width:1349px;
-
height:70px;
+
height:192px;
position:absolute;
position:absolute;
bottom:0px;
bottom:0px;
Line 40: Line 275:
}
}
 +
.footermap {
 +
margin: 0px;
 +
padding: 0px;
 +
height: 190px;
 +
width: 190px;
 +
border: thin solid #666666;
 +
position: absolute;
 +
top: 1px;
 +
left: 600px;
 +
z-index: 40;
 +
font-family: Arial, Helvetica, sans-serif;
 +
}
 +
.mascotbottomlayer{
 +
width:293px;
 +
height:372px;
 +
position:fixed;
 +
top:96px;
 +
left:0px;
 +
background-image: url(https://static.igem.org/mediawiki/2014/2/2a/Industry3.png);
 +
}
 +
.mascotmiddlelayer{
 +
width:286px;
 +
height:227px;
 +
position:absolute;
 +
top:2px;
 +
left:5px;
 +
}
 +
.mascottoplayer{
 +
width:293px;
 +
height:384px;
 +
position:fixed;
 +
top:96px;
 +
left:0px;
 +
}
 +
 +
.iitd{
 +
width:293px;
 +
height:192px;
 +
position:fixed;
 +
top:480px;
 +
left:0px;
 +
background-image:url("https://static.igem.org/mediawiki/2014/e/ed/Iitd2.png");
 +
background-color:#373737;
 +
z-index:10;
 +
 +
 +
}
 +
 +
 +
 +
#container2 {
 +
  display: block;
 +
  margin: 0 auto;
 +
  width: 1049px;
 +
  height:170px;
 +
position:absolute;
 +
top:477px;
 +
left:300px;
 +
}
 +
   
 +
  .wrapper {
 +
    display: inline-block;
 +
    width:240px;
 +
    height: 81px;
 +
 +
    vertical-align: top;
 +
    margin-top:5px;
 +
margin-bottom:5px;
 +
padding:0px;
 +
    cursor: pointer;
 +
    position: relative;
 +
top:0px;
 +
left:0px;
 +
    font-family: Tahoma, Arial;
 +
    -webkit-perspective: 4000px;
 +
      -moz-perspective: 4000px;
 +
        -ms-perspective: 4000px;
 +
        -o-perspective: 4000px;
 +
            perspective: 4000px;
 +
  }
 +
 
 +
  .item {
 +
    height: 81px;
 +
      -webkit-transform-style: preserve-3d;
 +
        -moz-transform-style: preserve-3d;
 +
          -ms-transform-style: preserve-3d;
 +
          -o-transform-style: preserve-3d;
 +
              transform-style: preserve-3d;
 +
      -webkit-transition: -webkit-transform .6s;
 +
        -moz-transition: -moz-transform .6s;
 +
          -ms-transition: -ms-transform .6s;
 +
          -o-transition: -o-transform .6s;
 +
              transition: transform .6s;
 +
  }
 +
 
 +
    .item:hover {
 +
      -webkit-transform: translateZ(-50px) rotateX(95deg);
 +
        -moz-transform: translateZ(-50px) rotateX(95deg);
 +
          -ms-transform: translateZ(-50px) rotateX(95deg);
 +
          -o-transform: translateZ(-50px) rotateX(95deg);
 +
              transform: translateZ(-50px) rotateX(95deg);
 +
    }
 +
 +
      .item:hover .information {
 +
     
 +
        border-radius: 3px;
 +
      }
 +
 +
    .item img {
 +
      display: block;
 +
      position: absolute;
 +
      top: 0;
 +
      border-radius: 3px;
 +
 +
   
 +
      -webkit-transform: translateZ(40px);
 +
        -moz-transform: translateZ(40px);
 +
          -ms-transform: translateZ(40px);
 +
          -o-transform: translateZ(40px);
 +
              transform: translateZ(40px);
 +
      -webkit-transition: all .6s;
 +
        -moz-transition: all .6s;
 +
          -ms-transition: all .6s;
 +
          -o-transition: all .6s;
 +
              transition: all .6s;
 +
     
 +
    }
 +
   
 +
    .item .information {
 +
      display: block;
 +
      position: absolute;
 +
      top: 0;
 +
  color: #000000;
 +
  float: left;
 +
      height: 81px;
 +
      width: 240px;
 +
      text-align: left;
 +
      border-radius: 15px;
 +
      padding: 10px;
 +
      font-size: 12px;
 +
      text-shadow: 1px 1px 1px rgba(255,255,255,0.5);
 +
      box-shadow: none;
 +
      background: rgb(236,241,244);
 +
      background: -moz-linear-gradient(top,  rgba(236,241,244,1) 0%, rgba(190,202,217,1) 100%);
 +
      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(236,241,244,1)), color-stop(100%,rgba(190,202,217,1)));
 +
      background: -webkit-linear-gradient(top,  rgba(236,241,244,1) 0%,rgba(190,202,217,1) 100%);
 +
      background: -o-linear-gradient(top,  rgba(236,241,244,1) 0%,rgba(190,202,217,1) 100%);
 +
      background: -ms-linear-gradient(top,  rgba(236,241,244,1) 0%,rgba(190,202,217,1) 100%);
 +
      background: linear-gradient(to bottom,  rgba(236,241,244,1) 0%,rgba(190,202,217,1) 100%);
 +
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ecf1f4', endColorstr='#becad9',GradientType=0 );
 +
      -webkit-transform: rotateX(-90deg) translateZ(40px);
 +
        -moz-transform: rotateX(-90deg) translateZ(40px);
 +
          -ms-transform: rotateX(-90deg) translateZ(40px);
 +
          -o-transform: rotateX(-90deg) translateZ(40px);
 +
              transform: rotateX(-90deg) translateZ(40px);
 +
      -webkit-transition: all .6s;
 +
        -moz-transition: all .6s;
 +
          -ms-transition: all .6s;
 +
          -o-transition: all .6s;
 +
              transition: all .6s;
 +
     
 +
    }
 +
   
 +
.information strong {
 +
        display: block;
 +
       
 +
        font-size: 17px;
 +
        font-family: "Open Sans";
 +
}
 +
 +
.video1{
 +
position:absolute;
 +
top:670px;
 +
left:300px;
 +
width:770px;
 +
height:560px;
 +
background-color:#ded4cd;
 +
}
 +
 +
.sponsors{
 +
width:261px;
 +
height:538px;
 +
position:absolute;
 +
top:675px;
 +
left:1086px;
 +
background-image:url(https://static.igem.org/mediawiki/2014/f/fd/Sponsors-iit.png);
 +
}
 +
 +
.crowdfunding{
 +
width:770px;
 +
height:560px;
 +
position:absolute;
 +
left:300px;
 +
top:1250px;
 +
 +
 +
}
 +
 +
.fbapi{
 +
width:251px;
 +
height:560px;
 +
position:absolute;
 +
top:1250px;
 +
left:1086px;
 +
background-color:white;
 +
}
 +
 +
.tweeterapi{
 +
width:251px;
 +
height:600px;
 +
position:absolute;
 +
top:1830px;
 +
left:1086px;
 +
background-color:white;
 +
}
 +
 +
.flagview{
 +
position:absolute;
 +
top:1500px;
 +
right:30px;
 +
width:275px;
 +
height:73px;
 +
z-index:12;
 +
}
 +
 +
.nav2{
 +
position:absolute;
 +
top:10px;
 +
left:400px;
 +
 +
}
 +
.nav2table{
 +
background-color:#373737;
 +
color:#807f7f;
 +
}
 +
.nav2 a,visited{
 +
color:#d6d5d5;
 +
font-size:12px;
 +
text-decoration:none;
 +
padding:10px;
 +
}
 +
 +
.nav2 a:hover{
 +
color:#ffffff;
 +
font-size:12px;
 +
font-weight:500;
 +
text-decoration:none;
 +
padding:10px;
 +
}
 +
 +
 +
.maplink{
 +
position:absolute;
 +
bottom:70px;
 +
left:500px;
 +
}
 +
.maptable{
 +
background-color:#373737;
 +
color:#d6d5d5;
 +
}
 +
.maplink a,visited{
 +
font-size:14px;
 +
color:#d6d5d5;
 +
font-family:Open sans, Helvetica, Arial;
 +
font-weight:300;
 +
padding:10px;
 +
text-decoration:none;
 +
background-color:#373737;
 +
}
 +
.maplink a:hover{
 +
font-size:14px;
 +
color:white;
 +
font-family:Open sans, Helvetica, Arial;
 +
font-weight:300;
 +
padding:10px;
 +
background-color:#373737;
 +
}
 +
 +
.copyright{
 +
position:absolute;
 +
bottom:5px;
 +
left:600px;
 +
 +
}
 +
.copyright a,visited{
 +
color:#a2a1a1;
 +
}
 +
 +
.copyright a:hover{
 +
color:#c7c6c6;
 +
}
 +
 +
.copyright p{
 +
font-size:12px;
 +
color:#807f7f;
 +
font-family:Open sans, Helvetica, Arial;
 +
font-weight:400;
 +
}

Latest revision as of 13:35, 24 May 2015

Retrieved from "http://2014.igem.org/Template:CSS/style2"