.ipsType_richText {
  margin-bottom: 2rem
}

.ipsSpacer_top.ipsType_light {
  margin-top: 10px;
}

.cCmsCategoryFeaturedEntry,
.cLearningRow_info {
  position: relative;
}

.cLearningRow_info .cLearningRow_moderateCheckbox {
  position: absolute;
  bottom: 0;
  right: 0;
}

.cBlogRow_info.ipsPad {
  padding-bottom: 36px;
}
.cBlogRow_info .ipsTags {
  max-height: 36px;
  overflow: hidden;
}
.cBlogRow_info .ipsPad_bottom_double {
  padding-bottom: 23px;
}

.ipsBox {
  height: 100%;
}

.cLearningRow_title {
  font-size: 21px;
}
.learningContentContainer a:hover,
.ipsType_pageTitle a:hover {
  text-decoration: none;
}

h2.cProductRow_title {
  color: #fff;
  font-size: 22px;
  line-height: 28px;
  text-decoration: none;
  width: 90%;
  padding: 11px 0 10px 20px;
  margin-bottom: 0;
}
.ipsPad {
  padding: 20px;
}

h2.cProductRow_title a:hover {
  color: white;
  text-decoration: none;
}

h1.ipsType_pageTitle .ipsType_break span,
h2.cProductRow_title a > span {
  /*color: #88ce02;
  font-weight: 600;*/
}

article .cBlogRow_image img {
  /*height: 200px;*/
  max-width: 370px;
}

.cBlogRow_info .cBlogRow_stats {
  position: absolute;
  bottom: 10px;
  left: 385px;
}

.ipsTabs_panel {
  background: none;
}

.ipsPager_prev a::after,
.ipsPager_next a::after {
  line-height: 0.55;
}

#elInput_gs_search {
  width: 250px;
  border: 1px solid #b7b7b7;
  border-radius: 5px;
  padding: 5px;
  padding-left: 15px;
}

@media (max-width: 979px) {
  .quickLinks {
    display: none;
  }
  
  .ipsFollow {
    float: none !important;
  }
}

#elInput_gs_search_container {
  display: inline-block;
}

@media (max-width: 767px) {  
  #blogContent .cCmsDatabase_blog [class *= "ipsGrid_span"] {
    float: none !important;
    max-width: 740px;
    margin: 0 auto !important;
  }
  
  .cCmsCategoryFeaturedEntry {
    padding-bottom: 30px;
  }
  
  .cBlogRow_image {
    margin-bottom: 10px;
  }
  
  .cBlogRow_image img {
    height: auto;
    width: 100%;
  }
  
  .cBlogRow_info .cBlogRow_stats {
    left: auto;
  }
  
  .ipsApp .greensock-select-box {
    margin-bottom: 10px;
  }
  
  #elInput_gs_search_container {
    display: block;
  }
  
  #elInput_gs_search {
    display: block;
    width: 100%;
    max-width: none;
  }
}

/* Learning page */
.learningContentContainer p {
  margin-bottom: 0;
}

/* Hack to make search bar appear in gray bar */
.search-bar-container {
  position: relative;
  height: 0;
}
.search-bar-container > * {
  position: absolute;
  top: 7px;
  right: 79px;
}


/* Prism Theme */
/* Code blocks */
code[class*="language-"],
pre[class*="language-"] {
  color: #F1F2F3;
  background: none;
  text-shadow: 0 1px rgba(0, 0, 0, 0.3);
  font-family: "Consolas", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace;
  font-size: 15px;
  text-align: left;
  white-space: pre;
  word-spacing: normal;
  word-break: normal;
  word-wrap: normal;
  line-height: 1.5;

  -moz-tab-size: 4;
  -o-tab-size: 4;
  tab-size: 4;

  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
  max-width: calc(100vw - 50px);
}

/* Code blocks */
pre[class*="language-"] {
  padding: 1em;
  margin: 0.5em 0;
  overflow: auto;
  border-radius: 6px;
}

:not(pre) > code[class*="language-"],
pre[class*="language-"] {
  background: #262626;
}

/* Inline code */
:not(pre) > code[class*="language-"] {
  padding: 0.1em;
  border-radius: 6px;
  white-space: normal;
}

.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
  color: #8292a2;
}

.token.punctuation {
  color: #f8f8f2;
}

.token.namespace {
  opacity: .7;
}

