Template:Team:Waterloo/CSS/baseWiki

From 2014.igem.org

(Difference between revisions)
(Blanked the page)
Line 1: Line 1:
 +
<style type="text/css">
 +
img.homepage{
 +
display: block;
 +
width: 40%;
 +
margin-left: auto;
 +
margin-right: auto;
 +
-ms-transform: translate(0,10%); /* IE 9 */
 +
  -webkit-transform: translate(0,10%); /* Chrome, Safari, Opera */
 +
  transform: translate(0,10%);
 +
z-index: 100;
 +
}
 +
img.homepageLogo{
 +
display: block;
 +
width: 25%;
 +
margin-left: auto;
 +
margin-right: auto;
 +
-ms-transform: translate(50%,-175%); /* IE 9 */
 +
  -webkit-transform: translate(50%,-175%); /* Chrome, Safari, Opera */
 +
  transform: translate(0,-175%);
 +
}
 +
/*Common tags*/
 +
a{
 +
  text-decoration: none;
 +
}
 +
li{
 +
  list-style: none;
 +
  line-height: 18px;
 +
}
 +
 +
/*Specific class or id elements*/
 +
.content {
 +
width:80%;
 +
background: #F0F0F0;
 +
margin: auto;
 +
margin-top: 30px;
 +
}
 +
ul#headings li {
 +
  float: left;
 +
  display: block;
 +
}
 +
ul#shortheadings li{
 +
  float: left;
 +
  display: none;
 +
}
 +
.icons{
 +
  height: 30px;
 +
}
 +
a.barheading{
 +
  color: #71CCE6;
 +
  font-size: 15px;
 +
  font-family: Georgia;
 +
  font-weight: bold;
 +
  cursor: pointer;
 +
}
 +
a.subheading{
 +
  color: #FFFFFF;
 +
  font-size: 14px;
 +
  font-family: Georgia;
 +
  cursor: pointer;
 +
}
 +
div.empty{
 +
  height: 60px;
 +
}
 +
div.heading{
 +
  font-family: Georgia;
 +
  font-size: 50px;
 +
  color: #000000;
 +
  text-align: center;
 +
  margin-top: 20px;
 +
}
 +
div.subheading{
 +
  font-family: Georgia;
 +
  font-size: 30px;
 +
  color: #000000;
 +
  text-align: center;
 +
}
 +
ul.projSubs li {
 +
  list-style: none;
 +
  line-height: 30px;
 +
}
 +
div#imgBox{
 +
  height: 500px;
 +
  width: 70%;
 +
  min-width: 700px;
 +
  margin: auto;
 +
  margin-top: 30px;
 +
  background: #FFFFFF;
 +
}
 +
img.toTop{
 +
  height: 30px;
 +
  position: fixed;
 +
  bottom: 5%;
 +
  float: right;
 +
  right: 2%;
 +
-webkit-transition: height 0.5s; /* For Safari 3.1 to 6.0 */
 +
  transition: height 0.5s;
 +
}
 +
img.toTop:hover{
 +
height: 150px;
 +
}
 +
div#topbar{
 +
width: 100%;
 +
min-width:200px;
 +
position:fixed;
 +
left:0;
 +
right:0;
 +
margin-right:0;
 +
margin-left:0;
 +
z-index:999;
 +
top:0px;
 +
  background: #333;
 +
  height:60px;
 +
}
 +
div#topbar > .sections_panel{
 +
  position:absolute;
 +
  height:0px;
 +
  background:#000;
 +
  top:60px;
 +
  left:10%;
 +
  border-radius:0px 0px 8px 8px;
 +
  overflow:hidden;
 +
  z-index:10000;
 +
  transition: height 0.3s linear 0s;
 +
}
 +
div#topbar > .sections_panel > div{
 +
  background:#333;
 +
  padding:20px;
 +
  height:258px;
 +
  margin:10px;
 +
  color:#71CCE6;
 +
}
 +
 +
table#navMenu{
 +
  margin-top: -15px;
 +
}
 +
 +
table#navMenu tr, table#navMenu td{
 +
  border: 1px solid #444;
 +
  padding: 8px;
 +
  width: 200px;
 +
}
 +
 +
div.navItems{
 +
cursor: pointer;
 +
}
 +
 +
/*Tabs*/
 +
