/*
Theme Name: Kompass Globales Lernen * Michael Opper Consulting *
Description: by MOC
Version: 1.0
Author:  Elegant Themes
Author URI:     http://www.elegantthemes.com/gallery/divi
Template: Divi
Text Domain: Kompass Globales Lernen 
*/

@import url("../Divi/style.css");

.et_header_style_left #et-top-navigation, .et_header_style_split #et-top-navigation, .et_header_style_left .et-fixed-header #et-top-navigation, .et_header_style_split .et-fixed-header #et-top-navigation {
    padding: 0px 0 0 0 !important;
}

.overlap_moc {
	    margin-top: -20px;

}

/*-Position des Callback Containers / Section*/
#callback { 
    z-index: 999999; /*-Ebene des Containers-*/
	width: 300px;
    max-width: 400px; /*-Containerbreite-*/
    min-height: 80%; /*-Containerhöhe-*/
    top: 0px; /*-Am Browserrand oben ausgerichtet-*/
    position: fixed; /*-fixierte Position-*/
    transition: all 0.8s ease-in-out 0s; /*-Animation-*/
    overflow: scroll; /*-bei zu kleinem Fenster wird gescrollt-*/
}

/*-Postion bei geschlossenen Zustand-*/
.callback-hidden { 
    right: -300px; /*-rechts minus Containerbreite-*/
    transition: all 0.8s ease-in-out 0s; /*-Animation-*/
}

/*-Position bei aktiven Zusatan-*/
.callback-shown { 
    right: 0px; /*-Rechts ausgerichtet-*/
    transition: all 0.8s ease-in-out 0s; /*-Animation-*/
}



.call-back-btn {
   background: transparent;
    border: none;
  cursor: pointer;
    display: block;
}

#callback .call-back-btn {
    width: 100%;
}




#u9654-4:hover {
    box-shadow: -1px 1px 14px rgba(0,0,0,0.5);
    border-style: solid;
    border-width: 1px;
    border-color: #FF4800;
    background-color: #363636;
    padding-top: 14px;
    padding-bottom: 0px;
    min-height: 27px;
    width: 135px;
    margin: -1px -1px 0px 0px;
}

#u9654-4 {
    z-index: 128;
    width: 136px;
    min-height: 28px;
    box-shadow: -1px 1px 14px rgba(0,0,0,0.5);
    background-color: #FF4800;
    border-radius: 3px 3px 0px 0px;
    padding-top: 14px;
    line-height: 9px;
    font-size: 16px;
    text-align: center;
    color: #FFFFFF;
    font-family: lato, sans-serif;
    font-weight: 700;
    -webkit-transform: matrix(0,-1,1,0,141,89);
    -ms-transform: matrix(0,-1,1,0,141,89);
    transform: matrix(0,-1,1,0,141,89);
    position: fixed;
    top: 414px;
    right: 47px;
}

    /*-----------------------------------------------*/
    /*-----Scrolling Image Carousel by Divi Soup-----*/
    /*-----------------------------------------------*/
    /***15 Images***/
    /*Stops the browser creating a horizontal scrollbar*/
    .ds-carousel-section {
        overflow: hidden;
    }
    /*Sets the width of the image modules and floats them so they are next to each other*/
    .ds-carousel-logo {
        width: 20%;
        float: left;
    }
    /*Sets the position and visibility of the rows*/
    .ds-image-carousel {
        float: left;
        position: absolute;
        padding: 0;
        opacity: 0;
        z-index: 0;
    }
    /*Position, visibility and animation settings for the first row*/
    .ds-image-carousel-first {
        position: relative;
        z-index: 1;
        -webkit-animation: first 15s 1 linear forwards;
        animation: first 15s 1 linear forwards;
    }
    /*Animation settings for the rest of the rows*/
    .ds-image-carousel-second,
    .ds-image-carousel-third,
    .ds-image-carousel-fourth {
        -webkit-animation: rest 45s infinite linear;
        animation: rest 45s infinite linear;
    }
    /*Animation delay for the third row*/
    .ds-image-carousel-third {
        -webkit-animation-delay: 15s;
        animation-delay: 15;
    }
    /*Animation delay for the fourth row*/
    .ds-image-carousel-fourth {
        -webkit-animation-delay: 30s;
        animation-delay: 30;
    }
    /*Animation for the continuous scrolling effect*/
    /*First row - this only plays once*/
    @-webkit-keyframes first {
        0% {
            -webkit-transform: translateX(0);
            transform: translateX(0);
            opacity: 1;
            z-index: 1;
        }
        99.99% {
            -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
            opacity: 1;
            z-index: 1;
        }
        100% {
            opacity: 0;
            z-index: 0;
        }
    }
    @keyframes first {
        0% {
            -webkit-transform: translateX(0);
            transform: translateX(0);
            opacity: 1;
            z-index: 1;
        }
        99.99% {
            -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
            opacity: 1;
            z-index: 1;
        }
        100% {
            opacity: 0;
            z-index: 0;
        }
    }
    /*All other rows - these play continuously*/
    @-webkit-keyframes rest {
        0.01% {
            opacity: 0;
            z-index: 0;
        }
        0.011% {
            -webkit-transform: translateX(100%);
            transform: translateX(100%);
            opacity: 1;
            z-index: 1;
        }
        66.66% {
            -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
            opacity: 1;
        }
        100% {
            -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
            opacity: 1;
        }
    }
    @keyframes rest {
        0.01% {
            opacity: 0;
            z-index: 0;
        }
        0.011% {
            -webkit-transform: translateX(100%);
            transform: translateX(100%);
            opacity: 1;
            z-index: 1;
        }
        66.66% {
            -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
            opacity: 1;
        }
        100% {
            -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
            opacity: 1;
        }
    }
    /*Pause all animation on hover*/
    .ds-carousel-section:hover .ds-image-carousel {
        -webkit-animation-play-state: paused;
        animation-play-state: paused;
    }
    /*-----------------------------------------------*/
    /*---End Scrolling Image Carousel by Divi Soup---*/
    /*-----------------------------------------------*/
	
	.rotate .et-pb-icon, .scale .et-pb-icon, .shake .et-pb-icon {
    -webkit-transition: all .2s ease-out;
    -moz-transition: all 0.2s ease-out;
    -ms-transition: all 0.2s ease-out;
    -o-transition: all 0.2s ease-out;
    transition: all 0.5s ease-out;
}
.rotate:hover .et-pb-icon {
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}
 
.scale:hover .et-pb-icon {
-moz-transform: scale(1.2);
-webkit-transform: scale(1.2);
-o-transform: scale(1.2);
transform: scale(1.2);
}
 
.shake:hover .et-pb-icon {
  animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}
 
@keyframes shake {
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }
   
  20%, 80% {
    transform: translate3d(2px, 0, 0);
  }
 
  30%, 50%, 70% {
    transform: translate3d(-4px, 0, 0);
  }
 
  40%, 60% {
    transform: translate3d(4px, 0, 0);
  }
}



.pulse .et_pb_button {
animation-name: pulse;
animation-duration: 5000ms;
transform-origin:70% 70%;
animation-iteration-count: infinite;
animation-timing-function: linear;
}

@keyframes pulse {
0% { transform: scale(1); }
30% { transform: scale(1); }
40% { transform: scale(1.08); }
50% { transform: scale(1); }
60% { transform: scale(1); }
70% { transform: scale(1.05); }
80% { transform: scale(1); }
100% { transform: scale(1); }
}

.pulse .et_pb_button:hover {
animation: none;
}