/*
Theme Name: Football Club
Theme URI: https://www.buywpthemes.net/products/free-football-club-wordpress-theme
Author: Peccular
Author URI: https://www.buywpthemes.net/
Description: Free Football WordPress Theme is a unique website design specially built for the football clubs, academies, associations and others related to football. It is an exceptional theme exclusively designed for football organizations. All the necessary segments that are required on the website are available with perfect placement and a clean design. It is a ready-made, user-friendly website design that makes it easier for you to create your own personalized football website with the customization features available with this theme. You don't need to have any pre-requisite professional knowledge of website development for creating a website using this theme. You can create it with just basic knowledge of computers and a bit of your own creativity. Customisation features like changing colours, adding logo, images, editing content, changing fonts style and sizes etc. are available. The theme is built using the latest HTML5 and CSS3 which gives it an eye-catching and elegant design with a professional touch that also attracts visitors. The theme is made SEO friendly that also helps gain more visitors. The bootstrap framework used in this theme makes the website responsive, lightweight and renders faster page loading. This Free Football WordPress Theme is compatible with all types of browsers, devices and screens irrespective of their sizes and ratios.
Template: soccer-club-academy
Version: 0.1.2
Tested up to: 6.0
Requires PHP: 5.6
License: GPLv3 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: football-club
Slug: football-club
Tags: one-column, two-columns, left-sidebar, right-sidebar, flexible-header, custom-background, custom-colors, custom-header, custom-menu, featured-image-header, featured-images, footer-widgets, full-width-template, theme-options, threaded-comments, translation-ready, blog, grid-layout, portfolio, photography

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

*/
@import url("https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,600;1,700&display=swap");

/* Colors */
:root {
    --color-gradient1:linear-gradient(to right, var(--color-primary1) 0%, var(--color-primary2) 51%, var(--color-primary1) 100%);
    --color-gradient2:linear-gradient(to right, var(--color-primary1), var(--color-primary1), var(--color-primary2), var(--color-primary2), var(--color-primary2));
    --color-gradient3:linear-gradient(0deg, var(--color-primary1) 0%, var(--color-primary2) 100%);
    --color-gradient4:linear-gradient(-85deg, var(--color-primary2) 0%, var(--color-primary1) 100%);
    --color-gradient5:linear-gradient(90deg, var(--color-primary2) 0%, var(--color-primary1) 100%);
    --color-gradient6:linear-gradient(180deg, var(--color-primary2) 0%, var(--color-primary1) 100%);
    --color-gradient7:linear-gradient(0deg, var(--color-secondary3) 0%, var(--color-secondary) 100%);
    --color-primary1:#ff4934;
    --color-primary2:#ff4934;
    --color-secondary:#081C75;
    --color-secondary2:#020d2d;
    --color-secondary3:#091d77;
    --font-awesome:'FontAwesome';
}

.pd-0{padding: 0;}
.logo img, .mobile-logo img {
    height: auto;
}

.top-header-wrap {
    padding: 0 30px;
    width: 100%;
    display: inline-block;
    background: #fff;
    border-radius: 10px;
    z-index: 999;
}

/*.m-header .navbar {
    background: none;
}*/

.icons a {
    text-decoration: none !important;
}

.header-widget {
    display: flex;
    justify-content: space-between;
    padding: 12px 0;
}


.widget_social_widget li a:hover,
.widget_social_widget li a:focus {
    border: 1px solid #fff;
}

.widget_social_widget li a:hover i,
.widget_social_widget li a:focus i {
    color: #fff;
}

.m-header:not(.header-fixed) .navbar .navbar-menu ul li a svg {
    fill: #fff;
}
.navbar li {
    list-style: none;
    display: inline-block;
}
.navbar li a{
    font-size: 18px !important;
    font-weight: 600;
    text-decoration: none;
}
.m-header .navbar .navbar-nav > li:hover a:not(.theme-button), .m-header .navbar .navbar-nav > li.focus a, .m-header .navbar .navbar-nav > li.active a {
    color: #fff ;
}

