@font-face {
    font-family: 'fontin_sans_rgregular';
    src: url('fontin_sans_r_45b-webfont.eot');
    src: url('fontin_sans_r_45b-webfont.eot?#iefix') format('embedded-opentype'),
         url('fontin_sans_r_45b-webfont.woff') format('woff'),
         url('fontin_sans_r_45b-webfont.ttf') format('truetype'),
         url('fontin_sans_r_45b-webfont.svg#fontin_sans_rgregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'LigatureSymbols';
    src: url('LigatureSymbols-2.11.eot');
    src: url('LigatureSymbols-2.11.eot?#iefix') format('embedded-opentype'),
         url('LigatureSymbols-2.11.woff') format('woff'),
         url('LigatureSymbols-2.11.ttf') format('truetype'),
         url('LigatureSymbols-2.11.svg#LigatureSymbols') format('svg');
    src: url('LigatureSymbols-2.11.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

html {
  	height: 101%;
	background: #c9d4f2;
}
body {
	color: #000; 
    font-family: Calibri, Verdana, Helvetica, sans-serif;
	background: #c9d4f2;
	font-size: 100%;		
}

html>body {
	font-size: 16px;
}


.menu-btn {
	display: none;
}

a:link {
	color: #005DA8;
	text-decoration: none;
}

a:visited {
	color: #005DA8;
	text-decoration: underline;
}

a:focus {
    outline: none;
}

/* #header a:link {
	text-decoration: underline;
} */
#wrapper a:hover {
	text-decoration: underline;
	color: #FF9B00;
}

p, a, li {
	font: 1rem/1.5rem Calibri, Verdana, sans-serif;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

h1 {
	font: 1.75rem/0.9rem fontin_sans_rgregular, Georgia, "Times New Roman", Times, serif;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	 color: #005DA8;
}

h2 {
	font: 1.5rem/1.5rem fontin_sans_rgregular, Georgia, "Times New Roman", Times, serif;
	margin-top: 1em;
	margin-bottom: 0em;
	color: #005DA8;
	letter-spacing: 0.1rem;
}

h3 {
	font: 1.33rem/1.13rem fontin_sans_rgregular, Georgia, "Times New Roman", Times, serif;
	margin-top: 1.13em;
	margin-bottom: 0em;
	letter-spacing: 0.1rem;
	 color: #005DA8;
}

h4 {
	font: 1.17rem/1.29rem fontin_sans_rgregular, Georgia, "Times New Roman", Times, serif;
	margin-top: 1.29em;
	margin-bottom: 0em;
	 color: #005DA8;
}

.kontakt p,
.kontakt a,
#navmain li,
#navmain a,
.ce_toplink a{
	font-family: fontin_sans_rgregular, Georgia, "Times New Roman", Times, serif;	
	color: #005DA8;
	font-size: 100%;
    letter-spacing: 0.1rem;
    line-height: 1.2rem;   
}

.textbox p, .textbox li, .textbox a {
	font-size: 92%;
}

.textbox p {
	padding: 0.5em 0em;
}

.ce_toplink a{ 
	text-decoration: none;
}

.textbox a {
	text-decoration: underline;
}

img, a img {
	border: 0;
}

#wrapper {
	margin: 0 auto;	
	width: 100%;
	overflow: hidden;
}

#header{
	background: #fff;
	width: 100%;
	height: auto;
	border-bottom: 1px solid rgba(0, 0, 0, 0.4);
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.9);
}

figure.print{
	display: none;
}

#header .inside{
	overflow: hidden;
	width: 100%;
	max-width: 1024px;
	margin: 0 auto;
	padding: 0.3em 0.3em 0em;
} 

.logo img{
	width: 100%;
	max-width: 247px;
	height:auto;
}

.logo h1{
	font-size: 100%;
	margin-top: 0.2em;
}

.kontakt p.phone {
    background: transparent url("../img/phone.gif") no-repeat 0% 50%;
	padding: 0 0 0 2em;
}

