@charset "UTF-8";
.primary-color,
a,
body {
    -webkit-font-smoothing: antialiased
}

.actions ul,
body,
html {
    padding: 0;
    margin: 0
}
header.blockedbar .inner .d_left,header.blockedbar .inner .d_right,header.blockedbar .inner .d_center {
    display: flex;
    JUSTIFY-ITEMS: left;
}

.top-trending {
    padding: 10px;
    margin-top: 10px
}

.top-trending h2 {
    font-weight: 300;
    font-family: HelveticaNeue-Light, "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
    font-size: 23px
}

.topviewed-a {
    display: block;
    align-items: center;
    position: relative;
    border-bottom: 1px solid #10234029;
    padding-bottom: 8px;
    margin-bottom: 7px;
}

.topviewed-a:last-child {
    border: none;
    margin-bottom: none
}

.a-number {
    width: 40px;
    height: 40px;
    line-height: 35px;
    text-align: center;
    margin: 0;
    padding: 0;
    background: rgb(0 24 58);
    color: rgb(255 255 255);
    border-radius: 50%;
    font-size: 18px;
    position: absolute;
    right: 0;
    top: calc(50% - 25px);
    font-weight: 600;
    border: 2px #072e54 solid;
}

.a-info {
    display: flex;
    padding-right: 55px
}

.timeline {
    width: 100%;
    margin-top: 15px;
    margin-bottom: 15px;
    flex-direction: column;
    display: none;
    list-style: none;
    text-align: right
}

.topviewed_author {
    font-size: 11px;
    color: var(--color-gray)
}

.topviewed_title {
    width: auto;
    font-size: 13px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-bottom: 4px;
    min-height: 30px;
    font-weight: 400
}

.topviewed_title a {
    color: var(--color-black);
    text-decoration: none;
    line-height: 20px;
    font-size: 14px;
    font-weight: 400;
}

.topviewed_title a:hover {
    transition: .2s ease-out;
    background: #f2f2f2
}

.ad_336x2802 {
    margin: 0 auto;

    width:336px;
    height:280px;
    background: #fff;
    background: #fff;
    border-width: 0;
    padding: 0;
    position: relative;
    overflow: hidden;
    border-radius: 5px;
    border-radius: max(0px, min(5px, calc((100vw - 2px - 100%) * 9999)))/5px;
    box-shadow: 0 1px 2px rgb(0 0 0 / 20%);

}
.inboard-adunit-container div div div div iframe {
    width:100% !important;
    height:100% !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 220px;

}
.inboard-adunit-container .ad_possible_location {
padding:0 !important;
margin:0 !important;
padding: 0 !important;
    margin: 0 !important;
    min-height: 220px;
}
.inboard-adunit-container div div div div  {
    width:100% !important;
    height:100% !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 220px;

}
.inboard-adunit-container div div div   {
    width:100% !important;
    height:100% !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 220px;

}
.ad_300x2502 {
    margin: 0 auto;

    width:300px;
    height:250px;
    margin-bottom:25px;
    margin-top:25px;
    background: #fff;
    background: #fff;
    border-width: 0;
    padding: 0;
    position: relative;
    overflow: hidden;
    border-radius: 5px;
    border-radius: max(0px, min(5px, calc((100vw - 2px - 100%) * 9999)))/5px;
    box-shadow: 0 1px 2px rgb(0 0 0 / 20%);
}
.ad_320x502{
    margin: 0 auto;

    width:320px;
    height:50px;
    margin-bottom:25px;
    margin-top:25px;
    background: #fff;
    background: #fff;
    border-width: 0;
    padding: 0;
    position: relative;
    overflow: hidden;
    margin-bottom: 15px;
    border-radius: 5px;
    border-radius: max(0px, min(5px, calc((100vw - 2px - 100%) * 9999)))/5px;
    box-shadow: 0 1px 2px rgb(0 0 0 / 20%);
}
.ad_1140x1302{

    width:1288px;
    padding:15px;
    margin-bottom:25px;
    
    border-width: 0;
    position: relative;
    overflow: hidden;
    margin-bottom: 25px;
    margin:0 auto;
    margin-top:25px;
    border-radius: max(0px, min(5px, calc((100vw - 2px - 100%) * 9999)))/5px;
}
.ad_possible_location {
    border-radius: max(0px, min(5px, calc((100vw - 2px - 100%) * 9999)))/5px;

}
.section .ad_possible_location {
    margin:0 auto 
}
.ad_possible_location iframe,.ad_possible_location  .adunit {
    margin:0 auto
}
.option .fa-codepen,
.section .ri-arrow-drop-down-line,
.section .widget-forecast-icon,
body {
    color: #000
}
.hotTicker-holder {
    display: inline-flex;
    padding-bottom:10px;

}
ul.hotTicker {
    display: block;
    list-style: none; 
    height: 200px; 
    overflow: hidden; 
    margin: 0 auto; 
    width: 100%; 
    top:10px; 
    left: 0%; 
    position: relative; 
    padding:0px;

    margin:10px
   }
    
    ul.hotTicker li {
    display: block; 
    line-height: 20px; 
    overflow: hidden; 
    font-size: 14px;
    background-color: #ffffff;
    

    }
    ul.hotTicker li .tick {
        display: flex;
        flex-direction: row;
        margin-bottom:10px;
        font-family: system-ui;
        border-bottom:1px solid  #e6e6e6

    }
    ul.hotTicker li .tick a{
        display: flex;
        font-size: 90%;
        color: #000;
        position: relative;
        cursor: pointer;
        padding:3px;
        padding-right:10px;
        font-size:13px;

        font-family: system-ui;


    }
    ul.hotTicker li .tick span{
        color:#000;
        padding:10px;

    }
.moredata:after,
.theme3_bg,
body {
    -moz-osx-font-smoothing: grayscale
}

*,
.followMeBar2.fixed,
.product-carousel-container,
.searchbar {
    box-sizing: border-box
}

.card .menu-content::after,
.css-mine,
.example-2 .header::after,
.tie-wrap,
footer h4 {
    clear: both
}

:root {
    --bodywash: #f2f2f2;
    --graybackground: #e4e6eb;
    --primerytext: #050505;
    --graytext: #65676B;
    --primerybutton: #1B74E4;
    --red-flat-bg: #d2122e;
    --red-flat2-bg: #f7444e;
    --blue-flat2-bg: #002c3e;
    --blue-flat-bg: #00308f;
    --blue-flat-bg-ticker: #2c3968;
    --red-flat-bg-category: #d2122e;
    --red-flat-text-category: #ffffff;
    --color-settings-color: #757575;
    --color-settings-bg: #f3f5f9;
    --color-settings-border: #dbdade;
    --color-bg-primary: #d0d6df;
    --color-bg-primary-offset: #f1f3f7;
    --color-bg-secondary: #fff;
    --color-text-primary: #3a3c42;
    --color-text-primary-offset: #898c94;
    --color-orange: #dc9960;
    --color-green: #1eb8b1;
    --color-purple: #657cc4;
    --color-black: var(--color-text-primary);
    --color-red: #d92027;
    --main-section: #d2122e;
    --main-section-secondry: #0030ff;
    --color-black: #3b3c40;
    --color-gray: #8d9ba4;
    --bg-flat-gray: #f5f5f5;
    --color-on-gray: #a2a2a2;
    --border-gray: #e6e6e6;
    --icon-color-b: #4b4c50;
    --icon-color-w: #FFF;
    --icon-color-m: #fe6d6d;
    --More-color: #161616;
    --color-black: #161616;
    --bg-ticker: #f00;
    --bg-simi: #0030ff;
    --bg-simi-sec: #d2122e;
    --primary: #fbfcfc;
    --active: #f1f1f1;
    --secondary: #767777;
    --grey: #8a8b8b;
    --b-pad: 10px;
    --s-pad: 5px;
    --bg: rgb(50, 50, 50);
    --c-text-primary: #191919;
    --c-text-secondary: #737374;
    --c-border-primary: #ccc;
    --c-bg-body: #ccc;
    --c-bg-primary: #fff;
    --c-bg-secondary: #d4d8dd;
    --c-bg-button: #fff
}

.onright {
    margin-right: 0;
    padding-right: 0;
    margin-left: 35px
}

.alarab_helpers {
    font-family: system-ui;
    line-height: 1.5;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background-color: var(--c-bg-body);
    color: var(--c-text-primary);
    font-size: 14px
}

.homepage-header,
.stickybanner iframe {
    background-color: #fff
}

:root.dark-theme {
    --c-text-primary: #eee;
    --c-text-secondary: #d3d5db;
    --c-border-primary: #454545;
    --c-bg-primary: #323339;
    --c-bg-secondary: #222128;
    --c-bg-button: #494a50
}

:root.black-theme {
    --c-text-primary: #edeeef;
    --c-text-secondary: #d4d7e1;
    --c-border-primary: #323232;
    --c-bg-primary: #1b1d23;
    --c-bg-secondary: #000001;
    --c-bg-button: #343844
}

#hero-slides #slides-cont .button:after,
#hero-slides #slides-cont .button:hover:before,
img[data-src] {
    opacity: 0
}

html {
    height: -webkit-fill-available;
    --gray-darkest: #24292e;
    --gray-darker: #2f363d;
    --gray-dark: #586069;
    --gray-light: #959da5;
    --gray-lighter: #e1e4e8;
    --gray-lightest: #fafbfc;
    --black: #000000;
    --white: #FFFFFF;
    --blue: #0AAFFF;
    --purple: #7551E9;
    --orange: #FF7D51;
    --pink: #ED63D2;
    --green: #2DCA73;
    --yellow: #FFC212;
    --bg: var(--gray-lighter);
    --text-color: var(--gray-darkest);
    --component-bg: var(--white);
    --component-border: var(--gray-lighter)
}

.carousel-cell {
    width: 100%;
    display: block;
    text-align: center;
    padding: 0
}

body {
    font-size: 1.8rem;
    -webkit-tap-highlight-color: transparent;
    direction: rtl;
    overflow-x: hidden;
    --slides-per-page: 2;
    background-color: var(--bodywash);
    caret-color: transparent !important
}

#body-barba {
    position: relative;
    width: 100%;
    font-family: system-ui;
    margin: 0 auto;
    max-width: 1288px;
    display: block;
    padding-top: 0
}

#barba-right {
    width: 338px;
    position: relative;
    float: left
}

.card input[type=checkbox],
.homepageindex #barba-right,
div.weather-widget-inner small.widget-forecast-icon-text:after {
    display: none
}

.ag-info_img-box img,
.homepageindex #barba-left,
.post_img a,
.ssc .w-100,
.thumb img {
    width: 100%
}

.scrollable-content {
    position: absolute;
    margin-left: 300px;
    color: #00f
}

.fixedtop {
    position: fixed;
    overflow-y: hidden;
    width: 338px;
    height: 100vh
}

.svg-inline--fa,
svg:not(:root).svg-inline--fa {
    overflow: visible
}

#barba-left {
    width: calc(100% - 373px);
    margin-left: 35px;
    transition: .2s;
    position: relative;
    float: right
}

.hrslides {
    position: relative;
    width: 80%;
    height: 725px;
    margin: 0 auto
}

#barba-wrapper {
    transition: .2s;
    overflow: hidden
}

.barba-container {
    width: 100%;
    display: contents
}

.homepage-header {
    top: 0;
    z-index: 10;
    background-size: 17%;
    left: 0;
    width: 100%;
    position: fixed;
    display: flex;
    flex-direction: column;
    height: auto;
    transition: .2s
}

div.weather-widget-inner {
    float: left;
    font-size: 19px;
    position: relative
}

div.weather-widget-inner a {
    float: left;
    font-size: 18px;
    font-family: system-ui;
    text-decoration: none;
    padding-right: 25px
}

.widget-forecast-icon {
    font-size: 22px;
    position: relative;
    font-weight: 600;
    float: right;
    line-height: 25px;
    margin-left: 3px
}

div.weather-widget-inner small {
    font-family: system-ui;
    display: -webkit-inline-box;
    position: relative;
    font-weight: 600
}

.section div.weather-widget-inner small {
    color: var(--color-gray)
}

div.weather-widget-inner small:after {
    content: "\B0"
}

div.weather-widget-inner small.widget-forecast-icon-text {
    font-family: system-ui;
    font-size: 14px;
    font-weight: 500 !important
}

.svg-inline--fa.fa-w-14 {
    width: .875em
}

.svg-inline--fa {
    display: inline-block;
    font-size: inherit;
    height: 1em;
    vertical-align: -.125em
}

.whether-link-dropdown-icon-firma {
    font-size: 25px;
    float: left;
    margin-top: 2px
}


.article_toolset {
    color: #fff;
    width: 100%;
    position: relative;
    min-height: 35px;
    display: flex
}

.article_toolset div.maincats_breadcrumb,
.article_toolset div:first-child,
.ssc .w-60 {
    width: 60%
}

.article_toolset div:last-child,
.ssc .w-40 {
    width: 40%
}

.article_toolset div:last-child button {
    color: var(--color-gray);
    font-size: 25px;
    margin: 6px 10px 0 4px;
    position: absolute;
    left: 60px
}

.toggle-box {
    display: grid;
    height: 20px;
    margin: 10px
}

.Ad_ready .ad_possible_location {
    border-radius: 5px;
    margin: 12px 10px;
    width: calc(100% - 20px);
    display: inline-block;
    position: relative;
    height: auto;
    background: #fff;
    box-shadow: 0 0 3px #ccc;
    padding: 15px 0
}

.Ad_ready .ad_possible_location .response_unit {
    height: 100px;
    background: #cacaca;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc
}

.ad-interstitial-body div,
.ad-interstitial-body iframe {
    width: 100% !important;
    height: 100% !important;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0
}

.ad-interstitial .ad-interstitial-body {
    position: relative;
    z-index: 1;
    height: 100%
}

button {
    background: 0 0;
    border: none
}

a {
    text-decoration: none
}

.action:focus,
.notfic .action:active,
:focus {
    outline: 0
}

.stickybanner {
    position: fixed;
    z-index: 24;
    bottom: 0;
    background: #fff;
    max-height: 65px;
    width: 100%;
    left: 0;
    right: 0
}

.stickybanner div.section {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0
}

.stickybanner iframe #animation_container,
.stickybanner iframe #animation_container canvas {
    position: absolute;
    display: block;
    background-color: #fff;
    width: 100%;
    height: 100%
}

.actions {
    padding: 10px;
    flex-direction: row-reverse;
    bottom: 0;
    position: absolute;
    width: 100%;
    display: flex;
    background: #f2f3f5;
    border-top: 1px solid #dfdfdf
}

.actions ul {
    display: block;
    display: flex;
    flex-direction: row;
    PADDING-TOP: 4PX
}

.buttons,
.buttons .button {
    align-items: center;
    display: flex
}

.actions ul li {
    padding-left: 15px;
    display: block
}

.actions ul li a {
    line-height: 35px;
    display: block
}

.actions ul li a i {
    color: #5c6676;
    line-height: 35px;
    display: block
}

.details {
    font-size: 13px;
    font-weight: 400;
    width: 50%;
    margin-top: 8px;
    line-height: 1.3;
    text-align: center
}

.buttons .message {
    background-color: #0060ff;
    color: #fff
}

.buttons .follow {
    background: linear-gradient(90deg, #fa3967 0, #fa9639 100%)
}

.buttons .button {
    justify-content: center;
    cursor: pointer;
    border-radius: 14px;
    padding-left: 12px;
    padding-right: 5px;
    margin-top: 3px
}

.buttons .button span {
    font-size: 16px;
    font-family: system-ui;
    margin-right: 8px
}

.buttons .button:first {
    margin-left: 0
}

.buttons .button svg {
    height: 35px;
    width: 35px;
    margin-right: 4px
}

.buttons .button i {
    font-size: 16px;
    padding: 5px
}

.usernamecard {
    background: 0 0;
    overflow: hidden;
    display: block;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px
}

.usernamecard .usernamecardheader {
    display: flex;
    justify-content: space-between;
    padding: 15px;
    height: 53px;
    background-size: cover;
    position: absolute;
    top: 0;
    left: 0
}

.usernamecard .usernamecardheader span.mdi {
    color: #222;
    cursor: pointer;
    font-size: 23px
}

.usernamecard main {
    display: flex;
    align-items: center;
    flex-direction: row;
    padding: 15px;
    background: #f2f3f5
}

.bckfff,
.menucontainer,
.menucontext,
.morerows,
.morerows tr {
    background: #fff
}

.usernamecard main img {
    height: 52px;
    border-radius: 50%;
    object-fit: cover;
    margin-left: 15px;
    border: 1px solid #000;
    padding: 1px
}

.usernamecard main p {
    font-size: 17px;
    font-weight: 400;
    color: #222;
    margin-bottom: 7px;
    font-family: system-ui;
    text-align: right
}

.usernamecard main h2 {
    font-size: 14px;
    color: rgba(36, 36, 36, .555);
    display: none
}

.usernamecard main .actions {
    margin-top: 14px;
    display: flex
}

.usernamecard main .actions button {
    font-family: inherit;
    border-radius: 40px;
    cursor: pointer;
    border: none
}

.usernamecard main .actions button.main {
    width: 110px;
    height: 32px;
    background: #5458f7;
    color: #fff;
    font-weight: 600;
    font-size: 14px;
    margin-right: 10px
}

.usernamecard main .actions button.main:hover {
    background-color: #6c70f8
}

.usernamecard main .actions button.secondary {
    width: 50px;
    height: 32px;
    background: #9597a1;
    display: flex;
    align-items: center;
    justify-content: center
}

.usernamecard main .actions button.secondary:hover {
    background-color: #a3a4ad
}

iframe canvas {
    width: 100% !important
}

.menucontext {
    width: 100%;
    padding-left: 5px
}

.holdmenucontext {
    scrollbar-width: thin;
    scrollbar-color: blue orange;
    position: absolute;
    width: 93%;
    background: #fff;
    HEIGHT: CALC(100% - 50PX);
    OVERFLOW: AUTO;
    padding-bottom: 90px;
    margin-top: 70px;
    overscroll-behavior: contain
}

.holdmenucontext::-webkit-scrollbar {
    width: 6px
}

.holdmenucontext::-webkit-scrollbar-track {
    background: #f5f5f5
}

.holdmenucontext::-webkit-scrollbar-thumb {
    background-color: #e6e6e6;
    border-radius: 20px
}

.menu-list {
    margin: 0;
    display: block;
    width: 100%;
    padding: 0
}

.menu-sub-list {
    display: none;
    padding: 8px;
    position: absolute;
    left: 100%;
    right: 0;
    z-index: 100;
    width: 100%;
    top: 0;
    flex-direction: column
}

.menu-button,
.menu-item {
    position: relative;
    display: flex
}

#upper-info,
.card-info,
.menu-button:hover+.menu-sub-list,
.menu-sub-list:hover {
    display: flex
}

.menu-button {
    border: 0;
    padding: 8px 40px 8px 38px;
    width: 100%;
    text-align: right;
    align-items: center
}

.menu-button span {
    font-size: 15px;
    color: #000;
    font-family: system-ui;
    font-weight: 600
}

.menu-button:hover {
    background-color: var(--color-bg-primary-offset)
}

.menu-button:hover i {
    color: var(--color-text-primary)
}

.menu-button i {
    margin-left: 12px;
    color: var(--color-text-primary-offset)
}

.menu-button i:nth-of-type(2) {
    margin-left: 0;
    position: absolute;
    left: 8px
}

.menu-button--delete:hover,
.menu-button--delete:hover i:first-of-type {
    color: var(--color-red)
}

.menu-button--orange i:first-of-type {
    color: var(--color-orange)
}

.menu-button--green i:first-of-type {
    color: var(--color-green)
}

.menu-button--checked i:nth-of-type(2),
.menu-button--purple i:first-of-type {
    color: var(--color-purple)
}

#artiheader h3,
.menu-button--black i:first-of-type {
    color: var(--color-black)
}

.menucontainer {
    width: 100%;
    height: calc(100% - 50px);
    border-left: 1px solid #ccc
}

.usernamenotficheader {
    position: absolute;
    left: 15px;
    top: 15px;
    z-index: 5
}

.sectionHoties {
    width: 100%;
    position: relative;
    padding: 0;
    margin: 0 0 5px;
    display: flex;
    flex-direction: column
}

.play_icon_2022 {
    position: absolute;
    font-size: 50px;
    left: 15px;
    bottom: 13px;
    color: #fff;
    line-height: 50px;
    text-shadow: -1px 1px 8px #00000040
}

.simi_main .play_icon_2022 {
    position: absolute;
    font-size: 50px;
    left: calc(50% - 25px);
    top: calc(50% - 25px);
    color: #fff;
    font-weight: 400;
    text-shadow: 0 1px 7px rgb(0 0 0 / 23%)
}

.regularitembigovertext figure .play_icon_2022 {
    position: absolute;
    font-size: 35px;
    left: 15px;
    top: 77%;
    color: #fff;
    z-index: 5
}

.parallax-slider img {
    width: 100vw;
    height: auto
}

.body span .play_icon_2022 {
    position: inherit;
    display: inline;
    font-size: 16px;
    margin-left: 8px;
    color: #e03e3e;
    line-height: 1;
    text-shadow: none
}

.main_Arti .status,
.simi_main .status {
    position: absolute;
    padding: 6px 18px;
    width: auto;
    color: #fff;
    bottom: 15px;
    right: 15px;
    z-index: 1;
    text-align: center;
    font-weight: 700;
    background-image: linear-gradient(45deg, #ff5969, #e03e3e);
    border-radius: 5px;
    border: 1px solid #332c2c54;
    font-size: 16px;
    font-family: system-ui;
    line-height: 21px;
    text-shadow: -1px 1px 8px #00000040
}

.regularitembigovertext .status,
.regularitemsmall .status {
    width: 20%;
    color: #fff;
    z-index: 5;
    font-weight: 700;
    background: #ff2323;
    line-height: 20px;
    padding: 2px 8px;
    position: absolute;
    font-size: 16px;
    text-align: center
}

.regularitembigovertext .status {
    top: 50%;
    right: 15px;
    border-radius: 2px;
    font-family: aljazeera;
    border: 1px solid #ff2525
}

.regularitemsmall .status {
    top: 0;
    left: 0;
    border-radius: 2px;
    border: 1px solid #ff2525
}

.ARTcont {
    display: flex;
    margin: 10px;
    padding-bottom: 9px;
    background-color: #fff;
    border-bottom: 1px solid #ddd
}

.img-container {
    width: 145px;
    padding: 0
}

.img {
    width: 100%;
    height: 100%;
    background-color: #dbdade
}

.stripe {
    background: #dbdade;
    height: 17px;
    margin-top: 13px
}

.medium-stripe,
.small-stripe {
    width: calc(100% - 20px)
}

.long-stripe {
    width: calc(100% - 120px)
}

#menu-mobile {
    display: none;
    position: absolute;
    z-index: 15;
    height: 100%
}

.search_mobile {
    width: 100%;
    position: relative;
    display: flex
}

.searchTerm_mobile {
    width: 100%;
    border: none;
    outline: 0;
    color: #000;
    line-height: 35px;
    font-size: 16px;
    font-family: system-ui;
    margin-right: 15px;
    background: 0 0;
    padding: 3px;
    height: auto
}

.searchTerm_mobile:focus {
    color: #797979
}

.searchButton_mobile {
    width: 40px;
    line-height: 29px;
    text-align: center;
    color: rgb(0 0 0);
    border-radius: 5px 0 0 5px;
    cursor: pointer;
    font-size: 20px;
    padding-top: 6px
}

.searchwrap {
    display: inline-block;
    width: calc(100% - 30px);
    margin: 15px 15px 0;
    border: 1px solid #f5f5f5;
    border-radius: 5px;
    background: #ededed
}

#bg-menu-mobile {
    width: 400px;
    height: calc(100% - 50px);
    position: fixed;
    right: -400px;
    z-index: 15;
    will-change: transform;
    top: 52px
}

