Team:LMU-Munich/iGEM.css

From 2014.igem.org

Revision as of 01:41, 18 October 2014 by Hoerldavid (Talk | contribs)
  1. top-section {
   //display:none;

} li {

   margin:0px;

}

.firstHeading { display: none; }

  1. headerWrapper a,
  2. headerWrapper a:hover,
  3. headerWrapper a:visited,
  4. headerWrapper a:active {
   text-decoration:none;
   color:white;

}

body{

   /*background-color:#D8D8D8;*/
   background-color:oldlace;
   margin-left:0px;

}

  1. headerWrapper {
   position:fixed;
   top:0px;
   height: 105px;
   width:100%;
   background-color:#003366;
   background-color: rgba(0, 51, 102, 0.95);
   z-index:30;

}

  1. sub-navigation-wrapper {
   clear:both;
   position:relative;
   background-color:#990000;
   background-color: rgba(153, 0, 0, 0.95);
   width:100%;
   height: 26px;
   padding-top: 5px;
   -webkit-box-shadow: 0px 7px 5px -3px rgba(50, 50, 50, 0.75);
   -moz-box-shadow:    0px 7px 5px -3px rgba(50, 50, 50, 0.75);
   box-shadow:         0px 7px 5px -3px rgba(50, 50, 50, 0.75);

}


  1. header {
   width:950px;
   margin: auto;

}

  1. global-wrapper {
   padding-top: 100px;
   width: 960px;
   text-align: left;
   margin-left: auto;
   margin-right: auto;

}

  1. wiki-navigation {
   font-size: 8pt;
   padding-bottom: 10px;

}

  1. logo img {
   width: 100px;
   float: left;
   padding-top: 7px;

}

  1. navigation {
   float: right;
   font-family: Verdana, Geneva, sans-serif;
   font-size: 0.85em;

}

  1. sub-navigation {
   width:960px;
   text-align: right;
   font-family: Verdana, Geneva, sans-serif;
   font-size: 0.7em;
   margin:auto;

}

  1. sub-navigation ul {
   display: inline;
   float:right;

}

  1. sub-navigation li:before{
   content:"•";
   padding-right:10px;
   color:white;

}

  1. sub-navigation li li:before{
   content:" ";
   padding-right:5px;
   color:white;

}

  1. sub-navigation li:first-child:before{
   content:"";

}

  1. sub-navigation li li:first-child:before{
   content:" ";

}

  1. sub-navigation li.active-item > a{
   font-weight: bold;
   border-top:2px solid;

}

/*#sub-navigation ul ul {

   display: none;

}*/

  1. sub-navigation li.current ul {
   display: inline;

}

  1. sub-navigation ul ul {
   color:white;
   padding-left:0px;

}

  1. sub-navigation li {
   display: inline;
   float: left;
   padding-left: 10px;

}

  1. sub-navigation li li{
   display: inline;
   float: left;
   padding-left: 5px;
   font-style: italic;

}

  1. navigation ul li {
   display: inline;
   float:left;

}


  1. body {
   clear:both;
   padding-top: 20px;

}

  1. content-area {
   text-align: justify;
   padding-left:120px;

}

p img {

   float:left;
   padding-right:20px;

}

  1. scroll-spy li.sub-heading {
   margin-left:20px;

}

  1. scroll-spy li.active {
   color:red;

}


.nav-item {

   display: block;
   background-size: 32px;
   float: left;
   /*width:80px;*/
   background-position: center 15px ;
   background-repeat: no-repeat;
   line-height: 40px;
   text-align:center;
   padding-top: 40px;
   padding-right:10px;
   padding-left:10px;
   text-transform: uppercase;

} .tour-toggle {

   background-image: url(LMU14_team_white.png);

}

.team {

   background-image: url(LMU14_team_white.png);

}

.project {

   background-image: url(LMU14_project_white.png);

}

.results {

   background-image: url(LMU14_flask_white.png);
   background-position: center 3px;

}

.safety {

   background-image: url(LMU14_application_white.png);

}

.outreach {

   background-image: url(LMU14_Outreach_white.png);

}

