/*
 * Copyright 2016 Google Inc.
 * 
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 * 
 *      http://www.apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

* {
  box-sizing: border-box; }

html, body {
  padding: 0;
  margin: 0;
  height: 100%;
  width: 100%;
  font-family: 'Helvetica', 'Verdana', sans-serif;
  font-weight: 400;
  font-display: optional;
  color: #444;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

html {
  overflow: hidden; }

body {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-flex-wrap: nowrap;
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-align-content: stretch;
      -ms-flex-line-pack: stretch;
          align-content: stretch;
  /*background: #ececec;*/
  background: #f3f3f3;
  /*background: #0e0c1e;*/
  background-size:auto;
  }

.header {
  width: 100%;
  /*height: 56px;*/
  height: 64px;
  /*color: #189a91;
  color: #f9f9fc;
  background: #3d9ce5;
  background: #0e0c1e;*/

  color: #fff;
  background: #10598E;  
  
  position: fixed;
  font-size: 20px;
  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 2px 9px 1px rgba(0, 0, 0, 0.12), 0 4px 2px -2px rgba(0, 0, 0, 0.2);
  padding: 16px 16px 0 16px;
  will-change: transform;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-flex-wrap: nowrap;
      -ms-flex-wrap: nowrap;
          flex-wrap: nowrap;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-align-content: center;
      -ms-flex-line-pack: center;
          align-content: center;
  -webkit-transition: -webkit-transform 0.233s cubic-bezier(0, 0, 0.21, 1) 0.1s;
  transition: -webkit-transform 0.233s cubic-bezier(0, 0, 0.21, 1) 0.1s;
  transition: transform 0.233s cubic-bezier(0, 0, 0.21, 1) 0.1s;
  transition: transform 0.233s cubic-bezier(0, 0, 0.21, 1) 0.1s, -webkit-transform 0.233s cubic-bezier(0, 0, 0.21, 1) 0.1s;
  z-index: 1000; }
  .header .headerButton {
    width: 24px;
    height: 24px;
    margin-right: 16px;
    text-indent: -30000px;
    overflow: hidden;
    opacity: 0.54;
    -webkit-transition: opacity 0.333s cubic-bezier(0, 0, 0.21, 1);
    transition: opacity 0.333s cubic-bezier(0, 0, 0.21, 1);
    border: none;
    outline: none;
    cursor: pointer; }
  .header #butRefresh {
    background: url(../images/ic_refresh_white_24px.svg) center center no-repeat; }
  .header #butAdd {
    background: url(../images/ic_add_white_24px.svg) center center no-repeat; }

  .header .headerButtonFocus {
    width: 24px;
    height: 24px;
    margin-right: 16px;
    text-indent: -30000px;
    overflow: hidden;
    /*opacity: 0.54;
    -webkit-transition: opacity 0.333s cubic-bezier(0, 0, 0.21, 1);
    transition: opacity 0.333s cubic-bezier(0, 0, 0.21, 1);*/
    border: none;
    outline: none;
    cursor: pointer; }	
	
  .header #butSpeak {
    background: url(../images/small24px-Speaker_Icon.png) center center no-repeat; }	

  .header #butImpress {
    background: url(../images/impressum-icon.png) center center no-repeat; }	
	
	
.logo {
	height: 50px;
	width: 50px;
	margin-right: 10px;
	margin-top: -7px;
	/*background: url(../images/logo-karmascope_48x48.png) center center no-repeat;*/
	/*background: url(../images/logo-karmascope_50x50.png) center center no-repeat;*/
	background: url(../images/centofix_logo_50x50_white.png) center center no-repeat;

}
/*
.logo {
	height: 36px;
	width: 36px;
	margin-right: 10px;
	background: url(../images/logo-karmascope_36x36.png) center center no-repeat;

}	
*/
	


.note-noscript{

	background-color:#f7d9dc;
	border:1px solid red;
	color:red;
	font-size:12px;
	padding:4px;
	margin:0px;

}