.menu_padd {
    padding: 15px
}

.bolder {
    font-size: 17px;
    font-weight: 600 !important;
    font-family: system-ui;
    color: #d60000
}

.regular {
    font-size: 16px;
    font-weight: 400;
    font-family: system-ui;
    color: #222
}

#menu-mobile ul li:hover {
    color: #111;
    -webkit-transition: .1s ease-in-out;
    -moz-transition: .1s ease-in-out;
    transition: .1s ease-in-out
}

.nightmode,
.section .hom_cat_bar {
    transition: bottom .2s ease-in-out
}

.section {
    width: 100%;
    position: relative;
    padding: 0;
    margin: 0 0 15px;
    display: flex;
    flex-direction: column
}

.padding10,
.regularitemsmall.bloger .body {
    padding-right: 10px
}

.wdmm_washed {
    padding: 10px;
    visibility: visible;
    background: #fff;
    border-radius: 5px;
    border-radius: max(0px, min(5px, calc((100vw - 2px - 100%) * 9999)))/5px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .2)
}

.ag-grid_item:nth-child(odd) .ag-info_img-box,
.mega-ad .loadedadflick,
.nomargin,
.regularitemsmall figure,
.wdmm_washed .hom_cat_bar.black {
    margin: 0
}

.section ul {
    padding: 0;
    margin: 0;
    margin-top:10px;
}
.regularitembigovertext figure,.regularitembigovertext img {
    border-radius: 4px;

}
.section.classoptimizer {
    position: relative;
    margin-bottom: 0;
    display: block;
    height: 50px
}

.main-logo-icon-image path {
    fill: #f2f2f2
}

.footerlogo {
    margin-top: 17px;
    height: 33px
}

.footerlogo path {
    fill: var(--color-gray)
}

.exit-inboard-icon2 {
    position: absolute;
    line-height: 44px;
    cursor: pointer;
    display: block;
    height: 45px;
    font-size: 25px;
    color: #404040;
    border: 1px solid #d997a1;
    right: 10px;
    top: 10px;
    background: #ffeded;
    width: 45px;
    text-align: center
}

.exit-inboard-icon {
    top: 30px !important
}

.inboard-adunit-container {
    width: 100%;
    height: auto;
    color: #000;
    position: relative;
    text-decoration: none !important;
    text-align: center;
    margin: 0 auto;
   /* padding-top: 20px;
    padding-bottom: 20px*/
}

.padding10 {
    padding-left: 10px
}

.padding15 {
    padding-right: 15px;
    padding-left: 15px
}

.fixed {
    position: fixed;
    top: 0
}

.regularitembigovertext::before {
    content: "";
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .8) 100%, rgba(0, 0, 0, .9) 100%);
    position: absolute;
    bottom: 0;
    height: 38%;
    width: 100%;
    pointer-events: none;
    z-index: 2
}

.m_cat_img {
    display: block;
    top: 0;
    position: relative;
    padding-bottom: 71.42%;
    height: 0;
    overflow: hidden
}

.regularitembigovertext,
.regularitembigovertext figure {
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline
}

.m_cat_img img {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.regularitembigovertext .body {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    display: flex;
    -webkit-flex-direction: column-reverse;
    -moz-flex-direction: column-reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column;
    display: flex;
    z-index: 3
}

.m-button,
.react-parallax-content {
    position: relative
}

.regularitembigovertext .body span {
    color: var(--icon-color-w);
    font-size: 11px;
    font-family: system-ui;
    margin: 10px
}

.regularitembigovertext {
    position: relative;
    margin-bottom: 7px;
    font: inherit;
    display: flex
}

.moredata:after,
.theme3_bg,
.views-div-api::before {
    -webkit-font-smoothing: antialiased
}

.regularitembigovertext figure {
    width: 100%;
    margin: 0;
    font: inherit;
    height: auto;
    position: relative;
    z-index: 0;
    display: block
}

.regularitembigovertext .body strong,
.regularitembigovertext p strong {
    padding: 24px 0 0 8px;
    color: #fff;
    font-weight: 600;
    font-size: 23px;
    letter-spacing: 0;
    line-height: 10px;
    font-family: Tajawal;
    text-shadow: -3px 0 3px #000
}

.crinfo {
    text-align: right;
    line-height: 1.7;
    font-size: 16px;
    font-family: tajawal;
    font-weight: 600
}

.regularitembigovertext .body small,
.regularitembigovertext p small {
    color: #fff;
    display: block;
    margin: 4px 0 0;
    width: 65%;
    float: right
}

.regularitembigovertext .body small span,
.regularitembigovertext p small span {
    color: #fff;
    display: inline-block
}

.regularitembigovertext img {
    min-height: 260px;
    display: block;
    width: 100%
}

.regularitemsmall {
    display: grid;
    grid-template-columns: auto 120px;
    grid-template-rows: auto;
    align-items: center;
    padding: 8px 0;
    margin: 0 10px;
    border-bottom: 1px solid var(--border-gray);
    position: relative
}

#head_imp,
.madu {
    margin-top: 30px
}

.regularitemsmall.bloger {
    grid-template-columns: 70px auto
}

.regularitemsmall .body {
    -webkit-flex-direction: column-reverse;
    -moz-flex-direction: column-reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column;
    display: flex;
    padding-left: 10px
}

.regularitemsmall.bloger a img {
    border-radius: 50%;
    width: 70px;
    height: 70px;
    border: 2px var(--icon-color-b) solid
}

.regularitemsmall .body span {
    color: var(--color-gray);
    font-size: 12px;
    font-family: system-ui;
    margin-top: 6px;
    line-height: 15px;
    display: inherit
}

.regularitemsmall a img {
    display: block;
    position: relative
}

.regularitemsmall a {
    position: relative;
    display: contents;
    line-height: 1
}

.indicator-wrapper {
    position: fixed;
    top: 0;
    width: 100%;
    height: 3px;
    display: none;
    z-index: 22
}

.indicator {
    width: 100%;
    height: 100%;
    background-color: #f62828
}

.section .hom_cat_bar .float-title {
    position: absolute;
    background: 0 0;
    font-family: system-ui;
    font-size: 15px;
    line-height: 10px;
    top: 13px;
    right: 0;
    color: #FFF;
    font-weight: 600;
    PADDING-BOTTOM: 6PX;
    padding-right: 8px
}

.section .hom_cat_bar .float-title::before {

}

.moreicon {
    color: rgb(0 0 0 / 82%);
    position: absolute;
    left: 5px;
    top: calc(50% - 15px);
    font-size: 30px
}

.section .hom_cat_bar .fi-rr-angle-double-left {
    position: absolute;
    color: #2c2a2a;
    background: 0 0;
    font-size: 18px;
    left: 0;
    top: 13px
}

.followMeBar2 {
    background: #999;
    padding: 10px 20px;
    position: relative;
    color: #000
}

.followMeBar2.fixed {
    position: fixed;
    width: 100%;
    background-color: #000;
    color: #fff;
    z-index: 1000
}

.followMeBar2.fixed.absolute {
    position: absolute
}

.followWrap2 {
    height: 58px;
    visibility: visible;
    position: fixed;
    z-index: 10;
    background: #000;
    top: 0;
    width: 100%
}

.section .hom_cat_bar.bloger {
    background: linear-gradient(45deg, #f1f1f1, #fff);
}

.section .hom_cat_bar.bloger .float-title,
.section .hom_cat_bar.bloger .moreicon {
    color: var(--color-settings-bg)
}

.section .hom_cat_bar {
    color: #eee;
    height: 40px;
    -webkit-transition: background-color .2s ease-out;
    display: flex;
    position: relative;
    background:linear-gradient(45deg, #ff4343, rgb(255 0 47));
    padding: 2px 4px;
    display: block;
    font-size: 13px;
    font-weight: 500;
}

.section .hom_cat_bar .back-icon-wrapper {
    padding: 8px
}

.adunit {
    width: 100%;
    text-align: center
}

.main_stream div,
.player-container {
    margin-bottom: 15px
}

.madu {
    margin-bottom: 0
}

.nav {
    margin: 0;
    padding: 0;
    list-style: none
}

.nav:before {
    content: 'Navigation: '
}

.nav li {
    display: inline;
    margin: 0 .4em
}

.organic-thumbs-feed-01 .videoCube .video-label-box .video-title,
.trc_elastic_rec-reel-sc2 .trc_rbox_outer .videoCube .video-label-box {
    margin: 0;
    position: relative;
    background: 0 0;
    height: auto;
    padding: 0;
    font-family: system-ui;
    font-weight: 600;
    line-height: 25 px;
    font-size: 16px;
    color: #333;
    display: block
}

.rec-reel-sc2 .videoCube .video-label-box .video-title,
.thumbs-feed-01 .syndicatedItem .video-title {
    font-family: system-ui;
    font-weight: 600;
    line-height: 25px;
    font-size: 16px;
    color: #333;
    display: block
}

.thumbs-feed-01 .syndicatedItem .video-title,
.videoCube a {
    max-height: 54px;
    color: #000;
    font-size: 16px;
    line-height: 27px;
    text-align: inherit;
    font-family: system-ui;
    font-weight: 700;
    text-decoration: none
}

.trc_related_container DIV.videoCube.thumbnail_bottom .thumbBlock,
.trc_related_container DIV.videoCube.thumbnail_top .thumbBlock {
    border-radius: 2px
}

.thumbs-feed-01 .syndicatedItem .video-title {
    height: 54px;
    padding: 0
}

.div.tbl-reco-reel .trc_rbox_outer .videoCube .video-label-box,
.trc_elastic_organic-thumbs-feed-01 .trc_rbox_outer .videoCube .video-label-box,
.trc_elastic_thumbs-feed-01 .trc_rbox_outer .videoCube .video-label-box,
div.story-widget .trc_rbox_outer .videoCube .video-label-box {
    margin: 10px 10px 0
}

.videoCube a {
    padding: 0 10px
}

#artiheader,
.best-keywords a {
    font-weight: 400;
    font-size: 14px
}

.trc_related_container .trc_rbox .trc_rbox_div .videoCube .video-label-box .branding,
.trc_related_container .videoCube .video-label-box {
    text-align: right;
    font-family: system-ui;
    font-size: 12px;
    font-weight: 500
}

.parallax-top-story,
.ssc-circle,
.ssc-head-line,
.ssc-line,
.ssc-square {
    position: relative;
    overflow: hidden
}

.pImage {
    width: 70%;
    position: absolute;
    top: 0;
    right: 0;
    max-height: 900px
}

.pSection {
    position: relative;
    padding-top: 200px;
    padding-bottom: 300px
}

.ppcontainer {
    padding: 20px;
    margin: 0 auto;
    max-width: 100%;
    position: relative;
    z-index: 15
}

.pContent {
    width: 65%;
    background-color: rgba(78, 152, 21, .8);
    color: #fff;
    padding: 40px 60px
}

.parallax-top-story img {
    position: absolute;
    left: 50%;
    transform: translate3d(-50%, 0, 0);
    transform-style: preserve-3d;
    backface-visibility: hidden;
    width: 100%
}

.parallax-container {
    height: 500px;
    overflow: hidden
}

.parallax-container2 {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden
}

.best-keywords {
    position: relative;
    width: 100%;
    border-bottom: 1px var(--border-gray) solid;
    padding-bottom: 15px;
    display: block;
    min-height: 50px
}

.kewordstitle {
    width: 20%;
    position: absolute;
    right: 0
}

.kewordstitle,
.nav-item {
    font-size: 14px
}

.best-keywords nav {
    width: 100%;
    position: absolute;
    left: 0
}

.kewordstitle,
.nav-item,
.vertical-align-middle {
    display: inline-block;
    vertical-align: middle
}

.title {
    margin: 24px 0 6px;
    color: #fff
}

.best-keywords a {
    position: relative;
    line-height: 14px;
    color: #fff;
    border: 1px solid #f8f9fa;
    border-radius: 4px;
    font-family: system-ui;
    padding: 5px 8px;
    background: #d6e0ea26;
    margin-left: 5px;
    margin-right: 5px;
    z-index: 3;
    float: right;
    background-color: #f2f2f28f;
    color: rgb(0 0 0 / 82%);
    border: 1px solid #80808075
}

.best-keywords a.subcat_tags {
    background-color: transparent;
    padding-right: 0;
    margin-right: 0;
    border: none
}

#artiheader,
.best-keywords a:first-child {
    margin-right: 10px
}

.react-parallax-content small {
    position: absolute;
    font-size: 11px;
    right: 0;
    bottom: 0;
    color: #fff;
    padding: 6px 10px;
    background: #0c0c0c;
    font-family: system-ui;
    font-weight: 600;
    opacity: .85
}

#head_imp,
.crinfo,
div.artiwrapper {
    position: relative
}

.parallax-window {
    min-height: 350px;
    background: 0 0;
    width: 100%
}

#head_imp {
    height: 220px;
    display: block;
    margin-bottom: 30px
}

div.artiwrapper {
    z-index: 5;
    margin-top: 20px;
    width: 100%;
    display: inline-block
}

.artiwrapper h2 {
    width: 90%;
    font-size: 30px;
    color: var(--color-gray);
    margin-bottom: 10px;
    padding-right: 10px
}

hr {
    border: 1px solid var(--bg-flat-gray);
    border-radius: 1px
}

#artiheader {
    margin-top: 10px !important;
    padding: 0;
    color: rgba(0, 0, 0, .87);
    margin-left: 10px
}

.crinfo {
    display: inline-block;
    width: 100%;
    border: none;
    margin: 0 0 15px;
    padding: 0;
    color: #3c4043
}

#artiheader h2,
.video_desc {
    color: var(--color-gray);
    padding-right: 10px
}

.video_desc {
    font-size: 12px;
    width: 100%;
    padding-left: 10px
}

.systemshare {
    position: absolute;
    left: 0;
    top: calc(50% - 9px)
}

.systemshare button {
    font-size: 32px;
    float: left;
    margin-right: 15px;
    color: var(--icon-color-b);
    width: auto;
    padding: 0;
    height: auto;
    line-height: 1;
    position: absolute;
    left: 10px;
    top: 0
}

.systemshare button:nth-child(2) {
    left: 50px
}

.systemshare button:nth-child(3) {
    left: 90px
}

.artiwrapper div img {
    display: block;
    height: 100% !important;
    width: 100% !important;
    margin: 0;
    padding: 0
}

.copywriterimage {
    border: 2px solid #e4e4e4;
    border-radius: 50%;
    height: 60px;
    right: 10px;
    overflow: hidden;
    position: absolute;
    top: calc(50% - 26px);
    width: 60px;
    margin: 0;
    padding: 0
}

.crinfo small {
    margin: 22px 10px 10px 0;
    text-align: right;
    display: block;
    line-height: 1.7;
    font-size: 13px;
    padding-right: 64px;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif
}

.changefont {
    z-index: 3;
    top: 100px;
    left: 10%;
    width: 80%;
    border-radius: 5px;
    display: inline
}

.artiwrapper h1 {
    font-weight: 500;
    font-size: 26px;
    letter-spacing: 0;
    line-height: 37px;
    font-family: system-ui;
    padding-left: 30px;
    display: inline
}

.artiwrapper h4,
.title_tag {
    font-size: 26px;
    line-height: 39px;
    display: inline;
    letter-spacing: 0;
    font-family: system-ui;
    font-weight: 600
}

.artiwrapper h4 {
    padding-right: 5px;
    padding-left: 5px;
    background: #d7374e;
    color: var(--bg-flat-gray);
    margin-left: 10px
}

.main_stream a,
.md-select_sport ul[role=listbox] li a:hover,
.smartkeywords a,
table.data>tbody>tr:nth-child(odd) {
    background-color: #f2f2f2
}

.toggle-box input[type=checkbox]:checked+.toggle-box-label-left,
.toggle-box label {
    color: rgba(149, 149, 149, .51);
    font-weight: 400
}

.title_tag {
    color: var(--main-section-secondry);
    margin-left: 0
}

.search-box,
.ssmain {
    margin: 0 auto;
    position: relative
}

.headerButtonDKM {
    height: 26px;
    width: auto;
    position: absolute;
    left: 0
}

.toggle-box-label-left:empty {
    margin-left: -10px
}

.toggle-box-label-left:after,
.toggle-box-label-left:before {
    box-sizing: border-box;
    padding: 0;
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
    outline: 0
}

.toggle-box input[type=checkbox],
.toggle-box input[type=checkbox]:active {
    position: absolute;
    top: -5000px;
    height: 0;
    width: 0;
    opacity: 0;
    border: none;
    outline: 0
}

.toggle-box label {
    display: inline-block;
    position: relative;
    padding: 0;
    font-size: 14px;
    line-height: 16px;
    cursor: pointer
}

.toggle-box-label-left:before {
    content: '';
    display: block;
    position: absolute;
    z-index: 1;
    line-height: 34px;
    text-indent: 40px;
    height: 16px;
    width: 16px;
    margin: 4px;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    right: 25px;
    bottom: 0;
    background: #ffb200;
    transform: rotate(-45deg);
    box-shadow: 0 0 2px #fff
}

.toggle-box-label-left:after {
    content: "";
    display: inline-block;
    width: 40px;
    height: 24px;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    border-radius: 16px;
    background: rgba(255, 255, 255, .15);
    vertical-align: middle;
    margin: 0 10px;
    border: 2px solid #ffb200
}

.toggle-box input[type=checkbox]:checked+.toggle-box-label-left:before {
    right: 17px;
    box-shadow: 5px 5px 0 0 #f7f7f7;
    background: 0 0
}

.toggle-box input[type=checkbox]:checked+.toggle-box-label-left:after {
    background: rgba(0, 0, 0, .15);
    border: 2px solid #f7f7f7
}

.toggle-box input[type=checkbox]+.toggle-box-label-left,
.toggle-box input[type=checkbox]:checked+.toggle-box-label-left+.toggle-box-label {
    color: rgba(250, 250, 250, .51);
    font-weight: 700
}

#artiheader h3 {
    margin-bottom: 10px;
    font-family: system-ui;
    width: 100%;
    background: linear-gradient(-90deg, #e6e6e6 0, rgb(0 0 0 / 12%) 25%, rgba(0, 212, 255, 0) 90%);
    padding: 10px;
    color: #180303;
    font-size: 19px;
    font-weight: 900
}

#artiheader h2 {
    width: 90%;
    font-size: 20px;
    margin-bottom: 10px
}

.artiwrapper p {
    margin: 0 0 8px;
    padding: 0;
    color: #000;
    font-weight: 400;
    font-family: system-ui;
    line-height: 27px;
    font-size: 17px;
    padding-right: 10px;
    padding-left: 10px;
    line-height: 1.9;
}

.artiwrapper ul {
    width: 100%;
    display: flex;
    flex-direction: column
}

.artiwrapper ul li {
    display: block;
    width: 100%;
    padding: 8.5px 10px 8.5px 30px;
    font-weight: 600;
    font-size: 17px
}

