/*
Theme Name: Graceful Inspire Blog
Theme URI: https://optimathemes.com/graceful-inspire-blog-theme/
Author: Aslam
Author URI: http://optimathemes.com/
Description: Graceful Inspire Blog is a modern, clean, and responsive WordPress blog theme designed for bloggers, content creators, and online publishers. Perfect for lifestyle, fashion, travel, beauty, food, health, fitness, technology, personal, business, news, and magazine websites, it provides a professional and elegant foundation for any content-focused site. Built with performance and usability in mind, Graceful Inspire Blog is fully responsive, Retina-ready, SEO optimized, RTL language compatible, and seamlessly integrates with WooCommerce, making it easy to create both blogs and online stores. Whether you're launching your first blog or managing an established website, Graceful Inspire Blog offers a flexible, fast, and user-friendly experience that looks great on every device.
Template: graceful
Version: 1.0.0
Requires at least: 5.3
Tested up to: 7.1
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: graceful-inspire-blog
Tags: blog, one-column, two-columns, three-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-header, custom-menu, custom-logo, featured-images, footer-widgets, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, e-commerce
*/

/*
Customization of this theme starts here
*/

/* style.css */

/*--------------------------------------------------------------
Header Sections
--------------------------------------------------------------*/

.post-header {
    margin-top: 20px;
}

.post-categories {
    background: #f1f1f1;
}

.blog .post-title,
.archive .post-title,
.search .post-title {
    font-size: 34px;
    line-height: 38px;
}

.blog article .post-meta,
.archive article .post-meta,
.search article .post-meta,
.single article .post-meta {
    margin-bottom: 10px;
}

.blog .post-page-content,
.archive .post-page-content,
.search .post-page-content {
    padding-top: 10px;
}

aside .graceful-widget h2, 
.graceful-widget .widget-title {
    background: #000000;
    color: #ffffff !important;
    border-bottom: 1px solid #000000;
    font-weight: 700;
    font-size: 14px;       /* parent sets 12px */
    text-align: left;      /* parent centers this */
    padding-left: 12px;
}

/* Hide the parent theme's pointer triangle below the widget title */
aside .graceful-widget h2::after, 
.graceful-widget .widget-title::after {
    display: none;
}

/* Double chevron marker before the title text, matching the Slider 1 nav arrows.
   Drawn as an inline SVG because ::after is already used by the parent theme
   for the pointer triangle, so only one pseudo-element is available. */
aside .graceful-widget h2::before, 
.graceful-widget .widget-title::before, 
.graceful-inspire-category-title::before {
    content: "";
    display: inline-block;
    width: 17px;
    height: 12px;
    margin-right: 8px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 10'%3E%3Cg fill='none' stroke='%23e3e32a' stroke-width='2'%3E%3Cpath d='M1 1l4 4-4 4'/%3E%3Cpath d='M8 1l4 4-4 4'/%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    vertical-align: middle;
    position: relative;
    top: -1px;
}

.graceful-inspire-category-title::before {
    width: 19px;
    margin-right: 2px;
}


.post-title {
    word-wrap: break-word;
}

.graceful-slider-info {
    padding: 20px;
}

.graceful-slider-title {
    font-size: 32px;
    word-wrap: break-word;
}

#primary .continue-read a {
    border: 1px solid #111111;
    color: #000000;
    text-decoration: none;
    font-weight: bold;
    line-height: 34px;
    text-transform: capitalize;
}

#primary .continue-read a:hover {
    background: #f1f1f1;
}

@media screen and (max-width: 480px) {
    .graceful-slider-title {
        width: 300px;
    }
}

.site-images {
    min-height: 0;
    border: 1px solid #eeeeee;
}


.single .post-date {
    color: #111111 !important;
    font-family: 'Mulish', sans-serif;
    font-size: 13px;
}

.single .post-title-author { 
    color: #111111 !important;
    display: inline-block;
    font-family: 'Mulish', sans-serif;
    font-size: 13px;
    font-weight: normal;
}

