/*
Theme Name: Blogging Hub Pro
Theme URI: https://www.apexthemes.net/products/blogging-wordpress-theme/
Author: Apexthemes
Author URI: https://www.apexthemes.net/
Description: Blogging WordPress Theme is designed to help creators build engaging and content-driven websites with ease. This versatile Blogging WordPress Theme offers clean layouts that highlight articles, stories, and multimedia posts without distractions. With flexible customization settings, users can adjust typography, colors, and page structures to match their unique style. The theme supports multiple blog formats including standard, gallery, video, and audio, making it suitable for diverse niches such as travel, lifestyle, technology, and personal journals. Built with performance in mind, it ensures fast loading speeds and smooth navigation across devices. SEO-friendly code structure helps improve search visibility while maintaining readability. Integrated widget areas and customizable sections allow easy placement of banners, categories, and featured posts. Compatibility with popular plugins enhances functionality without complexity. Whether you are a beginner or an experienced blogger, this Blogging WordPress Theme provides a balanced combination of simplicity, performance, and creative control to support consistent publishing and audience engagement over time. It also includes well-structured navigation menus, customizable headers, and footer layouts that improve usability. Detailed documentation helps users set up pages quickly while maintaining consistency across the site. Regular updates ensure compatibility with evolving web standards and plugins, making it a reliable choice for long-term.
Version: 0.0.1
Requires at least: 5.8.0
Tested up to: 6.0.3
Requires PHP: 7.2
License: GNU General Public License
License URI:license.txt
Text Domain: blogging-hub-pro
Tags: one-column, right-sidebar, custom-menu, editor-style, featured-images, full-width-template, sticky-post, theme-options, threaded-comments
Blogging Hub Pro WordPress Theme has been created by Apexthemes(apexthemes.com), 2026.
Blogging Hub Pro WordPress Theme is released under the terms of GNU GPL
*/

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');
:root {
 --orange: #5A41E2;
 --white: #fff;
 --black: #000000;
 --theme-font:"Outfit", sans-serif;
}
/* Basic Style */
 html body {
  margin: 0;
  padding: 0;
  -ms-word-wrap: break-word;
  word-wrap: break-word;
  background-color: white;
  position: relative;
  font-size: 14px;
  color: var(--white);
  font-family:  var(--theme-font);
  color: #000;
}
 label {
     margin-bottom: 0 !important;
}
 img {
     margin: 0;
     padding: 0;
     border: none;
     max-width: 100%;
     height: auto;
     width: auto;
}
 section img {
     max-width: 100%;
}
h2,h3, h5 , h6{
  font-family: var(--theme-font);
  margin: 0;
}
h1, h4{
    font-family: var(--theme-font);
    margin: 0;
}
 p {
     margin: 0 ;
     padding: 0;
     font-size: 15px;
     font-weight: normal;
     font-family: var(--theme-font);
}
ul li a {
     letter-spacing: 0px;
     font-family: var(--theme-font);
}
 body a {
     text-decoration: none;
     color: #277BF8;
}
section a:hover {
    text-decoration: none;
}
 a:focus, a:hover {
     text-decoration: none !important;
}
 ul, ol {
     margin: 0 0 0 0;
     padding: 0;
}

 input[type="text"], input[type="tel"], input[type="email"], input[type="phno"], input[type="password"], textarea ,  select{
  border: 1px solid #4e4e4e;
  font-size: 14px;
  padding: 10px 10px;
  margin: 0 0 0px 0;
  height: auto;
  width: 100%;
  background: transparent;
  color: #000;
  margin: 10px auto;
}

section{
  background-size: cover !important;
  background-repeat: no-repeat !important;
  padding:60px 0;
  background-attachment: scroll;
}
.footer-news-main{
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-attachment: scroll;
}
 .screen-reader-text {
     position: absolute;
     top: -9999em;
     left: -9999em;
}

