/* Menü - Anpassungen */ 

.dropdown-submenu {
  position: relative;
}

.dropdown-submenu a::after {
  transform: rotate(-90deg);
  position: absolute;
  right: 6px;
  top: .8em;
}

.dropdown-submenu .dropdown-menu {
  top: 0;
  left: 100%;
  margin-left: .1rem;
  margin-right: .1rem;
}

/*
    Menü-Anpassungen Sidebar
*/
.sidebar .list-group .list-group-item {
    background-color: #81bc49;
    transition: background-color 0.8s ease-in-out;
    color: white;    
}

.sidebar .list-group a.list-group-item:hover {
    background-color: #643766;
    color: white;    
}

.sidebar .list-group a.list-group-item-active {
    background-color: #643766;
    color: white;    
}

.sidebar .list-group .list-group-item a {
    color:#643766;
}

.list-group-item:first-child {
    border-top-left-radius: 0rem;
    border-top-right-radius: 0rem;
}

.list-group-item:last-child {
    margin-bottom: 0.5rem;
    border-bottom-right-radius: 0rem;
    border-bottom-left-radius: 0rem;
}

.breadcrumb {
    border-radius: 0rem;
}

/* Farben */


.vkm-dunkelgruen, .vkm-primaer {
    color: #61a33f;
}

.vkm-logo-text {
    color: #0b9a33;
    white-space: normal;
}


.btn-primary {
    background-color: #0b9a33;
    border-color:#61a33f;
}

.btn-primary:hover {
    background-color: #61a33f;
    border-color:#0b9a33;
}



.vkm-logo-text small {
    color: #81bc49;
}

.vkm-logo-untertext {
    color: #81bc49;
}



.vkm-hellgruen, .vkm-sekundaer {
    color: #9ec559;
}

.vkm-sonnengelb {
    color: #fbf315;
}

.vkm-schwarz {
    color: #071016;
}

.vkm-grau {
    color: #8f908f;
}

.vkm-ockergelb {
    color: #d7c32a;
}


.vkm-bg-darkgreen {
    background-color: #0b9a33;
}

.vkm-bg-lightgreen {
    background-color:  #81bc49;
}

.vkm-bg-ockergelb {
    background-color: #d7c32a;
}

/* Headlines */
.headline {
    border-bottom: 1px solid #e4e9f0;;
    display: block;
    margin: 10px 0 25px;
    
}

h1 {
    font-size:2rem;
}

.headline h1, .headline h2, .headline h3, .headline h4 {
    border-bottom: 2px solid #0b9a33;
    display: inline-block;
    margin: 0 0 -2px;
    padding-bottom: 5px;
}

/* hyphens */
h1 {
    -moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto;    
}




/* Bildgalerie - Anpassungen */ 

.grid {

  max-width: 1200px;
}

/* clear fix */
.grid:after {
  content: '';
  display: block;
  clear: both;
}



/* ---- .grid-item ---- */

.grid-item {
  float: left;
  width: 200px;
  border: 5px solid white;
  
}

.gallery-grid a::before, .gallery a::before {
  content: '\f00e';
  font-family: FontAwesome;
  font-size: 3em;
  display: block;
  position: absolute;
  width: 100%;
  text-align: right;
  right: 5px;
 bottom: -10px;
  color: #fff;
  opacity: .4;
  transition: opacity 0.3s ease;
  text-shadow: 0 0 15px #000;
  z-index: 2;
  
}

.gallery-grid a:hover::before, .gallery a:hover::before {
  opacity: .8;
}


/* Treffen Übersicht */

.overflow-hidden {
    overflow: hidden;
}

img.ken-burns {
    transition: all 1.2s ease-in-out 0s;    
}


img.ken-burns:hover {
  transform: scale(1.2);
  transition: transform 3s ease-in-out 0s;
}

/* Ende Treffen Übersicht */

a {
   color: #0b9a33;
}

a:hover {
    color: #0b9a33;
}

.list-group-item.active {
    background-color: #81bc49;
    border-color: #0b9a33;
    color: #fff;

}

.dropdown-item.active ,.dropdown-item:active, .dropdown-item:focus {
    background-color: #81bc49;
}


.navbar-brand {

    font-size: 1rem;
}


/* Kreise */
.block-circle, .block-square {
    
    text-align: center;
    vertical-align: middle;
    
    display:none;
}

.block-square {
    padding-left:0px;
    padding-right:0px;
    overflow: hidden;
}