.kontakt a.email {
    background: url("../img/email.gif") no-repeat scroll 0 0 transparent;
    color: #005DA8;
    padding: 0 1em 0 2em;
}

#container {
	max-width: 1600px;
    width: 100%;
	margin: 0 auto;
}

.story {
	margin-top: 2em;
	padding-bottom: 2em;
    background: none repeat scroll 0 0 #fff;
    border-bottom: 1px solid rgba(0, 0, 0, 0.4);
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
  
}

.story h1 {
	font-size: 100%;
	margin-bottom: 0em;
	padding-left: 0.7em;
	letter-spacing: 0.1rem;
}

#index .story h1 {
	display: none;
}

.textbox h2{
   font-size: 130%;
}

.textbox h3,
.textbox h4,
.textbox strong{
   font-size: 100%;
   font-weight: normal;
   font-style: normal;
   color: #005DA8;
}

.textbox address{
   font-size: 100%;
   font-weight: normal;
   font-style: normal;
}

.textbox p,
.textbox li,
.textbox h2,
.textbox h3,
.textbox h4,
.textbox address,
.ce_toplink a{
	padding-left: 0.5em;
}
.textbox li {
	list-style-position: inside;
    list-style-type: disc;
  	margin: 0em;
}

.ce_toplink  {
	margin-top: 2em;
} 

.ce_toplink a:before {
  font-family: 'LigatureSymbols';
  -webkit-text-rendering: optimizeLegibility;
  -moz-text-rendering: optimizeLegibility;
  -ms-text-rendering: optimizeLegibility;
  -o-text-rendering: optimizeLegibility;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -ms-font-smoothing: antialiased;
  -o-font-smoothing: antialiased;
  font-smoothing: antialiased;
}

.ce_toplink a:before  {
	content:"\E00e";
	font-size: 120%;
	padding-right: 0.2em;
}

.textbox address span{
	font-size: 95%;	
}

.textbox address span.org{
	font-size: 100%;
	line-height: 1.5em;
 }
 
.textbox address a.url{
	display: block;
	margin: 0;
	padding-top: 1em;
 }
 
 .textbox address a.email{
	display: block;
	padding-bottom: 0.5em;
	margin: 0;
 }
 
@media only screen and (min-width : 320px) and (max-width : 600px){

#top:target a.open {
	display: none;
}

#top:target a.close {
	display: block;
}

#top:target #navmain {
	height: 8.25em;
}

#top:target header[role="banner"],
#top:target .menu-btn {
	margin-top: 8.25em;
}

#index:target article,
#leistung:target article,
#kunden:target article,
#impressum:target article {
	top: 8em;
}

article {
    right: 0.3em;
}

}

@media only screen and (min-width : 320px){


#header .inside {
	width: 97%;
}

.logo h1 {
	font-size: 134.2%;
}

#kontakt a,
#kontakt p{
	float: left;
	display: block;
	background-size: contain;
   font-size: 100%;
   margin: 0.2em;
}

#navmain {
	background: #005DA8;
    height: 0.3em;
    left: 0;
    margin: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 100%
}

.menu-btn {
	display: block;
	position: absolute;
	top: 0.5em;
	right:0.5em;
}

.menu-btn a {
	display: block;
	height: 2.5rem;
	width: 2.5rem;
	font-size: 0px;
	background: #005DA8 url(../img/nav.png) 50% 50% no-repeat;
}

a.open {
	display: block;	
}

a.close {
	display: none;	
}

#navmain,
header[role="banner"],
.menu-btn,
header .inside,
#main .inside {
	transition: 2s;
}

#navmain ul {
	overflow: hidden;
	padding-top: 0.3em;
}

#navmain li {
	float: left;
	width: 49%;
	margin: 0;
	border-bottom: 1px dashed #fff;
} 

#navmain li:nth-last-child(-n+2) {
	border-bottom: none;
}  

