@import url(http://fonts.googleapis.com/css?family=Satisfy);
 

/* Effect 8 */
 .hovicon.effect-8 {
    -webkit-transition: -webkit-transform ease-out 0.1s, background 0.2s;
    -moz-transition: -moz-transform ease-out 0.1s, background 0.2s;
    transition: transform ease-out 0.1s, background 0.2s;
}
.hovicon.effect-8:after {
    top: 0;
    left: 0;
    padding: 0;
    z-index: -1;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1);
    opacity: 0;
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
}
.hovicon.effect-8:hover {
    background: rgba(255, 255, 255, 0.05);
    -webkit-transform: scale(0.93);
    -moz-transform: scale(0.93);
    -ms-transform: scale(0.93);
    transform: scale(0.93);
    color: #fff;
}
.hovicon.effect-8:hover {
    color: #fff;
}
.hovicon.effect-8:hover:after {
    -webkit-animation: sonarEffect 1.3s ease-out 75ms;
    -moz-animation: sonarEffect 1.3s ease-out 75ms;
    animation: sonarEffect 1.3s ease-out 75ms;
}
@-webkit-keyframes sonarEffect {
    0% {
        opacity: 0.3;
    }
    40% {
        opacity: 0.5;
        box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #04305E, 0 0 0 10px rgba(255, 255, 255, 0.5);
    }
    100% {
        box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #04305E, 0 0 0 10px rgba(255, 255, 255, 0.5);
        -webkit-transform: scale(1.5);
        opacity: 0;
    }
}
@-moz-keyframes sonarEffect {
    0% {
        opacity: 0.3;
    }
    40% {
        opacity: 0.5;
        box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #04305E, 0 0 0 10px rgba(255, 255, 255, 0.5);
    }
    100% {
        box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #04305E, 0 0 0 10px rgba(255, 255, 255, 0.5);
        -moz-transform: scale(1.5);
        opacity: 0;
    }
}
@keyframes sonarEffect {
    0% {
        opacity: 0.3;
    }
    40% {
        opacity: 0.5;
        box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #04305E, 0 0 0 10px rgba(255, 255, 255, 0.5);
    }
    100% {
        box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #04305E, 0 0 0 10px rgba(255, 255, 255, 0.5);
        transform: scale(1.5);
        opacity: 0;
    }
}
.tooltip {
	display: inline;
	position: relative;
	opacity: 1;
}
.tooltip a {text-decoration:none;}
/* Gap filler */
.tooltip::after {
	content: '';
	position: absolute;
	width: 3vw;
	height: 3vw;
	bottom: 100%;
	left: 50%;
	pointer-events: none;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
    border-radius: 50%;
}
@media screen and (min-width:2000px) {
   .tooltip::after {
    width: 60px;
	height: 60px;
    }
}

.tooltip:hover::after {
	pointer-events: auto;
}
/* Tooltip */
.tooltip-content {
	position: absolute;
	z-index: 9999;
	width: 300px;
	left: 50%;
	bottom: 101%;
	font-size: 14px;
	line-height: 1.3;
	text-align: center;
	font-weight: 300;
	color: #fffaf0;
	background: transparent;
	opacity: 0;
	margin: 0 0 10px -150px;
	cursor: default;
	pointer-events: none;
	/***font-family: 'Satisfy', cursive;***/
	-webkit-font-smoothing: antialiased;
	-webkit-transition: opacity 0.3s .3s;
	transition: opacity 0.3s .3s;
}
.tooltip-content h2{
    font-size: 25px;
    margin:0 0 10px;
}
.tooltip:hover .tooltip-content {
	opacity: 1;
	pointer-events: auto;
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
}
.tooltip-content span {
	display: block;
}

