#cookieOptIn .overlay               { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0,0,0,0.5); }
#cookieOptIn                        { position: fixed; bottom: 0; left: 0; right: 0; padding: 0; color: #555; z-index: 9001; }
#cookieOptIn .inside                { z-index: 9002; color: #444; box-shadow: 0 0 100px rgba(0, 0, 0, 0.2); font: 14px Arial,sans-serif; max-height: 40vh; }
#cookieOptIn .inside                { animation: 1s ease-out 0s 1 fadeIn; position: relative; background: #fff; }
#cookieOptIn a                      { color: #222; text-decoration: underline; }
#cookieOptIn .cookie                { display: block; width: 50px; height: 50px; background: #fff; position: absolute; top: -35px; left: 50%; border-radius: 50%; fill: #888; }
#cookieOptIn .cookie                { padding: 10px; transform: translateX(-50%); z-index: 9003; animation: 1s ease-out 0s 1 fadeIn forwards; animation-delay: 700ms; opacity: 0; }
#cookieOptIn p                      { padding-bottom: 15px; }
#cookieOptIn ul                     { list-style-type: none; margin-bottom: 15px; }
#cookieOptIn .link                  { margin-bottom: 10px; }
#cookieOptIn h2                     { font-weight: normal; display: block; margin-bottom: 15px; color: #555; border: none; }
#cookieOptIn label                  { width: auto; font: 14px Arial,sans-serif; padding: 0; line-height: 2.5; }
#cookieOptIn form                   { display: grid; grid-template-columns: 3fr 1fr; grid-gap: 30px; max-width: 1000px; margin: 0 auto; padding: 50px 0; }
#cookieOptIn li                     { white-space: nowrap; display: inline-block; margin-right: 10px; position: relative; }
#cookieOptIn ul input               { position: relative; top: 1px; margin-right: 2px; }
#cookieOptIn .on                    { background: #70ca63; color: #fff; }
#cookieOptIn .okBtn                 { display: inline-block; padding: 5px 15px; background: #555; color: #fff; margin-top: 15px; border: 0; }
#cookieOptIn .okBtn                 { border-radius: 3px; cursor: pointer; font-size: 14px; }
#cookieOptIn .inside                { padding: 0; overflow-y: auto; }
#cookieOptIn button                 { background: #eee; color: #555; font: normal 16px/45px Arial,sans-serif; border-radius: 4px; border: none; display: block; }
#cookieOptIn button                 { width: 100%; margin-bottom: 10px; cursor: pointer; }
#cookieOptIn .green                 { background: #82b357; color: #fff; }
#cookieOptIn .areas li              { display: block; line-height: 2.5; border-bottom: 1px solid rgba(0,0,0,0.1); }
#cookieOptIn .areas .handle         { width: 30px; height: 30px; display: block; position: absolute; top: 2px; right: 0; opacity: 0.5; cursor: pointer; }
#cookieOptIn .areas .handle         { background: transparent url('/system/modules/core/assets/font-awesome/5/svgs/regular/chevron-down.svg') center center no-repeat; }
#cookieOptIn .areas .handle         { background-size: 50%; margin-right: 10px; }
#cookieOptIn .areas .show .handle   { transform: rotate(-180deg); }
#cookieOptIn .level_2               { padding-left: 20px; margin: 0; display: none; padding-bottom: 5px; }
#cookieOptIn .show .level_2         { display: block; }
#cookieOptIn .level_2 li            { border: none; line-height: 1.5; }
#cookieOptIn .level_2 label         { line-height: 1.5; }
#cookieOptIn .level_2 li:after      { display: none; }
#cookieOptIn span.info              { background: transparent url('/system/modules/core/assets/font-awesome/5/svgs/solid/info-circle.svg') 0 0 no-repeat; }
#cookieOptIn span.info              { display: inline-block; width: 14px; height: 14px; opacity: 0.4; cursor: pointer; vertical-align: middle; margin-left: 5px; }

