Team:Goettingen/stylesheet

From 2014.igem.org

(Difference between revisions)
m
m
 
(189 intermediate revisions not shown)
Line 13: Line 13:
         border-bottom:none;
         border-bottom:none;
}
}
 +
a{
 +
        color:#6699FF;
 +
}
 +
a:link {
a:link {
text-decoration:none;
text-decoration:none;
 +
        color: #e98f00;
}
}
a:visited {
a:visited {
       text-decoration: none;
       text-decoration: none;
-
       color:#000000;
+
       color: #e98f00;
}
}
-
a:link {
 
-
      color:#000000;
 
-
}
 
a:hover {
a:hover {
Line 36: Line 38:
}
}
p{
p{
-
font-family:font-family:"Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
+
        line-height:150%;
 +
        font-family:"Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
}
}
body{
body{
Line 45: Line 48:
       text-align: center;
       text-align: center;
}
}
 +
#top-section{
#top-section{
         display:block;
         display:block;
Line 80: Line 84:
height:230px;
height:230px;
width:1002px;
width:1002px;
-
background-image:url("https://static.igem.org/mediawiki/2014/b/b6/Goettingen_header_new.png");
+
background-image:url("https://static.igem.org/mediawiki/2014/7/75/Goettingen_header_Pic.png");
background-size:contain;
background-size:contain;
}
}
Line 136: Line 140:
#menuBar ul li .wrap{
#menuBar ul li .wrap{
position:absolute;
position:absolute;
-
width:180px;
+
width:210px;
text-align:left;
text-align:left;
display:none;
display:none;
Line 156: Line 160:
         width:176px;
         width:176px;
         padding:0;
         padding:0;
-
        /*background-image:url('');*/
 
}
}
#contact a{
#contact a{
Line 168: Line 171:
z-index:199;
z-index:199;
position:fixed;
position:fixed;
-
bottom:3%;
+
bottom:2%;
-
right:5%;
+
right:2%;
overflow:visible;
overflow:visible;
 +
        /*background: url("https://static.igem.org/mediawiki/2014/5/5b/Goettingen_go2top.png");*/
 +
}
 +
/*
 +
#go2top img{
 +
        display:none;
 +
}
 +
*/
 +
#go2top a:hover img{
 +
        display:inline;
}
}
/*main part*/
/*main part*/
Line 244: Line 256:
         border-bottom:solid thin #D3D3D3;
         border-bottom:solid thin #D3D3D3;
}
}
-
 
-
/*
 
-
.four {
 
-
    -webkit-transition: .1s ease-in-out opacity;
 
-
    -moz-transition: .1s ease-in-out opacity;
 
-
    -o-transition: .1s ease-in-out opacity;
 
-
    transition: .1s ease-in-out opacity;
 
-
}
 
-
 
-
.four:hover {
 
-
    opacity: 0.7;
 
-
}
 
-
*/
 
-
 
-
 
.pictures{
.pictures{
margin:15px 0 25px 5px;
margin:15px 0 25px 5px;
Line 280: Line 277:
text-align:justify;
text-align:justify;
}
}
-
.paragraph p{
+
 
-
font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
+
-
}
+
.button{
.button{
width:80px;
width:80px;
Line 310: Line 305:
color:#FFFFFF;
color:#FFFFFF;
}
}
-
/*For Twitter & Facebook*/
+
 
-
#Twitter{
+
 
-
      height:660px;
+
/*For the pre & next buttons*/
 +
.button_pre{
 +
        display:block;
 +
        float:left;
 +
        margin:20px 0;
 +
        padding:5px;
 +
        border:solid 1px #e98f00;
 +
        border-radius:2px;
}
}
-
#Facebook{
+
.button_pre:hover{
-
      height:660px;
+
        color:white;
 +
        background-color:#FFB573;
 +
}
 +
.button_next{
 +
        display:block;
 +
        float:right;
 +
        margin:20px 0;
 +
        padding:5px;
 +
        border:solid 1px #e98f00;
 +
        border-radius:2px;
 +
}
 +
.button_next:hover{
 +
        color:white;
 +
        background-color:#FFB573;
 +
}
 +
