@import "//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"; @import "//fonts.googleapis.com/css?family=Khand"; /* body{ font-size:medium; line-height:normal; } */ .gdpr-closed{ height: 60px; width: 60px; border-radius: 100%; background: #9b4dca; position: fixed; left: 20px; bottom: 20px; border: solid 5px #ad77ce; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; z-index: 999998; /* -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out; */ } .gdpr-open{ height: 180px; width: 500px; border-radius: 1%; background: #9b4dca; position: fixed; left: 20px; bottom: 20px; border: solid 5px #ad77ce; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; /* -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out; */ } .gdpr i{ font-size: 30px; color:#d0b8e0; -webkit-transition: color 0.5s ease-out; -moz-transition: color 0.5s ease-out; -o-transition: color 0.5s ease-out; transition: color 0.5s ease-out; line-height: 50px; cursor: pointer; } .gdpr-header{ background-color: transparent; text-align: center; line-height: 50px; height:50px; border-radius: 100%; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out; } .gdpr-hover{ /*empty, just holder for hover*/ } .gdpr-hover:hover{ border: dashed 5px #ad77ce; } .gdpr i:hover{ color:#ffffff; } .gdpr-title{ /*font-family: 'Khand', sans-serif;*/ font-family: 'arial', sans-serif; font-weight: lighter; font-size: 0px; color:#ffffff; margin-left:10px; line-height: 40px; width: 0px; display: none; float: right; -webkit-transition: all 0.5s ease-out; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; transition: all 0.5s ease-out; } .gdpr-content{ padding: 10px; /*font-family: 'Khand', sans-serif;*/ font-family: 'arial', sans-serif; color: #ffffff; display: none; } .gdpr-buttons{ width:470px; padding: 10px; display: none; margin-top:-10px; } .gdpr-button{ display:block; cursor: pointer; color:#ffffff; padding:5px 10px; /*font-family: 'Khand', sans-serif;*/ font-family: 'arial', sans-serif; font-weight: bold; text-align: center; } .gdpr-button-accept{ background-color: #4BB543; float:left; } .gdpr-button-privacy{ background-color: #333A47; float:right; } .gdpr-notification{ visibility: hidden; } .speech-bubble{ position: fixed; bottom: 25px; left:100px; background: #333333; border-radius: .4em; /*font-family: 'Khand', sans-serif;*/ font-family: 'arial', sans-serif; color:#ffffff; line-height: 20px; font-size: 20px; padding:15px; z-index: 9999999; } .speech-bubble:after{ content: ''; position: absolute; left: 0; top: 50%; width: 0; height: 0; border: 13px solid transparent; border-right-color: #333333; border-left: 0; margin-top: -13px; margin-left: -13px; z-index: 9999999; } .gdpr-hidden-open{ height: 60px; width: 60px; border-radius: 100%; background: transparent; position: fixed; left: 20px; bottom: 20px; display:none; cursor: pointer; } .gdpr-overlay{ position:fixed; z-index: 999999; background-color: rgba(0,0,0,0.8); height:100vh; width:100vw; left:0; top:0; margin:0; } .gdpr-overlay-box{ position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: #f1f1f1; max-width: 900px; width:100%; padding: 0px; border-radius: 12px; border:5px solid #d9d9d9; /*font-family: 'Khand', sans-serif;*/ font-family: 'arial', sans-serif; box-sizing: border-box; max-height: 100vh; } .gdpr-overlay-title{ font-size: 40px; background-color: #d9d9d9; -webkit-border-top-left-radius: 12px; -webkit-border-top-right-radius: 12px; -moz-border-radius-topleft: 12px; -moz-border-radius-topright: 12px; border-top-left-radius: 12px; border-top-right-radius: 12px; width:100%; display: block; margin-top: -4px; color: #333333; } .gdpr-overlay-close{ float:right; font-size: 40px; margin-top: -50px; margin-right: 10px; cursor:pointer; color: #333333; } .gdpr-overlay-close:hover{ color:#4BB543; } .gdpr-overlay-buttons{ margin-top: 20px; } .gdpr-button-light{ display:block; cursor: pointer; color:#ffffff; padding:10px 20px; /*font-family: 'Khand', sans-serif;*/ font-family: 'arial', sans-serif; font-weight: bold; text-align: center; background-color: #d9d9d9; float:left; margin-left:10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border:3px solid #d9d9d9; } .gdpr-button-light:hover{ background-color: #4BB543; color: #ffffff; border-style: dashed; border-color: #388c31; } .gdpr-overlay-container{ padding:10px; float:left; max-height: 500px; overflow-y: auto; overflow-x: hidden; margin:20px 0px; } .gdpr-overlay-container a{ color: #4BB543; text-decoration: none; } .gdpr-overlay-container a:hover{ color: #388c31; } .gdpr-form-holder{ width:100%; margin-top: 20px; } .gdpr-input{ float:left; padding:5px; font-size: 18px; width:300px; } .gdpr-form-button{ display:block; cursor: pointer; color:#ffffff; padding:7px 10px; /*font-family: 'Khand', sans-serif;*/ font-family: 'arial', sans-serif; font-weight: bold; text-align: center; background-color: #4BB543; float:left; margin-left:10px; } .gdpr-alert{ width:100%; color: #fefefe; position: relative; /*font-family: 'Khand', sans-serif;*/ font-family: 'arial', sans-serif; color:#ffffff; padding:5px; display: inline-block; margin-top: 20px; margin-left: -5px; } .gdpr-error{ background-color: #f64b2f; } .gdpr-success{ background-color: #7EB62E; } .gdpr-alert-icon{ font-size: 40px; color: rgba(0,0,0,0.1); margin-left: 10px; margin-right: 10px; display:block; float:left; } .gdpr-alert-content{ font-size: 18px; margin-top: 6px; display:block; float:left; } .gdpr-closed{ bottom: 20px; left: 20px; } .gdpr-open{ bottom: 20px; left: 20px; } .speech-bubble{ bottom: 25px; left:100px; } .gdpr-hidden-open{ bottom: 20px; right: 20px; top: auto; left: auto; } .speech-bubble:after{ content: ''; left: 0; top: 50%; width: 0; height: 0; border: 13px solid transparent; border-right-color: #333333; border-left: 0; margin-top: -13px; margin-left: -13px; } /* Style The Dropdown Button */ .gdpr-dropbtn { background-color: #d9d9d9; color: #ffffff; padding: 16px; font-size: 16px; border: none; cursor: pointer; } /* The container