Team:Edinburgh/tech/basiccss

From 2011.igem.org

(Difference between revisions)
m
Line 1: Line 1:
-
<style type="text/css">
+
@charset "UTF-8" ;
-
<!--
+
-
@charset "UTF-8";
+
-
/* Adapted from Edinburgh 2010 wiki */
+
@font-face {
 +
  font-family: 'Josefin Sans';
 +
  font-style: normal;
 +
  font-weight: 400;
 +
  src: local('Josefin Sans'), local('JosefinSans'), url('http://themes.googleusercontent.com/font?kit=xgzbb53t8j-Mo-vYa23n5nhCUOGz7vYGh680lGh-uXM') format('woff');
 +
}
-
/* Stylistic elements */
+
@font-face {
-
p, div {border: 0 0 0 0;
+
  font-family: 'Josefin Sans';
-
padding: 0 0 0 0;
+
  font-style: normal;
-
margin: 0 0 0 0;}
+
  font-weight: 100;
 +
  src: local('Josefin Sans Thin'), local('JosefinSans-Thin'), url('http://themes.googleusercontent.com/font?kit=q9w3H4aeBxj0hZ8Osfi3dy1dfeF-hbOdKKuBDEXxqhQ') format('woff');
 +
}
-
#content{
+
@font-face {
-
background-color: white;
+
  font-family: 'Goudy Bookletter 1911';
-
border-left: none;
+
  font-style: normal;
-
border-right: none;
+
  font-weight: normal;
-
width: 965px;
+
  src: local('Goudy Bookletter 1911'), local('GoudyBookletter1911'), url('http://themes.googleusercontent.com/font?kit=l5lwlGTN3pEY5Bf-rQEuIMvsW7MYFVYsuLRj6jSUyb0') format('woff');
}
}
 +
 +
@font-face {
 +
  font-family: 'Cabin Sketch';
 +
  font-style: normal;
 +
  font-weight: bold;
 +
  src: local('CabinSketch Bold'), local('CabinSketch-Bold'), url('http://themes.googleusercontent.com/font?kit=ki3SSN5HMOO0-IOLOj069Hl4twXkwp3_u9ZoePkT564') format('woff');
 +
}
 +
/*
 +
@font-face {
 +
  font-family: 'Yanone Kaffeesatz';
 +
  font-style: normal;
 +
  font-weight: 200;
 +
  src: local('Yanone Kaffeesatz Thin'), local('YanoneKaffeesatz-Thin'), url('http://themes.googleusercontent.com/font?kit=We_iSDqttE3etzfdfhuPRYa6iXjgqaxY3DU3RqApPOI') format('woff');
 +
}*/
 +
 +
/* Adapted from Edinburgh 2010 wiki */
 +