.token.property,
.token.tag,
.token.constant,
.token.symbol,
.token.deleted {
  color: #f92672;
}

.token.boolean,
.token.number {
  color: #ae81ff;
}

.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
  color: #a6e22e;
}

.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string,
.token.variable {
  color: #f8f8f2;
}

.token.atrule,
.token.attr-value,
.token.function,
.token.class-name {
  color: #e6db74;
}

.token.keyword {
  color: #66d9ef;
}

.token.regex,
.token.important {
  color: #fd971f;
}

.token.important,
.token.bold {
  font-weight: bold;
}
.token.italic {
  font-style: italic;
}

.token.entity {
  cursor: help;
}

/* anchor link icon */
.ipsType_richText .anchor {
    transition: opacity 0.2s ease;
    opacity: 0;
	display: inline-block;
	background-repeat: no-repeat;
	background-size: contain;
  	background-position: center top;
	margin-left: 0.3rem;
  	height: 20px;
  	width: 20px;
 	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' %3E%3Cpath fill='%234e9815' d='M9.199,13.599a5.99,5.99,0,0,0,3.949,2.345a5.987,5.987,0,0,0,5.105,-1.702l2.995,-2.994a5.992,5.992,0,0,0,1.695,-4.285a5.976,5.976,0,0,0,-1.831,-4.211a5.99,5.99,0,0,0,-6.431,-1.242a6.003,6.003,0,0,0,-1.905,1.24l-1.731,1.721a0.999,0.999,0,1,0,1.41,1.418l1.709,-1.699a3.985,3.985,0,0,1,2.761,-1.123a3.975,3.975,0,0,1,2.799,1.122a3.997,3.997,0,0,1,0.111,5.644l-3.005,3.006a3.982,3.982,0,0,1,-3.395,1.126a3.987,3.987,0,0,1,-2.632,-1.563a1,1,0,0,0,-1.602,1.198zm5.602,-3.198a5.99,5.99,0,0,0,-3.949,-2.345a5.987,5.987,0,0,0,-5.105,1.702l-2.995,2.994a5.992,5.992,0,0,0,-1.695,4.285a5.976,5.976,0,0,0,1.831,4.211a5.99,5.99,0,0,0,6.431,1.242a6.003,6.003,0,0,0,1.905,-1.24l1.723,-1.723a0.999,0.999,0,1,0,-1.414,-1.414l-1.697,1.697a3.985,3.985,0,0,1,-2.761,1.123a3.975,3.975,0,0,1,-2.799,-1.122a3.997,3.997,0,0,1,-0.111,-5.644l3.005,-3.006a3.982,3.982,0,0,1,3.395,-1.126a3.987,3.987,0,0,1,2.632,1.563a1,1,0,0,0,1.602,-1.198z'%3E%3C/path%3E%3C/svg%3E");
}

.ipsType_richText h1:hover .anchor,
.ipsType_richText h2:hover .anchor,
.ipsType_richText h3:hover .anchor{
  opacity: 1
}


/* cassie's additions */

#elCmsPageWrap {
overflow: visible;
}

.info, .warning {
position: relative;
padding: 0.75rem 0.75rem 0.75rem 1.5rem;
background-color: #edf1f5;
border-radius: 10px;
border-top-left-radius: 0px;
border-bottom-left-radius: 0px;
border-left: #65b6fc solid 2px;
margin: 2rem 0rem;
}

article .info a,
article .warning a {
  color: #272a34;
  text-decoration: underline!important;
}

.warning {
background-color: #f9e9e9;
border-color: #f46969;
}

