Confine the css with the elements inside the rbox.
For example:
.nextLightBox, .prevLightBox, .closeLightBox {
color: #777;
}
Should ideally apply this only to elements in the scope for rbox
.container .nextLightBox,
.container .prevLightBox,
.container .closeLightBox {
color: #777;
}
So if by chance anyboy has a selector by this name on his page it will not be affected.
Also applying css of global selectors is not needed.
For example:
{
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
Anybody who uses this plugin will get box-sizing: border-box; with knowing about it also.
Not sure why we want to change the color of body element also
body {
color: #222;
}
Confine the css with the elements inside the rbox.
For example: .nextLightBox, .prevLightBox, .closeLightBox { color: #777; } Should ideally apply this only to elements in the scope for rbox .container .nextLightBox, .container .prevLightBox, .container .closeLightBox { color: #777; } So if by chance anyboy has a selector by this name on his page it will not be affected.
Also applying css of global selectors is not needed. For example:
Not sure why we want to change the color of body element also body { color: #222; }