Team:UNITN-Trento/CSS/Project/Datapage
From 2013.igem.org
(Difference between revisions)
Line 52: | Line 52: | ||
color: #323232; | color: #323232; | ||
text-shadow: none; | text-shadow: none; | ||
+ | } | ||
+ | |||
+ | /*Navigation arrows*/ | ||
+ | |||
+ | #tn-central-container #tn-content-wrap #tn-content .container .sheet-2 { | ||
+ | position: relative; | ||
+ | |||
+ | margin: -1em 0 1em 0; | ||
+ | padding: 0.5em; | ||
+ | |||
+ | background-color: rgba(255,255,255,.6); | ||
+ | |||
+ | text-align: center; | ||
+ | } | ||
+ | |||
+ | #tn-central-container #tn-content-wrap #tn-content .container .sheet-2 .tn-arr-prev, | ||
+ | #tn-central-container #tn-content-wrap #tn-content .container .sheet-2 .tn-arr-next { | ||
+ | position: absolute; | ||
+ | bottom: 0.8em; | ||
+ | |||
+ | width: 174px; | ||
+ | |||
+ | border: none; | ||
+ | box-shadow: none; | ||
+ | } | ||
+ | |||
+ | .container .sheet-2 .tn-arr-prev { | ||
+ | left: 2em; | ||
+ | } | ||
+ | |||
+ | .container .sheet-2 .tn-arr-next { | ||
+ | right: 2em; | ||
+ | } | ||
+ | |||
+ | /*Tour*/ | ||
+ | |||
+ | #tn-central-container { | ||
+ | position: relative; | ||
+ | box-shadow: none; | ||
+ | z-index: 0; | ||
+ | } | ||
+ | |||
+ | #tn-header-wrap #tn-header #tn-menu { | ||
+ | z-index: 5; | ||
+ | } | ||
+ | |||
+ | #tn-sp-tour { | ||
+ | position: absolute; | ||
+ | bottom: 0; | ||
+ | right: 10px; | ||
+ | |||
+ | width: 250px; | ||
+ | } | ||
+ | |||
+ | #tn-sp-tour img { | ||
+ | width: 250px; | ||
+ | } | ||
+ | |||
+ | #tn-sp-tour span { | ||
+ | position: absolute; | ||
+ | bottom: 0.5em; | ||
+ | left: 0; | ||
+ | |||
+ | color: black; | ||
+ | font-family: "Boogaloo", cursive; | ||
+ | font-size: 1.5em; | ||
+ | text-shadow: 0 0 4px white; | ||
+ | } | ||
+ | |||
+ | #tn-sp-tour:hover span { | ||
+ | color: rgb(127,15,11); | ||
+ | } | ||
+ | |||
+ | @media(max-width:1500px) { | ||
+ | #tn-central-container { | ||
+ | padding-bottom: 200px; | ||
+ | } | ||
} | } |
Revision as of 20:32, 27 September 2013
- tn-content .container {
background-color: rgb(127,15,11); background-image: url();
}
.main-datapage {
display: block; margin: 2em auto; width: 960px; border: 3px solid white; box-shadow: 2px 2px 4px #323232;
}
.tn-doublephoto-wrap a {
position: relative;
}
.tn-doublephoto-wrap a:link, .tn-doublephoto-wrap a:visited {
display: inline-block; border: 3px solid white; box-shadow: 1px 1px 2px #323232;
}
.tn-doublephoto-wrap a:hover {
border-color: #dadada; box-shadow: 1px 1px 2px #323232 inset;
}
.tn-doublephoto-wrap a .text {
position: absolute; top: 5px; left: 5px; padding: 0.2em; background-color: rgba(50,50,50,.3); border-radius: 0.3em; color: white; font-family: "Boogaloo", arial; font-size: 2em; text-shadow: 0 0 2px black;
}
.tn-doublephoto-wrap a:hover .text {
background-color: rgba(250,250,250,.5); border-radius: 0.3em;
color: #323232; text-shadow: none;
}
/*Navigation arrows*/
- tn-central-container #tn-content-wrap #tn-content .container .sheet-2 {
position: relative; margin: -1em 0 1em 0; padding: 0.5em; background-color: rgba(255,255,255,.6); text-align: center;
}
- tn-central-container #tn-content-wrap #tn-content .container .sheet-2 .tn-arr-prev,
- tn-central-container #tn-content-wrap #tn-content .container .sheet-2 .tn-arr-next {
position: absolute; bottom: 0.8em;
width: 174px; border: none; box-shadow: none;
}
.container .sheet-2 .tn-arr-prev {
left: 2em;
}
.container .sheet-2 .tn-arr-next {
right: 2em;
}
/*Tour*/
- tn-central-container {
position: relative; box-shadow: none; z-index: 0;
}
- tn-header-wrap #tn-header #tn-menu {
z-index: 5;
}
- tn-sp-tour {
position: absolute; bottom: 0; right: 10px; width: 250px;
}
- tn-sp-tour img {
width: 250px;
}
- tn-sp-tour span {
position: absolute; bottom: 0.5em; left: 0; color: black; font-family: "Boogaloo", cursive; font-size: 1.5em; text-shadow: 0 0 4px white;
}
- tn-sp-tour:hover span {
color: rgb(127,15,11);
}
@media(max-width:1500px) {
#tn-central-container { padding-bottom: 200px; }
}