style.css 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737
  1. /*
  2. Theme Name: SLOODLE Blog
  3. Theme URI: http://www.sloodle.org
  4. Description: Theme for the SLOODLE official blog
  5. Version: 1.6
  6. Author: Peter R. Bloomfield (based on the default theme, and on EduMoodle)
  7. Author URI: http://peter.avid-insight.co.uk
  8. Tags: sloodle
  9. */
  10. body {
  11. font-size: 62.5%; /* Resets 1em to 10px */
  12. font-size:80%;
  13. font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
  14. color: #333;
  15. text-align: center;
  16. min-width: 970px;
  17. background-color:#4FADDC;
  18. background-image: url('/css/bg.png');
  19. background-repeat: repeat-x;
  20. }
  21. #page {
  22. margin:0 auto;
  23. margin-top: 20px;
  24. width:970px;
  25. text-align: left;
  26. }
  27. #page hr {
  28. color: #fff;
  29. border: 0;
  30. }
  31. .clearfix {
  32. min-width: 0;
  33. /* overflow: hidden; */
  34. }
  35. .clearfix:after {
  36. /* content: "<!-- -->"; */
  37. content: ".";
  38. display: block;
  39. height: 0;
  40. clear: both;
  41. visibility: hidden;
  42. }
  43. /* .clearfix {display: inline-table;} */
  44. /* Hides from IE-mac \*/
  45. * html .clearfix {height: 1%;}
  46. .clearfix {display: block;}
  47. /* End hide from IE-mac */
  48. #header {
  49. }
  50. .headermain, h1.headermain {
  51. float:left;
  52. margin:2px;
  53. padding:10px;
  54. margin-left: 20px;
  55. color: #fff;
  56. background-image: url('/css/logo.png');
  57. background-repeat: no-repeat;
  58. height: 130px;
  59. width: 500px;
  60. }
  61. .headermenu {
  62. float:right;
  63. text-align:right;
  64. padding:10px;
  65. }
  66. #header-home {
  67. background-image: url('/css/header.png');
  68. background-repeat: no-repeat;
  69. height: 156px;
  70. border-bottom: 5px solid #F57110;
  71. }
  72. .menubar {
  73. background-image:url('/css/navbg.gif');
  74. width: 970px;
  75. border-top: 4px solid #F57110;
  76. }
  77. #content_table
  78. {
  79. border-style:none;
  80. border-collapse:collapse;
  81. background-color:#ffffff;
  82. vertical-align:top;
  83. }
  84. #content_table .main
  85. {
  86. width:780px;
  87. vertical-align:top;
  88. padding-left:32px;
  89. padding-right:80px;
  90. }
  91. #content_table .sidebar
  92. {
  93. width:190px;
  94. vertical-align:top;
  95. }
  96. #content {
  97. width:450px;
  98. background-color:#ffffff;
  99. }
  100. .widecolumn .entry p {
  101. font-size: 1.05em;
  102. }
  103. .narrowcolumn {
  104. }
  105. .narrowcolumn .entry, .widecolumn .entry {
  106. line-height: 1.4em;
  107. }
  108. .widecolumn {
  109. line-height: 1.6em;
  110. }
  111. .narrowcolumn .postmetadata {
  112. text-align: center;
  113. }
  114. .alt {
  115. background-color: #f8f8f8;
  116. border-top: 1px solid #ddd;
  117. border-bottom: 1px solid #ddd;
  118. }
  119. #footer {
  120. text-align:center;
  121. margin-top: 0px;
  122. background-image: url('/css/footer.png');
  123. background-position: top left;
  124. height: 85px;
  125. border-top: 5px solid #F57110;
  126. clear: both;
  127. }
  128. #footer_info {
  129. text-align:center;
  130. font-size:100%;
  131. padding-top:0px;
  132. margin-top:0px;
  133. background-color:#4FADDC;
  134. }
  135. small {
  136. font-family: Arial, Helvetica, Sans-Serif;
  137. font-size: 0.9em;
  138. line-height: 1.5em;
  139. }
  140. h1, h2, h3 {
  141. font-family: 'Trebuchet MS', 'Lucida Grande', Verdana, Arial, Sans-Serif;
  142. font-weight: bold;
  143. }
  144. h1 {
  145. font-size: 4em;
  146. text-align: center;
  147. }
  148. #headerimg .description {
  149. font-size: 1.2em;
  150. text-align: center;
  151. }
  152. h2 {
  153. font-size: 1.6em;
  154. }
  155. h2.pagetitle {
  156. font-size: 1.6em;
  157. }
  158. #sidebar h2 {
  159. font-family: 'Lucida Grande', Verdana, Sans-Serif;
  160. font-size: 1.2em;
  161. }
  162. h3 {
  163. font-size: 1.3em;
  164. }
  165. h1, h1 a, h1 a:hover, h1 a:visited, #headerimg .description {
  166. text-decoration: none;
  167. color: white;
  168. }
  169. h2, h2 a, h2 a:visited, h3, h3 a, h3 a:visited {
  170. color: #333;
  171. }
  172. h2, h2 a, h2 a:hover, h2 a:visited, h3, h3 a, h3 a:hover, h3 a:visited, #sidebar h2, #wp-calendar caption, cite {
  173. text-decoration: none;
  174. }
  175. .entry p a:visited {
  176. color: #b85b5a;
  177. }
  178. .commentlist li, #commentform input, #commentform textarea {
  179. font: 0.9em 'Lucida Grande', Verdana, Arial, Sans-Serif;
  180. }
  181. .commentlist li {
  182. font-weight: bold;
  183. }
  184. .commentlist li .avatar {
  185. float: right;
  186. border: 1px solid #eee;
  187. padding: 2px;
  188. background: #fff;
  189. }
  190. .commentlist cite, .commentlist cite a {
  191. font-weight: bold;
  192. font-style: normal;
  193. font-size: 1.1em;
  194. }
  195. .commentlist p {
  196. font-weight: normal;
  197. line-height: 1.5em;
  198. text-transform: none;
  199. }
  200. #commentform p {
  201. font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif;
  202. }
  203. .commentmetadata {
  204. font-weight: normal;
  205. }
  206. #sidebar {
  207. font: 1em 'Lucida Grande', Verdana, Arial, Sans-Serif;
  208. }
  209. small, #sidebar ul ul li, #sidebar ul ol li, .nocomments, .postmetadata, blockquote, strike {
  210. color: #777;
  211. }
  212. code {
  213. font: 1.1em 'Courier New', Courier, Fixed;
  214. }
  215. acronym, abbr, span.caps
  216. {
  217. font-size: 0.9em;
  218. letter-spacing: .07em;
  219. }
  220. a, h2 a:hover, h3 a:hover {
  221. color: #06c;
  222. text-decoration: none;
  223. }
  224. a:hover {
  225. color: #147;
  226. text-decoration: underline;
  227. }
  228. #wp-calendar #prev a, #wp-calendar #next a {
  229. font-size: 9pt;
  230. }
  231. #wp-calendar a {
  232. text-decoration: none;
  233. }
  234. #wp-calendar caption {
  235. font: bold 1.3em 'Lucida Grande', Verdana, Arial, Sans-Serif;
  236. text-align: center;
  237. }
  238. #wp-calendar th {
  239. font-style: normal;
  240. text-transform: capitalize;
  241. }
  242. /* Layout */
  243. .narrowcolumn {
  244. padding: 0 0 20px 45px;
  245. margin: 0px 0 0;
  246. width: 780px;
  247. background-color:#ffffff;
  248. }
  249. .widecolumn {
  250. padding: 10px 0 20px 0;
  251. margin: 5px 0 0 150px;
  252. width: 780px;
  253. background-color:#ffffff;
  254. }
  255. .post {
  256. margin: 0 0 40px;
  257. text-align: justify;
  258. }
  259. .post hr {
  260. display: block;
  261. }
  262. .widecolumn .post {
  263. margin: 0;
  264. }
  265. .narrowcolumn .postmetadata {
  266. padding-top: 5px;
  267. }
  268. .widecolumn .postmetadata {
  269. margin: 30px 0;
  270. }
  271. .widecolumn .smallattachment {
  272. text-align: center;
  273. float: left;
  274. width: 128px;
  275. margin: 5px 5px 5px 0px;
  276. }
  277. .widecolumn .attachment {
  278. text-align: center;
  279. margin: 5px 0px;
  280. }
  281. .postmetadata {
  282. clear: both;
  283. }
  284. .clear {
  285. clear: both;
  286. }
  287. #footer p {
  288. margin: 0;
  289. padding: 20px 0;
  290. text-align: center;
  291. }
  292. /* Begin Headers */
  293. h1 {
  294. padding-top: 70px;
  295. margin: 0;
  296. }
  297. h2 {
  298. margin: 30px 0 0;
  299. }
  300. h2.pagetitle {
  301. margin-top: 30px;
  302. text-align: center;
  303. }
  304. #sidebar h2 {
  305. margin: 5px 0 0;
  306. padding: 0;
  307. }
  308. h3 {
  309. padding: 0;
  310. margin: 30px 0 0;
  311. }
  312. h3.comments {
  313. padding: 0;
  314. margin: 40px auto 20px ;
  315. }
  316. /* End Headers */
  317. /* Begin Images */
  318. p img {
  319. padding: 0;
  320. max-width: 100%;
  321. }
  322. /* Using 'class="alignright"' on an image will (who would've
  323. thought?!) align the image to the right. And using 'class="centered',
  324. will of course center the image. This is much better than using
  325. align="center", being much more futureproof (and valid) */
  326. img.centered {
  327. display: block;
  328. margin-left: auto;
  329. margin-right: auto;
  330. }
  331. img.alignright {
  332. padding: 4px;
  333. margin: 0 0 2px 7px;
  334. display: inline;
  335. }
  336. img.alignleft {
  337. padding: 4px;
  338. margin: 0 7px 2px 0;
  339. display: inline;
  340. }
  341. .alignright {
  342. float: right;
  343. }
  344. .alignleft {
  345. float: left
  346. }
  347. /* End Images */
  348. /* Begin Lists
  349. Special stylized non-IE bullets
  350. Do not work in Internet Explorer, which merely default to normal bullets. */
  351. html>body .entry ul {
  352. margin-left: 0px;
  353. padding: 0 0 0 30px;
  354. list-style: none;
  355. padding-left: 10px;
  356. text-indent: -10px;
  357. }
  358. html>body .entry li {
  359. margin: 7px 0 8px 10px;
  360. }
  361. .entry ul li:before, #sidebar ul ul li:before {
  362. content: "\00BB \0020";
  363. }
  364. .entry ol {
  365. padding: 0 0 0 35px;
  366. margin: 0;
  367. }
  368. .entry ol li {
  369. margin: 0;
  370. padding: 0;
  371. }
  372. .postmetadata ul, .postmetadata li {
  373. display: inline;
  374. list-style-type: none;
  375. list-style-image: none;
  376. }
  377. #sidebar ul, #sidebar ul ol {
  378. margin: 0;
  379. padding: 0;
  380. }
  381. #sidebar ul li {
  382. list-style-type: none;
  383. list-style-image: none;
  384. margin-bottom: 15px;
  385. }
  386. #sidebar ul p, #sidebar ul select {
  387. margin: 5px 0 8px;
  388. }
  389. #sidebar ul ul, #sidebar ul ol {
  390. margin: 5px 0 0 10px;
  391. }
  392. #sidebar ul ul ul, #sidebar ul ol {
  393. margin: 0 0 0 10px;
  394. }
  395. ol li, #sidebar ul ol li {
  396. list-style: decimal outside;
  397. }
  398. #sidebar ul ul li, #sidebar ul ol li {
  399. margin: 3px 0 0;
  400. padding: 0;
  401. }
  402. /* End Entry Lists */
  403. /* Begin Form Elements */
  404. #searchform {
  405. margin: 10px auto;
  406. padding: 5px 3px;
  407. text-align: center;
  408. }
  409. #sidebar #searchform #s {
  410. width: 108px;
  411. padding: 2px;
  412. }
  413. #sidebar #searchsubmit {
  414. padding: 1px;
  415. }
  416. .entry form { /* This is mainly for password protected posts, makes them look better. */
  417. text-align:center;
  418. }
  419. select {
  420. width: 130px;
  421. }
  422. #commentform input {
  423. width: 170px;
  424. padding: 2px;
  425. margin: 5px 5px 1px 0;
  426. }
  427. #commentform textarea {
  428. width: 100%;
  429. padding: 2px;
  430. }
  431. #commentform #submit {
  432. margin: 0;
  433. float: right;
  434. }
  435. /* End Form Elements */
  436. /* Begin Comments*/
  437. .alt {
  438. margin: 0;
  439. padding: 10px;
  440. }
  441. .commentlist {
  442. padding: 0;
  443. text-align: justify;
  444. }
  445. .commentlist li {
  446. margin: 15px 0 3px;
  447. padding: 5px 10px 3px;
  448. list-style: none;
  449. }
  450. .commentlist p {
  451. margin: 10px 5px 10px 0;
  452. }
  453. #commentform p {
  454. margin: 5px 0;
  455. }
  456. .nocomments {
  457. text-align: center;
  458. margin: 0;
  459. padding: 0;
  460. }
  461. .commentmetadata {
  462. margin: 0;
  463. display: block;
  464. }
  465. /* End Comments */
  466. /* Begin Sidebar */
  467. #sidebar
  468. {
  469. padding: 20px 0 10px 0;
  470. width: 190px;
  471. background-color:#ffffff;
  472. }
  473. #sidebar form {
  474. margin: 0;
  475. }
  476. /* End Sidebar */
  477. /* Begin Calendar */
  478. #wp-calendar {
  479. empty-cells: show;
  480. margin: 10px auto 0;
  481. width: 155px;
  482. }
  483. #wp-calendar #next a {
  484. padding-right: 10px;
  485. text-align: right;
  486. }
  487. #wp-calendar #prev a {
  488. padding-left: 10px;
  489. text-align: left;
  490. }
  491. #wp-calendar a {
  492. display: block;
  493. }
  494. #wp-calendar caption {
  495. text-align: center;
  496. width: 100%;
  497. }
  498. #wp-calendar td {
  499. padding: 3px 0;
  500. text-align: center;
  501. }
  502. #wp-calendar td.pad:hover { /* Doesn't work in IE */
  503. background-color: #fff; }
  504. /* End Calendar */
  505. /* Begin Various Tags & Classes */
  506. acronym, abbr, span.caps {
  507. cursor: help;
  508. }
  509. acronym, abbr {
  510. border-bottom: 1px dashed #999;
  511. }
  512. blockquote {
  513. margin: 15px 30px 0 10px;
  514. padding-left: 20px;
  515. border-left: 5px solid #ddd;
  516. }
  517. blockquote cite {
  518. margin: 5px 0 0;
  519. display: block;
  520. }
  521. .center {
  522. text-align: center;
  523. }
  524. .hidden {
  525. display: none;
  526. }
  527. hr {
  528. display: none;
  529. }
  530. a img {
  531. border: none;
  532. }
  533. .navigation {
  534. display: block;
  535. text-align: center;
  536. margin-top: 10px;
  537. margin-bottom: 60px;
  538. }
  539. /* End Various Tags & Classes*/
  540. /* Captions */
  541. .aligncenter,
  542. div.aligncenter {
  543. display: block;
  544. margin-left: auto;
  545. margin-right: auto;
  546. }
  547. .wp-caption {
  548. border: 1px solid #ddd;
  549. text-align: center;
  550. background-color: #f3f3f3;
  551. padding-top: 4px;
  552. margin: 10px;
  553. -moz-border-radius: 3px;
  554. -khtml-border-radius: 3px;
  555. -webkit-border-radius: 3px;
  556. border-radius: 3px;
  557. }
  558. .wp-caption img {
  559. margin: 0;
  560. padding: 0;
  561. border: 0 none;
  562. }
  563. .wp-caption p.wp-caption-text {
  564. font-size: 11px;
  565. line-height: 17px;
  566. padding: 0 4px 5px;
  567. margin: 0;
  568. }
  569. /* End captions */
  570. .wiki-import h1 {
  571. font-size:2em;
  572. color:black;
  573. text-align:left;
  574. padding-top: 10px;
  575. }