@font-face {
    font-family: 'Chantilly';
    src: url('font/Chantilly-Light-webfont.woff2') format('woff2'), url('font/Chantilly-Light-webfont.woff') format('woff');
    font-weight: 300;
    font-style: normal;
	font-display: fallback;
}
@font-face {
    font-family: 'Chantilly';
    src: url('font/Chantilly-LightItalic-webfont.woff2') format('woff2'), url('font/Chantilly-LightItalic-webfont.woff') format('woff');
    font-weight: 300;
    font-style: italic;
	font-display: fallback;
}
@font-face {
    font-family: 'Chantilly';
    src: url('font/Chantilly-Regular-webfont.woff2') format('woff2'), url('font/Chantilly-Regular-webfont.woff') format('woff');
    font-weight: 400;
    font-style: normal;
	font-display: fallback;
}
@font-face {
    font-family: 'Chantilly';
    src: url('font/Chantilly-Italic-webfont.woff2') format('woff2'), url('font/Chantilly-Italic-webfont.woff') format('woff');
    font-weight: 400;
    font-style: italic;
	font-display: fallback;
}
@font-face {
    font-family: 'Chantilly';
    src: url('font/Chantilly-Medium-webfont.woff2') format('woff2'), url('font/Chantilly-Medium-webfont.woff') format('woff');
    font-weight: 500;
    font-style: normal;
	font-display: fallback;
}
@font-face {
    font-family: 'Chantilly';
    src: url('font/Chantilly-MediumItalic-webfont.woff2') format('woff2'), url('font/Chantilly-MediumItalic-webfont.woff') format('woff');
    font-weight: 500;
    font-style: italic;
	font-display: fallback;
}
@font-face {
    font-family: 'Chantilly';
    src: url('font/Chantilly-Bold-webfont.woff2') format('woff2'), url('font/Chantilly-Bold-webfont.woff') format('woff');
    font-weight: 700;
    font-style: normal;
	font-display: fallback;
}
@font-face {
    font-family: 'Chantilly';
    src: url('font/Chantilly-BoldItalic-webfont.woff2') format('woff2'), url('font/Chantilly-BoldItalic-webfont.woff') format('woff');
    font-weight: 700;
    font-style: italic;
	font-display: fallback;
}



select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image:url('/qg/cms.layout.custom.6/pub/img/select.svg');
    background-repeat: no-repeat;
    background-size: .7em .7em;
    background-position: 97% 50%;
    background-position: top 50% right .3em;
    padding-right: 2.7em;
}
select::-ms-expand {
    display: none;
}



#container {
	word-break:   break-word; /* chrome, -firefox,  edge,  safari, -ie   exactly the save as: ? */
	word-wrap:    break-word; /* chrome,  firefox,  edge,  safari,  ie   w3c changed to: */
	overflow-wrap:break-word; /* chrome,  firefox, -edge, ?safari, -ie */
	-webkit-hyphens:auto;
	-ms-hyphens:auto;
	hyphens:auto;
}
#head {
	xposition:-webkit-sticky;
	xposition:sticky;
}
#content > div { /* ie */
	display:flex;
	flex-direction:column;
}

.l1_width {
    max-width: calc( 40vw + 300px );
    padding-left: 40px;
    padding-right: 40px;
    margin: auto;
}


.c1-fieldTable {
    display:table;
    width: 100%;
	max-width:30em;
}
.c1-fieldTable > * {
    display:table-row-group;
}
.c1-fieldTable > * > * {
    display:table-row;
}
.c1-fieldTable > * > * > * {
    display:table-cell;
    padding:.7em;
    width:50%;
    vertical-align:middle;
}
.c1-fieldTable > * > * > :first-child {
	padding-left:0;
	width:20%;
}
.c1-fieldTable > * > * > :last-child {
	padding-right:0;
}
.c1-fieldTable input:not([type=checkbox]):not([type=radio]) ,
.c1-fieldTable textarea ,
.c1-fieldTable select {
	width:100%;
    vertical-align:middle;
}


#cdCloseCart {
	position:absolute;
	right:35px;
	top:32px;
	cursor:pointer;
}

@media (max-width: 550px) {
	body h1 {
		font-size:1.5em;
	}
	body h2 {
		font-size:1.8em;
	}
	html body button {
		padding:12px 20px;
	}
	body #logo > img {
		height: 30px;
	}
}


#foot1 .-small {
	text-align:right;
}
@media (max-width: 850px) {
	#foot1.cd-cols  {
		display:block;
	}
	#foot1 .-small {
		text-align:left;
	}

}

/* padding / gaps */
@media (max-width: 700px) {
	body #cart {
		padding:30px;
	}
	body #head {
		padding-left:18px;
		padding-right:18px;
	}
	body #logo > img {
		left:30px;
	}
	body .cd-cols > * {
		margin:30px;
	}
	body .l1_width {
		padding-left:30px;
		padding-right:30px;
		max-width:none;
	}
	body #foot {
		padding: 15px 30px 13px 30px;
	}
}

