@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700');

* {
    margin: 0;
    padding: 0;
}

*, *:before, *:after {
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

html, body {
    min-height: 100%;
}


body {
    font-family: 'Roboto',"Lucida Sans","Lucida Grande","Lucida Sans Unicode",sans-serif;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.45;
    background-color: #313131;

	background: #ededed;
	background: -moz-linear-gradient(top, #ededed 0%, #d6d6d6 100%);
	background: -webkit-linear-gradient(top, #ededed 0%,#d6d6d6 100%);
	background: linear-gradient(to bottom, #ededed 0%,#d6d6d6 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#d6d6d6',GradientType=0 );
}


div#ccm-highlighter {
    z-index: 1001;
}



/**
 * Typo
 **********************************************************************************************************************/
h1, h2, h3, h4, h5, h6 {
    margin: .5em 0 1em;
    font-size: 1em;
    font-weight: bold;
    line-height: 1.4;
}


h2 {
    font-size: 1.3em;
    text-transform: uppercase;
}

h3 {
    font-size: 1.1em;
    text-transform: uppercase;
}

h4 {
    margin-bottom: .75em;
}

p {
    margin-bottom: 1em;
}

ul {
    padding: 0 0 0 2em;
}

    ul li {
        margin-bottom: .5em;
    }

.bright {
    color: #ffffff;
}

.dark {
    color: #313131;
}

.primary {
    color: #F4990B;
}

.lead {
    font-size: 1.3em;
    font-weight: 300;
    margin-bottom: 1em;
    display: none;
}

.design_news .lead {
    display: block;
}

.separator {
    height: 41px;
    margin: 2em;
    background: url('../img/separator_orange.png') 50% 50% no-repeat;
}

.highlight {
    padding: 1em 1em .5em;
    background: #ebebeb;
    border: 1px solid #ddd;
    border-radius: 4px 4px 0 0;
    text-align: left;
}

hr {
    border: 0;
    margin: 1.5em 0;
    border-bottom: 1px solid #ddd;
}


.formblock .success {
    border: 1px solid #d6e9c6;
    color: #3c763d;
    background-color: #dff0d8; 
    padding: 5px 10px;
    border-radius: 3px;
    margin-bottom: 1.5em;
}

.formblock .errors {
    border: 1px solid #ebccd1;
    color: #a94442;
    background-color: #f2dede; 
    padding: 5px 10px;
    border-radius: 3px;
    margin-bottom: 1.5em;
}


/* entire container, keeps perspective */
.projects-cards {
	overflow: hidden;

    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;

    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;

    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;

    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.project-card {
	float: left;
	min-height: 675px;
	width: 48.5%;
	margin-bottom: 25px;
}

.project-card:nth-child(odd) {
	float: right;
}

	.project-flipper {
		height: 100%;

		-webkit-transition: 0.6s;
		-webkit-transform-style: preserve-3d;

		-moz-transition: 0.6s;
		-moz-transform: perspective(1000px);
		-moz-transform-style: preserve-3d;

		-ms-transform-style: preserve-3d;
		-ms-transition: 0.6s;

		transition: 0.6s;
		transform-style: preserve-3d;

		position: relative;
	}


/*.project-card:hover .project-flipper,
.project-card.hover .project-flipper {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
}*/
		

/* START: Accommodating for IE */
.project-card:hover .project-content,
.project-card.hover .project-content {
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    transform: rotateY(0deg);
}

.project-card:hover .project-image,
.project-card.hover .project-image {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    transform: rotateY(180deg);
}
		
/* END: Accommodating for IE */


/* hide back of pane during swap */
.project-image,
.project-content {
	background-size: cover;

	-webkit-backface-visibility: hidden;
	-moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;

    -ms-transition: 1s;
    -o-transition: 1s;
    transition: -webkit-transform 1s;
    transition: transform 1s;
    transition: transform 1s, -webkit-transform 1s;

    transform-style: preserve-3d;

    -o-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;

    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;

	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
    align-content: flex-start;
}

/* front pane, placed above back */
.project-image {
	z-index: 2;
	transform: rotateY(0deg);
    -ms-transform: rotate(0deg);
    -webkit-transform: rotateY(0deg);

	padding: 25px;
	background-color: #eee;
	border-radius: 3px;
}

	/* responsive image */
	.project-image img {
		width: 100%;
		height: auto;
		align-self: flex-start;
        margin-bottom: .5em;
	}
 
/* back, initially hidden pane */
.project-content {
    position: relative;
	-webkit-transform: rotateY(-180deg);
	-moz-transform: rotateY(-180deg);
	-o-transform: rotateY(-180deg);
	-ms-transform: rotateY(-180deg);
	transform: rotateY(-180deg);
	padding: 25px;
    background-color: #eee;
	color: #333;
	border-radius: 3px;
    /*max-height: 675px;
    overflow-y: scroll;*/
}

.project-card h4 {
    font-size: 1.4em;
}

/* Projektdetailseite */
.project-result {
    border: 1px solid #F5AD4B;
    background-color: #F9CC91;
    padding: 15px 25px;
    border-radius: 5px;
}

	/* Projekt Klappkarte (Page List) */
	.project-card .project-result {
		border-width: 0;
	    border-top-width: 1px;
	    border-radius: 0 0 5px 5px;
	    position: absolute;
	    left: 0;
	    right: 0;
	    bottom: 0;
	}

/**
 * Custom EOS Icons
 **********************************************************************************************************************/
.icon { background-position: center; background-size: contain; background-repeat: no-repeat; }
.icon-analysis { background-image: url('../img/icons/analysis.png'); }
.icon-badge { background-image: url('../img/icons/badge.png'); }
.icon-chart-arrow { background-image: url('../img/icons/chart-arrow.png'); }
.icon-dashboard { background-image: url('../img/icons/dashboard.png'); }
.icon-diagram-up { background-image: url('../img/icons/diagram-up.png'); }
.icon-happy-team { background-image: url('../img/icons/happy-team.png'); }
.icon-health { background-image: url('../img/icons/health.png'); }
.icon-loop { background-image: url('../img/icons/loop.png'); }
.icon-magic { background-image: url('../img/icons/magic.png'); }
.icon-men-up { background-image: url('../img/icons/men-up.png'); }
.icon-person-heart { background-image: url('../img/icons/person-heart.png'); }
.icon-sale { background-image: url('../img/icons/sale.png'); }
.icon-selection { background-image: url('../img/icons/selection.png'); }
.icon-stairs { background-image: url('../img/icons/stairs.png'); }
.icon-switch { background-image: url('../img/icons/switch.png'); }
.icon-talent { background-image: url('../img/icons/talent.png'); }
.icon-team { background-image: url('../img/icons/team.png'); }
.icon-wheel { background-image: url('../img/icons/wheel.png'); }

.icon-expertise { background-image: url('../img/icons/expertise.png'); }
.icon-leistung { background-image: url('../img/icons/leistung.png'); }
.icon-anspruch { background-image: url('../img/icons/anspruch.png'); }
.icon-potentialanalysen { background-image: url('../img/icons/potentialanalysen.png'); }
.icon-personalentwicklung { background-image: url('../img/icons/personalentwicklung.png'); }
.icon-potentialanalysen-orange { background-image: url('../img/icons/potentialanalysen-orange.png'); }
.icon-managementanalysen { background-image: url('../img/icons/managementanalysen.png'); }
.icon-kunden { background-image: url('../img/icons/kunden.png'); }

/* karriere */
.icon-experten { background-image: url('../img/icons/experten.png'); }
.icon-praktikanten { background-image: url('../img/icons/praktikanten.png'); }
.icon-studenten { background-image: url('../img/icons/studenten.png'); }
.icon-absolventen { background-image: url('../img/icons/absolventen.png'); }

/**
 * Checked - List styles
 **********************************************************************************************************************/
ul.checked,
.highlight ul {
    margin-bottom: 1.5em;
    padding-left: 35px;
    list-style:none;
}

    ul.checked li,
    .highlight ul li {
        margin: 0 0 .5em 0;
        padding: 0;
        font-weight: 400;
    }

    ul.checked li:before,
    .highlight ul li:before {
        font-family: 'FontAwesome';
        content: '\f00c';
        margin:0 10px 0 -35px;
        color: #F4990B;
        font-size: 25px;
    }


/**
 * Links
 **********************************************************************************************************************/
#page a {
    color: #F4990B;
    text-decoration: none;
    transition: all 200ms ease-in-out;
}

#page a:hover,
#page a:active,
#page a:focus {
    color: #313131;
    text-decoration: none;
}


#page .article-btn a {
    background-color: #F4990B;
    color: #fff;
    padding: .5em 1em;
    display: inline-block;
    border-radius: 3px;
}

#page .article-btn a:hover {
    background-color: #313131;
    color: #fff;
}