/*Menu*/
.logo {
.logo {
 +
position: relative;
 +
float: left;
left: 0px;
left: 0px;
-
top: 0px;
+
background: red;
-
width: 100%;
+
height: 76px;
-
background-color: orange;
+
padding: 8px 0 8px 0;
-
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='orange', endColorstr='#ffffff'); /*for IE*/
+
width: 190px;
-
background: -webkit-gradient(linear, 0 0, 965 100, from(orange), to(#fff)); /*for webkit*/
+
top: -5px;
-
background: -moz-linear-gradient(left, orange, #fff);/*for mozilla*/
+
}
-
height: 100px;
+
 
 +
.mainmenu ul, .leftmenu ul {
 +
list-style: none;
 +
padding: 0 0 0 0;
 +
margin: 0 0 0 0;
 +
}
 +
 
 +
.mainmenu li {
 +
display:inline;
 +
}
 +
 
 +
.mainmenu li a {
 +
font-family: 'Josefin Sans', arial, sans-serif;
 +
font-size: 20px;
 +
line-height: 20px;
 +
padding: 50px 0 22px 0;
 +
margin: 0 0 0 0;
 +
float: left;
 +
text-align: center;
 +
}
 +
 
 +
.intro, .project, .lab, .team, .sponsors  {
 +
color: #000000;
 +
width: 150px;
 +
}
 +
/* The colours here are just magic numbers! */
 +
.intro:hover, .project:hover, .lab:hover, .team:hover, .sponsors:hover, #current:hover {
 +
#current {
 +
.mainmenu {
 +
float: left;
 +
height: 92px;
 +
width: 750px;
 +
padding: 0 0 0 0;
 +
margin: 0 0 0 0;
position: relative;
position: relative;
 +
background: url('nav-top-bg.gif') repeat-x;
 +
z-index: 100;
 +
left: 225px;
 +
top: -5px;
}
}
-
#content .main_body {
+
.leftmenu {
-
width:800px; /*This is 965px - 300px for navbox - 10 for padding*/
+
float: right;
float: right;
-
background: white;
+
position: relative;
-
padding: 0.5em 0.5em 0.5em 0.5em;
+
width: 206px;
-
text-align:justify;
+
top: 25px;
-
height:100%;
+
right: -8px;
 +
background-color: white;
 +
background: url('nav-left-bg.png') repeat-y;
 +
text-align: right;
 +
}
 +
.leftmenu li {
 +
display: block;
 +
margin-top: -1px;
}
}
-
h2{
+
.leftmenu li a {
-
border-bottom-color: #870008;
+
font-family: 'Josefin Sans', arial, sans-serif;
 +
font-size: 14px;
 +
line-height: 20px;
 +
margin: 0 0 0 0;
 +
padding: 0 12px 0 8px;
 +
float: right;
 +
text-align: right;
 +
left: -8px;
 +
width: 186px;
}
}
-
#navmenu{
+
.leftmenu li a#leftcurrent {
-
position:relative;
+
background: url('select_left_mask.png');
 +
color: white;
 +
}
 +
 
 +
.leftmenu li a:hover, .leftmenu li a#leftcurrent:hover {
 +
background: url('hover_left_mask.png');
 +
color: white;
 +
}
 +
 
 +
/* #navmenu{
float: left;
float: left;
-
padding-top: 0.5em;
+
padding: 0 0 0 0;
-
padding-left: 0.5em;
+
width: 190px;
-
width: 100px;
+
-
height: 100%;
+
z-index: 1;
z-index: 1;
}
}
 +
 +
#navmenu .cat
 +
{ display: block;
 +
list-style: none;
 +
font: 14px Tahoma, Arial;
 +
margin: 5px 0px 5px 0px;}
 +
 +
#navmenu .cat a
 +
{ margin: 0.4em 1em 0.4em 1.em;
 +
line-height: 2em;
 +
text-decoration: none;
 +
width: 70px;
 +
white-space: nowrap}
 +
 +
#navmenu .cat a:hover
 +
{}
 +
 +
#navmenu .cat .cat_links
 +
{ float: left;
 +
position:relative;
 +
display: inline;
 +
margin: 0;
 +
padding-left: 1em;
 +
padding-right: 1em;
 +
border:none;
 +
top: -2em;
 +
left: 120px;
 +
z-index:100;}
 +
 +
#navmenu .cat .cat_links a
 +
{ width: auto;
 +
line-height: 1.5em;
 +
}
 +
 +
#navmenu .cat .cat_links a:hover
 +
{}
 +
*/
 +
/*hints*/
 +
.hardword {
 +
font-style: italic;}
 +
 +
.hint {
 +
position: relative;
 +
margin-top: 30px;
 +
position: fixed;
 +
bottom: 100px;
 +
width: 180px;
 +
}
 +
 +
#hintcontainer {
 +
display: inline-block;
 +
position: relative;
 +
height: 100%;
 +
width: 180px;
 +
margin-top: 25px;
 +
padding: 0 5px 0 5px;
 +
}
 +
 +
/* Boxes */
 +
#sidebar {
 +
position: absolute;
 +
width: 190px;
 +
}
 +
 +
/*.logo, #main_body, #navmenu, #hintcontainer, #footer-box {
 +
border-radius: 15px;
 +
-moz-border-radius: 15px;
 +
}*/
 +
 +
/* Stylistic elements */
 +
p, div {border: 0 0 0 0;
 +
padding: 0 0 0 0;
 +
margin: 0 0 0 0;}
 +
 +