/*
.square-outside {
    overflow: hidden;
}
*/

.square {

    color: white;
    height: 250px;
    font-weight: bold;
    width: 100%;
    display: table;
    margin: 0px auto;
    
    transition: all .5s ease-in-out;
    
}

.circle {
    border-radius: 200px;
    color: white;
    height: 200px;
    font-weight: bold;
    width: 200px;
    display: table;
    margin: 20px auto;
    margin-top: 30px;
    transition: all .5s ease-in-out;
}

.circle-small {
    height: 170px;
    width: 170px;
    margin-top: 45px;
}

.circle-big {
    margin-top: 20px;
    height: 230px;
    width: 230px;    
}

.circle:hover, .square:hover {
    transform: scale(1.2);
    z-index: 3;
    
}
/*
.circle:hover {
    height: 220px;
    font-weight: bold;
    width: 220px;   
    margin: 10px auto;
}
*/


.circle p, .square p {
    vertical-align: middle;
    display: table-cell;
}

.block-circle a:hover, .block-square a:hover {
    text-decoration: none;
}

/* new color */
.new-green1 {
   background-color:#a8cb56;
}

a:hover .new-green1 {
   background-color:#98ba49;
}

.new-green2 {
   background-color:#8fb646;   
}

a:hover .new-green2 {
   background-color:#84a33f;
}

.new-green3 {
   background-color:#91b349; 
}

a:hover .new-green3 {
   background-color:#a7c34a;
}

.new-green4 {
    background-color:#9ec04f;
}

a:hover .new-green4 {
   background-color:#82a63c;
}

.new-green5 {
    background-color:#b9d657;  
}

a:hover .new-green5 {
   background-color:#8faf44;
}

.new-green6 {
    background-color:#c3df5c;   
}

a:hover .new-green6 {
   background-color:#b2cc4f;
}
/* end new colors */


/* Parallax Effects */

.parallax-ziele {
    /* The image used */
    background-image: url("../img/slider/slider1a.jpg");
   
    

    /* Set a specific height */
    min-height: 300px; 

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}


.overlay {
    background-color: black;
     /* Fallback for web browsers that don't support RGBa */
    background-color: rgb(0, 0, 0);
    /* RGBa with 0.6 opacity */
    background-color: rgba(0, 0, 0, 0.2);
          
     /*z-index: 2;*/
     width:100%;
     height:100%;
   

}

.overlay .container {
    z-index: 100 !important;
   
    
}

.parallax-ziele .container  {
    padding-top: 50px;
    padding-bottom: 50px;
    color:white;
}

.parallax-ziele .container h1, .parallax-ziele .container  h2,  .parallax-ziele .container h3,  .parallax-ziele .container h4 {
    color:white;
}

.parallax-ziele .container li, .parallax-ziele .container strong {
    font-size:1.3rem;
}

/* Startseite */ 

            .background-image-left {
                background-image: url("http://stm-systems.net/kundenprojekte/vkm2/img/galerie/treffen/IMG_1593.jpg");
   
             /* Set a specific height */
            min-height: 400px; 

            /* Create the parallax scrolling effect */
            /*background-attachment: fixed;*/
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;                
            }
            
            .background-color-green {
                padding:15px;
                background-color: #81bc49;
                color:white;
                font-size: 1rem;
            }
            
            .background-color-green a i {
                color:white;
            }
            
            .background-color-green a i:hover {
                color:#343a40;
            }
            
            .background-color-green h2 {
                color:white;
                font-size: 2rem;
                font-weight: 700;
            }
			
		
.twoColumns p img {
	width: 100%;
}	



/*
    breakpoints, 576, 768, 992, 1200
*/

.navbar-brand img {
    max-width:210px; 
    float:left;
    padding-right:5px;
}

    .navbar-brand img.shrink {
        max-width:210px; 
        
    } 
    
    ul.navbar-nav li.nav-item {
        text-transform: uppercase;
    }
    
    ul.navbar-nav li.nav-item li {
        text-transform:none;
    }
    
    h1, h2, h3, h4 {
        color:#343a40;
    }
    
    .carousel h1, .carousel h2, .carousel h3, .carousel h4 {
        color: white;
    }

    
    h5 a {
        color:#343a40;
    }
    
    .btn-lg {
        margin-bottom: 10px;
    }

	/*
	.search-open {
    width: 330px;
}
 .search-open {
    right: 50px;
    top: 100px;
    display: none;
    padding: 14px;
    position: absolute;
    background: #fcfcfc;
    border-top: solid 2px #eee;
    box-shadow: 0 1px 3px #ddd;
}
*/