.tooltip-text {
	border-bottom: 10px solid #008a6b;
	overflow: hidden;
	-webkit-transform: scale3d(0,1,1);
	transform: scale3d(0,1,1);
	-webkit-transition: -webkit-transform 0.3s .3s;
	transition: transform 0.3s .3s;
}
.tooltip:hover .tooltip-text {
	-webkit-transition-delay: 0s;
	transition-delay: 0s;
	-webkit-transform: scale3d(1,1,1);
	transform: scale3d(1,1,1);
}
.tooltip-inner {
	background: #fff;
	padding: 18px;
	-webkit-transform: translate3d(0,100%,0);
	transform: translate3d(0,100%,0);
	webkit-transition: -webkit-transform 3.3s;
	transition: transform 0.3s;
    color:rgba(0,0,0,0.6);
    border:10px solid rgba(0,0,0,0.1);
    border-bottom: 0;max-width: 100%;
}
.maincontain li:nth-child(18) .tooltip-inner {
    -webkit-transform: translate3d(0,0, 0);
	transform: translate3d(0,0,0);
}
.tooltip-inner a{
     background-color: #018968;
    display: inline-block;
    padding:3px 10px;
    margin:2px 1px;
}
.home .tooltip-inner h2{
    font-size: 20px;
    padding:0;
}
.tooltip:hover .tooltip-inner{
	-webkit-transition-delay: 0.3s;
	transition-delay: 0.3s;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

/* Arrow */
.tooltip-content::after {
	content: '';
	bottom: -20px;
	left: 50%;
	border: solid transparent;
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: transparent;
	border-top-color: #008a6b;
	border-width: 10px;
	margin-left: -10px;
}
.leidenschaft .tooltip-content, .seo .tooltip-content{
    	margin: 0 0 20px -260px;
}
.leidenschaft .tooltip-content::after, .seo .tooltip-content:after {
   left: auto; 
    right: 30px
}

/**** TEAM TOOLTIPP****/
.team-tooltip {
	display: inline;
	position: relative;
	z-index: 999;
}

/* Tooltip */
.tooltip-content-team {
	position: absolute;
	z-index: 9999;
	width: 110px;
	height: 110px;
	padding-top:12px;
	left: 50%;
	margin-left: -55px;
	bottom: 170px;
	border-radius: 50%;
	text-align: center;
	background: #fff;
	color:#315755;
	opacity: 0;
	margin-bottom: 0;
	cursor: default;
	pointer-events: none;
    font-size: 14px;
    line-height: 1.3;
}
.tooltip-content-team i {
	opacity: 0;
    color: #315755;
    font-size: 30px;
    margin-bottom: 8px;
}
.team-tooltip:hover .tooltip-content-team,
.team-tooltip:hover .tooltip-content-team i {
	opacity: 1;
}
.tooltip-effect-1 .tooltip-content-team {
	-webkit-transform: translate3d(0,10px,0) rotate3d(1,1,1,45deg);
	transform: translate3d(0,10px,0) rotate3d(1,1,1,45deg);
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%;
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
}
.tooltip-effect-1 .tooltip-content-team i {
	-webkit-transform: scale3d(0,0,1);
	transform: scale3d(0,0,1);
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
}
.tooltip-effect-2 .tooltip-content-team {
	-webkit-transform: translate3d(0,10px,0);
	transform: translate3d(0,10px,0);
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
}
.tooltip-effect-2 .tooltip-content-team i {
	-webkit-transform: translate3d(0,15px,0);
	transform: translate3d(0,15px,0);
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
}
.tooltip-effect-3 .tooltip-content-team {
	-webkit-transform: translate3d(0,10px,0) rotate3d(0,1,0,90deg);
	transform: translate3d(0,10px,0) rotate3d(0,1,0,90deg);
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%;
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
}
.tooltip-effect-3 .tooltip-content-team i {
	-webkit-transform: scale3d(0,0,1);
	transform: scale3d(0,0,1);
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
}
.tooltip-effect-4 .tooltip-content-team {
	-webkit-transform: translate3d(0,-20px,0);
	transform: translate3d(0,-20px,0);
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
}
.tooltip-effect-4 .tooltip-content-team i {
	-webkit-transform: translate3d(0,20px,0);
	transform: translate3d(0,20px,0);
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
}
.tooltip-effect-5 .tooltip-content-team {
	-webkit-transform: scale3d(0,0,1);
	transform: scale3d(0,0,1);
	-webkit-transform-origin: 50% 100%;
	transform-origin: 50% 100%;
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
}
.tooltip-effect-5 .tooltip-content-team i {
	-webkit-transform: translate3d(0,20px,0);
	transform: translate3d(0,20px,0);
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
}
.team-tooltip:hover .tooltip-content-team,
.team-tooltip:hover .tooltip-content-team i {
	pointer-events: auto;
	-webkit-transform: translate3d(0,0,0) scale3d(1,1,1);
	transform: translate3d(0,0,0) scale3d(1,1,1);
}
.tooltip-effect-1:hover .tooltip-content-team i {
	-webkit-transform: rotate3d(1,1,1,0);
	transform: rotate3d(1,1,1,0);
}
/* Arrow */
.tooltip-content-team::after {
	content: '';
	position: absolute;
	top: 100%;
	left: 50%;
	margin: -7px 0 0 -15px;
	width: 30px;
	height: 20px;
	background: url(../img/tooltip1.svg) no-repeat center center;
	background-size: 100%;
}