/* CSS Document */


body { background:#fff;  }


h2 { font-weight:400; text-transform: uppercase; min-height: 120px;}
h2 span { font-weight:200;}



#head  { padding:0 40px; }


#head .header-inner  { display:block; padding:54px 26px 14px 26px; font-size: 20px; text-align: center;}
#head .header-inner  img { width:130px; height:auto;}

 
#heroes-main { padding:40px; background:#fff; max-width: 1840px; margin-left:auto; margin-right:auto; }

.heroes-main .heroes-inner {background:#333; color: #fff; }


.heroes-main .heroes-inner p.heroes-image { display:block; text-align: center; margin-top:80px; padding-bottom: 80px;}


.heroes-main .heroes-inner a p.heroes-button { display:block; padding:26px 32px; background-color: rgba(255,255,255,0.15); color:#fff; font-size: 20px; margin-top:130px; }


.heroes-main .heroes-inner a:hover p.heroes-button { 
    background-color: #fff; color:#333;
    -webkit-transition: background-color 1s linear, color 300ms linear;
    -ms-transition: background-color 1s linear, color 300ms linear;
    transition: background-color 1s linear, color 300ms linear;

} 


.heroes-main .heroes-inner a.vers-tier:hover p.heroes-button { color:#8861a6; } 
.heroes-main .heroes-inner a.vers-hausrat:hover p.heroes-button { color:#19a9b5; } 
.heroes-main .heroes-inner a.vers-haftpflicht:hover p.heroes-button { color:#72cbd2; } 


#heroes-main-1  .heroes-inner { background:#8861a6;  }
#heroes-main-2  .heroes-inner { background:#19a9b5;  }
#heroes-main-3  .heroes-inner { background:#72cbd2;  }
#heroes-main-4  .heroes-inner { background:#72cbd2;  }
#heroes-main-5  .heroes-inner { background:#c31b27; padding:40px 40px 24px 40px; text-align: center; }


.title-inner { background:#f0f0f0; padding:40px 40px 24px 40px;; max-width:1760px; margin-left:auto; margin-right:auto; text-align: center; font-size:16px; line-height: 20px; }

p.title-1 { font-size:24px; line-height: 28px; max-width:1200px; margin-left: auto; margin-right:auto; }


.heroes-main a { display:block; padding: 60px 40px; margin-bottom:40px; width:100%; height:100%; color:#fff; }
.heroes-main a:hover { text-decoration:none; color:#fff; }


.heroes-main a .image-swap-container {
  width: 178px;
  height: 178px;
	margin:80px auto;
  overflow: hidden;
}

.heroes-main a .image-swap {
    background-repeat: no-repeat;
    background-image: url("images/icon-tier-1.png");
    border-radius: 50%;
    height: 178px;
    width: 178px;
    transform: none;
    transition: transform 1s, background-image 1s;
}

.heroes-main a:hover .image-swap-container {
    cursor: pointer;
}

.heroes-main a:hover .image-swap-container .image-swap {
    background: url("images/icon-tier-2.png");
    transform: rotate(360deg);
}



a.vers-tier .image-swap { background-image: url("images/icon-tier-1.png");}
a.vers-tier:hover .image-swap-container .image-swap { background: url("images/icon-tier-2.png");}

a.vers-hausrat .image-swap { background-image: url("images/icon-hausrat-1a.png");}
a.vers-hausrat:hover .image-swap-container .image-swap { background: url("images/icon-hausrat-2a.png");}

a.vers-haftpflicht .image-swap { background-image: url("images/icon-haftpflicht-1.png");}
a.vers-haftpflicht:hover .image-swap-container .image-swap { background: url("images/icon-haftpflicht-2.png");}

a.vers-wassersport .image-swap { background-image: url("images/icon-wassersport-1.png");}
a.vers-wassersport:hover .image-swap-container .image-swap { background: url("images/icon-wassersport-2.png");}




#foot .footer-inner  { display:block; padding:26px 26px 52px 26px; font-size: 15px; text-align: center; color:#aaa;}
#foot .footer-inner  img { width:130px; height:auto; margin-top:-11px;}


#foot a { color:#ddd;

-o-transition:1s;
  -ms-transition:1s;
  -moz-transition:1s;
  -webkit-transition:1s;

}

#foot a:hover { color:#7bc084; text-decoration: none; }