@charset "UTF-8";

/*
Theme Name: Victoria M
Theme URI: /
Author: Gregor Schubert
Author URI: https://www.schoenberger-group.com/
Description:
Version: 0.3 (mobile first)
Text Domain: victoriam
*/

/*
 * Mobile first: the rules outside @media are for phones and tablets (one column, fluid width, larger text and
 * tap targets). From 980px the block at the end restores the original desktop layout (960px, two columns) –
 * the desktop view stays identical to the WordPress site.
 * Menu button "Menü": static/micro/menu.js (without JavaScript the menu is always open).
 */

/* lusitana-regular - latin */
@font-face {
  font-family: 'Lusitana';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/lusitana-v7-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Lusitana'),
  url('fonts/lusitana-v7-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('fonts/lusitana-v7-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
  url('fonts/lusitana-v7-latin-regular.woff') format('woff'), /* Modern Browsers */
  url('fonts/lusitana-v7-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
  url('fonts/lusitana-v7-latin-regular.svg#Lusitana') format('svg'); /* Legacy iOS */
}
/* lusitana-700 - latin */
@font-face {
  font-family: 'Lusitana';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/lusitana-v7-latin-700.eot'); /* IE9 Compat Modes */
  src: local('Lusitana Bold'), local('Lusitana-Bold'),
  url('fonts/lusitana-v7-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('fonts/lusitana-v7-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
  url('fonts/lusitana-v7-latin-700.woff') format('woff'), /* Modern Browsers */
  url('fonts/lusitana-v7-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
  url('fonts/lusitana-v7-latin-700.svg#Lusitana') format('svg'); /* Legacy iOS */
}

/* ------------------------------------------------------------------ base = phones and tablets */

html, body {
  margin: 0 auto;
  font-family: 'Lusitana', serif; font-size: 16px; line-height: 1.5; color: #444;
  background: #000;
  -webkit-text-size-adjust: 100%; text-size-adjust: 100%;
}

#header { background: #000; margin: 0px; }

h1 { color: #8B652B; font-size: 26px; font-weight: normal; line-height: 1.25; }
h2 { color: #8B652B; font-size: 22px; font-weight: normal; line-height: 1.4em; }
h3 { color: #8B652B; font-size: 18px; font-weight: normal; line-height: 1.3; }
h4 { color: #8B652B; font-size: 14px; font-weight: normal; }
a { color: #8B652B; font-weight: normal; text-decoration: none; padding: 0px; }
a:hover { border-bottom: 1px dotted #8B652B; }

/* 16px in fields: no automatic zoom on iPhone */
input[type=text], input[type=email], textarea { padding: 8px; border: 1px solid #ccc; width: 100%; box-sizing: border-box; font-family: 'Lusitana', serif; font-size: 16px; border-radius: 3px; }
input.captcha { width: 100px; }
textarea { height: 180px; }
input[type=text]:focus,input[type=email]:focus,
textarea:focus { border: 1px solid #8B652B; }
input[type=submit] { background: #8B652B; color: #fff; font-weight: bold; width: 100%; padding: 12px; font-family: 'Lusitana', serif; font-size: 16px; border: none; cursor: pointer; margin: 30px 0px; border-radius: 3px }
input[type=submit]:hover { background: #9c763c; }

.invisible { display: none; }
.clear { clear: both; }
.inner { margin: 0 auto; }
.mandatory br {
  display:none;
}

/* header: logo left, button "Menü" right, menu below the two */
#header .inner { display: flex; flex-wrap: wrap; align-items: center; padding: 12px 16px; }
#logo { display: block; border: none; }
#logo img { display: block; width: 120px; height: auto; }

.nav-toggle { display: none; }
html.js .nav-toggle { display: block; margin-left: auto; min-height: 44px; padding: 10px 14px; background: none; border: 1px solid #605443; border-radius: 3px; color: #fff; font-family: 'Lusitana', serif; font-size: 16px; line-height: 1; cursor: pointer; }
html.js .nav-toggle::after { content: " \2261"; color: #8B652B; }
html.js .nav-toggle[aria-expanded="true"]::after { content: " \00D7"; }
html.js #header:not(.nav-open) .mod_navigation { display: none; }

#header .mod_navigation { flex: 0 0 100%; }
#header ul { margin: 0px; padding: 8px 0px 0px 0px; list-style: none; }
#header li { margin: 0px; padding: 0px; font-size: 16px; border-top: 1px solid #333; }
#header li a { display: inline-block; padding: 11px 0; color: #fff; text-decoration: none; }
#header li.active a { border: none; }
#header li.active:before,
#header li.trail:before { content: "[ "; color: #8B652B; }
#header li.active:after,
#header li.trail:after { content: " ]"; color: #8B652B; }

#nav_products ul { margin: 0px; padding: 0px; list-style: none; }
#nav_products li { line-height: 1.6em; }
#nav_products li.active a { color: #000; font-weight: bold; }

/* header image: full width, height from the image */
#headerimg { background: url(img/bg-headerimg-x.png) repeat-x 0 0 #fff; }
#headerimg img { box-shadow: 0px 0px 3px #000; display: block; max-width: 100%; height: auto; }

/* content first, left column below it */
#content { clear: both; background: #fff; margin: 0px; padding: 0px 0px 20px 0px; }
#content .inner { display: flex; flex-direction: column; padding: 0px 16px; background: #fff; }
#main { order: -1; padding: 10px 0px 20px 0px; overflow-wrap: break-word; }
#main img, #main iframe, #main video { max-width: 100%; }
#main img { height: auto; }
/* tables: columns as wide as their words, German hyphenation instead of breaking words anywhere */
#main table { font-size: 14px; }
#main .wp-block-table .has-fixed-layout { table-layout: auto; }
#main .wp-block-table .has-fixed-layout td, #main .wp-block-table .has-fixed-layout th { word-break: normal; overflow-wrap: normal; -webkit-hyphens: auto; hyphens: auto; }
#main .wp-block-table td, #main .wp-block-table th { padding: 6px 4px; }
/* left column below the content, without menus: only boxes such as the quality seal or the address */
#left { padding: 20px 0px; border-top: 1px solid #e3e3e3; }
.desktop-only { display: none; }
#left:not(:has(.mod_box_items:not(.desktop-only))) { display: none; }

/* other links of the left column (shop): submenu above the first paragraph (layout.php) */
.submenu { margin: 0px 0px 16px 0px; padding: 12px 14px; background: #f7f3ec; border-left: 3px solid #8B652B; }
.submenu-title { margin: 0px 0px 8px 0px; color: #8B652B; font-size: 15px; }
.submenu ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0px; padding: 0px; list-style: none; }
.submenu a { display: inline-block; padding: 8px 12px; border: 1px solid #d9c9ae; border-radius: 3px; background: #fff; }
.submenu a:hover { border-color: #8B652B; }

#left .mod_box_items { margin: 0px 0px 30px 0px; position: relative; }
#left .mod_box_items:last-child { margin-bottom: 0px; }
#left li a, #left p a { display: inline-block; padding: 7px 0px; }
#quality { text-align: left; }
#quality h3 { margin: 0px; }
#qualityseal { float: left; margin: 0px 12px 4px 0px; }
.seal-space { display: none; }

/* contact form: label above the field */
.formbody table, .formbody tbody, .formbody tr, .formbody td { display: block; }
.formbody td.col_0 p { margin: 14px 0px 4px 0px; }
.formbody td.col_1 p { margin: 0px; }
.formbody tr.row_last td.col_0 { display: none; }  /* empty cell left of the button */
.formbody input[type=submit] { margin: 24px 0px 0px 0px; }

#footer { background: #000; padding: 0px; margin: 0px; }
#footer .inner { padding: 20px 16px; color: #fff; font-size: 13px; text-align: center; }
#footer #copy { padding: 0px; margin: 0px 0px 8px 0px; }
#footer #footerlinks { padding: 0px; margin: 0px; }
#footer a { display: inline-block; margin: 0px 8px; padding: 8px 0px; color: #fff; }

p.error { color: #CC0000; font-weight: bold; }

/* COOKIE BOT */

#CybotCookiebotDialog {
  border: none !important;
  border-radius: 0 !important;
  color: #555 !important;
  margin-top: 91px !important;
  font-family: 'Lusitana', serif !important; font-size: 14px; line-height: 1.3em;
}

#CybotCookiebotDialog #CybotCookiebotDialogBodyContentText {
  font-size: 14px !important;
  font-family: 'Lusitana', serif; line-height: 1.3em; color: #444;
}


#CybotCookiebotDialog .CybotCookiebotDialogBodyLevelButtonsRow {
  display: flex;
  flex-direction: column;
}

#CybotCookiebotDialog #CybotCookiebotDialogBodyLevelButtonsSelectPane {
  border: none !important;
  display: flex !important;
  font-size: 16px !important;
  justify-content: space-between !important;
}

#CybotCookiebotDialog #CybotCookiebotDialogBodyLevelDetailsWrapper {
  border: none !important;
  background-color: #fff !important;
  display: flex !important;
  justify-content: flex-end !important;
  padding-top: 15px !important;
  width: 100% !important;
}

#CybotCookiebotDialog #CybotCookiebotDialogBodyLevelDetailsWrapper #CybotCookiebotDialogBodyLevelDetailsButton {
  color: #555;
  font-size: 14px !important;
  font-weight: 600 !important;
}

#CybotCookiebotDialog #CybotCookiebotDialogBodyLevelDetailsWrapper #CybotCookiebotDialogBodyLevelDetailsButton:hover {
  color: #777777 !important;
}

#CybotCookiebotDialog #CybotCookiebotDialogBodyLevelButtonAccept {
  background-color: rgb(112, 182, 44) !important;
  border: 2px solid rgb(112, 182, 44);
  color: #555 !important;
  display: inline-block !important;
  font-size: 14px !important;
  font-weight: bold !important;
  margin-left: 15px !important;
  min-width: 80px !important;
  padding: 12px 16px !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  text-align: center !important;
  white-space: nowrap !important;
  z-index: 10 !important;
  font-family: 'Lusitana', serif !important;
}



#CybotCookiebotDialog #CybotCookiebotDialogBodyLevelButtonAcceptWrapper {
  margin-top: 15px !important;
}

#CybotCookiebotDialog #CybotCookiebotDialogBodyLevelButtonAcceptWrapper .CybotCookieDialogBodyLevelButtonAcceptAll {
  background-color: rgb(112, 182, 44) !important;
  border: 2px solid rgb(112, 182, 44);
  color: #555 !important;
  display: inline-block !important;
  font-size: 14px !important;
  font-weight: bold !important;
  margin-left: 15px !important;
  min-width: 80px !important;
  padding: 12px 16px !important;
  text-decoration: none !important;
  text-transform: uppercase !important;
  text-align: center !important;
  white-space: nowrap !important;
  z-index: 10 !important;
  font-family: 'Lusitana', serif !important;
}

#CybotCookiebotDialog #CybotCookiebotDialogBodyLevelButtonAcceptWrapper .CybotCookieDialogBodyLevelButtonAcceptAll:hover {
  background-color: rgb(133, 193, 75) !important;
  border: 2px solid rgb(133, 193, 75) !important;
  color: #3B444D !important;
}

input[type="checkbox"].CybotCookiebotDialogBodyLevelButton:checked + label, input[type="checkbox"].CybotCookiebotDialogBodyLevelButton + label {
  font-family: 'Lusitana', serif !important;
}

h2#CybotCookiebotDialogBodyContentTitle , #CybotCookiebotDialogBodyLevelDetailsButton {
  font-family: 'Lusitana', serif !important;
}
.pb10 {
    padding-bottom: 10px;
  }

.tg {
    border-collapse: collapse;
    border-color: #ccc;
    border-spacing: 0;
  }

.tg td {
    background-color: #fff;
    border-color: #ccc;
    border-style: solid;
    border-width: 1px;
    color: #333;
    overflow: hidden;
    padding: 10px 5px;
    word-break: normal;
  }

.tg th {
    background-color: #f0f0f0;
    border-color: #ccc;
    border-style: solid;
    border-width: 1px;
    color: #333;
    font-weight: bold;
    overflow: hidden;
    padding: 10px 5px;
    word-break: normal;
  }

.tg .tg-0lax {
    text-align: left;
    vertical-align: top
  }
.veluxcopy {display:block;text-align:center;padding:1.2em 0 0 0;}

/* ------------------------------------------------------------------ desktop from 980px = original layout */

@media (min-width: 980px) {
  html, body { font-size: 14px; line-height: 1.3em; }
  h1, h3 { line-height: inherit; }

  input[type=text], input[type=email], textarea { padding: 3px; width: 350px; box-sizing: content-box; font-size: 14px; }
  input[type=submit] { width: 360px; padding: 5px; font-size: 14px; }

  .inner { width: 960px; }

  #header .inner { display: block; padding: 0px; }
  #logo { float: left; margin: 0px 50px 0px 0px; padding: 30px 50px 20px 30px; border-right: 1px solid #605443; }
  #logo img { display: inline; width: auto; }
  html.js .nav-toggle { display: none; }
  html.js #header:not(.nav-open) .mod_navigation, #header .mod_navigation { display: block; }
  #header ul { padding: 105px 0px 0px 0px; }
  #header li { float: left; margin: 0px 26px 0px 0px; border-top: none; }
  #header li a { display: inline; padding: 0px; }

  #headerimg img { display: inline; max-width: none; height: 300px; }

  #content { background: url(img/bg-shadow.png) no-repeat 50% 100% #fff; margin: -10px 0px 0px 0px; padding: 10px 0px 20px 0px; }
  #content .inner { display: block; padding: 10px 0px 0px 0px; margin-top: -10px; margin-bottom: 40px; background: url(img/bg-main-y.png) repeat-y 280px 0 #fff; }
  #main { width: 600px; float: right; padding: 30px; overflow-wrap: normal; }
  #main .wp-block-table .has-fixed-layout { table-layout: fixed; }
  #main .wp-block-table .has-fixed-layout td, #main .wp-block-table .has-fixed-layout th { word-break: break-word; -webkit-hyphens: manual; hyphens: manual; }
  #main .wp-block-table td, #main .wp-block-table th { padding: .5em; }
  #left { display: block; width: 210px; padding: 30px 40px 30px 30px; float: left; border-top: none; }
  #left:not(:has(.mod_box_items:not(.desktop-only))) { display: block; }
  .desktop-only { display: block; }
  .mobile-only { display: none; }

  #left .mod_box_items { margin: 0px 0px 50px 0px; }
  #left li a, #left p a { display: inline; padding: 0px; }
  #quality { text-align: justify; }
  #quality h3 { padding-left: 40px; }
  #qualityseal { float: none; margin: 0px; position: absolute; top: -14px; left: -47px; }
  .seal-space { display: inline; }

  .formbody table { display: table; }
  .formbody tbody { display: table-row-group; }
  .formbody tr { display: table-row; }
  .formbody td { display: table-cell; }
  .formbody td.col_0 p, .formbody td.col_1 p { margin: 1em 0px; }
  .formbody tr.row_last td.col_0 { display: table-cell; }
  .formbody input[type=submit] { margin: 30px 0px; }

  #footer { margin: -30px 0px 0px 0px; }
  #footer .inner { border-top: 10px solid #fff; padding: 20px 0px; font-size: 12px; text-align: left; }
  #footer #copy { padding: 0px 0px 0px 30px; margin: 0px; float: left; }
  #footer #footerlinks { padding: 0px 30px 0px 0px; float: right; }
  #footer a { display: inline; margin: 0px 0px 0px 15px; padding: 0px; }
}