Team:NRP-UEA-Norwich/Test1/css1

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
-
body{
+
@charset "utf-8";
-
    color: #000;
+
#container {  
-
    font: 12px Verdana, 'Times New Roman',serif;  
+
width: 780px; /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
-
    letter-spacing:1;
+
background: #FFFFFF;
-
    background: black;
+
margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
-
    background-image: url('https://static.igem.org/mediawiki/2012/e/e2/Jhu_bg1.png')
+
border: 1px solid #000000;
 +
text-align: left; /* this overrides the text-align: center on the body element. */
}
}
-
table, th, td
 
-
{
 
-
border: 1px solid black;
 
-
color: black;
 
-
}
 
-
#header_body
+
#floatright { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
-
{  
+
float: right;
-
  filter:alpha(opacity=80);
+
margin-left: 8px;
-
  /*-moz-opacity:1.8;*/  
+
-
  opacity: 0.80;  
+
-
 
+
-
  position: absolute;
+
-
  left: 0px;  
+
-
  top: 17px;
+
-
  height: 170px;
+
-
  width: 100%;
+
-
  background: black;
+
-
  background-image:url("https://static.igem.org/mediawiki/2012/e/e2/Jhu_bg1.png")
+
}
}
-
 
+
#floatleft { /* this class can be used to float an element left in your page */
-
#footer_body
+
float: left;
-
{  
+
margin-right: 8px;
-
  filter:alpha(opacity=80);
+
-
  /*-moz-opacity:1.8;*/  
+
-
  opacity: 0.80;
+
-
 
+
-
  left: 0px;  
+
-
  bottom: 2217px;
+
-
  height: 2170px;
+
}
}
-
 
+
#clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
-
 
+
clear:both;
-
#contentSub, #search-controls, .firstHeading, #footer-box, #catlinks, #p-logo {
+
    height:0;
-
     display:none;
+
    font-size: 1px;
 +
     line-height: 0px;
}
}
-
#top-section {
+
#logo {
-
    border: none;
+
height: 82px;
-
    height: 0px;
+
width: 104px;
 +
position: absolute;
 +
background-color: #FFFFFF;
}
}
-
#content {
+
#header {
-
    border: none;
+
height: 82px;
-
    background-color: #000;
+
width: 640px;
 +
margin-left: 120px;
 +
background-color: #00CC00;
}
}
-
 
+
#title {
-
#globalWrapper
+
font-family: "Lucida Calligraphy";
-
{
+
font-size: 46px;
-
    border: none;
+
text-align: center;
-
    position: absolute;
+
height: 60px;
-
    top: 1px;
+
margin-top: 10px;
-
    width: 100%;
+
padding: 0px;
-
    left: 0px;
+
}
}
-
#bodyContent
+
#main_content {
-
{
+
font-family: "Lucida Sans";
-
    background-color: #000;
+
font-size: 16px;
 +
color: 4e4241;
 +
height: 430px;
 +
width: 280px;
 +
margin-left: 95px;
 +
margin-top: 40px;
 +
letter-spacing: normal;
 +
text-align: center;
 +
word-spacing: normal;
 +
padding: 0px;
}
}
-
#project
+
#home_btn {
-
{
+
height: 49px;
-
    background-color: #000;
+
width: 107px;
-
    position: absolute;
+
margin-top: 25px;
-
    top: 50px;
+
margin-right: 0px;
-
    width: 68%;
+
margin-bottom: 0px;
-
    left: 14%;  
+
margin-left: 95px;
 +
        border: 6px;
}
}
-
#project_temp
+
#artists_btn {
-
{
+
height: 49px;
-
   
+
width: 107px;
-
    text-align:justify;
+
margin-left: 252px;
-
    line-height: 1.6;
+
margin-top: -49px;
-
    position: absolute;
+
-
    top: 189px;
+
-
    width: 67.2%;
+
-
    left: 14%;
+
-
    font-size: 140%;
+
-
    padding-left: 20px;
+
-
    padding-right: 20px;
+
-
    padding-bottom: 20px;
+
-
    padding-top: 40px;
+
-
    background-image: url('https://static.igem.org/mediawiki/2012/a/ab/JHU_bg2.png');
+
-
   
+
-
   
+
}
}
-
#project_logo
+
#gallery_btn {
-
{
+
height: 49px;
-
    width: 300px;
+
width: 107px;
-
    position: relative;
+
margin-top: -49px;
-
    top: 0px;
+
margin-left: 409px;
-
    left: 0px;
+
}
}
-
#project_description
+
#contact_btn {
-
{
+
height: 49px;
-
    position: relative;
+
width: 107px;
-
    top: 0px;
+
margin-top: -49px;
-
    left: 13%;
+
margin-left: 566px;
-
    width: 74%;
+
-
   
+
}
}
-
#menuBar
 
