


@media all {

/*
--------------------------------------------------
Allgemein
--------------------------------------------------
*/

body {
    -webkit-text-size-adjust: 100%;
}


@font-face {
    font-family: 'Gotham Bold';
    src: url('../formgebung vk - Formgebung-Dateien/Gotham Bold.eot');
    src: url('../formgebung vk - Formgebung-Dateien/Gotham Bold.eot') format('embedded-opentype'),
         url('../formgebung vk - Formgebung-Dateien/Gotham Bold.woff') format('woff'),
         url('../formgebung vk - Formgebung-Dateien/Gotham Bold.ttf') format('truetype'),
		 url('../formgebung vk - Formgebung-Dateien/Gotham Bold.svg') format('svg');
	font-weight:normal;
	font-style:normal;
}



	* {
margin: 0;
padding: 0;
} 

    body {
        margin: 0px;
        text-align: left;
        padding: 0px;
        background: none repeat scroll 0px 0px #FFFFFF;
    	color: #969696;
}


a, body, div, em, input, label, legend, li, ol, p, select, strong, td, th, textarea, u, ul {
    font-family:  'Arial', sans-serif;
	font-weight: 300;
}


a {
    color: #000000;
    text-decoration: underline;
}

a:hover {
    color: #8598a8;
    text-decoration: none;
}



p { color: #000000;
    font-size: 14px;
    
	line-height: 26px;	
	margin: 0 0 10px 0;
}

hr {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #000000 -moz-use-text-color -moz-use-text-color;
    border-image: none;
    border-style: solid none none;
    border-width: 2px 0 0;
    display: inline-block;
    width: 25px;
}

h1 {
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 40px;
    font-weight: bold;
    padding: 4px 0;
    text-transform: uppercase;
	line-height: 47px;
	color:#bdd0e0;
	letter-spacing: -1px;
	font-weight:normal;
}   




h2 {
    color: #000000;
    font-family: "Gotham Bold", Arial, sans-serif;
	font-weight: bold;
    font-size: 10px;
    letter-spacing: 2px;
    margin: 0;
    padding: 10px 0 0;
	display:inline-block;
    text-transform: uppercase;
	font-weight:normal;
}

h2 span {
	font-family: "Gotham Bold", Arial, sans-serif;
	font-weight:normal;
	padding: 0 37px;
}

h2 a {font-size: 18px; line-height: 26px; margin: 0 0 20px;color: #000000; }

h3 {
    color: #000000;
    font-size: 18px;
    margin: 20px 0;
    text-transform: uppercase;
	font-weight:normal;
}




h4 {
	color: #000000;
    font-size: 14px;
    font-weight:normal;
	text-transform:uppercase;
}

.trenner1 {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #000000;
    border-image: none;
    border-style: solid none none;
    border-width: 2px 0 0;
    display: block;
    height: 2px;
    margin: 10px auto 30px;
    width: 25px;
}


.mod_navigation span {
    font-size:12px !important;
}



.kontaktwrapper {
    text-align: center;
	margin:80px 0;
}


#wrapper {
    margin: 0px auto;
    width: 100%;
	padding: 0px;
	
	height: auto !important;
	min-height: 100%;
	position: absolute;
}






#main {
    margin-top: 20px;
    width: 100%;
}




.mod_article, .mod_newsreader {margin:0; }

.invisible { display:none !important;}

/*
--------------------------------------------------
Header
--------------------------------------------------
*/

#header {position: relative; margin: 0 auto; width: 960px; }
#header .inside {position: relative; margin: 0 auto; width: 960px;}

#top_image {margin: 40px 0; display: block; width: 286px; position: relative; }

