@media only screen and (max-width: 1050px) {
  #guidance_zone {
    flex-direction: column;
  }
  
  .delivery_zone {
    width: 100%;
  }
  
  .back .flipback, .boxpanel .flipback {
    top: 14px;
  }
  
  #guidance_zone .panel .back, #guidance_zone .boxpanel .surface {
    width: 88vw;
  }

  .panel {
    margin-left: 0;
    width: 100%;
    display: flex;
    justify-content: center
  }
  
  .panel .front {
    display: flex;
    flex-direction: column;
    align-items: center;
    left: 0;
  }
  
  .panel .back, .panel .front {
    width: 100%;
  }
  
  .pane_guidance {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -box-sizing: border-box;
    max-width: 460px;
    width: 100%;
    position: relative;
  }
  
  .add_height {
    height: 750px;
  }
  
  .prompt_zone {
    max-width: 320px;
    text-align: center;
    width: 100%;
  }
  
  .widget_heading {
    margin: 14px 2% 14px 2%;
  }
  
  #widget_title_gui {
    font-size: 1.6em;
  }
  
  .guidance_prompt_media {
    align-items: center;
  }
  
  .lookup_link {
    text-align: center;
    margin-bottom: 10%;
    margin-left: 0;
  }

  .lookup_link, #personality_lookup_link {
    a {
      font-size: 0.8em;
      padding: 8px;
    }
  }

  #new_birthday {
    margin-top: 1px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 1049px) {
  /* iPad and tablet-specific styles */
  .source_cards_card_design {
    width: 88vw;
    max-width: 88vw;
    height: auto;
  }

  .four_sided_box .surface {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
  }

  .pane_guidance {
    max-width: 88vw;
    margin: 0 auto;
  }
}

@media only screen and (max-width: 767px) {
  .source_cards_card_design {
    width: 88vw;
    max-width: 88vw;
    height: auto;
  }

  #widget_title {
    font-size: 28px;
  }

  #widget_instructions {
    font-size: 25px;
  }

  #birth_card_lookup_title {
    font-size: 36px;
  }

  #birth_card_lookup_instructions {
    font-size: 23px;
  }

  .welcome {
    margin: 10px 0;
    font-size: 20px;
    margin-bottom: 22px;
  }

  #welcome_instructions {
    font-size: 20px;
  }
}

@media screen and (max-width: 600px) {
  #widget_instructions br {
    display: block;
  }

  #birth_card_lookup_instructions br {
    display: block;
  }
}