* {
    box-sizing: border-box;
    
    margin:  0;
    padding: 0;
    
    font-family: 'Open Sans', verdana, sans-serif;

}


body{
    background-color: #f8fafc;
	
    font-size: 1.25rem;
    font-weight: 200;
    font-family: sans-serif;
    color: #2a2626;
}

img{
    vertical-align: bottom;
}

h1, h2, h3, h4, h5, h6{
    margin-bottom: 35px;
}
h1{font-weight: 300}
h2{font-weight: 300}
h3{font-weight: 300}
h4{font-weight: 300}
h5{font-weight: 300}
h6{font-weight: 300}



section{
    padding: 50px;
}
section.dark{
    background: #252526;
    
    color: #fff;
}
section .row{
    display: flex;
}



#cookieHinweis {
    text-align: center;
    padding: 28px 0 23px 0;
    color: #eeeeee;
    background: #454545;
}
#cookieHinweis p {
    color: #fcfcfc;
}
#cookieHinweis a {
    color: #268cd1;
    text-decoration: none;
}
#cookieHinweisCloser {
    padding: 10px 20px;
    color: #000;
    background: #f1d600;
    cursor: pointer;
    transition: all 0.5s;
}
@media (max-width: 632px){
    #cookieHinweis a {
        display: block;
    }
    #cookieHinweisCloser {
        display: block;
    }    
}
header {
    padding: 25px;
    background-color: #fff;
}
header div{
    text-align: center;
}
header > div img{
    width: 350px;
}

footer{
    padding: 30px;
    font-size: 1rem;
    color: #ffffff;
    background-color: #2a2626;
}
footer a{
    color: #ffffff;    
}


.willkommen > .row > .col{
    width: 50%;
}
.willkommen .row > .col > .inner{
    padding: 50px 50px;
}
.willkommen .row > .col > .inner .avatar{
    overflow: hidden;
    
    width:  300px;
    height: 300px;
    
    border-radius: 300px;
}
.willkommen .row > .col > .inner .avatar img{
    width: 100%;
}
@media (max-width: 632px){
    .willkommen > .row{
        flex-wrap: wrap;
    } 
    .willkommen > .row > .col{
        width: 100%;
    }  
    .willkommen .row > .col > .inner{
        padding: 0px;
    }
}


.immobilien-bewerten .row > .col{
    width: 100%;
}
.immobilien-bewerten .row > .col > .inner{
    padding: 50px 50px;
}
.immobilien-bewerten .row > .col > .inner{
    text-align: center;
    
    padding: 50px 50px;
}
@media (max-width: 632px){
    .immobilien-bewerten{
        padding: 10px 10px;
    }
    .immobilien-bewerten .row > .col > .inner{
        padding: 10px 10px;
    }   
}

.app .row{
    justify-content: center;
}
.app .row > .col > .inner{
    text-align: center;
    
    padding: 50px 50px;
}
.row > .col > .inner .qr-code{
    width: 250px;
}

.btn{
    display: inline-block;
    
    background: #fff;
    border: 1px solid #e6e7e8;

    color: #beaf87;

    text-decoration: none;
    
    transition: .3s;
    padding: 15px 30px;
}
@media (max-width: 632px){
    .btn{
        margin-bottom: 25px;
    }    
}


.transform-01 img{
    position: absolute;
    transition: all 1s;
}
.transform-01 img.bottom{
    opacity: 0;
    -webkit-transform: scale(0,0);
    -webkit-transform-origin: center center;
    -moz-transform: scale(0,0);
    -moz-transform-origin: center center;
    -o-transform: scale(0,0);
    -o-transform-origin: center center;
    transform: scale(0,0);
    transform-origin: center center;
}
.transform-01 img.top{
    opacity: 1;
    -webkit-transform: scale(1,1);
    -webkit-transform-origin: center center;
    -moz-transform: scale(1,1);
    -moz-transform-origin: center center;
    -o-transform: scale(1,1);
    -o-transform-origin: center center;
    transform: scale(1,1);
    transform-origin: center center;
}
.transform-01:hover img.bottom{
    opacity: 1;
    -webkit-transform: scale(1,1);
    -webkit-transform-origin: center center;
    -moz-transform: scale(1,1);
    -moz-transform-origin: center center;
    -o-transform: scale(1,1);
    -o-transform-origin: center center;
    transform: scale(1,1);
    transform-origin: center center;
}
.transform-01:hover img.top{
    opacity: 0;
    -webkit-transform: scale(0,0);
    -webkit-transform-origin: center center;
    -moz-transform: scale(0,0);
    -moz-transform-origin: center center;
    -o-transform: scale(0,0);
    -o-transform-origin: center center;
    transform: scale(0,0);
    transform-origin: center center;
}





