Team:Calgary/StyleSheets/Content

From 2014.igem.org

(Difference between revisions)
 
(10 intermediate revisions not shown)
Line 17: Line 17:
background: none;
background: none;
padding-right: 0;
padding-right: 0;
 +
}
 +
 +
#Page {
 +
min-width: 960px;
}
}
Line 36: Line 40:
img {
img {
margin: 30px;
margin: 30px;
 +
}
 +
 +
span, i, b {
 +
font-size: inherit;
}
}
Line 46: Line 54:
}
}
-
.Content p {
+
.Content p, .Content li {
font: 16px/125% 'Open Sans', sans-serif;
font: 16px/125% 'Open Sans', sans-serif;
}
}
Line 121: Line 129:
.Color-Orange h1, .Color-Orange h2, .Color-Orange h3, .Color-Orange h4, .Color-Orange h5, .Color-Orange h6 {
.Color-Orange h1, .Color-Orange h2, .Color-Orange h3, .Color-Orange h4, .Color-Orange h5, .Color-Orange h6 {
color: #6E6E6E;
color: #6E6E6E;
 +
}
 +
 +
.Color-Black {
 +
background: #333333;
 +
color: #FFFFFF;
 +
}
 +
 +
.Color-Black h1, .Color-Black h2, .Color-Black h3, .Color-Black h4, .Color-Black h5, .Color-Black h6 {
 +
color: #FFFFFF;
}
}
Line 149: Line 166:
}
}
-
#HomeHuman{
+
#HomeRobot, #HomeDevice{
width: 300px;
width: 300px;
-
float: right;
 
margin: 0 130px 0 70px;
margin: 0 130px 0 70px;
 +
}
 +
 +
#HomeHuman {
 +
width: 350px;
 +
margin: 0 100px 0 70px;
 +
}
 +
 +
#HomeRobot, #HomeHuman {
 +
float: right;
 +
}
 +
 +
#HomeDevice {
 +
float: left;
}
}
Line 175: Line 204:
}
}
-
h2.HomeMisdiagnosisH2, h2.HomeCaseStudyH2, h2.HomeOurDeviceH2, h2.HomeComponentsH2 {
+
h2.HomeBsDetectorH2, h2.HomeBsDetectorH2 i, h2.HomeMisdiagnosisH2, h2.HomeCaseStudyH2, h2.HomeOurDeviceH2, h2.HomeComponentsH2 {
text-decoration: none;
text-decoration: none;
-
margin: 0 0 25px 40px;
+
margin-bottom: 25px;
font-size: 40px;
font-size: 40px;
}
}
-
p.HomeMisdiagnosisP, p.HomeCaseStudyP, p.HomeOurDeviceP, p.HomeComponentsP {
+
p.HomeBsDetectorP, p.HomeMisdiagnosisP, p.HomeCaseStudyP, p.HomeOurDeviceP, p.HomeComponentsP {
font-size: 24px;
font-size: 24px;
text-indent: 0;
text-indent: 0;
Line 193: Line 222:
.Center {
.Center {
display: block;
display: block;
-
margin: 0 auto;
+
margin: 30px auto;
}
}
Line 207: Line 236:
h4.ListIndent{
h4.ListIndent{
text-indent: 1.25em;
text-indent: 1.25em;
 +
}
 +
 +
.Blue {
 +
color: #44CCC5;
 +
}
 +
 +
.Orange {
 +
color: #E8A772;
}
}
Line 229: Line 266:
#groupparts {
#groupparts {
margin: 50px auto;
margin: 50px auto;
 +
}
 +
 +
.buttoncontainer{
 +
width: 100%;
 +
max-width: 960px;
 +
margin: auto;
 +
font-size: 0;
 +
}
 +
 +
.button{
 +
width: 24%;
 +
float: none;
 +
margin: 0.5%;
 +
display:inline-block;
 +
}
 +
 +
.button a img{
 +
width:100%;
 +
margin: 0;
 +
}
 +
 +
.button a img:hover{
 +
opacity: 0.8;
 +
filter: alpha(opacity=80); /* for IE8 and earlier */
}
}

Latest revision as of 03:49, 18 October 2014