.artiwrapper ul li:nth-child(2n) {
    background: linear-gradient(-90deg, #e6e6e6a1 0, rgb(0 0 0 / 8%) 25%, rgb(0 212 255 / 0%) 90%)
}

.artiwrapper p img {
    width: 100%;
    height: auto;
    margin-top: 15px;
    border-radius: 3px
}

.artiwrapper h5 {
    text-align: right;
    padding: 15px;
    font-family: system-ui;
    font-size: 19px;
    margin-top: 0;
    margin-bottom: 15px
}

#searchd,
.go-icon,
.search-icon {
    text-align: center;
    position: absolute
}

.ssmain {
    top: 0;
    left: 0;
    padding: 0 26px;
    width: 100%;
    background: #757575
}

.search-box {
    width: 100%;
    max-width: 360px;
    height: 60px;
    border-radius: 120px
}

.go-icon,
.search-icon {
    top: 0;
    height: 60px;
    width: 86px;
    line-height: 61px
}

.search-icon {
    left: 0;
    pointer-events: none;
    font-size: 1.22em;
    will-change: transform;
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform-origin: center center;
    -webkit-transform-origin: center center;
    -moz-transform-origin: center center;
    -o-transform-origin: center center;
    transition: transform .4s cubic-bezier(.19, 1, .22, 1) 220ms;
    -webkit-transition: transform .4s cubic-bezier(.19, 1, .22, 1) 220ms;
    -moz-transition: transform .4s cubic-bezier(.19, 1, .22, 1) 220ms;
    -o-transition: transform .4s cubic-bezier(.19, 1, .22, 1) 220ms
}

.si-rotate {
    transform: rotate(0);
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -o-transform: rotate(0)
}

.go-icon {
    left: 0;
    pointer-events: none;
    font-size: 90%;
    font-weight: :bold;
    will-change: opacity;
    cursor: default;
    opacity: 0;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transition: opacity 190ms ease-out, transform 260ms cubic-bezier(.19, 1, .22, 1);
    -webkit-transition: opacity 190ms ease-out, transform 260ms cubic-bezier(.19, 1, .22, 1);
    -moz-transition: opacity 190ms ease-out, transform 260ms cubic-bezier(.19, 1, .22, 1);
    -o-transition: opacity 190ms ease-out, transform 260ms cubic-bezier(.19, 1, .22, 1);
    color: #fff
}

.go-in,
.page-link:not(:disabled):not(.disabled),
.tie-user-location:not(.is-loading) {
    cursor: pointer
}

.go-in {
    opacity: 1;
    pointer-events: all;
    transform: rotate(0);
    -webkit-transform: rotate(0);
    -moz-transform: rotate(0);
    -o-transform: rotate(0);
    transition: opacity 190ms ease-out, transform 260ms cubic-bezier(.19, 1, .22, 1) 20ms;
    -webkit-transition: opacity 190ms ease-out, transform 260ms cubic-bezier(.19, 1, .22, 1) 20ms;
    -moz-transition: opacity 190ms ease-out, transform 260ms cubic-bezier(.19, 1, .22, 1) 20ms;
    -o-transition: opacity 190ms ease-out, transform 260ms cubic-bezier(.19, 1, .22, 1) 20ms;
    color: #fff
}

.search-border {
    display: block;
    width: 100%;
    max-width: 360px;
    height: 60px
}

.border {
    fill: none;
    stroke: #FFFFFF;
    stroke-width: 5;
    stroke-miterlimit: 10;
    stroke-dasharray: 740;
    stroke-dashoffset: 0;
    transition: stroke-dashoffset .4s cubic-bezier(.6, .040, .735, .99);
    -webkit-transition: stroke-dashoffset .4s cubic-bezier(.6, .040, .735, .99);
    -moz-transition: stroke-dashoffset .4s cubic-bezier(.6, .040, .735, .99);
    -o-transition: stroke-dashoffset .4s cubic-bezier(.6, .040, .735, .99)
}

.border-searching .border {
    stroke-dasharray: 740;
    stroke-dashoffset: 459;
    transition: stroke-dashoffset 650ms cubic-bezier(.755, .15, .205, 1);
    -webkit-transition: stroke-dashoffset 650ms cubic-bezier(.755, .15, .205, 1);
    -moz-transition: stroke-dashoffset 650ms cubic-bezier(.755, .15, .205, 1);
    -o-transition: stroke-dashoffset 650ms cubic-bezier(.755, .15, .205, 1)
}

#searchd {
    font-family: "system-ui";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 120px;
    border: none;
    background: rgba(255, 255, 255, 0);
    padding: 0 68px;
    color: #fff;
    font-size: 18px;
    outline: 0;
    -webkit-user-select: initial;
    -khtml-user-select: initial;
    -moz-user-select: initial;
    -ms-user-select: initial;
    user-select: initial
}

#searchd::-webkit-input-placeholder {
    color: #fff
}

#searchd::-moz-placeholder {
    color: #fff
}

#searchd:-ms-input-placeholder {
    color: #fff
}

#searchd:-moz-placeholder {
    color: #fff
}

#searchd::-moz-selection {
    color: #fff;
    background: rgba(0, 0, 0, .25)
}

#searchd::selection {
    color: #fff;
    background: rgba(0, 0, 0, .25)
}

.flex {
    display: flex;
    align-items: center;
    justify-content: center;
    direction: ltr;
    background: #ebebeb
}

#options-view-button:checked~#options #option-bg,
.page-link,
.profile-user-page .data-user li a,
.profile-user-page .data-user li strong,
nav {
    display: block
}

.app-btn {
    width: 45%;
    max-width: 160px;
    color: #fff;
    margin: 20px 10px;
    text-align: left;
    border-radius: 5px;
    text-decoration: none;
    font-family: "Lucida Grande", sans-serif;
    font-size: 10px;
    text-transform: uppercase
}

.app-btn.blu {
    background-color: #101010;
    transition: background-color .25s linear
}

.app-btn.blu:hover {
    background-color: #454545
}

.app-btn i {
    width: 20%;
    text-align: center;
    font-size: 28px;
    margin-left: 7px
}

.app-btn .big-txt {
    font-size: 17px;
    text-transform: capitalize;
    color: #fff
}

.text-right .icon,
div.scrollmenu2 a {
    text-transform: uppercase;
    text-align: center
}

.app-btn p {
    color: #fff;
    font-size: 12px;
    line-height: 1;
    font-weight: 500;
    margin: 0
}

.ag-grid_item,
.page-item,
.sr-bb .sr-livetable__bottom-padding-wrapper {
    padding: 0
}

.page-item:first-child .page-link {
    margin-left: 0;
    border-top-left-radius: .25rem;
    border-bottom-left-radius: .25rem
}

.page-link {
    position: relative;
    padding: .5rem .75rem;
    margin-left: -1px;
    line-height: 1.25;
    color: #007bff;
    background-color: #fff;
    border: 1px solid #dee2e6
}

.page-item.active .page-link {
    z-index: 1;
    color: #fff;
    background-color: #007bff;
    border-color: #007bff
}

.page-link:hover {
    color: #0056b3;
    text-decoration: none;
    background-color: #e9ecef;
    border-color: #dee2e6
}

.pagination {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-left: 0;
    list-style: none;
    border-radius: .25rem
}

.head_result {
    width: 100%;
    align-items: center;
    position: relative;
    display: inline-block;
    transition: top .2s ease-in-out;
    top: 0;
    padding: 10px
}

.head_result .sr-widget {
    display: inline-block;
    width: 100%;
    padding: 0;
    margin-top: 15px
}

.head_result h1.sporthead {
    font-weight: 500;
    font-size: 20px;
    letter-spacing: 0;
    line-height: 22px;
    text-align: right;
    font-family: system-ui;
    margin-bottom: 5px;
    width: calc(100% - 100px);
    float: right
}

.head_result img {
    width: 40px;
    float: right;
    margin: 5px
}

.head_result h2 {
    font-weight: 400;
    font-size: 16px;
    letter-spacing: 0;
    line-height: 22px;
    text-align: center;
    color: #9c9c9c;
    font-family: system-ui;
    margin-bottom: 15px
}

div.scrollmenu2 {
    float: left;
    width: 100%;
    white-space: nowrap;
    overflow-x: auto;
    height: auto;
    position: relative;
    z-index: 1;
    overflow-y: hidden;
    margin-top: 0;
    display: inline-block;
    min-height: 52px;
    font-family: system-ui
}

div.scrollmenu2 a {
    color: #047aed;
    display: -webkit-inline-box;
    -webkit-box-flex: 0;
    flex: 0 0 auto;
    flex: 0 0 auto;
    font-size: 14px;
    font-weight: 600;
    line-height: 48px;
    margin-right: 8px;
    padding: 0 10px;
    text-decoration: none;
    width: auto
}

div.scrollmenu2 a.active_now {
    color: #333;
    border-bottom: 2px solid #ec2440
}

.text-right {
    text-align: right
}

.text-right .icon {
    margin: 10px 0;
    display: block;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: 0 0;
    border: 0;
    color: #fff;
    padding: 18px 20px;
    position: relative;
    z-index: 2;
    font-weight: 900;
    font-family: Frutiger75;
    letter-spacing: -.5px;
    font-size: 30px;
    text-shadow: 1px 1px #000
}

.md-select [type=button],
.md-select_sport [type=button] {
    text-shadow: none;
    font-family: system-ui;
    cursor: pointer;
    outline: 0;


    font-family: system-ui;
    position: relative;
    border: 1px #dedede solid;
    background-image: linear-gradient(0deg, #ffffff, #e8eaed);
    border-radius: max(0px, min(5px, calc((100vw - 2px - 100%) * 9999)))/5px;
}

.wrap .card {
    width: 100%;
    height: 100%;
    border: 0;
    font-size: 12px
}

.card .menu-content {
    margin: 0;
    padding: 0;
    list-style-type: none
}

.card .menu-content::after,
.card .menu-content::before,
.example-2 .header::after,
.example-2 .header::before {
    content: "";
    display: table
}

#hero-slides #header #menu #hamburger,
.card .menu-content li,
.date-right,
.scrolling-wrapper .card {
    display: inline-block
}

.card .menu-content a,
.example-2 .data,
.example-2 .title a,
.more-link.blacked a,
.more-link.blacked a i,
.option input[type=radio]:checked~.label,
.option input[type=radio]:checked~i,
.option:hover .label {
    color: #fff
}

.card .menu-content span {
    position: absolute;
    left: 50%;
    top: 0;
    font-size: 10px;
    font-weight: 600;
    font-family: "Open Sans";
    transform: translate(-50%, 0)
}

.simi_main .ssdata a,
.simi_main .stitle a {
    font-family: system-ui, apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    -webkit-line-clamp: 2
}

.card .wrapper {
    background-color: #fff;
    min-height: 424px;
    position: relative;
    overflow: hidden
}

.card .wrapper .play_icon_2022 {
    position: absolute;
    font-size: 60px;
    left: calc(50% - 30px);
    top: calc(50% - 30px);
    color: #fff;
    z-index: 7;
    text-shadow: 1px 1px 20px #000
}

.card .wrapper:hover .data {
    transform: translateY(0)
}

.card .data {
    position: absolute;
    bottom: 50px;
    width: 100%;
    z-index: 6;
    font-family: system-ui;
    font-size: 10px
}

.card .wrapper::after {
    content: "";
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .8) 100%, rgba(0, 0, 0, .9) 100%);
    position: absolute;
    bottom: 0;
    height: 100%;
    width: 100%;
    pointer-events: none;
    z-index: 5;
    left: 0;
    right: 0;
    top: 0
}

.card .data .content {
    padding: 1em;
    position: relative;
    z-index: 1
}

.card .author {
    font-size: 12px
}

.card .title {
    line-height: 28px;
    font-size: 21px
}

.card .text {
    height: 70px;
    margin: 0
}

.card input[type=checkbox]:checked+.menu-content {
    transform: translateY(-60px)
}

.example-2 .wrapper {
    border: 5px #fe0 var(--border-gray)
}

.example-2 .wrapper:hover .menu-content span {
    transform: translate(-50%, -10px);
    opacity: 1
}

.example-2 img {
    position: absolute;
    z-index: 0;
    left: 0
}

.example-2 .header {
    color: #fff;
    padding: 1em;
    display: flex;
    align-content: space-between;
    align-items: flex-start;
    flex-wrap: nowrap;
    flex-direction: column-reverse;
    position: absolute;
    z-index: 9;
    width: 100%
}

.example-2 .header .date {
    font-size: 15px;
    position: absolute;
    left: 15px;
    top: 15px
}

.example-2 .menu-content {
    font-size: 25px;
    direction: ltr;
    width: 100px
}

.example-2 .menu-content li {
    margin: 0 5px;
    position: relative
}

.example-2 .menu-content span {
    transition: .3s;
    opacity: 0
}

.example-2 .button {
    display: block;
    width: 130px;
    margin: 15px auto;
    text-align: center;
    font-size: 13px;
    color: #fff;
    line-height: 1;
    position: absolute;
    font-weight: 600;
    padding: 9px 14px;
    border-radius: 5px;
    font-family: system-ui;
    z-index: 3000;
    left: calc(50% - 60px);
    top: calc(100% - 17px);
    border: .5px solid
}

.sk .sk_c,
.sk .ssc-card,
.sticky_nav {
    position: relative
}

.theme-3 .opinion .single_post_text,
.wrap .more-link {
    padding-bottom: 0
}

.example-2 .button::after {
    content: "→";
    opacity: 0;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(0, -50%);
    transition: .3s
}

.example-2 .button:hover::after {
    transform: translate(5px, -50%);
    opacity: 1
}

.playseries {
    font-size: 15px;
    position: absolute;
    margin-right: 4px;
    display: none
}

.barba-overlay,
.sk {
    position: fixed;
    top: 0
}

.nightmode .homepage-header,
.wrap.blacked {
    background-color: #000
}

.more-link.blacked,
.section .hom_cat_bar.blacked {
    background: var(--color-black)
}

.wrap .more-link {
    margin-top: 15px;
    border-top: 1px solid var(--border-gray);
    width: 100%;
    margin-bottom: 0
}

.more-link {
    color: var(--color-gray);
    display: flex;
    font-weight: 500;
    font-family: system-ui;
    font-size: 15px;
    float: left;
    padding: 10px 0 0;
    line-height: 15px;
    flex-direction: row;
    text-align: left;
    direction: LTR
}

.more-link.blacked {
    margin-top: 0;
    border-top: 1px solid #212020;
    padding-bottom: 10px
}

.more-link a {
    color: #047aed
}

.card a,
.smartkeywords a,
.trendingsmartkeywords a {
    color: #46545d;
    line-height: 23px
}

.more-link a i {
    color: #047aed;
    margin: 3px;
    font-size: 19px
}

#video-dis iframe,
.shortcuts,
.wrap .canvas {
    width: 100%;
    height: 100%
}

.arabtv {
    margin-top: 15px
}

.section .hom_cat_bar.bloger.redbkg {
    background: var(--bg-simi-sec)
}

.skeleton_producer {
    width: 100%;
    z-index: 13;
    position: fixed;
    top: 55px
}

.sk {
    width: 100%;
    z-index: 10;
    height: 100%;
    background: #fff
}

.sk .ssc-card {
    padding: 6px;
    height: auto;
    min-height: 168px;
    margin-top: 30px
}

.sk .sk_c {
    margin: 0 auto;
    height: calc(100% - 52px);
    width: 1288px
}

.ssc .hd,
.ssc .mb {
    margin-right: 10px
}

.sk .sk_c .sk_right {
    width: 790px;
    float: right;
    height: 100%;
    display: flex;
    flex-direction: column
}

.sk .sk_c .sk_right .r {
    display: flex;
    flex-direction: row;
    width: 100%
}

.sk .sk_c .sk_right .c {
    display: flex;
    flex-direction: column;
    width: 50%
}

.sk .sk_c .sk_right .v {
    display: flex;
    flex-direction: column;
    width: 100%
}

.sk .sk_c .sk_left {
    width: 338px;
    float: left;
    height: 100%
}

@-webkit-keyframes ssc-loading {
    from {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
    to {
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
}

@keyframes ssc-loading {
    from {
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%)
    }
    to {
        -webkit-transform: translateX(100%);
        transform: translateX(100%)
    }
}

.ssc-circle:after,
.ssc-head-line:after,
.ssc-line:after,
.ssc-square:after {
    content: "";
    -webkit-animation: 1.3s infinite ssc-loading;
    animation: 1.3s infinite ssc-loading;
    height: 100%;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    z-index: 1;
    background: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(rgba(255, 255, 255, .3)), to(transparent));
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .3), transparent)
}

