/*******************************
*
*  G O O G L E   F O N T S  ( l o k a l )
*
********************************/






/*******************************
*
*  B A S I S E I N S T E L L U N G E N
*
********************************/
html {
  min-height: 101%;
  margin-bottom: 1px;
}


body {
	margin:0;
	padding:0;
	border:0;			/* This removes the border around the viewport in old versions of IE */
	width:100%;
	text-align:center;

	background:#eee;

  font-family: "open_sansregular", arial, sans-serif;
  font-size: 11pt;
}



a, a:link, a:visited, a:active {
	color:#000;
  text-decoration: none;
}


a, a:link, a:visited, a:active {
  color:#004191;
  text-decoration: none;
}


a:hover {
  color:#004191;
  text-decoration: underline;
}






/*******************************
*
*  H e a d e r
*
********************************/
#header {
  position: relative;
	clear:both;
	float:left;
	width:100%;
	height: 150px;
	
	margin-top: 20px;
	margin-bottom: 20px;
	
	background:#fff;
	border-top: 15px solid #002557;
}

#header_logo {
  position: absolute;
  left: 60px;
  top: 20px;

  display: inline-block;
  width: 90px;
}


#logo {
  height: 110px;
}



#header_title {
  position: absolute;
  left: 330px;
  top: 25px;
  display: inline-block;
  text-align: left;
}


#header h1 {
  font-size: 28pt;
  margin: 15px 0 5px 0;
  padding:0;
}

#header h2 {
  margin: 5px 0 5px 0;
  padding:0;
}



#header_menu {
  display: none;
  z-index: 9999;
}


#header_home {
  display: none;
  z-index: 9999;
}





/* kleiner als 1300px */
/*====================*/
@media (max-width: 1300px) {

  #header h1 {
    font-size: 24pt;
    margin: 15px 0 5px 0;
    padding:0;
  }

  #header h2 {
    font-size: 14pt;
    margin: 5px 0 0 0;
    padding:0;
  }

  #header_title {
    position: absolute;
    left: 330px;
    top: 82px;
    display: inline-block;
    text-align: left;

  }
}




/* kleiner als 1100px */
/*====================*/
@media (max-width: 1100px) {

  #header {
    clear:both;
    float:left;
    width:100%;
    height: 75px;

    margin-top: 48px;
    margin-bottom: 25px;

    background:#fff;
    border-top: 15px solid #002557;
  }

  #header_title {
    left: 120px;
    top: 5px;
  }

  #header_title h1 {
    font-size: 14pt;
    margin: 5px 0 0 0;
  }


  #header h2 {
    font-size: 12pt;
    margin: 5px 0 0 0;
    padding:0;
  }


  #header_logo {
    position: absolute;
    left: 20px;
    top: 10px;

    display: inline-block;
    width: 40px;
  }

  #logo {
    height: 50px;
  }

  #header_menu {
    position: fixed;
    display: block;
    top: 0;

    z-index:9999;
    width: 400px;
  }


  #header_home {
    position: fixed;
    display: block;
    top: 0;
    left: 50px;

    z-index:9999;
    width: 50px;
    height: 48px;
    background-color: #8494B2; /* FARBE Hauptmenue */

  }


}




/* kleiner als 450px */
/*====================*/
@media (max-width: 450px) {

  #header_title {
    left: 120px;
    top: 0;
  }
  #header_title h1 {
    font-size: 12pt;
    margin: 5px 0 0 0;
  }
  #header_title h2 {
    font-size: 8pt;
    margin: 5px 0 0 0;
  }

}






/*******************************
*
*  F e s t e   B r e i t e  /   2   S P A L T E N
*
********************************/
#fixed {
	margin:0 auto;
	max-width:1300px;
	text-align:left;
}


#main {
  width: 100%;
  text-align:left;

  display: flex;
  flex-flow: nowrap row;
}




.col_links {
  background:#fff;
  width: 300px;
  margin-right: 20px;

}

#col_links-margin{
  padding-left: 15px;
  margin-right: 15px;
  margin-top: 200px;
  margin-bottom: 20px;
}




#logo_ibb {
  width: 270px;
}




.col_rechts {
  background:#fff;
  flex: 6 1 900px;
}

#col_rechts-margin{
  margin-left: 20px;
  margin-right: 20px;
}




/* kleiner als 1100px */
/*====================*/
@media (max-width: 1100px) {

  #main {
    flex-flow: wrap row;
  }
  .col_links {
    flex: 1 1 0;
    order: 2;
    margin: 20px 0 20px 0;
  }

  #col_links-margin{
    margin-top: 15px;

    padding-left: 15px;
    margin-right: 15px;
    text-align: center;
  }

  .col_rechts {
    margin: 10px 0 20px 0;
   /* min-width: 900px;*/
    order: 1;
  }
  #col_rechts-margin{
    margin-left: 20px;
    margin-right: 20px;
    margin-top:20px;
  }

}






/*******************************
*
*  F O O T E R
*
********************************/
#footer {
  display: flex;
  flex-flow: wrap row;

  clear:both;
  float:left;
  width:100%;

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

  background:#fff;
}


#footer div.linke_spalte
{
  flex: 2 1 0;

	vertical-align: top;

  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: 20px;
}

#footer div.rechte_spalte
{
  flex: 1 1 0;

	vertical-align: top;

  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: 20px;
}







#footer2 {
  display: flex;
  flex-flow: wrap row;

  clear:both;
  float:left;
  width:100%;

  margin-top: 0;
  margin-bottom: 20px;
  padding: 15px 0 15px 0;

  background:#002557;
  color:#fff;
}

#footer2 a{
  color:#fff;
}

#footer2 div.wrapper {
  margin: 15px 15px 15px 20px;
}



#footer2 div.linke_spalte
{
  flex: 2 1 0;
  min-height: 40px;
  line-height: 40px;
  margin: 5px 20px;
}

#footer2 div.rechte_spalte
{
  flex: 1 1 0;
  text-align: right;
  margin: 5px 20px;
}







/*******************************
*
*  M E N Ü   L I N K S
*
********************************/
#left_menu {
  position: relative;
}



/* kleiner als 1100px */
/*====================*/
@media (max-width: 1100px) {

  #left_menu
  {
    display: none;
  }

}









/*******************************
*
*  T E X T F E L D E R
*
********************************/

input, select, textarea {
  border: 1px solid #000000;
  padding: 4px 6px;

  -moz-border-radius: 15px;
  -webkit-border-radius: 15px;
  border-radius: 15px;
}