--- title: Orbit layout: doc/layouts/default.html --- # Orbit
We've included a bunch of variables that you'll be able to use if you're into getting SASSy with things.
{{#markdown}} ```scss $include-html-orbit-classes: $include-html-classes; // We use these to control the caption styles $orbit-container-bg: #f5f5f5; $orbit-caption-bg: rgba(0,0,0,0.6); $orbit-caption-font-color: #fff; $orbit-caption-font-size: emCalc(14); $orbit-caption-position: "bottom"; // Supported values: "bottom", "under" $orbit-caption-padding: emCalc(10,14); $orbit-caption-height: auto; // We use these to control the left/right nav styles $orbit-nav-bg: rgba(0,0,0,0.6); $orbit-nav-bg-hover: rgba(0,0,0,0.6); $orbit-nav-arrow-color: #fff; $orbit-nav-arrow-color-hover: #ccc; // We use these to control the timer styles $orbit-timer-bg: rgba(0,0,0,0.6); $orbit-timer-show-progress-bar: true; // We use these to control the bullet nav styles $orbit-bullet-nav-color: #999; $orbit-bullet-nav-color-active: #222; $orbit-bullet-radius: emCalc(18); // We use these to controls the style of slide numbers $orbit-slide-number-bg: rgba(0,0,0,0); $orbit-slide-number-font-color: #fff; $orbit-slide-number-padding: rem-calc(5px); // Graceful Loading Wrapper and preloader $wrapper-class: "slideshow-wrapper"; $preloader-class: "preloader"; ``` {{/markdown}}