Merhaba

aşağıdaki bir arama kutucugu var. Bunu sayfanın tam ortasına almak istiyorum.Yardımcı olabilecek var mı direk aşağıdaki kod üstünde

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.1/css/all.css" integrity="sha384-5sAR7xN1Nv6T6+dT2mhtzEpVJvfS3NScPQTrOxhwjIuvcA67KV2R5Jz6kr4abQsz" crossorigin="anonymous">
<form action="https://www.google.com.tr/search" method="GET" target="_blank" id="kd-google-search-cust-log" class="kutuda">
   <div id="box">
       <input type="text" name="q" id="search" placeholder="Google'de arama yapın">
       <i class="fa fa-search"></i>
   </div>
</form>

<style>



#box {

    max-width: 300px;
    position: relative;
    
}
 
#box .fa-search {
    position: absolute;
    top: 14px;
    left: 12px;
    font-size: 20px;
    color:cornflowerblue;
    
}
 
#search {



    width: 250px;
    box-sizing: border-box;
    border: 2px solid cornflowerblue;
    border-radius: 4px;
    font-size:18px;
    padding: 12px 20px 12px 40px;
    -moz-transition: width 0.4s ease-in-out;
    -o-transition: width 0.4s ease-in-out;
    -webkit-transition: width 0.4s ease-in-out;
    transition: width 0.4s ease-in-out;
}
 
#search:focus {
    width: 100%;
}
</style>