:root {
    --primary-color: linear-gradient(to right, #ff692e, #f716a4);
    --dark: #0f0f35;
    --white: #ffffff;
    --black: #000000;
}
.screen-reader-text{}
body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "Poppins";
}

::selection {
    background: var(--primary-color);
    color: var(--white);
}

a {
    color: var(--primary-color);
    text-decoration: underline;
}

a:hover,
a:focus-within {
    color: var(--primary-color);
    text-decoration: dotted underline;
}


/* header css */
.topbar{
    background-color: var(--dark);
    padding: 10px 0;
}
.widget-header .widget-contact{
    display: inline-block;
    margin-right: 15px;
}
.widget-header .contact-info {
    display: flex;
    align-items: center;
}
.widget-header .contact-icon{
    color: var(--white);
    margin-right: 10px;
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.contact-info a{
    text-decoration: none;
    color: var(--white);
}
.widget-social ul {
    padding: 0;
    margin: 0;
    list-style: none;
}
.widget-header .widget-social ul {
    text-align: right;
}
.widget-header .widget-social ul li{
    display: inline-block;
    margin-left: 10px;
}
.widget-header .widget-social ul li a{
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-decoration: none;
    color: var(--white);
    border-radius: 35px;
    display: inline-block;
    text-align: center;
}

.menu-bar{
    background: var(--white);
    padding: 15px 0;
}
.menubar-inner {
    display: flex;
}
.menubar-inner .logo{
    flex: 1;
	    margin-top: 15px;
}
.menubar_bg{
    background-color: #eee;
    display: flex;
    border-radius: 5px;
}
.header-main .navbar .navbar-nav .nav-item .nav-link{
    color: var(--dark);
    font-weight: 400;
    margin-right: 15px;
    text-decoration: none;
}
.header-main .navbar .navbar-nav .nav-item:first-child .nav-link{
    margin-left: 15px;
}
.header-main .navbar .navbar-nav .nav-item .dropdown-item{
    text-decoration: none;
}
.menubar_bg a i.fa.fa-search {
    border: 1px solid var(--bs-code-color);
    border-radius: 50px;
    padding: 10px;
    color: var(--bs-code-color);
}
.menu-bar .right-menu ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    height: 100%;
    align-items: center;
	background-color: #f8f9fa;
}
.header-search form.search-form {
    width: 100%;
}
.header-search form.search-form>div {
    position: relative;
}
.header-search {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 600px;
    width: 100%;
    margin: 0 auto;
}
.header-search form.search-form>div .form-control {
    padding: 15px;
    box-shadow: none;
    color: var(--dark);
}
.bypostauthor{}
.header-search form.search-form>div .submit-search{
    padding: 15px 30px;
    background: var(--primary-color);
    border-radius: 5px;
    border: none;
    color: var(--white);
    position: absolute;
    bottom: 0;
    right: 0;
    top: 0;
}
.header-main .right-menu .modal-header{
	margin-top:30px;
}
.menu-bar .right-menu ul li .btn_main {
    text-decoration: none;
    background: var(--primary-color);
    color: var(--white);
    padding: 16.5px;
    border-radius: 0 5px 5px 0;
    margin-right: 0;
}
nav.navbar .btn-bars {
    background: none;
    border: none;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    border-radius: 35px;
    border: 1px solid var(--primary-color);
    color: var(--primary-color);
}
.right-menu .cart_icon span {
    width: 15px;
    height: 15px;
    display: inline-block;
    background: var(--white);
    line-height: 15px;
    border-radius: 15px;
    font-size: 10px;
    position: absolute;
}
.menu-bar .right-menu ul li .cart_icon, .menu-bar .right-menu ul li .search_icon {
    width: 35px;
    height: 35px;
    border-radius: 35px;
    display: inline-block;
    line-height: 35px;
    border: 1px solid;
    text-align: center;
}
.menu-bar .right-menu ul li{
    margin-left: 15px;
}
.navbar .navbar-nav .dropdown-menu{
    border-radius: 0;
    border: none;
    padding: 0;
}
.dropdown-menu > li{
    position: relative;
}
.navbar .navbar-nav li .dropdown-menu li .dropdown-menu,
.navbar .navbar-nav li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu{
    left: 100%;
    top: 0;
}
.navbar .navbar-nav li .dropdown-menu li .dropdown-menu li .dropdown-menu,
.navbar .navbar-nav li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu,
.navbar .navbar-nav li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu{
    top: 100%;
    left: 0%;
}
.navbar .navbar-nav li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu,
.navbar .navbar-nav li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu{
    left: -100%;
    top: 0%;
}
.navbar .navbar-nav li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu li .dropdown-menu{
    top: 0%;
    left: -100%;
}
/* header cart */
.shopping-cart a.main-btn i{
    margin-left: 10px;
}

.cart_dropdown .dropdown-menu{
    padding: 0;
    border-radius: 0;
    width: 320px;
    padding: 20px;
    background-color: var(--white);
    border: none;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
}

.cart_dropdown > a span.cart-badge{
    display: inline-block;
    width: 15px;
    height: 15px;
    background: var(--primary-color);
    line-height: 16px;
    font-size: 12px;
    border-radius: 15px;
    vertical-align: super;
    margin: 0 0 0 -3px;
    color: var(--white-fix);
}
.shopping-cart .cart-header>i {
    font-size: 16px
}
.shopping-cart a.cart-btn {
    display: block;
    text-align: center;
    text-decoration: none;
    color: var(--white);
    background: var(--primary-color);
    padding: 10px;
    border-radius: 5px;
}

.shopping-cart .cart-header {
    display: flex;
    border-bottom: 1px solid rgba(120 120 120 / 20%);
    padding-bottom: 15px;
    line-height: 1;
    justify-content: space-between
}

.shopping-cart .main-button {
    text-decoration: none;
    border: 1px solid rgba(255 255 255 / 20%);
    color: var(--text-white);
    font-weight: 500;
    display: block;
    font-size: 18px;
    background: var(--dark-3);
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px
}

.shopping-cart .cart-header .cart-total {
    font-size: 16px
}

div.shopping-cart ul.cart-items {
    padding: 0;
    margin: 20px 0 20px;
    list-style: none;
    max-height: 200px;
    overflow-x: hidden;
    overflow-y: auto;
    display: block;
}