.mod_navigation {height: auto; position: relative; width: 100%; top: 0; margin: 20px 0 20px; border-top: 1px solid #AEAEAE; }
.mod_navigation ul {border-top: 0; margin: 0; }
.mod_navigation ul li {border-top: 0; }
.mod_navigation .level_1 {border: none; }
.mod_navigation .level_1 .active {color: #000; }
.mod_navigation .level_1 .active .active { cursor:pointer; display:inline-block;}
.mod_navigation .level_1 li {float: left; width: 240px; margin: 0 0px 0 0; padding: 0; }
.mod_navigation .level_1 .last {margin:0 !important;}
.mod_navigation .level_2 {margin: 12px 0 0; padding: 0; border: none; }
.mod_navigation .level_2 li {float: none; border: none; }


.mod_navigation a, .mod_navigation li, .mod_navigation span {
    color: #000000;
    font-size: 12px;
    
	text-transform: uppercase;
	display: inline-block;
	padding: 5px 0 0;
	line-height:15px;

}

.mod_navigation a:hover {
    color: #000;
    text-decoration: none;
}

.mod_navigation .level_2 a, .mod_navigation .level_2 li, .mod_navigation .level_2 span {
    color: #000000;
    font-size: 11px;
    
	text-transform: uppercase;
	display: inline-block;
	padding: 0px 0 0;
	line-height:16px;
	text-decoration: underline;
}

.mod_navigation .level_2 a:hover {
    color: #000;
    text-decoration: none;
}

.minibuttonheader-wrapper {height: 20px; position: absolute; top: 0; right: 0; width: 45px; text-align: right; }
.minibuttonheader-wrapper .minibuttonheader-t {height: 20px; background: url("../../files/img/twitter.png") no-repeat scroll 0 0 transparent; display: inline-block; width: 20px; }
.minibuttonheader-wrapper .minibuttonheader-f {height: 20px; background: url("../../files/img/facebook.png") no-repeat scroll 0 0 transparent; display: inline-block; width: 20px; }


.logowrapper {
	margin: 40px 0 20px;
    display: inline-block;
    max-width: 100%;
	height: auto;
}

.logoinside {
    display:inline-block;
    float: left;
    width: 50%;
	line-height:0;
	height: auto;
}

.logoinside.logoinside-left > img {
    background: none repeat scroll 0 0 #bdd0e0;
    width: 100%;
    height: auto;
    max-height: 144px;
    max-width: 144px;
}

.logoinside-right.logoinside > img {
    width: 100%;
    height: auto;
    max-height: 144px;
    max-width: 144px;
}





/*
--------------------------------------------------
Container
--------------------------------------------------
*/

#container {margin: 0 auto; width: 960px;}
#container .inside {margin: 0 auto; width: 960px; min-height: 400px;}

.ce_accordion {margin: 0; }
.ce_accordion .active {color: #000000; background: url("../../files/img/toggler-pfeil-active.png") no-repeat scroll right center transparent;}
.ce_accordion div {margin: 0; padding:0;  color: #bdd0e0;  background: none;}
.ce_accordion .accordion {background:none;}
.ce_accordion .image_container {margin: 20px 0; }
.ce_accordion .ce_text {padding:0 250px 0 0; margin:0 0 10px; color: #98a4af; font-size: 12px; }

.accordion {margin: 0;}
.accordion h1 {
    font-size: 12px;
    
    margin: 10px 0 10px;
    padding: 0;
	line-height: 47px;
	color: #000000;
	font-family:  'Roboto Condensed', sans-serif;
	letter-spacing:0;
}

.ce_accordion > div {background: url("../../files/img/toggler-pfeil.png") no-repeat scroll right center transparent;}
.ce_accordion .toggler {letter-spacing: -1px; padding: 0px 0; font-size: 40px; border-top: 1px solid #AEAEAE; text-transform: uppercase; font-weight: 700; font-family:  'Roboto Condensed', sans-serif; cursor: pointer; line-height: 55px; }
.ce_accordion .toggler:hover { background: url("../../files/img/toggler-pfeil-hover.png") no-repeat scroll right center transparent; }
.ce_accordion .toggler h1 {margin:0; padding:0; font-size: 40px; text-transform: uppercase; font-weight: 700; font-family:  'Roboto Condensed', sans-serif; line-height: 50px; }
.ce_accordion .toggler h1:hover { color:#000000; }

.caroufredsel_controls {margin: 10px 0 !important; text-align: center; }
/*
--------------------------------------------------
Footer
--------------------------------------------------
*/


#footer{
	background:none repeat scroll 0 0 #bdd0e0;
	box-shadow: 0 0 0px #000000 inset;
	border-top: none;
	border-bottom: none;
	
	
    bottom: 0 !important;
    height: 240px;
    margin: 0 auto;
    position: absolute;
    width: 100%;
    z-index: 4;
	
	
}


.footer-main {margin: 30px auto; width: 960px; }
.footer-main .footer-main-inner {padding: 0 0px 0 0; text-align: center; }
.footer-main .footer-main-inner p {
    background: none repeat scroll 0 0 #bdd0e0;
    color: #000;
    display: inline-block;
    font-size: 10px;
    
    height: 20px;
    line-height: 11px;
    margin: 0 auto;
    z-index: 1000;
}


.footer-main .footer-main-inner p:before {
    border-top: 1px solid #000;
    content: "";
    display: block;
    margin: 0 auto -28px;
    width: 70px;
    z-index: 10;
}

.upbutton-inside {width: 50px; margin: -20px 20px 0 0; float: right; height: 50px; }
.upbutton-inside a {background: url("../../files/img/upbutton.png") no-repeat scroll center center #bdd0e0; width: 50px; height: 50px; display:block; font-size: 0; }
.upbutton-inside a:hover { background: url("../../files/img/upbutton-hover.png") no-repeat scroll center center transparent; cursor:pointer;}


/*
--------------------------------------------------
Startseite
--------------------------------------------------
*/

.startseite #main {
    margin-top: 60px;
}

.startseite h1 {
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 58px;
    font-weight: bold;
    padding: 4px 0;
    text-transform: uppercase;
	line-height: 47px;
	color:#bdd0e0;
	letter-spacing: -1px;
	width:80%;
} 

/*
--------------------------------------------------
about
--------------------------------------------------
*/


.about {}

.about .ce_text {padding: 0 250px 0 0; }


/*
--------------------------------------------------
works
--------------------------------------------------
*/

.works {}

.works .mod_navigation {margin: 20px 0 40px;}

.works .ce_accordion {margin: 0; }
.works .ce_accordion .active {color: #000000; background: url("../../files/img/toggler-pfeil-active.png") no-repeat scroll right center transparent;}
.works .ce_accordion div {margin: 0; padding:0;  color: #bdd0e0;  background: none;}
.works .ce_accordion .accordion {background:none;}
.works .ce_accordion .image_container {margin: 20px 0; }
.works .ce_accordion .ce_text { padding:0 250px 0 0; margin:0 0 20px; color: #98a4af; font-size: 12px; }

.works .accordion {margin: 0;}
.works .accordion h1 {
    font-size: 12px;
    
    margin: 10px 0 10px;
    padding: 0;
	line-height: 47px;
	color: #000000;
	font-family:  'Roboto Condensed', sans-serif;
	letter-spacing:0;
}



.works .ce_accordion > div {background: url("../../files/img/toggler-pfeil.png") no-repeat scroll right center transparent;}
.works .ce_accordion .toggler {letter-spacing: -1px; padding: 0px 0; font-size: 40px; border-top: 1px solid #AEAEAE; text-transform: uppercase; font-weight: 700; font-family:  'Roboto Condensed', sans-serif; cursor: pointer;}
.works .ce_accordion .toggler:hover { background: url("../../files/img/toggler-pfeil-hover.png") no-repeat scroll right center transparent; }
.works .ce_accordion .toggler h1 {margin:0; padding:0;font-size: 48px; text-transform: uppercase; font-weight: 700; line-height: 55px; }
.works .ce_accordion .toggler h1:hover { color:#000000; }


/*
--------------------------------------------------
works/print
--------------------------------------------------
*/

.print .ce_colsetStart {}
.print .ce_colsetStart .col_1 {}
.print .ce_colsetStart .col_1 .subcl {margin-right: 40px; }
.print .ce_colsetStart .col_1 .subcl .tableform {}
.print .ce_colsetStart .col_1 .subcl .tableform {}

.print .ce_colsetStart .col_2 {}
.print .ce_colsetStart .col_2 .subcr {margin-right: 0px;}
.print .ce_colsetStart .col_2 .subcr .tableform {}
.print .ce_colsetStart .col_2 .subcr .tableform {}


/*
--------------------------------------------------
works/web
--------------------------------------------------
*/

.web .ce_colsetStart {}
.web .ce_colsetStart .col_1 {}
.web .ce_colsetStart .col_1 .subcl {margin-right: 40px; }
.web .ce_colsetStart .col_1 .subcl .tableform {}
.web .ce_colsetStart .col_1 .subcl .tableform {}

.web .ce_colsetStart .col_2 {}
.web .ce_colsetStart .col_2 .subcr {margin-right: 0px;}
.web .ce_colsetStart .col_2 .subcr .tableform {}
.web .ce_colsetStart .col_2 .subcr .tableform {}

.web .ce_accordion .image_container {margin: 20px 0 20px -120px;}

/*
--------------------------------------------------
works/other
--------------------------------------------------
*/

.other .ce_colsetStart {}
.other .ce_colsetStart .col_1 {}
.other .ce_colsetStart .col_1 .subcl {margin-right: 40px; }
.other .ce_colsetStart .col_1 .subcl .tableform {}
.other .ce_colsetStart .col_1 .subcl .tableform {}

.other .ce_colsetStart .col_2 {}
.other .ce_colsetStart .col_2 .subcr {margin-right: 0px;}
.other .ce_colsetStart .col_2 .subcr .tableform {}
.other .ce_colsetStart .col_2 .subcr .tableform {}


/*
--------------------------------------------------
contact
--------------------------------------------------
*/

.contact {}

.contact #main {margin-top: 20px; }

.ce_colsetStart {}
.ce_colsetStart .col_1 {}
.ce_colsetStart .col_1 .subcl {margin-right: 40px; }
.ce_colsetStart .col_1 .subcl .tableform {}
.ce_colsetStart .col_1 .subcl .tableform {}

.ce_colsetStart .col_2 {}
.ce_colsetStart .col_2 .subcr {margin-right: 40px;}
.ce_colsetStart .col_2 .subcr .tableform {}
.ce_colsetStart .col_2 .subcr .tableform {}

#tps {margin:0 !important;}
#tps td {padding:0 !important;}
#tps p {line-height: 18px; font-size: 14px; }

#f2 .col_0 {width: 80px; vertical-align: top;}
#f2 .col_1 {}
#ctrl_4 {    
	height: 140px;
	border: 1px solid #FCFCFC;
	box-shadow: 0 0 5px #E3E3E3 inset;
	background: none;
	padding: 10px;
}


.arbeitsprobenlink-wrapper {
	border-top: 1px solid #aeaeae;

}

.arbeitsprobenlink {
    border: 1px solid;
    color: #000;
    display: inline-block;
    float: right;
    font-size: 10px;
    margin: 10px 0;
    padding: 7px 20px;
    position: relative;
    text-decoration: none;
    z-index: 1000;
}

.arbeitsprobenlink:hover {
    color: #fff;
	text-decoration:none;
	transition: top 0.1s ease-in 0s;
	border: 1px solid #000000;
}



.arbeitsprobenlink:before {
    background: none repeat scroll 0 0 #000;   
    top: 100%;
	bottom: 0;
	right: 0;
	left: 0;
    content: "";
    opacity: 1;
    position: absolute;
    transition: top 0.1s ease-in 0s;
	z-index:-1;
}

.arbeitsprobenlink:hover:before {
    top: 0;
    transition: top 0.1s ease-in 0s;
}

div#minheight {
    clear: both;
    height: 240px;
}


.kontaktlinks {

}

.iphonebutton {
	font-family: "Gotham Bold", Arial, sans-serif;
	font-weight: bold;
    border: 2px solid #000;
    display: inline-block;
    font-size: 11px !important;
    font-weight: bold;
    letter-spacing: 3px;
    line-height: 25px;
    margin: 5px;
    padding: 0px;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    transition: all 0.3s ease-in-out 0s;
    width: 220px;
}

.iphonebutton:hover span {
	background:#000;
	color:#fff;
}

.iphonebutton-outline {
	font-family: "Gotham Bold", Arial, sans-serif;
	font-weight: bold;
    border: 2px solid #000;
    display: inline-block;
    font-size: 11px !important;
    font-weight: bold;
    letter-spacing: 3px;
    line-height: 25px;
    margin: 2px;
    padding: 1px;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    transition: all 0.3s ease-in-out 0s;
    width: -moz-calc(100% - 10px);
	width: -webkit-calc(100% - 10px);
	width: calc(100% - 10px);
}


.iphonebutton-wrapper {
    margin: 30px 0 0;
}

.anruf {
	display:none;
}




}


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


.footer-main .footer-main-inner {
	text-align:center;
}


.iphonebutton:hover {
	background: none;
	color:#000000;
}

.anruf {
	display:none;
}


.logowrapper {
	margin: 40px 0 20px;
}

.startseite #main {
    margin-top: 60px;
} 

#wrapper {
	margin: 0;
    width: 100%;
}

#header {
	margin: 0;
    width: 100%;
}

#header .inside {
	margin: 0 auto;
    width: -moz-calc(100% - 60px);
	width: -webkit-calc(100% - 60px);
	width: calc(100% - 60px);
}


#container {
	margin: 0;
    width: 100%;
}

#container .inside {
	margin: 0 auto;
    width: -moz-calc(100% - 60px);
	width: -webkit-calc(100% - 60px);
	width: calc(100% - 60px);
	min-height: auto;
	height:auto;
}



div#minheight {

}

#footer {
	padding: 20px 0 0;
	margin: 0;
    width: 100%;
}

