Difference between revisions of "Template:CSS/Main"

m (Protected "Template:CSS/Main": Multiple teams were using this page, with its very generic name ([Edit=Allow only administrators] (indefinite) [Move=Allow only administrators] (indefinite)) [cascading])
 
(25 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
<style>
+
<head>
h1,h2{border:none;}h1{padding:0;font-size:0;margin:0;}
+
<style type="text/css">
html {  
+
 
  background: url(https://static.igem.org/mediawiki/2015/b/b2/TeamWestminsterBackground.jpg) no-repeat center center fixed;  
+
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .visualClear {display: none;} /*-- hides default wiki settings --*/
  -webkit-background-size: cover;
+
 
  -moz-background-size: cover;
+
.firstHeading {
  -o-background-size: cover;
+
width: 975px;  
  background-size: cover;
+
margin: 0px auto;
 +
padding-top: 100px;
 +
margin-bottom: 20px;
 +
font-family: Georgia, Times, "Times New Roman", serif;  
 
}
 
}
body{
+
 
  width:100%;
+
h1, h2, h3, h4, h5 { font-family: Georgia, Times, "Times New Roman", serif;}
  margin: auto;
+
 
  margin-top:-45px;
+
#top-section { /*-- styling for default menu bar (edit, page, history, etc.) --*/
  font-family:  "Helvetica Neue", Helvetica, Arial, Sans-Serif;
+
background-color: #383838;
  font-weight: 300;
+
border: 0 none;
  font-size:1.125em ;
+
height: 14px;
  color:#fff;
+
z-index: 100;
  }
+
top: 0;
#maincontainer{
+
position: fixed;
  width: 900px;
+
width: 975px;  
  min-height: 300px;
+
left: 50%;  
  margin: auto;
+
margin-left: -487px;
  margin-top:120px;
+
  padding:20px;
+
  background: #fff;
+
  opacity: 0.9;
+
  filter: alpha(opacity=90);
+
  color: #000;
+
  z-index:1;
+
 
}
 
}
#maincontainer p{
+
 
  font-size:0.875em;
+
#top-section-bar { /*-- styling full width bar which hides behind default menu bar (edit, page, history, etc.) --*/
  text-align:justify;
+
background-color: #383838;
 +
height: 14px;
 +
display: block;
 +
z-index: 10;
 +
position: fixed;
 +
width: 100%;
 +
