.sampleinner-section {
    padding: 50px 0;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
}

.sampleinner-left {
    padding-right: 30px;
}

.sampleinner-item {
    margin-bottom: 30px;
}

.sampleinner-content {
    text-align: center;
}

.sampleinner-content img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    transition: all 0.3s ease-in-out;
}

.sampleinner-content img:hover {
    transform: scale(1.05);
}

.sampleinner-title h5 {
    font-size: 1.2rem;
    font-weight: 600;
    margin-top: 15px;
    color: #333;
}

.sampleinner-right {
    padding-left: 30px;
}

.sampleinner-ban {
    margin-bottom: 30px;
}

.sampleinner-ban img {
    width: 650px;
    height: 300px;
    border-radius: 8px;
    margin-bottom: 20px;
    margin-top: 20px;
}

@media (max-width: 1200px) {
    .container {
        max-width: 100%;
        padding: 0 15px;
    }

    .sampleinner-left, .sampleinner-right {
        padding: 0;
    }

    .sampleinner-ban img {
        width: 100%;
        height: auto;
    }
}

@media (max-width: 768px) {
    .sampleinner-section {
        padding: 40px 15px;
    }

    .sampleinner-content img {
        width: 90%;
    }

    .sampleinner-title h5 {
        font-size: 1rem;
    }

    .sampleinner-ban img {
        width: 100%;
        height: auto;
    }
}

@media (max-width: 480px) {
    .sampleinner-section {
        padding: 30px 15px;
    }

    .sampleinner-title h5 {
        font-size: 0.9rem;
    }

    .sampleinner-ban img {
        width: 100%;
        height: auto;
    }
}

.inner-banner {

    background-image: url('/assets/images/onam-2.jpg');

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

    height: 330px;

    max-height: 100vh;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #333;

    text-align: center;

}



.inner-banner .banner-content h2 {

    font-size: 48px;

    color: #ffc107;

    font-weight: 600;

    text-transform: capitalize;

    letter-spacing: 1px;

    margin: 0;

    padding: 20px 0;

    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);

}



.about-services {

    display: flex;

    margin-top: 20px;

    justify-content: space-between;

    gap: 20px;

    margin-top: -30px;

}



.services-box, .aboutform, .other-services-box {

    flex: 1;

    padding: 20px;

    border-radius: 8px;

    height: 100%;

    width:100%;

    display: flex;

    flex-direction: column;

    justify-content: space-between;

}



h3, .font-class {

    font-family: 'Lexend Sans', sans-serif;

    margin-bottom: 15px;

    font-size: 1.5em;

    color: #15103d;

}



ul.font-class {

    list-style-type: none;

    padding: 0;

}



ul.font-class li {

    margin-bottom: 10px;

    font-size: 18px;

    background-color: #15103d;

    border-radius: 10px;

    width: 100%;

    padding: 10px;

    text-align: center;

    color: #fff;

}



