custum.scssが適用されない

id:"logo"にcssを適用させたいです。しかし、読み込みがうまくできません。

headerhtmlerb
1 <%= link_to "LiveStreet", root_path , id: "logo" %>

applicationcss
1 <head>
2    <title>Live</title>
3    <%= csrf_meta_tags %>
4    <%= csp_meta_tag %>
5
6    <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload' %>
7    <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
8    <%# toastr file...%>
9    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
10    <script type="text/javascript" src="https://code.jquery.com/ui/1.12.0/jquery-ui.min.js"></script>
11    <link href="//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/css/toastr.min.css" rel="stylesheet" />
12    <script src="//cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/js/toastr.min.js"></script>
13    <%# leafret file...%>
14     <link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.1/dist/leaflet.css" integrity="sha512Rksm5RenBEKSKFjgI3a41vrjkw4EVPlJ3+OiI65vTjIdo9brlAacEuKOiQ5OFh7cOI1bkDwLqdLw3Zg0cRJAAQ==" crossorigin=""/>
15     <script src="https://unpkg.com/leaflet@1.3.1/dist/leaflet.js" integrity="sha512-/Nsx9X4HebavoBvEBuyp3I7od5tA0UzAxs+j83KgC8PU0kgB4XiK4Lfe4y4cgBtaRJQEIFCW+oC506aPT2L1zw==" crossorigin=""></script>
16     <%#taginput%>
17     <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script>
18     <link rel="stylesheets" type="text/css" href="jquery.tagsinput.css" />
19     </head>

customscss
1
2#logo {
3    float: left;
4    margin-right: 10px;
5    font-size: 1.7em;
6    color: #fff;
7    text-transform: uppercase;
8    letter-spacing: -1px;
9    padding-top: 9px;
10    font-weight: bold;
11  }
12  
13#logo:hover {
14    color: #fff;
15    text-decoration: none;
16  }
17