ul.tabs
 +
{
 +
padding: 1px 0; /*background bar*/
 +
font-size: 0;
 +
height: 20px;
 +
margin:0;
 +
list-style-type: none;
 +
text-align: center; /*set to left, center, or right to align the tabs as desired*/
 +
/*border:1px solid #663300;*/
 +
border-bottom:none;
 +
background: #333;
 +
}
 +
 +
ul.tabs li
 +
{
 +
display: inline;
 +
margin: 0;
 +
margin-right:5px; /*distance between tabs*/
 +
}
 +
       
 +
ul.tabs li a
 +
{ /*each tab box*/
 +
font: normal 12px Verdana;
 +
text-decoration: none;
 +
position: relative;
 +
padding: 8px 10px;
 +
border: 1px solid #663300;
 +
/*border-right:none;*/
 +
color: #000;
 +
background: #FFF;
 +
outline:none;
 +
-webkit-border-radius:5px;
 +
-moz-border-radius:5px;
 +
border-radius:5px;
 +
}
 +
 +
ul.tabs li:last-child a
 +
{
 +
  border-right:1px solid #663300;
 +
}
 +
 +
ul.tabs li a:visited
 +
{
 +
  color: #000;
 +
}
 +
 +
ul.tabs li a:hover
 +
{
 +
text-decoration: none;
 +
font-weight: bold;
 +
background: #9EE0F3;
 +
}
 +
 
 +
ul.tabs li.selected a, ul.tabs li.selected a:hover
 +
{
 +
position: relative;
 +
top: 0px;
 +
font-weight:bold;
 +
background: #71CCE6;
 +
color: dimgrey;
 +
}
 +
 +
ul.tabs li.selected a:hover
 +
{
 +
  text-decoration: none;
 +
}
 +
 +
div.tabcontents
 +
{
 +
padding: 30px;
 +
background-color:#FFF;
 +
}
 +
 +
/*Footer*/
 +
div.footerBorder{
 +
  width: 100%;
 +
  min-width: 900px;
 +
  height: 210px;
 +
  position: absolute;
 +
  left: 0;
 +
  right: 0;
 +
  margin-left: 0;
 +
  margin-right: 0;
 +
  background: #71CCE6;
 +
}
 +
 +
div#footer{
 +
  width: 100%;
 +
  min-width: 900px;
 +
  height: 200px;
 +
  position: absolute;
 +
  left: 0;
 +
  right: 0;
 +
  bottom: 0;
 +
  margin-left: 0;
 +
  margin-right: 0;
 +
  background: #333;
 +
  color: #FFF;
 +
  font-size: 12px;
 +
}
 +
 +
img.logoFoot{
 +
  margin-left: 50px;
 +
  margin-top: 10px;
 +
  height: 130px;
 +
  position: relative;
 +
}
 +
 +
div#siteMap1{
 +
  position: absolute;
 +
  margin-left: 35%;
 +
  margin-top: -180px;
 +
}
 +
 +
div#siteMap2{
 +
  position: absolute;
 +
  margin-left: 55%;
 +
  margin-top: -180px;
 +
}
 +
 +
div#siteMap3{
 +
  position: absolute;
 +
  margin-left: 75%;
 +
  margin-top: -180px;
 +
}
 +
 +
li.footHeadings{
 +
color: #71CCE6;
 +
font-size: 18px;
 +
font-weight: bold;
 +
font-variant: small-caps;
 +
line-height: 33px;
 +
cursor: pointer;
 +
}
 +
</style>

Revision as of 14:20, 5 October 2014

<style type="text/css"> img.homepage{ display: block; width: 40%; margin-left: auto; margin-right: auto; -ms-transform: translate(0,10%); /* IE 9 */ 

 -webkit-transform: translate(0,10%); /* Chrome, Safari, Opera */
 transform: translate(0,10%);

z-index: 100; } img.homepageLogo{ display: block; width: 25%; margin-left: auto; margin-right: auto; -ms-transform: translate(50%,-175%); /* IE 9 */ 

 -webkit-transform: translate(50%,-175%); /* Chrome, Safari, Opera */
 transform: translate(0,-175%);

}

/*Common tags*/ a{ 

 text-decoration: none;

} li{ 

 list-style: none;
 line-height: 18px;

}

