/*
Theme Name: Shera Blog
Theme URI: http://shadowthemes.com/downloads/shera-blog/
Template: dreshion-blog
Author: Sensational Theme
Author URI: http://shadowthemes.com/
Description: Shera Blog is a modern WordPress theme that comes with high-quality features and minimal design. The theme is a perfect fit for all kind of blogs such as food blogs, travel journals, personal blogs many more. Shera Blog is a fully responsive design that always remains mobile-friendly and will render perfectly on all devices. You also get support for custom headers, two column layout, full-width layout, and tons of easy customization options.
Tags: translation-ready,custom-background,theme-options,custom-menu,threaded-comments,featured-images,footer-widgets,editor-style,right-sidebar,full-width-template,two-columns,grid-layout,custom-colors,custom-header,custom-logo,featured-image-header,blog,entertainment
Version: 577.0.1
Tested up to: 6.4
Requires PHP: 5.6
Text Domain: shera-blog
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Shera Blog business is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

*/

body {
    margin: 0;
    font-family: 'Raleway', serif;
    font-weight: 400;
    background-color: #f4ebeb;
    font-size: 18px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    clear: both;
    color: #333;
    margin: 16px 0;
    line-height: 1.3;
    font-weight: 400;
    font-family: 'Bad Script', cursive;
}
.overlay{
    opacity: 0.3;
}
.shadow-entry-subtitle {
  font-size: 18px;
}
#featured-slider article .shadow-entry-title a{
    line-height: 60px;
}

.f-content-center .featured-content-wrapper {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    max-width: 650px;
    border-radius: 30px;
    padding:40px; 
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    background: rgba(0, 0, 0, 0.6);
    margin: 0 auto;
    text-align: center;
}
a,
.secondary-menu a:hover,
.secondary-menu a:focus,
.secondary-menu ul.menu li.current-menu-item > a,
.main-navigation a:hover,
.main-navigation a:focus,
.pagination .page-numbers.current,
.pagination a.page-numbers:hover,
.pagination a.page-numbers:focus,.widget_popular_post h3 a:hover,
.widget_popular_post h3 a:focus,
.widget_popular_post a time,
.widget_popular_post time,
#secondary ul li a:hover,
#secondary ul li a:focus,
.nav-links a:hover,
.nav-links a:hover svg,
#related-posts .shadow-entry-title a:hover,
#related-posts .shadow-entry-title a:focus,
#related-posts ul.post-categories li a:hover,
#related-posts ul.post-categories li a:focus,
.comment-meta .url:hover,
.comment-meta .url:focus,
ul.trail-items li.trail-item.trail-end,
ul.trail-items li.trail-item.trail-end,
ul.trail-items li a:hover,
ul.trail-items li a:focus,
#features .shadow-entry-title a:hover,
#features .shadow-entry-title a:focus,
.hover-default .post-archive article .shadow-entry-container .shadow-entry-title a:hover,
.hover-default .post-archive article .shadow-entry-container .shadow-entry-title a:focus,
article .shadow-entry-title a:hover,
article .shadow-entry-title a:focus,
.hover-2 .shadow-entry-header h1 a:hover,
.hover-2 .shadow-entry-header h2 a:hover,
.hover-2 .shadow-entry-header h3 a:hover,
.hover-2 .shadow-entry-header h4 a:hover,
.hover-2 .shadow-entry-header h5 a:hover,
.hover-2 .latest-featured .shadow-entry-header h2 a:hover,
.hover-3 .shadow-entry-header h3 a:hover,
.hover-3 .shadow-entry-header h2 a:hover,
.hover-3 .shadow-entry-header h3 a:hover,
.hover-3 .shadow-entry-header h4 a:hover,
.hover-3 .shadow-entry-header h5 a:hover,
.hover-3 .latest-featured .shadow-entry-header h2 a:hover,
.footer-widgets-area .widget ul li a:hover,
.site-title a:hover,
.featured-content-wrapper span.posted-on time,
.cat-links a,
#list-articles .shadow-entry-container .more-link,
#must-read .shadow-entry-title a:hover, 
#must-read .shadow-entry-title a:focus,
#featured .posted-on a,
.cat-links a,
.shadow-entry-subtitle,
#popular .shadow-entry-title a:hover, 
#popular .shadow-entry-title a:focus,
#featured .shadow-entry-title a:hover, 
#featured .shadow-entry-title a:focus,
.shadow-popular-news article .shadow-entry-title a:hover, 
.shadow-popular-news article .shadow-entry-title a:focus,
.blog #secondary span.posted-on a:hover, 
.blog #secondary span.posted-on time:hover, 
.archive #secondary span.posted-on a:hover, 
.archive #secondary span.posted-on time:hover, 
.search #secondary span.posted-on a:hover, 
.search #secondary span.posted-on time:hover,
span.posted-on a:hover, 
span.posted-on time:hover,
.dark-layout #must-read .shadow-entry-title a:hover,
.dark-layout #must-read .shadow-entry-title a:focus,
.dark-layout #message .shadow-entry-title a:hover,
.dark-layout #message .shadow-entry-title a:focus,
.dark-layout a:hover,
.dark-layout a:focus,
.dark-layout #must-read .shadow-entry-title a:hover, 
.dark-layout #must-read .shadow-entry-title a:focus, 
.dark-layout .main-navigation a:hover, 
.dark-layout .main-navigation a:focus,
.dark-layout #secondary ul li a:hover,
.dark-layout #secondary ul li a:focus,
.dark-layout .menu-item p,
#trending article .shadow-entry-title a:hover,
#featured-slider article.half-image .half-content-wrapper .shadow-entry-title a:hover,
#featured-slider article.half-image .half-content-wrapper .shadow-entry-title a:focus {
    color: #cf3140;
}

