.notification_container, .cookie_container { position: fixed; right: 10px; bottom: 10px; width: 330px; height: 120px; background: #ffffff00; display:none; } .cookie_container { left: 10px; z-index: 1; max-width: 450px; width: auto; height: auto; box-shadow: 0px 0px 18px 0px rgb(77 86 108 / 55%); } .notif_header, .cookie_header { background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)), linear-gradient(to bottom, #019875, #019875); color: white; padding: 15px; height: 40px; box-shadow: 0px 0px 18px 0px rgb(77 86 108 / 55%); display: flex; justify-content: space-between; align-items: center; border-radius: 5px 5px 0 0; } .cookie_header { background-color: white; background-image: none; color: #4D566C; padding: 0 15px 0 20px; height: 60px; box-shadow: 0px 0px 18px 0px rgb(77 86 108 / 55%); display: flex; justify-content: space-between; align-items: center; border-radius: 5px 5px 0 0; } .notif_close, .cookie_close { font-size: 35px; cursor: pointer; background: none; border: none; color: white; } .cookie_close { color: #4D566C; } .notif_header h3, .cookie_header h3 { margin: 0; line-height: 1; font-size: 13px; } .cookie_header h3 { font-size: 23px; } .notif_body, .cookie_body { background-color: #ffffff; height: 80px; border-radius: 0 0 5px 5px; box-shadow: 0px 0px 18px 0px rgb(77 86 108 / 55%); } .cookie_body { box-shadow: none; height: auto; padding: 0 20px 20px 20px; } .cookieLinkContainer { margin-top:15px !important; } .cookie_body button { margin-bottom: 0px; } .notif_body p, .cookie_body p { margin: 0; line-height: 1; padding: 15px; font-size: 14px; } .cookie_body p { padding: 0px; font-size: 16px; line-height:24px; } .cookie_body p a { text-decoration:underline; } @media screen and (max-width: 600px) { .notification_container, .cookie_container { right: 0; bottom: 0; left: 0; width: 100%; max-width:unset; } }