﻿
/*=========Banner======================================*/
/*Vorder- Hintergrundfarbe*/
 #ac_cookiebanner {background-color:#808080!important; color:#fff!important; text-align:left!important; }
 /*Banner Schriftgröße Text*/
 #ac_cookiebanner p {font-size:16px;}
 #ac_cookiebanner p {color:#fff!important; }
 #ac_cookiebanner h2 {color:#fff!important;margin:15px 0px 0px 15px; font-size:22px;}
 /*Banner Schriftgröße Buttons*/
 #ac_cookiebanner .ac_button  {font-size:16px;}
 /*Akzeptieren*/    #ac_cookie_ok { background-color:#fff; color:#000; border:1px solid #fff!important;}
 /*Einstellungen*/  #ac_cookie_einstellung { background-color:#dadada; color:rgba(0, 0, 0, 0.8); border:1px solid #fff!important;}
 /*Informationen*/  #ac_cookie_more { background-color:#dadada; color:rgba(0, 0, 0, 0.8); border:1px solid #fff!important;}
.ac_stufe {font-size:16px!important;}
/*=========Popup======================================*/
/*Vorder- Hintergrundfarbe*/
 #ac_cookiepop {background-color:#fff; text-align:left!important;}
/*===============================================*/



#ac_blende {width:100vw; display:none; height:100vh; position:fixed; background-color:rgba(0, 0, 0, 0.66); z-index:9999999999999999999999;}
  #ac_cookiebanner,#ac_cookiepop,
  #ac_cookiebanner p ,#ac_cookiepop p,
  #ac_cookiebanner h2,#ac_cookiepop h2 {/*font-family:'pt_sansregular'!important;*/}
  #ac_cookiepop h2 {font-size:24px;margin-bottom:20px;}
  #ac_cookiepop h3 {font-size:18px;margin-bottom:20px;}
  #ac_cookiepop p {font-size:16px;}
  
  #ac_cookiebanner { position:fixed!important;z-index:999999999999999999;
                  height:auto;width:calc(100% - 40px);  max-width:700px;
                  left:20px;bottom:20px;                  
                -webkit-box-shadow: -8px 8px 10px -6px rgba(0,0,0,0.44);
                -moz-box-shadow: -8px 8px 10px -6px rgba(0,0,0,0.44);
                box-shadow: -8px 8px 10px -6px rgba(0,0,0,0.44);
                -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */
}
  #ac_cookiebanner .ac_button {float:right; padding: 7px 20px 7px 20px; margin:15px;cursor:pointer;}
  #ac_cookiebanner p { margin:15px 15px 35px 15px ;}
  #ac_cookiebanner #ac_cookie_ok {float:left;}

  #ac_cookiebanner a {text-decoration:none;}


 /*=======popup===================================================================*/
 #ac_cookiepop   { position: fixed;    left: 50%;    transform: translate(-50%, 0);
                position:fixed; top:50px; border:1px solid rgba(0,0,0,0.44);
                z-index:999999999999999999999999999999999999999!important; display:none;
                width:80%; max-width:800px;height:auto; padding:20px;
                
                overflow:auto; max-height:90vh;
    
    -webkit-box-shadow: -8px 8px 10px -6px rgba(0,0,0,0.44);
    -moz-box-shadow: -8px 8px 10px -6px rgba(0,0,0,0.44);
    box-shadow: -8px 8px 10px -6px rgba(0,0,0,0.44);

    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */
 }


.ac_stufe {float:left;margin:2.15%;padding:30px;width:29%;border:1px solid #fff;font-size:18px;cursor:pointer;
           -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */
}
 
.ac_stufe_info {float:left;margin:2%;padding:10px;width:46%;border:1px solid #fff;-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */}

#ac_cookiepop #ac_stufe_1 ,#ac_cookiepop #ac_stufe_2,#ac_cookiepop #ac_stufe_3 {
    background-color:rgba(204, 204, 204, 0.45);
    border:1px solid #000;border-radius:150px;}
#ac_cookiepop #ac_stufe_1:hover ,#ac_cookiepop #ac_stufe_2:hover,#ac_cookiepop #ac_stufe_3:hover { background-color:rgba(204, 204, 204, 0.1);}

/*#ac_cookiepop #ac_stufe_2:hover:before,
#ac_cookiepop #ac_stufe_3:hover:before {content: '\?\00A0\00A0';}*/

#ac_cookiepop #ac_stufe_1 {}
#ac_cookiepop #ac_stufe_2 {}
#ac_cookiepop #ac_stufe_3 {}

#ac_regler{text-align:center;border:2px solid #000;padding:20px 10px 15px 20px ;
           border-radius:50px; background-color:rgba(204, 204, 204, 0.1);
            height:102px;margin-top:-111px;padding-top:0px;-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */}

