diff --git a/view-webapp/src/main/webapp/js/tour-registration.inc.js b/view-webapp/src/main/webapp/js/tour-registration.inc.js
index 47dbeac..7978350 100644
--- a/view-webapp/src/main/webapp/js/tour-registration.inc.js
+++ b/view-webapp/src/main/webapp/js/tour-registration.inc.js
@@ -3,7 +3,8 @@ let searchTimer = undefined;
 let resultTemplate;
 let searchResult;
 let searchHighlight;
-let manualRating;
+let manualRating = false;
+let manualRank = false;
 
 function initSearch() {
   let needle = $('#needle')[0].value.trim();
@@ -16,7 +17,7 @@ function initSearch() {
 }
 
 function searchResultShown() {
-  return !(!searchResult || !searchResult.length)
+  return !(!searchResult || searchResult.length === 0)
 }
 
 function search(needle) {
@@ -111,7 +112,7 @@ function addPlayers() {
   ['countryFilter', /* 'aga', */ 'egf', 'ffg'].forEach(id => {
     let value = store(id);
     let ctl = $(`#${id}`);
-    if (value !== null && typeof(value) !== 'undefined' && ctl.length) {
+    if (value !== null && typeof(value) !== 'undefined' && ctl.length !== 0) {
       ctl[0].checked = value;
     }
   });
@@ -287,7 +288,7 @@ onLoad(() => {
   if (searchFormState) {
     for (let id of ["countryFilter", /* "aga", */ "egf", "ffg"]) {
       let ctl = $(`#${id}`);
-      if (ctl.length) {
+      if (ctl.length !== 0) {
         ctl[0].checked = searchFormState[id];
       }
     }
@@ -384,14 +385,15 @@ onLoad(() => {
       else tr.removeClass('hidden');
     });
   });
-  manualRating = ($('#player input[name="rating"]')[0].value !== '');
+  manualRating = ($('#rating')[0].value !== '');
+  manualRank = ($('#rank')[0].value !== '');
   $('#player input[name="rating"]').on('input', e=>{
     manualRating = true;
   });
   $('#player select[name="rank"]').on('input', e=>{
     let rank = e.target.value;
     let ratingCtl = $('#player input[name="rating"]')[0];
-    if (!manualRating) {
+    if (!$('#rating')[0].value || !manualRating) {
       ratingCtl.value = 2050 + 100 * rank;
     }
   });
@@ -414,7 +416,7 @@ onLoad(() => {
   let scrollIntoView = store('scrollIntoView');
   if (scrollIntoView) {
     let row = $(`tr[data-id="${scrollIntoView}"`);
-    if (row.length) {
+    if (row.length !== 0) {
       row.addClass('highlighted');
       store.remove('scroll');
       setTimeout(()=>{
@@ -494,4 +496,15 @@ onLoad(() => {
     e.preventDefault();
     return false;
   });
+  $('#rating').on('input', e => {
+    if (!$('#rank')[0].value || !manualRank) {
+      let rank = (e.target.value - 2050) / 100;
+      console.log(rank);
+      $('#rank')[0].value = `${rank}`;
+    }
+    return true;
+  });
+  $('#rank').on('input', e => {
+    manualRank = true;
+  });
 });
diff --git a/view-webapp/src/main/webapp/tour-registration.inc.html b/view-webapp/src/main/webapp/tour-registration.inc.html
index 0cee11e..8b8a7f2 100644
--- a/view-webapp/src/main/webapp/tour-registration.inc.html
+++ b/view-webapp/src/main/webapp/tour-registration.inc.html
@@ -3,7 +3,6 @@
   #set($pmap = $utils.toMap($parts))
 #else
   #set($teams = $api.get("tour/${params.id}/team"))
-  $log.debug("@@@@@@@@@ teams = $teams")
   #set($pmap = $utils.toMap($teams))
 #end
 
@@ -99,7 +98,7 @@
     <form id="search-form" class="ui edit form">
       <div id="search-header" class="five stackable fields">
 #if($tour.country)
-        <div class="two wide field">
+        <div class="two wide centered field">
           <div class="toggle">
             <input id="countryFilter" name="countryFilter" type="checkbox" value="$tour.country"/>
             <div class="search-param checkbox">
@@ -116,7 +115,7 @@
           </div>
         </div>
 #* Disabled
-        <div class="two wide field">
+        <div class="two wide centered field">
           <div class="toggle">
             <input id="aga" name="aga" type="checkbox" value="true"/>
             <div class="search-param checkbox">
@@ -126,7 +125,7 @@
           </div>
         </div>
 *#
-        <div class="two wide field">
+        <div class="two wide centered field">
           <div class="toggle" title="${utils.ratingsDates.egf|'no egf ratings'}">
             <input id="egf" name="egf" type="checkbox" checked value="true"/>
             <div class="search-param checkbox">
@@ -135,7 +134,7 @@
             <label>EGF</label>
           </div>
         </div>
-        <div class="two wide field">
+        <div class="two wide centered field">
           <div class="toggle" title="${utils.ratingsDates.ffg|'no ffg ratings'}">
             <input id="ffg" name="ffg" type="checkbox" checked value="true"/>
             <div class="search-param checkbox">
@@ -195,12 +194,12 @@
             <div class="eight wide field">
               <label>Rating</label>
               <span class="info"></span>
-              <input name="rating" type="text" class="numeric"/>
+              <input id="rating" name="rating" type="text" class="numeric"/>
             </div>
             <div class="eight wide field">
               <label>Rank<span class="note">initialized from rating</span></label>
               <span class="info"></span>
-              <select name="rank">
+              <select id="rank" name="rank">
                 <option></option>
 #levels()
               </select>