@font-face {
	font-family: 'GT Walsheim Medium';
	src: url('https://f000.backblazeb2.com/file/font-hosting-tpkvm/GT-Walsheim-Medium.woff2') format('woff2');
	font-weight: normal;
	font-style: normal;
  }
  
  @font-face {
	font-family: 'Public Sans';
	src: url('https://f000.backblazeb2.com/file/font-hosting-tpkvm/PublicSans-Regular.woff2') format('woff2');
	font-weight: normal;
	font-style: normal;
  }



  :root {
	  --brand-vivid-blue-900: #00123d;
	  --brand-vivid-blue-800: #002575;
	  --brand-vivid-blue-700: #033eb5;
	  --brand-vivid-blue-600: #0854e8;
	  --brand-vivid-blue-200: #c1d3ef;
	  --brand-vivid-blue-100: #edf4ff;
	  --brand-vivid-blue-50: #f4f8fe;
	  --brand-neon-green: #3df91e;
	  --background-color-code-snippet: #272822;
	  --border-color-code-snippet: #272822;
	  --font-color-code-snippet: #ffffff;
	  --background-color-info: #c1d3ef;
	  --border-color-info: #466a96; // darken(#c1d3ef, 38%)
	  --background-color-warning: #fde5d8;
	  --border-color-warning: #fcd8c5;
	  --font-color-warning: #924a24;
	  --background-color-danger: #f7dddc;
	  --border-color-danger: #f4cbca;
	  --font-color-danger: #82322f;
	  --border-color: #00123d;
	  --border-radius-sm: 0.375rem;
	  --spacer-1: 0.25rem;
	  --spacer-3: 1rem;
	  --spacer-4: 1.5rem;
	  --spacer-5: 2.5rem;
	  --paragraph-max-width: 70ch;
	  --code-max-width: 80ch;
	  --code-font-size: 11pt;
  }
  
  
  /* Custom Help Scout StyleSheet - by Devan Sabaratnam (founder of HR Partner - www.hrpartner.io) */
  /* Color pallette chosen from https://coolors.co/54494b-7e8287-9da39a-b98389-db2955 */
  
  
  /* */
  
  body {
	  background: #edf4ff;
  }
  /* Home Page Title */
  
  #docsSearch h1 {
	  font-size: 2.5rem;
	  font-family: 'GT Walsheim Medium', sans-serif;
	  font-weight: 300;
	  text-align: center;
	  margin-top: .4em;
	  color: #00123d;
	  padding: 10px;
  }
  .navbar .nav li {
	  display: inline-block;
	  font-family: 'GT Walsheim Medium', sans-serif;
	  float: none;
	  font-size: rem;
	  letter-spacing: .1px;
  }
  .navbar .nav li a, .navbar .icon-private-w {
	  font-size: 1.5rem;
	  color: #00123d;
	  font-weight: 300;
  }
  
  /* Header Size 
  
  a.brand > img {
	  max-width: 100%;
	  vertical-align: middle;
	  border: 0;
	  height: 60px;
	  margin-left: 15px;
	  width: auto;
  }
  
  .navbar .navbar-inner {
	  /* background: #ffffff; 
	  height: 70px;*/
  }
 / .navbar .navbar-inner .container-fluid {
	  padding: 0;
	  height: 70px;
  }
  .navbar .brand {
	  float: left;
	  display: block;
	  padding: 0px;
	  margin-left: -20px;
	  font-size: 20px;
	  font-weight: 200;
	  color: #777;
	  text-shadow: 0 1px 0 #fff;
  }
  /* Home Page Search Bar Background */
  
  #docsSearch {
	  background: #ffffff;
	  border-top: 1px solid #dadada;
	  margin-bottom: 3em;
	  padding: 1.5em 0;
  }
  /* Search Input Box */
  
  input.search-query {
	  padding-right: 14px;
	  padding-right: 4px \9;
	  padding-left: 14px;
	  padding-left: 4px \9;
	  margin-bottom: 0;
	  -webkit-border-radius: 15px;
	  -moz-border-radius: 15px;
	  border-radius: 15px;
      font-family: 'Public Sans', sans-serif;
	  font-weight: 100;
	  letter-spacing: .5px;
  }
  /* Home Page Category Title */
  
  .category-list h3 {
	  color: #00123d;
	  font-size: 2rem;
	  font-weight: 400;
	  line-height: 1.3em;
  }
  
  /* Category Styles */
  
  .category-list .category p {
	  color: #7e8287;
	  font-weight: 200;
	  font-size: 1rem;
	  letter-spacing: 0.25px;
  }
  .category-list .category {
	  background-color: #fff;
	  background-position: top -30px center !important;
	  background-repeat: no-repeat !important;
	  background-size: 250px auto !important;
	  box-shadow: 0 7px 4px -5px rgba(0, 0, 0, 0.05);
	  box-sizing: border-box;
	  min-height: 225px;
	  padding: 175px 20px 15px;
	  position: relative;
	  width: 31.5%;
	  transition: all 0.2s;
	  
  }
  .category-list .category:hover {
	  text-decoration: none;
	  background: #f7f7f9;
  }
  
  
  
  .collection-category h2 {
	  font-weight: 500;
	  margin: 0 0 20px;
	  text-align: center;
	  padding-left: 0%;
	  /* text-transform: uppercase; */
	  color: #7e8287;
	  font-size: 22px;
	  letter-spacing: 1px;
  }
  
  .collection-category h2 a {
	  color: #0854e8;
  }
  
  .collection-category .category-list {
	  margin: 0 0 4em;
	  text-align: center;
  }
  
  
  
  /* Home Page Link Style */
  
  #serp-dd .result a, #serp-dd .result>li.active, #full-Article strong a, .collection a, .contentWrapper a, .most-pop-articles .popArticles a, .most-pop-articles .popArticles a span, .category-list .category .article-count, .category-list .category .article-count, .contentWrapper a {
	  font-weight: 500;
	  letter-spacing: .25px;
	  color: #0854e8;
	  margin-top: 15px;
	  text-transform: capitalize;
	  text-decoration: none;
	  font-weight: 500;
  }
  #serp-dd .result a:hover, #serp-dd .result>li.active, #full-Article strong a, .collection a, .contentWrapper a, .most-pop-articles .popArticles a, .most-pop-articles .popArticles a:hover span, .category-list .category .article-count, .category-list .category:hover .article-count, .contentWrapper a {
	  font-weight: 500;
	  letter-spacing: .25px;
	  color: #0854e8;
	  margin-top: 15px;
	  text-transform: capitalize;
	  /* text-decoration: underline; 
	  font-weight: 500;
  }
  /* Home Page Search Button */
  
