Team:Goettingen/stylesheet

From 2014.igem.org

(Difference between revisions)
(Created page with "<html> /* CSS Document */ - reset padding, margin and list style: body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { padding:...")
m
 
(827 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
-
 
+
<style>
/* CSS Document */
/* CSS Document */
Line 9: Line 9:
margin:0;
margin:0;
  list-style-type:none;
  list-style-type:none;
 +
        list-style-image:url('');
 +
        background-image:url('');
 +
        border-bottom:none;
}
}
a{
a{
 +
        color:#6699FF;
 +
}
 +
 +
a:link {
text-decoration:none;
text-decoration:none;
 +
        color: #e98f00;
}
}
 +
 +
a:visited {
 +
      text-decoration: none;
 +
      color: #e98f00;
 +
}
 +
 +
 +
a:hover {
 +
        color: #6699FF;
 +
        text-decoration: underline;
 +
}
 +
h1,h2,h3,h4,h5,h6{
h1,h2,h3,h4,h5,h6{
  font-weight:normal;
  font-weight:normal;
Line 18: Line 38:
}
}
p{
p{
-
font-family:Helvetica,sans-serif;
+
        line-height:150%;
 +
        font-family:"Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
}
}
body{
body{
-
background-image:url(images/Goettingen_bg.png);
+
background-color:#F7F7F7;
-
background-repeat:repeat;
+
}
}
 +
 +
td{
 +
      text-align: center;
 +
}
 +
 +
#top-section{
 +
        display:block;
 +
        position:relative;
 +
        margin-top:10px;
 +
        background:none;
 +
       
 +
}
 +
/*end of the reset*/
/*end of the reset*/
 +
 +
 +
#supportBox{
 +
position: absolute;
 +
top:80%;
 +
right:-18%;
 +
z-index: 5;
 +
overflow: visible
 +
}
#globalWrapper{
#globalWrapper{
Line 30: Line 72:
width:1002px;
width:1002px;
}
}
-
#topBar{
+
 
-
float:left;
+
-
height:15px;
+
-
width:1002px;
+
-
background-color:#FFD79D;
+
-
font-size:12px;
+
-
z-index:5;
+
-
position:absolute;
+
-
}
+
-
#topBar ul li a{
+
-
float:left;
+
-
line-height:15px;
+
-
margin:0 10px;
+
-
}
+
-
#topBar a:hover li{
+
-
display:block;
+
-
background-color:#CCC;
+
-
}
+
/*header part*/
/*header part*/
#header{
#header{
Line 59: Line 84:
height:230px;
height:230px;
width:1002px;
width:1002px;
-
background-image:url(images/header.png);
+
background-image:url("https://static.igem.org/mediawiki/2014/7/75/Goettingen_header_Pic.png");
background-size:contain;
background-size:contain;
}
}
Line 67: Line 92:
padding-left:25px;
padding-left:25px;
}
}
-
#igemLogo{
+
#uniLogo{
float:right;
float:right;
margin:160px 0px 20px 20px;
margin:160px 0px 20px 20px;
 +
}
 +
 +
#igemLogo{
 +
float:right;
 +
margin:170px 0px 20px 20px;
 +
}
 +
 +
#headerNavi{
 +
        float:left;
 +
        width:1002px;
 +
        background-color:#e98f00;
 +
        border-radius:5px;
 +
       
}
}
#menuBar{
#menuBar{
float:left;
float:left;
height:38px;
height:38px;
 +
        width:826px;
text-align:center;
text-align:center;
-
font:16px Calibri,sans-serif;
+
font:18px Calibri,sans-serif;
-
color:#000;
+
-
background-color:#FFBB4A;
+
}
}
#menuBar ul li{
#menuBar ul li{
-
width:120px;
+
width:118px;
line-height:38px;
line-height:38px;
float:left;
float:left;
 +
}
 +
#menuBar ul li a{
 +
color:#FFF;
}
}
#menuBar ul li:hover{
#menuBar ul li:hover{
background-color:#DFDFDF;
background-color:#DFDFDF;
 +
        border-radius:4px;
}
}
#menuBar ul li:hover .wrap{
#menuBar ul li:hover .wrap{
display:block;
display:block;
z-index:99;
z-index:99;
 +
}
 +
#menuBar ul li:hover a{
 +
        color:#e98f00;
 +
}
 +