/**
 * Page Layout
 **********************************************************************************************************************/
#page {
    position: relative;
    min-height: 100%;
    color: #313131;
    overflow: hidden;
}

    .wrapper {
        max-width: 1100px;
        margin: 0 auto;
        padding-left: 20px; 
        padding-right: 20px;
    }

/*rahmen
body {
	background-color: #fff;
}
#page {
	max-width: 1300px;
	margin: 0 auto;
	border-right: 1px solid #ccc;
}*/

/**
 * Meta Header
 **********************************************************************************************************************/
#meta-header {
    background: #333;
    background-color: #AAA;
}

    #meta-header ul {
        list-style: none;
        margin: 0;
        padding: 0;
        text-align: right;
    }

        #meta-header ul li {
            display: inline-block;
            margin: 0;
        }

            #meta-header ul li a {
                display: inline-block;
                padding: .5em 15px .5em 0;
                text-transform: uppercase;
                font-size: .85em;
                color: #fff;
            }

            #meta-header ul li a:hover {
                color: #fff;
            }

/**
 * Header
 **********************************************************************************************************************/
#header {
    position: relative;
    width: 100%;
    z-index: 30;
    border-bottom: 3px solid #F4990B;
}

#header.fixed {
    position: fixed;
    top: 0;
    left: 0;
}

    #menu {
        display: none;
        width: 100%;
        height: 100%;
    }


/**
 * Drop Down Navigation
 ******************************************************************************************************************/
#dd-nav {
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ededed+0,d6d6d6+100 */
    background: #ededed; /* Old browsers */
    background: -moz-linear-gradient(top, #ededed 0%, #d6d6d6 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ededed 0%,#d6d6d6 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ededed 0%,#d6d6d6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#d6d6d6',GradientType=0 ); /* IE6-9 */
    position: relative;
}

#dd-nav:after {
    content: '';
    display: table;
    clear: both;
}


    /* Logo */
    #dd-nav .logo {
        margin: 0;
        padding: 0;
        float: left;
        line-height: 70px;
        transition: line-height 200ms ease-in-out;
    }

        #dd-nav .logo img {
            display: inline-block;
            max-height: 50px;
            width: auto;
            height: auto;
            vertical-align: middle;
            transition: max-height 200ms ease-in-out;
        }

    /* mobile nav toogle */
    #dd-nav #nav-toggle {
        float: right;
        display: none;
        font-size: 32px;
        line-height: normal;
        padding: .1em .25em;
        margin-top: 10px;
        color: #F4990B;
        background: transparent;
        border: 1px solid #ccc;
        border-radius: 3px;
    }

    .open #dd-nav #nav-toggle {
        background: #F4990B;
        color: #fff;
    }

    .fixed #dd-nav #nav-toggle {
        font-size: 22px;
    }


/* level 1 */
#dd-nav ul {
    float: right;
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: center;
}

    #dd-nav ul li {
        position: relative;
        display: inline-block;
        margin-bottom: 0;
        margin-left: 1px;
    }

        #dd-nav ul li a {
            padding: 0 15px;
            display: inline-block;
            color: #313131;
            line-height: 70px;
        }

        #dd-nav ul li:hover > a,
        #dd-nav ul li a:hover {
            background: rgba(255,255,255,.35);
        }

        #dd-nav .wrapper > ul > .nav-path-selected > a,
        #dd-nav .wrapper > ul > .nav-path-selected > a:hover  {
            color: #fff;
            background: #F4990B;

            background: -webkit-linear-gradient(top,  rgba(244,153,11,1) 0%,rgba(253,198,0,1) 50%,rgba(244,153,11,1) 100%); /* Chrome10-25,Safari5.1-6 */
            background: linear-gradient(to bottom,  rgba(244,153,11,1) 0%,rgba(253,198,0,1) 50%,rgba(244,153,11,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4990b', endColorstr='#f4990b',GradientType=0 ); /* IE6-9 */
        }

            #dd-nav ul > li.hasSubmenu > a:after {
                font-family: FontAwesome;
                width: 1.2em;
                content: "\f107";
                margin-left: 5px;
                display: inline-block;
            }

/* level 2 */
#dd-nav ul li ul {
    border-top: 3px solid #F4990B;
    background: rgb(255,255,255);
    position: absolute;
    top: 100%;
    left: 0;
    display: none;
    max-width: 285px;
    min-width: 200px;
    text-align: left;
    font-size: 14px;
    border-radius: 0 0 3px 3px;
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
}

    #dd-nav ul li:hover ul {
        display: block;
    }

    #dd-nav ul ul li {
        display: block;
        margin: 0;
    }

        #dd-nav ul ul li a {
            display: block;
            padding: 10px 15px;
            border-bottom: 1px solid #ccc;
            line-height: 1.2;
        }


        #dd-nav ul ul li a:hover,
        #dd-nav ul ul li.nav-selected a {
            color: #F4990B;
            background: transparent;
        }

        #dd-nav ul ul li:last-child a {
            border-radius: 0 0 3px 3px;
            border: 0;
        }

/* Fixed Header*/
.fixed #dd-nav .wrapper > ul > li > a {
    line-height: 50px;
}

.fixed #dd-nav .logo {
    line-height: 50px;
}

.fixed #dd-nav .logo img {
    max-height: 35px;
}

/**
 * Site content
 **********************************************************************************************************************/
