Team:USTC-Software/text

From 2012.igem.org

(Difference between revisions)
Line 1: Line 1:
-
<html>
+
/*----the style of header css----*/
-
<head>
+
-
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+
-
<title>VitaYeast - Johns Hopkins University, iGEM 2011</title>
+
-
<link rel="stylesheet" type="text/css" href="https://2011.igem.org/Team:Johns_Hopkins/Templates/css/default?action=raw&ctype=text/css" />
+
-
<link rel="stylesheet" href="https://2011.igem.org/Team:Johns_Hopkins/Templates/css/defaultnivo?action=raw&ctype=text/css" type="text/css"/>
+
-
<link rel="stylesheet" href="https://2011.igem.org/Team:Johns_Hopkins/Templates/css/nivo?action=raw&ctype=text/css" type="text/css"/>
+
-
<link rel="stylesheet" href="https://2011.igem.org/Team:Johns_Hopkins/Templates/gallerifficcss?action=raw&ctype=text/css" type="text/css"/>
+
-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
+
*{
-
<script src="https://2011.igem.org/Team:Johns_Hopkins/Templates/droplinemenu?action=raw&ctype=text/javascript" type="text/javascript"></script>
+
margin: 0;
-
<script type="text/javascript" src="https://2011.igem.org/Team:Johns_Hopkins/Templates/nivosliderpack?action=raw&ctype=text/javascript"></script>
+
padding: 0;
-
<script type="text/javascript" src="https://2011.igem.org/Team:Johns_Hopkins/Templates/hoverintent?action=raw&ctype=text/javascript"></script>
+
text-decoration: none;
-
<script type="text/javascript" src="https://2011.igem.org/Team:Johns_Hopkins/Templates/galleriffic?action=raw&ctype=text/javascript"></script>
+
}
-
<script type="text/javascript" src="https://2011.igem.org/Team:Johns_Hopkins/Templates/js/opacityrollover?action=raw&ctype=text/javascript"></script>
+
-
<script type="text/javascript" src="https://2011.igem.org/Team:Johns_Hopkins/Templates/js/jqueryhistory?action=raw&ctype=text/javascript"></script>
+
-
<script type="text/javascript" src="https://2011.igem.org/Team:Johns_Hopkins/Templates/js/profile?action=raw&ctype=text/javascript"></script>
+
-
<script type="text/javascript"
+
-
  src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
+
-
</script>
+
-
<script type="text/javascript">
+
-
//build menu with DIV ID="myslidemenu" on page:
+
-
droplinemenu.buildmenu("mydroplinemenu")
+
-
//Nivoslider
+
div{
-
    $(window).load(function() {
+
display: block;
-
        $('#slider').nivoSlider({
+
}
-
effect:'fade',
+
-
pauseOnHover:true
+
-
});
+
-
    });
+
-
//Profile script from http://www.willmaster.com/library/web-development/replace-div-content.php
+
.clr{
-
function ReplaceContentInContainer(id,content) {
+
clear: both;
-
var container = document.getElementById(id);
+
-
container.innerHTML = content;
+
}
}
-
</script>
+
body{
 +
background-color: black;
 +
background: url('https://static.igem.org/mediawiki/2012/c/ca/Ustc-software-2012-bg-hex.png');
 +
margin:0 auto;
 +
}
 +
 
 +
a {outline: none;} /*for IE image-border and link dashed line bug*/
 +
a:focus { outline: 0; }
 +
a:active {star:expression_r(this.onFocus=this.blur());}
 +
:focus { outline:0; }
 +
img{display: block;border: none;}
 +
 +
 
 +
 
 +
 
 +
 
 +
 
 +
 
 +
#page_wrapper{
 +
position:relative;
 +
width: 980px;
 +
height:auto;
 +
margin: 30px auto;
 +
margin-bottom:20px;
 +
        /* background:green;
 +
      border:2px solid red;*/
 +
  }
 +
 
 +
  #globalheader{
 +
width: 980px;
 +
height:auto;
 +
margin: 12px auto;
 +
margin-bottom:2px;
 +
padding: 0px;
 +
font-family: Optima,"Courier New",Courier, "Andale Mono", Monaco ;
 +
background: url(../images/header-background.png) repeat; /* for IE:not recognize rgba()*/
 +
background-color:rgba(0, 0, 0, 0.35) ;
 +
position:relative;
 +
