/*-------------------------------------------------------------------------------------

  Copyright (c) 2014 Pixelzauber GmbH, Switzerland
  CSS definition for text

-------------------------------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css?family=Barlow:300,400,500,600,700&display=swap');

body {
	font-family             : 'Barlow', Arial, Helvetica, sans-serif;
	color                   : rgb(0, 0, 0);
	font-size               : 22px;
	font-weight             : 400;
	text-align              : left;
	-webkit-text-size-adjust: none;
}

h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
	font-family: 'Barlow', Arial, Helvetica, sans-serif;
	margin     : 20px 0 15px 0;
	font-weight: 600;
	line-height: 1.0em;
}

h1,
.h1 {
	margin     : 20px 0 25px 0;
	font-size  : 70px;
	font-weight: 400;
}

h2,
.h2 {
	margin-top: 44px;
	font-size : 30px;
}

h3,
.h3 {
	font-size: 22px;
}

h4,
.h4 {
	line-height  : 1.45em;
	margin-bottom: 8px;
	font-size    : 22px;
}

h5,
.h5 {
	font-weight: 400;
	font-size  : 1.25rem
}

h6,
.h6 {
	font-weight: 400;
	font-size  : 1.0rem
}

.first {
	margin-top: 0;
}

.center {
	text-align: center;
}


p {
	line-height    : 1.35em;
	margin-bottom  : 8px;
	-webkit-hyphens: auto;
	-moz-hyphens   : auto;
	hyphens        : auto;
}

a {
	color          : rgb(43, 208, 210);
	text-decoration: none;
}

a:hover {
	color          : rgb(0, 0, 0);
	text-decoration: none;
}

a.active {}

a[name],
a[name]:hover {
	color          : rgb(51, 51, 51);
	text-decoration: none;
}

em {
	font-style: italic;
}

pre {
	padding    : 10px 19px;
	margin     : 18px 0 12px 0;
	line-height: 20px;
	width      : auto;
	color      : rgb(0, 0, 160);

	border          : 1px solid rgb(204, 204, 204);
	background-color: rgb(241, 241, 241);

	overflow  : auto;
	overflow-Y: hidden;
}

sup {
	line-height: 1.0em;
}

blockquote {
	position   : relative;
	padding    : 6px 30px 22px 30px;
	margin     : 11px 0;
	width      : calc(100% - 60px);
	font-weight: 900;
	line-height: 1.2em;
	font-style : normal;
	color      : rgb(0, 0, 0);
}

blockquote:before,
blockquote:after {
	position : absolute;
	font-size: 3rem;
	width    : 30px;
	height   : 30px;
}

blockquote:before {
	content: '\00AB';
	left   : 0;
	top    : -5px;
}

blockquote:after {
	content   : '\00BB';
	text-align: right;
	right     : 0;
	bottom    : 50px;
}

blockquote cite {
	margin-right: 33px;
	padding-top : 3px;
	display     : block;
	font-size   : 1em;
	font-weight : 300;
	text-align  : right;
	color       : rgb(0, 0, 0);
}

blockquote cite:before {
	content: none;
}

ol,
ul {
	margin : 0;
	padding: 0 0 15px 0;
	width  : 100%;
}

ul ul,
ol ol {
	margin : 0;
	padding: 0;
	width  : 100%;
}

ul li {
	list-style : none;
	text-align : left;
	line-height: 1.5em;
	margin     : 0 0 0 20px;
}

ul li::before {
	float    : left;
	content  : "\25CF";
	color    : rgb(0, 0, 0);
	margin   : 0 0 -10px -15px;
	display  : block;
	font-size: 0.7em;
}

ol li {
	margin-left: 30px;
	line-height: 1.5em;
	list-style : decimal;
}

ul.invert li a {
	color: rgb(51, 51, 51);
}

ul.invert li a:hover {
	color: rgb(190, 30, 60);
}

ul.none li {
	margin-left: 2px;
}

ul.none li::before {
	content    : none;
	margin-left: 0;
}

@media print {
	ol {
		margin    : 0 0 0 24px;
		padding   : 0;
		list-style: decimal;
	}

	ul {
		margin    : 0 0 0 17px;
		padding   : 0;
		list-style: disc;
	}

	ol li,
	ul li {
		margin    : 0;
		padding   : 0;
		background: none;
	}
}

b,
strong {
	font-weight: 900;
}

hr {
	padding   : 0 0 20px 0;
	margin    : 20px 0 0 0;
	height    : 0;
	border    : 0;
	border-top: 1px solid rgb(0, 0, 0);
	border-top: 1px solid rgb(204, 204, 204);
}

table {
	margin-bottom: 10px;
	font-family  : 'Barlow', Arial, Helvetica, sans-serif;
	font-size    : 1.0em;
}

table th {
	border-bottom: 1px dotted rgb(0, 0, 0);
	font-weight  : 400;
	padding      : 2px 0 5px 0;
	text-align   : left;
}

table td {
	padding: 6px 0 3px 0;
}

table.none,
table.none td {
	padding      : 0px;
	margin-bottom: 0px;
}

table.zebra thead tr {
	background-color: rgb(233, 233, 233);
}

table.zebra tbody tr:nth-child(even) {
	background-color: rgb(243, 243, 243);
}


.column {
	column-count: 2;
	column-gap  : 30px;
}


/*-------------------------------------------------------------------------------------
  CSS Customising
-------------------------------------------------------------------------------------*/
h1.kursiv,
h2.kursiv,
h3.kursiv,
h4.kursiv,
h5.kursiv,
p.kursiv,
.italic {
	font-style: italic;
}

