Template:Team:Hong Kong HKUST/indexpage.css

From 2014.igem.org

(Difference between revisions)
Line 1: Line 1:
-
#contentSub, #footer-box, #catlinks, #search-controls, #p-
+
#bodyContent {
 +
  width: 961px;
 +
  background-color: #111111;
 +
}
-
logo, .printfooter, .firstHeading,.visualClear {display:  
+
#content{ padding: 0; }
-
none;} /*-- hides default wiki settings --*/
+
#wrap {
 +
  width: 935px;
 +
  //margin-left: -1em;
 +
  color: #666;
 +
  background-color: white;
 +
}
-
#top-section { /*-- styling for default menu bar (edit, page,
+
#wrap a {
 +
  //color:  #FF75a3;
 +
  text-decoration:none;
 +
}
-
history, etc.) --*/
+
#wrap a:hover {
-
+
  color: #FF6633;
-
border: 0 none;
+
}
-
height: 14px;
+
-
z-index: 100;
+
-
top: 0;
+
-
position: fixed;
+
-
width: 1000px;
+
-
left: 50%;
+
-
margin-left: -487px;
+
-
}
+
-
#globalWrapper, #content { /*-- changes default wiki settings
+
#wrap a img{
 +
  border:0;
 +
}
-
--*/
+
#wrap h2 {
-
width: 100%;  
+
  margin:0 0 10px 0;
-
height: 100%;
+
  font-family: "Lucida Grande", Verdana, Arial, sans-serif;
-
border: 0px;
+
  //font-size: 1.25em;
-
background-color:#FCEBE6;
+
  font-style: bold;
-
margin: 0px;
+
  border-bottom: none;
-
padding: 0px;
+
}
-
}
+
-
html, body, .wrapper { /*-- changes default wiki settings --
+
#wrap p { margin: 0;}
-
*/
+
#maincontent {
-
+
  clear: none;
-
background-color: #FCEBE6;
+
  position: absolute;
-
}
+
  top: 0px;
-
+
  left: 0px;
-
/*Changing default wiki setting. By Guillaume*/
+
  width: 655px;     // 655px (team image width) + 17px (maincontent left-paddding to reveal background) = 672px
-
.left-menu li a{
+
  min-height: 1030px;
-
color:#5E412F;
+
  padding-left: 17px;
-
}
+
  border-width: 0px;
-
.right-menu li a{
+
  border-style: none;
-
color:#5E412F;
+
  background-position: left top;
-
background-color:none;
+
  background-repeat: repeat-y;
-
}
+
  background-image: url(https://static.igem.org/mediawiki/2007/f/fb/Mainpage-left-bg.jpg);
-
#top-section{
+
  background-color: white;
-
left:0;
+
  color: #666;
-
margin-left:0;
+
  font-size: 11pt;
-
width:100%;
+
}
-
}
+
-
/*End of changing default wiki setting.*/
+
-
+
-
body {
+
-
width: 100%;
+
-
  padding:0;
+
-
  margin:0;
+
-
  font: 14px Helvetica;
+
-
}
+
-
#content_container {
+
-
  width:950px;
+
-
  margin: 0 auto;
+
-
-webkit-box-shadow: 0px 6px 6px 0px rgba(50, 50, 50, 0.64);
+
-
-moz-box-shadow:    0px 6px 6px 0px rgba(50, 50, 50, 0.64);
+
-
box-shadow:        0px 6px 6px 0px rgba(50, 50, 50, 0.64);
+
-
}
+
-
a {
+
-
  color: #c0392b;
+
-
  text-decoration: none;
+
-
}
+
-
a:hover {
+
-
  color: #e74c3c;
+
-
}
+
-
#menu {
+
-
  padding: 0;
+
-
  text-align: center;
+
-
  text-transform:uppercase;
+
-
}
+
-
h1 {
+
#maincontent h2 {
-
  font-family: HelveticaNeue-UltraLight;
+
  margin: 0;
-
  font-size: 100px;
+
}
-
  text-align: center;
+
-
  margin: 0 0 0 0;
+
-
  padding: 50px 0 0 0 ;
+
-
  background: #5E412F;
+
-
  color: #fff;
+
-
  font-weight:100;
+
-
  letter-spacing: 0.0625em;
