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

/* ============================================================================
===============================================================================
===============================================================================
===============================================================================
===============================================================================

   iPhone/iPad
===============================================================================
===============================================================================
===============================================================================
===============================================================================
============================================================================ */

@media only screen 
and (max-width: 768px) {
/* ============================================================================
   Body
   ========================================================================= */
body {
	font-family: 'Crimson Text', Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	background: none !important;
	background-attachment: none !important;
}

/* ============================================================================
   Outer Wrapper
   ========================================================================= */

.wrapper { 
	float: left;
	padding-bottom: 20px;
}

/* ============================================================================
   Logo
   ========================================================================= */

#logo {
	margin-left: 10px;
}

#bildmarke {
	float: left;
	margin-left: 0px;
	margin-top: 60px;
}

#wortmarke {
	float: left;
	margin-left: 2px;
	margin-top: 60px;
}

/* ============================================================================
   Navigation/Menu
   ========================================================================= */

.navigation { 
    width: 100%;
    float: left;
}

#menu {
	display: none;
}

ul { 
	list-style-type: none; 
}

.pocp_button {
	right: 10px;
}

/* ============================================================================
   Content Div
   ========================================================================= */

.content {
	margin-top: 13em;
	padding-left: 10px;
	padding-right: 10px;
	max-width: 100%;
}

.content h2 {
	margin-left: 92px;
}

p {
	font-size: 18px;
}

/* ============================================================================
   Footer
   ========================================================================= */

#footer {
	display: none;
}

/* ============================================================================
   RoyalSlider
   ========================================================================= */

.royalSlider {
  	width: 100%;
  	height: 450px;
}
}

/* ============================================================================
===============================================================================
===============================================================================
===============================================================================
===============================================================================

   iPad/Desktop
===============================================================================
===============================================================================
===============================================================================
===============================================================================
============================================================================ */

@media only screen 
and (min-width : 769px) {
/* ============================================================================
   Body
   ========================================================================= */
body {
	font-family: 'Crimson Text', Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

/* ============================================================================
   Outer Wrapper
   ========================================================================= */

.wrapper { 
	float: left;
	margin-top: 10px;
}

/* ============================================================================
   Logo
   ========================================================================= */

#bildmarke {
	float: left;
	margin-left: 20px;
	margin-top: 60px;
}

#wortmarke {
	float: left;
	margin-left: 3px;
	margin-top: 60px;
}

/* ============================================================================
   Navigation/Menu
   ========================================================================= */

.navigation { 
    width: 20em;
    float: left;
	position: fixed;
}
  
#menu {
	clear: both;
	float: left;
	margin-top: 20px;
	margin-left: 73px;
	list-style-type: none;
}

ul { 
	list-style-type: none; 
}

/* ============================================================================
   Content Div
   ========================================================================= */

.content {
	float: left;
	margin-top: 11.5em;
	margin-left: 20.5em;
	padding-left: 10px;
	padding-right: 20px;
	padding-bottom: 17px;
	max-width: 600px;
}

/* ============================================================================
   PullOut Panel Menu
   ========================================================================= */

.pocp_button {
	display: none;
}

/* ============================================================================
   RoyalSlider
   ========================================================================= */

.royalSlider {
	font-family: BerkemeierGroteskBold, Helvetica, Arial, sans-serif;
	float: left;
  	width: 85%;
  	height: 400px;
}

#degrees {
	float: right;
	position: fixed;
	right: 10px;
	top: 150px;
	-webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
}
}

/* ============================================================================
===============================================================================
===============================================================================
===============================================================================
===============================================================================

   iPad Landscape
===============================================================================
===============================================================================
===============================================================================
===============================================================================
============================================================================ */

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

/* ============================================================================
   Body
   ========================================================================= */
body {
	background: none !important;
}
}

/* ============================================================================
===============================================================================
===============================================================================
===============================================================================
===============================================================================

   Main
===============================================================================
===============================================================================
===============================================================================
===============================================================================
============================================================================ */

/* ============================================================================
   HTML
   ========================================================================= */
html {
    -webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */
}

/* ============================================================================
   Body
   ========================================================================= */
body {
	font-family: 'Crimson Text', Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	background-attachment: fixed;
}

/* ============================================================================
   Wrapper
   ========================================================================= */

#wrapper {
	margin-top: 10px;
}

/* ============================================================================
   RoyalSlider
   ========================================================================= */

div.rsOverflow {
	width: 100% !important;
}