#menuBar ul li:hover li a{
 +
      color:white;
}
}
#menuBar ul li .wrap{
#menuBar ul li .wrap{
position:absolute;
position:absolute;
-
background-color:#FFD79D;
+
width:210px;
-
width:160px;
+
text-align:left;
text-align:left;
display:none;
display:none;
Line 100: Line 146:
#menuBar ul li ul li{
#menuBar ul li ul li{
line-height:20px;
line-height:20px;
-
border:#999 solid 1px;
+
border-left:solid 5px #ccc;
 +
border-bottom:solid 1px #fff;
padding:10px 20px;
padding:10px 20px;
font-size:15px;
font-size:15px;
-
background-color:#FFD79D;
+
background-color:#FFB573;
}
}
-
#menuBar ul li ul li:hover{
+
#menuBar ul li ul li:hover a{
-
background-color:#DFDFDF;
+
        color:#e98f00;
}
}
#contact{
#contact{
float:right;
float:right;
-
height:38px;
+
height:38px;  
-
width:162px;
+
        width:176px;
-
background-color:#FFBB4A;
+
        padding:0;
}
}
#contact a{
#contact a{
display:block;
display:block;
-
float:right;
+
float:left;
-
margin-right:10px;
+
        width:38px;
 +
        height:38px;
 +
 
}
}
#go2top{
#go2top{
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 144: Line 202:
}
}
#container #prev{
#container #prev{
-
background-image: url(images/leftarrow.png);
+
background-image: url("https://static.igem.org/mediawiki/2014/8/84/Goettingen_prev_icon.png");
background-repeat: no-repeat;
background-repeat: no-repeat;
background-position: center center;
background-position: center center;
Line 156: Line 214:
}
}
#container #next {
#container #next {
-
background-image: url(images/rightarrow.png);
+
background-image: url("https://static.igem.org/mediawiki/2014/b/b5/Goettingen_next_icon.png");
background-repeat: no-repeat;
background-repeat: no-repeat;
background-position: center center;
background-position: center center;
Line 176: Line 234:
}
}
/*For the four main parts*/
/*For the four main parts*/
 +
#fourParts{
#fourParts{
float:left;
float:left;
margin:10px 0;
margin:10px 0;
-
height:600px;
+
height:650px;
width:1002px;
width:1002px;
 +
        border:solid 1px #CCCCCC;
 +
        border-radius:4px;
}
}
.four{
.four{
margin:5px 15px;
margin:5px 15px;
-
padding:20px 20px 10px 10px;
+
padding:20px 10px 10px 10px;
height:260px;
height:260px;
width:440px;
width:440px;
-
background:url(images/4parts_bg.png);
 
float:left;
float:left;
}
}
#fourParts h1{
#fourParts h1{
 +
        display:block;
font:20px Helvetica,sans-serif;
font:20px Helvetica,sans-serif;
color:#BF2F15;
color:#BF2F15;
 +
        border-bottom:solid thin #D3D3D3;
}
}
.pictures{
.pictures{
Line 199: Line 261:
width:180px;
width:180px;
float:left;
float:left;
 +
}
 +
#Pic1{
 +
        padding-top:25px;
 +
}
 +
#Pic3{
 +
        padding-top:45px;
}
}
.paragraph{
.paragraph{
Line 209: 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;
height:30px;
height:30px;
float:right;
float:right;
-
background:#EBC196;
+
background:#FFB573;
font:14px Candara,sans-serif;
font:14px Candara,sans-serif;
text-align:center;
text-align:center;
Line 224: Line 290:
}
}
.button a:hover{
.button a:hover{
-
color:#FFF;
+
color:#FFFFFF;
}
}
 +
.buttonGreen{
 +
 +
float:right;
 +
 +
font:14px Candara,sans-serif;
 +
text-align:center;
 +
}
 +
.buttonGreen a{
 +
line-height:30px;
 +
}
 +
.buttonGreen a:hover{
 +
color:#FFFFFF;
 +
}
 +
 +
 +
/*For the pre & next buttons*/
 +
.button_pre{
 +
        display:block;
 +
        float:left;
 +
        margin:20px 0;
 +
        padding:5px;
 +
        border:solid 1px #e98f00;
 +
        border-radius:2px;
 +
}
 +
.button_pre:hover{
 +
        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;
 +
}
 +