color: white;
 +
  background:#202020;/*for one of the choices*/
 +
    }
 +
 +
#logo{
 +
        font-size: 1.6em;
 +
    position:relative;
 +
float: left;
 +
margin-top: 20px;
 +
margin-left:60px;
 +
text-decoration: none;
 +
color:#bcbcbc;
 +
font-style: normal;
 +
width:500px;
 +
    height:70px;
 +
  /* background:green;*/
 +
    }
 +
 
 +
 
 +
/*---the begin of head menu wrapper css-----*/
 +
#wrap_header_menu {
 +
margin-top:12px;
 +
margin-bottom:10px;
 +
margin-left:50px;
 +
width:900px;
 +
height:25px;
 +
padding-bottom:18px;
 +
        }
 +
.header_menu a {
 +
text-decoration:none;
 +
color:#666;
 +
  text-shadow: 0 1px 0px #000,0 2px 0px #111;
 +
        }
 +
.header_menu ul{
 +
list-style:none;
 +
padding-top:2px;
 +
        }
 +
.header_menu li,.header_menu li:hover,.header_menu li:active {
 +
position:relative;
 +
float: left;
 +
font-size:15px;
 +
font-family:Arial, Helvetica, sans-serif;
 +
font-style:normal;
 +
display: block;
 +
text-align:center;
 +
letter-spacing:0.1em;
 +
 
 +
color:#fff;
 +
margin-right:9px;
 +
border-radius:4px;
 +
-moz-border-radius: 4px;
 +
-webkit-border-radius: 4px;
 +
 +
padding:5px 12px;
 +
-moz-border-radius-topleft  : 0px;
 +
-moz-border-radius-topright : 14px;
 +
-moz-border-radius-bottomleft : 14px;
 +
-moz-border-radius-bottomright : 0px;
 +
-webkit-border-top-left-radius: 0px;
 +
-webkit-border-top-right-radius: 14px;
 +
-webkit-border-bottom-left-radius: 14px;
 +
-webkit-border-bottom-right-radius: 0px;
 +
 +
background:#161616;
 +
border-bottom:1px solid #333;
 +
border-left:1px solid #000;
 +
border-right:1px solid #333;
 +
border-top:1px solid #000;
 +
cursor:pointer;
 +
/*text-transform:uppercase;*/
 +
      }
 +
 +
.header_menu a:hover {
 +
  text-decoration:none;
 +
color:#010101;
 +
text-shadow: 0 1px 0px #333333;
 +
}   
 +
 
 +
.header_menu li:active{
 +
border-top:1px solid #333;
 +
border-right:1px solid #000;
 +
border-left:1px solid #333;
 +
border-bottom:1px solid #000;
 +
padding:5px 12px;
 +
}
 +
 
 +
li:after, li:before {
 +
-moz-transition:width 0.5s ease 0s;
 +
height: 0px;
 +
    width: 0px;
 +
    position: absolute;
 +
    content: ' ';
 +
    display: block;
 +
    opacity:0;
 +
box-shadow: 0px 0px 5px #00c6ff;
 +
top: 32px;
 +
        }
 +
