You are here

base.css in Open Social 8.9

@font-face {
  font-family: 'montserrat';
  src: url("../font/montserrat/montserrat-light.eot") format('embedded-opentype'),
       url("../font/montserrat/montserrat-light.woff2") format('woff2'),
       url("../font/montserrat/montserrat-light.woff") format('woff'),
       url("../font/montserrat/montserrat-light.ttf") format('truetype'),
       url("../font/montserrat/montserrat-light.svg") format('svg');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'montserrat';
  src: url("../font/montserrat/montserrat-normal.eot") format('embedded-opentype'),
       url("../font/montserrat/montserrat-normal.woff2") format('woff2'),
       url("../font/montserrat/montserrat-normal.woff") format('woff'),
       url("../font/montserrat/montserrat-normal.ttf") format('truetype'),
       url("../font/montserrat/montserrat-normal.svg") format('svg');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'montserrat';
  src: url("../font/montserrat/montserrat-bold.eot") format('embedded-opentype'),
       url("../font/montserrat/montserrat-bold.woff2") format('woff2'),
       url("../font/montserrat/montserrat-bold.woff") format('woff'),
       url("../font/montserrat/montserrat-bold.ttf") format('truetype'),
       url("../font/montserrat/montserrat-bold.svg") format('svg');
  font-weight: 700;
  font-style: normal;
}

code,
kbd,
pre,
samp {
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
}

code {
  color: #c7254e;
  background-color: #f9f2f4;
  border-radius: 2px;
}

kbd {
  color: #fff;
  background-color: #333;
  border-radius: 3px;
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
}

pre {
  color: #333333;
  background-color: #f5f5f5;
  border: 1px solid #ccc;
  border-radius: 10px;
}

blockquote {
  border-left: 3px solid #29abe2;
}

strong {
  font-weight: 500;
}

.text-primary {
  color: #29abe2;
}

a.text-primary:hover,
a.text-primary:focus {
  color: #1a8dbe;
}

.text-success {
  color: #3c763d;
}

a.text-success:hover,
a.text-success:focus {
  color: #2b542c;
}

.text-info {
  color: #31708f;
}

a.text-info:hover,
a.text-info:focus {
  color: #245269;
}

.text-warning {
  color: #8a6d3b;
}

a.text-warning:hover,
a.text-warning:focus {
  color: #66512c;
}

.text-danger {
  color: #a94442;
}

a.text-danger:hover,
a.text-danger:focus {
  color: #843534;
}

.text-muted {
  color: #555555;
}

a.text-muted:hover,
a.text-muted:focus {
  color: #3c3c3c;
}

.text-gray {
  color: #555555;
}

a.text-gray:hover,
a.text-gray:focus {
  color: #3c3c3c;
}

.text-gray-light {
  color: #777;
}

a.text-gray-light:hover,
a.text-gray-light:focus {
  color: #5e5e5e;
}

.text-gray-lighter {
  color: #adadad;
}

a.text-gray-lighter:hover,
a.text-gray-lighter:focus {
  color: #949494;
}

.text-gray-lightest {
  color: #e6e6e6;
}

a.text-gray-lightest:hover,
a.text-gray-lightest:focus {
  color: #cdcdcd;
}

.text-accent {
  color: #ffc142;
}

a.text-accent:hover,
a.text-accent:focus {
  color: #ffb00f;
}

.bg-primary {
  background-color: #29abe2;
}

.bg-secondary {
  background-color: #1f80aa;
}

.bg-accent {
  background-color: #ffc142;
}

.bg-success {
  background-color: #dff0d8;
}

.bg-warning {
  background-color: #fcf8e3;
}

.bg-danger {
  background-color: #f2dede;
}

.bg-info {
  background-color: #d9edf7;
}

.bg-gray-base {
  background-color: #000;
}

.bg-gray-darker {
  background-color: #222222;
}

.bg-gray-dark {
  background-color: #333333;
}

.bg-gray {
  background-color: #555555;
}

.bg-gray-light {
  background-color: #777;
}

.bg-gray-light-1 {
  background-color: #adadad;
}

.bg-gray-lighter {
  background-color: #e6e6e6;
}

.bg-gray-lighter-1 {
  background-color: #f7f7f7;
}

