/*
Theme Name:  astra-child
Theme URL:   https://oekomatik.ch
Description: Astra Child Theme
Author:      WR
Author URL:  https://oekomatik.ch
Template:    astra
Version:     1.0.0
*/


/*
colors:
logo-grün: #54ae32 
logo-grau: #5e5e5e
logo-blau: #3374b6
hellblau:  #6ec1e4
*/

/* fonts: 
Poppins
Sans-Serif
*/

/* changes: 
Logo
.elementor-element-20b024b  ==> .elementor-element-dec012e 
.wp-image-2303              ==> .wp-image-2303


*/


/* temporäres Abschalten der Kategorien im News-Blog - Hauptseitenleiste */
#categories-2 {
    display: none;
}

/* temporäres Abschalten der Archive im News-Blog - Hauptseitenleiste */
#archives-2 {
    display: none;
}

/* topline  ---------------------------------------------------   */

/* temporäres Abschalten der Suche */
.elementor-search-form {
    display: none;
} 


body .elementor-button.elementor-size-sm {
  font-size: 1rem;
}

div.elementor-menu-toggle {
  color: #3374b6;
}

[class*=" eicon-"] {
    color: #3374b6 !important;
    font-size: 1.6em;
}

/* Höhe des Logos links */
.elementor-415 .elementor-element.elementor-element-dec012e img {
    height:  8vw;
    width:  16vw; 
}

/* Höhe des Cyclos-Logs */
#cyclos-logo {
    height:  8vw;
    width:  16vw; 
}

/* Rand links und rechts im Header */
.elementor-element-f1f0840 {
    padding-left: 2%;
    padding-right: 2%; 
}
 
/* Text Kontaktformular */
.elementor-element-b3c08ad .entry-content h1 {
    font-size: 4.2rem ; 
}
 
#cyclos-id {
    margin-top: 40px; 
    max-width: none !important;
}

#suche-id {
    margin-top: 48px;
}

#elementor-search-form-878bb6d {
    padding-right: 0px;
}

#elementor-element-cdd9bcc {
    margin-right: 0px;
    align-items: right !important;
}

#small-header {
    padding-left: 4%;
}

.elementor-415 .elementor-element.elementor-element-ed22a22 {
   margin-left: 80px;
}

.wp-image-2303 {
   max-width: none !important;
} 
  
/* Auftrag vom 11.10.2023 */

/* (a) Bilder so gross, dass die Schrift auf einer Zeile Platz hat ... 
Sollte nicht gemacht werden, sondern Schrift wenig kleiner, sonst passen die Bilder nicht mher ins Layout */
 
.entry-content h3 {
   font-size: 1.5rem;
}

/* (b) Tauschen - Position ändern */
.elementor-element-3c1950b {
    padding-top: 14%;
    padding-left: 13%;
}

/* (c) Kontaktformular */
.elementor-element-b3c08ad {
    margin-top:  -10%;
    padding-left: 33%;
}
 

/* responsive reactions */
@media (max-width: 1600px) {
    /* (b) Tauschen - Position ändern */
    .elementor-element-3c1950b {
      padding-top: 8%;
      padding-left: 20%;
  }          
  
  /* (c) Kontaktformular */
    .elementor-element-b3c08ad {
        margin-top:  -8%;
        padding-left: 36%;  
    }
}

@media (max-width: 1200px) {
  /* (a) Bilder so gross, dass die Schrift auf einer Zeile Platz hat ... */         
   .entry-content h3 {
        font-size: 1.1rem;
   }
   
   /* (c) Kontaktformular */
    .elementor-element-b3c08ad {
        margin-top:  -8%;
        padding-left: 40%;  
   }
}

@media (max-width: 1024px) {
    #cyclos-container, #suche-container {
        display:none;
    }
    
    /* Höhe des Logos links */
    .elementor-415 .elementor-element.elementor-element-dec012e img {
      height: 11vw;
      width:  24vw; 
    }
     
    .elementor-element-dec012e {
        min-width: 54% !important;
    }
    
    .elementor-element-ba8ec68 {
        max-width: 50% !important;        
    }
    
    .e-con.e-flex {
        flex-basis: 100%  !important;
    }
    
    .elementor .elementor-hidden-tablet {
    display: inherit;
   }
   
   .elementor-415 .elementor-element.elementor-element-ebbd6ad img {
      height: auto;
   }

   .elementor-element-34d3d63 {
        width: 280px !important;
   }
   
   /* Grösse Suchfeld */
    .elementor-415 .elementor-element.elementor-element-415f91a {
        --container-widget-width: 61%;
   }
   
   /* Höhe und Breite Text 'Zürcher Tauschnetz ... ' */ 
   .elementor-6 .elementor-element.elementor-element-8fba2c4 .elementor-heading-title {
        font-size: 6vw;
        max-width: 56%;
   }
  
  /* (a) Bilder so gross, dass die Schrift auf einer Zeile Platz hat ... */         
   .entry-content h3 {
        font-size: 1.2rem;
   }

  /* (b) Tauschen - Schriftverkleinern + Position ändern */
  .entry-content h1 {
      font-size: 3.3rem;
  }
  
  .elementor-element-3c1950b {
      padding-top: 9%;
      padding-left: 20%;
  }

   /* (c) Kontaktformular */
    .elementor-element-b3c08ad {
        margin-top:  -19%;
        padding-left: 39%;
    }    

    .elementor-element-b3c08ad h1 {    
        font-size: 2.7rem !important;  
   }
}