/*Search Box*/
ul.navbar-nav li:last-child {
	position:relative;
}



.navbar .nav > li > .search {
	color: #aaa;
	cursor: pointer;
	min-width: 35px;
	font-size: 15px;
	text-align: center;
	background: #f7f7f7;
	padding: 11px 0 12px;
	display: inline-block;
	border-bottom: solid 2px #0b9a33;
}

.navbar .nav > li > .search:hover {
	color: #72c02c;
	background: #f7f7f7;
	border-bottom-color: #72c02c;
	border-bottom-color: #0b9a33;
}



.navbar .search-open {
	right: 0; 
	top: 42px; 
	display: none;
	padding: 14px; 
	position: absolute;
	background: #fcfcfc; 
	border: solid 3px #eee;
	right:-3px;
}

.navbar .btn:focus {
	box-shadow: 0 0 0 3px #0b9a33;
}

.navbar .search-open form {
	margin: 0;	
}

.card-marker {
	color: #643766;
	font-weight:bold;
}

	table .rubrikLV {
		display:none;
	}
	
.float-rubriken, .float-datum {
	float:left;
}	

h3.card-title {
	font-size: 1.3rem;
	margin-bottom: 0.3rem;
	        -ms-hyphens: auto;
        -webkit-hyphens: auto;
        hyphens: auto;
}


.twoColumns p img {
	float: left;
	
	padding-right: 10px;
	padding-bottom: 20px;
}
	
	
@media (min-width: 576px) {
	.twoColumns p img {
	width: auto;
}	
}	

@media (min-width: 767px) {

	
	h3.card-title {
	font-size: 1.75rem;
	margin-bottom: 0.75rem;
}
	
	.float-datum {
	float:right;
}	
	
	.navbar .search-open {
		width: 330px;
	}

	.open > .dropdown-menu,
    .open > .dropdown-menu {
		display: none;
	}
	
	table .rubrikLV {
		display:table-cell;
	}
}



/* Suchergebnisse */
    /* Diese CSS-Datei in das Design ausschneiden und anpassen */
	/*
    .search_it-modul {
        box-sizing: border-box;
        font-size: 1rem;
        font-family: sans-serif;
        max-width: 640px;
        margin: 0 auto;
        border: 1px solid rgba(0,0,0,0.2);
        padding: 0 2rem 2rem 2rem;
    }
	*/
	/*
    .search_it-demotitle {
        font-size: 1.2rem;
        font-weight: bold;
        border-bottom: 1px solid  rgba(0,0,0,0.2);
        color: rgba(0,0,0,0.4);
        margin-bottom: 2rem;
    }
	*/

    .search_it-results {
        padding: 0;
        margin: 0;
    }
    .search_it-result {
        background: rgba(0,0,0,0.05);
        border: 1px solid rgba(0,0,0,0.4);
        padding: 1rem;
        margin: 1rem 0;
        list-style-type: none;
        list-style-position: inline;
    }
    .search_it-title,
    .search_it-title a {
        font-weight: bold;
        color: #0b9a33;
    }

    .search_it-result .search_it-teaser {
        color: rgba(0,0,0,0.7);
    }
    .search_it-result .search_it-url {
        color: rgba(0,0,0,0.4);
    }

    .search_it-missing_type,
    .search_it-zero {
        background: rgba(180,0,0,0.05);
        padding: 1rem;
        border: 1px solid rgba(255,0,0,0.7);
        margin: 1rem 0;
        color: rgba(255,0,0,0.7);
    }
    .search_it-request,
    .search_it-type {
        font-weight: bold;
    }
	


@media (max-width: 767px) {

	
	.navbar .nav > li > .search {
		color: #999;
		width: 35px;
		height: 34px;
		line-height: 12px;
		text-align: left;
		text-align: center;
		margin: 5px 10px 0;
		background: #eee;
		border-bottom: none;
	}

	 .navbar .nav > li > .search:hover {
		background: #5fb611;
		color: #fff !important;
	}

	.navbar .search-open {
		top: 5px;
		padding: 0;
		left: 48px;
		border-top: none;
		box-shadow: none;
		background: none; 
		margin-right: 10px;
	}
	
	
}
	