/*** Name: Wm. Keith van der Meulen Date: Summer 2014 Organization: University of Calgary iGEM Team 2014

---Purpose--- CSS code to define content page stylings.

Cite: Wm. Keith van der Meulen University of Calgary iGEM 2013 https://2014.igem.org/Team:Calgary/StyleSheets/Content?action=raw&ctype=text/css

      • /
  1. bodyContent a[href^="https://"], .link-https {

background: none; padding-right: 0; }

  1. Page {

min-width: 960px; }

sub { 

   vertical-align: sub;
   font-size: smaller;

}

sup { 

   vertical-align: super;
   font-size: smaller;

}

iframe { display: block; margin: 0 auto; }

img { margin: 30px; }

span, i, b { font-size: inherit; }

.Content { position: relative; padding: 50px 6%; top: 84px; text-align: left; overflow: hidden; }

.Content p, .Content li { font: 16px/125% 'Open Sans', sans-serif; }

.Content h1, .Content h2, .Content h3, .Content h4, .Content h5, .Content h6 { font-family: 'Archivo Narrow', sans-serif; line-height: 150%; } .Content h1 { font-weight: bold; }

.Content h2, .Content h3, .Content h4, .Content h5, .Content h6 { margin-top: 20px; text-decoration: underline; }

.Content h3, .Content h4, .Content h5, .Content h6 { font-weight: normal; }

.Content h1, .Content h1 i { font-size: 30px; font-weight: bold; }

.Content h2, .Content h2 i { font-size: 26px; font-weight: bold; }

.Content h3, .Content h3 i { font-size: 22px; }

.Content h4, .Content h4 i { font-size: 20px; }

.Content h5, .Content h5 i { font-size: 18px; }

.Content h6, .Content h6 i { font-size: 16px; }

.Color-Normal { color: #333333; }

.Color-Normal h1, .Color-Normal h2, .Color-Normal h3, .Color-Normal h4, .Color-Normal h5, .Color-Normal h6 { color: #333333; }

.Color-Normal h1 { border-bottom: #333333 3px solid }

.Color-Light { background: #EEF3FA; color: #6E6E6E; }

.Color-Light h1, .Color-Light h2, .Color-Light h3, .Color-Light h4, .Color-Light h5, .Color-Light h6 { color: #6E6E6E; }

.Color-Orange { background: #F9E3C5; color: #6E6E6E; }

.Color-Orange h1, .Color-Orange h2, .Color-Orange h3, .Color-Orange h4, .Color-Orange h5, .Color-Orange h6 { color: #6E6E6E; }

.Color-Black { background: #333333; color: #FFFFFF; }

.Color-Black h1, .Color-Black h2, .Color-Black h3, .Color-Black h4, .Color-Black h5, .Color-Black h6 { color: #FFFFFF; }

.Color-Dark { background: #2A2A2A; color: #F1F1F1; }

.Color-Dark h1, .Color-Dark h2, .Color-Dark h3, .Color-Dark h4, .Color-Dark h5, .Color-Dark h6 { color: #F1F1F1; }

.Color-Blue { background: #C5F2F4; color: #333333; }

.Color-Blue h1, .Color-Blue h2, .Color-Blue h3, .Color-Blue h4, .Color-Blue h5, .Color-Blue h6 { color: #333333; }

.Text p, .Text ol, .Text ul, .Text table { margin-bottom: 1em; }

.Text p { text-indent: 1.5em; }

  1. HomeRobot, #HomeDevice{

width: 300px; margin: 0 130px 0 70px; }

  1. HomeHuman {

width: 350px; margin: 0 100px 0 70px; }

  1. HomeRobot, #HomeHuman {

float: right; }

  1. HomeDevice {

float: left; }

  1. HomeMisdiagnosis {

background: #EEF3FA url('https://static.igem.org/mediawiki/2014/c/cd/2014UCalgaryHomeMisdiagnosisTriangles.png') no-repeat right top; background-size: 600px 100px; }

  1. HomeCaseStudy {

background: #F9E3C5 url('https://static.igem.org/mediawiki/2014/6/66/2014UCalgaryHomeCaseStudyBG.png'); }

  1. HomeOurDevice {

background-image: url('https://static.igem.org/mediawiki/2014/7/71/2014UCalgaryHomeOurDevicBGTop.png'), url('https://static.igem.org/mediawiki/2014/3/3d/2014UCalgaryHomeOurDevicBGBottom.png'); background-repeat: no-repeat; background-position: right top, left bottom; background-size: 500px 100px; }

  1. HomeComponents {

background: #C5F2F4 url('https://static.igem.org/mediawiki/2014/6/66/2014UCalgaryHomeCaseStudyBG.png') }

h2.HomeBsDetectorH2, h2.HomeBsDetectorH2 i, h2.HomeMisdiagnosisH2, h2.HomeCaseStudyH2, h2.HomeOurDeviceH2, h2.HomeComponentsH2 { text-decoration: none; margin-bottom: 25px; font-size: 40px; }

p.HomeBsDetectorP, p.HomeMisdiagnosisP, p.HomeCaseStudyP, p.HomeOurDeviceP, p.HomeComponentsP { font-size: 24px; text-indent: 0; }

span.HomeBigText { font-size: 26px; font-weight: bold; }

.Center { display: block; margin: 30px auto; }

p.Center { text-align: center; text-indent: 0; }

p.NoIndent { text-indent: 0; }

h4.ListIndent{ text-indent: 1.25em; }

.Blue { color: #44CCC5; }

.Orange { color: #E8A772; }

.TeamMember, .Sponsor { overflow: hidden; }

.MemberPic { width: 175px; }

.TeamLeft { float: left; margin-right: 30px; }

.TeamRight, .SponsorLogo { float: right; margin-left: 30px; }

  1. groupparts {

margin: 50px auto; }

.buttoncontainer{ width: 100%; max-width: 960px; margin: auto; font-size: 0; }

.button{ width: 24%; float: none; margin: 0.5%; display:inline-block; }

.button a img{ width:100%; margin: 0; }

.button a img:hover{ opacity: 0.8; filter: alpha(opacity=80); /* for IE8 and earlier */ }

Retrieved from "http://2014.igem.org/Team:Calgary/StyleSheets/Content"