@charset "UTF-8";
/**
 * Foundation for Sites
 * Version 6.7.5
 * https://get.foundation
 * Licensed under MIT Open Source
 * app.css
 * bariatrie-lachen.ch
 */

/* *****************************************************************************
PAGE --- #00B685; #009FE3; #145369;
***************************************************************************** */
body { background-color: #FFFFFF; color: #145369; }

.grid-container { max-width: 60% }
@media screen and (max-width: 640px) {
	.grid-container { max-width: 100% }
	}
@media screen and (min-width: 641px) and (max-width: 1440px) {
	.grid-container { max-width: 100% }
	}


/* *****************************************************************************
FONTS
***************************************************************************** */
h1, h2, h3, h4, p, li, a, body { font-family: 'Quicksand', sans-serif, Verdana, sans-serif; }


/* *****************************************************************************
TOP BAR
***************************************************************************** */
.sticky-topbar { width: 100%; }

a.topbar_backbutton { background-color: #00aeef; }
a.topbar_backbutton:hover { background-color: #0093C8; }
a.topbar { color: #FFFFFF; background-color: #FFFFFF; }
a.topbar:hover { color: #FFFFFF; background-color: #B3D5E4; }
.stylewidth { width: 100% }
@media screen and (max-width: 640px) {
	a.topbar { color: #FFFFFF; background-color: #FFFFFF; }
	a.topbar:hover { color: #FFFFFF; background-color: #B3D5E4; }
	.stylewidth { width: 100% }
	}
@media screen and (min-width: 641px) and (max-width: 1440px) {
	a.topbar { color: #FFFFFF; background-color: #FFFFFF; }
	a.topbar:hover { color: #FFFFFF; background-color: #B3D5E4; }
	.stylewidth { width: 100% }
	}

.title-bar { color:#FFFFFF; background-color: #267296; }
.top-bar { background-color: #FFFFFF; color:#FFFFFF; padding:0; }
.top-bar ul { background-color: #FFFFFF; }

.top-bar-left { max-width: 30% }


/* *****************************************************************************
MAIN SECTION
***************************************************************************** */
.textcenter { text-align: center !important; }
.textright { text-align: right !important; }
.textleft { text-align: left !important; }
@media screen and (max-width: 640px) {
	.textcenter { text-align: center !important; }
	.textright { text-align: left !important; }
	.textleft { text-align: right !important; }
	}
@media screen and (min-width: 641px) and (max-width: 1440px) {
	.textcenter { text-align: center !important; }
	.textright { text-align: left !important; }
	.textleft { text-align: left !important; }
	}


/* *****************************************************************************
FOOTER
***************************************************************************** */
.bala_footer {
  background-color: #D9F1FB;
  color: #00926B;
}


/* *****************************************************************************
BUTTONS
***************************************************************************** */
.button {
  margin: 0;
  color: #FFFFFF;
  font-weight: normal;
  text-align: left;
  border: 0.01rem solid #D9F1FB; }
  .button.balamain {
		padding: 1.25rem;
		font-size: 1.25rem;
    background-color: #FFFFFF;
    color: #00926B; }
    .button.balamain:hover, .button.balamain:focus {
			background-color: #B3D5E4; }
  .button.fussbereich {
		border: 0;
		padding-left: 0;
		padding-right: 0;
    background-color: #A1C6E6;
    color: #FFFFFF; }
    .button.fussbereich:hover, .button.fussbereich:focus {
      background-color: #8DAECA; }
  .button.balalogin {
		border: 0;
		padding: 1.25rem;
		font-size: 1.25rem;
    background-color: #00B685;
    color: #FFFFFF; }
    .button.balalogin:hover, .button.balalogin:focus {
      background-color: #009F74; }
  .button.balapraesentationen {
		border-width: 0.75rem;
		border-color: #26ADE7;
		padding: 1.25rem;
		font-size: 1.25rem;
    background-color: #FFFFFF;
    color: #1F92C3; }
    .button.balapraesentationen:hover, .button.balapraesentationen:focus {
			background-color: #B3D5E4;
	    color: #FFFFFF; }


.grid-container.hero{ max-width: 100% }


.hero-section {
  background: url('/img/2023-01-08_Lachen_DSC_0160 (Custom).JPG') 50% no-repeat;
  background-size: cover;
  height: 80vh;
  text-align: center;
  display: flex;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.hero-section .hero-section-text {
  color: #FF8000;
  color: #D0FFF3;
	font-size: 5.0vw;
  text-shadow: 0.3vw 0.3vw 0.3vw #000000;
	}
@media screen and (max-width: 640px) {
	.hero-section .hero-section-text {
		font-size: 10.0vw;
	  text-shadow: 0.4vw 0.4vw 0.4vw #000000;
		}
@media screen and (min-width: 641px) and (max-width: 1920px) {
	.hero-section .hero-section-text {
		font-size: 8.0vw;
	  text-shadow: 0.3vw 0.3vw 0.3vw #000000;
		}