/*!*******************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[3]!./src/app/assets/css/mentorship.css ***!
  \*******************************************************************************************************************************************************************************************************************************************************************************/
.spheron{
color: #fc9928;
}
.spheron1{
color: #d27301;    
}
.mt-20{
  margin-top: 20px;  
}
.mt-40{
  margin-top: 40px;  
}
.sub_heading.font-18{
font-size: 18px;  
}
.flextextmain{
color: #000000;
font-family: Lato, sans-serif !important;
font-weight: 800;
font-size: 35px;
margin-bottom: 5px;
margin-top: 0px;
} 
.flextextmain>img{
width: 35px; 
margin-top: -17px;  
} 
.darkred{
color: #d90000;
}  
.get-mentorship-btn{
background: #ffffff;
color: #d60000;
border: 2px solid #d60000;
padding: 8px 15px;
}
.get-mentorship-btn:hover, .get-mentorship-btn:focus{
color: #d60000;
}
@keyframes shimmer_mentor{
100%{
-webkit-mask-position: left;
}}

/* mentor form */
        .ReactModal__Content.ReactModal__Content--after-open {
          max-width: 600px;
          position: relative !important;
          border: 0 !important;
          background-color: transparent !important;
          inset: 0 0 40px !important;
          overflow: visible !important;
      }
        .swiper-btn-close{
          position: absolute;
          z-index: 9;
          top: 8px;
          right: -5px;
          background: #d60000;
          color: #ffffff;
          border: none;
          border-radius: 100%;
          padding: 2px 9px;
          box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
        }
        .mentor-form {
          width: 100%;
          height: 100%;
          background-color: #FFFFFF;
          padding: 30px 20px;
          box-shadow: 2px 2px 30px rgba(66, 57, 238, .2);
          position: relative;
          z-index: 1;
        }
      
        .mentor-form::after {
          display: table;
          content: " ";
          border-bottom: 4px solid #ff8800;
          border-right: 4px solid #ff8800;
          width: 100px;
          height: 100px;
          background: transparent;
          position: absolute;
          z-index: -1;
          right: 0;
          bottom: 0;
        }
      
        .mentor-form::before {
          display: table;
          content: " ";
          border-top: 4px solid #ff8800;
          border-left: 4px solid #ff8800;
          width: 100px;
          height: 100px;
          background: transparent;
          position: absolute;
          z-index: -1;
          left: 0;
          top: 0;
        }
      
        .mentor-input {
          height: 35px;
          outline: none;
          border: 1px solid #ededed;
          font-size: 14px;
          margin: 5px 5px 20px 5px;
          box-shadow: 2px 6px 18px rgb(243 243 243);
          border-radius: 10px;
        }
        .mentor-input::placeholder, .mentor-input{
         color: #8f8f8f; 
        }
      
        .mentor-submit-btn {
          -webkit-mask: linear-gradient(-60deg, #000 30%, #0005, #000 40%) right / 350% 100%;
          background-repeat: no-repeat;
          animation: shimmer_mentor 2s infinite;
          margin-top: 0px;
          color: white !important;
          display: inline-block;
          padding: 10px 20px;
          border: none;
          border-radius: 5px;
          background-color: #d60000 !important;
          text-align: center;
          font-weight: 400;
          opacity: 1 !important;
          cursor: pointer;
        }
      
        .mentor-submit-btn:hover {
          color: white;
          background: #000000;
        }
        .mobile-number-flex {
          position: relative;
      }
      .send-otp-btn {
        position: absolute;
        top: 0;
        right: -5px;
        border-radius: 0px 10px 10px 0px;
        height: 35px;
        color: #ffffff;
    }
    .label-otp {
      display: flex;
      justify-content: center;
      margin-bottom: 5px;
  }
    :where([autocomplete=one-time-code]) {
      --otp-digits: 6;
      --otp-ls: 3ch;
      --otp-gap: 1.25;
      --_otp-bgsz: calc(var(--otp-ls) + 1ch);
      --_otp-digit: 0;
      all: unset;
      background: 
      linear-gradient(90deg, 
        var(--otp-bg, #eee) calc(var(--otp-gap) * var(--otp-ls)),
        transparent 0),
        linear-gradient(90deg, 
        var(--otp-bg, #EEE) calc(var(--otp-gap) * var(--otp-ls)),
        transparent 0
      );
      background-position: calc(var(--_otp-digit) * var(--_otp-bgsz)) 0, 0 0;
      background-repeat: no-repeat, repeat-x;
      background-size: var(--_otp-bgsz) 100%;
      caret-color: var(--otp-cc, #222);
      caret-shape: block;
      -webkit-clip-path: inset(0% calc(var(--otp-ls) / 2) 0% 0%);
              clip-path: inset(0% calc(var(--otp-ls) / 2) 0% 0%);
      font-family: ui-monospace, monospace;
      font-size: var(--otp-fz, 2.5em);
      inline-size: calc(var(--otp-digits) * var(--_otp-bgsz));
      letter-spacing: var(--otp-ls);
      padding-block: var(--otp-pb, 1ch);
      -webkit-padding-start: calc(((var(--otp-ls) - 1ch) / 2) * var(--otp-gap));
              padding-inline-start: calc(((var(--otp-ls) - 1ch) / 2) * var(--otp-gap));
      }
      #verifyLoginOtpBtn{
        font-size: 12px;
        padding: 3px 10px;
      }

.benifits-section {
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
        margin-right: 0px;
    margin-left: 0px;
}
.benifits-boxes {
    text-align: center;
    margin-bottom: 20px;
}
.benifits-boxes>div>span {
    width: 80px;
    background: #f3f3f3;
    border-radius: 100%;
    padding: 15px;
}
.benifits-boxes>div>span>img{
    width: 50px;
}
.benifits-boxes>h5 {
    font-weight: 600 !important;
    line-height: 1.42857143;
    color: #333333;
    font-size: 15px;
}
/* pricing */
.pricing-box {
    background-color: #fff;
    padding: 14px;
    box-sizing: border-box;
    position: relative;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    border-radius: 16px;
    margin-bottom: 20px;
    position: relative;
    /* min-height: 486px; */
    transition: all 1s;
}
.pricing-box:hover{
    transition: all .5s;
    transform : translateY(-5px);
    box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px;
    border: 1px solid #fc9928;
}
.package-name {
    font-size: 24px;
    color: #d60000;
    font-weight: 700;
    margin-top: 0px;
    margin-bottom: 3px;
}
.feature-section{
position: relative; 
padding-bottom: 55px;   
}
.feature-section>ul {
    padding-left: 0px;
    margin-bottom: 2px;
    height: 235px;
}
.package-content-list {
  max-height: 235px;
  overflow: hidden;
  transition: all 0.3s ease;
  position: relative;
}

.package-content-list.scrollable {
  overflow-y: auto;
  scrollbar-width: thin;
  overflow-x: hidden;
}
.package-content-list.check-height {
  max-height: none !important;
  overflow: visible !important;
}
.toggle-scroll-btn{
    border-radius: 100%;
    padding: 3px 3px;
    width: 30px;
    height: 30px;
    line-height: 25px;
    font-size: 20px;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
    animation: up-down linear 2s;
    animation-iteration-count: infinite;
    transform-origin: 50% 50%;
    background: #fff;
    color: #000;
    border: 1px solid #dbdbdb;
}

@keyframes up-down{
0% {
    transform: translate(1px, 6px);
}
24% {
    transform: translate(1px, 6px);
}
50% {
    transform: translate(1px, 4px);
}
74% {
    transform: translate(1px, 6px);
}
100% {
    transform: translate(1px, 6px);
}
}
.more-button-container {
display: none;
position: absolute;
bottom: 65px;
z-index: 9;
background: #ffffffe6;
width: 100%;
padding: 2px 10px 10px 10px;
}
.feature-section>ul>li {
    margin-bottom: 0px;
    display: flex;
}
.feature-section>ul>li>span:nth-child(1) {
    width: 7%;
    color: #0b9651;
    line-height: 2.2;
}
.feature-section>ul>li>span:nth-child(1) svg{
      width: 16px;
}
.feature-section>ul>li>span:nth-child(2) {
    width: 93%;
}
.chat-now{
    place-items: center;
    border: 1px solid #d60000;
    width: -moz-fit-content;
    width: fit-content;
    gap: 10px;
    color: #d60000;
    border-radius: 5px 7px 7px 5px;
    position: absolute;
    bottom: 20px;
}
.chat-now>span{
    padding: 0px 5px;
    font-weight: 500;
}
.start-mentorship-btn{
    color: #d60000 !important;
    border: 1px solid #d60000 !important;
    background-color: #ffffff !important;
    margin-right: 10px;
    border-radius: 5px;
    padding: 3px 10px;
    -webkit-mask: linear-gradient(-60deg, #000 30%, #0005, #000 40%) right / 350% 100%;
    background-repeat: no-repeat;
    animation: shimmer_mentor 2s infinite;
    position: absolute;
    bottom: 20px;
    /* width: 20%; */
}
.underline{
width: 150px;
height: 2px;
background: #d60000;  
}
.start-mentorship-btn-chat{
    position: relative;
    bottom: 0px;
    margin-right: 0px;
    color: #ffffff !important;
    border: 2px solid #d60000 !important;
    background-color: #d60000 !important;
    width: auto;
}
.who-join-section {
    display: flex;
    justify-content: flex-start;
    padding-left: 10px;
}
.col {
    flex: 1 0 3%;
    margin: 10px 5px 5px 0px;
}
.who-join-box>div {
    display: flex;
    gap: 10px;
    place-items: center;
    box-shadow: 0px 0px 40px rgba(29, 58, 83, 0.15);
    padding: 10px;
    border-radius: 5px;
}
.join-images {
    width: 60px;
    background: #fd7e141a;
    border-radius: 100%;
    padding: 11px;
    display: inline-block;
}
.join-images>img{
    width: 38px;
}
.who-join-box>div>span {
    font-weight: 600;
    line-height: 1.42857143;
    color: #333333;
    font-size: 15px;
}

/* second design start */
.second-design-btn{
color: #24292d;
border-radius: 30px;
background: #ffffff;
padding: 5px 10px;
border: none;
font-weight: 700;
min-width: 120px;
box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
font-size: 14px;
}
.second-design-btn.active{
 border: 1px solid #d60000;   
 color: #d60000;
box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
}
.second-design-btn1{
padding: 5px 10px;
}
.second-design-btn>img{
  width: 30px;
  height: 30px;
}
.mobile-second-design-btn{
display: none;    
}
/* second design end */

.mentor-subject-filter{
    position: absolute;
    right: 28px;
    top: 35px; 
}
.live-mentors-flex {
    display: flex;
    justify-content: flex-start;
    overflow-y: hidden;
    overflow-x: auto;
    scrollbar-width: thin;
}
.live-mentor-box {
    min-width: 215px;
}
.mentors-box-width {
    max-width: 236px;
}
.teacherBox {
    padding: 5px 10px 5px;
    margin: 5px 0 0 5px;
    transition: all 0.3s ease 0s;
    background: #f7c32e26;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    position: relative;
    border-radius: 5px;
    display: flex;
    gap: 5px;
}
.teacherBox .teacher-icon>span>img {
    min-width: 50px;
    max-width: 50px;
    border-radius: 100%;
    min-height: 50px;
    max-height: 50px;
}
.teacherBox .title {
    color: #000000;
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.5px;
    text-transform: capitalize;
    margin: 0;
    transition: all 0.3s ease 0s;
}
.teacherBox .live-title {
    display: block;
}
.teacher-rating {
    margin-top: 0px;
    font-size: 12px;
    color: #ff9800;
    line-height: 1.3;
}
.rating-number, .review-count>a {
    color: #000;
}
.mentor-line-height{
  line-height: 1.3;
  color: #999999;
}
.font-12{
  font-size: 12px;  
}
/* filter */
.hidden {
  display: none;
}
#filterToggle{
    text-align: right;
    width: -moz-fit-content;
    width: fit-content;
}
.filter-panel{
 position: relative;   
}
.filter-panel>ul{
position: absolute;
right: 0;
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
background: #ffffff;
list-style-type: none;
z-index: 9;
min-width: 165px;
padding: 10px;
}
.filter-btn {
font-size: 15px;
color: #000;
display: block;
border: 0px;
background: transparent;
width: 100%;
text-align: left;
border-bottom: 1px solid #dcdcdc;
padding: 5px 10px;
}

.filter-btn.active {
  background-color: #fc9928;
  color: white;
}

.content-container {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 15px;
}

.content-card {
  padding: 12px 16px;
  background: #e8f5e9;
  border-radius: 6px;
  border: 1px solid #ccc;
  min-width: 150px;
}
.mobile-tabs-section{
 display: none;   
}
.live-circle{
display: none !important;
}
 /* responsive start */
 @media only screen and (max-width:991px){
.who-join-section{
    width: 100%;
    flex-wrap: wrap;
    padding-left: 0px;
}    
.who-join-box.col{
    flex: 50% 1;
    padding-right: 5px;
    padding-left: 5px; 
    margin: 0px 0px 15px 0px;
}    
.mentor-subject-filter{
top: 18px;
}}
@media only screen and (max-width:767px) {
  .flextextmain{
    font-size: 28px;
  }
  .flextextmain>img {
    width: 30px;
    margin-top: -10px;
}
  .mobile-font-12, .benifits-boxes>h5, .who-join-box>div>span, 
  .teacherBox .title, .feature-section>ul>li, .free-mock-test-flex>a>span,
  .popular-course-box>p, .mobile-tabs-section>.nav-tabs>.nav-item>button.active, .start-mentorship-btn{
    font-size: 12px !important;
  }
  .feature-section>ul>li>span:nth-child(1) svg{
        width: 14px;
  }
  .second-design{
   display: flex;
   place-items: center;
   gap: 10px;
  }
  .second-design>.col-md-6{
    padding-left: 0px;
    padding-right: 0px;
  }
  .second-design>.col-md-6>.mobile-text-center{
    display: flex;
    justify-content: start;
    gap: 5px;
  }
  .second-design>.col-md-6>.mobile-mentor-btns{
    display: flex;
    justify-content: start;
    display: none;
  }
 .mobile-mentor-btns{
    text-align: left;
 } 
 .second-design-btn{
    min-width: 152px;
    font-size: 12px;
 }
 .second-design-btn1 {
    padding: 5px 2px;
}
  .pricing-box{
  min-height: auto;
  padding-top: 15px;
 } 
 .start-mentorship-btn, .chat-now{
      bottom: 10px;
      font-size: 12px;
 }
 .start-mentorship-btn-chat{
    bottom: 0px;
 }
 .benifits-boxes>div>span, .join-images{
      width: 60px;
      padding: 10px;
 }
 .benifits-boxes>div>span>img, .join-images>img{
   width: 40px; 
 }
 .benifits-section{
    display: flex;
    flex-wrap: wrap;
 }
  .benifits-section>.col-md-12{
    width:100%
  }
    .benifits-section>.col-xs-6{
    width:50%
  }
  .who-join-section{
  white-space: normal;
  }
  .mobile-second-design-btn{
        display: block;
        position: absolute;
        right: 20px;
        top: -38px;  
}
.mobile-second-design-btn>button{
    border-radius: 100%;
    border: 1px solid #fc9928;
    padding: 0px;
    box-shadow: rgba(67, 71, 85, 0.27) 0px 0px 0.25em, rgba(90, 125, 188, 0.05) 0px 0.25em 1em;
}
.mobile-second-design-btn>button>img{
    width: 35px;
    height: 35px;
}
.mobile-second-design-btn>button>svg{
    position: absolute;
    z-index: 9;
    right: -5px;
    background: #fff;
    border-radius: 100%;
}
.mobile-second-design-btn>button>p{
    position: absolute;
    font-size: 8px;
    line-height: 1;
    width: 55px;
    right: -8px;
}
.mobile-tabs-section{
 display: block;   
}
.mobile-tabs-section>.tab-content{
    padding-left: 0px;
    padding-right: 0px;
}
#sourceContent{
    display: none;
}
.mobile-tabs-section>.nav-tabs{
gap: 5px; 
border-bottom: 0px;   
}
.mobile-tabs-section>.nav-tabs>.nav-item>button.active{
    border: 1px solid #d60000;
    border-radius: 5px;
    color: #d60000;
    padding: 5px 10px;
    font-weight: normal;
}
.mobile-tabs-section>.nav-tabs>.nav-item>button{
    border: 1px solid #24292d;
    border-radius: 5px;
    color: #24292d;
    padding: 5px 10px;
    font-weight: normal;
    margin-right: 5px;
    font-size: 12px;
}
    /* .more-button-container {
        display: block;
    } */
}
@media only screen and (max-width:575px){
.justify-text{
    text-align: justify;
}    
.mobile-text-center, .mobile-mentor-btns{
  text-align: center;
}
.live-mentor-box{
min-width: auto;
}
.mentors-box-width.col{
    margin: 10px 4px 5px 0px;
}
.teacherBox{
    display: block;
    text-align: center;
    background: none;
    box-shadow: none;
    padding: 5px 2px 5px;
}
.teacherBox .title {
   font-weight: normal;
}
.teacher-rating>.stars, .teacher-rating>.rating-number, .teacher-rating>
.review-count,.teacherBox>div>.mentor-line-height{
    display: none;
}
.review-count,.teacherBox>div>.mentor-line-height.subject{
    display: block;
}
.start-mentorship-btn{
   width: auto; 
}
.mobile-font-18,.package-name{
font-size: 18px;
}
.benifits-boxes>div>span, .join-images{
    width: 45px;
}
 .benifits-boxes>div>span>img, .join-images>img{
   width: 25px; 
 }
.teacherBox .teacher-icon>span>img{
    min-width: 45px;
    max-width: 45px;
    min-height: 45px;
    max-height: 45px;
    border: 2px solid green;
}
.live-mentors-flex{
    scrollbar-width: none;
}
.live-circle{
    display: block !important;
    position: absolute;
    top: 20px;
    right: 6px;
    z-index: 1;
    color: green; 
    width: 10px; 
}}
@media only screen and (max-width:405px){
.flextextmain {
font-size: 25px;
}
.sub_heading{
font-size: 20px;
}}
@media only screen and (max-width:373px){
.flextextmain{
  font-size: 21px;
}
.sub_heading{
font-size: 18px;
}
.second-design{
    padding: 8px 1px;
}
.second-design-btn {
    min-width: 100px;
    margin-right: 5px;
}
.second-design>.col-sm-6{
  padding-left: 0px;
  padding-right: 0px;
}
}