Team:UNITN-Trento/CSS/Home
From 2013.igem.org
Line 148: | Line 148: | ||
display: block; | display: block; | ||
- | margin: | + | margin: 1em auto; |
margin-left: 1em; | margin-left: 1em; | ||
padding: 10px; | padding: 10px; | ||
Line 154: | Line 154: | ||
- | width: | + | width: 200px; |
background-color: rgba(255,255,255,.8); | background-color: rgba(255,255,255,.8); | ||
border-radius: 1em; | border-radius: 1em; | ||
- | font-size: 0. | + | font-size: 0.85em; |
line-height: 1em; | line-height: 1em; | ||
list-style: disc; | list-style: disc; | ||
Line 177: | Line 177: | ||
.column.second .cell.first img.plasmid { | .column.second .cell.first img.plasmid { | ||
- | top: | + | top: 95px; |
right: -10px; | right: -10px; | ||
- | width: | + | width: 65px; |
} | } | ||
.column.second .cell.first img.human { | .column.second .cell.first img.human { | ||
- | top: | + | top: 190px; |
right: -10px; | right: -10px; | ||
- | width: | + | width: 65px; |
} | } | ||
.column.second .cell.first img.product { | .column.second .cell.first img.product { | ||
- | top: | + | top: 270px; |
right: -10px; | right: -10px; | ||
- | width: | + | width: 65px; |
} | } | ||
.column.second .cell.first img.fruit { | .column.second .cell.first img.fruit { | ||
- | top: | + | top: 380px; |
right: -10px; | right: -10px; | ||
- | width: | + | width: 65px; |
} | } |
Revision as of 10:58, 29 September 2013
- tn-central-container,
- tn-content-wrap,
- tn-content {
padding-bottom: 0 !important;
}
/*PRE-GRID*/
.pre-footer {
width: 960px; margin: 0 auto;
}
.pre-footer .sheet {
width: 922px; min-height: 100px;
margin-left: 10px;
background-color: rgba(32,86,54,.9); background-image: url( ); border: 3px solid white;
box-shadow: 2px 2px 4px #323232;
text-align: justify;
}
.pre-footer .sheet .container {
margin: 20px; padding: 15px 25px; background-color: rgba(250,250,250,.7); border-radius: 10px;
}
.pre-footer p {
margin: 0.4em auto;
line-height: 1.2em;
}
.pre-footer .silhouette {
display: block; margin: 0 auto;
}
/*GRID*/
.grid {
width: 960px; margin: 0 auto; padding-bottom: 2em;
}
.column {
display: inline-block; margin: 0; padding: 0; width: 315px; vertical-align: top;
}
.cell {
display: inline-block;
padding: 0;
background-color: white; border: 3px solid white; box-shadow: 2px 2px 4px black; vertical-align: top;
}
.column.first .cell.first {
background-image: url();
margin: 10px 7px 7px 10px;
}
.column.first .cell.second {
margin: 7px 7px 10px 10px;
background-image: url();
}
.column.third .cell.first {
margin: 10px 10px 7px 0px; background-image: url();
}
.column.third .cell.second {
margin: 7px 10px 10px 0px;
background-image: url();
}
.column.first .cell.first, .column.first .cell.second, .column.third .cell.first, .column.third .cell.second {
height: 222px; width: 293px; white-space: nowrap;
}
.column.first .cell.first:hover, .column.first .cell.second:hover, .column.third .cell.first:hover, .column.third .cell.second:hover {
box-shadow: 2px 2px 4px #323232 inset;
}
.column.first .cell.first a, .column.first .cell.second a, .column.third .cell.first a, .column.third .cell.second a {
display: block;
height: 100%; width: 100%;
}
.column.second .cell.first {
position: relative;
margin: 10px 0px 10px 0px; height: 464px; width: 300px; background-color: rgba(245, 90, 0,.75); background-image: url( );
}
.column.second .cell.first .tn-title {
display: block; color: white; font-family: "Boogaloo", cursive; font-size: 2.5em; text-align: center; text-shadow: 2px 2px 4px #323232;
}
.column.second .cell.first ul {
display: block; margin: 1em auto; margin-left: 1em; padding: 10px; padding-left: 25px;
width: 200px; background-color: rgba(255,255,255,.8); border-radius: 1em; font-size: 0.85em; line-height: 1em; list-style: disc; vertical-align: middle;
}
.column.second .cell.first ul li {
margin-bottom: 0.3em;
}
.column.second .cell.first img {
position: absolute; margin: 0.8em; width: 70px;
}
.column.second .cell.first img.plasmid {
top: 95px; right: -10px; width: 65px;
}
.column.second .cell.first img.human {
top: 190px; right: -10px; width: 65px;
}
.column.second .cell.first img.product {
top: 270px; right: -10px; width: 65px;
}
.column.second .cell.first img.fruit {
top: 380px; right: -10px; width: 65px;
}