/*==================== CSS Reset ====================*/
*{ margin:0; padding:0; }
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, input, textarea,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, main, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	font-size:100%;
	font:inherit;
	vertical-align:baseline;
	float:none;
}
article, aside, details, figcaption, figure, 
footer, header, main, hgroup, menu, nav, section {
	display:block;
}
blockquote, q {
	quotes:none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content:none;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
/*--- Ende CSS Reset ---*/


/*--- Eigene Fonts ---*/
@font-face { font-family: 'ErasUltraBold';
             src: url("../fonts/ErasUltraITC.ttf") format('truetype'); }
@font-face { font-family: 'ErasBold';
             src: url("../fonts/ERASBD.TTF") format('truetype'); }
@font-face { font-family: 'ErasMedium';
             src: url("../fonts/ERASMD.TTF") format('truetype'); }
@font-face { font-family: 'ErasDeMedium';
             src: url("../fonts/ERASDEMI.TTF") format('truetype'); }
@font-face { font-family: 'ErasLight';
             src: url("../fonts/ERASLGHT.TTF") format('truetype'); }

@font-face { font-family: 'Abel';
             src: url("../fonts/Abel-Regular.woff2") format('truetype'); }
@font-face { font-family: 'Montserrat';
             src: url("../fonts/Montserrat-VariableFont_wght.woff2") format('truetype'); }
@font-face { font-family: 'PT Sans';
             src: url("../fonts/PTSans-Regular.woff2") format('truetype'); }
@font-face { font-family: 'Work Sans';
             src: url("../fonts/WorkSans-VariableFont_wght.woff2") format('truetype'); }
/*--- Ende Eigene Fonts ---*/


/*==================== Grid ====================*/
.wrapper {
	width:100%;
	height:100%;
}
.row {
	max-width:75rem;
	margin:auto;
	margin-top:0.5rem;
	overflow-y:hidden;	
	float:none;
}
.row_small {
	max-width:48rem;
	margin:auto;
	overflow:hidden;	
	float:none;
}
.col {
	float:left;
	margin-right:1%;
}
.row .col:first-of-type {
	margin-left:1%;
}
.col_1 {width:7.25%;}
.col_2 {width:15.5%;}
.col_3 {width:23.75%;}
.col_4 {width:32%;}
.col_5 {width:40.25%;}
.col_6 {width:48.5%;}
.col_7 {width:56.75%;}
.col_8 {width:65%;}
.col_9 {width:73.25%;}
.col_10 {width:81.5%;}
.col_11 {width:89.75%;}
.col_12 {width:98%;}
img, video, object, embed {
	height:auto;
}
@media screen and (max-width:30rem) /*480px*/{	
	.col {
		float:none;		
	}
	.row .col:first-of-type {
		margin-left:0;
	}
	.col_1, .col_2, .col_3, .col_4, .col_5, .col_6, .col_7, .col_8, .col_9, .col_10, .col_11, .col_12 {
		width:98%;
		margin-right:0;
		padding-left:1%;
	}
}
/*--- Ende Grid ---*/



/*==================== Style ====================*/
body {
	margin:0;
	background-color:#D9D9D9;
	background-color:rgba(217,217,217,0.2);
	color:#365063;
	font-family: 'PT Sans', sans-serif;
	font-weight: 400;
	width:100%;
	font-size:1rem;
	min-width:20rem;
	text-align: justify;
}
img {
	display:block;
	width:100%;
}
ul {
	list-style-type: none;
}
ul.disc {
	list-style-type: disc;
	padding-left:1rem;
}
a {
	color:#365063;	
}
a:hover {
	color:#00B2F5;
}
#logo-header {
	width:100%;
}
@media screen and (max-width:42rem) /*672px*/ {
	.shrink img {
		width:50%;
	}
}
@media screen and (max-width:30rem) /*480px*/ {
	body {
		font-size:0.9rem;
	}
}
/*--- Ende Style ---*/