.wpcf7-list-item-label{
      padding-left: 5px;
}
.body-line{
  height: 100%;
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  width: 1px;
  background: #252525;
}
/*------------------------- Headings --------------------------*/
section h1,h1{
  font-size: 34px;
  font-weight: 700;
  line-height: 60px;
}
 section h2,h2 {
  font-size: 28px;
  font-weight: 700;
  line-height: 32px;
}
 section h3 ,h3{
  font-size: 22px;
  font-weight: 400;
  line-height: 37.5px;
  margin-bottom: 0;
}
 section h4 ,section h4 a,h4{
  font-size: 19px;
  font-weight: 600;
  line-height: 27px;
  color: #000;
}
section h5,h5,h5 a{
    font-size: 17px;
  font-weight: 500;
  line-height: 25px;
}
section h6,h6{
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
}
p{
  font-size: 16px;
  font-weight: 300;
  line-height: 25px;
}


/*----------------- Section Title--------------*/
.main-heading{
    /* text-decoration: underline;
    text-decoration-skip-ink: auto;
    text-decoration-thickness: 5px;
    text-underline-offset: 6px;
    text-decoration-color: rgba(217, 81, 44, 0.5); */
    position: relative;
      display: inline-block;
}

.main-heading::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px; /* like underline offset */
  height: 5px;  /* underline thickness */
  width: 100%;
  background-color: rgba(90, 65, 226, 0.5);
  transform: scaleX(0);
  transform-origin: left center;
  animation: underline-loop 2s ease-in-out infinite;
}

@keyframes underline-loop {
  0% {
    transform: scaleX(0);
    transform-origin: left;
  }
  50% {
    transform: scaleX(1);
    transform-origin: left;
  }
  51% {
    transform: scaleX(1);
    transform-origin: right;
  }
  100% {
    transform: scaleX(0);
    transform-origin: right;
  }
}
/* ----------- Post Content ---------------*/

 .ta-fixed{
     background-attachment: fixed !important;
     background-size: cover ;
     background-repeat: no-repeat ;

}
 .ta-scroll{
     background-attachment: scroll !important;;
     background-size: cover ;
     background-repeat: no-repeat;
}
 .slider-bg-image.ta-fixed{
   position: fixed !important;
 }
/* ---------- Return to Top ------------ */
 #return-to-top {
  position: fixed;
  bottom: 10px;
  right: 20px;
  background: #292726;
  width: 60px;
  height: 60px;
  line-height: 50px;
  display: block;
  text-align: center;
  text-decoration: none;
  border: 10px solid rgb(243 243 243 / 20%);
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  z-index: 2;
  text-align: -webkit-match-parent;
  padding: 0;
  text-align: center;
}
 #return-to-top i {
     position: relative;
     font-size: 25px;
     -webkit-transition: all 0.3s ease;
     -moz-transition: all 0.3s ease;
     -ms-transition: all 0.3s ease;
     -o-transition: all 0.3s ease;
     transition: all 0.3s ease;
     color: #fff !important;
     font-weight: 800;
}
 #return-to-top:hover {
        background: var(--orange);
}


.sticky.stickynavbar {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999;
  background:var(--white);
  padding: 15px 0;
  box-shadow: 0px 0px 20px #0000002B;
}
.sticky.stickynavbar .header-inner{
  background: unset;
  box-shadow: unset;
}
.sticky.stickynavbar .top-bar-contact{
  display: none;
}
/* ----------- Spinner ------------- */
 .eco-box{
   position: fixed;
   height: 100%;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   cursor: pointer;
   z-index: 99999999;
   background-color:var( --black);
   width: 100%;
}
.loader-main{
  display: flex;
  justify-content: center;
  width: max-content;
  margin: auto;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: max-content;
}
.loader {
  width: 60px;
  aspect-ratio: 1;
  display: flex;
  animation: l12-0 4s infinite linear .5s;
}
.loader::before,
.loader::after {
  content: "";
  flex: 1;
  background: #fff;
  clip-path: polygon(100% 0,100% 100%,0 50%);
  animation: l12-1 1s infinite linear;
}
.loader::after {
  transform:scale(-1);
  animation:none;
}
@keyframes l12-0 {
  0%   ,12.49% {transform: rotate(0deg)}
  12.5%,37.49% {transform: rotate(90deg)}
  37.5%,62.49% {transform: rotate(180deg)}
  62.5%,87.49% {transform: rotate(270deg)}
  87.5%,100%   {transform: rotate(360deg)}
}
@keyframes l12-1 {
  0%,
  5%   {transform: translate(0px)   perspective(150px) rotateY(0deg) }
  33%  {transform: translate(-10px) perspective(150px) rotateX(0deg) }
  66%  {transform: translate(-10px) perspective(150px) rotateX(-180deg)}
  95%,
  100%{transform: translate(0px)   perspective(150px) rotateX(-180deg)}
}

 /* common css */
