/* Theme Name: IZT Description: Theme for Website https://izt.de Author: SITEDOCK Author URI: https://sitedock.de Version: 1.1.7 Text Domain: theme */ :root { --base-color-text: #000000; --base-color-accent: #FFCC00; --base-color-light: #efefef; --base-color-background: #fff; --base-font-family: 'Open Sans', Arial, sans-serif; --base-font-weight: normal; --base-line-height: 1.6; /*--base-font-size: clamp(10px, calc(20 * var(--layout-factor)), 24px);*/ --base-font-size: 20rem; --base-font-size-xsmall: 12rem; --base-font-size-small: 16rem; --base-font-size-medium: 18rem; --base-headings-color: #333; --base-headings-font-family: var(--base-font-family); --base-headings-font-weight: bold; --base-headings-line-height: 1.25; --base-headings-font-size-1: 60rem; --base-headings-font-size-2: 48rem; --base-headings-font-size-3: 35rem; --base-headings-font-size-4: 30rem; /*--base-content-width: clamp(1000px, calc(1000 * var(--layout-factor)), 1260px); --base-layout-width: clamp(1260px, calc(1260 * var(--layout-factor)), 1600px);*/ --base-content-width: 960rem; --base-content-width-wide: 1280rem; --base-content-width-full: 1440rem; /* new */ --base-layout-width: 100%; --base-offset: 125rem; --base-offset-vertical: 80rem; --base-space: 30rem; --base-space-half: 15rem; --base-space-double: 60rem; --base-gap: 80rem; --theme-design-layout-width: 1920; /* the base layout screen width of respective design without unit */ --theme-root-font-size: calc(calc(100 / var(--theme-design-layout-width)) * 1vw); /* set font-size to this value and use rem unites based on design pixel-sizes everywhere: example: h2 font-size: 26rem */ --theme-color-text-1: #333; --theme-color-text-2: #666; --theme-color-text-3: #999; --theme-headings-font-size-5: 28rem; --theme-headings-font-size-6: 24rem; } main.has-sidebar .site-content-container { --base-offset: 0; width: 100%; } main.has-sidebar .site-content-container > * { margin-left: 0; margin-right: 0; } html { font-size: var(--theme-root-font-size); } @media (max-width: 499px) { :root { --theme-design-layout-width: 375; --base-content-width: 333rem; --base-content-width-wide: 333rem; --base-offset: 20rem; --base-offset-vertical: 30rem; --base-gap: 25rem; } } @media (max-width: 1024px) { :root { --theme-design-layout-width: 1024; --base-content-width: 900rem; --base-content-width-wide: 900rem; --base-offset: 70rem; --base-gap: 80rem; } } /* @media (max-width: 1200px) { :root { --theme-design-layout-width: 1900; } } @media (max-width: 1600px) { :root { --theme-design-layout-width: 2200; } }*/ @media (min-width: 1919px) { :root { --theme-root-font-size: 1px; --theme-design-layout-width: 1920; --base-content-width: 1000px; --base-content-width-wide: 1260px; --base-layout-width: 1920px; --base-offset: 125px; --base-offset-vertical: 80px; --base-space: 30px; --base-gap: 80px; } } /* @media (min-width: 2200px) { :root { --theme-design-layout-width: 2800; } } */