.blog article .post-date,
.archive article .post-date,
.search article .post-date {
    font-family: 'Mulish', sans-serif;
    font-size: 13px;
}

.blog article .post-header .post-meta a,
.archive article .post-header .post-meta a,
.search article .post-header .post-meta a {
    font-family: 'Mulish', sans-serif;  
    font-size: 13px; 
}

.content-column > li {
    margin-bottom: 60px;
}

.post-footer{
    border-bottom: 1px solid #eeeeee;
}

@media screen and (max-width: 480px) {
    .content-column > li {
        width: 100%;
    }
}

/* Top Navigation
   ========================================================================== */

#main-navigation {
    text-align: center;
}

.grace-latest {
    text-align: center;
    background: #f3f3f3;
    padding: 7px;
    font-size: 20px;
    margin-bottom: 36px;
}

.main-navigation-sidebar {
  position: absolute;
  top: 0px;
  left: 40px;
  z-index: 1;
}
            
.main-navigation-search {
  position: absolute;
  top: 0px;
  right: 40px;
  z-index: 2;
}

#top-navigation {
  text-align: center;
  box-shadow: 0px 1px 5px rgba(0,0,0, 0.1);
  border-bottom: 1px solid #999999;
  background: #ffffff;
}

#top-navigation {
    border-bottom: 1px solid #d9d1c0;
}

#top-menu {
  display: inline-block;
}

#top-menu a:focus {
  outline: 3px dotted #000000 !important;
}

#top-menu li {
  position: relative;
}

#top-menu li.menu-item-has-children>a:after {
    font-family: FontAwesome;
    content: "\f107";
    margin-left: 6px;
    font-size: 12px;
}

#top-menu ul li.menu-item-has-children>a:after {
    font-family: FontAwesome;
    content: "\f105";
    font-size: 14px;
    float: right;
}

#top-menu > li {
  display: inline-block;
  list-style: none;
}

#top-menu li a {
  display: block;
  position: relative;
  padding: 0 5px;
  margin-left: 5px;
}

#top-menu li a {
  color: #000000;
}

#top-menu ul li a {
  color: #000000;
}

#top-menu li a:first-child {
  margin-left: 0;
}

#top-menu > li > a {
  display: block;
  text-decoration: none;
}

#top-menu > li:first-child > a {
  padding-left: 0px;
}

#top-menu > li:last-child > a {
  padding-right: 0px;
}

#top-menu ul ul {
  top: -1px;
  left: 100%;
}

#top-menu .menu-item:hover > ul, #top-menu .menu-item:focus-within > ul {
  left: 0;
  opacity: 1;
}

#top-menu .menu-item:hover ul ul, #top-menu .menu-item:focus-within ul ul{
  left: 100%;
}

#top-menu .sub-menu {
  position: absolute;
  left: -999em;
  z-index: 1101;
  width: 170px;
  text-align: left;
  border: 1px solid #e4e4e4;
  border-width: 1px;
  opacity: 0;
}

#top-menu .sub-menu a {
  border-bottom: 1px solid #dddddd;
}

#top-menu .sub-menu > li:last-of-type > a {
  border: none;
}

#top-menu .sub-menu li:first-child > .sub-menu {
  margin-top: -1px;
}

#top-menu .sub-menu > li > a {
  display: block;
  width: 100%;
  padding: 8px 15px;
  margin: 0;
  background: #ffffff;
}

#top-menu li a {
  font-size: 11px;
  line-height: 40px;
  letter-spacing: 1px;
  font-weight: 600;
  text-transform: uppercase;
}
#top-menu .sub-menu > li > a {
  font-size: 11px;
  line-height: 24px;
  letter-spacing: 0.5px;
}

#top-menu li a {
  font-size: 11px;
  line-height: 40px;
  letter-spacing: 1px;
  font-weight: 600;
}
#top-menu .sub-menu > li > a {
  font-size: 11px;
  line-height: 22px;
  letter-spacing: 0.5px;
}