.ssc {
    cursor: progress;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.ssc .hd {
    height: 22px
}

.ssc .mb {
    margin-bottom: 10px
}

.ssc .mt {
    margin-top: 16px
}

.ssc .mts,
.ssc-line {
    margin-top: 8px
}

.ssc .mr {
    margin-right: 16px
}

.ssc .ml {
    margin-left: 16px
}

.ssc .mbs {
    margin-bottom: 8px
}

.ssc .mrs {
    margin-right: 8px
}

.ssc .mls {
    margin-left: 8px
}

.ssc .w-10 {
    width: 10%
}

.ssc .w-20 {
    width: 20%
}

.ssc .w-30 {
    width: 30%
}

.ssc .w-50 {
    width: 50%
}

.ssc .w-70 {
    width: 70%
}

.ssc .w-80 {
    width: 80%
}

.ssc .w-90 {
    width: 90%
}

.ssc .flex {
    display: -webkit-box;
    display: flex
}

.ssc .inline-flex {
    display: -webkit-inline-box;
    display: inline-flex
}

.ssc .align-center {
    -webkit-box-align: center;
    align-items: center
}

.ssc .align-start {
    -webkit-box-align: start;
    align-items: flex-start
}

.ssc .align-end {
    -webkit-box-align: end;
    align-items: flex-end
}

.ssc .align-stretch {
    -webkit-box-align: stretch;
    align-items: stretch
}

.ssc .justify-start {
    -webkit-box-pack: start;
    justify-content: start
}

.ssc .justify-end {
    -webkit-box-pack: end;
    justify-content: end
}

.ssc .justify-between {
    -webkit-box-pack: justify;
    justify-content: space-between
}

.ssc .justify-center {
    -webkit-box-pack: center;
    justify-content: center
}

.ssc .justify-around {
    justify-content: space-around
}

.ssc-wrapper {
    padding: 16px
}

.ssc-card {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    background-color: #fff;
    margin-bottom: 5px;
    direction: rtl
}

.ssc-circle,
.ssc-head-line,
.ssc-hr,
.ssc-line,
.ssc-square {
    display: block;
    background-color: rgba(0, 0, 0, .17)
}

.ssc-circle {
    border-radius: 50%;
    width: 50px;
    height: 50px
}

.ssc-hr {
    width: 100%;
    height: 2px
}

.ssc-line {
    border-radius: 15px;
    width: 100%;
    height: 12px
}

.ssc-line:last-child {
    margin-bottom: unset
}

.ssc-head-line {
    border-radius: 2px;
    width: 100%;
    height: 40px;
    margin-bottom: 1px
}

.ssc-square {
    width: 100%;
    height: 220px;
    margin-bottom: 15px
}

.give-answers__why appears {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif
}

.artiwrapper p.blogs_alert {
    margin: 0;
    padding: 25px;
    font-size: 13px;
    display: inline-block;
    color: #000;
    background: #fef0f0;
    line-height: 20px;
    font-weight: 400;
    border: 1px solid #ffc8c8
}

.md-select ul[role=listbox],
.md-select_sport ul[role=listbox] {
    background-color: #fff;
    line-height: 26px;
    padding: 0;
    cursor: default;
    list-style: none
}

.barba-container div.ad_possible_location,
.barba-container div.ad_possible_location div,
.barba-container div.was-it-helpful-wrapper,
.barba-container div.was-it-helpful-wrapper div,
.related_articles div {
    visibility: visible
}

.barba-overlay {
    background: #4f3e89;
    width: 100%;
    height: 100%;
    display: none;
    opacity: .7;
    filter: blur(306px);
    z-index: 14
}

.main_Arti .systemshare {
    position: absolute;
    left: 0;
    top: 15px
}

.main_Arti .systemshare button {
    color: #fff;
    text-shadow: -1px 1px 8px #00000040
}

.sticky_nav {
    display: inline-block;
    display: flex;
    flex-direction: row;
    padding: 10px;
    box-shadow: 0 1px 2px 0 rgb(0 0 0 / 31%);
    z-index: 1
}

.smartkeywords,
.trendingsmartkeywords {
    width: 100%;
    padding: 10px 0
}

.post_img,
.single_post {
    z-index: 2;
    position: relative
}

.md-select,
.md-select_sport {
    position: relative;
    display: block
}

.md-select label,
.md-select_sport label {
    position: relative;
    display: flex;
    margin: 0
}

.md-select div,
.md-select_sport div {
    display: block;
    visibility: visible
}

.md-select [type=button] {
    position: relative;
    text-align: right;
    width: 100%;
    overflow: hidden;
 
    display: flex;
    font-size: 16px;
    font-family: system-ui;
    position: relative;
    border: 2px #dedede solid;
    background-image: linear-gradient(0deg, #ffffff, #e8eaed);
    border-radius: max(0px, min(5px, calc((100vw - 2px - 100%) * 9999)))/5px;
    height: 30px;
    font-size: 14px;
    font-weight: 600;
    color: #000;
    line-height: 25px;
    padding-left:0;
    margin-right:35px;
}

.md-select [type=button]::before {
    content: "\EF19";
    float: right;
    margin-left: 6px;
    font-size: 20px;
    font-family: remixicon !important;
    font-weight:normal;
    color: #4e98d4;
}

.md-select [type=button]:after {
    content: "\ea50";
    float: left;
    font-size: 23px;
    font-family: remixicon !important;
    font-weight:normal ;
    color:#818b95
}

.md-select ul[role=listbox] {
    overflow: hidden;
    margin: 0;
    max-height: 0;
    position: absolute;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: .15s cubic-bezier(.35, 0, .25, 1);
    transition: .15s cubic-bezier(.35, 0, .25, 1);
    width: 300px;
    left: 0;
    top: 36px;
}

.md-select ul[role=listbox] li,
.md-select_sport ul[role=listbox] li {
    margin: 0;
    outline: 0;
    overflow: hidden;
    font-size: 16px;
    font-family: system-ui;
    border-bottom: 1px solid #e8eaed;
    font-weight: 600
}

.md-select ul[role=listbox] li a {
    display: block;
    padding: 10px;
    font-size: 90%
}


.md-select ul[role=listbox] li.active,
.md-select ul[role=listbox] li:focus,
.md-select ul[role=listbox] li:hover {
    background: rgba(0, 0, 0, .1)
}

.md-select.active ul {
    max-height: 290px;
    overflow: auto;
    padding: 0;
    z-index: 155;
    -webkit-transition: .15s;
    transition: .15s;
    direction: rtl;
    box-shadow: 1px 1px 2px 0 rgb(0 0 0 / 31%);
    max-height: 390px;
    height: 300px;
    padding: 0;
    z-index: 155;
    direction: rtl;
    box-shadow: 1px 1px 2px 0 #e6e6e6;
    border-radius: 8px;
    border: 1px solid #e6e6e6;
    margin-top: 10px;
}

.md-select_sport [type=button] {
    position: relative;
    text-align: right;
    width: 100%;
    overflow: hidden;
    padding: 0;
    /* border: 2px solid #ccc; */
    background-color: #d9e5ffb0;
    border-radius: 8px;
    color: #000710;
    color: #404040;
    box-shadow: #dedede 0px 0px 0px 1px;
}

.md-select_sport [type=button]:after {
    content: "\ea50";
    float: left;
    font-size: 30px;
    font-family: remixicon !important;
    margin-top: 10px;
    margin-left: 2px;
    width: 30px
}

.md-select_sport ul[role=listbox] {
    overflow: hidden;
    margin: 0;
    max-height: 0;
    position: absolute;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    width: 100%
}

.md-select_sport ul[role=listbox] li:last-child {
    border-bottom: 0 solid #e8eaed
}

.md-select_sport ul[role=listbox] li a {
    display: flex;
    padding: 5px;
    font-size: 90%;
    color: #000;
    position: relative;
    cursor: pointer
}

.md-select_sport ul[role=listbox] li a:hover::after {
    content: "\ea60";
    font-family: remixicon !important;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: var(--color-gray);
    position: absolute;
    left: 5px;
    top: calc(50% - 15px);
    font-size: 30px
}

.md-select_sport ul[role=listbox] li a img {
    float: right;
    width: 40px;
    height: 40px;
    margin: 5px
}

.md-select_sport ul[role=listbox] li a span {
    float: right;
    width: calc(100% - 80px);
    margin: 0 10px 0 0
}

.md-select_sport ul[role=listbox] li a span.year {
    float: right;
    background-color: #dce1f5;
    margin: 0 65px 0 0;
    padding: 2px 4px;
    line-height: 1;
    position: absolute;
    right: 0;
    top: 30px;
    width: auto;
    font-size: 12px;
    border-radius: 5px
}

.md-select_sport.active ul {
    max-height: 390px;
    height: 300px;
    overflow: hidden;
    padding: 0;
    z-index: 155;
    direction: rtl;
    box-shadow: 1px 1px 2px 0 #e6e6e6;
    border-radius: 8px;
    border: 1px solid #e6e6e6;
    margin-top: 10px
}

.scrolling-wrapper {
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap
}

.scrolling-wrapper-flexbox {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto
}

.scrolling-wrapper-flexbox .card {
    flex: 0 0 auto;
    margin-right: 3px
}

.shortcuts::after {
    background: #031318;
    background: -moz-linear-gradient(270deg, rgba(3, 19, 24, 0) 0, #fff 76%);
    background: -webkit-linear-gradient(270deg, rgba(3, 19, 24, 0) 0, #fff 76%);
    background: linear-gradient(270deg, rgba(3, 19, 24, 0) 0, #fff 76%);
    content: '';
    width: 30px;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 3
}

.trendingsmartkeywords .golink {
    width: 50%;
    padding-right: 0;
    padding-left: 0;
    flex: 0 0 auto;
    float: right
}

.trendingsmartkeywords a {
    font-family: system-ui;
    margin: 0;
    padding: 4px 10px;
    text-align: right;
    display: block;
    border-radius: 20px;
    font-weight: 600;
    font-size: 12px
}

.smartkeywords {
    -webkit-overflow-scrolling: touch;
    margin-top: 3px;
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto
}

.card,
.smartkeywords .golink {
    margin-left: 16px;
    padding-right: 0;
    padding-left: 0;
    width: auto
}

.smartkeywords .golink {
    flex: 0 0 auto;
    margin-right: 3px
}

.smartkeywords a {
    font-family: system-ui;
    margin: 0;
    padding: 4px 10px;
    text-align: center;
    display: block;
    border: 1px solid #dadce0;
    border-radius: 20px;
    font-weight: 600;
    font-size: 12px
}

.card.selected {
    border-bottom: 2px var(--More-color) solid
}

.card a {
    font-family: system-ui;
    font-size: .9rem;
    font-weight: 400;
    margin: 0;
    padding: 0;
    text-align: center;
    display: block
}

.card a.selected {
    color: var(--More-color);
    font-weight: 600
}

.nightmode,
.nightmode .artiwrapper h1,
.nightmode .artiwrapper p,
.nightmode .black-text,
.nightmode .entery-desc,
.nightmode .entery-title,
.nightmode .entery-title .whref,
.nightmode .info-row .map-extended-title,
.nightmode .md-select [type=button]:after,
.nightmode .menu-button--black i:first-of-type,
.nightmode .organic-thumbs-feed-01 .videoCube .video-label-box .video-title,
.nightmode .systemshare button,
.nightmode .thumbs-feed-01 .syndicatedItem .video-title,
.nightmode .weather-widget-inner small,
.nightmode a,
.organic-thumbs-feed-01-mp .video-title,
.paywall-dropdown-icon-firma,
.primary-color,
.trc_elastic_rec-reel-sc2 .trc_rbox_outer .videoCube .video-label-box {
    color: #e8eaed
}

.scrolling-wrapper,
.scrolling-wrapper-flexbox {
    width: 100%;
    -webkit-overflow-scrolling: touch;
    margin-top: 3px
}

.scrolling-wrapper-flexbox::-webkit-scrollbar,
.scrolling-wrapper::-webkit-scrollbar {
    display: none
}

.nightmode {
    -webkit-transition: background-color .2s ease-out
}

.nightmode .best-keywords,
.nightmode .thumbs-feed-01,
.nightmode .thumbs-feed-01 .trc_rbox_border_elm {
    border-bottom: 1px solid #1f1a31;
    border-color: #1f1a31
}

.nightmode .map-container .cityOnmap .temp-info,
.nightmode .menu-button span,
.nightmode .more-link a,
.nightmode .more-link a i,
.nightmode .timingInfo a,
.nightmode .usernamecard .usernamecardheader span.mdi,
.nightmode .usernamecard main p,
.section .hom_cat_bar.bloger .float-title,
.section .hom_cat_bar.bloger .moreicon {
    color: #000
}

.nightmode .section .hom_cat_bar,
.nightmode .section .hom_cat_bar.black,
.nightmode .section .hom_cat_bar.bloger,
.nightmode .ticker-container {
    background: #303134
}

.nightmode .shortcuts::after {
    background: linear-gradient(270deg, rgba(3, 19, 24, 0) 0, rgb(8 12 20) 76%)
}

.nightmode .card a.selected,
.nightmode .card.selected {
    color: #8ab4f8
}

.nightmode .card.selected {
    border-color: #8ab4f8
}

.nightmode .main_Arti img {
    box-shadow: -1px 4px 4px #303134;
    border-bottom: 1px solid #303134
}

.nightmode .homepage-header,
.nightmode .regularitemsmall,
.nightmode .sticky_nav {
    border-bottom: 1px solid #5f6368
}

.nightmode .crinfo,
.nightmode .homepage-header div.main-controllers a,
.nightmode .homepage-header div.main-menu-dp span {
    color: #8a8a8a;
    background: 0 0
}

.nightmode .paywall-greetings {
    border-top: 1px solid #1f1a31;
    background-color: transparent
}

.nightmode .md-select [type=button] {
    border: 1px solid #1f1a31;
    background: #000;
    color: #e8eaed
}

.nightmode .simi_main {
    box-shadow: -1px 4px 4px #05111db0
}

.nightmode .simi_main:first-child,
.nightmode .simi_main:nth-child(3),
.nightmode .simi_main:nth-child(5) {
    background-image: linear-gradient(45deg, #6a0a13, #130404)
}

.nightmode .simi_main:nth-child(2),
.nightmode .simi_main:nth-child(4) {
    background-image: linear-gradient(45deg, #032d75, #0c012a)
}

.nightmode .ssc-line,
.nightmode .ssc-square {
    background-color: rgb(229 229 229 / 17%)
}

.nightmode .skeleton_producer,
.nightmode .ssc-card,
.nightmode .ssc-line {
    background: #202124
}

.nightmode .ssc-circle:after,
.nightmode .ssc-head-line:after,
.nightmode .ssc-line:after,
.nightmode .ssc-square:after {
    background: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(rgba(0, 0, 0, .3)), to(transparent));
    background: linear-gradient(90deg, transparent, rgba(0, 0, 0, .3), transparent)
}

.nightmode .copywriterimage {
    border: 2px solid #09090e
}

.nightmode .best-keywords a {
    background-color: #154faf;
    border: 1px solid #0a3a89
}

.nightmode,
.nightmode .bckfff,
.nightmode .g_footer,
.nightmode .holdmenucontext,
.nightmode .menucontainer,
.nightmode .menucontext,
.nightmode .usernamecard main {
    background: #171717
}

.nightmode .actions {
    background: #000;
    border-top: 1px solid #323232
}

.nightmode .md-select ul[role=listbox] {
    background-color: #303134
}

.nightmode .footer_row.bordered {
    border-top: 1px solid #5f6368
}

.nightmode .organic-thumbs-feed-01 .trc_rbox_border_elm {
    border-color: #5f6368
}

.main_stream {
    width: 100%;
    display: flex;
    margin: 10px;
    flex-direction: column
}

.main_stream_heading {
    background: #eee;
    height: 40px;
    transition: bottom .2s ease-in-out;
    -webkit-transition: background-color .2s ease-out;
    display: flex;
    position: relative;
    background: linear-gradient(45deg, #001d48, #000);
    margin-top: 15px
}

.main_stream a {
    font-family: system-ui;
    color: #46545d;
    margin: 0;
    padding: 4px 10px;
    text-align: center;
    line-height: 23px;
    display: inline-block;
    border: 1px solid #dadce0;
    border-radius: 20px;
    font-weight: 600;
    font-size: 12px;
    width: auto;
    position: relative
}

header {
    transition: .2s
}

.theme3_bg {
    direction: rtl;
    -webkit-text-stroke-color: white
}

.space-30 {
    height: 30px
}

.theme-3 .container {
    max-width: 1235px
}

.row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(var(--bs-gutter-y) * -1);
    margin-left: calc(var(--bs-gutter-x) * -.5);
    margin-right: calc(var(--bs-gutter-x) * -.5);
    --bs-gutter-x: 1.1rem
}

.row>* {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-left: calc(var(--bs-gutter-x) * .5);
    padding-right: calc(var(--bs-gutter-x) * .5);
    margin-top: var(--bs-gutter-y)
}

.ag-grid__wrap,
.border-radious5 {
    overflow: hidden
}

.white_bg {
    position: relative;
    text-align: right;
    background: 0 0
}

.single_post {
    transition: .3s;
    margin-bottom: 0
}

.ad_300x250,
.ad_375x375,
.ad_min,
.mega-ad,
.trendingbox {
    transition: .2s
}

.post_img a img {
    box-shadow: -1px 4px 4px #dee2e6;
    border-radius: 5px;
    border: .5px solid #d1d3d4;
    display: block;
    width: 100%
}

.post_type3 .post_img span.tranding {
    left: 19px;
    top: 78%;
    font-size: 20px;
    color: rgb(0 0 0 / 82%);
    background: #fff;
    border-radius: 50%;
    width: 36px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    box-shadow: 0 0 20px 0 #00000087
}

span.tranding {
    display: inline-block;
    position: absolute
}

.post_type3 .single_post_text {
    padding: 20px 0
}

.brid-default-skin .brid-poster-title div,
.single_post_text {
    direction: rtl;
    text-align: right
}

.single_post_text h4 {
    color: #404052;
    line-height: 21px;
    font-weight: 900;
    font-family: Tajawal;
    letter-spacing: -.5px
}

.space-10 {
    height: 10px
}

.post_type3 .single_post_text .post-p {
    opacity: .85;
    font-size: 14px;
    line-height: 22px;
    -webkit-tap-highlight-color: transparent !important;
    text-overflow: ellipsis !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    -webkit-line-clamp: 2;
    font-family: system-ui
}

.theme-3 .post_type15 .single_post_text {
    padding-left: 11%;
    padding-right: 2%;
    padding-bottom: 0
}

.col-xl-3 {
    flex: 0 0 auto;
    width: 25%;
    -ms-flex: 0 0 26.017%;
    flex: 0 0 26.017%;
    max-width: 26.017%
}

.col-xl-5 {
    -ms-flex: 0 0 46.31%;
    flex: 0 0 46.31%;
    flex: 0 0 auto;
    width: 41.66666667%
}

.d-xl-block {
    display: block !important
}

header.blockedbar {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    direction: rtl;
    background: #f8f9fa;
    display: block;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 15;
    box-shadow: #dedede 0 1px 4px 0
}

header.blockedbar .inner {
    width: 1288px;
    height: 100%;
    margin: 0 auto;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    color: #818b95;
    min-height: 50px
}

header.blockedbar .inner a,
header.blockedbar .inner button {
    color: #000
}

header.blockedbar .inner div.logo {
    display: flex;
    height: 30px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

header.blockedbar .inner div.logo svg {
    height: 30px;
    color: #fefefec7;
    line-height: 28px;
    font-size: 20px;
    margin-left: 8px;
    margin-right: 8px
}

.profile-user-page .data-user li a:hover span,
footer h4 a {
    color: #3498db
}

.main-menu-dp::before {
    content: '|';
    display: flex;
    color: #dedede;
    font-size: 26px;
    margin-left: 8px;
    line-height: 25px;
}

.main-menu-dp {
    display: flex;
    margin-left: 8px;
    font-weight: 600
}

.ri-menu-line {
    color: #333c;
    line-height: 30px;
    font-size: 25px;
    /* padding: 5px; */
    cursor: pointer;
}

.allstandings,
.views-div-api {
    font-size: 12px;
    font-weight: 400
}

.mainsearch {
    padding: 0 !important;
    position: relative
}

header.blockedbar .inner .date:after,
header.blockedbar .inner .date:before,
header.blockedbar .inner .s-logo:before {
    content: '|';
    display: inline-block;
    margin: 0 10px;
    font-size: 13px
}

header.blockedbar .inner div.logo img {
    width: 75px;
    margin-left: 8px;
    margin-right: 8px
}

header.blockedbar .inner div.logo svg path {
    fill: #fefefec7
}

header.blockedbar .inner .s-logo:after {
    content: '';
    display: inline-block;
    vertical-align: middle;
    background: url(https://rcs.mako.co.il/images/svg/news/logo-small-n-12.svg) 0 0/cover no-repeat;
    width: 92px;
    height: 12px
}

header.blockedbar .inner .date {
    font-size: 13px;
    position: relative;
    display: block;
    padding-bottom: 2px;
    font-family: system-ui;
    font-weight: 600
}

.tns-visually-hidden {
    position: absolute;
    left: -10000em;
    display: none
}

#barba-wrapper {
    position: relative;
    font-family: system-ui;
    margin: 0 auto;
    width: 100%
}

.section.mainews_sec_desk {
    display: flex;
    flex-direction: row;
    gap: 25px
}

.mega-ad {
    width: 100%;
    background: #dedede;
    position: fixed;
    top: 0
}

.ad_min {
    width: 950px;
    margin: 0 auto
}

.ad_300x250 {
    height: 250px;
    width: 300px;
    position: relative
}

.ad_375x375 {
    height: 414px;
    width: 450px;
    position: relative
}

.trendingbox {
    height: 250px;
    width: 300px;
    position: relative;
    padding-top: 15px;
    padding-bottom: 15px
}

.trending h3 {
    margin: 0;
    padding: 8px;
    font-size: 15px;
    background: #d2122e;
    color: #fff
}

.viewholder {
    display: inline
}

.views-div-api {
    left: 10px;
    color: #8a8d91cf;
    display: flex;
    flex-direction: row;
    line-height: 15px;
    gap: 2px;
    margin-right: 10px;
    font-family: inherit;
    text-align: left;
    direction: ltr;
    margin-top: 3px
}

.views-div-api::before {
    content: "\ECB4";
    font-family: remixicon !important;
    font-style: normal;
    font-size: 13px
}

.breadcrumb li a:after,
.moredata:after {
    content: "\ea60";
    font-family: remixicon !important;
    font-style: normal;
    margin-right: 4px
}

.views-div-api.hot::before {
    content: "\ED32";
    color: #ee260996;
    font-size: 18px
}

.topbar {
    border: none;
    line-height: 30px;
    display: flex;
    justify-content: center;
    width:calc(1288px - 300px)
}

.allstandings,
.moredata {
    line-height: 20px;
    text-decoration: none
}
.social-links {
    display: flex;
    margin-left: 18px;
  }
  
  .social-links a {
    width: 30px;
    height: 30px;
    text-align: center;
    text-decoration: none;
    color: #000;
    box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.05);
    margin: 0 5px;
    border-radius: 50%;
    position: relative;
    overflow: hidden;
    transition: transform 0.5s;
    line-height: 30px;;
  }
  
  .social-links a i {
    font-size: 20px;
    line-height:30px;
    position: relative;
    z-index: 10;
    transition: color 0.5s;
  }
  
  .social-links a::after {
    content: '';
    width: 100%;
    height: 100%;
    top: -90px;
    left: 0;
    background: #000;
    background: linear-gradient(-45deg, #ed1c3f, #ff1717);
    position: absolute;
    transition: 0.5s;
    z-index: 0;
  }
  
  .social-links a:hover::after {
    top: 0;
  }
  
  .social-links a:hover i {
    color: #fff;
  }
  
.logoInner {
    width:300px;
    display:flex
}

.allstandings {
    width: calc(100% - 20px);
    color: #606770;
    padding: 4px;
    display: block;
    border-radius: 4px;
    background: var(--bodywash);
    margin: 10px;
    text-align: center;
    color: #000000;
    border: 2px solid rgb(92 92 92);
    padding: 8px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    /* color: #ffffff; */
    background: #eefeff;
}

.allstandings:hover {
    transition: .2s ease-out;
    background: #e8eaed;
    color:#006eff
}

.tie-widget.widget {
    background: #fff;
    border-width: 0;
    padding: 0;
    position: relative;
    overflow: hidden;
    margin-bottom: 15px;
    border-radius: 5px;
    border-radius: max(0px, min(5px, calc((100vw - 2px - 100%) * 9999)))/5px;
    /* box-shadow: 0 1px 2px rgba(0, 0, 0, .2); */
    border: 1px #e6e6e6 solid;
}

#tie-weather-widget-13 {
    background: #5424fb;
    border-radius: 8px;
    background: -webkit-linear-gradient(135deg, #9836e6, #5424fb);
    background: -moz-linear-gradient(135deg, #9836e6, #5424fb);
    background: -o-linear-gradient(135deg, #9836e6, #5424fb);
    background: linear-gradient(139deg, #ffffff21, #fff);
    margin-bottom: 15px;
    border: 1px solid #e6e6e6;
    font-family: system-ui
}

.tie-widget .widget-title {
    position: relative;
    font-size: 17px;
    padding: 10px 10px 0;
    background-color: transparent;
    margin-bottom: 0;
    padding: 10px;
    /* background: #eeefff; */
    /* border-bottom: 1px #cac9c9 solid; */
    box-shadow: #dedede 0px 1px 9px 3px;
    background-image: linear-gradient(93deg, #ebf1facc, #ffffff)
}

.tie-user-location {
    position: absolute;
    font-size: 22px;
    display: block;
    top: 10px;
    right: 10px
}

.tie-user-location.has-title {
    top: 10px;
    left: 10px;
    z-index: 10;
    color: #000;
    display: none
}

.tie-user-location.has-title i {
    font-size: 40px;
    font-weight: 400;
    color: #000001
}

.tie-wrap {
    overflow: hidden;
    text-align: center;
    color: var(--color-black);
    font-family: system-ui
}

.tie-widget.widget .user-weather-error {
    position: absolute;
    width: 100%;
    top: 0
}

.widget-title .the-subtitle {
    font-size: 15px;
    min-height: 15px;
    width: 100%
}

.last-updated {
    width: 100%;
    font-size: 11px;
    color: #999;
}

.weather-todays-stats,
.widget-inner {
    width: calc(50% - 15px);
    margin-right: 15px
}

.tie-widget .widget-title .the-subtitle {
    font-size: 16px;
    color: #5a5a5a;
    margin: 0;
    padding: 0;
    font-weight: 500;
}

.moredata {
    position: absolute;
    left: 13px;
    top: calc(50% - 15px);
  
    color: #000710;
    border: 2px solid #dedede;
    padding: 2px 4px;
    display: block;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 400;
    /* color: #ffffff; */
    background-image: linear-gradient(0deg, #ffffff, #e8eaed);
    border-radius: max(0px, min(5px, calc((100vw - 2px - 100%) * 9999)))/5px;
    /* background: #ffffff; */
    min-width: auto;
}

.moredata:hover {
    transition: .2s ease-out;
    background: #e8eaed;


    border: 2px solid #c0d6db;
    
    /* color: #ffffff; */
    background-image: linear-gradient(0deg, #92c7d3, #92c7d3);
    color: #FFF

}

.moredata:after {
    float: left;
    line-height: 22px;
    font-size: 16px;
}
.moredata:hover:after {
    transition: .2s ease-out;

    float: left;
    line-height: 22px;
    font-size: 16px;
    color: #FFF
}

.widget-forecast-day-icon i {
    font-size: 40px;
    font-weight: 100;
    line-height: 50px;
    color: var(--color-gray)
}

.widget-forecast-item-icon i {
    font-size: 30px;
    /* font-weight: 100; */
    line-height: 50px;
    color: #000000;
}

.widget-title-icon {
    position: absolute;
    right: 0;
    top: 1px;
    color: #b9bec3;
    font-size: 15px
}

.tie-widget .widget-title span {
    font-weight: 400;
    font-size: 14px
}

.tie-widget-heading {
    display: flex;
    flex-direction: row;
    margin-top: 10px;
    margin-bottom: 5px;
    padding-bottom: 10px
}

.widget-inner {
    display: flex;
    padding: 0 10px;
    flex-direction: column
}

.tie-widget .widget-forecast-icon {
    position: relative;
    margin: 0 auto;
    font-size: inherit;
    width: auto;
    height: auto;
    line-height: initial
}

.tie-widget .widget-forecast-icon.main_ic {
    padding: 0;
    margin: 15px 0 0;
    text-align: center;
    display: flex;
    flex-direction: row
}

.tie-widget .widget-forecast-icon.main_ic svg {
    width: 40px;
    height: 40px;
    margin-left: 10px
}

.weather-name {
    font-size: 32px;
    padding-top: 5px;
    font-weight: 700;
    text-align: right
}

.weather-desc {
    font-size: 15px;
    padding-top: 5px;
    white-space: nowrap
}

.weather-todays-stats {
    padding: 0 10px
}

.weather-current-temp {
    font-size: 35px;
    font-weight: 700
}

.weather-current-temp sup {
    font-size: 12px;
    vertical-align: revert;
    font-weight: 500;
    color: #001d48
}

.weather-more-todays-stats {
    text-align: right;
    line-height: 1.6;
    font-size: 90%;
    padding-top: 12px;
    padding-left: 10px;
    font-weight: 500
}

.breadcrumb li a,
.tie-icon:before,
[class*=" tie-icon-"],
[class^=tie-icon-] {
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.weather-more-todays-stats .weather_highlow,
.weather-more-todays-stats .weather_humidty,
.weather-more-todays-stats .weather_wind {
    text-align: right;
    font-size: 15px
}

.weather-more-todays-stats div i {
    float: right;
    margin-left: 10px
}

.tie-icon:before,
[class*=" tie-icon-"],
[class^=tie-icon-] {
    speak: never;
    text-transform: none;
    font-family: tiefonticon !important;
    speak: never;
    font-style: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    display: inline-block
}

.weather-more-todays-stats [class*=" tie-icon-"]:before,
.weather-more-todays-stats [class^=tie-icon-]:before {
    width: 15px;
    display: inline-block;
    text-align: center
}

.comment-form-comment label,
.says,
.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden
}

.widget-forecast-outer {
    clear: both;
    padding: 9px 6px;
    overflow: hidden;
    display: flex;
    flex-direction: row
}

.widget-data-day,
.widget-forecast-day {
    width: 25%;
    display: flex;
    text-align: center;
    flex-direction: column
}

.widget-forecast-day .widget-forecast-icon svg {
    width: 26px;
    height: 26px
}

.widget-forecast-day-temp {
    font-size: initial;
    font-weight: 500;
    color: #878787
}

.widget-forecast-item-rate {
    font-size: initial;
    font-weight: bolder;
    color: var(--color-purple)
}

.widget-forecast-day-temp sup {
    font-size: 8px;
    padding-left: 2px
}

.widget-forecast-day-abbr,
.widget-forecast-item-iso {
    font-weight: initial;
    font-size: small;
    margin-top: 3px;
    line-height: 1.4;
    color: var(--color-gray)
}

.widget-forecast-day .widget-forecast-icon .basecloud:before,
.widget-forecast-day .widget-forecast-icon .icon-basecloud-bg:after,
.widget-forecast-day .widget-forecast-icon .icon-cloud:after {
    font-size: inherit;
    line-height: 1.05
}

.flexitem {
    display: flex;
    flex-direction: row
}

.flexitemdown,
.product-carousel__aside,
.sectioncategoryInner {
    display: flex;
    flex-direction: column
}

.product-carousel__aside {
    margin: 50px 0;
    z-index: 1;
    float: right;
    direction: rtl;
    text-align: center;
    align-items: center;
    position: absolute
}

.product-carousel__title {
    text-align: right;
    margin-bottom: 30px;
    display: block;
    display: flex;
    flex-direction: column
}

.homepage-featured-products-aside-title {
    -webkit-font-smoothing: antialiased;
    text-size-adjust: 100%;
    text-transform: uppercase;
    margin: 0;
    font-size: 20px;
    font-family: system-ui;
    font-weight: 500;
    color: #000
}

.product-carousel-cell,
.product-carousel-container {
    letter-spacing: 1.5px;
    font-family: Futura, sans-serif
}

.Topvisited_section {
    width: 100%;
    margin-bottom: 25px;
    visibility: visible;
    background: #41295a;
    background: -webkit-linear-gradient(to right, #2f0743, #41295a);
    background: linear-gradient(to right, #f5f5f5, #f1f1f1);
    display: inline-block
}

.product-carousel-container {
    background: #fff;
    justify-content: center;
    flex-wrap: nowrap;
    overflow: auto;
    height: 440px;
    line-height: 1.5;
    font-size: 100%;
    text-size-adjust: 100%;
    width: 100%;
    position: relative;
    margin-bottom: 0 !important
}

.flickity-next-button,
.flickity-prev-button {
    font-size: 35px;
    position: relative;
    color: #3e76f2;
    display: inline-block;
    height: 50px;
    padding: 8px;
    background: #fff;
    cursor: pointer;
    line-height: 35px;
    text-align: center;
    border-radius: 8px;
    border: 1px solid #e8eaed
}

.flickity-enabled.is-draggable {
    width: 80%;
    padding: 0;
    float: left;
    margin-top: 25px;
    margin-bottom: 25px
}

.flickity-prev-button svg {
    position: absolute;
    top: 15px;
    height: 20px;
    width: 20px;
    fill: #FFF
}

.product-carousel-cell {
    flex: 0 0 auto;
    border-radius: 5px;
    margin-right: 10px;
    background: #f5f5f5;
    height: 100%;
    min-height: 1px;
    counter-increment: gallery-cell;
    line-height: 1.5;
    font-size: 100%;
    width: 80%;
    border: 1px solid #e6e6e6
}

.ag-format-container {
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-direction: column
}

.ag-info_img-box {
    float: left;
    width: 100%;
    margin: 0 5% 0 0
}

.ag-info_box {
    float: right;
    height: 150px;
    width: 100%
}

.ag-grid_item:nth-child(odd) .ag-info_box {
    float: left
}

.ag-info_descr {
    display: table-cell;
    vertical-align: middle
}

.ag-info_title {
    font-weight: 700;
    font-size: 30px
}

.ag-info_text {
    line-height: 1.45;
    font-size: 16px
}

@media only screen and (max-width:767px) {
    .ag-format-container {
        width: 96%
    }
    .ag-grid__wrap {
        overflow: visible
    }
    .ag-grid_item:nth-child(odd) .ag-info_img-box,
    .ag-info_img-box {
        float: none;
        width: auto;
        margin: 0 0 20px
    }
    .ag-grid_item:nth-child(odd) .ag-info_box,
    .ag-info_box {
        float: none;
        height: auto
    }
}

@media (min-width:768px) and (max-width:979px) {
    .ag-format-container {
        width: 750px
    }
    .ag-info_box {
        height: 185px
    }
}

@media (min-width:980px) and (max-width:1161px) {
    .ag-format-container {
        width: 960px
    }
}

.article {
    display: flex;
    flex-direction: column;
    flex: 1;
    flex-basis: auto;
    background: #fff;
    color: #666;
    margin: 10px;
    box-shadow: 0 1px 3px rgb(0 0 0 / 12%), 0 1px 2px rgb(0 0 0 / 24%)
}

.article-image {
    background: #eee;
    display: block;
    position: relative;
    width: 100%;
    padding: 0;
    margin: 0
}

.article-image.is-16by9 {
    padding: 56.25% 0 0
}

.article-image.is-3by2 {
    padding-top: 66.6666%
}

.article-image img {
    display: block;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    position: absolute
}

.article-body {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 20px
}

.article-title {
    color: #333;
    flex-shrink: 0;
    font-size: 1.4em;
    font-weight: 600;
    line-height: 1.2
}

.article-content {
    flex: 1;
    margin-top: 5px;
    font-size: 15px
}

.article-info {
    display: flex;
    font-size: .85em;
    justify-content: space-between;
    margin-top: 10px
}

.flexing,
.main_Arti {
    flex-direction: column
}

.breadcrumb .md-select {
    width: auto
}

.breadcrumb {
    list-style: none;
    overflow: hidden;
    font: 16px system-ui;
    margin: 15px 0 0;
    padding: 0
}

.DtimingInfo,
.paid,
.timingInfo {
    font-family: system-ui
}

.breadcrumb li {
    float: right
}

.breadcrumb li a {
    text-decoration: none;
    position: relative;
    display: block;
    float: left;
    line-height: 25px;
    font-size: 15px;
    margin-left: 10px;
    font-size: 13px;
    color: #858585;
}

.breadcrumb li a:after {
    -webkit-font-smoothing: antialiased;
    float: left;
    line-height: 30px;
    font-size: 13px;
    color: #333;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

#slideImg:checked~.inner_part .content,
#slideImg:checked~.slider,
.breadcrumb li:last-child a::after,
.theme-switcher input,
.tocopy:last-child {
    display: none
}

.main_Arti .mImg,
.main_Arti.topviewssec {
    display: block;
    width: 100%;
    position: relative
}

.breadcrumb li a:hover {
    color: rgba(29, 29, 31, .75);
    transition: .3s ease-in-out
}

.main_Arti {
    width: 50%;
    margin-bottom: 8px;
    position: relative;
    display: flex;
    margin-top: 0
}

.DtimingInfo {
    color: rgba(0, 0, 0, .67);
    font-size: 14px;
    font-weight: 600;
    color: var(--color-gray);
    display: flex;
    flex-direction: row;
    margin-top: 10px;
    margin-bottom: 5px
}

.DtimingInfo i {
    margin-left: 2%;
    color: var(--color-gray);
    font-size: 17px;
    margin-top: 1px
}

.DtimingInfo a {
    color: var(--color-gray);
    line-height: 15px;
    padding: 3px 0 3px 8px
}

.DtimingInfo a:hover {
    color: var(--color-black);
    transition: .2s
}

.DtimingInfo a i,
.simi_main .timingInfoSIMI a i,
.timingInfo a i,
.timingInfoSIMI a i {
    color: var(--color-gray);
    margin: 3px;
    font-size: 19px
}

.timingInfo {
    color: rgba(0, 0, 0, .67);
    font-size: 13px;
    font-weight: 400;
    color: var(--color-gray);
    display: flex;
    flex-direction: row;
    margin-top: 5px
}

.main_Arti .mImg {
    height: 280px
}

.main_Arti img {
    width: 100% !important;
    box-shadow: 0 1px 2px rgb(0 0 0 / 20%);}

.timingInfo i,
.timingInfoSIMI i {
    margin-left: 2%;
    color: var(--color-gray);
    font-size: 15px
}

.timingInfo a {
    color: #1776f1;
    margin-left: 8px
}

.timingInfo div,
.timingInfoSIMI div {
    margin-left: 10px
}

.paid {
    position: absolute;
    right: 10px;
    bottom: 10px;
    line-height: 14px;
    font-size: 11px;
    font-weight: 400;
    color: #fff;
    border: 1px solid #f8f9fa;
    border-radius: 4px;
    padding: 0 5px 2px;
    background: #d6e0ea26;
    z-index: 3
}

.simi_main,
.simi_main.local {
    margin-bottom: 12px;
    padding-bottom: 12px;
    margin-top: 12px;
    box-shadow: 0 0 3px #ccc
}

.simi_main {
    width: calc(100% - 20px);
    display: inline-block;
    position: relative;
    height: 168px;
    background: #fff
}

.DtimingInfo a,
.simi_main a {
    transition: .4s;
    color: #2f2f2f;
    display: inline-block
}

.entery-desc a,
.simi_main .ssdata a,
.simi_main .stitle a {
    display: -webkit-box;
    -webkit-box-orient: vertical
}

.DtimingInfo a.ereaname,
.simi_main a.ereaname {
    background: #f5e4e6;
    color: #404040;
    padding: 3px 6px;
    border-radius: 5px;
    font-size: 12px;
    font-weight: 400
}

.DtimingInfo a.tag,
.simi_main a.tag {
    background: #e6e6e6;
    color: #404040;
    padding: 3px 6px;
    border-radius: 5px;
    font-size: 12px;
    font-weight: 400
}

.entery-title a,
.simi_main .stitle a {
    color: var(--color-black);
    font-weight: 600
}

.DtimingInfo a.tag:hover,
.simi_main a.tag:hover {
    background: #dad9d9
}

.DtimingInfo a.ereaname:hover,
.simi_main a.ereaname:hover {
    background: #f0dbdd
}

.flexing {
    display: flex;
    align-items: center
}

.sphr {
    border-bottom: 1px solid #eaeaea;
    height: 1px;
    width: 100%;
    display: inline-block;
    float: left;
    margin-bottom: 2%
}

.simi_main .imgarticle {
    position: absolute;
    top: 0;
    right: 0;
    height: 168px;
    width: 268px;
    z-index: 2
}

.simi_main .text,
.simi_main.local .text {
    position: absolute;
    z-index: 1;
    height: 100%;
    border-radius: 5px;
    width: 100%;
    top: 0;
    left: 0
}

.simi_main .imgarticle img {
    max-width: 100%;
    max-height: 100%;
    border-radius: 4px
}

.simi_main .text {
    padding-right: 288px;
    padding-left: 30px;
    background-image: linear-gradient(45deg, #ff000047, #00000029)
}

.simi_main.local .text {
    padding-right: 290px;
    padding-left: 5%;
    display: flex;
    flex-direction: column;
    background-image: none
}

.simi_main.local:nth-child(2) .text,
.simi_main.local:nth-child(4) .text {
    background-image: none
}

.simi_main.local .stitle {
    color: #39434e
}

.simi_main.local {
    width: 100%;
    display: inline-block;
    position: relative;
    height: 168px;
    background: #fff !important
}

.simi_main a img.article {
    width: 168px;
    float: right;
    border-left: 1px solid #fff
}

.simi_main .stitle a {
    font-size: 20px;
    overflow: hidden;
    line-height: 30px
}

.simi_main .ssdata {
    margin-top: 5px;
    width: 90%
}

.simi_main .ssdata a {
    color: #596065;
    font-size: 13px;
    font-weight: 400;
    overflow: hidden;
    line-height: 16px
}

.caption {
    margin: 15px 15px 0
}

.entery-title {
    margin: 0;
    font-family: Aljazeera;
    font-weight: 500;
    font-size: 26px;
    letter-spacing: 0;
    line-height: 25px;
    padding-left: 15px
}

.black-text,
.overlay-text-white {
    padding: 0;
    -webkit-tap-highlight-color: transparent !important;
    text-overflow: ellipsis !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important
}

.entery-title a {
    margin: 0;
    direction: RTL;
    letter-spacing: 0;
    padding-left: 10px;
    font-size: 23px;
    line-height: 33px;
    font-family: system-ui;
    -webkit-line-clamp: 4
}

.entery-title a h4 {
    font-weight: 600;
    font-size: 26px;
    letter-spacing: 0;
    line-height: 39px;
    font-family: system-ui;
    padding-right: 5px;
    padding-left: 5px;
    padding-bottom: 3px;
    display: inline;
    background: #d7374e;
    color: var(--bg-flat-gray);
    margin-left: 10px
}

.overlay-text-white {
    margin-right: 10px;
    margin-top: 10px;
    color: #fff;
    font-size: 19px;
    line-height: 25px;
    -webkit-line-clamp: 3;
    text-shadow: 1px 1px 1px #101010e8;
    width: 85%;
    font-family: system-ui
}

.black-text,
.entery-desc a {
    -webkit-line-clamp: 3;
    font-size: 16px;
}

.black-text {
    margin: 0;
    line-height: 21px;
    color: var(--color-black);
    -webkit-text-fill-color: var(--color-black)
}

.entery-desc {
    letter-spacing: 0;
    padding-left: 20px;
    margin: 10px 0 0;
    direction: RTL;
    font-weight: 400;
    font-family: system-ui;
    font-size: 14px;
    line-height: 20px
}

.entery-desc a {
    font-family: system-ui, apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    color: #595959;
    overflow: hidden;
    margin-bottom: 15px;
    line-height: 25px
}

.ticker-container {
    background: #0053f1
}

#hero-slides #footer #dribbble:after,
.card-video {
    background-size: contain;
    background-position: center
}

.categoryheading {
    justify-content: center;
    align-items: center;
    max-width: 1163px;
    margin: 0 auto;
    border-radius: 8px;
    padding: 0
}

.weathercard_section {
    padding: 0;
    margin: 0;
    box-sizing: inherit;
    font-size: 100%;
    font-family: var(--font-body);
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff
}

.weathercard_section ul {
    list-style: none
}

.weathercard_section button {
    font-family: inherit;
    border: none;
    background: 0 0;
    cursor: pointer
}

.categoryInner {
    width: 100%;
    display: flex;
    align-items: revert;
    border-radius: 10px;
    padding: 30px 0;
    margin: 0;
    flex-direction: column
}

.categoryInner div h1 {
    color: var(--color-black);
    margin: 0;
    direction: RTL;
    letter-spacing: 0;
    padding-left: 30px;
    font-size: 25px;
    line-height: 33px;
    font-family: system-ui;
    font-weight: 600
}

.weathercard_section .weathercard {
    background: #f2f2f296;
    width: 100%;
    display: flex;
    align-items: center;
    border-radius: 20px;
    margin: 10px;
    padding: 0 15px;
    border: 1px solid #f2f2f2
}

.simi_main .timingInfoSIMI a.tag,
.timingInfoSIMI .tagsimi {
    line-height: 14px;
    color: #fff;
    font-family: system-ui;
    background: #d6e0ea26;
    z-index: 3
}

.weathercard__info__date,
.weathercard__info__place {
    font-size: 14px;
    color: var(--primary-light);
    margin: 0
}

.weathercard__info__time {
    font-size: 20px;
    color: var(--primary);
    margin: 0
}

.weathercard__weather {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 25%
}

.weathercard__info {
    align-items: left;
    gap: 12px;
    width: 75%
}

.weathercard__weather__temp {
    font-size: 30px
}

.weathercard__weather__icon {
    animation: 1s ease-in-out infinite alternate move
}

@keyframes move {
    to {
        transform: translateY(-10px)
    }
}

video::-webkit-media-controls {
    display: none !important
}

.container {
    padding: 50px;
    display: flex;
    align-items: center;
    justify-content: center
}

.v_card {
    width: 100%;
    min-height: 500px;
    box-shadow: 0 5px 10px 0 #f8f8f8;
    transition: .2s linear
}

.v_card:hover {
    box-shadow: 0 5px 20px 0 #ededed
}

.card-content {
    margin: 20px 10px 20px 20px
}

.card-video {
    position: relative;
    height: 210px;
    overflow: hidden;
    background-repeat: no-repeat;
    background-color: #e9eef1;
    transition: .3s linear
}

.card-info-options .btn-share {
    font-size: 28px
}

.card-video:hover {
    cursor: pointer;
    height: 260px
}

.card-video-duration,
.card-video-views {
    position: absolute;
    transition: .3s linear;
    background: #fff;
    bottom: 10px;
    right: 10px;
    padding: 5px 10px
}

.card-video-duration {
    opacity: 0;
    color: #474646
}

.card-video-duration-show {
    opacity: .5
}

.card-video-views {
    border-radius: 5px;
    opacity: 0
}

.card-video-views-show {
    opacity: .8
}

.card-info-title {
    flex-grow: 1;
    margin: 0;
    font-size: 18px
}

.card-info-options {
    display: flex;
    flex-direction: column;
    color: #c8c8c8;
    font-size: 28px
}

.card-info-options:hover {
    opacity: .5;
    cursor: pointer
}

.card-info-options-dot {
    padding: 3px;
    margin-top: 5px;
    background: #c8c8c8;
    border-radius: 50%
}

.card-meta {
    display: flex;
    align-items: center;
    margin-top: 10px;
    margin-bottom: 10px
}

.card-tag {
    overflow: hidden;
    color: var(--color-black);
    background: #f2f2f2;
    padding: 5px 15px;
    margin-left: 10px;
    border-radius: 20px;
    transition: .1s linear;
    font-size: 15px
}

.card-tag:hover {
    cursor: pointer;
    opacity: .7
}

.card-tag-hide {
    width: 0;
    margin: 0;
    padding: 0
}

.card-uploader {
    color: #65c0fd;
    text-decoration: none;
    font-size: 15px
}

.card-uploader:hover,
a.channel:hover {
    text-decoration: underline
}

.content-profile-page {
    margin: 0 auto;
    width: 100%
}

.card {
    background: #fff;
    border-radius: .3rem
}

.profile-user-page .img-user-profile {
    margin: 0 auto;
    text-align: center
}

.profile-user-page .img-user-profile .profile-bgHome {
    width: 100%;
    height: 100px
}

.profile-user-page .img-user-profile .avatar {
    margin: -10em auto 0;
    background: #fff;
    width: 7em;
    height: 7em;
    padding: .25em;
    border-radius: .4em;
    box-shadow: 0 0 .1em rgba(0, 0, 0, .35)
}

.profile-user-page button {
    position: absolute;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    width: 7em;
    background: #3498db;
    border: 1px solid #2487c9;
    color: #fff;
    outline: 0;
    border-radius: 0 .6em .6em 0;
    padding: .8em;
    display: none
}

.timingInfoSIMI {
    margin: 0;
    font-size: 12px;
    font-family: system-ui;
    font-weight: 600;
    color: #f2f2f2
}

#info,
#options-view-button:checked+#select-button #chevrons i {
    color: #2d3667
}

.timingInfoSIMI .tagsimi {
    font-size: 11px;
    font-weight: 400;
    border: 1px solid #4848481f;
    border-radius: 4px;
    padding: 0 5px 2px;
    margin-left: 10px
}

.simi_main .timingInfoSIMI a.tag {
    position: relative;
    font-size: 14px;
    font-weight: 600;
    border: 1px solid #f8f9fa;
    border-radius: 4px;
    padding: 3px 6px;
    margin-left: 5px;
    float: right;
    background-color: #f2f2f2;
    color: rgb(0 0 0 / 82%);
    border: 1px solid #80808075
}

.profile-user-page button:hover {
    background: #51a7e0;
    transition: background .2s ease-in-out;
    border: 1px solid #2487c9
}

.profile-user-page .description-profile,
.profile-user-page .user-profile-data {
    text-align: center;
    padding: 0 1.5em
}

.profile-user-page .user-profile-data h1 {
    font-family: Lato, sans-serif;
    margin-top: 10px;
    color: #292f33;
    margin-bottom: 0;
    font-size: 25px
}

.profile-user-page .user-profile-data p {
    font-family: Lato, sans-serif;
    color: #8899a6;
    font-size: 1.1em;
    margin-top: 0;
    margin-bottom: .5em
}

.profile-user-page .description-profile {
    color: #75787b;
    font-size: .98em
}

.profile-user-page .data-user {
    font-family: Quicksand, sans-serif;
    margin-bottom: 0;
    cursor: pointer;
    padding: 0;
    list-style: none;
    display: table;
    width: 100.15%
}

.profile-user-page .data-user li {
    margin: 0;
    padding: 0;
    width: 33.33334%;
    display: table-cell;
    text-align: center;
    border-left: .1em solid transparent
}

.profile-user-page .data-user li:first-child {
    border-left: 0
}

.profile-user-page .data-user li:first-child a {
    border-bottom-left-radius: .3rem
}

.profile-user-page .data-user li:last-child a {
    border-bottom-right-radius: .3rem
}

.profile-user-page .data-user li a {
    background-color: #f7f7f7;
    border-top: 1px solid rgba(242, 242, 242, .5);
    border-bottom: .2em solid #f7f7f7;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .4), 0 1px 1px rgba(255, 255, 255, .4);
    padding: .93em 0;
    color: #46494c
}

.profile-user-page .data-user li a span,
.profile-user-page .data-user li a strong {
    font-weight: 600;
    line-height: 1
}

.profile-user-page .data-user li a strong {
    font-size: 2em
}

.profile-user-page .data-user li a span {
    color: #717a7e
}

.profile-user-page .data-user li a:hover {
    background: rgba(0, 0, 0, .05);
    border-bottom: .2em solid #3498db;
    color: #3498db
}

footer h4 {
    display: block;
    text-align: center;
    font-family: Coda, sans-serif;
    color: #566965;
    line-height: 6;
    font-size: 1em
}

footer h4 a {
    text-decoration: none
}

#rootposter {
    visibility: visible;
    width: 100%;
    display: flex;
    flex-direction: column
}

.spinnerDots {
    width: 70px;
    text-align: center
}

.spinnerDots>div {
    background-color: #cacaca;
    border-radius: 100%;
    display: inline-block;
    width: 14px;
    height: 14px;
    -webkit-animation: 1.4s ease-in-out infinite both rk-bouncedelay;
    animation: 1.4s ease-in-out infinite both rk-bouncedelay
}

.spinnerDots .dots1 {
    -webkit-animation-delay: -.32s;
    animation-delay: -.32s
}

.spinnerDots .dots2 {
    -webkit-animation-delay: -.16s;
    animation-delay: -.16s
}

@-webkit-keyframes rk-bouncedelay {
    0%,
    100%,
    80% {
        -webkit-transform: scale(0)
    }
    40% {
        -webkit-transform: scale(1)
    }
}

@keyframes rk-bouncedelay {
    0%,
    100%,
    80% {
        -webkit-transform: scale(0);
        transform: scale(0)
    }
    40% {
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

.notfic {
    background: var(--component-bg);
    width: 30%;
    max-width: 300px;
    border-radius: 8px;
    border: 1px solid var(--component-border);
    box-shadow: 0 2px 5px rgba(0, 0, 0, .05), 0 8px 16px rgba(0, 0, 0, .05);
    transition: none;
    position: fixed;
    left: 30px;
    bottom: 30px;
    z-index: 80;
    padding: 10px
}

#option-bg,
.label,
.option {
    transition: .3s
}

.notfic .notfic__header {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.notfic .title {
    display: flex;
    align-items: center;
    margin: 0
}

.notfic .title__wordmark {
    display: inline-block;
    color: var(--gray-dark);
    font-size: 16px;
    font-family: system-ui
}

.notfic .title__icon {
    width: 1em;
    height: 1em;
    background: #ed1b24;
    margin-left: 1rem;
    border-radius: 5px;
    line-height: 1em;
    color: var(--gray-lightest)
}

.notfic .notfic .title__wordmark {
    font-weight: 600
}

.notfic .action {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    text-align: center;
    line-height: 1;
    transition: .1s ease-out;
    position: relative;
    z-index: 200;
    background: 0 0;
    border: 0
}

.notfic .action:before {
    content: "";
    position: absolute;
    background: var(--pink);
    opacity: .2;
    width: 0;
    height: 0;
    display: block;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 100;
    border-radius: 50%;
    transition: .2s ease-out
}

.notfic .action__icon {
    width: 2rem;
    height: 2rem;
    color: var(--text-color)
}

.notfic .action__label {
    font-size: 1.6rem;
    color: var(--gray-light)
}

.notfic .action__container {
    display: flex;
    align-items: center;
    justify-content: flex-end
}

.action:focus,
.action:focus .action__label,
.notfic .action:active .action__label,
.notfic .action:hover {
    color: var(--pink)
}

.action:focus:before,
.notfic .action:hover:before {
    width: 45px;
    height: 45px;
    transition: .2s ease-out
}

.action:focus .action__icon,
.notfic .action:active .action__icon {
    color: var(--pink);
    fill: var(--pink)
}

.animation {
    z-index: 0;
    position: fixed;
    top: 50%;
    left: 50%;
    width: 480px;
    height: 390px
}

#app-cover,
#chevrons,
#info,
#options,
.animation__item,
.option i,
.options {
    position: absolute
}

.animation__item {
    width: 2rem;
    height: 2rem;
    -webkit-animation: 1s ease-out forwards centerIn;
    animation: 1s ease-out forwards centerIn
}

@-webkit-keyframes centerIn {
    from {
        left: 50%;
        top: 50%;
        bottom: 50%;
        right: 50%;
        transform: translate(-50%, -50%) rotate(-315deg);
        opacity: 1
    }
    to {
        transform: initial;
        opacity: 0
    }
}

@keyframes centerIn {
    from {
        left: 50%;
        top: 50%;
        bottom: 50%;
        right: 50%;
        transform: translate(-50%, -50%) rotate(-315deg);
        opacity: 1
    }
    to {
        transform: initial;
        opacity: 0
    }
}

#options-view-button:checked~#options,
.brd {
    border: 1px solid #e2eded;
    border-color: #eaf1f1 #e4eded #dbe7e7
}

.option:first-child input[type=radio]:checked~.label:before,
.option:first-child:hover~#option-bg {
    background-color: #000;
    border-radius: 4px 4px 0 0
}

#info {
    top: 0;
    right: 0;
    left: 0;
    font-size: 16px;
    text-align: center;
    padding: 14px;
    background-color: #f3f9f9
}

#options,
#select-button,
.opt-val {
    background-color: #fff
}

#app-cover {
    top: 0;
    right: 0;
    left: 0;
    width: 300px;
    height: 42px;
    margin: 100px auto 0;
    z-index: 1
}

#select-button {
    position: relative;
    height: 16px;
    padding: 12px 14px;
    border-radius: 4px;
    cursor: pointer
}

#options-view-button {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 3
}

#selected-value {
    font-size: 16px;
    line-height: 1;
    margin-right: 26px
}

.option i {
    width: 16px;
    height: 16px;
    left: 14px;
    padding: 0;
    display: none
}

.label,
.option {
    color: #2d3667;
    font-size: 16px
}

#chevrons {
    top: 0;
    right: 0;
    bottom: 0;
    width: 12px;
    padding: 9px 14px
}

#chevrons i {
    display: block;
    height: 50%;
    color: #d1dede;
    font-size: 12px;
    text-align: right
}

.options {
    left: 0;
    width: 250px
}

.s-c,
input[type=radio] {
    width: 100%;
    height: 50%;
    left: 0
}

#options {
    top: 42px;
    right: 0;
    left: 0;
    width: 298px;
    margin: 0 auto;
    border-radius: 4px
}

.option {
    position: relative;
    line-height: 1;
    z-index: 2
}

#option-bg,
.opt-val,
.s-c,
.ticker-container ul div,
input[type=radio] {
    position: absolute
}

#options-view-button:checked~#options .option i {
    display: block;
    padding: 12px 0
}

.label {
    display: none;
    padding: 0;
    margin-left: 27px
}

#options-view-button:checked~#options .label {
    display: block;
    padding: 12px 14px
}

.s-c.top {
    top: 0
}

.s-c.bottom {
    bottom: 0
}

input[type=radio] {
    right: 0;
    margin: 0;
    opacity: 0;
    cursor: pointer
}

.s-c:hover~i {
    color: #fff;
    opacity: 0
}

.s-c:hover {
    height: 100%;
    z-index: 1
}

.s-c.bottom:hover+i {
    bottom: -25px;
    animation: .3s .1s forwards moveup
}

.s-c.top:hover~i {
    top: -25px;
    animation: .3s .1s forwards movedown
}

@keyframes moveup {
    0% {
        bottom: -25px;
        opacity: 0
    }
    100% {
        bottom: 0;
        opacity: 1
    }
}

@keyframes movedown {
    0% {
        top: -25px;
        opacity: 0
    }
    100% {
        top: 0;
        opacity: 1
    }
}

.opt-val {
    left: 14px;
    width: 217px;
    height: 21px;
    opacity: 0;
    transform: scale(0)
}

.option input[type=radio]:checked~.opt-val {
    opacity: 1;
    transform: scale(1)
}

.option input[type=radio]:checked~i {
    top: 0;
    bottom: auto;
    opacity: 1;
    animation: unset
}

.option input[type=radio]:checked~.label:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1
}

#options-view-button:not(:checked)~#options .option input[type=radio]:checked~.opt-val {
    top: -30px
}

.option:first-child input[type=radio]:checked~.opt-val {
    top: -31px
}

.option:nth-child(2) input[type=radio]:checked~.label:before {
    background-color: #ea4c89
}

.option:nth-child(2) input[type=radio]:checked~.opt-val {
    top: -71px
}

.option:nth-child(3) input[type=radio]:checked~.label:before {
    background-color: #0057ff
}

.option:nth-child(3) input[type=radio]:checked~.opt-val {
    top: -111px
}

.option:nth-child(4) input[type=radio]:checked~.label:before {
    background-color: #32c766
}

.option:nth-child(4) input[type=radio]:checked~.opt-val {
    top: -151px
}

.option:nth-child(5) input[type=radio]:checked~.label:before {
    background-color: #f48024
}

.option:nth-child(5) input[type=radio]:checked~.opt-val {
    top: -191px
}

.option:nth-child(6) input[type=radio]:checked~.label:before {
    background-color: #006400;
    border-radius: 0 0 4px 4px
}

.option:nth-child(6) input[type=radio]:checked~.opt-val {
    top: -231px
}

.option .fa-dribbble {
    color: #ea4c89
}

.option .fa-behance {
    color: #0057ff
}

.option .fa-hackerrank {
    color: #32c766
}

.option .fa-stack-overflow {
    color: #f48024
}

.option .fa-free-code-camp {
    color: #006400
}

#option-bg {
    top: 0;
    right: 0;
    left: 0;
    height: 40px;
    z-index: 1;
    display: none
}

.option:first-child:hover~#option-bg {
    top: 0
}

.option:nth-child(2):hover~#option-bg {
    top: 40px;
    background-color: #ea4c89
}

.option:nth-child(3):hover~#option-bg {
    top: 80px;
    background-color: #0057ff
}

.option:nth-child(4):hover~#option-bg {
    top: 120px;
    background-color: #32c766
}