/*For the footer*/
/*For the footer*/
#footer{
#footer{
float:left;
float:left;
-
margin:12px auto;
+
margin:40px auto;
height:31px;
height:31px;
width:1002px;
width:1002px;
-
background:#FC9;
+
        border:solid 1px #CCC;
}
}
#copyrightIco{
#copyrightIco{
Line 239: Line 353:
height:31px;
height:31px;
}
}
-
#list1{
+
 
-
margin:0 151px;
+
-
}
+
#list1 ul li{
#list1 ul li{
display:block;
display:block;
float:left;
float:left;
-
width:140px;
+
width:130px;
 +
        height:15px;
text-align:center;
text-align:center;
-
font-size:80%;
+
font-size:10px;
-
}
+
        margin:0 15px;
-
#list2{
+
-
margin:0 53px;
+
}
}
 +
#list2 ul li{
#list2 ul li{
display:block;
display:block;
float:left;
float:left;
width:140px;
width:140px;
 +
        height:15px;
text-align:center;
text-align:center;
-
font-size:80%;
+
font-size:10px;
 +
        margin:0 22px;
}
}
#poweredByIco{
#poweredByIco{
float:right;
float:right;
 +
}
 +
#footerbanner{
 +
      float:left;
 +
      margin:30px 0;
}
}
/*For the subpage*/
/*For the subpage*/
-
/*For the navigation part*/
+
 
-
.leftpart{
+
/*next and previous buttons*/
-
float:left;
+
#goenext {
-
width:198px;
+
        float:right;
-
height:400px;
+
       
-
margin:15px 25px;
+
-
background-color:transparent;
+
-
border-right-style:solid;  
+
-
border-width:2px;
+
-
border-color:#CCC;
+
-
}
+
-
.rightpart{
+
-
float:left;
+
-
width:650px;
+
-
margin:15px 0 30px 0;
+
-
padding:30px;
+
-
background-color:transparent;
+
-
border-style:solid;
+
-
border-color:#CCC;
+
-
border-width:1px;
+
-
}
+
-
.leftpart h3{
+
-
font: Geneva, Arial, Helvetica, sans-serif;
+
-
font-size:24px;
+
-
color:#000;
+
-
padding:10px;
+
-
}
+
-
.leftpart ul{
+
-
padding: 10px 20px;
+
-
font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
+
-
line-height:30px;
+
-
}
+
-
.leftpart ul li a{
+
-
color:#F88005;
+
-
display:block;
+
-
width:130px;
+
-
padding-left:30px;
+
-
}
+
-
.leftpart ul li:hover{
+
-
background-color:#DFDFDF;
+
-
}
+
-
.rightpart h1{
+
-
font-family:Arial, Helvetica, sans-serif;
+
-
font-size:30px;
+
-
color:#F90;
+
-
text-align:left;
+
-
line-height:60px;
+
-
}
+
-
.rightpart h2{
+
-
font-family:"Times New Roman", Times, serif;
+
-
font-size:24px;
+
-
color:#39F;
+
-
line-height:36px;
+
-
}
+
-
.rightpart h3{
+
-
font-family:Arial, Helvetica, sans-serif;
+
-
font-size:20px;
+
-
color:#F88005;
+
-
line-height:24px;
+
-
}
+
-
.rightpart p{
+
-
font-size:16px;
+
-
line-height:20px;
+
-
text-align:justify;
+
}
}
 +
/* For team part*/
/* For team part*/
-
.teamMember{
+
.teamM{
float:left;
float:left;
-
width:650px;
+
width:690px;
-
height:450px;
+
margin-top:10px;
margin-top:10px;
border-bottom-style:solid;  
border-bottom-style:solid;  
Line 338: Line 397:
border-color:#CCC;
border-color:#CCC;
}
}
 +
.teamM img{
 +
width:200px;
 +
height:250px;
 +
margin-top:36px;
 +
        border-radius:8%;
 +
}
 +
 +
.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:650px;
+
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;
-
}
 
-
.teamMember img{
 
-
display:block;
 
-
float:left;
 
-
width:200px;
 
-
height:250px;
 
-
margin-top:36px;
 
-
}
 
-
.teamMember h2{
 
-
display:block;
 
-
float:left;
 
-
width:410px;
 
-
height:36px;
 
-
margin-left:20px;
 
-
}
 
