@font-face {
font-family: 'Avenir';
	src: url('/fonts/avenir/Avenir.eot'); /* IE9 Compat Modes */
	src: url('/fonts/avenir/Avenir.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	     url('/fonts/avenir/Avenir.woff') format('woff'), /* Modern Browsers */
	     url('/fonts/avenir/Avenir.ttf')  format('truetype'), /* Safari, Android, iOS */
	     url('/fonts/avenir/Avenir.svg#svgFontName') format('svg'); /* Legacy iOS */
}

html, body { height:100%; width:100%; margin:0; padding:0; font-family:'Avenir', sans-serif; background-color: #2a5baa; }
body { height:100%; width:100%; margin:0; padding:0; font-weight:300; -webkit-font-smoothing: antialiased; -webkit-overflow-scrolling: touch; overflow-x: hidden; }

h1,h2,h3,h4,p,a,li { font-family:'Avenir'; color: #fff; }

a:hover { color: #fff; text-decoration: none; }
a:before,
a:after {
    -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
    -moz-transition: color 0.1s ease-in, background 0.1s ease-in;
    -ms-transition: color 0.1s ease-in, background 0.1s ease-in;
    -o-transition: color 0.1s ease-in, background 0.1s ease-in;
    transition: color 0.1s ease-in, background 0.1s ease-in;
}

.panel {  }
.sj, .lc { -webkit-clip-path: none; clip-path: none; }

.sj { background-color: #105032; -webkit-clip-path: polygon(0 0, 100% 0, 100% 90%, 0% 100%); clip-path: polygon(0 0, 100% 0, 100% 90%, 0% 100%); }
.lc { background-color: #2a5baa; }

.panel img { margin-top: 6%; }

.contacts { margin: 1em 0 0 0; }
.contacts h3 { margin:0 0 .75em 0; font-size: .85em; white-space: nowrap; }

.impressum { position:fixed; bottom:0; height: auto; background-color: #fff; width:100%; padding:.5em 0; font-size: .8em; z-index:10; }
.impressum a, .impressum span { color: #000; cursor:pointer; white-space: nowrap; }

.modal p, .modal a { font-size:.9em; color: #000; }
.modal small { font-size: .5em; }
.modal a.btn { color: #fff; }

/* col-sm- */
@media(min-width : 576px) {
	.sj { background-color: #105032; }
	.lc { background-color: #2a5baa; }

	.panel img { margin-top: 20%; }

	.contacts { margin: 2em 0 0 0; display:none; }
	.contacts h3 { margin:0 0 .5em 0; font-size: 1em; white-space: nowrap; }
}


/* col-md- */
@media(min-width : 768px) {
	.panel img { height:16em; margin-top:8%; }

	.contacts { margin: 2em 0 0 0; display: block; }
	.contacts h3 { margin:0 0 .75em 0; font-size: 1.15em;  }

	.impressum { padding:.5em; font-size: 1em; }

}

/* col-lg- */
@media(min-width:992px) {
	.panel { position: relative; height: 100%; width: 100%; padding-top:10%; background-color: #2a5baa; }
	.panel img {  }

	.sj { background-color: #105032; -webkit-clip-path: polygon(0 0, 100% 0%, 90% 100%, 0% 100%); clip-path: polygon(0 0, 100% 0%, 90% 100%, 0% 100%); z-index:2; }
	.lc { background-color: #2a5baa; -webkit-clip-path: polygon(10% 0, 100% 0%, 100% 100%, 0% 100%); clip-path: polygon(10% 0, 100% 0%, 100% 100%, 0% 100%); z-index: 1; }


	.contacts h3 { font-size: 1em;  }
}

/* col-xl- */
@media(min-width:1200px) {
	.contacts h3 { font-size: 1.5em; }
}

/* > col-xl- */
@media(min-width:1600px) {
	.panel img { margin-top:2%; }
	.contacts h3 { font-size: 2em; }
	.impressum { padding:.5em; font-size: 1.5em; }
}