+
-
}
+
-
/*----------------------------------drop down ---------------------------------*/
+
#maincontent a {
-
h1 {
+
  text-decoration: none;
-
font-size:60px;
+
  color: #FF75a3;
-
}
+
  font-family: "Lucida Grande", Verdana, arial, sans-serif;
 +
}
-
p {
+
#maincontent a:hover {
-
  font-size:20px;
+
  color: #FF6633;
-
}
+
}
-
nav {
+
-
margin:0 auto;
+
-
padding: 0 auto;
+
-
background-color: orange;
+
-
width:990px;
+
-
display:block;
+
-
}
+
-
nav ul {
+
#image-rotator {
-
padding:0;
+
  position: relative;
-
margin:0 auto;
+
}
-
list-style: none;
+
-
position: relative;
+
-
display:block;
+
-
text-align: center;
+
-
}
+
-
+
-
nav ul li {
+
-
display: inline-block;
+
-
float: left;
+
-
display:list-item;
+
-
list-style: none;
+
-
background-color:#5E412F;
+
-
+
-
}
+
-
nav ul li a {
+
.metainfo {
-
display:block;
+
  //font-size: .8em;
-
padding:15px 10px;
+
  width: 100%;
-
+
  position: relative;
-
color:#FFF;
+
  top: -1em;
-
font-size:16px;
+
  margin: 0 0 -1em 0;
-
text-decoration:none;
+
}
-
font-family: 'Bree Serif', 'serif';
+
-
}
+
-
li a:hover { background-color: #000000; }
+
.metainfo h2 {
 +
  display: inline;
 +
  font-size: 14pt;
 +
}
-
+
.metainfo span {
-
+
  position: absolute;
-
+
  right: 0px;
-
/* The Dropdown Styles */
+
  bottom: 0px;
-
/* =================== */
+
  color: #454545;
 +
}
-
/* Hide Dropdowns by Default */
+
#JamboreeBox {
-
nav ul ul {
+
  background-position: right bottom;
-
display: none;
+
  background-repeat: no-repeat;
-
position: absolute;
+
  background-image: url(https://static.igem.org/mediawiki/2007/3/32/IGEM07-mainpage_Brick.jpg);
-
top: 48px;
+
  margin: 2em 16px 8px 16px;
-
}
+
  background-color: #f5facf;
-
+
  border-right: 4px solid #eaf7a6;
-
/* Display Dropdowns on Hover */
+
  border-bottom: 4px solid #eaf7a6;
-
nav ul li:hover > ul {
+
  font-size: 1em;
-
display:list-item;
+
  min-height: 220px;
-
}
+
  width: 620px;
-
+
  float: left;
-
/* Fisrt Tier Dropdown */
+
}
-
nav ul ul li {
+
-
width:180px;
+
-
position: relative;
+
-
border-bottom:none;
+
-
list-style-type: none;
+
-
}
+
-
/* Second, Third and more Tiers */
+
#JamboreeBox img {
-
nav ul ul ul li {
+
  //position: absolute;
-
position: absolute relative;
+
  float: left;
-
top:-5px;  
+
  //padding: -8px 24px 16px 16px;
-
}
+
  padding: 0 30px 0 8px;
-
.fixed {
+
  border: solid 1px #f7fbd7;
-
  position: fixed;
+
}
-
  z-index: 10;
+
-
  top: 0;
+
-
  width: 100%;
+
-
}
+
-
.fixed ul ul ul li a {
+
-
  color: #fff;
+
-
  text-decoration: none;
+
-
}
+
-
+
-
div#nav_container{
+
-
  text-align: center;
+
-
      width:1000px;
+
-
  padding:0 auto;
+
-
  margin:0 auto;
+
-
  max-width:700px;
+
-
  z-index:100000;
+
-
}
+
-
#slide{
+
#JamboreeBox ul {  
-
  width: 100%;
+
  line-height: 1.2em;
-
  height: 600px;
+
  margin: 0 0 0 2em;
-
  overflow:hidden;
+
}
-
  margin: 30px auto;
+
-
  box-shadow: 0 8px 6px -6px rgba(0,0,0,1);
+
-
}
+
-
#slide div{
+
-
  display:block;
+
-
  width:0;
+
-
  float: left;
+
-
  -webkit-transition: all 0.75s;
+
-
  -moz-transition: all 0.75s;