.main-header .navbar .navbar-menu ul li.dropdown .sub-menu a:not(.remove) {
    padding: 6px;
}

.m-header .navbar-menubar {
    /*display: flex;*/
    justify-content: space-between;
	float: none;
}


a:not(.theme-button):not(.m-header .navbar .navbar-menu ul li a):not(.woocommerce-MyAccount-navigation ul li a):not(.woocommerce ul.products li.product a):not(.woocommerce nav.woocommerce-pagination ul.page-numbers li .page-numbers):not(.widget:not(.widget_social_widget):not(.widget_tag_cloud) li a):not(.header-widget .info-widget a) {
    color: var(--color-primary1);
}

.headl{
    float: left;
}
.m-header .navbar {
    padding: 10px 0px;
    display: block;
    margin-left: 0;
}
.headright {
    background: #100f0f70;
    /*padding:20px 15px 20px 5px;*/
}
.headright .icons{
    text-align: center;
    padding-top: 18px;
}

.headright .icons i {
    width: 34px;
    height: 34px;
    text-align: center;
    line-height: 34px;
    font-size: 16px;
    border-radius: 50px;
    font-weight: 600;
    margin: 0px -1px;
}

.main-header .navbar .navbar-menu ul li a {
    margin: 0px 50px 0 4px;
    font-size: 18px !important;
    font-weight: 500;
    text-transform: none;
}

.main-header .navbar .navbar-menu ul li.dropdown>a::after {
    top: 26px;
    color: #fff !important;
}

.m-header li.dropdown.cs-menu.search-menu:after {
    content: "";
    position: absolute;
    right: -15px;
    top: 16px;
    height: 22px;
    width: 1px;
    border-right: 1px solid #445396;
}

.header-widget .info-widget>li::after {
    border-right: 1px solid #dbdce3;
}

p.site-description {
    color: #fff;
}
.m-header .widget_social_widget li a:hover i,
.m-header .widget_social_widget li a:focus i {
        color: #fff;
}

.slider-section img {
    max-width: 100%;
    width: 100% !important;
}


/*========================================================================*/
/* ================== service section ====================================*/
/*======================================================================== */

#service-section .section-heading .title{
	position: relative;
    margin-bottom: 45px;
    padding-bottom: 0;
    text-transform: capitalize;
    font-weight: 600;
    color: #030303;
    font-size: 48px;
    font-family: "Tahoma";
        display: inline-block;
}
#service-section .section-heading .title .hedingbrd:before {
    content: " ";
    display: inline-block;
    width: 100%;
    background-image: linear-gradient(78deg,#fd0000 60%,#f1f1f1 70%);
    padding: 1.5px 0;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    text-align: center;
}
#service-section .section-heading .title:after {
	 background-image: url(assets/images/heading.png);
    display: block;
    margin: 0 0 0px 20px;
    content: " ";
    text-shadow: none;
    width: 12%;
    flex: 1;
    
}
#service-section .single-service {
    margin-top: 35px;
    padding-bottom: 10px;
}
#service-section .imgserviceslider{
	position: relative;
	overflow: hidden;
	height: 550px;
    width: 550px;
    border: 1px solid #ccc;
    border-radius: 50%;
    padding: 24px;
    /*background: #3ff;*/
    margin: 0 auto;
    text-align: center;
    line-height: 500px;
}
#service-section .imgserviceslider img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

#service-section .services-highlightborder {
    background-color: #dddddd;
    display: inline-table;
    width: 100%;
    right: 0;
    bottom: 0;
    height: 190px;
    background-repeat: repeat-x;
    position: absolute;
    border-radius: 0 0 20px 20px;   
    z-index: 1;
    box-shadow: 2px 10px 41px 0px #dddddd;
}

#service-section .single-service .sericn {
    position: relative;
    overflow: hidden;
}
#service-section .single-service .sericn svg {
    bottom: -1px;
    position: absolute;
}
#service-section .single-service .sericn .iconBox {
    position: relative;
    background: #000;
    transition: all 0.5s ease 0s;
    margin: 0px 0px 10px 1px;
    height: 110px;
    width: 110px;
    border-radius: 50%;
    text-align: center;
    line-height: 133px;
}
#service-section .single-service .sericn .imageBox i {
    font-size: 54px;
    color: #fd0000;
}


