Template:Team:Berkeley/css

From 2013.igem.org

(Difference between revisions)
(Created page with "<html> <style type="text/css"> - grid layout with 4 columns: div.layout-1000{ width: 1000px; margin: 10px auto;} div.row { height: 1%; } div.row12 {height: 150px} div.row-en...")
Line 1: Line 1:
-
<html>
+
<style = "text/css" media="screen">
-
<style type="text/css">
+
ul.sidenav {
-
/* grid layout with 4 columns */
+
list-style:none;
-
 
+
padding: 0;
-
div.layout-1000{ width: 1000px; margin: 10px auto;}
+
margin:0px, 0px, 0px, 20px;
 +
width: 160px;
 +
float: right;
 +
}
 +
ul.sidenav li {
 +
position: relative;
 +
}
 +
ul.sidenav li a{
 +
display: block;
 +
overflow: auto; /*force hasLayout in IE7 */
 +
color: white;
 +
text-decoration: none;
 +
margin: .75%;
 +
font: 1.9em 'Myriad Pro';
 +
width: 150px;
 +
}
 +
ul.sidenav li a:link, ul.sidenav li a:visited{
 +
<!--background: url(https://static.igem.org/mediawiki/2012/6/62/2012_berkeley_home.jpg) no-repeat 100% 50%;-->
 +
background-size: 20px;
 +
/*background-color: #006291;*/ /*background of tabs (default state)*/
 +
}
 +
ul.sidenav li a:visited{
 +
color: white;
 +
}
-
div.row { height: 1%; }
+
ul.sidenav li a:hover{
-
div.row12 {height: 150px}
+
background-color: #333333;
-
div.row-end { clear: both; font: 1px/1px sans-serif; height: 1px; overflow: hidden; }
+
-
div.col1
+
-
{float: left;
+
-
    margin-left: 20px;
+
-
    margin-right: 15px;
+
}
}
-
div.col2, div.col3, div.col4,div.col4-2, div.col5, div.col6, div.col6-2, div.col7, div.col8, div.col8-2, div.col8-4, div.col9, div.col10, div.col11, div.col12, div.col12-2, div.col2-2,div.col12-3, div.col13, div.col14
+
ul.topnav {
-
    {float: left;  
+
list-style: none;
-
    margin-left: 20px;  
+
padding: 0px 0px;
 +
margin: 0;
 +
        width:1000px;
 +
float: left;
}
}
-
div.col3-2 { float: left; margin-left: 15px; }
+
ul.topnav li {
-
div.col1:first-child, div.col2:first-child, div.col2-2:first-child, div.col3:first-child, div.col3-2:first-child, div.col4:first-child, div.col5:first-child, div.col6:first-child, div.col7:first-child, div.col8:first-child, div.col9:first-child, div.col10:first-child, div.col11:first-child, div.col12:first-child, div.col12-2:first-child, div.col13:first-child { margin-left: 10px; }
+
font-family: 'Georgia', Times, serif;
-
div.col4-2:first-child, div.col6-2:first-child, div.col8-2:first-child,div.col8-3:first-child, div.col12-3:first-child, div.col8-4:first-child {margin-left: 15px;}
+
font-weight: 150;
-
+
font-size: 1.65em;
-
div.left { float:left;}
+
float: left;
-
div.col2 {width: 150px;}
+
margin:0px 0px 0px 0px;
-
div.col2-2 {width: 180px;}
+
opacity:.8;
-
div.col3 {width: 232px;}
+
padding: 2px 6px 10px 12px;
-
div.col3-2 {width: 230px;}
+
position: 0px 0px; /*--Declare X and Y axis base for sub navigation--*/
-
div.col4 { width: 303px; }
+
}
-
div.col4-2 { width: 293px; }
+
ul.topnav li a{
-
div.col6 { width: 480px; }
+
padding: 18px 8px 10px 10px;
-
div.col6-2 { width: 470px; }
+
color: white;
-
div.col8 {width: 620px;}
+
display: block;
-
div.col8-2 {width: 610px;}
+
text-decoration: none;
-
div.col8-3 {width: 650px;}
+
float: left;
-
div.col8-4 {width: 620px;}
+
}
-
div.col9 { width: 730px; }
+
ul.topnav li a:hover{
-
div.col12 { width: 1000px; }
+
background-color:black;
-
div.col12-2 {width: 980px;}
+
padding: 18px 8px 10px 10px;
-
div.col12-3 {width: 970px;}
+
font-color: white;
-
div.col13 {width: 20px;}
+
}
-
div.col14 {width: 10px;}
+
ul.topnav li span { /*--Drop down trigger styles--*/
-
div.col15 {width: 650px;}
+
width: 17px;
-
div.col16 {width: 200px;}
+
height: 25px;
 +
float: left;
 +
background-color: gray;
 +
}
 +
ul.topnav li span.subhover {
 +
background-position: center bottom;
 +
cursor: pointer; /*--Hover effect for trigger--*/
 +
}
 +
ul.topnav li ul.subnav {
 +
list-style: none;
 +
position: absolute;
 +
left: 3px; top: 55px;/*--Important - Keeps subnav from affecting main navigation flow--*/
 +
background: #333;
 +
margin: 0; padding: 3px;
 +
display: none;
 +
float: left;
 +
width: 160px;
 +
opacity: .6;
 +
border: 1px solid #111;
 +
}
 +
ul.topnav li ul.subnav li{
 +
margin: 0; padding: 0;
 +
border-top: 1px solid #252525; /*--Create bevel effect--*/
 +
border-bottom: 1px solid #444; /*--Create bevel effect--*/
 +
clear: both;
 +
height:45px;
 +
width: 155px;
 +
font-size: .5em;
 +
font-family: 'Georgia', Times, serif;
 +
font-weight: 150;
 +
}
 +
html ul.topnav li ul.subnav li a {
 +
float: left;
 +
        height:50px;
 +
width: 145px;
 +
background-color: white;  
 +
padding-left: 3px;
 +
}
 +
html ul.topnav li ul.subnav li a:hover { /*--Hover effect for subnav links--*/
 +
background-color: none;
 +
}
 +
#slideshow {  
 +
    margin: 50px auto;  
 +
    position: relative;  
 +
    width: 240px;  
 +
    height: 240px;
 +
    padding: 10px;
 +
    box-shadow: 0 0 20px rgba(0,0,0,0.4);  
 +
}
 +