+
-
  -o-transition:all 0.75s;
+
-
  transition: all 0.75s;
+
-
}
+
-
img.picture {
+
-
  width:960px;
+
-
}
+
-
button.prev, button.next {
+
-
  position: absolute;
+
-
  z-index: 999;
+
-
  display: block;
+
-
  padding:0 10px;
+
-
  width: auto;
+
-
  height:350px;
+
-
  background: rgba(0,0,0,0);
+
-
  color: #ffffff;
+
-
  font-size:26px;
+
-
  cursor: pointer;
+
-
  border:none;
+
-
  outline:none;
+
-
}
+
-
button.prev:hover, button.next:hover {
+
-
  background: rgba(0,0,0,0.8);
+
-
}
+
-
button.next {
+
-
  margin-left:926px;
+
-
}
+
-
+
-
+
-
div.project_area{
+
-
  margin:0 auto;
+
-
  border: 1px solid black;
+
-
  background-color:#5E412F;
+
-
  padding:15px;
+
-
  }
+
-
.project_area h4, .project_area p{
+
-
color:white;
+
-
}
+
-
div.project_box{
+
-
border: 1px solid gray;
+
-
width: 450px;
+
-
height: 150px;
+
-
text-align: center;
+
-
background-color:#5E412F;
+
-
}
+
-
div.quick_link_container{
+
.contentbox {
-
padding:50px;
+
  float:right;
-
height:300px;
+
  max-width: 300px;
-
-webkit-box-shadow: 0px 5px 2px 0px rgba(50, 50, 50, 0.69);
+
  //margin:1em;
-
-moz-box-shadow:   0px 5px 2px 0px rgba(50, 50, 50, 0.69);
+
  padding: 0 12px 0 0;
-
box-shadow:         0px 5px 2px 0px rgba(50, 50, 50, 0.69);
+
}
-
width:200px;
+
 
-
background-color:#F0A830;
+
#newscol {
-
}
+
  position: relative;
-
+
  float: left;
-
+
  width: 240px;
-
.quick_link_row:nth-child(odd) .quick_link_button:nth-child(odd) div.quick_link_container {
+
  margin-left: 16px;
-
background-color:#78C0A8;
+
  //clear:left;
-
}
+
}
-
.quick_link_row:nth-child(even) .quick_link_button:nth-child(even) div.quick_link_container{
+
 
-
background-color:#78C0A8;
+
.newsmeta {
-
}
+
  border-bottom-color: #d2eef3;
-
+
  border-bottom-width: 1px;
-
table.site_map_table{
+
  border-bottom-style: solid;
-
background-color: #5E412F;
+
  width: 100%;
-
width: 100%;
+
  //margin: 0 0 20px 0;
-
}
+
  clear:both;
-
.site_map_table h4{
+
}
-
color:#F07818;
+
 
-
}
+
.newsmeta h2 {
-
.site_map_table p, .site_map_table ul, .site_map_table a{
+
  padding-bottom: 0px;
-
color: #F0A830;
+
  font-size: 1em;
-
}
+
  margin:0 0;
-
div.banner_area{
+
}
-
width:100%;
+
 
-
margin:0 auto;
+
#newscol .newsmeta h2 a {
-
padding:0 auto;
+
  color: #3d8ada;
-
}
+
}
-
div.banner_area img{
+
 
-
width:100%;
+
#newscol .newsmeta a:hover {
-
height: 550px;
+
  color: #FF6633;
-
}
+
}
-
div.content_1{
+
 
-
width:100%;
+
.newsmeta-date {
-
margin-top:80px;
+
  position: relative;
-
}
+
  float: right;
-
div.content_1 h3{
+
  right: -10px;
-
font-size:30px;
+
  //display: block;
-
color:#5E412F;
+
  font-size: .8em;
-
border-bottom: 2px solid black;
+
  color: #454545;
-
+
  margin:0 0 0 0em;
-
}
+
}
-
table.content_table td{
+
 
-
width:50%;
+
.newsmeta-more {
-
}
+
  margin:0 0 0 1.5em;
-
table.content_table p {
+
  //font-size: .8em;
-
font-size: 18px;
+
}
-
font-family: "helvetica" ,"Open Sans", "Vollkorn", "Fedra Sans";
+
 
-
line-height: 2em;
+
.newsentry {
-
}
+
  margin: 0 0 20px 0;
-
div.content_area{
+
  position: relative;
-
padding:0 20px 0 20px;
+
  clear:both;
-
background-color:#FCEBB6;
+
}
-
border-radius: 2px;
+
 
-
height:600px;
+
.newsentry p {
-
}
+
  line-height: 1.4em;
-
td.content_cell img{
+
  font-size: .9em;
-
width:100%;
+
  color: 666666;
-
display:inline;
+
  margin: 6px 8px 0 8px;
-
}
+
  position: relative;
-
td.content_cell h5{
+
  font-family: Georgia, "Times New Roman", Times, serif;
-
font-size: 19px;
+
  text-align: justify;
-
font-family:"helvetica" ,"Open Sans", "Vollkorn", "Fedra Sans";
+
}
-
font-weight:bold;
+
 
-
display:inline;
+
.blurb {
-
}
+
  text-align: justify;
-
td.content_cell h6{
+
  font: normal 1.2em georgia, serif;
-
font-size: 15px;
+
  color: #555555;
-
font-family:"helvetica" ,"Open Sans", "Vollkorn", "Fedra Sans";
+
  line-height: 1.4em;
-
font-weight:normal;
+
}
-
display:inline;
+
 
-
}
+
#maincol {
-
div#description_area{
+
  position: relative;
