| 1 | @import url("chrome://global/skin/in-content/common.css");\r |
| 2 | /* Body and container */\r |
| 3 | body {\r |
| 4 | display: flex;\r |
| 5 | flex-direction: column;\r |
| 6 | box-sizing: padding-box;\r |
| 7 | min-height: 100vh;\r |
| 8 | padding-top: 0;\r |
| 9 | padding-bottom: 0;\r |
| 10 | -moz-padding-start: calc(48px + 4.6em);\r |
| 11 | -moz-padding-end: 48px;\r |
| 12 | align-items: center;\r |
| 13 | justify-content: center;\r |
| 14 | }\r |
| 15 | \r |
| 16 | .container {\r |
| 17 | min-width: 13em;\r |
| 18 | max-width: 52em;\r |
| 19 | }\r |
| 20 | \r |
| 21 | .container.flex,\r |
| 22 | .container.restore-chosen {\r |
| 23 | display: flex;\r |
| 24 | flex-direction: column;\r |
| 25 | flex-grow: 1;\r |
| 26 | margin: 10vh 0;\r |
| 27 | }\r |
| 28 | \r |
| 29 | /* Typography */\r |
| 30 | .title {\r |
| 31 | background-image: url("chrome://browser/skin/aboutNetError_info.svg");\r |
| 32 | background-position: left 0;\r |
| 33 | background-repeat: no-repeat;\r |
| 34 | background-size: 1.6em;\r |
| 35 | -moz-margin-start: -2.3em;\r |
| 36 | -moz-padding-start: 2.3em;\r |
| 37 | font-size: 2.5em;\r |
| 38 | }\r |
| 39 | \r |
| 40 | .title:-moz-dir(rtl) {\r |
| 41 | background-position: right 0;\r |
| 42 | }\r |
| 43 | \r |
| 44 | .title-text {\r |
| 45 | border-bottom: 1px solid #A09090;\r |
| 46 | font-size: inherit;\r |
| 47 | padding-bottom: 0.4em;\r |
| 48 | }\r |
| 49 | \r |
| 50 | @media (max-width: 675px) {\r |
| 51 | body {\r |
| 52 | padding: 0 48px;\r |
| 53 | }\r |
| 54 | \r |
| 55 | .title {\r |
| 56 | background-image: none !important;\r |
| 57 | -moz-padding-start: 0;\r |
| 58 | -moz-margin-start: 0;\r |
| 59 | }\r |
| 60 | \r |
| 61 | .title-text {\r |
| 62 | padding-top: 0;\r |
| 63 | }\r |
| 64 | }\r |
| 65 | \r |
| 66 | ul, ol {\r |
| 67 | margin: 0;\r |
| 68 | padding: 0;\r |
| 69 | -moz-margin-start: 1em;\r |
| 70 | }\r |
| 71 | \r |
| 72 | ul > li, ol > li {\r |
| 73 | margin-bottom: .5em;\r |
| 74 | }\r |
| 75 | \r |
| 76 | ul {\r |
| 77 | list-style: disc;\r |
| 78 | }\r |
| 79 | \r |
| 80 | /* Buttons */\r |
| 81 | .button-container {\r |
| 82 | margin-top: 1.2em;\r |
| 83 | }\r |
| 84 | \r |
| 85 | .button-container > button {\r |
| 86 | min-width: 150px;\r |
| 87 | }\r |
| 88 | \r |
| 89 | .button-container > button:first-child {\r |
| 90 | -moz-margin-start: 0;\r |
| 91 | }\r |
| 92 | \r |
| 93 | /* Trees */\r |
| 94 | .tree-container {\r |
| 95 | margin-top: 1.2em;\r |
| 96 | flex-grow: 1;\r |
| 97 | min-height: 12em;\r |
| 98 | }\r |
| 99 | \r |
| 100 | .tree-container > tree {\r |
| 101 | height: 100%;\r |
| 102 | }\r |
| 103 | \r |
| 104 | tree {\r |
| 105 | width: 100%;\r |
| 106 | }\r |