#searchBar button {
    color: #fff;
    text-shadow: 0 -1px 1px rgba(0, 0, 0, .4);
    background: #0854e8;
    border-radius: 0 5px 5px 0;
    border: 1px solid #0854e8;
    font-size: 18px;
    padding: 0 1.5em;
    height: 50px;
    position: absolute;
    top: 24px;
    right: -1px;
}
  }
  #searchBar button:hover {
	  background: #0854e8;
	  text-shadow: 0 0px 0px rgba(255,255,255,.0);
	  border: 1px solid #0854e8;
  }
  
  
  
  /* Category Images */
  
  /*
	Here is where you determine the images to be used just above each section of your Help Scout main page.
	You have to create one #category-xxx CSS selector for each separate category in your Help Scout collection.
	To get your category xxx number, simply visit the relevant category in your Help Scout docs and
	check the URL bar for the 3 digit category number.
  
	Then you have to specify an image located on a shared server somewhere on the internet that can
	serve up the images so Help Scout can display them.
  */
  
  
  /* Getting Started (use your actual category names here in the comment to make it easier) */
 /* #category-6 {
	  background-image: url(https://f000.backblazeb2.com/file/font-hosting-tpkvm/voyager2a-v1-400.png);
  }
  
  /* Setup Users */
 /* #category-7 {
	background-image: url(https://f000.backblazeb2.com/file/font-hosting-tpkvm/voyager2a-v2-400.png);
  }
  
  /* Uploading Files */
 /* #category-223 {
	background-image: url(https://f000.backblazeb2.com/file/font-hosting-tpkvm/voyager2a-v1-400.png);
  }
  
  /* etc... keep going and add one CSS ID selector for each category. */
  
  
  
  /* Side Bar Styles */
  
  #sidebar .nav-list a {
	  display: inline-block;
	  color: #00123d;
	  font-size: 1.0625rem;
	  padding: 6px 15px 6px 0;
	  line-height: 20px;
	  font-family: 'Public Sans', sans-serif;
	  margin-left: 0;
	  font-weight: 400;
  }
  #sidebar .nav-list .active a, #sidebar .nav-list .active a:hover, #sidebar .nav-list .active a:focus {
	  font-weight: 600;
	  color: #0854e8;
	  font-family: 'Public Sans', sans-serif;
	  background: 0 0;
	  text-shadow: none;
	  text-decoration: underline;
  }
  #sidebar h3 {
	  text-transform: uppercase;
	  font-size: 1.5rem;
	font-family: 'Public Sans', sans-serif;
      color: #7e8287;
	  font-weight: 400;
	  margin-bottom: 4px;
	  letter-spacing: .1px;
  }
  /* Article Styles */
  
  
  #fullArticle img {
	  display: block;
	  margin: 2em 1em 2em;
	  padding: 0px;
	  border-radius: 4px;
	  box-sizing: border-box;
  }

     #fullArticle h2 {
	  margin: 0 30px .5em 0;
	  font-family: 'GT Walsheim Medium', sans-serif;
	  color: #00123d;
	  font-size: 2rem;
	  font-weight: 700;
  }

  #fullArticle .title, .contentWrapper h1 {
	  margin: 0 30px .5em 0;
	  font-family: 'GT Walsheim Medium', sans-serif;
	  color: #00123d;
	  font-size: 2.5rem;
	  font-weight: 700;
  }
 
  #fullArticle, #fullArticle p, #fullArticle ul, #fullArticle ol, #fullArticle li, #fullArticle blockquote, #fullArticle dd, #fullArticle table {
	  color: #00123d;
	  font-family: 'Public Sans', sans-serif;
	  font-size: 1.0625rem;
	  font-weight: 400;
      line-height: 1.4;
      text-align: left;
  }
  #fullArticle div {
	  color: #00123d;
	  font-size: 1.0625;
      font-family: 'GT Walsheim Medium', sans-serif;
	  font-weight: 300;
	  letter-spacing: .01em;
  #categoryHead .sort select {
	  width: 150px;
	  height: 1.5rem;
	  margin: 0;
	  line-height: 24px;
	  font-size: 13px;
	  color: #7e8287;
	  font-weight: 300;
  }
  /* Style this one if you want bolded article text to have a different color */
  
  /* Callouts */

  #fullArticle .callout,#fullArticle .callout-blue,#fullArticle .callout-green,#fullArticle .callout-red,#fullArticle .callout-yellow,#fullArticle .private-note {
    border-left: 5px solid;
    color: #333;
    font-size: 1.0625rem;
    margin-bottom: 2em;
    padding: 16px 25px 16px 20px
}