/*Specific class or id elements*/ .content { width:80%; background: #F0F0F0; margin: auto; margin-top: 30px; } ul#headings li { 

 float: left;
 display: block;

} ul#shortheadings li{ 

 float: left;
 display: none;

} .icons{ 

 height: 30px;

} a.barheading{ 

 color: #71CCE6;
 font-size: 15px;
 font-family: Georgia;
 font-weight: bold;
 cursor: pointer;

} a.subheading{ 

 color: #FFFFFF;
 font-size: 14px;
 font-family: Georgia;
 cursor: pointer;

} div.empty{ 

 height: 60px;

} div.heading{ 

 font-family: Georgia;
 font-size: 50px;
 color: #000000;
 text-align: center;
 margin-top: 20px;

} div.subheading{ 

 font-family: Georgia;
 font-size: 30px;
 color: #000000;
 text-align: center;

} ul.projSubs li { 

 list-style: none;
 line-height: 30px;

} div#imgBox{ 

 height: 500px;
 width: 70%;
 min-width: 700px;
 margin: auto;
 margin-top: 30px;
 background: #FFFFFF;

} img.toTop{ 

 height: 30px;
 position: fixed;
 bottom: 5%;
 float: right;
 right: 2%;

-webkit-transition: height 0.5s; /* For Safari 3.1 to 6.0 */ 

 transition: height 0.5s;

} img.toTop:hover{ height: 150px; } div#topbar{ width: 100%; min-width:200px; position:fixed; left:0; right:0; margin-right:0; margin-left:0; z-index:999; top:0px; 

 background: #333;
 height:60px;

} div#topbar > .sections_panel{ 

 position:absolute;
 height:0px;
 background:#000;
 top:60px;
 left:10%;
 border-radius:0px 0px 8px 8px;
 overflow:hidden;
 z-index:10000;
 transition: height 0.3s linear 0s;

} div#topbar > .sections_panel > div{ 

 background:#333;
 padding:20px;
 height:258px;
 margin:10px;
 color:#71CCE6;

}

table#navMenu{ 

 margin-top: -15px;

}

table#navMenu tr, table#navMenu td{ 

 border: 1px solid #444;
 padding: 8px;
 width: 200px;

}

div.navItems{ cursor: pointer; }

/*Tabs*/ ul.tabs { padding: 1px 0; /*background bar*/ font-size: 0; height: 20px; margin:0; list-style-type: none; text-align: center; /*set to left, center, or right to align the tabs as desired*/ /*border:1px solid #663300;*/ border-bottom:none; background: #333; }

ul.tabs li { display: inline; margin: 0; margin-right:5px; /*distance between tabs*/ }

ul.tabs li a { /*each tab box*/ font: normal 12px Verdana; text-decoration: none; position: relative; padding: 8px 10px; border: 1px solid #663300; /*border-right:none;*/ color: #000; background: #FFF; outline:none; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }

ul.tabs li:last-child a { 

 border-right:1px solid #663300;

}

ul.tabs li a:visited { 

 color: #000;

}

ul.tabs li a:hover { text-decoration: none; font-weight: bold; background: #9EE0F3; }

ul.tabs li.selected a, ul.tabs li.selected a:hover { position: relative; top: 0px; font-weight:bold; background: #71CCE6; color: dimgrey; }

ul.tabs li.selected a:hover { 

 text-decoration: none;

}

div.tabcontents { padding: 30px; background-color:#FFF; }

/*Footer*/ div.footerBorder{ 

 width: 100%;
 min-width: 900px;
 height: 210px;
 position: absolute;
 left: 0;
 right: 0;
 margin-left: 0;
 margin-right: 0;
 background: #71CCE6;

}

div#footer{ 

 width: 100%;
 min-width: 900px;
 height: 200px;
 position: absolute;
 left: 0;
 right: 0;
 bottom: 0;
 margin-left: 0;
 margin-right: 0;
 background: #333;
 color: #FFF;
 font-size: 12px;

}

img.logoFoot{ 

 margin-left: 50px;
 margin-top: 10px;
 height: 130px;
 position: relative;

}

div#siteMap1{ 

 position: absolute;
 margin-left: 35%;
 margin-top: -180px;

}

div#siteMap2{ 

 position: absolute;
 margin-left: 55%;
 margin-top: -180px;

}

div#siteMap3{ 

 position: absolute;
 margin-left: 75%;
 margin-top: -180px;

}

li.footHeadings{ color: #71CCE6; font-size: 18px; font-weight: bold; font-variant: small-caps; line-height: 33px; cursor: pointer; } </style>

Retrieved from "http://2014.igem.org/Template:Team:Waterloo/CSS/baseWiki"