.esri-technical .svg {
    filter: invert(30%) sepia(98%) saturate(1144%) hue-rotate(176deg)
        brightness(95%) contrast(103%);
    width: 64px;
    height: 64px;
}
.info-icon {
    color: var(--calcite-ui-brand);
}
.esri-table table tr {
    --calcite-ui-border-1: #dfdfdf;
}
.esri-technical .esri-text__iconContainer {
    display: flex;
    justify-content: space-between;
}
.esri-technical .esri-text__iconContainer .sharelinks {
    display: flex;
}
.esri-technical
    .esri-text__iconContainer
    .sharelinks
    calcite-link:not(:nth-child(1)) {
    padding-inline-start: var(--space-4);
}

.esri-technical-header {
    border-bottom: 1px solid var(--calcite-ui-border-1);
}
.esri-technical-header-content {
    width: 85%;
}
@media (min-width: 760px) {
    .esri-technical-header-content {
        width: 60%;
    }
}
.esri-technical-header-content calcite-chip {
    margin-inline-end: var(--space-4);
}

.esri-technical-info-details .kaltura-video {
    aspect-ratio: 16 / 9;
    width: 100%;
}

.esri-technical-info-text section h2 {
    font-size: var(--font-3);
    margin: var(--space-12) 0 var(--space-2);
}

.esri-technical-info-text section h2:first-of-type {
    margin-block-start: var(--space-4);
}

.esri-technical-info-details section {
    padding: 0 0 var(--space-1) 0;
}
.esri-technical-info-details section img {
    padding: var(--space-2) 0 var(--space-8);
}
.esri-technical-info-details section ul,
.esri-technical-info-details section ol {
    padding-inline-start: var(--space-8);
}

.esri-technical-info-details section .note {
    border: 1px solid #77bde7;
    padding: var(--space-4);
    background: #c7eaff;
    margin: var(--space-4) 0;
}
.esri-technical-info-details section .note span {
    display: block;
    margin-bottom: var(--space-2);
}
.esri-technical-info-details section .note.warning {
    border: 1px solid var(--calcite-ui-warning);
    background: #fff7cc;
    text-align: left;
}
.esri-technical-info-details section .note.error {
    border: 1px solid var(--calcite-ui-danger);
    background: #ffc6bf;
}
.esri-technical-info-details section .note.code {
    border: 1px solid var(--calcite-ui-border-1);
    background: var(--calcite-ui-foreground-2);
}
.esri-technical-info-details section .note.code code {
    background-color: transparent;
}

.esri-technical-info-caption {
    padding: var(--space-8) 0 var(--space-4) 0;
    margin-block-start: var(--space-6);
    font-size: var(--calcite-font-size--1);
    border-top: 1px solid var(--calcite-ui-border-1);
}
.esri-technical-info-caption ul li {
    font-size: var(--calcite-font-size--1);
}
.calcite-button-wrap {
    display: inline-block;
    white-space: nowrap;
}

/* in the master */
.esri-technical-info-contact {
    margin: var(--space-4) 0 var(--space-16);
    padding-block-end: var(--space-10);
    background:  #edf8ff;
}

.esri-technical-info-contact .feedback-section {
    justify-content: center;
    display: flex;
    border-bottom: 1px solid var(--calcite-ui-border-1);
    padding-bottom: var(--space-6);
    flex-direction: column;
    align-items: center;
}
@media (min-width: 760px) {
    .esri-technical-info-contact .feedback-section {
        flex-direction: row;
    }
}
.esri-technical-info-contact .feedback-section span {
    margin-right: var(--space-4);
}
.esri-technical-info-contact .feedback-section .feedback-section-click {
    text-align: center;
}
@media (min-width: 760px) {
    .esri-technical-info-contact .feedback-section .feedback-section-click {
        border-right: 1px solid var(--calcite-ui-border-1);
        padding-inline-end: var(--space-8);
    }
}
.esri-technical-info-contact .feedback-section .feedback-section-email {
    text-align: center;
    padding-top: var(--space-3);
}
@media (min-width: 760px) {
    .esri-technical-info-contact .feedback-section .feedback-section-email {
        padding-inline-start: var(--space-8);
        padding-top: 0;
    }
}
.esri-technical-info-contact .more-help-section {
    display: flex;
    justify-content: center;
    flex-direction: column;
}

