5.661
Bearbeitungen
Admin (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
Admin (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
Zeile 1: | Zeile 1: | ||
<!-- Large mobile banner. Must be used with "Large banner limit and switch" mixin --> | |||
<style> | |||
/* Clearfix */ | |||
.frb .cf:before, | |||
.frb .cf:after { | |||
content: ""; | |||
display: table; | |||
} | |||
.frb .cf:after { clear: both; } | |||
/* Box-sizing */ | |||
.frb, | |||
.frb *, | |||
.frb *:before, | |||
.frb *:after { | |||
-moz-box-sizing: border-box; | |||
-webkit-box-sizing: border-box; | |||
box-sizing: border-box; | |||
} | |||
/* Common styles */ | |||
.frb label, | |||
.frb button, | |||
.frb input { | |||
font-family: inherit; | |||
-webkit-transition: all .2s ease-in-out; | |||
-moz-transition: all .2s ease-in-out; | |||
transition: all .2s ease-in-out; | |||
} | |||
/* Main banner | |||
------------------------------------ */ | |||
#frb { | |||
position: absolute; | |||
top: 0 !important; | |||
left: 0; | |||
width: 100%; | |||
height: 100%; | |||
font-family: "Helvetica Neue", "Helvetica", "Nimbus Sans L", "Arial", "Liberation Sans", sans-serif; | |||
} | |||
#frb-mask { | |||
position: absolute; | |||
z-index: 1000; | |||
top: 0; | |||
left: 0; | |||
width: 100%; | |||
height: 100%; | |||
background-color: black; | |||
opacity: 0.8; | |||
} | |||
#frb-window { | |||
position: relative; | |||
top: 0; | |||
left: 0; | |||
right: auto; | |||
width: 100%; | |||
margin-top: 0; | |||
color: #000; | |||
background: #fff; | |||
} | |||
@media (min-width: 768px) { | |||
#frb-window { | |||
margin-top: 20px; | |||
left: 5%; | |||
right: 5%; | |||
width: 90%; | |||
} | |||
} | |||
/* --- Message --- */ | |||
.frb-message { | |||
font-size: 20px; | |||
line-height: 1.3; | |||
border: 5px solid #990000; | |||
border-bottom: 0; | |||
} | |||
.frb-message-text { | |||
padding: 20px; | |||
font-weight: bold; | |||
} | |||
@media (min-width: 768px) { | |||
.frb-message { | |||
font-size: 24px; | |||
line-height: 1.4; | |||
} | |||
.frb-message-text { | |||
padding: 48px 72px; | |||
} | |||
} | |||
@media (min-height: 1000px) { | |||
.frb-message { | |||
font-size: 24px; | |||
} | |||
.frb-message-text { | |||
padding: 48px 72px; | |||
} | |||
} | |||
.frb-message-text p { | |||
margin-bottom: 10px; | |||
} | |||
.frb-message-text p:last-child { | |||
margin-bottom: 0; | |||
} | |||
/* Call to action */ | |||
.frb-cta { | |||
text-align: center; | |||
background: #990000; | |||
color: #fff; | |||
padding: 10px; | |||
font-weight: 400; | |||
font-size: 24px; | |||
display: block; | |||
margin: auto; | |||
width: 100%; | |||
position: relative; | |||
} | |||
@media (min-height: 1000px) { | |||
.frb-cta { | |||
padding: 27px; | |||
} | |||
} | |||
@media (min-width : 1100px) { | |||
.frb-cta { | |||
font-size: 33px; | |||
} | |||
} | |||
.frb-cta:after { | |||
position: absolute; | |||
left: 50%; | |||
top: 100%; | |||
height: 0; | |||
width: 0; | |||
margin-left: - |