.breadcrumb{
	/*color: #f3f2f3;*/
	color: #fff;
    padding-top: 14px;
    background-color: #10598E;
    padding-left: 18px;
    padding-bottom: 4px;
	display:none;
	width:100%;
	border-bottom:1px solid #

}
.breadcrumb ul{
	margin:0px;
	padding:0px;
}
.breadcrumb a{
	text-decoration:none;
	color:#e1e1e1;
}
.breadcrumb a:hover{
	text-decoration:none;
	color:white;
}
.breadcrumb a:visited{
	text-decoration:none;
	color:inherit;
}
.breadcrumb a.activeLink{
	color:white;

}
.breadcrumb li{
	background-color:#10598E;
	color:#fff;
	float:left;
	list-style:none;
	margin-right:12px;
	font-size:16px;

}
.breadcrumb li.active{
	background-color:#10598E;
	color:white;
	border-bottom:2px solid white;

}

.antwort{
	font-size:18px;
	color:black;
	/*font-weight:bold;*/


}
.antwort_info{
	font-size:16px;
	color:#10598E;
	
}


.estimate_box {
    background: black;
    color: #3dff00;
    width: 100%;
    display: ;
    height: auto;
	min-height:240px;
    font-family: Courier, Verdana, Arial;
    font-size: 12px;
    /* padding: 5px; */
}	
.blueLine {
    background-color: #006bef;
    color: white;
}

.header__title {
  font-weight: 400;
  font-size: 20px;
  margin: 0;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1; }
		  
.header__sub_title {
  font-weight: 200;
  font-size: 12px;
  margin: 0;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1; }		  

.loader {
  left: 50%;
  top: 50%;
  position: fixed;
  display:;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%); }
  .loader #spinner {
    box-sizing: border-box;
    stroke: #673AB7;
    stroke-width: 3px;
    -webkit-transform-origin: 50%;
            transform-origin: 50%;
    -webkit-animation: line 1.6s cubic-bezier(0.4, 0, 0.2, 1) infinite, rotate 1.6s linear infinite;
            animation: line 1.6s cubic-bezier(0.4, 0, 0.2, 1) infinite, rotate 1.6s linear infinite; }

@-webkit-keyframes rotate {
  from {
    -webkit-transform: rotate(0);
            transform: rotate(0); }
  to {
    -webkit-transform: rotate(450deg);
            transform: rotate(450deg); } }

@keyframes rotate {
  from {
    -webkit-transform: rotate(0);
            transform: rotate(0); }
  to {
    -webkit-transform: rotate(450deg);
            transform: rotate(450deg); } }

@-webkit-keyframes line {
  0% {
    stroke-dasharray: 2, 85.964;
    -webkit-transform: rotate(0);
            transform: rotate(0); }
  50% {
    stroke-dasharray: 65.973, 21.9911;
    stroke-dashoffset: 0; }
  100% {
    stroke-dasharray: 2, 85.964;
    stroke-dashoffset: -65.973;
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg); } }

@keyframes line {
  0% {
    stroke-dasharray: 2, 85.964;
    -webkit-transform: rotate(0);
            transform: rotate(0); }
  50% {
    stroke-dasharray: 65.973, 21.9911;
    stroke-dashoffset: 0; }
  100% {
    stroke-dasharray: 2, 85.964;
    stroke-dashoffset: -65.973;
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg); } }

.main {
  padding-top: 60px;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
  overflow-x: hidden;
  overflow-y: auto;

  -webkit-overflow-scrolling: touch; }

.dialog-container {
  background: rgba(0, 0, 0, 0.57);
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  pointer-events: none;
  will-change: opacity;
  -webkit-transition: opacity 0.333s cubic-bezier(0, 0, 0.21, 1);
  transition: opacity 0.333s cubic-bezier(0, 0, 0.21, 1); }

.dialog-container--visible {
  opacity: 1;
  pointer-events: auto; }

.dialog {
  background: #FFF;
  border-radius: 2px;
  box-shadow: 0 0 14px rgba(0, 0, 0, 0.24), 0 14px 28px rgba(0, 0, 0, 0.48);
  min-width: 280px;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) translateY(30px);
          transform: translate(-50%, -50%) translateY(30px);
  -webkit-transition: -webkit-transform 0.333s cubic-bezier(0, 0, 0.21, 1) 0.05s;
  transition: -webkit-transform 0.333s cubic-bezier(0, 0, 0.21, 1) 0.05s;
  transition: transform 0.333s cubic-bezier(0, 0, 0.21, 1) 0.05s;
  transition: transform 0.333s cubic-bezier(0, 0, 0.21, 1) 0.05s, -webkit-transform 0.333s cubic-bezier(0, 0, 0.21, 1) 0.05s; }

