/*
 * PGE-Tema – indholds-elementer: sektioner, titler, tekst, billeder,
 * ikon-bokse, bannere og producentoversigt.
 */

/* ---------- Sektion ---------- */

.section { position: relative; display: flex; flex-flow: row; align-items: center; width: 100%; min-height: auto; padding: 30px 0; }
.section.dark { background-color: #666; }
.section-bg { overflow: hidden; }
.section-bg, .section-content { width: 100%; }
.section-content { z-index: 1; }
.section-bg img.bg, .section-bg > img, .banner-bg img.bg, .bg-fill img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 50%;
}
.section-bg-overlay, .banner .overlay { position: absolute; top: 0; left: 0; right: 0; bottom: 0; }
.has-parallax { overflow: hidden; }
.section .is-border { border-left: 0; border-right: 0; }
.pge-icon-section { padding-top: 38px; padding-bottom: 38px; }
.pge-icon-row > .col > .col-inner { padding: 0; margin: 0 0 -25px; }


/* ---------- Titel med streger ---------- */

.section-title-container { margin-bottom: 1.5em; }
.section-title { position: relative; display: flex; flex-flow: row wrap; align-items: center; justify-content: space-between; width: 100%; }
.section-title b { display: block; flex: 1; height: 2px; background-color: currentColor; opacity: .1; }
.section-title span { text-transform: none; }
.section-title-normal { border-bottom: 2px solid #ececec; }
.section-title-normal span { margin-right: 15px; margin-bottom: -2px; padding-bottom: 7.5px; border-bottom: 2px solid rgba(0, 0, 0, .1); }
.section-title-normal b { display: none; }
.section-title-center span { margin: 0 15px; text-align: center; }
.section-title-bold-center span, .section-title-bold span { padding: .3em .8em; border: 2px solid rgba(0, 0, 0, .1); }
.section-title-center span, .section-title-bold-center span { text-align: center; }
.section-title a { display: block; margin-left: auto; padding-left: 15px; font-size: .8em; }
.section-title i { margin-left: .3em; opacity: .6; }
.dark .section-title-normal, .dark .section-title-normal span { border-color: rgba(255, 255, 255, .2); }

/* ---------- Tekst og billede ---------- */

.text { }
/* Første ikon-boks: afsnittet beholder sin afstand i bunden (som hidtil) */
.pge-icon-row .icon-box-text > .text > p:last-child { margin-bottom: 1.3em; }
.text p:last-child, .col-inner > p:last-child { }
.img { position: relative; }
.img, .img img { width: 100%; }
.img .img-inner { position: relative; overflow: hidden; }
.img-inner.image-cover { height: auto; background-position: 50% 50%; background-size: cover; }
.image-cover img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; padding: 0; margin: 0; object-fit: cover; object-position: 50% 50%; font-family: "object-fit: cover;"; }
.x, .y { }
@media (min-width: 850px) { .aligncenter { display: block; margin: 0 auto; clear: both; } }
.image-cover { position: relative; padding-top: 100%; overflow: hidden; background-position: 50% 50%; background-size: cover; }
@media (min-width: 850px) { .is-sticky-column { position: sticky; top: 30px; } }
.is-sticky-column__inner { display: flow-root; }
.wpcf7 { position: relative; color: #333; }
/* Kontaktformular (Contact Form 7) */
.wpcf7 p { margin: 0; padding: 0; }
.wpcf7 label { display: inline-block; width: 100%; }
.wpcf7 .wpcf7-form-control-wrap { display: block; }
.wpcf7 span.wpcf7-list-item { margin: 0 1.2em 0 0; }
.wpcf7 .wpcf7-response-output { border-radius: 10px; }
.wpcf7 .wpcf7-validation-errors, .wpcf7 .ajax-loader { display: none; }
.wpcf7 .ajax-loader { position: absolute; right: 0; background-color: #fff; border-radius: 99px; }
.wpcf7 .wpcf7-not-valid { color: #b20000; border-color: #b20000; }
.wpcf7 .wpcf7-not-valid-tip { position: relative; display: block; margin-top: -10px; padding: 5px 8px; line-height: 1.2em; color: #b20000; background-color: #f1f1f1; border-radius: 3px; opacity: .8; }
.wpcf7 .wpcf7-not-valid-tip::after { content: " "; position: absolute; top: -20px; left: 30px; width: 0; height: 0; margin-left: -10px; border: 10px solid rgba(136, 183, 213, 0); border-bottom-color: #f1f1f1; pointer-events: none; }
.slider { position: relative; overflow-x: scroll; overflow-y: hidden; white-space: nowrap; scrollbar-width: none; }
.slider::-webkit-scrollbar { display: none; }
.row-slider { position: relative; scrollbar-width: none; }
.slider-nav-reveal { overflow: hidden; }
img.alignleft, .alignleft { float: left; margin-right: 1em; margin-bottom: 1em; }
img.alignright, .alignright { float: right; margin-left: 1em; margin-bottom: 1em; }
.wp-caption { max-width: 100%; margin-bottom: 2em; }
.wp-caption .wp-caption-text { padding: .4em; font-size: .9em; font-style: italic; background: rgba(0, 0, 0, .05); }
.wp-caption-text { text-align: center; }

/* ---------- Ikon-boks ---------- */

.icon-box .icon-box-img { position: relative; max-width: 100%; margin-bottom: 1em; }
.icon-box-img .icon { overflow: hidden; }
.icon-box-img img, .icon-box-img svg { width: 100%; padding-top: .2em; }
.icon-box-img svg { fill: currentColor; height: 100%; transition: all .3s; }
.icon-box-center .icon-box-img { margin: 0 auto 1em; }
.icon-box-left, .icon-box-right { display: flex; flex-flow: row wrap; width: 100%; }
.icon-box-left .icon-box-img, .icon-box-right .icon-box-img { position: relative; flex: 0 0 auto; margin-bottom: 0; max-width: 200px; }
.icon-box-left .icon-box-img + .icon-box-text { padding-left: 1em; }
.icon-box-left .icon-box-text, .icon-box-right .icon-box-text { flex: 1 1 0px; }
.has-icon-bg .icon { position: relative; height: 0; padding-top: 100%; }
.has-icon-bg .icon .icon-inner { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0; border: 2px solid currentColor; border-radius: 100%; transition: all .3s; }
.has-icon-bg .icon i, .has-icon-bg .icon img, .has-icon-bg .icon svg { position: absolute; top: 50%; left: 50%; max-width: 60%; max-height: 60%; padding: 0; object-fit: cover; transform: translateX(-50%) translateY(-50%); }
.has-icon-bg .icon img { }
.icon-box:hover .has-icon-bg .icon-inner { background-color: currentColor; }
.icon-box:hover .has-icon-bg .icon-inner img, .icon-box:hover .has-icon-bg .icon-inner svg { filter: invert(100%) grayscale(100%); }

/* ---------- Banner ---------- */

.banner { position: relative; width: 100%; min-height: 30px; background-color: var(--fs-color-primary); }
.banner-inner, .banner-bg { overflow: hidden; }
.banner-layers { position: relative; z-index: 1; height: 100%; max-height: 100%; }
.banner-layers > * { position: absolute !important; }
.banner-layer { z-index: 1; }
.text-box { max-height: 100%; }
.text-box .text-box-content { position: relative; z-index: 10; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
.text-box.x50 { left: 50%; transform: translateX(-50%); }
.text-box.y50 { top: 50%; transform: translateY(-50%); }
.text-box.x50.y50 { transform: translate(-50%, -50%); }
.text-box.x0 { left: 0; } .text-box.x100 { right: 0; }
.text-box.y0 { top: 0; } .text-box.y100 { bottom: 0; }
.text-inner { }
.res-text { }

/* ---------- Mærkater (tilbud) ---------- */

.badge-container { margin: 30px 0 0; }
.badge { display: table; z-index: 20; width: 2.8em; height: 2.8em; pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
.badge.top { left: 0; }
.badge-inner { display: table-cell; width: 100%; height: 100%; padding: 2px; line-height: .85; font-weight: bolder; text-align: center; vertical-align: middle; white-space: nowrap; color: #fff; background-color: var(--fs-color-primary); transition: background-color .3s, color .3s, border .3s; }
.badge-inner.secondary, .badge-inner.on-sale { background-color: var(--fs-color-secondary); }
.badge-small { width: 2.3em; height: 2.3em; }
.badge-small .badge-inner { padding: 0; }
.badge + .badge { width: 2.5em; height: 2.5em; opacity: .9; }
.badge + .badge + .badge { opacity: .8; }
.badge-circle { margin-left: -.4em; }
.badge-circle + .badge { margin-top: -.4em; margin-left: -.4em; }
.badge-circle .badge-inner, .badge-circle-inside .badge-inner { border-radius: 999px; }
.badge-circle, .badge-outline { margin-left: -.4em; }
.badge-frame .badge-inner, .badge-outline .badge-inner { color: var(--fs-color-primary); background-color: #fff; border: 2px solid currentColor; }

/* ---------- Liste-menu ---------- */

.ux-menu-link { align-items: center; }
.ux-menu-link__link { flex: 1; align-items: baseline; min-height: 2.5em; padding-top: .3em; padding-bottom: .3em; color: currentColor; transition: all .2s; border-bottom-color: #ececec; border-bottom-width: 1px; }
.ux-menu--divider-solid .ux-menu-link:not(:last-of-type) .ux-menu-link__link { border-bottom-style: solid; }
.ux-menu-link__text { flex: 1; }
.ux-menu-link__link i { flex-shrink: 0; width: 25px; vertical-align: baseline; }

/* ---------- Sider med almindeligt indhold ---------- */

.entry-content { padding-top: 1.5em; padding-bottom: 1.5em; }
.entry-header-text { padding: 1.5em 0; }
.entry-header-text.text-center { padding-left: 1.5em; padding-right: 1.5em; }
.entry-header-text-top { padding-top: 0; }
/* Søgeresultater på tværs af sider og vine (search.php). */
.article-inner { transition: opacity .3s, box-shadow .5s, transform .3s; }
.entry-image img { width: 100%; }
.badge.post-date { top: 7%; }
.more-link { margin-top: 1.5em; }
footer.entry-meta { padding: .5em 0 .6em; font-size: .8em; border-top: 1px solid #ececec; border-bottom: 2px solid #ececec; }
.page-title .page-title { }

/* ---------- Producenter ---------- */

.producenter { max-width: 1200px; padding: 15px; margin: auto; }
.producenter-wrap { display: flex; flex-wrap: wrap; width: 100%; margin: -1%; margin-bottom: 20px; }
.producenter-wrap .product { width: 23%; flex-basis: 23%; margin: 1%; aspect-ratio: 1 / 1; background-size: cover; background-position: center; filter: grayscale(1); }
.producenter a { display: block; width: 100%; height: 100%; padding-top: 70%; font-size: 22px; text-align: center; color: #fff; background: #00000075; }
.producenter-headline { margin-top: 10px; margin-bottom: 50px; font-size: 46px; font-weight: lighter; }
.h-wrap { padding: 100px 0 0; }
.antal-0 { display: none; }
@media only screen and (max-width: 800px) {
	.producenter-wrap .product { width: 48%; flex-basis: 48%; }
	.producenter a { padding-top: 30%; line-height: 1.2; }
	.h-wrap { padding: 60px 0 0; }
}
