css fixed roomplanner

themes/hugo-universal-theme-master/static/css/style.bhouse.scss

@@ -2151,6 +2151,11 @@ input[type="search"]::-webkit-search-cancel-button {
       height: 1950px;
       object-fit: cover;
     }
+    @media screen and (max-width: 2057px) {
+      right: -60px;
+      top: -75px;
+      width:24vw;
+    }
     @media screen and (max-width: 1921px) {
       right: -60px;
       top: -75px;
@@ -2181,6 +2186,10 @@ input[type="search"]::-webkit-search-cancel-button {
       margin-top: -130px;
       margin-left: 130px;
     }
+    @media screen and (max-width: 2057px) {
+      width: 90%;
+      margin-top: -130px;
+    }
     @media screen and (max-width: 1921px) {
       width: 90%;
       margin-top: -130px;
@@ -2197,6 +2206,11 @@ input[type="search"]::-webkit-search-cancel-button {
       margin-top: -100px;
       margin-left: 200px;
     }
+    @media screen and (max-width: 2057px) {
+      width: 40%;
+      margin-top: -30px;
+      margin-left: 100px;
+    }
     // 1920
     @media screen and (max-width: 1921px) {
       width: 40%;
@@ -2215,7 +2229,11 @@ input[type="search"]::-webkit-search-cancel-button {
       margin-top: -50px;
       margin-left: 250px;
     }
-   
+    @media screen and (max-width: 2057px) {
+      width: 80%;
+      margin-top: -80px;
+      margin-left: 80px;
+    }
     @media screen and (max-width: 1921px) {
       width: 80%;
       margin-top: -80px;
@@ -2234,6 +2252,11 @@ input[type="search"]::-webkit-search-cancel-button {
       margin-top: -120px;
       margin-left: 120px;
     }
+    @media screen and (max-width: 2057px) {
+      width: 80%;
+      margin-top: -60px;
+      margin-left: 60px;
+    }
     @media screen and (max-width: 1921px) {
       width: 80%;
       margin-top: -50px;
@@ -2253,6 +2276,11 @@ input[type="search"]::-webkit-search-cancel-button {
       margin-top: 50px;
       margin-right: 50px;
     }
+    @media screen and (max-width: 2057px) {
+      width: 50%;
+      margin-top: -100px;
+      margin-right: 80px;
+    }
     @media screen and (max-width: 1921px) {
       width: 50%;
       margin-top: -100px;
@@ -2270,6 +2298,11 @@ input[type="search"]::-webkit-search-cancel-button {
       margin-top: -130px;
       margin-left: 120px;
     }
+    @media screen and (max-width: 2057px) {
+      width: 90%;
+      margin-top: -100px;
+      margin-left: 50px;
+    }
   
     @media screen and (max-width: 1921px) {
       width: 90%;
@@ -2292,15 +2325,21 @@ input[type="search"]::-webkit-search-cancel-button {
       margin-top: -100px;
      
     }
-    @media screen and (max-width: 1441px) {
-      margin-right: 80px;
-      margin-top: -80px;
+    @media screen and (max-width: 2057px) {
+      width: 35%;
+      margin-right: 50px;
+      margin-top: -100px;
     }
 
+
     @media screen and (max-width: 1921px) {
       margin-right: 0px;
       margin-top: -80px;
     }
+    @media screen and (max-width: 1441px) {
+      margin-right: 80px;
+      margin-top: -80px;
+    }
   }
   .meihaochengjia {
 
@@ -2311,7 +2350,12 @@ input[type="search"]::-webkit-search-cancel-button {
       right: 50px;
       top: -10px;
     }
-   
+    @media screen and (max-width: 2057px) {
+      width: 130px;
+      position: absolute;
+      right: 50px;
+      top: 10px;
+    }
     @media screen and (max-width: 1921px) {
       width: 130px;
     position: absolute;
@@ -2431,10 +2475,15 @@ input[type="search"]::-webkit-search-cancel-button {
      top:40px;
       right: 170px;
      
+    }
+    @media screen and (max-width: 2057px) {
+      bottom: 20px;
+      right: 190px;
+  
     }
     @media screen and (max-width: 1921px) {
-      bottom: -15px;
-      right: 170px;
+      bottom: 20px;
+      right: 190px;
   
     }
     @media screen and (max-width: 1441px) {
@@ -2457,10 +2506,15 @@ input[type="search"]::-webkit-search-cancel-button {
       top:50px;
       right: 40px;
      
+    }
+    @media screen and (max-width: 2057px) {
+      bottom: 10px;
+      right: 20px;
+     
     }
     @media screen and (max-width: 1921px) {
-      bottom: -15px;
-      right: 15px;
+      bottom: 10px;
+      right: 20px;
      
     }
     @media screen and (max-width: 1441px) {
@@ -2481,9 +2535,14 @@ input[type="search"]::-webkit-search-cancel-button {
     animation-timing-function: linear;
     @media screen and (min-width: 2560px) {
      top:-15px;
-      right: 15px;
+      right: 20px;
      
     }
+    @media screen and (max-width: 2057px) {
+      top: 5px;
+     right: 5px;
+    
+   }
     @media screen and (max-width: 1921px) {
        top: 5px;
       right: 5px;