/*
 Theme Name:   Divi Child 1.1
 Description:  Mit diesem Divi Basis-Child-Theme kannst du Änderungen an deiner Divi-Website vornehmen, die über die Einstellmöglichkeiten von Divi hinausgehen! 
 Author:       Tobias Both
 Author URI:   https://divitorials.com
 Template:     Divi
 Version:      1.1
*/

/****************************************************************
************************ 1. BASE RULES **************************
****************************************************************/

/*
** Colors
*/

:root {
    /* Allgemeine Theme Farben */
    --main-color:black;
    --secondary-color:black;
    --accent-color:black;    
    --light-color:#fff;
    --dark-color:#000;
    
    /* Kontaktformular Farben */
    --cf-success-bg: #d1e7dd;
    --cf-success-color: #0f5132;
    --cf-error-bg: #f8d7da;
    --cf-error-color: red;
    --cf-invalid-bg: #fff3cd;
    --cf-invalid-color: #664d03;
}


/*
** Fonts
*/

@font-face {
    font-family: 'poppinsbold';
    src: url('/wp-content/themes/divi-child/fonts/poppins/poppins-bold.woff2') format('woff2'),
         url('/wp-content/themes/divi-child/fonts/poppins/poppins-bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'poppinslight';
    src: url('/wp-content/themes/divi-child/fonts/poppins/poppins-light.woff2') format('woff2'),
         url('/wp-content/themes/divi-child/fonts/poppins/poppins-light.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'poppinsmedium';
    src: url('/wp-content/themes/divi-child/fonts/poppins/poppins-medium.woff2') format('woff2'),
         url('/wp-content/themes/divi-child/fonts/poppins/poppins-medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'poppinsregular';
    src: url('/wp-content/themes/divi-child/fonts/poppins/poppins-regular.woff2') format('woff2'),
         url('/wp-content/themes/divi-child/fonts/poppins/poppins-regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'cousinebold';
    src: url('/wp-content/themes/divi-child/fonts/cousine/cousine-bold.woff2') format('woff2'),
         url('/wp-content/themes/divi-child/fonts/cousine/cousine-bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'cousineregular';
    src: url('/wp-content/themes/divi-child/fonts/cousine/cousine-regular.woff2') format('woff2'),
         url('/wp-content/themes/divi-child/fonts/cousine/cousine-regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body {
    font-family: 'poppinsregular';
    font-smooth: antialiased;
}

h1,h2,h3,h4,h5,h6 {
    font-family: 'poppinsregular';
}

a {
    font-family: 'cousineregular';
}

strong {
    font-family: 'poppinsmedium';
    font-weight: normal;
}


/****************************************************************
*********************** 2. LAYOUT RULES *************************
****************************************************************/


/*
** Header & Navigation
*/

#top-menu li a {
    font-size: clamp(0.875rem, 0.4179rem + 0.7455vw, 1.3125rem) !important;
}
#top-menu li a:after {
    display: block;
    content: "";
    position: absolute;
    left: 50%;
    margin-left: auto;
    margin-right: auto;
    transform: translateX(-50%);
    bottom: 50%;
    width: 0%;
    height: 2px;
    background: #fff;
    transition: width 200ms, background-color 200ms, opacity 0ms 200ms;
}
#top-menu li a:hover:after {
    width:40px;
}
#top-menu li a:hover {
    opacity: 1 !important;
}

/* Schriftstärke der Top-Menü Links ändern */  
#et-top-navigation, #top-header .container {
   font-weight:normal;
}

/*  Single Events-Page Header*/
.tribe-events-page-template #main-header {
    background: #07153f !important;
}
.tribe-events-page-template #et-main-area {
    padding-top:12.5vh !important;
}

/* Mobiles Menü */
.mobile_menu_bar:before {
    color:#fff !important;
}
#main-header .et_mobile_menu {
    background: #07153F !important;
}
.opened .mobile_menu_bar:before {
    content: "M";
}

/*
** Body
*/

/* Divi Website breiter machen auf Tablets und Smartphones */
.et_pb_row, .container {
    width: 90%; /* Hier Prozentwert ändern */
}


/*
** Footer
*/

#footer-bottom {
    border-top:1px solid #fff;
    padding:1.2rem 0 0;
}
#footer-info, .legal-footer-menu {
    padding-bottom:1.2rem;
}
#footer-info a {
    display: inline-block;
}
#footer-widgets {
    padding:9% 0 3% 0;
}
@media (max-width:425px) {
    #footer-widgets {
        padding:50px 0;
    }
}

/*
** Footer Links Styling
*/

#main-footer .fwidget:not(.widget_media_image) a, #footer-bottom a {
    position: relative;
}
#main-footer .fwidget:not(.widget_media_image) a:hover {
    opacity: 1 !important;
}
#main-footer .fwidget:not(.widget_media_imagee) a:before, #footer-bottom a:before {
    content:"";
    position: absolute;
    bottom:0;
    margin-bottom:-3px;
    left:0;
    width:0;
    height:1px;
    background: #fff;
    transition: all 200ms ease;
}
#main-footer .fwidget:not(.widget_media_image) a:hover:before, #footer-bottom a:hover:before {
    width: 100%;
}

