@charset "UTF-8";

/* ==========================================================================
 * Webseite: HS Bauteam
 * URL: www.hs-bauteam.de 
 * Datum: November 2014
 * Autor: graugans Design
 * ========================================================================== */
 
/* ==========================================================================
   ==========================================================================
   1. Allgemeine Klassen
   ==========================================================================
   ========================================================================== */  
   
/* ==========================================================================
   Links
   ========================================================================== */
a:focus {
  outline: thin dotted;
}
a:active,
a:hover {
  outline: 0;
}
/* ==========================================================================
   Typography
   ========================================================================== */
/* Schriftarten */  
body {
	font: 1em/1.5 "roboto", "Verdana", sans-serif; /* 16px Basis */
	color: #222;
   margin: 0;
   background-color: #fff;
}
p, dl, menu, ul, ol, pre {
	margin: 0 0 1em 0;	
}
h1, h2, h3, h4, h5 {
	margin: 0 0 1rem 0;
   line-height: 1.33em; 
}
h1 {
   font-size: 1.6em;
}
h2 {
   font-size: 1.3em;
}
h3 {
   font-size: 1em;
}
@media (min-width: 768px) {
   h1 {
      font-size: 2em;
   }
   h2 {
      font-size: 1.7em;
   }
   h3 {
      font-size: 1.2em;
   }
}
@media (min-width: 992px) {

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

}
a {
   text-decoration: none;
   border-bottom-width: 1px;   
   border-bottom-style: dotted;   
}
a:hover, a:focus {
   text-decoration: none;
   border-bottom-style: solid;   
}
.text-center {
   text-align: center;  
}
.text-left {
   text-align: left;  
}
.initialism {
   text-transform: uppercase;
   font-size: 85%;  
}
/* ==========================================================================
   Listen
   ========================================================================== */
dd {
  margin: 0 0 0 20px;
}
menu,
ol,
ul {
  padding: 0 0 0 20px;
}
nav ul,
nav ol {
  list-style: none;
  list-style-image: none;
}
/* ==========================================================================
   Bilder mit Bildunterschriften
   ========================================================================== */
figure {
	margin: 0;
}
figcaption {
	margin: .5em 0 0 .2em;
}

img {
  	border: 0;
  	vertical-align: middle;
	max-width: 100%; /* responsive */
  	-ms-interpolation-mode: bicubic;
}
svg:not(:root) {
  overflow: hidden;
}
/* ==========================================================================
   Layout Helferklassen
   ========================================================================== */
