/*
Theme Name: neoven filia
Description: Child Theme
Author: Dominic Hostettler
Author URI: www.dominic-hostettler.ch
Template: neoven
*/



/* ---------------------------- */
/* Variables */
/* ---------------------------- */


/* FONTS */

/* Paragraph */

@font-face {
    font-family: Light Font;
    src: url(/wp-content/themes/neoven-filia/assets/fonts/ALEGREYASANS-LIGHT.TTF);}

@font-face {
    font-family: Regular Font;
    src: url(/wp-content/themes/neoven-filia/assets/fonts/ALEGREYASANS-REGULAR.TTF);}

@font-face {
    font-family: Medium Font;
    src: url(/wp-content/themes/neoven-filia/assets/fonts/ALEGREYASANS-MEDIUM.TTF);}

@font-face {
    font-family: Bold Font;
    src: url(/wp-content/themes/neoven-filia/assets/fonts/ALEGREYASANS-BOLD.TTF);}

@font-face {
    font-family: Header Font;
    src: url(/wp-content/themes/neoven-filia/assets/fonts/FIRASANS-LIGHT.TTF);}

@font-face {
    font-family: Arial;
    src: url(/wp-content/themes/neoven-filia/assets/fonts/ARIALMT.TTF);}



:root {

--dark-font: #666;
--bright-font: #868686;
--very-bright-font: #a2a2a2;


/* COLORS */

/* C1*/

--c1-150: #6fb72f;
--c1-130: #6fb72f;
--c1-120: #6fb72f;
--c1-110: #7ec53f;
--c1-100: #81c941;
--c1-099: #81c941;
--c1-090: #8dd34f;
--c1-080: #8dd34f;
--c1-070: #8dd34f;

--c1-007: #8dd34f;
--c1-002: #8dd34f;

/* C2*/

--c2-100: #81c941;
--c2-099: #81c941;
--c2-090: #8dd34f;
--c2-080: #8dd34f;
--c2-070: #8dd34f;

--c2-007: #8dd34f;
--c2-002: #8dd34f;

/* C0 */

--c0-100: #000;
--c0-095: #0f0f0f;
--c0-090: #1e1e1e;
--c0-085: #2f2f2f;
--c0-080: #3c3c3c;
--c0-075: #484848;
--c0-070: #606060;
--c0-050: #a6a6a6;
--c0-030: #d8d8d8;
--c0-020: #e2e2e2;
--c0-010: #eee;
--c0-007: #f7f7f7;
--c0-002: #f9f9f9;
--c0-001: #fbfbfb;
--c0-000: #ffffff;
--c0-t002: rgba(0, 0, 0, .02);
--c0-t004: rgba(0, 0, 0, .04);
--c0-t006: rgba(0, 0, 0, .06);
--c0-t008: rgba(0, 0, 0, .08);
--c0-t010: rgba(0, 0, 0, .1);
--c0-t020: rgba(0, 0, 0, .2);


/* OBJECTS */

/* Corners */
--corner-small: 0px;
--corner-medium: 0px;

/* Tags */
--tag-padding-small: .3em .5em .4em .9em;
--tag-padding-medium: .5em 1em .6em 1.3em;
--tag-padding-big: .8em 1em .9em;

--tag-edges: polygon( 10px 0%, 0% 0%, calc(100%) 0%, 100% 0px, 100% calc(100% - 0px), calc(100% - 0px) 100%, 10px 100%, 0 calc(50%) );

/* Shadows */
--shadow-small: rgba(0, 0, 0, 0.1) 0px 0px 10px 0px;
--shadow-medium: rgba(0, 0, 0, 0.15) 0px 0px 20px 0px;

/* Movements */
--transition-slow: .4s ease-in-out;
--transition-normal: .2s ease-in-out;
--transition-fast: .1s ease-in-out;
}



/* BODY */

body {
    font-size: 18px;
}

#page-content, #post-content {
    padding-top: 90px;
}

button, .button, .submit, .wp-block-button__link, input[type="submit"], .wp-block-button__link:active, .wp-block-button__link:focus, .wp-block-button__link:hover, .wp-block-button__link:visited {
    padding: .2em 1.2em .2em;
    color: #fff;
    background-color: var(--c1-100);
    outline: 0px solid var(--c1-120);
    transition: .05s ease-in-out;
}

