@import url(../../../../../_assets/fonts/abhayalibre_regular_macroman/stylesheet.css);
@import url(../../../../../_assets/fonts/specialelite_regular_macroman/stylesheet.css);

:root {
  --white: #FFF;
  --black: #000;
  --altweiss: #FAF7F4;
  --anthrazit: #332f2e;
  --light-gray: #eaeaea;
  --medium-gray: #595959;
  --h2-pink: #ef228e;
  --h2-red: #fd0418;
  --hamburger-menu-button-stripes-color: var(--anthrazit);
  --hamburger-menu-button-background-color: var(--light);

  --body-font-size: 1.2rem;
  --body-line-height:  1.5rem;
  --body-font-family: 'abhaya_libreregular';
  --body-color: var(--anthrazit);
}

@media all {

/*********  Browser-Info  *********/
div#browserInfo {
	text-align: center;
	background: #9CFF2F;
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 99999999;
}

/*********  Back-top  *********/
#back-top {
  position: fixed;
  color: var(--white);
  background-color: var(--medium-gray);
}
#back-top span[class*="icon"] {
  position: relative;
  top: 0.1rem;
}
@media all and (max-width: 767px) {
  #back-top {
    right: 0.5rem;
    bottom: 0.5rem;
    padding: 0.25rem;
  }
}
/******************************/

body {
  background: var(--altweiss) !important;
  font-size: var(--body-font-size);
  line-height: var(--body-line-height);
}

/********* Horizontalmenü *********/
header .container-nav {
  padding-bottom: 0 !important;
}
header nav {
  background-color: var(--black) !important;
  margin-top: 0 !important;
}
header nav ul {
  color: var(--white) !important;
  background-color: var(--black) !important;
  justify-content: center;
}
header nav li {
  padding: 0 !important;
  display: flex;
  align-items: baseline;
  flex-wrap: nowrap !important;
}
header nav li a {
  color: var(--white) !important;
  display: inline-block;
  padding: 1rem 1rem 1rem 0.5rem;
}
header nav li.active,
header nav li:hover,
header nav li:active,
header nav li:focus {
  background-color: var(--medium-gray);
}
header nav li.active::after,
header nav li:hover::after {
  background: transparent !important;
}
header nav li.level-1 + li.level-1 {
  margin-left: 0.5rem !important;
}
header nav i.fa {
  padding-left: 1rem;
}
/*** metismenu Dropdown-Menü ***/
header nav ul.metismenu li a + .mm-toggler::after {
  margin: 0 !important;
}
header nav .metismenu li {
  padding-right: 0.5rem !important;
}
header nav ul.metismenu li a {
  padding: 1rem 0.5rem 1rem 0.5rem !important;
}
header nav .metismenu-item.active a,
header nav .metismenu-item.active .mm-toggler,
header nav .metismenu-item a:hover,
header nav .metismenu-item .mm-toggler:hover {
  text-decoration: none !important;
}

header nav ul.metismenu > li.active > a::after,
header nav ul.metismenu > li.active > .mm-toggler::before,
header nav ul.metismenu > li > a:hover::after,
header nav ul.metismenu > li > .mm-toggler:hover::before {
  background: transparent !important;
}
header nav ul.metismenu ul {
  min-width: auto !important;
}
header nav ul.metismenu ul.mm-collapse li a {
  width: 100%;
}

/********* Header *********/
header {
  background: var(--altweiss) !important;
}
header .container-topbar h1 {
  font-size: 1.5rem;
  font-family: var(--body-font-family);
  font-weight: normal;
  text-align: center;
  margin-bottom: 0;
}
header .container-topbar {
  color: var(--body-color);
  background-color: var(--altweiss);
  padding: 0.5rem;
}
header .container-topbar p {
  text-align: center;
  margin-bottom: 0;
}
header .container-topbar a {
  color: var(--body-color);
  text-decoration: none !important;
}
header .container-topbar a:hover,
header .container-topbar a:active,
header .container-topbar a:focus {
  text-decoration: none;
  border-bottom: 1px solid var(--body-color);
}
header .container-below-top .header-image {
  background-size: cover;
  background-position: center left;
  background-repeat: no-repeat;
  height: 520px;
}
/*
header .navbar-brand {
  padding-top: 0;
  padding-bottom: 0;
}
*/