.rsDefault .rsOverflow {
	background: #fff;
}

/* ============================================================================
   Footer
   ========================================================================= */

#footer {
	bottom: 10px;
	left: 113px;
	float: left;
	position: fixed;
	color: #666;
}

/* ============================================================================
   Headlines
   ========================================================================= */

h2 {
	font-family: BerkemeierGroteskBold, Helvetica, Arial, sans-serif;
	font-size: 21px;
	letter-spacing: 0.03em;
	font-weight: normal;
	line-height: 1.04em;
}

h3 {
	line-height: 20px;
	font-weight: normal;
	margin-top: -18px;
	font-size: 24px;
}

/* ============================================================================
   Links Allgemein
   ========================================================================= */
   
a, a:visited {
	text-decoration: none;
	color: #000;
}

a:hover {
	text-decoration: underline;
}

/* ============================================================================
   Links Menu Hover
   ========================================================================= */

a.lackierlink:hover {
  color: #00474e;
}

a.malertapezierlink:hover {
	color: #0b8084;
}

a.fassadensanierunglink:hover {
	color: #a2987e;
}

a.waermedaemmlink:hover {
	color: #826d5a;
}

a.schimmellink:hover {
	color: #b00204;
}

a.bodenbelaglink:hover {
	color: #747474;
}

a.kontaktlink:hover, a.imprintlink:hover, a.datenschutzlink:hover {
	color: #7b0015;
}

/* ============================================================================
   Links PullOut Menu
   ========================================================================= */

#menu-lackier {
	color: #105960;
}

#menu-malertapezier {
	color: #0a847c;
}

#menu-fassadenbausanierung {
	color: #a2987e;
}

#menu-waermedaemm {
	color: #826d5a;
}

#menu-schimmel {
	color: #b00204;
}

#menu-bodenbelag {
	color: #747474;
}

#menu-kontakt, #menu-imprint, #menu-datenschutz {
	color: #fff;
}

/* ============================================================================
   Link Home
   ========================================================================= */

#home {
	color: #000;
}

/* ============================================================================
   PullOut Panel
   ========================================================================= */

.pocp_button {
	color: #000;
	text-shadow:0px 0px 0px #000;
	background: none;
	box-shadow: inset 0px 1px 2px 0px rgba(0, 0, 0, 0);
}

a.pocp_button.pocp_button_right:hover {
	text-decoration: none;
}

.pocp a {
	color: #fff;
}

.pocp {
	background: #333;
	color: #fff;
	width: 280px; /* war 240px */
	text-shadow:0px 0px 0px #000000;
	letter-spacing: 0.02em;	
	-webkit-box-shadow: inset rgba(0,0,0,0) -6px 0 8px;
	-moz-box-shadow: inset rgba(0,0,0,0) -6px 0 8px;
	box-shadow: inset rgba(0,0,0,0) -6px 0 8px;
}

.pocp .pocp_content {
	padding-top: 20px;
	width: 280px;
}

.pocp h2 {
	font-size: 21px;
}

.pocp_right {
	font-size: 18px;
	right: -280px;
}

.pocp_button_right.btn_active {
	right: 285px; /* war 265px */
}

.pocp ul {
	list-style-type: none;
	padding-left: 0px;
}

/* ============================================================================
   Top Border
   ========================================================================= */

#top-lackieren {
	background: #00474e;
	top: 0; left: 0; right: 0;
	height: 10px;
}

#top-malentapezieren {
	background: #0b8084;
	top: 0; left: 0; right: 0;
	height: 10px;
}

#top-fassadenbausanierung {
	background: #a2987e;
	top: 0; left: 0; right: 0;
	height: 10px;
}

#top-waermedaemm {
	background: #826d5a;
	top: 0; left: 0; right: 0;
	height: 10px;
}

#top-schimmel {
	background: #b00204;
	top: 0; left: 0; right: 0;
	height: 10px;
}

#top-bodenbelag {
	background: #747474;
	top: 0; left: 0; right: 0;
	height: 10px;
}

#top-kontakt, #top-imprint, #top-datenschutz, #top-index {
	background: #7b0015;
	top: 0; left: 0; right: 0;
	height: 10px;
}

#top-index, #top-lackieren, #top-malentapezieren, #top-fassadenbausanierung, #top-waermedaemm, #top-schimmel, #top-bodenbelag, #top-kontakt, #top-imprint, #top-datenschutz {
	position: fixed; z-index: 99999;
}