Difference between revisions of "Template:Goettingen/CSS"
| Line 1: | Line 1: | ||
| − | <html | + | <html> |
| − | + | <style> | |
| − | + | /* 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:0; | |
| − | + | margin:0; | |
| − | + | list-style-type:none; | |
| − | + | list-style-image:url(''); | |
| − | + | background-image:url(''); | |
| − | + | border-bottom:none; | |
| + | } | ||
| + | a{ | ||
| + | color:#6699FF; | ||
| + | } | ||
| + | a:link { | ||
| + | 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{ | |
| − | + | font-weight:normal; | |
| + | font-size:100%; | ||
| + | } | ||
| + | p{ | ||
| + | line-height:150%; | ||
| + | font-family:"Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif; | ||
| + | } | ||
| + | body{ | ||
| + | background-color:#F7F7F7; | ||
} | } | ||
td{ | td{ | ||
| − | + | text-align: center; | |
| − | + | ||
} | } | ||
| − | # | + | #top-section{ |
| − | + | display:block; | |
| − | + | position:relative; | |
| − | + | margin-top:10px; | |
| − | + | background:none; | |
| − | + | ||
| − | + | ||
| − | + | ||
} | } | ||
| − | # | + | /*end of the reset*/ |
| − | + | ||
| − | + | ||
| − | + | #supportBox{ | |
| − | + | position: absolute; | |
| − | + | top:80%; | |
| + | right:-18%; | ||
| + | z-index: 5; | ||
| + | overflow: visible | ||
} | } | ||
| − | # | + | #globalWrapper{ |
| − | + | margin:0 auto; | |
| − | + | width:1002px; | |
} | } | ||
| − | . | + | /*header part*/ |
| − | + | #header{ | |
| + | float:left; | ||
| + | height:270px; | ||
| + | width:1002px; | ||
| + | margin-top:15px; | ||
| + | } | ||
| + | #headerPic{ | ||
| + | float:left; | ||
| + | height:230px; | ||
| + | width:1002px; | ||
| + | background-image:url("https://static.igem.org/mediawiki/2014/7/75/Goettingen_header_Pic.png"); | ||
| + | background-size:contain; | ||
| + | } | ||
| + | #teamLogo{ | ||
| + | float:left; | ||
| + | margin:35px 0; | ||
| + | padding-left:25px; | ||
| + | } | ||
| + | #uniLogo{ | ||
| + | float:right; | ||
| + | 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{ |
| − | + | float:left; | |
| − | + | height:38px; | |
| − | + | width:826px; | |
| − | + | text-align:center; | |
| + | font:18px Calibri,sans-serif; | ||
} | } | ||
| − | # | + | #menuBar ul li{ |
| − | + | width:118px; | |
| − | + | line-height:38px; | |
| − | + | float:left; | |
| − | + | ||
} | } | ||
| − | # | + | #menuBar ul li a{ |
| − | + | color:#FFF; | |
| − | + | ||
} | } | ||
| + | #menuBar ul li:hover{ | ||
| + | background-color:#DFDFDF; | ||
| + | border-radius:4px; | ||
| + | } | ||
| + | #menuBar ul li:hover .wrap{ | ||
| + | display:block; | ||
| + | z-index:99; | ||
| + | } | ||
| + | #menuBar ul li:hover a{ | ||
| + | color:#e98f00; | ||
| + | } | ||
| + | #menuBar ul li:hover li a{ | ||
| + | color:white; | ||
| + | } | ||
| + | #menuBar ul li .wrap{ | ||
| + | position:absolute; | ||
| + | width:210px; | ||
| + | text-align:left; | ||
| + | display:none; | ||
| + | } | ||
| + | #menuBar ul li ul li{ | ||
| + | line-height:20px; | ||
| + | border-left:solid 5px #ccc; | ||
| + | border-bottom:solid 1px #fff; | ||
| + | padding:10px 20px; | ||
| + | font-size:15px; | ||
| + | background-color:#FFB573; | ||
| + | } | ||
| + | #menuBar ul li ul li:hover a{ | ||
| + | color:#e98f00; | ||
| + | } | ||
| + | #contact{ | ||
| + | float:right; | ||
| + | height:38px; | ||
| + | width:176px; | ||
| + | padding:0; | ||
| + | } | ||
| + | #contact a{ | ||
| + | display:block; | ||
| + | float:left; | ||
| + | width:38px; | ||
| + | height:38px; | ||
| − | |||
| − | |||
| − | |||
| − | |||
} | } | ||
| − | # | + | #go2top{ |
| − | + | z-index:199; | |
| − | + | position:fixed; | |
| − | + | bottom:2%; | |
| − | + | right:2%; | |
| − | + | 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*/ |
| − | + | /*for the wrapper*/ | |
| + | #wrapper { | ||
| + | display: block; | ||
| + | height: 360px; | ||
| + | width: 1002px; | ||
| + | margin: auto; | ||
} | } | ||
| − | # | + | #container { |
| − | + | background-color: #FFC; | |
| − | + | background-image: none; | |
| − | + | display: block; | |
| − | + | float: left; | |
| + | height: 360px; | ||
| + | width: 1002px; | ||
| + | overflow: auto; | ||
} | } | ||
| − | # | + | #container #prev{ |
| − | + | background-image: url("https://static.igem.org/mediawiki/2014/8/84/Goettingen_prev_icon.png"); | |
| − | + | background-repeat: no-repeat; | |
| + | background-position: center center; | ||
| + | background-size:40%; | ||
| + | display: block; | ||
| + | height: 360px; | ||
| + | width: 100px; | ||
| + | float: left; | ||
| + | position: relative; | ||
| + | z-index: 9; | ||
} | } | ||
| − | # | + | #container #next { |
| − | + | background-image: url("https://static.igem.org/mediawiki/2014/b/b5/Goettingen_next_icon.png"); | |
| − | + | background-repeat: no-repeat; | |
| − | + | background-position: center center; | |
| − | + | background-size:40%; | |
| − | + | display: block; | |
| − | + | float: right; | |
| − | + | height: 360px; | |
| − | + | width: 100px; | |
| + | position: relative; | ||
| + | z-index: 9; | ||
} | } | ||
| + | #container #slider { | ||
| + | display: block; | ||
| + | float: left; | ||
| + | height: 360px; | ||
| + | width: 1002px; | ||
| + | overflow: hidden; | ||
| + | position: absolute; | ||
| + | } | ||
| + | /*For the four main parts*/ | ||
| − | + | #fourParts{ | |
| − | + | float:left; | |
| − | + | margin:10px 0; | |
| − | + | height:650px; | |
| − | + | width:1002px; | |
| − | + | border:solid 1px #CCCCCC; | |
| + | border-radius:4px; | ||
| + | } | ||
| + | .four{ | ||
| + | margin:5px 15px; | ||
| + | padding:20px 10px 10px 10px; | ||
| + | height:260px; | ||
| + | width:440px; | ||
| + | float:left; | ||
| + | } | ||
| + | #fourParts h1{ | ||
| + | display:block; | ||
| + | font:20px Helvetica,sans-serif; | ||
| + | color:#BF2F15; | ||
| + | border-bottom:solid thin #D3D3D3; | ||
| + | } | ||
| + | .pictures{ | ||
| + | margin:15px 0 25px 5px; | ||
| + | height:170px; | ||
| + | width:180px; | ||
| + | float:left; | ||
| + | } | ||
| + | #Pic1{ | ||
| + | padding-top:25px; | ||
| + | } | ||
| + | #Pic3{ | ||
| + | padding-top:45px; | ||
| + | } | ||
| + | .paragraph{ | ||
| + | margin:5px 0; | ||
| + | height:190px; | ||
| + | width:250px; | ||
| + | float:right; | ||
| + | font-size:13px; | ||
| + | line-height:18px; | ||
| + | text-align:justify; | ||
} | } | ||
| − | + | .button{ | |
| − | + | width:80px; | |
| + | height:30px; | ||
| + | float:right; | ||
| + | background:#FFB573; | ||
| + | font:14px Candara,sans-serif; | ||
| + | text-align:center; | ||
} | } | ||
| + | .button a{ | ||
| + | line-height:30px; | ||
| + | } | ||
| + | .button a:hover{ | ||
| + | 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*/ | ||
| + | #footer{ | ||
float:left; | float:left; | ||
| − | + | margin:40px auto; | |
| − | + | height:31px; | |
| − | + | width:1002px; | |
| − | + | border:solid 1px #CCC; | |
| − | + | ||
| − | + | ||
} | } | ||
| − | # | + | #copyrightIco{ |
| − | + | float:left; | |
| + | width:88px; | ||
| + | height:31px; | ||
} | } | ||
| − | # | + | |
| − | + | #list1 ul li{ | |
| − | + | display:block; | |
| − | + | float:left; | |
| − | + | width:130px; | |
| − | margin | + | height:15px; |
| − | + | text-align:center; | |
| + | font-size:10px; | ||
| + | margin:0 15px; | ||
| + | } | ||
| + | |||
| + | #list2 ul li{ | ||
| + | display:block; | ||
| + | float:left; | ||
| + | width:140px; | ||
| + | height:15px; | ||
| + | text-align:center; | ||
| + | font-size:10px; | ||
| + | margin:0 22px; | ||
} | } | ||
| − | # | + | #poweredByIco{ |
| − | + | float:right; | |
} | } | ||
| − | # | + | #footerbanner{ |
| − | + | float:left; | |
| + | margin:30px 0; | ||
} | } | ||
| + | /*For the subpage*/ | ||
| + | /*next and previous buttons*/ | ||
| + | #goenext { | ||
| + | float:right; | ||
| + | |||
| + | } | ||
| + | /* For team part*/ | ||
| + | .teamM{ | ||
| + | float:left; | ||
| + | width:690px; | ||
| + | margin-top:10px; | ||
| + | border-bottom-style:solid; | ||
| + | border-width:2px; | ||
| + | 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{ | |
| − | + | float:left; | |
| + | width:690px; | ||
| + | |||
| + | margin-top:10px; | ||
| + | border-bottom-style:solid; | ||
| + | border-width:2px; | ||
| + | border-color:#CCC; | ||
} | } | ||
| − | . | + | .instructors img{ |
| − | + | display:block; | |
| − | + | float:left; | |
| − | margin- | + | width:200px; |
| + | margin-top:36px; | ||
| + | border-radius:8%; | ||
} | } | ||
| + | .instructors h2{ | ||
| + | display:block; | ||
| + | float:left; | ||
| + | width:410px; | ||
| + | height:36px; | ||
| + | margin-left:25px; | ||
| + | } | ||
| + | .instructors h3{ | ||
| + | display:block; | ||
| + | float:left; | ||
| + | width:410px; | ||
| + | margin-left:40px; | ||
| + | } | ||
| + | .instructors p{ | ||
| + | display:block; | ||
| + | float:left; | ||
| + | width:410px; | ||
| + | margin-left:40px; | ||
| + | margin-bottom:20px; | ||
| + | } | ||
| + | #instr2 img{ | ||
| + | float: right; | ||
| + | } | ||
| + | #instr2 h2{ | ||
| + | margin-left:0; | ||
| + | } | ||
| + | #instr2 p{ | ||
| + | margin-left:20px; | ||
| + | } | ||
| + | /*For sponsor part*/ | ||
| + | #sponsorWrap{ | ||
| + | float:left; | ||
| + | width:1000px; | ||
| + | border-style:solid; | ||
| + | border-color:#CCC; | ||
| + | border-width:1px; | ||
| + | } | ||
| + | #sponsorHeader{ | ||
| + | float:left; | ||
| + | width:1002px; | ||
| + | height:80px; | ||
| + | margin-top:30px; | ||
| + | text-align:center; | ||
| + | line-height:40px; | ||
| + | font-size:30px; | ||
| + | font-family:Arial, Helvetica, sans-serif; | ||
| + | color:#F90; | ||
| + | border-bottom:solid #CCC 2px; | ||
| + | } | ||
| + | |||
| + | #sponsorPic{ | ||
| + | float:left; | ||
| + | width:952px; | ||
| + | height:500px; | ||
| + | padding:25px; | ||
| + | border-bottom:solid #CCC 2px; | ||
| + | } | ||
| + | .spPic{ | ||
| + | float:left; | ||
| + | height:120px; | ||
| + | text-align:center; | ||
| + | margin:6px; | ||
| + | padding-left:25px; | ||
| + | } | ||
| + | .sponsors{ | ||
| + | float:left; | ||
| + | width:982px; | ||
| + | height:260px; | ||
| + | margin-top:20px; | ||
| + | padding:10px; | ||
| + | border-bottom:solid #CCC 2px; | ||
| + | } | ||
| + | .sponsors a{ | ||
| + | display:block; | ||
| + | float:left; | ||
| + | width:240px; | ||
| + | height:240px; | ||
| + | margin-right:20px; | ||
| + | text-align:center; | ||
| + | } | ||
| + | .sponsors h3{ | ||
| + | display:block; | ||
| + | float:left; | ||
| + | width:690px; | ||
| + | margin-left:20px; | ||
| + | font-family:Verdana, Geneva, sans-serif; | ||
| + | font-size:24px; | ||
| + | line-height:36px; | ||
| + | color:#39F; | ||
| + | } | ||
| + | .sponsors p{ | ||
| + | display:block; | ||
| + | float:left; | ||
| + | margin:20px; | ||
| + | padding-right:50px; | ||
| + | width:632px; | ||
| + | font-family:Helvetica, Arial, sans-serif; | ||
| + | font-size:16px; | ||
| + | line-height:24px; | ||
| + | text-align:justify; | ||
| + | } | ||
| + | .links a{ | ||
| + | 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> | ||
</html> | </html> | ||
Revision as of 14:20, 27 July 2016