top: 0;
 
}
 
}
h2{
+
 
  margin-top:120px;
+
#menubar a:link, #menubar a:active, #menubar a:visited, #menubar a:hover, #menubar:hover { /*-- styling for default menu bar links (edit, page, history, etc.) --*/
  padding-bottom:0;
+
color: #727272;  
  margin-bottom:30px;
+
text-decoration: none;  
  text-align:center;
+
background-color: transparent;
 
}
 
}
h3{
+
 
  font-weight: 400;
+
body {  
  color:#000;
+
background-color: #fff;
 
}
 
}
h4{ font-family: 'Open Sans Condensed', sans-serif; color: #333;}
 
h4:before{content:url(https://static.igem.org/mediawiki/2015/d/d7/Team_Westmister_Calendar_Icon.jpg);}
 
  
#sponsors{
+
#globalWrapper, #content { /*-- changes default wiki settings --*/
  width: 900px;
+
width: 100%;  
  margin: auto;
+
height: 100%;
  margin-top:30px;
+
border: 0px;
  padding:20px;
+
background-color: transparent;
  background: #fff;
+
margin: 0px;
  opacity: 0.9;
+
padding: 0px;
  filter: alpha(opacity=90);
+
  color: #000;
+
  z-index:2;
+
 
}
 
}
#sponsors img{
 
  padding:15px;
 
  
 +
html, body, .wrapper { /*-- changes default wiki settings --*/
 +
width: 100%;
 +
height: 100%;
 +
background-color: transparent;
 
}
 
}
.teamleft, .teamright{
+
 
  border:1px solid #bbb;
+
#contentcontainer { /*-- creates container for all content on page --*/
  padding:10px;
+
font-family: Arial, Helvetica, sans-serif;
  min-height:220px;  
+
font-weight: normal;
 +
font-size: 14px;
 +
color: #414141;
 +
width: 960px;
 +
margin-left: auto;
 +
margin-right: auto;
 +
background-color: #transparent;  
 +
margin-top: 0px;  
 
}
 
}
.teamright img{
+
 
  margin: 0 10px;
+
.sidemenu, .sidemenu li {  
  float:right;
+
list-style-type: none;
 +
list-style-image: none;
 +
font-family: verdana;
 +
text-decoration: none;
 +
color:#000;  
 +
font-size: 14px;
 
}
 
}
.teamleft img{
+
 
  margin: 0 10px;
+
.sidemenu li {display: block;}
  float:left;
+
 
 +
.sidemenu a {
 +
text-decoration:none;
 +
color: #000;
 +
display: block;
 +
width: 180px;
 +
height: 100%;
 +
padding: 3px 5px;
 +
transition: .25s ease-in-out;
 +
-moz-transition: .25s ease-in-out;
 +
-webkit-transition: .25s ease-in-out;
 +
}
 +
 
 +
.sidemenu a.greyout { color: #909090; }
 +
 
 +
.sidemenu a:hover {
 +
color:#666;  
 +
background-color: #d9f5aa;
 
}
 
}
  
#spacer{
+
.sub-sidemenu {font-size: 10px; margin-bottom: 20px; color: #666; display: none;}
  margin:auto;
+
.sub-sidemenu a {color: #666;}
  height:20px;
+
 
  width:auto:
+
div.underconst
 +
{
 +
padding:10px;
 +
border-radius:5px;
 +
background-color:pink;
 +
text-align:center;
 
}
 
}
#footer{
+
 
  z-index: 800;
+
a.anchor{display: block; position: relative; top: -80px; visibility: hidden;}
  margin-top: 100px;
+
 
  background: #000;
+
.contentpara {margin-bottom: 30px;}
  opacity: 0.9;
+
 
  filter: alpha(opacity=90);
+
span.email{font-family: monospace; font-weight: normal;}
  width: 100%;
+
 
  min-height: 290px;
+
fieldset {border: 1px solid #337f53;}
 +
 
 +
.greyout {color: #A0A0A0;}
 +
.highlightme {background-color: #FFFF00;}
 +
 
 +
#alertContainer { margin-bottom: 10px; width: 936px;}
 +
#annContainer {margin-left: 8px;}
 +
#newsContainer {border: 1px solid #ccc;}
 +
 
 +
.newsTitle {
 +
display: block;  
 +
color: #414141;
 +
font-size: 25px;
 +
        font-family: Georgia, Times, "Times New Roman", serif;
 +
padding: 10px 15px 5px 10px;
 +
border-bottom: 1px solid #ccc;
 +
margin-bottom: 0px;  
 
}
 
}
#footer table{
+
 
  margin:auto;
+
.newsItem {
  padding: 30px 0 20px 0;
+
border-bottom: 1px solid #ccc;  
  width: 900px;
+
display: block;  
  text-align:left;
+
padding: 5px 15px 0px 10px;  
  line-height:1em;
+
margin-bottom: 0px;  
  color:#fff;
+
  background:#000;
+
  opacity: 0.8;
+
  filter: alpha(opacity=80);
+
 
}
 
}
#footer table a{
+
 
  text-decoration: none;
+
.newsItem h3 {
  color: inherit;
+
width: auto;
 +
display: inline;
 +
font-size: 14px;
 +
font-family: Arial, Helvetica, sans-serif;
 +
padding: 0px;  
 +
margin: 0px;
 
}
 
}
#footer table img:hover{
+
 
opacity: 0.5;
+
.newsItem img {
filter: alpha(opacity=50);
+
float: right;
 +
clear: right;
 +
width: 80px;
 +
padding-left: 15px;
 +
display: inline-block;  
 
}
 
}
.twitter{
+
 
  height:300px;
+
.newsItem .newsDate {
  width:440px;
+
font-style: italic;  
  text-align:right;
+
font-size: 14px;  
  border-left: 1px solid #fff;
+
display: inline-block;  
  padding-left:30px;
+
color: #999;  
}/*#####################################################################################                      MENU                          */
+
float: right;  
#cssmenu {
+
padding: 0px 0px 10px 15px;
  font-size: 1em;
+
  line-height: 19px;
+
  text-align: center;
+
  z-index:850;
+
  position:absolute;
+
  left:0;
+
  top:45px;
+
  margin:auto;
+
  min-width:1024px;
+
  width:100%;
+
}
+
#cssmenu > ul {
+
  width: auto;
+
  list-style-type: none;
+
  padding:0;
+
  margin: 0;
+
  background: #000;
+
  opacity: 0.8;
+
  filter: alpha(opacity=80);
+
 
}
 
}
#cssmenu > ul li#responsive-tab {
 
  display: none;
 
  /* Hide for large screens */
 
  
}
+
.newsItem p, .newsItem ul, .newsItem li {
#cssmenu > ul li {
+
padding: 0px;  
  display: inline-block;
+
margin-left: 20px;  
  *display: inline;
+
font-size: 12px;  
  zoom: 1;
+
line-height: 1.2;
}
+
#cssmenu > ul li.right {
+
  float: right;
