@media screen and (max-width: 1440px) {
  #fusion .cta-grid {
    height: 200px !important;
  }
}
@media screen and (max-width: 1024px) {
  #fusion .repeat-grid.flex {
    flex-direction: column;
  }
  section.block + section.block {
    margin-block: 3em;
  }
  #social.inline {
    margin: -2.4em 0 0;
  }
}
@media screen and (max-width: 1000px) {
  #social.inline {
    margin: -0.8em 1.5em 0 0;
  }
}
@media screen and (max-width: 864px) {
  #social.inline {
    margin: -2.4em 0 0;
  }
}
@media screen and (max-width: 800px) {
  section.block {
    padding: 2em 2em !important;
  }
  .block-contents {
    flex-direction: column !important;
  }
  .layout-right .block-image {
    height: 400px;
    background-size: 400px 300px !important;
    background-position: center right;
    margin: 0 !important;
  }
}
@media screen and (max-width: 768px) {
  section p {
    word-wrap: break-word;
    text-align: left;
  }
  h2.heading {
    text-align: left;
  }
  .centered-content.flex {
    align-items: flex-start;
    text-align: left !important;
  }
  #sandbox .dragonWorldLogo,
  #www .dragonWorldLogo {
    width: 100% !important;
    margin: 0 !important;
  }
  img.widthFixer {
    width: 100% !important;
    margin: 0 !important;
  }
  #badgetypes div {
    text-align: left;
  }
  h2 {
    text-align: left !important;
  }
  #pixels .title-grid .context:last-child h2 {
    line-height: 1.3 !important;
  }
  .gallery.flex {
    align-items: flex-start;
  }
  .gallery.flex .container.flex {
    margin-inline: 0;
  }
}
@media screen and (max-width: 500px) {
  .title-grid {
    display: flex !important;
    flex-direction: column;
    grid-row-gap: 0 !important;
    align-items: flex-start !important;
    margin-bottom: 2em;
  }
  .title-grid .context h2.heading {
    margin-top: 0 !important;
  }
  .title-grid ~ .grid.grid-2-cols,
  #sandbox .gsandbox {
    margin-top: 0 !important;
  }
  .fullImgBanner {
    width: auto;
  }
  #www .grid.grid-60-40.overflow,
  #pixels .grid.grid-60-40.overflow {
    padding: 0 0 2em !important;
    border-left: none;
    border-right: none;
  }
  #www .grid.grid-60-40.overflow .content,
  #pixels .grid.grid-60-40.overflow .content {
    padding: 0 0.5em;
  }
  #www .grid.grid-60-40.overflow canvas,
  #pixels .grid.grid-60-40.overflow canvas {
    transform: none !important;
  }
  .grid.overflow {
    overflow-x: scroll !important;
  }
  #dragons .grid.grid-70-30.overflow {
    width: 100% !important;
  }
  #dragons iframe {
    width: auto;
  }
  .slide-container {
    max-width: 100%;
  }
  .icon-contain {
    margin: 0 !important;
  }
  body#home {
    margin-top: 20px !important;
  }
  #sliderDragon {
    height: 300px !important;
    background-image: url("/img/Banner_Assets/Dragons/Library_TB.png") !important;
    background-size: cover !important;
  }
  #sliderMystic {
    height: 300px !important;
    background-image: url("/img/Banner_Assets/Fusion/Dragon_Den_Mystical_Chambers_bg.png") !important;
    background-size: cover !important;
  }
  #sliderDemon {
    height: 300px !important;
    background-image: url("/img/Banner_Assets/Demons/Demons_Banner.png") !important;
    background-size: cover !important;
  }
  #sliderDragon img,
  #sliderMystic img,
  #sliderDemon img {
    display: none !important;
  }
  #sliderDragon img.dragon,
  #sliderMystic img.dragon,
  #sliderDemon img.dragon {
    display: block !important;
    top: 5% !important;
    width: 90% !important;
    left: -20% !important;
  }
}
@media screen and (max-width: 490px) {
  .cta-grid .cta-content.flex {
    left: 0% !important;
    height: 12em !important;
  }
  .black-strip.left,
  .black-strip.right {
    width: 60% !important;
    top: 0%;
  }
  #sandbox .IntThumbnails.flex,
  #www .IntThumbnails.flex,
  #pixels .IntThumbnails.flex {
    display: flex;
    align-items: center;
    /* justify-content: space-between; */
  }
  #sandbox .IntThumbnails.flex img,
  #www .IntThumbnails.flex img,
  #pixels .IntThumbnails.flex img {
    width: 20% !important;
  }
  #pixels .IntThumbnails.flex,
  #www .IntThumbnails.flex {
    justify-content: space-evenly;
    margin: 1.5em 0 0 -0.5em !important;
  }
  #pixels #pixelscanvas {
    transform: none !important;
    width: auto !important;
  }
  body {
    margin-top: 0 !important;
  }
  section.block {
    padding: 2em 1em !important;
  }
  a.opensea br {
    display: block !important;
  }
  main {
    margin-top: 0 !important;
  }
  #cave {
    padding-top: 78.1%;
  }
  #dragons .slide-container.none .black-strip {
    top: -1%;
  }
  #dragons .slide-container.none .black-strip.right {
    right: 7%;
  }
  #dragons .slide-container.none .black-strip.left {
    left: 0%;
  }
  #fusion .slide-container .black-strip {
    top: -1%;
  }
  #fusion .slide-container .black-strip.right {
    right: -1%;
  }
  section.width {
    padding: 2em 0 !important;
  }
  .header {
    height: 12vh !important;
  }
  footer {
    width: 88%;
  }
  .cta-grid {
    max-width: 400px !important;
  }
  #collections .black-strip.right {
    right: -1%;
  }
  #interop .intThumbnail {
    width: 20% !important;
  }
}
@media screen and (max-width: 500px) {
  #cave {
    padding-top: 71.8%;
  }
  #home a#btn {
    top: 55%;
  }
}
@media screen and (max-width: 430px) {
  #cave {
    padding-top: 70.8%;
  }
}
@media screen and (max-width: 414px) {
  #cave {
    padding-top: 72.5%;
  }
}
@media screen and (max-width: 375px) {
  #cave {
    padding-top: 74%;
  }
}
@media screen and (max-width: 320px) {
  header {
    height: 15vh;
  }
  header #brand {
    min-width: 100px;
    margin: 0.75em 0.5em 0.75em 0.5em;
  }
  header nav#main-menu ul {
    row-gap: 1em;
    margin-top: 1em;
  }
  #cave {
    padding-top: 77.1%;
  }
  footer nav {
    margin: 0 1em !important;
  }
  section.block {
    padding: 2em 0em !important;
  }
  #sliderDragon img.dragon,
  #sliderMystic img.dragon,
  #sliderDemon img.dragon {
    top: 20% !important;
    width: 100% !important;
  }
}
