.center {
  text-align: center
}

/* Used in AdMob code examples */
.oldcode {
  opacity: .40;

  /* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);

  /* IE <= 7 */
  filter:alpha(opacity=40);
}

.newcode {
  font-weight: bold;
}

/* Device Screenshots */
.deviceshot {
  max-width: 700px;
  max-height: 400px;
}


/* Start Changelog styles */
.badge {
    position: relative;
    top: -3px;
    border-radius: 16px;
    display: inline-block;
		width: 110px;
    height: 32px;
    line-height: 32px;
    margin-right: 10px;
    text-transform: uppercase;
    font-size: 13px;
    font-weight: 700;
    text-align: center;
    color: var(--tenant-inverted-text-color);
}

.checklist > ul  {
  padding-left: 125px;
}

.checklist > ul > li {
  list-style-type: none;
  margin-bottom: 22px;
}

.changelog > ul  {
  padding-left: 0;
}

.changelog > ul > li {
  list-style-type: none;
  margin-bottom: 22px;
}

.firebase-support-release-page .changelog > ul {
  list-style-type: none;
  padding-left: 125px;
}

.firebase-release-roundup .changelog > ul {
  list-style-type: disc outside;
  padding-left: 40px;
}

.firebase-release-roundup .changelog > ul > li {
  list-style-type: disc outside;
  margin-bottom: 12px;
}

.generic-android::before, .generic-ios::before, .generic-mobile::before,
.generic-web::before, .generic-flutter::before, .generic-unity::before,
.generic-cpp::before, .generic-all::before, .release-changed::before,
.release-deprecated::before, .release-feature::before, .release-fixed::before,
.release-important::before, .release-issue::before, .release-removed::before,
.release-unchanged::before, .release-android::before,
.release-android-bom::before, .release-ios::before, .release-javascript::before,
.release-flutter::before, .release-unity::before, .release-cpp::before,
.release-admin::before, .release-functions::before, .release-cli::before,
.release-rules::before  {
  display: block;
  float: left;
  width: 110px;
  height: 32px;
  margin-left: -125px;
  margin-right: 10px;
  border-radius: 16px;
  text-transform: uppercase;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
	color: var(--tenant-inverted-text-color);
}

.generic-android::before {
  content: "Android";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #93b234;
}

.generic-ios::before {
  text-transform: none;
  content: "iOS+";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #0071e3;
}

.generic-mobile::before {
  content: "Mobile";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: var(--devsite-ref-palette--grey700);
}

.color-scheme--dark .generic-mobile::before {
  border: 4px solid;
  border-color: var(--devsite-ref-palette--grey400);
}

.generic-web::before {
  content: "Web";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #e67e00;
}

.generic-flutter::before {
  content: "Flutter";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #29b6f6;
}

.generic-unity::before {
  content: "Unity";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #7f6545;
}

.generic-cpp::before {
  content: "C++";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #909090;
}

.generic-all::before {
  content: "All";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: var(--devsite-ref-palette--grey400);
}

.color-scheme--dark .generic-all::before {
  border-color: var(--devsite-ref-palette--grey700);
}

.release-changed::before {
  content: "changed";
  background-color: #ff6961;
	padding-top: 4px;
}

.release-deprecated::before {
  content: "deprecated";
  background-color: #d70015;
	padding-top: 4px;
}

.release-feature::before {
  content: "feature";
  background-color: #0f9d58;
	padding-top: 4px;
}

.release-fixed::before {
  content: "fixed";
  background-color: #4285f4;
	padding-top: 4px;
}

.release-important::before {
  content: "important";
  background-color: #d70015;
	padding-top: 4px;
}

.release-issue::before {
  content: "issue";
  background-color: #d70015;
	padding-top: 4px;
}

.release-removed::before {
  content: "removed";
  background-color: #546e7a;
	padding-top: 4px;
}

.release-unchanged::before {
  content: "no change";
  background-color: #ccc;
	padding-top: 4px;
}

.release-android::before {
  content: "Android";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #93b234;
}

.release-android-bom::before {
  content: "Android BoM";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #93b234;
}

.release-ios::before {
  text-transform: none;
  content: "iOS+";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #0071e3;
}

.release-javascript::before {
  content: "JavaScript";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #e67e00;
}

.release-flutter::before {
  content: "Flutter";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #29b6f6;
}

