/* ============================================
   FARFESH PLUS - Main Desktop Stylesheet
   ============================================

   TABLE OF CONTENTS
   -----------------
   1.  CSS Variables
   2.  Reset & Base
   3.  Layout & Container
   4.  Navigation Bar
   5.  Header & Logo
   6.  Search
   7.  Homepage - Hero Articles
   8.  Article Zones & Grid
   9.  Video - Browser Strip & Player
   10. Series & Categories
   11. Content Sections & Cards
   12. Social & Comments
   13. Footer
   14. Typography - Text Classes
   15. Typography - Link Classes
   16. Pagination & Nav States
   17. Forms & Inputs
   18. Popup & Modals
   19. Slick Slider
   20. Ads & Banners
   21. Utility Classes
   22. Media Queries

   ============================================ */


/* ===========================================
   1. CSS VARIABLES
   To change the site palette, edit these.
   =========================================== */

:root {
    --gold: #FAA322;
    --gold-light: #fcc05a;
    --gold-dark: #e89218;
    --amber: #FAA322;
    --cream: #fff0dc;
    --cream-dark: #f0d8b0;
    --orange-bg: #FAA322;
    --orange-light: #fbb84a;

    --black: #000000;
    --white: #ffffff;
    --gray-100: #f0f2f5;
    --gray-200: #e1e3e7;
    --gray-300: #e0e0e0;
    --gray-400: #c6c7d2;
    --gray-500: #979797;
    --gray-600: #706f6f;
    --gray-700: #4e4e4f;
    --gray-bg: #e3e3e3;
    --body-bg: #1a1a1a;

    --navy: #003366;
    --dark-slate: #363a53;
    --dark-button: #484d67;
    --red: #d9414b;
    --red-active: #f64650;

    --text-dark: #232638;
    --text-nav: #393225;
    --text-gray: #6f6f6f;
    --text-white: #ffffff;

    --container-width: 760px;
    --nav-height: 52px;
    --series-box-width: 178px;

    --radius: 6px;
    --radius-sm: 4px;
    --radius-pill: 20px;

    --speed-fast: 0.15s ease;
    --speed: 0.2s ease;
    --speed-slow: 0.3s ease;

    --shadow-card: 0 2px 8px rgba(0,0,0,0.08);
    --shadow-card-hover: 0 8px 24px rgba(0,0,0,0.18);
    --gradient-dark-overlay: linear-gradient(transparent 40%, rgba(0,0,0,0.85) 100%);
    --gradient-strip-bg: linear-gradient(135deg, #4a3a28 0%, #3a2e1e 50%, #2e2316 100%);
}


/* ===========================================
   2. RESET & BASE
   =========================================== */

*{ padding:0; margin:0; outline:none; font-family:'arial'; font-synthesis:none; text-rendering:optimizeLegibility; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; box-sizing:border-box;}
*::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }
body { background-color: var(--body-bg); line-height: 1.5; overflow-y: scroll; }

