:root {
  --bs-app-sidebar-width: 0px;
  --bs-app-sidebar-width-actual: 0px;
  --bs-app-sidebar-gap-start: 0px;
  --bs-app-sidebar-gap-end: 0px;
  --bs-app-sidebar-gap-top: 0px;
  --bs-app-sidebar-gap-bottom: 0px;
  --bs-bullet-bg-color: #f1f1f1;
}

/*-----------------------------
 Header
 ----------------------------- */
.logo-bg {
  background-color: rgba(255, 87, 51, 0.75) !important;
  /* 50% opacity */
  border-radius: var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius) 0 0;
  --bs-heading-color: #f1f1f1;
  --bs-card-color: #f1f1f1;
  --bs-scrollbar-color: #f1f1f1;
  --bs-link-color-rgb: 241, 241, 241;
}

.smarter-version {
  font-family: 'Courier New', Courier, monospace;
  color: #333333;
}

.parent-class>* {
  color: #f1f1f1;
}


/*-----------------------------
 page: /docs/api/
 ----------------------------- */
.code-sample-body {
  position: relative;
  background-color: #333333;
  border-radius: 10px;
}

.code-sample-body pre {
  display: block;
  justify-content: flex-start;
  text-align: left;
  width: auto;
  word-wrap: break-word !important;
  unicode-bidi: isolate;
  white-space: pre-wrap;
  padding: 15px;
}

.code-sample-copy {
  position: relative;
  top: 10px;
  right: 10px;
}

.code-snippet {
  --bs-code-color: #f1f1f1;
  /* Text color */
  --bs-code-border-color: transparent;
  /* Border color */
  --bs-code-bg: #333333;
  /* Background color */
  --bs-code-shadow: 0px 3px 9px rgba(0, 0, 0, 0.08);
  /* Box shadow */
  white-space: pre;
  /* This is usually the default for <pre>, but it's good to ensure it's not being overridden */
  overflow-x: auto;
  /* Adds a horizontal scrollbar if the content is too wide */
}

/*
 FIX NOTE: was attempting to use this across the entire
 docs site to format inline code snippets, but it was
 causing adding weird line breaks.
*/
code {}

/*-----------------------------
 page: /docs/cli/
 ----------------------------- */
.terminal-emulation {
  font-family: 'Courier New', Courier, monospace;
  /* Monospace font */
  overflow-x: auto;
  /* Adds horizontal scrollbar if needed */
  background-color: #333333;
  /* Terminal-like background */
  color: #f1f1f1;
  /* Light text color for contrast */
  border: 1px solid #555;
  /* Optional: adds a border */
  box-shadow: var(--bs-code-shadow);
  /* Reuse the box-shadow variable for consistency */
  border-radius: 10px;
  word-wrap: break-word !important;
  /*Has the same effect as overflow-wrap: anywhere combined with word-break: normal, regardless of the actual value of the overflow-wrap property.*/
  white-space: pre-wrap;
  /* Sequences of white space are preserved. Lines are broken at newline characters, at <br>, and as necessary to fill line boxes.*/
  padding: 10px;
  /* Padding inside the terminal window */
}

/*---------------------
     Start my code
-----------------------*/
#kt_app_content_container>div>div.card.bg-body.align-self-start.mb-9.mb-xl-0.me-lg-9>div.smarter-wagtail-content-block {
  border-style: none;
  background-color: #F9F9F9;
  box-shadow: none !important;
}

.wrap {
  display: flex !important;
  flex-direction: row !important;
}

/*----------------------
           1ts Block
 -----------------------*/

#smarter-landing-page {
  font-family: Inter;
  background: white;
  background-image: url('https://cdn.platform.smarter.sh/cms/img/techdots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  border-style: solid;
  border-color: #F1F1F4;
  border-width: 1px;
  margin: 10px;
  padding: 35px;
  border-radius: 10px;
}

#smarter-landing-page>h1 {
  color: #0F2385 !important;
}

