SCSS样式未按预期应用

<div class="btn-group">
    <button class="btn btn-default dropdown-toggle option-dropdown" data-toggle="dropdown">@Model.SelectedOption <span style="border-right:2px solid #68D0ED;margin-right:8px; margin-left:5px"></span><span class="caret"></span></button>
    <ul class="dropdown-menu" role="menu">
        @foreach (var option in Model.Options)
        {
            <li><a class="option" href='@string.Format("/controller?option={0}", option )'>@option</a></li>
        }
    </ul>
</div>

我尝试根据类名应用以下样式 option-dropdown 和 option . 当使用内联css样式时,我的样式按预期应用,但是当我将这些样式移动到 .scss 文件中,样式不再适用。我不确定我会错在哪里,因为我对sass有些陌生。我的理解(这显然是错误的)是,我仍然可以像在css中一样从类名中选择样式。感谢所有的帮助。我的sass文件如下:

.option {
    color: #68D0ED;
    background-color: #FFFFFF;
}

.option-dropdown {
    border: 2px solid #68D0ED;
    color: #68D0ED;
}