diff options
-rw-r--r-- | style.css | 30 |
1 files changed, 18 insertions, 12 deletions
@@ -370,7 +370,7 @@ select { | |||
370 | } | 370 | } |
371 | 371 | ||
372 | label { | 372 | label { |
373 | margin-bottom: 0.4em; | 373 | margin-bottom: 1em; |
374 | } | 374 | } |
375 | 375 | ||
376 | input[type=checkbox]:not(old) { | 376 | input[type=checkbox]:not(old) { |
@@ -381,31 +381,37 @@ input[type=checkbox]:not(old) { | |||
381 | input[type=checkbox]:not(old) + label { | 381 | input[type=checkbox]:not(old) + label { |
382 | display : inline-block; | 382 | display : inline-block; |
383 | margin-left : 0; | 383 | margin-left : 0; |
384 | line-height : 1.5em; | 384 | line-height : 1.7em; |
385 | text-indent : -2.0625em; /* Make 2nd line of label align, takes border width of tickbox into account */ | 385 | text-indent : -46.5px; /* Make 2nd line of label align, takes border width of tickbox into account */ |
386 | padding-left : 2.0625em; | 386 | padding-left : 46.5px; |
387 | } | 387 | } |
388 | 388 | ||
389 | input[type=checkbox]:not(old) + label > span { | 389 | input[type=checkbox]:not(old) + label > span { |
390 | display : inline-block; | 390 | display : inline-block; |
391 | width : 1em; | 391 | width : 28px; |
392 | height : 1em; | 392 | height : 28px; |
393 | margin : 0.25em 1em 0.25em 0; | 393 | margin : 2px 16px 8px 0; |
394 | border : 0.0625em solid white; | 394 | border : 0.5px solid white; |
395 | border-radius : 25%; | 395 | border-radius : 25%; |
396 | vertical-align : top; | 396 | vertical-align : top; |
397 | transform : rotate(360deg); | ||
398 | transition : transform 0.3s, font-size 0.4s; | ||
399 | font-size : 1pt; | ||
400 | } | ||
401 | |||
402 | input[type=checkbox]:not(old):checked + label > span { | ||
403 | transform : rotate(0deg); | ||
404 | font-size : 17pt; | ||
397 | } | 405 | } |
398 | 406 | ||
399 | input[type=checkbox]:not(old):checked + label > span:before { | 407 | input[type=checkbox]:not(old):checked + label > span:before { |
400 | content : '✓'; | 408 | content : '✓'; |
401 | display : inline-block; | 409 | display : inline-block; |
402 | width : 1em; | 410 | width : 28px; |
403 | color : white; | 411 | color : white; |
404 | font-size : 1.4em; | ||
405 | line-height : 1em; | ||
406 | text-align : center; | 412 | text-align : center; |
407 | font-weight : bold; | 413 | font-weight : bold; |
408 | margin-left : 2.1em; | 414 | margin-left : 71px; |
409 | } | 415 | } |
410 | 416 | ||
411 | #wrapper.step1 .block-step1 .juice, | 417 | #wrapper.step1 .block-step1 .juice, |