.header {
    width: 230px;
    height: 163px;
    overflow: hidden;
    position: fixed;
    top: 6%;
    left: 10%;
    
  background: url(../images/logo.png) no-repeat;
 background-size: 100%;

    -webkit-transition: height 0.3s;
    -moz-transition: height 0.3s;
    -ms-transition: height 0.3s;
    -o-transition: height 0.3s;
    transition: height 0.3s;
}

.header.smaller {
    background: url(../images/logo2.png) no-repeat;
 background-size: 100%;
 height: 50px;
 width:71px;
 top: 1%;
    left: 15%;
}

@media all and (max-width: 660px) {
   
    .header{
          background: url(../images/logo2.png) no-repeat;
 background-size: 100%;
 height: 50px;
 width:71px;
 top: 1%;
    left: 15%;

    }
        .header.smaller {
            display :none ;
        }
    
}