/*
 Theme Name: Joseph-Theme
 Theme URI: https://www.hozjan.net/
 Description: Dies ist ein <b>ready-to-start</b> Child-Theme f&uuml;r Blackhawk. Entwickelt und bereitgestellt von Hozjan Artwork. Dieses Theme beinhaltet alle notwendigen Dateien, um den schnellen und einfach Start zu erm&ouml;glichen.
 Author: Hozjan Artwork - Benny Hozjan
 Author URI: https://www.hozjan.net/
 Template: Divi
 Version: 1.0.0
 Tag: Child Theme, Hozjan Artwork 
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/


/* ==========================================================================
   Standard CSS
   ========================================================================== */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  font-size: 62.5%;
}

#page-container {
  overflow: hidden
}

a[href^="#"] {
  cursor: pointer
}

:root {
  /* Global Colors */
  --dark: #0c0c0c;
  --gray: #999999;
  --red: #1865f2;
  --black: #000000;
  --white: #21242C;
}

.mce-panel .mce-stack-layout-item.mce-first {
  position: sticky !important;
  top: -60px;
}

.bh-align-center-section,
.bh-align-center-row .et_pb_column,
.bh-align-center-module {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.et-menu-nav li.lang-item-en::before,
.et-menu-nav li.lang-item-de::before {
  content: "";
  width: 15px;
  height: 15px;
  color: white;
  position: relative;
  display: inline-block;
  top: 28px;
  left: 0;
  margin-right: 5px
}

.et-menu-nav li.lang-item-de::before {
  background: url('../../uploads/2021/07/ch.svg');
}

.et-menu-nav li.lang-item-en::before {
  background: url('../../uploads/2021/07/en.svg');
}

/* ==========================================================================
   Termine CSS
   ========================================================================== */

div.termine {
  display: grid;
  
  gap: 1rem;
  border-bottom: 1px solid rgba(255, 255, 255, .2);
  padding: 8px 0 4px 0;
  font-size: 1.6rem
}
div.activite1 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
  border-bottom: 1px solid rgba(255, 255, 255, .2);
  padding: 8px 0 4px 0;
  font-size: 1.6rem
}
div.termine:last-of-type {
  border-bottom: none;
}


div.date {
  padding: 0;
  color: var(--white);
  opacity: .7;
}

div.anlass {
  font-weight: 600;
  padding: 0;
}

div.ort {
  text-align: justify;
  padding: 0;
  color: var(--white);
  opacity: .7;
}


.et_pb_column .et_pb_module.et_pb_toggle {
  margin-bottom: 10px
}

.et_pb_accordion .et_pb_toggle_close .et_pb_toggle_title::before {
  content: "\33";
  font-size: 24px;
}

.et_pb_accordion .et_pb_toggle_open .et_pb_toggle_title::before {
  display: block;
  content: "\32";
  font-size: 24px;
}

/* ==========================================================================
   Team CSS
   ========================================================================== */
.bh_team .et_pb_blurb {
  transition: all .3s ease
}

.bh_team .et_pb_blurb:hover {
  margin-top: -8px;
  cursor: pointer !important;
  transform: scale(1.05)
}

.bh_team .et_pb_main_blurb_image::before {
  content: "\e010";
  text-align: center;
  line-height: 2.5em;
  font-size: 2rem;
  font-family: "ETModules";
  position: absolute;
  width: 50px;
  height: 50px;
  background: #1865f2;
  z-index: 10;
  bottom: 75px;
  right: 20px;
  border-radius: 40px;
}

.bh_team .et_pb_column_6 .et_pb_main_blurb_image::before {
  display: none
}


/* ==========================================================================
   Logo CSS
   ========================================================================== */
.new-img img {
  -o-transition: .5s;
  -ms-transition: .5s;
  -moz-transition: .5s;
  -webkit-transition: .5s;
  transition: .5s;
  filter: saturate(0)
}