.dialog > div {
  padding-left: 24px;
  padding-right: 24px; }

.dialog-title {
  padding-top: 20px;
  font-size: 1.25em; }

.dialog-body {
  padding-top: 20px;
  padding-bottom: 24px; }
  .dialog-body select {
    width: 100%;
    font-size: 2em; }

.dialog-buttons {
  padding: 8px !important;
  float: right; }

.card {
  padding: 16px;
  position: relative;
  box-sizing: border-box;
  background: #fff;
  border-radius: 2px;
  margin: 16px;
  max-width:590px;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12); }

  
.voice_speak{
	margin-right:15px;
	height:24px;
	width:24px;
	background: url(../images/small24px-Speaker_Icon.png) center center no-repeat;
}  
  
  
  
  
.elementarBox{
	background-repeat: no-repeat;
	background-position:center;
	background-size:contain;
	background-color: transparent;
	opacity: 1;
	height:324px;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
}  

.content_header{
	padding-left: 16px;
	padding-bottom: 6px;

}

.sub_headline{
	font-size:20px;
	/*color:#aaa;*/
	/*color: #189a91;*/
	color: #f9f9fc;
	border-top: 2px solid #189a91;
	border-bottom: 2px solid #189a91;
	padding-bottom:6px;
	margin-top:6px;
	padding-top:6px;
}
.publishDate{
	font-size:10px;
	color:#189a91;
	margin-top:-15px;
}

/*
.feuer{
	background-image:url('../images/ele-feuer.jpg');
	background-color: #971228;
}
.wasser{
	background-color: #166f79;
}
.luft{
	background-color: #17394c;
}
.erde{
	background-color: #534237;
}
*/






  
  
.weather-forecast .location {
  font-size: 1.75em; }

.weather-forecast .date, .weather-forecast .description {
  font-size: 1.25em; }

