i want apply different width in option menu but it's take first :     i want to apply  different width in different option menu but when page load my js is run and take default 25% width in all page option menu i need 25% width in header file and header include in all file so header first js is run and page option menu take also 25% width so what i do for assign different width in header and also page 
    he my js and css is given and i try to apply inline css it's not working and also make different class and different js but its also not working because first run header js and it's width 25% so what i do for solve this issue. pls help me.

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->
    this one is my js file
    ! function(t) {
        var e = t('<div class="stb-select-container"><span class="selected"></span></div>'),
            n = t('<ul class="stb-select" style="display:none;"></ul>');
        t.fn.stbDropdown = function() {
            var i = t(this);
            i.hide(), i.each(function(i, a) {
                var o = e.clone(),
                    s = n.clone(),
                    r = t(a),
                    c = r.find("option");
                r.after(o), r.appendTo(o), s.appendTo(o), c.each(function(e, n) {
                    var i = t(n),
                        a = t("<li></li>"),
                        o = i.prop("attributes");
                    a.prop("attributes", o), t.each(o, function(t, e) {
                        a.attr(e.name, e.value)
                    }), a.append(i.text()), s.append(a)
                });
                var l, p = r.children("option").filter(function(e, n) {
                    return t(n).is("[selected]")
                });
                l = 0 == p.length ? c.first() : p.first(), o.find(".selected").text(l.text()), o.on("click.stb.select", function() {
                    var e = t(this),
                        n = t.grep(t(".stb-select-container"), function(n) {
                            return !e.is(t(n))
                        });
                    t(n).find("ul").hide(), e.find("ul").toggle()
                }), o.on("click.stb.option", "li", function(e) {
                    e.stopPropagation();
                    var n = t(this),
                        i = n.parents(".stb-select-container"),
                        a = i.find("span.selected");
                    a.text(n.text()), n.parents("ul").toggle();
                    var o = i.find("select");
                    o.val(n.attr("value")).change(), n.siblings().removeAttr("selected"), n.attr("selected", "selected")
                }), r.on("DOMNodeInserted", function(e) {
                    var n = t(e.target);
                    if (n.is("option")) {
                        var i = t("<li></li>"),
                            a = n.prop("attributes");
                        i.prop("attributes", a), t.each(a, function(t, e) {
                            i.attr(e.name, e.value)
                        }), i.append(n.text()), s.append(i)
                    }
                }), r.on("DOMNodeRemoved", function(e) {
                    var n = t(e.target);
                    n.is("option") && s.find("li:contains('" + n.text() + "')").remove()
                })
            })
        }
    }(jQuery);

<!-- language: lang-css -->

    .stb-select-container {
        font-family: inherit;
        /*border-radius: 4px;*/
        width: 25%;
        /*width: 100%;*/
        display: inline-block;
        outline: 0;
        box-shadow: none;
        border-right: 1px solid #ccc;
        /*border: solid thin rgba(0, 0, 0, 0.24);*/
        padding: 14px 16px;
       /* margin: 4px 8px;*/
        outline: 0;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        position: relative;
        text-align: left;
        cursor: pointer
    }
    .stb-select-container ul {
        list-style-type: none;
        margin: 0;
        padding: 0
    }
    .stb-select-container select {
        display: none
    }
    .stb-select-container .stb-select {
        position: absolute;
        background: white;
        left: -1px;
        top: 50px;
        padding: 8px 16px;
        border: solid thin rgba(0, 0, 0, 0.24);
        border-top: 0;
        z-index: 10;
        max-height: 200px;
        width: 100%;
        overflow-x: auto;
        -webkit-border-bottom-left-radius: 4px;
        -moz-border-bottom-left-radius: 4px;
        border-bottom-left-radius: 4px;
        -webkit-border-bottom-right-radius: 4px;
        -moz-border-bottom-right-radius: 4px;
        border-bottom-right-radius: 4px
    }
    .stb-select-container span {
        opacity: .54
    }
    .stb-select-container::after {
        opacity: .54;
        content: "v";
        position: absolute;
        right: 8px;
        -ms-transform: scaleY(0.5);
        -webkit-transform: scaleY(0.5);
        transform: scaleY(0.5)
    }
    .stb-select-container .stb-select li {
        opacity: .7
    }
    .stb-select-container .stb-select li:first-of-type {
       /* opacity: .34*/
    }
    .stb-select-container .stb-select li+li {
        margin-top: 10px
    }

    .stb-select-container .stb-select li:hover{
          color:#3EA9D8;
    }


    @media screen and (max-width: 768px) {

    .stb-select-container {
        font-family: inherit;
        font-size: 16px;
        /*border-radius: 4px;*/
        width: 100%;
        display: inline-block;
        outline: 0;
        box-shadow: none;
          border: 2px solid #e9e9e9;
        /*border: solid thin rgba(0, 0, 0, 0.24);*/
        padding: 12px 12px;
       /* margin: 4px 8px;*/
        outline: 0;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        position: relative;
        text-align: left;
        cursor: pointer
    }


    }














    this one is my html code




<!-- language: lang-html -->

    <select name="city" id="city_result" style="height: 50px; width:100%; margin: 0px; padding: 10px; box-shadow: 0px 0px 0px white; border: none;">
    						<option>Your city</option>
    						</select>

<!-- end snippet -->

