Problem with resizing in Bootstrap

I have the following problem I'm using bootstrap in version 3 I need my page to be the same as this template: butwhenIredimensionmyimageslooklikethis:

Iwouldliketheblackimagetobebelowtheimageofthewineglass,butitwilltake100%ofboththetopandbottomwidthstorealizethatwhenIredimensiontheybecomecrookedanddonotfollowthepatternIwanttofollowmycodes:

HTML:

<divclass="row container-fluid text-center general">
       <div class=" col-sm-5 col-sm-offset-1 banner-wine">
          <img src="images/taca.png" alt="novidades de vinhos pedro carvalho" />
       </div>
       <div class=" col-sm-6 bg-cadastro">
         <img src="images/novidades.png">
         <h3>eventos,degustações e promoções</h3>
         <p>Receba convites para eventos,degustações e informações sobre 
         tudo o que acontece na terra a terra e no mundo do vinho</p>
         <form>
            <input type="text" id="email" name="email" placeholder="e-mail">
            <button>cadastrar</button>
          </form>
       </div>
     </div>

CSS: .banner-wine {     max-width: 100%; }

.bg-cadastro{
    background-color: @colorButtonDark;
    width: 549px;
    max-width: 100%;
    height: 407px;
    max-height: 480px;
    padding-top: 80px;
    h3{
        color: @colorHovers;
        .fontInfos(1em);
    }p{
        width: 300px;
        max-width: 80%;
        margin: 0 auto;
        color: @colorLinks;
    }
}

    form {
        border: 1px solid @colorLinks;
        padding: 15px;
        margin: 40px auto;
        width: 390px;
        max-width: 100%;
        #email{
            border: none;
            outline: none;
            margin-right: 50px;
            background-color: transparent;
        }button{
            background-color: transparent;
            border: none;
            outline: none;
            color: @colorLinks;
            .fonts(1em);
            text-transform: uppercase;
        }:before{
            content: '|';
            padding-right: 30px;
        }::-webkit-input-placeholder {
           color: @colorLinks;
           text-transform: uppercase;
        }:-moz-placeholder {
           color: @colorLinks;  
           text-transform: uppercase;
        }
    }

NOTE: remembering that I am also using less