.weather-forecast .current {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex; }
  .weather-forecast .current .icon {
    width: 128px;
    height: 128px; }
  .weather-forecast .current .visual {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    font-size: 4em; }
    .weather-forecast .current .visual .scale {
      font-size: 0.5em;
      vertical-align: super; }
  .weather-forecast .current .visual, .weather-forecast .current .description {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
            flex-grow: 1; }
  .weather-forecast .current .sunset:before {
    content: "Horny till: ";
    color: #888; }
  .weather-forecast .current .wind:before {
    content: "Lovescope: ";
    color: #888; }
  .weather-forecast .current .sunrise:before {
    content: "Horny at: ";
    color: #888; }
  .weather-forecast .current .humidity:before {
    content: "Horrorscope: ";
    color: #888; }
  .weather-forecast .current .pollen:before {
    content: "Pollen Count: ";
    color: #888; }
  .weather-forecast .current .pcount:before {
    content: "Pollen ";
    color: #888; }

.weather-forecast .future {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex; }
  .weather-forecast .future .oneday {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    text-align: center; }
    .weather-forecast .future .oneday .icon {
      width: 64px;
      height: 64px;
      margin-left: auto;
      margin-right: auto; }
    .weather-forecast .future .oneday .temp-high, .weather-forecast .future .oneday .temp-low {
      display: inline-block; }
    .weather-forecast .future .oneday .temp-low {
      color: #888; }

.weather-forecast .icon {
  background-repeat: no-repeat;
  background-size: contain; }
  .weather-forecast .icon.clear-day {
    background-image: url("../images/clear.png"); }
  .weather-forecast .icon.clear-night {
    background-image: url("../images/clear.png"); }
  .weather-forecast .icon.rain {
    background-image: url("../images/rain.png"); }
  .weather-forecast .icon.snow {
    background-image: url("../images/snow.png"); }
  .weather-forecast .icon.sleet {
    background-image: url("../images/sleet.png"); }
  .weather-forecast .icon.windy {
    background-image: url("../images/wind.png"); }
  .weather-forecast .icon.fog {
    background-image: url("../images/fog.png"); }
  .weather-forecast .icon.cloudy {
    background-image: url("../images/cloudy.png"); }
  .weather-forecast .icon.partly-cloudy-day {
    background-image: url("../images/partly-cloudy.png"); }
  .weather-forecast .icon.partly-cloudy-night {
    background-image: url("../images/partly-cloudy.png"); }
  .weather-forecast .icon.thunderstorms {
    background-image: url("../images/thunderstorm.png"); }

	

	
	
	
	
	
	
	
@media (max-width: 450px) {
  .weather-forecast .date, .weather-forecast .description {
    font-size: 0.9em; }
  .weather-forecast .current .icon {
    width: 96px;
    height: 96px; }
  .weather-forecast .current .visual {
    font-size: 3em; }
  .weather-forecast .future .oneday .icon {
    width: 32px;
    height: 32px; } 
	
	
	.elementarBox{
		background-repeat: no-repeat;
		background-position:center;
		background-size:contain;
		/*height:150px;*/
		height:190px;

	} 	
	
	.main{
		background-image: url("");
		background-repeat: no-repeat;
		background-position:center;
		background-size:auto;		
	}	
	
	.header__title{
		/*font-size:12px;*/
	}
	.header__sub_title{
		/*font-size:8px;*/
	}	
	.card{
		/*opacity:0.9;*/
	}

	.detail-com{
		/*background: url(../com/banner-01-test-ani.gif) left top no-repeat;*/
		height:120px;
	}
	
	.emoji-description{
		font-size:12px;

	}	
	
	.schaltprozent_img_figure{
		content:url("https://centofix.app/media/Schaltprozente-preview-smal.png");
	}
	
}



footer{
	/*background-color: white;*/
	background: rgb(255,255,105);
	/*background: rgb(58,151,229);*/
	padding: 10px;
	display:none;
}		

.fbtn {
  background: #3498db;
  background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
  background-image: -moz-linear-gradient(top, #3498db, #2980b9);
  background-image: -ms-linear-gradient(top, #3498db, #2980b9);
  background-image: -o-linear-gradient(top, #3498db, #2980b9);
  background-image: linear-gradient(to bottom, #3498db, #2980b9);
  -webkit-border-radius: 6;
  -moz-border-radius: 6;
  border-radius: 6px;
  font-family: Arial;
  color: #ffffff;
  font-size: 14px;
  padding: 6px 10px 6px 10px;
  text-decoration: none;
}

.com-001{
	margin-right:15px;
	height:contain;
	width:contain;
	background: url() center center no-repeat;
}



.how_to_header{

	display: inline-block;
	width: 100%;
	/*min-width: 250px;*/
	/*margin: 0 2%;*/
	margin: 4px;
	text-align: center;
	vertical-align:top;
	/*border: 1px solid black;*/

}

.how_to_box{

	display: inline-block;
	width: 160px;
	/*min-width: 250px;*/
	/*margin: 0 2%;*/
	margin: 4px;
	text-align: center;
	vertical-align:top;
	font-size:12px;
	font-weight:bold;
}

.how_to_box2{
	background-color:#aca49e;
	color:#e01f0f;
	text-align:left;
}


.how_to_box_list{

	width: auto;
	/*min-width: 250px;*/
	/*margin: 0 2%;*/
	margin: 18px;
	text-align: center;
	vertical-align: middle;
	font-size:12px;
	font-weight:bold;
	/*background-color:green;*/
	border-bottom:1px solid #ccc;

}
.how_to_box_list2{

	width: auto;
	/*min-width: 250px;*/
	/*margin: 0 2%;*/
	margin: 5px;
	text-align: left;
	vertical-align: middle;
	font-size:12px;
	font-weight:bold;
	/*background-color:green;*/
	/*border-bottom:1px solid #ccc;*/

}
.emoji-list{
	display: inline-block;
	width: 60px;
	/*background-color:blue;*/
	text-align:left;
}
.emoji-icon{
	/*width:26px;
	height:26px;*/
	width:45px;
	height:45px;
}

.emoji-description{
	display: inline-block;
	/*width: contain;*/
	width:auto;
	/*min-width: 250px;*/
	/*margin: 0 2%;*/
	font-size:14px;
	font-weight:bold;
	/*background-color:red;*/
	text-align:center;
	vertical-align:middle;
	margin-bottom:30px;
}
	
.mdl-button {
  background: transparent;
  border: none;
  border-radius: 2px;
  color: black;
  position: relative;
  height: 36px;
  margin: 0;
  min-width: 64px;
  padding: 0 16px;
  display: inline-block;
  font-family: "Roboto", "Helvetica", "Arial", sans-serif;
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  line-height: 1;
  letter-spacing: 0;
  overflow: hidden;
  will-change: box-shadow;
  -webkit-transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  transition: box-shadow 0.2s cubic-bezier(0.4, 0, 1, 1), background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1), color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  outline: none;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  line-height: 36px;
  vertical-align: middle; }
  .mdl-button::-moz-focus-inner {
    border: 0; }
  .mdl-button:hover {
    background-color: rgba(158, 158, 158, 0.2); }
  .mdl-button:focus:not(:active) {
    background-color: rgba(0, 0, 0, 0.12); }
  .mdl-button:active {
    background-color: rgba(158, 158, 158, 0.4); }
  .mdl-button.mdl-button--colored {
    color: #3f51b5; }
    .mdl-button.mdl-button--colored:focus:not(:active) {
      background-color: rgba(0, 0, 0, 0.12); }

.mdl-button--primary.mdl-button--primary {
  color: #3f51b5; }
  .mdl-button--primary.mdl-button--primary .mdl-ripple {
    background: white; }
  .mdl-button--primary.mdl-button--primary.mdl-button--raised, .mdl-button--primary.mdl-button--primary.mdl-button--fab {
    color: white;
    background-color: #3f51b5; }
	
	
	
/*Horoskop Tagestexte Layer 

margin: 25px 50px 75px 100px;

top margin is 25px
right margin is 50px
bottom margin is 75px
left margin is 100px



*/

.horoskope-details{

	display:none;
	position:fixed;
	/*position:absolute;*/
	/*width:contain;
	height:contain;*/
	width:90%;
	height:75%;	
    /*border: 1px solid black;*/
    /*margin: 0px 10px 30px 10px;*/
	margin-right:15px;
	margin-bottom:60px;
	margin-top:-51px;
    background-color: lightblue;
	z-index:1201;
	text-align:left;
	/*float:left;*/
	box-shadow: 5px 6px 18px 3px rgba(0, 0, 0, 0.7);;
	/*box-shadow: 10px 10px 10px rgba(0, 0, 0, 0.5);*/
	
}
	


.mtitle{
	font-size:16px;
	margin-top:0px;
	margin-bottom:0px;
	color:#0e0c1e;
	font-weight:normal;
	letter-spacing:0.3em;

	
}
.horoskope{
	font-size:12px;
	position:relative;
	/*border:1px solid green;*/
	/*float:left;*/
	margin-bottom:10px;
	background: url(../images/sternzeichen-fische.png) right top no-repeat;
}
.hliner	{
	color:black;
	border:1px solid black;
	margin-bottom:15px;
	margin-top:5px;
}
.sternzeichen{
	margin-top:0px;
	/*margin-bottom:12px;*/
	font-size:26px;
	/*color:#0e0c1e;*/
	letter-spacing:0.3em;
}
.sternzeichen-birth{
	font-size:20px;
	margin-top:140px;
	/*margin-bottom:15px;*/
	font-weight:bold;
	letter-spacing:0.2em;
}

.sternzeichen-horoskop{
	margin-bottom:10px;
	/*margin-left:10px;*/
	font-size:18px;
	width:100%;
	letter-spacing: 0.1em;
}

/*
.sternbild{
	height:256px;
	width:30%;

	background: url(../images/sternzeichen-krebs.png) left top no-repeat;
	background-size:contain;
	display:flex;
}
*/

.sternbilder_top{
	height:200px;
	background: url(../images/sternzeichen-krebs.png) right top no-repeat;
	background-size:contain;
}

.sternzeichenWasser{
	/*color:#18a096;*/
	color:#0e0c1e;
}
.sternzeichenLuft{
	color:#0e0c1e;
}	
.sternzeichenFeuer{
	/*color:#0e0c1e;*/
	color: #e74b3e;
}
.sternzeichenErde{
	color:#ad774c;
}
			

.mehr-info{
	color:white;
	text-decoration:none;

}

.detailWasser{
	display:block;
	color:#18a096;
	background: #17394c;
	background: -moz-linear-gradient(-45deg, #17394c 15%, #102937 100%);
	background: -webkit-linear-gradient(-45deg, #17394c 15%,#102937 100%);
	background: linear-gradient(135deg, #17394c 15%,#102937 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#17394c', endColorstr='#102937',GradientType=1 );
	overflow-y: auto;
}
.detailLuft{
	display:block;
	/*color:#18a096;
	color:#17394c;*/
	color:#dddddd;
	background: #16707a;
	background: -moz-linear-gradient(-45deg, #16707a 15%, #0e484e 100%);
	background: -webkit-linear-gradient(-45deg, #16707a 15%,#0e484e 100%);
	background: linear-gradient(135deg, #16707a 15%,#0e484e 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#16707a', endColorstr='#0e484e',GradientType=1 );
	overflow-y: auto;
}
.detailFeuer{
	display:block;
	/*color:#18a096;
	color:#17394c;*/
	color:#e74b3e;
	background: #991329;
	background: -moz-linear-gradient(-45deg, #991329 15%, #560a17 100%);
	background: -webkit-linear-gradient(-45deg, #991329 15%,#560a17 100%);
	background: linear-gradient(135deg, #991329 15%,#560a17 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#991329', endColorstr='#560a17',GradientType=1 );
	overflow-y: auto;
}
.detailFeuer h3{
	color:#e74b3e;
}
.detailErde{
	display:block;
	/*color:#18a096;
	color:#17394c;*/
	color:#ad774c;
	background: #534237;
	background: -moz-linear-gradient(-45deg, #534237 15%, #2f251f 100%);
	background: -webkit-linear-gradient(-45deg, #534237 15%,#2f251f 100%);
	background: linear-gradient(135deg, #534237 15%,#2f251f 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2f251f', endColorstr='#560a17',GradientType=1 );
	overflow-y: auto;
}
.detailErde h3{
	color:#ad774c;
}

.detail-button-wrapper{
	width: 100%;
	/*border:1px solid green;*/
	text-align:center;

}
.detail-note-001{
	font-size:10px;


}

.detail-com{
	background: url(../com/banner-01-test-ani.gif) left top no-repeat;
	width:100%;
	height:272px;
}
.com-label{
	background-color:white;
	color:blue;
	font-size:10px;
	width:60px;

}

.details-row{
	
	display:flex;
	flex-direction:row;
	flex-direction:row;
}
.btn_close{
	margin-left:auto;

}
	
.labelCloseBtn {
    width: 24px;
    height: 24px;
    margin-right: 16px;
    text-indent: -30000px;
    overflow: hidden;
    opacity: 0.54;
    -webkit-transition: opacity 0.333s cubic-bezier(0, 0, 0.21, 1);
    transition: opacity 0.333s cubic-bezier(0, 0, 0.21, 1);
    border: none;
    outline: none;
    cursor: pointer;
    background: url(../images/ic_add_white_24px.svg) center center no-repeat; 
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);	
}	
	


.install-btn{
	background-color:white;
	margin:6px;
	font-size:14px;
	font-weight:bold;
}	

/*Centofix*/


.quest{
	font-size:24px;
	font-weight:normal;
	margin-top:5px;
	text-align:left;
	border-bottom: 1px solid #ccc;
}
.zwischenrechnung{
	font-size:16px;
	text-align:left;
	border-top: 1px solid #ccc;
}
.quest input{
	/*width:60px;*/
	width: 55px;
	border:0px;
	text-align:center;
	
}

.cmd{
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
	border:0px solid #ccc;
	
}
.cmd input{
	height:100%;
	width:100%;
	font-size:48px;
	text-align:center;
	background: #d7d7d7;
	border:0px;
	
}

.cmdbox{
	width: 50%;
	height: 100px;
	margin: 2px;
}
.cmdbox.a{
	/*background: green;*/
	
}

.cmdbox.b{
	/*background: blue;*/

}
.wakeupCentofix {
	text-align:center;
	margin-bottom:20px;
	margin-top:20px;
}

.ergebnis_cmd{
	font-size:14px;
	color:black;
	font-weight:bold;
}
.ergebnis_cmd_final{
	font-size:44px;
	color:#3ca8f1;
	font-weight:bold;
}

.proz_res{
	font-size:14px;

}

.fbtnEstimate {
  /*background: #3498db;*/
  /*background: #517df6;*/
  background: #10598E;
  /*
  background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
  background-image: -moz-linear-gradient(top, #3498db, #2980b9);
  background-image: -ms-linear-gradient(top, #3498db, #2980b9);
  background-image: -o-linear-gradient(top, #3498db, #2980b9);
  background-image: linear-gradient(to bottom, #3498db, #2980b9);
  */
  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 2px 9px 1px rgba(0, 0, 0, 0.12), 0 4px 2px -2px rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 4;
  -moz-border-radius: 4;
  border-radius: 4px;
  color: #ffffff;
  font-size: 14px;
  font-weight: bold;
  padding: 6px 10px 6px 10px;
  text-decoration: none;
  text-align: center;
}

.fbtnRedButton {
  /*background: #3498db;*/
  /*background: #517df6;*/
  background: red;
  /*
  background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
  background-image: -moz-linear-gradient(top, #3498db, #2980b9);
  background-image: -ms-linear-gradient(top, #3498db, #2980b9);
  background-image: -o-linear-gradient(top, #3498db, #2980b9);
  background-image: linear-gradient(to bottom, #3498db, #2980b9);
  */
  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 2px 9px 1px rgba(0, 0, 0, 0.12), 0 4px 2px -2px rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 4;
  -moz-border-radius: 4;
  border-radius: 4px;
  color: #ffffff;
  font-size: 14px;
  font-weight: bold;
  padding: 6px 10px 6px 10px;
  text-decoration: none;
  text-align: center;
}

.fbtnCentofix {
  /*background: #3498db;*/
  /*background: #517df6;*/
  background: #10598E;
  /*
  background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
  background-image: -moz-linear-gradient(top, #3498db, #2980b9);
  background-image: -ms-linear-gradient(top, #3498db, #2980b9);
  background-image: -o-linear-gradient(top, #3498db, #2980b9);
  background-image: linear-gradient(to bottom, #3498db, #2980b9);
  */
  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 2px 9px 1px rgba(0, 0, 0, 0.12), 0 4px 2px -2px rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 4;
  -moz-border-radius: 4;
  border-radius: 4px;
  color: #ffffff;
  font-size: 14px;
  font-weight: bold;
  padding: 6px 10px 6px 10px;
  text-decoration: none;
  text-align: center;
}
.fbtnCentofix:hover {

}

.feedback{
  max-width:580px;
  margin:20px;
  padding:5px;
}
.feedbackheadline{
	font-size:18px;
	font-weight:normal;
	margin-top:-5px;
}
.feedbackquest{
	font-size:14px;
	padding-bottom:15px;	
}
.feedbackresponse{
	margin:10px;
}
.btnfeedback {
  background: #ccc;	
  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 2px 9px 1px rgba(0, 0, 0, 0.12), 0 4px 2px -2px rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 4;
  -moz-border-radius: 4;
  border-radius: 4px;
  color: #444;
  font-size: 14px;
  font-weight: bold;
  padding: 6px 10px 6px 10px;
  text-decoration: none;
  text-align: center;
  /*margin:5px;*/
}
.btnfeedback:hover {
  background: #3ca8f1;
  color:#ffffff;
}

.btnAutofix {
  background: #fff;	
  box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 2px 9px 1px rgba(0, 0, 0, 0.12), 0 4px 2px -2px rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 4;
  -moz-border-radius: 4;
  border-radius: 4px;
  color: #444;
  font-size: 14px;
  font-weight: bold;
  padding: 6px 10px 6px 10px;
  text-decoration: none;
  text-align: center;
  /*margin:5px;*/
}
.btnAutofix:hover {
  background: #3ca8f1;
  color:#ffffff;
}

.infofooter{
	font-size:12px;
	color:#aaa;
	max-width: 580px;
	border-top:1px solid #ccc;
	text-align:center;

}

.footer-navigation{
	background-color:#e2e2e2;
	width: 100%;
	text-align:left;	
    border-top:1px solid gray;
    padding: 25px;

}

.standard_h1{
	font-size:32px;
	color:#6b6b6b;
	margin-left:20px;
	font-weight:normal;
}
.standard_h2{
	font-size:24px;
	color:#6b6b6b;
	font-weight:normal;
}
.standard_h3{
	font-size:20px;
	color:#6b6b6b;
	font-weight:normal;
}
.prozentrechner_h2{
	font-size:24px;
	font-weight:normal;
}
.prozentrechner_h3{
	font-size:20px;
	font-weight:normal;

}
.prozentrechner_ergebnis{
	font-size:16px;
	font-weight:bold;

}

.schaltprozent_img_figure{
	content:url("https://centofix.app/media/Schaltprozente-preview.png");
}