/*! SpringRoll 1.0.3 */ /** * Here's the assumed markup structure for basic Application *

*/ body { padding: 0; margin: 0; position: absolute; background-color: transparent; width: 100%; height: 100%; } /** * Base frame */ .frame, #frame { position: absolute; left: 0; right: 0; height: 100%; } /** * We'll vertically center the content * the JavaScript will resize the canvas * content to the Window size */ .content, #content { position: absolute; display: block; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .content canvas, #content canvas { display: block; } /*# sourceMappingURL=libraries.css.map */ /*! SpringRoll 1.0.3 */ body { font-size: 2em; } @media (max-width: 2048px) { body { font-size: 1.9em; } } @media (max-width: 1920px) { body { font-size: 1.8em; } } @media (max-width: 1792px) { body { font-size: 1.7em; } } @media (max-width: 1664px) { body { font-size: 1.6em; } } @media (max-width: 1536px) { body { font-size: 1.5em; } } @media (max-width: 1408px) { body { font-size: 1.4em; } } @media (max-width: 1280px) { body { font-size: 1.3em; } } @media (max-width: 1152px) { body { font-size: 1.2em; } } @media (max-width: 1024px) { body { font-size: 1.1em; } } @media (max-width: 896px) { body { font-size: 1em; } } @media (max-width: 768px) { body { font-size: 0.9em; } } @media (max-width: 640px) { body { font-size: 0.8em; } } @media (max-width: 512px) { body { font-size: 0.7em; } } @media (max-width: 384px) { body { font-size: 0.6em; } } @media (max-width: 256px) { body { font-size: 0.5em; } } /** * The captions styles, this work with the container * to allow for the managed display settings of * the output captions */ .captions, #captions { position: absolute; z-index: 1; width: 100%; text-align: center; line-height: 2; pointer-events: none; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: default; background: rgba(0, 0, 0, 0.5); color: #fff; font-family: Arial, Helvetica, sans-serif; top: 0; bottom: auto; } .captions.size-xs, #captions.size-xs { font-size: 0.8em; } .captions.size-sm, #captions.size-sm { font-size: 1em; } .captions.size-md, #captions.size-md { font-size: 1.2em; } .captions.size-lg, #captions.size-lg { font-size: 1.4em; } .captions.size-xl, #captions.size-xl { font-size: 1.8em; } .captions.align-top, #captions.align-top { top: 0; bottom: auto; } .captions.align-bottom, #captions.align-bottom { bottom: 0; top: auto; } .captions.bg-none, #captions.bg-none { background: transparent; } .captions.bg-black, #captions.bg-black { background: #000000; } .captions.bg-black-semi, #captions.bg-black-semi { background: rgba(0, 0, 0, 0.5); } .captions.bg-white, #captions.bg-white { background: #ffffff; } .captions.bg-white-semi, #captions.bg-white-semi { background: rgba(255, 255, 255, 0.5); } .captions.bg-red, #captions.bg-red { background: #ff0000; } .captions.bg-red-semi, #captions.bg-red-semi { background: rgba(255, 0, 0, 0.5); } .captions.bg-yellow, #captions.bg-yellow { background: #ffff00; } .captions.bg-yellow-semi, #captions.bg-yellow-semi { background: rgba(255, 255, 0, 0.5); } .captions.bg-pink, #captions.bg-pink { background: #ff00ff; } .captions.bg-pink-semi, #captions.bg-pink-semi { background: rgba(255, 0, 255, 0.5); } .captions.bg-blue, #captions.bg-blue { background: #00ffff; } .captions.bg-blue-semi, #captions.bg-blue-semi { background: rgba(0, 255, 255, 0.5); } .captions.color-black, #captions.color-black { color: #000000; } .captions.color-black-semi, #captions.color-black-semi { color: rgba(0, 0, 0, 0.5); } .captions.color-white, #captions.color-white { color: #ffffff; } .captions.color-white-semi, #captions.color-white-semi { color: rgba(255, 255, 255, 0.5); } .captions.color-red, #captions.color-red { color: #ff0000; } .captions.color-red-semi, #captions.color-red-semi { color: rgba(255, 0, 0, 0.5); } .captions.color-yellow, #captions.color-yellow { color: #ffff00; } .captions.color-yellow-semi, #captions.color-yellow-semi { color: rgba(255, 255, 0, 0.5); } .captions.color-pink, #captions.color-pink { color: #ff00ff; } .captions.color-pink-semi, #captions.color-pink-semi { color: rgba(255, 0, 255, 0.5); } .captions.color-blue, #captions.color-blue { color: #00ffff; } .captions.color-blue-semi, #captions.color-blue-semi { color: rgba(0, 255, 255, 0.5); } .captions.edge-raise, #captions.edge-raise { text-shadow: -1px -1px 0 rgba(255, 255, 255, 0.3), 1px 1px 0 rgba(0, 0, 0, 0.8); } .captions.edge-depress, #captions.edge-depress { text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.8), -1px -1px 0 rgba(255, 255, 255, 0.3); } .captions.edge-uniform, #captions.edge-uniform { text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.8), -1px -1px 0 rgba(0, 0, 0, 0.8), -1px 1px 0 rgba(0, 0, 0, 0.8), 1px -1px 0 rgba(0, 0, 0, 0.8); } .captions.edge-drop, #captions.edge-drop { text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.4); } .captions.edge-none, #captions.edge-none { text-shadow: none; } .captions.font-georgia, #captions.font-georgia { font-family: Georgia, serif; } .captions.font-palatino, #captions.font-palatino { font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; } .captions.font-times, #captions.font-times { font-family: "Times New Roman", Times, serif; } .captions.font-arial, #captions.font-arial { font-family: Arial, Helvetica, sans-serif; } .captions.font-arial-black, #captions.font-arial-black { font-family: "Arial Black", Gadget, sans-serif; } .captions.font-comic-sans, #captions.font-comic-sans { font-family: "Comic Sans MS", cursive, sans-serif; } .captions.font-impact, #captions.font-impact { font-family: Impact, Charcoal, sans-serif; } .captions.font-lucida, #captions.font-lucida { font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; } .captions.font-tahoma, #captions.font-tahoma { font-family: Tahoma, Geneva, sans-serif; } .captions.font-trebuchet, #captions.font-trebuchet { font-family: "Trebuchet MS", Helvetica, sans-serif; } .captions.font-verdana, #captions.font-verdana { font-family: Verdana, Geneva, sans-serif; } .captions.font-courier, #captions.font-courier { font-family: "Courier New", Courier, monospace; } .captions.font-console, #captions.font-console { font-family: "Lucida Console", Monaco, monospace; } /*# sourceMappingURL=libraries.css.map */