oxygen-red.css 10.0 KB

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