.clearfix:before,
.clearfix:after,
.container:before,
.container:after,
.row:before,
.row:after,
.nav:before,
.nav:after,
.navbar:before,
.navbar:after,
.navbar-header:before,
.navbar-header:after,
.navbar-collapse:before,
.navbar-collapse:after,
.modal-footer:before,
.modal-footer:after {
  content: " ";
  display: table;
}
.clearfix:after,
.container:after,
.row:after,
.nav:after,
.navbar:after,
.navbar-header:after,
.navbar-collapse:after,
.modal-footer:after {
  clear: both;
}
.center-block {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.pull-right {
  float: right !important;
}
.pull-left {
  float: left !important;
}
.hide {
  display: none;
}
.show {
  display: block !important;
}
.invisible {
  visibility: hidden;
}
.text-hide {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}
.hidden {
  display: none !important;
  visibility: hidden !important;
}
@-ms-viewport {
  width: device-width;
}
.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
  display: none !important;
}
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0,0,0,0);
border: 0;
}
@media (max-width: 767px) {
  .visible-xs {
    display: block !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm {
    display: block !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md {
    display: block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg {
    display: block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-block {
    display: block !important;
  }
}
@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .hidden-lg {
    display: none !important;
  }
}
.visible-print {
  display: none !important;
}
@media print {
  .visible-print {
    display: block !important;
  }
}
@media print {
  .hidden-print {
    display: none !important;
  }
}
.sr-only {
   position: absolute;
   width: 1px;
   height: 1px;
   margin: -1px;
   padding: 0;
   overflow: hidden;
   clip: rect(0, 0, 0, 0);
   border: 0;
}
.no-mt {
   margin-top: 0 !important;   
}
.no-mb {
   margin-bottom: 0 !important;   
}
.no-p {
   padding: 0 !important;   
}
.no-pt {
   padding-top: 0 !important;   
}
.pt {padding-top: 1em;}
.pb {padding-bottom: 1em;}
.ir {
  border: 0;
  font: 0/0 a;
  text-shadow: none;
  color: transparent;   
}
/* ==========================================================================
   Animation
   ========================================================================== */
.fade {
  opacity: 0;
  -webkit-transition: opacity 0.15s linear;
  -o-transition: opacity 0.15s linear;
  transition: opacity 0.15s linear;
}
.fade.in {
  opacity: 1;
}
.collapse {
  display: none;
}
.collapse.in {
  display: block;
}
tr.collapse.in {
  display: table-row;
}
tbody.collapse.in {
  display: table-row-group;
}
.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  -webkit-transition: height 0.35s ease;
  -o-transition: height 0.35s ease;
  transition: height 0.35s ease;
}
/* ==========================================================================
   Navigation
   ========================================================================== */
.nav {
  padding-left: 0;
  list-style: none;
   text-align: center;
   margin-top: 2em;
}
.nav > li {
  position: relative;
  display: inline-block;
   color: #777;
}
.nav > li > a {
  position: relative;
  border: none;
    color: #777;
}
.nav > li > a:hover,
.nav > li > a:focus {
   color: #003F89;
}
.navbar {
  position: relative;
  min-height: 50px;
  margin-bottom: 33px;
  border: 1px solid transparent;
}
@media (min-width: 768px) {
  .navbar {
    border-radius: 4px;
  }
}
@media (min-width: 768px) {
  .navbar-header {
    float: left;
  }
}
.navbar-collapse {
  max-height: 340px;
  overflow-x: visible;
  padding-right: 15px;
  padding-left: 15px;
  border-top: 1px solid transparent;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
  -webkit-overflow-scrolling: touch;
}
.navbar-collapse.in {
  overflow-y: auto;
}
@media (min-width: 768px) {
  .navbar-collapse {
    width: auto;
    border-top: 0;
    box-shadow: none;
  }
  .navbar-collapse.collapse {
    display: block !important;
    height: auto !important;
    padding-bottom: 0;
    overflow: visible !important;
  }
  .navbar-collapse.in {
    overflow-y: visible;
  }
  .navbar-fixed-top .navbar-collapse,
  .navbar-static-top .navbar-collapse,
  .navbar-fixed-bottom .navbar-collapse {
    padding-left: 0;
    padding-right: 0;
  }
}
.container > .navbar-header,
.container-fluid > .navbar-header,
.container > .navbar-collapse,
.container-fluid > .navbar-collapse {
  margin-right: -15px;
  margin-left: -15px;
}
@media (min-width: 768px) {
  .container > .navbar-header,
  .container > .navbar-collapse {
    margin-right: 0;
    margin-left: 0;
  }
}
.navbar-brand {
  float: left;
  background: url(/assets/hs-bauteam-logo-221x34.svg) no-repeat;
  display: block;
  width: 221px;
  height: 34px;
}
.navbar-brand:hover,
.navbar-brand:focus {
  text-decoration: none;
}
@media (min-width: 768px) {
  .navbar > .container .navbar-brand,
  .navbar > .container-fluid .navbar-brand {
    margin-left: -15px;
  }
}
.navbar-toggle {
  position: relative;
  float: right;
  margin-right: 15px;
  padding: 9px 10px;
  margin-top: 8px;
  margin-bottom: 8px;
  background-color: transparent;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
}
.navbar-toggle:focus {
  outline: none;
}
.navbar-toggle .icon-bar {
  display: block;
  width: 22px;
  height: 2px;
  border-radius: 1px;
}
.navbar-toggle .icon-bar + .icon-bar {
  margin-top: 4px;
}
@media (min-width: 768px) {
  .navbar-toggle {
    display: none;
  }
}
.navbar-nav {
  margin: 4.25px -15px;
}
.navbar-nav > li > a {
  padding-top: 10px;
  padding-bottom: 10px;
  line-height: 33px;
}
@media (max-width: 767px) {
  .navbar-nav .open .dropdown-menu {
    position: static;
    float: none;
    width: auto;
    margin-top: 0;
    background-color: transparent;
    border: 0;
    box-shadow: none;
  }
  .navbar-nav .open .dropdown-menu > li > a,
  .navbar-nav .open .dropdown-menu .dropdown-header {
    padding: 5px 15px 5px 25px;
  }
  .navbar-nav .open .dropdown-menu > li > a {
    line-height: 33px;
  }
  .navbar-nav .open .dropdown-menu > li > a:hover,
  .navbar-nav .open .dropdown-menu > li > a:focus {
    background-image: none;
  }
}
@media (min-width: 768px) {
  .navbar-nav {
    float: left;
    margin: 0;
  }
  .navbar-nav > li {
    float: left;
  }
  .navbar-nav > li > a {
    padding-top: 8.5px;
    padding-bottom: 8.5px;
  }
  .navbar-nav.navbar-right:last-child {
    margin-right: -15px;
  }
}
/* ==========================================================================
   Layout
   ========================================================================== */
#hero {
   background: url(../img/hero.jpg);
   background-size: cover;
   padding: 2em 0;
}
.logo {
   display: block;
   background: url(../assets/logo.svg) no-repeat;
   background-size: cover;
   height: 157px;
   width: 180px;
   margin: 0 auto;
}
@media (min-width: 768px) {
   .logo {
      height: 286px;
      width: 324px;
   }
}
@media (min-width: 992px) {
   .logo {
      height: 349px;
      width: 397px;
   }
}
@media (min-width: 1200px) {

}
.article {
   padding: 3em 0;
}
.article .row {
   margin-bottom: 4em;
}
.infobox {
   margin-top: 2em;
   padding: 2em;
   background: #003F89;
   color: #fff;
   position: relative;
}
.infobox p:last-child {
   margin-bottom: 0;   
}
@media (min-width: 768px) {
   .infobox .bewerbung {
      top: 2em;
      right: 3em;
      position: absolute;
      background-image: url(../assets/bewerbung.svg);
      background-repeat: no-repeat;
      background-size: cover;
      width: 130px;
      height: 160px;
   }
}
@media (min-width: 992px) {

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

}
/* ==========================================================================
   Icons
   ========================================================================== */
[class^='icon'] {
   background-image: url(/assets/icon-sprite.svg);   
   display: inline-block;
   width: 32px;
   height: 32px;
}
/* ==========================================================================
   Buttons
   ========================================================================== */
.btn {
   border: none;  
   border-radius: 4px; 
   position: relative;
}
.btn:focus, .btn:active {
   outline: none;
}
.btn:active {
   border: none;  
   border-radius: 4px; 
   top: 1px;
   outline: none;
}