.aboutform {

    background: linear-gradient(45deg, #ffc107, #ffffff);

    padding: 20px;

    border-radius: 8px;

    margin-top: 20px;

    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

}



.aboutform .inner-title {

    background-color: #15103d;

    color: white;

    padding: 10px;

    border-radius: 10px;

    text-align: center;

    animation: blinkAnimation 1s infinite;

}



@keyframes blinkAnimation {

    0% {

        opacity: 1;

    }

    50% {

        opacity: 0;

    }

    100% {

        opacity: 1;

    }

}



.aboutform .form-container {

    display: flex;

    flex-direction: column;

    gap: 15px;

}



.aboutform .form-input, .aboutform .form-textarea {

    padding: 10px;

    border: 2px solid #15103d;

    border-radius: 15px;

    font-size: 14px;

    color: #15103d;

}



.aboutform p {

    text-align: center;

    font-size: 16px;

    color: #15103d;

}



.aboutform .form-input:focus, .aboutform .form-textarea:focus {

    border-color: #ffc107;

    outline: none;

}



.aboutform .form-button {

    background-color: #ffc107;

    color: #15103d;

    padding: 10px;

    border: none;

    border-radius: 10px;

    font-size: 16px;

    font-weight: 600;

    cursor: pointer;

    transition: background-color 0.3s;

}



.aboutform .form-button:hover {

    background-color: #ffc103;

}



.font-class li {

    position: relative;

    margin-bottom: 10px;

    font-size: 18px;

    background-color: #15103d;

    border-radius: 10px;

    width: 300px;

    padding: 10px;

    text-align: center;

    color: #fff;

}



.arrow-icon {

    position: absolute;

    right: 10px;

    top: 30%;

    transform: translateY(-50%);

    width: 20px;

    height: 20px;

    border-left: 4px solid #ffc107;

    border-bottom: 4px solid #fff;

    border-radius: 10px;

    transform: rotate(45deg);

    transition: transform 0.3s, color 0.3s;

}



.font-class li:hover .arrow-icon {

    transform: rotate(180deg);

    color: #ffc107;

}



@media (max-width: 1200px) {

    .about-services {

        flex-wrap: wrap;

        justify-content: space-around;

    }



    .services-box, .aboutform, .other-services-box {

        flex: 0 0 48%;

        margin-bottom: 20px;

    }



    .inner-banner .banner-content h2 {

        font-size: 40px;

    }

}



@media (max-width: 768px) {

    .inner-banner {

        height: 250px;

    }



    .inner-banner .banner-content h2 {

        font-size: 32px;

    }



    .about-services {

        flex-direction: column;

        align-items: center;

    }



    .services-box, .aboutform, .other-services-box {

        flex: 1;

        margin-bottom: 20px;

    }



    .font-class li {

        width: 100%;

    }



    .arrow-icon {

        right: 5px;

        top: 50%;

    }

}



@media (max-width: 480px) {

    .inner-banner .banner-content h2 {

        font-size: 28px;

    }



    .aboutform .form-input, .aboutform .form-textarea {

        font-size: 12px;

        padding: 8px;

    }



    .aboutform .form-button {

        font-size: 14px;

        padding: 8px;

    }

}

.content-container {

    display: flex;

    align-items: center;

    justify-content: space-between;

    padding: 20px;

    flex-wrap: wrap;

}



.text-box {

    flex: 60%;

    padding-right: 20px;

}



.text-box h2 {

    font-size: 2rem;

    color: #333;

    margin-bottom: 10px;

    border-bottom: 2px dotted #ffc107;

    padding-bottom: 5px;

}



.text-box p {

    font-size: 1.1rem;

    color: #555;

    line-height: 1.6;

    margin-bottom: 20px;

}



.text-box ul {

    list-style: none;

    padding: 0;

}



.text-box ul li {

    font-size: 1.1rem;

    color: black;

    margin-top: 10px;

    width: 400px;

    margin-bottom: 10px;

    border-bottom: 10px solid red;

    padding-bottom: 15px;

}



.image-box {

    flex: 40%;

    padding-left: 20px;

}



.image-box img {

    width: 100%;

    height: auto;

    border-radius: 10px;

}



@media (max-width: 768px) {

    .content-container {

        flex-direction: column;

        align-items: center;

    }



    .text-box {

        flex: 100%;

        padding-right: 0;

    }



    .image-box {

        flex: 100%;

        padding-left: 0;

        margin-top: 20px;

    }



    .text-box ul li {

        width: 100%;

        border-bottom: 2px solid red;

    }

}



@media (max-width: 480px) {

    .text-box h2 {

        font-size: 1.5rem;

    }



    .text-box p {

        font-size: 1rem;

    }



    .text-box ul li {

        font-size: 1rem;

    }

}



 .contact-page {



    padding: 60px 0;



    background-color: #fff;



}







.contact-box {



    background-color: #ffc107;



    border-radius: 10px;



    padding: 5px;



    margin-bottom: 10px;



    text-align: center;



    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);



}







.contact-inner {



    background-color: #fff;



    padding: 20px;



    border-radius: 10px;



    text-align: center;



}







.contact-box img {



    max-width: 100px;



    margin-bottom: 15px;



    animation: scaleIn 0.5s ease-in-out;



}







