Untitled

<style>
        @import url(https://fonts.googleapis.com/css?family=Roboto:400,700,500,300,100&subset=latin,cyrillic-ext,cyrillic,latin-ext);

        .ad-section {
          font-family: 'Roboto', sans-serif;
        }

        div[id^='dynamic_'] {
            display: block !important;
        }

        .ad-section:after {
          content: "";
          display: table;
          clear: both;
        }

        .media {
          display: table;
          width: 100%;
        }

        .media-middle {
          display: table-cell;
          vertical-align: middle;
        }

        .media-top {
          display: table-cell;
          vertical-align: top;
        }

        .ad-input__wrap {
          background-color: #fff;
          border: 1px solid #a7a7a7;
          margin: 12px 0;
        }

        .ad-input__wrap.error {
          border-color: #AC1616;
        }

        .ad-textarea, .ad-input {
          display: block;
          width: 100%;
          color: #9b9b9b;
          font-size: 14px;
          padding: 5px 12px 5px;
          border: none;
          outline: none;
          box-sizing: border-box;
        }

        .ad-textarea {
          resize: none;
          height: 126px;
        }

        .ad-btn {
          display: inline-block;
          background: none;
          border: none;
          font-size: 22px;
          text-align: center;
          padding: 7px 15px 6px;
          text-decoration: none;
          color: #fff;
          -webkit-transition: .2s linear;
          transition: .2s linear;
          cursor: pointer;
          text-transform: uppercase;
        }

        .ad-btn__green {
          background-color: #009e71;
        }

        .ad-btn__green:hover {
          background-color: #00855f;
        }

        .ad-section {
          background-color: #005436;
          color: #fff;
          border-radius: 8px;
          border: 3px solid #e3e3e3;
        }

        .ad-form {
          width: 380px;
          padding: 18px 25px 20px;
          box-sizing: border-box;
          float: left;
          background-color: #006846;
          border-radius: 7px 0 0 7px;
        }

        .ad-form__text {
          font-size: 15px;
          color: #fff;
          font-weight: 300;
          line-height: 1.15;
        }

        .ad-form__send {
          width: 230px;
          margin-top: 14px;
        }

        .ad-code__text {
          font-size: 14px;
          margin-bottom: 6px;
        }

        .ad-code__l {
          width: 120px;
        }

        .ad-code__captcha {
          height: 50px;
        }

        .ad-code__captcha img {
          width: 100%;
          height: 100%;
          display: block;
        }

        .ad-code__input {
          margin: 0;
        }

        .ad-code__reload {
          color: #79d8b9;
          font-size: 12px;
          display: inline-block;
          margin-top: 11px;
        }

        .ad-code__reload:hover {
          text-decoration: none;
        }

        .ad-code__r {
          padding-left: 10px;
        }

        .ad-right {
          text-align: center;
          padding-bottom: 25px;
        }

        .ad-logo {
          display: inline-block;
          text-decoration: none;
          margin: 30px 0;
        }

        .ad-skype {
          font-size: 21px;
          display: inline-block;
          color: #fff;
          text-decoration: none;
          margin: 7px 0;
        }

        .ad-skype:hover {
          text-decoration: underline;
        }

        .ad-skype img {
          vertical-align: middle;
          margin-right: 8px;
        }

        .ad-thanks {
          display: none;
          font-size: 22px;
          text-align: center;
          margin: 40px 20px 0;
          color: #fff;
          line-height: 1.4;
        }
    </style>

</head>
<body>
    <section class="ad-section">
        <form action="https://adbetnet.com/advertise" class="ad-form">
            <p class="ad-form__text">По вопросам размещения рекламы на сайте обращайтесь по указным контактам или заполните форму обратной связи:</p>

            <div class="ad-input__wrap">
                <input type="text" class="ad-input" placeholder="Введите ваше имя*" name="name">
            </div>

            <div class="ad-input__wrap">
                <input type="text" class="ad-input" placeholder="Укажите ваш мейл*" name="email">
            </div>

            <div class="ad-input__wrap error">
                <input type="text" class="ad-input" placeholder="Тема*" name="subject">
            </div>

            <div class="ad-input__wrap">
                <textarea class="ad-textarea" name="textarea"></textarea>
            </div>
            <button class="ad-btn ad-btn__green ad-form__send">Отправить</button>

        </form>

        <div class="ad-right">
            <div class="ad-right__item">
                <a href="https://adbetnet.com/" class="ad-logo"><img src="https://cdn.advertserve.com/images/adbetnet.advertserve.com/servlet/files/38539#feedback/logo.png" alt=""></a>
            </div>
            <div class="ad-right__item">
                <a href="skype:adbetnet?call" class="ad-skype"><img src="https://cdn.advertserve.com/images/adbetnet.advertserve.com/servlet/files/38540#feedback/skype.png" alt=""> adbetnet</a>
            </div>

            <div class="ad-thanks">Ваше сообщение отправлено. <br>Спасибо!</div>
        </div>


    </section>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>

  <script>
        var $thanks = $('.ad-thanks');

   $('.ad-form').on('submit', function (e) {
     e.preventDefault();

     var $this = $(this),
       formValues = getValues($this),
         action = $this.attr('action'),
         $inputs = $this.find('.ad-input__wrap'),
         sendActive = true;

     $inputs.removeClass('error');

     $inputs.each(function() {
      var $this = $(this),
        $input = $this.find('input'),
        inputValue = $input.val();

      if (inputValue === null || inputValue == '') {
       $this.addClass('error');
       sendActive = false;
      }
     });

     if (sendActive) createPost(action, $inputs, $this);

   });


   function createPost(act, val, $form) {
     $.ajax({
      url: act,
      jsonp: "callback",

      dataType: "jsonp",

      data: val,

      success: function( obj ) {
        var parseObj = obj;

        if (!parseObj.result) {
          var errors = parseObj.errors;
          for (var key in errors) {
            $form.find('.ad-input[name=' + key + ']').parent().addClass('error');
          }
        } else {
          $thanks.fadeIn();
          $form.hide();
        }
      }
   }).fail(function (jqXHR, textStatus, errorThrown) {
       console.log(textStatus + " | " + errorThrown);
     });
   }

   function getValues(form) {
     return form.serialize();
   };
  </script>