+
}
+
#cssmenu > ul li.has-sub {
+
  position: relative;
+
}
+
#cssmenu > ul li.has-sub:hover ul {
+
  display: block;
+
}
+
#cssmenu > ul li.has-sub ul {
+
  display: none;
+
  width: 230px; /*@@@@@@@@@@@@@@@@@@@@@@@@@@ width of sub menu */
+
  position: absolute;
+
  margin:0 0 0 -70px;
+
  padding: 0;
+
  list-style-type: none;
+
  background: #000;
+
  border: 1px solid #ece6e8;
+
  border-bottom: 2px solid #d9ced2;
+
  border-top: 0 none;
+
}
+
#cssmenu > ul li.has-sub ul li {
+
  display: block;
+
}
+
#cssmenu > ul li a {
+
  display: block;
+
  padding: 10px ;
+
  text-decoration: none;
+
  color: #fff;
+
}
+
#cssmenu > ul a img{
+
  padding:0;
+
  margin:0 -10px;
+
}
+
#cssmenu > ul li a.active,
+
#cssmenu > ul li a:hover {
+
  background: ; /*@@@@@@@@@@@@@@@@@@@@@@@ menu tab bg color*/
+
  color: #999;
+
  text-shadow: 0px 1px 0px #000;
+
 
}
 
}
  
 +
.newsItem p {margin-top: 10px;}
  
@media (max-width: 600px) {
+
.annItem {
  #cssmenu > ul {
+
border: 2px solid #414141;  
    width: 100%;
+
display: block;  
  }
+
padding: 0px 15px 10px 10px;  
  #cssmenu > ul li#responsive-tab {
+
margin-bottom: 18px;  
    display: block;
+
position: relative;  
  }
+
height: 160px;  
  #cssmenu > ul li#responsive-tab a {
+
vertical-align: middle;
    background: url('images/menu.png') no-repeat;
+
    background-position: 95% -35%;
+
  }
+
  #cssmenu > ul li#responsive-tab a:hover {
+
    background-color: ;
+
    background-position: 95% 135%;
+
  }
+
  #cssmenu > ul li {
+
    display: none;
+
  }
+
  #cssmenu > ul li.right {
+
    float: none;
+
  }
+
  #cssmenu > ul li.has-sub {
+
    position: relative;
+
  }
+
  #cssmenu > ul li.has-sub ul {
+
    display: block;
+
    position: static;
+
    width: 100%;
+
    background: #ffffff;
+
    border: 0 none;
+
  }
+
  #cssmenu > ul li.has-sub ul li {
+
    display: block !important;
+
  }
+
  #cssmenu > ul li.has-sub ul li a span {
+
    display: block;
+
    padding-left: 24px;
+
  }
+
  #cssmenu > ul li.has-sub > a {
+
    background-image: none;
+
  }
+
 
}
 
}
/* Make sure they show even if hidden in mobile view by JS */
+
 
@media (min-width: 600px) {
+
.annItem .annCentered {
  #cssmenu > ul > li.collapsed {
+
display: table-cell;  
    display: inline-block !important;
+
vertical-align: middle;  
    *display: inline;
+
height: 160px;
    zoom: 1;
+
  }
+
  #cssmenu > ul ul li.collapsed {
+
    display: block !important;
+
  }
+
 
}
 
}
  
 +
.annCentered h3 {
 +
padding: 0px;
 +
display: block;
 +
margin-left: auto;
 +
margin-right: auto;
 +
text-align: center;
 +
}
  
 +
.annItem ul, .annItem li {padding: 0px; margin: 0px;}
 +
.annItem li {list-style: none; margin: 5px}
  
  
  