.bg-gray-lightest {
  background-color: #f3f3f3;
}

.bg-white {
  background-color: white;
}

.brand-primary {
  background-color: #29abe2;
  border-color: #29abe2;
  color: white;
}

a.brand-primary:hover,
a.brand-primary:focus {
  background-color: #1a8dbe;
  border-color: #1a8dbe;
  color: white;
}

.brand-secondary {
  background-color: #1f80aa;
  border-color: #1f80aa;
  color: white;
}

a.brand-secondary:hover,
a.brand-secondary:focus {
  background-color: #17607f;
  border-color: #17607f;
  color: white;
}

.brand-accent {
  background-color: #ffc142;
  border-color: #ffc142;
  color: #4d4d4d;
}

a.brand-accent:hover,
a.brand-accent:focus {
  background-color: #ffb00f;
  border-color: #ffb00f;
  color: #4d4d4d;
}

.brand-user {
  background-color: #222222;
  border-color: #222222;
  color: white;
}

a.brand-user:hover,
a.brand-user:focus {
  background-color: #090909;
  border-color: #090909;
  color: white;
}

.default-light {
  background-color: #e6e6e6;
  border-color: #e6e6e6;
  color: #4d4d4d;
}

a.default-light:hover,
a.default-light:focus {
  background-color: #cdcdcd;
  border-color: #cdcdcd;
  color: #4d4d4d;
}

body {
  font-family: "montserrat", sans-serif;
  font-weight: 300;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #4d4d4d;
  background-color: #f3f3f3;
}

.table-primary,
.table-primary > th,
.table-primary > td {
  background-color: #c3e7f7;
}

.table-hover .table-primary:hover {
  background-color: #addef4;
}

.table-hover .table-primary:hover > td,
.table-hover .table-primary:hover > th {
  background-color: #addef4;
}

.table-secondary,
.table-secondary > th,
.table-secondary > td {
  background-color: #c0dbe7;
}

.table-hover .table-secondary:hover {
  background-color: #aed0e0;
}

.table-hover .table-secondary:hover > td,
.table-hover .table-secondary:hover > th {
  background-color: #aed0e0;
}

.table-accent,
.table-accent > th,
.table-accent > td {
  background-color: #ffeeca;
}

.table-hover .table-accent:hover {
  background-color: #ffe6b1;
}

.table-hover .table-accent:hover > td,
.table-hover .table-accent:hover > th {
  background-color: #ffe6b1;
}

.table-success,
.table-success > th,
.table-success > td {
  background-color: #d1ebd1;
}

.table-hover .table-success:hover {
  background-color: #bfe3bf;
}

.table-hover .table-success:hover > td,
.table-hover .table-success:hover > th {
  background-color: #bfe3bf;
}

.table-info,
.table-info > th,
.table-info > td {
  background-color: #c6eaf8;
}

.table-hover .table-info:hover {
  background-color: #afe2f5;
}

.table-hover .table-info:hover > td,
.table-hover .table-info:hover > th {
  background-color: #afe2f5;
}

.table-warning,
.table-warning > th,
.table-warning > td {
  background-color: #ffdeb8;
}

.table-hover .table-warning:hover {
  background-color: #ffd29f;
}

.table-hover .table-warning:hover > td,
.table-hover .table-warning:hover > th {
  background-color: #ffd29f;
}

.table-danger,
.table-danger > th,
.table-danger > td {
  background-color: #f4cfce;
}

.table-hover .table-danger:hover {
  background-color: #efbbb9;
}

.table-hover .table-danger:hover > td,
.table-hover .table-danger:hover > th {
  background-color: #efbbb9;
}

.table-light,
.table-light > th,
.table-light > td {
  background-color: #f8f8f8;
}

.table-hover .table-light:hover {
  background-color: #ebebeb;
}

.table-hover .table-light:hover > td,
.table-hover .table-light:hover > th {
  background-color: #ebebeb;
}

.table-dark,
.table-dark > th,
.table-dark > td {
  background-color: #c6c6c6;
}

.table-hover .table-dark:hover {
  background-color: #b9b9b9;
}

.table-hover .table-dark:hover > td,
.table-hover .table-dark:hover > th {
  background-color: #b9b9b9;
}