@keyframes scaleIn {



    0% {



        transform: scale(0);



        opacity: 0;



    }



    50% {



        transform: scale(1.1);



        opacity: 1;



    }



    100% {



        transform: scale(1);



    }



}











.contact-box h4 {



    text-align: center;



    font-weight: 600;



    color: #222;



    margin-bottom: 20px;



}







.contact-box p {



    color: #fff;

    

    font-size:16px;



    



    text-align: center;



    margin-bottom: 30px;

    

    background:#15103d;

    border-radius:10px;

    padding:10px;

}







.contact-form h3 {



    text-align: center;



    color: #ffc107;



    margin-bottom: 20px;



}







.contact-form p {



    color: #ffc107;



    text-align: center;



    margin-bottom: 30px;



    background-color: #fec000;



    display: inline-block;



    padding: 10px;



    border-radius: 5px;



    animation: blink 1s infinite;



}







.contact-form-container {



    background-color: #ffffff;



    border-radius: 10px;



    padding: 20px;



    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);



}







.form-title {



    color: #ffc107;



    text-align: center;



    margin-bottom: 20px;



}







.form-description {



    color: #666;



    text-align: center;



    margin-bottom: 30px;



    background-color: #fec000;



    display: inline-block;



    padding: 10px;



    border-radius: 5px;



    animation: blink 1s infinite;



}







.form-input {



    border: 1px solid #ddd;



    border-radius: 5px;



    padding: 10px;



    width: 100%;



    margin-bottom: 15px;



}







.btn-primary {



    background-color: #FFBF00;



    border-color: #FFBF00;



}







.btn-primary:hover {



    background-color: #FFA500;



    border-color: #FFA500;



}







.contact-map iframe {



    border: 0;



    background-color:#ffc107;



    padding:10px;



    width: 100%;



    border-radius:9px;



    height: 300px;



    margin-top: 20px;



}







a {



    text-decoration: none;



    color: inherit;



}







.social-icons i {



    font-size: 24px;



    margin-right: 15px;



    color: #FFBF00;



}







@media (max-width: 768px) {



    .contact-box {



        padding: 20px;



    }







    .contact-inner {



        padding: 15px;



    }







    .contact-map iframe {



        height: 200px;



    }







    .form-input {



        padding: 8px;



    }







    .social-icons i {



        font-size: 20px;



        margin-right: 10px;



    }



}







@media (max-width: 480px) {



    .contact-page {



        padding: 30px 0;



    }







    .contact-box {



        margin-bottom: 20px;



    }







    .contact-box img {



        max-width: 60px;



    }







    .contact-box h4 {



        font-size: 18px;



    }







    .contact-box p,



    .form-description {



        font-size: 14px;



    }







    .form-input {



        padding: 6px;



    }



}







.service-area {

	position: relative;

	padding: 60px 0;

}



.service-heading {

	position: relative;

	background: #ffb9cc;

	margin-bottom: 20px;

}



.service-heading span {

	position: absolute;

	right: 0;

	animation: grow 1.5s ease-in infinite;

}



.service-heading strong {

	display: block;

	font-size: 54px;

	font-family: 'Oswald', sans-serif;

	font-weight: 600;

	text-transform: uppercase;

}



.city-card {

	padding: 10px;

}



.city-inner {

	position: relative;

	padding: 20px 20px 13px;

	background: #ffab00;

	border-radius: 20px;

}



.icon-pin {

	border-radius: 20px;

	position: relative;

	margin: 0 auto;

	z-index: -1;

}



.city-image {

	left: 0;

	right: 0;

	margin: 0 auto;

	top: 26px;

	display: flex;

	justify-content: center;

	align-items: center;

}



.city-image img {

	border: 3px solid #fff;

	border-radius: 20px;

	width:250px;

}



.city-name strong {

	display: block;

	font-size: 20px;

	padding-top: 9px;

	font-weight: 500;

	font-family: 'Oswald', sans-serif;

	color: #000;

}



.service-area .service-heading strong {

	color: #ffffff;

	background: darkorange;

}