-
.teamMember p{
 
-
display:block;
 
-
float:left;
 
-
width:410px;
 
-
margin-left:40px;
 
}
}
.instructors img{
.instructors img{
Line 371: Line 434:
float:left;
float:left;
width:200px;
width:200px;
-
height:250px;
 
margin-top:36px;
margin-top:36px;
 +
        border-radius:8%;
}
}
.instructors h2{
.instructors h2{
Line 379: Line 442:
width:410px;
width:410px;
height:36px;
height:36px;
-
margin-left:20px;
+
margin-left:25px;
}
}
.instructors h3{
.instructors h3{
Line 392: Line 455:
width:410px;
width:410px;
margin-left:40px;
margin-left:40px;
 +
        margin-bottom:20px;
 +
}
 +
#instr2 img{
 +
        float: right;
 +
}
 +
#instr2 h2{
 +
        margin-left:0;
 +
}
 +
#instr2 p{
 +
        margin-left:20px;
}
}
/*For sponsor part*/
/*For sponsor part*/
#sponsorWrap{
#sponsorWrap{
float:left;
float:left;
-
width:1002px;
+
width:1000px;
border-style:solid;
border-style:solid;
border-color:#CCC;
border-color:#CCC;
Line 413: Line 486:
border-bottom:solid #CCC 2px;
border-bottom:solid #CCC 2px;
}
}
 +
       
#sponsorPic{
#sponsorPic{
float:left;
float:left;
width:952px;
width:952px;
-
height:460px;
+
height:500px;
padding:25px;
padding:25px;
border-bottom:solid #CCC 2px;
border-bottom:solid #CCC 2px;
Line 422: Line 496:
.spPic{
.spPic{
float:left;
float:left;
-
width:300px;
 
height:120px;
height:120px;
text-align:center;
text-align:center;
margin:6px;
margin:6px;
 +
        padding-left:25px;
}
}
.sponsors{
.sponsors{
Line 443: Line 517:
text-align:center;
text-align:center;
}
}
-
 
.sponsors h3{
.sponsors h3{
display:block;
display:block;
Line 468: Line 541:
display:none;
display:none;
}
}
 +
/*For the acknowledge part*/
 +
.ackn{
 +
        float:left;
 +
        width:688px;
 +
}
 +
.ackn img{
 +
        display:block;
 +
        float:left;
 +
width:120px;
 +
margin-bottom:30px;
 +
        padding:0 20px 0 20px;
 +
        border-radius:6%;
 +
}
 +
.ackn h3{
 +
        display:block;
 +
float:left;
 +
width:520px;
 +
height:36px;
 +
}
 +
.ackn p{
 +
        display:block;
 +
float:left;
 +
width:520px;
 +
}
 +
#ackn2 img{
 +
        float:right;
 +
}
 +
#ackn3 p{
 +
      width:688px;
 +
}
 +
#ackn5 img{
 +
        float:right;
 +
}
 +
#ackn7 img{
 +
        float:right;
 +
}
 +
#ackn9 img{
 +
        float:right;
 +
}
 +
#ackn14 img{
 +
        float:right;
 +
}
 +
#ackn10 p{
 +
      width:688px;
 +
}
 +
#ackn11 p{
 +
      width:688px;
 +
}
 +
#ackn15 p{
 +
      width:688px;
 +
}
 +
/*For protocol part*/
 +
/*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{
 +
float:left;
 +
width:1002px;
 +
}
 +
.pro_sub{
 +
float:left;
 +
width:280px;
 +
height:250px;
 +
margin:12px;
 +
padding:15px;
 +
        background-color:#e7e7e7;
 +
        border-radius:10px;
 +
       
 +
}
 +
.pro_sub h4 a{
 +
        display:block;
 +
      font-family:Verdana, Geneva, sans-serif;
 +
font-size:22px;
 +
        line-height:26px;
 +
        color:#F90;
 +
text-align:center;
 +
padding:10px;
 +
}
 +
.pro_sub ul li a{
 +
        display:block;
 +
font-family:Arial, Helvetica, sans-serif;
 +
font-size:16px;
 +
        font-size:16px;
 +
color:#000;
 +
padding:5px 15px 5px 5px;
 +
}
 +
.pro_sub a:hover{
 +
color:#F90;
 +
}
 +
.figure{
 +
        font-size:14px;
 +
        color:#5b686a;
 +
        line-height:110%;
 +
        padding:0 30px;
 +
}
 +
#pic img{
 +
        vertical-align: top;
 +
 +
}
 +
/*end of the Overview page*/
 +
 +