#smarter-landing-page>h2 {
  color: #4B5675 !important;
}

#smarter-landing-page>p {
  color: #4B5675 !important;
  font-size: 13px !important;
}

/*--------------------------------
                2nd Block
---------------------------------- */

#kt_app_content_container>div>div.card.bg-body.align-self-start.mb-9.mb-xl-0.me-lg-9>div.smarter-wagtail-content-block>div>div:nth-child(2) {
  display: grid !important;
  flex-direction: row !important;
  justify-content: space-between;
  align-items: center !important;
  flex-wrap: nowrap !important;
  width: auto;
}

#plugins {
  justify-content: space-between !important;
  align-items: center !important;
  row-gap: 20px !important;
  column-gap: 20px;
  background-color: #ffffff;
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  margin: 10px;
  padding: 35px;
  border-radius: 10px;
  border-style: solid;
  border-color: #F1F1F4;
  border-width: 1px;
}

#plugins>h3 {
  display: inline;
  font-family: Inter;
  color: #4B5675;
  line-height: 10px;
  vertical-align: middle;
  text-align: left;
  padding-left: 15px;
}

#plugins>p {
  font-family: Inter;
  font-size: 13px;
  line-height: normal;
  word-spacing: normal;
  color: #4B5675;
  text-align: left;
  margin-top: 20px;
  margin-bottom: 20px;
}


#plugins>a {
  background-color: #F6821B;
  font-family: Inter;
  font-size: 11px;
  color: white;
  text-decoration: none;
  padding: 10px 20px 10px 20px;
  border-radius: 10px;
  text-align: left !important;
  display: left;
}

#plugins>a:hover {
  background-color: #faa313;
  transition: 300ms;
}

#manifests {
  justify-content: space-between !important;
  align-items: center !important;
  row-gap: 20px !important;
  column-gap: 20px !important;
  background-color: #ffffff;
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  margin: 10px;
  padding: 35px;
  border-radius: 10px;
  border-style: solid;
  border-color: #F1F1F4;
  border-width: 1px;
}

#manifests>h3 {
  display: inline;
  font-family: Inter;
  color: #4B5675;
  vertical-align: middle;
  text-align: left;
  padding-left: 15px;
}

#manifests>p {
  font-family: Inter;
  font-size: 13px;
  line-height: normal;
  word-spacing: normal;
  color: #4B5675;
  text-align: left;
  margin-top: 20px;
  margin-bottom: 20px;
}

#manifests>a {
  background-color: #F6821B;
  font-family: Inter;
  font-size: 11px;
  color: white;
  text-decoration: none;
  padding: 10px 20px 10px 20px;
  border-radius: 10px;
  align-self: left;
}

#manifests>a:hover {
  background-color: #faa313;
  transition: 300ms;
}

/* ------------------------
           3rd  Block
  --------------------------*/
#learn {
  background: linear-gradient(90deg,
      #0f2385,
      #000000);
  border-style: solid;
  border-color: #F1F1F4;
  border-width: 1px;
  margin: 10px;
  padding: 35px;
  border-radius: 10px;
  justify-content: left !important;
}

#learn>h3 {
  display: inline;
  font-family: Inter;
  color: white;
  vertical-align: middle;
  text-align: left;
  padding-left: 15px;
}

#learn>div {
  gap: 15px;
  display: flex;
  justify-items: center;
  align-items: center;
  flex-wrap: nowrap;
  background-color: transparent;
  margin: 0px;
  padding: 0px;
}

#learn>div>p {
  display: inline;
  font-family: Inter;
  font-size: 13px;
  line-height: normal;
  word-spacing: normal;
  color: white;
  text-align: left;
  margin-top: 20px;
  margin-bottom: 20px;
}

#learn>div>img {
  vertical-align: middle;
  width: 150px;

}

#learn>a {
  background-color: #F6821B;
  font-family: Inter;
  font-size: 11px;
  color: white;
  text-decoration: none;
  padding: 10px 25px 10px 25px;
  border-radius: 10px;
}