.new-img img:hover {
  -ms-transform: translate(0, -10px);
  -webkit-transform: translate(0, -10px);
  transform: translate(0, -10px);
  cursor: pointer;
  filter: saturate(1.4)
}


/* ==========================================================================
   Sponsoring CSS
   ========================================================================== */
.et_pb_module.et_pb_text h4.spon-title {
  font-weight: 600
}

.et_pb_module.et_pb_text ul.spon-list {
  font-size: 1.7rem;
  line-height: 2rem;
  font-weight: 400;
  color: #ddd;
  list-style: none;
  padding-left: 30px
}

.et_pb_module.et_pb_text ul.spon-list li {
  padding: .8rem 0;
}

.et_pb_module.et_pb_text ul.spon-list li::before {
  content: '\52' !important;
  color: #E6143E;
  font-family: 'ETMODULES' !important;
  margin-left: -25px;
  font-size: 1em !important;
  position: absolute;
}

/* ==========================================================================
   Font CSS
   ========================================================================== */
.et_pb_module.et_pb_text h1 {
  font-size: 7rem;
  line-height: 8rem;
  
 
  color: var(--red);
}

.et_pb_module.et_pb_text h1 span {
  color: var(--red)
}

h1:before,
h1:after {
  width: 50px;
  height: 50px;
}

h1:before {
  content: '';
  position: absolute;
  left: -3rem;
  top: -3rem;
  z-index: -1;
  border-left-width: 2px;
  border-left-style: solid;
  border-top-width: 2px;
  border-top-style: solid;
  border-color: var(--red) !important;
}

.et_pb_module.et_pb_text h2 {
  font-size: 4rem;
  line-height: 6.5rem;

}

.et_pb_module.et_pb_text h3 {
  font-size: 3.6rem;
  line-height: 4.2rem;
  font-weight: 600;
  color: var(--red)
}

.et_pb_module.et_pb_text.zitat h3 {
  border-left: none;
  position: relative;
  font-weight: 600;
  
  width: 100%;
  max-width: 5;
  margin: 30px auto;
  align-self: center;
  font-family: "Give You Glory";
  font-size: 4rem;
  line-height: 6rem;
  text-align: center;
}



.et_pb_module.et_pb_text h4 {
  font-size: 2.7rem;
  line-height: 3rem;
  font-weight: 600;
  color: #21242C !important;
  
  
}

.et_pb_module.et_pb_text p,
.et_pb_blurb_description p {
  font-size: 1.7rem;
  line-height: 2.5rem;
  font-weight: 400;
  color: #21242C;
  text-align: justify;
}
.et_pb_module.et_pb_text p,
.et_pb_blurb_descriptionp1 p {
  font-size: 1.7rem;
  line-height: 2.5rem;
  font-weight: 400;
  color: #21242C;
  
}


/* Tablets in Portrait-Modus zwischen (768-980px) */
@media only screen and (min-width: 768px) and (max-width: 980px) {
  .et_pb_module.et_pb_text h1 {
    font-size: 6rem;
    line-height: 6rem;
  }
}

/* Smartphones in Landscape-Modus zwischen (480-768px) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
  .et_pb_module.et_pb_text h1 {
    font-size: 6rem;
    line-height: 5rem;
  }

  .et_pb_module.et_pb_text h2 {
    font-size: 5rem;
    line-height: 5rem;
    hyphens: auto
  }

}

/* Smartphones im Portrait-Modus zwischen (0-479px) */
@media only screen and (max-width: 479px) {
  .et_pb_module.et_pb_text h1 {
    margin-top: 40px;
    font-size: 5rem;
    line-height: 5rem;
    
  }

  .et_pb_module.et_pb_text h2 {
    font-size: 4.5rem;
    line-height: 4.5rem;
    hyphens: auto;
    margin-top: 3rem;
  }

  .et_pb_module.et_pb_text h4 {
    font-size: 2.5rem;
    line-height: 3rem;
  }

  .et_pb_module.et_pb_text.zitat h3 {
    font-size: 3rem;
    line-height: 4rem;
    hyphens: auto;
   
  }
}


