Team:Imperial/Resources/CSS:main
From 2014.igem.org
(Difference between revisions)
Line 445: | Line 445: | ||
} | } | ||
.image-right { | .image-right { | ||
- | width: | + | width: 45%; |
float: right; | float: right; | ||
margin: 10px; | margin: 10px; | ||
} | } | ||
.image-left { | .image-left { | ||
- | width: | + | width: 45%; |
float: left; | float: left; | ||
margin: 10px; | margin: 10px; |
Revision as of 17:53, 16 October 2014
.tg { border-collapse: collapse; border-spacing: 0; } .tg td { font-family: Arial, sans-serif; font-size: 14px; padding: 10px 5px; border-style: solid; border-width: 1px; overflow: hidden; word-break: normal; } .tg th { font-family: Arial, sans-serif; font-size: 14px; font-weight: normal; padding: 10px 5px; border-style: solid; border-width: 1px; overflow: hidden; word-break: normal; } .tg .tg-97fa { background-color: #6d9eeb } .tg .tg-jazs { background-color: #8e7cc3 } .tg .tg-nb4k { background-color: #ffd966 } .tg .tg-dc8v { background-color: #ffff00 } .tg .tg-ojj3 { background-color: #cccccc } .tg .tg-r535 { background-color: #ff0000 } .tg .tg-zpcz { background-color: #b6d7a8 } .tg .tg-m6v9 { background-color: #f9cb9c } .tg .tg-qaud { background-color: #ea9999 } .tg .tg-e3zv { font-weight: bold } .fixed { position: fixed; top: 0; height: 30px; z-index: 1; } body { width: 960px; margin: 0 auto; background-color: #fff; font-family: 'Noto Sans', sans-serif; } .wrapper { background-color: #fff; } h1, h2, h3, h4, h5 { color: #fdcc70; font-weight: bold; margin: 20px 5px 5px 5px !important; border-bottom: none; padding: 0px; line-height: 100%; font-family: 'Oxygen', sans-serif; }
p { margin: 0px 5px 1.5em 5px; color: #666666; font-family: 'Noto Sans', sans-serif; line-height: normal; } li { font-family: 'Noto Sans', sans-serif; color: #666666; } a { font-family: 'Noto Sans', sans-serif; text-decoration: none; } .header { background-color: #fdcc70; position:relative; z-index:1000; } .header-banner { height: 100px; } .banner { position: relative; } .content { margin: 5px; background-color: beige; text-align: center; position: relative; overflow: hidden; } #sponsors { height: 100px; background-color: #ffffff; margin: 20px 0px 20px 0px; } #main_nav { font-size: 12px; } .banner-text { position: absolute; bottom: 0; z-index: 1; } .left { float: left; } .right { float: right; margin: 40px 30px 0px 0px; } .social { display: inline-block; height: 30px; } .content-icon img { height: 150px; } .content-icon { float: right; display: block; } #Logo { color: #625e71; font-size: 50px; display:inline; position: relative; left:15px; top:40px } #side_nav { font-size: 12px; margin: 70px 0 0 0; } .content-image { display: block; margin: auto; } .questions { z-index: 13; } .hidden { display: none; } .name { margin: auto; text-align: center; } .overlay { height: 200px; width: 300px; margin: 10px; text-align: center; background-color: rgba(0, 0, 0, 0.6); border-radius: 5px; position: absolute; top: 0; left: 0; z-index: 10; } .member { position: relative; } .expand { margin: auto; margin-top: 65px; width: 30px; height: 30px; border: 2px solid #fdcc70; border-radius: 50%; } .expand:hover { cursor: hand; cursor: pointer; opacity: .9; } .info-overlay { height: 650px; width: 940px; margin: 10px; text-align: center; background-color: rgba(0, 0, 0, 0.7); border-radius: 5px; position: absolute; z-index: 11; } .min { width: 30px; height: 30px; } .min:hover { cursor: hand; cursor: pointer; opacity: .9; } .min h4 { font-size: 26px; } hr { color: #ffffff; } .questions, .log p { color: #ffffff; } .overlay-content { margin-top: 20px; } .sponsors { margin: 2.5px; width: 125px; } .log { min-height: 650px; width: 940px; margin: auto; padding: 10px; text-align: center; background-color: #625d73; border-radius: 5px; } .log h3 { color: #fdcc70; } .arrow { display: inline-block; width: 15px; height: 15px; line-height: 15px; border-top: 3px solid #6ABEDB; border-right: 3px solid #6ABEDB; -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); } .arrow-left { -ms-transform: rotate(225deg); -moz-transform: rotate(225deg); -webkit-transform: rotate(225deg); transform: rotate(225deg); } #date { display: inline-block; background: none; border: none; text-align: center; color: #fdcc70; font-size: 32px; } .arrow:hover { cursor: hand; cursor: pointer; opacity: .9; } #date:hover { cursor: hand; cursor: pointer; opacity: .9; } .info-overlay h2 { color: #fdcc70; } .info-overlay h3 { color: #fdcc70; } .info-overlay p { color: #fff; } .info-overlay h4 { color: #fdcc70; margin: 5px 5px 5px 5px !important; } .overlay-content h2 { color: #fdcc70; } .overlay-content h3 { color: #fdcc70; } .overlay-content h4 { margin: 5px 5px 5px 5px !important; color: #fdcc70; } .content-double { height: 610px; width: 300px; overflow: auto; } .content-single { height: 300px; width: 300px; } .member-image { height: 200px; width: 300px; border-radius: 5px; margin: 10px } .circle-overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; height: 100%; border-radius: 50%; margin: auto; overflow: hidden; } .overlay-red { background-color: rgba(120, 74, 77, 0.7); } .overlay-blue { background-color: rgba(116, 131, 162, 0.7); } .overlay-green { background-color: rgba(0,40,0, 0.7); } #tweets { background-color: #8bcaeb; } #tweets-container { margin: 10px; } #tweets h2 { color: #fff; } .more-box { background-color: #625d71; text-transform: uppercase; text-decoration: none; margin: 5px; display: inline-block; } .more-box a { padding: 10px; font-size: 10px; color: #fff; text-transform: upper; text-decoration: none; } .content-single .bg { height: 100%; width: 100%; } .circle-overlay .overlay-content { margin-top: 100px; } .overlay-green { background-color: rgba(116, 200, 162, 0.7); } .banner-overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; height: 75%; width: 75%; margin: auto; background-color: rgba(0, 0, 0, 0.3); overflow: hidden; } .banner-overlay h1 { color: #fdcc70; font-size: 100px; } .banner-overlay h2 { color: #fdcc70; font-size: 50px; } .banner-overlay p { color: #fff; } .centre-box { position: absolute; top: 0; right: 0; bottom: 0; left: 0; text-align: center; margin: auto; } .more-box-bottom { position: absolute; bottom: 10px; left: 50px; width: 200px; } /*subNav*/ #navWrap { height: 30px; background: #44474B; width: 960px; margin-bottom: 20px; } #subNav { padding: 5px; background: #625d71; } #subNav ul { margin: 0; list-style-image: none; padding: 0; } #subNav li { float: left; padding: 3px 8px; margin: 0 10px 0 0; color: #F00; list-style-type: none !important; } #subNav li a { color: #FFF; text-decoration: none; } #subNav li a:hover { text-decoration: underline; } br.clearLeft { clear: left; } .image-right { width: 45%; float: right; margin: 10px; } .image-left { width: 45%; float: left; margin: 10px; } .image-full { width: 100%; } #overview { background-color: rgba(0, 0, 0, 0.1); border-radius: 5px; } .content-info { width: 50%; float: right; min-height: 200px; } .centre { text-align: center; } .image-small { width: 35%; } figcaption { text-align: center; color: #666666; font-size: 0.8em; font-style: italic; font-family: 'Noto Sans', sans-serif; margin-bottom: 15px; } .sidebar { background-color: beige; overflow:auto; position:fixed; } .image-half { width: 50%; }
.protocols { }
- gold {
background-color: gold;
}
- silver {
background-color: silver;
}
- bronze {
background-color: #dca56f;
}
.medal {
border-radius: 5px; padding:5px; margin:20px auto;
}
- logo-img {
width:75px; display:inline; position:relative; left:15px; top:20px
}