Team:TU Darmstadt/Template/CSS

From 2014.igem.org

(Difference between revisions)
m
 
(296 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
-
<style type="text/css">
 
 +
<style type="text/css">
Line 545: Line 545:
border: 2px solid black;
border: 2px solid black;
padding: 0px 0px;
padding: 0px 0px;
 +
}
}
-
div.csc-textpic .csc-textpic-imagewrap img { border: none; display: block; }
+
.csc-textpic-imagewrap img {
 +
border-radius: 20px; border 2px solid black;
 +
}
 +
 
 +
 
 +
div.csc-textpic .csc-textpic-imagewrap img { border: none; display: block; border: 1px solid black;}
/* Space below each image (also in-between rows) */
/* Space below each image (also in-between rows) */
Line 1,122: Line 1,128:
#c19 .csc-textpic {margin-top:0px;}
#c19 .csc-textpic {margin-top:0px;}
-
#allWrap {height:100%;margin-bottom:0px !important;}
+
#allWrap {height:100%;margin-bottom:0px !important; position: relative;}
-
#headerBG{width:auto;height:auto;background-color:#555;border-bottom:8px solid #fc0110;padding-top: 24px;}
+
#headerBG{width:auto;height:auto;background-color:#555;border-bottom:4px solid #fc0110;padding-top: 24px;margin-bottom: 20px;}
#headerWrap{background-color: none;}
#headerWrap{background-color: none;}
#logo{height:101px;padding-top:5px;}
#logo{height:101px;padding-top:5px;}
#claim{height:70px;text-align:right;}
#claim{height:70px;text-align:right;}
#claim p {/*padding:10px 5px;margin:5px 0;*/color:#fff;font-size:14px;line-height:18px;text-transform:uppercase;font-weight:bold;letter-spacing:0.2px;}
#claim p {/*padding:10px 5px;margin:5px 0;*/color:#fff;font-size:14px;line-height:18px;text-transform:uppercase;font-weight:bold;letter-spacing:0.2px;}
-
#topBar{height:30px;margin-top:10px;padding-right:5px;width:705px;}
+
#topBar{width: 100%;}
#topBar ul {float:right;}
#topBar ul {float:right;}
-
#topBar ul li {float:left;margin-left:20px;list-style:none;padding:6px 0;}
+
#topBar ul li {float:left;margin-left:13px;list-style:none;}
#topBar ul li.active a{color:#fff;}
#topBar ul li.active a{color:#fff;}
-
#topBar ul li a {font-size:12px !important;color:#c3c3c3;font-weight:bold;}
+
#topBar ul li a {font-size:17px !important;color:#c3c3c3;font-weight:bold;}
#topBar ul li a:hover {color:#fff;}
#topBar ul li a:hover {color:#fff;}
#searchBar.grid_6 {height:31px;}
#searchBar.grid_6 {height:31px;}
Line 1,155: Line 1,161:
#mainMenu ul.tabs > li.last{float:right;margin-right:0px !important;}
#mainMenu ul.tabs > li.last{float:right;margin-right:0px !important;}
-
#mainMenu ul.tabs > li.last a{padding:3px 15px 4px 17px !important;}
+
#mainMenu ul.tabs > li.last a{padding:3px 13px 4px 17px !important;}
.tabLeft {display:none;}
.tabLeft {display:none;}
.tabRight{display:none;}
.tabRight{display:none;}
Line 1,163: Line 1,169:
#space{background-color:red;}
#space{background-color:red;}
-
#slider{height:300px;background-color:#333;overflow: hidden;position: relative;margin-left: 5px;border:none;border-radius: 0;box-shadow: none;}
+
 
-
#slider li {margin: 0;}
+
-
#slider .flex-control-nav {background-color:transparent; bottom: 5px; right: 10px; width: auto;}
+
-
#slider .flex-control-nav li {margin-left: 7px;}
+
-
#slider .flex-control-paging li a {border-radius:0px;background-color: #333;box-shadow: none; border: none; height: 10px; width: 10px; font-weight: bold; color: #fff; font-size: 105%;position:relative;z-index:1000;}
+
-
#slider .flex-control-paging li a.flex-active {background-color: #999; border: none; color: #333;}
+
-
#slider ul.slides {margin:0;}
+
-
#slider ul.slides li {margin:0;list-style: none;display: none;}
+
-
#slider ul.slides li:first-child {display: block;}
+
-
#slider .flex-direction-nav a {position:absolute; background-image: url(../images/slider_navigation2.png);height:32px;margin-top:-10px;}
+
-
#slider .flex-direction-nav .flex-prev {opacity: 1;left: 5px;}
+
-
#slider .flex-direction-nav .flex-prev:hover {background-position: 0 100%; opacity: 1;left: 5px;}
+
-
#slider .flex-direction-nav .flex-next {background-position: 100% 0;opacity: 1;right: 5px;}
+
-
#slider .flex-direction-nav .flex-next:hover {background-position: 100% 100%;opacity: 1;right: 5px;}
+
-
#slider .flex-control-nav {display:block;}
+
-
#slider .flex-control-paging li{}
+
-
#slider .flex-control-paging .flex-active{background-color:#777;}
+
-
#slider .flex-control-paging li a:hover{background-color:#fc0110;}
+
-
#promoWrap{height:300px;}
+
#promoWrap{
 +
