.fa-rotate-45 {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.clearer
{
clear:both;
}

HR
{
color:#004b8d;
background-color:#004b8d;
}

#wrapper_center
{
width:100%;
}

.wrapper
{
margin-left:auto;
margin-right:auto;
width:100%;
max-width:1000px;
}

H1
{
line-height:normal;
}

.wrapper_viertel
{
width:100%;
max-width:1050px;
}

.jcarousel_wrapper
{
width:100%;
max-width:1000px;
}


body
{
min-width:200px;
overflow-y: scroll;
}

#logo_bereich
{
width:100%;
height:120px;
}

    #logo
    {
      float:left;
      padding-top:10px;
      padding-left:25px;
      z-index:50;
      width: 160px;
    }
    #logo IMG
    {
    width:100%;
    }
    
    #menu_button
    {
    float:right;
    padding-right:20px;
    padding-top:40px;
    z-index:100;
    display:block;
    }
        #menu_button IMG
        {
        width:57px;
        }
        #menu_button a.hidenavlist
        {
        display:none;
        }
        #wir_helfen, #wir_helfen A
        {
          float:left;
          padding-right:20px;
    	    font-family:Ubuntu,Arial,Helvetica,sans-serif;
        	font-size:16px;
        	font-weight: normal;
        	text-decoration:none;  
          line-height:18px;
          color:#004b8d;
        }
        #wir_helfen
        {
        margin-top:5px;
        }


        #shortcuts, #shortcuts A
        {
          float:left;
          padding-right:20px;
    	    font-family:Ubuntu,Arial,Helvetica,sans-serif;
        	font-size:42px;
        	font-weight: normal;
        	text-decoration:none;  
          line-height:35px;
          /*color:#004b8d;*/
          color:rgba(153, 204, 51, 1.0);

        }
        #shortcuts
        {
        margin-top:5px;
        }


        .icon_tracking
        {
        height:40px;
        }
        .icon_ofb
        {
        height:40px;
        }

#sub_menu_wrapper
{
position:absolute;
z-index:100;
width:100%;
top:110px;
text-align:center;
}
      #sub_menu
      {
      float:left;
      display:block;
      text-align:left;
      max-width:180px;
      width:100%;
      height:180px;
      padding:0;
      margin:0;
      background-image:url('bilder/layout/blue_square.png');
      background-size:cover;
      }
            #sub_menu_inner
            {
            color:#FFFFFF;
            text-align:left;
            padding:0px;
            text-align:center;
            }
            
            #sub_menu_inner H3
            {
            margin:0;
            padding:10;
            font-weight: normal;
            font-size:25px;
            color:#81bc3d;
            }
            #sub_menu_inner I
            {
            padding-top:15px;
            font-size:60px;
            color:#FFFFFF;
            }

#main_menu_wrapper
{
position:absolute;
z-index:200;
width:100%;
top:120px;
text-align:center;
display:none;
}
#main_menu
{
float:right;
display:none;
text-align:left;
max-width:380px;
width:100%;
padding:0;
margin:0;
background-color:#8ab821;
  background-color:rgba(153, 204, 51, 1.0);
}

#main_menu_inner
{
color:#FFFFFF;
text-align:left;
padding:20px;
}
  #main_menu_inner H2
  {
  padding:0;
  margin:0;
  font-size:20px;
  line-height:20px;
  }
      #main_menu UL
      {
      margin:0;
      padding:0;
      list-style-type:none;
      width:100%;
      }     
      #main_menu UL LI
      {
      width:100%;
      list-style-type:none;
      border-bottom:1px solid #ffffff;
      }
      #main_menu UL LI A
      {
      line-height:40px;
      display:block;
      width:100%;
      color:#FFFFFF;
      }


#banner_pic
{
width:100%;
margin-top:0px;
margin-bottom:20px;
}

.banner IMG
{
width:100%;
border:1px solid #FFF;
}

.banner_overlay
{
  height:50px;
  position:relative;
  z-index:100;
  margin-top:-100px;
  opacity: 0.9;
  background-color:#81bc3d;
  color:#FFFFFF;
  text-align:right;
  padding-top:20px;
  padding-right:20px;
}
.subbanner
{
padding-top:12px;
padding-bottom:8px;
height:35px;
 margin-top:-55px;
}

.single_pic
{
margin-top:-70px;
}

    .banner_overlay H1
    { 
      padding:0;
      margin:0;
    	font-family:Ubuntu,Arial,Helvetica,sans-serif;
    	font-size:30px;
    	font-weight: normal;
    	text-decoration:none;  
      line-height:30px;
      color:#004b8d;
      width:100%;
    }
    .banner_overlay P
    {
      padding:0;
      margin:0;
    	font-family:Ubuntu,Arial,Helvetica,sans-serif;
    	font-size:20px;
    	font-weight: normal;
    	text-decoration:none;  
      line-height:20px;
      color:#FFFFFF;
      width:100%;
    }

.viertel
{
position: relative;
width:25%;
float:left;
}
.viertel:before{
	content: "";
	display: block;
	padding-top: 100%; 	/* initial ratio of 1:1*/
}
    .buttons
    {
    margin:auto auto;
    width:80%;
    height:80%;
    padding:15px;
    position:  absolute;
  	top: 0;
  	left: 0;
  	bottom: 0;
  	right: 0;
    background-image:url('bilder/layout/blue_square.png');
    background-size:cover;
    color:#FFFFFF;
    font-size:18px;
    text-align:center;
    }
    .buttons:hover
    {
    color:#81bc3d;
    }
    .buttons H3
    {
    margin:0;
    padding:10;
    font-weight: normal;
    font-size:25px;
    color:#81bc3d;
    }
    .buttons I
    {
    padding-top:15px;
    font-size:60px;
    color:#FFFFFF;
    }

#content_block
{
width:100%;
background-color:#FFFFFF;
border:1px solid #FFF;
overflow:hidden; /* fix fuer die bg_color */
margin-top:0px;
margin-bottom:20px;
}

#ofb_login_box,#tracking_box
{
float:left;
width:50%;
}

#main_content
{
width:100%;
float:left;
padding:0px;
}

#ma_infos_fragenbox
{
float:left;
width:60%;
}

.ma_text
{
width:100%;
padding: 0 20 20 0;
}

.ma_infos
{
font-size:18px;
width:100%;
float:left;
height:40px;
line-height:40px;
vertical-align:center;
padding: 0 20 0 20 ;
background-color:rgba(153, 204, 51, 1.0);

text-align:left;
border-bottom:1px solid #FFFFFF;
color:#FFFFFF;
}

.ma_infos:hover
{
color:#003870;
}

.ma_infos_active
{
color:#003870;
text-align:right;
background-color:rgba(153, 204, 51, 0.5);
display:none;
}

.ma_infos_overlay
{
position:relative;top:160px;width:100%;
height:60px;line-height:30px;text-align:center;
background-color:#8ab821;
background-color:rgba(153, 204, 51, 0.9);
}

.ma_tel_box
{
width:30%;
height:80px;
float:right;
margin:-80px;
margin-right:0px;
background-color:#004b8d;
color:#FFFFFF;
}
.ma_tel_box_inner{padding:10;line-height:30px;}
.ma_tel_box_inner A{color:#FFFFFF;text-decoration:none;font-size:16px;}

.ma_bild_1{width:20%;float:left;padding:10 10 10 0;}
.ma_bild_2{width:30%;float:right;padding:40 0 10 10;}
.leistungen_bild_1{height:23px;float:left;padding:5 10 5 0;}

.ma_liste
{
padding-top:15px;
width:25%;float:left;border-top:1px solid #cccccc;padding-bottom:0px;
color:#FFFFFF;
}

.ma_child
{
/* Background-image wird einzeln eingestellt */
width:95%;height:220px;margin:0 10 10 0;
text-align:center;
/*  display: table-cell;
  vertical-align: bottom;
  padding-bottom:15px;
  */
background-position: top center;-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;

}

.ma_child_text
{
padding-top:8px;
color:#FFFFFF;
line-height:18px;
}


.ma_infos_head
{
font-size:20px;
padding:0 0 20 0;
}

.ma_liste:link .ma_child,
.ma_liste:visted .ma_child
 {
  transform: scale(1.0);
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

.ma_liste:hover .ma_child,
.ma_liste:focus .ma_child {
  transform: scale(1.1);
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

.prod_child
{
width:30%;
float:left;list-style-type:none;
padding:10px;
margin:0px;
}
                                                        
.prod_parent:link .prod_child,
.prod_parent:visited .prod_child {
  transform: scale(1.0);
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

.prod_parent:hover .prod_child,
.prod_parent:focus .prod_child {
  transform: scale(1.1);
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}




#footer, #footer A
{
/* gruen */
  background-color:rgba(153, 204, 51, 1.0);
  width:100%;
  min-height:180px;
  text-align:center;
  color:#FFFFFF;
  text-decoration:none;
  line-height:18px;
}

#footer_left
{
width:40%;float:left;padding:20 0 0 0;text-align:left;
}

#footer_right
{
width:40%;float:right;padding:20 0 0 0;text-align:right;
}




























@media screen and (max-width:1010px)
{
.ma_tel_box_inner A{font-size:14px;}
#logo{left:20px;top:40px;margin-left:0px;width:100px;}
.buttons H3{font-size:20px;}
.buttons I{padding-top:10px;font-size:50px;}
.buttons{font-size:15px;}

.jcarousel_wrapper{width:100%;max-width:800px;}

#shortcuts, #shortcuts A{padding-right:10px;font-size:35px;line-height:20px;	}

}










@media screen and (max-width:800px)
{
#banner_pic{width:100%}
.prod_child{width:40%;}
#sub_menu_wrapper{display:none}
.buttons H3{font-size:15px;}
.buttons I{padding-top:6px;font-size:30px;}
.buttons{font-size:12px;}
.banner_overlay H1{font-size:25px;}
.banner_overlay P{font-size:18px;}
.jcarousel_wrapper{width:100%;max-width:500px;}
#ma_infos_fragenbox{width:100%;}
.ma_bild_2{width:100%}
.ma_infos{height:60px;line-height:normal;width:90%}
.ma_tel_box{width:100%;margin-top:10px}
#shortcuts, #shortcuts A{font-size:35px;line-height:12px;padding-right:5px;margin-top:0px}

.ma_liste{width:33%;}
}


@media screen and (max-width:500px)
{
.ma_bild_1{width:100%}
.prod_child{width:100%;}

#ofb_login_box,#tracking_box{width:100%;}
.ma_liste{width:50%;}

.viertel{width:50%;}
.buttons H3{font-size:20px;}
.buttons I{padding-top:10px;font-size:50px;}
.buttons{font-size:15px;}
.banner_overlay{display:none;}

#logo{width:80px;padding-top:10px;padding-left:10px;}
#logo_bereich {height:80px}
#menu_button{padding-top:20px;padding-right:10px;text-align:center}
#menu_button IMG{width:35px;}
#wir_helfen, #wir_helfen A{font-size:10px;padding-right:10px;}
#wir_helfen{margin-top:0px;}
#footer{min-height:250px;}
#footer_left{width:100%;float:none;}
#footer_right{width:100%;float:none;text-align:left;}
.jcarousel_wrapper{width:100%;max-width:350px}
.ma_child_text{font-size:10px;}

#main_content{width:90%;}

}

@media screen and (max-width:450px)
{
#main_menu_wrapper{top:150px;}

.viertel{width:100%;}
.buttons H3{font-size:30px;}
.buttons I{padding-top:20px;font-size:50px;}
.buttons{font-size:25px;}


#logo{text-align:center;width:100%;}
#logo IMG{width:150px;}
#logo_bereich{text-align:center;height:200px;};
}

@media screen and (max-width:350px)
{
.ma_liste{width:100%;}


.jcarousel_wrapper{width:100%;max-width:260px;}



}

  #showmenu:target div#main_menu{display:block;opacity: 0;}
  #showmenu:target div#main_menu{opacity: 1;transition: opacity 0.5s;}

  #showmenu:target div#main_menu_wrapper{display:block;opacity: 0;}
  #showmenu:target div#main_menu_wrapper{opacity: 1;transition: opacity 0.5s;}



  #showmenu:target a.shownavlist{display:none;}
  #showmenu:target a.hidenavlist{display:inline;}

/*
  #showmenu:target div#main_menu{display:block;transition: display 2s;}
  #showmenu:target a.shownavlist{display:none;}
  #showmenu:target a.hidenavlist{display:inline;}
*/