Team:USTC-Software/text

From 2012.igem.org

(Difference between revisions)
Line 1: Line 1:
-
/*----the style of header css----*/
+
<html>
-
 
+
<style type="text/css">
-
*{
+
<!--
-
margin: 0;
+
#BODY { background-color:white;
-
padding: 0;
+
                background-image:none;}
-
text-decoration: none;
+
#p-logo {height:0px;
 +
overflow:hidden;
 +
display:none;
 +
}
 +
 +
#top-section{height:20px;
 +
margin-top: 0;
 +
              margin-left: auto;
 +
              margin-right: auto;
 +
              margin-bottom: 0!important;
 +
              margin-bottom: 10px;
 +
              padding:0;  
 +
              border:none;
 +
              background:#CCCCCC;
 +
}
 +
#footer-box { display: none;}
 +
#catlinks { display: none;}
 +
#search-controls {display: none;}
 +
#siteSub {display:none;}
 +
.firstHeading{display: none;}
 +
#content {background: #f1f1f1 url(http://luiszuno.com/themes/nova/img/bg/patterns/noise.png);
 +
width: 100%;
 +
border-left: 0px;
 +
border-right: 0px;
}
}
-
 
+
-->
-
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;}
+
-
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
#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*/
+
#content{width:965px;}
-
div.wrap_ps-box h3 {font-size: 30px;font-weight: bold;margin: 10px 0px 5px;color: #464646;letter-spacing: -1px;}
+
.tab{margin:0px; padding:0px; border-width:0px;}  
-
div.wrap_ps-box .gray-l h3,{color: #fffeff;margin-top: 0px;}
+
.firstHeading{display:none;}
-
div.wrap_ps-box p {text-shadow: rgba(255,254,255,0.5) 0 1px 0;color: #7a7a7a;margin: 5px 0px 10px;}
+
-
/* Image Styles */
+
</style>
-
div.wrap_ps-box img{float: left;margin-right: 20px;}
+
</html>
-
div.wrap_ps-box img.pop-out {margin-top: -42px;z-index: 2001;position: absolute;left: 94px;}
+
-
/******************************the end of popup-box css********************/
+

Revision as of 09:16, 11 August 2012