/*
Theme Name: Blogger Era Plus
Theme URI: http://96themes.com/downloads/blogger-era-plus/
Author: 96 Themes
Author URI: http://96themes.com
Description: Blogger Era Plus is child theme of Blogger Era. Blogger Era is a  Responsive Blogger Template, it is clean and compatible with many devices, It’s perfect for creating your  blog, no need to coding as it is very customizable.
Version: 1.0.1
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Template: blogger-era
Text Domain: blogger-era-plus
Tags: translation-ready,custom-background,theme-options,custom-menu,threaded-comments,blog,education,news,custom-logo,right-sidebar,left-sidebar,custom-header,rtl-language-support,post-formats,featured-images,featured-image-header

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.

*/


.global-layout-no-sidebar .wp-block-columns.is-background-enabled {
    background: #B3D4EB;
    position: relative;
    padding-top: 80px;
    padding-bottom: 50px;
}

.global-layout-no-sidebar .wp-block-columns.is-background-enabled:after {
    content: "";
    width: 100vw;
    height: 100%;
    background: #B3D4EB;
    position: absolute;
    top: 0;
    right: -100vw;
    visibility: visible;
}

.global-layout-no-sidebar .wp-block-columns.is-background-enabled:before {
    content: "";
    width: 100vw;
    height: 100%;
    background: #B3D4EB;
    position: absolute;
    top: 0;
    left: -100vw;
    visibility: visible;
}
.bottom-header,
.offcanvas .widget-title, .widget-area .widget-title,
.back-to-top,
.botton-footer,
.widget.widget-post-author{
	background-color: #4267b2;
}
.site-footer{
  background-color: #fff;
}

.main-navigation a{
	color: #FFF;
}
.blog-post-wrapper {
    box-shadow: 0 0 0 rgba(0, 0, 0, 0.1);
    border: 1px solid #e9e6e6;
    display: block;
    float: left;
    margin: 15px auto 30px;
    padding: 15px;
    text-align: center;
    transform: translate(0, 0);
    position: relative;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
}
.blog-post-wrapper:before{
    position: absolute;
    z-index: -1;
    content: '';
    top: 100%;
    left: 5%;
    height: 10px;
    width: 90%;
    opacity: 0;
    background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
    background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: transform, opacity;
    transition-property: transform, opacity;
    pointer-events: none;
}
.blog-post-wrapper:after{
    position: absolute;
    content: '';
    height: 3px;
    width: 100%;
    left: 0;
    bottom: 0;
    background-image: linear-gradient(to right top, #4267b2, #4267b2, #4267b294, #ffffff, #ffffff);
    transition: .5s ease;
}
.popular-section-wrapper,
.widget-area .widget{
  box-shadow:0 0 0px rgba(0,0,0,0.1);
  border: 1px solid #e9e6e6;
}
.blog-post-wrapper:hover:before {
    opacity: 1;
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
}
.blog-post-wrapper:hover{
    opacity: 1;
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
}

.back-to-top{
  -webkit-animation: pulse 2s infinite;
  -o-animation: pulse 2s infinite;
  animation: pulse 2s infinite;
}
@keyframes pulse {
0%{
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
}
50%{
-webkit-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
100%{
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
}

}
.single .post-thumbnail{
  position: relative;
}

.woocommerce-product-search button, .search-form .search-submit {
    background-color:#4267b2;
}
.author-intro a{
    color: #fff;
}
.author-intro a:hover{
    color: #B3D4EB;
}

.site-main .entry-title h2{
    color: #191919;
}
.entry-meta .byline{
    border-right: none; 
}
p.site-title a, 
.contact-form-wrap .wpcf7 input[type="submit"], 
.quick-contact-info p span, 
.comments-area input[type="submit"], 
.navigation a, 
.author-intro, 
.author-intro a, 
.site-footer .quick-menu li a, 
.author-name, 
.btn, .entry-meta, 
.main-navigation li a, 
h1, h2, h3, h4, h5, h6{
    font-style: normal;
}

.cat-links a:before {
   font-family: "FontAwesome";
   content: "\f07c";
   display: inline-block;
   padding-right: 5px;
   vertical-align: middle;
}
.posted-on a:before {
   font-family: "FontAwesome";
   content: "\f274";
   display: inline-block;
   padding-right: 5px;
   vertical-align: middle;
}
.main-navigation .page_item_has_children:before, 
.main-navigation .menu-item-has-children::before,
.offcanvas-toggle:before, 
.toggle-search-icon::before{
  color: #fff;
}
.main-navigation ul li ul li a:hover, 
.main-navigation ul li ul li:hover > a, 
.main-navigation ul li.current-menu-item ul li a:hover, 
.menu-top-menu-container ul li ul li a:hover, 
.menu-top-menu-container ul li ul li:hover > a, 
.menu-top-menu-container ul li.current-menu-item ul li a:hover{
  background-color: #4267b2;
}
.botton-footer{
  clear: both;
  padding: 20px 0;
}
.footer-widget-area h2{
  margin: 0;
}

/*Add*/
.home .widget-area > .theiaStickySidebar > .widget,
.home .widget-area > .widget{
  margin-top: 30px;
}
.widget-area > .theiaStickySidebar > .widget,
.widget-area > .widget{
  margin-top: 0;
}

.blog-post-wrapper figure{
  position: relative;
}
.blog-post-wrapper figure:after{
  position: absolute;
  content: "";
  left: 50%;
  right: 50%;
  bottom: 0;
  top: 0;
  display: block;
  background: rgba(0,0,0, 0.4);
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 900ms ease;
  -moz-transition: all 900ms ease;
  -o-transition: all 900ms ease;
  -ms-transition: all 900ms ease;
  transition: all 900ms ease;
}
.blog-post-wrapper:hover figure:after{
    opacity: 1;
    visibility: visible;
    left: 0;
    right: 0;
}
.btn{
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  position: relative;
  background: #fff;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  }   
.btn:before{
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #4267b2;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 50%;
  transform-origin: 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.btn:hover,
.btn:focus,
.btn:active{
color: #fff;
}
.btn:hover:before,
.btn:focus:before,
.btn:active:before{
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}
.popular-wrapper figure:after{
  border-right: 1px solid #fff;
  border-left: 1px solid #fff; 
  -webkit-transform: scale(1,0);
    -ms-transform: scale(1,0);
    -o-transform: scale(1,0);
    transform: scale(1,0);
}

.popular-wrapper figure:before{
  border-top: 1px solid #fff;
  border-bottom: 1px solid #fff;
  -webkit-transform: scale(0,1);
  -ms-transform: scale(0,1);
  -o-transform: scale(0,1);
  transform: scale(0,1);
}
.popular-wrapper figure:after,
.popular-wrapper figure:before{
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.popular-wrapper figure:after,
.popular-wrapper figure:before{
-webkit-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
}
.caption{
  width: 50%;
  padding: 32px;
}