/**
 * @file
 * Subtheme specific CSS.
 * Es müssen bei Übernahme von CSS-Einstellungen alle Design-Einstellungen des Themes gleich sein
 */

/* ###############  Navigationsleiste fixieren in Bootstrap on!    Anfang ############### */   
   .affix {
    z-index: 9999 !important;
    margin-top: -2em !important;
    transition: 1000ms;
    position: fixed;
  }
/* ###############  Ende ############### */   

/* Anmeldeformular */
.form-control {
  width: 90%;
}
 /* Anmeldeformular ENDE */

 /* Hintergrundfarbe des Content-Blocks 
   border-top: 1px solid #5f5f5f !important;
 */
#main-wrapper{
  background: #faf8f4 !important;
  padding-top: 4em;
}
/* ################# Logo-Block  ################# */
/* Hintergrundfarbe des Logoblocks */
#navbar-top {
  background-color: #ffffff  !important;
}
/* ################# Logo-Block ENDE ################# */

 /*############### Logo ############### */
 @media (min-width: 1360px) {
  .navbar-brand {
     text-align: center;
     z-index: 900;
   }  
 }
 /*############### Logo ENDE ############### */
 
 /* ###############  Theme-Menü Einstellungen ################## */
/*#block-bootstrap-barrio-subtheme-main-menu a:hover {
  color: #000 !important;
  text-decoration: none;
  transition: 1000ms;
}
  */
/* +++++++++++ Für Navbar-Toggler +++++++++++++++++++ */
@media (min-width: 1360px) {
  #navbar-main {
    background-color: unset !important;
    z-index: 888;
        margin-top: -5%;
  }
}

