Team:USTC-Software/css

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
body {  
body {  
-
    background:#36526C;
+
    background:#36526C;
-
    margin: 0px auto;
+
    margin: 0px auto;
-
    max-width:1340px;
+
    max-width:1340px;
}
}
#home{  
#home{  
-
    position: relative;  
+
    position: relative;  
-
    height:522px;  
+
    height:522px;  
-
    background: #FFF;  
+
    background: #FFF;  
-
    width:990px;
+
    width:990px;
-
    margin-left:172px;
+
    margin-left:172px;
-
    margin-top:60px;  
+
    margin-top:60px;  
-
    -moz-border-radius:1em;
+
    -moz-border-radius:1em;
-
    -webkit-border-radius:1em;
+
    -webkit-border-radius:1em;
-
    border-radius: 1em;
+
    border-radius: 1em;
-
    display:block;
+
    display:block;
}
}
#home .line {
#home .line {
-
    border-bottom: 1px dotted #CCCCCC;
+
    border-bottom: 1px dotted #CCCCCC;
-
    background:#fff;  
+
    background:#fff;  
-
    width:100%;  
+
    width:100%;  
-
    height:35px;  
+
    height:35px;  
-
    position: absolute;  
+
    position: absolute;  
-
    top:15px;  
+
    top:15px;  
}
}
#home .line h2 {
#home .line h2 {
-
    position: relative;
+
    position: relative;
-
    font-family:"Times New Roman", Times, serif;
+
    font-family:"Times New Roman", Times, serif;
-
    color:#0D97F2;
+
    color:#0D97F2;
-
    margin-top:0px;
+
    margin-top:0px;
-
    margin-left:25px;
+
    margin-left:25px;
}
}
Line 71: Line 71:
.sprite {
.sprite {
-
position: absolute;
+
    position: absolute;
-
height: 100%;
+
    height: 100%;
-
z-index: 200;
+
    z-index: 200;
-
padding: 0;
+
    padding: 0;
-
width: 990px;
+
    width: 990px;
}
}
.screen {
.screen {
-
position: absolute;
+
    position: absolute;
-
height: 100%;
+
    height: 100%;
-
z-index: 500;
+
    z-index: 500;
-
padding: 0;
+
    padding: 0;
-
width: 990px;
+
    width: 990px;
}
}
Line 89: Line 89:
#home2 .sprite {
#home2 .sprite {
-
background: url(../pictures/Logo2.png) 50% 0 no-repeat fixed;
+
    background: url(../pictures/Logo2.png) 50% 0 no-repeat fixed;
-
opacity:0.05;
+
    opacity:0.05;
-
width:100%;
+
    width:100%;
}
}
#home2 .screen {
#home2 .screen {
-
        perspective: 50%;
+
    perspective: 50%;
-
margin-left:0px;
+
    margin-left:0px;
-
margin-top:5px;
+
    margin-top:5px;
}
}
#home3 .sprite {
#home3 .sprite {
-
background: url(../b-bg.png) 50% no-repeat fixed;
+
    background: url(../b-bg.png) 50% no-repeat fixed;
-
margin-left:210px;
+
    margin-left:210px;
-
margin-top:0px;
+
    margin-top:0px;  
-
+
}
}
 +
 +
#home3 .screen {
#home3 .screen {
-
background: url(../2.png) 50% no-repeat;
+
    background: url(../2.png) 50% no-repeat;
-
margin-left:0px;
+
    margin-left:0px;
-
margin-top:5px;
+
    margin-top:5px;
}
}
Line 116: Line 117:
#video {
#video {
-
float:left;  
+
    float:left;  
-
background: url(../video.jpg) repeat-x;
+
    background: url(../video.jpg) repeat-x;
-
  margin-top:16px;
+
    margin-top:16px;
-
margin-right:0px;  
+
    margin-right:0px;  
-
margin-left:25px;  
+
    margin-left:25px;  
-
        width:420px;
+
    width:420px;
-
height:270px;
+
    height:270px;
}
}
#abstract {
#abstract {
-
float: right;  
+
    float: right;  
-
width:475px;  
+
    width:475px;  
-
margin-right:20px;  
+
    margin-right:20px;  
-
margin-top:15px;  
+
    margin-top:15px;  
-
height:270px;  
+
    height:270px;  
-
background: url(../box_header_470.png) repeat-x;   
+
    background: url(../box_header_470.png) repeat-x;   
-
padding:13px;  
+
    padding:13px;  
-
padding-top:0px;
+
    padding-top:0px;
-
color:#213443;
+
    color:#213443;
-
border-radius: 2px 2px 0 0;  
+
    border-radius: 2px 2px 0 0;  
-
-moz-border-radius: 2px 2px 0 0;  
+
    -moz-border-radius: 2px 2px 0 0;  
-
-webkit-border-radius: 6px 6px 0 0;
+
    -webkit-border-radius: 6px 6px 0 0;
}
}
#abstract p {
#abstract p {
-
font-family: "Helvetica Neue","Arial",sans-serif;
+
    font-family: "Helvetica Neue","Arial",sans-serif;