.option:nth-child(5):hover~#option-bg {
    top: 160px;
    background-color: #f48024
}

.option:nth-child(6):hover~#option-bg {
    top: 200px;
    background-color: #006400;
    border-radius: 0 0 4px 4px
}


.paywall-greetings {
    height: 36px;
    position: relative;
    width: 100%;
    display: block !important;
    padding: 0 !important
}

.paywall-greetings div {
    padding: 0 !important;
    position: relative;
    width: auto;
    display: flex;
    flex-direction: row;
}

.unknown-user {
    color: #2225b9;
    font-weight: 700;
    font-size: 4.5vw;
    padding-right: 13px;
    float: right
}

.unknown-user span {
    color: #404040;
    font-size: 14px;
    padding-right: 28px;
    font-family: system-ui;
    font-weight: 600;
}

.unknown-user object {
    width: 25px;
    position: absolute;
    right: 0;
    top: 2px
}

@media (max-width :500px) {
    .widget-forecast-item-icon i {
        font-size: 50px;
        /* font-weight: 100; */
        line-height: 50px;
        color: #000;
        font-weight: normal;
    }
    body {

        --slides-per-page: 1;
        background-color: #FFF;
    }
    .iconText {
        padding: 0px 5px;
    }
    .iconText span {
       display:none
    }
    .dropFirma{
        display:none
     }
     .last-updated {
        color: #595959;
        font-weight: 100;
        margin-top: 2px;
    }
    .tie-widget .widget-title .the-subtitle {
        color: #000;
        font-size: 17px;
    
    }
    .tie-widget .widget-title {
    
        background-image:linear-gradient(93deg, #f2f2f2, #fffefb)
    }
    header.blockedbar {
       background:#FFF
    }
    .topviewed_title a {
        color: var(--color-black);
    text-decoration: none;
    line-height: 23px;
    font-size: 16px;
    font-weight: 500;


    }
    .a-number {
     
        border: 2px #0081ff solid;
    }
    header.blockedbar .inner .d_left .social-links {
        display: none;

    }
    .moredata {
        border: none;
        padding: 5px 8px;
        color: #ffffff;
        font-size: 14px;
        font-weight: 400;
        /* color: #ffffff; */
        background-image: linear-gradient(45deg, #da3a3f, #fc404b);
        /* background: #ffffff; */
    }
    header.blockedbar .inner .d_left {
    width: auto;
    margin-left: 10px;
}
   header.blockedbar .inner .d_center {
        display:none
    }
    .categoryheading {
        justify-content: center;
        align-items: center;
        max-width: 1163px;
        margin: 0 auto;
        border-radius: 8px;
        padding: 10px;
        background: #f8f9fa;
    }
    .categoryInner {
        width: 100%;
        display: flex;
        align-items: revert;
        border-radius: 10px;
        padding: 30px 0;
        margin: 0;
        flex-direction: column;
        font-size: 12px;
        background: #f2f2f2;
        padding: 10px;
        /* box-shadow: rgb(222 222 222) 0px 1px 4px 0px; */
        border: 1px #e6e6e6 solid;
    }
    .categoryInner div h1 {
        color: var(--color-black);
        margin: 0;
        direction: RTL;
        letter-spacing: 0;
        padding-left: 30px;
        font-size: 20px;
        line-height: 33px;
        font-family: system-ui;
        font-weight: 600;
    }
    .breadcrumb {
        list-style: none;
        overflow: hidden;
        font: 10px system-ui;
        margin: 0;
        padding: 0;
    }
    #rootposter {
        visibility: visible;
        width: 100%;
        display: flex;
        flex-direction: column;
        padding: 10px;
        background: #f2f2f2;
    }
.ad_336x2802 {
    margin-bottom:25px;
    margin-top:25px;

}
.ad_300x2502 {
    margin-bottom:25px;
    margin-top:25px;
}
.ad_320x502{
    margin-bottom:25px;
    margin-top:25px;
}
.ad_1140x1302{
    margin-bottom:25px;
    margin-top:25px;
}
    .more-link {
        margin-top: 0px;
        margin: 10px;
    }
    .wdmm_washed {
        padding:0;
    }
    .followMeBar  {
    }
 
    .timingInfo,
    .timingInfo a.tag {
        font-weight: 600;
        font-family: system-ui
    }
    .entery-desc a,
    .entery-title a {
        -webkit-line-clamp: 4
    }
    .entery-desc,
    .entery-title a {
        letter-spacing: 0;
        direction: RTL
    }
    .floatbanner_left,
    .floatbanner_right,
    .searchbar,
    .small_table,
    .timingInfoSIMI,
    .tocopy:last-child,
    header.blockedbar .inner .date {
        display: none
    }
    .mai_news_section,
    .mai_news_section .resnews {
        width: 100%;
        display: block
    }
    .mai_news_section {
        visibility: visible;
        margin-top: 15px
    }
    .simi_main,
    .simi_main.local .stitle {
        margin-top: 0
    }
    .mai_news_section .general,
    .mai_news_section .localnews {
        width: 100%;
        padding-left: 0
    }
    .paywall-greetings {
        height: 36px;
        position: relative;
        width: calc(100% - 30px);
        border-top: 1px solid #eee;
        display: block !important;
        padding: 0 !important;
        margin-right: 15px;
        margin-left: 15px
    }
    .d_center,
    .onright {
        margin-right: 0;
        margin-left: 0
    }
    .unknown-user span {
        font-size: 12px;
        font-weight: 500
    }
    .desktop_main_articles {
        width: 100%;
        display: flex;
        visibility: visible;
        display: flex;
        flex-direction: column
    }
    .d_center {
        width: 100%;
        order: 1
    }
    .d_left {
        width: 100%;
        order: 3
    }
    .d_right {
        width: 100%;
        order: 2
    }
    .hrslides,
    .simi_main {
        width: 100%
    }
    #hero-slides #slides .slide .headline {
        font-size: 20px
    }
    .onright {
        padding-right: 0
    }
    #barba-left,
    #barba-right,
    #barba-wrapper,
    .scrollable-content,
    header.blockedbar .inner {
        width: 100%;
        padding: 0;
        margin: 0
    }
    .section.mainews_sec_desk {
        display: flex;
        flex-direction: column;
        gap: 25px
    }
    .g_footer {
        padding: 0;
        margin: 0
    }
    header.blockedbar .inner div.logo {
        margin: 0;
        order: 2;
        position: absolute;
        right: calc(50% - 45.5px);
    }
    .main-menu-dp {
        margin-right: 10px;
        }
    .main-menu-dp::before {
    display:none;
    margin-right: 10px;
    }
    .simi_main.local .text {
        padding-right: 178px;
        padding-left: 10px
    }
    .simi_main .stitle a {
        font-size: 14px
    }
    #body-barba,
    #body-left,
    .#body-barba {
        max-width: 100%;
        float: none;
        width: 100%;
        padding: 0;
        margin: 0
    }
    .notfic {
        background: var(--component-bg);
        width: calc(100% - 20px);
        max-width: calc(100% - 20px);
        border-radius: 8px;
        border: 1px solid var(--component-border);
        box-shadow: 0 2px 5px rgba(0, 0, 0, .05), 0 8px 16px rgba(0, 0, 0, .05);
        transition: none;
        position: fixed;
        left: 10px;
        bottom: 10px;
        z-index: 80;
        padding: 10px
    }
    .paid,
    .timingInfo a.tag {
        line-height: 14px;
        background: #d6e0ea26;
        z-index: 3
    }
    .main_Arti {
        width: 100%;
        margin-bottom: 8px;
        position: relative;
        display: flex;
        flex-direction: column
    }
    .timingInfo {
        margin: 0;
        color: rgba(0, 0, 0, .67);
        color: var(--color-gray);
        font-size: 12px;
        line-height: 28px;
    }
    .simi_main{
        margin-bottom: 15px;
        border-radius: 5px
    }
    .main_Arti .mImg {
        height: 280px
    }
    .timingInfo i {
        margin-left: 2%;
        color: var(--color-gray);
        font-size: 15px
    }
    .timingInfo a.tag {
        position: relative;
        font-size: 14px;
        color: #000;
        border: 1px solid #f8f9fa;
        border-radius: 4px;
        padding: 3px 6px;
        /* margin-left: 5px; */
        float: right;
        font-size: 14px;
        font-family: system-ui;
        position: relative;
        border: 2px #dedede solid;
        background-image: linear-gradient(0deg, #ffffff, #e8eaed);
        border-radius: max(0px, min(5px, calc((100vw - 2px - 100%) * 9999)))/5px;
        /* height: 30px; */
        line-height: 20px;
        display: flex;
    }
    .timingInfo a {
        color: var(--main-section-secondry)
    }
    .timingInfo a i {
        color: var(--color-gray);
        margin: 3px;
        font-size: 19px
    }
    .paid {
        position: absolute;
        right: 10px;
        bottom: 10px;
        font-size: 11px;
        font-weight: 400;
        color: #fff;
        border: 1px solid #f8f9fa;
        border-radius: 4px;
        font-family: system-ui;
        padding: 0 5px 2px
    }
    .overlay-text-white,
    .simi_main .stitle {
        line-height: 25px;
        font-family: system-ui
    }
    .simi_main,
    .simi_main:first-child,
    .simi_main:nth-child(3),
    .simi_main:nth-child(7) {
        background-image: linear-gradient(45deg, #ff5969, #e03e3e);
       
    }
    .simi_main.local{
        height: 100px;
    }
    .simi_main {
        width: calc(100% - 20px);
        display: inline-block;
        position: relative;
        height: 100px;
        box-shadow: -1px 4px 4px #dee2e6
    }
    .simi_main a {
        transition: .4s;
        color: #2f2f2f;
        display: inline-block
    }
    .simi_main:nth-child(2),
    .simi_main:nth-child(4) {
        background-image: linear-gradient(45deg, #001d48, #000)
    }
    .simi_main:nth-child(2) .text,
    .simi_main:nth-child(4) .text {
        background-image: linear-gradient(45deg, #00000047, #00000029)
    }
    .simi_main:nth-child(6) {
        background-color: #f6f6f6
    }
    .simi_main:nth-child(10),
    .simi_main:nth-child(12),
    .simi_main:nth-child(8) {
        background-color: #444
    }
    .simi_main:nth-child(11),
    .simi_main:nth-child(9) {
        background-color: #ff0606
    }
    .flexing {
        display: flex;
        flex-direction: column;
        align-items: center
    }
    .sphr {
        border-bottom: 1px solid #eaeaea;
        height: 1px;
        width: 100%;
        display: inline-block;
        float: left;
        margin-bottom: 2%
    }
    .simi_main .imgarticle {
        position: absolute;
        top: 0;
        right: 0;
        height: 100px;
        width: 168px;
        z-index: 2
    }
    .simi_main .imgarticle img {
        max-width: 100%;
        max-height: 100%;
        border-radius: 0 5px 5px 0;
        box-shadow: -1px 0 3px 0 #0000003b;
        border-left: .5px solid #767675
    }
    .simi_main .text {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        padding-right: 175px;
        padding-left: 13px;
        background-image: linear-gradient(45deg, #ff000047, #00000029);
        z-index: 1;
        height: 100%;
        border-radius: 5px
    }
    .simi_main a img.article {
        width: 168px;
        float: right;
        border-left: 1px solid #fff
    }
    .main_Arti img {
        width: 100% !important;
        box-shadow: -1px 4px 4px #c7c7c7;
        border-radius: 0
    }
    .tie-widget.widget {
        border-width: 0;
    padding: 0;
    position: relative;
    overflow: hidden;
    border: 1px solid #dedede;
    border-radius: max(0px, min(5px, calc((100vw - -11px - 100%) * 9999)))/5px;
    /* box-shadow: 0 1px 2px rgb(0 0 0 / 20%); */
    border: 1px #e6e6e6 solid;
    margin: 10px;
    }
    .tie-widget.widget.nonmobile {
        margin:0;
        border:0;
    }
    .black-text,
    .overlay-text-white,
    .simi_main .stitle {
        -webkit-tap-highlight-color: transparent !important;
        text-overflow: ellipsis !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        -webkit-line-clamp: 3
    }
    .simi_main .stitle {
        color: #f8f9fa;
        margin-top: 8px;
        width: 100%;
        float: left;
        position: relative;
        font-size: 16px;
        font-weight: 600;
        -moz-outline-style: none;
        text-align: right
    }
    .simi_main .ssdata {
        font-size: 13px;
        font-weight: 400;
        color: #717171;
        line-height: 1.3;
        float: left;
        width: 100%;
        font-family: tahoma;
        margin-top: 2%;
        margin-left: 1%;
        text-decoration: none;
        display: none
    }
    .caption {
        margin: 15px 15px 0
    }
    .entery-title a {
        color: var(--color-black);
        margin: 0;
        padding-left: 0;
        font-size: 25px;
        line-height: 33px;
        font-family: system-ui;
        font-weight: 600
    }
    .overlay-text-white {
        padding: 0;
        margin-right: 10px;
        margin-top: 10px;
        color: #fff;
        font-size: 19px;
        text-shadow: 1px 1px 1px #101010e8;
        width: 85%
    }
    .black-text {
        padding: 0;
        margin: 0;
        font-size: 16px;
        line-height: 21px;
        color: var(--color-black);
        font-weight: 600
    }
    .entery-desc {
        padding-left: 20px;
        margin: 10px 0 0;
        color: var(--color-gray);
        font-weight: 400;
        font-family: system-ui;
        font-size: 16px;
        line-height: 20px
    }
}

#btn-repeat,
#btn-save,
#btn-suffle {
    margin-right: var(--b-pad)
}

@media (min-width:600px) {
    .section .hom_cat_bar {
        height: 40px;
        transition: bottom .2s ease-in-out;
        -webkit-transition: background-color .2s ease-out;
        position: relative;
        background: 0 0;
        margin-bottom: 0px;
        border-bottom: 1px #ff0000 solid;
    
    color: #000710;
    border: 2px solid #e8eaed;
    padding: 2px 4px;
    display: block;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    color: var(--color-purple);
    background: linear-gradient(45deg, #f1f1f1, #fff)
    }
    
    .section .hom_cat_bar .float-title {
        color: #202020
    }
    .floatbanner_left,
    .floatbanner_right {
        height: 600px;
        position: fixed;
        top: calc(50% - 300px);
        z-index: 1
    }
    .desktop_main_articles,
    .mai_news_section,
    .main_Arti,
    .section .hom_cat_bar {
        display: flex;
        display: flex
    }
    .timingInfo,
    .timingInfo a.tag {
        font-size: 14px;
        font-weight: 600
    }
    .entery-desc,
    .entery-title {
        letter-spacing: 0;
        direction: RTL
    }
    
    .regularitemsmall {
        margin: 0
    }
    .mai_news_section {
        width: 100%;
        visibility: visible;
        flex-direction: row;
        margin-top: 15px
    }
    .mai_news_section .general {
        width: 520px;
        padding-left: 25px
    }
    .mai_news_section .localnews {
        width: 430px;
        padding-left: 25px
    }
    .mai_news_section .resnews {
        width: calc(100% - 950px);
        display: flex;
        flex-direction: column
    }
    .mai_news_section .champions {
        width: 336px;
        margin-left: 0
    }
    .mai_news_section .champions_cc {
        width: 336px;
        margin-left: 25px
    }
    .mai_news_section .champions_aa {
        width: calc(100% - 672px);
        margin-left: 25px
    }
    .mai_news_section .threcc {
        width: calc(33% - 25px);
        margin-left: 25px
    }
    .mai_news_section .quarternews:last-child,
    .mai_news_section .threcc:last-child {
        width: 33%;
        margin-left: 0
    }
    .mai_news_section .quarternews {
        width: calc(25% - 25px);
        margin-left: 25px
    }
    .floatbanner_right {
        width: 160px;
        left: 0
    }
    .floatbanner_left {
        width: 120px;
        right: 0
    }
    .desktop_main_articles {
        visibility: visible;
        flex-direction: row;
        padding-top: 25px;
        margin: 0 auto;
        width: 1288px
    }
    .d_center_full {
        width: 100%;
        margin-right: 20px;
    }
    .d_center {
        width: calc(100% - 678px);
        margin-right: 20px;
        margin-left: 20px
    }
    .d_left {
        width: 338px
    }
    .d_right {
        width: 300px
    }
    .main_Arti {
        width: 100%;
        margin-bottom: 8px;
        position: relative;
        flex-direction: column;
        min-height: 472px;
    }
    .timingInfo {
        margin: 15px 0 0;
        color: rgba(0, 0, 0, .67);
        font-family: system-ui;
        color: var(--color-gray)
    }
    .paid,
    .timingInfo a.tag {
        line-height: 14px;
        color: #fff;
        background: #d6e0ea26;
        z-index: 3;
        font-family: system-ui
    }
    .main_Arti .mImg {
        height: 280px
    }
    .main_Arti img {
        width: 100% !important;
        box-shadow: -1px 4px 4px #c7c7c7
    }
    .timingInfo i {
        margin-left: 2%;
        color: var(--color-gray);
        font-size: 15px
    }
    .timingInfo a.tag {
        position: relative;
        border-radius: 4px;
        padding: 3px 6px;
        margin-left: 5px;
        float: right;
        color: rgb(0 0 0 / 82%)
    }
    .timingInfo a {
        color: var(--main-section-secondry)
    }
    .timingInfo a i {
        color: var(--color-gray);
        margin: 3px;
        font-size: 19px
    }
    .paid {
        position: absolute;
        right: 10px;
        bottom: 10px;
        font-size: 11px;
        font-weight: 400;
        border: 1px solid #f8f9fa;
        border-radius: 4px;
        padding: 0 5px 2px
    }
    .simi_main,
    .simi_main:first-child,
    .simi_main:nth-child(3),
    .simi_main:nth-child(7) {
        background-image: linear-gradient(45deg, #ce0317, #fc2323)
    }
    .simi_main {
        width: 100%;
        display: inline-block;
        position: relative;
        height: 100px;
        margin-bottom: 21px;
        margin-top: 0;
        border-radius: 5px;
        box-shadow: -1px 4px 4px #dee2e6
    }
    .simi_main a {
        transition: .4s;
        color: #2f2f2f;
        display: inline-block
    }
    .simi_main:nth-child(2),
    .simi_main:nth-child(4) {
        background-image: linear-gradient(45deg, #001d48, #000)
    }
    .simi_main:nth-child(2) .text,
    .simi_main:nth-child(4) .text {
        background-image: linear-gradient(45deg, #00000047, #00000029)
    }
    .simi_main:nth-child(6) {
        background-color: #f6f6f6
    }
    .simi_main:nth-child(10),
    .simi_main:nth-child(12),
    .simi_main:nth-child(8) {
        background-color: #444
    }
    .simi_main:nth-child(11),
    .simi_main:nth-child(9) {
        background-color: #ff0606
    }
    .flexing {
        display: flex;
        flex-direction: column
    }
    .sphr {
        border-bottom: 1px solid #eaeaea;
        height: 1px;
        width: 100%;
        display: inline-block;
        float: left;
        margin-bottom: 2%
    }
    .simi_main .imgarticle {
        position: absolute;
        top: 0;
        right: 0;
        height: 100px;
        width: 168px;
        z-index: 2
    }
    .simi_main.local .imgarticle {
        position: absolute;
        top: 0;
        right: 0;
        height: 168px;
        width: 268px;
        z-index: 2
    }
    .simi_main .imgarticle img {
        max-width: 100%;
        max-height: 100%;
        border-radius: 0 5px 5px 0;
        box-shadow: -1px 0 3px 0 #0000003b;
        border-left: .5px solid #767675
    }
    .simi_main .text {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        padding-right: 182px;
        padding-left: 18px;
        background-image: linear-gradient(45deg, #71717147, #1e080829);
        z-index: 1;
        height: 100%
    }
    .simi_main a img.article {
        width: 168px;
        float: right;
        border-left: 1px solid #fff
    }
    .tocopy:last-child {
        display: none
    }
    .simi_main .stitle,
    .simi_main.local .stitle {
        color: #f8f9fa;
        margin-top: 8px;
        width: 100%;
        float: left;
        position: relative;
        font-size: 16px;
        font-family: system-ui;
        line-height: 29px;
        font-weight: 600;
        -moz-outline-style: none;
        -webkit-tap-highlight-color: transparent !important;
        text-overflow: ellipsis !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        text-align: right;
        -webkit-line-clamp: 3
    }
    .simi_main .ssdata {
        font-size: 13px;
        font-weight: 400;
        color: #717171;
        line-height: 1.3;
        float: left;
        width: 100%;
        font-family: tahoma;
        margin-top: 2%;
        margin-left: 1%;
        text-decoration: none;
        display: none
    }
    .entery-title {
        color: var(--color-black);
        margin: 0;
        padding-left: 15px;
        font-size: 25px;
        line-height: 33px;
        font-family: system-ui;
        font-weight: 600
    }
    .black-text,
    .overlay-text-white {
        padding: 0;
        -webkit-tap-highlight-color: transparent !important;
        text-overflow: ellipsis !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        -webkit-line-clamp: 3
    }
    .overlay-text-white {
        margin-right: 10px;
        margin-top: 10px;
        color: #fff;
        font-size: 19px;
        line-height: 25px;
        text-shadow: 1px 1px 1px #101010e8;
        width: 85%;
        font-family: system-ui
    }
    .black-text {
        margin: 0;
        font-size: 15px;
        line-height: 19px;
        color: var(--color-black);
        font-weight: 600
    }
    .entery-desc {
        padding-left: 20px;
        margin: 10px 0 0;
        color: var(--color-gray);
        font-weight: 400;
        font-family: system-ui;
        font-size: 16px;
        line-height: 20px
    }
}

.menu-body a i,
.menu-header-title,
.theme-switcher label {
    color: var(--c-text-secondary)
}

.menu {
    width: 100%;
    background-color: var(--c-bg-primary);
    transition: background-color .15s
}

.menu-body a:hover,
.theme-switcher {
    background-color: var(--c-bg-secondary)
}

.menu-header {
    padding: 1rem
}

.menu-header-title {
    font-size: .875rem;
    margin-bottom: .375rem;
    font-weight: 500
}

.theme-switcher {
    border-radius: 10px;
    display: flex;
    padding: 0 3px;
    align-items: center;
    position: relative;
    overflow: hidden
}

.card_left,
.card_premuim {
    background: 0 0;
    height: 400px
}

.theme-switcher .slider {
    display: block;
    position: absolute;
    z-index: 1;
    width: calc((100% - 6px)/ 3);
    top: 3px;
    transform: translatex(-110%);
    bottom: 3px;
    border-radius: 6px;
    transition: .15s, transform .25s ease-out;
    background-color: var(--c-bg-button)
}

.theme-switcher input:first-of-type:checked~.slider {
    transform: translateX(0)
}

.theme-switcher input:nth-of-type(2):checked~.slider {
    transform: translateX(100%)
}

.theme-switcher input:nth-of-type(3):checked~.slider {
    transform: translateX(200%)
}

.theme-switcher label {
    position: relative;
    z-index: 2;
    width: calc(100% / 3)
}

.card_left img,
.card_premuim {
    width: 100%;
    position: relative
}

.theme-switcher label span {
    padding: 8px 0;
    border-radius: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: 500
}

.a-info,
.menu-body {
    flex-direction: column
}

.theme-switcher label svg {
    display: inline-block;
    margin-right: .5rem;
    width: 20px
}

.menu-body {
    display: flex;
    padding: .5rem;
    border-top: 1px solid var(--c-border-primary);
    transition: border-color .15s
}

.menu-body a {
    text-decoration: none;
    color: inherit;
    display: flex;
    align-items: center;
    padding: .625rem .5rem;
    border-radius: 4px;
    font-weight: 500;
    transition: .15s
}

.card_right h1,
.card_right__details ul li {
    font-family: Montserrat, sans-serif;
    font-weight: 400
}

.menu-body a i {
    margin-right: 1rem;
    transition: color .15s;
    font-size: 18px;
    margin-left: 12px
}

@media screen and (max-width:1430px) {
    .floatbanner_left,
    .floatbanner_right {
        display: none
    }
}

#lower-info,
#playlist,
.card_v,
.coronarow,
.video-con,
.video-li {
    display: flex
}

#linechart_material {
    max-width: 570px
}

#chart_div,
#linechart_material {
    position: relative;
    visibility: visible;
    direction: ltr;
    overflow-x: hidden;
    overflow-y: hidden
}

#bar-chart *,
#chart_div *,
#linechart_material * {
    visibility: visible;
    max-width: 570px
}

#bar-chart table,
#chart_div table {
    visibility: hidden;
    display: none;
    max-width: 570px
}

.card_premuim {
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    box-shadow: 0 20px 30px 3px rgba(0, 0, 0, .55)
}

.card_left {
    width: 40%;
    float: left;
    overflow: hidden
}

.card_left img {
    height: auto;
    border-radius: 10px 0 0 10px;
    -webkit-border-radius: 10px 0 0 10px;
    -moz-border-radius: 10px 0 0 10px
}

.card_right {
    width: 60%;
    float: left;
    background: #000;
    height: 400px;
    border-radius: 0 10px 10px 0;
    -webkit-border-radius: 0 10px 10px 0;
    -moz-border-radius: 0 10px 10px 0
}

.card_right h1 {
    color: #fff;
    text-align: left;
    font-size: 40px;
    margin: 30px 0 0;
    padding: 0 0 0 40px;
    letter-spacing: 1px
}

.card_right__details ul {
    list-style-type: none;
    padding: 0 0 0 40px;
    margin: 10px 0 0
}

.card_right__details ul li {
    display: inline;
    color: #e3e3e3;
    font-size: 14px;
    padding: 0 40px 0 0
}

.card_right__review p {
    color: #fff;
    font-family: Montserrat, sans-serif;
    font-size: 12px;
    padding: 0 40px;
    letter-spacing: 1px;
    margin: 10px 0;
    line-height: 20px
}

.card_right__button a,
.card_right__review a {
    color: #ffda00;
    font-family: Montserrat, sans-serif;
    text-decoration: none
}

.card_right__review a {
    font-size: 14px;
    padding: 0 0 0 40px;
    margin: 0
}

.card_right__button {
    padding: 0 0 0 40px;
    margin: 30px 0 0
}

.card_right__button a {
    border: 2px solid #ffda00;
    padding: 10px 10px 10px 40px;
    font-size: 12px;
    background: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/343086/COMdoWZ.png) 7% 50%/12px 12px no-repeat;
    border-radius: 5px;
    transition-property: all;
    transition-duration: .5s
}

.content,
.img img {
    opacity: 0;
    transition: .6s
}

.card_right__button a:hover {
    color: #000;
    background-color: #ffda00;
    background-image: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/343086/rFQ5dHA.png);
    background-size: 12px 12px;
    background-repeat: no-repeat;
    background-position: 10% 50%;
    cursor: pointer;
    transition-property: all;
    transition-duration: .5s
}

.arabtvNKg {
    background: #25303c;
    background: linear-gradient(90deg, #000 0, #0f0f0f 100%);
    box-shadow: 0px 0px 6px #c9c9c9;
}

#hero-slides {
    --page: 0;
    height: 680px;
    direction: RTL;
    overflow: hidden;
    position: absolute;
    right: 0;
    width: 100%
}

#hero-slides #header {
    height: 50px;
    line-height: 1;
    position: relative;
    padding-top: 20px;
    width: 270px;
    margin: 0 auto;
    display: flex;
    margin-top: 25px;
}
#hero-slides #header .moredata{
    left:0;
    top: 35px;
    position: absolute;
    left: 13px;
    top: 20px;
    color: #000710;
    border: 2px solid #545d6a;
    padding: 2px 4px;
    display: block;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    color: #d2d9f1;
}
#hero-slides #header .moredata::after {
    color:#ed1b24
}
#hero-slides #header #logo {
    text-align: center;
}
#hero-slides #header h1 {
    font-size: 22px;
    font-weight: 500;
    margin:0;
    margin-top:2px;
    color:#FFF;
    margin-left:5px;
    font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif
}

