/*
 * Copyright (c) 2021 Flerosoft (https://flerosoft.com)
 * Software Name: Cookie Notice Pro - jQuery Plugin
 * Product Page : https://cookienoticepro.flerosoft.com
 * Documentation: https://cookienoticepro.flerosoft.com/docs
 * Description: Cookie Notice Pro, a lightweight jQuery plugin, helps you to comply with GDPR.
Make your own cookie information popup in minutes.
 */

/*********************** Cookie Dialog ***********************/

:root {
  --cookieNoticeProLight: #ffffff;
  --cookieNoticeProDark: #333;
}

#cookieNoticePro * { margin: 0; padding: 0; text-decoration: none; list-style: none;}
#cookieNoticePro h4 { font-size: 1.2rem;}
#cookieNoticePro p { font-size: 1rem;}
#cookieNoticePro button,
#cookieNoticePro a { font-size: 1rem; cursor: pointer; color: inherit;}
#cookieNoticePro button{ outline: none; border: none; appearance: none; font-weight: 400; font-size: .85rem; }
#cookieNoticePro strong,
#cookieNoticePro em { font-weight: 400; }
#cookieNoticePro a:hover { text-decoration: none; cursor: pointer; }
#cookieNoticePro a:focus,
#cookieNoticePro input:focus { outline: none; list-style: none; }


#cookieNoticePro.light { background-color: #ffffff; background-color: var(--cookieNoticeProLight); color: #333; color: var(--cookieNoticeProDark); }
#cookieNoticePro.light p,
#cookieNoticePro.light ul { color: #333; color: var(--cookieNoticeProDark); }

#cookieNoticePro { box-sizing: border-box; position: fixed; padding: 2rem; border-radius: 2rem; box-shadow: 0 0 1rem rgba(0, 0, 0, 0.15); z-index: 999997; } 
#cookieNoticePro #closeIcon { width: 20px; height: 20px; cursor: pointer; color: #bfb9b9; overflow: hidden; opacity: 0.85; z-index: 999999; position: absolute; top: 4px; right: 4px; }

#cookieNoticePro svg{ display: block; }

#cookieNoticePro.display-left { left: 30px; bottom: 30px; max-width: 395px; }
#cookieNoticePro.display-right { right: 2rem; bottom: 2rem; max-width: 35rem; }
#cookieNoticePro.display-top { top: 30px; width: 800px; left: 50%; margin-left: -400px; }
#cookieNoticePro.display-bottom { bottom: 30px; width: 800px; left: 50%; margin-left: -400px; }

#cookieNoticePro.display-top .content-wrap,
#cookieNoticePro.display-bottom .content-wrap { display: flex; justify-content: space-between; align-items: center; }

#cookieNoticePro.display-top .msg-wrap,
#cookieNoticePro.display-bottom .msg-wrap { max-width: 65%; width: 100%; }

#cookieNoticePro.display-top .msg-wrap,
#cookieNoticePro.display-bottom .msg-wrap { margin-bottom: 0; }

#cookieNoticePro.display-top #cookieSettings,
#cookieNoticePro.display-bottom #cookieSettings { margin-bottom: 0; }

#cookieNoticePro.display-top #cookieTypes,
#cookieNoticePro.display-bottom #cookieTypes { margin-top: 20px; }

#cookieNoticePro .btn-wrap { display: flex; flex-direction: row; font-weight: 400; justify-content: center; margin: 2rem -5px 0 -5px; flex-wrap: wrap; }
#cookieNoticePro .btn-wrap button { cursor: pointer; white-space: nowrap; width: calc( 33.3% - (5px * 2) ); text-transform: uppercase; line-height: 36px; border: none; transition: all .5s ease;  padding: 0 7px; margin: 0 5px 10px 5px; border-radius: 20px;}
#cookieNoticePro .btn-wrap button:hover { color: #fff !important; background-color: #009fe3 !important; }

#cookieNoticePro h4 { color: #009fe3; font-weight: 400;}

#cookieNoticePro .title-wrap { display: flex; align-items: center; margin-bottom: 10px; }

#cookieNoticePro .title-wrap svg { margin-right: 10px; }