.info-card {

background: linear-gradient(135deg, #15103d 50%, #ffc107 50%);

  border: 2px solid white;

  border-radius: 8px;

  padding: 20px;

  margin-top:20px;

  text-align: center;

  height: 250px;

  display: flex;

  flex-direction: column;

  justify-content: space-between;

  align-items: center;

  transition: transform 0.3s ease, box-shadow 0.3s ease;

}



.info-card:hover {

  transform: translateY(-5px);

  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);

}



.card-icon {

  font-size: 30px;

  color: yellow;

  margin-bottom: 15px;

  border: 2px dotted white;

  border-radius: 50%;

  padding: 10px;  /* Adjust padding to ensure the icon fits well inside the circle */

}





.card-icon i {

  transition: color 0.3s ease;

}



.info-card:hover .card-icon i {

  color: #ffd700;

}



.card-title {

  font-size: 22px;

  font-weight: bold;

  margin-bottom: 10px;

  color: white;

}



.card-text {

  font-size: 16px;

  color: white;

}



.info-card-col {

  margin-bottom: 20px;

}



@media (max-width: 767px) {

  .info-card-col {

    margin-bottom: 15px;

  }

}

   /* General Layout */

.magicservices-container {

  max-width: 1200px;

  margin: 0 auto;

  padding: 20px;

}



.magicservices-row {

  display: flex;

  flex-wrap: wrap;

  gap: 20px;

}



/* Psychic Info Section */

.magicservices-psychic-info {

  margin-bottom: 30px;

    margin-top:20px;



}







.magicservices-psychic-info p {

  font-size: 18px;

  font-family: 'Lexend Sans', sans-serif;

  color: #555;

  line-height: 1.6;

  margin-bottom: 30px;

  padding: 0 15px;

  text-align: justify;

}



/* Info Cards */

.magicservices-info-card-col {

  width: 100%;

  max-width: 950px; /* Adjusted card width */

  margin: 0 auto;

}



.magicservices-info-card {

background: #15103d;

  border: 1px solid #fdec19;

  border-radius: 10px;

  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);

  padding: 40px; /* Adjusted padding */

  text-align: center;

  transition: transform 0.3s ease;

  max-height: 350px; /* Set max height to prevent cards from becoming too large */

}



/* Icon Styling */

.magicservices-card-icon i {

  font-size: 55px; /* Adjusted icon size */

  border: 2px dotted #fff;

  color: #fdec19;

  padding:20px;

  border-radius: 50%;

  margin-bottom: 15px;

}



/* Card Title */

.magicservices-card-title {

  font-size: 26px; /* Increased title font size */

  font-weight: bold;

  color: #fdec19;

  margin-bottom: 10px;

}



/* Card Text */

.magicservices-card-text {

  font-size: 18px; /* Adjusted text size */

  text-align: center;

  color: #fdec19;

}



/* Footer Note */

.magicservices-footer-note {

  text-align: center;

  font-size: 16px;

  color: #333;

  border: 2px dotted #ffc107;

  border-radius: 20px;

  padding: 15px;

  margin-top: 30px;

  background-color: #fff;

}





.astroservice {



  padding: 20px;



}







.astroservice .text-box {





  padding: 20px;



  border-radius: 5px;



}













.astroservice .text-box p {



  font-size: 18px;



  color: #555;



  line-height: 1.6;



}







.astroservice img {



  width: 550px;



  height: 400px;

  

  border-radius: 5px;



  display: block;



  margin: 0 auto;

  

  margin-top:30px;



}



.second {



  padding: 20px;



}







.second .text-box {



  background-color: #f8f9fa;



  padding: 20px;



  border-radius: 5px;



}













.second .text-box p {



  font-size: 18px;



  color: #555;



  line-height: 1.6;



}







.second img {



  width: 400px;



  height: 400px;



  border-radius: 5px;



  display: block;

  

  margin: 0 auto; /* Centers the image horizontally */



}







/* Responsive adjustments */



