.datepicker {

  width: 940px !important;
  // height: 430px !important;
  overflow-x: hidden !important;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  &:before {
    content: '';
    position: absolute;
    right: 50%;
    top: 0;
    bottom: 0;
    width: 2px;
    background-color: #e2e0d8;
  }
  .vc-rounded-full {
    border-radius: 0px;
  }
  .vc-grid-container {
    overflow-x: hidden !important;
  }

  .vc-grid-cell {
    .vc-header {
      height: 50px;
    }
    .vc-weekday {
      background-color: $brown-light;
      color: $brown;
      text-transform: uppercase;
      font-size: 12px;
    }
    .vc-weeks {
      padding: 0;
      overflow: hidden;
    }
    .vc-title {
      padding-bottom: 8px;
    }
    .vc-day {
      width: 66px;
      height: 66px;
      .vc-h-full {
        width: 66px;
        height: 66px;
        .vc-highlights {
          width: 67px;
          height: 66px;
          & + .vc-day-content {
            color: white !important;
          }
        }
        .vc-highlight {
          height: 100%;
          width: 100%;
          background-color: $brown;
          color: white;
        }
        .vc-day-content {
          width: 66px;
          height: 66px;
          &.vc-text-gray-400 {
            cursor: default;
            &:focus,
            &:hover {
              background-color: white;
              font-weight: 500;
            }
          }
          &:focus {
            background-color: transparent;
          }
        }
      }
    }
  }


  @media (max-width: 1000px) {
    width: 100% !important;
    .vc-grid-cell {
      .vc-header {
        height: 50px;
      }
      .vc-title {
        padding-bottom: 8px;
      }
      .vc-day {
        width: 100%;
        height: inherit;
        .vc-h-full {
          width: inherit;
          height: inherit;
          .vc-highlights {
            width: inherit;
            height: inherit;
          }
          .vc-highlight {
            height: 100%;
            width: 100%;
          }
          .vc-day-content {
            width: inherit;
            height: inherit;
          }
        }
      }
    }
  }
  @media (max-width: 640px) {
    &:before {
      display: none;
    }
  }
}
