скрыть блоки CSS

@import url('https://fonts.googleapis.com/css?family=Roboto'); 
body{ 
    background-color: black; 
} 
.iphone{ 
  margin: 0 auto; 
  width: 250px; 
  height: 500px; 
  border-radius: 30px; 
  background-color: #E9EAE4; 
} 
 
.camera{ 
  width: 15px; 
  height: 15px; 
  background-color: red; 
  position: absolute; 
  margin-left: 120px; 
  margin-top: 10px; 
  border-radius: 50px; 
  background-color: #C5C3BA; 
} 
  .glass{ 
    height: 7px; 
    width: 7px; 
    margin: 4px; 
    position: absolute; 
    border-radius: 20px; 
    background-color: #ABA99F; 
} 
.speaker{ 
  background-color: #C5C3BA; 
  width: 60px; 
  height: 15px; 
  position: absolute; 
  margin-top: 35px; 
  margin-left: 95px; 
  border-radius: 30px; 
} 
  .pre-speaker{ 
  width: 50px; 
  height: 8px; 
  background-color: #ABA99F; 
  position: absolute; 
  border-radius: 30px; 
  margin-top: 4px; 
  margin-left: 5px; 
} 
.display{ 
  background-color: darkgray; 
  width: 210px; 
  height: 380px; 
  margin-left: 20px; 
  margin-top: 60px; 
  position: absolute; 
  border: 2px solid #ADABA1; 
} 
.display img{ 
  margin-top: 112px; 
} 
.button{ 
  background-color: #C5C3BA; 
  width: 50px; 
  height: 50px; 
  position: absolute; 
  margin-top: 445px; 
  margin-left: 100px; 
  border-radius: 100px; 
} 
  .snap{ 
    position: absolute; 
    background-color: #E9EAE4; 
    border-radius: 8px; 
    width: 25px; 
    height: 25px; 
    margin-top: 13px; 
    margin-left: 13px; 
} 
.onoff{ 
  background-color: #D9D7D0; 
  width: 40px; 
  height: 5px; 
  margin-left: 170px; 
  margin-top: -5px; 
  position: absolute; 
  border-radius: 6px 6px 0px 0px; 
} 
.rocker{ 
  border-radius: 3px 0px 0px 3px; 
  width: 5px; 
  height: 25px; 
  position: absolute; 
  margin-top: 70px; 
  margin-left: -5px; 
  background-color: #D9D7D0; 
} 
  .two{ 
  margin-top: 110px; 
} 
  .three{ 
    margin-top: 150px; 
} 
 
.unlocker{ 
  position: relative; /* Что бы текст не вылезал */ 
  margin: 0; 
  background-image: url(http://2obl.ru/upload/2obl/information_system_19/3/7/2/item_3728/information_items_3728.jpg); 
  opacity: 1; 
  width: 211px; 
  height: 380px; 
  transition: 1s; 
  overflow: hidden; /* Что бы текст не вылезал */ 
} 
.time{ 
  position: absolute; 
  font-family: 'Roboto', sans-serif; 
  margin-left: 90px; 
  font-size: 60px; 
  color: white; 
} 
 
.date{ 
  position: absolute; 
  margin-top: 130px; 
  margin-left: 60px; 
  font-family: 'Roboto', sans-serif; 
  color: white; 
} 
 
#search{ 
  margin-top: 30px; 
  position: absolute; 
  margin-left: 5px; 
  text-align: center; 
  border-radius: 10px; 
  border: 1px solid white; 
  width: 200px; 
} 
 
.batary{ 
  position: absolute; 
  width: 210px; 
  height: 15px; 
} 
 
.MTS{ 
  position: absolute; 
  width: 10px; 
  height: 10px; 
  background-color: gray; 
  border-radius: 10px; 
  border: 1px solid white; 
} 
 
.one1{ 
  margin-left: 12px; 
} 
 
.two2{ 
  margin-left: 25px; 
} 
.three3{ 
  margin-left: 37px; 
  background-color: darkgray; 
} 
.four4{ 
  margin-left: 49px; 
  background-color: darkgray; 
} 
.five5{ 
  margin-left: 61px; 
  background-color: darkgray; 
} 
.text_mts{ 
  font-family: 'Roboto', sans-serif; 
  color: white; 
  font-size: 12px; 
  margin-left: 80px; 
} 
.display:hover .unlocker{ 
  height: 0; 
}

<div class="body_two"> 
<div class="iphone"> 
  <div class="onoff"></div> 
  <div class="rocker"></div> 
  <div class="rocker two"></div> 
  <div class="rocker three"></div> 
  <div class="camera"> 
    <div class="glass"></div> 
  </div> 
  <div class="speaker"> 
    <div class="pre-speaker"></div> 
  </div> 
  <div class="display"> 
    <div class="batary"> 
      <div class="online"> 
       <div class="MTS one1"></div> 
       <div class="MTS two2"></div> 
       <div class="MTS three3"></div> 
       <div class="MTS four4"></div> 
       <div class="MTS five5"></div> 
       <div class="MTS six6"></div> 
       <div class="text_mts">MTS</div> 
      </div> 
    </div> 
    <div class="unlocker" id='unlock'> 
      <input type="text" name="" placeholder="Search" id="search" /> 
      <p class="time">4:20</p> 
      <p class="date">Sunday, 11 february</p> 
    </div> 
  </div> 
  <div class="button"> 
    <div class="snap"></div> 
  </div> 
</div> 
</div>