.footer-main {
	margin: 0px 0;
	padding:0px;
    width: -moz-calc(100% - 0px);
	width: -webkit-calc(100% - 0px);
	width: calc(100% - 0px);
	display:block;
}

.footer-main p {
}

.kontaktlinks {

}


.startseite h1 {
	display:inline;
    max-width: 100%;
	font-size:350%;
	line-height:60%;
} 

h2 {

}

h3 {
    font-size:14px;
}

h4 {
    font-size:12px;
}

.mod_navigation span {
    font-size:12px !important;
}

.kontaktwrapper {
    margin: 80px 0 80px;
}

 



}


@media only screen and (min-width : 500px) and (max-width : 800px)  { 

.startseite h1 {
	display:inline;
	font-size:250% !important;
	line-height:60%;
} 

}



@media only screen and (min-width : 0px) and (max-width : 500px)  { 

.startseite h1 {
	display:inline;
	font-size:170%;
	line-height:60%;
} 

}






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


.footer-main .footer-main-inner {
	text-align:center;
}


.iphonebutton:hover {
	background: none;
	color:#000000;
}

.anruf {
	display:none;
}

#top_image {
    margin: 30px 0 30px 0;
    width: 100%;
}

#top_image img {
    max-width: 100%;
	height:auto;
}

