body {
    font-family: 'Rubik';
}

body * {
    direction: rtl;
}

th {
    text-align: center;
}

h1,
h2,
h3,
h4,
h5,
h6,
ul,
li,
p {
    padding: 0;
    margin: 0;
    list-style: none;
}

a {
    text-decoration: none !important;
    transition: 0.5s ease all;
    outline: none !important;
}

.boxs {
    display: block;
    width: 100%;
    float: right;
    margin-top: 0;
}

.forflex {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.nopadding {
    padding: 0;
}

.slick-initialized .slick-slide {
    outline: medium none !important;
}

i {
    font-style: normal;
}

h1 {
    font-size: 46px
}

span {
    position: relative;
}

.mar_rht {
    margin-right: 0px !important;
}

.mar_lft {
    margin-left: 0px !important;
}


/*home page css banner section*/

.main {
    background: url(../image/banner.jpg)no-repeat center center;
    background-size: cover;
    padding: 30px 0px;
    border-bottom: 6px solid #7abf43;
    position: relative;
    height: 100vh;
}

.main.boxs header+.container {
    min-height: calc(100% - 200px);
    position: relative;
}

.main::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    background: url(../image/overlay.png)no-repeat;
    background-size: cover;
    opacity: 0.7;
    z-index: 1;
    width: 100%;
    height: 200px;
    background-position: bottom center;
}

.whats {
    padding: 0px 15px;
    background-color: #0068ae;
    position: fixed;
    left: 0;
    top: 200px;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    z-index: 3;
}

.whats li {
    display: block;
    padding: 15px 0px;
    border-bottom: 1px solid #fff;
}

.whats li:last-child {
    border-bottom: none;
}

.whats li a:hover img {
    transform: rotate(-360deg);
    transition: 0.5s ease all;
}

.whats li img {
    width: 50px;
}

.hamburger {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #0068ae;
    border: 1px solid #fff;
    float: left;
    position: fixed;
    left: 5px;
    box-shadow: 0px 0px 13px 0px rgb(0 0 0 / 50%);
    z-index: 3;
    padding: 15px;
}