-
{
 
-
    width: 100%;
 
-
}
 
-
 
-
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input{margin:0; padding:0;}
 
-
 
-
.break { clear:both; }
 
-
 
-
* {margin:0; padding:0}
 
-
p {line-height:1.4; margin-bottom:12px}
 
-
#wrapper {position:absolute; top: 0px;left:0px; width:100%; height:768px}
 
-
 
-
#header_new { height:100%; position:absolute; width:100%}
 
-
.headerimg { width:100%; height:440px; position:absolute; left: 0px; top: 17px}
 
-
.btn { height:37px; width:32px; float:left; cursor:pointer; }
 
-
#back { position:absolute; top: 300px; left: 2%; background-image:url("https://static.igem.org/mediawiki/2012/6/6e/Btn_back.png");  
+
#image_art {
-
  filter:alpha(opacity=70);  
+
height: 205px;
-
  /*-moz-opacity:1.7;*/
+
width: 180px;
-
  opacity: 0.70; }
+
margin-left: 475px;
-
#next { position:absolute; top: 300px; right: 2%; background-image:url("https://static.igem.org/mediawiki/2012/1/1d/Btn_next.png");  
+
position: absolute;
-
  filter:alpha(opacity=70);
+
margin-top: 80px;
-
  /*-moz-opacity:1.7;*/
+
-
  opacity: 0.70; }
+
-
#control { position:relative; top: 0px; left: 15px; background-image:url("../images/btn_pause.png"); }
+
}
}
-
#header_new
+
body  {
-
{
+
background: #4e4241;
-
  position: absolute;  
+
margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
-
  width: 100%;
+
padding: 0;
-
  top: 17px;
+
text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
-
  background-color: 000000;
+
color: #4e4241;
-
 
+
font-family: Verdana, Arial, Helvetica, sans-serif;
-
 
+
font-size: 100%;
}
}
-
#header_title
 
-
{
 
-
  position: absolute;
 
-
  width: 70%;
 
-
  left: 14%;
 
-
  top: 0px
 
-
}
 
-
 
-
#footer_new
 
-
{
 
-
  bottom: 2000px;
 
-
}
 
-
#footer_title
 
-
{
 
-
  width: 70%;
 
-
  left: 14%;
 
-
  bottom: 2700px
 
-
}
 
-
 
-
 
-
#navigation_wrapper
 
-
{
 
-
  position:absolute;
 
-
  top: 125px;
 
-
  width: 100%;
 
-
  background-image:url("https://static.igem.org/mediawiki/2012/e/e2/Jhu_bg1.png");
 
-
}
 
-
 
-
#title
 
-
{
 
-
 
-
 
-
 
-
    font-size: 19px;
 
-
    color: #ffffff;
 
-
    font-style: italic;
 
-
    background-color: #E8512F;
 
-
    display: block;
 
-
    margin-bottom: 10px;
 
-
    margin-top: 10px;
 
-
    padding: 5px;
 
-
}
 
-
 
-
#navigation_low
 
-
{
 
-
 
-
  width: 70%;
 
-
  position: relative;
 
-
  left:14%;
 
-
  top: 0px;
 
-
}
 
-
#Hopkins
 
-
{
 
-
  position: absolute;
 
-
  width: 30%;
 
-
  top:130px;
 
-
  left: 80%
 
-
}
 
-
.left-menu a {
 
-
    background-color: black; }
 
-
.right-menu a {
 
-
    background-color: black; }
 
-
 
-
#menubar
 
-
{
 
-
  background-image:url("https://static.igem.org/mediawiki/2012/e/e2/Jhu_bg1.png")
 
-
}
 
-
 
-
.right-menu li a:link{
 
-
  padding-top: 10px;
 
-
  background-color:transparent;
 
-
  text-decoration: none;
 
-
  color: #fff;
 
-
}
 
-
 
-
.right-menu li a:hover{
 
-
  padding-top: 10px;
 
-
  background:transparent;
 
-
  text-decoration: underline;
 
-
  color: #fff;
 
-
}
 
-
 
-
.droplinebar{
 
-
 
-
position: relative;
 
-
border-top: 1px dotted #999999;
 
-
}
 
-
 