html {
  font-family: sans-serif; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

body {
  margin: 0;
}

details, /* 1 */
main, /* 2 */
summary { /* 1 */
  display: block;
}
/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}
/**
 * Remove the gray background on active links in IE 10.
 */
a {
  background-color: transparent;
}

a:active,
a:hover {
  outline-width: 0;
}
/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}
/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sub {
  bottom: -0.25em;
}
sup {
  top: -0.5em;
}
/**
 * Hide the overflow in IE.
 */
svg:not(:root) {
  overflow: hidden;
}
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}
/**
 * Change font properties to `inherit` in all browsers (opinionated).
 */
button,
input,
select,
textarea {
  font: inherit;
}
/**
 * Restore the font weight unset by the previous rule.
 */
optgroup {
  font-weight: bold;
}

button,
input { /* 1 */
  overflow: visible;
}

button,
input,
select,
textarea { /* 1 */
  margin: 0;
}

button,
select { /* 1 */
  text-transform: none;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
  cursor: pointer;
}

[disabled] {
  cursor: default;
}

button,
html [type="button"], /* 1 */
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; /* 2 */
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

button:-moz-focusring,
input:-moz-focusring {
  outline: 1px dotted ButtonText;
}

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

legend {
  box-sizing: border-box; /* 1 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  -webkit-appearance: textfield;
}

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}


a { /* on buttons to, or * ? */
    -webkit-tap-highlight-color:transparent;
}
ul, ol {
	padding-left: 1.6em;
}
hr {
	color:currentColor;
	border:1px solid;
	opacity:.5;
	border-top-width:0 !important;
	border-left-width:0 !important;
	border-right-width:0 !important;
}

:focus:not(a) { outline:0; }
a:hover { text-decoration:underline; outline: 0; }
a:active { outline: 0; }

table { border-collapse: collapse; }
tbody { vertical-align: top; }
th { text-align:left; }

nav ul {
	margin:0;
	list-style:none;
	list-style-image:none;
	padding:0;
}
nav a, nav a:hover {
	text-decoration:none;
}

label { cursor: pointer; }

input,
[type=search],
textarea,
select,
button,
.c1-inp,
.c1-btn {
	box-sizing:border-box;
	padding:3px 4px;
	font-size:inherit;
	max-width:100%; /* todo: neu ok?*/
}
input,
textarea {
	width:170px;
	border-radius:0;
}
select {
	padding:3px 3px 3px 4px;
}
/* overwritten after
input[type=button],
input[type=submit],
input[type=reset],
button {
	padding-left:1em;
	padding-right:1em;
}
*/
xinput[type=file],
input[type=range],
input[type=checkbox],
input[type=radio] {
	padding:0;
	border:0;
}
input[type=file] {
	padding-left:0;
	border-color:transparent;
	border-left-width:0;
}
body input[type=checkbox],
body input[type=radio],
input[type=button],
input[type=submit],
input[type=reset],
input[type=file],
button {
	width:auto;
}
[type=checkbox],
[type=radio] {
	cursor:pointer;
}
[type=number] {
	text-align:right;
}

input[type=text],
input[type=password],
input[type=number],
input[type=search],
/*input[type=date], not good on ios */
input[type=email],
input[type=tel],
input:not([type]) {
	-webkit-appearance: none;
}

/* overwrite styles */
select, input, textarea, .c1-inp, button, .c1-btn {
	padding:.2em;
	border:1px solid #999;
	font-family:inherit;
	line-height:1.4;
	margin:0;
	color:inherit;
}
.c1-inp {
	background-color:#fff;
	border:1px solid #999;
	min-height:1.9em;
	width:170px;
	display:inline-flex; /* was flex */
}
html body .c1-inp > * {
	margin:0;
	border-width:0 0 0 1px;
	border-radius:0;
	flex:1 1 auto;
}
.c1-inp > *:first-child {
	border-left-width:0;
}
.c1-inp > input {
	flex:100 1 auto;
}
.c1-btn,
button,
input[type=submit],
input[type=reset],
input[type=button] {
	background-image:linear-gradient(#fff,#ddd);
	border-radius:3px;
	padding-left:.8em;
	padding-right:.8em;
	cursor:pointer;
	color:inherit;
	text-align:center;
	text-decoration:none;
}
.c1-btn:hover,
button:hover,
input[type=submit]:hover,
input[type=reset]:hover,
input[type=button]:hover {
	border-color:#666;
	color:inherit; /* a-tag */
	text-decoration:none; /* a-tag */
}
.c1-btn:active,
button:active,
input[type=submit]:active,
input[type=reset]:active,
input[type=button]:active {
	background-image:linear-gradient(#ddd,#fff);
}
.c1-btn[disabled],
button[disabled],
input[type=submit][disabled],
input[type=reset][disabled],
input[type=button][disabled] {
	background-image:linear-gradient(#fff,#eee);
	border-color:#999;
	opacity:.9;
	color:#aaa;
}

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