/* Fix margins
.footer-widget .fwidget {
    margin-bottom:0 !important;
} */

/* Footer-Widget Link Icon entfernen */
#footer-widgets .footer-widget li:before {
   display: none;
}
#footer-widgets .footer-widget li {
    padding-left:0;
}

/* Footer-Widget volle Breite */
.footer-widget .fwidget {
    width:100%;
    margin-bottom:1.5em !important;
}
.footer-widget .fwidget:first-child {
    margin-bottom: 0 !important;
}

/* Footer-Widget title styling */
.footer-widget .fwidget .wp-block-heading, .footer-widget .fwidget .title {
    border-bottom:1px solid #fff;
    margin-bottom:1.5em !important;
    letter-spacing: .125em;
    font-size:16px !important;
}
.tribe-events-widget-events-list__header h2 {
    color:#fff !important;
    text-transform: uppercase;
    padding-bottom:10px !important;
    line-height:1.3em !important;
    letter-spacing: .125em;
}
.tribe-events-widget-events-list__header {
    margin-bottom:1.5em;
    border-bottom:1px solid #fff !important;
}

/* Events Widget Styling */
.tribe-common .tribe-common-b2 {
    color:#fff !important;
}
.tribe-common .tribe-common-h7, .tribe-common .tribe-common-h8 {
    font-weight:normal !important;
}
.tribe-events-widget .tribe-events-widget-events-list__event-date-tag-month,
.tribe-events-widget .tribe-events-widget-events-list__event-date-tag-daynum {
    color:#fff !important;
}
.tribe-events-widget .tribe-events-widget-events-list__view-more {
    display: none;
}

/* Footer Logo Styling */
@media(min-width:981px) {
    #footer-widgets .wp-block-image:not(.social-icon) {
        text-align: right;
    }
}

/* Footer Email Styling */
a.footer-email {
    position: relative;
    font-size:1.2em;
}
a.footer-email:after {
    content:url('/wp-content/files/2023/06/icon-up-right_small-white.svg');
    position: absolute;
    top:0;
    right: 0;
    margin-right:-2em;
    transition: all 200ms;
}
a.footer-email:hover:after {
    transform: rotate(45deg);
}

/* Breakpoint */
@media (min-width:980px) {
    #footer-info, #footer-bottom .legal-footer-menu {
        display: inline-block !important;
        width: auto !important;
        max-width:50%;
    }    
    #footer-bottom .legal-footer-menu {
        float:right !important;
    }
}
@media (max-width: 980px) {
    #footer-bottom .legal-footer-menu {
        float: none;
        text-align: center;
    }
}
/* Rechtliches Menü */
.legal-footer-menu li a {
    color:#fff; /* Hier Farbe des Footer Menüs ändern */
}
#footer-bottom .legal-footer-menu li {
    display: inline-block;
    position: relative;
    padding: 0 .5rem;
    line-height: 1rem;
}
#footer-bottom .legal-footer-menu li:first-child {
    padding-left:0;
    margin-left:0;
}
#footer-bottom .legal-footer-menu li:last-child {
    padding-right: 0;
    margin-left:-4px;
}
#footer-bottom .legal-footer-menu li:after {
    content: "";
    width: 1px; height:1rem;
    background: #fff;
    position: absolute;
    right: -1px; top: 0;
}
#footer-bottom .legal-footer-menu li:last-child:after {
    display: none;
}


/****************************************************************
*********************** 3. MODULES RULES ************************
****************************************************************/

/*
** Back-to-top-button
*/

.et_pb_scroll_top.et-pb-icon {
    border-radius:50%;
    right:1rem;
    background:#243DFF;
    padding:.4em;
    opacity: 1;
}

/*
** Tribe Events Button
*/

.tribe-common .tribe-common-c-btn-border, .tribe-common a.tribe-common-c-btn-border {
    border-radius: 25px;
}

/*
Single Event Page
*/

.tribe-events-back {
    display: none;
}

/*
** Divi Pixel Caroussel
*/

.dipi-entry-title a {
    font-family: 'poppinsmedium' !important;
}

/*
** Tabs
*/

.et_pb_tabs .et_pb_tabs_controls li a {
    padding:0 .7em;
}

/*
** Column with Custom Padding
*/
@media(min-width:1841px){
    .column_has-inner-padding {
        padding:15vh 5% 15vh calc(calc(100% - 1640px) * 0.5);
    }
}
@media(max-width:1840px){
    .column_has-inner-padding {
        padding:15vh 5% !important;
    }
}

/*
** Job Manager
*/

ul.job_listings li.job_listing a img.company_logo,
ul.job_listings li.job_listing a ul.meta {
   display: none !important;
}

