Template:BOKU-Vienna/CSS/Main

@font-face {

   font-family: 'Merriweather Sans', sans-serif;
 src: URL('2018.igem.org/wiki/images/7/74/T--BOKU-Vienna--Wiki-MerriweatherSans-Regular.ttf') format('ttf');

font-weight: normal; }

1. HQ_page * {

   font-family: 'Merriweather Sans', sans-serif !important;

}

1. content {

  width: 100%;
  margin: 0;
  padding: 0;

}

1. top_title {

display: none; }

1. HQ_page, #HQ_page p {

font-size: 18px;

  line-height: 1.5em;

}

1. bodyContent {

margin: -1em 0; } .navigation {

 font-size: 18px; }
 .navigation .navbar {
   position: absolute;
   padding: 0 2em;
   top: 2em;
   left: 0;
   width: 100%; 
   z-index: 1;

} .navbar-brand { height: 100%; } .navbar-brand img{ height: 100%; width: auto; max-height: 50px; }

   .navigation .navbar .navbar-toggler {
     color: #fff7d6; }
     .navigation .navbar .navbar-toggler:active, .navigation .navbar .navbar-toggler:hover, .navigation .navbar .navbar-toggler:focus {
       color: #ffd93d; }
   .navigation .navbar .navbar-nav {
     justify-content: space-around;
     width: 100%; }
     .navigation .navbar .navbar-nav .nav-item a {
       color: #fff7d6; }
       .navigation .navbar .navbar-nav .nav-item a:hover, .navigation .navbar .navbar-nav .nav-item a:active {
         color: #ffd93d; }
     .navigation .navbar .navbar-nav .dropdown-menu a {
       color: #141414; }
       .navigation .navbar .navbar-nav .dropdown-menu a:hover, .navigation .navbar .navbar-nav .dropdown-menu a:active {
         color: #616161; }
   .navigation .navbar.fixed {
     background: linear-gradient(75deg, #50af31, #84e261);
     height: 4em;
     box-shadow: #004d83 0 1px 10px;
     position: fixed;
     top: -5em;
     opacity: 0;
     left: 0;
     width: 100%;
     z-index: 1000; 
     margin-top: 14px}
     .navigation .navbar.fixed .dropdown-menu {
       background: linear-gradient(75deg, #50af31, #84e261);
       margin-top: 0.9em; }
       .navigation .navbar.fixed .dropdown-menu a {
         color: #fff7d6; }
         .navigation .navbar.fixed .dropdown-menu a:hover, .navigation .navbar.fixed .dropdown-menu a:active {
           color: #ffd93d;
           background: linear-gradient(75deg, #2779b3, #63a8e5); }
   @media (max-width: 991.99px) {
     .navigation .navbar .navbar-collapse {
       background: linear-gradient(75deg, #50af31, #84e261);
       width: 100%;
       margin: 0 -2em;
       padding: 1em 2em; }
       .navigation .navbar .navbar-collapse .dropdown-menu {
         background: transparent;
         border: none; } }

1. landing {

 width: 100%;
 height: 100%;
 overflow: hidden; 
 position: relative;

}

 #landing .landing-page {
   background: url("https://static.igem.org/mediawiki/2018/b/b7/T--BOKU-Vienna--Wiki-Landing.svg") fixed no-repeat center;
   background-size: cover;
   width: 100vw;
   height: 100vh;
   display: flex;
   align-items: center;
   justify-content: center; }
   #landing .landing-page .header {
     color: #fff7d6;
     font-size: 24px;
     text-align: center; }
 #landing #bottom-landing-overlay {
   z-index: 1;
   position: absolute;
   bottom: -10px;
   left: 0; }

.container {

 padding-top: 4em;
 padding-bottom: 4em; }
 @media (min-width: 1400px) {
   .container {
     max-width: 1340px; } }
 @media (min-width: 1600px) {
   .container {
     max-width: 1540px; } }
 @media (min-width: 1800px) {
   .container {
     max-width: 1740px; } }

.row-element {

 position: relative;
 padding: 2em 0; }

.come-in {

 transform: translateY(300px);
 animation: come-in 0.8s ease forwards; }

@keyframes come-in {

 to {
   transform: translateX(0); } }

.card-group {

 display: flex;
 justify-content: space-around; }
 .card-group .card {
   border: none;
   box-shadow: #004d83 5px 5px 8px; }

.row-image {

 margin: 0 -6em;
 position: relative;
 height: 70%; }
 .row-image#row-image-1 {
   background: url("https://static.igem.org/mediawiki/2018/b/b7/T--BOKU-Vienna--Wiki-Landing.svg") fixed no-repeat;
   background-size: cover; 
   height: 80vh;

width: 100vw; overflow: hidden; }

 .row-image .row-image-overlay-top {
   position: absolute;
   top: -1px;
   left: 0; }
 .row-image .row-image-overlay-bottom {
   position: absolute;
   bottom: -10px;
   left: 0; }

1. carouselExample1 {

 max-width: 100vw;
 height: 50%;
 overflow: hidden;
 display: flex;
 flex-direction: column;
 justify-content: center; }
 #carouselExample1 .carousel-inner {
   display: flex;
   flex-direction: column;
   justify-content: center; }
   #carouselExample1 .carousel-inner .carousel-caption {
     bottom: 40%; }

.picture-row {

 padding: 2em 0; }
 .picture-row img {
   max-width: 100%;
   height: auto;
   box-shadow: #004d83 0 5px 10px;
   border-radius: 20px; }

.text-image-row .img-holder {

 padding: 2em 0; }
 .text-image-row .img-holder img {
   max-width: 100%;
   height: auto;
   box-shadow: #004d83 0 5px 10px;
   border-radius: 20px; }

.text-image-row .text-holder {

 padding: 2em 0; }

footer {

 background: linear-gradient(65deg, #2779b3, #004d83);
 padding: 2em 4em; }
 footer .sponsor .row {
   justify-content: center; }
 footer .sponsor img {
   max-width: 100%;
   height: auto; }
 footer .footer-menu {
   padding: 2em 0; }
   footer .footer-menu .row {
     justify-content: space-around;
     align-items: center; }
   footer .footer-menu .footer-link {
     text-decoration: none;
     list-style: none; }
     footer .footer-menu .footer-link a {
       color: #fff7d6; }
       footer .footer-menu .footer-link a:active, footer .footer-menu .footer-link a:hover, footer .footer-menu .footer-link a:focus {
         color: #ffd93d; }
   footer .footer-menu img {
     max-width: 100%;
     height: auto; }

/*# sourceMappingURL=NewStyle.css.map */