//======      index page 2  scss start      =======   //
.index2-first-wrapper {
    width: 100%;
    // background-image: url('../images/index-2-bg-img.png');
    background-image: linear-gradient(to right, #ec018c, #f01a86, #f2297f, #f5357a, #f64075);
    background-position: center center;
    background-repeat: repeat;
    background-size: cover;
    height: 1000px;
    position: relative;
    margin: 0;
    padding: 0;
    &::after {
        content: '';
        position: absolute;
        display: block;
        top: 0;
        right: 0;
        background-image: url('../images/index2-side-img.png'); 
        background-repeat: no-repeat;
        background-size: cover;
        margin: 0;
        padding: 0;
        width: 700px; 
        height: 1000px;
    }

    &::before {
        content: '';
        position: absolute;
        display: block;
        bottom: 0;
        left: 0;
        background-image: url('../images/index-shape-1.png');
        background-repeat: no-repeat;
        background-size: cover;
        margin: 0; 
        padding: 0;
        width: 340px;
        height: 100px;
    }

    .shape-wrap {
        position: relative;

        &::before {
            content: '';
            display: block;
            top: 290px;
            left: 37px;
            width: 177px;
            height: 476px;
            position: absolute;
            background-image: url('../images/index2-shape-2.png');
            background-repeat: no-repeat;
            background-size: cover;
            animation: swing ease-in-out 1s infinite alternate;
        }
    }

    .index-inner-wrap-1 {
        position: absolute;
        top: 25%;
        left: 14%;
        max-width: 800px;
        p {
            a {
                font-size: 16px;
                color: #ffffff;
                text-transform: uppercase;
                letter-spacing: 10px;
            }
        }

        h1 {
            margin-top: 27px;

            a {
                font-size: 70px;
                color: #ffffff;
                font-family: "Lato", sans-serif;
                font-weight: 300;
            }
        }

        .para-wrap-1 {
            color: #ffffff;
            font-family: "Lato", sans-serif;
            margin-top: 37px;
        }

        .index-btn {
            margin-top: 26px;
        }
    }

    .index-inner-wrap-2 {
        position: relative;
        background-color: #ffffff;
        width: 1070px;
        height: 170px;
        padding: 58px 68px;
        box-shadow: 0 20px 46px 12px #b60e0e0d;
        margin-top: 40px;
        z-index: 6;
        .change-box {
            display: flex;
            align-items: center;
            column-gap: 22px;
            label {
                width: 55px;
                float: left;
                color: #797979;
            }

            .label-2nd {
                width: 125px;
            }
            .custum-select {
                width: calc(100% - 60px);
                float: left;
                margin-left: 5px;
                .dropdown {
                    &:hover{
                    background-color: #ec008c;
                    color: #ffffff;
                    }
                    &:focus{
                        background-color: #ec008c !important;
                        color: #ffffff;
                    }
                }
                .open {
                    background-color: #ec008c !important;
                }
                .option.selected {
                    background: #ec008c;
                    &:hover{
                        background-color: #ec008c !important;
                        color: #ffffff;
                    }
                }
                 .option:hover, .option:focus {
                    background-color: #ec008c !important;
                    color: #ffffff;
                }
            }
            .custum-range {
                width: calc(100% - 125px);
                float: left;

                .ui-slider-horizontal {
                    height: 1px;
                    border: none;
                    background: #bababa;

                    .ui-slider-range {
                        height: 3px;
                      
                        top: 50%;
                        transform: translateY(-50%);
                    }

                    
                }
            }
        }
    }
}
// right-sidebar css  //
.right-sidebar-2{
   .sidebar-contant{
    a.main-btn, button.main-btn {
             background: #ec008c;  
             background: -webkit-linear-gradient(to right, #fc6767, #ec008c);  
             background: linear-gradient(to right, #fc6767, #ec008c); 
      }
   }
}
//  dating wrapper start  //
.dating-wrapper-2{
    position: relative;
      &::before{
        content:'';
        display: block;
        position:absolute;
        bottom: 45px;
        left: 80px;
        width: 150px;
        height: 406px;   
        background-image: url('../images/dating-index2-shape.png');
        background-repeat: no-repeat;
        background-size:cover;
        animation: swing ease-in-out 1s infinite alternate;
      }
      .heading{
        h2{
            font-size:40px;
             font-family: "Lato", sans-serif;
        }
    }
    .dating-content{
        .detail-box{
        margin-top: 35px;
         p{
            font-family: $asim-font;
            color:#ef2095;
            font-size:51px;
         }
         h5{
            margin-top: 15px;
            a{
            font-size: 20px;
            font-family:"Lato", sans-serif;
            color:#111111;
            }
           }
           h6{
            margin-top: 10px;
            a{
            font-size: 16px;
            font-family:"Lato", sans-serif;
            color:#a2a1a1;
            }
           }
        }
    }
}
// dating wrapper end  //

//   counter wrapper start  //
.counter-section-2{
      background-color: #f6f7f9;
      .counter-box-2 {
        max-width:135px;
        margin:0 auto;
        .counter-icon-2{
          position:relative;
          height: 128px;
          position: relative;
          border: 3px solid transparent;
          width: 126px;
          padding: 25px;
          background: #ec008c;  
          background: -webkit-linear-gradient(to right, #fc6767, #ec008c);  
          background: linear-gradient(to right, #fc6767, #ec008c); 
          box-shadow: 0px 3px 15px rgba(0,0,0,0.2);
          transition: .3s;
            &::after{
                border-radius:0px !important;
            }
            img{
                display: block;
                margin: 0 auto;
            }
            &:hover{
                border:4px solid #ffffff;
                box-shadow: 0px 20px 40px rgba(0,0,0,0.4);
                transform: scale(1.05,1.05);
            }
       }
       .counter-text-2{
            margin-top: 30px;
            text-align: center;
            .counter{
                font-size: 46px;
                color:#3d3d3d;
            }
            p{
                font-size: 18px;
                color:#3d3d3d;
                margin-top: 20px;
                transition:all 0.5s;
            }
            &:hover{
               p{
                color:#ef2095;
               }
               .counter{
                color:#ef2095;
               }
            }
       }
    }
 }

// counter wrapper end  //

//   doctor  love  css start  //
.doctor-love-2{
    position: relative;
    width:100%;
    height:100%;
    .heading{
        h2{
            font-size:40px;
             font-family: "Lato", sans-serif;
        }
        p{
            margin: 0 auto;
            max-width: 640px;
        }
    }
    .love-calculater {
        position: relative;
        z-index: 2;
        .calc-inner-box{
            position:relative;
            z-index:2;
            .love-inner-box{
                // padding-left: 115px;
                width:100%;
                .enter-name1{
                    margin-bottom: 25px;
                    label{
                        display: block;
                        text-align: left;
                        font-size:24px;
                        font-family: $cont-font;
                        color:#797979;
                        margin-bottom: 20px;
                    }
                    input{
                        display: block;
                        color:#ef2095;
                        padding: 30px 0px;
                        padding-left: 40px;
                        background-color: #f7f7f7;
                        border: 2px solid #e2e2e2;
                        width:100%;
                        outline: none;
                    }
                }
                .enter-name2{
                    label{
                        display: block;
                        text-align: left;
                        font-size:24px;
                        font-family: $cont-font;
                        color:#797979;
                        margin-bottom: 20px;
                    }
                    input{
                        display: block;
                        color:#ef2095;
                        padding: 30px 0px;
                        padding-left: 40px;
                        background-color: #f7f7f7;
                        border: 2px solid #e2e2e2;
                        width:100%;
                        outline: none;
                    }
                }
            }
            .calculat-love{
                margin-top: 25px;
                .index2-btn2{
                    margin:unset !important;
                    padding: 0px 30px;
                }
            }
        }
    }
    &::after{
    content: "";
    position: absolute;
    display: block;
    bottom: 0;
    width: 100%;
    height: 300px;
    background-image: url(../images/sweet-bottom-img-2.png);
    background-repeat: no-repeat;
    background-size: cover;
    }
    &::before{
        content: "";
        position: absolute;
        display: block;
        right: 60px;
        top: 345px;
        width: 108px;
        height: 290px;
        background-image: url(../images/contact-shape-img-1.png);
        background-repeat: no-repeat;
        background-size: cover;
        z-index: 9;
        animation: swing ease-in-out 1s infinite alternate;
        }
}

//   doctor love end //

//   awesome slider css start  //
.how-it-work-2{
    position:relative;
    .heading{
        h2{
            font-size:40px;
             font-family: "Lato", sans-serif;
        }
        p{
            margin: 0 auto;
            max-width: 640px;
        }
    }
    .awesome-slider{
        .awesome-slider-box{
            box-shadow: 0 -12px 46px 12px #b60e0e0d;
            width:100%;
            height:365px;
            .aw-img-box{
              img{
                width:100%;
              }
            }
            .aw-tect-box{
                background-color: #ffffff;
                text-align: center;
                height:95px;
                padding: 18px 0px 0px 0px;
                transition: all 0.5s;
                h6{
                    a{
                        font-size:20px;
                        font-family:"Lato", sans-serif;
                        color:#93979b;
                        transition:all 0.5s;
                    }
                    &hover{
                        color:#111111;
                    }
                }
                p{
                    font-family:$cont-font;
                    color:#93979b;
                    padding: 15px 0px 0px 0px;
                }
                &:hover{
                    background: #ec008c;  
                    background: -webkit-linear-gradient(to right, #fc6767, #ec008c);  
                    background: linear-gradient(to right, #fc6767, #ec008c); 
                    p{
                        color:#ffffff;
                    }
                    a{
                        color:#ffffff;
                    }
                }
            }
        }
        .owl-carousel {
            .owl-nav{
                display: block;
                position: absolute;
                top:50%;
                width:100%;
                    .owl-prev{
                        width: 35px;
                        height: 35px;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        position: absolute;
                        left: -11%;
                        transition:all  0.5s;
                        span{
                            font-size: 50px;
                            color:#ec008c;
                            margin-bottom: 3px;
                            &:hover{
                                color: #ffffff;
                                fill: #ffffff;
                            }
                        }
                        &:hover{
                            background: #ec008c;  
                            background: -webkit-linear-gradient(to right, #fc6767, #ec008c);  
                            background: linear-gradient(to right, #fc6767, #ec008c); 
                            box-shadow: 0 -12px 46px 12px #b60e0e0d;
                            border-radius: 55px;
                            span{
                                color: #ffffff;
                                fill: #ffffff;
                            }
                        }
                    }
                    .owl-next{
                        width: 33px;
                        height: 30px;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                        position: absolute;
                        right: -11%;
                        span{
                            font-size: 50px;
                            margin-bottom:3px;
                            color:#ec008c;
                            &:hover{
                                color: #ffffff;
                                fill: #ffffff;
                            }
                        }
                        &:hover{
                            background: #ec008c;  
                            background: -webkit-linear-gradient(to right, #fc6767, #ec008c);  
                            background: linear-gradient(to right, #fc6767, #ec008c); 
                            box-shadow: 0 -12px 46px 12px #b60e0e0d;
                            border-radius: 55px;
                            span{
                                color: #ffffff;
                                fill: #ffffff;
                            }
                        }
                 }
            }
         }
     }
     .awesome-btn{
        width:100%;
        clear: both;
        padding-top: 45px;
     }
}

// awesome slider css end   //

// sweet wrap css start  //
.blog-wrap-2{
   position:relative;
   width:100%;
   height:100%;
    .heading{
        h2{
            font-size:44px;
            font-family:"Lato", sans-serif;
        }
        p{
            margin: 0 auto;
            max-width: 640px;
        }
    }
   &::before{
    content:'';
    position:absolute;
    display: block;
    bottom:0;
    width:100%;
    height:300px;
    background-image: url('../images/sweet-bottom-img-2.png');
    background-repeat: no-repeat;
    background-size: cover;
   }
   .blog-btn-box{
     width: 100%;
    padding-top: 50px;
    clear: both;
   }
}
//   sweet wrap css end  //
// work section start  //
.how-it-work-3{
    position:relative;
    width:100%;
    height:100%;
    clear: both;
    background-color: #f6f7f9 !important;
    .heading {
            h2{
                font-size:44px;
                font-family:"Lato", sans-serif;
            }
            p{
                margin: 0 auto;
                max-width: 640px;
            }
    }
    .counter-box-2{
           position:relative;
        .counter-icon{
              width:95px; 
              height:95px;
              border:2px solid #828282;
              border-radius:50px;
              position:relative;
              margin: 0 auto;
              transition: all 0.5s;
              img{
                  display:block;
                  margin: 0 auto;
                  padding: 19px 0px;
              }
              span{
                position: absolute;
                left: 3%;
                top: -10px;
                color: #ffffff;
                background:#ec008c ;
                display: inline-block;
                text-align: center;
                width: 29px;
                height: 29px;
                line-height: 29px;
                border-radius: 50%;
                z-index: 9;
            }
            &:hover{
                background-color: #ffffff;
                border:2px solid #ec008c;
            }
          }
          .counter-text-2{
            margin-top: 22px;
              h5{
                  font-size:20px;
                  font-family: "Lato", sans-serif;
                  color:#747576;
                  text-align: center;
              }
              span{
                color:#bdbdbe;
                display: inline-block;
                text-align: center;
                width:100%;
                margin-top: 15px;
              }
          }
      }
      .position-div{
        position:relative;
        &::before{
            content: "";
            display: block;
            position: absolute;
            width: 40%;
            height: 17px;
            bottom: 70%;
            left: 85%;
            background-image: url('../images/wave-arrow.png');
            background-repeat: no-repeat;
            background-size: cover;
        }
    }
}

// work section end //
// mobile section start //
.mobile-app-section-2{
   .heading{
      h2{
          font-size:44px;
          font-family:"Lato", sans-serif;
      }
      p{
        margin: 0 auto;
        max-width: 640px;
     }
   }
   .main-btn{
    border-radius:0px !important;
    background: #ec008c;  
    background: -webkit-linear-gradient(to right, #fc6767, #ec008c);  
    background: linear-gradient(to right, #fc6767, #ec008c); 
   }
}
//  mobile section end //
// contact wrapper section start  //
.contact-us-wrapper{
      width:100%;
      padding: 100px 0px;
      height:100%;
      clear: both;
      position:relative;
      .contact-inner-wrap{
        box-shadow: 0 -12px 46px 12px #b60e0e0d;
        width:100%;
        height:200px;
        background-color: #ffffff;
        border:3px solid #ec008c;
        display:flex;
        align-items: center;
        justify-content: center;
        .li-first{
            width:25%;
            .contact-box-1{
                padding: 45px 0px;
                text-align: center;
                p{
                    font-family:"Lato", sans-serif;
                    font-size: 22px;
                    color:#ec008c;
                    line-height: 35px;
                    strong{
                        font-size: 31px;
                    }
                }
            }
        }
        .li-second{
            width:50%;
            .contact-box-2{
                background-color:#ec008c;
                padding: 70px 0px;
                .ul-inner{
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    padding: 0px 50px;
                    column-gap:40px;
                    li{
                        a{
                            color:#ffffff;
                            font-size: 40px;
                        }
                        p{
                            color:#ffffff;
                            text-align: center;
                        }
                    }
                }
            }
        }
        .li-third{
            width:25%;
            .contact-box-3{
                background-color:#ec008c;
                padding: 73px 0px;
                border-left: 2px solid #ffffff4d;
                position: relative;
                .contact-btn{
                    background-color: #ffffff;
                    color:#ec008c;
                    &:hover{
                        border:2px solid #ffffff;
                        background-color: transparent;
                        color:#ffffff;
                    }
                }
                span{
                    position: absolute;
                    width:30px;
                    height: 32px;
                    background-color: #ffffff;
                    font-size: 14px;
                    border-radius: 55px;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    color:#adadad;
                    left: -16px;
                    z-index: 9;
                    top: 44%;

                }
            }
        }
      }
      &::after{
            content: "";
            display: block;
            position: absolute;
            left: 60px;
            top: 225px;
            width: 108px;
            height: 290px;
            background-image: url('../images/contact-shape-img-1.png');
            background-repeat: no-repeat;
            background-size: cover;
            z-index: 9;
            animation: swing ease-in-out 1s infinite alternate;
      }
      &::before{
        content: "";
        display: block;
        position: absolute;
        right: 60px;
        top: 250px;
        width: 108px;
        height: 290px;
        background-image: url('../images/contact-shape-img-1.png');
        background-repeat: no-repeat;
        background-size: cover;
        z-index: 9;
        animation: swing ease-in-out 1s infinite alternate;
  }
  .side-img{
    position: relative;
    &::before{
        content: "";
        display: block;
        position: absolute;
        right: 60px;
        top: -175px;
        width: 108px;
        height: 290px;
        background-image: url('../images/contact-shape-img-1.png');
        background-repeat: no-repeat;
        background-size: cover;
        z-index: 9;
        animation: swing ease-in-out 1s infinite alternate;
      }
  }
}
// conatct wrapper section end  //
//   footer  section start  //
    .main-search-2{
          background-image: none;
          background-color: #f6f7f9;
          &::after{
              background-color:transparent;
          }
          .heading{
            h2{
               color:#ec008c;
               font-size: 32px;
               font-family: "Lato", sans-serif;
               text-align: left;
               margin-left: 280px;
            }
            p{
                color:#797979;
                text-align: left;
                margin-left: 280px;
            }
          }
          .media-icon{
            display: flex;
            justify-content: flex-start;
            column-gap: 10px;
            margin-top: 30px;
            margin-left: 280px;
            li{
                a{
                    display:flex;
                    width: 40px;
                    height: 40px;
                    line-height: 40px;
                    border: 1px solid #828282;
                    border-radius: 50%;
                    color: #828282;
                    justify-content:center;
                    align-items: center; 
                    @include transition;
                    &:hover{
                        background: #ec008c;  
                        background: -webkit-linear-gradient(to right, #fc6767, #ec008c);  
                        background: linear-gradient(to right, #fc6767, #ec008c); 
                        color: #ffffff;
                        border-color: transparent;
                    }
                }
            }
        }
        .search-box {
            input{
                border-radius: 0px 0 0 0px;
            }
            .main-btn{
                border-radius: 0 0px 0px 0;
                background: #ec008c;  
                background: -webkit-linear-gradient(to right, #fc6767, #ec008c);  
                background: linear-gradient(to right, #fc6767, #ec008c); 
            }
        }
   }
   .index2-footer{
         background-color:#f6f7f9;
         position: relative;
         .footer-logo{
            border-top: 2px solid #ececec;
            padding-top: 56px;
         }
      &::after{
        content:'';
        position:relative;
        display: block;
        width:100%;
        height:130px;
        bottom:0;
        background-image: url('../images/bottom-footer-shape.png');
        background-size: cover;
        background-repeat: no-repeat;
      }
      .bootem-footer {
        border-top: 1px solid #ececec;
      }
      .footer-content{
        .media-icon-index{
            li{
               a{
                 border:none !important;
                  &:hover{
                    background: #ec008c;  
                    background: -webkit-linear-gradient(to right, #fc6767, #ec008c);  
                    background: linear-gradient(to right, #fc6767, #ec008c); 
                    color: #ffffff;
                    border-color: transparent;
                  }
               }
            }
        }
      }
   }
// footer section end   //
// responsive start  //
@media (max-width:1750px) {
    .index2-first-wrapper::after {
        width: 608px;
        height: 1000px;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-prev {
        left: -7%;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-next {
        right: -7%;
    }
}
@media  (max-width:1650px) {
    .index2-first-wrapper .index-inner-wrap-1 {
        max-width: 700px;
    }
    .index2-first-wrapper .index-inner-wrap-1 h1 a {
        font-size: 60px;
    }
    .index2-first-wrapper .index-inner-wrap-2 {
        width: 1000px;
        padding: 50px 42px;
    }
    .dating-wrapper-2::before {
        left: 21px;
    }
    .index2-first-wrapper .shape-wrap::before {
        left: 21px;
    }
    .contact-us-wrapper .side-img::before {
        right: 20px;
        z-index:9;
    }
    .doctor-love-2::before {
        right: 20px;
        z-index: 9;
    }
    .contact-us-wrapper::before {
        right: 20px;
        z-index: 9;
    }
    .contact-us-wrapper::after {
        left: 20px;
    }
    .contact-us-wrapper .contact-inner-wrap {
        position: relative;
        z-index: 99;
    }
}
@media  (max-width:1550px) {
    .index2-first-wrapper .index-inner-wrap-1 {
        max-width: 670px;
    }
    .index2-first-wrapper .index-inner-wrap-1 h1 a {
        font-size: 50px;
    }
    .index2-first-wrapper .index-inner-wrap-2 {
        width: 1000px;
        padding: 50px 42px;
    }
    .index2-first-wrapper::after {
        width: 550px;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-prev {
        left: -4%;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-next {
        right: -4%;
    }
    .how-it-work-2 .awesome-slider .awesome-slider-box {
        box-shadow: 0 -12px 46px 12px rgba(182, 14, 14, 0.0509803922);
        width: 100%;
       height: auto !important;
    }
    .main-search-2 .heading p {
        margin-left: 185px;
    }
    .main-search-2 .heading h2 {
        margin-left: 190px;
    }
    .main-search-2 .media-icon {
        margin-left: 185px;
    }
}
@media (max-width:1440px) {
    .index2-first-wrapper::after {
        width: 506px;
    }
}
@media (max-width:1399px) {
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-prev {
        left: -7%;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-next {
        right: -7%;
    }
    .contact-us-wrapper .contact-inner-wrap {
        height: 155px;
    }
    .contact-us-wrapper .contact-inner-wrap .li-second .contact-box-2 {
        padding: 46px 0px;
    }
    .contact-us-wrapper .contact-inner-wrap .li-third .contact-box-3 {
        padding: 50px 0px;
    }
    .contact-us-wrapper .contact-inner-wrap .li-second .contact-box-2 .ul-inner li a {
        font-size: 27px;
    }
    .contact-us-wrapper .contact-inner-wrap .li-third .contact-box-3 .contact-btn{
        max-width: 180px;
    }
    .how-it-work-3 .position-div::before {
        width: 47%;
        height: 17px;
        bottom: 70%;
        left: 80%;
    }
}
@media (max-width:1366px) {
    .index2-first-wrapper .index-inner-wrap-1 {
        max-width: 620px;
    }
    .index2-first-wrapper .index-inner-wrap-2 {
        width: 924px;
        padding: 40px 34px;
        height: 140px;
    }
    .doctor-love-2 .love-calculater .calc-inner-box .love-inner-box .enter-name2 input {
        padding-left: 30px !important;
        padding: 17px 0px;
    }
    .doctor-love-2 .love-calculater .calc-inner-box .love-inner-box .enter-name1 input {
        padding-left: 30px !important;
        padding: 17px 0px;
    }
    .doctor-love-2 .love-calculater .calc-inner-box .enter-name input {
        padding: 17px 0px;
        padding-left: 32px;
        max-width: 120px;
    }
    .doctor-love-2 .love-calculater .calc-inner-box .love-inner-box .enter-name1 label {
        font-size: 18px;
        margin-bottom: 10px;
    }
    .doctor-love-2 .love-calculater .calc-inner-box .love-inner-box .enter-name2 label {
        font-size: 18px;
        margin-bottom: 10px;
    }
    .doctor-love-2 .love-calculater .calc-inner-box .enter-name label {
        font-size: 18px;
        margin-bottom: 10px;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-prev span {
        font-size: 35px;
        margin-bottom: 4px;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-next span {
        font-size: 35px;
        margin-bottom: 4px;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-next {
        width: 30px;
        height: 30px;
        display: flex;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-prev  {
        width: 30px;
        height: 30px;
        display: flex;
    }
    .contact-us-wrapper::before {
        right: 80px;
    }
    .contact-us-wrapper .side-img::before {
        right: 76px;
        z-index: 9;
    }
    .contact-us-wrapper::after {
        left: 30px;
    }
}
@media (max-width:1299px) {
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-prev {
        left: -5%;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-next {
        right: -5%;
    }
    
}
@media (max-width:1260px) {
    .index2-first-wrapper::after {
        width: 450px;
        height: 920px;
    }
    .index2-first-wrapper .index-inner-wrap-1 {
        max-width: 535px;
    }
    .index2-first-wrapper {
        height: 920px;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-prev {
        left: -3%;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-next {
        right: -3%;
    }
    .doctor-love-2  .graph-box{
        position: relative;
        z-index: 9;
    }
}
@media (max-width:1199px) {
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-prev {
        left: -7%;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-next {
        right: -7%;
    }
    .how-it-work-3 .position-div::before {
        width: 57%;
        left: 75%;
    }
    .main-search-2 .heading h2 {
        margin-left: 100px;
    }
    .main-search-2 .heading p {
        margin-left: 100px;
    }
    .main-search-2 .media-icon {
        margin-left: 100px;
    }
    .contact-us-wrapper::after {
        left: 30px;
        top:140px;
    }
}
@media (max-width:1100px) {
    .doctor-love-2 .love-calculater .love-result .circle {
        display: none !important;
    }
    .doctor-love .love-calculater .love-result h2 {
        position: absolute;
        top: 40%;
        left: 40%;
        transform: translate(-40%, -40%);
    }
}
@media (max-width:1150px) {
    .index2-first-wrapper::after {
        width: 405px;
        height: 920px;
    }
    .index2-first-wrapper .index-inner-wrap-1 {
        max-width: 490px;
    }
    .index2-first-wrapper .index-inner-wrap-1 h1 a {
        font-size: 46px;
    }
    header .main-header-two .main-menu-two ul > li > a {
        padding: 10px 6px !important;
    }
    .index2-first-wrapper .index-inner-wrap-2 {
        width: 890px;
        padding: 30px 17px;
        height: 125px;
    }
    header .main-header-two .main-menu-two ul > li > a {
        padding: 10px 4px !important;
    }
    .dating-wrapper-2 {
        position: relative;
        padding: 60px 0px !important;
    }
    .dating-wrapper-2  .dating-img{
        position: relative;
        bottom:130px;
    }
    .dating-wrapper-2::before {
        bottom: 100px;
    }
}
@media (max-width:1080px) {
    .index2-first-wrapper .index-inner-wrap-1 {
        top: 20%;
        left: 10%;
    }
    header .main-header-two .main-menu-two ul > li > a {
        font-size: 14px;
    }
    header .main-header-two .main-menu-two .index2-inner-ul .sideline .index-2-btn .menuBtn-2 a {
        font-size: 14px;
    }
    .index2-first-wrapper {
        height: 875px;
    }
    header .main-header-two .main-menu-two ul > li > a {
        padding: 10px 3px !important;
    }
    header .main-header-two .main-menu-two > ul > li > a {
        gap: 5px;
    }
    header .main-header-two .main-menu-two > ul {
        padding-left: 15px !important;
    }
    .index2-first-wrapper::after {
        width: 390px;
        height: 920px;
    }
    .index2-first-wrapper .index-inner-wrap-2 .change-box label {
        width: 50px;
        font-size: 12px;
    }
    .index2-first-wrapper .index-inner-wrap-2 .change-box .dropdown-wrapper {
        width: 230px;
        padding: 10px 10px;
        font-size: 12px;
    }
    .index2-first-wrapper .index-inner-wrap-2 .change-box {
        column-gap: 8px;
    }
    .index2-first-wrapper .index-inner-wrap-2 .change-box .custum-range {
        width: calc(100% - 57px);
    }
    .index2-first-wrapper .index-inner-wrap-2 {
        width: 820px;
        padding: 25px 17px;
        height: 100px;
    }
    .index2-first-wrapper .index-inner-wrap-2 .change-box .label-2nd {
        width: 105px;
    }
    .index2-btn2 {
        font-size: 13px;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-prev {
        left: -5%;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-next {
        right: -5%;
    }
}
@media (max-width:1040px) {
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-prev {
        left: 3%;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav .owl-next {
        right: 3%;
    }
    .how-it-work-2 .awesome-slider .owl-carousel .owl-nav {
        top: 40%;
    }
}
@media (max-width:991px) {
    // toggle responsive start //
    .toggle-btn-2 .icon-left {
        background-color: #ffffff !important;
    }
    .toggle-btn-2 .icon-left:before {
        background-color: #ffffff !important;
    }
    .toggle-btn-2 .icon-left:after {
        background-color: #ffffff !important;
    }
    .toggle-btn-2 .icon-right {
        background-color: #ffffff !important;
    }
    .toggle-btn-2 .icon-right:before {
        background-color: #ffffff !important;
    }
    .toggle-btn-2 .icon-right:after {
        background-color: #ffffff !important;
    } 
    .toggle-btn-2.open .icon-left {
        background: transparent !important;
    }
   .toggle-btn-2.open .icon-right {
       background: transparent  !important;
    }
    .js-toggle-dark-mode-2{
          background-color: #ec008c !important;
    }
    // toggle responsive  end  //
    .index2-first-wrapper .index-inner-wrap-2 .change-box {
        margin-bottom: 10px;
    }
    .index2-first-wrapper .index-inner-wrap-2 {
        width: 650px;
        padding: 30px 17px;
        height: 218px;
    }
    .index2-first-wrapper .index-inner-wrap-2 .change-box {
        margin-bottom: 20px;
    }
    .index2-first-wrapper::after {
        background-image: none;
    }
    .index2-first-wrapper .index-inner-wrap-1 {
        max-width: 765px;
    }
    .dating-wrapper-2 .dating-img {
        bottom: 30px;
    }
    .dating-wapper .dating-content {
        padding-left: 40px;
    }
    .index2-first-wrapper .index-inner-wrap-2 .change-box .custum-range .ui-slider-horizontal {
        width: 300px;
    }
    .index2-first-wrapper .index-inner-wrap-2 .change-box .custum-range .ui-slider-horizontal .ui-slider-handle .value {
        bottom: 16px;
        width: 20px;
        font-size: 9px;
        line-height: 14px;
    }
    .how-it-work-3 .position-div::before {
       display: none !important;
    }
    .how-it-work-3 .counter-box-2 {
        position: relative;
        margin-top: 30px;
    }
    .doctor-love-2 .graph-box {
        padding-top: 30px;
    }
    .doctor-love-2::before {
        top: 65%;
    }
    .contact-us-wrapper .contact-inner-wrap .li-second .contact-box-2 .ul-inner li a {
        font-size: 25px;
    }
    .contact-us-wrapper .contact-inner-wrap .li-second .contact-box-2 .ul-inner li p {
        text-align: left;
        font-size: 13px;
    }
    .contact-us-wrapper .contact-inner-wrap .li-third .contact-box-3 .contact-btn {
        max-width: 140px;
    }
    .contact-us-wrapper .contact-inner-wrap .li-first .contact-box-1 p {
        font-size: 18px;
        line-height: 29px;
    }
    .contact-us-wrapper .contact-inner-wrap .li-first .contact-box-1 p strong {
        font-size: 21px;
    }
    .contact-us-wrapper .contact-inner-wrap .li-second .contact-box-2 .ul-inner {
      column-gap: 40px;
    }
    .contact-us-wrapper::before {
        top: 161px;
    }
    .index-inner-wrap-2 .index2-btn2{
        margin: 0 !important;
    }
    .main-search-2 .heading h2 {
        margin-left: 65px;
    }   
    .main-search-2 .heading p {
        margin-left: 65px;
    } 
    .main-search-2 .media-icon {
        margin-left: 65px;
    }
    .doctor-love-2 .love-calculater .calc-inner-box {
        margin: 0px 0px;
    }
    .doctor-love .love-calculater .love-result h2 {
        position: absolute;
        top: 40%;
        left: 50%;
        transform: translate(-40%, -40%);
    }
    .counter-section-2 .counter-box-2 {
        margin-bottom: 33px;
    }
    .counter-section-2 .counter-box-2 .counter-text-2 {
        margin-top: 14px;
    }
    .counter-section-2 .counter-box-2 .counter-text-2 p {
        margin-top: 8px;
    }
    // sidebar css start
    header .main-header-two .main-menu-two .sidebar-menu-css li a{
       width: 100%;
       padding: 20px !important;
    }
    header .main-header-two .main-menu-two .sidebar-menu-css li a img{
         margin: 0 auto;
     }
    header .main-header-two .main-menu-two .sidebar-menu-css {
         padding-right: px !important; 
         padding-left: 0px !important; 
    }
    .mobile-app-section-2 .app-content .heading  p{
        max-width: 400px;
        margin: 0 auto;
    }
}
@media (max-width:899px) {
    .contact-us-wrapper .contact-inner-wrap .li-second .contact-box-2 .ul-inner li a {
        font-size: 20px;
    }
    header .main-header-two .main-menu-two {
        justify-content: flex-end !important;
        margin: 0px 0px 0px 0px !important;
    }
}
@media (max-width:767px) {
    .index2-first-wrapper .index-inner-wrap-2 {
        width: 510px;
    }
    .contact-us-wrapper .contact-inner-wrap .li-second .contact-box-2 .ul-inner li a {
        font-size: 15px;
    }
    .contact-us-wrapper .contact-inner-wrap .li-second .contact-box-2 .ul-inner li p {
        font-size: 10px;
    }
    .contact-us-wrapper .contact-inner-wrap .li-second .contact-box-2 .ul-inner {
        column-gap: 25px;
    }
    .main-search-2 .heading h2 {
        margin-left: 5px;
    }   
    .main-search-2 .heading p {
        margin-left: 5px;
    } 
    .main-search-2 .media-icon {
        margin-left: 5px;
    }
    .doctor-love-2  .heading  p{
        font-size: 13px;
     }
     .blog-wrap-2  .heading  p{
        font-size: 13px;
     }
     .how-it-work-2  .heading  p{
        font-size: 13px;
     }
     .how-it-work-3  .heading  p{
        font-size: 13px;
     }
     .how-it-work-2 .awesome-slider .owl-carousel .owl-nav {
        top: 36%;
     }   
     .contact-us-wrapper .contact-inner-wrap .li-second .contact-box-2 .ul-inner {
        padding: 0px 24px;
     }
     .mobile-app-section-2 .mobile-img{
        position:relative;
        z-index:99;
     }
     .doctor-love-2{
        padding-bottom: 30px;
     }
     .blog-wrap-2{
        padding-bottom: 65px;
     }
     .doctor-love-2 .heading h2 {
        font-size: 35px;
    }
    .blog-wrap-2 .heading h2 {
        font-size: 35px;
    }
    .mobile-app-section-2 .heading h2 {
        font-size: 36px;
    }
    .counter-section-2 {
        padding-bottom: 20px;
    }
}
@media (max-width:676px) {
    .dating-wrapper-2::before {
        bottom: 45px;
    }
    .index2-first-wrapper .index-inner-wrap-1 {
        max-width: 500px;
    }
    .index2-first-wrapper .index-inner-wrap-2 {
        width: 467px;
    }
    .doctor-love-2 .love-calculater .calc-inner-box {
        margin: 0px 35px;
    }
     .contact-us-wrapper .contact-inner-wrap .li-third .contact-box-3 .contact-btn {
        max-width: 107px;
    }
    .contact-us-wrapper .contact-inner-wrap .li-first .contact-box-1 p strong {
        font-size: 18px;
    }
    .contact-us-wrapper .contact-inner-wrap .li-first .contact-box-1 p {
        font-size: 14px;
        line-height: 27px;
    }
    .blog-wrap-2 .blog-box .blog-text .tag-list {
        column-gap: 20px;
    }
    .doctor-love-2 .heading h2 {
        font-size: 36px;
    }
    .doctor-love-2 .love-calculater .love-result img {
        margin: 0 auto;
        margin-top: 30px;
    }
}
@media (max-width:599px) {
    .contact-us-wrapper .contact-inner-wrap{
        display: inline-block;
        height:100%;
    }
    .contact-us-wrapper .contact-inner-wrap .li-second {
        width: 100%;
    }
    .contact-us-wrapper .contact-inner-wrap .li-third {
        width: 100%;
        border-top: 2px solid white;
    }
    .contact-us-wrapper .contact-inner-wrap .li-third .contact-box-3 span {
        left: 50%;
        top: -12%;
    }
    .contact-us-wrapper .contact-inner-wrap .li-third .contact-box-3 {
         border-left:none; 
    }
     .contact-us-wrapper .contact-inner-wrap .li-first  {
        width:100%;
    }
     .contact-us-wrapper .contact-inner-wrap .li-first .contact-box-1 {
        padding: 20px 0px;
    }
    .contact-us-wrapper .contact-inner-wrap .li-third .contact-box-3 .contact-btn {
        max-width: 170px;
    }
    .doctor-love-2 .heading h2 {
        font-size: 30px;
    }
    .how-it-work-2 .heading h2 {
        font-size: 30px;
    }
    .blog-wrap-2 .heading h2 {
        font-size: 30px;
        font-family: "badscript-regular";
    }
    .how-it-work-3 .heading h2 {
        font-size: 30px;
    }
    .mobile-app-section-2 .heading h2 {
        font-size: 30px;
    }
    .doctor-love-2 .love-calculater .calc-inner-box .love-inner-box {
        padding-left: 0px;
    }
    .contact-us-wrapper{
        padding-bottom: 40px;
    }
}
@media (max-width:576px) {
    .index2-first-wrapper .index-inner-wrap-2 .change-box .custum-range .ui-slider-horizontal {
        width: 180px;
    }
    .index2-first-wrapper .index-inner-wrap-2 .change-box .label-2nd {
        width: 120px;
    }
    .index2-first-wrapper .index-inner-wrap-2 {
        width: 400px;
    }
    .index2-first-wrapper .index-inner-wrap-1 h1 a {
        font-size: 34px;
    }
    .index2-first-wrapper .index-inner-wrap-1 {
        max-width: 360px;
    }
    .index2-first-wrapper .index-inner-wrap-1 {
        top: 17%;
    }
    .doctor-love-2::before {
       display:none;
    }
    .dating-wrapper-2::before {
        bottom: 18px;
    }
    .doctor-love-2 .love-calculater .calc-inner-box {
        column-gap: 25px;
    }
    .dating-wrapper-2::before {
        bottom: -54px;
    }
    .dating-wrapper-2 {
        padding-top: 50px !important;
        padding-bottom: 30px !important;
    }
    .counter-section-2 {
        padding: 70px 0 70px;
    }
    .doctor-love-2 {
        padding: 60px 0;
    }
    .how-it-work-2{
        padding: 60px 0 55px;
    }
    .how-it-work-3{
        padding: 50px 0 40px;
    }
    .blog-wrap-2 {
        padding-top: 50px;
    }
    .mobile-app-section-2{
        padding-top: 55px;
    }
    .main-search-2 {
        padding-bottom: 40px;
    }
}
@media (max-width:480px) {
    .index2-first-wrapper .index-inner-wrap-2 {
        width: 360px;
    }
    .index2-first-wrapper .index-inner-wrap-1 {
        max-width: 348px;
    }
    .index2-first-wrapper .index-inner-wrap-1 {
        top: 14%;
    }
    .index2-first-wrapper .index-inner-wrap-1 h1 a {
        font-size: 33px;
    }
    .dating-wapper .dating-content {
        padding-left: 20px;
        width: 100%;
        padding-right: 10px;
    }
    .dating-wrapper-2 .heading h2 {
        font-size: 34px;
    }
    .contact-us-wrapper .side-img::before {
        top: -94px;
    }
    .custum-select .dropdown {
        font-size: 13px;
    }
}
@media (max-width:400px) {
    .index2-first-wrapper .index-inner-wrap-2 {
        width: 315px;
    }
    .index-inner-wrap-2 .index2-btn2 {
        max-width: 150px;
    }
    .doctor-love-2 .love-calculater .calc-inner-box {
        margin: 0px 5px;
    }
    .doctor-love-2 .heading p {
        font-size: 15px;
    }
    .how-it-work-2 .heading p {
        font-size: 16px;
    }
    .how-it-work-3 .heading p {
        font-size: 16px;
    }
    .blog-wrap-2 .heading p {
        font-size: 16px;
    }
    .index2-first-wrapper .index-inner-wrap-1 h1 a {
        font-size: 31px;
    }
    .dating-wrapper-2::before {
        bottom: -69px;
    }
    .index2-first-wrapper .index-inner-wrap-2 .change-box {
        column-gap: 0px;
    }
    .custum-select .dropdown {
        font-size: 13px;
        padding-left: 12px;
    }
    .index2-first-wrapper .index-inner-wrap-2 .change-box .custum-range {
        width: calc(100% - 18px);
    }
    .index2-first-wrapper .index-inner-wrap-2 .change-box .label-2nd {
        width: 128px;
    }
    .index2-first-wrapper .index-inner-wrap-1 {
        left: 5%;
    }
    
}
@media (max-width:360px){
    .index2-first-wrapper .index-inner-wrap-2 {
        width: 285px;
        height: 238px;
    }
    .how-it-work-2 .heading p {
        font-size: 14px;
    }
    .doctor-love-2 .heading p {
        font-size: 14px;
    }    
    .blog-wrap-2 .heading p {
        font-size: 14px;
    }
    .index2-first-wrapper .index-inner-wrap-1 h1 a {
        font-size: 28px;
    }
    .index2-first-wrapper .index-inner-wrap-1 .para-wrap-1 {
        font-size: 15px;
    }
    .dating-wrapper-2::before {
        display:none;
    }
    .contact-us-wrapper .contact-inner-wrap .li-third .contact-box-3 span {
        left: 45%;
        top: -12%;
    }
    .custum-select .dropdown {
        font-size: 10px;
    
    }
}
@media (max-width:340px){
    .dating-wapper .dating-content {
        padding-left: 15px;
    }
    .index2-first-wrapper::before {
        width: 320px;
    }
}
// heart animation  
@keyframes swing {
    0% { transform: rotate(3deg); }
    100% { transform: rotate(-3deg); }
}