svg.logo { &.color { opacity: 1.0; path.text { fill: $black; opacity: 1.0; } path.front { fill: #1563FF; opacity: 1.0; } path.shadow { fill: #104EB2; opacity: 1.0; } } // The default logo class is the colored version @extend .color; &.white { opacity: 1.0; path.text { fill: $white; } path.front, path.shadow { fill: $white; } path.front { opacity: 0.7; } } }