/*==================== Paralax ====================*/
.para_row {
	height: 15rem;
}
.text-blog {
	
}
/*===== Hintergrundbilder - Paralax =====*/
.photo-blog__dvm-aussen {
	background: url("../images/vollbild_1920/dvm-aussengeräte_1920-1200_samsung-klima_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__dvm-aussen-2 {
	background: url("../images/vollbild_1920/dvm-aussengeräte-2_1920-1200_samsung-klima_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__windfree-wand {
	background: url("../images/vollbild_1920/windfree-wandgerät_schlafzimmer_1920-1200_samsung-klima_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__windfree-wand-familie {
	background: url("../images/vollbild_1920/windfree-wandgerät_familie_1920-1200_samsung-klima_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__windfree-wand-joga {
	background: url("../images/vollbild_1920/windfree-wandgerät_joga_1920-1200_samsung-klima_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__windfree-wand-meerblick {
	background: url("../images/vollbild_1920/windfree-wandgerät_meerblick_1920-1200_samsung-klima_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__360-kassette {
	background: url("../images/vollbild_1920/360-kassette_büro_1920-1200_samsung-klima_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__buerogebaeude {
	background: url("../images/vollbild_1920/bürogebäude_1920-1200_samsung-klima_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__buerogebaeude-2 {
	background: url("../images/vollbild_1920/bürogebäude-2_1920-1200_samsung-klima_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__buerogebaeude-3 {
	background: url("../images/vollbild_1920/bürogebäude-3_1920-1200_samsung-klima_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__impressum {
	background: url("../images/vollbild_1920/impressum_1920.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__jahreszeiten {
	background: url("../images/vollbild_1920/4-jahreszeiten_1920-1200_samsung-klima_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__unterdecke {
	background: url("../images/vollbild_1920/unterdeckengerät_gang_1920-1200_samsung-klima_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__service-dms {
	background: url("../images/vollbild_1920/service_dms_1920-1200_samsung-klima_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__anruf {
	background: url("../images/vollbild_1920/anruf_1920-1200_samsung-klima_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__karte {
	background: url("../images/vollbild_1920/karte_1920-1200_samsung-klima_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__eis {
	background: url("../images/vollbild_1920/eis_1920-1080_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__obst {
	background: url("../images/vollbild_1920/obst_1920-1200_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
.photo-blog__kuehlregal {
	background: url("../images/vollbild_1920/kühlregal_1920-1104_gollackner.jpg");
	background-position: center center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
}
/* Ende Hintergrundbilder - Paralax */
.backgroundcolor_para_opacity {
	background-color: rgba(129,192,240,0.6);
	width: 100%;
	height: 100%;
}
@media screen and (max-width:30rem) /*480px*/ {
	.para_row {
		height: 150px;
	}
}
/*--- Ende Paralax ---*/



/*==================== Layout ====================*/
main {	
	z-index:-1;
}
header {
	padding:2rem;
	background-color: #ffffff;
}
.border-left_header {
	border-left: 3px solid #2B2861;	
}
/* Padding */
.text-padding-05rem {
	padding: 0.5rem;
}
.text-padding-1rem {
	padding: 1rem;
}
.padding-top-2rem {
	padding-top: 2rem;
}
/* Margin */
.margin-center {
	margin: auto;
  	width: 50%;
}
.margintop-2rem-smartphone {
	margin-top:0;
}
.margin-right-05rem {
	margin-right: 0.5rem;
}
/* Float */
.float-left {
	float: left;
}
/* Text-Style */
.text_align_center {
	text-align: center;
}
@media screen and (max-width:48rem) /*768px*/ {	
	.margin-center {
		margin: auto;
		width: 100%;
	}
}
@media screen and (max-width:30rem) /*480px*/ {
	.border-left_header {
		border-left: 0;	
	}
	.text-padding-05rem {
	padding: 0;
	}
	.text-padding-1rem {
		padding:0;
	}
	.margintop-2rem-smartphone {
		margin-top:2rem;
	}
}
/*--- Ende Layout ---*/



/*==================== Sticky Header ====================*/
.top-container {
	background-color: #ffffff;
	padding: 0.5rem;
	text-align: center;
}
.header {
	padding: 1rem 0;
	background-color: #0096CC;
	color: #f1f1f1;
	z-index: 99;
}
#logo-nav {
	display: none;
}
.sticky #logo-nav {
	display: block;
	width:12%;
	float:right;
}
.content {
	padding: 4rem;
}
.sticky {
	position: fixed;
	top: 0;
	width: 100%;	
}
.sticky + .content {
  	padding-top: 10rem;
}
@media screen and (max-width:60rem) /*960px*/ {
	.sticky + .content {
		padding-top: 9rem;
	}
	.sticky #logo-nav {
		width:15%;
		float:right;
	}
}
@media screen and (max-width:48rem) /*768px*/ {
	.sticky #logo-nav {
		display: none;
	}
	.sticky + .content {
		padding-top: 8rem;
	}
}
@media screen and (max-width:30rem) /*480px*/ {
	.content {
		padding: 2rem 0.5rem;
	}	
}
/*--- Sticky Header ---*/



/*==================== Navigation ====================*/
.nav_row {
	max-width:75rem;
	margin:auto;
	float:none;
	height:3rem;
}
.toggle, [id^=drop] {
 display: none;
}
.bbt-menu{
	background-color: #7BB6E3;
	width:100%;
}
nav {
    width:100%;
    padding:0;
	font-family: 'Montserrat', sans-serif;
}
nav:after {
    content: '';
    display: table;
    clear: both;
}
nav ul {
    float:left;
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative;
}
nav ul li {
	text-transform: uppercase;
    margin: 0px;
    display: inline-block;
    float: left;
    background-color: transparent; /*** Warna latar horizontal menu***/
}
nav ul li ul li{
	text-transform:none;
    background: #81C0F0; /*** Warna latar drop down menu***/
}
nav a, nav a:hover, nav a:visited {
    display: block;
    padding: 0 20px;
    color: #FFF;
    font-size: 1rem;
	font-weight: bold;
    line-height: 3rem;
    text-decoration: none;
}
nav ul li ul li:hover {
    background: #333;
}
nav a:hover {
	color:#00B2F5;
    background-color: #333;		
}
nav ul li ul li a:hover {
    background-color: #111;
}
nav ul ul {
    display: none;
    position: absolute;
    top: 3rem; /*** Posisi Down Menu Di Ukur Dari Atas ***/		
}
nav ul li:hover > ul {
    display: inherit;
}
nav ul ul li {
    width: 200px; /*** Lebar Down Menu ***/
    float: none;
    display: list-item;
    position: relative;	
}
nav ul ul ul li {
    position: relative;
    top: -3rem;
    left: 200px;
}
nav label span{
    float:right;
}
.toggle, [id^=drop] {
    display: none;
}
nav input[type=checkbox]{
    display: none;
}

/* Media Queries
*******************************************/

@media all and (max-width:48rem) /*768px*/  {
    nav {
        margin: 0;
    }
    .toggle + a, .menu {
        display: none;
    }
    .toggle {
        display: block;
        background-color: transparent;
        padding: 0 20px;
        color: #FFF;
        font-size: 1rem;
		font-weight: bold;
        line-height: 3rem;
        text-decoration: none;
        border: none;
    }
	.burger {
		font-size: 2rem;
	}
    .toggle:hover {
        background-color: #111;
		color:#00B2F5;
    }
	#logo-toggle {
		width:20%;
		float:left;
	}
    [id^=drop]:checked + ul {
        display: block;width: 100%;
    }
    nav ul li {
        display: block;
        width: 100%;
		background-color: #7BB6E3;
    }	
	nav ul ul .toggle, nav ul ul a {
        padding: 0 40px;
		background-color: #7BB6E3;
    }
	nav ul ul ul a {
        padding: 0 80px;
    }
    nav a:hover, nav ul ul ul a {
        background-color: #000000;
    }
    nav ul li ul li .toggle, nav ul ul a {
        background-color: #0096CC;;
    }
    nav ul ul {
        float: none;
        position: static;
        color: #ffffff;
    }
    nav ul ul li:hover > ul, nav ul li:hover > ul {
        display: none;
    }
    nav ul ul li {
        display: block;
        width: 100%;
    }
    nav ul ul ul li {
        position: static;
    }
}
@media all and (max-width:38rem) /*608px*/  {
    #logo-toggle {
		width:30%;
		float:left;
	}
}
@media all and (max-width:30rem) /*480px*/  {
    #logo-toggle {
		width:40%;
		float:left;
	}
}
@media all and (max-width:22.5rem) /*360px*/  {
    #logo-toggle {
		width:55%;
		float:left;
	}
}
/*--- Ende Navigation ---*/



/*==================== Slider ====================*/

/*--- Ende Slider ---*/



/*==================== Multimedia-Elemente (img, video, iframe etc.) ====================*/
.img-border {
	border: 1px solid #365063;
}
.img-shadow {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}
a .img-shadow {
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
	opacity: 0.55;
}
a .img-shadow:hover {
	opacity: 1;
	transition: opacity 0.2s;
}
/*===== Lightbox =====*/
* { 
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
label[for] {
	cursor: pointer;
}
input[type='checkbox'] {
	display: none;
}
.grid {
	
}
.lightbox {
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
}
.lightbox {
	z-index: 1;
	min-height: 100%;
	overflow: auto;	
	-webkit-transform: scale(0);
	-moz-transform: scale(0);
	-o-transform: scale(0);
	transform: scale(0);
	transition: transform .5s ease-out;
}
.lightbox img {
	position: fixed;
	top: 50%;
	left: 50%;
	width: auto;
	max-width: 96%;
	max-height: 96%;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

input[type='checkbox']:checked + .lightbox {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}
input[type='checkbox']:checked ~ .grid {
	opacity: 0.125;
}
.grid { 
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	align-content: flex-start;
	height: 100%;
	padding: 16px;
	overflow: auto;
	z-index: 0;
	background-color:transparent;
	text-align: center;
	transition: opacity 0.75s;
}
.grid .grid-item {
	display: block;
	width: 33.3333%;
	padding: 16px;
	opacity: 0.55;
	transition: opacity 0.2s;
}
.grid .grid-item:hover {
	opacity: 1;
}
@media screen and (max-width: 960px)  { .grid .grid-item { width: 50%; } }
@media screen and (max-width: 480px)  { .grid .grid-item { width: 100%; } }
.grid img {
	max-width: 100%;
	max-height: 100%;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}
/* Figcation */
figcaption {
	display: inline-block;
	position: absolute;
	bottom:2%;
	left:30%;
	width: 40%;
	text-align: center;
	line-height: 3em;
	color: #ffffff;
	background: rgba(0,150,204,0.7);
}
@media all and (max-width:48rem) /*768px*/  {
	figcaption {
		left:10%;
		width: 80%;
	}
}
/* Ende Lightbox */
/*===== Map =====*/
#map {
	width: 100%;
	height:23rem;
	margin:0.5rem 0;
}
form {
	margin:0.5rem 0;
}
form input {
	width:300px;
	padding:0.2rem;
	margin:0.5rem 0;
	border: 1px solid #365063;
}
form button {
	font-family: 'PT Sans', sans-serif;
	font-weight: 400;
	padding:0.2rem;
}
@media screen and (max-width:60rem) /* 960px */ {
	#map {
		height:12rem;
	}
}
@media screen and (max-width:30rem) /* 480px */ {
	#map {
		margin-top:1rem;
		width:99%;
	}	
}
/* Ende Map */
/*--- Ende Elemente ---*/



/*==================== Textformatierung ====================*/
h1 {
	font-family: 'Work Sans', sans-serif;
	font-weight: 800;
	color:#0096CC;
	font-size: 2.5rem;
	text-align: left;
	padding:1rem;
}
h2 {
	font-family: 'Abel', sans-serif;
	font-size: 1.5rem;
	font-weight: 700;
	text-align: center;
	color:#0096CC;
	padding-bottom: 2rem;
}
h3 {
	font-family: 'Work Sans', sans-serif;
	font-weight: 400;
	font-size: 1.2rem;
	text-align: center;
	color:#0096CC;
	padding: 0.5rem 0 1rem 0;
}
h4 {
	font-family: 'Abel', sans-serif;
	font-size: 1.2rem;
	font-weight: 600;
	text-align: left;
	color:#0096CC;
	padding: 1.5rem 0 1rem 0;
}
p {
	margin-bottom: 1rem;
}
.text_bold {
	font-weight: bold;
}
strong {
	font-weight: bold;
}
.inverse {
	display: inline-block;
	color:#ffffff;
	background-color: #0096CC;
	background-color:rgba(0,150,204,1);
	padding: 4px 10px 1px;
	margin:4px 0;
}
.uppercase {
	text-transform: uppercase;
}
@media screen and (max-width:48rem) /*768px*/ {		
	h1 {
		font-size: 1.8rem;
	}	
}
@media screen and (max-width:30rem) /*480px*/ {
	h1 {		
		font-size: 1.5rem;
	}
	p {
		margin-bottom: 0.5rem;
	}
}
/*--- Ende Textformatierung ---*/



/*==================== Call Button ====================*/
.call-button {
	display:block;
	overflow:hidden;
	fontsize:1rem;
	line-height: 1rem;
	height:auto;
	width:auto;
	padding:0.5rem;
	margin:auto;	
}
.call-button-size {
	width:auto;
	margin:auto;
}
.contact {
	border: 1px solid #365063;
	border-radius: 0.5rem;
	margin: 0.5rem 0.5rem;
}
.call-button .call-button-text {
	float:left;
	padding-top:0;
	margin: 0.4rem 0.5rem;
	color:#365063;
}
.call-button .icon_sprite {
	background-image:url(../images/icons/icon-sprite_365063_480-606.png);
	background-color:transparent;
	-webkit-transform:scale(0.6,0.6);
	-moz-transform:scale(0.6,0.6);
	-o-transform:scale(0.6,0.6);
	transform:scale(0.6,0.6);
	margin:0 5px 0 -5px;
}
.contact:hover {
	background-color: #111;
	transition: 0.5s;
}
.contact:hover .icon_sprite {
	background-image:url(../images/icons/icon-sprite_00B2F5_480-606.png);
}
.contact:hover .call-button-text {
	color:#00B2F5;	
}
@media screen and (max-width:48rem) /*768px*/ {		
	.call-button .call-button-text {		
		font-size:0.9rem;
	}
	
}
@media screen and (max-width:30rem) /*480px*/ {
	.call-button {
		padding:0;
	}
	.contact {		
		margin: 0.5rem;
	}
	.call-button .call-button-text {			
		margin:0.2rem 0.5rem;
	}	
	.call-button .icon_sprite {
		background-image:url(../images/icons/icon-sprite_365063_480-606.png);		
		-webkit-transform:scale(0.5,0.5);
		-moz-transform:scale(0.5,0.5);
		-o-transform:scale(0.5,0.5);
		transform:scale(0.5,0.5);
	}
	.contact:hover .icon_sprite {
		background-image:url(../images/icons/icon-sprite_00B2F5_480-606.png);
	}	
}
/*--- Ende Call Button ---*/



/*==================== Icon-Sprite ====================*/
.icon_sprite, .icon_sprite_header {
	float:left;
	width:2.5rem;
	height:2.5rem;
	background-image:url("../images/icons/icon-sprite_ffffff_480-606.png");
	background-color:transparent;
	border:solid thin;	
	border-color:transparent;	
	-webkit-transform:scale(0.4,0.4);
	-moz-transform:scale(0.4,0.4);
	-o-transform:scale(0.4,0.4);
	transform:scale(0.4,0.4);
	margin:0;
	padding:0.5rem;
} 
.icon_sprite:hover {
	background-image:url("../images/icons/icon-sprite_81C0F0_480-606.png");
}
.icon_sprite_footer {
	float:left;
	width:2.5rem;
	height:2.5rem;
	background-image:url("../images/icons/icon-sprite_365063_480-606.png");
	background-color:transparent;
	border:solid thin;	
	border-color:transparent;	
	-webkit-transform:scale(0.4,0.4);
	-moz-transform:scale(0.4,0.4);
	-o-transform:scale(0.4,0.4);
	transform:scale(0.4,0.4);
	margin:-11px 5px 0 -10px;
} 
.icon_home {
	background-position:2.7% 1.5%;
}
.icon_telefon {
	background-position:57% 2.1%;
}
.icon_email {
	background-position:3.9% 12%;	
}
.icon_standort {
	background-position:85.5% 1.5%;
}
.icon_facebook {
	background-position:44% 12%;
}
.icon_linkedin {
	background-position:98% 12%;
}
.icon_impressum {
	background-position:43.5% 22.2%;
}
.icon_besprechung {
	background-position:15% 0.6%;
}
.icon_profil {
	background-position:44% 1.8%;
}
.icon_datenschutz {
	background-position:57% 22%;
}
.icon_agb {
	background-position:44% 41.5%;
}
.icon_stift {
	background-position:29.7% 21.5%;
}
.icon_pinsel {
	background-position:15.5% 21%;
}
.icon_responsive {
	background-position:29.7% 41.5%;
}
.icon_zahnrad {
	background-position:43.8% 61.2%;
}
.icon_weltkugel {
	background-position:2.5% 22%;
}
.icon_lupe {
	background-position:29.7% 90%;	
}
.icon_link {
	background-position:44% 90%;	
}
.icon_server {
	background-position:15% 41.5%;
}
.icon_sprechblasen {
	background-position:30.5% 2%;	
}
.icon_werkzeug {
	background-position:14.5% 61%;
}
/*--- Ende Icon-Sprite ---*/



/*==================== Schnellauswahl ====================*/
* {
	box-sizing: border-box;
	-webkit-transition: all 0.18s ease-out;
	-moz-transition: all 0.18s ease-out;
	-o-transition: all 0.18s ease-out;
	transition: all 0.18s ease-out;
}
#social-sidebar ul {
  position: fixed;
  top: 30%;
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  transform: translateY(-50%);
  z-index: 999;
}
#social-sidebar ul li {
  position: relative;
  display: inline-flex;
  align-items: center;
  background-color: #000000;
  background-color: rgba(0, 0, 0, 0.6);
  margin: 0 0 8px 0;
  color: #fff;
  cursor: pointer;
  height: 36px;
  overflow: hidden;
}
#social-sidebar ul li.stoerungsholine{
  background-color:#FF0004;
  background-color:rgba(255,0,0,0.8);
}
#social-sidebar ul li.bewertung{
  background-color:#308706;
  background-color:rgba(48,135,6,0.8);
}
#social-sidebar ul li span {
  font-size: 16px;
  transform: translate(0, -50%);
  top: 50%;
  left: 36px;
  position: absolute;
  opacity: 0;
  visibility: hidden;
}
#social-sidebar ul li:hover {
  background: rgba(0, 0, 0, 1);
}
#social-sidebar ul li:hover span {
  visibility: visible;
  opacity: 1;
  transition-delay: 90ms;
}
#social-sidebar ul.wall {
  align-items: flex-end;
  right: 0;
}
#social-sidebar ul.wall li {
  width: 40px;
  border-radius: 22px 0 0 22px;
}
#social-sidebar ul.wall li:hover {
  width: 200px;
}
#social-sidebar:hover span {
	color:#00B2F5;
}
#social-sidebar li:hover .icon_sprite_header {
	background-image:url("../images/icons/icon-sprite_00B2F5_480-606.png");	
}
/*--- Ende Schnellauswahl---*/