#ac_regler {width:100%; transition: width 1s; }
#ac_regler.ac_s1_active {width:33.3333333%;}
#ac_regler.ac_s2_active {width:66.6666666%;}
#ac_regler.ac_s3_active {width:100%;}

#ac_stufe_1_wrapper{float:left; }
#ac_stufe_2_wrapper{float:left; }

#ac_stufe_info_2 p ,#ac_stufe_info_1 p {margin:0px 0px 10px 0px; line-height:120%;clear:both;}
#ac_stufe_info_1 p:before {content: '\e804\00A0\00A0';font-size:18px;font-family: 'fontello';padding-bottom:2px;margin-top:2px;float:left; color:#1bac2e;}
#ac_stufe_info_2 p:before {content: '\2715\00A0\00A0';font-size:14px;font-family: 'fontello';padding-bottom:2px;margin-top:2px;float:left; color:#f51f1f;}

.ac_stufe:before {font-family: 'fontello';  
     content: '\2715\00A0\00A0\00A0\00A0';font-size:18px;line-height:80%; color:#f51f1f; /*icon-cancel-4*/
     /*content: '\e04e\00A0\00A0\00A0\00A0';font-size:20px;line-height:80%; /*icon-cancel-3*/*/
     /*content: '\274c\00A0\00A0\00A0\00A0';font-size:24px;line-height:80%;/*icon-cancel-2*/*/
    /*content: '\e809\00A0\00A0\00A0\00A0';font-size:26px;line-height:70%;/*icon-cancel-1*/*/
    /*content: '\e803\00A0\00A0\00A0\00A0';font-size:30px;line-height:50%;/*icon-cancel*/*/
 }
.ac_stufe.aktiv:before {font-family: 'fontello';    
   content: '\e804\00A0\00A0\00A0';font-size:24px;line-height:80%; color:#1bac2e;/*icon-ok-1
     /*content: '\e808\00A0\00A0\00A0\00A0';font-size:24px;line-height:80%; /*icon-ok-2*/
    /*content: '\e070\00A0\00A0\00A0\00A0';font-size:24px;line-height:80%;/*icon-ok-3*/*/
     /*content: '\2713\00A0\00A0\00A0\00A0';font-size:24px;line-height:80%; /*icon-ok-4*/*/
    }

#ac_close {float:right; margin: -5px -20px 0px 0px; position:relative; z-index:9999999;   }
#ac_close:before {  content: '\2715\00A0\00A0\00A0\00A0';font-size:18px;font-family: 'fontello';  }

#ac_speichern {border:1px solid #000;cursor:pointer; background-color:#1bac2e; float:right; padding:5px 20px 5px 20px;color:#fff;font-size:16px;
               -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */
}


@media (max-width: 1024px) {
    /*body {background-color:#f00;}*/
    #ac_cookiepop   {width:100%;}
}

@media (max-width: 800px) {
    /*body {background-color:#f00;}*/
    #ac_cookiepop .ac_stufe  {width:98%; }
#ac_regler {width:100%; transition: height 1s;margin-top:-175px;border-radius:30px;padding:0px; }
.ac_stufe { margin:5px 1% 5px 1%;padding:10px 20px 10px 20px ;width:29%;border:1px solid #fff;font-size:18px;cursor:pointer;}
#ac_regler.ac_s1_active {width:100%;height:61px;}
#ac_regler.ac_s2_active {width:100%;height:118px;}
#ac_regler.ac_s3_active {width:100%;height:178px;}
#ac_speichern{margin-bottom:80px;}
}


@media (max-width: 440px) {
    /*body {background-color:#f00;}*/
      #ac_cookiebanner .ac_button {float:left!important; }

}

/*===================== NUR 2 STUFEN ==============================*/
#ac_stufe_2 {display:none;}
#ac_stufe_1 {width:45.6%;}
#ac_stufe_3 {width:45.6%;}

#ac_regler.ac_s1_active {width:50%;}
#ac_regler.ac_s2_active {width:50%;}
#ac_regler.ac_s3_active {width:100%;}

@media (max-width: 800px) {
    #ac_regler{margin-top:-111px;}
    #ac_regler.ac_s1_active {width:100%;height:61px;}
    #ac_regler.ac_s2_active {width:100%;height:118px;}
    #ac_regler.ac_s3_active {width:100%;height:118px;}
}
