
.mainsectionblog{
    display: flex;
    padding: 30px 0px;
}

.blogsidesection{
    width: 30%; 
}

.blogmainsection{
    width: 70%;
}

.breadcrumb{
    text-transform: uppercase;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 0;
}

.breadcum{
    margin-top: 50px;
    margin-bottom: 15px;
}

.breadcum a{
    text-decoration: none;
    color: black;
    font-weight: 600;
}

.breadcum a:hover{
    color: #0d6efd;
}

.breadcum a .arrowright{
    transform: rotate(270deg);
    width: 10px;
}

.metsectauth{ 
    max-width: 850px;
    font-size: 45px;
    font-weight: bold;
    padding-bottom: 14px; 
}

@media only screen and (max-width: 680px) {
  .blogmainsection{
    width: 100%;
  }
}

/* Quick answer css start */
.quickansermain {
    font-family: sans-serif;
    background-color: #eff4ff;
    padding: 20px;
    border-radius: 12px;
    border: 1px solid #d3e4fe;
    border-left: 5px solid #2563eb;
}

.quickansermain-header {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #1e40af;
  margin-bottom: 10px;
}

.quickansermain-header h2{
    font-size: 25px;
    font-weight: 500;
}

.quickansermain-header .icon{
  font-size: 21px;
}

.quickansermain-description {
  color: #334155;
  line-height: 1.5;
  margin-bottom: 20px;
}

.quickansermain-options {
  display: flex;
  gap: 15px;
}

.quickansermain-option-box {
  background: white;
  padding: 15px;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  border-color: rgb(195 198 214 / var(--tw-border-opacity, 1));
  flex: 1;
}

.quickansermain-icon-circle {
  font-size: 20px;
  margin-bottom: 5px;
}

.quickansermain-option-box h3 {
  margin: 5px 0;
  color: #1e293b;
}

.quickansermain-option-box p {
  font-size: 14px;
  color: #64748b;
  margin: 0;
}

.quickansermain-option-box .nonstopicon{
  color:#17a34b;
}
.quickansermain-option-box .dircticon{
  color:#dd851f;
}

.quickansermain-option-box .quicanseh3{
  font-size: 18px;
}
  
/* Quick answe css end */


/* Metaautor section css start */
.metsectionauthor-section {
  display: flex;
  align-items: center;
  gap: 24px; /* Items ke beech ka gap */
  font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  color: #4b5563; /* Dark grey color */
  font-size: 15px;
}

.metsectionauthor-meta-item {
  display: flex;
  align-items: center;
  gap: 8px; /* Icon aur text ke beech ka gap */
}

.metsectionauthor-author-img {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
  background-color: #e5e7eb;
}

.metsectionauthor-author-name {
  color: #1e40af; /* Blue color for name */
  font-weight: 500;
  cursor: pointer;
}

.metsectionauthor-author-name:hover {
  text-decoration: underline;
}

.metsectionauthor-meta-icon {
  font-size: 16px;
  opacity: 0.8;
}

.icontcbi{
    color: #1670ea;
    font-weight: bold;
}

/* Mobile responsive banane ke liye */
@media (max-width: 480px) {
  .metsectionauthor-meta-section {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }
}
/* Metaauto section css end  */


/* mid pera section css start */

.midperasection{
  margin-top: 45px;
}

/* mid pera section css end  */

/* dictionary section css start */

.dictionarysec{
    margin-top: 25px;
    border-left: 5px solid #2563eb;
    padding: 15px;
}
.mindictionaryhead{
    font-weight: 600;
    padding-bottom: 10px;
}
.mindictionaryhead i {
  color:#2563eb;
}

/* dictionary section css end  */

/* dictionary after pera section css start  */
.dictionarysecafterpera{
  margin-top: 35px;
}
/* dictionary after pera section css end  */

/* image section css start  */

.imagesection{
    border-radius: 10px;
    border: 1px solid #ccc;
    text-align: center;
}

