1/** 2 * Black theme for reveal.js. 3 * 4 * Copyright (C) 2011-2012 Hakim El Hattab, http://hakim.se 5 */ 6@import url(https://fonts.googleapis.com/css?family=Montserrat:700); 7@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,400italic,700italic); 8/********************************************* 9 * GLOBAL STYLES 10 *********************************************/ 11body { 12 background: #111; 13 background-color: #111; } 14 15.reveal { 16 font-family: "Open Sans", sans-serif; 17 font-size: 40px; 18 font-weight: normal; 19 color: #eee; } 20 21::selection { 22 color: #fff; 23 background: #e7ad52; 24 text-shadow: none; } 25 26::-moz-selection { 27 color: #fff; 28 background: #e7ad52; 29 text-shadow: none; } 30 31.reveal .slides section, 32.reveal .slides section > section { 33 line-height: 1.3; 34 font-weight: inherit; } 35 36/********************************************* 37 * HEADERS 38 *********************************************/ 39.reveal h1, 40.reveal h2, 41.reveal h3, 42.reveal h4, 43.reveal h5, 44.reveal h6 { 45 margin: 0 0 20px 0; 46 color: #eee; 47 font-family: "Montserrat", Impact, sans-serif; 48 font-weight: normal; 49 line-height: 1.2; 50 letter-spacing: -0.03em; 51 text-transform: none; 52 text-shadow: none; 53 word-wrap: break-word; } 54 55.reveal h1 { 56 font-size: 3.77em; } 57 58.reveal h2 { 59 font-size: 2.11em; } 60 61.reveal h3 { 62 font-size: 1.55em; } 63 64.reveal h4 { 65 font-size: 1em; } 66 67.reveal h1 { 68 text-shadow: none; } 69 70/********************************************* 71 * OTHER 72 *********************************************/ 73.reveal p { 74 margin: 20px 0; 75 line-height: 1.3; } 76 77/* Ensure certain elements are never larger than the slide itself */ 78.reveal img, 79.reveal video, 80.reveal iframe { 81 max-width: 95%; 82 max-height: 95%; } 83 84.reveal strong, 85.reveal b { 86 font-weight: bold; } 87 88.reveal em { 89 font-style: italic; } 90 91.reveal ol, 92.reveal dl, 93.reveal ul { 94 display: inline-block; 95 text-align: left; 96 margin: 0 0 0 1em; } 97 98.reveal ol { 99 list-style-type: decimal; } 100 101.reveal ul { 102 list-style-type: disc; } 103 104.reveal ul ul { 105 list-style-type: square; } 106 107.reveal ul ul ul { 108 list-style-type: circle; } 109 110.reveal ul ul, 111.reveal ul ol, 112.reveal ol ol, 113.reveal ol ul { 114 display: block; 115 margin-left: 40px; } 116 117.reveal dt { 118 font-weight: bold; } 119 120.reveal dd { 121 margin-left: 40px; } 122 123.reveal blockquote { 124 display: block; 125 position: relative; 126 width: 70%; 127 margin: 20px auto; 128 padding: 5px; 129 font-style: italic; 130 background: rgba(255, 255, 255, 0.05); 131 box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); } 132 133.reveal blockquote p:first-child, 134.reveal blockquote p:last-child { 135 display: inline-block; } 136 137.reveal q { 138 font-style: italic; } 139 140.reveal pre { 141 display: block; 142 position: relative; 143 width: 90%; 144 margin: 20px auto; 145 text-align: left; 146 font-size: 0.55em; 147 font-family: monospace; 148 line-height: 1.2em; 149 word-wrap: break-word; 150 box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15); } 151 152.reveal code { 153 font-family: monospace; 154 text-transform: none; } 155 156.reveal pre code { 157 display: block; 158 padding: 5px; 159 overflow: auto; 160 max-height: 400px; 161 word-wrap: normal; } 162 163.reveal table { 164 margin: auto; 165 border-collapse: collapse; 166 border-spacing: 0; } 167 168.reveal table th { 169 font-weight: bold; } 170 171.reveal table th, 172.reveal table td { 173 text-align: left; 174 padding: 0.2em 0.5em 0.2em 0.5em; 175 border-bottom: 1px solid; } 176 177.reveal table th[align="center"], 178.reveal table td[align="center"] { 179 text-align: center; } 180 181.reveal table th[align="right"], 182.reveal table td[align="right"] { 183 text-align: right; } 184 185.reveal table tbody tr:last-child th, 186.reveal table tbody tr:last-child td { 187 border-bottom: none; } 188 189.reveal sup { 190 vertical-align: super; 191 font-size: smaller; } 192 193.reveal sub { 194 vertical-align: sub; 195 font-size: smaller; } 196 197.reveal small { 198 display: inline-block; 199 font-size: 0.6em; 200 line-height: 1.2em; 201 vertical-align: top; } 202 203.reveal small * { 204 vertical-align: top; } 205 206/********************************************* 207 * LINKS 208 *********************************************/ 209.reveal a { 210 color: #e7ad52; 211 text-decoration: none; 212 -webkit-transition: color .15s ease; 213 -moz-transition: color .15s ease; 214 transition: color .15s ease; } 215 216.reveal a:hover { 217 color: #f3d7ac; 218 text-shadow: none; 219 border: none; } 220 221.reveal .roll span:after { 222 color: #fff; 223 background: #d08a1d; } 224 225/********************************************* 226 * IMAGES 227 *********************************************/ 228.reveal section img { 229 margin: 15px 0px; 230 background: rgba(255, 255, 255, 0.12); 231 border: 4px solid #eee; 232 box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); } 233 234.reveal section img.plain { 235 border: 0; 236 box-shadow: none; } 237 238.reveal a img { 239 -webkit-transition: all .15s linear; 240 -moz-transition: all .15s linear; 241 transition: all .15s linear; } 242 243.reveal a:hover img { 244 background: rgba(255, 255, 255, 0.2); 245 border-color: #e7ad52; 246 box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); } 247 248/********************************************* 249 * NAVIGATION CONTROLS 250 *********************************************/ 251.reveal .controls { 252 color: #e7ad52; } 253 254/********************************************* 255 * PROGRESS BAR 256 *********************************************/ 257.reveal .progress { 258 background: rgba(0, 0, 0, 0.2); 259 color: #e7ad52; } 260 261.reveal .progress span { 262 -webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); 263 -moz-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); 264 transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); } 265 266/********************************************* 267 * PRINT BACKGROUND 268 *********************************************/ 269@media print { 270 .backgrounds { 271 background-color: #111; } } 272