陳沛鴻 Human practices photoartwork-795289567 style

From 2014hs.igem.org


@font-face { 

 font-family: Yanone Kaffeesatz; 
   src: url('../fonts/YanoneKaffeesatz-Regular.eot'); 
   src: local(Yanone Kaffeesatz), url('../fonts/YanoneKaffeesatz-Regular.ttf');

}

@font-face { 

 font-family: News Cycle; 
   src: url('../fonts/NewsCycle-Regular.eot'); 
   src: local(News Cycle), url('../fonts/NewsCycle-Regular.ttf');

}

html { 

 height: 100%;}
  • { 
 margin: 0; 
 padding: 0;}

/* tell the browser to render HTML 5 elements as block */ article, aside, figure, footer, header, hgroup, nav, section { 

 display:block;}

body { 

 font: broadway, sans-serif;}

p { 

 padding: 0 0 25px 0;
 line-height: 1.7em;}

img { 

 border: 0;}

h1, h2, h3, h4, h5, h6 { 

 font: normal 200% broadway, arial, sans-serif;
 margin: 0 0 15px 0;
 padding: 0 0 5px 0;}

h2 { 

 font: normal 170% 'Yanone Kaffeesatz', arial, sans-serif;
 margin: 0;
 padding: 0 0 8px 0;}

h3 { 

 font: normal 150% arial, sans-serif;}

h4, h5, h6 { 

 margin: 0;
 padding: 0 0 5px 0;
 font: normal 110% arial, sans-serif;
 line-height: 1.5em;}

h5, h6 { 

 font: italic 95% arial, sans-serif;
 padding-bottom: 15px;}

a, a:hover { 

 outline: none;
 text-decoration: none;}

a:hover { 

 text-decoration: none;}

ul { 

 margin: 2px 0 22px 17px;}

ul li { 

 list-style-type: circle;
 margin: 0 0 0 0; 
 padding: 0 0 4px 5px;}

ol { 

 margin: 8px 0 22px 20px;}

ol li { 

 margin: 0 0 11px 0;}
  1. main, #header, #logo, #menubar, #site_content, #footer { 
 margin-left: auto; 
 margin-right: auto;}
  1. main { 
 width: 950px;
 margin: 20px auto;}

header { 

 width: 950px;
 height: 105px;}
  1. logo { 
 width: 250px;
 float: left;
 height: 100px;
 background: transparent;
 padding: 0 0 10px 10px;}
  1. logo h1 { 
 font: normal 350% 'Yanone Kaffeesatz', arial, sans-serif;
 padding: 45px 0 0 17px;}
  1. logo h1 a:hover { 
 text-decoration: none;}
  1. site_content { 
 width: 950px;
 overflow: hidden;
 margin: 4px auto 0 auto;
 padding: 0;}
  1. left_content { 
 float: left;
 text-align: justify;
 width: 444px;
 padding: 20px 0 5px 25px;
 margin: 0;}
  1. left_content ul { 
 margin: 2px 0 22px 0px;}
  1. left_content ul li { 
 list-style-type: none;
 margin: 0 0 0 0; 
 padding: 2px 0 2px 28px;
 line-height: 1.5em;}
  1. right_content { 
 float: right;
 width: 450px;
 padding: 0;
 min-height: 450px;}
  1. right_content img { 
 float: left;}

footer { 

 width: 930px;
 font: normal 100% arial, sans-serif;
 padding: 50px 20px 5px 0;
 text-align: right; 
 background: transparent;}

footer p { 

 padding: 0 0 10px 0;}

footer a, footer a:hover { 

 text-decoration: none;}

/* styling for the slideshow on the homepage */ ul.slideshow { 

 list-style: none;
 width: 950px;
 height: 450px;
 overflow: hidden;
 position: relative;
 margin: 0;
 padding: 0;}

ul.slideshow li { 

 position: absolute;
 margin: 0;
 padding: 0;
 left: 0;
 right: 0;}

ul.slideshow li.show { 

 z-index: 500;}

ul img { 

 border: none;}
  1. slideshow-caption { 
 width: 950px;
 height: 90px;
 position: absolute;
 bottom: 0;
 left: 0; 
 z-index: 500;}
  1. slideshow-caption .slideshow-caption-container { 
 padding: 20px 25px 0 25px;   
 z-index: 1000;}
  1. slideshow-caption p { 
 padding: 0;
 font: normal 130% arial, sans-serif;}

/* form styling */ .form_settings { 

 margin: 0;}

.form_settings p { 

 padding: 0 0 10px 0;}

.form_settings span { 

 padding: 5px 0; 
 float: left; 
 width: 170px; 
 text-align: left;}

.form_settings input, .form_settings textarea { 

 padding: 4px; 
 width: 252px; 
 font: 100% 'trebuchet ms', arial, sans-serif;
 border: 0;
 border-bottom: 1px solid; 
 background: transparent;}