#service-section .single-service .sericn .imageBox a::before{ 
      content: "\f015";
    }

#service-section .single-service:hover .sericn img{
    transform: scale(1.2);
}

#service-section .single-service .sericn .imageBox.imageBefore {
    position: absolute;
    top: 0;
    left: 0;
}
#service-section .single-service .sericn .imageAfter {
    width: 0;
    transition: 1.5s;
    overflow: hidden;
}

#service-section .single-service .sericn:hover .imageAfter {
    width: 100%;
}

.box-space {
    padding: 0 0px;
}

#service-section .single-service .serbx .title {
    font-size: 17px;
    font-weight: 700;
    letter-spacing: 0em;
    line-height: 1.8em;
}

#service-section .single-service .serbx h3.title {
    color: #151515;
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 0px;
    padding-bottom: 0px;
    line-height: 26px;
    text-transform: uppercase;
    margin: 0;
    font-family: 'Roboto', sans-serif;
   text-align: left;
    margin-bottom: 0px;
}

#service-section .single-service .serbx {
    text-align: left;
    position: relative;
    z-index: 2;
}

#service-section .single-service .serbx .description {
    margin-bottom: 12px;
    color: #6f6f71;
    font-size: 14px;
    line-height: 1.6em;
    color: #868686;
}
#service-section .single-service .serbx p{
    color: #c1c1c1;
    margin-bottom: 0px;
    font-weight: 400;
    line-height: 20px;
    font-size: 18px;
    font-family: 'Roboto', sans-serif;
    
}

#service-section .single-service .serbx a {
    color: #2faaf7;
    font-size: 16px;
    text-decoration: none;
    background: #fdfdfd;
    padding: 14px 35px 10px;
    margin-top: 20px;
    display: inline-block;
    border: 2px solid #36aff1;
    font-weight: 600;
    line-height: 16px;
}

#service-section .single-service .serbx a:hover {
    background: #002c8b;
    outline-width: 0;
    border: 2px solid #002c8b;
    color: #fff;
}

#service-section .single-service .serbx a i {
    margin-right: 10px;
    color: #f70037;
}


/*======header=======*/
/*===================*/

.m-header.header-fixed{
    background: #3333339e !important;
}
@media (max-width: 1199px) and (min-width: 992px) {
    .headright .icons i{
        width: 30px;
        height: 30px;
        line-height: 30px;
    }	
}
@media (max-width: 991px){
    .hero-slider { height: 600px;}
    .main-header {
        background: #100f0f70;
    }
    
    .headright { background: none; padding: 0px 0px 20px 5px;}
    .navbar li { display: block;}
    .navbar-toggler{    color: #fff;}
    .headright .icons i{ width: 30px; height: 30px; line-height: 30px;}
	.slider-section {padding: 70px 0 60px;background-size: 100% auto;background: none;}	
	.m-header .navbar .navbar-toggler {	
        top: 14px;
        right: 10px;
    }
    .logo { margin: 10px 0 !important;}
	.m-header .navbar {	padding: 0px;}
	.m-header .top-header {
		z-index: 9999;
	}
}

@media (max-width: 1199px){
.main-header .navbar .navbar-menu ul li.dropdown>a::after {
    top: 10px !important;
}
}
@media (max-width: 575px){
    /*.m-header .navbar .navbar-toggler {
        top: -32px;
    }*/
    .m-header .socials {
        text-align: left;
    }
    .slider-area h2 {
        font-size: 20px;
        padding: 7px 0;
    }
    .slider-area p {
        padding-bottom: 10px;
    }
}

@media (max-width: 400px)
{#service-section .imgserviceslider {
    height: 300px;
    width: 300px;
    line-height: 250px;
}
}