.proLP{
 +
float:left;
 +
width:218px;
 +
margin:15px 15px;
 +
background-color:transparent;
 +
border-right-style:solid;
 +
border-width:2px;
 +
border-color:#CCC;
 +
 +
}
 +
.proLP h3{
 +
  font:"Trebuchet MS", Arial, Helvetica, sans-serif;
 +
font-size:24px;
 +
color:#000;
 +
padding:10px;
 +
text-align:center;
 +
}
 +
.proLP h4 a{
 +
        display:block;
 +
font:Geneva, Arial, Helvetica, sans-serif;
 +
font-size:18px;
 +
color:#000;
 +
        text-decoration:underline;
 +
}
 +
#protocol ul li a{
 +
        display:block;
 +
font:Geneva, Arial, Helvetica, sans-serif;
 +
font-size:15px;
 +
color:#f88005;
 +
}
 +
.proLP ul li{
 +
        display:block;
 +
padding:5px 25px 5px 0px;
 +
font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
 +
font-size:16px;
 +
line-height:28px;
 +
}
 +
 +
.proLP ul li a{
 +
color:#F88005;
 +
}
 +
.proLP ul li ul li{
 +
        display:block;
 +
font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
 +
font-size:14px;
 +
        padding-left:20px;
 +
line-height:24px;
 +
}
 +
.proLP ul li ul li a{
 +
        color:black;
 +
}
 +
 +
.proLP ul li ul li ul li{
 +
        display:block;
 +
font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
 +
font-size:13px;
 +
line-height:24px;
 +
}
 +
 +
.proRP{
 +
float:left;
 +
width:690px;
 +
margin:15px 0 30px 0;
 +
padding:30px;
 +
background-color:transparent;
 +
border-style:solid;
 +
border-color:#CCC;
 +
border-width:1px;
 +
        border-radius:4px;
 +
}
 +
.proRP h1{
 +
        font-family:"Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
 +
      font-size:30px;
 +
      font-weight:bold;
 +
      color:#F88005;
 +
      line-height:40px;
 +
      text-align:left;
 +
      padding:10px;
 +
}
 +
.proRP h2{
 +
font-family:"Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
 +
        font-size:20px;
 +
line-height:36px;
 +
padding:0;
 +
        color:#039648;
 +
        text-align:left;
 +
}
 +
.proRP h3{
 +
font-family:"Charter Black", sans-serif;
 +
font-size:18px;
 +
padding:5px 0;
 +
color:#BF2F15;
 +
        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{
 +
font-size:16px;
 +
text-align:justify;
 +
}
 +
#humanPractice img{
 +
        border-radius:8%;
 +
}
 +
#protocol  ul li:hover{
 +
        background-color:#DFDFDF;
 +
        border-radius:4px;
 +
}
 +
 +
/*For the achievement part */
 +
#achv{
 +
float:left;
 +
margin:10px 0;
 +
        padding:40px;
 +
width:922px;
 +
        border:solid 1px #CCCCCC;
 +
        border-radius:5px;
 +
}
 +
#achv h1{
 +
font:30px Helvetica,sans-serif;
 +
color:#BF2F15;
 +
}
 +
#achv h2{
 +
      font:30px;
 +
}
 +
#achv p{
 +
        text-align:justify;
 +
        padding-left:25px;
 +
}
 +
#achv_img1{
 +
        float: left;
 +
        height:400px;
 +
        width:200px;
 +
}
 +
#achv_p1{
 +
        float: left;
 +
        width:690px;
 +
border-bottom-style:solid;
 +
border-bottom-color:#CCC;
 +
border-bottom-width:1px;
 +
}
 +
#achv_img2{
 +
        float: right;
 +
        height:400px;
 +
        width:200px;
 +
}
 +
#achv_p2{
 +
        float: left;
 +
        height:360px;
 +
        width:690px;
 +
border-bottom-style:solid;
 +
border-bottom-color:#CCC;
 +
border-bottom-width:1px;
 +
}
 +
#achv_img3{
 +
        float: left;
 +
        height:400px;
 +
        width:200px;
 +
}
 +
#achv_p3{
 +
        float: left;
 +
        height:399px;
 +
        width:690px;
 +
border-bottom-style:solid;
 +
border-bottom-color:#CCC;
 +
border-bottom-width:1px;
 +
}
 +
#Achieve a{
 +
        color:black;
 +
}
 +
/*For the gallery*/
 +