-
.droplinebar ul{
 
-
 
-
margin: 0;
 
-
padding: 0;
 
-
float: left;
 
-
width: 100%;
 
-
line-height:20;
 
-
font:  italic 17px Verdana;
 
-
background: #000 url('https://static.igem.org/mediawiki/2012/e/e2/Jhu_bg1.png') repeat-x; /*default background of menu bar*/
 
-
}
 
-
 
-
.droplinebar ul li{
 
-
display: inline;
 
-
 
-
}
 
-
 
-
.droplinebar ul li a{
 
-
float: left;
 
-
color: white;
 
-
text-align: center;
 
-
padding: 13px 15px;
 
-
text-decoration: none;
 
-
}
 
-
 
-
.droplinebar ul li a:visited{
 
-
color: white;
 
-
}
 
-
 
-
.droplinebar ul li a:hover, .droplinebar ul li .current{ /*background of main menu bar links onMouseover*/
 
-
color: white;
 
-
background:  center center repeat-x;
 
-
background: #E8512F;
 
-
 
-
}
 
-
/* Sub level menus*/
 
-
.droplinebar ul li ul{
 
-
position: absolute;
 
-
z-index: 100;
 
-
left: 0;
 
-
top: 0;
 
-
background: #E8512F; /*sub menu background color */
 
-
visibility: hidden;
 
-
}
 
-
 
-
/* Sub level menu links style */
 
-
.droplinebar ul li ul li a{
 
-
font: normal 17px Verdana;
 
-
color:white;
 
-
padding: 10px 26px;
 
-
margin: 0;
 
-
border-bottom: 1px solid #E8512F;
 
-
width: 100px;
 
-
background: #E8512F;
 
-
}
 
-
 
-
.droplinebar ul li ul li a:visited {
 
-
color:white;
 
-
}
 
-
 
-
.droplinebar ul li ul li a:hover{ /*sub menu links' background color onMouseover */
 
-
background: #BA3114;
 
-
}
 
-
 
-
 
-
.returnLink {
 
-
position: absolute;
 
-
right: -10%;
 
-
top: -6px;
 
-
margin-bottom: 0px;
 
-
height: 160px;
 
-
width: 200px;
 
-
display: block;
 
-
background:transparent url('https://static.igem.org/mediawiki/2012/5/54/Return2.png') center top no-repeat;
 
-
}
 
-
 
-
.returnLink:hover {
 
-
  background-image: url('https://static.igem.org/mediawiki/2012/2/2e/Return1.png');
 
-
}
 
-
 
-
 
-
#navigation_temp
 
-
{
 
-
background-image: ('https://static.igem.org/mediawiki/2012/e/e2/Jhu_bg1.png');
 
-
position: absolute;
 
-
top: 0px;
 
-
height: 17px;
 
-
width: 100%;
 
-
}
 
-
 
-
.emily {
 
-
margin-bottom: 0px;
 
-
height: 254px;
 
-
width: 190px;
 
-
display: block;
 
-
background-image: url('https://static.igem.org/mediawiki/2012/2/28/Emily.png');
 
-
}
 
-
 
-
.emily:hover {
 
-
  background-image: url('https://static.igem.org/mediawiki/2012/e/ec/Emily_bio.png');
 
-
}
 
-
 
-
.robert {
 
-
margin-bottom: 0px;
 
-
height: 254px;
 
-
width: 190px;
 
-
display: block;
 
-
background-image: url('https://static.igem.org/mediawiki/2012/0/0f/JHU_Robert.png');
 
-
}
 
-
 
-
.robert:hover {
 
-
  background-image: url('https://static.igem.org/mediawiki/2012/4/45/Robert_bio.png');
 
-
}
 
-
 
-
.album {
 
-
margin-bottom: 0px;
 
-
height: 254px;
 
-
width: 190px;
 
-
display: block;
 
-
background-image: url('https://static.igem.org/mediawiki/2012/2/2a/Album.png');
 
-
}
 
-
 
-
.album:hover {
 
-
  background-image: url('https://static.igem.org/mediawiki/2012/f/f5/Album_bio.png');
 
-
}
 
-
 
-
.george {
 
-
margin-bottom: 0px;
 
-
height: 254px;
 
-
width: 190px;
 
-
display: block;
 
-
background-image: url('https://static.igem.org/mediawiki/2012/7/78/George.png');
 
-
}
 
-
 
-
.george:hover {
 
-
  background-image: url('https://static.igem.org/mediawiki/2012/7/7a/George_bio.png');
 
-
}
 