.imagesectiopd{
    object-fit: cover;
    width: 100%;
    /*height: 300px;*/
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.imagesection p{
    padding-top: 12px;
    padding-bottom: 12px;
    margin: 0;
}
/* image section css end  */


/* comparing table css start */
.comparingtablesec{
  margin-top: 40px;
  margin-bottom: 40px;
}
/* comparing table css end */


/* Container styling */
.table-container {
    max-width: 1000px;
    margin-top: 25px;
}

/* Scroll handling for dynamic columns */
.table-wrapper {
  overflow-x: auto;
  border-radius: 10px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
  border: 1px solid #e0e6ed;
}

table {
  width: 100%;
  border-collapse: collapse;
  background-color: #fff;
  font-family: 'Segoe UI', sans-serif;
  min-width: 600px; /* Taki columns bahut chipke na */
}

/* Header Styling */
thead {
      background-color: rgb(239 244 255 / var(--tw-bg-opacity, 1));
}

th {
  text-align: left;
  padding: 15px 20px;
  font-size: 14px;
  font-weight: 600;
  color: #475569;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 2px solid #e2e8f0;
}

/* Body Styling */
td {
  padding: 15px 20px;
  font-size: 15px;
  color: #1e293b;
  border: 1px solid #dde1e5;
}

/* Hover Effect */
tbody tr:hover {
  background-color: #f1f5f9;
  transition: background 0.3s ease;
}


 
/* related guide section css start */

.relateduide a{
    border: 1px solid #c3c6d6;
    border-radius: 10px;
    margin-top: 50px;
    margin-bottom: 50px;
    padding: 15px 24px;
    flex-direction: row;
    display: flex;
    align-items: center;
    gap: 24px;
    text-decoration: none;
    color: #000;
}

.relateduide .relatedimagesection{
      width: 100px;
      height: 100px;
}

.relateduide .relatedimagesection .relaimg{
    width: 100%;
    object-fit: cover;
    border-radius: 5px;
    height: 100%;
}

.relateduide .relatedmainper{
    margin-top: 20px;
    flex: 1 1 0%;
}

.relatedmainper .relatedancho{
    color: rgb(0 61 155 / var(--tw-text-opacity, 1));
    text-decoration: none;
    text-transform: uppercase;
    font-size: 14px;
}

.relatedmainper h4{
  margin: 1px;
}

.relatediconsec i {
    font-size: 30px;
    color: rgb(0 61 155 / var(--tw-text-opacity, 1));
}

@media only screen and (max-width: 680px) {
  .relateduide a{    
    display: block;
    text-align: center;
    padding: 25px 24px;
  }
  .relateduide .relatedimagesection{
    width: 100%;
    height: 250px;
  }
  .relateduide .relatedimagesection .relaimg{
    width: 100%;
    object-fit: cover;
    border-radius: 5px;
    height: stretch;
  }
}

/* related guide section css end */


/* newsletter section css start */
.newsletter-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: #f0f7ff; /* Light blue background */
  padding: 40px;
  border-radius: 16px;
  max-width: 900px;
  margin: 20px auto; 
  gap: 30px;
  border: 1px solid #d3e4fe;
}

.newsletter-content {
  flex: 1;
}

.newsletter-content h2 {
  margin: 0 0 10px 0;
  color: #1a202c;
}

.newsletter-content p {
  margin: 0;
  color: #4a5568;
  line-height: 1.5;
}

.newsletter-form {
  flex: 0 0 400px; /* Form ki fixed width */
}

.newsletter-form form {
  display: flex;
  gap: 10px;
}

.newsletter-form input {
  flex: 1;
  padding: 12px 16px;
  border: 1px solid #cbd5e0;
  border-radius: 6px;
  font-size: 16px;
}

.newsletter-form button {
  background-color: #003399; /* Deep blue color */
  color: white;
  border: none;
  padding: 12px 24px;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 600;
}

.newsletter-form .privacy-note {
  font-size: 12px;
  color: #718096;
  margin-top: 8px;
}