.release-unity::before {
  content: "Unity";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #7f6545;
}

.release-cpp::before {
  content: "C++";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #909090;
}

.release-admin::before {
  content: "Admin";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #7e57c2;
}

.release-functions::before {
  content: "Functions";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #2c384a;
}

.release-cli::before {
  text-transform: none;
  content: "CLI";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #f4b400;
}

.release-rules::before {
  content: "Rules";
	color: var(--tenant-secondary-text-color);
	border: 5px solid;
	border-color: #002991;
}

/* End Changelog styles */


/* Docs Overview page styles */

.docs-ios,
.docs-android,
.docs-web,
.docs-flutter,
.docs-unity,
.docs-cpp,
.docs-admin {
  height: 64px;
  width: 64px;
  margin: 10px 16px 0 -16px;
}

.firebase-docs-overview .devsite-landing-row h2 {
  margin: 80px 0 -40px;
}

.devsite-landing-row-3-up .docs-landing-row-item {
    width: calc((100% - 80px)/2);
    display: inline-block;
}

.docs-landing-icon {
  font-size: 48px;
  height: 48px;
  margin: 11px;
  width: 48px;
}

.firebase-reference-list {
  display: -ms-flex;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  list-style: none;
  margin: 0 0 40px;
  padding: 0;
}

.firebase-reference-list-item {
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  margin: 40px 0 0;
  padding: 0;
}

.firebase-reference-list-item > a {
  -ms-flex-align: center;
  align-items: center;
  display: -ms-flex;
  display: flex;
}

.firebase-reference-list-item > a:not(:hover) h3 {
  color: var(--tenant-primary-text-color);
}

.firebase-reference-list-item > a:not(:hover) li,
.firebase-reference-list-item > a:not(:hover) p {
  color: var(--tenant-secondary-text-color);
}

.firebase-reference-list-item .docs-landing-icon {
  -ms-flex-align: center;
  align-items: center;
  background-color: inherit;
  border: 1.5px solid var(--devsite-ref-palette--grey300);
  border-radius: 8px;
  -ms-flex: 0 0 88px;
  flex: 0 0 88px;
  height: 88px;
  -ms-justify-content: center;
  justify-content: center;
  margin: 0 16px 0 0;
  padding: 20px;
}

.color-scheme--dark .firebase-reference-list-item .docs-landing-icon {
  border: 1.5px solid var(--tenant-docs-landing-icon-background);
}

.color-scheme--dark .firebase-reference-list-item.docs-unity .docs-landing-icon {
  color: white;
}

.firebase-reference-list-item h3 {
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  font-size: 18px;
  line-height: 28px;
  margin: 0;
}

.firebase-reference-list-item ul {
  list-style: none;
  padding: 0;
}

.docs-android,
.docs-ios,
.docs-web,
.docs-flutter,
.docs-unity,
.docs-cpp,
.docs-admin {
  height: 88px;
  width: auto;
}

.firebase-reference-list-item.docs-ios .docs-landing-icon {
  color: #0071e3;
}

.firebase-reference-list-item.docs-android .docs-landing-icon {
  color: #93b234;
}

.firebase-reference-list-item.docs-web .docs-landing-icon {
  color: #e67e00;
}

.firebase-reference-list-item.docs-flutter .docs-landing-icon {
  color: #29b6f6;
}

.firebase-reference-list-item.docs-unity .docs-landing-icon {
  color: #000;
}

.firebase-reference-list-item.docs-cpp .docs-landing-icon {
  color: #909090;
}

.firebase-reference-list-item.docs-admin .docs-landing-icon {
  color: #7e57c2;
}

.firebase-reference-list-item:hover .docs-landing-icon {
  background-color: var(--devsite-link-background);
}

.color-scheme--dark .firebase-reference-list-item:hover .docs-landing-icon {
  background-color: var(--devsite-ref-palette--grey800);
}

.color-scheme--dark .firebase-reference-list-item.docs-cpp:hover .docs-landing-icon {
  color: white;
}

@media (max-width: 1000px) {
  .firebase-reference-list {
    -ms-flex-direction: column;
    flex-direction: column;
  }
}

/* end Docs Overview page styles */

/* Full-page platform selector for Crashlytics docs */
/* Note: h3 in selector content must include hide-from-toc */

.full-page-selector,
.full-page-selector-content {
  border: none;
  font-size: inherit;
}