-
font-size: 14px;
+
    font-size: 14px;
}
}
-
#abstract h2 {font-family: 'Open Sans',arial,serif;}
+
#abstract h2 { font-family: 'Open Sans',arial,serif;}
#contain {
#contain {
-
position:absolute;
+
    position:absolute;
-
float:left;  
+
    float:left;  
-
width:660px;  
+
    width:660px;  
-
height:790px;  
+
    height:790px;  
-
background: url(../box_header_250.png) no-repeat;  
+
    background: url(../box_header_250.png) no-repeat;  
-
top:310px;  
+
    top:310px;  
-
left:23px;
+
    left:23px;
-
color:#213443;
+
    color:#213443;
}
}
Line 167: Line 168:
#contain h2 {
#contain h2 {
-
font-size:18px;
+
    font-size:18px;
-
font-family: 'Open Sans',arial,serif;
+
    font-family: 'Open Sans',arial,serif;
-
margin-left:10px;
+
    margin-left:10px;
}
}
Line 175: Line 176:
#contain p {
#contain p {
-
font-size:12px;
+
    font-size:12px;
-
font-family: "Helvetica Neue","Arial",sans-serif;
+
    font-family: "Helvetica Neue","Arial",sans-serif;
}
}
#description_l {
#description_l {
-
height:auto;
+
    height:auto;
-
width:300px;  
+
    width:300px;  
-
float:left;
+
    float:left;
-
clear:left;
+
    clear:left;
-
margin-left:10px;
+
    margin-left:10px;
}
}
#description_l h3 {
#description_l h3 {
-
font-size:14px;
+
    font-size:14px;
-
font-family: 'Open Sans',"Helvetica Neue",arial,serif;
+
    font-family: 'Open Sans',"Helvetica Neue",arial,serif;
}
}
Line 197: Line 198:
#description_r {
#description_r {
-
height:auto;
+
    height:auto;
-
width:300px;  
+
    width:300px;  
-
float:right;
+
    float:right;
-
margin-top:0px;
+
    margin-top:0px;
-
margin-right:40px;
+
    margin-right:40px;
}
}
#description_r h3 {
#description_r h3 {
-
font-size:14px;
+
    font-size:14px;
-
font-family: 'Open Sans',"Helvetica Neue",arial,serif;
+
    font-family: 'Open Sans',"Helvetica Neue",arial,serif;
}
}
#ash {
#ash {
-
position:absolute;
+
    position:absolute;
-
float:right;  
+
    float:right;  
-
width:310px;  
+
    width:310px;  
-
height:790px;  
+
    height:790px;  
-
background: #EBEBEB;  
+
    background: #EBEBEB;  
-
right:18px;  
+
    right:18px;  
-
top:310px;
+
    top:310px;
-
-moz-border-radius: 0.5em;
+
    -moz-border-radius: 0.5em;
-
        -webkit-border-radius:0.5em;
+
    -webkit-border-radius:0.5em;
-
        border-radius: 0.5em;
+
    border-radius: 0.5em;
}
}
Line 226: Line 227:
#ash_container {
#ash_container {
-
position: relative;
+
    position: relative;
-
margin-left:30px;
+
    margin-left:30px;
-
width:80%;
+
    width:80%;
}
}
Line 234: Line 235:
#ash_container p {  
#ash_container p {  
-
font-family: "Helvetica Neue","Arial",sans-serif;  
+
    font-family: "Helvetica Neue","Arial",sans-serif;  
-
font-size: 12px;  
+
    font-size: 12px;  
-
line-height: 18px;
+
    line-height: 18px;
-
margin: 6px 0 16px;
+
    margin: 6px 0 16px;
}
}
#ash_container span a {  
#ash_container span a {  
-
    color:#0b83d3;  
+
    color:#0b83d3;  
-
font-family: "Helvetica Neue","Arial",sans-serif;  
+
    font-family: "Helvetica Neue","Arial",sans-serif;  
-
font-size: 12px;  
+
    font-size: 12px;  
-
line-height: 18px;
+
    line-height: 18px;
-
margin: 6px 0 16px;
+
    margin: 6px 0 16px;
-
text-decoration: none;
+
    text-decoration: none;
}
}
Line 254: Line 255:
#ash_container h3 {
#ash_container h3 {
-
font-family:'Open Sans',"Helvetica Neue",arial,serif;
+
    font-family:'Open Sans',"Helvetica Neue",arial,serif;
-
font-size: 16px;  
+
    font-size: 16px;  
-
font-weight: 600;  
+
    font-weight: 600;  
-
line-height: 20px;
+
    line-height: 20px;
-
margin-bottom: 15px;  
+
    margin-bottom: 15px;  
-
padding-top: 10px;
+
    padding-top: 10px;
}
}

Revision as of 11:34, 8 August 2013