button:hover, .button:hover, .submit:hover, .wp-block-button__link:hover, input[type="submit"]:hover {
  background-color: var(--c1-120);
  outline: 2px solid var(--c1-120);
}

.button-next a {
    padding: .25em .6em .25em .9em !important;
}

.button-next a::after {
    font-family: 'dashicons';
    content: "\f345";
    line-height: 0;
    position: relative;
    top: 3px;
    right: -1px;
    transition: var(--transition-normal);
}

.button-next a:hover::after {
    right: -5px;
}

.button-prev a {
    padding: .25em .9em .25em .6em !important;
}

.button-prev a::before {
    font-family: 'dashicons';
    content: "\f341";
    line-height: 0;
    position: relative;
    top: 3px;
    left: -1px;
    transition: var(--transition-normal);
}

.button-prev a:hover::before{
    left: -5px;
}

.button-big {
    font-size: 1.2em;
}

h1, h2, h3, h4, h5, h6 {
    margin: 1.3em 0 .5em 0;
}



/* HEADER & BODY */

#header-content, #footer-content, .full-width-template #page-content > *, #post-content, .sidebar-left-template #page-content, .sidebar-right-template #page-content {
  max-width: 980px;
}



/* BLOCK TEMPLATE */

.block-template #page-content {
    margin-left: auto;
    margin-right: auto;
    max-width: 980px;
    width: 95%;
}

/* M */
@media (min-width: 600px) and (max-width: 781px) {

.block-template #page-content {
    width: 90%;
}
}

/* L - XL */
@media (min-width: 782px) {

.block-template #page-content {
    width: 80%;
}
}

.page-thumbnail-background-container {
    overflow: hidden;
    position: fixed;
    width: 100%;
    height: 130%;
    z-index: -10;
}

.page-thumbnail-background {
    filter: blur(12px);
    height: 120%;
    width: 120%;
    margin: -10%;
    background-size: cover;
    opacity: .9;
}


.page-thumbnail-background-container {
    animation: Animation-01 ease-out 1s;
}

@keyframes Animation-01 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}


.page-content-container {
    background: #fff;
    padding: 30px 30px 60px;
    margin-bottom: 60px;
    z-index: 50;
    position: relative;
}

.thumbnail-container {
    height: 80px;
    padding: 3vw 0;
    overflow: hidden;
    position: relative;
}

.thumbnail-container img.page-thumbnail {
    top: -100%;
    bottom: -100%;
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    min-height: 100%;
    width: 100%;
}

.title-container {
    background: #ffffffe9;
    margin: -80px -20px 0 -50px;
    padding: .4em 50px;
    box-sizing: border-box;
    display: inline-block;
}

.title-container, .home-title-container {
    transform-origin: left;
    animation: Animation-02 ease-out .8s;
}

@keyframes Animation-02 {
  0% {
    transform: scaleX(0%);
  }
  20% {
    transform: scaleX(0%);
  }
  100% {
    transform: scaleX(100%);
  }
}

.home-title-container {
    margin-right: 10px !important;
}

.title-container h1, .home-title-container h1 {
    margin: 0;
    animation: Animation-03 ease-out 1s;
}

@keyframes Animation-03 {
  0% {
    opacity: 0;
  }
  80% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}




/* L - XL */
@media (min-width: 782px) {

.page-content-container {
    padding: 30px 60px 60px;
}

.title-container {
    margin: -80px -20px 0 -80px;
    padding: .4em 80px;
}
}





/* Special für Startseite */

article.home .thumbnail-container {
    height: 180px;
}

article.home .home-title-container {
    position: absolute;
    background: #ffffffe9;
    margin: -210px 0 30px -80px;
    padding: 1em 80px;
    box-sizing: border-box;
    max-width: 630px;
}

article.home .page-content-container {
    margin-bottom: 10px;
}

article.home #page-content {
    margin-bottom: 50px;
}

/* XL */
@media (min-width: 1100px) {

article.home h1 {
    font-size: 50px;
}
}

