/*
Theme Name: LOLY
Theme URI: https://zummedium.ch/
Description: Dieses Theme wurde extra für da
Author: Loïc Etter, modified Jürg Wenger
Author URI: https://zummedium.ch
*/

 @import url('https://fonts.googleapis.com/css?family=Open+Sans|Raleway');
 @import url('https://fonts.googleapis.com/css?family=Quicksand');

body  {
  color: #333;
   /*background: #e5e5e5;*/
   background: #edeef4;
   font-family: 'Quicksand', sans-serif;
}
/*suche*/
.search-field {
  font-size: 1.2em;
   border: 1px solid;
   color: #113E7A;
   font-family: inherit;
   font-weight:300;
}
.screen-reader-text {
  display: none;
}
.search-submit {
  font-size: 1.2em;
  font-family: 'Quicksand', sans-serif;
  color: #FFFFFF;
  border: none;
  background-color: #113E7A;

}
html, body {
    height: 100%;
}

#wrapper  {
  /*width: auto;*/
  margin: auto;
  text-align: left;
  background: #edeef4;
  padding-bottom: 3em;
  position: relative;
  min-height: 100%;
  height: auto !important;
  height: 100%;
}
.container {
  width: 90%;
}
#header {
  height: auto;
  background-image: url("../../uploads/2018/04/89d81f7984113445682b5be0cf47d3f7_LOLY_Schrebergarten_Lyss.jpg");
  background-size: 100%;
  padding: 20px;
  border-bottom: 3px solid #113E7A;
}
/*Grid-System*/

@media only screen and (min-width: 700px) {
  /*Grid im Header*/
  #header {
    display: grid;
    grid-template-columns: 1fr 2fr;
  }
  /*Grid im Body*/

 .row {
    display: flex;/*richtet Flexbox-Modell ein*/
    flex-direction: row;/*wie angeordnet Spalte/Zeile*/
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  body .col {
    -webkit-flex: 1;
    flex: 1;
    margin-left: 0.5em;
    margin-right: 0.5em;
  }
  body .col-2 {
    -webkit-flex: 1;
    flex: 1;
    flex-basis: 45%;
    margin-left: 0.5em;
    margin-right: 0.5em;
  }
  body .col-4 {
    -webkit-flex: 1;
    flex: 1;
    flex-basis: 22.5%;
    margin-left: 0.5em;
    margin-right: 0.5em;
  }
}
@media only screen and (max-width: 700px) {
  /*Grid im Header*/
  #header {
    display: grid;
    grid-template-columns: 1fr;
  }
  /*Grid im Body*/
  body .row {
    display: flex;/*richtet Flexbox-Modell ein*/
    flex-direction: row;/*wie angeordnet Spalte/Zeile*/
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  body .col {
    -webkit-flex: 1;
    flex: 1;
    flex-basis: 100%;
  }
  body .col-2 {
    -webkit-flex: 1;
    flex: 1;
    flex-basis: 100%;
  }
  body .col-4 {
    -webkit-flex: 1;
    flex: 1;
    flex-basis: 100%;
  }
}
/*Responsives iFrame*/
iframe {
  max-width: 100%;
}
.embed-container {
  position: relative;
  padding-bottom: 56.25%; /* ratio 16x9 */
  height: 0;
  overflow: hidden;
  width: 100%;
  height: auto;
}
.embed-container iframe {

  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
/* ratio 4x3 */
.embed-container.ratio4x3 {
  padding-bottom: 75%;
}
/*Beitragsüberschirft*/
h2 a  {
  font-family: 'Quicksand', sans-serif;
  font-style: normal;
  font-weight: 100;
  text-decoration: none;
  color: #113E7A;
}
h2  {
  font-family: 'Quicksand', sans-serif;
  font-style: normal;
  font-weight: 100;
  text-decoration: none;
  color: #113E7A;
}
a  {
  font-family: 'Quicksand', sans-serif;
  font-style: normal;
  font-weight: 100;
  text-decoration: none;
  color: #113E7A;
}
h1  {
  font-family: 'Quicksand', sans-serif;
  font-style: normal;
  text-decoration: none;
  color: #113E7A;
}
h3 {
  font-family: 'Quicksand', sans-serif;
  font-style: normal;
  text-decoration: none;
  color: #113E7A;
}
h4 {
  font-family: 'Quicksand', sans-serif;
  font-style: normal;
  text-decoration: none;
  color: #113E7A;
}
h5 {
  font-family: 'Quicksand', sans-serif;
  font-style: normal;
  text-decoration: none;
  color: #113E7A;
}

/*Navbar*/


.nav-menu {
  display: inline-block;
  background-color: rgba(255, 255, 255, 0.5);
  border-bottom: 5px solid #DDDDDD;
}
@media only screen and (max-width: 700px) {
  .nav-menu {
    display: block
  }
}
/*Logo*/
#header img {
  height: 3em;
  width: auto;
}
/*Menü*/
/*Menü*/
.main-navigation {
	clear: both;
	margin: 0 auto;
	max-width: 1080px;
	min-height: 45px;
	position: relative;
  float: right;
}