#site-content {
    position: relative;
    z-index: 20;
    font-size: 1.1em;
}

    .pageID_1 #site-content {
        /*margin-top: -210px;*/ /* navigation ueberlagern */
    }

    /* Beim Layout "Volle Breite" den Text im Inhaltsbereich zentrieren */
    .design_full #site-content {
        /*text-align: center;*/
    }

    /* Beim Layout "Volle Breite" den Text im Inhaltsbereich zentrieren */
    .design_full #site-content .ccm-layout {
        text-align: left;
    }


    /**
     * Breadcrumb
     *******************************************************************************************************************/
    #breadcrumb {
        display: none;
        border-radius: 3px;
        overflow: hidden;
        padding: .5em 1em;
        margin: 0 0 1.5em 0;
        line-height: normal;
        background-color: rgba(255,255,255,.25);
    }

        #breadcrumb > strong {
            float: left;
            font-weight: bold;
            display: inline-block;
            margin-right: 1em;
        }

        #breadcrumb ol {
            float: left;
            padding: 0;
            margin: 0;
            list-style: none;
        }

            #breadcrumb ol li {
                display: inline-block;
            }

                #breadcrumb ol li a,
                #breadcrumb ol li span {
                    float: left;
                    display: inline-block;
                    text-decoration: none;
                    color: #666;
                }

                #breadcrumb ol li span {
                    color: #313131;
                }

                    #breadcrumb ol li a:after {
                        display: inline-block;
                        font: normal normal normal 14px/1 FontAwesome;
                        font-size: inherit;
                        text-rendering: auto;
                        -webkit-font-smoothing: antialiased;
                        -moz-osx-font-smoothing: grayscale;
                        content: "\f105";
                        margin: 0 5px;
                    }

/**
 * Intro Headline
 **********************************************************************************************************************/
#headline {
    color: #fff;
    font-size: 1.8em;
    text-align: left;
    display: inline-block;
    z-index: 50;
    margin: 0;
    max-width: 50%;

    position: absolute;
    top: 20%;
    left: 15%;

    visibility: hidden;
}

    #headline span {
        display: block;
        position: relative;
        z-index: 30;
        background-color: rgba(255,255,255,.15);
        text-transform: uppercase;
        padding: .5em 1em;
    }

    /* Auf Seite "Über uns" Pfeil nach unten ausblenden um Platz für die Lampe zu machen. */
    .pageID_124 #headline:after {
        display: none;
    }

/**
 * Slider Area
 **********************************************************************************************************************/
.slider {
    text-align: center;
    visibility: hidden;
}

.slick-initialized {
    visibility: visible;
}

    .slider .slide {
        position: relative;
    }

        .slider .slide img {
            display: block;
            width: 100%;
            height: auto;
        }

        .slide-title {
            position: absolute;
            bottom: 65px;
            left: 1em;
            right: 1em;
            margin: 0;
            text-transform: none;
            font-size: 1.8em;
            font-weight: 300;
        }

            .slide-title span {
                padding: .5em;
                background: rgba(255,255,255,.55); 
                border-top: 3px solid rgba(0,0,0,.35);
                border-bottom: 3px solid rgba(0,0,0,.35);
                display: inline-block;
            }

            .slide-title span strong {
                display: block;
                text-transform: uppercase;
                font-size: .75em;
            }


/* Slide Title Transitions - see the slick slider callbacks */
.activate {
    -moz-opacity: 1;
    -khtml-opacity: 1;
    -webkit-opacity: 1;
    opacity: 1;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=1 * 100);
    filter: alpha(opacity=1 * 100);
}
.animated {
    -moz-opacity: 0;
    -khtml-opacity: 0;
    -webkit-opacity: 0;
    opacity: 0;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(opacity=0 * 100);
    filter: alpha(opacity=0 * 100);
}


/**
 * Main Content Area
 ******************************************************************************************************************/
#main-content {
    position: relative;
    background-color: #fff;
    padding: 5em 0;
    box-shadow: 0px 0px 8px rgba(0,0,0,0.25);
    z-index: 600;
}

.design_full #content,
.design_project #content,
.design_seminar #content {
    float: none;
    width: 100%;
}

    .hasIconHeadline #main-content {
        padding-top: 0;
    }


    /**
     * Icon headline 
     **************************************************************************************************************/
    .icon-headline {
        text-align: center;
        margin: 0 0 3.5em 0;
        text-transform: uppercase;
        font-weight: normal;
    }

        /*  */
        .icon-headline i {
            color: #F4990B;
            position: relative;
            display: inline-block;
            padding: 20px 15px 20px;
            font-size: 80px;
        }

            /* fa-icon */
            .icon-headline i:before {
                position: relative;
                z-index: 41;
            }

            /* hintergrund raute des icons */
            .icon-headline i:after,
            .icon-headline span.icon:after {
                display: inline-block;
                content: '';
                background: url(../img/icon-headline-arrow.png) 0 0 no-repeat;
                background-size: 100px 50px;
                position: absolute;
                top: -50px;
                left: 50%;
                margin-left: -50px;
                width: 100px;
                height: 100px;
                z-index: 40;
            }


        /*  */
        .icon-headline span.icon {
            color: #F4990B;
            position: relative;
            display: inline-block;
            margin: 0;
            height: 80px;
            width: 80px;
        }

        .icon-headline span {
            display: block;
            position: relative;
            z-index: 42;
        }

            .icon-headline strong {
                display: block;
                color: #F4990B;
                font-weight: normal;
            }


    /**
     * Content columns
     **************************************************************************************************************/
    #content-row {
        overflow: hidden;
    }

        #sidebar {
            float: left;
            width: 30%;
        }

        #content {
            float: right;
            width: 68%;
        }


/**
 * Unterseite Navigation
 **************************************************************************************************************/
.content .nav {
    padding: 0;
    margin: 0;
    text-align: center;
}

    .content .nav li {
        display: inline-block;
    }

    .content .nav li a {
        display: inline-block;
        background: url('../img/separator_orange.png') 100% 50% no-repeat;
        background-size: 16px;
        padding: 0 32px 0 0;
        margin: 0 16px 0 0;
    }

    .content .nav li:last-child a {
        background: none;
        padding: 0;
        margin: 0;
    }


/**
 * Sitemap
 **************************************************************************************************************/
.sitemap {
    padding: 0;
    margin: 0;
}

.sitemap ul {
    margin: 1em 0 1em 1.5em;
}


    .sitemap li a {
        display: block;
    }

    .sitemap > li > a {
        font-weight: bold;
        font-size: 1.2em;
        display: block;
        border-bottom: 1px solid #ddd;
        padding: 0.25em;
        color: #333;
    }

    .sitemap > li > a:before {
        display: inline-block;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        content: "\f105";
        margin: 0 5px 0 0;
    }

/**
 * Partner
 **************************************************************************************************************/
.partner {
    overflow: hidden;
    padding: 0 0 2em 0;

}