@media screen and (min-width: 992px) {
    h1 {
        font-size:2.5rem;
    }
    
    .navbar-brand {
        font-size: 1rem;
    }
    
    .navbar-brand img {
        max-width:210px; 
        float:left;
        padding-right:20px;
    }
    
    .navbar-brand img.shrink {
        max-width:210px; 
        
    }    
    
    .vkm-logo-text {    
        white-space:nowrap;
    }
    
    .background-color-green {
                padding:50px;
                background-color: #81bc49;
                color:white;
                font-size: 1.5rem;
    }
}

 
@media screen and (min-width: 1200px) {
    
    .navbar-brand img {
        max-width:300px; 
        float:left;
        padding-right:20px;
    }
    
    .navbar-brand img.shrink {
        max-width:210px; 
        
    } 
}


/* Änderungen CSS-ANPASSUNGEN HP */

/* Silbentrennung Tabelle Startseite */
#tableKalenderStartseite {
	
}

#tableKalenderStartseite td {
        -ms-hyphens: auto;
        -webkit-hyphens: auto;
        hyphens: auto;
}

.totop {
	position: fixed; 
	bottom: 20px; 
	right: 20px; 
	opacity: 1; 
	cursor: pointer;
}

.totop i {
	color:#0b9a33;
}

/* Breadcrumb - Farbe letztes Element lila*/
.breadcrumb-item.active {
    color: #643766;
}

/* Farbe und Schriftgröße Ziele VKM kleiner und schwarz */ 
.background-color-green h2 {
    
    font-size: 1.7rem;
    font-weight: 600;
}


@media screen and (min-width: 992px) {   
    .background-color-green {

                /*color:#212529;*/
                font-size: 1.3rem;
    }
	

}

/* Kreise Farbe schwarz und ein wenig größer */ 
.circle p, .square p {
	font-size:1.5rem;
	color: #212529;
	padding: 7px;
}


/* Cookie Settings */
#cookiefooter a {color:#000; text-decoration:none;}

#cookiefooter a:hover {text-decoration:underline;}

#cookiefooter div {padding:10px; padding-right:40px;}

#cookiefooter { 
   outline: 1px solid #7b92a9; 
   text-align:right; 
   border-top:1px solid #fff;
   background: #d6e0eb; 
   background: -moz-linear-gradient(top, #d6e0eb 0%, #f2f6f9 100%); 
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d6e0eb), color-stop(100%,#f2f6f9)); 
   background: -webkit-linear-gradient(top, #d6e0eb 0%,#f2f6f9 100%); 
   background: -o-linear-gradient(top, #d6e0eb 0%,#f2f6f9 100%);
   background: -ms-linear-gradient(top, #d6e0eb 0%,#f2f6f9 100%); 
   background: linear-gradient(to bottom, #d6e0eb 0%,#f2f6f9 100%); 
   filter: progid:DXImageTransform.Microsoft.gradient(   startColorstr='#d6e0eb', endColorstr='#f2f6f9',GradientType=0 ); 
   position:fixed;
   bottom:0px; 
   z-index:10000; 
   width:100%; 
   right:0;
   font-size:12px; 
   line-height:16px;}

#cookiefooterCloser {
   color: #777;
   font: 14px/100% arial, sans-serif;
   position: absolute;
   right: 5px;
   text-decoration: none;
   text-shadow: 0 1px 0 #fff;
   top: 5px;
   cursor:pointer;
   border-top:1px solid white; 
   border-left:1px solid white; 
   border-bottom:1px solid #7b92a9; 
   border-right:1px solid #7b92a9; 
   padding:4px;
   background: #ced6df; /* Old browsers */
   background: -moz-linear-gradient(top, #ced6df0%, #f2f6f9 100%); 
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ced6df), color-stop(100%,#f2f6f9)); 
   background: -webkit-linear-gradient(top, #ced6df0%,#f2f6f9 100%); 
   background: -o-linear-gradient(top, #ced6df0%,#f2f6f9 100%); 
   background: -ms-linear-gradient(top, #ced6df0%,#f2f6f9 100%); 
   background: linear-gradient(to bottom, #ced6df0%,#f2f6f9 100%); 
   filter: progid:DXImageTransform.Microsoft.gradient(    startColorstr='#ced6df', endColorstr='#f2f6f9',GradientType=0 ); 
 }

#cookiefooterCloser:hover {border-bottom:1px solid white; border-right:1px solid white; border-top:1px solid #7b92a9; border-left:1px solid #7b92a9;}

/* End Cookie Settings */