#hero-slides #header #menu {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    cursor: pointer;
    padding: 0 3vw
}

#hero-slides #header #menu:before {
    font-size: 1.75vh;
    content: "Play Demo";
    margin-right: .5em;
    text-transform: uppercase
}

#hero-slides #header #menu #hamburger .slice {
    background: #fff;
    height: .2vh;
    width: 1vw
}

#hero-slides #header #menu #hamburger .slice:not(:last-child) {
    margin-bottom: .5vh
}

#hero-slides #slides-cont {
    position: relative;
    --button-height: 6vh;
    --button-spacing: 0.2vh
}
.s-con {
    position: absolute;
    top: 520px;
    right: calc(50% - 63px);
}
#hero-slides #slides-cont .button {
    width: 50px;
    height: 50px;
    background: #ed1b24;
    position: relative;
    /* right: 5.375vw; */
    /* top: 38vh; */
    z-index: 2;
    cursor: pointer;
    border-radius: 50%;
    line-height: 50px;
    padding: 0;
    color: #FFF;
    font-size: 15px;
    float: right;
    margin:5px;
}

#hero-slides #slides-cont .button:after,
#hero-slides #slides-cont .button:before {
    line-height: 45px;
    position: absolute;
    margin-right: -.25vw;
    pointer-events: none;
    transform: scale(.75, 1.5);
    transition: 125ms ease-in-out
}

