Template:Styles/2015 Trilogy default.css: Difference between revisions
Content deleted Content added
No edit summary |
No edit summary |
||
Line 84:
#donate-form-wrapper:before { display: none; }
}
/* --- Donation Amounts --- */
#radiobuttons-table { width: 100%; }
.radiobuttons-cell {
width: 20%;
text-align: center;
}
@media only screen and (max-width: 740px) {
.radiobuttons-cell {
padding: 0 !important;
}
}
.radiobuttons-cell input[type="radio"] {
width: 1px;
height: 1px;
margin: -1px;
padding: 0;
overflow: hidden;
position: absolute;
border: 0;
clip: rect(0 0 0 0);
}
.input_amount_0 label,
.input_amount_1 label,
.input_amount_2 label,
.input_amount_3 label,
.input_amount_4 label,
.input_amount_5 label,
.input_amount_6 label {
background: #367fb4;
display: block;
padding: 2em 0;
font: 1.2em/1 "Helvetica Neue Roman",Arial, Helvetica, sans-serif;
font-weight: 300;
-moz-border-radius: .3em;
-webkit-border-radius: .3em;
border-radius: .3em;
color: #fff;
cursor: pointer;
outline: 0;
backface-visibility: hidden;
}
@media only screen and (max-width: 740px) {
.input_amount_0 label,
.input_amount_1 label,
.input_amount_2 label,
.input_amount_3 label,
.input_amount_4 label,
.input_amount_5 label,
.input_amount_6 label {
padding: 1em 0;
}
}
.input_amount_other {
background: #367fb4;
padding: 0 .7em;
font-weight: 300;
-moz-border-radius: .3em;
-webkit-border-radius: .3em;
border-radius: .3em;
color: #fff;
cursor: pointer;
}
.input_amount_other input {
background: #235375;
width: 100%;
font: 1.2em/1 "Helvetica Neue Roman",Arial, Helvetica, sans-serif;
color: #fff;
padding: .5em .5em .5em 1em;
border: 0;
cursor: pointer;
outline: 0;
-moz-border-radius: .3em;
-webkit-border-radius: .3em;
border-radius: .3em;
}
.input_amount_other input:hover {
background: #19415e;
}
.input_amount_other input:focus {
background: #fff;
color: #19415e;
}
.input_amount_other.checked input {
background: #fff;
color: #19415e;
}
.input_amount_other.checked input:hover {
background: #cbcbcb;
}
.input_amount_other.checked input:focus {
-moz-box-shadow: inset 0 1px 3px rgba(0,0,0,.25);
-webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.25);
box-shadow: inset 0 1px 3px rgba(0,0,0,.25);
}
.input_amount_other fieldset {
position: relative;
padding: 0;
margin: 0;
border: 0;
}
.input_amount_other fieldset label {
position: absolute;
left: .35em;
top: .5em;
}
.input_amount_other.checked fieldset label {
color: #0f4062;
}
.input_amount_other {
line-height: 1 !important;
}
@media only screen and (max-width: 740px) {
.input_amount_other > label {
line-height: 1;
font-size: .55em;
text-transform: uppercase;
}
.input_amount_other fieldset {
padding: 0 .3em;
}
.input_amount_other input {
font-size: .8em;
padding: .3em .5em .3em 1em;
}
.input_amount_other fieldset label {
font-size: 1em;
top: .16em;
}
}
.radiobuttons-cell label:active,
.radiobuttons-cell input[type="radio"]:checked + label,
.input_amount_other.checked {
background: #0f4b76;
-moz-box-shadow: inset 0 1px 3px rgba(0,0,0,.25);
-webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.25);
box-shadow: inset 0 1px 3px rgba(0,0,0,.25);
}
/* Fallback for IE8 and below */
.radiobuttons-cell label.checked,
.input_amount_other.checked {
background: #0f4b76 !important;
}
/* --- Infobox ("Where your donation goes") --- */
|