.labbook {

   background-image: url(LMU14_labbook_white.png);

}

a:hover{

   background-color:#990000;
   background-color: rgba(153, 0, 0, 0.95);

}

a.active{

   background-color:#990000;
   background-color: rgba(153, 0, 0, 0.95);

}

  1. lmu-content a:hover {
   text-decoration: none;
   background-color: inherit;
   border-bottom: 1px dashed navy;

}

.project-tile a:hover {

   border:0;

}

  1. lmu-content a,
  2. lmu-content a:visited,
  3. lmu-content a:active,
  4. lmu-content a:hover {
   text-decoration: none;
   color: navy;

}

/*a:hover{

   color:white;

}*/

ul {

   margin:0px;

}

p{

   font-size: 1.2em;

}

  1. sub-navigation > ul {
   display:none;

}

div.thumb{

   border-color:  rgba(255, 255, 255, 0);

}

.accordion{

   width: 100%;
   margin: 10px auto 30px auto;

}

.accordion label{

   font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
   padding: 5px 20px;
   position: relative;
   z-index: 20;
   display: block;
   cursor: pointer;
   color: #003366;
   line-height: 33px;
   font-size: 19px;
   font-weight: 500;
   -webkit-transition: 0.5s, -webkit-transform 0.5s;
   transition: 0.5s, transform 0.5s;

}

.bg-color-2 .accordion label {

   background-color: #D5CDBC;
   background-color: #D5CDBC;

} .accordion label {

   background-color: #E8E0D2;

}

.accordion label:hover{

   background: #fff;

}

.accordion input:checked + label, .accordion input:checked + label:hover{

   background: #CFEAFF;
   color: #003366;

}

.accordion input:enabled + label:after{

   content: ;
   position: absolute;
   width: 24px;
   height: 24px;
   right: 13px;
   top: 7px;
   background: transparent url(LMU14_arrow_down.png) no-repeat center center;

}

.accordion input{

   display: none;

}

.accordion article{

   background: rgba(255, 255, 255, 0.5);
   margin-top: -1px;
   overflow: hidden;
   height: 0px;
   position: relative;
   z-index: 10;
   transition:
   height 0.3s ease-in-out,
   box-shadow 0.6s linear;

} .accordion input:checked ~ article{

   transition:
   height 0.5s ease-in-out,

}

.accordion input:checked ~ article.ac-small{

   height: auto;
   padding-top: 5px;
   padding-left: 15px;
   padding-right: 15px;
   padding-bottom: 10px;
   text-align: justify;

} .accordion input:checked ~ article.ac-medium{

   height: 180px;

} .accordion input:checked ~ article.ac-large{

   height: 230px;

}

.accordion input:checked + label:after{

   background-image: url(LMU14_arrow_up.png);

}

section > div{

   width: 960px;
   text-align: left;
   margin-left: auto;
   margin-right: auto;
   padding-bottom: 20px;
   padding-top: 20px;

}

.accordion article p {

   font-size: 1em;

}

.accordion article, section p {

   text-align: justify;
   font-size: 1.2em;
   line-height:1.5em;

}

  1. lmu-content > section {
   padding-bottom:20px;

}

  1. lmu-content > section > section > div > img {
   padding-bottom: 30px;

} /*

  1. sensing {
   background-color:lightgrey;

}

  1. killing {
   background-color:LightCoral;

}

  1. adhesion {
   background-color:LightSeaGreen ;

}*/

  1. lmu-content > p,
  2. lmu-content > h1,
  3. lmu-content > h2,
  4. lmu-content > h3,
  5. lmu-content > ul,
  6. lmu-content > dl,
  7. lmu-content > table{
   width:960px;
   margin-left:auto;
   margin-right:auto;

}

p {

   text-align:justify;

}

  1. lmu-content {
   margin-top: 105px;

}

  1. lmu-content .full-width {
   width: 100%;

}

