@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500&display=swap');

.container, .masthead-container {
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}
@media (min-width: 576px) {
    .container, .masthead-container {
        max-width: 540px;
    }
}
@media (min-width: 768px) {
    .container, .masthead-container {
        max-width: 720px;
    }
}
@media (min-width: 992px) {
    .container, .masthead-container {
        max-width: 960px;
    }
}
@media (min-width: 1200px) {
    .container, .masthead-container {
        max-width: 1140px;
    }
}

@media (min-width: 1400px) {
    .container, .masthead-container {
        max-width: 1340px;
    }
}

@media (min-width: 1500px) {
    .container, .masthead-container {
        max-width: 1440px;
    }
}

body, .layout-content.status.status-api .section .example-container .example-opener .color-secondary, .grouped-items-selector, .layout-content.status.status-full-history .history-nav a.current, #uptime-tooltip .tooltip-box {
		    background: #26262B;
}

body {
      font-family: 'Inter', sans-serif;
}

.components-section {
  background: #2e2e33;
  border-radius: 8px !important;
  -webkit-border-radius: 8px !important;
  -moz-border-radius: 8px !important;
  -o-border-radius: 8px !important;
}

.custom-metrics-container, .incidents-list {
  background: #2e2e33;
  border-radius: 8px !important;
  -webkit-border-radius: 8px !important;
  -moz-border-radius: 8px !important;
  -o-border-radius: 8px !important;
  padding: 1rem;
}

.highcharts-root > rect {
  	fill: none !important;
}

.components-uptime-link {
	   padding-right: 1rem;
}

.shared-partial.uptime-90-days-wrapper svg rect:hover {
  fill: #34343a;
}

nav {
  padding: 2rem 0;
  background: #1F1F23;
}

nav .container {
  display: flex;
  justify-content: space-between;
}

nav svg {
  width: 3rem;
  height: auto;
}

.nav-link {
  display: block;
      background: #7289da;
    color: white !important;
    padding: 1rem 1.25rem !important;
    border-radius: 8px;
    text-transform: uppercase;
}