.startseite #main {
    margin-top: 60px;
} 

#wrapper {
	margin: 0;
    position: relative;
    width: 100%;
}

#header {
	margin: 0;
    position: relative;
    width: 100%;
}

#header .inside {
	margin: 0 auto;
    position: relative;
    width: -moz-calc(100% - 60px);
	width: -webkit-calc(100% - 60px);
	width: calc(100% - 60px);
}


#container {
	margin: 0;
    position: relative;
    width: 100%;
}

#container .inside {
	margin: 0 auto;
    position: relative;
    width: -moz-calc(100% - 60px);
	width: -webkit-calc(100% - 60px);
	width: calc(100% - 60px);
	min-height: auto;
	height:auto;
}



div#minheight {
	display:none;
}

#footer {
	padding: 20px 0 0;
	margin: 0;
    position: relative;
    width: 100%;
}

.footer-main {
	margin: 0px 0;
	padding:0px;
	position: relative;
    width: -moz-calc(100% - 0px);
	width: -webkit-calc(100% - 0px);
	width: calc(100% - 0px);
	display:block;
}

.footer-main p {
}

.kontaktlinks {

}


.startseite h1 {
	display: inline-block;
    max-width: 70%;
	font-size:350%;
	line-height:80%;
	margin-bottom: 30px;
} 

