tarteaucitron.css 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603
  1. .modal-open{
  2. overflow: hidden;
  3. height: 100%;
  4. }
  5. a:focus, button:focus {
  6. outline: 2px solid #cb3333;
  7. }
  8. /***
  9. * Responsive layout for the control panel
  10. */
  11. @media screen and (max-width:479px) {
  12. #tarteaucitron .tarteaucitronLine .tarteaucitronName {
  13. width: 90% !important;
  14. }
  15. #tarteaucitron .tarteaucitronLine .tarteaucitronAsk {
  16. float: left !important;
  17. margin: 10px 15px 5px;
  18. }
  19. }
  20. @media screen and (max-width:767px) {
  21. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer, #tarteaucitron {
  22. background: #fff;
  23. border: 0 !important;
  24. bottom: 0 !important;
  25. height: 100% !important;
  26. left: 0 !important;
  27. margin: 0 !important;
  28. max-height: 100% !important;
  29. max-width: 100% !important;
  30. top: 0 !important;
  31. width: 100% !important;
  32. }
  33. #tarteaucitron .tarteaucitronBorder {
  34. border: 0 !important;
  35. }
  36. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList {
  37. border: 0 !important;
  38. }
  39. #tarteaucitron #tarteaucitronServices .tarteaucitronTitle {
  40. text-align: left !important;
  41. }
  42. .tarteaucitronName h2 {
  43. max-width: 80%;
  44. }
  45. #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk {
  46. text-align: center !important;
  47. }
  48. #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk button {
  49. margin-bottom: 5px;
  50. }
  51. }
  52. @media screen and (min-width:768px) and (max-width:991px) {
  53. #tarteaucitron {
  54. border: 0 !important;
  55. left: 0 !important;
  56. margin: 0 5% !important;
  57. max-height: 80% !important;
  58. width: 90% !important;
  59. }
  60. }
  61. /***
  62. * Common value
  63. */
  64. #tarteaucitron * {
  65. zoom: 1;
  66. }
  67. #tarteaucitron .clear {
  68. clear: both;
  69. }
  70. #tarteaucitron a {
  71. color: rgb(66, 66, 66);
  72. font-size: 11px;
  73. font-weight: 700;
  74. text-decoration: none;
  75. }
  76. #tarteaucitronRoot button {
  77. background: transparent;
  78. border: 0;
  79. }
  80. #tarteaucitronAlertBig strong, #tarteaucitronAlertSmall strong,
  81. #tarteaucitronAlertBig a, #tarteaucitronAlertSmall a {
  82. color: #fff;
  83. }
  84. #tarteaucitron strong {
  85. font-size: 22px;
  86. font-weight: 500;
  87. }
  88. #tarteaucitron ul {
  89. padding: 0;
  90. }
  91. .cookie-list {
  92. list-style: none;
  93. padding: 0;
  94. margin: 0;
  95. }
  96. /***
  97. * Root div added just before </body>
  98. */
  99. #tarteaucitronRoot {
  100. left: 0;
  101. position: absolute;
  102. right: 0;
  103. top: 0;
  104. width: 100%;
  105. }
  106. #tarteaucitronRoot * {
  107. box-sizing: initial;
  108. color: #333;
  109. font-family: sans-serif !important;
  110. font-size: 14px;
  111. line-height: normal;
  112. vertical-align: initial;
  113. }
  114. #tarteaucitronRoot h1 {
  115. font-size: 1.5em;
  116. text-align: center;
  117. color: #fff;
  118. }
  119. #tarteaucitronRoot h2 {
  120. display: inline-block;
  121. margin-left: 5px;
  122. color: #fff;
  123. }
  124. /***
  125. * Control panel
  126. */
  127. #tarteaucitronBack {
  128. background: #fff;
  129. display: none;
  130. height: 100%;
  131. left: 0;
  132. opacity: 0.7;
  133. position: fixed;
  134. top: 0;
  135. width: 100%;
  136. z-index: 2147483646;
  137. }
  138. #tarteaucitron {
  139. display: none;
  140. max-height: 80%;
  141. left: 50%;
  142. margin: 0 auto 0 -430px;
  143. padding: 0;
  144. position: fixed;
  145. top: 6%;
  146. width: 860px;
  147. z-index: 2147483647;
  148. }
  149. #tarteaucitron .tarteaucitronBorder {
  150. background: #fff;
  151. border: 2px solid #333;
  152. border-top: 0;
  153. height: auto;
  154. overflow: auto;
  155. }
  156. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronClosePanelCookie,
  157. #tarteaucitron #tarteaucitronClosePanel {
  158. background: #333333;
  159. color: #fff;
  160. cursor: pointer;
  161. font-size: 12px;
  162. font-weight: 700;
  163. text-decoration: none;
  164. padding: 4px 0;
  165. position: absolute;
  166. right: 0;
  167. text-align: center;
  168. width: 70px;
  169. }
  170. #tarteaucitron #tarteaucitronDisclaimer {
  171. color: #555;
  172. font-size: 12px;
  173. margin: 15px auto 0;
  174. width: 80%;
  175. }
  176. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList .tarteaucitronHidden,
  177. #tarteaucitron #tarteaucitronServices .tarteaucitronHidden {
  178. background: rgba(51, 51, 51, 0.07);
  179. }
  180. #tarteaucitron #tarteaucitronServices .tarteaucitronHidden {
  181. display: none;
  182. position: relative;
  183. }
  184. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList .tarteaucitronTitle button,
  185. #tarteaucitron #tarteaucitronServices .tarteaucitronTitle button,
  186. #tarteaucitron #tarteaucitronInfo,
  187. #tarteaucitron #tarteaucitronServices .tarteaucitronDetails {
  188. background: #333;
  189. color: #fff;
  190. display: inline-block;
  191. font-size: 14px;
  192. font-weight: 700;
  193. margin: 20px 0px 0px;
  194. padding: 5px 20px;
  195. text-align: left;
  196. width: auto;
  197. }
  198. #tarteaucitron #tarteaucitronServices .tarteaucitronMainLine .tarteaucitronName a,
  199. #tarteaucitron #tarteaucitronServices .tarteaucitronTitle a {
  200. color: #fff;
  201. font-weight: 500;
  202. }
  203. #tarteaucitron #tarteaucitronServices .tarteaucitronMainLine .tarteaucitronName a:hover,
  204. #tarteaucitron #tarteaucitronServices .tarteaucitronTitle a:hover {
  205. text-decoration: none !important;
  206. }
  207. #tarteaucitron #tarteaucitronServices .tarteaucitronMainLine .tarteaucitronName a {
  208. font-size: 22px;
  209. }
  210. #tarteaucitron #tarteaucitronServices .tarteaucitronTitle a {
  211. font-size: 14px;
  212. }
  213. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList .tarteaucitronTitle {
  214. padding: 5px 10px;
  215. margin: 0;
  216. }
  217. #tarteaucitron #tarteaucitronInfo,
  218. #tarteaucitron #tarteaucitronServices .tarteaucitronDetails {
  219. color: #fff;
  220. display: none;
  221. font-size: 12px;
  222. font-weight: 500;
  223. margin-top: 0;
  224. max-width: 270px;
  225. padding: 20px;
  226. position: absolute;
  227. z-index: 2147483647;
  228. }
  229. #tarteaucitron #tarteaucitronInfo a {
  230. color: #fff;
  231. text-decoration: underline;
  232. }
  233. #tarteaucitron #tarteaucitronServices .tarteaucitronLine:hover {
  234. background: rgba(51, 51, 51, 0.2);
  235. }
  236. #tarteaucitron #tarteaucitronServices .tarteaucitronLine {
  237. background: rgba(51, 51, 51, 0.1);
  238. border-left: 5px solid transparent;
  239. margin: 0;
  240. overflow: hidden;
  241. padding: 15px 5px;
  242. }
  243. #tarteaucitron #tarteaucitronServices .tarteaucitronMainLine {
  244. background: #333;
  245. border: 3px solid #333;
  246. border-left: 9px solid #333;
  247. border-top: 5px solid #333;
  248. margin-bottom: 0;
  249. margin-top: 21px;
  250. position: relative;
  251. }
  252. #tarteaucitron #tarteaucitronServices .tarteaucitronMainLine:hover {
  253. background: #333;
  254. }
  255. #tarteaucitron #tarteaucitronServices .tarteaucitronMainLine .tarteaucitronName {
  256. margin-left: 15px;
  257. margin-top: 2px;
  258. }
  259. #tarteaucitron #tarteaucitronServices .tarteaucitronMainLine .tarteaucitronName button {
  260. color: #fff;
  261. }
  262. #tarteaucitron #tarteaucitronServices .tarteaucitronMainLine .tarteaucitronAsk {
  263. margin-top: 0px !important;
  264. }
  265. #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronName {
  266. display: inline-block;
  267. float: left;
  268. margin-left: 10px;
  269. text-align: left;
  270. width: 50%;
  271. }
  272. #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronName a:hover {
  273. text-decoration: underline;
  274. }
  275. #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk {
  276. display: inline-block;
  277. float: right;
  278. margin: 7px 15px 0;
  279. text-align: right;
  280. }
  281. #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk .tarteaucitronAllow,
  282. #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronAsk .tarteaucitronDeny,
  283. .tac_activate .tarteaucitronAllow {
  284. background: gray;
  285. border-radius: 4px;
  286. color: #fff;
  287. cursor: pointer;
  288. display: inline-block;
  289. padding: 6px 10px;
  290. text-align: center;
  291. text-decoration: none;
  292. width: auto;
  293. border: 0;
  294. }
  295. #tarteaucitron #tarteaucitronServices .tarteaucitronLine .tarteaucitronName .tarteaucitronListCookies {
  296. color: #333;
  297. font-size: 12px;
  298. }
  299. /***
  300. * Big alert
  301. */
  302. .tarteaucitronAlertBigTop {
  303. top: 0;
  304. }
  305. .tarteaucitronAlertBigBottom {
  306. bottom: 0;
  307. }
  308. #tarteaucitronAlertBig {
  309. background: #333;
  310. color: #fff;
  311. display: none;
  312. font-size: 15px !important;
  313. left: 0;
  314. padding: 5px 5%;
  315. position: fixed;
  316. text-align: center;
  317. width: 90%;
  318. box-sizing: content-box;
  319. z-index: 2147483645;
  320. }
  321. #tarteaucitronAlertBig #tarteaucitronDisclaimerAlert,
  322. #tarteaucitronAlertBig #tarteaucitronDisclaimerAlert strong {
  323. font: 15px verdana;
  324. color: #fff;
  325. }
  326. #tarteaucitronAlertBig #tarteaucitronDisclaimerAlert strong {
  327. font-weight: 700;
  328. }
  329. #tarteaucitronAlertBig #tarteaucitronCloseAlert, #tarteaucitronAlertBig #tarteaucitronPersonalize {
  330. background: #008300;
  331. color: #fff;
  332. cursor: pointer;
  333. display: inline-block;
  334. font-size: 16px;
  335. padding: 5px 10px;
  336. text-decoration: none;
  337. margin-left: 7px;
  338. }
  339. #tarteaucitronAlertBig #tarteaucitronCloseAlert {
  340. background: #fff;
  341. color: #333;
  342. font-size: 13px;
  343. margin-bottom: 3px;
  344. margin-left: 7px;
  345. padding: 4px 10px;
  346. }
  347. #tarteaucitronPercentage {
  348. background: #0A0;
  349. box-shadow: 0 0 2px #fff, 0 1px 2px #555;
  350. height: 5px;
  351. left: 0;
  352. position: fixed;
  353. width: 0;
  354. z-index: 2147483644;
  355. }
  356. /***
  357. * Small alert
  358. */
  359. .tarteaucitronAlertSmallTop {
  360. top: 0;
  361. }
  362. .tarteaucitronAlertSmallBottom {
  363. bottom: 0;
  364. }
  365. #tarteaucitronAlertSmall {
  366. background: #333;
  367. display: none;
  368. padding: 0;
  369. position: fixed;
  370. right: 0;
  371. text-align: center;
  372. width: auto;
  373. z-index: 2147483646;
  374. }
  375. #tarteaucitronAlertSmall #tarteaucitronManager {
  376. color: #fff;
  377. cursor: pointer;
  378. display: inline-block;
  379. font-size: 11px !important;
  380. padding: 8px 10px 8px;
  381. }
  382. #tarteaucitronAlertSmall #tarteaucitronManager:hover {
  383. background: rgba(255, 255, 255, 0.05);
  384. }
  385. #tarteaucitronAlertSmall #tarteaucitronManager #tarteaucitronDot {
  386. background-color: gray;
  387. border-radius: 5px;
  388. display: block;
  389. height: 8px;
  390. margin-bottom: 1px;
  391. margin-top: 5px;
  392. overflow: hidden;
  393. width: 100%;
  394. }
  395. #tarteaucitronAlertSmall #tarteaucitronManager #tarteaucitronDot #tarteaucitronDotGreen,
  396. #tarteaucitronAlertSmall #tarteaucitronManager #tarteaucitronDot #tarteaucitronDotYellow,
  397. #tarteaucitronAlertSmall #tarteaucitronManager #tarteaucitronDot #tarteaucitronDotRed {
  398. display: block;
  399. float: left;
  400. height: 100%;
  401. width: 0%;
  402. }
  403. #tarteaucitronAlertSmall #tarteaucitronManager #tarteaucitronDot #tarteaucitronDotGreen {
  404. background-color: #1B870B;
  405. }
  406. #tarteaucitronAlertSmall #tarteaucitronManager #tarteaucitronDot #tarteaucitronDotYellow {
  407. background-color: #FBDA26;
  408. }
  409. #tarteaucitronAlertSmall #tarteaucitronManager #tarteaucitronDot #tarteaucitronDotRed {
  410. background-color: #9C1A1A;
  411. }
  412. #tarteaucitronAlertSmall #tarteaucitronCookiesNumber {
  413. background: rgba(255, 255, 255, 0.2);
  414. color: #fff;
  415. cursor: pointer;
  416. display: inline-block;
  417. font-size: 30px;
  418. padding: 0px 10px;
  419. vertical-align: top;
  420. }
  421. #tarteaucitronAlertSmall #tarteaucitronCookiesNumber:hover {
  422. background: rgba(255, 255, 255, 0.3);
  423. }
  424. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer {
  425. display: none;
  426. max-height: 70%;
  427. max-width: 500px;
  428. position: fixed;
  429. right: 0;
  430. width: 100%;
  431. }
  432. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList {
  433. background: #fff;
  434. border: 2px solid #333;
  435. color: #333;
  436. font-size: 11px;
  437. height: auto;
  438. overflow: auto;
  439. text-align: left;
  440. }
  441. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList strong {
  442. color: #333;
  443. }
  444. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesTitle {
  445. background: #333;
  446. margin-top: 21px;
  447. padding: 13px 0 9px 13px;
  448. text-align: left;
  449. }
  450. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesTitle strong {
  451. color: #fff;
  452. font-size: 16px;
  453. }
  454. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList .tarteaucitronCookiesListMain {
  455. background: rgba(51, 51, 51, 0.1);
  456. padding: 7px 5px 10px;
  457. word-wrap: break-word;
  458. }
  459. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList .tarteaucitronCookiesListMain:hover {
  460. background: rgba(51, 51, 51, 0.2);
  461. }
  462. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList .tarteaucitronCookiesListMain a {
  463. color: #333;
  464. text-decoration: none;
  465. }
  466. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList .tarteaucitronCookiesListMain .tarteaucitronCookiesListLeft {
  467. display: inline-block;
  468. width: 50%;
  469. }
  470. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList .tarteaucitronCookiesListMain .tarteaucitronCookiesListLeft a strong {
  471. color: darkred;
  472. }
  473. #tarteaucitronAlertSmall #tarteaucitronCookiesListContainer #tarteaucitronCookiesList .tarteaucitronCookiesListMain .tarteaucitronCookiesListRight {
  474. color: #333;
  475. display: inline-block;
  476. font-size: 11px;
  477. margin-left: 10%;
  478. vertical-align: top;
  479. width: 30%;
  480. }
  481. /***
  482. * Fallback activate link
  483. */
  484. .tac_activate {
  485. background: #333;
  486. color: #fff;
  487. display: table;
  488. font-size: 12px;
  489. height: 100%;
  490. line-height: initial;
  491. margin: auto;
  492. text-align: center;
  493. width: 100%;
  494. }
  495. .tac_float {
  496. display: table-cell;
  497. text-align: center;
  498. vertical-align: middle;
  499. }
  500. .tac_activate .tac_float strong {
  501. color: #fff;
  502. }
  503. .tac_activate .tac_float .tarteaucitronAllow {
  504. background-color: #1B870B;
  505. display: inline-block;
  506. }
  507. /***
  508. * CSS for services
  509. */
  510. ins.ferank-publicite, ins.adsbygoogle {
  511. text-decoration: none;
  512. }
  513. div.amazon_product {
  514. height:240px;
  515. width:120px;
  516. }