.info:after, .warning:after {
content: '';
position: absolute;
top: 0;
left: 0;
transform: translate(-50%, -50%);
height: 35px;
width: 35px;
background-repeat: no-repeat;
background-image: url("data:image/svg+xml,%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 346 342'%3E%3Ccircle cx='173' cy='172.62' r='163.56' fill='%23fafafa'/%3E%3Cpath d='M173,43.6C102.29,43.72,45,100.43,44,170.61,43,243.36,101.24,300,170,301.54c72.33,1.61,130.52-56.33,132-126.11,1.51-72-56.54-131.79-129-131.84Zm-1.57,242.3c-61.65-.84-112.34-51.57-111.69-114.54.65-62.13,51.59-112.13,113.41-112,62.5.07,113.15,50.88,113.15,113.54C286.23,235.2,234.88,286.74,171.39,285.9Z' fill='%2365b6fc' fill-rule='evenodd'/%3E%3Cpath d='M171.76,142.62c-5.6,0-9.78,3.75-9.78,8.86q0,43.34,0,86.7c0,5.3,3.9,8.88,9.63,8.91,5.89,0,9.78-3.56,9.78-9q0-21.63,0-43.23t0-43.45c0-5-4.14-8.73-9.64-8.78Z' fill='%2365b6fc' fill-rule='evenodd'/%3E%3Cpath d='M172.43,105.23a12.39,12.39,0,1,0-.31,24.77,12.39,12.39,0,1,0,.31-24.77Z' fill='%2365b6fc' fill-rule='evenodd'/%3E%3C/svg%3E%0A");
}

.warning:after {
background-image: url("data:image/svg+xml,%3Csvg id='Layer_1' data-name='Layer 1' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 346 342'%3E%3Ccircle cx='173' cy='172.62' r='163.56' fill='%23fafafa'/%3E%3Cpath d='M173,43.6c-70.71.12-128,56.83-129,127C43,243.36,101.24,300,170,301.54c72.33,1.61,130.52-56.33,132-126.11,1.51-72-56.54-131.79-129-131.84Zm-1.57,242.3c-61.65-.84-112.34-51.57-111.69-114.54.65-62.13,51.59-112.13,113.41-112,62.5.07,113.15,50.88,113.15,113.54-.07,62.3-51.42,113.84-114.91,113Z' fill='%23f46969' fill-rule='evenodd'/%3E%3Cpath d='M172.79,209.69c5.6,0,9.78-3.75,9.78-8.86v-86.7c0-5.3-3.9-8.88-9.63-8.91-5.89,0-9.78,3.56-9.78,9V200.9c0,5,4.14,8.73,9.64,8.78Z' fill='%23f46969' fill-rule='evenodd'/%3E%3Cpath d='M172.12,247.08a12.39,12.39,0,1,0,.94-24.76h-.63a12.39,12.39,0,0,0-.94,24.76Z' fill='%23f46969' fill-rule='evenodd'/%3E%3C/svg%3E");
}

body {
background: #fafafa!important;
}

details {
margin-bottom: 1rem;
}

table {
margin-bottom: 20px;
font-size: 0.8em;
width: 100%;
border: none
}

tbody {
display:table;
width: 100%;
max-width: 600px;
margin: 0 auto;
}
th, td {
    border: 1px solid #ccc;
}
tr:nth-child(2n) {
 background-color: #ffffff;
}	

article img {
 max-width: 70%;
 margin: 0 auto;
 display: block;
}

article a > code, li > code, p > code, strong > code {
 text-shadow: none;
 color: #333;
 padding: 4px;
 background-color: #dce0e4;
 font-size: 0.88em
}

article a {
 color: #5aa91d;
 text-decoration: none!important;
}

article a:hover {
 text-decoration: underline;
}

.quickLinks {
 padding: 2rem 0 2rem 3rem;
 margin-left: 0;
 padding-left: 0;
 list-style: none;
 max-height: 100vh;
 overflow: auto;
}

.quickLinks > * + * {
 margin-top: 0.4rem;
}

.quickLinks a {
 color: inherit!important;
 font-size: 16px;
 font-weight: 200;
 border-left: solid 3px #fafafa;
 padding-left: 0.5rem;
}

.quickLinks a:hover {
 color: #61ac27!important;
 text-decoration: none
}

.ipsHr {
 display: none
}

.quickLinks a.active {
 color: #5aa91d!important;
 border-color: #5aa91d;
}

.ipsReact_reactCount a {
  display: flex;
  align-items: center;
}

/* https://alistapart.com/article/axiomatic-css-and-lobotomized-owls/ */
.ipsType_richText > * + * {
 margin-top: 0; !important;
 margin-bottom: 0; !important;
 margin-top: 1em;
}

/* @link https://utopia.fyi/type/calculator?c=320,16,1.2,1140,19,1.25,4,2,&s=0.75|0.5|0.25,1.5|2|3|4|6,s-l */

:root {
  --fluid-min-width: 320;
  --fluid-max-width: 1140;
  --fluid-screen: 100vw;
  --fluid-bp: calc(
    (var(--fluid-screen) - var(--fluid-min-width) / 16 * 1rem) /
      (var(--fluid-max-width) - var(--fluid-min-width))
  );
}

