print.css 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720
  1. body {
  2. font-family: arial, verdana, helvetica, sans-serif;
  3. font-size: 12px;
  4. color: #000;
  5. margin: 0;
  6. padding: 0;
  7. background-color: #fff;
  8. }
  9. img {
  10. border: none;
  11. }
  12. #outerframe {
  13. position: relative; /* do not remove, fixes a bug in IE */
  14. border: 1px solid #fff;
  15. background-color: #fff;
  16. }
  17. /* Hides from IE5-mac \*/
  18. * html #outerframe {
  19. height: 1%;
  20. }
  21. /* End hide from IE5-mac */
  22. /*****************************************************
  23. * HEADER STYLES *
  24. *****************************************************/
  25. #my_courses {
  26. background-color: #fff;
  27. color: #009;
  28. }
  29. #my_courses {
  30. display: none;
  31. }
  32. .subnav {
  33. display: none;
  34. }
  35. #toolshortcuts {
  36. display:none;
  37. }
  38. /*****************************************************
  39. * FOOTER STYLES *
  40. *****************************************************/
  41. #footer {
  42. padding: 8px;
  43. border-top: 1px solid #4171B5;
  44. background-color: #E5EDF9;
  45. font-size: 12px;
  46. }
  47. /* "menu" doesn't show in printed version*/
  48. .menu {
  49. display: none;
  50. }
  51. #lang_form {
  52. text-align: left;
  53. font-size: 12px;
  54. margin: 2px 0 10px 0;
  55. padding: 2px;
  56. }
  57. #lang_form input, #lang_form select {
  58. font-size: 12px;
  59. }
  60. #formLogin label {
  61. font-size: 12px;
  62. margin: 4px 6px;
  63. }
  64. #formLogin input {
  65. font-size: 13px;
  66. margin: 4px 6px;
  67. }
  68. #login_fail {
  69. margin: 0 6px 6px 6px;
  70. padding: 4px;
  71. border: 1px solid #f00;
  72. background-color: #fff;
  73. font-size: 12px;
  74. color: #f00;
  75. }
  76. /*** layout divs for course and tool pages (being tested in some pages) ****/
  77. #contentfloatholder {/* also makes the right "sliding" tab */
  78. /*background: url(../pics/sidebar-r.gif) repeat-y 100% 0;
  79. background: url(../pics/bg_fountain.jpg) no-repeat 100% 0; */
  80. float: left;
  81. width: 100%;
  82. position: relative;
  83. }
  84. #contentfloatholder:after {
  85. /* this is for NN6 to clear floats */
  86. content: ".";
  87. display: block;
  88. height: 0;
  89. clear: both;
  90. visibility: hidden;
  91. }
  92. #centerwrap {
  93. float: left;
  94. width: 100%;
  95. margin-right: -95%;/* this needs to be less than 100% for Moz/Mac which thinks
  96. it's empty otherwise. The difference is made up by putting a
  97. negative left margin on the left float:
  98. Note IE/Mac doesn't like this method ~ it wants the 100% so it can
  99. be fed in using IE only CSS below becasue IE/Win also works with the 100% method.
  100. */
  101. }
  102. /*no navigation options need to be showed in the print version */
  103. #toolnav {
  104. display:none;
  105. }
  106. /* Hide from IE5-mac. Only IE-win sees this. \*/
  107. * html #toolnav {
  108. margin-right: 0;
  109. }
  110. * html #center {
  111. height: 1%;
  112. margin-left: 0;
  113. }
  114. /* End hide from IE5/mac */
  115. /* various sections in course-home.php file */
  116. #toolremove {
  117. width: 40%;
  118. color: #f00;
  119. font-weight: bold;
  120. margin: 10px auto;
  121. padding: 10px;
  122. border: 2px solid #f00;
  123. }
  124. #courseintro {
  125. clear: both;
  126. width: 80%;
  127. margin: 10px auto;
  128. padding: 10px;
  129. border-bottom: 1px solid #4171B5;
  130. }
  131. #courseintro_icons {
  132. clear: both;
  133. width: 80%;
  134. margin: 10px auto;
  135. }
  136. .everybodyview {
  137. position: relative; /* to avoid the IE peekabo bug ?*/
  138. width: 80%;
  139. margin: 10px auto;
  140. padding: 10px;
  141. }
  142. .courseadminview, .platformadminview {
  143. position: relative;
  144. width: 80%;
  145. margin: 25px auto 10px;
  146. padding: 10px;
  147. border: 1px solid #4171B5;
  148. }
  149. .viewcaption {
  150. position: relative;
  151. top: -20px;
  152. font-size: 12px;
  153. font-weight: bold;
  154. color: #4171B5;
  155. background-color: #fff;
  156. padding: 0 4px;
  157. }
  158. /* normal and error message-box */
  159. .normal-message, .error-message {
  160. position: relative;
  161. margin: 10px auto 10px -250px;
  162. width: 500px;
  163. left: 50%;
  164. right: 50%;
  165. border: 1px solid;
  166. padding: 5px;
  167. }
  168. .normal-message {
  169. border: 1px solid #FF8001;
  170. color: #000;
  171. background-color: #FDC77E;
  172. }
  173. .error-message {
  174. border: 1px solid #3F70AC;
  175. color: #000;
  176. background-color: #FDC273;
  177. }
  178. #message {
  179. margin: 0 auto;
  180. text-align: center;
  181. }
  182. #message select {
  183. margin: 10px 0;
  184. width: 220px;
  185. }
  186. #message textarea {
  187. margin: 10px 0;
  188. }
  189. #message td {
  190. padding: 4px;
  191. }
  192. /* styles from the document.php file */
  193. .comment {
  194. margin-left: 30px;
  195. }
  196. .invisible {
  197. color: #999;
  198. }
  199. .invisible a:link, .invisible a:visited {
  200. color: #999;
  201. }
  202. a.invisible:link, a.invisible:visited {
  203. color: #999;
  204. }
  205. /* styles from the upload.php file */
  206. dl.upload_option {
  207. margin: 1em 0;
  208. padding: 0;
  209. }
  210. .upload_option dt {
  211. font-weight:bold;
  212. margin:0;
  213. }
  214. .upload_option dd {
  215. margin:0;
  216. }
  217. /* styles from dropbox.php file */
  218. .dropbox_detail {
  219. font-size: small
  220. }
  221. .dropbox_date {
  222. font-style: italic
  223. }
  224. .dropbox_person {
  225. font-weight: bold
  226. }
  227. .dropbox_listTitle {
  228. color: #000000;
  229. }
  230. .dropbox_feedback {
  231. font-size: x-small;
  232. height: 50px;
  233. width: 200px;
  234. overflow: auto
  235. }
  236. .dropbox_feedbacks {
  237. height: 250px;
  238. width: 100%;
  239. overflow: auto
  240. }
  241. /* styles for chat / conference tools */
  242. #chat_entermessage {
  243. background-color: #D6E5FA;
  244. border-top: 1px solid #4171B5;
  245. padding: 5px;
  246. margin: 0;
  247. }
  248. /* styles for general formatting */
  249. .clear {
  250. clear: both;
  251. line-height: 0;
  252. height: 0;
  253. }
  254. p, blockquote, ol, ul {
  255. font-size: 12px;
  256. }
  257. h1 {
  258. font-size: 21px;
  259. }
  260. h2 {
  261. font-size: 18px;
  262. }
  263. h3 {
  264. font-size: 15px;
  265. margin-top:0;
  266. padding-top:0;
  267. }
  268. h4 {
  269. font-size: 12px;
  270. }
  271. h5, h6 {
  272. font-family: verdana, arial, helvetica, sans-serif;
  273. }
  274. /* the following for regular <a> elements */
  275. a:link {
  276. text-decoration: none;
  277. font-weight : bold;
  278. color : #4171b5;
  279. }
  280. a:visited {
  281. text-decoration: none;
  282. font-weight : bold;
  283. color : #4171b5;
  284. }
  285. a:active {
  286. text-decoration: none;
  287. font-weight : bold;
  288. color : #f00;
  289. }
  290. input.link_alike {
  291. background-color: #FFFFFF;
  292. border-width: 0;
  293. color: #4171b5;
  294. font-weight: bold;
  295. text-align: left;
  296. padding: 0;
  297. margin: 0;
  298. }
  299. input.link_alike:hover {
  300. background-color: #FFFFFF;
  301. border-width: 0;
  302. color: #FF0000;
  303. font-weight: bold;
  304. text-align: left;
  305. padding: 0;
  306. margin: 0;
  307. }
  308. /* the following for the greyed out elements */
  309. a.nobold:link, a.nobold:visited, a.nobold:active {
  310. font-weight: normal;
  311. color: #999;
  312. margin: 0 0 0 25px;
  313. }
  314. a.nobold:hover {
  315. font-weight: normal;
  316. color: #999;
  317. text-decoration: underline;
  318. margin: 0 0 0 25px;
  319. }
  320. .note {
  321. margin: 6px;
  322. font-size: 12px;
  323. line-height: 14px;
  324. font-family: verdana, arial, helvetica, sans-serif;
  325. background-color: #FFF089;
  326. color: #4171B5;
  327. border: 1px solid #4171B5;
  328. padding: 4px;
  329. }
  330. .alternativeBgLight {
  331. background-color: #f5f5f5;
  332. border: 1px solid #4171B5;
  333. border-collapse: collapse;
  334. }
  335. .alternativeBgDark {
  336. background-color: #ccf;
  337. border: 1px solid #4171B5;
  338. border-collapse: collapse;
  339. }
  340. .myagendatoday {
  341. background-color: #FFCA8D;
  342. border-collapse: collapse;
  343. font-family: verdana, arial, helvetica, sans-serif;
  344. color: #CC3300;
  345. font-weight: bold;
  346. }
  347. /*****************************************************
  348. * FORM STYLES *
  349. *****************************************************/
  350. div.row {
  351. clear: both;
  352. padding-top: 5px;
  353. }
  354. div.row div.form_header {
  355. white-space: nowrap;
  356. padding: 2px;
  357. background-color: #E5EDF9;
  358. border: 1px solid #4271B5;
  359. }
  360. div.row div.label {
  361. display: inline;
  362. float: left;
  363. width: 18%;
  364. text-align: right;
  365. }
  366. div.row div.formw {
  367. display: inline;
  368. width: 80%;
  369. }
  370. [dir=ltr] div.row div.label, [dir=rtl] div.row div.formw {
  371. float: left;
  372. text-align: right;
  373. }
  374. [dir=rtl] div.row div.label, [dir=ltr] div.row div.formw {
  375. float: right;
  376. text-align: left;
  377. }
  378. span.form_required {
  379. color: #f00;
  380. }
  381. span.form_error {
  382. color: #f00;
  383. font-size: x-small;
  384. margin: 2px;
  385. }
  386. /* Form elements - some general styling */
  387. select, textarea {
  388. color : #000;
  389. border: 1px solid #000;
  390. }
  391. input.checkbox {
  392. border-width: 0;
  393. }
  394. input.mainoption {
  395. font-weight : bold;
  396. } /* Main submit button */
  397. input.liteoption {
  398. font-weight : normal;
  399. } /* None-bold submit button */
  400. select, input[type=checkbox], input[type=radio], input[type=button], input[type=submit] {
  401. cursor: pointer;
  402. font-size: 12px;
  403. }
  404. input[text] {
  405. font-size: 12px;
  406. }
  407. /************************************************************
  408. styles below here are not necessarily used in the current
  409. release and the CVS files, they are from earlier versions,
  410. and have been left untouched for anyone needing them in
  411. their own platform ...
  412. *************************************************************/
  413. .topBanner a:link, .topBanner a:active, .topBanner a:visited {
  414. text-decoration:none;
  415. color:white;
  416. }
  417. .topBanner table {
  418. text-decoration:none;
  419. }
  420. .topBanner a:hover {
  421. text-decoration:underline;
  422. }
  423. .topBanner td {
  424. border-top: solid White 1px;
  425. }
  426. .alternativeBgLight {
  427. background-color: #f5f5f5;
  428. }
  429. .alternativeBgDark {
  430. background-color: #e6e6e6
  431. }
  432. .forms {
  433. letter-spacing: normal;
  434. text-align: justify;
  435. text-indent: 3pt;
  436. word-spacing: normal;
  437. padding: 2px 5px;
  438. }
  439. .formsTips {
  440. text-align: justify;
  441. text-indent: 15pt;
  442. word-spacing: normal;
  443. }
  444. /*
  445. input.forms { letter-spacing: normal; text-align: justify; text-indent: 3pt; word-spacing: normal;
  446. padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px;}
  447. */
  448. .warn {
  449. border: thin double Silver;
  450. margin-left: 15px;
  451. margin-right: 15px;
  452. font-family: serif;
  453. color: Red;
  454. padding-left: 25px;
  455. }
  456. .small {
  457. font-family: Verdana, Arial, Helvetica, sans-serif;
  458. font-size: 11px
  459. }
  460. .xsmall {
  461. font-family: Verdana, Arial, Helvetica, sans-serif;
  462. font-size: 11px
  463. }
  464. .xxsmall {
  465. font-family: Verdana, Arial, Helvetica, sans-serif;
  466. font-size: 9px
  467. }
  468. /*****************************************************
  469. * DATA TABLE STYLES *
  470. *****************************************************/
  471. .cell_header {
  472. background-color: #EEEEFF;
  473. font-weight:bold;
  474. text-align:left;
  475. padding-left:5px;
  476. } /* header cell in data table in tools */
  477. .data_table {
  478. border-collapse: collapse;
  479. width: 100%;
  480. padding: 5px;
  481. }
  482. .data_table th {
  483. /*padding-right: 20px;*/
  484. border: 1px solid gray;
  485. background-color: #E5EDF9;
  486. text-align: left;
  487. }
  488. .data_table tr.row_odd {
  489. background-color: #fafafa;
  490. }
  491. .data_table tr.row_odd:hover, .data_table tr.row_even:hover {
  492. background-color: #f0f0f0;
  493. }
  494. .data_table tr.row_even {
  495. background-color: #fff;
  496. }
  497. .data_table td .highlight {
  498. font-weight: bold;
  499. }
  500. .data_table td {
  501. padding: 5px;
  502. border-bottom: 1px solid #b0b0b0;
  503. border-right: 1px dotted #e1e1e1;
  504. border-left: 1px dotted #e1e1e1;
  505. text-align: left;
  506. }
  507. .data_table_no_border {
  508. border-collapse: collapse;
  509. border-spacing: 0;
  510. font-size: 12px;
  511. margin-bottom: 15px;
  512. margin-top: 8px;
  513. text-align: left;
  514. width: 100%;
  515. }
  516. .data_table_no_border td {
  517. line-height: normal;
  518. padding: 6px;
  519. text-align: left;
  520. vertical-align: middle;
  521. }
  522. .data_table_no_border .highlight {
  523. font-weight: bold;
  524. }
  525. /* admin page tool list definitions */
  526. .tool_list dt {
  527. font-weight: bold;
  528. }
  529. .tool_list dd {
  530. margin: 0;
  531. padding: 4px 0 0 10px;
  532. }
  533. /* divs for category list / platform news on home page */
  534. .home_cats {
  535. width: 45%;
  536. float: left;
  537. position: relative;
  538. margin: 0;
  539. padding: 8px 0 0;
  540. background: #fff;
  541. }
  542. .home_news {
  543. width: 45%;
  544. float: right;
  545. position: relative;
  546. margin: 0;
  547. padding: 8px 0 0;
  548. background: #fff;
  549. }
  550. label.left {
  551. float: left;
  552. width: 15em;
  553. margin: 0 0 0.5em 0;
  554. }
  555. form br {
  556. clear: both;
  557. }
  558. /* Fix for alignment problem in IE-Win browsers */
  559. /* Hide from IE5-mac. Only IE-win sees this. \*/
  560. * html .label {
  561. margin-right: 10px;
  562. }
  563. * html .data {
  564. height: 1%;
  565. margin-left: 0;
  566. }
  567. /* End hide from IE5/mac */
  568. .radio, .checkbox {
  569. margin: 0;
  570. padding: 0;
  571. border: none;
  572. background-color: transparent;
  573. }
  574. .required {
  575. color: #f00;
  576. font-weight: bold;
  577. }
  578. /* Admin section */
  579. div.admin_section {
  580. width: 40%;
  581. float: left;
  582. padding: 5px;
  583. margin: 10px 20px;
  584. }
  585. div.admin_section h4 {
  586. margin: 0;
  587. border-bottom: 1px solid gray;
  588. width: 100%;
  589. }
  590. .user_course_category {
  591. background-color: #efefef;
  592. border: 1px solid #666;
  593. font-weight: bold;
  594. color: #666;
  595. list-style-type: none;
  596. margin: 5px;
  597. padding: 5px;
  598. }
  599. /* Styles for the Dokeos Config Settings of the platform admin section*/
  600. .sectiontitle {
  601. background-color: #EFEFEF;
  602. border: 1px solid #cccccc;
  603. font-weight: bold;
  604. color: #666666;
  605. list-style-type: none;
  606. margin: 5px;
  607. padding: 5px;
  608. font-size: 11px;
  609. }
  610. .sectioncomment {
  611. color: #000000;
  612. margin: 5px;
  613. padding: 5px;
  614. font-size: 11px;
  615. }
  616. .sectionvalue {
  617. list-style-type: none;
  618. margin: 5px;
  619. padding: 5px;
  620. }
  621. /* New Announcements Tool */
  622. .announcements_datum {
  623. font-size: 12px;
  624. font-style: italic;
  625. color: #666666;
  626. }
  627. /* System announcements on homepage */
  628. div.system_announcements {
  629. }
  630. div.system_announcements h3 {
  631. }
  632. div.system_announcement {
  633. margin: 5px;
  634. }
  635. div.system_announcement_title {
  636. }
  637. div.system_announcement_content {
  638. margin-left: 20px;
  639. border-left: 1px solid gray;
  640. padding-left: 5px;
  641. }
  642. /*****************************************************
  643. * special print ccs classes *
  644. *****************************************************/
  645. a.full_url_print:after {
  646. content: "(" attr(href) ")";
  647. font-size: 75%;
  648. }
  649. /* to make it in visible in the printed version*/
  650. .print_invisible {
  651. display:none;
  652. }
  653. /* New print CSS */
  654. .pdf-header{
  655. border-bottom: 1px solid #CCC;
  656. margin-bottom: 100px;
  657. }
  658. .pdf-header .logo a img{
  659. width: 100px;
  660. }
  661. table{
  662. display: block;
  663. width: 100%;
  664. }
  665. table th,
  666. table td {
  667. padding: 5px;
  668. }
  669. table.full-width {
  670. width: 100%;
  671. }
  672. table.border-thin,
  673. table.border-thin th,
  674. table.border-thin td {
  675. border: 1px solid #000;
  676. border-collapse: collapse;
  677. }
  678. .text-center {
  679. text-align: center;
  680. }
  681. .text-left {
  682. text-align: left;
  683. }
  684. .text-right {
  685. text-align: right;
  686. }
  687. table.page-footer {
  688. font-family: serif;
  689. font-size: 10pt;
  690. }
  691. table.page-footer td{
  692. padding: 0;
  693. }
  694. .border-top {
  695. border-top: 1px solid #000;
  696. }
  697. .border-bottom {
  698. border-bottom: 1px solid #000;
  699. }