miniauthorpage>.users--list>li { padding: 5px 0 } miniauthorpage>.users--list>li>a>span { width: 60px; height: 60px; display: inline-block; vertical-align: middle; font-size: 34px; line-height: 60px } miniauthorpage>.users--list>li>span { height: 36px; display: inline-block; vertical-align: middle; margin-right: 8px; background: #ffffff17; border-radius: 6px; padding: 0 16px; cursor: pointer; font-size: 14px; white-space: nowrap; font-weight: 700; line-height: 37px; float: left; margin-top: 12px } miniauthorpage>.users--list>li>span.profilerequests--done { display: none } miniauthorpage>.users--list>li>.info--user-item { display: inline-block; vertical-align: middle; padding-right: 12px } miniauthorpage>.users--list>li>.info--user-item>a { display: block; font-size: 17px; color: #fff } miniauthorpage>.users--list>li>.info--user-item>a>strong { font-weight: 400 } miniauthorpage>.users--list>li>a>span img { width: 100% } miniauthorpage>strong span { color: #d2d5e8 } singlecontainer { display: block; min-height: 100vh; position: relative; z-index: 1; margin-right: 300px } singlecontainer+.messengerbutton { display: none } .GallerySlider {} .owl-item.active { float: right } ul.slid-image--body--instagram-block {} img.image-post--act--slid-image--body--instagram-block { position: absolute; right: 50%; top: 0; transform: translate(50%, 0px); height: 100%; width: auto; max-width: inherit } .owl-item { float: right } .GallerySlider { position: relative; top: 0; right: 0; margin: 0 -16px 12px; color: #000 } ul.slid-image--body--instagram-block.owl-rtl.owl-loaded.owl-drag li { position: relative; height: 0; padding-top: 65%; overflow: hidden } .GallerySlider { right: 0 } .GallerySlider .owl-prev.disabled { display: none } .GallerySlider .owl-prev, .GallerySlider .owl-next { position: absolute; top: 50%; transform: translate(0px, -50%); height: 30px; width: 30px; border: none; border-radius: 50%; text-align: center; font-size: 25px; line-height: 0; background: rgba(255, 255, 255, .68); color: #18191a; font-weight: 600; cursor: pointer } .GallerySlider .owl-prev { left: 20px } .GallerySlider .owl-next { right: 20px } .slid-image--body--instagram-block a.Slides-prev i, .slid-image--body--instagram-block a.Slides-next i { color: #000; line-height: 32px } .GallerySlider .owl-dots { position: absolute; bottom: 0; right: 0; background: linear-gradient(to top, rgba(9, 10, 10, 0.86), rgba(0, 0, 0, 0)); width: 100%; text-align: center; padding: 30px 12px 8px } .owl-dot { width: 6px; height: 6px; margin: 0 3px; border-radius: 50%; background: rgba(255, 255, 255, .22); border: 0; cursor: pointer; position: relative; bottom: 0; right: 0; display: inline-block } .owl-next.disabled {} .owl-dot.active { background: #b0b3b8 } singlecontainertop { display: block; background: #232848; padding: 16px 0 } .inner--singlecontainertop { max-width: 876px; margin: 0 auto } .inner--singlecontainertop .icon--inner--singlecontainertop { width: 132px; height: 132px; border-radius: 50%; margin-left: 16px; background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.5)); text-align: center; font-size: 70px; line-height: 140px; display: inline-block; vertical-align: middle } .inner--singlecontainertop .info--inner--singlecontainertop { display: inline-block; vertical-align: middle } .inner--singlecontainertop .info--inner--singlecontainertop>h1 { font-size: 36px } .inner--singlecontainertop .info--inner--singlecontainertop>h1>span { display: inline-block; color: #d2d5e8 } .inner--singlecontainertop .icon--inner--singlecontainertop.play { background-color: #5367ff } singlecontainer>singlecontainerleft::-webkit-scrollbar { width: 5px; height: 4px } singlecontainer>singlecontainerleft::-webkit-scrollbar-thumb { background: #bdc4ec21; border-radius: 23px } singlecontainer>singlecontainerleft::-webkit-scrollbar-track { background: 0 0 } singlecontainer>singlecontainerleft { display: block; width: 360px; height: calc(100vh - 60px); background: #0c0f21; padding: 16px 16px 0; overflow: auto; z-index: 5; position: fixed; top: 60px; left: 0; box-shadow: 0 0 28px 0 #0003, 0 2px 4px 0 #0000001a; border-right: 1px solid rgba(255, 255, 255, .07) } singlecontainer>singlecontainerright { width: calc(100% - 360px); float: right; display: block; min-height: 100vh; position: relative; padding: 0; background: #1a1d2e; z-index: 6 } .bg--singlecontainerright { position: absolute; top: 0; right: 0; width: 100%; height: 100%; background: #232848; z-index: -1; overflow: hidden } .bg--singlecontainerright>span { display: block; height: 100%; background-size: cover; position: absolute; background-position: center center; background-attachment: fixed; opacity: .5; top: 0; right: 0; width: 100% } .bg--singlecontainerright::after { content: ""; position: absolute; top: 0; right: 0; width: 100%; height: 100%; backdrop-filter: blur(12px); transform: scale(1.2) } .bg--singlecontainerright>span::before { content: ""; position: absolute; top: 0; right: 0; width: 100%; height: 100%; background-image: linear-gradient(rgba(255, 0, 0, 0), rgba(36, 37, 38, 0), rgb(36, 37, 38)) } singlecontainerright-inner { display: block; margin: 0 auto 8px; min-height: 110px } .poster--singlecontainerright { max-width: 190px; display: inline-block; margin-left: 16px } .info--singlecontainerright { display: inline-block; vertical-align: bottom; width: calc(100% - 296px); padding-bottom: 8px } .info--singlecontainerright>h1 { display: inline-block; line-height: 40px; font-size: 38px } .info--singlecontainerright>strong {} .info--singlecontainerright>strong>a { color: #5367ff; font-size: 16px } .poster--singlecontainerright img { vertical-align: top; border-radius: 8px; border: 1px solid #bdc4ec21; box-shadow: 0 12px 28px 0 #0003, 0 2px 4px 0 #0000001a, inset 0 0 0 1px #a7b0ea12 } .box--singlecontainerright { display: block; width: 876px; margin: 0 auto; max-width: 100% } ul.Stories { display: none } ul.Stories.owl-loaded { display: block } .PhotosList { position: relative } .PhotosList .owl-dots { position: absolute; bottom: 0; right: 0; width: 100%; display: none } .PhotosList .owl-next>a, .PhotosList .owl-prev>a { cursor: pointer; position: absolute; width: 32px; text-align: center; font-size: 60px; color: #fff; top: 50%; transform: translate(0px, -50%) } .PhotosList .owl-next>a { right: -45px } .PhotosList .owl-prev>a { left: -45px } .owl-prev.disabled {} .PhotosList .owl-stage-outer { overflow: initial } .PhotosList .owl-stage-outer>.owl-stage {} .PhotosList .owl-stage-outer>.owl-stage>.owl-item {} .PhotosList .owl-stage-outer .owl-item { opacity: .3 } .PhotosList .owl-stage-outer .owl-item.active { opacity: 1 } .PhotosList li { height: 0; width: 876px; --brdius: 0px 0px max(0px, min(8px, ((100vw - 4px) - 100%) * 9999)) max(0px, min(8px, ((100vw - 4px) - 100%) * 9999)) / 0px 0px 8px 8px; padding-top: 39.8%; overflow: hidden; transform: scale(.8); transition: all 400ms ease 0s; border-radius: 8px; max-width: 100% } .PhotosList .owl-stage-outer .owl-item img { vertical-align: top; display: block; margin: 0 auto; border-radius: 8px; position: absolute; top: 30%; transform: translate(0px, -30%); width: 100% } .PhotosList .owl-stage-outer .owl-item .ImageLevel { position: absolute; bottom: 0; cursor: default; transform: translate(0px, 100%); left: 0; transition: all .4s linear 0s; border-radius: 0; background: linear-gradient(32deg, rgb(0, 0, 0), rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)); padding: 130px 130px 20px 20px; font-size: 2rem } .PhotosList .owl-stage-outer .owl-item.active .ImageLevel { transform: translate(0px); transition: .5s all cubic-bezier(0, 0, 1, 1) } .PhotosList .owl-stage-outer .owl-item.active>li { transform: scale(1); border-radius: var(--brdius) } ul.PhotosListSlides { opacity: 0; transition: all .2s ease 0s } ul.PhotosListSlides.owl-loaded { opacity: 1 } .single--info--group-bar { float: left; margin-top: 12px } .single--info--group-bar>a { height: 40px; background: #5367ff; color: #fff; font-size: 15px; line-height: 39px; margin: 0; padding: 0 25px } .single--info--group-bar>a>i { font-size: 18px; display: inline-block; vertical-align: middle; margin-left: 8px } singlecontainerright-center { display: block; max-width: 892px; margin: 0 auto } singlecontainerright-center::after { content: ""; display: block; clear: both } singlecontainerright-center::before { content: ""; display: block; clear: both; height: .1px } singlecontainerright-left { width: 500px; display: block; float: right; margin: 8px } singlecontainerright-right { display: block; width: 360px; float: left; min-height: 400px; margin: 8px } .item--singlepage-right>strong { padding: 0 0 12px; display: block; font-size: 1.25rem; font-weight: 700 } .item--singlepage-right>strong>a { color: #5367ff; display: inline-block; float: left; font-size: 15px; font-weight: 400 } .item--singlepage-right { background: #232848; padding: 16px; border-radius: 8px; margin: 16px 8px 8px } ul.info--item--singlepage-right {} ul.info--item--singlepage-right>li { margin-bottom: 12px } ul.info--item--singlepage-right>li:last-child { margin-bottom: 0 } ul.info--item--singlepage-right>li>i { display: inline-block; vertical-align: top; width: 33px; font-size: 20px; color: #d2d5e8 } ul.info--item--singlepage-right>li>i.fa-imdb { color: #f5c518 } ul.info--item--singlepage-right>li>.inner--info--item--authorpage-right { display: inline-block; vertical-align: top; max-width: calc(100% - 33px) } ul.info--item--singlepage-right>li>.inner--info--item--authorpage-right>strong { display: block; line-height: 100%; margin-bottom: 4px; font-size: 16px; font-weight: 400 } ul.info--item--singlepage-right>li>.inner--info--item--authorpage-right>strong>a { font-weight: 700; color: #fff } ul.info--item--singlepage-right>li>.inner--info--item--authorpage-right>p { font-size: 14px; line-height: 20px } ul.info--item--singlepage-right>li>.inner--info--item--authorpage-right>p.hasnumbers { font-size: 18px } watcharea.watcharea-singlecontainerright-left { display: block; background: #232848; padding: 16px 16px 0; border-radius: 8px; margin: 16px 8px } watcharea.watcharea-singlecontainerright-left::after { content: ""; display: block; clear: both } watcharea.watcharea-singlecontainerright-left>h2 { margin-bottom: 8px } .tabs--watcharea { margin: 0 -16px 16px; overflow: hidden } .tabs--watcharea>ul { overflow: hidden; padding: 0 8px } .tabs--watcharea>ul>li { display: inline-block; margin: 0 4px; line-height: 36px; cursor: pointer; vertical-align: top; padding: 0 12px; border-radius: 8px; border: 1px solid #ffffff17 } .tabs--watcharea>ul>li.selected { background: #bdc4ec21; border-color: transparent } .tabs--watcharea>ul>li>span { color: #d2d5e8 } .tabs--watcharea>ul>li>strong { font-size: 0; font-weight: 700; background: var(--colorli); width: 6px; height: 6px; border-radius: 50%; vertical-align: middle; margin-left: 8px; display: none } .Embed--Watcharea { margin: 0 -16px 8px; background: #000; height: 0; padding-top: 60%; position: relative; cursor: pointer; z-index: 1 } .Embed--Watcharea>.Icon--Embed--Watcharea>i { position: absolute; width: 72px; height: 72px; border: 2px solid #fff; border-radius: 50%; right: 50%; top: 50%; transform: translate(50%, -50%); text-align: center; line-height: 72px; font-size: 33px; z-index: 1; padding-left: 4px; cursor: pointer } .Embed--Watcharea>.Icon--Embed--Watcharea { position: absolute; top: 0; right: 0; width: 100%; height: 100%; z-index: 9 } .Embed--Watcharea>.Icon--Embed--Watcharea.single--button>i { margin-right: 0 } .Embed--Watcharea>.poster--Embed--Watcharea { position: absolute; top: 0; right: 50%; height: 100%; transform: translate(50%, 0%) } .Embed--Watcharea>.poster--Embed--Watcharea img { height: 100% } .videocomments--toggler { padding-bottom: 16px } .Iframe--Embed--Watcharea { position: absolute; top: 0; right: 0; width: 100%; z-index: 10; height: 100%; background: #000 } .Iframe--Embed--Watcharea>svg { width: 82px; height: 82px } .Iframe--Embed--Watcharea iframe { position: relative; z-index: 10; background: #000 } h1.RelatedVideoTitle { margin: 8px 8px 16px; font-size: 1.5rem; padding-top: 16px } h1.RelatedVideoTitle>span { margin: 0 0 0 10px; color: #5367ff; font-size: 34px } h1.RelatedVideoTitle>span>i.fa-play { font-size: 10px; top: 8px } .cover--singlearea { position: relative } a.WatchShowNow--paused--trailer-box { bottom: 46px; right: 40px; position: absolute; white-space: nowrap; line-height: 38px; padding: 0; z-index: 11; text-align: center; font-size: 19px; color: #dddfe4; width: 200px; height: 42px; background: #5367ff; border-radius: 8px } .smallertimeline a.WatchShowNow--paused--trailer-box.hoverable.activable { width: 200px; bottom: 33px; right: auto; left: 30px; margin-left: 0 } a.WatchShowNow--paused--trailer-box>i { vertical-align: middle; display: inline-block; font-size: 14px; padding-top: 0; color: #dddfe4; padding-right: 8px } downloadarea { display: block; background: #232848; padding: 16px; border-radius: 8px; margin: 8px 8px 16px } downloadarea>h2 { font-size: 20px; margin-bottom: 12px } downloadarea>ul { margin: 0 -4px } downloadarea>ul>li { display: inline-block; margin: 0 4px } downloadarea>ul>li>a { display: block; line-height: 16px; font-size: 18px; background: linear-gradient(45deg, rgb(59, 138, 61), rgb(90, 187, 93)); border-radius: 8px; padding: 12px 64px 12px 18px; color: #fff; box-shadow: #2e7330 0 2px 0 1px } downloadarea>ul>li>a>i { position: absolute; top: 13px; font-size: 33px; right: 15px } downloadarea>ul>li>a>span { display: block; font-size: 13px; color: rgba(255, 255, 255, .68) } .post--buttons { float: left; padding: 12px 0 } .post--buttons>span.imdb--post--buttons { font-size: 26px; height: 36px; background: #f5c518; display: block; border-radius: 6px; padding: 0 12px; line-height: 36px; color: #000; direction: ltr } .post--buttons>span.imdb--post--buttons>em { font-style: normal; font-size: 14px; font-weight: 700; vertical-align: bottom; display: inline-block; line-height: 20px } .post--buttons>span.imdb--post--buttons>em i { display: block; font-size: 10px; text-align: center } .mpaa--post--buttons { margin: 8px; background: #232848; border-radius: 8px; padding: 10px 16px 10px 18px; color: #d2d5e8 } .mpaa--post--buttons>i { float: left; font-size: 25px; padding-top: 1px; color: #5367ff } .mpaa--post--buttons>a { display: inline-block; vertical-align: middle; font-size: 19px; margin-left: 10px } teawork { padding: 16px; background: #232848; border-radius: 8px; width: 500px; display: block; float: left; margin: 8px } teawork>h2 { font-weight: 400; font-size: 20px; margin-bottom: 8px } teaworkright divider { margin: 12px 0 } .inner--teamwork { margin: 0 -8px } .inner--teamwork>li { vertical-align: top; padding: 8px 0 } .inner--teamwork>li>a { display: block; padding: 0 8px } .inner--teamwork>li>a .photo { height: 60px; overflow: hidden; margin-left: 12px; border-radius: 72px; background: #bdc4ec21; width: 60px; display: inline-block; vertical-align: middle; text-align: center } .inner--teamwork>li>a .photo>span { display: block; height: 100%; background-size: cover; background-position: 0% 25% } .inner--teamwork>li>a .photo>i { display: block; line-height: 64px; font-size: 30px; color: #bdc4ec21 } .inner--teamwork>li>a .info { display: inline-block; vertical-align: middle; line-height: 32px } .inner--teamwork>li>a .info>strong { display: block; font-size: 18px; color: #fff; font-weight: 400; line-height: 18px } .inner--teamwork>li>a .info>span { display: block; color: #d2d5e8; font-size: 16px; line-height: 20px } .inner--teamwork>li>a .photo img { position: relative; top: 24%; transform: translate(50%, -25%); right: 50%; width: 100% } teaworkparent { display: block; position: relative } teaworkparent::after { content: ""; display: block; clear: both } teaworkright { display: block; width: 360px; float: right; margin: 8px } teaworkright h2 { font-weight: 400; font-size: 20px; margin-bottom: 12px } a.more--teamwork { display: block; height: 36px; border-radius: 8px; text-align: center; line-height: 36px; color: #fff; font-size: 17px; background: #bdc4ec21 } a.more--teamwork.waiting { opacity: .6; pointer-events: none } div#inner--teaworkright { background: #232848; border-radius: 8px; padding: 16px } photosgrid { border-radius: 8px; display: block; margin: 16px 8px 8px; background: #232848; padding: 16px; min-height: 300px } photosgrid>h2 { margin-bottom: 8px; font-weight: 400; font-size: 22px } ul.inner--photogrid { margin: 0 -8px } ul.inner--photogrid>li { width: 199px; height: 205px; display: inline-block; background: #bdc4ec21; vertical-align: top; margin: 8px } @keyframes PhotoLoader { 0% { opacity: .7 } } ul.inner--photogrid>li.loading { animation: 1.5s ease 0s infinite normal none running PhotoLoader } ul.inner--photogrid>li>a { display: block; height: 100% } ul.inner--photogrid>li>a>span { display: block; height: 100%; background-size: cover; background-position: 50% 20% } p.no--rows { line-height: 40px; font-size: 20px; color: #d2d5e8 } .WatchPostNow { font-size: 14px; cursor: pointer; height: 36px; border-radius: 50px; text-align: center; line-height: 33px; background: #5367ff; float: left; color: #fff; margin-top: 6px; padding: 0 14px } .WatchPostNow>i { vertical-align: middle; font-size: 12px; margin-left: 8px } .parent--notifications { padding: 16px 16px 0; margin: 0 -8px -8px; max-height: calc(100vh - 70px); overflow: auto; overscroll-behavior: contain } h1.title--notifications { font-size: 1.5rem; font-weight: 400 } h1.title--notifications::after { content: ""; display: block; clear: both } h1.title--notifications>span { display: inline-block; width: 32px; height: 32px; border-radius: 36px; float: left; cursor: pointer; text-align: center; line-height: 36px; font-size: 18px; color: #d2d5e8 } strong.title--side--notifications { display: block; font-weight: 400; font-size: 1.0625rem; margin-bottom: 0 } ul.list--notifications { margin: 0 -16px 8px; padding: 0 8px } .notification--item>a>.avatar--notification--item { width: 56px; height: 56px; display: inline-block; position: relative; margin-left: 16px; border: 1px solid #bdc4ec21; vertical-align: middle; border-radius: 50% } .notification--item>a>.avatar--notification--item>span { line-height: 56px; font-size: 30px } .notification--item>a>.info--notification--item { display: inline-block; max-width: calc(100% - 72px); vertical-align: middle; color: #d2d5e8 } .notifications--tempo>.notification--item>a .info--notification--item { width: calc(100% - 72px) } .notification--item>a>.info--notification--item>strong { display: block; font-weight: 400; font-size: .9375rem; margin-bottom: 8px; word-break: break-word; line-height: 1.3333 } .notification--item>a>.info--notification--item>time { display: block; color: #d2d5e8; font-size: 12px; line-height: 100% } .notification--item>a>.avatar--notification--item .emoji--icon { position: absolute; bottom: 0; left: -5px; width: 28px; height: 28px } .notification--item>a>.avatar--notification--item>span>img { width: 100%; height: 100% } .notification--item>a { display: block; padding: 8px; border-radius: 8px; color: #dddfe4 } .notification--item.notification--notseen>a>.info--notification--item>time { color: #5367ff; font-weight: 700 } .notification--item.notification--notseen>a>.info--notification--item>strong { color: #dddfe4 } .notification--item { position: relative } .notification--item.notification--loading>a>.info--notification--item>strong { height: 14px; background: #bdc4ec21; width: 232px; max-width: 100%; border-radius: 8px } .notification--item.notification--loading>a>.info--notification--item>time { height: 8px; background: #bdc4ec21; width: 100px; border-radius: 8px } .notification--item>a { padding-left: 26px } .notification--item.notification--notseen .seenit { position: absolute; width: 12px; height: 12px; left: 8px; background: #5367ff; border-radius: 12px; top: 50%; transform: translate(0px, -50%); z-index: 1; cursor: pointer } .parent--notifications ul.friendrequests--items { margin: 0 -8px } notifications { position: fixed; bottom: 16px; right: 16px; z-index: 120 } .notifications--tempo { max-width: 360px; background: #232848; border-radius: 8px; transform: translate(0px, 150%); transition: 150ms transform cubic-bezier(0, 0, 1, 1); padding: 8px } .notifications--tempo li.item--friendrequests--items>.confirmation--item--friendrequests--items { margin-top: 18px; left: 16px } .notifications--tempo li.item--friendrequests--items { width: 360px; padding: 45px 16px 16px 40px } .notifications--tempo>.notification--item>a { padding: 8px 8px 8px 42px; width: 100% } .notifications--tempo>.notification--item .seenit { left: 16px } .notifications--tempo>span { display: block; font-size: 14px; z-index: 14; padding: 8px 8px 8px 0; left: 16px; cursor: pointer } .notifications--tempo>span>i { display: block; float: left; height: 26px; width: 26px; border-radius: 36px; background: #bdc4ec21; text-align: center; line-height: 30px; color: #d2d5e8; margin-top: -4px } .bell--icon { position: absolute; top: -4px; left: -4px; font-style: normal; font-size: 12px; background: #f0284a; border-radius: 50px; width: 20px; line-height: 20px; height: 20px; z-index: 4; color: #fff } .bell--icon.none { display: none !important } .parent--messenger { padding: 4px 16px 8px; margin: 0 -8px; max-height: calc(100vh - 114px); overflow: auto; overscroll-behavior: contain; min-width: 290px } h1.title--messenger { font-size: 26px; font-weight: 600; line-height: 32px; margin-bottom: 12px } h1.title--messenger::after { content: ""; display: block; clear: both } .tools--messenger { display: inline-block; width: 32px; height: 32px; border-radius: 36px; float: left; cursor: pointer; text-align: center; line-height: 36px; font-size: 16px; color: #d2d5e8; margin-right: 4px } .parent--messenger::-webkit-scrollbar { width: 6px; height: 4px } .parent--messenger::-webkit-scrollbar-thumb { background: #ffffff17; border-radius: 3px } .parent--messenger::-webkit-scrollbar-track { background: 0 0 } .chats--list { min-height: 370px; margin: 0 -16px; padding: 0 8px } .chats--list>li { cursor: pointer; position: relative } .chats--list>li>a { display: block; padding: 8px; border-radius: 8px; color: #dddfe4 } .chats--list>li>seenit { position: absolute; top: 50%; left: 16px; width: 12px; z-index: 10; height: 12px; border-radius: 12px; background: #5367ff; transform: translate(0px, -50%) } .chats--list>li.notseen .chat--info>.message--chat--info>p { color: #5367ff } .chats--list>li.notseen .chat--info>.message--chat--info>p msg { font-weight: 700 } .chats--list>li .chat--avatar { width: 56px; height: 56px; display: inline-block; vertical-align: middle; margin-left: 16px } .chats--list>li .chat--avatar>span { line-height: 56px; font-size: 30px } .chats--list>li .chat--info { display: inline-block; vertical-align: middle; width: calc(100% - 102px) } .chats--list>li .chat--status { position: absolute; top: 50%; left: 16px; transform: translate(0px, -50%) } .chats--list>li .chat--status>em { display: inline-block; width: 16px; color: #bdc4ec21; line-height: 16px; font-size: 9px; height: 16px; border-radius: 12px; text-align: center; border: 1px solid #bdc4ec21 } .chats--list>li .chat--status>em.recieved { background: #666667; border-color: transparent; color: #232848 } .chats--list>li .chat--status>em.seen { border-color: transparent } .chats--list>li .chat--status>em>span { line-height: 100% } .chats--list>li .chat--info>strong { display: block; font-size: 16px; line-height: 100%; font-weight: 400; margin-bottom: 4px } .chats--list>li.notseen .chat--info>strong { font-weight: 700 } .chats--list>li .chat--info>.message--chat--info { line-height: 100% } .chats--list>li .chat--info>.message--chat--info>p>time { display: inline-block; vertical-align: middle; color: #d2d5e8 } .chats--list>li .chat--info>.message--chat--info>p>span { display: inline-block; vertical-align: middle; padding: 0 7px; color: #d2d5e8; font-weight: 700 } .chats--list>li .chat--info>.message--chat--info>p { display: inline-block; vertical-align: middle; color: #d2d5e8; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100% } .chats--list>li .chat--info>.message--chat--info>typing { display: inline-block; background: #bdc4ec21; height: 28px; width: 50px; border-radius: 30px; padding-right: 8px } .chats--list>li .chat--info>.message--chat--info>typing>svg { height: 35px; vertical-align: top; margin-top: -4px; margin-right: -7px; opacity: .5 } .chats--list>li .chat--info>.message--chat--info>p>msg>svg { width: 17px; height: auto; vertical-align: middle } .chats--list>li .chat--avatar img { width: 100%; height: 100% } .chats--search>input { height: 36px; border: 0; width: 100%; border-radius: 36px; background: #bdc4ec21; padding: 0 36px 0 16px; font-family: Tajawal; font-size: 16px; color: #dddfe4 } .chats--search>input:focus::placeholder { opacity: .5 } .chats--search>input::placeholder { color: #d2d5e8 } .chats--search { transition: 150ms all cubic-bezier(0, 0, 1, 1); position: relative; margin-bottom: 8px } .chats--search.focused { padding-right: 40px } .chats--search.focused>input { padding: 0 16px } .chats--search.focused>i { opacity: 0 } .chats--search>span { right: -40px; position: absolute; height: 36px; width: 36px; border-radius: 36px; text-align: center; line-height: 40px; cursor: pointer; font-size: 18px; opacity: 0; transition: 150ms all cubic-bezier(0, 0, 1, 1) } .chats--search.focused>span { opacity: 1; right: 0 } .chats--search>i { position: absolute; top: 12px; right: 12px; font-size: 16px; transition: 150ms all cubic-bezier(0, 0, 1, 1); color: #d2d5e8; pointer-events: none } .parent--more--messenger { margin: 0 -8px -8px; border-top: 1px solid #bdc4ec21; text-align: center } .parent--more--messenger>a { display: block; line-height: 44px; font-size: 16px } p.friendsearching--notfound { padding: 10px 8px; color: #d2d5e8; font-size: 15px } ul#contacts--messenger { margin: 0 -8px; min-height: 370px; position: relative; min-width: 300px } ul#contacts--messenger>svg { width: 50px; height: auto; top: 50%; right: 50%; margin: -25px } .chatitem--image { position: relative; border: 1px solid #bdc4ec21; border-radius: 8px; min-width: 163px } .chatitem--image.sending>img { opacity: .5; pointer-events: none } .chatitem--image>svg { top: 50%; width: 26px; height: 26px; right: 50%; opacity: 1; margin: -13px } mentioned { margin: 8px; user-select: none; display: block } mentioned>mentionedusers { display: block; border: 1px solid #bdc4ec21; min-height: 55px; border-radius: 8px; padding: 8px; max-height: 160px; overflow: auto } mentioned>mentionedusers>span { display: inline-block; line-height: 30px; vertical-align: top; background: #bdc4ec21; margin: 4px; color: #5367ff; height: 32px; padding: 0 8px 0 2px; border-radius: 6px; font-size: .9375rem; font-weight: 600 } mentioned>mentionedusers>span>i { height: 28px; width: 28px; margin-right: 4px; border-radius: 28px; text-align: center; vertical-align: middle; padding-top: 8px } mentioned>mentionedusers:focus { border-color: #5367ff } mentioned>strong { display: block; font-weight: 700; line-height: 100%; padding: 0; margin-bottom: 12px; font-size: 13px; color: #d2d5e8 } .tabs--feelings--posttools { padding: 8px 16px } .tabs--feelings--posttools>ul {} .tabs--feelings--posttools>ul>li { display: inline-block; font-weight: 600; color: #d2d5e8; vertical-align: top; height: 52px; line-height: 52px; cursor: pointer; font-size: 14px; padding: 0 16px; border-radius: 8px } .tabs--feelings--posttools>ul>li.selected { height: 56px; box-shadow: inset 0 -3px #5367ff; border-radius: 0; color: #5367ff } .search--feelings--posttools { margin: 0; padding: 0 16px 8px; border-bottom: 1px solid #ffffff0d } .search--feelings--posttools>.input--search--feelings--posttools { display: block; vertical-align: middle; height: 36px; border-radius: 36px; background: #bdc4ec21; padding: 0 12px } .search--feelings--posttools>span { vertical-align: middle; width: 40px; display: inline-block; height: 36px; border-radius: 36px; text-align: center; color: #5367ff; line-height: 36px; cursor: pointer; font-weight: 700 } .search--feelings--posttools>.input--search--feelings--posttools>input { display: inline-block; background: 0 0; border: 0; font-size: 14px; font-family: Tajawal; padding: 8px 12px; width: calc(100% - 18px); color: #fff } .search--feelings--posttools>.input--search--feelings--posttools>input:focus::placeholder { opacity: .6 } .search--feelings--posttools>.input--search--feelings--posttools>input::placeholder { color: #d2d5e8 } .search--feelings--posttools>.input--search--feelings--posttools>i { vertical-align: middle; font-size: 18px; color: #d2d5e8 } .list--feelings--posttools { height: calc(100% - 46px); overflow: auto; padding: 8px; overscroll-behavior: contain; position: relative } .list--feelings--posttools>.inner--list--feelings--posttools { flex-flow: row wrap; display: flex } .inner--list--feelings--posttools>li { width: 50%; padding: 8px; border-radius: 8px; cursor: pointer; user-select: none } .inner--list--feelings--posttools>li.selected { background: #0e1331 } .inner--list--feelings--posttools>li>span { display: inline-block; vertical-align: middle; height: 36px; border-radius: 36px; width: 36px; background: #bdc4ec21; text-align: center; margin-left: 12px; line-height: 48px } .inner--list--feelings--posttools>li>em { font-style: normal; font-size: .9375rem; color: #dddfe4 } .inner--list--feelings--posttools>li>span img { display: inline-block; width: 20px } .list--feelings--posttools>.ptools--loader { width: 50px; height: 50px; position: relative; top: 50%; opacity: .5; right: 50%; transform: translate(50%, -50%) } ul.inner--list--activities--posttools {} ul.inner--list--activities--posttools>li { padding: 8px; cursor: pointer; border-radius: 8px } ul.inner--list--activities--posttools>li>span { display: inline-block; vertical-align: middle; margin-left: 12px; width: 36px; height: 36px; background: #bdc4ec21; border-radius: 36px } ul.inner--list--activities--posttools>li>span>img { width: 20px; position: relative; display: block; margin: 0 auto; top: 50%; transform: translate(0px, -50%) } ul.inner--list--activities--posttools>li>p { display: inline-block; vertical-align: middle; color: #dddfe4 } ul.inner--list--activities--posttools>li>active { float: left; font-size: 30px; line-height: 100%; color: #d2d5e8; padding: 3px 8px 0 } .search--feelings--posttools.activity--searching { display: flex } .search--feelings--posttools.activity--searching>.input--search--feelings--posttools { flex: 1 1 0% } .search--feelings--posttools.activity--searching>.selected { background: #bdc4ec21; border-radius: 8px; margin-left: 16px; line-height: 36px; color: #5367ff; padding: 0 10px 0 0 } .search--feelings--posttools.activity--searching>.selected>p { display: inline-block; vertical-align: middle; margin-left: 0 } .search--feelings--posttools.activity--searching>.selected>i { display: inline-block; vertical-align: middle; width: 28px; height: 28px; border-radius: 36px; text-align: center; line-height: 30px; margin-left: 4px; font-size: 16px; cursor: pointer } ul.searching--list--activities--posttools { min-height: 100% } ul.searching--list--activities--posttools>.ptools--loader { width: 40px; height: 40px; position: absolute; opacity: .5; top: 50%; right: 50%; transform: translate(50%, -50%) } .PostHead>.PostHeadInfo>p>span.icon--feeling { display: inline-block; width: 16px; vertical-align: middle } .PostHead>.PostHeadInfo>p>span.icon--feeling>img { vertical-align: top } .notification--item>a>.info--notification--item>strong>img { width: 16px; vertical-align: middle } .AddCommentEmotes>div {} .AddCommentEmotes>div>i { vertical-align: top; font-size: 18px } .AddCommentEmotes>div>i.fa-camera { padding-top: 3px } .ReplyBox>.AddComment>.AddCommentInput>.AddCommentEmotes>div { padding: 6px 6px 3px } .comm--previewphoto { padding: 0; margin-top: 8px; margin-right: 45px; border: 1px solid #bdc4ec21; border-radius: 8px } .comm--previewphoto>img { min-width: 200px; max-width: 280px; margin-left: 16px; display: inline-block; vertical-align: middle; border-radius: 0 8px 8px 0 } span.remove--comm--previewphoto { display: inline-block; vertical-align: middle; width: 28px; height: 28px; color: #d2d5e8; text-align: center; background: #bdc4ec21; line-height: 30px; font-size: 22px; float: left; border-radius: 8px; margin: 4px } .comment-area--comments.emptycontent>.inner--comment-area---comments>.bg--inner--comment-area---comments { background: 0 0; padding: 4px 12px } .photos--comment { padding-top: 0; position: relative } .photos--comment>.parent-item--photos--comment>a { vertical-align: top; display: inline-block; max-height: 200px; overflow: hidden; min-width: 200px; max-width: 280px; position: relative; border: 1px solid #bdc4ec21; border-radius: 18px } .photos--comment>.parent-item--photos--comment>a>img { vertical-align: top; border-radius: 18px } .AddComment>.AddCommentAvatar>a>span.unknown--avatar { line-height: 36px } .ReplyBox>.AddComment>.comm--previewphoto { margin-right: 32px } .photos--comment>.parent-item--photos--comment>a>.loader--item--photos--comment { position: absolute; top: 0; right: 0; left: 0; bottom: 0; background: #0b0b0bcc; border-radius: 18px } .photos--comment>.parent-item--photos--comment>a>.loader--item--photos--comment>svg { width: 40px; height: auto } .bg--inner--comment-area---comments { background: #bdc4ec21; padding: 10px 12px 6px; border-radius: 18px; display: inline-block } .parent-item--photos--comment { display: inline-block; position: relative } .parent-item--photos--comment>.comment--reactions--post-reactions---post-statistics----postitem { right: auto; left: 10px; bottom: -16px } ul.list--groups--ui { padding-top: 8px; margin: 0 -8px 0 0 } .groups--rightbar>strong { display: block; font-size: 19px; font-weight: 400; color: #d2d5e8 } ul.list--groups--ui>li {} ul.list--groups--ui>li>a { display: block; padding: 8px; border-radius: 8px } ul.list--groups--ui>li .icon--item--list--groups--ui { width: 36px; height: 36px; border-radius: 18px; display: inline-block; vertical-align: middle; margin-left: 16px; background-color: #bdc4ec21; text-align: center } ul.list--groups--ui>li .icon--item--list--groups--ui>span { vertical-align: top; display: inline-block; position: relative; top: 50%; transform: translate(0px, -50%); line-height: 26px; color: #fff; opacity: .5; font-size: 24px } ul.list--groups--ui>li>a>strong { display: inline-block; vertical-align: middle; color: #dddfe4; font-weight: 400; font-size: 17px } a.showmore-userarea--rightbar>i>svg { width: 22px; height: auto; margin: auto; opacity: .8 } ul.menu-userarea--rightbar>li .photo { width: 38px; height: 38px; display: inline-block; border-radius: 36px; vertical-align: middle; margin-left: 16px; background: #bdc4ec21 } ul.menu-userarea--rightbar>li .photo>span { display: block; height: 100%; background-size: cover; border-radius: 36px } .inner--post-comments---postitem:empty { display: none } singlecontainerleft .comm--previewphoto>img { max-width: 170px; min-width: 130px } .inner--comment-area---comments>.bg--inner--comment-area---comments>span>a { color: #fff } .post-comments--postitem>ul.inner--post-comments---postitem:empty { display: block } singlecontainerright.fullimage--timelinesingle { background: #000; z-index: 1; height: 100vh; display: flex; padding: 80px 20px 20px } span.blur--fullimage--timelinesingle { position: absolute; top: 0; right: 0; width: 100%; z-index: -1; height: 100%; background-size: cover; background-position: center center } span.blur--fullimage--timelinesingle::after { content: ""; display: block; height: 100%; backdrop-filter: blur(11px); background: rgba(12, 15, 33, .84) } singlecontainerright.fullimage--timelinesingle>img { object-fit: cover; width: 100%; height: 100% } .thumb--singlecontainerright { display: flex; align-items: center; justify-content: space-between; flex-grow: 1; position: relative; z-index: 1; height: 100% } .thumb--singlecontainerright>.inner--thumb--singlecontainerright { position: relative; display: flex; flex-direction: column; margin: 0 auto; justify-content: center } .thumb--singlecontainerright>.inner--thumb--singlecontainerright>img { max-height: calc(100vh - 60px); object-fit: cover } .tools--fullimage--timelinesingle { position: absolute; top: 0; padding: 6px; left: 50px; cursor: pointer; z-index: 2 } .tools--fullimage--timelinesingle>* { vertical-align: top; display: inline-block; position: relative; float: left; color: #dddfe4; width: 48px; height: 48px; text-align: center } .tools--fullimage--timelinesingle>*>i { vertical-align: top; font-size: 30px; padding-top: 10px } .tools--fullimage--timelinesingle>::after { content: ""; position: absolute; top: 0; right: 0; left: 0; bottom: 0; border-radius: 50% } .tools--fullimage--timelinesingle>:active::after { background: #bdc4ec21 } span.closethumb--singlecontainerright { position: absolute; top: 0; bottom: 0; right: 0; left: 0; z-index: -1 } singlecontainer.parent--fullimage--timelinesingle { padding-top: 0; z-index: 101 } singlecontainerright.fullimage--timelinesingle a.next--gallery, singlecontainerright.fullimage--timelinesingle a.prev--gallery { position: absolute; width: 48px; height: 48px; background: #ffffff14; top: 50%; box-shadow: 0 0 0 1px #0000001a; transform: translate(0px, -50%); border-radius: 48px; z-index: 5; text-align: center; line-height: 53px; font-size: 33px; color: #d2d5e8 } singlecontainerright.fullimage--timelinesingle a.next--gallery { left: 16px } singlecontainerright.fullimage--timelinesingle a.prev--gallery { right: 16px } [data-action=backbutton] { vertical-align: top; display: inline-block; position: absolute; left: 6px; color: #dddfe4; width: 48px; height: 48px; top: 6px; text-align: center; z-index: 3 } [data-action=backbutton]>i { vertical-align: top; font-size: 26px; padding-top: 13px } [data-action=backbutton]::after { content: ""; position: absolute; top: 0; right: 0; left: 0; bottom: 0; border-radius: 50% } [data-action=backbutton]:active::after { background: #bdc4ec21 } a.onright[data-action=backbutton] { right: 12px; left: auto; top: 4px; background: #bdc4ec21; border-radius: 48px } .FirstSideFlex.paddingforclose { right: 70px } a.onright[data-action=backbutton]+.tools--fullimage--timelinesingle { left: 0 } form.SearchArea.hidden { display: none } .PhotosList li>a { color: #fff } .row--chatbody.his .tools--item--messages--chatitem { right: 100%; margin-right: 8px; left: auto; margin-left: 0; direction: ltr } .tools--item--messages--chatitem { position: absolute; transform: translate(0px, -50%); top: 50%; left: 100%; white-space: nowrap; display: none; margin-left: 8px } .tools--item--messages--chatitem>span { width: 22px; display: inline-block; height: 22px; color: #ffffff4d; text-align: center; line-height: 26px; font-size: 15px; vertical-align: top; border-radius: 22px; cursor: pointer } .chatitem--chatbody:hover .tools--item--messages--chatitem { display: block } ul.emote--item--messages--chatitem { position: fixed; background: #232848; box-shadow: 0 12px 28px 0 #0003, 0 2px 4px 0 #0000001a, inset 0 0 0 1px #a7b0ea12; border-radius: 20px; height: 46px; z-index: 105; width: 276px; display: flex; padding: 0 8px } ul.emote--item--messages--chatitem>li { flex: 1 1 0%; text-align: center; cursor: pointer; padding-top: 7px } ul.emote--item--messages--chatitem>li>img { vertical-align: top } .chatitem--chatbody .tools--item--messages--chatitem.focused { display: block } morespacereactions { display: block; height: 17px } message--reacts { display: block; position: absolute; bottom: -12px; height: 18px; left: 8px; background: #232848; border-radius: 20px; padding: 0 2px; line-height: 18px; cursor: pointer; white-space: nowrap } message--reacts>ul>li>img { width: 16px; vertical-align: top } message--reacts>ul { display: inline-block; vertical-align: middle } message--reacts>span { vertical-align: middle; font-size: 12px; padding: 0 4px } .row--chatbody.noparents:hover .tools--item--messages--chatitem { display: block } message--reacts>ul>li { display: inline-block; vertical-align: middle } message--reacts>ul>li~li { margin-right: 0 } message--reacts.active { color: #ffcf48; font-weight: 700 } message--reacts.active[data-selected=love] { color: #fe3938 } ul.actions--item--messages--chatitem { position: fixed; z-index: 105; cursor: pointer; width: 100px; background: #232848; border-radius: 8px; padding: 4px; display: flex; box-shadow: 0 12px 28px 0 #0003, 0 2px 4px 0 #0000001a, inset 0 0 0 1px #a7b0ea12 } ul.actions--item--messages--chatitem>li { flex: 1 1 0%; text-align: center; border-radius: 8px } ul.actions--item--messages--chatitem::after { content: ""; position: absolute; top: 100%; right: 50%; transform: translate(50%, 0px); width: 0; height: 0; border-style: solid; border-width: 10px 10px 0; border-color: #232848 #0000 #0000 #0000; margin-top: -1px } .message--replybox--preview { position: relative; padding: 12px 8px 12px 48px; line-height: 100%; border-top: 1px solid #bdc4ec21 } .message--replybox--preview>message--replybox--preview--title { display: block; margin-bottom: 4px; font-size: 13px } .message--replybox--preview>div { overflow: hidden; text-overflow: ellipsis; color: #d2d5e8 } .message--replybox--preview>i { position: absolute; top: 11px; left: 0; height: 36px; width: 36px; text-align: center; line-height: 36px; border-radius: 38px; font-size: 18px } chatheadtooltip>lastmsg br { display: none } .reply--messages--chatitem--chatbody { padding-top: 12px; margin-bottom: -13px } .reply--messages--chatitem--chatbody>p { font-size: 12px; line-height: 15px; color: #d2d5e8; margin-bottom: 4px; direction: rtl; text-align: left } .reply--messages--chatitem--chatbody>.inner--reply--messages--chatitem--chatbody { background: #0006; display: inline-block; border-radius: 18px; padding: 4px 15px 18px; color: #d2d5e8; white-space: normal; word-break: break-word; line-height: 20px } .row--chatbody.his .reply--messages--chatitem--chatbody>.inner--reply--messages--chatitem--chatbody { background: var(--chatcolor); position: relative; color: rgba(255, 255, 255, .72); z-index: 1 } .row--chatbody.his .reply--messages--chatitem--chatbody>p { text-align: right } .chatitem--image+.message--reactions>message--reacts { bottom: 12px } chat--tools { position: absolute; top: -20px; left: 100%; display: none; padding: 8px; width: 344px; background: #232848; border-radius: 8px; box-shadow: 0 12px 28px 0 #0003, 0 2px 4px 0 #0000001a, inset 0 0 0 1px #a7b0ea12; margin-left: 12px } chat--tools::after { content: ""; width: 0; height: 0; border-style: solid; border-width: 10px 10px 10px 0; border-color: #0000 #232848 #0000 #0000; position: absolute; top: 32px; right: 100%; margin-right: -1px } chat--tools>ul>a, chat--tools>ul>li { display: block; padding: 8px; color: #dddfe4; font-size: 15px; line-height: 25px; border-radius: 8px } chat--tools>ul>a>span, chat--tools>ul>li>span { display: inline-block; vertical-align: text-bottom; width: 30px; height: 20px; margin-left: 8px; text-align: center; font-size: 20px } chat--tools>ul>divider { margin: 8px } chat--tools>ul>a:first-child { color: #5367ff } chat--tools>ul>a { font-weight: 600 } ul.List--ChatColors { max-width: 400px; text-align: center; margin: -8px -16px -16px } ul.List--ChatColors>li { display: inline-block; margin: 4px 14px; padding: 8px; border-radius: 18px; cursor: pointer } ul.List--ChatColors>li>span { display: block; height: 48px; width: 48px; border-radius: 48px } ul.List--ChatColors>li.selected { background: #0e1331 } chat[color=candy] { --chatcolor: rgb(255, 124, 168); --chatcolor_gradient: radial-gradient(circle at center 75%, rgb(0, 229, 255) 0%, rgb(167, 151, 255) 50%, rgb(255, 143, 178) 100%) } chat[color=lemon] { --chatcolor: rgb(26, 219, 91); --chatcolor_gradient: radial-gradient(circle at center 75%, rgb(255, 210, 0) 0%, rgb(110, 223, 0) 50%, rgb(0, 223, 187) 100%) } chat[color=blueberry] { --chatcolor: rgb(240, 29, 106); --chatcolor_gradient: radial-gradient(circle at center 75%, rgb(255, 46, 25) 0%, rgb(146, 0, 255) 50%, rgb(0, 95, 255) 100%) } chat[color=mango] { --chatcolor: rgb(255, 156, 25); --chatcolor_gradient: radial-gradient(circle at center 75%, rgb(255, 220, 45) 0%, rgb(255, 150, 22) 50%, rgb(255, 79, 0) 100%) } chat[color=cyan_greenish] { --chatcolor: rgb(14, 220, 222); --chatcolor_gradient: radial-gradient(circle at center 75%, rgb(14, 230, 183) 0%, rgb(0, 230, 210) 50%, rgb(25, 201, 255) 100%) } chat[color=blue] { --chatcolor: rgb(0, 132, 255) } chat[color=blue_green] { --chatcolor: rgb(68, 190, 199) } chat[color=yellow] { --chatcolor: rgb(255, 195, 0) } chat[color=lavender_violet] { --chatcolor: rgb(214, 150, 187) } chat[color=green] { --chatcolor: rgb(19, 207, 19) } chat[color=orange] { --chatcolor: rgb(255, 126, 41) } chat[color=coral_pink] { --chatcolor: rgb(230, 133, 133) } chat[color=light_organic] { --chatcolor: rgb(118, 70, 255) } chat[color=blue_sea] { --chatcolor: rgb(32, 206, 245) } chat[color=dark_pink] { --chatcolor: rgb(255, 92, 161) } .row--chatbody.his .reply--messages--chatitem--chatbody>.inner--reply--messages--chatitem--chatbody::after { content: ""; position: absolute; top: 0; right: 0; height: 100%; width: 100%; background: rgba(0, 0, 0, .38); z-index: -1; border-radius: 18px } messenger>chat.focused, messenger>chat.abouttofocus { z-index: 8 } p.color--changed { text-align: center; font-size: 11px; padding: 8px; line-height: 100%; color: #d2d5e8 } p.color--changed>span { display: inline-block; color: var(--chatcolor); padding-right: 4px; font-weight: 700 } messenger>chat.focused>chatfooter>span>svg path { fill: var(--chatcolor) } ul.Message--deletion-confirm { max-width: 668px } ul.Message--deletion-confirm>li { margin-bottom: 16px } ul.Message--deletion-confirm>li>.Selectbox { width: 40px; height: 40px; display: inline-block; vertical-align: top; border-radius: 18px; cursor: pointer } ul.Message--deletion-confirm>li>.Message-info--deletion-confirm { display: inline-block; vertical-align: top; max-width: calc(100% - 52px); padding-right: 12px } ul.Message--deletion-confirm>li>.Message-info--deletion-confirm>strong { display: block; font-size: 17px; font-weight: 400; line-height: 100%; margin-bottom: 4px } ul.Message--deletion-confirm>li>.Message-info--deletion-confirm>p { color: #d2d5e8; font-size: 16px } ul.Message--deletion-confirm>li:last-child { margin-bottom: 0 } ul.Message--deletion-confirm>li>.Selectbox>span {} ul.menu-userarea--rightbar>li>a>i.colorui--home { color: #5367ff } ul.menu-userarea--rightbar>li>a>i.colorui--movies { color: #ff2e2e } ul.menu-userarea--rightbar>li>a>i.colorui--tv { color: #6aaf3c } ul.menu-userarea--rightbar>li>a>i.colorui--anime { color: #d87c2b } ul.menu-userarea--rightbar>li>a>i.colorui--wrestling { color: #4190fd } ul.menu-userarea--rightbar>li>a>i.colorui--seriestv { color: #964ce8 } .HeaderLogo { font-size: 38px; font-family: Bevan; line-height: 32px; color: #fff; display: inline-block; padding-top: 8px } ul.menu-userarea--rightbar>li.selected>a { color: #fff; background: #bdc4ec21 !important } .WecimaPosts>.PostItem>a>.BG--PostItem { display: block; height: 100%; background-image: var(--image); background-size: cover; background-position: center center; border-radius: 8px } .WecimaPosts>.PostItem>a { display: block; height: 100%; background: #bdc4ec21 } .Grid--WecimaPosts { margin: 0 -8px; text-align: center } .GridItem { display: inline-block; width: 196px; vertical-align: top; position: relative; margin: 0 8px 16px; text-align: inherit; background: #1b1d2f; padding: 8px 8px 48px; border-radius: 8px } .GridItem span.BG--GridItem { display: block; top: 0; height: 100%; width: 100%; right: 0; padding-top: 150%; position: relative; overflow: hidden; background-image: var(--image); background-size: cover; background-position: center center; border-radius: 8px } .GridItem>a { display: block; position: relative; border-radius: 18px 18px 0 0 } .RightSideFlex { display: inline-block; vertical-align: top; width: 300px; padding-right: 16px } .options--leftside-user>a>i:hover::after { background: #fff } .options--leftside-user>a>i::after { z-index: -1 } .search--userarea--rightbar { margin: 0 -8px 10px; position: relative; display: block } .search--userarea--rightbar>input { display: block; width: 100%; height: 60px; color: #fff; border: 0; border-radius: 8px; padding: 0 56px 0 16px; font-size: 16px; background: #bdc4ec21 } .search--userarea--rightbar>input::placeholder { color: #d2d5e8 } .search--userarea--rightbar>button { background: 0 0; position: absolute; top: 50%; cursor: pointer; width: 44px; right: 10px; border: 0; text-align: center; line-height: 46px; color: #fff; height: 44px; transform: translate(0px, -50%); font-size: 25px } ul.menu-userarea--rightbar>li.selected {} wecimabegin { display: block; border-radius: 0 0 18px 18px; position: relative; margin-bottom: 20px } wecimabegin-inner { display: block } .user--settings { margin: 0 -12px 15px } body.disablescrolling .LeftSideFlex {} wecimabegin-inner ul.tabs { height: 60px } wecimabegin-inner ul.tabs>li { display: inline-block; vertical-align: top; height: 48px; font-size: 17px; cursor: pointer; padding: 0 26px; line-height: 46px; border-radius: 8px } wecimabegin-inner ul.tabs>li>i { font-size: 26px; vertical-align: middle; margin-left: 10px } wecimabegin-inner ul.tabs>li>span { vertical-align: middle } wecimabegin-inner ul.tabs>li>i.iconsui--popular { font-style: normal; width: 40px; height: 34px; font-family: bevan; background: #ff2e2e; display: inline-block; line-height: 36px; border-radius: 8px } wecimabegin-inner ul.tabs>li.selected { box-shadow: #fff 0 -3px 0 inset; border-radius: 0; height: 54px } wecimabegin-inner ul.tabs>li>i em { font-style: normal; float: left; font-family: Arial; font-weight: 700; vertical-align: middle; padding-right: 2px } .rank1--wecimabegin-inner { position: relative; z-index: 1; height: 100% } .poster--slider--wecimabegin-inner { position: absolute; top: 0; z-index: -1; left: 0; transition: all 250ms ease 0s; bottom: 0; background-image: var(--image); background-size: cover; background-position: center center; border-radius: 0 0 18px 18px; opacity: 1; overflow: hidden; width: calc(100% - 356px) } .poster--slider--wecimabegin-inner .img--poster--slider--wecimabegin-inner { display: block; height: 100%; background: linear-gradient(to left, #0c0f21 10%, #0c0f21de 30%, #23273b00); backdrop-filter: blur(13px) } .info--slider--wecimabegin-inner { position: absolute; top: 50%; right: 30px; transform: translate(0px, -50%); max-width: 550px } .info--slider--wecimabegin-inner>p { font-size: 21px; line-height: 100%; margin-bottom: 12px; color: #d2d5e8 } .info--slider--wecimabegin-inner>strong { display: block; font-size: 30px; line-height: 30px; margin-bottom: 4px; text-align: right } .info--slider--wecimabegin-inner>p>strong { color: #5367ff; vertical-align: middle; margin-left: 6px } .story--slider--wecimabegin-inner { font-size: 15px; color: #d2d5e8; line-height: 24px; margin-bottom: 12px } .info--slider--wecimabegin-inner>strong>p>a { color: #fff } .mpa--info--rank1--wecimabegin { color: #fff; margin-bottom: 16px; font-size: 15px; line-height: 100% } .mpa--info--rank1--wecimabegin>a { vertical-align: middle; color: #5367ff; font-weight: 700; padding-left: 5px; font-size: 16px } .mpa--info--rank1--wecimabegin>.mpaadesc { vertical-align: middle } .string--comments--post-statistics---postitem { display: block; float: left; color: #fff; line-height: 30px } .reactions--slider--wecimabegin-inner::after { content: ""; display: block; clear: both } .reactions--slider--wecimabegin-inner { padding-top: 8px; border-top: 1px solid #bdc4ec21 } .Social--Info--GridItem { text-align: right; position: absolute; bottom: 0; right: 0; z-index: 3; color: #fff; left: 0; padding: 24px 10px 8px; border-radius: 8px; background: linear-gradient(to top, rgba(0, 0, 0, 0.91), rgba(0, 0, 0, 0)) } .Thumb--GridItem { position: relative; z-index: 1 } .GridItem>a>strong { color: #fff; font-weight: 400; font-size: 1rem; padding: 8px; line-height: 20px; display: block } .Social--Info--GridItem>* {} .Social--Info--GridItem .string--comments--post-statistics---postitem { font-size: 11px; color: #dddfe4 } .Thumb--GridItem>a>strong { bottom: 0; right: 0; width: 100%; text-align: right; font-weight: 400; font-size: 15px; padding-top: 8px; display: block; color: #dddfe4; line-height: 20px; border-radius: 0 0 18px 18px } .GridItem span.BG--GridItem::after { content: ""; position: absolute; bottom: 0; right: 0; width: 100%; height: 100% } .Thumb--GridItem>a>strong>.year { color: #a3abe6; display: inline-block; font-weight: 700 } .GridItem ul.PostItemStats { border: 0; padding: 8px; position: absolute; bottom: 0; width: 100%; right: 0 } .list--Tabsui { margin-bottom: 16px } .list--Tabsui>a { color: #dddfe4; margin-left: 8px; display: inline-block; vertical-align: top; padding: 10px 16px; font-size: 18px; line-height: 25px; border-radius: 8px } .list--Tabsui>a.active { background: #5367ff; color: #fff } .list--Tabsui>a>i { vertical-align: middle; font-size: 25px; margin-left: 12px; float: right } .GridItem ul.PostItemStats>li>.InnerButton { padding: 0 4px; background: 0 0; color: #dddfe4; margin: 0; border-radius: 8px } .GridItem ul.PostItemStats>li>.InnerButton>span { font-size: 13px } .GridItem ul.PostItemStats>li>.InnerButton>i { font-size: 17px } .GridItem ul.PostItemStats>li>.InnerButton.emoted.like { color: #4080ff } wecima--filter { display: block } wecima--filter>filterbox { display: block; overflow: hidden; position: relative; margin: 0 -12px; border-radius: 8px; user-select: none } .title--wecima--filter { font-size: 20px; margin-bottom: 0 } wecima--filter>filterbox>title--filterbox { display: block; padding: 16px 16px 13px 46px; position: relative; cursor: pointer; background: rgba(189, 196, 236, .11); border-radius: 8px; margin-bottom: 8px } wecima--filter>filterbox>title--filterbox>span { display: block; font-size: 12px; color: #d2d5e8; line-height: 100%; margin-bottom: 0 } wecima--filter>filterbox>title--filterbox>strong { display: block; font-size: 16px; color: #fff; font-weight: 400 } @keyframes Filterbox { 0% { transform: translate(0px, 0px) } 100% { transform: translate(320px, 0px) } } wecima--filter>filterbox>list--filterbox { overflow: hidden; border-top: 0; border-radius: 0 0 8px 8px; display: block; width: 100% !important } wecima--filter>filterbox>list--filterbox item { background: rgba(189, 196, 236, .06); margin: 0 4px 8px; border-radius: 8px; vertical-align: top; text-align: center; padding: 12px 0; flex: 1 1 0%; min-width: 80px; font-size: 15px; color: #aab3dc; white-space: nowrap; overflow: hidden; display: block; text-overflow: ellipsis } wecima--filter>filterbox.hoverable:hover::after { background: #bdc4ec21 } wecima--filter>filterbox.hoverable::after { z-index: -1 } wecima--filter>filterbox selectfilter { display: block; color: #dddfe4; font-size: 18px; line-height: 46px; text-align: center; background: #bdc4ec21; border-radius: 8px } wecima--filter>filterbox selectfilter>i { vertical-align: middle; font-size: 16px; padding-left: 5px } wecima--filter>divider { margin: 8px 0 } wecima--filter>filterbox.active>title--filterbox>i { transform: translate(0px, -50%); transition: all 150ms ease 0s } wecima--filter>filterbox>title--filterbox>i { transition: all 150ms ease 0s; position: absolute; top: 50%; padding-top: 4px; left: 16px; transform: translate(0px, -50%) rotate(90deg); font-size: 30px; line-height: 17px !important } inner--list--filterbox { display: flex; flex-wrap: wrap; max-height: 216px; overflow: hidden; margin: 0 -4px 8px } wecima--filter>filterbox>list--filterbox.open>inner--list--filterbox { max-height: inherit; margin-bottom: 0 } wecima--filter>filterbox>list--filterbox.open selectfilter { background: #bdc4ec21 } wecima--filter>filterbox>list--filterbox:not(.open) selectfilter:hover::after { background: rgba(255, 255, 255, .05) } inner--list--filterbox.minilist item { padding: 6px 0; min-width: 110px } wecima--filter>filterboxselection>title--filterboxselection.alreadyselected::before { content: attr(total); display: block; font-size: 11px; background: #fff; line-height: 100%; margin-bottom: 0; position: absolute; color: #276332; top: 10px; left: 10px; padding: 3px 8px 4px; border-radius: 18px } title--filterboxselection { display: block; margin: 0 -12px; background: #2c336f; border-radius: 8px; transition: all 150ms linear 150ms; padding: 20px 70px 18px 12px } title--filterboxselection>span { display: block; font-size: 14px; line-height: 100%; margin-bottom: 4px; color: #fff; opacity: .7 } title--filterboxselection>strong { display: block; font-size: 17px; line-height: 100%; font-weight: 400; color: #fff } title--filterboxselection>i { font-size: 36px; text-align: center; position: absolute; right: 12px; color: #dddfe4; top: 50%; width: 48px; height: 48px; transform: translate(0px, -50%); line-height: 53px !important } title--filterboxselection.uicolors--mpaa { background: #4ca55c } title--filterboxselection.uicolors--category { background: #5367ff } inner--list--filterbox.grid--list>item { min-width: 120px; font-size: 14px; white-space: normal; line-height: 18px; padding: 10px 4px } inner--list--filterbox.grid--list { max-height: initial; margin-bottom: 0 } fulllist { display: block; color: #dddfe4; font-size: 18px; line-height: 46px; text-align: center; background: rgba(189, 196, 236, .1); border-radius: 8px } fulllist>i { vertical-align: middle; margin-left: 8px } gototop { display: block; width: 150px; background: #31a24c; text-align: center; line-height: 42px; font-size: 16px; color: #fff; border-radius: 18px 18px 0 0; margin: 16px auto 0 } title--wecima--filter { display: block; font-size: 18px; margin-bottom: 12px } wecima--filter>filterbox>list--filterbox item.selected { background: rgba(148, 161, 255, .17); color: #fff } wecima--filter item.selected::after { display: none } wecima--filter>filterbox>title--filterbox:hover::after { background: #262b40 !important } wecima--filter>filterbox>title--filterbox.alreadyselected>i { margin-top: 8px } wecima--filter>filterbox>title--filterbox.alreadyselected::before { content: attr(total); display: block; font-size: 11px; background: #5367ff; line-height: 100%; margin-bottom: 0; position: absolute; color: #fff; top: 10px; left: 12px; padding: 3px 8px 4px; border-radius: 18px } wecima--filter>filterbox>title--filterbox::after { z-index: -1 } wecima--filter>filterbox>list--filterbox item.clearall--item { background: rgba(189, 196, 236, .12); opacity: .5; font-size: 13px; pointer-events: none } wecima--filter>filterbox>title--filterbox.alreadyselected+list--filterbox item.clearall--item { pointer-events: inherit; opacity: 1 } dropdownlist { position: absolute; top: 50%; transform: translate(0px, -50%); padding: 12px 16px; right: -16px; bottom: 0; overflow: hidden; height: 73px; opacity: 0; transition: opacity 250ms ease 150ms, visibility 250ms ease 0s, height 250ms ease 0s; left: -16px; background: #232848; box-shadow: 0 12px 28px 0 #0003, 0 2px 4px 0 #0000001a, inset 0 0 0 1px #a7b0ea12; border-radius: 18px; z-index: 5; visibility: hidden } filterboxselection { display: block; transition: all 250ms ease 0s; position: relative } filterboxselection.open>dropdownlist { height: 375px; opacity: 1; visibility: visible; transition: all 150ms ease 0s } filterboxselection.open>title--filterboxselection { opacity: 0; pointer-events: none; transition: all 150ms ease 0s } dropdownlist>title--dropdownlist { display: block; margin-bottom: 8px; font-size: 14px; line-height: 28px } dropdownlist>title--dropdownlist>span { display: inline-block; float: left; width: 30px; height: 30px; font-size: 20px; text-align: center; line-height: 34px; border-radius: 18px } dropdownlist>list--dropdownlist::-webkit-scrollbar { width: 3px; height: 4px } dropdownlist>list--dropdownlist::-webkit-scrollbar-thumb { background: #3a4275; border-radius: 23px } dropdownlist>list--dropdownlist::-webkit-scrollbar-track { background: 0 0 } dropdownlist>list--dropdownlist { display: block; height: calc(100% - 40px); overflow: auto; overscroll-behavior: contain } dropdownlist>list--dropdownlist>item { margin-left: 4px; display: block; border: 1px solid #bdc4ec21; margin-bottom: 10px; border-radius: 8px; padding: 8px } dropdownlist>list--dropdownlist>item>checkbox { display: inline-block; height: 22px; width: 22px; vertical-align: top; border: 1px solid #bdc4ec21; border-radius: 18px; margin-left: 15px } dropdownlist>list--dropdownlist>item>txt { display: inline-block; vertical-align: middle; max-width: calc(100% - 45px) } dropdownlist>list--dropdownlist>item>txt>name { display: block; font-size: 16px; color: #d2d5e8 } dropdownlist>list--dropdownlist>item>txt>describe { display: block; line-height: 18px; font-size: 13px; color: #bdbeca } dropdownlist>list--dropdownlist>item::after { display: none } dropdownlist>list--dropdownlist>item:last-child { margin-bottom: 0 } dropdownlist>list--dropdownlist>item:hover { border-color: #494f77 } dropdownlist>list--dropdownlist>item:hover>checkbox { border-color: #494f77 } dropdownlist>list--dropdownlist>item.selected { background: rgba(189, 196, 236, .07); border-color: transparent } dropdownlist>list--dropdownlist>item.selected>checkbox { background: #5367ff; box-shadow: 0 0 11px 0 #5367ff; border: 0 } dropdownlist>list--dropdownlist>item.selected>txt>name { color: #fff } years--dropdownlist>item { display: inline-block; background: rgba(56, 63, 117, .43); width: 53px; color: #7f84ad; text-align: center; vertical-align: top; margin: 0 4px 8px; height: 37px; line-height: 37px; border-radius: 8px; font-weight: 700; font-size: 15px } years--dropdownlist::-webkit-scrollbar { width: 3px; height: 4px } years--dropdownlist::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .07); border-radius: 23px } years--dropdownlist::-webkit-scrollbar-track { background: 0 0 } years--dropdownlist { display: block; margin: 0 -4px 0 -6px; max-height: calc(100% - 85px); overscroll-behavior: contain; overflow: hidden; border-radius: 8px } years--dropdownlist>item.selected { background: rgba(83, 103, 255, .38); color: #fff } years--dropdownlist>item.clearall--item { background: #5367ff; font-size: 13px; line-height: 35px; opacity: .2; pointer-events: none; color: #dddfe4 } filterboxselection>title--filterboxselection.alreadyselected+dropdownlist years--dropdownlist>item.clearall--item { opacity: 1; pointer-events: inherit } form--dropdownlist { display: block; height: 40px; margin: 0 -4px 8px } form--dropdownlist>button { display: inline-block; width: calc(50% - 8px); height: 40px; border-radius: 8px; border: 0; margin: 0 4px; color: #fff; background: 0 0; text-align: right } form--dropdownlist>button>span { display: block; background: #0e1331; padding: 0 12px 2px; border-radius: 8px; height: 100%; cursor: pointer; line-height: 36px } form--dropdownlist>button>span>i { vertical-align: middle; padding-right: 4px; float: left; padding-top: 12px; font-size: 18px; color: #d2d5e8 } shortcuts--dropdownlist { z-index: 2; display: block; height: 40px; position: relative; user-select: none; margin-bottom: 8px } shortcuts--dropdownlist>span { display: block; line-height: 40px; margin-bottom: 8px; cursor: pointer; padding: 0 12px; background: #0e1331; transition: background 150ms ease 0s; font-size: 15px; border-radius: 8px } shortcuts--dropdownlist>span>i { float: left; font-size: 18px; padding: 11px 6px } inner-shortcuts--dropdownlist { position: absolute; overflow: hidden; top: 100%; opacity: 0; background: #0e1331; pointer-events: none; margin-top: 8px; right: 0; transition: all 150ms ease 0s; width: 100%; height: 0; border-radius: 8px } shortcuts--dropdownlist.active>span { transition: all 150ms ease 0s; background: #0e1331 } shortcuts--dropdownlist.active inner-shortcuts--dropdownlist::-webkit-scrollbar { width: 3px; height: 4px } shortcuts--dropdownlist.active inner-shortcuts--dropdownlist::-webkit-scrollbar-thumb { background: #31385d; border-radius: 23px } shortcuts--dropdownlist.active inner-shortcuts--dropdownlist::-webkit-scrollbar-track { background: #0e1331 } shortcuts--dropdownlist.active inner-shortcuts--dropdownlist { height: 265px; opacity: 1; pointer-events: inherit; overflow: auto } years--dropdownlist:hover { overflow: auto } inner-shortcuts--dropdownlist>item.hoverable:hover::after { background: rgba(35, 40, 72, .41) } inner-shortcuts--dropdownlist>item { display: block; padding: 0 12px; line-height: 52px; font-size: 15px; vertical-align: top; color: #a4acdc; border-bottom: 1px solid #bdc4ec21; background: #0e1331 } inner-shortcuts--dropdownlist>item.hoverable::after { z-index: -1 } inner-shortcuts--dropdownlist>item::before { content: ""; display: inline-block; border-radius: 18px; border: 1px solid #bdc4ec21; width: 16px; height: 16px; vertical-align: middle; margin-left: 8px } inner-shortcuts--dropdownlist>item.selected { color: #fff } inner-shortcuts--dropdownlist>item.selected::before { border-color: #fff } title--filterboxselection.alreadyselected+dropdownlist inner-shortcuts--dropdownlist>item.clearall--item { opacity: 1; pointer-events: inherit } inner-shortcuts--dropdownlist>item.clearall--item { opacity: .3; pointer-events: none } em.modablaj { font-style: normal; display: inline-block; font-size: 12px; font-weight: 700; color: #ffce61; padding-left: 5px } header.visible { transform: translate(0px) } tab--wecimabegin-inner { display: block; position: relative; flex: 1 1 0% } a.Slides-next, a.Slides-prev { display: block; position: absolute; top: 50%; width: 60px; height: 70px; cursor: pointer; background: #23273b; color: #dddfe4; line-height: 76px; right: -10px; font-size: 45px; text-align: center; transform: translate(0px, -50%); border-radius: 18px 4px 4px 18px } .Slider--Grid { position: relative; height: 100%; padding: 0 } a.Slides-prev { right: auto; left: -10px; border-radius: 4px 18px 18px 4px } .Slider--Grid .GridItem { width: 258px; padding: 0; margin: 0 } .Slider--Grid .GridItem add_to_watchlist.hoverable { bottom: auto; top: 10px; right: auto; left: 10px; transform-origin: top left; } .Slider--Grid .GridItem add_to_watchlist.hoverable:hover { border-radius: 50px 0 0 50px; } .Slider--Grid .GridItem add_to_watchlist.hoverable:before { right: auto; left: 100%; margin-left: -1px; border-radius: 0 50px 50px 0; padding-right: 12px; padding-left: 3px; transform-origin: left center; } .Slider--Grid .GridItem add_to_watchlist.hoverable:hover:before {} .Slider--Grid .GridItem .Thumb--GridItem>a>strong { position: absolute; bottom: 0; z-index: 2; padding: 132px 12px 52px; background: linear-gradient(to top, rgb(1, 1, 2), rgba(0, 0, 0, 0)); border-radius: 0 0 8px 8px } .Slider--Grid .owl-stage-outer { padding: 12px 0 0 } .owl-item:hover {} .GridItem ul.PostItemStats>li { margin: 0 4px } .Slider--Grid .GridItem .Social--Info--GridItem { bottom: auto; top: 0; padding: 4px 8px; background: linear-gradient(rgba(0, 0, 0, 0.91), rgba(0, 0, 0, 0)) } .Slider--Grid .owl-dots { display: none } .disabled>a.Slides-next, .disabled>a.Slides-prev { background: #0c0f21; color: #51556d; cursor: not-allowed } wecima.separated--top { padding-top: 60px } .Single-begin { padding: 26px 16px; position: relative } .Poster--Single-begin { width: 270px; display: inline-block; overflow: hidden; vertical-align: top; position: relative; box-shadow: rgba(140, 151, 232, .14) 0 0 0 1px; border-radius: 18px } .Poster--Single-begin>a.Img--Poster--Single-begin { display: block; padding-top: 150%; background-color: #bdc4ec21; border-radius: 18px; background-image: var(--img); background-size: cover; background-position: center center } .Content--Single-begin { display: inline-block; max-width: calc(100% - 300px); vertical-align: top; margin-right: 20px; border-radius: 18px } ul.Terms--Content--Single-begin {} ul.Terms--Content--Single-begin>li { padding: 4px 0 } ul.Terms--Content--Single-begin>li>span { display: inline-block; vertical-align: middle; width: 130px; opacity: .7; color: #b9bfef; font-size: 16px } ul.Terms--Content--Single-begin>li>p { display: inline-block; vertical-align: middle; color: #d2d5e8; max-width: calc(100% - 130px); font-size: 16px } .Poster--Single-begin .Quality { transform: rotate(-45deg); position: absolute; top: 31px; left: -52px; background: #37808c; width: 200px } .BG--Single-begin { position: absolute; top: 0; right: 0; left: 0; z-index: -1; pointer-events: none; height: calc(100% - 50px); background-image: var(--img); background-size: cover; background-attachment: fixed; background-position: center center } .BG--Single-begin::before { content: ""; display: block; height: 100%; background: linear-gradient(rgba(26, 29, 46, 0.66), rgba(26, 29, 46, 0.9), rgb(26, 29, 46)); position: absolute; top: 0; right: 0; width: 100%; z-index: 1 } .BG--Single-begin::after { content: ""; display: block; height: 100%; backdrop-filter: blur(11px); position: relative; z-index: -1 } .Title--Content--Single-begin { padding-bottom: 12px; margin-bottom: 6px; border-bottom: 1px solid #bdc4ec21 } .Title--Content--Single-begin>h1 { font-size: 26px; text-align: right } ul.Terms--Content--Single-begin>li>p>a { display: inline-block; vertical-align: middle; margin-left: 12px; color: #aab6ff } singlecontainer>singlecontainerright wecima { margin: 0 } ul.Terms--Content--Single-begin>li>p>.mpaadesc { vertical-align: middle; margin-left: 12px } .Poster--Single-begin .Quality::after { content: ""; position: absolute; display: block; top: 0; right: 0; z-index: -1; left: 0; bottom: 0; background: var(--color) } .Poster--Single-begin .Quality>a { color: #fff; display: block; padding: 8px 16px; line-height: 100%; text-align: center } hashtags { display: block } hashtags>a { font-size: 14px; display: inline-block; margin-left: 8px; color: #aab6ff; opacity: .6; margin-bottom: 1px } hashtags>a>i { vertical-align: middle; font-size: 12px } .Breadcrumb--UX { margin: 0 -6px 10px; line-height: 22px } .Breadcrumb--UX>ol { white-space: nowrap; overflow: hidden; text-overflow: ellipsis } .Breadcrumb--UX>ol>* { display: inline-block; vertical-align: middle; color: #5367ff; padding: 0 6px; font-size: 15px } .Breadcrumb--UX>ol>*>a { display: block; line-height: 100%; color: #c3cbff } .Breadcrumb--UX>ol>:last-child>a { color: #fff } .Title--Content--Single-begin>h1 a { color: #fff } .Watch--Wecima--Single {} .Tabs--Single-begin {} singlesections { display: block; margin: 0; border-top: 10px dashed #262a42 } singlesections>singlesection { display: block; background: #262a42; padding: 26px 16px 16px } .WatchServers { width: 220px; display: inline-block; margin-left: 16px; vertical-align: top } .WatchServers>h2 { font-size: 20px; line-height: 100%; margin-bottom: 12px } .WatchServers>ul { margin-right: -8px } .WatchServers>ul li { margin-bottom: 0; --color: #5367ff } .WatchServers>ul li span, .WatchServers>ul li i { display: inline-block; vertical-align: middle; width: 34px; margin-left: 10px; height: 34px; text-align: center; background: var(--color); border-radius: 18px; color: #fff; line-height: 36px; font-size: 16px; } .WatchServers>ul li span { font-family: bevan; font-size: 21px; line-height: 36px } .WatchServers>ul li>btn { display: block; padding: 8px; border-radius: 8px } .WatchServers>ul li strong { font-weight: 400; font-size: 16px; color: #fff; vertical-align: super; text-transform: capitalize } .WatchServers>ul li.selected>btn { background: #5367ff } .WatchServersEmbed { max-width: calc(100% - 520px); display: inline-block; vertical-align: top; width: 100%; margin-left: 16px } .WatchServersEmbed iframe { position: absolute; top: 0; right: 0; width: 100%; height: 100%; border-radius: 18px } singlesections>singlesection:nth-child(2n) { background: 0 0 } .WatchServersEmbed .Inner--WatchServersEmbed { padding-top: 72%; background: #0c0f21; position: relative; z-index: 1; border-radius: 18px; border: 3px solid #0c0f21 } titleshape { display: block; font-size: 24px; margin-bottom: 15px } .WatchServers>ul li.selected span { background: #dddfe4; color: #5367ff } .Download--Wecima--Single { display: inline-block; vertical-align: top; width: 100%; max-width: 258px } ul.List--Download--Wecima--Single {} ul.List--Download--Wecima--Single>li { margin-bottom: 8px } ul.List--Download--Wecima--Single>li>a { display: block; background: #31a24c; color: #fff; border-radius: 8px; padding: 16px 55px 16px 16px; line-height: 100% } ul.List--Download--Wecima--Single>li>a>quality { display: block; font-size: 20px; margin-bottom: 6px; text-transform: uppercase } ul.List--Download--Wecima--Single>li>a>resolution>i { position: absolute; top: 50%; right: 0; width: 55px; text-align: center; color: #fff; line-height: 100%; font-size: 32px; transform: translate(0px, -50%) } ul.List--Download--Wecima--Single>li>a>resolution { display: block; font-size: 15px; color: #cff7d9 } ul.List--Download--Wecima--Single>li>a>size { position: absolute; bottom: 8px; left: 16px; transform: translate(0px, -50%) } ul.List--Download--Wecima--Single>li>a>size>i { vertical-align: middle; margin-left: 2px } ul.List--Download--Wecima--Single>li>a>i { position: absolute; bottom: 12px; left: 0; width: 50px; text-align: center; font-size: 22px } .WatchServersEmbed .Inner--WatchServersEmbed>.loader { position: absolute; top: 50%; width: 60px; z-index: -1; right: 50%; transform: translate(50%, -50%) } .EpisodeNavigation { padding-top: 8px } .EpisodeNavigation::after { content: ""; display: block; clear: both } .EpisodeNavigation>a { display: inline-block; font-size: 18px; vertical-align: top; height: 40px; color: #fff; line-height: 40px; padding: 0 7px; border-radius: 8px } .EpisodeNavigation>a>em { vertical-align: top; font-style: normal; font-weight: 700; font-size: 30px; padding: 0 8px } .EpisodeNavigation>a>i { display: inline-block; vertical-align: middle; font-size: 30px; padding: 0 8px } .EpisodeNavigation>a.PrevEpisode { background: rgba(146, 161, 251, .2) } .EpisodeNavigation>a.NextEpisode { float: left; background: #5367ff } .AsideContext { padding: 28px 16px 35px; background: #15192a; margin-bottom: -10px; border-top: 1px solid rgba(255, 255, 255, .05); box-shadow: #0c0f21 0 12px 10px -10px inset } .AsideContext>h2 { color: #fff; margin-bottom: 12px; font-size: 24px; font-weight: 400 } .AsideContext>.StoryMovieContent { font-size: 18px; line-height: 24px; color: #d2d5e8 } .AsideContext>h2>i { vertical-align: bottom; margin-left: 0; color: #5367ff } .ReplyBox>.AddComment>.AddCommentAvatar>span { line-height: 14px; font-size: 15px } .Teamwork--Area {} .Teamwork--Area>h2 { font-weight: 400; font-size: 30px; margin-bottom: 16px } .List--Teamwork {} .List--Teamwork>ul.Inner--List--Teamwork { display: flex; list-style: none; flex-wrap: wrap; margin: 0 -6px } .List--Teamwork>ul.Inner--List--Teamwork>li { flex: 1; position: relative; min-width: 140px; margin: 0 6px 12px; max-width: 180px; background: #bdc4ec21; border-radius: 8px } .List--Teamwork>ul.Inner--List--Teamwork>li>a { display: block } .List--Teamwork>ul.Inner--List--Teamwork>li>a .ActorName { position: absolute; bottom: 0; right: 0; text-align: -webkit-auto; width: 100%; background: linear-gradient(to top, black, transparent); padding: 60px 12px 12px; color: #fff; border-radius: 0 0 8px 8px } .List--Teamwork>ul.Inner--List--Teamwork>li>a .ActorName>span { display: block; font-size: 18px; line-height: 18px; margin-bottom: 4px } .List--Teamwork>ul.Inner--List--Teamwork>li>a .Photo { padding-top: 150%; display: block; background-image: var(--image); background-size: cover; background-position: center center; border-radius: 8px } .List--Teamwork>ul.Inner--List--Teamwork>li>a .ActorName>em { display: block; font-style: normal; font-size: 15px; color: #9da3c5; line-height: 18px } .List--Teamwork>ul.Inner--List--Teamwork>li>a .Photo>i { position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); font-size: 130px; margin-top: -25px; opacity: .3; z-index: -1 } a.MoreTeamworkList { display: block; float: left; background: #5367ff; color: #fff; line-height: 50px; font-size: 18px; padding: 0 20px; border-radius: 18px } .List--Teamwork::after { content: ""; display: block; clear: both } a.MoreTeamworkList>em { font-style: normal } a.MoreTeamworkList.waiting { pointer-events: none; opacity: .6 } singlerelated { display: block; background: #0c0f21; padding: 22px 16px } singlerelated .GridItem { width: 185px; } singlerelated>h2 { font-weight: 400; font-size: 30px; line-height: 30px; margin-bottom: 16px } .List--Seasons--Episodes { width: 180px; margin: 0 20px 0 30px; display: inline-block; padding: 10px; vertical-align: top; float: right; background: #1e243c; border-radius: 18px } .Episodes--Seasons--Episodes { display: flex; vertical-align: top; max-width: calc(100% - 230px); flex-wrap: wrap } .Seasons--Episodes {} .List--Seasons--Episodes>a { display: block; border-radius: 18px; margin: 0 -30px 8px; background: #2b3454; line-height: 38px; color: #d2d5e8; padding: 0 26px; box-shadow: #15192a 0 2px 3px } .List--Seasons--Episodes>a:last-child { margin-bottom: 0 } .List--Seasons--Episodes>a.selected { background: #5367ff; color: #fff } .Episodes--Seasons--Episodes>a { display: inline-block; background: #252a40; vertical-align: top; flex: 1 1 0%; height: 50px; min-width: 160px; margin: 0 4px 8px; padding: 4px; border-radius: 18px } .Seasons--Episodes::after { content: ""; display: block; clear: both } .Episodes--Seasons--Episodes>a .Thumb { display: inline-block; width: 40px; vertical-align: middle; height: 100%; background-size: cover; background-position: center center; margin-left: 12px; border-radius: 18px } .Episodes--Seasons--Episodes>a episodearea { display: inline-block; vertical-align: middle } .Episodes--Seasons--Episodes>a episodearea>episodetitle { display: block; white-space: nowrap; overflow: hidden; color: #d2d5e8; text-overflow: ellipsis; font-size: 18px } .Episodes--Seasons--Episodes>a .Thumb>span { display: block; height: 100%; text-align: center; border-radius: 18px; background: #bdc4ec21; color: #dddfe4; font-size: 18px; line-height: 44px } .Episodes--Seasons--Episodes.Full--Width { max-width: inherit; margin: 0 -8px 4px } .MoreEpisodes--Button { float: left; background: #5367ff; padding: 0 16px; margin-left: -4px; line-height: 46px; font-size: 18px; border-radius: 18px } .MoreEpisodes--Button>i { vertical-align: middle; font-size: 20px; padding-left: 8px } .MoreEpisodes--Button>span { vertical-align: middle } .MoreEpisodes--Button.loading { opacity: .5; pointer-events: none } singlesections>singlesection.Series--Section>a>h2 { font-weight: 400; margin-bottom: 14px; color: #fff } singlesections>singlesection.Series--Section>a>h2>i { vertical-align: bottom; font-size: 27px; color: #5367ff } .Episodes--Seasons--Episodes>a.selected { background: #5367ff !important } .Download--Wecima--Single .SeasonDownload { font-size: 19px; margin-bottom: 8px; padding-top: 4px } ul.reply--comment .comment-avatar--comments span { font-size: 11px; line-height: 26px } singlerelated.hasdivider { border-bottom: 1px solid #bdc4ec21 } singlerelated>a>h2 { color: #fff; font-weight: 400; margin-bottom: 16px } singlerelated>a>h2>i { color: #ff2e2e } wecimaslider { display: block; padding-top: 60px; margin-bottom: 12px } .GridItem .total--post-reactions---post-statistics----postitem { font-size: 13px; max-width: calc(100% - 56px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 20px } .pagination { display: grid; margin: 10px auto !important; border-radius: 50px; width: 100%; text-align: center; justify-content: center; align-items: center; } .pagination>ul { list-style: none; display: flex; flex-wrap: wrap } .pagination>ul>li { padding: 0 3px } .pagination>ul>li>* { display: block; padding: 14px 20px 12px; font-size: 18px; background: #bdc4ec21; line-height: 100%; border-radius: 18px; color: #dddfe4 } .pagination>ul>li>span.current { background: #5367ff !important } .Items--Slider--Grid { opacity: 0; transition: all 150ms ease 0s } .Items--Slider--Grid.owl-loaded { opacity: 1 } wecima>.Breadcrumb--UX { margin: 16px -6px } wecimaslider>.Breadcrumb--UX { margin: 0 -8px; padding: 26px 0 10px } header>middle--header>ul { white-space: nowrap; text-align: right; padding-top: 6px; display: inline-block; vertical-align: middle; margin-left: 8px } header>middle--header>ul>li { display: inline-block; position: relative; vertical-align: top } header>middle--header>ul>li>a { display: inline-block; vertical-align: top; height: 48px; font-size: 16px; padding: 0 12px; line-height: 46px; border-radius: 8px; color: #fff; max-width: 100%; text-overflow: ellipsis } header>middle--header>ul>li>ul { position: absolute; top: 100%; right: 0; background: #232848; border-radius: 8px; min-width: 170px; overflow: hidden; box-shadow: rgba(12, 15, 33, .73) 0 4px 8px 2px; transform: scale(.7); transform-origin: right top; visibility: hidden; opacity: 0; transition: all 150ms ease 0s } header>middle--header>ul>li>a>i.fa-angle-left { display: inline-block; vertical-align: middle; padding-right: 14px; font-size: 22px; transform-origin: center center; transition: all 150ms ease 0s; position: absolute; top: 50%; transform: translate(0px, -50%) } header>middle--header>ul>li>ul>li>a { display: block; color: #dddfe4; text-align: right; padding: 10px 22px; border-bottom: 1px solid #bdc4ec21 } header>middle--header>ul>li>ul>li {} header>middle--header>ul>li>ul>li>ul { display: none } header>middle--header>ul>li>ul>li:last-child>a { border-bottom: 0 } header>middle--header>ul>li:hover>ul { opacity: 1; transform: scale(1); visibility: visible; z-index: 5 } header>middle--header>ul>li:hover>a>i.fa-angle-left { transform: rotate(270deg) translate(17px, -8px) } header>middle--header>ul>li.menu-item-has-children>a { padding-left: 40px } header>middle--header>ul>li>a>.fa-house { font-size: 30px; padding-top: 8px } header>middle--header>ul>li.current-menu-item>a>i.fa-angle-left, header>middle--header>ul>li.current-menu-parent>a>i.fa-angle-left { margin-top: -2px } header>middle--header>ul>li.current-menu-item>a, header>middle--header>ul>li.current-menu-parent>a { height: 54px; border-radius: 0; box-shadow: #fff 0 -3px 0 inset } header>middle--header>ul>li.current-menu-item>a::after, header>middle--header>ul>li.current-menu-parent>a::after { display: none } header>middle--header>ul>li>a>i.fa-plus { display: inline-block; vertical-align: middle; padding-left: 4px; opacity: .7 } header>middle--header>ul>li>ul>li.current-menu-item>a { box-shadow: inset -3px 0 #5367ff } .ProductionsListButton { display: inline-block; vertical-align: middle; position: relative } .ProductionsListButton>productionslistbutton { display: block; background: #000; border-radius: 8px; padding: 4px 8px 0 16px; height: 48px; color: #dddfe4 } .ProductionsListButton>productionslistbutton>img { vertical-align: middle; width: 40px; margin-left: 12px } .ProductionsListButton>productionslistbutton>span { vertical-align: middle } .ProductionsListButton>productionslistbutton>i { vertical-align: middle; padding-right: 8px; font-size: 22px } productionslist--dropdown::-webkit-scrollbar { width: 3px; height: 4px } productionslist--dropdown::-webkit-scrollbar-thumb { background: #3c3c3c; border-radius: 23px } productionslist--dropdown::-webkit-scrollbar-track { background: 0 0 } productionslist--dropdown { top: 100%; position: absolute; left: 0; min-width: 200px; width: 100%; height: 320px; overflow: auto; display: none; background: #000; border-radius: 0 0 8px 8px } .ProductionsListButton.open>productionslistbutton { border-radius: 8px 8px 0 0 } .ProductionsListButton.open>productionslist--dropdown { display: block } productionslist--dropdown>a { display: block; transition: all 150ms ease 0s; z-index: 1; height: 80px; position: relative; background-size: cover; background-position: center } productionslist--dropdown>a::after { content: ""; display: block; position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: -1; background-image: var(--img); background-size: cover; background-position: center center } productionslist--dropdown>a>span { opacity: 0 } productionslist--dropdown:hover>a { height: 60px } productionslist--dropdown:hover>a:hover { height: 140px } .ProductionCompanyIntro { margin-bottom: 16px; padding-top: 160px; margin-top: 60px; background-size: cover; position: relative; background-image: var(--intro); background-position: center center; border-radius: 0 0 18px 18px; background-color: #bdc4ec21 } .ProductionCompanyIntro.HasIntro { padding-top: 40% } .ProductionCompanyIntro>.Title--ProductionCompanyIntro { position: absolute; top: 50%; right: 50%; font-size: 37px; transform: translate(50%, -50%) } .ProductionCompanyIntro.HasIntro .Title--ProductionCompanyIntro { display: none } wecimaslider>.Breadcrumb--UX>ol>* { font-size: 23px } .Searching--Overlay { position: fixed; top: 0; right: 0; width: 100%; background: rgba(0, 0, 0, .75); z-index: 102; height: 100% } .Searching--Overlay>form { background: #5367ff; height: 60px; margin: 0 300px; padding: 5px } .Searching--Overlay>form>input { background: #0c0f21; font-size: 20px } .Close--SearchingBox { top: 10px; left: 13px; height: 38px; width: 38px; text-align: center; font-size: 22px; color: #0e1331; line-height: 40px; border-radius: 8px; position: absolute !important } .Results--Searching--Overlay { height: calc(100% - 60px); margin: 0 300px; background: #0c0f21; position: relative; overflow: auto; padding: 16px 8px; overscroll-behavior: contain; text-align: center } .Results--Searching--Overlay::-webkit-scrollbar { width: 8px; height: 4px } .Results--Searching--Overlay::-webkit-scrollbar-thumb { background: #3e4467; border-radius: 23px } .Results--Searching--Overlay::-webkit-scrollbar-track { background: 0 0 } .Results--Searching--Overlay>svg { width: 80px; height: auto; top: 50%; right: 50%; margin: -40px } .Results--Searching--Overlay .Grid--WecimaPosts .GridItem { width: 198px; margin: 0 6px 12px; padding-bottom: 10px } .Results--Searching--Overlay .Grid--WecimaPosts .GridItem .Thumb--GridItem>a>strong { text-align: center } searchnotfound { display: block; position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); font-size: 21px; color: #fff; opacity: .5 } div#saving--bio--editor { position: absolute; bottom: 7px; left: 8px; right: 8px } authorpage-right { display: block; width: 360px; float: right; min-height: 400px; margin: 0 } addpost--ux { display: block; background: #373d5e; border-radius: 8px; margin-bottom: 22px; position: relative; padding-bottom: 12px } title--addpost--ux { display: block; font-size: 23px; color: #fff; margin-bottom: 16px; padding: 0 16px } .addpost-input--context:focus {} addpost--ux .emoticons--box { top: 100%; right: 5px !important; left: auto !important } addpost--ux .emoticons--box::after { top: auto; bottom: 100%; transform: rotate(180deg); margin-bottom: -1px; left: auto; right: 18px } .info--profile-bar>bio:not(:empty)+.bio--editor { margin-top: 8px } .WecimaPosts.WecimaPosts--Timeline { max-width: 700px; margin: 0 auto } .AddCommentInput .AddCommentEmotes { position: absolute; width: auto; background: 0 0; height: auto; bottom: 0; white-space: nowrap; left: 0; margin: 0; padding: 4px 8px } authorright--box { display: block; background: #26293c; border-radius: 8px; padding: 24px 24px 8px } authorright--box>title--authorright--box { display: block; color: #fff; font-size: 20px; margin-bottom: 12px; padding-bottom: 12px; border-bottom: 1px solid #bdc4ec21 } authorright--box>list--authorright--box { display: block; margin: 0 -16px } authorright--box>list--authorright--box>a { display: block; padding: 12px 16px; border-radius: 8px; color: #d2d5e8; line-height: 20px } authorright--box>list--authorright--box>a>i { vertical-align: middle; margin: 0 4px; width: 18px !important; height: 18px !important } authorright--box>list--authorright--box>a>time { display: block; font-size: 12px; line-height: 100%; padding-top: 4px; opacity: .7 } .profile--go { display: block; border-radius: 8px; background: #5367ff; color: #fff; padding: 8px 16px; margin-top: 12px } .profile--go>i { vertical-align: middle; padding-right: 6px; font-size: 22px } authorright--box>list--authorright--box>a:last-child {} .LoginButton { color: #fff; background: #1f2b86; margin-left: 16px; float: left; width: 205px; line-height: 40px; height: 42px; border-radius: 8px } .LeftSideFlex--user::after { content: ""; display: block; clear: both } .LoginButton>i { vertical-align: middle; font-size: 22px; padding-left: 13px } .LoginButton>span { vertical-align: middle; font-size: 18px } wecimaactivities { display: block; margin-bottom: 16px; border-radius: 8px; position: relative; } inner--wecimaactivities { display: block; background: #232848; border-radius: 8px; max-height: 390px; overflow: auto; margin: 0 -8px; padding: 16px } inner--wecimaactivities::-webkit-scrollbar { width: 3px; height: 4px } inner--wecimaactivities::-webkit-scrollbar-thumb { background: #3a4067; border-radius: 23px } inner--wecimaactivities::-webkit-scrollbar-track { background: 0 0 } title--wecimaactivities { font-size: 17px; color: #d2d5e8; padding: 0 0 8px; font-weight: 400; display: block; margin: 0 -8px } inner--wecimaactivities>activity { display: block; color: #dddfe4; border-radius: 8px; font-size: 14px; padding: 8px 12px; line-height: 18px; margin: 0 -8px; cursor: default !important } inner--wecimaactivities>activity>avatar--activity { display: inline-block; vertical-align: middle; margin-left: 12px; width: 36px } inner--wecimaactivities>activity>inner--activity { display: inline-block; vertical-align: middle; max-width: calc(100% - 58px); color: #a4a9ca; line-height: 18px } inner--wecimaactivities>activity>inner--activity>load1 { display: block; width: 100px; height: 12px; border-radius: 100px; margin-bottom: 8px; background: #ffffff21; } inner--wecimaactivities>activity>inner--activity>load2 { display: block; width: 60px; height: 8px; border-radius: 100px; background: #ffffff0a; } inner--wecimaactivities>activity>inner--activity>i { vertical-align: middle; width: 16px !important; height: 16px !important } inner--wecimaactivities>activity>inner--activity>a { color: #fff } inner--wecimaactivities>activity>inner--activity>time { display: block; padding-top: 4px; font-size: 11px; line-height: 100%; opacity: .5 } profile--title>i { font-size: 28px; vertical-align: middle; margin-left: 8px; opacity: .5 } profile--title { font-size: 20px; display: block; margin-bottom: 12px } authorpage-right profiletabs { position: relative; display: block; top: 0; margin-bottom: 16px } authorpage-right profiletabs .profiletabs--sett { float: none; text-align: center; padding: 0; display: flex; margin: 0 -4px } authorpage-right profiletabs .profiletabs--sett>span { flex: 1 1 0%; margin: 0 4px; height: 48px; line-height: 48px; font-size: 16px } authorpage-right profiletabs .profiletabs--sett>span>i { padding-left: 8px; font-size: 22px } authorpage-right profiletabs .profiletabs--sett>span.send-message--messenger { background: #5367ff } tools--addpost--ux { display: inline-block; position: relative; padding-top: 12px; padding-right: 12px } addpost--ux::after { content: ""; display: block; clear: both } .AddCommentInput .AddCommentEmotes>div { display: inline-block; vertical-align: middle; padding: 0 6px } .genres--list--widget { margin: 0 -8px } .genres--list--widget>a { display: inline-block; border-radius: 8px; vertical-align: top; background: #232848; margin-left: 8px; margin-bottom: 8px; padding: 4px 12px; color: #a0a6cc; font-size: 15px } .timelinepost--authorcover .profile-bar { max-width: inherit; height: auto } .timelinepost--authorcover .profile-bar>.avatar--profile-bar { float: right; margin-left: 10px } .timelinepost--authorcover .profile-bar>.info--profile-bar { padding: 20px 0 0; text-align: right } .timelinepost--authorcover .profile-bar>.info--profile-bar>div[style="height:30px;"] { display: none } .HeaderLogo>logotext { display: block; font-family: Tajawal; font-weight: 400; font-size: 17px; line-height: 12px; text-align: center } header>middle--header>ul>li>a i.fa-folder-download { display: inline-block; vertical-align: middle; font-size: 20px; padding-left: 6px } ul.Season--Download--Wecima--Single>li { display: inline-block; min-width: 250px; margin: 0 4px 8px; vertical-align: top; text-align: right } ul.Season--Download--Wecima--Single>li>a { display: block; background: #31a24c; color: #fff; border-radius: 8px; padding: 16px 55px 16px 16px; line-height: 100% } ul.Season--Download--Wecima--Single>li>a>quality { display: block; font-size: 20px; margin-bottom: 6px; text-transform: uppercase } ul.Season--Download--Wecima--Single>li>a>resolution>i { position: absolute; top: 50%; right: 0; width: 55px; text-align: center; color: #fff; line-height: 100%; font-size: 32px; transform: translate(0px, -50%) } ul.Season--Download--Wecima--Single>li>a>resolution { display: block; font-size: 15px; color: #cff7d9 } ul.Season--Download--Wecima--Single>li>a>size { position: absolute; bottom: 8px; left: 16px; transform: translate(0px, -50%) } ul.Season--Download--Wecima--Single>li>a>size>i { vertical-align: middle; margin-left: 2px } ul.Season--Download--Wecima--Single>li>a>i { position: absolute; bottom: 12px; left: 0; width: 50px; text-align: center; font-size: 22px } ul.Season--Download--Wecima--Single { padding-top: 16px; margin: 0 -4px } .inner--Context---overlays form::before { content: "WECIMA"; font-family: bevan; position: absolute; top: 40px; color: #5367ff; right: 50%; transform: translate(50%, 0px); font-size: 60px } middle--header { margin: 0 auto; display: inline-block; white-space: nowrap; vertical-align: top } .AddComment>.AddCommentInput::after { content: ""; width: 0; height: 0; border-style: solid; border-width: 8px 0 8px 8px; border-color: #0000 #0000 #0000 #bdc4ec21; position: absolute; left: 100%; top: 7px } .Button--Menubar--UX { display: inline-block; vertical-align: top; margin: 6px; color: #fff; position: relative } .Button--Menubar--UX>span { display: block; text-align: center; line-height: 48px; font-size: 18px; width: 170px; padding-right: 8px; text-overflow: ellipsis; overflow: hidden; background: #bdc4ec21; border-radius: 8px } .Button--Menubar--UX>span>i { vertical-align: middle; font-size: 23px; padding-left: 4px } .Button--Menubar--UX>.NavigationMenu::-webkit-scrollbar { width: 3px; height: 4px } .Button--Menubar--UX>.NavigationMenu::-webkit-scrollbar-thumb { background: #5c6286; border-radius: 23px } .Button--Menubar--UX>.NavigationMenu::-webkit-scrollbar-track { background: 0 0 } .Button--Menubar--UX>.NavigationMenu { position: absolute; display: none; top: 100%; right: 0; padding: 12px; background: #232848; border-radius: 8px } middle--header.Menubar--UX>.ProductionsListButton { margin: 6px } .Button--Menubar--UX>.NavigationMenu>li {} .Button--Menubar--UX>.NavigationMenu>li>a { border-radius: 8px; display: block; color: #fff; padding: 8px 12px; font-size: 16px; position: relative; max-width: 224px; overflow: hidden; text-overflow: ellipsis } .Button--Menubar--UX>.NavigationMenu>li>a>i.fa-angle-left { position: absolute; left: 8px; top: 50%; transform: translate(0px, -50%) } .Button--Menubar--UX>.NavigationMenu>li.menu-item-has-children>a { padding-left: 30px; padding-right: 12px } .Button--Menubar--UX>.NavigationMenu>li>ul { margin-bottom: 8px; display: none; padding-bottom: 8px; border-bottom: 1px solid #bdc4ec21 } .Button--Menubar--UX>.NavigationMenu>li>ul>li>a { display: block; color: #dddfe4; padding: 4px 8px; border-radius: 8px } .Button--Menubar--UX>.NavigationMenu>li.open>ul { display: block } .Button--Menubar--UX>.NavigationMenu>li>a>i:not(.fa-angle-left) { display: inline-block; vertical-align: middle; padding-left: 6px } .Button--Menubar--UX.open>.NavigationMenu { display: block; max-height: calc(100vh - 120px); overflow: auto; overscroll-behavior: contain } .RightSideFlex--Openmenu { display: inline-block; vertical-align: middle; font-size: 24px; line-height: 36px; text-align: center; padding-top: 5px; padding-right: 8px; height: 40px; width: 40px; padding-left: 8px; border-radius: 18px; margin-left: 8px } .Button--Menubar--UX>.NavigationMenu>.ProductionsListButton { display: block } .Button--Menubar--UX>.NavigationMenu>.ProductionsListButton span { display: inline-block } singlesections>singlecontainerleft { display: block; position: relative; clear: both; background: #0c0f21; padding: 16px 12px; margin: 8px 0 } .Button--Menubar--UX>.NavigationMenu>.ProductionsListButton productionslist--dropdown {} ul.PostItemStats .react-area--social.FromLeft { right: auto; left: -17px; transform-origin: bottom left } .GotoTop { float: right; width: 60px; background: #5b68d0; height: 55px; position: sticky; bottom: 0; z-index: 998; color: #c8cdfd; font-size: 27px; text-align: center; padding-top: 5px; line-height: 14px; cursor: pointer; position: fixed; bottom: 0; transform-origin: bottom center; transform: translate(0, 100%); transition: .3s all cubic-bezier(.21, .12, .02, .99); left: 10px; border-radius: 4px 4px 0 0 } .GotoTop.visible { transform: translate(0) } .GotoTop:hover { height: 78px; font-size: 48px; background: #c7ccf1; color: #5367ff; transition: .1s all cubic-bezier(.21, .12, .02, .99) } .GotoTop>span { display: block; font-size: 15px } .Button--Menubar--UX .ProductionsListButton.open>productionslist--dropdown { position: relative; overflow: auto; height: auto } div.parent--reactions--list li.ReactItem:after { content: ''; display: block; clear: both } notfound { display: block; height: 100vh; padding-top: 100px; text-align: center } notfound title--notfound { display: block; font-size: 210px; line-height: 170px; color: #5367ff; font-family: Arial; font-weight: 700 } notfound>p { font-size: 23px; padding-top: 12px; margin-bottom: 36px } notfound>a { display: inline-block; border-radius: 8px; background: #bdc4ec21; padding: 8px 26px; font-size: 25px; line-height: 37px; color: #fff } a.Moreposts--paginating { display: table; margin: 0 auto; border-radius: 8px; padding: 15px 28px 12px; font-size: 18px; color: #fff; background: #5367ff } a.Moreposts--paginating>i { float: left; padding: 2px 14px 0 0; font-size: 24px } singlecontainer:after { content: ''; display: block; clear: both } footer { display: table; margin: 20px auto; border-radius: 8px; text-align: center; padding-bottom: 10px; } footer>about__us { display: inline-block; vertical-align: middle; margin-right: 20px; } footer>about__us>a { font-size: 16px; font-weight: bold; color: #9ca7f9; } footer copyrights { display: inline-block; background: #5367ff; padding: 10px 12px 8px; border-radius: 8px; vertical-align: middle; } footer copyrights span { vertical-align: middle; } footer>span { vertical-align: middle } footer>a { vertical-align: middle } footer>copyrights>a img { vertical-align: top; width: 120px } .GotoHome { margin-top: 60px; height: calc(100vh - 140px); text-align: center } .GotoHome>a { display: inline-block; background: #232848; position: relative; top: 50%; transform: translate(0, -50%); color: #fff; line-height: 25px; padding: 12px 20px; border-radius: 8px; font-size: 21px } .TrailerCode iframe { position: absolute; width: 100%; height: 100%; top: 0; right: 0 } .TrailerCode { height: 0; padding-top: 61%; position: relative } .Searching--Overlay .search--userarea--rightbar>input { background: #fff; padding: 0 26px; color: #0e1331 } .Searching--Overlay .search--userarea--rightbar>button { display: none } .Episode--number { position: absolute; top: 10px; left: 10px; background: #202e95db; color: white; line-height: 34px; padding: 0px 8px; border-radius: 8px; } .Slider--Grid .GridItem .Episode--number { left: auto; right: 10px; top: 35px; display: none; } .Episode--number>span { display: inline-block; font-size: 22px; margin-right: 6px; font-family: Arial; font-weight: bold; line-height: 100%; vertical-align: middle; } .Episode--number>em { display: inline-block; vertical-align: middle; font-style: normal; font-size: 13px; line-height: 100%; } add_to_watchlist.hoverable { text-align: center; position: absolute; top: 10px; right: 10px; width: 26px; height: 26px; background: #3c9628; border-radius: 50px; overflow: initial !important; z-index: 8; line-height: 28px; color: white; transform-origin: top right; transition: 100ms all ease; opacity: 1 !important; } add_to_watchlist.hoverable.remove { background: #f22626; color: white; } add_to_watchlist.hoverable.remove:hover:before { background: #f22626; color: white; } add_to_watchlist.hoverable:hover { transform: scale(1.3); transition: 50ms all ease; border-radius: 0 50px 50px 0; } add_to_watchlist.hoverable:before { content: Attr(data-tooltip); color: transparent; position: absolute; font-size: 12px; text-align: right; display: inline-block; white-space: nowrap; right: 100%; background: #3c9628; margin-right: -1px; line-height: 26px; opacity: 0; padding-left: 12px; transition: 100ms all ease; border-radius: 50px 0 0 50px; transform: scale(0, 1); transform-origin: right center; font-size: 11px; } add_to_watchlist.hoverable:after { display: none; } add_to_watchlist.hoverable:hover:before { transform: scale(1); opacity: 1; transition: 50ms transform ease, 50ms opacity ease, 50ms 50ms color ease; color: white; } .SinglePost { max-width: 1000px; margin: 60px auto 0; } .SinglePostTitle { padding: 30px 0; } .SinglePostTitle>h1 { font-size: 40px; color: white; line-height: 40px; } .SinglePost .PostContent>* { margin-bottom: 22px; } avatar--activity__loader { height: 40px; width: 40px; border-radius: 60px; background: #ffffff08; display: inline-block; vertical-align: middle; margin-left: 8px; } inner--wecimaactivities__login { position: absolute; top: 40px; right: 0; bottom: 0; left: 0; backdrop-filter: blur(4px); } inner--wecimaactivities__login>span { position: absolute !important; top: 50%; right: 50%; transform: translate(50%, -50%); font-size: 20px; cursor: pointer; line-height: 50px; padding: 0px 20px; width: 200px; text-align: center; border-radius: 8px; } @media only screen and (max-width:1900px) { .WatchServers { width: 200px } .Download--Wecima--Single { max-width: 230px } .WatchServersEmbed { max-width: calc(100% - 462px) } } @media only screen and (max-width:1890px) { .options--leftside-user>a { width: 45px } } @media only screen and (max-width:1700px) { singlecontainer>singlecontainerleft { width: 320px } .react-area--social { right: -58px } ul.PostItemStats .react-area--social { right: -17px } singlecontainer>singlecontainerright { width: calc(100% - 320px) } .Download--Wecima--Single { max-width: initial } ul.List--Download--Wecima--Single { margin: 0 -4px } .Download--Wecima--Single li { display: inline-block; min-width: 220px; margin: 0 4px } .WatchServersEmbed { max-width: calc(100% - 226px); margin-left: 0; margin-bottom: 12px } } @media only screen and (max-width:1600px) { header>middle--header>ul>li { max-width: 210px; text-overflow: ellipsis } } @media only screen and (max-width:1480px) { .list--Tabsui>a { font-size: 18px; padding: 12px; margin-left: 4px; margin-bottom: 6px } .RightSideFlex { width: auto; margin-left: 12px } } @media only screen and (max-width:1420px) { .WatchServersEmbed { max-width: inherit } .WatchServers { width: auto; display: block; margin: 0 0 12px; text-align: center } .WatchServers>ul li btn { padding: 4px 12px } .WatchServers>ul li { display: inline-block; vertical-align: middle; background: #bdc4ec21; border-radius: 8px; margin: 0 4px 8px } .ProductionsListButton>productionslistbutton>span { display: none } .ProductionsListButton>productionslistbutton>img { margin-left: 0 } .Poster--Single-begin { margin-bottom: 12px } .Single-begin { text-align: center } .Content--Single-begin { max-width: inherit; display: block; text-align: right; margin: 0 } } @media only screen and (max-width:1300px) { header>middle--header>ul>li:first-child { display: none } header>middle--header>ul>li { max-width: 190px } header>middle--header>ul>li.menu-item-has-children>a { padding-left: 30px } header>middle--header>ul>li>a>i.fa-angle-left { padding-right: 7px; font-size: 15px; transform: rotate(270deg) translate(11px, -8px) !important } .Slider--Grid .GridItem { width: 200px } confirmation { left: 0 } .LeftUI { display: none; background: #0c0f21; box-shadow: 4px 0 10px 7px #070915c4; z-index: 101 } } @media only screen and (max-width:1260px) { .Results--Searching--Overlay { margin: 0 230px 0 150px } .Searching--Overlay>form-search { margin: 0 230px 0 150px } @media only screen and (max-width:1060px) { .Searching--Overlay>form-search { margin: 0 280px 0 0 } .Results--Searching--Overlay { margin: 0 280px 0 0 } } @media only screen and (max-width:1130px) { confirmation { right: 0 } wecima { margin: 0 16px } wecimaslider>.Breadcrumb--UX { text-align: center; padding: 22px 8px 8px; line-height: 30px } .list--Tabsui { text-align: center } .RightUI { display: none; background: #0c0f21; z-index: 101 } singlecontainer { margin-right: 0 } .RightSideFlex>a { vertical-align: middle } .Poster--Single-begin { width: 200px; margin-left: 16px } .Content--Single-begin { max-width: calc(100% - 226px); display: inline-block; vertical-align: top } } @media only screen and (max-width:900px) { .List--Teamwork>ul.Inner--List--Teamwork>li { min-width: 100px; max-width: 200px } .Breadcrumb--UX>ol { white-space: normal } .emoji:after { font-size: 38px } .Poster--Single-begin { margin: 0 0 12px } .react-area--social { transform: scale(.3) translate(0px, 50px) } singlecontainer>singlecontainerright { width: calc(100% - 270px) } singlecontainer>singlecontainerleft { width: 270px } .List--Seasons--Episodes>a { display: inline-block; margin: 0 4px 8px; vertical-align: top } .Episodes--Seasons--Episodes { max-width: inherit } .List--Seasons--Episodes { display: block; margin: 0 0 12px; float: none; width: auto; background: 0 0; border-radius: 0; padding: 0 } .Season--Download--Wecima--Single { text-align: center } .Content--Single-begin { display: block; max-width: inherit } .react-area--social { transition: 0s all ease } [data-button=react]:hover .react-area--social:not(.close) { transform: scale(.3) translate(0px, -10px) } } @media only screen and (max-width:770px) { .list--Tabsui>a>i { font-size: 20px; padding-top: 3px } .list--Tabsui { white-space: nowrap; overflow: auto } .list--Tabsui>a { font-size: 16px; padding: 7px 15px } .info--profile-bar { padding-right: 16px } wecima { margin: 0 8px } authorpage-right { float: none; width: auto; min-height: auto; margin-bottom: 15px } authorpage-left { width: auto; float: none } innerpaddingauthorcover .profilesettings--cover { font-size: 12px; bottom: auto; top: 8px; left: 8px; background: #000; border-radius: 8px } .profile-bar { max-width: initial } innerpaddingauthorcover { padding-top: 44% } authorcover { margin: 60px -8px 0 } .avatar--profile-bar { margin: -70px auto 0 } } @media only screen and (max-width: 666px) { .GotoHome>a { font-size: 23px; line-height: 26px; padding: 16px; margin: 0px 16px; } .RightUI, .LeftUI { padding-top: 120px } header.double--header .Button--Menubar--UX>span { width: auto; text-align: right; font-size: 16px } rootinside { display: block; padding-top: 48px; overflow: hidden } .LeftSideFlex { position: absolute; top: 100%; left: 0; height: 48px; z-index: 5 } .RightSideFlex--Openmenu { position: absolute; top: 50%; right: 8px; margin-top: -22px } .RightSideFlex { display: block; margin: 0; text-align: center; padding: 0 8px } header.double--header .Button--Menubar--UX { position: absolute; top: 100%; right: 0; width: 100%; background: #5367ff; margin: 0 } singlecontainer>singlecontainerright { width: auto } div.parent--reactions--list { min-width: 310px } } @media only screen and (max-width:550px) { .title--Context---overlays ul.reactions--tabs { white-space: nowrap; overflow: auto; max-width: 240px } .inner--Context---overlays form { width: 300px } div.buttons--loginform>a { margin: 0 0 8px } div.buttons--loginform { display: block } .inner--Context---overlays form:before { font-size: 50px } .Boxed--Context---overlays { min-width: 300px } .circle--ppicture--post-item { width: 270px; height: 270px } .photoslibrary.miniphotos { max-width: 480px } .Button--Menubar--UX>span { width: 90px } .HeaderLogo { font-size: 30px } .HeaderLogo>h1 { font-size: 14px } } } @media only screen and (max-width:775px) { .EpisodeNavigation>a>em { vertical-align: middle; font-size: 23px; padding: 0 4px } .EpisodeNavigation>a { font-size: 16px; height: auto; line-height: 100%; padding: 8px 8px 6px; margin-bottom: 4px } .Grid--WecimaPosts { display: flex; flex-wrap: wrap; padding: 0 2px } .pagination>ul>li>* { font-size: 13px; padding: 12px 14px } .GridItem ul.PostItemStats>li:last-child { display: none } singlerelated .GridItem { width: 150px } .post-reactions--post-statistics---postitem { white-space: nowrap; overflow: hidden; text-overflow: ellipsis } .GridItem span.BG--GridItem { padding-top: 160% } .Thumb--GridItem>a>strong { padding: 10px } .GridItem { padding: 2px 2px 48px; margin: 0 3px 6px; flex: 1; min-width: 140px } .Searching--Overlay { top: 60px; height: calc(100vh - 60px) } .Searching--Overlay>form-search { margin-right: 0 } .Results--Searching--Overlay { margin-right: 0 } .LoginButton>span { font-size: 15px } .LoginButton>i { padding-left: 8px; font-size: 16px } .LoginButton { max-width: 160px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 8px } } @media only screen and (max-width:400px) { .EpisodeNavigation>a { float: none !important; display: block; text-align: center } } root { display: block !important; } wecimaloader { display: none; } .FirstSideFlex .HeaderLogo>logotext { display: block; font-weight: 900; display: block; font-size: 34px } payments-wecima { display: block; padding: 60px 0 0 0; } payments-wecima-container { display: flex; max-width: 1200px; justify-content: center; flex-direction: column; margin: 0 auto; min-height: calc(100vh - 133px); padding: 60px 0; transition: 200ms all ease; } payments-wecima-container.succeed { align-items: center; } payments-wecima-container.succeed>i { text-align: center; font-size: 120px; color: var(--positive); } payments-wecima-container.succeed>p { margin: 0 0 17px; font-size: 30px; line-height: 30px; } payments-wecima-container.succeed>strong { color: var(--uicolor); font-size: 15px; } payments-wecima-container>h1 { text-align: center; font-size: 45px; line-height: 50px; margin-bottom: 16px; } payments-wecima-container>p { text-align: center; font-size: 22px; opacity: .8; margin-bottom: 70px; } payments-wecima-container>h1>verified { width: 24px; height: 24px; line-height: 29px; margin: 0; font-size: 14px; } .PriceTable {} .PriceTable>ul { display: flex; align-items: center; margin: 0px 0px 60px; flex-wrap: wrap; } .PriceTable>ul>li { flex: 1; margin: 10px; border: 1px solid #282c44; border-radius: var(--miniradius); padding: 50px 35px; color: #9197bb; cursor: pointer; min-width: 240px; } .PriceTable>ul>li.featured { border-color: #2c86fd !important; color: #2c86fd !important; background: transparent; } .PriceTable>ul>li:hover { border-color: #485077; color: white; } .PriceTable>ul>li.selected { background: #2c86fd !important; color: white; border-color: #2c86fd; } .PriceTable>ul>li.selected:after { display: none; } .PriceTable>ul>li:after { z-index: -1; border-radius: var(--miniradius); } .PriceTable>ul>li:hover:after { background: #161a2d; } .PriceTable>ul>li>strong { display: block; text-align: right; font-size: 18px; line-height: 20px; margin-bottom: 20px; } .PriceTable>ul>li.featured>strong {} .PriceTable>ul>li.featured>.Price {} .PriceTable>ul>li>.Price { display: flex; margin-bottom: 30px; align-items: flex-start; } .PriceTable>ul>li>.Price>em { font-style: normal; font-size: 28px; font-weight: bold; line-height: 18px; margin-left: 4px; } .PriceTable>ul>li>.Price>span { line-height: 36px; font-size: 60px; font-weight: bold; } .PriceTable>ul>li>.Price>strong { line-height: 14px; padding-top: 25px; padding-right: 8px; font-size: 14px; opacity: .7; } .PriceTable_Footer { text-align: center; } .PriceTable_Footer>a { font-size: 20px; display: inline-block; padding: 22px 60px; background: #2c86fd; border-radius: var(--miniradius); color: white; font-weight: bold; } .PriceTable_Footer>a.disabled { background: #181d35; color: #414a75; } .PriceTable>ul>li>p { font-size: 14px; text-align: center; color: #666e9e; } .PriceTable>ul>li.selected p { color: white; } .PriceTable>ul>li>p.checked { color: white; } .PriceTable>ul>li>p>i { color: white; display: inline-block; width: 16px; height: 16px; background: var(--negative); border-radius: 50px; line-height: 17px; margin-left: 6px; font-size: 10px; } .PriceTable>ul>li>p.checked>i { background: var(--positive); } a.player-app:hover p { color: white } a.player-app { position: absolute; top: 0; right: 0; left: 0; bottom: 0; display: flex; align-items: center; justify-content: center; text-align: center; color: white; } a.player-app p { font-size: 22px; color: #959cc7; } a.player-app i { width: 120px; margin: 0 auto; padding-top: 4px; height: 120px; border-radius: 70px; background: var(--uicolor); display: flex; font-size: 50px; align-items: center; margin-bottom: 20px; justify-content: center; } .-movie-info-share { display: flex; padding-top: 20px; align-items: center; flex-wrap: wrap; } .-movie-info-share>p { margin-left: 20px; } .-movie-info-share>a { transition: 250ms all ease; font-size: 20px; background: var(--color); margin: 4px; color: white; width: 60px; height: 40px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 26px; padding-top: 3px; opacity: .7; } .-movie-info-share>a:hover { opacity: 1; transition: 50ms all ease; } .-movie-info-share>a>i { line-height: 100%; } .-movie-info-share>a.whatsapp { --color: #25D366; } .-movie-info-share>a.facebook { --color: #1877F2; } .-movie-info-share>a.telegram { --color: #27A0DD; } .-movie-info-share>a.twitter { --color: #1DA1F2; } .-movie-info-share>a.messenger { --color: #09F; } .footer-social { display: flex; vertical-align: middle; text-align: center; justify-content: center; } .footer-social>a { vertical-align: top; font-size: 21px; width: 80px; color: white; margin: 0 5px; height: 40px; display: inline-block; line-height: 46px; border-radius: 50px; } .footer-social>a.facebook { background: #1877F2; } .footer-social>a.twitter { background: #1DA1F2; } .footer-social>a.telegram { background: #34ACE0; } .WecimaonSocialnetwork { text-align: center; padding: 30px; } .WecimaonSocialnetwork>h2 { font-size: 26px; line-height: 1.2; margin-bottom: 20px; } .DoYouMean { text-align: right; padding: 20px 20px 0px; font-size: 20px; text-transform: capitalize; color: white; font-weight: bold; } .DoYouMean strong { color: #808dea; } .list--Tabsui { text-align: right; padding: 20px; } .button--parent---popover>verified { width: 36px; height: 36px; border-radius: 36px; line-height: 38px; text-align: center; display: inline-block; vertical-align: middle; margin-left: 12px; font-size: 20px; color: white; } .react-area--social { position: absolute; z-index: 2; right: -20px; bottom: 100%; box-shadow: 0 0 0 1px rgba(0, 0, 0, .08), 0 2px 2px rgba(0, 0, 0, .15); border-bottom: 1px solid #ffffff14; white-space: nowrap; background: #22263c; border-radius: 130px; padding: 13px 11px; margin-bottom: 3px; transform-origin: bottom right; transform: scale(.36) translate(0px, 50px); transition: .2s .3s all ease; visibility: hidden; opacity: 0; } singlecontainerleft .reply--comment .react-area--social { right: -70px; } [data-button="react"]:hover .react-area--social:not(.close) { visibility: visible; opacity: 1; transform: scale(.36) translate(0px, -10px); } .emoji { width: 120px; height: 120px; margin: 0; background: linear-gradient(to bottom, #FFE276, #F89E38); display: inline-block; border-radius: 50%; position: relative; cursor: pointer; vertical-align: top; margin: 0px 10px; transform-origin: bottom center; transition: .2s all ease; } .emoji:hover { transform: scale(1.18); z-index: 10; } .emoji:after { position: absolute; bottom: 100%; left: 50%; font-weight: normal; color: #8A8A8A; content: Attr(data-tooltip); background: #0b0c0cc2; margin-bottom: 13px; font-size: 25px; transform: translate(-50%, 0); height: 50px; padding: 1px 19px; line-height: 46px; border-radius: 50px; opacity: 0; transition: .2s all ease; color: #ffffff; } .emoji:hover:after { opacity: 1; } .emoji__face, .emoji__eyebrows, .emoji__eyes, .emoji__mouth, .emoji__tongue, .emoji__heart, .emoji__hand, .emoji__thumb { position: absolute; } .emoji__face:before, .emoji__face:after, .emoji__eyebrows:before, .emoji__eyebrows:after, .emoji__eyes:before, .emoji__eyes:after, .emoji__mouth:before, .emoji__mouth:after, .emoji__tongue:before, .emoji__tongue:after, .emoji__heart:before, .emoji__heart:after, .emoji__hand:before, .emoji__hand:after, .emoji__thumb:before, .emoji__thumb:after { position: absolute; content: ''; } .emoji__face { width: inherit; height: inherit; } .emoji--like { background: linear-gradient(to bottom, #32A0FB, #2155CD); } .emoji--like .emoji__hand { left: 25px; bottom: 30px; width: 20px; height: 40px; background: #FFFFFF; border-radius: 5px; z-index: 0; -webkit-animation: hands-up 2s linear infinite; animation: hands-up 2s linear infinite; } .emoji--like .emoji__hand:before { left: 25px; bottom: 5px; width: 40px; background: inherit; height: 10px; border-radius: 2px 10px 10px 2px; box-shadow: 1px -9px 0 1px #FFFFFF, 2px -19px 0 2px #FFFFFF, 3px -29px 0 3px #FFFFFF; } .emoji--like .emoji__thumb { border-bottom: 20px solid #FFFFFF; border-left: 20px solid transparent; top: -25px; right: -25px; z-index: 2; -webkit-transform: rotate(5deg); transform: rotate(5deg); -webkit-transform-origin: 0% 100%; transform-origin: 0% 100%; -webkit-animation: thumbs-up 2s linear infinite; animation: thumbs-up 2s linear infinite; } .emoji--like .emoji__thumb:before { border-radius: 50% 50% 0 0; background: #FFFFFF; width: 10px; height: 12px; left: -10px; top: -8px; -webkit-transform: rotate(-15deg); transform: rotate(-15deg); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; box-shadow: -1px 4px 0 -1px #FFFFFF; } .emoji--love { background: linear-gradient(to bottom, #F85C7D, #E01333); } .emoji--love .emoji__heart { left: calc(50% - 40px); top: calc(50% - 40px); width: 80px; height: 80px; -webkit-animation: heart-beat 1s linear infinite alternate; animation: heart-beat 1s linear infinite alternate; } .emoji--love .emoji__heart:before, .emoji--love .emoji__heart:after { left: calc(50% - 20px); top: calc(50% - 32px); width: 40px; height: 64px; background: #FFFFFF; border-radius: 20px 20px 0 0; } .emoji--love .emoji__heart:before { -webkit-transform: translate(20px) rotate(-45deg); transform: translate(20px) rotate(-45deg); -webkit-transform-origin: 0 100%; transform-origin: 0 100%; } .emoji--love .emoji__heart:after { -webkit-transform: translate(-20px) rotate(45deg); transform: translate(-20px) rotate(45deg); -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; } .emoji--haha .emoji__face { -webkit-animation: haha-face 2s linear infinite; animation: haha-face 2s linear infinite; } .emoji--haha .emoji__eyes { width: 26px; height: 6px; border-radius: 2px; left: calc(50% - 13px); top: 35px; -webkit-transform: rotate(20deg); transform: rotate(20deg); background: transparent; box-shadow: -25px 5px 0 0 #333C5E, 25px -5px 0 0 #333C5E; } .emoji--haha .emoji__eyes:after { left: 0; top: 0; width: 26px; height: 6px; border-radius: 2px; -webkit-transform: rotate(-40deg); transform: rotate(-40deg); background: transparent; box-shadow: -25px -5px 0 0 #333C5E, 25px 5px 0 0 #333C5E; } .emoji--haha .emoji__mouth { width: 80px; height: 40px; left: calc(50% - 40px); top: 50%; background: #000000; border-radius: 0 0 40px 40px; overflow: hidden; z-index: 1; -webkit-animation: haha-mouth 2s linear infinite; animation: haha-mouth 2s linear infinite; } .emoji--haha .emoji__tongue { width: 70px; height: 30px; background: #D3264A; left: calc(50% - 35px); bottom: -10px; border-radius: 50%; } .emoji--yay:after { content: 'Yay'; -webkit-animation: yay-reverse 1s linear infinite; animation: yay-reverse 1s linear infinite; } .emoji--yay .emoji__face { -webkit-animation: yay 1s linear infinite alternate; animation: yay 1s linear infinite alternate; } .emoji--yay .emoji__eyebrows { left: calc(50% - 3px); top: 30px; height: 6px; width: 6px; border-radius: 50%; background: transparent; box-shadow: -6px 0 0 0 #000000, -36px 0 0 0px #000000, 6px 0 0 0 #000000, 36px 0 0 0px #000000; } .emoji--yay .emoji__eyebrows:before, .emoji--yay .emoji__eyebrows:after { width: 36px; height: 18px; border-radius: 60px 60px 0 0; background: transparent; border: 6px solid black; box-sizing: border-box; border-bottom: 0; bottom: 3px; left: calc(50% - 18px); } .emoji--yay .emoji__eyebrows:before { margin-left: -21px; } .emoji--yay .emoji__eyebrows:after { margin-left: 21px; } .emoji--yay .emoji__mouth { top: 60px; background: transparent; left: 50%; } .emoji--yay .emoji__mouth:after { width: 80px; height: 80px; left: calc(50% - 40px); top: -75px; border-radius: 50%; background: transparent; border: 6px solid #000000; box-sizing: border-box; border-top-color: transparent; border-left-color: transparent; border-right-color: transparent; z-index: 1; } .emoji--yay .emoji__mouth:before { width: 6px; height: 6px; background: transparent; border-radius: 50%; bottom: 5px; left: calc(50% - 3px); box-shadow: -25px 0 0 0 #000000, 25px 0 0 0 #000000, -35px -2px 30px 10px #D5234C, 35px -2px 30px 10px #D5234C; } .emoji--wow .emoji__face { -webkit-animation: wow-face 3s linear infinite; animation: wow-face 3s linear infinite; } .emoji--wow .emoji__eyebrows { left: calc(50% - 3px); height: 6px; width: 6px; border-radius: 50%; background: transparent; box-shadow: -18px 0 0 0 #CC7700, -33px 0 0 0 #CC7700, 18px 0 0 0 #CC7700, 33px 0 0 0 #cc7700; -webkit-animation: wow-brow 3s linear infinite; animation: wow-brow 3s linear infinite; } .emoji--wow .emoji__eyebrows:before, .emoji--wow .emoji__eyebrows:after { width: 24px; height: 20px; border: 6px solid #CC7700; box-sizing: border-box; border-radius: 50%; border-bottom-color: transparent; border-left-color: transparent; border-right-color: transparent; top: -3px; left: calc(50% - 12px); } .emoji--wow .emoji__eyebrows:before { margin-left: -25px; } .emoji--wow .emoji__eyebrows:after { margin-left: 25px; } .emoji--wow .emoji__eyes { width: 16px; height: 24px; left: calc(50% - 8px); top: 35px; border-radius: 50%; background: transparent; box-shadow: 25px 0 0 0 #333C5E, -25px 0 0 0 #333C5E; } .emoji--wow .emoji__mouth { width: 30px; height: 45px; left: calc(50% - 15px); top: 50%; border-radius: 50%; background: linear-gradient(to bottom, #4D2210, #742F08); -webkit-animation: wow-mouth 3s linear infinite; animation: wow-mouth 3s linear infinite; } .emoji--sad .emoji__face { -webkit-animation: sad-face 2s ease-in infinite; animation: sad-face 2s ease-in infinite; } .emoji--sad .emoji__eyebrows { left: calc(50% - 3px); top: 35px; height: 6px; width: 6px; border-radius: 50%; background: transparent; box-shadow: -40px 9px 0 0 #cc7700, -25px 0 0 0 #cc7700, 25px 0 0 0 #cc7700, 40px 9px 0 0 #cc7700; } .emoji--sad .emoji__eyebrows:before, .emoji--sad .emoji__eyebrows:after { width: 30px; height: 20px; border: 6px solid #cc7700; box-sizing: border-box; border-radius: 50%; border-bottom-color: transparent; border-left-color: transparent; border-right-color: transparent; top: 2px; left: calc(50% - 15px); } .emoji--sad .emoji__eyebrows:before { margin-left: -30px; -webkit-transform: rotate(-30deg); transform: rotate(-30deg); } .emoji--sad .emoji__eyebrows:after { margin-left: 30px; -webkit-transform: rotate(30deg); transform: rotate(30deg); } .emoji--sad .emoji__eyes { width: 14px; height: 16px; left: calc(50% - 7px); top: 50px; border-radius: 50%; background: transparent; box-shadow: 25px 0 0 0 #333C5E, -25px 0 0 0 #333C5E; } .emoji--sad .emoji__eyes:after { background: #548DFF; width: 12px; height: 12px; margin-left: 6px; border-radius: 0 100% 40% 50% / 0 50% 40% 100%; -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-animation: tear-drop 2s ease-in infinite; animation: tear-drop 2s ease-in infinite; } .emoji--sad .emoji__mouth { width: 60px; height: 80px; left: calc(50% - 30px); top: 80px; box-sizing: border-box; border: 6px solid #4D2210; border-radius: 50%; border-bottom-color: transparent; border-left-color: transparent; border-right-color: transparent; background: transparent; -webkit-animation: sad-mouth 2s ease-in infinite; animation: sad-mouth 2s ease-in infinite; } .emoji--sad .emoji__mouth:after { width: 6px; height: 6px; background: transparent; border-radius: 50%; top: 4px; left: calc(50% - 3px); box-shadow: -18px 0 0 0 #000000, 18px 0 0 0 #000000; } .emoji--angry { background: linear-gradient(#d93902 -2%, #ea802d); background-size: 100%; -webkit-animation: angry-color 2s ease-in infinite; animation: angry-color 2s ease-in infinite; background-position: top; } .emoji--angry .emoji__face { -webkit-animation: angry-face 2s ease-in infinite; animation: angry-face 2s ease-in infinite; } .emoji--angry .emoji__eyebrows { left: calc(50% - 3px); top: 49px; height: 6px; width: 6px; border-radius: 50%; background: transparent; box-shadow: -44px 5px 0 0 #BC3B01, -7px 16px 0 0 #BC3B01, 7px 16px 0 0 #BC3B01, 44px 5px 0 0 #BC3B01; transform: scale(1, 1.2) translate(0px, -21px); opacity: .2; } .emoji--angry .emoji__eyebrows:before, .emoji--angry .emoji__eyebrows:after { width: 50px; height: 20px; border: 6px solid #000000; box-sizing: border-box; border-radius: 50%; border-top-color: transparent; border-left-color: transparent; border-right-color: transparent; top: 0; left: calc(50% - 25px); } .emoji--angry .emoji__eyebrows:before { margin-left: -25px; -webkit-transform: rotate(15deg); transform: rotate(15deg); } .emoji--angry .emoji__eyebrows:after { margin-left: 25px; -webkit-transform: rotate(-15deg); transform: rotate(-15deg); } .emoji--angry .emoji__eyes { width: 12px; height: 12px; left: calc(50% - 6px); top: 70px; border-radius: 50%; background: transparent; box-shadow: 15px 0 0 0 #343C61, -15px 0 0 0 #343C61; transform: scale(1.7) translate(0px, -9px); } .emoji--angry .emoji__mouth { width: 26px; height: 25px; left: 50%; border-radius: 70px; transform: translate(-50%, 0%); bottom: 25px; background: linear-gradient(to bottom, #4D2210, #742F08); -webkit-animation: angry-mouth 2s ease-in infinite; animation: angry-mouth 2s ease-in infinite; } @-webkit-keyframes heart-beat { 25% { -webkit-transform: scale(1.1); transform: scale(1.1); } 75% { -webkit-transform: scale(0.6); transform: scale(0.6); } } @keyframes heart-beat { 25% { -webkit-transform: scale(1.1); transform: scale(1.1); } 75% { -webkit-transform: scale(0.6); transform: scale(0.6); } } @-webkit-keyframes haha-face { 10%, 30%, 50% { -webkit-transform: translateY(25px); transform: translateY(25px); } 20%, 40% { -webkit-transform: translateY(15px); transform: translateY(15px); } 60%, 80% { -webkit-transform: translateY(0); transform: translateY(0); } 70%, 90% { -webkit-transform: translateY(-10px); transform: translateY(-10px); } } @keyframes haha-face { 10%, 30%, 50% { -webkit-transform: translateY(25px); transform: translateY(25px); } 20%, 40% { -webkit-transform: translateY(15px); transform: translateY(15px); } 60%, 80% { -webkit-transform: translateY(0); transform: translateY(0); } 70%, 90% { -webkit-transform: translateY(-10px); transform: translateY(-10px); } } @-webkit-keyframes haha-mouth { 10%, 30%, 50% { -webkit-transform: scale(0.6); transform: scale(0.6); top: 45%; } 20%, 40% { -webkit-transform: scale(0.8); transform: scale(0.8); top: 45%; } 60%, 80% { -webkit-transform: scale(1); transform: scale(1); top: 50%; } 70% { -webkit-transform: scale(1.2); transform: scale(1.2); top: 50%; } 90% { -webkit-transform: scale(1.1); transform: scale(1.1); top: 50%; } } @keyframes haha-mouth { 10%, 30%, 50% { -webkit-transform: scale(0.6); transform: scale(0.6); top: 45%; } 20%, 40% { -webkit-transform: scale(0.8); transform: scale(0.8); top: 45%; } 60%, 80% { -webkit-transform: scale(1); transform: scale(1); top: 50%; } 70% { -webkit-transform: scale(1.2); transform: scale(1.2); top: 50%; } 90% { -webkit-transform: scale(1.1); transform: scale(1.1); top: 50%; } } @-webkit-keyframes yay { 25% { -webkit-transform: rotate(-15deg); transform: rotate(-15deg); } 75% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } } @keyframes yay { 25% { -webkit-transform: rotate(-15deg); transform: rotate(-15deg); } 75% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } } @-webkit-keyframes wow-face { 15%, 25% { -webkit-transform: rotate(20deg) translateX(-25px); transform: rotate(20deg) translateX(-25px); } 45%, 65% { -webkit-transform: rotate(-20deg) translateX(25px); transform: rotate(-20deg) translateX(25px); } 75%, 100% { -webkit-transform: rotate(0deg) translateX(0); transform: rotate(0deg) translateX(0); } } @keyframes wow-face { 15%, 25% { -webkit-transform: rotate(20deg) translateX(-25px); transform: rotate(20deg) translateX(-25px); } 45%, 65% { -webkit-transform: rotate(-20deg) translateX(25px); transform: rotate(-20deg) translateX(25px); } 75%, 100% { -webkit-transform: rotate(0deg) translateX(0); transform: rotate(0deg) translateX(0); } } @-webkit-keyframes wow-brow { 15%, 65% { top: 25px; } 75%, 100%, 0% { top: 15px; } } @keyframes wow-brow { 15%, 65% { top: 25px; } 75%, 100%, 0% { top: 15px; } } @-webkit-keyframes wow-mouth { 10%, 30% { width: 20px; height: 20px; left: calc(50% - 10px); } 50%, 70% { width: 30px; height: 40px; left: calc(50% - 15px); } 75%, 100% { height: 50px; } } @keyframes wow-mouth { 10%, 30% { width: 20px; height: 20px; left: calc(50% - 10px); } 50%, 70% { width: 30px; height: 40px; left: calc(50% - 15px); } 75%, 100% { height: 50px; } } @-webkit-keyframes sad-face { 25%, 35% { top: -15px; } 55%, 95% { top: 10px; } 100%, 0% { top: 0; } } @keyframes sad-face { 25%, 35% { top: -15px; } 55%, 95% { top: 10px; } 100%, 0% { top: 0; } } @-webkit-keyframes sad-mouth { 25%, 35% { -webkit-transform: scale(0.85); transform: scale(0.85); top: 70px; } 55%, 100%, 0% { -webkit-transform: scale(1); transform: scale(1); top: 80px; } } @keyframes sad-mouth { 25%, 35% { -webkit-transform: scale(0.85); transform: scale(0.85); top: 70px; } 55%, 100%, 0% { -webkit-transform: scale(1); transform: scale(1); top: 80px; } } @-webkit-keyframes tear-drop { 0%, 100% { display: block; left: 35px; top: 15px; -webkit-transform: rotate(45deg) scale(0); transform: rotate(45deg) scale(0); } 25% { display: block; left: 35px; -webkit-transform: rotate(45deg) scale(2); transform: rotate(45deg) scale(2); } 49.9% { display: block; left: 35px; top: 65px; -webkit-transform: rotate(45deg) scale(0); transform: rotate(45deg) scale(0); } 50% { display: block; left: -35px; top: 15px; -webkit-transform: rotate(45deg) scale(0); transform: rotate(45deg) scale(0); } 75% { display: block; left: -35px; -webkit-transform: rotate(45deg) scale(2); transform: rotate(45deg) scale(2); } 99.9% { display: block; left: -35px; top: 65px; -webkit-transform: rotate(45deg) scale(0); transform: rotate(45deg) scale(0); } } @keyframes tear-drop { 0%, 100% { display: block; left: 35px; top: 15px; -webkit-transform: rotate(45deg) scale(0); transform: rotate(45deg) scale(0); } 25% { display: block; left: 35px; -webkit-transform: rotate(45deg) scale(2); transform: rotate(45deg) scale(2); } 49.9% { display: block; left: 35px; top: 65px; -webkit-transform: rotate(45deg) scale(0); transform: rotate(45deg) scale(0); } 50% { display: block; left: -35px; top: 15px; -webkit-transform: rotate(45deg) scale(0); transform: rotate(45deg) scale(0); } 75% { display: block; left: -35px; -webkit-transform: rotate(45deg) scale(2); transform: rotate(45deg) scale(2); } 99.9% { display: block; left: -35px; top: 65px; -webkit-transform: rotate(45deg) scale(0); transform: rotate(45deg) scale(0); } } @-webkit-keyframes hands-up { 25% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } 50% { -webkit-transform: rotate(-15deg) translateY(-10px); transform: rotate(-15deg) translateY(-10px); } 75%, 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes hands-up { 25% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } 50% { -webkit-transform: rotate(-15deg) translateY(-10px); transform: rotate(-15deg) translateY(-10px); } 75%, 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @-webkit-keyframes thumbs-up { 25% { -webkit-transform: rotate(20deg); transform: rotate(20deg); } 50%, 100% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } } @keyframes thumbs-up { 25% { -webkit-transform: rotate(20deg); transform: rotate(20deg); } 50%, 100% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } } @-webkit-keyframes angry-color { 45%, 60% { background-size: 250%; } 85%, 100%, 0% { background-size: 100%; } } @keyframes angry-color { 45%, 60% { background-size: 280%; } 85%, 100%, 0% { background-size: 400%; } } @-webkit-keyframes angry-face { 35%, 60% { -webkit-transform: translateX(0) translateY(10px) scale(0.9); transform: translateX(0) translateY(10px) scale(0.9); } 40%, 50% { -webkit-transform: translateX(-5px) translateY(10px) scale(0.9); transform: translateX(-5px) translateY(10px) scale(0.9); } 45%, 55% { -webkit-transform: translateX(5px) translateY(10px) scale(0.9); transform: translateX(5px) translateY(10px) scale(0.9); } } @keyframes angry-face { 35%, 60% { -webkit-transform: translateX(0) translateY(10px) scale(0.9); transform: translateX(0) translateY(20px) scale(0.9); } 40%, 50% { -webkit-transform: translateX(-5px) translateY(10px) scale(0.9); transform: translateX(-5px) translateY(20px) scale(0.9); } 45%, 55% { -webkit-transform: translateX(5px) translateY(10px) scale(0.9); transform: translateX(5px) translateY(20px) scale(0.9); } } @-webkit-keyframes angry-mouth { 25%, 50% { height: 6px; bottom: 25px; } } @keyframes angry-mouth { 25%, 50%, 75% { height: 6px; bottom: 33px; width: 36px; } } .AddCommentEmotes { color: #A4A6AA; padding: 10px 6px 0; background: #bdc4ec21; font-size: 18px; display: inline-block; border-radius: 18px; vertical-align: top; margin-left: 4px; height: 36px; width: 36px; } .unline:hover { text-decoration: underline; } .HeaderTabs>ul>li:not(.selected):hover:after { opacity: 1; } .HeaderTabs>ul>li:hover { color: white; } .WecimaStories .owl-item>li:hover .StoryBg:after { background: rgb(24 25 26 / 48%); } .WecimaStories .owl-item>li:hover .StoryBg { transform: scale(1.04); } .PostItemWatchItem>ul>li:hover:after { opacity: 1; visibility: visible; } .PostItemWatchItem>ul>li:hover { transform: scale(1.2); } ul.PostItemStats>li>.InnerButton:hover { background: rgb(105 114 156 / 28%); z-index: 2; } .login--leftside-user>a:hover { color: white; } .userhead-userarea--rightbar>a:hover { background: rgb(189 196 236 / 13%); transition: 50ms all cubic-bezier(0, 0, 1, 1); } ul.menu-userarea--rightbar>li>a:hover { background: rgb(189 196 236 / 8%); transition: 50ms all cubic-bezier(0, 0, 1, 1); } a.showmore-userarea--rightbar:hover { background: rgb(189 196 236 / 13%); transition: 50ms background cubic-bezier(0, 0, 1, 1); } p.comment-area--content---comments a:hover { text-decoration: underline; } .actions--comment-area---comments .InnerButton:hover { cursor: pointer; text-decoration: underline; } .actions--comment-area---comments>a:hover { text-decoration: underline; cursor: pointer; } .total--post-reactions---post-statistics----postitem:hover { text-decoration: underline; } a.comments--post-statistics---postitem:hover { text-decoration: underline; } .WecimaStories .owl-item>li:active { transform: scale(.98); } ul.PostItemStats>li>.InnerButton:active { transform: scale(.96); } .addcomment-input--post:focus+span { color: #c5c8ce; } form.SearchArea>input:focus { background: #454648; } span.Close--title---Context----overlays:hover:after { opacity: 1; transition: 50ms all cubic-bezier(0, 0, 1, 1); } .activable:active { transform: scale(.96); opacity: .85; } .hoverable { position: relative; overflow: hidden; z-index: 1; } .hoverable.hoverableselect:hover:after { background: rgb(68 73 80 / 15%); } .hoverable.hoverableselect:after { transition: 0ms; } .activable { user-select: none; cursor: pointer; } .hoverable:after { content: ''; position: absolute; top: 0; right: 0; width: 100%; height: 100%; background: transparent; transition: 150ms cubic-bezier(0, 0, 1, 1) background; pointer-events: none; } .hoverable:hover:after { transition: 50ms cubic-bezier(0, 0, 1, 1) opacity; opacity: 1; background: rgb(255 255 255 / 9%); } .disabled { cursor: not-allowed; user-select: none; } .activableopac:active { opacity: .7; } .Context--overlays { position: fixed; top: 0; right: 0; width: 100%; perspective: 1000px; z-index: 106; height: 100%; } .Context--overlays.loading>.Boxed--Context---overlays { width: 100%; } .Backdrop--Context---overlays { height: 100%; opacity: .8; background: #0d1227; position: fixed; top: 0; width: 100%; right: 0; overflow: hidden; z-index: -1; } .inner--Context---overlays *::-webkit-scrollbar { width: 8px; height: 4px; } .inner--Context---overlays *::-webkit-scrollbar-thumb { background: rgb(255 255 255 / 9%); border-radius: 3px; } .inner--Context---overlays *::-webkit-scrollbar-track { background: transparent; } .Parent-Boxed--Context---overlays { position: relative; transform: translate(0%, -50%); top: 50%; background: #232848; box-shadow: 0 12px 28px 0 rgb(0 0 0 / 20%), 0 2px 4px 0 rgb(0 0 0 / 10%), inset 0 0 0 1px #a7b0ea12; border-radius: 8px; transition: 200ms all cubic-bezier(0, 0, 1, 1); } .Parent-Boxed--Context---overlays.choosing--tool { overflow: hidden; height: 485px; max-height: calc(100vh - 50px); } .Parent-Boxed--Context---overlays.choosing--tool>.Boxed--Context---overlays { transform: translate(100%, 0); } .Parent-Boxed--Context---overlays>.Boxed--Context---overlays--extension.choosed--tool { transform: translate(0); } .Boxed--Context---overlays { min-width: 400px; position: relative; transition: .3s all ease; direction: rtl; margin: 0 auto; max-height: calc(100% - 50px); } .title--Context---overlays { height: 60px; padding-left: 60px; border-bottom: 1px solid rgb(255 255 255 / 5%); padding-right: 16px; position: relative; } .title--Context---overlays>strong { display: inline-block; vertical-align: middle; line-height: 60px; font-size: 16px; } .title--Context---overlays>strong.center { display: block; text-align: center; margin-left: -44px; font-size: 18px; } @keyframes loaderbg { 0% { opacity: 0; } 100% { opacity: 1; } } .title--Context---overlays>loader:after { content: ''; position: absolute; top: 0; right: 0; opacity: 0; width: 100%; height: 100%; background: rgb(255 255 255 / 9%); border-radius: 50px; animation: loaderbg 2s ease infinite; } .Loading--Context---overlays>em:after { content: ''; position: absolute; top: 0; right: 0; opacity: 0; width: 100%; height: 100%; background: rgb(255 255 255 / 9%); border-radius: 50px; animation: loaderbg 2s .4s ease infinite; } .Loading--Context---overlays>em:last-child:after { animation: loaderbg 2s .4s ease infinite; } .title--Context---overlays>loader { display: block; height: 22px; background: #2E2F31; border-radius: 50px; margin: 0 auto; width: 120px; position: absolute; top: 50%; transform: translate(0, -50%); right: 16px; } span.Close--title---Context----overlays { position: absolute; width: 36px; height: 36px; border-radius: 50%; background: rgb(255 255 255 / 10%); top: 12px; left: 16px; text-align: center; color: #A8ABAF; line-height: 40px; font-size: 24px; cursor: pointer; } span.Close--title---Context----overlays:after { background: rgb(255 255 255 / 9%); position: absolute; top: 0; right: 0; width: 100%; opacity: 0; content: ''; height: 100%; border-radius: 50%; transition: 200ms all cubic-bezier(0, 0, 1, 1); } .inner--Context---overlays { padding: 16px; position: relative; min-height: 110px; } .Boxed--Context---overlays--extension>.inner--Context---overlays { height: calc(100% - 10px); padding: 0; } .Boxed--Context---overlays--extension>.inner--Context---overlays>svg { width: 50px; height: auto; } .inner--Context---overlays .separator { display: block; margin: 20px 0; height: 1px; background: rgb(255 255 255 / 9%); } .inner--Context---overlays>.alert-danger { background: #be4b49; border-radius: 4px; padding: 7px 16px; } .Loading--Context---overlays {} .Loading--Context---overlays>em { display: block; height: 22px; background: #292e52; border-radius: 50px; margin-bottom: 10px; position: relative; } .Loading--Context---overlays>em:last-child { width: 190px; margin-bottom: 0; } .inner--Context---overlays form.Checking:after { content: ''; position: absolute; top: 0; right: 0; width: 100%; height: 100%; z-index: 1; backdrop-filter: blur(3px); transform: scale(1.02); background-color: #232848d9; } .inner--Context---overlays form { position: relative; width: 410px; max-width: 100%; padding-top: 110px; } .form--waiting {} .inner--Context---overlays form>button { width: 100%; height: 50px; border: 0; color: white; background: #5367ff; border-radius: 18px; font-family: Tajawal; padding-bottom: 2px; cursor: pointer; margin-top: 5px; font-size: 16px; font-weight: bold; } .inner--Context---overlays form>div:not(.loader--Context---overlays) { margin-bottom: 10px; position: relative; } .inner--Context---overlays form>div.two--inputs { display: flex; margin: 0px -5px 10px; flex-wrap: wrap; } .inner--Context---overlays form>div.two--inputs[aria-describe]:before { content: Attr(aria-describe); display: block; flex: 1; min-width: 100%; padding: 7px 5px 7px; font-weight: bold; } .inner--Context---overlays form>div.two--inputs>div { margin: 0px 5px; flex: 1; position: relative; } .inner--Context---overlays form>div.two--inputs>div>label { display: block; padding-left: 10px; } .inner--Context---overlays form>div.two--inputs>div>label>span { vertical-align: middle; padding-right: 5px; font-size: 18px; } .inner--Context---overlays form>div.two--inputs>div>label>input { width: 15px; height: 15px; vertical-align: middle; } .inner--Context---overlays form>div.two--inputs>div>i.fa-caret-down { position: absolute; top: 50%; left: 10px; transform: translate(0, -50%); color: #d2d5e8; margin-top: 1px; pointer-events: none; } .inner--Context---overlays form>div.two--inputs>div>select { height: 36px; border: 0; cursor: pointer; vertical-align: middle; width: 100%; border-radius: 8px; padding: 0px 16px 1px; background: #bdc4ec21; font-size: 15px; color: #fff; font-family: Tajawal; -webkit-appearance: none; } .inner--Context---overlays form>div.two--inputs>div>select:hover { background: #464748; } .inner--Context---overlays form>div.two--inputs>div>select>option { color: white; } .inner--Context---overlays form>div>#ShowPassword {} .inner--Context---overlays form>div input:not([type="radio"]) { height: 50px; border: 0; vertical-align: middle; width: 100%; border-radius: 8px; padding: 0px 16px; background: #bdc4ec21; font-size: 16px; color: white; font-family: Tajawal; } .inner--Context---overlays form>div input:focus { background: #ffffff17; } .inner--Context---overlays form>div input::placeholder { color: #d2d5e8; } a.reset--password { display: block; text-align: center; font-size: 12px; line-height: 100%; color: #d2d5e8; } a.facebook--buttons-collection { display: block; background: #1877f2; border-radius: 18px; color: white; height: 48px; line-height: 48px; flex: 1; font-size: 15px; text-align: center; } a.signup--buttons-collection { display: block; background: #5cad4b; border-radius: 18px; color: white; height: 48px; line-height: 48px; font-size: 15px; text-align: center; padding: 0px 20px; margin-right: 14px; } a.login--buttons-collection { display: block; background: #5367ff; border-radius: 18px; color: white; height: 48px; line-height: 48px; font-size: 15px; text-align: center; padding: 0px 20px; margin-right: 14px; } a.facebook--buttons-collection>i { vertical-align: middle; padding: 0px 0 0 7px; font-size: 16px; } div.buttons--loginform { margin-bottom: 0 !important; display: flex; } .loader--Context---overlays { position: absolute; top: 50%; right: 50%; transform: translate(50%, -50%); z-index: 5; text-align: center; color: #5acc58; } .loader--Context---overlays>i.fa-check-circle { font-size: 100px; } .loader--Context---overlays>i { font-size: 40px; } .loader--Context---overlays.Error { color: #ff6262; } necessary { position: absolute; top: 50%; left: 16px; border-radius: 50%; transform: translate(0, -50%); color: #ff8080; font-size: 11px; pointer-events: none; } necessary:after { content: Attr(data-tooltip); } .inner--Context---overlays .alert.alert-danger { font-size: 14px; line-height: 21px; color: #ffa3a3; margin-bottom: 15px !important; } form#SignupForm>button { background: #5cad4b; margin-bottom: 0; } .inner--Context---overlays form#SignupForm { width: 400px; } .inner--Context---overlays form>div.two--inputs.noneflex { display: block; } .inner--Context---overlays form>div.two--inputs.noneflex>div { display: inline-block; } .parent--popover { position: fixed; top: 100%; text-align: right; z-index: 10; max-width: 290px; left: 0; min-width: 280px; box-shadow: 0 12px 28px 0 #0003, 0 2px 4px 0 #0000001a, inset 0 0 0 1px #a7b0ea12; border-radius: 8px; margin-top: 3px; background: #232848; z-index: 104; } .parent--notifications::-webkit-scrollbar { width: 6px; height: 4px; } .parent--notifications::-webkit-scrollbar-thumb { background: #ffffff17; border-radius: 3px; } .parent--notifications::-webkit-scrollbar-track { background: transparent; } profiletabs>.profiletabs--sett .parent--popover {} .parent--popover.minipopover { width: 344px; margin-top: 0; position: absolute; } .options--leftside-user .parent--popover { position: fixed; } .inner--parent---popover { padding: 8px; position: relative; } .inner--parent---popover.withouticons>div { font-weight: bold; font-size: 14px; padding: 5px 8px; cursor: pointer; } .inner--parent---popover>.showbox { padding: 70px 0; } .inner--parent---popover divider { margin: 8px 8px; } .userhead--parent---popover { padding: 8px; border-radius: 8px; background: #bdc4ec21; margin-bottom: 8px; } .avatar-userhead--parent---popover { width: 44px; height: 44px; display: inline-block; z-index: 1; position: relative; margin-left: 12px; vertical-align: middle; } .avatar-userhead--parent---popover>.unknown--avatar { line-height: 46px; font-size: 20px; } .avatar-userhead--parent---popover img { width: 100%; } .details-userhead--parent---popover { max-width: calc(100% - 72px); display: inline-block; vertical-align: middle; position: relative; z-index: 1; line-height: 100%; } .details-userhead--parent---popover>strong { line-height: 1.1765; word-break: break-word; font-size: 16px; margin-bottom: 2px; display: block; color: #dddfe4; } .details-userhead--parent---popover>describe { display: block; font-size: 12px; color: #d2d5e8; } divider { border-width: 0; display: block; position: relative; line-height: 100%; font-family: inherit; height: 1px; background: rgb(255 255 255 / 8%); } .button-icon--parent---popover { width: 36px; height: 36px; border-radius: 36px; background: #bdc4ec21; line-height: 38px; text-align: center; display: inline-block; vertical-align: middle; margin-left: 12px; color: #d2d5e8; } .button--parent---popover { border-radius: 8px; padding: 8px; line-height: 100%; color: #dddfe4; cursor: pointer; } .button--parent---popover.button--parent---wecimaplus { background: #2c86fd; color: white; padding: 18px 18px; } .button--parent---popover>i.fa-chevron-left { position: absolute; top: 50%; color: #d2d5e8; left: 8px; transform: translate(0, -50%); } .details-icon--parent---popover>strong { display: block; line-height: 100%; word-break: break-word; font-size: .9375rem; } .button--parent---popover.button--parent---wecimaplus .details-icon--parent---popover>strong { font-size: 20px; margin-bottom: 8px; } .button--parent---popover.button--parent---wecimaplus .details-icon--parent---popover>p { font-size: 14px; } .details-icon--parent---popover>describe { font-size: .8125rem; color: #d2d5e8; } .details-icon--parent---popover { max-width: calc(100% - 72px); display: inline-block; vertical-align: middle; line-height: 100%; padding: 2px 0; } .switch-mode---popover { position: absolute; width: 52px; height: 28px; border-radius: 50px; background: #5367ff; top: 50%; transform: translate(0, -50%); left: 8px; } .switch-mode---popover>em { position: absolute; width: 24px; height: 24px; border-radius: 50%; background: white; left: 2px; top: 2px; } .OverParent-Boxed--Context---overlays { position: absolute; top: 0; right: 50%; height: 100%; transform: translate(50%, 0); } .softbutton--popover { border-radius: 4px; font-weight: normal; padding: 6px 8px; display: block; color: #dddfe4; } .softbutton--popover>i { text-align: center; vertical-align: middle; font-size: 18px; width: 29px; margin-top: 0px; margin-left: 6px; color: #d2d5e8; } .softbutton--popover>i.fa-calendar-star { font-size: 20px; } confirmation { position: fixed; top: 60px; width: 100%; right: 0; background: #0006; z-index: 101; padding: 6px 16px; } confirmation>span { display: inline-block; line-height: 48px; color: white; font-size: .9375rem; font-weight: bold; } confirmation>span>i { vertical-align: middle; font-size: 18px; margin-left: 12px; float: right; line-height: 48px !important; } confirmation>ul { float: left; padding: 6px 0; } confirmation>ul>li { display: inline-block; vertical-align: top; height: 36px; cursor: pointer; margin-right: 8px; border-radius: 6px; color: white; font-size: 14px; line-height: 36px; font-weight: bold; padding: 0px 40px; } confirmation>ul>li.close { background: #bdc4ec21; } confirmation>ul>li.confirm { background: #5367ff; } ul.grid--photoslibrary {} ul.grid--photoslibrary>li { margin-bottom: 12px; } ul.grid--photoslibrary>li>strong { display: block; margin-bottom: 8px; font-size: 1.0625rem; font-weight: normal; } ul.grid--photoslibrary>li>ul.list--item--grid--photoslibrary { margin: 0px -4px; } ul.grid--photoslibrary>li>ul.list--item--grid--photoslibrary>li:first-child span { border-radius: 0 8px 8px 0; } ul.grid--photoslibrary>li>ul.list--item--grid--photoslibrary>li:first-child:after { border-radius: 0 8px 8px 0; } ul.grid--photoslibrary>li>ul.list--item--grid--photoslibrary>li:last-child:after { border-radius: 8px 0 0 8px; } ul.grid--photoslibrary>li>ul.list--item--grid--photoslibrary>li:last-child span { border-radius: 8px 0 0 8px; } ul.grid--photoslibrary>li>ul.list--item--grid--photoslibrary>li { display: inline-block; width: calc(16.666666666666668% - 8px); height: 0; vertical-align: top; position: relative; margin: 0px 4px 8px; padding-top: 18%; } ul.grid--photoslibrary.widegrid>li>ul.list--item--grid--photoslibrary>li { width: calc(33.3333333333% - 8px); } ul.grid--photoslibrary.widegrid>li>ul.list--item--grid--photoslibrary>li span { border-radius: 0; } ul.grid--photoslibrary>li>ul.list--item--grid--photoslibrary>li>a { display: inline-block; vertical-align: top; position: absolute; top: 0; right: 0; width: 100%; height: 100%; } ul.grid--photoslibrary>li>ul.list--item--grid--photoslibrary>li span { display: block; height: 100%; position: absolute; background-size: cover; background-position: center; background-repeat: no-repeat; top: 0; right: 0; width: 100%; height: 100%; } ul.grid--photoslibrary>li:last-child { margin-bottom: 0; } .croppie-container { width: 100%; height: 460px; } .Preview--Context---overlays { position: absolute; top: 0; right: 0; width: 100%; background: #232848; height: 100%; box-shadow: 0 12px 28px 0 #0003, 0 2px 4px 0 #0000001a, inset 0 0 0 1px #a7b0ea12; border-radius: 8px; z-index: 10; } .croppie-container .cr-image { z-index: -1; position: absolute; top: 0; left: 0; transform-origin: 0 0; max-height: none; max-width: none; } .croppie-container .cr-boundary { position: relative; overflow: hidden; margin: 0 auto; z-index: 1; width: 100%; height: 100%; } .croppie-container .cr-viewport, .croppie-container .cr-resizer { position: absolute; margin: auto; top: 0; box-shadow: 0 0 0 330px #3e4042d6; bottom: 0; right: 0; left: 0; border-radius: 50%; z-index: 0; } .croppie-container .cr-resizer { z-index: 2; box-shadow: none; pointer-events: none; } .croppie-container .cr-resizer-vertical, .croppie-container .cr-resizer-horisontal { position: absolute; pointer-events: all; } .croppie-container .cr-resizer-vertical::after, .croppie-container .cr-resizer-horisontal::after { display: block; position: absolute; box-sizing: border-box; border: 1px solid black; background: #fff; width: 10px; height: 10px; content: ''; } .croppie-container .cr-resizer-vertical { bottom: -5px; cursor: row-resize; width: 100%; height: 10px; } .croppie-container .cr-resizer-vertical::after { left: 50%; margin-left: -5px; } .croppie-container .cr-resizer-horisontal { right: -5px; cursor: col-resize; width: 10px; height: 100%; } .croppie-container .cr-resizer-horisontal::after { top: 50%; margin-top: -5px; } .croppie-container .cr-original-image { display: none; } .croppie-container .cr-vp-circle { border-radius: 50%; } .croppie-container .cr-overlay { z-index: 1; position: absolute; cursor: move; touch-action: none; } .croppie-container .cr-slider-wrap { width: 75%; margin: 15px auto; text-align: center; } .croppie-result { position: relative; overflow: hidden; } .croppie-result img { position: absolute; } .croppie-container .cr-image, .croppie-container .cr-overlay, .croppie-container .cr-viewport { -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); } .cr-slider { -webkit-appearance: none; width: 80%; max-width: 100%; padding-top: 8px; padding-bottom: 8px; background-color: transparent; } .cr-slider::-webkit-slider-runnable-track { width: 100%; height: 4px; background: #ffffff14; border: 0; border-radius: 3px; } .cr-slider::-webkit-slider-thumb { -webkit-appearance: none; border: none; height: 20px; width: 20px; cursor: pointer; border-radius: 50%; background: #ddd; margin-top: -8px; } .cr-slider:focus { outline: none; } .cr-slider::-moz-range-track { width: 100%; height: 3px; background: rgba(0, 0, 0, 0.5); border: 0; border-radius: 3px; } .cr-slider::-moz-range-thumb { border: none; height: 16px; width: 16px; border-radius: 50%; background: #ddd; margin-top: -6px; } .cr-slider:-moz-focusring { outline: 1px solid white; outline-offset: -1px; } .cr-slider::-ms-track { width: 100%; height: 5px; background: transparent; border-color: transparent; border-width: 6px 0; color: transparent; } .cr-slider::-ms-fill-lower { background: rgba(0, 0, 0, 0.5); border-radius: 10px; } .cr-slider::-ms-fill-upper { background: rgba(0, 0, 0, 0.5); border-radius: 10px; } .cr-slider::-ms-thumb { border: none; height: 16px; width: 16px; border-radius: 50%; background: #ddd; margin-top: 1px; } .cr-slider:focus::-ms-fill-lower { background: rgba(0, 0, 0, 0.5); } .cr-slider:focus::-ms-fill-upper { background: rgba(0, 0, 0, 0.5); } .cr-rotate-controls { position: absolute; bottom: 5px; left: 5px; z-index: 1; } .cr-rotate-controls button { border: 0; background: none; } .cr-rotate-controls i:before { display: inline-block; font-style: normal; font-weight: 900; font-size: 22px; } .picturecropping--inner--Context---overlays { min-width: 700px; margin: -16px -16px; padding: 16px; overscroll-behavior: contain; overflow: auto; max-height: calc(100vh - 80px); } .picturecropping--inner--Context---overlays>divider { margin: 0px -16px 16px; } .cropping--inner---Context----overlays { margin: 0px -16px 50px; background: #3e4042; padding: 0px 16px; } .TextareaProfile { position: relative; margin-bottom: 8px; } .TextareaProfile>strong { display: block; line-height: 100%; position: absolute; top: 16px; transition: 50ms cubic-bezier(0, 0, 1, 1) all; right: 16px; font-size: 20px; font-weight: normal; color: #d2d5e8; } .TextareaProfile textarea:focus+strong { font-size: 14px; color: #5367ff; } .TextareaProfile textarea { width: 100%; border: 1px solid #bdc4ec21; -webkit-appearance: none; resize: none; background: transparent; padding: 36px 16px 16px 16px; color: white; min-height: 82px; font-size: 15px; border-radius: 8px; font-family: Tajawal; } .TextareaProfile textarea>strong {} .TextareaProfile textarea:hover { border-color: var(--primary-color); } .TextareaProfile textarea:focus { border-color: #5367ff; } .privacy--inner--Context---overlays { color: #d2d5e8; padding-bottom: 9px; font-size: 17px; } .privacy--inner--Context---overlays i { vertical-align: bottom; margin-left: 5px; font-size: 24px; } .scroll--addpost--context { margin-bottom: 12px; margin: 0px 0; padding: 0px; position: relative; } .scroll--addpost--context.HasImage>.addpost--context>.addpost-input--context { min-height: auto; max-height: inherit !important; } .scroll--addpost--context.HasImage>.addpost--context>.addpost-input--context>.AddCommentEmotes {} .Boxed--Context---overlays--extension { min-width: 400px; transition: .3s all ease; direction: rtl; margin: 0 auto; max-height: calc(100% - 50px); position: absolute; top: 0; right: 0; height: 100%; width: 100%; transform: translate(-100%, 0); } .Boxed--Context---overlays--extension>.title--Context---overlays { text-align: center; padding: 0; } .Boxed--Context---overlays--extension>.title--Context---overlays>.save--posttools { width: 36px; height: 36px; background: #bdc4ec21; border-radius: 36px; margin: 12px; font-size: 17px; line-height: 38px; cursor: pointer; color: #d2d5e8; position: absolute; top: 0; right: 0; } .Boxed--Context---overlays--extension>.title--Context---overlays>strong { font-size: 19px; } .search--mention--posttools { margin: 0; padding: 8px 16px; border-bottom: 1px solid #ffffff0d; } .search--mention--posttools>.input--search--mention--posttools { display: inline-block; vertical-align: middle; height: 36px; border-radius: 36px; background: #bdc4ec21; padding: 0px 12px; width: calc(100% - 48px); margin-left: 8px; } .search--mention--posttools>span { vertical-align: middle; width: 40px; display: inline-block; height: 36px; border-radius: 36px; text-align: center; color: #5367ff; line-height: 36px; cursor: pointer; font-weight: bold; } .search--mention--posttools>.input--search--mention--posttools>input { display: inline-block; background: transparent; border: 0; font-size: 14px; font-family: Tajawal; padding: 8px 12px; width: calc(100% - 18px); color: white; } .search--mention--posttools>.input--search--mention--posttools>input:focus::placeholder { opacity: .6; } .search--mention--posttools>.input--search--mention--posttools>input::placeholder { color: #d2d5e8; } .search--mention--posttools>.input--search--mention--posttools>i { vertical-align: middle; font-size: 18px; color: #d2d5e8; } .list--mention--posttools { padding: 8px; height: calc(100% - 54px); overflow: auto; overscroll-behavior: contain; position: relative; } .list--mention--posttools>ul>svg { position: relative; width: 50px; margin: 60px auto 0; display: block; } .list--mention--posttools>strong { font-weight: bold; padding: 0px 8px; font-size: 12px; color: #d2d5e8; } .Parent-Boxed--Context---overlays+.Parent-Boxed--Context---overlays { position: absolute; right: 50%; transform: translate(50%, -50%); } .OverParent-Boxed--Context---overlays.addpost--overparent { overflow: hidden; } .Wecima--overlay { position: fixed; top: 0; right: 0; left: 0; bottom: 0; background: #0c0f21a1; z-index: 100; } .button--parent---popover.-telegram { --color: #27A0DD; } .button-icon--parent---popover { font-size: 19px; background: var(--color); color: white; } .button--parent---popover.-mycima i { font-family: Bevan; font-style: normal; } .button--parent---popover.-mycima { --color: var(--uicolor); } .button--parent---popover.-facebook { --color: #1877F2; } .button--parent---popover.-twitter { --color: #1DA1F2; } inner--wecimaactivities { background: transparent; padding: 0; border-radius: 0; } inner--wecimaactivities>a { display: flex; margin-bottom: 5px; align-items: center; padding: 4px 4px; border-radius: var(--miniradius); } inner--wecimaactivities>a>div.-poster { width: 44px; padding-top: 56px; background-image: var(--poster); background-size: cover; background-position: center; border-radius: var(--miniradius); } inner--wecimaactivities>a>p { flex: 1; font-size: 14px; line-height: 1.5; color: white; padding: 0 10px; } inner--wecimaactivities>a>i { color: #ff7e33; font-weight: 300 !important; margin-inline-end: 5px; } .-wecima-alert { display: flex; background: linear-gradient(45deg, #681919, #812f10); border-radius: 6px; padding: 10px 20px 12px; min-height: 50px; align-items: center; font-size: 18px; font-weight: 400; margin: 0 20px; color: white; margin-bottom: 10px; } .-wecima-alert>p { flex: 1; } .-wecima-alert>i { width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; margin-inline-end: 12px; font-size: 20px; font-weight: 300; } ul.WatchServersList img { width: 34px; height: 34px; vertical-align: bottom; border-radius: 68px; } @media only screen and (max-width: 775px) { div#filtered-posts { display: flex; flex-wrap: wrap; padding: 0 2px; } }