.trans_zh{
 +
        display:block;
 +
        float:right;
 +
        padding:5px;
 +
        border:solid 1px #e98f00;
 +
        border-radius:2px;
}
}
Line 367: Line 389:
/* For team part*/
/* For team part*/
-
.teamMember1{
+
.teamM{
float:left;
float:left;
width:690px;
width:690px;
-
height:420px;
 
margin-top:10px;
margin-top:10px;
border-bottom-style:solid;  
border-bottom-style:solid;  
Line 376: Line 397:
border-color:#CCC;
border-color:#CCC;
}
}
-
.teamMember2{
+
.teamM img{
-
float:left;
+
width:200px;
-
width:690px;
+
height:250px;
-
height:420px;
+
margin-top:36px;
-
margin-top:10px;
+
        border-radius:8%;
-
border-bottom-style:solid;
+
-
border-width:2px;
+
-
border-color:#CCC;
+
}
}
 +
 +
.titleLeft{
 +
        float:left;
 +
        width:200px;
 +
}
 +
.titleRight{
 +
        float:right;
 +
        width:200px;
 +
}
 +
.content{
 +
        float:left;
 +
        width:410px;
 +
margin-left:30px;
 +
        margin-bottom:25px;
 +
}
 +
 +
 +
.instructors{
.instructors{
float:left;
float:left;
width:690px;
width:690px;
-
height:450px;
+
 
margin-top:10px;
margin-top:10px;
border-bottom-style:solid;  
border-bottom-style:solid;  
border-width:2px;
border-width:2px;
border-color:#CCC;
border-color:#CCC;
-
}
 
-
.teamMember1 img{
 
-
display:block;
 
-
float:left;
 
-
width:200px;
 
-
height:250px;
 
-
margin-top:36px;
 
-
}
 
-
.teamMember1 h2{
 
-
display:block;
 
-
float:left;
 
-
width:410px;
 
-
height:36px;
 
-
margin-left:20px;
 
-
}
 
-
.teamMember1 p{
 
-
display:block;
 
-
float:left;
 
-
width:410px;
 
-
margin-left:40px;
 
-
}
 
-
.teamMember2 img{
 
-
display:block;
 
-
float:right;
 
-
width:200px;
 
-
height:250px;
 
-
margin-top:36px;
 
-
}
 
-
.teamMember2 h2{
 
-
display:block;
 
-
float:left;
 
-
width:410px;
 
-
height:36px;
 
-
}
 
-
.teamMember2 p{
 
-
display:block;
 
-
float:left;
 
-
width:410px;
 
-
        margin-left:20px;
 
-
}
 
-
#tm7{
 
-
        height:450px;
 
-
}
 
-
#tm8{
 
-
        height:480px;
 
-
}
 
-
#tm9{
 
-
        height:720px;
 
}
}
.instructors img{
.instructors img{
Line 447: Line 435:
width:200px;
width:200px;
margin-top:36px;
margin-top:36px;
 +
        border-radius:8%;
}
}
.instructors h2{
.instructors h2{
Line 453: Line 442:
width:410px;
width:410px;
height:36px;
height:36px;
-
margin-left:20px;
+
margin-left:25px;
}
}
.instructors h3{
.instructors h3{
Line 466: Line 455:
width:410px;
width:410px;
margin-left:40px;
margin-left:40px;
 +
        margin-bottom:20px;
}
}
#instr2 img{
#instr2 img{
Line 562: Line 552:
margin-bottom:30px;
margin-bottom:30px;
         padding:0 20px 0 20px;
         padding:0 20px 0 20px;
 +
        border-radius:6%;
}
}
.ackn h3{
.ackn h3{
Line 587: Line 578:
}
}
#ackn9 img{
#ackn9 img{
 +
        float:right;
 +
}
 +
#ackn14 img{
         float:right;
         float:right;
}
}
Line 593: Line 587:
}
}
#ackn11 p{
#ackn11 p{
 +
      width:688px;
 +
}
 +
#ackn15 p{
       width:688px;
       width:688px;
}
}
/*For protocol part*/
/*For protocol part*/
/*For the overview page*/
/*For the overview page*/
 +
