* {
    margin: 0;
    padding: 0;
}

html {
  scroll-behavior: smooth;
}

.hidden {
    display: none;
}

::selection {
  background: #e0e0fed6;
  color: #001026;
}

body {
    width: 100vw;
    /*display: flex;*/
    /*align-items: center;*/
    /*flex-direction: column;*/
    overflow-x: hidden;
    overflow-y: inherit !important;
    min-height: 100vh;
    max-width: 100%;
}

body * {
    max-width: 1920px;
}


/* fonts */
@font-face {
  font-family: Mfont-Regualr;
  src: url(../fonts/OpenSans-Regular.ttf);
}

.Mfont-regular {
    font-family: Mfont-Regualr !important;
}
  
  
@font-face {
  font-family: Mfont-Bold ;
  src: url(../fonts/OpenSans-Bold.ttf);
}

.Mfont-Bold {
  font-family: Mfont-Bold !important;
}

@font-face {
  font-family: Mfont-Semi ;
  src: url(../fonts/OpenSans-SemiBold.ttf);
}

.Mfont-Semi {
  font-family: Mfont-Semi !important;
}

@font-face {
  font-family: Mfont-Medium ;
  src: url(../fonts/IRANYekanMedium.ttf);
}

.Mfont-Medium {
  font-family: Mfont-Medium !important;
}

@font-face {
  font-family: Mfont-ExtraBold ;
  src: url(../fonts/IRANYekanExtraBold.ttf);
}

.Mfont-ExtraBold {
  font-family: Mfont-ExtraBold !important;
}

.main-new {
    font-family: Mfont-Regualr, serif !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: center !important;
    min-height: 100vh !important;
    gap: 30px !important;
    padding-bottom: 150px !important;
    overflow: hidden !important;

    p, span {
        font-family: Mfont-Regualr, serif !important;
    }
}

.main-new h1,
.main-new h2,
.main-new h3,
.main-new h4,
.main-new h5,
.main-new h6 ,
.main-new p {
 margin: 0 !important;
}

.Hero_bg_color {
    background-color: #F5F8FB !important;
}

.width_screen {
    width: 100vw;
}

.hero_styles {
    padding: 160px 0 90px 0 ;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
}


.Hero_title {
   color: #2E3358;
}

@media (max-width:576px) {
   .large_h1 {
      font-size: 30px;
      margin-bottom: 24;
  }
  .Hero_discription {
    font-size: 14px !important;
    line-height: 26px !important;
    margin-top: 24px !important;
  }

  .Hero_img {
    min-width: 100%;
    max-width: 100%;
    margin: 0 auto;
  }
  
  .all_titles {
    color: #444663;
    font-size: 18px;
  }
  .all_Descriptions {
    color: #73798B;
    font-size: 14px;
  }
}

@media (min-width:576px) and (max-width: 1200px) {
   .large_h1 {
       font-size: 30px;
       margin-bottom: 24;
   }
   .Hero_discription {
     font-size: 14px !important;
     line-height: 26px !important;
     margin-top: 24px !important;
   }

   .Hero_img {
     min-width: 370px;
     max-width: 370px;
     margin: 0 auto;
   }
   
   .all_titles {
     color: #444663;
     font-size: 18px;
   }
   .all_Descriptions {
     color: #73798B;
     font-size: 14px;
   }
   
}

@media (min-width: 1200px) {
    .large_h1 {
        font-size: 34px;
        margin-bottom: 30px;
    }
    .hero_gap {
      gap: 80px;
    }
    .all_titles {
      color: #444663;
      font-size: 20px;
    }
    .all_Descriptions {
      color: #73798B;
      font-size: 16px;
    }

    .cards_gap {
      gap: 32px !important;
    }
    .Hero_discription {
      font-size: 18px !important;
      line-height: 32px !important;
      margin-top: 28px !important;
    }

    .Hero_img {
      min-width: 430px;
      max-width: 430px;
      margin: 0 auto;
    }
    
    
}




.hero_button {
    font-size: 16px !important;
    padding: 8px 25px;
    border-radius: 9999px;
    background: white;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #EEF0F3 ;
    transition: all 300ms ease;
    margin-top: 32px;
}
.hero_button:focus {outline: none;}
.hero_button:hover {
    box-shadow: 0px 10px 30px #5d33d11a;
}

.underline_effect {
    position: relative;
    color: #6E76C1;
    font-size: 34px !important;
}







.medium_marginTop {
  margin-top: 65px;
}

