@charset "utf-8";

button { border: 0px; border-radius: 20px; box-sizing: border-box; color: var(--primary-button-text-color); cursor: pointer; float: right; font-size: 0.875em; margin: 0px; padding: 8px 16px; transition: box-shadow 150ms cubic-bezier(0.4, 0, 0.2, 1); user-select: none; }

[dir="rtl"] button { float: left; }

.bad-clock button, .captive-portal button, .https-only button, .insecure-form button, .lookalike-url button, .main-frame-blocked button, .neterror button, .pdf button, .ssl button, .enterprise-block button, .enterprise-warn button, .managed-profile-required button, .safe-browsing-billing button, .supervised-user-verify button, .supervised-user-verify-subframe button { background: var(--primary-button-fill-color); }

button:active { background: var(--primary-button-fill-color-active); outline: 0px; }

#debugging { display: inline; overflow: auto; }

.debugging-content { line-height: 1em; margin-bottom: 0px; margin-top: 1em; }

.debugging-content-fixed-width { display: block; font-family: monospace; font-size: 1.2em; margin-top: 0.5em; }

.debugging-title { font-weight: bold; }

#details { margin: 0px 0px 50px; }

#details p:not(:first-of-type) { margin-top: 20px; }

.secondary-button:active { border-color: white; box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px; }

.secondary-button:hover { background: var(--secondary-button-hover-fill-color); border-color: var(--secondary-button-hover-border-color); text-decoration: none; }

.error-code { color: var(--error-code-color); font-size: 0.8em; margin-top: 12px; text-transform: uppercase; }

#error-debugging-info { font-size: 0.8em; }

h1 { color: var(--heading-color); font-size: 1.6em; font-weight: normal; line-height: 1.25em; margin-bottom: 16px; }

h2 { font-size: 1.2em; font-weight: normal; }

.icon { height: 72px; margin: 0px 0px 40px; width: 72px; }

input[type="checkbox"] { opacity: 0; }

input[type="checkbox"]:focus ~ .checkbox::after { outline: -webkit-focus-ring-color auto 5px; }

.interstitial-wrapper { box-sizing: border-box; font-size: 1em; line-height: 1.6em; margin: 14vh auto 0px; max-width: 600px; width: 100%; }

#main-message > p { display: inline; }

#extended-reporting-opt-in { font-size: 0.875em; margin-top: 32px; }

#extended-reporting-opt-in label { display: grid; grid-template-columns: 1.8em 1fr; position: relative; }

#enhanced-protection-message { border-radius: 20px; font-size: 1em; margin-top: 32px; padding: 10px 5px; }

#enhanced-protection-message a { color: var(--google-red-10); }

#enhanced-protection-message label { display: grid; grid-template-columns: 2.5em 1fr; position: relative; }

#enhanced-protection-message div { margin: 0.5em; }

#enhanced-protection-message .icon { height: 1.5em; vertical-align: middle; width: 1.5em; }

.nav-wrapper { margin-top: 51px; }

.nav-wrapper::after { clear: both; content: ""; display: table; width: 100%; }

.small-link { color: var(--small-link-color); font-size: 0.875em; }

.checkboxes { flex: 0 0 24px; }

.checkbox { --padding: .9em; background: transparent; display: block; height: 1em; left: -1em; padding-inline-start: var(--padding); position: absolute; right: 0px; top: -0.5em; width: 1em; }

.checkbox::after { border: 1px solid white; border-radius: 2px; content: ""; height: 1em; left: var(--padding); position: absolute; top: var(--padding); width: 1em; }

.checkbox::before { background: transparent; border-width: 0px 2px 2px; border-style: solid; border-color: white; border-image: initial; border-inline-end-width: 0px; content: ""; height: 0.2em; left: calc(.3em + var(--padding)); opacity: 0; position: absolute; top: calc(.3em  + var(--padding)); transform: rotate(-45deg); width: 0.5em; }

input[type="checkbox"]:checked ~ .checkbox::before { opacity: 1; }

@media (max-width: 700px) {
  .interstitial-wrapper { padding: 0px 10%; }
  #error-debugging-info { overflow: auto; }
}