.content a.pdf,
.content a:hover.pdf {
	background   : transparent url('../images/icon_system.png') 0 -194px no-repeat;
	padding-left : 20px;
	padding-right: 0;
}

.content a.doc,
.content a:hover.doc,
.content a.docx,
.content a:hover.docx {
	background   : transparent url('../images/icon_system.png') 0 -294px no-repeat;
	padding-left : 20px;
	padding-right: 0;
}

.content a.xls,
.content a:hover.xls,
.content a.xlsx,
.content a:hover.xlsx {
	background   : transparent url('../images/icon_system.png') 0 -394px no-repeat;
	padding-left : 20px;
	padding-right: 0;
}

.content a.ppt,
.content a:hover.ppt,
.content a.pptx,
.content a:hover.pptx {
	background   : transparent url('../images/icon_system.png') 0 -494px no-repeat;
	padding-left : 20px;
	padding-right: 0;
}

.content a.jpg,
.content a:hover.jpg {
	background   : transparent url('../images/icon_system.png') 0 -594px no-repeat;
	padding-left : 20px;
	padding-right: 0;
}

.content a.zip,
.content a:hover.zip {
	background   : transparent url('../images/icon_system.png') 0 -694px no-repeat;
	padding-left : 20px;
	padding-right: 0;
}

.content a.none,
.content a:hover.none {
	background   : none;
	padding-right: 0px;
	padding-left : 0px
}


p.button {
	padding: 20px 0 20px 0;
	margin:0;
	line-height: 1;
}

.button a {
	padding         : 10px 30px;
	margin          : 0;
	color           : rgb(0, 0, 0);
	border          : 1px solid rgb(0, 0, 0);
	background-color: rgb(255, 255, 255);
}

.button a:hover,
.button a.active {
	color           : rgb(255, 255, 255);
	background-color: rgb(0, 0, 0);
}

p.button.rolex {
	padding-top: 30px;
}
p.button.rolex a {
	padding: 10px 30px 12px 30px;
	color           : rgb(255, 255, 255);
	border-radius   : 25px;
	border          : 1px solid #127749;
	background-color: #127749;
}

p.button.rolex a:hover {
	color           : #127749;
	background-color: rgb(255, 255, 255);
}

.teaser p {
	color: rgb(255, 255, 255);
}

h2.line,
h3.line {
	position      : relative;
	padding       : 66px 0 33px 0;
	clear         : both;
	font-size     : 30px;
	color         : rgb(43, 208, 210);
	text-align    : center;
	text-transform: uppercase;
	z-index       : 1;
}
h2.line {
	color : rgb(0,0,0);
	text-transform: inherit;
}