#hero-slides #slides-cont .button:before {
    right: 50%
}

#hero-slides #slides-cont .button:hover:after,
#hero-slides #slides-cont .button:hover:before {
    transition: 250ms ease-in-out
}

#hero-slides #slides-cont .button:hover:after {
    right: 50% !important;
    opacity: 1
}

#hero-slides #slides-cont #next {
  /*  margin-top: calc(-1 * (var(--button-height) + var(--button-spacing)))*/
}

#hero-slides #slides-cont #next:after,
#hero-slides #slides-cont #next:before {
    content: ">"
}

#hero-slides #slides-cont #next:after,
#hero-slides #slides-cont #prev:hover:before {
    right: 30%
}

#hero-slides #slides-cont #next:hover:before,
#hero-slides #slides-cont #prev:after {
    right: 70%
}

#hero-slides #slides-cont #prev {
   /* margin-top: var(--button-spacing);*/
    opacity: calc(var(--page) + .5);
    transition: opacity .5s
}

#hero-slides #slides-cont #prev:after,
#hero-slides #slides-cont #prev:before {
    content: "<"
}

#hero-slides #slides-cont #next-catch,
#hero-slides #slides-cont #prev-catch {
    width: 1vw;
    height: 6vh;
    position: absolute;
    top: 0;
    z-index: 0;
    right: 0
}

#hero-slides #slides {
    --slides-height: 430px;
    width: auto;
    height: var(--slides-height);
    font-size: 0;
    white-space: nowrap;
    position: absolute;
    transform: translate3D(calc(var(--page) * +80vw), 0, 0);
    transition: transform 1.5s cubic-bezier(.7, 0, .3, 1);
    margin-top:50px;
}

