html {
    overflow-y: scroll;
}

body {
    font-family: 'Arial';
    font-size: 12px;
    color: var(--body-fg);
    background-color: var(--body-bg);
}

.gradient {
    background-image: linear-gradient(90deg, var(--pastel-blue), var(--pastel-green), var(--pastel-orange), var(--pastel-red), var(--pastel-pink), var(--pastel-blue) );
    border-width: 2px;
    height: 10px;
    min-height: 10px;
}

.navbar {
    background-color: var(--body-bg);
}

footer {
    background-color: #1a1a1a;
}

.tag {
    font-size: 1em; font-weight: bold; color: var(--black-0p7); border-radius: 4px; padding: 0.4em; line-height: 2.5em; white-space: nowrap;
}

.tag-button { background-color: var(--white-0p2); color: var(--white-1p0) }
.tag-blue { background-color: var(--pastel-blue) }
.tag-green { background-color: var(--pastel-green) }
.tag-orange { background-color: var(--pastel-orange) }
.tag-yellow { background-color: var(--pastel-yellow) }
.tag-red { background-color: var(--pastel-red) }
.tag-pink { background-color: var(--pastel-pink) }
.tag-gray { background-color: var(--pastel-gray) }
.tag-light-gray { background-color: var(--pastel-light-gray) }


.row-tags { margin-top: 2em; }
.row-tag-time { margin-top: 1em; }
.tag-time { color: var(--pastel-light-light-gray); white-space: nowrap; }
.tag-time > b { font-size: 1.2em; }

/* .rainbow-line { padding: 1px; background-image: linear-gradient(90deg, var(--pastel-blue), var(--pastel-green), var(--pastel-orange), var(--pastel-red), var(--pastel-pink), var(--pastel-blue)); } */
.rainbow-line { padding: 1px; background-color: var(--header) }


.pager button i.fa-chevron-left { padding-left: 1em; padding-right: 1em; color: var(--white-1p0) }
.pager button i.fa-chevron-right { padding-left: 1em; padding-right: 1em; color: var(--white-1p0) }
.pager button.selected-page { background-color: var(--pastel-yellow); color: var(--black-1p0); }
.pager button.selected-page span { padding-left: 0.5em; padding-right: 0.5em; }
.pager button.current-page span { padding-left: 0.5em; padding-right: 0.5em; color: var(--white-1p0) }
.pager button.disabled-page span { padding-left: 0.5em; padding-right: 0.5em; }



.inserat-frage { padding-bottom: 1.5em; border-bottom: 1px dashed var(--pastel-light-gray) }
.inserat-immobilie { padding-bottom: 1.5em; border-bottom: 1px dashed var(--pastel-light-gray) }
.inserat-verkauf { padding-bottom: 1.5em; border-bottom: 1px dashed var(--pastel-light-gray) }
.inserat-event { padding-bottom: 1.5em; border-bottom: 1px dashed var(--pastel-light-gray); background-color: var(--white-0p1) }
.inserat-firma { padding-bottom: 1.5em; border-bottom: 1px dashed var(--pastel-light-gray); background-color: var(--white-0p1) }



.inserat-werbung { padding-bottom: 0em; border-bottom: 1px dashed var(--pastel-light-gray) }
.inserat-laufbanner { padding-bottom: 0em; border-bottom: 1px dashed var(--pastel-light-gray) }


.bewertungen > .row { margin-top: 2em; }
.bewertungen > .row > div:nth-child(1) { color: var(--body-fg); font-size: 1.3em; }
.bewertungen > .row > div:nth-child(2) { color: var(--pastel-gray); font-size: 1em; margin-top: 0.2em; }
.bewertungen > .row > div:nth-child(1) i.fa-minus-circle { color: rgba(255, 80, 80, 1); padding-right: 0.2em; }


.left-menu { padding-left: 0.7em; margin-top: 1.4em; }
.left-menu.selected { border-left: 2px solid var(--pastel-orange); }
.left-menu.enabled  { border-left: 2px solid var(--body-bg); }
.left-menu.disabled { border-left: 2px solid var(--body-bg); color: var(--link-disabled) }

.left-menu i { font-size: 1.4em; }


.ueberschrift { padding-top: 1.5em; padding-bottom: 1.5em; font-size: 1.2em; }
.kurztext { font-size: 1.1em; }


/* Works on Chrome, Edge, and Safari */
/*
*::-webkit-scrollbar {
  width: 12px;
}

*::-webkit-scrollbar-track {
  background: rgba(255,  255,  255, 0);
}

*::-webkit-scrollbar-thumb {
  background-color: rgba(255,  255,  255, 0);
  border-radius: 0px;
  border: 3px solid rgba(255,  255,  255, 0);
}
*/




@media (min-width: 768px) {
    .bd-placeholder-img-lg {
        font-size: 3.5rem;
    }
}

@font-face {
    font-family: Montserrat-Medium;
    src: url(../assets/fonts/Montserrat/Montserrat-Medium.ttf);
}