.partner-data {
    padding: 1em 1em;
    border: 1px solid #ddd;
    border-radius: 4px 4px 0 0;
    font-size: .85em;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ededed+0,d6d6d6+100 */
    background: #ededed; /* Old browsers */
    background: -moz-linear-gradient(top, #ededed 0%, #d6d6d6 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ededed 0%,#d6d6d6 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ededed 0%,#d6d6d6 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#d6d6d6',GradientType=0 ); /* IE6-9 */
 
}

.partner-data .logo {
    text-align: center;
    margin-bottom: 1.5em;
}

.partner-data .logo img {
    width: 100%;
}

.partner-data strong {
    width: 100px;
    display: inline-block;
}


/* Partner Page List */

.partner-list .partner-data {
    float: left;
    width: 30%;
}

.partner-list .partner-content {
    float: right;
    width: 68%;
}


/**
 * Additional Content Areas (Aktiviert über die Seitenattribute)
 ******************************************************************************************************************/
.extra-content-section {
    color: #313131;
    position: relative;
    padding: 5em 0;
    box-shadow: 0px 0px 8px rgba(0,0,0,0.25);
}

.extra-content-section:nth-child(even) {
    color: #313131;
    background-color: #fff;
}

/*.design_full .extra-content-section {
    text-align: center;
}*/

/* wenn layouts aktiv sind text links ausrichten */
.extra-content-section .ccm-layout-wrapper {
    text-align: left;
}



/**
 * Sidebar Navigation
 ******************************************************************************************************************/
#sidebar .nav {
    margin: 0 0 1em;
    list-style: none;
}

    #sidebar .nav > li {
        padding: 0;
        margin: 0;
        background: rgba(255,255,255,.25);
        margin-bottom: 1px;
        -webkit-transition: all 150ms linear;
        -moz-transition: all 150ms linear;
        -ms-transition: all 150ms linear;
        -o-transition: all 150ms linear;
    }

        #sidebar .nav li a {
            display: block;
            padding: .5em 1em;
            color: #313131;
        }

        #sidebar .nav > li.nav-path-selected,
        #sidebar .nav > li:hover {
            background: rgba(255,255,255,.5);
        }

        #sidebar .nav > li:first-child {
            border-radius: 3px 3px 0 0;
        }

        #sidebar .nav > li:last-child {
            border-radius: 0 0 3px 3px;
        }

            #sidebar .nav ul {
                list-style: inherit;
                padding: 0 0 1em 2.5em;
                font-size: .85em;
            }

            #sidebar .nav ul > li > a {
                background: transparent;
                padding: 0;
                margin: 0;
            }

            #sidebar .nav ul > li.nav-path-selected > a {
                font-weight: bold;
            }

                #sidebar .nav ul > li > a:before {
                    display: inline-block;
                    font: normal normal normal 14px/1 FontAwesome;
                    font-size: inherit;
                    text-rendering: auto;
                    -webkit-font-smoothing: antialiased;
                    -moz-osx-font-smoothing: grayscale;
                    content: "\f105";
                    margin: 0 5px 0 0;
                }



/**
 * News Teaser
 **********************************************************************************************************************/
.news-teaser-list {
    margin: 0 0 1.5em;
    list-style: none;
    padding: 0
}

    .news-teaser-list li {
        margin: -1px 0 0;
        padding: 1.5em;
        background: rgba(209,209,209,.1);
        font-size: .85em;
        border: 1px solid #ddd;
    }


    .news-teaser-list li:first-child {
        margin: 0;
        border-radius: 3px 3px 0 0;
    }

    .news-teaser-list li:last-child {
        border-radius: 0 0 3px 3px;
    }

        .news-teaser-list li a {
            display: block;
        }

        .news-teaser-list li p {
            margin: 0 0 .5em;
        }


/**
 * Home News Teaser
 **********************************************************************************************************************/
/*.pageID_1 .section-2 {
    background: #fff;
}*/

.pageID_1 .news-teaser-list {
    display: table;
    width: 100%;
    border-collapse: collapse;
}

    .pageID_1 .news-teaser-list li {
        font-size: 1em;
        display: table-cell;
        width: 33.3%;
        border-radius: 0;
        background: rgba(255,255,255,.85);
    }

    .pageID_1 .news-teaser-date {
        font-size: .85em;
        color: #666;
    }


/**
 * Teaser
 ******************************************************************************************************************/
.teaser {
    margin-bottom: 2.5em;
}

    .teaser h3 a  {
        color: #313131 !important;
        transition: all 300ms linear;
    }

    .teaser .icon {
        background-color: #313131;
        color: #fff;
        padding: .5em;
        border-radius: 100%;
        height: 75px;
        width: 75px;
        font-size: 30px;
        text-align: center;

        float: right;
        margin: 0 0 15px 15px;
        transition: all 300ms linear;
    }

    .teaser .icon span {
        width: 100%;
        height: 100%;
        display: block;
        background-size: contain;
        line-height: 45px;
    }

    .teaser:hover .icon {
        background-color: #F4990B;
    }

    .ccm-layout-col-2 .teaser .icon {
        float: left;
        margin: 0 15px 15px 0;
    }

    .teaser:hover h3 a  {
        color: #F4990B !important;
    }

    .teaser-content {
        margin-right: 90px;
        text-align: right;
    }

    .ccm-layout-col-2 .teaser-content {
        margin-right: 0;
        margin-left: 90px;
        text-align: left;
    }

        #page .teaser-btn {
            background-color: #ccc;
            color: #333;
            padding: .25em .5em;
            display: inline-block;
            border-radius: 3px;
        }

        #page .teaser-btn:hover {
            background-color: #313131;
            color: #fff;
        }

.eos, .eos a {
    color: #F4990B;
    font-weight: 600;
}

/**
 * Logo Slider
 ******************************************************************************************************************/
.client-slider {
    background-color: #fff;
    margin: 1em 0 5em 0;
    padding: 1em;
    box-shadow: 0px 0px 8px rgba(0,0,0,0.25);
    color: #313131;
    text-align: center;
    line-height: 85px;
}

        .logo-item img {
            display: inline-block;
            vertical-align: middle;
            max-height: 85px;
            max-width: 90%;
            width: auto;
            height: auto;
        }


.client-slider-headline {
    margin-top: 4em;
    text-align: center;
}

    .client-slider-headline span:not(.dark) {
        display: block;
        color: #666;
        font-weight: 400;
    }

/**
 * Tab Module
 **********************************************************************************************************************/
.tab-section {
    margin: 1.5em 0;
    zoom: 1;
}

    .tab-section:before,
    .tab-section:after {
        content: "";
        display: table;
        clear: both;
    }

    /* Tabs Menu */
    .tab-section .tabs-menu {
        margin: 0 0 1.5em;
        padding: 0;
        list-style: none;
        text-align: center;
        font-size: 14px;
    }

        /* tab menu item */
        .tab-section .tabs-menu li {
            vertical-align: top;
            display: inline-block;
            padding: 25px;
            line-height: 1.3;
            margin-right: .5em;
            text-decoration: none;
            border-radius: 100%;
            text-align: center;
            width: 160px;
            height: 160px;
            cursor: pointer;
            hyphens: auto;

            -webkit-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75);
            -moz-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75);
            box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.75);

            transition: all 300ms ease-in-out;
        }

        /* tab hover menu item */
        .tab-section .tabs-menu li:hover {
            background-color: #fff;
        }

        /* tab active menu item */
        .tab-section .tabs-menu li.active {
            background-color: #313131;
            color: #F4990B;

            -webkit-box-shadow: inset 0px 0px 9px 0px rgba(0,0,0,0.75);
            -moz-box-shadow: inset 0px 0px 9px 0px rgba(0,0,0,0.75);
            box-shadow: inset 0px 0px 9px 0px rgba(0,0,0,0.75);
        }

        /* tab menu icon */
        .tab-section .tabs-menu li > span {
            display: table-cell;
            vertical-align: middle;
            height: 110px;
            width: 110px;
        }

        /* tab menu icon */
        .tab-section .tabs-menu li i {
            font-size: 3em;
            display: block;
            margin-bottom: 10px;
        }

    /* Tabs Content */
    .tabs-content {
        
    }