div.shopping-cart ul.cart-items li {
    display: inline-block;
    width: 100%;
    margin: 0 10px 10px 0;
    padding: 0;
    font-size: 15px;
    position: relative;
    border: 1px solid rgba(120 120 120 / 20%);
    border-radius: 5px;
}

div.shopping-cart ul.cart-items li a:focus-within,div.shopping-cart ul.cart-items li a:hover {
    color: var(--primary-color);
}

div.shopping-cart ul a.remove {
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translate(0px, -50%);
    width: 15px;
    height: 15px;
    line-height: 13px;
    text-align: center;
    border-radius: 4px;
    background-color: var(--dark);
    color: var(--white);
    text-decoration: none;
    transition: 0.65s;
    opacity: 0;
}
div.shopping-cart ul.cart-items li a.remove:hover,
div.shopping-cart ul.cart-items li a.remove:focus{
    text-decoration: none;
    color: var(--white-fix);
    background-color: var(--primary-color);
}


.shopping-cart .cart-items .item-img {
    float: left;
    margin-right: 12px;
    width: 70px;
    height: 70px;
    border-radius: 5px;
    text-align: center;
    line-height: 4.1;
}

.shopping-cart .cart-items .item-img img {
    width: 90%;
    display: inline-block;
    float: none;
    height: auto;
    margin: auto
}

.shopping-cart .cart-items .item-name {
    font-size: 16px;
    font-weight: 600;
    display: block;
    padding-top: 15px;
    line-height: 1;
    text-align: left;
    color: var(--dark);
}

.shopping-cart .cart-items .item-name:focus-within,.shopping-cart .cart-items .item-name:hover {
    color: var(--primary-color)
}

.shopping-cart .cart-badge {
    color: var(--white-fix);
    font-size: 10px;
    margin: 0 0 0 -10px;
    width: 16px;
    height: 16px;
    line-height: 1.6;
    text-align: center;
    vertical-align: super;
    border-radius: 100px;
    display: inline-block;
    background-color: var(--primary-color)
}

.shopping-cart .cart-items .quantity {
    font-size: 12px;
    font-weight: 500;
    color: var(--dark);
    line-height: 3;
    float: left;
    transition: 0.65s;
}

.shopping-cart .cart-items .quantity span bdi {
    color: var(--dark);
    font-weight: 400
}

.shopping-cart .cart-items .amount {
    font-size: 12px;
    font-weight: 600;
    margin-right: 0;
    color: #222
}

div.shopping-cart ul.cart-items li:hover a.remove,
div.shopping-cart ul.cart-items li:focus a.remove{
    opacity: 1;
    z-index: 0;
}


/* slider css  */
.slider-section .slide-item{
    position: relative;
} 
.slider-section .slide-item::before{
    content: '';
    position: absolute;
    inset: 0;
    background-color: var(--black);
    opacity: 0.4;
}
.slide-item > img{
    width: 100%;
    height: 750px;
    object-fit: cover;
}
.slider-content {
    position: absolute;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    top: 0;
    left: 0;
}
span.slide-subtitle {
    color: var(--white);
    font-size: 22px;
    position: relative;
    margin-bottom: 15px;
    display: block;
}
span.slide-subtitle::before{
    content: '';
    width: 100px;
    height: 3px;
    background: var(--primary-color);
    display: inline-block;
    vertical-align: super;
    margin-right: 10px;
}
.slide-title {
    color: var(--white);
    font-size: 45px;
    font-weight: 400;
    margin-bottom: 20px;
}
.slide-title span{
    display: inline-block;
    background: var(--primary-color);
    color: var(--white);
    padding: 2px 10px;
    border-radius: 5px;
}
.slide-discription{
    color: var(--white);
    margin-bottom: 25px;
}
.main-content {
    width: 55%;
}
a.btn_main {
    text-decoration: none;
    background: var(--primary-color);
    color: var(--white);
    padding: 10px;
    border-radius: 5px;
    display: inline-block;
    margin-right: 10px;
    transition: 0.65s;
}
.btn_main:hover,.btn_main:focus-within {
    background-position: left left;
}
.slider-section .owl-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 115px;
    display: flex;
    flex-direction: column;
}

.slider-section .slide-carousel .owl-nav button {
    width: 40px;
    height: 40px;
    border-radius: 40px;
    line-height: 40px;
    background-color: rgba(255 255 255 / 40%);
    color: var(--white);
    transition: 0.5s;
}
.slider-section .slide-carousel .owl-nav button.owl-prev, .slider-section .slide-carousel .owl-nav button.owl-next {
    margin-bottom: 25px;
    background: var(--primary-color);
    color: var(--white);
}
.slider-section .slide-carousel .owl-nav button:hover,
.slider-section .slide-carousel .owl-nav button:focus-within{
    background: var(--white);
    color: var(--dark);
}
a.play-btn {
    width: 50px;
    height: 50px;
    border-radius: 50px;
    display: inline-block;
    text-align: center;
    background: var(--white);
    line-height: 50px;
    color: var(--dark);
    position: relative;
    transition: 0.65s;
}
a.play-btn::before{
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 100%;
    animation: wave 1.5s linear infinite;
}
a.play-btn:hover,a.play-btn:focus-within{
    background: var(--primary-color);
    color: var(--white);
}
@keyframes wave{
    from{
        box-shadow: 0 0 0 0px rgba(255 255 255 / 50%);
    }
    to{
        box-shadow: 0 0 0 10px rgba(255 255 255 / 50%);
        opacity: 0;
    }
}