.main-head{
  font:  700 28px / 35px "Montserrat", serif;
  letter-spacing: 0px;
  color: #000000;
  margin-bottom: 0;
}
.sub-heading {
  font-family: var(--theme-font);
  font-size: 22px;
  font-weight: 700;
  line-height: 25.6px;
  letter-spacing: 0px;
  color: var(--white);
}
.main-para {
  font-family:var(--theme-font);
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #fff;
}
.theme-btn-wrap{
  position: relative;
}
.theme-btn{
  display: inline-block;
  padding: 9px 40px 9px 15px;
  font-family: var(--theme-font);
  font-size: 15px;
  font-weight: 500;
  line-height: 21px;
  letter-spacing: 0px;
  color: var(--black);
  position: relative;
  z-index: 1;
  cursor: pointer;
  text-align: center;
  word-break: break-all;
  border: 1px solid #000;
  border-radius: 6px
}
.theme-btn-wrap i{
  background: var(--black);
  border: 1px solid #000;
  color: #fff;
  height: 40px;
  width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin-left: -7px;
  transform: rotate(-45deg);
  font-size: 16px;
  position: absolute;
  right: -30px;
  top: 0;
   transition: transform 0.4s ease;
}
.theme-btn-wrap .theme-btn {
  transition: all 0.3s ease; 
}

.theme-btn-wrap:hover .theme-btn {
  background: #5A41E2; 
  color: #fff;       
  border-color: #5A41E2;
}
.theme-btn-wrap:hover i {
  transform: rotate(0deg); 
  background: var(--orange);
  border-color: var(--orange);
    border-radius: 0 50% 50% 0;
  top: -1px;
  height: 41px;
}

/* owl */
.owl-nav button{
  background: #000000;
  border: none;
  height: 40px;
  width: 40px;
  color: #fff;
  border-radius: 50%;
}
.owl-nav button:hover{
  background: var(--orange);
}
.contac_form h4{
  margin-bottom: 5%;
}
 #newsletter .theme-btn{
  border-color: #fff;
}
#newsletter .theme-btn-wrap i{
  border-color: var(--white);
  background: var(--white);
  color: var(--black);

}

.contac_form .theme-btn p input,#newsletter .theme-btn p input{
    background: transparent;
    border: none;
    font-family: var(--theme-font);
    font-size: 14px;
    font-weight: 500;
    line-height: 21px;
    color: #fff;
    padding: 0;
}
.contac_form .theme-btn{
  width: max-content;
      padding: 9px 25px 9px 15px;
}
.contac_form  .theme-btn:hover input,#newsletter .theme-btn:hover input{
color: var(--white);
}
.wpcf7-spinner{
  position: absolute;
}
.wpcf7-response-output{
  color: #000;
  margin: 1em 0.5em 1em !important;
}
#single-post .main-heading{
  color: #000;
}
a:hover{
  color:var(--orange)
}
/* ----------post box css ---------------*/
/* .banner-wrap-box .review-content-wrap{
  padding-right: 25px;
} */
.review-category{
  background: #5A41E2;
  width: max-content;
  padding: 4px 15px;
  border-radius: 4px;
  color: #fff;
  z-index: 1;
}
.review-category:hover{
  background: var(--black);
}
.review-content-wrap{
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
  gap: 15px;

}

