@import url('https://fonts.googleapis.com/css2?family=Asap:ital,wght@0,100..900;1,100..900&family=Luckiest+Guy&family=Potta+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Viga&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap');

.nunito-sans-200 {
  font-family: "Nunito Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 200;
  font-style: normal;
  font-variation-settings:
    "wdth" 100,
    "YTLC" 500;
}


    .luckiest-guy-regular {
    font-family: "Luckiest Guy", cursive;
    font-weight: 400;
    font-style: normal;
  }

  .potta-one-regular {
    font-family: "Potta One", system-ui;
    font-weight: 400;
    font-style: normal;
  }
.viga-regular {
  font-family: "Viga", sans-serif;
  font-weight: 400;
  font-style: normal;
}
  p {
    font-size: 1.4rem;
    font-family: "Asap", sans-serif;
      font-optical-sizing: auto;
      font-weight: 300;
      font-variation-settings:
    "wdth" 200;
  }
.asap-300 {
  font-family: "Asap", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}

h1 {
     font-family: "Viga", sans-serif;
     color: #555;
}
h2 {
  background: none!important;
  color: #555!important;
  font-family: "Luckiest Guy", cursive;
    font-weight: 400;
    font-style: normal;
    span {
      font-family: "Asap", sans-serif;
      width: 100%;
    }
}

.sodt_story_segment, .mb_segment_universal {
  width: 90%;
  margin: 2rem auto;
  background: #f1f1f1!important;
  box-shadow:  
          1px 1px 4px 0px #333344;
  div:has(img) {
    width: 30%!important;
    max-width: 30%!important;
    min-width: 30%!important;
    background: #fafafa;
    img {
      width: 100%;
      max-width: 100%;
      margin: .5rem auto;
    }
    img.thumb3d {
      min-width: 5.5rem!important;
      width: 5.5rem;
    }
    img.half {
      width: 45%; max-width: 45%;
    }
    img.full {
      width: 95%; max-width: 95%;
    }
  }
  h3, h4 {
    font-family: "Potta One", system-ui;
    font-weight: 400;
    font-style: normal;
    color: #888;
    text-align: center;
  }
  p + h4 {
    margin-top: 3rem;
  }
  p {
    width: 80%;
    margin: 1rem auto;
    text-align: justify;
  }
}

.sodt_story_segment + .sodt_story_segment {
  margin-top: 2rem auto;
}
.gv_quotation {
  background: white;
  padding: 3rem 6rem;
  font-family: "Asap", sans-serif;
  font-size: 1.6rem;
  attribution {
    display: block;
    text-align: right;
    color: dodgerblue;
  }
}



@media screen and (max-width: 55.5em) {


    .sodt_story_segment, .mb_story_segment {
      > div, div:has(img){
        width: 100%!important;
        min-width: 100%!important;
        max-width: 100%!important;
      }
      p {
        font-size: 1rem!important;
      }
      img.half {
        width: 90%; max-width: 9%;
      }
      img.full {
        width: 90%; max-width: 90%;
      }
    }
    .x {
      
    }
}