@media (max-width: 768px) {



  .astroservice {



    padding: 20px;



  }







  .astroservice .text-box {



    padding: 15px;



  }







  .astroservice .text-box h2 {



    font-size: 16px;



  }







  .astroservice .text-box p {



    font-size: 14px;



  }







  .astroservice img {



    width: 250px;



    height: 250px;



  }



}







@media (max-width: 480px) {



  .astroservice {



    padding: 15px;



  }







  .astroservice .text-box h2 {



    font-size: 16px;



  }







  .astroservice .text-box p {



    font-size: 14px;



  }







  .astroservice img {



    width:100%;



    height: 250px;



  }



}



@media (max-width: 768px) {



  .second {



    padding: 20px;



  }







  .second .text-box {



    padding: 15px;



  }







  .second .text-box h2 {



    font-size: 16px;



  }







  .second .text-box p {



    font-size: 14px;



  }







  .second img {



    width: 250px;



    height: 250px;



  }



}







@media (max-width: 480px) {



  .second {



    padding: 15px;



  }







  .second .text-box h2 {



    font-size: 16px;



  }







  .second .text-box p {



    font-size: 14px;



  }







  .second img {



    width:100%;



    height: 250px;



  }



}

.newlocation {

  display: flex;

  justify-content: space-between;

  flex-wrap: wrap;

  padding: 20px;

}



.newlocation.location-find-text {

  width: 70%;

  padding-right: 20px;

}



.newlocation.location-find-images {

  width: 30%;

}



.newlocation.location-find-images .image-slider {

  display: flex;

  overflow: hidden;

  width: 100%;

  height: 100%;

  position: relative;

}



.newlocation.location-find-images .image-slider img {

  width: 100%;

  height: fit-content;

  object-fit: cover;

  display: none;

  margin-top: 20px;

  position: relative;

}



.newlocation.location-find-images .image-slider img.active {

  display: block;

  position: relative;

}



.newlocation.location-find-text h2 {

  margin-bottom: 10px;

  background-color: #15103d;

  color: #ffc107;

  padding: 10px;

  font-size: 22px;

  border-radius: 10px;

}



.newlocation.location-find-text p {

  font-size: 18px;

  color: #777;

  line-height: 1.6;

  margin-top: 10px;

}



.newlocation.location-find-text p + p {

  margin-top: 15px;

}



/* Responsive Design */

@media (max-width: 1200px) {

  .newlocation.location-find-text {

    width: 60%;

  }



  .newlocation.location-find-images {

    width: 40%;

  }

}



@media (max-width: 992px) {

  .newlocation.location-find-text {

    width: 100%;

    padding-right: 0;

  }



  .newlocation.location-find-images {

    width: 100%;

    margin-top: 20px;

  }



  .newlocation.location-find-images .image-slider img {

    margin-top: 10px; /* Adjust image margin for smaller screens */

  }

}



@media (max-width: 768px) {

  .newlocation.location-find-text h2 {

    font-size: 20px; /* Smaller font size for smaller screens */

    padding: 8px;

  }



  .newlocation.location-find-text p {

    font-size: 16px; /* Adjust paragraph font size */

  }



  .newlocation.location-find-text p + p {

    margin-top: 10px;

  }

}



@media (max-width: 480px) {

  .newlocation.location-find-text h2 {

    font-size: 18px; /* Even smaller font for mobile */

    padding: 6px;

  }



  .newlocation.location-find-text p {

    font-size: 14px;

  }



  .newlocation.location-find-text {

    width: 100%;

    padding-right: 0;

  }



  .newlocation.location-find-images {

    width: 100%;

    margin-top: 20px;

  }



  .newlocation.location-find-images .image-slider img {

    margin-top: 5px;

  }

}



















.read-more {

    display: inline-block;

    margin-top: 10px;

    font-size:16px;

    padding: 8px 16px;

    background-color: #15103d;

    color:#fdec19 ;  /* Yellow text */

    text-decoration: none;

    font-weight: bold;

    text-align:center;

    border-radius: 10px;

    transition: background-color 0.3s ease;

}



.read-more:hover {

    background-color: #fdec19;  /* Yellow background on hover */

    color: black;  /* Black text on hover */

}