Can I override bootstrap's defaults in a single css selector?

Can I override bootstrap's defaults in a single css selector?

I want to get rid of outlines in Firefox, however they're pointed more
deeply than my style.css in bootstrap3.css so I need to update them all.
I've tried the following:
<link href="{{ URL::to('home_assets/css/bootstrap.min.css') }}"
rel="stylesheet" media="screen">
<link href="{{ URL::to('home_assets/css/style.css') }}" rel="stylesheet"
media="screen">
Example below didn't work because Bootstrap 3 points more deeply.
//bootstrap
a.carousel-control
{
outline: thin dotted;
}
//my css
body {
outline: none !important;
}
Result: a.carousel-control has thin dotted outline.
I need to do something like to remote outline. (and it works)
a.carousel-control
{
outline: none;
}
The problem is, then I need to point everything in markup deeply so it
overrides bootstrap. I need to encapsulate most of Bootstrap's css.
Is there a functionality like this in CSS, so I can manage them from a
single place?
body {
outline: none !override-previous; //pseudo
}
Any hacks or tricks to manage them in a single place? (no javascript, css
expressions are okay though)
Ps. I need this for my dev environment because I keep outlines as default
on production to help blind users. They're annoying for me, though.