#top-menu li a,
#main-menu li a {
  text-transform: uppercase;
}

#top-navigation > div {
  padding-left: 30px;
  padding-right: 30px;
}

#main-navigation {
    background: #ffffff;
    border-bottom: 1px solid #eee;
}

.entry-header {
    border-bottom: 1px solid #eee;
}

.main-content {
    margin-top: 40px;
}

.main-content article {
    background: #fafafa;
}

aside .wp-block-latest-posts.wp-block-latest-posts__list li {
    border-bottom: 1px solid #000000;
}

.wp-block-search__label {
    display: none;
}

/* Media Query Min 768px
   ========================================================================== */
@media screen and (min-width: 768px) {
    .blog .post-page-content p,
    .archive .post-page-content p,
    .search .post-page-content p {
        padding: 0 24px;
    }
    #main-navigation .wrapped-content {
        padding-left: 0;
    }
    .main-navigation-search {
        right: 0;
    }
    #main-navigation .navigation-socials {
        right: 35px;
    }
}


#graceful-post-slider {
    padding-left: 40px;
    padding-right: 40px;
}

#graceful-post-slider.wrapped-content {
    padding-left: 0;
    padding-right: 0;
}


.graceful-hero-banner {
    min-height: 500px;
    display: flex;
    align-items: center;
}

.graceful-hb-col {
    position: relative;
    float: left;
    width: 100%;
}

.graceful-hb-col:last-child {
    min-height: 400px;
}

.graceful-hb-col img {
    width: 450px;
    height: 450px;
    margin: 50px;
}

.graceful-hb-col h2 {
    font-size: 38px;
    margin-bottom: 20px;
}

.graceful-hb-col a {
    padding: 6px 20px;
    background: #333333;
    color: #ffffff !important;
    font-size: 14px;
    font-weight: bold;
    float: left;
    border-radius: 5px;
}


#graceful-hero-banner-wrap {
    padding-left: 40px;
    padding-right: 40px;
}

@media screen and (min-width: 768px) {

    .graceful-hb-col:first-child {
        width: 59%;
    }
    
    .wrapped-content .main-navigation-search {
        right: 0;
    }
    #main-navigation .wrapped-content .navigation-socials {
        right: 35px;
    }

    .main-navigation-search {
        right: 35px;
    }
    #main-navigation .navigation-socials {
        right: 75px;
    }
    .graceful-hb-col {
        width: 49%;
    }
}

.graceful-widget .graceful-recent-image-box a {
    font-size: 14px;
}


#graceful-post-slider .slide-item {
    background-size: cover;
    height: 420px;
}

.single .post-page-content {
    padding: 0px 0px 10px;
}

#responsive-menu .sub-menu > li {
    background: #eeeeee;
}

#responsive-menu .sub-menu > li li {
    background: #cccccc;
}

.close-graceful-search {
    background: #000000;
}

#site-menu li a {
    font-family: 'Open Sans', sans-serif;
}

aside .graceful-widget h2 {
    font-family: Open Sans, sans-serif;
}

#graceful-hero-banner-wrap {
    margin-top: 20px;
}


.graceful-hb-col a:focus {
    outline: 2px dotted #000000 !important;
}


.close-graceful-search {
    background: #dddddd;
    border: 1px solid #aaaaaa;
}

#site-footer {
    border-top: 1px solid #cccccc;
    background: #f2f2f2;
}

#site-footer .graceful-widget h2 {
    color: #ffffff !important;
}

.intro-text form {
    margin-top: 35px;
}


#primary .continue-read a {
    font-family: Open Sans, sans-serif;
    font-size: 14px;
    font-weight: 300;
    background: #fafafa;
}

.blog .post-header,
.archive .post-header,
.search .post-header,
.single .post-header {
    width: 80%;
    text-align: left;
    margin: 40px 10% 0;
}

