ProtoCat

From 2014.igem.org

(Difference between revisions)
Line 2: Line 2:
-
{{CSS/Main}}
+
{{CSS/ProtoCat}}

Revision as of 23:47, 19 September 2014


/* Theme Name: 1stwebdesigner HTML5/CSS3 Layout Date: March 2013 Description: Basic HTML5/CSS3 layout built on a responsive framework Version: 1.0 Author: Christian Vasile Author URL: http://christianvasile.com

  • /

/* ===========================

  ======= Body style ======== 
  =========================== */
  

body { background-image: url('img/bg.png'); color: black; font-size: 87.5%; /* Base font size: 14px */ font-family: 'Trebuchet MS', Trebuchet, 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; line-height: 1.429; margin: 0; padding: 0; text-align: left; }

.body { clear: both; margin: 0 auto; width: 70%; }

/* ===========================

  ========= Headings ======== 
  =========================== */

h2 {font-size: 1.571em} /* 22px */ h3 {font-size: 1.429em} /* 20px */ h4 {font-size: 1.286em} /* 18px */ h5 {font-size: 1.143em} /* 16px */ h6 {font-size: 1em} /* 14px */

h2, h3, h4, h5, h6 { font-weight: 400; line-height: 1.1; margin-bottom: .8em; color: black; }

/* ===========================

  ======= Anchor style ====== 
  =========================== */

a { outline: 0; }


a:link, a:visited { color: black; padding: 0 1px; text-decoration: none; }

a:hover, a:active { background-color: #B9D3E3; color: #fff; text-decoration: none; }

/* ===========================

  ===== Main Navigation ===== 
  =========================== */

.mainHeader h1 { font-size: 400%; text-align: center; float: none; margin: 3% 0 3% 0; color: #4682B4; }

.mainHeader nav { background: #4682B4; font-size: 1.143em; height: 40px; line-height: 30px; margin: 0 auto 30px auto; text-align: center; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

.mainHeader nav ul { list-style: none; margin: 0 auto; }

.mainHeader nav ul li { float: left; display: inline; }

.mainHeader nav a:link, .mainHeader nav a:visited { text-transform: uppercase; color: #FFFFFF; display: inline-block; height: 30px; padding: 5px 23px; text-decoration: none; } .mainHeader nav a:hover, .mainHeader nav a:active, .mainHeader nav .active a:link, .mainHeader nav .active a:visited { background: #B9D3E3; color: #FFFFFF; text-shadow: none !important; }

.mainHeader nav li a { border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

/* ===========================

  ======= Content Area ====== 
  =========================== */

.mainContent { overflow: hidden; line-height: 25px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; float: left; }

.mainContent img { border: 0px; text-decoration: none; float: left; width: 68%; height: auto; margin: 0 0 1% 0; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

.topcontent { background-color: #FFF; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 3% 5%; margin-bottom: 3%; float: left; }

.content { width: 68%; float: left; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

/* ===========================

  ======== Sidebar ========== 
  =========================== */

.top-sidebar { width: 22%; float: left; margin-left: 2%; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; background-color: #FFF; padding: 2% 3%; margin-bottom: 2%; }

.middle-sidebar { width: 22%; float: left; margin-left: 2%; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; background-color: #FFF; padding: 2% 3%; margin-bottom: 2%; }

.bottom-sidebar { width: 22%; float: left; margin-left: 2%; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; background-color: #FFF; padding: 2% 3%; }

/* ===========================

  ========= Footer ========== 
  =========================== */

.mainFooter { width: 100%; float: left; margin-top: 2%; margin-bottom: 2%; padding-left: 0; background-color: #4682B4; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; color: #FFF; }

.mainFooter p { width: 91%; margin: 2% auto; }

/* ===========================

  ====== Media Queries ====== 
  =========================== */

@media only screen and (min-width : 150px) and (max-width : 780px) { .body { clear: both; margin: 0 auto; width: 90%; font-size: 90%; }

.mainHeader nav { background: #666; font-size: 1.143em; height: 160px; line-height: 30px; margin-bottom: 0; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

.mainHeader nav ul { list-style: none; margin: 0 auto; padding-left: 0; }

.mainHeader nav li { margin-left: 0 auto; width: 100%; }

.mainHeader nav a:link, .mainHeader nav a:visited { color: #FFF; display: block; height: 30px; padding: 5px 0; text-decoration: none; }

.mainHeader nav a:active, .mainHeader nav .active a:link, .mainHeader nav .active a:visited { background: #CF5C3F; color: #fff; text-shadow: none !important; }

.mainHeader nav li a { border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;

border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

.mainHeader img { width: 68%; height: auto; }

.mainContent { overflow: hidden; line-height: 25px; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; margin-top: 4%; margin-bottom: 2%; }

.topcontent { background-color: #FFF; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 2% 5%; margin-bottom: 4%; }

.content { width: 100%; float: left; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

.top-sidebar { width: 86%; float: left; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; background-color: #FFF; margin-top: 4%; margin-left: 0; padding: 0 7%; margin-bottom: 0; }

.top-sidebar p { width: 90%; }

.middle-sidebar { width: 86%; float: left; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; background-color: #FFF; margin-top: 4%; margin-left: 0; padding: 0 7%; margin-bottom: 0; }

.middle-sidebar p { width: 90%; }

.bottom-sidebar { width: 86%; float: left; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; background-color: #FFF; margin-top: 4%; margin-left: 0%; padding: 0 7%; margin-bottom: 1%; }

.bottom-sidebar p { width: 90%; }

.mainFooter { width: 100%; float: left; margin: 2% 0; padding-left: 0; background-color: #B9D3E3; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; color: #FFF; }

.mainFooter p { width: 86%; margin: 2% auto; } }


WELCOME TO iGEM 2014!

Your team has been approved and you are ready to start the iGEM season!
On this page you can document your project, introduce your team members, document your progress
and share your iGEM experience with the rest of the world!


Click here to edit this page!

Home Team Official Team Profile Project Parts Modeling Notebook Safety Attributions

Notebook

You should make use of the calendar feature on the wiki and start a lab notebook. This may be looked at by the judges to see how your work progressed throughout the summer. It is a very useful organizational tool as well.

ProtoCat

ProtoCat - Protocol Catalogue and Calculator

ProtoCat

Home

Welcome to ProtoDB, the free online catalogue of laboratory protocols. With over [number] protocols and a built-in calculator, we are simplifying laboratory procedures one protocol at a time.