/* 0 - S */
@media (max-width: 599px) {

article.home h1 {
    font-size: 36px;
}
}



/* Logged In status */

#wpadminbar {
    position: fixed;
}


/* Icon Link */

a kbd {
    font-family: inherit;
}

a kbd::before {
    font-family: 'dashicons';
    content: "\f345";
    line-height: 0;
    position: relative;
    transition: var(--transition-normal);
    top: .18em;
    margin-left: -.2em;
}


/* Light Font */

sup {
    font-family: Light Font;
}



/* BLOCK CLASSES */

.dark-grey {
  background-color: var(--c0-t008);
}




/* HEADER */

#header-bar {
    background: transparent;
    box-shadow: none;
    height: 100px;
}

/* SECOND MENU */

#second-menu li a {
    color: #fff;
    font-family: Header Font;
    opacity: 1;
    padding: 10px 11px 10px;
}

#second-menu li a:hover {
    background-color: var(--c0-t020);
}

#second-menu .e-mail a:before {
    position: relative;
    font-family: 'dashicons';
    content: "\f466";
    font-size: 20px;
    line-height: 0;
    top: 5px;
    margin-right: 3px;
}



/* PRIMARY MENU */

#primary-menu .menu-points {
    text-align: left;
}

#primary-menu > ul > li > a {
  text-align: left;
  font-size: 16px;
  font-family: Header Font, sans-serif;
  text-transform: uppercase;
  letter-spacing: 1;
}

#primary-menu a, #primary-menu *:after {
  color: var(--dark-font);
}



/* Horizontal Menu */

/* XL */
@media (min-width: 1100px) {

#primary-menu-bar {
    bottom: 10px;
    position: absolute;
}

#primary-menu > ul > li > a, #primary-menu > ul > li > ul > li a {
  padding-top: 0.6em;
  padding-right: 1.2em;
  padding-bottom: 0.5em;
  padding-left: 1.2em;
  font-size: 17px;
}

#primary-menu li {
    background-color: #ffffff88;
    margin-right: 4px;
}

#primary-menu li:focus a, #primary-menu li:hover > a, #primary-menu li.current-menu-item > a, #primary-menu li.current_page_parent > a, #primary-menu li.current-menu-item.menu-item-has-children::after, #primary-menu li.current_page_parent.menu-item-has-children::after {
    color: var(--dark-font) !important;
    background-color: #ffffff90;
}

.menu-item-has-children > a {
    pointer-events: none;
}
}

/* Mobile Menu */

/* 0 - L */
@media (max-width: 1099px) {

#primary-menu li a {
  line-height: 30px;
}
}

/* Fancy Burger Animation */

/* 0 - L */
@media (max-width: 1099px) {

#primary-menu a.burger .line {
    transition: 0.2s;
    transform-origin: center;
    transform: rotate(0deg);
    background-color: #fff;
}

#primary-menu a.burger.toggled-on .line:nth-child(1){
    transform: rotate(135deg);
    top: 100%;
}

#primary-menu a.burger.toggled-on .line:nth-child(2){
    transform: rotate(45deg);
}

#primary-menu a.burger.toggled-on .line:nth-child(3){
    transform: rotate(135deg);
    top: -100%;
    opacity: 0;
}
}



/* FOOTER */

footer {
    background-color: var(--c0-t008);
    font-family: Header Font;
}

footer #footer-menu li a {
    color: #fff;
}

.footer-bar {
    padding: 2em 0 0;
}

.footer-bar p {
    color: #fff;
}

.footer-bar a {
  color: #fff;
  text-decoration: underline;
  text-underline-position: under;
}

#footer-menu-bar {
    background-color: transparent;
}

.designer-page-link {
    opacity: .5;
    float: right;
}

/* XL */
@media (min-width: 1100px) {

.footer-area {
    float: none;
    width: 100%;
}
}

/* 0 - S */
@media (max-width: 599px) {

.designer-page-link {
    float: none;
    margin-top: -15px;
}
}



/* BLOCK EDITOR ELEMENETS */

.wp-block-image.image-medium img {
    max-width: 300px;
    width: 100%;
}