#learn>a:hover {
  background-color: #faa313;
  transition: 300ms;
}

/* ---------------
       4th Block
  -----------------*/
#kt_app_content_container>div>div.card.bg-body.align-self-start.mb-9.mb-xl-0.me-lg-9>div.smarter-wagtail-content-block>div>div:nth-child(4) {
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-between;
  align-items: center !important;
  flex-wrap: nowrap !important;
  width: auto;
}

#safe {
  justify-content: space-between !important;
  align-items: center !important;
  row-gap: 20px !important;
  column-gap: 20px;
  background-color: #ffffff;
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  margin: 10px;
  padding: 35px;
  border-radius: 10px;
  border-style: solid;
  border-color: #F1F1F4;
  border-width: 1px;
}

#safe>h3 {
  display: inline;
  font-family: Inter;
  color: #4B5675;
  line-height: 10px;
  vertical-align: middle;
  text-align: left;
  padding-left: 15px;
}

#safe>p {
  font-family: Inter;
  font-size: 13px;
  line-height: normal;
  word-spacing: normal;
  color: #4B5675;
  text-align: left;
  margin-top: 20px;
  margin-bottom: 20px;
}

#safe>a {
  background-color: #F6821B;
  font-family: Inter;
  font-size: 11px;
  color: white;
  text-decoration: none;
  padding: 10px 20px 10px 20px;
  border-radius: 10px;
}

#safe>a:hover {
  background-color: #faa313;
  transition: 300ms;
}

#simple {
  justify-content: space-between !important;
  align-items: center !important;
  row-gap: 20px !important;
  column-gap: 20px;
  background-color: #ffffff;
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  margin: 10px;
  padding: 35px;
  border-radius: 10px;
  border-style: solid;
  border-color: #F1F1F4;
  border-width: 1px;
}

#simple>h3 {
  display: inline;
  font-family: Inter;
  color: #4B5675;
  line-height: 10px;
  vertical-align: middle;
  text-align: left;
  padding-left: 15px;
}

#simple>p {
  font-family: Inter;
  font-size: 13px;
  line-height: normal;
  word-spacing: normal;
  color: #4B5675;
  text-align: left;
  margin-top: 20px;
  margin-bottom: 20px;
}

#simple>a {
  background-color: #F6821B;
  font-family: Inter;
  font-size: 11px;
  color: white;
  text-decoration: none;
  padding: 10px 25px 10px 25px;
  border-radius: 10px;
}

#simple>a:hover {
  background-color: #faa313;
  transition: 300ms;
}

/*------------------------
            5th Block
   -------------------------*/

#secure {
  justify-content: space-between;
  align-items: center;
  background: white;
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  border-style: solid;
  border-color: #F1F1F4;
  border-width: 1px;
  margin: 10px;
  padding: 35px;
  border-radius: 10px;
  align-items: center;
  justify-content: center;
}

#secure>h3 {
  display: inline;
  font-family: Inter;
  color: #4B5675;
  line-height: 10px;
  vertical-align: middle;
  text-align: left;
  padding-left: 15px;
}

#secure>p {
  font-family: Inter;
  font-size: 13px;
  line-height: normal;
  word-spacing: normal;
  color: #4B5675;
  text-align: left;
  margin-top: 20px;
  margin-bottom: 20px;
}

#secure>a {
  background-color: #F6821B;
  font-family: Inter;
  font-size: 11px;
  color: white;
  text-decoration: none;
  padding: 10px 20px 10px 20px;
  border-radius: 10px;
}

#secure>a:hover {
  background-color: #faa313;
  transition: 300ms;
}

/*-----------------------------
                6th Block
   ------------------------------*/

#kt_app_content_container>div>div.card.bg-body.align-self-start.mb-9.mb-xl-0.me-lg-9>div.smarter-wagtail-content-block>div>div:nth-child(6) {
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-between;
  align-items: center !important;
  flex-wrap: nowrap !important;
  width: auto;
}

