/* Body */

body {
  font-family: "Inter", sans-serif;
  background-color: #fafafa;
}

/* Navbar */
.navbar .brand {
  background-size: 100%, auto;
  height: 30px;
  width: 150px;
  padding: 0;
  margin-top: 8px;
  margin-bottom: 8px;
}

@media screen and (min-width: 1025px) {
  .navbar .brand {
    margin-top: 24px;
    margin-bottom: 24px;
  }
}

.navbar .nav a {
  font-size: 1.35em;
}

@media (min-width: 769px) {
  .navbar .nav {
    top: 16px;
  }
}

.navbar .nav .active .caret {
  display: none;
}

/* Search */

#docsSearch {
  position: relative;
  border: none;
  background-color: #171e2d;
  position: relative;
  overflow: hidden;
}

@media screen and (max-width: 1899px) and (min-width: 1025px) {
  #docsSearch {
    height: 360px;
  }
}

#docsSearch h1 {
  color: #ffffff;
  font-size: 36px;
  padding-top: 40px;
}

#searchBar {
  margin-bottom: 40px;
}

@media screen and (min-width: 1025px) {
  #docsSearch h1 {
    padding-top: 80px;
  }
  #searchBar {
    margin-bottom: 80px;
  }
}

#docsSearch .search-query {
  border: 1px solid #2a70ff;
  border-radius: 12px;
  color: #434a58;
  height: 56px;
  font-size: 18px;
  padding-left: 16px;
  padding-right: 80px;
}

@media screen and (min-width: 1025px) {
  #docsSearch .search-query {
    padding-right: 132px;
  }
}

#docsSearch #searchBar button {
  background: #2a70ff;
  height: 56px;
  border-radius: 0 12px 12px 0;
  border: 1px #2a70ff;
  text-shadow: none;
  font-size: 18px;
  font-weight: 400;
  padding: 0 32px;
  line-height: 0;
  transition: all 0.1s ease-in !important;
  outline: none;
}

#searchBar button .icon-search {
  color: #ffffff;
}

@media screen and (min-width: 1025px) {
  #docsSearch::before {
    background-image: url("https://assets.withforerunner.com/help-desk/fdem-forerunner-help-center/images/Left_bg_pattern.svg");
    background-repeat: no-repeat;
    background-size: cover;
    bottom: 0;
    content: "";
    height: 100%;
    position: absolute;
    left: 15%;
    top: 25%;
    transform: translateX(-50%);
    width: 515px;
    transition: left 0.2s;
  }
}

@media screen and (min-width: 1500px) {
  #docsSearch::before {
    left: 10%;
  }
}

@media screen and (min-width: 1025px) {
  #docsSearch::after {
    background-image: url("https://assets.withforerunner.com/help-desk/fdem-forerunner-help-center/images/Right_bg_pattern.svg");
    background-repeat: no-repeat;
    background-size: cover;
    bottom: 0;
    content: "";
    height: 100%;
    position: absolute;
    left: 85%;
    top: 25%;
    transform: translateX(-50%);
    width: 515px;
    transition: left 0.2s;
  }
}

@media screen and (min-width: 1500px) {
  #docsSearch::after {
    left: 90%;
  }
}

/* Article Outline */

#sidebar form .search-query {
  border-radius: 12px;
}

#sidebar h3 {
  display: none;
}

#sidebar .nav-list a {
  color: #0c111b;
  font-size: 18px;
  line-height: 26px;
  font-weight: 400;
}

.icon-arrow::before {
  color: #2a70ff;
}

#sidebar .nav-list .active a,
#sidebar .nav-list .active a:hover,
#sidebar .nav-list .active a:focus {
  color: #2a70ff;
  font-weight: 500;
  font-size: 18px;
}

/* Article Content */

#main-content {
  background: none;
}

.contentWrapper {
  background: #fff;
  border-radius: 12px;
  border: 1px solid #e4e5e7;
  color: #434a58;
}

#categoryHead .sort {
  display: none;
}

.contentWrapper h1 {
  color: #0c111b;
}

/* Home Icons */

.container-fluid {
  max-width: 1200px;
}

.category-list {
  margin-top: 64px;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}

#category-4 {
background-image: url("https://assets.withforerunner.com/help-desk/fdem-forerunner-help-center/images/plant-ground%2B1.png");
}

#category-6 {
background-image: url("https://assets.withforerunner.com/help-desk/fdem-forerunner-help-center/images/check-list%2B1.png");
}

#category-7 {
background-image: url("https://assets.withforerunner.com/help-desk/fdem-forerunner-help-center/images/ambulance%2B1.png");
}