h2.line::before,
h3.line::before {
	position  : absolute;
	border-top: 1px solid rgb(112, 112, 112);
	content   : "";
	margin    : 0 auto;
	top       : calc(50% + 18px);
	left      : 0;
	right     : 0;
	bottom    : 0;
	width     : 100%;
	z-index   : -1;
}

h2.line span,
h3.line span {
	background-color: rgb(255, 255, 255);
	padding         : 0 22px;
}

.marker {
	background-image   : url(../images/marker.svg);
	background-position: center bottom;
	background-size    : 30px auto;
	background-repeat  : no-repeat;
	width              : 30px;
	height             : 48px;
	cursor             : pointer;
}

.mapboxgl-popup {
	max-width: 200px;
}

.mapboxgl-popup-content {
	text-align : center;
	font-family: 'Barlow', Arial, Helvetica, sans-serif;
	font-size: 1.1rem;
	line-height: 1.1;
}



footer {
	font-size: 16px;
	color    : rgb(0, 0, 0);
}

footer .block .block {
	margin-top   : 22px;
	margin-bottom: 22px;
}

footer h4 {
	border-bottom: solid 1px rgb(0, 0, 0);
}

footer img.socialMediaIcon {
	margin: 20px 0;
	width : 40px;
}

footer a {
	color: rgb(0, 0, 0);
}

footer a:hover {
	color: rgb(255, 255, 255);
}

footer .nav ul li {
	margin    : 0;
	padding   : 0;
		line-height: 1;
}
footer .nav ul li::before {
	content: none;
}
footer .nav ul li a {
	padding    : 0;
	margin: 0;
	line-height: 1;
	line-height : 1.35em;
	margin-bottom : 8px;
}




/* Rückrufservice */
.iframe legend,
.iframe label {
	display: none;
}


.iframe {
	/*
	color: rgb(255, 255, 255) !important;
	*/
}

.iframe h1,
.iframe h2,
.iframe h3,
.iframe h4 {
	/*
	font-weight: 400;
	font-size  : 1.3rem;
	color      : rgb(255, 255, 255) !important;
	*/
}

.iframe p {
	margin-bottom: 5px;
	line-height: 1.1;
}



/*-------------------------------------------------------------------------------------
  CSS DEFINITIONS FOR jcarousel
-------------------------------------------------------------------------------------*/
/* SLIDER */
ul.slides-container {
	display : none;
	position: relative;
	float   : left;
	margin  : 0;
	padding : 0;
	width   : 100%;
	height  : 100%;
}

ul.slides-container li {
	position: relative;
	float   : left;
	margin  : 0;
	padding : 0;
	width   : 100%;
	height  : 100%;
	z-index : 0;
}

ul.slides-container li::before {
	content: none;
	margin : 0;
	padding: 0;
}

.slides-pagination {
	position       : absolute;
	display        : flex;
	flex-direction : row;
	justify-content: center;
	margin         : 0;
	padding        : 0;
	bottom         : 150px;
	width          : 100%;
	height         : 16px;
	text-align     : center;
	z-index        : 100;
}

.slides-pagination a {
	padding         : 0;
	margin          : 0 4px 0 4px;
	width           : 16px;
	height          : 16px;
	background-color: rgba(255, 255, 255, 0.5);
	border-radius   : 50%;
	display         : -moz-inline-stack;
	display         : inline-block;
	vertical-align  : middle;
	overflow        : hidden;
	text-indent     : -100px;
}

.slides-pagination a.current {
	background-color: rgba(255, 255, 255, 1);
}

.slides-navigation {
	position  : absolute;
	margin    : 0;
	padding   : 0;
	top       : 40%;
	width     : 100%;
	text-align: center;
	z-index   : 4;
}

.slides-navigation a {
	position      : absolute;
	display       : block;
	padding       : 0;
	margin        : 1px 0 0 0;
	width         : 80px;
	height        : 80px;
	display       : -moz-inline-stack;
	display       : inline-block;
	vertical-align: middle;
	overflow      : hidden;
	text-indent   : -200px;
}

.slides-navigation a.prev {
	left           : 0;
	background     : transparent url("../images/icon_prev.svg") center no-repeat;
	background-size: 80px 80px;
}

.slides-navigation a.next {
	right          : 0;
	background     : transparent url("../images/icon_next.svg") center no-repeat;
	background-size: 80px 80px;
}