.footer-area{background-image: url(assets/images/footerimg.jpg) !important;}
.footer-area .widget_tag_cloud a { color: #fff !important;}
.sidebar .widget_tag_cloud a:hover,
.sidebar .widget_tag_cloud a:focus {  color: #fff !important;}
.pagination .nav-links a:hover, .pagination .nav-links a:focus, 
.pagination .nav-links .page-numbers.current {  color: var(--bs-white) !important;}
.footballclub-theme.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    color: #fff !important;
}

/*slider csss*/
/*=================*/

.hero-slider .slider-center-imgmm{
    margin: 0 auto;
    width: 125px;
    height: 125px;
    top: 41%;
    position: absolute;
    border-radius: 50%;
    left: 55%;
    z-index: 2;
    text-align: center;
    overflow: hidden;
}

.hero-style .slide-titl{
    font-size: 60px;
    font-family: "Tahoma";
}
.hero-style .slide-titl span{font-size: 50px;}
.sliebrd:before {
    content: " ";
    display: inline-block;
    width: 100%;
    background-image: linear-gradient(78deg,#fd0000 60%,transparent 70%);
    padding: 1.5px 0;
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    text-align: left;
}
.hero-style .slide-tex p{
    font-size: 18px;
    line-height: 22px;
    font-family: "Poppins";
    font-weight: 500;
}
.hero-style a.ReadMore1 {
    font-size: 18px;
    background: #c50301 !important;
    padding: 14px 24px;
    font-weight: 600;
    line-height: 20px;
    text-decoration: none !important;
    color: #fcfcf8 !important;
    border-radius: 6px;
    font-family: 'Roboto', sans-serif;
}

.logo {
    display: inline-block;
    margin-top: 6px;
    margin: 0;
    padding: 0px;
    text-align: center;
}

.logo a img {
    margin: 10px 0 0 41px;
}

.header-widget {
    display: flex;
    justify-content: space-between;
    padding: 12px 0
}

.header-widget .info-widget {
    display: flex;
    align-items: center
}

.header-widget .info-widget>li {
    color: #fff;
    font: 400 16px/36px "Work Sans", sans-serif;
    padding: 0 20px;
    position: relative
}

h4.site-title {
    color: #000 !important;
}

.header-widget .info-widget>li::after {
    content: "";
    position: absolute;
    right: 0;
    top: 3px;
    height: 30px;
    width: 1px;
    border-right: 1px solid #445396
}

.header-widget .info-widget>li:last-child {
    padding-right: 0
}

.header-widget .info-widget>li:last-child::after {
    display: none
}

.header-widget .info-widget>li:first-child {
    padding-left: 0
}

.header-widget .info-widget>li svg {
    fill: #fff
}

.header-widget .info-widget>li .icon {
    height: 36px;
    line-height: 36px;
    width: 36px;
    border-radius: 50%;
    text-align: center;
    display: inline-block;
    background-image: var(--color-gradient1);
    transition: 0.3s;
    background-size: 200% auto;
    overflow: hidden;
    margin-right: 10px;
    color: #fff
}

.header-widget .info-widget>li a {
    display: flex;
    color: #fff
}

.header-widget .info-widget>li a:hover,
.header-widget .info-widget>li a:focus {
    color: var(--color-primary2)
}

.header-widget .info-widget>li a:hover .icon,
.header-widget .info-widget>li a:focus .icon {
    background-position: right center
}

.header-widget .info-widget>li a:hover .icon svg,
.header-widget .info-widget>li a:focus .icon svg {
    animation: slideTop .8s
}

.navbar a.contactus {
    font-size: 16px;
    background: #ffbb3c;
    padding: 6px 9px;
    border-radius: 5px;
    font-weight: 500;
    line-height: 18px;
    text-decoration: none !important;
    color: #f6f7f4 !important;
    position: relative;
    top: 8px;
    background-image: radial-gradient( circle farthest-corner at 10% 20%,#fe9903 0%,#283524 100.3% ) !important;
    box-shadow: 3px 5px 12px 0px #b9b6b687;
    display: inline-block;
}
.navbar a.contactus:hover{
    background: #c50301;
    background-image: radial-gradient( circle farthest-corner at 10% 20%,#c50301 0%,#c50301 100.3% ) !important;
}

.widget_social_widget ul {
    line-height: 0
}

.widget_social_widget li {
    display: inline-block;
    padding-left: 4px
}

.widget_social_widget li:first-child {
    padding-left: 0
}

.widget_social_widget li a {
    border: 1px solid #445396;
    background: transparent;
    height: 35px;
    line-height: 35px;
    width: 35px;
    border-radius: 50%;
    font-size: 16px;
    text-align: center;
    display: inline-block;
    color: #fff;
    overflow: hidden;
    position: relative
}
.widget_social_widget li a i {
    display: block;
    -webkit-transition: -webkit-transform .5s ease-out;
    -moz-transition: -moz-transform .5s ease-out;
    transition: transform .5s ease-out;
    line-height: 35px;
    color: #fff;
    width: 100%
}
.widget_social_widget li a i+i {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    transform: translate3d(0, 100%, 0)
}

.widget_social_widget li a:hover,
.widget_social_widget li a:focus {
    background-image: var(--color-gradient2)
}

.widget_social_widget li a:hover i,
.widget_social_widget li a:focus i {
    transform: translate3d(0, -100%, 0)
}

.widget_social_widget li a:hover i+i,
.widget_social_widget li a:focus i+i {
    transform: translate3d(0, 0, 0)
}

.upper-header-area a {
    text-decoration: none !important;
}

.m-header {
    display: block;
    width: 100%;
    z-index: 999;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    padding: 0;
}
.upper-header-area {
    padding: 10px 0;
}

.lower-header-area {
    background: rgba(0,0,0,0.7);
}
@media (min-width: 1600px){
    .hero-slider .slider-center-imgmm{ left: 55% !important;}
    /*.imgshape{left: -10%;}*/
}
@media screen and (min-width: 1300px) and (max-width: 1599px){
    .imgshape{left: -10%;}
    .hero-slider .slider-center-imgmm{
        left: 70% !important;
    }
}
@media screen and (min-width: 1200px) and (max-width: 1299px){
    .hero-slider .slider-center-imgmm{ left: 52%;}
    .imgshape{left: -35% !important;}
}
@media screen and (min-width: 1140px) and (max-width: 1199px){
    .slider-inner-bx{left: 10% !important;}
    .imgshape{left: -28% !important;}
    .hero-slider .slider-center-imgmm{
    left: 66%;
    width: 100px;
    height: 100px;
}
}
@media screen and (min-width: 992px) and (max-width: 1199px){
    #service-section .imgserviceslider{
        height: 450px;
        width: 450px;
        line-height: 400px;
    }
    #service-section .single-service .sericn .iconBox{ height: 88px; width: 88px;line-height: 113px;}
    #service-section .single-service .sericn .imageBox i{font-size: 45px;}
}
@media screen and (min-width: 1031px) and (max-width: 1139px){
    .slider-inner-bx{left: 10% !important;}
    .imgshape{left: -28% !important;}
    .hero-slider .slider-center-imgmm{left: 75%;}
}
@media screen and (min-width: 992px) and (max-width: 1030px){
    .slider-inner-bx{  left: 4% !important;}
    .imgshape{ left: -36% !important;}
    .hero-slider .slider-center-imgmm{left: 71%;}
}
@media (min-width: 992px){
	body.admin-bar .m-header {
		top: 32px;
	}
	body.admin-bar .m-header.header-fixed {
		top: -35px;
	}
}

@media screen and (min-width: 320px) and (max-width: 768px){
    header.m-header.main-header.not-sticky {
        background: #100f0f70;
        overflow: hidden;
    } 
    
}
@media screen and (min-width: 320px) and (max-width: 528px){
    .headl {
        float: none;
    }

    .headright .icons {
        text-align: left;
        padding-left: 20px;
    }
    .m-header .navbar {
        margin: 0;
    }

    .slider-inner-bx {
        width: 100% !important;
    }
    .hero-style .slide-tex p {
        padding-right: 5px;
    }
    #service-section .single-service .sericn .iconBox {
        margin: 0px 0px 11px 97px;
    }
    #service-section .single-service .serbx h3.title,
    #service-section .single-service .serbx p {
        text-align: center;
    }
    #service-section .imgserviceslider {
        width: 300px;
        height: 300px;
        line-height: 250px;
    }

}