#developers {
  justify-content: space-between !important;
  align-items: center !important;
  row-gap: 20px !important;
  column-gap: 20px;
  background-color: #ffffff;
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  margin: 10px;
  padding: 35px;
  border-radius: 10px;
  border-style: solid;
  border-color: #F1F1F4;
  border-width: 1px;
}

#developers>h3 {
  display: inline;
  font-family: Inter;
  color: #4B5675;
  line-height: 10px;
  vertical-align: middle;
  text-align: left;
  padding-left: 15px;
}

#developers>p {
  font-family: Inter;
  font-size: 13px;
  line-height: normal;
  word-spacing: normal;
  color: #4B5675;
  text-align: left;
  margin-top: 20px;
  margin-bottom: 20px;
}

#developers>a {
  background-color: #F6821B;
  font-family: Inter;
  font-size: 11px;
  color: white;
  text-decoration: none;
  padding: 10px 20px 10px 20px;
  border-radius: 10px;
}

#developers>a:hover {
  background-color: #faa313;
  transition: 300ms;
}

#certified {
  justify-content: space-between !important;
  align-items: center !important;
  row-gap: 20px !important;
  column-gap: 20px;
  background-color: #ffffff;
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  margin: 10px;
  padding: 35px;
  border-radius: 10px;
  border-style: solid;
  border-color: #F1F1F4;
  border-width: 1px;
}

#certified>h3 {
  display: inline;
  font-family: Inter;
  color: #4B5675;
  line-height: 10px;
  vertical-align: middle;
  text-align: left;
  padding-left: 15px;
}

#certified>p {
  font-family: Inter;
  font-size: 13px;
  line-height: normal;
  word-spacing: normal;
  color: #4B5675;
  text-align: left;
  margin-top: 20px;
  margin-bottom: 20px;
}

#certified>a {
  background-color: #F6821B;
  font-family: Inter;
  font-size: 11px;
  color: white;
  text-decoration: none;
  padding: 10px 20px 10px 20px;
  border-radius: 10px;
}

#certified>a:hover {
  background-color: #faa313;
  transition: 300ms;
}

/*----------------------
 7th Block
 -----------------------*/

#administration {
  justify-content: center;
  align-self: center;
  background: white;
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  border-style: solid;
  border-color: #F1F1F4;
  border-width: 1px;
  margin: 10px;
  padding: 35px;
  border-radius: 10px;
  gap: none;
}

#administration>h3 {
  display: inline;
  font-family: Inter;
  color: #4B5675;
  line-height: 10px;
  vertical-align: middle;
  text-align: left;
  padding-left: 15px;
}

#administration>p {
  font-family: Inter;
  font-size: 13px;
  line-height: normal;
  word-spacing: normal;
  color: #4B5675;
  text-align: left;
  margin-top: 20px;
  margin-bottom: 20px;
}

#administration>a {
  background-color: #F6821B;
  font-family: Inter;
  font-size: 11px;
  color: white;
  text-decoration: none;
  padding: 10px 20px 10px 20px;
  border-radius: 10px;
}

#administration>a:hover {
  background-color: #faa313;
  transition: 300ms;
}

/*--------------------------------
Side Bar
--------------------------------*/


/*-------- Wait List Signup -----------*/
#wait-list {
  background: linear-gradient(90deg,
      #0f2385,
      #000000) !important;
  border-style: solid;
  border-color: #4B5675;
  border-width: 1px;
  border-radius: 10px;
}

#wait-list>div {
  background-image: url('https://alpha.platform.smarter.sh/static/assets/media/illustrations/sigma-1/17.png');
  background-size: contain !important;
  background-position: right !important;
  background-repeat: no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 35px !important;
}

#smarter-waitlist-btn {
  background-color: #F6821B;
  font-family: Inter;
  font-size: 11px;
  color: white !important;
  text-decoration: none;
  padding: 10px 20px 10px 20px;
  border-radius: 10px;
  display: block;
  text-align: center;
}

