@charset "UTF-8";
/* media CSS */


/*Medie Queries
############################################################################*/
@media only screen and (min-width: 1000px) {
	
}

@media only screen and (max-width: 1500px) {
	/* TYPO */
	#header h1 {
		font-size: 7.2em;
	}
	#main h1 {
		font-size: 5.1em;
	}
	#main h2,
	#main h3,
	#footer h1,
	#footer p,
	#sub-nav ul > li > a,
	#sub-nav > ul > li:before,
	input, textarea {
		font-size: 2.4em;
	}
	#main p, #main ul, #main h4,
	#main ul li:before,
    #nav ul > li > a {
		font-size: 2em;
	}
	
	/* PROPORTIONS */
	/* container */
	.inside {
		width: 90em;
	}
	#wrapper {
		/*padding-top: 12.6em;*/
		background-size: 39.5em;
	}
	.ornament {
		background-size: 68em;
	}
	
	/* header */
	#header {
		/*margin-bottom: 3.4em;*/
        margin-bottom: 5.4em;
	}
	.header-top {
		margin-top: -1.5em;
		margin-right: -5.2em;
	}
	.header-top .logo {
		width: 12.4em;
	}
	.header-bottom {
		width: 55em;
	}
	.header-bottom h1 {
		bottom: 2.5em;
		left: 6.1em;
	}
	#nav {
		margin-bottom: 9em;
	}
	#nav ul > li {
		margin-right: 2.4em;
	}
	
	/* main */
	#main {
		padding-bottom: 20em;
	}
	.content-flex .flex-left {
		width: 16em;
	}
	.content-flex .flex-right {
		width: 30em;
	}
	form {
		margin: 4.5em 0;
	}
	
	/* footer */
	#footer {
		padding-top: 4.5em;
        padding-bottom: 4.5em;
	}
	.footer-top, .footer-bottom {
		padding: 0 3em;
	}
}

@media only screen and (max-width: 1120px) { /* TABLET */
	/* TYPO */
	#header h1 {
		font-size: 6em;
	}
	#main h1 {
		font-size: 4.4em;
	}
	#main h2,
	#main h3,
	#footer h1,
	#footer p,
	#sub-nav ul > li > a,
	#sub-nav > ul > li:before,
	input, textarea {
		font-size: 2em;
		line-height: 1.3em;
	}
	#nav ul > li > a {
		font-size: 1.8em;
	}
	#main p, #main ul, #main h4,
	#main ul li:before {
		font-size: 1.8em;
		line-height: 1.3em;
		-webkit-hyphens: auto;
		-moz-hyphens: auto;
		-ms-hyphens: auto;
		hyphens: auto;
	}
    #main .flex-three .item p {
        font-size: 1.5em;
    }
	
	/* PROPORTIONS */
	/* container */
	.inside {
		width: 75em;
	}
	#wrapper {
		/*padding-top: 10.9em;*/
		background-size: 32.8em;
	}
	.ornament {
		background-size: 56.7em;
	}
	
	/* header */
	#header {
		/*margin-bottom: 2.8em;*/
        margin-bottom: 4.8em;
	}
	.header-top {
		margin-top: -1.2em;
		margin-right: -4.3em;
	}
	.header-top .logo {
		width: 10.4em;
	}
	.header-bottom {
		width: 46em;
	}
	.header-bottom h1 {
		left: 6.15em;
	}
	#nav {
		margin-bottom: 7.5em;
	}
	#nav ul > li {
		margin-right: 2em;
	}
	
	/* main */
	#main {
		padding-bottom: 16.5em;
	}
	.content-flex .flex-left {
		width: 15em;
	}
	.content-flex .flex-right {
		width: 25.5em;
	}
	form {
		margin: 4em 0;
	}
	
	/* footer */
	#footer {
		padding-top: 4em;
        padding-bottom: 4em;
	}
	.footer-top, .footer-bottom {
		padding: 0 2.7em;
	}
}

@media only screen and (max-width: 980px) { /* FLUID RESPONSIVE NAV */
	.inside {
		width: 100%;
		padding: 0 8em;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	/*#nav {
		display: none;
	}
	.open-nav,
	#responsive-nav {
		display: block;
	}*/
	#wrapper {
		padding-top: 3em;
		background-size: 28em;
	}
	.ornament,
	#responsive-nav {
		background-size: 50em;
	}
	
	/* TYPO */
	#header h1 {
		font-size: 5em;
	}
	#main h1 {
		font-size: 4em;
	}
	#main h2,
	#main h3,
	#footer h1,
	#footer p,
	#sub-nav ul > li > a,
	#sub-nav > ul > li:before,
	input, textarea {
		font-size: 2em;
		line-height: 1.3em;
	}
	
	/* header */
	#header {
		flex-direction: column;
		justify-content: flex-start;
		margin-bottom: 4.5em;
	}
	.header-top {
		width: 100%;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: flex-start;
		flex-wrap: wrap;
		margin-top: 0;
		margin-right: 0;
	}
	.header-bottom {
		width: 38em;
		margin-top: -4.5em;
	}
	.header-bottom h1 {
		left: 6.05em;
	}
	
	/* main */
	#main {
		padding-bottom: 14.5em;
	}
	form {
		margin: 4em 0;
	}
	
	/* footer */
	.footer-top, .footer-bottom {
		padding: 0;
	}
}