@media screen and (min-width: 425) and (max-width: 528px){
    #service-section .imgserviceslider {
        width: 300px;
        height: 300px;
    }
}

@media (max-width: 991px){
    .imgshape,
    .slider-center-imgmm{display: none !important;}

	body.admin-bar .m-header {
		top: 45px;
	}
	body.admin-bar .m-header.header-fixed {
		top: -70px;
	}
}
.slider-area {
    padding: 1px 0 167px 0;
    position: relative;
    display: block;
    overflow: hidden;
    z-index: 1;
}
.slider-area.breadcrumb-section {
    padding: 12em 0 5em;
}

.slider-area .shape-1 {
    position: absolute;
    left: 70px;
    top: 100px;
    animation: moveleftbounce 5s linear infinite;
    z-index: -1
}

.slider-area .shape-2 {
    position: absolute;
    left: 47%;
    top: 220px;
    animation: animationFramesTwo 20s linear infinite;
    z-index: -1
}

.slider-area .shape-3 {
    position: absolute;
    right: 0;
    bottom: 190px;
    animation: moveleftbounce 7s linear infinite;
    z-index: -1
}

.slider-area .slider-inner .item {
    padding-bottom: 45px
}

.slider-area .rating {
    display: flex;
    padding-bottom: 30px;
    padding-top: 40px
}

