APPI-Konformität
#Formular-Appi-Konto-Bearbeitungsanfrage,
#Formular-Appi-Anfragen-Anfrage,
#Formular-AppI-Anfrage zu persönlichen Informationen,
#Formular-Appi-Bestellungen-Anfrage,
#Formular-Appi-Antrag auf Auskunft über personenbezogene Daten,
#Formular-Appi-Kontolöschungsanfrage,
#form-appi-do-not-sell-request {
Anzeige: keine;
#appi_pagebutton {
Hintergrundfarbe: transparent;
Rand: 0;
Rahmen unten: 1px durchgehend schwarz;
Polsterung: 0px;
/* Modales Hintergrund */
#Datenüberprüfungshintergrund {
Anzeige: keine;
Position: fest;
z-Index: 1;
Polsterung oben: calc(50vh - 83px);
links: 0;
oben: 0;
Breite: 100 %;
Höhe: 100 %;
Überlauf: automatisch;
Hintergrundfarbe: rgb(0,0,0);
Hintergrundfarbe: rgba(0,0,0,0,4);
Deckkraft: nicht festgelegt;
Z-Index: 9999;
/* ModalContent */
#Datenüberprüfungsmodal {
Hintergrundfarbe: #fefefe;
Rand: automatisch;
Polsterung: 16px;
Rand: 1px durchgezogen #888;
Breite: 38 %;
/* ModalCloseButton */
.data-verification-close {
Farbe: #aaaaaa;
float: rechts;
Schriftgröße: 28px;
Schriftstärke: fett;
Zeilenhöhe: 17px;
Hintergrundfarbe: transparent;
Rand: 0px;
Polsterung: 0px;
.data-verification-close:hover {
Farbe: #000;
Textdekoration: keine;
Cursor: Zeiger;
/* Kontrollkästchentext */
#Datenüberprüfungscontainer p{
Anzeige: Inline-Block;
Polsterung: 0;
Rand: 0;
Zeilenhöhe: 24px;
Polsterung links: 10px;
vertikale Ausrichtung: oben;
Breite: berechnet (100 % – 45 Pixel);
#Datenüberprüfungscontainer a, #Datenüberprüfungscontainer a:hover{
Textdekoration: Unterstreichen! Wichtig;
Farbe: #4285f4;
#data-verification-container input {
Deckkraft: 0;
Breite: 0;
Höhe: 0;
Rand: 0;
Polsterung: 0;
/* Kontrollkästchensymbol */
#Datenüberprüfungssymbol {
Cursor: Zeiger;
Position: relativ;
Rand: automatisch;
Breite: 18px;
Höhe: 18px;
-webkit-tap-highlight-color: transparent;
transformieren: translate3d(0, 0, 0);
Rand oben: 2px;
#data-verification-icon:vorher {
Inhalt: "";
Position: absolut;
oben: -7px;
links: -7px;
Breite: 32px;
Höhe: 32px;
Randradius: 50 %;
Hintergrund: rgba(34,50,84,0,03);
Deckkraft: 0;
Übergang: Deckkraft 0,2 s Leichtigkeit;
#Datenüberprüfungssymbol svg {
Position: relativ;
z-Index: 1;
Füllung: keine;
Strich-Linienende: rund;
Strich-Linienverbindung: rund;
Strich: #c8ccd4;
Strichstärke: 1,5;
transformieren: translate3d(0, 0, 0);
Übergang: alle 0,2 s leicht;
#data-verification-icon svg-Pfad {
Schlaganfall-Dasharray: 60;
Strich-Schlagsatz: 0;
#Datenüberprüfungssymbol SVG-Polylinie {
Schlaganfall-Dasharray: 22;
Strich-Schlag-Höhe: 66;
#data-verification-icon:hover:before {
Deckkraft: 1;
#Datenüberprüfungscontainer:hover #Datenüberprüfungssymbol svg {
Strich: #4285f4;
#data-verification-icon.clicked svg {
Strich: #4285f4;
#data-verification-icon.clicked svg-Pfad {
Hub-Schlag-Höhe: 60;
Übergang: alle 0,3 s linear;
#data-verification-icon.clicked svg polyline {
Hub-Schlag-Höhe: 42;
Übergang: alle 0,2 s linear;
Übergangsverzögerung: 0,15 s;
/* Barrierefreies Design */
#data-verification-icon:Fokus, .data-verification-close:Fokus, #data-verification-container input:Fokus ~ #data-verification-icon svg, #data-verification-container a:Fokus {
Kastenschatten: 0 0 0 3px rgba(21, 156, 228, 0,4);
Übergang: alle 0,3 s leicht;
Gliederung: keine;
transformieren: Skalierung (1,06);
#appi_page .list-unstyled li button {
Cursor: Zeiger;
.show-isense {
Übergang: Deckkraft 400 ms !wichtig;
.hide-isense {
Deckkraft: 0 !wichtig;
Übergang: 0,4 s Auslaufen;
/* Modale Änderungen bei mobiler Auflösung*/
@media only screen und (max-width: 600px) {
#Datenüberprüfungsmodal {
Breite: 90 %;
/* Element wird geladen */
.wird geladen {
Anzeige: keine;
oben: 50vh;
links: 50vw;
Position: fest;
.loading:not(:required):after {
Inhalt: '';
Anzeige: Block;
Schriftgröße: 10px;
Breite: 1em;
Höhe: 1em;
Rand oben: -0,5em;
-Webkit-Animation: Spinner 1500 ms unendlich linear;
-moz-animation: Spinner 1500 ms unendlich linear;
-ms-Animation: Spinner 1500 ms unendlich linear;
-o-Animation: Spinner 1500 ms unendlich linear;
Animation: Spinner 1500 ms unendlich linear;
Randradius: 0,5em;
-webkit-box-shadow: rgba(255,255,255, 1) 1.5em 0 0 0, rgba(255,255,255, 1) 1.1em 1.1em 0 0, rgba(255,255,255, 1) 0 1.5em 0 0, rgba(255,255,255, 1) -1.1em 1.1em 0 0, rgba(255,255,255, 1) -1.5em 0 0 0, rgba(255,255,255, 1) -1.1em -1.1em 0 0, rgba(255,255,255, 1) 0 -1.5em 0 0, rgba(255.255.255, 1) 1,1em -1,1em 0 0;
Box-Schatten: rgba(255,255,255, 1) 1,5em 0 0 0, rgba(255,255,255, 1) 1,1em 1,1em 0 0, rgba(255,255,255, 1) 0 1,5em 0 0, rgba(255,255,255, 1) -1,1em 1,1em 0 0, rgba(255,255,255, 1) -1,5em 0 0 0, rgba(255,255,255, 1) -1,1em -1,1em 0 0, rgba(255,255,255, 1) 0 -1,5em 0 0, rgba(255.255.255, 1) 1,1em -1,1em 0 0;
/* Animation */
@-webkit-keyframes spinner {
-webkit-transform: drehen(0 Grad);
-moz-transform: drehen (0 Grad);