/* Tab-Styles für Seminar-Detail Seite */
.tab-seminare .tabs-menu  {
    text-align: left;
    border-bottom: 1px solid #ccc;
    overflow: hidden;
    font-size: 1em;
    margin-bottom: 0;
}

    .tab-seminare .tabs-menu li {
        vertical-align: baseline;
        display: block;
        float: left;
        padding: .5em 1em;
        margin: 0 1px 0 0 !important;
        border-radius: 3px 3px 0 0;
        text-align: left;
        width: auto;
        height: auto;
        hyphens: auto;

        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;

        transition: all 300ms ease-in-out;
        font-weight: 400;
        background-color: #DDD;
    }

    /* tab hover menu item */
    .tab-seminare .tabs-menu li:hover {
        background-color: #CCC;
    }

    .tab-seminare .tabs-menu li.active {
        background: #333;
        color: #fff;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }

    .tab-seminare .tab-content {
        padding-top: 1em;
    }

    #tab-detail {
        padding-top: 0;
    }


#page .inline-btn {
    background-color: #F4990B;
    color: #fff;
    padding: .25em .25em;
    margin: 0 .15em;
    border-radius: 3px;
}

	#page .inline-btn:after {
		display: inline-block;
		font: normal normal normal 14px/1 FontAwesome;
		font-size: inherit;
		text-rendering: auto;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		text-align: right;
		content: "\f054";
		margin-left: 5px;
        line-height: inherit;
	}



/**
 * Ueber uns - counting numbers
 ********************************************************************************************************************/
.count-elements {
    overflow: hidden;
    width: 100%;
    text-align: center;
    padding: 2em;
    margin-bottom: 2em;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

    .count-element {
        float: left;
        width: 33.3%;
        margin-bottom: 2em;
        padding: .25em;
    }

        .count-element > i {
            font-size: 3em;
            margin-bottom: .25em;
            color: #F4990B;
        }

        .count-element > strong {
            display: block;
            font-size: 1.5em;
            text-align: center;
        }

        .count-element > span {
            display: block;
            font-size: .8em;
    	}

    	.count-element-teilnehmer strong:after,
    	.count-element-coachings strong:after {
            display: inline-block;
            content: "+";
            font-weight: bold;
            margin: 0 0 0 5px;
        }

/**
 * Mitarbeiter Profile
 **********************************************************************************************************************/
.profile {
	overflow: hidden;
    margin-bottom: 3.5em;

    border: 1px solid #ededed;
    padding: 1.5em;
    border-radius: 4px 4px 0 0;
}

	.profile-image {
		float: left;
	}

		.profile-image img {
			max-width: 170px;
			max-height: 170px;
            height: auto;
			display: inline-block;
		}

	.profile-content {
		margin-left: 190px;
		color: #666;
	}

	.profile-name {
		margin-top: 0;
		color: #313131;
	}

    .profile-name span {
        display: block;
        font-size: .75em;
        color: #666;
        font-weight: 400;
    }

		.profile-motto {
			margin: 2em 0 1em;
			padding: 30px 45px;
			font-family: Georgia, serif;
			font-style: italic;
			position: relative;
            text-align: center;
            background: #eee;
            border-radius: 5px;
		}

		/*.profile-motto:before {
			display: block;
			content: "\201C";
			font-size: 40px;
			position: absolute;
			left: 0;
			top: -15px;
			color: #7a7a7a;
		}*/

        .profile-motto:before {
            font-size: 3em;
            content: '„';
            color: #666;
            font-family: Georgia, serif;

            position: absolute;
            bottom: 10px;
            left: 15px;
        }

        .profile-motto:after {
            font-size: 3em;
            content: '“';
            color: #666;
            font-family: Georgia, serif;

            position: absolute;
            top: 10px;
            right: 15px;
        }

		.profile-description {

		}

		.profile-data dt {
			font-weight: bold;
			width: 85px;
			float: left;
		}

		.profile-data dd {
			margin-left: 100px;
			margin-bottom: .5em;
		}

		.profile-data {
			font-size: 14px;
		}

		dt.profile-tel:before,
        dt.profile-email:before {
			display: inline-block;
            font: normal normal normal 14px/1 FontAwesome;
            font-size: inherit;
            text-rendering: auto;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            content: "\f095";
            margin: 0 5px 0 0;
		}

		dt.profile-email:before{
            content: "\f003";
		}


/**
 * Seitennavigation (Next/Prev für Leistungen Detailseite)
 **********************************************************************************************************************/    
#page .ccm-next-previous-wrapper {
	margin: 3em 0;
}

	#page .ccm-next-previous-wrapper a {
		background-color: #eee;
		color: #333;
	    padding: .25em .5em;
	    display: inline-block;
	    border-radius: 3px;
	}

	#page .ccm-next-previous-wrapper a:hover {
		background-color: #F4B009;
		color: #fff;
	}

		#page .ccm-next-previous-wrapper a:after,
		#page .ccm-next-previous-wrapper a:before {
			display: inline-block;
			font: normal normal normal 14px/1 FontAwesome;
			font-size: inherit;
			text-rendering: auto;
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
	        line-height: inherit;
		}

		#page .ccm-next-previous-parentlink a:before {
			content:"\f077";
			text-align: center;
			margin-right: 5px;
		}

		#page .ccm-next-previous-previouslink a:before {
			content:"\f053";
			text-align: left;
			margin-right: 5px;
		}

		#page .ccm-next-previous-nextlink a:after {
			content:"\f054";
			text-align: right;
			margin-left: 5px;
		}

		#page .ccm-next-previous-previouslink {
			width: 33.3%;
			text-align: left;
		}

		#page .ccm-next-previous-nextlink {
			width: 33.3%;
			text-align: right;
			float: right;
		}

		#page .ccm-next-previous-parentlink {
			width: 33.3%;
			float: none;
			margin: 0 auto;
			text-align: center;
		}

			.ccm-next-previous-previouslink,
			.ccm-next-previous-parentlink,
			.ccm-next-previous-nextlink {
			    float: left;
			    width: 33.33333331;
			}


/**
 * Referenzliste
 **********************************************************************************************************************/    
.projects-list .project:after {
    content: '';
    display: block;
    clear: both;
}

.project {
    margin-bottom: 2em;
}

    .projects-list .project .project-image {
        float: left;
        margin: 0 15px 5px 0;
    }

    .projects-list .project-content {
        margin-left: 330px;
    }

    .project-client {
        color: #666;
    }

    #page .projects-list .active .article-btn a {
        background-color: #333;
    }
    #page .projects-list .active .article-btn a:after {
		content: "\f077";
    }
    
	.project .article-btn a:after {
		display: inline-block;
		font: normal normal normal 14px/1 FontAwesome;
		font-size: inherit;
		text-rendering: auto;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		width: 1.28571429em;
		text-align: center;
		content: "\f078";
		margin-left: 5px;
        line-height: inherit;
	}

	.project-client:before {
		display: inline-block;
		font: normal normal normal 14px/1 FontAwesome;
		font-size: inherit;
		text-rendering: auto;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		width: 1.28571429em;
		text-align: center;
		content: "\f007";
		margin-right: 5px;
        line-height: inherit;
	}

/**
 * Collapse/Accordeon module
 **********************************************************************************************************************/    