.cookieWindow                       { position: fixed; top: 50%; left: 50%; max-width: 80vw; max-height: 50vh; z-index: 10000; }
.cookieWindow                       { padding: 15px; background: #fff; color: #222; box-shadow: 0 0 20px rgba(0,0,0,0.5); border-radius: 10px; }
.cookieWindow                       { font: 14px Arial,sans-serif; color: #333; transform: translate(-50%, -50%); display: none; }
.cookieWindow h4                    { font-size: 20px; display: block; margin-bottom: 20px; }
.cookieWindow h5                    { font-size: 16px; display: block; margin: 20px 0 5px; color: rgba(0,0,0,0.5); }
.cookieWindow div                   { overflow-y: auto; padding: 15px; max-height: calc(50vh - 60px); }
.cookieWindow.show                  { display: block; }
.cookieWindow ul                    { margin: 0 0 15px 15px; list-style-type: disc; display: grid; grid-template-columns: 1fr 1fr; grid-column-gap: 30px; }
.cookieWindow .w100                 { display: block; }
.cookieWindow a                     { color: blue; }
.cookieWindow p                     { padding-bottom: 15px; }
.cookieWindow .close                { position: absolute; top: -12px; right: -12px; width: 30px; height: 30px; border-radius: 50%; cursor: pointer; }
.cookieWindow .close                { background: #222; padding: 5px; box-sizing: border-box; text-align: center; }
.cookieWindow .close svg            { height: 100%; width: auto; }
.cookieWindow .close svg path       { fill: #fff; }
.cookieWindow .box                  { padding: 10px; border-radius: 5px; border: 1px solid #ccc; display: block; margin-bottom: 20px; }
.cookieWindow .box strong           { display: block; margin-bottom: 5px; }
.cookieWindow .box p                { padding: 0; }
.cookieWindow table                 { width: 100%; background: #eee; border-radius: 5px; border-collapse: collapse; }
.cookieWindow th                    { padding: 10px 20px; background: none; }
.cookieWindow td                    { padding: 10px 20px; background: none; }
.cookieWindow tr:nth-child(even)    { background: #e5e5e5; }
.cookieWindow a                     { white-space: pre-wrap; word-break: break-all; color: #222; text-decoration: underline; }
.cookieWindow .blocks               { margin: 0; list-style-type: none; display: block; font-size: 0; }
.cookieWindow .blocks li            { display: inline-block; border-radius: 3px; border: 1px solid #ccc; padding: 5px; margin: 0 5px 5px 0; font-size: 14px; }
.cookieWindow .table                { display: block; overflow-x: auto; white-space: nowrap; }

.cookieWindow ::-webkit-scrollbar-track { background: none; }
.cookieWindow ::-webkit-scrollbar       { width: 10px; height: 10px; }
.cookieWindow ::-webkit-scrollbar-thumb { background: #ccc; border-radius: 5px; }

@keyframes fadeIn {
    0% { opacity: 0; bottom: -5vh; }
    20%  { opacity: 0; }
    100% { opacity: 1; bottom: 0; }
}
@media (max-width: 900px) {
    #cookieOptIn        { left: 0; right: 0; bottom: 0; padding: 40px 10px; text-align: center; max-height: 75vh; }
    #cookieOptIn form   { display: block; }
    #cookieOptIn ul     { display: block; line-height: 30px; margin-bottom: 15px; text-align: left; }
    #cookieOptIn h2     { font-size: 22px; }
    #cookieOptIn .inside{ overflow-y: auto; max-height: calc(75vh - 40px); padding: 0 10px; }
    .cookieWindow       { max-width: 90vw; max-height: 90vh; height: 90vh; }
    .cookieWindow div   { max-height: calc(90vh - 30px); padding: 10px; }
    .cookieWindow th    { padding: 10px; }
    .cookieWindow td    { padding: 10px; }
}