-
padding: 20px;
+
  float: right;
-
border-bottom: 2px dotted black;
+
  width: 340px;
-
background-color:#5E412F;
+
  margin: 0 12px 16px 0px;
-
padding:10px 90px;
+
  padding: 0px 0 8px 0px;
-
}
+
}
-
div#description_area h2 {
+
 
-
text-align:center;
+
#maincol p {
-
font-size: 30px;
+
  line-height: 1.4em;
-
font-family:"helvetica" ,"Open Sans", "Vollkorn", "Fedra Sans";
+
  font-size: .9em;
-
font-weight:900;
+
  color: #666666;
-
display:block;
+
  //margin: 1px;
-
text-decoration:underline;
+
  //position: relative;
-
color:#78C0A8;
+
  font-family: Georgia, "Times New Roman", Times, serif;
-
text-transform:uppercase;
+
  text-align: justify;
-
}
+
}
-
div#description_area p{
+
 
-
text-indent:20px;
+
#maincol h2 {
-
color:white;
+
  margin: 20px 0 4px 0;
-
}
+
  font-size: 1em;
-
table.start_up_link_area{
+
}
-
width:100%;
+
 
-
}
+
#sidebar {
-
td.start_up_link_button{
+
  left: 672px;
-
width:25%;
+
  top: 0px;
-
height:300px;
+
  position: absolute;
-
}
+
  padding-top: 40px;
-
div.start_up_link_container{
+
  padding-bottom: 11em;
-
width:90%;
+
  min-height: 1030px;
-
height:300px;
+
  width: 288px;
-
padding:5px 10px 5px 10px;
+
  background-position: left top;
-
-webkit-box-shadow: 0px 5px 2px 0px rgba(50, 50, 50, 0.69);
+
  background-repeat: no-repeat;
-
-moz-box-shadow:   0px 5px 2px 0px rgba(50, 50, 50, 0.69);
+
  background-color: #111111;
-
box-shadow:         0px 5px 2px 0px rgba(50, 50, 50, 0.69);
+
  background-image: url(https://static.igem.org/mediawiki/2007/0/04/Mainpage-right-bg.jpg);
-
}
+
  font-family: Georgia, "Times New Roman", Times, serif;
-
.start_up_link_button div.start_up_link_container{
+
  color: #666666;
-
background-color:#78C0A8;
+
  font-size: 0.9em;
-
}
+
}
-
.start_up_link_button:nth-child(even) div.start_up_link_container{
+
 
-
background-color:#F0A830;
+
a {
-
}
+
  color: #FF75a3;
 +
  text-decoration:none;
 +
}
 +
 
 +
a:hover {
 +
  color: #FF6633;
 +
}
 +
 
 +
#sidebar h2 {
 +
  border-bottom: 1px solid;
 +
  border-bottom-color: #b7b7b7;
 +
}
 +
 
 +
#sidebar li a { color: #3d8ada;}
 +
 
 +
