liser/build/liser.box-shadow.css

functional css help to optimizing design work and building responsive websites

.shadow-t-0 { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .05 ); }
.shadow-t-0s { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .05 ); }
.shadow-t-1 { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .05 ); }
.shadow-t-1s { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .05 ); }
.shadow-t-2 { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .05 ); }
.shadow-t-2s { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .05 ); }
.shadow-l-0 { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .075 ); }
.shadow-l-0s { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .075 ); }
.shadow-l-1 { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .075 ); }
.shadow-l-1s { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .075 ); }
.shadow-l-2 { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .075 ); }
.shadow-l-2s { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .075 ); }
.shadow-r-0 { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .1 ); }
.shadow-r-0s { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .1 ); }
.shadow-r-1 { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .1 ); }
.shadow-r-1s { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .1 ); }
.shadow-r-2 { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .1 ); }
.shadow-r-2s { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .1 ); }
.shadow-m-0 { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .15 ); }
.shadow-m-0s { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .15 ); }
.shadow-m-1 { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .15 ); }
.shadow-m-1s { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .15 ); }
.shadow-m-2 { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .15 ); }
.shadow-m-2s { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .15 ); }
.shadow-b-0 { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .2 ); }
.shadow-b-0s { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .2 ); }
.shadow-b-1 { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .2 ); }
.shadow-b-1s { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .2 ); }
.shadow-b-2 { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .2 ); }
.shadow-b-2s { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .2 ); }
@media screen and (min-width: 30em) {
 .shadow-t-0-ns { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .05 ); }
 .shadow-t-0s-ns { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .05 ); }
 .shadow-t-1-ns { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .05 ); }
 .shadow-t-1s-ns { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .05 ); }
 .shadow-t-2-ns { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .05 ); }
 .shadow-t-2s-ns { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .05 ); }
 .shadow-l-0-ns { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .075 ); }
 .shadow-l-0s-ns { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .075 ); }
 .shadow-l-1-ns { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .075 ); }
 .shadow-l-1s-ns { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .075 ); }
 .shadow-l-2-ns { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .075 ); }
 .shadow-l-2s-ns { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .075 ); }
 .shadow-r-0-ns { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .1 ); }
 .shadow-r-0s-ns { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .1 ); }
 .shadow-r-1-ns { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .1 ); }
 .shadow-r-1s-ns { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .1 ); }
 .shadow-r-2-ns { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .1 ); }
 .shadow-r-2s-ns { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .1 ); }
 .shadow-m-0-ns { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .15 ); }
 .shadow-m-0s-ns { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .15 ); }
 .shadow-m-1-ns { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .15 ); }
 .shadow-m-1s-ns { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .15 ); }
 .shadow-m-2-ns { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .15 ); }
 .shadow-m-2s-ns { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .15 ); }
 .shadow-b-0-ns { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .2 ); }
 .shadow-b-0s-ns { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .2 ); }
 .shadow-b-1-ns { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .2 ); }
 .shadow-b-1s-ns { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .2 ); }
 .shadow-b-2-ns { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .2 ); }
 .shadow-b-2s-ns { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .2 ); }
}
@media screen and (min-width: 30em) and (max-width: 60em) {
 .shadow-t-0-m { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .05 ); }
 .shadow-t-0s-m { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .05 ); }
 .shadow-t-1-m { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .05 ); }
 .shadow-t-1s-m { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .05 ); }
 .shadow-t-2-m { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .05 ); }
 .shadow-t-2s-m { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .05 ); }
 .shadow-l-0-m { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .075 ); }
 .shadow-l-0s-m { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .075 ); }
 .shadow-l-1-m { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .075 ); }
 .shadow-l-1s-m { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .075 ); }
 .shadow-l-2-m { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .075 ); }
 .shadow-l-2s-m { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .075 ); }
 .shadow-r-0-m { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .1 ); }
 .shadow-r-0s-m { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .1 ); }
 .shadow-r-1-m { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .1 ); }
 .shadow-r-1s-m { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .1 ); }
 .shadow-r-2-m { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .1 ); }
 .shadow-r-2s-m { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .1 ); }
 .shadow-m-0-m { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .15 ); }
 .shadow-m-0s-m { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .15 ); }
 .shadow-m-1-m { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .15 ); }
 .shadow-m-1s-m { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .15 ); }
 .shadow-m-2-m { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .15 ); }
 .shadow-m-2s-m { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .15 ); }
 .shadow-b-0-m { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .2 ); }
 .shadow-b-0s-m { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .2 ); }
 .shadow-b-1-m { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .2 ); }
 .shadow-b-1s-m { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .2 ); }
 .shadow-b-2-m { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .2 ); }
 .shadow-b-2s-m { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .2 ); }
}
@media screen and (max-width: 60em) and (orientation: landscape) {
 .shadow-t-0-ml { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .05 ); }
 .shadow-t-0s-ml { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .05 ); }
 .shadow-t-1-ml { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .05 ); }
 .shadow-t-1s-ml { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .05 ); }
 .shadow-t-2-ml { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .05 ); }
 .shadow-t-2s-ml { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .05 ); }
 .shadow-l-0-ml { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .075 ); }
 .shadow-l-0s-ml { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .075 ); }
 .shadow-l-1-ml { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .075 ); }
 .shadow-l-1s-ml { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .075 ); }
 .shadow-l-2-ml { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .075 ); }
 .shadow-l-2s-ml { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .075 ); }
 .shadow-r-0-ml { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .1 ); }
 .shadow-r-0s-ml { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .1 ); }
 .shadow-r-1-ml { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .1 ); }
 .shadow-r-1s-ml { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .1 ); }
 .shadow-r-2-ml { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .1 ); }
 .shadow-r-2s-ml { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .1 ); }
 .shadow-m-0-ml { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .15 ); }
 .shadow-m-0s-ml { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .15 ); }
 .shadow-m-1-ml { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .15 ); }
 .shadow-m-1s-ml { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .15 ); }
 .shadow-m-2-ml { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .15 ); }
 .shadow-m-2s-ml { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .15 ); }
 .shadow-b-0-ml { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .2 ); }
 .shadow-b-0s-ml { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .2 ); }
 .shadow-b-1-ml { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .2 ); }
 .shadow-b-1s-ml { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .2 ); }
 .shadow-b-2-ml { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .2 ); }
 .shadow-b-2s-ml { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .2 ); }
}
@media screen and (min-width: 60em) {
 .shadow-t-0-l { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .05 ); }
 .shadow-t-0s-l { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .05 ); }
 .shadow-t-1-l { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .05 ); }
 .shadow-t-1s-l { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .05 ); }
 .shadow-t-2-l { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .05 ); }
 .shadow-t-2s-l { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .05 ); }
 .shadow-l-0-l { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .075 ); }
 .shadow-l-0s-l { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .075 ); }
 .shadow-l-1-l { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .075 ); }
 .shadow-l-1s-l { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .075 ); }
 .shadow-l-2-l { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .075 ); }
 .shadow-l-2s-l { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .075 ); }
 .shadow-r-0-l { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .1 ); }
 .shadow-r-0s-l { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .1 ); }
 .shadow-r-1-l { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .1 ); }
 .shadow-r-1s-l { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .1 ); }
 .shadow-r-2-l { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .1 ); }
 .shadow-r-2s-l { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .1 ); }
 .shadow-m-0-l { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .15 ); }
 .shadow-m-0s-l { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .15 ); }
 .shadow-m-1-l { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .15 ); }
 .shadow-m-1s-l { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .15 ); }
 .shadow-m-2-l { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .15 ); }
 .shadow-m-2s-l { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .15 ); }
 .shadow-b-0-l { box-shadow: 0 0 10px 0 rgba( 0, 0, 0, .2 ); }
 .shadow-b-0s-l { box-shadow: 0 0 10px 1px rgba( 0, 0, 0, .2 ); }
 .shadow-b-1-l { box-shadow: 0 1px 10px 0 rgba( 0, 0, 0, .2 ); }
 .shadow-b-1s-l { box-shadow: 0 1px 10px 1px rgba( 0, 0, 0, .2 ); }
 .shadow-b-2-l { box-shadow: 0 2px 15px 0 rgba( 0, 0, 0, .2 ); }
 .shadow-b-2s-l { box-shadow: 0 2px 15px 2px rgba( 0, 0, 0, .2 ); }
}