@import url('https://fonts.googleapis.com/css2?family=Kaushan+Script&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Hind+Madurai:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Secular+One&display=swap');


* {
     margin: 0px;
     padding: 0px;
     box-sizing: border-box;
  
}



html {
     overflow-x: hidden;
     scroll-padding-top: 9rem;
     scroll-behavior: smooth;
    
 }
 
 html::-webkit-scrollbar {
     width: 6px;
    
 }
 
 html::-webkit-scrollbar-track {
     background: transparent;
 
 }
 
 html::-webkit-scrollbar-thumb {
     background: hsl(0, 5%, 27%);
     border-radius: 6px;
 }
 


.google-te-combo {
     width: 200px; 
     scroll-behavior: smooth;
     border-radius: 6px; 
 }
 
 .google-te-combo::-webkit-scrollbar {
     width: 8px;
    
 }
 
 .google-te-combo::-webkit-scrollbar-track {
     /* background: #f1f1f1; */
     background: transparent; 
 }
 
 .google-te-combo::-webkit-scrollbar-thumb {
     background: #888; 
     border-radius: 6px; /* Rounded corners for the scrollbar thumb */
 }
 
 .google-te-combo::-webkit-scrollbar-thumb:hover {
     background: #555; /* Color of the scrollbar thumb on hover */
 }


.up-nav {
     background-color: cadetblue;
      margin: 5px 5px;
     padding: 10px 5px;
     display: flex;
     justify-content: space-around;
     flex-direction: row;
     border-radius: 4px;

}


.nav-sticy {
     position: sticky;
     top: 0;
     right: 0;
     z-index: 10;
     will-change: transform;
}


.google-te-combo{
     height: 30px;
     border-radius: 20px;
     padding: 4px;
    outline: none;

}

.container {
     min-height: 76vh;
     color: white;
     font-family: 'Varela Round', sans-serif;
     display: flex;
     justify-content: center;
     margin: 15px 15px;
     width: 100%;
     border-radius: 12px;
     padding: 20px 20px;
     background-image: url(https://images.unsplash.com/photo-1610173826608-bd1f53a52db1?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1300&q=80);
     background-repeat: no-repeat;
     background-position: center;
     background-size: cover;
     flex-direction: row;

}

/*home page code*/
.txtc {
     color: #5d5656;
     border: 2px solid #DDD;
}

.mdl-t {
     font-family: 'Secular One', sans-serif;
}

.frmhighlight {
     width: 100%;
     margin: 15px 2px;
     padding: 30px 30px;
     Display: flex;
     Justify-content: row;
     Align-items: center;
     position: relative;
     top: 55%;
     background-color: hsla(7, 39%, 23%, 0.6)
}

.frm-info {
     display: flex; /* Use flexbox layout */
     flex-wrap: wrap; /* Allow items to wrap to the next line if necessary */
     align-items: right;

}

.frm-info label {
     margin-right: 10px; /* Add some spacing between labels and selects */
 }
 
 .frm-info select {
     margin-right: 20px; /* Add spacing between select elements */
 }
 



.row-c {
     display: -webkit-flex;
     display: flex;
}

.column {
     -webkit-flex: 1;
     -ms-flex: 1;
     flex: 1;
     padding-right: 44px;
     padding-left: 20px;
     margin-left: 20px;
     height: 400px;

}

/*Company info*/
.row-cardbg {
     background-color: #856666;
}

.row-card {
     display: flex;
     align-items: center;
     justify-content: center;

}


#more {
     display: none;
}


.Cardcontainer {
   background-color: #00000052;
 }



 .card {
     transition: transform 0.2s;
     box-shadow: 10px 10px 8px rgba(32, 34, 35, 0.674);
 }
 .card:hover {
     transform: scale(0.8); 
     transition: transform 0.2s linear; 
 }
/*register css*/

select[name=slc] {
     width: 100%;
     padding: 0px 30px;
     margin: 8px 0;
     display: inline-block;
     box-sizing: border-box;
}

