default.css 31 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217
  1. /*****************************************************
  2. * MAIN - CHAMILO CSS
  3. *****************************************************/
  4. /* Adding default style for the chamilo_X themes */
  5. @import url('../base_chamilo.css');
  6. /* the following for regular <a> elements */
  7. a {
  8. text-decoration: none;
  9. color :#666666;
  10. }
  11. a:visited {
  12. text-decoration: none;
  13. }
  14. a:hover {
  15. text-decoration: none;
  16. color: #9ABF00;
  17. }
  18. a:active {
  19. text-decoration: none;
  20. color : #3757f7;
  21. }
  22. .navbar .nav > li > a {
  23. float: none;
  24. line-height: 24px;
  25. padding-bottom: 13px;
  26. padding-right: 10px;
  27. padding-top: 13px;
  28. color: #FFFFFF;
  29. }
  30. .subnav .navbar-inner {
  31. -webkit-border-radius: 8px;
  32. -moz-border-radius: 8px;
  33. border-radius: 8px;
  34. border: 1px solid #59B800;
  35. background: #a0c400; /* Old browsers */
  36. background: -moz-linear-gradient(top, #a0c400 0%, #73a000 100%); /* FF3.6+ */
  37. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a0c400), color-stop(100%,#73a000)); /* Chrome,Safari4+ */
  38. background: -webkit-linear-gradient(top, #a0c400 0%,#73a000 100%); /* Chrome10+,Safari5.1+ */
  39. background: -o-linear-gradient(top, #a0c400 0%,#73a000 100%); /* Opera 11.10+ */
  40. background: -ms-linear-gradient(top, #a0c400 0%,#73a000 100%); /* IE10+ */
  41. background: linear-gradient(to bottom, #a0c400 0%,#73a000 100%); /* W3C */
  42. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a0c400', endColorstr='#73a000',GradientType=0 ); /* IE6-9 */
  43. }
  44. .subnav .nav > li > a {
  45. border-left: 1px solid #84AE00;
  46. border-right: 1px solid #78A400;
  47. color: white;
  48. font-weight: normal;
  49. font-size: 13px;
  50. }
  51. .subnav .nav > #current > a,
  52. .subnav .nav > #current > a:hover {
  53. color: #fff;
  54. background: #77A300;
  55. border-right-color: #78A400;
  56. }
  57. .subnav li a {
  58. color:#fff;
  59. }
  60. /* Green hover */
  61. .subnav .navbar-inner li a:hover {
  62. background: #77A300;
  63. color: #fff;
  64. }
  65. .well .nav-list > li > a:hover {
  66. text-decoration: none;
  67. background: none;
  68. }
  69. .sidebar-nav h4{
  70. color: #037FB2;
  71. padding-bottom: 3px;
  72. padding-left: 15px;
  73. padding-right: 15px;
  74. padding-top: 3px;
  75. }
  76. /*****************************************************
  77. * CHAMILO THEME STYLE *
  78. *****************************************************/
  79. .welcome-mascot{
  80. background: url(images/chamilo-welcome.png) no-repeat right 0;
  81. padding-right: 200px;
  82. padding-bottom: 2em;
  83. padding-top: 2em;
  84. }
  85. .nav-list > li > a {
  86. font-size: 14px;
  87. padding-bottom: 6px;
  88. /* padding-left: 15px;
  89. padding-right: 15px;*/
  90. padding-top: 6px;
  91. }
  92. a.thumbnail:hover{
  93. border: 1px solid #e5e5e5;
  94. background: transparent;
  95. }
  96. .logout img{
  97. padding-top: 7px;
  98. }
  99. .form-actions {
  100. background:transparent;
  101. }
  102. .breadcrumb a{
  103. line-height: 30px;
  104. text-transform: none;
  105. }
  106. .breadcrumb li{
  107. text-shadow: none;
  108. }
  109. .breadcrumb a.btn-mini{
  110. line-height: 25px;
  111. text-transform: none;
  112. }
  113. .breadcrumb a.btn-mini > .btn-success{
  114. color: #FFFFFF;
  115. }
  116. /* styles for the star rater */
  117. .star-rating{
  118. list-style:none;
  119. margin: 0px;
  120. padding:0px;
  121. width: 125px;
  122. height: 25px;
  123. position: relative;
  124. overflow:hidden;
  125. background: url(images/start-level.png) top left repeat-x;
  126. }
  127. .star-rating li{
  128. padding:0px;
  129. margin:0px;
  130. width:25px;
  131. height:25px;
  132. float: left;
  133. }
  134. .star-rating li a{
  135. display:block;
  136. width:25px;
  137. height: 25px;
  138. line-height:25px;
  139. text-decoration: none;
  140. text-indent: -9000px;
  141. z-index: 20;
  142. position: absolute;
  143. padding: 0px;
  144. overflow:hidden;
  145. }
  146. .star-rating li a:hover{
  147. background: url(images/start-level.png) left bottom;
  148. z-index: 2;
  149. left: 0px;
  150. border:none;
  151. }
  152. .star-rating a.one-star{
  153. left: 0px;
  154. }
  155. .star-rating a.one-star:hover{
  156. width:25px;
  157. }
  158. .star-rating a.two-stars{
  159. left:25px;
  160. }
  161. .star-rating a.two-stars:hover{
  162. width: 50px;
  163. }
  164. .star-rating a.three-stars{
  165. left: 50px;
  166. }
  167. .star-rating a.three-stars:hover{
  168. width: 75px;
  169. }
  170. .star-rating a.four-stars{
  171. left: 75px;
  172. }
  173. .star-rating a.four-stars:hover{
  174. width: 100px;
  175. }
  176. .star-rating a.five-stars{
  177. left: 100px;
  178. }
  179. .star-rating a.five-stars:hover{
  180. width: 125px;
  181. }
  182. .star-rating li.current-rating{
  183. background: url(images/start-level.png) left center;
  184. position: absolute;
  185. height: 25px;
  186. display: block;
  187. text-indent: -9000px;
  188. z-index: 1;
  189. }
  190. /*ICON INBOX*/
  191. .home-icon{
  192. background:url(images/icon-chamilo.png) no-repeat 0 0;
  193. background-size: 24px auto;
  194. padding-left: 30px;
  195. }
  196. .home-icon:hover,.messages-icon:hover, .invitations-icon:hover,.shared-profile-icon:hover,.friends-icon:hover,
  197. .browse-groups-icon:hover ,.search-icon:hover ,.myfiles-icon:hover {
  198. opacity: 0.8;
  199. }
  200. .messages-icon{
  201. background:url(images/icon-chamilo.png) no-repeat 0 -29px;
  202. background-size: 24px auto;
  203. padding-left: 30px;
  204. }
  205. .invitations-icon{
  206. background:url(images/icon-chamilo.png) no-repeat 0 -61px;
  207. background-size: 24px auto;
  208. padding-left: 30px;
  209. }
  210. .shared-profile-icon{
  211. background:url(images/icon-chamilo.png) no-repeat 0 -96px;
  212. background-size: 24px auto;
  213. padding-left: 30px;
  214. }
  215. .friends-icon{
  216. background:url(images/icon-chamilo.png) no-repeat 0 -130px;
  217. background-size: 24px auto;
  218. padding-left: 30px;
  219. }
  220. .browse-groups-icon{
  221. background:url(images/icon-chamilo.png) no-repeat 0 -163px;
  222. background-size: 24px auto;
  223. padding-left: 30px;
  224. }
  225. .search-icon {
  226. background:url(images/icon-chamilo.png) no-repeat 0 -198px;
  227. background-size: 24px auto;
  228. padding-left: 30px;
  229. }
  230. .myfiles-icon {
  231. background:url(images/icon-chamilo.png) no-repeat 0 -229px;
  232. background-size: 24px auto;
  233. padding-left: 30px;
  234. }
  235. /* END ICON INBOX */
  236. .nav-list > .active > a, .nav-list > .active > a:hover {
  237. color: #333333;
  238. background: none;
  239. text-shadow:none;
  240. }
  241. .social-menu .well .thumbnail{
  242. border: none;
  243. border-radius: none;
  244. box-shadow: none;
  245. }
  246. .invitation_confirm .thumbnail{
  247. border: 1px solid rgba(96, 165, 209, 0.1);
  248. -webkit-border-radius: 10px;
  249. -moz-border-radius: 10px;
  250. border-radius: 10px;
  251. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  252. display: block;
  253. line-height: 1;
  254. padding: 4px;
  255. background-color: #EEF5FA;
  256. }
  257. .invitation_confirm a.thumbnail:hover{
  258. border-color: rgba(96, 165, 209, 0.1);
  259. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  260. background-color: #FFFFFF;
  261. }
  262. .social-menu .well .thumbnail img{
  263. -webkit-border-radius: 10px;
  264. -moz-border-radius: 10px;
  265. border-radius: 10px;
  266. border: 2px solid #FFFFFF;
  267. }
  268. /* ANNOUNCEMENTS SLIDER */
  269. .pagerslide h2{
  270. font-size: 18px;
  271. background-color: #0191C7;
  272. color: #FFFFFF;
  273. padding-left: 15px;
  274. font-weight: normal;
  275. }
  276. #top_main_content #announcements .page-header{
  277. display: none;
  278. line-height: 1;
  279. }
  280. #top_main_content #announcements .span6 {
  281. width: 800px;
  282. }
  283. /* COURSE INTRO CONTENT */
  284. .page-course-intro{
  285. padding: 2em;
  286. border: 1px solid #DDDDDD;
  287. -webkit-border-radius: 10px;
  288. -moz-border-radius: 10px;
  289. border-radius: 10px;
  290. margin-bottom: 2em;
  291. }
  292. .page-course-intro ul{
  293. list-style-image:url(images/vineta.png);
  294. padding-top: 10px;
  295. }
  296. .page-course-intro a{
  297. color: #FD6600;
  298. }
  299. .page-course-intro a:hover{
  300. color: #FD6600;
  301. text-decoration: underline;
  302. }
  303. /* END OF COURSE INTRO*/
  304. .fc-header-title h2{
  305. color: #0191C7;
  306. }
  307. .fc-first .fc-widget-header{
  308. font-size: 14px;
  309. font-weight: normal;
  310. padding-top: 5px;
  311. padding-bottom: 5px;
  312. }
  313. .well {
  314. background-color: rgba(96,165,209, 0.1);
  315. border: 1px solid rgba(96,165,209, 0.1);
  316. border-radius: 8px;
  317. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05) inset;
  318. margin-bottom: 20px;
  319. min-height: 20px;
  320. padding: 20px 10px;
  321. }
  322. .sidebar-nav img{
  323. -webkit-border-radius: 10px;
  324. -moz-border-radius: 10px;
  325. border-radius: 10px;
  326. }
  327. #homepage .row .span9 h2{
  328. font-size: 26px;
  329. font-weight: bold;
  330. color: #0191C7;
  331. padding-bottom: 8px;
  332. }
  333. #homepage .row .span9 p,#homepage .row .span9 ol {
  334. color: #6E6E6E;
  335. }
  336. #homepage .row .span9 a{
  337. color: #0F466A;
  338. }
  339. #homepage .row .span9 a:hover{
  340. color: #FD6600;
  341. }
  342. .page-header h2{
  343. color: #0191C7;
  344. font-weight: normal;
  345. font-size: 20px;
  346. padding-left: 10px;
  347. width: 250px;
  348. }
  349. #course_tools .course-title-tools h3 {
  350. margin-top: 10px;
  351. color: #0191C7;
  352. font-weight: normal;
  353. }
  354. .page-header {
  355. border-bottom-color: #0191C7;
  356. border-bottom-style: solid;
  357. border-bottom-width: 1px;
  358. box-shadow: none;
  359. padding-bottom: 0px;
  360. }
  361. .well_border{
  362. background-color: rgba(96,165,209, 0.1);
  363. border: 1px solid rgba(96,165,209, 0.1);
  364. border-radius: 8px;
  365. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05) inset;
  366. margin-bottom: 20px;
  367. min-height: 20px;
  368. padding: 19px;
  369. }
  370. .well_border .row .span2 {
  371. width: 98px;
  372. }
  373. .well_border .row .span2 .thumbnail {
  374. background-color: #FFFFFF;
  375. background-image: none;
  376. }
  377. #hot_courses .row .span9 .well_border .row .span6{
  378. width: auto;
  379. }
  380. .categories-course-description h3{
  381. color: #0F466A;
  382. font-weight: normal;
  383. }
  384. #course_tools .content a {
  385. font-size: 12px;
  386. font-weight: normal;
  387. }
  388. #main_content .course-box .row .span7{
  389. width: 730px;
  390. }
  391. #main_content .course-box .row .span7 .row .span6 {
  392. width: 615px;
  393. }
  394. #main_content .course-box .row .span7 .row .span6 h3{
  395. font-size: 20px;
  396. }
  397. #course_category li, #hot_courses h5, .course_item h5, .categories-course-description h5, .course-box h5 {
  398. font-weight: normal;
  399. }
  400. /*****************************************************
  401. * STYLE THEME CHAMILO *
  402. *****************************************************/
  403. .welcome-mascot{
  404. background: url(images/chamilo-welcome.png) no-repeat right 0;
  405. padding-right: 200px;
  406. padding-bottom: 2em;
  407. padding-top: 2em;
  408. }
  409. .nav-list > li > a {
  410. font-size: 14px;
  411. padding-bottom: 6px;
  412. /* padding-left: 15px;
  413. padding-right: 15px;*/
  414. padding-top: 6px;
  415. }
  416. #settings .span6 .well_border {
  417. min-height: 300px;
  418. }
  419. .breadcrumb {
  420. margin-bottom: 0;
  421. background: #e0ff99; /* Old browsers */
  422. background: -moz-linear-gradient(top, #e0ff99 0%, #b7df2d 100%); /* FF3.6+ */
  423. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e0ff99), color-stop(100%,#b7df2d)); /* Chrome,Safari4+ */
  424. background: -webkit-linear-gradient(top, #e0ff99 0%,#b7df2d 100%); /* Chrome10+,Safari5.1+ */
  425. background: -o-linear-gradient(top, #e0ff99 0%,#b7df2d 100%); /* Opera 11.10+ */
  426. background: -ms-linear-gradient(top, #e0ff99 0%,#b7df2d 100%); /* IE10+ */
  427. background: linear-gradient(to bottom, #e0ff99 0%,#b7df2d 100%); /* W3C */
  428. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0ff99', endColorstr='#b7df2d',GradientType=0 ); /* IE6-9 */
  429. padding-top: 5px;
  430. padding-bottom: 5px;
  431. margin-top: 5px;
  432. border: 1px solid #BDE43E;
  433. box-shadow: none;
  434. }
  435. .breadcrumb a{
  436. line-height: 30px;
  437. text-transform: none;
  438. }
  439. .breadcrumb li{
  440. text-shadow: none;
  441. }
  442. /* styles for the star rater */
  443. .star-rating{
  444. list-style:none;
  445. margin: 0px;
  446. padding:0px;
  447. width: 125px;
  448. height: 25px;
  449. position: relative;
  450. overflow:hidden;
  451. background: url(images/start-level.png) top left repeat-x;
  452. }
  453. .star-rating li{
  454. padding:0px;
  455. margin:0px;
  456. width:25px;
  457. height:25px;
  458. float: left;
  459. }
  460. .star-rating li a{
  461. display:block;
  462. width:25px;
  463. height: 25px;
  464. line-height:25px;
  465. text-decoration: none;
  466. text-indent: -9000px;
  467. z-index: 20;
  468. position: absolute;
  469. padding: 0px;
  470. overflow:hidden;
  471. }
  472. .star-rating li a:hover{
  473. background: url(images/start-level.png) left bottom;
  474. z-index: 2;
  475. left: 0px;
  476. border:none;
  477. }
  478. .star-rating a.one-star{
  479. left: 0px;
  480. }
  481. .star-rating a.one-star:hover{
  482. width:25px;
  483. }
  484. .star-rating a.two-stars{
  485. left:25px;
  486. }
  487. .star-rating a.two-stars:hover{
  488. width: 50px;
  489. }
  490. .star-rating a.three-stars{
  491. left: 50px;
  492. }
  493. .star-rating a.three-stars:hover{
  494. width: 75px;
  495. }
  496. .star-rating a.four-stars{
  497. left: 75px;
  498. }
  499. .star-rating a.four-stars:hover{
  500. width: 100px;
  501. }
  502. .star-rating a.five-stars{
  503. left: 100px;
  504. }
  505. .star-rating a.five-stars:hover{
  506. width: 125px;
  507. }
  508. .star-rating li.current-rating{
  509. background: url(images/start-level.png) left center;
  510. position: absolute;
  511. height: 25px;
  512. display: block;
  513. text-indent: -9000px;
  514. z-index: 1;
  515. }
  516. .nav-list > .active > a, .nav-list > .active > a:hover {
  517. color: #333333;
  518. background: none;
  519. }
  520. /*CSS SLIDER ANUNCIOS*/
  521. .pagerslide h2{
  522. font-size: 18px;
  523. background-color: #E6E6E6;
  524. color: #666666;
  525. padding-left: 15px;
  526. }
  527. #top_main_content #announcements .page-header{
  528. display: none;
  529. line-height: 1;
  530. }
  531. #top_main_content #announcements .span6 {
  532. width: 800px;
  533. }
  534. /*CSS PARA CONTENIDO DE CURSO INTRODUCCION*/
  535. .page-course-intro{
  536. padding: 2em;
  537. border: 1px solid #DDDDDD;
  538. -webkit-border-radius: 10px;
  539. -moz-border-radius: 10px;
  540. border-radius: 10px;
  541. margin-bottom: 2em;
  542. }
  543. .page-course-intro ul{
  544. list-style-image:url(images/vineta.png);
  545. padding-top: 10px;
  546. }
  547. .page-course-intro a{
  548. color: #FD6600;
  549. }
  550. .page-course-intro a:hover{
  551. color: #FD6600;
  552. text-decoration: underline;
  553. }
  554. /*FIN DE INTRODUCCION DEL CURSO*/
  555. .fc-header-title h2{
  556. color: #77A300;
  557. }
  558. .fc-first .fc-widget-header{
  559. font-size: 14px;
  560. font-weight: normal;
  561. padding-top: 5px;
  562. padding-bottom: 5px;
  563. }
  564. .well {
  565. background-color: rgba(199,199,199, 0.2);
  566. border: 1px solid rgba(96,165,209, 0.2);
  567. border-radius: 8px;
  568. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05) inset;
  569. margin-bottom: 20px;
  570. min-height: 20px;
  571. padding: 20px 10px;
  572. }
  573. .sidebar-nav img{
  574. -webkit-border-radius: 10px;
  575. -moz-border-radius: 10px;
  576. border-radius: 10px;
  577. }
  578. #homepage .row .span9 h2{
  579. font-weight: bold;
  580. color: #77A300;
  581. padding-bottom: 8px;
  582. }
  583. #homepage .row .span9 p,#homepage .row .span9 ol {
  584. color: #666666;
  585. }
  586. #homepage .row .span9 a{
  587. color: #666666;
  588. }
  589. #homepage .row .span9 a:hover{
  590. color: #9ABF00;
  591. }
  592. .page-header h2{
  593. color: #666;
  594. font-weight: bold;
  595. font-size: 20px;
  596. padding-left: 10px;
  597. }
  598. #course_tools .course-title-tools h3 {
  599. margin-top: 10px;
  600. color: #79A500;
  601. font-weight: bold;
  602. }
  603. .page-header {
  604. border:none;
  605. background:none;
  606. margin-top: 0px;
  607. margin-bottom: 10px;
  608. }
  609. .well_border{
  610. background-color: rgba(199,199,199, 0.2);
  611. border: 1px solid rgba(96,165,209, 0.2);
  612. border-radius: 8px;
  613. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05) inset;
  614. margin-bottom: 20px;
  615. min-height: 20px;
  616. padding: 19px;
  617. }
  618. .well_border .row .span2 {
  619. width: 98px;
  620. }
  621. .well_border .row .span2 .thumbnail {
  622. background-color: #FFFFFF;
  623. background-image: none;
  624. }
  625. #hot_courses .row .span9 .well_border .row .span6{
  626. width: auto;
  627. }
  628. .categories-course-description .text-h3{
  629. color: #75A200;
  630. font-weight: bold;
  631. padding-bottom: 5px;
  632. }
  633. #course_tools .content a {
  634. font-size: 12px;
  635. font-weight: normal;
  636. }
  637. #main_content .course-box .row .span7{
  638. width: 730px;
  639. }
  640. #main_content .course-box .row .span7 .row .span6 {
  641. width: 615px;
  642. }
  643. #main_content .course-box .row .span7 .row .span6 h3{
  644. font-size: 20px;
  645. }
  646. #course_category li, #hot_courses h5, .course_item h5, .categories-course-description h5, .course-box h5 {
  647. font-weight: normal;
  648. }
  649. /*****************************************************
  650. * FOOTER STYLES *
  651. *****************************************************/
  652. footer {
  653. height: 7em;
  654. background: #9bc000; /* Old browsers */
  655. background: -moz-linear-gradient(top, #9bc000 0%, #74a100 68%); /* FF3.6+ */
  656. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9bc000), color-stop(68%,#74a100)); /* Chrome,Safari4+ */
  657. background: -webkit-linear-gradient(top, #9bc000 0%,#74a100 68%); /* Chrome10+,Safari5.1+ */
  658. background: -o-linear-gradient(top, #9bc000 0%,#74a100 68%); /* Opera 11.10+ */
  659. background: -ms-linear-gradient(top, #9bc000 0%,#74a100 68%); /* IE10+ */
  660. background: linear-gradient(to bottom, #9bc000 0%,#74a100 68%); /* W3C */
  661. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9bc000', endColorstr='#74a100',GradientType=0 ); /* IE6-9 */
  662. color:#ffffff;
  663. border-top: 1px solid #74A100;
  664. }
  665. footer .container .row {
  666. padding-top: 5px;
  667. }
  668. footer a:link, footer a:visited {
  669. color: #F1D40D;
  670. }
  671. /*****************************************************
  672. * DISPLAY MESSAGES *
  673. *****************************************************/
  674. /*****************************************************
  675. * CSS CHAT *
  676. *****************************************************/
  677. .chatboxmain {
  678. bottom: 0;
  679. display: block;
  680. position: fixed;
  681. right: 20px;
  682. width: 225px;
  683. z-index: 9000;
  684. }
  685. .chatboxheadmain {
  686. padding:7px 7px 7px 0px;
  687. color: #ffffff;
  688. border-right:1px solid #222;
  689. border-left:1px solid #222;
  690. background-color: #222;
  691. background-repeat: repeat-x;
  692. background-image: -khtml-gradient(linear, left top, left bottom, from(#333333), to(#222222));
  693. background-image: -moz-linear-gradient(top, #333333, #222222);
  694. background-image: -ms-linear-gradient(top, #333333, #222222);
  695. background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #222222));
  696. background-image: -webkit-linear-gradient(top, #333333, #222222);
  697. background-image: -o-linear-gradient(top, #333333, #222222);
  698. background-image: linear-gradient(top, #333333, #222222);
  699. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#222222', GradientType=0);
  700. -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  701. -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  702. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  703. }
  704. #chatboxtitlemain {
  705. cursor: pointer;
  706. float: left;
  707. font-size: 12px;
  708. font-weight: normal;
  709. width: 160px;
  710. }
  711. /*****************************************************
  712. * CSS CHAT END *
  713. *****************************************************/
  714. .normal-message {
  715. background-color: #D9EDF7;
  716. color: #3A87AD;
  717. padding: 15px;
  718. margin-bottom: 15px;
  719. border-top: 1px solid #BCE8F1;
  720. border-left: 1px solid #BCE8F1;
  721. border-right: 1px solid #BCE8F1;
  722. border-bottom: 3px solid #BCE8F1;
  723. border-radius: 10px;
  724. }
  725. .warning-message {
  726. background-color: #FCF8E3;
  727. color: #C09853;
  728. padding: 10px;
  729. margin-bottom: 15px;
  730. border-top: 1px solid #FBEED5;
  731. border-left: 1px solid #FBEED5;
  732. border-right: 1px solid #FBEED5;
  733. border-bottom: 3px solid #FBEED5;
  734. border-radius: 10px;
  735. }
  736. .confirmation-message {
  737. background-color: #DFF0D8;
  738. color: #468847;
  739. padding: 10px;
  740. margin-bottom: 15px;
  741. border-top: 1px solid #D6E9C6;
  742. border-left: 1px solid #D6E9C6;
  743. border-right: 1px solid #D6E9C6;
  744. border-bottom: 3px solid #D6E9C6;
  745. border-radius: 10px;
  746. }
  747. .error-message {
  748. background-color: #F2DEDE;
  749. color: #B94A48;
  750. padding: 10px;
  751. margin-bottom: 15px;
  752. border-top: 1px solid #EED3D7;
  753. border-left: 1px solid #EED3D7;
  754. border-right: 1px solid #EED3D7;
  755. border-bottom: 3px solid #EED3D7;
  756. border-radius: 10px;
  757. }
  758. .error-message strong{
  759. font-weight: normal;
  760. }
  761. .social-menu-title {
  762. background-color:#00AAE3;
  763. }
  764. #social-content-online {
  765. background-color:#00AAE3;
  766. }
  767. .admin_section li {
  768. background-image:url(images/bullet.gif);
  769. }
  770. .system_announcements {
  771. background: transparent url('images/systemenouvelles.jpg') no-repeat top left;
  772. }
  773. .topa {
  774. background:transparent url('images/logoa4.gif') no-repeat;
  775. }
  776. .topb {
  777. background:transparent url('images/logob4.gif') no-repeat;
  778. }
  779. #bottomhellomindfactory {
  780. background:transparent url('images/textologo.jpg') no-repeat;
  781. }
  782. /*including "login" image*/
  783. button.login {
  784. background-image:url(images/bg-button.gif);
  785. }
  786. button.login:hover {
  787. }
  788. /*including "save" image*/
  789. button.save {
  790. background:url(images/accept.png) 0 center no-repeat #F0F0F0;
  791. color: #666;
  792. padding-left: 30px;
  793. }
  794. button.save:hover {
  795. background:url(images/accept.png) 0 center no-repeat #ffffff;
  796. color: #666;
  797. padding-left: 30px;
  798. }
  799. /*including "add" image*/
  800. .controls .btn.add {
  801. background:url(images/add.png) 0 center no-repeat;
  802. padding-left: 36px;
  803. }
  804. .controls .btn.add:hover {
  805. background:url(images/add.png) 0 center no-repeat;
  806. padding-left: 36px;
  807. }
  808. /*including "cancel" image*/
  809. button.cancel {
  810. background-image:url(images/button_delete.gif);
  811. }
  812. /*including "search" image*/
  813. button.search {
  814. background:url(images/buttom.png) 0 center no-repeat #F0F0F0;
  815. color: #666;
  816. padding-left: 30px;
  817. }
  818. button.search:hover {
  819. background:url(images/buttom.png) 0 center no-repeat #ffffff;
  820. color: #666;
  821. padding-left: 30px;
  822. }
  823. /*including "plus" image*/
  824. button.plus {
  825. background-image:url(images/button_plus.gif);
  826. }
  827. /*including "minus" image*/
  828. button.minus {
  829. background-image:url(images/button_minus.gif);
  830. }
  831. /*including "next" image*/
  832. button.next {
  833. background:url(images/next.png) 0 center no-repeat #F0F0F0;
  834. }
  835. button.next:hover {
  836. background:url(images/next.png) 0 center no-repeat #ffffff;
  837. }
  838. /*including "back" image*/
  839. button.back {
  840. background:url(images/previus.png) 0 center no-repeat #F0F0F0;
  841. }
  842. button.back:hover {
  843. background:url(images/previus.png) 0 center no-repeat #ffffff;
  844. }
  845. /*including "refresh" image*/
  846. button.refresh {
  847. background-image:url(images/button_refresh.gif);
  848. }
  849. /*including "upload" image*/
  850. button.upload {
  851. background-image:url(images/button_upload.gif);
  852. }
  853. button.arrowr, input.arrowr {
  854. background-image:url(images/2rightarrow.gif);
  855. }
  856. button.arrowl, input.arrowl {
  857. background-image:url(images/2leftarrow.gif);
  858. }
  859. .refresh {
  860. background-image:url(images/refresh.png);
  861. }
  862. .portal {
  863. background-image:url(images/portal.png);
  864. }
  865. /*+++++++++++++++++++++++++++++++++++++++++++
  866. + CHAMILO INSTALL
  867. ++++++++++++++++++++++++++++++++++++++++++++*/
  868. .install-mascot{
  869. background: url(images/install.png) no-repeat center 0;
  870. padding-top: 20em;
  871. }
  872. .install-chamilo .navbar{
  873. display: none;
  874. }
  875. .install-chamilo footer{
  876. display: none;
  877. }
  878. .install-chamilo .page-header {
  879. border-bottom: 2px solid #FD6600;
  880. }
  881. .install-chamilo .page-header h1 {
  882. line-height: 1;
  883. color: #FD6600;
  884. }
  885. .install-chamilo header{
  886. margin-top: 0;
  887. margin-bottom: 0;
  888. }
  889. .install-chamilo .RequirementHeading h2{
  890. color: #2E75A3;
  891. }
  892. .install-chamilo .page-header h2 {
  893. color: #FD6600;
  894. font-size: 20px;
  895. font-weight: bold;
  896. padding-left: 0;
  897. width: 250px;
  898. }
  899. .well-install{
  900. background: #ffffff; /* Old browsers */
  901. background: -moz-linear-gradient(top, #ffffff 0%, #f6f6f6 47%, #ededed 100%); /* FF3.6+ */
  902. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(47%,#f6f6f6), color-stop(100%,#ededed)); /* Chrome,Safari4+ */
  903. background: -webkit-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Chrome10+,Safari5.1+ */
  904. background: -o-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Opera 11.10+ */
  905. background: -ms-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* IE10+ */
  906. background: linear-gradient(to bottom, #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* W3C */
  907. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */
  908. padding: 3em;
  909. border: 1px solid #E1E1E0;
  910. -webkit-border-radius: 10px;
  911. -moz-border-radius: 10px;
  912. border-radius: 10px;
  913. margin-top: 3em;
  914. }
  915. button.next.disabled {
  916. cursor: default;
  917. opacity: 0.65;
  918. }
  919. button.next.disabled:hover {
  920. cursor: default;
  921. opacity: 0.65;
  922. background-image: none;
  923. }
  924. .install-chamilo .btn-success.btn-install {
  925. float: right;
  926. background: #ff9900; /* Old browsers */
  927. background: -moz-linear-gradient(top, #ff9900 0%, #fd6600 100%); /* FF3.6+ */
  928. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff9900), color-stop(100%,#fd6600)); /* Chrome,Safari4+ */
  929. background: -webkit-linear-gradient(top, #ff9900 0%,#fd6600 100%); /* Chrome10+,Safari5.1+ */
  930. background: -o-linear-gradient(top, #ff9900 0%,#fd6600 100%); /* Opera 11.10+ */
  931. background: -ms-linear-gradient(top, #ff9900 0%,#fd6600 100%); /* IE10+ */
  932. background: linear-gradient(to bottom, #ff9900 0%,#fd6600 100%); /* W3C */
  933. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9900', endColorstr='#fd6600',GradientType=0 ); /* IE6-9 */
  934. border:1px solid rgba(0, 0, 0, 0.15);
  935. text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.17);
  936. color: #FFFFFF;
  937. padding: 5px 25px;
  938. }
  939. .install-chamilo .btn-success.btn-install:hover {
  940. background: #ff7b00; /* Old browsers */
  941. background: -moz-linear-gradient(top, #ff7b00 0%, #fd6600 100%); /* FF3.6+ */
  942. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff7b00), color-stop(100%,#fd6600)); /* Chrome,Safari4+ */
  943. background: -webkit-linear-gradient(top, #ff7b00 0%,#fd6600 100%); /* Chrome10+,Safari5.1+ */
  944. background: -o-linear-gradient(top, #ff7b00 0%,#fd6600 100%); /* Opera 11.10+ */
  945. background: -ms-linear-gradient(top, #ff7b00 0%,#fd6600 100%); /* IE10+ */
  946. background: linear-gradient(to bottom, #ff7b00 0%,#fd6600 100%); /* W3C */
  947. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7b00', endColorstr='#fd6600',GradientType=0 ); /* IE6-9 */
  948. color: #FFFFFF;
  949. }
  950. /*+++++++++++++++++++++++++++++++++++++++++++
  951. END INSTALL CHAMILO
  952. +++++++++++++++++++++++++++++++++++++++++++*/
  953. .bottom_actions_fixed{
  954. background: #a0c400; /* Old browsers */
  955. background: -moz-linear-gradient(top, #a0c400 0%, #73a000 100%); /* FF3.6+ */
  956. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a0c400), color-stop(100%,#73a000)); /* Chrome,Safari4+ */
  957. background: -webkit-linear-gradient(top, #a0c400 0%,#73a000 100%); /* Chrome10+,Safari5.1+ */
  958. background: -o-linear-gradient(top, #a0c400 0%,#73a000 100%); /* Opera 11.10+ */
  959. background: -ms-linear-gradient(top, #a0c400 0%,#73a000 100%); /* IE10+ */
  960. background: linear-gradient(to bottom, #a0c400 0%,#73a000 100%); /* W3C */
  961. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a0c400', endColorstr='#73a000',GradientType=0 ); /* IE6-9 */
  962. border: 1px solid #77A300;
  963. }
  964. .new_actions-fixed {
  965. top: 50px;
  966. }
  967. /*CSS ICON BLOCK USER*/
  968. .inbox-social{
  969. background: url("images/icon-chamilo.png") no-repeat 0 -415px;
  970. padding-left: 40px;
  971. }
  972. .inbox-social:hover,.new-message-social:hover,.invitations-social:hover,.profile-social:hover,.add-course:hover,
  973. .order-course:hover,.history-course:hover, .list-course:hover{
  974. opacity: 0.8;
  975. }
  976. .new-message-social{
  977. background: url("images/icon-chamilo.png") no-repeat 0 -370px;
  978. padding-left: 40px;
  979. }
  980. .invitations-social{
  981. background: url("images/icon-chamilo.png") no-repeat 0 -455px;
  982. padding-left: 40px;
  983. }
  984. .profile-social{
  985. background: url("images/icon-chamilo.png") no-repeat 0 -496px;
  986. padding-left: 40px;
  987. }
  988. .add-course{
  989. background: url("images/icon-chamilo.png") no-repeat 0 -327px;
  990. padding-left: 40px;
  991. }
  992. .order-course{
  993. background: url("images/icon-chamilo.png") no-repeat 0 -536px;
  994. padding-left: 40px;
  995. }
  996. .history-course{
  997. background: url("images/icon-chamilo.png") no-repeat 0 -576px;
  998. padding-left: 40px;
  999. }
  1000. .list-course{
  1001. background: url("images/icon-chamilo.png") no-repeat 0 -618px;
  1002. padding-left: 40px;
  1003. }
  1004. /*+++++++++++++++++++++++++++++++++
  1005. RESPONSIVE CSS
  1006. +++++++++++++++++++++++++++++++++*/
  1007. .navbar .brand {
  1008. float: left;
  1009. font-size: 16px;
  1010. font-weight: 200;
  1011. line-height: 20px;
  1012. padding-bottom: 12px;
  1013. padding-top: 12px;
  1014. color: #FFFFFF;
  1015. }
  1016. .navbar-inner{
  1017. background: #7d7e7d; /* Old browsers */
  1018. background: -moz-linear-gradient(top, #7d7e7d 0%, #0e0e0e 100%); /* FF3.6+ */
  1019. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7d7e7d), color-stop(100%,#0e0e0e)); /* Chrome,Safari4+ */
  1020. background: -webkit-linear-gradient(top, #7d7e7d 0%,#0e0e0e 100%); /* Chrome10+,Safari5.1+ */
  1021. background: -o-linear-gradient(top, #7d7e7d 0%,#0e0e0e 100%); /* Opera 11.10+ */
  1022. background: -ms-linear-gradient(top, #7d7e7d 0%,#0e0e0e 100%); /* IE10+ */
  1023. background: linear-gradient(to bottom, #7d7e7d 0%,#0e0e0e 100%); /* W3C */
  1024. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7d7e7d', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */
  1025. }
  1026. .dropdown-menu li > a:hover, .dropdown-menu .active > a, .dropdown-menu .active > a:hover {
  1027. background-color: #77A300;
  1028. color: #FFFFFF;
  1029. }
  1030. .navbar-search {
  1031. margin-bottom: 0;
  1032. margin-top: 11px;
  1033. position: relative;
  1034. }
  1035. .navbar-search .search-query {
  1036. background:#FFFFFF;
  1037. color: #666;
  1038. border: 1px solid #ffffff;
  1039. }
  1040. .navbar .nav .active > a, .navbar .nav .active > a:hover {
  1041. background:none;
  1042. color: #FFFFFF;
  1043. }
  1044. @media (min-width: 481px) and (max-width: 800px) {
  1045. .sidebar-nav h4 {
  1046. color: #037FB2;
  1047. font-size: 18px;
  1048. padding-bottom: 10px;
  1049. padding-left: 15px;
  1050. padding-right: 15px;
  1051. padding-top: 10px;
  1052. }
  1053. #profile_block .nav-list li, #course_block .nav-list li{
  1054. padding-bottom: 5px;
  1055. padding-top: 5px;
  1056. }
  1057. #top_main_content .menu-column #user_image_block{
  1058. box-shadow: none;
  1059. }
  1060. }
  1061. @media (max-width: 600px) {
  1062. #main_content .course-box .row .span7 .row .span6 {
  1063. float: left;
  1064. /*width: 615px;*/
  1065. padding-left: 10px;
  1066. }
  1067. #main_content .course-box .row .span7 .row .span6 h3 {
  1068. font-size: 16px;
  1069. /*width: 500px;*/
  1070. }
  1071. }
  1072. @media (min-width: 801px){
  1073. .nav-list > li > a {
  1074. font-size: 13px;
  1075. padding-bottom: 8px;
  1076. padding-top: 8px;
  1077. }
  1078. /*CSS ICON BLOCK USER*/
  1079. .inbox-social{
  1080. background: url("images/icon-chamilo.png") no-repeat 0 -345px;
  1081. padding-left: 30px;
  1082. background-size: 25px auto;
  1083. }
  1084. .new-message-social{
  1085. background: url("images/icon-chamilo.png") no-repeat 0 -307px;
  1086. padding-left: 30px;
  1087. background-size: 25px auto;
  1088. }
  1089. .invitations-social{
  1090. background: url("images/icon-chamilo.png") no-repeat 0 -378px;
  1091. padding-left: 30px;
  1092. background-size: 25px auto;
  1093. }
  1094. .profile-social{
  1095. background: url("images/icon-chamilo.png") no-repeat 0 -414px;
  1096. padding-left: 30px;
  1097. background-size: 25px auto;
  1098. }
  1099. .add-course{
  1100. background: url("images/icon-chamilo.png") no-repeat 0 -274px;
  1101. padding-left: 30px;
  1102. background-size: 25px auto;
  1103. }
  1104. .order-course{
  1105. background: url("images/icon-chamilo.png") no-repeat 0 -447px;
  1106. padding-left: 30px;
  1107. background-size: 25px auto;
  1108. }
  1109. .history-course{
  1110. background: url("images/icon-chamilo.png") no-repeat 0 -481px;
  1111. padding-left: 30px;
  1112. background-size: 25px auto;
  1113. }
  1114. .list-course{
  1115. background: url("images/icon-chamilo.png") no-repeat 0 -517px;
  1116. padding-left: 30px;
  1117. background-size: 25px auto;
  1118. }
  1119. }
  1120. @media (min-width: 321px) and (max-width: 480px){
  1121. footer {
  1122. height: 5em;
  1123. }
  1124. .welcome-mascot{
  1125. background: none;
  1126. padding-right: 0px;
  1127. padding-bottom: 2em;
  1128. padding-top: 2em;
  1129. }
  1130. #homepage .row .span9 h2 {
  1131. color: #0191C7;
  1132. font-size: 22px;
  1133. font-weight: bold;
  1134. padding-bottom: 8px;
  1135. line-height: 25px;
  1136. }
  1137. #announcements{
  1138. display: none;
  1139. }
  1140. }
  1141. /*+++++++++++++++++++++++++++++++++
  1142. END RESPONSIVE CSS
  1143. +++++++++++++++++++++++++++++++++*/