.mothersday {
  margin: auto; }
  .mothersday p {
    font-size: 14px; }
  .mothersday .content-block {
    background-image: none;
    padding: 0px;
    min-height: 640px; }
  .mothersday .content-wrapper {
    margin: 40px auto; }
  .mothersday .background {
    background-image: url("/static/mothersday/img/background.jpg?89cae6bb748a");
    height: 100%;
    background-size: cover; }
  .mothersday .background-auto {
    background-image: url("/static/mothersday/img/background.jpg?89cae6bb748a");
    height: auto;
    background-size: cover; }
  .mothersday .logo {
    top: 40px;
    left: 70px;
    position: absolute;
    height: 25px; }
  .mothersday .main {
    background-image: url("/static/mothersday/img/background.jpg?89cae6bb748a");
    color: #C93647;
    width: 100%;
    background-size: cover; }
    .mothersday .main span {
      display: block;
      margin: 30px auto;
      background-color: #C93647;
      width: 115px;
      height: 3px;
      margin-top: 20px;
      display: inline-table; }
    .mothersday .main h1 {
      font-size: 48px;
      font-family: "Libre-Baskerville-Italic";
      font-weight: 500;
      margin-top: 0px;
      margin-bottom: 25px; }
    .mothersday .main p {
      margin: 5px;
      color: black;
      font-size: 22px; }
    .mothersday .main .banner-picture {
      margin: auto;
      width: 40%; }
  .mothersday .featured {
    padding: 40px 0px;
    position: absolute;
    text-align: center;
    min-height: 580px;
    width: 100%; }
    .mothersday .featured h2 {
      font-weight: 500;
      font-size: 34px; }
  .mothersday .slider-box {
    position: relative;
    margin: 0px 90px 50px;
    border: 1px solid #A48053;
    box-sizing: border-box; }
  .mothersday .container {
    margin: auto;
    text-align: center;
    position: relative;
    box-sizing: border-box;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 70px 0px; }
  .mothersday .submission-display {
    margin: auto;
    text-align: center;
    position: relative; }
    .mothersday .submission-display h2 {
      margin-top: 0px; }
    .mothersday .submission-display .block {
      display: flex;
      max-height: 350px; }
  .mothersday .box-content {
    border: 1px solid #A48053;
    margin-top: 150px;
    padding: 60px;
    max-width: 300px; }
    .mothersday .box-content h1 {
      margin-bottom: 40px; }
    .mothersday .box-content p {
      margin-top: 40px;
      margin-bottom: 20px; }
    .mothersday .box-content .button-wrapper {
      margin-top: 35px; }
    .mothersday .box-content a {
      color: #A48053; }
  .mothersday .thank-you {
    padding: 30px 40px 60px; }
    .mothersday .thank-you h2 {
      font-weight: 500;
      font-size: 28px;
      line-height: 35px; }
    .mothersday .thank-you p {
      margin-top: 20px;
      margin-bottom: 30px;
      line-height: 22px; }
    .mothersday .thank-you .button {
      padding: 12px 120px; }
  .mothersday .container-submission {
    text-align: center;
    margin: 0px 20px;
    padding: 70px; }
    .mothersday .container-submission h1 {
      font-weight: 400;
      margin-bottom: 25px; }
    .mothersday .container-submission p {
      font-size: 15px;
      width: 50%;
      margin: 30px auto 0px;
      line-height: 30px; }
  .mothersday .checkbox-container {
    display: flex;
    justify-content: space-between; }
    .mothersday .checkbox-container .checkbox-and-text {
      text-align: left; }
    .mothersday .checkbox-container .checkbox-text {
      display: none; }
    .mothersday .checkbox-container .checkbox-text-show {
      display: block;
      color: red; }
    .mothersday .checkbox-container .next_button {
      max-height: 23.55px; }
  .mothersday .submission-content {
    border: 1px solid #A48053;
    display: flex;
    flex-direction: row;
    background-color: white; }
  .mothersday .submit {
    padding: 15px 80px;
    background: #A48053;
    color: white;
    margin: auto;
    margin-top: 30px; }
  .mothersday .picture-upload {
    position: relative;
    width: 35%;
    display: flex;
    align-items: center; }
    .mothersday .picture-upload .image_upload_preview {
      width: 100%;
      position: absolute;
      top: 0;
      left: 0;
      object-fit: cover;
      height: 100%; }
    .mothersday .picture-upload .image_preview_name {
      display: none;
      position: absolute;
      color: transparent;
      padding: 0px; }
    .mothersday .picture-upload .photo {
      width: 100%;
      display: block;
      height: 100%;
      object-fit: cover; }
  .mothersday .text-area {
    padding: 30px;
    width: 70%; }
    .mothersday .text-area .title {
      font-size: 28px; }
    .mothersday .text-area h3, .mothersday .text-area p {
      text-align: left;
      font-size: 22px;
      line-height: 30px; }
    .mothersday .text-area .submitted-by {
      text-transform: uppercase;
      color: #AAA9A8; }
  .mothersday .overflow-scroll {
    overflow: auto;
    overflow-x: hidden; }
  .mothersday .upload-button {
    height: 100%;
    width: 100%;
    display: inline-grid;
    border: 1px solid #A48053;
    z-index: 1;
    display: inline-grid; }
  .mothersday .remove-photo {
    position: absolute;
    top: 15px;
    right: 15px;
    border: 1px solid #A48053;
    border-radius: 50%;
    font-size: 25px;
    padding: 2px 8px;
    line-height: 25px;
    color: #A48053;
    background-color: white;
    z-index: 2;
    display: none; }
  .mothersday .remove-photo:after {
    content: 'x'; }
  .mothersday .upload-icon {
    border: 4px dashed rgba(164, 128, 63, 0.5);
    margin: 15px 15px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; }
    .mothersday .upload-icon p {
      font-size: 16px;
      width: 100%;
      color: #A48053; }
  .mothersday .solid-border {
    border: 1px solid #A48053; }
  .mothersday .dashed-border {
    border: 1px solid #A48053; }
  .mothersday .icon {
    background: url("/static/mothersday/img/add-image2x.png?89cae6bb748a") no-repeat center center;
    background-size: 95px 95px;
    height: 95px;
    width: 95px; }
  .mothersday #id_title, .mothersday #id_story {
    border: 1px solid #AAA9A8;
    margin-bottom: 10px;
    background-color: transparent;
    padding: 15px;
    font-family: "Gotham-Light";
    font-size: 15px;
    box-shadow: none; }
  .mothersday #id_story {
    width: 100%;
    box-sizing: border-box;
    max-height: 175px;
    margin-bottom: 0px;
    line-height: 20px; }
  .mothersday #id_photo {
    display: none; }
  .mothersday .wordcount {
    display: inline;
    color: gray;
    text-align: left;
    font-size: 12px;
    margin-top: 7px;
    float: left;
    padding-right: 5px; }
  .mothersday .input-wrapper {
    background-image: linear-gradient(to left, gray 70%, rgba(255, 255, 255, 0) 0%);
    background-position: bottom;
    background-size: 50px 1px;
    background-repeat: repeat-x;
    background-position-x: 45px;
    margin: 0px auto; }
    .mothersday .input-wrapper #id_otp {
      margin-bottom: 5px;
      border: none;
      letter-spacing: 30px;
      padding: 0px 15px;
      width: 100%;
      font-size: 34px;
      font-weight: 600;
      text-shadow: 0 0 0 black;
      color: transparent;
      font-family: monospace;
      box-sizing: content-box; }

.tns-horizontal.tns-subpixel > .tns-item {
  display: inline-flex; }

.tns-ovh {
  overflow: hidden;
  margin: 0px auto; }

.tns-slider {
  display: flex;
  flex-flow: row wrap; }

.tns-visually-hidden {
  display: none; }

.tns-nav {
  position: absolute;
  margin: 10px auto;
  width: 100%; }
  .tns-nav button {
    margin-left: 5px;
    border: 1px solid #AAA9A8; }
  .tns-nav .tns-nav-active, .tns-nav button:hover {
    border: 1px solid #A48053; }

.arrow-container {
  padding: 0px 20px;
  margin: auto;
  position: relative; }

.control-box {
  position: absolute;
  top: 45%;
  width: 100%; }

.customized-controls {
  position: relative;
  display: flex;
  justify-content: space-between;
  padding: 0px;
  margin: 0px 30px;
  cursor: pointer; }
  .customized-controls .prev, .customized-controls .next {
    list-style: none; }
    .customized-controls .prev img, .customized-controls .next img {
      width: 25px; }

@media only screen and (max-width: 1024px) {
  .mothersday .content-wrapper {
    width: 100%; }
  .mothersday .logo {
    top: 25px;
    left: 25px;
    height: 25px; }
  .mothersday .main h1 {
    font-size: 36px; }
  .mothersday .text-area h2 {
    font-size: 18px;
    margin: 10px 0px; }
  .mothersday .text-area p {
    font-size: 14px;
    margin: 10px 0px; }
  .mothersday .container-submission {
    padding: 70px 20px; } }

@media only screen and (max-width: 840px) {
  .mothersday .main .banner-picture {
    width: 60%; }
  .mothersday .picture-upload {
    width: 50%; }
  .mothersday .submission-display .block {
    max-height: 320px; }
  .mothersday .text-area {
    width: 50%; }
    .mothersday .text-area h3 {
      margin: 0px; }
    .mothersday .text-area #id_story {
      max-height: 150px; } }

@media only screen and (max-width: 600px) {
  .mothersday .content-wrapper {
    width: 90%; }
  .mothersday .background {
    background-image: url("/static/mothersday/img/mobile-background.jpg?89cae6bb748a");
    background-size: cover; }
  .mothersday .logo {
    top: 20px;
    left: 20px;
    height: 20px; }
  .mothersday .main {
    background-image: url("/static/mothersday/img/mobile-background.jpg?89cae6bb748a");
    background-size: cover;
    background-repeat: no-repeat;
    padding: 40px 0px; }
    .mothersday .main .container {
      height: 100%;
      padding: 10px; }
    .mothersday .main h1 {
      font-size: 30px;
      margin-top: 30px;
      margin-bottom: 13px; }
    .mothersday .main p {
      font-size: 14px; }
    .mothersday .main .banner-picture {
      width: 100%;
      margin-top: 10px; }
  .mothersday .submission-content {
    flex-direction: column;
    padding: 20px; }
    .mothersday .submission-content .text-area {
      width: 100%;
      padding: 0px;
      padding-top: 15px; }
    .mothersday .submission-content .remove-photo {
      border: none;
      font-size: 16px;
      top: unset;
      border-radius: unset;
      background-color: none; }
    .mothersday .submission-content .remove-photo:after {
      content: 'Remove'; }
  .mothersday .submit {
    padding: 15px 0px;
    display: block;
    width: 90%; }
  .mothersday .submission-display {
    padding: 0px;
    margin-top: 0px; }
    .mothersday .submission-display .block {
      max-height: 640px;
      flex-direction: column; }
    .mothersday .submission-display h1 {
      font-size: 22px;
      margin: 20px; }
  .mothersday .content-block {
    padding-top: 0px;
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%; }
    .mothersday .content-block .box-content {
      margin: 30px;
      margin-top: 100px;
      min-width: 200px; }
  .mothersday .slider-box {
    margin: 0px 40px 40px; }
  .mothersday .picture-upload {
    width: auto;
    max-height: 100%; }
    .mothersday .picture-upload .image_upload_preview {
      width: auto; }
    .mothersday .picture-upload .image_preview_name {
      color: black; }
    .mothersday .picture-upload .display {
      height: 290px; }
  .mothersday .featured {
    min-height: 640px; }
  .mothersday .text-area {
    padding: 20px;
    width: auto; }
  .mothersday .text-area #id_story {
    max-height: 100%; }
  .mothersday .upload-button {
    height: 50px;
    border: 1px dashed #A48053; }
  .mothersday .upload-icon {
    flex-direction: row;
    justify-content: space-evenly;
    height: 50px;
    margin: 0px 15px;
    font-size: 14px;
    border: none; }
    .mothersday .upload-icon p {
      font-size: 14px;
      color: #A48053;
      margin: auto; }
  .mothersday .icon {
    background-size: 40px 40px;
    width: 40px; }
  .mothersday #wordcount {
    margin-bottom: 10px; }
  .mothersday .input-wrapper {
    max-width: 180px;
    background-size: 30px 1px;
    background-position-x: 52px; }
    .mothersday .input-wrapper #id_otp {
      padding: 0px 4px;
      font-size: 25px;
      letter-spacing: 15px; }
  .customized-controls {
    margin: 0px 10px; }
  .tns-nav {
    margin-top: 0px;
    margin-bottom: 20px; } }

@media only screen and (max-width: 420px) {
  .mothersday .content-wrapper {
    width: 85%; }
  .mothersday .thank-you {
    margin: 20px;
    margin-top: 75px;
    padding: 30px; }
    .mothersday .thank-you .button {
      padding: 10px 80px; }
  .mothersday .container-submission {
    padding: 70px 10px; }
    .mothersday .container-submission p {
      width: 90%;
      font-size: 13px;
      line-height: 25px; }
  .mothersday .text-area .title {
    font-size: 24px; }
  .mothersday .slider-box {
    max-height: 640px; }
  .customized-controls .prev img, .customized-controls .next img {
    width: 15px; } }

@media only screen and (max-width: 350px) {
  .mothersday .text-area {
    padding: 20px 10px; }
  .mothersday .wordcount {
    margin-top: 5px;
    font-size: 10px;
    line-height: 12px; } }