@media only screen and (max-width: 767px) {
  .aot-productline-template,
  .aot-product-variant-template,
  .aot-product-offering-template,
  .aot-product-sub-offering-template,
  .aot-section-template,
  .aot-sub-section-template,
  .aot-case-study-template,
  .aot-article-template,
  .aot-sku-template,
  .aot-productfamily-template,
  .aot-productportfolio-template,
  .aot-home-template,
  .aot-product-child-template,
  .aot-profile-template,
  .aot-find-my-template,
  .aot-campaign-template,
  .aot-channel-partner-details-template,
  .aot-contact-center-landing-template,
  .aot-press-release-template,
  .aot-event-template,
  .aot-contact-center-form-template,
  .aot-podcast-series-template,
  .aot-podcast-episode-template {
    --grid-template-columns: repeat(4, 1fr);
    --grid-column-gap: 16px;
    --top-content-margin-bottom: 0;
    --aside-grid-column: 1 / span 4;
    --share-grid-column: span 3;
    --aside-margin: 0 -16px;
    --content-grid-column: 1 / span 4;
    --contentFullWidth-grid-column: 1 / span 4;
    --main-margin: 0 16px;
    --main-width: auto;
    --sku-top-content-margin: 0 16px 24px;
    --add-to-calendar-grid-column: span 3;
  }
}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .aot-productline-template,
  .aot-product-variant-template,
  .aot-product-offering-template,
  .aot-product-sub-offering-template,
  .aot-section-template,
  .aot-sub-section-template,
  .aot-case-study-template,
  .aot-article-template,
  .aot-sku-template,
  .aot-productfamily-template,
  .aot-productportfolio-template,
  .aot-home-template,
  .aot-product-child-template,
  .aot-profile-template,
  .aot-find-my-template,
  .aot-campaign-template,
  .aot-channel-partner-details-template,
  .aot-contact-center-landing-template,
  .aot-press-release-template,
  .aot-event-template,
  .aot-contact-center-form-template,
  .aot-podcast-series-template,
  .aot-podcast-episode-template {
    --grid-template-columns: repeat(12, 1fr);
    --grid-column-gap: 24px;
    --top-content-margin-bottom: 0;
    --aside-grid-column: 1 / span 12;
    --share-grid-column: span 3;
    --aside-margin: 0 -36px;
    --content-grid-column: 1 / span 12;
    --contentFullWidth-grid-column: 1 / span 12;
    --main-margin: 0 36px;
    --main-width: auto;
    --sku-top-content-margin: 0 36px 24px;
    --add-to-calendar-grid-column: span 3;
  }
}

@media only screen and (min-width: 1024px) and (max-width: 1439px) {
  .aot-productline-template,
  .aot-product-variant-template,
  .aot-product-offering-template,
  .aot-product-sub-offering-template,
  .aot-section-template,
  .aot-sub-section-template,
  .aot-case-study-template,
  .aot-article-template,
  .aot-sku-template,
  .aot-productfamily-template,
  .aot-productportfolio-template,
  .aot-home-template,
  .aot-product-child-template,
  .aot-profile-template,
  .aot-find-my-template,
  .aot-campaign-template,
  .aot-channel-partner-details-template,
  .aot-contact-center-landing-template,
  .aot-press-release-template,
  .aot-event-template,
  .aot-contact-center-form-template,
  .aot-podcast-series-template,
  .aot-podcast-episode-template {
    --grid-template-columns: repeat(12, 1fr);
    --grid-column-gap: 24px;
    --top-content-margin-bottom: var(--aot-spacing-xxxl);
    --aside-grid-column: 1 / span 3;
    --share-grid-column: span 3;
    --aside-margin: 0;
    --content-grid-column: 4 / span 9;
    --contentFullWidth-grid-column: 1 / span 12;
    --main-margin: 0 40px;
    --main-width: auto;
    --sku-top-content-margin: 0 40px 24px;
    --add-to-calendar-grid-column: span 3;
  }
}

