*{margin: 0; padding: 0; border: 0;}
        @font-face { font-family: 'Raleway-Thin';
             src: url('Raleway-Thin.ttf') format('truetype');
             src: url('Raleway-Thin.woff') format('woff');}
        @font-face { font-family: 'Raleway-Regular';
             src: url('Raleway-Regular.ttf') format('truetype');
             src: url('Raleway-Regular.woff') format('woff');}
        @font-face { font-family: 'Domdiagn';
             src: url('Domdiagn.ttf') format('truetype');
             src: url('Domdiagn.woff') format('woff');}
        
#wrapper{max-width: 1280px;margin: 0 auto;}

#navigation{width: 176px;margin-top: 60px;float: right;}
 
#above1
    {width: 58px;
     margin: 0 8px;
     padding: 2px 8px;
     font-family:'Raleway-Regular';
     font-size: 11px;
     color: #30498f;
     text-decoration: none;
     text-align: center;
     float: left;
     border-bottom: 1px solid #30498f;
     border-right: 1px solid #30498f;}
 
#above2
    {width: 58px;
     margin: 0 0 0 8px;
     padding: 2px 8px;
     font-family:'Raleway-Regular';
     font-size: 11px;
     color: #30498f;
     text-decoration: none;
     text-align: center;
     float: left;
     border-bottom: 1px solid #30498f;
     border-right: 1px solid #30498f;}
 
#above1:hover, #above2:hover{border-bottom: 1px solid #e4672f;border-right: 1px solid #e4672f;color: #e4672f;}
 
#headcontainer{height:44px;margin:0 0 18px 140px;padding-top:104px;}
       
#kopf1
    {color: rgb(48,73,143);
     font-family:'Raleway-Thin';
     font-size: 40px;
     text-align: left;
     float: left;}
        
#kopf2
    {color: rgb(228,103,47);
     font-family:'Raleway-Regular';
     font-size: 40px;
     text-align: left;
     padding-left: 4px;
     float: left;}


#picturestart,#picturepraxis, #picturehom,#picturebio,#pictureverhalten,#picturerat,#picturemich,#picturekontakt
    {width: 1180px;
     height: 310px;
     margin: 0 0 24px 0;
     float: left;
     background-size: cover;
     background-repeat: no-repeat;
     background-position: center;}
        
 #picturestart{background-image:url(merlinstuhl1180auf310.jpg);}       
 #picturepraxis{background-image:url(hund1180auf310.jpg);}
 #picturehom{background-image:url(fineschnee1180auf310.jpg);}
 #picturebio{background-image:url(pferdeherde1180auf310.jpg);}
 #pictureverhalten{background-image:url(hinterteil1180auf310.jpg);}
 #picturerat{background-image:url(schafe1180auf310.jpg);}
 #picturemich{background-image:url(dreihunde1180auf310.jpg);}
 #picturekontakt{background-image:url(jagd1180auf310.jpg);}
 
.linestart
    {color: rgb(48,73,143); font-family:'Raleway-Thin'; font-size: 2.656250vw;
     text-align: left;margin: 0 0 0 10.937500vw;clear: left;}  
.line
    {color: rgb(48,73,143); font-family:'Raleway-Thin'; font-size: 34px;
     text-align: left;margin: 0 0 0 140px;clear: left;} 
        
#copystart
    {text-align: justify;line-height: 1.6;width: 460px;height: auto;margin: 16px 0 12px 140px;float: left;
     font-family: 'Raleway-Regular';font-size:13px;color: rgb(0,0,0);}
#copy
    {text-align: justify;line-height: 1.6;width: 460px;height: auto;margin: 16px 0 12px 140px;float: left;
     font-family: 'Raleway-Regular';font-size:13px;color: rgb(0,0,0);}
    
#verband
    {width: 350px;
     height: 90px;
     font-family: 'Raleway-Regular';
     font-size: 12px;
     text-align: justify;
     line-height: 1.4;
     margin-top: 22px;
     padding: 2px 0 4px 0;
     float: right;
     color: rgb(0,0,0);
     border-top: 1px dotted #30498f;}

#casestart
    {width: 164px;
     height: 60px;
     clear: right;
     float: right;}
    
#caserest
    {width: 164px;
     height: 60px;
     margin-top: 116px;
     clear: right;
     float: right;}    

#surround
    {width: 30px;
     height: 60px;
     margin: 0 14px;
     position: relative;
     float: left;}
    
#klammerlinks
    {width: 10px;
     height: 30px;
     margin-top: 25px;
     padding-right: 42px;
     float: left;
     -webkit-transition: transform 0.3s;
     -moz-transition: transform 0.3s;
     -o-transition: transform 0.3s;
     transition: transform 0.3s;}

#klammerrechts
    {width: 10px;
     height: 30px;
     margin-top: 25px;
     padding-left: 42px;
     float: left;
     -webkit-transition: transform 0.3s;
     -moz-transition: transform 0.3s;
     -o-transition: transform 0.3s;
     transition: transform 0.3s;}
    
#klammerlinks:hover, #klammerrechts:hover{transform:scaley(1.7);}

#hund{width: 14px;height: 24px;background-image: url(hundjump.png);background-position: bottom;
      background-repeat: no-repeat;background-size:cover;float: left;margin-top: 26px;}
#katz{width: 14px;height: 24px;background-image: url(katzjump.png);background-position: bottom;
      background-repeat: no-repeat;background-size:cover;float: left;margin-top: 26px;}

#casestart:hover #hund{animation: wave 1.0s 3 ease-in-out;}
#casestart:hover #katz{animation: wave 1.0s 3 ease-in-out;animation-delay: 0.1s;}

@keyframes wave {
    0%  {transform:translateY(0);}
    25% {transform:translateY(-27px);}
    50% {transform:translateY(0);}
    100%{transform:translateY(0);}
}

.imageBox {position: relative;width: 1180px; overflow: hidden;margin: 0 auto;}

.figure {position: absolute;}

.slidein
    {right: -1048px;
     top: 560px;
     width: 524px;
     height: 94px;
     background-color: #ffffff;
     border-bottom: 1px dotted #30498f;
     -webkit-transition: all 1s;
     -moz-transition: all 1s;
     -o-transition: all 1s;
     transition: all 1s;}
    
.callin{display: none;}
.standin {right:0;top: 560px;width: 524px; height: 94px;background-color: #ffffff;border-bottom: 1px dotted #30498f;}
.bein {display: none;}

.navwrap {width: 74px;height: 90px;margin-right: 16px;float: left;text-decoration: none;}
#navwrap960 {display: none;}
#navwrapright{width: 74px;height: 90px;float: left;margin: 0;text-decoration: none;}

.picstart
    {width: 74px;
     height: 74px;
     opacity: 0;
     -webkit-transition: opacity 0.5s ease-in 0.5s, border-radius 0.2s linear;
     -moz-transition: opacity 0.5s ease-in 0.5s, border-radius 0.2s linear;
     -o-transition: opacity 0.5s ease-in 0.5s, border-radius 0.2s linear;
     transition: opacity 0.5s ease-in 0.5s, border-radius 0.2s linear;}

.picrest {width: 74px;height: 74px;
         -webkit-transition: border-radius 0.2s linear;
         -moz-transition: border-radius 0.2s linear;
         -o-transition: border-radius 0.2s linear;
         transition: border-radius 0.2s linear;}

.picactual {width: 74px;height: 74px;opacity: 0.3;border-radius: 50%;}

.text
    {width: 74px;
    text-decoration: none;
    font-family: 'Raleway-Regular';
    font-size: 11px;
    text-align: center;
    color: #30498f;
    opacity: 0;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;}

.textactual
    {width: 74px;
    text-decoration: none;
    font-family: 'Raleway-Regular';
    font-size: 11px;
    text-align: center;
    color: #30498f;
    opacity: 0.5;}

#casestart:hover .slidein {right: 0;}
#casestart:hover .picstart {opacity: 1;}

.navwrap:hover .picstart, #navwrapright:hover .picstart, .navwrap:hover .picrest, #navwrapright:hover .picrest
    {border-radius: 50%;}
.navwrap:hover .text{opacity: 1;}
#navwrapright:hover .text{opacity: 1;}

.link{font-family: 'Raleway-Regular';font-size:13px;color: rgb(0,0,0); text-decoration: none;}
.link:hover{color:rgb(228,103,47);}

#copywrap
    {width: 460px;
     margin: 16px 0 12px 140px;
     float: left;
     text-align: justify;
     line-height: 1.6;
     font-family: 'Raleway-Regular';
     font-size:13px;
     color: rgb(0,0,0);}
    
#postit{width: 460px;height: 260px;margin-top: 20px;}

#heft1 {background-color: #FF3;}
#heft2 {background-color: #FF3;}
#heft3 {background-color: #FF3;}

.drop-shadow
    {position:relative;
    font-family: 'Domdiagn';
    width: 360px;
    height: 64px;
    font-size: 20px;
    text-align: center;
    text-decoration: none;
    color: rgb(48,73,143);
    margin: 10px 0 10px 10px;
    padding: 10px;
    float: right;
    -webkit-transition: color 0.5s;
    -moz-transition: color 0.5s;
    -o-transition: color 0.5s;
    transition: color 0.5s;}
    
.drop-shadow:before
    {content: "";
    position: absolute;
    z-index: -1;
    bottom: 15px;
    left: 10px;
    width: 50%;
    height: 20%;
    -webkit-box-shadow: 0 15px 10px hsla(0, 0%, 0%, 0.7);
    -moz-box-shadow: 0 15px 10px hsla(0, 0%, 0%, 0.7);
    box-shadow: 0 15px 10px hsla(0, 0%, 0%, 0.7);
    -webkit-transform: rotate(-3deg);
    -moz-transform: rotate(-3deg);
    -o-transform: rotate(-3deg);
    -ms-transform: rotate(-3deg);
    transform: rotate(-3deg);}
    
.info
    {width: 300px;
    text-decoration: none;
    font-family: 'Raleway-Regular';
    font-size: 12px;
    text-align: center;
    margin: 0 30px 0 30px;
    color: #000000;
    opacity: 0;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;}

.drop-shadow:hover .info{opacity: 1;}
.drop-shadow:hover {color: rgb(228,103,47);}

a{text-decoration: none;}

span{color: rgb(48,73,143);cursor: pointer;text-decoration: none;}
span:hover{color: rgb(228,103,47);}