#navmain li:nth-child(2n+1){
	border-right: 1px dashed #fff;
}

#navmain li a{
	display: block;
	height: 3em;
	padding: 0.5em 1em;
	letter-spacing: 0.1em;
	line-height: 3em;
	text-transform: uppercase;
	color: #fff;
	margin: 0;
}


.story, .dust, .landkarte, .leistung, .impressum {
    clear: both;
	height: auto;
	width: 100%;
    margin: 0 auto;
    padding: 0;
}
.story {
    background:#FAF9F7;
    position: relative;
    z-index: 100;
}

.landkarte {
	min-height: 85em;
	width: 100%;
}
.leistung {
	min-height: 75em;
	width: 100%;
}

.dust {
	min-height: 74em;
	width: 100%;
}

.impressum {
	min-height: 200em;
	width: 100%;
}

#first {
    background: url("../img/start_b.jpg") repeat fixed 50% 0 transparent;
}
#second {	
    background: url("../img/leistung.jpg") repeat fixed 50% 0 #B3AC9E;
}
#fourth {
    background: url("../img/impressum_b3.jpg") repeat fixed 50% 0 #FFFFFF;
}
#third {
    background: url("../img/referenz_b.jpg") repeat fixed 50% 0 #DDDCD8;
}
.landkarte {
    background: url("../img/start.png") repeat fixed 50% 0 transparent;
}

.dust {
    background: url("../img/referenz_a.png") repeat fixed 0 0 transparent;
}
.impressum {
    background: url("../img/impressum_a3.png") repeat fixed 50% 0 transparent;
}

article {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid rgba(150, 150, 150, 0.1);
    box-shadow: 0 0 25px rgba(0, 0, 0, 0.3);
    color: #000000;
    height: auto;
    opacity: 0.9;
    padding: 0.5em;
    position: absolute;
    width: auto;
	left: 0.3em;
    top: 1em;
}


}/* ende @media */

@media only screen and (min-width : 480px) {

.landkarte {
	min-height: 64em;
	width: 100%;
}
.leistung {
	min-height: 63em;
	width: 100%;
}

.dust {
	min-height: 65em;
	width: 100%;
}

.impressum {
	min-height: 148em;
	width: 100%;
}

}/* ende @media */


@media only screen and (min-width : 600px) and (max-width : 768px)  {

#top:target header[role="banner"]{
	margin-top: 0em;
}

#top:target a.open {
	display: none;
}

#top:target a.close {
	display: block;
}

#top:target #navmain {
	height: 8.25em;
}

#top:target .menu-btn {
	margin-top: 8.25em;
}

#top:target header .inside{
	margin-top: 8em;
}

#index:target article, 
#leistung:target article, 
#kunden:target article, 
#impressum:target article {
    top: 11em;
}

#top:target #main .inside {
	margin-top: 8.25em;
}

}


@media only screen and (min-width : 600px) {

#header {
    background: none repeat scroll 0 0 #FFFFFF;
    border-bottom: 1px solid rgba(0, 0, 0, 0.4);
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.9);
    height: auto;
    position: fixed;
    width: 100%;
    z-index: 300;
}
#header .inside {
    color: #005DA8;
    margin: 0.8em auto 0;
    overflow: hidden;
    width: 97%;
}

.logo {
    float: left;
    margin-right: 5em;
}
.logo img {
    width: 85%;
}
.logo h1 {
    font-size: 16px;
    font-weight: normal;
    letter-spacing: 1.1px;
    margin-top: 0em;
} 

.kontakt {
	overflow: hidden;
    margin-top: 0em;
}

#kontakt a,
#kontakt p {
	 background-size: auto auto;
    font-size: 92%;
	margin: 0.5em 0em;
    padding-left: 2.2em;
    padding-right: 0.5em;
}

#kontakt p { 
	padding-right: 0;
}

#main .inside {
	margin-top: 6em; 
}