.img-banner-wrap{
  height: 163px;
  position: relative;
}
.img-banner-wrap::before{
    content: "";
    width: 100%;
    height: 100%;
    background: #000;
    backdrop-filter: blur(5px);
    opacity: 0.4;
    border-radius: 10px;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 1;
    transform: scaleX(0);
    transition: all 0.6s ease 0s;
}
.img-banner-wrap::after{
    content: "";
    width: 100%;
    height: 100%;
    background: #000;
    backdrop-filter: blur(5px);
    opacity: 0.4;
    border-radius: 10px;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 1;
    transform: scaleX(0);
    transition: all 0.6s ease 0s;
}
.banner-box-row:hover .img-banner-wrap::before,.banner-box-row:hover .img-banner-wrap::after {
      transform: scaleX(1);
}
.img-banner-wrap img{
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 10px;
}
.review-header{
    display: flex;
    align-items: center;
    gap: 10px;
}
.food-lifestyle-row .img-banner-wrap{
    height: 175px;
}
/* -------------------Blog----------------------- */
.all-blog-img-wrap{
     height: 225px;
}
.all-blog-img-wrap img{
  height: 100%;
  width: 100%;
  border-radius: 10px 10px 0 0;
  object-fit: cover;
}
.content-post-wrap{
  background: #fff;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
  padding: 20px;
  border-radius: 0 0px 20px 20px;
}
.post-desc-wrap{
  font-size: 15px;
  line-height: 25px;
}
.post-author-image{
  height: 55px;
  width: 55px !important;
  border-radius: 50%;
}
.content-post-wrap h4 a{
  color: #000;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.content-post-wrap:hover h4 a{
  color: var(--orange);
}
.all-blog-img-wrap{
  position: relative;
  overflow: hidden;
}
.all-blog-img-wrap::before{
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    display: block;
    content: '';
    width: 0;
    height: 0;
    background: rgba(27, 27, 27, 0.25);
    border-radius: 100%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0;
}
.cat-btm-post-wrap:hover .all-blog-img-wrap::before  {
    -webkit-animation: circle .75s;
    animation: circle .75s;
}
@keyframes circle {
  0% {
    opacity: 1;
  }
  40% {
      opacity: 1;
  }
  100% {
    width: 200%;
    height: 200%;
    opacity: 0;
  }
}

.review-img-wrap{
  position: relative;
  overflow: hidden;
  transition: all 0.5s;
  border-radius: 10px 10px 0 0;
}
.review-img-wrap .tl{
  position: absolute;
  width: 146px;
  height: 100px;
  top: -80px;
  left: -240px;
  -webkit-transition: all .3s;
  transition: all .3s;
  opacity: 0.5;
  background-color: #000;
  border-radius: 10px;
}
.review-content-wrap:hover .tl {
  top  : 0;
  left : 0;
  -webkit-transition: all .3s;
  transition   : all .3s;
  transform: rotate(180deg);
}
.review-img-wrap .tr{
  position: absolute;
  width: 146px;
  height: 100px;
  top: -80px;
  right: -240px;
  -webkit-transition: all .3s;
  transition: all .3s;
  opacity: 0.5;
  background-color: #000;
  border-radius: 10px;
}
.review-content-wrap:hover .tr{
  top: 0;
  right: 0;
  -webkit-transition: all .3s;
  transition: all .3s;
  transform: rotate(180deg);
}
.review-img-wrap .bl{
  position: absolute;
  width: 146px;
  height: 100px;
  left: -240px;
  -webkit-transition: all .3s;
  transition: all .3s;
  opacity: 0.5;
  background-color: #000;
  border-radius: 10px;
}
.review-content-wrap:hover .bl{
  bottom: 0;
  left: 0;
  -webkit-transition: all .3s;
  transition: all .3s;
  transform: rotate(180deg);
}
.review-img-wrap .br{
  position: absolute;
  width: 146px;
  height: 100px;
  top: unset;
  right: -240px;
  -webkit-transition: all .3s;
  transition: all .3s;
  opacity: 0.5;
  background-color: #000;
  border-radius: 10px;
}
.review-content-wrap:hover .br{
  position: absolute;
  bottom: 0;
  right: 0;
  -webkit-transition: all .3s;
  transition: all .3s;
  transform: rotate(180deg);
}
.review-content-wrap:hover img {
    transform: scale(1.1) rotateZ(3deg);
}