#smarter-contact-btn {
  background-color: #F6821B !important;
  font-family: Inter;
  font-size: 11px;
  color: white !important;
  text-decoration: none;
  padding: 10px 20px 10px 20px;
  border-radius: 10px;
  display: block !important;
  width: 100%;
  text-align: center;
}

/*-------- Developer Program -----------*/
#developer-program {
  background: linear-gradient(90deg,
      #0f2385,
      #000000) !important;
  border-style: solid;
  border-color: #4B5675;
  border-width: 1px;
  border-radius: 10px;
}

#developer-program>div {
  background-image: url('https://alpha.platform.smarter.sh/static/assets/media/illustrations/sigma-1/9.png');
  background-size: contain !important;
  background-position: right !important;
  background-repeat: no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 35px !important;
}

#smarter-developer-btn {
  background-color: #F6821B;
  font-family: Inter;
  font-size: 11px;
  color: white !important;
  text-decoration: none;
  padding: 10px 20px 10px 20px;
  border-radius: 10px;
  display: block;
  text-align: center;
}

#smarter-contact-btn {
  background-color: #F6821B !important;
  font-family: Inter;
  font-size: 11px;
  color: white !important;
  text-decoration: none;
  padding: 10px 20px 10px 20px;
  border-radius: 10px;
  display: block !important;
  width: 100%;
  text-align: center;
}

/*-------- Careers -----------*/

#careers>div {
  background: linear-gradient(135deg,
      #FDC20E,
      #F6821B) !important;
  border-style: solid;
  border-color: #FDC20E;
  border-width: 1px;
  border-radius: 10px;
  padding: 35px;
}

#careers>div>div.mb-7>h2 {
  display: inline;
  font-family: Inter;
  font-size: 25px !important;
  font-weight: bold;
  color: #0F2385;
  vertical-align: middle;
  text-align: left;
  padding-left: 15px;
  text-shadow: #9e9e9e 1px 2px;
  line-height: 20px;
}

#careers>div>div.mb-7>h2:nth-child(4) {
  font-family: Inter;
  font-size: 25px;
  font-weight: bold;
  color: #0F2385;
  vertical-align: middle;
  text-align: left;
  padding-left: 65px;
  text-shadow: #9e9e9e 1px 2px;
  line-height: 20px;
}

#careers>div>div.mb-7>p {
  margin-top: 2rem !important;
}

#careers>div>div.mb-0>div:nth-child(1)>h4 {
  display: inline;
  font-family: Inter;
  font-weight: bold;
  color: #0F2385;
  vertical-align: middle;
  text-align: left;
}

#careers>div>div.mb-0>div:nth-child(1)>div {
  margin-top: 2rem !important;
}

#careers>div>div.mb-0>div:nth-child(2)>h4 {
  display: inline;
  font-family: Inter;
  font-weight: bold;
  color: #0F2385;
  vertical-align: middle;
  text-align: left;
}

#careers>div>div.mb-0>div:nth-child(2)>div {
  margin-top: 2rem !important;
}

#careers>div>a {
  background-color: #F6821B;
  font-family: Inter;
  font-size: 13px;
  color: white;
  text-decoration: none;
  margin-top: 1rem;
  padding: 10px 20px 10px 20px;
  border-radius: 10px;
}

#careers>div>a:hover {
  background-color: #faa313;
  transition: 300ms;
}

/*-------- Connected -----------*/

#connected {
  display: flex;
  background: #ffffff;
  border-style: solid;
  border-color: #F1F1F4;
  border-width: 1px;
  border-radius: 10px;
  padding: 35px;
}

#connected>h4 {
  display: inline;
  font-family: Inter;
  font-size: 25px !important;
  font-weight: bold;
  color: #4B5675;
  vertical-align: middle;
  text-align: left;
  margin-bottom: 2rem;
}

#linkedin {
  color: #F6821B;
  vertical-align: center;
  text-align: center;
  margin-right: 10px;
}

