@shower/material/styles/slide/slide.css

Material theme for Shower HTML presentation engine

/* Types */

@import 'slide-list.css' screen;
@import 'slide-full.css' screen;

/* Content */

@import 'content/basic.css';
@import 'content/code.css';
@import 'content/footer.css';
@import 'content/inline.css';
@import 'content/lists.css';
@import 'content/quote.css';
@import 'content/table.css';

/* Elements */

@import 'elements/columns.css';
@import 'elements/copyright.css';
@import 'elements/cover.css';
@import 'elements/next.css';
@import 'elements/place.css';
@import 'elements/shout.css';
@import 'elements/spotlight.css';

/* Modifiers */

@import 'modifiers/clear.css';
@import 'modifiers/gray.css';
@import 'modifiers/black.css';

/* Slide */

.slide {
    position: relative;
    z-index: 0;
    overflow: hidden;
    box-sizing: border-box;
    padding:
        79px var(--slide-right-side)
        0 var(--slide-left-side);
    width: var(--slide-width);
    height: var(--slide-height);
    background-color: white;
}

/* Number */

.slide::after {
    position: absolute;
    right: 16px;
    bottom: 38px;
    left: 0;
    color: var(--color-light);
    line-height: 18px;
    text-align: center;
    counter-increment: slide;
    content: counter(slide);
}