/* KMI Template Base: Version 7.0 */

@media all { 
	/*************************************************
	* Reset & Basics
	*************************************************/
	
	html {
		width: 100%;
		height: 100%;
	}
	body {
		width: 100%;
		height: 100%;
	}
	html, body, div, span, applet, object, iframe, input,
	h1, h2, h3, h4, h5, h6, hr, p, blockquote, pre,
	a, abbr, acronym, address, big, cite, code,
	del, dfn, em, img, ins, kbd, q, s, samp,
	small, strike, strong, sub, sup, tt, var,
	b, u, i, center, dl, dt, dd, ol, ul, li,
	fieldset, form, label, legend,
	table, caption, tbody, tfoot, thead, tr, th, td,
	article, aside, canvas, details, embed,
	figure, figcaption, footer, header, hgroup,
	menu, nav, output, ruby, section, summary,
	time, mark, audio, video {
		margin: 0;
		padding: 0;
		border: 0;
		vertical-align: baseline;
	}
	article, aside, details, figcaption, figure,
	footer, header, hgroup, menu, nav, section {
		display: block;
	}
	address {font-style: normal;}
	table {
		border-collapse: collapse;
		border-spacing: 0;
	}
	ol, ul {
		list-style: none;
		list-style-image: none;
		list-style-type: none;
		list-style-position: inside;
	}
	strong, b {font-weight: 500;}
	em, i {font-style: italic;}
	img {
        line-height: 0;
        max-width: 100%;
        height: auto;
    }

	.clearfix:after {
		content: ".";
		display: block;
		clear: both;
		visibility: hidden;
		line-height: 0;
		height: 0;
	}
	.clearfix {display: inline-block;}
	html[xmlns] .clearfix {display: block;}
	* html .clearfix {height: 1%;}

	/*************************************************
	* Typography
	*************************************************/
	
	/* Titles */
	img + h2, p + h2, table + h2, ol + h2, ul + h2, form + h2 {margin: 2em 0 1em 0;}
	.csc-default + div h2 {margin: 1.4em 0 1em 0;}
	.rulerAfter + div h2 {margin: 1.4em 0 1em 0;}
	.rulerBefore + div h2 {margin: 1.4em 0 1em 0;}
	
	img + h3, p + h3, table + h3, ol + h3, ul + h3, form + h3 {margin: 2em 0 1em 0;}
	.csc-default + div h3 {margin: 1.4em 0 1em 0;}
	.rulerAfter + div h3 {margin: 1.4em 0 1em 0;}
	.rulerBefore + div h3 {margin: 1.4em 0 1em 0;}

	/* Text */
	p {
        margin: 0 0 1em 0;
        line-height: 1.6em;
    }
	sup {
		 font-size: 0.7rem;
		 position: relative;
		 top: -0.4em;
	}
	sub {
		font-size: 0.7rem;
		position: relative;
		top: 0.4em;
	}

	/* Links */
	a[href^=tel]{
			color: inherit;
			text-decoration: none;
	}

	/* Tables */
	table {
		margin: 0 0 1em 0;
		vertical-align: top;
		font-size: 1em; /* Bugfix RTE */
	}
	th {font-weight: 700;}
	th, td {
		vertical-align: top;
		padding: 0 1em 1em 0;
	}
	th:last-child, td:last-child {padding: 0 0 1em 0;}
	td p:last-child {margin: 0;}
	caption {
		margin: 0 0 1em 0;
		font-weight: 700;
	}
	table.border img { display: block;}
	table.border th,
	table.border td {
		padding: 0.3em 0.6em;
		border: 1px solid #666;
	}
	table.border th.no-padding,
	table.border td.no-padding {padding: 0;}

	/* Lists Ordered */
	ol {list-style-type: decimal; margin: 0 0 1em 1.4em;}
	ol li {text-indent: -1.4em;}
	ol ol {margin: 0 0 0 1.4em;}
	td > ol {margin: -1.2em 0 -1.2em 1.5em;} /*necessary in frontend but buggy in rte*/

	/* Lists Unordered - Special Symbol */
	.content ul {margin: 0 0 1em 1.5em;}
	/* .content ul li:before {content: "•"; padding: 0 1em 0 0;} */
	.content ul ul {margin: 0 0 0 1.5em;}
	.content td > ul {margin: -1.2em 0 -1.2em 1.5em;} /*necessary in frontend but buggy in rte*/

	/* line */
	hr {
		border: none;
	}

	
	/*************************************************
	* RTE Configuration (class definition has to be in styles.css)
	*************************************************/
	
	/* Align Classes for RTE*/
	h1.align-left,
	h2.align-left,
	h3.align-left,
	p.align-left,
	img.align-left,
	th.align-left,
	td.align-left,
	caption.align-left {text-align: left;}
	h1.align-center,
	h2.align-center,
	h3.align-center,
	p.align-center,
	img.align-center,
	th.align-center,
	caption.align-center,
	td.align-center {text-align: center;}
	h1.align-right,
	h2.align-right,
	h3.align-right,
	p.align-right,
	img.align-right,
	th.align-right,
	caption.align-right,
	td.align-right {text-align: right;}
	h1.align-justify,
	h2.align-justify,
	h3.align-justify,
	p.align-justify,
	img.align-justify,
	th.align-justify,
	td.align-justify,
	caption.align-justify {text-align: justify;}

	/*************************************************
	* Recordtyp
	*************************************************/
	
	/* Ruler After */
	div.rulerAfter {
		border: none;
		border-bottom: 1px solid #666;
		margin: 0 0 1.3em 0;
		padding: 0 0 1em 0;
	}
	/* Ruler Before */
	div.rulerBefore {
		border: none;
		border-top: 1px solid #666;
		margin: 1.3em 0 0 0;
		padding: 1.3em 0 0 0;
	}

	/* Accordion */
	.accordion {
		margin-bottom:5px;
	}
	.accordion > div > h2 {
		content: "↓";
		padding: 0 1em;
		color: #fff;
		background:#05305d;
		font-size:1.2em;
		line-height:2em;
		cursor:pointer;
		margin:0;
	}
	.accordion > div > h2:before {
		content: "↓";
		padding-right:1em;
	}
	
	.accordion .opened > h2:before {
		content: "↑";
		padding-right:1em;
	}
	.accordion > div > h2:hover {
		text-decoration: none;
		background:#074485;
	}
	.accordion > div > h2:focus {
		border: none;
	}
	.accordion > div > div {
		padding: 1em 1em 0 1em;
		border: 1px solid #eee;
		border-top: none;
	}	

	/* Zoom Image (Plus +) */
	.ce-gallery a {
		position:relative;
		display:inline-block;
	}
	.img-overlay {
		position:absolute;
		width:100%;
		height:100%;
		top:0;
		left:0;
		background-color:rgba(0,0,0,0.6);
		opacity:0;
	}
	.img-overlay:after {
		position:absolute;
		content:"";
		background-image:url(/fileadmin/kmi_images/icon-img-link.png);
		width:33px;
		height:35px;
		z-index:10;
		top:50%;
		left:50%;
		margin:-16.5px 0 0 -17.5px;
	}
	.ce-gallery a:hover .img-overlay {
		opacity:1;
		transition: all 0.3s ease;
	}
	
	a.kmi-lightbox {
		display:block;
	}
	
	a.kmi-lightbox:after {
		position: absolute;
		background: #000000;
		height:12px;
		width:12px;
	}


	/* Text mit Bild */
	figcaption.csc-textpic-caption {
		font-size: 0.9em;
		text-align: justify;
	}

	/* Image hover effect */
	div.csc-textpic .csc-textpic-imagewrap .csc-textpic-image {
		background: #000;
	}

	figure.csc-textpic-image a img {
		opacity: 1;
		-webkit-transition: all 1s ease;
		-moz-transition: all 1s ease;
		transition: all 1s ease;			
	}

	figure.csc-textpic-image a img:hover {	
		opacity: 0.65;
		-webkit-transition: all 1s ease;
		-moz-transition: all 1s ease;
		transition: all 1s ease;
	}

	/* Textpic with border */
	div.csc-textpic-border div.csc-textpic-imagewrap img {border: 1px solid #444444;}
	
	/*************************************************
	* Custom
	*************************************************/	
	
	#mnav-wrapper,
	#mnavbtn{
		display: none;
	}
    
    .d-flex{
        display: flex !important;
    }
    .flex-wrap{
        flex-wrap: wrap;
    }
    .flex-column{
        flex-direction: column;
    }
    .float-left{
        float: left;
    }
    .container-60{
        width: 60%;
    }
    .container-100{
        width: 100%;
        margin: 0 auto;
    }

    .justify-content-end{
        justify-content: flex-end;
    }
    .col-50{
        width: 50%;
    }

    .ce-textpic.ce-right .ce-bodytext{
        margin-right: 35px;
        
    }
    .ce-textpic.ce-right .ce-gallery{
        order: 1;
        margin-left: 35px;
    }
}