li:after {
 +
background: -moz-linear-gradient(left, #0ad, #08b);
 +
left: 10px;
 +
      }
 +
li:before {
 +
background: -moz-linear-gradient(right, #0ad, #08b); 
 +
right:2px;
 +
    }
 +
li:hover:after,li:hover:before{
 +
    width: 51%;
 +
height: 1px;
 +
    opacity:1;
 +
    }
 +
 
 +
li:active:after,li:active:before{
 +
    width: 51%;
 +
height: 1px;
 +
    opacity:1;
 +
    }
 +
li:active:after{left: 12px;}
 +
li:active:before{right:0px;}
 +
/*---the end of head menu wrapper css-----*/
 +
 
 +
 
 +
 
 +
 
 +
/*---the begin of head-text shade-shadow css-----*/
 +
.shade-shadow{
 +
        font-size:58px;font-weight: bold;color:#333; /*#487a1b*/line-height:48px;
 +
        background:#888 -webkit-linear-gradient(-15deg,#080808 5%,rgba(255,255,255,.7),
 +
rgba(255,255,255,.9),rgba(255,255,255,.7),#222 10%) no-repeat;
 +
        -webkit-box-reflect:below 0 -webkit-linear-gradient(transparent,transparent 50%,rgba(255,255,255,.6));
 +
        -webkit-background-clip:text;
 +
        -webkit-text-fill-color:transparent;
 +
        -webkit-animation:cliptexttop 3s linear infinite;
 +
        text-transform:uppercase;
 +
              }
 +
@-webkit-keyframes cliptexttop{
 +
        0%{background-position:left 0;}
 +
        100%{background-position:1000px 0;}}
 +
/*---the end of head-text shade-shadow css-----*/
 +
 +
 +
.unselectable {
 +
          -moz-user-select: -moz-none;
 +
          -khtml-user-select: none;
 +
          -webkit-user-select: none;
 +
          -o-user-select: none;
 +
          user-select: none;
 +
                  }/*for the function as the text can't be selectabled */
 +
 +
 +
 
 +
/*the begin of to header-text css*/
 +
#head_text {
 +
  letter-spacing: -1px;
 +
      text-shadow: 1px 1px 0 gray;
 +
      display: block;
 +
      cursor: pointer;
 +
      -webkit-transition: all 0.5s ease .03s;
 +
      -moz-transition: all 0.5s ease .03s;
 +
      -o-transition: all 0.5s ease .03s;
 +
      transition: all 0.5s ease .03s;
 +
    }
 +
    #head_text:hover {
 +
        letter-spacing: 1px;
 +
        -webkit-transform:  scale(1.03) translateX(12px);
 +
-moz-transform:  scale(1.03) translateX(12px);
 +
-o-transform:  scale(1.03) translateX(12px);
 +
        transform:scale(1.03);
 +
    }/*the end of to header-text css*/
 +
 +
 +
 +
/*the begin of clock-igem css*/
 +
#wrapper_of_clock{
 +
position: absolute;
 +
height:140px;
 +
width:140px;
 +
top:2px;
 +
right:28px;
 +
/*border:1px red solid;
 +
background:rgba(2,22,0 .04); */
 +
    }
 +
      .clock {
 +
          height: 140px;
 +
  width: 140px; 
 +
          position: absolute;
 +
  z-index:12;  
 +
          }
 +
          .clock_bg {
 +
  position: absolute;
 +
      right:30px;
 +
      top:30px;
 +
      width: 80px;
 +
      height: 80px;
 +
  z-index: 5;
 +
  background-image: url('https://static.igem.org/mediawiki/2012/b/b9/IGEM-USTC-logo-80.png');
 +
            }/*the end of clock-igem css*/
 +
 +
 
 +
 
 +
/*the begin of to top css*/
 +
  #topBar {
 +
      position: fixed;
 +
      right: 100px;
 +
      bottom:32px;
 +
      z-index: 20;
 +
    }
 +
  #topBar div {
 +
      background: url('https://static.igem.org/mediawiki/2012/4/4d/Top-black-arrow.png');
 +
      display: block;
 +
      height: 53px;
 +
  width: 53px;
 +
      overflow: hidden;
 +
      text-indent: -9999px;
 +
      cursor: pointer;
 +
      -webkit-transition: all 0.5s ease .03s;
 +
      -moz-transition: all 0.5s ease .03s;
 +
      -o-transition: all 0.5s ease .03s;
 +
      transition: all 0.5s ease .03s;
 +
    }
 +
    #topBar div:hover {
 +
background: url('https://static.igem.org/mediawiki/2012/f/f8/Gray-top-arrow.png');
 +
        -moz-transform: scale(1.08);
 +
        -webkit-transform:  scale(1.08);
 +
        -o-transform:scale(1.08);
 +
        transform:scale(1.08);
 +
    }/**************************the end of to top css*************/    
 +
 
 +
 
 +
/*the begin of popup-box css*/
 +
span.wrap_ps-link {cursor: pointer;}
 +
span.wrap_ps-link:hover {
 +
text-shadow:#dcf 0 0 5px;
 +
    color: #300;
 +
    text-decoration:none;
 +
              }
 +
/* Each Box's specified width: Requied so that they're showing in the middle of the page */ 
 +