.collapse-item {
	margin-bottom:1em;
	text-align: left;
}

	.collapse-item .collapse-title {
		margin: 0;
		padding: .75em 1em;
		background-color: #ddd;
		font-size: 1em;
		font-weight: 600;
		cursor: pointer;
        border-radius: 3px;
        hyphens: auto;
	}

	.collapse-item .collapse-title:after {
		float: right;
		display: inline-block;
		font: normal normal normal 14px/1 FontAwesome;
		font-size: inherit;
		text-rendering: auto;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		width: 1.28571429em;
		text-align: center;
		content: "\f067";
		margin-right: 5px;
        line-height: inherit;
	}

	.collapse-item.active {
		border: 1px solid #F4990B;
        border-radius: 3px 3px 0 0;
	}

    	.collapse-item.active .collapse-title {
    		background-color: #F4990B;
    		color: #fff;
            border-radius: 2px 2px 0 0;
    	}

        	.collapse-item.active .collapse-title:after {
        		content: "\f068"
        	}

	.collapse-item .collapse-content {
		padding: 1em;
        overflow: hidden;
	}

    /* Collapse Icons */
    .collapse-item .icon {
        width: 150px;
        height: 150px;
        float: left;
        background-color: #878785;
        border-radius: 100%;
        background-size: 50%;
        background-position: 50% 50%;

        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#cccccc+0,a0a09f+50,cccccc+100 */
        background: #cccccc; /* Old browsers */
        background: -moz-linear-gradient(top, #cccccc 0%, #a0a09f 50%, #cccccc 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top, #cccccc 0%,#a0a09f 50%,#cccccc 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom, #cccccc 0%,#a0a09f 50%,#cccccc 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
    }

    /* Collapse Icons */
    .collapse-item .icon {
        width: 150px;
        height: 150px;
        float: left;
        background-color: #878785;
        border-radius: 100%;
        background-size: 50%;
        background-position: 50% 50%;
        position: relative;
    }

        .collapse-item .icon i {
            width: 90px;
            height: 90px;
            background-size: 100%;
            background-position: 50%;
            position: absolute;
            top: 50%;
            left: 50%;
            margin: -45px 0 0 -45px;
        }

    .collapse-item .icon-margin {
        margin-left: 175px;
    }


/**
 * Seminar page list (teaser)
 **********************************************************************************************************************/
.seminar-list {
    overflow: hidden;
    margin: 0;
    padding: 0;
}

.seminar-list .seminar-teaser {
    float: left;
    width: 33.333333312%;
    padding: .5em;
    list-style: none;
}

    #page .seminar-teaser a {
        margin-bottom: 1em;
        display: block;

        color: #fff;
        background-color: #F4990B;
        border-color: #C97C0A;
        border-radius: 3px;
        padding: 1em;
        text-align: center;

        min-height: 380px;
    }

    #page #item-155 a {
        background-color: #1D7B96;
        color: #fff;
    }

    #page #item-155 a:hover {
        background-color: #18677E;
        color: #fff;
    }

    #page .seminar-teaser a:hover {
        background-color: #C97C0A;
    }

        .seminar-image {
            margin: 1em 0;
        }

        #page .seminar-teaser a span {
            font-size: .85em;
        }

        #page .seminar-teaser a span,
        #page .seminar-teaser a strong {
            display: block;
        }

        #page .seminar-teaser a strong {
            margin-bottom: 1em;
            font-size: 1.2em;
        }


/**
 * Seminar page
 **********************************************************************************************************************/
.event-meta {
    overflow: hidden;
    margin-bottom: 1em;
    border: 1px solid #ccc;
    border-radius: 0 0 3px 3px;
    padding: 1em;

    border-top: 0;

    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,eeeeee+100 */
    background: #ffffff; /* Old browsers */
    background: -webkit-linear-gradient(top, #ffffff 0%,#eeeeee 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ffffff 0%,#eeeeee 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

    .event-meta dl {
        float: left;
        width: 20%;
        padding-right: 15px;
    }

    .event-meta dl:last-child {
        padding-right: 0;
    }

        .event-meta dt {
            color: #666;
            font-weight: 400;
            display: block;
            margin: 0 0 .5em;
        }

        .event-meta dt:before {
            display: inline-block;
            font: normal normal normal 14px/1 FontAwesome;
            font-size: inherit;
            text-rendering: auto;
            -webkit-font-smoothing: antialiased;
            -moz-osx-font-smoothing: grayscale;
            content: "\f017";
            margin: 0 5px 0 0;
            -webkit-transition: all 150ms linear;
            -moz-transition: all 150ms linear;
            -ms-transition: all 150ms linear;
            -o-transition: all 150ms linear;
        }

        .event-meta .event-ort dt:before {
            content: "\f041";
        }

    dl.event-dauer dd,
    dl.event-ort dd {
        display: inline-block;
        padding: .2em .45em;
        background-color: #DDD;
        border-color: #CCC;
        border-radius: 3px;
    }

    dl.event-dates {
        width: 60%;
    }

        dl.event-dates dt:before {
            content: "\f073";
        }

        dl.event-dates dd ul {
            list-style: none;
            margin: 0 0 .5em 0;
            padding: 0;
            overflow: hidden;
        }

        .pageID_154 dl.event-dates dd ul,
        .pageID_155 dl.event-dates dd ul {
            display: inline-block;
            margin: 0 .5em .5em 0;
        }


        dl.event-dates dd ul li {
            display: inline-block;
            margin: 0 1px 1px 0;
            padding: 0;
            float: left;
        }

            #page dl.event-dates ul li a {
                display: block;
                float: left;
                padding: .2em .45em;
                color: #313131;
                background-color: #DDDDDD;
            }

            #page dl.event-dates ul li a span {
                display: block;
                padding: 3px 0;
                font-size: 11px;
                text-transform: uppercase;
                font-weight: 400;
            }

            #page dl.event-dates ul li:first-child a {
                color: #fff;
                background-color: #F4990B;
                border-top-left-radius: 3px;
                border-bottom-left-radius: 3px;
            }

            #page dl.event-dates ul li:last-child a {
                border-top-right-radius: 3px;
                border-bottom-right-radius: 3px;
            }

            #page dl.event-dates ul li a:hover {
                background-color: #333;
                color: #fff;
            }

/**
 * File Object
 **********************************************************************************************************************/
.file-download {
    padding: 1em;
    border: 1px solid #C97C0A;
    border-radius: 3px;
    margin-bottom: 1.15em;
}

    .file-download h4 {
        margin-top: 0;
    }

        .file-download h4 a {
            display: block;
        }

    .file-download p {
        color: #666;
        margin: 0;
    }


/**
 * Form fields
 **********************************************************************************************************************/
/* Anmeldung */
#formblock222 {
    max-width: 1000px;
    overflow: hidden;
    margin: 0 auto;
}

.field {
    margin-bottom: 1em;
    overflow: hidden;
    float: left;
    width: 50%;
    padding: .5em;
}


    #page input, #page textarea, #page select {
        display: block;
        width: 100%;
        padding: .3em .5em;
        border: 1px solid #AAA;
        font-family: inherit;
        font-size: inherit;
        box-sizing: inherit;
        border-radius: 3px;
        background-color: #fff;
    border-left-width: 3px;
    }

    #page label {
        display: block;
        padding: .3em 0;
        font-weight: 600;
        margin-bottom: .25em;
    }

    #page .captcha {
        clear: both;
        padding: .5em;
        max-width: 65%;
    }

        #page .captcha input {
            clear: both;
            padding: .5em;
        }

