Team:Heidelberg/css/overrides

From 2014.igem.org

(Difference between revisions)
Line 169: Line 169:
}
}
 +
.red-text {
 +
  color: #ad342a;
 +
}
 +
.grey-text {
 +
  color: #e0e0e0;
 +
}
.main {
.main {

Revision as of 17:36, 30 September 2014

/* NavBar */ /* Show text underneath img */ nav li a img { display:block; margin: 0 auto; height: 40px; } nav li a { text-align: center; }

/* Disable color change on hover */

.nav > li > a:hover, .nav > li > a:focus{ background-color: transparent; }

  1. navbar{

margin-bottom: 0; }

/* Change Text color dependent on background */

.navbar-red li a { color: #ad342a; }

.navbar-white li a { color: white; }

.navbar-red .title-wrapper { color: #ad342a; }

.navbar-white .title-wrapper { color: white; }

/*

  1. navbar .container {

border-bottom: solid 5px #ce432e; }

  • /

/* Align Title Baseline to start of container */

.title-wrapper{ height:30px; overflow-y:hidden; }

.title { font-size: 30px; line-height: 30px; font-weight:bold; }

.special-span{ display:inline-block; height: 30px; }

@media (min-width: 768px) { .title-wrapper{ height:60px; }

.title { font-size: 60px; line-height: 60px; }

.special-span{ display:inline-block; height: 60px; } }

@media (min-width: 992px) { .title-wrapper{ height:70px; }

.title { font-size: 70px; line-height: 70px; }

.special-span{ display:inline-block; height: 70px; }

} @media (min-width: 1200px) { .title-wrapper{ height:80px; }

.title { font-size: 80px; line-height: 80px; }

.special-span{ display:inline-block; height: 80px; } }


/* Spread list elements equaly over width of ul*/ .navbar-nav > li { width: 12.5%; }

/* only use 85% of the total width, leaving space for logo */ .navbar-nav { width: 85%; }

.navbar-header img { height: 70px; } /* Display collapse button */ .navbar-toggle { padding: 30px 10px; }

.navbar-toggle .icon-bar { background-color: #ad342a; }

/* Center Dropdowns */ .centerDropdown {

   left: auto !important;
   right: -25% !important;

} .centerDropdown::after {

  left: auto !important;
  right: 45% !important;

}

/* Display Navigation Dropdown on hover */

@media (min-width: 768px) { .dropdown:hover .dropdown-menu { display: block; } }

.dark-grey {

 background-color: #515151;

}

.grey {

 background-color: #e0e0e0;

}

.red {

 background-color: #ad342a;
 background-image: url(/wiki/images/8/85/Heidelberg_Firering_half.png);
 background-position-x: 90%;
 background-position-y: 100%;
 background-size: auto 300px;
 background-repeat: no-repeat;
 color: white;

}

.red-text {

  color: #ad342a;

}

.grey-text {

  color: #e0e0e0;

}

.main { margin-top: -2px; }

/* Change highlighting color of thumbnails */ a.thumbnail:hover, a.thumbnail:focus, a.thumbnail.active { border-color: #ad342a; }

/* remove overrides above, so img is next to text in collapsed view */ @media (max-width: 768px) { nav li a { text-align: left !important; } nav li span { display: inline-block; width: 60px; text-align: center; } nav li img { display:inline !important; margin: 0 !important; padding-right: 5px !important; } .navbar-nav > li { width: auto !important; } .navbar-nav { width: 100%; } }

.hashtags{ margin-bottom: -5px; } .hashtags a.label-default { background-color: #515151; border-radius: 0; font-weight: normal; margin-bottom: 5px; display: inline-block; }

.hashtags a.label-default:hover { background-color: #ad342a; }

.pageicon { position:absolute; top: -50%; }

/* Hide Edit and Table of contents generated by Mediawiki */

  1. toc {

display:none; }

.editsection { display:none; }

.abstract { margin-bottom: 0; background-color: #e0e0e0; }

.underline { border-bottom: 1px solid #515151; padding-bottom: 3px; }

/* vertical alignment styles */ .col-top {

   vertical-align:top;

} .col-middle {

   vertical-align:middle;

} .col-bottom {

   vertical-align:bottom;

}

/* fix firefox responsive images */ .img-responsive {

   width: 100%

}

/* columns of same height styles */ .container-xs-height {

   display:table;
   padding-left:0px;
   padding-right:0px;

} .row-xs-height {

   display:table-row;

} .col-xs-height {

   display:table-cell;
   float:none;

} @media (min-width: 768px) {

   .container-sm-height {
       display:table;
       padding-left:0px;
       padding-right:0px;
   }
   .row-sm-height {
       display:table-row;
   }
   .col-sm-height {
       display:table-cell;
       float:none;
   }

} @media (min-width: 992px) {

   .container-md-height {
       display:table;
       padding-left:0px;
       padding-right:0px;
   }
   .row-md-height {
       display:table-row;
   }
   .col-md-height {
       display:table-cell;
       float:none;
   }

} @media (min-width: 1200px) {

   .container-lg-height {
       display:table;
       padding-left:0px;
       padding-right:0px;
   }
   .row-lg-height {
       display:table-row;
   }
   .col-lg-height {
       display:table-cell;
       float:none;
   }

}