component:button-style

STOPP!

Dies ist eine Vorlage und wird auf verschiedenen Seiten eingefügt.

FINGER WEG SONST FINGER AB!

---

/* Code von Dr_Grom, unter CC BY-SA 3.0 */
 
/* +++++ Buttons +++++ */
 
#u-buttonbox {
    background: linear-gradient(to bottom, #eee,#eee,#e0e0e0), #eee;
    border: solid 1px #666;
    border-radius: 5px;
    box-shadow: 1px 1px 2px rgba(0,0,0,.25);
    display: inline-block;
    margin-right: 1em;
    margin-bottom: 9px;
    padding: 0 4px;
}
 
#u-buttonbox > p {
    border-right: 1px solid #777;
    border-left: 1px solid #777;
    display: inline-block;
    height: 12px;
    margin: 2px -3px;
}
#u-buttonbox > p:first-of-type {
    border-left: 0;
}
#u-buttonbox > p:last-of-type {
    border-right: 0;
}
#u-buttonbox > p:only-of-type {
    text-align: center;
}
 
#u-buttonbox > p > a {
    color: #444;
    padding: 0 6px;
}
#u-buttonbox > p > a:hover {
    color: #b01;
    text-decoration: none;
    text-shadow: 0px 0px 3px rgba(187,0,107,.2);
}
 
/* +++++ Windows +++++ */
 
#u-audio .modalcontainer, 
#u-ebook .modalcontainer {
    max-width: 300px;
}
 
#u-buttonbox .modalcontainer {
    line-height: initial;
}
 
#u-buttonbox .credit {
    text-align: left;
}
#u-buttonbox .credit ul {
    list-style: disc;
    padding-left: 10px;
}
 
#u-audio, 
#u-ebook,
#u-inhaltswarnung {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0px;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10;
    display: flex;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
}
#u-audio:not(:target), 
#u-ebook:not(:target), 
#u-inhaltswarnung:not(:target) {
    display: none;
    opacity: 0;
}
#u-audio:target, 
#u-ebook:target, 
#u-inhaltswarnung:target {
    opacity: 1;
    animation-duration: 0.3s;
    animation-name: fade-in;
    -moz-animation-duration: 0.5s;
    -moz-animation-name: fade-in;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-name: fade-in;
}
 
.rating-container {
    display: inline-block;
}
 
/* +++++ Mobile changes +++++ */
 
@media (max-width: 315px) {
    #u-buttonbox + .page-rate-widget-box {
        margin-right: 1em;
    }
}
@media (max-width: 479px) {
    #u-buttonbox > p {
        margin: 1px -2px 1px -3px;
        vertical-align: top;
    }
    #u-buttonbox > p:only-of-type {
        margin: 1px -3px;
        vertical-align: unset;
    }
    #u-buttonbox > p:only-of-type .fa-book,
    #u-buttonbox > p:only-of-type .fa-volume-up {
        position: relative;
        top: -1px;
    }
    #u-buttonbox > p > a {
        padding: 1px 5px 0;
    }
}
@media (max-width: 767px) {
    #u-audio, 
    #u-ebook,
    #u-inhaltswarnung {
        height: 100%;
        top: 0;
    }
}