.post-it {
 +
  position: relative;
 +
  float: left;
 +
  margin-right: 16px;
 +
  margin-bottom: 10px;
 +
  padding: 12px 8px 8px 8px;
 +
  width: 236px;
 +
  //font-size: .9em;
 +
  line-height: 1.3em;
 +
  text-align: justify;
 +
  clear:both;
 +
}
 +
 
 +
.bluebox {
 +
  background-color: #d9f0f8;
 +
  border-left: 12px solid #ade2f2;
 +
}
 +
 
 +
.yellowbox {
 +
  background-color: #f7fbd7;
 +
  border-left: 12px solid #eef8b3;
 +
}
 +
 
 +
.pinkbox {
 +
  background-color: #f0dbcc;
 +
  border-left: 12px solid #ddb99e;
 +
}
 +
 
 +
.greenbox {
 +
  background-color: #dff7d6;
 +
  border-left: 12px solid #b8efb0;
 +
}
 +
 
 +
.whitebox {
 +
  background-color: #eeeeee;
 +
  border-left: 12px solid #d9dddd;
 +
}
 +
 
 +
table.minical {
 +
  font: 1em georgia, serif;
 +
  line-height: 1.2em;
 +
  background: none;
 +
}
 +
 
 +
table.minical td {
 +
  padding: 4px 0px;
 +
  border-top: 1px solid #dbe6a8;
 +
}
 +
 
 +
table.minical td.event {
 +
  width: 160px;
 +
  text-align: right;
 +
  padding-right: 1em;
 +
  color: #333333;
 +
}
 +
 
 +
table.minical td.date {
 +
  //width: 6em;
 +
  text-align: left;
 +
  line-height: 0.8em;
 +
  font-style: italic;
 +
  color: #666666;
 +
}

Revision as of 05:13, 31 August 2014

  1. bodyContent { 
 width: 961px;
 background-color: #111111;

}

  1. content{ padding: 0; }
  1. wrap { 
 width: 935px;
 //margin-left: -1em;
 color: #666;
 background-color: white;

}

  1. wrap a { 
 //color:  #FF75a3;
 text-decoration:none;

}

  1. wrap a:hover { 
 color: #FF6633;

}

  1. wrap a img{ 
 border:0;

}

  1. wrap h2 { 
 margin:0 0 10px 0;
 font-family: "Lucida Grande", Verdana, Arial, sans-serif;
 //font-size: 1.25em;
 font-style: bold;
 border-bottom: none;

}

  1. wrap p { margin: 0;}
  1. maincontent { 
 clear: none;
 position: absolute;
 top: 0px;
 left: 0px;
 width: 655px;     // 655px (team image width) + 17px (maincontent left-paddding to reveal background) = 672px
 min-height: 1030px;
 padding-left: 17px;
 border-width: 0px;
 border-style: none;
 background-position: left top;
 background-repeat: repeat-y;
 background-image: url(Mainpage-left-bg.jpg);
 background-color: white;
 color: #666;
 font-size: 11pt;

}

  1. maincontent h2 { 
 margin: 0;

}

  1. maincontent a { 
 text-decoration: none;
 color: #FF75a3;
 font-family: "Lucida Grande", Verdana, arial, sans-serif;

}

  1. maincontent a:hover { 
 color: #FF6633;

}

  1. image-rotator { 
 position: relative;

}

.metainfo { 

 //font-size: .8em;
 width: 100%;
 position: relative;
 top: -1em;
 margin: 0 0 -1em 0;

}

.metainfo h2 { 

 display: inline;
 font-size: 14pt;

}

.metainfo span { 

 position: absolute;
 right: 0px;
 bottom: 0px;
 color: #454545;

}

  1. JamboreeBox { 
 background-position: right bottom;
 background-repeat: no-repeat;
 background-image: url(IGEM07-mainpage_Brick.jpg);
 margin: 2em 16px 8px 16px;
 background-color: #f5facf;
 border-right: 4px solid #eaf7a6;
 border-bottom: 4px solid #eaf7a6;
 font-size: 1em;
 min-height: 220px;
 width: 620px;
 float: left;

}

  1. JamboreeBox img { 
 //position: absolute;
 float: left;
 //padding: -8px 24px 16px 16px;
 padding: 0 30px 0 8px;
 border: solid 1px #f7fbd7;

}

  1. JamboreeBox ul { 
 line-height: 1.2em;
 margin: 0 0 0 2em;

}