@media only screen and (min-width: 1440px) {
  .aot-productline-template,
  .aot-product-variant-template,
  .aot-product-offering-template,
  .aot-product-sub-offering-template,
  .aot-section-template,
  .aot-sub-section-template,
  .aot-case-study-template,
  .aot-article-template,
  .aot-sku-template,
  .aot-productfamily-template,
  .aot-productportfolio-template,
  .aot-home-template,
  .aot-product-child-template,
  .aot-profile-template,
  .aot-find-my-template,
  .aot-campaign-template,
  .aot-channel-partner-details-template,
  .aot-contact-center-landing-template,
  .aot-press-release-template,
  .aot-event-template,
  .aot-contact-center-form-template,
  .aot-podcast-series-template,
  .aot-podcast-episode-template {
    --grid-template-columns: repeat(12, 71px);
    --grid-column-gap: 24px;
    --top-content-margin-bottom: var(--aot-spacing-xxxl);
    --aside-grid-column: 1 / span 3;
    --share-grid-column: span 3;
    --aside-margin: 0;
    --content-grid-column: 4 / span 9;
    --contentFullWidth-grid-column: 1 / span 12;
    --main-margin: 0 auto;
    --main-width: 1116px;
    --sku-top-content-margin: 0 auto 72px;
    --add-to-calendar-grid-column: span 3;
  }
}

.aot-header {
  position: sticky;
  top: 0px;
  z-index: 41;
}

.aot-product-offering-template .aot-content,
.aot-product-sub-offering-template .aot-content,
.aot-section-template,
.aot-sub-section-template,
.aot-case-study-template,
.aot-article-template,
.aot-find-my-template,
.aot-campaign-template,
.aot-channel-partner-details-template,
.aot-contact-center-landing-template .aot-content,
.aot-press-release-template,
.aot-contact-center-form-template,
.aot-podcast-series-template,
.aot-podcast-episode-template {
  grid-column: var(--contentFullWidth-grid-column);
}

.aot-layout-grid {
  margin: var(--main-margin);
  width: var(--main-width);
}

.aot-layout-grid > .cmp-container {
  display: grid;
  grid-column-gap: var(--grid-column-gap);
  grid-template-columns: var(--grid-template-columns);
}

.aot-podcast-episode-template .aot-hero-content {
  margin: var(--main-margin);
  width: var(--main-width);
}

.aot-podcast-episode-template .aot-hero-content > .cmp-container {
  display: grid;
  grid-column-gap: var(--grid-column-gap);
  grid-template-columns: var(--grid-template-columns);
}

.aot-aside {
  grid-column: var(--aside-grid-column);
  margin: var(--aside-margin);
}

.new.newpar.section.cq-Editable-dom {
  grid-column: var(--content-grid-column);
}

.aot-aside + .aot-content {
  grid-column: var(--content-grid-column);
}
.aot-content {
  grid-column: var(--contentFullWidth-grid-column);
}

.aot-hero-content,
.aot-bottom-content,
.new.newpar.section.cq-Editable-dom {
  grid-column: var(--contentFullWidth-grid-column);
}

.aot-aside:not(.aot-article-template .aot-aside):not(.aot-case-study-template .aot-aside),
.aot-aside:not(.aot-article-template .aot-aside):not(.aot-case-study-template .aot-aside) .cmp-container {
  position: sticky;
  top: 0;
  z-index: 10;
}

.aot-sku-template .aot-hero-content {
  margin: var(--sku-top-content-margin);
  width: var(--main-width);
}

.aot-article-template .aot-secondary-content {
  width: var(--main-width);
  margin: var(--main-margin);
}

.aot-case-study-template .aot-secondary-content {
  width: var(--main-width);
  margin: var(--main-margin);
}

.aot-event-template .sharebutton {
  grid-column: var(--share-grid-column);
}

.aot-podcast-episode-template .sharebutton {
  grid-column: 1 / span 3;
}

.aot-event-content > .cmp-container {
  display: grid;
  grid-column-gap: var(--grid-column-gap);
  grid-template-columns: var(--grid-template-columns);
}

@media only screen and (max-width: 767px) {
  .aot-event-content {
    grid-column: span 4;
  }
}

@media only screen and (min-width: 768px) {
  .aot-event-content {
    grid-column: span 12;
  }
}

.aot-event-template .addtocalendarbutton {
  grid-column: span 3;
}