#slideshow > div {  
 +
    position: absolute;
 +
    top: 10px;  
 +
    left: 10px;  
 +
    right: 10px;
 +
    bottom: 10px;
 +
}
 +
#content1{
 +
font-family:Georgia ,Helvetica,sans-serif;
 +
height: 300px;
 +
  }
-
.addborder
+
#content2{
-
{
+
font-family:Georgia ,Helvetica,sans-serif;
-
      /* Thickness, Style, and Color */
+
height: 50px;
-
      border:1px solid #000000;
+
  }
 +
body{  
 +
background: url(https://static.igem.org/mediawiki/2011/6/68/Noise_pattern_8.jpg);
 +
}
 +
#globalWrapper {width: 100%;}
 +
#content{
 +
padding: 0px;
 +
width: 1000px;
 +
background: #BABABA;
 +
font-family:Georgia ,Helvetica,sans-serif;
 +
border: none;
 +
text-decoration: none;
 +
}
 +
#footer, f-poweredbyico, f-copyrightico, f-list {
 +
background: #BABABA;
 +
margin:0px;
 +
padding:0px;}
 +
#footer-box {
 +
background: #BABABA;
 +
border:none;
 +
}
 +
.main_item h1{
 +
text-decoration:none;
}
}
-
table
+
#p-logo{display:none;}
-
{
+
#top-section2{
-
      border-collapse:collapse;
+
width: 100%;
 +
background: url(http://www.eecs.berkeley.edu/~jvmiller/images/imagetestberkeley.gif);
 +
height: 65px;
}
}
-
table,th, td
+
#top-section3{
-
{
+
width: 100%;
-
      border: 1px solid black;
+
height:0px;
-
      text-align:center;
+
-
      padding:3px;
+
}
}
-
th
+
#team{
-
{
+
border: 1px solid black;
-
      background-color:#333333;
+
padding: 2px;
-
      color:white;
+
height:380px;}
 +
#search-controls{
 +
display:none;
}
}
 +
#spacer {height: 15px;}
 +
#spacer2 {height: 9em;}
 +
#spacer3 {height: .4em;}
 +
#spacer4 {height: .8em;}
 +
#top-section{
 +
width: 100%;
 +
