.box{float:right; padding:5px 0;}
.searchbox{
  width: 100%;
  max-width: 300px;
  margin: auto;
  vertical-align: middle;
  white-space: nowrap;
  position: relative;}
.searchbox input#search{
  width: 100%;
  height: 35px;
  border: 1px solid #444;
  font-size: 10pt;
  float:left;
  padding-left: 5px;
  padding-right:45px;
  border-radius: 17px;
  color: #444;}
.searchbox input#search::-webkit-input-placeholder {
  color: #65737e;}
.searchbox input#search:-moz-placeholder { /* Firefox 18- */
  color: #65737e;}
.searchbox input#search::-moz-placeholder {  /* Firefox 19+ */
  color: #65737e;}
.searchbox input#search:-ms-input-placeholder {
  color: #65737e;}
.searchbox .icon{
  position: absolute;
  /* top: 55%; */
  right: 17px;
  margin-top: 2px;
  z-index: 1;
  color: #4f5b66;
  -webkit-transition: all .55s ease;
  -moz-transition: all .55s ease;
  -ms-transition: all .55s ease;
  -o-transition: all .55s ease;
  transition: all .55s ease;}

/* ANIMATION EFFECTS */
.searchbox input#search:focus, .searchbox input#search:active{
  outline:none;}
.searchbox input#search:focus + .icon,
.searchbox:hover .icon{
	margin-top: 4px;
  color: #93a2ad;
  color: #f3d083;
  -webkit-transform:scale(1.5); /* Safari and Chrome */
  -moz-transform:scale(1.5); /* Firefox */
  -ms-transform:scale(1.5); /* IE 9 */
  -o-transform:scale(1.5); /* Opera */
   transform:scale(1.5);}