#cookieNoticePro h5 { font-weight: 400; font-size: 1rem;  margin-bottom: 1rem; }
#cookieNoticePro p,
#cookieNoticePro ul { margin-bottom: 20px; }
#cookieNoticePro p { text-align: left; }
#cookieNoticePro p:last-child { margin-bottom: 0;}
#cookieNoticePro li { width: 33.3%; display: inline-block;}
#cookieNoticePro a { text-decoration: underline;}
#cookieNoticePro a:hover { text-decoration: none;}


#cookieTypes { width: 100% !important; text-align: left; background: #fafafa; border-radius: 1rem; margin-top: 1rem; padding: 1rem 1.5rem !important;}
#cookieTypes ul { display: flex; flex-direction: row; justify-content: space-between; align-items: center; flex-wrap: wrap; margin-bottom: 0;}
#cookieTypes ul li { width: auto; position: relative; }
#cookieTypes ul li button#cookieAcceptSel { width: auto; color: #fff !important; background-color: #009fe3 !important; padding: 0 1rem; margin-top: 0;}
#cookieTypes ul li button#cookieAcceptSel:hover { background-color: #fff !important; color: #009fe3 !important; }
#cookieTypes label { font-size: 1rem !important; cursor: pointer; font-weight: 300; padding-left: 1.75rem;}

#cookieNoticePro button:disabled { opacity: 0.3;}
#cookieNoticePro input[type="checkbox"] { opacity: 0; width: 1px; height: 1px;}
  
#cookieNoticePro input[type="checkbox"] + label:before,
#cookieNoticePro input[type="checkbox"] + label:after { content: ""; position: absolute; top: 0; left: 0; width: 1.25rem; height: 1.25rem;}
#cookieNoticePro input[type="checkbox"] + label:after { content: "✕"; color: #009fe3; text-align: center; margin-left: .05rem; opacity: 0; transition: opacity .5s ease;}
#cookieNoticePro input[type="checkbox"]:checked + label:after { opacity: 1;}
#cookieNoticePro input[type="checkbox"] + label:before { background: #fff; border: 1px solid #3182a4;}

#cookieNoticePro.display-top.full-width-true,
#cookieNoticePro.display-bottom.full-width-true { width: 100%; max-width: 100%; left: auto; right: auto; bottom: auto; top: 0; border-radius: 0; margin: auto;}

#cookieNoticePro.display-bottom.full-width-true { bottom: 0; top: auto; box-shadow: 0 -3px 3px rgb(0 0 0 / 25%);}

#cookieNoticePro.display-top.full-width-true .title-wrap,
#cookieNoticePro.display-bottom.full-width-true .title-wrap { display: none;}

#cookieNoticePro.display-top.full-width-true .btn-wrap button,
#cookieNoticePro.display-bottom.full-width-true .btn-wrap button { margin-bottom: 10px;}

@media only screen and (max-width: 800px) {
  #cookieNoticePro.display-top,
  #cookieNoticePro.display-bottom { width: 100%; max-width: 100%; left: auto; right: auto; bottom: auto; top: 0; border-radius: 0; margin: auto; }

  #cookieNoticePro.display-bottom { bottom: 0; top: auto; box-shadow: 0 -3px 3px rgb(0 0 0 / 25%); }

  #cookieNoticePro.display-top .btn-wrap button,
  #cookieNoticePro.display-bottom .btn-wrap button { margin-bottom: 10px; }

  #cookieNoticePro.display-top .msg-wrap,
  #cookieNoticePro.display-bottom .msg-wrap { margin-right: 20px; }
}

@media only screen and (max-width: 600px) {
  #cookieNoticePro.display-left ,
  #cookieNoticePro.display-right { width: 100%; max-width: 100%; left: auto; right: auto; bottom: 0; border-radius: 0; box-shadow: 0 -3px 3px rgb(0 0 0 / 25%); }

  #cookieNoticePro.display-top .content-wrap,
  #cookieNoticePro.display-bottom .content-wrap { display: block; }
  #cookieNoticePro.display-top .msg-wrap,
  #cookieNoticePro.display-bottom .msg-wrap { max-width: 100%; }
  #cookieNoticePro.display-top #cookieSettings,
  #cookieNoticePro.display-bottom #cookieSettings { margin-bottom: 20px; }

  #cookieNoticePro .btn-wrap button { width: 100%;}
}