.table-active,
.table-active > th,
.table-active > td {
  background-color: rgba(0, 0, 0, 0.075);
}

.table-hover .table-active:hover {
  background-color: rgba(0, 0, 0, 0.075);
}

.table-hover .table-active:hover > td,
.table-hover .table-active:hover > th {
  background-color: rgba(0, 0, 0, 0.075);
}

.table .table {
  background-color: #f3f3f3;
}

.table th a {
  color: #1d789e;
}

.table th.is-active > a {
  color: #29abe2;
}

.table .icon-tablesort {
  fill: #29abe2;
}

.img-avatar,
.avatar img,
.avatar-icon {
  border-radius: 50%;
}

File

themes/socialblue/assets/css/base.css
View source
  1. @font-face {
  2. font-family: 'montserrat';
  3. src: url("../font/montserrat/montserrat-light.eot") format('embedded-opentype'),
  4. url("../font/montserrat/montserrat-light.woff2") format('woff2'),
  5. url("../font/montserrat/montserrat-light.woff") format('woff'),
  6. url("../font/montserrat/montserrat-light.ttf") format('truetype'),
  7. url("../font/montserrat/montserrat-light.svg") format('svg');
  8. font-weight: 300;
  9. font-style: normal;
  10. }
  11. @font-face {
  12. font-family: 'montserrat';
  13. src: url("../font/montserrat/montserrat-normal.eot") format('embedded-opentype'),
  14. url("../font/montserrat/montserrat-normal.woff2") format('woff2'),
  15. url("../font/montserrat/montserrat-normal.woff") format('woff'),
  16. url("../font/montserrat/montserrat-normal.ttf") format('truetype'),
  17. url("../font/montserrat/montserrat-normal.svg") format('svg');
  18. font-weight: 500;
  19. font-style: normal;
  20. }
  21. @font-face {
  22. font-family: 'montserrat';
  23. src: url("../font/montserrat/montserrat-bold.eot") format('embedded-opentype'),
  24. url("../font/montserrat/montserrat-bold.woff2") format('woff2'),
  25. url("../font/montserrat/montserrat-bold.woff") format('woff'),
  26. url("../font/montserrat/montserrat-bold.ttf") format('truetype'),
  27. url("../font/montserrat/montserrat-bold.svg") format('svg');
  28. font-weight: 700;
  29. font-style: normal;
  30. }
  31. code,
  32. kbd,
  33. pre,
  34. samp {
  35. font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
  36. }
  37. code {
  38. color: #c7254e;
  39. background-color: #f9f2f4;
  40. border-radius: 2px;
  41. }
  42. kbd {
  43. color: #fff;
  44. background-color: #333;
  45. border-radius: 3px;
  46. box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
  47. }
  48. pre {
  49. color: #333333;
  50. background-color: #f5f5f5;
  51. border: 1px solid #ccc;
  52. border-radius: 10px;
  53. }
  54. blockquote {
  55. border-left: 3px solid #29abe2;
  56. }
  57. strong {
  58. font-weight: 500;
  59. }
  60. .text-primary {
  61. color: #29abe2;
  62. }
  63. a.text-primary:hover,
  64. a.text-primary:focus {
  65. color: #1a8dbe;
  66. }
  67. .text-success {
  68. color: #3c763d;
  69. }
  70. a.text-success:hover,
  71. a.text-success:focus {
  72. color: #2b542c;
  73. }
  74. .text-info {
  75. color: #31708f;
  76. }
  77. a.text-info:hover,
  78. a.text-info:focus {
  79. color: #245269;
  80. }
  81. .text-warning {
  82. color: #8a6d3b;
  83. }
  84. a.text-warning:hover,
  85. a.text-warning:focus {
  86. color: #66512c;
  87. }
  88. .text-danger {
  89. color: #a94442;
  90. }
  91. a.text-danger:hover,
  92. a.text-danger:focus {
  93. color: #843534;
  94. }
  95. .text-muted {
  96. color: #555555;
  97. }
  98. a.text-muted:hover,
  99. a.text-muted:focus {
  100. color: #3c3c3c;
  101. }
  102. .text-gray {
  103. color: #555555;
  104. }
  105. a.text-gray:hover,
  106. a.text-gray:focus {
  107. color: #3c3c3c;
  108. }
  109. .text-gray-light {
  110. color: #777;
  111. }
  112. a.text-gray-light:hover,
  113. a.text-gray-light:focus {
  114. color: #5e5e5e;
  115. }
  116. .text-gray-lighter {
  117. color: #adadad;
  118. }
  119. a.text-gray-lighter:hover,
  120. a.text-gray-lighter:focus {
  121. color: #949494;
  122. }
  123. .text-gray-lightest {
  124. color: #e6e6e6;
  125. }
  126. a.text-gray-lightest:hover,
  127. a.text-gray-lightest:focus {
  128. color: #cdcdcd;
  129. }
  130. .text-accent {
  131. color: #ffc142;
  132. }
  133. a.text-accent:hover,
  134. a.text-accent:focus {
  135. color: #ffb00f;
  136. }
  137. .bg-primary {
  138. background-color: #29abe2;
  139. }
  140. .bg-secondary {
  141. background-color: #1f80aa;
  142. }
  143. .bg-accent {
  144. background-color: #ffc142;
  145. }
  146. .bg-success {
  147. background-color: #dff0d8;
  148. }
  149. .bg-warning {
  150. background-color: #fcf8e3;
  151. }
  152. .bg-danger {
  153. background-color: #f2dede;
  154. }
  155. .bg-info {
  156. background-color: #d9edf7;
  157. }
  158. .bg-gray-base {
  159. background-color: #000;
  160. }
  161. .bg-gray-darker {
  162. background-color: #222222;
  163. }
  164. .bg-gray-dark {
  165. background-color: #333333;
  166. }
  167. .bg-gray {
  168. background-color: #555555;
  169. }
  170. .bg-gray-light {
  171. background-color: #777;
  172. }
  173. .bg-gray-light-1 {
  174. background-color: #adadad;
  175. }
  176. .bg-gray-lighter {
  177. background-color: #e6e6e6;
  178. }
  179. .bg-gray-lighter-1 {
  180. background-color: #f7f7f7;
  181. }
  182. .bg-gray-lightest {
  183. background-color: #f3f3f3;
  184. }
  185. .bg-white {
  186. background-color: white;
  187. }
  188. .brand-primary {
  189. background-color: #29abe2;
  190. border-color: #29abe2;
  191. color: white;
  192. }
  193. a.brand-primary:hover,
  194. a.brand-primary:focus {
  195. background-color: #1a8dbe;
  196. border-color: #1a8dbe;
  197. color: white;
  198. }
  199. .brand-secondary {
  200. background-color: #1f80aa;
  201. border-color: #1f80aa;
  202. color: white;
  203. }
  204. a.brand-secondary:hover,
  205. a.brand-secondary:focus {
  206. background-color: #17607f;
  207. border-color: #17607f;
  208. color: white;
  209. }
  210. .brand-accent {
  211. background-color: #ffc142;
  212. border-color: #ffc142;
  213. color: #4d4d4d;
  214. }
  215. a.brand-accent:hover,
  216. a.brand-accent:focus {
  217. background-color: #ffb00f;
  218. border-color: #ffb00f;
  219. color: #4d4d4d;
  220. }
  221. .brand-user {
  222. background-color: #222222;
  223. border-color: #222222;
  224. color: white;
  225. }
  226. a.brand-user:hover,
  227. a.brand-user:focus {
  228. background-color: #090909;
  229. border-color: #090909;
  230. color: white;
  231. }
  232. .default-light {
  233. background-color: #e6e6e6;
  234. border-color: #e6e6e6;
  235. color: #4d4d4d;
  236. }
  237. a.default-light:hover,
  238. a.default-light:focus {
  239. background-color: #cdcdcd;
  240. border-color: #cdcdcd;
  241. color: #4d4d4d;
  242. }
  243. body {
  244. font-family: "montserrat", sans-serif;
  245. font-weight: 300;
  246. -webkit-font-smoothing: antialiased;
  247. -moz-osx-font-smoothing: grayscale;
  248. color: #4d4d4d;
  249. background-color: #f3f3f3;
  250. }
  251. .table-primary,
  252. .table-primary > th,
  253. .table-primary > td {
  254. background-color: #c3e7f7;
  255. }
  256. .table-hover .table-primary:hover {
  257. background-color: #addef4;
  258. }
  259. .table-hover .table-primary:hover > td,
  260. .table-hover .table-primary:hover > th {
  261. background-color: #addef4;
  262. }
  263. .table-secondary,
  264. .table-secondary > th,
  265. .table-secondary > td {
  266. background-color: #c0dbe7;
  267. }
  268. .table-hover .table-secondary:hover {
  269. background-color: #aed0e0;
  270. }
  271. .table-hover .table-secondary:hover > td,
  272. .table-hover .table-secondary:hover > th {
  273. background-color: #aed0e0;
  274. }
  275. .table-accent,
  276. .table-accent > th,
  277. .table-accent > td {
  278. background-color: #ffeeca;
  279. }
  280. .table-hover .table-accent:hover {
  281. background-color: #ffe6b1;
  282. }
  283. .table-hover .table-accent:hover > td,
  284. .table-hover .table-accent:hover > th {
  285. background-color: #ffe6b1;
  286. }
  287. .table-success,
  288. .table-success > th,
  289. .table-success > td {
  290. background-color: #d1ebd1;
  291. }
  292. .table-hover .table-success:hover {
  293. background-color: #bfe3bf;
  294. }
  295. .table-hover .table-success:hover > td,
  296. .table-hover .table-success:hover > th {
  297. background-color: #bfe3bf;
  298. }
  299. .table-info,
  300. .table-info > th,
  301. .table-info > td {
  302. background-color: #c6eaf8;
  303. }
  304. .table-hover .table-info:hover {
  305. background-color: #afe2f5;
  306. }
  307. .table-hover .table-info:hover > td,
  308. .table-hover .table-info:hover > th {
  309. background-color: #afe2f5;
  310. }
  311. .table-warning,
  312. .table-warning > th,
  313. .table-warning > td {
  314. background-color: #ffdeb8;
  315. }
  316. .table-hover .table-warning:hover {
  317. background-color: #ffd29f;
  318. }
  319. .table-hover .table-warning:hover > td,
  320. .table-hover .table-warning:hover > th {
  321. background-color: #ffd29f;
  322. }
  323. .table-danger,
  324. .table-danger > th,
  325. .table-danger > td {
  326. background-color: #f4cfce;
  327. }
  328. .table-hover .table-danger:hover {
  329. background-color: #efbbb9;
  330. }
  331. .table-hover .table-danger:hover > td,
  332. .table-hover .table-danger:hover > th {
  333. background-color: #efbbb9;
  334. }
  335. .table-light,
  336. .table-light > th,
  337. .table-light > td {
  338. background-color: #f8f8f8;
  339. }
  340. .table-hover .table-light:hover {
  341. background-color: #ebebeb;
  342. }
  343. .table-hover .table-light:hover > td,
  344. .table-hover .table-light:hover > th {
  345. background-color: #ebebeb;
  346. }
  347. .table-dark,
  348. .table-dark > th,
  349. .table-dark > td {
  350. background-color: #c6c6c6;
  351. }
  352. .table-hover .table-dark:hover {
  353. background-color: #b9b9b9;
  354. }
  355. .table-hover .table-dark:hover > td,
  356. .table-hover .table-dark:hover > th {
  357. background-color: #b9b9b9;
  358. }
  359. .table-active,
  360. .table-active > th,
  361. .table-active > td {
  362. background-color: rgba(0, 0, 0, 0.075);
  363. }
  364. .table-hover .table-active:hover {
  365. background-color: rgba(0, 0, 0, 0.075);
  366. }
  367. .table-hover .table-active:hover > td,
  368. .table-hover .table-active:hover > th {
  369. background-color: rgba(0, 0, 0, 0.075);
  370. }
  371. .table .table {
  372. background-color: #f3f3f3;
  373. }
  374. .table th a {
  375. color: #1d789e;
  376. }
  377. .table th.is-active > a {
  378. color: #29abe2;
  379. }
  380. .table .icon-tablesort {
  381. fill: #29abe2;
  382. }
  383. .img-avatar,
  384. .avatar img,
  385. .avatar-icon {
  386. border-radius: 50%;
  387. }