body { 

    background:#36526C;
    margin: 0px auto;
    max-width:1340px;

}


  1. home{ 
    position: relative; 
    height:522px; 
    background: #FFF; 
    width:990px;	
    margin-left:172px;
    margin-top:60px; 
    -moz-border-radius:1em;
    -webkit-border-radius:1em;
    border-radius: 1em;
    display:block;

}

  1. home .line { 
    border-bottom: 1px dotted #CCCCCC;
    background:#fff; 
    width:100%; 
    height:35px; 
    position: absolute; 
    top:15px;

}

  1. home .line h2 { 
    position: relative;
    font-family:"Times New Roman", Times, serif;
    color:#0D97F2;
    margin-top:0px;
    margin-left:25px;

}



  1. home2{ 
    position: relative; 
    height:1200px;
    background: #FFF;
    display:block; 
    width:990px;	
    margin-left:172px; 
    margin-top:10px; 
    -moz-border-radius: 1em;
    -webkit-border-radius: 1em;
    border-radius: 1em;

}


  1. home3{ 
    position: relative; 
    height:400px;
    overflow: hidden;
    background:#0D97F2;
    display: block; 
    width:990px;	
    margin-left:172px; 
    margin-top:10px; 
    -moz-border-radius: 1em;
    -webkit-border-radius: 1em;
    border-radius: 1em;

}


.sprite { 

    position: absolute;
    height: 100%;
    z-index: 200;
    padding: 0;
    width: 990px;

} .screen { 

    position: absolute;
    height: 100%;
    z-index: 500;
    padding: 0;
    width: 990px;

}



  1. home2 .sprite { 
    background: url(../pictures/Logo2.png) 50% 0 no-repeat fixed;
    opacity:0.05;
    width:100%;

}

  1. home2 .screen { 
    perspective: 50%;
    margin-left:0px;
    margin-top:5px;

}


  1. home3 .sprite { 
    background: url(../b-bg.png) 50% no-repeat fixed;
    margin-left:210px;
    margin-top:0px;

}


  1. home3 .screen { 
    background: url(../2.png) 50% no-repeat;
    margin-left:0px;
    margin-top:5px;

}



  1. video { 
    float:left; 
    background: url(../video.jpg) repeat-x;
    margin-top:16px;
    margin-right:0px; 
    margin-left:25px;	 
    width:420px;
    height:270px;

}


  1. abstract { 
    float: right; 
    width:475px; 
    margin-right:20px; 
    margin-top:15px; 
    height:270px; 
    background: url(../box_header_470.png) repeat-x;  
    padding:13px; 
    padding-top:0px;	
    color:#213443;
    border-radius: 2px 2px 0 0; 
    -moz-border-radius: 2px 2px 0 0; 
    -webkit-border-radius: 6px 6px 0 0;

}


  1. abstract p { 
    font-family: "Helvetica Neue","Arial",sans-serif;
    font-size: 14px;

}


  1. abstract h2 { font-family: 'Open Sans',arial,serif;}


  1. contain { 
    position:absolute;
    float:left; 
    width:660px; 
    height:790px; 
    background: url(../box_header_250.png) no-repeat; 
    top:310px; 
    left:23px;
    color:#213443;

}


  1. contain h2 { 
    font-size:18px;
    font-family: 'Open Sans',arial,serif;
    margin-left:10px;

}


  1. contain p { 
    font-size:12px;
    font-family: "Helvetica Neue","Arial",sans-serif;

}


  1. description_l { 
    height:auto;
    width:300px; 
    float:left;
    clear:left;
    margin-left:10px;

}


  1. description_l h3 { 
    font-size:14px;
    font-family: 'Open Sans',"Helvetica Neue",arial,serif;

}


  1. description_r { 
    height:auto;
    width:300px; 
    float:right;
    margin-top:0px;
    margin-right:40px;

}

  1. description_r h3 { 
    font-size:14px;
    font-family: 'Open Sans',"Helvetica Neue",arial,serif;

}


  1. ash { 
    position:absolute;
    float:right; 
    width:310px; 
    height:790px; 
    background: #EBEBEB; 
    right:18px; 
    top:310px;
    -moz-border-radius: 0.5em;
    -webkit-border-radius:0.5em;
    border-radius: 0.5em;

}


  1. ash_container { 
    position: relative;
    margin-left:30px;
    width:80%;

}


  1. ash_container p { 
    font-family: "Helvetica Neue","Arial",sans-serif; 
    font-size: 12px; 
    line-height: 18px;
    margin: 6px 0 16px;

}


  1. ash_container span a { 
    color:#0b83d3; 
    font-family: "Helvetica Neue","Arial",sans-serif; 
    font-size: 12px; 
    line-height: 18px;
    margin: 6px 0 16px;
    text-decoration: none;

}


  1. ash_container span:hover a { text-decoration:underline;}
  1. ash_container h3 { 
    font-family:'Open Sans',"Helvetica Neue",arial,serif;
    font-size: 16px; 
    font-weight: 600; 
    line-height: 20px;
    margin-bottom: 15px; 
    padding-top: 10px;

}

Retrieved from "http://2013.igem.org/Team:USTC-Software/css"