.landkarte {
	min-height: 54.5em;
	width: 100%;
}
.leistung {
	min-height: 61em;
	width: 100%;
}

.dust {
	min-height: 63em;
	width: 100%;
}

.impressum {
	min-height: 127em;
	width: 100%;
}

article {
	font-size: 100%;
}


}/* ende @media */


@media only screen and (min-width : 768px) {

.menu-btn,
.ce_toplink  {
	display: none;
}

#navmain,
header[role="banner"],
.menu-btn,
header .inside,
#main .inside {
	transition: none;
}

#nav #navmain {	
	float: right;
	position: static;
	height: auto;
	width: auto;
    margin-top: 0.2em;
    overflow: hidden;
	background: none;
}
#nav #navmain  ul {
    overflow: hidden;
	padding: 0;
}
#nav #navmain  li {
    border-left: 1px solid #005DA8;
    float: left;
    font-size: 100%;
    font-weight: 400;
    letter-spacing: 1.1px;
    width: auto;
}
#nav #navmain  li.first {
    border: medium none;
}
#nav #navmain li.last a {
	padding-right: 0em;

}

#nav #navmain li  a {
    color: #005DA8;
    text-decoration: none;
	text-transform: none;
	display: inline;
	line-height: 0em;
}
#nav #navmain  a.nav:hover{
    text-decoration: underline;
}
 
.current,  
#nav #navmain .current a {
	text-decoration: underline;
}

.kontakt {
    float: right;
	overflow: hidden;
	margin-top: 1em;
}

.kontakt p, 
.kontakt a {
    float: left;
    font-size: 16px;
}

.landkarte {
	min-height: 51.5em;
	width: 100%;
}
.leistung {
	min-height: 58em;
	width: 100%;
}

.dust {
	min-height: 60em;
	width: 100%;
}

.impressum {
	min-height: 140em;
	width: 100%;
}


.links {
    float: left;
}
.rechts {
    float: right;
}
#leistung .rechts {
    position: absolute;
    top: 40px;
    right: 20px;
}

article {	
	top: 9em;
}

.textbox {
    width: 45%;
}

.textbox.links {
    margin-right: 2em;
}

#kunden .ce_toplink {
	margin-top: 31em; 
}

#impressum .ce_toplink {
	margin-top: 34em; 

}

#leistung .textbox.links {
	margin-bottom: 1em;
}


}/* ende @media */

@media only screen and (min-width : 1020px) and (max-width : 1200px) {
  
  #first article {
	left: 25%;
}
  
  #fourth article {
   left: 25%;
  }

 article {
    padding: 1em 2em;
  }
  
  .textbox {
   /* width: 20em; */
  }

}/* ende @media */



@media only screen and (min-width : 1200px) {

.story, .dust, .landkarte, .leistung {
   overflow: hidden;
    height: 1065px;
}

#impressum .story, .impressum {
    overflow: hidden;
    min-height: 182em;
}

article {
	width: auto;
	top: 9em;
	left: 8%;
	padding: 1em 4em;
}

.textbox  {
	width: 14em;
 }

.story h1,
.textbox h3,
.textbox h4,
.textbox p,
.textbox address {
	padding-left: 0;
}

#impressum .textbox p {
	margin: 0;
}

.textbox address {
	margin-bottom: 0.5em;
}

.textbox h2 {
    letter-spacing: 1px;
    margin-bottom: 10px;
	padding-left: 0;
}
.textbox p {
    font-size: 16px;
    padding: 0.5em 0;
}
#second .textbox.links {
    margin-right: 0;
}
#second .textbox.mitte {
    margin: 0 20em;
}
.textbox ul {
    list-style-position: inside;
    margin-left: 0;
}

#first article {
	left: 45%;
}
#second article {
   left: 1%;
   top: 28em;
}
#third article {
  left: 40%;
  top: 16em;
}
#fourth article {
   left: 25%;
   top: 25em;
}



}/* ende @media */