/* about */
.about-section{
    padding: 100px 0 75px;
    background-color: var(--white);
}
.about-image {
    position: relative;
    text-align: center;
}
.about-image::before{
    position: absolute;
    content: '';
    width: 400px;
    height: 100%;
    top: -30px;
    left: 0;
    background: var(--primary-color);
    clip-path: polygon(0 0, 100% 0, 100% 75%, 0 100%);
}
.about-image img{
    max-width: 100%;
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 75%);
}
.about-content span{
    background: var(--primary-color);
    font-size: 18px;
    font-weight: 500;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
    margin-bottom: 10px;
}
.about-content > h2{
    font-size: 26px;
    font-weight: 600;
    color: var(--dark);
}
ul.about-feature {
    padding: 0;
    margin: 0 0 25px;
    list-style: none;
    display: flex;
    border-bottom: 1px solid var(--dark);
}
ul.about-feature li{
    flex: 1;
    display: flex;
}
ul.about-feature li h2{
    font-size: 18px;
    font-weight: 600;
    color: var(--dark);
}
ul.about-feature li .feature-icon{
    font-size: 50px;
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-right: 10px;
}
.about-video {
    width: 50px;
    height: 50px;
    border-radius: 50px;
    display: inline-block;
    text-align: center;
    background: var(--primary-color);
    line-height: 50px;
    color: var(--white);
    position: relative;
    transition: 0.65s;
}
.about-video a{color: var(--white);}
.about-video::before{
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 100%;
    animation: wave 1.5s linear infinite;
}
.about-video:hover,.about-video:focus-within{
    background: var(--primary-color);
    color: var(--white);
}




/* feature section */
.feature-section{
    padding: 80px 0;
    position: relative;
    height: 350px;
    z-index: 1;
    margin-bottom: 60px;
}


.feature-section::before{
    position: absolute;
    inset: 0;
    background: var(--black);
    opacity: 0.5;
    content: '';
    z-index: -1;
}

.section-title {
    text-align: center;
    margin-bottom: 40px;
}