.hamburger a {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.header_top a {
    font-family: 'Heebo';
    font-size: 27px;
    color: #fff;
    padding: 10px;
    background: #428fc3e6;
    border-radius: 10px;
    float: left;
    border: 1px solid #e7f1f8;
}

.header_top a img {
    margin-left: 10px;
    width: 35px;
}

.header {
    background: #93cb66e6;
    border-radius: 25px;
    padding-left: 25px;
    margin-top: 10px;
    border: 1px solid #e4f2d8;
}

.logo {
    margin: -15px -15px -15px 0px;
}

.logo img {}

.navi li {
    display: inline-block;
    padding: 0px 17px;
    position: relative;
}

.navi li a {
    font-size: 20px;
    color: #fff;
}

.navi li:hover a {
    color: #0068ae;
}

.search .search_in {
    width: 160px;
    border-radius: 30px;
    border: 1px solid #fff;
    font-size: 20px;
    color: #fff;
    background: transparent;
    height: 35px;
    padding: 10px;
    outline: none;
    box-shadow: none;
    margin-right: 45px;
}

.search .search_in::placeholder {
    color: #fff;
}

.bann_con {
    padding-top: 9.5vw;
}

.ban_up {
    padding: 0px 20px 20px 30px;
    background-color: #0068aee6;
    width: 435px;
    border-radius: 20px;
}

.ban_up h3 {
    font-size: 34px;
    font-weight: 500;
    color: #fff;
    padding: 20px 60px;
    background-color: #009f47;
    display: inline-block;
    border-radius: 15px;
    position: relative;
    margin-top: -50px;
    margin-bottom: 25px;
}

.greenspot {
    position: absolute;
    right: -40px;
    top: -40px;
}

.ban_up p {
    font-size: 25px;
    color: #fff;
}

.blue_link {
    text-align: left;
}

.ban_up a {
    font-size: 17px;
    font-weight: bold;
    color: #fff;
    display: inline-block;
    margin-top: 20px;
}

.item_list {
    z-index: 2;
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 51%;
    transform: translateX(-50%) !important;
}

.item_list ul {
    position: relative;
    padding-top: 20px;
    padding-bottom: 245px;
}

.list_con {
    width: 155px;
    height: 155px;
    text-align: center;
    border-radius: 20px;
    position: absolute;
    z-index: 2;
    box-shadow: 0px 0px 13px 0px rgb(0 0 0 / 50%);
    transition: 0.5s ease all;
    -webkit-transition: 0.5s ease all;
    -moz-transition: 0.5s ease all;
    transform: scale(0.9);
    cursor: pointer;
}

.list_con:hover {
    transform: scale(1.1);
}

.item_inn {
    background-color: #f4f0ed;
    padding: 25px 15px;
    height: 100%;
    border-radius: 20px;
}

.list_con p {
    font-size: 20px;
    color: #575756;
    padding-top: 10px;
}

.pink .item_inn {
    box-shadow: 0px 19px 0px -1px #cc15cc;
}

.green .item_inn {
    box-shadow: 0px 19px 0px -1px #0e9443;
}

.yellow .item_inn {
    box-shadow: 0px 19px 0px -1px #e1c139;
}

.blue .item_inn {
    box-shadow: 0px 19px 0px -1px #3835e8;
}

.red .item_inn {
    box-shadow: 0px 19px 0px -1px #c61f42;
}

.orange .item_inn {
    box-shadow: 0px 19px 0px -1px #e68327;
}

.skyblue .item_inn {
    box-shadow: 0px 19px 0px -1px rgba(55, 154, 224, 1);
}

.skyblue {
    left: -20px;
    top: 50px;
}

.orange {
    left: 150px;
    top: 70px;
}

.red {
    left: 320px;
    top: 100px;
}

.blue {
    left: 490px;
    top: 110px;
}

.yellow {
    left: 660px;
    top: 100px;
}

.green {
    left: 830px;
    top: 70px;
}

.pink {
    left: 1000px;
    top: 50px;
}

.arrow {
    position: absolute;
    bottom: 5px;
    left: 49%;
    z-index: 2;
    width: 30px;
}


/*event section css*/

.events {
    padding: 50px 0px;
}

.events_inn h1 {
    color: #ed1e79;
    text-align: center;
    padding-bottom: 55px;
}

.events_inn h1 span {
    position: relative;
}

.events_inn h1 span::after {
    content: '';
    position: absolute;
    bottom: 0;
    width: 170px;
    height: 6px;
    background-color: #b5b5af;
    border-radius: 10px;
    bottom: -15px;
    left: 20%;
}

.event_nav {
    padding: 15px 0px;
    border-bottom: 1px solid #b5b5af;
}

.event_nav li {
    display: inline-block;
    margin: 0px 15px
}

.event_nav li a {
    font-size: 27px;
    color: #000;
    position: relative;
}

.event_nav li a.active {
    font-weight: bold;
}

.event_nav .search .search_in {
    border: 1px solid #b5b5af;
    color: #b5b5af;
}

.event_nav .search .search_in::placeholder {
    color: #b5b5af;
}

.event_nav li a::after {
    content: '';
    position: absolute;
    bottom: -20px;
    left: 0;
    width: 100%;
    height: 7px;
    border-radius: 10px;
    transition: 0.5s ease all;
}

.event_nav li a:hover::after {
    background-color: #ed1e79;
}

.ev_list_out,
.hug_list_out {
    width: 23.54%;
    display: inline-block;
    background-color: #fff;
    box-shadow: 0px 0px 13px 0px rgb(0 0 0 / 50%);
    border-radius: 20px;
    margin: 15px 7px;
}

.event_img,
.hug_img {
    box-shadow: 0px 20px 0px 0px #ed1e79;
    border-radius: 20px;
    margin-bottom: 15px;
}

.event_img img,
.hug_img img {
    width: 100%;
    border-radius: 20px;
    border-radius: 20px;
}

.event_con,
.hug_con {
    padding: 15px 10px;
    display: flex;
    min-height: 165px;
    text-align: center;
    position: relative;
}

.hug_con h6 {
    text-align: right;
}

.eve_rht h2,
.hug_rht h2 {
    font-size: 41.88px;
    font-weight: bold;
    color: #ed1e79;
}

.eve_rht h2 span,
.hug_rht h2 span {
    font-size: 17.72px;
    font-weight: normal;
    display: block;
}

.eve_rht i,
.hug_rht i {
    font-size: 10.74px;
    font-weight: normal;
    display: block;
    color: #000;
    padding: 5px;
    border-top: 1px solid #b5b5af;
    border-bottom: 1px solid #b5b5af;
}

.eve_rht p,
.hug_rht p {
    font-size: 17.72px;
    color: #000;
}

.eve_lft h6,
.hug_lft h6 {
    font-size: 19px;
    font-weight: bold;
    color: #4a4a4a;
}

.eve_lft p,
.hug_lft p {
    font-size: 17.72px;
    color: #4b4b4b;
    text-align: left;
    padding-top: 70px;
    position: absolute;
    bottom: 10px;
    left: 20px;
}

.hug_lft p {
    text-align: right;
    padding-top: 70px;
    right: 10px;
}

.more_events {
    text-align: center;
    padding-top: 20px;
}

.more_events a {
    font-size: 20.04px;
    color: #fff;
    padding: 15px 35px;
    background-color: #0068ae;
    display: inline-block;
    border-radius: 30px;
}

.more_events a img {
    margin-right: 10px;
}

.more_events a:hover {
    background-color: #56a80e;
}

.kits {
    padding: 50px 0px 100px;
    background: url(../image/back1.png)no-repeat center center;
    background-size: cover;
}

.kits_con {
    width: 23.54%;
    display: inline-block;
    background-color: #56a80e;
    box-shadow: 0px 0px 13px 0px rgb(0 0 0 / 50%);
    border-radius: 10px;
    margin: 15px 7px;
    overflow: hidden;
}

.kits_con h3 {
    font-size: 33px;
    color: #fff;
    font-weight: bold;
    padding: 25px 50px 0px 50px;
    text-align: center;
}

.connectwithus {
    padding: 50px 0px;
    position: relative;
}

.connect_white {
    border: 1px solid #fcbe11;
    padding: 0px 40px;
    border-radius: 20px;
    background-color: #fff;
}

.connect_green {
    padding: 10px 20px 30px;
    background-color: #56a80e;
    border-radius: 30px;
    margin-top: -48px;
}

.connect_green h3 {
    font-size: 33px;
    color: #fff;
    font-weight: bold;
}

.mail_img {
    margin-top: -90px;
    width: 65px;
}

.connect_inn {
    padding: 10px 10px 10px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.connect_inn p {
    font-size: 20px;
    color: #000;
}

.connect_inn p input {
    width: 100%;
    border: none;
    font-size: 20px;
    color: #000;
    outline: none;
    border-bottom: 1px #000 solid;
}

.connect_inn p input::placeholder {
    color: rgb(100, 100, 100);
}

.connect_inn a {
    font-size: 33px;
    color: #fff;
    font-weight: bold;
    padding: 10px 40px;
    background-color: #56a80e;
    border-radius: 20px;
}

.yellowspot1 {
    position: absolute;
    top: 0;
    left: 0;
}

.yellowspot2 {
    position: absolute;
    bottom: 0;
    right: 250px;
    z-index: -1;
}

.face_inner {
    padding: 50px 0px;
}

.face_inner h1 {
    color: #00539f;
    padding-bottom: 15px;
}

.face_inner h1 span {
    position: relative;
}

.face_inner h1 span::after {
    content: '';
    position: absolute;
    bottom: -15px;
    right: 0;
    width: 150px;
    height: 6px;
    background-color: #b5b5af;
    border-radius: 10px;
}

.facebookimg {
    padding-top: 30px;
}

footer {
    padding: 30px 0px;
    position: relative;
    background-color: #00539f;
    position: relative;
    overflow-x: hidden;
}

footer:before {
    content: "";
    position: absolute;
    top: 20px;
    right: -5%;
    left: -5%;
    height: 160px;
    background: #56a80e;
    -webkit-clip-path: ellipse(50% 100% at 50% 0%);
    clip-path: ellipse(50% 100% at 50% 0%);
}

footer:after {
    content: "";
    position: absolute;
    top: 0;
    right: -5%;
    left: -5%;
    height: 160px;
    background: #fff;
    -webkit-clip-path: ellipse(50% 100% at 50% 0%);
    clip-path: ellipse(50% 100% at 50% 0%);
}

.foot .contact {
    padding-top: 170px;
    padding-bottom: 20px;
    border-bottom: 1px solid #80a9cf;
    display: flex;
}

.foot .contact li {
    display: inline-block;
    text-align: center;
    width: 33%;
}

.foot .contact li a {
    font-family: 'Heebo';
    font-size: 27px;
    color: #fff;
}

.foot .contact li a img {
    margin: 0px auto;
}

.foot .contact li img {
    width: 80px;
}

.social_links {
    padding-top: 50px;
    justify-content: center;
}

.social_links li {
    display: inline-block;
    margin: 0px 10px;
}

.social_links li img {
    width: 50px;
    height: 40px;
}

.sidenavbar {
    width: 270px;
    background-color: #fff;
    border: 1px solid #b5b5af;
    position: fixed;
    top: 40px;
    left: 100px;
    z-index: 4;
    display: none;
}

.sidenavbar li {
    display: block;
}

.sidenavbar li a {
    font-size: 18px;
    color: #000;
    padding: 10px;
    border-bottom: 1px solid #b5b5af;
    display: block;
    background-color: #fff;
}

.sidenavbar li a img {
    margin-left: 10px;
}

.sidenavbar li:last-child a {
    border: none;
}

.closeside a {
    font-size: 26px;
    color: #000;
    display: inline-block;
    margin-right: 10px;
}

.sidenavbar li a:hover,
.sidenavbar li a.active {
    color: #fff;
    background-color: #0068ae;
}

.sub_nav {
    border-bottom: 1px solid #b5b5af;
    display: none;
}

.sub_nav li a {
    border: none;
    background-color: transparent;
    padding: 5px 30px;
}

.sub_nav li a:hover {
    background-color: transparent;
    color: #0068ae;
}


/*general banner css*/

.banner {
    padding-top: 30px
}

.gbanner {
    background: url('../image/generalbanner.png')no-repeat center center;
    background-size: cover;
}

.banner_in {
    padding: 20px 0px;
    text-align: center;
    background-color: #529fd3cc;
    border-top-left-radius: 8px;
    border-top-right-radius: 20px;
    margin-top: 40px;
}

.breadcrum li {
    font-size: 14px;
    color: #fff;
    display: inline-block;
}

.breadcrum li a {
    font-size: 14px;
    color: #fff;
}

.breadcrum li.active {
    font-weight: bold;
}

.banner_in h1 {
    color: #fff;
    padding: 10px 0px;
}

.gencon {
    padding: 35px 0px;
}

.gencon_lft h3 {
    font-size: 39px;
    color: #255ba2;
    padding-bottom: 15px;
}

.gencon_lft h3 span::after {
    content: '';
    position: absolute;
    bottom: -15px;
    right: 0;
    width: 75px;
    height: 6px;
    background-color: #255ba2;
}

.gencon_lft p {
    font-size: 18px;
    color: #000;
    padding-top: 20px;
}

.gencon_rht {
    border: 1px solid #fff;
    box-shadow: 0px 0px 13px 0px rgb(0 0 0 / 50%);
    border-radius: 20px;
    margin-bottom: 50px;
}

.gencon_rht img {
    width: 100%;
}

.gencon_lft {
    margin-bottom: 50px;
}

.gencon_inn {
    position: relative;
}

.genspot_lft {
    position: absolute;
    left: -135px;
    top: 70px;
}

.genspot_rht {
    position: absolute;
    right: -150px;
    bottom: 70px;
    z-index: -1;
}


/*calendar page css*/

.banner2 {
    background: url(../image/banner2.png)no-repeat center center;
    background-size: cover;
}

.banner2 .banner_in {
    background-color: #f1589bcc;
}

.event_page .events_inn h1 span::after {
    left: -7%;
}

.event_page .events_inn h3 {
    font-size: 31px;
    color: #b5b5af;
    text-align: center;
    padding-top: 15px;
}

.arrow_left {
    transform: rotate(90deg);
    margin-right: 25px;
}

.arrow_rht {
    transform: rotate(-90deg);
    margin-left: 25px;
}

.events_inn {
    position: relative;
}

.eventspot {
    position: absolute;
    left: -155px;
    top: 180px;
    transform: rotateY(180deg);
    z-index: -1;
}


/*community page css*/

.banner2 .orange_ban {
    background-color: #e68327cc;
}

.orange_ban_lft h3 {
    color: #e68327;
}

.contact_person ul {
    padding: 35px 0px;
    border-bottom: 1px solid #e68327;
    display: flex;
}

.contact_person li {
    display: inline-block;
    margin: 0px 10px;
}

.contact_person li a span {
    width: 55px;
    height: 55px;
    border-radius: 50%;
    border: 1px solid #7abf43;
    overflow: hidden;
    display: inline-block;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 10px;
    padding: 10px;
}

.contact_person li a {
    font-family: 'Heebo';
    font-size: 19px;
    font-weight: bold;
    color: #00539f;
    display: flex;
}

.contact_person li a i {
    display: block;
    font-weight: normal;
}

.childplay li {
    font-size: 32px;
    color: #e68327;
    padding: 15px;
    border: 2px solid #e68327;
    display: inline-block;
    margin: 7px;
    width: 31.85%;
    border-radius: 15px;
    line-height: 1;
    min-height: 98px;
}

.childplay li a {
    display: flex;
    align-items: center;
}

.childplay li img {
    margin-left: 15px;
    width: 65px;
}


/*event_inner page*/

.eventimg2 {
    border-radius: 40px;
}

.event_inner .events_inn h1 span::after {
    left: 30%;
}

.event_inner .event_list {
    padding: 75px 0px;
}

.event_con2 {
    display: block;
}

.event_con2 h1 {
    color: #ed1e79;
    font-weight: bold;
    text-align: right;
}

.event_con2 h1 i {
    font-weight: normal;
    display: block;
}

.event_con2 h4 {
    color: #ed1e79;
    font-size: 29px;
    text-align: right;
}

.event_con2 .more_events {
    text-align: right;
}

.contact_lft p {
    font-size: 18px;
    color: #000;
    padding-bottom: 10px;
}

.contact_lft a {
    font-size: 20.04px;
    color: #0068ae;
    display: inline-block;
    border: 1px solid #0068ae;
    padding: 10px 25px;
    border-radius: 30px;
    margin-top: 20px;
}

.contact_lft a:hover {
    background-color: #0068ae;
    color: #fff;
}

.contact_rht h4 {
    font-size: 29px;
    color: #575756;
    padding-bottom: 20px;
}

.contact_rht .form-control {
    height: 52px;
    color: #000;
    font-size: 18px;
    outline: none;
    box-shadow: none;
    border: 1px solid #b5b5af;
    border-radius: 0px;
}

.contact_rht .form-control::placeholder {
    color: #000;
}

.contact_rht button {
    color: #ed1e79;
    border: 1px solid #ed1e79;
    font-size: 29px;
    text-align: center;
    width: 100%;
    padding: 15px 0px;
    border-radius: 30px;
    background-color: #fff;
    margin-top: 20px;
    outline: none;
    box-shadow: none;
}

.contact_rht button:hover {
    background-color: #ed1e79;
    color: #fff;
}

.mobile_head {
    display: none;
    background-color: #0068ae;
    padding-left: 10px;
    position: fixed;
    top: 0;
    left: 0;
    box-shadow: 4px 4px 7px rgb(0 0 0 / 25%);
    z-index: 3;
}

.mobile_head ul {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.mobile_head li {
    display: inline-block;
}

.logo_mob img {
    width: 70px;
}

.logo_mob {
    padding: 5px;
    background-color: #8bc356;
}

.drop_links {
    font-size: 23px;
    color: #000;
    width: 100%;
    border: 1px solid #b5b5af;
    padding: 10px;
    border-radius: 30px;
    margin-top: 15px;
    outline: none;
    box-shadow: none;
    display: none;
    height: 50px;
}

.drop_links:focus {
    outline: none;
    box-shadow: none;
    border: 1px solid #b5b5af;
}

.error_body {
    background-color: #ed1e79;
}

.error {
    width: 100%;
    color: #fff;
    height: 100vh;
    text-align: center;
}


/*animation*/

@-webkit-keyframes slideInUp {
    0% {
        opacity: 0;
        transform: translateY(50%);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes slideInUp {
    0% {
        opacity: 0;
        transform: translateY(50%);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

@-webkit-keyframes slideInDown {
    0% {
        opacity: 0;
        transform: translateY(-50%);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes slideInDown {
    0% {
        opacity: 0;
        transform: translateY(-50%);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

@-webkit-keyframes slideInleft {
    0% {
        opacity: 0;
        transform: translateX(50%);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes slideInleft {
    0% {
        opacity: 0;
        transform: translateX(50%);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

@-webkit-keyframes slideInRight {
    0% {
        opacity: 0;
        transform: translateX(-50%);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes slideInRight {
    0% {
        opacity: 0;
        transform: translateX(-50%);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-webkit-keyframes zoomIn {
    0% {
        opacity: 0;
        transform: scale(0.5);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes zoomIn {
    0% {
        opacity: 0;
        transform: scale(0.5);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

@-webkit-keyframes zoomReverseIn {
    0% {
        opacity: 0;
        transform: scale(1.5);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes zoomReverseIn {
    0% {
        opacity: 0;
        transform: scale(1.5);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

[data-animation] {
    opacity: 0;
    -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
}

.animations-disabled,
.animations-disabled [data-animation] {
    -webkit-animation: none !important;
    animation: none !important;
    opacity: 1 !important;
}

.slideInUp {
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp;
}

.slideInDown {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown;
}

.slideInLeft {
    -webkit-animation-name: slideInleft;
    animation-name: slideInleft;
}

.slideInRight {
    -webkit-animation-name: slideInRight;
    animation-name: slideInRight;
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
}

.zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn;
}

.zoomReverseIn {
    -webkit-animation-name: zoomReverseIn;
    animation-name: zoomReverseIn;
}

.modal-dialog {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    margin: 0px auto;
    width: 600px;
}

.modal-content {
    background-color: #00539f;
    padding: 40px;
    margin: 0px 15px;
}

.modal-body {
    padding: 0px;
}

.modal-content ul {
    padding: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}

.close_modal {
    opacity: 1;
    font-size: 30px;
    font-weight: bold;
    color: #fff;
    display: inline-block;
    margin-top: -24px;
}

.close_modal:hover {
    color: #fff;
}

.sub_nav2 {
    background-color: #0068aee6;
    position: absolute;
    padding: 10px;
    width: 200px;
    left: -50px;
    display: none;
}

.sub_nav2 li {
    display: block;
}

.sub_nav2 li a {
    color: #fff!important;
}

.sub_nav2 li a:hover {
    color: #009f47!important;
}

.navi li:hover .sub_nav2 {
    display: block;
}


/*contact page*/

.conabanner {
    background: url(../image/contact.png)no-repeat center center;
    background-size: cover;
}

.conabanner .banner_in {
    background-color: rgb(0 104 174 / 80%);
}

.contact {
    padding: 70px 0px;
}

.contact_in {
    position: relative;
}

.con_lft h4 {
    font-size: 29px;
    color: #575756;
}

.con_lft p {
    font-size: 18px;
    color: #000000;
}

.con_lft_in {
    padding: 20px 0px;
    border-bottom: 2px solid #c1c1c1;
}

.contact .contact_form {
    padding: 20px 0px;
}

.con_lft .form-control {
    font-size: 18px;
    color: #000000;
    border: 1px solid #c1c1c1;
    height: 60px;
    outline: none;
    box-shadow: none;
}

.con_lft .form-control::placeholder {
    color: #000000;
}

.form-group {
    position: relative;
}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    text-indent: 1px;
    text-overflow: '';
}

.select_arrow {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 60px;
}

.con_lft textarea.form-control {
    height: 227px;
    resize: none;
}

.contactspot {
    top: -56px;
    left: -90px;
}

.contact_rht iframe {
    width: 100%;
}

.captcha {
    background-color: #f9f9f9;
    border: 2px solid #d3d3d3;
    border-radius: 5px;
    color: #4c4a4b;
    display: flex;
    justify-content: center;
    align-items: center;
}

.captcha .text {
    font-size: 12px;
    color: #000000
}

.spinner {
    position: relative;
    width: 20px;
    height: 20px;
    display: flex;
    margin: 20px 10px;
    align-items: center;
    justify-content: center;
}

input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    z-index: -1;
}

.spinner input[type="checkbox"]+.checkmark {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-color: #fff;
    border: 2.5px solid #c3c3c3;
    border-radius: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.spinner input[type="checkbox"]+.checkmark span {
    content: '';
    position: relative;
    /*
	position:absolute;
	border-bottom:3px solid;
	border-right:3px solid;
	border-color:#029f56;*/
    margin-top: -3px;
    transform: rotate(45deg);
    width: 8px;
    height: 12px;
    opacity: 0;
}

.spinner input[type="checkbox"]+.checkmark>span:after {
    content: '';
    position: absolute;
    display: block;
    height: 3px;
    bottom: 0;
    left: 0;
    background-color: #029f56;
}

.spinner input[type="checkbox"]+.checkmark>span:before {
    content: '';
    position: absolute;
    display: block;
    width: 3px;
    bottom: 0;
    right: 0;
    background-color: #029f56;
}

.spinner input[type="checkbox"]:checked+.checkmark {
    animation: 2s spin forwards;
}

.spinner input[type="checkbox"]:checked+.checkmark>span {
    animation: 1s fadein 1.9s forwards;
}

.spinner input[type="checkbox"]:checked+.checkmark>span:after {
    animation: .3s bottomslide 2s forwards;
}

.spinner input[type="checkbox"]:checked+.checkmark>span:before {
    animation: .5s rightslide 2.2s forwards;
}

@keyframes fadein {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes bottomslide {
    0% {
        width: 0;
    }
    100% {
        width: 100%;
    }
}

@keyframes rightslide {
    0% {
        height: 0;
    }
    100% {
        height: 100%;
    }
}

.logo_cap {
    display: flex;
    flex-direction: column;
    align-items: center;
    height: 100%;
    align-self: flex-end;
    margin: 5px 10px;
}

.logo_cap img {
    height: 20px;
    width: 20px;
}

.logo_cap p {
    color: #000000;
    margin: 0;
    font-size: 10px;
    /*	font-weight:700;*/
    margin: 5px 0 2px 0;
}

.logo_cap small {
    color: #000000;
    margin: 0;
    font-size: 8px;
}

@keyframes spin {
    10% {
        width: 0;
        height: 0;
        border-width: 6px;
    }
    30% {
        width: 0;
        height: 0;
        border-radius: 50%;
        border-width: 1em;
        transform: rotate(0deg);
        border-color: rgb(199, 218, 245);
    }
    50% {
        width: 2em;
        height: 2em;
        border-radius: 50%;
        border-width: 4px;
        border-color: rgb(199, 218, 245);
        border-right-color: rgb(89, 152, 239);
    }
    70% {
        border-width: 4px;
        border-color: rgb(199, 218, 245);
        border-right-color: rgb(89, 152, 239);
    }
    90% {
        border-width: 4px;
    }
    100% {
        width: 2em;
        height: 2em;
        border-radius: 50%;
        transform: rotate(720deg);
        border-color: transparent;
    }
}

.agree label {
    font-size: 18px;
    color: #000;
    margin: 0px;
    font-weight: normal;
    cursor: pointer;
    display: flex;
    align-items: center;
}

.agree label span {
    width: 20px;
    height: 20px;
    margin-left: 20px;
    border: 2.5px solid #c3c3c3;
    display: inline-block;
    position: relative;
}

.agree input[type="checkbox"]:checked+label span::after {
    content: url(../image/tick.png);
    top: -5px;
    left: 2px;
    position: absolute;
}

.form_btn button {
    font-size: 29px;
    width: 250px;
    border: 1px solid;
    border-radius: 30px;
    background-color: #fff;
    outline: none;
    margin-top: 15px;
}

.grey_btn {
    color: #b5b5af;
    border-color: #b5b5af;
}

.grey_btn:hover {
    background-color: #b5b5af;
    color: #fff;
}

.pink_btn {
    color: #ed1e79;
    border-color: #ed1e79;
    margin-right: 50px;
}

.pink_btn:hover {
    background-color: #ed1e79;
    color: #fff;
}

.sub_nav2 {
    background-color: #0068aee6;
    position: absolute;
    padding: 10px;
    width: 200px;
    left: -50px;
    display: none;
    z-index: 99;
}

.connect_inn form {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.connect_inn form input[type=submit] {
    box-shadow: none;
    border: none;
    padding: 10px 39px;
    border-radius: 10px;
    font-size: 20px;
    font-weight: bold;
    background: #57a80f;
}

.activity h1 {
    color: #ed1e79;
    text-align: center;
    padding-bottom: 60px;
}

.activity h1 span {
    position: relative;
}

.activity h1 span::after {
    content: '';
    position: absolute;
    bottom: 0;
    width: 170px;
    height: 6px;
    background-color: #b5b5af;
    border-radius: 10px;
    bottom: -15px;
    left: 13%;
}

.activity {
    padding: 50px 0px;
}

.activity_category {
    display: flex;
}

.activity_category li {
    display: inline-block;
    background-color: #7abf43;
    width: 25%;
    padding: 30px;
    text-align: center;
    margin: 0px 5px;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    cursor: pointer;
}

.activity_category li a {
    font-size: 18px;
    color: #fff;
}

.activity_category li.active {
    background-color: #00539f;
    font-weight: bold;
}

.category_set {
    background-color: #00539f;
    padding: 60px 0px;
    margin: 0px 5px;
    width: 99.1%;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
}

.category_set li {
    font-size: 18px;
    color: #fff;
    display: inline-block;
    text-align: center;
    width: 14%;
}

.category_set li span {
    display: block;
    margin-top: 10px;
}

@media(max-width:1199px) {
    .category_set li {
        width: 13.9%;
    }
}

@media(max-width:767px) {
    .category_set {
        width: 98.9%;
        margin: 0px 3px;
    }
    .activity_category li {
        padding: 20px 10px;
        margin: 0px 3px;
    }
    .activity_category li a {
        font-size: 17px;
    }
    .category_set {
        padding-top: 30px;
    }
    .category_set ul {
        display: flex;
        flex-wrap: wrap;
    }
    .category_set li {
        width: 25%;
        font-size: 17px;
        margin-top: 30px;
    }
}

@media(max-width:500px) {
    .activity_category li {
        padding: 10px 5px;
    }
    .activity_category li a {
        font-size: 15px;
    }
    .category_set li img {
        width: 60px;
        height: 60px;
    }
}

@media(max-width:414px) {
    .category_set li img {
        width: 40px;
        height: 40px;
    }
    .category_set li {
        font-size: 15px;
    }
    .activity_category li {
        margin: 0px 1px;
    }
    .category_set {
        width: 99.5%;
        margin: 0px 1px;
    }
}

.table_responsive_new {
    border: none !important;
}

.table_responsive_new tr {
    border: none !important;
    border-bottom: 2px solid #ddd !important;
    background-color: unset !important;
    padding: 0 !important;
}

.activity_inner {
    padding: 50px 0px;
}

.activity_category {
    display: flex;
}

.activity_category li {
    display: inline-block;
    background-color: #7abf43;
    width: 25%;
    padding: 30px;
    text-align: center;
    margin: 0px 5px;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    cursor: pointer;
}

.activity_category li a {
    font-size: 18px;
    color: #fff;
}

.activity_category li.active {
    background-color: #00539f;
    font-weight: bold;
}

.category_set {
    background-color: #00539f;
    padding: 60px 40px;
    margin: 0px 5px;
    width: 99.1%;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
}

.category_set li {
    font-size: 18px;
    color: #fff;
    display: inline-block;
    text-align: center;
    width: 14%;
}

.activit li img {
    width: 50% !important;
}

.category_set li img {
    width: 30px;
}

.category_set li span {
    display: block;
    margin-top: 10px;
}

input[type="time"]::-webkit-calendar-picker-indicator {
    background: none;
}

.checkdiv {
    width: 0px;
    height: 0px;
    visibility: hidden;
}

.check_label {
    position: relative;
    cursor: pointer;
}

.tick {
    display: none;
}

input[type="checkbox"]:checked+label .tick {
    display: inline-block;
}

input[type="checkbox"]:checked+label .green_circle {
    display: none;
}

.diffb .form--bar span:last-child {
    float: initial;
    display: block;
    margin: 0px auto;
}

.diffb .form--bar {
    float: left;
}

.form--bar {
    padding-top: 15px;
}

.form--bar label {
    font-size: 18px;
    color: #fff;
    font-weight: bold;
}

.form--bar input {
    font-family: 'Rubik';
    color: #575756;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    background: #fff;
    border-radius: 10px;
    margin: 0 10px;
    width: 120px;
    height: 45px;
    outline: none;
    border: 0px;
}

.form--bar span:last-child {
    float: left;
}

.form--bar input[type=submit] {
    width: 150px;
    color: #fff;
    background: #7abf43;
}

.drop_mob {
    display: none;
}

.category_set.set4 {
    padding: 20px 40px 15px 40px;
}

.category_set h6 {
    font-size: 18px;
    font-weight: bold;
    color: #fff;
    text-align: center;
    padding-bottom: 30px;
}

.range {
    padding: 20px 0px;
    border-bottom: 1px solid #c0d5e7;
}

.irs--flat .irs-line {
    top: 10px;
    height: 10px;
    background-color: #fff;
    border-radius: 10px;
}

.irs--flat .irs-bar {
    top: 10px;
    height: 10px;
    background-color: #7abf43;
}

.irs-grid {
    height: 30px;
}

.irs-grid-pol,
.irs-grid-pol.small {
    height: 14px;
    background: #fff;
}

.irs--flat .irs-grid-text {
    font-size: 18px;
    color: #fff;
}

.irs-from,
.irs-to,
.irs-single {
    top: -33px;
}

.irs--flat .irs-from,
.irs--flat .irs-to,
.irs--flat .irs-single {
    border-radius: 3px;
    background: #fff;
    color: #00539f;
    padding: 5px 10px;
    text-align: center;
    font-size: 18px;
    width: 40px;
}

.irs--flat .irs-from:before,
.irs--flat .irs-to:before,
.irs--flat .irs-single:before {
    bottom: -13px;
    left: 13px;
    margin-left: 0px;
    overflow: hidden;
    border: 7px solid transparent;
    border-top-color: #fff;
}

.irs--flat .irs-handle {
    width: 20px;
    height: 20px;
    left: -10px;
    top: 6px;
    background: #7abf43;
    border: 3px solid #fff;
    border-radius: 20px;
}

.irs--flat .irs-handle>i:first-child {
    display: none;
}

.irs-min,
.irs-max {
    visibility: hidden !important;
}