h2 {

}

h3 {
    font-size:14px;
}

h4 {
    font-size:12px;
}

.mod_navigation span {
    font-size:12px !important;
}

.kontaktwrapper {
    margin: 40px 0 50px;
}

 



}




@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)
and (orientation : landscape)  { 

.startseite h1 {
	max-width: 100%;
	font-size:350%;
	line-height:80%;
	margin-bottom: 0px;

} 



.kontaktwrapper {
    margin: 120px 0 50px;
}


}






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


.iphonebutton:hover {
	background: none;
	color:#000000;
}


.anruf {
	display: inline-block;
}


#top_image {
    margin: 30px 0 30px 0;
    width: 100%;
}

#top_image img {
    width: 280px;
	height:auto;
} 

#wrapper {
	margin: 0;
    position: relative;
    width: 100%;
}

#header {
	margin: 0;
    position: relative;
    width: 100%;
}

#header .inside {
	margin: 0 auto;
    position: relative;
    width: -moz-calc(100% - 40px);
	width: -webkit-calc(100% - 40px);
	width: calc(100% - 40px);
}


#container {
	margin: 0;
    position: relative;
    width: 100%;
}

#container .inside {
	margin: 0 auto;
    position: relative;
    width: -moz-calc(100% - 40px);
	width: -webkit-calc(100% - 40px);
	width: calc(100% - 40px);
	min-height: auto;
	height:auto;
}