#OverviewTitle{
 +
        text-align:center;
 +
        font-size:36px;
 +
        padding:30px 0 0 0;
 +
}
 +
.linkButton{
 +
        display:block;
 +
        float:right;
 +
        position:relative;
 +
        bottom:10px;
 +
}
 +
#empty{
 +
        background-color:#F7F7F7;
 +
}
#protocolOverview{
#protocolOverview{
float:left;
float:left;
Line 604: Line 615:
float:left;
float:left;
width:280px;
width:280px;
-
height:180px;
+
height:250px;
margin:12px;
margin:12px;
padding:15px;
padding:15px;
 +
        background-color:#e7e7e7;
 +
        border-radius:10px;
 +
       
}
}
.pro_sub h4 a{
.pro_sub h4 a{
Line 612: Line 626:
       font-family:Verdana, Geneva, sans-serif;
       font-family:Verdana, Geneva, sans-serif;
font-size:22px;
font-size:22px;
-
         line-size:22px;
+
         line-height:26px;
         color:#F90;
         color:#F90;
text-align:center;
text-align:center;
Line 626: Line 640:
}
}
.pro_sub a:hover{
.pro_sub a:hover{
-
color:#e98f00;
+
color:#F90;
 +
}
 +
.figure{
 +
        font-size:14px;
 +
        color:#5b686a;
 +
        line-height:110%;
 +
        padding:0 30px;
}
}
-
 
#pic img{
#pic img{
         vertical-align: top;
         vertical-align: top;
Line 646: Line 665:
}
}
.proLP h3{
.proLP h3{
-
   font:Geneva, Arial, Helvetica, sans-serif;
+
   font:"Trebuchet MS", Arial, Helvetica, sans-serif;
font-size:24px;
font-size:24px;
color:#000;
color:#000;
Line 657: Line 676:
font-size:18px;
font-size:18px;
color:#000;
color:#000;
 +
        text-decoration:underline;
}
}
#protocol ul li a{
#protocol ul li a{
Line 666: Line 686:
.proLP ul li{
.proLP ul li{
         display:block;
         display:block;
-
padding:5px 10px 5px 0;
+
padding:5px 25px 5px 0px;
font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
font-size:16px;
font-size:16px;
Line 674: Line 694:
.proLP ul li a{
.proLP ul li a{
color:#F88005;
color:#F88005;
-
        padding-left:10px;
 
}
}
.proLP ul li ul li{
.proLP ul li ul li{
Line 680: Line 699:
font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
font-size:14px;
font-size:14px;
 +
        padding-left:20px;
line-height:24px;
line-height:24px;
}
}
.proLP ul li ul li a{
.proLP ul li ul li a{
         color:black;
         color:black;
-
        padding-left:25px;
 
}
}
Line 706: Line 725:
}
}
.proRP h1{
.proRP h1{
-
      font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
+
        font-family:"Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
       font-size:30px;
       font-size:30px;
-
font-weight:bold;
+
      font-weight:bold;
       color:#F88005;
       color:#F88005;
       line-height:40px;
       line-height:40px;
       text-align:left;
       text-align:left;
-
 
+
      padding:10px;
}
}
.proRP h2{
.proRP h2{
font-family:"Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
font-family:"Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
         font-size:20px;
         font-size:20px;
-
 
line-height:36px;
line-height:36px;
padding:0;
padding:0;
-
color:#039648;
+
        color:#039648;
-
text-align:left;
+
        text-align:left;
}
}
.proRP h3{
.proRP h3{
Line 728: Line 746:
padding:5px 0;
padding:5px 0;
color:#BF2F15;
color:#BF2F15;
-
text-align:left;
+
        text-align:left;
 +
}
 +
.proRP h4{
 +
font-family:"Charter Black", sans-serif;
 +
font-size:18px;
 +
        line-height:24px;
 +
padding:10px 0;
 +
color:black;
 +
text-align:justify;
 +
        font-weight:bold;
}
}
.proRP p{
.proRP p{
font-size:16px;
font-size:16px;
-
line-height:20px;
 
text-align:justify;
text-align:justify;
 +
}
 +
#humanPractice img{
 +
        border-radius:8%;
}
}
#protocol  ul li:hover{
#protocol  ul li:hover{
Line 748: Line 777:
width:922px;
width:922px;
         border:solid 1px #CCCCCC;
         border:solid 1px #CCCCCC;
 +
        border-radius:5px;
}
}
#achv h1{
#achv h1{
Line 754: Line 784:
}
}
#achv h2{
#achv h2{
-
       font:20px  Lucida Sans Unicode, Lucida Grande, sans-serif;