ul { margin:0; padding:0; }
ul li { list-style:none; }
a { text-decoration:none; transition: color var(--speed), background-color var(--speed); }
a:hover { text-decoration:none; }
input, textarea { outline:none; transition: border-color var(--speed), box-shadow var(--speed); }
input { font-size: 13px; color: #555860; }

h1 {display: inline; margin:0; padding:0; text-decoration: none; font-size: 100%;}
h2 {display: inline; margin:0; padding:0; text-decoration: none; font-size: 100%;}
h3 {display: inline; margin:0; padding:0; text-decoration: none; font-size: 100%;}
h4 {display: inline; margin:0; padding:0; text-decoration: none; font-size: 100%;}
h5 {display: inline; margin:0; padding:0; text-decoration: none; font-size: 100%;}
h6 {display: inline; margin:0; padding:0; text-decoration: none; font-size: 100%;}

::selection { background: var(--gold); color: var(--black); }
::-moz-selection { background: var(--gold); color: var(--black); }


/* ===========================================
   3. LAYOUT & CONTAINER
   =========================================== */

.container { width: var(--container-width); float:center !important; padding:0; }
.row { margin:0 auto; width: var(--container-width); }

.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xs-1,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-10,.col-xs-11,.col-xs-12 { float:right; padding:0; }


/* ===========================================
   4. NAVIGATION BAR
   =========================================== */

.tab {
    width: var(--container-width); float: center;
    background: linear-gradient(180deg, #1a1a1a 0%, #0d0d0d 100%);
    padding: 0; margin: 0; list-style-type: none;
    height: var(--nav-height); z-index: 200;
    border-radius: var(--radius) var(--radius) 0 0;
    box-shadow: 0 2px 10px rgba(0,0,0,0.3);
    position: relative; overflow: hidden;
}
.tab > div[style*="float: left"] { position: absolute !important; left: 0; top: 0; float: none !important; height: 100%; z-index: 201; }
.tab button { background-color: transparent; float: right; border: none; outline: none; cursor: pointer; padding: 11px 8px 9px; transition: all 0.25s ease; font-size: 21px; color: rgba(255,255,255,1); font-weight: bold; letter-spacing: 0.3px; }
.tab button:hover { background-color: rgba(212,160,64,0.15); color: var(--gold); }
.tab button.active { background-color: rgba(212,160,64,0.12); color: var(--gold); border-bottom: 2px solid var(--gold); }
.tab button.inactive { background-color: inherit; }
.tab button img { opacity: 0.7; transition: opacity 0.25s; vertical-align: middle; }
.tab button:hover img { opacity: 1; }

.tabcontent { display: none; padding: 10px 0 6px; border: none; margin-bottom: 0 !important; font-size: 16px; background: linear-gradient(180deg, #2a2218 0%, #1e180f 100%); color: rgba(255,255,255,0.9); width: var(--container-width); float: center; border-radius: 0 0 var(--radius) var(--radius); box-shadow: 0 6px 20px rgba(0,0,0,0.25); }
.tabcontent p { margin: 0 12px 6px 12px; }
.tabcontent a.Link5a, .tabcontent a.Link5a:link, .tabcontent a.Link5a:visited { color: rgba(255,250,240,0.9) !important; transition: color var(--speed); }
.tabcontent a.Link5a:hover { color: var(--cream-dark) !important; }

/* Seasonal logo swaps: -Ramadan.jpg / .easter.jpg / farfeshplasxmasSmal.jpg */
.toplogobigbb { background-image: url('../../images/farfeshplasmasterlogo215x54.new.jpg'); background-repeat: no-repeat; background-size: contain; background-position: left center; display: block; width: 170px; height: var(--nav-height); cursor: pointer; z-index: 201; }

/* Submenu dropdown */
.drop_menu ul { position:absolute; right:-9999px; top:-9999px; list-style-type:none; z-index: 200; width: 100%; }
.drop_menu li ul { position:absolute; right:-9999px; top:-9999px; list-style-type:none; z-index: 200; width: 100%; margin-top: 4px; }
.drop_menu li:hover { position:relative; background:#4a4a49; font-family: arial; }
.drop_menu li:hover ul { right:0; top:42px; background:#ededed; padding:4px 0; z-index: 200; border-radius: 0 0 var(--radius) var(--radius); box-shadow: 0 6px 16px rgba(0,0,0,0.12); }
.drop_menu li:hover ul li a { display:block; width:168px; background-color:#ededed; z-index: 200; transition: background-color var(--speed-fast); padding: 6px 10px; }
.drop_menu li:hover ul li a:hover { background: var(--gold-light); z-index: 200; }

.dropbtn { background: none; padding: 0; border: medium none; color: white; cursor: pointer; font-size: 16px; height: 17px; text-align: center; width: 21px; }
.dropbtn:before{ content:url(../../images/toogle.png);}
.dropbtn.hclose:before{content:url(../../images/toggle-cross.png);}

.dropdown { position: static; display: inline-block; }
.dropdown-content { background-color: #faf3e8; box-shadow: 0 8px 24px rgba(0,0,0,0.15); left: 0; overflow: auto; position: absolute; right: 0; top: 62px; z-index: 11111; height:0; border-radius: 0 0 var(--radius) var(--radius); }
.dropdown-content.in { height:auto; }
.dropdown-content a { color: var(--black); padding: 0; text-decoration: none; display: block; transition: background var(--speed); }
.dropdown a:hover {background-color: #ecdcc4;}
.show {display:block;}

#navbar { background-color: var(--black); position: fixed; left: -250px !important; width: 300px; height: 250px; z-index: 9999999999; transition: left 2s; }


/* ===========================================
   5. HEADER & LOGO
   =========================================== */

.top-main{ direction:rtl; width:100%; height: 94px; background: var(--black); margin:0 auto; float: center; }
.top-main-left {width: 199px; height:90px; float: left; padding-top: 2px; background: #383838;}
.top-main-rigth-760 { width: 561px !important; height:90px; float: right; padding: 2px 2px 2px 0; margin:0 auto; text-align: right;}
.top-menue{ direction:rtl; width:100%; height: 90px; background: var(--black); margin:0 auto;}

.header { border-bottom: 1px solid #e3e3e3; padding:7px 0 8px; background:#fff; z-index:9999; position:relative;}
.header-new { border-bottom: 1px solid #e3e3e3; padding:13px 0; background:#fff; z-index:9999; float:center; position:fixed; margin:auto;}
.header-right { float: right;}
.header-left { direction: rtl; float: left; margin-top:11px;}
.header-middel { direction: rtl; margin-top:7px;}
.toggle-btn {float: right; margin-left: 10px; margin-top: 12px;}
.logo { float: left;}
.social ul li { display: inline-block; margin-right: 10px;}

#sticky {background-color: var(--black); width: var(--container-width); float: center; direction: rtl; padding: 0; font-family: arial;}
#sticky.stick {margin-top: 0 !important; position: fixed; top: 0; z-index: 10000; background-color: var(--black); float: center; width: var(--container-width) !important;}


/* ===========================================
   6. SEARCH
   =========================================== */

.search { position: relative; margin: 0 auto; width: 400px;}
.search input { height: 38px; width: 100%; padding: 0 15px 0 0; background: #fefefe url("../../images/search1.jpg") 4px 4px no-repeat; border: 2px solid var(--gold); color: #4b2e02; font-size: 16px; text-align: right; border-radius: var(--radius-pill); box-shadow: inset 0 1px 3px rgba(0,0,0,0.06); outline: 0; }
.search input:focus { outline: 0; border-color: var(--gold-dark); box-shadow: 0 0 0 3px rgba(254,182,74,0.25), inset 0 1px 3px rgba(0,0,0,0.06); }
.search input + .search-ac { display: block;}

.search-ac {position: absolute; top: 40px; left: 0; right: 0; z-index: 10; background: var(--white); border: 1px solid var(--gray-300); border-radius: 8px; text-align: right; box-shadow: 0 6px 20px rgba(0,0,0,0.12);}
.search-ac:hover {display: block; text-align: right;}
.search-ac li { display: block; padding:10px; padding-bottom:0; text-align: right;}
.search-ac li img {margin-left:10px; text-align: right;}
.search-ac li:first-child:before, .search-ac li:first-child:after { content: ''; display: block; width: 0; height: 0; position: absolute; text-align: right; margin-left: -5px; border: 5px outset transparent;}
.search-ac li:first-child:before { border-bottom: 5px solid #c4c7d7; top: -11px; text-align: right;}
.search-ac li:first-child:after { border-bottom: 5px solid #fdfdfd; top: -10px; text-align: right;}
.search-ac li:first-child:hover:before, .search-ac li:first-child:hover:after { display: none; text-align: right;}
.search-ac li:last-child { margin-bottom: 10px;}
.search-ac a { display: block; position: relative; margin: 0 -1px; color: #343642; font-weight: 500; text-decoration: none; text-shadow: 0 1px white; font-size:16px;}
.search-ac a span { font-weight: 200;}
.search-ac a:hover { color: #4b2e02; background: #fff5e6; border-color: none; border-radius: var(--radius-sm);}
.search-ac li a span { bottom: 0; margin-right: 75px; position: absolute;}
.all-btn { padding: 10px; text-align: center;}
.all-search-btn {background-color: #ececec; border: medium none; width: 100%; padding: 5px 0;}

:-moz-placeholder { color: #a7aabc; font-weight: 200;}
::-webkit-input-placeholder { color: #4b2e02; font-weight: 200; line-height: 22px;}
::-webkit-search-decoration, ::-webkit-search-cancel-button { -webkit-appearance: none;}
.lt-ie9 .search input {line-height: 26px;}

.search-main-strip{width: 488px; float: right; background: var(--orange-bg); padding-top: 5px; text-align:center;}
.search-bar{width: 374px; float: right; padding-top: 2px; margin-right: 4px;}
.logo-farfesh-bar{width: 115px; height:28px; float: right; padding-top: 12px; margin-right: 10px;}
.search-ingen-strip { width: var(--container-width); height:53px; margin:0 auto; float: center; direction: rtl; background: var(--orange-light); margin-top:7px;}
.search-ingen-strip-main {height:53px; margin:0 auto; float: center; direction: rtl; background: var(--orange-bg); margin-top:5px; border-radius: var(--radius); overflow: visible;}

#containercat { width: 597px; height: 53px; position: relative;}
#navi, #infoi { width: 100%; height: 100%; position: absolute; text-align: left;}
#infoi { z-index: 10;}

.soshial-strip{width: 255px; height:50px; float: right; padding-top:16px;}
.soshial-facebook-strip-main{width: 135px; height:30px; float: left !important; padding-left: 10px;}
.soshial-facebook-strip{width: 110px; height:30px; float: left; padding-left: 10px; padding-top:2px;}
.soshial-tweeter-strip{width: 23px; height: 30px; float: left; padding-right: 6px;}
.soshial-google-plus-strip{width: 110px; height: 30px; float: left; text-align: right; padding-right: 3px;}


/* ===========================================
   7. HOMEPAGE - Hero Articles
   =========================================== */

.top-homepage-articles { direction:rtl; width:100%; background: var(--black); margin:0 auto; float: center; padding: 0;}

.top-homepage-articles-375 { width: 377px; height:214px; float: right; background-color: var(--gold); text-align: right; position: relative; border: 2px solid var(--gold); border-radius: var(--radius); overflow: hidden; transition: transform 0.25s ease, box-shadow 0.25s ease;}
.top-homepage-articles-375:hover { transform: scale(1.01); box-shadow: 0 4px 16px rgba(0,0,0,0.3);}
.top-homepage-articles-375 ul { font-size: 18px; color: white; bottom: 2px; left: 10px; right: 10px; z-index: 4; position: absolute; text-shadow: 0 1px 4px rgba(0,0,0,0.6); }
.image-class-top-375 {position: absolute; z-index: 2; width: 373px; height:210px; transition: transform 0.4s ease;}
.top-homepage-articles-375:hover .image-class-top-375 { transform: scale(1.04);}
.image-class-top-375-b {position: absolute; z-index: 3; width: 373px; height:210px;}

.top-homepage-articles-300 { width: 480px; height:272px; float: right; background-color: var(--gold); text-align: right; position: relative; border: 1px solid var(--gold); border-radius: var(--radius); overflow: hidden; transition: transform 0.25s ease, box-shadow 0.25s ease;}
.top-homepage-articles-300:hover { transform: scale(1.01); box-shadow: 0 4px 16px rgba(0,0,0,0.25);}
.top-homepage-articles-300 ul { font-size: 18px; color: white; bottom: 10px; left: 10px; right: 10px; z-index: 4; position: absolute; text-shadow: 0 1px 4px rgba(0,0,0,0.6);}
.image-class-top-300 {position: absolute; z-index: 2; width: 478px; height:270px;}
.image-class-top-300-b {position: absolute; z-index: 3; width: 478px; height:270px;}

.top-homepage-articles-150 {width: 272px; height:272px; float: right; text-align:right; margin-right: 7px; background-color: var(--gold); position: relative; border: 1px solid var(--gold); border-radius: var(--radius); overflow: hidden; transition: transform 0.25s ease, box-shadow 0.25s ease;}
.top-homepage-articles-150:hover { transform: scale(1.01); box-shadow: 0 4px 16px rgba(0,0,0,0.25);}
.top-homepage-articles-150 ul { font-size: 18px; color: white; bottom: 10px; left: 10px; right: 10px; z-index: 4; position: absolute; text-shadow: 0 1px 4px rgba(0,0,0,0.6);}
.image-class-top-150 {position: absolute; z-index: 2; width: 270px; height:270px;}
.image-class-top-150-b {position: absolute; z-index: 3; width: 270px; height:270px;}

/* .image-biger, .image-smaler removed – unused */

.top-homepage-articles-375 img, .top-homepage-articles-300 img, .top-homepage-articles-150 img, .series-box img, .vi-box img, .drop-containt-box img { max-width: 100%; }


/* ===========================================
   8. ARTICLE ZONES & GRID
   =========================================== */

.top-zone-articles { width: var(--container-width); padding:10px 0 15px; margin:0 auto; float: center; direction: rtl; margin-top:10px;}
.top-zone-articles-test { width: 100%; margin:0 auto; float: center; direction: rtl; }
.top-zone-articles-test-right { width: 522px; float: right; }
.top-zone-articles-test-right-2 { display:none !important; }
.top-zone-articles-test-left { width: 238px; float: left; padding-top: 8px; }

.top-zone-articles-left { width: 97px; float: left; direction: rtl; }
.top-zone-articles-left-first { width: 97px; float: center; direction: rtl; background: #fdd683; }
.top-zone-articles-left-second { width: 97px; float: center; direction: rtl; background: #c4f0fe; }
.top-zone-articles-left-first-text-b { padding: 7px 0 6px !important; float: center; text-align:center; }
.top-zone-articles-left-first-text-a { display:none !important; }
.top-zone-articles-left-first-text-a a { color:#575452; font-size:16px; font-weight:bold; letter-spacing: 0; text-decoration: none;}
.top-zone-articles-left-first-text-b a { color:#575452; font-size:16px; font-weight:bold; letter-spacing: 0; text-decoration: none;}
.white-line-one { width: 81px; float: center; height:1px; background: #3f3830; margin:0 auto; }

.top-zone-articles-right-first { float: right; direction: rtl; background: var(--white); }
.top-zone-articles-right { width: 654px; float: right; direction: rtl; background: #e4e4e4; }
.top-zone-articles-right-image {border: 1px solid #ebe5e5; }
.top-zone-articles-right-three-1 {width: 238px; float: left;}

.top-zone-articles-right-one-1 {width: 253px; height:247px; float: right; background-color: #f2f2f2; margin: 8px 0 0 0; border: 1px solid var(--orange-light); border-radius: var(--radius); overflow: hidden; transition: transform var(--speed), box-shadow var(--speed);}
.top-zone-articles-right-one-1:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.1);}
.top-zone-articles-right-tow-1 {width: 253px; height:247px; float: right; background-color: #f2f2f2; margin: 8px 8px 0 8px; border: 1px solid var(--orange-light); border-radius: var(--radius); overflow: hidden; transition: transform var(--speed), box-shadow var(--speed);}
.top-zone-articles-right-tow-1:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.1);}
.top-zone-articles-right-one {width: 253px; height:248px; float: right; background-color: #f2f2f2; margin: 15px 0 0 0; border: 1px solid var(--orange-light); border-radius: var(--radius); overflow: hidden; transition: transform var(--speed), box-shadow var(--speed);}
.top-zone-articles-right-one:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.1);}
.top-zone-articles-right-tow {width: 253px; height:248px; float: right; background-color: #f2f2f2; margin: 15px 8px 0 8px; border: 1px solid var(--orange-light); border-radius: var(--radius); overflow: hidden; transition: transform var(--speed), box-shadow var(--speed);}
.top-zone-articles-right-tow:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.1);}

.top-zone-articles-tes {float: right; display: flex; width:100%}
.top-zone-articles-tes span a { width:65px; float:right; text-align: left; padding-top:8px; padding-left: 5px; font-size: 15px; font-weight:bold; color: var(--gray-600); text-decoration: underline;}
.top-zone-articles-tes ul a { flex: 1; padding-top: 8px; padding-right:5px; float: right; text-align:right; color: var(--navy); font-size:17px; font-weight:bold; letter-spacing: 0; text-decoration: none;}

.top-zone-articles-right-one span a { width:100%; float:right; text-align: left; padding-top:8px; padding-left: 5px; font-size: 15px; font-weight:bold; color: var(--gray-600); text-decoration: underline;}
.top-zone-articles-right-one ul a { width:100%; padding: 10px 5px 0 5px; float: right; text-align:right; color: var(--navy); font-size:17px; font-weight:bold; letter-spacing: 0; text-decoration: none;}
.top-zone-articles-right-tow span a { width:100%; float:right; text-align: left; padding-top:8px; padding-left: 5px; font-size: 15px; font-weight:bold; color: var(--gray-600); text-decoration: underline;}
.top-zone-articles-right-tow ul a { width:100%; padding: 10px 5px 0 5px; float: right; text-align:right; color: var(--navy); font-size:17px; font-weight:bold; letter-spacing: 0; text-decoration: none;}
.top-zone-articles-right-one-1 span a { width:100%; float:right; text-align: left; padding-top:8px; padding-left: 5px; font-size: 15px; font-weight:bold; color: var(--gray-600); text-decoration: underline;}
.top-zone-articles-right-one-1 ul a { width:100%; padding: 10px 5px 0 5px; float: right; text-align:right; color: var(--navy); font-size:17px; font-weight:bold; letter-spacing: 0; text-decoration: none;}
.top-zone-articles-right-tow-1 span a { width:100%; float:right; text-align: left; padding-top:8px; padding-left: 5px; font-size: 15px; font-weight:bold; color: var(--gray-600); text-decoration: underline;}
.top-zone-articles-right-tow-1 ul a { width:100%; padding: 10px 5px 0 5px; float: right; text-align:right; color: var(--navy); font-size:17px; font-weight:bold; letter-spacing: 0; text-decoration: none;}


/* ===========================================
   9. VIDEO - Browser Strip & Player
   =========================================== */

.video-browser { border-radius: var(--radius); background: var(--gradient-strip-bg) !important; height: 206px !important; padding: 0; overflow: visible; box-shadow: 0 4px 20px rgba(0,0,0,0.25); }
.video-browser-inner { padding-top: 8px !important; }
.video-thumb-card { width: 133px; float: right; position: relative; text-align: center; top: 0; }
.video-thumb-img { width: 125px; float: right; position: relative; border: none; border-radius: var(--radius) var(--radius) 0 0; overflow: hidden; transition: transform var(--speed), box-shadow var(--speed); }
.video-thumb-img:hover { transform: scale(1.04); box-shadow: 0 4px 16px rgba(0,0,0,0.4); z-index: 2; }
.video-thumb-img img { border-radius: var(--radius) var(--radius) 0 0; display: block; width: 125px !important; height: 140px !important; object-fit: cover; }
.video-thumb-img::after { content: '\25B6'; position: absolute; top: 42%; left: 50%; transform: translate(-50%, -50%) scale(0.8); width: 30px; height: 30px; background: rgba(0,0,0,0.5); border: 2px solid rgba(255,255,255,0.8); border-radius: 50%; color: var(--white); font-size: 11px; line-height: 26px; text-align: center; padding-left: 3px; opacity: 0; transition: opacity var(--speed), transform var(--speed); pointer-events: none; }
.video-thumb-card:hover .video-thumb-img::after { opacity: 1; transform: translate(-50%, -50%) scale(1); }
.video-thumb-title { width: 125px; position: relative; margin-top: 0; height: 42px; padding: 4px 5px 4px; text-align: center; background: rgba(0,0,0,0.3); border-radius: 0 0 var(--radius) var(--radius); overflow: hidden; float: right; }
.video-thumb-title a, .video-thumb-title .Link2, .video-thumb-title a.Link2, .video-thumb-title a.Link2:link, .video-thumb-title a.Link2:visited { color: #ffffff !important; font-size: 14px !important; font-weight: bold; line-height: 1.3; text-shadow: 0 1px 2px rgba(0,0,0,0.5); background: none !important; }
.video-thumb-title a:hover, .video-thumb-title .Link2:hover { color: var(--gold) !important; }
.video-thumb-spacer { width: 10px; float: right; position: relative; }
.video-nav-arrow { position: relative; vertical-align: middle; text-align: center; top: 55px; cursor: pointer; z-index: 3; }
.video-nav-arrow img { opacity: 0 !important; padding: 18px 6px; position: relative; z-index: 2; }
.video-nav-arrow::after { font-size: 28px; font-weight: 300; color: var(--gold); position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 30px; height: 56px; display: flex; align-items: center; justify-content: center; background: rgba(255,235,190,0.08); border-radius: var(--radius-sm); transition: background var(--speed), color var(--speed); pointer-events: none; }
.video-nav-arrow:hover::after { background: rgba(254,182,74,0.25); color: var(--white); }
.video-nav-arrow[style*="width: 20px"]::after { content: '\276E'; }
.video-nav-arrow[style*="width: 12px"]::after { content: '\276F'; }
.video-browser-sidebar { width: 143px; float: right; position: relative; text-align: center; top: 8px; }
.video-browser-sidebar a { color: var(--cream) !important; text-shadow: 0 1px 2px rgba(0,0,0,0.5); }
.video-browser-sidebar select { background: rgba(255,235,190,0.15); color: var(--cream); border: 1px solid rgba(255,235,190,0.25); border-radius: var(--radius-sm); padding: 4px 6px; font-size: 0.9em; width: 111px; cursor: pointer; transition: background var(--speed), border-color var(--speed); }
.video-browser-sidebar select:hover { background: rgba(255,235,190,0.25); border-color: rgba(255,235,190,0.45); }
.video-browser-sidebar select option { background: #3a2e1e; color: var(--cream); }

/* Legacy video classes removed – unused in desktop ASP */

/* Sidebar video tabs */
.vid-tal-a {width: 230px; height:161px; float: right; text-align: center; top: 2px; padding-right:6px;}
.vid-tal-b {width: 223px; height:137px; text-align: center; border: 1px solid var(--white); }
.vid-tal-c {width: 225px; height:24px; padding-bottom: 4px; text-align: center; background-color: var(--cream-dark);}
.vid-tal-c ul {color: var(--text-gray); font-size:14px; text-decoration: none; font-weight: bold;}
.vid-tal-d {WIDTH:223px; HEIGHT: 135px;}
.vid-tal-e {width: 230px; HEIGHT: 15px; float: right;}
.vid-tal-f {width: 230px; HEIGHT: 1px; float: right; }
.vid-tal-h {width: 238px; float: right; text-align: center; top: 0;}
.vid-tal-h ul {color: var(--text-gray); font-size:24px; text-decoration: none; font-weight: bold;}
.vid-tal-i {float: right; clear: both; width: 238px; background-image: url('../../images/orang_back2.jpg'); background-repeat:initial;}
.vid-tal-j {float: right; clear: both; width: 100%; padding-top: 4px;}
.vid-tal-k {width: 238px; float: right; text-align: center; top: 4px;}
.vid-tal-l {width: 238px; float: right; text-align: center;}
.vid-tal-l ul {text-align: center; color: var(--text-gray); font-size:18px; text-decoration: none; font-weight: bold;}
.vid-tal-m {width: 238px; float: right; padding: 10px 0;}
.vid-tal-n {width: 119px; float: right; margin:0 auto; text-align: center; padding-right:10px; }
.vid-tal-o {width: 238px; float: right; position: relative; text-align: center; top: 2px;}
.vid-tal-o-select {width:230px; right: 3px; background: #e9e9e9;}
.vid-tal-o-option {color: var(--black); font-size:13; font-family: arial; padding-right: 6px;}

/* Video embed & pagination */
.video-embed-pagination-main{ direction:rtl; width: var(--container-width); margin:0 auto;}
.video-pagination{border-bottom:1px solid var(--gray-200); margin-bottom:20px;}
.video_parents { padding-bottom:19px; padding-top:7px; direction:rtl; overflow:hidden;}
.video_first_left{ float:left; line-height:33px; border:1px solid #cfcfcf; border-radius:5px; padding-left:14px; font-size:16px; width:auto;}
.video_first_left img{ padding:0 9px;}
.video_first_left.dropdown {position: relative;}
.video_first_left.dropdown a{ color:#2e354a; text-decoration:none;}
.video_first_left.dropdown a:hover,.video_first_left.dropdown a:focus{ background-color: var(--white); color:#2e354a;}
.video_first_right > span { color: #2e354a; font-size: 24px; float:right;}
.video_first_right h1 { color: #2e354a; font-size: 24px; float:right;}
.vide_footer{ padding:27px 0;}
.video_main1{width: var(--container-width); height:auto; margin-bottom:20px;}
.custom_video h4{ color: var(--text-dark); font-size:17px;}
.jwplayer{ height: 445px !important; width: 100% !important;}
.video-js .vjs-big-play-button{ background-color: transparent; border-radius: 107px; height: 50px; left: 0; margin: -25px auto auto; padding: 11px; right: 0; top: 50%; width: 50px;}
.video-js .vjs-big-play-button:hover{ background-color:transparent;}
.video-js:hover .vjs-big-play-button{ background-color:transparent;}

/* Video boxes */
.vi-box { background-color: var(--gray-bg); position: relative; width: 100%; overflow:hidden; border-radius: var(--radius); transition: transform var(--speed), box-shadow var(--speed);}
.vi-box:hover { transform: translateY(-2px); box-shadow: 0 4px 14px rgba(0,0,0,0.1);}
.vi-box-top img { clear: both; width: 100%; height: 147px; overflow: hidden; transition: transform var(--speed-slow);}
.vi-box:hover .vi-box-top img { transform: scale(1.04);}
.vi-box-top-Home img { clear: both; width: 100%; overflow: hidden;}
.vi-box-bottom{ text-align:center;}
.vi-box-bottom h4 { color: var(--text-dark); font-size: 16px; line-height: 38px; margin-left:0; text-align:center; font-weight:bold}
.play{bottom: 47px; left: 12px; position: absolute;}


/* ===========================================
   10. SERIES & CATEGORIES
   =========================================== */

.series-row {width: var(--container-width); margin:15px auto; margin-bottom:0;}
.series-row-Second {width: var(--container-width); margin:0 auto; margin-bottom:0;}

.series-head { direction: rtl; border-bottom: 2px solid var(--gold); clear: both; height: 43px; overflow: hidden; width: 100%; margin-bottom: 25px; margin-top: 25px;}
.series-head-right { float: right;}
.series-head-left { float: left;}
.series-head-m { float: middle; border-bottom: 1px solid var(--gray-200); clear: both; height: 35px; width: 100%; margin-bottom: 10px; margin-top: -5px;}

.t-icon { float: right; margin-top:4px;}
.t-icon img { margin-left: 10px;}
.t-text { color: #2f3452; float: left; font-size: 22px; line-height: 34px;}
.t-text span { color: var(--gray-500); font-size: 19px; font-weight: normal;}
.t-text ul li { display:inline-block; font-size:16px; color: var(--black); line-height:100%;}
.t-text ul li::after {color: var(--gray-500); content: ""; display: inline-block; font-family: Fontawesome; margin: 0 6px; vertical-align: middle;}
.t-text ul li:last-child::after { content:normal;}
.t-text ul li a {color: var(--gray-500);}
.t-iconm { float: right; margin: 0 0 10px;}
.t-textm { color: #2f3452; float: left; font-size: 22px; line-height: 34px;}
.t-textm ul li { display:inline-block; font-size:17px; color: var(--black); line-height:100%; margin: 0 6px 10px; }
.t-textm ul li::after {color: var(--gray-500); content: ""; display: inline-block; font-family: Fontawesome; margin: 0 6px 10px; vertical-align: middle;}
.t-textm ul li:last-child::after { content:normal;}
.t-textm ul li a {color: var(--gray-500);}
.socialbtns { margin-top: 10px;}

.series-box { background-color: var(--gray-200); width: var(--series-box-width); float:right; margin-left:16px; margin-bottom:15px; border-radius: var(--radius); overflow: hidden; transition: transform var(--speed), box-shadow var(--speed);}
.series-box:hover { transform: translateY(-3px); box-shadow: 0 6px 16px rgba(0,0,0,0.12);}
.series-box:last-child {margin-left:0;}
.left_col {margin-left:0;}
.t-img{ width: 100%; height: 109px; transition: transform var(--speed-slow);}
.series-box:hover .t-img { transform: scale(1.05);}
.box-bottom { text-align: center; padding: 4px 0;}
.box-bottom h4 { color: var(--text-dark); font-size: 16px; line-height: 33px;}
.box-bottom h2 { color: var(--text-dark); font-size: 16px; line-height: 33px;}
.box-bottom-new { text-align: center; height: 33px !important; width: 100%; overflow: hidden;}
.box-bottom-new h4 { color: var(--text-dark); font-size: 16px; line-height: 33px;}

.series-banner { background-color: var(--gray-100); height: 122px; text-align: center; width: var(--container-width); display:table; margin-bottom:15px; padding-top:16px; border-radius: var(--radius);}
.series-banner-AD { background-color: var(--white); height: 90px; text-align: center; width: var(--container-width); display:table; margin-top:10px; margin-bottom:-20px; padding-top:3px;}

.series-MB button {background-color: var(--dark-button); border: medium none; border-radius: 50px; color: var(--white); font-size: 14px; padding: 5px 18px; transition: background-color var(--speed), transform var(--speed-fast);}
.series-MB button:hover { background-color: var(--gold); transform: translateY(-1px);}
.series-MB button a {color: #61bbfe; font-size: 14px; font-weight: bold !important; padding: 5px;}
.series-btn button {background-color: var(--dark-button); border: medium none; border-radius: 50px; color: var(--white); font-size: 14px; padding: 5px 32px; transition: background-color var(--speed), transform var(--speed-fast);}
.series-btn button:hover { background-color: var(--gold); transform: translateY(-1px);}
.series-btn a { margin-right: 10px;}
.series-br-button a {background-color: var(--dark-button); border: medium none; font-size: 14px; padding: 5px 18px;}

.cats_tabs {height:auto; margin:15px 0; display: inline-block; margin-bottom:-7px;}
.cats_tabs li {float:right; border:1px solid var(--gray-400); text-align: center; font-size:16px; border-radius: var(--radius-pill); padding:5px; margin:3px; width:184px; transition: background-color var(--speed), border-color var(--speed), transform var(--speed-fast);}
.cats_tabs li a{color:#333; padding:7px; transition: color var(--speed);}
.cats_tabs li:hover {background: var(--gold); color: var(--white); border-color: var(--gold); transform: translateY(-1px);}
.cats_tabs li a:hover {color: var(--white);}


/* --- Episode Cards (mvid pages) --- */
.episode-card { background: #ecdcc4; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-card); transition: transform var(--speed), box-shadow var(--speed); border-collapse: separate; }
.episode-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-card-hover); }
.episode-card img { border-radius: var(--radius-sm); transition: transform var(--speed-slow); }
.episode-card:hover img { transform: scale(1.05); }
.episode-card .ep-title { padding: 8px 6px 10px; text-align: center; line-height: 1.3; }
.episode-card .ep-title h2 { font-size: 13px; }
.episode-card .ep-title a { transition: color var(--speed); }
.episode-card .ep-title a:hover { color: var(--gold-dark) !important; }
.episode-card .text6 { padding: 8px 6px 10px; line-height: 1.3; }
.episode-card .text6 h2 { font-size: 13px; }

/* --- Series Cards (Rmd pages) --- */
.series-card { background: #ecdcc4; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-card); transition: transform var(--speed), box-shadow var(--speed); margin-bottom: 12px; }
.series-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-card-hover); }
.series-card img { border-radius: var(--radius-sm); transition: transform var(--speed-slow); border: none !important; }
.series-card:hover img { transform: scale(1.05); }
.series-card .card-title { padding: 10px 6px; text-align: center; line-height: 1.3; }

/* --- Video Player Section (vmain pages) --- */
.video-player-section {
  background: linear-gradient(180deg, #0a0a0a 0%, #141210 100%);
  padding: 0 0 10px;
  border-radius: var(--radius);
  margin-bottom: 0;
  box-shadow: 0 8px 30px rgba(0,0,0,0.4);
  position: relative;
}
.sp-base:has(> .video-player-section) {
  background: #faf3e8;
}
.video-player-section::after {
  content: ''; position: absolute; bottom: 0; left: 5%; right: 5%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212,160,64,0.3), transparent);
}

/* --- Episodes Bar (under video player) – flexbox centered --- */
.episodes-bar {
  background: linear-gradient(180deg, #1a1510 0%, #0f0d0a 100%) !important;
  border-radius: var(--radius) !important;
  box-shadow: 0 4px 20px rgba(0,0,0,0.25);
  padding: 12px 10px 10px !important;
  height: auto !important;
  overflow: visible !important;
}
.episodes-bar > .sp-base > div[style*="height : 155px"],
.episodes-bar > .sp-base > div[style*="height: 155px"] {
  height: auto !important;
  display: flex !important; flex-wrap: wrap;
  justify-content: center; gap: 12px;
  float: none !important;
  background: transparent !important;
}
.episodes-bar div[style*="color: #bb0303"] {
  color: var(--gold) !important;
  text-align: center !important;
  font-size: 16px !important;
  padding: 4px 0 2px !important;
  margin: 0 !important;
  background: transparent !important;
  letter-spacing: 0.5px;
}
.episodes-bar .series-box {
  background: linear-gradient(180deg, #1e1a14 0%, #15120e 100%);
  border: 1px solid rgba(212,160,64,0.15);
  border-radius: var(--radius);
  overflow: hidden;
  margin: 0 !important; float: none !important;
  width: var(--series-box-width);
  box-shadow: 0 2px 10px rgba(0,0,0,0.2);
  transition: transform var(--speed), box-shadow var(--speed), border-color var(--speed);
}
.episodes-bar .series-box:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.35);
  border-color: rgba(212,160,64,0.4);
}
.episodes-bar .series-box .t-img { height: 100px; object-fit: cover; }
.episodes-bar .series-box .Link3a { padding: 6px 4px; text-align: center; }
.episodes-bar .series-box .Link3a div { color: rgba(255,245,230,0.85) !important; font-size: 13px !important; line-height: 1.3 !important; }
.episodes-bar .series-box:hover .Link3a div { color: var(--gold) !important; }
.episodes-bar .series-box .series-box-top { position: relative; overflow: hidden; }
.episodes-bar .series-box .series-box-top::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,0.5) 100%);
  pointer-events: none;
}
.episodes-bar .series-box .play-button { position: absolute; z-index: 2; }
.episodes-bar .series-box .play-button img {
  opacity: 0; transition: opacity var(--speed);
  width: 28px !important; height: 28px !important;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.4));
}
.episodes-bar .series-box:hover .play-button img { opacity: 0.95; }

/* vmain overall page spacing – reduce bloat from Spacer/Padding helpers */
.video-player-section ~ .sp-base > div[style*="background: #fff0dc"] > img[alt="spacer"],
.video-player-section ~ .sp-base > div > div[style*="background: #fff0dc"] > img[alt="spacer"] {
  height: 6px !important;
}

/* --- vmain Page Modernization --- */

/* Title + all-episodes button row: fill parent with cream so no black gaps */
.sp-base:has(> h1 > div[style*="color: #e15d04"]) {
  background: #faf3e8 !important;
  overflow: hidden;
}

/* All-episodes button: blend into cream row */
div[style*="background-color: #ffe4b9"][style*="float: left"] {
  background-color: transparent !important;
  border-color: #b89860 !important;
  margin-top: 4px;
}
div[style*="background-color: #ffe4b9"][style*="float: left"] a {
  color: #7a3a0a !important;
}

/* Series title bar */
div[style*="color: #e15d04"] {
  color: #c49035 !important;
  background: linear-gradient(180deg, #faf3e8, #f5eadb) !important;
  padding: 8px 16px !important;
  font-size: 17px !important;
}

/* Navigation links ("للانتقال الى") */
div[style*="background: #FFF0DC"][style*="padding-top:10px"] {
  background: linear-gradient(180deg, #f5eadb, #faf3e8) !important;
  padding: 10px 0 8px !important;
}
a[style*="color: #990000"] {
  color: #6a4520 !important;
  transition: color var(--speed);
  text-decoration: none !important;
  border-bottom: 1px solid transparent;
}
a[style*="color: #990000"]:hover { color: var(--gold-dark) !important; border-bottom-color: var(--gold-dark) !important; }

/* "The Voice" / promo bars */
div[style*="background: #e15d04"] {
  background: #FAA322 !important;
  border-radius: var(--radius-sm) !important;
}

/* Ramadan Top-10 banner */
div[style*="background-color: #f3a43b"] {
  background: linear-gradient(135deg, #1a1510 0%, #2a2015 50%, #1a1510 100%) !important;
  border-radius: var(--radius) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.3);
  padding: 12px 16px !important;
  border: 1px solid rgba(212,160,64,0.2);
}
div[style*="background-color: #f3a43b"] a {
  color: var(--gold) !important; font-size: 17px !important;
  text-shadow: 0 1px 4px rgba(0,0,0,0.3);
  letter-spacing: 0.3px;
}
div[style*="background-color: #f3a43b"] a:hover { color: #f0d898 !important; }

/* vmain page cream backgrounds */
div[style*="background: #fff0dc"],
div[style*="background: #FFF0DC"] {
  background: #faf3e8 !important;
}

/* vmain description block */
div[style*="background: #fff0dc"][style*="padding-right:10px"] h2,
.sp-base h2 div[style*="background: #fff0dc"] {
  background: #faf3e8 !important;
  padding: 8px 12px !important;
  line-height: 1.4 !important;
}

/* vmain description (episode bar label) */
div[style*="color: #bb0303"] { color: #8a4a12 !important; }

/* --- vmain Bottom News Section --- */
div[style*="color: #cc2e14"] { color: var(--gold-dark) !important; font-size: 1.15em !important; }

/* News article images */
img[style*="border: solid 1px #003167"] {
  border: none !important; border-radius: var(--radius) !important;
  box-shadow: 0 3px 12px rgba(0,0,0,0.12);
  object-fit: cover;
  transition: transform var(--speed), box-shadow var(--speed);
}
img[style*="border: solid 1px #003167"]:hover {
  transform: scale(1.04); box-shadow: 0 6px 20px rgba(0,0,0,0.2);
}

/* News article title links */
a[style*="color: #003366"] {
  color: #2a1f0f !important;
  transition: color var(--speed);
  text-decoration: none !important;
}
a[style*="color: #003366"]:hover { color: var(--gold-dark) !important; }

/* News article separators (170px black lines) */
div[style*="width: 170px"][style*="background: #000000"],
div[style*="width: 170px"][style*="background:#000000"] {
  background: linear-gradient(90deg, transparent 0%, rgba(180,155,120,0.25) 20%, rgba(180,155,120,0.25) 80%, transparent 100%) !important;
}

/* ffe0ae backgrounds in episodes bar override to transparent */
.episodes-bar div[style*="background: #ffe0ae"],
.episodes-bar .sp-base div[style*="background: #ffe0ae"] {
  background: transparent !important;
}

/* vmain search bar modernization */
.search-ingen-strip-main { margin-bottom: 8px; }

/* Bottom news articles column - fix overflow from 760px wrappers in 175px column */
div[style*="width: 175px"][style*="background: #fff0dc"][style*="text-align:right"] {
  overflow: hidden;
}
div[style*="width: 175px"][style*="background: #fff0dc"][style*="text-align:right"] > div[style*="width: 760px"] {
  width: 100% !important; float: none !important;
}
div[style*="width: 175px"][style*="background: #fff0dc"][style*="text-align:right"] div[style*="width: 180px"] {
  width: 100% !important;
}
div[style*="width: 175px"][style*="background: #fff0dc"][style*="text-align:right"] div[style*="width: 170px"][style*="text-align: right"] {
  width: 100% !important;
}
div[style*="width: 175px"][style*="background: #fff0dc"][style*="text-align:right"] div[style*="width: 170px"][style*="text-align:center"] {
  width: 100% !important;
}
div[style*="width: 175px"][style*="background: #fff0dc"][style*="text-align:right"] img[style*="width: 170px"] {
  width: 100% !important; height: auto !important; aspect-ratio: 16/9;
}

/* --- Homepage Article Sections --- */
.article-row { background: #faf3e8 !important; padding: 4px 10px 4px 5px !important; transition: background var(--speed); }
.article-row:hover { background: #f2e6d0 !important; }
.article-separator { background: #e8d5b5 !important; height: 1px !important; overflow: hidden; }
.article-separator img { opacity: 0; }
.article-img { overflow: hidden; }
.article-img > div { padding-top: 2px !important; }
.article-img img { border-radius: var(--radius); box-shadow: 0 2px 8px rgba(0,0,0,0.1); transition: transform var(--speed), box-shadow var(--speed); max-height: 100px; width: auto; object-fit: cover; }
.article-img img:hover { transform: scale(1.03); box-shadow: 0 4px 12px rgba(0,0,0,0.18); }
.article-row .text4a { color: #444; line-height: 1.35; }
.article-row div[style*="width: 449px"] div[style*="padding-top: 10px"] { padding-top: 2px !important; }
.article-row div[style*="width: 449px"] div[style*="padding-top: 7px"],
.article-row div[style*="width: 449px"][style*="padding-top: 7px"] { padding-top: 2px !important; }
.article-row a.Link5 { transition: color var(--speed); }
.article-row a.Link5:hover { color: var(--gold-dark) !important; background: none !important; }
.article-row a.Link2 { transition: color var(--speed); }
.article-row a.Link2:hover { color: var(--gold-dark) !important; background: none !important; text-decoration: underline; }

/* --- Sidebar (all pages) --- */
.sidebar-wrapper { background: #1e180f !important; border-radius: var(--radius); overflow: hidden; }
.sidebar-wrapper div[style*="#FEDCA1"] { background: #f5ead8 !important; border-radius: var(--radius-sm); margin: 2px 0; transition: background var(--speed); }
.sidebar-wrapper div[style*="#FEDCA1"]:hover { background: #ecdcc4 !important; }
.sidebar-wrapper div[style*="#3b5997"] { border-radius: var(--radius-sm); }
.sidebar-wrapper div[style*="#c7eaf8"] { background: #f5ead8 !important; border-radius: var(--radius-sm); }
.sidebar-wrapper img { border-radius: var(--radius-sm); }
.sidebar-wrapper .textwrapper > div[style*="background: #000000"] { background: #1e180f !important; }
.sidebar-wrapper .textwrapper > div[style*="background:#000000"] { background: #1e180f !important; }

/* --- Global Page Content Modernization --- */

/* Content area transitions */
div[style*="background: #FFF0DC"], div[style*="background: #fff0dc"],
div[style*="background:#FFF0DC"], div[style*="background:#fff0dc"] { transition: background var(--speed); }
div[style*="background: #fff2e1"], div[style*="background:#fff2e1"] { transition: background var(--speed); }

/* Black sidebar-content separator strips → transparent */
div[style*="background: #000000;"][style*="width: 10px"],
div[style*="background: #000000;"][style*="width: 5px"],
div[style*="background: #000000;"][style*="width: 3px"],
div[style*="background:#000000;"][style*="width: 10px"],
div[style*="background:#000000;"][style*="width: 5px"],
div[style*="background:#000000;"][style*="width: 3px"] { background: transparent !important; }
img[style*="background: #000000"] { background: transparent !important; }
td[style*="background: #000000"] { background: linear-gradient(90deg, transparent 0%, rgba(180,155,120,0.25) 20%, rgba(180,155,120,0.25) 80%, transparent 100%) !important; }

/* Table bgcolor modernization (Expand, article pages) */
td[bgcolor="#FFF0DC"], td[bgcolor="#fff0dc"] { background: #faf3e8 !important; }
td[bgcolor="#FAA322"], td[bgcolor="#faa322"] { background: #FAA322 !important; }
td[bgcolor="#808080"] { background: #e0d0b8 !important; }
table[bgcolor="#000000"] { background: transparent !important; }

/* Article images – remove hard borders, add radius */
table[style*="BORDER: 1px solid #000000"], table[style*="border: 1px solid #000000"] {
  border: none !important; border-radius: var(--radius-sm); overflow: hidden;
}
td[style*="BORDER: 1px solid #000000"], td[style*="border: 1px solid #000000"] {
  border: none !important; border-radius: var(--radius-sm); overflow: hidden;
}

/* Article body text – compact and readable */
.text4 { font-size: 0.95em !important; line-height: 1.35; }
.text4a { font-size: 0.95em !important; line-height: 1.35; }
.text4c { font-size: 13px !important; line-height: 1.35; }
.textbe { font-size: 0.92em; line-height: 1.35; }

/* Compact article listing rows */
div[style*="width: 600px"] > img[height="50"], div[style*="width: 597px"] > img[height="50"] { height: 8px !important; }
div[style*="width: 10px"] > img[height="50"] { height: 8px !important; }
div[style*="height:5px"][style*="width: 600px"], div[style*="height:5px"][style*="width: 597px"] { height: 2px !important; }
div[style*="height:1px"][style*="background: #808080"] { height: 1px !important; }
div[style*="height: 5px"][style*="width: 600px"], div[style*="height: 5px"][style*="width: 597px"] { height: 2px !important; }

/* Expand/article page TABLE rows – remove forced height */
table.text4c[height] { height: auto !important; }
table.text4c[style*="line-height"] { line-height: 1.3 !important; }

/* Top Articles Banner (shared across 7+ category pages) */
.top-articles-banner { border-radius: var(--radius); box-shadow: 0 3px 12px rgba(0,0,0,0.1); }
.top-articles-banner img { border-radius: var(--radius-sm); transition: transform 0.35s ease, opacity var(--speed); }
.top-articles-banner img:hover { transform: scale(1.03); opacity: 0.95; }

/* Category header tabs (header1.JPG) */
div[style*="header1.JPG"] { border-radius: var(--radius-sm) var(--radius-sm) 0 0; }

/* Horoscope sign selector bar */
table[bgcolor="#666666"] { background: #3a2e1e !important; border-radius: var(--radius-sm); }
td[bgcolor="#666666"] { background: #3a2e1e !important; }
table[bgcolor="#666666"] td[bgcolor="#FFFFFF"] { background: rgba(255,255,255,0.15) !important; }

/* Link hover transitions */
a.Link11a { transition: color var(--speed); }
a.Link11a:hover { color: var(--cream) !important; }
a.Link11b { transition: color var(--speed); }
a.Link11b:hover { color: var(--gold-dark) !important; }
a.Link11e { transition: color var(--speed); }
a.Link11e:hover { color: var(--gold-dark) !important; }
a.Link3, a.Link3:link, a.Link3:visited, a.Link3:active { transition: color var(--speed); }
a.Link3:hover { color: var(--gold-dark) !important; }
a.Link5, a.Link5:link, a.Link5:visited, a.Link5:active { transition: color var(--speed); }
a.Link5:hover { color: var(--gold-dark) !important; }
a.Link5p { transition: color var(--speed); }
a.Link5p:hover { color: var(--gold-dark) !important; }
a.expandwhite { transition: color var(--speed); }
a.expandwhite:hover { color: var(--cream) !important; }
a.expandblack { transition: color var(--speed); }
a.expandblack:hover { color: var(--gold-dark) !important; }

/* Remaining link smooth transitions */
a.LinkVIDEOMain { transition: color var(--speed); }
a.musicMain { transition: color var(--speed); }
a.LinkVIDEO { transition: color var(--speed); }
a.Link3w { transition: color var(--speed); }
a.Link3b { transition: color var(--speed); }
a.Link3c { transition: color var(--speed); }
a.Link3d { transition: color var(--speed); }
a.Link3e { transition: color var(--speed); }
a.Link3f { transition: color var(--speed); }
a.Link6 { transition: color var(--speed); }
a.Link9 { transition: color var(--speed); }
a.Link10 { transition: color var(--speed); }
a.Link11 { transition: color var(--speed); }
a.Link11c { transition: color var(--speed); }
a.Link11d { transition: color var(--speed); }
a.Link11g { transition: color var(--speed); }
a.newbar { transition: color var(--speed); }

/* Pagination modernization */
.cls_nav_active { border-radius: var(--radius-sm); transition: background var(--speed), border-color var(--speed); }
.cls_nav_current { border-radius: var(--radius-sm); }

/* --- Homepage 4-Column Article Cards --- */
.main-containerart { display: flex; flex-direction: row; width: 100%; padding: 8px 0; gap: 0; }
.maindivart { background: #f5ead8 !important; border: none !important; border-radius: var(--radius) !important; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.08); transition: transform var(--speed), box-shadow var(--speed); }
.maindivart:hover { transform: translateY(-4px); box-shadow: 0 6px 18px rgba(0,0,0,0.15); }
.maindivart img { border-radius: var(--radius) var(--radius) 0 0; transition: transform 0.35s ease; }
.maindivart:hover img { transform: scale(1.04); }
.maindivart a.Link3 { color: var(--navy) !important; transition: color var(--speed); }
.maindivart:hover a.Link3 { color: var(--gold-dark) !important; }
.maindivart h3 { margin: 0; font-size: 14px; line-height: 1.4; }

/* --- Section Header Bars (category headers) --- */
div[style*="background: #faa322"], div[style*="background: #FAA322"],
div[style*="background:#faa322"], div[style*="background:#FAA322"] { background: #FAA322 !important; }
div[style*="background: #faa322"] > img[height="10"], div[style*="background: #FAA322"] > img[height="10"] { height: 4px !important; }
div[style*="background: #0000"] > img[height="5"] { height: 2px !important; }
a.musicMain { letter-spacing: 0.5px; }

/* Hide dated overlay icons on section headers */
img[src*="news.png"][style*="margin-top: -51px"] { display: none !important; }

/* --- Series Pages: Letter Navigation Table --- */
table[style*="height:50px"][style*="background: #fff0dc"],
table[style*="height: 50px"][style*="background: #fff0dc"] {
  background: #f5ead8 !important;
  border-collapse: separate;
  border-spacing: 3px;
  border-radius: var(--radius);
  overflow: hidden;
}
table[style*="height:50px"] td a,
table[style*="height: 50px"] td a {
  transition: color var(--speed), background var(--speed);
  border-radius: var(--radius-sm);
  padding: 2px 4px;
}
table[style*="height:50px"] td a:hover,
table[style*="height: 50px"] td a:hover {
  color: var(--gold-dark) !important;
  background: rgba(212,160,64,0.1);
}

/* --- Series Pages: Gradient link headers --- */
div[style*="linear-gradient(to right,#FFF0DC 93%, #FAA322)"],
div[style*="linear-gradient(to right,#FFF0DC 93%, #faa322)"] {
  background: linear-gradient(to right, #faf3e8 93%, var(--gold)) !important;
  border-radius: var(--radius-sm);
  transition: background var(--speed);
}

/* --- Expand/Category Pages: Article card borders --- */
table[style*="border: solid 1px #adbcbf"],
div[style*="border: solid 1px #adbcbf"] {
  border-color: rgba(180,155,120,0.3) !important;
  border-radius: var(--radius) !important;
  overflow: hidden;
  transition: transform var(--speed), box-shadow var(--speed);
}
table[style*="border: solid 1px #adbcbf"]:hover,
div[style*="border: solid 1px #adbcbf"]:hover {
  box-shadow: 0 4px 14px rgba(0,0,0,0.1);
}

/* --- Horoscope Pages: Daily section background --- */
div[style*="background: #feb64a"],
div[style*="background:#feb64a"],
td[style*="background: #feb64a"],
td[bgcolor="#feb64a"] {
  background: #feb64a !important;
  border-radius: var(--radius-sm);
}

/* Horoscope page lighter orange sections */
div[style*="background: #fec16b"],
div[style*="background:#fec16b"],
td[style*="background: #fec16b"],
td[bgcolor="#fec16b"] {
  background: #f0dbb8 !important;
}

/* Rmd/series spacer orange */
div[style*="background: #f8b53b"],
div[style*="background:#f8b53b"] {
  background: #FAA322 !important;
}

/* --- Horoscope Grid: Zodiac sign cards --- */
td[style*="width: 130px"] img[style*="110px"],
td[style*="width:130px"] img[style*="110px"] {
  border-radius: var(--radius);
  transition: transform var(--speed), box-shadow var(--speed);
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
td[style*="width: 130px"] img[style*="110px"]:hover,
td[style*="width:130px"] img[style*="110px"]:hover {
  transform: scale(1.06);
  box-shadow: 0 6px 16px rgba(0,0,0,0.15);
}

/* --- Additional text classes – readability --- */
.text1b { line-height: 1.4; }
.text8 { line-height: 1.4; }
.text14 { line-height: 1.4; }
.text6 { line-height: 1.4; }
.text6a { line-height: 1.4; }
.text4_1 { line-height: 1.4; }
.text4d { line-height: 1.5; }
.text4e { line-height: 1.5; }
.text4horo { line-height: 1.5; }
.textmosalsal { line-height: 1.3; }
.text125 { line-height: 1.35; }
.textborj, .textborja { line-height: 1.5; }

/* Additional link transitions */
a.Link3a { transition: color var(--speed); }
a.Link3a:hover { color: var(--gold-dark) !important; }
a.Link3g { transition: color var(--speed); }
a.Link3g:hover { color: var(--gold-dark) !important; }
a.Link8, a.Link8:link, a.Link8:visited { transition: color var(--speed); }
a.Link8:hover { color: var(--gold-dark) !important; }
a.Linkm125 { transition: color var(--speed); }
a.Linkm125:hover { color: var(--gold-dark) !important; }

/* Series card title text */
.series-card .card-title a { transition: color var(--speed); }
.series-card .card-title a:hover { color: var(--gold-dark) !important; }

/* Inline heading color overrides */
div[style*="color:#990000"],
div[style*="color: #990000"] { color: #6a4520 !important; }
span[style*="color:#990000"],
span[style*="color: #990000"] { color: #6a4520 !important; }

/* Opacity hover effect (series/episode cards) */
.opacityit { transition: opacity var(--speed); }
.opacityit:hover { opacity: 0.88; }

/* --- News/Celebrities: 275px Grid Cards --- */
div[style*="width: 275px"][style*="background: #000000"] {
  background: linear-gradient(180deg, #1a1a1a, #0d0d0d) !important;
  border-radius: var(--radius);
  overflow: hidden;
  transition: transform var(--speed), box-shadow var(--speed);
}
div[style*="width: 275px"][style*="background: #000000"]:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 18px rgba(0,0,0,0.2);
}

/* --- Content area #fff2e1 background modernization --- */
div[style*="background: #fff2e1"],
div[style*="background:#fff2e1"],
td[style*="background: #fff2e1"],
td[bgcolor="#fff2e1"] {
  background: #faf3e8 !important;
}

/* --- Page Speed: Global spacer compression --- */
img[alt="spacer"][height="15"] { height: 6px !important; }
img[alt="spacer"][height="20"] { height: 8px !important; }
img[alt="spacer"][height="25"] { height: 8px !important; }
img[alt="spacer"][height="30"] { height: 10px !important; }
img[alt="spacer"][width="760"][height="10"] { height: 4px !important; }
img[alt="spacer"][width="760"][height="5"] { height: 2px !important; }
img[alt="spacer"][width="597"][height="10"] { height: 4px !important; }
img[alt="spacer"][width="600"][height="10"] { height: 4px !important; }

/* Smooth rendering for animated cards */
.series-box, .series-card, .episode-card, .maindivart, .article-row {
  will-change: transform;
}

/* Contain center element so page content doesn't bleed into side rail ad space */
center { display: block; max-width: var(--container-width); margin: 0 auto; overflow: visible; }

/* ===========================================
   11. CONTENT SECTIONS & CARDS
   =========================================== */

.section-containt { margin-top: 23px; margin-bottom:20px; overflow: hidden;}
.section-middal { margin-top: 0; overflow: hidden;}
.section-bottom {margin-bottom:25px; overflow: hidden;}
.custom-turkish{ margin-bottom:0;}

.video-box { background-color: var(--black); overflow: hidden; direction: rtl; position: relative;}
.video-box-top img { width: 100%;}
.video-box-top {width:372px; height:315px;}
.top_series {width:372px;}
.top_sub_video {width:240px; margin-bottom:20px;}
.top_sub_video:last-child {float:right;}
.second_vid {margin-right:20px; margin-left:20px;}

.play-bg-right { bottom: 0; position: absolute; right: 0; padding-bottom: 16px; padding-right: 22px;}
.play-bg-right > a { background-color: var(--red); border-radius: 4px; color: var(--white); padding: 3px 15px;}
.play-bg-right > h4 { color: var(--white); font-size: 22px; line-height: 40px;}
.play-bg-right > h4 > a {color: var(--white)}
.play-bg-left { bottom: 0; left: 0; padding-bottom: 31px; padding-left: 25px; position: absolute;}
.play-bg { background-image: url("../../images/v-bg.png"); background-position: center bottom; background-repeat: no-repeat; background-size: 100% auto; bottom: 0; left: 0; min-height: 118px; position: absolute; right: 0;}
.play-bg-im { bottom: 0; position: absolute;}
.play-bg-btn {position: absolute; bottom: 0;}
.play-button img {margin-top: -70px; margin-left: 70px; left: 5px; bottom: 0; width: 30px; height: 30px;}
.box-right { float: right;}
.box-right h3 { bottom: 14px; color: var(--white); position: absolute; right: 17px; z-index: 2222; font-size: 20px; line-height: 30px;}
.box-right span button { background-color: #db4048; border-radius: 4px; display: block; font-size: 17px; text-align: center; width: 96px; border:none; line-height: 22px;}
.box-left { float: left;}
.box-left img { bottom: 30px; left: 36px; position: absolute;}

.drop-containt-row { margin-top: 25px; margin-bottom: 25px;}
.drop-contant-main { background-color: #373a53; height:610px;}
.drop-containt-box { background-color: #363b52; position: relative; margin-bottom: 10px; border: 1px solid #666a7e; -webkit-box-shadow: 0 0 15px 0 rgba(0,0,0,0.39); -moz-box-shadow: 0 0 15px 0 rgba(0,0,0,0.39); box-shadow: 0 0 15px 0 rgba(0,0,0,0.39); border-radius: var(--radius); transition: transform var(--speed), box-shadow var(--speed);}
.drop-containt-box:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0,0,0,0.18);}
.drop-containt-box-top { border: 1px solid rgba(255, 255, 255, .2); border-radius: 3px;}
.drop-containt-box-top img { border-radius: 3px; width: 100%;}
.drop-containt-box-bottom { bottom: 0; left: 0; position: absolute; right: 0; text-align: center; background-image: url("../../images/txt-bg.png"); background-repeat: no-repeat; background-size: 100% auto; top: 157px;}
.drop-containt-box-bottom h4 { bottom: 0; color: var(--white); left: 0; padding-bottom: 5px; position: absolute; right: 0; padding: 15px; padding-top: 100px;}
.drop-containt-box-bottom img { bottom: 0; left: 15px; position: absolute; right: 0; margin-bottom: 10px;}
.top-fastoon > img { left: -1px; position: absolute; right: 0; top: 0; width: 100%;}

.menu_cat_item {width:167px; height:260px; float:right; margin-left:22px; margin-bottom:22px}
.black_bg {width:100%; height:100%; background:url('../../images/bg_black.png'); background-repeat: repeat; position:fixed; z-index:1; opacity:0;}

.wide-radio-chrome {width: 800px; height:350px; float: center; margin:0 auto; text-align: center;}
.wide-radio-explorr {width: 730px; height:350px; float: center; margin:0 auto; text-align: center; }
.wide-radio-explorr-player {width: 720px; height: 300px; float: center; text-align:center; margin:0 auto; position: relative; border: 0;}
.wide-radio-explorr-player-AD {width: 300px; height: 250px; position: absolute; border: 0; z-index: 10;}
.json-playlist {width: 100%; float: center; text-align:left; color: var(--black); font-size:16px; letter-spacing: 0; text-decoration: none;}

.carousel-indicators li { background-color: var(--black); border: medium none;}
.carousel-control.left,.carousel-control.right {background: transparent;}
.carousel-indicators .active {background-color: var(--red); border:none;}
.carousel-indicators { bottom: 0; left: 45px;}
.banner-inner {position: absolute; text-align: center; width: 100%; margin-top: 110px; margin-left: 200px;}
.banner-inner h1 { color: var(--white);}
.inner-btn { margin-top: 12px;}
.inner-btn button { background-color: var(--red); border: medium none; border-radius: 4px; color: var(--white); font-size: 18px; padding: 2px 14px;}
.inner-btn-bottom { margin-top: 60px;}
.inner-btn-bottom a { background-color: #292d43; border-radius: 50px; color: var(--white); padding: 6px 30px; font-size: 17px;}
.turkish-box.turkish-box-no-bg { background: rgba(0, 0, 0, 0) none repeat scroll 0 0;}
.turkish-box-no-bg .turkish-box-bottom h4 {color: #2b3047; font-size: 20px;}


/* ===========================================
   12. SOCIAL & COMMENTS
   =========================================== */

.facebook-contant {background-color: #2e2e2e; height: 250px; overflow: hidden; text-align: center; float:right; display:table; border-radius: var(--radius);}
.facebook-contant-bg { height: 250px; width:440px; float:right; position: relative;}
.facebook-contant-bg-no-Banner { height: 250px; width:440px; float:left; position: relative;}
.facebook-top img { width: 100%; height: 250px; }
.facebook-top-b img { width: 100%; height: 250px; }
.face-play-bg { background-image: url("../../images/video-images-cover.png"); background-position: center bottom; background-repeat: no-repeat; background-size: 100% auto; bottom: 0; left: 0; min-height: 100%; position: absolute; right: 0;}

.fb_cmnt_container {width:440px; float:right; background: var(--white); height:auto; border:1px solid var(--gray-300); border-radius: var(--radius); overflow: hidden;}
.fb_cmnt_container_spinad {width:570px; float:right; background: var(--white); height:auto; border:1px solid var(--gray-300); border-radius: var(--radius); overflow: hidden;}
.fb_cmnt_container_2017 {width: var(--container-width); float:right; background: var(--white); height:auto; border:1px solid var(--gray-300); border-radius: var(--radius); overflow: hidden;}

.section-bottom-left-banner { background-color: var(--gray-700); width:300px; height: 250px; overflow: hidden; text-align: center; display:table; border-radius: var(--radius);}
.section-bottom-left-spin { background-color: var(--white); width:178px; height: 178px; overflow: hidden; text-align: center; display:table;}
.section-bottom-left-no-banner { background-color: var(--gray-700); width:110px; height: 250px; overflow: hidden; text-align: center; display:table;}
.section-bottom-right-no-banner { background-color: var(--gray-700); width:110px; height: 250px; overflow: hidden; text-align: center; display:table;}


/* ===========================================
   13. FOOTER
   =========================================== */

.footer {direction: rtl;}
.footer-top {background-color: #e0e3e7; overflow: hidden; height:56px; padding: 0 18px; border-top: 3px solid var(--gold);}
.footer-top-rigth { float: right;}
.footer-top-left {float: left;}
.footer-top-left .social {margin-top:15px;}
.footer-logo {float: right;}
.footer-logo img {margin-left: 12px; margin-top: 15px; border-left: 1px solid #c6ccd4; padding-left: 14px;}
.f-logo-txt {float: right; margin-top:18px;}
.f-logo-txt p {color: #354254; font-size: 15px;}
.footer-bottom {background-color: var(--gray-100); overflow: hidden; padding:25px 55px 20px 0;}
.footer-nav-head a {font-size: 16px !important; color: var(--dark-slate) !important; font-weight: bold !important;}
.footer-bottom ul li {margin-bottom:5px;}
.footer-bottom ul li a {font-size: 15px; font-weight:100; color: var(--dark-slate) !important; transition: color var(--speed);}
.footer-bottom ul li a:hover { color: var(--gold) !important;}


/* ===========================================
   14. TYPOGRAPHY - Text Classes
   =========================================== */

.text000 {font: 10pt ; font-family: verdana, geneva, lucida, 'lucida grande', arial, sans-serif; color: #3366CC;}
.text1 {color: var(--white); font-family:arial; font-size:1.42em; font-weight:bold; text-decoration: none; }
.text1new {color: var(--white); font-family:arial; font-size:1.25em; font-weight:bold; text-decoration: none; }
.textbe {color: var(--black); font-family:arial; font-size:1.2em; font-weight:bold; text-decoration: none; }
.text1a {font: 15px; font-family: arial; color: black; font-weight: bold; }
.text1b {color: var(--white); font-family:arial; font-size:20; font-weight:bolder; text-decoration: none; padding-right: 1px; }
.text1c {color: rgba(255,255,255,0.7); font-family:arial; font-size: 13px; font-weight: normal; text-decoration: none; letter-spacing: 0.3px; }
.text1c_1 {color: var(--black); font-family:arial; font-size:15; }
.text2 {font: 10px; font-family: arial; color: var(--black); font-weight: bold; }
.text3 {font: 12px; font-family: arial; color: var(--black); font-weight: bold; }
.text4 {color: var(--black); font-family:arial; font-size:1.1em; font-weight:bold; }
.text4horo {color:#a21a34; font-family:arial; font-size:1.05em; font-weight:bold; }
.textmosalsal {color: #990000; font-family:arial; font-size:1.60em; font-weight:bold; text-decoration: none; }
.text14 {color: var(--black); font-family:arial; font-size:1.3em; font-weight:bold; text-decoration: none; }
.text125 {color: #636363; font-family:arial; font-size:1.45me; font-weight:bold; text-decoration: none; }
.text145 {color: #bd2800; font-family:arial; font-size:1.42em; font-weight:bold; text-decoration: none; }
.text4_1 {color: var(--black); font-family:arial; font-size:1.1em; font-weight:bold; }
.text4a {color: var(--black); font-family: arial; font-size: 1.1em; font-weight: bold; padding-right: 1px; }
.text4b {color: #990000; font-family: arial; font-size: 18; font-weight: bolder; padding-right: 1px; }
.text4c {color: var(--black); font-family:arial; font-size:15; font-weight:bold; letter-spacing: 0; padding-right: 1px; }
.text4d {color:#E6373A; font-family:arial; font-size:16; font-weight:bold; letter-spacing: 0;}
.text4e {color:#0073AA; font-family:arial; font-size:16; font-weight:none; letter-spacing: 0;}
.text4f {color:#FF0000; font-family:arial; font-size:17; font-weight:bold; letter-spacing: 0;}
.text4g {color: var(--navy); font-family:arial; font-size:15; font-weight:bold; letter-spacing: 0; padding-right: 1px; }
.text4h {color: var(--navy); font-family:arial; font-size:16; font-weight:bold; letter-spacing: 0;}
.text5 {color: var(--black); font: 18px; font-family: arial; font-weight: bold; padding-right: 1px; }
.text5a {color: var(--black); font: 18px; font-family: arial; font-weight: bold; background-color: #FFE682; }
.text5b {color: var(--black); font: 22px; font-family: arial; font-weight: bold; }
.text5c { color:#004600; font-family:arial; font-size:16; font-weight:none; text-decoration: none; background-color: transparent; }
.text6 {color: var(--black); font-family:arial; font-size:14px; font-weight:bold; padding-right: 1px; line-height: 1.4; }
.text6a {color: var(--black); font-family:arial; font-size:14; font-weight:none; }
.text6b {color:#828282; font-family:arial; font-size:16; font-weight:none; }
.text7 {color: var(--cream); font-family:arial; font-size:14; font-weight:bold; }
.text8 {color: var(--black); font-family:arial; font-size:1.2em; font-weight:bold; text-decoration: none; }
.textArrow {color:#848577; font-family:arial; font-size:15; font-weight:bold; }
.text_1a {font: 15px; font-family: arial; color: black; font-weight: bold; padding-right: 1px; }
.text_1b { color: var(--black); font-family:arial; font-size:13px; font-weight:bold; }
.text_1b_eng { color: var(--black); font-family:arial; font-size:10px; font-weight:bold; }
.text_1c { color: var(--black); font-family:arial; font-size:15px; font-weight:none; padding-right: 1px; }
.textborj {color: var(--black); font-family: arial; font-size: 1.0em; font-weight: bold; padding-right: 1px; }
.textborja {color: var(--black); font-family: arial; font-size: 1.05em; font-weight: bold; padding-right: 1px; }
.texttitlenew {color: var(--black); font-family:arial; font-size:20; font-weight:bold; text-decoration: none; }
.style1 {color: var(--black); font-family:arial; font-size:16; font-weight:bold; }
.style2 {color:#FF0000; font-family:arial; font-size:16; font-weight:bold; }
.style3 {color:#0000FF; font-family:arial; font-size:16; font-weight:bold; }
.style4 {color:#6600CC; font-family:arial; font-size:16; font-weight:bold; }
.style5 {color:#000066; font-family:arial; font-size:16; font-weight:bold; }
.tags { font: normal 0.9em arial; color: var(--white); text-decoration: none; margin-left: 2px; }
.tag_spacer { font: normal 0.8em arial; color: var(--white); margin-left: 2px; }
#Banner {font-size:0; }
.body { color: var(--black); font-family: arial; font-size:15px; font-weight:bold; }
.body2 { color: var(--black); font-family:arial; font-size:15px; font-weight:bold;}


/* ===========================================
   15. TYPOGRAPHY - Link Classes
   Consolidated: link/visited/active share one rule
   =========================================== */

a.Linkm125, a.Linkm125:link, a.Linkm125:visited, a.Linkm125:active {color:#990000; font-family:arial; font-size:1.45em; font-weight:bold; text-decoration: none; transition: color var(--speed); }
a.Linkm125:hover {color: var(--gold-dark); }

a.LinkVIDEOMain, a.LinkVIDEOMain:link, a.LinkVIDEOMain:visited, a.LinkVIDEOMain:active {color: var(--white); font-family:Arial; font-size:1.1em; font-weight:bold; text-decoration: none; }
a.LinkVIDEOMain:hover {color:#D7D7D7; background-color: transparent; }

a.musicMain, a.musicMain:link, a.musicMain:visited, a.musicMain:active {color: var(--white); font-family:Arial; font-size:1.25em; font-weight:bold; text-decoration: none; text-shadow: 0 1px 2px rgba(0,0,0,0.3); transition: color var(--speed); }
a.musicMain:hover {color: var(--cream); background-color: transparent; }

a.LinkVIDEO, a.LinkVIDEO:link, a.LinkVIDEO:visited, a.LinkVIDEO:active {color:#595959; font-family:Arial; font-size:13; font-weight:bold; text-decoration: none; }
a.LinkVIDEO:hover {color: var(--gold); background-color: transparent; }

a.MenuLink, a.MenuLink:link, a.MenuLink:visited, a.MenuLink:active {font-size:20; font-family:arial; color: var(--black); font-weight:bold; text-decoration: none; background-color: transparent; }
a.MenuLink:hover {color:#786E5F; }

a.Link1, a.Link1:link, a.Link1:visited, a.Link1:active {color: var(--navy); font-family:arial; font-size:1em; font-weight:bold; text-decoration: none; transition: color var(--speed); }
a.Link1:hover {color: var(--gold-dark); background-color: transparent; }

a.Link2, a.Link2:link, a.Link2:visited, a.Link2:active {color: var(--navy); font-family:arial; font-size:0.95em; font-weight:bold; text-decoration: none; transition: color var(--speed); }
a.Link2:hover {color: var(--gold-dark); background-color: transparent; }
.video-thumb-title a.Link2:hover { color: var(--gold) !important; background: none !important; }

a.Link3, a.Link3:link, a.Link3:visited, a.Link3:active {color: var(--navy); font-family:arial; font-size:15; font-weight:bold; text-decoration: none; }
a.Link3:hover {color:#7396b8; background-color: transparent; }

a.Link3W:link{color: var(--white); font-family:arial; font-size:17; font-weight:bold; text-decoration: none; }
a.Link3W:visited{color: var(--white); font-family:arial; font-size:17; font-weight:bold; text-decoration: none; }
a.Link3w:active{color: var(--white); font-family:arial; font-size:17; font-weight:bold; text-decoration: none; }
a.Link3w:hover {color: var(--black); background-color: transparent; }

a.Link3a, a.Link3a:link, a.Link3a:visited, a.Link3a:active {color:#4582FC; font-family:arial; font-size:1em; font-weight:bold; text-decoration: none; transition: color var(--speed); }
a.Link3a:hover {color: var(--gold-dark); background-color: transparent; }

a.Link3b, a.Link3b:link, a.Link3b:visited, a.Link3b:active {color:#0000FE; font-family:arial; font-size:15; font-weight:bold; text-decoration: underline; }
a.Link3b:hover {color: var(--white); text-decoration: none; background-color: transparent; }

a.Link3c, a.Link3c:link, a.Link3c:visited, a.Link3c:active {color: var(--black); font-family:arial; font-size:14; font-weight:bold; text-decoration: none; }
a.Link3c:hover {color:#0000FE; background-color: transparent; }

a.Link3d, a.Link3d:link, a.Link3d:visited, a.Link3d:active {color:#4582FC; font-family:arial; font-size:16; font-weight:bold; text-decoration: none; }
a.Link3d:hover {color: var(--black); background-color: transparent; }

a.Link3f, a.Link3f:link, a.Link3f:visited, a.Link3f:active {color:#ff0000; font-family:arial; font-size:16; font-weight:bold; text-decoration: none; }
a.Link3f:hover {color: var(--black); background-color: transparent; }

a.Link3e, a.Link3e:link, a.Link3e:visited, a.Link3e:active {color: var(--black); font-family:arial; font-size:14; font-weight:bold; text-decoration: none; }
a.Link3e:hover {color:#4582FC; background-color: transparent; }

a.Link3g, a.Link3g:link, a.Link3g:visited, a.Link3g:active {color: var(--gold); font-family:arial; font-size: 13px; font-weight:bold; text-decoration: underline; transition: color var(--speed); }
a.Link3g:hover {color: var(--gold-light); background-color: transparent; }

a.Link4, a.Link4:link, a.Link4:visited, a.Link4:active {color: var(--navy); font-family:arial; font-size:1.05em; font-weight:bold; text-decoration: none; transition: color var(--speed); }
a.Link4:hover {color: var(--gold-dark); background-color: transparent; }

a.Link5, a.Link5:link, a.Link5:visited, a.Link5:active {color: var(--navy); font-family:arial; font-size: 1.2em; font-weight:bold; text-decoration: none; padding-right: 1px; transition: color var(--speed); }
a.Link5:hover {color: var(--gold-dark); background-color: transparent; }

a.Link5p, a.Link5p:link, a.Link5p:visited, a.Link5p:active {color: var(--navy); font-family:arial; font-size: 1.27em; font-weight:bold; text-decoration: none; padding-right: 1px; transition: color var(--speed); }
a.Link5p:hover {color: var(--gold-dark); background-color: transparent; }

a.Link5a, a.Link5a:link, a.Link5a:visited, a.Link5a:active {color: var(--black); font-family:arial; font-size:14; font-weight:bold; text-decoration: none; }
a.Link5a:hover {color:#0000FF; }

a.Link6, a.Link6:link, a.Link6:visited, a.Link6:active {color: var(--black); font-family:arial; font-size:13; font-weight:bold; text-decoration: none; }
a.Link6:hover {color: var(--black); background-color: transparent; }

a.Link7, a.Link7:link, a.Link7:visited, a.Link7:active {color: var(--navy); font-family:arial; font-size:16; font-weight:bold; letter-spacing: 0; text-decoration: none; transition: color var(--speed); }
a.Link7:hover {color: var(--gold-dark); background-color: transparent; }

a.Link8, a.Link8:link, a.Link8:visited, a.Link8:active {color: var(--black); font-family:arial; font-size:15; font-weight:bold; text-decoration: none; transition: color var(--speed); }
a.Link8:hover {text-decoration: underline; text-decoration-color: var(--gold); text-underline-offset: 2px; background-color: transparent; }

a.Link11, a.Link11:link, a.Link11:visited, a.Link11:active {color: var(--white); font-family:arial; font-size:15; font-weight:bold; text-decoration: none; }
a.Link11:hover {background-color: transparent; }

a.Link11a, a.Link11a:link, a.Link11a:visited, a.Link11a:active {color: var(--white); font-family:arial; font-size:17; font-weight:bold; text-decoration: none; }
a.Link11a:hover {background-color: transparent; }

a.Link11b, a.Link11b:link, a.Link11b:visited, a.Link11b:active {color: var(--black); font-family:arial; font-size:17; font-weight:bold; text-decoration: none; }
a.Link11b:hover {background-color: transparent; }

a.Link11c, a.Link11c:link, a.Link11c:visited, a.Link11c:active {color:#FFC061; font-family:arial; font-size:19; font-weight:bold; text-decoration: none; }
a.Link11c:hover {background-color: transparent; }

a.Link11d, a.Link11d:link, a.Link11d:visited, a.Link11d:active {color: var(--black); font-family:arial; font-size:17; font-weight:none; text-decoration: none; }
a.Link11d:hover {background-color: transparent; }

a.Link11e, a.Link11e:link, a.Link11e:visited, a.Link11e:active {color: var(--black); font-family:arial; font-size:1.1em; font-weight:bold; text-decoration: none; }
a.Link11e:hover {color: var(--white); background-color: transparent; }

a.Link11g, a.Link11g:link, a.Link11g:visited, a.Link11g:active {color: var(--black); font-family:arial; font-size:16; font-weight:bold; text-decoration: none; }
a.Link11g:hover {color: var(--white); background-color: transparent; }

a.Link10, a.Link10:link, a.Link10:visited, a.Link10:active {color: #CC0000; font-size: 14px; text-decoration: underline; background-color: transparent; font-weight: bold; font-family: arial;}
a.Link10:hover {text-decoration: underline; }

a.Link9, a.Link9:link, a.Link9:visited, a.Link9:active {color: var(--black); font-size: 12px; text-decoration: none; font-family: arial; font-weight: none;}
a.Link9:hover {text-decoration: underline; }

a.Link11f, a.Link11f:link, a.Link11f:visited, a.Link11f:active {color: var(--navy); font-family:arial; font-size:14; font-weight:none; text-decoration: none; transition: color var(--speed); }
a.Link11f:hover {color: var(--gold-dark); background-color: transparent; }

a.BodyLink, a.BodyLink:link, a.BodyLink:visited, a.BodyLink:active {color: #0000FF; font-size: 10px; text-decoration: none; background-color: transparent; font-weight: none; font-family: arial;}
a.BodyLink:hover {text-decoration: none; }

a.JQLinkA, a.JQLinkA:link, a.JQLinkA:visited, a.JQLinkA:active {color:#FF0000; font-family:arial; font-size:16; font-weight:none; text-decoration: none; }
a.JQLinkA:hover {color: var(--black); }

a.JQLinkB, a.JQLinkB:link, a.JQLinkB:visited, a.JQLinkB:active {color: var(--black); font-family:arial; font-size:16; font-weight:none; text-decoration: none; }
a.JQLinkB:hover {color:#FF0000; }

a.ExtraLinks, a.ExtraLinks:link, a.ExtraLinks:visited, a.ExtraLinks:active {color: #0000FF; font-family:arial; font-size:20px; font-weight:bold; text-decoration: none; }
a.ExtraLinks:hover {color: var(--black); }

a.QAs, a.QAs:link, a.QAs:visited, a.QAs:active {color: var(--black); font-family:arial; font-size:16; font-weight:none; text-decoration: none; }
a.QAs:hover {color: var(--black); }

a.expandwhite, a.expandwhite:link, a.expandwhite:visited, a.expandwhite:active {color: var(--white); font-family:Arial; font-size:1.20em; font-weight:bold; text-decoration: none; }
a.expandwhite:hover {color:#D7D7D7; background-color: transparent; }

a.expandblack, a.expandblack:link, a.expandblack:visited, a.expandblack:active {color: var(--black); font-family:Arial; font-size:1.20em; font-weight:bold; text-decoration: none; }
a.expandblack:hover {color:#D7D7D7; background-color: transparent; }

a.newbar, a.newbar:link, a.newbar:visited, a.newbar:active {color: var(--white); font-family:Arial; font-size:1.00em; font-weight:bold; text-decoration: none; }
a.newbar:hover {color:#fde5b1; background-color: transparent; }


/* ===========================================
   16. PAGINATION & NAV STATES s
   =========================================== */

.pagination{ padding-top:0; padding-bottom: 12px; margin:0; margin-top:-6px;}
.pagination li { float: right; line-height:27px; margin-left:5px;}
.pagination li a { border-radius: var(--radius-sm); color: #3d425b; font-size: 14px; padding:0; width: 23px; height: 27px; text-align: center; line-height:25px; transition: background-color var(--speed-fast);}
.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover{ background-color: var(--red-active); outline:none; border-color:#ddd; border-radius: var(--radius-sm);}

.cls_nav_active { color: var(--black); background-color: #fedca1; border: solid 1px var(--cream); cursor: pointer; }
.cls_nav_active:hover { color: var(--black); background-color: #faa322; border: solid 1px var(--black); cursor: pointer; }
.cls_nav_current { font-family: arial; font-size:15; color: var(--black); background-color: #faa322; border: solid 1px var(--cream); cursor: pointer; }
.cls_nav_current:hover { color: var(--black); background-color: #faa322; border: solid 1px var(--black); cursor: pointer; }

a.nav_link, a.nav_link:link, a.nav_link:visited, a.nav_link:active, a.nav_link:hover {color: var(--black); font-family: arial; font-size:15; font-weight:none; text-decoration: none; }
a.nav_curr_link, a.nav_curr_link:link, a.nav_curr_link:visited, a.nav_curr_link:active, a.nav_curr_link:hover {color: var(--black); font-family: arial; font-size:15; font-weight:none; text-decoration: none; }


/* ===========================================
   17. FORMS & INPUTS
   =========================================== */

select.selectstyle {background: var(--white); color: var(--black); border:0 solid var(--black); font-size:11px;}
select.selectstyle1 {background: var(--white); color: var(--black); border:0 solid var(--black); font-size:12px;}

INPUT.SmallButt { font-family: tahoma, arial; font-size: 12px; font-weight: none; color: var(--white); background-color: var(--black); border: 1px black solid; border-color: var(--black); width: 80px; height: 20px; cursor: hand; }
INPUT.SmallButt1 { font-family: tahoma, arial; font-size: 12px; font-weight: none; color: var(--white); background-color: var(--black); border: 1px black solid; border-color: var(--white); width: 80px; height: 20px; cursor: hand; }
INPUT.txtbox1 { background: var(--white); color: var(--black); border:1px solid #7F9DB9; width:200px; height:20px; font-size:11px; }
INPUT.txtbox2 { background: var(--white); color: var(--black); border:1px solid #7F9DB9; width:140px; height:20px; font-size:11px; }

.TxtArea { background: var(--white); font-family: verdana, arial; font-size: 11px; width: 200px; height: 130px; font-weight: none; color: var(--black); border:1px solid #7F9DB9; background-color: var(--white);}
.TxtArea1 { background: var(--white); font-family: verdana, arial; font-size: 11px; width: 200px; height: 260px; font-weight: none; color: var(--black); border:1px solid #7F9DB9; background-color: var(--white);}


/* ===========================================
   18. POPUP & MODALS
   =========================================== */

#popup1{ display:none; margin-top:12px;}
#in{ position:relative; z-index:25;}
.popup { display: none; position: fixed; padding: 10px; width: 280px; left: 50%; margin-left: -150px; height: 180px; top: 50%; margin-top: -100px; background: var(--white); z-index: 20;}
#popup1 { -webkit-box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.5); box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.5);}


/* ===========================================
   19. SLICK SLIDER (Third Party)
   =========================================== */

.slick-slider { position: relative; display: block; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }
.slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; }
.slick-list:focus { outline: none; }
.slick-list.dragging { cursor: pointer; cursor: hand; }
.slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
.slick-track { position: relative; top: 0; left: 0; display: block; }
.slick-track:before, .slick-track:after { display: table; content: ''; }
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }
.slick-slide { display: none; float: left; height: 100%; min-height: 1px; }
[dir='rtl'] .slick-slide { float: right; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }
.slick-arrow.slick-hidden { display: none; }


/* ===========================================
   20. ADS & BANNERS
   =========================================== */

.top-homepage-left-ad {display:none !important;}
.top-farfesh-ad-div { display:none !important;}
.top-ad-div { display:none !important; }

.top-wide-mid-ad { float: center; margin:0 auto; text-align: center; padding:7px 0; margin-top:7px; background: #dadada;}
.top-wide-mid-ad-760 { width: var(--container-width); height:130px; float: center; margin:0 auto; padding-top:20px; text-align: center; background-color: var(--white); margin-top:20px;}
.top-wide-mid-ad-800 { display:none !important; }
.top-wide-mid-ad-900 { display:none !important; }
.top-wide-mid-ad-1028 { display:none !important; }

.divAD { float: left; width: 336px; margin: 0 15px 15px 0; border: 0; }

.LeftBanner {position:fixed; left:0; top:63px; width:calc((100vw - 760px) / 2); min-width:160px; max-width:300px; z-index:9990; will-change:transform; backface-visibility:hidden;}
.RightBanner {position:fixed; right:0; top:200px; width:calc((100vw - 760px) / 2); min-width:160px; max-width:300px; z-index:9990; overflow:hidden; will-change:transform; backface-visibility:hidden;}
.bnr {width:auto; height:auto;}

.side-right-tall-banner-a { display:none !important;}
.side-right-tall-banner-b { display:none !important;}
.side-right-tall-banner-c { display:none !important;}
.side-left-tall-banner-a { display:none !important;}
.side-left-tall-banner-b { display:none !important;}
.side-left-tall-banner-c { display:none !important;}

span.playlist { width:15px; background:url(images/playlist_b_n.png) no-repeat; display:inline-block; cursor: pointer; float: center; width: 15px}
span.playlist_over { background:url(images/playlist_b_n.png) no-repeat -25px; }
span.playlist_on { background:url(images/playlist_b_n.png) no-repeat -25px; }
span.playlist_over_dupl { background:url(images/playlist_b_n.png) no-repeat -50px; }


/* ===========================================
   21. UTILITY CLASSES
   =========================================== */

.sp-base  { width: var(--container-width); float: center; }
.sp-cream { width: var(--container-width); float: center; background: var(--cream); }
.sp-black { width: var(--container-width); float: center; background: var(--black); }
.sp-ivory { width: var(--container-width); float: center; background: #fff2e1; }
.sp-gold  { width: var(--container-width); float: center; background: #fec16b; }
.sp-amber { width: var(--container-width); float: center; background: var(--amber); }

.white-line { width: var(--container-width); float: center; height: 2px; background: #1a1a1a;}
.black-line { width: var(--container-width); float: center; height: 1px; background: linear-gradient(90deg, transparent 0%, var(--gold) 20%, var(--gold) 80%, transparent 100%); }
.white-thick-line { width: var(--container-width); float: center; height: 1px; background: #1a1a1a;}
.black-thick-line { width: var(--container-width); float: center; height: 1px; background: linear-gradient(90deg, transparent 0%, rgba(180,140,70,0.3) 20%, rgba(180,140,70,0.3) 80%, transparent 100%);}
.white-specer-line { width: 9px; float: right; background: var(--white);}
.spacer-white-15 {width:100%; background-color: var(--white); height:15px;}

.opacityit { transition: opacity var(--speed), transform var(--speed); display: inline-block; }
.opacityit:hover { opacity: 0.92; transform: scale(1.03); }

.iewrap1{ position:relative;}
.iewrap2{ position:absolute;}

.Body_Style { background-color: var(--black); scrollbar-3dlight-color:#FFEACB; scrollbar-arrow-color: var(--black); scrollbar-base-color:#FFCB7F; scrollbar-track-color:#FFEACB; scrollbar-darkshadow-color:#FFEACB; scrollbar-face-color:#FFCB7F; scrollbar-highlight-color:#FFEACB; scrollbar-shadow-color:#FFEACB; }


/* ===========================================
   22. RESPONSIVE - Media Queries
   =========================================== */

/* --- Small: max 1009px --- */
@media only screen and (max-width: 1009px) {
    .tallright1, .tallright2, .tallright3 { display:none !important; }
    .tallrightsulv { display:none !important; }
    .plus_responsive_Home_Page_H-600 { display:none !important; }
    .plus_sulvo_160x600 { width:1px !important; overflow: hidden !important; display:none !important; visibility: hidden !important;}
    .tallleft1, .tallleft2, .tallleft3 { display:none !important; }
    .sulvo300 { display:none !important; }
    .plus_tall_skyscrsper { display:none !important; }

    .drop_menu { background-image: url('../../images/farfeshplusmasterBR.jpg'); background-repeat: no-repeat; background-size: 100% 100%; padding:0; margin:0; list-style-type:none; height:54px; z-index: 200; width: 100%; }
    .drop_menu li { float:right; }
    .drop_menu li a { padding: 7px 7px 3px; display:block; text-decoration:none; font-weight:bold; color: var(--text-nav); z-index: 200; font-size: 15px; }
    .drop_menu li span { padding:17px 6px; display:block; cursor: pointer; text-decoration:none; font-weight:bold; color: var(--text-white); z-index: 200; font-family:arial; font-size:1.25em; }
    .toplogobig { background-image: url('../../images/farfeshplasmasterlogo215x54.new.jpg'); background-repeat: no-repeat; background-position: left top; display: block; width: 200px; height: 50px; cursor: pointer; overflow: hidden; }
}

/* --- Medium-Small: 1010-1099px --- */
@media only screen and (min-width: 1010px) and (max-width: 1099px) {
    .tallright1 {width:calc((100vw - 760px) / 2); min-width:120px; max-width:200px; padding: 0; margin: 0; position:fixed; right:0; top:200px; z-index:9990; overflow:hidden;}
    .tallright2, .tallright3 { display:none !important; }
    .tallrightsulv { display:none !important; }
    .plus_responsive_Home_Page_H-600 {width:calc((100vw - 760px) / 2) !important; min-width:120px; max-width:200px; height: 600px; text-align: right; padding: 0; margin: 0; position:fixed; right:0 !important; top:200px !important; display: block; z-index:9990; overflow:hidden;}
    .plus_sulvo_160x600 { width:120px !important; display:none !important; visibility: hidden !important; overflow: hidden !important;}
    .tallleft1 {width:calc((100vw - 760px) / 2); min-width:120px; max-width:200px; padding: 0; margin: 0; position:fixed; left:0; top:63px; z-index:9990;}
    .tallleft2, .tallleft3 { display:none !important; }
    .sulvo300 { display:none !important; }
    .plus_tall_skyscrsper {width:calc((100vw - 760px) / 2) !important; min-width:120px; max-width:200px; height: 600px; text-align: left; padding: 0; margin: 0; position:fixed; left:0 !important; top:63px !important; display: block; z-index:9990;}

    .drop_menu { background-image: url('../../images/farfeshplusmasterBR.jpg'); background-repeat: no-repeat; background-size: 100% 100%; padding:0; margin:0; list-style-type:none; height:54px; z-index: 200; width: 100%; }
    .drop_menu li { float:right; }
    .drop_menu li a { padding: 7px 7px 3px; display:block; text-decoration:none; font-weight:bold; color: var(--text-nav); z-index: 200; font-size: 15px; }
    .drop_menu li span { padding:17px 6px; display:block; cursor: pointer; text-decoration:none; font-weight:bold; color: var(--text-white); z-index: 200; font-family:arial; font-size:1.25em; }
    .toplogobig { background-image: url('../../images/farfeshplasmasterlogo215x54.new.jpg'); background-repeat: no-repeat; background-position: left top; display: block; width: 200px; height: 50px; cursor: pointer; overflow: hidden; }
}

/* --- Medium-Large: 1100-1390px --- */
@media only screen and (min-width: 1100px) and (max-width: 1390px) {
    .tallright1 { display:none !important; }
    .tallright2 {width:calc((100vw - 760px) / 2); min-width:160px; max-width:300px; padding: 0; margin: 0; position:fixed; right:0; top:200px; z-index:9990; overflow:hidden;}
    .tallright3 { display:none !important; }
    .tallrightsulv {width:calc((100vw - 760px) / 2); min-width:160px; max-width:300px; padding: 0; margin: 0; position:fixed; right:0; top:200px; z-index:9990; overflow:hidden;}
    .plus_responsive_Home_Page_H-600 { display:none !important; }
    .plus_sulvo_160x600 {width:calc((100vw - 760px) / 2); min-width:160px; max-width:300px; height: 600px; text-align: right; position:fixed; right:0 !important; bottom:0 !important; display: block;}
    .tallleft1 { display:none !important; }
    .tallleft2 {width:calc((100vw - 760px) / 2); min-width:160px; max-width:300px; padding: 0; margin: 0; position:fixed; left:0; top:63px; z-index:9990;}
    .tallleft3 { display:none !important; }
    .sulvo300 { display:none !important; }
    .plus_tall_skyscrsper {width:calc((100vw - 760px) / 2) !important; min-width:160px; max-width:300px; height: 600px; text-align: left; padding: 0; margin: 0; position:fixed; left:0 !important; top:63px !important; display: block; z-index:9990;}

    .drop_menu { background-image: url('../../images/farfeshplusmasterBR.jpg'); background-repeat: no-repeat; background-size: 100% 100%; padding:0; margin:0; list-style-type:none; height:58px; z-index: 200; width: 100%; }
    .drop_menu li { float:right; }
    .drop_menu li a { padding: 8px 8px 3px; display:block; text-decoration:none; font-weight:bold; color: var(--text-nav); z-index: 200; font-size: 16px; }
    .drop_menu li span { padding:17px 6px; display:block; cursor: pointer; text-decoration:none; font-weight:bold; color: var(--text-white); z-index: 200; font-family:arial; font-size:1.42em; }
    .toplogobig { background-image: url('../../images/farfeshplasmasterlogo215x54.new.jpg'); background-repeat: no-repeat; background-position: left top; display: block; width: 234px; height: 57px; cursor: pointer; overflow: hidden; }
}

/* --- Large: 1391px+ --- */
@media only screen and (min-width: 1391px) {
    .tallright1, .tallright2 { display:none !important; }
    .tallright3 {width:calc((100vw - 760px) / 2); min-width:160px; max-width:300px; padding: 0; margin: 0; position:fixed; right:0; top:200px; z-index:9990; overflow:hidden;}
    .tallrightsulv {width:calc((100vw - 760px) / 2); min-width:160px; max-width:300px; padding: 0; margin: 0; position:fixed; right:0; top:200px; z-index:9990; overflow:hidden;}
    .plus_responsive_Home_Page_H-600 { display:none !important; }
    .plus_sulvo_160x600 {width:calc((100vw - 760px) / 2); min-width:160px; max-width:300px; height: 600px; text-align: right; position:fixed; right:0 !important; bottom:0 !important; display: block;}
    .tallleft1, .tallleft2 { display:none !important; }
    .tallleft3 {width:calc((100vw - 760px) / 2); min-width:160px; max-width:300px; padding: 0; margin: 0; position:fixed; left:0; top:63px; text-align:left !important; z-index:9990;}
    .sulvo300 { width:calc((100vw - 760px) / 2); min-width:160px; max-width:300px; padding: 0; margin: 0; position:fixed; left:0; bottom: 0 !important; text-align:left !important; transition: bottom 0.3s;}
    .plus_tall_skyscrsper {width:calc((100vw - 760px) / 2) !important; min-width:160px; max-width:300px; height: 600px; text-align: left; padding: 0; margin: 0; position:fixed; left:0 !important; top:63px !important; display: block; z-index:9990;}

    .revcontentright, .revcontentleft { width: 15vw; max-width: 200px; min-width: 100px; position: fixed; top: 10px; }
    .revcontentright { right: 10px; }
    .revcontentleft { left: 10px; }

    .drop_menu { background-image: url('../../images/farfeshplusmasterBR.jpg'); background-repeat: no-repeat; background-size: 100% 100%; padding:0; margin:0; list-style-type:none; height:58px; z-index: 200; width: 100%; }
    .drop_menu li { float:right; }
    .drop_menu li a { padding: 8px 8px 3px; display:block; text-decoration:none; font-weight:bold; color: var(--text-nav); z-index: 200; font-size: 16px; }
    .drop_menu li span { padding:17px 6px; display:block; cursor: pointer; text-decoration:none; font-weight:bold; color: var(--text-white); z-index: 200; font-family:arial; font-size:1.42em; }
    .toplogobig { background-image: url('../../images/farfeshplasmasterlogo215x54.new.jpg'); background-repeat: no-repeat; background-position: left top; display: block; width: 234px; height: 57px; cursor: pointer; overflow: hidden; }
}

@media (max-width: 768px) {
    .revcontentright, .revcontentleft { width: 20vw; max-width: 150px; }
}
@media (max-width: 480px) {
    .revcontentright, .revcontentleft { width: 25vw; max-width: 120px; }
}