@font-face {
    font-family: DunbarText-Regular;
    src: url('../assets/fonts/Dunbar/DunbarText-Regular.eot?#iefix') format('embedded-opentype'), 
    url('../assets/fonts/Dunbar/DunbarText-Regular.woff') format('woff'), 
    url('../assets/fonts/Dunbar/DunbarText-Regular.woff2') format('woff2'), 
    url('../assets/fonts/Dunbar/DunbarText-Regular.ttf')  format('truetype');
}

@font-face {
    font-family: DunbarTall-Medium;
    src: url('../assets/fonts/Dunbar/DunbarTall-Medium.eot?#iefix') format('embedded-opentype'), 
    url('../assets/fonts/Dunbar/DunbarTall-Medium.woff') format('woff'), 
    url('../assets/fonts/Dunbar/DunbarTall-Medium.woff2') format('woff2'), 
    url('../assets/fonts/Dunbar/DunbarTall-Medium.ttf')  format('truetype');
}


.hidden { visibility: hidden; display: none; }




a.menu-link {
    color: var(--body-fg);
}

a.menu-link.selected {
     color: var(--pastel-orange);
}

a:hover.menu-link.selected {
    color: var(--pastel-red);
}


a:hover.menu-link {
    color: var(--pastel-orange);
}

a.question-link {
    color: var(--pastel-light-blue);
}

a:hover.question-link {
    color: var(--pastel-orange);
}


a { 
    text-decoration: none; 
    color: var(--bke-app-link);
}

a:hover {
    text-decoration: none; 
    color: var(--bke-app-link-hover);
}



.preview-image > a > img { border: 2px solid var(--stgf-bg); }
.preview-image > a:hover > img { 

    border: 2px solid var(--pastel-orange);
}