#hero-slides #slides .slide {
    display: inline-block;
    vertical-align: top;
    font-size: 1.5vw;
    width: 24em;
    height: var(--slides-height);
    margin-left: 46px;
    color: #fff;
    white-space: normal;
    word-break: break-word;
    position: relative;
    border-radius: max(0px, min(5px, calc((100vw - 2px - 100%) * 9999)))/5px;
    box-shadow: 0 1px 2px rgb(0 0 0 / 20%)
}
#hero-slides #slides .slide img {
    position: absolute;
    width:100%;
    height:100%;
    z-index:0;
    border-radius: max(0px, min(5px, calc((100vw - 2px - 100%) * 9999)))/5px;
    box-shadow: 0 1px 2px rgb(0 0 0 / 20%)
}

#hero-slides #slides .slide:before {
    content: "";
    display: block;
    background: linear-gradient(180deg, rgba(86, 97, 108, 0) 0, rgba(33, 52, 69, .7) 100%);
    opacity: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0
}

#hero-slides #slides .slide .number {
    position: absolute;
    top: 18px;
    right: 18px;
    font-size: 1.7em;
    font-weight: 700;
    text-shadow: 1px 1px 1px #000;
}

#hero-slides #slides .slide .number,
#hero-slides #slides .slide .number:after,
#hero-slides #slides .slide .number:before {
    vertical-align: middle
}

#hero-slides #slides .slide .number:after,
#hero-slides #slides .slide .number:before {
    display: inline-block;
    content: "";
    height: .133em;
    margin-top: -.2em;
    background: #fff
}

#hero-slides #slides .slide .number:before,
#hero-slides #slides .slide.hover .number:after,
#hero-slides #slides .slide:hover .number:after {
    width: 0;
    margin-right: 0
}

#hero-slides #slides .slide .number:after,
#hero-slides #slides .slide.hover .number:before,
#hero-slides #slides .slide:hover .number:before {
    width: 3em;
    margin-right: 1em;
    box-shadow: 1px 1px 1px #000;
}

#hero-slides #slides .slide .body {
    position: absolute;
    bottom: 2em;
    padding: 15px
}

#hero-slides #slides .slide .headline,
#hero-slides #slides .slide .location {
    position: relative;
    bottom: 0;
    cursor: default
}

#hero-slides #slides .slide .headline,
#hero-slides #slides .slide .link,
#hero-slides #slides .slide .location,
#hero-slides #slides .slide .number:after,
#hero-slides #slides .slide .number:before,
#hero-slides #slides .slide:before {
    transition: 375ms cubic-bezier(.7, 0, .3, 1)
}

#hero-slides #slides .slide .location {
    font-weight: 100;
    margin-bottom: 6px;
    transition-delay: 60ms;
    text-shadow: 1px 1px 1px #000;
}

#hero-slides #slides .slide .headline {
    font-size: 25px;
    font-weight: 600;
    transition-delay: 50ms;
    font-family: system-ui;
    text-shadow: 2px 2px 1px #000;
    z-index: 2;
}
#hero-slides #slides .slide::after {
    content: "";
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .8) 100%, rgba(0, 0, 0, .9) 100%);
    position: absolute;
    bottom: 0;
    height: 38%;
    width: 100%;
    pointer-events: none;
    z-index: 0;
}
#hero-slides #slides .slide .link {
    display: inline-block;
    background: #0d96f2;
    padding: .5em 1.25em;
    font-size: 1.33em;
    opacity: 0;
    position: absolute;
    bottom: -2em;
    pointer-events: none;
    transition-delay: 25ms;

    position: absolute;
    right: 10px;
    bottom: 10px;
    line-height: 19px;
    font-size: 13px;
    font-weight: 400;
    color: #fff;
    border: 1px solid #f8f9fa;
    border-radius: 4px;
    padding: 0 5px 2px;
    background: #d6e0ea26;
    z-index: 3
}

#hero-slides #slides .slide.hover:before,
#hero-slides #slides .slide:hover:before {
    opacity: 1
}

#hero-slides #slides .slide.hover .headline,
#hero-slides #slides .slide.hover .link,
#hero-slides #slides .slide.hover .location,
#hero-slides #slides .slide.hover .number:after,
#hero-slides #slides .slide.hover .number:before,
#hero-slides #slides .slide.hover:before,
#hero-slides #slides .slide:hover .headline,
#hero-slides #slides .slide:hover .link,
#hero-slides #slides .slide:hover .location,
#hero-slides #slides .slide:hover .number:after,
#hero-slides #slides .slide:hover .number:before,
#hero-slides #slides .slide:hover:before {
    transition: .5s cubic-bezier(.7, 0, .3, 1)
}

#hero-slides #slides .slide.hover .location,
#hero-slides #slides .slide:hover .location {
    transition-delay: 0;
    bottom: 4em
}

#hero-slides #slides .slide.hover .headline,
#hero-slides #slides .slide:hover .headline {
    transition-delay: 0.1s;
    bottom: 1.5em
}

#hero-slides #slides .slide.hover .link,
#hero-slides #slides .slide:hover .link {
    bottom: 0;
    opacity: 1;
    transition-delay: 250ms;
    pointer-events: auto
}

#hero-slides #footer {
    height: 12vh;
    font-size: 1vh
}

#hero-slides #footer #dribbble {
    border-radius: 2vh;
    position: absolute;
    bottom: 4vh;
    right: 4vh;
    transition: .3s cubic-bezier(.7, 0, .3, 1);
    padding-right: 1.5vh;
    display: none
}

#hero-slides #footer #dribbble:after,
#hero-slides #footer #dribbble:before {
    vertical-align: middle;
    transition: inherit
}

#hero-slides #footer #dribbble:before {
    display: inline;
    content: "View original Dribbble";
    font-size: 2vh;
    opacity: 0;
    transform: translate3D(-200px, 0, 0)
}

#hero-slides #footer #dribbble:after {
    content: "";
    display: inline-block;
    width: 4vh;
    height: 4vh;
    margin-right: 1vh;
    background-image: url(https://alca.tv/static/u/82fde61b-28ef-4f17-976e-8f1abb5a1165.png)
}

#hero-slides #footer #dribbble.hover,
#hero-slides #footer #dribbble:hover {
    background: #e94e89
}

#hero-slides #footer #dribbble.hover:before,
#hero-slides #footer #dribbble:hover:before {
    opacity: 1;
    transform: translate3D(0, 0, 0);
    transition-delay: 50ms
}

#hero-slides #footer #dribbble.hover:after,
#hero-slides #footer #dribbble:hover:after {
    filter: saturate(0%) contrast(200%) brightness(200%) invert(100%)
}

@media (min-width:1200px) and (max-width:1699px) {
    body {
        --slides-per-page: 3
    }
    #hero-slides #slides .slide {
        font-size: 1vw
    }
}

@media (min-width:1700px) {
    body {
        --slide-per-age: 4
    }
    #hero-slides #slides .slide {
        font-size: .75vw
    }
}

.col-xl-5 {
    flex: 0 0 41.6666666667%;
    max-width: 41.6666666667%
}

.status-title {
    margin-bottom: 1rem;
    color: #7d92bb;
    font-size: 1rem;
    font-family: Roboto, sans-serif;
    font-weight: 700;
    line-height: 1.2
}

.coronarow {
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px
}

.col-sm-4 {
    flex: 0 0 33.3333333333%;
    max-width: 33.3333333333%
}

.status-item .count {
    line-height: 1;
    font-size: 1.5rem
}

.status-item .title {
    font-size: .75rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: #7d92bb
}

.text-danger {
    color: #f86168 !important
}

.text-success {
    color: #3dca93 !important
}

.card_v {
    align-items: center;
    justify-content: center
}

.card_topvisited {
    position: relative;
    height: 350px;
    width: 100%;
    max-width: 850px;
    margin: auto;
    background-color: #fff;
    border-radius: 25px;
    box-shadow: 10px 0 50px rgba(0, 0, 0, .5)
}

.card_topvisited .inner_part {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 0 0 30px;
    height: 350px;
    position: absolute
}

#slideImg:checked~.inner_part {
    padding: 0;
    transition: .1s ease-in
}

.inner_part .img {
    height: 260px;
    width: 260px;
    overflow: hidden;
    flex-shrink: 0;
    border-radius: 20px;
    box-shadow: 0 10px 50px rgba(0, 0, 0, .2)
}

#slideImg:checked~.inner_part .img {
    height: 350px;
    width: 850px;
    z-index: 99;
    transition: .3s ease-in .2s
}

.img img {
    height: 100%;
    width: 100%;
    cursor: pointer
}

#slide_1:checked~.inner_part .img_1,
#slide_2:checked~.inner_part .img_2,
#slide_3:checked~.inner_part .img_3 {
    opacity: 1;
    transition-delay: .2s
}

.content {
    padding: 0 20px 0 35px;
    width: 530px;
    margin-left: 50px
}

#slide_1:checked~.inner_part .content_1,
#slide_2:checked~.inner_part .content_2,
#slide_3:checked~.inner_part .content_3 {
    opacity: 1;
    margin-left: 0;
    z-index: 100;
    transition-delay: .3s
}

.content .title {
    font-size: 30px;
    font-weight: 700;
    color: #0d0925;
    margin: 0 0 20px
}

.content .text {
    font-size: 19px;
    color: #4e4a67;
    margin: 0 auto 30px;
    line-height: 1.5em;
    text-align: justify
}

.content button {
    padding: 15px 20px;
    border: none;
    font-size: 16px;
    color: #fff0e6;
    font-weight: 600;
    letter-spacing: 1px;
    border-radius: 50px;
    cursor: pointer;
    outline: 0;
    background: #000;
    float: right
}

.content button:hover {
    background: #cecece;
    color: #000
}

.slider {
    position: absolute;
    bottom: 25px;
    left: 55%;
    transform: translateX(-50%);
    z-index: 1
}

.slider .slide {
    position: relative;
    height: 10px;
    width: 50px;
    background: #d9d9d9;
    border-radius: 5px;
    display: inline-flex;
    margin: 0 3px;
    cursor: pointer
}

.slider .slide:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    height: 100%;
    width: -100%;
    background: #000;
    border-radius: 10px;
    transform: scaleX(0);
    transition: transform .6s;
    transform-origin: left
}

#slide_1:checked~.slider .slide_1:before,
#slide_2:checked~.slider .slide_2:before,
#slide_3:checked~.slider .slide_3:before {
    transform: scaleX(1);
    width: 100%
}

.vvpremuim {
    margin: 0;
    padding: 0;
    font-family: sans-serif;
    background: var(--bg);
    width: 100%
}

.header,
.timeline {
    font-family: system-ui
}

a.channel {
    color: inherit;
    text-decoration: none
}

.title {
    color: var(--secondary);
    font-size: 15px;
    font-weight: 700
}

.sub-title {
    color: var(--grey);
    font-size: 13px
}

.icon-active {
    filter: sepia(100%) hue-rotate(150deg) saturate(400%)
}

#playlist {
    width: 80vw;
    height: 60vh;
    position: relative;
    margin: 0 auto
}

#video-dis {
    flex: 6.5;
    margin-right: 20px;
    background: #000
}

.video-li {
    flex: 3.5;
    padding: var(--b-pad);
    border-radius: 3px;
    flex-direction: column;
    background: var(--primary)
}

.li-collapsed {
    overflow: hidden;
    height: 40px
}

#vli-info {
    flex: 3;
    padding: 0 var(--b-pad) 0 var(--b-pad)
}

#li-titles {
    flex: 9
}

#li-titles div {
    padding-bottom: 5px
}

#drop-icon {
    flex: 1;
    cursor: pointer;
    background: url(https://user-images.githubusercontent.com/50569315/118832584-92350500-b8e2-11eb-8398-9a90a4615b98.png) center/50% no-repeat
}

#lower-info {
    padding-top: var(--b-pad)
}

#lower-info div {
    width: 40px;
    height: 40px;
    cursor: pointer
}

#btn-repeat {
    background: url(https://user-images.githubusercontent.com/50569315/118832591-93663200-b8e2-11eb-8b98-3b177304b555.png) left/50% no-repeat
}

#btn-suffle {
    background: url(https://user-images.githubusercontent.com/50569315/118832597-93fec880-b8e2-11eb-9146-f978064eddb1.png) left/45% no-repeat
}

#btn-save {
    margin-left: auto;
    order: 2;
    right: 10px;
    background: url(https://user-images.githubusercontent.com/50569315/118832594-93fec880-b8e2-11eb-8201-12cb52be231f.png) right/60% no-repeat
}

#vli-videos {
    flex: 7;
    overflow: auto
}

.video-con {
    cursor: pointer;
    padding: var(--s-pad);
    column-gap: var(--s-pad);
    margin-bottom: var(--b-pad)
}

.active-con,
.video-con:hover {
    background: var(--active)
}

.index {
    min-width: 15px;
    align-self: center
}

.thumb {
    width: 100px;
    height: 60px;
    background: var(--secondary)
}

.v-titles {
    flex: 6
}

.v-titles div:nth-child(2) {
    margin-top: var(--s-pad)
}

@media only screen and (max-width:1150px) {
    #playlist {
        width: 95vw;
        height: 60vh
    }
}

@media only screen and (max-width:950px) {
    #playlist {
        top: 10%;
        width: 50vw;
        margin: 0 auto;
        display: block;
        align-items: center;
        transform: translate(-50%, 0)
    }
    #video-dis {
        margin-bottom: var(--b-pad);
        width: 100%;
        height: 300px
    }
}

@media only screen and (max-width:800px) {
    #playlist {
        width: 60vw
    }
}

@media only screen and (max-width:650px) {
    #playlist {
        width: 80vw
    }
}

.small_table {
    background: #ddd;
    font-size: 13px;
    margin: 10px
}

table.data {
    border-collapse: collapse;
    overflow: hidden;
    font-size: 11px;
    width: 100%
}

table.data>tbody>tr {
    background-color: #f9f9f9
}

table.data th,
td {
    padding: 10px;
    border-bottom: 2px solid #fff
}

.css-mine {
    margin-top: 15px
}

@-webkit-keyframes gradient {
    0%,
    100% {
        background-position: 0 50%
    }
    50% {
        background-position: 100% 50%
    }
}

@keyframes gradient {
    0%,
    100% {
        background-position: 0 50%
    }
    50% {
        background-position: 100% 50%
    }
}

.timeline>li {
    margin-bottom: 60px
}

@media (min-width :640px) {
    .timeline>li {
        overflow: hidden;
        margin: 0;
        position: relative
    }
    .timeline-date {
        width: 150px;
        float: right;
        margin-top: 16px;
        text-align: center;
        font-weight: 700;
        color: #050505
    }
    .timeline-content {
        width: 84%;
        float: right;
        border-right: 1px solid rgb(226 226 226);
        padding-right: 30px;
        color: #050505;
        font-size: 19px;
        font-weight: 400
    }
    .timeline-content:before {
        content: '';
        width: 12px;
        height: 12px;
        background: #ff5969;
        position: absolute;
        right: 145px;
        top: 32px;
        border-radius: 100%
    }
}

.timeline-content p {
    font-weight: 400;
    color: #404040;
    font-size: 17px;
    line-height: 29px
}

.header {
    color: #000;
    position: relative;
    background: #f2f2f2;
    background: linear-gradient(180deg, #f2f2f2 0, #e1e1e1 100%);
    border-radius: 8px
}

.color-overlay {
    padding: 0;
    border-radius: 8px;
    box-sizing: border-box
}

.day-number {
    font-size: 4em;
    font-weight: 700;
    display: inline-block;
    margin-right: 15px
}

.day-name {
    font-size: 1.6em
}

.month {
    font-weight: 300;
    font-size: .9em;
    margin-top: 2px
}

.brid-branding {
    width: 80px;
    padding-top: 10px
}

.iconText {
    display: flex;
    font-size: 16px;
    font-family: system-ui;
    position: relative;
    border: 2px #dedede solid;
    background-image: linear-gradient(0deg, #ffffff, #e8eaed);
    border-radius: max(0px, min(5px, calc((100vw - 2px - 100%) * 9999)))/5px;
    height: 30px;
}
.iconText .topweatherIcon {
    font-size: 20px;
    color: #008dff;
    line-height: 18px;
}
.iconText .topweatherIcon svg{
    width: 23px;
    height: 23px;
    padding: 0px;
    margin-top: 2px;
}
.iconText small {
    font-size:17px;
    font-weight: 600;
    color:#000;
    line-height: 25px;
}
.iconText small::after {
  content: "\00B0";
}
.iconText span {
    font-size:13px;
    font-weight: 600;
    color:#000;
    line-height: 25px;


}
.iconText * {
    padding-right:2px;
    padding-left:1px;
}
.iconText  object {
    width: 22px;
    top: 2px
}
.dropFirma {
    font-size: 23px;
    padding-right:0px;
    padding-left:0px;
    line-height: 28px;

    position: relative;
}


.search {
    width: 100%;
    position: relative;
    display: flex;
    padding-left:25px;
    border-right: 1px #dedede solid;
    border-left: 1px #dedede solid;
    padding-right:25px
    
  }
  
  .searchTerm {
    width: 100%;
    border: 3px solid #dedede;
    border-left: none;
    padding: 5px;
    height: 30px;
    border-radius: 0 5px 5px 0;
    outline: none;
    color: #9DBFAF;
    line-height: 24px;
    font-family:system-ui;
    font-size:13px;
    padding-top:3px;    
  }
  
  .searchTerm:focus{
    color: #333;
  }
  
  .searchButton {
    width: 40px;
    height: 30px;
    border: 1px solid #dedede;
    background: #dedede;
    text-align: center;
    color: #fff;
    border-radius: 5px 0px 0px 5px;
    cursor: pointer;
    font-size: 20px;
    line-height: 24px;
    font-weight: 600;
  }
  .searchButton::after {
    content: "\F0D1";
    font-size: 20px;
    font-family: remixicon !important
  }
  

.ticker_holder {
    width: 100%;
}
.tie-widget .section {
    margin:10px;
    width: calc(100% - 20px);
}
.newsFlash {
 width: calc(100% - 195px);
   /* background:#000;*/
    margin:0 auto;

}
.owl-item { margin-right: 0;  font-size:15px;}

.css-1mqs9dn {
    border-radius: max(0px, min(5px, calc((100vw - 2px - 100%) * 9999)))/5px;
    width: 1288px;
    margin: 0 auto;
    -webkit-transition: background-color 0.7s;
    transition: background-color 0.7s;
    background-color: var(--white, #ffffff);
    margin-top: 25px;
    box-shadow: #dedede 0px 1px 9px 3px;
}
.css-goenzs {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 4px;
}
.css-goenzs .main {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    border-radius: 4px;
}
.css-goenzs .main header {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-left: 20px;
    background: #F00000;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #DC281E, #F00000);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #DC281E, #F00000); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    
    border-radius: 0 4px 4px 0px;
    
}
.css-goenzs .main header .pre {
    width: 135px;
    color: white;
    font-family: 'system-ui';
    font-size: 18px;
    margin-top: 25px;
    font-weight: 500;
}
.css-goenzs a {
    -webkit-text-decoration: none;
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}
.css-goenzs .main header .date {
    font-family: system-ui;
    font-size: 18px;
    margin-bottom: -7px;
    font-weight: 900;
    color:#f2f2f2;
}
.css-goenzs .main header .heb-date {
    font-family: 'almoni-medium',arial;
    font-size: 18px;
}
.css-goenzs .main .more {
    background: #F00000;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to right, #DC281E, #F00000);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to right, #DC281E, #F00000); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
        min-width: 39px;
    position: relative;
    color: #FFF;
    border-radius:  4px 0 0  4px;
 
}
.css-goenzs .main .more i{
    color:#FFF
}

/** to hide dots

.owl-theme .owl-dots .owl-dot{ display:none!important;}

**/
.ticker_outer {
    width: 100%;
    padding: 10px;
    display: flex;
    flex-direction: column;
    margin: 3px;
}
.ticker-date {
    width: 100%;
    float: right;
    margin-top: 16px;
    text-align: right;
    font-weight: 700;
    color: #d10606;
    margin:0;
}
.ticker-content {
    width: 100%;
    float: right;
    border-left: 1px solid rgb(226 226 226);
    padding-left: 10px;
    color: #050505;
    font-size: 13px;
    font-weight: 400
}
.ticker-content h3 {
    margin:0;
    font-size:14px;
}
.ticker-content:before {
    /*
    content: '';
    width: 12px;
    height: 12px;
    background: #ff5969;
    position: absolute;
    right: 145px;
    top: 32px;
    border-radius: 100%
    */
}


.ticker-content p {
font-weight: normal;
color: #404040;
font-size: 13px;
line-height: 16px;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
-webkit-font-smoothing: antialiased;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
margin-top:5px;
margin-bottom:0
}
.container{
    max-width: 700px;
    margin: 0 auto;
}

#content2{
    padding: 18px;
    margin-left: 358px;
    min-height: 600px;
    color: darkgrey;
}

#sidebar{
    float: left;
    width: 338px;
    will-change: min-height;
}

#sidebar .sidebar__inner{
    padding: 0;
    position: relative;
    transform: translate(0, 0);
    transform: translate3d(0, 0, 0);
    will-change: position, transform;
}
.sidebar{
    will-change: min-height;
}

.sidebar__inner{
    transform: translate(0, 0); /* For browsers don't support translate3d. */
    transform: translate3d(0, 0, 0);
    will-change: position, transform;
}
footer{
    height: 150px;
    height: 85vh;
    border: 1px dotted black;
    margin-top: 20px;
    text-align: center;
    color: #8e8d8d;
    line-height: 150px;
    line-height: 95vh;
    background: rgba(0, 0, 0, 0.02);
}

footer p{
    margin: 0;
}

.clearfix:after{
    display: block;
    content: "";
    clear: both;
}
.main2 {
    width: 1288px;
    margin:0 auto;
}