default.css 24 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963
  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 :#6E6E6E;
  10. }
  11. a:visited {
  12. text-decoration: none;
  13. }
  14. a:hover {
  15. text-decoration: none;
  16. color: #FE9A2E;
  17. }
  18. a:active {
  19. text-decoration: none;
  20. }
  21. .navbar .nav > li > a {
  22. float: none;
  23. line-height: 24px;
  24. padding-bottom: 13px;
  25. padding-right: 10px;
  26. padding-top: 13px;
  27. color: #FFFFFF;
  28. text-shadow: none;
  29. }
  30. .subnav .navbar-inner {
  31. background: #F9F9F9;
  32. border: 1px solid #E1E1E0;
  33. margin-bottom: 5px;
  34. }
  35. .subnav .nav > li > a {
  36. border-left: none;
  37. border-right: none;
  38. color: #666;
  39. font-weight: normal;
  40. font-size: 13px;
  41. box-shadow: 1px 1px #EDEDED !important;
  42. }
  43. .subnav .nav > li > a:hover{
  44. background: #3D3D3D;
  45. color: #FFFFFF;
  46. line-height: 22px;
  47. }
  48. .subnav .nav > #current > a,
  49. .subnav .nav > #current > a:hover {
  50. color: #fff;
  51. background-color: #EC5923;
  52. border: 1px solid #EC5923;
  53. box-shadow:0 1px 1px rgba(0, 0, 0, 0.15) inset;
  54. line-height: 22px;
  55. }
  56. .subnav li a {
  57. color:#fff;
  58. }
  59. /*#main .nav .dropdown .dropdown-toggle{
  60. }
  61. #main .nav .dropdown .dropdown-toggle:hover{
  62. margin-top: 0;
  63. */
  64. /* Green hover */
  65. .subnav .navbar-inner li a:hover {
  66. color: #fff;
  67. background-color: #3A4751;
  68. border: none;
  69. box-shadow:none;
  70. line-height: 24px;
  71. }
  72. .well .nav-list > li > a:hover {
  73. text-decoration: none;
  74. background: none;
  75. }
  76. .sidebar-nav h4{
  77. color: #037FB2;
  78. padding-bottom: 3px;
  79. padding-left: 15px;
  80. padding-right: 15px;
  81. padding-top: 3px;
  82. }
  83. .dropdown .dropdown-menu li a:hover {
  84. -webkit-border-radius: 0;
  85. -moz-border-radius: 0;
  86. border-radius: 0;
  87. }
  88. #logout_button{
  89. margin-top: 4px;
  90. border: none;
  91. }
  92. #logout_button:hover{
  93. margin-top: 4px;
  94. background: none;
  95. box-shadow: none;
  96. }
  97. /*****************************************************
  98. * STYLE THEME CHAMILO *
  99. *****************************************************/
  100. /*.page-section{
  101. background:url(images/bg-header.jpg) repeat-x;
  102. margin-top: -5px;
  103. }*/
  104. .navbar-inner{
  105. background: #ec5923; /* Old browsers */
  106. background: -moz-linear-gradient(top, #ec5923 0%, #ec5923 100%); /* FF3.6+ */
  107. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ec5923), color-stop(100%,#ec5923)); /* Chrome,Safari4+ */
  108. background: -webkit-linear-gradient(top, #ec5923 0%,#ec5923 100%); /* Chrome10+,Safari5.1+ */
  109. background: -o-linear-gradient(top, #ec5923 0%,#ec5923 100%); /* Opera 11.10+ */
  110. background: -ms-linear-gradient(top, #ec5923 0%,#ec5923 100%); /* IE10+ */
  111. background: linear-gradient(to bottom, #ec5923 0%,#ec5923 100%); /* W3C */
  112. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ec5923', endColorstr='#ec5923',GradientType=0 ); /* IE6-9 */
  113. }
  114. .dropdown-menu li > a:hover, .dropdown-menu .active > a, .dropdown-menu .active > a:hover {
  115. background-color: #3A4751;
  116. color: #FFFFFF;
  117. }
  118. .navbar-search {
  119. margin-bottom: 0;
  120. margin-top: 11px;
  121. position: relative;
  122. }
  123. .navbar-search .search-query {
  124. background:#FFFFFF;
  125. color: #666;
  126. border: 1px solid #ffffff;
  127. }
  128. .navbar .nav .active > a, .navbar .nav .active > a:hover {
  129. background:none;
  130. color: #FFFFFF;
  131. }
  132. .welcome-mascot{
  133. background: url(images/chamilo-welcome.png) no-repeat right 0;
  134. padding-right: 200px;
  135. padding-bottom: 2em;
  136. padding-top: 2em;
  137. }
  138. .nav-list > li > a {
  139. font-size: 14px;
  140. padding-bottom: 6px;
  141. /* padding-left: 15px;
  142. padding-right: 15px;*/
  143. padding-top: 6px;
  144. }
  145. .controls .btn{
  146. background:#EC5923;
  147. color: #ffffff;
  148. border:1px solid rgba(0, 0, 0, 0.15);
  149. padding: 5px 25px;
  150. text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.17);
  151. }
  152. .controls .btn:hover{
  153. background: #EC5923; /* Old browsers */
  154. color: #FFFFFF;
  155. border:1px solid rgba(0, 0, 0, 0.15);
  156. padding: 5px 25px;
  157. text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.17);
  158. }
  159. .form-actions {
  160. background:transparent;
  161. }
  162. .breadcrumb {
  163. margin-bottom: 0;
  164. background: #ffffff; /* Old browsers */
  165. background: -moz-linear-gradient(top, #ffffff 0%, #f6f6f6 47%, #ededed 100%); /* FF3.6+ */
  166. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(47%,#f6f6f6), color-stop(100%,#ededed)); /* Chrome,Safari4+ */
  167. background: -webkit-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Chrome10+,Safari5.1+ */
  168. background: -o-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* Opera 11.10+ */
  169. background: -ms-linear-gradient(top, #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* IE10+ */
  170. background: linear-gradient(to bottom, #ffffff 0%,#f6f6f6 47%,#ededed 100%); /* W3C */
  171. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */
  172. padding-top: 5px;
  173. padding-bottom: 5px;
  174. border: 1px solid #E1E1E0;
  175. box-shadow: none;
  176. color: #666;
  177. }
  178. .breadcrumb a{
  179. color: #666;
  180. font-size: 13px;
  181. line-height: 30px;
  182. text-transform: none;
  183. }
  184. .breadcrumb li{
  185. font-size: 14px;
  186. text-shadow: none;
  187. }
  188. .breadcrumb a.btn-mini{
  189. font-size: 12px;
  190. line-height: 17px;
  191. text-transform: none;
  192. color: #FFFFFF;
  193. }
  194. .breadcrumb a.btn-success {
  195. background: #f68a7a; /* Old browsers */
  196. background: -moz-linear-gradient(top, #f68a7a 0%, #f26954 100%); /* FF3.6+ */
  197. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f68a7a), color-stop(100%,#f26954)); /* Chrome,Safari4+ */
  198. background: -webkit-linear-gradient(top, #f68a7a 0%,#f26954 100%); /* Chrome10+,Safari5.1+ */
  199. background: -o-linear-gradient(top, #f68a7a 0%,#f26954 100%); /* Opera 11.10+ */
  200. background: -ms-linear-gradient(top, #f68a7a 0%,#f26954 100%); /* IE10+ */
  201. background: linear-gradient(to bottom, #f68a7a 0%,#f26954 100%); /* W3C */
  202. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f68a7a', endColorstr='#f26954',GradientType=0 ); /* IE6-9 */
  203. border: 1px solid #FD6600;
  204. color: #FFFFFF;
  205. text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.17);
  206. }
  207. .breadcrumb a.btn-success:hover{
  208. background: #f68a7a; /* Old browsers */
  209. background: -moz-linear-gradient(top, #f68a7a 0%, #ef7f70 100%); /* FF3.6+ */
  210. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f68a7a), color-stop(100%,#ef7f70)); /* Chrome,Safari4+ */
  211. background: -webkit-linear-gradient(top, #f68a7a 0%,#ef7f70 100%); /* Chrome10+,Safari5.1+ */
  212. background: -o-linear-gradient(top, #f68a7a 0%,#ef7f70 100%); /* Opera 11.10+ */
  213. background: -ms-linear-gradient(top, #f68a7a 0%,#ef7f70 100%); /* IE10+ */
  214. background: linear-gradient(to bottom, #f68a7a 0%,#ef7f70 100%); /* W3C */
  215. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f68a7a', endColorstr='#ef7f70',GradientType=0 ); /* IE6-9 */
  216. text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.17);
  217. }
  218. .btn{
  219. display: inline-block;
  220. padding: 3px 25px;
  221. margin-bottom: 0;
  222. font-size: 14px;
  223. font-weight: normal;
  224. line-height: 1.428571429;
  225. text-align: center;
  226. text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.17);
  227. cursor: pointer;
  228. color: #FFFFFF;
  229. background: #3D3D3D; /* Old browsers */
  230. border:1px solid rgba(0, 0, 0, 0.15);
  231. }
  232. .btn:hover{
  233. background: #4E5B65; /* Old browsers */
  234. color: #ffffff;
  235. text-decoration: none;
  236. }
  237. .btn-primary{
  238. background:#EC5923;
  239. color: #ffffff;
  240. border:1px solid rgba(0, 0, 0, 0.15);
  241. padding: 3px 25px;
  242. text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.17);
  243. }
  244. .btn-primary:hover{
  245. background: #EA4E15; /* Old browsers */
  246. color: #FFFFFF;
  247. border:1px solid rgba(0, 0, 0, 0.15);
  248. text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.17);
  249. }
  250. /* styles for the star rater */
  251. .star-rating{
  252. list-style:none;
  253. margin: 0px;
  254. padding:0px;
  255. width: 125px;
  256. height: 25px;
  257. position: relative;
  258. overflow:hidden;
  259. background: url(images/start-level.png) top left repeat-x;
  260. }
  261. .star-rating li{
  262. padding:0px;
  263. margin:0px;
  264. width:25px;
  265. height:25px;
  266. float: left;
  267. }
  268. .star-rating li a{
  269. display:block;
  270. width:25px;
  271. height: 25px;
  272. line-height:25px;
  273. text-decoration: none;
  274. text-indent: -9000px;
  275. z-index: 20;
  276. position: absolute;
  277. padding: 0px;
  278. overflow:hidden;
  279. }
  280. .star-rating li a:hover{
  281. background: url(images/start-level.png) left bottom;
  282. z-index: 2;
  283. left: 0px;
  284. border:none;
  285. }
  286. .star-rating a.one-star{
  287. left: 0px;
  288. }
  289. .star-rating a.one-star:hover{
  290. width:25px;
  291. }
  292. .star-rating a.two-stars{
  293. left:25px;
  294. }
  295. .star-rating a.two-stars:hover{
  296. width: 50px;
  297. }
  298. .star-rating a.three-stars{
  299. left: 50px;
  300. }
  301. .star-rating a.three-stars:hover{
  302. width: 75px;
  303. }
  304. .star-rating a.four-stars{
  305. left: 75px;
  306. }
  307. .star-rating a.four-stars:hover{
  308. width: 100px;
  309. }
  310. .star-rating a.five-stars{
  311. left: 100px;
  312. }
  313. .star-rating a.five-stars:hover{
  314. width: 125px;
  315. }
  316. .star-rating li.current-rating{
  317. background: url(images/start-level.png) left center;
  318. position: absolute;
  319. height: 25px;
  320. display: block;
  321. text-indent: -9000px;
  322. z-index: 1;
  323. }
  324. /*ICON INBOX*/
  325. .home-icon{
  326. background:url(images/icon-chamilo.png) no-repeat 0 0;
  327. background-size: 24px auto;
  328. padding-left: 30px;
  329. }
  330. .home-icon:hover,.messages-icon:hover, .invitations-icon:hover,.shared-profile-icon:hover,.friends-icon:hover,
  331. .browse-groups-icon:hover ,.search-icon:hover ,.myfiles-icon:hover {
  332. opacity: 0.8;
  333. }
  334. .messages-icon{
  335. background:url(images/icon-chamilo.png) no-repeat 0 -29px;
  336. background-size: 24px auto;
  337. padding-left: 30px;
  338. }
  339. .invitations-icon{
  340. background:url(images/icon-chamilo.png) no-repeat 0 -61px;
  341. background-size: 24px auto;
  342. padding-left: 30px;
  343. }
  344. .shared-profile-icon{
  345. background:url(images/icon-chamilo.png) no-repeat 0 -96px;
  346. background-size: 24px auto;
  347. padding-left: 30px;
  348. }
  349. .friends-icon{
  350. background:url(images/icon-chamilo.png) no-repeat 0 -130px;
  351. background-size: 24px auto;
  352. padding-left: 30px;
  353. }
  354. .browse-groups-icon{
  355. background:url(images/icon-chamilo.png) no-repeat 0 -163px;
  356. background-size: 24px auto;
  357. padding-left: 30px;
  358. }
  359. .search-icon {
  360. background:url(images/icon-chamilo.png) no-repeat 0 -198px;
  361. background-size: 24px auto;
  362. padding-left: 30px;
  363. }
  364. .myfiles-icon {
  365. background:url(images/icon-chamilo.png) no-repeat 0 -229px;
  366. background-size: 24px auto;
  367. padding-left: 30px;
  368. }
  369. /* END ICON INBOX */
  370. .nav-list > .active > a, .nav-list > .active > a:hover {
  371. color: #333333;
  372. background: none;
  373. text-shadow:none;
  374. }
  375. .social-menu .well .thumbnail{
  376. border: none;
  377. border-radius: none;
  378. box-shadow: none;
  379. }
  380. .invitation_confirm .thumbnail{
  381. border: 1px solid rgba(96, 165, 209, 0.1);
  382. -webkit-border-radius: 10px;
  383. -moz-border-radius: 10px;
  384. border-radius: 10px;
  385. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  386. display: block;
  387. line-height: 1;
  388. padding: 4px;
  389. background-color: #EEF5FA;
  390. }
  391. .invitation_confirm a.thumbnail:hover{
  392. border-color: rgba(96, 165, 209, 0.1);
  393. box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  394. background-color: #FFFFFF;
  395. }
  396. .social-menu .well .thumbnail img{
  397. -webkit-border-radius: 10px;
  398. -moz-border-radius: 10px;
  399. border-radius: 10px;
  400. border: 2px solid #FFFFFF;
  401. }
  402. /*CSS SLIDER ANUNCIOS*/
  403. .pagerslide h2{
  404. font-size: 18px;
  405. font-weight: normal;
  406. background: #E6E6E6;
  407. color: #666;
  408. padding-left: 15px;
  409. }
  410. #top_main_content #announcements .page-header{
  411. display: none;
  412. line-height: 1;
  413. }
  414. #top_main_content #announcements .span6 {
  415. width: 800px;
  416. }
  417. /*CSS PARA CONTENIDO DE CURSO INTRODUCCION*/
  418. .page-course-intro{
  419. padding: 2em;
  420. border: 1px solid #DDDDDD;
  421. -webkit-border-radius: 10px;
  422. -moz-border-radius: 10px;
  423. border-radius: 10px;
  424. margin-bottom: 2em;
  425. background: #FFFFFF;
  426. }
  427. .page-course-intro ul{
  428. list-style-image:url(images/vineta.png);
  429. padding-top: 10px;
  430. }
  431. .page-course-intro a{
  432. color: #FD6600;
  433. }
  434. .page-course-intro a:hover{
  435. color: #FD6600;
  436. text-decoration: underline;
  437. }
  438. /*FIN DE INTRODUCCION DEL CURSO*/
  439. .fc-header-title h2{
  440. color: #666;
  441. }
  442. .fc-first .fc-widget-header{
  443. font-size: 14px;
  444. font-weight: normal;
  445. padding-top: 5px;
  446. padding-bottom: 5px;
  447. }
  448. .well {
  449. background: #F9F9F9; /* Old browsers */
  450. border: 1px solid #EDEDED;
  451. border-radius: 8px;
  452. box-shadow: none;
  453. margin-bottom: 20px;
  454. min-height: 20px;
  455. padding: 20px 10px;
  456. }
  457. input.span3, textarea.span3, .uneditable-input.span3 {
  458. margin-right: 10px;
  459. width: 260px;
  460. }
  461. .sidebar-nav img{
  462. -webkit-border-radius: 10px;
  463. -moz-border-radius: 10px;
  464. border-radius: 10px;
  465. }
  466. #homepage .row .span9 h2{
  467. font-size: 26px;
  468. font-weight: bold;
  469. color: #666;
  470. padding-bottom: 8px;
  471. }
  472. #homepage .row .span9 p,#homepage .row .span9 ol {
  473. color: #6E6E6E;
  474. }
  475. #homepage .row .span9 a{
  476. /*color: #DE3A01;*/
  477. }
  478. #homepage .row .span9 a:hover{
  479. /*color: #DE3A01;*/
  480. }
  481. .page-header h2{
  482. color: #666;
  483. font-weight: bold;
  484. font-size: 18px;
  485. padding-left: 10px;
  486. }
  487. #course_tools .course-title-tools h3 {
  488. margin-top: 10px;
  489. color: #666;
  490. font-weight: bold;
  491. }
  492. .page-header {
  493. border-bottom-color: #CCCCCC;
  494. border-bottom-style: solid;
  495. border-bottom-width: 1px;
  496. box-shadow: none;
  497. padding-bottom: 0px;
  498. }
  499. .well_border{
  500. background: #F9F9F9; /* Old browsers */
  501. border: 1px solid #EDEDED;
  502. border-radius: 8px;
  503. box-shadow: none;
  504. margin-bottom: 20px;
  505. min-height: 20px;
  506. padding: 19px;
  507. }
  508. .well_border .row .span2 {
  509. width: 98px;
  510. }
  511. .well_border .row .span2 .thumbnail {
  512. background-color: #FFFFFF;
  513. background-image: none;
  514. }
  515. #hot_courses .row .span9 .well_border .row .span6{
  516. width: auto;
  517. }
  518. .categories-course-description h3{
  519. color: #666;
  520. }
  521. #course_tools .content a {
  522. font-size: 12px;
  523. font-weight: normal;
  524. }
  525. #main_content .course-box .row .span7{
  526. width: 730px;
  527. }
  528. #main_content .course-box .row .span7 .row .span6 {
  529. width: 615px;
  530. }
  531. #main_content .course-box .row .span7 .row .span6 h3{
  532. font-size: 20px;
  533. }
  534. #course_category li, #hot_courses h5, .course_item h5, .categories-course-description h5, .course-box h5 {
  535. font-weight: normal;
  536. }
  537. .bottom_actions_fixed {
  538. background: #EC5923;
  539. }
  540. /*****************************************************
  541. * FOOTER STYLES *
  542. *****************************************************/
  543. footer {
  544. height: 10em;
  545. background: #3D3D3D;
  546. color:#ffffff;
  547. border-top: 5px solid #CFCFCF;
  548. }
  549. footer .container .row {
  550. padding-top: 5px;
  551. }
  552. footer a:link, footer a:visited {
  553. color: #F1D40D;
  554. }
  555. /*****************************************************
  556. * DISPLAY MESSAGES *
  557. *****************************************************/
  558. /*****************************************************
  559. * CSS CHAT *
  560. *****************************************************/
  561. .chatboxmain {
  562. bottom: 0;
  563. display: block;
  564. position: fixed;
  565. right: 20px;
  566. width: 225px;
  567. z-index: 9000;
  568. }
  569. .chatboxheadmain {
  570. padding:7px 7px 7px 0px;
  571. color: #ffffff;
  572. border-right:1px solid #222;
  573. border-left:1px solid #222;
  574. background-color: #222;
  575. background-repeat: repeat-x;
  576. background-image: -khtml-gradient(linear, left top, left bottom, from(#333333), to(#222222));
  577. background-image: -moz-linear-gradient(top, #333333, #222222);
  578. background-image: -ms-linear-gradient(top, #333333, #222222);
  579. background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #222222));
  580. background-image: -webkit-linear-gradient(top, #333333, #222222);
  581. background-image: -o-linear-gradient(top, #333333, #222222);
  582. background-image: linear-gradient(top, #333333, #222222);
  583. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#222222', GradientType=0);
  584. -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  585. -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  586. box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  587. }
  588. #chatboxtitlemain {
  589. cursor: pointer;
  590. float: left;
  591. font-size: 12px;
  592. font-weight: normal;
  593. width: 160px;
  594. }
  595. /*****************************************************
  596. * CSS CHAT END *
  597. *****************************************************/
  598. .normal-message {
  599. background-color: #D9EDF7;
  600. color: #3A87AD;
  601. padding: 15px;
  602. margin-bottom: 15px;
  603. border-top: 1px solid #BCE8F1;
  604. border-left: 1px solid #BCE8F1;
  605. border-right: 1px solid #BCE8F1;
  606. border-bottom: 3px solid #BCE8F1;
  607. border-radius: 10px;
  608. }
  609. .warning-message {
  610. background-color: #FCF8E3;
  611. color: #C09853;
  612. padding: 10px;
  613. margin-bottom: 15px;
  614. border-top: 1px solid #FBEED5;
  615. border-left: 1px solid #FBEED5;
  616. border-right: 1px solid #FBEED5;
  617. border-bottom: 3px solid #FBEED5;
  618. border-radius: 10px;
  619. }
  620. .confirmation-message {
  621. background-color: #DFF0D8;
  622. color: #468847;
  623. padding: 10px;
  624. margin-bottom: 15px;
  625. border-top: 1px solid #D6E9C6;
  626. border-left: 1px solid #D6E9C6;
  627. border-right: 1px solid #D6E9C6;
  628. border-bottom: 3px solid #D6E9C6;
  629. border-radius: 10px;
  630. }
  631. .error-message {
  632. background-color: #F2DEDE;
  633. color: #B94A48;
  634. padding: 10px;
  635. margin-bottom: 15px;
  636. border-top: 1px solid #EED3D7;
  637. border-left: 1px solid #EED3D7;
  638. border-right: 1px solid #EED3D7;
  639. border-bottom: 3px solid #EED3D7;
  640. border-radius: 10px;
  641. }
  642. .social-menu-title {
  643. background-color:#00AAE3;
  644. }
  645. #social-content-online {
  646. background-color:#00AAE3;
  647. }
  648. .admin_section li {
  649. background-image:url(images/bullet.gif);
  650. }
  651. .system_announcements {
  652. background: transparent url('images/systemenouvelles.jpg') no-repeat top left;
  653. }
  654. .topa {
  655. background:transparent url('images/logoa4.gif') no-repeat;
  656. }
  657. .topb {
  658. background:transparent url('images/logob4.gif') no-repeat;
  659. }
  660. #bottomhellomindfactory {
  661. background:transparent url('images/textologo.jpg') no-repeat;
  662. }
  663. .new_actions-fixed{
  664. top: 49px;
  665. }
  666. /*including "save" image*/
  667. button.save {
  668. background:url(images/accept.png) 0 center no-repeat #F0F0F0;
  669. color: #666;
  670. text-shadow:none;
  671. }
  672. button.save:hover {
  673. background:url(images/accept.png) 0 center no-repeat #ffffff;
  674. color: #666;
  675. text-shadow:none;
  676. }
  677. /*including "add" image*/
  678. .controls .btn.add {
  679. background:url(images/add.png) 0 center no-repeat #EC5923;
  680. padding-left: 36px;
  681. }
  682. .controls .btn.add:hover {
  683. background:url(images/add.png) 0 center no-repeat #EA4E15;
  684. padding-left: 36px;
  685. }
  686. /*including "cancel" image*/
  687. button.cancel {
  688. background-image:url(images/button_delete.gif);
  689. }
  690. /*including "search" image*/
  691. button.search {
  692. background:url(images/buttom.png) 0 center no-repeat #F0F0F0;
  693. color: #666;
  694. text-shadow:none;
  695. }
  696. button.search:hover {
  697. background:url(images/buttom.png) 0 center no-repeat #ffffff;
  698. color: #666;
  699. text-shadow:none;
  700. }
  701. /*including "plus" image*/
  702. button.plus {
  703. background-image:url(images/button_plus.gif);
  704. }
  705. /*including "minus" image*/
  706. button.minus {
  707. background-image:url(images/button_minus.gif);
  708. }
  709. /*including "next" image*/
  710. button.next {
  711. background:url(images/next.png) 0 center no-repeat #F0F0F0;
  712. }
  713. button.next:hover {
  714. background:url(images/next.png) 0 center no-repeat #ffffff;
  715. }
  716. /*including "back" image*/
  717. button.back {
  718. background:url(images/previus.png) 0 center no-repeat #F0F0F0;
  719. }
  720. button.back:hover {
  721. background:url(images/previus.png) 0 center no-repeat #ffffff;
  722. }
  723. /*including "refresh" image*/
  724. button.refresh {
  725. background-image:url(images/button_refresh.gif);
  726. }
  727. /*including "upload" image*/
  728. button.upload {
  729. background-image:url(images/button_upload.gif);
  730. }
  731. button.arrowr, input.arrowr {
  732. background-image:url(images/2rightarrow.gif);
  733. }
  734. button.arrowl, input.arrowl {
  735. background-image:url(images/2leftarrow.gif);
  736. }
  737. .refresh {
  738. background-image:url(images/refresh.png);
  739. }
  740. .portal {
  741. background-image:url(images/portal.png);
  742. }
  743. /*CSS ICON BLOCK USER*/
  744. .inbox-social{
  745. background: url("images/icon-chamilo.png") no-repeat 0 -415px;
  746. padding-left: 40px;
  747. }
  748. .inbox-social:hover,.new-message-social:hover,.invitations-social:hover,.profile-social:hover,.add-course:hover,
  749. .order-course:hover,.history-course:hover, .list-course:hover{
  750. opacity: 0.8;
  751. }
  752. .new-message-social{
  753. background: url("images/icon-chamilo.png") no-repeat 0 -370px;
  754. padding-left: 40px;
  755. }
  756. .invitations-social{
  757. background: url("images/icon-chamilo.png") no-repeat 0 -455px;
  758. padding-left: 40px;
  759. }
  760. .profile-social{
  761. background: url("images/icon-chamilo.png") no-repeat 0 -496px;
  762. padding-left: 40px;
  763. }
  764. .add-course{
  765. background: url("images/icon-chamilo.png") no-repeat 0 -327px;
  766. padding-left: 40px;
  767. }
  768. .order-course{
  769. background: url("images/icon-chamilo.png") no-repeat 0 -536px;
  770. padding-left: 40px;
  771. }
  772. .history-course{
  773. background: url("images/icon-chamilo.png") no-repeat 0 -576px;
  774. padding-left: 40px;
  775. }
  776. .list-course{
  777. background: url("images/icon-chamilo.png") no-repeat 0 -618px;
  778. padding-left: 40px;
  779. }
  780. .forum-btn{
  781. background: url("images/icon-chamilo.png") no-repeat 0 -666px;
  782. padding-left: 40px;
  783. }
  784. /*+++++++++++++++++++++++++++++++++
  785. RESPONSIVE CSS
  786. +++++++++++++++++++++++++++++++++*/
  787. .navbar .brand {
  788. float: left;
  789. font-size: 16px;
  790. font-weight: 200;
  791. line-height: 20px;
  792. padding-bottom: 12px;
  793. padding-top: 15px;
  794. color: #ffffff;
  795. }
  796. @media (min-width: 481px) and (max-width: 800px) {
  797. .navbar .brand {
  798. color: #666;
  799. }
  800. .navbar .nav-collapse .nav.pull-right a{
  801. color: #3A4751;
  802. line-height: 26px;
  803. }
  804. .navbar .nav-collapse .nav.pull-right a:hover{
  805. color: #FFFFFF;
  806. }
  807. .sidebar-nav h4 {
  808. color: #037FB2;
  809. font-size: 18px;
  810. padding-bottom: 10px;
  811. padding-left: 15px;
  812. padding-right: 15px;
  813. padding-top: 10px;
  814. }
  815. #profile_block .nav-list li, #course_block .nav-list li{
  816. padding-bottom: 5px;
  817. padding-top: 5px;
  818. }
  819. #top_main_content .menu-column #user_image_block{
  820. box-shadow: none;
  821. }
  822. }
  823. @media (max-width: 600px) {
  824. #main_content .course-box .row .span7 .row .span6 {
  825. float: left;
  826. /*width: 615px;*/
  827. padding-left: 10px;
  828. }
  829. #main_content .course-box .row .span7 .row .span6 h3 {
  830. font-size: 16px;
  831. /*width: 500px;*/
  832. }
  833. }
  834. @media (min-width: 801px){
  835. .nav-list > li > a {
  836. font-size: 13px;
  837. padding-bottom: 8px;
  838. padding-top: 8px;
  839. }
  840. /*CSS ICON BLOCK USER*/
  841. .inbox-social{
  842. background: url("images/icon-chamilo.png") no-repeat 0 -345px;
  843. padding-left: 30px;
  844. background-size: 25px auto;
  845. }
  846. .new-message-social{
  847. background: url("images/icon-chamilo.png") no-repeat 0 -307px;
  848. padding-left: 30px;
  849. background-size: 25px auto;
  850. }
  851. .invitations-social{
  852. background: url("images/icon-chamilo.png") no-repeat 0 -378px;
  853. padding-left: 30px;
  854. background-size: 25px auto;
  855. }
  856. .profile-social{
  857. background: url("images/icon-chamilo.png") no-repeat 0 -414px;
  858. padding-left: 30px;
  859. background-size: 25px auto;
  860. }
  861. .add-course{
  862. background: url("images/icon-chamilo.png") no-repeat 0 -274px;
  863. padding-left: 30px;
  864. background-size: 25px auto;
  865. }
  866. .order-course{
  867. background: url("images/icon-chamilo.png") no-repeat 0 -447px;
  868. padding-left: 30px;
  869. background-size: 25px auto;
  870. }
  871. .history-course{
  872. background: url("images/icon-chamilo.png") no-repeat 0 -481px;
  873. padding-left: 30px;
  874. background-size: 25px auto;
  875. }
  876. .list-course{
  877. background: url("images/icon-chamilo.png") no-repeat 0 -517px;
  878. padding-left: 30px;
  879. background-size: 25px auto;
  880. }
  881. .forum-btn {
  882. background: url("images/icon-chamilo.png") no-repeat scroll 0 -552px / 25px auto rgba(0, 0, 0, 0);
  883. padding-left: 30px;
  884. }
  885. }
  886. @media (min-width: 321px) and (max-width: 480px){
  887. footer {
  888. height: 5em;
  889. }
  890. .welcome-mascot{
  891. background: none;
  892. padding-right: 0px;
  893. padding-bottom: 2em;
  894. padding-top: 2em;
  895. }
  896. #homepage .row .span9 h2 {
  897. color: #666;
  898. font-size: 18px;
  899. font-weight: bold;
  900. padding-bottom: 8px;
  901. line-height: 25px;
  902. |}
  903. #announcements{
  904. display: none;
  905. }
  906. }
  907. /*+++++++++++++++++++++++++++++++++
  908. END RESPONSIVE CSS
  909. +++++++++++++++++++++++++++++++++*/