#fullArticle .callout-blue>:last-child,#fullArticle .callout-green>:last-child,#fullArticle .callout-red>:last-child,#fullArticle .callout-yellow>:last-child,#fullArticle .callout>:last-child,#fullArticle .private-note>:last-child {
    margin-bottom: 0
}

#fullArticle .callout p,#fullArticle .callout-blue p,#fullArticle .callout-green p,#fullArticle .callout-red p,#fullArticle .callout-yellow p,#fullArticle .private-note p {
    font-size: 1.0625rem !important
}

#fullArticle .callout h3,#fullArticle .callout-blue h3,#fullArticle .callout-green h3,#fullArticle .callout-red h3,#fullArticle .callout-yellow h3,#fullArticle .private-note h3 {
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 18px;
    margin: 0 0 10px 0
}


	  
  /* Article Footers */
  
  .articleFoot p, .articleFoot time {
	  color: #7e8287;
	  display: inline-block;
      font-family: 'GT Walsheim Medium', sans-serif;
	  font-weight: 300;
	  font-style: italic;
  }
  
  /* Page Footers */
  
  footer p a {
	  color: #7e8287;
      font-family: 'GT Walsheim Medium', sans-serif;
	  font-weight: 300;
  }
  
  
  /* Contact Modal */
  
  #contactModal h2, .abuse h2 {
	  background: #fff;
	  margin: 0;
	  padding: 11px 0 10px 18px;
	  font-size: 22px;
	  border-bottom: 1px solid #ccc;
	  border-top-left-radius: 4px;
	  border-top-right-radius: 4px;
	  color: #58A4B0;
	  font-weight: 300;
  }
  #contactModal .control-label {
	  width: 110px;
	  font-size: 14px;
	  font-weight: 300;
	  color: #7e8287;
  }
  
  .btn {
	  color: #fff;
	  text-shadow: 0 0px 0px rgba(255,255,255,.0);
	  background: #0854e8;
	  border-radius: 5px;
	  border: 1px solid #b98389;
	  font-size: 14px;
	  padding: .5em;
	  /* height: 50px; */
  }
  
  .btn:hover, .btn:focus, .btn:active, .btn.active, .btn.disabled, .btn[disabled] {
	  color: #fff;
	  text-shadow: 0 0px 0px rgba(255,255,255,.0);
	  background: #8fa7c2;
	border: 1px solid #9da39a;
  }
  
  #search-query .btn:hover {
	  color: #fff;
	  text-shadow: 0 0px 0px rgba(255,255,255,.0);
	  background: #8fa7c2;
	  border-radius: 5px;
	  border: 1px solid #9da39a;
	  font-size: 18px;
	  padding: 0 1.5em;
	  height: 50px;
  }
  
  .category-list {
	  text-align: center;
  }
  
  /* Fix for making homepage category gallery go smoothly from 3 to 2 to 1 column */
  
  @media screen and (max-width: 1105px) {
	  section.category-list .category {
		  width: 48.2%;
	  }
  }
  @media screen and (max-width: 760px) {
	  section.category-list .category {
		  box-sizing: border-box;
		  margin: 0 0 20px;
		  padding: 120px 20px 15px;
		  width: 100%;
	  }
  }
  /* RESPONSIVE */
  
  @media (max-width: 768px) {
	  .navbar .btn-navbar {
		  margin-top: 16px;
		  right: -10px;
	  }
	  .related {
		  padding: 30px 25px 25px;
	  }
	  .related ul {
		  margin-left: 0;
	  }
	  .related h3 {
		  padding-left: 0;
	  }
	  .related ul>li a {
		  margin-left: 0;
	  }
  }
  @media (max-width: 460px) {
	  #searchBar button {
		  color: transparent;
		  text-shadow: 0;
		  background: transparent;
		  border-radius: 0 5px 5px 0;
		  border: 0;
		  font-size: 18px;
		  padding: 0 1.5em;
		  height: 50px;
		  position: absolute;
	  }
	  #searchBar button .icon-search {
		  display: block;
		  text-shadow: none;
		  margin-top: 15px;
	  }
	  #searchBar button:hover .icon-search:hover {
		  display: block;
		  text-shadow: none;
		  margin-top: 15px;
		  background-color: transparent;
	  }
  }
  @media (max-width: 460px) {
	  #fullArticle .title, .contentWrapper h1 {
		  font-size: 24px;
	  }
	  #fullArticle h2 {
		  font-size: 20px;
	  }
  }
  
  
  /* Collection Titles  */
  .collection-category h2 a {
	  color: #54494b;
  }
  
  .collection-category h2 {
	  font-weight: 400;
	  margin: 0 0 20px;
	  padding-left: .65%;
	  text-align: center;
  }