/* ==========================================================================
   Footer CSS
   ========================================================================== */
.bh_footer {
  padding: 0;
  margin: 0;
}

.bh_footer .bh_credits {
  font-size: 11px;
  color: var(--gray);
  padding: 2rem;
}

.bh_footer .bh_credits .swissmade {
  width: 11px;
  height: auto;
  display: inline-block;
  margin-bottom: -3px;
}

/* ==========================================================================
   Form CSS
   ========================================================================== */
.gform_wrapper .gfield_label {
  color: var(--white)
}

.gform_wrapper input[type=text],
.gform_wrapper input[type=password],
.gform_wrapper input[type=tel],
.gform_wrapper input[type=email],
.gform_wrapper input.text,
.gform_wrapper input.title,
.gform_wrapper textarea,
.gform_wrapper select {
  background: rgba(255, 255, 255, .015);
  border-color: rgba(255, 255, 255, .015) !important;
  border-top: 1px solid;
  border-left: 1px solid;
  border-right: 1px solid;
  border-bottom: 1px solid;
  font-size: 1.6rem !important;
  padding: 1.5rem !important;
  color: var(--white);
  transition: all .3s ease-in-out
}

.gform_wrapper input[type=text]:focus,
.gform_wrapper input[type=password]:focus,
.gform_wrapper input[type=tel]:focus,
.gform_wrapper input[type=email]:focus,
.gform_wrapper input.text:focus,
.gform_wrapper input.title:focus,
.gform_wrapper textarea:focus,
.gform_wrapper select:focus {
  border-left: 15px solid;
  border-top: 1px solid;
  border-right: 1px solid;
  border-bottom: 1px solid;
  border-color: var(--red) !important
}

.gform_wrapper .gfield_html p {
  font-size: 1.3rem !important;
  line-height: 1.6rem;
  opacity: .7
}

.gform_wrapper input[type=submit] {
  background: none;
  color: #fff;
  border: 1px solid var(--red);
  padding: 1.6rem 3rem;
  font-size: 1.8rem !important;
  transition: all .3s ease-in-out
}

.gform_wrapper input[type=submit]:hover {
  background: var(--red);
  cursor: pointer;
  color: #fff;
  border: 1px solid var(--red);
}

/* Change Autocomplete styles in Chrome*/
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
  border: 1px solid #eee;
  -webkit-text-fill-color: #eee;
  -webkit-box-shadow: 0 0 0px 1000px #0c0c0c inset;
  transition: background-color 5000s ease-in-out 0s;
}

#gform_confirmation_message_1 {
  color: white
}

/* ERROR CSS*/
body .gform_wrapper div.validation_error,
.gform_validation_errors>h2.hide_summary {
  font-size: 2rem !important;
  color: #fff;
  background: var(--red);
  border: 1px solid var(--red);
  padding: 1rem;
}

.gform_validation_errors>h2:before {
  display: none !important;
}

.gform_legacy_markup_wrapper li.gfield.gfield_error,
.gform_legacy_markup_wrapper li.gfield.gfield_error.gfield_contains_required.gfield_creditcard_warning {
  background-color: var(--dark) !important
}

body .gform_wrapper li.gfield.gfield_error {
  border: 1px solid var(--red);
}

body .gform_wrapper .validation_message {
  color: var(--red);
  padding-left: 1rem
}

.gform_legacy_markup_wrapper .gfield_error .gfield_label {
  color: var(--white);
  background: var(--red);
  padding: 5px
}

.gform_legacy_markup_wrapper .gfield_required {
  color: white;
}

body .gform_wrapper li.gfield_error input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]),
body .gform_wrapper li.gfield_error textarea {
  border-bottom: 1px solid var(--red) !important;
  border-top: none;
  border-left: none;
  border-right: none
}