.form_settings .submit { 

 font: 170% 'Yanone Kaffeesatz', arial, sans-serif; 
 border: 0; 
 width: 100px; 
 margin: 0 0 0 162px; 
 height: 33px;
 padding: 2px 0 3px 0;
 cursor: pointer; 
 border-radius: 6px 6px 6px 6px;
 -webkit-border-radius: 6px 6px 6px 6px;
 -moz-border-radius: 6px 6px 6px 6px;}

.form_settings textarea, .form_settings select { 

 font: 100% 'trebuchet ms', arial, sans-serif; 
 border: 1px solid; 
 border-radius: 6px 6px 6px 6px;
 -webkit-border-radius: 6px 6px 6px 6px;
 -moz-border-radius: 6px 6px 6px 6px;
 width: 250px;
 overflow: auto;}

.form_settings select { 

 width: 304px;}

.form_settings .checkbox { 

 margin: 4px 0; 
 padding: 0; 
 width: 14px;
 border: 0;
 background: none;}

/* styling for the blog page */

  1. blog_container h4 { 
 font: normal 200% 'Yanone Kaffeesatz', arial, sans-serif;
 margin: 0 0 15px 0;
 padding: 5px 0;}
  1. blog_container h4.select { 
 width: 475px;}

.blog { 

 background: url(../images/calendar.png) no-repeat;
 width: 54px;
 height: 46px;
 float: left;
 margin: 0 15px 0 0;}

.blog h2 { 

 font: bold 90% arial, sans-serif;
 text-shadow: none;
 text-align: center;
 margin: 0;
 padding: 4px 0 0 0;}

.blog h3 { 

 font: 140% arial, sans-serif;
 text-shadow: none;
 margin: 0;
 text-align: center;
 padding: -10px 0 0 0;}
  1. blog_text { 
 padding: 20px;
 overflow: auto;
 height: 100%;}
  1. blog_text h1 { 
 font: normal 190% 'Yanone Kaffeesatz', arial, sans-serif;;
 margin: 0 0 15px 0;
 padding: 5px 0;}

/* stylesheet for sooperFish by www.sooperthemes.com -- author: jurriaan roelofs */ html body ul.sf-menu ul,html body ul.sf-menu ul li { 

 width: 180px;}

html body ul.sf-menu ul ul { 

 margin: 0 0 0 180px;}

ul.sf-menu,ul.sf-menu * { 

 margin: 0;
 padding: 0;}

ul.sf-menu { 

 display: block;
 position: relative;}

ul.sf-menu li { 

 display: block;
 list-style: none;
 float: left;
 position: relative;}

ul.sf-menu li:hover { 

 visibility: inherit; /* fixes IE7 'sticky bug' */ }

ul.sf-menu a { 

 display: block;
 position: relative;}

ul.sf-menu ul { 

 position: absolute;
 left: 0;
 width: 150px; 
 top: auto;
 left: -999999px;}

ul.sf-menu ul a { 

 zoom: 1; /* IE6/7 fix */ }

ul.sf-menu ul li { 

 float: left; /* Must always be floated otherwise there will be a rogue 1px margin-bottom in IE6/7 */
 width: 150px;}

ul.sf-menu ul ul { 

 top: 0;
 margin: 0 0 0 150px;}

ul.sf-menu li:hover ul,ul.sf-menu li:focus ul,ul.sf-menu li.sf-hover ul, ul.sf-menu ul li:hover ul,ul.sf-menu ul li:focus ul,ul.sf-menu ul li.sf-hover ul, ul.sf-menu ul ul li:hover ul,ul.sf-menu ul ul li:focus ul,ul.sf-menu ul ul li.sf-hover ul, ul.sf-menu ul ul ul li:hover ul,ul.sf-menu ul ul ul li:focus ul,ul.sf-menu ul ul ul li.sf-hover ul { 

 left: auto;}

ul.sf-menu li:hover ul ul,ul.sf-menu li:focus ul ul,ul.sf-menu li.sf-hover ul ul, ul.sf-menu ul li:hover ul ul,ul.sf-menu ul li:focus ul ul,ul.sf-menu ul li.sf-hover ul ul, ul.sf-menu ul ul li:hover ul ul,ul.sf-menu ul ul li:focus ul ul,ul.sf-menu ul ul li.sf-hover ul ul, ul.sf-menu ul ul ul li:hover ul ul,ul.sf-menu ul ul ul li:focus ul ul,ul.sf-menu ul ul ul li.sf-hover ul ul { 

 left: -999999px;}

/* theming the menu */ nav { 

 width: 650px;
 margin: 1px auto 0 auto;
 float: right;
 padding: 35px 0 0 0;}

ul#nav { 

 float: right;
 margin: 25px 10px 0 0;}

ul#nav li a { 

 font: normal 150% 'News Cycle', sans-serif;
 text-decoration: none;
 outline: none;
 text-align: center;
 z-index: 10;
 display: block;
 float: left;
 height: 30px;
 padding:5px 14px 6px 15px;
 position: relative;
 overflow: hidden;}

ul#nav ul { 

 margin-top: 40px;
 padding-bottom: 10px;}
Retrieved from "http://2014hs.igem.org/%E9%99%B3%E6%B2%9B%E9%B4%BB_Human_practices_photoartwork-795289567_style"