/* Mobile Responsive */
@media (max-width: 768px) {
  .newsletter-card {
    flex-direction: column;
    text-align: center;
  }
  .newsletter-form {
    width: 100%;
    flex: 0 0 0;
  }
  .newsletter-form form{
    display: block;
  }
  .newsletter-form input, .newsletter-form button{
    width: 100%;
  }
  .newsletter-form button{
    margin-top: 14px;
  }
}
/* newsletter section css end */

/* summery pera section css start */

.summerysection{
    border-bottom: 1px solid #c7c8c9;
    padding-bottom: 30px;
}

.summerysection h2{
    margin-top: 45px;
    margin-bottom: 20px;
}
.summerysection .icon{
    color:#2563eb;
}
.summerysection span{
    font-weight: 500;
}
/* summery pera section css end */

/* related guide section css start */
    .travelguide a{
        border: 1px solid #c3c6d6;
        border-radius: 10px;
        margin-top: 50px;
        margin-bottom: 50px;
        padding: 15px 24px;
        flex-direction: row;
        display: flex;
        align-items: center;
        gap: 24px;
        text-decoration: none;
        color: #000;
    }

    .travelguide .travelguideimagesection{
        width: 80px;
        height: 80px;
    }

    .travelguide .travelguideimagesection .relaimg{
        width: 100%;
        object-fit: cover;
        border-radius: 5px;
        height: 100%;
    }

    .travelguide .travelguidemainper{
        margin-top: 15px;
        flex: 1 1 0%;
        margin-bottom: 15px;
    }

    .travelguidemainper .travelancho{
        color: rgb(0 61 155 / var(--tw-text-opacity, 1));
        text-decoration: none;
        text-transform: capitalize;
        font-size: 14px;
        font-weight: 500;
    }

    .travelguidemainper h4{
        margin: 1px;
        margin-bottom: 5px;
    }

    .travelguidemainper p{
        margin: 1px;
    }

    .relatediconsec i {
        font-size: 30px;
        color: rgb(0 61 155 / var(--tw-text-opacity, 1));
    }

    .travelguide .travelexpespn{
        background: rgb(220 233 255);
        color: #0059dc;
        padding: 4px 10px;
        border-radius: 21px;
        font-size: 13px;
    }

    @media only screen and (max-width: 680px) {
        .travelguide a{    
            display: block;
            text-align: justify;
            padding: 25px 24px;
        }
        .travelguide .travelguideimagesection{
            width: 80px;
            height: 80px;
        }
        .travelguide .travelguideimagesection .relaimg{
            width: 100%;
            object-fit: cover;
            border-radius: 5px;
            height: stretch;
        }
    }

    /* related guide section css end */

     /* Sidebar Menu Section start */
    .sidemenusection {
        background: #ffffff; 
        padding: 25px;
        padding-left: 0;
        margin-bottom: 20px;
        border-radius: 5px;
        margin-right: 25px;
        padding-top: 0px;

        position: sticky;   /* important */
        top: 20px;          /* kitna gap chahiye top se */
        z-index: 100;       /* overlap avoid karne ke liye */
    }

    .sidemenusection .sidemenutitle {
        font-size: 17px;
        font-weight: 500;
        margin-bottom: 30px;
        color: rgb(11 28 48 / var(--tw-text-opacity, 1));
    }
    .sidemenusection .sidemenumeta {
        font-size: 14px;
        color: #666;
    }
    .sidemenusection .sideintroduc {
        font-size: 15px;
        font-weight: 500;
        color: rgb(100 116 139 / var(--tw-text-opacity, 1));
        line-height: 1.5;
        margin-bottom: 17px;
        letter-spacing: 0.5px;
        text-decoration: none;
    }

    .sidemenusection .sideintroduc.active {
        color: #0059dc;
        font-weight: 600;
    }

    .sideintroduc a i{
      color: #0059dc;
    }

    .sideintroduc a:hover{
      color: #0059dc;
    }

    @media only screen and (max-width: 680px) {
        .blogsidesection {
            display: none;
        }
    }
    /* Sidebar Menu Section end */

    /* faq section css start */
    .accordion-button{
      font-weight: 500;
    }
    .faq-section h2{
      margin-top: 45px;
      margin-bottom: 25px;
    }
    /* faq section css end */