.category_cards {
  background: linear-gradient(to top, #F7FBFF, #ffffff);
  padding-bottom: 16px;
  border-radius: 20px;
  margin-top: 20px;
  margin-bottom: 20px;
}
.cc_1 {
  background: linear-gradient(to top, #F7FBFF, #ffffff);
}
.cc_2 {
  background: linear-gradient(to top, #FFFEF7, #ffffff);
}
.cc_3 {
  background: linear-gradient(to top, #FDF7FF, #ffffff);
}
.cc_4 {
  background: linear-gradient(to top, #F7FFFD, #ffffff);
}
.cc_5 {
  background: linear-gradient(to top, #F7F8FF, #ffffff);
}
.cc_6 {
  background: linear-gradient(to top, #F7FFF7, #ffffff);
}





.category_cards .white_boxs {
  width: 80px;
  height: 80px;
  display: flex;
  justify-content: center ;
  align-items: center;
  box-shadow: 0 5px 15px #5d33d112;
  margin: 0 auto 16px auto;
  border-radius: 10px;
}

.category_cards .white_boxs img {
  width: 32px;
  height: 32px;
}

.category_cards h3 {
  font-size: 16px;
  color: #4D527E;
}

.category_cards span {
  font-size: 14px;
  color: #777E9E !important;
}

.level_container {
  background-color: #0D2239;
  border-radius: 10px;
  padding: 40px 0 40px 32px;
  gap: 80px;

}

.level_container h2 {
  color: white ;
  font-size: 20px;
}

.level_container p{
  color: #DEE5EA !important;
  font-size: 16px !important;

}
.level_container .content-wrapper{
    color: #DEE5EA !important;
    font-size: 16px !important;

}


.level_btn {
  gap: 16px;
  border-radius: 5px;
  font-size: 18px;
  color: #BBC7D4;
  background: transparent;
  border: 1px solid transparent;
  padding: 10px 16px;
  transition: all 200ms ease;
}

.level_btn:focus {
  outline: none;
}

.level_btn:hover {
  border-color: #9FC1EA;
}

.active_level_btn {
  background-color: #2A4A6E;
  border-color: #9FC1EA;
  color: #9FC1EA;
  
}


.level_container .view_posts_link {
  gap: 12px;
  border-radius: 5px;
  font-size: 14px;
  color:  #EDF0F5;
  background: transparent;
  border: 1px solid #EDF0F5;
  padding: 10px 16px;
  transition: all 200ms ease;
  text-decoration: none;
  svg {
    transition: all 200ms ease;
  }
}

.level_container .view_posts_link:hover svg {
  transform: translateX(4px);
}

.Swiper_custome_btns {
  margin-left: 34px;
  display: flex;
  justify-content: start;
  align-items: center;
  gap: 8px;
}

.Swiper_custome_btns button {
  border-radius: 9999px ;
  width: 36px;
  height: 36px;
  background-color: #193E68;
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  transition: all 200ms ease;
  cursor: pointer;
}

.Swiper_custome_btns button:hover {
  background-color: #9FC1EA;
}

.focus_outline_no:focus {
  outline: none;
}

.Swiper_posts_cards {
  width: 320px !important;
  height: 170px;
  border-radius: 10px;
  position: relative;
  border: 1px solid transparent;
  display: block;
}

.Swiper_posts_cards img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  border-radius: 10px;
}

.Swiper_posts_cards .Swiper_posts_cards_descript {
  position: absolute;
  bottom: 0;
  width: 100%;
  border-radius: 10px;
  padding: 40px 16px 16px 16px;
  background: linear-gradient(to top, #041222, rgba(255, 255, 255, 0));
  
}

.Swiper_posts_cards .Post_contant_Writer {
  font-size: 12px;
  color: #CED3D7;
}

.Post_Study_Duration {
  font-size: 12px;
  color: #CED3D7;
  margin-left: 16px;
  display: flex ;
  justify-content: start;
  align-items: center;
  gap: 8px;
}
.Post_Study_Duration span {
  width: 4px;
  height: 4px;
  background-color: #CED3D7 !important;
  border-radius: 9999px;
}

.Swiper_posts_cards .Post_title {
  color: white;
  font-size: 18px;
  line-height: 24px;
}

.Swiper_posts_cards .Post_icon svg {
  color: white;
  transition: all 200ms ease;
}

.Swiper_posts_cards:hover .Post_icon svg {
  color: #616CD2;
}

.active_post_cards {
  border-color: #9FC1EA !important;
}

.active_post_cards::before {
  content: "";
  position: absolute;
  bottom: -16px;
  width: 100%;
  height: 2px;
  background-color: #9FC1EA !important;
}

.line_clamp_2 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.line_clamp_1 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

@media only screen and (max-width:576px) {
  .Swiper_posts_cards {
    width: 95%;
    height: 170px;
    border-radius: 10px;
    position: relative;
    border: 1px solid transparent;
    display: block;
  }
}

@media only screen and  (max-width:992px) {
  .level_container_left_div {
    width: 100%;
  }
  .level_container_right_div {
    width: 100%;
    margin-top: 30px !important;
  }
  .level_container {
    padding: 20px;
    width: 95%;
  }
}

@media only screen and  (min-width:992px) and (max-width:1200px) {
  .level_container_left_div {
    width: 40%;
  }
  .level_container_right_div {
    width: 60%;
  }
}

@media only screen and  (min-width:1200px) {
  .level_container_left_div {
    width: 35%;
  }
  .level_container_right_div {
    width: 65%;
  }
}

@media (min-width:1200px) {
   .blog_topics_div {
      margin: 35px auto 0 auto;
      width: 70%;
      display: flex;
      justify-content: center;
      flex-wrap: wrap;
      gap: 24px;
    }
}
@media (max-width:1200px) {
   .blog_topics_div {
      margin: 35px auto 0 auto;
      width: 100%;
      display: flex;
      justify-content: center;
      flex-wrap: wrap;
      gap: 24px;
    }
}

.blog_topics_links {
  position: relative;
  background-color: #F7F8FA; 
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 8px 30px;
  border-radius: 5px;
  color: #4D527E; 
  font-size: 16px; 
  transition: all 200ms ease;
  overflow: hidden;
}

.blog_topics_links::after {
  content: '';
  width: 16px;
  height: 16px;
  background: white;
  border-radius: 999px;
  position: absolute;
  right: -8px;
}

.blog_topics_links::before {
  content: '';
  width: 16px;
  height: 16px;
  background: white;
  border-radius: 999px;
  position: absolute;
  left: -8px;
}

.blog_topics_links:hover {
  background-color: #4D527E; 
  color: #F7F8FA;
  text-decoration: none;
}

.view_all_posts {
  gap: 12px;
  border-radius: 5px;
  font-size: 14px;
  color:  #2B3642;
  background: transparent;
  border: 1px solid #EDF0F5;
  padding: 10px 16px;
  transition: all 200ms ease;
  text-decoration: none;
  width: fit-content;
  white-space: nowrap;
  margin-top: 10px;
  svg {
    transition: all 200ms ease;
  }

}

.view_all_posts:hover {
   text-decoration: none;
   color: inherit;
}

@media (min-width:0px) and (max-width:576px) {
   .scrollable_posts {
       display: grid;
       grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
       gap: 14px;
       max-height: auto;
       overflow: auto;
       padding-right: 8px;
   }
   .big_posts_cards .big_posts_cards_descript {
      position: absolute;
      bottom: 0;
      width: 100%;
      border-radius: 10px;
      padding: 24px;
      background: linear-gradient(to top, #041222, rgba(255, 255, 255, 0));
    }
 }
 @media  (max-width:992px) {
   .scrollable_posts {
       display: grid;
       grid-template-columns: repeat(2, minmax(0, 1fr));
       gap: 14px;
       max-height: auto;
       overflow: auto;
       padding-right: 8px;
   }

   .big_posts_cards {
     width: 100%;
     height: 350px;  
     border-radius: 10px;
     position: relative;
     border: 1px solid transparent;
     display: block;
   }

   .news_left_div {
     width: 100%;

   }
   .news_right_div {
     width: 100%;
     margin-top: 30px;
   }
   .big_posts_cards .big_posts_cards_descript {
     position: absolute;
     bottom: 0;
     width: 100%;
     border-radius: 10px;
     padding: 24px;
     background: linear-gradient(to top, #041222, rgba(255, 255, 255, 0));
   }
 }
 @media (min-width:992px) {
   .scrollable_posts {
     display: grid;
     grid-template-columns: repeat(1, minmax(0, 1fr));
     gap: 14px;
     max-height: 450px;
     overflow: auto;
     padding-right: 8px;
 }

 .big_posts_cards {
   width: 100%;
   height: 450px;  
   border-radius: 10px;
   position: relative;
   border: 1px solid transparent;
   display: block;
 }
 .news_left_div {
     width: 70%;

   }
   .news_right_div {
     width: 30%;
     margin-top: 0px;
   }
   .big_posts_cards .big_posts_cards_descript {
     position: absolute;
     bottom: 0;
     width: 100%;
     border-radius: 10px;
     padding: 40px;
     background: linear-gradient(to top, #041222, rgba(255, 255, 255, 0));
   }
 }

.big_posts_cards img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 object-position: center;
 border-radius: 10px;
}



.big_posts_cards .big_Post_contant_Writer {
font-size: 14px;
color: #CED3D7;
}

.big_Post_Study_Duration {
font-size: 14px;
color: #CED3D7;
margin-left: 24px;
display: flex ;
justify-content: start;
align-items: center;
gap: 8px;
}
.big_Post_Study_Duration span {
width: 4px;
height: 4px;
background-color: #CED3D7;
border-radius: 9999px;
}

.big_posts_cards .big_Post_title {
color: white;
font-size: 18px;
line-height: 24px;
}

.big_posts_cards .big_Post_icon svg {
color: white;
transition: all 200ms ease;
}

.big_posts_cards:hover .big_Post_icon svg {
color: #616CD2;
}

.big_post_text {
font-size: 16px;
color: #CED3D7;
margin-top: 16px !important;
}

.big_post_date {
font-size: 14px;
color: #CED3D7;
}

.big_post_level {
font-size: 14px;
border-radius: 999px;
padding: 8px 24px;
color: #B6A9EC;
background-color: #2c19748c;
border: 1px solid #B6A9EC;
}

.posts_scroll_color::-webkit-scrollbar {
     width: 5px;
 }
       
 .posts_scroll_color::-webkit-scrollbar-thumb {
     background: #DFE2E6;
     border-radius: 20px;
 }

 .line_clamp_3 {
   overflow: hidden;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 3;
 }



/* single weblog  */
.weblog_top_navbar {
  display: flex;
  justify-content: start;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  span {
      font-family: Mfont-Regualr !important;
  }
    a {
        font-family: Mfont-Regualr !important;
    }
}

[data-event="scroll_to_heading"] {
    font-family: Mfont-Regualr !important;
}

@media (max-width:1200px) {
  .weblog_top_navbar a {
    color: #616CD2;
    font-size: 14px;
  }
  .weblog_top_navbar span {
    color: #616CD2;
    font-size: 14px;
  }
}

@media (min-width:1200px) {
  .weblog_top_navbar a {
    color: #616CD2;
    font-size: 18px;
  }
  .weblog_top_navbar span {
    color: #616CD2;
    font-size: 18px;
  }
}

.weblog_top_navbar a:hover {
  text-decoration: underline;
}

@media (max-width:1200px) {
  .weblog_main_title {
    color: #1F2937;
    font-weight: bold;
    margin-top: 12px;
    font-size: 21px;
  }
  .weblog_main_img {
    margin-top: 24px;
    width: 100%;
    border-radius: 10px;
    height: 300px;
  }
  .weblog_main_content {
   margin-top: 48px;
      h2, h3, h4, h5, h5 {
          margin-top: 25px !important;
          color: #1F2937;
          font-size: 18px !important;
          font-weight: bold;
      }

      h2 strong,
      h3 strong,
      h4 strong,
      h5 strong

      {
          all: unset !important;
      }
      p {
          color: #374151;
          margin-top: 8px !important;
          margin-bottom: 6px !important;
          font-size: 14px;
          line-height: 28px;
          text-align: justify;
          font-family: Mfont-Regualr, serif !important;
      }
      li {
          font-family: Mfont-Regualr, serif !important;
      }
      span {
          font-family: Mfont-Regualr, serif !important;
      }
      ul {
          margin-top: 25px !important;
          margin-bottom: 20px !important;
      }   
   }
}
@media (min-width:1200px) {
  .weblog_main_title {
    color: #1F2937;
    font-weight: bold;
    margin-top: 12px;
    font-size: 24px;
  }
  .weblog_main_img {
    margin-top: 24px;
    width: 100%;
    border-radius: 10px;
    height: 450px;
  }
  
  .weblog_main_content {
   margin-top: 48px;

     h2, h3, h4, h5, h5 {
          margin-top: 25px !important;
          color: #1F2937;
          font-size: 18px !important;
          font-weight: bold;
      }

      h2 strong,
      h3 strong,
      h4 strong,
      h5 strong

      {
          all: unset !important;
      }

      p {
          color: #374151;
          margin-top: 8px !important;
          margin-bottom: 6px !important;
          font-size: 14px;
          line-height: 28px;
          text-align: justify;
      }
      ul {
          margin-top: 25px !important;
          margin-bottom: 20px !important;
      }   
   }
}


        
.weblog_author_pfp {
   width: 40px;
  height: 40px;
  border-radius: 100%;
}

.weblog_author_profession {
   font-size: 14px;
   color: #4B5563;
   margin-left: 12px;
}

.blog_author_box {
   margin-top: 18px;
   padding: 12px;
   background: #F5F8FB;
   border-radius: 10px;
}

.weblog_straight_line {
   width: 1px;
   height: 30px;
   border-right: 1px solid #CED3D7;
   margin: 0 24px;
}

.weblog_time_text {
   font-size: 14px;
   margin-left: 8px;
   color: #4B5563;
}

.weblog_time_icon {
   min-width: 16px; 
   max-width: 16px;
}


.single_blog_right_div {
       width: 100%;
   }

.single_blog_left_div {
   width: 100%;
}

@media (min-width:1200px) {
.weblog_main_content {
   margin-top: 48px;
    h2, h3, h4, h5, h5 {
        margin-top: 25px !important;
        color: #1F2937;
        font-size: 18px !important;
        font-weight: bold;
    }

    h2 strong,
    h3 strong,
    h4 strong,
    h5 strong

    {
        all: unset !important;
    }

      p {
          color: #343E4C;
          margin-top: 16px  !important;
          margin-bottom: 10px !important;
          font-size: 14px;
          line-height: 24px;
      }   
      ul {
       margin-top: 25px !important;
       margin-bottom: 20px !important;
   }
 }
 .single_blog_right_div {
   width: 25%;
}

.single_blog_left_div {
   width: 75%;
}

}

.Recommended_part {
   margin-top: 48px;
   margin-bottom: 48px;
   background-color: #4B5FC5;
   border-radius: 10px;
   padding: 16px 24px;
   display: flex;
   gap: 10px;
   justify-content: space-between;
   align-items: center;
}

.title_recommended {
   font-size: 16px;
   color: white;
}

.link_recommended {
   font-size: 16px;
   color: white;
   margin-left: 12px;   
   text-decoration: underline;
}
.link_recommended:hover {
   color: white;
   text-decoration: none;
}


.copy_box_weblog {
   position: relative;
   margin: 32px 0 20px 0;
   box-shadow: 0 5px 20px #4d527e1a;
   padding: 20px;
   border-radius: 10px;
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: 20px;
}
.copy_box_weblog::before {
   content: '';
   position: absolute;
   width: 4px;
   height: 60%;
   border-top-left-radius: 10px ;
   border-bottom-left-radius: 10px;
   left: -4px;
   background-color: #1EAA4C;
}


.copy_box_weblog .copy_box_weblog_text {
   font-size: 16px;
   color: #4B5563;
}
.copy_box_weblog .copy_box_weblog_button {
   width: 32px;
   height: 32px;
   border-radius: 5px;
   background-color: #F5F8FB;
   border: none;
   cursor: pointer;
   color: #4B5563;
   display: flex;
   justify-content: center;
   align-items: center;
   transition: all 200ms ease;
}
.copy_box_weblog .copy_box_weblog_button:hover {
   background-color: #4B5563;
   color: #F5F8FB;
}

.plan_cards_div {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 24px;
   margin: 60px 0;
}

.plan_cards {
   padding: 24px;
   border-radius: 15px;
   box-shadow: 0 3px 20px #4d527e1a;
   border: 1px solid transparent;
}

.plan_cards_title {
   font-size: 18px !important;
   color: #2E3358 !important;
}

.plan_cards_price {
   font-size: 24px !important;
   color: #232747;
}

.plan_cards_duration {
   font-size: 18px !important;
   color: #232747;
}

.plan_cards_features {
   margin-top: 24px;
   display: grid;
   gap: 12px;
}
.plan_cards_features_circle {
   width: 6px;
   height: 6px;
   border-radius: 999px;
   background: #1EAA4C;
}


.plan_cards_features_value {
   color: #4B5563;
   font-size: 14px;
}
.plan_cards_features_type {
   color: #4B5563;
   font-size: 14px;
   white-space: nowrap;
}
.gap_4 {
   gap: 16px;
}

.plan_card_btn {
   margin-top: 32px;
   background-color: transparent;
   border: 1px solid #3B2F85;
   padding: 10px;
   color: #3B2F85;
   border-radius: 5px;
   font-size: 14px;
   transition: all 200ms ease;
   width: 100%;
}

.plan_card_btn:hover {
   background-color: #3B2F85;
   color: white;
}

.active_plan_card_btn {
   margin-top: 32px;
   background-color: #3B2F85 !important;
   border: 1px solid #3B2F85 !important;
   padding: 10px;
   color: white !important;
   border-radius: 5px;
   font-size: 14px;
   transition: all 200ms ease;
   width: 100%;
}

.active_plan_card_btn:hover {
   background-color: white !important;
   color: #3B2F85 !important;
}

.single_blog_container {
   gap: 40px;
}

.ative_plan_cards {
   border-color: #3B2F85 !important;
}

@media (min-width:576px) and (max-width:991px) {
   .plan_cards_div {
       grid-template-columns: repeat(2, minmax(0, 1fr));
   }
}

@media (max-width:576px) {
   .plan_cards_div {
       grid-template-columns: repeat(1, minmax(0, 1fr));
   }
}

.FAQ_title {
   font-size: 20px;
   color: #374151;
}

.FAQ_box {
   width: 40px;
   height: 40px;
   border-radius: 5px;
   background-color: #F5F8FB;
}
.FAQ_box_image {
   width: 22px;
   height: 22px;
}

.faq_sections {
   display: grid;
   margin-top: 32px;
   gap: 20px;
}

.faq_container {
  background: white ;
  width: 100%;
  padding: 12px 24px;
  border-radius: 10px;
  box-shadow: 0 5px 20px #4d527e1a;
}

/* FAQ  */
@media screen and (max-width:640px) {       
.my-accordion button .icon {
   top: 18px !important;
}
}


@media screen and (max-width:1280px) {
.my-accordion .accordion-content p {
   font-size: 12px;
   font-weight: normal;
}
.my-accordion button {
   position: relative;
   display: flex ;
   justify-content: space-between;
   align-items: center;
   width: 100%;
   padding: 14px 0;
   font-size: 16px;
   font-weight: bold;
   border: none;
   background: none;
   outline: none;
}
}

@media screen and (min-width:1280px) {
.my-accordion .accordion-content p {
   font-size: 14px;
   font-weight: normal;
}
.my-accordion button {
   position: relative;
   display: flex ;
   justify-content: space-between;
   align-items: center;
   width: 100%;

   padding: 14px 0;
   font-size: 18px;
   font-weight: bold;
   border: none;
   background: none;
   outline: none;
}
}


.my-accordion button[aria-expanded=true] .icon-faq  svg {
   transition: all 200ms ease;
transform: rotate(90deg) !important;  
}

.icon-faq {
   background-color: #F3F4F6;
   width: 24px;
   height: 24px;
   border-radius: 5px;
   padding: 6px;
   color: #9ca3af;
  transition: all 200ms ease;
}

.my-accordion button[aria-expanded=true] .icon-faq  {
color: white !important;
background-color: #616CD2;  
}
.accordion-title {
   font-size: 16px;
   color: #374151;
}

.accordion_description {
   font-size: 16px;
   color: #4B5563;
}


.accordion-content {
   border-top: 1px solid #ebe7eb;
opacity: 0;
max-height: 0; 
overflow: hidden;
transition: opacity 500ms ease-out, max-height 500ms ease-out; 
padding: 0 14px; 
}

.cursor-pointer {
    cursor: pointer;
}

.accordion-button[aria-expanded="true"] + .accordion-content {
    opacity: 1;
    max-height: 1000px;
    padding: 14px;
}

.accordion-button:focus {
    outline: none !important;
}

.rating_blog_box {
   margin-top: 64px;
   background: white;
   border-radius: 10px;
   box-shadow: 0 5px 20px #4d527e1a;
   padding: 24px;
}
.rating_blog_box_title {
   font-size: 16px;
   color: #374151;
}

.weblog-all-tags {
   gap: 16px;
}

.weblog-all-tags a {
  background-color: #F5F8FB;
  border-radius: 5px;
  padding: 6px 16px;
  font-size: 14px;
  color:   #374151 ;
  transition: 300ms ease;
  text-decoration: none;
}

.weblog-all-tags a:hover {
   background-color: #374151;
   color: #F5F8FB;
}

.post_container {
   padding: 48px 0;
   background-color: #E5E7EB;
   margin-top: 100px;
}

@media (max-width:576px) {
.post_cards {
   width: 280px !important;
   overflow: hidden;
   border-radius: 10px;
   box-shadow: 0 5px 20px #4d527e1a;
   background: white;
   color: inherit !important; 
   
}
.post_cards_image_container {
   position: relative;
   overflow: hidden;
   height: 150px;
}

}

@media (min-width:576px) {
.post_cards {
   width: 320px !important;
   overflow: hidden;
   border-radius: 10px;
   box-shadow: 0 5px 20px #4d527e1a;
   background: white;
   color: inherit !important; 
   
}

.post_cards_image_container {
   position: relative;
   overflow: hidden;
   height: 185px;
}
}
.post_cards:hover {
text-decoration: none;
}

.post_cards_main_div {
   padding: 18px;
   background-color: white;
   border-bottom-right-radius: 10px;
   border-bottom-left-radius: 10px;
}

.Post_cards_Author {
color: #6B7280;
font-size: 12px;
}

.Post_cards_Duration {
   font-size: 12px;
   color: #6B7280;
   margin-left: 12px;
   display: flex;
   justify-content: start;
   align-items: center;
   gap: 8px;
}

.Post_cards_Duration span {
   width: 4px;
   height: 4px;
   background-color: #6B7280;
   border-radius: 9999px;
}

.Post_cards_Title {
   margin-top: 16px !important;
   font-size: 16px;
   color: #374151;
   line-height: 24px;
}
.Post_cards_description {
   font-size: 14px;
   margin-top: 10px !important;
   color: #4B5563;
}

.post_cards_level {
   background-color: #F2F0FF;
   color: #3B2F85;
   font-size: 12px;
   padding: 5px 16px;
   border-radius: 24px;
}
.post_cards_date {
   color: #6B7280;
   font-size: 12px;
}

.Post_cards_icon svg {
   color: #CED3D7;
   transition: all 200ms ease;
}

.post_cards:hover .Post_cards_icon svg {
   color: #616CD2;
}
.Posts_Swiper_custom_btn {
   min-width: 40px;
   max-width: 40px;
   height: 40px;
   border-radius: 5px;
   background-color: white;
   color: #4B5563;
   border: none ;
   cursor: pointer;
   display: flex;
   justify-content: center;
   align-items: center;
   transition: 200ms ease;
}

.Posts_Swiper_custom_btn:hover {
   background-color: #4B5563;
   color: white;
}


.Post_cards_image {
   object-fit: cover;
}

.leave_comment_section {
   border-radius: 10px; 
   margin-top: 32px;
   padding: 24px;
   box-shadow: 0px 0px 20px #4d527e1a;
}

@media (max-width:576px) {
   .Comment_inputs {
       display: grid;
       grid-template-columns: repeat(1, minmax(0, 1fr));
       row-gap:  16px;
       column-gap: 24px;
   }
   .col_span_2 {
   grid-column: span 1 / span 1;
}

}

@media (min-width:576px) {
   .Comment_inputs {
       display: grid;
       grid-template-columns: repeat(2, minmax(0, 1fr));
       row-gap:  16px;
       column-gap: 24px;
   }
   .col_span_2 {
   grid-column: span 2 / span 2;
}

}
.comment_input_titles {
   font-size: 16px;
   color: #4B5563;
}

.form_comment_inputs {
   margin-top: 8px;
   width: 100%;
   font-size: 14px;
   border: 1px solid #E5E7EB;
   color: #9ca3af;
   border-radius: 5px;
   padding: 12px;
   outline: none;
}


.Submit_from_btn {
   margin-top: 24px;
   background-color: #616CD2;
   color: white;
   border-radius: 5px;
   padding: 9px 18px;
   font-size: 16px;
   border: 1px solid #616CD2;
   transition: all 200ms ease;
}

.Submit_from_btn:focus {
   outline: none;
}

.Submit_from_btn:hover {
   background-color: white;
   color: #616CD2;
}

.all_comments_div {
   margin-top: 32px;
   display: grid;
   gap: 16px ;
}

.each_comment_div {
   display: grid ;
   gap: 16px;
}

.main_comment_div {
   padding: 24px;
   border-radius: 15px;
   box-shadow: 0px 0px 30px #4d527e1a;
   background-color: white;

}
.Comment_author {
   font-size: 16px;
   color: #4B5563;
}
.Comment_date {
   font-size: 14px;
   color: #9CA3AF;
}

.comment_text {
   font-size: 14px;
   color: #6B7280;
   line-height: 24px;
}

.comment_reply_button {
   background-color: #f3f4f6;
   border-radius: 5px;
   color: #4B5563;
   font-size: 14px;
   border: none;
   padding: 5px 16px;
   transition: all 200ms ease;
   outline: none;
}

.comment_reply_button:focus {
   outline: none;
}

.comment_reply_button:hover {
   background-color: #4B5563;
   color: #f3f4f6;
}

.comment_like_btn {
   color: #D1D5DB;
   border: none;
   background-color: inherit;
   transition: all 200ms ease;
}
.comment_like_btn:hover {
   color: #26C38E;
}
.comment_like_btn:focus {
   outline:  none;
}

.comment_Dislike_btn {
   border: none;
   background-color: inherit;
   color: #D1D5DB;
   transition: all 200ms ease;
}

.comment_Dislike_btn:hover {
   color: #DB4E4E;
}
.comment_Dislike_btn:focus {
   outline:  none;
}

.comment_likedislike_number {
   font-size: 14px;
}

.reply_comment_box {
   margin-top: 12px;
   background-color: #F9FAFB;
   border: 1px solid #A08DFC;
   border-radius: 5px ;
   border-left: 5px solid #A08DFc;
   padding: 16px;
}

.show_more_text {
   font-size: 14px;
   color: #374151;
}

.right_side_titles {
   font-size: 18px;
   color: #374151;
}

.table_of_content {
   border-left: 1px solid #D1D5DB;
}
.table_of_content_list {
   padding: 10px 20px;
   border-radius: 0;
   display: block;
   text-decoration: none;
   background: transparent;
   border-left: 2px solid transparent ;
   color: inherit;
   transition: all 200ms ease;
}
.table_of_content_list:hover {
   text-decoration: none;
   color: inherit;
}
.table_of_content_list_active {
   border-left-color: #616CD2 !important;
   background-color: #F5F8FB !important;
}
@media (min-width:1200px) {
   .stickyyy {
       position: sticky !important;
       top: 150px !important; 
   }
}



.our_services_link {
   display: inline-flex;
   color: #4B5563;
   font-size: 16px;
   transition: all 200ms ease;
}
.our_services_link:hover {
   color: #616CD2;
   text-decoration: none;
}
@media (max-width:576px) {
   .recent_posts {
   display: grid;
   gap: 16px;
   grid-template-columns: repeat(1, minmax(0, 1fr));
}
}
@media (min-width:576px) and (max-width:1200px) {
   .recent_posts {
   display: grid;
   gap: 16px;
   grid-template-columns: repeat(2, minmax(0, 1fr));
}
}
@media (min-width:1200px) {
   .recent_posts {
   display: grid;
   gap: 16px;
   grid-template-columns: repeat(1, minmax(0, 1fr));
}
}

.Share_btn {
   background-color: white ;
   color: #4B5563;
   border-radius: 5px;
   padding: 8px 16px;
   display: flex;
   justify-content: center;
   align-items: center;
   gap: 12px;
   outline: none;  
   border: none;
   transition: all 200ms ease; 
}
.Share_btn:focus {
   outline: none;
}
.Share_btn:hover {
   background-color: #4B5563;
   color: white;
}

.Share_btn_image {
   width: 20px;
   height: 20px;
}

.vertical_plan_cards_div {
   display: grid;
   gap: 32px;
   margin: 64px 0 30px 0;
}

.vertical_plan_cards {
   padding: 24px;
   border-radius: 15px;
   box-shadow: 0px 3px 20px #4d527e1a;
   border: 1px solid transparent;
   gap: 20px;
}

.active_vertical_plan_cards {
   padding: 24px;
   border-radius: 15px;
   box-shadow: 0px 3px 20px #4d527e1a;
   border: 1px solid #3B2F85;
   gap: 20px;
}
.vertical_plan_cards_title {
   font-size: 16px !important;
   color: #2E3358;
}

.vertical_plan_cards_features_type {
   font-size: 14px;
   color: #4B5563;
}


@media (max-width:992px) {
   .active_vertical_plan_card_btn {
       margin-top: 12px;
       background-color: #3B2F85 !important;
       border: 1px solid #3B2F85 !important;
       padding: 10px;
       color: white !important;
       border-radius: 5px;
       font-size: 14px;
       transition: all 200ms ease;
       width: 100%;
   }
   .active_vertical_plan_card_btn:hover {
       background-color: white !important;
       color: #3B2F85 !important;
   }

   .vertical_plan_card_btn {
       margin-top: 12px;
       background-color: transparent !important;
       border: 1px solid #3B2F85 !important;
       padding: 10px;
       color: #3B2F85 !important;
       border-radius: 5px;
       font-size: 14px;
       transition: all 200ms ease;
       width: 100%;
   }
   .vertical_plan_card_btn:hover {
       background-color: #3B2F85 !important;
       color: white !important;
   }
}

@media (min-width:992px) {
   .active_vertical_plan_card_btn {
       margin-top: 12px;
       background-color: #3B2F85 !important;
       border: 1px solid #3B2F85 !important;
       padding: 10px;
       color: white !important;
       border-radius: 5px;
       font-size: 14px;
       transition: all 200ms ease;
       width: 160px;
   }
   .active_vertical_plan_card_btn:hover {
       background-color: white !important;
       color: #3B2F85 !important;
   }

   .vertical_plan_card_btn {
       margin-top: 12px;
       background-color: transparent !important;
       border: 1px solid #3B2F85 !important;
       padding: 10px;
       color: #3B2F85 !important;
       border-radius: 5px;
       font-size: 14px;
       transition: all 200ms ease;
       width: 160px;
   }
   .vertical_plan_card_btn:hover {
    background-color: #3B2F85 !important;
    color: white !important;
   }
}


.weblog-share-post {
  display: flex;
  justify-content: start;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 20px;
}
.weblog-share-post a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  border-radius: 5px;
  background-color: #F9FAFB;
  color: #4b5563;
  transition: 300ms ease;  
}
.weblog-share-post a:hover {
  background-color: #4b5563;
  color: #F9FAFB;
}
.weblog-share-post a svg {
  width: 20px;
  height: 20px;
}




.copy-container {
  margin-top: 30px;
  border: 1px solid #e1e5e7;
  border-radius: 10px;
  width: 100% ;
  padding: 8px;
}
.copy-btn {
  white-space: nowrap;
  padding: 8px 16px;
  background-color: #1f2937;
  display: flex ;
  justify-content: center;
  align-items: center;
  gap: 10px;
  color: white ;
  font-size: 14px;
  border-radius: 5px;
}
.copy-btn:focus {
  outline: none;
}
.copy-text {
  font-size: 14px;
  color: #374151;
  width: 100%;
  
}   

.line_clamp_1 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

 

/* home tag + category  */
@media (min-width:1200px) {
   .tags_li {
       color: #9CA3AF;
       font-size: 18px;
       transition: all 200ms ease;
       cursor: pointer;
   }

   .tags_container {
       width: 75%;
   }
}
@media (max-width:1200px) {
   .tags_li {
       color: #9CA3AF;
       font-size: 16px;
       transition: all 200ms ease;
       cursor: pointer;
   }

   .tags_container {
       width: 100%;
   }
}
.tags_li button {
   background-color: inherit;
   color: inherit;
   border: none ;
   border-bottom: 2px solid transparent;
}

.tags_li button:focus {
   outline: none;
}

.tags_li button:hover {
   border-color: #6F57E6 !important;
}

.Active_tags_li {
   color: #6F57E6 !important;
   border-color: #6F57E6 !important;
}

@media (max-width:576px) {
   .Posts_grid {
       margin-top: 24px;
       display: grid;
       grid-template-columns: repeat(1, minmax(0, 1fr));
       gap: 24px;
   }

    .q_grid {
        margin-top: 24px;
        display: grid;
        grid-template-columns: repeat(1, minmax(0, 1fr));
        gap: 24px;
    }

}

@media (min-width:576px) and (max-width:992px) {
   .Posts_grid {
       margin-top: 24px;
       display: grid;
       grid-template-columns: repeat(2, minmax(0, 1fr));
       gap: 16px;
   }

    .q_grid {
        margin-top: 24px;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }
}

@media (min-width:992px) {
   .Posts_grid {
       margin-top: 24px;
       display: grid;
       grid-template-columns: repeat(3, minmax(0, 1fr));
       gap: 24px;
   }

    .q_grid {
        margin-top: 24px;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 24px;
    }
}



.faq_blog_box {
   margin-top: 32px;
   background: white;
   border-radius: 10px;
   box-shadow: 0 5px 20px #4d527e1a;
   padding: 24px;
}

.faq_blog_box_btn {
   padding: 8px 16px;
   border-radius: 5px;
   border: 1px solid #2BA247;
   background-color: #2BA247;
   color: white;
   font-size: 16px;
}
.faq_blog_box_btn:focus {
   outline: none;
}

.faq_blog_box_btn:hover {
   background-color: white;
   color: #2BA247;
}

@media (min-width:768px) {
   .left_sticky_navbar {
       position: sticky;
       top: 10px;
       display: grid;
       gap: 16px;
       min-width: 48px;
       max-width: none;
       margin-bottom: auto !important;
   }
   .question_btn_display {
       display: grid;
       gap: 8px;
   }
   .Question_like_button {
       width: 48px;
       border-radius: 5px;
       border: none;
       background-color: #F5F8FB;
       padding: 14px 0;
       color: #D61764;
       display: grid;
       gap: 8px;
       justify-content: center;
       align-items: center;
       transition: all 200ms ease;
   }
   .Main_question_box {
       border-radius: 15px;
       border-top-left-radius: 0px;
       background-color: #F8FBF5; 
       padding: 32px ;
       position: relative;
       box-shadow: 0 5px 20px #4d527e1a;
   }

   .anwser_question_box {
       border-radius: 15px;
       border-top-left-radius: 0px;
       background-color: white; 
       padding: 32px ;
       position: relative;
       box-shadow: 0 5px 20px #4d527e1a;
   }   

}
@media (max-width:768px) {
   .left_sticky_navbar {
       position: static;
       top: 10px;
       display: flex;
       gap: 16px;
       min-width: 0;
       max-width: none;
       margin-bottom: 10px !important;
   }
   .question_btn_display {
       display: flex;
       gap: 8px;
   }
   .Question_like_button {
       height: 48px;
       width: 60px;
       border-radius: 5px;
       border: none;
       background-color: #F5F8FB;
       padding: 14px 0;
       color: #D61764;
       display: flex;
       gap: 8px;
       justify-content: center;
       align-items: center;
       transition: all 200ms ease;
   }
   .Main_question_box {
       border-radius: 15px;
       border-top-left-radius: 0px;
       background-color: #F8FBF5; 
       padding: 20px ;
       position: relative;
       box-shadow: 0 5px 20px #4d527e1a;
   }

   .anwser_question_box {
       border-radius: 15px;
       border-top-left-radius: 0px;
       background-color: white; 
       padding: 20px ;
       position: relative;
       box-shadow: 0 5px 20px #4d527e1a;
       }

}


.Main_question_box::after {
   content: '';
   position: absolute;
   left: -22px;
   top: 0;
   width: 22px;
   height: 40px;
   background: url(../images/asnwered-question-left-top-icon.svg);
  background-repeat: no-repeat;
  background-size: cover;
}


.anwser_question_box::after {
   content: '';
   position: absolute;
   left: -22px;
   top: 0;
   width: 22px;
   height: 40px;
   background: url(../images/question_left-top-icon.svg);
  background-repeat: no-repeat;
  background-size: cover;

}

.Question_date {
   font-size: 14px;
   color: #9CA3AF;
}
.Question_Author {
   color: #6B7280;
   font-size: 16px;
}

.Main_Question_title {
   margin-top: 24px !important;
   font-size: 24px;
   color: #1F2937;
}
.Main_Question_description {
   margin-top: 16px !important;
   font-size: 16px;
   color: #4B5563;
}
.Question_Answered_icon {
   width: 16px;
   height: 16px;
}
.Question_Answered_text {
   font-size: 14px;
   color: #2BA247;
}

.little_vertical_plan_cards_features_type {
   font-size: 12px;
   color: #4B5563;
}

.little_plan_cards_price {
   font-size: 20px;
}

.little_plan_cards_duration {
   font-size: 14px;
}

.sticky_image  {
   min-width: 48px;
   max-width: 48px;
   height: 48px;
   border-radius: 9999px;
}

.left_sticky_navbar {
   position: sticky;
   top: 10px;
   display: grid;
   gap: 16px;
   min-width: 48px;
   max-width: 48px;
}

.question_clock_icon {
   width: 14px;
   height: 14px;
}
.question_duration {
   font-size: 14px;
   color: #4B5563;
}

.Question_buttons {
   width: 48px;
   height: 48px;
   border-radius: 5px;
   border: none;
   background-color: #F5F8FB;
   color: #616CD2;
   display: flex;
   justify-content: center;
   align-items: center;
   transition: all 200ms ease;
}
.Question_buttons svg {
   width: 20px;
   height: 20px;
}

.Question_buttons:hover {
   background-color: #616CD2;
   color: #F5F8FB;
}

.Question_buttons:focus {
   outline: none;
}




.Question_like_button:focus {
   outline: none;
}

.Question_like_button svg {
   width: 20px;
   height: 20px;
}

.Question_like_button .question_Like_numbers {
   color: #4B5563;
   font-size: 14px;
}


.active_Question_like_button {
   background-color: #D61764 !important;
   color: white !important;
   svg {
       transition: all 200ms ease;
       transform: scale(1.1);
   }
   svg path{
       fill: white !important;
       transition: all 200ms ease;
   }
}
.active_Question_like_button .question_Like_numbers {
   color: white !important;
}

.question_cards:hover {
   text-decoration: none;
}

@media (max-width:992px) {
   .question_cards {
       width: 280px !important;
       overflow: hidden;
       border-radius: 10px;
       box-shadow: 0 5px 20px #4d527e1a;
       background: white;
       color: inherit !important;    
   }
}

@media (min-width:992px) {
   .question_cards {
       width: 550px !important;
       overflow: hidden;
       border-radius: 10px;
       box-shadow: 0 5px 20px #4d527e1a;
       background: white;
       color: inherit !important;             
   }
}


    

        
.vqs_lines {
   position: absolute;
   right: 0;
   width: 70%;
   height: 100%;
}


@media (min-width:992px) {
   .vqs_left {
       width: 45%;
       padding: 60px 0;
   }
   .vqs_right {
       width: 40%;
   }
   .vqs {
       position: relative;
       overflow: hidden;
       background-color: #616CD2;
       padding: 0 32px;
       border-radius: 20px;
       display: flex;
       justify-content: space-between;
       align-items: center;
}
}

@media (max-width:992px) {
   .vqs_left {
       width: 100%;
       padding: 0 0 40px 0;
   }
   .vqs_right {
       width: 100%;
   }
   .vqs {
   position: relative;
   overflow: hidden;
   background-color: #616CD2;
   padding: 24px;
   border-radius: 20px;
   display: grid;
   justify-content: space-between;
   align-items: center;
}
}

.vqs_title {
   font-size: 20px;
   color: white !important;
}

.vqs_descrip {
   font-size: 18px;
   color: #DEE5EA !important;
   margin-top: 16px !important;
}


.progress-container {
   margin-top: 8px;
   position: relative;
   width: 160px;    
   border-radius: 9999px; 
   height: 2px;
   background-color: #2E3358;
}

.progress-bar {
   position: absolute;
   left: 0; 
   height: 100%; 
   background-color: white; 
   border-radius: 9999px;
}

.vqs_buttons {
   width: 34px;
   height: 34px;
   border-radius: 100%;
   background-color: #2E3358;
   color: white;
   border: 1px solid #2E3358;
   display: flex;
   justify-content: center;
   align-items: center;
   transition: all 200ms ease;
}
.vqs_buttons svg {
   width: 15px;
   height: 15px;
}

.vqs_buttons:focus {
   outline: none;
}
.vqs_buttons:hover {
   color: #2E3358;
   background-color: white;
}


@media (max-width:768px) {
   .AQF {
       background-color: #F5F8FB;
       border-radius: 20px;
       padding:  24px;
   }
}

@media (min-width:768px) {
   .AQF {
       background-color: #F5F8FB;
       border-radius: 20px;
       padding: 32px 64px;
   }
}

.AQF_title {
   font-size: 20px;
   color: #444663;
}

.AQF_form {
   margin-top: 70px;
}

.AQF_inputs {
   margin-top: 8px;
   width: 100%;
   font-size: 14px;
   border: none;
   color: #9ca3af;
   border-radius: 5px;
   padding: 12px;
   outline: none;
}

.AQF_btn {
   margin-top: 24px;
   background-color: #416282;
   color: white;
   border-radius: 5px;
   padding: 9px 40px;
   font-size: 16px;
   border: 1px solid #416282;
   transition: all 200ms ease;
}

.AQF_btn:hover {
   background-color: white;
   color: #416282;
}

.AQF_btn:focus {
   outline: none;
}


/* star rate css codes */
.jq-stars {
  display: inline-block;
}

.jq-rating-label {
  font-size: 22px;
  display: inline-block;
  position: relative;
  vertical-align: top;
  font-family: helvetica, arial, verdana;
}

.jq-star {
  width: 100px;
  height: 100px;
  display: inline-block;
  cursor: pointer;
}

.jq-star-svg {
  padding-left: 3px;
  width: 100%;
  height: 100% ;
}

.jq-star:hover .fs-star-svg path {

}

.jq-star-svg path {
  /* stroke: #000; */
  stroke-linejoin: round;
}

/* un-used */
.jq-shadow {
  -webkit-filter: drop-shadow( -2px -2px 2px #D1D5DB );
  filter: drop-shadow( -2px -2px 2px #D1D5DB );
}
/* star rate css codes */