Difference between revisions of "Team:DTU-Denmark/wiki.css"
Line 2: | Line 2: | ||
height: 100%; } | height: 100%; } | ||
− | .firstHeading, .printfooter{ | + | .firstHeading, .printfooter, #top_menu_under { |
display: none; } | display: none; } | ||
− | + | #top_menu_14 { | |
− | + | transition: position 0.7s ease-out; } | |
− | + | ||
− | + | .top_menu_faded { | |
− | + | position: -20px; } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
.hero { | .hero { | ||
− | background-position: center; | + | height: 100%; |
− | + | width: 100%; | |
− | + | position: relative; | |
+ | text-align: center; | ||
+ | color: #f8f8f8; | ||
+ | -webkit-background-size: cover; | ||
+ | -moz-background-size: cover; | ||
+ | -o-background-size: cover; | ||
+ | background-size: cover; } | ||
+ | @media screen and (min-width: 1025px) { | ||
+ | .hero { | ||
+ | background-position: center; | ||
+ | background-attachment: fixed; | ||
+ | background-repeat: no-repeat; } | ||
} | } | ||
Line 61: | Line 67: | ||
.igem-logo img { | .igem-logo img { | ||
width: 70px; | width: 70px; | ||
− | |||
filter: grayscale(1); | filter: grayscale(1); | ||
− | + | transition: filter 0.5s ease-in-out; } | |
− | + | ||
− | + | ||
.igem-logo img:hover { | .igem-logo img:hover { | ||
− | |||
filter: grayscale(0); } | filter: grayscale(0); } | ||
Line 76: | Line 78: | ||
background-color: transparent; } | background-color: transparent; } | ||
− | @ | + | @keyframes baloonBounceAnim { |
0% { | 0% { | ||
− | + | transform: translateY(0); } | |
50% { | 50% { | ||
− | + | transform: translateY(20px); } | |
100% { | 100% { | ||
− | + | transform: translateY(0); } | |
} | } | ||
Line 94: | Line 96: | ||
background: 0 0; | background: 0 0; | ||
transition: background 0.3s ease-in-out; | transition: background 0.3s ease-in-out; | ||
− | + | animation: baloonBounceAnim 1500ms infinite ease-in-out; } | |
− | + | ||
@media screen and (min-width: 768px) { | @media screen and (min-width: 768px) { | ||
.btn-circle { | .btn-circle { | ||
Line 108: | Line 109: | ||
background: rgba(255, 255, 255, 0.2); } | background: rgba(255, 255, 255, 0.2); } | ||
.btn-circle i.animated { | .btn-circle i.animated { | ||
− | + | transition-property: -webkit-transform; | |
− | + | transition-duration: 1s; } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
.btn-circle:hover i.animated { | .btn-circle:hover i.animated { | ||
− | + | animation-name: pulse; | |
− | + | animation-duration: 1.5s; | |
− | + | animation-iteration-count: infinite; } | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
.navimg { | .navimg { |
Revision as of 12:13, 18 August 2015
html, body {
height: 100%; }
.firstHeading, .printfooter, #top_menu_under { display: none; }
#top_menu_14 { transition: position 0.7s ease-out; }
.top_menu_faded { position: -20px; }
.hero { height: 100%; width: 100%; position: relative; text-align: center; color: #f8f8f8; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } @media screen and (min-width: 1025px) { .hero { background-position: center; background-attachment: fixed; background-repeat: no-repeat; }
}
.hero-text {
position: relative; margin-top: 10px; font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight: 700; } @media screen and (min-width: 768px) { .hero-text { margin-top: 150px; }
}
.hero-text h1 { margin: 0; text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6); font-size: 3em; } @media screen and (min-width: 768px) { .hero-text h1 { font-size: 5em; }
}
.hero-text h3 { text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6); } .hero-text hr { max-width: 400px; width: 70%; border-top: 1px solid #f8f8f8; border-bottom: 1px solid #000; border-bottom: 1px solid rgba(0, 0, 0, 0.2); } .hero-text li { list-style-type: none; } .hero-text li a { color: #f8f8f8; }
.igem-logo {
position: absolute; width: 100px; top: 100px; left: 40px; float: left; opacity: 0.7; } .igem-logo img { width: 70px; filter: grayscale(1); transition: filter 0.5s ease-in-out; } .igem-logo img:hover { filter: grayscale(0); }
.btn-transparent {
background-color: transparent; color: #f8f8f8; } .btn-transparent:hover, .btn-transparent:focus { background-color: transparent; }
@keyframes baloonBounceAnim {
0% { transform: translateY(0); } 50% { transform: translateY(20px); } 100% { transform: translateY(0); }
}
.btn-circle {
width: 50px; height: 50px; margin-top: 5px; border: 2px solid #f8f8f8; border-radius: 35px; font-size: 30px; background: 0 0; transition: background 0.3s ease-in-out; animation: baloonBounceAnim 1500ms infinite ease-in-out; } @media screen and (min-width: 768px) { .btn-circle { margin-top: 15px; width: 70px; height: 70px; font-size: 40px; }
}
.btn-circle:hover, .btn-circle:focus { outline: 0; color: #f8f8f8; background: rgba(255, 255, 255, 0.2); } .btn-circle i.animated { transition-property: -webkit-transform; transition-duration: 1s; } .btn-circle:hover i.animated { animation-name: pulse; animation-duration: 1.5s; animation-iteration-count: infinite; }
.navimg {
padding: 10px 15px; } .navimg img { max-height: 20px; }
.navbar-right {
text-align: center; }
@media screen and (min-width: 768px) { .navbar-default { min-height: 20px; padding: 20px 0; margin-bottom: 0; text-align: center; font-family: Montserrat, "Helvetica Neue", Helvetica, Arial, sans-serif; border: 0; background-color: transparent; transition: background 0.5s ease-in-out, padding 0.5s ease-in-out; } .navbar-default .navbar-right li a { color: #fff; } .nav-justified li a { white-space: nowrap; color: #fff; -webkit-transition: color 0.5s ease-in-out; -moz-transition: color 0.5s ease-in-out; -o-transition: color 0.5s ease-in-out; transition: color 0.5s ease-in-out; } .nav-justified li a:hover { background-color: transparent; } .nav-justified .active a { font-weight: bolder; background-color: transparent; } .top-nav-collapse { padding: 0; background-color: #fff; color: #f00; } .top-nav-collapse .navbar-brand { padding-bottom: 0; height: 20px; padding-top: 10px; } .top-nav-collapse .navbar-right li a { color: #f00; padding-top: 10px; padding-bottom: 5px; } .top-nav-collapse .nav-justified li a { color: #f00; padding-top: 10px; padding-bottom: 5px; } .top-nav-collapse .nav-justified li a:hover { background-color: transparent; } .extrabar { width: 100%; padding-bottom: 5px; padding-top: 5px; min-height: 20px; z-index: 1; border: 0; background-color: #fff; background-color: white; border-radius: 0; } .extrabar .nav-justified li a { padding: 5px; color: #f00; }
}
.affix {
top: 35px; }
.hidden { display: none; }
.img { width: 100%; height: 400px; background-clip: border-box; background-origin: padding-box; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-position: center; } @media screen and (min-width: 1025px) { .img { background-attachment: fixed; background-repeat: no-repeat; }
}
.img-title {
font-size: 36px; background-color: rgba(33, 33, 33, 0.2); color: #FFF; padding: 5px 50px; top: 10%; position: relative; font-family: 'Bree Serif', serif; text-shadow: rgba(33, 33, 33, 0.5) 0 2px 3px; } .img-title .right { text-align: right; }
.member-image {
width: 100%; }
img { max-width: 100%; }
.carousel-inner > .item > img { height: 500px; margin: 0 auto; }
.carousel-caption {
color: #f00; }
.bg-HS_baad2 { background-image: url('None'); }
.bg-Pernille { background-image: url('None'); }
.bg-Spacemoss { background-image: url('None'); }
.bg-Thea { background-image: url('None'); }
.bg-Vilhelm { background-image: url('/wiki/images/8/87/DTU-Denmark_Vilhelm.jpg'); }
.bg-MogensKilstrup { background-image: url('None'); }
.bg-Verena { background-image: url('None'); }
.bg-wizard_screenshot { background-image: url('None'); }
.bg-highschool_biotechacademy { background-image: url('None'); }
.bg-Karolina { background-image: url('None'); }
.bg-HS_baad { background-image: url('None'); }
.bg-Tobias { background-image: url('None'); }
.bg-dtulogo { background-image: url('/wiki/images/b/b7/DTU-Denmark_dtulogo.png'); }
.bg-Lundbeckfonden { background-image: url('None'); }
.bg-hero { background-image: url('/wiki/images/0/0b/DTU-Denmark_hero.jpg'); }
.bg-ChrisWorkman { background-image: url('None'); }
.bg-igemlogo { background-image: url('/wiki/images/a/af/DTU-Denmark_igemlogo.png'); }
.bg-Michael { background-image: url('None'); }
.bg-JanMartinussen { background-image: url('None'); }
.bg-Mads { background-image: url('None'); }
.bg-Ottomoensted { background-image: url('None'); }
.bg-Life-Science-and-Beyond { background-image: url('None'); }
.bg-BioBrickWorkshop-other-lowquality { background-image: url('None'); }
.bg-Snapgene { background-image: url('None'); }
.bg-Frisenette { background-image: url('None'); }
.bg-Teambuilding { background-image: url('None'); }
.bg-Viktor { background-image: url('None'); }
.bg-VWR { background-image: url('None'); }
.bg-timeline_W168 { background-image: url('None'); }
.bg-BioBrick-workshop-low-quality { background-image: url('None'); }
.bg-HS_baad2zoom { background-image: url('None'); }
.bg-Scott { background-image: url('None'); }
.bg-timeline_biobrickworkshop { background-image: url('None'); }
.bg-Facebook_update_meme { background-image: url('None'); }