.teaser-img {

   background-repeat:no-repeat;
   background-size:cover;
   background-position: center center; 
   height:400px;
   height:50vh;
   background-attachment:fixed;

}

  1. project-problem-teaser {
   background-image:url(http://s17531757.onlinehome-server.info/iGEM/img/project-problem.jpg);

}

  1. project-biobrickbox-teaser {
   background-image:url(http://s17531757.onlinehome-server.info/iGEM/img/project-biobrickbox.jpg);

}

  1. project-modeling-teaser {
   background-image:url(http://s17531757.onlinehome-server.info/iGEM/img/project-modeling.jpg);

}

  1. project-bacillus-subtilis-teaser {
   background-image:url(http://s17531757.onlinehome-server.info/iGEM/img/project-bacillus-subtilis.jpg);

}

  1. project-bakillus-teaser {
   background-image:url(http://s17531757.onlinehome-server.info/iGEM/img/project-bakillus.jpg);

}

  1. results-teaser {
   background-image:url(http://s17531757.onlinehome-server.info/iGEM/img/results.jpg);
   /*ugly fixed image behaviour */
   background-position: center 80%;
   background-attachment: inherit;

}

  1. lmu-content .text-width,
  2. lmu-content div.center{
   width:960px;
   margin-left:auto;
   margin-right:auto;
   padding-right:0px;
   padding-left:0px;
   padding-top: 30px;
   padding-bottom: 30px;
   float:none;

}

  1. lmu-content .chart-width{
   width:560px;
   margin-left:auto;
   margin-right:auto;
   padding-right:0px;
   padding-left:0px;

}

/*.jumptarget:before {

 content:"";
 display:block;
 height:105px;
 margin:-105px 0 0;

}*/ /* .jumptarget:before {

   content: ;
   display: block;
   position: relative;
   width: 0;
   height: 70px;
   margin-top:0px;

}

  • /

.project-tile {

 background-repeat:no-repeat;
 background-size:cover;
 background-position: center center;
 opacity: 1;
 -webkit-transition: 0.5s, -webkit-transform 0.5s;
 transition: 0.5s, transform 0.5s;
 -webkit-filter: grayscale(70%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
 -moz-filter: grayscale(70%);
 -o-filter: grayscale(70%);
 filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
 filter: gray; /* IE6-9 */

}

.project-tile:hover{

 -webkit-filter: grayscale(0%);
 -moz-filter: grayscale(0%);
 -o-filter: grayscale(0%);
 filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");

}

  1. project-problem {
 background-image:url(http://s17531757.onlinehome-server.info/iGEM/img/project-problem.jpg);
 height:400px;

}

  1. project-biobrickbox {
 background-image:url(http://s17531757.onlinehome-server.info/iGEM/img/project-biobrickbox.jpg);
 height:400px;

}

  1. project-modeling {
 background-image:url(http://s17531757.onlinehome-server.info/iGEM/img/project-modeling.jpg);
 height:400px;

}

  1. project-bacillus-subtilis {
 background-image:url(http://s17531757.onlinehome-server.info/iGEM/img/project-bacillus-subtilis.jpg);
 height:400px;

}

  1. project-bakillus-lg {
 background-image:url(http://s17531757.onlinehome-server.info/iGEM/img/project-bakillus.jpg);
 height:800px;

}

  1. project-bakillus-m {
 background-image:url(http://s17531757.onlinehome-server.info/iGEM/img/project-bakillus.jpg);
 height:400px;

}

  1. project-bakillus-xs {
 background-image:url(http://s17531757.onlinehome-server.info/iGEM/img/project-bakillus.jpg);
 height:400px;

}

  1. application-pretest {
   height:400px;
   background-image:url(LMU14_application_pretest.jpg);

}

  1. application-financing {
   height:400px;
   background-image:url(LMU14_application_financing.jpg);

}

  1. application-legal {
   height:400px;
   background-image:url(LMU14_application_property.jpg);

}

  1. application-diagnosis {
   height:800px;
   background-image:url(LMU14_application_diagnosis.jpg);

}

  1. application-diagnosis-m,
  2. application-diagnosis-s {
   height:400px;
   background-image:url(LMU14_application_diagnosis.jpg);

}

  1. application-expertise {
   height:400px;
   background-image:url(LMU14_application_expertise.jpg);

}

  1. hp-meetups {
   height:400px;
   background-image:url(LMU14_hp_meetups.jpg);

}

  1. hp-rathenau-xs,
  2. hp-rathenau-m {
   height:400px;
   /*background!*/

}

  1. hp-rathenau-lg {
   height:800px;

}

  1. hp-school {
   height: 400px;
   background-image:url(LMU14_hp_igemschool.jpg);

}

  1. hp-synbioday {
   height:400px;
   background-image:url(LMU14_hp_synbioday.jpg);

}

  1. hp-discussion {
   height:400px;
   background-image:url(LMU14_hp_paneldiscussion.jpg);

}

h3 {

   font-weight:bold;
   padding-top: 30px;

}

/*#lmu-content p img {

   display:block;
   float:none;

}

.image {

   display:block;
   float:none;

}*/

  1. groupparts {
   width:960px;
   margin-left: auto;
   margin-right:auto;

}

.team-left, .team-right {

   height:100%;
   position:relative;
   margin:0px;

}

.team-data {

   height:100%;
   background-repeat:no-repeat;
   background-size:100% auto;
   position:absolute;
   top:0;
   bottom:0;
   padding:0px;

}

.team-right .team-data {

   left:0;
   background-image:url(http://s17531757.onlinehome-server.info/iGEM/img/team/Team_Schatten_left2.png);

}

.team-left .team-data {

   right:0;
   background-image:url(http://s17531757.onlinehome-server.info/iGEM/img/team/Team_Schatten_right.png);

}

.team-img {

   padding:0px;

}

.team-img img {

   width:100%;

}

  1. team-img-complete {
   background-image:url(http://s17531757.onlinehome-server.info/iGEM/img/team/Team.jpg);

}

  1. team-img-complete img{
   width:100%;

}

/*

  1. mobile-navigation {

display:none; }

.slicknav_menu {

   display:none;

}

@media screen and (max-width: 991px) { .slicknav_menu { display:block; } }*/

.no-float {

   float:none;

}

.bakillus-overview-img {

   margin-top: 50px;
   margin-bottom:20px;

}

.bg-color-2 {

   background-color: #E8E0D2;

} .bg-color-3 {

   background-color: #D5CDBC;

}

.accordion > div {

   padding-bottom: 5px;
   padding-top: 5px;

}

.sponsor {

   padding-top: 7px;
   padding-bottom: 8px;

}

.bacillus {

   font-style: italic;

}

.project-tile a span {

   background-color: rgba(224,224,224,0.8);  padding: 20px;  font-size: 2em;  border: 3px solid #003366;

}

.project-tile a {

   width: 100%;  height: 100%;  display: table-cell;  text-align: center;  vertical-align: middle;

} .project-tile div {

   width: 100%;  height: 100%;  display: table;

}

@media (max-width: 991px) { .team-data {

   position:relative;
   height: 550px;

} }

.invisible-team {

   display:none !important;

}


  1. footer

{ background-color: #555; text-align: center; //height: 200px; }

  1. footer-content

{ padding: 20px; color: snow; }

  1. footer-content h2, #footer-content h3 {

border:0; padding:0; margin:0;

}

  1. footer-logos a img{

height: 80px; margin: 10px; }

  1. footer-logos a{

background-color: inherit; } .timeline-item-left {

    display:block;
    margin-right:20%;
    width:80%;
    height:100px;

}

.timeline-item-right {

    display:block;
    margin-left:20%;
    width:80%;
    height:100px;

}

.timeline-item-right .icon {

    float:right;
    width:12%;
    height:100%;
    padding:10px

}

.timeline-item-right .date {

    float:right;
    width:12%;
    height:100%;
    padding:10px

}

.timeline-item-right .text {

    float:right;
    width:76%;
    height:100%;
    padding:10px

}

.timeline-item-left .icon {

    float:left;
    width:12%;
    height:100%;
    padding:10px

}

.timeline-item-left .date {

    float:left;
    width:12%;
    height:100%;
    padding:10px

}

.timeline-item-left .text {

    float:left;
    width:76%;
    height:100%;
    padding:10px

}