/* hikelCOM Form ************************************************************* */
#hikelCOM_Form{
    padding: 25px 0 0 0;

    background: #252526;    

    font-size: 1.25rem;
    color: #fff;
}

#hikelCOM_Form .sec{
    display: none;
}

#hikelCOM_Form .sec-1{

    display: block;

}

#hikelCOM_Form fieldset{

    margin: 0 0 25px 0;
    padding: 50px 100px;
    
    border: 0;

}

#hikelCOM_Form fieldset > img{
    float: left;
    margin: 0 20px 10px 0;
	
    width: 45% !important;
    height: auto !important;
	
    border: 1px solid #c2c2c2;
}
#hikelCOM_Form label > img{
    width: 100% !important;
    height: auto !important;
	
    border: 1px solid #c2c2c2;
}

#hikelCOM_Form legend{
    display: block;

    width: auto;


    padding: 6px 15px;

    border: none;

    font-weight: 200;
    font-size: 2rem;
    color: #baaf87;
}

#hikelCOM_Form label{

    cursor: pointer;

}

#hikelCOM_Form label .chk-img{

    display: none;

}

#hikelCOM_Form label{
    display: inline-block;
    
    text-align: left;
    
    width: 45%;
    	
    margin-bottom: 30px;
}
#hikelCOM_Form button {
    font-size: 1rem;
    /* width: 45%; */
    line-height: 2rem;
    border: solid thin #fff;
    padding: 0 10px;
    background-color: transparent;
    color: #fff;
}
#hikelCOM_Form button:hover {
    border: solid thin #fff;
    background-color: transparent;
    color: #fff;
}

#hikelCOM_Form select {
    display: inline-block;

    width: 100%;
    
    margin: 0 0 10px 0;
    padding: 0 0 0 10px;
	
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image:
    linear-gradient(45deg, transparent 50%, #ffffff 50%),
    linear-gradient(135deg, #ffffff 50%, transparent 50%),
    linear-gradient(to right, #2a2626, #2a2626);
    background-position:
    calc(101% - 20px) calc(1em - 2px), calc(101% - 10px) calc(1em - 2px), 100% 0;
    background-size:
    10px 10px,
    10px 10px,
    2.5em 2.5em;
    background-repeat: no-repeat;
    cursor: pointer;
	
    font-size: 1rem;
    line-height: 2.25rem;
    
    background-color: #252526;
    color: #fff;
    
    border: solid thin #ffffff8f;
}


#hikelCOM_Form input[type="text"],
#hikelCOM_Form input[type="password"],
#hikelCOM_Form input[type="datetime"],
#hikelCOM_Form input[type="datetime-local"],
#hikelCOM_Form input[type="date"],
#hikelCOM_Form input[type="month"],
#hikelCOM_Form input[type="time"],
#hikelCOM_Form input[type="week"],
#hikelCOM_Form input[type="number"],
#hikelCOM_Form input[type="email"],
#hikelCOM_Form input[type="url"],
#hikelCOM_Form input[type="search"],
#hikelCOM_Form input[type="tel"],
#hikelCOM_Form input[type="color"]{
    display: inline-block;

    _width: 100%;
	
    padding: 0 0 0 10px;
        
    font-size: 1rem;
    line-height: 2.25rem;
    
    border: solid thin #ffffff8f;
    
    background-color: #252526;
    color: #fff;
}

#hikelCOM_Form .msg, #hikelCOM_Form .msg_err{

    display: none;

    margin: 0 0 15px 0;

    padding: 10px;

    text-align: center;

    color: #ffffff;

    background: lightsalmon;

    font-size: 16px;

}
#hikelCOM_Form .msg_err{
    display: block;

    margin: 0 0 15px 0;

    padding: 10px;

    text-align: center;

    color: #ffffff;

    background: lightsalmon;

    font-size: 16px;

}

#hikelCOM_Form .msg_ok{
    display: block;

    margin: 0 0 15px 0;

    padding: 10px;

    text-align: center;

    color: #ffffff;

    background: lightgreen;

    font-size: 16px;

}

#hikelCOM_Form .border{
    display: inline-block;
	width: 100%;
}

