/* ############################################# */
/**                                              *
*                 SR Rezepte  2024               *
*                                                */                      
/* ############################################ */


/* ###################### Farben ###################### */

/** Seitenhintergrund
* Hintergrund gesamt #41464D bzw. karo4.png
* Ueberschriften und Links #bf2718 - dunkles rot
* Textfarbe #34404E grau
*/

/*########################################################*/
/*                                                        */
/*                    Grid und Farben                     */
/*                                                        */
/*########################################################*/
.t4-content {
  background: #ffffff; /* Hintergrundfarbe gesamt */
  background: url('../../karo4.png');
}
.t4-content-inner {
  margin-left: auto;
  margin-right: auto;
  padding-left: 0px;
  padding-right: 0px;
  background-color: #fff; /* Hintergrundfarbe für Inhalt gesamt  */
}
.container {
  padding-left: 0px;
  padding-right: 0px;
}
.t4-main-body   {
  padding-left: 40px;
  padding-right: 20px;
}

@media (min-width: 768px) {
  .t4-content-inner {
    width: 750px;
  }
}
@media (min-width: 800px) {
  .t4-content-inner {
    width: 790px;
  }
}
@media (min-width: 992px) {
  .t4-content-inner {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .t4-content-inner {
    width: 970px;
  }
}

/*########################################################*/
/*                                                        */
/*                 Überschriften                          */
/*                                                        */
/*########################################################*/
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6
{
  color: inherit;
  font-family: "Bad Script", Helvetica,Arial,sans-serif;
  font-weight: 400;
  line-height: 1.1;
}
h1, h2, h3
{
  margin-top: 20px;
  margin-bottom: 10px;
}
h3, .h3
{
  font-size: 19px;
}
.page-header {
    border: 0px;
    margin-bottom: 0px;
    padding-bottom: 0px;
    text-transform: uppercase;
}
.blumen .page-header, .blumen h2 {
    text-transform: none;
}
.blumen h2 {
    font-size: 16px;
    margin-bottom: 0px;
}
.page-title {
    text-transform: none;
}
.module-title
{
  color: inherit;
  font-size: 16px;
  font-weight: 400;
  text-transform: uppercase;
  margin-top: 0px;
  margin-right: 0px;
  margin-bottom: 10px;
  margin-left: 0px;
  padding-top: 20px;
  padding-right: 20px;
  padding-bottom: 20px;
  padding-left: 20px;
}
.module-title
{
  margin-bottom: 20px;
}
.t3-sl-1 .module-title, .t3-sl-2 .module-title
{
  font-size: 23px;
  font-weight: 400;
  margin-left: 10px;
  margin-bottom: 10px;
  text-transform: uppercase;
}
/*########################################################*/
/*                                                        */
/*                Logo und Slogan                         */
/*                                                        */
/*########################################################*/

/* ###################### Logo SRezepte ###################### */

.logo-sr {
  text-align: center;
  margin-bottom: 0;
  padding-top: 60px;
  padding-bottom: 20px;
}
.logo-sr a {
  font-family: "Bad Script", Helvetica, Arial, sans-serif;
  font-size: 80px;
  font-weight: 400;
  color: #bf2718;
  line-height: 55px;
    padding-bottom: 40px;
}
@media screen and (max-width: 450px) {
    .logo-text a {
        font-size: 70px;
    }
}
@media screen and (max-width: 350px) {
    .logo-text a {
        font-size: 60px;
    }
}
.logo-text .site-slogan {
  display: none;
}

/* ###################### SLOGAN ###################### */
.slogan-sr {
    text-align: center;
  font-family: "Raleway", Helvetica, Arial, sans-serif;
  font-size: 14px;
    padding-top: 10px;
    padding-bottom: 10px;
}
@media screen and (max-width: 350px) {
    .slogan-sr {
        font-size: 10px;
    }
}

 /*########################################################*/
/*                                                        */
/* Masthead - das Kopfbild mit der Seitenüberschrift      */
/*                                                        */
/*########################################################*/
.t4-masthead-title {
}





 /*########################################################*/
/*                                                        */
/*              Suche im Hauptmenü                        */
/*                                                        */
/*########################################################*/
/* positioniert die Suche an der richtigen Stelle rechts im Hauptmenü */
.head-search {
  height: 55px;
  position: absolute;
  right: 0;
  margin: 0;
  z-index: 1000;
}
/* Die Hintergrund der gesamten Suche */
.head-search {
  background-image: -webkit-linear-gradient(top, #383838 0%, #2f2f2f 100%);
  background-image: -o-linear-gradient(top, #383838 0%, #2f2f2f 100%);
  background-image: linear-gradient(to bottom, #383838 0%, #2f2f2f 100%); /* Diese Zeile gilt fuer Firefox */
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff383838', endColorstr='#ff2f2f2f', GradientType=0);
  border: 0px;
}

  .head-search div.finder,
  .head-search .search {
    background: rgba(0, 0, 0, 0.5);
  }


/*########################################################*/
/*                                                        */
/*                       Hauptmenü                        */
/*                                                        */
/*########################################################*/
.navbar {
    height: 55px;
}
.nav-item {
    height: 55px;
}
/* Hier wird der Hintergrund des Hauptmenüs definiert */
.navbar {
  background-image: -webkit-linear-gradient(top, #383838 0%, #2f2f2f 100%);
  background-image: -o-linear-gradient(top, #383838 0%, #2f2f2f 100%);
  background-image: linear-gradient(to bottom, #383838 0%, #2f2f2f 100%); /* Diese Zeile gilt fuer Firefox */
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff383838', endColorstr='#ff2f2f2f', GradientType=0);
  border: 0px;
}
/* Textfarbe und Kapitälchen bei den Menüpunkten */
.menu-sr .navbar .navbar-nav > li > a {
  font-size: 14px;
  text-transform: uppercase;
  color: #ffffff;
}
/* Die Hintergrundfarbe beim hovern und bei aktiven Menüpunkten */
.menu-sr .navbar .navbar-nav > li > a {
     font-size: 14px;
     line-height: 10px:
     padding: 0;
}

.menu-sr .navbar .navbar-nav > li > a:hover,
.menu-sr .navbar .navbar-nav > li > a:focus {
  color: #ffffff;
  background-color: #bf2718;
}
.menu-sr .navbar .navbar-nav > .active > a,
.menu-sr .navbar .navbar-nav > .active > a:hover,
.menu-sr .navbar .navbar-nav > .active > a:focus {
  color: #ffffff;
  background-color: #bf2718;
}
.menu-sr .navbar .navbar-nav > .open > a,
.menu-sr .navbar .navbar-nav > .open > a:hover,
.menu-sr .navbar .navbar-nav > .open > a:focus {
  background-color: #bf2718;
  color: #ffffff;
}

/* Menüpunkte im Dropdownmenü */
.menu-sr .dropdown-item
{
  font-family: "Bad Script", Helvetica, Arial, sans-serif;
  color: #bf2718;   /* eigentlich nicht notwendig solange color palette im template funktioniert */
  line-height: 10px;
}
/* Farbe der Menüpunkte im Dropdownmenü beim hovern */
.menu-sr .dropdown-item > li > a:hover,
.menu-sr .dropdown-item > li > a:focus
{
  color: #2f2f2f;      /* eigentlich nicht notwendig solange color palette im template funktioniert */
  background-color: #ffffff;
}




 /*########################################################*/
/*                                                        */
/*                     Module                             */
/*                                                        */
/*########################################################*/
 /*############### Übersichtsmodule ###############*/

/*########################################################*/
/*                                                        */
/*                       Sidebar                          */
/*                                                        */
/*########################################################*/

/* Dies sind die Module der Übersichten am Rand */
.sidebar-sr {
 padding-left: 20px;
}

.sidebar-sr {
  font-family: "Raleway", Helvetica,Arial,sans-serif;
        font-size: 14px;
        line-height: 20px;
}
.sidebar-sr .moduletable {
    border: 0;
}

/* ul.mod-articlescategory.category-module.mod-list */

ul.mod-articlescategory.category-module.mod-list {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.blog-item-content {
   font-family: "Raleway", Helvetica,Arial,sans-serif;
        font-size: 14px;
        line-height: 20px;
}



.mod-articles-category-title {
       text-transform: none;
        font-weight: normal;
        color: #bf2718;
        margin-top: 0px;
        padding-bottom: 10px;
        border-bottom: 1px solid #eeeeee;
 }

.mod-articles-category-title > a:link {
  text-decoration: none;
  color: #bf2718;
}
.mod-articles-category-title > a:visited {
  text-decoration: none;
  color: #bf2718;
}
.mod-articles-category-title > a:hover {
  text-decoration: underline;
  color: #bf2718;
}
.mod-articles-category-title > a:active {
  text-decoration: underline;
  color: #bf2718;
}
 
 
 
 
 
/*########################################################*/
/*                                                        */
/*                    Footer                              */
/*                                                        */
/*########################################################*/
.footer-sr {
  margin-top: 0px;
  margin-bottom: 0px;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: center;
  background-color: #d3dae2;
  font-size: 14px;
  color: #bf2718;
}
/*########################################################*/
/*                                                        */
/*                Back-to-top-Button                      */
/*                                                        */
/*########################################################*/