.section-title span{
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 18px;
}
.section-title h2{
    color: var(--dark);
}
.feature-section .section-title h2{
    color: var(--white);
}
.feature-item {
    background: #eee;
    padding: 25px 25px 35px;
    text-align: center;
    border-radius: 5px;
    position: relative;
}
.feature-item .feature-icon {
    width: 80px;
    height: 80px;
    text-align: center;
    line-height: 80px;
    margin: 0 auto 15px;
    background: var(--white);
    border-radius: 100px;
    font-size: 33px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    position: relative;
}
.feature-item .feature-icon i{
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.feature-item .feature-icon::before{
    content: '';
    position: absolute;
    inset: -3px;
    border-radius: 100px;
    border: 2px dotted;
}
.feature-content h2{
    font-size: 18px;
    font-weight: 600;
}
.feature-content a {
    width: 35px;
    height: 35px;
    display: inline-block;
    text-align: center;
    line-height: 35px;
    background: var(--primary-color);
    color: var(--white);
    border-radius: 35px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}
.feature-item_inner {
    position: relative;
    bottom: -40px;
}


/* servie=ce section */
.service-section{
    padding: 100px 0 75px;
    background: var(--white);
}
.service{
    padding: 10px;
    position: relative;
    border-radius: 5px;
    border: 1px solid rgba(120 120 120 / 20%);
    margin-bottom: 25px;
}
.service-img {
    position: relative;
}
.service-img::before {
    position: absolute;
    inset: 0;
    border-radius: 5px;
    background: var(--black);
    opacity: 0;
    content: '';
    transition: 0.65s;
    border-bottom: 5px solid;
    border-image: var(--primary-color);
}
.service:hover .service-img::before{
    opacity: 0.5;
}
.service-img img{
    border-radius: 5px;
    width: 100%;
}
.service-content{
    text-align: center;
    position: relative;
    padding: 40px 25px 25px;
}
.service-content h2{
    font-size: 18px;
    font-weight: 600;
    color: var(--dark);
    margin: 0;
}
.service-icon{
    width: 50px;
    height: 50px;
    border-radius: 40px;
    text-align: center;
    line-height: 40px;
    display: inline-block;
    background: var(--white);
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    border: 5px solid var(--white);
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -25px;
    transition: 0.65s;
}
.service:hover .service-icon{
    background: var(--primary-color);
    color: var(--white);
}




/* port folio */
.portfolio-section{
    background-color: #eee;
    padding: 100px 0 75px;
    position: relative;
}
figure.portfolio-image img {
    width: 100%;
    border-radius: 5px;
}
figure.portfolio-image{
    margin: 0;
    position: relative;
}
figure.portfolio-image::before{
    position: absolute;
    content: '';
    inset: 0;
    background: var(--black);
    opacity: 0;
    transition: 0.65s;
}
.portfolio-item:hover figure.portfolio-image::before,
.portfolio-item:focus-within figure.portfolio-image::before{
    opacity: 0.5;
}
.portfolio-content {
    padding: 25px 25px 45px;
    background: var(--white);
    position: relative;
}
.portfolio-item{
    text-align: center;
    margin-bottom: 25px;
}
.portfolio-content h2 {
    font-size: 22px;
    font-weight: 600;
    color: var(--dark);
}
.portfolio-content span {
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.portfolio-content a {
    display: inline-block;
    width: 40px;
    height: 40px;
    border-radius: 40px;
    line-height: 40px;
    text-align: center;
    background: var(--primary-color);
    color: var(--white);
    position: absolute;
    transform: translateX(-50%) translateY(100%);
    left: 50%;
    transition: 0.65s;
    bottom: 20px;
}





/* pricing section */
.pricing-section{
    background: var(--white);
    padding: 100px 0 75px;
}
.pricing-section .section-title{
    text-align: left;
}
.price-icon {
    min-width: 50px;
    height: 50px;
    line-height: 50px;
    border-radius: 50px;
    background: var(--primary-color);
    text-align: center;
    color: var(--white);
    margin-right: 15px;
}
.pricing-content > ul{
    padding: 0;
    margin: 0;
    list-style: none;
}
.pricing-content > ul > li{
    display: flex;
}
.pricing-content > ul > li h2{
    font-size: 18px;
    color: var(--dark);
    font-weight: 600;
}
.price-heading {
    text-align: center;
    background: var(--primary-color);
    color: var(--white);
    padding: 10px;
    border-radius: 5px;
}
.price-heading h2{
    font-size: 22px;
}
.price-heading h2{
    margin: 0;
}
.price-item {
    background: var(--dark);
    border-radius: 5px;
    position: relative;
    margin-bottom: 25px;
}
.main-price {
    text-align: center;
    color: var(--white);
    font-size: 36px;
    font-weight: 400;
    padding: 30px 0;
    position: relative;
    overflow: hidden;
    z-index: 1;
    
}
.main-price::before {
    position: absolute;
    content: '';
    width: 300px;
    height: 300px;
    background: var(--white);
    left: 50%;
    border-radius: 0 0 40px 0;
    transform: translateX(-50%) rotate(45deg);
    bottom: 46px;
    z-index: -1;
}
.main-price > span{
    position: relative;
    z-index: 1;
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    transform: translateY(-20px);
    display: inline-block;
}
.main-price > .period{
    font-size: 16px;
}
ul.pricing-feature {
    padding: 25px;
    margin: 0;
    list-style: none;
    text-align: left;
}
ul.pricing-feature li {
    color: var(--white);
    margin-bottom: 10px;
}
ul.pricing-feature li:last-child{
    margin-bottom: 0;
}
a.price-button {
    display: block;
    background: var(--primary-color);
    padding: 15px;
    text-align: center;
    text-decoration: none;
    color: var(--white);
    font-weight: 500;
    border-radius: 5px;
}
.tab-filter {
    text-align: center;
    margin-bottom: 40px;
    background: var(--dark);
    display: inline-block;
    border-radius: 5px;
}
.tab-filter a {
    text-decoration: none;
    padding: 10px;
    color: var(--white);
    border-radius: 5px;
    display: inline-block;
}
.tab-filter a.active{
    background: var(--primary-color);
}
.filter-wrapper {
    text-align: center;
}




/* .funfact section */
.funfact-section{
    padding: 100px 0 75px;
    position: relative;
    z-index: 1;
}
.funfact-section::before{
    position: absolute;
    content: '';
    inset: 0;
    background: var(--black);
    z-index: -1;
}

.funfact-item {
    border: 1px solid var(--white);
    border-radius: 5px;
    display: flex;
    padding: 25px;
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
    align-items: center;
    position: relative;
    margin-bottom: 25px;
}
.funfact-item::before{
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 5px;
    background: var(--white);
    opacity: 0.1;
    transform: scale(0);
    transition: all 0.65s;
}
.funfact-item:hover:before{
    visibility: visible;
    transform: scale(1);
}
.funfact-item > span{
    width: 100%;
    margin-bottom: 15px;
    display: block;
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.funfact-icon {
    width: 50px;
    height: 50px;
    line-height: 50px;
    border-radius: 50px;
    background: var(--primary-color);
    color: var(--white);
    margin-right: 10px;
    position: relative;
}

.funfact-icon::before{
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 100%;
    animation: wave 1.5s linear infinite;
}
.funfact-item h2{
    margin: 0;
    color: var(--white);
    font-size: 40px;
}



/* team */
.team-section{
    padding: 100px 0 75px;
    background: var(--white);
    position: relative;
}
.team{
    position: relative;
    z-index: 1;
    margin-bottom: 25px;
}
.team::before{
    position: absolute;
    inset: 0;
    background: var(--primary-color);
    content: '';
    z-index: 1;
    opacity: 0.5;
    transform: scale(0);
    border-radius: 100%;
    visibility: hidden;
}
.team:hover::before,.team:focus-within::before{
    transition: 0.65s;
    transform: scale(1);
    border-radius: 0;
    visibility: visible;
}
.team-image img{
    width: 100%;
}
.team-image {
    position: relative;
    overflow: hidden;
}
.team-content {
    position: absolute;
    bottom: 0;
    background: var(--dark);
    width: 100%;
    left: 0;
    text-align: center;
    padding: 25px;
    z-index: 1;
    transform: translateY(50px);
    transition: 0.65s;

}
.team:hover .team-content  ,.team:focus-within .team-content {
    transform: translateY(0px);
}
.team-content h2{
    font-size: 18px;
    color: var(--white);
    margin: 0;
}
.team-content span{
    color: var(--white);
    margin: 0;
    font-weight: 300;
}
..widget-header .contact-icon.widget-social ul li a {
    width: 35px;
    height: 35px;
    line-height: 35px;
    border: 1px solid;
    text-decoration: none;
    color: var(--white);
    border-radius: 35px;
    display: inline-block;
    text-align: center;
    margin: 0 3px;
}
.widget-header .contact-icon.widget-social ul li a:hover i, .widget-header .contact-icon.widget-social ul li a:focus i {
    -webkit-animation: jello-horizontal 0.9s both;
    animation: jello-horizontal 0.9s both;
}
.widget-header .contact-icon.widget-social ul li a:hover i {
    color: var(--primary-color);
}
.widget-header .contact-icon.contact-info .contact-icon ul li a i {
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.widget-header .contact-icon.widget-social ul li a:hover:after {
    height: 0px;
    top: 100%;
    border-color: var(--primary-color);
}

.team-content .widget-social ul {
    display: flex;
    justify-content: center;
    margin-top: 15px;
    visibility: hidden;
}
.team:hover .widget-social ul ,.team:focus-within .widget-social ul{
    visibility: visible;
}



/* sponsor sectopn */


  section.sponsor-section {
    position: relative;
    overflow: hidden;
    padding: 100px 0;
    z-index: 1;
}

section.sponsor-section::before {
    position: absolute;
    inset: 0;
    background: var(--black);
    opacity: 0.5;
    content: '';  
    z-index: -1;
}
.sponsor-section .section-title{
    text-align: left;
}
.sponsor-section .section-title h2{
    color: var(--white);
}
.sponsor-content > h2{
    font-size: 80px;
    font-weight: 800;
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 4px var(--white);
    text-stroke: 4px var(--white);
}
.sponsor-content > span{
    font-size: 22px;
    font-weight: 400;
    color: var(--white);
}
.circle-section {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 400px;
  }
  
  .circle-container {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }
  
  .circle {
    position: absolute;
    border: 1px solid var(--white);
    padding: 50px;
    border-radius: 50%;
    transition: all 1s ease;
  }
  .circle:before {
    content: "";
    position: absolute;
    height: 10px;
    width: 10px;
    border-radius: 50%;
    background-color: var(--primary-color);
    left: -5px;
    top: 50%;
  }
  .circle--1 {
    -webkit-animation: rotateanimreverse 20s linear 2s infinite;
            animation: rotateanimreverse 20s linear 2s infinite;
  }
  .circle--2 {
    padding: 100px;
    -webkit-animation: rotateanim 20s linear 2s infinite;
            animation: rotateanim 20s linear 2s infinite;
  }
  .circle--3 {
    padding: 150px;
    -webkit-animation: rotateanimreverse 20s linear 2s infinite;
            animation: rotateanimreverse 20s linear 2s infinite;
  }
  .circle--4 {
    padding: 200px;
    -webkit-animation: rotateanim 20s linear 2s infinite;
            animation: rotateanim 20s linear 2s infinite;
  }
  
  @-webkit-keyframes rotateanim {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }
  
  @keyframes rotateanim {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(360deg);
    }
  }
  @-webkit-keyframes rotateanimreverse {
    from {
      transform: rotate(180deg);
    }
    to {
      transform: rotate(0deg);
    }
  }
  @keyframes rotateanimreverse {
    from {
      transform: rotate(360deg);
    }
    to {
      transform: rotate(0deg);
    }
  }




  /* blog section */
  .blog-section{
    padding: 100px 0 75px;
    background: var(--white);
  }
  .blog-section figure.post-image{
    position: relative;
  }
  .blog-section figure.post-image::before{
    content: '';
    position: absolute;
    width: 100%;
    right: 100%;
    top: 0;
    height: 100%;
    visibility: hidden;
    background: var(--dark);
    transition: 0.65s;
    z-index: 1;
    opacity: 0.5;
    border-radius: 5px;
  }
  .blog-section .post-item:hover figure.post-image::before,
  .blog-section .post-item:focus-within figure.post-image::before{
    right: 0%;
    visibility: visible;
  }
  .blog-section figure.post-image img {
    width: 100%;
    border-radius: 5px;
    transition: 0.65s;
}
.blog-section .post-item {
    padding: 10px;
    border-radius: 5px;
    border: 1px solid rgba(120 120 120 / 20%);
    position: relative;
    margin-bottom: 25px;
    overflow: hidden;
}

.post-content .post-title a,.post-content .post-title {
    text-decoration: none;
    font-size: 22px;
    font-weight: 600;
    color: var(--dark);
    display: inline-block;
}
.post-content a.more-link {
    display: block;
    text-decoration: none;
    background: var(--dark);
    padding: 10px;
    border-radius: 5px;
    color: var(--white);
    transition: 0.5s;
}
.post-content a.more-link:hover,
.post-content a.more-link:focus-within{
    background: var(--primary-color);
}
.post-content a.more-link::after{
    content: '\f101';
    font-family: fontawesome;
    color: var(--white);
    float: right;
}
.post-content .meta span a i {
    margin-right: 5px;
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.post-content .meta span a{
    text-decoration: none;
    color: var(--dark);
    margin-right: 10px;
}
.meta.top .date a {
    display: inline-block;
    text-decoration: none;
    background: var(--primary-color);
    color: var(--white);
    width: 60px;
    height: 60px;
    text-align: center;
    line-height: 1.4;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: absolute;
    top: -10px;
    right: 25px;
    border-radius: 0 0 5px 5px;
    font-weight: 600;
    z-index: 1;
}
.meta.top .date a span{
    display: block;
}
.meta.top .date a::before,
.meta.top .date a::after{
    content: '';
    position: absolute;
    width: 10px;
    height: 10px;
    background: var(--primary-color);
    top: 0;
}
.meta.top .date a::before{
    left: -10px;
    clip-path: polygon(100% 0, 100% 100%, 0 100%, 50% 50%);
}
.meta.top .date a::after{
    right: -10px;
    clip-path: polygon(50% 50%, 100% 100%, 0 100%, 0 0);
}

/* cta section */
.call-to-action-one .background-overlay {
    background-color: #222222;
    height: 100%;
}
[class*='call-to-action-'] .background-overlay {
    background-repeat: no-repeat;
    background-blend-mode: overlay;
    background-size: cover;
    background-position: center;
    position: relative;
    z-index: 0;
}
.call-to-action-one h2 {
    font-family: 'Raleway', sans-serif;
    font-size: 26px;
    font-weight: 800;
    color: #ffffff;
    padding-top: 3px;
    margin: 0 0 13px;
}
.bt-primary.bt-effect-1:hover>span, .bt-primary.bt-effect-1:focus>span {
    animation: button .15s cubic-bezier(0.05,-1.11,1,1.82) 2;
}

.bt-primary.bt-effect-1 span {
    display: inline-block;
}
.call-wrapper {
    display: inline-flex;
    align-items: center;
    min-height: 45px;
    font-size: 15px;
    color: #ffffff;
}

span.cta-or {
    background: var(--primary-color);
    padding: 10px 10px 10px 18px;
    border-radius: 100%;
    color: #fff;
    margin-left: 10px;
    margin-right: 10px;
}
a#u-cta-btn {
    color: #fff;
    background: var(--primary-color);
    padding: 12px;
	border-radius: 15%;
}

.padding-top-25 {
    padding-top: 25px;
    padding-bottom: 25px;
}
.flexing, .call-to-action-thirteen .background-overlay .row, .call-to-action-twelve .background-overlay .row, .call-to-action-eleven .background-overlay .row, .call-to-action-ten .background-overlay .row, .call-to-action-nine .background-overlay .row, .call-to-action-eight .background-overlay .row, .call-to-action-five .background-overlay .row, .call-to-action-four .background-overlay .row, .call-to-action-three .background-overlay .row, .call-to-action-two .background-overlay .row, .call-to-action-one .background-overlay .row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}


.cta-section{
    margin-bottom: 100px;
}
.cta-main,.cta_right{
    position: relative;
}
.cta-main::before,.cta_right::before{
    content: '';
    position: absolute;
    inset: 0;
    background: var(--black);
    opacity: 0.6;
}
.cta-main::after{
    content: '';
    position: absolute;
    background: var(--primary-color);
    width: 60%;
    height: 100%;
    right: 0;
    top: 0;
}
.cta-main img,.cta_right img{
    width: 100%;
}
.cta-info {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    /* left: calc(40% - 25px); */
    z-index: 1;
    display: flex;
    align-items: center;
}
.cta-detail h2 {
    font-size: 22px;
    color: var(--white);
    font-weight: 600;
}
.cta-detail a {
    text-decoration: none;
    color: var(--white);
    font-weight: 600;
    font-size: 22px;
}
.cta-icon {
    min-width: 50px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    background: var(--white);
    border-radius: 50px;
    font-size: 25px;
    margin-right: 15px;
}
.cta-icon i{
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.cta-right_content {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    width: 100%;
    display: flex;
    align-items: center;
    padding: 0 25px;
}
.cta-right_content .cta-count{
    min-width: 150px;
    width: 150px;
    background: var(--primary-color);
    color: var(--white);
    height: 150px;
    border-radius: 100%;
    text-align: center;
    border: 4px solid;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    font-weight: 600;
    margin-right: 15px;
}
.cta-right_content .cta-count span {
    font-size: 25px;
}
.cta-right_content div>span{
    color: var(--white);
}
.cta-right_content div>h2{
    color: var(--white);
    font-size: 26px;
    font-weight: 600;
}



/* footer section */
.footer-section{
    position: relative;
    background: var(--dark);
}
.footer-top .contact-icon {
    width: 80px;
    height: 80px;
    border-radius: 5px;
    line-height: 80px;
    text-align: center;
    color: var(--white);
    font-size: 35px;
    background: var(--primary-color);
    margin-right: 15px;
}
.footer-top .contact-info{
    display: flex;
    align-items: center;
}
.footer-top .contact-us {
    display: flex;
    flex-direction: column;
}
.footer-top .contact-us> span{
    color: var(--white);
}
.footer-top .contact-us> a{
    font-size: 18px;
    font-weight: 600;
}
.footer-top .row>div:not(:last-child) .widget-contact{
    border-right: 1px solid rgba(120 120 120 / 20%);
}
.footer-top .widget-contact {
    padding: 40px 0;
}
.footer-top{
    border-bottom: 1px solid rgba(120 120 120 / 20%);
}
.footer-main{
    padding: 40px 0;
}
.footer-main .footer-item{
    position: relative;
}
.custom-widget p {
    color: var(--white);
}
.footer-main .widget-social ul{
    display: flex;
}
.footer-item .custom-widget {
    background: var(--primary-color);
    border-radius: 5px;
    padding: 20px;
}
.footer-section .widget_recent_entries ul li .wp-block-latest-posts__featured-image img{
    border-radius: 100px;
    width: 75px;
    height: 75px;
    object-fit: cover;
}
.footer-section .widget_recent_entries ul li .wp-block-latest-posts__featured-image {
    float: left;
    margin-right: 10px;
    border-radius: 5px;
}
.footer-section .widget_recent_entries ul li .wp-block-latest-posts__post-author,
.footer-section .widget_recent_entries ul li .wp-block-latest-posts__post-date{
	color: var(--white);
}
.footer-section .widget_recent_entries ul li .wp-block-latest-posts__post-date{
	color: var(--white);
}
.footer-section .widget_block.widget_recent_entries ul li:after {
    content: '';
    display: block;
    clear: both;
}
.footer-section .widget_block.widget_recent_entries ul li .wp-block-latest-posts__post-title{
	display: block;
	color: var(--white);
	text-decoration: none;
}
.footer-section .widget_recent_entries ul li:not(:last-child){
	margin-bottom: 25px;
}
.footer-section .widget-title {
    font-size: 26px;
    font-weight: 600;
    margin-bottom: 20px;
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
}
.footer-section .widget ul{
    padding: 0;
    margin: 0;
    list-style: none;
}
.footer-section .widget_media_gallery .gallery .gallery-item{
	display: inline-block;
	width: 32%;
}
.footer-section .widget_media_gallery .gallery .gallery-item img{
	width: 100%;
}
.newsletter-widget p{
    color: var(--white);
}
.newsletter-form input[type="email"] {
    background: var(--white);
    border: none;
    outline: none;
    padding: 10px;
    border-radius: 5px;
    width: 100%;
    color: var(--dark);
}
.newsletter-form>div{
    position: relative;
}
.newsletter-form button {
    border: none;
    background: var(--primary-color);
    color: var(--white);
    padding: 10px 15px;
    border-radius: 5px;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
}
.footer-item .widget-contact{
    margin-top: 20px;
}
.footer-item .contact-icon {
    color: var(--white);
    font-size: 35px;
    margin-right: 15px;
}
.footer-item .contact-info{
    display: flex;
    align-items: center;
}
.footer-item .contact-us span{
    color: var(--white);
    font-weight: 600;
}
.footer-item .contact-us a{
    color: var(--white);
    font-weight: 600;
    font-size: 22px;
    letter-spacing: 1px;
}
.footer-copyright {
    padding: 15px;
    border-top: 1px solid rgba(120 120 120 / 20%);
}
.copyright-text{
    margin: 0;
    text-align: center;
    color: var(--white);
}


/* scroll up */
.scrollingUp.scroll-btn {
    display: inline-block;
    text-decoration: none;
    background: var(--primary-color);
    color: var(--white);
    border-radius: 100%;
    height: 40px;
    width: 40px;
    line-height: 40px;
    padding: 0;
    z-index: 999;
    border: none;
    position: fixed;
    bottom: 0;
    right: 50px;
    visibility: hidden;
    transition: all 0.65s ease 0s;
}
.scrollingUp.scroll-btn.is-active {
    bottom: 8%;
    visibility: visible;
}


/* menu-stikey */
.header-main .sticky-menu {
    position: fixed;
    top: -1px;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 999;
    -webkit-box-shadow: 0 10px 15px rgb(0 0 0 / 5%);
    -ms-box-shadow: 0 10px 15px rgba(0, 0, 0, 0.05);
    -o-box-shadow: 0 10px 15px rgba(0, 0, 0, 0.05);
    box-shadow: 0 10px 15px rgb(0 0 0 / 5%);
    -webkit-animation: 1s ease-in-out 0s normal none 1 running fadeInDown;
    animation: 1s ease-in-out 0s normal none 1 running fadeInDown;
    background-color: var(--white);
}


/* breadcrumb */
.breadcrumb-section{
    position: relative;
    padding: 100px 0;
    z-index: 1;
}
.breadcrumb-section::before{
    position: absolute;
    content: '';
    inset: 0;
    background: var(--black);
    opacity: 0.5;
    z-index: -1;
}
.content-breadcrumb {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.content-breadcrumb h1{
    color: var(--white);
}
.content-breadcrumb ol li a{
    text-decoration: none;
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
}
.content-breadcrumb ol li.active,.breadcrumb-item+.breadcrumb-item::before{
    color: var(--white);
}


/* 404 */
.error_404{
    padding: 100px 0;
    background: var(--white);
}
.error_404 {
    padding: 100px 0;
    background: var(--white);
    text-align: center;
}
.error_404 .error_404_content h2{
    font-size: 200px;
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 4px var(--white);
}

/* About page  */
.timeline-section{
    padding: 100px 0;
    background: var(--white);
}
.timeline-year {
    width: 100px;
    min-width: 100px;
    height: 100px;
    line-height: 100px;
    text-align: center;
    background: var(--primary-color);
    border-radius: 100px;
    color: var(--white);
    font-size: 22px;
    font-weight: 600;
    margin-right: 25px;
    position: relative;
    z-index: 1;
}
.timeline-year::before{
    content: '';
    position: absolute;
    width: 25px;
    height: 4px;
    background: var(--primary-color);
    right: -25px;
    top: 50%;
    transform: translateY(-50%);
}

.timeline-year::after{
    content: '';
    position: absolute;
    inset: -40px;
    border: 5px solid red;
    z-index: -1;
    border-radius: 100%;
    border-right-color: transparent;
    border-bottom-color: transparent;
    transform: rotate(-45deg);
}
.timeline-content {
    background: var(--white);
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
    padding: 15px;
}
.timeline-item {
    display: flex;
    align-items: center;
}
.timeline-item.left .timeline-year{
    margin-right: 0px;   
    margin-left: 25px;   
}
.timeline-item.left .timeline-year::before{
    left: -25px;
    right: unset;
}
.timeline-item.left .timeline-year::after{
    transform: rotate(135deg);
}


/* work process section */
.work_process-section{
    padding: 100px 0 75px;
    position: relative;
    z-index: 1;
}
.work_process-section::before{
    content: '';
    position: absolute;
    inset: 0;
    background: var(--black);
    opacity: 0.5;
    z-index: -1;
}
.work-process_icon {
    width: 100px;
    height: 100px;
    line-height: 100px;
    text-align: center;
    background: var(--primary-color);
    color: var(--white);
    font-size: 36px;
    border-radius: 100px;
    margin: 0 auto 25px;
    position: relative;
}
.work-process_item{
    text-align: center;
    margin-bottom: 25px;
}
.work-process_content h2 {
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
    font-size: 26px;
}
.work-process_content h2 span {
    -webkit-text-stroke: 1px var(--white);
}
.work-process_icon::before{
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 100%;
    animation: wave 1.5s linear infinite;
}
.work_process-section .section-title h2 {
    color: var(--white);
}


/* contact us */
.contact-info_section{
    padding: 100px 0 75px;
    background: var(--white);
}
.contact-info_item> span {
    display: inline-block;
    font-size: 22px;
    font-weight: 800;
    -webkit-text-stroke: 1px var(--white);
}

.contact-info_item .contact-icon i{
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; 
}
.contact-info_item .contact-icon::before{
    content: '';
    position: absolute;
    inset: 10px;
    background: var(--white);
    border-radius: 50px;
    z-index: -1;
}
.contact-info_item .contact-info span {
    font-size: 18px;
    font-weight: 600;
    background: var(--primary-color);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.contact-info_item .contact-info a{
    text-decoration: none;
    color: var(--dark);
}

.contact-info_item {
    background: var(--dark);
    border-radius: 15px 100px 15px 15px;
    display: flex;
    padding: 15px;
    align-items: end;
    justify-content: space-between;
    transition: all 0.5s;
}
.contact-info_item:hover,.contact-info_item:focus-within {
    background: var(--primary-color);
    transition: all 0.5s;
}
.contact-info_item .widget-contact > .contact-info {
    text-align: center;
    width: 230px;
    height: 230px;
    border-radius: 230px;
    background: var(--white);
    position: relative;
    right: -25px;
    top: -25px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
    padding-top: 10px;
}
.contact-info_item .contact-icon {
    width: 70px;
    height: 70px;
    border-radius: 70px;
    line-height: 70px;
    text-align: center;
    background: var(--primary-color);
    font-size: 20px;
    position: relative;
    z-index: 1;
    margin: 0 auto 20px;
}
.map-chart iframe {
    width: 100%;
    height: 350px;
}
.map-chart {
    line-height: 0;
}
/* country office */
.country-section{
    padding: 100px 0 75px;
}
.country-section .country{
    text-align: center;
    margin-bottom: 25px;
}
.country .country-name {
    background: var(--primary-color);
    color: var(--white);
    padding: 15px;
    text-align: center;
    border-radius: 10px;
}
.country p {
    padding: 15px 15px 50px;
    border-radius: 15px;
    box-shadow: rgba(0, 0, 0, 0.04) 0px 3px 5px;
}
.country-image {
    margin-top: -50px;
    width: 80px;
    height: 80px;
    margin-left: auto;
    margin-right: auto;
}
.country-image img{
    width: 100%;
    border-radius: 100%;
}



/* form */
section.contact-section {
    padding: 100px 0;
}
.main-contact_Form form p:nth-child(1),
.main-contact_Form form p:nth-child(2) {
    width: 49%;
}

.main-contact_Form form p:nth-child(1) {
    float: left;
}

.main-contact_Form form p:nth-child(2) {
    float: right;
}

.main-contact_Form form p label {
    display: block;
    color: var(--fix-white);
    margin-bottom: 5px;
}

.main-contact_Form form p input[type="text"],
.main-contact_Form form p input[type="email"],
.main-contact_Form form p textarea {
    width: 100%;
    border: none;
    outline: none;
    border-radius: 5px;
    padding: 10px 15px;
    color: var(--fix-white);
    background: rgba(120 120 120 / 20%);
}

.main-contact_Form form p input[type="text"],
.main-contact_Form form p input[type="email"] {
    height: 40px;
}

.main-contact_Form form p:last-child {
    text-align: center;
}

.main-contact_Form form p input[type="submit"] {
    outline: none;
    border: none;
    padding: 10px 15px;
    border-radius: 5px;
    background: var(--primary-color);
    color: var(--white);
    font-weight: 600;
    font-size: 18px;
}

.wp-block-search .wp-block-search__label {
    font-weight: 700;
    color: #fff;
    padding: 15px 0px 0px 15px;
}

/* blog-single  */
.blog-section .comments-area {
    margin-bottom: 25px;
    background: #eee;
    border-radius: 10px;
    padding: 20px;
}
ol.comment-list {
    margin: 0 0 25px;
    padding: 0px;
    list-style: none;
    position: relative;
    z-index: 1;
}
ol.comment-list::before{
    content: '';
    position: absolute;
    inset: 0;
    opacity: 0.2;
    z-index: -1;
    border-radius: 5px;
}
ol.children {
    margin: 0;
    list-style: none;
}
.comments-area .comment-meta .comment-author img {
    position: absolute;
    z-index: 0;
    left: 0;
    border-radius: 5px;
    width: 100px;
    height: 100px;
    object-fit: cover;
    margin-left: 25px;
}
.comments-area .comment-body {
    position: relative;
    padding: 25px 25px 25px 145px;
    overflow-wrap: break-word;
    word-wrap: break-word;
    border-radius: 3px;
    z-index: 1;
    min-height: 150px;
}
.comment-list>li:not(:last-child).comment .comment-body::before{
    content: '';
    position: absolute;
    inset: 0;
    opacity: 0.2;
    z-index: -1;
}
.comment-list>li.comment .children .comment-body::before{
    left: -32px;
}
.comment-list>li.comment .children .children  .comment-body::before{
    left: -64px;
}
.comment-content p {
    margin: 0;
    color: var(--dark);
}
.comment-author .fn a {
    text-decoration: none;
    color: var(--dark);
    font-weight: 700;
    font-size: 18px;
}
.comment-metadata a {
    text-decoration: none;
    font-weight: 600;
    color: var(--primary-color);
}
.comment-metadata a time:before {
    content: "\f073";
    font-family: "Font Awesome 5 Free";
    font-size: 14px;
    color: var(--primary-color);
    margin-right: 5px;
}
.comment-metadata a.reply {
    display: inline-block;
    background: var(--primary-color);
    padding: 8px 15px;
    color: var(--white);
    border-radius: 5px;
}
.comment-metadata {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.comment-respond {
    background-color: var(--bg-color);
    border-radius: 5px;
}
.comment-reply-title {
    color: var(--primary-color);
    font-size: 22px;
    font-weight: 600;
}
.comment-form p{
    color: var(--dark)
}
.comment-form p .comment-textarea,
.comment-form p input[type='text'],
.comment-form p input[type='email'],
.comment-form p input[type='url']{
    width: 100%;
    background-color: var(--white);
    border: none;
    outline: none;
    padding: 10px 15px;
    border-radius: 4px;
    color: var(--dark);
}
.comment-form p.form-submit{
    margin: 0;
}
.comment-form p.form-submit input[type='submit']{
    background: var(--primary-color);
    border: none;
    outline: none;
    color: var(--white);
    padding: 10px 15px;
    border-radius: 4px;
}
	/* General styling */
        .navbar {
            background-color: #f8f9fa;
        }

        .navbar-brand {
            font-size: 1.5rem;
        }

        .navbar-toggler {
            border: none;
        }

        .navbar-toggler-icon {
            background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba%288, 8, 8, 0.5%29' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
        }

        .navbar-collapse {
            justify-content: flex-end;
        }

        .navbar-nav {
            display: flex;
            flex-wrap: wrap;
        }

        .nav-item {
            white-space: nowrap;
               flex: 1 1 calc(1.28% - 1rem);
        }

        .nav-link {
            font-size: 1rem;
        }

        .nav-link:hover {
            color: #0056b3;
        }

        .nav-link.disabled {
            color: #6c757d;
        }

        /* Dropdown styling */
        .nav-item.dropdown .dropdown-menu {
            background-color: #ffffff;
            border-radius: 0.25rem;
            box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
        }

        .nav-item.dropdown .dropdown-menu .dropdown-item {
            color: #343a40;
        }

        .nav-item.dropdown .dropdown-menu .dropdown-item:hover {
            background-color: #f8f9fa;
            color: #0056b3;
        }

        .nav-item.dropdown .dropdown-menu .dropdown-divider {
            margin: 0.5rem 0;
        }

        /* Custom max-width for navbar */
        .navbar-container {
            max-width: 1200px;
            margin: 0 auto;
        }
		@media (min-width: 992px) {
			.navbar-expand-lg {
			    width: 650px;
		}
		}
		
		.custom-btn {
            position: relative;
            display: inline-block;
            padding: 16px 22px;
            margin: 0;
            text-decoration: none;
            border-radius: 0 5px 5px 0;
            background: var(--primary-color);
            color: var(--white);
            overflow: hidden;
			border: 2px solid;
            transition: color 0.3s ease, background-color 0.3s ease;
        }

        .custom-btn a {
			text-decoration:none;
		}
        .custom-btn span {
            position: relative;
            z-index: 2;
        }

        .custom-btn:before, .custom-btn:after {
            content: "";
            position: absolute;
            top: 0;
            right: 0;
            height: 4px;
            width: 0;
            background: var(--primary-color);
            transition: width 1s ease;
            z-index: 1;
        }

        .custom-btn:after {
            top: inherit;
            bottom: 0;
            left: 0;
        }

        .custom-btn:hover {
            color: var(--primary-color);
            background: var(--white);
			border: 2px solid var(--primary-color);
        }

        .custom-btn:hover:before, .custom-btn:hover:after {
            width: 100%;
        }
		
		.widget-header .widget-social ul li a:after {
			content: "";
			display: block;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			border: 2px solid var(--white);
			border-radius: 50%;
			transition: all 0.2s linear 0s;
		}
		.widget-header .widget-social ul li a {
			border: none;
			overflow: visible;
		}
		.widget-header .widget-social ul li {
			position: relative;
			display: inline-flex;
			margin: 0 5px;
		}
		.widget-social ul {
			padding: 0;
			margin: 0;
			list-style: none;
			text-align: right;
		}
		.widget-header .contact-info .contact-icon ul li a i {
			background: var(--primary-color);
			-webkit-background-clip: text;
			-webkit-text-fill-color: transparent;
		}
		.pagination {
			justify-content: center;
			margin-bottom: 50px;
		}
		.pagination .page-numbers{
			background: #000;
			padding: 10px 20px 10px 20px;
			color: #fff;
		}
		.pagination .page-numbers.current, .pagination .next.page-numbers, .pagination .prev.page-numbers{
			background: var(--primary-color);
			padding: 10px 20px 10px 20px;
			color: #fff;
		}