.compactContactData i.fa {
  padding-right: 0.25rem;
  font-size: 0.75rem;
}
.compactContactData {
  margin-top: 0.25rem;
}

.inlineBlock {
  display: inline-block;
}

#main {
  padding-left: 15%;
  padding-right: 15%;
/*
  display: flex;
  flex-direction: row;
*/
  background-color: var(--altweiss);
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

h1, h2, h3, h4,
header nav {
  font-family: 'special_eliteregular';
}

#main a {
  color: var(--body-color);
  text-decoration: none !important;
  border-bottom: 1px solid var(--body-color);
}
a.btn,
a[class^="com-users-login"] {
  color: var(--body-color);
  background-color: var(--white);
  text-decoration: none !important;
  border: 1px solid rgba(0,0,0,0.125) !important;
}
legend {
  font-size: inherit;
}

h2 a,
h3 a,
h4 a {
  border-bottom: none !important;
}
h2 a:hover,
h2 a:active,
h2 a:focus,
h3 a:hover,
h3 a:active,
h3 a:focus,
h4 a:hover,
h4 a:active,
h4 a:focus {
  border-bottom: 1px solid var(--body-color) !important;
}

h2 {
  font-size: 2rem;
  margin-bottom: 1.5rem;
}

#main i.fa {
  padding-left: 0.25rem;
}


/********* Startseite *********/
/*
.startseite .blog-featured h2 {
  font-size: 2rem;
  margin-bottom: 1.5rem;
}*/
.startseite .blog-featured [class*="columns-"] h2 {
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-color: var(--h2-pink);
  background-image: linear-gradient(to right, var(--h2-pink) 30%, var(--h2-red) 70%);
  background-size: cover;
  background-position: center center;
  text-align: center;
}
.startseite .blog-featured [class*="columns-"] h2 a:hover,
.startseite .blog-featured [class*="columns-"] h2 a:active,
.startseite .blog-featured [class*="columns-"] h2 a:focus {
  border-bottom: 1px solid var(--h2-pink) !important;
}
.startseite .blog-featured .items-leading {
  padding-bottom: 1rem;
}
.startseite .blog-featured .items-leading h2 a {
  color: var(--body-color);
  text-transform: uppercase;
}
.startseite .blog-featured [class*="columns-"] p {
  text-align: justify;
}
.startseite .blog-featured [class*="columns-"] {
  grid-gap: 2rem;
}
.startseite #main {
  margin-bottom: 0;
}
.startseite .newsflash {
  margin-top: 4rem;
}
.startseite .foerderlogos {
  text-align: center;
  margin-top: 6rem;
}
a.no-border-bottom {
  border-bottom: none !important;
}

/********* Kontakt *********/
.bestellung #main ul li:not(:last-of-type) {
  margin-bottom: 1rem;
}

/********* Kontakt *********/
.kontakt .item-page figure.item-image + div[itemprop="articleBody"] {
  top: 0;
}
.kontakt .item-page figure.left.item-image {
  float: none;
  padding-right: 0 !important;
  margin-bottom: 0;
}


/********* Wegbeschreibung *********/
div#map {
  border: 1px solid var(--medium-gray);
}
.gdpr-protector-shield {
  background-image: url(../../../../../images/content/wegbeschreibung/wegbeschreibung.jpg) !important;
  background-size: cover !important;
}
/***************************/

/********* Versandkosten *********/
.versandkosten colgroup {
  width: 15rem;
}
.versandkosten tr:nth-child(even) {
  background-color: var(--light-gray);
}
.versandkosten th,
.versandkosten td {
  width: 8rem;
/*  min-width: 4.5rem;*/
  text-align: right;
  vertical-align: top;
  padding: 0.5rem 0;
}
.versandkosten th:first-of-type,
.versandkosten td:first-of-type {
  text-align: left;
  padding-right: 0.5rem;
}
/***************************/


