@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,700&display=swap');

html, body { margin: 0; font-family: 'Open Sans', sans-serif; background: #EBE6DC;}

#header { background: #fff;}
#header .container { height:50vh;}

#header #topbar { text-align: right; }

#header #logo { text-align:center; }
#header #logo img { width:80%;  }

#body { font-size:20pt; text-align:center;  height:50vh; padding:0; }
#body a { color: #000; text-decoration:none;}
#body h3 { color: #14A532; font-size:100%;}

.bar { background:#14A532; height:15px; margin-bottom:120px;}
.bar .inner { background:#69BEA5; height:15px; width: 40%; float:left;}
.container { position: relative; }
.tree { background:url('../gfx/baum.svg') no-repeat center bottom; background-size:100% auto; width: 180px; height: 210px; position: absolute; right: 10%; bottom:-15px;}

/* +----------------------------------------------------------------------- */
/* | Media Queries
/* +----------------------------------------------------------------------- */

/* #Media Queries
================================================== */

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 1279px) {
	
}

@media only screen and (min-width: 960px) and (max-width: 1279px) {

}

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (min-width: 1024px) {
}

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 1024px) {
	
}

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {
	#header .container { height:35vh;}

}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 667px) and (max-width: 959px) {
	
	
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
	
	#topbar { font-size:10pt;}
	#header .container { height:40vh;}
	#header #logo img { width: 100%; }
	.tree { width: 100px; height:117px; }
	.bar { margin-bottom: 20px;}

}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
	
}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
	
}

@media only screen and (max-width: 1000px) {

}