#hikelCOM_Form .radio-group fieldset input{
    position: absolute;

    z-index: -1;

    left: -2000px;

    visibility: hidden;

}

#hikelCOM_Form .radio-group fieldset span{
  display: block;

  padding: 5px;

  text-align: center;

  border-left: 1px solid #c2c2c2;
  border-right: 1px solid #c2c2c2;
  border-bottom: 1px solid #c2c2c2;

  color: #645d4d;
}

#hikelCOM_Form .radio-group fieldset label{
    width: 20%;
}
#hikelCOM_Form .radio-group fieldset label:nth-last-child(1){
    margin-right: 0px;
}

#hikelCOM_Form .table{
    display: table;
    width: 100%;
    padding: 0 0 30px 0;
}
#hikelCOM_Form .table > p{
    display: table-row;

    transition: background 0.5s, color 0.5s;
}

#hikelCOM_Form .table > p:nth-child(2n+1){
    _background: #faf9f7;

}
#hikelCOM_Form .table > p:nth-child(2n+2){
    _background: #f2f1f0;

}
#hikelCOM_Form .table > p > span{
    display: table-cell;

    padding: 10px 20px;
    
    border-bottom: solid thin #fff;
}

#hikelCOM_Form .table > p:hover{
    background: #2a2626;
    color: #ffffff;
}
#hikelCOM_Form .table > p:hover > span button{
    color: #baaf87;
    background: #baaf8740;
    border: solid thin #baaf87;
}
#hikelCOM_Form .w45{
    width: 45%;
}
#hikelCOM_Form .w45 input{
    width: 100%;
}

.antwort{
	padding: 30px;
	
	text-align: center;
	
	background-color: #fff;
}

@media (max-width: 632px){

    #hikelCOM_Form fieldset {
        margin: 0 0 25px 0;
        padding: 50px 10px;
        border: 0;
    }
    #hikelCOM_Form fieldset > img{
        float: none;
        margin: 0 0px 10px 0;

        width: 100% !important;
        height: auto !important;

        border: 1px solid #c2c2c2;
    }
    #hikelCOM_Form label{
        display: inline-block;

        text-align: left;

        width: 100%;

        margin-bottom: 30px;
    }

    #hikelCOM_Form input[type="text"], #hikelCOM_Form input[type="password"], #hikelCOM_Form input[type="datetime"], #hikelCOM_Form input[type="datetime-local"], #hikelCOM_Form input[type="date"], #hikelCOM_Form input[type="month"], #hikelCOM_Form input[type="time"], #hikelCOM_Form input[type="week"], #hikelCOM_Form input[type="number"], #hikelCOM_Form input[type="email"], #hikelCOM_Form input[type="url"], #hikelCOM_Form input[type="search"], #hikelCOM_Form input[type="tel"], #hikelCOM_Form input[type="color"] {      
        width: 85%;
        padding: 0 0 0 10px;
    }
    #hikelCOM_Form .radio-group fieldset label {
        width: 45%;
    }
    #hikelCOM_Form .w45 {
        width: 100%;
    }
    #hikelCOM_Form .table,
    #hikelCOM_Form .table > p,
    #hikelCOM_Form .table > p > span{
        display: block;
    }

}

/* ENDE: hikelCOM Form ******************************************************* */


/*Progressbar*/
.graph {
    width: auto; /*Rahmen*/
    height: 1.5rem;
    background-color: rgba(128,130,133,.3);
    position: relative;
    margin: 0px 25px 25px 25px;
}
.bar {
    height: 1.5rem; /* Fortschrittsbalken */
    background: #beaf87;
}
.bar p {
    position: absolute;
    text-align: center;
    width: 100%;
    margin: 0;
    font-size: 1rem;
    line-height: 1.5rem;
    color: #fff;
}
.bar p .left{
    float: left;
    padding: 0 0 0 4px;
}
.bar p .right{
    float: right;
    padding: 0 4px 0 0;
}
/*Ende Progressbar*/


  
/* datenschutzerklaerung *******************************************************/
.datenschutzerklaerung{
        
    text-align: left;

}
.datenschutzerklaerung li{
        
    margin-bottom: 10px; 

}
.datenschutzerklaerung .bold{
        
    font-weight: bold; 

}
.datenschutzerklaerung .title{
        
    margin: 0 0 10px 0; 

}
.datenschutzerklaerung .txt,
.datenschutzerklaerung .txt{
    
        
    font-weight: normal; 

}