#page .submit {
    background: #F4990B;
    border-color: #C97C0A;
    display: inline-block;
    float: right;
    width: auto;
    color: #fff;
    font-weight: bold;
}

#page textarea:focus,
#page select:focus,
#page input:focus {
    border-color: #F4990B;
    border-left-width: 3px;
    outline: none;
}


#page .field-radios .radioList {
}

    #page .field-radios .radioList label,
    #page .field-radios .radioList input {
        float: none;
        width: auto;
        padding: 0;
        display: inline-block;
        cursor: pointer;
    }

    .radioPair {
        display: block;
    }


/**
 * Anmeldung - Kostenmodule
 **********************************************************************************************************************/
.eos-module {
    display: table;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    border-collapse: collapse;
    margin-bottom: 1em;
}

    .eos-modul {
        border-collapse: collapse;
        border: 1px solid #ddd;
        border-radius: 3px;
        margin-right: 20px;
        padding: 1em;
        background: #eee;
        text-align: center;
        width: 100%;
    }

    .eos-modul:last-child {
        margin-right: 0;
        
    }

        .eos-modul span {
            display: block;
            font-size: .85em;
        }

        .eos-modul .eos-modul-titel {
            font-size: 1.25em;
            font-weight: 300;
            margin: 0 0 .25em;
            text-transform: none;
        }

        .eos-modul .eos-modul-type {
            color: #666;
            font-weight: 300;
        }

        .eos-modul .eos-modul-price {
            color: #F4990B;
            display: block;
            font-size: 1.5em;
            font-weight: 600;
            margin: .35em auto;
        }




/**
 * Sidebar Tools
 **********************************************************************************************************************/
#sidebar-tools {
    position: fixed;
    top: 175px;
    right: -400px;
    width: 400px;
    height: auto;
    z-index: 200;

    transition: all 300ms linear;
    padding: 15px 15px 0;
    background-color: #eee;
    box-shadow: 0px 0px 8px rgba(0,0,0,0);
}

/* body class active */
.st-active #sidebar-tools {
    right: 0;
    box-shadow: 0px 0px 8px rgba(0,0,0,0.45);
}

#st-toggle {
    cursor: pointer;
    height: 123px;
    width: 37px;
    display: block;
    position: absolute;
    top: 0;
    left: -37px;
    background: url('../img/sidebar-tools-termine.png') 0 0 no-repeat;

    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -ms-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
}

#st-toggle:hover,
.st-active #st-toggle {
    background-position: 100% 0;
}


/* Date Listing */
#sidebar-tools .event-date {
    overflow: hidden;

    margin: -15px -15px 15px -15px;
    padding: 15px;
    border-bottom: 1px solid #ccc;
}

#sidebar-tools .event-date:last-child{
    margin-bottom: 0;
}


/* Event Title List */
.date-events {
    margin-left: 75px;
}

    .date-events ul {
        list-style: none;
        margin: 0;
        padding: 0;
    }


    #page .date-events ul li a {
        font-size: .9em;
        line-height: 1.2;
        color: #333;
    }


/* Kalenderblatt Datum */
.date-object {
    float: left;
    width: 60px;
    border: 1px solid #ddd;
    margin: 0;
    background: #fff;
}

    .date-object span {
        display: block;
        text-align: center;
    }

    .do-day {
        font-size: 1.2em;
    }

    .do-month {
        font-weight: normal;
        background-color: #F4990B;
        color: #fff;
        font-size: .75em;
    }

    .do-year {
        font-weight: normal;
        font-size: .75em;
        color: #666;
        border-top: 1px solid #ddd;
    }


/**
 * Kontakt
 **********************************************************************************************************************/
.google-map {
    border: 1px solid #ddd;
    padding: 2px;
    vertical-align: bottom;
}

    .google-map iframe {
        vertical-align: bottom;
    }


/**
 * Social Media
 **********************************************************************************************************************/
#page .social-links {
    list-style: none;
    margin: 0 0 1em;
    padding: 0;
}

    #page .social-links li {
        display: inline-block;
        margin: 0;
        padding: 0;
    }

        #page .social-links li a {
            display: inline-block;
            padding: .5em;
            background-color: #F4990B;
            color: #fff;
            border-radius: 3px;
        }

        #page .social-links li a:hover,
        #page .social-links li a:active,
        #page .social-links li a:focus {
            background-color: #313131;
            color: #fff;
        }

            #page .social-links li a i {
                width: 1.25em;
                text-align: center;
            }


/* kontakt: formular */
.formblock {
    overflow: hidden;
}
.pageID_158 .field {
    float: none;
    width: auto;
    padding: 0;
}


/**
 * Footer
 **********************************************************************************************************************/
#footer {
    padding: 3.5em 0;
    overflow: hidden;

    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#6b6b6b+0,313131+100 */
    background: rgb(107,107,107);
    background: -moz-linear-gradient(top,  rgba(107,107,107,1) 0%, rgba(49,49,49,1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(107,107,107,1) 0%,rgba(49,49,49,1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(107,107,107,1) 0%,rgba(49,49,49,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6b6b6b', endColorstr='#313131',GradientType=0 ); /* IE6-9 */
}

    .footer-col {
        float: left;
        width: 33.333331111111%;
        padding-right: 2em;
        overflow: hidden;
    }

    .footer-col:last-child {
        padding-right: 0;
    }

        .footer-col h5 {
            font-size: 1em;
            margin-bottom: 1em;
            color: #fff;
        }

        .footer-col p {
            color: #ddd;
        }

        .footer-col .field {
            float: none;
            width: auto;
            padding: 0;
        }

        #page .footer-col input,
        #page .footer-col textarea {
            display: block;
            width: 100%;
            padding: 5px 10px;
            margin-bottom: .5em;
            background: rgba(255,255,255,.35)
        }

        #page .footer-col input:focus,
        #page .footer-col textarea:focus,
        #page .footer-col .submit
         {
            border-color: #fff;
        }

        .footer-col label  {
            display: block;
            color: #ccc;
        }

        .footer-nav {
            list-style: none;
            padding: 0;
            margin: 0 0 1em 0;
        }

            .footer-nav li {
                margin: 0 0 .15em;
            }

            #page .footer-nav li a {
                color: #F4990B;
                display: block;
                padding: 3px 0 0;
                text-decoration: none;
            }

                #page .footer-nav li a:before {
                    display: inline-block;
                    font: normal normal normal 14px/1 FontAwesome;
                    font-size: inherit;
                    text-rendering: auto;
                    -webkit-font-smoothing: antialiased;
                    -moz-osx-font-smoothing: grayscale;
                    content: "\f105";
                    margin: 0 5px 0 0;
                    -webkit-transition: all 150ms linear;
                    -moz-transition: all 150ms linear;
                    -ms-transition: all 150ms linear;
                    -o-transition: all 150ms linear;
                }

            #page .footer-nav li a:hover {
                color: #fff;
            }

            #page .footer-nav li a:hover:before {
                margin-right: .5em; 
            }


/**
 * Statisches Bild/Icon Teaser Modul
 **********************************************************************************************************************/
