/*===========RESET CSS=============*/
*{
margin: 0;
padding: 0;
box-sizing: border-box;
}

 /* .sticky-weather-header-menu{position: sticky;
    top: 0;
    z-index: 9999;
    background: rgba(255,255,255,0.95);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid #e5e7eb80;
    width: 100%;
} */
.sticky-weather-header-menu{
    width:100%;
    background:#fff;
    border-bottom:1px solid #e5e7eb80;
    z-index:9999;
    transition:all .3s ease;
}

/* AFTER SCROLL */
.sticky-weather-header-menu.fixed{
    position:fixed;
    top:0;
    left:0;
    right:0;
    max-width:1000px;
    margin:auto;
    background:rgba(255,255,255,.96);
    backdrop-filter:blur(10px);
}
.scroll-section{
    scroll-margin-top:90px;
}
.oi-weather-header-menu{padding: 12px 16px;display: flex;gap: 8px;justify-content: space-between;align-items: center;margin-left: auto;margin-right: auto;}
.oi-weather-header-logo{width: 85px;flex-shrink: 0;display: flex;}
.oi-weather-header-logo img{display: inline-block;height: 24px;}
.oi-weather-header-menubar ul{display: flex;align-items: center;justify-content: center;overflow-x: auto;gap: 4px;flex: 1 1 0%;scrollbar-width: none;}
.oi-weather-header-menubar ul li a{font-size: 14px;line-height: 20px;padding: 6px 12px;font-weight: 500;transition-duration: .2s;color: #6b7280;white-space: nowrap;cursor: pointer;border-radius: 8px;display: block;}
.sticky-weather-header-menu .oi-weather-header-menubar ul li a:hover{color: #374151;background: #f3f4f6;}
.sticky-weather-header-menu .oi-weather-header-menubar ul li a.active{color: #0369a1;background: #e0f2fe;}

.oi-weather-intro-card{margin: 32px 0px;}
.oi-weather-intro-card__title {
    font-size: 24px;
    font-weight: 700;line-height: 32px;
    color: #111827;
    margin-bottom: 0px;
}
.intro-card__title-subtext{font-size: 20px;color: #111827;line-height: 32px;display: block;margin-bottom: 12px;}
.oi-weather-intro-card__content {
    font-size: 14px;
    color: #4B5563;
    line-height: 22px;
}
.oi-weather-intro-card__text {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.oi-weather-intro-card__toggle {
    margin-top: 8px;
    background: none;
    border: none;
    padding: 0;
    font-size: 14px;line-height: 22px;
    font-weight: 500;
    color: #4B5563;
    cursor: pointer;
    transition: color 0.2s ease;
}
.oi-weather-intro-card__text.is-expanded {
    -webkit-line-clamp: unset;
}

/* weather-widget-css */
/* CARD */
.weather-card{
    height:220px;
    border-radius:24px;
    position:relative;
    background: linear-gradient(135deg, #1e40af, #1d4ed8 40%, #3b82f6);
    box-shadow:0 10px 30px rgba(0,0,0,0.08);
}

/* LIGHT GLOW */


/* RAIN */
.rain{
    position:absolute;
    inset:0;
    overflow:hidden;
}

.drop{
    position:absolute;
    bottom:100%;

    /* SMALL SIZE */
    width:1px;
    height:35px;

    background:linear-gradient(
        to bottom,
        rgba(255,255,255,0),
        rgba(255,255,255,0.35)
    );

    border-radius:50px;

    animation:rain linear infinite;
}

@keyframes rain{

    0%{
        transform:translateY(-150px);
        opacity:0;
    }

    15%{
        opacity:1;
    }

    100%{
        transform:translateY(650px);
        opacity:0;
    }
}

/* CONTENT */
.content{
    position:relative;
    z-index:2;
    display:flex;
    justify-content:space-between;
    padding:32px;
    color:#fff;
}

/* LEFT */
.location{
    display:flex;
    align-items:center;
    gap:10px;
    font-size:14px;
    line-height: 20px;
    font-weight:500;
    color:#fff;
}
/* DROPDOWN */

.weather-dropdown{
    position:relative;
}
 

/* LEFT */

.weather-dropdown-left{
    display:flex;
    align-items:center;
    gap:10px;
}

.weather-location-icon{
    width:14px;
    height:14px;
    opacity:.95;
}

.weather-location-text{
    font-size:14px;line-height: 20px;
    font-weight:500;color: #FFFFFFCC;
}

/* RIGHT */

.weather-dropdown-right{
    width:25px;
    height:30px;
    border-left:1px solid #D8E0F833;
    display:flex;
    align-items:center;
    justify-content:center;margin-left: 10px;
}

.weather-dropdown-arrow{
    width:16px;
    height:16px;
    transition:.3s ease;
}

.weather-dropdown.active 
.weather-dropdown-arrow{
    transform:rotate(180deg);
}

/* MENU */
.weather-dropdown-menu{
    position:absolute;
    top:35px;
    left:0;
    width:100%;
    border-radius:14px;background: linear-gradient(135deg, #1e40af, #1d4ed8 40%, #3b82f6);
    overflow:hidden;z-index: 999;
    opacity:0;
    visibility:hidden;
    transform:translateY(10px);
    transition:.3s ease;
    box-shadow:
        0 10px 20px rgba(0,0,0,.15);
}
.weather-dropdown.active 
.weather-dropdown-menu{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

.weather-dropdown-menu ul{
    list-style:none;
}

.weather-dropdown-menu ul li{
    padding:6px 16px;
    color:#fff;
    cursor:pointer;
    transition:.3s ease;
    border-bottom:
        1px solid rgba(255,255,255,.1);
}

.weather-dropdown-menu ul li:last-child{
    border-bottom:none;
}

.weather-dropdown-menu ul li:hover{
    background:rgba(255,255,255,.1);
}
.temp-wrap{
    display:flex;
    align-items:center;
    gap:18px;
    margin-top:14px;
}

.temp{
    font-size:72px;
    font-weight:300;
    line-height:1;
    text-shadow: 0 4px 8px rgba(0, 0, 0, .2);

}

.sun{
    /* ANIMATION */
    animation: floatMove 4s linear infinite;
}

@keyframes floatMove{

    0%{
        transform: translateY(0px);
    }

    50%{
        transform: translateY(-10px);
    }

    100%{
        transform: translateY(0px);
    }

}

.weather-text{
    margin-top:10px;
    font-size:24px;line-height: 28px;
    font-weight:600;color: #FFFFFFE5;

}

.realfeel{
    margin-top:12px;
    font-size:16px;line-height: 20px;
    color: #FFFFFFB2;
    font-weight:500;
}

/* RIGHT */
.right{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:flex-end;
}

.time{
    font-size:14px;
    line-height: 20px;
    font-weight:400;
    color: #FFFFFFB2;

}

.update{
    margin-top:5px;
    font-size:14px;
    line-height: 20px;
    font-weight:400;
    color: #FFFFFFB2;
}

/* MOBILE */
@media(max-width:900px){

    .weather-card{
        height:auto;
    }

    .content{
        flex-direction:column;
        gap:30px;
    }

    .right{
        align-items:flex-start;
    }

    .temp{
        font-size:80px;
    }
}



/* city-tab-menu */
.oi-weather-tabcitys-container{margin-top: 15px;margin-bottom: 32px;}
.oi-weather-tabcity{}
.oi-weather-tabcity ul{display: flex;align-items: self-start;justify-content: space-between;gap: 12px;}
.oi-weather-tabcity ul li{}
.oi-weather-tabcity ul li a.active{background: #D0ECFF;border: 1px solid #BEE7FD;color: #1F2937;font-weight: 500;}
.oi-weather-tabcity ul li a{background: #F3F3F3;border: 1px solid #E8E8E8;border-radius: 6px;color: #6D6D6D;padding: 16px 19px;display: block;font-size: 12px;line-height: 16px;}

/* rain-news */
.weather-news-block{transition-duration: .2s;overflow: hidden;border-radius: 16px;border: 1px solid #e5e7eb80;background-color: #fffc;backdrop-filter: blur(12px);--tw-ring-shadow: 0 0 #0000;--tw-ring-offset-shadow: 0 0 #0000;--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);display: inline-block;}
.weather-news-block:hover{    --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);
    --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);}
.weather-news-thumb{overflow: hidden;aspect-ratio: 16 / 9;}
.weather-news-thumb img{transition-duration: .3s;object-fit: cover;width: 100%;height: 100%;}
.weather-news-block:hover .weather-news-thumb img{--tw-scale-x: 1.05;--tw-scale-y: 1.05;transform: scale(1.2);}
.weather-news-thumb-desc{padding: 12px;}
.weather-news-thumb-desc p{color: #1F2937;font-weight: 600;font-size: 14px;overflow: hidden;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;white-space: initial;line-height: 20px;}
.weather-news-block:hover .weather-news-thumb-desc p{color: #0284c7;}
.news-publish{display: flex;align-items: center;gap: 8px;margin-top: 8px;}
.wether-pub-channel{color: #6b7280;font-size: 12px;line-height: 16px;}
.wether-pub-dot{border-radius: 9999px;width: 4px;height: 4px;background: #d1d5db;}
.wether-pub-time{color: #9ca3af;font-size: 12px;line-height: 16px;}
.oi-weather-news-slider ul {list-style-type: none;overflow-x: auto;white-space: nowrap;scrollbar-width: none;-ms-overflow-style: none;scroll-behavior: smooth;}
.oi-weather-news-slider{overflow: hidden;}
.oi-weather-news-slider ul li {width: 310px;display: inline-block;margin-right: 16px;transition: all 0.3s;vertical-align: top;padding-bottom: 20px;}
.oi-weather-news-slider ul li:last-child{margin-right: 0px;}
.oi-weather-rainnew-buttons {display: flex;gap: 8px;}
.oi-weather-nav-btn {width: 30px;height: 30px;display: flex;align-items: center;justify-content: center;background: none;border: none;border-radius: 8px;cursor: pointer;transition: background-color 0.2s;background: #F3F4F6;}
.oi-weather-nav-btn:disabled {opacity: 0.4;pointer-events: none;cursor: not-allowed;}
.oi-weather-nav-btn svg {width: 18px;height: 18px;}
.common-title-flex{display: flex;align-items: center;justify-content: space-between;margin-bottom: 24px;}
.common-title{color: #1F2937;font-size: 18px;line-height: 28px;font-weight: 600;margin-bottom: 24px;}
.oi-common-section-container {margin: 32px 0px;}

/* weather-faq */
.oi-weather-faq-container{border: 1px solid #E5E7EB80;background: #FFFFFFCC;backdrop-filter: blur(12px);padding: 24px 12px;border-radius: 16px;;--tw-ring-shadow: 0 0 #0000;--tw-ring-offset-shadow: 0 0 #0000;--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);}
.oi-weather-faq-container ul li{border-bottom: 1px solid #9CA3AF33;padding-bottom: 16px;margin-bottom: 16px;}
.oi-weather-faq-ques{color: #4B5563;font-size: 14px;line-height: 20px;font-weight: 600;}
.oi-weather-faq-ans{color: #4B5563;font-size: 14px;line-height: 20px;font-weight: 400;margin-top: 5px;padding-left: 16px;}
.oi-weather-faq-container ul li:last-child{border-bottom: none;margin-bottom: 0px;padding-bottom: 0px;}

/* weather-update */
.oi-weather-update-container{border: 1px solid #E5E7EB80;background: #FFFFFFCC;backdrop-filter: blur(12px);padding: 22px;border-radius: 16px;;--tw-ring-shadow: 0 0 #0000;--tw-ring-offset-shadow: 0 0 #0000;--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);}
.oi-weather-update-container ul li{position: relative;color: #4B5563;font-size: 14px;line-height: 20px;font-weight: 400;margin-bottom: 15px;}
.oi-weather-update-container ul{}
.oi-weather-update-container ul li::before{position: absolute;content: '';background: url(../images/weather/update-icon.svg) 0 0 no-repeat;width: 16px;height: 16px;}
.oi-weather-update-container ul li p{padding-left: 25px;}
.update-date{text-align: right;color: #6B7280;font-size: 12px;line-height: 16px;font-weight: 400;display: block;}
.oi-weather-update-container ul li:last-child{margin-bottom: 0px;}

/* TodayvsTomorrow */
.oi-weather-daybyday-container{border: 1px solid #E5E7EB80;background: #FFFFFFCC;backdrop-filter: blur(12px);padding: 16px;border-radius: 16px;;--tw-ring-shadow: 0 0 #0000;--tw-ring-offset-shadow: 0 0 #0000;--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);}
.weather-daybyday-table{width: 100%;border-collapse: collapse;}
.weather-daybyday-table tr th{color: #9CA3AF;font-size: 10px;line-height: 15px;font-weight: 500;text-align: center;padding: 8px;}
.weather-daybyday-table tr td{color: #1F2937;font-weight: 600;font-size: 14px;line-height: 20px;padding: 8px;text-align: center;}
.weather-daybyday-table tr th:first-child, .weather-daybyday-table tr td:first-child{text-align: left;}
.weather-daybyday-table tr th:last-child, .weather-daybyday-table tr td:last-child{text-align: right;}
.weather-daybyday-table tr td:first-child{font-size: 12px;line-height: 16px;color: #4B5563;}
.weather-daybyday-table tr td:last-child{color: #0EA5E9;font-size: 12px;line-height: 16px;font-weight: 600;}
.temp-icon {margin-right: 8px;width: 12px;height: 12px;display: inline-block;vertical-align: middle;}
.high-temp-icon {display: inline-block;width: 11px;height: 11px;margin-right: 5px;vertical-align: baseline;}
.oi-weather-otherupdates{font-size: 12px;line-height: 16px;color: #6B7280;font-weight: 400;margin-top: 24px;}

/* weather-precautions */
.oi-weather-precautions-container{border: 1px solid #E5E7EB80;background: #FFFFFFCC;backdrop-filter: blur(12px);padding: 24px;border-radius: 16px;;--tw-ring-shadow: 0 0 #0000;--tw-ring-offset-shadow: 0 0 #0000;--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);}
.weather-precautions ul{display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));gap: 12px;} 
.weather-precautions ul li{padding: 12px;border: 1px solid #f3f4f6;border-radius: 12px;transition-duration: .2s;}
.weather-precautions ul li:hover{--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);
    --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.weather-precautions-flex{display: flex;align-items: flex-start;gap: 12px;}
.precautions-icon{display: flex;width: 32px;height: 32px;flex-shrink: 0;align-items: center;justify-content: center;border-radius: 8px;}
.precautions-icon svg{display: block;vertical-align: middle;}
.precautions-dtls{flex: 1 1 0%;min-width: 0px;}
.precautions-text-flex{display: flex;align-items: center;gap: 6px;margin-bottom: 2px;}
.precautions-text{color: #1f2937;font-weight: 600;font-size: 12px;line-height: 16px;}
.amber-dot{background: #fbbf24;border-radius: 9999px;width: 6px;height: 6px;}
.red-dot{background: #f87171;border-radius: 9999px;width: 6px;height: 6px;}
.precautions-desc{color: #6b7280;font-size: 10px;line-height: 16px;}

/* Smart Recommendations */

.oi-weather-recom-container{}
.weather-recom-grid{display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));gap: 12px;}
.weather-recom-block{padding: 16px;border: 1px solid #f3f4f6;border-radius: 12px;transition-duration: .2s;display: flex;align-items: center;gap: 12px;--tw-ring-shadow: 0 0 #0000;--tw-ring-offset-shadow: 0 0 #0000;--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);}
.weather-recom-block:hover{--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);
    --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.weather-recom-icon{background: #f0f9ff;justify-content: center;border-radius: 12px;align-items: center;justify-content: center;flex-shrink: 0;width: 40px;height: 40px;display: flex;}
.weather-recom-icon svg{color: #0ea5e9;}
.weather-recom-desc{color: #374151;font-weight: 500;font-size: 14px;line-height: 20px;}

/* air-quality&health */
.dashboard{
    display:grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:16px;
}

.card{
    background: #FFFFFFCC;
    border-radius:16px;
    padding:25px;
    box-shadow:0 8px 20px rgba(0,0,0,0.08);border: 1px solid #E5E7EB80;backdrop-filter: blur(12px);
}


.top-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:16px;
}

.title{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:14px;line-height: 20px;
    font-weight:500;
    color:#4B5563;
}

.title svg{
    width:26px;
    height:26px;
}

.aqi-value{
    font-size:24px;
    list-style: 32px;
    font-weight:700;
    color:#EF4444;
}

.progress-bar{
    width:100%;
    height:8px;
    background:#d1d5db;
    border-radius:30px;
    overflow:hidden;
    margin-bottom:8px;
}

.progress{
    width:31%;
    height:100%;
    background:#ef4444;
    border-radius:30px;
}

.status{
    font-size:14px;line-height: 20px;
    font-weight:600;
    color:#EF4444;
    margin-bottom:16px;
}

.metrics{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
}

.metric-box{
    background:#F9FAFB;
    border-radius:8px;
    padding:8px;
}

.metric-box h4{
    color:#9ca3af;
    font-size:12px;line-height: 16px;
    font-weight:400;
}

.metric-box p{
    font-size:14px;line-height: 20px;
    color:#374151;
    font-weight:600;
}

.metric-box span{
    color:#9ca3af;font-size: 12px;line-height: 16px;
    font-weight:400;
}

.right-side{
    display:flex;
    flex-direction:column;
    gap:24px;
}

.small-card{
    background: #FFFFFFCC;
    border-radius:16px;
    padding:25px;
    box-shadow:0 8px 20px rgba(0,0,0,0.08);border: 1px solid #E5E7EB80;backdrop-filter: blur(12px);
}

.card-heading{
    display:flex;
    align-items:center;
    gap:12px;
    font-size:14px;
    font-weight:500;line-height: 20px;
    color:#374151;
    margin-bottom:12px;
}
.small-card.recommendations{padding: 20px;}
.recommendations ul{
    list-style:none;
}

.recommendations li{
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-bottom:14px;
    color:#4b5563;
    font-size:14px;
    line-height:20px;
}
.health-recm-icon{color: #34d399;
    width: 12px;
    height: 12px;
    position: relative;
    top: 4px;
}
.recommendations li:last-child{margin-bottom: 0px;}
.uv-content{
    display:flex;
    align-items:center;
    gap:12px;
}

.uv-circle{
    width:48px;
    height:48px;
    border-radius:9999px;
    background:#fef3c7;
    display:flex;
    align-items:center;
    justify-content:center;
}
.uv-circle span{color: #d97706;font-weight: 700;font-size: 18px;line-height: 28px;}
.uv-text h3{
    font-size:14px;line-height: 20px;
    color:#374151;
font-weight: 500;
}

.uv-text p{
    color:#6b7280;
    font-size:12px;line-height: 16px;
}


/* Sun & Moon */
.oi-weather-sun_moon-grid{display: grid;grid-template-columns: repeat(3, minmax(0, 1fr));gap: 12px;}
.weather-sun_moon-block{padding: 16px;transition-duration: .2s;--tw-ring-shadow: 0 0 #0000;
    --tw-ring-offset-shadow: 0 0 #0000;--tw-backdrop-blur: blur(12px);
    --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);background: #FFFFFFCC;border-radius: 16px;border: 1px solid #E5E7EB80;backdrop-filter: blur(12px);display: flex;align-items: center;gap: 20px;
}
.weather-sun_moon-block:hover{--tw-scale-x: 1.02;
    --tw-scale-y: 1.02;transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));}
.weather-sun_moon-icon{border-radius: 12px;justify-content: center;align-items: center;display: flex;width: 40px;height: 40px;justify-content: center;}
.weather-sun_moon-icon svg{vertical-align: middle;display: block;}
.sun_moon-head{text-transform: uppercase;font-size: 12px;line-height: 16px;color: #6B7280;font-weight: 500;}
.sun_moon-subtext{color: #1F2937;font-size: 18px;line-height: 28px;font-weight: 600;}
.waxingmoon{width: 32px;height: 32px;border-radius: 9999px;background: linear-gradient(90deg, #CBD5E1 0%, #F1F5F9 100%);box-shadow: 0px 2px 4px 0px #0000000D inset;}
*, :before, :after{
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
}

/* Current Conditions */
.weather-condition-grid{display: grid;grid-template-columns: repeat(4, minmax(0, 1fr));gap: 12px;}
.weather-condition-card{
    padding: 16px;transition-duration: .2s;--tw-ring-shadow: 0 0 #0000;
    --tw-ring-offset-shadow: 0 0 #0000;--tw-backdrop-blur: blur(12px);
    --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);background: #FFFFFFCC;border-radius: 16px;border: 1px solid #E5E7EB80;backdrop-filter: blur(12px);
}

.weather-condition-card:hover{
    --tw-scale-x: 1.02;
    --tw-scale-y: 1.02;transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.condition-card-title{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:18px;
}

.condition-card-title svg{
    width:16px;
    height:16px;
    stroke:#0ea5e9;
}

.condition-card-title span{
    font-size:12px;line-height: 16px;
    font-weight:500;
    color:#6b7280;
    letter-spacing:0.5px;
}

.condition-card-value{
    display:flex;
    align-items:baseline;
    gap:4px;
}

.condition-card-value h2{
    font-size:24px;
    color:#1f2937;
    font-weight:600;
    line-height:32px;
}

.condition-card-value p{
    font-size:14px;line-height: 20px;
    color:#6b7280;
}

/* forcast */

.forecast-wrap{
    border-radius:16px;background: #FFFFFFCC;

    overflow:hidden;border: 1px solid #E5E7EB80;
    box-shadow: 0px 4px 6px -4px #0000001A;

box-shadow: 0px 10px 15px -3px #0000001A;

backdrop-filter: blur(12px);

}

.forecast-row{
    display:flex;
    gap: 16px;
    align-items:center;
    padding:16px;
    background:#fff;
    border-bottom:1px solid #e5e7eb;
}

.forecast-row.blue{
    background:#d9eefc;
}

.day h2{
    font-size:14px;
    color:#1f2937;
    font-weight:600;
    line-height: 20px;
}

.day p{
    font-size:12px;line-height: 16px;
    color:#9ca3af;
}

.weather-icon svg{
    width:28px;
    height:28px;
    stroke:#0ea5e9;
    stroke-width:2;
    fill:none;
}

.forcast-weather-text{
    font-size:14px;line-height: 20px;
    color:#4b5563;
    flex: 1 1 0%;
}

.details{
    display:flex;
    align-items:center;
    gap:12px;
    color:#3b82f6;
    font-size:12px;line-height: 16px;
}
.detail-item-second{color: #9ca3af !important;}
.detail-item-second svg{stroke: #9ca3af !important;}
.detail-item{
    display:flex;
    align-items:center;
    gap:4px;color:#3b82f6;
    font-size:12px;line-height: 16px;
}

.detail-item svg{
    width:18px;
    height:18px;
    stroke:#2563eb;
    fill:none;
    stroke-width:2;
}

.temp{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:8px;
}

.temp strong{
    font-size:14px;line-height: 20px;font-weight: 600;width: 32px;text-align: right;
    color:#1f2937;
}

.temp span{
    font-size:14px;line-height: 20px;
    color:#9ca3af;width: 32px;
}

.temp-bar{
    width:64px;
    height:6px;
    background:#e5e7eb;
    border-radius:9999px;
    position:relative;
    overflow:hidden;
}
/* 
.temp-bar::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:30%;
    height:100%;
    background:linear-gradient(90deg,#39bdf8,#ff9d42);
    border-radius:9999px;
} */
.temp-bar-perc{background:linear-gradient(90deg,#39bdf8,#ff9d42);border-radius:9999px;position:absolute;
    left:0;
    top:0;bottom: 0;
}

/* Hourly Forecast */

.oi-forecast-block{transition-duration: .2s;padding: 12px;border-radius: 12px;display: flex;flex-direction: column;align-items: center;gap: 8px;flex-shrink: 0;min-width: 56px;}
.oi-forecast-block:hover{background: #f0f9ff;}
.oi-forecast-time{color: #6b7280;font-weight: 500;font-size: 12px;line-height: 16px;}
.forecast-degree{color: #686868;font-weight: 600;font-size: 18px;line-height: 28px;}
.forecast-humidity-icon{display: block;width: 24px;height: 24px; vertical-align: middle;}
.raining .forecast-degree{color: #1F2937;}
.forecast-humidity-perc, .forecast-wind{display: flex;align-items: center;gap: 4px;font-size: 12px;line-height: 16px;color: #9ca3af;}
.forecast-humidity-perc svg, .forecast-wind svg{width: 10px;height: 10px;}
.oi-slider{display:flex;
    gap:12px;
    transition:transform .5s ease;
    will-change:transform;
    

}
.forecast-slider-inner{position: relative;overflow: hidden;width: 100%;padding:16px;
    background:#FFFFFFCC;
    border:1px solid #E5E7EB80;
    border-radius:16px;
    box-shadow:0 10px 15px -3px rgb(0 0 0 / .1),
               0 4px 6px -4px rgb(0 0 0 / .1);box-sizing: border-box;}
.oi-weather-forecast-slider{position: relative;overflow: hidden;}
.oi-forecast-block.raining{background: #D0ECFF;box-shadow: 0px 0px 0px 1px #BAE6FD;}
.oi-slider-nav-btn{display: block !important;}
.oi-slider-nav-btn {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border-width: medium;
    border-style: none;
    border-color: currentcolor;
    border-image: initial;
    border-radius: 8px;
    transition: background-color 0.2s;
    background: rgb(243, 244, 246);
}
.oi-slider-nav-prev.disabled,
.oi-slider-nav-next.disabled{
    opacity: 0.4;
    pointer-events: none;
    cursor: not-allowed;
}
.oi-slider-nav-btn svg {
    width: 18px;
    height: 18px;
}

.oi-international-news-section, .oi-city-news-section, .oi-entertainment-news-section, .oi-lifestyle-news-section, .oi-gadgets-section, .oi-automobiles-section, .oi-travel-section, .oi-coupons-wrapper{margin-bottom: 80px;}
.oi-main-ad{margin: 24px 0 12px 0;
display: grid;
place-content: center;
padding: 0 20px;
}
.oi-article-menu{border-bottom: 1px solid var(--all-border-color);}
.oi-article-menu ul li{display: inline-block;vertical-align: middle;margin: 0px 17px;}
.oi-article-menu ul li a{color: #8F99A3;font-size: 16px;font-weight: 700;line-height: 21px;padding: 12px 0px;display: block;position: relative;}
.oi-article-menu ul li a.active{color: var(--menu-color);}
.oi-article-menu ul li a:hover{transition: all 0.3s ease;font-weight: 700;color: var(--menu-color);}
.oi-article-menu ul li a.active::after{position: absolute;content: '';background: #08F4FB;left: -2px;right: -4px;height: 5px;margin: auto;top: -2px;bottom: 0;z-index: -1;}

.oi-article-container{margin-top: 40px;}
.oi-main-heading{padding: 4px 8px 0 0px;font-size: 24px;font-weight: 700;color: var(--font-color-secondary);line-height: 30px;margin-bottom: 20px;position: relative;}
/* .circle-logo{background: url(../images/icons/oi-logo-circle-updated.svg) no-repeat 0 0;} */
/* .star-logo{background: url(../images/icons/star-logo-updated.svg) no-repeat 0 0;padding: 4px 8px 0 10px;} */
.oi-more-ontitle-arrow{position: relative;display: none;}
.oi-more-ontitle-arrow::after{border-bottom-style: solid;border-bottom-width: 2px;border-right-style: solid;border-right-width: 2px;content: "";display: inline-block;height: 6px;left: 9px;transform: rotate(45deg);position: absolute;top: 9px;width: 6px;border-color: #8F99A3;border-radius: 2px;}

.oi-left{width: 740px;float: left;}
.oi-right{width: 300px;float: right;}
.oi-main-article-lt{float: left;width: 340px;}
.oi-main-article-rt{float: right;width: 340px;padding-left: 29px;border-left: 1px solid var(--all-border-color);}
.big-article-img{border-radius: 12px;position: relative;width: 100%;height: 100%;overflow: hidden;}
.big-article-img img{width: 100%;display: block;border-radius: 12px; max-width: 100%;height: 100%;transition: all 0.3s ease}
.big-article-live{padding: 7px 0px 6px 10px;font-size: 12px; background: #E11900;color: #fff;text-align: center;border-radius: 6px;width: 50px;margin-top: 8px; position: relative;}
.live-blink{position: absolute;background: url(../images/live-blink.svg);width: 12px;height: 12px;background-repeat: no-repeat;left: 5px;top: 7px;}
.big-article-text{color: var(--font-color-primary);font-size: 18px;font-weight: 700;line-height: 21px;padding: 8px 0px;}
.big-article-country a{font-size: 14px;color: #8F99A3;font-weight: 700;line-height: 18px;}
.oi-big-article-container{padding-bottom: 24px;border-bottom: 1px solid var(--all-border-color);position: relative;}
/*.big-article-img .big-hover-text {position: absolute;color: #141A20;top: 50%;left: 50%;transform: translate(-50%, -50%);opacity: 0;border: 1px solid #08F4FB;background: #08F4FB; padding: 5px;transition: all 0.3s ease;text-align: center;font-size: 13px;z-index: 2;border-radius: 8px;}
.big-article-img .big-hover-text:before {content: '';left: -4px;top: -4px;right: -4px;bottom: -4px;border: 1px solid #08F4FB;position: absolute;z-index: -1;border-radius: 8px;}*/





.oi-big-article-container:hover .big-hover-text { opacity: 1}
.oi-big-article-container:hover .big-article-img img{transform: scale(1.2);transition: all 0.3s ease;}
.oi-article-thumb{float: left;max-width: 112px;position: relative;width: 100%;overflow: hidden;border-radius: 6px;}
.oi-article-title{margin-left: 124px;padding-bottom: 4px;}
.oi-article-title a{font-size: 15px;line-height: 20px;color: var(--font-color-secondary);}
.oi-article-country a{font-size: 12px;color: #8F99A3;line-height: 17px;}
.oi-article-thumb img{width: 100%;display: block;border-radius: 6px;max-width: 100%;transition: all 0.3s ease;}
.more-article-news ul li{height: 100px;padding-bottom: 8px;border-bottom: 1px solid var(--all-border-color);padding-top: 24px;position: relative;}
.more-article-news ul li:last-child{border-bottom: none;padding-bottom: 0px;}
.top-align-fix ul li:first-child{padding-top: 0px;}
.oi-article-thumb .hover-text{position: absolute;color: #141A20;top: 50%;left: 50%;transform: translate(-50%, -50%);opacity: 0;border: 1px solid #08F4FB;background: #08F4FB;padding: 4px;transition: all 0.3s ease;text-align: center;font-size: 10px;width: 52px;z-index: 20;border-radius: 8px;}
.oi-article-thumb .hover-text::before {content: '';left: -4px;top: -4px;right: -4px;bottom: -4px;border: 1px solid #08F4FB;position: absolute;z-index: -1;border-radius: 8px;}
.more-article-news ul li:hover .hover-text{opacity: 1;}
.more-article-news ul li:hover .oi-article-thumb img{transform: scale(1.2)}
.more-article-news ul li:hover .oi-article-title a{font-weight: 600;}
.oi-big-article-container:hover .big-article-country a, .more-article-news ul li:hover .oi-article-country a {color: #19C0C5;}

.oi-right-ad{margin-bottom: 16px;}



.oi-videos-section, .oi-photos-section, .oi-filmybeat-videos-section, .oi-wallpapers-section{background: var(--bg-color-secondary);padding: 24px 0px 24px 32px;border-radius: 16px;margin-bottom: 80px;}
.oi-widget-title-block{width: 220px;float: left;position: relative;}
.oi-widget-title, .oi-widget-title-in{position: relative;width: 208px;height: 220px;}
.w-title-text{position: absolute;left: 0%;top: 50%;line-height: 60px;text-align: center; transform: translate(0%, -50%);font-size: 36px;text-transform: capitalize;font-weight: 700;color: var(--font-color-primary);}
.oi-widget-title::before, .oi-widget-title-in:before{position: absolute;content: '';background: url(../images/icons/oi-big-circle-logo.svg) no-repeat 0 0;width: 210px;height: 205px;top: 10px;}
.oi-filmi-videos::before{background: url(../images/icons/oi-white-circle-logo.svg) no-repeat 0 0 !important;}
.oi-videos-content, .oi-filmivideos-content, .oi-photos-content, .oi-fb-videos-content, .oi-wallpapers-content, .oi-filmiphotos-content, .oi-lifestylevideos-content {margin-left: 260px;}
.oi-videos-content ul, .oi-photos-content ul, .oi-filmivideos-content ul, .oi-filmiphotos-content ul, .oi-lifestylevideos-content ul {list-style-type: none;overflow-x: auto;white-space: nowrap;}

.oi-videos-content ul, .oi-photos-content ul, .oi-filmivideos-content ul, .oi-filmiphotos-content ul, .oi-lifestylevideos-content ul {list-style-type: none;overflow-x: auto;white-space: nowrap;scrollbar-width: none;-ms-overflow-style: none; }
.oi-videos-content ul::-webkit-scrollbar, .oi-photos-content ul::-webkit-scrollbar, .oi-filmivideos-content ul::-webkit-scrollbar, .oi-filmiphotos-content ul::-webkit-scrollbar, .oi-lifestylevideos-content ul::-webkit-scrollbar { display: none;  /* Safari and Chrome */}


.oi-videos-content ul li, .oi-photos-content ul li, .oi-filmivideos-content ul li, .oi-filmiphotos-content ul li, .oi-lifestylevideos-content ul li {display: inline-block;margin-right: 16px;white-space: normal;width: 265px;}
.oi-videos-thumb, .oi-photos-thumb, .oi-ls-widget-thumb{position: relative;width: 100%;height: 100%;overflow: hidden;border-radius: 14px;margin: 3px;}
.oi-videos-thumb img, .oi-photos-thumb img, .oi-ls-widget-thumb img {border-radius: 14px;max-width: 100%;display: block;height: 100%;width: 100%;transition: all 0.3s ease;}
.oi-videos-thumb:hover img, .oi-ls-widget-thumb:hover img{transform: scale(1.2)}
/*.oi-videos-thumb:hover .oi-videos-playicon{width: 50px;transition: all 0.3s ease;height: 50px;}*/
.oi-videos-playicon{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 40px;height: 40px;z-index: 1000;background: url(../images/icons/play-video-icon.svg) no-repeat 0 0;display: block;margin: auto;background-size: contain;}
.oi-videos-title ,.oi-photos-title {overflow: hidden;padding: 12px 0px 0px 0px;height: 62px;font-size: 14px;line-height: 21px;font-weight: bold;}
.vid-time {position: absolute;left: 18px;bottom: 17px;background: var(--bg-video-time);padding: 4px 6px 4px 6px;font-size: 12px;color: var(--vid-time-color);border-radius: 20px;}
.oi-videos-titleinner, .oi-photos-titleinner {height: 62px;overflow: hidden;-webkit-line-clamp: 3;-webkit-box-orient: vertical;text-overflow: ellipsis;display: -webkit-box;}
.oi-photos-titleinner a, .oi-videos-titleinner a{color: var(--font-color-secondary);}
.oi-filmivideos-content .oi-videos-titleinner a {color: #013332;}
.oi-videos-thumb:hover{outline: 3px solid #8F99A3; border-radius: 14px;}
.oi-videos-thumb:hover img:nth-of-type(1){transform: scale(1.2);transition: all 0.3s;}

.oi-videos-logo-outer {float: left;width: 220px;position: relative;}
.oi-videos-logo {position: relative;height: 210px;}
.oi-videos-logo:before {position: absolute;content: '';background: url(../images/icons/oi-big-circle-logo.svg) no-repeat 0 0;width: 210px;height: 205px;top: 10px;}
.oi-videos-logo img {position: absolute;left: 35px;top: 70px;}

.oi-photos-playicon {position: absolute;cursor: pointer; top: 50%;left: 50%;transform: translate(-50%, -50%);width: 40px;height: 40px;z-index: 1000;background: url(../images/icons/photos-icon.svg) no-repeat 0 0;display: block;margin: auto;background-size: contain;}

.oi-fb-videos-thumb:hover .oi-videos-playicon:after, .oi-ls-widget-thumb:hover .photo-icon:after, .oi-videos-thumb:hover .oi-videos-playicon:after, .oi-en-thumb:hover .photo-icon:after {position: absolute;content: '';background: url(../images/icons/circle-border.svg) 0 0 no-repeat;width: 41px;height: 42px;background-size: 100%;}


.oi-youtube-iconwrap {display: inline-block;vertical-align: middle;width: 24px;height: 24px;background: #FF0000;border-radius: 50%;margin-right: 5px;}
.oi-youtube-icon {background: var(--youtube-icon1) no-repeat 0 0;width: 16px;height: 11px;display: inline-block;vertical-align: bottom;background-size: contain;}
.oi-followon-label {color: var(--font-color-secondary);font-size: 13px;line-height: 17px;font-weight: bold;margin: 12px 0 0 0;text-align: center;}

.oi-heading-vertcaltitle {color: var(--font-color-primary);font-size: 36px;line-height: 17px;font-weight: bold;text-align: center;position: absolute;left: 40px;bottom: 50px;}
.oi-photos-thumb:hover img, .oi-photos-image:hover img{transform: scale(1.2);}
.oi-photos-thumb:hover .oi-photos-playicon:after {position: absolute;content: '';background: url(../images/icons/circle-border.svg) 0 0 no-repeat;width: 41px;height: 42px;background-size: 100%;}


/* More-citys */
.oi-city-news-menu{border-bottom: 1px solid var(--all-border-color);}
.oi-city-news-menu ul{}
.oi-city-news-menu ul li{display: inline-block;vertical-align: middle;margin-bottom: 10px;}
.oi-city-news-menu ul li:last-child{margin-right: 0px;}
.oi-city-news-menu ul li:first-child{margin-left: 0px;}
.oi-city-news-menu ul li a{font-size: 14px;line-height: 18px;color: #8F99A3;padding: 10px 14px;border-radius: 10px;display: block;}
.oi-city-news-menu ul li a.active{background: var(--footer-list-color);color: var(--vid-time-color);}
.oi-city-news-list{display: flex;justify-content: space-between;padding-top: 24px;}
.city-col-list{width: 320px;border-right: 1px solid var(--all-border-color);padding-right: 30px;}
.city-col-list:last-child{padding-right: 0px;border-right: none;}
.city-col-list ul li:first-child{padding-top: 0px;}
.more-city-icon {width: 28px;height: 17px;background: var(--city-arrowbg);display: inline-block;vertical-align: middle;margin-left: 5px;border-radius: 5px;position: relative;}
.more-city-icon:after {content:''; border: solid #fff;border-width: 0 1px 1px 0;display: inline-block;padding: 2px;transform: rotate(45deg);-webkit-transform: rotate(45deg);transition: all 0.8s ease 0s;-moz-transition: all 0.8s ease 0s;-o-transition: all 0.8s ease 0s;position: absolute;left: 12px;top: 5px;}

.oi-more-cities-list {background: var(--bg-color-tertiary);padding: 20px;border-radius: 12px;display: none;}
.oi-more-cities-list ul {-webkit-column-count: 6;-moz-column-count: 6;column-count: 6;}
.oi-more-cities-list ul li {display: block;}
.oi-more-cities-list ul li a {color: var(--font-color-heading);padding: 6px 0;display: block;font-weight: normal;font-size: 14px;}
.oi-city-news-container.showcities .oi-more-cities-list {display: block;}
.oi-city-news-container.showcities .oi-city-news-menu {border-bottom: 0 none;}
.oi-city-news-container.showcities .more-city-icon:after {transform: rotate(-135deg);-webkit-transform: rotate(-135deg);top: 8px;}


.oi-international-news-section .city-col-list{border-right: none !important;}

/* Entertainment-widget */
.oi-entertainment-widgets-block{background: #141A20;padding: 20px 30px;border-radius: 12px;}
.oi-en-widget-btns{display: flex;align-items: center;justify-content: center;}
.oi-en-widget-btns a{background: #28313A;padding: 6px 16px;color: #fff;font-size: 14px;border-radius: 11px;margin: 0px 10px;}

.oi-en-widget-btns a.select-active{background: #08F4FB;color: #0A0E12;position: relative;}
.oi-en-widget-btns a.select-active:before {content: '';left: -4px;top: -4px;right: -2px;bottom: -4px;border: 1px solid #08f4fb;border-top-left-radius: 11px;border-bottom-left-radius: 11px;border-top-right-radius: 4px;border-bottom-right-radius: 12px;position: absolute;border-right: none;}
.oi-en-widget-btns a.select-active:after {position: absolute;content: '';right: -7px;top: -4px;border-top: 1px solid #08f4fb;border-right: 1px solid #08f4fb;height: 37px;width: 20px;border-radius: 11px;border-bottom-right-radius: 11px;border-bottom-left-radius: 0px;border-top-left-radius: 0px;}


.oi-en-movies-content{padding-top: 16px;}
.oi-en-movies-content ul{display: flex;flex-flow: row; flex-wrap: wrap;}
.oi-en-movies-content ul li{flex: 1;margin-bottom: 16px;}
.oi-en-movies-content ul li {flex: 0 0 45%;margin-right: 20px;}
.oi-en-movies-content ul li:nth-child(2n){margin-right: 0px;}
/*#celebs .oi-en-movies-content ul{display: block;}*/
.oi-en-title a{color: #fff;font-size: 15px;}
.oi-en-title{line-height: 20px;padding-top: 8px;overflow: hidden;-webkit-line-clamp: 2;-webkit-box-orient: vertical;text-overflow: ellipsis;display: -webkit-box;}
.oi-en-thumb{border-radius: 12px;overflow: hidden;position: relative;width: 100%;}
.oi-en-thumb img{max-width: 100%;display: block;height: 100%;width: 100%;max-height: 100%;transition: all 0.3s ease;}
.oi-en-thumb:hover img{transform: scale(1.2)}

.oi-more-entertainment-btn{margin-top: 5px;margin-bottom: 20px;}
.oi-more-entertainment-btn a{padding: 11px 26px;background: #fff;font-size: 14px;color: #141A20;line-height: 18px;display: block;border-radius: 11px;}
.oi-en-thumb:hover{outline: 3px solid #000; border-radius: 14px;}
.oi-en-thumb:hover img:nth-of-type(1){transform: scale(1.2);transition: all 0.3s;}

.oi-more-entertainment-btn{margin-top: 5px;margin-bottom: 20px;position: relative;}
.oi-more-entertainment-btn a:hover{background: #08F4FB;position: relative;transition: all 0.3s;}
.oi-more-entertainment-btn a:hover::before{position: absolute;content: '';left: -4px;top: -4px;right: -2px;bottom: -4px;border: 1px solid #08f4fb;border-top-left-radius: 11px;border-bottom-left-radius: 11px;border-top-right-radius: 4px;border-bottom-right-radius: 12px;border-right: none;}
.oi-more-entertainment-btn a:hover::after{position: absolute;content: '';right: -7px;top: -4px;border-top: 1px solid #08f4fb;border-right: 1px solid #08f4fb;height: 48px;width: 20px;border-radius: 11px;border-bottom-right-radius: 11px;border-bottom-left-radius: 0px;border-top-left-radius: 0px;}
.oi-more-entertainment-btn:hover:after {position: absolute;content: '';height: 20px;right: -3px;width: 20px;top: 22px;border-right: 1px solid #08F4FB;border-bottom-right-radius: 9px;}


.oi-filmybeat-videos-section{background: #FAE63C !important;}
.oi-fb-videos-content ul, .oi-wallpapers-content ul{display: flex;flex-flow: row; flex-wrap: wrap;}
.oi-fb-videos-content ul li, .oi-wallpapers-content ul li{flex: 0 0 22.5%;margin-right: 16px;position: relative;z-index: 1;}
.oi-wallpapers-content ul li:hover .oi-fb-videos-thumb img{transform: scale(1.2);}
.oi-fb-videos-content ul li a, .oi-wallpapers-content ul li a{position: relative;}
.oi-fb-videos-content ul li:last-child, .oi-wallpapers-content ul li:last-child{margin-right: 0px;}
.oi-fb-videos-thumb, .oi-wallpapers-thumb{position: relative;width: 100%;overflow: hidden;border-radius: 14px;}
.oi-fb-videos-thumb img, .oi-wallpapers-thumb img {border-radius: 14px;max-width: 100%;position: relative;display: block;height: 100%;width: 100%;transition: all 0.3s ease;}
 .oi-wallpapers-thumb:hover img {transform: scale(1.2);}
 .oi-fb-videos-content ul li:hover, .oi-wallpapers-content ul li:hover{outline: 3px solid #8F99A3; border-radius: 14px;}
 .oi-fb-videos-content ul li:hover img:nth-of-type(1), .oi-wallpapers-content ul li:hover img:nth-of-type(1){transform: scale(1.2);transition: all 0.3s;}
/* .oi-fb-videos-content ul li:hover::after{border: 2px solid #000;position: absolute;left: 0;right: 0;top: 0;bottom: 0;content: '';width: 100%;z-index: 0;} */
.fb-vid-innertext, .fb-wallpapers-innertext {position: absolute;left: 0px;bottom: 0;padding: 10px;color: #fff;font-size: 15px;line-height: 20px;overflow: hidden;-webkit-line-clamp: 3;-webkit-box-orient: vertical;text-overflow: ellipsis;display: -webkit-box;}
.oi-fb-videos-thumb:hover .oi-videos-playicon{width: 50px;transition: all 0.3s ease;height: 50px;}
.oi-sound-icon {position: absolute;top: 15px;right: 18px;width: 36px;height: 32px;border-radius: 8px;background: #00000033; }
.oi-sound-icon::after{position: absolute;height: 18px;content: '';background: url(../images/icons/sound.svg) no-repeat 0 0;width: 20px;left: 9px;top: 7px;}



.oi-lifestyle-widgets-block{background: var(--bg-lifestyle-widget);padding: 20px 18px 0px;border-radius: 12px;}
.oi-ls-widget-inner-list{height: 640px;overflow: hidden;overflow-y: auto;-ms-overflow-style: none;  /* IE and Edge */scrollbar-width: none;  /* Firefox */}
.oi-ls-widget-title{font-size: 15px;line-height: 20px;font-weight: 700;padding-top: 8px;}
.oi-ls-widget-inner-list ul li{margin-bottom: 16px;}
.oi-ls-widget-inner-list ul li a{color: var(--footer-list-color);}
.oi-ls-widget-thumb:hover .photo-icon {width: 50px;transition: all 0.3s ease;height: 50px;}
.photo-icon {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 40px;height: 40px;z-index: 1000;background: url(../images/icons/photos-icon.svg) no-repeat 0 0;display: block;margin: auto;background-size: contain;}



.oi-mobiles-block, .oi-automobi-block {background: var(--bg-color-secondary);padding: 24px 16px;border-radius: 12px;}
.oi-mobiles-list ul, .oi-automobi-list ul{display: flex;flex-flow: row;flex-wrap: wrap;}
.oi-mobiles-list ul li, .oi-automobi-list ul li{padding: 20px 12px 0px 12px;background: var(--bg-color-primary);text-align: center;flex: 0 0 38%;margin-right: 16px;margin-bottom: 12px;border-radius: 12px;}
.oi-mobiles-list ul li:nth-child(2n), .oi-automobi-list ul li:nth-child(2n){margin-right: 0px;}
.oi-mobile-title, .oi-automobi-title{font-size: 16px;font-weight: 700;line-height: 21px;color: var(--footer-list-color);padding-bottom: 16px;}
.oi-mobile-thumb{width: 65px;margin: 0 auto;}
.oi-mobile-thumb img{width: 100%;display: block;}
.oi-more-gadgets-btn{position: relative;}
.oi-more-gadgets-btn a{padding: 11px 26px;background: var(--bg-gadgets-btn);text-align: center;font-weight: 700; font-size: 14px;color: #ffffff;line-height: 18px;display: block;border-radius: 11px;}
.primary-arrow::after{border-bottom-style: solid;border-bottom-width: 2px;border-right-style: solid;border-right-width: 2px;content: "";display: inline-block;height: 7px;right: -15px;transform: rotate(-45deg);position: absolute;top: 4px;width: 7px;border-color: #fff;border-radius: 2px;}
.primary-arrow{position: relative;}
.secondary-arrow-color::after{border-color: #141A20;}



.oi-automobi-list ul li{text-align: left;padding: 20px 0px 0px 12px;flex: 0 0 42%;}
.oi-automobi-title{width: 90px;}
.oi-automobi-thumb{width: 65px;margin-left: auto;}
.oi-automobi-thumb img{}



.oi-coupons-wrapper{position: relative;}
.oi-coupons-heading-logo {display: inline-block;width: 91px;height: 26px;background: url(../images/lightmode/oneindia-logo.svg) no-repeat 0 0;background-size: cover !important;}
.oi-coupons-heading {font-size: 24px;color: var(--title-font-color);font-weight: bold;margin: 0 0 24px 0;}
.oi-coupons-container {}
.oi-coupons-container ul {display: flex;flex-flow: row;flex-wrap: wrap;}
.oi-coupons-container ul li {flex: 0 0 18.8%;margin-right: 15px;position: relative;}
.oi-coupons-container ul li:last-child{margin-right: 0px;}
.oi-coupons-container ul li a {display: block;border-radius: 12px;background: var(--bg-color-secondary);}
.oi-coupons-thumbimg {border-radius: 12px 12px 0 0;height: 175px;overflow: hidden;width: 100%;overflow: hidden;}
.oi-coupons-thumbimg img {border-radius: 12px 12px 0 0;height: 175px;max-width: 100%;position: relative;display: block;height: 100%;width: 100%;transition: all 0.3s ease;}
.oi-coupons-container ul li:hover .oi-coupons-thumbimg img{transform: scale(1.2);background: #00000078;}
.oi-coupons-title {color: var(--footer-list-color);overflow: hidden;padding: 16px;height: 62px;font-size: 15px;line-height: 20px;font-weight: bold;}
.oi-coupons-titleinner {height: 62px;overflow: hidden;-webkit-line-clamp: 3;-webkit-box-orient: vertical;text-overflow: ellipsis;display: -webkit-box;}
.oi-latest-coupons-dtls {text-align: right;position: absolute;right: 0px;top: 15px;font-size: 12px;line-height: 16px;font-weight: 400;color: var(--footer-list-color);}
.oi-coupons-thumbimg .hover-text {position: absolute;color: #141A20;top: 33%;left: 50%;transform: translate(-50%, -50%);opacity: 0;border: 1px solid #08F4FB;background: #08F4FB;padding: 4px;transition: all 0.3s ease;text-align: center;font-size: 10px;width: 65px;z-index: 2;border-radius: 8px;}
.oi-coupons-container ul li:hover .hover-text{opacity: 1;width: 70px;font-size: 13px;padding: 5px;}


/* category-page */
.oi-category-news-list .oi-article-thumb{max-width: 300px;}
.oi-category-news-list .oi-article-title{margin-left: 320px;padding-bottom: 16px;}
.oi-category-news-list .oi-article-title a{font-size: 20px;line-height: 24px;}
.oi-category-news-list  .oi-article-country{margin-left: 320px;font-size: 14px;line-height: 21px;}
.oi-category-news-list ul li:first-child{padding-top: 0px;}
.oi-category-news-list ul li{height: auto;border-bottom: none;padding-top: 32px;padding-bottom: 0px;}
.oi-category-news-list .oi-article-thumb .hover-text{padding: 5px;width: auto;font-size: 13px;}
.oi-category-news-list .oi-article-country{color: var(--menu-color);}
.oi-more-page-list {text-align: center;margin-top: 32px;margin-bottom: 80px;}
.oi-more-page-list ul{}
.oi-more-page-list ul li{display: inline-block;vertical-align: middle;margin: 0px 8px;}
.oi-more-page-list ul li a{font-size: 16px;color: var(--font-color-primary);}
.oi-more-page-list ul li a.active{padding: 10px 15px;color:var(--vid-time-color) ;background: var(--bg-page-btn);border-radius: 12px;}


.oi-city-news-menu ul li a.active:before {content: '';left: -4px;top: -4px;right: -2px;bottom: -4px;border: 1px solid #000000;border-top-left-radius: 8px;border-bottom-left-radius: 8px;border-top-right-radius: 4px;border-bottom-right-radius: 9px;position: absolute;z-index: -1;border-right: none;}
.oi-city-news-menu ul li a.active:after {position: absolute;content: '';right: -5px;top: -4px;border-top: 1px solid #000000;border-right: 1px solid #000000;height: 46px;width: 20px;border-radius: 9px;border-bottom-right-radius: 9px;border-bottom-left-radius: 0px;border-top-left-radius: 0px;}
.oi-city-news-menu ul li a{font-size: 14px;line-height: 18px;color: #8F99A3;padding: 10px 14px;border-radius: 10px;display: block;position: relative;}


/* Read More Hover Styles */

.big-article-img .big-hover-text {position: absolute;color: #141A20;top: 50%;left: 50%;font-weight: bold; transform: translate(-50%, -50%);opacity: 0;border: 1px solid #08F4FB;background: #08F4FB; padding: 5px;transition: all 0.3s ease;text-align: center;font-size: 13px;z-index: 2;border-radius: 8px;}
.big-article-img .big-hover-text:before { content: '';content: '';left: -4px;top: -4px;right: -5px;bottom: -4px;border: 1px solid #08F4FB;border-top-left-radius: 8px;border-bottom-left-radius: 8px;border-top-right-radius: 4px;border-bottom-right-radius: 9px;position: absolute;z-index: -1;border-right: none;}
.main-article-border {position: relative;}
.main-article-border:before {position: absolute;content: '';right: -14px;top: -9px;border-top: 1px solid #08F4FB;border-right: 1px solid #08F4FB;height: 33px;width: 50px;border-radius: 9px;border-bottom-right-radius: 9px;border-bottom-left-radius: 0px;border-top-left-radius: 0px;}
.main-article-border:after {position: absolute;content: '';height: 15px;right: -10px;width: 20px;top: 9px;border-right: 1px solid #08F4FB;border-bottom-right-radius: 9px;}


.oi-article-thumb .hover-text{position: absolute;color: #141A20;top: 50%;left: 50%;font-weight: bold;transform: translate(-50%, -50%);opacity: 0;width: 53px;border: 1px solid #08F4FB;background: #08F4FB;padding: 5px;transition: all 0.3s ease;text-align: center;font-size: 10px;z-index: 2;border-radius: 8px;}
.oi-article-thumb .hover-text::before {content: '';left: -4px;top: -4px;right: -2px;bottom: -4px;border: 1px solid #08F4FB;border-top-left-radius: 8px;border-bottom-left-radius: 8px;border-top-right-radius: 4px;border-bottom-right-radius: 9px;position: absolute;z-index: -1;border-right: none;}
.article-border {position: relative;}
.article-border:before {position: absolute;content: '';right: -11px;top: -9px;border-top: 1px solid #08F4FB;border-right: 1px solid #08F4FB;height: 28px;width: 20px;border-radius: 9px;border-bottom-right-radius: 9px;border-bottom-left-radius: 0px;border-top-left-radius: 0px;}
.article-border:after {position: absolute;content: '';height: 15px;right: -9px;width: 20px;top: 4px;border-right: 1px solid #08F4FB;border-bottom-right-radius: 9px;}


.oi-poweredby-label {color: var(--font-color-secondary);font-size: 15px;line-height: 17px;font-weight: bold;margin: 12px 0 0 0;text-align: center;}
.oi-filmybeat-videos-section .oi-poweredby-label {color: #28313A;}
/*
 * Advertisement Styles
 */
.oi-adblock {background: var(--ad-bg-color);margin-bottom: 36px;}
.oi-adimg {margin: 0 auto;max-width: 300px;text-align: center;padding-bottom: 12px;}
.oi-adtext {color: var(--ad-text-color);font-size: 10px;font-weight: 400;line-height: 150%;letter-spacing: 0.1px;text-transform: uppercase;padding: 12px 6px;text-align: center;}


/*
 * Next Prev Arrow Styles
 */
.oi-videos-prevnext-arrowswrapper {margin: 12px 20px 12px 0;height: 32px;position: relative;text-align: right;}

.oi-prevarrow {display: inline-block;vertical-align: middle;width: 32px;height: 32px;border-radius: 8px;background: var(--prevnext-arrow-bg);cursor: pointer;position: relative;}
.oi-nextarrow {display: inline-block;vertical-align: middle;width: 32px;height: 32px;border-radius: 8px;background: var(--prevnext-arrow-bg);margin-left: 15px;cursor: pointer;position: relative;}


.oi-nextarrow i, .oi-prevarrow i {position: absolute;left: 0;right: 0;top: 0;bottom: 0;margin: auto;width: 17px;height: 17px;}
.oi-nextarrow i {background: var(--prevnext-arrow) no-repeat 0 0;}
.oi-prevarrow i {background: var(--prevnext-arrow) no-repeat 0 0;transform: rotate(180deg);-webkit-transform: rotate(180deg);}
.hidden {background: var(--prevnext-arrow-bg-disabled);display: none;}
.hidden i {background: var(--prevnext-arrow-disabled) no-repeat 0 0;}

/*
 * LiveBlog Styles
 */
.oi-liveblog {margin: 0px 0 0 16px;font-size: 16px;font-weight: normal;text-transform: uppercase;padding: 5px 15px 4px 5px;color: var(--menu-color);vertical-align: middle;border-radius: 6px;line-height: 17px;display: flex;align-items: center;position: relative;}
.oi-liveblog span {display: inline-block;vertical-align: middle;letter-spacing: 1px;}
.oi-live-icon {display: inline-block;width: 11px;height: 12px;margin-right: 16px;position: relative;vertical-align: middle;}
.oi-live-icon:before, .oi-live-icon:after {content: '';border-radius: 15px;overflow: hidden;width: 11px;height: 11px;position: absolute;border: 2px solid #E11900;}
.oi-live-icon:before {animation: pulsate 1s ease-out infinite;border: 3px solid #E11900;left: 1px;opacity: 0;position: absolute;top: -2px;}
.oi-live-icon:after {width: 1px;height: 1px;animation: flickerAnimation 10s ease infinite;background: #E11900;left: 7px;top: 4px;}

.big-article-live {margin: 12px 0px;font-size: 14px;font-weight: bold;text-transform: uppercase;padding: 5px 15px 4px 5px;position: relative;color: #E6FEFF;vertical-align: middle;background: #E11900;border-radius: 6px;line-height: 17px;display: inline-block;width: auto;}
.big-article-live span {display: inline-block;vertical-align: middle;letter-spacing: 1px;}
.oi-liveblog-icon {display: inline-block;width: 11px;height: 12px;margin-right: 8px;position: relative;vertical-align: middle;}
.oi-liveblog-icon:before, .oi-liveblog-icon:after {content: '';border-radius: 15px;overflow: hidden;width: 11px;height: 11px;position: absolute;border: 2px solid #fff;}
.oi-liveblog-icon:before {animation: pulsate 1s ease-out infinite;border: 3px solid #fff;left: 1px;opacity: 0;position: absolute;top: -2px;}
.oi-liveblog-icon:after {width: 1px;height: 1px;animation: flickerAnimation 10s ease infinite;background: #fff;left: 7px;top: 4px;}


.oi-liveblog-section {margin: 24px 0px;}
.oi-liveblog-header {margin-bottom: 24px;}
.oi-liveblog-datetime {font-size: 16px;line-height: 21px;color: var(--liveblog-font-color);font-weight: bold;position: relative;}
.oi-liveblog-datetime.justnow span {display: inline-block;position: relative;padding: 0 0 18px 0;}
.oi-liveblog-datetime.justnow span:after {content: '';background: var(--just-now-border);height: 10px;position: absolute;left: 0;right: 0;bottom: 0;}
.oi-liveblog-content {margin-bottom: 42px;}
.oi-liveblog-desc {font-size: 15px;line-height: 22px;color: var(--liveblog-font-color);font-weight: normal;}



.small-article-live{padding: 3px 2px 3px 3px;font-size: 10px; background: #E11900;color: #fff;text-align: center;border-radius: 6px;width: 50px;position: relative;text-transform: uppercase;font-weight: bold;}
.small-article-live span {display: inline-block;vertical-align: middle;letter-spacing: 1px;}
.small-liveblog-icon {display: inline-block;width: 7px;height: 7px;margin-right: 5px;position: relative;vertical-align: middle;}
.small-liveblog-icon:before, .small-liveblog-icon:after {content: '';border-radius: 15px;overflow: hidden;width: 7px;height: 7px;position: absolute;border: 2px solid #fff;}
.small-liveblog-icon:before {animation: pulsate 1s ease-out infinite;border: 2px solid #fff;left: 1px;opacity: 0;position: absolute;top: -2px;}
.small-liveblog-icon:after {width: 1px;height: 1px;animation: flickerAnimation 10s ease infinite;background: #fff;left: 4px;top: 1px;}





/*
 * Horoscope Widget Styles
 */
.oi-horo-widget-wrapper {margin: 0 0 36px 0px;background: #1A2127;padding: 24px 10px 0 10px;border-radius: 12px;}
.oi-horo-widget-heading {padding: 4px 8px 0 10px;font-size: 24px;font-weight: bold;color: #fff;line-height: 31px;margin: 0 0px 24px 0px;font-family: Arial, Helvetica, sans-serif;}
.oi-horo-widget-content {position: relative;padding-left: 12px;}
.oi-horo-widget-content:after {content: '';clear: both;display: table;}
.oi-horo-widget-content ul {}
.oi-horo-widget-content ul li {list-style-type: none;display: inline-block;white-space: normal;margin: 0 22px 24px 0;border-bottom: 0 none;padding: 0;}
.oi-horo-widget-content ul li a {display: block;}
.oi-horo-widget-img {width: 68px;height: 68px;border-radius: 12px;overflow: hidden;}
.oi-horo-widget-img img {border-radius: 12px;transition: all 0.3s ease;}
.oi-horo-widget-content ul li:hover .oi-horo-widget-img img {transform: scale(1.5);}
.oi-horo-widget-title {font-size: 14px;color: #fff;font-weight: normal;margin: 6px 0 0 0;line-height: 21px;text-align: center;}
.oi-horo-widget-content ul li:nth-child(3n) {margin-right: 0}






/*
 * Authors page Styles
 */


.oi-authors-searchbox {margin: 24px 0px;border: 1px solid #28313A;position: relative;padding: 5px 24px 5px 40px;border-radius: 10px;}
.oi-authors-search-icon {position: absolute;left: 10px;top: 10px;width: 18px;height: 19px;background: url(../images/icons/search-icon.svg) no-repeat 0 0;display: inline-block;vertical-align: middle;}
.oi-authors-search {width: 100%;position: relative;}
.oi-authors-search:before {content: '';position: absolute;left: 0;top: 5px;height: 18px;width: 1px;background: #28313A;}
.oi-authors-search-textbox {padding: 5px 6px;border: 0 none;background: transparent;width: 100%;font-size: 13px;line-height: 18px;font-weight: normal;color: var(--font-color-fourth);outline: none;}
.oi-authors-search-close {position: absolute;right: 5px;top: 10px;background: var(--header-close) no-repeat 0 0;width: 14px;height: 14px;cursor: pointer;margin: 2px 5px;}

.oi-authors-wrapper {margin: 24px 0px;border-bottom: 1px solid var(--border-color-primary);padding: 0 0 24px 0;}
.oi-authors-content {position: relative;margin-bottom: 0px;}
.oi-authors-content:after {content: '';clear: both;display: table;}
.oi-authors-thumbimg {width: 144px;height: 176px;float: left;overflow: hidden;border: 1px solid #ededed;border-radius: 12px;}
.oi-authors-thumbimg img {border-radius: 12px;width: 144px;height: 176px;transition: all 0.3s ease;display: block;}
.oi-authors-thumbimg:hover img {transform: scale(1.2);}

.oi-authors-details {margin-left: 170px;}
.oi-author-name {font-size: 24px;line-height: 31px;font-weight: bold;margin-bottom: 12px;color: var(--font-color-heading);font-family:  Arial, Helvetica, sans-serif;}
.oi-author-name a {color: var(--font-color-heading);}
.oi-author-designation {font-size: 14px;line-height: 18px;font-weight: bold;color: var(--font-color-tertiary);margin-bottom: 12px;}
.oi-author-social-handle {margin-bottom: 24px;}
.oi-author-social-handle a {display: inline-block;margin-right: 10px;width: 32px;height: 22px;border-radius: 8px;background: #28313A;text-align: center;line-height: 20px;}
.oi-author-social-handle a i {display: inline-block;vertical-align: middle;width: 14px;height: 14px;}
.oi-author-social-handle a i.facebook {width: 14px;height: 14px;background: url(../images/icons/facebook.svg) no-repeat 0 0;}
.oi-author-social-handle a i.x {width: 14px;height: 14px;background: url(../images/icons/x.svg) no-repeat 0 0;}

.oi-authors-mainwrapper .oi-author-social-handle {margin-top: 24px;margin-bottom: 0;}

.oi-authors-desc {font-size: 16px;color: var(--font-color-tertiary);line-height: 30px;font-weight: normal;}
.nophoto .oi-authors-thumbimg {display: none;}
.nophoto .oi-authors-details {margin-left: 0;}

.oi-authors-wrapper.landing .oi-authors-thumbimg {width: 144px;float: left;height: 176px;}
.oi-authors-wrapper.landing .oi-authors-thumbimg img {width: 144px;height: 176px;}
.oi-authors-wrapper.landing .oi-author-name {font-size: 40px;line-height: 51px;font-weight: bold;}
.oi-authors-wrapper.landing .oi-authors-details {margin-left: 170px;}
.oi-authors-wrapper.landing .oi-author-designation {font-size: 14px;line-height: 18px;font-weight: bold;}


.oi-show-moreouter {margin: 36px auto 24px auto;text-align: center;}
.oi-show-more {}

.oi-show-more{border: 1px solid var(--font-color-heading);background: var(--font-color-heading);transition: all 0.3s ease;text-align: center;font-size: 14px;z-index: 2;border-radius: 12px;font-weight: bold;color: var(--bg-color-primary);line-height: 18px;padding: 10px 16px;width: 110px;position: relative;display: inline-block;}
.oi-show-more::before {content: '';left: -4px;top: -4px;right: -2px;bottom: -4px;border: 1px solid var(--font-color-heading);border-top-left-radius: 12px;border-bottom-left-radius: 12px;border-top-right-radius: 4px;border-bottom-right-radius: 12px;position: absolute;z-index: -1;border-right: none;}
.oi-outerborder-black {position: relative;}
.oi-outerborder-black:before {position: absolute;content: '';right: -24px;top: -14px;border-top: 1px solid var(--font-color-heading);border-right: 1px solid var(--font-color-heading);height: 45px;width: 20px;border-radius: 12px;border-bottom-right-radius: 12px;border-bottom-left-radius: 0px;border-top-left-radius: 0px;}
.oi-outerborder-black:after {position: absolute;content: '';height: 15px;right: -20px;width: 20px;top: 15px;border-right: 1px solid var(--font-color-heading);border-bottom-right-radius: 12px;}


.oi-photos-landing-header {display: flex;justify-content: space-between;align-items: center;margin-bottom: 24px;}
.oi-photos-landing-header .oi-breadcrumb {margin-bottom: 0;}
.oi-embedphoto {display: inline-block;}
.oi-embedphoto button {border-radius: 30px;background: var(--photos-bg-color);padding: 4px 16px;transition: all ease-in-out .4s;-webkit-transition: all ease-in-out .4s;-moz-transition: all ease-in-out .4s;-o-transition: all ease-in-out .4s;overflow: hidden;position: relative;cursor: pointer;border: 0 none;color: var(--photos-count-color);font-size: 14px;line-height: 24px;font-weight: normal;display: block;border-radius: 30px;}


/*
 * Latest Styles added 21 Aug 2024
 */


.clear {clear: both;}
.sitemap {}
.sitemap ul {}
.sitemap ul li {font-size: 16px;color: var(--font-color-primary);font-weight: bold;line-height: 30px;margin-bottom: 12px;}
.sitemap ul li a {color: var(--font-color-primary);}
.sitemap ul li.sitemapchild {padding-left: 20px;}

.photo-feature {margin: 0 16px 24px 0px;display: inline-block;width: 300px;float: left;vertical-align: middle;}
.photo-feature:nth-child(2n) {margin-right: 0;float: right;}
.photo-feature-thumb {border-radius: 12px;position: relative;overflow: hidden;}
.photo-feature-thumb img {border-radius: 12px;width: 100%;height: auto;transition: all 0.3s ease;}
.photo-feature:hover img {transform: scale(1.2);}
.category {font-size: 18px;color: #8F99A3;margin: 12px 0 0 0;}
.category a {font-size: 18px;color: #8F99A3;font-weight: 700;line-height: 18px;}
.photo-feature:hover .category a {color: #19C0C5;}
.photo-feature-heading {font-size: 15px;color: var(--font-color-primary);font-weight: bold;line-height: 25px;padding: 12px 0;height: 50px;overflow: hidden;}
.photo-feature-heading a {color: var(--font-color-primary);}

.oi-rssInfo {}
.oi-rssInfo p  {font-size: 16px;line-height: 30px;font-weight: normal;padding-bottom: 20px;color: var(--font-color-primary);}
.oi-rssBlock {padding: 20px 24px;background: var(--deeplinks-bg-color);border-radius: 12px;}
.oi-rssHeading {}
.oi-rssContent {}
.oi-rssContent ul li {font-size: 16px;color: var(--font-color-primary);font-weight: bold;line-height: 30px;margin-bottom: 12px;}
.oi-rssContent ul li a {color: var(--font-color-primary);}


.oi-notfound-title {color: var(--font-color-secondary);font-size: 18px;line-height: 24px;margin-bottom: 24px;font-weight: bold;}
.oi-notfound-subtitle {color: var(--font-color-secondary);font-size: 16px;line-height: 30px;margin-bottom: 24px;font-weight: normal;}
.oi-notfound-heading {color: var(--font-color-secondary);font-weight: bold;font-size: 24px;margin-bottom: 36px;}


.news-block {margin-bottom: 36px;}

.calendar-month {border-collapse: collapse;width: 100%;font-size: 15px;color: #000;border: 1px solid var(--border-color-primary);}
.calendar-month th {background: var(--archives-bg-color);color: var(--font-color-primary);text-align: center;padding: 10px 0;border: 1px solid var(--border-color-primary);font-size: 16px;}
.calendar-month th a {color: var(--font-color-primary);}
.calendar-month td {padding: 10px 0;text-align: center;border: 1px solid var(--border-color-primary);font-size: 16px;line-height: 30px;color: var(--font-color-primary);background: var(--bg-color-secondary);}
.calendar-month td a {color: var(--font-color-primary);}
.dayIndexHeading {font-size: 18px;color: var(--font-color-secondary);padding: 12px 10px 12px 0;font-weight: normal;text-transform: uppercase;}
.dayIndexHeading a {color: var(--font-color-secondary);}
.archive-selectboxes {float: left;background: var(--widget-bg-color1);border-radius: 5px;margin: 0 20px 24px 0;padding: 0 5px 0 0;border: 1px solid var(--border-color-primary);}
.archive-select {border-radius: 5px;background: var(--widget-bg-color1);font-size: 16px;color: var(--font-color-primary);padding: 10px 20px;width: 100%;box-sizing: border-box;border: 0 none;}

.dayIndexContent ul li {list-style-type: none;margin: 0 0 18px 0;padding-left: 20px;position: relative;font-size: 15px;color: var(--font-color-primary);}
.dayIndexContent ul li:before {content: '';position: absolute;left: 0;top: 5px;width: 0; height: 0; border-top: 5px solid transparent;border-bottom: 5px solid transparent;border-left: 5px solid #d2d5d9;}
.dayIndexContent ul li a {display: block;color: var(--font-color-primary);}
.dayIndexContent {margin-bottom: 24px;padding-bottom: 24px;border-bottom: 1px solid var(--border-color-primary);}
.archives {float: left;margin-bottom: 36px;width: 48%;}
.archives.last {float: right;}



/*
 * City News Styles
 */
.oi-city-news-menu ul li a.active {margin-right: 15px;}


.oi-local-mostsearched-block {margin-bottom: 24px;}
.one-city-mainheading {font-size: 16px;color: var(--font-color-primary);font-weight: bold;margin-bottom: 24px;padding-bottom: 24px;background: var(--bottom-border) no-repeat left bottom;}
.oi-major-cities-lists {margin: 0 0 24px 0;}
.oi-major-cities-lists ul li {display: inline-block;margin: 0 8px 12px 0;}
.oi-major-cities-lists ul li a {display: block;padding: 8px 12px;border-radius: 8px;border: 1px solid var(--border-color-primary);font-size: 14px;line-height: 18px;font-weight: bold;color: var(--font-color-primary);}
.oi-major-cities-lists ul li a.active, .oi-major-cities-lists ul li a:hover {color: #008eff;border: 1px solid #008eff;}

.oi-local-searchbox {position: relative;margin-bottom: 36px;}
.oi-local-searchbox:after {content: '';clear: both;display: table;}
.oi-local-selectbox-outer {padding: 12px 16px;border-radius: 8px;background: var(--selectbox-bg-color);margin-right: 20px;height: 46px;box-sizing: border-box;float: left;width: 280px;position: relative;}
.oi-local-selectbox-outer.last {}
.oi-local-selectbox-popup {position: absolute;left: 0;right: 0;top: 60px;background: var(--selectbox-popup-bg-color);box-shadow: 0px 4px 20px 0px #00000029;border-radius: 12px;z-index: 1000;display: none;}

.oi-local-selectbox-popup ul {padding: 12px;max-height: 300px;overflow-y: auto;}
.oi-local-selectbox-popup ul li {list-style-type: none;font-size: 16px;color: var(--selectbox-font-color);padding: 6px;display: block;cursor: pointer;}
.oi-local-selectbox-popup ul li:hover {color: #008eff;}
.oi-local-selectbox-popup ul li a {font-size: 16px;color: var(--selectbox-font-color);padding: 6px;}

.oi-state-selected, .oi-city-selected {color: var(--selectbox-font-color);font-size: 16px;display: block;position: relative;cursor: pointer;}
.oi-state-selected:after, .oi-city-selected:after {content: '';border: solid var(--selectbox-font-color);border-width: 0 2px 2px 0;display: inline-block;padding: 3px;transform: rotate(45deg);-webkit-transform: rotate(45deg);position: absolute;right: 0;top: 6px;transition: all ease-in-out .4s;-webkit-transition: all ease-in-out .4s;-moz-transition: all ease-in-out .4s;-o-transition: all ease-in-out .4s;}

.oi-local-selectbox-outer.show-dropdown .oi-local-selectbox-popup {display: block;}
.oi-local-selectbox-outer.show-dropdown .oi-state-selected:after, .oi-local-selectbox-outer.show-dropdown.show-dropdown .oi-city-selected:after {transform: rotate(225deg);-webkit-transform: rotate(225deg);}
.oi-city-desc {color: var(--font-color-primary);font-size: 14px;margin: 24px 0;line-height: 24px;}

.theme-light {
	--selectbox-bg-color: #F2F5F5;
	--selectbox-popup-bg-color: #fff;
	--selectbox-font-color: #0A0E12;
}
.theme-dark {
	--selectbox-bg-color: #28313A;
	--selectbox-popup-bg-color: #28313A;
	--selectbox-font-color: #fff;
}






.oi-socialsparks .oi-heading-vertcaltitle {left: 0px;margin: auto;right: 30px;font-size: 20px;}	
.oi-social-content {margin-left: 260px;}
.oi-social-content ul {list-style-type: none;overflow-x: auto;white-space: nowrap;}
.oi-social-content ul{list-style-type: none;overflow-x: auto;white-space: nowrap;scrollbar-width: none;-ms-overflow-style: none; }
.oi-social-content ul::-webkit-scrollbarb { display: none;  /* Safari and Chrome */}
.oi-social-content ul li {display: inline-block;margin-right: 16px;white-space: normal;width: 265px;}
.oi-social-thumb{position: relative;width: 100%;height: 100%;overflow: hidden;border-radius: 14px;margin: 3px;}
.oi-social-thumb img {border-radius: 14px;max-width: 100%;display: block;height: 100%;width: 100%;transition: all 0.3s ease;}
.oi-social-title {overflow: hidden;padding: 12px 0px 0px 0px;height: 62px;font-size: 14px;line-height: 21px;font-weight: bold;}
.oi-social-titleinner {height: 62px;overflow: hidden;-webkit-line-clamp: 3;-webkit-box-orient: vertical;text-overflow: ellipsis;display: -webkit-box;}
.oi-social-titleinner a {color: var(--font-color-secondary);}

.oi-social-playicon {position: absolute;cursor: pointer; top: 50%;left: 50%;transform: translate(-50%, -50%);width: 40px;height: 40px;z-index: 1000;background: url(../images/icons/photos-icon.svg) no-repeat 0 0;display: block;margin: auto;background-size: contain;}
.oi-social-thumb:hover img {transform: scale(1.2);}
.oi-social-thumb:hover .oi-social-playicon:after {position: absolute;content: '';background: url(../images/icons/circle-border.svg) 0 0 no-repeat;width: 41px;height: 42px;background-size: 100%;}

.oi-socialsparks-share {position: absolute;left: 0;right: 0;top: 0;bottom: 0;width: 80px;height: 40px;margin: auto;z-index: 1000;cursor: pointer;display: none;transition: all 0.3s ease;}
.oi-social-instaicon {display: inline-block;vertical-align: middle;width: 30px;height: 30px;border-radius: 50%;background: rgba(0,0,0,0.6);margin: 0 3px;text-align: center;line-height: 30px;}
.oi-social-shareicon {display: inline-block;vertical-align: middle;width: 30px;height: 30px;border-radius: 50%;background: rgba(0,0,0,0.6);margin: 0 3px;text-align: center;line-height: 30px;}
.oi-social-sharefbicon {display: none;vertical-align: middle;width: 30px;height: 30px;border-radius: 50%;background: rgba(0,0,0,0.6);margin: 0 3px;text-align: center;line-height: 30px;}
.oi-social-shareinstaicon {display: none;vertical-align: middle;width: 30px;height: 30px;border-radius: 50%;background: rgba(0,0,0,0.6);margin: 0 3px;text-align: center;line-height: 30px;}
.oi-social-sharewpicon {display: none;vertical-align: middle;width: 30px;height: 30px;border-radius: 50%;background: rgba(0,0,0,0.6);margin: 0 3px;text-align: center;line-height: 30px;}
.oi-social-closeicon {position: relative;display: none;vertical-align: middle;width: 30px;height: 30px;border-radius: 50%;background: rgba(0,0,0,0.6);margin: 0 3px;text-align: center;line-height: 30px;}

.oi-social-closeicon:before, .oi-social-closeicon:after {position: absolute;left: 5px;content: ' ';height: 14px;width: 2px;background-color: #fff;right: 5px;margin: auto;top: 0;bottom: 0;}
.oi-social-closeicon:before {transform: rotate(45deg);}
.oi-social-closeicon:after {transform: rotate(-45deg);}

.oi-social-instaicon i {display: inline-block;vertical-align: middle;width: 18px;height: 18px;background: var(--instagram1-share-icon) no-repeat 0 0;}
.oi-social-shareicon i {display: inline-block;vertical-align: middle;width: 18px;height: 18px;background: var(--share1-icon) no-repeat 0 0;}
.oi-social-sharefbicon i {display: inline-block;vertical-align: middle;width: 18px;height: 18px;background: var(--facebook1-share-icon) no-repeat 0 0;}
.oi-social-shareinstaicon i {display: inline-block;vertical-align: middle;width: 18px;height: 18px;background: var(--x1-share-icon) no-repeat 0 0;} 
.oi-social-sharewpicon i {display: inline-block;vertical-align: middle;width: 18px;height: 18px;background: var(--whatsapp1-share-icon) no-repeat 0 0;}

.oi-socialsparks-share.open  {width: 200px;}
.oi-social-thumb:hover .oi-socialsparks-share {display: block;}

.oi-socialsparks-share.open .oi-social-shareicon {display: none;}
.oi-socialsparks-share.open .oi-social-sharefbicon {display: inline-block;}
.oi-socialsparks-share.open .oi-social-shareinstaicon {display: inline-block;}
.oi-socialsparks-share.open .oi-social-sharewpicon {display: inline-block;}
.oi-socialsparks-share.open .oi-social-closeicon {display: inline-block;}


:root {
	--instagram1-share-icon: url(../images/darkmode/notf-instagram-icon.svg);
	--share1-icon: url(../images/darkmode/share-icon.svg);
	--facebook1-share-icon: url(../images/darkmode/notf-facebook-icon.svg);
	--x1-share-icon: url(../images/darkmode/notf-x-icon.svg);
	--whatsapp1-share-icon: url(../images/darkmode/notf-whatsapp-icon.svg);
}	




                     .theme-light {
                     --breakingnews-bg-color: #f2f5f5;
                     --breaking-news-title-color: #013332;
                     --breaking-news-font-color: #141a20;
                     }
                     .theme-dark {
                     --breakingnews-bg-color: #141a20;
                     --breaking-news-title-color: #ffffff;
                     --breaking-news-font-color: #ededed;
                     }
                     .oi-breakingnews-wrapper {
                     padding: 24px 16px;
                     margin-bottom: 24px;
                     background: var(--breakingnews-bg-color);
                     border-radius: 12px;
                     }
                     .oi-breakingnews-title {
                     padding: 4px 8px 0 0px;
                     font-size: 22px;
                     font-weight: bold;
                     color: var(--breaking-news-title-color);
                     line-height: 28px;
                     margin: 0 0px 0 0px;
                     font-family: "Epilogue", Times, Arial, Helvetica, sans-serif;
                     }
                     .oi-breakingnews-slide {
                     padding: 0;
                     position: relative;
                     margin: 6px 0;
                     }
                     .oi-breakingnews-slide ul {
                     white-space: nowrap;
                     width: 100%;
                     overflow-x: auto;
                     padding: 0;
                     }
                     .oi-breakingnews-slide ul::-webkit-scrollbar {
                     display: none;
                     }
                     .oi-breakingnews-slide ul li {
                     font-size: 15px;
                     color: var(--breaking-news-font-color);
                     vertical-align: top;
                     display: inline-block;
                     position: relative;
                     padding: 12px 40px 12px 0;
                     line-height: 26px;
                     font-weight: bold;
                     white-space: normal;
                     }
                     .breakingSlides {
                     display: none;
                     }
                     .oi-breakingnews-slide ul li a {
                     color: var(--breaking-news-font-color);
                     text-decoration: none;
                     }
                     .oi-breaking-next-arrow {
                     background: #28313a;
                     width: 32px;
                     height: 32px;
                     border-radius: 8px;
                     box-shadow: 0px 1.6px 4.8px 0px #00000029;
                     position: absolute;
                     right: 5px;
                     top: 6px;
                     cursor: pointer;
                     }
                     .oi-breaking-next-arrow i {
                     background: url(images/darkmode/next-arrow-white.svg) no-repeat 0 0;
                     position: absolute;
                     left: 0;
                     right: 0;
                     top: 0;
                     bottom: 0;
                     margin: auto;
                     width: 16px;
                     height: 16px;
                     }


                                          .theme-light {
                     --breakingnews-bg-color: #f2f5f5;
                     --breaking-news-title-color: #013332;
                     --breaking-news-font-color: #141a20;
                     }
                     .theme-dark {
                     --breakingnews-bg-color: #141a20;
                     --breaking-news-title-color: #ffffff;
                     --breaking-news-font-color: #ededed;
                     }
                     .oi-breakingnews-wrapper {
                     padding: 24px 16px;
                     margin-bottom: 24px;
                     background: var(--breakingnews-bg-color);
                     border-radius: 12px;
                     }
                     .oi-breakingnews-title {
                     padding: 4px 8px 0 0px;
                     font-size: 22px;
                     font-weight: bold;
                     color: var(--breaking-news-title-color);
                     line-height: 28px;
                     margin: 0 0px 0 0px;
                     font-family: "Epilogue", Times, Arial, Helvetica, sans-serif;
                     }
                     .oi-breakingnews-slide {
                     padding: 0;
                     position: relative;
                     margin: 6px 0;
                     }
                     .oi-breakingnews-slide ul {
                     white-space: nowrap;
                     width: 100%;
                     overflow-x: auto;
                     padding: 0;
                     }
                     .oi-breakingnews-slide ul::-webkit-scrollbar {
                     display: none;
                     }
                     .oi-breakingnews-slide ul li {
                     font-size: 15px;
                     color: var(--breaking-news-font-color);
                     vertical-align: top;
                     display: inline-block;
                     position: relative;
                     padding: 12px 40px 12px 0;
                     line-height: 26px;
                     font-weight: bold;
                     white-space: normal;
                     }
                     .breakingSlides {
                     display: none;
                     }
                     .oi-breakingnews-slide ul li a {
                     color: var(--breaking-news-font-color);
                     text-decoration: none;
                     }
                     .oi-breaking-next-arrow {
                     background: #28313a;
                     width: 32px;
                     height: 32px;
                     border-radius: 8px;
                     box-shadow: 0px 1.6px 4.8px 0px #00000029;
                     position: absolute;
                     right: 5px;
                     top: 6px;
                     cursor: pointer;
                     }
                     .oi-breaking-next-arrow i {
                     background: url(images/darkmode/next-arrow-white.svg) no-repeat 0 0;
                     position: absolute;
                     left: 0;
                     right: 0;
                     top: 0;
                     bottom: 0;
                     margin: auto;
                     width: 16px;
                     height: 16px;
                     }

                       .oi-left {width: 650px;}

                       li {
    list-style: none;
}
       a {
    text-decoration: none;
    color: inherit; /* optional */
}