ul.nav-menu,
div.nav-menu > ul {
	margin: 0;
	padding: 0 40px 0 0;
}

.nav-menu li {
	display: inline-block;
	position: relative;
}
@media only screen and (max-width: 700px) {
  .nav-menu li {
    display: block;
    text-align: center;
  }
}

.nav-menu li a {
	color: #777777;
	display: block;
	font-size: 15px;
	line-height: 1;
	padding: 15px 20px;
	text-decoration: none;
}

.nav-menu li:hover > a,
.nav-menu li a:hover,
.nav-menu li:focus > a,
.nav-menu li a:focus {
	background-color: #113E7A;
	color: #ffff;
}

.nav-menu .sub-menu,
.nav-menu .children {
	background-color: #FFFFFF;
	border: 2px solid #f7f5e7;
	border-top: 0;
	padding: 0;
	position: absolute;
	left: -2px;
	z-index: 99999;
	height: 1px;
	width: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
}

.nav-menu .sub-menu ul,
.nav-menu .children ul {
	border-left: 0;
	left: 100%;
	top: 0;
}

ul.nav-menu ul a,
.nav-menu ul ul a {
	color: #999999;
	margin: 0;
	width: 200px;
}

ul.nav-menu  ul a:hover,
.nav-menu  ul ul a:hover,
ul.nav-menu ul a:focus,
.nav-menu ul ul a:focus {
	background-color: #113E7A;
}

ul.nav-menu li:hover > ul,
.nav-menu ul li:hover > ul
ul.nav-menu .focus > ul,
.nav-menu .focus > ul {
	clip: inherit;
	overflow: inherit;
	height: inherit;
	width: inherit;
  transition-delay: 15s;
-o-transition-delay: 15s;
-ms-transition-delay: 15s;
-moz-transition-delay: 15s;
-webkit-transition-delay: 15s;;}
/*aktiver Menüpunkt*/
.nav-menu .current_page_item > a,
.nav-menu .current_page_ancestor > a,
.nav-menu .current-menu-item > a,
.nav-menu .current-menu-ancestor > a {
	color: #123D7E;
  font-weight: bold;
  bottom: 5px solid #123D7E;
}

.menu-toggle {
	display: none;
}
/*Responsives Menü*/
/** Formatierung für mobile Ansicht **/

/** Navigation wird als vertikale Liste über die komplette Breite dargestellt **/

nav {
	display: block;
}



nav ul li {
	list-style: none;
}


/** Anpassungen Checkbox+Label (Button)

input#open-menu {
	display: none;
}

input[type=checkbox]:checked ~ nav {
    display: block;
}

label.open-menu-label {
	display: block;
  text-align: right;
  color: #113E7A;
}**/

#footer {/**Position**/
  padding-top: 15px;
  padding-bottom: 15px;
}

/** Formatierung für Tablet und Desktopansicht **/

