#klaro {
    position:fixed;
    bottom:0;
    z-index:30;
    
    font-size:16px;
    line-height: 26px;
    color: #282828;

}

.klaro .cookie-modal {
    position:fixed;
    z-index:100;
    left:0;
    right:0;
    top:0;
    bottom:0;
    padding:32px;
    background-color: rgba(60,60,62,0.8);
    overflow:auto;
}
@media (min-width: 801px) { .klaro .cookie-modal { left:calc(50%-300px); } }
@media (max-width: 607px) { .klaro .cookie-modal { padding:16px } }

.klaro .cm-bg {
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0
}

.klaro .cookie-notice{
    width: 100vw;
    height: 100vh;
    display: block;
    background-color: rgba(60,60,62,0.6);
}

.klaro .cookie-notice .cn-body {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    max-width:400px;
    padding:30px 30px;
    background-color: rgb(254, 254, 254);
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid rgba(0,0,0,0.24);
    box-shadow: rgba(0, 0, 0, 0.15) 0px 6px 12px 0px;
}
@media (min-width: 801px) { .klaro .cookie-notice .cn-body { max-width:600px; } }
@media (max-width: 351px) { .klaro .cookie-notice .cn-body { padding:16px 16px } }

.klaro .cookie-notice h3{
    display: block;
    margin-bottom: 20px;
}

.klaro .cookie-notice .cn-learn-more { 
    font-style: normal;
    color: #597648;
    text-decoration: none;
    margin-top: 10px;
    border: 1px solid #99CC66;

    padding: 0px 16px;
    margin: 8px 0 0;
    display: table;
    height: 40px;
    line-height: 40px;
    border-radius: 3px;
}

.klaro .cookie-notice .cn-learn-more:hover { 
    color: #282828;
}

.klaro .cookie-notice .cn-buttons {
    margin-left: -7.5px;
    justify-content: start;
}

.klaro .cn-buttons {
    display:flex;
    justify-content:center;
    flex-wrap:wrap
}

.klaro .cn-buttons>.cm-btn {
    margin-left:7.5px;
    margin-right:7.5px
}

.klaro .cm-modal {
    position:relative;
    box-sizing:border-box;
    max-width:770px;
    margin-left:auto;
    margin-right:auto;
    padding:50px;
    border-radius: 4px;
    overflow: hidden;
    background-color: rgb(254, 254, 254);
    border-radius: 1px solid rgba(0,0,0,0.24);   
    box-shadow: rgba(0, 0, 0, 0.15) 0px 6px 12px 0px;
}
   
@media (max-width: 607px) {
    .klaro .cm-modal {
        padding-left:40px;
        padding-right:40px
    }
}
   
@media (max-width: 351px) {
    .klaro .cm-modal {
        padding-left:30px;
        padding-right:30px
    }
}

.klaro .cm-header .title { padding-right:30px }
.klaro .cm-header .title + p{
    padding-top: 16px;
    padding-bottom: 16px;
}

.a-button-close,
.klaro .cm-header .hide {
 position:relative;
 width:48px;
 height:48px;
 cursor: pointer;
 background: none;
 border: none;
}

.a-button-close::before,
.klaro .cm-header .hide::before,
.a-button-close::after,
.klaro .cm-header .hide::after {
 content:'';
 position:absolute;
 width:22px;
 height:2px;
 left:calc(50% - 11px);
 top:calc(50% - 1px);
 background-color:currentcolor
}

.a-button-close::before,
.klaro .cm-header .hide::before {
 -webkit-transform:rotate(45deg);
 transform:rotate(45deg)
}

.a-button-close::after,
.klaro .cm-header .hide::after {
 -webkit-transform:rotate(-45deg);
 transform:rotate(-45deg)
}

.a-button-close.-white,
.klaro .cm-header .-white.hide {
 color:#fff
}

.klaro .cm-header .hide {
    position:absolute !important;
    right:11px;
    top:11px
}
.klaro .cm-header .hide svg { display:none }

.klaro .cm-body{ 
    padding-bottom:30px;
    border-bottom:1px solid #959595; 
}

.klaro .cm-content {
    display:none;
    list-style:none;
    padding-left:28px;
    margin-top:20px
}
.klaro .cm-content .purposes {
    margin-top:0;
    padding-top: 0;
    margin-bottom:0;
    font-size:13px;
}
.klaro .cm-content.expanded { display:block }

.klaro .cm-list-label { padding-left:10px } 
.klaro .cm-list-description {
    margin-top:0;
    margin-bottom:0;
    font-size:16px;
}

.klaro .cm-caret {
    margin-top:5px;
    font-size:16px;
} 
.klaro .cm-caret > a {
    font-weight:600;
    color: #959595;
    text-decoration:none
}

.klaro .cm-purpose + .cm-purpose { margin-top:20px }
.klaro .cm-purposes {
    padding-left:0;
    list-style:none;
}

.klaro .cm-purpose .cm-list-title{
    font-weight: bold;
}

.klaro li.cm-purpose{
    display: flex;
    flex-wrap: wrap;
}

.klaro .cm-services{
    width: 100%;
    flex-shrink: 0;
}

.klaro .cm-service > div{
    display: flex;
    flex-wrap: wrap;   
}

.klaro .cm-service > div div:last-child{
    width: 100%;
    flex-shrink: 0;    
}

.klaro .cm-content .cm-service+.cm-service { margin-top:10px }

.klaro .cm-required {
    padding-left:6px;
    font-size:13px;
    color: #959595;
}

.klaro .cm-toggle-all {
    padding-top:16px;
}

.klaro .cm-footer { margin-top:30px }
.klaro .cm-footer-buttons { margin-bottom:16px }
.klaro .cm-footer-buttons{
    display: flex;
    flex-wrap: wrap;
}
.klaro .cm-footer-buttons > .cm-btn { margin-right:16px }
.klaro .cm-footer-buttons > .cm-btn:not(:last-child) { margin-bottom:10px }

.klaro .cm-powered-by {
    margin-top:16px;
    color: #959595;
    font-size:13px
}
.klaro .cm-powered-by a {
    font-weight:inherit;
    color:inherit;
    text-decoration: none;
}

.a-button,
.klaro .cm-btn {
    font-style: normal;
    width: auto;
    display: table;
    padding: 0px 16px;
    margin: 8px 0 0;
    height: 40px;
    line-height: 40px;
    border-radius: 3px;
    outline: none;
    cursor: pointer;
}

#klaro button.cn-decline{
    background: #F0F0F0;
}

#klaro button.cm-btn-success{
    color: #FFFFFF;
    background: #99CC66;
}

#klaro button.cn-decline:hover{
    color: #D03108 !important;
}