@media screen and (min-width: 1140px) {
  :root {
    --fluid-screen: calc(var(--fluid-max-width) * 1px);
  }
}

:root {
  --f--2-min: 11.11;
  --f--2-max: 12.16;
  --step--2: calc(
    ((var(--f--2-min) / 16) * 1rem) + (var(--f--2-max) - var(--f--2-min)) *
      var(--fluid-bp)
  );

  --f--1-min: 13.33;
  --f--1-max: 15.20;
  --step--1: calc(
    ((var(--f--1-min) / 16) * 1rem) + (var(--f--1-max) - var(--f--1-min)) *
      var(--fluid-bp)
  );

  --f-0-min: 16.00;
  --f-0-max: 19.00;
  --step-0: calc(
    ((var(--f-0-min) / 16) * 1rem) + (var(--f-0-max) - var(--f-0-min)) *
      var(--fluid-bp)
  );

  --f-1-min: 18;
  --f-1-max: 22;
  --step-1: calc(
    ((var(--f-1-min) / 16) * 1rem) + (var(--f-1-max) - var(--f-1-min)) *
      var(--fluid-bp)
  );

  --f-2-min: 23;
  --f-2-max: 26;
  --step-2: calc(
    ((var(--f-2-min) / 16) * 1rem) + (var(--f-2-max) - var(--f-2-min)) *
      var(--fluid-bp)
  );

  --f-3-min: 27;
  --f-3-max: 32;
  --step-3: calc(
    ((var(--f-3-min) / 16) * 1rem) + (var(--f-3-max) - var(--f-3-min)) *
      var(--fluid-bp)
  );

  --f-4-min: 33;
  --f-4-max: 46;
  --step-4: calc(
    ((var(--f-4-min) / 16) * 1rem) + (var(--f-4-max) - var(--f-4-min)) *
      var(--fluid-bp)
  );
}

#elCmsPageWrap .ipsType_richText p,
#elCmsPageWrap .ipsType_richText li {
  font-size: var(--step-0)!important
}

#elCmsPageWrap .ipsType_richText h5 {
  font-size: var(--step-1)!important;
  font-weight: 400;
}

#elCmsPageWrap .ipsType_richText .intro {
  font-size: var(--step-1)!important;
}

#elCmsPageWrap .ipsType_richText h4 {
  font-size: var(--step-1)!important;
  font-weight: 400;
}

#elCmsPageWrap .ipsType_richText h3,
#elCmsPageWrap .ipsType_richText .h3 {
  font-size: var(--step-2)!important
}

#elCmsPageWrap .ipsType_richText h2 {
  font-size: var(--step-3)!important
}

#elCmsPageWrap .ipsType_richText h1 {
  font-size: var(--step-3)!important
}

/* fix the pre bug - long lines of text causing layout issues on desktop */

#elCmsPageWrap .ipsType_richText .ipsCode {
  overflow: hidden;
  white-space: pre-wrap;
  white-space: -moz-pre-wrap;
  white-space: -pre-wrap;
  white-space: -o-pre-wrap;
  word-wrap: break-word; 
}

/* deepdive element */

.deepdive {
  background-color: #e7f3df;
  padding: 1.75rem 1.5rem;
  border-radius: 6px;
}

.deepdive > p {
  font-weight: 400;
  font-size: var(--step--1)!important;
  
}

.deepdive details summary {
  cursor: pointer;
  background-color: #4e9815;
  color: #fff;
  display: inline-flex;
  align-content: center;
  justify-content: center;
  border-radius: 6px;
  padding: 0.5rem 1.25rem 0.5rem 1rem;
}

.deepdive details summary > * {
  display: inline;
}

.deepdive h2 {
  display: inline-block;
  margin-top: 0;
  margin-bottom: 1rem;
}

.deepdive details {
  border-radius: 4px;
  padding: 0.5em 0.5em 0;
}

.deepdive summary {
  font-weight: bold;
  margin: -0.5em -0.5em 0;
  padding: 0.5em;
}

.deepdive details[open] {
  padding: 0.5em;
}

.deepdive summary svg {
  margin-top: 0.3rem;
}
.deepdive details[open] summary {
  margin-bottom: 1rem;
}
