Team:UNITN-Trento/CSS/Tour
From 2013.igem.org
(Created page with ".tn-container { width: 960px; min-height: 800px; margin: 0 auto; background-image: url(https://static.igem.org/mediawiki/2013/c/c3/Tn-2013-Tourbg-kiwiki.png); background-attachme...") |
|||
(37 intermediate revisions not shown) | |||
Line 1: | Line 1: | ||
.tn-container { | .tn-container { | ||
+ | position: relative; | ||
+ | |||
width: 960px; | width: 960px; | ||
min-height: 800px; | min-height: 800px; | ||
Line 6: | Line 8: | ||
background-image: url(https://static.igem.org/mediawiki/2013/c/c3/Tn-2013-Tourbg-kiwiki.png); | background-image: url(https://static.igem.org/mediawiki/2013/c/c3/Tn-2013-Tourbg-kiwiki.png); | ||
background-attachment: scroll; | background-attachment: scroll; | ||
- | background-position: | + | background-position: 300px 50px; |
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
Line 17: | Line 19: | ||
width: 300px; | width: 300px; | ||
- | margin: | + | margin-left: 200px; |
padding: 10px; | padding: 10px; | ||
Line 40: | Line 42: | ||
background-position: center center; | background-position: center center; | ||
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
+ | } | ||
+ | |||
+ | .tn-container .tour { | ||
+ | width: 300px; | ||
+ | |||
+ | /*background-color: white; | ||
+ | border-radius: 1em; | ||
+ | box-shadow: 2px 2px 4px #323232;*/ | ||
+ | } | ||
+ | |||
+ | .tn-container #tour1 { | ||
+ | position: absolute; | ||
+ | left: 10px; | ||
+ | bottom: 300px; | ||
+ | } | ||
+ | |||
+ | .tn-container #tour2 { | ||
+ | position: absolute; | ||
+ | left: 50px; | ||
+ | bottom: 30px; | ||
+ | } | ||
+ | |||
+ | .tn-container #tour3 { | ||
+ | position: absolute; | ||
+ | right: 100px; | ||
+ | bottom: 10px; | ||
+ | } | ||
+ | |||
+ | .tn-container #tour4 { | ||
+ | position: absolute; | ||
+ | right: 10px; | ||
+ | bottom: 240px; | ||
+ | } | ||
+ | |||
+ | .tn-container .tour > a { | ||
+ | text-decoration: none; | ||
+ | } | ||
+ | |||
+ | .tn-container .tour .title { | ||
+ | display: block; | ||
+ | |||
+ | width: 80%; | ||
+ | |||
+ | margin: 2px auto; | ||
+ | padding: 10px 0; | ||
+ | |||
+ | background-color: rgba(31, 68, 87, 0.9); | ||
+ | border: 3px solid white; | ||
+ | border-radius: 0.5em 0.5em 0.5em 0.5em; | ||
+ | |||
+ | color: white; | ||
+ | font-family: "Mouse Memoirs",cursive; | ||
+ | font-size: 2em; | ||
+ | } | ||
+ | |||
+ | .tn-container .tour .title:hover { | ||
+ | background-color: rgba(196, 34, 28,0.9); | ||
+ | } | ||
+ | |||
+ | .tn-container .tour table { | ||
+ | width: 90%; | ||
+ | |||
+ | margin: 10px; | ||
+ | |||
+ | background-color: transparent; | ||
+ | |||
+ | font-size: 0.8em; | ||
+ | } | ||
+ | |||
+ | .tn-container .tour table td { | ||
+ | border-bottom: 1px dotted #323232; | ||
+ | text-align: center; | ||
+ | } | ||
+ | |||
+ | .tn-container .tour table td.half { | ||
+ | width: 50%; | ||
+ | } | ||
+ | |||
+ | .tn-container .tour table td.right { | ||
+ | border-left: 1px dotted #323232; | ||
+ | } | ||
+ | |||
+ | .tn-container .tour table td.no-border { | ||
+ | border-bottom: none !important; | ||
} | } |
Latest revision as of 09:33, 19 September 2013
.tn-container { position: relative;
width: 960px; min-height: 800px; margin: 0 auto;
background-image: url();
background-attachment: scroll;
background-position: 300px 50px;
background-repeat: no-repeat;
text-align: center; }
.tn-container .bubble { position: relative;
width: 300px;
margin-left: 200px; padding: 10px;
background-color: white; border: 2px solid black; border-radius: 0.5em;
font-family: "Mouse Memoirs",cursive; font-size: 1.8em; }
.tn-container .bubble .point { position: absolute; bottom: -26px; right: 50px;
width: 20px; height: 26px;
background-image: url();
background-attachment: scroll;
background-position: center center;
background-repeat: no-repeat;
}
.tn-container .tour { width: 300px;
/*background-color: white; border-radius: 1em; box-shadow: 2px 2px 4px #323232;*/ }
.tn-container #tour1 { position: absolute; left: 10px; bottom: 300px; }
.tn-container #tour2 { position: absolute; left: 50px; bottom: 30px; }
.tn-container #tour3 { position: absolute; right: 100px; bottom: 10px; }
.tn-container #tour4 { position: absolute; right: 10px; bottom: 240px; }
.tn-container .tour > a { text-decoration: none; }
.tn-container .tour .title { display: block;
width: 80%;
margin: 2px auto; padding: 10px 0;
background-color: rgba(31, 68, 87, 0.9); border: 3px solid white; border-radius: 0.5em 0.5em 0.5em 0.5em;
color: white; font-family: "Mouse Memoirs",cursive; font-size: 2em; }
.tn-container .tour .title:hover { background-color: rgba(196, 34, 28,0.9); }
.tn-container .tour table { width: 90%;
margin: 10px;
background-color: transparent;
font-size: 0.8em; }
.tn-container .tour table td { border-bottom: 1px dotted #323232; text-align: center; }
.tn-container .tour table td.half { width: 50%; }
.tn-container .tour table td.right { border-left: 1px dotted #323232; }
.tn-container .tour table td.no-border { border-bottom: none !important; }