/*https://css-tricks.com/custom-controls-in-html5-video-full-screen/*/

 
video::-webkit-media-controls-timeline {
	display:none !important;
  }
video::-webkit-media-controls-play-button {
	display:none !important;
  }
video::-webkit-media-controls-current-time-display {
	display:none !important;
  }

video::-webkit-media-controls-time-remaining-display {
	display:none !important;
  }

 
video::-webkit-media-controls {
	display:none !important;
  }


.fullscreen-button{
    background-color: transparent;
	border: 0;
	font-size: 3em;
	vertical-align: middle;
	cursor: pointer;

}



.fullscreen-icon {
    vertical-align: middle;
    box-sizing: border-box;
    display: inline-block;
    width: 1em;
    height: 1em;
    position: relative;
	background: url(../svg/fullscreen.svg);
	margin-left: 20px;
	margin-right: 20px;
	margin-top: -10px;
}

.video{
	width: 0;
	height: 0;
}

.show-video{
	width: 100% !important;
	height: auto !important;
}

button,
input,
label{
	padding: 0;
}

.custom-logo {
	position: absolute;
	right: 20px;
}

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

span {
	font-style: inherit;
	font-weight: inherit;
}


.card-content {
	background-color: transparent;
	padding: 1.5rem;
}

div.card-content {
	background-color: #fafafa;
}

.card {
	margin-bottom: 2em;
}

.page-title{
	text-decoration: none;
}

h2,
p {
	margin: 0;
	padding: 0;

}

h2 {
	font-size: 100%;
	font-weight: 400;
}

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

header {
	display: block;
}

span {
	font-style: inherit;
	font-weight: inherit;
}

.title {
	word-break: break-word;
}

.title {
	color: #000000;
	font-size: 2rem;
	line-height: 1.125;
	margin-top: 14px;
}



.column {
	display: block;
	-ms-flex-preferred-size: 0;
	flex-basis: 0;
	-webkit-box-flex: 1;
	-ms-flex-positive: 1;
	flex-grow: 1;
	-ms-flex-negative: 1;
	flex-shrink: 1;
	padding: .75rem;
}

.columns {
	margin-left: -.75rem;
	margin-right: -.75rem;
	margin-top: -.75rem;
}

.columns.is-multiline {
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}

@media print,
screen and (min-width:769px) {
	.columns:not(.is-desktop) {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
	}
}

.columns.is-variable {
	--columnGap: 0.75rem;
	margin-left: calc(-1*var(--columnGap));
	margin-right: calc(-1*var(--columnGap));
}

.columns.is-variable .column {
	padding-left: var(--columnGap);
	padding-right: var(--columnGap);
}

header {
	font-weight: 700;
}

.content-title-group {
	font-size: 2.7em;
	margin-bottom: 16px;
}

.content-title-group h2 {
	border-left: 16px solid #0092cf;
	border-bottom: 2px solid #0092cf;
	padding-left: 8px;
	padding-right: 16px;
	display: inline-block;
	color: rgb(0, 0, 0);
	letter-spacing: 0;
}

.content-title-group h2:hover {
	color: #0092cf;
}

div.card-content {
	background-color: #fafafa;
}



p.card-header-title {
	background-color: #0092cf;
	letter-spacing: 4px;
	color: #fff;
	display: block;
	padding-left: 24px;
}



@media only screen and (max-width: 600px) {
	.custom-logo {
		padding-left: 20px;
		position: relative;
	}
}


.instruction{
	font-family: BMWGroupCondensed-Regular;
	font-size: 2em;
	color: black;
}