.blog .post-page-content,
.archive .post-page-content,
.search .post-page-content,
.single .post-page-content {
    width: 80%;
    text-align: left;
    margin: 0px 10%;
}

.blog .post-page-content p,
.archive .post-page-content p,
.search .post-page-content p {
    padding: 0;
    margin: 0;
}

.blog .post-footer,
.archive .post-footer,
.search .post-footer,
.single .post-footer {
    width: 80%;
    text-align: left;
    margin: 0px 10%;
    padding: 3px 3px 3px 0 !important;
}

.blog .continue-read,
.archive .continue-read,
.search .continue-read {
    text-align: left;
}

.post-categories {
    background: #f2f2f2;
    border: 1px solid #dddddd;
}


.site-images a::before {
    position: absolute;
    top: 0;
    left: -75%;
    z-index: 2;
    display: block;
    content: '';
    width: 50%;
    height: 100%;
    background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,.3) 100%);
    -webkit-transform: skewX(-25deg);
    transform: skewX(-25deg);
}
.site-images a:hover::before {
    -webkit-animation: shine .75s;
    animation: shine .75s;
}
@-webkit-keyframes shine {
    100% {
        left: 125%;
    }
}
@keyframes shine {
    100% {
        left: 125%;
    }
}

.graceful-hero-banner .graceful-hb-col .navigation-socials a {
    padding: 2px;
    background: transparent;
    color: #ff6481;
    font-size: 18px;
    font-weight: bold;
}


/*--------------------------------------------------------------
Featured Boxes Sections
--------------------------------------------------------------*/

#featured-boxes {
  border-bottom: 1px solid #eee;
  background: #fff;
  margin-top: 40px;
}

#featured-boxes .wrapped-content {
  font-size: 0;
  text-align: center;
}

#featured-boxes .featured-box {
  position: relative;
  float: left;
}

#featured-boxes a {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#featured-boxes .graceful-wrap-outer {
  padding: 12px;
}

#featured-boxes h4 {
  display: inline-block;
  padding: 11px 20px;
  font-family: 'Lato', sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  background-color: rgba(0,0,0,0.50);
  color: #ffffff !important;
}

#featured-boxes .featured-box {
    width: calc((100% - 50px ) /3);
    width: -webkit-calc((100% - 70px ) /3);
    margin-right: 34px;
}

#featured-boxes .featured-box:last-child {
    margin-right: 0;
}


@media screen and (max-width: 768px) {
    .featured-box {
        display: block;
    }
    .main-navigation-search {
        right: 20px;
        top: 7px !important;
    }
}


@media screen and (max-width: 480px) {
    #featured-boxes .featured-box {
        width: 100%;
        margin-bottom: 34px;
    }
    
    #featured-boxes {
      padding: 20px !important;
    }

    .main-navigation-search {
        top: 0 !important;
    }
}


/* Media Queries */
@media screen and (max-width: 480px) {
    .graceful-hero-banner {
        flex-direction: column;
        align-items: flex-start; /* Adjust as needed */
        flex-direction: column-reverse;

    }
    .graceful-hb-col a {
        float: unset;
        padding: 8px 20px;
    }
    .main-navigation-search {
        right: 20px;
    }
    .graceful-hb-col img {
        width: 100%;
        height: 100%;
        text-align: center; 
        margin: 20px 0px 30px;
    }
    .graceful-hb-col h2 {
        font-size: 28px;
        margin-bottom: 20px;
    }
    .graceful-hb-col:last-child {
        min-height: 300px;
    }
    .graceful-hb-col:first-child::after {
        left: 0;
        width: 100%;
    }
    
}

@media (min-width:700px) and (max-width:900px) {
    .graceful-hb-col img {
        width: 340px;
        height: 340px;
    }
    .graceful-hb-col:first-child {
        text-align: center;
    }
    .graceful-hb-col:first-child::after {
        display: none;
    }
    .graceful-hb-col:last-child {
        min-height: 200px;
        text-align: center;
    }
}

