/*
Theme Name: Kurfahrten Styles
Description: twentytwentyfive-Childtheme for Taxi Simbill
Author:	Andi Heintzel
Author URI:	https://www.pixel-salon.de
Template:	twentytwentyfive
Version:	0.1
Text Domain: kurfahten
*/


/* ! V A R I A B L E S */


 :root {
    --highlight: #f0f;
    --fontbasecolor: #123;
    --giftgrün: #00ff96;
    --main: #9227b6;
    --basicRadius: 25px;
 }


/* ! T Y P O G R A P H Y */



 @font-face {
  font-family: 'Montserrat';
  font-style: normal;
  src: url('fonts/montserrat.woff2') format('woff2');
  font-optical-sizing: auto;
 }

 @font-face {
   font-family: 'Montserrat-italic';
   font-style: italic;
   src: url('fonts/montserrat-italic.woff2') format('woff2');
   font-optical-sizing: auto;
  }
 


 
body, 
 input,
 textarea,
 button {
   font-family: 'Montserrat', sans-serif;
   color: var(--fontbasecolor);
   font-size: 112%;
   letter-spacing: 0;
   font-style: normal;
   font-weight: 400;
   line-height: 130%;
   /* line-height: normal; */
 }
 
h1, h2, h3, h4, h5, h6, p {
   /* text-wrap: wrap !important; */
 }
 
 em {
   font-family: 'Montserrat-italic';
 } 
 
 body {
   hyphens: auto;
   hyphenate-limit-chars: 5 5;
   hyphenate-limit-lines: 1<tag></tag>;
   -webkit-hyphens: auto;
   -webkit-hyphenate-limit-after: 5;
   -webkit-hyphenate-limit-lines: 1;
 }
 
 h1, h2, h3, h4, h5 {
   hyphens: none;
 }
 
 h1 {
   font-weight: 750;
   font-size: 400%;
 }
 
 h2 {
   font-weight: 750;
 }
 
 
 h3 {
   font-weight: 600;
   color: var(--main);
 }
 
 
 /* ! Base Layout  */
 
 h1 {
   text-align: center;
 }
 
 .blocki {
   margin-top: 50px;
   margin-bottom: 50px;
   padding: 50px 25px;
   border-radius: var(--basicRadius)
 }
 
 .kacheln {
    text-align: center;
    align-items: stretch;
    justify-content: space-evenly;
  }
  
 
 .kacheln>div {
   flex-basis: 30%;
   border-radius: var(--basicRadius);
   padding: 25px;
 }
 
 @media (max-width: 800px) {
     .kacheln>div {
       flex-basis: 100%;
     }
 }
 
 
 
 /* ! ANFRAGE FORMULAR */
 
 #anfrage h2 {
   margin-bottom: 50px;
 }
 
 
 .form_section {
   display: none;
 }
 
 .form_section label {
   display: flex;
   flex-direction: column;
 }
 
 .form_section#form_section_1,
 .form_section#form_section_2 .dateTime,
 .form_section#form_section_2 .nameNumber {
   display: flex;
   justify-content: space-between;
   gap: 50px;
   margin-bottom: 25px;
 }


@media (max-width: 700px) {
     .form_section#form_section_1,
     .form_section#form_section_2 .dateTime,
     .form_section#form_section_2 .nameNumber {
        display: block;
      }
 }
 
 .form_section#form_section_1 label,
 .form_section#form_section_1 input,
 .form_section#form_section_2 label,
 .form_section#form_section_2 label input {
   width: 100%;
 }
 
 .form_section#form_section_1>p {
   margin: 0;
 }
 .form_section#form_section_1>p:last-of-type {
    display: none;
  }


#form_section_3 span {
  margin: 0;
}

#form_section_3 label {
  flex-direction: row;
  gap: 25px;
  margin-bottom: 25px;
  align-items: center;
}

#form_section_3 input[type=submit] {
  position: relative;
  margin: auto;
  display: block;
}
 
 input {
   border: 1px solid #ccc;
   border-radius: 5px;
   padding: 5px 5px 5px 30px;
   background-repeat: no-repeat;
  background-position: left center;
  box-sizing: border-box;
 }
 
input#origin {
   background-image: url(images/location.svg);
}
input#destination {
 background-image: url(images/location2.svg);
}
input.wpcf7-date {
 background-image: url(images/date.svg);
}
input.wpcf7-number {
 background-image: url(images/group.svg);
}
label.name input {
 background-image: url(images/person.svg);
}
label.contact input {
 background-image: url(images/mail.svg);
}

#taxifinden {
 margin-bottom: 25px;
}

input[type=checkbox] {
  width: 24px;
  height: 24px;
}
 
 button, 
 input[type=submit],
 .wp-element-button {
   color: white;
   background-color: var(--main);
   font-weight: 750;
   padding: 20px 80px;
   border-radius: 5px;
   font-size: 100%;
   border: none;
   cursor: pointer;
 }
 
  
 .pseudobutton.disabled,
 input[disabled] {
   opacity: 0.2;
 }

 
 
 body.noRoute #wpcf7-f9-p2-o1::before {
 content: "Ihr Fahrtwunsch liegt außerhalb unseres Einsatzgebietes. Bitte wenden Sie sich an einen lokalen Fahrdienst.";
 display: block;
 background: var(--main);
 color: white;
 text-align: center;
 font-weight: 750;
 padding: 5px;
 border-radius: 10px;
 margin-bottom: 10px;
}

.wpcf7-response-output {
 text-align: center;
 
}

.wpcf7-response-output,
.wpcf7-not-valid-tip {
  font-weight: 600;
}

/* ! Colors and Dekorations  */

header {
  background-color: var(--giftgrün);
  color: var(--main);
}

h1 span {
  color: var(--main);
}

body {
  background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 31%,rgba(216, 255, 237, 1) 61%,rgba(255, 255, 255, 1) 100%) fixed;
}
.blocki:not(#warum),
.blocki#warum .kacheln>div {
  background-color: white;
  box-shadow: 0px 0px 10px 0px #f4d6ffFF;
}