#connected>div>a.github {
  color: #F6821B;
  vertical-align: center;
  text-align: center;
  margin-right: 10px;
}

#youtube {
  color: #F6821B;
  vertical-align: center;
  text-align: center;
  margin-right: 10px;
}

#facebook {
  color: #F6821B;
  vertical-align: center;
  text-align: center;
  margin-right: 10px;
}

#x {
  color: #F6821B;
  vertical-align: center;
  text-align: center;
  margin-right: 10px;
}

#instagram {
  color: #F6821B;
  vertical-align: center;
  text-align: center;
  margin-right: 10px;
}

/*--------------------------------
Plugins Page
--------------------------------*/

#plugins-page {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between;
  align-items: center !important;
  flex-wrap: nowrap !important;
  width: auto;
  background-color: transparent;
  padding: 0px;
  margin: 0px;
}

#text-presentation {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  justify-content: space-between;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#text-presentation>h1 {
  display: inline;
  vertical-align: middle;
  text-align: left;
  padding-left: 15px;
  color: #0F2385 !important;
  font-family: Inter;
  font-size: 26px;
}

#text-presentation>h3 {
  color: #4B5675;
  font-family: Inter;
  font-size: 20px;
  margin-bottom: 20px;
  margin-top: 30px;
}

#plugins-page>div.code-sample-body {
  margin: 10px;
}

#code {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between;
  align-items: center !important;
  flex-wrap: nowrap !important;
  width: auto;
}

#third-row {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between;
  flex-wrap: nowrap !important;
  width: auto;
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#third-row>h4 {
  color: #0F2385 !important;
  font-family: Inter;
  margin-bottom: 30px;
}

/*--------------------------------
Manifests Page
--------------------------------*/

#manifests-page {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between;
  align-items: center !important;
  flex-wrap: nowrap !important;
  width: auto;
  background-color: #F9F9F9;
  margin: 0px;
  padding: 0px;
}

#manifest-row {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  justify-content: space-between;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#manifest-row>h1 {
  display: inline;
  vertical-align: middle;
  text-align: left;
  padding-left: 15px;
  color: #0F2385 !important;
  font-family: Inter;
  font-size: 26px;
}

#manifest-row>h3 {
  color: #4B5675;
  font-family: Inter;
  font-size: 20px;
  margin-bottom: 20px;
  margin-top: 30px;
}

#heading-2 {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between;
  flex-wrap: nowrap !important;
  width: auto;
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#heading-2>h2 {
  color: #4B5675;
  font-family: Inter;
  font-size: 20px;
  margin-bottom: 20px;
  margin-top: 30px;
}

#heading-3 {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  justify-content: center;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
  width: auto;
}

#heading-3>h3 {
  color: #4B5675;
  font-family: Inter;
  font-size: 20px;
  margin-bottom: 20px;
  margin-top: 30px;
}

#heading-3>p {
  margin: 0px;
}

/* First row */

#heading-3>div.d-flex.flex-column.flex-xl-row>a:nth-child(1) {
  background-color: #F9F9F9;
  font-family: Inter;
  font-size: 16px;
  text-align: center;
  font-weight: 700;
  color: #ff5733;
  text-decoration: none;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  margin: 10px;
  padding: 10px;
  border-radius: 10px;
  display: block !important;
  width: 100%;
  text-align: center;
}

#heading-3>div.d-flex.flex-column.flex-xl-row>a:nth-child(1):hover {
  background-color: #ffffff;
  transition: 300ms;
  color: #faa313;
  border-style: none;
}

#heading-3>div.d-flex.flex-column.flex-xl-row>a:nth-child(2) {
  background-color: #F9F9F9;
  font-family: Inter;
  font-size: 16px;
  text-align: center;
  font-weight: 700;
  color: #ff5733;
  text-decoration: none;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  margin: 10px;
  padding: 10px;
  border-radius: 10px;
  display: block;
  width: 100%;
}

#heading-3>div.d-flex.flex-column.flex-xl-row>a:nth-child(2):hover {
  background-color: #ffffff;
  transition: 300ms;
  color: #faa313;
  border-style: none;
}