div.wrap_ps-box.wrapper-L,div.wrap_ps-box.wrapper-R {    
 +
background-image:url(dlbj.jpg);
 +
background-repeat:repeat-x;
 +
border:2px solid #614A43;
 +
font: 14px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
 +
text-align: left;left: 25%;right: 25%;
 +
background-color: #666;
 +
border-radius:5px;-moz-border-radius:5px; -khtml-border-radius:5px; -webkit-border-radius:5px;
 +
padding:1px;
 +
z-index:20;
 +
width: 530px;
 +
height: auto;
 +
left:40%;/*FF IE7*/
 +
top:41%;/*FF IE7*/
 +
margin-left:-150px!important;/*FF IE7 half */
 +
margin-top:-60px!important;/*FF IE7 */
 +
margin-top:0px;
 +
position:fixed!important;/*FF IE7 half*/
 +
position:absolute;/*IE6*/      
 +
}
 +
div.wrap_ps-box.wrapper-R{
 +
left:42%;/*FF IE7*/
 +
top:42%;/*FF IE7*/
 +
margin-left:-150px!important;/*FF IE7 half */
 +
margin-top:-60px!important;/*FF IE7 */
 +
margin-top:0px;
 +
}
 +
div.wrap_ps-box div.inside {margin: 3px;padding: 10px;overflow: visible;z-index: 20;}
 +