-
 
-
 
-
.boeke {
 
-
margin-bottom: 0px;
 
-
height: 254px;
 
-
width: 190px;
 
-
display: block;
 
-
background-image: url('https://static.igem.org/mediawiki/2012/a/a8/Boeke.jpg');
 
-
}
 
-
 
-
.boeke:hover {
 
-
  background-image: url('https://static.igem.org/mediawiki/2012/e/e3/Boeke_bio.jpg');
 
-
}
 
-
 
-
.bader {
 
-
margin-bottom: 0px;
 
-
height: 254px;
 
-
width: 190px;
 
-
display: block;
 
-
background-image: url('https://static.igem.org/mediawiki/2012/7/75/Bader.png');
 
-
}
 
-
 
-
.bader:hover {
 
-
  background-image: url('https://static.igem.org/mediawiki/2012/0/0a/Bader_bio.png');
 
-
}
 
-
 
-
.patrick {
 
-
margin-bottom: 0px;
 
-
height: 254px;
 
-
width: 190px;
 
-
display: block;
 
-
background-image: url('https://static.igem.org/mediawiki/2012/4/46/Patrick.jpg');
 
-
}
 
-
 
-
.patrick:hover {
 
-
  background-image: url('https://static.igem.org/mediawiki/2012/c/c3/Patrick_bio.jpg');
 
-
}
 
-
 
-
.giovanni {
 
-
margin-bottom: 0px;
 
-
height: 254px;
 
-
width: 190px;
 
-
display: block;
 
-
background-image: url('https://static.igem.org/mediawiki/2012/c/c9/Giovanni.jpg');
 
-
}
 
-
 
-
.giovanni:hover {
 
-
  background-image: url('https://static.igem.org/mediawiki/2012/5/5b/Giovanni_bio.jpg');
 
-
}
 
-
 
-
img{
 
-
border: 8px solid #e8e8e8;
 
-
background-color: white;
 
-
 
-
-moz-box-shadow: 2px 2px 3px #222;
 
-
-webkit-box-shadow: 2px 2px 3px #222;
 
-
box-shadow: 2px 2px 3px #222;
 
-
/* For IE 8 */
 
-
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#222222')";
 
-
/* For IE 5.5 - 7 */
 
-
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#222222');
 
 +
#artwork {
 +
height: 100px;
 +
width: 180px;
 +
margin-left: 475px;
 +
margin-top: 350px;
 +
position: absolute;
}
}

Revision as of 13:28, 16 July 2013

@charset "utf-8";

  1. container {

width: 780px; /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */ background: #FFFFFF; margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */ border: 1px solid #000000; text-align: left; /* this overrides the text-align: center on the body element. */ }


  1. floatright { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */

float: right; margin-left: 8px; }

  1. floatleft { /* this class can be used to float an element left in your page */

float: left; margin-right: 8px; }

  1. clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */

clear:both; 

   height:0;
   font-size: 1px;
   line-height: 0px;

}

  1. logo {

height: 82px; width: 104px; position: absolute; background-color: #FFFFFF; }

  1. header {

height: 82px; width: 640px; margin-left: 120px; background-color: #00CC00; }

  1. title {

font-family: "Lucida Calligraphy"; font-size: 46px; text-align: center; height: 60px; margin-top: 10px; padding: 0px; }

  1. main_content {

font-family: "Lucida Sans"; font-size: 16px; color: 4e4241; height: 430px; width: 280px; margin-left: 95px; margin-top: 40px; letter-spacing: normal; text-align: center; word-spacing: normal; padding: 0px; }

  1. home_btn {

height: 49px; width: 107px; margin-top: 25px; margin-right: 0px; margin-bottom: 0px; margin-left: 95px; 

       border: 6px;

}

  1. artists_btn {

height: 49px; width: 107px; margin-left: 252px; margin-top: -49px; }

  1. gallery_btn {

height: 49px; width: 107px; margin-top: -49px; margin-left: 409px; }

  1. contact_btn {

height: 49px; width: 107px; margin-top: -49px; margin-left: 566px; }


  1. image_art {

height: 205px; width: 180px; margin-left: 475px; position: absolute; margin-top: 80px; }


body { background: #4e4241; margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */ padding: 0; text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */ color: #4e4241; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 100%; }

  1. artwork {

height: 100px; width: 180px; margin-left: 475px; margin-top: 350px; position: absolute; }

Retrieved from "http://2013.igem.org/Team:NRP-UEA-Norwich/Test1/css1"