body { background-color: #000000; color: #FF9F00; margin-top: 2em; font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif; font-size: 100%; min-height: 200px; } p { font-size: .8em; } #error-box { background: url('chrome://global/skin/icons/information-24.png') no-repeat left 4px; -moz-padding-start: 30px; } #error-box:-moz-locale-dir(rtl) { background-position: right 4px; } #main-error-msg { color: #4b4b4b; font-weight: bold; } #button-box { text-align: center; width: 75%; margin: 0 auto; } @media all and (min-width: 300px) { #error-box { max-width: 50%; margin: 0 auto; background-image: url('chrome://global/skin/icons/information-32.png'); min-height: 36px; -moz-padding-start: 38px; } button { width: auto !important; min-width: 150px; } } @media all and (min-width: 780px) { #error-box { max-width: 30%; } } button { font: 11px "Liberation Sans",Arial,Tahoma,Helvetica,sans-serif; font-size: 0.6875em; -moz-user-select: none; width: 100%; margin: 2px 0; padding: 2px 6px; line-height: 1.2; background-color: #000000; color: #FFCF00; background-clip: padding-box; border: none; border-radius: 3px; transition-property: background-color, color; transition-duration: 150ms; transition-timing-function: ease; } button:hover { background-color: #FFCF00; color: #000000; transition-duration: 150ms; transition-timing-function: ease; } button:hover:active { background-color: #FF9F00; color: #000000; transition-duration: 10ms; transition-timing-function: linear; }