.site-menu-wrapper {
    margin-right: 0px;
}

#primary .post-date {
    color: #1a1a1a;
}



/*--------------------------------------------------------------
Graceful Inspire Slider 2
--------------------------------------------------------------*/

#graceful-inspire-slider-2 {
    background: #ffffff;
    padding: 40px 0;
}

#graceful-inspire-slider-2 .graceful-inspire-slider-2-owl .graceful-inspire-slider-2-slide {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
}

/* Inner container to create left image / right content layout */
#graceful-inspire-slider-2 .graceful-inspire-slider-2-slide-inner {
    display: flex;
    align-items: center;
    gap: 40px;
    width: 92%;
    margin: 0 auto;
}

/* Left image */
#graceful-inspire-slider-2 .graceful-inspire-slider-2-slide-image {
    flex: 0 0 480px;
    max-width: 480px;
    position: relative;
}

#graceful-inspire-slider-2 .graceful-inspire-slider-2-slide-image img {
    width: 100%;
    height: 320px;  /* fixed height so object-fit crops every image to the same box */
    display: block;
    border-radius: 2px;
    box-shadow: none;
    object-fit: cover;
    object-position: center center;
}

#graceful-inspire-slider-2 .graceful-inspire-slider-2-image-placeholder {
    width: 100%;
    height: 320px;  /* match the image height so slides without a thumbnail line up */
    background: #f5f5f5;
}

/* Right content */
#graceful-inspire-slider-2 .graceful-inspire-slider-2-slide-content {
    flex: 1 1 auto;
}

/* Category badge */
#graceful-inspire-slider-2 .graceful-inspire-slider-2-category span {
    display: inline-block;
    background: #000000; /* small colored badge */
    color: #ffffff;
    padding: 1px 10px;
    border-radius: 3px;
    font-size: 12px;
    letter-spacing: 0.2px;
    text-transform: none;
}

#graceful-inspire-slider-2 .graceful-inspire-slider-2-title {
    margin: 18px 0 10px;
    font-size: 44px;
    line-height: 1.05;
    font-weight: 800;
    color: #33383b; /* bold typography color */
}

#graceful-inspire-slider-2 .graceful-inspire-slider-2-title a {
    text-decoration: none;
    color: inherit;
}

#graceful-inspire-slider-2 .graceful-inspire-slider-2-author {
    color: #8d9396; /* subtle gray for author */
    font-size: 14px;
    margin-top: 6px;
}

/* Navigation buttons centered below slider */
#graceful-inspire-slider-2 .graceful-inspire-slider-2-nav {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 22px;
}

#graceful-inspire-slider-2 .graceful-inspire-slider-2-nav button {
    border: none;
    background: transparent;
    font-size: 28px;
    cursor: pointer;
    padding: 6px 10px;
    color: #6b6f71;
}

/* Responsive tweaks */
@media (max-width: 880px) {
    #graceful-inspire-slider-2 .graceful-inspire-slider-2-slide-inner {
        flex-direction: column;
        gap: 18px;
    }

    #graceful-inspire-slider-2 .graceful-inspire-slider-2-slide-image {
        flex: 0 0 auto;
        max-width: 100%;
    }

    /* Shorter crop once the image spans the full column width */
    #graceful-inspire-slider-2 .graceful-inspire-slider-2-slide-image img,
    #graceful-inspire-slider-2 .graceful-inspire-slider-2-image-placeholder {
        height: 260px;
    }

    #graceful-inspire-slider-2 .graceful-inspire-slider-2-title {
        font-size: 28px;
    }
}


#graceful-inspire-slider-2 .owl-dots {
    display: none;
}


/*--------------------------------------------------------------
Graceful Inspire Slider 1
--------------------------------------------------------------*/

#graceful-inspire-slider-1 {
    --gis1-accent: #e3e32a;
    --gis1-overlay-rgb: 46, 53, 56;
    position: relative;
    background: #f2f2f2;
    overflow: hidden;
}

