@import url(sprite.css);
/*======================================= Initialization of Font ========================================*/
@font-face { font-family: 'Sakal_Marathi_N_Ship'; src: url('images/fonts/Sakal_Marathi_N_Ship.eot'); src: url('images/fonts/Sakal_Marathi_N_Ship.eot') format('embedded-opentype'), url('images/fonts/Sakal_Marathi_N_Ship.woff2') format('woff2'), url('images/fonts/Sakal_Marathi_N_Ship.woff') format('woff'), url('/imagesfonts/Sakal_Marathi_N_Ship.ttf') format('truetype'), url('/imagesfonts/Sakal_Marathi_N_Ship.svg#Sakal_Marathi_N_Ship') format('svg'); }
/*======================================= Initialization of Font End ========================================*/

/*======================================= Restored default Browsers styles ========================================*/


/*======================================= Header CSS End ========================================*/ 
/*======================================= Content Area CSS Start ========================================*/
.content-area { background: #f5f5f7 none repeat scroll 0 0; }
/** RESET AND LAYOUT
===================================*/
.loader {
    background: rgba(0, 0, 0, 0.5) url("../images/loader.gif") no-repeat scroll center center;
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999;
}

.bx-wrapper { position: relative; margin: 0 auto; padding: 0; *zoom: 1;
}
.bx-wrapper img { display: block; width: inherit; }
/** THEME
===================================*/

.bx-wrapper .bx-controls-auto { position: absolute; bottom: -30px; width: 100%; }
/* LOADER */

.bx-wrapper .bx-loading { min-height: 50px; background: url("../images/bx_loader.gif") center center no-repeat #fff; height: 100%; width: 100%; position: absolute; top: 0; left: 0; z-index: 2000; }
/* PAGER */

.bx-wrapper .bx-pager { background: rgba(0, 0, 0, 0) url("../images/slider-bullet-bg.png") repeat scroll 0 0; bottom: 0; color: #666; font-family: Arial; font-size: 0.85em; font-weight: bold; height: 10px; line-height: 10px; padding: 12px 16px 16px; position: absolute; right: 0; text-align: center; }
.bx-wrapper .bx-pager .bx-pager-item, .bx-wrapper .bx-controls-auto .bx-controls-auto-item { display: inline-block; *zoom: 1;
 *display: inline;
}
.bx-wrapper .bx-pager.bx-default-pager a { background: #666; text-indent: -9999px; display: block; width: 10px; height: 10px; margin: 0 5px; outline: 0; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active { background: #bbb; }
/* DIRECTION CONTROLS (NEXT / PREV) */

.bx-wrapper .bx-prev { background: rgba(0, 0, 0, 0) url("../images/sprite.png") no-repeat scroll 0 -21px; left: 10px; }
.bx-wrapper .bx-next { background: rgba(0, 0, 0, 0) url("../images/sprite.png") no-repeat scroll -36px -20px; right: 10px; }
.bx-wrapper .bx-prev:hover { background-position: 0 -58px; }
.bx-wrapper .bx-next:hover { background-position: -37px -57px; }
.bx-wrapper .bx-controls-direction a { bottom: 0; height: 37px; margin-top: -16px; outline: 0 none; position: absolute; text-indent: -9999px; top: 50%; width: 37px; z-index: 9999; }
.bx-wrapper .bx-controls-direction a.disabled { display: none; }
/* AUTO CONTROLS (START / STOP) */

.bx-wrapper .bx-controls-auto { text-align: center; }
.bx-wrapper .bx-controls-auto .bx-start { display: block; text-indent: -9999px; width: 10px; height: 11px; outline: 0; background: url(images/controls.png) -86px -11px no-repeat; margin: 0 3px; }
.bx-wrapper .bx-controls-auto .bx-start:hover, .bx-wrapper .bx-controls-auto .bx-start.active { background-position: -86px 0; }
.bx-wrapper .bx-controls-auto .bx-stop { display: block; text-indent: -9999px; width: 9px; height: 11px; outline: 0; background: url(images/controls.png) -86px -44px no-repeat; margin: 0 3px; }
.bx-wrapper .bx-controls-auto .bx-stop:hover, .bx-wrapper .bx-controls-auto .bx-stop.active { background-position: -86px -33px; }
/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager { text-align: left; width: 80%; }
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto { right: 0; width: 35px; }
/* IMAGE CAPTIONS */

.bx-wrapper .bx-caption { position: absolute; bottom: 0; left: 0; background: #666; background: rgba(80, 80, 80, 0.75); width: 100%; }
.bx-wrapper .bx-caption span { color: #fff; font-family: Arial; display: block; font-size: .85em; padding: 10px; }
.scrollTop a { background: #1bbc9b url("../images/scroll-top.png") no-repeat scroll center center; color: #fff; display: block; height: 40px; width: 40px; border-radius: 5px }
.content-area h2 { padding-top: 10px; }
.breadcrumb li { float: left; padding-right: 10px; }
.breadcrumb li a { color: #60af4d; font-weight: bold; }
.breadcrumb li.active { color: #787878; }
.breadcrumb { border-bottom: 1px solid #60af4d; border-top: 1px solid #60af4d; padding: 10px 0; }
li.divider::after { color: #333333; content: " / "; font: 15px/28px Arial, Helvetica, sans-serif; }

/*======================================= Content Area CSS End ========================================*/

/*======================================= Footer CSS Start ========================================*/
.footer { background: #fff none repeat scroll 0 0; border-top: 1px solid #d4d2d1; color: #585858; font: 12px "Sakal_Marathi_N_Ship", serif; text-align: center; width: 100%; }
.footer-nav li { display: inline-block; vertical-align: middle; }
footer .dev-logo { display: inline-block; height: 23px; width: 40px; }
.dev_by > span { font-weight: bold; }
.footer h6 { padding-bottom: 0 }
.footer .container { font: 12px "Arial"; padding-top: 20px; }
.footer li a { border-right: 1px solid; color: #585858; float: right; font: 13px/12px "Sakal_Marathi_N_Ship", sans-serif; padding: 0 7px; }
.logo.grid-4 { text-align: left; }
.footer li a:hover { color: #60af4d; }
.copy-right { padding: 15px 0; }
.content-area .container { padding: 60px 0; }
.content-area .container_gallery { padding: 0px 0; }
.wname { font-size: 17px; line-height: 20px; }
.list label { font-size: 12px; }
.content.list li { color: #333; padding-bottom: 15px; }
.container.about-us {
  padding: 0 0 60px;
}
.container.con-us {
  padding: 0 0 60px;
}
.container.work-comm {
  padding: 0 0 60px;
}
.d-flex{display: flex;}

.justify-content-between{justify-content: space-between;}

.w-50 {width: 50%;}

.membership-col {
    border: 1px solid #333333;
    margin-top: 30px;
}
.membership-col h4 {
    font-weight: 600;
    border-bottom: 2px solid #333333;
    padding-bottom: 5px;
    margin-bottom: 10px;
}
.life-m, .ordinary-m {
    padding: 10px;
}
.ordinary-m {
    border-right: 2px solid #333333;
}
.wef {
    width: 15%;
    border-right: 2px solid #333333;
}
.life-fees {
    width: 80%;
    padding-left: 10px;
}
#game-fees table {
        font-family: arial, sans-serif;
        border-collapse: collapse;
        width: 100%;
    }

    #game-fees thead tr {
        background-color: #60af4d;
        color: #ffffff;
        font-weight: bold;
    }

    #game-fees td,
    #game-fees th {
        border: 1px solid #dddddd;
        text-align: left;
        padding: 8px;
    }

    #game-fees thead tr th:nth-of-type(3),
    #game-fees thead tr th:nth-of-type(4),
    #game-fees td:nth-of-type(3),
    #game-fees td:nth-of-type(4) {
        text-align: center !important;
    }


    @media only screen and (max-width: 768px) {

        /* Force table to not be like tables anymore */
        #game-fees table,
        #game-fees thead,
        #game-fees tbody,
        #game-fees th,
        #game-fees td,
        #game-fees tr {
            display: block;
        }

        /* Hide table headers (but not display: none;, for accessibility) */
        #game-fees thead tr {
            display: none;
        }

        #game-fees tr {
            margin: 0 0 1rem 0;
            border: 1px solid #ddd;
        }

        #game-fees td {
            /* Behave  like a "row" */
            border: none;
            border-bottom: 1px solid #eeeeee;
            position: relative;
            padding-left: 50%;
        }

        #game-fees td:before {
            /* Now like a table header */
            position: absolute;
            /* Top/left values mimic padding */
            top: 0;
            left: 0px;
            width: 45%;
            padding-right: 10px;
            white-space: nowrap;
            padding: 8px;
            background-color: #60af4d;
            font-weight: bold;
            color: #ffffff;
        }
        #game-fees thead tr th:nth-of-type(3),
        #game-fees thead tr th:nth-of-type(4),
        #game-fees td:nth-of-type(3),
        #game-fees td:nth-of-type(4) {
        text-align: left !important;
    }

        #game-fees td:nth-of-type(1):before {
            content: "Sr. No";
        }

        #game-fees td:nth-of-type(2):before {
            content: "Games";
        }

        #game-fees td:nth-of-type(3):before {
            content: "Monthly Fees";
        }

        #game-fees td:nth-of-type(4):before {
            content: "Season Fees";
        }

    }

/*======================================= Footer CSS End ========================================*/

/*======================================= 
Above Wrapper  CSS Start 
This width should change as per our container (wrapper area) width. 

In this example we have used 1200px. 
========================================*/

@media(min-width:1200px) {/*For big desktop*/
.container { max-width: 1200px; width: 100%; }
}

@media screen and (max-width:1024px) {
.nav li a { font-size: 16px; }
}

@media (min-width: 481px) {
.grid-xs-1, .grid-xs-2, .grid-xs-3, .grid-xs-4, .grid-xs-5, .grid-xs-6, .grid-xs-7, .grid-xs-8, .grid-xs-9, .grid-xs-10, .grid-xs-11, .grid-xs-12 { float: left; padding: 0 1%; }
.grid-layout { margin: 0 -1%; }
.grid-xs-1 { width: 8.33333%; }
.grid-xs-2 { width: 16.6667%; }
.grid-xs-3 { width: 25%; }
.grid-xs-4 { width: 33.3333%; }
.grid-xs-5 { width: 41.6667%; }
.grid-xs-6 { width: 50%; }
.grid-xs-7 { width: 58.3333%; }
.grid-xs-8 { width: 66.6667%; }
.grid-xs-9 { width: 75%; }
.grid-xs-10 { width: 83.3333%; }
.grid-xs-11 { width: 91.6667%; }
.grid-xs-12 { width: 100%; }
}

/*======================================= Media Queries 0 to 767 All mobiles ========================================*/
@media screen and (max-width: 767px) {
.mobile-only { display: block }
.tab-only { display: none }
.wrapper { min-width: 320px; }
}

/*======================================= Media Queries 0 to 768 (Ipad Portrait View)=====================================*/
@media screen and (max-width:768px) {
.tab-mobile { display: block }
.logo { float: none; text-align: left; width: 100%; }
.nav { float: none; width: 100% }
/*form*/
.form-row .form-field { margin: 0; }
/*form end*/
.wrapper { }
.toggle-btn { background: #60af4d none repeat scroll 0 0; cursor: pointer; display: block; height: 40px; padding: 12px 0; position: absolute; right: 3%; top: 32px; width: 40px; z-index: 9; }
.toggle-btn span { background: none repeat scroll 0 0 #fff; display: block; height: 2px; margin: 0 auto 5px; width: 62%; }
.opened .toggle-btn span { display: none; }
.opened .toggle-btn span:first-child, .opened .toggle-btn span:last-child { display: block; position: absolute; transform: rotate(45deg); }
.opened .toggle-btn span:last-child { left: 8px; top: 19px; transform: rotate(-45deg); }
.opened .toggle-btn span:first-child { left: 9px; margin-top: 5px; top: 14px; }
.nav { position: fixed; right: -230px; width: 230px; top: 0; z-index: 100; height: 100%; transition: all 300ms ease; -moz-transition: all 300ms ease; -webkit-transition: all 300ms ease; overflow: auto; }
.nav li, .nav li:last-child { float: none; border-bottom: 1px solid #fff; }
.wrapper.opened .nav { background: #fff none repeat scroll 0 0; padding-top: 112px; right: 0; top: 0; z-index: 10001; }
.nav li a { padding: 10px; }
.header .nav .container { width: 100% }
.wrapper { width: 100%; transition: all 300ms ease; -moz-transition: all 300ms ease; -webkit-transition: all 300ms ease; }
.opened .toggle-btn { background: #fff none repeat scroll 0 0; z-index: 100001; }
.opened .toggle-btn span { background: #000 none repeat scroll 0 0; }
.nav li { border: medium none; display: block; float: none; width: 100%; }
.nav li.home { width: 100%; }
.nav li, .nav li:last-child { border-bottom: 1px solid #e6e6e7; float: none; }
.nav-overlay { background: rgba(0, 0, 0, 0.4) none repeat scroll 0 0; display: none; left: 0; position: fixed; top: 0; transition: opacity 800ms cubic-bezier(0.19, 1, 0.22, 1) 0ms; width: 100%; z-index: 99; }
.search-con { float: left; position: absolute; right: 140px; top: 171px; transition: all 2s ease 0s; width: 200px; z-index: 9; }
.search-con:hover { width: 50%; }
.nav ul::after, .footer-nav ul:after { clear: both; content: ""; display: block; }
}

@media screen and (min-width: 0) and (max-width:560px) {
.gym_info { font-size: 30px; line-height: 30px; }
.logo span { font-size: 10px; }
.w-50 {width: 100%;}
.ordinary-m {border-right:transparent;}
}

/*======================================= Media Queries 0 to 480px small screen reslolation mobile ============================*/
@media screen and (min-width: 0) and (max-width:480px) {
.logo { text-align: center; }
.gym_info { display: none; }
.search-con, .search-con:hover { width: 50%; transition: none }
}

/*======================================= Media Queries 0 to 320px ========================================*/
@media screen and (min-width: 0) and (max-width:320px) {
.social-link { padding-right: 5px; }
}

/*======================================= Footer CSS End ========================================*/

/*======================================= Above (768px) ipad Portrait ========================================*/
@media(min-width:769px) {/*For Desktop Only*/
.grid-1, .grid-2, .grid-3, .grid-4, .grid-5, .grid-6, .grid-7, .grid-8, .grid-9, .grid-10, .grid-11, .grid-12 { float: left; padding: 0 1% }
.grid-layout { margin: 0 -1% }
.grid-12 { width: 100%; float: none; }
.grid-11 { width: 91.66666666666666% }
.grid-10 { width: 83.33333333333334% }
.grid-9 { width: 75% }
.grid-8 { width: 66.66666666666666% }
.grid-7 { width: 58.333333333333336% }
.grid-6 { width: 50% }
.grid-5 { width: 41.66666666666667% }
.grid-4 { width: 33.33333333333333% }
.grid-3 { width: 25% }
.grid-2 { width: 16.666666666666664% }
.grid-1 { width: 8.333333333333332% }
.scrollTop { position: fixed; right: 20px; bottom: 20px; width: 40px; height: 40px; text-align: center; z-index: 6; display: none; background: #5C9EC9; border-radius: 5px; }
}
/*======================================= Above (768px) ipad Portrait  End ========================================*/
/*========================Gallery Page======================*/
.gallery_section {
    background: #f1f1f1;
}
.gallery_section h2 span { background: #f1f1f1;}
.gallery_section div { margin-bottom: 15px;}
.pd50 { padding: 50px;}
.pd50 { padding:25px 0;}