wp_twentytwentyone-child-spring2life/style.css

/*
Theme Name: Twenty Twenty One Child spring2life.
Theme URI: https://example.com
Description: spring2life child theme for Twenty Twenty One.
Author: Markus Spring
Author URI: https://markus-spring.de
Template: twentytwentyone
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

/* ----------------------------------------------------- proxima-nova --- */
@font-face {
    font-family: 'proxima_novaregular';
    src: url('proximanova-regular-webfont.woff2') format('woff2'),
         url('proximanova-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'proxima_novathin';
    src: url('proxima_nova_thin-webfont.woff2') format('woff2'),
         url('proxima_nova_thin-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'proxima_nova_altlight';
    src: url('proxima_nova_alt_light-webfont.woff2') format('woff2'),
         url('proxima_nova_alt_light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* raleway-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/raleway-v29-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/raleway-v29-latin-300.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* raleway-300italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Raleway';
  font-style: italic;
  font-weight: 300;
  src: url('fonts/raleway-v29-latin-300italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/raleway-v29-latin-300italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* raleway-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/raleway-v29-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/raleway-v29-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* raleway-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Raleway';
  font-style: italic;
  font-weight: 400;
  src: url('fonts/raleway-v29-latin-italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/raleway-v29-latin-italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* raleway-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/raleway-v29-latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/raleway-v29-latin-500.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* raleway-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/raleway-v29-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/raleway-v29-latin-700.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* raleway-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Raleway';
  font-style: italic;
  font-weight: 700;
  src: url('fonts/raleway-v29-latin-700italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/raleway-v29-latin-700italic.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}


/* --------------------------------------------------- terminal dosis --- */
@font-face {
    font-family: 'Terminal Dosis';
    src: url('TerminalDosis-ExtraLight.woff2') format('woff2'),
        url('TerminalDosis-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Terminal Dosis';
    src: url('TerminalDosis-Bold.woff2') format('woff2'),
        url('TerminalDosis-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Terminal Dosis';
    src: url('TerminalDosis-SemiBold.woff2') format('woff2'),
        url('TerminalDosis-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Terminal Dosis';
    src: url('TerminalDosis-Light.woff2') format('woff2'),
        url('TerminalDosis-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Terminal Dosis';
    src: url('TerminalDosis-Regular.woff2') format('woff2'),
        url('TerminalDosis-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Terminal Dosis';
    src: url('TerminalDosis-Medium.woff2') format('woff2'),
        url('TerminalDosis-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Terminal Dosis';
    src: url('TerminalDosis-ExtraBold.woff2') format('woff2'),
        url('TerminalDosis-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

/* --------------------------------------------- end font definitions --- */
:root {
 /* --max--alignwide-width:1400px; */
 /* --font-base:'proxima_novathin','Raleway',sans-serif; */
 --font-base:'TerminalDosis-Regular','proxima_novathin','Raleway',sans-serif;
 /* --font-base:'Raleway',sans-serif; */
 --global--font-size-base:1.125rem;
 /* --global--line-height-body:1.6; */
 /* --font-headings:'proxima_nova_altlight','Raleway',sans-serif; */
 --font-headings:'TerminalDosis-Regular','proxima_nova_altlight','Raleway',sans-serif;
 /* --font-headings:'Raleway',sans-serif; */
 /* --heading--font-weight:500; */
 --heading--font-weight:700;
 /* --heading--font-weight:400; */
 --heading--font-weight-page-title:500;
 --heading--font-weight-strong:500;
 /* --heading--font-weight-page-title:700; */
 /* --heading--font-weight-strong:700; */
 /* --global--font-size-xxl:4rem; */
 --global--font-size-xxl:2.8rem;
 --global--font-size-xxl:3.7rem;
 /* --primary-nav--font-size:1rem; */
 /* --primary-nav--font-weight:400; */
 --primary-nav--font-weight:500;
 /* --primary-nav--font-weight:400; */
 /* --button--border-width:1px; */
 /* --form--border-width:1px */
 --global--font-size-xs: max(calc(var(--global--font-size-base)*1),16px);
}

body {
    /* font-weight: 500; */
    font-weight: 400;
}

/* @media only screen and (max-width: 651px) :root { */
/*     --global--font-size-page-title: min(1.5rem,var(--global--font-size-xxl)); */
/*     --global--font-size-page-title: 0.5rem; */
/* } */

.singular .entry-title, .comment-reply-title {
    /* font-size: calc( var(--global--font-size-page-title) / 3.5 ); */
}


.archive .content-area .format-aside .entry-content, .archive .content-area .format-link .entry-content, .archive .content-area .format-status .entry-content, .blog .content-area .format-aside .entry-content, .blog .content-area .format-link .entry-content, .blog .content-area .format-status .entry-content, .search .content-area .format-aside .entry-content, .search .content-area .format-link .entry-content, .search .content-area .format-status .entry-content {
    font-size: calc( var(--global--font-size-lg) / 1.3 );
}

#masthead.site-header, .menu-button-container  {
    padding-top: calc(var(--global--spacing-vertical)*.2);
    padding-bottom: calc(var(--global--spacing-vertical)*.2);
}

.menu-button-container #primary-mobile-menu {
    margin-top: -18px;
}

#submit.submit {
    color: black;
    background-color: transparent;
    border-color: grey;
}

.site-title a {
    /* font-weight: 500; */
    font-weight: 400;
}

/* .linktable a:link { */
/*     text-decoration: none; */
/* } */

.linktable .item-title:before {
    content:": :";
    /* white-space: pre; */
}

a:link {
        text-decoration-color: #888 !important;
}

a:hover {
    text-decoration: none !important;
    color: red !important;
    /* font-weight: bold; */
    /* text-decoration-color: red !important; */
}
/* a:hover:after { */
/*     content:"-->"; */
/*     color: red; */
/* } */

a:visited {
        text-decoration-color: #bbb !important;
}

/* ----------------------------------------------------------- iPad 2 --- */
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape) {
    /* Landscape css rules */
    #primary {
        margin: 0 2em !important;
    }
    .site-branding {
        margin-left: 2em;
    }
}
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) {
  /* Portrait css rules */
    #primary {
        margin: 0 2em !important;
    }
    .site-branding {
        margin-left: 2em;
    }
}
/* ------------------------------------------------------- end iPad 2 --- */

.sub-menu-toggle {
    display: none !important;
}

.box {
    display: flex;
    width: 268px;
}

@media all and (min-width: 1150px) {
    /* h1.entry-title, h2.entry-title { */
    /*     display: inline-block; */
    /*     float: left; */
    /*     margin-left: calc(50% - var(--responsive--alignwide-width)/2) !important; */
    /* } */
}

#content { margin-top: 2rem;
           padding-top: 0;
         }
.entry-header {
        margin-bottom: 0 !important;
}
h1.entry-title, h2.entry-title, h2.comments-title, h2.comment-reply-title {
    /* font-size: calc(var(--archive-heading-size,var(--heading--font-size-h2))/1.5) !important; */
    font-size: calc(var(--archive-heading-size,var(--heading--font-size-h2))/1) !important; 
    /* margin-top: -3px !important; */
}
h2.comment-reply-title {
    font-size: calc(var(--archive-heading-size,var(--heading--font-size-h2))/2) !important;
}
.h4, h4 {
    font-size: calc(var(--heading--font-size-h4)/1.2);
}

.wp-block-jetpack-tiled-gallery {
    padding-top: 30px;
}

.site-name, .powered-by {
    display: none;
}

.wpcf7-submit {
    background: white !important;
    color: black !important;
}

/* todo: https://www.cssscript.com/pure-css-expanding-link-underlines/ */

.entry-footer {
    margin-top: calc(var(--global--spacing-vertical)*1.4) !important;
}

img[class^="wp-image-"] {
    padding: 4px;
    background: white;
    border: 1px solid #999;
}

/* --------------------------------------------------------- archives --- */
.archive-wider {
    max-width: calc(var(--responsive--aligndefault-width)*1.5);
}

.blocks-gallery-grid {
    /* max-width: auto ; */
    max-width: calc(var(--responsive--aligndefault-width)*1.5) !important;
}

.archive-slide {
    width: 210px;
    height: 210px;
    margin: 7px;
    border: solid 1px #a5a5a5;
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    filter: alpha(opacity=85);
    -moz-opacity: 0.85;
    opacity: 0.85;
    float: left;
    position: relative;
    padding: 40px;
}

.archive-slide-slide {
    border: solid 1px #000000;
}

.archive-slide-titlebar a span {
    display: block;
    height: 40px;
    width: 128px;
    overflow: hidden;
    font-size: calc(var(--global--font-size-xs) * 0.7);
    text-align: center;
    padding-left: -20px;
    padding-right: -20px;
}

/* .pagination:pre { */
/*     content:"<br style='clear: all; clear:both;'>";  */
/* } */

/* .single .site-main > article > .entry-footer { */
.entry-footer {
    display: grid;
    grid-template-columns: 2fr 4fr;
}

.comments-title {
    /* padding-top: 0 !important; */
}

#comment {
    color: black;
    opacity: revert;
    font-family: 'proxima_novaregular' !important;
    font-size: 18px;
    /* background-blend-mode: unset; */
    background-color: transparent;
}

#comment:focus, #comment:hover {
    background-color:white !important;
}

/* remove wp mail smtp nags */
div#setting-error-tgmpa, #update-nag, .update-nag, .updated.caldera_forms, wp-admin-bar-wp-mail-smtp-menu {
    display: none;
}