#heading-3>div.d-flex.flex-column.flex-xl-row>a:nth-child(3) {
  background-color: #F9F9F9;
  font-family: Inter;
  font-size: 16px;
  text-align: center;
  font-weight: 700;
  color: #ff5733;
  text-decoration: none;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  margin: 10px;
  padding: 10px;
  border-radius: 10px;
  display: block;
  width: 100%;
}

#heading-3>div.d-flex.flex-column.flex-xl-row>a:nth-child(3):hover {
  background-color: #ffffff;
  transition: 300ms;
  color: #faa313;
  border-style: none;
}

/* Row 2 */

#heading-3>div:nth-child(4)>div>a:nth-child(1) {
  background-color: #F9F9F9;
  font-family: Inter;
  font-size: 16px;
  text-align: center;
  font-weight: 700;
  color: #ff5733;
  text-decoration: none;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  margin: 10px;
  padding: 10px;
  border-radius: 10px;
  display: block;
  width: 100%;
}

#heading-3>div:nth-child(4)>div>a:nth-child(1):hover {
  background-color: #ffffff;
  transition: 300ms;
  color: #faa313;
  border-style: none;
}

#heading-3>div:nth-child(4)>div>a:nth-child(2) {
  background-color: #F9F9F9;
  font-family: Inter;
  font-size: 16px;
  text-align: center;
  font-weight: 700;
  color: #ff5733;
  text-decoration: none;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  margin: 10px;
  padding: 10px;
  border-radius: 10px;
  display: block;
  width: 100%;
}

#heading-3>div:nth-child(4)>div>a:nth-child(2):hover {
  background-color: #ffffff;
  transition: 300ms;
  color: #faa313;
  border-style: none;
}

#heading-3>div:nth-child(4)>div>a:nth-child(3) {
  background-color: #F9F9F9;
  font-family: Inter;
  font-size: 16px;
  text-align: center;
  font-weight: 700;
  color: #ff5733;
  text-decoration: none;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  margin: 10px;
  padding: 10px;
  border-radius: 10px;
  display: block;
  width: 100%;
}

#heading-3>div:nth-child(4)>div>a:nth-child(3):hover {
  background-color: #ffffff;
  transition: 300ms;
  color: #faa313;
  border-style: none;
}

/* Row 3*/

#heading-3>div>div:nth-child(7)>div>a {
  background-color: #F9F9F9;
  font-family: Inter;
  font-size: 16px;
  text-align: center;
  font-weight: 700;
  color: #ff5733;
  text-decoration: none;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 10px;
  border-radius: 10px;
  display: block;
}

#heading-3>div>div:nth-child(7)>div>a:hover {
  background-color: #ffffff;
  transition: 300ms;
  color: #faa313;
  border-style: none;
}

#heading-3>div>div:nth-child(8)>div>a {
  background-color: #F9F9F9;
  font-family: Inter;
  font-size: 16px;
  text-align: center;
  font-weight: 700;
  color: #ff5733;
  text-decoration: none;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 10px;
  border-radius: 10px;
  display: block;
}

#heading-3>div>div:nth-child(8)>div>a:hover {
  background-color: #ffffff;
  transition: 300ms;
  color: #faa313;
  border-style: none;
}

#heading-3>div>div:nth-child(9)>div>a {
  background-color: #F9F9F9;
  font-family: Inter;
  font-size: 16px;
  text-align: center;
  font-weight: 700;
  color: #ff5733;
  text-decoration: none;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 10px;
  border-radius: 10px;
  display: block;
}

#heading-3>div>div:nth-child(9)>div>a:hover {
  background-color: #ffffff;
  transition: 300ms;
  color: #faa313;
  border-style: none;
}

/* Row 4 */

#heading-3>div:nth-child(6)>a:nth-child(1) {
  background-color: #F9F9F9;
  font-family: Inter;
  font-size: 16px;
  text-align: center;
  font-weight: 700;
  color: #ff5733;
  text-decoration: none;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 10px;
  border-radius: 10px;
  display: block;
}