background-color:#999;
 +
height:305px;
 +
box-shadow: 0px 0px 6px 1px rgba(119, 119, 119, 0.6);
 +
-moz-box-shadow: 0px 0px 6px 1px rgba(119, 119, 119, 0.6);
 +
-webkit-box-shadow: 0px 0px 6px 1px rgba(119, 119, 119, 0.6);
 +
-moz-border-radius: 15px;
 +
border-radius: 15px;
 +
margin-left: 10px;
 +
 
 +
}
 +
                #promoWrap a p {text-align: center; font-weight: bold;}
#promoWrap a {padding:10px 0;}
#promoWrap a {padding:10px 0;}
 +
                #promoWrap a:hover {text-decoration: none;}
#promoWrap h1 {margin-bottom:10px;margin-top:10px;padding:0px 10px;text-align:center;}
#promoWrap h1 {margin-bottom:10px;margin-top:10px;padding:0px 10px;text-align:center;}
 +
               
/*#promoWrap a h1 {margin-bottom:10px;margin-top:10px;padding:0px 10px;text-align:center;}*/
/*#promoWrap a h1 {margin-bottom:10px;margin-top:10px;padding:0px 10px;text-align:center;}*/
#promoWrap a h1 {
#promoWrap a h1 {
Line 1,192: Line 1,195:
padding: 20px 10px 10px 10px;
padding: 20px 10px 10px 10px;
text-align: center;
text-align: center;
 +
color:lightblue;
}
}
-
#promoWrap p {margin-bottom:5px;margin-top:0px;padding:0px 10px;text-align:center;}
+
 