.teaser-image-text {
    overflow: hidden;
    margin-bottom: 2em;
    /*padding-bottom: 2em;
    border-bottom: 1px solid #ddd;*/
}

    .teaser-image-text h3 {
        margin-top: 0;
    }

    .teaser-image-text .teaser-text {
        margin-left: 375px;
    }

    .teaser-image-text .teaser-image {
        float: left;
    }

        .teaser-image-text .teaser-image img {
            display: inline-block;
            max-width: 350px;
            text-align: center;
        }

    /* teaser modul abwechselnd floaten */
    .teaser-image-text:nth-child(even) .teaser-text {
        margin-right: 375px;
        margin-left: 0;
    }

    .teaser-image-text:nth-child(even) .teaser-image {
        float: right;
    }


/**
 * Footer Highlight Buttons
 **********************************************************************************************************************/
.highlight-btn {
    margin: 0;
    padding: 0;
    list-style: none;
}

    .highlight-btn li {
        margin: 0 0 .5em;
    }

        #page .highlight-btn li a {
            display: block;
            padding: .5em;
            color: #fff;
            background: #F4990B;
            border: 1px solid #F4990B;
            border-radius: 3px;
            font-weight: bold;
        }

        #page .highlight-btn li a:hover {
            color: #F4990B;
            background: #fff;
            border: 1px solid #fff ;
        }

            #page .highlight-btn li a:before {
                display: inline-block;
                font: normal normal normal 14px/1 FontAwesome;
                font-size: inherit;
                text-rendering: auto;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
                content: "\f105";
                margin: 0 5px 0 0;
            }


/**
 * Login Page - Frontend
 *********************************************************************************************************************/
.ccm-forgot-password-form {
    margin-top: 2em;
}

#page .ccm-login-form .ccm-input-submit,
#page .ccm-forgot-password-form .ccm-input-submit {
    background: #F4990B;
    color: #fff;
    font-weight: bold;
    width: auto;
}

#page .ccm-login-form .ccm-input-checkbox {
    width: auto;
    display: inline-block;
    margin-left: 15px;
}

.control-group {
    margin-bottom: 1em;
}



/**
 * Google Map
 *********************************************************************************************************************/
#map {
    height: 400px;
}

/**
 * Mobile Layout
 **********************************************************************************************************************/
@media (max-width: 990px) {
    /* svg navigation mehr raum geben 
    .pageID_1 #site-content {
        margin-top: -125px;
    }

    .pageID_1 #header .wrapper {
        margin: 0 -75px;
    }*/

    /* --- Layout --- */
    .ccm-layout-col {
        float: none !important;
        width: auto !important;
        height: auto !important;
    }

    .ccm-layout-col-spacing {
        margin: auto !important;
    }

    #sidebar, #content, .footer-col {
        float: none;
        width: auto;
    }

    .footer-col {
        padding-right: 0;
        margin-bottom: 1.5em;
    }

    /* slider */
    .slide-title {
        font-size: 1em;
        bottom: 25px;
    }

    .slider .slide img {
        transform: scale(1.2);
        transform-origin: 50% 75%;
    }

    /* --- Mobile nav --- */
    #dd-nav #nav-toggle {
        display: block;
    }

    #dd-nav ul {
        display: none;
        clear: both;
        float: none;
        text-align: left;
    }

    .open #dd-nav > div > ul {
        display: block;
        margin: 1.5em 0;
        max-height: 250px;
        overflow-y: scroll;
    }

        #dd-nav ul li {
            display: block;
            margin: 0;
        }

            #dd-nav ul li a {
                font-weight: bold;
                padding: 10px 0;
                display: block;
                line-height: normal;
                border-bottom: 1px solid #ccc;
                margin-bottom: .5em;
            }

            #dd-nav ul li.nav-path-selected > a {
                background: none;
                color: #F4990B;
            }

        .fixed #dd-nav .wrapper > ul > li > a {
            line-height: inherit;
        }

    /* 2nd level */
    #dd-nav ul li ul {
        border: 0;
        background: transparent;
        box-shadow: none;
        position: relative;
        top: auto;
        left: auto;
        display: block;
        max-width: 100%;
        min-width: 0;
        padding-left: 0;
        margin-bottom: 1em;
    }

        #dd-nav ul li ul li a {
            font-weight: normal;
            padding: 5px 0;
            border-bottom: 0;
            margin-bottom: 0;
        }

            #dd-nav ul > li.hasSubmenu > a:after {
                content: '\f105';
            }

    /* --- Content --- */

    /* icon headline */
    .icon-headline {
        margin-bottom: 1.5em;
    }

        .icon-headline i {
            margin-top: 0;
        }

            .icon-headline i:after {
                display: none;
            }

    .projects-list .project .project-image,
    .projects-list .project .project-content {
        float: none;
        margin: 0 0 1em;
    }


    /* icon teaser */
    .ccm-layout-col .teaser .icon {
        float: left !important;    
        margin: 0 0 15px !important; 
    }

    .ccm-layout-col .teaser-content {
        margin-right: 0 !important;
        margin-left: 90px !important;
        text-align: left !important;
    }


    /* image/text teaser */
    .teaser-image-text .teaser-image {
        float: right !important;
    }

        .teaser-image-text .teaser-image img {
            max-width: 225px;
            margin-bottom: .25em;
        }

    .teaser-image-text .teaser-text {
        margin-left: 0;
    }

    .teaser-image-text:nth-child(2n) .teaser-text {
        margin-right: 0;
    }


    /* preis boxen */
    .eos-modul {
        width: auto;
        display: block;
        margin-bottom: 0;
    }

    /* seminar-teaser */
    .seminar-list .seminar-teaser {
        float: none;
        width: auto;
    }

        #page .seminar-teaser a {
            min-height: 0;
        }

}


@media (max-width: 540px) {

    .eos-module {
        display: block;
    }

        .eos-module .eos-modul {
            display: block;
            float: none;
            width: 100%;
            margin-bottom: 1em;
        }

    /* event meta data */
    .event-meta dl {
        float: none;
        width: auto;
        padding-right: 0;
    }

    .event-meta dl + dl {
        margin-top: 1em;
    }

    /* form fields */
    .field {
        float: none;
        width: auto;
    }

    /* hide sidebar */
    #sidebar-tools {
        display: none;
    }

    /* hide slide-title */
    .slide-title {
        display: none;
    }

    /* collapse-item */
    .collapse-item .icon {
        float: none;
        margin: 0 auto 1em;
    }

    .collapse-item .icon-margin {
        margin-left: 0;
    }

    /* news auf startseite */
    .pageID_1 .news-teaser-list li {
        display: block;
        width: auto;
    }

    /* seminar tab navigation */
    .tab-seminare .tabs-menu li {
        display: block;
        float: none;
        padding: .5em 1em;
        margin: 0 0 .25em 0 !important;
        font-weight: 400;
        background-color: #DDD;
    }

    /* wissenschaft image */
    .head-illu {
        display: block;
        margin: auto;
        text-align: center;
    }

    #site-content {
        margin-top: 0;
    }
    
    #header .wrapper {
        margin: 0;
    }

    /* Mobile Navigation einblenden */
    #mobile-nav {
        display: block;
    }


    .project-card {
        width: 100% !important;
        height: auto !important;
        float: none !important;
    }


    .count-element {
        float: none;
        width: 100%;
    }


    .profile-image,
    .profile-content {
        float: none;
        display: block;
        width: 100%;
        margin-left: 0;
    }

    .profile-image img {
        max-width: 100%;
        max-height: 100%;
        margin-bottom: 1em;
    }
}