html - CSS on Mobile is not working -

i have following css. reason, works until @max-width:767 media query. however, not work not work on resolution, below it, is, @425. after that, it starts working again on resolutions below it. identifying issue appreciated.

@media screen , (max-width: 767px) {        header{height:auto;} body{padding-top:90px;}     #div-header-submenu-rtl, #div-header-submenu {top:-5%; left:25%;}     .text-center-767{text-align:center; padding-top:5px;}     .search-div, .search-div-rtl{width:100%; margin-left:3px;} .search-div-rtl{padding-right:10px; margin-right:0px;}     .txt-search{width: 85%;}     .timeline-poster-name{ margin-top:auto;}     .btn-comment-submit{width:20%; font-size:10px;}     .affiliate-card-padd-3, .affiliate-card-padd-2,.affiliate-card-padd-4{ padding:15px;}     .affiliate-card-padd-3-ar, .affiliate-card-padd-2-ar,.affiliate-card-padd-4-ar{ padding:15px;}      .affiliate-frame, .select-affiliate, .affiliate-frame-store{ margin:0 auto;}      .margin-left-50-767 {margin-left:50px;}      .right-content-area {min-height:auto; padding-bottom:30px;}      .left-grey-bar{height:auto;} .left-grey-fixed-bar, .fixed-filters-rtl{position:relative;} .left-grey-fixed-bar-rtl, .fixed-filters{position:relative; left:0; }     .right-content-area, .left-content-area{min-height:auto;}      .top-links-content-tabs, .top-links-content-tabs-highlight {font-size:12px;}          .displayinlinephone{display:inline-block;}     .posting-area, .posting-area-division{height:auto;}     .comments-container-row {height:auto;}     .lnksectionheading, .sectionheading{font-size:12px;} .sectionheading{ text-align:left; padding-top:20px;}        .padd-top-40{padding-top:20px;}  .padd-top-20{padding-top:10px;} .padd-top-15{padding-top:7px;}        .sm-icon-grey-bar{width:25px; height:25px; margin-top:5px; margin:0 auto;}   /*---------------------- business product -------------------------------------- */ #div-main-pic {background-color:#000;}     /* ------------------ login page ----------------------------------------------- */      .login-headline {font-size:16px; font-weight:800;}      .body-login, .body-login-rtl{background-color:#45c458; background-image:url('../images/login-bg-bhive.jpg'); background-size:auto; background-repeat:no-repeat; background-position:top; }      .btn, .input-credentials, .txt-add-product{margin-top:15px;}     .mob-background{background-color:rgba(255,255,255,0.7);}     .footer{margin-top:5vh;}   /* ------------------ exhibitions ----------------------------------------------- */         .exhibitions-row{height:auto;}     .text-center-767{text-align:center;}      .img-exhibit-sponsor{width:173px; height:100px; margin:0 auto;}  /* ------------------ market timeline ----------------------------------------------- */          }   @media screen , (max-width: 425px) {     .top-links-content-tabs, .top-links-content-tabs-highlight {font-size:10px;}     .left-grey-fixed-bar{position:relative;} .left-grey-fixed-bar-rtl{position:relative; left:auto;}     .sm-icon-grey-bar{width:25px; height:25px; margin-top:5px; margin:0 auto;}     .font-size-12{font-size:10px;}      .font-size-14, .lnk-product-title{font-size:12px;}     .text-center-425, .text-center-425-nopadd{text-align:center; padding-top:10px;} .text-center-425-nopadd{text-align:center;}      .padding-top-15-425{padding-top:15px;}     .display-none-425 {display:none;}     #div-header-submenu-rtl, #div-header-submenu {top:15%; left:22%;}      /* ----------------------------- market timeline ----------------------------- */     .timeline-posts-text, .timeline-location-text { text-align:center;}     .lnk-like-share-comment {font-size:10px;}    .span-comment-like-share{text-align:center;}    .img-product-timeline-frame{margin-top:40px; margin:0 auto;}     .span-comment, .span-like, .span-share, .span-x{padding-left:2px; padding-right:2px; padding-top:10px; display:block; text-align:center;}      .span-like, .span-share, .span-comment, .span-x{width:100%; }    #share-update{border:1px solid #f1f1f1;     .post-button{padding:0;}       .video-thumbnail-custom{width:171px; height:114px; margin:0 auto;}      .sectionheading-no-padd-425{padding:0;}    .btn-overlay, .btn-overlay-rtl{ position:absolute; top:55%; left:58%; margin-top:0 !important;} .btn-overlay-rtl{left:55%;}  /*------------------------------------ product page -------------------------------*/      .product-header-1, .product-header-2, .product-header-3 {margin-top:30px;}      .no-wrap{white-space:nowrap;overflow:hidden;} .no-wrap > div{ float:none;  display:inline-table;}  /*----------------------------------   exhibitions  -------------------------------- */      .img-exhibit-sponsor{width:173px; height:100px; margin:0 auto;}     }   @media screen , (max-width: 375px) {      .btn-overlay, .btn-overlay-rtl{ position:absolute; top:55%; left:58%;} .btn-overlay-rtl{left:55%;} .video-thumbnail-custom{width:171px; height:114px; margin:0 auto;} .row-thumbs{ top:56%;}  /* --------------------------- business product ---------------------------------------*/ .product-header-1 {font-size:14px;}  .webkit-padd-left-40{ padding-left:15px;}   /*----------------------------------   exhibitions  -------------------------------- */ .img-exhibit-sponsor{width:173px; height:100px; margin:0 auto;}  }   @media screen , (max-width: 325px) {      .btn-overlay, .btn-overlay-rtl{ position:absolute; top:59%; left:61%;} .btn-overlay-rtl{left:22.5%;} .video-thumbnail-custom{width:171px; height:114px; margin:0 auto;}   } 

maybe it's because of missing closing bracket here:

#share-update{border:1px solid #f1f1f1; 

as tip, recommend validate css: https://jigsaw.w3.org/css-validator/ can upload css file or paste code there. way, things missing brackets or typo, won't become headache :)

let me know if helped you.