/*
______________________________________________________________________________
   |       |
   | knipp |           Knipp Medien und Kommunikation GmbH
    -------


    www2014

    Copyright (C) by Knipp Medien und Kommunikation GmbH

    initial author:    Markus Fischer
    version:           $Revision: 19985 $
                       $Date: 2020-02-03 16:19:47 +0100 (Mon, 03 Feb 2020) $
                       $Author: markus.fischer $
*/


/* styles for the cookie consent notification and cookie settings page */

/* -- help for obejct - color assignment -- */
/*
## Cookie Notification
(bg)      custom-gray-lighter - kcitblLighterBlue - #E5EAF4;
(fg/text) gray-darker - kcitblDeepBlue - #00308F;
(btn-cs)  knipp-domains-color - kcitblOrange - #FFB400;
(btn-no)  knipp-it-es-color - kcitblBlue - #7F97C7;
(btn-ok)  knipp-labs-color - kcitblDeepBlue - #00308F;

## Cookie Settings
(bg lang select)  knipp-darkgray - pre - #6C6C6C;
(fg lang select)  sky-gray - kcitblLighterGrey - #F3F3F3;
(fg/text)         knipp-darkgray - pre - #6C6C6C;
(btn-save)        knipp-blue - kcitblDeepBlue -


kcitblLightBlue - #E5EAF4;
kcitblLighterBlue - #F1F3F9;
kcitblBlue - #7F97C7;
kcitblDeepBlue - #00308F;
kcitblOrange - #FFB400;
kcitblLightOrange - #FFE6B3;
kcitblLighterOrange - #FFECC5;
kcitblLightGrey - #EAEAEA;
kcitblLighterGrey - #F3F3F3;
pre - #6C6C6C;

*/

/* ----- general layout styles ----- */

