Team:TU Delft/stylesheet

blockquote { border: none; margin: 1.5em 10px; padding: 0.5em 10px; quotes: "\201C""\201D""\2018""\2019"; } blockquote:before, blockquote:after { color: #ccc; font-size: 4em; line-height: 0.1em; margin-right: 0.25em; } blockquote:before { content: open-quote; vertical-align: -0.4em; } blockquote:after { content: close-quote; vertical-align: -0.6em; }

.carousel-inner > .item > img,

 .carousel-inner > .item > a > img {
     width: 100%;
     height: 100%;
 }

.slider-size { height: 400px; }

.carousel { width:100%; margin:0 auto; }

body {

 padding-bottom: 40px;
text-align: center;

}

.marketing .col-lg-4 {

 margin-bottom: 20px;
 text-align: center;

}

.marketing h2 {

 font-weight: normal;

} .marketing .col-lg-4 p {

 margin-right: 0 auto;
 margin-left: 0 auto;

}


.featurette-divider {

 margin: 80px 0; 

}

.featurette-heading {

 font-weight: 300;
 line-height: 1;
 letter-spacing: -1px;

}

.container{

 max-width: 975px;

}

p {

  text-align: justify;

}

.jumbotron p {

  max-width:955px;
 margin: 0 auto;
 text-align: center;

}

div#white .jumbotron { background-color:white; }

div#grey { background-color: #eee; width:100%; padding-bottom:20px; } div#white { background-color:white; width:100%; padding-bottom:20px; }

  • after, *:before, * {
 -webkit-box-sizing: border-box;
 -moz-box-sizing: border-box;
 box-sizing: border-box;

}


.media {

 display: inline-block;
 position: relative;
 /*vertical-align: top;*/
 margin-right: 0.5em;

}

.media__image {

display: block;   
width:430px;
height:320px 

}

.media__image_advisors { display: block; width=209px; height=314px; }

.media__body {

 background: rgba(41, 128, 185, 0.7);
 bottom: 0;
 color: white;
 font-size: 1em;
 left: 0;
 opacity: 0;
 overflow: hidden;
 padding: 3.75em 3em;
 position: absolute;
 text-align: center;
 top: 0;
 right: 0;
 -webkit-transition: 0.6s;
 transition: 0.6s;

}

.media__body:hover { opacity: 1; }

.media__body:after, .media__body:before {

 border: 1px solid rgba(255, 255, 255, 0.7);
 bottom: 1em;
 content: ;
 left: 1em;
 opacity: 0;
 position: absolute;
 right: 1em;
 top: 1em;
 -webkit-transform: scale(1.5);
 -ms-transform: scale(1.5);
 transform: scale(1.5);
 -webkit-transition: 0.6s 0.2s;
 transition: 0.6s 0.2s;

}

.media__body:before {

 border-bottom: none;
 border-top: none;
 left: 2em;
 right: 2em;

}

.media__body:after {

 border-left: none;
 border-right: none;
 bottom: 2em;
 top: 2em;

}

.media__body:hover:after, .media__body:hover:before {

 -webkit-transform: scale(1);
 -ms-transform: scale(1);
 transform: scale(1);
 opacity: 1;

}

.media__body h2 { margin-top: -1.3em; }

.media__body p { margin-bottom: 1.5em; }

.media:nth-child(2) .media__body { background: rgba(146, 41, 185, 0.7); }

.media:nth-child(3) .media__body { background: rgba(18, 41, 128, 0.7); }

.media:nth-child(4) .media__body { background: rgba(42, 50, 41, 0.7); }

.media:nth-child(5) .media__body { background: rgba(185, 146, 41, 0.7); }

.media:nth-child(6) .media__body { background: rgba(128, 185, 41, 0.7); }

.media:nth-child(7) .media__body { background: rgba(146, 41, 185, 0.7); }

.media:nth-child(8) .media__body { background: rgba(185, 41, 128, 0.7); }

.media:nth-child(9) .media__body { background: rgba(42, 50, 41, 0.7); }

.panel-default .panel-heading a{ text-decoration: none; display:block; padding:10px; } .panel-heading.panel-title{ text-decoration: none; padding-top:0px; padding-bottom:0px; padding-left:0px; padding-right:0px; } a[aria-expanded="true"] { background-color:rgba(70, 73, 76, 0.95); text-decoration: none; color:white; }

.panel-default .panel-heading a[aria-expanded="false"]{ -o-transition: background-color 1s linear; -moz-transition: background-color 1s linear; -khtml-transition: background-color 1s linear; -webkit-transition: background-color 1s linear; -ms-transition: background-color 1s linear; transition: background-color 1s linear; } .panel-default .panel-heading a[aria-expanded="false"]:hover{ background-color:rgba(70, 73, 76, 0.95); text-decoration: none; color:white; } .panel-default .panel-heading a[aria-expanded="true"]{ -o-transition: opacity 1s linear; -moz-transition: opacity 1s linear; -khtml-transition: opacity 1s linear; -webkit-transition: opacity 1s linear; -ms-transition: opacity 1s linear; transition: opacity 1s linear; } .panel-default .panel-heading a[aria-expanded="true"]:hover{ opacity:0.7; }

.bgteam {

 background: url('https://static.igem.org/mediawiki/2015/c/c0/TU_Delft_Team2.JPG') no-repeat center center;

background-size:cover;

 position: fixed;
 width: 100%;
 height: 550px;
 /*same height as jumbotron */  
 top: 0;
 left: 0;
 z-index: -1;

}

.bginterlab {

 background: url('http://www.utahpeoplespost.com/wp-content/uploads/2014/05/DNA.jpg') no-repeat center center;

background-size:cover;

 position: fixed;
 width: 100%;
 height: 550px;
 /*same height as jumbotron */  
 top: 0;
 left: 0;
 z-index: -1;

}

.bgpractices {

 background: url('https://static.igem.org/mediawiki/2015/0/05/Wallpaper-nature-autumn-rain-widescreen-2.jpg') no-repeat center center;

background-size:cover;

 position: fixed;
 width: 100%;
 height: 550px;
 /*same height as jumbotron */  
 top: 0;
 left: 0;
 z-index: -1;

} .img{ margin-bottom:20px; }

.bghardware {

 background: url('http://i.imgur.com/tq0vcWy.jpg') no-repeat center center;

background-size:cover;

 position: fixed;
 width: 100%;
 height: 550px;
 /*same height as jumbotron */  
 top: 0;
 left: 0;
 z-index: -1;

}

.bgnotebook {

 background: url('http://orig04.deviantart.net/2fb2/f/2010/194/6/5/notebook_spiral_by_isaacphotography.jpg') no-repeat center center;

background-size:cover;

 position: fixed;
 width: 100%;
 height: 550px;
 /*same height as jumbotron */  
 top: 0;
 left: 0;
 z-index: -1;

}

.bgparts {

 background: url('http://wallpapershdin.com/walls/abstract-black-blocks-shapes-monochrome-modern-wide.jpg') no-repeat center center;

background-size:cover;

 position: fixed;
 width: 100%;
 height: 550px;
 /*same height as jumbotron */  
 top: 0;
 left: 0;
 z-index: -1;

}

.bgproject {

 background: url('http://wallpapershdin.com/walls/3d-view-wide.jpg') no-repeat center center;

background-size:cover;

 position: fixed;
 width: 100%;
 height: 550px;
 /*same height as jumbotron */  
 top: 0;
 left: 0;
 z-index: -1;

}

.bgcollaborations {

 background: url('http://biovisualfocus.com/member/wp-content/uploads/2010/07/Synapse1.jpg') no-repeat center center;

background-size:cover;

 position: fixed;
 width: 100%;
 height: 550px;
 /*same height as jumbotron */  
 top: 0;
 left: 0;
 z-index: -1;

}

.bgmodeling{

 background: url('http://i.ytimg.com/vi/_cCleK-kDqc/maxresdefault.jpg') no-repeat center center;

background-size:cover;

 position: fixed;
 width: 100%;
 height: 550px;
 /*same height as jumbotron */  
 top: 0;
 left: 0;
 z-index: -1;

}

.jumbotron#cover {

 height: 550px;
 color: white;

color:rgba(255, 255, 255, 0.8);

 text-shadow: #44 0 0.7px 0.7px;
 background: transparent;

} .jumbotron#cover h1{ border-bottom:0px; } .container p.lead{font-size:19px;} .jumbotron .container p.lead{font-size:21px;}

.modal-content{ z-index:9999; width: 902px; background-color:transparent;} .modal-header{padding:0px;border-bottom:0px solid #e5e5e5} .modal-body{padding:0px} .modal.fade .modal-dialog {width:902px;}

@media (max-width:768px){ .modal-dialog{width:600px;margin:30px auto} .modal.fade .modal-dialog {width:600px;} .modal-content{width:600px;-webkit-box-shadow:0 5px 15px rgba(0,0,0,.5);box-shadow:0 5px 15px rgba(0,0,0,.5) }