#contentSub, #footer-box, #catlinks, #search-controls, #p-logo, .printfooter, .visualClear {display: none;} /*-- hides default wiki settings --*/
+
</style>
html, body, .wrapper { /*-- changes default wiki settings --*/
+
</style>
width: 100%;
+
 
height: 100%;
+
background-color: transparent;
+
}
+
#globalWrapper, #content { /*-- changes default wiki settings --*/
+
width: 100%;
+
height: 100%;
+
border: 0px;
+
background-color: transparent;
+
margin: 0px;
+
padding: 0px;
+
}
+
  
  
</style>
 
<body>
 
<div id='cssmenu'>
 
<ul><li><a href='https://2015.igem.org/Team:Westminster'><img src="https://static.igem.org/mediawiki/2015/2/25/Team_Westminster_Logo.png" height="35px" width="200px" ></a></li>
 
  <!-- <li class='active'><a href='https://2015.igem.org/Team:Westminster'><span>Home</span></a></li>-->
 
  <li class='has-sub'><a href='#'><span>Team</span></a>
 
      <ul>
 
        <li><a href='https://2015.igem.org/Team:Westminster/Team'><span>Team Members</span></a></li>
 
        <li class='last'><a href='https://2015.igem.org/Team:Westminster/Attributions'><span>Attributions</span></a></li>
 
      </ul>
 
  </li>
 
  <li class='has-sub'><a href='#'><span>Project</span></a>
 
      <ul>
 
        <li><a href='https://2015.igem.org/Team:Westminster/Description'><span>Description</span></a></li>
 
        <li><a href='https://2015.igem.org/Team:Westminster/Experiments'><span>Experiments</span></a></li>
 
        <li><a href='https://2015.igem.org/Team:Westminster/Results'><span>Results</span></a></li>
 
        <li><a href='https://2015.igem.org/Team:Westminster/Design'><span>Design</span></a></li>
 
        <li class='last'><a href='https://2015.igem.org/Team:Westminster/Safety'><span>Safety</span></a></li>
 
      </ul>
 
  </li>
 
  <li class='has-sub'><a href='#'><span>Parts</span></a>
 
      <ul>
 
        <li class=''><a href='https://2015.igem.org/Team:Westminster/Parts'><span>Team Parts</span></a></li>
 
      </ul>
 
  </li>
 
  <li class='has-sub'><a href='https://2015.igem.org/Team:Westminster/Notebook'><span>Notebook</span></a>
 
      <ul>
 
        <li class='last'><a href='https://2015.igem.org/Team:Westminster/Labnotebook'><span>Lab Notebook</span></a></li>
 
      </ul>
 
  </li> 
 
  <li class='has-sub'><a href='https://2015.igem.org/Team:Westminster/Outreach'><span>Outreach</span></a>
 
    <ul>
 
        <li><a href='https://2015.igem.org/Team:Westminster/Collaborations'><span>Collaborations</span></a></li>
 
        <li class='last'><a href='https://2015.igem.org/Team:Westminster/Practices'><span>Human Practices</span></a></li>
 
      </ul>
 
  </li> 
 
  <li class='has-sub'><a href='https://2015.igem.org/Team:Westminster/Modeling'><span>Modelling</span></a>
 
      <ul>
 
        <li><a href='https://2015.igem.org/Team:Westminster/Measurement'><span>Measurement</span></a></li>
 
        <li><a href='https://2015.igem.org/Team:Westminster/Software'><span>Software</span></a></li>
 
        <li class='last'><a href='https://2015.igem.org/Team:Westminster/Entrepreneurship'><span>Entrepreneurship</span></a></li>
 
      </ul>
 
  </li>
 
<a href="https://twitter.com/WestminsteriGEM" target="_blank"><img src="https://static.igem.org/mediawiki/2015/8/8d/Team_Westminster_Twitter.png" height="32px" width="32px"></a>
 
<a href="https://www.facebook.com/WestminsteriGEM2015" target="_blank"><img src="https://static.igem.org/mediawiki/2015/7/71/Team_Westminster_Facebook.png"  height="32px" width="auto"></a>
 
<a href="http://instagram.com/westminsterigem2015" target="_blank"><img src="https://static.igem.org/mediawiki/2015/a/a2/Team_Westminster_Instagram.png" height="32px" width="32px"></a> 
 
<img src="https://static.igem.org/mediawiki/2015/3/3a/Team_Westminster_iGEM_Logo_blue.png" height="65px" width="85px" alt="iGEM Westminster Logo">
 
</ul>
 
</div>
 
 
</html>
 
</html>

Latest revision as of 19:14, 11 September 2015