-
/*#promoWrap a p {margin-bottom:5px;margin-top:0px;padding:0px 10px;text-align:center;}*/
+
.grid_6.promo1,.grid_6.promo2,.grid_6.promo3 {
-
#promoWrap a p {
+
 
-
margin-bottom: 0px;
+
height: 100px;
-
margin-top: 0px;
+
border: 1px solid transparent;  
-
padding: 0px 10px 25px 10px;
+
margin-left:0;margin-right:0;height:100px !important;color:#333;
 +
-moz-border-radius: 15px;
 +
border-radius: 15px;
text-align: center;
text-align: center;
}
}
-
.grid_6.promo1{background-color:#999;margin-left:0;margin-right:0;height:100px !important;color:#333;}
+
 
-
.grid_6.promo1:hover{background-color:#fc0110;margin-left:0;margin-right:0; height:100px !important;color:#fff;}
+
     
-
.grid_6.promo1:hover a{background-color:#fc0110;margin-left:0;margin-right:0; height:100px !important;color:#fff;}
+
.grid_6.promo1:hover, .grid_6.promo2:hover, .grid_6.promo3:hover {  
-
.grid_6.promo2{ background-color:#999;margin-left:0; margin-right:0; height:98px !important; border-top:1px solid #fc0110;border-bottom:1px solid #fc0110;color:#333;}
+
                background-color:grey; opacity: 0.4; margin-left:0;margin-right:0;
-
.grid_6.promo2:hover{background-color:#fc0110;margin-left:0;margin-right:0;height:98px !important;border-top:1px solid #fc0110;border-bottom:1px solid #fc0110; color:#fff;}
+
height:100px !important;color: #FC0110;
-
.grid_6.promo2:hover a{background-color:#fc0110;margin-left:0;margin-right:0;height:98px !important;border-top:1px solid #fc0110;border-bottom:1px solid #fc0110; color:#fff;}
+
                box-shadow: 0px 0px 1px 1px rgba(119, 119, 119, 0.6);
-
.grid_6.promo3{background-color:#999;margin-left:0;margin-right:0;height:100px !important;color:#333;}
+
                -moz-box-shadow: 0px 0px 1px 1px rgba(119, 119, 119, 0.6);
-
.grid_6.promo3:hover{background-color:#fc0110;margin-left:0;margin-right:0; height:100px !important;color:#fff;}
+
                -webkit-box-shadow: 0px 1px 1px 1px rgba(119, 119, 119, 0.6);
-
.grid_6.promo3:hover a{background-color:#fc0110;margin-left:0;margin-right:0; height:100px !important;color:#fff;}
+
                -moz-border-radius: 15px;
 +
                border-radius: 15px;
 +
}
 +
 +
                .grid_6.promo1:hover a, .grid_6.promo2:hover a, .grid_6.promo3:hover a {
 +
                    color:#fc0110;
 +
                    text-decoration: none;
 +
                }  
 +
      */
 +
 
 +
-
#contentWrap{background-color: #fff;}
+
#contentWrap{background-color: #fff; }
#breadcrumbs{height:30px;background-color:none;color:#333;font-size:12px;margin-bottom:15px;}
#breadcrumbs{height:30px;background-color:none;color:#333;font-size:12px;margin-bottom:15px;}
#breadcrumbs p{color:#333;font-size:12px;font-weight:bold;padding:6px 5px;margin-bottom:0;}
#breadcrumbs p{color:#333;font-size:12px;font-weight:bold;padding:6px 5px;margin-bottom:0;}
Line 1,253: Line 1,269:
}
}
-
#content{height:auto;background-color:none;padding:0 5px;width:740px;margin-bottom:30px;color:#333 ;}
+
#wikicontent{
 +
height:auto;
 +
background-color:none;
 +
padding:0px 5px;
 +
width:740px;
 +
margin-bottom:30px;
 +
color:#333;
 +
}
#content h1{color:#fc0110;}
#content h1{color:#fc0110;}
#content p {text-align:justify;}
#content p {text-align:justify;}
Line 1,280: Line 1,303:
#c45 .tx-sf-banners {padding: 0 5px;width: 730px;}
#c45 .tx-sf-banners {padding: 0 5px;width: 730px;}
-
.csc-textpic .csc-textpic-imagewrap img {border: medium none;display: block; height: auto; max-width: 740px;}
+
.csc-textpic .csc-textpic-imagewrap img {border: medium none;display: block; height: auto; max-width: 740px;
 +
 
 +
 +
}
#news  {
#news  {
Line 1,342: Line 1,368:
.news-text-latest a:hover{color:#333 !important;}
.news-text-latest a:hover{color:#333 !important;}
-
#sponsoren{padding:10px 0 10px 0;background-color:none;border-top:2px solid #fc0110;margin-top:20px !important;}
+
#sponsoren{padding:10px 0 10px 0;background-color:none;border-top:2px solid #fc0110;
-
#sponsoren img { color: transparent; font-size: 0; height: auto; vertical-align: middle;margin-bottom:5px;}
+
height: 200px;
-
#sponsoren h1 {font-size: 14px;margin-bottom: 10px;color:#c3c3c3;font-weight:normal;text-align:center;}
+
width:960px;
-
#sponsoren .banner {width: 12%;float: left;text-align: center;height: auto;padding: 0 10px;}
+
position: relative;
-
#sponsoren .tx-sf-banners {padding: 0 5px;width: 940px;}
+
margin-left: auto;
 +
margin-right: auto;
 +
 
 +
}
 +
 
 +
#sponsoren ul { list-style-type: none; display: inline; }
 +
#sponsoren li { display: inline; margin: 0px 20px 0 20px; }
 +
 
hr {border: 0 #c3c3c3 solid;border-top-width: 1px;clear: both;height: 0;margin-bottom:10px;}
hr {border: 0 #c3c3c3 solid;border-top-width: 1px;clear: both;height: 0;margin-bottom:10px;}
-
#footerBG{width:auto;min-height:120px;background-color:#333;border-top:12px solid #fc0110;}
+
#footerBG{
 +
  position:absolute;
 +
  bottom: -430px;
 +
  left: 0px;
 +
  width:100%;
 +
}
 +
 
 +
        #footerInner{width:100%;min-height:120px;background-color:#333;border-top:4px solid #fc0110}
 +
 
#footerWrap{background-color:none;margin-bottom:0px;height:auto;color:#c3c3c3;}
#footerWrap{background-color:none;margin-bottom:0px;height:auto;color:#c3c3c3;}
#footerWrap ul.menu {list-style:none;margin-top:8px;margin-bottom:15px;}
#footerWrap ul.menu {list-style:none;margin-top:8px;margin-bottom:15px;}
Line 1,648: Line 1,689:
}
}
-
</style>
+
.container_24{
 +
margin-left:auto;
 +
margin-right:auto;
 +
width:960px
 +
}
 +
.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13,.grid_14,.grid_15,.grid_16,.grid_17,.grid_18,.grid_19,.grid_20,.grid_21,.grid_22,.grid_23,.grid_24{
 +
display:inline;
 +
float:left;
 +
margin-left:5px;
 +
margin-right:5px
 +
}
 +
 +
.push_1,.pull_1,.push_2,.pull_2,.push_3,.pull_3,.push_4,.pull_4,.push_5,.pull_5,.push_6,.pull_6,.push_7,.pull_7,.push_8,.pull_8,.push_9,.pull_9,.push_10,.pull_10,.push_11,.pull_11,.push_12,.pull_12,.push_13,.pull_13,.push_14,.pull_14,.push_15,.pull_15,.push_16,.pull_16,.push_17,.pull_17,.push_18,.pull_18,.push_19,.pull_19,.push_20,.pull_20,.push_21,.pull_21,.push_22,.pull_22,.push_23,.pull_23{
 +
position:relative
 +
}
 +
 +
.alpha{
 +
margin-left:0
 +
}
 +
 +
.omega{
 +
margin-right:0
 +
}
 +
 +
.container_24 .grid_1{
 +
width:30px
 +
}
 +
 +
.container_24 .grid_2{
 +
width:70px
 +
}
 +
 +
.container_24 .grid_3{
 +
width:110px
 +
}
 +
 +
.container_24 .grid_4{
 +
width:150px
 +
}
 +
 +
.container_24 .grid_5{
 +
width:190px
 +
}
 +
 +
.container_24 .grid_6{
 +
width:230px
 +
}
 +
 +
.container_24 .grid_7{
 +
width:270px
 +
}
 +
 +
.container_24 .grid_8{
 +
width:310px
 +
}
 +
 +
.container_24 .grid_9{
 +
width:350px
 +
}
 +
 +
.container_24 .grid_10{
 +
width:390px
 +
}
 +
 +
.container_24 .grid_11{
 +
width:430px
 +
}
 +
 +
.container_24 .grid_12{
 +
width:470px
 +
}
 +
 +
.container_24 .grid_13{
 +
width:510px
 +
}
 +
 +
.container_24 .grid_14{
 +
width:550px
 +
}
 +
 +
.container_24 .grid_15{
 +
width:590px
 +
}
 +
 +
.container_24 .grid_16{
 +
width:630px
 +
}
 +
 +
.container_24 .grid_17{
 +
width:670px
 +
}
 +
 +
.container_24 .grid_18{
 +
width:710px
 +
}
 +
 +
.container_24 .grid_19{
 +
width:750px
 +
}
 +
 +
.container_24 .grid_20{
 +
width:790px
 +
}
 +
 +
.container_24 .grid_21{
 +
width:830px
 +
}
 +
 +
.container_24 .grid_22{
 +
width:870px
 +
}
 +
 +
.container_24 .grid_23{
 +
width:910px
 +
}
 +
 +
.container_24 .grid_24{
 +
width:950px
 +
}
 +
 +
.container_24 .prefix_1{
 +
padding-left:40px
 +
}
 +
 +
.container_24 .prefix_2{
 +
padding-left:80px
 +
}
 +
 +
.container_24 .prefix_3{
 +
padding-left:120px
 +
}
 +
 +
.container_24 .prefix_4{
 +
padding-left:160px
 +
}
 +
 +
.container_24 .prefix_5{
 +
padding-left:200px
 +
}
 +
 +
.container_24 .prefix_6{
 +
padding-left:240px
 +
}
 +
 +
.container_24 .prefix_7{
 +
padding-left:280px
 +
}
 +
 +
.container_24 .prefix_8{
 +
padding-left:320px
 +
}
 +
 +
.container_24 .prefix_9{
 +
padding-left:360px
 +
}
 +
 +
.container_24 .prefix_10{
 +
padding-left:400px
 +
}
 +
 +
.container_24 .prefix_11{
 +
padding-left:440px
 +
}
 +
 +
.container_24 .prefix_12{
 +
padding-left:480px
 +
}
 +
 +
.container_24 .prefix_13{
 +
padding-left:520px
 +
}
 +
 +
.container_24 .prefix_14{
 +
padding-left:560px
 +
}
 +
 +
.container_24 .prefix_15{
 +
padding-left:600px
 +
}
 +
 +
.container_24 .prefix_16{
 +
padding-left:640px
 +
}
 +
 +
.container_24 .prefix_17{
 +
padding-left:680px
 +
}
 +
 +
.container_24 .prefix_18{
 +
padding-left:720px
 +
}
 +
 +
.container_24 .prefix_19{
 +
padding-left:760px
 +
}
 +
 +
.container_24 .prefix_20{
 +
padding-left:800px
 +
}
 +
 +
.container_24 .prefix_21{
 +
padding-left:840px
 +
}
 +
 +
.container_24 .prefix_22{
 +
padding-left:880px
 +
}
 +
 +
.container_24 .prefix_23{
 +
padding-left:920px
 +
}
 +
 +
.container_24 .suffix_1{
 +
padding-right:40px
 +
}
 +
 +
.container_24 .suffix_2{
 +
padding-right:80px
 +
}
 +
 +
.container_24 .suffix_3{
 +
padding-right:120px
 +
}
 +
 +
.container_24 .suffix_4{
 +
padding-right:160px
 +
}
 +
 +
.container_24 .suffix_5{
 +
padding-right:200px
 +
}
 +
 +
.container_24 .suffix_6{
 +
padding-right:240px
 +
}
 +
 +
.container_24 .suffix_7{
 +
padding-right:280px
 +
}
 +
 +
.container_24 .suffix_8{
 +
padding-right:320px
 +
}
 +
 +
.container_24 .suffix_9{
 +
padding-right:360px
 +
}
 +
 +
.container_24 .suffix_10{
 +
padding-right:400px
 +
}
 +
 +
.container_24 .suffix_11{
 +
padding-right:440px
 +
}
 +
 +
.container_24 .suffix_12{
 +
padding-right:480px
 +
}
 +
 +
.container_24 .suffix_13{
 +
padding-right:520px
 +
}
 +
 +
.container_24 .suffix_14{
 +
padding-right:560px
 +
}
 +
 +
.container_24 .suffix_15{
 +
padding-right:600px
 +
}
 +
 +
.container_24 .suffix_16{
 +
padding-right:640px
 +
}
 +
 +
.container_24 .suffix_17{
 +
padding-right:680px
 +
}
 +
 +
.container_24 .suffix_18{
 +
padding-right:720px
 +
}
 +
 +
.container_24 .suffix_19{
 +
padding-right:760px
 +
}
 +
 +
.container_24 .suffix_20{
 +
padding-right:800px
 +
}
 +
 +
.container_24 .suffix_21{
 +
padding-right:840px
 +
}
 +
 +
.container_24 .suffix_22{
 +
padding-right:880px
 +
}
 +
 +
.container_24 .suffix_23{
 +
padding-right:920px
 +
}
 +
 +
.container_24 .push_1{
 +
left:40px
 +
}
 +
 +
.container_24 .push_2{
 +
left:80px
 +
}
 +
 +
.container_24 .push_3{
 +
left:120px
 +
}
 +
 +
.container_24 .push_4{
 +
left:160px
 +
}
 +
 +
.container_24 .push_5{
 +
left:200px
 +
}
 +
 +
.container_24 .push_6{
 +
left:240px
 +
}
 +
 +
.container_24 .push_7{
 +
left:280px
 +
}
 +
 +
.container_24 .push_8{
 +
left:320px
 +
}
 +
 +
.container_24 .push_9{
 +
left:360px
 +
}
 +
 +
.container_24 .push_10{
 +
left:400px
 +
}
 +
 +
.container_24 .push_11{
 +
left:440px
 +
}
 +
 +
.container_24 .push_12{
 +
left:480px
 +
}
 +
 +
.container_24 .push_13{
 +
left:520px
 +
}
 +
 +
.container_24 .push_14{
 +
left:560px
 +
}
 +
 +
.container_24 .push_15{
 +
left:600px
 +
}
 +
 +
.container_24 .push_16{
 +
left:640px
 +
}
 +
 +
.container_24 .push_17{
 +
left:680px
 +
}
 +
 +
.container_24 .push_18{
 +
left:720px
 +
}
 +
 +
.container_24 .push_19{
 +
left:760px
 +
}
 +
 +
.container_24 .push_20{
 +
left:800px
 +
}
 +
 +
.container_24 .push_21{
 +
left:840px
 +
}
 +
 +
.container_24 .push_22{
 +
left:880px
 +
}
 +
 +
.container_24 .push_23{
 +
left:920px
 +
}
 +
 +
.container_24 .pull_1{
 +
left:-40px
 +
}
 +
 +
.container_24 .pull_2{
 +
left:-80px
 +
}
 +
 +
.container_24 .pull_3{
 +
left:-120px
 +
}
 +
 +
.container_24 .pull_4{
 +
left:-160px
 +
}
 +
 +
.container_24 .pull_5{
 +
left:-200px
 +
}
 +
 +
.container_24 .pull_6{
 +
left:-240px
 +
}
 +
 +
.container_24 .pull_7{
 +
left:-280px
 +
}
 +
 +
.container_24 .pull_8{
 +
left:-320px
 +
}
 +
 +
.container_24 .pull_9{
 +
left:-360px
 +
}
 +
 +
.container_24 .pull_10{
 +
left:-400px
 +
}
 +
 +
.container_24 .pull_11{
 +
left:-440px
 +
}
 +
 +
.container_24 .pull_12{
 +
left:-480px
 +
}
 +
 +
.container_24 .pull_13{
 +
left:-520px
 +
}
 +
 +
.container_24 .pull_14{
 +
left:-560px
 +
}
 +
 +
.container_24 .pull_15{
 +
left:-600px
 +
}
 +
 +
.container_24 .pull_16{
 +
left:-640px
 +
}
 +
 +
.container_24 .pull_17{
 +
left:-680px
 +
}
 +
 +
.container_24 .pull_18{
 +
left:-720px
 +
}
 +
 +
.container_24 .pull_19{
 +
left:-760px
 +
}
 +
 +
.container_24 .pull_20{
 +
left:-800px
 +
}
 +
 +
.container_24 .pull_21{
 +
left:-840px
 +
}
 +
 +
.container_24 .pull_22{
 +
left:-880px
 +
}
 +
 +
.container_24 .pull_23{
 +
left:-920px
 +
}
 +
 +
.clear{
 +
clear:both;
 +
display:block;
 +
overflow:hidden;
 +
visibility:hidden;
 +
width:0;
 +
height:0
 +
}
 +
 +
.clearfix:before,.clearfix:after,.container_24:before,.container_24:after{
 +
content:'.';
 +
display:block;
 +
overflow:hidden;
 +
visibility:hidden;
 +
font-size:0;
 +
line-height:0;
 +
width:0;
 +
height:0
 +
}
 +
 +
.clearfix:after,.container_24:after{
 +
clear:both
 +
}
 +
 +
.clearfix,.container_24{
 +
zoom:1
 +
}
 +
 +
 +
#mmswf543e99c71a2aa {
 +
margin-left: 10%;
 +
margin-right: 10%;
 +
 +
}
 +
 +
body {
 +
font-family: Arial,sans-serif;
 +
}
 +
 +
 +
.small, .contentcenter {
 +
 +
text-align: justify;
 +
width: 650px;
 +
margin: 0 auto;
 +
margin-left: 10%;
 +
 +
}
 +
 +
.small img, .contentcenter img {
 +
  display: inline;
 +
  margin: 0 auto;
 +
}
 +
 +
.small p, .contentcenter p {
 +
font-size: 14px;
 +
color: grey;
 +
text-align: right;
 +
 +
}
 +
 +
.small {
 +
width: 400px;
 +
}
 +
 +
.verysmall {
 +
width: 200px;
 +
margin: 0 auto;
 +
margin-left: 15%;
 +
}
 +
 +
.contentright {
 +
 +
float: right;
 +
margin: 0  20px 0 40px;
 +
 +
}
 +
 +
.team {
 +
color: black;
 +
}
 +
 +
 +
 +
.team li {
 +
 +
padding-top: 25px;
 +
padding-bottom: 25px;
 +
border-top: 1px solid lightgrey;
 +
list-style: none;
 +
margin-bottom: 80px;
 +
 +
}
 +
 +
.team li img {
 +
 +
float: right;
 +
margin-top: 0px;
 +
margin-left: 30px;
 +
margin-right: -90px;
 +
}
 +
 +
 +
.team li p, .team li b {
 +
width: 650px;
 +
}
 +
 +
 +
#gallery li {
 +
list-style: none;
 +
display: inline;
 +
 +
 +
}
 +
 +
#gallery li img {
 +
width: 300px;
 +
margin: 20px 20px 20px 20px;
 +
-webkit-box-shadow: 0px 0px 4px 1px rgba(50, 50, 50, 0.72);
 +
-moz-box-shadow:    0px 0px 4px 1px rgba(50, 50, 50, 0.72);
 +
box-shadow:        0px 0px 4px 1px rgba(50, 50, 50, 0.72);
 +
}
 +
 +
#gallery li img:hover {
 +
opacity: 0.7;
 +
}
 +
 +
/* Preload images */
 +
body:after {
 +
  content: url(https://static.igem.org/mediawiki/2014/6/65/TuDarmstadtLightboxClose.png) url(https://static.igem.org/mediawiki/2014/4/47/TuDarmstadtLightboxLoading.gif) url(https://static.igem.org/mediawiki/2014/8/8a/TuDarmstadtLightboxPrev.png) url(https://static.igem.org/mediawiki/2014/a/ad/TuDarmstadtLightboxNext.png);
 +
  display: none;
 +
}
 +
 +
.lightboxOverlay {
 +
  position: absolute;
 +
  top: 0;
 +
  left: 0;
 +
  z-index: 9999;
 +
  background-color: black;
 +
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
 +
  opacity: 0.8;
 +
  display: none;
 +
}
 +
 +
.lightbox {
 +
  position: absolute;
 +
  left: 0;
 +
  width: 100%;
 +
  z-index: 10000;
 +
  text-align: center;
 +
  line-height: 0;
 +
  font-weight: normal;
 +
}
 +
 +
.lightbox .lb-image {
 +
  display: block;
 +
  height: auto;
 +
  max-width: inherit;
 +
  -webkit-border-radius: 3px;
 +
  -moz-border-radius: 3px;
 +
  -ms-border-radius: 3px;
 +
  -o-border-radius: 3px;
 +
  border-radius: 3px;
 +
}
 +
 +
.lightbox a img {
 +
  border: none;
 +
}
 +
 +
.lb-outerContainer {
 +
  position: relative;
 +
  background-color: white;
 +
  *zoom: 1;
 +
  width: 250px;
 +
  height: 250px;
 +
  margin: 0 auto;
 +
  -webkit-border-radius: 4px;
 +
  -moz-border-radius: 4px;
 +
  -ms-border-radius: 4px;
 +
  -o-border-radius: 4px;
 +
  border-radius: 4px;
 +
}
 +
 +
.lb-outerContainer:after {
 +
  content: "";
 +
  display: table;
 +
  clear: both;
 +
}
 +
 +
.lb-container {
 +
  padding: 4px;
 +
}
 +
 +
.lb-loader {
 +
  position: absolute;
 +
  top: 43%;
 +
  left: 0;
 +
  height: 25%;
 +
  width: 100%;
 +
  text-align: center;
 +
  line-height: 0;
 +
}
 +
 +
.lb-cancel {
 +
  display: block;
 +
  width: 32px;
 +
  height: 32px;
 +
  margin: 0 auto;
 +
  background: url(https://static.igem.org/mediawiki/2014/4/47/TuDarmstadtLightboxLoading.gif) no-repeat;
 +
}
 +
 +
.lb-nav {
 +
  position: absolute;
 +
  top: 0;
 +
  left: 0;
 +
  height: 100%;
 +
  width: 100%;
 +
  z-index: 10;
 +
}
 +
 +
.lb-container > .nav {
 +
  left: 0;
 +
}
 +
 +
.lb-nav a {
 +
  outline: none;
 +
  background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
 +
}
 +
 +
.lb-prev, .lb-next {
 +
  height: 100%;
 +
  cursor: pointer;
 +
  display: block;
 +
}
 +
 +
.lb-nav a.lb-prev {
 +
  width: 34%;
 +
  left: 0;
 +
  float: left;
 +
  background: url(https://static.igem.org/mediawiki/2014/8/8a/TuDarmstadtLightboxPrev.png) left 48% no-repeat;
 +
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
 +
  opacity: 0;
 +
  -webkit-transition: opacity 0.6s;
 +
  -moz-transition: opacity 0.6s;
 +
  -o-transition: opacity 0.6s;
 +
  transition: opacity 0.6s;
 +
}
 +
 +
.lb-nav a.lb-prev:hover {
 +
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
 +
  opacity: 1;
 +
}
 +
 +
.lb-nav a.lb-next {
 +
  width: 64%;
 +
  right: 0;
 +
  float: right;
 +
  background: url(https://static.igem.org/mediawiki/2014/a/ad/TuDarmstadtLightboxNext.png) right 48% no-repeat;
 +
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
 +
  opacity: 0;
 +
  -webkit-transition: opacity 0.6s;
 +
  -moz-transition: opacity 0.6s;
 +
  -o-transition: opacity 0.6s;
 +
  transition: opacity 0.6s;
 +
}
 +
 +
.lb-nav a.lb-next:hover {
 +
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
 +
  opacity: 1;
 +
}
 +
 +
.lb-dataContainer {
 +
  margin: 0 auto;
 +
  padding-top: 5px;
 +
  *zoom: 1;
 +
  width: 100%;
 +
  -moz-border-radius-bottomleft: 4px;
 +
  -webkit-border-bottom-left-radius: 4px;
 +
  border-bottom-left-radius: 4px;
 +
  -moz-border-radius-bottomright: 4px;
 +
  -webkit-border-bottom-right-radius: 4px;
 +
  border-bottom-right-radius: 4px;
 +
}
 +
 +
.lb-dataContainer:after {
 +
  content: "";
 +
  display: table;
 +
  clear: both;
 +
}
 +
 +
.lb-data {
 +
  padding: 0 4px;
 +
  color: #ccc;
 +
}
 +
 +
.lb-data .lb-details {
 +
  width: 85%;
 +
  float: left;
 +
  text-align: left;
 +
  line-height: 1.1em;
 +
}
 +
 +
.lb-data .lb-caption {
 +
  font-size: 13px;
 +
  font-weight: bold;
 +
  line-height: 1em;
 +
}
 +
 +
.lb-data .lb-number {
 +
  display: block;
 +
  clear: left;
 +
  padding-bottom: 1em;
 +
  font-size: 12px;
 +
  color: #999999;
 +
}
 +
 +
.lb-data .lb-close {
 +
  display: block;
 +
  float: right;
 +
  width: 30px;
 +
  height: 30px;
 +
  background: url(https://static.igem.org/mediawiki/2014/6/65/TuDarmstadtLightboxClose.png) top right no-repeat;
 +
  text-align: right;
 +
  outline: none;
 +
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
 +
  opacity: 0.7;
 +
  -webkit-transition: opacity 0.2s;
 +
  -moz-transition: opacity 0.2s;
 +
  -o-transition: opacity 0.2s;
 +
  transition: opacity 0.2s;
 +
}
 +
 +
.lb-data .lb-close:hover {
 +
  cursor: pointer;
 +
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
 +
  opacity: 1;
 +
}
 +
 +
 +
@import url(http://fonts.googleapis.com/css?family=Varela+Round);
 +
 +
.slides {
 +
    padding: 0;
 +
    width: 609px;
 +
    height: 420px;
 +
    display: block;
 +
    margin: 0 auto;
 +
    position: relative;
 +
}
 +
 +
.slides * {
 +
    user-select: none;
 +
    -ms-user-select: none;
 +
    -moz-user-select: none;
 +
    -khtml-user-select: none;
 +
    -webkit-user-select: none;
 +
    -webkit-touch-callout: none;
 +
}
 +
 +
.slides input { display: none; }
 +
 +
.slide-container { display: block; }
 +
 +
.slide {
 +
    top: 0;
 +
    left: 0;
 +
    opacity: 0;
 +
 +
    display: block;
 +
    position: absolute;
 +
 +
    transform: scale(0);
 +
 +
    transition: all .7s ease-in-out;
 +
}
 +
 +
 +
.nav label {
 +
 
 +
    height: 100%;
 +
    display: none;
 +
    position: absolute;
 +
 +
  opacity: 0;
 +
    z-index: 9;
 +
    cursor: pointer;
 +
 +
    transition: opacity .2s;
 +
 +
    color: #FFF;
 +
    font-size: 156pt;
 +
    text-align: center;
 +
    line-height: 380px;
 +
    font-family: "Varela Round", sans-serif;
 +
    background-color: rgba(255, 255, 255, .3);
 +
    text-shadow: 0px 0px 15px rgb(119, 119, 119);
 +
}
 +
 +
.slide:hover + .nav label { opacity: 0.5; }
 +
 +
.nav label:hover { opacity: 1; }
 +
 +
.nav .next { right: 0; }
 +
.nav .prev { left: 0; }
 +
 +
input:checked + .slide-container  .slide {
 +
    opacity: 1;
 +
 +
    transform: scale(1);
 +
 +
    transition: opacity 1s ease-in-out;
 +
}
 +
 +
input:checked + .slide-container .nav label { display: block; }
 +
 +
.nav-dots {
 +
width: 100%;
 +
bottom: 9px;
 +
height: 11px;
 +
display: block;
 +
position: absolute;
 +
text-align: center;
 +
}
 +
 +
.nav-dots .nav-dot {
 +
top: -5px;
 +
width: 11px;
 +
height: 11px;
 +
margin: 0 4px;
 +
position: relative;
 +
border-radius: 100%;
 +
display: inline-block;
 +
background-color: rgba(0, 0, 0, 0.6);
 +
}
 +
 +
.nav-dots .nav-dot:hover {
 +
cursor: pointer;
 +
background-color: rgba(0, 0, 0, 0.8);
 +
}
 +
 +
input#img-1:checked ~ .nav-dots label#img-dot-1,
 +
input#img-2:checked ~ .nav-dots label#img-dot-2,
 +
input#img-3:checked ~ .nav-dots label#img-dot-3,
 +
input#img-4:checked ~ .nav-dots label#img-dot-4,
 +
input#img-5:checked ~ .nav-dots label#img-dot-5,
 +
input#img-6:checked ~ .nav-dots label#img-dot-6 {
 +
background: rgba(0, 0, 0, 0.8);
 +
}
 +
 +
.slides{
 +
width: 100%;
 +
height:300px;background-color:#333;overflow: hidden;position: relative;margin-left: 5px;border:none;border-radius: 0;
 +
box-shadow: 0px 0px 6px 1px rgba(119, 119, 119, 0.6);
 +
-moz-box-shadow: 0px 0px 6px 1px rgba(119, 119, 119, 0.6);
 +
-webkit-box-shadow: 0px 0px 6px 1px rgba(119, 119, 119, 0.6);
 +
-moz-border-radius: 15px;
 +
border-radius: 15px;
 +
margin-top: 3px;
 +
}
 +
 +
 +
.specialsmall {
 +
  margin-left: 35%;
 +
  margin-right: 35%;
 +
}
 +
 +
div.code {
 +
border-top: 1px solid #22272c;
 +
border-left: 1px solid #22272c;
 +
width: 100%;
 +
background: rgba(20,23,26,0.6);
 +
 +
-webkit-box-shadow: 10px 10px 13px 1px rgba(0,0,0,0.75);
 +
-moz-box-shadow: 10px 10px 13px 1px rgba(0,0,0,0.75);
 +
box-shadow: 10px 10px 13px 1px rgba(0,0,0,0.75);
 +
 +
margin: 0 auto;
 +
margin-top: 30px;
 +
margin-bottom: 30px;
 +
 +
 +
}
 +
 +
 +
.code blockquote {
 +
 +
font-family: "Lucida Console,Monaco,monospace";
 +
 +
width: 100%;
 +
color: #a9bacb;
 +
 +
margin: 0 70px 0 70px;
 +
opacity: 1;
 +
padding: 20px 0 20px 0 ;
 +
 +
 +
 +
}
 +
 +
.code blockquote p {
 +
width: 100%;
 +
font-size: 18px;
 +
margin-left: -40px;
 +
}
 +
 +
</style>
</html>
</html>

Latest revision as of 02:50, 18 October 2014

Retrieved from "http://2014.igem.org/Team:TU_Darmstadt/Template/CSS"