.gallery_single_part{
 +
        float:left;
 +
        width:650px;
 +
}
 +
.gallery li{
 +
        display:block;
 +
        float:left;
 +
        width:120px;
 +
        margin:15px;
 +
        border:5px solid #eee;
 +
}
 +
 +
/*For each overview part*/
 +
#overview{
 +
        float:left;
 +
        width:1002px;
 +
}
 +
#overview h1{
 +
        font:25px  Lucida Sans Unicode, Lucida Grande, sans-serif;
 +
        padding:20px 0;
 +
}
 +
/*For notebook part*/
 +
.note_three{
 +
        float:left;
 +
        width:334px;
 +
        height:500px;
 +
}
 +
.note_three h2{
 +
        font:20px  Lucida Sans Unicode, Lucida Grande, sans-serif;
 +
        padding:10px 0;
 +
        color:#f88005;
 +
}
 +
.note_three a{
 +
        color:#f88005;
 +
 +
}
 +
#note_nav li{
 +
        padding-left:30px;
 +
}
 +
 +
#note_safety{
 +
        height:250px;
 +
}
 +
.note_three p{
 +
        padding:0 20px 10px 20px;
 +
        text-align:justify;
 +
}
 +
.collapsibleListTitle {
 +
cursor: pointer;
 +
position: relative;
 +
}
 +
.collapsibleListBody img{
 +
        display:block;
 +
        margin:15px auto;
 +
}
 +
#notebookWrap h4{
 +
font-family:"Charter Black", sans-serif;
 +
font-size:18px;
 +
        padding:5px 0px 5px 30px;
 +
        border-bottom: solid 2px #ccc;
 +
}
 +
#notebookWrap p{
 +
        background-color: #f4f4f8;
 +
}
 +
#notebookWrap h2{
 +
        color:#000;
 +
}
 +
#BBWrap p img{
 +
        display:block;
 +
        margin:15px auto;
 +
}
 +
#lab_team1{
 +
        background-color:#fcebeb;
 +
        border-left:solid 10px #fcc;
 +
        border-radius:5px;
 +
}
 +
#lab_team2{
 +
        background-color:#fcedd6;
 +
        border-left:solid 10px #fdd7a0;
 +
        border-radius:5px;
 +
}
 +
#lab_team3{
 +
        background-color:#daf1dc;
 +
        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*/
 +
/* project overview */
 +
 +
.note_sthree{
 +
        float:left;
 +
width:280px;
 +
        height:290px;
 +
margin:12px;
 +
padding:15px;
 +
        background-color:#e7e7e7;
 +
        border-radius:10px;
 +
}
 +
.note_sthree h2{
 +
        font:20px  Lucida Sans Unicode, Lucida Grande, sans-serif;
 +
        padding:10px 0;
 +
        color:#f88005;
 +
}
 +
.note_sthree a{
 +
        color:#f88005;
 +
 +
}
 +
 +
.note_sthree p{
 +
        padding:0 20px 10px 20px;
 +
        text-align:justify;
 +
}
 +
.news{
 +
        float:left;
 +
        width:230px;
 +
        margin-top:20px;
 +
        text-align:center;
 +
}
 +
.news img{
 +
        border-radius:50%;
 +
}
 +
 +
/*This is for the presentation part*/
 +
#Presentation{
 +
        float:left;
 +
        width:690px;
 +
}
 +
.pres{
 +
        float:left;
 +
        width:220px;
 +
        text-align:center;
 +
        margin:20px 5px 0 5px;
 +
        padding:20px 0;
 +
        background-color:#faedda;
 +
        border-radius:4px;
 +
}
 +
.pres img{
 +
        border-radius:8%;
 +
 +
}
 +
.pres h3{
 +
        text-align:center;
 +
}
 +
 +
/*Modify the table*/
 +
.table1  {
 +
        font-family:"Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
 +
  width:100%;
 +
  border-collapse:collapse;
 +
  }
 +
.table1 th,  .table1 td{
 +
  font-size:1em;
 +
  border:1px solid #98bf21;
 +
  padding:3px 7px 2px 7px;
 +
}
 +
 +
.table1 th{
 +
          font-size:1.1em;
 +
          padding-top:5px;
 +
          padding-bottom:4px;
 +
          background-color:#A7C942;
 +
          color:#ffffff;
 +
}
 +
.table1 tr:nth-child(odd){
 +
          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 */
 +
.fblike iframe {
 +
    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