@media (max-width: 767px) {
   /* Höhe des Logos links */
    .elementor-415 .elementor-element.elementor-element-dec012e img {
      height: 14vw;
      width:  30vw;
  }       

  .elementor .elementor-hidden-mobile, .elementor .elementor-hidden-phone {
       display: inherit;
       flex-direction: column;
  }
  .e-con.e-flex {
       flex-basis: inherit  !important;
  }
  .elementor-widget-container {
       margin-left: 0px !important ;
  } 
  
   .elementor-element-ba8ec68 {
       margin-left: 15%;         
   }
   
   .elementor-element-d54db42 {
       width: auto !important;
   }

   .elementor-415 .elementor-element.elementor-element-415f91a {
        --container-widget-width: 130%;
   }

   /* Höhe und Breite Text 'Zürcher Tauschnetz ... ' */ 
   .elementor-6 .elementor-element.elementor-element-8fba2c4 .elementor-heading-title {
        font-size: 4vw;
        max-width: 50%;
        margin-left: 2%;
   }
   
   /* Höhe des Hamburger-Menüs */    
   [class*=" eicon-"] {
   font-size: 1em;
    }
   
   /* Position Hamburger-Menü */ 
   .elementor-415 .elementor-element.elementor-element-301c447 {
    --width: 60%;
   } 
   
   /* Position Suchfeld */
   .elementor.elementor .e-con > .elementor-widget {
         max-width: 130%;
    }

    /* Position Hamburger-Menü durch Element Links - Logo */ 
    .elementor-415 .elementor-element.elementor-element-274347b {
    --width: 36%;
    }
    
   /* (a) Bilder so gross, dass die Schrift auf einer Zeile Platz hat ... */       
   .entry-content h3 {
        font-size: 1.8rem;
   }

  /* (b) Tauschen - Schriftverkleinern + Position ändern */
  .entry-content h1 {
      font-size: 2.8rem;
  }
  
  .elementor-element-3c1950b {
      padding-top: 0%;
      padding-left: 21%;
      margin-top: -8%;
  }

   /* (c) Kontaktformular */
    .elementor-element-b3c08ad {
        margin-top:  -27%;
        padding-left: 39%;
   }    

    .elementor-element-b3c08ad h1 {    
        font-size: 1.8rem !important;  
   }
}

@media (max-width: 640px) {
    /* (b) Tauschen - Schriftverkleinern + Position ändern */
    .entry-content h1 {
        font-size: 2rem;
   }
  
  .elementor-element-3c1950b {
      padding-top: 0%;
      padding-left: 23%;
      margin-top: -15%;
  }
  
     /* (c) Kontaktformular */
    .elementor-element-b3c08ad {
        margin-top:  -36%;
        padding-left: 40%;
   }    

    .elementor-element-b3c08ad h1 {    
        font-size: 1.7rem !important;  
   }
}

@media (max-width: 460px) {
   /* Höhe des Logos links */
    .elementor-415 .elementor-element.elementor-element-dec012e img {
      height: 20vw;
      width:  40vw;
   }       

   /* Position Hamburger */ 
   .elementor-415 .elementor-element.elementor-element-301c447 {
    --width: 50%;
   }  
 
   /* Breite ausgeklapttes Menü */  
   .elementor.elementor .e-con > .elementor-widget {
        max-width: 146%;
   }
   
   /* Position Hamburger-Menü durch Element Links - Logo */ 
    .elementor-415 .elementor-element.elementor-element-274347b {
    --width: 28%;
   }
   
   .elementor-nav-menu a, .elementor-nav-menu a:focus, .elementor-nav-menu a:hover {        
    line-height: 1em;
   }

  /* (b) Tauschen - Schriftverkleinern + Position ändern */
  .entry-content h1 {
      font-size: 2.5rem;
   }
   
   .elementor-element-3c1950b {
      padding-top: 0%;
      padding-left: 23%;
      margin-top: -18%;
  }
  
  /* (c) Kontaktformular */
    .elementor-element-b3c08ad {
        margin-top:  -44%;
        padding-left: 49%;
   }    

    .elementor-element-b3c08ad h1 {
        font-size: 1.1rem !important;  
   }  
}

@media (max-width: 400px) {
  /* (b) Tauschen - Schriftverkleinern + Position ändern */
  .entry-content h1 {
      font-size: 2rem;
   }
   
     /* (c) Kontaktformular */
    .elementor-element-b3c08ad {
        margin-top:  -48%;
        padding-left: 57%;
   }    

    .elementor-element-b3c08ad h1 {
        font-size: 0.8rem !important;  
   }  

}

@media (min-width: 1025px) {
    #small-header {
        display:none;
    }
}