styles.css 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720
  1. /**
  2. * Primary Drupal Styles
  3. * Author: Bachir Soussi Chiadmi
  4. */
  5. body {
  6. font-size: 16px;
  7. font-family: "aileron", Arial, "MS Trebuchet", sans-serif; }
  8. h1 {
  9. font-size: 1.6em; }
  10. h2 {
  11. font-size: 1.5em; }
  12. h3 {
  13. font-size: 1.4em; }
  14. h4 {
  15. font-size: 1.3em; }
  16. h5 {
  17. font-size: 1.2em; }
  18. h6 {
  19. font-size: 1.1em; }
  20. input {
  21. font-family: Arial, "MS Trebuchet", sans-serif;
  22. font-size: 0.8em; }
  23. /** layout */
  24. .footer-block .region, .header-block {
  25. display: inline-block;
  26. vertical-align: top; }
  27. #header, #main, #footer {
  28. padding: 0; }
  29. #container {
  30. width: 1024px;
  31. margin: 0 auto; }
  32. #header {
  33. position: fixed;
  34. width: 100%;
  35. max-height: 400px;
  36. z-index: 20;
  37. background-color: rgba(255, 255, 255, 0.95);
  38. background-image: url(../../images/fond-trame-logo-lite.png);
  39. background-repeat: no-repeat;
  40. background-position: center top;
  41. background-size: contain; }
  42. #header hgroup.logo {
  43. width: 1024px;
  44. margin: 0 auto;
  45. padding: 1em 0 0; }
  46. #header h1 {
  47. margin: 0; }
  48. #header h1 a {
  49. display: block;
  50. height: 300px;
  51. background-image: url(../../images/logo.png);
  52. background-size: contain;
  53. background-position: center;
  54. background-repeat: no-repeat;
  55. text-indent: -2000px;
  56. overflow: hidden;
  57. margin: 0; }
  58. #header h2 {
  59. text-align: center;
  60. color: #20c498; }
  61. #main {
  62. padding-top: 400px; }
  63. #main > .region {
  64. width: 1024px;
  65. margin: 0 auto; }
  66. #node-63 {
  67. padding: 1em 0; }
  68. #node-63 .content section {
  69. display: inline; }
  70. #node-63 .content p {
  71. margin: 0; }
  72. #node-63 ul.links {
  73. text-align: right;
  74. margin: 0;
  75. padding: 0; }
  76. #node-63 ul.links li {
  77. margin: 0;
  78. padding: 0;
  79. display: inline-block; }
  80. #node-63 ul.links a {
  81. color: inherit;
  82. text-decoration: none;
  83. font-weight: 500; }
  84. #thematique-anchor-links {
  85. padding: 1em 0; }
  86. #thematique-anchor-links ul {
  87. display: -ms-flexbox;
  88. display: flex;
  89. -ms-flex-flow: row nowrap;
  90. flex-flow: row nowrap;
  91. -ms-flex-pack: justify;
  92. justify-content: space-between;
  93. padding: 0;
  94. margin: 0; }
  95. #thematique-anchor-links ul li {
  96. max-width: 7em;
  97. list-style: none;
  98. padding: 0;
  99. margin: 0; }
  100. #thematique-anchor-links ul li a {
  101. text-decoration: none;
  102. font-weight: 600;
  103. display: block;
  104. min-height: 3em;
  105. background-position: center;
  106. background-repeat: no-repeat;
  107. background-size: contain; }
  108. #thematique-anchor-links ul li a span {
  109. display: block; }
  110. #thematique-anchor-links ul li a.node-32 {
  111. background-image: url(../../images/menu-fond-theme-0-flat.jpg);
  112. color: #2f82ff; }
  113. #thematique-anchor-links ul li a.node-32.en_attente {
  114. color: #aaa;
  115. background-image: url(../../images/menu-fond-theme-0-flat-nb.jpg);
  116. cursor: default; }
  117. #thematique-anchor-links ul li a.node-14 {
  118. background-image: url(../../images/menu-fond-theme-1-flat.jpg);
  119. color: #ff0000; }
  120. #thematique-anchor-links ul li a.node-14.en_attente {
  121. color: #aaa;
  122. background-image: url(../../images/menu-fond-theme-1-flat-nb.jpg);
  123. cursor: default; }
  124. #thematique-anchor-links ul li a.node-38 {
  125. background-image: url(../../images/menu-fond-theme-2-flat.jpg);
  126. color: #88aa00; }
  127. #thematique-anchor-links ul li a.node-38.en_attente {
  128. color: #aaa;
  129. background-image: url(../../images/menu-fond-theme-2-flat-nb.jpg);
  130. cursor: default; }
  131. #thematique-anchor-links ul li a.node-3 {
  132. background-image: url(../../images/menu-fond-theme-3-flat.jpg);
  133. color: #ff6600; }
  134. #thematique-anchor-links ul li a.node-3.en_attente {
  135. color: #aaa;
  136. background-image: url(../../images/menu-fond-theme-3-flat-nb.jpg);
  137. cursor: default; }
  138. #thematique-anchor-links ul li a.node-20 {
  139. background-image: url(../../images/menu-fond-theme-4-flat.jpg);
  140. color: #ff2ad4; }
  141. #thematique-anchor-links ul li a.node-20.en_attente {
  142. color: #aaa;
  143. background-image: url(../../images/menu-fond-theme-4-flat-nb.jpg);
  144. cursor: default; }
  145. #thematique-anchor-links ul li a.node-26 {
  146. background-image: url(../../images/menu-fond-theme-5-flat.jpg);
  147. color: #8800aa; }
  148. #thematique-anchor-links ul li a.node-26.en_attente {
  149. color: #aaa;
  150. background-image: url(../../images/menu-fond-theme-5-flat-nb.jpg);
  151. cursor: default; }
  152. .node-thematique {
  153. min-height: 766px;
  154. margin-bottom: 10em;
  155. position: relative; }
  156. .node-thematique::before {
  157. position: absolute;
  158. content: " ";
  159. width: 110%;
  160. height: 110%;
  161. top: -5%;
  162. left: -5%;
  163. z-index: -1;
  164. background-position: center;
  165. background-size: contain;
  166. background-repeat: no-repeat; }
  167. .node-thematique.node-32::before {
  168. background-image: url(../../images/fond-theme-0-flat.png); }
  169. .node-thematique.node-32.en_attente::before {
  170. background-image: url(../../images/fond-theme-0-flat-nb.jpg); }
  171. .node-thematique.node-32.en_attente > h2,
  172. .node-thematique.node-32.en_attente .group-video .field-name-field-description h3,
  173. .node-thematique.node-32.en_attente .group-description .field-name-field-ecouter,
  174. .node-thematique.node-32.en_attente .node-documentair .field-name-field-doc,
  175. .node-thematique.node-32.en_attente .node-documentair .field-name-title-field,
  176. .node-thematique.node-32.en_attente .field-name-field-episodes .field-label,
  177. .node-thematique.node-32.en_attente .node-episode .field-name-title-field {
  178. color: #aaa; }
  179. .node-thematique.node-32:not(.en_attente) > h2,
  180. .node-thematique.node-32:not(.en_attente) .group-video .field-name-field-description h3,
  181. .node-thematique.node-32:not(.en_attente) .group-description .field-name-field-ecouter,
  182. .node-thematique.node-32:not(.en_attente) .node-documentair .field-name-field-doc,
  183. .node-thematique.node-32:not(.en_attente) .node-documentair .field-name-title-field,
  184. .node-thematique.node-32:not(.en_attente) .field-name-field-episodes .field-label,
  185. .node-thematique.node-32:not(.en_attente) .node-episode .field-name-title-field {
  186. color: #2f82ff; }
  187. .node-thematique.node-14::before {
  188. background-image: url(../../images/fond-theme-1-flat.png); }
  189. .node-thematique.node-14.en_attente::before {
  190. background-image: url(../../images/fond-theme-1-flat-nb.jpg); }
  191. .node-thematique.node-14.en_attente > h2,
  192. .node-thematique.node-14.en_attente .group-video .field-name-field-description h3,
  193. .node-thematique.node-14.en_attente .group-description .field-name-field-ecouter,
  194. .node-thematique.node-14.en_attente .node-documentair .field-name-field-doc,
  195. .node-thematique.node-14.en_attente .node-documentair .field-name-title-field,
  196. .node-thematique.node-14.en_attente .field-name-field-episodes .field-label,
  197. .node-thematique.node-14.en_attente .node-episode .field-name-title-field {
  198. color: #aaa; }
  199. .node-thematique.node-14:not(.en_attente) > h2,
  200. .node-thematique.node-14:not(.en_attente) .group-video .field-name-field-description h3,
  201. .node-thematique.node-14:not(.en_attente) .group-description .field-name-field-ecouter,
  202. .node-thematique.node-14:not(.en_attente) .node-documentair .field-name-field-doc,
  203. .node-thematique.node-14:not(.en_attente) .node-documentair .field-name-title-field,
  204. .node-thematique.node-14:not(.en_attente) .field-name-field-episodes .field-label,
  205. .node-thematique.node-14:not(.en_attente) .node-episode .field-name-title-field {
  206. color: #ff0000; }
  207. .node-thematique.node-38::before {
  208. background-image: url(../../images/fond-theme-2-flat.png); }
  209. .node-thematique.node-38.en_attente::before {
  210. background-image: url(../../images/fond-theme-2-flat-nb.jpg); }
  211. .node-thematique.node-38.en_attente > h2,
  212. .node-thematique.node-38.en_attente .group-video .field-name-field-description h3,
  213. .node-thematique.node-38.en_attente .group-description .field-name-field-ecouter,
  214. .node-thematique.node-38.en_attente .node-documentair .field-name-field-doc,
  215. .node-thematique.node-38.en_attente .node-documentair .field-name-title-field,
  216. .node-thematique.node-38.en_attente .field-name-field-episodes .field-label,
  217. .node-thematique.node-38.en_attente .node-episode .field-name-title-field {
  218. color: #aaa; }
  219. .node-thematique.node-38:not(.en_attente) > h2,
  220. .node-thematique.node-38:not(.en_attente) .group-video .field-name-field-description h3,
  221. .node-thematique.node-38:not(.en_attente) .group-description .field-name-field-ecouter,
  222. .node-thematique.node-38:not(.en_attente) .node-documentair .field-name-field-doc,
  223. .node-thematique.node-38:not(.en_attente) .node-documentair .field-name-title-field,
  224. .node-thematique.node-38:not(.en_attente) .field-name-field-episodes .field-label,
  225. .node-thematique.node-38:not(.en_attente) .node-episode .field-name-title-field {
  226. color: #88aa00; }
  227. .node-thematique.node-3::before {
  228. background-image: url(../../images/fond-theme-3-flat.png); }
  229. .node-thematique.node-3.en_attente::before {
  230. background-image: url(../../images/fond-theme-3-flat-nb.jpg); }
  231. .node-thematique.node-3.en_attente > h2,
  232. .node-thematique.node-3.en_attente .group-video .field-name-field-description h3,
  233. .node-thematique.node-3.en_attente .group-description .field-name-field-ecouter,
  234. .node-thematique.node-3.en_attente .node-documentair .field-name-field-doc,
  235. .node-thematique.node-3.en_attente .node-documentair .field-name-title-field,
  236. .node-thematique.node-3.en_attente .field-name-field-episodes .field-label,
  237. .node-thematique.node-3.en_attente .node-episode .field-name-title-field {
  238. color: #aaa; }
  239. .node-thematique.node-3:not(.en_attente) > h2,
  240. .node-thematique.node-3:not(.en_attente) .group-video .field-name-field-description h3,
  241. .node-thematique.node-3:not(.en_attente) .group-description .field-name-field-ecouter,
  242. .node-thematique.node-3:not(.en_attente) .node-documentair .field-name-field-doc,
  243. .node-thematique.node-3:not(.en_attente) .node-documentair .field-name-title-field,
  244. .node-thematique.node-3:not(.en_attente) .field-name-field-episodes .field-label,
  245. .node-thematique.node-3:not(.en_attente) .node-episode .field-name-title-field {
  246. color: #ff6600; }
  247. .node-thematique.node-20::before {
  248. background-image: url(../../images/fond-theme-4-flat.png); }
  249. .node-thematique.node-20.en_attente::before {
  250. background-image: url(../../images/fond-theme-4-flat-nb.jpg); }
  251. .node-thematique.node-20.en_attente > h2,
  252. .node-thematique.node-20.en_attente .group-video .field-name-field-description h3,
  253. .node-thematique.node-20.en_attente .group-description .field-name-field-ecouter,
  254. .node-thematique.node-20.en_attente .node-documentair .field-name-field-doc,
  255. .node-thematique.node-20.en_attente .node-documentair .field-name-title-field,
  256. .node-thematique.node-20.en_attente .field-name-field-episodes .field-label,
  257. .node-thematique.node-20.en_attente .node-episode .field-name-title-field {
  258. color: #aaa; }
  259. .node-thematique.node-20:not(.en_attente) > h2,
  260. .node-thematique.node-20:not(.en_attente) .group-video .field-name-field-description h3,
  261. .node-thematique.node-20:not(.en_attente) .group-description .field-name-field-ecouter,
  262. .node-thematique.node-20:not(.en_attente) .node-documentair .field-name-field-doc,
  263. .node-thematique.node-20:not(.en_attente) .node-documentair .field-name-title-field,
  264. .node-thematique.node-20:not(.en_attente) .field-name-field-episodes .field-label,
  265. .node-thematique.node-20:not(.en_attente) .node-episode .field-name-title-field {
  266. color: #ff2ad4; }
  267. .node-thematique.node-26::before {
  268. background-image: url(../../images/fond-theme-5-flat.png); }
  269. .node-thematique.node-26.en_attente::before {
  270. background-image: url(../../images/fond-theme-5-flat-nb.jpg); }
  271. .node-thematique.node-26.en_attente > h2,
  272. .node-thematique.node-26.en_attente .group-video .field-name-field-description h3,
  273. .node-thematique.node-26.en_attente .group-description .field-name-field-ecouter,
  274. .node-thematique.node-26.en_attente .node-documentair .field-name-field-doc,
  275. .node-thematique.node-26.en_attente .node-documentair .field-name-title-field,
  276. .node-thematique.node-26.en_attente .field-name-field-episodes .field-label,
  277. .node-thematique.node-26.en_attente .node-episode .field-name-title-field {
  278. color: #aaa; }
  279. .node-thematique.node-26:not(.en_attente) > h2,
  280. .node-thematique.node-26:not(.en_attente) .group-video .field-name-field-description h3,
  281. .node-thematique.node-26:not(.en_attente) .group-description .field-name-field-ecouter,
  282. .node-thematique.node-26:not(.en_attente) .node-documentair .field-name-field-doc,
  283. .node-thematique.node-26:not(.en_attente) .node-documentair .field-name-title-field,
  284. .node-thematique.node-26:not(.en_attente) .field-name-field-episodes .field-label,
  285. .node-thematique.node-26:not(.en_attente) .node-episode .field-name-title-field {
  286. color: #8800aa; }
  287. .node-thematique > h2 {
  288. font-size: 3em;
  289. font-weight: 400;
  290. position: relative; }
  291. .node-thematique > h2 span {
  292. position: absolute;
  293. top: -170px; }
  294. .node-thematique .content {
  295. letter-spacing: -0.25em; }
  296. .node-thematique .content .field-name-field-emvideo img {
  297. width: 100%; }
  298. .node-thematique .content > * {
  299. letter-spacing: normal; }
  300. .node-thematique .content article.main {
  301. display: inline-block;
  302. vertical-align: top;
  303. width: 69.5%;
  304. overflow: hidden; }
  305. .node-thematique .content article.main .field-name-body {
  306. position: relative;
  307. z-index: 3; }
  308. .node-thematique .content article.main .field-name-body > * {
  309. padding: 0 1em 0 0; }
  310. .node-thematique .content article.main .field-name-body .summary {
  311. position: relative;
  312. height: 5.75em;
  313. overflow: hidden;
  314. background-color: #fff;
  315. transition: background-color 0.5 ease-in-out; }
  316. .node-thematique .content article.main .field-name-body .summary p {
  317. font-size: 1.1em;
  318. padding: 0.5em 0.5em 0.5em 0;
  319. font-weight: 500; }
  320. .node-thematique .content article.main .field-name-body .value {
  321. position: absolute;
  322. height: 1px;
  323. margin-bottom: 0;
  324. transition: height 0.5s ease-in-out;
  325. background-color: #fff;
  326. overflow: hidden; }
  327. .node-thematique .content article.main .field-name-body .value p {
  328. font-size: 1em;
  329. padding: 0.5em; }
  330. .node-thematique .content article.main .field-name-body:hover .summary {
  331. background-color: #fff; }
  332. .node-thematique .content article.main .field-name-body:hover .value {
  333. height: 700px; }
  334. .node-thematique .content article.main .field-name-body p {
  335. padding: 0 0 1em;
  336. margin: 0; }
  337. .node-thematique .content article.main .group-video {
  338. position: relative;
  339. min-height: 432px; }
  340. .node-thematique .content article.main .group-video .field-name-field-emvideo a {
  341. display: block;
  342. line-height: 0; }
  343. .node-thematique .content article.main .group-video .group-description {
  344. cursor: pointer;
  345. pointer-events: none;
  346. position: absolute;
  347. z-index: 2;
  348. top: 0;
  349. left: 0;
  350. width: 100%;
  351. height: 100%; }
  352. .node-thematique .content article.main .group-video .group-description .field-name-field-ecouter {
  353. font-size: 1em;
  354. font-weight: 600;
  355. padding: 0.2em 0.4em;
  356. background-color: rgba(255, 255, 255, 0.9);
  357. display: inline-block;
  358. margin: 15px; }
  359. .node-thematique .content article.main .group-video .group-description .field-name-field-description {
  360. position: absolute;
  361. top: 0;
  362. left: 0;
  363. box-sizing: border-box;
  364. width: 80%;
  365. height: 70%;
  366. margin: 10%;
  367. padding: 5%;
  368. opacity: 0;
  369. background-color: rgba(255, 255, 255, 0.9);
  370. transition: opacity 0.3s ease-in-out; }
  371. .node-thematique .content article.main .group-video .group-description .field-name-field-description h3 {
  372. font-weight: 500;
  373. font-size: 2em;
  374. margin: 0; }
  375. .node-thematique .content article.main .group-video:hover .group-description .field-name-field-description {
  376. opacity: 1; }
  377. .node-thematique .content aside.right {
  378. display: inline-block;
  379. vertical-align: top;
  380. width: 30.5%; }
  381. .node-thematique .content aside.right .field-name-field-eclairages {
  382. padding-left: 1em; }
  383. .node-thematique .content aside.right .field-name-field-eclairages .field-item:not(:last-child) {
  384. padding-bottom: 1.2em; }
  385. .node-thematique .content aside.right .node-documentair {
  386. min-height: 160px;
  387. background-color: #fff; }
  388. .node-thematique .content aside.right .node-documentair .content {
  389. position: relative; }
  390. .node-thematique .content aside.right .node-documentair .content .group-txt {
  391. cursor: pointer;
  392. pointer-events: none;
  393. box-sizing: border-box;
  394. position: absolute;
  395. z-index: 2;
  396. overflow: hidden;
  397. top: 0;
  398. left: 0;
  399. width: 90%;
  400. height: 80%;
  401. margin: 5%; }
  402. .node-thematique .content aside.right .node-documentair .content .group-txt .field-name-field-doc {
  403. font-size: 1em;
  404. font-weight: 600;
  405. padding: 0.2em 0.4em;
  406. background-color: rgba(255, 255, 255, 0.9);
  407. display: inline-block;
  408. z-index: 5;
  409. transition: background-color 0.3s ease-in-out; }
  410. .node-thematique .content aside.right .node-documentair .content .group-txt .field-name-title-field {
  411. position: absolute;
  412. z-index: -1;
  413. top: 0;
  414. left: 0;
  415. width: 100%;
  416. font-size: 1.5em;
  417. font-weight: 500;
  418. padding: 30px 7px 10px;
  419. background-color: rgba(255, 255, 255, 0.9);
  420. opacity: 0;
  421. transition: opacity 0.3s ease-in-out; }
  422. .node-thematique .content aside.right .node-documentair .content .group-video a {
  423. display: block;
  424. line-height: 0; }
  425. .node-thematique .content aside.right .node-documentair:not(.en_attente):hover .group-txt .field-name-field-doc {
  426. background-color: transparent; }
  427. .node-thematique .content aside.right .node-documentair:not(.en_attente):hover .group-txt .field-name-title-field {
  428. opacity: 1; }
  429. .node-thematique .content aside.right .node-documentair.en_attente > .content {
  430. position: relative; }
  431. .node-thematique .content aside.right .node-documentair.en_attente > .content::before {
  432. position: absolute;
  433. top: 0;
  434. left: 0;
  435. width: 100%;
  436. height: 100%;
  437. content: " ";
  438. z-index: 10;
  439. background-color: #fff;
  440. opacity: 0.8; }
  441. .node-thematique .content aside.bottom {
  442. padding-top: 0.6em; }
  443. .node-thematique .content aside.bottom .field-name-field-episodes .field-label {
  444. font-size: 1em;
  445. font-weight: 600;
  446. padding: 0.2em 0.4em;
  447. background-color: rgba(255, 255, 255, 0.9);
  448. display: inline-block;
  449. margin-bottom: 0.3em; }
  450. .node-thematique .content aside.bottom .field-name-field-episodes > .field-items {
  451. display: -ms-flexbox;
  452. display: flex;
  453. -ms-flex-flow: row nowrap;
  454. flex-flow: row nowrap;
  455. -ms-flex-pack: justify;
  456. justify-content: space-between; }
  457. .node-thematique .content aside.bottom .field-name-field-episodes > .field-items > .field-item {
  458. display: block;
  459. width: 19%;
  460. background-color: #fff; }
  461. .node-thematique .content aside.bottom .field-name-field-episodes > .field-items > .field-item .node-episode .content {
  462. position: relative; }
  463. .node-thematique .content aside.bottom .field-name-field-episodes > .field-items > .field-item .node-episode .content .group-txt {
  464. cursor: pointer;
  465. pointer-events: none;
  466. box-sizing: border-box;
  467. position: absolute;
  468. z-index: 2;
  469. overflow: hidden;
  470. top: 0;
  471. left: 0;
  472. width: 90%;
  473. height: 80%;
  474. margin: 5%;
  475. padding: 5%;
  476. background-color: rgba(255, 255, 255, 0.9);
  477. opacity: 1;
  478. transition: opacity,background-color 0.3s ease-in-out; }
  479. .node-thematique .content aside.bottom .field-name-field-episodes > .field-items > .field-item .node-episode .content .group-txt .field-name-title-field {
  480. font-size: 4em;
  481. font-weight: 800;
  482. font-style: italic;
  483. text-align: center; }
  484. .node-thematique .content aside.bottom .field-name-field-episodes > .field-items > .field-item .node-episode .content .group-video a {
  485. display: block;
  486. line-height: 0; }
  487. .node-thematique .content aside.bottom .field-name-field-episodes > .field-items > .field-item .node-episode:not(.en_attente):hover .content .group-txt {
  488. opacity: 0.9;
  489. background-color: rgba(255, 255, 255, 0.3); }
  490. .node-thematique .content aside.bottom .field-name-field-episodes > .field-items > .field-item .node-episode.en_attente > .content {
  491. position: relative; }
  492. .node-thematique .content aside.bottom .field-name-field-episodes > .field-items > .field-item .node-episode.en_attente > .content::before {
  493. position: absolute;
  494. top: 0;
  495. left: 0;
  496. width: 100%;
  497. height: 100%;
  498. content: " ";
  499. z-index: 10;
  500. background-color: #fff;
  501. opacity: 0.8; }
  502. .node-thematique.en_attente .content > .main {
  503. position: relative; }
  504. .node-thematique.en_attente .content > .main::before {
  505. position: absolute;
  506. top: 0;
  507. left: 0;
  508. width: 100%;
  509. height: 100%;
  510. content: " ";
  511. z-index: 10;
  512. background-color: #fff;
  513. opacity: 0.8; }
  514. #DOMWindow .embedded-video, #DOMWindow .player, #DOMWindow iframe {
  515. width: 100%;
  516. height: 100%; }
  517. .page-title {
  518. font-size: 3em;
  519. font-weight: 400;
  520. text-transform: capitalize; }
  521. #block-menu-menu-footer-menu {
  522. padding: 2em 0; }
  523. #block-menu-menu-footer-menu ul {
  524. margin: 0;
  525. padding: 0;
  526. text-align: center; }
  527. #block-menu-menu-footer-menu li {
  528. display: inline-block;
  529. list-style: none; }
  530. #block-menu-menu-footer-menu a {
  531. text-decoration: none;
  532. color: inherit; }
  533. .region-footer-bottom {
  534. text-align: center; }
  535. .region-footer-bottom .block {
  536. display: inline-block;
  537. font-size: 0.7em;
  538. margin: 2em 0; }
  539. #content {
  540. padding: 1em; }
  541. /** Messages. */
  542. div.messages {
  543. padding: 9px;
  544. margin: 0.5em 0 0;
  545. color: #036;
  546. background: #bdf;
  547. border: 1px solid #ace;
  548. border-radius: 5px; }
  549. div.warning {
  550. color: #840;
  551. background: #fe6;
  552. border-color: #ed5; }
  553. div.error {
  554. color: #fff;
  555. background: #e63;
  556. border-color: #d52; }
  557. div.error p.error {
  558. color: #333; }
  559. div.status {
  560. color: #360;
  561. background: #cf8;
  562. border-color: #be7; }
  563. /** Tab navigation */
  564. ul.primary, .views-admin-links ul {
  565. font: 13px/1.231 sans-serif;
  566. *font-size: small;
  567. border-collapse: collapse;
  568. padding: 0 0 0 1em;
  569. /* LTR */
  570. white-space: nowrap;
  571. list-style: none;
  572. margin: 5px;
  573. height: auto;
  574. line-height: normal; }
  575. ul.primary li, .views-admin-links li {
  576. display: inline; }
  577. ul.primary li a, .views-admin-links li a {
  578. border-width: 1px;
  579. border-style: solid solid none solid;
  580. height: auto;
  581. margin-right: 0.5em;
  582. /* LTR */
  583. padding: 0 1em;
  584. text-decoration: none;
  585. border-top-left-radius: 5px;
  586. border-top-right-radius: 5px; }
  587. /** Form */
  588. #node-form .form-region-main {
  589. border-right: 1px solid #BFBFBF;
  590. padding-right: 10px;
  591. width: 68%; }
  592. #node-form .form-region-main label {
  593. float: left;
  594. min-width: 25%; }
  595. #node-form .form-region-main input.form-text {
  596. width: 40%; }
  597. #node-form .form-region-right {
  598. padding-left: 5px; }
  599. #node-form .form-region-right label {
  600. float: left;
  601. min-width: 35%; }
  602. #node-form .form-region-right input.form-text {
  603. width: 60%; }
  604. #node-form .form-region-main label.option, #node-form .form-region-right label.option {
  605. float: none; }
  606. form:not(#views-ui-config-item-form) .form-item {
  607. position: relative;
  608. /* padding:9px;*/ }
  609. form:not(#views-ui-config-item-form) .form-item .description {
  610. position: absolute;
  611. bottom: 140%;
  612. /* right:-15px;*/
  613. z-index: 5;
  614. left: 50%;
  615. color: #1A1A1A;
  616. line-height: 1.1;
  617. background: url(../images/popup.png) 50% 100% no-repeat;
  618. width: 240px;
  619. margin: 0px 0px -15px;
  620. padding: 9px 10px 20px;
  621. display: none;
  622. border-top: 1px solid #9F9F9F; }
  623. form:not(#views-ui-config-item-form) .form-item:hover {
  624. z-index: 1;
  625. height: auto;
  626. /* Fix for flicker in IE7 */ }
  627. form:not(#views-ui-config-item-form) .form-item:hover > .description {
  628. display: block; }
  629. fieldset {
  630. border: 1px solid #D4D4D4;
  631. padding: 10px;
  632. margin-bottom: 1em;
  633. border-radius: 5px; }
  634. fieldset legend {
  635. font-size: 1.6em; }
  636. input.form-text {
  637. max-width: 95%; }
  638. /** TABLE */
  639. table {
  640. width: 100%;
  641. border-radius: 5px; }
  642. table thead th {
  643. background-color: #CCC;
  644. padding: 0.5em 1em;
  645. text-align: left; }
  646. table tbody tr.even, table tbody tr.odd {
  647. border-bottom: 0 solid #CCCCCC;
  648. padding: 0.1em 0.6em; }
  649. table tbody tr.even {
  650. background-color: #EEE; }
  651. table tbody tr.odd {
  652. background-color: #E5E5E5; }
  653. table tbody td {
  654. padding: 0.5em 1em;
  655. text-align: left; }
  656. td.active {
  657. background-color: transparent; }
  658. #tasks .tabs {
  659. border: none;
  660. padding: 0; }
  661. #tasks .tabs a {
  662. border: none;
  663. border-radius: 3px;
  664. background-color: #eee;
  665. padding: 0.4em;
  666. color: #000;
  667. margin: 0 1em 0 0; }
  668. #tasks .tabs a.active {
  669. background-color: #999; }