.blog-items:not(.items-leading) .blog-item {
  text-align: center;
}
.blog-items .article-info .article-info-term {
  display: none;
}

.item-page figure.item-image + div[itemprop="articleBody"] {
  position: relative;
  top: -3.75rem;
}
.item-page figure.left.item-image {
  padding-right: 1rem;
}

/********* Footer *********/
footer {
  background-color: var(--altweiss) !important;
  background-image: none !important;
  margin-top: 0 !important;
}
footer .dashed-line {
  border-top: 3px dashed var(--medium-gray);
  height: 0.75rem;
}
footer .content {
  background-color: var(--anthrazit);
  padding: 0 5% 2.5rem 5%;
  display: flex;
  flex-flow: wrap;
  justify-content: center;
}
footer .copyright {
  padding-top: 1rem;
  padding-right: 2rem;
  margin-bottom: 0;
}
footer nav li {
  padding: 0.5rem 1rem 0 0 !important;
}
footer nav li a {
  padding: 0.5rem 0.5rem 0 0.5rem !important;
}
footer nav li.active a,
footer nav li a:hover,
footer nav li a:active,
footer nav li a:focus {
  text-decoration: none !important;
  border-bottom: 2px solid var(--medium-gray);
}
footer .pegasus {
  position: absolute;
  bottom: 2rem;
  right: 10vw;
}

/********* Topmenü *********/
.topmenue {
  float: left;
  top: 0.75rem;
  left: 1vw !important;
  position: relative; /* nötig für z-index */
  z-index: 999;
}
.topmenue li {
  color: var(--body-color);
  background-color: var(--white);
}
.topmenue li a {
  padding: 1rem !important;
}
.topmenue i.fa {
  display: none;
}

/********* Artikel-Icons *********/
#main .icons > div {
  float: none !important;
  display: block;
  text-align: left;
  padding-bottom: 1rem;
  position: relative; /* nötig für z-index */
  z-index: 999;
}

/********* 404-Seite *********/
.error_site header .container-topbar h1 {
  margin-top: 0;
}
.error_site header .container-below-top .header-image {
  background-image: url('../../../../../images/headers/buchladen_rotestrasse_goettingen_header_1.jpg');
}

/********* Frontend-Bearbeitung *********/
body.com_users #users-profile-custom,
body.com_users #member-profile fieldset + fieldset {
  display: none;
}
.login input {
  font-size: 1.2rem;
}
body.layout-edit header .container-nav {
  display: none;
}
body.layout-edit header .container-topbar,
body.layout-edit .header-image {
  display: none;
}
body.layout-edit .topmenue {
  background-color: var(--black) !important;
  float: none;
  top: 0;
  left: 0 !important;
  padding: 0.5rem 1.25rem;
}
body.com_users .pegasus,
body.layout-edit .pegasus,
body.edit-gallery .pegasus {
  display: none;
}
.edit .page-header {
  display: none;
}
#main .icons [role="tooltip"] {
  display: none;
}
div[id^="system-message"] div[class*="message"],
.edit input,
.edit textarea {
  font-size: 1.2rem !important;
}
.editor .mceBranding {
  display: none !important;
}

body.com_igallery .ig_toolbar a,
body.com_igallery #ig_admin_table .ordering-heading a,
body.com_igallery #ig_admin_table .delete-cell a,
body.com_igallery #ig_admin_table .publish-cell a,
body.com_igallery #ig_admin_table .ordering-cell a {
  border-bottom: none !important;
}

}


/***********************************************************************************************************************************************************
********************************************************** Media Queries ***********************************************************************************
************************************************************************************************************************************************************/

/*******************************************************************************/
@media all and (min-width: 1024px) {

.container-component {
  padding-right: 2%;
}

}