#heading-3>div:nth-child(6)>a:nth-child(1):hover {
  background-color: #ffffff;
  transition: 300ms;
  color: #faa313;
  border-style: none;
}

#heading-3>div:nth-child(6)>a:nth-child(2) {
  background-color: #F9F9F9;
  font-family: Inter;
  font-size: 16px;
  text-align: center;
  font-weight: 700;
  color: #ff5733;
  text-decoration: none;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 10px;
  border-radius: 10px;
  display: block;
}

#heading-3>div:nth-child(6)>a:nth-child(2):hover {
  background-color: #ffffff;
  transition: 300ms;
  color: #faa313;
  border-style: none;
}

#heading-4 {
  flex-direction: column !important;
  justify-content: space-between;
  flex-wrap: nowrap !important;
  width: auto;
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#heading-4>h2 {
  color: #4B5675;
  font-family: Inter;
  font-size: 20px;
  margin-bottom: 20px;
  margin-top: 30px;
}

#heading-4>a {
  background-color: #F6821B;
  font-family: Inter;
  font-size: 11px;
  color: white;
  text-decoration: none;
  padding: 10px 20px 10px 20px;
  border-radius: 10px;
}

#heading-4>a:hover {
  background-color: #faa313;
  transition: 300ms;
}

/*--------------------------------
  CLI Page
  --------------------------------*/

#cli-page {
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between;
  align-items: center !important;
  flex-wrap: nowrap !important;
  width: auto;
  background-color: transparent;
  padding: 0px;
  margin: 0px;
}

#heading {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  justify-content: space-between;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#heading>h1 {
  display: inline;
  vertical-align: middle;
  text-align: left;
  padding-left: 15px;
  color: #0F2385 !important;
  font-family: Inter;
  font-size: 26px;
}

#heading>p:nth-child(3) {
  margin-top: 30px !important;
}

#cli-configuration {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#cli-configuration>h3 {
  color: #4B5675;
}

#cli-commands {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#cli-commands>h3 {
  color: #4B5675;
}

#cli-apply {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#cli-apply>h3 {
  color: #4B5675;
}

#cli-chat {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#cli-chat>h3 {
  color: #4B5675;
}

#cli-completion {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#cli-completion>h3 {
  color: #4B5675;
}

#cli-configure {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  justify-content: space-between;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#cli-configure>h3 {
  color: #4B5675;
}

#cli-delete {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  justify-content: space-between;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#cli-delete>h3 {
  color: #4B5675;
}

#cli-deploy {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  justify-content: space-between;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#cli-deploy>h3 {
  color: #4B5675;
}

#cli-describe {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  justify-content: space-between;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#cli-describe>h3 {
  color: #4B5675;
}

#cli-get {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  justify-content: space-between;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#cli-get>h3 {
  color: #4B5675;
}

#cli-help {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  justify-content: space-between;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#cli-help>h3 {
  color: #4B5675;
}

#cli-manifest {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  justify-content: space-between;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#cli-manifest>h3 {
  color: #4B5675;
}

#cli-status {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  justify-content: space-between;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#cli-status>h3 {
  color: #4B5675;
}

#cli-undeploy {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  justify-content: space-between;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#cli-undeploy>h3 {
  color: #4B5675;
}

#cli-version {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  justify-content: space-between;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#cli-version>h3 {
  color: #4B5675;
}

#cli-whoami {
  background-image: url('https://cdn.platform.smarter.sh/cms/img/graydots.png');
  background-size: contain;
  background-position: bottom right;
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  padding: 35px;
  border-radius: 10px;
  margin: 10px;
  border-style: solid;
  border-width: 1px;
  border-color: #F1F1F4;
  width: auto;
  font-family: Inter;
  color: #4B5675;
  font-size: 13px;
}

#cli-whoami>h3 {
  color: #4B5675;
}