@media (min-width: 1360px) {
  .navbar-expand-lg .navbar-collapse {
    flex-grow: unset;
    background: #9d182e;
    background: -webkit-linear-gradient(#9d182e, #cd03b8);
    background: -o-linear-gradient(#9d182e, #cd03b8);
    background: -moz-linear-gradient(#9d182e, #cd03b8);
    background: linear-gradient(#9d182e, #cd03b8);
    -webkit-box-shadow: 1px 2px 3px -1px rgba(0,0,0,0.75);
    -moz-box-shadow: 1px 2px 3px -1px rgba(0,0,0,0.75);
    box-shadow: 1px 2px 3px -1px rgba(0,0,0,0.75);
    border-radius: 3px;
    position: inherit;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    margin-top: 5.5em;
    width: max-content;
  }

  .navbar-expand-lg .navbar-nav .nav-link {
    padding-left: 3em !important;
    padding-right: 3em !important;
    font-size: large;
    border-left: 1px solid #b9b9b9;
  }
}

nav-link:focus, .nav-link:hover {
  background: linear-gradient(#a6a18b, #a6a18c);
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
  border-top-right-radius: 3px;
  color: white !important;
}
.dropdown-item {
  padding-top: 0.5em !important;
  padding-bottom: 0.5em !important;
  border-bottom: 1px solid #b9b9b9 !important;
}
.navbar-nav .nav-link.active {
  color: #9fff11 !important;
}
.dropdown-menu.show {
  background-color: #cd03b8;
}
.dropdown-menu a {
  text-decoration: none;
  color: #fff !important;
}
.dropdown-item:hover {
  color: #575656 !important; 
  background-color: #a6a18b !important;
}
.dropdown-item.active {
  background-color: #a3a3a3 !important;
  color: #97ff00 !important;
  width: auto;
}
/* ###############  Superfish-Navigationsleiste 01 links  ############### */   
/*                  Hintergrund                                           */
/*ul.sf-menu.sf-style-default li, ul.sf-menu.sf-style-default.sf-navbar {
  background: #00ff64;
}*/

/*                   Buttonfarbe linke Leiste                             */
#block-bootstrap-barrio-subtheme-unterrichtsmodule .sf-menu li {
  background: linear-gradient(#b389c5, #9711d0) !important;
  color: #ffffff !important;
}

#block-bootstrap-barrio-subtheme-sonstiges .sf-menu li {
  background: linear-gradient(#e7b985, #e28418) !important;
  color: #ffffff !important;
}
/*                  Hintergrund-Breite im Block                           */
ul.sf-menu.sf-vertical {
  width: auto;
}
/*                  Hover                                                 */
ul.sf-menu.sf-style-default a.is-active, ul.sf-menu.sf-style-default a:hover {
  background: linear-gradient(#ebeaea, #b6b6b6) !important;
  outline: 0;
  color: black !important;
}
.link:hover {
  color: #00ffab;
}

/*                  Textfarbe - statische Ansicht -, LINK-Unterstrich     */
#block-bootstrap-barrio-subtheme-unterrichtsmodule ul.sf-menu.sf-style-default a, ul.sf-menu.sf-style-default {
/*  color: #13a; */
  text-decoration: none;
  color: #fff !important;
  font-size: larger;
}
#block-bootstrap-barrio-subtheme-unterrichtsmodule a:visited {
/*  color: #13a; */
  text-decoration: none;
  color: #4d4d4d !important;
  font-size: larger;
}

#block-bootstrap-barrio-subtheme-sonstiges ul.sf-menu.sf-style-default a, ul.sf-menu.sf-style-default {
/*  color: #13a; */
  text-decoration: none;
  color: #000000 !important;
  font-size: larger;
}
#block-bootstrap-barrio-subtheme-sonstiges a:visited {
/*  color: #13a; */
  text-decoration: none;
  color: #000000 !important;
  font-size: larger;
}

/* +++++++++++ Für Navbar-Toggler 992px +++++++++++++++++++ */
/* @media (max-width: 1360px) { */
@media (max-width: 992px) {
  #navbar-main {
    margin-left: 1em;
    padding-left: 2em;
    padding-right: 2em;
    background: unset !important;
    width: max-content;
    z-index: 888;
    width: 100%;
  }
  .navbar-nav {
    background: linear-gradient(#9d182e, #cd03b8);
    font-size: large;
    padding-left: 2em;
    padding-right: 2em;
    padding-bottom: 0.2em;
  }
  .dropdown-item {
    padding-top: 1em !important;
    padding-bottom: 1em !important;
    border-bottom: 1px solid #b9b9b9 !important;
  }
}  

/*  */
@media (min-width: 992px) and (max-width: 1360px) {
  #navbar-main {
    background-color: unset !important;
    width: max-content;
  }

  .navbar-nav {
    background: linear-gradient(#9d182e, #cd03b8);
    background: #9d182e;
    font-size: large;
  }
  
  .dropdown-item {
    padding-top: 1em !important;
    padding-bottom: 1em !important;
  }

  .affix {
    z-index: 9999 !important;
    margin-top: 0.1px !important;
    transition: 1000ms;
    position: fixed;
  }
}  

  /*  Toggle-Menü position; Hintergrundfarbe und Rechteck */
  @media (max-width: 1360px) {
    .navbar-toggler {
      position: fixed;
      right: 2em;
      top: 4em;
      padding: 0.4em;
      border: var(--bs-border-width) solid #65576f;
      background: #fafafa;
      color: #000000;
      z-index: 888;
    }  
    .nav-link {
      border-bottom: 1px solid #b9b9b9;
    }
  }
  
  @media (min-width: 992px) {
    .navbar-expand-lg .navbar-nav .nav-link {
      background: #9d182e;
      background: -webkit-linear-gradient(#9d182e, #cd03b8);
      background: -o-linear-gradient(#9d182e, #cd03b8);
      background: -moz-linear-gradient(#9d182e, #cd03b8);
      background: linear-gradient(#9d182e, #cd03b8);
      border-bottom: none;
      border-right: 1px solid #b9b9b9;
      padding-left: 1.1em;
      padding-right: 1.1em;
    }
  }
/* ############### Theme-Menü Einstellungen ENDE ############## */

/* ###############  Raum für Toggle-Menü ############### */ 
#sidebar_second, h1 {
   padding-bottom: 2rem;
}

#content .col {
  flex: 1 0 0%;
  margin-top: 3em;
}
/* ###############  Raum für Toggle-Menü ENDE ########## */ 
/* ###############  Überschriften Hover ###################### */ 
/* Dekoration */ 
h2, h3 {
  padding: 10px;
  background-color: #e3e3e3 !important;
}

/* ###############  Überschriften Hover Ende ################# */ 

/* ############### Tabellen ############### */ 
/* Startseite */
tr td, tr th {
  padding: 4px 9px;
  border: 1px solid #fff;
  text-align: center;
  background-color: white;
}
/* ############### Tabellen Ende ########### */ 

/* ############### Bilder ################## */
.content img {
  box-shadow: 0 12px 15px 0 rgba(0, 0, 0, 0.24), 0 0 15px 0 rgba(0, 0, 0, 0.19);
}
.caption > figcaption {
  margin: 0.9em;
  text-align: center;
}
/* ############### Bilder Ende ############# */

/* ################# Rechte Leiste  ################# */
#block-bootstrap-barrio-subtheme-sprechzeiten 
  .content a:hover, .link:hover {
    color: #202020;
  }

/* - TextLINK */
.content a:hover, .link:hover {
    color: #202020;
  }
  
  @media (min-width: 1200px) {
      #sidebar_second, .col-md-2 {
          width: 23%;
       }
    }
  
  @media (max-width: 1200px) {
      #sidebar_second, .col-md-2 {
          width: 80%;
        }
    }  
  /* ################# Rechte Leiste ENDE ################# */

/* ################# Container wegen Sliderbilder  ################# */
/* ################# Container ENDE ################# */ 
  
/* ###############  Main Content  ############## */
/* Hintergrundfarbe unter dem Hauptmenü */
@media (min-width: 768px) {
  .offset-md-1 {
    margin-left: 0.3%;
  }
}
/* ###############  Main Content Ende  ############## */
/* ###############  Blöcke rechts und links   ############## */
/* ???????? */
  .sidebar .block {
    background-color: #fff !important;
    font-size: initial;
  }

#block-bootstrap-barrio-subtheme-unterrichtsmodule div.sf-accordion-toggle.sf-style-default a {
  background: linear-gradient(#b389c5, #9711d0) !important;
  color: rgb(255, 255, 255);
  padding: 1em 21em 0.7em 9.3em !important;
  font-size: large !important;
  text-decoration: none !important;
}
#block-bootstrap-barrio-subtheme-sonstiges div.sf-accordion-toggle.sf-style-default a {
  background: linear-gradient(#e7b985, #e28418) !important;
  color: rgb(0, 0, 0);
  padding: 1em 25.4em 0.7em 9.3em !important;
  font-size: large !important;
  text-decoration: none !important;
}

/* ###############  Blöcke rechts und links Ende  ############## */

/* ################# Vorschautext der Startseite ################# */
	/* Hintergrundfarbe der Vorschaublöcke */
  @media (min-width: 70em) { 
    .node--view-mode-teaser {
    border-bottom: 1px solid #d3d0d0;
    background-color: #f6f7f3;
    box-shadow: 0 0 8px 1px #cccccc;
    border-radius: 0.5em;
    padding: 1.8rem;
    max-width: 71rem;
    }
  }
   /* Linien (Farbe) über und unter Vorschautext der Startseite  */
  .inline__links {
    border-top: 1px solid #33333363;
    border-bottom: 1px solid #33333363;
    margin-top: 2rem auto;
  }
  /*  Überschrift Vorschautext  
    Farbe der Vorschautext-Überschrift */
  .node--view-mode-teaser h2 a {
    color: #801d22;
    text-decoration: none;
  }
  /* ################# Vorschautext der Startseite ENDE ################# */


  /* ################# Fußbereich  ################# */
  .site-footer {
    background: linear-gradient(#9c027e, #f72020, #42fd5b) !important;
    /* background: url('../sites/default/files/inline-images/Logo.png') center center scroll repeat-y transparent; */
  }
  .site-footer__bottom {
    border-top: none;
  }
  .site-footer .block {
    border: none;
    border-color: unset;
    padding: 1px;
  }
 .site-footer__top .content li a {
    border-bottom: none;
    padding-left: 2em;
    padding-right: 2em;
    text-decoration: none;
  }
  .site-footer__top .region {
    width: auto;
  }
/* ################# Fußbereich ENDE ################# */

/* ################# Such-Buttonfarbe #################  */
.btn-primary {
  background-color: #9d0572 !important;
  border-color: #b5b5b5 !important;
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: #856163 !important;
}
@media (min-width: 851px) {
  .site-footer__top .region {
    width: auto;
  }
}/* ################# Such-Buttonfarbe ENDE #################  */

/* ################# Cookie-Button: Im Modul einstellen ##############  */
#popup-text, .eu-cookie-compliance-message p {
  font-size: 0.9em;
}
.eu-cookie-compliance-message button {
  color: #626262;
}
/* ################# Cookie-Buttons ENDE ##############  */

/* #################### LINK-ICO zueiner externen Website #################### */
svg.ext {
  width: 24px;
  height: 24px;
  fill: #fb0000;
  margin: 0px 0px 6px 5px;
}
svg.mailto {
  width: 24px;
  height: 24px;
  fill: #fb0000;
  margin: 0px 0px 6px 5px;
}
/* #################### LINK-ICO zueiner externen Website ENDE #################### */

/* #################### Back to top #################### */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  #backtotop {
    background-size: 32px 32px;
  }
}
/* #################### Back to top ENDE #################### */