@mixin runo-panel($primaryStyleName : v-panel) { .#{$primaryStyleName} { background: transparent url(img/top-left.png) no-repeat; } .#{$primaryStyleName}-caption .v-errorindicator { padding-right: 20px; background: transparent url(../icons/16/error.png) no-repeat bottom center; } .#{$primaryStyleName}-caption, .#{$primaryStyleName}-caption-light { font-size: 18px; line-height: normal; font-weight: normal; letter-spacing: -0.03em; color: #f14c1a; height: 18px; padding: 13px 18px 16px 8px; margin-left: 10px; background: transparent url(img/top-right.png) no-repeat right top; text-overflow: ellipsis; } .#{$primaryStyleName}-nocaption { height: 9px; margin-left: 10px; background: transparent url(img/top-right.png) no-repeat right top; } .#{$primaryStyleName}-content { border: 1px solid #babfc0; border-bottom: 1px solid #dee2e3; background-color: #fff; } .#{$primaryStyleName}-deco { height: 9px; background: transparent url(img/bottom-right.png) repeat-x right top; margin-left: 9px; } .#{$primaryStyleName}-deco:before { display: block; content: ""; width: 9px; height: 9px; margin-left: -9px; background: transparent url(img/bottom-left.png) no-repeat; } /* Light panel style */ .#{$primaryStyleName}-light, .#{$primaryStyleName}-caption-light { background: transparent; } .#{$primaryStyleName}-caption-light { border-bottom: 1px solid #babfc0; margin: 0; padding-left: 18px; } .#{$primaryStyleName}-nocaption-light { background: transparent; border: none; height: 0; margin: 0; } .#{$primaryStyleName}-content-light { border: none; background: transparent; } .#{$primaryStyleName}-deco-light { height: 0; overflow: hidden; } /* IE specific rules */ .v-ie8 & .#{$primaryStyleName}-content { border-bottom: 1px solid #babfc0; } .v-ie8 & .#{$primaryStyleName}-content-light { border-bottom: none; } .v-ie8 & .#{$primaryStyleName}-deco { height: 0; overflow: hidden; } }