#graceful-inspire-slider-1 .graceful-inspire-slider-1-slide {
    position: relative;
    height: 540px;  /* fixed so every slide image is exactly the same height */
    display: flex;
    align-items: flex-end;      /* pin content to the bottom */
    justify-content: flex-start;/* pin content to the left */
    overflow: hidden;
}

/* Slide background image */
#graceful-inspire-slider-1 .graceful-inspire-slider-1-slide-media {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #f2f2f2;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 0;
}

#graceful-inspire-slider-1 .graceful-inspire-slider-1-slide-no-image .graceful-inspire-slider-1-slide-media {
    background-image: linear-gradient(120deg, #d4d8da 0%, #f0f2f3 100%);
}

/* Content positioning over the image */
#graceful-inspire-slider-1 .graceful-inspire-slider-1-slide-inner {
    position: relative;
    z-index: 1;
    align-self: flex-end;   /* fallback if align-items is overridden */
    margin-top: auto;       /* fallback: push the box down */
    width: 100%;
    padding: 40px;
    box-sizing: border-box;
}

#graceful-inspire-slider-1 .graceful-inspire-slider-1-slide-content {
    max-width: 520px;
    padding: 30px 32px 34px;
    background: #2e3538; /* fallback for browsers without CSS custom properties */
    background: rgba(var(--gis1-overlay-rgb), 0.82);
}

/* Category badge */
#graceful-inspire-slider-1 .graceful-inspire-slider-1-category {
    margin-bottom: 12px;
}

#graceful-inspire-slider-1 .graceful-inspire-slider-1-category a {
    text-decoration: none;
}

#graceful-inspire-slider-1 .graceful-inspire-slider-1-category span {
    border: 1px solid rgba(255,255,255,0.3);
    display: inline-block;
    padding: 0 8px;
    color: #ffffff;
    font-size: 10px;
    font-weight: 700;
    line-height: 18px;
    letter-spacing: 1px;
    text-transform: uppercase;
}

/* Title */
#graceful-inspire-slider-1 .graceful-inspire-slider-1-title {
    display: -webkit-box;
    -webkit-line-clamp: 3;  /* keep long titles from outgrowing the fixed slide */
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin: 0 0 16px;
    font-size: 36px;
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    word-wrap: break-word;
}

#graceful-inspire-slider-1 .graceful-inspire-slider-1-title a {
    color: #ffffff;
    text-decoration: none;
}

#graceful-inspire-slider-1 .graceful-inspire-slider-1-title a:hover,
#graceful-inspire-slider-1 .graceful-inspire-slider-1-title a:focus {
    color: var(--gis1-accent);
}

/* Read More button */
#graceful-inspire-slider-1 .graceful-inspire-slider-1-button a {
    display: inline-block;
    padding: 10px 22px;
    background: #e3e32a;
    background: var(--gis1-accent);
    color: #1b2023 !important;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    line-height: 1;
    text-transform: uppercase;
    text-decoration: none;
}

#graceful-inspire-slider-1 .graceful-inspire-slider-1-button a:hover,
#graceful-inspire-slider-1 .graceful-inspire-slider-1-button a:focus {
    background: #ffffff;
}

#graceful-inspire-slider-1 .graceful-inspire-slider-1-button a:focus {
    outline: 2px dotted #ffffff !important;
    outline-offset: 2px;
}

/* Chevron navigation, bottom right of the slider */
#graceful-inspire-slider-1 .graceful-inspire-slider-1-nav {
    position: absolute;
    right: 28px;
    bottom: 22px;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Translucent wedge fitted into the bottom right corner, behind the chevrons.
   Right angle sits on the corner, hypotenuse runs bottom left to top right. */