.cookieconsent-notify a, .cookieconsent-overlay a, .cookieconsent-enforce a, .cookieconsent-change-settings a {
	 text-decoration: underline;
}
 div.cc-button-phalanx {
	 overflow: hidden;
}
/* cookie notification animation */
 @keyframes moveIn {
	 0% {
		 opacity: 0;
	}
	 25% {
		 opacity: 0;
	}
	 100% {
		 opacity: 1;
	}
}
 #cookie-notice-title {
	 display: none;
	/* use title in enforce mode only / keep notification bar small */
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_head .cc_cs_head_lang {
	/* display: none;
	 */
}
/* ----- layout: notify, notify-top ----- */
 .cookieconsent-notify {
	 background: #f10000;
	 color: #111;
	 position: sticky;
	 z-index: 9997;
   right: 0;
   left: 0;
	 bottom: 0;
	 padding: 30px;
	 transition: all ease 0.3s;
	 opacity: 1;
	 animation: moveIn 2s ease;
}
 .cookieconsent-notify.notify-top {
	 background: #f1f3f9;
	 color: #111;
	 top: 0;
	 right: 0;
	 bottom: auto;
	 left: 0;
	 width: 100%;
	 padding: 15px 30px 30px 30px;
	 transition: all ease 0.3s;
}
 .cookieconsent-notify.notify-top.scrolled {
	 position: fixed;
}
 .cookieconsent-notify.notify-top:after {
	 clear: both;
}
/* ----- layout: enforce ----- */
 .cookieconsent-overlay {
	 background: rgba(0, 0, 0, 0.7);
	 position: fixed;
	 top: 0;
	 left: 0;
	 width: 100%;
	 min-height: 100%;
	 overflow-y: auto;
	 z-index: 9995;
}
 .cookieconsent-enforce {
	 background: #eee;
	 color: #111;
	 position: relative;
	 top: 5vh;
	 right: 0;
	 left: 0;
	 max-width: 50%;
	 padding: 25px;
	 margin-bottom: 5vh;
	 margin-left: auto;
	 margin-right: auto;
	 z-index: 9996;
}
/* ----- cookie configuration page ----- */
 .cookieconsent-change-settings {
	 position: absolute;
	 margin: 30px auto;
	 width: 50%;
	 max-width: 90%;
	 height: auto;
	 left: 0;
	 right: 0;
	 z-index: 9997;
}
 .cookieconsent-change-settings .cc_cs_content {
	 width: 100%;
	 height: 100%;
	 margin: 0;
	 padding: 0;
	 position: relative;
	 display: flex;
	 flex-direction: column;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_head {
	 background: #fff;
	 display: block;
	 padding: 0 16px;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_head .cc_cs_head_title {
	 float: left;
	 display: flex;
	 min-height: 80px;
	 flex-direction: column;
	 justify-content: center;
	 padding-top: 50px;
	 color: #111;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_head .cc_cs_head_title h2, .cookieconsent-change-settings .cc_cs_content .cc_cs_head .cc_cs_head_title h5 {
	 display: flex;
	 margin: 0;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_head .cc_cs_head_lang {
	 float: right;
	 align-items: center;
	 padding-left: 25px;
	 justify-content: center;
	 z-index: 9998;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_head .cc_cs_head_lang select {
	 display: inline-block;
	 align-self: center;
	 color: #f3f3f3;
	 background-color: #6c6c6c;
	 border: none;
	 width: 140px;
	 height: 24px;
	 padding: 0;
   margin: 0;
	 z-index: 9999;
	/* -moz-appearance:none;
	 -webkit-appearance: none;
	 */
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_main {
	 background: #fff;
	 display: flex;
	 flex-direction: row;
	 align-items: stretch;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_cs_m_menu {
	 width: 150px;
	 margin: 0;
	 padding: 0;
	 background: #e6e6e6;
	 min-width: 150px;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_cs_m_menu li {
	 margin: 0;
	 padding: 0;
	 float: left;
	 display: block;
	 width: 100%;
	 color: #6c6c6c;
	 background: #e6e6e6;
	 border-bottom: 1px solid #ccc;
	 border-right: 1px solid #ccc;
	 transition: all ease 0.3s;
	 box-sizing: content-box;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_cs_m_menu li:last-child {
	 border-bottom: none;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_cs_m_menu li[active=true] {
	 background: #fff;
	 border-right: none;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_cs_m_menu li a {
	 text-decoration: none;
	 color: #6c6c6c;
	 display: block;
	 padding: 10px 5px 10px 10px;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_cs_m_menu li:hover {
	 background: #f9f9f9;
	 border-right: none;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_cs_m_content {
	 background: #fff;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_cs_m_content .cc_cs_m_content_entry {
	 width: 100%;
	 padding: 16px;
	 box-sizing: border-box;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_cs_m_content .cc_cs_m_content_entry[active=true] {
	 display: block;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_cs_m_content .cc_cs_m_content_entry h1 {
	 margin-top: 0;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_cs_m_content .cc_cs_m_content_entry .is-active, .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_cs_m_content .cc_cs_m_content_entry .is-inactive {
	 transition: all ease 0.5s;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_cs_m_content .cc_cs_m_content_entry .is-active {
	 color: #00308f;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_cs_m_content .cc_cs_m_content_entry .is-inactive {
	 color: #6c6c6c;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_footer {
	 background: #fff;
}
 .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_toggle_div {
	 float: right;
}

@media screen and (max-width: 698px) {
  .cookieconsent-change-settings {
    width: 96%;
  }
}
@media screen and (max-width: 698px) {
  .cookieconsent-change-settings .cc_cs_content .cc_cs_head .cc_cs_head_title {
    clear: left;
    width: 100%;
    text-align: center;
 }
  .cookieconsent-change-settings .cc_cs_content .cc_cs_head .cc_cs_head_title h1 {
    align-self: center;
 }
}
@media screen and (max-width: 698px) {
  .cookieconsent-change-settings .cc_cs_content .cc_cs_main {
    flex-direction: column;
 }
}
@media screen and (max-width: 698px) {
  .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_cs_m_menu {
    width: 100%;
 }
}
@media screen and (max-width: 698px) {
  .cookieconsent-change-settings .cc_cs_content .cc_cs_main .cc_cs_m_menu li {
    box-sizing: border-box;
 }
}
/* ----- checkbox styles ----- */
 div.cc_toggle_div p {
	 display: inline;
	 margin-right: 10px;
}
 input[type=checkbox].checkbox_cookie_consent {
	 position: absolute;
	 margin: 0 0 0 5px;
	 cursor: pointer;
}
 input[type=checkbox].checkbox_cookie_consent + label {
	 position: relative;
	 padding: 5px 0 0 50px;
	 cursor: pointer;
	 display: inline;
}
 input[type=checkbox].checkbox_cookie_consent:disabled + label {
	 cursor: not-allowed;
}
 input[type=checkbox].checkbox_cookie_consent + label:before {
	 content: "";
	 position: absolute;
	 display: block;
	 left: 0;
	 top: 0;
	 width: 40px;
	 height: 24px;
	 border-radius: 16px;
	 background: #eee;
	 border: 1px solid #ddd;
	 -webkit-transition: all 0.3s;
	 transition: all 0.3s;
}
 input[type=checkbox].checkbox_cookie_consent:checked + label:before {
	 background: #eee;
}
 input[type=checkbox].checkbox_cookie_consent:checked + label:after {
	 margin-left: 16px;
	 background: #7F97C7;
}
 input[type=checkbox].checkbox_cookie_consent + label:after {
	 content: "";
	 position: absolute;
	 display: block;
	 left: 0;
	 top: 0;
	 width: 24px;
	 height: 24px;
	 border-radius: 16px;
	 background: #ccc;
	 border: 1px solid #ccc;
	 -webkit-transition: all 0.3s;
	 transition: all 0.3s;
}
 input[type=checkbox].checkbox_cookie_consent-sm {
	 position: absolute;
	 margin: 5px 0 0 10px;
}
 input[type=checkbox].checkbox_cookie_consent-sm + label {
	 position: relative;
	 padding: 0 0 0 32px;
}
 input[type=checkbox].checkbox_cookie_consent-sm + label:before {
	 content: "";
	 position: absolute;
	 display: block;
	 left: 0;
	 top: 0;
	 background: #eee;
	 border: 1px solid #ccc;
	 -webkit-transition: all 0.3s;
	 transition: all 0.3s;
	 width: 25px;
	 height: 15px;
	 border-radius: 10px;
}
 input[type=checkbox].checkbox_cookie_consent-sm + label:after {
	 content: "";
	 position: absolute;
	 display: block;
	 left: 0;
	 top: 0;
	 background: #eee;
	 border: 1px solid #ccc;
	 -webkit-transition: all 0.3s;
	 transition: all 0.3s;
	 width: 15px;
	 height: 15px;
	 border-radius: 10px;
}
 input[type=checkbox].checkbox_cookie_consent-sm:checked + label:after {
	 margin-left: 10px;
}
 input[type=checkbox].checkbox_cookie_consent-sm:checked + label:before {
	 background: #00308f;
}
/* ----- button styles ----- */
 button.cc-button {
   border: none;
   color: #fff;
	 float: right;
	 padding: 4px 8px;
	 margin: 0 0 12px 12px;
}
 button.cc-button:last-child {
	 margin-left: 0;
}
 button.cc-button.btn-cc-no {
	 background: #ffb400;
}
 button.cc-button.btn-cc-no:hover {
	 background: #eec300;
}
 button.cc-button.btn-cc-cs {
	 background: #7f97c7;
}
 button.cc-button.btn-cc-cs:hover {
	 background: #6e86b6;
}
 button.cc-button.btn-cc-ok {
	 background: #00308f;
}
 button.cc-button.btn-cc-ok:hover {
	 background: #00207e;
}
 button.cc-button.btn-cc-save {
	 background: #00308f;
	 margin: 20px;
}
 button.cc-button.btn-cc-save:hover {
	 background: #00207e;
}
 button.cc-button.inactive, button.cc-button[disabled=true] {
	 background: #ddd;
	 color: #bbb;
	 cursor: inherit;
}
/* ----- media queries ----- */
 @media screen and (max-width: 776px) {
	 .cookieconsent-enforce, .cookieconsent-notify {
		 left: 5%;
		 right: 5%;
	}
}
/* ----- light theme styles ----- */
 .light_theme {
	 background: #f1f3f9;
	 color: #111;
}
 .light_theme a {
	 color: #00308f;
}
 .cookieconsent-enforce.light_theme {
	 background: #eee;
}


.cookieconsent-change-settings h1,
.cookieconsent-change-settings h2,
.cookieconsent-change-settings h3,
.cookieconsent-change-settings h4 {
  margin-left: 0;
}