/*==================== Footer ====================*/
footer {
	background-color: #E0F8F7;
	padding:2rem 0.5rem 4rem 0.5rem;	
}
footer a {	
	padding:0;		
}
footer .row {
	overflow: hidden;
}
.contact-footer p, .contact-footer h3 {
	padding:0.5rem 0 0 0;
}
#logo-footer {
	width:90%;	
}
ul.tabs {	
	list-style:none;
	text-align: left;
}
footer ul.tabs {
	margin-top:0;
	list-style:none;	
	text-align: left;	
}
footer ul.contact-footer {
	margin-top:2rem;
	list-style:none;	
	text-align: left;
}
ul.tabs li {	
	margin: 0;
	padding: 0;
	width:100%;
	overflow: hidden;
	position: relative;
	margin-right:0.5rem;
}
ul.tabs li a {
	text-decoration: none;
	display: block;
	font-size: 1rem;
	padding: 0.5rem 0;
	text-transform: uppercase;
}
ul.contact-footer li {	
	margin: 0 0 0 0;
	padding: 0;
	width:100%;
	overflow: hidden;
	position: relative;
	margin-right:0.5rem;
}
ul.contact-footer li a {
	text-decoration: none;
	display: block;
	font-size: 1rem;
	padding: 0;
}
ul.tabs li a:hover, ul.contact-footer li a:hover {
	color:#00B2F5;
}
.footer_link:hover a {
	color:#00B2F5;
}
.footer_link:hover .icon_sprite_footer {
	background-image:url("../images/icons/icon-sprite_00B2F5_480-606.png");	
}
.copyright {
	text-align: left;
}
@media screen and (max-width:48rem) /* 768px */{		
	ul.tabs li a {
		padding-left:2rem;
		font-size: 2em;
	}
	ul.contact-footer li {	
		margin: 0;
	}
	ul.contact-footer li a {
		padding-left:2rem;
	}	
}
@media screen and (max-width:30rem) /* 480px */ {		
	footer {		
		padding:2rem 0.5rem 2rem 0.5rem;
	}
	ul.tabs li a, ul.contact-footer li a {
		padding-left:0;
		font-size: 1.2em;
	}	
}
/*--- Ende Footer ---*/