.main-navigation ul.nav-menu > li > a.search:hover svg.icon-search,
.main-navigation ul.nav-menu > li > a.search:focus svg.icon-search,
.nav-links a:hover,
.nav-links a:hover svg,
.btn svg{
  fill: #cf3140;
}

@media screen and (min-width: 1024px) {
  .modern-menu .main-navigation ul#primary-menu ul li.current-menu-item > a, 
  .modern-menu .main-navigation ul#primary-menu ul li:hover > a, 
  .modern-menu .main-navigation ul#primary-menu ul li:focus > a,
  .main-navigation ul#primary-menu ul li.current-menu-item > a {
    color: #cf3140;
  }
}

/*----------------------------------------
  Background Color
------------------------------------------*/
 .totop,
 form.search-form button.search-submit, 
 .widget_search form.search-form button.search-submit,
 input[type="submit"]:hover,
input[type="submit"]:focus,
.reply a:hover,
.reply a:focus,
.featured-content-wrapper .btn,
#featured-posts article:hover .featured-item-wrapper:after,
#featured-posts article .cat-links a,
#message .separator,
.popup-video:hover,
.slick-prev, 
.slick-next,
.slick-dots li button,
.btn-hover-6 .btn:before,
.btn-hover-6 .featured-content-wrapper .btn:before,
.btn,
#featured-collection article .popup:hover,
#featured-collection .cat-links a:hover,
 #featured-collection .cat-links a:focus,
.entry-meta.shadow-posted,
.wp-block-search__button,
.dark-layout .totop {
  background-color: #cf3140;
}

.pagination .page-numbers, 
.pagination .page-numbers {
  background-color: #eee;
}

:root {
    --mainColor: #cf3140;
  }

@media screen and (min-width: 1024px) {
  .main-navigation ul.sub-menu li:hover > a,
  .main-navigation ul.sub-menu li:focus > a,
  #top-menu ul.sub-menu li:hover > a,
  #top-menu ul.sub-menu li:focus > a {
    background-color: #cf3140;
  }
}

/*----------------------------------------
  Border Color
------------------------------------------*/

#respond input[type="submit"]:hover,
#respond input[type="submit"]:focus,
.pagination a.page-numbers:hover,
.pagination a.page-numbers:focus,
.post-categories li::before,
.post-categories li::after,
.wp-block-search__button,
#featured-collection .cat-links a:hover,
#featured-collection .cat-links a:focus {
  border-color: #cf3140;
}
.main-navigation ul.sub-menu,
#top-menu ul.sub-menu,
.entry-meta.shadow-posted {
  border-top-color: #cf3140;
}
#message .shadow-entry-header:before{
  border-right-color: #cf3140;
}

@media screen and (min-width: 1024px) {
    .main-navigation ul ul {
        border-top-color: #cf3140;
    }
    .main-navigation ul.nav-menu > li.menu-item-has-children:hover > a:after {
        border-bottom-color: #cf3140;
    }
}
@media screen and (max-width: 1023px) {
    .main-navigation ul.sub-menu,
    #top-menu ul.sub-menu {
        border-top-color: #cf3140;
    }
}
.main-navigation .current-menu-item a,
.main-navigation a:focus{
  color: #cf3140;
}
.main-navigation a:hover,
.menu-item a:hover {
  color: #fff;
  background-color: #cf3140;
}
.site-branding img {
  max-width: 80%;
}
.header-social .social-menu svg {
  fill: #cf3140;
}
.main-navigation a::after {
  content: ".";
  color: #cf3140;
  font-size: 24px;
}