0.0.217 add mobile 575px

static/css/mobile_styles.css

@@ -3,13 +3,7 @@
 
 
 @media (max-width: 1199px){ }
-
-@media (max-width: 991px){
-    .benefit_img>img{
-        display: none;
-    }
-}
-@media (max-width: 767px) {
+@media (max-width: 991px) {
 
    .wrapper_content {
         margin: 20px;
@@ -19,11 +13,22 @@
     .from_to_country>.clear_both{
         clear: unset;
     }
+    div.departure_arrival>div>input,
+    .from_address_point_txt.post_route,
+    .to_address_point_txt.post_route{
+        width: calc(100% - 20px);
+    }
+    div.from_to_place>div>select{
+        width: 100%;
+    }
 
     header{
         padding: 5px 16px;
         margin-top: unset;
     }
+    header .header-first{
+        margin-top: 10px;
+    }
 
     header .header-second {
         margin-left: unset;
@@ -460,14 +465,7 @@
     .dectop_var_f_btns_temp{
         display: none;
     }
-    .menu_buttons{
-        background: #FFFFFF;
-        height: 100vh;
-        z-index: 99;
-        top: 47px;
-        overflow: auto;
 
-    }
 
     .cut_width_f_curtain{
         position: sticky;
@@ -488,14 +486,16 @@
         position: absolute;
         width: 320px;
     }
-    .menu_buttons.right.open {
-        right: 0;
-        transition: 200ms;
-        position: fixed;
-        display: block;
-        padding-top: 10px;
-        top: 46px;
-    }
+    .menu_buttons.right.open{
+    right: 0;
+    transition: 200ms;
+    position: absolute;
+    display: block;
+    /* padding-top: 10px; */
+    width: 320px;
+    top: 0;
+    border-radius: 10px;
+}
 
     .menu_buttons.left.open{
         left: 0;
@@ -521,39 +521,7 @@
         color: #000000;
         left: 272px;
     }
-    .menu_buttons.right.open .handler_menu{
-        background: #FFFFFF;
-        color: #000000;
-        left: -39px;
-    }
-    .menu_buttons.close .handler_menu{
-        background: #FF613A;
-        color: #FFFFFF;
-    }
-    .menu_buttons.right .handler_menu{
-        transform: rotate(270deg);
-        right: -312px;
-        width: 91px;
-        height: 18px;
-        display: block;
-        position: fixed;
-        text-align: center;
-        top: 39%;
-        border-radius: 10px 10px 0 0;
-        padding: 7px 18px 7px 18px;
-    }
-    .menu_buttons.left .handler_menu{
-        transform: rotate(90deg);
-        left: -48px;
-        width: 91px;
-        height: 18px;
-        display: block;
-        position: fixed;
-        text-align: center;
-        top: 39%;
-        border-radius: 10px 10px 0 0;
-        padding: 7px 18px 7px 18px;
-    }
+
 
     .btns_f_curtain{
         width: 7px;
@@ -583,10 +551,7 @@
         display: block;
     }
 
-     .block_overlay.show{
-        display: block;
-     }
-    /*этот стиль перекрывал блок диалога в сообщения блюром*/
+
 
      .text_f_curtain{
          display: inline-block;
@@ -623,7 +588,7 @@
         left: 1px;
     }
     .info_profile{
-        width: 100%;
+        width: 60%;
         float: none;
         /*margin-left: 25px;*/
     }
@@ -735,7 +700,7 @@
 /*create_route*/
 
     select#id_type_transport{
-        width: 96%;
+        width: 100%;
         background: white;
     }
     .departure_arrival>div:first-child, .from_to_place>div:first-child, .from_to_country>div:first-child, .phone>div:first-child,
@@ -743,12 +708,10 @@
         width: unset;
         float: none;
     }
-    .js-input{
-        width: 92%;
-    }
-    input#id_phone, input#id_extra_phone{
-        width: 92%;
+    .js-input, input#id_phone, input#id_extra_phone{
+        width: calc(100% - 10px);
     }
+
     #img_msg_by_email{
         left: 81%;
     }
@@ -762,6 +725,10 @@
 
     }
 
+    .carrier-card>.clear_both{
+        clear: unset;
+    }
+
     .route_info_about{
         margin: unset;
         text-align: center;
@@ -805,6 +772,16 @@
         font-style: normal;
         font-weight: 600;
     }
+    .line_inf_about_moving>.clear_both{
+        clear: unset;
+    }
+    .phones_carrier>.clear_both{
+        clear: unset;
+    }
+    .email_carrier>.clear_both{
+        clear: unset;
+    }
+
     .from-to-city-text{
         font-size: 12px;
         font-weight: 400;
@@ -991,6 +968,68 @@
 
 /*    */
 
+}
+@media (max-width: 767px){
+     .menu_buttons{
+        background: #FFFFFF;
+        height: 100vh;
+        z-index: 99;
+        top: 47px;
+        overflow: auto;
+
+    }
+      .menu_buttons.right.open .handler_menu{
+        background: #FFFFFF;
+        color: #000000;
+        left: -39px;
+    }
+    .menu_buttons.close .handler_menu{
+        background: #FF613A;
+        color: #FFFFFF;
+    }
+    .menu_buttons.right .handler_menu{
+        transform: rotate(270deg);
+        right: -312px;
+        width: 91px;
+        height: 18px;
+        display: block;
+        position: fixed;
+        text-align: center;
+        top: 39%;
+        border-radius: 10px 10px 0 0;
+        padding: 7px 18px 7px 18px;
+    }
+    .menu_buttons.left .handler_menu{
+        transform: rotate(90deg);
+        left: -48px;
+        width: 91px;
+        height: 18px;
+        display: block;
+        position: fixed;
+        text-align: center;
+        top: 39%;
+        border-radius: 10px 10px 0 0;
+        padding: 7px 18px 7px 18px;
+    }
+    .block_overlay.show{
+        display: block;
+     }
+    /*этот стиль перекрывал блок диалога в сообщения блюром*/
+    .menu_buttons.right.open {
+        right: 0;
+        transition: 200ms;
+        position: fixed;
+        display: block;
+        padding-top: 10px;
+        top: 46px;
+    }
+    .benefit_img>img{
+        display: none;
+    }
+    .info_profile {
+    width: 100%;
+    float: none;
+    }
 }
 @media (max-width: 575px){
     .cont-el-form-search-carrier.last > select{
@@ -1007,9 +1046,7 @@
 }
 
 @media (max-width: 360px){
-    .wrapper_content {
-    margin: 20px;
-    }
+
 }