@media (min-width: 760px) {
    .esri-technical-info-contact .more-help-section {
        flex-direction: row;
    }
}

.esri-technical-info-contact .more-help-section div {
    flex-basis: 50%;
    text-align: center;
    padding-block-start:var(--space-10);
}

.esri-technical-info-contact .more-help-section img,
.esri-technical-info-contact .more-help-section svg {
    width: 48px;
    fill: var(--theme-color-secondary);
}

/* master */
.notification-sidebar{
    padding: var(--space-6) var(--space-6) var(--space-6) var(--space-4);
    display: flex;
    flex-direction: row; 
    background: #EBF8FF;
    margin-block-end: var(--space-4);
}
.notification-sidebar svg{
    height:48px;
    width: auto;
    margin-right: var(--space-2);
}
.notification-sidebar h3{
    line-height: 1.2;
    font-weight: var(--calcite-font-weight-bold);
}
.notification-sidebar calcite-link{
    display:none;
}

@media (min-width: 860px) {
    .notification-sidebar .download-icons{
        display:none;
    }
    .notification-sidebar calcite-link{
        display:block;
    }
}

.esri-technical-info-sidebar {
    padding: var(--space-6);
    background: #f8f8f8;
}

.esri-technical-info-sidebar .article-type-wrapper .article-type {
    display: flex;
    border-bottom: 1px solid var(--calcite-ui-border-1);
    padding: var(--space-6) 0;
}
.esri-technical-info-sidebar
    .article-type-wrapper
    .article-type
    .esri-text__icon {
    margin-top: var(--space-2);
}
.esri-technical-info-sidebar .article-type-wrapper .article-type:last-of-type {
    margin: 0 var(--space-6) var(--space-8) 0;
    border-bottom: none;
}
.esri-technical-info-sidebar .article-type-wrapper .article-type-text {
    margin-inline-start: var(--space-2);
}
.esri-technical-info-sidebar .article-type-wrapper .article-type p {
    margin-bottom: 0;
}
.esri-technical-info-sidebar .related-info-wrapper {
    display: flex;
    margin: var(--space-6) 0 0;
    flex-direction: column;
}
@media (min-width: 640px) and (max-width: 860px) {
    .esri-technical-info-sidebar .related-info-wrapper {
        flex-direction: row;
    }
}
@media (min-width: 1280px) {
    .esri-technical-info-sidebar .related-info-wrapper {
        flex-direction: row;
    }
}

@media (min-width: 640px) {
    .esri-technical-info-sidebar .related-info-wrapper .related-info-content {
        margin-inline-end: var(--space-4);
        flex-basis: 33%;
    }
}
@media (min-width: 640px) {
    .esri-technical-info-sidebar
        .related-info-wrapper
        .related-info-content:last-of-type {
        margin-inline-end: 0;
    }
}

.esri-technical-info-sidebar .related-info-wrapper .related-info-content calcite-link{
  display:block;
  margin-block-end: var(--space-2);
}

.bug-article-table tr td calcite-icon {
    margin-top: -4px;
    display: inline-block;
    vertical-align: middle;
}

.stepsToReproduce-title {
    display: none;
}

.esri-technical-info-sidebar .related-info-wrapper .related-info-content calcite-link{
    display:block;
    margin-block-end: var(--space-2);
  }
  
  .esri-technical-relatedLinks ul{
    padding-inline-start: 0;
  }
  
  .esri-technical-relatedLinks ul li{
    list-style: none;
      padding-inline-start: 0;
      padding-block-end: var(--space-4);
  }


  /* test code */

.esri-technical-container {
  display: grid;
  grid-template-columns: 61% 33%;
  grid-gap: 70px;
  row-gap:40px;
  margin: 0;
  justify-content: space-between;
}

.esri-technical-container .leftcontent {
  grid-row-start: 1;
  grid-row-end: 2;
}

.esri-technical-container .rightcontent {
  grid-row-start: 1;
  grid-row-end: 3;
}

pre{
    text-wrap: wrap;
    padding: 10px;
    margin: 20px 0;
    margin-left: 0 !important;
}
@media (max-width:860px){
  .esri-technical-container {
    display: block;
    }
    .esri-technical-container .item{
        margin-block-end:40px;
    }
}