+
       font:30px;
}
}
#achv p{
#achv p{
Line 767: Line 797:
#achv_p1{
#achv_p1{
         float: left;
         float: left;
-
        height:380px;
 
         width:690px;
         width:690px;
border-bottom-style:solid;
border-bottom-style:solid;
Line 799: Line 828:
border-bottom-width:1px;
border-bottom-width:1px;
}
}
-
 
+
#Achieve a{
 +
        color:black;
 +
}
/*For the gallery*/
/*For the gallery*/
.gallery_single_part{
.gallery_single_part{
Line 864: Line 895:
#notebookWrap p{
#notebookWrap p{
         background-color: #f4f4f8;
         background-color: #f4f4f8;
 +
}
 +
#notebookWrap h2{
 +
        color:#000;
 +
}
 +
#BBWrap p img{
 +
        display:block;
 +
        margin:15px auto;
}
}
#lab_team1{
#lab_team1{
-
         background-color: #fcc;
+
         background-color:#fcebeb;
-
         opacity:0.7;
+
        border-left:solid 10px #fcc;
 +
         border-radius:5px;
}
}
#lab_team2{
#lab_team2{
-
         background-color:#fdd7a0;
+
         background-color:#fcedd6;
-
         opacity:0.7;
+
        border-left:solid 10px #fdd7a0;
 +
         border-radius:5px;
}
}
#lab_team3{
#lab_team3{
-
         background-color:#b0dfb3;
+
         background-color:#daf1dc;
-
         opacity:0.7;
+
        border-left:solid 10px #b0dfb3;
 +
         border-radius:5px;
 +
}
 +
#lab_team4{
 +
        background-color:#dff4fa;
 +
        border-left:solid 10px #9be3f8;
 +
        border-radius:5px;
}
}
/*edit for the search box*/
/*edit for the search box*/
Line 882: Line 928:
.note_sthree{
.note_sthree{
         float:left;
         float:left;
-
        width:334px;
+
width:280px;
-
         height:230px;
+
         height:290px;
 +
margin:12px;
 +
padding:15px;
 +
        background-color:#e7e7e7;
 +
        border-radius:10px;
}
}
.note_sthree h2{
.note_sthree h2{
Line 910: Line 960:
/*This is for the presentation part*/
/*This is for the presentation part*/
 +
#Presentation{
 +
        float:left;
 +
        width:690px;
 +
}
.pres{
.pres{
         float:left;
         float:left;
Line 929: Line 983:
/*Modify the table*/
/*Modify the table*/
.table1  {
.table1  {
-
  font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
+
        font-family:"Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
   width:100%;
   width:100%;
   border-collapse:collapse;
   border-collapse:collapse;
Line 946: Line 1,000:
           color:#ffffff;
           color:#ffffff;
}
}
-
table1 tr:nth-child(even){
+
.table1 tr:nth-child(odd){
-
  background-color:#EAF2D3;
+
          background-color:#EAF2D3;
}
}
 +
.table2{
 +
        background-color:#F7F7F7;
 +
        font-family:"Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
 +
}
 +
.table2 td{
 +
        padding:5px 15px;
 +
        text-align:left;
 +
 +
}
/* social media boxes */
/* social media boxes */
.fblike iframe {
.fblike iframe {
     width: 100px ;
     width: 100px ;
}
}
-
 
+
/* YouTube player */
 +
#player {
 +
    width: 348px;
 +
    height: 240px;
 +
    overflow: hidden;
 +
    background: gray;
 +
    position: absolute;
 +
    border: solid 2px gray;
 +
}
</style>
</style>
</html>
</html>

Latest revision as of 01:17, 18 October 2014