#category-8 {
background-image: url("https://assets.withforerunner.com/help-desk/fdem-forerunner-help-center/images/folder-user%2B1.png");
}

#category-12 {
background-image: url("https://assets.withforerunner.com/help-desk/fdem-forerunner-help-center/images/property-agreement%2B1.png");
}

#category-13 {
background-image: url("https://assets.withforerunner.com/help-desk/fdem-forerunner-help-center/images/PropertyInfo.png");
}

#category-14 {
background-image: url("https://assets.withforerunner.com/help-desk/fdem-forerunner-help-center/images/mortgage%2B1.png");
}

#category-15 {
background-image: url("https://assets.withforerunner.com/help-desk/fdem-forerunner-help-center/images/app-services%2B1.png");
}

#category-41 {
background-image: url("https://assets.withforerunner.com/help-desk/fdem-forerunner-help-center/images/Map.png");
}

#category-40 {
background-image: url("https://assets.withforerunner.com/help-desk/fdem-forerunner-help-center/images/SISD.png");
}

#category-42 {
background-image: url("https://assets.withforerunner.com/help-desk/fdem-forerunner-help-center/images/Activity%2B_%2BResident%2BLogs.png");
}

#category-100 {
background-image: url("https://assets.withforerunner.com/help-desk/fdem-forerunner-help-center/images/PropertyInfo.png");
}

#category-97 {
background-image: url("https://assets.withforerunner.com/help-desk/fdem-forerunner-help-center/images/property-agreement%2B1.png");
}

#category-99 {
background-image: url("https://assets.withforerunner.com/help-desk/fdem-forerunner-help-center/images/ambulance%2B1.png");
}

.category-list .category {
  background-color: #fff;
  border: none;
  border-radius: 4px;
  box-shadow: rgba(0, 0, 0, 0.03) 0px 0px 0px 1px,
    rgb(241, 243, 245) 0px 2px 10px 0px, rgba(0, 0, 0, 0.05) 0px 3px 3px 0px;
  box-sizing: border-box;
  display: inline-block;
  margin: 0 0.8% 20px;
  padding: 200px 64px 24px;
  min-height: 285px;
  transition: all 0.25s ease-in-out;
  width: 31%;
}

@media (max-width: 768px) {
  .category-list .category,
  .category-list.two-col .category {
    width: 44.5%;
  }
}

@media (max-width: 600px) and (max-width: 768px) {
  .category-list .category,
  .category-list.two-col .category {
    box-sizing: border-box;
    margin: 0 0 -1px;
    width: 100%;
  }
}

.category-list .category,
.category-list .category:hover {
  background-repeat: no-repeat;
  background-position: center 64px;
  background-size: 80px 80px;
  background-color: #ffffff;
}

.category-list .category,
.category-list.two-col .category {
  margin-bottom: 30px;
}

.category:hover {
  box-shadow: 0px 4px 16px rgba(12, 17, 27, 0.15);
}

.category-list h3 {
  font-weight: 500;
  font-size: 18px;
  margin-bottom: 15px;
}

/* Contact */

#contactModal {
  border: 0;
  width: 600px;
  margin-left: -300px;
  top: 8%;
}

#contactModal h2 {
  color: #0c111b;
  font-weight: 500;
  font-size: 28px;
  border: 0;
  padding: 40px 0 10px 60px;
}

#contactModal #closeBtn {
  right: 14px;
}

#contactModal .modal-body {
  padding: 15px 60px 40px;
}

#contactForm .control-group,
#contactModal .control-group,
.abuse .control-group {
  margin-bottom: 20px;
}

#contactModal .control-label {
  float: none;
  display: block;
  color: #434a58;
  font-size: 14px;
  font-weight: 400;
  margin: 0 0 5px;
  padding: 0;
  text-align: left;
  width: 100%;
}

#contactModal .controls {
  margin: 0;
}

#contactModal input[type="text"],
#contactModal input[type="email"],
#contactModal textarea {
  box-sizing: border-box;
  min-height: 48px;
  width: 100%;
}

#contactModal #md-message {
  padding: 14px;
  height: 70px;
  width: 100%;
}

#contactModal .form-actions {
  padding: 0;
}

#contactModal input[type="submit"].btn {
  width: 100%;
  background: #2a70ff;
  height: 52px;
  transition: all 0.2s ease-in-out;
  color: #ffffff;
  font-size: 18px;
}

/* Footer */

.articleFoot p,
.articleFoot time {
  font-family: "Inter", sans-serif;
  font-style: normal;
}
