@charset "UTF-8";
  /*-----------------------------------------------------------------------------------

      Theme Name: Eduman - Education & Online Courses HTML Template
      Author: Bdevs
      Support: https://www.devsnews.com/support/
      Description: Eduman - Education & Online Courses HTML Template
      Version: 1.0

  -----------------------------------------------------------------------------------

  /************ TABLE OF CONTENTS ***************

  01. common style
  02. header style
  03. hero style
  04. section-title style
  05. category style
  06. counter style
  07. student-choose style
  08. testimonial style
  09. education style
  10. partner style
  11. teacher style
  12. blog style
  13. skill style
  14. eduman-card style
  15. campus style
  16. event style
  17. features style
  18. course style
  19. instructor style
  20. about style
  21. banner style
  22. shop style
  23. membership style
  24. zoom-class style
  25. faq style
  26. contact style
  27. footer style



  **********************************************/
  /*


  */
  /*----------

  01. common style

  ----------*/
  @import url("https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;600;700;900&family=Raleway:wght@400;500;600;700;900&display=swap");
  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }

  body {
    font-family: "Nunito Sans", sans-serif;
    font-size: 18px;
    font-weight: normal;
    color: #575757;
    line-height: 26px;
  }

  a {
    text-decoration: none;
  }

  .w-img img {
    width: 100%;
  }

  .gallery-area {
    max-width: 1920px;
    margin: 0 auto;
  }

  .gallery-inner {
    display: flex;
    flex-wrap: wrap;
  }
  .gallery-inner > div {
    width: 20%;
  }
  @media only screen and (min-width: 576px) and (max-width: 767px) {
    .gallery-inner > div {
      width: 33.33%;
    }
  }
  @media (max-width: 575px) {
    .gallery-inner > div {
      width: 50%;
    }
  }

  .gallery-single {
    position: relative;
  }
  .gallery-single:hover .gallery-link {
    opacity: 1;
    visibility: visible;
  }

  .gallery-link {
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
  }
  .gallery-link:before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: black;
    content: "";
    opacity: 0.6;
  }

  .gallery-insta {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 26px;
  }
  .gallery-insta:hover {
    color: #fff;
  }

  .m-img img {
    max-width: 100%;
  }

  .features-mt {
    margin-top: -85px;
  }

  a,
  .btn,
  button,
  span,
  p,
  i,
  input,
  select,
  textarea,
  li,
  img,
  svg path,
  *::after,
  *::before,
  .transition-3,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }

  a:focus,
  .button:focus {
    text-decoration: none;
    outline: none;
  }

  a:focus,
  a:hover {
    color: inherit;
    text-decoration: none;
  }

  a,
  button {
    color: inherit;
    outline: none;
    border: none;
    background: transparent;
  }

  button:hover {
    cursor: pointer;
  }

  button:focus {
    outline: 0;
    border: 0;
  }

  .uppercase {
    text-transform: uppercase;
  }

  .capitalize {
    text-transform: capitalize;
  }

  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-family: "Raleway", sans-serif;
    color: #141517;
    margin-top: 0px;
    font-weight: 700;
    line-height: 1.3;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }

  h1 {
    font-size: 40px;
  }

  h2 {
    font-size: 36px;
  }

  h3 {
    font-size: 24px;
  }

  h4 {
    font-size: 20px;
  }

  h5 {
    font-size: 16px;
  }

  h6 {
    font-size: 14px;
  }

  ul {
    margin: 0px;
    padding: 0px;
  }

  li {
    list-style: none;
  }

  p {
    font-family: "Nunito Sans", sans-serif;
    font-size: 18px;
    font-weight: normal;
    color: #575757;
    margin-bottom: 15px;
    line-height: 26px;
  }

  *::-moz-selection {
    background: #2467EC;
    color: #ffffff;
    text-shadow: none;
  }

  ::-moz-selection {
    background: #2467EC;
    color: #ffffff;
    text-shadow: none;
  }

  ::selection {
    background: #2467EC;
    color: #ffffff;
    text-shadow: none;
  }

  /*--
      - Input Placeholder
  -----------------------------------------*/
  *::-moz-placeholder {
    color: #575757;
    font-size: 14px;
    opacity: 1;
  }

  *::placeholder {
    color: #575757;
    font-size: 14px;
    opacity: 1;
  }

  /*--
      - Common Classes
  -----------------------------------------*/
  .fix {
    overflow: hidden;
  }

  .clear {
    clear: both;
  }

  .f-left {
    float: left;
  }

  .f-right {
    float: right;
  }

  .z-index-1 {
    z-index: 1;
  }

  .z-index-11 {
    z-index: 11;
  }

  .overflow-y-visible {
    overflow-x: hidden;
    overflow-y: visible;
  }

  .p-relative {
    position: relative;
  }

  .p-absolute {
    position: absolute;
  }

  /*--
      - Background color
  -----------------------------------------*/
  .grey-bg {
    background: #FFB013;
  }

  .section-bg {
    background: #F6F8FB;
  }

  .pink-bg {
    background: #2467EC;
  }

  .white-bg {
    background: #ffffff;
  }

  .black-bg {
    background: #000;
  }

  .footer-bg {
    background: #000;
  }

  /*--
      - color
  -----------------------------------------*/
  .text-white h1,
  .text-white h2,
  .text-white h3,
  .text-white h4,
  .text-white h5,
  .text-white h6,
  .text-white p,
  .text-white span,
  .text-white li,
  .text-white a {
    color: #ffffff !important;
  }

  .white-color {
    color: #ffffff;
  }

  .theme-color {
    color: #2467EC !important;
  }

  .black-color {
    color: #000;
  }

  .body-overlay {
    background-color: rgba(0, 0, 0, 0.5);
    height: 100%;
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 1004;
    left: 0;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .body-overlay:hover {
    cursor: pointer;
  }

  .body-overlay.opened {
    opacity: 1;
    visibility: visible;
  }

  @media (max-width: 575px) {
    .progress-wrap {
      right: 15px;
      bottom: 15px;
    }
  }

  .long-padding {
    padding-bottom: 285px;
  }

  /* link btn */
  .link-btn {
    position: relative;
    font-size: 15px;
    font-weight: 500;
    color: #2467EC;
    text-transform: uppercase;
    padding-right: 15px;
  }
  .link-btn i {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    transition: all ease 0.2s;
    -webkit-transition: all ease 0.2s;
    -moz-transition: all ease 0.2s;
    -ms-transition: all ease 0.2s;
    -o-transition: all ease 0.2s;
  }
  .link-btn i:first-child {
    left: -100%;
    visibility: hidden;
    opacity: 0;
  }
  .link-btn i:last-child {
    right: 0;
  }
  .link-btn:hover {
    color: #000;
  }
  .link-btn:hover i:first-child {
    left: 0;
    visibility: visible;
    opacity: 1;
  }
  .link-btn:hover i:last-child {
    right: -100%;
    visibility: hidden;
    opacity: 0;
  }

  .link-btn-2 {
    position: relative;
    font-size: 14px;
    color: #2467EC;
    font-weight: 500;
    padding-right: 22px;
    display: inline-block;
    text-transform: uppercase;
    font-family: "Nunito Sans", sans-serif;
  }
  .link-btn-2 i {
    position: absolute;
    top: 45%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    transition: all ease 0.2s;
    -webkit-transition: all ease 0.2s;
    -moz-transition: all ease 0.2s;
    -ms-transition: all ease 0.2s;
    -o-transition: all ease 0.2s;
    font-size: 12px;
  }
  .link-btn-2 i:first-child {
    right: 10%;
    visibility: hidden;
    opacity: 0;
  }
  .link-btn-2 i:last-child {
    right: 0;
  }
  .link-btn-2:hover {
    color: #2467EC;
  }
  .link-btn-2:hover i:first-child {
    right: 0;
    visibility: visible;
    opacity: 1;
  }
  .link-btn-2:hover i:last-child {
    right: -10%;
    visibility: hidden;
    opacity: 0;
  }
  .link-btn-2.pink {
    color: #2467EC;
  }
  .link-btn-2.pink:hover {
    color: #2467EC;
  }

  /* pulse btn */
  .pulse-btn {
    display: inline-block;
    width: 80px;
    height: 80px;
    line-height: 84px;
    text-align: center;
    background-color: #ffffff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    color: #2467EC;
    animation: pulse 2s infinite;
  }
  .pulse-btn:hover {
    background-color: #2467EC;
    color: #ffffff;
  }
  .pulse-btn i {
    padding-left: 2px;
  }

  @-webkit-keyframes pulse {
    0% {
      -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
    }
    70% {
      -webkit-box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);
    }
    100% {
      -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
  }
  @keyframes pulse {
    0% {
      -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
      box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
    }
    70% {
      -moz-box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);
      box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);
    }
    100% {
      -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
      box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
  }
  .edu-btn {
    display: inline-block;
    height: 55px;
    line-height: 53px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #ffffff;
    background-color: #2467EC;
    padding: 0 40px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    border: 1px solid transparent;
  }
  .edu-btn:hover {
    background-color: #FFB013;
    color: #141517;
  }
  .edu-btn:focus {
    color: #ffffff;
    border: 1px solid transparent;
  }

  .edu-sec-btn {
    display: inline-block;
    height: 55px;
    line-height: 55px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #2467EC;
    background-color: transparent;
    padding: 0 30px;
    border: 1px solid #dce8fe;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .edu-sec-btn:hover {
    background-color: #2467EC;
    color: #ffffff;
    border-color: #2467EC;
  }

  .edu-border-btn {
    display: inline-block;
    height: 55px;
    line-height: 55px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #2467EC;
    background-color: transparent;
    padding: 0 30px;
    border: 1px solid #dce8fe;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .edu-border-btn:hover {
    background-color: #2467EC;
    color: #ffffff;
    border-color: #2467EC;
  }
  .edu-border-btn:focus {
    border: 1px solid #dce8fe;
  }

  .edu-thard-btn {
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #141517;
    background-color: #FFB013;
    padding: 0 40px;
    display: inline-block;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .edu-thard-btn:hover {
    background-color: #2467EC;
    color: #ffffff;
  }

  .edu-four-btn {
    display: inline-block;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #141517;
    background-color: #FFB013;
    padding: 0 40px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    border: 1px solid transparent;
  }
  .edu-four-btn:hover {
    background-color: #2467EC;
    color: #ffffff;
    border-color: #2467EC;
  }

  .edu-five-btn {
    display: inline-block;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #ffffff;
    background-color: #2467EC;
    padding: 0 40px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    border: 1px solid transparent;
  }
  .edu-five-btn:hover {
    background-color: #FFB013;
    color: #141517;
    border: 1px solid #FFB013;
  }

  .edu-six-btn {
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #141517;
    background-color: #FFB013;
    border: 1px solid transparent;
    padding: 0 40px;
    display: inline-block;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .edu-six-btn:hover {
    background-color: #2467EC;
    color: #ffffff;
    border: 1px solid #ffffff;
  }

  .edo-theme-btn {
    display: inline-block;
    height: 55px;
    line-height: 55px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #2467EC;
    background-color: transparent;
    padding: 0 40px;
    border: 1px solid #2467EC;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .edo-theme-btn:hover {
    background-color: #2467EC;
    color: #ffffff;
    border-color: transparent;
  }

  .blog-btn {
    background: transparent;
    display: inline-block;
    border-radius: 5px;
    height: 40px;
    line-height: 40px;
    padding: 0 30px;
    color: #2467EC;
    font-size: 16px;
    font-weight: 600;
    border: 1px solid #DCE8FE;
    text-align: center;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .blog-btn:hover {
    background-color: #2467EC;
    color: #ffffff;
  }

  .edo-course-btn {
    display: inline-block;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #141517;
    background-color: #FFB013;
    padding: 0px 25px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .edo-course-btn:hover {
    background-color: #2467EC;
    color: #ffffff;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .edo-course-btn {
      padding: 0px 7px;
    }
  }

  .edo-course-sec-btn {
    display: inline-block;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #ffffff;
    background-color: #2467EC;
    padding: 0px 25px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .edo-course-sec-btn:hover {
    background-color: #FFB013;
    color: #141517;
  }

  .course-btn {
    height: 40px;
    background: #2467EC;
    padding: 0 25px;
    display: inline-block;
    line-height: 40px;
    border-radius: 3px;
    font-weight: 600;
    color: #ffffff;
  }
  .course-btn:hover {
    color: #141517;
    background-color: #FFB013;
  }

  .add-cart-btn {
    height: 45px;
    padding: 0 45px;
    display: inline-block;
    background-color: #2467EC;
    line-height: 45px;
    border-radius: 4px;
    font-size: 15px;
    font-weight: 600;
    color: #ffffff;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
    .add-cart-btn {
      padding: 0 35px;
    }
  }
  .add-cart-btn:hover {
    background: #FFB013;
    color: #141517;
  }
  .add-cart-btn i {
    margin-right: 10px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }

  .view-details-btn {
    height: 45px;
    padding: 0 45px;
    display: inline-block;
    background-color: #2467EC;
    line-height: 45px;
    border-radius: 4px;
    font-size: 15px;
    font-weight: 600;
    color: #ffffff;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
    .view-details-btn {
      padding: 0 35px;
    }
  }
  .view-details-btn:hover {
    background: #FFB013;
    color: #141517;
  }

  .c-share-btn {
    width: 45px;
    height: 45px;
    border: 1px solid #dce8fe;
    border-radius: 4px;
    font-size: 19px;
    color: #a6bce8;
    line-height: 50px;
    text-align: center;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .c-share-btn:hover {
    background: #2467EC;
    border-color: #2467EC;
    color: #ffffff;
  }

  .wishlist-btn {
    width: 45px;
    height: 45px;
    border: 1px solid #dce8fe;
    border-radius: 4px;
    font-size: 19px;
    color: #a6bce8;
    line-height: 50px;
    text-align: center;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .wishlist-btn:focus {
    border: 1px solid #dce8fe;
  }
  .wishlist-btn:hover {
    border-color: #2467EC;
    color: #2467EC;
  }
  .wishlist-btn.w-added {
    background: #2467EC;
    border-color: #2467EC;
    color: #ffffff;
  }

  .edu-follow-btn {
    height: 50px;
    padding: 0 40px 0 60px;
    background: #2467EC;
    display: block;
    line-height: 50px;
    border-radius: 3px;
    color: #ffffff;
    text-align: center;
    text-transform: capitalize;
    font-weight: 600;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    position: relative;
  }
  .edu-follow-btn i {
    margin-right: 10px;
  }
  .edu-follow-btn:focus {
    color: #ffffff;
  }
  .edu-follow-btn:hover {
    color: #141517;
    background: #FFB013;
  }
  .edu-follow-btn:hover:before {
    color: #141517;
  }
  .edu-follow-btn::before {
    position: absolute;
    content: "";
    left: 35px;
    top: 0;
    font-family: "Font Awesome 5 Pro";
    font-size: 14px;
    font-weight: 400;
    color: #ffffff;
  }
  .edu-follow-btn.followed::before {
    content: "";
  }

  .course-details-action {
    display: flex;
    gap: 20px;
    width: 240px;
    justify-content: end;
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .course-details-action {
      justify-content: start;
    }
  }

  .share-btn {
    border: 1px solid #edeef2;
    padding: 10px 15px;
    border-radius: 4px;
    line-height: 50px;
    text-align: center;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .share-btn:hover {
    background-color: #2467EC;
    border-color: transparent;
  }
  .share-btn:hover i {
    color: #ffffff;
  }

  .membership-btn-active {
    height: 55px;
    background: #FFB013;
    display: block;
    line-height: 55px;
    text-align: center;
    border-radius: 4px;
    color: #161b1c;
    padding: 0 30px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .membership-btn-active:hover {
    background-color: #2467EC;
    color: #ffffff;
  }

  .membership-btn {
    height: 55px;
    background: #2467EC;
    display: block;
    line-height: 55px;
    text-align: center;
    border-radius: 4px;
    color: #ffffff;
    padding: 0 30px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .membership-btn:hover {
    background-color: #FFB013;
    color: #161b1c;
  }

  .get-btn {
    height: 45px;
    display: inline-block;
    background: #ffffff;
    line-height: 45px;
    color: #141517;
    font-size: 16px;
    font-weight: 600;
    padding: 0 20px;
    border-radius: 3px;
    border: 1px solid #edeef2;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .get-btn:hover {
    background: #2467EC;
    color: #ffffff;
    border-color: #2467EC;
  }

  .video-cart-btn {
    height: 55px;
    padding: 0px 20px;
    display: inline-block;
    background-color: #2467EC;
    line-height: 55px;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 600;
    color: #ffffff;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .video-cart-btn:hover {
    background-color: #FFB013;
    color: #141517;
  }
  .video-cart-btn i {
    margin-right: 10px;
  }

  .video-wishlist-btn {
    height: 55px;
    padding: 0px 20px;
    display: inline-block;
    background-color: #eff1f6;
    line-height: 55px;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 600;
    color: #141517;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .video-wishlist-btn:hover {
    background-color: #2467EC;
    color: #ffffff;
  }
  .video-wishlist-btn i {
    margin-right: 10px;
  }

  .cont-btn {
    height: 55px;
    background: #2467EC;
    color: #ffffff;
    text-align: center;
    width: 150px;
    border-radius: 3px;
    font-weight: 600;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    display: inline-block;
    line-height: 55px;
  }
  .cont-btn:hover {
    color: #141517;
    background: #FFB013;
  }

  .event-btn {
    height: 55px;
    line-height: 53px;
    color: #ffffff;
    background: #2467EC;
    border-radius: 4px;
    font-weight: 600;
    padding: 0 20px;
    text-align: center;
    display: flex;
    align-items: center;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    justify-content: center;
    width: 100%;
  }
  .event-btn:hover {
    color: #141517;
    background: #FFB013;
  }

  .course-sidebar-info.content-hidden ul {
    display: none;
  }
  .course-sidebar-info.content-hidden::after {
    transform: rotate(0deg);
  }

  .course-title-breadcrumb .breadcrumb-item {
    margin-right: 10px;
  }
  .course-title-breadcrumb .breadcrumb-item + .breadcrumb-item {
    padding-left: 0;
  }

  /*----------

  02. header style

  ----------*/
  .sticky-header.sticky {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: #ffffff;
    z-index: 999;
    animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
    -webkit-animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
    display: block;
    -webkit-box-shadow: 0px 10px 20px 0px rgba(8, 0, 42, 0.08);
    -moz-box-shadow: 0px 10px 20px 0px rgba(8, 0, 42, 0.08);
    box-shadow: 0px 10px 20px 0px rgba(8, 0, 42, 0.08);
  }

  .header-main3.sticky {
    border: none;
  }

  .header-note-area {
    padding: 12px 0;
    background: #FFB013;
  }

  .header-transparent {
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 999;
  }

  .header-main-wrapper {
    max-width: 1720px;
    margin: 0 auto;
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .header-main-wrapper {
      padding: 16px 0;
    }
  }

  .transpaerent-header {
    position: absolute;
    right: 0;
    left: 0;
    z-index: 999;
  }

  .note-text p {
    color: #141517;
    margin-bottom: 0;
  }
  .note-text p span {
    font-weight: 700;
  }

  .cattext {
    min-width: 220px;
    padding: 0px 20px;
    background: #ffffff;
    position: relative;
    margin-bottom: 0;
    border: 1px solid #edeef2;
    border-radius: 5px;
    color: #141517;
    height: 55px;
    line-height: 53px;
  }
  .cattext::before {
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background: transparent;
    z-index: 1;
  }

  .category-menu {
    position: relative;
    /*margin-left: 100px;*/
  }
  @media only screen and (min-width: 1600px) and (max-width: 1800px), only screen and (min-width: 1400px) and (max-width: 1599px) {
    .category-menu {
      margin-left: 30px;
    }
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
    .category-menu {
      margin-right: 14px;
    }
  }

  .Category-click {
    display: inline-block;
    cursor: pointer;
    position: relative;
  }
  .Category-click svg {
    margin-right: 10px;
    opacity: 0.4;
  }
  .Category-click span {
    color: #141517;
    position: relative;
  }
  .Category-click span::before {
    position: absolute;
    content: "";
    font-size: 13px;
    color: #141517;
    top: 50%;
    transform: translateY(-50%);
    font-family: "Font Awesome 5 Pro";
    right: -80px;
  }

  .dropdown-category {
    min-width: 240px;
    background-color: #ffffff;
    padding: 10px 0;
    box-shadow: 0px 20px 40px rgba(24, 44, 74, 0.05);
    transition: 0.3s;
    border-radius: 3px;
    z-index: 1001;
    position: absolute;
    top: 110%;
    left: 0;
  }
  .dropdown-category ul li {
    position: relative;
  }
  .dropdown-category ul li a {
    display: block;
    padding: 15px 20px;
    position: relative;
    color: #141517;
    font-size: 16px;
    line-height: 1;
    font-weight: 600;
  }
  .dropdown-category ul li a:hover {
    color: #2467EC;
  }

  .item-has-children {
    position: relative;
  }

  .dropdown-category .item-has-children:after {
    position: absolute;
    content: "";
    font-size: 12px;
    color: #141517;
    top: 50%;
    transform: translateY(-50%);
    right: 20px;
    font-family: "Font Awesome 5 Pro";
    font-weight: 400;
  }

  .category-submenu {
    position: absolute;
    top: 0;
    left: 100%;
    min-width: 240px;
    min-height: 100%;
    background: #ffffff;
    opacity: 0;
    padding: 5px 0;
    visibility: hidden;
    box-shadow: 0px 20px 40px rgba(24, 44, 74, 0.05);
    border-radius: 3px;
  }

  .dropdown-category ul li:hover > .category-submenu {
    opacity: 1;
    visibility: visible;
  }

  .dropdown-category {
    display: none;
  }

  .showCategory + .dropdown-category {
    display: block;
  }

  .header-search input {
    border: 1px solid #edeef2;
    height: 55px;
    width: 350px;
    background: #ffffff;
    border-radius: 5px;
    padding: 0 55px 0px 20px;
    color: #575757;
  }
  @media only screen and (min-width: 1600px) and (max-width: 1800px) {
    .header-search input {
      width: 250px;
    }
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .header-search input {
      width: 220px;
    }
  }
  .header-search button {
    position: absolute;
    top: 0;
    right: 20px;
    transform: translatey(-50%);
    top: 50%;
    color: #2467EC;
  }

  @media (max-width: 575px) {
    .header-cat-btn {
      display: none;
    }
  }

  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
    .cart-wrapper {
      margin-right: 25px;
    }
  }

  .item-number {
    position: absolute;
    right: -10px;
    top: -9px;
    width: 20px;
    height: 20px;
    background: #2467EC;
    color: #ffffff;
    text-align: center;
    line-height: 20px;
    border-radius: 50%;
    font-size: 14px;
  }

  .user-btn-inner::before {
    position: absolute;
    top: 50%;
    content: "";
    background: #edeef2;
    height: 35px;
    width: 1px;
    transform: translateY(-50%);
  }

  .user-btn-sign-in {
    color: #141517;
    font-weight: 600;
  }
  .user-btn-sign-in:hover {
    color: #2467EC;
  }

  .user-btn-content {
    margin-right: 30px;
    margin-left: 20px;
  }

  .main-menu ul li {
    display: inline-block;
    margin: 0px 20px;
    position: relative;
    /*submenu start*/
    /*submenu end*/
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .main-menu ul li {
      margin: 0px 16px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .main-menu ul li {
      margin: 0px 20px;
    }
  }
  .main-menu ul li a {
    font-size: 16px;
    color: #141517;
    display: block;
    padding: 42px 0px;
    font-weight: 600;
    text-transform: capitalize;
    line-height: 1;
  }
  .main-menu ul li .sub-menu {
    background: #ffffff none repeat scroll 0 0;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);
    left: 0;
    opacity: 0;
    position: absolute;
    top: 120%;
    transition: all 0.3s ease 0s;
    visibility: hidden;
    width: 240px;
    z-index: 9;
    border-top: 3px solid #2467EC;
    text-align: left;
    padding: 15px 0;
  }
  .main-menu ul li .sub-menu li {
    display: block;
    margin: 0px;
    padding: 8px 25px 8px 25px;
  }
  .main-menu ul li .sub-menu li:hover > .sub-menu {
    top: 0%;
  }
  .main-menu ul li .sub-menu li .sub-menu {
    left: 100%;
    top: 20%;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .main-menu ul li .sub-menu li a {
    padding: 0px;
    display: inline-block;
    color: #212237;
    position: relative;
  }
  .main-menu ul li .sub-menu li a:hover {
    color: #2467EC;
  }
  .main-menu ul li .sub-menu li a:before {
    width: 100%;
    left: 0;
    right: auto;
  }
  .main-menu ul li:hover a {
    color: #2467EC;
  }
  .main-menu ul li:hover.menu-item-has-children::after {
    color: #2467EC;
  }
  .main-menu ul li:hover > .sub-menu {
    opacity: 1;
    visibility: visible;
    top: 100%;
  }
  .main-menu ul li.menu-item-has-children {
    position: relative;
  }
  .main-menu ul li.menu-item-has-children:after {
    position: absolute;
    content: "";
    font-size: 12px;
    color: #212237;
    top: 50%;
    transform: translateY(-50%);
    right: -14px;
    font-family: "Font Awesome 5 Pro";
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .main-menu ul li ul li.menu-item-has-children::after {
    right: 14px;
  }

  .header-area-2 .main-menu ul li {
    margin: 0px 29px;
  }

  .header-top-area {
    border-bottom: 1px solid #ebebeb;
  }

  .header-top-inner {
    max-width: 1720px;
    margin: 0 auto;
  }

  .hero-text {
    position: relative;
    z-index: 2;
  }

  .header-btn {
    display: flex;
    align-items: center;
  }

  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .header-top-icon {
      padding-left: 80px;
    }
  }

  .header-top-icon i {
    margin-right: 10px;
    color: #2467EC;
  }
  .header-top-icon a {
    position: relative;
    padding-right: 35px;
    height: 40px;
    display: inline-block;
    line-height: 40px;
    font-size: 14px;
    font-weight: 600;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .header-top-icon a {
      padding-right: 10px;
    }
  }
  .header-top-icon a:hover {
    color: #2467EC;
  }
  .header-top-icon span {
    font-size: 14px;
    font-weight: 600;
  }

  .header-user-login span {
    margin-right: 20px;
  }
  .header-user-login span::before {
    position: absolute;
    width: 1px;
    height: 100%;
    background: #edeef2;
    content: "";
    right: 0;
  }
  .header-user-login span a {
    font-size: 14px;
    font-weight: 600;
  }
  .header-user-login span a:hover {
    color: #2467EC;
  }

  .header-social a {
    color: #a6b9cc;
    font-size: 15px;
    margin-left: 20px;
  }
  .header-social a:hover {
    color: #FFB013;
  }

  .header-menu-social i {
    margin-left: 10px;
    color: #a6b9cc;
  }
  .header-menu-social i:hover {
    color: #FFB013;
  }

  .header-top-icon a::before {
    position: absolute;
    content: "";
    height: 100%;
    width: 1px;
    background: #ebebeb;
    top: 0px;
    right: 18px;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), md, sm {
    .header-top-icon a::before {
      display: none;
    }
  }

  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
    .cart-wrapper {
      margin-right: 5px;
    }
  }

  .header-menu-top-icon a {
    display: block;
    font-size: 16px;
    margin-bottom: 5px;
  }
  .header-menu-top-icon a:hover {
    color: #2467EC;
  }
  .header-menu-top-icon i {
    margin-right: 10px;
    color: #2467EC;
  }

  .header-right-icon a {
    font-size: 14px;
    color: #ffffff;
    margin-left: 20px;
  }
  .header-right-icon a:hover {
    color: #FFB013;
  }

  .header-main3 .main-menu ul li {
    margin: 0px 29px;
  }
  .header-main3 .main-menu ul li a {
    color: #ffffff;
  }

  .header-main3 .main-menu ul li.menu-item-has-children::after {
    color: #ffffff;
  }

  .header-main3 .main-menu ul li ul li.menu-item-has-children::after {
    color: #212237;
  }

  .header-university-top-area {
    background-color: #2467EC;
    padding: 12px 0;
    line-height: 1;
  }

  .header-main3 {
    border-bottom: 1px solid #6d6d6d;
  }

  .header.header-main3:before {
    position: absolute;
    content: "";
    opacity: 0.23;
    width: 100%;
    height: 100%;
    background: #141517;
    z-index: -1;
  }

  .hero-area-3.hero-height-3 > * {
    position: relative;
  }

  .header-main3.transpaerent-header::after {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #141517;
    opacity: 0.23;
    content: "";
  }

  .header-main3.sticky.transpaerent-header::after {
    display: none;
  }

  .header-main3.transpaerent-header > * {
    position: relative;
    z-index: 9;
  }

  .header-university-top-area .header-left span {
    margin-left: 10px;
    font-size: 14px;
    font-weight: 600;
    color: #ffffff;
  }
  .header-university-top-area .header-left a {
    color: #ffffff;
    position: relative;
    padding-right: 35px;
    font-size: 14px;
    font-weight: 600;
  }
  .header-university-top-area .header-left a:before {
    position: absolute;
    content: "";
    background: #5b91fb;
    height: 40px;
    width: 1px;
    top: -12px;
    right: 13px;
  }
  .header-university-top-area .header-left i {
    margin-right: 10px;
  }

  .header-main3 .main-menu ul li a {
    color: #ffffff;
  }

  .hero-height-3 {
    overflow: hidden;
    height: 900px;
    display: flex;
    align-items: center;
  }
  @media (max-width: 575px) {
    .hero-height-3 {
      height: 650px;
    }
  }

  .header-main3.sticky .main-menu ul li a {
    color: #141517;
  }

  .header.header-main3.sticky::before {
    display: none;
  }

  .header-main3 .logo-black {
    display: none;
  }

  .header-main3.sticky .logo-black {
    display: block;
  }

  .header-main3.sticky .logo-white {
    display: none;
  }

  .header-main3.sticky .main-menu ul li.menu-item-has-children::after {
    color: #141517;
  }

  .header-main3.sticky .header__cart-icon svg * {
    fill: #141517;
  }

  .side-toggle.header-3 {
    padding: 17px 14px;
    display: block;
    position: relative;
  }

  .side-toggle.header-3:before {
    position: absolute;
    top: 0;
    content: "";
    background: #ffffff;
    opacity: 0.17;
    width: 100%;
    height: 100%;
    left: 0;
  }

  .side-toggle.header-3 span {
    background: #ffffff;
  }

  .header-main3.sticky .side-toggle.header-3 span {
    background: #141517;
  }

  .user-btn-wrapper {
    flex-wrap: wrap;
    gap: 20px;
  }

  @media (max-width: 575px) {
    .header-main3 .cart-wrapper {
      margin-right: 0;
    }
  }

  .filter-search-input input {
    width: 100%;
    height: 55px;
    padding: 0 35px 0 15px;
    font-size: 14px;
    color: #575757;
    outline: none;
    border: 1px solid #edeef2;
    border-radius: 5px;
  }

  .filter-search-input button {
    position: absolute;
    top: 50%;
    right: 15px;
    content: "";
    background: #ffffff;
    transform: translateY(-50%);
    color: #2467EC;
    font-size: 14px;
  }

  .sidebar-toggle-btn:hover {
    cursor: pointer;
  }

  .offcanvas-overlay {
    position: fixed;
    height: 100%;
    width: 100%;
    background: #000;
    z-index: 1000;
    top: 0;
    opacity: 0;
    visibility: hidden;
  }

  .offcanvas-overlay.overlay-open {
    opacity: 0.3;
    visibility: visible;
  }

  .offcanvas-overlay-white {
    position: fixed;
    height: 100%;
    width: 100%;
    background: #ffffff;
    z-index: 1000;
    top: 0;
    opacity: 0;
    visibility: hidden;
  }

  .offcanvas-overlay-white.overlay-open {
    opacity: 0;
    visibility: visible;
  }

  .side-info-close {
    background: none;
    border: 0;
    color: #141517;
    font-size: 20px;
    padding: 0;
    -webkit-transition: all 0.5s ease-out 0s;
    -moz-transition: all 0.5s ease-out 0s;
    -ms-transition: all 0.5s ease-out 0s;
    -o-transition: all 0.5s ease-out 0s;
    transition: all 0.5s ease-out 0s;
  }

  .side-info {
    background: #f5f5f5;
    height: 100%;
    position: fixed;
    z-index: 99999;
    right: -100%;
    top: 0;
    width: 365px;
    padding: 45px 35px 45px 45px;
    transition: 0.6s;
    overflow-y: scroll;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .side-info {
      width: 300px;
      padding: 15px 25px;
    }
  }

  .side-info.info-open {
    right: 0;
  }

  div.mean-container .mean-nav {
    background: none;
    margin-bottom: 40px;
    overflow: hidden;
  }
  div.mean-container .mean-nav > ul {
    display: block !important;
  }
  div.mean-container .mean-nav ul li a {
    width: 100%;
    color: #141517;
    border-top: 1px solid #edeef2;
    font-size: 16px;
    text-transform: capitalize;
    opacity: 1;
  }
  div.mean-container .mean-nav ul li a i {
    display: none;
  }
  div.mean-container .mean-nav ul li a.mean-expand {
    height: 25px;
    border: none;
  }
  div.mean-container .mean-nav ul li a.mean-expand::before {
    position: absolute;
    content: "+";
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }
  div.mean-container .mean-nav ul li a.mean-expand.mean-clicked::before {
    content: "-";
  }
  div.mean-container a.meanmenu-reveal {
    display: none !important;
  }

  .bar-icon {
    width: 20px;
    height: 14px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
  }

  .bar-icon span {
    width: 100%;
    height: 2px;
    background: #000;
    display: inline-block;
  }

  .bar-icon span:nth-child(2) {
    margin-left: 9px;
    transition: 0.3s;
  }

  .bar-icon:hover span:nth-child(2) {
    margin-left: 0;
  }

  .cartmini__area {
    position: relative;
  }
  .cartmini__wrapper {
    position: fixed;
    right: -320px;
    top: 0;
    width: 320px;
    height: 100%;
    background: #ffffff;
    -webkit-transition: all 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -moz-transition: all 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -ms-transition: all 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -o-transition: all 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
    transition: all 600ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
    -webkit-box-shadow: -5px 0 20px -5px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: -5px 0 20px -5px rgba(0, 0, 0, 0.5);
    box-shadow: -5px 0 20px -5px rgba(0, 0, 0, 0.5);
    z-index: 1005;
    overflow: hidden;
  }
  .cartmini__wrapper.opened {
    right: 0px;
  }
  .cartmini__title {
    padding: 20px 20px;
    border-bottom: 1px solid #edeef2;
    box-shadow: 0 0 10px 0 rgba(129, 129, 129, 0.2);
  }
  .cartmini__title h4 {
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 0;
  }
  .cartmini__close {
    position: absolute;
    top: 17px;
    right: 20px;
  }
  .cartmini__close-btn {
    background: transparent;
    color: #000;
    font-size: 22px;
  }
  .cartmini__close-btn:hover {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
  }
  .cartmini__widget {
    overflow-y: scroll;
    height: 100%;
  }
  .cartmini__inner ul li {
    position: relative;
    display: flex;
    padding: 20px;
    padding-right: 35px;
    border-bottom: 1px solid rgba(129, 129, 129, 0.2);
    transition: background-color 0.3s;
  }
  .cartmini__inner ul li:hover {
    background: #f9f9f9;
  }
  .cartmini__thumb {
    margin-right: 15px;
  }
  .cartmini__thumb img {
    width: 70px;
    height: 90px;
  }
  .cartmini__content h5 {
    font-size: 13px;
    margin-bottom: 12px;
    font-weight: 500;
  }
  .cartmini__content h5 a:hover {
    color: #141517;
  }
  .cartmini__del {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 25px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    color: #000;
    font-size: 12px;
    background: transparent;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
  }
  .cartmini__del:hover {
    background: #ffffff;
  }
  .cartmini__checkout {
    padding: 20px;
    padding-bottom: 85px;
    width: 100%;
    background: #ffffff;
    border-top: 2px solid #edeef2;
  }
  .cartmini__checkout-title h4 {
    font-size: 18px;
    display: inline-block;
    font-weight: 600;
    margin-bottom: 0;
  }
  .cartmini__checkout-title span {
    float: right;
    font-size: 20px;
    color: #000;
    font-weight: 600;
    color: #141517;
  }

  .cart-plus,
  .cart-minus {
    width: 25px;
    height: 30px;
    border: 2px solid #edeef2;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    font-size: 14px;
  }
  .cart-plus:hover,
  .cart-minus:hover {
    cursor: pointer;
    color: #ffffff;
    background: #2467EC;
    border-color: #2467EC;
  }

  .cart-input {
    height: 30px;
    width: 32px;
    text-align: center;
    font-size: 14px;
    border: none;
    border-top: 2px solid #edeef2;
    border-bottom: 2px solid #edeef2;
    display: inline-block;
    vertical-align: middle;
    margin: 0 -3px;
    padding-bottom: 0px;
  }
  .cart-input:focus {
    outline: none;
  }

  .eduman-header-notice-action-close {
    position: absolute;
    right: 20px;
    transition: all 0.3s;
    top: 13px;
  }
  .eduman-header-notice-action-close i {
    cursor: pointer;
    color: #141517;
  }

  .header-note-area {
    transition: all 0.3s;
  }

  .eduman-header-notice-hide {
    margin-top: -52px;
  }

  .side-toggle.header-2 {
    border: 1px solid #edeef2;
    padding: 17px 14px;
    display: block;
    border-radius: 4px;
  }

  /*----------

  03. hero style

  ----------*/
  .hero-text h5 {
    color: #2467EC;
    font-size: 18px;
    margin-bottom: 25px;
  }
  .hero-text h2 {
    line-height: 1.2;
    margin-bottom: 30px;
    font-size: 50px;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
    .hero-text h2 {
      font-size: 40px;
    }
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .hero-text h2 {
      font-size: 30px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .hero-text h2 {
      font-size: 35px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .hero-text h2 {
      font-size: 27px;
    }
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
    .hero-text h2 {
      font-size: 30px;
    }
  }
  .hero-text p {
    margin-bottom: 40px;
    font-size: 18px;
  }

  .hero-height {
    height: 900px;
    display: flex;
    align-items: center;
    background-position: center;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .hero-height {
      height: 840px;
      background-position: 80% 0%;
    }
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .hero-height {
      height: 600px;
      background-position: inherit;
    }
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .hero-height {
      background-position: 80% center;
    }
  }

  .section-title h2 {
    font-size: 36px;
    line-height: 1.3;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .section-title h2 {
      font-size: 30px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .section-title h2 {
      font-size: 30px;
    }
  }
  @media only screen and (min-width: 576px) and (max-width: 767px) {
    .section-title h2 {
      font-size: 28px;
    }
  }
  @media (max-width: 575px) {
    .section-title h2 {
      font-size: 26px;
    }
  }
  .section-title h2 a {
    color: #2467EC;
  }

  .shape.shape-1 {
    position: absolute;
    -webkit-animation: hero-circle-1 6s linear 0s infinite alternate;
    -moz-animation: hero-circle-1 6s linear 0s infinite alternate;
    -o-animation: hero-circle-1 6s linear 0s infinite alternate;
    animation: hero-circle-1 6s linear 0s infinite alternate;
    top: 35px;
    left: 105px;
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .shape.shape-1 {
      left: -10%;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .shape.shape-1 {
      display: none;
    }
  }

  .shape-2 {
    position: absolute;
    top: 100px;
    right: -25%;
    z-index: 1;
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
    .shape-2 {
      right: 0;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .shape-2 {
      display: none;
    }
  }

  .shape-3 {
    position: absolute;
    top: 50%;
    left: 0;
  }

  .shape-4 {
    position: absolute;
    top: 335px;
    left: 150px;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0px 40px 50px rgba(28, 51, 84, 0.16);
    width: 180px;
    padding: 17px;
    text-align: center;
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .shape-4 {
      top: 250px;
      left: -15px;
    }
  }
  @media only screen and (min-width: 1600px) and (max-width: 1800px) {
    .shape-4 {
      top: 320px;
      left: 180px;
    }
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .shape-4 {
      top: 200px;
      left: 6%;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .shape-4 {
      top: 274px;
      left: 0px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .shape-4 {
      display: none;
    }
  }
  .shape-4 img {
    box-shadow: 0px 10px 20px rgba(24, 44, 74, 0.16);
    border-radius: 50%;
    margin-bottom: 20px;
  }
  .shape-4 h5 {
    line-height: 1.6;
    font-size: 18px;
    font-weight: 700;
    font-family: "Nunito Sans";
    color: #141517;
  }

  .shape-5 {
    -webkit-animation: hero-thumb-sm-2-animation 4s linear infinite alternate;
    -moz-animation: hero-thumb-sm-2-animation 4s linear infinite alternate;
    -o-animation: hero-thumb-sm-2-animation 4s linear infinite alternate;
    animation: hero-thumb-sm-2-animation 4s linear infinite alternate;
    position: absolute;
    max-width: 283px;
    box-shadow: 0px 40px 50px rgba(28, 51, 84, 0.16);
    bottom: -350px;
    right: -36%;
    padding: 20px 24px 15px;
    background: #ffffff;
    border-radius: 12px;
  }
  @media only screen and (min-width: 1600px) and (max-width: 1800px) {
    .shape-5 {
      right: -15%;
    }
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .shape-5 {
      bottom: -300px;
      right: 0%;
    }
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .shape-5 {
      right: -7%;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .shape-5 {
      bottom: -217px;
      right: -10%;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .shape-5 {
      display: none;
    }
  }
  .shape-5 h5 {
    font-size: 18px;
    line-height: 1.6;
    font-weight: 400;
    font-family: "Nunito Sans";
    margin-bottom: 0;
  }
  .shape-5 span {
    color: #2467EC;
    font-weight: 700;
    text-align: center;
  }

  .shape-6 {
    position: absolute;
    top: 200px;
    left: 17%;
  }
  @media only screen and (min-width: 1600px) and (max-width: 1800px) {
    .shape-6 {
      right: 0;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .shape-6 {
      display: none;
    }
  }

  .course-card {
    position: absolute;
    top: -31px;
    left: 15px;
    background: #ffffff;
    padding: 10px 15px;
    border-radius: 7px;
  }
  .course-card img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    box-shadow: 0px 0px 10px rgba(28, 51, 84, 0.1);
    margin-right: -15px;
    border: 4px solid #ffffff;
  }
  .course-card span i {
    width: 30px;
    height: 30px;
    background: #FFB013;
    border-radius: 50%;
    color: #141517;
    font-size: 10px;
    border: 4px solid #ffffff;
    line-height: 22px;
  }

  @media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
    .header-home-2-area {
      padding: 10px 0;
    }
  }

  .hero-text h2 {
    line-height: 1.2;
    margin-bottom: 20px;
    font-size: 50px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .hero-text h2 {
      font-size: 45px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .hero-text h2 {
      font-size: 38px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
    .hero-text h2 {
      font-size: 36px;
    }
  }
  @media (max-width: 575px) {
    .hero-text h2 {
      font-size: 30px;
    }
  }

  .hero-area {
    height:600px;
    background-color: #edeff5;
  }

  .hero-thumb-01 {
    position: absolute;
    left: -170px;
    top: -90px;
  }
  @media only screen and (min-width: 1600px) and (max-width: 1800px) {
    .hero-thumb-01 {
      left: -115px;
      top: -75px;
    }
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
    .hero-thumb-01 {
      left: -1%;
      top: -75px;
    }
  }

  .hero-thumb-02 {
    position: absolute;
    top: -60px;
    right: -145px;
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .hero-thumb-02 {
      right: -50px;
    }
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .hero-thumb-02 {
      right: -3%;
    }
  }

  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .hero-tittle-info {
      margin-left: 10%;
    }
  }
  .hero-tittle-info h2 {
    font-size: 50px;
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
    .hero-tittle-info h2 {
      font-size: 45px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .hero-tittle-info h2 {
      font-size: 38px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
    .hero-tittle-info h2 {
      font-size: 36px;
    }
  }
  @media (max-width: 575px) {
    .hero-tittle-info h2 {
      font-size: 30px;
    }
  }

  .slider-search-icon input {
    width: 100%;
    height: 70px;
    background: #ffffff;
    outline: none;
    border: 1px solid #edeef2;
    border-radius: 5px;
    padding: 0px 40px 0 30px;
  }

  .slider-search {
    margin: 0 auto;
    margin-bottom: 30px;
  }
  @media only screen and (min-width: 1600px) and (max-width: 1800px) {
    .slider-search {
      width: 80%;
    }
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
    .slider-search {
      width: 70%;
    }
  }

  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .slider-content-wrapper {
      text-align: center;
    }
  }

  .slider-search-icon button {
    position: absolute;
    top: 50%;
    right: 23px;
    transform: translatey(-50%);
    color: #2467EC;
  }

  .slider-course-content ul li {
    display: inline-block;
    margin: 0 20px;
    margin-bottom: 10px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .slider-course-content ul li {
      margin: 0 10px;
    }
  }
  .slider-course-content ul li i {
    margin-right: 10px;
    color: #b9c4d6;
    font-size: 20px;
  }
  .slider-course-content ul li span {
    font-size: 16px;
    font-weight: 600;
    color: #141517;
  }

  .slider-content-wrapper {
    z-index: 1;
    position: relative;
  }

  .hero-shape-2 {
    position: absolute;
    top: -42%;
    left: -3%;
    -webkit-animation: hero-thumb-sm-2-animation 4s linear infinite alternate;
    -moz-animation: hero-thumb-sm-2-animation 4s linear infinite alternate;
    -o-animation: hero-thumb-sm-2-animation 4s linear infinite alternate;
    animation: hero-thumb-sm-2-animation 4s linear infinite alternate;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .hero-shape-2 {
      display: none;
    }
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .hero-shape-2 {
      left: 4%;
    }
  }

  .hero-shape-1 {
    position: absolute;
    bottom: 9%;
    z-index: 1;
    left: 0;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .hero-shape-1 {
      display: none;
    }
  }

  .hero-shape-3 {
    position: absolute;
    left: -60px;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0px 40px 50px rgba(28, 51, 84, 0.16);
    width: 180px;
    padding: 17px;
    text-align: center;
    bottom: -20px;
    z-index: 1;
    height: 200px;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .hero-shape-3 {
      bottom: -174px;
    }
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .hero-shape-3 {
      left: 52px;
      top: 160px;
    }
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .hero-shape-3 {
      left: -6%;
      top: 40%;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .hero-shape-3 {
      display: none;
    }
  }
  .hero-shape-3 h5 {
    font-size: 18px;
    line-height: 28px;
  }
  .hero-shape-3 img {
    box-shadow: 0px 10px 20px rgba(24, 44, 74, 0.16);
    border-radius: 50px;
    margin-bottom: 15px;
  }

  .hero-shape-4 {
    position: absolute;
    top: 60px;
    z-index: 1;
    right: 21%;
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .hero-shape-4 {
      top: 50px;
      right: 25%;
    }
  }

  .hero-shape-5 {
    position: absolute;
    right: 11%;
    top: 9%;
  }

  .hero-shap-5 {
    position: absolute;
    max-width: 283px;
    box-shadow: 0px 40px 50px rgba(28, 51, 84, 0.16);
    bottom: 20%;
    right: 9%;
    -webkit-animation: hero-thumb-sm-2-animation 4s linear infinite alternate;
    -moz-animation: hero-thumb-sm-2-animation 4s linear infinite alternate;
    -o-animation: hero-thumb-sm-2-animation 4s linear infinite alternate;
    animation: hero-thumb-sm-2-animation 4s linear infinite alternate;
    padding: 25px 20px 16px 20px;
    background: #ffffff;
    border-radius: 12px;
    z-index: 1;
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .hero-shap-5 {
      right: 6%;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .hero-shap-5 {
      display: none;
    }
  }
  .hero-shap-5 h5 {
    font-size: 18px;
    line-height: 28px;
    font-family: "Nunito Sans", sans-serif;
    margin-bottom: 0px;
    font-weight: 400;
  }
  .hero-shap-5 span {
    color: #2467EC;
    font-weight: 700;
    text-align: center;
  }

  .hero-shape-6 {
    position: absolute;
    bottom: 7%;
    right: 21%;
    -webkit-animation: hero-circle-1 6s linear 0s infinite alternate;
    -moz-animation: hero-circle-1 6s linear 0s infinite alternate;
    -o-animation: hero-circle-1 6s linear 0s infinite alternate;
    animation: hero-circle-1 6s linear 0s infinite alternate;
  }

  .hero-shape-7 {
    position: absolute;
    bottom: 0;
    right: 46%;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .hero-shape-7 {
      display: none;
    }
  }

  .hero-card {
    background: #ffffff;
    padding: 10px 10px;
    border-radius: 7px;
    position: absolute;
    bottom: 75%;
  }
  .hero-card img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    box-shadow: 0px 0px 10px rgba(28, 51, 84, 0.1);
    margin-right: -15px;
    border: 4px solid #ffffff;
  }
  .hero-card span i {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    line-height: 22px;
    width: 30px;
    background: #FFB013;
    border-radius: 50%;
    color: #141517;
    font-size: 10px;
    border: 4px solid #ffffff;
    line-height: 22px;
  }

  .skill-price-start {
    position: absolute;
    font-size: 16px;
    color: #ffffff;
    background: red;
    height: 100px;
    width: 100px;
    line-height: 100px;
    border-radius: 50%;
    text-align: center;
    top: 0;
    left: 0;
  }

  @keyframes hero-thumb-sm-animation {
    0% {
      -webkit-transform: translateY(-20px) translateX(50px);
      -moz-transform: translateY(-20px) translateX(50px);
      -ms-transform: translateY(-20px) translateX(50px);
      transform: translateY(-20px) translateX(50px);
    }
    100% {
      -webkit-transform: translateY(-20px) translateX(0px);
      -moz-transform: translateY(-20px) translateX(0px);
      -ms-transform: translateY(-20px) translateX(0px);
      transform: translateY(-20px) translateX(0px);
    }
  }
  @keyframes hero-thumb-sm-2-animation {
    0% {
      -webkit-transform: translateY(-50px);
      -moz-transform: translateY(-50px);
      -ms-transform: translateY(-50px);
      transform: translateY(-50px);
    }
    100% {
      -webkit-transform: translateY(0px);
      -moz-transform: translateY(0px);
      -ms-transform: translateY(0px);
      transform: translateY(0px);
    }
  }
  @keyframes hero-circle-2 {
    0% {
      -webkit-transform: translateX(-200px);
      -moz-transform: translateX(-200px);
      -ms-transform: translateX(-200px);
      transform: translateX(-200px);
    }
    100% {
      -webkit-transform: translateX(0px);
      -moz-transform: translateX(0px);
      -ms-transform: translateX(0px);
      transform: translateX(0px);
    }
  }
  @keyframes hero-bounce {
    0%, 20%, 50%, 80%, 100% {
      transform: translateY(0);
    }
    40% {
      transform: translateY(-30px);
    }
    60% {
      transform: translateY(-15px);
    }
  }
  @keyframes hero-circle-1 {
    0% {
      -webkit-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    100% {
      -webkit-transform: rotate(360deg);
      -moz-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }
  @keyframes hero-triangle-1 {
    0% {
      -webkit-transform: rotate(0deg);
      -moz-transform: rotate(0deg);
      -ms-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    100% {
      -webkit-transform: rotate(360deg);
      -moz-transform: rotate(360deg);
      -ms-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }
  @keyframes services-triangle {
    0% {
      -webkit-transform: rotate(0deg) translateX(-50px);
      -moz-transform: rotate(0deg) translateX(-50px);
      -ms-transform: rotate(0deg) translateX(-50px);
      transform: rotate(0deg) translateX(-50px);
    }
    100% {
      -webkit-transform: rotate(360deg) translateY(100px);
      -moz-transform: rotate(360deg) translateY(100px);
      -ms-transform: rotate(360deg) translateY(100px);
      transform: rotate(360deg) translateY(100px);
    }
  }
  .hero-area-3 {
    position: relative;
    max-width: 1920px;
    margin: 0 auto;
  }
  .hero-area-3:before {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #010a2e;
    content: "";
    opacity: 0.45;
  }

  .hero-university-text span {
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
    color: #FFB013;
    margin-bottom: 35px;
    display: block;
  }
  .hero-university-text h2 {
    font-size: 80px;
    color: #ffffff;
    font-weight: 900;
    margin-bottom: 35px;
    line-height: 1.1;
    text-transform: uppercase;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .hero-university-text h2 {
      font-size: 70px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .hero-university-text h2 {
      font-size: 50px;
    }
  }
  @media (max-width: 575px) {
    .hero-university-text h2 {
      font-size: 28px;
    }
  }

  .hero-course-1-text h2 {
    font-size: 60px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 15px;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .hero-course-1-text h2 {
      font-size: 54px;
    }
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
    .hero-course-1-text h2 {
      font-size: 35px;
    }
  }

  /*----------

  04. section-title style

  ----------*/
  .down-mark-line {
    position: relative;
    z-index: 2;
    display: inline-block;
  }
  .down-mark-line::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 100%;
    z-index: -1;
    height: 100%;
    background: url(../img/icon/down-mark-line.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom;
    -webkit-animation: section-animation 3s infinite;
    animation: section-animation 3s infinite;
  }

  @keyframes section-animation {
    0% {
      width: 0;
    }
    15% {
      width: 100%;
    }
    85% {
      opacity: 1;
    }
    90% {
      width: 100%;
      opacity: 0;
    }
    to {
      width: 0;
      opacity: 0;
    }
  }
  .down-mark-line-2 {
    position: relative;
    z-index: 2;
    display: inline-block;
  }
  .down-mark-line-2::before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 8%;
    width: 100%;
    z-index: -1;
    height: 100%;
    background: url(../img/icon/down-mark-line-2.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom;
    -webkit-animation: section-animation 3s infinite;
    animation: section-animation 3s infinite;
  }

  /*----------

  05. category style

  ----------*/
  .catagory-wrapper {
    display: flex;
    background: transparent;
    align-items: center;
    border: 1px solid #edeef2;
    border-radius: 5px;
    padding: 20px 30px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .catagory-wrapper:hover {
    background-color: #2467EC;
    box-shadow: 0px 40px 40px rgba(24, 44, 74, 0.1);
    border-color: #2467EC;
  }
  .catagory-wrapper .catagory-thumb {
    margin-right: 22px;
  }
  .catagory-wrapper .catagory-content {
    color: #141517;
  }
  .catagory-wrapper .catagory-content h3 {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 4px;
    line-height: 1.5;
  }
  .catagory-wrapper .catagory-content span {
    color: #575757;
    font-size: 16px;
    font-weight: 600;
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px) {
    .catagory-wrapper .catagory-content span {
      font-size: 14px;
    }
  }
  .catagory-wrapper:hover .catagory-content :is(a, h3, span) {
    color: #ffffff;
  }

  .catagory-wrapper:hover svg * {
    fill: #ffffff;
  }

  .categories-area {
    background-color: #F6F8FB;
  }

  .categories-wrapper {
    padding: 37px 20px 15px 20px;
    background: #ffffff;
    box-shadow: 0px 20px 30px rgba(24, 44, 74, 0.05);
    border-radius: 10px;
  }

  .categiories-thumb {
    transition: 0.3s;
  }
  .categiories-thumb svg {
    margin-bottom: 30px;
  }

  .categories-wrapper:hover .categiories-thumb {
    transform: translateY(-10px);
  }

  .categories-content h4 {
    margin-bottom: 5px;
  }
  .categories-content p {
    font-weight: 600;
  }
  @media only screen and (min-width: 1600px) and (max-width: 1800px) {
    .categories-content p {
      font-size: 15px;
    }
  }

  .category-shap-01 {
    position: absolute;
    top: -28%;
    left: -5%;
  }

  .category-shap-02 {
    position: absolute;
    top: 0;
    right: 0;
    overflow: hidden;
  }
  @media only screen and (min-width: 1600px) and (max-width: 1800px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
    .category-shap-02 {
      right: 0;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .category-shap-02 {
      display: none;
    }
  }

  .category-button-prev {
    width: 45px;
    height: 45px;
    border: 1px solid #edeef2;
    text-align: center;
    line-height: 45px;
    border-radius: 50%;
    background: #ffffff;
    position: absolute;
    top: 46%;
    transform: translate(-50%, -50%);
    z-index: 2;
    left: 0;
    transition: 0.3s;
  }
  @media (max-width: 575px) {
    .category-button-prev {
      transform: translate(-25%, -50%);
    }
  }
  .category-button-prev:hover {
    border-color: #2467EC;
    background: #2467EC;
    color: #ffffff;
  }

  .category-button-next {
    width: 45px;
    height: 45px;
    border: 1px solid #edeef2;
    text-align: center;
    line-height: 45px;
    border-radius: 50%;
    background: #ffffff;
    position: absolute;
    top: 46%;
    transform: translate(50%, -50%);
    z-index: 2;
    right: 0;
    transition: 0.3s;
  }
  @media (max-width: 575px) {
    .category-button-next {
      transform: translate(25%, -50%);
    }
  }
  .category-button-next:hover {
    border-color: #2467EC;
    background: #2467EC;
    color: #ffffff;
  }

  /*----------

  06. counter style

  ----------*/
  .counter-wrapper {
    padding: 50px 30px 50px 30px;
    background-color: #F6F8FB;
  }

  .count-number span {
    font-size: 36px;
    font-weight: 700;
    margin-bottom: 10px;
    display: inline-block;
    color: #141517;
  }
  .count-number p {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 0px;
  }

  .counter-icon svg {
    margin-bottom: 30px;
  }

  .counter-img svg {
    margin-bottom: 25px;
  }

  .university-couner-text span {
    font-size: 36px;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 15px;
    display: inline-block;
  }

  .university-couner-text p {
    font-size: 18px;
    font-weight: 600;
    color: #ffffff;
  }

  /*----------

  07. student-choose style

  ----------*/
  .student-choose-thumb {
    margin-top: 37px;
  }
  .student-choose-thumb img {
    max-width: 100%;
  }

  .sitdent-choose-content {
    margin-bottom: 20px;
  }
  .sitdent-choose-content p {
    color: #575757;
  }

  .student-choose-list {
    margin-bottom: 40px;
  }
  .student-choose-list li {
    margin-bottom: 15px;
    color: #141517;
  }
  .student-choose-list i {
    margin-right: 10px;
    color: #d0d9e9;
    font-size: 20px;
  }

  .student-choose-list i.far {
    color: #2467EC;
  }

  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .student-btn {
      margin-bottom: 30px;
    }
  }

  .shap-01 {
    position: absolute;
    top: 170px;
    left: 40%;
    height: 130px;
    width: 122px;
    background: #FFB013;
    border-radius: 8px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .shap-01 {
      top: 120px;
      left: 31%;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .shap-01 {
      top: 120px;
      left: 18%;
    }
  }

  .shap-02 {
    position: absolute;
    top: -8%;
    left: 45%;
    height: 151px;
    width: 150px;
    background: #2467EC;
    border-radius: 8px;
    z-index: -1;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .shap-02 {
      top: -11%;
      left: 48%;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .shap-02 {
      top: -20%;
      left: 48%;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .shap-02 {
      left: 34%;
    }
  }
  @media (max-width: 575px) {
    .shap-02 {
      top: 1%;
    }
  }

  .shap-03 {
    position: absolute;
    top: -7%;
    left: -7%;
    z-index: -1;
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
    .shap-03 {
      display: none;
    }
  }

  .shap-04 {
    position: absolute;
    bottom: -9%;
    left: 33%;
    z-index: -1;
  }

  .shap-05 {
    position: absolute;
    bottom: 41%;
    right: -35%;
    z-index: -1;
  }
  @media only screen and (min-width: 1600px) and (max-width: 1800px), only screen and (min-width: 1200px) and (max-width: 1399px) {
    .shap-05 {
      right: 0;
    }
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .shap-05 {
      right: 0;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .shap-05 {
      display: none;
    }
  }

  .shap-06 {
    position: absolute;
    top: -160px;
    right: -43%;
    z-index: -2;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .shap-06 {
      display: none;
    }
  }

  .shap-07 {
    position: absolute;
    bottom: 15%;
    right: -20%;
    z-index: -1;
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .shap-07 {
      right: -6%;
    }
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .shap-07 {
      right: 0;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .shap-07 {
      display: none;
    }
  }

  /*----------

  08. testimonial style

  ----------*/
  .testimonial-header {
    display: flex;
    align-items: center;
    margin-bottom: 40px;
  }

  .testimonial-items {
    background: #f8f9fb;
    padding: 30px;
    z-index: 2;
    border-radius: 5px;
  }

  .testimonial-img img {
    margin-right: 20px;
  }

  .testimonial-title h4 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 2px;
  }
  .testimonial-title span {
    font-size: 16px;
    margin-bottom: 2px;
    display: block;
  }

  .testimoni-quotes img {
    position: absolute;
    top: 30px;
    right: 30px;
    z-index: -1;
    content: "";
  }

  .testimonial-body {
    margin-bottom: 20px;
  }
  .testimonial-body h3 {
    font-size: 20px;
    color: #2467EC;
    margin-bottom: 20px;
  }

  .testimonial-icon i {
    color: #FFB013;
    font-size: 15px;
  }

  .testimonial-pagination {
    margin-top: 50px;
    line-height: 1;
  }

  /*----------

  09. education style

  ----------*/
  .education-img img {
    max-width: 100%;
  }

  .sitdent-choose-content p {
    margin-bottom: 25px;
  }

  .education-content p {
    margin-bottom: 40px;
  }

  .education-shape {
    position: absolute;
    right: 5%;
    top: 23%;
  }
  @media (max-width: 575px) {
    .education-shape {
      display: none;
    }
  }

  .education-shape-2 {
    position: absolute;
    top: 26%;
    left: 24%;
    z-index: -1;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .education-shape-2 {
      left: 17%;
    }
  }
  @media (max-width: 575px) {
    .education-shape-2 {
      display: none;
    }
  }

  .education-shape-3 {
    position: absolute;
    right: 16%;
    top: 60%;
    z-index: -1;
  }

  .education-shape-4 {
    position: absolute;
    right: 4%;
    top: 45%;
    z-index: -1;
  }

  /*----------

  10. partner style

  ----------*/
  .patner-area {
    background-color: #F6F8FB;
  }

  .partner-wrapper {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 45px 70px;
    margin-top: 10px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .partner-wrapper {
      gap: 45px 45px;
    }
  }

  .partner-box {
    position: relative;
    max-width: 430px;
    z-index: 2;
  }

  .partner-thumb {
    position: absolute;
    top: -110px;
    left: -250px;
    z-index: -1;
  }

  .partner-text {
    margin-top: 20px;
  }
  .partner-text p {
    font-weight: 600;
    color: #141517;
    max-width: 245px;
  }
  .partner-text p span {
    font-size: 24px;
    font-weight: 700;
    color: #2467EC;
  }

  /*----------

  11. teacher style

  ----------*/
  .teacher-area {
    overflow-x: clip;
  }

  .teacher-img {
    margin-bottom: 45px;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .teacher-img {
      margin-bottom: 95px;
    }
  }

  .teacher-main-img {
    padding-left: 60px;
    max-width: 100%;
  }

  .teacher-shape {
    position: absolute;
    top: 10px;
    left: 0;
    z-index: -10;
  }

  .teacher-shape-02 {
    position: absolute;
    left: 0;
    bottom: -45px;
  }

  .teacher-shape-03 {
    position: absolute;
    top: -113px;
    left: -126px;
    z-index: -1;
  }

  .teacher-shape-04 {
    position: absolute;
    top: 100px;
    left: -140px;
    z-index: -1;
  }

  .zoom-thumb {
    margin-left: 50px;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .zoom-thumb {
      margin-left: 0;
    }
  }

  .zoom-shape-02 {
    position: absolute;
    top: 0;
    left: 0;
    box-shadow: 0px 20px 80px rgba(28, 51, 84, 0.2);
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .zoom-shape-02 {
      right: 11%;
    }
  }

  .zoom-shape-01 {
    position: absolute;
    top: -60px;
    left: -7%;
    z-index: -1;
    -webkit-animation: hero-thumb-sm-animation 4s linear infinite alternate;
    -moz-animation: hero-thumb-sm-animation 4s linear infinite alternate;
    -o-animation: hero-thumb-sm-animation 4s linear infinite alternate;
    animation: hero-thumb-sm-animation 4s linear infinite alternate;
  }
  @media (max-width: 575px) {
    .zoom-shape-01 {
      display: none;
    }
  }

  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .zoom-class-wrapper {
      margin-bottom: 60px;
      margin-top: -40px;
    }
  }

  .zoom-thumb-main-img {
    max-width: 100%;
  }

  /*----------

  12. blog style

  ----------*/
  .blog-thumb {
    border-radius: 5px;
    overflow: hidden;
  }
  .blog-thumb img {
    transition: all 1.5s cubic-bezier(0, 0, 0.2, 1);
    width: 100%;
  }

  .blog-wrapper:hover .blog-thumb img {
    transform: scale3d(1.05, 1.05, 1.05);
  }

  .blog-content p {
    margin-bottom: 30px;
  }

  .blog-meta {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
  }
  .blog-meta i {
    font-size: 16px;
    margin-right: 10px;
    line-height: 1;
  }
  .blog-meta span {
    font-size: 16px;
    margin-right: 40px;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), (max-width: 575px) {
    .blog-meta span {
      font-size: 15px;
      margin-right: 25px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .blog-meta span {
      margin-right: 30px;
    }
  }

  .blog-meta > div {
    display: flex;
    align-items: center;
  }

  .blog-content h3 {
    font-size: 22px;
    margin-bottom: 30px;
    line-height: 1.5;
  }
  .blog-content h3:hover {
    color: #2467EC;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .blog-content h3 {
      font-size: 20px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .blog-content h3 {
      font-size: 18px;
      font-weight: 600;
    }
  }

  .blog-content-wrapper {
    padding: 30px 30px 40px 30px;
    background: #ffffff;
    box-shadow: 0px 20px 40px rgba(28, 51, 84, 0.1);
    border-radius: 0 0 5px 5px;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), (max-width: 575px) {
    .blog-content-wrapper {
      padding: 30px 20px 40px 20px;
    }
  }

  .blog-wrapper {
    border-radius: 5px;
  }

  .blog-tag {
    position: absolute;
    top: 20px;
    left: 20px;
    background: #2467EC;
    color: #ffffff;
    padding: 0 15px;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
    height: 30px;
    line-height: 30px;
    border-radius: 2px;
    display: flex;
    align-items: center;
    gap: 10px;
    transition: 0.6s;
  }
  .blog-tag:hover {
    background: #ffffff;
    color: #141517;
  }
  .blog-tag:focus {
    color: #141517;
  }

  .sidebar__search input {
    width: 100%;
    height: 60px;
    line-height: 56px;
    background: #ffffff;
    border: 1px solid #edeef2;
    box-shadow: 0px 10px 30px rgba(28, 51, 84, 0.08);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding-left: 30px;
    padding-right: 45px;
  }
  .sidebar__search input::placeholder {
    color: #575757;
    font-weight: 500;
  }
  .sidebar__search button {
    position: absolute;
    top: 50%;
    right: 20px;
    left: auto;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .sidebar__search button svg {
    width: 18px;
    height: 18px;
  }
  .sidebar__search button svg .st0 {
    fill: #575757;
  }
  .sidebar__search button svg .st1 {
    fill: #575757;
  }

  .rc__post:not(:last-child) {
    margin-bottom: 30px;
  }
  .rc__meta span {
    color: #575757;
    font-weight: 500;
    font-size: 15px;
    line-height: 1;
    display: inline-block;
    margin-bottom: 10px;
  }
  .rc__thumb img {
    width: 75px;
    height: 75px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    object-fit: cover;
  }
  .rc__title {
    font-size: 18px;
    color: #141517;
    margin-bottom: 0px;
    font-weight: 700;
    line-height: 1.1;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .rc__title {
      font-size: 16px;
      font-weight: 600;
    }
  }
  .rc__title a:hover {
    color: #2467EC;
  }

  .sidebar__widget {
    border: 1px solid #edeef2;
    padding: 30px 30px;
    border-radius: 5px;
    box-shadow: 0px 10px 30px rgba(28, 51, 84, 0.08);
    background-color: #ffffff;
  }
  @media (max-width: 575px) {
    .sidebar__widget {
      padding: 30px 20px;
    }
  }

  .sidebar__category ul li:not(:last-child) {
    margin-bottom: 15px;
  }
  .sidebar__category ul li a {
    font-size: 16px;
    font-weight: 500;
    color: #575757;
    padding-left: 20px;
    position: relative;
  }
  .sidebar__category ul li a::after {
    position: absolute;
    content: "";
    left: 0;
    top: 9px;
    width: 6px;
    height: 6px;
    background: #adaeba;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
  }
  .sidebar__category ul li a:hover {
    color: #2467EC;
  }
  .sidebar__category ul li a:hover::after {
    background: #2467EC;
  }

  .sidebar__tag a {
    display: inline-block;
    height: 36px;
    line-height: 38px;
    padding: 0 15px;
    font-size: 15px;
    font-weight: 500;
    color: #575757;
    background: #F6F8FB;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    margin-right: 8px;
    margin-bottom: 10px;
  }
  .sidebar__tag a:hover {
    color: #ffffff;
    background: #2467EC;
  }

  blockquote {
    margin: 35px 0px !important;
    padding: 40px;
    color: #666;
    position: relative;
    background: #f3f4f8;
    font-style: normal;
    text-align: left;
    clear: both;
    font-weight: 400;
    box-shadow: 0px 1px 2px 0px rgba(10, 0, 58, 0.14);
    border: 1px solid #f3f4f8;
  }

  blockquote::before {
    content: "";
    position: static;
    font-family: "Font Awesome 5 Pro";
    font-size: 32px;
    color: #2467EC;
    line-height: 1;
    margin-bottom: 18px;
    display: inline-block;
  }

  .post-text blockquote p {
    margin-bottom: 10px !important;
    line-height: 1.3;
    font-size: 20px;
    color: #070337;
    font-weight: 400;
  }

  blockquote cite {
    font-size: 18px;
    display: block;
    margin-top: 10px;
    color: #070337;
    font-style: inherit;
    font-weight: 600;
  }

  blockquote cite::before {
    content: "";
    font-size: 28px;
    color: #ff5421;
    padding-bottom: 0px;
    display: inline-block;
    background: #2467EC;
    height: 2px;
    width: 40px;
    font-weight: 400;
    text-align: center;
    top: -4px;
    margin-right: 10px;
    position: relative;
  }

  .blog-details-wrapper img {
    width: 100%;
  }

  blockquote p {
    font-size: 18px;
    color: #141517;
    font-style: italic;
    font-weight: 600;
  }

  div.tagcloud a {
    display: inline-block;
    height: 36px;
    line-height: 38px;
    padding: 0 15px;
    font-size: 15px;
    font-weight: 500;
    color: #53545b;
    background: #f3f4f8;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    margin-right: 8px;
    margin-bottom: 10px;
  }

  div.tagcloud a:hover {
    color: #ffffff;
    background: #2467EC;
  }

  .blog__details__tag span {
    font-weight: 600;
    margin-right: 10px;
    color: #141517;
  }

  /* comment box */
  .latest-comments h3 {
    font-size: 26px;
    font-weight: 600;
    margin-bottom: 20px;
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .latest-comments h3 {
      font-size: 22px;
    }
  }

  .latest-comments ul li {
    margin-bottom: 10px;
  }

  .latest-comments ul li.children {
    margin-left: 100px;
  }
  @media (max-width: 575px) {
    .latest-comments ul li.children {
      margin-left: 15px;
    }
  }

  .latest-comments ul li ul li.children-2 {
    margin-left: 100px;
    margin-top: 10px;
  }
  @media (max-width: 575px) {
    .latest-comments ul li ul li.children-2 {
      margin-left: 15px;
    }
  }

  .comments-box {
    padding: 30px;
    padding-top: 30px;
    padding-right: 30px;
    padding-right: 40px;
    padding-top: 25px;
    background: #fff;
    border: 1px solid #edeef2;
    border-radius: 5px;
  }

  .comments-avatar img {
    width: 50px;
    height: 50px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
  }

  .avatar-name {
    margin-bottom: 5px;
  }

  .avatar-name h5 {
    font-size: 16px;
    line-height: 1;
    margin-bottom: 0;
  }

  .avatar-name span {
    font-size: 14px;
    color: #575757;
  }

  @media (max-width: 575px) {
    .comments-text {
      margin-left: 0;
      margin-top: 15px;
    }
  }

  .comments-text p {
    font-size: 16px;
    color: #575757;
    margin-bottom: 15px;
  }

  .comments-replay {
    margin-top: 10px;
  }
  .comments-replay a {
    display: inline-block;
    color: #2467EC;
    background: rgba(43, 78, 255, 0.1);
    height: 25px;
    line-height: 25px;
    padding: 0 10px;
    font-weight: 500;
    font-size: 14px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
  }
  .comments-replay a:hover {
    color: #ffffff;
    background: #2467EC;
  }

  .blog__comment h3 {
    font-size: 26px;
    font-weight: 600;
    margin-bottom: 40px;
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .blog__comment h3 {
      font-size: 22px;
    }
  }
  .blog__comment-input input, .blog__comment-input textarea {
    width: 100%;
    height: 56px;
    line-height: 56px;
    border: 2px solid #f8f8f9;
    background: #f8f8f9;
    color: #000;
    font-size: 15px;
    outline: none;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    margin-bottom: 20px;
    padding: 0 24px;
  }
  .blog__comment-input input::placeholder, .blog__comment-input textarea::placeholder {
    font-size: 15px;
    color: #575757;
  }
  .blog__comment-input input:focus, .blog__comment-input textarea:focus {
    background: #ffffff;
    border-color: #2467EC;
  }
  .blog__comment-input textarea {
    height: 180px;
    resize: none;
    line-height: 1.2;
    padding: 23px;
    padding-top: 19px;
    margin-bottom: 13px;
  }
  .blog__comment-agree {
    padding-left: 5px;
  }
  .blog__comment-agree input {
    margin: 0;
    appearance: none;
    -moz-appearance: none;
    display: block;
    width: 14px;
    height: 14px;
    background: #ffffff;
    border: 1px solid #b9bac1;
    outline: none;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
  }
  .blog__comment-agree input:checked {
    position: relative;
    background-color: #2467EC;
    border-color: transparent;
  }
  .blog__comment-agree input:checked::after {
    box-sizing: border-box;
    content: "";
    position: absolute;
    font-family: "Font Awesome 5 Pro";
    font-size: 10px;
    color: #ffffff;
    top: 46%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
  .blog__comment-agree input:hover {
    cursor: pointer;
  }
  .blog__comment-agree label {
    padding-left: 8px;
    color: #575757;
  }
  .blog__comment-agree label a {
    color: #000;
    font-weight: 600;
    padding-left: 4px;
  }
  .blog__comment-agree label a:hover {
    color: #2467EC;
  }
  .blog__comment-agree label:hover {
    cursor: pointer;
  }

  .blog-main-wrapper .blog-content h3 {
    font-size: 36px;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
    .blog-main-wrapper .blog-content h3 {
      font-size: 30px;
    }
  }
  @media only screen and (min-width: 576px) and (max-width: 767px) {
    .blog-main-wrapper .blog-content h3 {
      font-size: 28px;
    }
  }
  @media (max-width: 575px) {
    .blog-main-wrapper .blog-content h3 {
      font-size: 26px;
    }
  }

  .blog-main-wrapper h4 {
    font-size: 28px;
  }
  @media (max-width: 575px) {
    .blog-main-wrapper h4 {
      font-size: 26px;
    }
  }

  /*----------

  13. skill style

  ----------*/
  .skill-background-img {
    background-position: center;
    background-size: cover;
    border-radius: 5px;
  }

  .skill-wrapper {
    padding: 65px 190px 65px 190px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .skill-wrapper {
      padding: 65px 150px 65px 150px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .skill-wrapper {
      padding: 65px 60px 65px 60px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .skill-wrapper {
      padding: 65px 90px 65px 90px;
    }
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .skill-wrapper {
      padding: 65px 30px 65px 30px;
    }
  }

  .skill-content span {
    color: #ffffff;
    font-size: 18px;
    margin-bottom: 15px;
    display: block;
  }
  .skill-content h3 {
    color: #ffffff;
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 35px;
  }
  @media (max-width: 575px) {
    .skill-content h3 br {
      display: none;
    }
  }
  .skill-content .edu-four-btn:hover {
    color: #141517;
    background: #ffffff;
    border-color: #ffffff;
  }

  .skill-thumb {
    margin-left: 40px;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .skill-thumb {
      margin-left: 0;
      margin-top: 80px;
    }
  }
  .skill-thumb img {
    max-width: 100%;
  }

  .course-price-start {
    background: #FFB013;
    height: 100px;
    width: 100px;
    text-align: center;
    color: #ffffff;
    border-radius: 50%;
    top: -40px;
    left: 10px;
    position: absolute;
    padding-top: 22px;
    font-size: 14px;
  }

  .course-price-start .course-price {
    display: block;
    font-size: 36px;
    font-weight: 900;
  }

  /*----------

  14. eduman-card style

  ----------*/
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
    .university-main-wraper {
      flex-wrap: wrap;
    }
    .university-main-wraper > * {
      flex: 0 0 50%;
    }
  }
  @media (max-width: 575px) {
    .university-main-wraper {
      flex-wrap: wrap;
    }
  }

  .university-card {
    margin-top: -140px;
  }

  .university-course-box {
    padding: 42px 48px 42px 48px;
    background: #2467EC;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .university-course-box {
      padding: 35px 48px 40px 48px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .university-course-box {
      padding: 28px 20px 40px 20px;
    }
  }
  @media only screen and (min-width: 576px) and (max-width: 767px) {
    .university-course-box {
      padding: 35px 20px 40px 19px;
    }
  }
  @media (max-width: 575px) {
    .university-course-box {
      padding: 42px 30px 42px 30px;
      width: 100%;
    }
  }

  .university-main-wraper {
    position: relative;
    z-index: 5;
  }

  .university-card-wrapper {
    padding: 45px 40px 45px 40px;
    background-color: #f6f8fb;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .university-card-wrapper {
      padding: 47px 20px 35px 20px;
    }
  }
  @media (max-width: 575px) {
    .university-card-wrapper {
      padding: 45px 30px 45px 30px;
      width: 100%;
    }
  }

  .university-card-text p {
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 15px;
    display: block;
    line-height: 1;
  }
  .university-card-text span {
    font-weight: 900;
  }
  .university-card-text h3 {
    font-size: 28px;
    font-weight: 500;
    margin-bottom: 32px;
    line-height: 1.3;
    color: #ffffff;
  }

  .university-card-icon {
    width: 65px;
    height: 65px;
    background: #ffffff;
    line-height: 65px;
    text-align: center;
    border-radius: 50%;
    margin-bottom: 30px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }

  .university-card-wrapper:hover .university-card-icon {
    transform: translateY(-10px);
  }

  .university-card-content h3 {
    font-size: 18px;
    margin-bottom: 15px;
    line-height: 1;
  }
  .university-card-content p {
    margin-bottom: 0;
  }

  .message-sticker img {
    padding-left: 22px;
    max-width: 100%;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .message-sticker img {
      padding-left: 0;
    }
  }

  .message-profile-text {
    margin-bottom: 40px;
  }
  .message-profile-text span {
    font-size: 18px;
    font-weight: 600;
    color: #141517;
    margin-bottom: 27px;
    display: block;
  }

  .message-meta {
    display: flex;
    align-items: center;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .message-meta {
      margin-bottom: 50px;
    }
  }

  .message-meta-link {
    margin-left: 20px;
  }
  .message-meta-link h4 {
    line-height: 1;
    margin-bottom: 3px;
    font-size: 18px;
  }
  .message-meta-link p {
    margin-bottom: 0px;
  }

  .feedback-wrapper {
    padding-left: 60px;
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
    .feedback-wrapper {
      padding-left: 0px;
      margin-top: 25px;
    }
  }

  .etablist-price {
    height: 160px;
    width: 160px;
    background: #2467ec;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: absolute;
    bottom: 2%;
    right: 0;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
    .etablist-price {
      left: 250px;
    }
  }
  @media (max-width: 575px) {
    .etablist-price {
      left: 0px;
    }
  }

  .etablist-price p {
    color: #ffffff;
    margin-bottom: 0;
  }
  .etablist-price p span {
    display: block;
    text-align: center;
    font-size: 40px;
    font-weight: 900;
    padding: 5px 0;
    line-height: 1;
  }

  /*----------

  15. campus style

  ----------*/
  .shape-light {
    position: absolute;
    background: #FFB013;
    width: 60px;
    height: 60px;
    text-align: center;
    line-height: 60px;
    border-radius: 50%;
    top: -40px;
    right: 20px;
    animation-duration: 2.5s;
    animation-fill-mode: both;
    animation-iteration-count: infinite;
    animation-name: hero-bounce;
  }

  .campus-shape-content {
    max-width: 290px;
    background: #ffffff;
    padding: 25px 25px;
    border-radius: 5px;
    box-shadow: 0px 40px 50px rgba(24, 44, 74, 0.16);
  }
  .campus-shape-content h5 {
    font-family: "Nunito Sans", sans-serif;
  }
  .campus-shape-content span {
    font-size: 18px;
    color: #141517;
    font-weight: 600;
  }

  .campus-shape-sticker {
    position: absolute;
    bottom: 70px;
    right: 25px;
    z-index: 1;
  }

  .campus-shape-1 {
    position: absolute;
    right: -26%;
    bottom: calc(0% - 70px);
  }

  .campus-shape-2 {
    position: absolute;
    bottom: 16%;
    left: -14%;
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
    .campus-shape-2 {
      left: 0;
    }
  }

  .campus-img-wrapper {
    min-height: 495px;
    margin-top: 56px;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .campus-img-wrapper {
      margin-top: 81px;
    }
  }
  @media (max-width: 575px) {
    .campus-img-wrapper {
      margin-top: 51px;
    }
  }

  .campus-shape-3 {
    position: absolute;
    top: 3%;
    left: 5%;
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
    .campus-shape-3 {
      display: none;
    }
  }

  .campus-img-1 {
    position: absolute;
    top: 140px;
  }

  .campus-img-2 {
    position: absolute;
    top: -5%;
    left: 23%;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .campus-img-2 {
      left: 27%;
    }
  }

  .campus-img-3 {
    position: absolute;
    top: -11%;
    left: 60%;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .campus-img-3 {
      left: 71%;
    }
  }
  @media (max-width: 575px) {
    .campus-img-3 {
      display: none;
    }
  }

  .campus-img-4 {
    position: absolute;
    top: 41%;
    left: 23%;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .campus-img-4 {
      left: 27%;
    }
  }

  .campus-img-5 {
    position: absolute;
    right: -4px;
    top: 23%;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .campus-img-5 {
      right: -18%;
    }
  }

  .compus-content ul li {
    font-size: 16px;
    color: #141517;
    font-weight: 600;
    margin-bottom: 10px;
  }
  .compus-content ul li i {
    margin-right: 10px;
    color: #2467EC;
  }
  .compus-content p {
    margin-bottom: 25px;
  }

  /*----------

  16. event style

  ----------*/
  .event-shape {
    position: absolute;
    right: 13%;
    top: 325px;
  }
  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
    .event-shape {
      right: 6%;
    }
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .event-shape {
      right: 0%;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .event-shape {
      right: 4%;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .event-shape {
      display: none;
    }
  }

  .event-area {
    background-color: #F6F8FB;
  }

  .event-date {
    height: 60px;
    width: 90px;
    background: #FFB013;
    display: flex;
    text-align: center;
    justify-content: center;
    line-height: 60px;
    font-size: 36px;
    font-weight: 700;
    color: #141517;
  }

  .event-month {
    background: #ffffff;
    display: flex;
    height: 40px;
    width: 90px;
    justify-content: center;
    line-height: 40px;
    font-size: 15px;
    color: #141517;
  }

  @media (max-width: 575px) {
    .current-event-box {
      margin-bottom: 30px;
    }
  }

  .current-event-date {
    gap: 10px;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .current-event-date {
      margin-right: -50px;
    }
  }
  @media (max-width: 575px) {
    .current-event-date {
      flex-direction: column;
    }
  }

  .event-tour {
    background: #ffffff;
    border: 1px solid #f6f8fb;
    display: flex;
    justify-content: space-between;
    width: 560px;
    padding: 18px 30px 16px 30px;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
  }
  @media (max-width: 575px) {
    .event-tour {
      padding: 18px 10px 16px 10px;
      width: 100%;
    }
  }

  .event-box-text h3 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 12px;
    line-height: 1;
  }
  .event-box-text span {
    font-size: 14px;
    font-weight: 600;
    margin-right: 20px;
  }
  .event-box-text span i {
    margin-right: 5px;
  }

  .event-arrow {
    color: #7f8a9f;
    height: 45px;
    width: 45px;
    background-color: #F6F8FB;
    text-align: center;
    line-height: 45px;
  }
  .event-arrow:hover {
    color: #ffffff;
    background: #2467EC;
  }

  .feedback-header {
    display: flex;
    margin-bottom: 40px;
    align-items: center;
  }

  .feedback-icon i {
    position: absolute;
    top: 30px;
    right: 30px;
    font-size: 72px;
    color: #ced5e5;
    z-index: -1;
  }

  .feedback-body h3 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 20px;
    color: #2467EC;
  }

  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .feedback-content {
      margin-left: 0px;
    }
  }

  .feedback-items {
    background: #ffffff;
    padding: 30px 30px 30px 30px;
    z-index: 2;
  }

  .feedback-title {
    margin-left: 20px;
  }
  .feedback-title h4 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 3px;
  }

  .gallery-singel-img img {
    max-width: 100%;
  }

  .event_date_inner {
    display: table-cell;
    vertical-align: middle;
    width: 100%;
  }

  .event_date {
    width: 120px;
    height: 120px;
    background: #f8f8f9;
    text-align: center;
    display: table;
    border-radius: 5px;
    padding: 0 10px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .event_date {
      width: 100px;
      height: 100px;
    }
  }

  .aduence-thumb {
    margin-right: 32px;
  }
  .aduence-thumb img {
    box-shadow: 0px 0px 10px rgba(17, 32, 80, 0.14);
    border-radius: 50%;
    margin-right: -16px;
    border: 4px solid #ffffff;
  }

  .event_date_inner h4 {
    font-size: 24px;
    font-weight: 900;
    color: #2467EC;
    font-family: "Nunito Sans", sans-serif;
  }
  .event_date_inner span {
    color: #171717;
  }

  .event_info h3 {
    font-size: 20px;
  }

  .event-time i {
    line-height: 1;
    margin-right: 10px;
  }

  .event-location i {
    margin-right: 10px;
  }

  .event-detalis {
    margin-bottom: 10px;
    flex-wrap: wrap;
  }

  .event-aduence {
    flex-wrap: wrap;
  }

  .event_info {
    flex-grow: 1;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .event_info {
      max-width: 375px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .event_info {
      max-width: 350px;
    }
  }

  .get-ticket-btn {
    margin-right: 15px;
  }

  .single-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 30px;
    border: 1px solid #edeef2;
    padding: 15px 15px;
    background-color: #ffffff;
    border-radius: 3px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .single-item {
      gap: 20px;
    }
  }
  .single-item:hover {
    box-shadow: 0px 30px 40px rgba(28, 51, 84, 0.07);
  }

  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .single-item .event_info {
      order: 2;
    }
  }

  .event-meta-thumb {
    display: flex;
    align-items: center;
  }

  .event-wrapper {
    padding: 30px;
    background: #f8f8f9;
    height: 110px;
    width: 100%;
    border-radius: 4px;
  }

  .event-select .nice-select {
    height: 60px;
    width: 100%;
    line-height: 60px;
    position: relative;
    margin-top: -5px;
    border: 0;
    padding: 0 20px;
  }
  .event-select .nice-select::after {
    height: 8px;
    width: 8px;
    right: 20px;
    color: #141517;
  }
  .event-select .nice-select span {
    font-size: 16px;
    color: #141517;
    font-weight: 600;
  }

  .nice-select.open .list {
    width: 100%;
    color: #141517;
    font-size: 16px;
  }

  .find-event-info h4 {
    margin-bottom: 35px;
  }

  .find-event-input i {
    color: #2467EC;
  }

  .find-event-wrapper {
    position: relative;
  }

  .find-event-input i {
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
  }

  .find-event-input input {
    width: 100%;
    height: 55px;
    padding: 0 20px;
    outline: none;
    border: 0;
    background: #ffffff;
    border-radius: 4px;
  }

  .event-sidebar {
    background-color: #f8f8f9;
    padding: 30px 30px;
    border-radius: 5px;
  }

  .event-contact-info h2 {
    margin-bottom: 30px;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .event-contact-info h2 {
      font-size: 32px;
    }
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .event-contact-info h2 {
      font-size: 24px;
    }
  }

  .introduction-info h4 {
    font-size: 18px;
    margin-bottom: 15px;
  }

  .introduction-info p {
    margin-bottom: 25px;
  }

  .even-point-tittle h4 {
    margin-bottom: 15px;
    font-size: 18px;
  }

  .event-speaker-info h4 {
    font-size: 20px;
    margin-bottom: 35px;
  }

  .event-speaker-wrapper {
    box-shadow: 0px 10px 30px rgba(28, 51, 84, 0.08);
    border: 1px solid #edeef2;
    background-color: #ffffff;
    padding: 28px 29px 28px 29px;
    border-radius: 5px;
    position: relative;
  }

  .event-speaker-content {
    position: absolute;
    bottom: 50px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #ffffff;
    padding: 13px 20px 19px 20px;
    border-radius: 3px;
    min-width: 240px;
  }
  .event-speaker-content span {
    font-size: 16px;
    font-weight: 700;
    color: #141517;
    display: block;
    margin-bottom: 5px;
  }
  .event-speaker-content p {
    margin-bottom: 0px;
    line-height: 1;
  }

  .event-price-info {
    display: flex;
    justify-content: space-between;
  }

  .event-price {
    display: flex;
  }

  .event-information-wrapper {
    padding: 30px 30px 30px 30px;
    box-shadow: 0px 10px 30px rgba(28, 51, 84, 0.08);
    background-color: #ffffff;
    border-radius: 5px;
    border: 1px solid #edeef2;
  }
  @media (max-width: 575px) {
    .event-information-wrapper {
      padding: 30px 20px 30px 20px;
    }
  }

  .event-information-list {
    padding: 30px 0 30px 0px;
  }
  .event-information-list ul li {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #edeef2;
    padding: 10px 0px 10px 0px;
    flex-wrap: wrap;
  }
  .event-information-list ul li:last-child {
    border: none;
    padding-bottom: 5px;
  }
  .event-information-list ul i {
    line-height: 0;
    margin-right: 15px;
  }

  .information-list {
    display: flex;
    align-items: center;
  }
  .information-list:first-child span {
    font-weight: 600;
  }

  .old-price {
    margin-left: 10px;
  }

  .event-price span {
    font-size: 28px;
    font-weight: 900;
    color: #141517;
  }

  .event-ticket-cost span {
    font-weight: 600;
  }

  .event-sponsor-wrapper {
    border: 1px solid #edeef2;
    padding: 30px 30px;
    border-radius: 5px;
    box-shadow: 0px 10px 30px rgba(28, 51, 84, 0.08);
    background-color: #ffffff;
  }

  .sopnsor-tittle h4 {
    margin-bottom: 35px;
  }

  .sponsor-thumb {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 20px;
  }

  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .event-map {
      margin-bottom: 30px;
    }
  }
  .event-map iframe {
    height: 330px;
    width: 100%;
  }

  /*----------

  17. features style

  ----------*/
  .features-area {
    background-position: center;
    background-size: cover;
  }

  .features-img-bg {
    padding: 60px 80px 50px 80px;
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .features-img-bg {
      padding: 25px 20px 25px 20px;
    }
  }

  .features-icon {
    font-size: 55px;
    color: #ffffff;
    margin-right: 25px;
  }
  .features-icon svg {
    margin-right: 27px;
  }

  .features-content {
    max-width: 295px;
  }
  .features-content h3 {
    color: #ffffff;
    font-size: 24px;
  }
  @media (max-width: 575px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .features-content h3 {
      font-size: 20px;
    }
  }

  .features-area.margin-top {
    margin-top: -85px;
  }

  .features-box {
    padding: 0 30px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), (max-width: 575px) {
    .features-box {
      padding: 0 15px;
    }
  }

  .features-svg {
    margin-bottom: 30px;
    transition: 0.3s;
  }

  .features-box:hover .features-svg {
    transform: translateY(-10px);
  }

  .features-text h4 {
    margin-bottom: 20px;
  }

  .features-btn a {
    height: 70px;
    width: 70px;
    background: #ffffff;
    line-height: 70px;
    border-radius: 50%;
    color: #2467EC;
    font-size: 18px;
    animation: pulse 2s infinite;
    text-align: center;
    display: inline-block;
  }

  .features-btn {
    position: relative;
    margin-right: 20px;
  }

  .video-btn-text span {
    color: #ffffff;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
  }
  @media (max-width: 575px) {
    .video-btn-text span {
      font-size: 14px;
    }
  }

  .features-video-area {
    position: relative;
    margin-top: -220px;
  }

  .features-shape-wrapper-1 {
    position: absolute;
    bottom: 9%;
    left: -14%;
    line-height: 18px;
  }
  .features-shape-wrapper-1 span {
    color: #141517;
    font-weight: 700;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .features-shape-wrapper-1 {
      left: -20%;
    }
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .features-shape-wrapper-1 {
      display: none;
    }
  }

  .features-shape {
    position: absolute;
    top: -94px;
    right: 0;
  }

  .features-shape-werapper-2 {
    position: absolute;
    right: -12%;
    top: 25%;
    line-height: 18px;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .features-shape-werapper-2 {
      right: -20%;
    }
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .features-shape-werapper-2 {
      display: none;
    }
  }
  .features-shape-werapper-2 span {
    color: #141517;
    font-weight: 600;
  }
  .features-shape-werapper-2 img {
    position: absolute;
    bottom: -95px;
    right: 38px;
  }

  .features-video-wrapper {
    padding: 20px;
    box-shadow: 0px 20px 40px rgba(24, 44, 74, 0.1);
    background: #ffffff;
    position: relative;
    border-radius: 10px;
  }

  .reatures-video-thumb {
    position: relative;
  }
  .reatures-video-thumb img {
    width: 100%;
  }
  .reatures-video-thumb::before {
    position: absolute;
    content: "";
    background: #020f29;
    opacity: 0.6;
    height: 100%;
    width: 100%;
  }

  .features-video-content {
    display: inline-flex;
    position: absolute;
    top: 50%;
    left: 50%;
    right: 0;
    transform: translate(-50%, -50%);
    align-items: center;
    justify-content: center;
    margin-right: -50%;
  }

  .know-us-wrapper {
    position: relative;
  }

  .know-us-better-thumb {
    position: relative;
  }
  .know-us-better-thumb a::before {
    position: absolute;
    width: 100%;
    height: 100%;
    content: "";
    background: linear-gradient(to top, #020e26 0%, rgba(9, 20, 43, 0) 100%);
    z-index: 1;
  }

  .know-us-text {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    margin-right: -50%;
  }

  .know-us-text h3 {
    color: #ffffff;
    font-size: 20px;
    z-index: 3;
    position: relative;
  }

  .know-us-wrapper {
    overflow: hidden;
    border-radius: 5px;
  }
  .know-us-wrapper img {
    width: 100%;
    transition: all 1.5s cubic-bezier(0, 0, 0.2, 1);
  }

  .know-us-wrapper:hover .know-us-better-thumb img {
    transform: scale3d(1.1, 1.1, 1.1);
  }

  /*----------

  18. course style

  ----------*/
  .course-area {
    background: #F6F8FB;
  }

  .course-shape-1 {
    position: absolute;
    top: 400px;
    left: 6%;
  }

  .course-shape-2 {
    position: absolute;
    right: 4%;
    top: 300px;
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
    .course-shape-2 {
      display: none;
    }
  }

  .course-shape-3 {
    position: absolute;
    right: 13%;
    top: 450px;
  }

  .user-icon {
    margin-bottom: 9px;
  }
  .user-icon a {
    font-size: 16px;
    color: #a7aaaf;
  }
  .user-icon a:hover {
    color: #2467EC;
  }
  .user-icon i {
    margin-right: 8px;
  }

  .course-icon span {
    font-size: 15px;
    font-weight: 600;
    margin-left: 8px;
  }
  .course-icon i {
    font-size: 15px;
  }

  .course-icon i.fas {
    color: #ffb013;
    font-size: 13px;
  }

  .course-icon i.fal {
    color: #ccc;
  }

  .course-cart {
    background: #ffffff;
    padding: 30px 40px;
    box-shadow: 0px 0px 70px rgba(15, 38, 71, 0.2);
    min-width: 380px;
    position: absolute;
    opacity: 0;
    visibility: hidden;
    top: 0;
    right: 0;
    transition: 0.3s;
    z-index: 11;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    left: 50%;
    transform: translateX(-50%);
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
    .course-cart {
      padding: 30px 30px;
      min-width: 340px;
    }
  }
  @media (max-width: 575px) {
    .course-cart {
      display: none;
    }
  }

  .course-info-wrapper h3 {
    font-size: 20px;
    margin-bottom: 5px;
    line-height: 1.3;
  }

  .category-color {
    font-size: 15px;
    font-weight: 600;
    background: #6f19c5;
    padding: 0px 10px;
    color: #ffffff;
    margin-bottom: 15px;
    display: inline-block;
    height: 26px;
    border-radius: 3px;
  }

  .category-color.category-color-1 {
    background: #31bf82;
  }

  .category-color.category-color-2 {
    background: #6931bf;
  }

  .category-color.category-color-3 {
    background: #319dbf;
  }

  .category-color.category-color-4 {
    background: #bf7831;
  }

  .category-color.category-color-5 {
    background: #bf315c;
  }

  .cart-info-body h3:hover {
    color: #2467EC;
  }

  .cart-lavel span {
    color: #2467EC;
    font-size: 15px;
    font-weight: 600;
  }
  .cart-lavel h5 {
    font-size: 15px;
    font-weight: 400;
    font-family: "Nunito Sans", sans-serif;
    color: #575757;
    margin-bottom: 25px;
  }
  .cart-lavel p {
    margin-bottom: 25px;
    font-size: 15px;
  }

  .info-cart-text ul {
    margin-bottom: 30px;
  }
  .info-cart-text ul li {
    margin-bottom: 5px;
  }
  .info-cart-text ul i {
    margin-right: 15px;
    color: #2467EC;
  }

  .course-action {
    display: flex;
    justify-content: space-between;
    gap: 15px;
  }

  .course-action .view-details-btn {
    flex-grow: 1;
  }

  .browser-course-bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.6s;
    object-position: center;
  }

  .browser-course-wrapper:hover .browser-course-bg img {
    transform: scale(1.05);
  }

  .browser-course-wrapper {
    position: relative;
    border-radius: 5px;
    overflow: hidden;
  }

  .browser-course-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
  }

  .course-height {
    min-height: 300px;
    padding: 50px 40px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 4px;
  }
  @media (max-width: 575px) {
    .course-height {
      padding: 50px 25px;
    }
  }

  .browser-course-content {
    position: relative;
    width: 310px;
    z-index: 1;
  }
  @media (max-width: 575px) {
    .browser-course-content {
      width: 260px;
    }
  }
  .browser-course-content span {
    margin-bottom: 10px;
    display: block;
    color: #2467EC;
    font-weight: 700;
  }
  @media (max-width: 575px) {
    .browser-course-content span {
      left: 0;
    }
  }

  .browser-course-tittle a {
    font-size: 24px;
    color: #141517;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 30px;
    display: block;
  }

  .eduman-course-wraper {
    padding: 30px;
    background: #ffffff;
  }

  .my-course-info h3 {
    margin-bottom: 25px;
  }

  .eduman-course-main-wrapper {
    box-shadow: 0px 20px 40px rgba(24, 44, 74, 0.05);
    border-radius: 10px;
    position: relative;
  }

  .eduman-course-img {
    overflow: hidden;
    border-radius: 10px;
  }

  .eduman-course-img img {
    transition: all 1.5s cubic-bezier(0, 0, 0.2, 1);
  }

  .eduman-course-main-wrapper:hover .eduman-course-img img {
    height: 2;
    transform: scale3d(1.05, 1.05, 1.05);
  }

  .eduman-course-main-wrapper:hover .course-cart {
    opacity: 1;
    visibility: visible;
  }

  .eduman-course-thumb {
    border-radius: 10px;
    overflow: hidden;
  }

  .eduman-course-main-wrapper:hover .eduman-course-thumb img {
    transform: scale3d(1.05, 1.05, 1.05);
  }

  .eduman-course-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
  }

  .eduman-course-text h3 {
    font-size: 20px;
    line-height: 1.5;
  }
  .eduman-course-text h3 a:hover {
    color: #2467EC;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), (max-width: 575px), only screen and (min-width: 768px) and (max-width: 991px) {
    .eduman-course-text h3 {
      font-size: 18px;
    }
  }

  .couse-star i {
    color: #FFB013;
    margin-right: 10px;
    font-size: 15px;
  }

  .eduman-course-price {
    margin-bottom: 25px;
  }
  .eduman-course-price span {
    color: #2467EC;
    font-size: 18px;
    font-weight: 800;
    margin-right: 5px;
    margin-bottom: 5px;
  }

  .eduman-course-tutor {
    font-size: 15px;
    font-weight: 600;
  }
  .eduman-course-tutor a:hover {
    color: #2467EC;
  }
  .eduman-course-tutor img {
    margin-right: 10px;
  }

  .eduman-course-footer {
    display: flex;
    justify-content: space-between;
    padding: 10px 30px;
    border-top: 1px solid #edeef2;
    position: relative;
    background-color: #ffffff;
    border-radius: 0px 0px 10px 10px;
  }

  .course-deteals-btn a {
    color: #2467EC;
  }
  .course-deteals-btn a:hover {
    color: #141517;
  }
  .course-deteals-btn a span {
    font-weight: 700;
    font-size: 15px;
  }
  @media (max-width: 575px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .course-deteals-btn a span {
      font-size: 14px;
    }
  }

  .course-lessson-svg span {
    font-size: 15px;
  }
  .course-lessson-svg::before {
    position: absolute;
    height: 100%;
    width: 1px;
    background: #edeef2;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
  }

  .portfolio-button {
    float: right;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
    .portfolio-button {
      margin-top: 0;
      margin-bottom: 30px;
      float: none;
    }
  }

  .portfolio-button button.active {
    color: #141517;
    font-size: 16px;
  }

  .portfolio-button button {
    margin-left: 40px;
    position: relative;
    font-weight: 600;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .portfolio-button button {
      margin-left: 24px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .portfolio-button button {
      margin-left: 0;
      margin-right: 30px;
    }
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .portfolio-button button {
      margin-left: 0px;
      margin-right: 20px;
    }
  }
  .portfolio-button button:hover {
    color: #141517;
  }
  .portfolio-button button span::before {
    position: absolute;
    width: 31px;
    height: 1px;
    content: "";
    background: #FFB013;
    top: 50%;
    left: 35px;
    right: 0;
    border: 0;
    margin: auto;
  }

  .portfolio-active button {
    font-size: 16px;
    margin-left: 40px;
  }

  .port-red {
    position: absolute;
    top: -30px;
    left: 0;
    color: #FFB013;
    font-size: 16px;
    font-weight: 600;
    opacity: 0;
    visibility: visible;
  }
  @media (max-width: 575px) {
    .port-red {
      display: none;
    }
  }

  .portfolio-button button.active .port-red {
    opacity: 1;
    visibility: visible;
  }

  .swiper-pagination-bullet-active {
    width: 27px;
    border-radius: 5px;
  }

  .course-link-color-1 {
    color: #31bf82;
    background: #ebfcf7;
    border-radius: 5px;
    padding: 0 10px;
    height: 25px;
  }

  .course-link-color-2 {
    color: #6931bf;
    background: #f4eeff;
    border-radius: 5px;
    padding: 0 10px;
    height: 25px;
  }

  .course-link-color-3 {
    color: #319dbf;
    background: #ebf8fc;
    border-radius: 5px;
    padding: 0 10px;
    height: 25px;
  }

  .course-link-color-4 {
    color: #bf7831;
    background: #fffaf1;
    border-radius: 5px;
    padding: 0 10px;
    height: 25px;
  }

  .course-link-color-5 {
    color: #bf315c;
    background: #ffeff1;
    border-radius: 5px;
    padding: 0 10px;
    height: 25px;
  }

  .course-link-color-1:hover,
  .course-link-color-2:hover,
  .course-link-color-3:hover,
  .course-link-color-4:hover,
  .course-link-color-5:hover {
    color: #141517;
  }

  .port-border::before {
    position: absolute;
    content: "";
    height: 60px;
    width: 1px;
    background: #edeef2;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
  }

  .academic-courses-area {
    background-color: #f4f6f9;
    z-index: 2;
  }

  .academic-box {
    z-index: 1;
  }

  .academic-thumb {
    overflow: hidden;
  }
  .academic-thumb:hover img {
    transform: scale3d(1.1, 1.1, 1.1);
    overflow: hidden;
  }
  .academic-thumb img {
    transition: all 1.5s cubic-bezier(0, 0, 0.2, 1);
    width: 100%;
  }

  .academic-content {
    padding: 20px 40px 30px 40px;
    box-shadow: 0px 10px 40px rgba(28, 51, 84, 0.07);
    background-color: #ffffff;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .academic-content {
      padding: 20px 25px 30px 25px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px) {
    .academic-content {
      padding: 20px 25px 30px 25px;
    }
  }

  .academic-shape {
    position: absolute;
    bottom: -11%;
    left: -27%;
    z-index: -1;
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
    .academic-shape {
      display: none;
    }
  }

  .academic-shape-2 {
    position: absolute;
    right: 0;
    z-index: -1;
    top: 0px;
  }

  .academic-body {
    margin-bottom: 30px;
  }
  .academic-body p {
    font-size: 15px;
  }

  .academic-content-header h3 {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 15px;
    line-height: 1.5;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .academic-content-header h3 {
      font-size: 20px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .academic-content-header h3 {
      font-size: 20px;
    }
  }
  @media (max-width: 575px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .academic-content-header h3 {
      font-size: 18px;
    }
  }
  .academic-content-header h3:hover {
    color: #2467EC;
  }

  .academic-tutor {
    margin-bottom: 20px;
  }
  .academic-tutor img {
    margin-right: 10px;
  }
  .academic-tutor a {
    font-size: 15px;
    font-weight: 600;
    color: #141517;
  }
  .academic-tutor a:hover {
    color: #2467EC;
  }

  .academic-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    line-height: 1;
    flex-wrap: wrap;
    gap: 15px;
  }
  .academic-footer span {
    font-size: 14px;
    font-weight: 400;
    color: #575757;
  }

  .course-wrapper-2 {
    padding: 0px 0px 0px 0px;
    position: relative;
  }
  .course-wrapper-2:hover .course-cart {
    opacity: 1;
    visibility: visible;
  }
  @media (max-width: 575px) {
    .course-wrapper-2:hover .course-cart {
      opacity: 0;
      visibility: hidden;
    }
  }
  .course-wrapper-2:hover .student-course-img img {
    transform: scale3d(1.1, 1.1, 1.1);
  }

  .student-course-img {
    margin-bottom: 15px;
    overflow: hidden;
    border-radius: 8px;
  }

  .student-course-linkter {
    display: flex;
    margin-bottom: 10px;
    justify-content: space-between;
  }

  .coursee-clock {
    display: flex;
    align-items: center;
  }
  .coursee-clock span {
    font-size: 14px;
  }

  .portfolio-price {
    display: flex;
    align-items: center;
  }
  .portfolio-price span {
    color: #2467EC;
    font-weight: 900;
    font-size: 16px;
    text-transform: uppercase;
  }
  .portfolio-price del {
    margin-left: 10px;
    color: #575757;
    font-weight: 600;
  }

  .portfolio-course-wrapper {
    margin-bottom: 15px;
  }

  .student-course-text h3 {
    font-size: 18px;
    line-height: 28px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .student-course-text h3 {
      font-size: 16px;
    }
  }
  .student-course-text h3 a:hover {
    color: #2467EC;
  }

  .course-creadit {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
  }
  .course-creadit span {
    font-size: 14px;
  }

  .coursee-clock i {
    margin-right: 6px;
    line-height: 1;
  }

  .course-creadit i {
    margin-right: 6px;
    line-height: 1;
  }

  .course-network span {
    font-size: 14px;
  }

  .course-main-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
  }

  .hero-arera.course-item-height {
    min-height: 350px;
    align-items: center;
    display: flex;
    position: relative;
    z-index: 2;
  }
  .hero-arera.course-item-height::before {
    position: absolute;
    content: "";
    height: 100%;
    width: 100%;
    background: #141517;
    opacity: 0.7;
    z-index: -1;
  }

  .bar-secrch-icon input {
    height: 60px;
    padding: 0 40px;
    font-size: 14px;
    color: #141517;
    outline: none;
    border: 1px solid #edeef2;
    min-width: 420px;
    background-color: #ffffff;
    border-radius: 3px;
  }
  @media (max-width: 575px) {
    .bar-secrch-icon input {
      min-width: 100%;
    }
  }
  .bar-secrch-icon input ::placeholder {
    color: #a4a7af;
  }

  .course-tab-btn ul {
    display: flex;
    gap: 10px;
    margin-right: 10px;
  }

  .course-result-number {
    font-weight: 700;
  }

  .course-result-showing {
    font-weight: 700;
  }

  .curse-tab-left-wrap {
    display: flex;
    grid-gap: 10px;
    align-items: center;
    line-height: 1;
    margin: 10px 0;
  }

  .course-result h5 {
    color: #141517;
    margin-bottom: 0;
  }
  .course-result span {
    color: #575757;
  }

  .course-sidebar-wrapper {
    display: flex;
    justify-content: space-between;
    border: 1px solid #edeef2;
    padding: 8px 20px;
    align-items: center;
    border-radius: 3px;
    flex-wrap: wrap;
    gap: 10px;
  }

  .course-sidebar-tab {
    flex-grow: 1;
  }

  .bar-secrch-icon button {
    position: absolute;
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
    color: #a4a7af;
    font-size: 14px;
  }

  .bar-filter {
    border: 1px solid #edeef2;
    padding: 15px 30px;
    display: flex;
    gap: 10px;
    justify-content: space-around;
    align-items: center;
    border-radius: 3px;
  }
  .bar-filter span {
    color: #141517;
    font-weight: 600;
    margin-right: 5px;
  }
  .bar-filter i {
    line-height: 0;
    font-size: 19px;
    color: #141517;
  }

  .course-sidebar-info ul li {
    margin-bottom: 10px;
  }

  .course-drop-inner .nice-select {
    float: none;
    display: inline-block;
    float: none;
    background: #f7f7f9;
    border: 0;
    width: 180px;
    height: 40px;
  }
  .course-drop-inner .nice-select::after {
    width: 7px;
    height: 7px;
    border-color: #575757;
  }

  .course-drop-inner .nice-select span {
    color: #575757;
  }

  .course-sidebar-info {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 30px;
  }
  .course-sidebar-info::after {
    position: absolute;
    top: 0;
    right: 0;
    content: "";
    font-family: "Font Awesome 5 Pro";
    color: #575757;
    cursor: pointer;
    transform: rotate(-180deg);
  }

  .edu-check-star i.fal {
    color: #ccc;
    font-size: 15px;
  }

  .edu-check-star i.fas {
    color: #ffb013;
    font-size: 13px;
  }

  .course-sidebar-widget {
    border: 1px solid #edeef2;
    padding: 28px 30px 20px 30px;
    background: #ffffff;
    border-radius: 5px;
    margin-bottom: 20px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .course-sidebar-widget {
      padding: 28px 20px 20px 20px;
    }
  }

  .course-sidebar-info h3 {
    font-size: 20px;
    font-weight: 700;
    cursor: pointer;
    position: relative;
    z-index: 1;
  }

  .edu-pagination ul {
    display: flex;
    align-items: center;
  }
  .edu-pagination li {
    margin-right: 15px;
  }
  .edu-pagination li:hover a {
    color: #2467EC;
    font-weight: 600;
  }
  .edu-pagination i {
    height: 45px;
    width: 45px;
    background: #ffffff;
    line-height: 43px;
    text-align: center;
    border-radius: 50%;
    color: #575757;
    font-size: 20px;
    border: 1px solid #edeef2;
    font-weight: 400;
    transition: 0.3s;
  }
  .edu-pagination i:hover {
    border-color: #2467EC;
    background: #2467EC;
    color: #ffffff;
  }

  .edu-pagination ul li.active a {
    color: #2467EC;
    font-weight: 600;
  }

  .course-sidebar-list input[type=checkbox] {
    border: 1px solid #edeef2;
    border-radius: 2px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 18px;
    height: 18px;
    cursor: pointer;
    position: relative;
    top: 5px;
    font-size: 15px;
    margin-right: 8px;
  }

  .course-sidebar-list input[type=checkbox]:checked {
    border: none;
    background-color: #2467EC;
    color: #ffffff;
  }

  .course-sidebar-list input[type=checkbox]:checked::before {
    position: absolute;
    content: "";
    font-family: "Font Awesome 5 Pro";
    line-height: 16px;
    top: 0;
    left: 2px;
  }

  .course-sidebar-list input[type=radio] {
    border: 1px solid #edeef2;
    border-radius: 9px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 18px;
    height: 18px;
    cursor: pointer;
    position: relative;
    top: 5px;
    font-size: 15px;
    margin-right: 8px;
  }

  .course-sidebar-list input[type=radio]:checked::before {
    position: absolute;
    content: "";
    font-family: "Font Awesome 5 Pro";
    top: 4px;
    left: 4px;
    height: 8px;
    width: 8px;
    background: #2467EC;
    border-radius: 50%;
  }

  .edu-check-label {
    cursor: pointer;
  }

  .protfolio-course-2-wrapper {
    box-shadow: 0px 10px 30px rgba(24, 44, 74, 0.07);
    background: #ffffff;
    position: relative;

  }

  .protfolio-course-2-wrapper:hover .course-cart {
    opacity: 1;
    visibility: visible;
  }
  @media (max-width: 575px) {
    .protfolio-course-2-wrapper:hover .course-cart {
      opacity: 0;
      visibility: hidden;
    }
  }
  .protfolio-course-2-wrapper:hover .student-course-img img {
    transform: scale3d(1.1, 1.1, 1.1);
  }

  .student-course-img img {
    width: 100%;
  }

  .portfolio-course-2 {
    padding: 5px 0;
  }

  .portfolio-course-2 h3 {
    font-size: 17px;
    line-height: 27px;
  }

  .portfolio-course-2-content {
    padding: 0 20px;
  }

  .course-2-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 20px;
    border-top: 1px solid #edeef2;
    line-height: 1;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .course-2-footer i {
      font-size: 14px;
      margin-right: 4px;
    }
  }

  .course-detalis-area {
    margin-top: -60px;
    position: relative;
    z-index: 5;
  }
  @media (max-width: 575px) {
    .course-detalis-area {
      margin-top: 0;
      padding-top: 110px;
    }
  }

  .course-detalis-wrapper {
    padding: 40px 30px 0 30px;
    background: #ffffff;
    border-radius: 5px;
  }
  @media (max-width: 575px) {
    .course-detalis-wrapper {
      padding: 0;
    }
  }

  .course-heading h2 {
    margin-bottom: 15px;
    font-size: 36px;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .course-heading h2 {
      font-size: 32px;
    }
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .course-heading h2 {
      font-size: 24px;
    }
  }

  .course-star {
    display: flex;
  }
  .course-star span {
    margin-left: 10px;
    color: #575757;
    font-size: 15px;
    font-weight: 600;
  }
  .course-star ul li {
    margin-right: 5px;
  }
  .course-star ul i {
    font-size: 13px;
  }
  .course-star ul i.fas {
    color: #FFB013;
  }
  .course-star ul i.fal {
    color: #ccc;
  }

  .course-meta-wrapper {
    display: flex;
    align-items: center;
  }

  .course-meta-text {
    margin-left: 15px;
  }
  .course-meta-text span {
    display: block;
    font-size: 14px;
  }

  .course-meta-img img {
    width: 50px;
    height: 50px;
    border: 3px solid #ffffff;
    box-shadow: 0px 3px 10px rgba(17, 32, 81, 0.08);
    border-radius: 50%;
  }

  .course-detelis-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: space-between;
    padding: 20px 0 20px 0;
    border-top: 1px solid #edeef2;
    border-bottom: 1px solid #edeef2;
    align-items: center;
  }

  .course-leranm-tittle h3 {
    margin-bottom: 15px;
  }

  .course-Enroll span {
    display: block;
    font-weight: 700;
    color: #141517;
  }
  .course-Enroll p {
    font-size: 14px;
    margin-bottom: 0px;
  }

  .course-update span {
    display: block;
    font-weight: 700;
    color: #141517;
  }
  .course-update p {
    font-size: 14px;
    margin-bottom: 0px;
  }

  .course-category span {
    display: block;
    font-weight: 700;
    color: #141517;
  }
  .course-category p {
    font-size: 14px;
    margin-bottom: 0px;
  }

  .border-line-meta {
    position: relative;
  }
  .border-line-meta:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 40px;
    background: #edeef2;
    right: -45px;
    top: 10px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .border-line-meta:before {
      right: -35px;
      top: 6px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .border-line-meta:before {
      right: -70px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .border-line-meta:before {
      right: -25px;
    }
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
    .border-line-meta:before {
      display: none;
    }
  }

  .course-learn-wrapper {
    padding: 30px 30px 10px;
    background: #f5f8ff;
    border: 1px solid #edeef2;
    border-radius: 5px;
  }

  .course-requirements h4 {
    margin-bottom: 20px;
  }

  .course-curriculam h4 {
    margin-bottom: 20px;
  }

  .course-leran-text ul li {
    position: relative;
    padding-left: 26px;
    margin-bottom: 15px;
  }
  .course-leran-text ul li::before {
    position: absolute;
    content: "";
    font-family: "Font Awesome 5 Pro";
    left: 0px;
    color: #2467EC;
  }

  .instructors-heading {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 15px;
    gap: 20px;
  }
  .instructors-heading .instructors-img {
    width: 100px;
  }

  .course-instructors {
    padding: 25px 30px 25px 30px;
    background: #fcfdff;
    border: 1px solid #edeef2;
    border-radius: 5px;
  }

  .instructors-img img {
    margin-bottom: 5px;
  }

  .course-instructors h3 {
    margin-bottom: 20px;
    text-transform: capitalize;
  }

  .intructors-content p {
    margin-bottom: 0;
  }

  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
    .instructors-body {
      margin-bottom: 10px;
    }
  }
  .instructors-body h5 {
    margin-bottom: 0px;
  }

  .intructors-review {
    padding: 4px 0 10px;
  }
  .intructors-review i {
    color: #FFB013;
    font-size: 13px;
  }

  .instructors-footer span {
    margin-right: 25px;
  }
  .instructors-footer i {
    margin-right: 5px;
  }

  .student-feedback h3 {
    margin-bottom: 25px;
    font-size: 20px;
  }

  .rating-point-wrapper {
    padding: 20px 20px 20px 20px;
    border: 1px solid #edeef2;
    border-radius: 5px;
  }

  .rating-star i {
    color: #FFB013;
    font-size: 15px;
  }
  .rating-star i.fal {
    color: #ccc;
  }

  .rating-point-wrapper h2 {
    color: #FFB013;
    font-size: 65px;
    font-weight: 700;
    line-height: 1;
    margin-bottom: 15px;
  }

  .reating-icon i {
    color: #FFB013;
  }

  .rating-point-wrapper span {
    font-weight: 600;
  }

  .course-detalis-reviews-tittle h3 {
    margin-bottom: 25px;
  }

  .course-review-item {
    display: flex;
    align-items: normal;
  }

  .course-review-list {
    margin-left: 20px;
  }
  .course-review-list span {
    color: #141517;
    margin-left: 10px;
    font-size: 14px;
    font-weight: 400;
  }

  .course-start-icon {
    margin-bottom: 10px;
  }
  .course-start-icon i {
    color: #FFB013;
    font-size: 13px;
  }

  .course-video-thumb {
    position: relative;
    margin-bottom: 30px;
  }

  .sidber-video-btn a {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    content: "";
    bottom: 0;
    height: 70px;
    width: 70px;
    background: #ffffff;
    line-height: 70px;
    text-align: center;
    border-radius: 50%;
    font-size: 16px;
    color: #df2020;
    animation: pulse 2s infinite;
  }

  .course-widget-wrapper {
    padding: 30px 30px 30px 30px;
    box-shadow: 0px 10px 30px rgba(28, 51, 84, 0.08);
    border: 1px solid #edeef2;
    background-color: #ffffff;
    border-radius: 5px;
  }

  .course-vide-icon {
    display: flex;
    align-items: center;
  }
  .course-vide-icon i {
    line-height: 1;
    margin-right: 15px;
  }

  .course-video-body ul li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 15px;
  }

  .course-video-price span {
    font-size: 30px;
    color: #141517;
    font-weight: 900;
  }

  .course-video-body {
    padding: 40px 0 45px 0;
  }

  .course-video-body ul li {
    padding-bottom: 12px;
    border-bottom: 1px solid #edeef2;
    margin-bottom: 12px;
    line-height: 1;
  }
  .course-video-body ul li:last-child {
    border-bottom: 0;
    padding-bottom: 0;
    margin-bottom: 0;
  }

  .course-gift {
    display: flex;
    justify-content: center;
    gap: 40px;
  }

  .video-wishlist {
    margin-bottom: 30px;
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
  }

  .course-apply-coupon a {
    color: #2467EC;
    font-weight: 700;
  }
  .course-apply-coupon a:hover {
    color: #FFB013;
  }

  .course-apply-coupon {
    position: relative;
  }
  .course-apply-coupon:hover::before {
    background-color: #FFB013;
  }
  .course-apply-coupon:before {
    position: absolute;
    content: "";
    height: 1px;
    width: 100%;
    background: #2467EC;
    bottom: 0;
  }

  .course-gift-coupon {
    position: relative;
  }
  .course-gift-coupon:hover::before {
    background-color: #2467EC;
  }
  .course-gift-coupon:before {
    position: absolute;
    content: "";
    height: 1px;
    width: 100%;
    background: #161b1c;
    bottom: 0;
  }

  .course-gift-coupon a {
    color: #141517;
    font-weight: 700;
  }
  .course-gift-coupon a:hover {
    color: #2467EC;
  }

  .course-curriculum-info h4 {
    display: inline-block;
    margin-left: 10px;
  }

  .course-curriculam-accodion .accordion-body {
    padding: 0;
    border: 0;
    color: #c1c7d2;
  }

  .course-curriculam-accodion .accordion-button:before {
    content: "";
    font-family: "Font Awesome 5 Pro";
    color: #575757;
    background: none;
    flex-shrink: 0;
    margin-right: 10px;
  }

  .course-curriculam-accodion .accordion-button:not(.collapsed):before {
    content: "";
    font-family: "Font Awesome 5 Pro";
    color: #575757;
    background: none;
    flex-shrink: 0;
    transform: rotate(180deg);
  }

  .course-curriculam-accodion .accordion-button::after {
    display: none;
    transform: rotate(180deg);
  }

  .course-curriculam-accodion .course-curriculum-content {
    padding: 10px 20px;
    border: 0;
  }

  .course-curriculam-accodion .accordion-button:focus {
    z-index: 3;
    border: 1px solid #edeef2;
    outline: none;
    box-shadow: none;
    background: #ffffff;
  }

  .course-curriculam-accodion .accordion-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
  }
  @media (max-width: 575px) {
    .course-curriculam-accodion .accordion-header {
      flex-direction: column;
      align-items: self-start;
      gap: 5px;
    }
  }

  .course-curriculam-accodion .accordion-header span {
    color: #141517;
    font-size: 16px;
    font-weight: 600;
    font-family: "Raleway", sans-serif;
    text-align: left;
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
    .course-curriculam-accodion .accordion-header span {
      font-size: 15px;
    }
  }

  .course-curriculam-accodion .accordion-button:not(.collapsed) {
    color: #0c63e4;
    background-color: #ffffff;
  }

  .course-curriculam-accodion .accordion-tittle h5 {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 0;
  }

  .course-curriculam-accodion .accordion-tittle-inner span {
    color: #141517;
    font-weight: 600;
    font-family: "Raleway", sans-serif;
  }

  .course-curriculam-accodion .course-curriculum-info {
    display: flex;
    align-items: center;
  }
  @media (max-width: 575px) {
    .course-curriculam-accodion .course-curriculum-info {
      margin-bottom: 10px;
    }
  }
  .course-curriculam-accodion .course-curriculum-info h4 {
    color: #575757;
    font-size: 15px;
    font-family: "Nunito Sans", sans-serif;
    font-weight: 400;
  }

  .course-curriculam-accodion .course-curriculum-meta {
    display: flex;
    align-items: center;
    line-height: 0;
    gap: 10px;
  }

  .rating-row {
    display: flex;
    gap: 30px;
    justify-content: space-between;
    align-items: center;
  }

  .rating-row .progress {
    flex-grow: 1;
  }

  .student-reating-bar .progress {
    display: flex;
    height: 6px;
    overflow: hidden;
    font-size: 0.75rem;
    background-color: #e9ecef;
    border-radius: 0.25rem;
  }

  #review-box {
    display: none;
  }

  /*----------

  19. instructor style

  ----------*/
  .step-journey-box {
    padding-left: 190px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .step-journey-box {
      padding-left: 150px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .step-journey-box {
      padding-left: 60px;
    }
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
    .step-journey-box {
      padding-left: 0;
    }
  }

  .step-journey-content h4 {
    margin-bottom: 15px;
    font-size: 18px;
  }

  .nav-tabs.step-journey {
    border-bottom: 1px solid #edeef2;
  }

  .nav-tabs.step-journey .nav-link {
    font-size: 20px;
    color: #7e7e7e;
    padding-bottom: 10px;
    font-weight: 500;
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
    .nav-tabs.step-journey .nav-link {
      margin-bottom: 15px;
    }
  }

  .nav-tabs.step-journey .nav-item.show .nav-link,
  .nav-tabs .nav-link.active {
    color: #141517;
    font-weight: 500;
  }

  .step-journey .nav-link {
    position: relative;
    margin-bottom: -1px;
    border: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    padding: 0 0;
    margin-right: 50px;
  }

  .step-journey .nav-link:before {
    position: absolute;
    height: 3px;
    width: 100%;
    background: #2467EC;
    content: "";
    left: 0;
    opacity: 0;
    bottom: 0;
    opacity: 0;
    visibility: hidden;
  }

  .step-journey .nav-link.active::before {
    opacity: 1;
    visibility: visible;
  }

  .step-journey .nav-link::after {
    position: absolute;
    width: 13px;
    height: 5px;
    background: #2467EC;
    content: "";
    bottom: -5px;
    left: 0;
    right: 0;
    margin: auto;
    clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
    opacity: 0;
    visibility: hidden;
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
    .step-journey .nav-link::after {
      display: none;
    }
  }

  .step-journey .nav-link.active::after {
    opacity: 1;
    visibility: visible;
  }

  .srep-journey-content {
    margin-bottom: 25px;
  }
  .srep-journey-content h4 {
    font-size: 18px;
    margin-bottom: 15px;
  }

  .step-journey-thumb {
    padding-left: 50px;
  }
  .step-journey-thumb img {
    max-width: 100%;
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
    .step-journey-thumb {
      padding-left: 0;
    }
  }

  .become-intructor-area {
    background-color: #f4f6f9;
  }

  .become-intructor-text h2 {
    font-size: 36px;
    margin-bottom: 30px;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .become-intructor-text h2 {
      font-size: 32px;
    }
  }
  @media only screen and (min-width: 576px) and (max-width: 767px) {
    .become-intructor-text h2 {
      font-size: 28px;
    }
  }
  @media (max-width: 575px) {
    .become-intructor-text h2 {
      font-size: 26px;
    }
  }
  .become-intructor-text p {
    margin-bottom: 40px;
  }

  .member-social ul {
    display: flex;
    gap: 10px;
    justify-content: center;
  }
  .member-social ul li {
    display: inline-block;
  }
  .member-social ul li a {
    display: inline-block;
    width: 36px;
    height: 36px;
    line-height: 36px;
    font-size: 13px;
    text-align: center;
    border: 1px solid #edeef2;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    color: #a6b9cc;
    -webkit-transform: 0.3s;
    -moz-transform: 0.3s;
    -ms-transform: 0.3s;
    transform: 0.3s;
  }
  .member-social ul li a:hover {
    background: #2467EC;
    border-color: #2467EC;
    color: #ffffff;
  }

  .member-main-wrapper {
    box-shadow: 0px 10px 40px rgba(28, 51, 84, 0.08);
    background-color: transparent;
    border-radius: 8px;
    border: 1px solid #edeef2;
  }

  .member-item .member-thumb {
    margin-bottom: 20px;
    width: 150px;
    height: 150px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    border-radius: 50%;
  }

  .member-thumb img {
    transition: all 1.5s cubic-bezier(0, 0, 0.2, 1);
  }

  .member-item:hover .member-thumb img {
    transform: scale3d(1.1, 1.1, 1.1);
  }

  .member-content span {
    margin-bottom: 20px;
    display: block;
    font-weight: 400;
  }
  .member-content h4 {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 5px;
  }

  .member-body {
    border-bottom: 1px solid #edeef2;
  }

  .member-item {
    padding: 30px 30px 30px 30px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .member-item {
      padding: 30px 20px 30px 20px;
    }
  }

  .member-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 30px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .member-meta {
      padding: 10px 15px;
      flex-wrap: wrap;
    }
  }

  .member-reating i {
    margin-right: 6px;
    color: #FFB013;
    font-size: 13px;
  }

  .member-course i {
    margin-right: 10px;
    font-size: 15px;
  }

  .course-detiles-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #edeef2;
    border-bottom: 1px solid #edeef2;
    padding: 18px 0;
    flex-wrap: wrap;
    gap: 30px;
  }

  .course-instructors-img img {
    max-width: 100%;
  }

  .course-detiles-tittle h3 {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 0;
  }

  .total-course {
    position: relative;
  }
  .total-course span {
    display: block;
    margin-bottom: -5px;
  }
  .total-course:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 42px;
    background: #edeef2;
    right: -65%;
    top: 5px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .total-course:before {
      right: -40%;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
    .total-course:before {
      right: -35%;
    }
  }
  @media (max-width: 575px) {
    .total-course:before {
      display: none;
    }
  }

  .student.course {
    position: relative;
  }
  .student.course label {
    color: #141517;
    font-size: 18px;
    font-weight: 700;
  }
  .student.course:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 40px;
    background: #edeef2;
    right: -90%;
    top: 5px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .student.course:before {
      right: -65%;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
    .student.course:before {
      right: -50%;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
    .student.course:before {
      right: -40%;
    }
  }
  @media (max-width: 575px) {
    .student.course:before {
      display: none;
    }
  }

  .share-btn i {
    color: #141517;
  }

  .student.course span {
    display: block;
    margin-bottom: -5px;
  }

  .total-course label {
    font-size: 18px;
    font-weight: 700;
    color: #141517;
  }

  .review-course-inner ul li i {
    margin-right: 6px;
    color: #FFB013;
    font-size: 13px;
  }

  .review-course-inner p {
    color: #141517;
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 0px;
  }

  .course-bio-text h3 {
    font-size: 20px;
    margin-bottom: 15px;
  }

  /*----------

  20. about style

  ----------*/
  .about-shape {
    position: absolute;
    top: 15%;
    right: 2%;
  }
  @media (max-width: 575px), only screen and (min-width: 768px) and (max-width: 991px) {
    .about-shape {
      display: none;
    }
  }

  .about-shape-1 {
    position: absolute;
    top: 0;
    left: 0;
  }

  .about-shape-2 {
    position: absolute;
    top: 5%;
    left: 6%;
    z-index: -11;
  }

  .about-shape-3 {
    position: absolute;
    top: 5%;
    left: -30px;
    z-index: -11;
  }

  .about-main-img {
    padding-left: 108px;
  }

  .about-img img {
    max-width: 100%;
  }

  .affiliates-wrapper {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 60px 140px;
  }

  .content-error-area {
    border-top: 1px solid #edeef2;
  }

  .error-thumb img {
    margin-bottom: 40px;
    max-width: 100%;
  }

  .error-btn {
    margin-top: 35px;
  }

  .rating-star i {
    color: #ccc;
  }

  .rating-star i {
    font-size: 13px;
  }
  .rating-star i.fas {
    color: #FFB013;
  }

  .know-us-border {
    border-top: 1px solid #edeef2;
  }

  .signin-area-wrapper {
    display: flex;
  }

  .sign-up-wrapper {
    display: flex;
  }

  .signup-wrapper input {
    width: 100%;
    height: 55px;
    background: #f5f5f5;
    border: 0;
    border-radius: 4px;
    margin-bottom: 30px;
    display: flex;
    padding: 10px 20px;
    outline: none;
    color: #575757;
    font-size: 16px;
  }

  .signup-input-wrapper {
    display: flex;
    justify-content: space-between;
    gap: 20px;
  }

  .signup-input-wrapper input {
    width: 100%;
    height: 55px;
    background: #f5f5f5;
    border: 0;
    border-radius: 4px;
    margin-bottom: 30px;
    display: flex;
    padding: 10px 20px;
    outline: none;
    color: #575757;
    font-size: 16px;
  }

  .sign-check a {
    color: #2467EC;
    font-weight: 700;
    text-decoration: underline;
  }
  .sign-check a:hover {
    color: #141517;
  }

  .signup-box {
    background: #f5f5f5;
    padding: 45px 30px;
  }

  .signup-thumb img {
    max-width: 100%;
  }

  .signup-form-wrapper {
    padding: 45px 30px;
    background: #ffffff;
  }

  .signup-action {
    margin-bottom: 25px;
  }

  .sing-buttom {
    height: 55px;
    background: #2467EC;
    text-align: center;
    line-height: 55px;
    color: #ffffff;
    border-radius: 4px;
    font-size: 16px;
    font-weight: 600;
    transition: 0.3s;
  }
  .sing-buttom:hover {
    color: #141517;
    background: #FFB013;
  }

  .registered.wrapper {
    display: flex;
    justify-content: space-around;
    margin-bottom: 20px;
    flex-wrap: wrap;
  }

  .forget-password a:hover {
    color: #141517;
  }

  .not-register a:hover {
    color: #141517;
  }

  .acount-login {
    margin-bottom: 30px;
  }
  .acount-login a {
    font-weight: 600;
    color: #2467EC;
    margin-left: 5px;
    text-decoration: underline;
  }
  .acount-login a:hover {
    color: #141517;
  }

  .sign-social {
    position: relative;
    z-index: 2;
    margin-bottom: 25px;
  }
  .sign-social span {
    background: #ffffff;
    display: inline-block;
    padding: 0 10px;
  }
  .sign-social:before {
    position: absolute;
    height: 1px;
    background: #edeef2;
    content: "";
    width: 100%;
    top: 15px;
    left: 0;
    z-index: -1;
  }

  .sign-social-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 19px;
  }

  .signup-text h3 {
    font-size: 28px;
    margin-bottom: 106px;
  }

  .signup-message img {
    max-width: 100%;
    margin-bottom: 5px;
  }

  .not-register a {
    font-weight: 600;
    color: #2467EC;
    text-decoration: revert;
    margin-left: 5px;
  }

  .sign-gmail {
    border: 1px solid #edeef2;
    padding: 10px 20px;
    border-radius: 4px;
  }
  .sign-gmail a {
    font-weight: 600;
  }
  .sign-gmail a:hover {
    color: #141517;
  }

  .sign-facebook {
    border: 1px solid #edeef2;
    padding: 10px 20px;
    border-radius: 4px;
  }
  .sign-facebook a {
    font-weight: 600;
  }
  .sign-facebook a:hover {
    color: #141517;
  }

  .signin-area {
    position: fixed;
    z-index: 99999;
    top: 60px;
    margin: 0 auto;
    left: 0;
    right: 0;
    display: none;
    max-width: 900px;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .signin-area {
      max-width: 360px;
    }
  }

  .signin-area.open {
    display: inline-block;
  }

  .signin-area-wrapper > :nth-child(2) {
    flex: 0 0 calc(100% - 360px);
  }

  @media (min-width: 992px) and (max-width: 1199px) {
    .signin-area-wrapper > *:nth-child(1) {
      flex: 0 0 360px;
    }

    .signin-area-wrapper > :nth-child(2) {
      flex: 0 0 calc(100% - 360px);
    }
  }
  @media (min-width: 768px) and (max-width: 991px) {
    .signin-area-wrapper {
      max-width: 750px;
      max-height: 530px;
      transform: none;
      overflow: auto;
      overflow-y: auto;
      display: inline-block;
    }

    .signin-area.open {
      display: flex;
      justify-content: center;
    }

    .signin-area-wrapper > * {
      flex: 0 0 100% !important;
    }
  }
  @media (max-width: 767px) {
    .signin-area-wrapper {
      max-width: 750px;
      max-height: 530px;
      transform: none;
      overflow: auto;
      overflow-y: auto;
      display: inline-block;
    }

    .signin-area.open {
      display: flex;
      justify-content: center;
    }

    .signin-area-wrapper > * {
      flex: 0 0 100% !important;
    }
  }
  .signup-area {
    position: fixed;
    z-index: 99999;
    top: 60px;
    margin: 0 auto;
    left: 0;
    right: 0;
    display: none;
    max-width: 900px;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .signup-area {
      max-width: 360px;
    }
  }

  .signup-area.open {
    display: inline-block;
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
    .signup-area.open {
      display: flex;
      justify-content: center;
    }
  }

  .sign-up-wrapper > :nth-child(2) {
    flex: 0 0 calc(100% - 360px);
  }

  @media (min-width: 992px) and (max-width: 1199px) {
    .sign-up-wrapper > *:nth-child(1) {
      flex: 0 0 360px;
    }

    .sign-up-wrapper > :nth-child(2) {
      flex: 0 0 calc(100% - 360px);
    }
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
    .sign-up-wrapper {
      display: flex;
      max-width: 750px;
      max-height: 530px;
      transform: none;
      overflow: auto;
      overflow-y: auto;
      overflow-y: auto;
      display: inline-block;
    }
  }

  /*----------

  21. banner style

  ----------*/
  .banner-area {
    background: #edeff5;
    min-height: 450px;
    position: relative;
    display: flex;
    align-items: center;
  }

  .banner-img {
    position: absolute;
    bottom: 0;
    right: 0;
  }

  @media (max-width: 575px) {
    .faq .banner-img {
      display: none;
    }
  }

  .banner-search-box {
    position: relative;
  }

  .banner-tittle h2 {
    margin-bottom: 45px;
  }
  @media (max-width: 575px) {
    .banner-tittle h2 {
      font-size: 28px;
    }
  }

  .slider-faq-search input {
    height: 70px;
    width: 100%;
    background: #ffffff;
    border: 1px solid #edeef2;
    border-radius: 5px;
    box-shadow: 0px 5px 10px rgba(15, 32, 91, 0.07);
    padding: 0 20px;
    position: relative;
    color: #707070;
    font-size: 14px;
    outline: none;
    text-transform: capitalize;
  }
  .slider-faq-search input::placeholder {
    color: #a5a5a5;
  }

  .slider-faq-search button {
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translatey(-50%);
    font-size: 16px;
    color: #c1c5ce;
  }

  .breadcrumb-item.active {
    color: #ffffff;
  }

  .breadcrumb-item a {
    color: #ffffff;
  }
  .breadcrumb-item a:hover {
    color: #ffffff;
  }

  .breadcrumb-item + .breadcrumb-item::before {
    float: left;
    padding-right: 0.5rem;
    content: "";
    font-family: "Font Awesome 5 Pro";
    color: #ffffff;
  }

  .breadcrumb-item span {
    color: #fff;
  }

  .course-title-breadcrumb.breadcrumb-top {
    margin-top: -90px;
  }

  .breadcrumb-item.white-color a {
    color: #141517;
  }

  .breadcrumb-item.white-color::before {
    color: #141517;
  }

  .banner-tiitle-wrapper {
    max-width: 650px;
    margin-right: auto;
    margin-left: auto;
    position: relative;
    z-index: 1;
  }

  /*----------

  22. shop style

  ----------*/
  .product-img {
    margin-bottom: 25px;
    overflow: hidden;
    position: relative;
  }
  .product-img img {
    width: 100%;
    transition: all 1.5s cubic-bezier(0, 0, 0.2, 1);
  }

  .product-items {
    overflow: hidden;
  }

  .product-items:hover .product-img img {
    transform: scale3d(1.1, 1.1, 1.1);
  }

  .product-content h4 {
    font-size: 16px;
    margin-bottom: 5px;
  }

  .product-content span {
    color: #141517;
    font-size: 14px;
    font-weight: 700;
    display: inline-block;
    margin-bottom: 5px;
  }

  .shop-old-price {
    font-size: 14px;
    margin-left: 10px;
  }

  .products-wrapper {
    display: flex;
    flex-wrap: wrap;
    column-gap: 40px;
    row-gap: 40px;
    margin-left: 40px;
    margin-bottom: 20px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .products-wrapper {
      margin-left: 30px;
      column-gap: 30px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
    .products-wrapper {
      column-gap: 30px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .products-wrapper {
      margin-left: 0;
    }
  }
  @media only screen and (min-width: 400px) and (max-width: 575px) {
    .products-wrapper {
      column-gap: 20px;
    }
  }

  .products-wrapper > div {
    width: calc((100% - 120px) / 4);
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .products-wrapper > div {
      width: calc((100% - 90px) / 4);
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
    .products-wrapper > div {
      width: calc((100% - 60px) / 3);
    }
  }
  @media only screen and (min-width: 576px) and (max-width: 767px) {
    .products-wrapper > div {
      width: calc((100% - 40px) / 2);
    }
  }
  @media (max-width: 575px) {
    .products-wrapper > div {
      width: calc((100% - 0px) / 1);
    }
  }
  @media only screen and (min-width: 400px) and (max-width: 575px) {
    .products-wrapper > div {
      width: calc((100% - 20px) / 2);
    }
  }

  .shop-quick-view {
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
    position: absolute;
    bottom: 25px;
    left: 0;
    right: 0;
    margin: 0 auto;
    transition: 0.3s;
  }
  .shop-quick-view ul {
    display: flex;
    gap: 10px;
    justify-content: center;
  }
  .shop-quick-view ul li a {
    display: inline-block;
    width: 43px;
    height: 42px;
    line-height: 42px;
    text-align: center;
    background-color: #ffffff;
    border-radius: 50%;
    transition: 0.3s;
  }
  .shop-quick-view ul li a:hover {
    background: #2467EC;
    color: #ffffff;
  }
  .shop-quick-view ul li a:hover i {
    color: #ffffff;
  }
  .shop-quick-view ul li a i {
    color: #707070;
    font-size: 16px;
    transition: 0.3s;
  }

  .product-items:hover .shop-quick-view {
    opacity: 1;
    visibility: visible;
  }

  /*.cart-area .table-content table {
    background: #ffffff;
    border-color: #edeef2;
    border-radius: 0;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    text-align: center;
    width: 100%;
    margin-bottom: 0;
  }*/
  .cart-area .table-content .product-quantity {
    float: none;
  }
  .cart-area .table-content table td.product-name {
    font-size: 16px;
    font-weight: 400;
    text-transform: capitalize;
  }
  .cart-area .table > :not(:last-child) > :last-child > * {
    border-bottom-color: #edeef2;
  }
  .cart-area .table-content table td.product-name a:hover {
    color: #000;
  }
  .cart-area .table-content table td {
    border-top: medium none;
    padding: 15px 5px;
    vertical-align: middle;
    font-size: 16px;
  }
  .cart-area .table-content table th,
  .cart-area .table-content table td {
    border-bottom: 1px solid #000;
    border-right: 1px solid #000;
   border-top: 1px solid #000;
    border-left: 1px solid #000;
  }
  .cart-area .table td,
  .cart-area .table th {
    border-top: 1px solid #edeef2;
  }
  .cart-area .table-content table td.product-subtotal {
    font-size: 16px;
  }
  .cart-area .table-content table td .cart-plus-minus {
    float: none;
    margin: 0 auto;
  }
  .cart-area .coupon-all {
    margin-top: 50px;
  }
  .cart-area .coupon {
    float: left;
    gap: 15px;
    flex-wrap: wrap;
  }
  @media (max-width: 767px) {
    .cart-area .coupon {
      float: none;
    }
  }
  .cart-area #coupon_code {
    height: 50px;
    border: 1px solid #edeef2;
    padding: 0 15px;
    outline: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
  }
  .cart-area #coupon_code:focus {
    border-color: #000;
  }
  .cart-area .coupon2 {
    float: right;
  }
  @media (max-width: 767px) {
    .cart-area .coupon2 {
      float: none;
      margin-top: 15px;
    }
  }
  .cart-area .cart-page-total {
    padding-top: 50px;
  }
  .cart-area .cart-page-total > h2 {
    font-size: 20px;
    margin-bottom: 20px;
    text-transform: capitalize;
  }
  .cart-area .cart-page-total > ul {
    border: 1px solid #edeef2;
  }
  .cart-area .cart-page-total > ul > li {
    list-style: none;
    font-size: 15px;
    color: #575757;
    padding: 14px 30px;
    border-bottom: 1px solid #edeef2;
    font-weight: 400;
  }
  .cart-area .cart-page-total ul > li > span {
    float: right;
  }
  .cart-area .cart-page-total li:last-child {
    border-bottom: 0;
  }
  .cart-area td.product-thumbnail img {
    width: 125px;
  }
  .cart-area .product-quantity-form {
    margin: auto;
    width: 100%;
    height: 58px;
    border: 1px solid #edeef2;
    text-align: center;
    position: relative;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .cart-area .product-quantity-form:hover {
    border-color: #000;
  }
  .cart-area .cart-plus, .cart-area .cart-minus {
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 45px;
    height: 40px;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    font-size: 14px;
    background: transparent;
    border: none;
    outline: none;
  }
  .cart-area .cart-plus:hover, .cart-area .cart-minus:hover {
    cursor: pointer;
    color: #000;
    background: transparent;
  }
  .cart-area .cart-plus {
    left: auto;
    right: 0;
  }
  .cart-area .cart-input {
    height: 58px;
    width: 100%;
    text-align: center;
    font-size: 14px;
    border: none;
    display: inline-block;
    vertical-align: middle;
    margin: 0 -3px;
    padding-bottom: 4px;
    background: transparent;
  }
  .cart-area .cart-input:focus {
    outline: none;
  }

  .cart-area .coupon .edu-btn {
    height: 50px;
    line-height: 48px;
  }

  .cart-area .coupon2 .edu-btn {
    height: 50px;
    line-height: 48px;
  }

  .product-quantity a {
    white-space: nowrap;
  }

  .coupon-accordion h3 {
    background-color: #f6f6f6;
    border-top: 3px solid #000;
    font-size: 14px;
    font-weight: 400;
    margin: 0 0 25px;
    padding: 1em 2em 1em 3.5em;
    position: relative;
    width: auto;
  }

  .coupon-accordion h3::before {
    content: "";
    left: 15px;
    top: 13px;
    position: absolute;
    color: #575757;
    font-family: "Font Awesome 5 Pro";
    font-weight: 700;
  }

  .coupon-accordion span {
    color: #575757;
    cursor: pointer;
    transition: 0.3s;
    font-weight: 500;
  }

  .coupon-accordion span:hover,
  p.lost-password a:hover {
    color: #000;
  }

  .coupon-content {
    border: 1px solid #edeef2;
    display: none;
    margin-bottom: 20px;
    padding: 30px;
  }

  .coupon-info p.coupon-text {
    margin-bottom: 15px;
  }

  .coupon-info p {
    margin-bottom: 0;
  }

  .coupon-info p.form-row-first label,
  .coupon-info p.form-row-last label {
    display: block;
    color: #141517;
  }

  .coupon-info p.form-row-first label span.required,
  .coupon-info p.form-row-last label span.required {
    color: #141517;
    font-weight: 700;
  }

  .coupon-info p.form-row-first input,
  .coupon-info p.form-row-last input {
    border: 1px solid #edeef2;
    height: 55px;
    line-height: 55px;
    margin: 0 0 14px;
    max-width: 100%;
    padding: 0 0 0 10px;
    width: 100%;
    outline: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
  }
  .coupon-info p.form-row-first input:focus,
  .coupon-info p.form-row-last input:focus {
    border-color: #000;
  }

  .coupon-info p.form-row input[type=submit]:hover,
  p.checkout-coupon input[type=submit]:hover {
    background: #3e976c none repeat scroll 0 0;
  }

  .coupon-info p.form-row input[type=checkbox] {
    position: relative;
    top: 2px;
  }

  .form-row > label {
    margin-top: 15px;
    margin-left: 15px;
    color: #575757;
  }

  .buttons-cart input,
  .coupon input[type=submit],
  .buttons-cart a,
  .coupon-info p.form-row input[type=submit] {
    background: #252525 none repeat scroll 0 0;
    border: medium none;
    color: #fff;
    display: inline-block;
    float: left;
    font-size: 12px;
    font-weight: 700;
    height: 40px;
    line-height: 40px;
    margin-right: 15px;
    padding: 0 15px;
    text-transform: uppercase;
    transition: all 0.3s ease 0s;
  }

  p.lost-password {
    margin-top: 15px;
  }

  p.lost-password a {
    color: #6f6f6f;
  }

  p.checkout-coupon input[type=text] {
    height: 55px;
    line-height: 55px;
    padding: 0 20px;
    width: 100%;
    border: 1px solid #edeef2;
    margin-bottom: 15px;
    outline: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
  }
  p.checkout-coupon input[type=text]:focus {
    border-color: #edeef2;
  }

  .coupon-checkout-content {
    display: none;
  }

  .checkbox-form .ship-different-title {
    border-bottom: 1px solid #edeef2;
    margin: 0 0 20px;
    padding-bottom: 10px;
    width: 100%;
  }

  .country-select {
    margin-bottom: 30px;
    position: relative;
  }

  .country-select select {
    width: 100%;
    background-color: transparent;
    border: 1px solid #edeef2;
    padding: 0 10px;
    height: 50px;
  }

  .country-select label,
  .checkout-form-list label {
    color: #141517;
    display: block;
    margin: 0 0 5px;
  }

  .country-select label span.required,
  .checkout-form-list label span.required {
    color: #141517;
  }

  .country-select .nice-select {
    border: 1px solid #edeef2;
    height: 55px;
    line-height: 55px;
    padding-left: 20px;
    width: 100%;
    color: #575757;
    margin-bottom: 20px;
  }

  .country-select .nice-select .list {
    width: 100%;
  }

  .checkout-form-list {
    margin-bottom: 30px;
  }

  .checkout-form-list label {
    color: #141517;
  }

  .checkout-form-list input[type=text],
  .checkout-form-list input[type=password],
  .checkout-form-list input[type=email] {
    background: #ffffff;
    border: 1px solid #edeef2;
    border-radius: 0;
    height: 55px;
    line-height: 55px;
    padding: 0 0 0 20px;
    width: 100%;
    outline: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
  }
  .checkout-form-list input[type=text]:focus,
  .checkout-form-list input[type=password]:focus,
  .checkout-form-list input[type=email]:focus {
    border-color: #edeef2;
  }

  .checkout-form-list input[type=text]::-moz-placeholder,
  .checkout-form-list input[type=password]::-moz-placeholder,
  .checkout-form-list input[type=email]::-moz-placeholder {
    color: #575757;
    opacity: 1;
  }

  .checkout-form-list input[type=text]::placeholder,
  .checkout-form-list input[type=password]::placeholder,
  .checkout-form-list input[type=email]::placeholder {
    color: #575757;
    opacity: 1;
  }

  .checkout-form-list input[type=checkbox] {
    display: inline-block;
    margin-right: 10px;
    position: relative;
    top: 1px;
  }

  .create-acc label {
    color: #575757;
    display: inline-block;
  }

  .create-account {
    display: none;
  }

  .ship-different-title label {
    display: inline-block;
    margin-right: 10px;
  }

  .order-notes textarea {
    border: 1px solid #edeef2;
    height: 90px;
    padding: 15px;
    width: 100%;
    resize: none;
    padding-left: 20px;
  }

  .order-notes textarea::-moz-placeholder {
    color: #575757;
    opacity: 1;
  }

  .order-notes textarea::placeholder {
    color: #575757;
    opacity: 1;
  }

  #ship-box-info {
    display: none;
  }

  .panel-group .panel {
    border-radius: 0;
  }

  .panel-default > .panel-heading {
    border-radius: 0;
  }

  .your-order {
    padding: 30px 40px 45px;
    border: 2px solid #edeef2;
  }

  @media (max-width: 767px) {
    .your-order {
      padding: 15px;
    }
  }
  .your-order h3 {
    border-bottom: 1px solid #edeef2;
    font-size: 24px;
    margin: 0 0 20px;
    padding-bottom: 10px;
    width: 100%;
  }

  .your-order-table table {
    background: none;
    border: 0;
    width: 100%;
  }

  .your-order-table table th,
  .your-order-table table td {
    border-bottom: 1px solid #edeef2;
    border-right: medium none;
    color: #575757;
    font-size: 16px;
    padding: 15px 0;
    text-align: left;
  }

  @media (max-width: 767px) {
    .your-order-table table th,
  .your-order-table table td {
      padding-right: 10px;
    }
  }
  .your-order-table table th {
    border-top: medium none;
    color: #141517;
    font-weight: normal;
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
    width: 250px;
  }

  .panel-body > p {
    color: #222;
  }

  .your-order-table table .shipping ul li input {
    position: relative;
    top: 2px;
  }

  .your-order-table table .shipping ul li label {
    color: #575757;
  }

  .your-order-table table .shipping th {
    vertical-align: top;
  }

  .your-order-table table .order-total th {
    border-bottom: 0;
  }

  .your-order-table table .order-total td {
    border-bottom: medium none;
  }

  .your-order-table table tr.cart_item:hover {
    background: #f9f9f9;
  }

  .your-order-table table tr.order-total td span {
    color: #000;
    font-size: 18px;
    font-weight: 500;
  }

  .payment-method {
    margin-top: 40px;
  }
  .payment-method .accordion-item:last-of-type {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
  }
  .payment-method .accordion-item {
    background-color: #fff;
    border: 0;
    border-bottom: 1px solid #edeef2;
  }
  .payment-method .accordion-button {
    font-size: 16px;
    font-weight: 500;
    color: #000;
    padding: 23px 0;
    border: none;
  }
  .payment-method .accordion-button:focus {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
  }
  .payment-method .accordion-button::after {
    position: absolute;
    content: "";
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    font-family: "Font Awesome 5 Pro";
    font-size: 16px;
    font-weight: 400;
    margin-left: 0;
    background-image: none;
  }
  .payment-method .accordion-button:not(.collapsed) {
    color: #000;
    background-color: #ffffff;
    box-shadow: none;
  }
  .payment-method .accordion-button:not(.collapsed)::after {
    content: "";
  }
  .payment-method .accordion-body {
    padding: 8px 0;
    padding-bottom: 40px;
  }
  .payment-method .accordion-collapse {
    border: none;
  }

  .panel-title > a {
    display: block;
  }

  .order-button-payment input {
    background: #232323 none repeat scroll 0 0;
    border: medium none;
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    height: 40px;
    margin: 0px 0 0;
    padding: 0;
    text-transform: uppercase;
    transition: all 0.3s ease 0s;
    width: 100%;
  }

  .order-button-payment input:hover {
    background: #3e976c none repeat scroll 0 0;
  }

  .payment-method .btn-link {
    user-select: none;
    -moz-user-select: none;
    background: no-repeat;
    border: medium none;
    border-radius: 0;
    color: #444;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 1px;
    line-height: 1;
    margin-bottom: 0;
    padding: 3px 10px;
    text-align: center;
    text-transform: uppercase;
    transition: all 0.3s ease 0s;
    vertical-align: middle;
    white-space: nowrap;
    text-decoration: none;
  }

  .payment-method .card {
    background-color: #ffffff;
    border: 1px solid #edeef2;
    border-radius: 0;
    margin-bottom: 10px;
  }

  .payment-method .accordion .card:first-of-type {
    border: 1px solid #edeef2;
  }

  .card-header:first-child {
    border-radius: 0;
  }

  .payment-method .card-header {
    background-color: #ffffff;
    border-bottom: 1px solid #edeef2;
  }

  .order-button-payment button {
    width: 100%;
  }

  .product-details-img {
    margin-right: 50px;
  }
  @media (max-width: 575px) {
    .product-details-img {
      margin-right: 0;
    }
  }
  .product-details-img img {
    width: 100%;
  }

  .product-side-info .product-name {
    font-size: 36px;
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .product-side-info .product-name {
      font-size: 28px;
    }
  }

  .product-side-info .product-price {
    font-size: 20px;
    font-weight: 700;
    color: #2467EC;
  }

  .product-side-info p {
    margin-top: 30px;
    margin-bottom: 40px;
  }

  .product-quantity-cart {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
  }

  .product-quantity-cart .cart-minus {
    height: 55px;
    width: 55px;
    border: none;
  }

  .product-quantity-form .cart-plus {
    height: 55px;
    width: 55px;
    border: none;
  }

  .product-quantity-cart .cart-input {
    height: 55px;
    width: 55px;
    border: none;
  }

  .product-quantity-cart .product-quantity-form {
    border: 1px solid #edeef2;
    border-radius: 4px;
  }

  .comment-title h3 {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 5px;
  }

  .comment-title p {
    color: #454545;
  }

  .comment-rating span {
    font-size: 15px;
    color: #454545;
    margin-right: 5px;
  }

  .comment-rating ul li {
    display: inline-block;
  }

  .comment-rating ul li a {
    font-size: 14px;
    color: #FFB013;
  }

  .comment-rating ul {
    display: inline-block;
  }

  .comment-agree input {
    margin: 0;
    appearance: none;
    display: inline-block;
    width: 18px;
    height: 18px;
    background: transparent;
    border: 2px solid #edeef2;
    border-radius: 2px;
    outline: none;
  }

  .comment-agree label {
    margin-left: 5px;
    font-size: 15px;
    color: #454545;
  }

  .comment-agree input::placeholder {
    color: #575757;
    font-size: 14px;
    opacity: 1;
  }

  .comment-input input {
    height: 60px;
    width: 100%;
    background: #f8f8f9;
    border: none;
    padding: 15px 20px;
    border-radius: 4px;
    outline: 0;
  }

  .comment-input input::placeholder {
    color: #575757;
    font-size: 14px;
    opacity: 1;
  }

  .comment-textarea {
    height: 170px;
    width: 100%;
    background: #f8f8f9;
    border: none;
    padding: 15px 20px;
    border-radius: 4px;
    resize: none;
    outline: 0;
  }

  .comment-textarea::placeholder {
    color: #575757;
    font-size: 14px;
    opacity: 1;
  }

  .product-details-nav .nav-item {
    position: relative;
  }

  .product-details-nav .nav-item::before {
    position: absolute;
    content: "";
    width: 0%;
    height: 1px;
    background: #2467EC;
    bottom: 0;
    left: 0;
    right: 0;
    transition: 0.3s;
  }

  .product-details-nav .nav-item.active::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 1px;
    background: #2467EC;
    bottom: 0;
    left: 0;
    right: 0;
  }

  .product-details-nav .nav-item {
    position: relative;
    border: 0;
    padding: 10px 0;
    font-size: 16px;
    margin-right: 20px;
    font-weight: 600;
    color: #141517;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px) {
    .product-details-nav .nav-item {
      font-size: 20px;
    }
  }

  .product-details-nav .nav-item.active {
    color: #2467EC;
    font-weight: 600;
  }

  /*----------

  23. membership style

  ----------*/
  .membership-tittle p {
    color: #141517;
    margin-bottom: 50px;
  }

  .pricing-tab .nav-tabs {
    border: none;
  }

  .pricing-tab .nav-tabs .nav-link {
    margin-bottom: 0;
    border: 0;
  }

  .pricing-tab .nav .nav-item .nav-link {
    padding: 7px 60px;
    background: transparent;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    font-weight: 600;
    text-transform: capitalize;
    color: #141517;
    position: relative;
    outline: none;
    font-size: 16px;
    border: none;
    z-index: 2;
  }

  .pricing-tab .nav .nav-item:last-child .nav-link {
    padding-right: 0;
  }

  .pricing-tab .nav .nav-item:first-child .nav-link {
    padding-left: 0;
  }

  .pricing-tab .nav .nav-item {
    padding-left: 0px;
  }

  .pricing-tab .nav .nav-item .nav-link.active {
    color: #2467EC;
  }

  .pricing-tab .nav .nav-item .nav-link.active::after {
    right: 10px;
  }

  .pricing-tab .nav .nav-item .nav-link::after {
    position: absolute;
    content: "";
    right: -32px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 22px;
    height: 22px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background: #2467EC;
    z-index: 1;
  }

  .pricing-tab .nav .nav-item:last-child .nav-link::after {
    display: none;
  }

  .pricing-tab .nav .nav-item .nav-link::before {
    position: absolute;
    content: "";
    right: 0px;
    top: 50%;
    -webkit-transform: translateY(-50%) translateX(50%);
    -moz-transform: translateY(-50%) translateX(50%);
    -ms-transform: translateY(-50%) translateX(50%);
    transform: translateY(-50%) translateX(50%);
    background: #f5f6f9;
    width: 80px;
    height: 40px;
    -webkit-border-radius: 11px;
    -moz-border-radius: 11px;
    border-radius: 20px;
    border: 1px solid #2467EC;
  }

  .pricing-tab .nav .nav-item:last-child .nav-link::before {
    display: none;
  }

  .membership-box {
    padding: 40px 40px;
    box-shadow: 0px 10px 40px rgba(12, 29, 74, 0.08);
    border-radius: 8px;
    background: #ffffff;
    border: 1px solid #edeef2;
    overflow: hidden;
    position: relative;
    height: 480px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px), (max-width: 575px) {
    .membership-box {
      padding: 40px 30px;
    }
  }

  .membership-info h4 {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 15px;
  }
  .membership-info span {
    font-size: 28px;
    font-weight: 900;
    color: #2467EC;
  }

  .membership-price p {
    font-size: 15px;
    color: #141517;
  }

  .membership-list {
    padding: 15px 0;
  }
  .membership-list ul li {
    margin-bottom: 5px;
  }
  .membership-list ul li i {
    color: #2467EC;
    margin-right: 15px;
  }

  .Popular-plan {
    position: absolute;
    background: #FFB013;
    top: -30px;
    right: -84px;
    font-size: 14px;
    font-weight: 600;
    color: #141517;
    text-align: center;
    padding: 62px 72px 6px;
    transform: rotate(48deg);
  }

  .Popular-plan span {
    width: 70px;
    display: inline-block;
    font-size: 14px;
    line-height: 16px;
    font-weight: 600;
    font-family: "Raleway", sans-serif;
  }

  /*----------

  24. zoom-class style

  ----------*/
  .zoom-class-main-wrapper {
    display: flex;
    border-radius: 8px;
    overflow: hidden;
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .zoom-class-main-wrapper {
      display: block;
    }
  }

  .zoom-class-thumb {
    width: 48%;
    overflow: hidden;
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .zoom-class-thumb {
      width: 100%;
    }
  }
  .zoom-class-thumb img {
    object-fit: cover;
    height: 100%;
    transition: all 1.5s cubic-bezier(0, 0, 0.2, 1);
  }

  .zoom-class-main-wrapper:hover .zoom-class-thumb img {
    transform: scale3d(1.1, 1.1, 1.1);
  }

  .zoom-class-item {
    padding: 28px 30px 29px 30px;
    background: #ffffff;
    box-shadow: 0px 5px 20px rgba(12, 29, 62, 0.05);
    border-bottom: 1px solid #edeef2;
    border-right: 1px solid #edeef2;
    border-top: 1px solid #edeef2;
    width: 52%;
    border-radius: 0 8px 8px 0;
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
    .zoom-class-item {
      border-left: 1px solid #edeef2;
      border-top: none;
      border-radius: 0 0 8px 8px;
      padding: 28px 20px 29px 20px;
      width: 100%;
    }
  }

  .zooom-class-tittle h3 {
    line-height: 1.5;
    margin-bottom: 27px;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .zooom-class-tittle h3 {
      font-size: 20px;
    }
  }
  .zooom-class-tittle h3 a:hover {
    color: #2467EC;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .zooom-class-tittle {
      font-size: 20px;
    }
  }

  .class-metting {
    margin-top: 20px;
    display: block;
  }
  .class-metting a {
    font-weight: 700;
    color: #2467EC;
    margin-left: 10px;
  }

  .class-list-date {
    margin-bottom: 5px;
  }
  .class-list-date i {
    padding-right: 10px;
    line-height: 1;
  }

  .class-list-length {
    margin-bottom: 5px;
  }
  .class-list-length i {
    padding-right: 10px;
    line-height: 1;
  }

  .class-list-time {
    margin-bottom: 5px;
  }
  .class-list-time i {
    padding-right: 10px;
    line-height: 1;
  }

  .sidebar-widget-details {
    padding: 30px;
    box-shadow: 0px 10px 30px rgba(28, 51, 84, 0.08);
    border: 1px solid #edeef2;
    background: #ffffff;
    border-radius: 5px;
  }

  .widget-detalis {
    display: flex;
    align-items: center;
  }

  .zoom-widget-tittle h4 {
    font-size: 20px;
  }

  .zoom-widget-list {
    padding: 30px 0;
  }

  .zoom-widget-list ul li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #edeef2;
    padding: 10px 0px 7px 0px;
  }
  .zoom-widget-list ul i {
    line-height: 1;
    margin-right: 10px;
  }

  .widget-detalis span {
    font-weight: 600;
    color: #141517;
  }

  .zoom-btn.text-center i {
    line-height: 1;
    margin-right: 10px;
  }

  .zoom-btn i {
    line-height: 0;
    margin-right: 10px;
    font-size: 20px;
  }

  .content-main-heading a {
    font-size: 15px;
    font-weight: 600;
    background: #6f19c5;
    padding: 0px 10px;
    line-height: 25px;
    color: #ffffff;
    border-radius: 5px;
    margin-bottom: 20px;
    display: inline-block;
  }
  .content-main-heading h2 {
    margin-bottom: 30px;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
    .content-main-heading h2 {
      font-size: 32px;
    }
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .content-main-heading h2 {
      font-size: 24px;
    }
  }

  .contents-widget p {
    margin-bottom: 30px;
  }
  .contents-widget h4 {
    font-size: 18px;
    margin-bottom: 15px;
  }

  .objective-list ul {
    margin-bottom: 35px;
  }

  .sidebar-widget-wrapper {
    margin-left: 30px;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
    .sidebar-widget-wrapper {
      margin-left: 0;
    }
  }

  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .event-detalis-area .sidebar-widget-wrapper {
      margin-left: 0;
    }
  }

  .sidebar-widget {
    border: 1px solid #edeef2;
    border-radius: 5px;
    box-shadow: 0px 10px 30px rgba(28, 51, 84, 0.08);
    background-color: #ffffff;
    max-width: 510px;
  }
  @media (max-width: 575px) {
    .sidebar-widget {
      max-width: 100%;
    }
  }

  .sidebar-widget-inner {
    padding: 35px 30px 30px 30px;
    height: 385px;
  }

  .edu-calender .huicalendar.huicalendar1.huicalendar2 {
    width: 100%;
    padding: 2px;
    border: 0;
    background: #ffffff;
    height: 260px;
  }

  .edu-calender .huicalendar.huicalendar1.huicalendar2 .week th {
    background: #ffffff;
  }

  .edu-calender .huicalendar.huicalendar1.huicalendar2 td.enabled {
    color: #2467EC;
    cursor: pointer;
    font-size: 15px;
    font-weight: bold;
    background: #d5e3ff;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
  }

  .edu-calender .huicalendar.huicalendar1.huicalendar2 th,
  .huicalendar.huicalendar1.huicalendar2 td .month {
    color: #141517;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    background: #f4f4f6;
    padding: 5px;
  }

  .edu-calender .huicalendar.huicalendar1.huicalendar2 td {
    color: #575757;
    cursor: auto;
    font-size: 15px;
  }

  .edu-calender .huicalendar.huicalendar1.huicalendar2 .left {
    position: relative;
  }
  .edu-calender .huicalendar.huicalendar1.huicalendar2 .left::before {
    position: absolute;
    content: "";
    font-family: "Font Awesome 5 Pro";
    left: 0;
    font-weight: 400;
  }

  .huicalendar.huicalendar1.huicalendar2 .right {
    position: relative;
  }
  .huicalendar.huicalendar1.huicalendar2 .right::after {
    position: absolute;
    content: "";
    font-family: "Font Awesome 5 Pro";
    left: 0;
    font-weight: 400;
  }

  .huicalendar.huicalendar1.huicalendar2 .left {
    background: url("") -16px 0 no-repeat;
  }

  .huicalendar.huicalendar1.huicalendar2 .right {
    background: url("") -32px 0 no-repeat;
  }

  /*----------

  25. faq style

  ----------*/
  .faq-tittle-info h3 {
    font-size: 28px;
  }
  @media (max-width: 575px) {
    .faq-tittle-info h3 {
      font-size: 26px;
    }
  }

  .faq-question-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #edeef2;
    padding: 24px 20px;
    border-radius: 4px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
    gap: 5px;
    position: relative;
  }
  .faq-question-item:hover {
    background: #2467EC;
    color: #ffffff;
    border-color: #2467EC;
    box-shadow: 0px 40px 40px rgba(24, 44, 74, 0.1);
  }
  .faq-question-item a {
    font-size: 18px;
  }
  .faq-question-item a::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
  }

  .faq-nav-tab {
    display: flex;
    justify-content: center;
    margin-top: -104px;
    position: relative;
  }

  .faq-nav-tab .nav-tabs .nav-item:first-child .nav-link {
    border-radius: 5px 0 0 5px;
  }

  .faq-nav-tab .nav-tabs .nav-item:last-child .nav-link {
    border-radius: 0 5px 5px 0;
  }

  .faq-nav-tab .nav-tabs {
    border-bottom: 0;
    padding: 25px 25px;
    background: #ffffff;
    border-radius: 7px;
    max-width: 410px;
  }

  .faq-nav-tab .nav-tabs .nav-link {
    margin-bottom: 0;
    border: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    padding: 0 50px;
    height: 55px;
    background-color: #f2f4f6;
    font-size: 18px;
    font-weight: 600;
    color: #141517;
  }
  @media (max-width: 575px) {
    .faq-nav-tab .nav-tabs .nav-link {
      padding: 0 20px;
      font-size: 16px;
    }
  }

  .faq-nav-tab .nav-tabs .nav-link.active {
    background-color: #2467EC;
    color: #ffffff;
  }

  .faqicon-arrow {
    position: relative;
  }
  .faqicon-arrow a {
    border: 1px solid #edeef2;
    border-radius: 5px;
    color: #8c929f;
    width: 35px;
    height: 35px;
    content: "";
    text-align: center;
    line-height: 35px;
    display: inline-block;
    font-size: 15px;
  }

  .faq-wrapper:hover .faqicon-arrow a {
    background-color: #1352cf;
    box-shadow: 0px 40px 40px rgba(24, 44, 74, 0.1);
  }

  .faq-wrapper:hover .faq-question-item a {
    border-color: transparent;
    color: #ffffff;
  }

  .faq-topic-title h3 {
    font-size: 28px;
  }
  @media (max-width: 575px) {
    .faq-topic-title h3 {
      font-size: 26px;
    }
  }

  .topic-items {
    background: transparent;
    border: 1px solid #edeef2;
    padding: 50px 25px 35px 25px;
    border-radius: 5px;
    -webkit-transition: all 0.3s ease-out 0s;
    -moz-transition: all 0.3s ease-out 0s;
    -ms-transition: all 0.3s ease-out 0s;
    -o-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
  }
  .topic-items:hover {
    box-shadow: 0px 40px 40px rgba(24, 44, 74, 0.07);
  }

  .topic-wrapper:hover .topic-svg {
    transform: translateY(-10px);
  }

  .topic-svg {
    transition: 0.3s;
  }
  .topic-svg svg {
    margin-bottom: 33px;
  }

  .topic-content h4 {
    font-size: 20px;
    margin-bottom: 20px;
  }
  .topic-content p {
    margin-bottom: 0;
  }

  .faq-detalis-info h3 {
    font-size: 28px;
    margin-bottom: 25px;
  }
  @media (max-width: 575px) {
    .faq-detalis-info h3 {
      font-size: 26px;
    }
  }

  .faq-suppoert ul li::marker {
    background: #7a7878;
    font-size: 25px;
  }

  .faq-detalis-info p {
    margin-bottom: 35px;
  }

  .faq-suppoert p {
    margin-bottom: 23px;
  }

  .faq-suppoert h5 {
    font-size: 18px;
    margin-bottom: 15px;
  }

  .payment-method-info h5 {
    font-size: 18px;
    margin-bottom: 15px;
  }

  .faq-suppoert ul {
    padding-left: 60px;
    margin-bottom: 35px;
  }
  @media (max-width: 575px) {
    .faq-suppoert ul {
      padding-left: 20px;
    }
  }
  .faq-suppoert ul li {
    position: relative;
    margin-bottom: 20px;
  }
  .faq-suppoert ul li:last-child {
    margin-bottom: 0px;
  }
  .faq-suppoert ul li:before {
    position: absolute;
    top: 10px;
    left: -20px;
    content: "";
    background: #7a7878;
    height: 8px;
    width: 8px;
    border-radius: 8px;
  }
  .faq-suppoert ul li a {
    color: #2467EC;
    font-size: 16px;
    font-weight: 600;
    text-decoration: underline;
    font-weight: 600;
  }

  .faq-sidebar-topc {
    border: 1px solid #edeef2;
    padding: 30px 30px 40px 30px;
    background: #fcfdff;
    border-radius: 8px;
  }
  .faq-sidebar-topc h5 {
    margin-bottom: 25px;
    font-size: 20px;
  }

  .sidebar-topic-list .contact-btn {
    width: 100%;
  }

  .sidebar-topic-list ul {
    margin-bottom: 45px;
  }
  .sidebar-topic-list ul li {
    font-size: 16px;
    color: #575757;
    margin-bottom: 8px;
  }
  .sidebar-topic-list ul li a:hover {
    color: #2467EC;
  }

  .payment-method-info a {
    color: #2467EC;
    font-weight: 600;
  }

  .contact-btn {
    background: #2467EC;
    border-radius: 4px;
    color: #ffffff;
    font-weight: 600;
    display: inline-block;
    text-align: center;
    height: 54px;
    line-height: 54px;
  }
  .contact-btn:hover {
    color: #141517;
    background: #FFB013;
  }

  .faq-content-wrapper {
    margin-right: 20px;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .faq-content-wrapper {
      margin-right: 0;
    }
  }

  /*----------

  26. contact style

  ----------*/
  .contact-from-input input {
    height: 60px;
    width: 100%;
    background: #f8f8f9;
    border: none;
    padding: 15px 20px;
    border-radius: 4px;
    outline: 0;
  }

  .contact-from-input textarea {
    height: 170px;
    width: 100%;
    background: #f8f8f9;
    border: none;
    padding: 15px 20px;
    border-radius: 4px;
    resize: none;
    outline: 0;
  }

  .support-item {
    display: flex;
    align-items: start;
    gap: 20px;
    margin-bottom: 30px;
  }
  .support-item:last-child {
    margin-bottom: 0;
  }
  @media (max-width: 575px) {
    .support-item {
      gap: 12px;
    }
  }

  .support-contact {
    padding: 25px 30px 25px 30px;
    background: #f8f8f9;
    border-radius: 5px;
    border: 1px solid #f8f8f9;
  }
  @media (max-width: 575px) {
    .support-contact {
      padding: 25px 20px 25px 20px;
    }
  }

  .support-tittle h4 {
    margin-bottom: 30px;
  }

  .support-info-phone span {
    font-size: 18px;
    font-weight: 700;
    color: #141517;
    margin-bottom: 10px;
    display: block;
  }
  .support-info-phone p {
    margin-bottom: 3px;
  }
  .support-info-phone p a {
    color: #141517;
    font-weight: 700;
  }

  .support-info-email span {
    font-size: 18px;
    font-weight: 700;
    color: #141517;
    margin-bottom: 10px;
    display: block;
  }

  .support-info-email a {
    margin-bottom: 2px;
    display: block;
  }

  .support-info-location span {
    font-size: 18px;
    font-weight: 700;
    color: #141517;
    margin-bottom: 10px;
    display: block;
  }

  .contact-select .nice-select {
    height: 60px;
    width: 100%;
    background: #f8f8f9;
    border: none;
    padding: 15px 20px;
    line-height: 30px;
  }
  .contact-select .nice-select span {
    font-size: 14px;
    color: #575757;
  }
  .contact-select .nice-select:after {
    width: 7px;
    height: 7px;
    right: 20px;
  }

  .contact-select .nice-select .list {
    width: 100%;
    background-color: #f8f8f9;
  }

  .contact-map iframe {
    height: 380px;
    width: 100%;
    border-radius: 4px;
  }

  /*----------

  27. footer style

  ----------*/
  .footer-area {
    background: #141517;
  }

  .footer-img img {
    margin-bottom: 30px;
  }

  @media sm {
    .footer-widget {
      margin-bottom: 20px;
    }
  }
  .footer-widget p {
    color: #A2A2A2;
    margin-bottom: 30px;
  }
  .footer-widget h3 {
    color: #ffffff;
    margin-bottom: 30px;
    font-size: 20px;
  }
  .footer-widget ul li {
    margin-bottom: 10px;
  }
  .footer-widget ul li:last-child {
    margin-bottom: 0;
  }
  .footer-widget ul li a {
    color: #A2A2A2;
    text-decoration: none;
  }
  .footer-widget ul li a:hover {
    color: #ffffff;
  }

  .f-w1 {
    margin-right: 0;
  }

  .f-w2 {
    margin-left: 130px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .f-w2 {
      margin-left: 75px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .f-w2 {
      margin-left: 50px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .f-w2 {
      margin-left: 0;
    }
  }

  .f-w3 {
    margin-left: 120px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .f-w3 {
      margin-left: 70px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .f-w3 {
      margin-left: 40px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .f-w3 {
      margin-left: 0;
    }
  }

  .f-w4 {
    margin-left: 110px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .f-w4 {
      margin-left: 70px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .f-w4 {
      margin-left: 20px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .f-w4 {
      margin-left: 0;
    }
  }

  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .footer-icon {
      margin-bottom: 30px;
    }
  }
  .footer-icon a {
    background: #212730;
    height: 40px;
    width: 40px;
    line-height: 40px;
    font-size: 16px;
    color: #ffffff;
    border-radius: 30px;
    text-align: center;
    margin-right: 15px;
    display: inline-block;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .footer-icon a {
      margin-right: 9px;
    }
  }
  .footer-icon a:hover {
    background: #2467EC;
  }

  .copyright-area {
    background: #1a1f27;
    border-radius: 10px 10px 0 0;
    padding: 30px 20px;
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .copyright-area {
      padding: 30px 15px;
    }
  }

  .copy-right-support {
    display: flex;
    align-items: center;
    top: 5px;
    position: relative;
  }
  @media (max-width: 575px) {
    .copy-right-support {
      margin-bottom: 25px;
      margin-top: 10px;
    }
  }
  @media only screen and (min-width: 576px) and (max-width: 767px) {
    .copy-right-support {
      margin-bottom: 20px;
    }
  }
  .copy-right-support p {
    color: #a2a2a2;
    margin-bottom: 3px;
    font-size: 14px;
  }
  .copy-right-support span {
    color: #2467EC;
  }

  .copy-right-svg {
    margin-right: 20px;
  }

  .copyright-svg-content h5 {
    color: #ffffff;
    font-size: 18px;
    font-weight: 700;
    font-family: "Nunito Sans", sans-serif;
  }
  @media only screen and (min-width: 576px) and (max-width: 767px) {
    .copyright-svg-content h5 {
      font-size: 16px;
    }
  }

  .copyright-subcribe {
    position: relative;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .copyright-subcribe {
      margin-top: 30px;
    }
  }

  .copyright-subcribe .field input {
    height: 70px;
    width: 100%;
    padding: 0 190px 0 45px;
    background: #141517;
    border: 0;
    border-radius: 5px;
    color: #ffffff;
    outline: none;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .copyright-subcribe .field input {
      padding: 0 150px 0 45px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px) {
    .copyright-subcribe .field input {
      padding-left: 0px 0px 0px 45px;
    }
  }
  @media (max-width: 575px) {
    .copyright-subcribe .field input {
      padding: 0 20px 0 45px;
      height: 60px;
    }
  }
  .copyright-subcribe .field input::placeholder {
    color: #A2A2A2;
  }
  .copyright-subcribe .field input::-moz-placeholder {
    color: #A2A2A2;
  }

  .copyright-subcribe button {
    position: absolute;
    top: 10px;
    right: 10px;
    height: 50px;
    width: 160px;
    background: #2467EC;
    border-radius: 5px;
    color: #ffffff;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
  }
  @media (max-width: 575px) {
    .copyright-subcribe button {
      margin-bottom: 20px;
      position: relative;
      left: 0;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .copyright-subcribe button {
      width: 130px;
    }
  }
  .copyright-subcribe button:hover {
    background: #FFB013;
    color: #141517;
  }

  .widget__subscribe .field {
    position: relative;
  }
  .widget__subscribe .field::before {
    position: absolute;
    content: "";
    font-family: "Font Awesome 5 Pro";
    color: #A2A2A2;
    color: #A2A2A2;
    top: 50%;
    transform: translateY(-50%);
    left: 20px;
  }

  .copyright-text {
    width: 196px;
    position: relative;
    top: 9px;
  }
  @media only screen and (min-width: 576px) and (max-width: 767px) {
    .copyright-text {
      margin-bottom: 30px;
    }
  }
  .copyright-text p {
    color: #ffffff;
  }
  .copyright-text span {
    color: #2467EC;
  }

  .border-line::after {
    position: absolute;
    content: "";
    height: 70px;
    width: 1px;
    background: #373a3e;
    top: -9px;
    right: -28%;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .border-line::after {
      right: -17%;
    }
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .border-line::after {
      display: none;
    }
  }

  .border-line-2::before {
    position: absolute;
    content: "";
    height: 70px;
    width: 1px;
    background: #373a3e;
    right: 50px;
    top: -9px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .border-line-2::before {
      right: 12px;
    }
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
    .border-line-2::before {
      display: none;
    }
  }

  .university-footer-area {
    background: #F6F8FB;
  }

  .uf-w1 {
    margin-right: -30px;
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .uf-w1 {
      margin-right: 0;
    }
  }

  .uf-w2 {
    margin-left: 130px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .uf-w2 {
      margin-left: 70px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .uf-w2 {
      margin-left: 50px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .uf-w2 {
      margin-left: 0;
    }
  }

  .uf-w3 {
    margin-left: 80px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .uf-w3 {
      margin-left: 40px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .uf-w3 {
      margin-left: 40px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .uf-w3 {
      margin-left: 0;
    }
  }

  .uf-w4 {
    margin-left: 26px;
  }
  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
    .uf-w4 {
      margin-left: -20px;
    }
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .uf-w4 {
      margin-left: 0px;
    }
  }
  @media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .uf-w4 {
      margin-left: 0;
    }
  }

  .university-footer-widget-body h3 {
    color: #141517;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 20px;
  }

  .university-footer-icon ul li {
    display: inline-block;
    margin-right: 15px;
    margin-bottom: 10px;
    color: #575757;
  }
  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .university-footer-icon ul li {
      margin-right: 9px;
    }
  }
  .university-footer-icon a {
    color: #a8adb7;
    background: #ffffff;
    height: 40px;
    width: 40px;
    line-height: 40px;
    font-size: 16px;
    border-radius: 20px;
    text-align: center;
    display: inline-block;
  }
  .university-footer-icon a:hover {
    background: #2467EC;
    color: #ffffff;
  }

  .university-footer-link ul li {
    margin-bottom: 10px;
  }
  .university-footer-link ul li a:hover {
    color: #141517;
  }

  .university-footer-subscribe input {
    width: 100%;
    height: 50px;
    background: #ffffff;
    outline: none;
    border: 0;
    padding: 0 60px 0 40px;
    color: #a5a5a5;
  }
  .university-footer-subscribe button {
    position: absolute;
    top: 0;
    right: 0;
    background: #FFB013;
    height: 100%;
    width: 50px;
    color: #ffffff;
  }

  .university-footer-subscribe .field::before {
    position: absolute;
    content: "";
    font-family: "Font Awesome 5 Pro";
    color: #a2a2a2;
    top: 50%;
    transform: translateY(-50%);
    left: 15px;
  }

  .app-store {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
  }

  .footer-copyright-right ul li li {
    display: inline-block;
    margin-left: 40px;
    color: #a2a2a2;
  }

  .footer-bottom {
    background: #141517;
  }

  .footer-copyright-left {
    padding-left: 55px;
  }
  .footer-copyright-left p {
    color: #a2a2a2;
  }
  .footer-copyright-left p span {
    color: #2467EC;
    margin-left: 10px;
    font-size: 18px;
  }

  .university-sub-footer {
    background: #141517;
    padding: 25px 0;
    line-height: 1;
  }

  .sub-footer-link ul {
    display: flex;
    justify-content: end;
  }
  @media (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
    .sub-footer-link ul {
      margin-top: 15px;
      justify-content: start;
    }
  }
  .sub-footer-link ul li {
    margin-left: 40px;
  }
  .sub-footer-link ul li:first-child {
    margin-left: 0;
  }
  .sub-footer-link ul li a {
    color: #a2a2a2;
    position: relative;
  }
  .sub-footer-link ul li a::before {
    position: absolute;
    background: #575757;
    width: 1px;
    height: 15px;
    content: "";
    top: 50%;
    transform: translateY(-50%);
    left: -20px;
  }
  .sub-footer-link ul li a:hover {
    color: #ffffff;
  }
  .sub-footer-link ul li:first-child a::before {
    display: none;
  }

  .sub-footer-text span {
    color: #a2a2a2;
  }
  @media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
    .sub-footer-text span {
      margin-bottom: 10px;
      display: inline-block;
    }
  }
  .sub-footer-text span a {
    color: #2467EC;
  }

  /*# sourceMappingURL=style.css.map */
  .form-control {
    display: block;
    width: 100%;
    height: 50px;
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #d9dadb;
    border-radius: 6px;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
  }
  .form-control:focus {
    transform: translateY(-3px) scale(1);
    box-shadow:0px 10px 24px rgb(62,57,107,.2);
    z-index: 30;
    transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    background-color: rgb(250,250,250,1);
    outline: none;
    border-color:#d9dadb;
  }
  .select2-container--default .select2-selection--single,.select2-container--default .select2-selection--multiple {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    background-clip: padding-box;
    border: 1px solid #d9dadb;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    min-height: 50px;
    outline: none;
    transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    border-radius: 6px;
    background-color: #fff;
  }
  .select2-container .select2-selection--single .select2-selection__rendered {
    display: block;
    padding-left: 0px; 
    padding-right: 0px; 
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1rem;
    font-weight: 400;
    line-height: 37px;
    color:#545557;
  }
  .select2-container--default.select2-container--open .select2-selection--single {
      border-color: #007bff;
  }
  .select2-container--default.select2-container--open .select2-selection--single ,.select2-container--default.select2-container--open .select2-selection--multiple {
    transform: translateY(-3px) scale(1);
    box-shadow:0px 10px 24px rgb(62,57,107,.2);
    z-index: 30;
    transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    background-color: rgb(250,250,250,1);
    outline: none;
    border-color:#d9dadb;
  }
  .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 26px;
    position: absolute;
    top: 10px;
    right: 1px;
    width: 20px;
  }
  .select2-container--default .select2-results__option--highlighted{
    background-color: #fafafa;
    color: #eb1b24;
  }
  .select2-container--default .select2-results__option--selected {
    background-color: #fafafa;
    color: #eb1b24;
  }
  .select2-container--default .select2-results__option--selected.select2-results__option--highlighted,.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable  {
    background-color: #f5f6fa;
    color: #eb1b24;
  }
  .select2-dropdown {
    background-color: white;
    border: 1px solid #d9dadb !important;
    border-radius: .375rem;
    box-sizing: border-box;
    display: block;
    position: absolute;
    left: -100000px;
    width: 100%;
    z-index: 1051;
    transform: translateY(-3px) scale(1);
  }
  .select2-container--default .select2-search--dropdown .select2-search__field {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    line-height: 1.5;
    background-clip: padding-box;
    border: 1px solid #e6e6e6;
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.05);
    font-size: 13px;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    min-height: 40px;
    outline: none;
    border-radius: .375rem;
  }
  .select2-container--default .select2-search--dropdown .select2-search__field:focus {
    z-index: 30;
    transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    background-color: rgb(250,250,250,1);
    outline: none;
    border-color:#d9dadb;
  }
  .select2-results__option {
    padding: 10px;
    border-radius: 6px;
    margin-bottom: 3px;
  }
  .select2-container--default .select2-results>.select2-results__options {
      max-height: 200px;
      overflow-y: auto;
      padding: 10px;
  }
  .select2-container--default .select2-selection--multiple .select2-selection__choice {
      background-color: #fff;
      border: 1px solid #eee;
      border-radius: 6px;
      display: inline-block;
      margin-left: 5px;
      margin-top: 5px;
      padding: 5px;
      box-shadow: 0px 0px 10px #f1f1f1;
  }
  .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
      background-color: transparent;
      border: none;
      border-right: 1px solid #eee;
      border-top-left-radius: 4px;
      border-bottom-left-radius: 4px;
      color: #999;
      cursor: pointer;
      font-size: 1em;
      font-weight: bold;
      padding: 0 4px;
  }
  .select2-search--dropdown {
      display: block;
      padding: 10px;
  }
  .tab-content img {
    width: 100% !important;
  }
  .table-content table {
    background: #ffffff;
    border-color: #edeef2;
    border-radius: 0;
    border-style: solid;
    border-width: 1px 0 0 1px;
    text-align: center;
    width: 100%;
    margin-bottom: 0;
  }
  .stop-button, .save-button {
    background-color: #4CAF50;
    border: none;
    color: white;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
  }
  .recording-time {
    font-size: 24px;
    margin-top: 20px;
    color: #4CAF50;
    font-weight: bold;
  }
  .stop-button:disabled , .save-button:disabled {
    background-color: #f44336;
    cursor: not-allowed;
  }
   .play-button:disabled , .send-button:disabled{
    cursor: not-allowed;
  }