div.wrap_ps-box div.inside.gray-r,div.wrap_ps-box div.inside.gray-l {background: #333;}
 +
 
 +
/* Close Buttons */
 +
div.wrap_ps-box span.wrap_ps-close {
 +
position: absolute;top: -13px;right: -13px;width: 35px;height: 35px;
 +
background: url(../images/close-buttons-choices.85.png) no-repeat;
 +
}
 +
div.wrap_ps-box span.wrap_ps-close {background-position: -36px 0px;}
 +
div.wrap_ps-box span.wrap_ps-close:hover {background-position: -36px -36px;cursor: pointer;}
 +
div.wrap_ps-box span.wrap_ps-close.left {top: -13px;left: -13px;}
 +
div.wrap_ps-box span.wrap_ps-close.gray-l {background-position: -36px 0px;}
 +
div.wrap_ps-box span.wrap_ps-close.gray-l:hover {background-position: -36px -36px;}
 +
 
 +
 
 +
/*the text content style*/
 +
div.wrap_ps-box h3 {font-size: 30px;font-weight: bold;margin: 10px 0px 5px;color: #464646;letter-spacing: -1px;}
 +
div.wrap_ps-box .gray-l h3,{color: #fffeff;margin-top: 0px;}
 +
div.wrap_ps-box p {text-shadow: rgba(255,254,255,0.5) 0 1px 0;color: #7a7a7a;margin: 5px 0px 10px;}
 +
 
-
</head>
+
/* Image Styles */
-
<body>
+
div.wrap_ps-box img{float: left;margin-right: 20px;}
-
<div id="banner">
+
div.wrap_ps-box img.pop-out {margin-top: -42px;z-index: 2001;position: absolute;left: 94px;}
-
<a href="https://2011.igem.org/Team:Johns_Hopkins"><img src="https://static.igem.org/mediawiki/2011/e/e9/Jhuigemlogo.png"></a>
+
/******************************the end of popup-box css********************/
-
                     
+
-
</div>
+

Revision as of 13:16, 2 August 2012

/*----the style of header css----*/

  • {

margin: 0; padding: 0; text-decoration: none; }

div{ display: block; }

.clr{ clear: both; }

body{ background-color: black; background: url('https://static.igem.org/mediawiki/2012/c/ca/Ustc-software-2012-bg-hex.png'); margin:0 auto; }

a {outline: none;} /*for IE image-border and link dashed line bug*/ a:focus { outline: 0; } a:active {star:expression_r(this.onFocus=this.blur());}

focus { outline:0; }

img{display: block;border: none;}




  1. page_wrapper{

position:relative; width: 980px; height:auto; margin: 30px auto; margin-bottom:20px; 

       /* background:green;

border:2px solid red;*/ 

  }

 #globalheader{

width: 980px; height:auto; margin: 12px auto; margin-bottom:2px; padding: 0px; font-family: Optima,"Courier New",Courier, "Andale Mono", Monaco ; background: url(../images/header-background.png) repeat; /* for IE:not recognize rgba()*/ background-color:rgba(0, 0, 0, 0.35) ; position:relative; color: white; background:#202020;/*for one of the choices*/ }

#logo{ font-size: 1.6em; position:relative; float: left; margin-top: 20px; margin-left:60px; text-decoration: none; color:#bcbcbc; font-style: normal; width:500px; height:70px; /* background:green;*/ }


/*---the begin of head menu wrapper css-----*/

  1. wrap_header_menu {

margin-top:12px; margin-bottom:10px; margin-left:50px; width:900px; height:25px; padding-bottom:18px; 

        }

.header_menu a { text-decoration:none; color:#666; text-shadow: 0 1px 0px #000,0 2px 0px #111; 

       }

.header_menu ul{ list-style:none; padding-top:2px; 

       }

.header_menu li,.header_menu li:hover,.header_menu li:active { position:relative; float: left; font-size:15px; font-family:Arial, Helvetica, sans-serif; font-style:normal; display: block; text-align:center; letter-spacing:0.1em;

color:#fff; margin-right:9px; border-radius:4px; -moz-border-radius: 4px; -webkit-border-radius: 4px;

padding:5px 12px; -moz-border-radius-topleft  : 0px; -moz-border-radius-topright : 14px; -moz-border-radius-bottomleft : 14px; -moz-border-radius-bottomright : 0px; -webkit-border-top-left-radius: 0px; -webkit-border-top-right-radius: 14px; -webkit-border-bottom-left-radius: 14px; -webkit-border-bottom-right-radius: 0px;

background:#161616; border-bottom:1px solid #333; border-left:1px solid #000; border-right:1px solid #333; border-top:1px solid #000; cursor:pointer; /*text-transform:uppercase;*/ 

     }

.header_menu a:hover { 

 	text-decoration:none; 
	color:#010101;

text-shadow: 0 1px 0px #333333; }

.header_menu li:active{ border-top:1px solid #333; border-right:1px solid #000; border-left:1px solid #333; border-bottom:1px solid #000; padding:5px 12px; }

li:after, li:before { -moz-transition:width 0.5s ease 0s; height: 0px; 

   width: 0px;
   position: absolute;
   content: ' ';
   display: block;
   opacity:0;

box-shadow: 0px 0px 5px #00c6ff; top: 32px; 

       }

li:after { background: -moz-linear-gradient(left, #0ad, #08b); left: 10px; 

      }

li:before { background: -moz-linear-gradient(right, #0ad, #08b); right:2px; 

    }

li:hover:after,li:hover:before{ 

   width: 51%;

height: 1px; 

   opacity:1;
    }

li:active:after,li:active:before{ 

   width: 51%;

height: 1px; 

   opacity:1;
   }

li:active:after{left: 12px;} li:active:before{right:0px;} /*---the end of head menu wrapper css-----*/



/*---the begin of head-text shade-shadow css-----*/ .shade-shadow{ 

       font-size:58px;font-weight: bold;color:#333; /*#487a1b*/line-height:48px;
       background:#888 -webkit-linear-gradient(-15deg,#080808 5%,rgba(255,255,255,.7),

rgba(255,255,255,.9),rgba(255,255,255,.7),#222 10%) no-repeat; 

       -webkit-box-reflect:below 0 -webkit-linear-gradient(transparent,transparent 50%,rgba(255,255,255,.6));
       -webkit-background-clip:text;
       -webkit-text-fill-color:transparent;
       -webkit-animation:cliptexttop 3s linear infinite;
       text-transform:uppercase;
             }

@-webkit-keyframes cliptexttop{ 

       0%{background-position:left 0;}
       100%{background-position:1000px 0;}}

/*---the end of head-text shade-shadow css-----*/


.unselectable { 

         -moz-user-select: -moz-none;
         -khtml-user-select: none;
         -webkit-user-select: none;
         -o-user-select: none;
         user-select: none;
                  }/*for the function as the text can't be selectabled */

/*the begin of to header-text css*/ 

#head_text {

letter-spacing: -1px; 

     text-shadow: 1px 1px 0 gray;
     display: block;
     cursor: pointer;
     -webkit-transition: all 0.5s ease .03s;
     -moz-transition: all 0.5s ease .03s;
     -o-transition: all 0.5s ease .03s;
     transition: all 0.5s ease .03s;
   }
   #head_text:hover {
       letter-spacing: 1px;
       -webkit-transform:  scale(1.03) translateX(12px);

-moz-transform: scale(1.03) translateX(12px); -o-transform: scale(1.03) translateX(12px); 

       transform:scale(1.03);
   }/*the end of to header-text css*/


/*the begin of clock-igem css*/ #wrapper_of_clock{ position: absolute; height:140px; width:140px; top:2px; right:28px; /*border:1px red solid; background:rgba(2,22,0 .04); */ } 

     .clock {
         height: 140px;

width: 140px; 

         position: absolute;

z-index:12; 

         }		
         .clock_bg {

position: absolute; right:30px; top:30px; width: 80px; height: 80px; z-index: 5; background-image: url('https://static.igem.org/mediawiki/2012/b/b9/IGEM-USTC-logo-80.png'); }/*the end of clock-igem css*/


/*the begin of to top css*/ 

 #topBar {
     position: fixed;
     right: 100px;
      bottom:32px;
      z-index: 20;
   }
  #topBar div {
     background: url('https://static.igem.org/mediawiki/2012/4/4d/Top-black-arrow.png');
     display: block;
     height: 53px;

width: 53px; 

     overflow: hidden;
     text-indent: -9999px;
     cursor: pointer;
     -webkit-transition: all 0.5s ease .03s;
     -moz-transition: all 0.5s ease .03s;
     -o-transition: all 0.5s ease .03s;
     transition: all 0.5s ease .03s;
   }
   #topBar div:hover {

background: url('https://static.igem.org/mediawiki/2012/f/f8/Gray-top-arrow.png'); 

       -moz-transform: scale(1.08);
       -webkit-transform:  scale(1.08);
       -o-transform:scale(1.08);
       transform:scale(1.08);
   }/**************************the end of to top css*************/


/*the begin of popup-box css*/ span.wrap_ps-link {cursor: pointer;} span.wrap_ps-link:hover { text-shadow:#dcf 0 0 5px; 

   color: #300;
   text-decoration:none;
              }

/* Each Box's specified width: Requied so that they're showing in the middle of the page */ div.wrap_ps-box.wrapper-L,div.wrap_ps-box.wrapper-R { background-image:url(dlbj.jpg); background-repeat:repeat-x; border:2px solid #614A43; font: 14px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; text-align: left;left: 25%;right: 25%; background-color: #666; border-radius:5px;-moz-border-radius:5px; -khtml-border-radius:5px; -webkit-border-radius:5px; padding:1px; z-index:20; width: 530px; height: auto; left:40%;/*FF IE7*/ top:41%;/*FF IE7*/ margin-left:-150px!important;/*FF IE7 half */ margin-top:-60px!important;/*FF IE7 */ margin-top:0px; position:fixed!important;/*FF IE7 half*/ position:absolute;/*IE6*/ } div.wrap_ps-box.wrapper-R{ left:42%;/*FF IE7*/ top:42%;/*FF IE7*/ margin-left:-150px!important;/*FF IE7 half */ margin-top:-60px!important;/*FF IE7 */ margin-top:0px; } div.wrap_ps-box div.inside {margin: 3px;padding: 10px;overflow: visible;z-index: 20;} div.wrap_ps-box div.inside.gray-r,div.wrap_ps-box div.inside.gray-l {background: #333;}

/* Close Buttons */ div.wrap_ps-box span.wrap_ps-close { position: absolute;top: -13px;right: -13px;width: 35px;height: 35px; background: url(../images/close-buttons-choices.85.png) no-repeat; } div.wrap_ps-box span.wrap_ps-close {background-position: -36px 0px;} div.wrap_ps-box span.wrap_ps-close:hover {background-position: -36px -36px;cursor: pointer;} div.wrap_ps-box span.wrap_ps-close.left {top: -13px;left: -13px;} div.wrap_ps-box span.wrap_ps-close.gray-l {background-position: -36px 0px;} div.wrap_ps-box span.wrap_ps-close.gray-l:hover {background-position: -36px -36px;}


/*the text content style*/ div.wrap_ps-box h3 {font-size: 30px;font-weight: bold;margin: 10px 0px 5px;color: #464646;letter-spacing: -1px;} div.wrap_ps-box .gray-l h3,{color: #fffeff;margin-top: 0px;} div.wrap_ps-box p {text-shadow: rgba(255,254,255,0.5) 0 1px 0;color: #7a7a7a;margin: 5px 0px 10px;}


/* Image Styles */ div.wrap_ps-box img{float: left;margin-right: 20px;} div.wrap_ps-box img.pop-out {margin-top: -42px;z-index: 2001;position: absolute;left: 94px;} /******************************the end of popup-box css********************/

Retrieved from "http://2012.igem.org/Team:USTC-Software/text"