#content{
 +
border-left: none;
 +
border-right: none;
 +
width: 975px;
 +
}
 +
 +
#content #main_body {
 +
width:740px; /*This is 965px - 190px for navbox - 35 for padding*/
 +
min-height: 550px;
 +
height: auto !important;
 +
float: right;
 +
padding: 5px 5px 5px 5px;
 +
text-align:justify;
 +
height:100%;
 +
position: relative;
 +
margin-top: 25px;
 +
}
 +
#globalWrapper, body{
#globalWrapper, body{
-
background-color: lightgrey;
 
font: 12px Tahoma, Arial, Helvetica, sans-serif;
font: 12px Tahoma, Arial, Helvetica, sans-serif;
}
}
 +
 +
/* thumbnails */
 +
div.thumb {
 +
    border: none;
 +
}
 +
 +
div.thumb:after {
 +
clear: both;
 +
visibility:hidden;
 +
height:0;
 +
}
 +
div.thumb div {
 +
    border: 1px solid;
 +
}
 +
div.thumb div a img {
 +
    border: none;
 +
}
 +
div.thumb div div.thumbcaption {
 +
    border: none;
 +
}
 +
div.tright {
 +
    padding-left: 5px;
 +
}
 +
div.tleft {
 +
    padding-right: 5px;
 +
}
 +
table{
table{
Line 65: Line 265:
text-decoration: none;
text-decoration: none;
font-weight: bold;
font-weight: bold;
-
color: #333333;
 
}
}
Line 71: Line 270:
text-decoration: none;
text-decoration: none;
font-weight: bold;
font-weight: bold;
-
color: #333333;
 
}
}
Line 77: Line 275:
text-decoration: none;
text-decoration: none;
font-weight: bold;
font-weight: bold;
-
color: #333333;
 
}
}
Line 83: Line 280:
text-decoration: none;
text-decoration: none;
font-weight: bold;
font-weight: bold;
-
color: #555555;
 
}
}
Line 89: Line 285:
/* TOC */
/* TOC */
#toc, .toc {
#toc, .toc {
-
background: white;
 
border: none;
border: none;
 +
padding: 0;
 +
margin: 0;
}
}
Line 100: Line 297:
padding-right: 1em;
padding-right: 1em;
padding-left: 1em;
padding-left: 1em;
-
border-right: dotted 1px black;
 
}
}
.toclevel-3, .toclevel-4, .toclevel-5, .toclevel-6 {
.toclevel-3, .toclevel-4, .toclevel-5, .toclevel-6 {
Line 110: Line 306:
/*Intro*/
/*Intro*/
-
.main_body p:first-child {
+
#main_body p:first-child {
font-size: 13px;
font-size: 13px;
text-indent: 0;
text-indent: 0;
 +
 +
}
 +
 +
/*Headers*/
 +
 +
h2, h3, h4 {
 +
font-family: 'Goudy Bookletter 1911', 'Times New Roman', serif;
 +
}
 +
#toctitle h2 {
 +
border:none;
 +
background: none;
 +
font-family: Tahoma, Arial, Helvetica, sans-serif;
 +
}
 +
 +
h2{
 +
margin: 0;
 +
padding: 5px 0px 5px 20px;
 +
font-size: 17pt;
 +
left: 0px;
 +
right: 0px;
 +
}
 +
 +
h3 {
 +
font-size: 13pt;
 +
text-shadow: none;
}
}
Line 118: Line 339:
pre {
pre {
-
background: #FFEEAA;
+
border-radius: 10px;
-
border: dashed 1px #FFAA99;
+
-moz-border-radius: 10px;
}
}
-
/* Editing iGEM elements */
+
/* Editting IGEM elements */
#footer {}
#footer {}
Line 151: Line 372:
#menubar li a {
#menubar li a {
-
color: white;
 
}
}
Line 167: Line 387:
}
}
-
img[src*="/wiki/skins/common/images/wiki.png"]{
+
img[src*="WebIdea_files/wiki.png"]{ /*FIXME to /wiki/skins/common/images/wiki.png */
     width:0;
     width:0;
     height:40px;
     height:40px;
     padding-right:975px;
     padding-right:975px;
-
    background: #606060;
 
}
}
-
-->
 
