/*
Theme Name: Blogfull
Theme URI: https://themeansar.com/free-themes/blogfull-wordpress-theme
Author: Themeansar
Author URI: https://themeansar.com
Description: Blogfull is a fast, clean, modern-looking Best Responsive News Magazine WordPress theme. The theme is fully widgetized, so users can manage the content by using easy to use widgets. Blogfull is suitable for dynamic news, newspapers, magazine, publishers, blogs, editors, online and gaming magazines, newsportals,personal blogs, newspaper, publishing or review siteand any creative website. Blogfull is SEO friendly, WPML,Gutenberg, translation and RTL ready. Live preview : https://demos.themeansar.com/blogus/blogfull/ and documentation at https://docs.themeansar.com/docs/blogus/
Version: 0.9
Requires PHP: 7.4
Requires at least: 6.7
Tested up to: 6.9
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Template: blogus
Text Domain: blogfull
Tags: blog, portfolio, news, grid-Layout, one-column, two-columns, three-columns, flexible-header, left-sidebar, right-sidebar, custom-background, custom-colors, custom-logo, custom-menu, featured-images, footer-widgets, full-width-template, post-formats, rtl-language-support, theme-options, sticky-post, threaded-comments, translation-ready, block-styles, wide-blocks

Blogfull WordPress Theme is child theme of Blogus, Copyright 2023 Themeansar
Blogfull is distributed under the terms of the GNU General Public License v3

Blogfull is based on Underscores https://underscores.me/, (C) 2012-2017 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
*/
:root {
    --raduis: 6px;
    --headFont: 'Jost', sans-serif;
}
body{
    font-family: "Onest", sans-serif;
}
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    font-weight: 700;
}
.inner .title, .bs-blog-post .title {
    line-clamp: 2;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.bs-headtwo {
    border-radius: var(--raduis);
    background: rgba(255 255 255 / 40%);
    box-shadow: none;
    backdrop-filter: blur(15px) saturate(1);
    -webkit-backdrop-filter: blur(25px) saturate(1);
    border-bottom: 1px solid rgba(255 255 255 / 40%);
    z-index: 1;
    position: relative;
}
.bs-blog-post.single .bs-header .bs-info-author-block, .page-entry-title .bs-breadcrumb-section .overlay{
    backdrop-filter: none;
    border: none;
}
.featured-widget-content .bs-blog-thumb.lg {
    height: 300px;
}
.single-class .featured-widget-content .bs-blog-thumb.lg {
    height: 250px;
}
.homemain-two .bs-blog-category{
    justify-content: center;
}
input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea, select {
    border-radius: var(--raduis);
    background: rgba(255 255 255 / 40%);
    box-shadow: none;
    backdrop-filter: blur(15px) saturate(1);
    -webkit-backdrop-filter: blur(25px) saturate(1);
    border: 1px solid rgba(255 255 255 / 40%);
}
.widget_block .wp-block-search__button, .navigation.pagination .nav-links .page-numbers, .navigation.pagination .nav-links a, .wp-block-tag-cloud a, .tagcloud a{
    border-radius: var(--raduis);
}
.bs-blog-post.single .bs-header .title{
    display: block;
}
.navbar-brand {
    margin-right: 0;
}
.bs-blog-post .title{
    font-size: 28px;
}
.list-blog.bs-blog-post{
    padding: 20px;
    border-radius: var(--raduis);
    background: rgba(255 255 255 / 40%);
    box-shadow: none;
    backdrop-filter: blur(15px) saturate(1);
    -webkit-backdrop-filter: blur(25px) saturate(1);
    border: 1px solid rgba(255 255 255 / 40%);
}
.bs-sidebar .bs-widget{
    border-radius: var(--raduis);
    background: rgba(255 255 255 / 40%);
    box-shadow: none;
    backdrop-filter: blur(15px) saturate(1);
    -webkit-backdrop-filter: blur(25px) saturate(1);
    border: 1px solid rgba(255 255 255 / 40%);
}
.wd-back {
    margin-bottom: 50px;
    padding: 20px;
    border-radius: var(--raduis);
    box-shadow: none;
    backdrop-filter: blur(15px) saturate(1);
    -webkit-backdrop-filter: blur(25px) saturate(1);
    border: 1px solid rgba(255 255 255 / 40%);
}
.bs-breadcrumb-section .overlay, .bs_model .modal-content{
    box-shadow: none;
    backdrop-filter: blur(15px) saturate(1);
    -webkit-backdrop-filter: blur(25px) saturate(1);
    border: 1px solid rgba(255 255 255 / 40%);
}
.bs-blog-post.single, .bs-info-author-block, .py-4.px-3.mb-4.bs-card-box, .comments-area.bs-card-box.p-4, .bs-card-box.page-entry-title, .bs-card-box, .navbar-wp .dropdown-menu > li > a{
    box-shadow: none;
    backdrop-filter: blur(15px) saturate(1);
    -webkit-backdrop-filter: blur(25px) saturate(1);
    border: 1px solid rgba(255 255 255 / 40%);
}
.bs-blog-category a { 
    padding: 5px 10px;
    border-radius: 14px;
}
.list-blog .bs-blog-thumb {
    width: 35.333333%;
    max-width: 35.333333%;
    min-width: 35.333333%;
    height: 250px;
    min-height: 250px;
}
.bs-blog-thumb, .bs-sidebar .bs-widget, .wd-back, .bs-blog-post.three, .bs-slide, .page-entry-title, .bs-breadcrumb-section .overlay, .bs-blog-post.single, .bs-info-author-block, .py-4.px-3.mb-4.bs-card-box, .comments-area.bs-card-box.p-4, .bs-card-box.padding-20{
    border-radius: var(--raduis);
}
.bs .swiper-button-prev, .bs .swiper-button-next{
    opacity: 0;
}
.bs-widget.promo{
    border-radius: var(--raduis);
    overflow: hidden;
}
.bs-widget.promo h5 a, .bs-widget.promo .text{
    border-radius: var(--raduis);
}
/* COMMON styles for both */
.bs-widget.promo .text::before,
.bs-widget.promo .text::after {
    content: '';
    position: unset;
    /* width: 100%;
    height: 100%; */
    border:none;
    background-repeat: no-repeat;
}
/* TOP + RIGHT */
.bs-widget.promo:hover .text::before {  
    content: '';
    position: absolute;
    border:none;
    background-repeat: no-repeat;
    background-position: left top, right top, right bottom, left bottom;
    background-size: 0% 3px, 3px 0%, 0% 3px, 3px 0%;
    background-image: linear-gradient(to right, #f67b56, #5686FF),
                      linear-gradient(to bottom, #5686FF, #f67b56),
                      linear-gradient(to left, #f67b56, #5686FF),
                      linear-gradient(to top, #5686FF, #f67b56);
    transition: background-size 0.8s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.bs-widget.promo:hover .text::before {
    animation: drawBorder 0.8s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;
}
.bs-widget.promo .text::after {
    display: none;
}
/* keyframes */
@keyframes drawBorder {
    0%   { background-size: 0% 3px, 3px 0%, 0% 3px, 3px 0%; }
    25%  { background-size: 100% 3px, 3px 0%, 0% 3px, 3px 0%; }
    50%  { background-size: 100% 3px, 3px 100%, 0% 3px, 3px 0%; }
    75%  { background-size: 100% 3px, 3px 100%, 100% 3px, 3px 0%; }
    100% { background-size: 100% 3px, 3px 100%, 100% 3px, 3px 100%; }
}
/* ------------------
-----------new-tickers-------
---------------- */
.bs-latest-news {
    overflow: hidden;
    min-height: 50px;
    position: relative;
    border: 2px solid;
    margin-top: 30px;
    border-radius: var(--raduis);
}
.bs-latest-news .acmeticker-wrap{
    height: 100%;
}
.bs-latest-title {
    position: absolute;
    top: 50%;
    left: 0%;
    transform: translateY(-50%);
    height: 100%; 
    padding-right: 15px;
    z-index: 9;
    display: flex;
    align-items: center;
}
.bs-latest-news-slider {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100vw;
    height: auto;
}
.bs-latest-news-slider.stop-ticker{
    right: 0;
    left: 0;
}
.bs-latest-heading {
    font-size: 18px;
    margin-bottom: 0; 
    height: 100%; 
    padding: 10px 15px;
    z-index: 9;
    display: flex;
    align-items: center;
}
.bs-latest-heading i{
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 1px solid;
    font-size: 15px;
    line-height: 28px;
    text-align: center;
    position: relative;
}
.bs-latest-heading span{
    margin-left: 8px;
}
.bs-latest-heading i:after {
    content: '';
    display: block;
    width: 28px;
    height: 28px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border: 1px solid;
    border-radius: 50%;
    animation-name: rippal;
    animation-duration: 1s;
    animation-iteration-count: infinite;
}
@keyframes rippal {
	0%{
		width: 0;
		height: 0;
		opacity: 1;
	}
	100%{
		width: 28px;
		height: 28px;
		opacity: 1;
	}
}
.featured-widget-content .small-post .img-small-post {
  border-radius: 50%;
}
.bs-latest-list {
    margin: 0 10px; 
}
.bs-latest-news-inner {
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
}
.bs-latest-play {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bs-latest-play span{
    font-size: 16px; 
    line-height: 23px;
    padding: 10px 15px; 
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bs-latest-news .bs-latest-img {
    width: 40px;
    height: 40px;
    margin-right: 10px;
    border-radius:4px;
    object-fit: cover;
    border: 1px solid ;
}
/* Sidebar Title */
.bs-widget-title .title, .widget_block h2, .bs-widget .wp-block-search__label {
    padding-left: 10px;
}
.bs-widget-title .title:before, .widget_block h2:before, .wp-block-search__label:before {
    width: 3px;
    height: 16px;
    top: 0;
    left: 0;
}
.bs-widget-title .title:after, .widget_block h2:after, .wp-block-search__label:after {
    width: 16px;
    top: 0;
    left: 0;
    height: 3px;
    position: absolute;
    content: '';
}
.bs-blog-post .bs-blog-meta{
    margin-bottom: 0;
}
.bs-blog-post .small-bottom {
    margin-top: 10px;
    border-top: 1px dashed;
    padding-top: 10px;
}
.bs-social.info-left{
    justify-content: end;
}
.bs-social li a i{
    width: 30px;
}
.bs-widget ul li {
    padding: 10px 0;
    position: relative;
    transition: all 0.4s ease-in-out 0s;
}
footer .bs-widget ul li{
    border-width: 0 0 1px 0;
    border-style: solid;
}
.widget_block .bs-widget-title .title:before{
    width: 3px;
}
/* MainFeatured */
.mainfeatured {
    margin-top: 30px;
    margin-bottom: 50px;
}
.mainfeatured .bs-slide .inner .title {
    font-size: 40px;
}
.bs-slide .inner {
    width: 100%;
    height: auto;
}
@media screen and (max-width: 991px){
    .bs-headthree .navbar-brand .custom-logo {
        width: 200px;
        height: auto;
    }
}
@media screen and (max-width: 767px){
    .bs-latest-heading span{
        display:none;
    }
    .bs-headthree .navbar-brand .custom-logo {
        width: 120px;
        height: auto;
    }
    .site-branding-text .site-title a, .site-branding-text .site-title{
        font-size: 26px;
    }
}

.switch{
    display: none;
}

/*---------------------------------------
    Sticky Header
-----------------------------------------*/
/* Reserves the nav's space once it leaves the flow, so the page doesn't jump. */
.bs-menu-placeholder {
    display: none;
}

.bs-menu-full.bs-menu-sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 1030;
    /* --wrap-color is only defined under body.dark, so light mode takes the fallback */
    background: var(--wrap-color, #fff);
    box-shadow: 0 2px 12px rgba(0, 0, 0, .12);
    animation: bsStickyDown .35s ease;
}

.bs-menu-full.bs-menu-sticky .navbar {
    padding-top: 0;
    padding-bottom: 0;
}

/* Clear the WordPress admin bar when logged in. */
body.admin-bar .bs-menu-full.bs-menu-sticky {
    top: 32px;
}

@media screen and (max-width: 782px) {
    body.admin-bar .bs-menu-full.bs-menu-sticky {
        top: 46px;
    }
}

/* Under 600px the admin bar scrolls away instead of staying fixed. */
@media screen and (max-width: 600px) {
    body.admin-bar .bs-menu-full.bs-menu-sticky {
        top: 0;
    }
}

@keyframes bsStickyDown {
    from { transform: translateY(-100%); }
    to   { transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    .bs-menu-full.bs-menu-sticky {
        animation: none;
    }
}
/* ---------- Footer copyright bar ---------- */

.bs-footer-copyright .footer-heart {
    color: #e0245e;
    padding: 0 2px;
}

/* ---------- Footer "Useful Links" list ---------- */

/* The parent theme gives every .bs-widget list item 10px padding, a 10px
   margin and a full-width rule, which leaves a six-link list stretched and
   gappy. Reset that and rebuild it tighter, with hairline dividers. */
footer .bs-widget .footer-links {
    margin: 0;
    padding: 0;
    list-style: none;
}

footer .bs-widget .footer-links li {
    margin: 0;
    padding: 0;
    border: 0;
    overflow: visible;
}

footer .bs-widget .footer-links li + li {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

footer .bs-widget .footer-links a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 0;
    line-height: 1.45;
    color: inherit;
    text-decoration: none;
    transition: color 0.25s ease, transform 0.25s ease;
}

/* Chevron drawn from borders so it needs no icon font. */
footer .bs-widget .footer-links a::before {
    content: "";
    flex: 0 0 auto;
    width: 5px;
    height: 5px;
    border-top: 1.5px solid currentColor;
    border-right: 1.5px solid currentColor;
    transform: rotate(45deg);
    opacity: 0.45;
    transition: opacity 0.25s ease;
}

footer .bs-widget .footer-links a:hover,
footer .bs-widget .footer-links a:focus-visible {
    color: #f67b56;
    transform: translateX(4px);
}

footer .bs-widget .footer-links a:hover::before,
footer .bs-widget .footer-links a:focus-visible::before {
    opacity: 1;
}

footer .bs-widget .footer-links a:focus-visible {
    outline: 2px solid #f67b56;
    outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
    footer .bs-widget .footer-links a,
    footer .bs-widget .footer-links a::before {
        transition: none;
    }
    footer .bs-widget .footer-links a:hover,
    footer .bs-widget .footer-links a:focus-visible {
        transform: none;
    }
}

/* ---------- Comments ---------- */

/* The parent underlines every link inside `.page-class .bs-card-box`
   (blogus/style.css:3438), which catches the comment author, the timestamp,
   the Reply button and any link in the comment body. Drop it here; the
   `a:focus` outline the theme already sets keeps keyboard focus visible. */
.page-class .bs-card-box .comments-area a,
.page-class .bs-card-box .comments-area a:hover,
.page-class .bs-card-box .comments-area a:focus,
.page-class .bs-card-box .comment-reply-link,
.page-class .bs-card-box #cancel-comment-reply-link {
    text-decoration: none;
}

/* Colour instead of an underline as the hover affordance. */
.page-class .bs-card-box .comments-area a:hover,
.page-class .bs-card-box .comments-area a:focus {
    color: #f67b56;
}

/* ---------------------------------------------------------------------------
   Post thumbnails: size the box to the image instead of a fixed height.

   The .back-img boxes carried fixed pixel heights (lg 400px, md 220px, list
   250px), and background-size:cover had to zoom past the box to fill them,
   clipping the sides and enlarging the subject. Giving the box the image's own
   ratio shows the whole image with no clipping, and lets the height fall out of
   the column width instead of being frozen.

   Every featured image in this library is 1280x850 (3:2), so the box is 3/2 and
   functions.php redirects these thumbs from the 720x380 "blogus-medium" hard
   crop to the uncropped "blogus-featured" size. The two must stay in step: a box
   ratio that does not match the served image is exactly what causes cropping.

   Change --blogus-thumb-ratio alone to retune every thumbnail at once.
   --------------------------------------------------------------------------- */
:root {
	--blogus-thumb-ratio: 3 / 2; /* matches the 1280x850 originals, served uncropped */
}

.bs-blog-thumb.lg,
.bs-blog-thumb.md,
.list-blog .bs-blog-thumb,
.list-blog .bs-blog-thumb.md,
.featured-widget.wd-back .bs-blog-thumb.lg,
.featured-widget-content .bs-blog-thumb.lg,
.single-class .featured-widget-content .bs-blog-thumb.lg {
	height: auto;
	/* min-height on the list thumb would otherwise win over the ratio. */
	min-height: 0;
	aspect-ratio: var(--blogus-thumb-ratio);
}

/* The slider and video embeds sit inside the thumb box and had their own fixed
   heights, so they need to fill the ratio box rather than poke out of it. */
.list-blog .bs-blog-thumb .blog-slider,
.bs-blog-thumb .blog-slider {
	height: 100%;
}

.list-blog .responsive-video {
	min-height: 0;
}

@media (max-width: 767.98px) {
	/* Parent theme pins grid thumbs to 300px here; the ratio already gives a
	   shorter, proportional height at phone widths. */
	.bs-blog-post.grid .bs-blog-thumb.lg {
		height: auto;
		aspect-ratio: var(--blogus-thumb-ratio);
	}
}