/*******************************************************************************/
@media all and (min-width: 768px) {

.showOnMobile {
  display: none;
}

header nav ul {
  flex-direction: row !important;
}

footer .copyright,
footer nav,
footer ul,
footer ul li {
  display: inline-block !important;
}

}

/*******************************************************************************/
@media all and (max-width: 1749px) {

header .container-below-top .header-image {
  height: 450px;
}

footer .pegasus {
  right: 7vw;
}

}

/*******************************************************************************/
@media all and (max-width: 1649px) {

header .container-below-top .header-image {
  height: 400px;
}

footer .pegasus {
  bottom: 3rem;
  right: 5vw;
}

}

/*******************************************************************************/
@media all and (max-width: 1499px) {

header .container-below-top .header-image {
  height: 350px;
}

#main {
  padding-left: 5%;
  padding-right: 5%;
}

footer .pegasus {
  bottom: 5.5rem;
  right: 6vw;
}

}

/*******************************************************************************/
@media all and (max-width: 1249px) {

header nav ul li {
  font-size: 0.9rem !important;
}
header nav ul.metismenu li.level-1:last-of-type ul {
  right: 0;
}

header .container-below-top .header-image {
  height: 300px;
}

h2 {
  font-size: 1.6rem;
}

}

/*******************************************************************************/
@media all and (max-width: 1150px) {

.topmenue {
  display: flex !important;
  flex-direction: column !important;
}
.topmenue li {
  margin-left: 0 !important;
}

}

/*******************************************************************************/
@media all and (max-width: 1023px) {

header .container-below-top .header-image {
  height: 250px;
}

header nav {
  font-size: 1.1rem;
}
header nav ul li {
  font-size: 0.725rem !important;
}

#main {
  flex-direction: column;
}

.container-sidebar-left,
.container-sidebar-right {
  width: 100%;
}

.blog-items.columns-4 {
  grid-template-columns: 1fr 1fr;
}
.items-leading p {
  text-align: justify;
}

footer .pegasus {
  right: 6vw;
}

}

/*******************************************************************************/
@media all and (max-width: 991px) {

header nav .navbar-toggler {
  display: none;
}
header nav .collapse {
  display: flex !important;
}
header nav ul {
  display: flex;
}
header nav i.fa {
  padding-left: 0.75rem;
}
header nav li a {
  padding: 1rem 0.75rem 1rem 0.5rem;
}
header nav ul.metismenu li {
  padding-right: 0.3rem !important;
}
header nav ul.mod-menu.nav {
  flex-direction: row;
  position: relative;
  right: -1vw;
}
header nav ul.mod-menu.nav li {
  padding: 0.5rem 1vw;
}

}

/*******************************************************************************/
@media all and (max-width: 900px) {

footer nav {
  width: 85%;
}

footer .pegasus {
  bottom: 7.55rem;
}

}


/*******************************************************************************/
@media all and (max-width: 849px) {

header .container-below-top .header-image {
  height: 200px;
}

header nav i.fa {
  padding-left: 0.4rem;
}
header nav li a {
  padding: 1rem 0.7rem 1rem 0.4rem;
}
header nav li.level-1 + li.level-1 {
  margin-left: 0.2rem !important;
}
header nav ul.metismenu li.level-1:last-of-type ul {
  right: 0.1rem;
}

}