background: url(https://static.igem.org/mediawiki/2011/6/68/Noise_pattern_8.jpg);
 +
height: 5px;
 +
border:none;
 +
}
 +
.firstHeading {display:none;}
 +
</style>
</style>
-
</html>
 

Revision as of 23:50, 19 August 2013

<style = "text/css" media="screen"> ul.sidenav { list-style:none; padding: 0; margin:0px, 0px, 0px, 20px; width: 160px; float: right; } ul.sidenav li { position: relative; } ul.sidenav li a{ display: block; overflow: auto; /*force hasLayout in IE7 */ color: white; text-decoration: none; margin: .75%; font: 1.9em 'Myriad Pro'; width: 150px; } ul.sidenav li a:link, ul.sidenav li a:visited{ background-size: 20px; /*background-color: #006291;*/ /*background of tabs (default state)*/ } ul.sidenav li a:visited{ color: white; }

ul.sidenav li a:hover{ background-color: #333333; }

ul.topnav { list-style: none; padding: 0px 0px; margin: 0;

       width:1000px;

float: left; } ul.topnav li { font-family: 'Georgia', Times, serif; font-weight: 150; font-size: 1.65em; float: left; margin:0px 0px 0px 0px; opacity:.8; padding: 2px 6px 10px 12px; position: 0px 0px; /*--Declare X and Y axis base for sub navigation--*/ } ul.topnav li a{ padding: 18px 8px 10px 10px; color: white; display: block; text-decoration: none; float: left; } ul.topnav li a:hover{ background-color:black; padding: 18px 8px 10px 10px; font-color: white; } ul.topnav li span { /*--Drop down trigger styles--*/ width: 17px; height: 25px; float: left; background-color: gray; } ul.topnav li span.subhover { background-position: center bottom; cursor: pointer; /*--Hover effect for trigger--*/ } ul.topnav li ul.subnav { list-style: none; position: absolute; left: 3px; top: 55px;/*--Important - Keeps subnav from affecting main navigation flow--*/ background: #333; margin: 0; padding: 3px; display: none; float: left; width: 160px; opacity: .6; border: 1px solid #111; } ul.topnav li ul.subnav li{ margin: 0; padding: 0; border-top: 1px solid #252525; /*--Create bevel effect--*/ border-bottom: 1px solid #444; /*--Create bevel effect--*/ clear: both; height:45px; width: 155px; font-size: .5em; font-family: 'Georgia', Times, serif; font-weight: 150; } html ul.topnav li ul.subnav li a { float: left;

       height:50px;

width: 145px; background-color: white; padding-left: 3px; } html ul.topnav li ul.subnav li a:hover { /*--Hover effect for subnav links--*/ background-color: none; }

  1. slideshow {
   margin: 50px auto; 
   position: relative; 
   width: 240px; 
   height: 240px; 
   padding: 10px; 
   box-shadow: 0 0 20px rgba(0,0,0,0.4); 

}

  1. slideshow > div {
   position: absolute; 
   top: 10px; 
   left: 10px; 
   right: 10px; 
   bottom: 10px; 

}

  1. content1{

font-family:Georgia ,Helvetica,sans-serif; height: 300px;

 }
  1. content2{

font-family:Georgia ,Helvetica,sans-serif; height: 50px;

 }

body{ background: url(Noise_pattern_8.jpg); }

  1. globalWrapper {width: 100%;}
  2. content{

padding: 0px; width: 1000px; background: #BABABA; font-family:Georgia ,Helvetica,sans-serif; border: none; text-decoration: none; }

  1. footer, f-poweredbyico, f-copyrightico, f-list {

background: #BABABA; margin:0px; padding:0px;}

  1. footer-box {

background: #BABABA; border:none; } .main_item h1{ text-decoration:none; }

  1. p-logo{display:none;}
  2. top-section2{

width: 100%; background: url(http://www.eecs.berkeley.edu/~jvmiller/images/imagetestberkeley.gif); height: 65px; }

  1. top-section3{

width: 100%; height:0px; }

  1. team{

border: 1px solid black; padding: 2px; height:380px;}

  1. search-controls{

display:none; }

  1. spacer {height: 15px;}
  2. spacer2 {height: 9em;}
  3. spacer3 {height: .4em;}
  4. spacer4 {height: .8em;}
  5. top-section{

width: 100%; background: url(Noise_pattern_8.jpg); height: 5px; border:none; } .firstHeading {display:none;}

</style>