.overlay {
  background-color: rgba(13, 68, 84, 0.8);
  position: absolute;
  height: 100%;
  width: 100%;
  right: 0;
  top: 0;
  display: none;
  z-index: 9000; }
  .overlay .inner {
    width: 429px;
    height: 512px;
    margin: 100px auto 0 auto;
    background-color: #87b564;
    position: relative; }
    .overlay .inner .quit {
      background: url(../images/sprite-close.png) top center no-repeat;
      height: 25px;
      width: 30px;
      position: absolute;
      top: 0;
      right: 0;
      margin: 10px;
      display: block; }
      .overlay .inner .quit:hover {
        background-position: bottom center; }
  .overlay .modal-content-wrapper {
    background: url(../images/tcamp-modal-robot-graphic.png) top center no-repeat;
    display: block;
    width: 396px;
    height: 592px;
    position: absolute;
    top: -33px;
    left: 17px; }
  .overlay .modal-content {
    -ms-transform: rotate(-4.8deg);
    /* IE 9 */
    -webkit-transform: rotate(-4.8deg);
    /* Chrome, Safari, Opera */
    transform: rotate(-4.8deg);
    font-family: "museo-slab", Rockwell, "Dejavu Serif", "Lucida Bright", "Trebuchet MS", sans-serif;
    margin: 162px auto;
    width: 358px;
    padding: 41px;
    box-sizing: border-box;
    text-transform: uppercase;
    text-align: center; }
    .overlay .modal-content .logo {
      margin: -13px auto 25px auto;
      width: 180px;
      max-width: 235px;
      height: 48px; }
  .overlay .modal-arrow {
    background: url(../images/modal-arrow.png) center top no-repeat;
    width: 300px;
    height: 30px;
    margin-left: -6px;
    display: block;
    height: 44px;
    color: #3eaec1;
    text-align: center;
    margin-bottom: -13px; }
  .overlay .modal-coming {
    background: #ffffff;
    padding: 0 4px; }
  .overlay .modal-date, .overlay .modal-location {
    color: #006693;
    font-weight: bold;
    text-align: center;
    display: block;
    line-height: .9; }
  .overlay .modal-date {
    font-size: 32px; }
  .overlay .modal-location {
    font-size: 28px; }
  .overlay .call-to-action {
    color: #3eaec1;
    font-size: 19px;
    background: url(../images/modal-envelope.png) left center no-repeat;
    text-align: right;
    margin-top: 25px; }
  .overlay input[type="email"] {
    width: 100%;
    border-radius: 0;
    border: 0;
    background: #bed6c8;
    height: 50px;
    box-sizing: border-box;
    -webkit-box-shadow: none;
    box-shadow: none;
    margin-bottom: 4px; }
  .overlay ::-webkit-input-placeholder {
    /* WebKit browsers */
    color: #87b564;
    font-style: italic; }
  .overlay :-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    color: #87b564;
    opacity: 1;
    font-style: italic; }
  .overlay ::-moz-placeholder {
    /* Mozilla Firefox 19+ */
    color: #87b564;
    opacity: 1;
    font-style: italic; }
  .overlay :-ms-input-placeholder {
    /* Internet Explorer 10+ */
    color: #87b564;
    font-style: italic; }
  .overlay input[type="submit"] {
    width: 100%;
    border: 0;
    background-color: #ded114;
    height: 50px;
    box-sizing: border-box;
    font-family: "museo-slab", Rockwell, "Dejavu Serif", "Lucida Bright", "Trebuchet MS", sans-serif;
    color: #ffffff;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 19px; }
  .overlay input[type="submit"]:hover {
    background-color: #c2ad04; }
  .overlay input:focus:invalid:focus {
    -webkit-box-shadow: 0 0 6px #f5b890;
    -moz-box-shadow: 0 0 6px #f5b890;
    box-shadow: 0 0 6px #f5b890; }
  .overlay input:focus:invalid {
    color: #ce6928; }