@media only screen and (min-width: 760px) {

  #footer {/**Position**/
    position: static;
    bottom: 0px;
    padding-top: 15px;
    padding-bottom: 15px;
}

	/** Navigation wird als einfarbiger, horizontaler Balken dargestellt **/

	nav {
		display: block;
		text-align: center;
    width: 100%;
	}
	/** Label wird ausgeblendet **/
	label.open-menu-label {
		display: none;
	}
}
/*Archive.php*/
/*Karten*/
.card {
   /* Add shadows to create the "card" effect */
   box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
   transition: 0.3s;
   padding: 2px 2px;
}
 .card:focus {
    box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2);
}

.preface {
    padding: 2px 16px;
}
/*mehr lesen*/
.more-link {
    background-color: #113E7A; /* Green */
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
}
/**/
.entry, p {
  padding-right: 5pt;
  padding-left: 5pt;
}
#main {
  width: auto;
  padding: 1em;
  float: left;}
#sidebar  {
  width: 270px;
  padding: 10px;
  padding-top: 20px;
  float: left;
}


/**Fusszeile**/
#footer {
  clear: both;
  /**Höhe&Breite**/
  height: 2em;
  width: 100%;
  bottom: 0;
  background-color: #113E7A;
  color: #FFFFFFFF;
}
/**Spalten**/
@media only screen and (min-width: 700px) {
  .spalten {
      -webkit-column-count: 2;
      -moz-column-count: 2;
      column-count: 2;
  }
}
@media only screen and (max-width: 700px) {
  .spalten {
      -webkit-column-count: 1;
      -moz-column-count: 1;
      column-count: 1;
  }
}
@supports (-ms-ime-align:auto) {
  .listEntry:hover  {background-color:transparent}
}
/*.no-blue {
  font-family: 'Raleway', sans-serif; light', sans-serif;
  font-style: normal;
  font-weight: 100;
  text-decoration: none;
  color: #333;
}*/

/** Anpassungen Checkbox+Label (Button)
input#open-menu {
	display: none;
}

input[type=checkbox]:checked ~ nav {
    display: block;
}

label.open-menu-label {
	display: block;
  text-align: right;
  color: #113E7A;
}**/


button#responsive-menu-button {
    background: #113e7a;
}

.umbruch {
break-before: column;
break-after: avoid;
}


@media only screen and (min-width: 700px){
#header {
    position: sticky;
    top: 0;
    left: 0;
    width: 100%;
	height: auto;
	z-index: 10;
}
	.nav-loly {
		overflow: inherit;
	}}
@media only screen and (min-width: 760px){
#footer {
	position: fixed !important;
bottom: 0 !important;
left: 0 !important;
	}}
.wp-post-image {
	width: 25%;
	margin: 5pt;
	float: left;
	height: auto;
}
@media only screen and (max-width: 600px){
	nav {
		display:none;
	}
}
.nav-menu {
	margin: 15pt !important;
}
#header {
	padding: 0 !important;
}
.site-title {
	padding-left: 15px;
}

/** Anpassungen Checkbox+Label (Button)
input#open-menu {
	display: none;
}

input[type=checkbox]:checked ~ nav {
    display: block;
}

label.open-menu-label {
	display: block;
  text-align: right;
  color: #113E7A;
}**/


button#responsive-menu-button {
    background: #113e7a;
}

.umbruch {
break-before: column;
break-after: avoid;
}


@media only screen and (min-width: 700px){
#header {
    position: sticky;
    top: 0;
    left: 0;
    width: 100%;
	height: auto;
	z-index: 10;
}
	.nav-loly {
		overflow: inherit;
	}}
@media only screen and (min-width: 760px){
#footer {
	position: fixed !important;
bottom: 0 !important;
left: 0 !important;
	}}
.wp-post-image {
	width: 25%;
	margin: 5pt;
	float: left;
	height: auto;
}
@media only screen and (max-width: 600px){
	nav {
		display:block !important ;
	}
}
.nav-menu {
	margin: 15pt !important;
}
#header {
	padding: 0 !important;
}
.site-title {
	padding-left: 15px;
}