.contentbox { 

 float:right;
 max-width: 300px;
 //margin:1em;
 padding: 0 12px 0 0;

}

  1. newscol { 
 position: relative;
 float: left;
 width: 240px;
 margin-left: 16px;
 //clear:left;

}

.newsmeta { 

 border-bottom-color: #d2eef3;
 border-bottom-width: 1px;
 border-bottom-style: solid;
 width: 100%;
 //margin: 0 0 20px 0;
 clear:both;

}

.newsmeta h2 { 

 padding-bottom: 0px;
 font-size: 1em;
 margin:0 0;

}

  1. newscol .newsmeta h2 a { 
 color: #3d8ada;

}

  1. newscol .newsmeta a:hover { 
 color: #FF6633;

}

.newsmeta-date { 

 position: relative;
 float: right;
 right: -10px;
 //display: block;
 font-size: .8em;
 color: #454545;
 margin:0 0 0 0em;

}

.newsmeta-more { 

 margin:0 0 0 1.5em;
 //font-size: .8em;

}

.newsentry { 

 margin: 0 0 20px 0;
 position: relative;
 clear:both;

}

.newsentry p { 

 line-height: 1.4em;
 font-size: .9em;
 color: 666666;
 margin: 6px 8px 0 8px;
 position: relative;
 font-family: Georgia, "Times New Roman", Times, serif;
 text-align: justify;

}

.blurb { 

 text-align: justify;
 font: normal 1.2em georgia, serif;
 color: #555555;
 line-height: 1.4em;

}

  1. maincol { 
 position: relative;
 float: right;
 width: 340px;
 margin: 0 12px 16px 0px;
 padding: 0px 0 8px 0px;

}

  1. maincol p { 
 line-height: 1.4em;
 font-size: .9em;
 color: #666666;
 //margin: 1px;
 //position: relative;
 font-family: Georgia, "Times New Roman", Times, serif;
 text-align: justify;

}

  1. maincol h2 { 
 margin: 20px 0 4px 0;
 font-size: 1em;

}

  1. sidebar { 
 left: 672px;
 top: 0px;
 position: absolute;
 padding-top: 40px;
 padding-bottom: 11em;
 min-height: 1030px;
 width: 288px;
 background-position: left top;
 background-repeat: no-repeat;
 background-color: #111111;
 background-image: url(Mainpage-right-bg.jpg);
 font-family: Georgia, "Times New Roman", Times, serif;
 color: #666666;
 font-size: 0.9em;

}

a { 

 color:  #FF75a3;
 text-decoration:none;

}

a:hover { 

 color: #FF6633;

}

  1. sidebar h2 { 
 border-bottom: 1px solid;
 border-bottom-color: #b7b7b7;

}

  1. sidebar li a { color: #3d8ada;}

.post-it { 

 position: relative;
 float: left;
 margin-right: 16px;
 margin-bottom: 10px;
 padding: 12px 8px 8px 8px;
 width: 236px;
 //font-size: .9em;
 line-height: 1.3em;
 text-align: justify;
 clear:both;

}

.bluebox { 

 background-color: #d9f0f8;
 border-left: 12px solid #ade2f2;

}

.yellowbox { 

 background-color: #f7fbd7;
 border-left: 12px solid #eef8b3;

}

.pinkbox { 

 background-color: #f0dbcc;
 border-left: 12px solid #ddb99e;

}

.greenbox { 

 background-color: #dff7d6;
 border-left: 12px solid #b8efb0;

}

.whitebox { 

 background-color: #eeeeee;
 border-left: 12px solid #d9dddd;

}

table.minical { 

 font: 1em georgia, serif;
 line-height: 1.2em;
 background: none;

}

table.minical td { 

 padding: 4px 0px;
 border-top: 1px solid #dbe6a8;

}

table.minical td.event { 

 width: 160px;
 text-align: right;
 padding-right: 1em;
 color: #333333;

}

table.minical td.date { 

 //width: 6em;
 text-align: left;
 line-height: 0.8em;
 font-style: italic;
 color: #666666;

}

Retrieved from "http://2014.igem.org/Template:Team:Hong_Kong_HKUST/indexpage.css"