@font-face {
    font-family: BMWGroupCondensed-Regular;
    src: url('../assets/fonts/BMWGroupCondensed-Regular.woff') format('woff'), url('../assets/fonts/BMWGroupCondensed-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: BMWGroupCondensed-Bold;
    src: url('../assets/fonts/BMWGroupCondensed-Bold.woff') format('woff'), url('../assets/fonts/BMWGroupCondensed-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}


.grp-h2{font-family:"BMWGroupCondensed-Bold",Impact,Charcoal,sans-serif;font-size:2rem;font-weight:normal;line-height:1.1;color:#444;text-transform:uppercase;}
.grp-h2{overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;-ms-hyphens:auto;-moz-hyphens:auto;-webkit-hyphens:auto;hyphens:auto;}
.grp-h2{max-width:56.25rem;width:100%;}
@media (max-width:480px){
.grp-h2{font-size:1.5rem;}
}
@media (min-width:481px) and (max-width:604px){
.grp-h2{font-size:1.375rem;}
}
@media (min-width:605px) and (max-width:768px){
.grp-h2{font-size:1.5rem;}
}
@media (min-width:769px) and (max-width:880px){
.grp-h2{font-size:1.625rem;}
}
@media (min-width:881px) and (max-width:1024px){
.grp-h2{font-size:1.75rem;}
}
@media (min-width:1025px){
.grp-h2{font-size:2rem;}
}


.grp-textgrayed-viewmore .grp-textgrayed-viewmore__a{float:left!important;}
.grp-textgrayed-viewmore .grp-textgrayed-viewmore__a{font-family:"BMWGroup-Regular",Arial,Helvetica,sans-serif;font-size:.938rem;font-weight:normal;color:#444;}
a{text-decoration:none;}
.grp-textgrayed-viewmore .grp-textgrayed-viewmore__a{color:#444;position:relative;}
a{text-decoration:none;}
.grp-textgrayed-viewmore{width:100%;margin-top:1.5rem;margin-bottom:1.5rem;}
.grp-textgrayed-viewmore:before,.grp-textgrayed-viewmore:after{content:" ";display:table;}
.grp-textgrayed-viewmore:after{clear:both;}
.grp-textgrayed-viewmore .grp-textgrayed-viewmore__a{background:#d9d9d9 none repeat scroll 0 0;line-height:3rem;padding:0 1rem 0 1.5rem;font-family:"BMWGroupCondensed-Bold",Impact,Charcoal,sans-serif;font-size:1rem;width:100%;max-width:265px;}



.commun { grid-area: commun; text-transform: uppercase;}
.comments { grid-area: comments; text-transform: uppercase;}
.avatarquestion { grid-area: avatarquestion; text-transform: uppercase;}
.avatarcomment { grid-area: avatarcomment; text-transform: uppercase;}
.phrases { grid-area: phrases; text-transform: uppercase;}
.content { grid-area: content; text-transform: uppercase;}
.extras { grid-area: extras; text-transform: uppercase;}
.loop{display: none;}

.Q1 { grid-area: Q1; }
.Q2 { grid-area: Q2; }
.Q3 { grid-area: Q3; }
.Q4 { grid-area: Q4; }
.Q5 { grid-area: Q5; }
.Q6 { grid-area: Q6; }

.C1 { grid-area: C1; }
.C2 { grid-area: C2; }
.C3 { grid-area: C3; }

.A1 { grid-area: A1; }
.A2 { grid-area: A2; }
.A3 { grid-area: A3; }
.A4 { grid-area: A4; }
.A5 { grid-area: A5; }
.A6 { grid-area: A6; }
.A7 { grid-area: A7; }
.A8 { grid-area: A8; }
.A9 { grid-area: A9; }

.grid-container.ws_OS85  > .comments, .grid-container.ws_OS9  > .comments, .grid-container.ws_i5Competition  > .comments, .grid-container.ws_JoyOfMovForwardG60  > .comments{
	display: none;
}
.grid-container.ws_OS85 > .commun, .grid-container.ws_OS9 > .commun, .grid-container.ws_i5Competition > .commun, .grid-container.ws_JoyOfMovForwardG60  > .commun{
	display: none;
}
.grid-container.ws1 > .comments,
.grid-container.ws1 > .commun{
	display: none;
}
.grid-container.ws2 > .comments,
.grid-container.ws2 > .commun{
	display: none;
}
.grid-container.ws3 > .comments,
.grid-container.ws3 > .commun{
	display: none;
}
.grid-container.ws4 > .comments,
.grid-container.ws4 > .commun{
	display: none;
}
.grid-container.ws5 > .comments,
.grid-container.ws5 > .commun{
	display: none;
}
.grid-container.ws6 > .comments,
.grid-container.ws6 > .avatarquestion,
.grid-container.ws6 > .avatarcomment{
	display: none;
}
.grid-container.ws7 > .comments,
.grid-container.ws7 > .avatarquestion,
.grid-container.ws7 > .avatarcomment{
	display: none;
}
.grid-container.ws8 > .comments,
.grid-container.ws8 > .avatarquestion,
.grid-container.ws8 > .avatarcomment{
	display: none;
}

@media (min-width:605px){
	.grid-container.ws_OS85, .grid-container.ws_OS9, .grid-container.ws_i5Competition, .grid-container.ws_JoyOfMovForwardG60{
		display: grid;
		grid-template-areas:
			'avatarquestion avatarquestion avatarcomment'
			'Q1 Q2 C1'
			'Q3 Q4 C2'
			'Q5 Q6 C3';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}

	.grid-container.ws1{
		display: grid;
		grid-template-areas:
			'avatarquestion avatarquestion avatarcomment'
			'Q1 Q2 C1'
			'Q3 Q4 C2'
			'Q5 Q6 C3';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}
	.grid-container.ws2{
		display: grid;
		grid-template-areas:
			'avatarquestion avatarquestion avatarcomment'
			'Q1 Q2 C1'
			'Q3 Q4 C2'
			'Q5 Q6 C3';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}
	.grid-container.ws3{
		display: grid;
		grid-template-areas:
			'avatarquestion avatarquestion avatarcomment'
			'Q1 Q2 C1'
			'Q3 Q4 C2'
			'Q5 Q6 C3';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}
	.grid-container.ws4{
		display: grid;
		grid-template-areas:
			'avatarquestion avatarquestion avatarcomment'
			'Q1 Q2 C1'
			'Q3 Q4 C2'
			'Q5 Q6 C3';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}
	.grid-container.ws5{
		display: grid;
		grid-template-areas:
			'avatarquestion avatarquestion avatarcomment'
			'Q1 Q2 C1'
			'Q3 Q4 C2'
			'Q5 Q6 C3';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}
	.grid-container.ws6{
		display: grid;
		grid-template-areas:
			'commun commun commun'
			'A1 A2 A3'
			'A4 A5 A6'
			'A7 A8 A9';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}
	.grid-container.ws7{
		display: grid;
		grid-template-areas:
			'commun commun commun'
			'A1 A2 A3'
			'A4 A5 A6'
			'A7 A8 A9';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}
	.grid-container.ws8{
		display: grid;
		grid-template-areas:
			'commun commun commun'
			'A1 A2 A3'
			'A4 A5 A6'
			'A7 A8 A9';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}
}

@media (max-width:605px){

	.table_text_DE{
		font-size: .67rem;;
	}

	.grid-container.ws_OS85, .grid-container.ws_OS9, .grid-container.ws_i5Competition, .grid-container.ws_JoyOfMovForwardG60{
		display: grid;
		grid-template-areas:
			'avatarquestion avatarquestion'
			'Q1 Q2'
			'Q3 Q4'
			'Q5 Q6'
			'avatarcomment avatarcomment'
			'C1 C2'
			'C3 C3';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}

	.grid-container.ws1{
		display: grid;
		grid-template-areas:
			'avatarquestion avatarquestion'
			'Q1 Q2'
			'Q3 Q4'
			'Q5 Q6'
			'avatarcomment avatarcomment'
			'C1 C2'
			'C3 C3';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}
	.grid-container.ws2{
		display: grid;
		grid-template-areas:
			'avatarquestion avatarquestion'
			'Q1 Q2'
			'Q3 Q4'
			'Q5 Q6'
			'avatarcomment avatarcomment'
			'C1 C2'
			'C3 C3';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}
	.grid-container.ws3{
		display: grid;
		grid-template-areas:
			'avatarquestion avatarquestion'
			'Q1 Q2'
			'Q3 Q4'
			'Q5 Q6'
			'avatarcomment avatarcomment'
			'C1 C2'
			'C3 C3';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}
	.grid-container.ws4{
		display: grid;
		grid-template-areas:
			'avatarquestion avatarquestion'
			'Q1 Q2'
			'Q3 Q4'
			'Q5 Q6'
			'avatarcomment avatarcomment'
			'C1 C2'
			'C3 C3';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}
	.grid-container.ws5{
		display: grid;
		grid-template-areas:
			'avatarquestion avatarquestion'
			'Q1 Q2'
			'Q3 Q4'
			'Q5 Q6'
			'avatarcomment avatarcomment'
			'C1 C2'
			'C3 C3';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}
	.grid-container.ws6{
		display: grid;
		grid-template-areas:
			'commun commun'
			'A1 A2'
			'A3 A4'
			'A5 A6'
			'A7 A8'
			'A9 A9';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}
	.grid-container.ws7{
		display: grid;
		grid-template-areas:
			'commun commun'
			'A1 A2'
			'A3 A4'
			'A5 A6'
			'A7 A8'
			'A9 A9';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}
	.grid-container.ws8{
		display: grid;
		grid-template-areas:
			'commun commun'
			'A1 A2'
			'A3 A4'
			'A5 A6'
			'A7 A8'
			'A9 A9';
		grid-gap: 3px;
		background-color: #444;
		padding: 3px;
		margin-top: 1rem;
		margin-bottom: 2rem;
		color: #444;
	}

}

.video-displayed{
	margin-top: 0 !important;
}

.grid-container > div {
  background-color: rgba(255, 255, 255, 0.8);
  text-align: center;
  padding: 1rem; 
}

.headlines{
	font-size:1.5rem;
	font-family:"BMWGroupCondensed-Bold"
}

.videoPositionID{
	font-size:1.25rem !important;
	font-family:"BMWGroupCondensed-Bold"
}

.layout-container{
    background-color: #f2f2f2;
}

.Q1:hover,
.Q2:hover,
.Q3:hover,
.Q4:hover,
.Q5:hover,
.Q6:hover,
.C1:hover,
.C2:hover,
.C3:hover,
.A1:hover,
.A2:hover,
.A3:hover,
.A4:hover,
.A5:hover,
.A6:hover,
.A7:hover,
.A8:hover,
.A9:hover
{
	cursor: pointer;
	background-color: white;
}