@import url('https://fonts.googleapis.com/css2?family=DM+Serif+Text:ital@1&family=Playfair+Display:ital@1&display=swap');




* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
html,body{
    overflow-x: hidden;
    overflow-y: auto;
  }

:root{
    --background:linear-gradient(10deg, rgb(57, 80, 80) 0%, rgb(190, 116, 186) 100%);
    --primary-color:#FA0492;
}
.hero-section {

    padding: 100px;
    padding-bottom: 220px;
    /* background: #fbbe10 url(./images/header-bg.png) top center no-repeat; */
    /* background-image: url('./images/SHIPGO.gif');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover; */
    background: var(--background);
}

.hero-section .sec-container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 20px;
}

.sec-container p {
    text-align: center;
    font-weight: 600;
    color: white;
    font-size: 14px;
}

.sec-container .heading-div {
    padding: 20px;
}

.heading-div h1 {
    font-family: 'DM Serif Text', serif;
    font-family: 'Playfair Display', serif;
    font-size: 50px;
    font-weight: 600;
    color: white;
}

.link-div {
    display: flex;
    justify-content: space-around;
    align-items: center;

}

.link-div a {
    text-align: center;
    padding: 10px 30px;
    background: rgba(0, 0, 0, 0.2);
    /* opacity: 0.5; */
    border-radius: 5px;
    color: white;
    text-decoration: none;
    font-size: 25px;
}

.link-div a i {
    color: white;
    font-size: 30px;
    padding: 0px 8px;
}

.link-div a:hover {
    background: white;
    transition: 0.3s ease-in-out;
    color: black;
}

.link-div a:hover i {
    color: black;
}


.content-sec {
    padding: 50px;
    padding-bottom: 200px;
}

.content-sec h2 {
    font-family: 'DM Serif Text', serif;
    font-family: 'Playfair Display', serif;
    font-size: 30px;
    font-weight: 600;
    color: var(--primary-color);
    margin: 20px 0px;
}

.box {
    text-align: center;
    margin: 30px 0px 50px 0px;
}

.box h4 {
    font-size: 22px;
    margin-top: 10px;

}

.box p {
    color: gray;
    text-align: justify;
    font-size: 13px;
}

.mobile-div {
    position: relative;
    background: url(./images/mobile-img.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 950px;
    width: 600px;
    margin-top: -320px;
    z-index: 5;
}

.mobile-img img {
    position: absolute;
    margin-top: 100px;
    margin-left: 102px;
    width: 390px;

}

.content-sec2 {
    background-color: #f2f2f2;
    margin-top: 100px;
    padding: 50px;
}

.content-sec2 h2 {
    font-family: 'DM Serif Text', serif;
    font-family: 'Playfair Display', serif;
    font-size: 30px;
    font-weight: 600;
    color: var(--primary-color);
    margin: 20px 0px;
}

/* feq start */

.faq-container {
    padding: 100px 30px 50px 30px;
}

.faq-btn {
    padding: 20px;
    /* border-bottom: 1px solid rgb(69, 65, 65); */
    text-align: center;
}

.faq-btn button {
    border: none;
    padding: 10px 30px;
    font-weight: 400;
    font-size: 25px;
    color: rgb(32, 32, 32);
}

.faq-btn button:hover {
    color: rgb(51, 51, 119);
}

.border-class {
    background-color: rgba(164, 162, 162, 0.3);
    /* color: rgb(185, 180, 180); */
    border-radius: 5px;
}

.accordion-body {
    text-align: justify;
}

.accordion-item {
    background-color: #f2f2f2;
    border: none;
}

.accordion-button {
    background-color: #f2f2f2;

}






/* feq end */

/* count start */

.count-sec {
    padding: 100px;
    background: var(--background);

}

.number-count-div {
    text-align: center;


}

.number-list {
    margin: 100px 0px;
}

.number-count-div h6 {
    font-size: 50px;
    color: white;
    /* margin-top: 50px; */
}

.number-count-div p {
    margin-top: -15px;
    font-weight: 600;
}

.mobile-img-div {

    position: relative;
    background: url(./images/mobile-img.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 600px;
    width: 300px;
    /* margin-top: -320px; */
    z-index: 5;
}

.mobile-img-div img {
    position: absolute;
    height: 460px;
    width: 246px;
    margin-top: 50px;
    margin-left: 25px;
}

.images-div {
    padding: 50px 0px;
}

.images-div img {
    width: 80%;
}

.images-div p {
    color: white;
    margin: 40px 0px;
    text-align: justify;
}

.images-div .filter-img-btn {
    text-align: start;
    margin: 40px 0px;
}

.images-div .filter-img-btn button {
    border: none;
    background: transparent;
    color: rgb(220, 220, 220);
    font-size: 20px;
}




/* count end */

/* footer */
.footer {
    background: #383838;
    padding: 100px;
}

.footer h4 {
    color: white;
    font-size: 30px;
    font-family: "Roboto", sans-serif;
}

.footer .row {
    padding: 50px 20px 0px 20px;
}

.footer p {
    color: white;
}

.footer a {
    color: white;
    text-decoration: none;
    margin: 0px 10px;
}

.footer a i {
    color: white;
    padding: 0px 7px;
}

/* signup form div start */
 
.signup-form-div{
    position: relative;
}
  .signup-form-div form input{
    width: 100%;
    border-radius: 10px;
    padding: 10px;
    margin: 10px 0px;
    border: 2px solid rgba(168, 165, 165, 0.523);
  }


  .signup-form-div .btn-model{
    position: absolute;
    background-color: var(--primary-color);
    color: white;
    font-size: 20px;
    right: 0px !important;
    top: 0px;
    border: 2px solid var(--primary-color);
  }

 .modal-content{
    background-color: var(--background) !important;
    color: white;
    border: 2px solid var(--primary-color);
    padding: 30px;
  }

  .btn-close{
    color: white !important;
  }

  
  #submit{
    /* text-align: center; */
    width: 100%;
    padding: 10px 20px;
    background: var(--primary-color);
  }

  /* privacy-policy page css*/
  #privacy-policy{
    padding: 50px;
    background-color: #f2f2f2;
    font-family:Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;

  }

  .privacy-div{
    /* color: white; */
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .privacy-div h2{
    font-family: 'DM Serif Text', serif;
    font-family: 'Playfair Display', serif;
    font-size: 30px;
    font-weight: 600;
    color: var(--primary-color);
    
  }
  #privacy-policy h3{
    margin: 30px 0px;
    font-size: 20px;
    text-align: justify;
  }
  #privacy-policy h5{
    text-align: justify;
 }
  #privacy-policy p{
    text-align: justify;
  }