#graceful-inspire-slider-1 .graceful-inspire-slider-1-nav::before {
    content: "";
    position: absolute;
    right: -28px;   /* cancel the nav offset so the wedge meets the corner */
    bottom: -22px;
    z-index: -1;
    width: 190px;
    height: 190px;
    background: #2e3538; /* fallback for browsers without CSS custom properties */
    background: rgba(var(--gis1-overlay-rgb), 0.6);
    -webkit-clip-path: polygon(100% 0, 100% 100%, 0 100%);
    clip-path: polygon(100% 0, 100% 100%, 0 100%);
    pointer-events: none; /* keep the wedge from swallowing clicks on the slide */
}

#graceful-inspire-slider-1 .graceful-inspire-slider-1-nav button {
    display: flex;
    align-items: center;
    padding: 6px;
    border: none;
    background: transparent;
    cursor: pointer;
}

#graceful-inspire-slider-1 .graceful-inspire-slider-1-nav button span {
    display: block;
    box-sizing: content-box; /* keep the border outside the 13px arm length */
    width: 13px;
    height: 13px;
    margin-left: -4px;
    border-top: 4px solid var(--gis1-accent);
    border-right: 4px solid var(--gis1-accent);
    transform: rotate(45deg);
}

#graceful-inspire-slider-1 .graceful-inspire-slider-1-nav button.graceful-inspire-slider-1-prev span {
    margin-left: 0;
    margin-right: -4px;
    transform: rotate(-135deg);
}

#graceful-inspire-slider-1 .graceful-inspire-slider-1-nav button:hover span {
    border-top-color: #ffffff;
    border-right-color: #ffffff;
}

#graceful-inspire-slider-1 .graceful-inspire-slider-1-nav button:focus {
    outline: 2px dotted var(--gis1-accent) !important;
}

#graceful-inspire-slider-1 .graceful-inspire-slider-1-no-posts {
    margin: 0;
    padding: 40px;
    color: #ffffff;
    text-align: center;
}

/* Owl overrides */
#graceful-inspire-slider-1 .owl-dots {
    display: none;
}

/* Responsive tweaks */
@media screen and (max-width: 880px) {
    #graceful-inspire-slider-1 .graceful-inspire-slider-1-slide {
        height: 480px;
    }

    #graceful-inspire-slider-1 .graceful-inspire-slider-1-slide-inner {
        padding: 30px 24px 70px;
    }

    #graceful-inspire-slider-1 .graceful-inspire-slider-1-slide-content {
        max-width: 100%;
    }

    #graceful-inspire-slider-1 .graceful-inspire-slider-1-title {
        font-size: 28px;
    }

    #graceful-inspire-slider-1 .graceful-inspire-slider-1-nav {
        right: 18px;
        bottom: 16px;
    }

    #graceful-inspire-slider-1 .graceful-inspire-slider-1-nav::before {
        right: -18px;
        bottom: -16px;
        width: 170px;
        height: 170px;
    }
}

@media screen and (max-width: 480px) {
    #graceful-inspire-slider-1 .graceful-inspire-slider-1-slide {
        height: 420px;
    }

    #graceful-inspire-slider-1 .graceful-inspire-slider-1-slide-inner {
        padding: 20px 16px 64px;
    }

    #graceful-inspire-slider-1 .graceful-inspire-slider-1-slide-content {
        padding: 22px 20px 24px;
    }

    #graceful-inspire-slider-1 .graceful-inspire-slider-1-title {
        font-size: 24px;
    }

    #graceful-inspire-slider-1 .graceful-inspire-slider-1-nav {
        right: 14px;
        bottom: 12px;
    }

    #graceful-inspire-slider-1 .graceful-inspire-slider-1-nav::before {
        right: -14px;
        bottom: -12px;
        width: 160px;
        height: 160px;
    }
}

.graceful-inspire-category-title {
    margin-bottom: 20px;
    border: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
    display: inline-block;
    padding-bottom: 1px;
    text-align: left;
    width: 100%;
    font-size: 18px;
    font-family: 'Open Sans';
    padding: 4px 13px 5px;
    text-transform: uppercase;
    background: #000000;
    color: #ffffff !important;
    letter-spacing: 1px;
}