.modal-body {

     z-index: 1; /* Sit on top */
     left: 0;
     top: 0;
     width: 100%; /* Full width */
     height: 100%; /* Full height */
     overflow: auto; /* Enable scroll if needed */
     background-color: rgb(0, 0, 0);  /* Fallback color */
     background-color: rgba(0, 0, 0, 0.4); /* Black w/ opacity */

}

.modal-content {

     border: 1px solid #888;
     width: 60%;
}

.modal-header,h4,.close {
     background-color: #238373;
     color: white !important;
     text-align: center;
     font-size: 30px;
}


/*footer section with footer-winget*/

#footer-sidebar {
     color: #fff;
     background: #34495e;
     padding: 20px 0;
}

.footer-widget h4:after {
     content: "";
     background-color: #2c3e50;
     display: block;
     width: 50px;
     height: 2px;
     margin: 5px 0;
}

.footer-widget a {
     color: #fff;
}

.footul {
     list-style: none;
     padding: 0;
     margin: 0;
     padding-left: 24px;
}

.footul li {
     margin-bottom: 3px;
}

.footul li:before {

     padding-right: 5px;
}

.footul li a {
     text-decoration: none;
}

.footul li a:hover {
     color: #238373;
}

#footer {
     color: #fff;
     background: #2c3e50;
     padding: 18px 50px;
}

#social-icons {
     list-style: none;
     color: #fff;
     margin: 0;
     padding: 0;
}

#social-icons li {
     display: inline-block;
     padding-left: 5px;
}

#social-icons li a {
     color: #fff;
     font-size: 23px;

}


/*Find your perfact soulmate container css*/
#soulmate-post {
     color: #fff;
     background: url("https://images.pexels.com/photos/5759215/pexels-photo-5759215.jpeg?auto=compress&cs=tinysrgb&w=1460&h=750&dpr=1") no-repeat 0 0;
     background-size: cover;
     padding: 50px 0;
     position: relative;
}

#soulmate-post:before {
     background: rgba(52, 73, 94, 0.7);
     content: "";
     position: absolute;
     top: 0;
     width: 100%;
     height: 100%;
}
.post{
     padding-left: 34px;
     padding-right: 20px;
}
.post img {
     width: 12%;
     margin-bottom: 10px;
}

.post h3 a {
     text-decoration: none;
     color: #81d4fa;
}

.post h3 {
     text-decoration: none;
     font-size: 1.35rem;
     font-family: 'Secular One', sans-serif;
}

.post p {
     font-family: 'Kaushan Script', cursive;
}

.soulmate-cont {
     display: flex;
     justify-content: center;
     align-items: center;
     

}


.section-m {
     padding-top: 70px;
     padding-bottom: 70px;
     background-color: #d1c7c7;
}

.section-m h2.section-head {
     color: #000;
     text-align: center;
     margin-bottom: 40px;
}

.section-m h2.section-head:after {
     background: #e74c3c;
     content: "";
     display: block;
     width: 100px;
     height: 3px;
     margin: 20px auto;
}

.pricing-box {
     width: 70%;
     height: 260px;
     position: relative;
     border: 2px solid rgba(0, 0, 0, 0.075);
     border-radius: 3px;
     text-align: center;
     box-shadow: 0 1px 1px rgb(0 0 0 / 10%);
}

.mem-row {
     display: flex;
}



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

     .google-te-combo{
          margin-top:10px ;
          margin-bottom: 10px;
     }
     .up-nav,
     .row-c,
     .payment-con,
     .row-pay {
          flex-direction: column;
     }

     .test-row {
          flex-direction: column;
          padding-left: 10px;
          padding-right: 10px;
     }

     .row {

          flex-direction: column;
          padding: 30px 30px;
          justify-content: center;
          align-items: center;
     }

     .card {
          min-width: 250px; /* Set a minimum width for smaller screens */
      }

     .frmhighlight,
     .frm-info {
          display: flex;
          flex-direction: column;
          justify-content: center;
          text-align: center;
          top: 2%;
          position: relative;
          /* padding: 10px 10px */
     }


     .footer-widget {
          margin-bottom: 20px;
     }

     #footer {
          text-align: center;
     }

     #social-icons {
          margin-top: 10px;
     }



}
