oxygen-wibo.css 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536
  1. /*
  2. * ==============================================
  3. * Skin for oXygen generated WebHelp.
  4. * ==============================================
  5. */
  6. /*
  7. * ------------------------------------------------------------------
  8. *
  9. * Fonts.
  10. *
  11. */
  12. @font-face {
  13. font-family: Roboto;
  14. font-style: normal;
  15. font-weight: 100;
  16. src: url(resources/fonts/Roboto-Thin.ttf);
  17. }
  18. @font-face {
  19. font-family: Roboto;
  20. font-style: normal;
  21. font-weight: 300;
  22. src: url(resources/fonts/Roboto-Light.ttf);
  23. }
  24. @font-face {
  25. font-family: Roboto;
  26. font-style: normal;
  27. font-weight: 400;
  28. src: url(resources/fonts/Roboto-Regular.ttf);
  29. }
  30. @font-face {
  31. font-family: Roboto;
  32. font-style: normal;
  33. font-weight: 700;
  34. src: url(resources/fonts/Roboto-Bold.ttf);
  35. }
  36. html, body {
  37. min-width:100%;
  38. }
  39. body{
  40. font-family: Roboto, sans-serif;
  41. }
  42. /*
  43. * ------------------------------------------------------------------
  44. *
  45. * Fight with bootstrap
  46. *
  47. */
  48. .navbar-brand{
  49. height:auto;
  50. }
  51. .navbar {
  52. border:none;
  53. border-radius:0;
  54. margin:0;
  55. }
  56. .wh_header{
  57. background: #000 none;
  58. color: #ffffff;
  59. }
  60. a,
  61. a:hover,
  62. a:visited{
  63. color: #337ab7;
  64. }
  65. a:hover{
  66. text-decoration: none;
  67. }
  68. /*
  69. * ------------------------------------------------------------------
  70. *
  71. * Publication titles
  72. *
  73. */
  74. .wh_publication_title > a{
  75. color:#fff;
  76. }
  77. /*
  78. * ------------------------------------------------------------------
  79. *
  80. * Menu
  81. *
  82. */
  83. .wh_top_menu {
  84. text-transform: uppercase;
  85. margin: .4em 0;
  86. font-size: 0.9em;
  87. }
  88. .wh_top_menu a{
  89. color: #fff;
  90. line-height: 2em;
  91. }
  92. /* The submenus */
  93. .wh_top_menu ul ul {
  94. background-color: #333;
  95. }
  96. .wh_top_menu ul li:hover {
  97. background-color: #333;
  98. }
  99. .wh_top_menu ul ul li a:hover {
  100. background: #000;
  101. }
  102. .wh_top_menu ul ul li {
  103. border-top-color: #000;
  104. width: 270px;
  105. text-transform: capitalize;
  106. }
  107. .wh_top_menu ul ul li.has-children:after{
  108. }
  109. /*
  110. * ------------------------------------------------------------------
  111. *
  112. * Link to the index.
  113. *
  114. */
  115. .wh_indexterms_link a span{
  116. display:none;
  117. }
  118. .wh_indexterms_link a:before{
  119. color:#fff;
  120. }
  121. /*
  122. * ------------------------------------------------------------------
  123. *
  124. * Breadcrumb
  125. *
  126. */
  127. .wh_breadcrumb ol {
  128. color: #878787;
  129. }
  130. .wh_breadcrumb ol a {
  131. color:inherit;
  132. }
  133. .wh_breadcrumb ol .active {
  134. color: #5185cb;
  135. }
  136. /*
  137. * ------------------------------------------------------------------
  138. *
  139. * Tools and navigation
  140. *
  141. */
  142. .wh_tools{
  143. background-color: #ECF2F9;
  144. margin: 1em 0 2em;
  145. }
  146. .wh_print_link,
  147. .wh_navigation_links,
  148. .wh_navigation_links .navnext,
  149. .wh_navigation_links .navprev{
  150. }
  151. .webhelp_expand_collapse_sections,
  152. .wh_hide_highlight,
  153. .wh_print_link button,
  154. .wh_navigation_links a,
  155. .wh_navigation_links a:hover,
  156. .wh_navigation_links a:active,
  157. .wh_navigation_links a:visited,
  158. .wh_print_link a:before,
  159. .wh_navigation_links a:before,
  160. .wh_navigation_links a:hover:before,
  161. .wh_navigation_links a:active:before,
  162. .wh_navigation_links a:visited:before{
  163. color: #347bb7;
  164. text-decoration: none;
  165. }
  166. /*
  167. * ------------------------------------------------------------------
  168. *
  169. * Tiles
  170. *
  171. */
  172. .wh_tile {
  173. background-color: #ECF2F9;
  174. font-weight: 300;
  175. }
  176. .wh_tile_shortdesc{
  177. margin-top:1em;
  178. text-align: center;
  179. color: #0D1A2B;
  180. font-size:1.1em;
  181. }
  182. .wh_tile_text:after{
  183. background: linear-gradient(to bottom, rgba(236, 242, 249, 0), rgba(236, 242, 249, 1) 75%);
  184. }
  185. .wh_tile_title{
  186. font-size:1.7em;
  187. text-align: center;
  188. text-decoration: none;
  189. }
  190. .wh_tile_title a{
  191. color: #3077be;
  192. }
  193. @media only screen and (max-width: 767px) {
  194. .wh_tile > div {
  195. height: auto;
  196. }
  197. }
  198. /*
  199. You can style some of the tiles in a special way.
  200. Example:
  201. .wh_tiles *[data-id='getting_started']{
  202. background-color:gray;
  203. }
  204. */
  205. /*
  206. * ------------------------------------------------------------------
  207. *
  208. * Search area
  209. *
  210. */
  211. .wh_search_input{
  212. display:block;
  213. margin:0;
  214. position:relative;
  215. background: url('resources/images/bgr_right_small.png') right no-repeat #2771bb;
  216. padding: 40px 0;
  217. }
  218. .wh_welcome:not(:empty){
  219. font-size: 2.9em;
  220. margin: 0 auto;
  221. font-family: Roboto, sans-serif;
  222. padding: 0 0 0.5em 0;
  223. text-shadow: none;
  224. font-weight: 300;
  225. line-height: 1.2em;
  226. }
  227. .wh_main_page .wh_search_input{
  228. padding: 115px 0;
  229. background: url('resources/images/bgr_right.png') right no-repeat #2771bb;
  230. }
  231. .wh_search_textfield{
  232. border: solid 1px #CCC;
  233. border-radius: 5px;
  234. padding: 0 .5em;
  235. position: relative;
  236. height: 2.8em;
  237. }
  238. .wh_search_button{
  239. border: solid 1px #CCC;
  240. border-radius: 0 5px 5px 0;
  241. padding: 0.6em 1em;
  242. color:#fff;
  243. background-color: #C93416;
  244. height: 2.8em;
  245. }
  246. /* Search autocomplete icons */
  247. .search-autocomplete-proposal-type-history a,
  248. .search-autocomplete-proposal-type-history a:hover,
  249. .search-autocomplete-proposal-type-history a:visited,
  250. .search-autocomplete-proposal-type-history a:active{
  251. text-decoration: none;
  252. color:inherit;
  253. font-size: 0.8em;
  254. }
  255. .ui-state-active .search-autocomplete-proposal-type-history a,
  256. .ui-state-active .search-autocomplete-proposal-type-history a:hover,
  257. .ui-state-active .search-autocomplete-proposal-type-history a:visited,
  258. .ui-state-active .search-autocomplete-proposal-type-history a:active{
  259. color: #fff;
  260. }
  261. /* Active search page */
  262. #wh-search-pagination > ul > li.active > a {
  263. background-color: #346ec5;
  264. }
  265. /*@media only screen and (max-width: 999px) {*/
  266. /*.wh_search_input:after{*/
  267. /*display:none;*/
  268. /*}*/
  269. /*}*/
  270. @media only screen and (max-width: 767px) {
  271. .wh_main_page .wh_search_input,
  272. .wh_search_input {
  273. padding: 3em 0;
  274. }
  275. }
  276. /*
  277. * ------------------------------------------------------------------
  278. *
  279. * Publication TOC
  280. *
  281. */
  282. .wh_publication_toc{
  283. border-radius: 3px;
  284. padding: 1.5em .5em;
  285. background-color: #f8f8f8
  286. }
  287. .wh_publication_toc .active > .topicref a {
  288. color: #5185cb;
  289. }
  290. .wh_publication_toc span, .wh_publication_toc a, .wh_publication_toc a:visited, .wh_publication_toc a:hover {
  291. color: #878787;
  292. }
  293. .wh_publication_toc a:hover {
  294. text-decoration: underline;
  295. }
  296. .wh_publication_toc ul li, #wh_topic_toc ul li{
  297. margin-top: .7em;
  298. }
  299. @media only screen and (max-width: 767px) {
  300. .wh_publication_toc {
  301. border-radius: 0;
  302. padding: 1em 0.5em;
  303. margin-top: 10px;
  304. border: 1px solid #e0e0e0;
  305. }
  306. .wh_related_links,
  307. .wh_child_links,
  308. .wh_topic_content .related-links{
  309. border: 1px solid #e0e0e0;
  310. }
  311. }
  312. /* Publication TOC tooltip */
  313. .wh_breadcrumb .topicref .wh-tooltip,
  314. .wh_publication_toc .topicref .wh-tooltip {
  315. background-color: #5185cb;
  316. color: #fff;
  317. font-size: 1.4rem;
  318. }
  319. .wh_breadcrumb .topicref .wh-tooltip a,
  320. .wh_publication_toc .topicref .wh-tooltip a {
  321. color: #fff;
  322. text-decoration: underline;
  323. }
  324. /* Tooltip arrow. */
  325. [data-tooltip-position="left"] .topicref .wh-tooltip::before {
  326. border-left-color: #5185cb;
  327. }
  328. [data-tooltip-position="right"] .topicref .wh-tooltip::before {
  329. border-right-color: #5185cb;
  330. }
  331. [data-tooltip-position="bottom"] .topicref .wh-tooltip::before {
  332. border-bottom-color: #5185cb;
  333. }
  334. [data-tooltip-position="top"] .topicref .wh-tooltip::before {
  335. border-top-color: #5185cb;
  336. }
  337. /*
  338. * ------------------------------------------------------------------
  339. *
  340. * Footer
  341. *
  342. */
  343. .wh_footer{
  344. text-align: center;
  345. padding: 1em;
  346. position:relative;
  347. bottom: 0;
  348. width: 100%;
  349. color: #ffffff;
  350. background: none #255B90;
  351. margin-top: 2em;
  352. }
  353. .wh_footer a{
  354. color: #CCE2F1;
  355. }
  356. /*
  357. * ------------------------------------------------------------------
  358. *
  359. * Topic content
  360. *
  361. */
  362. .wh_topic_content,.wh_content_area {
  363. color: #000000;
  364. line-height: 1.7em;
  365. margin-bottom: 80px;
  366. }
  367. .wh_main_page .wh_content_area {
  368. margin: 40px auto;
  369. }
  370. .wh_topic_content .title.topictitle1 {
  371. font-size: 2em;
  372. line-height: 1.1em;
  373. }
  374. .topictitle3,
  375. .topictitle4,
  376. .topictitle5,
  377. .topictitle6 {
  378. font-weight: 400;
  379. }
  380. .wh_related_links,
  381. .wh_child_links,
  382. .wh_topic_content .related-links{
  383. border-top: 1px solid #ccc;
  384. padding-top: 7px;
  385. margin-top: 0;
  386. }
  387. .wh_related_links,
  388. .wh_topic_content .related-links{
  389. padding: .5em 1.5em ;
  390. }
  391. .wh_child_links {
  392. padding: 1.5em ;
  393. }
  394. .related-links strong{
  395. font-weight: 500;
  396. }
  397. .related-links a,
  398. .related-links a:visited {
  399. color: #5185cb;
  400. display:inline-block;
  401. }
  402. .filepath {
  403. color: #c7254e;
  404. }
  405. /*
  406. * ------------------------------------------------------------------
  407. *
  408. * Search results.
  409. *
  410. */
  411. .searchresult {
  412. list-style: none;
  413. }
  414. .searchresult li a {
  415. color:#346ec5;
  416. }
  417. .searchresult .shortdesclink {
  418. margin: .3em .5em 0 0;
  419. }
  420. .wh_search_expression{
  421. font-weight:bold;
  422. }
  423. /* Search relative path */
  424. .searchresult li .relativePath a {
  425. color: #006621;
  426. }
  427. /*--------- Search results breadcrumb ----------*/
  428. .search-breadcrumb li a {
  429. background: #ECF2F9;
  430. }
  431. .search-breadcrumb li .title:before,
  432. .search-breadcrumb li .title:after {
  433. border-color: #ECF2F9;
  434. }
  435. .search-breadcrumb li .title:before {
  436. border-left-color: transparent;
  437. }
  438. .search-breadcrumb li .title:after {
  439. border-color: transparent;
  440. border-left-color: #ECF2F9;
  441. }
  442. /*
  443. * ------------------------------------------------------------------
  444. *
  445. * Index terms.
  446. *
  447. */
  448. .wh_index_terms span.wh_first_letter {
  449. color: #346ec5;
  450. }
  451. .wh_index_terms #indexList{
  452. padding:0;
  453. }
  454. /*
  455. * ------------------------------------------------------------------
  456. *
  457. * Tree TOC for the main page.
  458. *
  459. */
  460. .wh_main_page_toc{
  461. }
  462. .wh_main_page_toc .expanded, .wh_main_page_toc .wh_main_page_toc_accordion_header:hover, .wh_main_page_toc>.wh_main_page_toc_entry:hover, .wh_main_page_toc_accordion_entries{
  463. background-color: #F2F8FF;
  464. }
  465. /**
  466. *
  467. * Styles used for RTL pages
  468. *
  469. */
  470. html[dir='rtl'] .wh_top_menu ul li:hover > ul {
  471. max-width: 270px;
  472. }