/*
Theme Name: Graceful Chic Blog
Theme URI: https://optimathemes.com/graceful-chic-blog-theme/
Author: Aslam
Author URI: http://optimathemes.com/
Description: Graceful Chic Blog is a versatile, free WordPress theme designed for a wide range of blogs and websites. Whether you're creating content about lifestyle, fashion, travel, technology, health, fitness, beauty, food, or news, this theme offers a clean, modern, and minimalistic design. Fully responsive and Retina-ready, it ensures optimal performance on all devices. Graceful Chic Blog is also WooCommerce compatible, making it ideal for online stores. With RTL (Right to Left) language support and SEO optimization, this theme provides everything needed to grow your personal or professional blog.
Template: graceful
Version: 1.0.3
Requires at least: 5.3
Tested up to: 6.6
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-chic-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
--------------------------------------------------------------*/

.entry-header {
    background: #ffffff;
    border-bottom: 1px solid #000000;
}

.site-branding a {
    color: #000000;
}

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

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

.post-categories a {
    color: #282828 !important;
}

aside .graceful-widget h2 {
    background: #000;
    color: #ffffff !important;
}

.blog .post-title {
    font-size: 28px;
    line-height: 38px;
}

.blog article .post-meta {
    margin-bottom: 10px;
}

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

#main-navigation i {
    color: #ffffff;
}

.graceful-widget .widget-title {
    background: #282828;
    border-bottom: 1px solid #000000;
    font-weight: 600;
    padding: 9px 5px 7px;
}

#graceful-post-slider .owl-stage-outer:after {
    background: #282828;
}

#graceful-post-slider .owl-nav {
    background-color: #282828;
}

#graceful-post-slider .owl-prev span, #graceful-post-slider .owl-next span {
    color: #ffffff;
}

#graceful-post-slider .owl-prev::after, #graceful-post-slider .owl-next::after {
    background: #ffffff;
}

.continue-read a {
    background: #282828;
    color: #ffffff !important;
    text-decoration: none;
    text-transform: none;
    font-weight: normal;
    line-height: 36px;
    padding: 0 24px;
}

aside .graceful-widget h2::after, 
.graceful-widget .widget-title::after {
    border-top: 8px solid #282828 !important;
}

.graceful-widget .widget-title::after {
    border-top: 8px solid #282828 !important;
}

.post-categories {
    background: #ffffff !important;
    border: 1px solid #282828;
    display: inline-block;
    margin-bottom: 10px;
    padding: 0 12px;
}

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

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

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

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

.site-images {
    min-height: 0;
}


.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 {
    font-family: 'Mulish', sans-serif;
    font-size: 13px;
}

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

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

@media screen and (max-width: 768px) {
    .main-navigation-search {
        right: 20px;
    }
}

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

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

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

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

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

#top-menu a:focus {
  outline: 3px dotted #666666 !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 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 #616161;
  border-width: 1px;
  opacity: 0;
}

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

#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;
}

#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: #000000;
}

#main-navigation #searchform #s {
    border: 1px solid #bdb29b;
}

#main-navigation a:hover, #main-navigation i:hover {
    color: #dddddd;
}

#site-menu > li > a:hover{
    color: #dddddd;
}

#site-menu > li > a {
    color: #ffffff;
}

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

.widget_categories > ul > li {
    border-bottom: 1px solid #dddddd;
}

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 {
        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;
}


#site-footer {
    border-top: 1px solid #999999;
}


#site-footer .graceful-widget .widget-title {
    color: #ffffff !important;
    padding: 2px 0 1px;
}

@media screen and (min-width: 768px) {
    
    .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-widget .graceful-recent-image-box a {
    font-size: 14px;
}


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

.left-menu-icon span {
    background-color: #ffffff;
}

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

#responsive-menu li a {
    color: #ffffff;
}

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

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

@media screen and (max-width: 480px) {
    .main-navigation-search {
        right: 20px;
    }
}

.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;
}

.recentcomments a  {
    text-decoration: underline;
}