/* review bpx */
.review-rating i{
 color: #FFA600;
       font-size: 14px;
}
.img-girl-wrap .banner-review-rating i{
  color: #000;
}
.img-girl-wrap .banner-review-rating i.rating-clr{
 color: #FFA600;
}
.review-pop-content-wrap .review-category{
    position: absolute;
    top: 15px;
    left: 15px;
}
.review-pop-content-wrap .review-category:hover{
    background: var(--black);
}
.review-pop-content-wrap .review-img-wrap{
        height: 206px;
}
.review-pop-content-wrap .review-img-wrap img{
    height: 100%;
    width: 100%;
    border-radius: 10px 10px 0 0;
    object-fit: cover;
        transition: 0.7s linear;
}
.review-post-name a{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.review-video-btn{
  position: absolute;
  inset: 0;
  width: min-content;
  height: min-content;
  display: flex;
  justify-content: center;
  text-align: center;
  align-items: center;
  margin: auto;
  height: 65px;
  width: 65px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.7);
  z-index: 2;
}
.review-video-btn i{
  font-size: 24px;
}

.review-video-btn::after{
  content: '';
  display: block;
  position: absolute;
  top: 0; 
  right: 0; 
  bottom: 0; 
  left: 0;
  border: 1px solid #070707;
  border-radius: 50%;
}
.review-video-btn::before {
  animation: ripple 2s linear infinite;
}

.review-video-btn::after{
  animation: ripple 2s linear 1s infinite;
}
@keyframes ripple{
  0% { transform: scale(1); }
  50% { transform: scale(1.3); opacity:1; }
  100% { transform: scale(1.6); opacity:0; }
}
.modal-new {
  display: none; 
  position: fixed;
  z-index: 999999999999;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.9);
}
.modal-contents {
  background-color: #1C1C1C;
    margin: auto;
    padding: 10px;
    transition: 2s;
    border-radius: 10px;
}
.close-one,.close {
    color: #fff;
    float: right;
    font-size: 25px;
    font-weight: bold;
    padding: 0px 10px;
    cursor: pointer;
    margin-bottom: 7px;
    background: #000;
    border: unset;
    height: 38px;
    width: 38px;
    position: absolute;
    right: -40px;
    top: -30px;
    margin: 15px 3% 0px 0px;
    border-radius: 10px;
    border: 1px solid #fff;
    display: flex;
    z-index: 99;
    align-items: center;
    justify-content: center
}

/* rating code */
.dashicons-star-filled:before{
  color: #FFA600;
}

.comments-rating {
	border: none;
	padding: 0;
	margin-left: 0;
}

.comments-rating label {
	display: inline-block;
}

.rating-container {
	font-size: 0;
	display: flex;
	justify-content: flex-end;
	flex-direction: row-reverse;
}

.rating-container * {
	font-size: 1.4rem;
}

.rating-container > input {
	display: none;
}

.rating-container > input + label {
	/* only enough room for the star */
	font-family: 'dashicons';
	display: inline-block;
	overflow: hidden;
	text-indent: 9999px;
	width: 1em;
	white-space: nowrap;
	cursor: pointer;
	margin: 0;
}

.rating-container > input + label:before {
	display: inline-block;
	text-indent: -9999px;
	content: "\f154";
	color: #888;
}

.rating-container > input:checked ~ label:before,
.rating-container > input + label:hover ~ label:before,
.rating-container > input + label:hover:before {
	content: "\f155";
	color: #FFA600;
	text-shadow: 0 0 1px #333;
}

.rating-container > .star-cb-clear + label {
	text-indent: -9999px;
	width: .5em;
	margin-left: -.5em;
}

.rating-container > .star-cb-clear + label:before {
	width: .5em;
}

.rating-container:hover > input + label:before {
	content: "\f154";
	color: #888;
	text-shadow: none;
}

.rating-container:hover > input + label:hover ~ label:before,
.rating-container:hover > input + label:hover:before {
	content: "\f155";
	color: #e52;
	text-shadow: 0 0 1px #333;
}
.comment-respond .rating-container > .star-cb-clear + label, .comment-respond .rating-container > input + label:before {
	text-indent: 9999px;
}

.comment-respond .rating-container > input + label {
	text-indent: -9999px;
}


.step-loading .spinner img {
    position: relative;
    top: -104px;
    display: none !important;
}