ul.job_listings li.job_listing a div.position {
    padding:0;
    position: relative;
}
ul.job_listings, ul.job_listings li.job_listing a {
    padding-left:0;
}
ul.job_listings li.job_listing a {
    border-top:2px solid #292929;
    padding:2em 0;
    display: flex;
    align-items: center;
}
ul.job_listings li.job_listing a:hover {
    background:none;
}
ul.job_listings li.job_listing a div.position h3 {
    font-family: 'cousineregular';
    font-size: clamp(1.5em, 2.5vw, 3em);
    line-height: 1em;
}
ul.job_listings li.job_listing a div.position h3:after {
    content:"";
    background-image:url('/wp-content/files/2023/05/big-arrow-up.svg');
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    width:30px !important;
    height: 30px !important;
    right: 0;
    top:50%;
    margin-top:-15px;
    margin-right: -1em;
    transition: all 200ms;
}
ul.job_listings li.job_listing a:hover div.position h3 {
    color: #243DFF;
}
ul.job_listings li.job_listing a:hover div.position h3:after {
    transform: rotate(45deg);
}
ul.job_listings li.job_listing a div.position {
    width:60%;
}
ul.job_listings li.job_listing a div.location {
    width:40%;
    text-align:right;
    color:#292929;
    font-family: 'cousinebold';
    position: relative;
}
ul.job_listings li.job_listing a div.location:before {
    content:url('/wp-content/files/2023/05/location-marker.svg');
    position: relative;
    left:0;
    top:3px;
}
ul.et_pb_tabs_controls:after {
    border: 0;
}

/*
** Kontaktformular
*/

/* Contact Form Layout */
.form-row {
    width: 100%; 
    padding:10px 0;
}
.column-half, .column-quarter {
    float: left;
	position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.column-half {
    width:100%;
}
.column-quarter {
    width:50%;
}
.form-col-left {
    padding:0 10px 0 0;
}
.form-col-right {
    padding:0 0 0 10px;
}
.clearfix:after {
    content: "";
    display: table;
    clear: both;
}

/* Input Field Headline */
.form-row p {
    margin-bottom:.2em;
    padding-bottom:0;
    color:inherit;
    font-weight:normal;
}

/* Input Field Styling */
.wpcf7 input[type="text"], 
.wpcf7 input[type="email"], 
.wpcf7 textarea, .wpcf7 input[type="tel"], 
.wpcf7 select, .wpcf7 input[type="url"] {
	width: 100%;
    font-size:1em;
	padding: 14px;
	background:#f0f0f0;
    border:0;
	-webkit-box-sizing: border-box;
	 -moz-box-sizing: border-box;
	      box-sizing: border-box;
}
.wpcf7 input:focus, .wpcf7 textarea:focus{
    -webkit-box-shadow:inset 0px 0px 0px 3px var(--accent-color);
    -moz-box-shadow:inset 0px 0px 0px 3px var(--accent-color);
    box-shadow:inset 0px 0px 0px 3px var(--accent-color);
}
.wpcf7 textarea {
    height:256px;
}

/* Acceptance Field */
label .wpcf7-list-item-label {
    font-size: 1em; 
    color:inherit !important;
}
span.wpcf7-list-item {
    margin-left:0 !important;
    line-height: 1.5em;
    font-weight:normal;
}

/* Submit Button */
.wpcf7-submit{
	display:block !important;
    font-size:1em;
	background: var(--main-color);
	color: var(--light-color);
	border: none;
	padding:1em 2em;
    margin-top:1em;
	cursor: pointer;
}
.wpcf7-submit:hover{
	background: black;
    -webkit-transition: background 200ms ease-in-out; /* Firefox */
    -moz-transition: background 200ms ease-in-out; /* WebKit */
    -o-transition: background 200ms ease-in-out; /* Opera */
    transition: background 200ms ease-in-out; /* Standard */
}

/* Infobox Styling */
span.wpcf7-not-valid-tip{
	text-shadow: none;
	font-size: .9em;
	color: var(--cf-error-color);
	background: transparent;
	padding: .2em 0 0;
}

/* Form invalid */
.wpcf7 form.invalid .wpcf7-response-output { 
    background: var(--cf-invalid-bg);
    color: var(--cf-invalid-color);
}
/* Form sent success */
.wpcf7 form.sent .wpcf7-response-output {
	background: var(--cf-success-bg);
	border-color: var(--cf-success-bg);
	color: var(--cf-success-color);
}
/* Info Box Styling */
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.sent .wpcf7-response-output {
    text-shadow: none;
	border: transparent;
    padding: 20px;
	text-align: center;
	margin: 50px 0 0 !important;
	font-size: 1em;
}

/* Kontaktformular Responsive Styles */
@media (max-width:1500px) { 
    .form-column-half {
        width:100% !important;
    }
}
@media (max-width:660px) {
    .et_pb_text .form-row column-quarter.form-col-right.senden-button {
        width:100% !important;
    }
}
@media (max-width:425px) {
    .wpcf7 input[type="text"], 
    .wpcf7 input[type="email"], 
    .wpcf7 textarea, .wpcf7 input[type="tel"], 
    .wpcf7 select {
        font-size:1em;
    }
}


/****************************************************************
************************** 4. EFFECTS ***************************
****************************************************************/