.startseite h1 {
	display:inline;
    max-width: 100%;
	font-size:200%;
	line-height:50%;
} 


div#minheight {
	display:none;
}

#footer {
	padding: 20px 0 0;
	margin: 0;
    position: relative;
    width: 100%;
	height:160px;
}

.footer-main {
	margin: 0px 0;
	padding:0px;
	position: relative;
    width: -moz-calc(100% - 0px);
	width: -webkit-calc(100% - 0px);
	width: calc(100% - 0px);
	display:block;
}

.kontaktlinks {
	display:none;
}

h2 {

}

h3 {
    font-size:14px;
}

h4 {
    font-size:12px;
}

.footer-main .footer-main-inner p {
    font-size:9px;
}

.mod_navigation span {
    font-size:9px !important;
}


.footer-main .footer-main-inner {
    display: table;
    margin: 0 auto;
    padding: 0;

}


.iphonebutton-wrapper {
    margin: 20px 0 0;
}

.kontaktwrapper {
    margin: 50px 0 30px;
    text-align: center;
}


}


@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 
and (orientation : landscape) { 

.startseite h1 {
	display:inline;
    max-width: 100%;
	font-size:340%;
	line-height:60%;
} 

h2 {

}

h3 {
    font-size:14px;
}

h4 {
    font-size:12px;
}



.footer-main {
	margin: 0px 0;
	padding:0px;
	position: relative;
    width: -moz-calc(100% - 0px);
	width: -webkit-calc(100% - 0px);
	width: calc(100% - 0px);
	display:block;
}

.footer-main .footer-main-inner {
	display: block;
    margin: 0;
    padding: 0;
    text-align: center;
}






}