-
</style>
 

Revision as of 10:43, 6 July 2011

@charset "UTF-8" ;

@font-face {

 font-family: 'Josefin Sans';
 font-style: normal;
 font-weight: 400;
 src: local('Josefin Sans'), local('JosefinSans'), url('http://themes.googleusercontent.com/font?kit=xgzbb53t8j-Mo-vYa23n5nhCUOGz7vYGh680lGh-uXM') format('woff');

}

@font-face {

 font-family: 'Josefin Sans';
 font-style: normal;
 font-weight: 100;
 src: local('Josefin Sans Thin'), local('JosefinSans-Thin'), url('http://themes.googleusercontent.com/font?kit=q9w3H4aeBxj0hZ8Osfi3dy1dfeF-hbOdKKuBDEXxqhQ') format('woff');

}

@font-face {

 font-family: 'Goudy Bookletter 1911';
 font-style: normal;
 font-weight: normal;
 src: local('Goudy Bookletter 1911'), local('GoudyBookletter1911'), url('http://themes.googleusercontent.com/font?kit=l5lwlGTN3pEY5Bf-rQEuIMvsW7MYFVYsuLRj6jSUyb0') format('woff');

}

@font-face {

 font-family: 'Cabin Sketch';
 font-style: normal;
 font-weight: bold;
 src: local('CabinSketch Bold'), local('CabinSketch-Bold'), url('http://themes.googleusercontent.com/font?kit=ki3SSN5HMOO0-IOLOj069Hl4twXkwp3_u9ZoePkT564') format('woff');

} /* @font-face {

 font-family: 'Yanone Kaffeesatz';
 font-style: normal;
 font-weight: 200;
 src: local('Yanone Kaffeesatz Thin'), local('YanoneKaffeesatz-Thin'), url('http://themes.googleusercontent.com/font?kit=We_iSDqttE3etzfdfhuPRYa6iXjgqaxY3DU3RqApPOI') format('woff');

}*/

/* Adapted from Edinburgh 2010 wiki */ /*Menu*/

.logo { position: relative; float: left; left: 0px; background: red; height: 76px; padding: 8px 0 8px 0; width: 190px; top: -5px; }

.mainmenu ul, .leftmenu ul { list-style: none; padding: 0 0 0 0; margin: 0 0 0 0; }

.mainmenu li { display:inline; }

.mainmenu li a { font-family: 'Josefin Sans', arial, sans-serif; font-size: 20px; line-height: 20px; padding: 50px 0 22px 0; margin: 0 0 0 0; float: left; text-align: center; }