@media (max-width: 420px) {
  button, [dir="rtl"] button, .small-link { float: none; font-size: 0.825em; font-weight: 500; margin: 0px; width: 100%; }
  button { padding: 16px 24px; }
  #details { margin: 20px 0px; }
  #details p:not(:first-of-type) { margin-top: 10px; }
  .secondary-button:not(.hidden) { display: block; margin-top: 20px; text-align: center; width: 100%; }
  .interstitial-wrapper { padding: 0px 5%; }
  #extended-reporting-opt-in { margin-top: 24px; }
  #enhanced-protection-message { margin-top: 24px; }
  .nav-wrapper { margin-top: 30px; }
}

@media (max-width: 420px) {
  .nav-wrapper .secondary-button { border: 0px; margin: 16px 0px 0px; margin-inline-end: 0px; padding-bottom: 16px; padding-top: 16px; }
}

@media (min-width: 240px) and (max-width: 420px) and (min-height: 401px), (min-width: 421px) and (min-height: 240px) and (max-height: 560px) {
  body .nav-wrapper { background: var(--background-color); bottom: 0px; box-shadow: 0 -12px 24px var(--background-color); left: 0px; margin: 0px auto; max-width: 736px; padding-inline: 24px; position: fixed; right: 0px; width: 100%; z-index: 2; }
  .interstitial-wrapper { max-width: 736px; }
  #details, #main-content { padding-bottom: 40px; }
  #details { padding-top: 5.5vh; }
  button.small-link { color: var(--google-blue-600); }
}

@media (max-width: 420px) and (orientation: portrait), (max-height: 560px) {
  body { margin: 0px auto; }
  button, [dir="rtl"] button, button.small-link, .nav-wrapper .secondary-button { font-family: Roboto-Regular, Helvetica; font-size: 0.933em; margin: 6px 0px; transform: translateZ(0px); }
  .nav-wrapper { box-sizing: border-box; padding-bottom: 8px; width: 100%; }
  #details { box-sizing: border-box; height: auto; margin: 0px; opacity: 1; transition: opacity 250ms cubic-bezier(0.4, 0, 0.2, 1); }
  #details.hidden, #main-content.hidden { height: 0px; opacity: 0; overflow: hidden; padding-bottom: 0px; transition: none; }
  h1 { font-size: 1.5em; margin-bottom: 8px; }
  .icon { margin-bottom: 5.69vh; }
  .interstitial-wrapper { box-sizing: border-box; margin: 7vh auto 12px; padding: 0px 24px; position: relative; }
  .interstitial-wrapper p { font-size: 0.95em; line-height: 1.61em; margin-top: 8px; }
  #main-content { margin: 0px; transition: opacity 100ms cubic-bezier(0.4, 0, 0.2, 1); }
  .small-link { border: 0px; }
  .suggested-left > #control-buttons, .suggested-right > #control-buttons { float: none; margin: 0px; }
}

@media (min-width: 421px) and (min-height: 500px) and (max-height: 560px) {
  .interstitial-wrapper { margin-top: 10vh; }
}

@media (min-height: 400px) and (orientation: portrait) {
  .interstitial-wrapper { margin-bottom: 145px; }
}

@media (min-height: 299px) {
  .nav-wrapper { padding-bottom: 16px; }
}

@media (max-height: 560px) and (min-height: 240px) and (orientation: landscape) {
  .extended-reporting-has-checkbox #details { padding-bottom: 80px; }
}

@media (min-height: 500px) and (max-height: 650px) and (max-width: 414px) and (orientation: portrait) {
  .interstitial-wrapper { margin-top: 7vh; }
}

@media (min-height: 650px) and (max-width: 414px) and (orientation: portrait) {
  .interstitial-wrapper { margin-top: 10vh; }
}

@media (max-height: 400px) and (orientation: portrait), (max-height: 239px) and (orientation: landscape), (max-width: 419px) and (max-height: 399px) {
  .interstitial-wrapper { display: flex; flex-direction: column; margin-bottom: 0px; }
  #details { flex: 1 1 auto; order: 0; }
  #main-content { flex: 1 1 auto; order: 0; }
  .nav-wrapper { flex: 0 1 auto; margin-top: 8px; order: 1; padding-inline: 0px; position: relative; width: 100%; }
  button, .nav-wrapper .secondary-button { padding: 16px 24px; }
  button.small-link { color: var(--google-blue-600); }
}

@media (max-width: 239px) and (orientation: portrait) {
  .nav-wrapper { padding-inline: 0px; }
}