.twbs {
    font-family: "Open Sans", sans-serif;
    font-weight: 400;
    line-height: 1.875;
    color: #333;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    iframe {
        border: none;
    }

    a,
    b,
    div,
    ul,
    li {
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
        -webkit-tap-highlight-color: transparent;
        -moz-outline-: none;
    }

    a:focus,
    a:active,
    input,
    input:hover,
    input:focus,
    input:active,
    textarea,
    textarea:hover,
    textarea:focus,
    textarea:active {
        -moz-outline: none;
        outline: none;
    }

    img:not([draggable]),
    embed,
    object,
    video {
        max-width: 100%;
        height: auto;
    }

    a {
        text-decoration: none;
        outline: 0;
    }

    a:active,
    a:focus,
    a:hover,
    a:visited {
        text-decoration: none;
        outline: 0;
    }

    img {
        border: none;
        max-width: 100%;
    }

    ul, li {
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .clear-both:before,
    .clear-both:after {
        display: table;
        content: "";
        clear: both;
    }

    button:focus {
        outline: none;
    }

    /*=================================================
    2. top bar info
==============================================================*/

    .topbar-info-area,
    .info-mobile-version {
        color: #ffffff;
        background: #3d3d3d;
    }

    .topbar-info-area .info-list,
    .info-mobile-version .info-list {
        padding: 24px 0;
    }

    .topbar-info-area .info-list > li:not(:last-child),
    .info-mobile-version .info-list > li:not(:last-child) {
        margin-bottom: 15px;
    }

    .topbar-info-area .info-list > li a,
    .info-mobile-version .info-list > li a {
        color: #ffffff;
    }

    .info-mobile-version {
        display: none;
    }

    .info-mobile-version .info-list {
        padding: 10px 0;
    }

    .info-mobile-version .info-list > li i {
        color: #ffffff;
    }

    .nav-logo-wraper {
        text-align: center;
    }

    /*=================================================
    3. top bar content
==============================================================*/

    .topbar-area {
        color: #ffffff;
    }

    .topbar-area .row [class*=col-] + [class*=col-] {
        text-align: right;
    }

    .topbar-area .lists > li:not(:last-child) {
        margin-bottom: 0px;
    }

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

    .topbar-menu > li > a:hover {
        color: rgba(255, 255, 255, 0.8);
    }

    .topbar-menu > li:not(:last-child) a {
        border-right: 1px solid #fe9357;
        padding-right: 21px;
        margin-right: 21px;
    }

    .topbar-content,
    .topbar-menu > li > a {
        padding: 5px 0;
    }

    /*=================================================
    4. main menu
==============================================================*/
    /* menu default style reset */

    .main-menu {
        padding: 0px;
    }

    .main-menu .navbar-nav .nav-item {
        padding: 0px;
    }

    .main-menu .navbar-nav .nav-item .nav-link {
        padding: 25px 0;
    }

    .main-menu .navbar-nav > li:not(:last-child) {
        margin-right: 30px;
    }

    .main-menu .navbar-nav > li > a {
        font-size: 1rem;
        font-weight: 700;
        letter-spacing: 1px;
        color: #3d3d3d;
    }

    .main-menu .navbar-nav > li > a:hover {
        color: #0000ff;
    }

    .main-menu .navbar-nav > li.active > a {
        color: #0000ff;
    }

    .navbar-text > li:not(:last-child) {
        margin-right: 36px;
    }

    .navbar-text > li > a {
        color: #222222;
        font-size: 1.5rem;
        position: relative;
    }

    .footer-menu {
        padding: 0px;
    }

    .footer-menu .main-menu {
        width: 100%;
    }

    .footer-menu .navbar-nav {
        width: 100%;
        justify-content: space-between;
    }

    .footer-menu.primary-bg .navbar-nav > li > a {
        color: #ffffff;
    }

    .dropdown {
        border: 0px;
    }

    .dropdown:hover {
        border: 0px;
    }

    .dropdown:hover > .dropdown-menu {
        border: 0px;
        opacity: 1;
        visibility: visible;
        transform: translateY(0px);
    }

    .dropdown > .dropdown-toggle:active {
        pointer-events: none;
    }

    .dropdown-menu {
        display: block;
        opacity: 0;
        visibility: hidden;
        transition: all 0.4s ease;
        margin: 0;
        border-radius: 0;
        min-width: 250px;
        transform: translateY(50px);
        padding: 0;
    }

    .dropdown-menu .nav-item:not(:last-child) {
        border-bottom: 1px solid #ededed;
    }

    .dropdown-menu .nav-item > a {
        font-size: 0.9375rem;
        font-weight: 500;
        color: #444;
        padding: 8px 20px;
    }

    .dropdown-menu .nav-item > a:hover {
        color: #0000ff;
        background: #ededed;
    }

    .dropdown-menu .nav-item.active > a {
        color: #0000ff;
        padding: 8px 25px;
    }

    .dropdown-menu .dropdown-item:active {
        background-color: #f7f7f7;
    }

    .header-area {
        box-shadow: 0px 5px 7px 0px rgba(0, 0, 0, 0.05);
    }

    .header-area.stick {
        position: fixed;
        left: 0;
        right: 0;
        z-index: 991;
        background: rgba(255, 255, 255, 0.9);
        width: 100%;
        top: 0;
        transition: 0.5 0.4s ease;
    }

    /*=================================================
    5. banner content
==============================================================*/

    .banner-slider .owl-item.active .banner-content .banner-sub-title,
    .banner-slider .owl-item.active .banner-content .banner-title {
        animation-duration: 1s;
        animation-timing-function: ease;
        animation-fill-mode: both;
    }

    .banner-slider .owl-item.active .banner-content .banner-title {
        animation-delay: .5s;
    }

    .banner-slider .owl-item.active .banner-content.text-center .banner-sub-title,
    .banner-slider .owl-item.active .banner-content.text-center .banner-title {
        animation-name: inDown;
    }

    .banner-slider .owl-item.active .banner-content.text-left .banner-sub-title,
    .banner-slider .owl-item.active .banner-content.text-left .banner-title {
        animation-name: inLeft;
    }

    .banner-slider .owl-item.active .banner-content.text-right .banner-sub-title,
    .banner-slider .owl-item.active .banner-content.text-right .banner-title {
        animation-name: inRight;
    }

    .banner-slider .owl-item.active .banner-content .btn-wraper .btn {
        animation: inLeft 1.5s ease both;
    }

    .banner-slider .owl-item.active .banner-content .btn-wraper .btn + .btn {
        animation-name: inRight;
        animation-delay: 1s;
    }

    @keyframes inDown {
        from {
            opacity: 0;
            transform: translate3d(0, -100px, 0);
        }
        to {
            opacity: 1;
            transform: none;
        }
    }
    @keyframes inLeft {
        from {
            opacity: 0;
            transform: translate3d(-100px, 0, 0);
        }
        to {
            opacity: 1;
            transform: none;
        }
    }
    @keyframes inRight {
        from {
            opacity: 0;
            transform: translate3d(100px, 0, 0);
        }
        to {
            opacity: 1;
            transform: none;
        }
    }

    .banner-area, .banner-single-slider {
        min-height: 800px;
    }

    .banner-single-slider {
        position: relative;
        display: flex;
        align-items: center;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }

    .banner-content {
        position: relative;
        z-index: 1;
    }

    .banner-content .banner-sub-title, .banner-content .banner-title {
        color: #ffffff;
    }

    .banner-content .banner-sub-title {
        margin-bottom: 40px;
    }

    .banner-content .banner-title {
        margin-bottom: 60px;
    }

    .banner-sub-title {
        font-size: 2.625rem;
        font-family: "Open Sans", sans-serif;
        font-weight: 400;
    }

    /*=================================================
    6. get service tab area
==============================================================*/

    .banner-area + .getservice-area {
        margin-top: -44px;
        position: relative;
        z-index: 1;
    }

    .getservice-tab-wraper .tab-content {
        background-color: #252936;
        padding: 30px;
    }

    .getservice-tab-wraper .form-group {
        margin-bottom: 0px;
    }

    /*=================================================
    7. about content
==============================================================*/

    .about-content .heading-title {
        margin-bottom: 20px;
    }

    .about-content p {
        margin-bottom: 20px;
    }

    .about-content .lists {
        margin-bottom: 30px;
    }

    .about-image .responsive-img {
        display: none;
    }

    /*=================================================
    8. promotion banner
==============================================================*/

    .promotion-banner-area {
        position: relative;
        padding: 100px 0;
    }

    .promotion-banner-area .row [class*=col] + [class*=col] {
        text-align: right;
    }

    .promotion-banner-area .btn-wraper {
        margin-top: 0px;
    }

    .promotion-banner-area.promotion-banner2 .promotion-banner-content .heading-title {
        margin-bottom: 0px;
        line-height: 1.583;
    }

    .promotion-banner-area.promotion-banner2 .btn-wraper {
        margin-top: 5px;
    }

    .promotion-banner-content {
        color: #ffffff;
        position: relative;
        z-index: 1;
    }

    .promotion-banner-content .heading-title {
        margin: 15px 0 0;
    }

    /*=================================================
    9. work tab
==============================================================*/

    .work-tab-content .heading-title {
        margin-bottom: 20px;
    }

    .work-tab-content p {
        margin-bottom: 15px;
    }

    .work-tab-content .row {
        margin-bottom: 35px;
    }

    /*=================================================
    10. call to action
==============================================================*/

    .calltoaction-area {
        background-color: #1f1f32;
        color: #ffffff;
        padding: 56px 0;
    }

    .calltoaction-area .heading-title2 {
        margin-bottom: 12px;
    }

    .calltoaction-area p {
        font-size: 1.125rem;
        margin-bottom: 20px;
    }

    /*=================================================
    11. service copntent
==============================================================*/

    .single-service .border-with-fill-icon {
        margin-bottom: 30px;
    }

    .single-service .heading-title {
        margin-bottom: 25px;
    }

    .single-service p {
        margin-bottom: 25px;
    }

    /*=================================================
    12. funfact area
==============================================================*/

    .funfact-area {
        padding: 54px 0;
    }

    .funfact-area.funfact-style2 {
        position: relative;
    }

    .funfact-area.funfact-style2 .single-funfact {
        position: relative;
        z-index: 2;
    }

    .funfact-area.funfact-style2 .single-funfact i, .funfact-area.funfact-style2 .single-funfact h5 {
        color: #ffffff;
    }

    .single-funfact {
        text-align: center;
    }

    .single-funfact i {
        font-size: 3.75rem;
        color: #747474;
        display: block;
        margin-bottom: 25px;
    }

    .single-funfact h5 {
        font-size: 1.125rem;
        margin-bottom: 0px;
        font-weight: 400;
    }

    .funfact-wraper {
        font-size: 2.25rem;
        font-weight: 600;
        color: #0000ff;
        font-family: "Montserrat", sans-serif;
        line-height: 1;
        margin-bottom: 20px;
    }

    /*=================================================
    13. team content
==============================================================*/

    .single-team {
        text-align: center;
    }

    .single-team:hover .image::before {
        opacity: 1;
    }

    .single-team:hover .image .hover-area {
        top: 50%;
        opacity: 1;
    }

    .single-team .image {
        margin-bottom: 15px;
        position: relative;
        border-radius: 50%;
        overflow: hidden;
    }

    .single-team .image::before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        transition: all 0.4s ease;
        opacity: 0;
    }

    .single-team .image .hover-area {
        position: absolute;
        top: 40%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        text-align: center;
        z-index: 1;
        opacity: 0;
        transition: all 0.4s ease;
    }

    .single-team .image img {
        width: 100% !important;
    }

    .single-team .image-holder {
        position: relative;
        margin-bottom: 25px;
    }

    .single-team .image-holder > img {
        margin-left: auto;
        margin-right: auto;
    }

    .team-content .team-title {
        font-size: 1.25rem;
        color: #222222;
        font-family: "Montserrat", sans-serif;
        font-weight: 600;
        margin-bottom: 8px;
    }

    .team-content .designation {
        color: #0000ff;
        font-size: 1rem;
    }

    .owl-item.center .single-team .image::before {
        opacity: 1;
    }

    .owl-item.center .single-team .image .hover-area {
        top: 50%;
        opacity: 1;
    }

    /* inner page team */

    .inner-page-team .single-team {
        margin-bottom: 33px;
    }

    /*=================================================
    14. testimonials
==============================================================*/

    .single-testimonial {
        width: calc(100% - 350px);
        text-align: center;
        margin-left: auto;
        margin-right: auto;
    }

    .single-testimonial .testimonial-header {
        margin-bottom: 30px;
    }

    .single-testimonial .quote-icon {
        color: #0000ff;
        font-size: 2.25rem;
        display: block;
    }

    .single-testimonial .description {
        font-size: 1rem;
        color: #454545;
        margin-bottom: 18px;
    }

    .single-testimonial .testimonial-avatar {
        height: 90px;
        width: 90px !important;
        border-radius: 50%;
        margin-left: auto;
        margin-right: auto;
    }

    .commentor-details {
        margin-bottom: 30px;
    }

    .commentor-details .commentor-name {
        font-size: 1.125rem;
        color: #222222;
        margin-bottom: 0px;
        font-weight: 600;
    }

    .commentor-details a {
        color: #222222;
        display: inline-block;
    }

    .commentor-details a i {
        color: #0000ff;
        padding-right: 6px;
    }

    /* single testimonial */

    .single-testimonial.testimonial-inner-style {
        width: 100%;
        box-shadow: 0px 3px 20px 0px rgba(0, 0, 0, 0.15);
        padding: 40px 30px;
        min-height: 350px;
        margin-bottom: 30px;
        position: relative;
    }

    .single-testimonial.testimonial-inner-style .description {
        font-size: 0.875rem;
        margin-bottom: 14px;
    }

    .single-testimonial.testimonial-inner-style .testimonial-header {
        margin-bottom: 20px;
    }

    .single-testimonial.testimonial-inner-style .commentor-details {
        margin-bottom: 0px;
    }

    .testimonials-inner-area .row + .row {
        margin-top: 30px;
    }

    .testimonial-grid-item {
        padding: 0 15px;
    }

    .testimonial-grid {
        margin-left: -15px;
        margin-right: -15px;
    }

    /*=================================================
    15. pricing
==============================================================*/

    .single-pricing {
        background-color: #ffffff;
        box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.15);
        position: relative;
    }

    .single-pricing .my-tag {
        display: block;
        width: 70px;
        height: 70px;
        position: absolute;
        right: 0;
        top: 0;
        color: #ffffff;
        font-size: 1.5rem;
        border-left: 35px solid transparent;
        border-right: 35px solid #0000ff;
        border-bottom: 35px solid transparent;
        border-top: 35px solid #0000ff;
        transition: all 0.4s ease;
        opacity: 1;
    }

    .single-pricing .my-tag::before {
        content: "$";
        position: absolute;
        top: -30px;
        right: -20px;
        transform: rotate(-45deg);
    }

    .single-pricing:hover .pricning-header {
        background-color: #0000ff;
    }

    .single-pricing:hover .pricning-header .pricing-icon .back {
        opacity: 1;
        transform: translateY(0%);
    }

    .single-pricing:hover .pricning-header .pricing-icon .front {
        transform: translateY(-150%);
        opacity: 0;
    }

    .single-pricing:hover .btn {
        background-color: rgba(255, 255, 255, 0);
        color: #0000ff;
    }

    .single-pricing:hover .my-tag {
        opacity: 0;
    }

    .pricning-header {
        background-color: #262936;
        padding: 40px;
        color: #ffffff;
        transition: all 0.4s ease;
    }

    .pricning-header .pricing-price {
        position: relative;
        top: 20px;
    }

    .pricning-header .pricing-icon {
        background-image: url(../images/pricing/icon-bg.png);
        background-repeat: no-repeat;
        background-position: center center;
        width: 95px;
        height: 95px;
        margin-bottom: 25px;
        position: relative;
        overflow: hidden;
    }

    .pricning-header .pricing-icon .front {
        position: relative;
        transition: all 0.4s ease;
        transform: translateY(0%);
        opacity: 1;
    }

    .pricning-header .pricing-icon .front i {
        font-size: 3.125rem;
        color: #0000ff;
        line-height: 95px;
    }

    .pricning-header .pricing-icon .back {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        transform: translateY(150%);
        opacity: 0;
        transition: all 0.4s ease;
    }

    .pricning-header .pricing-title {
        font-size: 1.25rem;
        font-family: "Montserrat", sans-serif;
        margin-bottom: 0px;
    }

    .text-center .pricning-header .pricing-icon {
        margin-left: auto;
        margin-right: auto;
    }

    .pricing-body {
        text-align: left;
        padding: 40px;
    }

    .pricing-footer {
        padding-bottom: 40px;
    }

    .pricing-slider .owl-stage-outer {
        padding: 10px;
    }

    .pricing-price {
        color: #0000ff;
        font-size: 1.5rem;
        font-family: "Montserrat", sans-serif;
        font-weight: 500;
    }

    .pricing-price sub {
        display: block;
        font-size: 0.75rem;
        bottom: 0px;
    }

    .pricing-price sup {
        font-size: 0.8125rem;
    }

    .owl-item.center .single-pricing .my-tag {
        opacity: 0;
    }

    .owl-item.center .single-pricing .pricning-header {
        background-color: #0000ff;
    }

    .owl-item.center .single-pricing .pricning-header .pricing-icon .back {
        opacity: 1;
        transform: translateY(0%);
    }

    .owl-item.center .single-pricing .pricning-header .pricing-icon .front {
        transform: translateY(-150%);
        opacity: 0;
    }

    .owl-item.center .single-pricing .btn {
        background-color: rgba(255, 255, 255, 0);
        color: #0000ff;
    }

    /*=================================================
    16. video area
==============================================================*/

    .video-area {
        position: relative;
        text-align: center;
        color: #ffffff;
        padding: 75px 0;
    }

    .video-area .video-wraper a {
        margin-bottom: 12px;
        display: inline-block;
    }

    .video-area .video-wraper h2 {
        font-size: 2.5rem;
        margin-bottom: 15px;
        color: #ffffff;
    }

    /*=================================================
    17. news area
==============================================================*/

    .single-news {
        transition: all 0.4s ease;
    }

    .single-news:hover .entry-header::before {
        opacity: 1;
    }

    .single-news:hover .entry-header .entry-thumb > img {
        transform: scale(1.05);
    }

    .single-news:hover .entry-header .hover-area {
        opacity: 1;
        top: 50%;
    }

    .single-news:hover .entry-content > a {
        color: #0000ff;
    }

    .single-news:hover .entry-content > a:after {
        right: -30px;
        opacity: 1;
    }

    .single-news .entry-header {
        position: relative;
        overflow: hidden;
    }

    .single-news .entry-header::before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        background-color: rgba(0, 0, 0, 0.75);
        transition: all 0.4s ease;
        opacity: 0;
        z-index: 1;
    }

    .single-news .entry-header .entry-thumb > img {
        transform: scale(1);
        transition: all 0.4s ease;
        width: 100%;
    }

    .single-news .entry-header .entry-thumb .video-popup h2 {
        color: #ffffff;
        margin-bottom: 0px;
        font-size: 3rem;
    }

    .single-news .entry-header .hover-area {
        position: absolute;
        top: 40%;
        left: 0%;
        transform: translateY(-50%);
        width: 100%;
        text-align: center;
        z-index: 1;
        transition: all 0.4s ease;
        opacity: 0;
    }

    .single-news .entry-header .entry-meta {
        position: absolute;
        top: -1px;
        left: 0;
        z-index: 2;
    }

    .single-news .entry-header .entry-content > a {
        color: #0000ff;
    }

    .single-news .entry-header .entry-content > a:after {
        right: -30px;
        opacity: 1;
    }

    .single-news .entry-content {
        padding: 30px 0px 0;
    }

    .single-news .entry-content .entry-title {
        line-height: 1.5;
        margin-bottom: 0px;
        font-size: 20px;
    }

    .single-news .entry-content span {
        display: block;
        font-size: 14px;
        margin-bottom: 15px;
    }

    .single-news .entry-content > a {
        display: inline-block;
        color: #333333;
        font-size: 16px;
        transition: all 0.5s ease 0s;
        font-weight: 700;
        position: relative;
    }

    .single-news .entry-content > a:after {
        content: "\f101";
        font-family: fontawesome;
        color: #0000ff;
        font-weight: 600;
        font-size: 16px;
        position: absolute;
        top: 0;
        right: 0px;
        opacity: 0;
        transition: all 0.5s ease 0s;
    }

    .single-news .meta-date {
        color: #ffffff;
        background-color: #0000ff;
        display: inline-block;
        font-size: 0.875rem;
        font-family: "Montserrat", sans-serif;
        font-weight: 500;
        padding: 2px 12px;
    }

    .single-news.news-style2 .entry-content {
        padding: 0px 0 0;
    }

    .single-news.news-style2 .post-meta-list {
        padding: 15px 0;
    }

    .single-news.news-style2 .post-meta-list span {
        display: inline-block;
        padding: 0 0px;
        line-height: 1.3;
    }

    .single-news.news-style2 .post-meta-list span:not(:last-child) {
        border-right: 0px solid #c9c9c9;
        margin-right: 10px;
    }

    .single-news.news-style2 .post-meta-list span:last-child {
        padding-right: 0px;
    }

    .single-news.news-style2 .post-meta-list span > a {
        color: #222222;
    }

    .single-news.news-style2 .post-meta-list span > a:hover {
        color: #0000ff;
    }

    .single-news.news-style2 .post-meta-list span > a > i {
        color: #0000ff;
        padding-right: 7px;
    }

    .single-news.news-style2 .post-meta-list .media-body + .media-body {
        text-align: right;
    }

    .single-news.news-style2 > a {
        display: inline-block;
        color: #333333;
        font-size: 16px;
        transition: all 0.5s ease 0s;
        font-weight: 700;
        position: relative;
    }

    .single-news.news-style2 > a:after {
        content: "\f101";
        font-family: fontawesome;
        color: #0000ff;
        font-weight: 600;
        font-size: 16px;
        position: absolute;
        top: 0;
        right: 0px;
        opacity: 0;
        transition: all 0.5s ease 0s;
    }

    .single-news.post-quote .entry-header::before {
        opacity: 1;
    }

    .single-news.post-quote .entry-header .hover-area {
        top: 50%;
        opacity: 1;
        padding: 0 10px;
    }

    .single-news.post-quote .entry-header .hover-area blockquote {
        color: #ffffff;
    }

    .owl-item.center .single-news .entry-header::before {
        opacity: 1;
    }

    .owl-item.center .single-news .entry-header .entry-thumb img {
        transform: scale(1.05);
    }

    .owl-item.center .single-news .entry-header .hover-area {
        opacity: 1;
        top: 50%;
    }

    .owl-item.center .single-news .entry-content > a {
        color: #0000ff;
    }

    .owl-item.center .single-news .entry-content > a:after {
        right: -30px;
        opacity: 1;
    }

    /* post meta list */

    .post-meta-list {
        padding: 15px 0 0;
    }

    .post-meta-list span {
        display: inline-block;
        padding: 0 0px;
        line-height: 1.3;
    }

    .post-meta-list span:not(:last-child) {
        border-right: 1px solid #c9c9c9;
    }

    .post-meta-list span:last-child {
        padding-right: 0px;
    }

    .post-meta-list span > a {
        color: #222222;
    }

    .post-meta-list span > a:hover {
        color: #0000ff;
    }

    .post-meta-list span > a > i {
        color: #0000ff;
        padding-right: 7px;
    }

    .post-meta-list .media-body + .media-body {
        text-align: right;
    }

    /* inner page blog */

    .inner-page-blog .single-news {
        margin-bottom: 30px;
    }

    /* blog post list */

    .post-list {
        background-color: transparent;
        border-bottom: 0px;
    }

    .post-list:not(:last-child) {
        margin-bottom: 40px;
    }

    .post-list .entry-content {
        padding: 0px;
    }

    .post-list .post-meta-list {
        border-bottom: 0px;
        margin-bottom: 0px;
        padding-left: 0px;
        padding-right: 0px;
    }

    .post-list .entry-content .entry-title {
        font-size: 1.875rem;
        font-weight: 500;
    }

    .post-list .entry-content p {
        margin-bottom: 30px;
    }

    .post-list.post-quote .entry-header .hover-area {
        padding: 0 200px;
    }

    .post-list.post-video .entry-header::before {
        display: none;
    }

    .post-list.post-video .entry-header .entry-thumb iframe {
        display: block;
        height: 480px;
    }

    .post-list.post-audio .entry-header::before {
        display: none;
    }

    .post-list.post-audio .entry-header .entry-thumb iframe {
        height: 200px;
    }

    .post-lists {
        margin-bottom: 60px;
    }

    /*=================================================
    18. cupons area
==============================================================*/

    .single-cupons {
        background-color: #ffffff;
        box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.15);
        padding: 10px;
        position: relative;
        width: calc(100% - 85px);
    }

    .single-cupons::before {
        position: absolute;
        content: "";
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        height: 100%;
        width: calc(100% + 40px);
        background-color: rgba(255, 255, 255, 0.85);
        z-index: 2;
        opacity: 0;
        transition: all 0.4s ease;
    }

    .single-cupons:hover::before {
        opacity: 1;
    }

    .single-cupons:hover .hover-area {
        opacity: 1;
        top: 50%;
    }

    .single-cupons .hover-area {
        position: absolute;
        top: 40%;
        left: 0%;
        width: 100%;
        text-align: center;
        transform: translateY(-50%);
        transition: all 0.4s ease;
        opacity: 0;
        z-index: 3;
    }

    .single-cupons .cupons-wraper {
        border: 1px dashed #0000ff;
        padding: 30px;
    }

    .single-cupons .cupon-header {
        margin-bottom: 30px;
    }

    .single-cupons .cupon-header > div + div {
        text-align: right;
    }

    .single-cupons .cupon-header .cupon-link {
        color: #636363;
        font-size: 0.75rem;
        display: inline-block;
    }

    .single-cupons .cupon-body {
        text-align: center;
    }

    .single-cupons .cupon-body .heading-title {
        font-weight: 500;
        font-family: "Open Sans", sans-serif;
        margin-bottom: 20px;
    }

    .single-cupons .cupon-body .heading-title span {
        color: #0000ff;
    }

    .single-cupons .cupon-body p {
        margin-bottom: 15px;
    }

    .single-cupons .ribbon {
        margin-bottom: 5px;
    }

    .single-cupons .cupon-footer {
        text-align: center;
    }

    .ribbon {
        text-align: center;
        position: relative;
        height: 108px;
        z-index: 1;
    }

    .ribbon .ribbon-inner {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        left: 0;
        width: 100%;
        text-align: center;
    }

    .ribbon h2 {
        margin-bottom: 0px;
        color: #ffffff;
    }

    .ribbon::before {
        position: absolute;
        content: "";
        background-image: url(../images/ribbon-bg.png);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center center;
        top: 0;
        height: 100%;
        width: calc(100% + 120px);
        left: 50%;
        transform: translateX(-50%);
        z-index: -1;
    }

    .cupons-area .row [class*=col-]:nth-child(even) .single-cupons {
        margin-left: auto;
    }

    .cupon-modal .modal-body {
        padding: 30px;
    }

    .cupon-modal .modal-body .single-cupons {
        width: 100%;
    }

    .cupon-modal .modal-body .single-cupons::before {
        display: none;
    }

    .cupon-modal .modal-header {
        border-bottom: 0px solid #3d3d3d;
    }

    .cupon-modal .modal-dialog {
        max-width: 600px;
    }

    .inner-coupons .single-cupons {
        margin-bottom: 50px;
    }

    .cupons-inner-area.section-padding {
        padding-bottom: 50px;
    }

    /*=================================================
    19. client area
==============================================================*/

    .single-client {
        min-height: 200px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    /*=================================================
    20. footer
==============================================================*/

    .footer-section {
        padding-top: 100px;
        padding-bottom: 60px;
    }

    .footer-widget .widget-title {
        margin-bottom: 20px;
    }

    .footer-widget .fotoer-logo {
        margin-bottom: 25px;
    }

    .footer-widget > p {
        margin-bottom: 25px;
    }

    .footer-widget p {
        color: #454545;
    }

    .footer-widget p a {
        color: #0000ff;
        font-weight: 500;
    }

    .footer-widget .copyright p {
        margin-bottom: 0px;
    }

    .footer-widget .copyright p a {
        display: inline-block;
    }

    .footer-widget .info-list > li:not(:last-child) {
        margin-bottom: 10px;
    }

    .footer-widget .info-list > li a {
        color: #454545;

    }

    .footer-widget > .row [class*=col-]:not(:last-child) .info-list {
        padding-right: 20px;
    }

    .footer-widget .soical-list {
        text-align: right;
    }

    .footer-widget .soical-list > li:not(:last-child) {
        margin-right: 10px;
    }

    .footer-widget .soical-list > li > a {
        background-color: transparent;
    }

    .footer-widget.final-widget {
        margin-top: 60px;
    }

    /*=================================================
    21. inner welcome
==============================================================*/

    .inner-welcome {
        text-align: center;
        padding: 52px 0;
    }

    .inner-banner-title {
        font-size: 2.5rem;
        margin-bottom: 0px;
        font-weight: 700;
    }

    .my-breadcumb {
        border-radius: 0px;
        background-color: #ececec;
        justify-content: center;
        margin-bottom: 0px;
        padding: 15px 20px;
    }

    .my-breadcumb .breadcrumb-item {
        font-size: 1rem;
    }

    .my-breadcumb .breadcrumb-item a {
        color: #222222;
        font-weight: 600;
    }

    .my-breadcumb .breadcrumb-item.active {
        color: #0000ff;
        font-weight: 600;
    }

    .my-breadcumb .breadcrumb-item + .breadcrumb-item::before {
        color: #222222;
        content: "\f101";
        font-family: fontawesome;
    }

    /*=================================================
    22. about summary
==============================================================*/

    .about-summary-content .heading-title {
        margin-bottom: 20px;
    }

    .about-summary-content p {
        color: #454545;
    }

    .about-summary-content p:not(:last-child) {
        margin-bottom: 30px;
    }

    /*=================================================
    23. mission and vission
==============================================================*/

    .summary-img {
        position: relative;
        overflow: hidden;
        margin-bottom: 45px;
    }

    .summary-img > img {
        transition: all 0.4s ease;
        transform: scale(1.05);
    }

    .summary-article:hover .summary-img > img {
        transform: scale(1);
    }

    .summary-article .heading-title {
        font-weight: 600;
        margin-bottom: 10px;
    }

    .summary-article p {
        margin-bottom: 25px;
    }

    /*=================================================
    24. work
==============================================================*/

    .single-work {
        position: relative;
        display: block;
    }

    .single-work:hover .work-image > img {
        transform: scale(1);
    }

    .single-work:hover .work-image .hover-area {
        transform: translateY(-50%);
        opacity: 1;
    }

    .single-work:hover::before {
        height: 100%;
    }

    .single-work::before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        height: 0%;
        width: 100%;
        z-index: 2;
        background-color: rgba(0, 0, 0, 0.8);
        transition: all 0.4s ease;
    }

    .single-work .work-image {
        position: relative;
        overflow: hidden;
    }

    .single-work .work-image > img {
        transform: scale(1.05);
        transition: all 0.4s ease;
        width: 100%;
    }

    .single-work .work-image .hover-area {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(0%);
        width: 100%;
        text-align: center;
        transition: all 0.4s ease;
        z-index: 3;
        opacity: 0;
    }

    .work-style2 .single-work::before {
        background-color: rgba(255, 92, 0, 0.85);
    }

    /*=================================================
    25. service block
==============================================================*/

    .service-block-area.section-padding {
        padding-bottom: 65px;
    }

    .single-service-block {
        margin-bottom: 35px;
    }

    .single-service-block .heading-title {
        margin-bottom: 18px;
    }

    .single-service-block > a {
        display: inline-block;
        color: #333333;
        font-size: 16px;
        transition: all 0.5s ease 0s;
        font-weight: 700;
        position: relative;
    }

    .single-service-block > a:after {
        content: "\f101";
        font-family: fontawesome;
        color: #0000ff;
        font-weight: 600;
        font-size: 16px;
        position: absolute;
        top: 0;
        right: 0px;
        opacity: 0;
        transition: all 0.5s ease 0s;
    }

    .single-service-block .service-header {
        position: relative;
        overflow: hidden;
        margin-bottom: 35px;
    }

    .single-service-block .service-header::before, .single-service-block .service-header::after {
        content: "";
        width: 50%;
        height: 100%;
        background: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.8));
        background-repeat: repeat;
        background-size: 30px;
        position: absolute;
        top: 0;
        left: 50%;
        opacity: 0;
        z-index: 1;
        transition: all 0.3s ease 0s;
    }

    .single-service-block .service-header::after {
        left: auto;
        right: 50%;
    }

    .single-service-block .service-header > img {
        transition: all 0.4s ease;
    }

    .single-service-block:hover .service-header::before {
        left: 0;
        opacity: 1;
    }

    .single-service-block:hover .service-header::after {
        right: 0;
        opacity: 1;
    }

    .single-service-block:hover .service-header > img {
        transform: scale(1.2);
        filter: brightness(200%);
    }

    .single-service-block:hover > a {
        color: #0000ff;
    }

    .single-service-block:hover > a:after {
        right: -30px;
        opacity: 1;
    }

    /*=================================================
    26. single service
==============================================================*/

    .service-sidebar-widget {
        background-color: #ffffff;
        box-shadow: 0px 3px 6.65px 0.35px rgba(0, 0, 0, 0.1);
        border: 1px solid #e6e6e6;
        padding: 40px;
        margin-bottom: 40px;
    }

    .service-sidebar-widget .widget-title {
        font-weight: 500;
    }

    .service-sidebar-widget .info-list > li:not(:last-child) {
        margin-bottom: 20px;
    }

    .service-sidebar-widget .info-list .media-body strong {
        display: block;
        font-size: 1.125rem;
        font-weight: 500;
        margin-bottom: 5px;
    }

    .widget-contact {
        padding: 40px 20px;
        background-image: url(../images/contact-widget-bg.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
        position: relative;
    }

    .widget-contact .widget-contact-content {
        position: relative;
        z-index: 5;
    }

    .widget-contact .widget-title {
        text-align: left;
        color: #ffffff;
        margin-bottom: 25px;
        padding: 0px;
    }

    .widget-contact .contact-form textarea {
        height: 200px;
        padding-top: 15px;
    }

    .widget-contact .contact-form .form-group {
        margin-bottom: 8px;
    }

    .widget-contact .contact-form .contact-input-group {
        margin-bottom: 18px;
    }

    /* Service summary */

    .service-summary-details .service-header {
        margin-bottom: 30px;
        position: relative;
        overflow: hidden;
    }

    .service-summary-details .service-header > img {
        transform: scale(1);
        transition: all 0.4s ease;
    }

    .service-summary-details:hover .service-header > img {
        transform: scale(1.02);
    }

    .service-summary-details .heading-title2 {
        margin-bottom: 17px;
        font-size: 1.875rem;
    }

    .service-summary-details p {
        margin-bottom: 19px;
        color: #454545;
    }

    .service-summary-details .lists {
        margin-bottom: 20px;
    }

    .service-shedule-info p {
        font-size: 1rem;
        margin-bottom: 30px !important;
        padding-right: 190px;
    }

    /*=================================================
    27. service rate
==============================================================*/

    .single-rate-of-service {
        position: relative;
        margin-bottom: 30px;
    }

    .single-rate-of-service .image {
        position: relative;
    }

    .single-rate-of-service .image::before {
        position: absolute;
        content: "";
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        background-color: rgba(0, 0, 0, 0.6);
        transition: all 0.4s ease;
        opacity: 0;
    }

    .single-rate-of-service .image .over-cotent {
        position: absolute;
        top: 20px;
        left: 0;
        color: #ffffff;
        background-color: #0000ff;
        border-radius: 0 30px 30px 0;
        height: 60px;
        line-height: 60px;
        z-index: 3;
        padding-left: 26px;
        padding-right: 26px;
    }

    .single-rate-of-service .product-rate {
        font-size: 1.125rem;
    }

    .single-rate-of-service .product-rate span {
        font-size: 1.5rem;
        font-weight: 500;
    }

    .single-rate-of-service .rate-of-product-footer {
        position: absolute;
        bottom: 0;
        left: 0;
        z-index: 2;
        width: 100%;
        background-color: #222222;
        padding: 20px;
        text-align: center;
        transition: all 0.4s ease;
        overflow: hidden;
    }

    .single-rate-of-service .rate-of-product-footer .rate-of-product-title {
        font-size: 1.125rem;
        font-weight: 500;
        font-family: "Open Sans", sans-serif;
        margin-bottom: 0px;
    }

    .single-rate-of-service .rate-of-product-footer .rate-of-product-title a {
        color: #ffffff;
    }

    .single-rate-of-service .rate-of-product-footer .download-icon {
        color: #ffffff;
        position: relative;
        font-size: 1.5rem;
        transform: translateY(-20px);
        opacity: 0;
        transition: all 0.4s ease;
        line-height: 1;
    }

    .single-rate-of-service:hover .image::before {
        opacity: 1;
    }

    .single-rate-of-service:hover .rate-of-product-footer {
        background-color: #0000ff;
    }

    .single-rate-of-service:hover .rate-of-product-footer .download-icon {
        opacity: 1;
        transform: translateY(0px);
    }

    /*=================================================
    28. get start here
==============================================================*/

    .get-start-here-content {
        border: 1px solid #e8e8e8;
        padding: 60px 40px;
    }

    .get-start-here-content .get-start-title {
        font-size: 1.5rem;
        margin-bottom: 22px;
        font-weight: 600;
    }

    .get-start-here-content .description {
        margin-bottom: 30px;
    }

    .get-start-here-content .btn-wraper {
        margin-bottom: 30px;
    }

    .get-start-here-content .get-start-footer-title {
        margin-bottom: 0px;
        font-size: 1rem;
        font-weight: 400;
        font-family: "Open Sans", sans-serif;
    }

    /*=================================================
    29. comments area
==============================================================*/

    .comments-area {
        margin-bottom: 50px;
    }

    .comments-area .comments-title {
        margin-bottom: 28px;
        font-size: 2.25rem;
        font-weight: 500;
    }

    .comments-area .comment-body:before {
        display: table;
        content: "";
        clear: both;
    }

    .comments-area .comment-body img {
        width: 80px;
        height: 80px;
        border-radius: 100%;
        float: left;
    }

    .comments-area .meta-data {
        margin-left: 100px;
    }

    .comments-area .reply {
        float: right;
    }

    .comments-area .reply .comment-reply-link {
        color: #0000ff;
        font-size: 1rem;
        font-weight: 500;
    }

    .comments-area .comment-author a {
        font-weight: 500;
        font-size: 1.125rem;
        color: #222222;
    }

    .comments-area .comment-date {
        color: #333;
        margin-bottom: 0px;
        font-weight: 500;
        display: inline-block;
    }

    .comments-area .comment-content {
        margin-top: 10px;
        padding-right: 50px;
    }

    .comments-area .comment-content p {
        margin-bottom: 0px;
    }

    .comments-area .comment:not(:last-child) .children {
        margin-left: 100px;
    }

    .comments-area .comment:not(:last-child) .meta-data {
        margin-bottom: 30px;
    }

    /* comment responsed */

    .comment-respond .comment-reply-title {
        margin-bottom: 28px;
        font-size: 2.25rem;
        font-weight: 500;
    }

    .responsd-form textarea.form-control {
        padding-top: 10px;
    }

    /*=================================================
    30. blog single
==============================================================*/

    .post-details {
        padding-bottom: 30px;
        border-bottom: 1px solid #ededed;
        margin-bottom: 50px;
    }

    .post-details:hover {
        border-color: #ededed;
    }

    .post-details .post-meta-list {
        margin-bottom: 0px;
    }

    .post-details .entry-content .entry-title {
        margin-bottom: 10px;
    }

    .post-details .entry-content p {
        margin-bottom: 25px;
    }

    .post-details .entry-content blockquote {
        position: relative;
        margin-bottom: 30px;
    }

    .post-details .entry-content blockquote::before {
        content: '\f10d';
        font-family: "FontAwesome";
        color: #3d3d3d;
        font-size: 1.875rem;
        display: inline-block;
        line-height: 1;
        position: absolute;
        top: -20px;
    }

    .post-details .entry-content blockquote p {
        padding-left: 70px;
        font-size: 0.875rem;
    }

    .post-details .entry-content blockquote p:last-child {
        margin-bottom: 0px;
    }

    .post-details .entry-content blockquote p::after {
        display: none;
    }

    /*=================================================
    31. shop product
==============================================================*/

    .single-product {
        margin-bottom: 20px;
    }

    .single-product:hover .product-header > img {
        transform: scale(1.05);
    }

    .single-product .product-header {
        position: relative;
        overflow: hidden;
    }

    .single-product .product-header > img {
        transform: scale(1);
        transition: all 0.4s ease;
        backface-visibility: hidden;
    }

    .single-product .product-header .image-content {
        position: absolute;
        top: 0;
        right: 0;
        padding: 10px;
        z-index: 2;
    }

    .single-product .product-footer {
        padding: 30px 10px 10px;
    }

    .single-product .product-footer.text-center .star-rating:before {
        width: 100%;
    }

    .single-product .woocommerce-product-rating {
        margin-bottom: 15px;
    }

    .single-product .product-title {
        font-size: 1rem;
        font-weight: 500;
        margin-bottom: 6px;
        line-height: 1.5;
    }

    .single-product .price {
        margin-bottom: 20px;
        display: block;
    }

    .ribbon-title {
        background-color: #0000ff;
        display: inline-block;
        border-radius: 10px;
        color: #ffffff;
        font-size: 0.75rem;
        padding: 4px 8px;
        line-height: 1;
    }

    .price ins {
        text-decoration: none;
    }

    .price ins .woocommerce-Price-amount {
        color: #222222;
    }

    .price .woocommerce-Price-amount {
        font-size: 1rem;
        font-weight: 400;
    }

    /* product style list */

    .product-style-list .single-product {
        display: flex;
        flex-wrap: wrap;
    }

    .product-style-list .single-product .product-footer {
        padding: 0px;
        margin-left: 20px;
        flex: 0 0 49%;
    }

    .product-style-list .single-product .product-header {
        flex: 0 0 45%;
    }

    .product-style-list .single-product .price {
        margin-bottom: 14px;
    }

    /*=================================================
    32. product details
==============================================================*/

    .product-summary .product-header,
    .product-summary .product-body {
        padding-bottom: 20px;
        margin-bottom: 20px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    }

    .product-summary .lists > li:not(:last-child) {
        margin-bottom: 7px;
    }

    .product-summary .product-title {
        font-size: 1.5rem;
        font-family: "Open Sans", sans-serif;
        font-weight: 500;
        line-height: 1.583333;
        margin-bottom: 20px;
    }

    .product-summary .woocommerce-product-rating {
        margin-bottom: 15px;
    }

    .product-summary .price {
        font-size: 1.5rem;
    }

    .product-summary .price ins .woocommerce-Price-amount {
        color: #0000ff;
    }

    .product-summary .product-meta {
        padding-left: 15px;
    }

    .product-meta {
        color: #68b613;
        font-size: 1rem;
    }

    .product-meta i {
        padding-right: 5px;
    }

    .woocommerce-form {
        display: flex;
    }

    .woocommerce-form .my_number {
        margin-right: 30px;
    }

    .product-details-tab.nav-tabs .nav-item:not(:last-child) {
        margin-right: 15px;
    }

    .product-details-tab.nav-tabs .nav-item .nav-link {
        padding: 10px 38px;
        border: 1px solid #dedede;
        font-size: 1rem;
        color: #222222;
    }

    .product-details-tab.nav-tabs .nav-item .nav-link.active {
        background-color: #0000ff;
        color: #ffffff;
        border-color: #0000ff;
    }

    .product-tab-pane {
        padding: 40px 30px;
        border: 1px solid #dedede;
    }

    .sign_in_form {
        margin-bottom: 50px;
    }

    .checkout_title {
        margin-bottom: 30px;
    }

    .table.shop_table thead th {
        border-bottom: 0px;
    }

    .table.shop_table td, .table.shop_table th {
        border-top: 0px;
    }

    .table.shop_table .product-quantity .quantity {
        display: inline-block;
    }

    .table.shop_table a.remove {
        float: right;
    }

    .input-style2 .coupon .form-control, .input-style3 .coupon .form-control {
        height: 50px;
    }

    .cart_table_wraper,
    .wc-proceed-to-checkout {
        padding-left: 30px;
    }

    /*------------------------ main content end -------------------------*/
    /*--------------------- main element start ----------------------------*/
    /*=================================================
    1. element btn
==============================================================*/

    .btn {
        padding: 0 40px;
        height: 50px;
        line-height: 50px;
        font-size: 1rem;
        font-weight: 500;
        transition: all .8s ease;
        position: relative;
        z-index: 2;
    }

    .btn:not([class*=btn-outline-]) {
        border: 0px;
    }

    .btn:not(.style2) {
        border-radius: 0px;
    }

    .btn.style2 {
        border: 1px solid #0000ff;
        border-radius: 3px;
    }

    .btn.style2:hover {
        background-color: rgba(255, 255, 255, 0);
        color: #0000ff;
    }

    .btn.btn-secondary {
        background-color: #ffffff;
        color: #0000ff;
    }

    .btn.btn-secondary:hover {
        background-color: #0000ff;
        color: #ffffff;
    }

    .btn.btn-primary {
        background-color: #0000ff;
    }

    .btn.btn-primary:hover:not(.style2) {
        background-color: #ffffff;
        color: #0000ff;
    }

    .btn[class$=primary]:not(.btn-primary) {
        color: #0000ff;
        border-color: currentColor;
    }

    .btn[class$=primary]:not(.btn-primary):hover {
        color: #ffffff;
        background-color: #0000ff;
    }

    .btn.hover-style2 {
        border: 1px solid transparent;
    }

    .btn.hover-style2.btn-primary:hover:not(.style2) {
        border-color: #0000ff;
        color: #0000ff;
    }

    .btn-wraper .btn:not(:last-child) {
        margin-right: 5px;
    }

    /*=================================================
    2. element input field
==============================================================*/

    .nice-select.form-control {
        border: 1px solid;
        margin-bottom: 20px;
    }

    .nice-select.form-control::before {
        top: 10px;
    }

    .nice-select.form-control .current {
        margin-top: 6px;
        display: block;
    }

    .form-control {
        border-radius: 2px;
        border-color: transparent;
        padding-left: 19px;
        resize: none;
        transition: all 0.4s ease;
    }

    .form-control:not(textarea) {
        height: 50px;
    }

    .form-control:focus {
        border-color: #0000ff;
    }

    .form-control::-webkit-input-placeholder {
        /* Chrome/Opera/Safari */
        color: #222222;
        font-size: 1rem;
    }

    .form-control::-moz-placeholder {
        /* Firefox 19+ */
        color: #222222;
        font-size: 1rem;
    }

    .form-control:-ms-input-placeholder {
        /* IE 10+ */
        color: #222222;
        font-size: 1rem;
    }

    .form-control:-moz-placeholder {
        /* Firefox 18- */
        color: #222222;
        font-size: 1rem;
    }

    .form-control.error {
        border-color: #ff3333;
    }

    select.form-control {
        color: #222222;
        appearance: none;
        position: relative;
        background-image: url(../images/down-arrow.png);
        background-repeat: no-repeat;
        background-position: right 16px center;
    }

    select.form-control:not([size]):not([multiple]) {
        height: 50px;
    }

    select.form-control option {
        color: #222222;
    }

    input[type=number]::-webkit-inner-spin-button,
    input[type=number]::-webkit-outer-spin-button,
    input[type=date]::-webkit-inner-spin-button,
    input[type=date]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    input[type=number],
    input[type=date] {
        -moz-appearance: textfield;
    }

    .form-group {
        margin-bottom: 20px;
    }

    /* input style 2 */

    .input-style2 .form-control, .input-style3 .form-control {
        border-color: #d8d8d8;
        background-color: transparent;
        border-radius: 0px;
    }

    .input-style2 .form-control:not(textarea), .input-style3 .form-control:not(textarea) {
        height: 45px;
    }

    .input-style2 .form-control:focus, .input-style3 .form-control:focus {
        border-color: #a5a5a5;
    }

    .input-style2 select.form-control:not([size]):not([multiple]), .input-style3 select.form-control:not([size]):not([multiple]) {
        height: 45px;
    }

    /* input style 3 */

    .input-style3 .form-control {
        border-color: #e1e1e1;
    }

    .input-style3 .form-control::-moz-placeholder {
        color: #454545;
        font-size: 0.875rem;
    }

    .input-style3 .form-control::-webkit-input-placeholder {
        color: #454545;
        font-size: 0.875rem;
    }

    .input-style3 .form-control:-ms-input-placeholder {
        color: #454545;
        font-size: 0.875rem;
    }

    .input-style3 .form-control::placeholder {
        color: #454545;
        font-size: 0.875rem;
    }

    /*=================================================
    3. element list
==============================================================*/

    .lists > li:not(:last-child) {
        margin-bottom: 10px;
    }

    .lists > li i {
        color: #0000ff;
    }

    .lists.check > li:before {
        content: "\f00c";
        color: #0000ff;
        padding-right: 9px;
        font-family: "FontAwesome";
        font-size: 10px;
    }

    .lists.play > li > a:before {
        content: "\f04b";
        color: #0000ff;
        padding-right: 9px;
        font-family: "FontAwesome";
    }

    .lists.border-list > li::before {
        padding-left: 9px;
    }

    .lists.border-list > li:not(:last-child) {
        border-bottom: 1px solid rgba(38, 41, 54, 0.2);
        padding-bottom: 10px;
        margin-bottom: 10px;
    }

    /* info list */

    .info-list > li {
        font-size: 1rem;
        line-height: 1.6;
    }

    .info-list > li i {
        color: #0000ff;
        margin-top: 4px;
        padding-right: 12px;
    }

    .info-list > li a + a {
        display: block;
    }

    /* inline list */

    .list-inline > li {
        display: inline-block;
    }

    /*=================================================
    4. element section title
==============================================================*/

    .section-title-area[class*=text] {
        padding: 0 60px;
        margin-bottom: 60px;
    }

    .section-title-area .section-title {
        margin-bottom: 20px;
    }

    .section-title-area .divider {
        margin-bottom: 20px;
    }

    .section-title-area p {
        font-size: 1rem;
    }

    h2, .section-title {
        font-size: 2.25rem;
        font-weight: 800;
        color: #3d3d3d;
    }

    .section-title span {
        color: #0000ff;
    }

    /*=================================================
    5. element social list
==============================================================*/

    .soical-list > li {
        display: inline-block;
    }

    .soical-list > li > a {
        width: 45px;
        height: 45px;
        line-height: 45px;
        background-color: #ffffff;
        color: #222222;
        font-size: 1rem;
        text-align: center;
    }

    .soical-list > li > a:hover {
        background-color: #0000ff;
        color: #ffffff;
    }

    .soical-list.round > li > a {
        border-radius: 100%;
    }

    .soical-list.style2 > li > a {
        color: #0000ff;
        border: 1px solid currentColor;
    }

    .soical-list.style2 > li > a:hover {
        color: #ffffff;
    }

    /*=================================================
    6. element default font sizes
==============================================================*/

    h1, h2, h3, h4 {
        color: #222222;
        font-family: "Montserrat", sans-serif;
    }

    h1 a, h2 a, h3 a, h4 a {
        color: #222222;
    }

    h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover {
        color: #0000ff;
    }

    h1, h2 {
        font-weight: 600;
    }

    h1, .banner-title {
        font-size: 4.5rem;
        font-weight: 600;
    }

    h3, .heading-title2 {
        font-size: 2.25rem;
        font-weight: 500;
    }

    h3.style2, .heading-title2.style2 {
        color: #ffffff;
    }

    h4, .heading-title {
        font-size: 1.5rem;
        font-weight: 600;
    }

    h4.style2, .heading-title.style2 {
        color: #ffffff;
    }

    h4.style3, .heading-title.style3 {
        color: #0000ff;
    }

    .laed {
        font-size: 1rem;
    }

    .box-title {
        margin-bottom: 0px;
        border: 1px solid #0000ff;
        padding: 9px 30px;
        text-align: center;
        margin-bottom: 30px;
        font-weight: 500;
    }

    /*=================================================
    7. element owl style
==============================================================*/

    .owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        color: #c9c9c9;
        font-size: 4.521875rem;
        transition: all 0.4s ease;
        z-index: 2;
    }

    .owl-carousel .owl-nav button.owl-prev:hover, .owl-carousel .owl-nav button.owl-next:hover {
        color: #0000ff;
    }

    .owl-carousel .owl-nav button.owl-prev {
        left: 100px;
    }

    .owl-carousel .owl-nav button.owl-next {
        right: 100px;
    }

    .owl-carousel .owl-dots {
        text-align: center;
        line-height: 1;
        margin-top: 30px;
    }

    .owl-carousel .owl-dots .owl-dot {
        backface-visibility: hidden;
    }

    .owl-carousel .owl-dots .owl-dot:not(:last-child) {
        margin-right: 10px;
    }

    .owl-carousel .owl-dots .owl-dot.active span {
        width: 30px;
        border-radius: 5px;
    }

    .owl-carousel .owl-dots .owl-dot span {
        display: block;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: #0000ff;
        transition: all 0.4s ease;
    }

    .banner-slider .owl-carousel .owl-nav button.owl-prev, .banner-slider .owl-carousel .owl-nav button.owl-next {
        color: #c9c9c9;
    }

    .banner-slider .owl-carousel .owl-nav button.owl-prev:hover, .banner-slider .owl-carousel .owl-nav button.owl-next:hover {
        color: #0000ff;
    }

    .img-slider .owl-nav button.owl-prev, .img-slider .owl-nav button.owl-next {
        font-size: 2.994375rem;
    }

    .img-slider .owl-nav button.owl-prev {
        left: 20px;
    }

    .img-slider .owl-nav button.owl-next {
        right: 20px;
    }

    .product-slider .owl-nav button.owl-prev, .product-slider .owl-nav button.owl-next {
        font-size: 3.75rem;
        color: #222222;
    }

    .product-slider .owl-nav button.owl-prev:hover, .product-slider .owl-nav button.owl-next:hover {
        color: #0000ff;
    }

    .product-slider .owl-nav button.owl-prev {
        left: -60px;
    }

    .product-slider .owl-nav button.owl-next {
        right: -60px;
    }

    /*=================================================
    8. element main tab style
==============================================================*/

    .nav-tabs .nav-item .nav-link {
        border: 0px;
        border-radius: 0px;
    }

    .main-tab .nav-item .nav-link {
        background-color: #ffffff;
        color: #0000ff;
        font-size: 1rem;
        font-weight: 500;
        padding: 0 29px;
        height: 45px;
        line-height: 45px;
    }

    .main-tab .nav-item .nav-link.active {
        background-color: #0000ff;
        color: #ffffff;
    }

    .tab-pane.fadeInRight {
        transform: translate3d(100px, 0, 0);
        transition: transform 1s cubic-bezier(0.39, 0.58, 0.57, 1), opacity 1.5s ease;
    }

    .tab-pane.fadeInRight.show {
        transform: translate3d(0px, 0, 0);
    }

    /*=================================================
    9. element icon with tab
==============================================================*/

    .main-tab2 {
        margin-bottom: 30px;
    }

    .main-tab2 .nav-item {
        width: calc(calc(100% / 5) - 30px);
    }

    .main-tab2 .nav-item:not(:last-child) {
        margin-right: 30px;
    }

    .main-tab2 .nav-item .nav-link {
        padding: 0px;
        display: block;
        text-align: center;
        color: #222222;
        font-size: 1rem;
        padding-bottom: 20px;
        border: 1px solid rgba(34, 34, 34, 0.2);
        border-top: 0px;
        transition: all 0.4s ease;
    }

    .main-tab2 .nav-item .nav-link.active, .main-tab2 .nav-item .nav-link:hover {
        border-color: #0000ff;
        color: #0000ff;
    }

    /*=================================================
    10. element video
==============================================================*/

    .video-wraper {
        position: relative;
        z-index: 2;
    }

    .video-wraper a i {
        width: 100px;
        height: 100px;
        line-height: 70px;
        color: #fff;
        border: 1px solid #fff;
        border-radius: 100%;
        display: block;
        margin-bottom: 10px;
        padding: 15px;
        text-align: center;
        transition: all .3s ease-in-out;
    }

    .video-wraper a i:hover {
        background: #0000ff;
        border: 1px solid #0000ff;
    }

    .simple-popup {
        color: #0000ff;
        font-size: 2.25rem;
    }

    /*=================================================
    11. back to top
==============================================================*/

    .backtotop-wraper {
        position: fixed;
        right: 10px;
        bottom: 190px;
        z-index: 999;
        opacity: 0;
        visibility: hidden;
        transform: translateY(100px);
        transition: all 0.4s ease;
    }

    .backtotop-wraper.sticky {
        transform: translateY(0px);
        visibility: visible;
        opacity: 1;
    }

    .backtotop-btn {
        display: block;
        width: 60px;
        height: 60px;
        line-height: 55px;
        text-align: center;
        color: #ffffff;
        border-radius: 50%;
        background-color: #0000ff;
        font-size: 1.5rem;
        border: 1px solid transparent;
    }

    .backtotop-btn:hover {
        color: #0000ff;
        background-color: transparent;
        border-color: currentColor;
    }

    /*=================================================
    12. accordion menu
==============================================================*/

    .accordion-menu-widget {
        margin-bottom: 40px;
    }

    .accordion-menu-widget > .card {
        border: 0px;
    }

    .accordion-menu-widget > .card:not(:last-child) {
        margin-bottom: 10px;
    }

    .accordion-menu-widget .card-header {
        padding: 0px;
        border: 0px;
        border-radius: 0px;
    }

    .accordion-menu-widget .card-header > .accordion-btn {
        display: block;
        height: 50px;
        background-color: #1e222f;
        line-height: 50px;
        font-size: 1.125rem;
        color: #ffffff;
        padding: 0 18px;
        position: relative;
    }

    .accordion-menu-widget .card-header > .accordion-btn[aria-expanded="true"] {
        background-color: #0000ff;
    }

    .accordion-menu-widget .card-header > .accordion-btn[aria-expanded="true"]::before {
        transform: rotate(90deg);
    }

    .accordion-menu-widget .card-header > .accordion-btn[aria-expanded]:before {
        position: absolute;
        content: "\f105";
        font-family: "FontAwesome";
        top: 0%;
        right: 18px;
        transform: rotate(0deg);
        font-size: 1.25rem;
        transition: all 0.4s ease;
        transform-origin: center center;
    }

    .accordion-menu-widget .card-header.active > .menu-btn {
        background-color: #0000ff;
    }

    .accordion-menu-widget .card-body {
        padding: 0px;
        border-radius: 0px;
    }

    .accordion-menu > li:not(:last-child) {
        border-bottom: 1px solid #dcdcdc;
    }

    .accordion-menu > li > a {
        color: #222222;
        font-size: 1rem;
        display: block;
        padding: 20px 18px;
        line-height: 1;
    }

    .accordion-menu > li > a:hover {
        color: #0000ff;
    }

    .accordion-menu > li > a i {
        padding-right: 14px;
        font-size: 0.875rem;
    }

    .accordion-menu > li.active > a {
        color: #0000ff;
    }

    /*=================================================
    13. table
==============================================================*/

    .price-table thead th {
        background-color: #0000ff;
        border-color: transparent;
        font-family: "Montserrat", sans-serif;
        font-weight: 500;
        font-size: 1.125rem;
        color: #ffffff;
    }

    .price-table td, .price-table th {
        text-align: center;
        border-color: transparent;
    }

    .price-table.table-striped tbody tr:nth-of-type(odd) {
        background-color: #f1f1f1;
    }

    .price-table.table-striped tbody tr:nth-of-type(odd):hover {
        background-color: rgba(0, 0, 0, 0.2);
    }

    .price-table.table-striped tbody tr:nth-of-type(even) {
        background-color: #e3e3e3;
    }

    .price-table.table-striped tbody tr:nth-of-type(even):hover {
        background-color: rgba(0, 0, 0, 0.2);
    }

    .price-table tbody tr {
        transition: all 0.4s ease;
    }

    .price-table tbody tr td {
        font-size: 1rem;
        color: #222222;
        width: 33.333333%;
    }

    .price-table tbody tr td:not(:last-child) {
        border-right: 1px solid rgba(0, 0, 0, 0.07);
    }

    /*=================================================
    14. accordion
==============================================================*/

    .faqAccordion .card,
    .faqAccordion .card-header {
        border: 0px;
        border-radius: 0px;
    }

    .faqAccordion .card:not(:last-child) {
        margin-bottom: 30px;
    }

    .faqAccordion .card-header {
        background-color: transparent;
        padding: 0px;
    }

    .faqAccordion .btn-link {
        display: block;
        background-color: #f1f1f1;
        font-size: 1rem;
        color: #222222;
        font-weight: 700;
        padding: 12px 30px;
        cursor: pointer;
        position: relative;
    }

    .faqAccordion .btn-link::before {
        position: absolute;
        content: "+";
        right: 30px;
        top: 12px;
        color: #0000ff;
        font-size: 1.5rem;
        font-weight: 700;
        line-height: 1;
        transition: all 0.4s ease;
    }

    .faqAccordion .btn-link[aria-expanded="true"]::before {
        content: "-";
    }

    .faqAccordion .card-body {
        padding: 20px 30px;
        border: 1px solid #e4e4e4;
    }

    .faqAccordion .card-body p {
        color: #3d3d3d000;
    }

    /*=================================================
    15. filter
==============================================================*/

    .filter-button-group {
        margin-bottom: 60px;
    }

    .main-filter {
        text-align: center;
    }

    .main-filter > li {
        display: inline-block;
        vertical-align: middle;
        line-height: 1;
    }

    .main-filter > li > a {
        font-size: 1.125rem;
        color: #222222;
        display: block;
        transition: all 0.4s ease;
        padding: 15px;
        font-weight: 600;
        color: #333;
        margin: 2px;
        border: 1px solid #ddd;
    }

    .main-filter > li > a.selected, .main-filter > li > a:hover {
        color: #0000ff;
        border: 1px solid #0000ff;
    }

    .main-filter > li:not(:last-child) > a::after {
        content: "";
        height: 2px;
        width: 40px;
        display: inline-block;
        background-color: #0000ff;
        margin: 0 20px;
        position: relative;
        top: -5px;
    }

    /*=================================================
    16. blockquote
==============================================================*/

    blockquote {
        margin-bottom: 0px;
    }

    blockquote p {
        font-size: 1rem;
        margin-bottom: 7px;
    }

    blockquote p::after {
        content: "\f10e";
        font-family: "FontAwesome";
        font-size: 1.5rem;
        display: block;
        padding-top: 15px;
    }

    blockquote cite {
        font-size: 1.125rem;
        font-weight: 500;
        font-style: normal;
    }

    /*=================================================
    17. pagination
==============================================================*/

    .pagination .page-item:not(:last-child) {
        margin-right: 8px;
    }

    .pagination .page-item.active .page-link {
        background-color: #0000ff;
        border-color: #0000ff;
        color: #ffffff;
    }

    .pagination .page-item .page-link {
        border-radius: 0px;
        width: 50px;
        height: 50px;
        line-height: 50px;
        padding: 0px;
        text-align: center;
        color: #0000ff;
        border-color: #d9d9d9;
        font-size: 1rem;
        font-weight: 500;
    }

    .pagination .page-item:last-child .page-link {
        width: 100px;
    }

    .row + .pagination {
        margin-top: 30px;
    }

    /*=================================================
    18. map
==============================================================*/

    .map {
        height: 450px;
    }

    .map-area {
        margin-bottom: 60px;
    }

    /*=================================================
    19. info block
==============================================================*/

    .contact-info-block-area {
        margin-bottom: 30px;
    }

    .single-info-block {
        background-color: #ececec;
        padding: 30px;
    }

    .single-info-block .media-body {
        padding-left: 20px;
        color: #222222;
        font-size: 0.9375rem;
        font-weight: 500;
    }

    .single-info-block a {
        color: inherit;
    }

    .single-info-block .round-icon {
        font-size: 1.5rem;
    }

    /*=================================================
    20. search
==============================================================*/

    .serach-form {
        position: relative;
    }

    .serach-form .form-control {
        height: 50px;
        border: 1px solid #ececec;
    }

    .serach-form .form-control:focus {
        border-color: #0000ff;
    }

    .serach-form .search-btn {
        background-color: transparent;
        position: absolute;
        right: 0;
        top: 0;
        border: 0px;
        color: #0000ff;
        font-size: 0.875rem;
        height: 50px;
        padding: 0 20px;
        z-index: 2;
        cursor: pointer;
    }

    /*=================================================
    21. recent post
==============================================================*/

    .single-recent-post-list:not(:last-child) {
        margin-bottom: 20px;
    }

    .single-recent-post-list .media-body {
        margin-right: 20px;
    }

    .single-recent-post-list .media-body + .media-body {
        margin-right: 0px;
    }

    .single-recent-post-list .media-body > img {
        width: 100%;
    }

    .single-recent-post-list .entry-title {
        font-size: 0.875rem;
    }

    .single-recent-post-list .entry-meta > span {
        color: #0000ff;
    }

    /*=================================================
    22. tag
==============================================================*/

    .tag-lists > .tag {
        border: 1px solid #ececec;
        color: #222222;
        padding: 10px 15px;
        margin-right: 5px;
        margin-bottom: 10px;
    }

    .tag-lists > .tag:hover {
        color: #ffffff;
        background-color: #0000ff;
        border-color: currentColor;
    }

    .tag-lists.style2 > .tag {
        border-color: #555;
        padding: 4px 13px;
    }

    /*=================================================
    23. sidebar
==============================================================*/

    .sidebar-widget {
        box-shadow: 0px 2px 6.65px 0.35px rgba(0, 0, 0, 0.15);
        background-color: #ffffff;
        padding: 40px 30px;
    }

    .sidebar-widget:not(:last-child) {
        margin-bottom: 30px;
    }

    .sidebar-widget .widget-title {
        font-size: 1.5rem;
        margin-bottom: 20px;
    }

    .sidebar-widget .lists > li:not(:last-child) {
        margin-bottom: 15px;
    }

    .sidebar-widget .lists > li > a {
        color: #222222;
        font-size: 1rem;
    }

    .sidebar-widget .lists > li > a::before {
        color: inherit;
    }

    .sidebar-widget .lists > li > a:hover {
        color: #0000ff;
    }

    .sidebar-widget .lists > li > a:hover::before {
        color: inherit;
    }

    .sidebar-widget .lists > li span {
        padding-left: 5px;
    }

    /*=================================================
    24. slider range
==============================================================*/

    .price-filter .slider-range {
        border: 0px;
        border-radius: 0px;
        background-color: rgba(0, 0, 0, 0.2);
        height: 2px;
        margin-bottom: 25px;
    }

    .price-filter .slider-range .ui-slider-range {
        background-color: #0000ff;
        border-radius: 0px;
    }

    .price-filter .slider-range .ui-slider-handle {
        border: 0px;
        border-radius: 100%;
        width: 10px;
        height: 10px;
        background-color: #0000ff;
    }

    .price-filter .slider-output {
        display: flex;
        font-size: 1rem;
        color: #222222;
    }

    .price-filter .slider-output label {
        margin-bottom: 0;
    }

    .price-filter .slider-output input:not([type="submit"]) {
        border: 0px;
        pointer-events: none;
        padding-left: 5px;
    }

    .price-filter .slider-output input:not([type="submit"])::-moz-placeholder {
        font-size: 1rem;
    }

    .price-filter .slider-output input:not([type="submit"])::-webkit-input-placeholder {
        font-size: 1rem;
    }

    .price-filter .slider-output input:not([type="submit"]):-ms-input-placeholder {
        font-size: 1rem;
    }

    .price-filter .slider-output input:not([type="submit"])::placeholder {
        font-size: 1rem;
    }

    /*=================================================
    25. product filter
==============================================================*/

    .nice-select {
        display: inline-block;
        background-color: #ececec;
        border-radius: 0;
        border: 0px;
        min-width: 155px;
        height: 40px;
    }

    .nice-select::after {
        display: none;
    }

    .nice-select::before {
        position: absolute;
        content: "\f107";
        right: 17px;
        top: 0;
        font-family: "FontAwesome";
        color: #222222;
        font-size: 0.9375rem;
        transform: rotateX(0deg);
        transition: all 0.4s ease;
    }

    .nice-select.open .list {
        width: 100%;
        min-width: 200px;
    }

    .nice-select.open::before {
        transform: rotateX(180deg);
    }

    .filter-tab {
        justify-content: flex-end;
    }

    .filter-tab .nav-item {
        margin-bottom: 0px;
    }

    .filter-tab .nav-item:not(:last-child) {
        margin-right: 10px;
    }

    .filter-tab .nav-item .nav-link {
        padding: 0px;
        line-height: 1px;
        width: 40px;
        height: 40px;
        line-height: 40px;
        background-color: #ececec;
        color: #222222;
        text-align: center;
    }

    .filter-tab .nav-item .nav-link.active {
        background-color: #0000ff;
        color: #ffffff;
    }

    .product-filter {
        padding: 20px 0;
        margin-bottom: 30px;
        border-top: 1px solid;
        border-bottom: 1px solid;
        border-color: #e5e5e5;
    }

    .product-filter .shop-filter-title {
        font-size: 1rem;
    }

    .product-filter .filter-title {
        font-size: 1rem;
        padding-right: 15px;
        display: inline-block;
    }

    .product-filter .nice-select {
        float: none;
    }

    .woocommerce .woocommerce-ordering {
        margin-bottom: 0px;
    }

    /*=================================================
    26. woocommerce rating
==============================================================*/

    .woocommerce.woocommerce-product-rating .star-rating {
        margin: 0;
        float: none;
        width: auto;
        overflow: visible;
        font-family: inherit;
    }

    .woocommerce .star-rating {
        font-size: 0.875rem;
    }

    .woocommerce .star-rating::before {
        content: '\f005\f005\f005\f005\f006';
        color: #0000ff;
        font-family: "FontAwesome";
        letter-spacing: 3px;
        position: static;
        font-size: 1rem;
    }

    .woocommerce .star-rating span::before {
        display: none;
    }

    .woocommerce .star-rating .woocommerce-review-link {
        color: #222222;
        font-size: 1rem;
        margin-left: 15px;
    }

    .woocommerce .star-rating .woocommerce-review-link:hover {
        color: #0000ff;
    }

    .woocommerce .star-rating .woocommerce-review-link .count {
        overflow: visible;
        float: none;
        position: static;
        padding-top: 0;
    }

    /*=================================================
    27. woo review
==============================================================*/

    .rate-list li {
        display: flex;
        flex-wrap: wrap;
        margin-bottom: 20px;
    }

    .rate-list li b {
        font-weight: 400;
        color: #aaaaaa;
        font-size: 0.75rem;
        padding-left: 5px;
    }

    .rate-list li:last-child {
        margin-bottom: 0;
    }

    .rate-list li .rate-title {
        width: 15%;
        line-height: 1;
        font-size: 0.75rem;
        margin-top: 1px;
    }

    .rate-list li .rate-chart {
        height: 10px;
        background-color: #f5f5f5;
        border-radius: 5px;
        display: block;
        width: 65%;
        position: relative;
        overflow: hidden;
    }

    .rate-list li .rate-chart .rate-chart-bar {
        background-color: #0000ff;
        border-radius: 5px;
        display: block;
        height: 100%;
    }

    .rate-list li .star-rating {
        width: 20%;
        margin-bottom: 0;
        text-align: right;
        margin-top: -2px;
        padding-right: 0;
        padding-left: 15px;
    }

    .rate-list li .star-rating::before {
        color: #0000ff;
    }

    .rate-list li .star-rating[data-value="5"]::before {
        content: '\f005\f005\f005\f005\f005';
    }

    .rate-list li .star-rating[data-value="4"]::before {
        content: '\f005\f005\f005\f005\f006';
    }

    .rate-list li .star-rating[data-value="3"]::before {
        content: '\f005\f005\f005\f006\f006';
    }

    .rate-list li .star-rating[data-value="2"]::before {
        content: '\f005\f005\f006\f006\f006';
    }

    .rate-list li .star-rating[data-value="1"]::before {
        content: '\f005\f006\f006\f006\f006';
    }

    .rate-score .star-rating {
        font-size: 1.875rem;
        float: left;
    }

    .rate-score .rating-score-des {
        font-size: 1.25rem;
        float: left;
        margin-bottom: 0;
    }

    .rate-score .help-tip {
        float: right;
    }

    .woocommerce .rate-score .star-rating {
        margin-bottom: 10px;
    }

    .woocommerce-Reviews {
        padding-top: 50px;
    }

    .woocommerce-Reviews .woocommerce-Reviews-title {
        font-size: 1.5rem;
        margin-bottom: 40px;
        font-family: "Open Sans", sans-serif;
        color: #3d3d3d000;
        font-weight: 500;
    }

    .woocommerce-Reviews .comment_container .comment-text {
        float: right;
    }

    .woocommerce-Reviews .star-rating {
        font-family: inherit;
    }

    .woocommerce #reviews #comments ol.commentlist li img.avatar {
        width: 42px;
        height: 42px;
    }

    .woocommerce #reviews #comments ol.commentlist li .comment-text {
        margin: 0;
        padding: 30px;
        width: calc(100% - 70px);
    }

    .woocommerce .comment-form-rating {
        display: inline-block;
        line-height: 1;
    }

    .woocommerce .comment-form-rating .star-rating {
        margin: 0;
        float: right;
        width: auto;
        overflow: visible;
        font-family: inherit;
        padding-left: 15px;
    }

    .woocommerce .woocommerce-Reviews .comment-form {
        padding-top: 50px;
    }

    .woocommerce .woocommerce-Reviews .comment-form input:not([type="submit"]),
    .woocommerce .woocommerce-Reviews .comment-form textarea {
        width: 100%;
        display: block;
        border: 1px solid #EEEEEE;
        border-radius: 3px;
        height: 40px;
        padding-left: 15px;
        padding-right: 15px;
    }

    .woocommerce .woocommerce-Reviews .comment-form textarea {
        height: 100px;
        padding: 15px;
        resize: none;
    }

    .woocommerce #respond input#submit {
        font-size: 0.75rem;
        padding: 12px 25px;
        font-weight: 500;
        color: #ffffff;
        background-color: #0000ff;
        transition: all 0.4s ease;
    }

    /*=================================================
    28. help tip
==============================================================*/

    .help-tip {
        text-align: center;
        background-color: #0000ff;
        border-radius: 50%;
        width: 24px;
        height: 24px;
        font-size: 14px;
        line-height: 26px;
        cursor: default;
        display: inline-block;
        z-index: 9;
        position: relative;
    }

    .help-tip::before {
        content: '?';
        font-weight: bold;
        color: #fff;
    }

    .help-tip:hover .help-tip-text {
        display: block;
        transform-origin: 100% 0%;
        animation: tipFadeIn 0.3s ease-in-out;
    }

    .help-tip .help-tip-text {
        display: none;
        text-align: left;
        background-color: #1E2021;
        padding: 20px;
        min-width: 300px;
        position: absolute;
        border-radius: 3px;
        box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
        right: -4px;
        color: #FFF;
        margin-bottom: 0;
        margin-top: 8px;
        pointer-events: none;
        font-weight: 400;
    }

    .help-tip .help-tip-text::before {
        position: absolute;
        content: '';
        width: 0;
        height: 0;
        border: 6px solid transparent;
        border-bottom-color: #1E2021;
        right: 10px;
        top: -12px;
    }

    .help-tip .help-tip-text::after {
        width: 100%;
        height: 40px;
        content: '';
        position: absolute;
        top: -40px;
        left: 0;
    }

    @keyframes tipFadeIn {
        0% {
            opacity: 0;
        }
        100% {
            opacity: 100%;
        }
    }
    /*=================================================
    29. vertical slider
==============================================================*/

    .slideshow_thumbs > li:not(:last-child) {
        margin-bottom: 8px;
    }

    .slideshow_thumbs > li > a {
        position: relative;
        overflow: hidden;
    }

    .slideshow_thumbs > li > a > img {
        transition: all 0.4s ease;
        transform: scale(1);
    }

    .slideshow_thumbs > li > a:hover {
        opacity: .9;
    }

    .slideshow_thumbs > li > a:hover > img {
        transform: scale(1.05);
    }

    .slideshow {
        margin-left: 10px;
    }

    /*=================================================
    30. custom number
==============================================================*/

    .my_number .add {
        float: right;
    }

    .my_number .sub {
        float: left;
    }

    .my_number .add,
    .my_number .sub,
    .my_number .input_number {
        width: 50px;
        height: 50px;
        line-height: 50px;
        display: inline-block;
        text-align: center;
        font-size: 1rem;
        color: #303030;
    }

    .my_number .input_number {
        border: 1px solid #e7e7e7;
        pointer-events: none;
        font-size: 1.25rem;
        color: #222222;
        font-weight: 500;
    }

    .my_number .add, .my_number .sub {
        background-color: #e7e7e7;
        cursor: pointer;
    }

    /*=================================================
    31. preloader
==============================================================*/

    .preloader {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 9999999;
        background-color: #ffffff;
        height: 100%;
        width: 100%;
    }

    .preloader .preloader-area {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .sk-cube-grid {
        width: 60px;
        height: 60px;
    }

    .sk-cube-grid .sk-cube {
        width: 33%;
        height: 33%;
        background-color: #0000ff;
        float: left;
        -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
        animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
    }

    .sk-cube-grid .sk-cube1 {
        -webkit-animation-delay: 0.2s;
        animation-delay: 0.2s;
    }

    .sk-cube-grid .sk-cube2 {
        -webkit-animation-delay: 0.3s;
        animation-delay: 0.3s;
    }

    .sk-cube-grid .sk-cube3 {
        -webkit-animation-delay: 0.4s;
        animation-delay: 0.4s;
    }

    .sk-cube-grid .sk-cube4 {
        -webkit-animation-delay: 0.1s;
        animation-delay: 0.1s;
    }

    .sk-cube-grid .sk-cube5 {
        -webkit-animation-delay: 0.2s;
        animation-delay: 0.2s;
    }

    .sk-cube-grid .sk-cube6 {
        -webkit-animation-delay: 0.3s;
        animation-delay: 0.3s;
    }

    .sk-cube-grid .sk-cube7 {
        -webkit-animation-delay: 0s;
        animation-delay: 0s;
    }

    .sk-cube-grid .sk-cube8 {
        -webkit-animation-delay: 0.1s;
        animation-delay: 0.1s;
    }

    .sk-cube-grid .sk-cube9 {
        -webkit-animation-delay: 0.2s;
        animation-delay: 0.2s;
    }

    @keyframes sk-cubeGridScaleDelay {
        0%, 70%, 100% {
            -webkit-transform: scale3D(1, 1, 1);
            transform: scale3D(1, 1, 1);
        }
        35% {
            -webkit-transform: scale3D(0, 0, 1);
            transform: scale3D(0, 0, 1);
        }
    }

    .sidebars > .sidebar {
        background-color: #ffffff;
        z-index: 9999;
        box-shadow: 0px 1px 20px 0px rgba(0, 0, 0, 0.1);
        max-width: 400px;
        width: 300px;
    }

    .sidebars > .sidebar .slide-toggle {
        float: right;
        font-size: 1rem;
        border: 1px solid transparent;
    }

    .sidebars > .sidebar .round-icon:hover {
        color: #0000ff;
        border-color: #0000ff;
    }

    .sidebars > .sidebar .sidebar-area {
        margin-top: 100px;
    }

    .sidebars > .sidebar .sidebar-area .info-list {
        margin-bottom: 30px;
    }

    .sidebars > .sidebar .sidebar-area .info-list > li {
        text-align: left;
    }

    .sidebars > .sidebar .sidebar-area .info-list > li:not(:last-child) {
        margin-bottom: 10px;
    }

    .sidebars > .sidebar .sidebar-area .info-list > li .media-body > a, .sidebars > .sidebar .sidebar-area .info-list > li .media-body > p {
        color: #222222;
    }

    .sidebars > .sidebar .sidebar-area .soical-list > li:not(:last-child) {
        margin-right: 15px;
    }

    .sidebars > .sidebar .sidebar-area .sidebar-title {
        font-size: 1.875rem;
        margin-bottom: 20px;
    }

    .sidebars > .sidebar .sidebar-area .single-recent-post-list .entry-title {
        font-size: 1.125rem;
    }

    .sidebars > .sidebar .recent-post-lists {
        margin-bottom: 40px;
    }

    .sidebars > .sidebar .btn-wraper {
        text-align: center;
    }

    .sidebars > .sidebar .btn-wraper .btn {
        padding: 0 25px;
        margin-bottom: 10px;
    }

    .sidebars > .sidebar .btn-wraper .btn:not(:last-child) {
        margin-right: 10px;
    }

    /*=================================================
    32. element inheritance
==============================================================*/
    /* margin bottom */

    .mb_0 {
        margin-bottom: 0px;
    }

    /* padding bottom */

    .pb_0 {
        padding-bottom: 0px;
    }

    /* margin bottom */

    .mb_1 {
        margin-bottom: 10px;
    }

    /* padding bottom */

    .pb_1 {
        padding-bottom: 10px;
    }

    /* margin bottom */

    .mb_2 {
        margin-bottom: 20px;
    }

    /* padding bottom */

    .pb_2 {
        padding-bottom: 20px;
    }

    /* margin bottom */

    .mb_3 {
        margin-bottom: 30px;
    }

    /* padding bottom */

    .pb_3 {
        padding-bottom: 30px;
    }

    /* margin bottom */

    .mb_4 {
        margin-bottom: 40px;
    }

    /* padding bottom */

    .pb_4 {
        padding-bottom: 40px;
    }

    /* margin bottom */

    .mb_5 {
        margin-bottom: 50px;
    }

    /* padding bottom */

    .pb_5 {
        padding-bottom: 50px;
    }

    /* margin bottom */

    .mb_6 {
        margin-bottom: 60px;
    }

    /* padding bottom */

    .pb_6 {
        padding-bottom: 60px;
    }

    /* margin bottom */

    .mb_7 {
        margin-bottom: 70px;
    }

    /* padding bottom */

    .pb_7 {
        padding-bottom: 70px;
    }

    /* margin bottom */

    .mb_8 {
        margin-bottom: 80px;
    }

    /* padding bottom */

    .pb_8 {
        padding-bottom: 80px;
    }

    /* margin bottom */

    .mb_9 {
        margin-bottom: 90px;
    }

    /* padding bottom */

    .pb_9 {
        padding-bottom: 90px;
    }

    /* margin bottom */

    .mb_10 {
        margin-bottom: 100px;
    }

    /* padding bottom */

    .pb_10 {
        padding-bottom: 100px;
    }

    /* default style a tag */

    a {
        transition: all 0.4s ease;
        display: inline-block;
    }

    /* remove last child padding */

    p:last-child {
        margin-bottom: 0px;
    }

    /* round icon */

    .round-icon {
        width: 50px;
        height: 50px;
        line-height: 50px;
        text-align: center;
        border-radius: 100%;
        background-color: #0000ff;
        color: #ffffff;
        transition: all 0.4s ease;
    }

    .round-icon:hover {
        background-color: #ffffff;
        color: #0000ff;
    }

    .round-icon.medium {
        font-size: 1.875rem;
        width: 70px;
        height: 70px;
        line-height: 70px;
    }

    /* overlay */

    .overlay {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        opacity: 0.8;
        z-index: 0;
    }

    /* color */

    .black-color {
        color: #3d3d3d000;
    }

    /* background color */

    .black-bg {
        background-color: #3d3d3d000;
    }

    /* color */

    .white-color {
        color: #ffffff;
    }

    /* background color */

    .white-bg {
        background-color: #ffffff;
    }

    /* color */

    .primary-color {
        color: #0000ff;
    }

    /* background color */

    .primary-bg {
        background-color: #0000ff;
    }

    /* color */

    .gray-color {
        color: #f4f4f4;
    }

    /* background color */

    .gray-bg {
        background-color: #f4f4f4;
    }

    /* remove from control focus box shadow */

    .form-control:focus {
        box-shadow: none;
    }

    /* bootstrap nav style reset */

    .nav-tabs {
        border-bottom: 0px;
    }

    /* owl image preset */

    .owl-carousel .owl-item img {
        width: auto;
    }

    /* tab pane animation */

    .tab-pane.animated {
        animation-duration: 1.5s;
    }

    /* remove iframe box shadow and background */

    .mfp-iframe-scaler iframe {
        box-shadow: none;
        background: transparent;
    }

    /* section padding */

    .section-padding {
        padding: 100px 0;
    }

    .section-padding-bottom {
        padding-bottom: 100px;
    }

    .section-padding-top {
        padding-top: 100px;
    }

    /* parallax */

    .parallax {
        background-attachment: fixed;
    }

    /* background image */

    .background-image {
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center center;
    }

    /* content label */

    .content-label {
        width: 20px;
        height: 20px;
        line-height: 20px;
        text-align: center;
        background-color: #0000ff;
        border-radius: 50%;
        display: inline-block;
        color: #ffffff;
        font-weight: 500;
        font-size: 0.875rem;
        position: absolute;
        top: 3px;
        right: -8px;
    }

    /* border with fill icoon */

    .border-with-fill-icon {
        width: 100px;
        height: 100px;
        line-height: 100px;
        text-align: center;
        border-radius: 100%;
        font-size: 2.5rem;
        color: #0000ff;
        border: 1px solid currentColor;
        transition: all 0.4s ease;
    }

    .border-with-fill-icon:hover {
        background-color: #0000ff;
        color: #ffffff;
    }

    /* if parent text center */

    .text-center .border-with-fill-icon {
        margin-left: auto;
        margin-right: auto;
    }

    /* if parent text right */

    .text-right .border-with-fill-icon {
        margin-left: auto;
    }

    /* icon wraper */

    .icon-wraper > i:not(:last-child) {
        margin-right: 10px;
    }

    /* iframe */

    iframe {

        width: 100%;
        display: block;
    }

}