@media only screen and (max-width: 880px) {
	.content-flex .flex-left {
		width: 15em;
		margin-bottom: 3em;
	}
	.content-flex .flex-right {
		width: 38em;
	}
	.content-flex .vita {
		display: none;
	}
	.vita.mobile-only {
		display: block !important;
		margin-top: 3em;
	}
	
	.table-vita .flex {
		flex-direction: column;
	}
	.table-vita .flex .year {
		width: 100%;
		margin-bottom: 0.5em !important;
	}
	.table-vita .flex .text {
		width: 100%;
		margin-bottom: 2em !important;
	}
	.table-vita .flex .text br {
		display: none;
	}
}

@media only screen and (max-width: 740px) {
	/* MARGIN */
	.inside {
		padding: 0 4em;
	}
	#responsive-nav ul {
		padding: 3em 3em 3em 4em;
	}
	.close-nav {
		margin: 4em 0 0 4em;
	}
}

@media only screen and (max-width: 680px) {
	/* TYPO */
	#header h1 {
		font-size: 4.2em;
	}
	#main h1 {
		font-size: 3.5em;
	}
    
    /* main */
    .list-termine .post .inside {
        flex-direction: column;
        justify-content: flex-start;
    }
    .list-termine .post .inside .content {
        width: 100%;
    }
    .list-termine .post .inside .date {
        display: none;
    }
	
	/* header */
	.open-nav {
		margin-top: 1em;
	}
	.header-top .logo {
		width: 9em;
	}
	.header-bottom {
		width: 32em;
		margin-top: -4.5em;
	}
	.header-bottom h1 {
		left: 6.05em;
	}
}

@media only screen and (max-width: 580px) {
	/* container */
	.ornament,
	#responsive-nav {
		background-size: 42em;
	}
	#main {
		padding-bottom: 12em;
	}
	
	/* header */
	#header h1 {
		font-size: 3.8em;
	}
	.open-nav {
		margin-top: 1em;
	}
	.header-top .logo {
		width: 8em;
	}
	.header-bottom {
		width: 25em;
		margin-top: -3em;
	}
	.header-bottom h1 {
		left: 5.05em;
	}
    
    /* main */
    .flex-three,
    .flex-four {
        flex-direction: column;
        justify-content: flex-start;
    }
    .flex-three .item,
    .flex-four .item {
        width: 100%;
        margin-bottom: 2em;
    }

	
	/* footer */
	.footer-top {
		flex-direction: column;
		justify-content: flex-start;
	}
	#sub-nav {
		display: none;
	}
    #responsive-nav ul > li.mobile-only {
		display: block !important;
	}
    #responsive-nav ul > li:nth-child(8) {
		margin-top: 4em;
	}
	/*#responsive-nav ul > li:nth-child(7),
	#responsive-nav ul > li:nth-child(8) {
		display: block;
	}*/
}

@media only screen and (max-width: 500px) {
	/* MARGIN */
	#wrapper {
		padding-top: 2.5em;
	}
	.inside {
		padding: 0 2.5em;
	}
	#responsive-nav ul {
		padding: 3em 3em 3em 2.5em;
	}
	.close-nav {
		margin: 4em 0 0 2.5em;
	}
	
	/* header */
	#header h1 {
		font-size: 3em;
	}
	.open-nav {
		margin-top: 1em;
	}
	.header-top .logo {
		width: 7.5em;
	}
	.header-bottom {
		width: 20em;
	}
	.header-bottom h1 {
		left: 5.1em;
		bottom: 2.3em;
	}
}

@media only screen and (max-width: 420px) {
	/* container */
	.ornament,
	#responsive-nav {
		background-size: 35em;
	}
	
	/* header */
	.open-nav {
		margin-top: 3em;
	}
	.header-bottom {
		margin-top: 2.5em;
	}
	
	/* main */
	.content-flex {
		flex-direction: column-reverse;
		justify-content: flex-start;
	}
	.content-flex .flex-right {
		width: 100%;
	}
	.content-flex .flex-left {
		margin-top: -1.5em;
		width: 20em;
	}
	
}

@media only screen and (max-width: 380px) {
	/* MARGIN */
	#wrapper {
		padding-top: 2em;
		background-size: 23em;
	}
	.inside {
		padding: 0 2em;
	}
	#responsive-nav ul {
		padding: 3em 3em 3em 2em;
	}
	.close-nav {
		margin: 4em 0 0 2em;
	}
	.ornament,
	#responsive-nav {
		background-size: 28em;
	}
	
	/* header */
	#header h1 {
		font-size: 2.4em;
	}
	.open-nav {
		margin-top: 3em;
	}
	.header-top .logo {
		width: 7.5em;
	}
	.header-bottom {
		width: 18em;
	}
	.header-bottom h1 {
		left: 5.95em;
		bottom: 2.8em;
	}
	
	/* main */
	.content-flex .flex-left {
		width: 18em;
	}
}