@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic); /** * OSI theme for reveal.js. * */ @font-face { font-family: 'League Gothic'; src: url("../../lib/font/league_gothic-webfont.eot"); src: url("../../lib/font/league_gothic-webfont.eot?#iefix") format("embedded-opentype"), url("../../lib/font/league_gothic-webfont.woff") format("woff"), url("../../lib/font/league_gothic-webfont.ttf") format("truetype"), url("../../lib/font/league_gothic-webfont.svg#LeagueGothicRegular") format("svg"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; src: local("Lato Regular"), local("Lato-Regular"), url("../../lib/font/qIIYRU-oROkIk8vfvxw6QvesZW2xOQ-xsNqO47m55DA.woff") format("woff"); } @font-face { font-family: 'Lato'; font-style: normal; font-weight: 700; src: local("Lato Bold"), local("Lato-Bold"), url("../../lib/font/qdgUG4U09HnJwhYI-uK18wLUuEpTyoUstqEm5AMlJo4.woff") format("woff"); } @font-face { font-family: 'Lato'; font-style: italic; font-weight: 400; src: local("Lato Italic"), local("Lato-Italic"), url("../../lib/font/RYyZNoeFgb0l7W3Vu1aSWOvvDin1pK8aKteLpeZ5c0A.woff") format("woff"); } @font-face { font-family: 'Lato'; font-style: italic; font-weight: 700; src: local("Lato Bold Italic"), local("Lato-BoldItalic"), url("../../lib/font/HkF_qI1x_noxlxhrhMQYELO3LdcAZYWl9Si6vvxL-qU.woff") format("woff"); } /********************************************* * GLOBAL STYLES *********************************************/ body { background: #ecf4fb; background: -moz-radial-gradient(center, circle cover, white 0%, #ecf4fb 100%); background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, white), color-stop(100%, #ecf4fb)); background: -webkit-radial-gradient(center, circle cover, white 0%, #ecf4fb 100%); background: -o-radial-gradient(center, circle cover, white 0%, #ecf4fb 100%); background: -ms-radial-gradient(center, circle cover, white 0%, #ecf4fb 100%); background: radial-gradient(center, circle cover, white 0%, #ecf4fb 100%); background-color: #e9f6fb; } .reveal { font-family: "Lato", sans-serif; font-size: 36px; font-weight: 200; letter-spacing: -0.02em; color: #333333; } ::selection { color: white; background: #647a8e; text-shadow: none; } /********************************************* * HEADERS *********************************************/ .reveal h1, .reveal h2, .reveal h3, .reveal h4, .reveal h5, .reveal h6 { margin: 0 0 20px 0; color: #333333; font-family: "League Gothic", Impact, sans-serif; line-height: 0.9em; letter-spacing: 0.02em; text-transform: uppercase; text-shadow: none; } .reveal h1 { text-shadow: none; } /********************************************* * LINKS *********************************************/ .reveal a:not(.image) { color: #ff8a00; text-decoration: none; -webkit-transition: color .15s ease; -moz-transition: color .15s ease; -ms-transition: color .15s ease; -o-transition: color .15s ease; transition: color .15s ease; } .reveal a:not(.image):hover { color: #ffb966; text-shadow: none; border: none; } .reveal .roll span:after { color: #fff; background: #b36100; } /********************************************* * IMAGES *********************************************/ .reveal section img { margin: 15px 0px; background: rgba(255, 255, 255, 0.12); border: 4px solid #333333; box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); -webkit-transition: all .2s linear; -moz-transition: all .2s linear; -ms-transition: all .2s linear; -o-transition: all .2s linear; transition: all .2s linear; } .reveal a:hover img { background: rgba(255, 255, 255, 0.2); border-color: #ff8a00; box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); } /********************************************* * NAVIGATION CONTROLS *********************************************/ .reveal .controls div.navigate-left, .reveal .controls div.navigate-left.enabled { border-right-color: #ff8a00; } .reveal .controls div.navigate-right, .reveal .controls div.navigate-right.enabled { border-left-color: #ff8a00; } .reveal .controls div.navigate-up, .reveal .controls div.navigate-up.enabled { border-bottom-color: #ff8a00; } .reveal .controls div.navigate-down, .reveal .controls div.navigate-down.enabled { border-top-color: #ff8a00; } .reveal .controls div.navigate-left.enabled:hover { border-right-color: #ffb966; } .reveal .controls div.navigate-right.enabled:hover { border-left-color: #ffb966; } .reveal .controls div.navigate-up.enabled:hover { border-bottom-color: #ffb966; } .reveal .controls div.navigate-down.enabled:hover { border-top-color: #ffb966; } /********************************************* * PROGRESS BAR *********************************************/ .reveal .progress { background: rgba(0, 0, 0, 0.2); } .reveal .progress span { background: #ff8a00; -webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); -moz-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); -ms-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); -o-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } /********************************************* * CUSTOM *********************************************/ .reveal .slides { width: 1024px; } .reveal .custom.inverse { color: #e7d6c3; } .reveal h1 { font-size: 3.2em; } .reveal h1.chapter { color: #ff8a00; margin-top: 0.8em; padding: 10px; } .reveal .release-date { color: #647a8e; } .reveal .right { text-align: right; width: 100%; } .reveal .left { text-align: left; width: 100%; } .reveal .name { margin-top: 1.5em; } .footer { bottom: 40px; left: 30px; position: fixed; width: 100%; z-index: 0; } .reveal .footnote, .reveal .note { bottom: 10px; color: #899594; display: inline-block; font-size: 45%; margin-left: auto; margin-right: auto; position: relative; text-align: center; width: 80%; } .reveal .note { color: #647a8e; } .reveal .illustration img, .reveal .diagramme img { border: none; box-shadow: 0 0 20px rgba(0, 0, 0, 0.4); max-height: 65%; max-width: 65%; } .reveal .illustration-full img, .reveal .diagramme-full img { border: none; box-shadow: 0 0 20px rgba(0, 0, 0, 0.4); margin: 0; max-height: 85%; max-width: 85%; padding: 0; } .reveal .slides section.full, .reveal section.full img { margin: 0; padding: 0; } p.caption { font-size: 60%; font-style: italic; } .reveal code { box-shadow: 0 0 6px rgba(0, 0, 0, 0.2); font-size: .75em; font-family: monospace; line-height: 1.2em; margin: 0 0.35em; padding: 0 .15em; word-wrap: break-word; } .reveal .high { color: #ff8a00; } .reveal code.high { background-color: #ff8a00; color: white; } .reveal .codeblock { display: block; font-size: .55em; margin: 0.15em 0 0.15em 1em; max-height: 495px; overflow: auto; padding: 0.3em 0.5em; } .reveal .ab { display: block; font-size: .6em; margin: 0.15em 0 0.15em 1em; max-height: 495px; overflow: auto; padding: 0.3em 0.5em; } .reveal blockquote { background: rgba(255, 255, 255, 0.05); box-shadow: none; color: #647a8e; line-height: 1.5em; margin: auto; padding: auto; font-style: italic; width: 100%; } .reveal blockquote.quote-small { background: rgba(255, 255, 255, 0.05); box-shadow: none; color: #647a8e; font-size: 0.8em; line-height: 1.2em; margin: auto auto 0.8em auto; padding: auto; font-style: italic; width: 100%; } .reveal .quoteinverse { background-color: #647a8e; color: white; padding: 0 0.15em; } .reveal .quote-underline { border-bottom: solid 5px #647a8e; } .reveal ol, .reveal ul { font-size: 0.9em; list-style-type: none; margin: 0 0 0 1.5em; } .reveal li { margin-bottom: 0.2em; } .reveal ol li:before, .reveal ul li:before { color: #ff8a00; content: "● "; } .reveal ul ul ul, .reveal ul ul { list-style-type: none; } .reveal ul ul li:before { color: #ff8a00; content: "– "; } .reveal ul ul ul li:before { color: #647a8e; content: "· "; } .reveal ul ul ul li { line-height: 1; margin: 0 auto; padding: 0 auto; } .reveal ul ul, .reveal ul ol, .reveal ol ol, .reveal ol ul { margin-left: 2.5em; } .reveal blockquote li { margin-bottom: 0.7em; } .reveal blockquote ol li:before, .reveal blockquote ul li:before { color: #647a8e; content: ""; } .reveal blockquote ul ul ul, .reveal blockquote ul ul { list-style-type: circle; } .reveal blockquote ul ul ul li:before, .reveal blockquote ul ul li:before { color: #647a8e; content: ""; } .reveal blockquote ul ul, .reveal blockquote ul ol, .reveal blockquote ol ol, .reveal blockquote ol ul { margin-left: auto; } .reveal .highlight { background-color: #ff8a00; border-radius: 0.4em; color: white; font-size: 0.75em; margin-left: 1em; padding: 0.1em 0.3em; } .reveal .highlight:before { content: "→ "; } .reveal table { margin-bottom: 1em; } .reveal p.theme-name { color: #647a8e; font-family: "League Gothic"; font-size: 1.2em; float: left; margin-top: 0.5em; text-align: left; text-transform: uppercase; } .reveal table.new { font-size: 0.8em; line-height: 1.35; margin-bottom: 0.5em; margin-top: 0.5em; width: 100%; } .reveal .new th { color: #647a8e; font-family: "League Gothic"; text-transform: uppercase; width: 12%; } .reveal .new td:before { color: #ff8a00; content: "· "; } .reveal .two-columns-left { float: left; margin: auto 0; width: 47.5%; } .reveal .two-columns-right { float: right; margin: auto 0; width: 47.5%; } .reveal table { width: 100%; } .reveal .compare-table { border-collapse: collapse; line-height: 1.1; margin-top: 1em; padding: 0.4em; width: 100%; } .reveal .compare-table tr.first-row { padding-bottom: 1em; } .reveal .compare-table th { width: 16%; } .reveal .compare-table td { width: 28%; } .reveal .compare-table thead { font-size: 0.75em; } .reveal .compare-table.six thead { color: #647a8e; } .reveal .compare-table.seven thead { color: #5a9b47; } .reveal .compare-table.eight thead { color: #d2533a; } .reveal .compare-table tbody { border-top: 5px solid rgba(255, 255, 255, 0); font-size: 0.65em; } .reveal .compare-table thead th { font-family: "League Gothic"; font-size: 1.2em; position: relative; top: 0.2em; text-transform: uppercase; } .reveal section img.cover-img { background: none; border: none; box-shadow: none; margin: 0; } .reveal div.cover-osi { color: #647a8e; position: relative; top: 2em; } .reveal div.cover-osi h3 { color: #647a8e; } .reveal .downer { margin-top: 1.5em; } .reveal h3.people { margin-top: 0.8em; } .reveal table.people { font-size: 0.75em; line-height: 1; margin: 1em 0 1.7em 0; } .reveal table.people td { border-bottom: 5px solid rgba(255, 255, 255, 0); margin: 0; padding: 0; } .reveal table.people .td-middle { border-left: 15px solid rgba(255, 255, 255, 0); border-right: 15px solid rgba(255, 255, 255, 0); } .reveal table.people img { max-width: 100%; } .reveal .blue { color: #647a8e; } .reveal .lowercase { text-transform: none; }