شرح تركيب صندوق بحث منزلق مطور لقوالب البلوجر

#search {}
 #search input[type="text"] {
    background: url(https://3.top4top.net/p_14241h6171.png) no-repeat 13px 9px #2368a1;
    border: 0 none;
    font:  14px 'Cairo', sans-serif!important;
    width: 0px;
    padding: 11px 15px 6px 35px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 2px;
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
    -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
    -webkit-transition: all 0.7s ease 0s;
    -moz-transition: all 0.7s ease 0s;
    -o-transition: all 0.7s ease 0s;
    transition: all 0.7s ease 0s;
    }
#search input[type="text"]:focus {width: 250px;}
#search input { border: 0!important;color: #eeeeee!important;float: left!important;margin: 0px 0px 0px -88px;}

يوضع هذا الكود بالمكان المناسب