.full-page-selector > .kd-buttonbar {
  margin: 32px 0;
}

.full-page-selector > section {
  display: none;
}

.full-page-selector-content > .selected {
  padding: 0;
  font-size: inherit;
}

.full-page-selector-content > .kd-buttonbar {
  display: none;
}

.select-page {
  display: none;
}

.select-page + .ds-selector-tabs,
.after-selection ~ .ds-selector-tabs {
  border: none;
  font-size: inherit;
}

.select-page + .ds-selector-tabs > .kd-buttonbar {
  margin: 32px 0;
}

.select-page + .ds-selector-tabs > section {
  display: none;
}

.after-selection ~ .ds-selector-tabs > .selected {
  padding: 0;
  font-size: inherit;
}

.after-selection ~ .ds-selector-tabs > section p {
  line-height: 24px;
}

.after-selection ~ .ds-selector-tabs > .kd-buttonbar {
  display: none;
}

/* End full-page platform selector */

/* Custom beta and alpha indicators */

.devsite-nav-icon[data-icon="alpha"]::before {
  content: url(data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'><path d='M13.2,15c-0.3-0.9-0.6-1.7-0.9-2.6L12.1,12c0-0.1-0.1-0.3-0.1-0.4c-1.2,2.1-2.4,2.9-4.5,2.9C4.8,14.5,3,12.6,3,9s1.8-5.5,4.5-5.5c2.1,0,3.4,0.8,4.5,2.9L12.1,6l0.1-0.4c0.4-1.1,0.7-1.9,0.9-2.6h2.2c-0.4,0.8-0.7,1.7-1.2,3.2L14,6.6c-0.3,0.8-0.5,1.6-0.8,2.4c0.3,0.7,0.6,1.5,0.8,2.4l0.1,0.4c0.5,1.5,0.8,2.4,1.2,3.2C15.4,15,13.2,15,13.2,15z M7.5,5.5C5.9,5.5,5,6.5,5,9s0.9,3.5,2.5,3.5C9,12.5,9.9,11.6,11,9C9.9,6.4,9,5.5,7.5,5.5z' fill='%2354617d'/></svg>);
}

.color-scheme--dark .devsite-nav-icon[data-icon="alpha"]::before {
  content: url(data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'><path d='M13.2,15c-0.3-0.9-0.6-1.7-0.9-2.6L12.1,12c0-0.1-0.1-0.3-0.1-0.4c-1.2,2.1-2.4,2.9-4.5,2.9C4.8,14.5,3,12.6,3,9s1.8-5.5,4.5-5.5c2.1,0,3.4,0.8,4.5,2.9L12.1,6l0.1-0.4c0.4-1.1,0.7-1.9,0.9-2.6h2.2c-0.4,0.8-0.7,1.7-1.2,3.2L14,6.6c-0.3,0.8-0.5,1.6-0.8,2.4c0.3,0.7,0.6,1.5,0.8,2.4l0.1,0.4c0.5,1.5,0.8,2.4,1.2,3.2C15.4,15,13.2,15,13.2,15z M7.5,5.5C5.9,5.5,5,6.5,5,9s0.9,3.5,2.5,3.5C9,12.5,9.9,11.6,11,9C9.9,6.4,9,5.5,7.5,5.5z' fill='%239eabc3'/></svg>);
}

.devsite-nav-icon[data-icon="beta"]::before {
  content: url(data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'><path d='M12.2,7.7c1.8,1.2,2.3,3.7,1.1,5.6c-0.7,1.1-2,1.8-3.3,1.8H7v2H5V4c0-1.1,0.9-2,2-2h2.5C11.4,2,13,3.6,13,5.5C13,6.3,12.7,7.1,12.2,7.7z M7,13h3c1.1,0,2-0.9,2-2s-0.9-2-2-2H7V13z M7,7h2.5C10.3,7,11,6.3,11,5.5S10.3,4,9.5,4H7V7z' fill='%2354617d'/></svg>);
}

.color-scheme--dark .devsite-nav-icon[data-icon="beta"]::before {
  content: url(data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18'><path d='M12.2,7.7c1.8,1.2,2.3,3.7,1.1,5.6c-0.7,1.1-2,1.8-3.3,1.8H7v2H5V4c0-1.1,0.9-2,2-2h2.5C11.4,2,13,3.6,13,5.5C13,6.3,12.7,7.1,12.2,7.7z M7,13h3c1.1,0,2-0.9,2-2s-0.9-2-2-2H7V13z M7,7h2.5C10.3,7,11,6.3,11,5.5S10.3,4,9.5,4H7V7z' fill='%239eabc3'/></svg>);
}

.firebase-platform-label {
 font: 500 12px/24px 'Google Sans', sans-serif;
}
/* Full-page platform selector dropdown */
/* Note: use menu variables in _elements.html file */

.full-page-selector-dropdown {
  border: none;
  position: relative;
  float: left;
  display: inline-block;
}

.full-page-selector-dropdown > .ds-selector-tabs {
    display: none;
    position: absolute;
    min-width: 160px;
    z-index: 1;
}

.full-page-selector-dropdown:hover .ds-selector-tabs {
    display: block;
    margin: 0;
}

.full-page-selector-dropdown:hover .kd-tabbutton {
    display: block;
    border: none;
    height: inherit;
    text-align: left;
}

.full-page-selector-dropdown:hover .kd-buttonbar {
    border: none;
    height: inherit;
}

.full-page-selector-dropdown h3:hover {
    color: var(--tenant-inverted-text-color);
    background-color: #039be5;
}

.full-page-selector-dropdown:hover .devsite-overflow-menu-button {
    display: none;
}

img.white-bg {
  padding: 5px;
  border-radius: 2px;
  background-color: #fff;
}

body, table {
  font-variant-ligatures: no-contextual;
}

/* DEVSITE CARDS ON NON-LANDING-PAGES OF FIRESITE */
.firebase-guide-cards .devsite-landing-row-item {
  border: 1.5px solid var(--devsite-ref-palette--grey300);
  border-radius: 8px;
  padding: 1.5rem;
}

.color-scheme--dark .firebase-guide-cards .devsite-landing-row-item {
  border: 1.5px solid var(--devsite-ref-palette--grey800);
}

/* Required so that the card row doesn't have a gap above it */
.firebase-guide-cards {
  padding: 0 !important;
}


/* FIRESITE FIX - FONT STYLE -- TO BE MOVED INTO SITE'S SCSS IN FUTURE CL */
:root strong {
  font-weight: 700;
}


/* FIRESITE FIX - HEADING SIZE -- TO BE MOVED INTO SITE'S SCSS IN FUTURE CL */
/* H3 to H1 HEADINGS ARE SCALED IN EQUAL 6px JUMPS BASED ON THE H4, WHICH IS JUST A BIT BIGGER THAN THE PRIMARY FONT SIZE OF 16px */
:root h1 {
  font-size: 38px;
}

:root h2 {
  font-size: 32px;
}

:root h3 {
  font-size: 26px;
}

:root h4 {
  font-size: 20px;
}

/* PRIMARY FONT SIZE IS 16px - THIS MAKES THE H5 HEADINGS THE SAME SIZE BUT BOLD */
:root h5 {
  font-size: 16px;
  font-weight: 700;
}


/* FIRESITE FIX - TABLE HEADER ROW COLORS FOR DARK MODE -- TO BE MOVED INTO SITE'S SCSS IN FUTURE CL */
.color-scheme--dark th {
  background-color: var(--devsite-ref-palette--grey800);
}

.color-scheme--dark .alt td {
  background-color: var(--devsite-ref-palette-tenant--firebase-navy900);
}


/* FIRESITE FIX - NUMBERED-HEADING FONT COLOR -- TO BE MOVED INTO SITE'S SCSS IN FUTURE CL */
h2.numbered::before {
  color: var(--devsite-ref-palette--white);
}


/* FIRESITE FIX - CODE BLOCKS LEFT-RIGHT-ALIGNMENT WITH BODY TEXT -- TO BE MOVED INTO SITE'S SCSS IN FUTURE CL */

/* Applies the appropriate corner styling and page margins (default top/bottom from DevSite and custom right/left for Firesite) to the code block */
devsite-code {
  border-radius: 8px;
  margin: 16px 0;
}

/* Applies the appropriate padding of the content within the code block */
devsite-code pre {
  padding: 25px;
}

/* Applies the appropriate padding of the icons in the top-right corner of the code block */
devsite-code .devsite-code-buttons-container {
  right: 0;
}
