You can not select more than 25 topics Topics must start with a chinese character,a letter or number, can include dashes ('-') and can be up to 35 characters long.

docfx.css 17 kB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989
  1. /* Copyright (c) Microsoft Corporation. All Rights Reserved. Licensed under the MIT License. See License.txt in the project root for license information. */
  2. @import url('https://fonts.googleapis.com/css?family=Titillium+Web');
  3. @import url("dracula.css");
  4. html,
  5. body {
  6. font-family: 'Titillium Web', 'Segoe UI', Tahoma, Helvetica, sans-serif;
  7. height: 100%;
  8. background: #212121;
  9. color: #C0C0C0;
  10. font-size: 15px;
  11. }
  12. button,
  13. a {
  14. color: #64B5F6;
  15. cursor: pointer;
  16. }
  17. button:hover,
  18. button:focus,
  19. a:hover,
  20. a:focus {
  21. color: #2196F3;
  22. text-decoration: none;
  23. }
  24. a.disable,
  25. a.disable:hover {
  26. text-decoration: none;
  27. cursor: default;
  28. color: #EEEEEE;
  29. }
  30. /* workaround for leave space for fixed navbar with # anchor url*/
  31. h1:before,
  32. h2:before,
  33. h3:before,
  34. h4:before {
  35. content: '';
  36. display: block;
  37. position: relative;
  38. width: 0;
  39. height: 100px;
  40. margin-top: -100px;
  41. }
  42. h1, h2, h3, h4, h5, h6, .text-break {
  43. word-wrap: break-word;
  44. word-break: break-word;
  45. }
  46. h1 mark,
  47. h2 mark,
  48. h3 mark,
  49. h4 mark,
  50. h5 mark,
  51. h6 mark {
  52. padding: 0;
  53. }
  54. .inheritance .level0:before,
  55. .inheritance .level1:before,
  56. .inheritance .level2:before,
  57. .inheritance .level3:before,
  58. .inheritance .level4:before,
  59. .inheritance .level5:before {
  60. content: '↳';
  61. margin-right: 5px;
  62. }
  63. .inheritance .level0 {
  64. margin-left: 0em;
  65. }
  66. .inheritance .level1 {
  67. margin-left: 1em;
  68. }
  69. .inheritance .level2 {
  70. margin-left: 2em;
  71. }
  72. .inheritance .level3 {
  73. margin-left: 3em;
  74. }
  75. .inheritance .level4 {
  76. margin-left: 4em;
  77. }
  78. .inheritance .level5 {
  79. margin-left: 5em;
  80. }
  81. span.parametername,
  82. span.paramref,
  83. span.typeparamref {
  84. font-style: italic;
  85. }
  86. span.languagekeyword{
  87. font-weight: bold;
  88. }
  89. svg:hover path {
  90. fill: #ffffff;
  91. }
  92. .hljs {
  93. display: inline;
  94. background-color: inherit;
  95. padding: 0;
  96. }
  97. /* additional spacing fixes */
  98. .btn + .btn {
  99. margin-left: 10px;
  100. }
  101. .btn.pull-right {
  102. margin-left: 10px;
  103. margin-top: 5px;
  104. }
  105. .table {
  106. margin-bottom: 10px;
  107. }
  108. table p {
  109. margin-bottom: 0;
  110. }
  111. table a {
  112. display: inline-block;
  113. }
  114. /* Make hidden attribute compatible with old browser.*/
  115. [hidden] {
  116. display: none !important;
  117. }
  118. h1,
  119. .h1,
  120. h2,
  121. .h2,
  122. h3,
  123. .h3 {
  124. margin-top: 15px;
  125. margin-bottom: 10px;
  126. font-weight: 400;
  127. }
  128. h4,
  129. .h4,
  130. h5,
  131. .h5,
  132. h6,
  133. .h6 {
  134. margin-top: 10px;
  135. margin-bottom: 5px;
  136. }
  137. .navbar {
  138. margin-bottom: 0;
  139. }
  140. #wrapper {
  141. min-height: 100%;
  142. position: relative;
  143. }
  144. /* blends header footer and content together with gradient effect */
  145. .grad-top {
  146. /* For Safari 5.1 to 6.0 */
  147. /* For Opera 11.1 to 12.0 */
  148. /* For Firefox 3.6 to 15 */
  149. background: linear-gradient(rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0));
  150. /* Standard syntax */
  151. height: 5px;
  152. }
  153. .grad-bottom {
  154. /* For Safari 5.1 to 6.0 */
  155. /* For Opera 11.1 to 12.0 */
  156. /* For Firefox 3.6 to 15 */
  157. background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.05));
  158. /* Standard syntax */
  159. height: 5px;
  160. }
  161. .divider {
  162. margin: 0 5px;
  163. color: #37474F;
  164. }
  165. hr {
  166. border-color: #37474F;
  167. }
  168. header {
  169. position: fixed;
  170. top: 0;
  171. left: 0;
  172. right: 0;
  173. z-index: 1000;
  174. }
  175. header .navbar {
  176. border-width: 0 0 0px;
  177. border-radius: 0;
  178. }
  179. .navbar-brand {
  180. font-size: inherit;
  181. padding: 0;
  182. }
  183. .navbar-collapse {
  184. margin: 0 -15px;
  185. }
  186. .subnav {
  187. min-height: 40px;
  188. background: #383838
  189. }
  190. .inheritance h5, .inheritedMembers h5{
  191. padding-bottom: 5px;
  192. border-bottom: 1px solid #37474F;
  193. }
  194. article h1, article h2, article h3, article h4{
  195. margin-top: 25px;
  196. }
  197. article h4{
  198. border-bottom: 1px solid #37474F;
  199. }
  200. article span.small.pull-right{
  201. margin-top: 20px;
  202. }
  203. article section {
  204. margin-left: 1em;
  205. }
  206. /*.expand-all {
  207. padding: 10px 0;
  208. }*/
  209. .breadcrumb {
  210. margin: 0;
  211. padding: 10px 0;
  212. background-color: inherit;
  213. white-space: nowrap;
  214. }
  215. .breadcrumb > li + li:before {
  216. content: "\00a0/";
  217. }
  218. #autocollapse.collapsed .navbar-header {
  219. float: none;
  220. }
  221. #autocollapse.collapsed .navbar-toggle {
  222. display: block;
  223. }
  224. #autocollapse.collapsed .navbar-collapse {
  225. border-top: 1px solid transparent;
  226. box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
  227. }
  228. #autocollapse.collapsed .navbar-collapse.collapse {
  229. display: none !important;
  230. }
  231. #autocollapse.collapsed .navbar-nav {
  232. float: none !important;
  233. margin: 7.5px -15px;
  234. }
  235. #autocollapse.collapsed .navbar-nav > li {
  236. float: none;
  237. }
  238. #autocollapse.collapsed .navbar-nav > li > a {
  239. padding-top: 10px;
  240. padding-bottom: 10px;
  241. }
  242. #autocollapse.collapsed .collapse.in,
  243. #autocollapse.collapsed .collapsing {
  244. display: block !important;
  245. }
  246. #autocollapse.collapsed .collapse.in .navbar-right,
  247. #autocollapse.collapsed .collapsing .navbar-right {
  248. float: none !important;
  249. }
  250. #autocollapse .form-group {
  251. width: 100%;
  252. }
  253. #autocollapse .form-control {
  254. width: 100%;
  255. }
  256. #autocollapse .navbar-header {
  257. margin-left: 0;
  258. margin-right: 0;
  259. }
  260. #autocollapse .navbar-brand {
  261. margin-left: 0;
  262. }
  263. .collapse.in,
  264. .collapsing {
  265. text-align: center;
  266. }
  267. .collapsing .navbar-form {
  268. margin: 0 auto;
  269. max-width: 400px;
  270. padding: 10px 15px;
  271. box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
  272. }
  273. .collapsed .collapse.in .navbar-form {
  274. margin: 0 auto;
  275. max-width: 400px;
  276. padding: 10px 15px;
  277. box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
  278. }
  279. .navbar .navbar-nav {
  280. display: inline-block;
  281. }
  282. .docs-search {
  283. background: #424242;
  284. vertical-align: middle;
  285. }
  286. .docs-search > .search-query {
  287. font-size: 14px;
  288. border: 0;
  289. width: 120%;
  290. }
  291. .docs-search > .search-query:focus {
  292. outline: 0;
  293. }
  294. .search-results-frame {
  295. clear: both;
  296. display: table;
  297. width: 100%;
  298. }
  299. .search-results.ng-hide {
  300. display: none;
  301. }
  302. .search-results-container {
  303. padding-bottom: 1em;
  304. border-top: 1px solid #111;
  305. background: rgba(25, 25, 25, 0.5);
  306. }
  307. .search-results-container .search-results-group {
  308. padding-top: 50px !important;
  309. padding: 10px;
  310. }
  311. .search-results-group-heading {
  312. font-family: "Open Sans";
  313. padding-left: 10px;
  314. color: #424242;
  315. }
  316. .search-close {
  317. position: absolute;
  318. left: 50%;
  319. margin-left: -100px;
  320. color: #424242;
  321. text-align: center;
  322. padding: 5px;
  323. background: #333;
  324. border-top-right-radius: 5px;
  325. border-top-left-radius: 5px;
  326. width: 200px;
  327. box-shadow: 0 0 10px #111;
  328. }
  329. #search {
  330. display: none;
  331. }
  332. /* Search results display*/
  333. #search-results {
  334. max-width: 960px !important;
  335. margin-top: 120px;
  336. margin-bottom: 115px;
  337. margin-left: auto;
  338. margin-right: auto;
  339. line-height: 1.8;
  340. display: none;
  341. }
  342. #search-results>.search-list {
  343. text-align: center;
  344. font-size: 2.5rem;
  345. margin-bottom: 50px;
  346. }
  347. #search-results p {
  348. text-align: center;
  349. }
  350. #search-results .sr-items {
  351. font-size: 24px;
  352. }
  353. .sr-item {
  354. margin-bottom: 25px;
  355. }
  356. .sr-item>.item-href {
  357. font-size: 14px;
  358. color: #093;
  359. }
  360. .sr-item>.item-brief {
  361. font-size: 13px;
  362. }
  363. .pagination>li>a {
  364. color: #47A7A0
  365. }
  366. .pagination>.active>a {
  367. background-color: #47A7A0;
  368. border-color: #47A7A0;
  369. }
  370. .fixed_header {
  371. position: fixed;
  372. width: 100%;
  373. padding-bottom: 10px;
  374. padding-top: 10px;
  375. margin: 0px;
  376. top: 0;
  377. z-index: 9999;
  378. left: 0;
  379. }
  380. .fixed_header+.toc{
  381. margin-top: 50px;
  382. margin-left: 0;
  383. }
  384. .sidetoc {
  385. position: fixed;
  386. width: 260px;
  387. top: 150px;
  388. bottom: 0;
  389. overflow-x: hidden;
  390. overflow-y: auto;
  391. background-color: #1b1b1b;
  392. border-left: 0px solid #37474F;
  393. border-right: 0px solid #37474F;
  394. z-index: 1;
  395. }
  396. .sidetoc.shiftup {
  397. bottom: 70px;
  398. }
  399. body .toc{
  400. background-color: inherit;
  401. }
  402. .sidetoggle.ng-hide {
  403. display: block !important;
  404. }
  405. .sidetoc-expand > .caret {
  406. margin-left: 0px;
  407. margin-top: -2px;
  408. }
  409. .sidetoc-expand > .caret-side {
  410. border-left: 4px solid;
  411. border-top: 4px solid transparent;
  412. border-bottom: 4px solid transparent;
  413. margin-left: 4px;
  414. margin-top: -4px;
  415. }
  416. .sidetoc-heading {
  417. font-weight: 500;
  418. }
  419. .toc {
  420. margin: 0px 0 0 10px;
  421. padding: 0 10px;
  422. }
  423. .expand-stub {
  424. position: absolute;
  425. left: -10px;
  426. }
  427. .toc .nav > li > a.sidetoc-expand {
  428. position: absolute;
  429. top: 0;
  430. left: 0;
  431. }
  432. .toc .nav > li > a {
  433. color: rgb(218, 218, 218);
  434. margin-left: 5px;
  435. display: block;
  436. padding: 0;
  437. }
  438. .toc .nav > li > a:hover,
  439. .toc .nav > li > a:focus {
  440. color: #E0E0E0;
  441. background: none;
  442. text-decoration: inherit;
  443. }
  444. .toc .nav > li.active > a {
  445. color: #90CAF9;
  446. }
  447. .toc .nav > li.active > a:hover,
  448. .toc .nav > li.active > a:focus {
  449. color: #4FC3F7;
  450. }
  451. .toc .nav > li> .expand-stub {
  452. cursor: pointer;
  453. }
  454. .toc .nav > li.active > .expand-stub::before,
  455. .toc .nav > li.in > .expand-stub::before,
  456. .toc .nav > li.in.active > .expand-stub::before,
  457. .toc .nav > li.filtered > .expand-stub::before {
  458. content: "-";
  459. }
  460. .toc .nav > li > .expand-stub::before,
  461. .toc .nav > li.active > .expand-stub::before {
  462. content: "+";
  463. }
  464. .toc .nav > li.filtered > ul,
  465. .toc .nav > li.in > ul {
  466. display: block;
  467. }
  468. .toc .nav > li > ul {
  469. display: none;
  470. }
  471. .toc ul{
  472. font-size: 12px;
  473. margin: 0 0 0 3px;
  474. }
  475. .toc .level1 > li {
  476. font-weight: bold;
  477. margin-top: 10px;
  478. position: relative;
  479. font-size: 16px;
  480. }
  481. .toc .level2 {
  482. font-weight: normal;
  483. margin: 5px 0 0 15px;
  484. font-size: 14px;
  485. }
  486. .toc-toggle {
  487. display: none;
  488. margin: 0 15px 0px 15px;
  489. }
  490. .sidefilter {
  491. position: fixed;
  492. top: 90px;
  493. width: 260px;
  494. background-color: #1b1b1b;
  495. padding: 15px;
  496. border-left: 0px solid #37474F;
  497. border-right: 0px solid #37474F;
  498. z-index: 1;
  499. }
  500. .toc-filter {
  501. border-radius: 5px;
  502. background: #fff;
  503. color: #666666;
  504. padding: 5px;
  505. position: relative;
  506. margin: 0 5px 0 5px;
  507. }
  508. .toc-filter > input {
  509. border: 0;
  510. color: #666666;
  511. padding-left: 20px;
  512. width: 100%;
  513. }
  514. .toc-filter > input:focus {
  515. outline: 0;
  516. }
  517. .toc-filter > .filter-icon {
  518. position: absolute;
  519. top: 10px;
  520. left: 5px;
  521. }
  522. .article {
  523. margin-top: 120px;
  524. margin-bottom: 115px;
  525. }
  526. #_content>a{
  527. margin-top: 105px;
  528. }
  529. .article.grid-right {
  530. margin-left: 280px;
  531. }
  532. .inheritance hr {
  533. margin-top: 5px;
  534. margin-bottom: 5px;
  535. }
  536. .article img {
  537. max-width: 100%;
  538. }
  539. .sideaffix {
  540. margin-top: 50px;
  541. font-size: 12px;
  542. max-height: 100%;
  543. top: 100px;
  544. bottom: 10px;
  545. position: fixed;
  546. }
  547. .sideaffix.shiftup {
  548. bottom: 70px;
  549. }
  550. .affix {
  551. position: relative;
  552. height: 100%;
  553. }
  554. .sideaffix > div.contribution {
  555. margin-bottom: 20px;
  556. }
  557. .sideaffix > div.contribution > ul > li > a.contribution-link {
  558. padding: 6px 10px;
  559. font-weight: bold;
  560. font-size: 14px;
  561. }
  562. .sideaffix > div.contribution > ul > li > a.contribution-link:hover {
  563. background-color: #ffffff;
  564. }
  565. .sideaffix ul.nav > li > a:focus {
  566. background: none;
  567. }
  568. .affix h5 {
  569. font-weight: bold;
  570. text-transform: uppercase;
  571. padding-left: 10px;
  572. font-size: 12px;
  573. }
  574. .affix > ul.level1 {
  575. overflow: hidden;
  576. padding-bottom: 10px;
  577. height: calc(100% - 100px);
  578. margin-right: -20px;
  579. }
  580. .affix ul > li > a:before {
  581. color: #cccccc;
  582. position: absolute;
  583. }
  584. .affix ul > li > a:hover {
  585. background: none;
  586. color: #EEEEEE;
  587. }
  588. .affix ul > li.active > a,
  589. .affix ul > li.active > a:before {
  590. color: #B3E5FC;
  591. }
  592. .affix ul > li > a {
  593. padding: 5px 12px;
  594. color: #EEEEEE;
  595. }
  596. .affix > ul > li.active:last-child {
  597. margin-bottom: 50px;
  598. }
  599. .affix > ul > li > a:before {
  600. content: "|";
  601. font-size: 16px;
  602. top: 1px;
  603. left: 0;
  604. }
  605. .affix > ul > li.active > a,
  606. .affix > ul > li.active > a:before {
  607. color: #B3E5FC;
  608. font-weight: bold;
  609. }
  610. .affix ul ul > li > a {
  611. padding: 2px 15px;
  612. }
  613. .affix ul ul > li > a:before {
  614. content: ">";
  615. font-size: 14px;
  616. top: -1px;
  617. left: 5px;
  618. }
  619. .affix ul > li > a:before,
  620. .affix ul ul {
  621. display: none;
  622. }
  623. .affix ul > li.active > ul,
  624. .affix ul > li.active > a:before,
  625. .affix ul > li > a:hover:before {
  626. display: block;
  627. white-space: nowrap;
  628. }
  629. .codewrapper {
  630. position: relative;
  631. }
  632. .trydiv {
  633. height: 0px;
  634. }
  635. .tryspan {
  636. position: absolute;
  637. top: 0px;
  638. right: 0px;
  639. border-style: solid;
  640. border-radius: 0px 4px;
  641. box-sizing: border-box;
  642. border-width: 1px;
  643. border-color: #37474F;
  644. text-align: center;
  645. padding: 2px 8px;
  646. background-color: white;
  647. font-size: 12px;
  648. cursor: pointer;
  649. z-index: 100;
  650. display: none;
  651. color: #767676;
  652. }
  653. .tryspan:hover {
  654. background-color: #3b8bd0;
  655. color: white;
  656. border-color: #3b8bd0;
  657. }
  658. .codewrapper:hover .tryspan {
  659. display: block;
  660. }
  661. .sample-response .response-content{
  662. max-height: 200px;
  663. }
  664. footer {
  665. position: absolute;
  666. left: 0;
  667. right: 0;
  668. bottom: 0;
  669. z-index: 1000;
  670. }
  671. .footer {
  672. border-top: 1px solid #5F5F5F;
  673. background: #616161;
  674. padding: 15px 0;
  675. }
  676. @media (min-width: 768px) {
  677. #sidetoggle.collapse {
  678. display: block;
  679. }
  680. .topnav .navbar-nav {
  681. float: none;
  682. white-space: nowrap;
  683. }
  684. .topnav .navbar-nav > li {
  685. float: none;
  686. display: inline-block;
  687. }
  688. }
  689. @media only screen and (max-width: 768px) {
  690. #mobile-indicator {
  691. display: block;
  692. }
  693. /* TOC display for responsive */
  694. .article {
  695. margin-top: 30px !important;
  696. }
  697. header {
  698. position: static;
  699. }
  700. .topnav {
  701. text-align: center;
  702. }
  703. .sidenav {
  704. padding: 15px 0;
  705. margin-left: -15px;
  706. margin-right: -15px;
  707. }
  708. .sidefilter {
  709. position: static;
  710. width: auto;
  711. float: none;
  712. border: none;
  713. }
  714. .sidetoc {
  715. position: static;
  716. width: auto;
  717. float: none;
  718. padding-bottom: 0px;
  719. border: none;
  720. }
  721. .toc .nav > li, .toc .nav > li >a {
  722. display: inline-block;
  723. }
  724. .toc li:after {
  725. margin-left: -3px;
  726. margin-right: 5px;
  727. content: ", ";
  728. color: #666666;
  729. }
  730. .toc .level1 > li {
  731. display: block;
  732. }
  733. .toc .level1 > li:after {
  734. display: none;
  735. }
  736. .article.grid-right {
  737. margin-left: 0;
  738. }
  739. .grad-top,
  740. .grad-bottom {
  741. display: none;
  742. }
  743. .toc-toggle {
  744. display: block;
  745. }
  746. .sidetoggle.ng-hide {
  747. display: none !important;
  748. }
  749. /*.expand-all {
  750. display: none;
  751. }*/
  752. .sideaffix {
  753. display: none;
  754. }
  755. .mobile-hide {
  756. display: none;
  757. }
  758. .breadcrumb {
  759. white-space: inherit;
  760. }
  761. /* workaround for #hashtag url is no longer needed*/
  762. h1:before,
  763. h2:before,
  764. h3:before,
  765. h4:before {
  766. content: '';
  767. display: none;
  768. }
  769. }
  770. /* For toc iframe */
  771. @media (max-width: 260px) {
  772. .toc .level2 > li {
  773. display: block;
  774. }
  775. .toc .level2 > li:after {
  776. display: none;
  777. }
  778. }
  779. /* For code snippet line highlight */
  780. pre > code .line-highlight {
  781. background-color: #ffffcc;
  782. }
  783. /* Alerts */
  784. .alert h5 {
  785. text-transform: uppercase;
  786. font-weight: bold;
  787. margin-top: 0;
  788. }
  789. .alert h5:before {
  790. position:relative;
  791. top:1px;
  792. display:inline-block;
  793. font-family:'Glyphicons Halflings';
  794. line-height:1;
  795. -webkit-font-smoothing:antialiased;
  796. -moz-osx-font-smoothing:grayscale;
  797. margin-right: 5px;
  798. font-weight: normal;
  799. }
  800. .alert-info {
  801. color: #d9edf7;
  802. background: #004458;
  803. border-color: #005873
  804. }
  805. .alert-info h5:before {
  806. content:"\e086"
  807. }
  808. .alert-warning {
  809. color: #fffaf2;
  810. background: #80551a;
  811. border-color: #99661f
  812. }
  813. .alert-warning h5:before {
  814. content:"\e127"
  815. }
  816. .alert-danger {
  817. color: #fff2f2;
  818. background: #4d0000;
  819. border-color: #660000
  820. }
  821. .alert-danger h5:before {
  822. content:"\e107"
  823. }
  824. /* For Embedded Video */
  825. div.embeddedvideo {
  826. padding-top: 56.25%;
  827. position: relative;
  828. width: 100%;
  829. }
  830. div.embeddedvideo iframe {
  831. position: absolute;
  832. top: 0;
  833. left: 0;
  834. right: 0;
  835. bottom: 0;
  836. width: 100%;
  837. height: 100%;
  838. }
  839. /* For printer */
  840. @media print{
  841. .article.grid-right {
  842. margin-top: 0px;
  843. margin-left: 0px;
  844. }
  845. .sideaffix {
  846. display: none;
  847. }
  848. .mobile-hide {
  849. display: none;
  850. }
  851. .footer {
  852. display: none;
  853. }
  854. }
  855. /* For tabbed content */
  856. .tabGroup {
  857. margin-top: 1rem; }
  858. .tabGroup ul[role="tablist"] {
  859. margin: 0;
  860. padding: 0;
  861. list-style: none; }
  862. .tabGroup ul[role="tablist"] > li {
  863. list-style: none;
  864. display: inline-block; }
  865. .tabGroup a[role="tab"] {
  866. color: white;
  867. box-sizing: border-box;
  868. display: inline-block;
  869. padding: 5px 7.5px;
  870. text-decoration: none;
  871. border-bottom: 2px solid #fff; }
  872. .tabGroup a[role="tab"]:hover, .tabGroup a[role="tab"]:focus, .tabGroup a[role="tab"][aria-selected="true"] {
  873. border-bottom: 2px solid #607D8B; }
  874. .tabGroup a[role="tab"][aria-selected="true"] {
  875. color: #81D4FA; }
  876. .tabGroup a[role="tab"]:hover, .tabGroup a[role="tab"]:focus {
  877. color: #29B6F6; }
  878. .tabGroup a[role="tab"]:focus {
  879. outline: 1px solid #607D8B;
  880. outline-offset: -1px; }
  881. @media (min-width: 768px) {
  882. .tabGroup a[role="tab"] {
  883. padding: 5px 15px; } }
  884. .tabGroup section[role="tabpanel"] {
  885. border: 1px solid #607D8B;
  886. padding: 15px;
  887. margin: 0;
  888. overflow: hidden; }
  889. .tabGroup section[role="tabpanel"] > .codeHeader,
  890. .tabGroup section[role="tabpanel"] > pre {
  891. margin-left: -16px;
  892. margin-right: -16px; }
  893. .tabGroup section[role="tabpanel"] > :first-child {
  894. margin-top: 0; }
  895. .tabGroup section[role="tabpanel"] > pre:last-child {
  896. display: block;
  897. margin-bottom: -16px; }
  898. .mainContainer[dir='rtl'] main ul[role="tablist"] {
  899. margin: 0; }
  900. /* code */
  901. code {
  902. color:white;
  903. background-color:#4a4c52;
  904. border-radius:4px
  905. }
  906. pre {
  907. background-color: #282a36;
  908. }
  909. /* table */
  910. .table-striped>tbody>tr:nth-of-type(odd) {
  911. background-color:#333333;
  912. color: #d3d3d3
  913. }
  914. tbody>tr {
  915. background-color:#424242;
  916. color: #c0c0c0
  917. }
  918. .table>tbody+tbody {
  919. border-top:2px solid rgb(173, 173, 173)
  920. }