.wp-block-image figcaption {
    background-color: #ffffffe1;
    margin-top: -45px;
    display: table-cell;
    padding: 0 .5em;
    position: absolute;
    line-height: 35px;
}

.wp-block-separator {
    border-top: 1px solid var(--c0-030);
    border-right: none;
    border-left: none;
    border-bottom: none;
    margin: 30px 0;
}

/* CUSTOM ELEMENTS */

.full-width.box {
    padding: 30px 0 40px;
}

.big-padding {
    padding: 6vw 0;
}

.check-list li::before {
    content: "\f147";
    font-family: 'dashicons';
    color: var(--c1-100);
    font-size: 1.6em;
    position: absolute;
    margin: -4px 0 0 -25px;
}

.check-list li::marker {
    content: "";
}


/* Full Button */

.full-button .wp-block-button__link, .full-button .wp-block-button {
    width: 100vw;
    height: 150px;
    display: table-cell;
    vertical-align: middle;
    font-size: 22px;
    font-family: Medium Font;
    background-size: cover;
    background-position: center;
}

.full-button .wp-block-buttons {
    display: block;
    margin-bottom: 10px;
}

/* L - XL */
@media (min-width: 782px) {

.full-button .wp-block-column:not(:first-child) {
    margin-left: 10px;
}
}



/* PLUGINS */

/* GETWID */

.getwid-columns > * {
    box-sizing: border-box;
}

.getwid-columns > * {
    padding-left: 5px !important;
    padding-right: 5px !important;
}

.wp-block-getwid-custom-post-type {
display: grid;
}



/* Toggle */

.wp-block-getwid-toggle .wp-block-getwid-toggle__header-wrapper, .wp-block-getwid-toggle__row:first-child .wp-block-getwid-toggle__header-wrapper {
  border: none;
}

.wp-block-getwid-toggle__content {
    padding: 1em 0 1.5em 0;
    border: none;
}

.wp-block-getwid-toggle__icon i.fa-plus::before {
    content: "";
    height: 6px;
    width: 6px;
    transform: rotate(45deg);
    transform-origin: 60% 60% 0px;
    transition: var(--transition-normal);
    display: inline-block;
    border-bottom: 2px solid var(--c2-100);
    border-right: 2px solid var(--c2-100);
}

.wp-block-getwid-toggle__header:hover .wp-block-getwid-toggle__icon i.fa-plus::before {
  border-bottom: 2px solid var(--c2-070);
  border-right: 2px solid var(--c2-070);
}

.wp-block-getwid-toggle__header {
    box-sizing: border-box
}

.wp-block-getwid-toggle__row.is-active .wp-block-getwid-toggle__header, .wp-block-getwid-toggle__header:hover {
  background-color: var(--c0-010);
}

.is-active .wp-block-getwid-toggle__icon i.fa-plus::before {
    transform: rotate(225deg);
}

.wp-block-getwid-toggle__row.is-active .wp-block-getwid-toggle__icon.is-active {
    display: inline-block;
}

.wp-block-getwid-toggle__row.is-active .wp-block-getwid-toggle__icon.is-passive {
    display: none;
}

.wp-block-getwid-toggle {
    padding-bottom: 15px;
}



/* COOKIE BAR */

#cookie-notice {
    min-width: auto;
    right: 0;
    left: unset;
    background-color: var(--c1-130) !important;
    font-family: Light Font, sans-serif;
}

.cookie-notice-container {
    padding: 10px 30px;
}

.cn-text-container {
    margin: 0;
}


#cookie-notice .cn-button:not(.cn-button-custom) {
  background-color: var(--c0-t008) !important;
  cursor: pointer;
  border: none;
  display: inline-block;
  line-height: 1;
  font-family: inherit;
  font-size: inherit;
  border-radius: var(--corner-small);
  padding: .25em .9em;
  transition: var(--transition-fast);
  color: #fff;
  box-shadow: none;
}

#cookie-notice .cn-button:not(.cn-button-custom):hover {
  background-color: var(--c0-t010);
}

#cn-notice-buttons {
  margin-right: 10px;
}

.cn-close-icon::before, .cn-close-icon::after {
  background-color: #fff;
}