/*******************************************************************************/
@media all and (max-width: 767px) {

.hideOnMobile {
  display: none !important;
}
.showOnMobile {
  display: inline-block;
}

header .container-below-top .header-image {
  height: 185px;
}

header nav .collapse:not(.show) {
  display: none !important;
}
header nav ul {
  display: flex;
}
header nav ul li {
  padding-left: 5% !important;
  font-size: var(--body-font-size) !important;
}
header nav .navbar-toggler {
  display: block;
  margin: 0.5rem 1rem 0.5rem 5% !important;
  font-size: 1.5rem;
}
header nav .navbar-toggler:focus {
  box-shadow: none;
}
header nav .navbar-toggler:hover,
header nav .navbar-toggler:active {
  color: var(--hamburger-menu-button-stripes-color);
  background-color: var(--hamburger-menu-button-background-color);
}
/*
header nav ul li.active.parent {
  background-color: transparent;
}
*/
header nav ul li:hover {
  background-color: transparent;
}
header nav i.fa {
  padding-left: 0;
}
header nav li + li {
  margin-left: 0 !important;
}

header nav ul.metismenu li {
  display: block !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
header nav ul.metismenu i.fa {
  top: 0.1rem;
  position: relative;
}
header nav ul.metismenu {
  padding-left: 5% !important;
}
header nav li.level-1 + li.level-1 {
  margin-left: 0 !important;
}
header nav ul.metismenu a {
  vertical-align: middle;
}
header nav ul.metismenu .mm-toggler {
  display: inline-block !important;
  height: auto !important;
  top: 1.3rem;
  overflow: visible !important;
}
header nav ul.metismenu ul.mm-collapse {
  margin-left: 0 !important;
  width: 100%;
  position: relative !important;
  display: block !important;
}
header nav ul.metismenu ul.mm-collapse {
  padding-left: 10% !important;
}
header nav ul.metismenu ul.mm-collapse li a {
  width: 90%;
}

footer nav,
footer ul,
footer ul li {
  display: inline-block !important;
}
footer nav .navbar-toggler {
  display: none;
}
footer nav .collapse {
  display: inline-block !important;
}
footer hr {
  margin: 0.25rem 0 0.75rem 0;
}
footer .copyright {
  padding-top: 0;
}
footer .pegasus {
  bottom: 11.5rem;
}

}

/*******************************************************************************/
@media all and (max-width: 699px) {

footer nav {
  width: 70%;
}

footer .pegasus {
  bottom: 13rem;
}

}

/*******************************************************************************/
@media all and (max-width: 649px) {

header .container-below-top .header-image {
  height: 175px;
}

.blog-items.columns-4 {
  grid-template-columns: 1fr;
}

.item-page figure.item-image + div[itemprop="articleBody"] {
  top: 0;
}
.item-page figure.left.item-image {
  float: none;
  padding-right: 0;
  margin-bottom: 0;
  text-align: center;
}

.versandkosten colgroup {
  width: 55%;
}

}


/*******************************************************************************/
@media all and (max-width: 480px) {

footer .pegasus {
  bottom: 15rem;
}

}




/************************  Pegasus *****************************************************************************************************************/
footer .pegasus {
  background-size: cover;
  background-position: center center;
}
/*******************************************************************************/
@media all and (min-width: 1650px) {
footer .pegasus {
  background-image: url(../../../../../images/pegasus/logo_pegasus_250.png);
  background-size: cover;
  background-position: center center;
  height: 191px;
  width: 250px;
}
}
@media all and (min-width: 1650px) and (-webkit-min-device-pixel-ratio: 2) {
footer .pegasus {
  background-image: url(../../../../../images/pegasus/logo_pegasus_250@2x.png);
}
}
/*******************************************************************************/
@media all and (min-width: 1150px) and (max-width: 1649px) {
footer .pegasus {
  background-image: url(../../../../../images/pegasus/logo_pegasus_200.png);
  background-size: cover;
  background-position: center center;
  height: 153px;
  width: 200px;
}
}
@media all and (min-width: 1150px) and (max-width: 1649px) and (-webkit-min-device-pixel-ratio: 2) {
footer .pegasus {
  background-image: url(../../../../../images/pegasus/logo_pegasus_200@2x.png);
}
}
/*******************************************************************************/
@media all and (max-width: 1149px) {
footer .pegasus {
  background-image: url(../../../../../images/pegasus/logo_pegasus_150.png);
  background-size: cover;
  background-position: center center;
  height: 115px;
  width: 150px;
}
}
@media all and (max-width: 1149px) and (-webkit-min-device-pixel-ratio: 2) {
footer .pegasus {
  background-image: url(../../../../../images/pegasus/logo_pegasus_150@2x.png);
}
}


