html { height:100%;  width:100%; }
body { height:100%; width:100%; font-family: 'Open Sans', sans-serif; /* background-color:#3b444d; */ background-color:#f3f3f3;}
img { vertical-align:text-bottom; max-width:100%; }	

body, div, td, p { color:#727272; font-size:16px; line-height:1.7; letter-spacing:0px; font-weight:400;  }
ul { line-height:1.5;  /* list-style-image: url('/images/list.png'); list-style-type: circle; */  padding-left:20px; }

/*
mittleres blau
83aedb

helle blau
b0c7de
*/


h1  {  font-family: 'Open Sans', sans-serif; margin:0 0 30px 0; padding:0 0 10px 0; font-size:30px; color:#274d72; font-weight:bold; }
h2  {   font-family: 'Open Sans', sans-serif; margin:0 0 30px 0; padding:0 0 10px 0; font-size:26px; color:#274d72; font-weight:bold; }
h3  {  margin:0 0 0px 0; padding:0px; font-size:20px; color:#000;  font-weight:bold;  line-height:1.2; }
h4  {  margin:0 0 5px 0; padding:0px; font-size:16px; color:#274d72; font-weight:600; }
h5  {  font-family: FFDINWebProBold; font-weight:normal; margin:0 0 10px 0; padding:0px; font-size:30px; color:#bfccdf;  text-align:center;  letter-spacing:1px; }
ul { list-style-type: square; }
ul {  margin: 0; }
ul > li {  list-style-type:square;   }
.centerv { position: absolute;    top: 50%;    transform: translateY(-50%);     }

a:link,a:visited { color:#4B516E; text-decoration:none; transition:0.5s; }
a:hover { text-decoration:none; color:#86b2de; }

.raum-active .raum-navi-left-right a { color:#83aedb !important; }
.clear { clear:both; padding:0px !important; }
.textleft { text-align:left; }
.centerv { position: absolute;    top: 50%;    transform: translateY(-50%);     }
.centerh, .center { text-align:center; }
.width100 { width:100%; }

.content { max-width:1280px; background-color:#e9e9e9; margin:0 auto; }
.content-inner { padding-top:40px; padding-bottom:80px; }
.content-inner-white { padding-top:80px; padding-bottom:80px; background-color:#fff; }
.content-inner-blue { padding-top:80px; padding-bottom:80px; background-color:#274d72;  color:#fff; }
.content-inner-blue div { color:#fff;   }
.empf li { margin-bottom:20px; }
.content-inner-spacing2 { padding-top:80px; padding-bottom:80px; }
.button-berechnung:link, .button-berechnung:visited { border:1px solid #9c9d9d; color:#9c9d9d; text-align:center; display:block; float:left; width:22%; padding:10px 0px; border-radius:14px; font-size:14px; letter-spacing:1px; text-transform:uppercase; font-weight:600;  }
.button-berechnung:hover, .button-berechnung-active:link, .button-berechnung-active:visited { border-color:#00496d; color:#00496d; }
.button-berechnung-spacer { width:4%; display:block; float:left;  }
.button-berechnung-noaction:link, .button-berechnung-noaction:visited { point-events:none !important; opacity:0.7 !important;  cursor:default; }
.button-berechnung-noaction:hover { border:1px solid #9c9d9d !important; color:#9c9d9d !important; }
.buttons { margin-bottom:50px;  }
.spacer-start1 { height:50px; }

.schritt { background-color:#fff; text-align:center; padding:40px 0 35px 0; }
.berechnungsart { padding:40px 100px; color:#fff; background-image:url(../images/verlauf1.png); background-size:cover; cursor:pointer; transition:1s;  }
.berechnungsart:hover { color:rgba(160,179,215,1); }
.berechnungsart-active { color:rgba(160,179,215,1); } 
.berechnung-gross { font-size:22px; font-family: FFDINWebProBold; display:inline-block; margin-right:10px; vertical-align:middle; }
.berechnungsart img {  max-width:30px; vertical-align:middle; margin-right:20px; margin-bottom:5px; }
.berechnungsart-spacer { height:2px; }
.berechnungform { padding-top:50px; padding-bottom:50px; background-color:#fff; background-image:url(../images/pfeil_blau.png); background-position:center top; background-repeat:no-repeat; }

.padding-left-right { padding-left:100px; padding-right:100px; }
.berechnungform { display:none; }

.footer-2 {    padding: 20px 138px; border-top:2px solid #fff; }
.content-blue {    background-color: #83aedb; }
.a-footer2:link, .a-footer2:visited {    color: #fff;    display: block;    font-size: 13px;    font-weight: 600;    line-height: 2; }
.a-footer2:hover { color: #284e75; }
.input { background-color:#e9e9e9; padding:3px 10px; font-size:16px; color:#5b5b5b; width:100%; border:1px solid #e9e9e9; }
.button:link, .button:visited { background-color:#264e72; color:#fff !important; width:100%; padding:10px; text-align:center; display:inline-block; font-weight:700; }
.button:hover { background-color:#83aedb; }

.button-arrowback { background-image:url(../images/Pfeil_links.png); background-size:30px 30px; background-position:left 14px top 9px; background-repeat:no-repeat; }
.button-arrow { background-image:url(../images/Pfeil.png); background-size:30px 30px; background-position:right 14px top 9px; background-repeat:no-repeat; }
.button-save { background-image:url(../images/Speichern.png); background-size:30px 30px; background-position:right 14px top 9px; background-repeat:no-repeat; }
.button-x { background-image:url(../images/X.png); background-size:30px 30px; background-position:right 14px top 9px; background-repeat:no-repeat; }
.button-half1 { width:50% !important; border-right:1px solid #fff; float:left; }
.button-half2 { width:50% !important; border-left:1px solid #fff; float:left; }

.fontblausmall { font-size:14px; color:#274d72; }
.spacer-befor-button { height:40px; }
.row-margin { margin-bottom:20px; }

.eklasseauswahl { cursor:pointer; }
.eklasse { width:33px; height:33px; margin-right:10px; display:block; float:left;  }
.eklasselabel { width: calc(100% - 43px); float:left; background-color:#e9e9e9; color:#5b5b5b; padding:3px 10px; display:block; }


.eklasse1, .eklasselabel1 { background-color:#007c10; color:#fff; }
.eklasse2, .eklasselabel2 { background-color:rgba(115,188,55,1); color:#fff; }
.eklasse3, .eklasselabel3 { background-color:rgba(245,227,30,1); color:#fff; }
.eklasse4, .eklasselabel4 { background-color:rgba(195,42,42,1); color:#fff; }
.eklasselabelInaktiv {   background-color:#e9e9e9;  color:#5b5b5b;  }

.projekt-titel { width:calc(100% - 140px); background-color:#e8e8e8; height:117px;  float:left;  }
.projekt-titel div,.ergebnis-titel div { font-size:26px; color:#274d72; padding-top:35px; font-weight:700; }
.projekt-bearbeiten { width:140px; border-left:2px solid #fff; height:117px; background-color:#e8e8e8; padding-top:30px; float:left; text-align:center; font-size:14px;} 
.projekt-bearbeiten:link, .projekt-bearbeiten:visited { color:#274d72; transition:0.3s;  }
.projekt-bearbeiten:hover { background-color:#83aedb; color:#fff !important;}
.projekt-bearbeiten div { color:#274d72; }
.projekt-bearbeiten:hover div { color:#fff; }

.projekt-bearbeiten span { font-size:28px; display:block; margin:0 auto 10px 0;  }
.raum { border-bottom:2px solid #fff; }
.raum-navi-left  { width:calc(100% - 280px); float:left; height:117px; background-color:#274d72; color:#83aedb;  background-image: url(../images/verlauf1.png);
    background-size: cover; }

.ergebnis-titel { width:100%; background-color:#e8e8e8; height:117px;   }
.objektlabel1 { width:60%; background-color:#e8e8e8; padding:3px 10px; float:left; border-right:1px solid #fff; }
.objektlabel2 { width:40%; background-color:#e8e8e8; padding:3px 10px; float:left; }
.objektlabel3 { width:100%; background-color:#e8e8e8; padding:3px 10px;  }

.table-eregbnis { width:100%; }
.ergebnis-head { background-color:#274d72; padding:8px 12px; color:#fff; text-align:center }
.ergebnis-left { text-align:left; }
.ergebnis-raum { background-color:#e8e8e8; padding:8px 12px;  }
.ergebnis-cell {  padding:8px 12px; text-align:center;  }
.ergebnis-link { }
.aEdit-Ergebnis:link, .aEdit-Ergebnis:visited { display:block; width:100%; height:100%; background-color:#274d72; padding:8px 12px; color:#fff; text-align:center; }
.aEdit-Ergebnis:hover { background-color:#83aedb; color:#fff;  }
.raum-navi-left-left { color:#fff; width:70%; float:left; padding-top:42px; font-size:26px; font-weight:700; line-height:1.2  }
.raum-navi-left-right { color:#fff; width:30%; float:left; padding-top:47px; }
.table-eregbnis, .table-eregbnis td {
   border: 1px solid #dadada;
}
.ergebnis-line { margin-top:20px; height:1px; border-bottom:2px solid #274d72;  }

.ergebnis-wrapper { background-color:#e8e8e8; }
.ergebnis-erg2 { float:right; width:30%; background-color:#e8e8e8; padding:15px; text-align:center; }
.span-ergebnis { font-size:36px; color:#274d72; font-weight:700;  }
.span-ergebnis2 { font-size:26px; color:#274d72; display:inline; margin-left:5px;  }
.ergebnis-erg1 { float:left; width:70%; padding-left:20px;  }

.buttonSend { height:200px; background-color:#274d72; color:#fff; cursor:pointer; text-align:center; font-size:20px;  width:33.333333%; float:left; font-weight:600; line-height:1.3; }
.buttonSend:hover { background-color:#83aedb; } 
.buttonSend span { font-size:56px; display:block; margin-top:30px; margin-bottom:20px; }
.buttonSend-border { border-right:1px solid #fff; }

.raum-inner { background-color:#e9e9e9; padding:30px 40px; }
.raum-inner .input { background-color:#fff; padding:3px 10px; font-size:16px; color:#727272; width:100%; border:1px solid #fff; }

.wand { color:#000; }
.wand1 { position:absolute; z-index:30; top:0px; left:0px; height:30px; width:100%; cursor:pointer; text-align:center; padding-top:3px; }
.wand2 { position:absolute; z-index:30; top:105px; right:-85px; height:30px; width:200px; cursor:pointer; text-align:center; padding-top:3px; 
         transform: rotate(90deg);
	
}
.wand3 { position:absolute; z-index:30; bottom:0px; left:0px; height:30px; width:100%; cursor:pointer; text-align:center; padding-top:2px; }
.wand4 { position:absolute; z-index:30; top:105px; left:-85px; height:30px; width:200px; cursor:pointer; text-align:center; padding-top:3px; 
         transform: rotate(-90deg);	
}


.overlay { position:fixed; top:0px; left:0px; background-color:rgba(255,255,255,0.9); width:100%; height:100%;  z-index:100; display:none; }
.overlay-inner { width:80%; background-color:#274d72; color:#fff; margin:0 auto; position:relative; padding:50px; }
.overlay-close { position:absolute; right:20px; top:15px; }
.overlay h2, .overlay div, .overlay a  { color:#fff;  }
.overlay-for-container { max-width:800px; margin:0 auto; }
.overlay input { background-color:#fff; }


.wandcolor1-0 { border-top:30px solid #83aed9; }
.wandcolor1-1 { border-top:30px solid #cc1315; }
.wandcolor1-2 { border-top:30px solid #ffe300; }

.wandcolor2-0 { border-right:30px solid #83aed9; }
.wandcolor2-1 { border-right:30px solid #cc1315; }
.wandcolor2-2 { border-right:30px solid #ffe300; }

.wandcolor3-0 { border-bottom:30px solid #83aed9; }
.wandcolor3-1 { border-bottom:30px solid #cc1315; }
.wandcolor3-2 { border-bottom:30px solid #ffe300; }

.wandcolor4-0 { border-left:30px solid #83aed9; }
.wandcolor4-1 { border-left:30px solid #cc1315; }
.wandcolor4-2 { border-left:30px solid #ffe300; }

.descWand1 { background-color:#83aed9; border:1px solid #fff; display:inline-block; margin-right:10px; width:15px; height:15px; }
.descWand2 { background-color:#cc1315; border:1px solid #fff; display:inline-block; margin-right:10px; width:15px; height:15px; }
.descWand3 { background-color:#ffe300; border:1px solid #fff; display:inline-block; margin-right:10px; width:15px; height:15px; }

.skizze-wrapper { position:relative; height:250px; width:100%; }
.skizze-colors {  height:100%; }
.skizze-overlay { position:absolute; z-index:10; border:1px solid #000; height:100%; width:100%; }
.skizze-overlay2 { position:absolute; z-index:20; border:1px solid #000;  margin:30px; height:calc(100% - 60px); width:calc(100% - 60px);  
                   background-color:#5c5c5c;  line-height:1.5;
                    color:#fff; padding: 25px; 
}
.skizze-overlay2 div { color:#fff; }

.raum-navi-inactive { opacity:0.1; pointer-events:none; }

.raum-delete { display:block; float:left; width:140px; border-left:2px solid #fff; height:117px; background-color:#274d72; padding-top:30px; text-align:center; color:#fff; }
.raum-bearbeiten { display:block; float:left; width:140px; border-left:2px solid #fff; height:117px; background-color:#274d72; padding-top:30px; text-align:center; color:#fff; }
.link-raum-navi:link, .link-raum-navi:visited { color:#fff; font-size:14px; transition:0.0s; }
.link-raum-navi:hover { background-color:#83aedb; }

.schritt  { display:none; }
.projekt-titel-navi { border-top:2px solid #fff; background-color:#fff }
.ergebnis-titel { border-top:2px solid #fff;  }

.aKatalog:link, .aKatalog:visited { color:#fff; font-weight:700; text-decoration: underline; }
.aKatalog:hover { text-decoration: none; }

.raum-bearbeiten span, .raum-delete span { font-size:28px; display:block; margin:0 auto 10px 0;   }
.raum-add { border:2px dotted #274d72; font-size:26px; padding-top:15px; height:117px; text-align:center; background-color:#fff; color:#274d72;font-weight:700; cursor:pointer; }
.raum-add-plus { font-size:50px; display:inline-block; vertical-align:middle; margin-bottom:6px; margin-left:20px;   }
.raum-add:hover { background-color:#83aedb; color:#fff }

.raum-active .raum-navi-left { background-image: none; }
.raum-active .raum-navi-left-left { color:#83aedb;   }
.raum-active .raum-navi-left-right { color:#83aedb; }
.raum-active .raum-bearbeiten{ background-color:#83aedb; }

.link-raum-navi div { color:#fff; }
@media only screen and (min-width: 990px) {
    .show-for-small { display:none; }
    .hide-for-small{ display:block; }
    
}
@media only screen and (max-width: 1200px) {

    .skizze-overlay2 { padding:15px; font-size:13px }
    .skizze-overlay2 div { font-size:13px }
}

@media only screen and (max-width: 989px) {
   .show-for-small { display:block; }
    .hide-for-small { display:none; }
    .icon-eli-angebot { font-size:40px !important; }
    .overlay-inner { width:100%; height:100%; padding:10px; font-size:14px; }
    .buttonSend {    height: auto;    background-color: #274d72;    color: #fff;    cursor: pointer;    text-align: center;    font-size: 16px;    
                     width: 100%;  border-top:2px solid #fff;  float: left;    font-weight: 600;    line-height: 1.3; padding-bottom:15px; }
    .buttonSend span {    font-size: 36px;    display: block;    margin-top: 10px;    margin-bottom: 10px; }
    .ergebnis-erg2 { font-size:20px; width:40%; padding-top:10px; padding-right:10px; padding-left:5px; text-align:right; width:auto; }
    .ergebnis-erg1 { font-size:20px; width:100%; padding-top:10px; padding-left:10px; width:auto; }
    .ergebnis-erg1 h2 { font-size:16px !important;  padding-top:10px !important; padding-bottom:0px; margin-bottom:0px }
    .span-ergebnis { font-size:25px; }
    .span-ergebnis2 { font-size:20px; }
    .objektlabel1 { width:35%; }
    .objektlabel2 { width:65%; }    
    .table-erg-wrapper { border-top:1px solid #274d72; padding:5px 0px; }
    .table-bearbeiten { width:40px; margin-bottom:5px; text-align:right; float:right }
    .table-erg-watt { font-weight:700; text-align:right; font-size:20px }
    .footer-2 { padding:10px 5px;  }
    .a-footer2 { font-size:14px !important; padding:5px 10px; }
    .button { font-size:14px;  }
    .button-save {    background-image:none }
    .button-half1, .button-half2 { width:100% !important; margin-bottom:20px; }
    .raum-inner { padding: 10px 15px }
    .skizze-overlay2 { padding:15px; font-size:13px }
    .skizze-overlay2 div { font-size:13px }
    .skizze-wrapper { margin-top:20px; }
    .raumlaengewrap { text-align:left !important; margin-bottom:10px; }
    .hide-for-small { display:none; }
body, div, td, p { font-size:15px;  }    
    .padding-left-right { padding-left:15px; padding-right:15px; }
    .button-berechnung:link, .button-berechnung:visited  { display:block; float:none; width:100%; }
    .button-berechnung-spacer { float:none; height:10px; }
    h1 { font-size:20px; line-height:1.5; }
    h5 { font-size:20px; }
    .berechnung-gross { font-size:18px; }
    .berechnungsart  { text-align:center; padding-top:20px; padding-bottom:20px;  }
    .berechnungsart img { margin-bottom:10px; }
    .eklasse { width:31px; height:31px;   }
    .eklasseauswahl:first-child { margin-bottom:20px; }

    .projekt-bearbeiten {    width: 40px;   height: 60px;   padding-top: 15px;  }    
    .projekt-titel {    width: calc(100% - 40px);    height: 60px;   }
    .projekt-titel div, .ergebnis-titel div {    font-size: 20px;     padding-top: 15px;  }
.projekt-bearbeiten span {    font-size: 20px;   }
    .raum-navi-left {    width: calc(100% - 80px);    float: left;    height: 80px;    }
    .raum-bearbeiten span, .raum-delete span {    font-size: 16px; margin-top:15px }    
    .raum-bearbeiten, .raum-delete {    width: 40px;      height: 80px;    padding-top: 15px; }
    .raum-navi-left-left { padding-top:15px; font-size:18px; width:100%; }
    .raum-navi-left-right {    width: 100%;    padding-top: 5px; }
    .raum-add {       padding-top: 0px; height: 95px; }    
}


@media only screen and (min-width: 600px) and (max-width: 989px) {
        .raum-bearbeiten, .raum-delete {    width: 70px;      height: 80px;    padding-top: 15px; }
        .raum-navi-left {    width: calc(100% - 140px);    float: left;    height: 80px; }
    .projekt-bearbeiten {    width: 70px;    height: 60px;    padding-top: 15px; } 
    .projekt-titel {    width: calc(100% - 70px);    height: 60px; }    
    .button-half1, .button-half2 { width:50% !important; margin-bottom:20px; }
    .overlay-inner { width:90%; height:auto; padding:50px; }
}

@font-face {
  font-family: 'ELI18_heizlastrechner';
  src:  url('fonts/ELI18_heizlastrechner.eot?su43e8');
  src:  url('fonts/ELI18_heizlastrechner.eot?su43e8#iefix') format('embedded-opentype'),
    url('fonts/ELI18_heizlastrechner.ttf?su43e8') format('truetype'),
    url('fonts/ELI18_heizlastrechner.woff?su43e8') format('woff'),
    url('fonts/ELI18_heizlastrechner.svg?su43e8#ELI18_heizlastrechner') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'ELI18_heizlastrechner' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-eli-pfeil:before {
  content: "\e905";
}
.icon-eli-stift:before {
  content: "\e906";
}
.icon-eli-angebot:before {
  content: "\e900";
}
.icon-eli-drucken:before {
  content: "\e901";
}
.icon-eli-email-senden:before {
  content: "\e902";
}
.icon-eli-pfeil-dreieck:before {
  content: "\e903";
}
.icon-eli-x:before {
  content: "\e904";
}

.show-for-print { display:none; }
@media print
{    
    html,body{height:100%;width:100%;margin:0;padding:0;}
    @page {
	max-height:100%;
	max-width:100%
	}
     .aKatalog { color:#274d72 !important; }
	 
    .no-print, .hide-for-print, .no-print *
    {
        display: none !important;
    }
    .footer-2 { display:none; }
    .show-for-print { display:block; }
    body {  margin: 0mm 0mm 0mm 0mm; }
    .content-inner-white { padding-top:10px; padding-bottom:10px; }
    .objektlabel1 { padding-left:0px; }
    .objektlabel1 { width:40%; }    
    .objektlabel2 { width:60%; }
    .schritt  { color:#274d72; padding: 10px 0 10px 0; }
    .schritt h5 { color:#274d72 }
    .content-inner-blue {    padding-top: 10px;    padding-bottom: 10px;    background-color: #fff;    color: #274d72;    }
    .content-inner-blue li { color: #274d72; }
    .content { max-width:100% !important; width:100% !important; margin:auto auto; }

}

@media print and (color) {
   * {
      -webkit-print-color-adjust: exact;
      print-color-adjust: exact;
   }
}