/* signup form div end */

/* media query */
@media only screen and (max-width:991px) {


    .hero-section {
        padding-bottom: 100px;

    }

    .logo-div {
        text-align: center;
    }

    .logo-div img {
        width: 50%;
    }

    .heading-div h2 {
        font-size: 30px;
    }

    .link-div a {

        padding: 5px 20px;
        font-size: 15px;
    }

    .link-div a i {
        font-size: 15px;
    }

    /* .content-sec .row{
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    } */

    .content-sec h2 {
        text-align: center;
    }

    .mobile-div {
        margin-top: 0px;
        text-align: center;
        height: 500px;
        width: 100%;
    }

    .mobile-img img {
        position: absolute;
        width: 207px;
        height: 365px;
        margin-left: -105px;
        margin-top: 55px;
    }

    .content-sec2 h2 {
        margin: 40px 0px;
        text-align: center;
    }

    .content-sec {
        padding: 20px 30px;
    }

    .count-sec {
        padding: 30px;
    }

    .number-list {
        text-align: start;
    }

    .number-list h6 {
        font-size: 25px;
    }

    .number-list p {
        font-size: 13px;
        margin-top: -5px;
    }

    .mobile-img-div {
        height: 400px;
        width: 200px;
        margin-top: 70px;
    }

    .mobile-img-div img {
        height: 280px;
        width: 164px;
        margin-left: 17px;
        margin-top: 45px;
    }

    .images-div {
        padding: 70px 20px;
    }

    .images-div img {
        width: 60%;

    }

    .images-div p {
        font-size: 13px;
    }

    .faq-btn button {
        padding: 5px 20px;
        font-size: 15px;
    }

    .faq-image img {
        width: 100%;
        text-align: center;
        margin-top: 60px;
    }

    .footer-link {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
    }

    .footer-link a{
        margin: 10px 0px;
    }
}








@media only screen and (max-width:491px) {

    .hero-section {
        padding: 50px 30px;
    }

    .hero-section p {
        font-size: 10px;
    }

    .hero-section h1 {
        font-size: 20px;
    }

    .link-div {
        flex-direction: column;

    }

    .link-div a {
        margin: 7px;
        padding: 5px 20px;
        font-size: 11px;
    }

    .link-div a:nth-child(2) i {
        font-size: 10px;
    }

    .mobile-div {

        margin-top: 10px;
    }

    .faq-btn {
        padding: 0px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .faq-btn button {
        font-size: 13px;
        margin: 10px 0px;
    }

    .faq-image img {
        margin-top: 0px;
    }

    .content-sec2 {
        margin-top: 20px;
        padding-top: 50px;
    }

    .count-sec {
        padding: 10px 30px;
    }

    .number-list {
        text-align: center;
        margin: 30px;
    }

    .mobile-img-div {

        height: 480px;
        width: 309px;
        margin-top: 30px;
    }

    .mobile-img-div img {

        height: 348px;
        width: 195px;
        margin-top: 55px;
        position: absolute;
        margin-left: 56px;
    }

    .signup-form-div .btn-model{
        font-size: 10px;
      }

    .footer h4{
        font-size: 15px;
    }
     #privacy-policy{
        padding: 20px;
     }
   

     #privacy-policy h4{
        font-size: 20px;
        margin-top: 30px;
        text-align: justify;
     }
     #privacy-policy h5{
        font-size: 18px;
     }


    }