.intro, .project, .lab, .team, .sponsors { color: #000000; width: 150px; } /* The colours here are just magic numbers! */ .intro:hover, .project:hover, .lab:hover, .team:hover, .sponsors:hover, #current:hover {

  1. current {

.mainmenu { float: left; height: 92px; width: 750px; padding: 0 0 0 0; margin: 0 0 0 0; position: relative; background: url('nav-top-bg.gif') repeat-x; z-index: 100; left: 225px; top: -5px; }

.leftmenu { float: right; position: relative; width: 206px; top: 25px; right: -8px; background-color: white; background: url('nav-left-bg.png') repeat-y; text-align: right; }

.leftmenu li { display: block; margin-top: -1px; }

.leftmenu li a { font-family: 'Josefin Sans', arial, sans-serif; font-size: 14px; line-height: 20px; margin: 0 0 0 0; padding: 0 12px 0 8px; float: right; text-align: right; left: -8px; width: 186px; }

.leftmenu li a#leftcurrent { background: url('select_left_mask.png'); color: white; }

.leftmenu li a:hover, .leftmenu li a#leftcurrent:hover { background: url('hover_left_mask.png'); color: white; }

/* #navmenu{ float: left; padding: 0 0 0 0; width: 190px; z-index: 1; }

  1. navmenu .cat

{ display: block; list-style: none; font: 14px Tahoma, Arial; margin: 5px 0px 5px 0px;}

#navmenu .cat a { margin: 0.4em 1em 0.4em 1.em; line-height: 2em; text-decoration: none; width: 70px; white-space: nowrap}

#navmenu .cat a:hover {}

#navmenu .cat .cat_links { float: left; position:relative; display: inline; margin: 0; padding-left: 1em; padding-right: 1em; border:none; top: -2em; left: 120px; z-index:100;}

#navmenu .cat .cat_links a { width: auto; line-height: 1.5em; }

#navmenu .cat .cat_links a:hover {}

  • /

/*hints*/ .hardword { font-style: italic;}

.hint { position: relative; margin-top: 30px; position: fixed; bottom: 100px; width: 180px; }

  1. hintcontainer {

display: inline-block; position: relative; height: 100%; width: 180px; margin-top: 25px; padding: 0 5px 0 5px; }

/* Boxes */

  1. sidebar {

position: absolute; width: 190px; }

/*.logo, #main_body, #navmenu, #hintcontainer, #footer-box { border-radius: 15px; -moz-border-radius: 15px; }*/

/* Stylistic elements */ p, div {border: 0 0 0 0; padding: 0 0 0 0; margin: 0 0 0 0;}

  1. content{

border-left: none; border-right: none; width: 975px; }

  1. content #main_body {

width:740px; /*This is 965px - 190px for navbox - 35 for padding*/ min-height: 550px; height: auto !important; float: right; padding: 5px 5px 5px 5px; text-align:justify; height:100%; position: relative; margin-top: 25px; }


  1. globalWrapper, body{

font: 12px Tahoma, Arial, Helvetica, sans-serif; }

/* thumbnails */ div.thumb {

   border: none;

}

div.thumb:after { clear: both; visibility:hidden; height:0; } div.thumb div {

   border: 1px solid;

} div.thumb div a img {

   border: none;

} div.thumb div div.thumbcaption {

   border: none;

} div.tright {

   padding-left: 5px;

} div.tleft {

   padding-right: 5px;

}


table{ text-align:justify; }

A:link{ text-decoration: none; font-weight: bold; }

A:visited{ text-decoration: none; font-weight: bold; }

A:active{ text-decoration: none; font-weight: bold; }

A:hover{ text-decoration: none; font-weight: bold; }

/* Wiki formatting */ /* TOC */

  1. toc, .toc {

border: none; padding: 0; margin: 0; }

.toclevel-2 { display: inline; float: right; list-style: none; margin: 0 0 0 0; padding-right: 1em; padding-left: 1em; } .toclevel-3, .toclevel-4, .toclevel-5, .toclevel-6 { display:none;}

.toclevel-2 .tocnumber { display: none; }

/*Intro*/

  1. main_body p:first-child {

font-size: 13px; text-indent: 0;

}

/*Headers*/

h2, h3, h4 { font-family: 'Goudy Bookletter 1911', 'Times New Roman', serif; }

  1. toctitle h2 {

border:none; background: none; font-family: Tahoma, Arial, Helvetica, sans-serif; }

h2{ margin: 0; padding: 5px 0px 5px 20px; font-size: 17pt; left: 0px; right: 0px; }

h3 { font-size: 13pt; text-shadow: none; }

p {text-indent: 10px;}

pre { border-radius: 10px; -moz-border-radius: 10px; }

/* Editting IGEM elements */

  1. footer {}
  2. footer-box {border: none;

margin-top: 5px;}

  1. contentSub, #catlinks, #siteSub, #search-controls, .firstHeading, .editsection {

display:none; }

  1. search-controls {

margin-top:30px; }

  1. top-section {

height: 25px; border-left: none; border-right: none; }

.left-menu { margin-top:-15px; }

.left-menu ul { border: none; }

  1. menubar li a {

}

  1. menubar.right-menu {

margin-top:-15px; }

.right-menu ul { border: none; }

  1. menubar{

top:15px; z-index:25; }

img[src*="WebIdea_files/wiki.png"]{ /*FIXME to /wiki/skins/common/images/wiki.png */

   width:0;
   height:40px;
   padding-right:975px;

}