/*
Theme Name: Online Flower Shop
Theme URI: https://www.buywpthemes.net/products/free-flower-shop-wordpress-theme/
Author: Peccular
Author URI: https://www.buywpthemes.net/
Description: Flower Shop WordPress Theme is for people in the business of flowers whether is growing flowers, supplying flowers or people who have flower shops through which they sell flowers and flower decoration contracts for different occasions. Flower Shop WordPress theme is a woo-commerce ready modern fascinating & clean theme; curated post an afterthought to enable and empower entrepreneurs to showcase their business related to floral studio. This theme can be used for flower shop agency, flowers boutique, flower store or their business related to selling of flora, workshops related to floristic hobbies; the charming theme even suits people who are growing gardens and flowers in their apartment and wish to share their story with other Netizens with similar interests. Flower Shop WordPress theme even works well for a floral blog for people who want to build a community ahead of launching flower business.  It is quick to download and easy to install. It is designed to be compatible with all devices and browsers. Whether your visitor reaches your shop via mobile phone or orders flowers from his laptop, you can rest assure that it will be a seamless and pleasant shopping experience for your client. Flower Shop WordPress theme is an all-inclusive one page podium that will help flower shop owners to display and share all the important information that a potential client may seek in order to do business with you. The page is divided into distinct sections. Through each section you can communicate vital information with your visitor. The objective behind dividing the page into sections is to share knowledge, thereby creating your image as that of an informed flower shop owner who is professional in his/her dealings and understands the importance of a job well done!  Flower Shop WordPress Theme is so attractive that once your potential customer reaches your online shop, he will be compelled to take action. 
Version: 0.1.9
Tested up to: 5.8
Requires PHP: 5.6
License: GPLv3 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: online-flower-shop
Slug: online-flower-shop
Tags: one-column, two-columns, left-sidebar, right-sidebar, flexible-header, custom-background, custom-colors, custom-header, custom-menu, featured-image-header, featured-images, footer-widgets, full-width-template, theme-options, threaded-comments, translation-ready, blog, grid-layout, portfolio, photography

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.
*/

.waves {
    position: absolute;
    width: 100%;
    height: 31vh;
    margin-bottom: -7px;
    min-height: 100px;
    max-height: 150px;
    bottom: 0;
}
.m-rl{margin-right: 0;margin-left: 0}

.headfer-content{
    position: relative;
    background-image: url(assets/images/headerimg.png) !important;
    background-repeat: no-repeat;
    background-size: cover;
}
.headfer-content:brfore {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #fff;
    opacity: 0.2;
}
.hero-slider .sliderimg{
    padding: 29px 0px 0px 57px;
    background: #E7DB13;
    margin: 0;
    width: 920px;
    height: 700px;
    right: 108px;
    top: 0px;
    z-index: 0;
    position: relative;
    -webkit-mask-position: center center;
    mask-position: center center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask-size: 100%;
}
.hero-slider .sliderimg img{
    -webkit-mask-position: center center;
    mask-position: center center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100%;
    mask-size: 100%;
    width: 920px;
    height: 640px;
}
#slider-section .slideinning{
    position: absolute;
    top: -25%;
    bottom: 15%;
    left: -25%;
    right: 64%;
    border-radius: 0 0 1500px 1500px;
}

.slideinning:after {
    content: "";
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    border:10px solid #494747;
    border-top: none;
    border-left: none;
    opacity: 1;
    border-radius: 0 0 1500px 1500px ;
}
#service-section {
    background-repeat: no-repeat;
    background-size: cover;
}
#blog-section {
    background-repeat: no-repeat;
    background: #000;
    background-size: cover;
}
.breadcrumb-section{
    position: relative;
    width: 100%;
    padding: 11em 0 3em 0;
    background-image: #df8d9c;
}
.breadcrumb-section .headoly {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.footer-area {
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    display: block;
    overflow: initial;
    z-index: 1;
    padding:4em 0 0em 0;
    background-repeat: no-repeat;
}
.footer-area .f-oly{
    position: absolute;
    left: 0;
    right: 0;
    top:0;
    bottom: 0;
    background:#df8d9c;
    opacity: ; 
      z-index: -1; 
}
.footer-area .f-innbx {
    position: relative;
    padding: 0em 2em 0em 2em;
    margin: 0px 0 1em 0;
}
/* Animation */
.parallax > use {
  animation: move-forever 25s cubic-bezier(.55,.5,.45,.5)     infinite;
}
.parallax > use:nth-child(1) {
  animation-delay: -2s;
  animation-duration: 7s;
}
.parallax > use:nth-child(2) {
  animation-delay: -3s;
  animation-duration: 10s;
}
.parallax > use:nth-child(3) {
  animation-delay: -4s;
  animation-duration: 13s;
}
.parallax > use:nth-child(4) {
  animation-delay: -5s;
  animation-duration: 20s;
}
@keyframes move-forever {
  0% {
   transform: translate3d(-90px,0,0);
  }
  100% { 
    transform: translate3d(85px,0,0);
  }
}
/*Shrinking for mobile*/
@media (max-width: 768px) {
  .waves {
    height:40px;
    min-height:40px;
  }
}
.recentcomments a {
    display: inline-block !important;
    padding-left: 18px !important;
    margin: 0 !important;
}

.slider-img-overlay {
    position: absolute;
    left: 0;
    right: 52.5%;
    top: 0;
    bottom: 0;
    background: #161415;
    opacity: 1;
    clip-path: polygon(0 0, 67% 0, 100% 100%, 0% 100%);
}
.slider-img-overlay-outer {
    position: absolute;
    left: 0;
    right: 50%;
    top: 0;
    bottom: 0;
    background: #fff;
    opacity: 1;
    clip-path: polygon(0 0, 68% 0, 100% 100%, 0% 100%);
}
@media (max-width: 991px) {
.slider-img-overlay-outer {
    right: 35%;
}
@media (max-width: 767px) {
    .about-banner-text {width: 100%;}
    .breadcrumb-section .headoly { right: 1% !important;}
}
.slider-img-overlay {
    right: 38.5%;
}

}