API tools faq
paste
janvier56

X Xhamster Widescreen (NEW) PART 3 - Xhamsterlive v.110

janvier56
Dec 18th, 2018
343
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.33 KB | None | 0 0
raw download clone embed print report
  1. @-moz-document domain("xhamsterlive.com"), domain("fr.xhamsterlive.com") {
  2.  
  3. /* ==== START - URL PREF - X Xhamster Widescreen (NEW) PART 3 - Xhamsterlive v.110 (new110) - a POSTer - WATxhamDEV01bak ==== */
  4.  
  5. /* ============================================================================= */
  6. /* CCC ==== START ==== PART 3 ===== Xhamsterlive ============================== */
  7. /* ============================================================================= */
  8.  
  9.  
  10. /* (new10) START === URL ==== XHAMSTER LIVE DOMAIN
  11. @-moz-document domain("xhamsterlive.com"),
  12. domain("fr.xhamsterlive.com") {
  13. =============== */
  14.  
  15. /* (new102) CAM - SUPP - === */
  16. .announcement-sub-header ,
  17. .lottery ,
  18. .header-notifications-wrapper,
  19. .header-notifications-wrapper .header-notifications ,
  20. .watermark ,
  21. .model-list-promo {
  22. display: none;
  23. }
  24. :root {
  25. --view-cam-aspect-ratio: 0.75;
  26. --view-cam-layout-height: 100vh;
  27. --view-cam-layout-width: 100vw;
  28. --view-cam-top: 200px;
  29. }
  30.  
  31. /* (new110) CAMS - GENERAL - === */
  32. body,
  33. #body,
  34. html {
  35. width: 100% !important;
  36. min-width: 100% !important;
  37. /* height: 947px !important; */
  38. /* overflow: hidden !important; */
  39. background: #222 !important;
  40. }
  41. #body {
  42. /* background: red !important; */
  43. }
  44.  
  45. /* (new110) MODELS INDEXS - === */
  46. .main-layout.main-layout .index-page .model-list-wrapper {
  47. max-width: 99% !important;
  48. width: 99% !important;
  49. }
  50.  
  51. /* (new110) PLAYER PAGE - TAGS INLINE BAGES CONTAINER - BOTTOM / RIGHT - === */
  52. .model-list-wrapper.container .tags-inline-badges {
  53. position: absolute !important;
  54.  
  55. bottom: -182px !important;
  56. z-index: 50000 !important;
  57. transition: bottom ease 0.7s !important;
  58. background: black ;
  59. }
  60. .model-list-wrapper.container .tags-inline-badges:before {
  61. content: "Models Tags" ;
  62. position: absolute !important;
  63. display: inline-block !important;
  64. top: -17px !important;
  65. width: 100px ;
  66. height: 20px !important;
  67. border-radius: 5px 5px 0 0;
  68. text-align: center ;
  69.  
  70. color: white ;
  71. background: black ;
  72. }
  73. .model-list-wrapper.container .tags-inline-badges:hover {
  74. bottom: 0px !important;
  75. z-index: 50000 !important;
  76. /* background: blue !important; */
  77. }
  78.  
  79.  
  80. /* (new110) VR BUTTON - .web-rtc-player-wrapper === */
  81.  
  82. /* .player-central-button .watch-vr */
  83. .player-central-button {
  84. position: fixed !important;
  85. display: inline-block;
  86. bottom: 90% !important;
  87. left: 55% !important;
  88. z-index: 5000 !important;
  89. }
  90.  
  91. /* (new110) CAM PLAYER PAGE - === */
  92. .main-layout.viewcampage {
  93. max-height: 821px !important;
  94. }
  95.  
  96. .main-layout.viewcampage .page.view-cam-page {
  97. width: 1140px ;
  98. height: 821px !important;
  99. left: -355px ;
  100. top: -5px ;
  101. border-right: 1px solid red ;
  102. }
  103. .main-layout.viewcampage .page.view-cam-page > .wrapper .main {
  104. width: 1155px ;
  105. height: 921px !important;
  106. margin-top: -28px ;
  107. }
  108. .main-layout.viewcampage .page.view-cam-page .view-cam > .wrapper .main.hd {
  109. margin-top: 6px !important;
  110. height: calc(100vh - 326px);
  111. max-height: calc((100vw - 440px) * 0.5556);
  112. max-width: calc(100vw - 440px);
  113. min-height: calc(500px * 0.5556);
  114. min-width: 500px;
  115. width: calc(100vh / 0.5556 - 326px / 0.5556);
  116. }
  117. .main-layout.viewcampage .page.view-cam-page > .main .video {
  118. width: 900px !important;
  119. left: -25px ;
  120. top: 3px ;
  121. }
  122.  
  123.  
  124. .main-layout.viewcampage .page.view-cam-page > .main .video .view-cam {
  125. --container-size: 1268px;
  126. --gutter: 38px;
  127. }
  128. .main-layout.viewcampage .page.view-cam-page > .main .video .view-cam {
  129. --view-cam-calculated-max-width: calc(var(--container-size) - var(--view-cam-chat-min-width) - var(--gutter));
  130. --view-cam-calculated-width: calc(var(--view-cam-layout-height) / var(--view-cam-aspect-ratio) - var(--view-cam-max-height) / var(--view-cam-aspect-ratio));
  131. --view-cam-chat-min-width: 400px;
  132. --view-cam-controls-min-height: 150px;
  133. --view-cam-max-height: calc(var(--view-cam-top) + var(--view-cam-controls-min-height));
  134. --view-cam-min-width: 500px;
  135. max-width: var(--view-cam-calculated-max-width) ;
  136. min-width: var(--view-cam-min-width) ;
  137. width: var(--view-cam-calculated-width) ;
  138. }
  139.  
  140. .main-layout.viewcampage .page.view-cam-page > .main .video .view-cam {
  141. position: relative;
  142. }
  143.  
  144. /* (new110) CAMS - VIDEO CAM PLAYER CONTROLS */
  145. .broadcast-type-webrtc.player.player-type-webrtc.player-wrapper:not(.hover) .player-controls:not(.hover) ,
  146. .broadcast-type-webrtc.player.player-type-webrtc.player-wrapper.hover .player-controls.hover {
  147. position: fixed ;
  148. height: 30px ;
  149. width: 150px !important;
  150. left: 700px !important;
  151. right: 0;
  152. top: 50px !important;
  153. z-index: 101;
  154. opacity: 1 !important;
  155. transition: none !important;
  156. }
  157.  
  158. .view-cam-info .view-cam-info-goal {
  159. -moz-box-flex: 1;
  160. flex: 1 0 85% !important;
  161. font-size: 0.813rem;
  162. font-weight: 400;
  163. height: 100%;
  164. line-height: 1.188rem;
  165. }
  166. .view-cam-info .view-cam-info-king {
  167. -moz-box-flex: 1;
  168. align-items: flex-end;
  169. color: #909090;
  170. display: flex;
  171. flex: 1 0 15% !important;
  172. flex-direction: column;
  173. font-size: 0.688rem;
  174. font-weight: 400;
  175. line-height: 1.125rem;
  176. }
  177. /* (new111) CAMS - VIDEO CAM PLAYER - PAGINATION */
  178. .page-button.page-button-beginning {
  179. position: absolute !important;
  180. right: -5px !important;
  181. padding: 0 10px !important;
  182. }
  183. /* (new110) CAMS - VIDEO CAM PLAYER - MODELS LIST THUMBNAIL - === */
  184. .main-layout.viewcampage .view-cam-page-wrapper .model-list-wrapper {
  185. position: absolute ;
  186. display: inline-block ;
  187. height: 826px !important;
  188. width: 730px ;
  189. right: 7px ;
  190. top: 95px ;
  191. padding: 0 3px 0 5px !important;
  192. border: 1px solid #404040 !important;
  193. overflow: hidden !important;
  194. }
  195.  
  196. /* .view-cam-page-wrapper .model-list-container , */
  197. .main-layout.viewcampage .view-cam-page-wrapper .model-list-wrapper .model-list-container {
  198. width: 730px ;
  199. padding-top: 3px ;
  200. border: none !important ;
  201. }
  202. .main-layout.viewcampage .view-cam-page-wrapper .model-list-wrapper .container.model-list-container {
  203. -moz-box-flex: 1;
  204. display: flex;
  205. flex: 1 1 auto;
  206. flex-direction: column;
  207. padding-bottom: 10px;
  208. margin-top: 31px !important;
  209. }
  210.  
  211. .main-layout.viewcampage .view-cam-page-wrapper .model-list-wrapper .model-list-container .model-list {
  212. width: 730px ;
  213. padding: 5px;
  214. }
  215. .model-list-container .model-list .paginated-list {
  216. max-height: 715px;
  217. padding-bottom: 25px;
  218. overflow: hidden !important;
  219. }
  220.  
  221.  
  222. .main-layout.viewcampage .view-cam-page-wrapper .model-list-wrapper .model-list-container .model-list-item {
  223. filter: brightness(80%) !important;
  224. }
  225. .main-layout.viewcampage .view-cam-page-wrapper .model-list-wrapper .model-list-container .model-list-item:hover {
  226. filter: brightness(100%) !important;
  227. }
  228. .main-layout.viewcampage .view-cam-page-wrapper .model-list-wrapper .model-list-container .paginated-list .model-list-item {
  229. min-width: 32.467% !important;
  230. max-width: 32.467% !important;
  231. margin-left: 5px;
  232. outline: 1px solid violet !important;
  233. }
  234.  
  235. /* CAM MODEL VIEW PROFILE POPUP - === */
  236. .view-cam-page-wrapper .profile-wrapper {
  237. position: fixed;
  238. display: inline-block ;
  239. height: 930px ;
  240. width: 930px ;
  241. right: 5px ;
  242. top: 10px ;
  243. padding: 5px !important;
  244. border-radius: 5px 0 0 5px ;
  245. z-index: 5000;
  246. background: #333 !important;
  247. border-top: 1px solid #ddd;
  248. /* text-align: center !important; */
  249. overflow: hidden ;
  250. }
  251. .view-cam-page-wrapper .profile-wrapper .page {
  252. max-width: 920px !important;
  253. width: 920px !important;
  254. padding-bottom: 10px;
  255. }
  256. .view-cam-page-wrapper .profile-wrapper .profile-header {
  257. margin-top: 0px ;
  258. margin-bottom: -16px;
  259. padding-top: 0px;
  260. color: gray ;
  261. /* text-align: center !important; */
  262. }
  263.  
  264. .view-cam-page-wrapper .profile-wrapper .profile .columns {
  265. height: 900px;
  266. overflow: hidden !important;
  267. overflow-y: auto !important;
  268. }
  269.  
  270. .columns .column.xxl-7 {
  271. width: 100% ;
  272. }
  273. .columns .column.xxl-5 {
  274. flex: 0 0 auto;
  275. width: 100%;
  276. }
  277. .column.xs-12.s-12.m-12.l-5.xl-5.xxl-5>div:not(:empty) {
  278. width: 100%;
  279. min-height: 250px !important;
  280. max-height: 250px !important;
  281. float: left ;
  282. /* overflow: hidden !important; */
  283. border: 1px solid red !important;
  284. }
  285. .albums-gallery-root {
  286. width: 100%;
  287. min-height: 150px !important;
  288. max-height: 150px !important;
  289. overflow: hidden !important;
  290. /* overflow-y: auto !important; */
  291. border: 1px solid red !important;
  292. }
  293. .albums-gallery-root .scroll-bar-container {
  294. width: 100%;
  295. min-height: 200px !important;
  296. max-height: 200px !important;
  297. overflow: hidden !important;
  298. /* overflow-y: auto !important; */
  299. border: 1px solid red !important;
  300. }
  301. .albums-gallery-root .albums-list-item {
  302. flex-basis: 16.3333%;
  303. max-width: 16.3333%;
  304. padding: 2px;
  305. }
  306.  
  307. .column.xs-12.s-12.m-12.l-5.xl-5.xxl-5>div.editable-list.knights.page-block {
  308. width: 100% !important;
  309. min-height: 250px !important;
  310. max-height: 250px !important;
  311. float: left ;
  312. border: 1px solid red !important;
  313. }
  314.  
  315. .editable-list .list-items-container .list-item {
  316. position: relative;
  317. min-height: 67px;
  318. max-height: 67px;
  319. width: 67px;
  320. margin-bottom: 8px;
  321. margin-right: 13px;
  322.  
  323.  
  324. color: #2f2f2f;
  325. text-align: center;
  326. overflow: hidden;
  327. }
  328.  
  329. /* CAMS - INDEX CAMS MODELS - === */
  330. .index-page .model-list-wrapper .model-filter.header-sub + .container.model-list-container .model-list-item {
  331. width: 12.4% !important;
  332. }
  333.  
  334.  
  335. /* (new110) CAMS - TOP POPULAR CAM MODELS PAGES - === */
  336. .best-models-page {
  337. position: relative;
  338. max-width: 1880px !important;
  339. max-height: 900px !important;
  340. left: 16px;
  341. overflow: hidden !important;
  342. background: red !important;
  343. }
  344. .best-models-page .header-sub {
  345. background-color: #535353;
  346. color: hsla(0, 0%, 100%, 0.7);
  347. font-size: 0.86rem;
  348. min-height: 41px;
  349. margin-top: 0px !important;
  350. }
  351. .best-models-page .page {
  352. margin: 0 auto;
  353. margin-top: 0px !important;
  354. max-width: 1880px !important;
  355. max-height: 800px !important;
  356. position: relative;
  357. overflow: hidden !important;
  358. overflow-y: auto !important;
  359. background: #333 !important;
  360. }
  361. .best-models-page .page-header {
  362. margin-bottom: 9px !important;
  363. margin-top: 0px !important;
  364. text-align: center !important;
  365. }
  366.  
  367. /* CAMS - TOP POPULAR CAM MODELS PAGES - MONTHLY WINNERS */
  368. .best-models-page .monthly-top .model-list-item {
  369. width: 14% !important;
  370. }
  371.  
  372.  
  373. /* TOP POPULAR CAM MODELS PAGES - RECENTS WINNERS */
  374. .best-models-page .hourly-top-row.model-list {
  375. width: 50% !important;
  376. }
  377. .best-models-page .hourly-top-row:nth-child(even) {
  378. float: left !important;
  379. clear: none !important;
  380. border: 1px solid gray !important;
  381. background: black !important;
  382. }
  383. .best-models-page .hourly-top-row:nth-child(odd) {
  384. float: right !important;
  385. clear: none !important;
  386. border: 1px solid gray !important;
  387. background: #222 !important;
  388. }
  389. .best-models-page .hourly-top .model-list-item {
  390. width: 16.6% !important;
  391. }
  392.  
  393. /* (new110) CAMS - CHAT */
  394. .view-cam-page > .main .chat {
  395. position: absolute !important;
  396. height: 715px ;
  397. min-width: 245px !important;
  398. max-width: 245px !important;
  399. top: 0px !important;
  400. left: 890px !important;
  401. }
  402. .view-cam-page > .main .chat .model-chat {
  403. min-width: 225px !important;
  404. max-width: 225px !important;
  405. height: 686px;
  406. border-radius: 3px;
  407. margin-left: 10px;
  408. padding-bottom: 0px;
  409. top: 0;
  410. color: #959494 ;
  411. border: 1px solid #404040 !important;
  412. box-shadow: 3px 3px 2px black ;
  413. background: #222 ;
  414. }
  415. .view-cam-page > .main .chat .model-chat .model-chat-wrapper {
  416. min-width: 225px !important;
  417. max-width: 225px !important;
  418. }
  419. .view-cam-page > .main .chat .model-chat .model-chat-wrapper .model-chat-nav-item {
  420. height: 28px !important;
  421. margin-left: 5px !important;
  422. padding: 0 10px !important;
  423.  
  424. }
  425.  
  426. .model-chat .model-chat-private, .model-chat .model-chat-public {
  427. position: absolute;
  428. height: 100%;
  429. width: 100%;
  430. left: 0;
  431. top: 0;
  432. padding-bottom: 0px !important;
  433. }
  434. .model-chat-controls {
  435. width: 830px ;
  436. top: 725px ;
  437. padding: 0 10px !important;
  438. left: -880px !important;
  439. background: #222 !important;
  440. }
  441.  
  442. /* (new110) CAMS - FOOTER - === */
  443. footer:before {
  444. content: "Footer" ;
  445. position: absolute ;
  446. display: inline-block ;
  447. width: 100px ;
  448. top: -15px ;
  449. left: -30px ;
  450. color: peru ;
  451. border-radius: 5px ;
  452. text-align: center ;
  453. cursor: pointer ;
  454. visibility: visible ;
  455. }
  456. footer:hover:before {
  457. top: 0px ;
  458. left: 10px ;
  459. color: gold ;
  460. background: green ;
  461. transition: all ease 0.3s !important;
  462. }
  463.  
  464. footer {
  465. position: fixed!important;
  466. width: 1170px !important;
  467. bottom: -450px !important;
  468. left: 5px !important;
  469. color: peru !important;
  470. cursor: context-menu !important;
  471. background: black !important;
  472. z-index: 500 !important;
  473. transition: all ease 0.3s !important;
  474. }
  475. footer:hover {
  476. display: inline-block !important;
  477. width: 100% !important;
  478. bottom: -10px !important;
  479. border-top: 1px solid gray !important;
  480. z-index: 100 !important;
  481. visibility: visible !important;
  482. color: white !important;
  483. background: #333 !important;
  484. transition: all ease 0.2s !important;
  485. }
  486. .language-dropdown .trigger {
  487. background: green !important;
  488. }
  489.  
  490. footer .footer-section-header {
  491. color: gray !important;;
  492. }
  493. .footer-section-item>a {
  494. color: peru !important;
  495. opacity: 0.5;
  496. }
  497.  
  498.  
  499.  
  500. /* (new110) CAMS COLOR - LINK - === */
  501. a {
  502. color: peru !important;
  503. cursor: pointer;
  504. text-decoration: none;
  505. }
  506. a:visited {
  507. color: tomato !important;
  508. cursor: pointer;
  509. text-decoration: none;
  510. }
  511.  
  512.  
  513.  
  514. /* (new110) CAMS COLOR TEXT - SVG - === */
  515.  
  516. .model-sorting-dropdown .selectbox-arrow .icon.icon-selectbox.model-sorting-dropdown .selectbox-arrow .icon.icon-selectbox {
  517. fill: gray;
  518. }
  519.  
  520. /* (new110) CAMS COLOR TEXT - NORMAL - === */
  521.  
  522. .view-cam-info .view-cam-info-goal ,
  523. .model-sorting-dropdown .model-sorting-dropdown-label ,
  524. .tags-preference-dropdown .tags-preference-dropdown-trigger ,
  525. .page .page-header h1 ,
  526. .live-tags-link-count {
  527. color: gray ;
  528. }
  529. input.input[type="email"],
  530. input.input[type="number"],
  531. input.input[type="search"],
  532. input.input[type="text"],
  533. input.input[type="date"],
  534. input.input[type="password"],
  535. textarea.textarea ,
  536. input.input[type="email"]::placeholder,
  537. input.input[type="number"]::placeholder,
  538. input.input[type="search"]::placeholder,
  539. input.input[type="text"]::placeholder,
  540. input.input[type="date"]::placeholder,
  541. input.input[type="password"]::placeholder,
  542. textarea.textarea::placeholder {
  543. color: gray ;
  544. }
  545.  
  546. /* (new110) CAMS - COLOR TEXT - SELECTED - === */
  547. .model-sorting-dropdown .model-sorting-current-type {
  548. color: tan ;
  549. }
  550.  
  551. /* END == URL PREF - X Xhamster PART 3 - Widescreen - Xhamsterlive v.110 (new110) ==== */
  552.  
  553. /* ============================================================================= */
  554. /* CCC ==== END ==== PART 3 - Xhamsterlive ===================================== */
  555. /* ============================================================================= */
  556.  
  557. }
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!