Team:SYSU-Software/cast.css
From 2013.igem.org
Guoskyhero (Talk | contribs) |
|||
(9 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
- | + | *{ | |
- | + | padding:0px; | |
- | + | margin: 0px; | |
- | + | } | |
- | + | body { | |
- | + | height: 100%; | |
- | + | width: 100%; | |
- | + | background-color: #CCC; | |
- | + | font-family: 'Arial'; | |
- | + | overflow-x: hidden; | |
- | + | } | |
- | + | /*home content*/ | |
- | + | #cast-header{ | |
- | + | width: 100%; | |
- | + | background-color: #dff5f1; | |
- | + | } | |
- | + | #cast-header img{ | |
- | + | position: relative; | |
- | + | width: 1147px; | |
- | + | margin-left: 50%; | |
- | + | left: -573px; | |
- | + | } | |
- | + | #cast-introduction-header{ | |
- | + | padding: 30px 0; | |
- | + | font-size:20px; | |
- | + | color: #34495e; | |
- | + | text-align: center; | |
- | + | font-weight: 600; | |
- | + | word-spacing: 5px; | |
- | + | background-color: #dff5f2; | |
- | + | } | |
- | + | #cast-intruction-text{ | |
- | + | width: 400px; | |
- | + | display: block; | |
- | + | text-align: justify; | |
- | + | font-size: 16px; | |
- | + | } | |
- | + | .cast-introduction-part table{ | |
- | + | position: relative; | |
- | + | width: 900px; | |
- | + | left: 50%; | |
- | + | margin-left: -450px; | |
- | + | text-align:center; | |
- | + | } | |
- | + | #cast-intruction-image img{ | |
- | + | width: 320px; | |
- | + | height: 400px; | |
- | + | } | |
- | + | .cast-image{ | |
- | + | margin-left:40%; | |
- | + | width:600px; | |
- | + | height:400px; | |
- | + | } | |
- | + | #cast-intruction-text-header{ | |
- | + | font-size: 19px; | |
- | + | color: #65d2c0; | |
- | + | } | |
- | + | .cast-image-td{ | |
- | + | width:70%; | |
- | + | padding:15px; | |
- | + | } | |
- | + | .cast-image-td span { | |
+ | width: 100%; | ||
+ | } | ||
+ | .cast-image-td img { | ||
+ | max-width: 470px; | ||
+ | } | ||
+ | .cast-introduction-part2{ | ||
+ | background-color: #dff5f2; | ||
+ | width: 100%; | ||
+ | } | ||
+ | /*footer*/ | ||
+ | #sysu-footer{ | ||
+ | width: 100%; | ||
+ | margin:0 auto; | ||
- | + | position: relative; | |
- | + | bottom: 0px; | |
- | + | overflow: hidden; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | background-color: white; | |
- | + | } | |
- | + | #bottom-image{ | |
+ | width: 100%; | ||
+ | } | ||
- | |||
- | |||
- | |||
- | |||
- | |||
+ | a:focus{ | ||
+ | outline-color:#544444; | ||
+ | } | ||
- | + | #display-board { | |
- | + | height: 150px; | |
- | + | /* vertical-align: middle; */ | |
+ | border: dashed 3px #868858; | ||
+ | border-radius: 5px; | ||
+ | margin-bottom: 20px; | ||
+ | padding: 10px; | ||
+ | text-align: left; | ||
+ | } | ||
+ | #display-board .board{ | ||
+ | display: inline-block; | ||
+ | vertical-align: top; | ||
+ | } | ||
+ | #display-board .board-left { | ||
+ | width: 50%; | ||
+ | } | ||
+ | #display-board .board-right { | ||
+ | width: 45%; | ||
+ | } | ||
+ | #biobrick { | ||
+ | width: 470px; | ||
+ | } | ||
+ | |||
+ | .cast-introduction-part{ | ||
+ | /* *padding-left: 80px;* */ | ||
+ | /* padding-top: 80px; */ | ||
+ | /* background-color: white; */ | ||
+ | width: 100%; | ||
+ | } | ||
+ | |||
+ | .introduction-content { | ||
+ | width: 980px; | ||
+ | margin: 0 auto; | ||
+ | padding: 20px 0; | ||
+ | } | ||
+ | |||
+ | .shots { | ||
+ | width: 50%; | ||
+ | display: inline-block; | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | |||
+ | .introduction { | ||
+ | width: 48%; | ||
+ | display: inline-block; | ||
+ | vertical-align: middle; | ||
+ | padding: 5px | ||
+ | } | ||
+ | |||
+ | .cast-introduction-part2 { | ||
+ | background: #e0f4f2; | ||
+ | } | ||
+ | |||
+ | .cast-introduction-part1 { | ||
+ | background: white; | ||
+ | } | ||
+ | |||
+ | .shots div { | ||
+ | margin: 5px 0; | ||
+ | } | ||
+ | .cast-introduction-text-header { | ||
+ | display: block; | ||
+ | font-size: 28px; | ||
+ | color: #3B746C; | ||
+ | } | ||
+ | |||
+ | #part6 .shots img { | ||
+ | height: 300px; | ||
+ | } |
Latest revision as of 18:31, 27 September 2013
- {
padding:0px; margin: 0px; } body { height: 100%; width: 100%; background-color: #CCC; font-family: 'Arial'; overflow-x: hidden; }
/*home content*/
- cast-header{
width: 100%; background-color: #dff5f1; }
- cast-header img{
position: relative;
width: 1147px; margin-left: 50%; left: -573px; }
- cast-introduction-header{
padding: 30px 0;
font-size:20px; color: #34495e; text-align: center; font-weight: 600; word-spacing: 5px; background-color: #dff5f2; }
- cast-intruction-text{
width: 400px; display: block; text-align: justify;
font-size: 16px; } .cast-introduction-part table{ position: relative; width: 900px; left: 50%; margin-left: -450px; text-align:center; }
- cast-intruction-image img{
width: 320px; height: 400px; } .cast-image{ margin-left:40%; width:600px; height:400px; }
- cast-intruction-text-header{
font-size: 19px; color: #65d2c0; } .cast-image-td{ width:70%; padding:15px; } .cast-image-td span { width: 100%; } .cast-image-td img { max-width: 470px; }
.cast-introduction-part2{ background-color: #dff5f2; width: 100%; } /*footer*/
- sysu-footer{
width: 100%; margin:0 auto;
position: relative; bottom: 0px; overflow: hidden;
background-color: white; }
- bottom-image{
width: 100%; }
a:focus{
outline-color:#544444;
}
- display-board {
height: 150px; /* vertical-align: middle; */ border: dashed 3px #868858; border-radius: 5px; margin-bottom: 20px; padding: 10px; text-align: left; }
- display-board .board{
display: inline-block; vertical-align: top; }
- display-board .board-left {
width: 50%; }
- display-board .board-right {
width: 45%; }
- biobrick {
width: 470px; }
.cast-introduction-part{ /* *padding-left: 80px;* */ /* padding-top: 80px; */ /* background-color: white; */ width: 100%; }
.introduction-content { width: 980px; margin: 0 auto; padding: 20px 0; }
.shots { width: 50%; display: inline-block; vertical-align: middle; }
.introduction { width: 48%; display: inline-block; vertical-align: middle; padding: 5px }
.cast-introduction-part2 { background: #e0f4f2; }
.cast-introduction-part1 { background: white; }
.shots div { margin: 5px 0; } .cast-introduction-text-header { display: block; font-size: 28px; color: #3B746C; }
- part6 .shots img {
height: 300px; }