.top-round-rainbow {
    background: var(--white-1p0);
    border-radius: 4px;
    
    background-image: repeating-linear-gradient(to right,
    #c4e17f 0px, #c4e17f 50px,
    #f7fdca 50px, #f7fdca 100px,
    #fad071 100px, #fad071 150px,
    #f0766b 150px, #f0766b 200px,
    #db9dbe 200px, #db9dbe 250px,
    #c49cdf 250px, #c49cdf 300px,
    #6599e2 300px, #6599e2 350px,
    #61c2e4 350px, #61c2e4 400px);
    background-size: 100% 10px;
    background-repeat:no-repeat;
}


.fa-toggle-on { color: var(--pastel-green); }
.fa-toggle-off { color: var(--pastel-gray); }




.marquee {
    max-width: 100vw;
    white-space: nowrap;
    overflow: hidden;
    box-sizing: border-box;    
}

.marquee span {
    display: inline-block;
    padding-left: 100%;
    animation: marquee 30s linear infinite;
    vertical-align: top;
    margin: 1em 2px;
	color: var(--black-1p0);
}

.marquee span:hover {
    animation-play-state: paused 
}

.marquee a {
    color: var(--black-1p0);
}
.marquee a:hover {
    color: var(--pastel-orange);;
    text-decoration: underline;
    color: var(--black-0p7);
}

@keyframes marquee {
	0%   { transform: translateX(0); }
	100% { transform: translateX(-100%); }
}



input[type="input-search"] {
    border-width: 1px;
    border-radius: 0;
    background-color: var(--white-0p9);
    color: var(--black-1p0);
    border-color: var(--white-1p0);
    text-align: left;
}
input[type="input-search"]::placeholder {  
    text-align: center; 
} 
input[type="input-search"]:focus{
    box-shadow:0 0 0 .25rem var(--black-0p0);
    border-width: 1px;
    border-radius: 0;
    color: var(--black-1p0);
    background-color: var(--white-1p0);
}


input[type="input-location"] {
    border-width: 1px;
    border-radius: 0;
    background-color: var(--white-0p9);
    color: var(--black-1p0);
    border-color: var(--white-1p0);
    text-align: left;
}
input[type="input-location"]::placeholder {  
    text-align: center; 
} 
input[type="input-location"]:focus{
    box-shadow:0 0 0 .25rem var(--black-0p0);
    border-width: 1px;
    border-radius: 0;
    color: var(--black-1p0);
    background-color: var(--white-1p0);
}



 
/*
a > h1, 
a > h2, 
a > h3, 
a > h4, 
a > h5, 
a > h6 { 
    text-decoration: none; 
    color: var(--bke-app-link);
}

a:hover, 
a:hover > h6, 
a:hover > h5, 
a:hover > h4, 
a:hover > h3, 
a:hover > h2, 
a:hover > h1 {
    text-decoration: none; 
    color: var(--bke-app-link-hover);
}

a.selected > h6, 
a.selected > h5, 
a.selected > h4, 
a.selected > h3, 
a.selected > h2, 
a.selected > h1 { 
    color: var(--bke-app-link-hover);
}

a > h1.inverted, 
a > h2.inverted, 
a > h3.inverted, 
a > h4.inverted, 
a > h5.inverted, 
a > h6.inverted { 
    text-decoration: none; 
    color: var(--bke-dunkelblau);
}

a:hover > h6.inverted, 
a:hover > h5.inverted, 
a:hover > h4.inverted, 
a:hover > h3.inverted, 
a:hover > h2.inverted, 
a:hover > h1.inverted {
    text-decoration: none; 
    color: var(--bke-app-link-hover);
}


input[type="edit-setting"] {
  margin-bottom: -1px;
  border: 0;
  border-radius: 0;
  background-color: var(--bke-app-background);
  color: var(--bke-app-text);
  border-color: var(--bke-app-text);
  text-align: left;
}
input[type="edit-setting"]::placeholder {  
    text-align: left; 
} 
input[type="edit-setting"]:focus{
    box-shadow:0 0 0 .25rem rgba(0, 0, 0, 0);
    border: 0;
    border-radius: 0;
    background-color: var(--bke-app-text);
    color: var(--bke-app-background);

}
*/


/* Button */
.btn-strgf-green {
  border-width: 2px;
  border-radius: 20px;
  background-color: var(--green);
  color: var(--white-1p0);
  font-size: 1.5rem;
}

.btn-strgf-green:hover{
    color: #000;
    background-color: var(--pastel-orange);
}

.btn-strgf-green.selected{
    color:var(--bke-app-text);
    background-color:var(--bke-app-link-hover);
}


.btn-strgf-green.active,
.btn-strgf-green:active{
    color:var(--bke-app-text);
    background-color:var(--bke-app-link-hover);
}

.btn-strgf-green.active:focus,
.btn-strgf-green:active:focus{
    box-shadow:0 0 0 .25rem var(--black-0p0);
}

.btn-strgf-green:focus{
    box-shadow:0 0 0 .25rem var(--black-0p0);
}

.btn-strgf-green.disabled,
.btn-strgf-green:disabled{
    color:gray;
    background-color:gray;
}





/* Button */

.btn-waterman-menu {
  border-width: 0px;
  border-radius: 0px;
  background-color: rgba(0, 0, 0, 0);
  color: #fff;
  border-color: rgba(0, 0, 0, 0);
  font-size: 1.5rem;
}

.btn-waterman-menu:hover{
    color:var(--bke-orange);
    background-color:var(--bke-mittelblau);
    border-color:var(--bke-mittelblau);
}

.btn-waterman-menu.selected{
    color:var(--bke-hellblau);
    background-color:var(--bke-orange);
    border-color:var(--bke-hellblau);
}


.btn-waterman-menu.active,
.btn-waterman-menu:active{
    color:var(--bke-orange);
    background-color:var(--bke-mittelblau);
    border-color:var(--bke-mittelblau);
}

.btn-waterman-menu.active:focus,
.btn-waterman-menu:active:focus{
    box-shadow:0 0 0 .25rem rgba(0, 0, 0, 0);
}

.btn-waterman-menu:focus{
    box-shadow:0 0 0 .25rem rgba(0, 0, 0, 0);
}

.btn-waterman-menu.disabled,
.btn-waterman-menu:disabled{
  background-color: var(--bke-mittelblau);
  color: var(--bke-hellblau);
  border-color: var(--bke-mittelblau);
}



/* Button */
/*
.btn-whatsfree-link {
  border-width: 0px;
  border-radius: 0px;
  background-color: var(--bke-dunkelblau);
  color: var(--bke-hellblau);
  border-color: var(--bke-dunkelblau);
  font-size: 1.5rem;
}

.btn-whatsfree-link:hover{
    color:var(--bke-orange);
    background-color:var(--bke-dunkelblau);
    border-color:var(--bke-dunkelblau);
}

.btn-whatsfree-link.selected{
    color:var(--bke-hellblau);
    background-color:var(--bke-orange);
    border-color:var(--bke-dunkelblau);
}


.btn-whatsfree-link.active,
.btn-whatsfree-link:active{
    color:var(--bke-orange);
    background-color:var(--bke-dunkelblau);
    border-color:var(--bke-dunkelblau);
}

.btn-whatsfree-link.active:focus,
.btn-whatsfree-link:active:focus{
    box-shadow:0 0 0 .25rem rgba(0, 0, 0, 0);
}

.btn-whatsfree-link:focus{
    box-shadow:0 0 0 .25rem rgba(0, 0, 0, 0);
}

.btn-whatsfree-link.disabled,
.btn-whatsfree-link:disabled{
  background-color: var(--bke-dunkelblau);
  color: var(--bke-hellblau);
  border-color: var(--bke-dunkelblau);
}
*/





/* Button */
/*
.btn-small {
    font-size: 1rem;    
}

.btn-small:focus {
    box-shadow:0 0 0 .25rem rgba(0, 0, 0, 0);
    box-shadow:0 0 0 .25rem rgba(0, 0, 0, 0);
}
*/


.btn {
    text-transform: uppercase;
}

.btn-square {
    width: 100px !important;
    max-width: 100% !important;
    max-height: 100% !important;
    height: 100px !important;
    text-align: center;
    padding: 0px;        
}

.fill-primary {
    fill:#0d6efd;
}