.slider-area .rating .star {
    padding-right: 20px;
    border-right: 1px solid #445396
}

.slider-area .rating .star h6 {
    padding: 0
}

.slider-area .rating h6 {
    color: #fff;
    font: 400 18px/24px "Work Sans", sans-serif;
    text-align: center;
    padding-left: 20px
}

.slider-area .badge-count {
    background: #fff;
    border-radius: 20px;
    text-align: center;
    padding: 0 15px;
    line-height: 30px;
    display: inline-block;
    font-size: 18px;
    color: var(--color-secondary)
}

.slider-area h2 {
    color: #fff;
    font-size: 60px;
    font-weight: 700;
    padding: 20px 0
}

.slider-area h2 i {
    background: var(--color-gradient2);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.slider-area p {
    color: #fff;
}
.hero-style .slide-btns {
    margin-top: 3.5em;
}

.slider-area .theme-button {
    min-width: 170px
}

.slider-area .call {
    color: #fff;
    font-size: 20px;
    font-weight: 500;
    margin-left: 17px
}

.slider-area .call span {
    line-height: 50px;
    border-radius: 50%;
    background-color: #fff;
    box-shadow: 3.42px 9.397px 12.75px 2.25px rgba(255, 255, 255, 0.3);
    width: 50px;
    height: 50px;
    text-align: center;
    display: inline-block;
    color: var(--color-secondary)
}

.slider-area .call span i {
    transform: rotate(90deg)
}

.slider-area .call:hover,
.slider-area .call:focus {
    color: var(--color-primary2)
}

.slider-area .call:hover i,
.slider-area .call:focus i {
    animation: slideTop .8s;
    color: var(--color-primary2)
}

.slider-mainimg-box {
    width: 100%;
    height: 100%;
    }
.imgshape{
    background-image: url(assets/images/slidshape.png);
    background-repeat:no-repeat ;
    position: absolute;
    top: 0;
    bottom: 0;
    left: -5%;
    right: 0;

}
.slider-area img {
    position: absolute;
    max-width: 100%;
    width: 100%;
    height: 100%;
    display: block;
    background: #fff;
}

.slider-area .row.text-center {
    justify-content: center;
}
.slider-area .row.text-center [class^='col-lg-'] {
    width: 100%;
    max-width: 58.33333333%;
}
.slider-area .row.text-center .rating {
    justify-content: center;
}
.slider-area .row.text-center [class^='col-lg-'] > img {
    margin: 25px auto 0 auto;
}
.slider-area .row.text-right .col-lg-7 {
    margin-left: auto;
    margin-right: 0;
    order: 6;
}

.hero-slider {
  width: 100%;
  height: 700px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  z-index: 0;
}

.hero-slider .swiper-slide {
  overflow: hidden;
  color: #fff;
}

.hero-slider .swiper-container {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.hero-slider .slide-inner {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  background-size: cover;
  background-position: center;
  /*display: flex;*/
  justify-content: center;
  align-items: center;
  text-align: left;
}
.slider-inner-bx {
    position: absolute;
    top: 30%;
    left: 4%;
    width: 660px;
   
}

.hero-slider .swiper-button-prev,
.hero-slider .swiper-button-next {
    background: transparent;
    width: 15px;
    height: 15px;
    line-height: 15px;
    margin-top: -30px;
    text-align: center;
    border: 0px solid #d4d3d3;
    border-radius: 55px;
    opacity:1;
    visibility:visible;
    transition: all .3s ease;
    color: #fcfdfb;
}

.hero-slider .swiper-button-prev:hover,
.hero-slider .swiper-button-next:hover {
  color: #000;
}


@media (max-width: 767px) {

    .hero-slider {  height: 500px;}
    .slider-inner-bx{left: 3%;}
    .slider-area h2{font-size: 28px;}
    .hero-style .slide-titl span{font-size: 25px;}
    .hero-style a.ReadMore1 {
        font-size: 16px;
        padding: 10px 12px;
    }
    .hero-style .slide-btns {
        margin-top: 1em;
    }
    .hero-slider .swiper-button-prev,
    .hero-slider .swiper-button-next {display: none;}

    #service-section .single-service .part-1 .iconBox {
        margin-bottom: 20px;
}
}

.hero-slider .swiper-button-prev {
  left: auto;
  right: 88px;
    top: 406px;
  transform:translateX(50px);
}

.hero-slider .swiper-button-prev:before {
    content: "\f104";
    font-family: FontAwesome;
    position: absolute;
    /*right: -15px;*/
    color: #000;
    background: #fff;
    width: 46px;
    height: 46px;
    line-height: 44px;
    font-weight: 500;
    font-size: 40px;
    border-radius: 0px;
}

.hero-slider .swiper-button-next { 
    right: -7px;
    top: 354px;
    transform:translateX(-50px);
}

.hero-slider .swiper-button-next:before {
    content: "\f105";
    font-family: FontAwesome;
    position: absolute;
    right: -15px;
    color: #000;
    background: #fff;
    width: 46px;
    height: 46px;
    line-height: 44px;
    font-weight: 500;
    font-size: 40px;
    border-radius: 0px;
}

.hero-slider .swiper-button-prev:hover:before,
.hero-slider .swiper-button-next:hover:before { color: #000;}

.hero-slider .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  text-align: left;
  line-height: 12px;
  font-size: 12px;
  color: #000;
  margin-right: 5px;
  opacity: 0.3;
  background:#fff;
  transition:all .2s ease;
}

.hero-slider .swiper-pagination-bullet-active {opacity:1;}
.hero-slider .swiper-container-horizontal > .swiper-pagination-bullets,
.hero-slider .swiper-pagination-custom,
.hero-slider .swiper-pagination-fraction { bottom: 30px;}
.swiper-pagination {text-align:left;}
.hero-slider .swiper-container-horizontal > .swiper-pagination-bullets{
  bottom:50px;
    max-width: 1200px;
    padding: 0 15px;
    margin: 0 auto;
    left: 50%;
    transform: translateX(-50%);
    display: none;
}
}
@media (min-width: 767px) {
  .hero-slider .swiper-container-horizontal > .swiper-pagination-bullets{
  bottom:30px;
 
}
}


@media (max-width: 560px) {
.hero-slider .slider-center-imgmm img {
    width: 45px;
    height: 45px;
}
}