﻿/**
 * (en) jQuery Accordion for NAME
 * (de) jQuery Accordion für NAME
 *
 * @copyright			 Copyright 2015, crossbase mediasolution GmbH
 * @version				 1.0
 */

@media screen
{

	.accordion {
		width: 100%;
		margin: 0 0 24px 0;
		padding: 0;
	}

	.half-padding .accordion {
		margin: 0 0 12px 0;
	}

	.accordion.add-shadow {
		box-shadow: none;
	}

	.accordion.add-shadow h3.h3accordion,
	.accordion.add-shadow .pane {
		box-shadow: 0 0 6px rgba(0, 0, 0, 0.2);
	}

	p + .mobile-seamless-wrapper,
	ul + .mobile-seamless-wrapper,
	h4 + .mobile-seamless-wrapper {
		margin-top: 0 !important;
	}

	p + .mobile-seamless-wrapper .accordion,
	ul + .mobile-seamless-wrapper .accordion,
	h4 + .mobile-seamless-wrapper .accordion {
	}

	.accordion div.current {
		display: block;
	}

	/* accordion header */

 .accordion h3.h3accordion {
		font-family: 'Univers LT Light', cnRegular, sans-serif;
		font-size: 15px;
		line-height: 24px;
		position: relative;
		background: #1d374a;
		color: #fff;
		font-weight: normal;
		cursor: pointer;
		margin: 0;
		padding: 4px 24px;
		border: none;
		border-radius: 4px;
		margin-bottom: 6px;
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		-webkit-transition: all 0.2s linear;
		transition: all 0.2s linear;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
	}

	.accordion h3.h3accordion:hover,
	.accordion h3.h3accordion.current:hover{
		background: #cc1c14;
	}

	.accordion h3.h3accordion::after {
		font-family: 'Font Awesome 5 Free';
		/*font-weight: 900;*/
		content: '\f107';
		position: absolute;
		right: 10px;
		top: 5px;
		width: auto;
		text-align: left;
		background: transparent;
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		-webkit-transition: transform 300ms ease 0s;
		-webkit-transition: -webkit-transform 300ms ease 0s;
		transition: -webkit-transform 300ms ease 0s;
		transition: transform 300ms ease 0s;
		transition: transform 300ms ease 0s, -webkit-transform 300ms ease 0s;
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}

	.accordion h3.h3accordion.current::after {
		font-family: 'Font Awesome 5 Free';
		/*font-weight: 900;*/
		content: '\f107';
		position: absolute;
		right: 10px;
		top: 5px;
		width: auto;
		text-align: left;
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		-webkit-transition: transform 300ms ease 0s;
		-webkit-transition: -webkit-transform 300ms ease 0s;
		transition: -webkit-transform 300ms ease 0s;
		transition: transform 300ms ease 0s;
		transition: transform 300ms ease 0s, -webkit-transform 300ms ease 0s;
		-webkit-transform: rotate(-179.999deg);
		transform: rotate(-179.999deg);
	}

/*	.accordion h3.h3accordion.current::after,
	.accordion h3.h3accordion::after{
		height: 2px;
		width: 8px;
	}

	.accordion h3.h3accordion.current::before,
	.accordion h3.h3accordion::before{
		height: 8px;
		width: 2px;
	}

	.accordion h3.h3accordion::after,
	.accordion h3.h3accordion::before,
	.accordion h3.h3accordion.current::after,
	.accordion h3.h3accordion.current::before {
		content: '';
		position: absolute;
		right: 16px;
		top: 50%;
		bottom: auto;
		left: auto;
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		-webkit-transform: translateX(50%) translateY(-50%);
		transform: translateX(50%) translateY(-50%);
		background: #fff;
		-webkit-transition-property: -webkit-transform;
		transition-property: -webkit-transform;
		transition-property: transform;
		transition-property: transform, -webkit-transform;
		-webkit-transition-duration: 0.2s;
		transition-duration: 0.2s;
	}

	.accordion h3.h3accordion.current::before {
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		-webkit-transform: translateX(50%) translateY(-50%) rotate(90deg);
		transform: translateX(50%) translateY(-50%) rotate(90deg);
	}
*/
	
	.accordion h3.h3accordion.current {
		cursor: pointer;
		background: #cc1c14;
		margin-bottom: 0;
		border-radius: 4px 4px 0 0;
	}

	.accordion .pane:after,
	.accordion .pane:before {
		content: '';
		display: table;
		width: 100%;
	}

	.accordion .pane {
		display: none;
		padding: 24px 24px 0 24px;
		background: #fff;
		margin-bottom: 6px;
	}

	.half-padding .accordion .pane {
		padding: 12px 12px 0 12px;
	}

	.accordion .pane-open {
		display: block;
	}

	.box-wrapper-100 .accordion .pane,
	.jquery-tabs .accordion .pane,
	.accordion .accordion .pane,
	.ym-grid-col-padding .accordion .pane,
	.table-grid .accordion .pane {
		background: #fff;
	}

	.box-wrapper-100 .box-wrapper-100 .accordion .pane,
	.box-wrapper-100 .jquery-tabs .accordion .pane,
	.box-wrapper-100 .accordion .accordion .pane,
	.jquery-tabs .box-wrapper-100 .accordion .pane,
	.jquery-tabs .jquery-tabs .accordion .pane,
	.jquery-tabs .accordion .accordion .pane,
	.accordion .box-wrapper-100 .accordion .pane,
	.accordion .jquery-tabs .accordion .pane,
	.accordion .accordion .accordion .pane,
	.box-wrapper-100 .no-padding .accordion .pane,
	.jquery-tabs .no-padding .accordion .pane,
	.accordion .no-padding .accordion .pane,
	.ym-grid-col-padding .no-padding .accordion .pane {
		background: #fff;
	}

	.no-padding .accordion,
	.no-padding .accordion .pane,
	.no-padding .accordion h3.h3accordion:last-of-type {
		margin-bottom: 0;
	}

	.no-padding .accordion > h3.h3accordion {
		border-bottom-left-radius: 0;
		border-bottom-right-radius: 0;
	}

	.no-padding .accordion .pane + h3.h3accordion,
	.no-padding .accordion .pane + h3.h3accordion.current {
		border-radius: 0;
	}	
	
}


	/*------------------------------------------------------------------------------------------------------*/
	/* (en) Media Query 560 */
	/* (de) Media Query 560 */
	/*------------------------------------------------------------------------------------------------------*/

@media screen and (max-width: 560px)
{

	.accordion {
		margin: 0 0 12px 0;
	}

 .accordion h3.h3accordion {
		padding: 4px 24px 4px 12px;
	}

	.accordion .pane {
		padding: 12px 12px 0 12px;
	}

}