@charset "UTF-8";
@import url(fontiran.css);
.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.mini-padding {
  padding: 0 25px;
}

.rounded {
  border-radius: 8px;
}

.medium-top-space {
  margin-top: 25px;
}

.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.mini-padding {
  padding: 0 25px;
}

.rounded {
  border-radius: 8px;
}

.medium-top-space {
  margin-top: 25px;
}

.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

@font-face {
  font-display: swap;
  font-family: IRANYekan;
  font-weight: 400;
  src: local("?"), url("../../assets/font/fonts/IRANYekanRegularFaNum.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: IRANYekan;
  font-weight: 500;
  src: local("?"), url("../../assets/font/fonts/IRANYekanMediumFaNum.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: IRANYekan;
  font-weight: 600;
  src: local("?"), url("../../assets/font/fonts/IRANYekanBoldFaNum.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: IRANYekan;
  font-weight: 800;
  src: local("?"), url("../../assets/font/fonts/IRANYekanBlackFaNum.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: KalamehWeb;
  font-weight: 500;
  src: local("?"), url("../../assets/font/fonts/KalamehWeb_Regular.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: KalamehWeb;
  font-weight: 800;
  src: local("?"), url("../../assets/font/fonts/KalamehWeb_Black.ttf") format("truetype");
}
body {
  font-size: 14px;
  color: rgb(34, 34, 34);
  background: #fff;
  font-weight: 400;
  font-family: IRANYekan !important;
  overflow-x: hidden;
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
}

::-webkit-scrollbar {
  background: #cecece;
  height: 5px;
  width: 10px;
}

::-webkit-scrollbar-thumb {
  background: #ffca1e;
  border-radius: 2px;
}

::-webkit-scrollbar-thumb:hover {
  background: #9191da;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 90px;
}

* {
  box-sizing: border-box;
  font-family: IRANYekan;
  transition: filter 0.25s ease;
}

a:hover {
  color: #ffca1e;
}

a {
  text-decoration: none;
  cursor: pointer;
}

.display-flex,
.display-flex-center,
.signup-content,
.signin-content,
.social-login,
.socials {
  display: -webkit-flex;
}

::placeholder {
  font-family: IRANYekan !important;
}

.socials {
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}

.signup {
  margin-top: 0px;
}

.to-the-space {
  height: 90px;
}

a:focus,
a:active {
  text-decoration: none;
  outline: none;
  transition: all 300ms ease 0s;
}

input,
select,
textarea,
button {
  outline: none;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  margin: 0px;
  appearance: none !important;
}

input:focus,
select:focus,
textarea:focus {
  outline: none;
  box-shadow: none !important;
}

input[type=checkbox] {
  appearance: checkbox !important;
}

input[type=radio] {
  appearance: radio !important;
}

img {
  max-width: 100%;
  height: auto;
}

figure {
  margin: 0px;
}

p {
  margin-bottom: 0px;
  font-size: 15px;
  color: rgb(0, 0, 0);
  line-height: 30px;
  cursor: pointer;
}

strong {
  font-weight: 600;
}

h2 {
  margin: 0px;
  padding: 0px;
  font-weight: normal;
  color: rgb(34, 34, 34);
  font-size: 36px;
}

.main {
  background: rgb(248, 248, 248);
  padding: 150px 0px;
}

.clear {
  clear: both;
}

.container-box {
  width: 1000px;
  background: rgb(240, 236, 255);
  margin: 0px auto;
  box-shadow: rgba(0, 0, 0, 0.05) 0px 15px 16.83px 0.17px;
  border-radius: 20px;
}

.display-flex {
  justify-content: space-between;
  align-items: center;
}

.display-flex-center {
  justify-content: center;
  align-items: center;
}

.position-center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.form-body {
  background: rgb(35, 35, 35);
}

.signup {
  margin-bottom: 150px;
  direction: rtl;
}

.signup-content {
  padding: 55px 0px 55px;
  text-align: right;
}

.signup-form,
.signup-image,
.signin-form,
.signin-image {
  width: 50%;
  overflow: hidden;
}

.signup-image {
  margin: 0px 55px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.form-title {
  font-size: 30px;
}

.form-title h2 {
  font-size: 26px;
  margin-bottom: 20px;
}

.signup-form input {
  background-color: transparent;
}

.signup-image {
  margin-top: 45px;
}

figure {
  margin-bottom: 50px;
  text-align: center;
}

.form-submit {
  display: inline-block;
  background: rgb(59, 31, 158);
  border-bottom: none;
  width: auto;
  padding: 8px 39px;
  border-radius: 24px;
  font-size: 18px;
  margin-top: 5px;
  font-family: "IRANYekanWeb";
  cursor: pointer;
  color: rgb(255, 255, 255) !important;
}

.form-submit:hover {
  background: rgb(31, 1, 116);
}

.register-form {
  width: 100%;
}

.form-group {
  position: relative;
  margin-bottom: 5px;
}

.form-group:last-child {
  margin-bottom: 0px;
}

input {
  direction: rtl;
}

input::-webkit-input-placeholder {
  color: #fff;
  font-family: "IRANYekanWeb";
  font-size: 16px;
}

input::placeholder {
  color: rgb(0, 0, 0) !important;
}

input:hover,
input:focus,
input:active {
  color: rgb(0, 0, 0);
}

input:focus::-webkit-input-placeholder {
  color: rgb(0, 0, 0);
}

input[type=checkbox]:not(old) {
  width: 18px;
  margin: 0px;
  padding: 13px;
  font-size: 4em;
  height: 44px;
}

.checkbox-group {
  display: flex;
  align-items: center;
}

.form-group.checkbox-group input {
  height: 25px;
}

.checkbox-group label {
  margin-right: 10px;
}

input[type=checkbox]:not(old) + label {
  display: flex;
  align-items: center;
  line-height: 1.5em;
  font-size: 12px;
}

label {
  display: block;
  margin-bottom: 5px;
}

input[type=checkbox]:not(old) + label > span {
  display: inline-block;
  width: 0px;
  height: 0px;
  margin-right: 5px;
  margin-bottom: 3px;
  border: none;
  border-radius: 2px;
  background: none;
  vertical-align: bottom;
}

.label {
  position: absolute;
  right: 20px;
  top: 24px;
  transform: translateY(-50%);
  color: rgb(34, 34, 34);
}

.label-has-error {
  top: 22%;
}

label.error {
  position: relative;
  background-position-y: 3px;
  padding-left: 20px;
  display: block;
  margin-top: 20px;
}

label.valid {
  display: block;
  position: absolute;
  right: 0px;
  left: auto;
  margin-top: -6px;
  width: 20px;
  height: 20px;
  background: transparent;
}

label.valid::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  font-size: 16px;
  color: green;
}

.label-agree-term {
  position: relative;
  top: 0%;
  transform: translateY(0px);
}

.material-icons-name {
  font-size: 18px;
}

.socials li {
  padding: 5px;
}

.socials li:last-child {
  margin-right: 0px;
}

.socials li a {
  text-decoration: none;
}

.socials li a i {
  width: 30px;
  height: 30px;
  color: rgb(255, 255, 255);
  font-size: 14px;
  border-radius: 5px;
  transform: translateZ(0px);
  transition-duration: 0.3s;
  transition-property: transform;
  transition-timing-function: ease-out;
}

.socials li:hover a i {
  transform: scale(1.3) translateZ(0px);
}

.input-field div.error {
  position: relative;
  top: -1rem;
  left: 3rem;
  font-size: 0.8rem;
  color: rgb(255, 64, 129);
  transform: translateY(0%);
}

.mini-padding {
  padding: 0 25px;
}

.rounded {
  border-radius: 8px;
}

.medium-top-space {
  margin-top: 25px;
}

.mini-padding {
  padding: 0 25px;
}

.rounded {
  border-radius: 8px;
}

.medium-top-space {
  margin-top: 25px;
}

@media (min-width: 1200px) {
  .main-container {
    max-width: 80vw;
  }
}
@media (max-width: 1200px) {
  .main-container {
    max-width: 100vw;
  }
}
@media only screen and (min-width: 1347px) and (max-width: 1366px) {
  .max {
    margin-top: 20px;
  }
}
@media only screen and (min-width: 1347px) and (max-width: 1366px) {
  .max {
    margin-top: 0px;
  }
}
@media only screen and (min-width: 1536px) {
  .max {
    max-width: 2500px;
  }
  .no-padding {
    padding: 0px;
  }
}
@media only screen and (min-width: 3002px) and (max-width: 4000px) {
  .max {
    max-width: 1600px;
    margin-top: 0px;
  }
}
@media only screen and (min-width: 4001px) and (max-width: 6144px) {
  .max {
    max-width: 1600px;
    margin-top: 0px;
  }
}
@media only screen and (min-width: 3002px) and (max-width: 4000px) {
  .max {
    max-width: 1600px;
    margin-top: 0px;
  }
}
/**
 * Owl Carousel v2.2.1
 * Copyright 2013-2017 David Deutsch
 * Licensed under  ()
 */
.owl-theme .owl-dots,
.owl-theme .owl-nav {
  text-align: center;
  -webkit-tap-highlight-color: transparent;
}

.owl-theme .owl-nav {
  margin-top: 10px;
}

.owl-theme .owl-nav [class*=owl-] {
  color: #fff;
  font-size: 14px;
  margin: 5px;
  padding: 4px 7px;
  background: #d6d6d6;
  display: inline-block;
  cursor: pointer;
  border-radius: 3px;
  position: absolute;
}

.owl-theme .owl-nav [class*=owl-]:hover {
  background: #869791;
  color: #fff;
  text-decoration: none;
}

.owl-theme .owl-nav .disabled {
  opacity: 0.5;
  cursor: default;
}

.owl-theme .owl-nav.disabled + .owl-dots {
  margin-top: 10px;
}

.owl-theme .owl-dots .owl-dot {
  display: inline-block;
  zoom: 1;
}

.owl-theme .owl-dots .owl-dot span {
  width: 6px;
  height: 6px;
  margin: 5px 7px;
  background: #d6d6d6;
  display: block;
  transition: opacity 0.2s ease;
}

.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
  background: #869791;
}

/**
 * Owl Carousel v2.3.4
 * Copyright 2013-2018 David Deutsch
 * Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE
 */
.owl-carousel,
.owl-carousel .owl-item {
  -webkit-tap-highlight-color: none !important;
  position: relative;
}

.owl-carousel {
  display: none;
  width: 100%;
  z-index: 1;
}

.owl-carousel .owl-stage {
  position: relative;
  -ms-touch-action: pan-Y;
  touch-action: manipulation;
}

.owl-carousel .owl-stage:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

.owl-carousel .owl-stage-outer {
  position: relative;
  overflow: hidden;
}

.owl-carousel .owl-item {
  min-height: 1px;
  float: left;
  -webkit-touch-callout: none;
}

.owl-carousel .owl-item img {
  display: block;
  width: 100%;
}

.owl-carousel .owl-dots.disabled,
.owl-carousel .owl-nav.disabled {
  display: none;
}

.no-js .owl-carousel,
.owl-carousel.owl-loaded {
  display: block;
}

.owl-carousel .owl-dot,
.owl-carousel .owl-nav .owl-next,
.owl-carousel .owl-nav .owl-prev {
  cursor: pointer;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.owl-carousel .owl-nav button.owl-next,
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel button.owl-dot {
  background: 0 0;
  color: inherit;
  border: none;
  padding: 0 !important;
  font: inherit;
}

.owl-carousel.owl-loading {
  opacity: 0;
  display: block;
}

.owl-carousel.owl-hidden {
  opacity: 0;
}

.owl-carousel.owl-refresh .owl-item {
  visibility: hidden;
}

.owl-carousel.owl-drag .owl-item {
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.owl-carousel.owl-grab {
  cursor: move;
  cursor: grab;
}

.owl-carousel.owl-rtl {
  direction: rtl;
}

.owl-carousel.owl-rtl .owl-item {
  float: right;
}

.owl-carousel .animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}

.owl-carousel .owl-animated-in {
  z-index: 0;
}

.owl-carousel .owl-animated-out {
  z-index: 1;
}

.owl-carousel .fadeOut {
  animation-name: fadeOut;
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.owl-height {
  transition: height 0.5s ease-in-out;
}

.owl-carousel .owl-item .owl-lazy {
  opacity: 0;
  transition: opacity 0.4s ease;
}

.owl-carousel .owl-item .owl-lazy:not([src]),
.owl-carousel .owl-item .owl-lazy[src^=""] {
  max-height: 0;
}

.owl-carousel .owl-item img.owl-lazy {
  transform-style: preserve-3d;
}

.owl-carousel .owl-video-wrapper {
  position: relative;
  height: 100%;
  background: #000;
}

.owl-carousel .owl-video-play-icon {
  position: absolute;
  height: 80px;
  width: 80px;
  left: 50%;
  top: 50%;
  margin-left: -40px;
  margin-top: -40px;
  background: url(owl.video.play.png) no-repeat;
  cursor: pointer;
  z-index: 1;
  transition: transform 0.1s ease;
}

.owl-carousel .owl-video-play-icon:hover {
  -ms-transform: scale(1.3, 1.3);
  transform: scale(1.3, 1.3);
}

.owl-carousel .owl-video-playing .owl-video-play-icon,
.owl-carousel .owl-video-playing .owl-video-tn {
  display: none;
}

.owl-carousel .owl-video-tn {
  opacity: 0;
  height: 100%;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  transition: opacity 0.4s ease;
}

.owl-carousel .owl-video-frame {
  position: relative;
  z-index: 1;
  height: 100%;
  width: 100%;
}

.no-padding {
  padding: 0;
}

.centeral-page {
  max-width: 100vw !important;
  overflow: hidden;
}

.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.mini-padding {
  padding: 0 25px;
}

.rounded {
  border-radius: 8px;
}

.medium-top-space {
  margin-top: 25px;
}

.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.credit {
  background: #fff;
  position: relative;
  display: inline-block;
  padding: 10px 20px;
  border: 1px solid #ddd;
  border-radius: 20px;
}

#whatsapp-chat {
  position: fixed;
  background: #fff;
  width: 350px;
  border-radius: 10px;
  box-shadow: 0 1px 15px rgba(32, 33, 36, 0.28);
  bottom: 100px;
  z-index: 100000000000000000;
  overflow: hidden;
  z-index: 99;
  animation-name: showchat;
  animation-duration: 1s;
  transform: scale(1);
}

.bamikkalashow-chat {
  background: linear-gradient(to right top, #b7ed78, #19c24f);
  color: #fff;
  position: fixed;
  direction: rtl;
  z-index: 98;
  bottom: 25px;
  z-index: 100000000000000;
  font-size: 15px;
  padding: 1px 12px;
  height: 60px;
  width: 60px;
  border-radius: 50px;
  box-shadow: 0 1px 15px rgba(32, 33, 36, 0.28);
  display: flex;
  align-items: center;
  justify-content: space-between;
  animation: ripple 2s linear infinite;
  outline: none;
  border: none;
  transition: all 0.3s linear 0s;
}

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

.wp-logo {
  width: 50px;
  height: 50px;
  padding: 5px;
  background-color: #fff;
  box-shadow: 0 0 0 6px rgba(0, 0, 0, 0.06);
  object-fit: contain;
  border-radius: 50%;
}

.wp-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 50%;
}

@keyframes ripple {
  0% {
    box-shadow: 0 0 0 0 rgba(36, 255, 164, 0.3), 0 0 0 10px rgba(2, 207, 169, 0.113);
  }
  100% {
    box-shadow: 0 0 0 12px rgb(184, 253, 200), 0 0 0 10px rgba(2, 207, 169, 0.057);
  }
}
.bamikkalashow-chat:hover {
  width: 140px;
}

.bamikkalashow-chat:hover .chatwidget-text {
  display: block;
}

.chatwidget-text {
  display: none;
  margin-right: 10px;
  animation-name: showchat;
  animation-duration: 1s;
  font-size: 13px;
  font-weight: 600;
  transition: all ease-in-out 0.4s;
}

.bamikkalashow-chat i {
  transform: scale(1.2);
  animation-name: showchat;
  animation-duration: 1s;
  transition: all 0.3s linear 0s;
  font-size: 35px;
}

.mdi-whatsapp {
  transition: all 1s ease;
}

.mdi-close {
  transition: all 1s ease;
}

.header-chat {
  background: linear-gradient(80deg, #34af80, #34af57 130%);
  color: #fff;
  padding: 25px 20px;
  direction: rtl;
}

.text-header {
  display: flex;
  flex-direction: column;
  margin-right: 10px;
}

.header-chat h3 {
  margin-bottom: 8px;
  font-size: 22px;
  font-weight: 800;
  font-family: KalamehWeb;
}

.header-chat p {
  font-size: 12px;
  line-height: 1.7;
  margin: 0;
  color: #fff;
}

.info-avatar {
  position: relative;
  direction: rtl;
  height: 55px;
  width: 55px;
  object-fit: cover;
  border-radius: 100%;
}

.info-avatar img {
  border-radius: 100%;
  width: 100%;
  height: 100%;
  object-fit: cover;
  margin-left: 10px;
}

.info-avatar:before {
  content: "\f5a3";
  z-index: 1;
  font-family: "Material Design Icons";
  background: #34af7c;
  color: #fff;
  width: 24px;
  display: flex;
  border-radius: 100%;
  position: absolute;
  top: 30px;
  font-size: 18px;
  left: -15px;
  height: 24px;
  align-items: center;
  justify-content: center;
}

a.information {
  padding: 10px 20px;
  display: flex;
  overflow: hidden;
  animation-name: showhide;
  direction: rtl;
  margin-bottom: 10px;
  border-right: 3px solid #34af7c;
  animation-duration: 2s;
  text-align: right;
  background-color: #fff;
}

a.information:hover {
  background: #f1f1f1;
}

.info-chat span {
  display: block;
  color: #000;
}

.info-chat {
  margin-right: 20px;
}

#get-label,
span.chat-label {
  font-size: 12px;
  color: #888;
}

#get-name,
span.chat-nama {
  margin: 5px 0 0;
  font-size: 15px;
  font-weight: 800;
  color: #222;
}

#get-label,
#get-name {
  color: #fff;
}

span.my-number {
  display: none;
}

.bamikkala-msg {
  color: #444;
  padding: 20px;
  font-size: 12.5px;
  text-align: center;
  border-top: 1px solid #ddd;
  direction: rtl;
  text-align: right;
}

.bamikkala-msg a {
  font-weight: 600;
  color: #34af7c;
}

textarea#chat-input {
  border: none;
  color: #000 !important;
  width: 100%;
  height: 40px;
  outline: none;
  resize: none;
  border-radius: 6px;
  background: #f7f7f7;
  padding: 10px 8px;
  text-align: right;
  direction: rtl;
}

a#send-it {
  color: #fff;
  width: 75px;
  font-size: 22px;
  margin-right: 5px;
  font-weight: 800;
  padding: 3px 10px;
  background: linear-gradient(80deg, #34af80, #34af57 130%);
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.first-msg {
  background-color: #f5f5f5;
  background-image: url(/assets/images/vectors/wp.webp);
  background-size: cover;
  background-repeat: no-repeat;
  padding: 30px 15px;
  text-align: center;
}

.chat-parent {
  background-color: #f5f5f5;
  background-image: url(/assets/images/vectors/wp.webp);
  background-size: cover;
  background-repeat: no-repeat;
}

.first-msg span {
  background: #e2e2e2;
  color: #333;
  font-size: 13px;
  line-height: 1.7;
  border-radius: 7px;
  padding: 12px 12px;
  display: inline-block;
  text-align: right;
  direction: rtl;
}

.start-chat .bamikkala-msg {
  display: flex;
}

#get-number {
  display: none;
}

a.close-chat {
  position: absolute;
  top: 5px;
  left: 15px;
  color: #fff;
  font-size: 20px;
}

@keyframes showhide {
  from {
    transform: scale(0.5);
    opacity: 0;
  }
}
@keyframes showchat {
  from {
    transform: scale(0);
    opacity: 0;
  }
}
@media screen and (max-width: 480px) {
  #whatsapp-chat {
    width: auto;
    left: 5%;
    right: 5%;
    font-size: 80%;
  }
}
/* 
 */
.hide {
  display: none;
  animation-name: showhide;
  animation-duration: 1.5s;
  transform: scale(1);
  opacity: 1;
}

article .show {
  display: block;
  animation-name: showhide;
  animation-duration: 1.5s;
  transform: scale(1);
  opacity: 1;
}

.chat-parent {
  padding: 15px;
}

.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.mini-padding {
  padding: 0 25px;
}

.rounded {
  border-radius: 8px;
}

.medium-top-space {
  margin-top: 25px;
}

.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

/*! lightgallery - v1.10.0 - 2020-11-07
* http://sachinchoolur.github.io/lightGallery/
* Copyright (c) 2020 Sachin N; Licensed GPLv3 */
@font-face {
  font-family: "lg";
  src: url("../fonts/icons/lg.ttf") format("truetype"), url("../fonts/icons/lg.woff") format("woff"), url("../fonts/icons/lg.svg") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
.lg-icon {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "lg" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.lg-actions .lg-next,
.lg-actions .lg-prev {
  background-color: rgba(0, 0, 0, 0.45);
  border-radius: 2px;
  color: #999;
  cursor: pointer;
  display: block;
  font-size: 22px;
  margin-top: -10px;
  padding: 8px 10px 9px;
  position: absolute;
  top: 50%;
  z-index: 1080;
  border: none;
  outline: none;
}

.lg-actions .lg-next.disabled,
.lg-actions .lg-prev.disabled {
  pointer-events: none;
  opacity: 0.5;
}

.lg-actions .lg-next:hover,
.lg-actions .lg-prev:hover {
  color: #FFF;
}

.lg-actions .lg-next {
  right: 20px;
}

.lg-actions .lg-next:before {
  content: "\e095";
}

.lg-actions .lg-prev {
  left: 20px;
}

.lg-actions .lg-prev:after {
  content: "\e094";
}

@-webkit-keyframes lg-right-end {
  0% {
    left: 0;
  }
  50% {
    left: -30px;
  }
  100% {
    left: 0;
  }
}
@-moz-keyframes lg-right-end {
  0% {
    left: 0;
  }
  50% {
    left: -30px;
  }
  100% {
    left: 0;
  }
}
@-ms-keyframes lg-right-end {
  0% {
    left: 0;
  }
  50% {
    left: -30px;
  }
  100% {
    left: 0;
  }
}
@keyframes lg-right-end {
  0% {
    left: 0;
  }
  50% {
    left: -30px;
  }
  100% {
    left: 0;
  }
}
@-webkit-keyframes lg-left-end {
  0% {
    left: 0;
  }
  50% {
    left: 30px;
  }
  100% {
    left: 0;
  }
}
@-moz-keyframes lg-left-end {
  0% {
    left: 0;
  }
  50% {
    left: 30px;
  }
  100% {
    left: 0;
  }
}
@-ms-keyframes lg-left-end {
  0% {
    left: 0;
  }
  50% {
    left: 30px;
  }
  100% {
    left: 0;
  }
}
@keyframes lg-left-end {
  0% {
    left: 0;
  }
  50% {
    left: 30px;
  }
  100% {
    left: 0;
  }
}
.lg-outer.lg-right-end .lg-object {
  -webkit-animation: lg-right-end 0.3s;
  -o-animation: lg-right-end 0.3s;
  animation: lg-right-end 0.3s;
  position: relative;
}

.lg-outer.lg-left-end .lg-object {
  -webkit-animation: lg-left-end 0.3s;
  -o-animation: lg-left-end 0.3s;
  animation: lg-left-end 0.3s;
  position: relative;
}

.lg-toolbar {
  z-index: 1082;
  left: 0;
  position: absolute;
  top: 5px;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.45);
}

.lg-toolbar .lg-icon {
  color: #999;
  cursor: pointer;
  float: right;
  font-size: 24px;
  height: 47px;
  line-height: 27px;
  padding: 10px 0;
  text-align: center;
  width: 50px;
  text-decoration: none !important;
  outline: medium none;
  background: none;
  border: none;
  box-shadow: none;
  -webkit-transition: color 0.2s linear;
  -o-transition: color 0.2s linear;
  transition: color 0.2s linear;
}

.lg-toolbar .lg-icon:hover {
  color: #FFF;
}

.lg-toolbar .lg-close:after {
  content: "\e070";
}

.lg-toolbar .lg-download:after {
  content: "\e0f2";
}

.lg-sub-html {
  background-color: rgba(0, 0, 0, 0.45);
  bottom: 0;
  color: #EEE;
  font-size: 16px;
  left: 0;
  padding: 10px 40px;
  position: fixed;
  right: 0;
  text-align: center;
  z-index: 1080;
}

.lg-sub-html h4 {
  margin: 0;
  font-size: 13px;
  font-weight: bold;
}

.lg-sub-html p {
  font-size: 12px;
  margin: 5px 0 0;
}

#lg-counter {
  color: #999;
  display: inline-block;
  font-size: 16px;
  padding-left: 20px;
  padding-top: 12px;
  vertical-align: middle;
}

.lg-toolbar,
.lg-prev,
.lg-next {
  opacity: 1;
  -webkit-transition: -webkit-transform 0.35s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 0.35s cubic-bezier(0, 0, 0.25, 1) 0s, color 0.2s linear;
  -moz-transition: -moz-transform 0.35s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 0.35s cubic-bezier(0, 0, 0.25, 1) 0s, color 0.2s linear;
  -o-transition: -o-transform 0.35s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 0.35s cubic-bezier(0, 0, 0.25, 1) 0s, color 0.2s linear;
  transition: transform 0.35s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 0.35s cubic-bezier(0, 0, 0.25, 1) 0s, color 0.2s linear;
}

.lg-hide-items .lg-prev {
  opacity: 0;
  -webkit-transform: translate3d(-10px, 0, 0);
  transform: translate3d(-10px, 0, 0);
}

.lg-hide-items .lg-next {
  opacity: 0;
  -webkit-transform: translate3d(10px, 0, 0);
  transform: translate3d(10px, 0, 0);
}

.lg-hide-items .lg-toolbar {
  opacity: 0;
  -webkit-transform: translate3d(0, -10px, 0);
  transform: translate3d(0, -10px, 0);
}

body:not(.lg-from-hash) .lg-outer.lg-start-zoom .lg-object {
  -webkit-transform: scale3d(0.5, 0.5, 0.5);
  transform: scale3d(0.5, 0.5, 0.5);
  opacity: 0;
  -webkit-transition: -webkit-transform 250ms cubic-bezier(0, 0, 0.25, 1) 0s, opacity 250ms cubic-bezier(0, 0, 0.25, 1) !important;
  -moz-transition: -moz-transform 250ms cubic-bezier(0, 0, 0.25, 1) 0s, opacity 250ms cubic-bezier(0, 0, 0.25, 1) !important;
  -o-transition: -o-transform 250ms cubic-bezier(0, 0, 0.25, 1) 0s, opacity 250ms cubic-bezier(0, 0, 0.25, 1) !important;
  transition: transform 250ms cubic-bezier(0, 0, 0.25, 1) 0s, opacity 250ms cubic-bezier(0, 0, 0.25, 1) !important;
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}

body:not(.lg-from-hash) .lg-outer.lg-start-zoom .lg-item.lg-complete .lg-object {
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  opacity: 1;
}

.lg-outer .lg-thumb-outer {
  background-color: #0D0A0A;
  bottom: 0;
  position: absolute;
  width: 100%;
  z-index: 1080;
  max-height: 350px;
  -webkit-transform: translate3d(0, 100%, 0);
  transform: translate3d(0, 100%, 0);
  -webkit-transition: -webkit-transform 0.25s cubic-bezier(0, 0, 0.25, 1) 0s;
  -moz-transition: -moz-transform 0.25s cubic-bezier(0, 0, 0.25, 1) 0s;
  -o-transition: -o-transform 0.25s cubic-bezier(0, 0, 0.25, 1) 0s;
  transition: transform 0.25s cubic-bezier(0, 0, 0.25, 1) 0s;
}

.lg-outer .lg-thumb-outer.lg-grab .lg-thumb-item {
  cursor: -webkit-grab;
  cursor: -moz-grab;
  cursor: -o-grab;
  cursor: -ms-grab;
  cursor: grab;
}

.lg-outer .lg-thumb-outer.lg-grabbing .lg-thumb-item {
  cursor: move;
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
  cursor: -o-grabbing;
  cursor: -ms-grabbing;
  cursor: grabbing;
}

.lg-outer .lg-thumb-outer.lg-dragging .lg-thumb {
  -webkit-transition-duration: 0s !important;
  transition-duration: 0s !important;
}

.lg-outer.lg-thumb-open .lg-thumb-outer {
  -webkit-transform: translate3d(0, 0%, 0);
  transform: translate3d(0, 0%, 0);
}

.lg-outer .lg-thumb {
  padding: 10px 0;
  height: 100%;
  margin-bottom: -5px;
}

.lg-outer .lg-thumb-item {
  border-radius: 5px;
  cursor: pointer;
  float: left;
  overflow: hidden;
  height: 100%;
  border: 2px solid #FFF;
  border-radius: 4px;
  margin-bottom: 5px;
}

@media (min-width: 1025px) {
  .lg-outer .lg-thumb-item {
    -webkit-transition: border-color 0.25s ease;
    -o-transition: border-color 0.25s ease;
    transition: border-color 0.25s ease;
  }
}
.lg-outer .lg-thumb-item.active,
.lg-outer .lg-thumb-item:hover {
  border-color: #a90707;
}

.lg-outer .lg-thumb-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.lg-outer.lg-has-thumb .lg-item {
  padding-bottom: 120px;
}

.lg-outer.lg-can-toggle .lg-item {
  padding-bottom: 0;
}

.lg-outer.lg-pull-caption-up .lg-sub-html {
  -webkit-transition: bottom 0.25s ease;
  -o-transition: bottom 0.25s ease;
  transition: bottom 0.25s ease;
}

.lg-outer.lg-pull-caption-up.lg-thumb-open .lg-sub-html {
  bottom: 100px;
}

.lg-outer .lg-toogle-thumb {
  background-color: #0D0A0A;
  border-radius: 2px 2px 0 0;
  color: #999;
  cursor: pointer;
  font-size: 24px;
  height: 39px;
  line-height: 27px;
  padding: 5px 0;
  position: absolute;
  right: 20px;
  text-align: center;
  top: -39px;
  width: 50px;
  outline: medium none;
  border: none;
}

.lg-outer .lg-toogle-thumb:after {
  content: "\e1ff";
}

.lg-outer .lg-toogle-thumb:hover {
  color: #FFF;
}

.lg-outer .lg-video-cont {
  display: inline-block;
  vertical-align: middle;
  max-width: 1140px;
  max-height: 100%;
  width: 100%;
  padding: 0 5px;
}

.lg-outer .lg-video {
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
  overflow: hidden;
  position: relative;
}

.lg-outer .lg-video .lg-object {
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
}

.lg-outer .lg-video .lg-video-play {
  width: 84px;
  height: 59px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -42px;
  margin-top: -30px;
  z-index: 1080;
  cursor: pointer;
}

.lg-outer .lg-has-iframe .lg-video {
  -webkit-overflow-scrolling: touch;
  overflow: auto;
}

.lg-outer .lg-has-vimeo .lg-video-play {
  background: url("../img/vimeo-play.webp") no-repeat scroll 0 0 transparent;
}

.lg-outer .lg-has-vimeo:hover .lg-video-play {
  background: url("../img/vimeo-play.webp") no-repeat scroll 0 -58px transparent;
}

.lg-outer .lg-has-html5 .lg-video-play {
  background: transparent url("../img/video-play.webp") no-repeat scroll 0 0;
  height: 64px;
  margin-left: -32px;
  margin-top: -32px;
  width: 64px;
  opacity: 0.8;
}

.lg-outer .lg-has-html5:hover .lg-video-play {
  opacity: 1;
}

.lg-outer .lg-has-youtube .lg-video-play {
  background: url("../img/youtube-play.webp") no-repeat scroll 0 0 transparent;
}

.lg-outer .lg-has-youtube:hover .lg-video-play {
  background: url("../img/youtube-play.webp") no-repeat scroll 0 -60px transparent;
}

.lg-outer .lg-video-object {
  width: 100% !important;
  height: 100% !important;
  position: absolute;
  top: 0;
  left: 0;
}

.lg-outer .lg-has-video .lg-video-object {
  visibility: hidden;
}

.lg-outer .lg-has-video.lg-video-playing .lg-object,
.lg-outer .lg-has-video.lg-video-playing .lg-video-play {
  display: none;
}

.lg-outer .lg-has-video.lg-video-playing .lg-video-object {
  visibility: visible;
}

.lg-progress-bar {
  background-color: #333;
  height: 5px;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1083;
  opacity: 0;
  -webkit-transition: opacity 0.08s ease 0s;
  -moz-transition: opacity 0.08s ease 0s;
  -o-transition: opacity 0.08s ease 0s;
  transition: opacity 0.08s ease 0s;
}

.lg-progress-bar .lg-progress {
  background-color: #a90707;
  height: 5px;
  width: 0;
}

.lg-progress-bar.lg-start .lg-progress {
  width: 100%;
}

.lg-show-autoplay .lg-progress-bar {
  opacity: 1;
}

.lg-autoplay-button:after {
  content: "\e01d";
}

.lg-show-autoplay .lg-autoplay-button:after {
  content: "\e01a";
}

.lg-outer.lg-css3.lg-zoom-dragging .lg-item.lg-complete.lg-zoomable .lg-img-wrap,
.lg-outer.lg-css3.lg-zoom-dragging .lg-item.lg-complete.lg-zoomable .lg-image {
  -webkit-transition-duration: 0s;
  transition-duration: 0s;
}

.lg-outer.lg-use-transition-for-zoom .lg-item.lg-complete.lg-zoomable .lg-img-wrap {
  -webkit-transition: -webkit-transform 0.3s cubic-bezier(0, 0, 0.25, 1) 0s;
  -moz-transition: -moz-transform 0.3s cubic-bezier(0, 0, 0.25, 1) 0s;
  -o-transition: -o-transform 0.3s cubic-bezier(0, 0, 0.25, 1) 0s;
  transition: transform 0.3s cubic-bezier(0, 0, 0.25, 1) 0s;
}

.lg-outer.lg-use-left-for-zoom .lg-item.lg-complete.lg-zoomable .lg-img-wrap {
  -webkit-transition: left 0.3s cubic-bezier(0, 0, 0.25, 1) 0s, top 0.3s cubic-bezier(0, 0, 0.25, 1) 0s;
  -moz-transition: left 0.3s cubic-bezier(0, 0, 0.25, 1) 0s, top 0.3s cubic-bezier(0, 0, 0.25, 1) 0s;
  -o-transition: left 0.3s cubic-bezier(0, 0, 0.25, 1) 0s, top 0.3s cubic-bezier(0, 0, 0.25, 1) 0s;
  transition: left 0.3s cubic-bezier(0, 0, 0.25, 1) 0s, top 0.3s cubic-bezier(0, 0, 0.25, 1) 0s;
}

.lg-outer .lg-item.lg-complete.lg-zoomable .lg-img-wrap {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
}

.lg-outer .lg-item.lg-complete.lg-zoomable .lg-image {
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  -webkit-transition: -webkit-transform 0.3s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 0.15s !important;
  -moz-transition: -moz-transform 0.3s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 0.15s !important;
  -o-transition: -o-transform 0.3s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 0.15s !important;
  transition: transform 0.3s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 0.15s !important;
  -webkit-transform-origin: 0 0;
  -moz-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
}

#lg-zoom-in:after {
  content: "\e311";
}

#lg-actual-size {
  font-size: 20px;
}

#lg-actual-size:after {
  content: "\e033";
}

#lg-zoom-out {
  opacity: 0.5;
  pointer-events: none;
}

#lg-zoom-out:after {
  content: "\e312";
}

.lg-zoomed #lg-zoom-out {
  opacity: 1;
  pointer-events: auto;
}

.lg-outer .lg-pager-outer {
  bottom: 60px;
  left: 0;
  position: absolute;
  right: 0;
  text-align: center;
  z-index: 1080;
  height: 10px;
}

.lg-outer .lg-pager-outer.lg-pager-hover .lg-pager-cont {
  overflow: visible;
}

.lg-outer .lg-pager-cont {
  cursor: pointer;
  display: inline-block;
  overflow: hidden;
  position: relative;
  vertical-align: top;
  margin: 0 5px;
}

.lg-outer .lg-pager-cont:hover .lg-pager-thumb-cont {
  opacity: 1;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.lg-outer .lg-pager-cont.lg-pager-active .lg-pager {
  box-shadow: 0 0 0 2px white inset;
}

.lg-outer .lg-pager-thumb-cont {
  background-color: #fff;
  color: #FFF;
  bottom: 100%;
  height: 83px;
  left: 0;
  margin-bottom: 20px;
  margin-left: -60px;
  opacity: 0;
  padding: 5px;
  position: absolute;
  width: 120px;
  border-radius: 3px;
  -webkit-transition: opacity 0.15s ease 0s, -webkit-transform 0.15s ease 0s;
  -moz-transition: opacity 0.15s ease 0s, -moz-transform 0.15s ease 0s;
  -o-transition: opacity 0.15s ease 0s, -o-transform 0.15s ease 0s;
  transition: opacity 0.15s ease 0s, transform 0.15s ease 0s;
  -webkit-transform: translate3d(0, 5px, 0);
  transform: translate3d(0, 5px, 0);
}

.lg-outer .lg-pager-thumb-cont img {
  width: 100%;
  height: 100%;
}

.lg-outer .lg-pager {
  background-color: rgba(255, 255, 255, 0.5);
  border-radius: 50%;
  box-shadow: 0 0 0 8px rgba(255, 255, 255, 0.7) inset;
  display: block;
  height: 12px;
  -webkit-transition: box-shadow 0.3s ease 0s;
  -o-transition: box-shadow 0.3s ease 0s;
  transition: box-shadow 0.3s ease 0s;
  width: 12px;
}

.lg-outer .lg-pager:hover,
.lg-outer .lg-pager:focus {
  box-shadow: 0 0 0 8px white inset;
}

.lg-outer .lg-caret {
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px dashed;
  bottom: -10px;
  display: inline-block;
  height: 0;
  left: 50%;
  margin-left: -5px;
  position: absolute;
  vertical-align: middle;
  width: 0;
}

.lg-fullscreen:after {
  content: "\e20c";
}

.lg-fullscreen-on .lg-fullscreen:after {
  content: "\e20d";
}

.lg-outer #lg-dropdown-overlay {
  background-color: rgba(0, 0, 0, 0.25);
  bottom: 0;
  cursor: default;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 1081;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: visibility 0s linear 0.18s, opacity 0.18s linear 0s;
  -o-transition: visibility 0s linear 0.18s, opacity 0.18s linear 0s;
  transition: visibility 0s linear 0.18s, opacity 0.18s linear 0s;
}

.lg-outer.lg-dropdown-active .lg-dropdown,
.lg-outer.lg-dropdown-active #lg-dropdown-overlay {
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
  -moz-transform: translate3d(0, 0px, 0);
  -o-transform: translate3d(0, 0px, 0);
  -ms-transform: translate3d(0, 0px, 0);
  -webkit-transform: translate3d(0, 0px, 0);
  transform: translate3d(0, 0px, 0);
  opacity: 1;
  visibility: visible;
}

.lg-outer.lg-dropdown-active #lg-share {
  color: #FFF;
}

.lg-outer .lg-dropdown {
  background-color: #fff;
  border-radius: 2px;
  font-size: 14px;
  list-style-type: none;
  margin: 0;
  padding: 10px 0;
  position: absolute;
  right: 0;
  text-align: left;
  top: 50px;
  opacity: 0;
  visibility: hidden;
  -moz-transform: translate3d(0, 5px, 0);
  -o-transform: translate3d(0, 5px, 0);
  -ms-transform: translate3d(0, 5px, 0);
  -webkit-transform: translate3d(0, 5px, 0);
  transform: translate3d(0, 5px, 0);
  -webkit-transition: -webkit-transform 0.18s linear 0s, visibility 0s linear 0.5s, opacity 0.18s linear 0s;
  -moz-transition: -moz-transform 0.18s linear 0s, visibility 0s linear 0.5s, opacity 0.18s linear 0s;
  -o-transition: -o-transform 0.18s linear 0s, visibility 0s linear 0.5s, opacity 0.18s linear 0s;
  transition: transform 0.18s linear 0s, visibility 0s linear 0.5s, opacity 0.18s linear 0s;
}

.lg-outer .lg-dropdown:after {
  content: "";
  display: block;
  height: 0;
  width: 0;
  position: absolute;
  border: 8px solid transparent;
  border-bottom-color: #FFF;
  right: 16px;
  top: -16px;
}

.lg-outer .lg-dropdown > li:last-child {
  margin-bottom: 0px;
}

.lg-outer .lg-dropdown > li:hover a,
.lg-outer .lg-dropdown > li:hover .lg-icon {
  color: #333;
}

.lg-outer .lg-dropdown a {
  color: #333;
  display: block;
  white-space: pre;
  padding: 4px 12px;
  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 12px;
}

.lg-outer .lg-dropdown a:hover {
  background-color: rgba(0, 0, 0, 0.07);
}

.lg-outer .lg-dropdown .lg-dropdown-text {
  display: inline-block;
  line-height: 1;
  margin-top: -3px;
  vertical-align: middle;
}

.lg-outer .lg-dropdown .lg-icon {
  color: #333;
  display: inline-block;
  float: none;
  font-size: 20px;
  height: auto;
  line-height: 1;
  margin-right: 8px;
  padding: 0;
  vertical-align: middle;
  width: auto;
}

.lg-outer #lg-share {
  position: relative;
}

.lg-outer #lg-share:after {
  content: "\e80d";
}

.lg-outer #lg-share-facebook .lg-icon {
  color: #3b5998;
}

.lg-outer #lg-share-facebook .lg-icon:after {
  content: "\e904";
}

.lg-outer #lg-share-twitter .lg-icon {
  color: #00aced;
}

.lg-outer #lg-share-twitter .lg-icon:after {
  content: "\e907";
}

.lg-outer #lg-share-googleplus .lg-icon {
  color: #dd4b39;
}

.lg-outer #lg-share-googleplus .lg-icon:after {
  content: "\e905";
}

.lg-outer #lg-share-pinterest .lg-icon {
  color: #cb2027;
}

.lg-outer #lg-share-pinterest .lg-icon:after {
  content: "\e906";
}

.lg-outer .lg-img-rotate {
  position: absolute;
  padding: 0 5px;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.32, 0, 0.67, 0) 0s;
  -moz-transition: -moz-transform 0.3s cubic-bezier(0.32, 0, 0.67, 0) 0s;
  -o-transition: -o-transform 0.3s cubic-bezier(0.32, 0, 0.67, 0) 0s;
  transition: transform 0.3s cubic-bezier(0.32, 0, 0.67, 0) 0s;
}

.lg-rotate-left:after {
  content: "\e900";
}

.lg-rotate-right:after {
  content: "\e901";
}

.lg-icon.lg-flip-hor,
.lg-icon.lg-flip-ver {
  font-size: 26px;
}

.lg-flip-ver:after {
  content: "\e903";
}

.lg-flip-hor:after {
  content: "\e902";
}

.lg-group:after {
  content: "";
  display: table;
  clear: both;
}

.lg-outer {
  width: 95%;
  height: 78%;
  position: fixed;
  top: 131px;
  left: 50px;
  z-index: 1050;
  text-align: left;
  opacity: 0;
  outline: none;
  -webkit-transition: opacity 0.15s ease 0s;
  -o-transition: opacity 0.15s ease 0s;
  transition: opacity 0.15s ease 0s;
}

.lg-outer * {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.lg-outer.lg-visible {
  opacity: 1;
}

.lg-outer.lg-css3 .lg-item.lg-prev-slide,
.lg-outer.lg-css3 .lg-item.lg-next-slide,
.lg-outer.lg-css3 .lg-item.lg-current {
  -webkit-transition-duration: inherit !important;
  transition-duration: inherit !important;
  -webkit-transition-timing-function: inherit !important;
  transition-timing-function: inherit !important;
}

.lg-outer.lg-css3.lg-dragging .lg-item.lg-prev-slide,
.lg-outer.lg-css3.lg-dragging .lg-item.lg-next-slide,
.lg-outer.lg-css3.lg-dragging .lg-item.lg-current {
  -webkit-transition-duration: 0s !important;
  transition-duration: 0s !important;
  opacity: 1;
}

.lg-outer.lg-grab img.lg-object {
  cursor: -webkit-grab;
  cursor: -moz-grab;
  cursor: -o-grab;
  cursor: -ms-grab;
  cursor: grab;
}

.lg-outer.lg-grabbing img.lg-object {
  cursor: move;
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
  cursor: -o-grabbing;
  cursor: -ms-grabbing;
  cursor: grabbing;
}

.lg-outer .lg {
  height: 100%;
  width: 100%;
  position: relative;
  overflow: hidden;
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
  max-height: 100%;
}

.lg-outer .lg-inner {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  white-space: nowrap;
}

.lg-outer .lg-item {
  background: url("../img/loading.gif") no-repeat scroll center center transparent;
  display: none !important;
}

.lg-outer.lg-css3 .lg-prev-slide,
.lg-outer.lg-css3 .lg-current,
.lg-outer.lg-css3 .lg-next-slide {
  display: inline-block !important;
}

.lg-outer.lg-css .lg-current {
  display: inline-block !important;
}

.lg-outer .lg-item,
.lg-outer .lg-img-wrap {
  display: inline-block;
  text-align: center;
  position: absolute;
  width: 100%;
  height: 100%;
}

.lg-outer .lg-item:before,
.lg-outer .lg-img-wrap:before {
  content: "";
  display: inline-block;
  height: 50%;
  width: 1px;
  margin-right: -1px;
}

.lg-outer .lg-img-wrap {
  position: absolute;
  padding: 0 5px;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

.lg-outer .lg-item.lg-complete {
  background-image: none;
}

.lg-outer .lg-item.lg-current {
  z-index: 1060;
}

.lg-outer .lg-image {
  display: inline-block;
  vertical-align: middle;
  max-width: 100%;
  max-height: 100%;
  width: auto !important;
  height: auto !important;
}

.lg-outer.lg-show-after-load .lg-item .lg-object,
.lg-outer.lg-show-after-load .lg-item .lg-video-play {
  opacity: 0;
  -webkit-transition: opacity 0.15s ease 0s;
  -o-transition: opacity 0.15s ease 0s;
  transition: opacity 0.15s ease 0s;
}

.lg-outer.lg-show-after-load .lg-item.lg-complete .lg-object,
.lg-outer.lg-show-after-load .lg-item.lg-complete .lg-video-play {
  opacity: 1;
}

.lg-outer .lg-empty-html {
  display: none;
}

.lg-outer.lg-hide-download #lg-download {
  display: none;
}

.lg-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1040;
  background-color: #000;
  opacity: 0;
  -webkit-transition: opacity 0.15s ease 0s;
  -o-transition: opacity 0.15s ease 0s;
  transition: opacity 0.15s ease 0s;
}

.lg-backdrop.in {
  opacity: 1;
}

.lg-css3.lg-no-trans .lg-prev-slide,
.lg-css3.lg-no-trans .lg-next-slide,
.lg-css3.lg-no-trans .lg-current {
  -webkit-transition: none 0s ease 0s !important;
  -moz-transition: none 0s ease 0s !important;
  -o-transition: none 0s ease 0s !important;
  transition: none 0s ease 0s !important;
}

.lg-css3.lg-use-css3 .lg-item {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
}

.lg-css3.lg-use-left .lg-item {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  backface-visibility: hidden;
}

.lg-css3.lg-fade .lg-item {
  opacity: 0;
}

.lg-css3.lg-fade .lg-item.lg-current {
  opacity: 1;
}

.lg-css3.lg-fade .lg-item.lg-prev-slide,
.lg-css3.lg-fade .lg-item.lg-next-slide,
.lg-css3.lg-fade .lg-item.lg-current {
  -webkit-transition: opacity 0.1s ease 0s;
  -moz-transition: opacity 0.1s ease 0s;
  -o-transition: opacity 0.1s ease 0s;
  transition: opacity 0.1s ease 0s;
}

.lg-css3.lg-slide.lg-use-css3 .lg-item {
  opacity: 0;
}

.lg-css3.lg-slide.lg-use-css3 .lg-item.lg-prev-slide {
  -webkit-transform: translate3d(-100%, 0, 0);
  transform: translate3d(-100%, 0, 0);
}

.lg-css3.lg-slide.lg-use-css3 .lg-item.lg-next-slide {
  -webkit-transform: translate3d(100%, 0, 0);
  transform: translate3d(100%, 0, 0);
}

.lg-css3.lg-slide.lg-use-css3 .lg-item.lg-current {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  opacity: 1;
}

.lg-css3.lg-slide.lg-use-css3 .lg-item.lg-prev-slide,
.lg-css3.lg-slide.lg-use-css3 .lg-item.lg-next-slide,
.lg-css3.lg-slide.lg-use-css3 .lg-item.lg-current {
  -webkit-transition: -webkit-transform 1s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 0.1s ease 0s;
  -moz-transition: -moz-transform 1s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 0.1s ease 0s;
  -o-transition: -o-transform 1s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 0.1s ease 0s;
  transition: transform 1s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 0.1s ease 0s;
}

.lg-css3.lg-slide.lg-use-left .lg-item {
  opacity: 0;
  position: absolute;
  left: 0;
}

.lg-css3.lg-slide.lg-use-left .lg-item.lg-prev-slide {
  left: -100%;
}

.lg-css3.lg-slide.lg-use-left .lg-item.lg-next-slide {
  left: 100%;
}

.lg-css3.lg-slide.lg-use-left .lg-item.lg-current {
  left: 0;
  opacity: 1;
}

.lg-css3.lg-slide.lg-use-left .lg-item.lg-prev-slide,
.lg-css3.lg-slide.lg-use-left .lg-item.lg-next-slide,
.lg-css3.lg-slide.lg-use-left .lg-item.lg-current {
  -webkit-transition: left 1s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 0.1s ease 0s;
  -moz-transition: left 1s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 0.1s ease 0s;
  -o-transition: left 1s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 0.1s ease 0s;
  transition: left 1s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 0.1s ease 0s;
}


.more {
  height: 40px;
}

.carousel {
  padding: 0px;
}

.carousel-inner {
  width: 100%;
  overflow: hidden;
  height: 400px;
  object-fit: contain;
}

.form-control::placeholder {
  text-align: right;
  font-size: 13px;
}

.carousel-item {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.color-hero {
  padding-bottom: 6rem;
}

.display-flex,
.display-flex-center,
.signup-content,
.signin-content,
.social-login,
.socials {
  display: -webkit-flex;
}

.new-courses .nw-cr {
  margin-bottom: 2rem;
}

.nothing-padding {
  padding: 0px;
  position: relative;
  top: -82px;
}

.right-hero {
  color: #fff;
  text-align: center;
}

.caption-hro {
  font-size: 16px;
  margin-top: 30px;
  margin-bottom: 30px;
  line-height: 28px;
  color: #fff;
  text-align: center;
  padding: 10px 130px;
}

.hero-title {
  font-weight: 700;
  font-size: 26px;
}

list-type-ulli,
.socials {
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}

.to-the-space {
  height: 90px;
  position: relative;
  top: -140px;
  background-size: cover;
  animation: changecolor 8s linear infinite alternate-reverse;
}

.main {
  background: rgb(248, 248, 248);
  padding: 150px 0px;
}

.clear {
  clear: both;
}

.container-box {
  width: 1000px;
  background: rgb(227, 227, 227);
  margin: 50px auto;
  border-radius: 20px;
}

.display-flex {
  justify-content: space-between;
  align-items: center;
}

.display-flex-center {
  justify-content: center;
  align-items: center;
}

.position-center {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.form-body {
  background: rgb(35, 35, 35);
}

.signup {
  margin-bottom: 150px;
  direction: rtl;
}

.signup-content {
  padding: 25px 0px 55px;
  text-align: right;
}

.lost-pass i {
  font-size: 18px;
  color: #ffca1e;
  margin-left: 4px;
}
.lost-pass span {
  color: #000;
  font-size: 15px;
  font-weight: 500;
}

.login-with-google-btn {
  transition: background-color 0.3s, box-shadow 0.3s;
  padding: 12px 16px 12px 42px;
  border-radius: 10px !important;
  border: 1px solid rgba(51, 0, 133, 0.147);
  color: #000000;
  font-size: 14px;
  font-weight: 600;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMTcuNiA5LjJsLS4xLTEuOEg5djMuNGg0LjhDMTMuNiAxMiAxMyAxMyAxMiAxMy42djIuMmgzYTguOCA4LjggMCAwIDAgMi42LTYuNnoiIGZpbGw9IiM0Mjg1RjQiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGQ9Ik05IDE4YzIuNCAwIDQuNS0uOCA2LTIuMmwtMy0yLjJhNS40IDUuNCAwIDAgMS04LTIuOUgxVjEzYTkgOSAwIDAgMCA4IDV6IiBmaWxsPSIjMzRBODUzIiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNNCAxMC43YTUuNCA1LjQgMCAwIDEgMC0zLjRWNUgxYTkgOSAwIDAgMCAwIDhsMy0yLjN6IiBmaWxsPSIjRkJCQzA1IiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNOSAzLjZjMS4zIDAgMi41LjQgMy40IDEuM0wxNSAyLjNBOSA5IDAgMCAwIDEgNWwzIDIuNGE1LjQgNS40IDAgMCAxIDUtMy43eiIgZmlsbD0iI0VBNDMzNSIgZmlsbC1ydWxlPSJub256ZXJvIi8+PHBhdGggZD0iTTAgMGgxOHYxOEgweiIvPjwvZz48L3N2Zz4=);
  background-position: center;
  background-color: rgb(255, 255, 255);
  background-repeat: no-repeat;
  background-position: 125px 15px;
}
.login-with-google-btn span {
  border-left: 1px solid rgba(51, 0, 133, 0.0705882353);
  padding-left: 5px;
  padding-right: 5px;
}
.login-with-google-btn:hover {
  background-color: rgba(51, 0, 133, 0.0705882353);
  color: #000000;
}
.login-with-google-btn:active {
  background-color: #150055;
  color: #000000;
}
.login-with-google-btn:focus {
  outline: none;
}

.term-service {
  color: #150055;
  margin-bottom: 0;
}

.wrapp-numbers {
  display: flex;
  padding: 10px 12px;
  background: #e8effb;
  border-radius: 4px;
  position: relative;
  align-items: center;
  justify-content: center;
}
.wrapp-numbers strong {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 20px;
  color: #000;
  margin-left: 3px;
}
.wrapp-numbers span {
  font-weight: 900;
  font-family: KalamehWeb;
  font-size: 36px;
  color: #003ad6;
}
.wrapp-numbers h3 {
  font-weight: 700;
  font-size: 18px;
  color: #000;
  margin-right: 5px;
}

.signup-form,
.signup-image,
.signin-form,
.signin-image {
  width: 50%;
  overflow: hidden;
}

.signup-image {
  margin: 0px 55px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.form-title {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 28px;
  padding-right: 10px;
  color: #000000;
  margin-bottom: 5px;
}

.form-title h2 {
  font-size: 26px;
  margin-bottom: 20px;
  color: #000000;
}

.signup-form input {
  background-color: rgba(255, 202, 30, 0.07);
  border: 1px solid rgba(255, 202, 30, 0.07);
  color: #000;
  padding: 15px 20px;
  font-size: 14px;
}

.signup-form input:hover {
  background-color: rgba(255, 202, 30, 0.59);
  border: 1px solid rgba(255, 202, 30, 0.07);
  color: rgb(0, 0, 0);
}

.signup-form input:active {
  background-color: rgba(255, 202, 30, 0.59);
  border: 1px solid rgba(255, 202, 30, 0.07);
}

.editable-user {
  color: #000 !important;
  margin-bottom: 40px;
  margin-top: 10px;
  line-height: 25px;
  font-size: 14px;
  padding-right: 20px;
}

.form-log input {
  color: rgb(0, 0, 0) !important;
}

.signup-form input:focus {
  background-color: rgba(104, 58, 183, 0.1607843137);
  border: 1px solid rgba(231, 223, 255, 0);
  color: rgb(0, 0, 0) !important;
  padding: 15px 20px;
  font-weight: 600;
}

.form-log input {
  border-radius: 30px;
  color: rgb(255, 255, 255) !important;
}

.in-one i {
  color: #8800ff;
}

.recovery-info {
  color: #fff;
  font-size: 12px;
}

.form-log input::placeholder {
  border-radius: 30px;
}

.signup-form input::placeholder {
  font-size: 14px;
  text-align: right;
}

.submitimng-ico {
  display: none;
}

.signup-image {
  margin-top: 45px;
}

.form-submit {
  display: inline-block;
  background: rgb(59, 31, 158);
  border-bottom: none;
  width: auto;
  padding: 8px 39px;
  border-radius: 24px;
  font-size: 18px;
  margin-top: 5px;
  font-family: iranyekanBakh !important;
  cursor: pointer;
  color: rgb(255, 255, 255) !important;
}

.form-submit:hover {
  background: rgb(31, 1, 116) !important;
}

#signin {
  margin-top: 16px;
}

.signup-image-link {
  font-size: 16px;
  color: rgb(0, 0, 0);
  display: block;
  text-align: center;
  border-bottom: 1px solid rgba(0, 0, 0, 0.068);
}

.term-service {
  font-size: 14px;
  margin-right: 10px;
  color: rgb(255, 255, 255);
}

.signup-form {
  margin-right: 35px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.register-form {
  width: 100%;
}

.form-group {
  position: relative;
  margin-bottom: 25px;
  overflow: hidden;
}

.form-group:last-child {
  margin-bottom: 0px;
}

.agree-term {
  display: inline-block;
  width: 15px !important;
}

.label {
  position: absolute;
  right: 20px;
  top: 24px;
  transform: translateY(-50%);
  color: rgb(34, 34, 34);
}

.label-has-error {
  top: 22%;
}

.terms-service {
  margin-right: 20px;
  font-size: 15px;
  font-weight: 500;
  color: #ffca1e;
  border-bottom: 1px solid #eee;
}
.terms-service span {
  color: #000 !important;
}

.label-agree-term {
  position: relative;
  top: 0%;
  transform: translateY(0px);
  margin-top: 2px !important;
  margin-bottom: 0px !important;
}

.material-icons-name {
  font-size: 18px;
}

.signin-content {
  padding-top: 67px;
  padding-bottom: 87px;
}

.social-login {
  align-items: center;
  margin-top: 80px;
}

.social-label {
  display: inline-block;
  margin-right: 15px;
}

.socials li {
  padding: 5px;
}

.socials li:last-child {
  margin-right: 0px;
}

.socials li a {
  text-decoration: none;
}

.socials li a i {
  width: 30px;
  height: 30px;
  color: rgb(255, 255, 255);
  font-size: 14px;
  border-radius: 5px;
  transform: translateZ(0px);
  transition-duration: 0.3s;
  transition-property: transform;
  transition-timing-function: ease-out;
}

.socials li:hover a i {
  transform: scale(1.3) translateZ(0px);
}

.signin-form {
  margin-right: 90px;
  margin-left: 80px;
}

.signin-image {
  margin-left: 110px;
  margin-right: 20px;
  margin-top: 10px;
}

@media screen and (max-width: 1200px) {
  .container-box {
    width: calc(100% - 30px);
    max-width: 100%;
  }
}
@media screen and (min-width: 1024px) {
  .container-box {
    max-width: 1200px;
  }
}
@media screen and (max-width: 768px) {
  .signup-content,
  .signin-content {
    flex-direction: column;
    justify-content: center;
  }
  .signup-content {
    padding: 5px 0px 15px;
    text-align: right;
  }
  .signup-form {
    margin-left: 0px;
    margin-right: 0px;
    padding: 0px 30px;
  }
  .signin-image {
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 50px;
    order: 2;
  }
  .signup-form,
  .signup-image,
  .signin-form,
  .signin-image {
    width: auto;
  }
  .social-login {
    justify-content: center;
  }
  .signin-form {
    order: 1;
    margin-right: 0px;
    margin-left: 0px;
    padding: 0px 30px;
  }
  .form-title {
    text-align: center;
    font-size: 22px;
  }
  .signup-form,
  .signup-image,
  .signin-form,
  .signin-image {
    width: auto;
    padding: 15px;
  }
  input::placeholder {
    font-size: 12px;
  }
  .i-put {
    font-size: 12px;
  }
  .second {
    font-size: 12px;
  }
  .term-service {
    font-size: 12px;
  }
  .error {
    font-size: 12px;
  }
  .paragraph-txt {
    color: rgb(231, 231, 231);
    font-size: 12px;
    margin-bottom: 10px;
    text-align: center;
  }
}
@media screen and (max-width: 400px) {
  .social-login {
    flex-direction: column;
  }
  .social-label {
    margin-right: 0px;
    margin-bottom: 10px;
  }
}
.input-field div.error {
  position: relative;
  top: -1rem;
  left: 3rem;
  font-size: 0.8rem;
  color: rgb(255, 64, 129);
  transform: translateY(0%);
}

.wrapp-pol {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* banner section */
.banner-section {
  background-image: url("../img/banner.jpg");
  background-size: cover;
  background-position: center;
  height: 700px;
  width: 100%;
  display: block;
}

.mobile-menu-head,
.mobile-menu-trigger {
  display: none;
}

/*responsive*/
@media (max-width: 991px) {
  .new-courses .nw-cr {
    font-size: 1.8rem;
  }
  .w-wrapp-blogs {
    display: flex;
    flex-wrap: wrap;
  }
  .hero-title {
    font-size: 1rem;
  }
  .coursers-wrapp .img-cc {
    height: 35px;
    width: 35px;
    margin-top: 8px;
    object-fit: contain;
  }
  .coursers-wrapp {
    height: 150px;
    width: 100%;
  }
  .img-mc {
    height: 200px;
    width: 100%;
    object-fit: cover;
    border-radius: 10px;
    box-shadow: 0px 1px 0px 0 rgba(0, 0, 0, 0.81), 0 4px 15px 0 rgba(0, 0, 0, 0.78) !important;
  }
  .contact-header {
    height: 250px;
    background: center;
    background-image: url(/assets/images/header/t.webp);
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    top: -82px;
    padding-top: 75px;
  }
  .offer-input {
    background-color: #f1e9ff !important;
    width: 80% !important;
  }
  .nm-cc {
    font-size: 10px;
  }
  .header .menu > ul > li .sub-menu > ul > li {
    line-height: 30px;
    height: 40px;
    padding: 0 0px 0 15px;
    display: block;
    text-align: right;
    border-bottom: 1px solid rgba(91, 91, 91, 0.1);
  }
  .header .menu > ul > li .sub-menu > ul > li > a {
    color: #000000 !important;
  }
  .dropright-lg > .dropdown-menu {
    top: auto;
    margin-top: 2px;
    margin-right: 0px;
    left: auto !important;
    right: -1px !important;
    background: #dbc7ff;
    border: none;
  }
  .header .item-center {
    order: 3;
    flex: 0 0 100%;
  }
  .v-center {
    justify-content: space-between;
  }
  .header .mobile-menu-trigger {
    display: flex;
    height: 30px;
    width: 30px;
    margin-left: 15px;
    cursor: pointer;
    align-items: center;
    justify-content: center;
  }
  .header .mobile-menu-trigger span {
    display: block;
    height: 2px;
    background-color: #ffffff;
    width: 24px;
    position: relative;
  }
  .header .mobile-menu-trigger span:before,
  .header .mobile-menu-trigger span:after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #ffffff;
  }
  .header .mobile-menu-trigger span:before {
    top: -6px;
  }
  .header .mobile-menu-trigger span:after {
    top: 6px;
  }
  .header .item-right {
    align-items: center;
  }
  .header .menu.active {
    transform: translate(0%);
  }
  .header .menu > ul > li {
    line-height: 1;
    margin: 0;
    display: block;
  }
  .header .menu > ul > li {
    line-height: 0px;
    padding: 0px 1rem;
  }
  .header .menu > ul > li > a {
    line-height: 50px;
    height: 50px;
    padding: 0 20px 0 15px;
    display: block;
    text-align: right;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  }
  .header .menu > ul > li > a {
    font-size: 12px;
  }
  .header .menu > ul > li > a i {
    position: absolute;
    height: 50px;
    width: 50px;
    top: 0;
    left: 0;
    text-align: center;
    line-height: 50px;
    transform: rotate(90deg);
  }
  .header .menu .mobile-menu-head {
    display: flex;
    height: 50px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 501;
    position: sticky;
    background-color: #1e1e1e;
    top: 0;
  }
  .dropdown-item.active,
  .dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: #dbc7ff;
  }
  .header .menu .mobile-menu-head .go-back {
    height: 50px;
    width: 50px;
    border-right: 1px solid rgba(0, 0, 0, 0.1);
    cursor: pointer;
    line-height: 50px;
    text-align: center;
    color: #ffffff;
    font-size: 16px;
    display: none;
  }
  .header .menu .mobile-menu-head.active .go-back {
    display: block;
  }
  .header .menu .mobile-menu-head .current-menu-title {
    font-size: 15px;
    font-weight: 500;
    color: #ffffff;
  }
  .header .menu .mobile-menu-head .mobile-menu-close {
    height: 50px;
    width: 50px;
    border-left: 1px solid rgba(0, 0, 0, 0.1);
    cursor: pointer;
    line-height: 50px;
    text-align: center;
    color: #ffffff;
    font-size: 25px;
  }
  .header .menu .menu-main {
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
  }
  .header .menu > ul > li .sub-menu.mega-menu,
  .header .menu > ul > li .sub-menu {
    visibility: visible;
    opacity: 1;
    position: absolute;
    box-shadow: none;
    margin: 0;
    padding: 15px;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding-top: 65px;
    max-width: none;
    min-width: auto;
    display: none;
    transform: translateX(0%);
    overflow-y: auto;
  }
  .header .menu > ul > li .sub-menu.active {
    display: block;
  }
  @keyframes slideLeft {
    0% {
      opacity: 0;
      transform: translateX(100%);
    }
    100% {
      opacity: 1;
      transform: translateX(0%);
    }
  }
  @keyframes slideRight {
    0% {
      opacity: 1;
      transform: translateX(0%);
    }
    100% {
      opacity: 0;
      transform: translateX(100%);
    }
  }
  .header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item img {
    margin-top: 0;
  }
  .header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item.text-center .title {
    margin-bottom: 20px;
  }
  .header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item.text-center:last-child .title {
    margin-bottom: 0px;
  }
  .header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item {
    flex: 0 0 100%;
    padding: 0px;
  }
  .header .menu > ul > li .sub-menu > ul > li > a,
  .header .menu > ul > li .sub-menu.mega-menu > .list-item > ul > li > a {
    display: block;
  }
  .header .menu > ul > li .sub-menu.mega-menu > .list-item > ul {
    margin-bottom: 15px;
  }
  .menu-overlay {
    position: fixed;
    background-color: rgba(0, 0, 0, 0.5);
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1098;
    visibility: hidden;
    opacity: 0;
    transition: all 0.5s ease;
  }
  .menu-overlay.active {
    visibility: visible;
    opacity: 1;
  }
}
.resize-message {
  margin: 40vh auto 0;
  display: table;
}

.resize-message span {
  text-transform: uppercase;
  text-align: center;
  display: block;
  color: #666;
}

.resize-message span i {
  font-size: 30px;
}

.author {
  position: fixed;
  bottom: 0;
  z-index: 2;
  width: 100%;
  padding: 30px 15px 15px;
  background: rgba(0, 0, 0, 0);
  background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.54) 54%, black 100%);
  background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(54%, rgba(0, 0, 0, 0.54)), color-stop(100%, black));
  background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.54) 54%, black 100%);
  background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.54) 54%, black 100%);
  background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.54) 54%, black 100%);
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.54) 54%, black 100%);
}

.author a {
  font-size: 16px;
  display: table;
  margin: 0 auto;
  text-decoration: none;
  color: #fff;
  font-weight: 700;
}

.author a span {
  color: #4285f4;
}

@media only screen and (min-width: 1460px) {
  .max {
    /* max-width: 1600px; */
    margin-top: 0px;
  }
  .social-teams {
    top: 39%;
    z-index: 1;
  }
}
@media only screen and (min-width: 1460px) {
  .box-style:hover::before,
  .box-style:hover::after {
    width: 100%;
    height: 100%;
    font-family: iranyekanBakh !important;
  }
  .max {
    margin-top: 20px;
  }
  .open-menu {
    position: fixed;
    top: 20px;
    left: 2017px;
    z-index: 99997;
    box-shadow: rgba(51, 51, 51, 0.2) 3px 3px 3px;
  }
  .panel-menu {
    position: fixed;
    top: 20px;
    right: 2017px;
    z-index: 99997;
    box-shadow: rgba(51, 51, 51, 0.2) 3px 3px 3px;
  }
  .sidebar.active {
    left: 2017px;
  }
  .nice-gradient {
    height: 100%;
  }
  .box-style::before {
    bottom: -1px;
    right: 0px;
    border-bottom: 2px solid rgb(108, 117, 125);
    border-right: 2px solid rgb(108, 117, 125);
  }
}
.add-chev {
  float: left;
  font-size: 10px;
  color: #9876ff;
  margin-top: 6px;
}

.hero-section {
  background: fixed;
  background: center;
  background-image: url(/assets/images/header/hero-bg.svg);
  height: 750px;
  background-size: cover;
  background-position: center;
  padding: 0px;
}

.road-map {
  height: 480px;
  width: 460px;
  padding: 0px;
  object-fit: cover;
}

.road-map img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.left {
  display: flex;
  align-items: flex-end;
}

.nothing-padding {
  padding: 0px;
  position: relative;
  top: -82px;
}

.caption-hro {
  font-size: 16px;
  margin-top: 30px;
  margin-bottom: 30px;
  line-height: 28px;
  color: #fff;
  text-align: center;
  padding: 10px 130px;
}

.btn {
  position: relative;
  display: inline-block;
  height: 50px;
  font-size: 18px;
  font-weight: bold;
  line-height: 60px;
  text-align: center;
  background-color: transparent;
  cursor: pointer;
  text-decoration: none;
  font-weight: 900;
  font-size: 17px;
  letter-spacing: 0.045em;
  font-size: 20px;
}

.btn svg {
  position: absolute;
  left: -68px;
  top: 5px;
}

.btn svg rect {
  stroke: #c77dff;
  stroke-width: 4;
  stroke-dasharray: 353, 0;
  stroke-dashoffset: 0;
  -webkit-transition: all 600ms ease;
  transition: all 600ms ease;
}

.btn span {
  background: rgb(255, 199, 199);
  background: -moz-linear-gradient(left, rgb(255, 208, 208) 0%, rgb(248, 190, 255) 100%);
  background: -webkit-linear-gradient(left, rgb(253, 212, 212) 0%, rgb(244, 196, 250) 100%);
  background: linear-gradient(to right, rgb(255, 213, 213) 0%, rgb(245, 203, 250) 100%);
  background: no-repeat;
  color: #fff;
}

.btn:hover svg rect {
  stroke-width: 4;
  stroke-dasharray: 196, 543;
  stroke-dashoffset: 437;
}

.scroll-prompt {
  position: fixed;
  z-index: 998;
  bottom: -80px;
  left: 50%;
  margin-left: -80px;
  width: 160px;
  height: 160px;
}

.scroll-prompt .scroll-prompt-arrow-container {
  position: relative;
  top: 0;
  left: 50%;
  margin-left: -18px;
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.scroll-prompt .scroll-prompt-arrow {
  -webkit-animation-name: opacity;
  animation-name: opacity;
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.scroll-prompt .scroll-prompt-arrow:last-child {
  animation-direction: reverse;
  margin-top: -6px;
}

.scroll-prompt .scroll-prompt-arrow > div {
  width: 24px;
  height: 24px;
  border-right: 3px solid #bebebe;
  border-bottom: 3px solid #bebebe;
  transform: rotate(45deg) translateZ(1px);
}

@-webkit-keyframes opacity {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 0.1;
  }
  20% {
    opacity: 0.2;
  }
  30% {
    opacity: 0.3;
  }
  40% {
    opacity: 0.4;
  }
  50% {
    opacity: 0.5;
  }
  60% {
    opacity: 0.6;
  }
  70% {
    opacity: 0.7;
  }
  80% {
    opacity: 0.8;
  }
  90% {
    opacity: 0.9;
  }
  100% {
    opacity: 1;
  }
}
@keyframes opacity {
  0% {
    opacity: 0;
  }
  10% {
    opacity: 0.1;
  }
  20% {
    opacity: 0.2;
  }
  30% {
    opacity: 0.3;
  }
  40% {
    opacity: 0.4;
  }
  50% {
    opacity: 0.5;
  }
  60% {
    opacity: 0.6;
  }
  70% {
    opacity: 0.7;
  }
  80% {
    opacity: 0.8;
  }
  90% {
    opacity: 0.9;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes bounce {
  0% {
    transform: translateY(0);
  }
  10% {
    transform: translateY(3px);
  }
  20% {
    transform: translateY(6px);
  }
  30% {
    transform: translateY(9px);
  }
  40% {
    transform: translateY(12px);
  }
  50% {
    transform: translateY(15px);
  }
  60% {
    transform: translateY(18px);
  }
  70% {
    transform: translateY(21px);
  }
  80% {
    transform: translateY(24px);
  }
  90% {
    transform: translateY(27px);
  }
  100% {
    transform: translateY(30px);
  }
}
@keyframes bounce {
  0% {
    transform: translateY(0);
  }
  10% {
    transform: translateY(3px);
  }
  20% {
    transform: translateY(6px);
  }
  30% {
    transform: translateY(9px);
  }
  40% {
    transform: translateY(12px);
  }
  50% {
    transform: translateY(15px);
  }
  60% {
    transform: translateY(18px);
  }
  70% {
    transform: translateY(21px);
  }
  80% {
    transform: translateY(24px);
  }
  90% {
    transform: translateY(27px);
  }
  100% {
    transform: translateY(30px);
  }
}
.search-main {
  width: 165px;
  height: 72px;
  border-radius: 0px;
  background: #9d53ff;
  font-size: 14px;
  cursor: pointer;
}

.search-main:hover {
  cursor: pointer;
  background-color: #d6b7ff;
  color: #000;
  border: 1px solid #d6b7ff;
}

.coursers-wrapp {
  height: 180px;
  width: 90%;
  background-color: #ffffff;
  border-radius: 5px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-evenly;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}
.coursers-wrapp .img-cc {
  height: 55px;
  width: 55px;
  margin-top: 8px;
  object-fit: contain;
}
.coursers-wrapp img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.topp-catt {
  position: relative;
  top: -120px;
}
.topp-catt section {
  position: absolute;
  top: -215px;
}

/*=== Trigger  ===*/
.animate {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

/*=== Optional Delays, change values here  ===*/
.one {
  -webkit-animation-delay: 0.5s;
  -moz-animation-delay: 0.5s;
  animation-delay: 0.5s;
}

.two {
  -webkit-animation-delay: 1.5s;
  -moz-animation-delay: 1.5s;
  animation-delay: 0.7s;
}

.three {
  -webkit-animation-delay: 2.5s;
  -moz-animation-delay: 2.5s;
  animation-delay: 2.5s;
}

.four {
  -webkit-animation-delay: 3.5s;
  -moz-animation-delay: 3.5s;
  animation-delay: 3.5s;
}

.five {
  -webkit-animation-delay: 4.5s;
  -moz-animation-delay: 4.5s;
  animation-delay: 4.5s;
}

.six {
  -webkit-animation-delay: 5.5s;
  -moz-animation-delay: 5.5s;
  animation-delay: 5.5s;
}

.seven {
  -webkit-animation-delay: 6.5s;
  -moz-animation-delay: 6.5s;
  animation-delay: 6.5s;
}

.eight {
  -webkit-animation-delay: 7.5s;
  -moz-animation-delay: 7.5s;
  animation-delay: 7.5s;
}

/*=== Animations start here  ===*/
/*==== FADE IN UP ===*/
@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

/*=== FADE IN DOWN ===*/
.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
/*=== FADE IN LEFT ===*/
@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

/*==== FADE IN RIGHT ===*/
@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

/*=== FADE IN  ===*/
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

/*=== FADE IN UP Big ===*/
.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
/*=== FADE IN LEFT Big ===*/
.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.some-buttons {
  display: flex;
}

.arrow {
  height: 20px;
  margin-right: 12px;
}

.login-google {
  font-size: 25px;
  color: #000;
}

.sad-person {
  height: 20px;
  margin-left: 12px;
}

.ultra-link {
  display: flex;
  align-items: center;
  flex-direction: row-reverse;
}

.new-way {
  display: flex;
  padding: 5px 25px;
  justify-content: center;
  align-items: center;
  margin-top: 30px;
}

.new-way p {
  margin-bottom: 0px;
  font-size: 16px;
}

.s-title {
  font-size: 22px;
}

.login-google {
  border-radius: 50%;
  height: 45px !important;
  width: 45px !important;
  text-align: center;
  border: 2px solid rgba(142, 111, 255, 0.247);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 27px;
  background: #e3dcff;
}

.login-google i {
  color: #fff;
}

.forgot-pass {
  font-size: 14px;
  color: #000;
  float: left;
}

.be-pass {
  font-size: 16px;
}

.recovery {
  background-color: #f544a5;
  color: #000;
}

.in-one {
  display: flex;
  align-items: baseline;
  padding-right: 15px;
}

.in-one i {
  margin-left: 8px;
}

.name-of-user {
  color: #5a189a;
  font-weight: 700;
}

.arm-logo {
  height: 180px;
  object-fit: cover;
  margin: 40px 0px;
  display: flex;
  justify-content: center;
}

.arm-logo img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.back-btn {
  display: inline-block;
  background: rgb(59, 31, 158);
  border-bottom: none;
  width: auto;
  height: 46px;
  padding: 13px 39px;
  border-radius: 24px;
  font-size: 17px;
  margin-top: 5px;
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  cursor: pointer;
  color: rgb(255, 255, 255) !important;
  margin-top: 30px;
}

.ss-div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  margin-right: 0px;
}

.center-ss {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 100%;
  align-items: center;
  margin-right: 0px;
}

.re-pass {
  background-color: #178573;
}

.capt-wc {
  font-size: 12px;
  color: rgb(30, 0, 73);
}

.bordering {
  width: 12%;
  background-color: rgb(98, 63, 188);
  height: 6px;
  position: relative;
  border-radius: 16px;
  top: 3px;
}

.big-bordering {
  width: 21%;
  background-color: rgb(141, 127, 255);
}

.banner--1 {
  padding: 0px;
  margin-top: 30px;
  margin-bottom: 30px;
  height: 300px;
  border-radius: 6px;
  background: center;
  background-size: cover;
  background-color: #f0e2ff;
  background-image: url();
}

.banner--2 {
  padding: 0px;
  margin-top: 50px;
  margin-bottom: 30px;
  height: 300px;
  border-radius: 6px;
  background: center;
  background-size: cover;
  background-color: #6d6c6e;
  background-image: url();
}

.banner--3 {
  padding: 0px;
  margin-top: 30px;
  margin-bottom: 30px;
  height: 300px;
  border-radius: 6px;
  background: center;
  background-size: cover;
  background-color: #6d6c6e;
  background-image: url();
}

.np-row {
  padding: 0px 157px;
}

.blog-caption .more-text {
  display: none;
  height: 0px;
}

.w-wrapp-blogs {
  background: #ece8f7;
  padding: 30px 10px;
  padding-top: 78px;
  display: flex;
  align-items: center;
  border-radius: 8px;
  direction: rtl;
}
.w-wrapp-blogs .w-blog-block {
  flex-direction: column;
  margin: 10px;
}

.cart-wrappering {
  margin-bottom: 35px;
  text-align: right;
  height: 25rem;
  padding: 15px;
  background: rgb(255, 255, 255);
  border-radius: 8px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}
.cart-wrappering .cart-img {
  border-radius: 8px;
  height: 200px;
  width: 100%;
  object-fit: cover;
}
.cart-wrappering .cart-img img {
  border-radius: 8px;
  height: 100%;
  width: 100%;
  object-fit: cover;
  overflow: hidden;
  filter: brightness(0.7);
}

.name-course {
  margin-top: 20px;
  font-size: 1.1rem;
  line-height: 28px;
  font-weight: 600;
  color: #000000;
  height: 60px;
  overflow: hidden;
}

.w-absolute {
  height: 160px;
  position: relative;
  top: -35px;
}
.w-absolute .cart-timer {
  position: relative;
  top: -40px;
  background: #ffffff;
  padding: 2px 12px;
  width: max-content;
  right: 11px;
  border-radius: 6px !important;
  --border-size: 1.5px;
  --border-angle: 0turn;
  background-image: conic-gradient(from var(--border-angle), #ffffff, #dfdfff 50%, #cfa7f8), conic-gradient(from var(--border-angle), #ffecec 0%, #6f01b9, #ff7300);
  background-size: calc(100% - var(--border-size) * 4) calc(100% - var(--border-size) * 3), cover;
  background-position: center center;
  background-repeat: no-repeat;
  animation: bg-spin 3s linear infinite;
}
@keyframes bg-spin {
  to {
    --border-angle: 1turn;
  }
}
.w-absolute .cart-timer:hover {
  animation-play-state: paused;
}
.w-absolute .cart-timer .timer {
  display: flex;
  align-items: center;
}
.w-absolute .cart-timer i {
  font-size: 18px;
  margin-left: 5px;
  color: #150055;
}
.w-absolute .cart-timer .timer-title {
  color: #000;
  font-size: 0.9rem;
  margin-top: 3px;
  font-weight: 600;
}
.w-absolute .cart-timer #countdown {
  display: flex;
  direction: rtl;
  flex-direction: row-reverse;
  justify-content: center;
  width: 100px;
  margin-top: 2px;
}
.w-absolute .cart-timer #countdown span {
  color: rgb(21, 0, 54);
  font-size: 16px;
  font-weight: 600;
  margin-top: 2px;
}
.w-absolute .cart-timer .del-price {
  font-size: 20px;
  margin-right: 20px;
  text-decoration-line: line-through;
  color: #150055;
}

.mr-2 {
  margin-right: 5px;
}

@property --border-angle {
  syntax: "<angle>";
  inherits: true;
  initial-value: 0turn;
}
.name-course-s {
  font-size: 1rem;
  direction: rtl;
}

.cart-wrappering:hover .cart-img img {
  transform: scale(1.03);
  filter: none;
  transition: all 0.3s ease;
}
.cart-wrappering:hover .biginner-lev {
  background: linear-gradient(-45deg, #b752ee, #de3ce7, #f170ff, #ff005d);
  background-size: 400% 400%;
  animation: gradient 2s ease infinite;
}
.cart-wrappering:hover .mid-lev {
  background: linear-gradient(-45deg, #52eea0, #3ce77e, #97c8ff, #0bf3bd);
  background-size: 400% 400%;
  animation: gradient 2s ease infinite;
}
.cart-wrappering:hover .adv-lev {
  background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
  background-size: 400% 400%;
  animation: gradient 2s ease infinite;
}

@keyframes gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
.course-level {
  width: max-content;
  padding: 0px 8px;
  border-radius: 3px;
}

.course-level p {
  color: rgb(0, 0, 0);
  font-weight: normal;
  font-size: 10px;
}

.course-level {
  width: max-content;
  padding: 0px 8px;
  border-radius: 3px;
}

.ct-6 {
  color: #fff;
}

.biginner-lev {
  background-color: rgba(253, 211, 229, 0.668);
  color: rgb(0, 0, 0) !important;
}

.mid-lev {
  background-color: rgba(201, 246, 255, 0.6901960784);
  color: rgb(0, 0, 0) !important;
}

.adv-lev {
  background-color: rgba(233, 193, 255, 0.5725490196);
  color: rgb(0, 0, 0) !important;
}

.biginner-lev-i {
  color: rgb(253, 192, 218);
}

.mid-lev-i {
  color: #7de9ff;
}

.adv-lev-i {
  color: #d079ff;
}

.course-level p {
  font-size: 12px;
}

.course-level p {
  color: rgb(0, 0, 0);
}

.cart-capt {
  margin-bottom: 5px;
  font-size: 12px;
}

.cart-title h6 {
  color: #fff;
  height: 45px;
  font-size: 12px;
  padding: 2px 10px;
  margin-top: 5px;
  margin-bottom: 10px;
  line-height: 22px;
  overflow: hidden;
}

.carts {
  padding: 0px;
  direction: rtl;
}

.first-details {
  direction: rtl;
  display: flex;
  align-items: center;
  padding: 2px 0px 8px;
  margin-top: 1rem;
}

.blck-cc {
  color: rgb(255, 255, 255);
  font-size: 14px;
}

.the-last-item a {
  margin-top: 3px !important;
  border-top: 1px solid #000;
  background-color: rgba(157, 0, 255, 0.9803921569) !important;
  color: #fff;
}

.the-last-item a:hover {
  margin-top: 3px !important;
  background-color: #e8b6ff !important;
  color: rgb(0, 0, 0) !important;
  opacity: 1;
}

.tag-thing {
  direction: ltr;
  text-align: left;
  font-size: 14px;
  color: #ff7df4;
}

.bb-nim {
  border-bottom: 1px solid rgba(204, 204, 204, 0.315);
  margin: 3px 10px;
}

.second-details {
  display: flex;
  justify-content: space-between;
  padding-bottom: 5px;
  margin-top: 15px;
  align-items: center;
}

.w-see-course {
  color: #7c51ff;
  font-weight: 700;
  display: flex;
  align-items: center;
}
.w-see-course i {
  font-size: 12px;
  margin-right: 5px;
  margin-bottom: 2px;
}

.money {
  direction: ltr;
  display: flex;
  align-items: center;
  flex-direction: column-reverse;
  height: 3rem;
  align-items: flex-start;
}
.money p {
  font-size: 14px;
  color: #d7a7ff;
  display: flex;
  flex-direction: row-reverse;
}
.money .toman {
  float: left;
  margin-right: 4px;
}
.money del {
  color: rgb(90, 90, 90);
  text-decoration: none;
  position: relative;
  font-size: 16px;
}
.money del:before {
  content: " ";
  display: block;
  width: 100%;
  border-top: 1px solid rgb(148, 148, 148);
  height: 12px;
  position: absolute;
  bottom: 16px;
  left: 0;
  transform: rotate(180deg);
}

.time p {
  direction: center;
  font-size: 12px;
  width: 80px;
  text-align: center;
  color: #d7a7ff;
  text-align: center;
}

.pay {
  font-size: 18px;
  font-weight: 500;
  color: rgb(255, 255, 255);
}

.into-top {
  margin-bottom: 0px;
  padding: 10px 0px;
}

.arroww-ass {
  height: 20px;
  width: 20px;
}

.see-all span {
  color: rgb(255, 255, 255);
  margin-left: 12px;
}

.see-all {
  margin-top: 12px;
  padding: 10px 25px;
  border-radius: 50px;
  height: 47px;
  border: 2px solid rgb(125, 75, 255);
  display: flex;
  align-items: center;
  margin-top: 10px;
  width: max-content;
}

.see-all:hover {
  background: rgba(126, 75, 255, 0.126);
  border: 2px solid rgb(193, 168, 255);
  transition: all linear 0.4s;
}

.see-all:hover span {
  color: rgb(255, 255, 255) !important;
  transition: all linear 0.4s;
}

.tracks-row {
  margin-top: 30px;
  margin-bottom: 30px;
  background-color: #27282c;
  padding: 120px 10px;
  direction: rtl;
  background-color: rgba(219, 178, 255, 0.5098039216);
  background-image: url(/assets/images/vectors/bg-banner-02.webp);
  background-size: cover;
  background-position: center;
  box-shadow: none !important;
}

.track-title {
  color: #f6f1fa;
  font-size: 22px;
}

.ser-line {
  text-align: right;
  display: flex;
  flex-direction: column;
}

.track-capt {
  color: rgb(145, 145, 145);
  margin-top: 10px;
  font-size: 16px;
}

.logo-track {
  height: 60px;
  width: 60px;
  object-fit: cover;
  margin-left: 28px;
  padding: 0px;
}

.logo-track img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.sub-cat {
  margin: 0px 0px;
}

.name-track {
  text-align: right;
  color: #fff;
  font-size: 18px;
}

.track-wrapp {
  display: flex;
  align-items: center;
}

.bird-padding {
  padding: 0px;
  margin-top: 15px;
}

.bird-padding:hover .details-course li a {
  font-size: 16px;
  color: rgb(247, 163, 255);
}

.details-course li {
  list-style: none;
}

.ta-height {
  height: 0px;
  object-fit: contain;
}

.ta-height img {
  height: 100px;
}

.erth-margin {
  margin-top: 40px;
}

.purple-line {
  border: 2px solid rgb(147, 9, 187) !important;
}

.details-course {
  text-align: right;
  padding-right: 100px;
}

.details-course li a {
  font-size: 16px;
  color: hsl(12, 3%, 65%);
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
}

.mini-capt {
  margin-top: 5px;
  text-align: right;
  margin-right: 30px;
  color: #fff;
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
}

.mini-capt p {
  color: rgb(203, 203, 203);
}

.a-capt {
  margin-top: 40px;
  color: #fff;
  font-family: "IRANYekanWeb", Arial, "Helvetica Neue", Helvetica, sans-serif;
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
}

.gray-all span {
  color: rgb(255, 255, 255);
}

.header-blog-row {
  width: 100%;
  display: block;
  text-align: right;
  font-size: 1.5rem !important;
  font-weight: 700 !important;
}

.blog-wrapper {
  text-align: right;
  background-color: #ffffff;
  border-radius: 8px;
  height: 21rem;
  padding: 15px 15px;
  direction: rtl;
  transition: all linear 0.5s;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  margin: 10px;
  margin-bottom: 50px;
}
.blog-wrapper:hover .blog-banner img {
  transform: scale(1.03);
  transition: all 0.3s ease;
}
.blog-wrapper .blog-banner-wraper {
  height: 110px;
}
.blog-wrapper .blog-banner {
  height: 120px;
  width: 100%;
  object-fit: cover;
  border-radius: 8px;
}
.blog-wrapper .blog-banner img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 8px;
}
.blog-wrapper .blog-banner .category-label {
  position: relative;
  top: -42px;
  right: -27px;
  font-size: 11px;
  padding: 6px 15px;
  border-radius: 6px 0px 0px 6px;
  background: linear-gradient(304deg, #e6e2f1 0.64%, #992cff 98.23%);
  text-align: right;
  width: max-content;
  color: #000;
  font-weight: 500;
}
.blog-wrapper .blog-intro {
  line-height: 24px;
  font-size: 15px;
  font-weight: 600;
  height: 82px;
  overflow: hidden;
  display: flex;
  align-items: center;
  color: rgb(48, 48, 48);
  margin-bottom: 0px;
}
.blog-wrapper .blog-caption {
  font-size: 14px;
  height: 65px;
  line-height: 22px;
  overflow: hidden;
  color: #343434;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: flex-start;
}
.blog-wrapper .blog-setting {
  display: flex;
  margin-top: 8px;
  align-items: center;
  justify-content: space-between;
}
.blog-wrapper .tag-in p {
  text-align: left;
  direction: ltr;
  color: rgb(21, 0, 54);
  font-size: 12px;
}
.blog-wrapper .person-in span {
  color: rgb(21, 0, 54);
  font-size: 12px;
}
.blog-wrapper .blog-user {
  font-size: 16px;
  color: #150055;
  margin-left: 5px;
}
.blog-wrapper .calc-width {
  text-align: right;
  direction: rtl;
  padding-left: 0px;
  display: flex;
}
.blog-wrapper .calc-width .date-rote {
  direction: rtl !important;
  margin-left: 10px;
}
.blog-wrapper:hover .bi-hold {
  margin-bottom: 10px;
  transition: all linear 0.5s;
}

.btn-sc {
  padding: 8px 0px;
  margin-right: 10px;
  margin-top: 8px;
}

.btn-hi {
  margin-right: 15px;
  padding: 8px 0px;
  padding-left: 15px;
  border-left: 1px solid rgba(0, 0, 0, 0.185);
  margin-top: 8px;
}

.submitting {
  padding: 12px 15px;
  text-align: center;
  background: #150055;
  color: #fff !important;
  font-size: 15px;
  font-weight: 500;
  -webkit-transition: all 0.3s linear;
  transition: all 0.3s linear;
  border: 0;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: relative;
  border-radius: 3px;
  z-index: 1;
  margin-right: 12px;
}

.border-l {
  height: 18px;
  width: 1px;
  margin-right: 4px;
  background-color: rgba(255, 255, 255, 0.4980392157);
}

.box-btnsa {
  position: relative;
  vertical-align: text-top;
}

.submitting {
  font-size: 14px;
  background-size: 300% 100%;
  border-radius: 6px;
  moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}

.submitting:focus {
  outline: none;
}

.submitting:hover {
  box-shadow: 0 4px 15px 0 rgba(116, 79, 168, 0.021);
  background-image: linear-gradient(to right, #8ea3fe, #8858b6, #5778be, #896da1);
  color: #fff !important;
  background-position: 100% 0;
  moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.8s linear;
}

.submitting:hover a {
  color: #fff !important;
}

.option-badge {
  font-size: 9px;
  font-weight: 500;
  padding: 0px 4px;
  border-radius: 15px;
  position: absolute;
  transform: translate(-10px, -7px);
}

.option-badge.option-badge-main {
  background: rgb(124, 81, 255);
  color: #fff;
  font-size: 10px;
  line-height: 18px;
  font-weight: normal;
  border: 1px solid rgba(138, 127, 185, 0.4588235294);
  min-width: 20px;
  text-align: center;
}

.box-btns a > i {
  color: #000;
  font-size: 20px;
}

.bi-hold {
  background-color: rgb(35, 35, 35);
  height: 45px;
  border: 2px solid #232323;
  object-fit: cover;
  border-radius: 50%;
  margin-left: 20px;
  width: 45px;
}

.bi-hold img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.some-buttons {
  height: 80px;
  display: flex;
  justify-content: start;
  align-items: center;
}

.title-wrapp {
  display: flex;
  align-items: center;
  color: #000;
  text-align: right;
}

.bname {
  width: 100%;
  text-align: right;
}

.some-opacity {
  background-color: rgba(255, 255, 255, 0.336);
  height: 100%;
}

.blog-setting {
  display: flex;
  margin-top: 30px;
  align-items: center;
}

.tag-in p {
  text-align: right;
  direction: ltr;
  color: #fff;
  font-size: 10px;
}

.date-in span {
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  color: rgb(255, 255, 255);
  font-size: 10px;
  margin-right: 6px;
}

.date-in i {
  color: rgb(255, 255, 255);
  font-size: 10px;
  float: right;
  position: relative;
  top: 4px;
}

.person-in span {
  color: rgb(255, 255, 255);
  font-size: 10px;
}

.journey-line {
  background-color: rgb(35, 35, 35);
  margin: 0px auto;
  width: 0%;
  height: 150px;
  border-width: 3px;
  border-style: solid;
  border-image: linear-gradient(rgb(236, 0, 140), rgb(241, 91, 42), rgba(0, 0, 0, 0)) 1 100%/1/0 stretch;
}

.journey-line {
  margin: 0px auto;
  width: 0%;
  height: 150px;
  border-width: 3px;
  border-style: solid;
  border-image: linear-gradient(rgba(152, 118, 255, 0.02), rgb(134, 66, 255), rgba(135, 118, 255, 0)) 1 100%/1/0 stretch;
}

@media screen and (max-width: 380px) {
  .journey-line {
    padding-top: 50px;
  }
}
.academy-image {
  height: 140px;
  object-fit: cover;
  margin-top: 25px;
}

.academy-image img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.academy-row {
  direction: rtl;
  padding: 0px 10px;
}

.login-form input {
  width: 100% !important;
  border-radius: 10px !important;
}
.login-form .form-group {
  margin-bottom: 15px;
}
.login-form .signup-form input {
  background-color: rgba(103, 58, 183, 0.0705882353);
  border: 1px solid rgba(209, 194, 255, 0);
  color: #000;
  padding: 15px 20px;
}

.logo-content {
  display: flex;
  align-items: center;
  justify-content: center;
}

.right-wrapping {
  display: flex;
  flex-direction: column;
  align-content: center;
  align-items: center;
}

.right-decore {
  height: 0px;
}

.right-decore img {
  height: 550px;
  position: absolute;
  right: 10px;
}

.left-decore {
  height: 0px;
}

.left-decore img {
  height: 300px;
  position: absolute;
  left: 10px;
}

.text-content {
  padding: 20px 25px;
  background-color: #191919;
  background-image: url(/assets/images/vectors/course-bg.webp);
  background-size: cover;
  background-position: top left;
  background-repeat: no-repeat;
  -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15) !important;
  box-shadow: 0px 1px 0px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15) !important;
  border-radius: 6px;
  margin-top: 30px;
  text-align: right;
}

.text-content p {
  color: #fff;
}

.title-academy {
  font-size: 22px;
  margin-top: 30px;
  margin-bottom: 30px;
  color: rgb(152, 118, 255);
}

.ac-text {
  text-align: justify;
  font-size: 14px;
  line-height: 28px;
  color: #fff;
}

.box-ac {
  height: 140px;
  width: 140px;
  background-color: #191919;
  -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15) !important;
  box-shadow: 0px 1px 0px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15) !important;
  border-radius: 6px;
  margin: 0px 15px;
  margin-top: 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.box-ac:hover {
  background-color: rgb(14, 4, 31);
}

.wrapp-boxes {
  display: flex;
}

.ico-cc {
  height: 50px;
  width: 50px;
  object-fit: contain;
}

.ico-cc img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.t-box {
  color: rgb(226, 193, 255);
  margin-top: 12px;
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
}

.t-box span {
  color: #d8b2fe;
}

.type-of {
  margin-top: 10px;
  font-size: 14px;
  color: #b9a2ff;
}

.w-ato {
  margin-top: 30px;
  width: 160px;
  float: left;
}

.topper-footer {
  margin-top: 80px;
  background-color: rgb(255, 255, 255);
  padding: 30px 0px;
  padding-top: 0px;
}

.about-footer p {
  padding-left: 20px;
  text-align: justify;
  direction: rtl;
}

.newsletters-holder .input-group {
  border: 1px solid rgb(242, 242, 242);
  border-radius: 8px;
  margin-right: 15px;
}
.newsletters-holder .input-group i {
  font-size: 24px;
  margin-top: 0px !important;
}

.so-ul {
  padding-left: 15px !important;
  display: flex;
  align-items: end;
  justify-content: flex-end;
}
.so-ul ul {
  padding: 10px 10px;
  list-style: none;
}
.so-ul li {
  padding: 0px 10px !important;
  list-style: none;
}
.so-ul a {
  color: #150055;
  font-size: 20px;
  background: #f5f1ff;
  border-radius: 8px;
  padding: 12px 15px;
  font-size: 20px;
  display: flex;
  align-items: center;
}

.read-more {
  background-color: rgba(0, 0, 0, 0.137);
  padding: 4px 5px;
  border-radius: 2px;
  font-size: 14px;
}

.bg-d {
  border-bottom: 2px dashed #a4a7ad;
}

.first-p {
  color: #ccc;
  padding: 10px 30px;
}

.design-footer {
  margin-top: 40px;
  padding-top: 0px;
  padding-bottom: 10px;
  background-color: #080631;
  color: #e9ecef;
}

.news-get {
  padding: 15px;
  background-color: rgb(0, 20, 56);
  margin-bottom: 0px;
}

.design-footer ul > li {
  list-style: none;
  padding: 0;
}

.footer-ul {
  padding: 0;
}

.footer-ul li {
  font-size: 16px;
  margin-top: 8px;
  list-style: none;
}

.footer-border {
  padding-top: 45px;
  border-bottom: 1px solid rgb(242, 242, 242);
  padding: 45px 60px;
  direction: rtl;
}

.title-footer {
  font-size: 18px;
  color: #000000;
  text-align: right;
}

.news-btn {
  padding: 0px 30px;
  position: relative;
  right: -23px;
  background: #90e0ef;
  border-radius: 50px !important;
  z-index: 3;
  border: 2px solid #90e0ef;
  font-weight: 700;
}

.news-btn:hover {
  background: #f8b014;
  border: 2px solid #f8b014;
}

.news-input:hover,
.news-input:focus,
.news-input:active {
  z-index: 1 !important;
}

.copy-right {
  font-size: 12px;
  color: #6c757d;
}

.copy-part {
  display: flex;
  align-items: center;
}

.bg-gallery {
  padding: 0px;
  background-color: rgb(26, 26, 26);
  height: 500px;
  overflow: hidden;
}

.news-btn {
  padding: 0px 30px;
  position: relative;
  right: -23px;
  background: #90e0ef;
  border-radius: 50px !important;
  z-index: 3;
  border: 2px solid #90e0ef;
  font-weight: 700;
}

.news-btn:hover {
  background: #f8b014;
  border: 2px solid #f8b014;
}

.footer-ul > li > a {
  color: #1f1f1f;
  font-size: 14px;
  margin-top: 15px;
}

.footer-ul {
  text-align: right;
}

.glow-footer {
  background: rgb(255, 255, 255);
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  padding: 20px 0px;
  position: relative;
  border-radius: 8px;
  top: -40px;
}

.w-footer-label {
  text-align: right;
  font-weight: 600;
  color: rgb(21, 0, 54);
  margin-bottom: 0px;
  padding-right: 30px;
}

.re-margin {
  margin-top: 12px;
  margin-right: 12px;
}

.wrapp-page-item {
  display: flex !important;
  justify-content: center !important;
}

.page-item.disabled .page-link {
  color: #6c757d;
  pointer-events: none;
  cursor: auto;
  background-color: #e3d9fe;
  border-color: none;
  border: none;
}

.page-item .page-link {
  z-index: 1;
  color: #000;
  background-color: rgb(237, 227, 255);
  border-color: #dd6b4d;
  border: none;
  display: flex;
  align-items: center;
  border-radius: 5px;
  margin: 3px;
}

.page-item.active .page-link {
  z-index: 3;
  color: #fff;
  background-color: #150055;
  border-color: #150055;
}

.page-link {
  width: 40px;
  height: 42px;
  padding: 10px 20px;
  border-radius: 50%;
  text-align: center;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  background-color: transparent;
  color: #000000 !important;
  margin: 5px 15px;
  font-size: 16px !important;
  border: 2px solid #9876ff;
  -webkit-box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.07), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
  box-shadow: 0 10px 15px -3px rgba(56, 56, 56, 0.07), 0 4px 6px -2px rgba(43, 42, 42, 0) !important;
}

.page-item:not(:first-child) .page-link {
  margin-right: unset;
}

.page-link span {
  display: flex;
  align-items: center;
}

.padding-right-sett {
  padding-right: 15px !important;
}

.sett-fire {
  padding: 10px 25px;
}

.input-control {
  width: 100% !important;
  padding-right: 10px !important;
}
.input-control input {
  width: 100% !important;
}

.width-control {
  height: 50px;
  background: transparent;
  border-radius: 30px;
  border: 1px solid rgb(152, 118, 255);
  border-left: none;
  padding: 0px 20px;
}

.width-control::placeholder {
  font-size: 14px;
}

.same-line {
  display: flex;
}

.nice-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 150px;
  color: #fff;
  text-align: center;
  background: transparent;
  border-radius: 30px !important;
  z-index: 1000000000000;
  border: 1px solid rgba(132, 103, 218, 0.5215686275);
  font-size: 17px;
  font-weight: normal;
  position: relative;
  right: -30px;
}

.re-margin {
  margin-top: 12px;
}

.certi-box {
  height: 100px;
  object-fit: cover;
  padding: 10px;
}

.certi-box img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.certi-holder {
  display: flex;
}

.hu-junk {
  height: 730px;
  padding: 70px 10px;
  padding-top: 100px;
  background: url(/assets/images/header/t.webp);
  display: flex;
  position: relative;
  top: -82px;
}

.develoap-drive {
  font-size: 28px;
  text-align: right;
  color: #fff;
  margin-bottom: 20px;
  margin-top: 50px;
}

.text-bar {
  display: flex;
  flex-direction: column;
  padding: 0px;
}

.paraghrap {
  margin-top: 30px;
  color: rgb(255, 255, 255);
  text-align: right;
  line-height: 32px;
  direction: rtl;
}

.imge-hl {
  height: 200px;
  width: 200px;
  object-fit: contain;
}

.imge-hl img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.mission-title {
  font-size: 28px;
  color: #fff;
  text-align: right;
  width: 100%;
  margin-top: 70px;
  margin-bottom: 30px;
}

.mission-box {
  text-align: right;
  color: rgb(255, 255, 255);
}

.miss-texter {
  text-align: right;
  line-height: 28px;
  direction: rtl;
  text-align: justify;
  font-size: 14px;
  direction: rtl;
}

.glass-logo {
  background: -webkit-linear-gradient(45deg, hsla(277, 64%, 95%, 0.2) 0%, hsla(0, 0%, 100%, 0.16) 0%, hsla(0, 0%, 96%, 0.18) 3%);
  -webkit-box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.07), 0 10px 10px -5px rgba(0, 0, 0, 0.05) !important;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.07), 0 10px 10px -5px rgba(0, 0, 0, 0.05) !important;
  padding: 8px;
  border-radius: 10px;
}

.our-box {
  border: 1px solid rgb(196, 162, 252);
  border-radius: 15px;
  width: 90%;
  padding: 30px 10px;
  height: 250px;
  background-color: #191919;
  -webkit-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -1px rgba(0, 0, 0, 0.05) !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.021), 0 2px 4px -1px rgba(0, 0, 0, 0.021) !important;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.third-box {
  margin-top: 10px;
  margin-bottom: 300px;
}

.our-ico {
  height: 60px;
  width: 60px;
  object-fit: cover;
}

.our-ico img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.ser-box {
  font-size: 14px;
  margin: 25px 0px;
  text-align: center;
  color: #fff;
}

.last-logo {
  display: flex;
  padding: 0px;
  flex-direction: column;
  align-items: baseline;
  justify-content: flex-end;
}

.our-box p {
  text-align: justify;
  text-align: center;
  padding: 3px 10px;
  font-size: 12px;
  color: #fff;
  line-height: 20px;
}

.our-team {
  height: 340px;
  width: 100%;
  object-fit: cover;
  padding: 20px;
  position: absolute;
  top: -225px;
  z-index: -2;
}

.shapes {
  height: 100px;
  width: 100%;
  object-fit: cover;
  padding-top: 40px;
  position: absolute;
  top: -270px;
  right: -80px;
  z-index: -2;
}

.shapes img {
  opacity: 0.3;
}

.our-team img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.margin-lio {
  z-index: 10000000000;
  margin: 50px 0px;
  background-color: #110f0f;
  padding: 50px 15px;
  padding-bottom: 70px;
  border-radius: 10px;
  -webkit-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.07), 0 2px 4px -1px rgba(0, 0, 0, 0.05) !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.021), 0 2px 4px -1px rgba(0, 0, 0, 0.021) !important;
  direction: rtl;
  text-align: right;
}

.margin-lio p {
  color: #fff;
}

.name-team {
  font-size: 22px;
  color: #8400ff;
  text-align: right;
}

.team-text p {
  color: rgb(219, 219, 219);
  font-size: 12px;
  margin-top: 30px;
  direction: rtl;
  text-align: justify;
  line-height: 30px;
}

.title-tex {
  direction: rtl;
  text-align: right;
  margin: 20px 0px;
  font-weight: 700;
  font-size: 18px;
  color: #8400ff;
  display: flex;
  align-items: center;
}

.title-tex i {
  font-size: 14px;
  margin-left: 14px;
}

.wrapp-title-in {
  text-align: right;
  direction: rtl;
  padding: 8px 20px;
}

.centeral-team {
  text-align: center;
  width: 100%;
  font-size: 26px;
  margin-bottom: 18px;
  font-weight: 700;
}

.margin-teachers {
  margin-top: 100px;
  direction: rtl;
}

.team-b {
  height: 250px;
  display: flex;
  align-items: center;
  padding: 0px;
}

.teacher-information {
  height: 200px;
  display: flex;
  flex-direction: column;
  text-align: right;
  justify-content: start;
  margin-right: 20px;
  justify-content: center;
}

.teacher-information .name-teachers {
  margin-bottom: 12px;
}

.title-nt {
  height: 100px;
  direction: rtl;
  display: flex;
  align-items: center;
}

.nt-header {
  text-align: right;
  font-size: 22px;
  color: #000;
  z-index: 1;
  font-weight: 600;
  display: block;
  position: relative;
  margin-top: 40px;
}

.teacher-information .name-teachers a {
  color: #000000;
  font-size: 16px;
  text-align: right;
  margin-bottom: 12px;
  font-weight: 600;
}

.info-bio {
  font-size: 14px;
  color: rgb(0, 0, 0);
  line-height: 20px;
  text-align: right;
  direction: rtl;
}

.wrapping-teacher {
  background-color: rgb(255, 255, 255);
  width: 100%;
  padding: 12px 15px;
  border-radius: 10px;
  margin-top: 20px;
}

.ff-1 {
  align-items: center;
}

.ff-2 {
  align-items: center;
  justify-content: flex-end;
}

.ff-4 {
  align-items: center;
  justify-content: flex-end;
}

.w-hold {
  width: 100%;
  height: 0px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  -webkit-text-stroke: 3px darkgrey;
  -webkit-text-fill-color: white;
}

.w-hold h1 {
  font-size: 1000px;
  width: 100%;
  text-align: center;
  padding-top: 178px;
  font-stretch: ultra-expanded;
  word-spacing: 700px;
  font-family: "Zilla Slab", serif;
  -webkit-text-stroke: 1px rgba(82, 82, 82, 0.11);
  -webkit-text-fill-color: rgba(226, 226, 226, 0.048);
}

.w-hold h1:hover {
  font-family: "Zilla Slab", serif;
  -webkit-text-stroke: 1px rgba(129, 122, 146, 0.11);
  -webkit-text-fill-color: rgba(252, 184, 240, 0.048);
}

.bracket {
  color: #6918af;
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
}

.hating {
  padding-top: 45px;
  padding-right: 16px;
}

.ih-item a {
  color: #333333;
}

.ih-item a:hover {
  text-decoration: none;
}

.ih-item img {
  height: 100%;
  width: 100%;
}

.ih-item.circle {
  position: relative;
}

.ih-item.circle .img {
  border-radius: 50%;
  height: 160px;
  position: relative;
  width: 160px;
}

.ih-item.circle .img:before {
  border-radius: 50%;
  box-shadow: 0 0 0 16px rgba(255, 255, 255, 0.6) inset, 0 1px 2px rgba(0, 0, 0, 0.3);
  content: "";
  display: block;
  height: 100%;
  position: absolute;
  transition: all 0.35s ease-in-out 0s;
  width: 100%;
}

.ih-item.circle .img img {
  border-radius: 50%;
}

.ih-item.circle .info {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  border-radius: 50%;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  text-align: center;
  top: 0;
}

.ih-item.square {
  border: 8px solid #ffffff;
  box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
  height: 216px;
  position: relative;
  width: 316px;
}

.ih-item.square .info {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  text-align: center;
  top: 0;
}

.ih-item.circle.effect1 .spinner {
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  -moz-border-right-colors: none;
  -moz-border-top-colors: none;
  border-color: #8518ec #bba2ff #bf68fa #e0bdfc;
  -o-border-image: none;
  border-image: none;
  border-style: solid;
  border-width: 4px;
  border-radius: 50%;
  height: 160px;
  transition: all 0.8s ease-in-out 0s;
  width: 160px;
  background-color: rgb(255, 255, 255);
}

.ih-item.circle.effect1 .img {
  bottom: 0;
  height: 148px;
  width: 148px;
  object-fit: cover;
  right: 7px;
  position: absolute;
  left: 0;
  top: 7px;
}

.ih-item.circle.effect1 .img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.ih-item.circle.effect1 .img:before {
  display: none;
}

.ih-item.circle.effect1.colored .info {
  background: none repeat scroll 0 0 rgba(26, 74, 114, 0.6);
}

.ih-item.circle.effect1 .info {
  background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6);
  bottom: 0;
  left: 0px;
  opacity: 0;
  right: 0;
  top: 0px;
  transition: all 0.8s ease-in-out 0s;
}

.ih-item.circle.effect1 .info h3 {
  color: #ffffff;
  font-size: 22px;
  height: 110px;
  letter-spacing: 2px;
  margin: 0 30px;
  padding: 55px 0 0;
  position: relative;
  text-shadow: 0 0 1px #ffffff, 0 1px 2px rgba(0, 0, 0, 0.3);
  text-transform: uppercase;
}

.ih-item.circle.effect1 .info p {
  border-top: 1px solid rgba(255, 255, 255, 0.5);
  color: #ffffff;
  font-size: 12px;
  font-style: italic;
  margin: 0 30px;
  padding: 10px 5px;
}

.ih-item.circle.effect1 a:hover .spinner {
  transform: rotate(180deg);
}

.ih-item.circle.effect1 a:hover .info {
  opacity: 1;
  height: 160px;
  width: 160px;
}

.ih-item.circle.effect1.colored .info {
  height: 148px;
  background: none repeat scroll 0 0 rgba(26, 74, 114, 0.6);
  width: 165px;
}

.color-w {
  color: #fff;
  font-size: 18px;
}

.info-back {
  height: 195px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.history-box {
  padding: 70px 5px;
  background-color: #27282c;
}

.right-one {
  direction: rtl;
  text-align: right;
}

.our-history {
  color: #fff;
  margin-bottom: 15px;
}

.right-one p {
  color: #a0a0a1;
  line-height: 28px;
  font-size: 13px;
}

.nav-tabs > li {
  background-color: transparent;
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover {
  color: rgb(255, 255, 255);
  cursor: default;
  border: none;
  border-bottom-color: transparent;
}

.nav-tabs {
  border-bottom: transparent;
}

.arrow-fun {
  display: flex;
  justify-content: space-between;
}

.next img {
  width: 28px;
}

.prev img {
  width: 28px;
}

.contact-header {
  height: 400px;
  background: center;
  background-image: url(/assets/images/header/t.webp);
  background-size: cover;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  top: -82px;
}

.contact-ht {
  color: #fff;
  font-size: 30px;
}

.get-in-toch {
  color: #ffffff;
  font-size: 24px;
  text-align: center;
}

.contact-box {
  background-color: #0c0c0c;
  display: flex;
  align-items: center;
  padding: 30px 20px;
  height: 230px;
  box-shadow: 1px 4px 10px 0px #000000;
  border-radius: 10px;
  margin-top: 50px;
}

.right-box {
  padding: 0px 20px;
  text-align: right;
  width: 80%;
}

.contact-bt {
  font-size: 20px;
  color: #fff;
  margin-bottom: 15px;
}

.right-box p {
  color: #c6cde5;
  font-size: 13px;
  margin-bottom: 30px;
}

.contact-feild {
  background-color: #141414 !important;
}

.text-area-style {
  background-color: #141414 !important;
}

.contact-btn {
  padding: 10px 25px;
  border-radius: 8px;
  background-color: rgb(152, 118, 255);
  color: #000;
  text-align: center;
  font-size: 14px;
  font-weight: normal;
}

.contact-chev {
  font-size: 16px;
  color: #fff;
  position: relative;
  top: 3px;
  margin-right: 10px;
}

.ico-left {
  height: 80px;
  width: 80px;
  object-fit: cover;
}

.ico-left img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.def-btn {
  background-color: rgb(92, 163, 243);
  box-shadow: 0px 1px 30px 1px rgba(0, 0, 0, 0.37);
}

.ct-toch {
  text-align: right;
  margin-bottom: 40px;
  font-size: 20px;
  color: #fff;
}

.prev-wrapp {
  display: flex;
  direction: rtl;
  /*
       background: #fff;

       padding: 15px 15px;
       height: 100px;
       border-radius: 10px;
       width: 100%;
       box-shadow: rgb(236 242 255) 0px 1px 30px 1px;*/
}

.cc-ih {
  text-align: center;
  width: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: 18px;
}

.dt-title {
  text-align: right;
  color: #aa9cf8;
  font-weight: 700;
  font-size: 16px;
  margin-bottom: 20px;
}

.contact-ico {
  font-size: 22px;
  text-align: center;
  color: #aa9cf8;
}

.prev-wrapp {
  margin-bottom: 30px;
}

.two-part {
  margin: 50px 0px;
}

.link-contact {
  font-size: 18px;
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  color: #000;
}

.text-area-style {
  width: 100%;
  background: black;
  border-radius: 6px;
  border: 1px solid rgba(132, 103, 218, 0.5215686275);
  padding: 20px 12px;
  direction: rtl;
}

.contact-feild {
  background: transparent;
  border-radius: 6px;
  border: 1px solid rgba(133, 24, 236, 0.368627451);
  height: 48px;
  padding: 0px 25px;
}

.rt-holder {
  color: rgba(255, 255, 255, 0.863) !important;
}

.rt-holder::placeholder {
  font-size: 13px;
  text-align: right;
}

.close {
  position: absolute;
  top: 2rem;
  right: 2rem;
  background: none;
  border: 0;
  font-size: 1rem;
  font-weight: 700;
  display: block;
  cursor: pointer;
  color: black;
  padding: 1rem 1.25rem;
  background: white;
  border-radius: 50%;
  outline: none;
}

.close:hover {
  background: #d62839;
}

button.close {
  padding: 0;
  background-color: #9d53ff;
  border: 0;
  width: 60px;
  height: 60px;
  -webkit-appearance: none;
  color: #fff;
}

.close {
  float: right;
  line-height: 1;
  color: #000;
  text-shadow: none;
  opacity: 1;
  font-size: 20px;
}

.search-box.search-elem {
  margin: 0;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
  background: rgba(50, 33, 58, 0.9);
  transition: all 0.3s ease-in-out;
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
}

.search-box.search-elem .inner {
  width: 70%;
  margin: 0 auto;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.search-box.search-elem label {
  color: white;
  font-weight: 300;
}

.in-fld {
  display: flex;
  align-items: center;
}

.search-box.search-elem input[type=text] {
  padding: 20px;
  height: 72px;
  font-size: 22px;
  font-weight: 300;
  border: none;
  border-bottom: solid 2px #999;
  transition: border 0.3s;
  border-radius: 0;
  color: #000 !important;
  width: 100% !important;
}

.search-box.search-elem input[type=text]:focus {
  border-bottom: solid 2px #00a896;
  box-shadow: none;
}

.as-first {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 30px;
}

.slash {
  color: #c7c7c7;
}

.boot-link {
  color: #747474;
}

.active-road {
  color: #150055;
}

.search-box.search-elem label.placeholder {
  position: absolute;
  top: 22px;
  right: 3rem;
  font-size: 20px;
  font-weight: 300;
  color: #999;
  transition: all 0.3s;
}

.search-box.search-elem label.placeholder.move-up {
  top: -25px;
  color: white;
  font-size: 1rem;
}

.course-slider {
  position: relative;
  top: -82px;
}

.sett-carousel-height {
  height: 500px;
}

.carousel-caption {
  position: absolute;
  right: 20%;
  bottom: 120px;
  left: 15%;
  z-index: 10;
  padding-top: 20px;
  padding-bottom: 20px;
  color: #fff;
  text-align: right;
  direction: rtl;
}

.carousel-indicators {
  position: absolute;
  right: 0;
  bottom: 50px;
  left: 0;
  z-index: 15;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding-left: 0;
  margin-right: 15%;
  margin-left: 15%;
  border-radius: 0 !important;
  list-style: none;
}
.carousel-indicators button {
  border-radius: 0 !important;
}

.caption-sp {
  color: #ffffff;
  font-size: 18px;
  width: max-content;
  margin-top: 30px;
}

.search-box.search-elem.search-open {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}

.search-btn {
  font-size: 20px;
  display: inline-block;
  margin-bottom: 0px;
  color: #ffffff;
}

.search-btn:hover {
  color: #00a896;
}

.search-btn i {
  margin-left: 0.5rem;
}

.search-box-holder {
  z-index: 1;
  margin-left: 6px;
  padding-left: 5px;
  display: flex;
  align-items: center;
}

.contact-submit {
  width: 100%;
  background: rgb(208, 158, 255);
  box-shadow: 0px 1px 3px 1px #000000;
  border-radius: 6px;
  border: 1px solid rgba(133, 24, 236, 0.368627451);
  padding: 20px 25px;
  color: rgb(0, 0, 0);
  font-weight: 700;
}

.contact-submit:hover,
.contact-submit:active,
.contact-submit:focus {
  background-color: rgb(151, 43, 253);
  transition: all linear 0.3s;
  color: #fff;
}

.c-mp {
  border-radius: 10px;
  margin-bottom: 50px;
  margin-top: 40px;
}

.texture {
  direction: rtl;
  text-align: right;
  font-size: 13px;
  color: #ffffff;
  margin-bottom: 40px;
  padding-right: 16px;
}

.course-wrapp {
  border-radius: 10px;
  background-color: #191919;
  box-shadow: rgba(0, 0, 0, 0) 2px 0px 8px 6px, rgba(0, 0, 0, 0.01) -4px 1px 6px 2px !important;
}

.name-of {
  width: 100%;
  color: rgb(255, 255, 255);
  text-align: right;
  font-size: 18px;
  padding: 10px 20px;
  direction: rtl;
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
}

.course-wrapp {
  padding: 20px 20px;
  padding-bottom: 40px;
  margin-bottom: 25px;
}

.course-component {
  position: relative;
  top: -140px;
}

.acc-course {
  margin-top: 30px;
}

.download-acc {
  margin-top: 0 !important;
  margin-bottom: 0px !important;
}

.btn-link {
  font-size: 14px;
  text-align: right;
  display: flex;
  align-items: center;
  color: #000;
  justify-content: space-between;
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
}

.contact-feild::placeholder {
  color: #ccc !important;
}

.mb-0 i {
  color: #9876ff;
  float: left;
}

.btn-link span {
  color: #000;
  -webkit-text-fill-color: #000;
}

.each-according {
  border-radius: 8px;
}

#collapseOne {
  border-radius: 8px !important;
}

.btn-link:hover,
.btn-link:active,
.btn-link:focus,
.btn-link:target {
  border: none !important;
  outline: none !important;
  outline-offset: none;
}

.btn-link,
.btn-link:active,
.btn-link:focus,
.btn-link:hover {
  border: none;
}

.btn-link span {
  color: #000;
  -webkit-text-fill-color: #000;
  font-weight: normal;
}

.btn-link:focus,
.btn-link:hover {
  color: #000000;
  text-decoration: none;
  background-color: none;
}

.collaped:hover,
.collaped:active,
.collaped:focus,
.collaped:target {
  border: none !important;
  outline: none !important;
  outline-offset: none;
}

.forgot-link {
  color: rgb(255, 255, 255);
  font-size: 14px;
}

.tr-left {
  text-align: left;
}

.signup-image-link {
  padding-bottom: 10px;
  display: flex;
}

.card-header {
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  border-radius: 6px 6px 0px 0px;
  background: #cdbdff;
}

.card-header h5 {
  margin-top: 0px;
  width: 100%;
  font-size: 14px;
}

.courses-card {
  background: transparent;
  border: none;
  margin-bottom: 10px;
}

.dropdown-menu {
  display: block;
  visibility: hidden;
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.3s ease-in;
}

.dropdown:hover > .dropdown-menu {
  transform: scaleY(1);
  opacity: 1;
  visibility: visible;
}

.dropdown-submenu:hover > .dropdown-menu {
  transform: scaleY(1);
  opacity: 1;
  visibility: visible;
}

@media (min-width: 990px) {
  .dropright-lg {
    position: relative;
  }
  .dropright-lg .dropdown-menu {
    top: 0;
    right: auto;
    left: 100%;
    margin-top: 0;
    margin-right: 0.125rem;
  }
}
.dropdown-toggle::after {
  display: inline-block;
  margin-left: 0.255em;
  vertical-align: 0.255em;
  border-top: 0rem;
  border-right: 0rem;
  border-bottom: 0;
  border-left: 0rem;
  float: right;
}

.avatar-md {
  width: 56px;
  height: 56px;
}

.avatar img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
}

.avatar {
  position: relative;
  display: flex;
  align-items: center;
  width: 100px;
  height: 50px;
  font-size: 1rem;
}

.card-body {
  text-align: right;
}

.download-file {
  direction: rtl;
  text-align: right;
  display: flex;
  flex-direction: column;
  color: rgb(255, 255, 255);
  padding-right: 0px;
}

.detail-sd {
  margin-top: 20px;
  padding-top: 15px;
  border-top: 1px solid rgba(196, 198, 255, 0.031372549);
}

.wrapp-description p {
  color: #fff;
  text-align: right;
  direction: rtl;
}

.wrapp-description div {
  display: flex;
  justify-content: center;
  padding: 50px 15px;
  background: #130728;
  border-radius: 10px;
  box-shadow: rgba(0, 0, 0, 0.08) 2px 0px 8px 6px, rgba(0, 0, 0, 0.01) -4px 1px 6px 2px !important;
}

.wrapp-description div > iframe {
  border: 0;
  border-radius: 10px;
  box-shadow: rgba(0, 0, 0, 0.08) 2px 0px 8px 6px, rgba(0, 0, 0, 0.01) -4px 1px 6px 2px !important;
}

.wrapp-description h4 {
  color: rgb(185, 106, 217);
  margin-top: 15px;
  margin-bottom: 15px;
}

.tab-pane p {
  text-align: right;
}

.detail-sd p {
  font-size: 11px;
  line-height: 22px;
  color: rgb(234, 234, 234);
}

.collapsed {
  font-size: 14px;
}

.detail-fd {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}

.each-download {
  direction: rtl;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 10px 0px;
  margin-top: 10px;
  border-bottom: 1px solid #9876ff;
}

.caption-title {
  font-weight: normal;
  color: #9876ff;
}

.card-body {
  color: #fff;
}

.ec-btn {
  padding: 10px 13px;
  background: rgba(164, 133, 255, 0.147);
  display: flex;
  align-items: center;
  min-width: 90px;
  justify-content: space-around;
  border-radius: 4px;
  border: 1px solid rgba(1, 1, 2, 0.147);
  margin: 0px 10px;
  -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15) !important;
  box-shadow: 0px 1px 0px 0 rgba(0, 0, 0, 0.18), 0 4px 10px 0 rgba(0, 0, 0, 0.15) !important;
}

.df-btn {
  min-width: 110px;
}

.ec-btn a {
  color: #fff;
  margin-right: 5px;
}

.ec-btn i {
  color: rgb(152, 118, 255);
}

.ec-btn:hover {
  background-color: #000;
  border: 1px solid #6906c5;
  box-shadow: rgba(152, 118, 255, 0.286) 0px 4px 10px 0px, rgb(0, 0, 0) 0px 4px 15px 0px !important;
  transition: all linear 0.3s;
}

.course-btns {
  display: flex;
}

.card-header {
  padding: 0.75rem 1.25rem;
  margin-bottom: 0;
  border-bottom: none;
}

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

.btn-link {
  font-size: 14px;
  padding: 20px 0px;
}

.number-course {
  margin-left: 6px;
  font-weight: 700;
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
}

.card-body .each-download:last-child {
  border-bottom: none;
}

.nm-id {
  text-align: left;
  color: #000 !important;
  direction: rtl;
}

.side-detail {
  padding: 10px 10px;
  position: relative;
  top: -210px;
  border-radius: 6px;
  height: max-content;
}

.sc-wrapp {
  background-color: rgb(25, 25, 25);
  border-radius: 6px;
  padding: 15px;
  margin-bottom: 20px;
  margin-top: 20px;
}

.course-main {
  height: 200px;
  width: 100%;
  object-fit: cover;
}

.course-main img {
  border-radius: 6px;
  height: 200px;
  width: 100%;
  object-fit: cover;
}

.price-scope {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  direction: rtl;
  margin-top: 30px;
  padding: 10px;
}

.pr-cc {
  font-size: 18px;
  color: #fff;
}

.pricer-ct {
  font-size: 18px;
  color: hsl(253, 100%, 81%);
}

.buttons-scope {
  display: flex;
  flex-direction: column;
}

.buy-it-now {
  width: 100%;
  background-color: #754ffe;
  color: rgb(255, 255, 255);
  font-weight: normal;
  height: 50px;
  font-size: 16px;
  padding: 15px 20px;
  text-align: center;
  border-radius: 5px;
}

.buy-it-now:hover {
  background-color: #b9a6ff;
  color: #000;
}

.add-bookmarks {
  background: transparent;
  border: 1px solid #754ffe;
  color: rgb(255, 255, 255);
  height: 50px;
  padding: 15px 20px;
  margin-top: 10px;
  text-align: center;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.add-bookmarks:hover {
  background-color: #d4a8fb;
  border: 1px solid #d4a8fb;
  color: #000;
}

.name-teachers a {
  color: #fff;
}

.teachers-name p {
  color: #fff;
}

.sv-wrapp {
  background-color: rgb(25, 25, 25);
  direction: rtl;
  border-radius: 10px;
}

.details-boxer {
  padding: 15px 20px;
  background-color: rgb(25, 25, 25);
  color: #fff;
  text-align: right;
  margin-bottom: 0px;
  font-size: 16px;
  border-radius: 10px 10px 0px 0px;
  border-bottom: 1px solid rgba(201, 144, 255, 0.773);
}

.each-details {
  direction: rtl;
  background-color: rgb(25, 25, 25);
  text-align: right;
  padding: 10px 20px;
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  color: #fff;
}

.each-details:last-child {
  border-radius: 0px 0px 10px 10px;
}

.detail-title i {
  margin-left: 12px;
  font-size: 14px;
  padding: 10px 0px;
}

.ct-1 {
  color: #a891fc;
}

.ct-2 {
  color: #90ffec;
}

.ct-3 {
  color: rgb(255, 208, 154);
}

.ct-4 {
  color: #99c0ff;
}

.ct-5 {
  color: #ff8ccb;
}

.tabs-cyan {
  direction: rtl;
  margin-top: 30px;
}

.own-style {
  border: none;
}

.own-tabs {
  font-size: 14px;
  color: #ffffff;
  margin: 20px 12px;
  margin-top: 0px;
  padding: 10px 0px;
  transition: all ease-in-out 0.3s;
}

.own-tabs.show {
  color: rgb(170, 72, 255);
  border-bottom: 2px solid #7b2cbf;
  font-size: 14px;
  transition: all ease-in-out 0.3s;
}

.ct-1 {
  color: #a891fc;
}

.ct-2 {
  color: #90ffec;
}

.ct-3 {
  color: rgb(255, 208, 154);
}

.ct-4 {
  color: #99c0ff;
}

.ct-5 {
  color: #ff8ccb;
}

.tabs-cyan {
  direction: rtl;
  margin-top: 30px;
  padding-right: 5px;
}

.num-um {
  color: rgb(255, 255, 255);
  font-size: 16px;
  margin-left: 12px;
}

.teacher-courses {
  direction: rtl;
}

.off-c {
  width: 230px;
  height: 60px;
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 20px;
  text-align: center;
  background-image: linear-gradient(rgba(176, 148, 255, 0), rgba(89, 73, 73, 0.21)), linear-gradient(rgb(101, 34, 155), rgb(253, 79, 153) 50%, rgb(187, 164, 255));
  background-repeat: no-repeat;
  background-size: 100% 100%, 100% 900%;
  background-position: 0px 0px, 0px 100%;
  background-origin: padding-box, border-box;
  border-radius: 6px;
  animation: 3s ease 0s infinite alternate none running highlight;
  box-shadow: rgba(0, 0, 0, 0.18) 0px 1px 0px 0px, rgba(0, 0, 0, 0.15) 0px 4px 15px 0px !important;
  justify-content: center;
}

@keyframes highlight {
  100% {
    background-position: 0 0, 0 0;
  }
}
.chrct {
  font-size: 14px;
}

.off-title {
  color: rgb(255, 255, 255);
  font-size: 16px;
  margin-right: 8px;
  margin-bottom: 0px;
  opacity: 1;
}

.own-style {
  border: none;
}

.own-tabs {
  font-size: 14px;
  color: #ffffff;
  margin: 20px 12px;
  margin-top: 0px;
  padding: 10px 0px;
  transition: all ease-in-out 0.3s;
}

.own-tabs.show {
  color: rgb(170, 72, 255);
  border-bottom: 2px solid #7b2cbf;
  font-size: 14px;
  transition: all ease-in-out 0.3s;
}

#contact-classic-shadow p {
  text-align: right;
  direction: rtl;
  color: #fff;
}

.dropdown-menu {
  position: absolute;
  top: 100%;
  right: 0 !important;
  z-index: 1000;
  left: auto;
  float: left;
  min-width: 15rem;
  padding: 0.5rem 0;
  margin: 0.125rem 0 0;
  font-size: 1rem;
  color: #212529;
  text-align: left;
  list-style: none;
  background-color: rgb(248, 242, 255);
  background-clip: padding-box;
  border: none;
  border-radius: 0.25rem;
}

.dropright-lg > .dropdown-menu {
  top: 0px;
  margin-top: 0px;
  margin-right: 10px;
  left: auto !important;
  right: 100% !important;
}

.svg-course {
  direction: rtl;
  text-align: right;
  transform: rotate(180deg);
  color: #fff;
}

.rounded-circle {
  display: flex;
}

.rounded-circle p {
  color: #fff;
  margin: 0px 8px;
}

.drop-chevron {
  color: #992bff;
  margin-left: 10px;
  font-size: 12px;
}

.padd-zero a {
  padding: 10px !important;
  margin-left: 0px;
}

.card {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #191919;
  background-clip: border-box;
  border: 1px solid rgba(0, 0, 0, 0.125);
  border-radius: 0.25rem;
}

.rower-top {
  top: -50px;
}

.wrapp-payment {
  align-items: center;
}
.wrapp-payment i {
  color: #000;
  display: inline-block;
  margin-left: 10px;
  font-size: 20px;
}
.wrapp-payment a {
  padding: 5px 8px;
  background-color: #ffca1e;
  color: #000;
  font-size: 15px;
  font-weight: 600;
  height: 38px;
  width: 160px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 4px;
}
.wrapp-payment a:hover {
  background-color: #150055;
  color: #fff;
}

.wrapp-payment {
  border-radius: 8px;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  background: #fff;
  direction: rtl;
  padding: 20px 15px;
}
.wrapp-payment h2 {
  font-size: 1.2rem;
  display: flex;
}
.wrapp-payment h2 i {
  color: #150055;
  margin-left: 10px;
}
.wrapp-payment .wrapp-course-payment {
  display: flex;
}
.wrapp-payment .wrapp-course-payment h1 {
  font-size: 16px;
  font-weight: 600;
  color: #000;
}
.wrapp-payment .wrapp-course-payment strong {
  font-size: 16px;
}
.wrapp-payment .wrapp-course-payment .main-price {
  font-size: 22px;
  font-weight: 800;
  color: #000000;
}
.wrapp-payment .wrapp-course-payment span {
  font-size: 14px;
  font-weight: 600;
  color: #121213;
}
.wrapp-payment .wrapp-course-details-header {
  border-bottom: 1px solid rgb(242, 242, 242);
  margin-bottom: 20px;
  padding: 15px 0px;
}
.wrapp-payment .wrapp-course-details-header h3 {
  font-size: 18px;
  font-weight: 600;
}
.wrapp-payment .wrapp-img-payment {
  height: 100px;
  width: 140px;
  object-fit: cover;
  border-radius: 8px;
  margin-left: 35px;
  background-color: #fff !important;
}
.wrapp-payment .wrapp-img-payment img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 8px;
}

.wrapp-payment-btn .zarinpal-wrapper {
  height: 45px;
  width: 45px;
  object-fit: contain;
}
.wrapp-payment-btn .zarinpal-wrapper img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.row-btns {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.pay-title {
  font-weight: 600;
  font-size: 16px;
  width: 100%;
  border-bottom: 1px solid rgb(242, 242, 242);
  margin-bottom: 20px;
  padding: 15px 0px;
}

.wrapp-payment-btn {
  border: 1px solid #000;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding-left: 15px;
  background-color: #fff !important;
  padding: 0px !important;
  width: 90%;
}
.wrapp-payment-btn h4 {
  font-size: 14px !important;
  margin-bottom: 0;
  font-weight: 600;
  padding: 5px;
}
.wrapp-payment-btn i {
  font-size: 16px;
  color: #38a815;
  font-weight: 800;
  padding: 20px 5px;
  border-left: 1px solid #000;
}
.wrapp-payment-btn:hover {
  background: #38a815 !important;
}
.wrapp-payment-btn:hover i {
  color: #fff;
  border-left: 1px solid #ffffff;
}
.wrapp-payment-btn:hover h4 {
  color: #fff;
}
.wrapp-payment-btn:hover img {
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.back-course {
  display: flex;
  align-items: center;
}
.back-course a {
  background-color: #fff;
}

.null-payment h5 {
  margin-bottom: 0px;
  display: flex;
  align-items: center;
}
.null-payment h5 span {
  font-size: 20px;
}
.null-payment h5 i {
  font-size: 30px;
  color: #ff8e8e;
  margin-left: 20px;
}

.date-detail,
.price-detail {
  justify-content: center;
}

.contact-form-feild {
  padding: 12px 20px;
  margin: 0px 10px;
  border: 1px solid rgb(242, 242, 242) !important;
  width: 100% !important;
}

.contact-form-lable {
  font-weight: 700;
  font-size: 16px;
  color: #0c0c0c;
  margin-right: 16px;
}

.contact-form-holder {
  padding: 20px 50px;
  background: #e8effb;
  border-radius: 4px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.contact-us-head h2 {
  margin-top: 10px;
  margin-bottom: 25px;
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 28px;
  padding: 2px 8px;
  width: max-content;
}
.contact-us-head h3 {
  font-size: 22px;
  color: rgba(0, 0, 0, 0.9333333333);
  font-weight: 700;
  padding-right: 20px;
  margin-bottom: 10px;
}
.contact-us-head p {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 20px;
  margin-right: 20px;
  color: #000;
}

.phone-link {
  color: #00064f;
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 20px;
  margin-right: 20px;
}

.social-contact-holder {
  display: flex;
  justify-content: center;
  background: #e8effb;
  height: 70px;
  width: 70px;
  align-items: center;
  border-radius: 8px;
}
.social-contact-holder i {
  font-size: 24px;
  color: #000000;
}

.bg-head h2 {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 44px;
  color: #fff;
}

.about-section h3 {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 36px;
  color: #000;
  margin-bottom: 20px;
}
.about-section p {
  font-size: 16px;
  text-align: justify;
  margin-top: 25px;
  margin-bottom: 20px;
}
.about-section ul {
  padding-right: 4rem;
}
.about-section ul li {
  line-height: 32px;
}

.bg-circles {
  background-image: url(/assets/images/vectors/circles.webp);
  height: 400px;
  background-size: contain;
  background-repeat: no-repeat;
}

.about-us-sections-img {
  height: 450px;
  width: 100%;
  padding: 10px;
  object-fit: contain;
}
.about-us-sections-img img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.about-titles {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 38px;
}

.about-article {
  padding: 10px 25px;
}
.about-article h4 {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 32px;
}
.about-article i {
  color: #7530f6;
}

.our-goal {
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.our-goal h3 {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 34px;
  background: #ffca1e;
  width: max-content;
  display: flex;
  align-items: center;
  justify-content: center;
}
.our-goal .wrapp-goal-text {
  padding: 10px 50px;
}
.our-goal .wrapp-goal-text p {
  text-align: center;
  font-size: 16px;
  margin-bottom: 20px;
}

.notfound-section {
  height: 300px;
  width: 100%;
  object-fit: contain;
}
.notfound-section img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  filter: grayscale(0.4);
}

.error-body {
  background: #fff;
  border-radius: 8px;
  position: relative;
  top: -80px;
  padding: 60px 40px;
}
.error-body h2 {
  color: #393939;
  font-size: 28px;
  font-weight: 700;
  margin-top: 20px;
}
.error-body .last-courses-heading {
  font-size: 22px;
  font-weight: 700;
  color: #000000;
}
.error-body .blog-wrapper {
  border: 1px solid rgb(242, 242, 242);
}

.detail-title span {
  font-size: 16px;
}

.detail-title {
  display: flex;
  justify-content: flex-start;
  flex-direction: row;
  align-items: center;
}

.sv-wrapp {
  background-color: rgb(25, 25, 25);
  direction: rtl;
  border-radius: 10px;
  padding: 15px;
}

.name-ins {
  font-size: 16px;
  width: 100%;
  border-bottom: 2px solid rgb(206, 161, 243);
  padding-bottom: 12px;
}

.off-title {
  color: rgb(255, 255, 255);
  font-size: 16px;
  margin-right: 0px;
  margin-bottom: 0px;
  opacity: 1;
}

.mini-title {
  border-bottom: 1px solid rgba(211, 135, 255, 0.253);
  text-align: right;
  margin: 20px 0px;
  color: #d4a7ff;
  padding-bottom: 20px;
}

.teacher-area {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid rgba(137, 108, 255, 0.492);
  padding-bottom: 20px;
}

.name-ins {
  font-size: 16px;
  width: max-content;
  border-bottom: 2px solid #cea1f3;
  padding-bottom: 12px;
}

.position {
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  font-size: 14px;
  color: #f8eeff;
  direction: rtl;
}

.all-about {
  display: flex;
  flex-direction: row;
}

.st-teaching {
  width: 33%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-top: 0px;
  padding: 20px 0px;
  border-right: 1px solid rgba(137, 108, 255, 0.492);
  border-bottom: 1px solid rgba(137, 108, 255, 0.492);
}

.st-teaching p {
  color: #000;
}

.st-teaching:last-child {
  border-right: none;
}

.teacher-mini-resome p {
  color: #fff;
}

.ht-heading {
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  font-size: 16px;
  font-weight: 900;
  color: #cd90ff;
}

.teacher-mini-resome {
  padding: 20px 10px;
}

.teacher-mini-resome p {
  font-size: 12px;
  direction: rtl;
  text-align: right;
  text-align: justify;
  margin-bottom: 10px;
}

.teacher-resume {
  padding: 5px 15px;
  padding-bottom: 7px;
  background-color: transparent;
  border: 2px solid rgba(202, 150, 248, 0.6588235294);
  border-radius: 4px;
  color: #ffffff;
}

.teacher-resume:hover {
  background-color: rgb(115, 0, 230);
  border: 2px solid rgb(115, 0, 230);
  color: #fff;
  -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15) !important;
  box-shadow: 0px 1px 0px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15) !important;
  transition: all linear 0.4s;
}

.sp-mario {
  margin: 20px 0px;
}

.one-box {
  margin-top: 30px;
  display: flex;
}

.one-box i {
  color: #28da87;
  font-size: 14px;
}

.course-description {
  direction: rtl;
  padding: 40px 30px;
  padding-bottom: 40px;
  text-align: right;
  background-color: rgb(25, 25, 25);
  border-radius: 10px;
  box-shadow: rgba(0, 0, 0, 0) 2px 0px 8px 6px, rgba(0, 0, 0, 0.01) -4px 1px 6px 2px !important;
}

.cd-title {
  margin-bottom: 20px;
  width: max-content;
  padding-bottom: 10px;
  color: rgb(255, 255, 255);
  border-bottom: 2px solid rgb(182, 111, 230);
}

.detail-box {
  margin-bottom: 20px;
  display: flex;
}

.add-all-filter {
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: rgb(152, 118, 255);
  border: none;
  font-weight: normal;
  margin-top: 25px;
  background-size: 300% 100%;
  moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
}
.add-all-filter span {
  font-size: 1rem;
  font-weight: 600;
  text-align: center;
}

.courses-cn {
  padding: 10px;
}

.none-box {
  direction: rtl;
  text-align: right;
}

.none-title {
  color: #fff;
  font-size: 22px;
}

.none-capt {
  font-size: 18px;
  color: #fff;
  margin-top: 20px;
}

.similar-box {
  background: rgba(0, 0, 0, 0.2784313725);
  padding: 30px 25px;
  border-radius: 8px;
  padding-bottom: 60px;
  margin-top: 25px;
}

.similar-carts {
  padding: 10px;
  background: #0f0f0f;
  border-radius: 10px;
  margin-bottom: 15px;
  box-shadow: rgba(0, 0, 0, 0.05) 4px 2px 7px 0px, rgba(0, 0, 0, 0.06) 3px 1px 11px 2px !important;
}

.similar-course {
  text-align: right;
  color: #fff;
  display: flex;
  padding-right: 8px;
  align-items: center;
  margin-bottom: 25px;
  position: relative;
}

.img-similar-holder {
  height: 150px;
  width: 100%;
  object-fit: cover;
  border-radius: 8px;
}

.img-similar-holder img {
  height: 150px;
  width: 100%;
  object-fit: cover;
  border-radius: 8px;
  box-shadow: rgba(0, 0, 0, 0.05) 4px 2px 7px 0px, rgba(0, 0, 0, 0.06) 3px 1px 11px 2px !important;
}

.similar-course span {
  text-align: right;
  font-size: 20px;
  padding-right: 20px;
  color: #fff;
}

.similar-details {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 15px;
  padding: 2px 5px;
}

.teracher-title {
  font-size: 14px;
  font-weight: normal;
  color: #fff;
  margin-left: 5px;
}

.st-cart {
  font-size: 12px;
  color: #fffff5;
}

.rotator {
  font-size: 10px;
  position: absolute;
  transform: rotate(180deg);
}

.top-none {
  position: relative;
  top: -70px;
}

.none-header {
  height: 330px;
  background: url(/assets/images/header/none.webp);
  background-position: left;
  background-size: cover;
  position: relative;
  top: -82px;
}

.add-all-filter:hover {
  transition: all 0.4s ease-in-out;
  box-shadow: 0 4px 15px 0 rgba(116, 79, 168, 0.02);
  background-image: linear-gradient(to right, #8290d2, #dab3ff, #bfd2fc, #c685ff);
  background-position: 100% 0;
  moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.8s linear;
}

.none-boxes:before,
.none-boxes:after {
  content: "";
  position: absolute;
  top: -1px;
  left: -1px;
  background: var(--none-shadow);
  background-size: 400%;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  border-radius: 6px;
  z-index: -1;
  animation: animate2 60s linear infinite;
}

.none-boxes:after {
  filter: blur(1px);
}

@keyframes animate {
  0% {
    background-position: 0 0;
  }
  50% {
    background-position: 300% 0;
  }
  100% {
    background-position: 0 0;
  }
}
.course-description p {
  color: #fff;
}

.detail-box i {
  color: rgb(117, 79, 254);
  font-size: 12px;
  margin-top: 8px;
  margin-left: 10px;
}

.caption-paragraph ul li {
  color: #fff;
}

.backspace-top {
  margin-top: 20px;
}

.each-comment {
  margin-top: 15px;
  display: flex;
  align-items: center;
  direction: rtl;
  width: 100%;
  text-align: right;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.047);
  justify-content: space-between;
}

.reply-box {
  margin-top: 15px;
  display: flex;
  align-items: center;
  direction: rtl;
  text-align: right;
  padding-bottom: 20px;
  background-color: rgb(36, 36, 36);
  width: 90%;
  padding: 20px;
  border-radius: 8px;
  position: relative;
  margin-bottom: 25px;
}

.reply-title {
  position: absolute;
  right: 0px;
  background: #191919;
  padding: 4px 10px;
  border-radius: 5px 0px 0px 5px;
  color: #fff;
  top: 12px;
  font-size: 12px;
}

.tab-content.card {
  border: none !important;
}

.parent:last-child {
  border-bottom: none;
  border: 2px solid #191919;
}

.cc-img {
  height: 80px;
  width: 80px;
  object-fit: cover;
  border-radius: 50%;
  background: #000;
  border: 5px solid rgb(117, 79, 254);
  -webkit-box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.07), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
  box-shadow: 0 10px 15px -3px rgba(56, 56, 56, 0.07), 0 4px 6px -2px rgba(43, 42, 42, 0.103) !important;
}

.name-user {
  font-size: 14px;
  margin-bottom: 12px;
  color: rgb(117, 79, 254);
}

#container iframe {
  width: 100% !important;
  height: 400px !important;
  border: none !important;
  border-radius: 20px !important;
}

.cc-img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.reply-btn {
  padding: 8px;
  background: #363636;
  color: #df8eff;
  border-radius: 5px;
}

.reply-btn:hover {
  padding: 8px;
  background: rgb(0, 0, 0);
  color: #df8eff;
  border-radius: 5px;
}

.modal-close span {
  position: relative;
  top: 2px;
}

.dc-row {
  color: white;
  padding-right: 15px;
}

.comment-body {
  width: 75%;
  margin-right: 10px;
}

.comment-body p {
  font-size: 12px;
  margin-bottom: 12px;
  color: #fff;
}

.date-comment {
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  direction: rtl;
  color: #ca8aff;
}

.top-jump {
  border-radius: 10px;
}

.pd-vn {
  padding: 0px 20px;
}

.title-course-banner {
  direction: rtl;
  text-align: right;
  height: 450px;
  display: flex;
  align-items: center;
}

.some-cream {
  color: #fff;
}

.some-cream h4 {
  margin-top: 40px;
  margin-bottom: 10px;
  font-size: 24px;
}

.some-cream p span a {
  margin-top: 40px;
  color: #fff;
  font-size: 12px;
}

.some-cream p span {
  color: #ccc;
}

.some-cream p {
  margin-top: 20px;
  margin-bottom: 10px;
}

.stars i {
  margin: 2px;
  font-size: 10px;
}

.icon-game {
  height: 60px;
  width: 60px;
  padding: 5px;
  object-fit: cover;
  position: absolute;
  top: -55px;
  margin-bottom: 50px;
  background: #3e3e3e;
  border-radius: 6px;
}

.rt-padding {
  padding-right: 25px;
}

.resume-heading {
  height: 300px;
  background-position: 0 0;
  background: center;
  background-image: url(/assets/images/header/5238994.webp);
  background-size: cover;
}

.teaching-owner {
  background-color: #fff;
  position: relative;
  top: 100px;
  margin-bottom: 150px;
  padding: 30px 20px;
  border-radius: 10px;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.teacher-head {
  display: flex;
  justify-content: space-between;
}

.profile-ct {
  height: 120px;
  width: 120px;
  object-fit: cover;
  border-radius: 50%;
  border: 3px;
}

.profile-ct img {
  height: 100%;
  width: 100%;
  border-radius: 50%;
  object-fit: cover;
}

.teacher-head {
  width: 100%;
  display: flex;
  align-items: center;
  direction: rtl;
  justify-content: flex-start;
}

.naming-here {
  font-size: 20px !important;
  font-weight: normal;
  color: #fff;
}

.caption-ct p {
  color: #fff;
}

.content-title {
  text-align: center;
  direction: rtl;
  color: #fff;
  margin-top: 40px;
  margin-bottom: 60px;
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  z-index: 1;
}

.content-title h3 {
  margin-bottom: 15px;
}

.success-box {
  height: 500px;
  margin: auto;
  background: #38216b;
  border-radius: 10px;
  padding: 30px 20;
}

body .scene_saturn__ring .layer_part,
body .scene_saturn__ring .small_part,
body .scene_saturn__ring .small,
body .scene_saturn__ring,
body .scene_saturn__sparks .spark,
body .scene_saturn__sparks,
body .scene_saturn__face .face_clip .mouth,
body .scene_saturn__face,
body .scene_saturn__shadowRing,
body .scene_saturn__shadow,
body .scene_saturn,
body .scene_titan,
body .scene_titanShadow,
body .scene,
body .scene_saturn__face .face_clip .eye,
body .scene_titan .eyes .eye {
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  top: 50%;
  transform: translateY(-50%);
}

body .scene_saturn__face .face_clip .eye,
body .scene_titan .eyes .eye {
  width: 6px;
  height: 6px;
  background: #53487a;
  border-radius: 10px;
  bottom: 34px;
  -webkit-animation: blink 1s 0s infinite linear;
  animation: blink 1s 0s infinite linear;
}

body .scene_saturn__face .face_clip .eye--left.eye,
body .scene_titan .eyes .eye--left.eye {
  left: -80px;
}

body .scene_saturn__face .face_clip .eye--right.eye,
body .scene_titan .eyes .eye--right.eye {
  left: 80px;
}

body .scene {
  perspective: 2600px;
  width: 500px;
  height: 400px;
  position: absolute;
  top: 340px;
  /* margin-top: 50px; */
}

body .scene_titanShadow {
  width: 84px;
  height: 21px;
  border-radius: 100%;
  transform-style: preserve-3d;
  box-shadow: 0px 200px 20px #291863;
  -webkit-animation: titan 6s infinite ease;
  animation: titan 6s infinite ease;
  bottom: 400px;
}

body .scene .t_wrap {
  -webkit-animation: titanWrap 6s infinite ease;
  animation: titanWrap 6s infinite ease;
}

body .scene_titan {
  width: 84px;
  height: 84px;
  border-radius: 42px;
  background: #a5c6ff;
  transform-style: preserve-3d;
  box-shadow: 0px 0px 0px 4px rgba(169, 187, 236, 0.3882352941) inset, -30px -20px 50px #637bff inset;
  -webkit-animation: titan 6s infinite ease;
  animation: titan 6s infinite ease;
  top: -220px;
}

body .scene_titan .eyes {
  -webkit-animation: titan_eye 6s infinite ease;
  animation: titan_eye 6s infinite ease;
}

body .scene_titan .eyes .eye.eye--left {
  left: -34px;
  bottom: -120px;
}

body .scene_titan .eyes .eye.eye--right {
  left: 34px;
  bottom: -120px;
}

body .scene_saturn {
  width: 152px;
  height: 152px;
  border-radius: 76px;
  background: white;
  transform-style: preserve-3d;
  box-shadow: 0px 0px 0px 4px rgba(255, 255, 255, 0.3294117647) inset, -30px -20px 50px #a5adff inset;
  -webkit-animation: saturn 0.6s infinite linear;
  animation: saturn 0.6s infinite linear;
}

body .scene_saturn__shadow {
  width: 152px;
  height: 38px;
  border-radius: 100%;
  box-shadow: 0 150px 40px #291863;
}

body .scene_saturn__shadowRing {
  width: 330px;
  height: 19px;
  border-radius: 100%;
  box-shadow: 0 150px 40px #291863;
  left: -100px;
  -webkit-animation: ringShadow 0.6s infinite linear;
  animation: ringShadow 0.6s infinite linear;
}

body .scene_saturn__face {
  width: 152px;
  height: 152px;
  border-radius: 76px;
  overflow: hidden;
}

body .scene_saturn__face .face_clip {
  position: relative;
  top: 95px;
  left: 14px;
  transform: rotate(8deg);
  -webkit-animation: face 3.6s infinite linear, faceTilt 0.9s infinite linear;
  animation: face 3.6s infinite linear, faceTilt 0.9s infinite linear;
}

body .scene_saturn__face .face_clip .mouth {
  width: 15px;
  height: 10px;
  top: -5px;
  background: #ea0e61;
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
  box-shadow: 0 6px 0px #53487a inset;
}

body .scene_saturn__sparks {
  transform: translateZ(-100px);
}

body .scene_saturn__sparks .spark {
  width: 20px;
  height: 20px;
  border-radius: 10px;
  background: #00f7ff;
}

body .scene_saturn__sparks .spark:nth-of-type(odd) {
  background: white;
}

@-webkit-keyframes spark--1 {
  from {
    transform: scale(1);
  }
  to {
    left: -3px;
    top: 107px;
    transform: scale(0);
  }
}
@keyframes spark--1 {
  from {
    transform: scale(1);
  }
  to {
    left: -3px;
    top: 107px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(1) {
  -webkit-animation: spark--1 1s 0.1s infinite;
  animation: spark--1 1s 0.1s infinite;
}

@-webkit-keyframes spark--2 {
  from {
    transform: scale(1);
  }
  to {
    left: -111px;
    top: -195px;
    transform: scale(0);
  }
}
@keyframes spark--2 {
  from {
    transform: scale(1);
  }
  to {
    left: -111px;
    top: -195px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(2) {
  -webkit-animation: spark--2 1s 0.2s infinite;
  animation: spark--2 1s 0.2s infinite;
}

@-webkit-keyframes spark--3 {
  from {
    transform: scale(1);
  }
  to {
    left: 12px;
    top: 182px;
    transform: scale(0);
  }
}
@keyframes spark--3 {
  from {
    transform: scale(1);
  }
  to {
    left: 12px;
    top: 182px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(3) {
  -webkit-animation: spark--3 1s 0.3s infinite;
  animation: spark--3 1s 0.3s infinite;
}

@-webkit-keyframes spark--4 {
  from {
    transform: scale(1);
  }
  to {
    left: -28px;
    top: 6px;
    transform: scale(0);
  }
}
@keyframes spark--4 {
  from {
    transform: scale(1);
  }
  to {
    left: -28px;
    top: 6px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(4) {
  -webkit-animation: spark--4 1s 0.4s infinite;
  animation: spark--4 1s 0.4s infinite;
}

@-webkit-keyframes spark--5 {
  from {
    transform: scale(1);
  }
  to {
    left: -23px;
    top: -137px;
    transform: scale(0);
  }
}
@keyframes spark--5 {
  from {
    transform: scale(1);
  }
  to {
    left: -23px;
    top: -137px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(5) {
  -webkit-animation: spark--5 1s 0.5s infinite;
  animation: spark--5 1s 0.5s infinite;
}

@-webkit-keyframes spark--6 {
  from {
    transform: scale(1);
  }
  to {
    left: 85px;
    top: -102px;
    transform: scale(0);
  }
}
@keyframes spark--6 {
  from {
    transform: scale(1);
  }
  to {
    left: 85px;
    top: -102px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(6) {
  -webkit-animation: spark--6 1s 0.6s infinite;
  animation: spark--6 1s 0.6s infinite;
}

@-webkit-keyframes spark--7 {
  from {
    transform: scale(1);
  }
  to {
    left: -78px;
    top: 68px;
    transform: scale(0);
  }
}
@keyframes spark--7 {
  from {
    transform: scale(1);
  }
  to {
    left: -78px;
    top: 68px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(7) {
  -webkit-animation: spark--7 1s 0.7s infinite;
  animation: spark--7 1s 0.7s infinite;
}

@-webkit-keyframes spark--8 {
  from {
    transform: scale(1);
  }
  to {
    left: -2px;
    top: -139px;
    transform: scale(0);
  }
}
@keyframes spark--8 {
  from {
    transform: scale(1);
  }
  to {
    left: -2px;
    top: -139px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(8) {
  -webkit-animation: spark--8 1s 0.8s infinite;
  animation: spark--8 1s 0.8s infinite;
}

@-webkit-keyframes spark--9 {
  from {
    transform: scale(1);
  }
  to {
    left: 20px;
    top: -112px;
    transform: scale(0);
  }
}
@keyframes spark--9 {
  from {
    transform: scale(1);
  }
  to {
    left: 20px;
    top: -112px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(9) {
  -webkit-animation: spark--9 1s 0.9s infinite;
  animation: spark--9 1s 0.9s infinite;
}

@-webkit-keyframes spark--10 {
  from {
    transform: scale(1);
  }
  to {
    left: -57px;
    top: -139px;
    transform: scale(0);
  }
}
@keyframes spark--10 {
  from {
    transform: scale(1);
  }
  to {
    left: -57px;
    top: -139px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(10) {
  -webkit-animation: spark--10 1s 1s infinite;
  animation: spark--10 1s 1s infinite;
}

@-webkit-keyframes spark--11 {
  from {
    transform: scale(1);
  }
  to {
    left: -110px;
    top: 137px;
    transform: scale(0);
  }
}
@keyframes spark--11 {
  from {
    transform: scale(1);
  }
  to {
    left: -110px;
    top: 137px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(11) {
  -webkit-animation: spark--11 1s 1.1s infinite;
  animation: spark--11 1s 1.1s infinite;
}

@-webkit-keyframes spark--12 {
  from {
    transform: scale(1);
  }
  to {
    left: 99px;
    top: -160px;
    transform: scale(0);
  }
}
@keyframes spark--12 {
  from {
    transform: scale(1);
  }
  to {
    left: 99px;
    top: -160px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(12) {
  -webkit-animation: spark--12 1s 1.2s infinite;
  animation: spark--12 1s 1.2s infinite;
}

@-webkit-keyframes spark--13 {
  from {
    transform: scale(1);
  }
  to {
    left: -61px;
    top: -71px;
    transform: scale(0);
  }
}
@keyframes spark--13 {
  from {
    transform: scale(1);
  }
  to {
    left: -61px;
    top: -71px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(13) {
  -webkit-animation: spark--13 1s 1.3s infinite;
  animation: spark--13 1s 1.3s infinite;
}

@-webkit-keyframes spark--14 {
  from {
    transform: scale(1);
  }
  to {
    left: -133px;
    top: 150px;
    transform: scale(0);
  }
}
@keyframes spark--14 {
  from {
    transform: scale(1);
  }
  to {
    left: -133px;
    top: 150px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(14) {
  -webkit-animation: spark--14 1s 1.4s infinite;
  animation: spark--14 1s 1.4s infinite;
}

@-webkit-keyframes spark--15 {
  from {
    transform: scale(1);
  }
  to {
    left: -58px;
    top: 63px;
    transform: scale(0);
  }
}
@keyframes spark--15 {
  from {
    transform: scale(1);
  }
  to {
    left: -58px;
    top: 63px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(15) {
  -webkit-animation: spark--15 1s 1.5s infinite;
  animation: spark--15 1s 1.5s infinite;
}

@-webkit-keyframes spark--16 {
  from {
    transform: scale(1);
  }
  to {
    left: -155px;
    top: -56px;
    transform: scale(0);
  }
}
@keyframes spark--16 {
  from {
    transform: scale(1);
  }
  to {
    left: -155px;
    top: -56px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(16) {
  -webkit-animation: spark--16 1s 1.6s infinite;
  animation: spark--16 1s 1.6s infinite;
}

@-webkit-keyframes spark--17 {
  from {
    transform: scale(1);
  }
  to {
    left: -30px;
    top: -63px;
    transform: scale(0);
  }
}
@keyframes spark--17 {
  from {
    transform: scale(1);
  }
  to {
    left: -30px;
    top: -63px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(17) {
  -webkit-animation: spark--17 1s 1.7s infinite;
  animation: spark--17 1s 1.7s infinite;
}

@-webkit-keyframes spark--18 {
  from {
    transform: scale(1);
  }
  to {
    left: 153px;
    top: -120px;
    transform: scale(0);
  }
}
@keyframes spark--18 {
  from {
    transform: scale(1);
  }
  to {
    left: 153px;
    top: -120px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(18) {
  -webkit-animation: spark--18 1s 1.8s infinite;
  animation: spark--18 1s 1.8s infinite;
}

@-webkit-keyframes spark--19 {
  from {
    transform: scale(1);
  }
  to {
    left: -104px;
    top: -194px;
    transform: scale(0);
  }
}
@keyframes spark--19 {
  from {
    transform: scale(1);
  }
  to {
    left: -104px;
    top: -194px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(19) {
  -webkit-animation: spark--19 1s 1.9s infinite;
  animation: spark--19 1s 1.9s infinite;
}

@-webkit-keyframes spark--20 {
  from {
    transform: scale(1);
  }
  to {
    left: -107px;
    top: 198px;
    transform: scale(0);
  }
}
@keyframes spark--20 {
  from {
    transform: scale(1);
  }
  to {
    left: -107px;
    top: 198px;
    transform: scale(0);
  }
}
body .scene_saturn__sparks .spark:nth-of-type(20) {
  -webkit-animation: spark--20 1s 2s infinite;
  animation: spark--20 1s 2s infinite;
}

body .scene_saturn__ring {
  transform: rotateX(84deg) rotateY(8deg);
  transform-origin: 50% 165px;
  -webkit-animation: ring 0.6s infinite linear;
  animation: ring 0.6s infinite linear;
  top: -80px;
}

body .scene_saturn__ring .small {
  -webkit-animation: spin 0.6s infinite linear;
  animation: spin 0.6s infinite linear;
  transform-origin: 50% 195px;
  top: -50px;
}

body .scene_saturn__ring .small_part {
  width: 30px;
  background: #08f7ff;
  transform-origin: 50% 195px;
}

body .scene_saturn__ring .small_part:nth-of-type(1) {
  transform: rotate(2deg);
  height: 9.75px;
}

body .scene_saturn__ring .small_part:nth-of-type(2) {
  transform: rotate(4deg);
  height: 9.5px;
}

body .scene_saturn__ring .small_part:nth-of-type(3) {
  transform: rotate(6deg);
  height: 9.25px;
}

body .scene_saturn__ring .small_part:nth-of-type(4) {
  transform: rotate(8deg);
  height: 9px;
}

body .scene_saturn__ring .small_part:nth-of-type(5) {
  transform: rotate(10deg);
  height: 8.75px;
}

body .scene_saturn__ring .small_part:nth-of-type(6) {
  transform: rotate(12deg);
  height: 8.5px;
}

body .scene_saturn__ring .small_part:nth-of-type(7) {
  transform: rotate(14deg);
  height: 8.25px;
}

body .scene_saturn__ring .small_part:nth-of-type(8) {
  transform: rotate(16deg);
  height: 8px;
}

body .scene_saturn__ring .small_part:nth-of-type(9) {
  transform: rotate(18deg);
  height: 7.75px;
}

body .scene_saturn__ring .small_part:nth-of-type(10) {
  transform: rotate(20deg);
  height: 7.5px;
}

body .scene_saturn__ring .small_part:nth-of-type(11) {
  transform: rotate(22deg);
  height: 7.25px;
}

body .scene_saturn__ring .small_part:nth-of-type(12) {
  transform: rotate(24deg);
  height: 7px;
}

body .scene_saturn__ring .small_part:nth-of-type(13) {
  transform: rotate(26deg);
  height: 6.75px;
}

body .scene_saturn__ring .small_part:nth-of-type(14) {
  transform: rotate(28deg);
  height: 6.5px;
}

body .scene_saturn__ring .small_part:nth-of-type(15) {
  transform: rotate(30deg);
  height: 6.25px;
}

body .scene_saturn__ring .small_part:nth-of-type(16) {
  transform: rotate(32deg);
  height: 6px;
}

body .scene_saturn__ring .small_part:nth-of-type(17) {
  transform: rotate(34deg);
  height: 5.75px;
}

body .scene_saturn__ring .small_part:nth-of-type(18) {
  transform: rotate(36deg);
  height: 5.5px;
}

body .scene_saturn__ring .small_part:nth-of-type(19) {
  transform: rotate(38deg);
  height: 5.25px;
}

body .scene_saturn__ring .small_part:nth-of-type(20) {
  transform: rotate(40deg);
  height: 5px;
}

body .scene_saturn__ring .small_part:nth-of-type(21) {
  transform: rotate(42deg);
  height: 4.75px;
}

body .scene_saturn__ring .small_part:nth-of-type(22) {
  transform: rotate(44deg);
  height: 4.5px;
}

body .scene_saturn__ring .small_part:nth-of-type(23) {
  transform: rotate(46deg);
  height: 4.25px;
}

body .scene_saturn__ring .small_part:nth-of-type(24) {
  transform: rotate(48deg);
  height: 4px;
}

body .scene_saturn__ring .small_part:nth-of-type(25) {
  transform: rotate(50deg);
  height: 3.75px;
}

body .scene_saturn__ring .small_part:nth-of-type(26) {
  transform: rotate(52deg);
  height: 3.5px;
}

body .scene_saturn__ring .small_part:nth-of-type(27) {
  transform: rotate(54deg);
  height: 3.25px;
}

body .scene_saturn__ring .small_part:nth-of-type(28) {
  transform: rotate(56deg);
  height: 3px;
}

body .scene_saturn__ring .small_part:nth-of-type(29) {
  transform: rotate(58deg);
  height: 2.75px;
}

body .scene_saturn__ring .small_part:nth-of-type(30) {
  transform: rotate(60deg);
  height: 2.5px;
}

body .scene_saturn__ring .small_part:nth-of-type(31) {
  transform: rotate(62deg);
  height: 2.25px;
}

body .scene_saturn__ring .small_part:nth-of-type(32) {
  transform: rotate(64deg);
  height: 2px;
}

body .scene_saturn__ring .small_part:nth-of-type(33) {
  transform: rotate(66deg);
  height: 1.75px;
}

body .scene_saturn__ring .small_part:nth-of-type(34) {
  transform: rotate(68deg);
  height: 1.5px;
}

body .scene_saturn__ring .small_part:nth-of-type(35) {
  transform: rotate(70deg);
  height: 1.25px;
}

body .scene_saturn__ring .small_part:nth-of-type(36) {
  transform: rotate(72deg);
  height: 1px;
}

body .scene_saturn__ring .small_part:nth-of-type(37) {
  transform: rotate(74deg);
  height: 0.75px;
}

body .scene_saturn__ring .small_part:nth-of-type(38) {
  transform: rotate(76deg);
  height: 0.5px;
}

body .scene_saturn__ring .small_part:nth-of-type(39) {
  transform: rotate(78deg);
  height: 0.25px;
}

body .scene_saturn__ring .small_part:nth-of-type(40) {
  transform: rotate(80deg);
  height: 0px;
}

body .scene_saturn__ring .layer {
  position: relative;
}

body .scene_saturn__ring .layer:nth-of-type(1) .layer_part {
  background: #08ffff;
}

body .scene_saturn__ring .layer:nth-of-type(2) .layer_part {
  background: #08ffff;
}

body .scene_saturn__ring .layer:nth-of-type(2) {
  top: 6px;
}

body .scene_saturn__ring .layer:nth-of-type(3) {
  top: -6px;
}

body .scene_saturn__ring .layer:nth-of-type(4) {
  top: -18px;
}

body .scene_saturn__ring .layer_part {
  width: 20px;
  height: 50px;
  background: #21ced2;
  transform-origin: 50% 165px;
}

body .scene_saturn__ring .layer_part:nth-of-type(1) {
  transform: translateY(-50%) rotate(7.2deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(2) {
  transform: translateY(-50%) rotate(14.4deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(3) {
  transform: translateY(-50%) rotate(21.6deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(4) {
  transform: translateY(-50%) rotate(28.8deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(5) {
  transform: translateY(-50%) rotate(36deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(6) {
  transform: translateY(-50%) rotate(43.2deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(7) {
  transform: translateY(-50%) rotate(50.4deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(8) {
  transform: translateY(-50%) rotate(57.6deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(9) {
  transform: translateY(-50%) rotate(64.8deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(10) {
  transform: translateY(-50%) rotate(72deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(11) {
  transform: translateY(-50%) rotate(79.2deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(12) {
  transform: translateY(-50%) rotate(86.4deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(13) {
  transform: translateY(-50%) rotate(93.6deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(14) {
  transform: translateY(-50%) rotate(100.8deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(15) {
  transform: translateY(-50%) rotate(108deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(16) {
  transform: translateY(-50%) rotate(115.2deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(17) {
  transform: translateY(-50%) rotate(122.4deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(18) {
  transform: translateY(-50%) rotate(129.6deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(19) {
  transform: translateY(-50%) rotate(136.8deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(20) {
  transform: translateY(-50%) rotate(144deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(21) {
  transform: translateY(-50%) rotate(151.2deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(22) {
  transform: translateY(-50%) rotate(158.4deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(23) {
  transform: translateY(-50%) rotate(165.6deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(24) {
  transform: translateY(-50%) rotate(172.8deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(25) {
  transform: translateY(-50%) rotate(180deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(26) {
  transform: translateY(-50%) rotate(187.2deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(27) {
  transform: translateY(-50%) rotate(194.4deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(28) {
  transform: translateY(-50%) rotate(201.6deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(29) {
  transform: translateY(-50%) rotate(208.8deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(30) {
  transform: translateY(-50%) rotate(216deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(31) {
  transform: translateY(-50%) rotate(223.2deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(32) {
  transform: translateY(-50%) rotate(230.4deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(33) {
  transform: translateY(-50%) rotate(237.6deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(34) {
  transform: translateY(-50%) rotate(244.8deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(35) {
  transform: translateY(-50%) rotate(252deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(36) {
  transform: translateY(-50%) rotate(259.2deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(37) {
  transform: translateY(-50%) rotate(266.4deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(38) {
  transform: translateY(-50%) rotate(273.6deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(39) {
  transform: translateY(-50%) rotate(280.8deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(40) {
  transform: translateY(-50%) rotate(288deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(41) {
  transform: translateY(-50%) rotate(295.2deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(42) {
  transform: translateY(-50%) rotate(302.4deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(43) {
  transform: translateY(-50%) rotate(309.6deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(44) {
  transform: translateY(-50%) rotate(316.8deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(45) {
  transform: translateY(-50%) rotate(324deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(46) {
  transform: translateY(-50%) rotate(331.2deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(47) {
  transform: translateY(-50%) rotate(338.4deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(48) {
  transform: translateY(-50%) rotate(345.6deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(49) {
  transform: translateY(-50%) rotate(352.8deg);
}

body .scene_saturn__ring .layer_part:nth-of-type(50) {
  transform: translateY(-50%) rotate(360deg);
}

blockquote {
  margin: 10px 0px;
  background: #f4eeff;
  border-radius: 5px;
  padding: 10px;
  padding-right: 20px;
  font-size: 15px;
  position: relative;
  direction: rtl;
}
blockquote p {
  font-size: 14px;
}

blockquote::before {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  width: 4px;
  height: 100%;
  background: linear-gradient(237deg, #f4eeff 0.64%, #8e66d6 98.23%);
}

.wrapp-course-captions ul {
  padding: 0px 30px;
  margin: 20px 0px;
}

.blog-wrappering ul {
  padding: 0px 30px;
  margin: 20px 0px;
}

.tab-pane ul li {
  color: #278cda !important;
  font-size: 14px;
}
.tab-pane ul li span {
  color: #278cda !important;
  font-size: 15px;
}

.html-entities {
  direction: ltr;
}

@-webkit-keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
@-webkit-keyframes saturn {
  0% {
    left: 0;
  }
  25% {
    left: -40px;
  }
  50% {
    left: 0px;
  }
  75% {
    left: 40px;
  }
}
@keyframes saturn {
  0% {
    left: 0;
  }
  25% {
    left: -40px;
  }
  50% {
    left: 0px;
  }
  75% {
    left: 40px;
  }
}
@-webkit-keyframes ring {
  0% {
    left: 0;
    transform: rotateX(84deg) rotateY(8deg);
  }
  25% {
    left: 70px;
  }
  50% {
    left: 0px;
    transform: rotateX(80deg) rotateY(-8deg);
  }
  75% {
    left: -70px;
  }
  100% {
    left: 0px;
    transform: rotateX(84deg) rotateY(8deg);
  }
}
@keyframes ring {
  0% {
    left: 0;
    transform: rotateX(84deg) rotateY(8deg);
  }
  25% {
    left: 70px;
  }
  50% {
    left: 0px;
    transform: rotateX(80deg) rotateY(-8deg);
  }
  75% {
    left: -70px;
  }
  100% {
    left: 0px;
    transform: rotateX(84deg) rotateY(8deg);
  }
}
@-webkit-keyframes ringShadow {
  0% {
    left: -100px;
  }
  25% {
    left: -40px;
  }
  50% {
    left: -100px;
  }
  75% {
    left: -140px;
  }
  100% {
    left: -100px;
  }
}
@keyframes ringShadow {
  0% {
    left: -100px;
  }
  25% {
    left: -40px;
  }
  50% {
    left: -100px;
  }
  75% {
    left: -140px;
  }
  100% {
    left: -100px;
  }
}
@-webkit-keyframes face {
  from {
    left: -200px;
  }
  to {
    left: 200px;
  }
}
@keyframes face {
  from {
    left: -200px;
  }
  to {
    left: 200px;
  }
}
@-webkit-keyframes faceTilt {
  0% {
    transform: rotate(12deg);
  }
  50% {
    transform: rotate(-12deg);
  }
  100% {
    transform: rotate(12deg);
  }
}
@keyframes faceTilt {
  0% {
    transform: rotate(12deg);
  }
  50% {
    transform: rotate(-12deg);
  }
  100% {
    transform: rotate(12deg);
  }
}
@-webkit-keyframes ringTwo {
  0% {
    transform: rotateX(84deg);
  }
  50% {
    transform: rotateX(76deg);
  }
  100% {
    transform: rotateX(84deg);
  }
}
@keyframes ringTwo {
  0% {
    transform: rotateX(84deg);
  }
  50% {
    transform: rotateX(76deg);
  }
  100% {
    transform: rotateX(84deg);
  }
}
@-webkit-keyframes blink {
  0% {
    height: 6px;
  }
  40% {
    height: 6px;
  }
  50% {
    height: 0px;
  }
  60% {
    height: 6px;
  }
  100% {
    height: 6px;
  }
}
@keyframes blink {
  0% {
    height: 6px;
  }
  40% {
    height: 6px;
  }
  50% {
    height: 0px;
  }
  60% {
    height: 6px;
  }
  100% {
    height: 6px;
  }
}
@-webkit-keyframes titanWrap {
  0% {
    transform: translateY(370px);
  }
  33% {
    transform: translateY(370px);
  }
  38% {
    transform: translateY(400px);
  }
  43% {
    transform: translateY(370px);
  }
  73% {
    transform: translateY(370px);
  }
  78% {
    transform: translateY(400px);
  }
  83% {
    transform: translateY(370px);
  }
  100% {
    transform: translateY(370px);
  }
}
@keyframes titanWrap {
  0% {
    transform: translateY(370px);
  }
  33% {
    transform: translateY(370px);
  }
  38% {
    transform: translateY(400px);
  }
  43% {
    transform: translateY(370px);
  }
  73% {
    transform: translateY(370px);
  }
  78% {
    transform: translateY(400px);
  }
  83% {
    transform: translateY(370px);
  }
  100% {
    transform: translateY(370px);
  }
}
@-webkit-keyframes titan {
  0% {
    left: -400px;
  }
  33% {
    left: -400px;
  }
  43% {
    left: 400px;
  }
  73% {
    left: 400px;
  }
  83% {
    left: -400px;
  }
  100% {
    left: -400px;
  }
}
@keyframes titan {
  0% {
    left: -400px;
  }
  33% {
    left: -400px;
  }
  43% {
    left: 400px;
  }
  73% {
    left: 400px;
  }
  83% {
    left: -400px;
  }
  100% {
    left: -400px;
  }
}
@-webkit-keyframes titan_eye {
  0% {
    transform: rotate(-10deg);
  }
  33% {
    transform: rotate(-10deg);
  }
  43% {
    transform: rotate(10deg);
  }
  73% {
    transform: rotate(10deg);
  }
  83% {
    transform: rotate(-10deg);
  }
  100% {
    transform: rotate(-10deg);
  }
}
@keyframes titan_eye {
  0% {
    transform: rotate(-10deg);
  }
  33% {
    transform: rotate(-10deg);
  }
  43% {
    transform: rotate(10deg);
  }
  73% {
    transform: rotate(10deg);
  }
  83% {
    transform: rotate(-10deg);
  }
  100% {
    transform: rotate(-10deg);
  }
}
.caption-ct {
  text-align: right;
  margin-right: 18px;
  border-right: 4px solid #b872ff;
  padding: 0px 20px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.content-teaching {
  direction: rtl;
  text-align: right;
  padding: 30px 40px;
  width: 100%;
}

.new-courses .nw-cr {
  font-size: 2.2rem;
  font-weight: 800;
  color: #14003b;
}
.new-courses .w-sugestion {
  font-size: 1.5rem;
  font-weight: 800;
  color: rgb(20, 0, 59);
}
.new-courses div {
  width: 70%;
  height: 1px;
  background: rgba(20, 0, 59, 0.12);
}
.new-courses .see-sugestion {
  font-size: 1rem;
  font-weight: 800;
  color: #14003b;
}

.w-best-courses {
  position: relative;
  top: -100px;
}

.width-btn {
  width: max-content !important;
  height: 45px !important;
  padding: 5px 15px;
}

.content-teaching h4 {
  font-size: 18px;
  color: #000;
  font-weight: normal;
  margin-bottom: 20px;
}

.content-teaching p {
  direction: rtl;
  text-align: justify;
  font-size: 16px;
  line-height: 28px;
  color: #000;
}

.img-cst {
  height: 65px;
  width: 105px;
  object-fit: cover;
  border-radius: 10px;
}

.img-cst img {
  height: 100%;
  width: 100%;
  border-radius: 6px;
  object-fit: cover;
}

.courses-wrapp {
  display: flex;
  direction: rtl;
  text-align: right;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(152, 118, 255, 0.13);
}

.course-wrapp:first-child {
  border-bottom: none;
}

.cm-detail {
  margin-right: 20px;
}

.dd-info {
  display: flex;
}

.i-clock {
  font-size: 12px;
  color: #4ed5da;
  margin-left: 12px;
}

.i-chart {
  font-size: 12px;
  color: #754ffe;
  margin-right: 20px;
  margin-left: 12px;
}

.sp-dd {
  font-size: 12px;
  color: #fff;
}

.pholder {
  padding: 10px 35px;
  text-align: right;
  direction: ltr;
}

.title-courses {
  font-weight: 700;
  font-size: 18px;
  color: #fff;
}

.nm-cc {
  color: #fff;
  font-size: 14px;
}

.count {
  margin-right: 12px;
  font-size: 14px;
  color: #9876ff;
  font-weight: normal;
}

.wrapp-cf {
  display: flex;
  direction: rtl;
  width: 100%;
}

.img-fc {
  padding: 10px;
  padding-right: 0px;
  height: 145px;
  width: 240px !important;
  object-fit: cover;
  border-radius: 4px;
}

.tags-each {
  padding: 8px 15px;
  margin: 3px;
  margin-right: 0px;
  color: #fff;
  background-color: #000;
  border-radius: 30px;
}

.tags-each:hover {
  color: #fff;
  background-color: #6e42ff;
}

.tag-row {
  display: block;
  padding: 10px 0px;
}

.img-fc img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 4px;
}

.tags-here {
  display: flex;
  flex-wrap: wrap;
}

.owl-nav {
  display: none;
}

.wrapp-acf {
  margin-top: 0px;
  padding: 20px;
  direction: rtl;
}

.content-cf {
  text-align: right;
  padding: 10px;
  display: flex;
  align-items: flex-start;
  width: 85%;
}

.tag-settings {
  display: flex;
}

.tag-settings a {
  margin: 5px 0px;
}

.name-tc {
  margin-left: 20px !important;
  color: rgb(255, 255, 255);
}

.cart-level i {
  color: #9876ff;
}

.cart-level {
  color: rgb(255, 255, 255);
}

.n-toman {
  color: rgb(152, 118, 255);
}

.rating {
  margin-top: 8px !important;
  margin-right: 18px !important;
  color: rgb(152, 118, 255);
  font-size: 9px;
}

.wrapp-cf {
  padding: 10px 0px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.6784313725);
}

.title-cf {
  color: rgb(255, 255, 255);
  font-size: 16px;
  margin-bottom: 15px;
}

.caption-cf {
  color: rgb(173, 173, 173);
  font-size: 12px;
  line-height: 20px;
  margin-bottom: 12px;
}

.no-bb {
  border-bottom: none;
}

.caption-cf {
  font-size: 12px;
}

.wrapp-second {
  margin-right: 30px;
  padding-top: 35px;
}

.price {
  margin-top: 20px;
}

.price-in {
  color: #000;
  font-weight: 600;
  font-size: 16px;
}

.wrapp-first {
  width: 100%;
  margin-top: 12px;
}

.wrapp-second {
  width: 15%;
}

.toman {
  color: #c78cff;
  font-size: 10px;
}

.filter-button {
  background: transparent;
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  border: none !important;
  padding: 10px 25px;
  width: 100%;
  position: relative;
}

.filter-button i {
  margin-left: 10px;
  color: #9876ff;
  position: absolute;
  top: 40px;
  z-index: 1;
  left: 5px;
}

.df-selector {
  height: 55px;
  background: #fff;
  direction: rtl;
  text-align: right;
  margin-left: 0px;
  border-color: #fff;
  color: #000;
  font-size: 14px;
}

.df-selector > select > option {
  padding-bottom: 20px !important;
  margin-bottom: 10px !important;
  height: 40px !important;
}

.button-filters {
  margin-top: 0px;
  direction: rtl;
}

.filter-box {
  padding-right: 0px;
  padding-left: 20px;
}

.filter-according {
  background-color: #000;
  border: none;
  border-right: none;
  border-left: none;
  text-align: right;
  direction: rtl;
  border-radius: 8px !important;
  height: 50px;
  justify-content: flex-start;
  width: 100%;
}

.filter-according > h2 > button span {
  color: #000 !important;
  -webkit-text-fill-color: #000 !important;
}

.bt-nice {
  border-radius: 8px !important;
}

.background-faq {
  height: 450px;
  padding: 0px;
  background: fixed;
  background-image: url(/assets/images/banner/faq.webp);
  background-size: cover;
  background-position: top;
  position: relative;
  top: -82px;
}

.background-terms {
  background-image: url(/assets/images/banner/terms.webp);
  background-position: top left !important;
}

.holder-setting {
  height: 255px;
  width: 260px;
  object-fit: contain;
}

.holder-termes {
  height: 0px;
  position: absolute;
  top: -202px;
}

.holder-setting img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.wrapp-faq {
  height: 100%;
  width: 100%;
  background: hsl(276, 91%, 79%);
  background: linear-gradient(90deg, hsl(276, 100%, 84%) 0%, hsl(254, 100%, 50%) 100%);
  background: -moz-linear-gradient(90deg, hsl(276, 91%, 79%) 0%, hsl(254, 74%, 65%) 100%);
  background: -webkit-linear-gradient(16deg, hsla(276, 100%, 18%, 0.82) 0%, hsla(254, 100%, 18%, 0.89) 100%);
  display: flex;
  align-items: center;
  text-align: right;
}

.circle-in-header {
  width: 250px;
  height: 250px;
  background: inherit;
  position: absolute;
  overflow: hidden;
  top: -20%;
  left: 10%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  animation: mover-mobile 1.6s infinite alternate;
}

.big-q {
  font-size: 150px;
  color: #fff;
  margin-bottom: 0px;
  animation: mover-mobile 1.9s infinite alternate;
}

.min-q {
  color: rgba(255, 255, 255, 0.3411764706);
  font-size: 100px;
  position: absolute;
  top: 100px;
  left: 62px;
  animation: mover-mobile 1.6s infinite alternate;
}

.circle-in-header:before {
  width: 400px;
  height: 550px;
  content: "";
  position: absolute;
  top: -25px;
  left: -25px;
  bottom: 0;
  right: 0;
  background: inherit;
  box-shadow: inset 0 0 0 200px rgba(255, 255, 255, 0.08);
  filter: blur(10px);
}

.holder-dotti {
  height: 0px;
  position: absolute;
  top: -135px;
}

.no-setting {
  height: 78px;
  width: 202px;
  object-fit: contain;
}

.no-setting img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.faq-body {
  color: #fff;
  font-size: 22px;
  font-weight: normal;
}

.faq-caption {
  text-align: center;
  color: rgba(205, 205, 205, 0.8);
  font-size: 18px;
  margin-top: 25px;
}

.select-question {
  height: 150px;
  direction: rtl;
  display: flex;
  align-items: center;
  padding: 15px 25px;
  border-radius: 10px;
  width: 100%;
  margin-bottom: 25px;
  background-size: 300% 100%;
  box-shadow: 0px 0px 2px 3px rgba(0, 0, 0, 0.07), -1px 1px 3px 0px rgba(0, 0, 0, 0.13) !important;
}

.select-question:hover {
  box-shadow: 0 4px 15px 0 rgba(116, 79, 168, 0.02);
  background-image: linear-gradient(to right, rgba(152, 95, 245, 0.3803921569), rgba(89, 128, 214, 0.5411764706), rgba(89, 128, 214, 0.5490196078), rgba(90, 129, 215, 0.3019607843));
  background-position: 100% 0;
  moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.8s linear;
}

.arrow-link {
  border-radius: 50%;
  background: hsla(276, 91%, 79%, 0.36);
  padding: 13px 14px;
  display: flex;
  align-items: center;
}

.arrow-link {
  color: #fff;
}

.content-question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 80%;
}

.anwser-box {
  min-height: 350px;
  border: 1px solid #754ffe;
  border-radius: 0px 0px 20px 20px;
  background: #191919;
  box-shadow: 0 2px 6px -1px rgba(0, 0, 0, 0.07), 0 6px 18px -1px rgba(0, 0, 0, 0.51) !important;
}

.more-awnser {
  color: #ccb8f0;
  font-weight: normal;
  font-size: 13px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  line-break: anywhere !important;
}

.more-awnser h6 {
  font-size: 13px;
  margin-bottom: 0px;
  line-break: anywhere !important;
}

.more-awnser i {
  font-size: 8px;
  margin-left: 5px;
}

.more-according {
  margin-top: 30px;
}

.more-awnser:hover,
.more-awnser:focus,
.more-awnser:active {
  color: rgba(199, 168, 255, 0.9803921569) !important;
}

.qu-heading {
  height: 55px;
  border: 1px solid #191919;
  background-color: #202020;
  padding: 20px 25px;
  display: flex;
  justify-content: flex-start;
  direction: rtl;
  align-items: center;
}

.qu-heading:hover,
.qu-heading:focus,
.qu-heading:active {
  background-color: #272626 !important;
  color: rgba(199, 168, 255, 0.9803921569) !important;
  opacity: 1 !important;
}

.sett-arrows {
  padding: 0px;
  background: none !important;
}

.border-me {
  background: none !important;
  box-shadow: none !important;
  margin-bottom: 35px;
  border: none !important;
}

.qu-collapse {
  direction: rtl;
  text-align: right;
  color: #fff;
}

.card-header.sett-arrows {
  height: 75px !important;
}

.as-areas {
  padding: 0px 20px;
}

.anwser-box {
  padding: 35px;
  direction: rtl;
}

.anwser-box p {
  text-align: right;
  color: #fff;
  font-size: 13px;
}

.faq-row {
  direction: rtl;
  margin-bottom: 80px;
  margin-top: 20px;
}

.blue-back {
  background: #110538;
}

.purple-back {
  background: #00064f;
}

.green-back {
  background: #2a0133;
}

.red-back {
  background: #300000;
}

.dark-pink-back {
  background: #33002e;
}

.dark-blue-back {
  background: #00152b;
}

.header-wtitle h3 {
  text-align: right;
  font-size: 16px;
  color: #fff;
  margin-bottom: 0px;
}

.vertical-holder {
  background: rgba(0, 0, 0, 0.168627451);
}

.boy-anwser {
  height: 150px;
  width: 150px;
  object-fit: contain;
  position: relative;
  margin-bottom: 40px;
}

.boy-anwser img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  position: absolute;
  z-index: 1;
}

.anwser-title h2 {
  color: #fff;
  font-size: 22px;
}

.anwser-title {
  display: flex;
  height: 0px;
  align-items: center;
  justify-content: flex-end;
  flex-direction: row-reverse;
  margin-top: 50px;
}

.heeader-web {
  height: 75px;
  border: 1px solid #754ffe;
  border-radius: 20px 20px 0px 0px;
  box-shadow: 0 2px 6px -1px rgba(0, 0, 0, 0.07), 0 6px 18px -1px rgba(0, 0, 0, 0.58) !important;
  background-color: #191919;
  padding: 20px 25px;
  display: flex;
  justify-content: space-between;
  flex-direction: row-reverse;
  align-items: center;
}

.padding-areas {
  padding: 20px;
}

.green {
  font-size: 15px;
  color: #06b178 !important;
  margin: 0px 2px;
}

.yellow {
  font-size: 15px;
  color: #ffd500 !important;
  margin: 0px 2px;
}

.red {
  font-size: 15px;
  color: #d60000 !important;
  margin: 0px 2px;
}

.abstract-contact {
  height: 250px;
  background-image: url(/assets/images/vectors/bg-footer.webp);
  background-size: 380px;
  background-repeat: no-repeat;
  background-position: left top;
  background-color: #191919;
  box-shadow: 0 2px 6px -1px rgba(0, 0, 0, 0.07), 0 6px 18px -1px rgba(0, 0, 0, 0) !important;
  border-radius: 20px;
  margin-top: 30px;
  padding: 35px 25px;
}

.height-lower {
  height: 0px;
  display: flex;
  flex-direction: row-reverse;
  padding: 0px 150px;
}

.coontaact-us {
  text-align: center;
  color: #fff;
  font-size: 18px;
  margin-bottom: 0px;
}

.a-girl {
  height: 300px;
  width: 180px;
  object-fit: contain;
  position: relative;
}

.a-girl img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  position: absolute;
  top: -214px;
}

.wrapp-sociality {
  display: flex;
  padding: 30px 80px;
  direction: rtl;
  justify-content: center;
}

.wrapp-sociality div {
  width: 18%;
  margin: 20px;
}

.wrapp-sociality div a {
  display: flex;
  justify-content: center;
  height: 60px;
  border-radius: 10px;
  padding: 15px;
  align-items: center;
}

.instagramer {
  background: linear-gradient(29.61deg, #f38334 0%, #da2e7d 50.39%, #6b54c6 100%);
  border-radius: 10px;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.25);
}

.twitter {
  background: linear-gradient(56deg, #21e6ff 0%, #6374ff 50.39%, #55acee 100%);
  border-radius: 10px;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.25);
}

.youtube {
  background: linear-gradient(63deg, #be1093 0%, #b40000 70.39%, #b00 100%);
  border-radius: 10px;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.25);
}

.telegram {
  background: linear-gradient(63deg, #003ad6 0%, #0475ad 70.39%, #0088cc 100%);
  border-radius: 10px;
  box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.25);
}

.social-content {
  display: flex;
  justify-content: center;
  align-items: center;
}

.social-content a i {
  font-size: 35px;
  color: #fff;
  margin-left: 20px;
}

.social-content h6 {
  font-size: 16px;
  color: #fff;
  font-family: LilitaOne;
  font-weight: 400;
  margin-bottom: 0px;
}

.qu-iholder {
  height: 70px;
  width: 70px;
  padding: 10px;
  outline: 2px solid hsla(276, 91%, 79%, 0.36);
  outline-offset: 5px;
  border-radius: 50%;
  background: hsla(276, 91%, 79%, 0.36);
  object-fit: contain;
}

.question-title {
  font-size: 16px;
  color: #fff;
  margin-right: 20px;
  margin-bottom: 0px;
}

.qu-iholder img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.faq-tc {
  flex-direction: column;
}

.title-rows {
  display: flex;
  direction: rtl;
}

.faq-title {
  color: #fff;
}

.brod-row {
  margin-top: 30px;
}

.brod-row a {
  font-size: 13px;
  color: #fff;
}

.brod-row i {
  font-size: 6px;
  color: #a489ff;
  margin: 0px 10px;
}

.each-according {
  border-right: none;
  border-left: none;
  background-color: #404040;
  text-align: right;
  direction: rtl;
  width: 100%;
  border-radius: 8px;
}

.boat {
  height: 350px;
  object-fit: contain;
  margin-top: 100px;
  display: flex;
  justify-content: center;
}

.show-galley {
  height: 400px !important;
  width: 100% !important;
  object-fit: cover;
  border-radius: 10px;
  position: relative;
  top: -40px;
}

.show-galley img {
  height: 100%;
  width: 100%;
  border-radius: 10px;
  object-fit: cover;
  filter: grayscale(0.5);
  box-shadow: 0px 2px 13px 0px rgba(0, 0, 0, 0.26);
}

.show-galley img:hover {
  height: 100%;
  width: 100%;
  border-radius: 10px;
  object-fit: cover;
  filter: grayscale(0);
}

.show-images i {
  margin-right: 5px;
  color: #ffca1e;
}

.no-dis {
  display: none;
}

.show-images {
  background: linear-gradient(95.45deg, #2a2a2a 0.64%, #000000 98.23%);
  position: relative;
  top: -25px;
  padding: 10px 40px;
  right: 18px;
  width: 165px;
  border-radius: 5px;
  color: #fff;
  font-weight: 600;
  font-size: 16px;
  box-shadow: 0px 2px 13px 0px rgba(0, 0, 0, 0.26);
  display: block;
  direction: ltr;
}

.title-all {
  height: 350px;
  display: flex;
  align-items: center;
  text-align: right;
  justify-content: right;
}

.title-all h3 {
  font-size: 20px;
  font-weight: normal;
}

.boat img {
  height: 100%;
  object-fit: contain;
}

.pagination {
  width: 800px;
  height: 60px;
  border-radius: 9px;
  overflow: hidden;
}

.pagination,
.pagination__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  align-content: center;
  direction: rtl;
  flex-direction: row-reverse;
}

.pagination__list {
  list-style-type: none;
  padding: 0;
  margin: 0;
  width: 350;
  height: 50px;
  border-radius: 9px;
  margin: 0 9px;
  overflow: hidden;
}

.pagination__item {
  width: 50px;
  height: 50px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  align-content: center;
  font-size: 1.1rem;
}

.pagination__item > a, .pagination__button {
  border: none;
  outline: none;
  stroke: none;
  box-shadow: none;
  cursor: pointer;
  border-radius: 9px;
  background: #ffffff !important;
}

.check-form {
  align-items: center;
}
.check-form input {
  width: 20px !important;
  height: 50px;
}

.pagination__item > a:hover,
.pagination__button:hover {
  background: #ccc;
  color: #000;
}

.courses-card {
  margin-bottom: 10px;
}

.pagination__item > a {
  width: 45px;
  height: 45px;
}

.pagination__item > a[data-level=target] {
  background: rgba(204, 204, 204, 0.8);
  color: #000;
}

.pagination__item {
  margin: 10px;
  font-family: iranyekanBakh !important;
}

.max-width-panel {
  max-width: 1400px;
}

.pagination--move-prev {
  -webkit-animation: pagination-move-prev 0.5s ease both;
  animation: pagination-move-prev 0.5s ease both;
}

.pagination--move-next {
  -webkit-animation: pagination-move-next 0.5s ease both;
  animation: pagination-move-next 0.5s ease both;
}

.pagination--move-top {
  -webkit-animation: pagination-move-top 0.5s ease both;
  animation: pagination-move-top 0.5s ease both;
}

.pagination__button {
  width: 35px;
  font-size: 20px;
  color: #000;
}

.top-jump-course {
  position: relative;
  top: -30px;
}

.pagination__item > a {
  width: 40px;
  height: 42px;
  padding: 10px 20px;
  border-radius: 50%;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: transparent;
  color: #000 !important;
  margin: 5px 15px;
  border: 2px solid #ffca1e;
  -webkit-box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.07), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
  box-shadow: 0 10px 15px -3px rgba(56, 56, 56, 0.07), 0 4px 6px -2px rgba(43, 42, 42, 0) !important;
}

.pagination__item > a:hover {
  background-color: #9876ff;
  color: #fff;
  opacity: 1;
  -webkit-box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.07), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
  box-shadow: 0 10px 15px -3px rgba(56, 56, 56, 0.07), 0 4px 6px -2px rgba(43, 42, 42, 0) !important;
}

.pagination__item > a:active {
  background-color: #9876ff;
  color: #fff;
  opacity: 1;
  -webkit-box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.07), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
  box-shadow: 0 10px 15px -3px rgba(56, 56, 56, 0.07), 0 4px 6px -2px rgba(43, 42, 42, 0) !important;
}

.btn-fb {
  width: 40px;
  height: 40px;
  padding: 10px 20px;
  border-radius: 50%;
  text-align: center;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  background-color: transparent;
  color: #fff !important;
}

.pagination__item {
  margin: 5px 14px;
  padding: 10px !important;
  width: 25px;
}

@-webkit-keyframes pagination-move-prev {
  from, 0% {
    transform: translateX(25px);
  }
  50% {
    transform: translateX(-5px);
  }
  to, 100% {
    transform: translateX(0px);
  }
}
@keyframes pagination-move-prev {
  from, 0% {
    transform: translateX(25px);
  }
  50% {
    transform: translateX(-5px);
  }
  to, 100% {
    transform: translateX(0px);
  }
}
@-webkit-keyframes pagination-move-next {
  from, 0% {
    transform: translateX(-25px);
  }
  50% {
    transform: translateX(5px);
  }
  to, 100% {
    transform: translateX(0px);
  }
}
@keyframes pagination-move-next {
  from, 0% {
    transform: translateX(-25px);
  }
  50% {
    transform: translateX(5px);
  }
  to, 100% {
    transform: translateX(0px);
  }
}
@-webkit-keyframes pagination-move-top {
  from, 0% {
    transform: translateY(-25px);
  }
  50% {
    transform: translateY(10px);
  }
  to, 100% {
    transform: translateY(0px);
  }
}
@keyframes pagination-move-top {
  from, 0% {
    transform: translateY(-25px);
  }
  50% {
    transform: translateY(10px);
  }
  to, 100% {
    transform: translateY(0px);
  }
}
.checkbox {
  display: flex;
  align-items: center;
  margin-bottom: 0px;
  display: flex;
  align-items: center;
  margin-bottom: 0px;
  margin-top: 8px;
  margin-left: 30px;
}

.checkbox label {
  margin-bottom: 0px !important;
}

.st-counter {
  text-align: right;
  direction: rtl;
  font-size: 20px;
  margin-top: 25px;
  margin-bottom: 25px;
  padding-right: 25px;
}

.num-searjhing {
  color: #fadbff;
  font-weight: normal;
  margin-left: 10px;
}

.txt-res {
  font-size: 20px;
  font-weight: 500;
}

.hh-margin {
  height: 250px;
  position: relative;
}

.blog-bner {
  height: 300px;
  background-image: url(/assets/images/header/lighte.webp);
  background-position: left;
  background-size: cover;
  width: 100%;
  position: absolute;
  top: -82px;
}

.radio {
  margin: 10px 0px;
}

.radio input[type=radio] {
  position: absolute;
  opacity: 0;
}

.radio input[type=radio] + .radio-label:before {
  content: "";
  background: #f4f4f4;
  border-radius: 100%;
  border: 1px solid #b4b4b4;
  display: inline-block;
  width: 1.4em;
  height: 1.4em;
  position: relative;
  top: -0.2em;
  margin-left: 1em;
  vertical-align: top;
  cursor: pointer;
  text-align: center;
  transition: all 250ms ease;
}

.radio input[type=radio]:checked + .radio-label:before {
  background-color: #9a29ff;
  box-shadow: inset 0 0 0 4px #e9ddff;
}

.radio input[type=radio]:focus + .radio-label:before {
  outline: none;
  border-color: #3197ee;
}

.radio input[type=radio]:disabled + .radio-label:before {
  box-shadow: inset 0 0 0 4px #f4f4f4;
  border-color: #b4b4b4;
  background: #b4b4b4;
}

.radio input[type=radio] + .radio-label:empty:before {
  margin-right: 0;
}

.radio-label {
  color: #000;
}

.img-mc {
  height: 420px;
  width: 100%;
  object-fit: cover;
  border-radius: 10px;
  box-shadow: 0px 1px 0px 0 rgba(0, 0, 0, 0.81), 0 4px 15px 0 rgba(0, 0, 0, 0.78) !important;
}

.img-mc img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.blog-master-row {
  direction: rtl;
  text-align: right;
  background: #191919;
  padding: 20px 10px;
  border-radius: 10px;
}

.img-mc {
  margin-bottom: 15px;
}

.name-bl {
  color: rgb(21, 0, 54) !important;
  margin: 10px 0px;
  margin-top: 20px;
  font-size: 1.5rem;
  font-weight: 700;
  cursor: pointer;
  text-align: right;
}

.blog-bl {
  color: #ccc;
  margin-top: 15px;
  font-size: 12px;
  line-height: 25px;
}

.blog-wroter {
  display: flex;
  height: 70px;
  align-items: center;
}

.te-image {
  height: 60px;
  width: 80px;
  object-fit: cover;
  border-radius: 50%;
  margin-left: 20px;
}

.blog-wroter h2 {
  color: #000;
  width: max-content;
  font-size: 14px;
}

.date-rote {
  color: #777;
  width: max-content;
  margin-right: 10px;
}

.te-image img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.colori-tag {
  background: -webkit-linear-gradient(-70deg, #5205db 0%, #e672fa 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: rgba(0, 0, 0, 0);
  -webkit-box-decoration-break: clone;
  font-size: 13px;
  padding: 8px 10px;
  display: none;
}

.second-tag {
  background: -webkit-linear-gradient(-70deg, #ff0057 0%, #ff9800 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: rgba(0, 0, 0, 0);
}

.colori {
  background: -webkit-linear-gradient(-70deg, #9559ff 0%, #470e51 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: rgba(0, 0, 0, 0);
  -webkit-box-decoration-break: clone;
  font-size: 17px;
  font-weight: normal;
  margin-top: 15px;
  margin-bottom: -20px;
}

.colori-2 {
  background: -webkit-linear-gradient(-70deg, #ff0057 0%, #ff9800 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: rgba(0, 0, 0, 0);
  -webkit-box-decoration-break: clone;
  font-size: 17px;
  font-weight: normal;
  margin: 15px 0px !important;
}

.bordering-2 {
  background-color: #ff5722;
}

.nw-2 {
  border-bottom: 1px solid rgb(216, 78, 34);
}

.secnd-2 {
  border: 2px solid rgb(194, 73, 34);
}

.search-title {
  position: relative;
  top: -110px;
  background-color: #9876ff;
  padding: 15px 25px;
  border-radius: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  direction: rtl;
  -webkit-box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.07), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
  box-shadow: 0 10px 15px -3px rgba(56, 56, 56, 0.205), 0 4px 6px -2px rgba(43, 42, 42, 0) !important;
}

.ui-header {
  height: 210px;
  background: center;
  background: hsl(298, 68%, 90%);
  background: -webkit-linear-gradient(0deg, hsl(247, 100%, 84%) 0%, hsl(234, 86%, 74%) 100%);
  background-size: cover;
  animation: changecolor 8s linear infinite alternate-reverse;
  position: relative;
  top: -82px;
}

.img-min {
  width: 150px;
  min-height: 150px;
  min-width: 150px;
  object-fit: cover;
  border-radius: 10px;
  margin-left: 15px;
}

.min-df {
  display: flex;
  height: 20px;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}

.date-rote-mini {
  color: #14003b;
  font-size: 14px;
}

.img-min img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.custom-control-label {
  color: #fff;
}

.search-tag {
  color: #fff;
  margin-bottom: 20px;
  text-align: right;
  font-size: 18px;
}

.min-blog {
  display: flex;
  margin-bottom: 30px;
  padding-bottom: 20px;
}

.min-wrapp div.min-blog {
  border-bottom: 1px solid #cc9ed9;
}

.min-wrapp div:last-child {
  border-bottom: none;
}

.nm-min {
  color: #000;
  font-size: 14px;
  margin: 15px 0px;
  line-height: 30px;
}

.mini-nt {
  color: #000;
  width: max-content;
  font-size: 14px;
  margin: 0px 0px;
}

.min-p {
  font-size: 12px;
  color: rgb(21, 0, 54);
  line-height: 25px;
  height: 50px;
  overflow: hidden;
}

.category-bw {
  display: flex;
  flex-direction: row-reverse;
  height: 80px;
  align-items: center;
  justify-content: flex-start;
  cursor: pointer;
}

.height-h {
  height: 100px;
}

.blog-banner {
  height: 400px;
  width: 100%;
  object-fit: cover;
  border-radius: 10px;
  margin-bottom: 20px;
}

.blog-banner img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.blog-wrappering {
  border-radius: 10px;
  padding: 10px 15px;
  padding-bottom: 30px;
  margin-bottom: 20px;
  width: 100%;
  direction: rtl;
  background: #fff;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  border-radius: 8px;
}

.blog-body p {
  font-size: 16px;
  font-weight: 500;
}
.blog-body span {
  font-size: 14px;
  font-weight: 500;
}
.blog-body mark {
  background-color: rgba(204, 159, 255, 0.21) !important;
  border-radius: 8px;
}
.blog-body img {
  border-radius: 8px;
}
.blog-body ul li {
  font-size: 14px;
}

.padding-little {
  padding: 0px 25px;
  padding-left: 0px;
}

.rw-names {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px 10px;
}

.capt {
  display: flex;
  align-items: center;
}

.rw-names p {
  font-size: 14px;
  color: #fff;
}

.rw-names span {
  font-size: 14px;
  color: #9876ff;
}

.rw-names a {
  display: flex;
  align-items: center;
  color: #9876ff;
}

.rw-names i {
  margin-right: 10px;
}

.rw-names strong {
  color: #fff;
  font-size: 14px;
  margin-left: 15px;
}

.bg-gray {
  border-radius: 6px;
  padding: 10px 10px;
  background-color: #191919;
  box-shadow: rgba(0, 0, 0, 0.18) 0px 1px 5px 0px, rgba(0, 0, 0, 0.09) 0px 4px 4px 0px !important;
}

.black-cat:hover {
  background-color: #0a0a0a !important;
}

.bg-gray div.rw-names {
  border-bottom: 1px solid rgba(152, 118, 255, 0.1882352941);
}

.bg-gray div:last-child {
  border-bottom: none;
}

.btn-arrow {
  height: 30px;
  margin-right: 10px;
}

.wrote-details {
  margin-bottom: 20px;
  padding: 0;
}

.avatar-wroter {
  height: 75px;
  width: 75px;
  object-fit: cover;
  border-radius: 50%;
  position: relative;
  bottom: -12px;
  border: 3px solid #825cf5;
  box-shadow: rgba(0, 0, 0, 0.18) 0px 1px 5px 0px, rgba(0, 0, 0, 0.09) 0px 4px 4px 0px !important;
}

.avatar-wroter img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.blog-titling {
  direction: rtl;
  text-align: right;
  margin: 30px 0px;
}

.cat-blog-banner {
  height: 150px;
  background-position: right;
  background-image: url(/assets/images/header/1vg6px8xr4b71.webp);
  background-size: cover;
  border-radius: 10px;
  display: flex;
  align-items: center;
  padding: 0px 30px;
  text-align: center;
  justify-content: center;
  direction: rtl;
}

.ext-btn {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  direction: rtl;
  text-decoration: none;
  color: #757575;
  font-weight: normal;
  font-size: 14px;
  text-align: right;
  background: #090909;
  border: none;
  border-radius: 0px !important;
  margin-top: 0px;
}

.sidebar-nav > li > button:hover,
.sidebar-nav > li.active > button {
  text-decoration: none;
  color: rgb(9, 9, 9);
  background: #ff5722;
}

.ext-btn i {
  font-size: 18px;
  width: 60px;
  float: right;
  color: #cfbfff;
}

.sidebar-nav > li > button i.fa {
  font-size: 18px;
  width: 60px;
  float: right;
  color: #fff;
}

.blog-ctt {
  color: #fff;
  font-size: 26px;
  text-align: center;
}

.hc-title {
  padding: 0px 20px;
  height: 100px;
  display: flex;
  align-items: center;
  text-align: right;
  direction: rtl;
  padding-left: 0px;
  justify-content: space-between;
}

.operating-system {
  background: -webkit-linear-gradient(-70deg, #ffffff 0%, #008d7f 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: rgba(0, 0, 0, 0);
  -webkit-box-decoration-break: clone;
  font-size: 17px;
  display: block;
  text-align: right;
  width: 100%;
  padding: 8px 8px;
}

.oper-tag {
  background: -webkit-linear-gradient(-70deg, #ffffff 0%, #008d7f 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: rgba(0, 0, 0, 0);
  -webkit-box-decoration-break: clone;
  font-size: 13px;
  padding: 8px 10px;
}

.op-btn {
  border: 1px solid #008d7f;
}

.op-line {
  background-color: #008d7f;
}

.op-new {
  border-bottom: 1px solid #008d7f;
}

.hc-title img {
  opacity: 0.1;
  height: 18px;
  padding-left: 10px;
}

.hearder-category {
  font-size: 16px;
  color: #fff;
}

.ct-link {
  font-size: 12px;
  color: #fff;
}

.cb-img {
  height: 40px;
  width: 40px;
  object-fit: cover;
  margin: 0px 20px;
}

.cb-img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.black-cat h2 {
  display: flex;
}

.mini-cat {
  padding: 5px;
}

.black-cat {
  background-color: #191919;
  border-radius: 4px;
  box-shadow: rgba(0, 0, 0, 0.18) 0px 1px 5px 0px, rgba(0, 0, 0, 0.09) 0px 4px 4px 0px !important;
}

.nt-btn {
  height: 30px;
}

.blc-row {
  display: flex;
  flex-direction: row-reverse;
  height: 80px;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  padding: 0px 20px;
}

.next-arrticle {
  border-radius: 6px;
  padding: 10px 12px;
  background-color: #191919;
  margin-top: 20px;
  height: 80px;
  display: flex;
  align-items: center;
  box-shadow: rgba(0, 0, 0, 0.18) 0px 1px 5px 0px, rgba(0, 0, 0, 0.09) 0px 4px 4px 0px !important;
}

.next-arrticle:hover {
  background-color: #0a0d11;
}

.next-arrticle a {
  color: #fff;
  font-size: 14px;
  padding: 0px 11px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.next-arrticle i {
  color: #9876ff;
}

.black-cat:hover {
  background-color: rgba(9, 9, 9, 0.2);
  transition: all linear 0.5s;
}

.first-rows {
  border-top: 1px solid #3c4555;
  padding-top: 40px;
  margin-top: 50px;
}

.category-call {
  width: 100%;
  font-size: 16px;
  text-align: right;
  direction: rtl;
  color: #fff;
  padding-right: 10px;
  padding-bottom: 15px;
}

.so-margin {
  margin-top: 20px;
  margin-bottom: 10px;
}

.img-bw {
  height: 210px;
  width: 100%;
  object-fit: cover;
  border-radius: 6px;
  position: relative;
  right: -12px;
  top: -15px;
}

.img-bw img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 6px;
}

.mini-img-parent {
  height: 50px;
  width: 50px;
  object-fit: contain;
  background: #191919;
  border-radius: 10px;
  position: relative;
  right: -15px;
  padding: 5px;
}

.fl-box {
  display: flex;
}

.mini-img-parent img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.nw-dr {
  direction: rtl;
}

.new-height {
  min-height: 420px;
  margin-top: 30px;
  width: 100%;
}

.pagination-alone {
  direction: rtl;
  width: 100%;
  display: flex;
  justify-content: space-around;
}

.each-blog-wrapping {
  height: 300px;
  background-color: #191919;
  border-radius: 6px;
  text-align: right;
  padding-top: 0px;
  direction: rtl;
  margin-bottom: 30px;
  box-shadow: rgba(0, 0, 0, 0.18) 0px 1px 5px 0px, rgba(0, 0, 0, 0.09) 0px 4px 4px 0px !important;
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
}

.nb-wrap {
  border-bottom: none;
  padding: 5px 8px;
  height: 96px;
  overflow: hidden;
}

.sp-pader {
  padding: 5px 10px;
  display: none;
  justify-content: space-between;
  padding-left: 30px;
}

.each-blog-wrapping:hover {
  height: 360px;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  transition: all 0.5s ease-in-out;
}

.each-blog-wrapping:hover .colori-tag {
  display: block;
}

.each-blog-wrapping:hover .sp-pader {
  display: flex;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  transition: all 0.5s ease-in-out;
}

.each-blog-wrapping:hover .liner {
  width: 80%;
  border-top: 1px solid #000;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  transition: all 0.5s ease-in-out;
}

.each-blog-wrapping:hover .img-bw {
  right: 0px;
  top: 0px;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  transition: all 0.5s ease-out;
}

.each-blog-wrapping:hover .mini-img-parent {
  right: 0px;
  padding: 10px;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  transition: all 0.5s ease-out;
}

.each-blog-wrapping:hover {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  transition: all 0.5s ease-out;
}

.read {
  position: absolute;
  z-index: -1;
}

.each-blog-wrapping:hover .read {
  z-index: 1;
  top: -20px;
  transition: all ease-out 0.2s;
}

.modals-btn {
  font-size: 12px;
  height: 20px;
  margin-top: 0px;
  display: flex;
  align-items: center;
  font-weight: normal;
}

.modals-btn span {
  color: #fff;
  margin-right: 6px;
}

.modal-close {
  float: left !important;
  width: 35px !important;
  height: 35px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px !important;
}

.modal-title {
  text-align: right;
  width: 100%;
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 25px;
}

.modal-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: max-content;
  pointer-events: auto;
  background-color: #cbcbcb;
  background-clip: padding-box;
  border: 1px solid #9e9e9e;
  border-radius: 0.3rem;
  outline: 0;
  padding: 20px;
  width: 100%;
}

.modal-btns {
  background: #ffca1e;
  width: max-content;
  padding: 10px 20px;
  border-radius: 6px;
  color: #000;
  border: none;
}
.modal-btns a {
  color: #000;
  font-weight: 600;
  font-size: 16px;
  margin-left: 10px;
}
.modal-btns i {
  font-size: 18px;
  position: relative;
  top: 2px;
}

.nb-wrap a {
  color: #fff;
  font-size: 14px;
  line-height: 28px;
}

.teachers-banner {
  height: 250px;
  background-color: #008d7f;
  border-radius: 10px;
}

.height-ht {
  height: 100px;
}

.link-offer {
  color: #000;
  width: 10%;
  cursor: pointer;
  font-size: 16px;
}

.link-offer span {
  margin-left: 16px;
}

.link-offer i {
  color: #000;
  padding: 10px 14px;
  border-radius: 50%;
  border: 2px solid #000;
  width: 40px;
  text-align: center;
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  background: transparent;
  background-image: url("data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");
  background-repeat: no-repeat;
  background-position-x: 100%;
  background-position-y: 5px;
  border: 1px solid #dfdfdf;
  border-radius: 2px;
  margin-right: 2rem;
  padding: 1rem;
  padding-right: 2rem;
}

.pl-none {
  padding-left: 10px;
}

.selectdiv select {
  margin-right: 0px;
}

.filter-button i:hover {
  color: #9876ff !important;
}

.filter-button:hover {
  opacity: 1 !important;
}

.st-counter {
  color: #fff;
}

.img-flat {
  height: 300px;
  background-repeat: no-repeat;
  position: absolute;
  top: 195px;
}

.img-flat img {
  height: 250px;
  opacity: 0.1;
}

.in-row {
  display: flex;
  justify-content: center;
  align-items: center;
}

.br-th {
  height: 55px;
  background: transparent;
  direction: rtl;
  text-align: right;
  margin-left: 0px;
  background: transparent;
}

.custom-control-label:before {
  position: absolute;
  top: -1px;
  right: -30px;
  display: block;
  width: 22px;
  height: 22px;
  pointer-events: none;
  content: "";
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: #000000;
  border: 1px solid #2d2d2d;
}

.custom-control-label:after {
  position: absolute;
  top: -5px;
  right: -32px;
  display: block;
  width: 25px;
  height: 32px;
  content: "";
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 50% 50%;
}

.custom-control {
  position: relative;
  display: block;
  min-height: 1.5rem;
  padding-left: 1.5rem;
  right: 14px;
}

.custom-control-label {
  font-size: 12px;
}

.sos-margin {
  margin: 10px 15px;
}

.my-bubble {
  font-size: 32px;
  margin-bottom: 12px;
  color: rgba(225, 85, 253, 0.6431372549);
}

.rools-capt {
  font-size: 16px;
  direction: rtl;
  text-align: justify;
  margin-bottom: 5px;
}

.custom-checkbox .custom-control-input:checked ~ .custom-control-label:before {
  background-color: #d4befa;
  border: 2px solid #e1ccf0;
}

.custom-checkbox .custom-control-input:checked ~ .custom-control-label:before {
  background-color: #9876ff !important;
  border: 2px solid #9876ff !important;
}

#navbar-toggle {
  cursor: pointer;
}

#toggleView {
  margin-left: 44px;
}

.custom-checkbox .custom-control-input:checked ~ .custom-control-label:after {
  box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.231372549);
}

.menu-icon {
  float: right;
}

.sidebar-nav {
  display: block;
  float: right;
  width: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
}

.sidebar-nav li a {
  padding-left: 20px;
  font-size: 14px;
  text-decoration: none;
  color: #fff;
  float: right;
  text-decoration: none;
  width: 100%;
  height: 60px;
  line-height: 25px;
  padding: 15px 20px;
  vertical-align: center;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.sidebar-nav li a:hover {
  background: #121213;
  -webkit-transition: background 0.5s;
  transition: background 0.05s;
}

.collpse-content {
  margin-right: 25px;
}

.sidebar-nav li a {
  border-bottom: 1px solid rgba(213, 133, 255, 0.25);
}

.icon-panel {
  height: 65px;
  width: 65px;
  padding: 5px;
  background-color: #191919;
  border-radius: 50%;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
  object-fit: contain;
  margin-left: 15px;
  padding: 8px;
}

.icon-panel img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.this-panel {
  padding: 40px 20px;
  border-radius: 8px;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 3px 2px 8px 0px rgba(0, 0, 0, 0.56);
  margin-right: 175px;
  min-height: 100vh;
  text-align: right;
  transition: all ease-in-out 0.5s;
  background: #1d1d1d;
}

.panel-boxes {
  display: flex;
  height: 100px;
  padding: 10px;
  direction: rtl;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0px 0px 4px 0 rgba(0, 0, 0, 0.05);
  border-radius: 8px;
  align-items: center;
  background: #090909;
  max-width: 100%;
  overflow: hidden;
}

.nm-box {
  color: #9876ff;
  /*font-weight: normal; */
  font-size: 14px;
}

.capts-box {
  width: 60%;
  text-align: right;
}

.notification {
  padding: 5px 15px;
  margin-top: 30px;
  display: flex;
  align-items: center;
  text-align: right;
  direction: rtl;
}

.panelicon-color {
  color: #9876ff;
}

.po-color {
  color: #fff !important;
  font-size: 24px !important;
}

.notification span {
  margin-right: 20px;
  font-size: 16px;
  color: #baa3ff;
}

.each-new {
  padding: 20px;
  background: #090909;
  border-radius: 8px;
  margin: 20px 0px;
}

.new-title {
  font-size: 14px;
  text-align: right;
  color: #fff;
}

.each-new p {
  font-size: 12px;
  padding: 10px 0px;
  line-height: 25px;
  color: #fff;
}

.badge-color {
  background-color: #fc6400;
  padding: 6px 12px;
  padding-bottom: 6px;
}

.see-news {
  text-align: left;
  float: left;
  color: rgb(152, 118, 255);
  border-bottom: 1px solid #ccc;
}

.each-mcourse {
  display: flex;
  direction: rtl;
  background: #090909;
  align-items: center;
  border-radius: 8px;
}

.ic-img {
  width: 27%;
  height: 168px;
  object-fit: cover;
  border-radius: 4px;
}

.ic-img img {
  height: 100%;
  width: 100%;
  border-top-left-radius: 0px;
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
  border-bottom-left-radius: 0px;
  object-fit: cover;
}

.nc-cart {
  margin-bottom: 15px;
  font-size: 14px;
  color: #9876ff;
}

.details-cr {
  display: flex;
  flex-direction: column;
  padding: 10px 15px;
  width: 70%;
  max-width: 70%;
  overflow: hidden;
  border-left: 1px dashed #a0a0a0;
  justify-content: center;
}

.caption-pc {
  font-size: 12px;
  line-height: 22px;
  color: #fff;
}

.see-that {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  width: 20%;
  max-width: 20%;
  overflow: hidden;
}

.see-that a {
  color: #9876ff;
  border-bottom: 1px solid #ccc;
}

.all-you-need {
  font-size: 1.8rem;
  font-weight: 700;
}

.fg-margin {
  margin: 10px 0px;
}

.each-mcourse:hover {
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
  transition: all linear 0.3s;
}

.filter-gr {
  align-items: center;
}

header .desk-menu .menu-container .menu-head {
  background: rgb(25, 25, 25);
  padding: 35px 10px;
}

header .desk-menu .menu-container .menu-head .client i {
  position: absolute;
  font-size: 19px;
  right: 10px;
  top: -3px;
  color: rgb(152, 118, 255);
}

.text-nowrap {
  white-space: nowrap !important;
  color: #fff;
}

.filter {
  width: 30px;
  height: 45px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgb(213, 142, 255);
  background-color: rgb(152, 118, 255);
  padding: 3px 25px;
}

.selector-filter {
  height: 45px;
  margin-top: 6px;
  margin-left: 6px;
  font-size: 12px;
  width: 258px;
}

.each-new {
  padding: 35px 15px;
  padding-top: 15px;
}

.badge-color {
  background-color: #fc6400;
  padding: 6px 12px;
  padding-bottom: 6px;
  margin-bottom: 12px;
}

.title-tick {
  font-size: 14px;
  color: #fff;
}

.hh-marging {
  height: 110px;
}

.banner--cart {
  background-color: rgb(49, 38, 38);
  background-position: right;
  background-image: url(/assets/images/header/ert.webp);
  background-size: cover;
  margin-bottom: 0px;
  position: relative;
  top: -82px;
  height: 350px;
  background-size: cover;
}

.rtl-row {
  direction: rtl;
}

.whiteen-row {
  background-color: #fff;
  border-radius: 6px;
  box-shadow: 0 0 7px 0 #eaeff4;
  -moz-box-shadow: 0 0 7px 0 #eaeff4;
  -webkit-box-shadow: 0 0 1px 0 #ffffff;
  padding: 10px 15px;
  height: 100px;
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  transition: all ease-in-out 0.3s;
  margin-bottom: 15px;
}

.whiteen-row:hover {
  box-shadow: 0 0 7px 0 #eaeff4;
  -moz-box-shadow: 0 0 7px 0 #eaeff4;
  -webkit-box-shadow: 0px 0px 5px 0px #500090;
  transition: all ease-in-out 0.3s;
}

.form-submit {
  display: inline-block;
  background: #6e3dff !important;
  border-bottom: none;
  width: auto;
  padding: 12px 39px;
  border-radius: 24px;
  font-size: 18px;
  margin-top: 5px;
  font-family: iranyekanBakh !important;
  cursor: pointer;
  color: rgb(255, 255, 255) !important;
}

.course-details {
  height: 140px;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.c-icon {
  height: 70px;
  height: 70px;
  max-width: 80px;
  object-fit: contain;
  border-radius: 50%;
}

.c-icon img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.c-name {
  text-align: right;
  padding: 0px 20px;
  min-width: 550px;
}

.nc-black {
  color: #fff;
  margin-bottom: 10px;
}

.teacher-n {
  color: #fff;
}

.tc-n {
  color: #d5a9ff;
}

.p-bord {
  font-weight: 700;
  color: #f2796e;
  margin-left: 4px;
  font-size: 14px;
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
}

.price-unite {
  color: #fff;
  font-weight: normal;
  font-size: 14px;
}

.remove-course {
  width: 30px;
  height: 30px;
  padding: 5px;
  background-color: rgb(223, 174, 252);
  border: none;
  text-align: center;
  margin-right: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  cursor: pointer;
}

.offer-code {
  padding-right: 20px;
  height: 70px;
  margin-bottom: 45px;
}

.offering {
  width: 100%;
  height: 100px;
  background-color: #fff;
  box-shadow: 0 0 7px 0 #eaeff4;
  -moz-box-shadow: 0 0 7px 0 #eaeff4;
  -webkit-box-shadow: 0 0 7px 0 #ffffff;
  direction: rtl;
  padding: 10px 15px;
  border-radius: 6px;
}

.offer-input {
  height: 50px;
  border: 1px solid #9876ff;
  border-top-left-radius: 0px !important;
  border-top-right-radius: 6px !important;
  border-bottom-right-radius: 6px !important;
  border-bottom-left-radius: 0px !important;
}

.new-label {
  color: #dab3ff;
}

.offer-input::placeholder {
  font-size: 12px;
}

.offer-btn {
  margin-top: 0px;
  background-color: #9876ff;
  display: flex;
  color: #fff;
  font-weight: normal;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  width: 70px;
  text-align: center;
  border-top-left-radius: 6px !important;
  border-top-right-radius: 0px !important;
  border-bottom-right-radius: 0px !important;
  border-bottom-left-radius: 6px !important;
}

.units {
  margin-right: 8px;
  color: #dab3ff;
}

.payment-way {
  padding-right: 20px;
  direction: rtl;
  text-align: right;
}

.gatway-p {
  padding-right: 20px;
  direction: rtl;
  text-align: right;
  margin-top: 10px;
}

.pay-m {
  direction: rtl;
  width: 100%;
  background-color: #fff;
  box-shadow: 0 0 7px 0 #eaeff4;
  -moz-box-shadow: 0 0 7px 0 #eaeff4;
  display: flex;
  padding: 10px 15px;
  border-radius: 6px;
}

.gt-m {
  direction: rtl;
  width: 100%;
  background-color: #fff;
  display: flex;
  padding: 30px 15px;
  border-radius: 6px;
  margin-top: 10px;
  flex-direction: column;
}

.capt-title {
  font-weight: normal;
  font-size: 14px;
  color: #000;
}

.terms p {
  text-align: justify;
  font-size: 1rem;
}

.each-row {
  margin-bottom: 20px;
  display: flex;
  flex-direction: row-reverse;
}

.shoud-pay {
  color: #fff;
}

.total-price {
  color: #fff;
  font-size: 12px;
}

.the-last-r {
  border-top: 1px solid #9c27b0;
  margin-top: 20px;
  width: 87%;
  padding: 20px 0px;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  flex-wrap: nowrap;
}

.total-price strong {
  font-size: 14px;
}

.total-price span {
  font-size: 18px;
}

.pay-btn {
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  text-align: center;
  margin-top: 20px;
  color: #fff !important;
  background-size: 300% 100%;
  background-image: linear-gradient(to right, #601ed5, #fe00f2, #f05a28);
  border-radius: 6px;
  border: none;
  moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  cursor: pointer;
}

.pay-btn:hover {
  background-image: linear-gradient(to left, #9c27b0, #ec008c, #00bcd4);
  color: #000;
  font-weight: normal;
  box-shadow: 0 0 7px 0 #eaeff4;
  -moz-box-shadow: 0 0 7px 0 #eaeff4;
  -webkit-box-shadow: 5px 4px 15px 2px #000000;
  moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}

.shadow:after {
  filter: blur(1px);
}

.crazy-padding {
  padding: 10px 20px;
  height: 400px;
}

.below-m {
  margin-top: 0px;
  direction: rtl;
  width: 100%;
  background-color: #fff;
  display: flex;
  padding: 10px 15px;
  border-radius: 0px;
}

.mario {
  margin-top: 15px;
}

.custom_radio {
  margin: 20px 15px;
  direction: rtl;
  text-align: right;
  padding-right: 0px;
  padding-left: 0px;
}

.inline-tt {
  display: flex;
  align-items: center;
}

.des-title {
  margin-bottom: 0px;
  color: #fff;
  width: 65px;
  display: flex;
  font-size: 14px;
  justify-content: flex-end;
}

.custom_radio input[type=radio] {
  display: none;
}

.custom_radio input[type=radio] + label {
  position: relative;
  display: inline-block;
  padding-left: 0em;
  margin-right: 1em;
  cursor: pointer;
  line-height: 1em;
  font-size: 14px;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}

.custom_radio input[type=radio] + label:before,
.custom_radio input[type=radio] + label:after {
  content: "";
  position: absolute;
  top: 0;
  right: -20px;
  width: 1em;
  height: 1em;
  text-align: center;
  color: white;
  font-family: Times;
  border-radius: 50%;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.custom_radio input[type=radio] + label:before {
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  box-shadow: inset 0 0 0 0.2em white, inset 0 0 0 1em white;
}

.custom_radio input[type=radio] + label:hover:before {
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  box-shadow: inset 0 0 0 0.3em white, inset 0 0 0 1em #5a189a;
}

.custom_radio input[type=radio]:checked + label:before {
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  box-shadow: inset 0 0 0 0.2em white, inset 0 0 0 1em #6906c5;
}

.alert-cart {
  position: relative;
  min-height: 70px;
  height: max-content;
  padding: 10px 22px;
  background: #18171b;
  border-radius: 6px;
  margin-bottom: 30px;
  display: flex;
  align-items: center;
  text-align: right;
  background: linear-gradient(90deg, #000, #262626);
  justify-content: flex-end;
}

.none-cart {
  position: relative;
  height: 120px;
  padding: 10px 22px;
  background: #18171b;
  border-radius: 6px;
  margin-bottom: 30px;
  background: linear-gradient(90deg, #000, #262626);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.alert-title {
  font-size: 16px;
  text-align: right;
  color: #000;
}

.success-animation {
  margin: 0px auto;
  position: relative;
  top: -55px;
}

.laptop-sett {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
}

.wave {
  display: flex;
  flex-direction: row;
  direction: rtl;
  justify-content: center;
}

.cup-of-coffee {
  height: 100px;
  width: 80px;
  object-fit: contain;
  z-index: 2;
}

.cup-of-coffee img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  z-index: 2;
  animation: mover-coffe 1.5s infinite alternate;
}

.left-wave {
  height: 50px;
  width: 30px;
  object-fit: contain;
  display: flex;
  justify-content: flex-start;
}

.left-wave img {
  height: 100%;
  object-fit: contain;
  animation: mover-rwshadow 5s infinite alternate;
}

@-webkit-keyframes mover-rwshadow {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(8px);
    opacity: 0.5;
  }
}
@keyframes mover-rwshadow {
  0% {
    transform: translateY(0);
    opacity: 0;
  }
  10% {
    transform: translateY(5);
    opacity: 0.3;
  }
  100% {
    transform: translateY(10px);
    opacity: 0.9;
  }
}
.right-wave {
  height: 40px;
  width: 20px;
  object-fit: contain;
  display: flex;
  justify-content: flex-end;
}

.right-wave img {
  height: 100%;
  object-fit: contain;
  animation: mover-rwshadow 5s infinite alternate;
}

@-webkit-keyframes mover-rwshadow {
  0% {
    transform: translateY(10);
  }
  100% {
    transform: translateY(25px);
    opacity: 0.5;
  }
}
@keyframes mover-rwshadow {
  0% {
    transform: translateY(10);
    opacity: 0;
  }
  10% {
    transform: translateY(15);
    opacity: 0.3;
  }
  100% {
    transform: translateY(25px);
    opacity: 0.5;
  }
}
.coffee-area {
  display: flex;
  flex-direction: column;
  align-content: center;
  align-items: flex-start;
  height: 55px;
}

.latte {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.coffee-shadow {
  height: 70px;
  width: 70px;
  position: relative;
  object-fit: contain;
  top: -42px;
  z-index: 1;
}

.coffee-shadow img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  animation: mover-cshadow 1s infinite alternate;
}

@-webkit-keyframes mover-cshadow {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(8px);
  }
}
@keyframes mover-cshadow {
  10% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(8px);
  }
}
.laptop-here {
  position: relative;
}

.only-laptop {
  height: 380px;
  width: 380px;
  object-fit: contain;
}

.only-laptop img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  z-index: 1;
  animation: mover-laptop 2s infinite alternate;
}

.laptop-shadow {
  position: absolute;
  bottom: 5px;
  right: -20px;
  z-index: -1;
}

.laptop-shadow img {
  width: 90%;
  animation: mover-lpshadow 2s infinite alternate;
}

@-webkit-keyframes mover-lpshadow {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(8px);
  }
}
@keyframes mover-lpshadow {
  10% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-5px);
  }
}
.right-seq {
  object-fit: contain;
  position: absolute;
  right: -66px;
  z-index: -1;
  height: 70px !important;
  width: 70px !important;
}

.right-seq img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  animation: mover-right 2s infinite alternate;
}

.left-seq {
  height: 80px !important;
  width: 80px !important;
  object-fit: contain;
}

.left-seq img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  position: absolute;
  height: 80px !important;
  width: 80px !important;
  left: -40px;
  top: 50px;
  z-index: -1;
  animation: mover 1.5s infinite alternate;
}

.resume-banner {
  position: relative;
  top: -82px;
}

.right-design {
  position: relative;
}

.cactus-area {
  height: 100px;
  width: 100px;
  object-fit: contain;
  position: absolute;
  right: -80px;
  bottom: 10px;
}

.cactus-area img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  animation: mover-cactus 1.8s infinite alternate;
}

.mobile {
  height: 150px;
  width: 90px;
  object-fit: contain;
  position: absolute;
  top: -80px;
  left: -40px;
  z-index: 1;
}

.mobile img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  animation: mover-mobile 1.6s infinite alternate;
}

.left-design {
  position: relative;
}

@-webkit-keyframes mover-mobile {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(10px);
  }
}
@keyframes mover-mobile {
  10% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(15px);
  }
}
@-webkit-keyframes mover-coffe {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(5px);
  }
}
@keyframes mover-coffe {
  10% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(5px);
  }
}
@-webkit-keyframes mover-laptop {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-15px);
  }
}
@keyframes mover-laptop {
  10% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-15px);
  }
}
@-webkit-keyframes mover-cactus {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(10px);
  }
}
@keyframes mover-cactust {
  10% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(10px);
  }
}
@-webkit-keyframes mover-right {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-20px);
  }
}
@keyframes mover-right {
  10% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-10px);
  }
}
@-webkit-keyframes mover {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-15px);
  }
}
@keyframes mover {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-15px);
  }
}
.tako {
  font-size: 25px;
  color: #000;
  word-spacing: 9px;
  text-align: center;
  letter-spacing: 2px;
  margin-bottom: 12px;
  animation: mover-margin 2s infinite alternate;
}

.wrapp-name-lang {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.no-height {
  height: 0px;
  object-fit: contain;
}

.no-height img {
  height: 400px;
  opacity: 0.111;
  filter: grayscale(1);
}

.error-boxes {
  height: 500px;
  border: 1px solid #faf4ff;
  border-radius: 10px;
  background-color: #272727;
  box-shadow: 0 0 7px 0 #eaeff4;
  -moz-box-shadow: 0 0 7px 0 #eaeff4;
  -webkit-box-shadow: 1px 0px 12px 8px rgba(29, 29, 29, 0.031372549);
  display: flex;
  flex-direction: column;
  padding: 20px;
  text-align: center;
  align-items: center;
  background-image: url(/assets/images/vectors/pages.webp);
  background-position: bottom right;
  background-size: 300px;
  background-repeat: no-repeat;
}

.back-to-home:hover {
  box-shadow: 0 4px 15px 0 rgba(116, 79, 168, 0.02);
  background-image: linear-gradient(to right, #adbbfc, #dab3ff, #bfd2fc, #ddb9fc);
  font-weight: normal;
  color: #000;
  background-position: 100% 0;
  moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.8s linear;
}

.reasearcher {
  position: relative;
}

.reasearcher img {
  position: absolute;
  height: 400px;
  top: -315px;
}

.error-num p {
  font-family: cursive;
  font-size: 180px;
}

.error-boxes section {
  display: flex;
  justify-content: center;
}

.content {
  position: relative;
  height: 250px;
  display: flex;
}

.text-err {
  direction: rtl;
  text-align: center;
  color: #000;
}

.back-to-home {
  color: #000;
  padding: 10px 45px;
  margin-top: 25px;
  background: #caadff;
  font-size: 18px;
  border-radius: 25px;
  background-size: 300% 100%;
  moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  width: max-content;
}

header.comments-user {
  box-shadow: none !important;
}

@keyframes animate {
  0%, 100% {
    clip-path: polygon(0% 45%, 16% 44%, 33% 50%, 54% 60%, 70% 61%, 84% 59%, 100% 52%, 100% 100%, 0% 100%);
  }
  50% {
    clip-path: polygon(0% 60%, 15% 65%, 34% 66%, 51% 62%, 67% 50%, 84% 45%, 100% 46%, 100% 100%, 0% 100%);
  }
}
.line-height {
  height: 0px;
  display: flex;
  object-fit: contain;
  justify-content: flex-end;
  align-content: flex-start;
  position: relative;
}
.line-height img {
  height: 250px;
  opacity: 0.2;
  position: absolute;
  top: -410px;
}

.teacher-n {
  font-size: 14px;
}

.tc-n {
  font-size: 14px;
}

.nc-black {
  color: #fff;
  margin-bottom: 10px;
  font-size: 16px;
}

.checkmark {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  display: block;
  stroke-width: 2;
  stroke: #000;
  stroke-miterlimit: 10;
  box-shadow: inset 0px 0px 0px #4bb71b;
  animation: fill 0.4s ease-in-out 0.4s forwards, scale 0.3s ease-in-out 0.9s both;
  position: relative;
  top: 30px;
  right: 5px;
  margin: 0 auto;
}

.succes-title {
  text-align: center;
  color: #000;
  direction: rtl;
  font-weight: 600;
  font-size: 20px;
}

.checkmark__circle {
  stroke-dasharray: 166;
  stroke-dashoffset: 166;
  stroke-width: 3;
  stroke-miterlimit: 10;
  stroke: #ffca1e;
  fill: #fff;
  animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.checkmark__check {
  transform-origin: 50% 50%;
  stroke-dasharray: 48;
  stroke-dashoffset: 48;
  animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}

.ss-back {
  margin-bottom: 50px;
  text-align: right;
  padding: 40px 35px;
  background: rgb(255, 255, 255);
  border-radius: 8px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  position: relative;
  top: -40px;
}

.by-dl {
  direction: rtl;
}

.sa {
  padding: 15px;
  display: flex;
  justify-content: center;
}

.sa-warning {
  border-radius: 50%;
  border: 4px solid #ff0054;
  box-sizing: content-box;
  height: 80px;
  padding: 0;
  position: relative;
  background-color: #000;
  width: 80px;
  animation: scaleWarning 0.75s infinite alternate;
}

.sa-warning:after,
.sa-warning:before {
  background: #ffe6e6;
  content: "";
  border-radius: 50%;
  height: 100%;
  position: absolute;
  width: 100%;
}

.sa-warning:before {
  display: inline-block;
  opacity: 0;
  animation: pulseWarning 2s linear infinite;
}

.sa-warning:after {
  display: block;
  z-index: 1;
}

.sa-warning-body {
  background-color: #e91e63;
  border-radius: 2px;
  height: 47px;
  left: 50%;
  margin-left: -2px;
  position: absolute;
  top: 10px;
  width: 5px;
  z-index: 2;
  animation: pulseWarningIns 0.75s infinite alternate;
}

.sa-warning-dot {
  background-color: #ff0057;
  border-radius: 50%;
  bottom: 10px;
  height: 7px;
  left: 50%;
  margin-left: -3px;
  position: absolute;
  width: 7px;
  z-index: 2;
  animation: pulseWarningIns 0.75s infinite alternate;
}

@keyframes scaleWarning {
  0% {
    transform: scale(1);
  }
  30% {
    transform: scale(1.02);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes pulseWarning {
  0% {
    background-color: #fff;
    transform: scale(1);
    opacity: 0.5;
  }
  30% {
    background-color: #fff;
    transform: scale(1);
    opacity: 0.5;
  }
  100% {
    background-color: #ff0054;
    transform: scale(2);
    opacity: 0;
  }
}
@keyframes pulseWarningIns {
  0% {
    background-color: #f8d486;
  }
  100% {
    background-color: #ff0054;
  }
}
.alerting {
  position: relative;
  top: -50px;
}

.alert-btn {
  background-image: linear-gradient(to left, #9876ff, #f1a2ff, #f05a28) !important;
}

.box-de {
  margin-top: 20px;
  height: 80px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #eee;
  border-radius: 5px;
}
.box-de span {
  font-weight: 600;
}
.box-de .main-price {
  font-size: 18px;
  font-weight: 800;
  margin-left: 10px;
}

.pages-header {
  position: relative;
}

.back-header {
  position: relative;
  /* top: 100px; */
  height: 250px;
  background: linear-gradient(351deg, #210055 0.64%, #000000 98.23%);
  background-size: cover;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  margin-top: 125px;
}

.bg-head {
  background-position: left;
  background-size: cover;
}

.wild-coder-t {
  margin-top: 80px;
}

.st-title {
  font-size: 17px;
  color: #000;
}

.ca-title {
  margin-right: 10px;
  font-size: 15px;
  color: #14003b;
  font-weight: 800;
}

.checking {
  height: 80px;
  width: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #000;
  border: 2px solid #28da87;
  border-radius: 50%;
}

.go-panel i {
  margin-right: 8px;
}

.back-tp {
  border-radius: 8px;
  font-size: 16px;
  height: 50px;
  color: #000 !important;
  background: #754ffe;
  width: 260px;
  margin-top: 20px;
  border: none;
  background-size: 300% 100%;
  background-image: linear-gradient(to right, #ffca1e, #ffefbd, #212529);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-weight: 600;
}

.back-tp:hover {
  color: #000;
  background-image: linear-gradient(to left, #9876ff, #f1a2ff, #f05a28);
  transition: all 0.3s ease;
}

.free-black {
  color: white;
  margin-right: 20px;
  font-size: 16px;
}

@keyframes stroke {
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes scale {
  0%, 100% {
    transform: none;
  }
  50% {
    transform: scale3d(1.1, 1.1, 1);
  }
}
@keyframes fill {
  100% {
    box-shadow: inset 0px 0px 0px 30px #4bb71b;
  }
}
@media (max-width: 991px) {
  .timer-title {
    color: #000;
    font-size: 0.5rem;
    margin-top: 3px;
    font-weight: 600;
  }
  .blog-wrapper .blog-banner .category-label {
    position: relative;
    top: -42px;
    right: -20px;
    font-size: 11px;
  }
  .about-footer p {
    font-size: 12px;
    margin-bottom: 20px;
  }
  .mobile-none {
    display: none !important;
  }
  .cart-course {
    margin-bottom: 20px;
  }
  .back-course a {
    width: 135px !important;
  }
  .null-payment h5 span {
    font-size: 16px;
  }
  .null-payment h5 i {
    font-size: 24px;
    margin-left: 10px;
  }
  .wrapp-payment-btn {
    padding-left: 5px;
  }
  .wrapp-payment-btn h4 {
    font-size: 12px;
    padding: 0px 10px;
  }
  .wrapp-payment-btn i {
    font-size: 22px;
    padding: 12px 5px;
    border-left: 1px solid #38a815;
  }
  .wrapp-payment-btn img {
    height: 22px;
  }
  .sm-set-border {
    padding-bottom: 20px;
    border-bottom: 1px solid rgb(242, 242, 242);
  }
  .wrapp-payment {
    padding: 20px 15px;
  }
  .wrapp-payment h2 {
    font-size: 0.8rem;
    display: flex;
  }
  .wrapp-payment h2 i {
    margin-left: 6px;
  }
  .wrapp-payment .wrapp-course-payment h1 {
    font-size: 16px;
  }
  .wrapp-payment .wrapp-course-payment strong {
    font-size: 14px;
  }
  .wrapp-payment .wrapp-course-payment .main-price {
    font-size: 20px;
  }
  .wrapp-payment .wrapp-course-payment span {
    font-size: 12px;
    margin-right: 10px;
  }
  .wrapp-payment .wrapp-payment a {
    padding: 5px 8px;
    font-size: 13px;
    height: 30px;
    width: 120px;
    border-radius: 4px;
  }
  .wrapp-payment .wrapp-course-details-header {
    margin-bottom: 20px;
  }
  .wrapp-payment .wrapp-course-details-header h3 {
    font-size: 1rem;
  }
  .wrapp-payment .wrapp-img-payment {
    height: 80px;
    width: 120px;
    margin-left: 30px;
  }
  .wrapp-payment a {
    padding: 5px 8px;
    font-size: 13px;
    height: 30px;
    width: 120px;
  }
  .contact-form-holder {
    top: 5px;
    margin-bottom: 30px;
  }
  .contact-us-head h2 {
    font-size: 22px;
    margin-bottom: 20px;
  }
  .contact-us-head h3 {
    font-size: 18px;
    padding-right: 20px;
    margin-bottom: 10px;
  }
  .contact-us-head p {
    font-size: 16px;
  }
  .error-body {
    background: #fff;
    top: -40px;
    padding: 40px 20px;
  }
  .error-body h2 {
    font-size: 24px;
    margin-top: 20px;
  }
  .social-contact-holder {
    height: 60px;
    width: 60px;
  }
  .show-padding {
    padding: 10px !important;
  }
  .left-decore {
    display: none;
  }
  .no-height {
    display: none;
  }
  .line-height {
    display: none;
  }
  .right-decore {
    display: none;
  }
  .right-bs {
    padding-left: 5px;
  }
  .left-bs {
    padding-right: 5px;
  }
  .team-b {
    height: 310px;
    display: flex;
    flex-direction: column;
    padding: 20px;
    padding-bottom: 30px;
  }
  .ta-all {
    display: none;
  }
  .pagination__item > a {
    width: 30px;
    height: 30px;
    padding: 10px 10px;
    font-size: 10px;
  }
  .pagination__item {
    margin: 5px 5px;
    padding: 10px !important;
    width: 25px;
  }
  .btn-fb {
    width: 30px;
    height: 30px;
    padding: 10px 10px;
    font-size: 10px;
  }
  .header-all-c {
    height: 300px;
    background-position: right;
    background-image: url(/assets/images/header/Web\ 1920\ –\ 1.webp);
    position: relative;
    top: -82px;
  }
  .boat {
    height: 250px;
    object-fit: contain;
    margin-top: 100px;
    display: flex;
    justify-content: center;
  }
  .name-bl {
    font-size: 14px;
  }
  .search-tag {
    color: #fff;
    margin-bottom: 20px;
    text-align: right;
    font-size: 16px;
  }
  .blog-banner {
    height: 200px;
    width: 100%;
    object-fit: cover;
    border-radius: 10px;
    margin-bottom: 20px;
  }
  .blog-wroter {
    display: flex;
    height: 70px;
    align-items: center;
    justify-content: flex-start;
    padding-right: 15px;
  }
  .te-image {
    height: 40px;
    width: 65px;
    object-fit: cover;
    border-radius: 50%;
    margin-left: 20px;
  }
  .img-min {
    width: 100px;
    min-height: 100px;
    min-width: 100px;
    object-fit: cover;
    border-radius: 10px;
    display: flex;
    margin-left: 15px;
    align-items: flex-end;
  }
  .nm-min {
    font-size: 14px;
    margin: 5px 0px;
    font-weight: 600;
  }
  .colori {
    font-size: 14px;
  }
  .min-blog {
    margin-bottom: 10px;
    padding-bottom: 10px;
  }
  .acc-course {
    margin-top: 0px;
  }
  .img-mc {
    width: 100%;
    object-fit: cover;
    border-radius: 10px;
    box-shadow: 0px 1px 0px 0 rgba(0, 0, 0, 0.81), 0 4px 15px 0 rgba(0, 0, 0, 0.78) !important;
  }
  .course-component {
    padding: 10px;
  }
  .sc-wrapp {
    background-color: rgb(25, 25, 25);
    border-radius: 6px;
    padding: 15px;
    margin-bottom: 20px;
    margin-top: 20px;
  }
  .course-wrapp {
    margin-top: 40px;
  }
  .sv-wrapp {
    margin-bottom: 20px;
  }
  .course-component {
    position: relative;
    top: -100px;
  }
  .tabs-cyan {
    direction: rtl;
    margin-top: 0px;
    padding-right: 0px;
  }
  .imge-hl {
    height: 100px;
    width: 100px;
    object-fit: contain;
  }
  .develoap-drive {
    font-size: 20px;
    text-align: right;
    color: #fff;
    margin-bottom: 0px;
    margin-top: 0px;
  }
  .paraghrap {
    margin-top: 12px;
    color: rgb(223, 223, 223);
    text-align: right;
    line-height: 30px;
    font-size: 10px;
  }
  .hu-junk {
    height: 600px;
    padding: 70px 10px;
    padding-top: 100px;
    background: url(/assets/images/header/t.webp);
    display: flex;
    position: relative;
    top: -82px;
  }
  .our-team {
    height: 266px;
    width: 100%;
    object-fit: cover;
    padding: 20px;
    position: absolute;
    top: -192px;
    z-index: -2;
  }
  .shapes {
    height: 48px;
    width: 45%;
    object-fit: cover;
    padding-top: 40px;
    position: absolute;
    top: -343px;
    right: -81px;
    z-index: -2;
  }
  .our-box {
    padding: 20px 10px;
    height: 180px;
    margin-bottom: 20px;
    width: 100%;
  }
  .our-ico {
    height: 40px;
    width: 40px;
    object-fit: cover;
  }
  .order-sm-1 {
    order: 1 !important;
  }
  .our-box p {
    padding: 3px 10px;
    font-size: 10px;
    height: 60px;
    overflow: hidden;
  }
  .last-logo {
    order: 2 !important;
  }
  .ser-box {
    font-size: 11px;
    margin: 10px 0px;
    font-weight: normal;
  }
  .mission-title {
    font-size: 20px;
    text-align: right;
    color: #fff;
    margin-bottom: 20px;
    margin-top: 0px;
  }
  .miss-texter {
    margin-top: 12px;
    color: #fff;
    text-align: right;
    line-height: 30px;
    font-size: 10px;
  }
  .ct-toch {
    text-align: right;
    margin-bottom: 10px;
    margin-top: 20px;
    font-size: 20px;
    color: #fff;
  }
  .contact-box {
    margin-top: 20px;
    height: 200px;
  }
  .two-part {
    margin: 20px 0px;
  }
  .get-in-toch {
    color: #ffffff;
    font-size: 20px;
    text-align: center;
  }
  .contact-bt {
    font-size: 14px;
    color: #fff;
    margin-bottom: 8px;
    font-weight: normal;
  }
  .right-box p {
    color: #c6cde5;
    font-size: 10px;
    margin-bottom: 20px;
    line-height: 20px;
    height: 60px;
    overflow: hidden;
  }
  .contact-btn {
    padding: 10px 25px;
    border-radius: 8px;
    background-color: rgb(152, 118, 255);
    color: #000;
    text-align: center;
    font-size: 12px;
    font-weight: normal;
  }
  .contact-header {
    height: 250px;
    background: center;
    background-image: url(/assets/images/header/t.webp);
    background-size: cover;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    top: -82px;
    padding-top: 75px;
  }
  .contact-ht {
    color: #fff;
    font-size: 20px;
  }
  .pholder {
    padding: 10px 15px;
  }
  .nm-cc {
    font-size: 12px;
    font-weight: normal;
  }
  .wild-coder-t {
    display: none;
  }
  .mirror-header {
    height: 0px !important;
  }
  .c-name {
    text-align: right;
    padding: 0px 20px;
    min-width: 200px;
  }
  .banner--cart {
    height: 300px;
    background-size: cover;
  }
  .whiteen-row {
    border-radius: 6px;
    box-shadow: 0 0 7px 0 #eaeff4;
    -moz-box-shadow: 0 0 7px 0 #eaeff4;
    -webkit-box-shadow: 0 0 1px 0 #ffffff;
    padding: 10px 15px;
    height: 100px;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    transition: all ease-in-out 0.3s;
    margin-bottom: 15px;
  }
  .c-icon {
    height: 50px;
    height: 50px;
    object-fit: contain;
    border-radius: 50%;
  }
  .back-header {
    position: absolute;
    top: -82px;
    height: 82px;
    background-size: cover;
  }
  .space-top {
    margin-top: 120px;
  }
  .about-section {
    padding: 40px 0;
  }
  .about-section h3 {
    font-size: 30px;
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .about-section p {
    margin-top: 15px;
    font-size: 14px;
    margin-bottom: 15px;
  }
  .about-us-vector {
    height: 220px;
    object-fit: contain;
    width: 100%;
  }
  .about-us-vector img {
    height: 100%;
    width: 100%;
    object-fit: contain;
  }
  .bg-circles {
    height: 250px;
  }
  .about-us-sections-img {
    height: 180px;
    width: 100%;
    padding: 15px;
  }
  .about-us-sections-img img {
    height: 100%;
    width: 100%;
  }
  .ss-back {
    margin-top: 60px;
    padding: 50px 20px;
  }
  .checkmark {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    display: block;
    stroke-width: 2;
    stroke: #f1a2ff;
    top: 5px;
    right: 5px;
    margin: 0 auto;
  }
  .box-de {
    margin-top: 10px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .st-title {
    font-size: 10px;
  }
  .ca-title {
    margin-right: 10px;
    font-size: 10px;
  }
  .succes-title {
    text-align: center;
    direction: rtl;
    font-size: 14px;
  }
  .back-tp {
    border-radius: 8px;
    font-size: 11px;
    height: 40px;
    color: #fff !important;
    background: #754ffe;
    width: 185px;
    margin-top: 20px;
    border: none;
    background-size: 300% 100%;
    background-image: linear-gradient(to right, #9876ff, #f1a2ff, #f05a28);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }
  .checking {
    height: 80px;
    width: 80px;
  }
  .checking {
    height: 80px;
    width: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #000;
    border: 2px solid #28da87;
    border-radius: 50%;
  }
  .course-main {
    height: 250px !important;
  }
  .course-main img {
    border-radius: 6px;
    height: 250px;
    width: 100%;
    object-fit: cover;
  }
  .img-cc {
    height: 60px;
    width: 60px;
  }
  .side-detail {
    padding: 10px;
    position: relative;
    top: -100px;
    border-radius: 6px;
    height: max-content;
  }
  .title-course-banner {
    direction: rtl;
    text-align: right;
    height: 450px;
    display: flex;
    align-items: flex-start;
  }
  .course-description {
    direction: rtl;
    padding: 40px 30px;
    text-align: right;
    background-color: rgb(25, 25, 25);
    border-radius: 10px;
    margin-bottom: 30px;
  }
  .card-body {
    text-align: right;
    padding: 0px;
  }
  .some-cream {
    color: rgb(255, 255, 255);
    padding: 20px 50px;
  }
  .course-main img {
    border-radius: 6px;
    height: 250px;
    width: 100%;
    object-fit: cover;
  }
  .see-all {
    margin-top: 15px;
    padding: 18px 14px;
    border-radius: 50px;
    height: 40px;
    border: 2px solid rgb(125, 75, 255);
    display: flex;
    align-items: center;
    /* direction: ltr; */
    width: max-content;
    flex-direction: row;
    justify-content: flex-start;
  }
  .purple-line {
    margin-right: 20px;
  }
  .no-height img {
    height: 320px;
    opacity: 0.111;
    filter: grayscale(1);
  }
  .holder {
    padding: 0px;
  }
  .teacher-courses {
    margin-top: 20px;
  }
  .download-file {
    direction: rtl;
    text-align: right;
    display: flex;
    flex-direction: column;
    color: #fff;
    padding-right: 0px;
    font-size: 12px;
  }
  .ico-cc {
    height: 30px;
    width: 30px;
    object-fit: contain;
  }
  .type-of {
    margin: 2px;
    font-size: 12px;
  }
  .t-box {
    font-size: 14px;
  }
  .academy-image {
    height: 100px;
    object-fit: cover;
    margin-top: 25px;
  }
  .box-ac {
    height: 120px;
    width: 125px;
    border-radius: 6px;
    margin: 0px 15px;
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .title-academy {
    font-size: 18px;
    margin-top: 30px;
    margin-bottom: 30px;
    color: rgb(152, 118, 255) !important;
  }
  .ac-text {
    text-align: justify;
    font-size: 12px;
    line-height: 28px;
  }
  .newsletters-holder input {
    padding: 5px;
    height: 40px;
  }
  .newsletters-holder button {
    padding: 5px;
    height: 40px;
  }
  .newsletters-holder .input-group {
    height: 40px;
    margin-right: 5px;
  }
  .newsletters-holder i {
    font-size: 14px;
    padding: 0px;
    margin-top: 0px;
  }
  .newsletters-holder ::placeholder {
    font-size: 10px;
  }
  .footer-ul > li > a {
    font-size: 12px !important;
    margin-top: 10px;
  }
  .title-footer {
    font-size: 12px !important;
    font-weight: 600;
  }
  .topp-catt {
    position: relative;
    top: -50px;
  }
  .btn span {
    background: no-repeat;
    color: rgb(255, 255, 255);
    font-size: 12px;
  }
  .img-flat {
    height: 400px;
    background-image: url(/assets/images/vectors/Group\ 34.webp);
    background-repeat: no-repeat;
    position: absolute;
    top: 260px;
  }
  .as-first {
    order: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .pl-none {
    order: 2;
  }
  .hero-section {
    height: 420px;
    background-position: center;
  }
  .btn svg rect {
    stroke: #c77dff;
    stroke-width: 2px;
    stroke-dasharray: 353, 0;
    stroke-dashoffset: 0;
    -webkit-transition: all 600ms ease;
    transition: all 600ms ease;
    width: 180px;
    text-align: center;
    height: 46px;
  }
  .caption-hro {
    display: none;
  }
  .erth-margin {
    margin-top: 20px;
    padding-right: 20px;
  }
  .certi-holder {
    display: flex;
    justify-content: center;
  }
  .footer-ul li {
    font-size: 13px;
    margin-top: 0px;
    list-style: none;
  }
  .tracks-row {
    margin-top: 10px;
    margin-bottom: 10px;
    background-color: rgb(39, 40, 44);
    padding: 50px 10px !important;
    direction: rtl;
  }
  .bird-padding {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-right: 28px;
  }
  .ser-line {
    text-align: right;
    display: flex;
    flex-direction: column;
    padding: 0px 30px;
  }
  .a-capt {
    margin-top: 0px;
    color: #fff;
  }
  .name-track {
    text-align: right;
    color: rgb(255, 255, 255);
    font-size: 14px !important;
  }
  .details-course {
    text-align: right;
    padding-right: 10px !important;
    margin-bottom: 0px;
    padding-top: 5px;
  }
  .details-course li a {
    font-size: 12px !important;
    color: rgb(168, 164, 163);
  }
  .mini-capt {
    text-align: right;
    margin-right: 10px !important;
    color: rgb(255, 255, 255);
    margin-top: 20px;
    padding: 0px 20px;
  }
  .mini-capt p {
    color: rgb(145, 145, 145);
    font-size: 10px;
  }
  .track-capt {
    color: #fffff5;
    margin-top: 10px;
    font-size: 12px !important;
  }
  .track-title {
    color: rgb(246, 241, 250);
    font-size: 18px !important;
  }
  header .hamburger-menu .bar::before,
  header .hamburger-menu .bar::after {
    position: absolute;
    background: rgb(152, 118, 255);
    content: "";
    right: -75px !important;
    border-radius: 5px;
  }
  header .hamburger-menu .bar.animate::after {
    top: 6px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: top 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
    -moz-transition: top 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
    -ms-transition: top 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
    -o-transition: top 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
    transition: top 300ms cubic-bezier(0.23, 1, 0.32, 1), transform 300ms 300ms cubic-bezier(0.23, 1, 0.32, 1);
  }
  .header .menu {
    position: fixed;
    width: 320px;
    background-color: #202020;
    right: 0;
    top: 0;
    height: 100%;
    overflow: hidden;
    transform: translate(100%);
    transition: all 0.5s ease;
    z-index: 1099;
  }
  .bt-nice {
    padding: 10px 20px;
  }
}
/* media query*/
li {
  display: list-item;
  text-align: -webkit-match-parent;
}

ul {
  padding: 20px;
  list-style-type: unset;
}

@media only screen and (min-width: 1336px) and (max-width: 1366px) {
  .this-panel {
    padding: 40px 20px;
    border-radius: 8px;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    margin-right: 260px;
    min-height: 100vh;
    text-align: right;
    transition: all ease-in-out 0.5s;
  }
}
@media only screen and (min-width: 1026px) and (max-width: 1300px) {
  .panel-boxes {
    display: flex;
    flex-direction: column;
    height: 100px;
    padding: 5px;
    text-align: center;
    max-width: 100%;
    overflow: hidden;
    justify-content: center;
  }
  .icon-panel {
    height: 50px;
    width: 50px;
    padding: 5px;
    background-color: #191919;
    border-radius: 50%;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    object-fit: cover;
    margin-left: 0px;
  }
  .nm-box {
    font-weight: normal;
    font-size: 12px;
    text-align: center;
    margin-top: 10px;
  }
  .minicaption-box {
    display: none;
    color: #fff !important;
  }
  .this-panel {
    padding: 40px 20px;
    border-radius: 8px;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    margin-right: 195px;
    min-height: 100vh;
    text-align: right;
    transition: all ease-in-out 0.5s;
  }
}
@media only screen and (min-width: 1201px) and (max-width: 1025px) {
  .panel-boxes {
    display: flex;
    flex-direction: column;
    height: 100px;
    padding: 5px;
    text-align: center;
    max-width: 100%;
    overflow: hidden;
    justify-content: center;
  }
  .icon-panel {
    height: 50px;
    width: 50px;
    padding: 5px;
    background-color: #191919;
    border-radius: 50%;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    object-fit: cover;
    margin-left: 0px;
  }
  .nm-box {
    font-weight: normal;
    font-size: 12px;
    text-align: center;
    margin-top: 10px;
  }
  .panel-boxes {
    display: flex;
    flex-direction: column;
    height: 100px;
    padding: 5px;
    text-align: center;
    justify-content: center;
  }
  .icon-panel {
    height: 50px;
    width: 50px;
    padding: 5px;
    background-color: #191919;
    border-radius: 50%;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    object-fit: cover;
    margin-left: 0px;
  }
  .nm-box {
    font-weight: normal;
    font-size: 12px;
    text-align: center;
    margin-top: 10px;
  }
  .minicaption-box {
    display: none;
  }
  .some-cream {
    padding: 10px 10px;
  }
  .header .menu > ul > li {
    display: inline-block;
    line-height: 50px;
    padding: 20px 10px;
  }
}
/* ipod pro*/
@media only screen and (min-width: 1366px) and (max-width: 1400px) {
  .navbar-padding {
    padding: 0px 0px;
    height: 82px;
  }
}
@media only screen and (min-width: 1201px) and (max-width: 1480px) {
  .navbar-padding {
    padding: 0px 0px;
    height: 82px;
  }
  .header .item-center {
    flex: 0 0 54% !important;
  }
}
/* ipod */
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .img-min {
    width: 150px;
    height: 100px;
    min-height: 150px;
    margin-left: 5px;
  }
  .ct-toch {
    text-align: right;
    margin-bottom: 10px;
    margin-top: 20px;
    font-size: 20px;
    color: #fff;
    padding-left: 22px;
  }
  .contact-box {
    margin-top: 20px;
    height: 200px;
  }
  .two-part {
    margin: 20px 0px;
    width: 100vw;
    overflow: hidden;
  }
  .get-in-toch {
    color: #ffffff;
    font-size: 20px;
    text-align: center;
  }
  .contact-bt {
    font-size: 14px;
    color: #fff;
    margin-bottom: 8px;
    font-weight: normal;
  }
  .right-box p {
    color: #c6cde5;
    font-size: 14px;
    margin-bottom: 11px;
    line-height: 20px;
    height: 40px;
    margin-top: 10px;
    overflow: hidden;
  }
  .contact-btn {
    padding: 9px 15px;
    border-radius: 8px;
    background-color: rgb(152, 118, 255);
    color: #000;
    text-align: center;
    font-size: 12px;
    font-weight: 600;
  }
  .nc-black {
    color: #fff;
    margin-bottom: 10px;
    font-size: 10px;
  }
  .offer-code {
    padding-right: 0px;
  }
  .offering {
    margin-right: 15px;
  }
  .custom_radio input[type=radio] + label {
    position: relative;
    display: inline-block;
    padding-left: 0em;
    margin-right: 1em;
    cursor: pointer;
    line-height: 1em;
    font-size: 10px;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
  }
  .c-icon {
    height: 50px;
    height: 50px;
    object-fit: contain;
    border-radius: 50%;
  }
  .nc-black {
    color: #fff;
    margin-bottom: 10px;
    font-size: 12px;
  }
  .teacher-n {
    font-size: 12px;
  }
  .tc-n {
    font-size: 12px;
  }
  .c-name {
    text-align: right;
    padding: 0px 20px;
    min-width: 250px;
  }
  .remove-course {
    width: 25px;
    height: 25px;
    padding: 5px;
    background-color: rgb(223, 174, 252);
    border: none;
    text-align: center;
    margin-right: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    cursor: pointer;
  }
  .remove-course i {
    font-size: 12px;
  }
  .row-input {
    display: flex;
    flex-direction: row;
  }
  .offer-input {
    width: 70% !important;
  }
  .see-all {
    padding: 10px 10px;
    border-radius: 50px;
    height: 35px;
    border: 2px solid rgb(125, 75, 255);
    display: flex;
    align-items: center;
    margin-top: 5px;
    width: max-content;
  }
  .see-all span {
    color: rgb(255, 255, 255);
    margin-left: 10px;
    font-size: 10px;
  }
  .right-decore img {
    height: 400px;
    position: absolute;
    right: 10px;
    opacity: 0.4;
  }
  .tracks-row {
    margin-top: 30px;
    margin-bottom: 30px;
    background-color: rgb(39, 40, 44);
    padding: 40px 10px;
  }
  .text-content {
    padding: 40px 45px;
    border-radius: 6px;
    margin-top: 30px;
  }
  .blog-setting {
    display: flex;
    margin-top: 0px;
    align-items: center;
  }
  .blog-caption {
    text-align: right;
    font-size: 10px;
    height: 70px;
    line-height: 18px;
    overflow: hidden;
    color: rgb(255, 255, 255);
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
  }
  .left-seq {
    display: none;
  }
  .mobile {
    height: 150px;
    width: 90px;
    object-fit: contain;
    position: absolute;
    top: -100px;
    left: 15px;
  }
  .header .menu > ul > li {
    display: inline-block;
    line-height: 50px;
    padding: 0px 7px;
  }
  .header {
    padding-left: 30px !important;
  }
  .caption-hro {
    font-size: 16px;
    margin-top: 30px;
    margin-bottom: 30px;
    line-height: 28px;
    color: rgb(255, 255, 255);
    text-align: center;
    padding: 10px 0px;
  }
  .header .item-center {
    flex: 0 0 56% !important;
  }
  .navbar-padding {
    padding: 0px 20px;
    height: 82px;
  }
  .course-main {
    height: 250px !important;
  }
  .course-main img {
    border-radius: 6px;
    height: 250px;
    width: 100%;
    object-fit: cover;
  }
  .some-cream {
    padding: 10px 20px !important;
  }
  .name-ins {
    font-size: 12px;
    width: max-content;
    border-bottom: 2px solid rgb(206, 161, 243);
    padding-bottom: 12px;
  }
  .position {
    font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
    font-size: 10px;
    color: rgb(248, 238, 255);
  }
  .sidebar {
    width: 70px !important;
  }
  .ticket-box {
    margin-bottom: 12px;
  }
  .sidebar {
    width: 70px;
  }
  .collpse-content {
    display: none;
  }
  .minicaption-box {
    margin-top: 5px;
    font-size: 12px;
    display: none;
  }
  .panel-boxes {
    display: flex;
    flex-direction: column;
    height: 100px;
    padding: 5px;
    text-align: center;
    justify-content: center;
  }
  .icon-panel {
    height: 50px;
    width: 50px;
    padding: 5px;
    background-color: #191919;
    border-radius: 50%;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    object-fit: cover;
    margin-left: 0px;
  }
  .nm-box {
    font-weight: normal;
    font-size: 12px;
    text-align: center;
    margin-top: 10px;
  }
  .this-panel {
    padding: 40px 20px;
    border-radius: 8px;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    margin-right: 250px;
    min-height: 100vh;
    text-align: right;
    transition: all ease-in-out 0.5s;
  }
  .stranger-padding {
    padding: 0px 40px;
  }
  .panel-boxes {
    display: flex;
    flex-direction: column;
    height: 100px;
    padding: 5px;
    text-align: center;
    justify-content: center;
  }
  .icon-panel {
    height: 50px;
    width: 50px;
    padding: 5px;
    background-color: #191919;
    border-radius: 50%;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    object-fit: cover;
    margin-left: 0px;
  }
  .nm-box {
    font-weight: normal;
    font-size: 12px;
    text-align: center;
    margin-top: 10px;
  }
  .minicaption-box {
    display: none;
  }
  .st-teaching p {
    color: #000;
    font-size: 12px;
  }
  .cart-img {
    border-radius: 5px 5px 0px 0px;
    height: 120px;
    width: 100%;
    object-fit: cover;
  }
  .ec-btn {
    padding: 10px 13px;
    min-width: 90px;
    margin: 0px 2px;
  }
  .ec-btn a {
    color: rgb(255, 255, 255);
    font-size: 10px;
  }
  .detail-box {
    margin-bottom: 20px;
    display: flex;
    padding: 10px;
  }
  .teacher-mini-resome p {
    font-size: 10px;
    direction: rtl;
    text-align: justify;
    margin-bottom: 10px;
  }
  .course-description {
    margin-bottom: 20px;
  }
  .course-level p {
    font-size: 10px;
    line-height: 20px;
  }
  .course-level {
    width: max-content;
    padding: 0px 2px;
    border-radius: 3px;
  }
  .search-filter > .input-group > input {
    width: 70% !important;
    padding: 0px;
    padding-right: 5px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .banner--2 {
    height: 170px;
  }
  .search-filter > .input-group > input {
    width: 70% !important;
    padding: 0px;
    padding-right: 5px;
  }
  .header .item-right {
    align-items: center;
    position: absolute;
    right: 20px;
  }
  .as-first {
    display: none;
  }
  .carousel {
    padding: 0;
  }
  .side-wrapp-banner {
    display: none;
  }
  .add-all-filter {
    margin-bottom: 30px;
  }
  .right-padding {
    padding-left: 25px;
  }
  .course-slider {
    position: relative;
    top: -82px;
    height: 300px;
  }
  .w-best-courses {
    margin-top: 50px;
  }
  .topp-catt section {
    top: -190px;
  }
  .img-min {
    width: 150px;
    height: 100px;
    min-height: 100px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .st-counter {
    margin-top: 25px;
    margin-bottom: 0px;
  }
  .nb-wrap a {
    color: #fff;
    font-size: 12px;
    line-height: 28px;
  }
  .offer-code {
    padding-right: 0px;
  }
  .off-c {
    margin-right: 30px;
    margin-bottom: 0px;
  }
  .some-cream h4 {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 24px;
  }
  .c-icon {
    height: 50px;
    height: 50px;
    object-fit: contain;
    border-radius: 50%;
  }
  .nc-black {
    color: #fff;
    margin-bottom: 10px;
    font-size: 10px;
  }
  .teacher-n {
    font-size: 12px;
  }
  .tc-n {
    font-size: 12px;
  }
  .c-name {
    text-align: right;
    padding: 0px 20px;
    min-width: 250px;
  }
  .remove-course {
    width: 25px;
    height: 25px;
    padding: 5px;
    background-color: rgb(223, 174, 252);
    border: none;
    text-align: center;
    margin-right: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    cursor: pointer;
  }
  .remove-course i {
    font-size: 12px;
  }
  .row-input {
    display: flex;
    flex-direction: row;
  }
  .offer-input {
    width: 80% !important;
  }
  .mobile {
    height: 150px;
    width: 85px;
    object-fit: contain;
    position: absolute;
    top: -80px;
    left: -130px;
  }
  .course-main {
    height: 250px !important;
  }
  .course-main img {
    border-radius: 6px;
    height: 250px;
    width: 100%;
    object-fit: cover;
  }
  .some-cream {
    padding: 10px 40px;
  }
  .sidebar {
    width: 70px !important;
  }
  .ticket-box {
    margin-bottom: 12px;
  }
  .sidebar {
    width: 70px;
  }
  .collpse-content {
    display: none;
  }
  .panel-boxes {
    display: flex;
    flex-direction: column;
    height: 100px;
    padding: 5px;
    text-align: center;
    justify-content: center;
  }
  .icon-panel {
    height: 50px;
    width: 50px;
    padding: 5px;
    background-color: #191919;
    border-radius: 50%;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    object-fit: cover;
    margin-left: 0px;
  }
  .nm-box {
    font-weight: normal;
    font-size: 12px;
    text-align: center;
    margin-top: 10px;
  }
  .this-panel {
    padding: 40px 20px;
    border-radius: 8px;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    margin-right: 100px;
    min-height: 100vh;
    text-align: right;
    transition: all ease-in-out 0.5s;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .caption-cf {
    font-size: 10px;
  }
  .img-fc {
    padding: 10px;
    padding-right: 0px;
    height: 100px;
    width: 250px !important;
    object-fit: contain;
    border-radius: 4px;
  }
  .content-cf {
    text-align: right;
    padding: 10px;
    display: flex;
    align-items: flex-start;
    width: 150%;
  }
  .wrapp-cf {
    display: flex;
    direction: rtl;
    width: 100%;
    align-items: center;
  }
  .wrapp-second {
    width: 30%;
  }
  .wrapp-second {
    margin-right: 30px;
    padding-top: 35px;
  }
  .panel-boxes {
    display: flex;
    flex-direction: column;
    height: 100px;
    padding: 5px;
    text-align: center;
    justify-content: center;
  }
  .icon-panel {
    height: 50px;
    width: 50px;
    padding: 5px;
    background-color: #191919;
    border-radius: 50%;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    object-fit: cover;
    margin-left: 0px;
  }
  .nm-box {
    font-weight: normal;
    font-size: 12px;
    text-align: center;
    margin-top: 10px;
  }
  .minicaption-box {
    display: none;
  }
}
@media (max-width: 575px) {
  .blog-body ul li {
    font-size: 12px;
  }
  .timer-title {
    font-size: 0.5rem;
  }
  .login-with-google-btn {
    background-position: 95px 15px;
  }
  .check-form input {
    width: 14px !important;
    height: 42px;
  }
  .st-counter {
    margin-top: 25px;
    margin-bottom: 0px;
    padding-right: 0;
  }
  .search-filter > form {
    padding: 0;
  }
  .dropdown-item:hover {
    border-right: 2px solid #992bff;
  }
  .alert-title {
    font-size: 12px;
    text-align: right;
    color: #000;
  }
  .right-bs {
    padding-left: 5px;
  }
  .left-bs {
    padding-right: 5px;
  }
  .teaching-owner {
    top: 50px;
  }
  .rtl-row {
    padding: 0px 30px !important;
  }
  .payment-way {
    padding-right: 0px;
    height: 70px;
    margin-bottom: 45px;
  }
  .gatway-p {
    padding-right: 0px;
  }
  .so-ul li {
    padding: 10px 10px;
    list-style: none;
  }
  .so-ul ul {
    padding: 10px 10px;
    list-style: none;
  }
  .so-ul {
    list-style: disc;
  }
  .topper-footer {
    margin-top: 35px;
  }
  .btn svg rect {
    stroke: #c77dff;
    stroke-width: 2px;
    stroke-dasharray: 353, 0;
    stroke-dashoffset: 0;
    -webkit-transition: all 600ms ease;
    transition: all 600ms ease;
    width: 180px;
    text-align: center;
    height: 46px;
  }
  .list-unstyled {
    padding: 0px;
  }
  .img-cc {
    height: 50px;
    width: 50px;
  }
  .name-course-s {
    font-size: 0.6rem;
    margin: 5px;
  }
  .topp-catt {
    position: relative;
    top: 0px;
  }
  .color-hero {
    padding-bottom: 0;
  }
  .capt-wc {
    font-size: 10px;
    color: #ae93ff;
  }
  .np-row {
    padding: 0px 157px;
    position: relative;
    top: -40px;
  }
  .all-you-need {
    font-size: 18px;
    margin-bottom: 20px;
  }
  .tako {
    font-size: 20px;
    word-spacing: 9px;
    text-align: center;
    letter-spacing: 2px;
    margin-bottom: 10px;
    animation: mover-margin 2s infinite alternate;
  }
  .only-laptop {
    height: 250px;
    width: 230px;
    object-fit: contain;
  }
  .laptop-sett {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: center;
  }
  .latte {
    display: flex;
    justify-content: flex-start;
    position: absolute;
    top: 25px;
    left: 42px;
  }
  .cactus-area {
    height: 75px;
    width: 95px;
    object-fit: contain;
    position: absolute;
    right: 15px;
    bottom: 200px;
  }
  .laptop-here {
    position: relative;
    top: -32px;
    right: 20px;
  }
  .mobile {
    height: 135px;
    width: 80px;
    object-fit: contain;
    position: absolute;
    top: -50px;
    left: -40px;
  }
  .right-seq {
    object-fit: contain;
    position: absolute;
    right: 30px;
    top: 82px;
    z-index: -1;
    height: 66px !important;
    width: 66px !important;
  }
  .dropright-lg > .dropdown-menu {
    top: auto;
    margin-top: 6px;
    margin-right: 0px;
    left: auto !important;
    right: 0px !important;
  }
  .hero-section {
    height: 330px;
    background-position: center;
  }
  .nothing-padding {
    height: 155px;
  }
  .ticket-box {
    margin-bottom: 12px;
  }
  .each-ticket {
    display: flex;
    flex-direction: column;
    text-align: center;
    align-items: center;
    justify-content: center;
    height: 100px;
    border-radius: 4px;
  }
  .selector-filter {
    height: 45px;
    margin-top: 6px;
    margin-left: 6px;
    font-size: 12px;
    width: 100%;
  }
  .sidebar {
    width: 70px;
  }
  .collpse-content {
    display: none;
  }
  .panel-boxes {
    display: flex;
    flex-direction: column;
    height: 82px;
    padding: 5px;
    text-align: center;
    justify-content: center;
  }
  .ticket-title {
    font-size: 10px;
    font-weight: normal;
    margin: 4px 0px;
  }
  .each-ticket h6 {
    color: #ccc;
    font-size: 10px;
  }
  .icon-panel {
    height: 50px;
    width: 50px;
    padding: 5px;
    background-color: #191919;
    border-radius: 50%;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    object-fit: cover;
    margin-left: 0px;
  }
  .nm-box {
    font-weight: normal;
    font-size: 12px;
    text-align: center;
    margin-top: 10px;
  }
  .minicaption-box {
    display: none;
  }
  .in-rights {
    padding-right: 68px;
    direction: rtl;
    display: flex;
    justify-content: end !important;
    transition: all ease-in-out 0.5s;
  }
  .in-rights {
    padding-right: 68px;
    direction: rtl;
    display: flex;
    justify-content: end !important;
    transition: all ease-in-out 0.5s;
  }
  .ticket-icm {
    height: 42px;
  }
  .dropright-lg > .dropdown-menu {
    top: auto;
    margin-top: 6px;
    margin-right: 0px;
    left: auto !important;
    padding: 2px;
    right: 0px !important;
    border: none;
  }
}
/*
    iphone 
    8,X,XS,11,12
    */
@media only screen and (min-width: 1461px) and (max-width: 1550px) {
  .some-dis {
    margin-left: 150px;
  }
}
@media only screen and (min-width: 1460px) {
  .max {
    /* max-width: 1600px; */
    margin-top: 0px;
  }
  .second-hidden {
    display: none !important;
  }
  /* min  */
}
@media only screen and (min-width: 1347px) and (max-width: 1366px) {
  .max {
    /*     max-width: 1350px;*/
    margin-top: 0px;
  }
  .second-hidden {
    display: none !important;
  }
}
@media only screen and (min-width: 1536px) and (max-width: 1600px) {
  .hidden-image {
    display: hidden !important;
    display: none !important;
  }
}
.white-links {
  color: #fff;
}

@media screen and (min-width: 1400px) {
  .hidden-image {
    display: hidden !important;
    display: none !important;
  }
}
@media screen and (min-width: 1600px) {
  .hidden-image {
    display: hidden !important;
    display: none !important;
  }
}
@media screen and (min-width: 1920px) {
  .hidden-image {
    display: hidden !important;
    display: none !important;
  }
}
@media only screen and (min-width: 120.063em) {
  .hidden-image {
    display: hidden !important;
    display: none !important;
  }
}
.second-slider-type {
  padding: 0px;
  margin-bottom: 20px;
}

.shope-carousle {
  padding-left: 5px;
  padding-right: 5px;
}

.so-little {
  margin-bottom: 10px;
}

.side-shop {
  padding-right: 0px;
}

@media (max-width: 575px) {
  .drop-chevron {
    color: #363636;
    margin-right: 15px;
    margin-left: 15px;
    font-size: 8px !important;
  }
  .right-bs {
    padding-left: 5px;
  }
  .left-bs {
    padding-right: 5px;
  }
  .blog-wroter .shope-carousle {
    padding-left: 0px;
    padding-right: 0;
  }
  .capt-header {
    font-size: 16px;
  }
  .sett-carousel-height {
    height: 400px;
    object-fit: cover;
  }
  .caption-sp {
    color: #ffffff;
    font-size: 14px;
    margin-top: 10px;
  }
  .sett-carousel-height img {
    height: 400px;
    width: 100%;
    object-fit: cover;
  }
  .shope-carousle {
    padding-left: 0px;
    padding-right: 0px;
  }
  .num-searcjing {
    font-size: 12px;
  }
  .txt-res {
    font-size: 11px;
    font-weight: 500;
  }
  .side-shop {
    padding-right: 3px;
    padding-left: 3px;
  }
}
label {
  display: block;
  margin-bottom: 5px;
}

input:focus {
  border: 2px solid #f2796e;
}

.question {
  font-size: 15px;
}

.success-icon,
.failure-icon {
  opacity: 0;
}

.failure-icon,
.error {
  color: red;
}

.success-icon {
  color: green;
  left: 22px;
  position: absolute;
  top: 18px;
}

.failure-icon {
  position: absolute;
  top: 60px;
  right: 10px;
}

.error {
  font-size: 14px;
  margin-top: 10px;
}

.i-put {
  position: absolute;
  top: 17px;
  right: 20px;
}

@media (max-width: 900px) {
  .container {
    flex-direction: column;
  }
  form,
  .content {
    width: 100%;
  }
}
@media (max-width: 425px) {
  form {
    padding: 20px;
  }
}
input:active {
  color: #000;
}

.clear {
  clear: both;
}

.validation-summary-errors ul li {
  font-weight: 600;
}

.success-alert {
  padding: 10px;
  border-radius: 10px;
  margin-bottom: 15px;
  background-color: #c5ffde;
  display: flex;
  align-items: flex-start;
}
.success-alert i {
  font-size: 16px;
  color: #13701f;
}
.success-alert .succes-alert-p {
  display: flex;
  align-items: center;
}
.success-alert strong {
  margin-right: 5px;
  font-size: 0.9rem;
  color: #13701f;
  margin-top: 2px;
}
.success-alert .login-links a {
  margin-top: 0.5rem;
  font-size: 0.9rem;
  color: #000;
  padding: 2px 8px;
  background: #fff;
  border-radius: 4px;
}

.warrning-alert {
  padding: 10px;
  border-radius: 10px;
  margin-bottom: 15px;
  background-color: rgba(255, 0, 0, 0.168627451);
  display: flex;
  align-items: center;
}
.warrning-alert i {
  font-size: 20px;
  color: #b1003c;
}
.warrning-alert strong {
  margin-right: 5px;
  font-size: 15px;
  color: #b1003c;
  margin-top: 2px;
}

.error-field {
  padding-right: 15px;
  display: block;
  margin-top: 8px;
  color: #b1003c;
  font-weight: 500;
}

.paragraph-txt {
  color: #000;
  font-size: 14px;
  margin-bottom: 30px;
  padding-right: 20px;
  font-weight: 500;
}

.all-courses-view {
  padding: 0px 6px;
  color: #9876ff;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 250px;
}

.all-courses-view span {
  font-weight: normal;
}

.all-courses-view img {
  height: 16px;
  margin-right: 18px;
}

.all-inone {
  display: flex;
  justify-content: space-between;
  align-items: center;
  direction: rtl;
  margin-top: 20px;
  margin-bottom: 20px;
}

.all-courses-view:hover {
  color: #9540e6;
}

.right-div {
  direction: rtl;
}

.header-title {
  font-size: 12px;
}

.so-pill {
  padding: 0px 20px;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
}

.bordering-hill {
  min-height: 40px;
  display: flex;
  align-items: center;
  padding-bottom: 10px;
  font-size: 12px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.048);
}

.nw-course {
  padding: 5px 20px;
  background-color: rgb(152, 118, 255);
  box-shadow: rgba(129, 0, 250, 0.09) 0px 2px 12px;
  color: rgb(0, 0, 0);
  font-weight: normal;
}

.bordering-hill p {
  font-size: 12px;
  color: #fff;
}

.nw-course:hover {
  color: #fff;
}

.all-ilove {
  direction: rtl;
  display: flex;
  margin-top: 30px;
}

.all-ilove .cart-wrappering {
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0px 0px 4px 0 rgba(0, 0, 0, 0.17);
}

.form-field.error input {
  border-color: var(--error-color);
}

.form-field.success input {
  border-color: var(--success-color);
}

.so-pill {
  border-bottom: 1px solid rgba(152, 118, 255, 0.2196078431);
}

.form-field small {
  color: var(--error-color);
}

.colorfull {
  color: #fff;
}

.form-acc {
  direction: rtl;
  margin-top: 20px;
  padding-top: 30px;
  border-top: 1px solid rgb(152, 118, 255);
}

.form-acc input {
  border-radius: 6px;
  color: #fff;
  background: #090909;
}

.form-acc textarea {
  width: 100%;
  color: #fff;
  padding: 20px;
  border-radius: 6px;
  border: 1px solid rgb(24, 13, 40);
  background: #090909;
}

.btn-submited {
  color: #fff;
  width: max-content;
  border: 2px solid transparent;
}

.setting-padd {
  padding: 10px 20px;
}

.d-none {
  display: none;
}

.re-color {
  color: #000 !important;
  padding-right: 20px;
}

.sett-centeral {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.btn-submited:hover {
  background-color: rgb(225, 174, 255);
  border: 2px solid rgb(225, 174, 255);
  box-shadow: none !important;
  color: #000 !important;
  transition: background linear 0.5s;
}

#wrapper {
  padding-left: 0;
  transition: all 0.5s ease;
  position: relative;
  /* padding: 0px; */
}

#sidebar-wrapper {
  z-index: 4;
  position: absolute;
  right: 250px;
  width: 0;
  height: 100%;
  margin-right: -250px;
  overflow-y: auto;
  overflow-x: hidden;
  background: #090909;
  transition: all 0.5s ease;
  border-bottom-left-radius: 0px;
  margin-top: 0px;
  border-bottom-left-radius: 8px;
}

.form-log input {
  border-radius: 30px;
  color: #fff !important;
}

.form-log input::placeholder {
  font-size: 12px;
}

.form-log button {
  height: 50px;
}

#wrapper.toggled #sidebar-wrapper {
  width: 250px;
  transition: all 0.5s ease;
}

.sidebar-brand {
  position: absolute;
  top: 0;
  width: 250px;
  text-align: center;
  padding: 20px 0;
  margin-bottom: 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-evenly;
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  border-bottom: 1px solid rgba(20, 20, 20, 0.26);
  transition: all ease-in-out 0.5s;
}

.sidebar-brand h2 {
  margin: 0;
  font-weight: normal;
  font-size: 24px;
  color: #fff;
}

.sidebar-nav > li {
  text-indent: 10px;
  line-height: 42px;
  max-width: 100%;
  overflow: hidden;
}

.sidebar-nav {
  position: absolute;
  top: 132px;
  width: 265px;
  margin: 0;
  padding: 0;
  list-style: none;
  margin-top: 40px;
}

.sidebar-nav > li {
  text-indent: 10px;
  line-height: 42px;
}

.sidebar-nav > li a {
  display: block;
  text-decoration: none;
  color: #757575;
  font-weight: normal;
  font-size: 14px;
  padding-right: 35px;
}

.sidebar-nav > li > a:hover,
.sidebar-nav > li.active > a {
  text-decoration: none;
  color: rgb(9, 9, 9);
  background: rgb(152, 118, 255);
}

.sidebar-nav > li > a:hover,
.sidebar-nav > li.active > a i.fa {
  text-decoration: none;
  color: #000;
}

.sidebar-nav > li > a i.fa {
  font-size: 18px;
  width: 60px;
  float: right;
  color: #cfbfff;
}

#navbar-wrapper {
  width: 100%;
  position: absolute;
  z-index: 2;
}

#wrapper.toggled #navbar-wrapper {
  position: absolute;
  margin-right: -250px;
}

#navbar-wrapper .navbar {
  font-size: 24px;
  margin-bottom: 0;
  border-radius: 0;
}

#navbar-wrapper .navbar a {
  color: #673ab7;
  color: #a271f8;
  margin-top: 20px;
  background: rgba(218, 194, 244, 0.2196078431);
  padding: 10px 12px;
  border-radius: 50%;
}

#navbar-wrapper .navbar a:hover {
  color: #f8be12;
}

#navbar-wrapper .navbar a img {
  height: 25px;
}

#content-wrapper {
  width: 100%;
  position: absolute;
  top: 100px;
  transition: all linear 0.5s;
  margin-top: 10px;
}

#wrapper.toggled #content-wrapper {
  position: absolute;
  margin-right: -250px;
}

.in-rights {
  padding-right: 285px;
  direction: rtl;
  display: flex;
  justify-content: start !important;
  transition: all ease-in-out 0.5s;
}

.cart-page-banner {
  height: 400px;
  background-color: #ccc;
  background-image: url(/assets/images/header/5515541.webp);
  background-size: cover;
}

@media (min-width: 992px) {
  #wrapper {
    padding-left: 0px;
    transition: ease-in-out 0.5s;
    padding-left: 0px;
    transition: ease-in-out 0.5s;
    width: 1528px;
    overflow: hidden;
    margin: auto;
  }
  #wrapper.toggled {
    padding-left: 60px;
  }
  #sidebar-wrapper {
    width: 258px;
  }
  #wrapper.toggled #sidebar-wrapper {
    width: 75px;
  }
  #wrapper.toggled .sidebar-nav > li > a i.icon-dashboard {
    font-size: 18px;
    width: 75px;
    float: left;
  }
  #wrapper.toggled .sidebar-nav > li > a i.fa {
    font-size: 18px;
    width: 75px;
    float: left;
  }
  #wrapper.toggled #navbar-wrapper {
    position: absolute;
    margin-right: -190px;
  }
  #wrapper.toggled #content-wrapper {
    position: absolute;
    margin-right: -190px;
  }
  #navbar-wrapper {
    position: relative;
  }
  #wrapper.toggled {
    padding-left: 0px;
    transition: all linear 0.5s;
  }
  #wrapper.toggled .in-rights {
    padding-right: 100px;
    transition: all linear 0.5s;
  }
  #wrapper.toggled .this-panel {
    margin-right: 0px;
  }
  #content-wrapper {
    position: relative;
    top: 0;
  }
  #wrapper.toggled #navbar-wrapper,
  #wrapper.toggled #content-wrapper {
    position: relative;
    margin-right: 60px;
  }
  #wrapper.toggled .sidebar-brand {
    position: absolute;
    top: 0px;
    width: 250px;
    text-align: center;
    padding: 20px 12px;
    margin-bottom: 0px;
    flex-direction: column;
    display: flex;
    align-items: flex-start;
    justify-content: space-evenly;
    border-bottom: 1px solid rgba(20, 20, 20, 0.26);
  }
  #wrapper.toggled .name-pcl {
    display: none;
  }
  #wrapper.toggled .panel-uimg {
    height: 50px;
    width: 50px;
    border-radius: 50%;
    object-fit: cover;
    background: #eee;
    border: 2px solid #eee;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 2px 8px 4px 0 rgb(0, 0, 0);
    margin-bottom: 20px;
  }
  #wrapper.toggled .sidebar-nav {
    position: absolute;
    top: 132px;
    width: 265px;
    margin: 0;
    padding: 0;
    list-style: none;
    margin-top: 0px;
  }
  .sidebar-nav > li a {
    text-align: right;
  }
  #wrapper.toggled .sidebar-nav > li a {
    text-align: left;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .drop-chevron {
    color: #363636;
    margin-right: 15px;
    margin-left: 15px;
    font-size: 8px !important;
  }
  #wrapper {
    padding-left: 60px;
  }
  #sidebar-wrapper {
    width: 60px;
  }
  #wrapper.toggled .sidebar-nav > li > a i.icon-dashboard {
    font-size: 18px;
    width: 75px;
    float: left;
  }
  #wrapper.toggled .sidebar-nav > li > a i.fa {
    font-size: 18px;
    width: 75px;
    float: left;
  }
  #wrapper.toggled #navbar-wrapper {
    position: absolute;
    margin-right: -250px;
  }
  #wrapper.toggled #content-wrapper {
    position: absolute;
    margin-right: -250px;
  }
  #navbar-wrapper {
    position: relative;
  }
  #wrapper.toggled {
    padding-right: 0px;
  }
  #content-wrapper {
    position: relative;
    top: 0;
  }
  #wrapper.toggled #navbar-wrapper,
  #wrapper.toggled #content-wrapper {
    position: relative;
    margin-right: 250px;
  }
  .this-panel {
    padding: 40px 20px;
    border-radius: 8px;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    margin-right: 80px;
    min-height: 100vh;
    text-align: right;
    transition: all ease-in-out 0.5s;
  }
  .stranger-padding {
    padding: 0px 40px;
  }
  #wrapper {
    padding-left: 0px;
  }
  #sidebar-wrapper {
    width: 68px;
  }
  .sidebar-nav > li > a i.fa {
    float: left;
  }
  .in-rights {
    padding-right: 80px;
    direction: rtl;
    display: flex;
    justify-content: start !important;
    transition: all ease-in-out 0.5s;
  }
  .panel-boxes {
    display: flex;
    flex-direction: column;
    height: 100px;
    padding: 5px;
    text-align: center;
    justify-content: center;
  }
  .icon-panel {
    height: 50px;
    width: 50px;
    padding: 5px;
    background-color: #191919;
    border-radius: 50%;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    object-fit: cover;
    margin-left: 0px;
  }
  .nm-box {
    font-weight: normal;
    font-size: 12px;
    text-align: center;
    margin-top: 10px;
  }
  .minicaption-box {
    display: none;
  }
  .sidebar-nav > li a {
    display: block;
    text-decoration: none;
    font-weight: normal;
    font-size: 14px;
    text-align: left;
    padding-right: 35px;
  }
}
@media (max-width: 767px) {
  #wrapper {
    padding-left: 0;
  }
  #sidebar-wrapper {
    width: 68px;
  }
  #wrapper.toggled .sidebar-nav > li > a i.icon-dashboard {
    font-size: 18px;
    width: 75px;
    float: left;
  }
  #wrapper.toggled .sidebar-nav > li > a i.fa {
    font-size: 18px;
    width: 75px;
    float: left;
  }
  #wrapper.toggled #sidebar-wrapper {
    width: 250px;
  }
  #wrapper.toggled #navbar-wrapper {
    position: absolute;
    margin-right: -250px;
  }
  .sidebar-nav > li > a i.fa {
    float: left;
  }
  #wrapper.toggled #content-wrapper {
    position: absolute;
    margin-right: -250px;
  }
  #navbar-wrapper {
    position: relative;
  }
  #wrapper.toggled {
    padding-left: 0px;
  }
  #content-wrapper {
    position: relative;
    top: 0;
  }
  .this-panel {
    margin-right: 75px;
  }
  #wrapper.toggled .this-panel {
    margin-right: 75px;
  }
  #wrapper.toggled #navbar-wrapper,
  #wrapper.toggled #content-wrapper {
    position: relative;
    margin-right: 250px;
  }
}
.in-rights {
  padding-right: 285px;
  direction: rtl;
  display: flex;
  justify-content: start !important;
  transition: all ease-in-out 0.5s;
}

.sidebar-nav > li > a i.icon-dashboard {
  font-size: 18px;
  width: 75px;
  float: right;
}

.mini-banner-side {
  height: 100px;
  width: 100%;
  border-radius: 6px;
  object-fit: cover;
  margin: 25px 0px;
  transition: all linear 0.4s;
}

.mini-banner-side img {
  height: 100%;
  width: 100%;
  border-radius: 6px;
  object-fit: cover;
}

.minicaption-box {
  margin-top: 5px;
  font-size: 10px;
  height: 37px;
  color: #fff;
  line-height: 20px;
  overflow: hidden;
}

.mini-banner-side:hover img {
  filter: grayscale(0.4);
}

.panel-uimg {
  height: 80px;
  width: 80px;
  border-radius: 50%;
  object-fit: cover;
  background: #eee;
  border: 6px solid #eee;
  -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 2px 8px 4px 0 rgb(0, 0, 0);
  margin-bottom: 20px;
}

.panel-uimg img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.name-pcl {
  color: #fff;
  font-size: 14px;
}

.ordering-title {
  font-size: 14px;
  color: #fff;
  text-align: right;
}

.order-cp {
  font-size: 12px;
  color: #fff;
}

.wrapp-alls {
  margin-top: 30px;
}

.pay-it {
  color: #0a7946 !important;
  font-weight: normal;
}

.num-cl {
  color: #fff;
}

.pay-not {
  color: #fc6400 !important;
  font-weight: normal;
}

.head-table {
  background-color: #510678;
}

.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > thead > tr > th {
  padding: 8px;
  line-height: 1.42857143;
  vertical-align: middle;
  border-top: 1px solid #090909;
}

tr:hover {
  background-color: #000;
}

.right-ik {
  direction: rtl;
}

.table thead th {
  border-bottom: 2px solid #090909;
}

@media only screen and (max-width: 480px) {
  .error-404 .error-404-404 {
    height: 122px;
    line-height: 122px;
  }
  .error-404 .error-404-404 h1 {
    font-size: 85px;
  }
  .error-404 h2 {
    font-size: 18px;
  }
  .error-404 p {
    font-size: 14px;
  }
  #error-404 .error-404 {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    padding: 35px;
  }
}
@media only screen and (min-width: 1460px) {
  .max {
    /* max-width: 1600px; */
    margin-top: 0px;
  }
  .social-teams {
    top: 39%;
    z-index: 1;
  }
}
@media only screen and (min-width: 1600px) and (max-width: 8000px) {
  .second-hidden,
  .social-teams {
    display: none;
    background: none !important;
    box-shadow: none !important;
  }
}
@media only screen and (min-width: 1460px) {
  .box-style:hover::before,
  .box-style:hover::after {
    width: 100%;
    height: 100%;
  }
  .max {
    /*    max-width: 1320px;*/
    margin-top: 20px;
  }
  .open-menu {
    position: fixed;
    top: 20px;
    left: 2017px;
    z-index: 99997;
    box-shadow: 3px 3px 3px rgba(51, 51, 51, 0.2);
  }
  .panel-menu {
    position: fixed;
    top: 20px;
    right: 2017px;
    z-index: 99997;
    box-shadow: 3px 3px 3px rgba(51, 51, 51, 0.2);
  }
  .sidebar.active {
    left: 2017px;
  }
  .nice-gradient {
    height: 100%;
  }
  .box-style:before {
    bottom: -1px;
    right: 0px;
    border-bottom: 2px solid #6c757d;
    border-right: 2px solid #6c757d;
  }
  .setting-padding {
    padding: 0px 40px;
  }
}
@media only screen and (min-width: 1347px) and (max-width: 1366px) {
  .max {
    /* max-width: 1350px;*/
    margin-top: 20px;
  }
  .img-slide {
    width: 1349px !important;
  }
}
@media only screen and (min-width: 1300px) and (max-width: 1346px) {
  .img-slide {
    width: 1300px !important;
    margin-top: 20px;
  }
  .second-hidden {
    display: none;
  }
}
@media only screen and (min-width: 1201px) and (max-width: 1025px) {
  .second-hidden {
    display: none;
  }
  .name-blog {
    height: 100px;
  }
}
@media only screen and (min-width: 1201px) and (max-width: 1025px) {
  .second-hidden {
    display: none;
  }
}
@media only screen and (min-width: 1301px) and (max-width: 1335px) {
  .second-hidden {
    display: none;
  }
}
.image-add-caption {
  font-size: 18px;
  direction: rtl;
  text-align: justify;
}

@media only screen and (min-width: 1201px) and (max-width: 1025px) {
  .second-hidden {
    display: none;
  }
}
@media only screen and (min-width: 1347px) and (max-width: 1366px) {
  .max {
    /*     max-width: 1350px;*/
    margin-top: 0px;
  }
}
@media only screen and (min-width: 1201px) and (max-width: 1280px) {
  header .desk-menu .menu-container {
    float: right;
    justify-content: normal;
    flex-direction: column;
  }
  .bordering-hill {
    max-width: 100%;
    overflow: hidden;
    padding: 5px;
    font-size: 12px;
  }
  .header-title {
    font-size: 10px;
  }
  .bordering-hill p {
    font-size: 10px;
  }
  .in-rights {
    padding-right: 285px;
    direction: rtl;
    display: flex;
    transition: all 0.5s ease-in-out 0s;
    justify-content: end !important;
  }
  .sidebar-brand {
    position: absolute;
    top: 0;
    width: 250px;
    text-align: center;
    padding: 20px 12px;
    margin-bottom: 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    display: flex;
    align-items: flex-start;
    justify-content: space-evenly;
    border-bottom: 1px solid rgba(20, 20, 20, 0.26);
    align-content: flex-start;
  }
  .panel-uimg {
    height: 45px;
    width: 45px;
    border-radius: 50%;
    object-fit: cover;
    background: #eee;
    border: 2px solid #eee;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 2px 8px 4px 0 rgb(0, 0, 0);
    margin-bottom: 20px;
  }
  .name-pcl {
    color: #fff;
    display: none;
  }
  .sidebar-nav {
    margin-top: 30px;
  }
  .sidebar-brand {
    position: absolute;
    top: 0;
    width: 250px;
    text-align: center;
    padding: 20px 12px;
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid rgba(20, 20, 20, 0.26);
    align-content: flex-start;
  }
  #wrapper.toggled .sidebar-brand {
    position: absolute;
    top: 0;
    width: 250px;
    text-align: center;
    padding: 20px 12px;
    margin-bottom: 40px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    border-bottom: 1px solid rgba(20, 20, 20, 0.26);
    align-content: flex-start;
  }
  .panel-uimg {
    height: 80px;
    width: 80px;
    border-radius: 50%;
    object-fit: cover;
    background: #eee;
    border: 2px solid #eee;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 2px 8px 4px 0 rgb(0, 0, 0);
    margin-bottom: 20px;
  }
  .name-pcl {
    display: block;
  }
  .nm-box {
    font-size: 10px;
  }
  .nc-cart {
    font-size: 10px;
    max-width: 280px;
    overflow: hidden;
  }
}
/*ipod pro */
@media (max-width: 991px) {
  .new-way > form {
    display: flex;
    justify-content: center;
  }
  .right-design {
    display: none;
  }
  .new-courses .w-sugestion {
    font-size: 1rem;
    text-align: right;
  }
  .new-courses .see-sugestion {
    font-size: 0.8rem;
    font-weight: 800;
    color: #14003b;
  }
  .banner-row {
    padding: 0 20px;
  }
  .mb-margin {
    margin-top: 15px !important;
  }
  .np-row {
    width: 100vw;
    overflow: hidden;
  }
  .centeral-one {
    width: 100vw;
  }
  .content-title h3 {
    margin-bottom: 15px;
    font-size: 18px;
  }
  .reasearcher img {
    position: absolute;
    height: 210px;
    top: -174px;
  }
  header {
    height: 80px;
  }
  .header .item-center {
    flex: 0 0 55% !important;
  }
  .navbar-padding {
    padding: 0px 20px;
    height: 82px;
  }
  .stranger-padding {
    padding: 0px 40px;
  }
  .editable-user {
    text-align: center;
    padding: 0px 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .editable-user {
    text-align: center;
    padding: 0px 30px;
  }
  .logo {
    height: 60px;
    width: 85px;
    object-fit: cover;
    padding: 10px;
  }
  .header {
    padding-left: 10px;
  }
  .stranger-padding {
    padding: 0px 40px;
  }
  .bordering-hill {
    max-width: 100%;
    overflow: hidden;
    padding: 5px;
    font-size: 12px;
  }
  .header-title {
    font-size: 10px;
  }
  .in-rights {
    padding-right: 285px;
    direction: rtl;
    display: flex;
    transition: all 0.5s ease-in-out 0s;
    justify-content: end !important;
  }
  #wrapper.toggled .this-panel {
    margin-right: 70px;
  }
  .nc-cart {
    font-size: 10px;
    max-width: 260px;
    overflow: hidden;
  }
  header .desk-menu .menu-container {
    float: right;
    justify-content: normal;
    flex-direction: column;
  }
  .a-girl {
    height: 110px;
    width: 160px;
    object-fit: contain;
    position: relative;
  }
  .a-girl img {
    height: 100%;
    width: 100%;
    object-fit: contain;
    position: absolute;
    top: -77px;
  }
  .height-lower {
    height: 0px;
    display: flex;
    flex-direction: row-reverse;
    padding: 0px 50px;
  }
  .coontaact-us {
    text-align: center;
    color: #fff;
    font-size: 14px;
  }
  .social-content h6 {
    font-size: 10px;
    color: #fff;
    font-family: LilitaOne;
    font-weight: 400;
    margin-bottom: 0px;
  }
  .wrapp-sociality div a {
    display: flex;
    justify-content: center;
    height: 60px;
    border-radius: 10px;
    padding: 15px;
    align-items: center;
    flex-direction: column;
  }
  .social-content a i {
    font-size: 14px;
    color: #fff;
    margin-left: 0px;
  }
  .wrapp-payment-btn h4 {
    font-size: 14px;
    padding: 0px 10px;
  }
}
/* ipod */
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .a-girl {
    height: 110px;
    width: 160px;
    object-fit: contain;
    position: relative;
  }
  .wrapp-payment-btn h4 {
    font-size: 14px;
    padding: 0px 10px;
  }
  .a-girl img {
    height: 100%;
    width: 100%;
    object-fit: contain;
    position: absolute;
    top: -77px;
  }
  .height-lower {
    height: 0px;
    display: flex;
    flex-direction: row-reverse;
    padding: 0px 50px;
  }
  .coontaact-us {
    text-align: center;
    color: #fff;
    font-size: 14px;
  }
  .social-content h6 {
    font-size: 10px;
    color: #fff;
    font-family: LilitaOne;
    font-weight: 400;
    margin-bottom: 0px;
  }
  .wrapp-sociality div a {
    display: flex;
    justify-content: center;
    height: 60px;
    border-radius: 10px;
    padding: 15px;
    align-items: center;
    flex-direction: column;
  }
  .social-content a i {
    font-size: 14px;
    color: #fff;
    margin-left: 0px;
  }
  .wrapp-sociality div {
    width: 70%;
    margin: 2px;
  }
  .box-ac {
    height: 169px;
    width: 125px;
    background-color: rgb(25, 25, 25);
    border-radius: 6px;
    margin: 39px 1px 0px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: rgba(0, 0, 0, 0.18) 0px 1px 0px 0px, rgba(0, 0, 0, 0.15) 0px 4px 15px 0px !important;
  }
  .nb-wrap a {
    color: #fff;
    font-size: 12px;
    line-height: 20px;
  }
  .nc-black {
    color: #fff;
    margin-bottom: 10px;
    font-size: 12px;
  }
  .teacher-n {
    font-size: 12px;
  }
  .tc-n {
    font-size: 12px;
  }
  .c-name {
    text-align: right;
    padding: 0px 20px;
    min-width: 250px;
  }
  .remove-course {
    width: 28px;
    height: 28px;
    padding: 8px;
    background-color: rgb(223, 174, 252);
    border: none;
    text-align: center;
    margin-right: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    cursor: pointer;
  }
  .custom_radio input[type=radio] + label {
    position: relative;
    display: inline-block;
    padding-left: 0em;
    margin-right: 1em;
    line-height: 1em;
    font-size: 10px;
  }
  .custom_radio {
    margin: 20px 12px;
  }
  .capt-title {
    font-weight: normal;
    font-size: 12px;
  }
  .des-title {
    font-size: 10px;
  }
  .units {
    font-size: 10px;
  }
  .remove-course i {
    font-size: 12px;
  }
  .row-input {
    display: flex;
    flex-direction: row;
  }
  .offer-input {
    width: 60% !important;
    height: 40px;
  }
  .offer-btn {
    height: 40px;
  }
  .a-capt {
    margin-right: 20px;
  }
  .gray-all {
    margin-top: 0px;
  }
  .mini-capt {
    text-align: right;
    margin-right: 10px !important;
    color: rgb(255, 255, 255);
    margin-top: 0px;
  }
  .right-decore img {
    height: 550px;
    position: absolute;
    right: 10px;
    opacity: 0.5;
  }
  .left-decore img {
    height: 300px;
    position: absolute;
    left: 10px;
    opacity: 0.5;
  }
  .sun-icon-wrapper {
    position: absolute;
    height: 23px;
    width: 23px;
    opacity: 1;
    transform: translate(7px, 6px) rotate(15deg);
    transform-origin: 50% 50%;
    transition: opacity 150ms, transform 500ms cubic-bezier(0.26, 2, 0.46, 0.71);
  }
  .moon-icon {
    position: absolute;
    height: 23px;
    width: 23px;
    color: rgb(255, 255, 255);
  }
  .left-seq img {
    height: 100%;
    width: 100%;
    object-fit: contain;
    position: absolute;
    height: 80px !important;
    width: 80px !important;
    left: -135px;
    top: 50px;
    z-index: -1;
    animation: mover 1.5s infinite alternate;
  }
  .only-laptop img {
    height: 100%;
    width: 100%;
    object-fit: contain;
    z-index: 1;
    position: absolute;
    animation: mover-laptop 2s infinite alternate;
    right: 130px;
  }
  .laptop-shadow {
    display: none;
  }
  .cactus-area {
    height: 100px;
    width: 100px;
    object-fit: contain;
    position: absolute;
    right: 0px;
    bottom: 10px;
  }
  .right-seq {
    object-fit: contain;
    position: absolute;
    right: 16px;
    z-index: -1;
    height: 70px !important;
    width: 70px !important;
  }
  .re-margin {
    margin: 0px;
    padding: 15px 25px;
  }
  .caption-hro {
    font-size: 12px;
    margin-top: 10px;
    margin-bottom: 10px;
    line-height: 28px;
    color: rgb(255, 255, 255);
    text-align: center;
    padding: 10px 70px;
  }
  .submitimng-ico {
    display: none;
  }
  .submitting {
    padding: 3px 8px;
    text-align: center;
    background: transparent;
    color: #fff !important;
    font-size: 17px;
    font-weight: 500;
    border-radius: 6px;
    color: #fff;
  }
  .submitting a i {
    color: #fff;
  }
  .search-box-holder {
    z-index: 1;
    margin-left: 0px;
    padding-left: 5px;
  }
  .search-box-holder i {
    color: #fff;
  }
  .filter-box {
    padding-left: 10px;
  }
  .mobile {
    height: 150px;
    width: 85px;
    object-fit: contain;
    position: absolute;
    top: -80px;
    left: -130px;
  }
  .bi-hold {
    background-color: rgb(35, 35, 35);
    height: 35px;
    width: 52px;
    border: 2px solid #232323;
    object-fit: cover;
    border-radius: 50%;
    margin-left: 20px;
    width: 13%;
  }
  .ico-collapse {
    font-size: 14px;
  }
  .blog-intro {
    line-height: 24px;
    font-size: 14px;
    height: 72px;
    overflow: hidden;
    display: flex;
    align-items: center;
    color: rgb(255, 255, 255);
  }
  .blog-caption {
    text-align: right;
    font-size: 10px;
    height: 85px;
    line-height: 20px;
    overflow: hidden;
    color: #fff;
  }
  header .desk-menu .menu-container {
    float: right;
    justify-content: normal;
    flex-direction: column;
  }
  .search-btn i {
    margin-left: 5px;
  }
  .list-unstyled {
    padding-right: 0px;
    padding-left: 0px;
    list-style: none;
    padding: 0px;
  }
  .po-color {
    color: #fff !important;
    font-size: 24px !important;
  }
  .search-btn {
    font-size: 18px;
    display: inline-block;
    margin-bottom: 0px;
    color: #ffffff;
  }
  .bordering-hill {
    max-width: 100%;
    overflow: hidden;
    padding: 5px;
    font-size: 12px;
  }
  .header-title {
    font-size: 10px;
  }
  .in-rights {
    padding-right: 285px;
    direction: rtl;
    display: flex;
    transition: all 0.5s ease-in-out 0s;
    justify-content: end !important;
  }
  .sidebar-brand {
    position: absolute;
    top: 0;
    width: 250px;
    text-align: center;
    padding: 20px 12px;
    margin-bottom: 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    display: flex;
    align-items: flex-start;
    justify-content: space-evenly;
    border-bottom: 1px solid rgba(20, 20, 20, 0.26);
    align-content: flex-start;
  }
  .panel-uimg {
    height: 45px;
    width: 45px;
    border-radius: 50%;
    object-fit: cover;
    background: #eee;
    border: 2px solid #eee;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 2px 8px 4px 0 rgb(0, 0, 0);
    margin-bottom: 20px;
  }
  .name-pcl {
    color: #fff;
    display: none;
  }
  #wrapper.toggled .sidebar-nav {
    margin-top: 50px;
  }
  #wrapper.toggled .sidebar-brand {
    position: absolute;
    top: 0;
    width: 250px;
    text-align: center;
    padding: 20px 12px;
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid rgba(20, 20, 20, 0.26);
    align-content: flex-start;
  }
  #wrapper.toggled .panel-uimg {
    height: 80px;
    width: 80px;
    border-radius: 50%;
    object-fit: cover;
    background: #eee;
    border: 2px solid #eee;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 2px 8px 4px 0 rgb(0, 0, 0);
    margin-bottom: 20px;
  }
  #wrapper.toggled .name-pcl {
    display: block;
  }
  .nm-box {
    font-size: 10px;
  }
  .logo {
    height: 50px;
    width: 50px;
    object-fit: cover;
    padding: 0px;
    position: relative;
    right: 65px;
  }
  .svg-course {
    display: none;
  }
  .navbar-padding {
    padding: 0px 30px;
    height: 82px;
  }
  .avatar {
    position: relative;
    display: flex;
    align-items: center;
    width: 62px;
    height: 30px;
    font-size: 1rem;
    justify-content: center;
    margin-right: 10px;
    margin-top: 15px;
    text-align: center;
    background: #9876ff;
    border-radius: 6px;
    box-shadow: rgb(39, 39, 39) 0px 1px 1px -3px, rgba(0, 0, 0, 0.07) 1px 1px 3px 2px !important;
  }
  .caption-pc {
    display: none;
  }
  .nc-cart {
    font-size: 10px;
    max-width: 250px;
    overflow: hidden;
  }
  .this-panel > .col-lg-12 > .row > .col-lg-3 {
    padding: 8px;
  }
  .logo-track {
    height: 30px;
    width: 30px;
    object-fit: cover;
    margin-left: 28px;
    padding: 0px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .carousel-inner {
    width: 100%;
    overflow: hidden;
    height: 295px;
    object-fit: contain;
  }
  .carousel {
    padding: 0px;
  }
  .animation-bar {
    display: none;
  }
  .list-unstyled {
    padding: 0;
  }
  .btn-sc {
    display: none;
  }
  .submitting {
    padding: 3px 8px;
    text-align: center;
    background: transparent;
    color: #fff !important;
    font-size: 17px;
    font-weight: 500;
    border-radius: 6px;
    color: #fff;
  }
  .avatar {
    position: relative;
    display: flex;
    align-items: center;
    width: 62px;
    height: 30px;
    font-size: 1rem;
    justify-content: center;
    margin-right: 10px;
    margin-top: 15px;
    text-align: center;
    background: #9876ff;
    border-radius: 6px;
    box-shadow: rgb(39, 39, 39) 0px 1px 1px -3px;
  }
  .svg-course {
    display: none;
  }
  .logo a {
    width: 100%;
    object-fit: contain;
    padding: 8px 0px;
    margin-top: 2px;
    height: 65px !important;
  }
  .nm-cc {
    color: #fff;
    font-size: 10px;
  }
  .resume-heading {
    height: 200px;
    background-position: 0 0;
    background: center;
    background-size: cover;
  }
  .ec-btn {
    padding: 10px 13px;
    background: rgba(164, 133, 255, 0.145);
    display: flex;
    align-items: center;
    min-width: 90px;
    justify-content: space-around;
    border-radius: 4px;
    border: 1px solid rgba(1, 1, 2, 0.145);
    margin: 10px 2px;
  }
  .into-top {
    margin-bottom: 0px;
    padding: 10px;
  }
  .cart-img {
    border-radius: 5px 5px 0px 0px;
    height: 150px;
    width: 100%;
    object-fit: cover;
  }
  .download-file {
    font-size: 12px;
    padding-right: 10px;
  }
  .course-description p {
    font-size: 12px;
  }
  .detail-fd {
    display: block;
    align-items: baseline;
    justify-content: space-between;
  }
  .bi-hold {
    background-color: rgb(35, 35, 35);
    height: 35px;
    width: 52px;
    border: 2px solid #232323;
    object-fit: cover;
    border-radius: 50%;
    margin-left: 20px;
    width: 13%;
  }
  .blog-caption {
    text-align: right;
    font-size: 10px;
    height: 85px;
    line-height: 20px;
    overflow: hidden;
    color: #fff;
  }
  .blog-intro {
    line-height: 24px;
    font-size: 14px;
    height: 72px;
    overflow: hidden;
    display: flex;
    align-items: center;
    color: rgb(255, 255, 255);
  }
  .po-color {
    color: #9876ff !important;
    font-size: 24px !important;
  }
  .nc-cart {
    font-size: 10px;
  }
  .nc-cart {
    font-size: 10px;
    max-width: 230px;
    overflow: hidden;
  }
  .ignore-padding {
    padding: 5px 10px;
  }
  .caption-pc {
    display: none;
  }
  .see-that {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    width: 30%;
  }
  .ic-img {
    width: 35%;
    height: 80px;
    object-fit: cover;
    border-radius: 4px;
  }
  .in-rights {
    padding-right: 285px;
    direction: rtl;
    display: flex;
    transition: all 0.5s ease-in-out 0s;
    justify-content: end !important;
  }
  .stranger-padding {
    padding: 0px 20px;
  }
  .in-rights {
    padding-right: 285px;
    direction: rtl;
    display: flex;
    justify-content: end !important;
    transition: all ease-in-out 0.5s;
  }
  .number-course {
    margin-left: 0px;
    font-weight: 700;
    font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  }
  .nw-course {
    padding: 5px 0px;
    font-size: 10px;
    background-color: rgba(129, 0, 250, 0.26);
    box-shadow: 0 2px 12px rgba(129, 0, 250, 0.1);
    color: rgb(20, 20, 20);
    font-weight: normal;
  }
  .bordering-hill {
    max-width: 100%;
    overflow: hidden;
    padding: 5px;
    font-size: 10px;
  }
  .header-title {
    font-size: 10px;
  }
  .bordering-hill p {
    font-size: 10px;
  }
  .btn-link span {
    color: #000;
    -webkit-text-fill-color: #000;
    font-size: 12px;
  }
  .all-courses-view img {
    height: 12px;
    margin-right: 18px;
  }
  .ico-collapse {
    font-size: 12px;
  }
  .sidebar-brand {
    position: absolute;
    top: 0;
    width: 250px;
    text-align: center;
    padding: 20px 12px;
    margin-bottom: 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    display: flex;
    align-items: flex-start;
    justify-content: space-evenly;
    border-bottom: 1px solid rgba(20, 20, 20, 0.26);
    align-content: flex-start;
  }
  .panel-uimg {
    height: 45px;
    width: 45px;
    border-radius: 50%;
    object-fit: cover;
    background: #eee;
    border: 2px solid #eee;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 2px 8px 4px 0 rgb(0, 0, 0);
    margin-bottom: 20px;
  }
  .name-pcl {
    color: #fff;
    display: none;
  }
  #wrapper.toggled .sidebar-nav {
    margin-top: 50px;
  }
  .name-pcl {
    font-size: 12px;
  }
  #wrapper.toggled .sidebar-brand {
    position: absolute;
    top: 0;
    width: 250px;
    text-align: center;
    padding: 20px 12px;
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid rgba(20, 20, 20, 0.26);
    align-content: flex-start;
  }
  #wrapper.toggled .panel-uimg {
    height: 80px;
    width: 80px;
    border-radius: 50%;
    object-fit: cover;
    background: #eee;
    border: 2px solid #eee;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 2px 8px 4px 0 rgb(0, 0, 0);
    margin-bottom: 20px;
  }
  #wrapper.toggled .name-pcl {
    display: block;
  }
  .nm-box {
    font-size: 10px;
  }
  .details-cr p {
    display: none;
  }
  .see-that a {
    color: #410770;
    border-bottom: none;
    font-size: 10px;
  }
  .title-footer {
    font-size: 14px;
    font-weight: 600;
  }
  .footer-ul > li > a {
    font-size: 12px;
    margin-top: 15px;
  }
  .s-title {
    font-size: 15px;
  }
  .this-panel > .col-lg-12 > .row > .col-lg-3 {
    padding: 8px;
  }
  .sidebar-nav li a {
    padding-left: 15px;
    font-size: 14px;
    text-decoration: none;
    float: right;
    text-decoration: none;
    width: 100%;
    height: 60px;
    line-height: 25px;
    vertical-align: center;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  #wrapper.toggled .sidebar-nav > li > a i.fa {
    font-size: 18px;
    width: 60px;
    float: right;
  }
  header .desk-menu .menu-container {
    float: right;
    justify-content: normal;
    flex-direction: column;
  }
  .logo-track {
    height: 30px;
    width: 30px;
    object-fit: cover;
    margin-left: 28px;
    padding: 0px;
  }
  .cart-img {
    border-radius: 5px 5px 0px 0px;
    height: 150px;
    width: 100%;
    object-fit: cover;
  }
  .blck-cc {
    color: rgb(255, 255, 255);
    font-size: 10px;
  }
  .cart-title h6 {
    color: rgb(255, 255, 255);
    height: 45px;
    font-size: 10px;
    padding: 2px 5px;
    margin-top: 5px;
    margin-bottom: 10px;
    line-height: 22px;
    overflow: hidden;
  }
  .content-teaching {
    direction: rtl;
    text-align: right;
    padding: 30px 10px;
    width: 100%;
  }
  .nm-cc {
    color: #fff;
    font-size: 12px;
    margin-bottom: 5px;
  }
  .submitting {
    padding: 4px 9px;
    text-align: center;
    background: transparent;
    color: #fff !important;
    font-size: 17px;
    font-weight: 500;
    border-radius: 6px;
    color: #fff;
  }
  .search-box.search-elem .inner {
    width: 85%;
    margin: 0 auto;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
  }
  .editable-user {
    text-align: center;
    padding: 0px 30px;
  }
  .wrapp-description div > iframe {
    height: 152px;
    border: 0;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.08) 2px 0px 8px 6px, rgba(0, 0, 0, 0.01) -4px 1px 6px 2px !important;
  }
  .wrapp-description div {
    display: flex;
    justify-content: center;
    padding: 20px 0px;
    background: #130728;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.08) 2px 0px 8px 6px, rgba(0, 0, 0, 0.01) -4px 1px 6px 2px !important;
  }
  .c-mp {
    border-radius: 10px;
    margin-bottom: 0px;
    margin-top: 0px;
    height: 120px;
  }
  .background-faq {
    height: 350px;
  }
  .faq-title {
    font-size: 14px;
  }
  .brod-row a {
    font-size: 11px;
    color: #fff;
  }
  .brod-row i {
    font-size: 6px;
    color: #a489ff;
    margin: 0px 0px;
  }
  .no-setting {
    height: 52px;
    width: 140px;
    object-fit: contain;
  }
  .holder-dotti {
    height: 0px;
    position: absolute;
    top: -120px;
  }
  .circle-in-header {
    width: 100px;
    height: 100px;
    top: 100%;
    left: 10%;
  }
  .min-q {
    font-size: 20px;
    top: 10px;
    left: 30px;
  }
  .big-q {
    font-size: 50px;
    color: #fff;
    margin-bottom: 0px;
    animation: mover-mobile 1.9s infinite alternate;
  }
  .faq-body {
    color: #fff;
    font-size: 16px;
    font-weight: normal;
  }
  .faq-caption {
    text-align: center;
    color: rgba(205, 205, 205, 0.8);
    font-size: 14px;
    margin-top: 12px;
  }
  .select-question {
    height: 150px;
    direction: rtl;
    display: flex;
    padding: 15px 10px;
    border-radius: 10px;
    width: 100%;
    margin-bottom: 25px;
    flex-direction: column;
  }
  .qu-iholder {
    height: 40px;
    width: 40px;
    padding: 5px;
    outline: 2px solid hsla(276, 91%, 79%, 0.36);
    outline-offset: 5px;
  }
  .content-question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    flex-direction: column;
  }
  .question-title {
    font-size: 10px;
    color: #fff;
    margin-right: 0px;
    margin-bottom: 10px;
    height: 30px;
    margin-top: 16px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .arrow-link {
    padding: 7px 8px;
  }
  .faq-row {
    direction: rtl;
    margin-bottom: 10px;
    margin-top: 20px;
  }
  .boy-anwser {
    height: 100px;
    width: 100px;
    object-fit: contain;
    position: relative;
    margin-bottom: 10px;
  }
  .heeader-web {
    height: 55px;
    border: 1px solid #754ffe;
    border-radius: 20px 20px 0px 0px;
    box-shadow: 0 2px 6px -1px rgba(0, 0, 0, 0.07), 0 6px 18px -1px rgba(0, 0, 0, 0.58) !important;
    background-color: #191919;
    padding: 15px 10px;
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    align-items: center;
  }
  .header-wtitle h3 {
    text-align: right;
    font-size: 10px;
    color: #fff;
    margin-bottom: 0px;
    line-height: 22px;
  }
  .green {
    font-size: 8px;
    margin: 0px 0px;
  }
  .yellow {
    font-size: 8px;
    margin: 0px 0px;
  }
  .red {
    font-size: 8px;
    margin: 0px 0px;
  }
  .anwser-box {
    padding: 10px 15px;
    direction: rtl;
  }
  .anwser-box p {
    text-align: right;
    color: #fff;
    font-size: 10px;
    line-height: 21px;
    text-align: justify;
  }
  .more-according {
    margin-top: 20px;
  }
  .more-awnser {
    color: #ccb8f0;
    font-weight: normal;
    font-size: 10px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    word-break: break-all;
    line-break: anywhere;
    overflow: hidden;
    overflow-wrap: break-word;
  }
  .more-awnser h6 {
    font-size: 10px;
  }
  .qu-heading {
    height: 55px;
    border: 1px solid #191919;
    background-color: #202020;
    padding: 20px 5px;
    display: flex;
    justify-content: flex-start;
    direction: rtl;
    align-items: center;
    line-break: anywhere;
    word-break: break-all;
  }
  .w-best-courses {
    position: relative;
    top: 0px;
  }
  .topp-catt section {
    position: unset;
    top: unset;
  }
  .new-courses .nw-cr {
    font-size: 1.8rem;
  }
}
/*
    iphone 6       
    */
@media (max-width: 575px) {
  label {
    display: block;
    margin-bottom: 5px;
    font-size: 12px !important;
    margin-bottom: 0px !important;
    margin-top: 0.4rem;
  }
  .ih-item.circle.effect1 .info h3 {
    color: #ffffff;
    font-size: 10px;
    height: 110px;
    margin: 0 0px;
    padding: 5px 0 0;
  }
  .nt-header {
    text-align: center;
    font-size: 18px;
    font-weight: 600;
  }
  .margin-teachers {
    margin-top: 0px;
  }
  .ih-item.circle.effect1 .info p {
    font-size: 10px;
    margin: 0 0px;
    padding: 0px 5px;
  }
  .ih-item.circle.effect1 a:hover .info {
    height: 100%;
    width: 100%;
  }
  .contact-us-head h2 {
    font-size: 18px;
  }
  .contact-us-head h3 {
    font-size: 16px;
    padding-right: 0px;
  }
  .contact-us-head p {
    font-size: 14px;
  }
  .mini-nt {
    font-size: 0.7rem;
    margin-top: 0rem;
  }
  .date-rote-mini {
    font-size: 0.7rem;
  }
  .in-fld {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .banner-row {
    padding: 0 10px;
  }
  .w-absolute .cart-timer {
    position: relative;
    top: -25px;
    padding: 1px 5px;
    width: max-content;
    right: 5px;
    --border-size: 1px;
  }
  .w-absolute .cart-timer i {
    font-size: 13px;
  }
  .w-absolute .cart-timer #countdown {
    width: 80px;
  }
  .w-absolute .cart-timer #countdown span {
    font-size: 12px;
  }
  .blog-wrapper .calc-width .date-rote {
    direction: rtl !important;
    margin-left: 0px;
  }
  .carousel {
    padding: 0px;
  }
  .carousel-inner {
    width: 100%;
    overflow: hidden;
    height: 250px;
    object-fit: contain;
  }
  .new-courses .nw-cr {
    margin-top: 10px;
    margin-bottom: -10px !important;
  }
  .mobile-none {
    display: none !important;
  }
  .pay {
    font-size: 13px;
  }
  .money {
    height: 2rem;
  }
  .money p {
    font-size: 12px;
    color: #d7a7ff;
    height: 20px;
  }
  .money .toman {
    float: left;
    margin-right: 4px;
  }
  .money del {
    color: rgb(21, 0, 54);
    text-decoration: none;
    position: relative;
    font-size: 14px;
  }
  .money del:before {
    content: " ";
    display: block;
    width: 100%;
    border-top: 1px solid rgb(161, 161, 161);
    height: 12px;
    position: absolute;
    bottom: -5px;
    left: 0;
    transform: rotate(349deg);
  }
  .error-body {
    background: #fff;
    top: -40px;
    padding: 40px 14px;
  }
  .error-body h2 {
    font-size: 24px;
    margin-top: 20px;
  }
  .error-body .blog-wrapper {
    margin: 0px;
    margin-top: 15px;
    margin-bottom: 20px;
  }
  .error-body .new-courses div {
    width: 50%;
  }
  .sm-set-border {
    padding-bottom: 20px;
    border-bottom: 1px solid rgb(242, 242, 242);
  }
  .date-detail {
    justify-content: start;
    margin-top: 20px;
  }
  .price-detail {
    justify-content: end;
    margin-top: 20px;
  }
  .mobile-space {
    margin-top: -70px !important;
  }
  .search-box.search-elem input[type=text]::placeholder {
    font-size: 12px;
    padding-right: 20px;
  }
  #search-field::placeholder {
    font-size: 12px !important;
  }
  #sidebar {
    position: relative !important;
    top: unset !important;
  }
  .into-btn {
    margin-bottom: 0px !important;
  }
  .new-courses .nw-cr {
    font-size: 1.8rem;
  }
  .topp-catt section {
    position: unset;
    top: unset;
  }
  .footer-border {
    padding: 5px 20px;
    direction: rtl;
  }
  .glow-footer {
    padding: 10px 0px;
    top: -20px;
  }
  .glow-footer .col-6 {
    padding: 0px !important;
  }
  .w-footer-label {
    font-size: 0.8rem;
    padding-right: 10px;
  }
  .so-ul {
    padding-left: 10px !important;
  }
  .so-ul ul {
    padding: 10px 5px;
  }
  .so-ul li {
    padding: 0px 5px !important;
  }
  .so-ul a {
    font-size: 14px;
    padding: 6px 8px;
  }
  .blog-wrapper {
    height: 18rem;
    padding: 15px 10px;
    margin: 0px;
    margin-bottom: 30px;
  }
  .blog-wrapper .blog-banner-wraper {
    height: 80px;
    top: -30px;
  }
  .blog-wrapper .blog-banner {
    height: 80px;
    margin-bottom: 0px;
  }
  .blog-wrapper .blog-intro {
    line-height: 22px;
    font-size: 12px;
    font-weight: 600;
    height: 72px;
    overflow: hidden;
    margin-bottom: 0px;
  }
  .blog-wrapper .blog-caption {
    font-size: 10px;
    height: 65px;
    line-height: 17px;
    overflow: hidden;
  }
  .blog-wrapper .blog-setting {
    display: flex;
    margin-top: 8px;
  }
  .blog-wrapper .blog-user {
    display: none;
  }
  .blog-wrapper .category-label {
    top: -26px;
    right: -15px;
    font-size: 11px;
    padding: 2px 15px;
    border-radius: 4px 0px 0px 4px;
    background: linear-gradient(304deg, #e6e2f1 0.64%, #b17fe0 98.23%);
  }
  .animation-bar {
    display: none;
  }
  .w-best-courses {
    position: relative;
    top: 10px;
  }
  .no-matter {
    display: none;
  }
  .tag-in p {
    font-size: 8px;
  }
  .coursers-wrapp {
    height: 100px;
  }
  .coursers-wrapp .img-cc {
    height: 25px;
    width: 25px;
    margin-top: 0px;
    object-fit: contain;
  }
  .qu-heading {
    height: 55px;
    border: 1px solid #191919;
    background-color: #202020;
    padding: 20px 5px;
    display: flex;
    justify-content: flex-start;
    direction: rtl;
    align-items: center;
    line-break: anywhere;
    word-break: break-all;
  }
  .anwser-box {
    padding: 10px 15px;
    direction: rtl;
  }
  .anwser-box p {
    text-align: right;
    color: #fff;
    font-size: 10px;
    line-height: 21px;
    text-align: justify;
  }
  .more-according {
    margin-top: 20px;
  }
  .more-awnser {
    color: #ccb8f0;
    font-weight: normal;
    font-size: 10px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    word-break: break-all;
    line-break: anywhere;
    overflow: hidden;
    overflow-wrap: break-word;
  }
  .more-awnser h6 {
    font-size: 10px;
    overflow-wrap: break-word;
  }
  .boy-anwser {
    height: 100px;
    width: 100px;
    object-fit: contain;
    position: relative;
    margin-bottom: 10px;
  }
  .green {
    font-size: 8px;
    margin: 0px 0px;
  }
  .yellow {
    font-size: 8px;
    margin: 0px 0px;
  }
  .red {
    font-size: 8px;
    margin: 0px 0px;
  }
  .header-wtitle h3 {
    text-align: right;
    font-size: 10px;
    color: #fff;
    margin-bottom: 0px;
    line-height: 22px;
  }
  .heeader-web {
    height: 55px;
    border: 1px solid #754ffe;
    border-radius: 20px 20px 0px 0px;
    box-shadow: 0 2px 6px -1px rgba(0, 0, 0, 0.07), 0 6px 18px -1px rgba(0, 0, 0, 0.58) !important;
    background-color: #191919;
    padding: 15px 10px;
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    align-items: center;
  }
  .faq-row {
    direction: rtl;
    margin-bottom: 10px;
    margin-top: 20px;
  }
  .content-question {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    flex-direction: column;
  }
  .arrow-link {
    padding: 7px 8px;
  }
  .arrow-link i {
    font-size: 10px;
  }
  .question-title {
    font-size: 10px;
    color: #fff;
    margin-right: 0px;
    margin-bottom: 10px;
    height: 30px;
    margin-top: 16px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .brod-row i {
    font-size: 6px;
    color: #a489ff;
    margin: 0px 0px;
  }
  .qu-iholder {
    height: 40px;
    width: 40px;
    padding: 5px;
    outline: 2px solid hsla(276, 91%, 79%, 0.36);
  }
  .select-question {
    height: 150px;
    direction: rtl;
    display: flex;
    padding: 15px 10px;
    border-radius: 10px;
    width: 100%;
    margin-bottom: 25px;
    flex-direction: column;
  }
  .faq-caption {
    text-align: center;
    color: rgba(205, 205, 205, 0.8);
    font-size: 14px;
    margin-top: 12px;
  }
  .faq-body {
    color: #fff;
    font-size: 16px;
    font-weight: normal;
  }
  .big-q {
    font-size: 50px;
    color: #fff;
    margin-bottom: 0px;
    animation: mover-mobile 1.9s infinite alternate;
  }
  .min-q {
    font-size: 20px;
    top: 10px;
    left: 30px;
  }
  .holder-dotti {
    height: 0px;
    position: absolute;
    top: -120px;
  }
  .circle-in-header {
    width: 100px;
    height: 100px;
    top: 100%;
    left: 10%;
  }
  .no-setting {
    height: 52px;
    width: 140px;
    object-fit: contain;
  }
  .holder-dotti {
    height: 0px;
    position: absolute;
    top: -120px;
  }
  .circle-in-header {
    width: 100px;
    height: 100px;
    background: inherit;
    position: absolute;
    overflow: hidden;
    top: 100%;
    left: 10%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    animation: mover-mobile 1.6s infinite alternate;
  }
  .background-faq {
    height: 350px;
  }
  .faq-title {
    font-size: 14px;
  }
  .brod-row a {
    font-size: 11px;
    color: #fff;
  }
  .c-mp {
    border-radius: 10px;
    margin-bottom: 0px;
    margin-top: 0px;
    height: 120px;
  }
  .map {
    padding: 10px;
  }
  .some-cream h4 {
    margin-top: 30px;
    margin-bottom: 10px;
    font-size: 16px;
    line-height: 23px;
  }
  .title-course-banner {
    height: 350px;
  }
  .dc-row {
    color: white;
    padding-right: 15px;
    font-size: 12px;
  }
  .wrapp-description h4 {
    font-size: 16px;
  }
  .wrapp-description div {
    display: flex;
    justify-content: center;
    padding: 20px 0px;
    background: #130728;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.08) 2px 0px 8px 6px, rgba(0, 0, 0, 0.01) -4px 1px 6px 2px !important;
  }
  .wrapp-description div > iframe {
    height: 152px;
    border: 0;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.08) 2px 0px 8px 6px, rgba(0, 0, 0, 0.01) -4px 1px 6px 2px !important;
  }
  .wrapp-description h3 {
    font-size: 16px;
  }
  #CenterBannerApp {
    padding: 0px 32px;
    top: 0px;
  }
  .banner--1 {
    height: 90px;
    margin-top: 0px;
    margin-bottom: 0px;
  }
  .banner--2 {
    height: 90px;
    margin-top: 0px;
    margin-bottom: 0px;
  }
  .banner--3 {
    height: 90px;
    margin-top: 0px;
    margin-bottom: 0px;
  }
  .third-box {
    margin-top: 10px;
    margin-bottom: 200px;
  }
  .details-cr p {
    display: none;
  }
  .text-content p {
    font-size: 13px;
    text-align: justify;
  }
  .header .menu > ul > li .sub-menu > ul > li {
    line-height: 1;
    margin: 0px 0px;
  }
  .header .menu > ul > li .sub-menu > ul > li > a {
    padding: 14px 0;
  }
  .editable-user {
    text-align: center;
    padding-right: 0px;
  }
  .margin-lio p {
    color: #fff;
    font-size: 12px;
    text-align: justify;
  }
  .our-team {
    height: 197px;
    width: 89%;
    object-fit: cover;
    padding: 23px;
    position: absolute;
    top: -179px;
    z-index: -2;
  }
  .tag-row {
    display: block;
    padding: 10px 15px;
  }
  .ct-toch {
    padding-left: 22px;
    display: none;
  }
  .send-wrapper {
    margin-bottom: 20px;
  }
  .texture {
    direction: rtl;
    text-align: right;
    font-size: 13px;
    color: #ffffff;
    margin-bottom: 40px;
    padding: 0px 25px;
  }
  .our-team {
    width: 100vw;
    overflow-x: hidden;
  }
  .shapes {
    width: 100vw;
    overflow-x: hidden;
  }
  .error-boxes {
    height: 570px;
    background-image: url(/assets/images/vectors/pages.webp);
    background-position: bottom right;
    background-size: 250px;
    background-repeat: no-repeat;
  }
  body .scene {
    perspective: 2600px;
    width: 328px;
    height: 400px;
    position: absolute;
    top: 140px;
    /* margin-top: 50px; */
    overflow: hidden;
  }
  .content-title h3 {
    margin-bottom: 15px;
    font-size: 18px;
    text-align: center;
    line-height: 40px;
  }
  .wrapp-description {
    padding: 10px;
  }
  .wrapp-description p {
    font-size: 12px;
    text-align: justify;
  }
  .course-description p {
    font-size: 12px;
    text-align: justify;
  }
  .reply-box {
    width: 100%;
  }
  .right-bs {
    padding-left: 5px;
  }
  .money {
    direction: ltr;
    width: 180px;
  }
  .left-bs {
    padding-right: 5px;
  }
  .as-first {
    padding-right: 25px;
    order: 1;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-direction: column;
  }
  .boot-ca {
    margin-top: 10px;
  }
  .st-counter {
    padding-right: 0;
  }
  .img-similar-holder {
    height: 110px;
    width: 100%;
  }
  .none-title {
    color: #fff;
    font-size: 18px;
  }
  .teracher-title {
    display: none;
  }
  .similar-course span {
    text-align: right;
    font-size: 16px;
  }
  .similar-box {
    background: rgba(0, 0, 0, 0.2784313725);
    padding: 30px 25px;
    border-radius: 8px;
    padding-bottom: 40px;
  }
  .img-similar-holder img {
    height: 100px;
  }
  .header .item-right a p {
    font-size: 10px;
  }
  .none-capt {
    font-size: 12px;
    color: #fff;
    margin-top: 20px;
  }
  .teacher-sc {
    text-align: right;
    width: 60%;
  }
  .btn svg {
    position: absolute;
    left: -36px;
  }
  .so-pill {
    border-bottom: none;
  }
  .form-acc {
    direction: rtl;
    margin-top: 20px;
    padding: 20px;
  }
  button {
    display: inline-block;
    background: rgb(59, 31, 158);
    border: 1px solid rgb(59, 31, 158);
    padding: 8px 26px;
    border-radius: 24px;
    font-size: 12px;
    cursor: pointer;
    width: 100%;
    transition: all 0.1s ease 0s;
  }
  .offer-code {
    padding-right: 0px;
  }
  .new-title {
    font-size: 12px;
  }
  .each-new {
    padding: 30px 15px;
  }
  .c-icon {
    height: 50px;
    height: 50px;
    object-fit: contain;
    border-radius: 50%;
  }
  .nc-black {
    color: #fff;
    margin-bottom: 10px;
    font-size: 12px;
  }
  .teacher-n {
    font-size: 12px;
  }
  .tc-n {
    font-size: 12px;
  }
  .c-name {
    text-align: right;
    padding: 0px 20px;
    min-width: 250px;
  }
  .remove-course {
    width: 25px;
    height: 25px;
    padding: 5px;
    background-color: rgb(223, 174, 252);
    border: none;
    text-align: center;
    margin-right: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    cursor: pointer;
  }
  .remove-course i {
    font-size: 12px;
  }
  .row-input {
    display: flex;
    flex-direction: row;
  }
  .offer-input {
    width: 80% !important;
  }
  .header .mobile-menu-trigger {
    margin-left: 0px;
  }
  .toggle-slot {
    position: relative;
    height: 36px;
    width: 36px;
    border-radius: 6px;
    transition: background-color 250ms;
    margin-right: 6px;
    border: 1px solid rgba(255, 255, 255, 0.3411764706);
  }
  .navbar-padding {
    padding: 0px 20px;
    height: 82px;
  }
  button.close {
    padding: 0;
    background-color: #9d53ff;
    border: 0;
    width: 45px;
    height: 45px;
    color: #fff;
    z-index: 100000000;
  }
  .search-box.search-elem input[type=text] {
    padding: 0px;
    height: 45px;
    font-size: 18px;
    border-radius: 5px;
  }
  .search-box.search-elem input[type=text]::placeholder {
    font-size: 18px;
  }
  .search-box.search-elem .inner {
    width: 100%;
  }
  .resume-heading {
    height: 200px;
    background-position: 0 0;
    background: center;
    background-size: cover;
  }
  .profile-ct {
    height: 100px;
    width: 100px;
    object-fit: cover;
    border-radius: 50%;
    border: 3px;
  }
  .naming-here {
    font-size: 12px !important;
    font-weight: normal;
    color: #fff;
  }
  .caption-ct p {
    color: #fff;
    font-size: 12px;
  }
  .content-teaching {
    direction: rtl;
    text-align: right;
    padding: 30px 10px;
    width: 100%;
  }
  .nm-cc {
    color: #fff;
    font-size: 12px;
    margin-bottom: 5px;
    line-height: 28px;
  }
  .pholder {
    padding: 10px 10px;
  }
  .img-cst {
    height: 60px;
    width: 69px;
    object-fit: cover;
    border-radius: 10px;
  }
  .txt-res {
    font-size: 12px;
    font-weight: 500;
  }
  .filter-box {
    padding-left: 0px;
  }
  .img-fc {
    display: none;
  }
  .boot-ca {
    height: max-content;
  }
  .wrapp-acf {
    margin-top: 0px;
    padding: 15px;
    direction: rtl;
  }
  .top-jump-course {
    position: relative;
    top: -130px;
  }
  .side-wrapp-banner {
    display: flex;
  }
  .wrapp-alls {
    margin-top: 0px;
  }
  .mini-banner-side {
    height: 80px;
    border-radius: 6px;
    margin: 20px 0px;
    margin-bottom: 30px;
  }
  .content-cf {
    text-align: right;
    padding: 10px;
    display: flex;
    align-items: flex-start;
    width: 100%;
  }
  .caption-cf {
    font-size: 10px;
  }
  .some-cream h4 {
    margin-top: 30px;
    margin-bottom: 10px;
    font-size: 18px;
  }
  .some-cream {
    color: rgb(255, 255, 255);
    padding: 0px 25px;
  }
  .name-of {
    width: 100%;
    color: rgb(255, 255, 255);
    text-align: right;
    font-size: 14px;
    padding: 10px 10px;
  }
  .tag-thing {
    font-size: 10px;
  }
  .blck-cc {
    color: rgb(255, 255, 255);
    font-size: 10px;
  }
  .cart-img {
    border-radius: 5px 5px 0px 0px;
    height: 120px;
    width: 100%;
    object-fit: cover;
  }
  .bi-hold {
    background-color: rgb(35, 35, 35);
    height: 50px;
    width: 52px;
    border-radius: 50%;
    margin-left: 20px;
    width: 13%;
  }
  .blog-intro {
    line-height: 24px;
    font-size: 14px;
    height: 65px;
    overflow: hidden;
    display: flex;
    align-items: center;
    color: rgb(255, 255, 255);
  }
  .blog-caption {
    text-align: right;
    font-size: 10px;
    height: 50px;
    line-height: 20px;
    overflow: hidden;
    color: #fff;
  }
  .logo-track {
    height: 30px;
    width: 30px;
    object-fit: cover;
    margin-left: 28px;
    padding: 0px;
  }
  header .desk-menu .menu-container {
    float: right;
    justify-content: normal;
    flex-direction: column;
  }
  .s-title {
    font-size: 15px;
  }
  .ignore-padding {
    padding: 5px 5px;
  }
  .notification {
    padding: 5px 15px;
    font-size: 12px;
  }
  .see-that a {
    color: #fff;
    border-bottom: none;
    font-size: 10px;
  }
  .cart-level i {
    color: #9876ff;
    margin: 0px 10px;
  }
  .img-flat {
    height: 400px;
    width: 200px;
    background-image: none;
    background-repeat: no-repeat;
    position: absolute;
    top: 232px;
  }
  .img-flat img {
    margin-top: 30px;
    height: 138px;
    width: 95px;
  }
  .pl-none {
    order: 2;
    padding: 0px 20px;
  }
  .ic-img {
    width: 47%;
    height: 70px;
    object-fit: cover;
    border-radius: 4px;
  }
  .nc-cart {
    font-size: 10px;
    max-width: 200px;
    overflow: hidden;
  }
  .header {
    padding-left: 0px;
    padding: 0px 0px;
    box-shadow: none;
  }
  .submitting {
    color: rgb(36, 36, 36);
    font-size: 12px;
    background-size: 300% 100%;
    border-radius: 6px;
  }
  .submitting {
    padding: 3px 8px;
    text-align: center;
    background: transparent;
    color: #fff !important;
    font-size: 17px;
    font-weight: 500;
    border: none;
    border-radius: 6px;
    color: #fff;
    height: 35px;
    margin-right: 0px;
    display: flex;
    flex-direction: row-reverse;
  }
  .submitting a i {
    color: #fff;
  }
  .search-box-holder {
    z-index: 1;
    margin-left: 0px;
    padding-left: 4px;
  }
  .search-box-holder i {
    color: #fff;
  }
  .icon-panel {
    height: 40px;
    width: 40px;
  }
  .nm-box {
    font-weight: normal;
    font-size: 10px;
  }
  .btn-sc {
    padding: 8px 0px;
    margin-right: 10px;
    margin-top: 8px;
    display: none;
  }
  .caption-hro {
    display: none;
  }
  header .hamburger-menu {
    top: 80px;
    right: -72px;
  }
  .text-nowrap {
    white-space: nowrap !important;
    color: #fff;
    font-size: 12px;
  }
  .po-color {
    color: #c78bff !important;
    font-size: 17px !important;
  }
  .search-main {
    width: 115px;
    height: 46px;
    margin-right: 5px;
    border-radius: 0px;
    background: #9d53ff;
    font-size: 12px;
    cursor: pointer;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .search-btn {
    font-size: 16px;
    display: inline-block;
    margin-bottom: 0px;
    position: relative;
    bottom: -3px;
    color: rgb(195, 136, 250);
  }
  .option-badge {
    font-size: 9px;
    font-weight: 500;
    padding: 0px 0px;
    border-radius: 15px;
    min-width: 19px !important;
    text-align: center;
    position: absolute;
    transform: translate(-21px, -20px);
  }
  .stranger-padding {
    padding: 0px 20px;
  }
  .ec-btn {
    padding: 8px 4px;
    background: rgba(164, 133, 255, 0.145);
    display: flex;
    align-items: center;
    min-width: 85px;
    justify-content: space-around;
    border-radius: 4px;
    border: 1px solid rgba(1, 1, 2, 0.145);
    margin: 10px 1px;
  }
  .course-wrapp {
    padding: 20px 5px;
  }
  .ec-btn a {
    color: rgb(255, 255, 255);
    font-size: 10px;
  }
  .detail-sd p {
    font-size: 10px;
    line-height: 22px;
    text-align: justify;
    color: rgb(234, 234, 234);
  }
  .into-top {
    margin-bottom: 30px;
    padding: 10px;
  }
  .detail-fd {
    display: block;
    align-items: baseline;
    justify-content: space-between;
  }
  .this-panel {
    padding: 40px 0px;
    border-radius: 8px;
    margin-right: 65px;
    min-height: 100vh;
    text-align: right;
    transition: all ease-in-out 0.5s;
  }
  .sidebar-brand {
    position: absolute;
    top: 0;
    width: 250px;
    text-align: center;
    padding: 20px 12px;
    margin-bottom: 30px;
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    display: flex;
    align-items: flex-start;
    justify-content: space-evenly;
    border-bottom: 1px solid rgba(20, 20, 20, 0.26);
    align-content: flex-start;
  }
  .panel-uimg {
    height: 45px;
    width: 45px;
    border-radius: 50%;
    object-fit: cover;
    background: #eee;
    border: 2px solid #eee;
    margin-bottom: 20px;
  }
  .name-pcl {
    color: #fff;
    display: none;
  }
  .sidebar-nav {
    margin-top: 0px;
  }
  #wrapper.toggled .sidebar-brand {
    position: absolute;
    top: 0;
    width: 250px;
    text-align: center;
    padding: 20px 12px;
    margin-bottom: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid rgba(20, 20, 20, 0.26);
    align-content: flex-start;
  }
  #wrapper.toggled .panel-uimg {
    height: 80px;
    width: 80px;
    border-radius: 50%;
    object-fit: cover;
    background: #eee;
    border: 2px solid #eee;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 2px 8px 4px 0 rgb(0, 0, 0);
    margin-bottom: 20px;
  }
  .each-new p {
    font-size: 9px;
    padding: 2px 0px;
    line-height: 23px;
    color: #fff;
  }
  #wrapper.toggled .name-pcl {
    display: block;
  }
  .nm-box {
    font-size: 10px;
  }
  .all-courses-view {
    background-color: transparent;
    padding: 0px 6px;
    color: #ccc;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 200px;
    font-size: 12px;
  }
  .notification span {
    margin-right: 5px;
    font-size: 14px;
    font-weight: normal;
  }
  .notification {
    padding: 5px 15px;
    margin-top: 10px;
  }
  #wrapper.toggled .sidebar-nav {
    margin-top: 30px;
  }
  .in-rights {
    padding-right: 285px;
    direction: rtl;
    display: flex;
    justify-content: end !important;
    transition: all ease-in-out 0.5s;
  }
  .number-course {
    margin-left: 0px;
    font-weight: 700;
  }
  .nw-course {
    padding: 5px 0px;
    font-size: 10px;
    color: rgb(20, 20, 20);
    font-weight: normal;
  }
  .bordering-hill {
    max-width: 100%;
    overflow: hidden;
    padding: 5px;
    font-size: 10px;
  }
  .header-title {
    font-size: 8px;
  }
  .bordering-hill p {
    font-size: 8px;
  }
  .btn-link span {
    color: #000;
    -webkit-text-fill-color: #000;
    font-size: 12px;
  }
  .all-courses-view img {
    height: 12px;
    margin-right: 18px;
  }
  .ico-collapse {
    font-size: 8px;
  }
  .caption-pc {
    display: none;
  }
  .see-that {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    width: 30%;
    max-width: 30%;
    overflow: hidden;
  }
  .nc-cart {
    font-size: 10px;
  }
  .sidebar-nav li a {
    padding-left: 15px;
    font-size: 14px;
    text-decoration: none;
    float: right;
    text-decoration: none;
    width: 100%;
    height: 60px;
    line-height: 25px;
    vertical-align: center;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .title-footer {
    font-size: 14px;
    font-weight: 600;
  }
  .footer-ul > li > a {
    font-size: 12px;
    margin-top: 15px;
  }
  .newsletters-holder .input-group {
    height: 45px;
  }
  .newsletters-holder input {
    padding: 5px;
    height: 35px !important;
  }
  .newsletters-holder .search-btns {
    padding-left: 5px !important;
  }
  .newsletters-holder button {
    padding: 5px;
    height: 40px;
    margin-top: 0px !important;
  }
  .newsletters-holder .input-group {
    height: 40px;
    margin-right: 5px;
    display: flex;
    flex-wrap: nowrap;
    padding: 0px 5px;
  }
  .newsletters-holder i {
    font-size: 16px !important;
    padding: 0px;
    margin-top: 0px !important;
  }
  .newsletters-holder ::placeholder {
    font-size: 8px;
  }
  .ordering-title {
    font-size: 10px;
    text-align: right;
  }
  .order-cp {
    font-size: 10px;
  }
  .sidebar-nav > li > a i.fa {
    font-size: 18px;
    width: 0px;
    float: right;
  }
  .search-box.search-elem button.submit {
    outline: none;
    top: 0;
    right: 15px;
    height: 45px;
    padding: 10px 2rem;
    width: 160px;
    border-radius: 5px;
    margin-right: 0px;
    margin-top: 25px;
    font-size: 13px;
  }
  .search-box.search-elem label.placeholder {
    position: absolute;
    top: 14px;
    right: 2rem;
    font-size: 16px;
    font-weight: 300;
    border-radius: 6px;
  }
  #wrapper.toggled .sidebar-nav > li > a i.fa {
    font-size: 18px;
    width: 60px;
    float: right;
  }
  .cart-title h6 {
    color: rgb(255, 255, 255);
    height: 45px;
    font-size: 10px;
    padding: 2px 5px;
    margin-top: 5px;
    margin-bottom: 10px;
    line-height: 22px;
    overflow: hidden;
  }
  .logo {
    width: 55px;
    object-fit: contain;
    padding: 0px;
    position: relative;
    right: 8px;
  }
  header .hamburger-menu {
    top: 78px;
    right: -42px;
  }
  .navbar-padding {
    padding: 0px 10px;
    height: 82px;
  }
  .svg-course {
    display: none;
  }
  .rounded-circle p {
    margin: 0;
    font-size: 12px;
    color: #fff;
    text-align: center;
  }
  .logo a {
    margin-top: 0px;
  }
  .avatar {
    position: relative;
    display: flex;
    align-items: center;
    width: 62px;
    height: 30px;
    font-size: 1rem;
    justify-content: center;
    margin-right: 10px;
    margin-top: 15px;
    text-align: center;
    background: #9876ff;
    border-radius: 6px;
    box-shadow: rgb(39, 39, 39) 0px 1px 1px -3px, rgba(0, 0, 0, 0.07) 1px 1px 3px 2px !important;
  }
  .course-level p {
    font-size: 8px;
  }
  .cart-wrappering {
    margin-bottom: 15px;
    text-align: right;
    height: 14.5rem;
    padding: 15px 10px;
  }
  .name-course {
    margin-top: 20px;
    font-size: 0.7rem;
    line-height: 24px;
    height: 40px;
    overflow: hidden;
  }
  .first-details {
    margin-top: 0rem;
  }
  .w-see-course {
    font-size: 0.5rem;
  }
  .w-see-course i {
    font-size: 8px;
  }
  .money {
    justify-content: flex-end;
  }
  .money del {
    font-size: 10px;
  }
  .new-courses {
    margin-bottom: 15px !important;
  }
  .cart-wrappering .w-absolute {
    height: 50px;
    top: -47px;
  }
  .cart-wrappering .cart-img {
    height: 118px;
  }
  .cart-wrappering i {
    font-size: 10px;
    margin-left: 5px;
    color: #150055;
  }
  .cart-wrappering .timer-title {
    color: #000;
    font-size: 0.5rem;
    margin-top: 3px;
    font-weight: 600;
  }
  .w-absolute .cart-timer .timer-title {
    color: #000;
    font-size: 0.6rem;
    margin-top: 3px;
    font-weight: 600;
  }
  .mr-2 {
    margin-right: 3px;
  }
  .right-padding form {
    padding: 0px !important;
  }
  .page-link {
    width: 20px;
    height: 32px;
    padding: 10px 14px;
    font-size: 10px !important;
  }
  .filter-box {
    margin-bottom: 40px;
  }
  .filter-wrapping {
    margin-top: 5px;
    padding: 5px;
  }
  .course-level {
    width: max-content;
    padding: 0px 8px;
    padding-bottom: 4px;
    border-radius: 3px;
    height: 25px;
  }
  .journey-line {
    height: 60px;
  }
  .coontaact-us {
    text-align: center;
    color: #fff;
    font-size: 14px;
  }
  .wrapp-sociality div {
    width: 70%;
    margin: 2px;
  }
  .social-content a i {
    font-size: 14px;
    color: #fff;
    margin-left: 0px;
  }
  .wrapp-sociality div a {
    display: flex;
    justify-content: center;
    height: 60px;
    border-radius: 10px;
    padding: 15px;
    align-items: center;
    flex-direction: column;
  }
  .social-content h6 {
    font-size: 10px;
    color: #fff;
    font-family: LilitaOne;
    font-weight: 400;
    margin-bottom: 0px;
  }
  .a-girl {
    height: 110px;
    width: 160px;
    object-fit: contain;
    position: relative;
  }
  .height-lower {
    height: 0px;
    display: flex;
    flex-direction: row-reverse;
    padding: 0px 50px;
  }
  .a-girl img {
    height: 100%;
    width: 100%;
    object-fit: contain;
    position: absolute;
    top: -77px;
  }
  .success-box {
    height: 300px;
  }
}
/*
    Galaxy s5
    */
@media only screen and (min-width: 414px) and (max-width: 474px) {
  .a-girl {
    height: 110px;
    width: 160px;
    object-fit: contain;
    position: relative;
  }
  .a-girl img {
    height: 100%;
    width: 100%;
    object-fit: contain;
    position: absolute;
    top: -77px;
  }
  .height-lower {
    height: 0px;
    display: flex;
    flex-direction: row-reverse;
    padding: 0px 50px;
  }
  .coontaact-us {
    text-align: center;
    color: #fff;
    font-size: 14px;
  }
  .social-content h6 {
    font-size: 10px;
    color: #fff;
    font-family: LilitaOne;
    font-weight: 400;
    margin-bottom: 0px;
  }
  .wrapp-sociality div a {
    display: flex;
    justify-content: center;
    height: 60px;
    border-radius: 10px;
    padding: 15px;
    align-items: center;
    flex-direction: column;
  }
  .social-content a i {
    font-size: 14px;
    color: #fff;
    margin-left: 0px;
  }
  .wrapp-sociality div {
    width: 70%;
    margin: 2px;
  }
  .cart-img {
    border-radius: 5px 5px 0px 0px;
    height: 120px;
    width: 100%;
    object-fit: cover;
  }
  .ec-btn {
    max-width: 80px;
  }
  .this-panel {
    margin-right: 0px;
  }
  .cart-title h6 {
    color: rgb(255, 255, 255);
    height: 45px;
    font-size: 10px;
    padding: 2px 5px;
    margin-top: 5px;
    margin-bottom: 10px;
    line-height: 22px;
    overflow: hidden;
  }
  .text-content p {
    color: #fff;
    font-size: 13px;
    text-align: justify;
  }
}
/*
    iphon
    8,X,XS,11,12
    */
@media only screen and (min-width: 375px) and (max-width: 474px) {
  .new-courses .nw-cr {
    margin-bottom: -10px !important;
  }
  .ih-item.circle.effect1 a:hover .info {
    height: 120px;
    width: 120px;
  }
  .w-absolute .cart-timer {
    position: relative;
    top: -25px;
    padding: 1px 5px;
    width: max-content;
    right: 5px;
    --border-size: 1px;
  }
  .w-absolute .cart-timer i {
    display: none;
  }
  .w-absolute .cart-timer #countdown {
    width: 80px;
  }
  .w-absolute .cart-timer #countdown span {
    font-size: 12px;
  }
  .w-absolute .cart-timer .timer-title {
    font-size: 9px;
    margin-top: 1px;
  }
  .blog-wrapper .person-in span {
    font-size: 10px;
  }
  .w-wrapp-blogs {
    padding: 0px;
    padding-top: 20px;
  }
  .sett-height {
    height: 110px;
  }
  .result-course {
    display: none;
  }
  .margin-teachers {
    margin-top: 10px;
  }
  .carousel-inner {
    width: 100%;
    height: 225px;
  }
  .carousel {
    padding: 0;
  }
  .carousel-control-next-icon,
  .carousel-control-prev-icon {
    display: none !important;
  }
  .carousel-indicators {
    display: none !important;
  }
  .col-md-6.pl-none {
    padding: 0px 15px;
  }
  .side-wrapp-banner {
    display: none !important;
  }
  .add-all-filter {
    margin-bottom: 30px;
  }
  .filter-button {
    position: relative;
    left: -18px;
    top: -4px;
  }
  .text-content p {
    color: #fff;
    font-size: 13px;
    text-align: justify;
  }
  .texture {
    direction: rtl;
    text-align: right;
    font-size: 12px;
    color: #ffffff;
    margin-bottom: 40px;
    padding: 0px 25px;
    display: none;
  }
  .c-mp {
    margin-bottom: 0px;
    margin-top: 0px;
    height: 120px;
  }
  .teaching-owner {
    padding: 30px 10px;
  }
  .course-btns {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
  }
  .content {
    position: relative;
    height: 160px;
  }
  .cc-img {
    height: 65px;
    width: 70px;
    border: 1px solid rgb(117, 79, 254);
    box-shadow: rgba(56, 56, 56, 0.07) 0px 10px 15px -3px, rgba(43, 42, 42, 0.1) 0px 4px 6px -2px !important;
  }
  .back-to-home {
    color: #000;
    padding: 8px 35px;
    margin-top: 25px;
    background: #caadff;
    font-size: 18px;
    border-radius: 25px;
    background-size: 300% 100%;
    moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
  }
  .text-err {
    direction: rtl;
    text-align: right;
    font-size: 20px;
  }
  .reply-title {
    font-size: 10px;
  }
  .ec-btn {
    padding: 5px 1px;
    background: rgba(164, 133, 255, 0.145);
    display: flex;
    align-items: center;
    min-width: 78px;
    justify-content: space-around;
    border-radius: 4px;
    border: 1px solid rgba(1, 1, 2, 0.145);
    margin: 10px 1px;
    font-size: 10px;
  }
  .cd-title {
    margin-bottom: 10px;
    font-size: 16px;
  }
  .course-wrapp {
    margin-bottom: 5px;
  }
  .ec-btn a {
    margin-right: 0px;
    font-size: 10px;
  }
  .comment-body p {
    font-size: 10px;
    margin-bottom: 12px;
    text-align: justify;
    line-height: 18px;
  }
  .no-mobile-height {
    height: 0px !important;
  }
  .ih-item.circle.effect1 .spinner {
    height: 120px;
    width: 120px;
  }
  .ih-item.circle.effect1.colored .info {
    height: 120px;
    width: 120px;
  }
  .info-back {
    height: 120px;
  }
  .ih-item.circle {
    height: 120px;
    position: relative;
  }
  .teacher-information {
    margin-right: 0px;
  }
  .ih-item.circle.effect1 .img {
    bottom: 5px;
    height: 110px;
    width: 110px;
    object-fit: cover;
    left: 5px;
    position: absolute;
    right: 0;
    top: 5px;
  }
  .boat {
    height: 250px;
    object-fit: contain;
    margin-top: 100px;
    display: flex;
    justify-content: center;
  }
  .blog-ctt {
    color: #fff;
    font-size: 16px;
    text-align: center;
  }
  .operating-system {
    background: -webkit-linear-gradient(-70deg, #ffffff 0%, #008d7f 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: rgba(0, 0, 0, 0);
    -webkit-box-decoration-break: clone;
    font-size: 14px;
    padding: 8px 8px;
  }
  .cat-blog-banner {
    height: 100px;
    background-image: url(/assets/images/header/1vg6px8xr4b71.webp);
    align-items: center;
    padding: 0px 10px;
  }
  .avatar-wroter {
    height: 45px;
    width: 45px;
  }
  .rw-names strong {
    color: #fff;
    font-size: 10px;
    margin-left: 15px;
  }
  .rw-names span {
    font-size: 10px;
    color: #9876ff;
  }
  .tags-each {
    padding: 5px 15px;
    margin: 3px;
    font-size: 10px;
  }
  .blc-row {
    display: flex;
    flex-direction: row-reverse;
    height: 60px;
  }
  .next-arrticle {
    height: 60px;
  }
  .next-arrticle a {
    font-size: 10px;
  }
  .rw-names p {
    font-size: 10px;
    color: #fff;
  }
  .img-mc {
    height: 140px;
  }
  .name-bl {
    font-size: 0.8rem;
    font-weight: 600;
  }
  .blog-bl {
    color: #ccc;
    margin-top: 15px;
    font-size: 10px;
    line-height: 20px;
  }
  .blog-wroter h2 {
    font-size: 10px;
  }
  .date-rote {
    font-size: 10px;
    margin-right: 0px;
  }
  .img-min {
    display: none;
  }
  .min-p {
    font-size: 10px;
    line-height: 18px;
    height: 50px;
    overflow: hidden;
  }
  .first-rows {
    border-top: none;
    padding-top: 20px;
    margin-top: 0px;
  }
  .cb-img {
    height: 20px;
    width: 20px;
    object-fit: cover;
    margin: 0px 5px;
  }
  .ct-link {
    font-size: 10px;
    color: #fff;
    font-weight: normal;
  }
  .category-bw {
    display: flex;
    flex-direction: row-reverse;
    height: 50px;
    align-items: center;
    justify-content: flex-start;
    cursor: pointer;
  }
  .so-margin {
    margin-top: 0px;
  }
  .img-bw {
    height: 120px;
  }
  .nb-wrap {
    border-bottom: none;
    padding: 5px 8px;
    height: 50px;
    overflow: hidden;
  }
  .nb-wrap a {
    color: #fff;
    font-size: 10px;
    line-height: 18px;
  }
  .crazy-padding {
    height: 250px;
  }
  .mini-img-parent {
    height: 30px;
    width: 30px;
    object-fit: contain;
    background: #191919;
    border-radius: 10px;
    position: relative;
    right: -15px;
    padding: 5px;
  }
  .colori-tag {
    font-size: 10px;
  }
  .colori {
    font-size: 10px;
  }
  .new-height {
    min-height: 420px;
    margin-top: 0px;
  }
  .ct-link {
    font-size: 10px;
    color: #fff;
    font-weight: normal;
  }
  .blog-master-row {
    direction: rtl;
    text-align: right;
    background: #191919;
    padding: 10px 0px;
    border-radius: 10px;
  }
  .img-mc {
    margin-bottom: 5px;
  }
  .each-blog-wrapping {
    height: 190px;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s ease-in-out;
  }
  .each-blog-wrapping:hover .mini-img-parent {
    right: 0px;
    padding: 0px;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s ease-out;
  }
  .each-blog-wrapping:hover {
    height: 240px;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s ease-in-out;
  }
  .category-call {
    width: 100%;
    font-size: 12px;
    text-align: right;
    direction: rtl;
    color: #fff;
    padding-right: 10px;
    padding-bottom: 15px;
  }
  .te-image {
    height: 40px;
    width: 65px;
    border-radius: 50%;
    margin-left: 5px;
  }
  .min-wrapp div.min-blog {
    border-bottom: 1px solid #fdf4ff;
  }
  .nm-min {
    font-size: 10px;
    margin: 5px 0px;
  }
  .margin-lio {
    margin: 0px 0px;
    padding: 20px 10px;
    padding-bottom: 70px;
  }
  .team-text p {
    color: rgb(219, 219, 219);
    font-size: 10px;
    margin-top: 30px;
    direction: rtl;
    text-align: justify;
    line-height: 26px;
  }
  .our-team {
    height: 208px;
    width: 100%;
    object-fit: cover;
    padding: 23px;
    position: absolute;
    top: -179px;
    z-index: -2;
  }
  .ser-box {
    font-size: 10px;
    margin: 10px 0px;
    font-weight: normal;
  }
  .our-box p {
    padding: 0px 5px;
    font-size: 10px;
    height: 50px;
    overflow: hidden;
    line-height: 16px;
  }
  .our-box {
    padding: 20px 5px;
    height: 140px;
    margin-bottom: 20px;
    width: 100%;
  }
  .hu-junk {
    height: 620px;
    padding: 70px 10px;
    padding-top: 100px;
    background: url(/assets/images/header/t.webp);
    display: flex;
    position: relative;
    top: -82px;
  }
  .name-team {
    font-size: 16px;
    color: #8400ff;
    text-align: right;
  }
  .c-icon {
    display: none;
  }
  .checkmark {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    display: block;
    stroke-width: 2;
    stroke: #f1a2ff;
    top: 30px;
    right: 5px;
    margin: 0 auto;
  }
  .c-name {
    text-align: right;
    padding: 0px 10px;
    min-width: 200px;
  }
  .remove-course {
    width: 25px;
    height: 25px;
    padding: 8px;
    background-color: rgb(223, 174, 252);
    border: none;
    text-align: center;
    margin-right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    cursor: pointer;
  }
  .offer-input {
    width: 60% !important;
  }
  .mario {
    margin-top: 0px;
  }
  .custom_radio input[type=radio] + label {
    position: relative;
    display: inline-block;
    padding-left: 0em;
    margin-right: 1em;
    cursor: pointer;
    line-height: 1em;
    font-size: 12px;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
  }
  form {
    padding: 10px;
  }
  .payment-way {
    padding-right: 0px;
    height: 70px;
    margin-bottom: 22px;
  }
  .pages-header {
    position: relative;
    height: 180px;
  }
  .contact-form-feild {
    width: 100% !important;
  }
  .contact-form-holder {
    padding: 15px;
  }
  .back-tp {
    border-radius: 8px;
    font-size: 12px;
    height: 40px;
    color: #fff !important;
    background: #754ffe;
    width: 160px;
    margin-top: 20px;
    border: none;
    background-size: 300% 100%;
    background-image: linear-gradient(to right, #9876ff, #f1a2ff, #f05a28);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    text-align: center;
  }
  .space-top {
    margin-top: 90px !important;
  }
  .notfound-section {
    height: 150px;
  }
  .blog-body p {
    font-size: 14px;
  }
  .dropdown-menu {
    position: absolute;
    top: 100%;
    right: 10px !important;
    z-index: 1000;
    left: auto;
    float: left;
    min-width: 10rem;
    padding: 0.5rem 0;
    margin: 0.125rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: rgb(241, 227, 255);
    background-clip: padding-box;
    border: none !important;
    border-radius: 0.25rem;
  }
  .header .item-right a p {
    font-size: 10px;
  }
  .padd-zero a {
    padding: 0px !important;
    margin-left: 0px;
  }
  .sidebar {
    width: 70px !important;
  }
  .each-ticket h6 {
    color: #080631;
    font-size: 10px;
  }
  .dropdown-item img {
    height: 25px;
    margin-left: 5px;
  }
  .sidebar {
    width: 70px;
  }
  .collpse-content {
    display: none;
  }
  .in-rights {
    padding-right: 68px;
    direction: rtl;
    display: flex;
    justify-content: end !important;
    transition: all ease-in-out 0.5s;
  }
  .ticket-box {
    margin-bottom: 12px;
  }
  .each-ticket {
    display: flex;
    flex-direction: column;
    text-align: center;
    align-items: center;
    justify-content: center;
    height: 100px;
    border-radius: 4px;
  }
  .ticket-title {
    font-size: 10px;
    font-weight: normal;
    margin: 4px 0px;
  }
  .ticket-icm {
    height: 42px;
  }
  .logo {
    width: 40px;
    position: relative;
    right: 30px;
    max-height: 45px;
  }
  .sidebar-logo .logo {
    max-height: unset;
  }
  .submitting {
    padding: 3px 8px;
    font-size: 14px;
    margin-right: 0px;
    height: 35px;
  }
  .search-btn {
    font-size: 14px;
  }
  .search-box-holder {
    z-index: 1;
    margin-left: 2px;
    padding-left: 0px;
  }
  .sun-icon-wrapper {
    position: absolute;
    height: 20px;
    width: 20px;
  }
  .search-box.search-elem .inner {
    top: 30%;
  }
  .search-box.search-elem label.placeholder {
    position: absolute;
    top: 14px;
    right: 2rem;
    font-size: 12px;
  }
  .search-box.search-elem button.submit {
    outline: none;
    top: 0;
    right: 15px;
    height: 45px;
    padding: 10px 1rem;
    width: 160px;
    border-radius: 5px;
    margin-right: 0px;
    margin-top: 20px;
    font-size: 13px;
  }
  .search-box.search-elem input[type=text]::placeholder {
    font-size: 13px;
  }
  .btn svg {
    position: absolute;
    left: -36px;
    width: 190px;
    top: 5px;
    display: none;
  }
  .no-height img {
    height: 300px;
    opacity: 0.2;
    filter: grayscale(1);
  }
  .avatar {
    position: relative;
    display: flex;
    align-items: center;
    width: 55px;
    height: 24px;
    font-size: 12px;
  }
  .toggle-slot {
    position: relative;
    height: 32px !important;
    width: 33px !important;
    border-radius: 6px;
    transition: background-color 250ms;
    margin-right: 6px;
    border: 1px solid rgba(255, 255, 255, 0.3411764706);
  }
  .coursers-wrapp {
    height: 70px;
  }
  .all-you-need {
    font-size: 16px;
  }
  .tako {
    font-size: 18px;
  }
  .cup-of-coffee {
    height: 80px;
    width: 80px;
    object-fit: contain;
    z-index: 2;
  }
  .mobile {
    height: 95px;
    width: 61px;
    object-fit: contain;
    position: absolute;
    top: -50px;
    left: -12px;
  }
  .left-seq {
    display: none;
  }
  .bt-nice {
    padding: 10px 20px !important;
  }
  .filter-wrapping {
    margin-top: 5px;
  }
  .wrapp-second {
    margin-right: 30px;
    padding-top: 15px;
  }
  .price {
    margin-top: 0px;
  }
  .wrapp-first {
    width: 80%;
    margin-top: 12px;
  }
  .wrapp-second {
    width: 20%;
    display: flex;
    justify-content: flex-end;
    text-align: left;
  }
  .content-cf {
    padding: 0px;
  }
  .filter-box {
    padding-left: 0px;
  }
  .wrapp-second {
    margin-right: 0px;
  }
  .blck-cc {
    color: rgb(255, 255, 255);
    font-size: 10px;
  }
  .cart-img {
    border-radius: 5px 5px 0px 0px;
    height: 120px;
    width: 100%;
    object-fit: cover;
  }
  .cart-course {
    padding: 5px;
  }
  .logo-track {
    height: 30px;
    width: 30px;
    object-fit: cover;
    margin-left: 28px;
    padding: 0px;
  }
  header .desk-menu .menu-container {
    float: right;
    justify-content: normal;
    flex-direction: column;
    z-index: 10;
  }
  .ordering-title {
    font-size: 10px;
    color: #fff;
    text-align: right;
  }
  .order-cp {
    font-size: 10px;
  }
  .caption-pc {
    display: none;
  }
  .ic-img {
    width: 35%;
    height: 60px;
    object-fit: cover;
    border-radius: 4px;
  }
  .see-that {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    width: 30%;
  }
  .nc-cart {
    font-size: 10px;
    font-size: 22px;
  }
  .panel-boxes {
    display: flex;
    height: 100px;
    padding: 7px;
    direction: rtl;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0px 0px 4px 0 rgba(0, 0, 0, 0.05);
    border-radius: 8px;
    align-items: center;
    background: #090909;
    max-width: 100%;
    overflow: hidden;
  }
  .see-that a {
    color: #410770;
    border-bottom: 1px solid #ccc;
    font-size: 10px;
  }
  .ignore-padding {
    padding: 5px 5px;
  }
  .sidebar-nav li a {
    padding-left: 20px;
    font-size: 14px;
    text-decoration: none;
    float: right;
    text-decoration: none;
    width: 100%;
    height: 60px;
    line-height: 25px;
    vertical-align: center;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .title-footer {
    font-size: 14px;
    font-weight: 600;
  }
  .footer-ul > li > a {
    font-size: 12px;
    margin-top: 15px;
  }
  #sidebar-wrapper {
    width: 72px;
  }
  .all-courses-view span {
    font-size: 10px;
    font-weight: normal;
  }
  .notification {
    padding: 5px 15px;
    margin-top: 0px;
  }
  .this-panel > .col-lg-12 > .row > .col-lg-3 {
    padding: 8px;
  }
  .mp-check {
    padding: 0px;
  }
  .collapse > .card-body {
    padding: 5px;
  }
  .so-pill {
    padding: 0px 20px;
    margin-bottom: 0px;
    display: flex;
    align-items: center;
    border-bottom: 1px solid rgba(152, 118, 255, 0.2196078431);
  }
  .notification {
    padding: 5px 15px;
    margin-top: 10px;
    width: 130px;
  }
  .notification span {
    margin-right: 8px;
    font-size: 10px;
    color: #30025c;
    font-weight: normal;
  }
  .table > tbody > tr > td,
  .table > tbody > tr > th,
  .table > tfoot > tr > td,
  .table > tfoot > tr > th,
  .table > thead > tr > td,
  .table > thead > tr > th {
    padding: 5px;
    line-height: 1.42857143;
    vertical-align: middle;
    border-top: 1px solid #ddd;
  }
  header .hamburger-menu {
    top: 44px;
    right: 0;
  }
  .certi-box img {
    height: 60%;
    width: 100%;
    object-fit: cover;
  }
  .nice-btn {
    width: 85px;
    height: 45px;
    font-size: 10px;
  }
  .width-control::placeholder {
    font-size: 10px;
  }
  .width-control {
    height: 45px;
    background: transparent;
    border-radius: 30px;
    border: 1px solid #614181;
    border-left: none;
    padding: 0px 20px;
  }
  .details-cr {
    display: flex;
    flex-direction: column;
    padding: 0px 5px;
    width: 70%;
    max-width: 70%;
    overflow: hidden;
    border-left: 1px dashed #a0a0a0;
    justify-content: flex-start;
  }
  .see-that a {
    border-bottom: 1px solid #ccc;
    font-size: 8px;
  }
  .certi-box {
    height: 160px;
    width: 80px;
    object-fit: cover;
    padding: 10px;
    display: flex;
    /* justify-content: space-evenly; */
  }
  .new-courses div {
    width: 40%;
  }
  header .hamburger-menu .bar::after {
    top: 7px;
  }
  header .hamburger-menu .bar::before {
    bottom: 7px;
  }
  header .hamburger-menu .bar,
  header .hamburger-menu .bar::after,
  header .hamburger-menu .bar::before {
    width: 21px;
    height: 2px;
  }
  .ic-img {
    width: 35%;
    height: 82px;
    object-fit: cover;
    border-radius: 4px;
    display: none;
  }
  #ShowUserAccount h6 {
    text-align: center;
  }
  .each-mcourse {
    display: flex;
    direction: rtl;
    background: rgba(196, 101, 220, 0.0705882353);
    align-items: center;
    border-radius: 8px;
    height: 60px;
    overflow: hidden;
  }
  .new-title {
    font-size: 10px;
    text-align: right;
  }
  .each-new p {
    font-size: 10px;
    padding: 10px 0px;
  }
  .each-new p {
    font-size: 8px;
    padding: 10px 0px;
    line-height: 17px;
  }
  .badge-color {
    background-color: #fc6400;
    padding: 2px 12px;
    padding-bottom: 6px;
    margin-bottom: 12px;
  }
  .each-new {
    padding: 10px 10px;
    border-radius: 8px;
    margin: 20px 0px;
  }
  .new-title {
    font-size: 10px;
    text-align: right;
    line-height: 20px;
  }
  .see-news {
    text-align: left;
    float: left;
    color: #7509ec;
    font-size: 10px;
    border-bottom: 1px solid #ccc;
  }
  .s-title {
    font-size: 15px;
  }
  header .hamburger-menu {
    top: 80px;
    right: -42px;
  }
  .cart-title h6 {
    color: rgb(255, 255, 255);
    height: 40px;
    font-size: 9px;
    padding: 2px 8px;
    margin-top: 5px;
    margin-bottom: 2px;
    line-height: 18px;
    overflow: hidden;
  }
  .pay {
    font-size: 10px;
  }
  .course-level p {
    font-size: 8px;
    line-height: 20px;
  }
  .course-level {
    width: max-content;
    padding: 0px 8px;
    padding-bottom: 2px;
    border-radius: 3px;
    height: 18px;
  }
  .time p {
    font-size: 10px;
    width: 72px;
    color: #d7a7ff;
  }
  .see-all {
    margin-top: 15px;
    padding: 15px 10px;
    border-radius: 50px;
    height: 30px;
    border: 1px solid rgb(125, 75, 255);
    display: flex;
    align-items: center;
    /* direction: ltr; */
    width: max-content;
    flex-direction: row;
    justify-content: flex-start;
  }
  .see-all span {
    color: rgb(255, 255, 255);
    margin-left: 10px;
    font-size: 8px;
  }
  .arroww-ass {
    height: 20px;
    width: 15px;
  }
  .ta-height img {
    height: 35px;
  }
  .stranger-padding {
    padding: 1px 25px;
  }
  .money p {
    font-size: 10px;
    color: #d7a7ff;
  }
  .ser-line {
    text-align: right;
    display: flex;
    flex-direction: column;
    padding: 0px 0px;
  }
  .track-title {
    font-size: 16px !important;
  }
  .track-capt {
    margin-top: 10px;
    font-size: 10px !important;
  }
  .bird-padding {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding-right: 0px;
  }
  .logo-track {
    height: 25px;
    width: 25px;
    object-fit: cover;
    margin-left: 8px;
    padding: 0px;
  }
  .nw-cr {
    font-size: 18px !important;
    padding-bottom: 0px;
    border-radius: 4px;
  }
  .into-top {
    margin-bottom: 10px;
  }
  .details-course li a {
    font-size: 10px !important;
    color: rgb(168, 164, 163);
  }
  .name-track {
    font-size: 12px !important;
  }
  .bird-padding {
    padding: 0px;
    margin-top: 0px;
  }
  .mini-capt {
    text-align: right;
    margin-right: 0px !important;
    color: rgb(255, 255, 255);
    margin-top: 10px;
    padding: 0px 0px;
  }
  .purple-line {
    margin-right: 0px;
  }
  .blog-intro {
    line-height: 20px;
    font-size: 10px;
    height: 40px;
    overflow: hidden;
    margin-top: 5px;
    display: flex;
    color: rgb(255, 255, 255);
    align-items: flex-start;
  }
  .bi-hold {
    background-color: rgb(35, 35, 35);
    height: 37px;
    width: 40px;
    border-radius: 50%;
    margin-left: 20px;
  }
  .blog-setting {
    display: flex;
    margin-top: 10px;
    align-items: center;
  }
  .blog-caption {
    text-align: right;
    font-size: 9px;
    height: 53px;
    line-height: 20px;
    overflow: hidden;
    color: #fff;
  }
  .academy-image {
    height: 80px;
    width: 108px;
    object-fit: cover;
    margin-top: 5px;
    overflow: hidden;
  }
  .box-ac {
    height: 85px;
    width: 108px;
    border-radius: 6px;
    margin: 8px 6px;
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
  .ico-cc {
    height: 20px;
    width: 20px;
    object-fit: contain;
  }
  .t-box {
    font-size: 10px;
    margin-top: 8px;
    margin-bottom: 2px;
  }
  .type-of {
    margin: 2px;
    font-size: 9px;
  }
  .text-content {
    padding: 20px 18px;
    background-color: #191919;
    background-image: url(/assets/images/vectors/course-bg.webp);
    background-size: 500px;
    background-position: top left;
    background-repeat: no-repeat;
    -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15) !important;
    box-shadow: 0px 1px 0px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15) !important;
    border-radius: 6px;
    margin-top: 8px;
    text-align: right;
  }
  .title-academy {
    font-size: 14px;
    margin-top: 15px;
    margin-bottom: 15px;
    color: rgb(152, 118, 255) !important;
  }
  .ac-text {
    text-align: justify;
    font-size: 9px;
    line-height: 24px;
  }
  .see-all {
    margin-top: 15px;
    padding: 10px 10px;
    border-radius: 50px;
    height: 25px;
  }
  .blog-user {
    font-size: 10px;
    color: #fff;
  }
  .nice-btn {
    width: 85px;
    height: 32px;
    font-size: 10px;
    z-index: 2 !important;
  }
  .width-control {
    height: 32px;
    background: #19171c;
    border-radius: 30px;
    border: 1px solid #614181;
    border-left: none;
    padding: 0px 20px;
    z-index: 1 !important;
  }
  .width-control:active,
  .width-control:focus {
    height: 32px;
    background: #19171c;
    border-radius: 30px;
    border: 1px solid #614181;
    border-left: none;
    padding: 0px 20px;
    z-index: 1 !important;
  }
  .title-footer {
    font-size: 14px;
    font-weight: 600;
  }
  .footer-ul > li > a {
    font-size: 12px;
    margin-top: 15px;
  }
  .right-decore img {
    height: 550px;
    position: absolute;
    right: 10px;
    opacity: 0.4;
  }
  .blog-wrapper {
    margin: 0px !important;
    margin-bottom: 30px !important;
  }
  .blog-wrapper .blog-banner .category-label {
    top: -26px;
    right: -8px;
    font-size: 10px;
    padding: 2px 10px;
    border-radius: 4px 0px 0px 4px;
    background: linear-gradient(304deg, #e6e2f1 0.64%, #b17fe0 98.23%);
  }
  .blog-wrapper .tag-in p {
    font-size: 10px;
  }
  .blog-wrapper {
    height: 16rem;
    padding: 8px;
    margin: 0px;
    margin-bottom: 30px;
  }
  .blog-wrapper .blog-banner-wraper {
    height: 80px;
    top: -30px;
  }
  .blog-wrapper .blog-banner {
    height: 80px;
    margin-bottom: 0px;
  }
  .blog-wrapper .blog-intro {
    line-height: 22px;
    font-size: 12px;
    font-weight: 600;
    height: 60px;
    overflow: hidden;
    margin-bottom: 0px;
    display: flex;
    align-items: flex-start;
  }
  .blog-wrapper .blog-caption {
    font-size: 10px;
    height: 65px;
    line-height: 17px;
    overflow: hidden;
  }
  .blog-wrapper .blog-setting {
    display: flex;
    margin-top: 8px;
  }
  .blog-wrapper .blog-user {
    display: none;
  }
  .each-row {
    justify-content: space-between;
  }
  .alert-cart {
    margin-bottom: 30px;
    margin-top: 30px;
  }
  .rtl-row {
    margin-top: 100px;
  }
  .body .scene_saturn {
    width: 100px;
    height: 100px;
  }
  .success-box {
    height: 300px;
    padding: 30px 20;
  }
}
@media only screen and (min-width: 1460px) {
  .max {
    /* max-width: 1600px; */
    margin-top: 0px;
  }
  .no-padding {
    padding: 0px;
  }
  /* min     */
}
@media only screen and (min-width: 1536px) {
  .max {
    /* max-width: 1600px; */
    margin-top: 0px;
  }
  .no-padding {
    padding: 0px;
  }
}
@media only screen and (min-width: 1347px) and (max-width: 1366px) {
  .max {
    margin-top: 0px;
  }
}
header {
  box-shadow: rgba(0, 0, 0, 0.11) 0px 10px 18px 0px, rgba(0, 0, 0, 0) 0px 4px 6px -2px !important;
}

.modal-backdrop {
  position: relative !important;
  top: 0;
  left: 0;
  z-index: 1040;
  width: 100vw;
  height: 100vh;
  background-color: #000;
}

@media (min-width: 576px) {
  .modal-dialog {
    margin: 1.75rem auto;
  }
}
@media only screen and (min-width: 3002px) and (max-width: 4000px) {
  .max {
    max-width: 1600px;
    margin-top: 0px;
  }
}
@media only screen and (min-width: 4001px) and (max-width: 6144px) {
  .max {
    max-width: 1600px;
    margin-top: 0px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1540px) {
  .gallery-content .gallery-text {
    font-size: 12px;
    width: 100%;
    line-height: 22px;
    text-align: right;
    direction: rtl;
    font-weight: 500;
    color: #616161;
    overflow: hidden;
    font-family: IRANYekan !important;
    margin-bottom: 0px;
    display: -webkit-box;
    max-width: 400px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
.agree-term {
  display: inline-block;
  width: 15px !important;
}

.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.mini-padding {
  padding: 0 25px;
}

.rounded {
  border-radius: 8px;
}

.medium-top-space {
  margin-top: 25px;
}

.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

body {
  margin: 0;
}

.main-slider {
  margin-top: 155px;
  padding: 0px !important;
  border-radius: 12px;
}
.main-slider .carousel-item {
  border-radius: 12px;
}

.rounded-slider {
  border-radius: 20px !important;
}

/* ----------------- Start Main-Slider */
.main-slider {
  border-radius: 8px;
  margin-bottom: 2px;
  border: 0;
  border-radius: 12px;
}

.main-slider-cs {
  height: auto;
  overflow: hidden;
}

#main-slider-res {
  height: auto;
}

.main-slider .carousel-indicators li {
  width: 8px;
  height: 8px;
  margin-right: 6px;
  margin-left: 6px;
  border: 0;
  border-radius: 50%;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1);
  background: rgba(255, 255, 255, 0.75);
  cursor: pointer;
  -webkit-transition: all 0.2s ease-in-out !important;
  transition: all 0.2s ease-in-out !important;
}

.main-slider .carousel-indicators li.active {
  background: #fff;
  width: 40px;
  border-radius: 25px;
}

.main-slider .carousel-control-next {
  left: 0;
  right: auto;
  font-size: 45px;
}

.carousel-control-next,
.main-slider .carousel-control-prev {
  right: 0;
  left: auto;
  font-size: 45px;
  display: flex;
  align-items: center;
}

.main-slider .carousel-inner {
  height: 100%;
}

.baner-partner {
  height: 55px;
}

.main-slider .carousel-inner .carousel-item {
  height: 100%;
  object-fit: cover;
  border-radius: 10px;
  display: flex;
  align-items: end;
  height: 450px;
}

.main-sliders {
  border-radius: 12px;
}

.main-slider-slide {
  display: block;
  width: 100%;
  height: 450px;
  object-fit: cover;
  transition: all 0.3s ease-in-out;
  position: relative;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: cover;
  border-radius: 12px;
  cursor: pointer;
  cursor: pointer;
}
.main-slider-slide img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 12px;
}

.carousel-indicators {
  position: absolute;
  right: 0;
  bottom: 40px;
  left: 0;
  z-index: 15;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  padding-left: 0;
  margin-right: 15%;
  margin-left: 15%;
  list-style: none;
}

#main-slider-res .main-slider-slide img {
  border-radius: 10px;
  width: 100%;
}

/* End Main-Slider------------ */
.no-padding {
  padding: 0px;
}

.gradient-bar {
  align-items: flex-end;
}

.subscribe-form button i {
  color: #fff;
  font-size: 25px;
  transform: rotate(-6deg);
}

.copyright-area {
  background: #151515;
  padding: 12px 0;
  width: 100%;
  direction: rtl;
  text-align: right;
}

.ads-align {
  display: flex;
  justify-content: end;
}

.dotnettime {
  background-color: #000000;
  padding: 5px 15px 15px 10px;
}

.dotnettime-section {
  direction: rtl;
}

.dotnettime-area {
  display: flex;
  align-items: center;
}

.dotnettime-area a {
  filter: grayscale(0.6);
}

.dotnettime-area a:hover {
  filter: grayscale(0);
}

.dotnettime-area img {
  height: 14px;
  object-fit: contain;
}

.dotnettime-area span {
  margin-bottom: 0;
  font-size: 12px;
  color: #6f50c3;
  display: inline-block;
  margin-top: 9px;
}

.copyright-text-p {
  font-size: 12px;
  color: #7c68b3;
}

.copyright-text p {
  margin: 0;
  font-size: 14px;
  color: #878787;
  text-align: center;
}

.copyright-text p a {
  color: #ffca1e;
}

.footer-menu li {
  display: inline-block;
  margin-left: 20px;
}

.footer-menu li:hover a {
  color: #ffca1e;
}

.footer-menu li a {
  font-size: 14px;
  color: #878787;
}

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

.footer-widget {
  color: #fff;
}

.topper-footer {
  background-image: url(../../assets/images/Services/topper.webp);
  height: 100px;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  align-items: center;
  margin-top: 50px;
}

.blogs {
  margin-top: 60px;
  margin-bottom: 60px;
}

.footer-widget ul {
  list-style: none;
}

.owl-item .item {
  transform: translate3d(0, 0, 0);
  margin: 0px 0;
}

@media (max-width: 480px) {
  .layout.rtl .sidebar.break-point-xs {
    left: auto;
    right: -280px;
  }
  .layout.rtl .sidebar.break-point-xs.collapsed {
    left: auto;
    right: -80px;
  }
  .layout.rtl .sidebar.break-point-xs.toggled {
    left: auto;
    right: 0;
  }
}
@media (max-width: 576px) {
  .layout.rtl .sidebar.break-point-sm {
    left: auto;
    right: -280px;
  }
  .layout.rtl .sidebar.break-point-sm.collapsed {
    left: auto;
    right: -80px;
  }
  .layout.rtl .sidebar.break-point-sm.toggled {
    left: auto;
    right: 0;
  }
}
@media (max-width: 992px) {
  .layout.rtl .sidebar.break-point-lg {
    left: auto;
    right: -280px;
  }
  .layout.rtl .sidebar.break-point-lg.collapsed {
    left: auto;
    right: -80px;
  }
  .layout.rtl .sidebar.break-point-lg.toggled {
    left: auto;
    right: 0;
  }
}
@media (max-width: 1200px) {
  .layout.rtl .sidebar.break-point-xl {
    left: auto;
    right: -280px;
  }
  .layout.rtl .sidebar.break-point-xl.collapsed {
    left: auto;
    right: -80px;
  }
  .layout.rtl .sidebar.break-point-xl.toggled {
    left: auto;
    right: 0;
  }
}
.layout .header {
  box-shadow: 1px 1px 4px #9aa0b9;
  display: flex;
  align-items: center;
  padding: 20px;
}

.layout .content {
  padding: 20px;
  display: flex;
  flex-direction: column;
}

.layout .footer {
  text-align: center;
  margin-top: auto;
  margin-bottom: 20px;
  padding: 20px;
}

.layout.rtl .header {
  box-shadow: -1px 1px 4px #9aa0b9;
}

.sidebar {
  color: #1e1e1e;
  overflow-x: hidden !important;
  position: relative;
  background-color: #ffffff;
  border: 1px solid #dcdcdc;
  border-radius: 10px;
}

.sidebar .image-wrapper {
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0.2;
  z-index: 1;
  display: none;
}

.sidebar .image-wrapper > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.sidebar.has-bg-image .image-wrapper {
  display: block;
}

.sidebar .sidebar-layout {
  height: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 2;
}

.sidebar .sidebar-layout .sidebar-header {
  height: 64px;
  min-height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  border-bottom: 1px solid rgba(83, 93, 125, 0.087);
}

.sidebar .sidebar-layout .sidebar-header > span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #000;
  margin-right: 10px;
}

.sidebar .sidebar-layout .sidebar-content {
  flex-grow: 1;
  padding: 10px 0;
}

.sidebar .sidebar-layout .sidebar-footer {
  height: 64px;
  min-height: 64px;
  display: flex;
  align-items: center;
  border-top: 1px solid rgba(83, 93, 125, 0.3);
  padding: 0 20px;
}

.sidebar .sidebar-layout .sidebar-footer > span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@media (max-width: 575px) {
  .trees li input {
    height: 10px;
  }
}
.search-box.search-elem {
  margin: 0;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
  background: rgba(50, 33, 58, 0.9);
  transition: all 0.3s ease-in-out;
  -webkit-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
}

.search-box.search-elem .inner {
  width: 70%;
  margin: 0 auto;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}

.search-box.search-elem label {
  color: white;
  font-weight: 300;
}

.search-box.search-elem button.submit {
  outline: none;
  top: 0;
  right: 15px;
  height: 73px;
  padding: 10px 2rem;
  background: #9d53ff;
  font-size: 1rem;
  color: white;
  width: 200px;
  border-radius: 0px;
  margin-top: 0px;
}

.search-box.search-elem button.submit[disabled] {
  background: #a589fb;
  color: #32213a;
}

.in-fld {
  display: flex;
  align-items: center;
}

.search-box.search-elem input[type=text] {
  padding: 20px;
  height: 72px;
  font-size: 22px;
  font-weight: 300;
  border: none;
  border-bottom: solid 2px #999;
  transition: border 0.3s;
  border-radius: 0;
  color: #000 !important;
  width: 100% !important;
}

.search-box.search-elem input[type=text]:focus {
  border-bottom: solid 2px #00a896;
  box-shadow: none;
}

.as-first {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 30px;
}

.slash {
  color: #c7c7c7;
}

.boot-link {
  color: #747474;
}

.active-road {
  color: #150055;
}

.search-box.search-elem label.placeholder {
  position: absolute;
  top: 22px;
  right: 3rem;
  font-size: 20px;
  font-weight: 300;
  color: #999;
  transition: all 0.3s;
}

.search-box.search-elem label.placeholder.move-up {
  top: -25px;
  color: white;
  font-size: 1rem;
}

.right-padding {
  padding-right: 20px;
}

.categories-title {
  text-align: right;
}
.categories-title h3 {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 28px;
}

.categories-area {
  margin-top: 40px;
}

.category-box {
  background-color: #eef2f6;
  border-radius: 12px;
  padding: 8px 15px;
  height: 180px;
  margin-bottom: 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.category-icon-holder {
  margin-bottom: 12px;
  object-fit: contain;
  height: 80px;
  width: 80px;
  padding: 15px;
  border-radius: 50px;
  background-color: #fff;
  box-shadow: 0px 0px 8px 5px rgba(22, 22, 22, 0.07);
}
.category-icon-holder img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.category-tile {
  font-size: 16px;
  font-weight: 600;
  margin-top: 15px;
}

.category-caption {
  margin-top: 10px;
  text-align: center;
  font-size: 14px;
}

.categories-area {
  direction: rtl;
}

.all-categoreis-row {
  display: flex;
  justify-content: center;
  margin: 25px 0px;
  margin-top: 55px;
}

.footer-design {
  margin-top: 0px;
  padding: 30px 0px;
  direction: rtl;
  display: flex;
  justify-content: center;
  text-align: right;
  background: #1e1e1e;
}

.warranty-boxes {
  display: flex;
  width: 100%;
}

.each-boxes {
  width: 25%;
  flex-direction: column;
  display: flex;
  align-items: center;
}

.bi-wrapper {
  height: 50px;
  width: 50px;
  object-fit: contain;
}

.warranty-title {
  font-size: 12px;
  margin-top: 15px;
}

.bi-wrapper img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.footer-social-icon a {
  color: #fff;
  font-size: 16px;
  margin-left: 5px;
}

.footer-social-icon i {
  height: 40px;
  width: 30px;
  text-align: center;
  border-radius: 50%;
  color: #6f7086;
  font-size: 30px;
  padding: 10px 14px;
}

.footer-widget-heading h3 {
  color: #fff;
  font-size: 14px;
  font-weight: normal;
  margin-bottom: 22px;
  position: relative;
  text-align: right;
}

.footer-widget-heading h3::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: -15px;
  height: 2px;
  width: 50px;
  background: #ffca1e;
}

.footer-widget ul li {
  margin-bottom: 12px;
  text-align: right;
}

.footer-widget ul li a:hover {
  color: #ffca1e;
}

.footer-widget ul li a {
  color: #d6d6d6;
  text-transform: capitalize;
}

.subscribe-form {
  position: relative;
  overflow: hidden;
}

.subscribe-form input {
  width: 100%;
  padding: 14px 28px;
  background: #f8f8f8;
  border: 1px solid #e2e2e2;
  color: #fff;
  border-radius: 5px;
}

.subscribe-form button {
  position: absolute;
  left: 0;
  background: #ffca1e;
  padding: 7px 20px;
  border: 1px solid #ffca1e;
  top: 0px;
  height: 51px;
  border-radius: 5px;
}

.adress-modal-icon {
  position: absolute;
  position: absolute;
  right: 10px;
  top: 8px;
  z-index: 10000;
}

.adress-modal-icon i {
  font-size: 12px;
  color: rgb(132, 132, 132);
}

.subscribe-form button i {
  color: #fff;
  font-size: 25px;
  transform: rotate(-6deg);
}

.ads-align {
  display: flex;
  justify-content: end;
}

.dotnettime-section {
  direction: rtl;
}

.dotnettime-area {
  display: flex;
  align-items: center;
}

.dotnettime-area a {
  filter: grayscale(0.6);
}

.dotnettime-area a:hover {
  filter: grayscale(0);
}

.dotnettime-area img {
  height: 14px;
  object-fit: contain;
}

.dotnettime-area span {
  margin-bottom: 0;
  font-size: 12px;
  color: #6f50c3;
  display: inline-block;
  margin-top: 9px;
}

.copyright-text-p {
  font-size: 12px;
  color: #7c68b3;
}

.copyright-text p {
  margin: 0;
  font-size: 14px;
  color: #878787;
  text-align: center;
}

.copyright-text p a {
  color: #ffca1e;
}

.footer-menu li {
  display: inline-block;
  margin-left: 20px;
}

.footer-menu li:hover a {
  color: #ffca1e;
}

.footer-menu li a {
  font-size: 14px;
  color: #878787;
}

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

.footer-widget {
  color: #fff;
}

.topper-footer {
  background-image: url(../../assets/images/Services/topper.webp);
  height: 100px;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  align-items: center;
  margin-top: 50px;
}

.class-time {
  color: #fff;
  font-weight: 600;
  font-size: 14px;
}

.class-time-details p {
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  background: rgba(0, 0, 0, 0.7098039216);
  border-radius: 10px;
  padding: 0px 20px;
  width: fit-content;
}
.class-time-details p strong {
  color: #cfbbff;
}

.footer-logo img {
  max-width: 180px;
  margin-bottom: 12px;
}

.payment-method {
  height: 80px;
  width: 80px;
  object-fit: contain;
  border-radius: 8px;
  padding: 5px;
  margin: 8px;
}

.payment-method a img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.certificate-area {
  height: 82px;
  width: 82px;
  object-fit: contain;
  border-radius: 8px;
  padding: 8px;
  margin: 8px;
  background: rgba(255, 255, 255, 0.231372549);
}

.certificate-area a img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.footer-text p {
  margin-bottom: 14px;
  font-size: 14px;
  color: #d6d6d6;
  line-height: 26px;
  text-align: justify;
}

.footer-social-icon span {
  color: rgb(203, 203, 203);
  display: block;
  font-size: 14px;
  font-weight: normal;
  margin-bottom: 20px;
}

.certificated-parent {
  display: flex;
  justify-content: flex-start;
}

.warranty-boxes {
  display: flex;
  width: 100%;
}

.each-boxes {
  width: 25%;
  flex-direction: column;
  display: flex;
  align-items: center;
}

.bi-wrapper {
  height: 50px;
  width: 50px;
  object-fit: contain;
}

.warranty-title {
  font-size: 12px;
  margin-top: 15px;
}

.bi-wrapper img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.footer-social-icon a {
  color: #fff;
  font-size: 16px;
  margin-left: 5px;
}

.footer-social-icon i {
  height: 40px;
  width: 30px;
  text-align: center;
  border-radius: 50%;
  color: #6f7086;
  font-size: 30px;
  padding: 10px 14px;
}
.footer-social-icon i:hover {
  color: #ffca1e;
}

.footer-widget-heading h3 {
  color: #fff;
  font-size: 14px;
  font-weight: normal;
  margin-bottom: 22px;
  position: relative;
  text-align: right;
}

.footer-widget-heading h3::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: -15px;
  height: 2px;
  width: 50px;
  background: #ffca1e;
}

.footer-widget ul li {
  margin-bottom: 12px;
  text-align: right;
}

.footer-widget ul li a:hover {
  color: #ffca1e;
}

.footer-widget ul li a {
  color: #d6d6d6;
  text-transform: capitalize;
}

.subscribe-form {
  position: relative;
  overflow: hidden;
}

.subscribe-form input {
  width: 100%;
  padding: 14px 28px;
  background: #f8f8f8;
  border: 1px solid #e2e2e2;
  color: #fff;
  border-radius: 5px;
}

.course-page-header {
  margin-top: 125px;
  height: 630px;
  background-color: #1e1e1e;
  background-image: url(../../assets/images/vectors/header.svg);
  margin-bottom: 40px;
  direction: rtl;
  padding: 40px 0px;
}

.w-name-course {
  font-size: 2rem;
  color: #fff;
  margin-bottom: 20px;
  text-align: right;
  direction: rtl;
  line-height: 50px;
}

.courses-banner {
  height: 750px;
  background: center;
  background-image: url(/assets/images/header/course-bg.svg);
  background-size: cover;
  position: relative;
  top: -82px;
}

.w-video-box video {
  height: 350px;
  max-width: 100%;
  border-radius: 8px;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.buy-caption {
  padding: 10px 15px;
  border-radius: 8px;
  background: rgb(226, 193, 255);
}

.w-left-course-hero {
  display: flex;
  align-items: start;
}

.breadcrumb {
  display: flex;
  margin-top: 25px;
}
.breadcrumb ul {
  list-style: none;
  display: flex;
  padding-right: 20px;
  color: #fff;
}
.breadcrumb ul li {
  margin: 0px 5px;
}
.breadcrumb ul i {
  font-size: 16px;
  color: #fff;
}
.breadcrumb ul .active-link {
  color: #ffca1e;
}

.course-name {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 36px;
  margin-bottom: 20px;
  color: #fff;
}

.course-main-details {
  margin-top: 15px;
}

.course-caption {
  width: 90%;
  padding-left: 50px;
}
.course-caption p {
  direction: rtl;
  text-align: justify;
  color: #dcdcdc;
}

.course-qty {
  margin-top: 30px;
  display: flex;
}
.course-qty .course-qty-box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}
.course-qty .course-qty-box span {
  color: #ccc;
  font-size: 16px;
  margin-bottom: 15px;
}
.course-qty .course-qty-box strong {
  font-size: 20px;
  color: #fff;
}

.under-line {
  width: 30px;
  height: 3px;
  background: #ffca1e;
}

.w-video-box {
  display: flex;
  justify-content: flex-end;
}

.course-sumbit-btn {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 26px;
  padding: 8px 30px;
  border-radius: 4px;
  width: max-content;
  background: #ffca1e;
  color: #000;
  display: block;
  margin: 30px 0;
}

.course-star {
  padding-right: 60px;
  display: flex;
  align-items: center;
  color: #fff;
}
.course-star strong {
  margin-top: -5px;
}
.course-star i {
  font-size: 24px;
  margin-left: 20px;
  color: #ffca1e;
}

.courses-post {
  margin-bottom: 15px;
}

.w-name-course {
  font-size: 2rem;
  color: #fff;
  margin-bottom: 20px;
  text-align: right;
  direction: rtl;
  line-height: 50px;
}

.courses-banner {
  height: 750px;
  background: center;
  background-image: url(/assets/images/header/course-bg.svg);
  background-size: cover;
  position: relative;
  top: -82px;
}

.w-video-box video {
  height: 320px;
  max-width: 100%;
  border-radius: 8px;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.buy-caption {
  padding: 10px 15px;
  border-radius: 8px;
  background: rgb(226, 193, 255);
}

.w-left-course-hero {
  display: flex;
  align-items: start;
}

.mini-caption {
  color: #efefef;
}
.mini-caption ul {
  margin-bottom: 0px;
  text-decoration: none;
  padding-right: 0;
}
.mini-caption ul li {
  text-decoration: none;
  list-style: none;
  font-size: 16px;
  display: flex;
  align-items: center;
  margin-bottom: 12px;
}
.mini-caption ul li i {
  margin-left: 8px;
  font-size: 16px;
}
.mini-caption p {
  color: #efefef;
  height: 120px;
  min-height: 120px;
  padding-left: 65px;
  text-align: justify;
}

.certificated-area {
  margin-top: 30px;
}

.course-price {
  font-size: 2rem;
  color: rgb(226, 193, 255);
}
.course-price strong {
  margin-left: 12px;
}
.course-price span {
  color: #fff27e;
  font-weight: 600;
}

.comments-btn-hero {
  justify-content: flex-end;
}

.offer-area {
  background-color: rgba(255, 255, 255, 0.3);
  border-radius: 4px;
  padding: 5px 25px;
  display: flex;
  align-items: center;
  width: max-content;
  margin: 15px 0px;
}
.offer-area .timer {
  display: flex;
  align-items: center;
}
.offer-area i {
  font-size: 24px;
  color: #fff;
}
.offer-area #countdown {
  display: flex;
  direction: rtl;
  flex-direction: row-reverse;
  width: 110px;
}
.offer-area #countdown span {
  color: #fff;
  font-size: 18px;
}
.offer-area .del-price {
  font-size: 20px;
  margin-right: 20px;
  text-decoration-line: line-through;
  color: #fff;
}

.w-course-wrapp .teacher-wrapp h3 {
  color: #fff;
  font-size: 1.5rem;
  display: flex;
  align-items: center;
}
.w-course-wrapp .teacher-wrapp h3 .teacher-image-holding {
  height: 80px;
  width: 80px;
  object-fit: contain;
  border-radius: 50%;
  padding: 10px;
  background: linear-gradient(45deg, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0.7) 100%);
  margin-left: 20px;
}
.w-course-wrapp .teacher-wrapp h3 .teacher-image-holding img {
  height: 100%;
  width: 100%;
  border-radius: 50%;
}
.w-course-wrapp .teacher-wrapp h3 strong {
  color: rgb(226, 193, 255);
}
.w-course-wrapp .teacher-wrapp h3 p {
  color: #fff;
  display: flex;
  font-size: 16px;
}
.w-course-wrapp .teacher-wrapp h3 p span {
  color: #fff;
  display: block;
  margin-left: 8px;
}

.certificated-area img {
  height: 30px;
  width: 30px;
  margin-left: 12px;
}
.certificated-area h4 {
  color: #fff;
  font-size: 14px;
  margin-bottom: 0px;
}

.hero-margin {
  margin-top: 50px;
}

.add-cart {
  padding: 10px 25px;
  box-shadow: 0 0 7px 0 #001020;
  -moz-box-shadow: 0 0 7px 0 #001830;
  -webkit-box-shadow: 0 0 7px 0 #000408;
  border-radius: 8px;
  font-size: 16px;
  background: #fff;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  font-weight: 500;
  margin: 15px 0;
}
.add-cart a span {
  color: #000000;
}

.add-cart:hover {
  background: #14003b;
  color: #fff;
}
.add-cart:hover span {
  color: #fff;
}

.read-caption {
  border-radius: 8px;
  background: #ffc3ed;
  display: flex;
  font-weight: 500;
  align-items: center;
  background: #c3aeff;
  padding: 0px 25px;
  margin-right: 15px;
  font-size: 16px;
}
.read-caption a {
  color: #000000 !important;
}

.wrapp-comment-reply-btn a {
  padding: 5px 10px;
  border-radius: 6px;
  background: #fff;
  display: flex;
  align-items: center;
  color: #6317bf;
}

.comments {
  font-size: 16px;
  color: #fff;
  display: flex;
  align-items: center;
}
.comments a {
  color: #fff;
}
.comments i {
  margin: 0px 5px;
}

.category-label {
  background: rgba(60, 1, 133, 0.231372549);
  border-radius: 8px;
  padding: 5px 10px;
  margin: 0px 12px;
}
.category-label a {
  color: #fff;
}

.h_iframe-aparat_embed_frame {
  position: relative;
}

.h_iframe-aparat_embed_frame .ratio {
  display: block;
  width: 100%;
  height: auto;
}

.h_iframe-aparat_embed_frame iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.wrapp-course-captions iframe {
  border-radius: 8px;
}
.wrapp-course-captions .embed-responsive {
  padding: 30px;
  border-radius: 8px;
  background: rgba(157, 19, 255, 0.062745098);
  margin: 20px 0;
}
.wrapp-course-captions p {
  font-size: 15px;
  font-weight: 500;
  line-height: 24px;
  text-align: justify;
  height: 100px;
  overflow: hidden;
}
.wrapp-course-captions span {
  font-size: 16px;
}

#sidebarWrap {
  height: auto;
  width: 100%;
  float: right;
  position: relative;
  box-shadow: none;
  border: none;
}

#sidebar.fixed {
  position: fixed;
  top: 0;
  text-align: right;
  background: rgb(255, 255, 255);
  border-radius: 8px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  width: 100%;
  max-width: 304px;
}

.vaiable-wrapp a {
  color: #6317bf;
  font-weight: 600;
  font-size: 16px;
}

.wrapp-comment-reply-btn a {
  padding: 5px 10px;
  border-radius: 6px;
  background: #fff;
  color: #6317bf;
}
.wrapp-comment-reply-btn strong {
  font-size: 14px !important;
}

.w-name-course-content {
  font-size: 1.5rem;
  color: rgb(21, 0, 54);
}

.wrapp-course-captions {
  text-align: right;
  padding: 40px 35px;
  background: rgb(255, 255, 255);
  border-radius: 8px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}
.wrapp-course-captions input {
  width: 100% !important;
}

.w-course-side {
  text-align: right;
  background: rgb(255, 255, 255);
  border-radius: 8px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.teacher-img {
  height: 70px;
  width: 70px;
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  margin-left: 20px;
}
.teacher-img img {
  height: 100%;
  width: 100%;
  border-radius: 50%;
  object-fit: cover;
}

.wrapp-sidebar-couese {
  padding: 15px;
}
.wrapp-sidebar-couese .teacher-wrapping {
  display: flex;
  align-content: center;
  border-bottom: 1px solid rgb(242, 242, 242);
  padding-bottom: 10px;
}
.wrapp-sidebar-couese .teacher-wrapping .wrapp-teacher-name {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.wrapp-sidebar-couese .teacher-wrapping .wrapp-teacher-name strong {
  font-size: 12px;
}
.wrapp-sidebar-couese .teacher-wrapping a {
  font-size: 20px;
  color: rgb(21, 0, 54);
  font-weight: 600;
}
.wrapp-sidebar-couese .category-wrapp {
  margin-top: 10px;
  border-bottom: 1px solid rgb(242, 242, 242);
  padding-bottom: 10px;
}
.wrapp-sidebar-couese .category-wrapp h6 {
  margin-bottom: 0px;
  color: rgb(21, 0, 54);
}
.wrapp-sidebar-couese .each-wrapp-options {
  padding: 10px;
  border-bottom: 1px solid rgb(242, 242, 242);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.wrapp-sidebar-couese .each-wrapp-options .icons-wrapp {
  display: flex;
  align-items: center;
}
.wrapp-sidebar-couese .each-wrapp-options .icons-wrapp i {
  font-size: 22px;
  color: rgb(21, 0, 54);
  margin-left: 8px;
}
.wrapp-sidebar-couese .wrapp-side-btn {
  padding: 10px;
}
.wrapp-sidebar-couese .wrapp-side-btn a {
  display: flex;
  align-items: center;
  color: #3c0185;
  font-weight: 600;
}
.wrapp-sidebar-couese .wrapp-side-btn i {
  font-size: 22px;
  color: rgb(21, 0, 54);
  margin-left: 8px;
}

.wrapp-side-btn:hover {
  background-color: #3c0185;
}
.wrapp-side-btn:hover a {
  color: #ffffff;
}
.wrapp-side-btn:hover i {
  color: #fff;
}

.wrapp-course-sections {
  padding: 10px;
  border-radius: 8px;
  background: #f5f1ff;
  border: 1px solid rgb(242, 242, 242);
  margin-bottom: 15px;
  display: flex;
  align-items: center;
}
.wrapp-course-sections p {
  font-size: 14px;
  text-align: right;
  direction: rtl;
  font-weight: 500;
}
.wrapp-course-sections .time-holder {
  padding: 4px 10px;
  border-radius: 8px;
  margin-left: 10px;
  display: flex;
  align-items: center;
  font-size: 14px;
  background: #f8f8f8;
}
.wrapp-course-sections .time-holder i {
  font-size: 13px;
  margin-left: 5px;
  color: #3c0185;
}

.download-now {
  background: #3c0185;
  color: #fff;
  border-radius: 8px;
  display: flex;
  padding: 4px 15px;
  padding-top: 6px;
}
.download-now i {
  font-size: 14px;
  margin-left: 5px;
}

.course-count {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  background: #ffffff;
  font-size: 18px;
  font-weight: 600;
  border-radius: 50%;
  margin-bottom: 0px;
  margin-left: 15px;
}

.comment-btn {
  background: #1e1e1e;
  color: #ffca1e;
  font-size: 18px;
  padding: 12px 32px;
  width: max-content;
  border: none;
  border-radius: 8px;
}

.wrapp-comments {
  border: 1px solid rgb(242, 242, 242);
  margin: 0px 10px;
  border-radius: 8px;
}
.wrapp-comments .wrapp-user-comments {
  border: 1px solid rgb(242, 242, 242);
  border-radius: 8px;
  border-bottom: none;
}
.wrapp-comments .wrapp-user-comments .comment-user {
  background: #f9f4ff;
  box-shadow: none !important;
  border-radius: 8px;
  padding: 12px 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.wrapp-comments .wrapp-user-comments .comment-user p {
  color: #000000 !important;
  margin-bottom: 0px;
  margin-right: 20px;
  font-size: 16px;
}
.wrapp-comments .wrapp-user-comments .comment-user strong {
  font-size: 16px;
}
.wrapp-comments .wrapp-user-comments .comment-body p {
  font-size: 16px;
}

.owner-comments {
  padding: 12px 10px;
  border: 1px solid rgb(242, 242, 242);
  margin: 10px 20px;
  border-radius: 8px;
}
.owner-comments .reply-name {
  background: #f2f2f2;
  box-shadow: none !important;
  border-right: 2px solid #6317bf;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  padding: 8px 10px;
}
.owner-comments .reply-name p {
  color: #000000 !important;
  font-size: 16px;
  font-weight: 600;
  margin-left: 8px;
}
.owner-comments .reply-name i {
  font-size: 18px;
  color: #3c0185;
  margin-left: 5px;
}
.owner-comments .reply-name span {
  color: #000000 !important;
  margin-right: 20px;
  font-size: 16px;
}

.comment-body,
.owner-comment-body {
  padding: 15px 20px;
}
.comment-body p,
.owner-comment-body p {
  font-size: 16px;
}

@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .mini-caption p {
    height: 120px;
    min-height: 120px;
    padding-left: 0px;
    font-size: 12px;
  }
  .certificated-area h4 {
    font-size: 10px;
  }
}
@media only screen and (min-width: 375px) and (max-width: 991px) {
  .wrapp-course-captions ul {
    padding-right: 20px;
  }
  .order-mobile-second {
    order: 1;
  }
  .order-mobile-first {
    order: 2;
  }
  .comments-btn-hero {
    justify-content: center;
    margin-bottom: 25px;
  }
  .category-label {
    margin: 0px 5px;
  }
  .comments i {
    font-size: 10px;
  }
  .certificated-area {
    margin-top: 0;
  }
  .offer-area {
    margin: 5px 0px;
  }
  .w-course-wrapp .teacher-wrapp h3 .teacher-image-holding {
    height: 55px;
    width: 55px;
    padding: 5px;
    margin-left: 10px;
  }
  .w-name-course {
    font-size: 1.2rem;
    text-align: center;
    margin-bottom: 0px;
  }
  .w-video-box video {
    height: 180px;
    max-width: 100%;
  }
  .w-course-wrapp {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .w-left-course-hero {
    padding-top: 10px;
    align-items: center;
    justify-content: center;
  }
  .w-course-wrapp .teacher-wrapp h3 {
    font-size: 1rem;
    margin-bottom: 0px;
  }
  .certificated-area img {
    height: 16px;
    width: 16px;
    margin-left: 0px;
  }
  .certificated-area h4 {
    font-size: 10px;
  }
  .mobile-center {
    justify-content: center;
  }
  .course-price {
    font-size: 1.6rem;
  }
  .mini-caption {
    display: none;
  }
  .mini-caption ul {
    display: none;
  }
  .just-wrapp {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 15px;
  }
  #sidebar.fixed {
    min-width: 100% !important;
  }
  .w-course-side {
    margin-bottom: 30px;
  }
  .wrapp-course-sections {
    padding: 6px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  .mobile-download-wrapp {
    width: 100%;
    justify-content: flex-end;
  }
  .course-count {
    width: 20px;
    height: 20px;
  }
  #sidebar {
    position: relative !important;
    top: unset !important;
  }
  .wrapp-course-captions {
    padding: 40px 15px;
  }
  .certificated-area h4 {
    font-size: 8px;
    text-align: center;
    padding: 4px;
  }
}
@media (max-width: 920px) {
  .wrapp-comment-reply-btn strong {
    font-size: 12px !important;
  }
  .order-mobile-second {
    order: 1;
  }
  .order-mobile-first {
    order: 2;
  }
  .wrapp-course-captions a,
  .wrapp-course-captions p {
    font-size: 0.9rem;
  }
  .wrapp-course-captions span,
  .wrapp-course-captions small,
  .wrapp-course-captions strong,
  .wrapp-course-captions article {
    font-size: 0.75rem;
  }
  .wrapp-course-captions h1 {
    font-size: 1.3rem;
  }
  .wrapp-course-captions h2 {
    font-size: 1rem;
    margin: 0.7rem 0rem;
  }
  .wrapp-course-captions h3 {
    font-size: 0.9rem;
    margin: 0.7rem 0rem;
    font-weight: 600;
  }
  .wrapp-course-captions h4,
  .wrapp-course-captions h5,
  .wrapp-course-captions h6 {
    font-size: 0.7rem;
    margin: 0.7rem 0rem;
    margin-left: 0.5rem;
  }
  .wrapp-course-captions video {
    padding: 20px;
    min-height: 200px;
    height: 200px !important;
    width: 100%;
  }
}
@media (max-width: 370px) {
  .order-mobile-second {
    order: 1;
  }
  .order-mobile-first {
    order: 2;
  }
  .certificated-area h4 {
    font-size: 8px;
    text-align: center;
    padding: 4px;
  }
}
.truncate,
.next-video-info,
.next-video-title,
.video-title {
  box-sizing: border-box;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
  color: #000000 !important;
}

@-webkit-keyframes slidein {
  0% {
    transform: translate3d(0, -4.5rem, 0);
  }
}
@keyframes slidein {
  0% {
    transform: translate3d(0, -4.5rem, 0);
  }
}
.site-title {
  font-size: 1.5rem;
  font-weight: 300;
  margin: 16px 0;
  float: left;
}

.credit-line {
  float: right;
  margin: 16px 0;
}

.title-five {
  background: #fff;
  border-radius: 100%;
  color: #f11753;
  font-weight: 600;
  padding-left: 0.4em;
  padding-right: 0.4em;
  margin-left: 0.1em;
  margin-right: 0.1em;
}

.video-area {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  color: #fff;
  padding: 0px 3px;
  margin-bottom: 40px;
}

@-webkit-keyframes slidebottom {
  0% {
    transform: translate3d(0, 100%, 0);
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
@keyframes slidebottom {
  0% {
    transform: translate3d(0, 100%, 0);
    opacity: 1;
  }
  100% {
    opacity: 1;
  }
}
.video-column {
  float: right;
  max-width: 74.5%;
  width: 74.5% !important;
  padding: 0px 1px;
  padding-left: 0;
  background-color: #ffffff;
}

.video-player {
  background: #000;
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 530px;
}

.video {
  display: block;
  cursor: pointer;
  width: 100%;
  position: relative;
  top: 50%;
  transition: all linear 0.5s;
  transform: translateY(-50%);
}

.video-playlist {
  float: right;
  font-size: 18px;
  font-weight: 600;
  width: 25.5%;
  min-height: 650px;
  max-height: 650px;
  direction: rtl;
  overflow-y: scroll;
  padding: 0px 1px;
  padding-right: 0;
  border-bottom-left-radius: 6px;
  background-color: #f7f4ff;
}

.video-playlist::-webkit-scrollbar-track {
  border-radius: 0px;
  background-color: #ffffff;
}

.video-playlist::-webkit-scrollbar {
  border-radius: 0px;
  width: 5px;
  background-color: #18034c;
}

.video-playlist::-webkit-scrollbar-thumb {
  border-radius: 0px;
  background-color: rgba(124, 81, 255, 0.3411764706);
}

.video-controls {
  box-sizing: border-box;
  background: rgba(14, 32, 82, 0.8);
  line-height: 3rem;
  padding: 0 1.5rem;
  position: absolute;
  bottom: 0;
  transform: translate3d(0, 3rem, 0);
  width: 100%;
  height: 3rem;
  vertical-align: middle;
  transition: transform 0.5s;
}

.video-controls button {
  background: 0;
  border: 0;
  color: #fff;
  font-size: 1.5rem;
  width: 3rem;
  height: 3rem;
  vertical-align: middle;
}

.video-header {
  background: #ffffff;
  line-height: 1.5rem;
  padding: 1.5rem;
  direction: rtl;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  border-radius: 6px 6px 0px 0px;
  margin: -1px;
  text-align: right;
}
.video-header h2 {
  font-size: 1rem;
  text-align: right;
  color: #000000;
}

.video-title {
  float: right;
  margin: 0;
  width: auto;
  max-width: 75%;
}

.video-author {
  font-size: 18px;
  float: left;
  margin-left: 3rem;
}

.video-author a:hover {
  box-shadow: inset 0px -24px 0px #f11753;
}

.video-bars {
  background: rgba(8, 11, 19, 0.8);
  display: inline-block;
  margin: 0 1em;
  position: relative;
  width: 73%;
  height: 8px;
}

.bar-seeker,
.bar-progress,
.bar-buffer {
  position: absolute;
  height: 8px;
}

.bar-seeker {
  z-index: 1000;
}

.bar-progress {
  z-index: 100;
}

.bar-buffer {
  z-index: 10;
}

.bar-seeker::-ms-fill-lower {
  background: transparent;
}

.bar-seeker::-ms-fill-upper {
  background: transparent;
}

/* Style the seeker bar */
.bar-seeker::-webkit-slider-runnable-track {
  background: transparent;
  height: 8px;
  padding: 0;
}

.bar-seeker::-moz-range-track {
  background: transparent;
  height: 8px;
  padding: 0;
}

.bar-seeker::-ms-track {
  background: transparent;
  height: 8px;
  padding: 0;
}

.bar-seeker::-webkit-slider-thumb {
  background: #f11753;
  border: 0;
  border-radius: 100%;
  width: 18px;
  height: 18px;
  margin-top: -4px;
}

.bar-seeker::-moz-range-thumb {
  background: #f11753;
  border: 0;
  border-radius: 100%;
  width: 18px;
  height: 18px;
  margin-top: -4px;
}

.bar-seeker::-ms-thumb {
  background: #f11753;
  border: 0;
  border-radius: 100%;
  width: 18px;
  height: 18px;
  margin-top: -4px;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  /* IE, still a little idiot */
  .bar-seeker {
    height: 24px;
    margin-top: -5px;
    padding: 0;
    vertical-align: middle;
  }
}
input.slider-volume {
  position: absolute;
  bottom: 36px;
  right: -40px;
  width: 6rem;
  opacity: 0;
  transform: rotate(-90deg) scaleX(0);
  transform-origin: left;
  transition: all 1s;
}

.slider-volume::-webkit-slider-runnable-track {
  background: rgba(14, 32, 82, 0.9);
  height: 20px;
}

.slider-volume::-moz-range-track {
  background: rgba(14, 32, 82, 0.9);
  height: 20px;
}

.slider-volume::-ms-track {
  background: rgba(14, 32, 82, 0.9);
  height: 20px;
}

.slider-volume::-webkit-slider-thumb {
  background: #f11753;
  border: 0;
  width: 8px;
  height: 24px;
  margin-top: -2px;
}

.slider-volume::-moz-range-thumb {
  background: #f11753;
  border: 0;
  width: 8px;
  height: 24px;
  margin-top: -2px;
}

.slider-volume::-ms-thumb {
  background: #f11753;
  border: 0;
  width: 8px;
  height: 24px;
  margin-top: -2px;
}

.btn-sound:hover + .slider-volume,
.slider-volume:hover {
  opacity: 1;
  transform: rotate(-90deg) scaleX(1);
}

.playlist-title {
  background: rgba(124, 81, 255, 0.3411764706);
  padding: 16.5px;
  max-height: 50px;
  text-align: right;
  direction: rtl;
  width: 25.5%;
  color: #000;
  font-weight: 700;
  font-size: 18px;
}

.next-video {
  display: block;
  height: 93px;
  position: relative;
  overflow: hidden;
  background-color: #f5f1ff;
  border-bottom: 1px solid #fff;
}

.next-video img {
  display: block;
}

.next-video::before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  transition: all 0.5s;
}

.next-video-title {
  padding-top: 8px;
  transition: all 0.5s;
  font-size: 14px;
  direction: rtl;
  text-align: right;
  margin-bottom: 0;
  color: #000;
  padding-right: 15px;
}

.next-video-info {
  box-sizing: border-box;
  font-size: 13px;
  font-weight: 400;
  padding: 0px 15px;
  position: absolute;
  transition: all 0.5s;
  opacity: 1;
  width: 100%;
}

.next-video:hover::before {
  background: rgba(14, 4, 56, 0.173);
}

.next-video:hover .next-video-info {
  opacity: 1;
}

.video-popularity {
  font-size: 18px;
  font-weight: 600;
  text-align: right;
}

.video-popularity {
  background: #ffffff;
  line-height: 1.5rem;
  padding: 1rem 1.5rem;
  direction: rtl;
}

.description {
  background: #ffffff;
  line-height: 1.5rem;
  padding: 1rem 1.5rem;
  padding-bottom: 1.5rem;
  direction: rtl;
  border-bottom-right-radius: 6px;
  margin: -1px;
  height: 82px;
  color: #000;
  font-size: 14px;
  text-align: justify;
}
.description h3 {
  font-size: 1.2rem;
  margin-top: 10px;
  color: #000;
}

.video-description-action {
  display: flex;
  direction: rtl;
  justify-content: space-between;
  padding: 0px 15px;
}
.video-description-action .download-video {
  background: #7c51ff;
  padding: 6px 10px;
  border-radius: 5px;
  color: #fff;
  display: inline-block;
}
.video-description-action .download-video i {
  font-size: 16px;
  margin-left: 4px;
  position: relative;
  top: 4px;
}
.video-description-action .attach-btn {
  display: flex;
  align-items: center;
}
.video-description-action .attach-btn .attachment-download {
  border: 1px solid #7c51ff;
  padding: 6px 10px;
  border-radius: 5px;
  font-weight: 700;
  color: #000;
}
.video-description-action .attach-btn .attachment-download i {
  font-size: 16px;
  margin-left: 4px;
  position: relative;
  top: 4px;
  color: #7c51ff;
}
.video-description-action .attach-btn .each-video-time {
  display: flex;
  align-items: center;
  margin-left: 12px;
  font-weight: 700;
}
.video-description-action .attach-btn .each-video-time i {
  color: #7c51ff;
  font-size: 16px;
  margin-left: 4px;
}

.likes {
  padding-left: 1em;
  padding-right: 1em;
}

@-webkit-keyframes beat {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.5);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes beat {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.5);
  }
  100% {
    transform: scale(1);
  }
}
.meta-icon {
  padding-left: 0.5em;
}

.wiggle {
  -webkit-animation: wiggle 0.5s;
  animation: wiggle 0.5s;
  -webkit-animation-iteration-count: 4;
  animation-iteration-count: 4;
}

.wiggle + .like-prompt {
  transform: scaleX(1);
}

@-webkit-keyframes wiggle {
  0% {
    transform: translateY(2px);
  }
  50% {
    transform: translateY(-2px);
  }
  100% {
    transform: translateY(2px);
  }
}
@keyframes wiggle {
  0% {
    transform: translateY(2px);
  }
  50% {
    transform: translateY(-2px);
  }
  100% {
    transform: translateY(2px);
  }
}
.info-area {
  background: #fff;
  color: #080b13;
}

.info-heading {
  color: #61b5d9;
  font-size: 3rem;
  font-weight: 300;
  text-align: center;
  margin: 4.5rem auto;
}

.clearfix:before,
.wrapper:before,
.video-header:before,
.clearfix:after,
.wrapper:after,
.video-header:after {
  content: " ";
  display: table;
}

.clearfix:after,
.wrapper:after,
.video-header:after {
  clear: both;
}

#btnReplay {
  display: none !important;
}

.next-video {
  color: inherit;
  text-decoration: none;
  box-shadow: inset 0px -1px 0px rgba(255, 255, 255, 0.5);
  transition: all 0.5s;
}

.next-video:hover {
  box-shadow: inset 0px -40px 0px rgba(124, 81, 255, 0.3411764706);
}

.ball {
  width: 270px;
  height: 270px;
  display: flex;
  border-radius: 50%;
  background-color: black;
  background: radial-gradient(circle at 200px 100px, rgba(170, 187, 255, 0.15), rgba(0, 0, 0, 0.05));
  align-items: center;
  justify-content: center;
}
.ball .ball-img {
  height: 200px;
  width: 200px;
  object-fit: contain;
}
.ball .ball-img img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.ball-area {
  display: flex;
  justify-content: flex-end;
  /* flex-direction: column; */
  align-content: center;
}

.student-label {
  display: flex;
  align-items: center;
  color: #ffffff;
  margin-bottom: 0;
  margin-top: 7%;
  padding: 5px 12px;
  padding-right: 0;
  background: #480884;
  height: 14px;
  border-radius: 2px;
}
.student-label i {
  position: relative;
  top: -5px;
  font-size: 28px;
  margin-left: 5px;
}

.skill {
  direction: ltr;
}

.skills {
  width: 100%;
  max-width: 600px;
  padding: 0 20px;
  direction: rtl;
}

.skill-name {
  font-size: 18px;
  font-weight: 700;
  color: #eeedf0;
  text-transform: uppercase;
  margin: 20px 0;
}

.skill-bar {
  height: 14px;
  background: #4d098e;
  border-radius: 3px;
}

.skill-percentage {
  height: 14px;
  background: #7c51ff;
  border-radius: 3px;
  position: relative;
  animation: fillBars 2.5s 1;
}

.skill-percentage::before {
  content: attr(per);
  position: absolute;
  padding: 2px 6px;
  background: #ffffff;
  border-radius: 4px;
  font-size: 12px;
  top: -35px;
  right: 0;
  height: 18px;
  transform: transition(50%);
}

.skill-percentage::after {
  content: "";
  position: absolute;
  width: 5px;
  height: 5px;
  background: #7c51ff;
  top: -20px;
  right: 0;
  transform: translateX(50%) rotate(45deg);
  border-radius: 2px;
}

@keyframes fillBars {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}
.for-mobile {
  display: none;
}

@media (max-width: 370px) {
  .for-mobile {
    display: block;
  }
  .video-description-action .attach-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
}
@media only screen and (min-width: 360px) and (max-width: 473px) {
  .video-description-action {
    display: flex;
    direction: rtl;
    justify-content: space-between;
    padding: 0px 15px;
    flex-direction: column;
  }
  .video-column {
    float: unset;
    max-width: 100% !important;
    width: 100% !important;
    padding: 0px 1px;
    padding-left: 0;
  }
  .video-player {
    background: #e8d1ff;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 241px;
  }
  .video-playlist {
    float: unset;
    font-size: 18px;
    font-weight: 600;
    width: 100%;
    min-height: 170px;
    max-height: 170px;
    direction: rtl;
    overflow-y: scroll;
    padding: 0px 1px;
    padding-right: 0;
    border-bottom-left-radius: 6px;
    background-color: #f7f4ff;
  }
  .video-description-action .attach-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 15px;
  }
  .description {
    display: none;
  }
  .playlist-title {
    background: rgba(56, 0, 226, 0.34);
    padding: 16.5px;
    width: 100%;
    margin-top: 10px;
    font-size: 14px;
  }
  .ball-area {
    display: flex;
    justify-content: center;
    align-content: center;
  }
  .ball .ball-img {
    height: 100px;
    width: 100px;
    object-fit: contain;
  }
  .ball {
    width: 120px;
    height: 120px;
  }
}
@media (max-width: 480px) {
  .next-video {
    height: 82px;
  }
  .video-description-action {
    display: flex;
    direction: rtl;
    justify-content: space-between;
    padding: 0px 15px;
    flex-direction: column;
  }
  .video-column {
    float: unset;
    max-width: 100% !important;
    width: 100% !important;
    padding: 0px 1px;
    padding-left: 0;
  }
  .video-player {
    background: #e8d1ff;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 241px;
  }
  .video-playlist {
    float: unset;
    font-size: 18px;
    font-weight: 600;
    width: 100%;
    min-height: 170px;
    max-height: 170px;
    direction: rtl;
    overflow-y: scroll;
    padding: 0px 1px;
    padding-right: 0;
    border-bottom-left-radius: 6px;
    background-color: #f7f4ff;
  }
  .video-description-action .attach-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 15px;
  }
  .description {
    display: none;
  }
  .playlist-title {
    background: rgba(56, 0, 226, 0.34);
    padding: 16.5px;
    width: 100%;
    margin-top: 10px;
    font-size: 14px;
  }
  .ball-area {
    display: flex;
    justify-content: center;
    align-content: center;
  }
  .ball .ball-img {
    height: 100px;
    width: 100px;
    object-fit: contain;
  }
  .ball {
    width: 120px;
    height: 120px;
  }
}
.w-wrapp-blogs {
  background: #ece8f7;
  padding: 30px 10px;
  padding-top: 78px;
  display: flex;
  align-items: center;
  border-radius: 8px;
  direction: rtl;
}
.w-wrapp-blogs .w-blog-block {
  flex-direction: column;
  margin: 10px;
}

.cart-wrappering {
  margin-bottom: 35px;
  text-align: right;
  height: 19rem;
  padding: 15px;
  background: rgb(255, 255, 255);
  border-radius: 8px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}
.cart-wrappering .cart-img {
  border-radius: 8px;
  height: 200px;
  width: 100%;
  object-fit: cover;
}
.cart-wrappering .cart-img img {
  border-radius: 8px;
  height: 100%;
  width: 100%;
  object-fit: cover;
  overflow: hidden;
}

.cart-big-wrapping {
  height: 21rem;
}

.name-course {
  margin-top: 20px;
  font-size: 17px;
  line-height: 25px;
  color: #000000;
  height: 45px;
  overflow: hidden;
}

.w-absolute {
  height: 160px;
  position: relative;
  top: -35px;
}
.w-absolute .cart-timer {
  position: relative;
  top: -40px;
  background: #ffffff;
  padding: 2px 12px;
  width: max-content;
  right: 11px;
  border-radius: 6px !important;
  --border-size: 1.5px;
  --border-angle: 0turn;
  background-image: conic-gradient(from var(--border-angle), #ffffff, #dfdfff 50%, #cfa7f8), conic-gradient(from var(--border-angle), #ffecec 0%, #6f01b9, #ff7300);
  background-size: calc(100% - var(--border-size) * 4) calc(100% - var(--border-size) * 3), cover;
  background-position: center center;
  background-repeat: no-repeat;
  animation: bg-spin 3s linear infinite;
}
@keyframes bg-spin {
  to {
    --border-angle: 1turn;
  }
}
.w-absolute .cart-timer:hover {
  animation-play-state: paused;
}
.w-absolute .cart-timer .timer {
  display: flex;
  align-items: center;
}
.w-absolute .cart-timer i {
  font-size: 18px;
  margin-left: 5px;
  color: #150055;
}
.w-absolute .cart-timer .timer-title {
  color: #000;
  font-size: 0.9rem;
  margin-top: 3px;
  font-weight: 600;
}
.w-absolute .cart-timer #countdown {
  display: flex;
  direction: rtl;
  flex-direction: row-reverse;
  justify-content: center;
  width: 100px;
  margin-top: 2px;
}
.w-absolute .cart-timer #countdown span {
  color: rgb(21, 0, 54);
  font-size: 16px;
  font-weight: 600;
  margin-top: 2px;
}
.w-absolute .cart-timer .del-price {
  font-size: 20px;
  margin-right: 20px;
  text-decoration-line: line-through;
  color: #150055;
}

.mr-2 {
  margin-right: 5px;
}

@property --border-angle {
  syntax: "<angle>";
  inherits: true;
  initial-value: 0turn;
}
.name-course-s {
  font-size: 1rem;
  direction: rtl;
}

.cart-wrappering:hover .cart-img img {
  transform: scale(1.03);
  transition: all 0.3s ease;
}
.cart-wrappering:hover .biginner-lev {
  background: linear-gradient(-45deg, #b752ee, #de3ce7, #f170ff, #ff005d);
  background-size: 400% 400%;
  animation: gradient 2s ease infinite;
}
.cart-wrappering:hover .mid-lev {
  background: linear-gradient(-45deg, #52eea0, #3ce77e, #97c8ff, #0bf3bd);
  background-size: 400% 400%;
  animation: gradient 2s ease infinite;
}
.cart-wrappering:hover .adv-lev {
  background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
  background-size: 400% 400%;
  animation: gradient 2s ease infinite;
}

@keyframes gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
.course-level {
  width: max-content;
  padding: 0px 8px;
  border-radius: 3px;
}

.course-level p {
  color: rgb(0, 0, 0);
  font-weight: normal;
  font-size: 10px;
}

.course-level {
  width: max-content;
  padding: 0px 8px;
  border-radius: 3px;
}

.ct-6 {
  color: #fff;
}

.biginner-lev {
  background-color: rgba(253, 211, 229, 0.668);
  color: rgb(0, 0, 0) !important;
}

.mid-lev {
  background-color: rgba(201, 246, 255, 0.6901960784);
  color: rgb(0, 0, 0) !important;
}

.adv-lev {
  background-color: rgba(233, 193, 255, 0.5725490196);
  color: rgb(0, 0, 0) !important;
}

.biginner-lev-i {
  color: rgb(253, 192, 218);
}

.mid-lev-i {
  color: #7de9ff;
}

.adv-lev-i {
  color: #d079ff;
}

.course-level p {
  font-size: 12px;
}

.course-level p {
  color: rgb(0, 0, 0);
}

.cart-capt {
  margin-bottom: 5px;
  font-size: 12px;
}

.cart-title h6 {
  color: #fff;
  height: 45px;
  font-size: 12px;
  padding: 2px 10px;
  margin-top: 5px;
  margin-bottom: 10px;
  line-height: 22px;
  overflow: hidden;
}

.carts {
  padding: 0px;
  direction: rtl;
}

.first-details {
  direction: rtl;
  display: flex;
  align-items: center;
  padding: 2px 0px 8px;
  margin-top: 1rem;
}

.blck-cc {
  color: rgb(0, 0, 0);
  font-size: 14px;
}

.the-last-item a {
  margin-top: 3px !important;
  border-top: 1px solid #000;
  background-color: rgba(157, 0, 255, 0.9803921569) !important;
  color: #fff;
}

.the-last-item a:hover {
  margin-top: 3px !important;
  background-color: #e8b6ff !important;
  color: rgb(0, 0, 0) !important;
  opacity: 1;
}

.tag-thing {
  direction: ltr;
  text-align: left;
  font-size: 14px;
  color: #ff7df4;
}

.bb-nim {
  border-bottom: 1px solid rgba(204, 204, 204, 0.315);
  margin: 3px 10px;
}

.second-details {
  display: flex;
  justify-content: space-between;
  padding-bottom: 5px;
  margin-top: 5px;
  align-items: center;
}

.w-see-course {
  background-color: rgba(255, 202, 30, 0.1411764706);
  padding: 0px 8px;
  padding-left: 10px;
  border-radius: 6px;
  color: #1e1e1e;
  font-weight: 600;
  display: flex;
  margin-top: 5px;
  align-items: center;
}
.w-see-course i {
  color: #ffca1e;
  font-size: 20px;
  margin-right: 5px;
  margin-bottom: 2px;
}
.w-see-course:hover {
  background-color: #1e1e1e;
  color: #fff;
}

.money {
  direction: ltr;
  display: flex;
  align-items: center;
  flex-direction: column-reverse;
  height: 3rem;
  align-items: flex-start;
}
.money p {
  font-size: 14px;
  color: #d7a7ff;
  display: flex;
  flex-direction: row-reverse;
}
.money .toman {
  float: left;
  margin-right: 4px;
}
.money del {
  color: rgb(90, 90, 90);
  text-decoration: none;
  position: relative;
  font-size: 16px;
}
.money del:before {
  content: " ";
  display: block;
  width: 100%;
  border-top: 1px solid rgb(148, 148, 148);
  height: 12px;
  position: absolute;
  bottom: 16px;
  left: 0;
  transform: rotate(180deg);
}

.time p {
  direction: center;
  font-size: 12px;
  width: 80px;
  text-align: center;
  color: #d7a7ff;
  text-align: center;
}

.pay {
  font-size: 18px;
  font-weight: 500;
  color: rgb(255, 255, 255);
}

.into-top {
  margin-bottom: 0px;
  padding: 10px 0px;
}

.arroww-ass {
  height: 20px;
  width: 20px;
}

.see-all span {
  color: rgb(255, 255, 255);
  margin-left: 12px;
}

.see-all {
  margin-top: 12px;
  padding: 10px 25px;
  border-radius: 50px;
  height: 47px;
  border: 2px solid rgb(125, 75, 255);
  display: flex;
  align-items: center;
  margin-top: 10px;
  width: max-content;
}

.see-all:hover {
  background: rgba(126, 75, 255, 0.126);
  border: 2px solid rgb(193, 168, 255);
  transition: all linear 0.4s;
}

.see-all:hover span {
  color: rgb(255, 255, 255) !important;
  transition: all linear 0.4s;
}

.tracks-row {
  margin-top: 30px;
  margin-bottom: 30px;
  background-color: #27282c;
  padding: 120px 10px;
  direction: rtl;
  background-color: rgba(219, 178, 255, 0.5098039216);
  background-image: url(/assets/images/vectors/bg-banner-02.webp);
  background-size: cover;
  background-position: center;
  box-shadow: none !important;
}

.track-title {
  color: #f6f1fa;
  font-size: 22px;
}

.ser-line {
  text-align: right;
  display: flex;
  flex-direction: column;
}

.track-capt {
  color: rgb(145, 145, 145);
  margin-top: 10px;
  font-size: 16px;
}

.logo-track {
  height: 60px;
  width: 60px;
  object-fit: cover;
  margin-left: 28px;
  padding: 0px;
}

.logo-track img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.sub-cat {
  margin: 0px 0px;
}

.name-track {
  text-align: right;
  color: #fff;
  font-size: 18px;
}

.track-wrapp {
  display: flex;
  align-items: center;
}

.bird-padding {
  padding: 0px;
  margin-top: 15px;
}

.bird-padding:hover .details-course li a {
  font-size: 16px;
  color: rgb(247, 163, 255);
}

.about-us-section {
  border-radius: 8px;
  background-color: rgba(30, 30, 30, 0.0588235294);
  background-image: url(../../assets/images/vectors/topic.png);
  background-position: center;
  padding: 50px 20px;
  height: 560px;
  direction: rtl;
  align-items: center;
  display: flex;
  justify-content: space-around;
  margin-bottom: 20px;
}
.about-us-section h3 {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 34px;
  margin-bottom: 20px;
}

.about-us-vector {
  height: 160px;
  display: flex;
  align-items: start;
  object-fit: contain;
  margin-bottom: 25px;
}
.about-us-vector img {
  height: 100%;
  object-fit: contain;
}

.carousel-about {
  position: relative;
  width: 100%;
  max-width: 500px;
  display: flex;
  justify-content: center;
  flex-direction: column;
}

.carousel__item {
  display: flex;
  align-items: center;
  position: absolute;
  width: 100%;
  padding: 0 12px;
  opacity: 0;
  /* filter: drop-shadow(0 2px 2px #000); */
  will-change: transform, opacity;
  -webkit-animation: carousel-animate-vertical 27s linear infinite;
  animation: carousel-animate-vertical 27s linear infinite;
}

.carousel__item:nth-child(1) {
  -webkit-animation-delay: -3s;
  animation-delay: -3s;
}

.carousel__item:nth-child(2) {
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}

.carousel__item:nth-child(3) {
  -webkit-animation-delay: 3s;
  animation-delay: 3s;
}

.carousel__item:nth-child(4) {
  -webkit-animation-delay: 6s;
  animation-delay: 6s;
}

.carousel__item:nth-child(5) {
  -webkit-animation-delay: 9s;
  animation-delay: 9s;
}

.carousel__item:nth-child(6) {
  -webkit-animation-delay: 12s;
  animation-delay: 12s;
}

.carousel__item:nth-child(7) {
  -webkit-animation-delay: 15s;
  animation-delay: 15s;
}

.carousel__item:nth-child(8) {
  -webkit-animation-delay: 18s;
  animation-delay: 18s;
}

.carousel__item:last-child {
  -webkit-animation-delay: -6s;
  animation-delay: -6s;
}

.carousel__item-head {
  border-radius: 50%;
  background-color: #ffca1e;
  width: 80px;
  height: 80px;
  padding: 20px;
  position: relative;
  margin-right: -45px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 45px;
  object-fit: contain;
}
.carousel__item-head .skill-icon-header {
  width: 85px;
  height: 85px;
  object-fit: contain;
}
.carousel__item-head .skill-icon-header img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.carousel__item-body {
  width: 100%;
  background-color: rgb(27, 27, 27);
  border-radius: 6px;
  padding: 25px 20px;
  margin-right: 20px;
}

.horizonral-subtitle {
  position: absolute;
  left: -92px;
  top: 37%;
}

@-webkit-keyframes carousel-animate-vertical {
  0% {
    transform: translateY(100%) scale(0.5);
    opacity: 0;
    visibility: hidden;
  }
  3%, 11.1111111111% {
    transform: translateY(100%) scale(0.7);
    opacity: 0.4;
    visibility: visible;
  }
  14.1111111111%, 22.2222222222% {
    transform: translateY(0) scale(1);
    opacity: 1;
    visibility: visible;
  }
  25.2222222222%, 33.3333333333% {
    transform: translateY(-100%) scale(0.7);
    opacity: 0.4;
    visibility: visible;
  }
  36.3333333333% {
    transform: translateY(-100%) scale(0.5);
    opacity: 0;
    visibility: visible;
  }
  100% {
    transform: translateY(-100%) scale(0.5);
    opacity: 0;
    visibility: hidden;
  }
}
@keyframes carousel-animate-vertical {
  0% {
    transform: translateY(100%) scale(0.5);
    opacity: 0;
    visibility: hidden;
  }
  3%, 11.1111111111% {
    transform: translateY(100%) scale(0.7);
    opacity: 0.4;
    visibility: visible;
  }
  14.1111111111%, 22.2222222222% {
    transform: translateY(0) scale(1);
    opacity: 1;
    visibility: visible;
  }
  25.2222222222%, 33.3333333333% {
    transform: translateY(-100%) scale(0.7);
    opacity: 0.4;
    visibility: visible;
  }
  36.3333333333% {
    transform: translateY(-100%) scale(0.5);
    opacity: 0;
    visibility: visible;
  }
  100% {
    transform: translateY(-100%) scale(0.5);
    opacity: 0;
    visibility: hidden;
  }
}
.carousel__item-body {
  box-shadow: inset 0 0 500px rgba(255, 255, 255, 0.48);
  filter: blur(0px);
  z-index: -1;
}

.carousel__item-body p {
  color: #fff !important;
  font-weight: 800 !important;
  font-family: KalamehWeb;
  font-size: 26px !important;
  margin-bottom: 0px !important;
}

.mini-line {
  width: 120px;
  height: 5px;
  border-radius: 4px;
  margin: 10px;
  background-color: #ffca1e;
}

.medium-line {
  width: 155px;
  height: 5px;
  border-radius: 4px;
  margin: 10px;
  background-color: #ffca1e;
}

.mini-line {
  width: 80px;
  height: 5px;
  border-radius: 4px;
  margin: 5px 0px;
  background-color: #ffca1e;
}

.counter-boxes {
  margin-top: 25px;
}

.about-count-box {
  background-color: rgba(27, 27, 27, 0.11);
  border-radius: 0px;
  padding: 10px 15px;
  text-align: center;
  position: relative;
  margin: 12px 0px;
  height: 65px;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}
.about-count-box span {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 28px;
  color: #000;
  margin-left: 10px;
  display: inline-block;
  border-bottom: 3px solid #ffca1e;
}
.about-count-box strong {
  font-size: 18px;
  font-weight: 700;
}
.about-count-box::before {
  content: "";
  position: absolute;
  left: -3px;
  bottom: -3px;
  height: 30px;
  width: 10%;
  z-index: 10000;
  border-left: 3px solid #ffca1e;
  border-bottom: 3px solid #ffca1e;
}

.wrapp-static-box {
  height: 190px;
  border-radius: 8px;
  background-position: center;
  background-size: contain;
  background: linear-gradient(44deg, rgba(255, 202, 30, 0.168627451) 0.64%, rgba(255, 193, 7, 0.1607843137) 98.23%);
  display: flex;
  padding: 20px 40px;
  flex-direction: column;
  align-items: flex-start;
  text-align: right;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  margin: 12px 5px;
}
.wrapp-static-box h4 {
  font-size: 15px;
  font-weight: 600;
  margin: 12px 0px;
  margin-bottom: 20px;
}
.wrapp-static-box .static-box-img {
  height: 70px;
  width: 70px;
  object-fit: contain;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  padding: 10px;
  background: #fff;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}
.wrapp-static-box .static-box-img img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.links-area {
  display: flex;
  justify-content: end;
  width: 100%;
}
.links-area a {
  color: #000;
  font-size: 14px;
  font-weight: 600;
  background-color: #fff;
  padding: 5px 8px;
  border-radius: 6px;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.21);
}
.links-area a:hover {
  background-color: #1e1e1e;
  color: #ffca1e;
}
.links-area i {
  font-size: 14px;
  display: inline-block;
  position: relative;
  top: 2px;
}

.sett-margins {
  margin: 30px 0;
}

.box-margin {
  margin-top: 20px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.wrapp-title {
  direction: rtl;
  text-align: right;
  padding-right: 20px;
  margin-bottom: 30px;
}
.wrapp-title h3 {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 28px;
}
.wrapp-title h3 span {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 28px;
  background: #ffca1e;
}

.flex-title {
  display: flex;
  align-items: center;
}

.page-wrapp {
  position: relative;
  top: -40px;
  margin-bottom: 50px;
  text-align: right;
  padding: 40px 35px;
  background: rgb(255, 255, 255);
  border-radius: 8px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.blog-title {
  padding-right: 20px !important;
  margin-bottom: 30px;
}
.blog-title .tag-title {
  background-color: rgba(255, 202, 30, 0.2509803922);
  color: #000;
  width: max-content;
  padding: 8px;
  border-radius: 20px;
  padding: 3px 20px;
  font-weight: 700;
  margin-bottom: 12px;
}
.blog-title h3 {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 28px;
}

.see-all-btn {
  background: #ffca1e;
  color: #000;
  display: flex;
  align-items: center;
  border-radius: 6px;
  padding: 5px 15px;
  font-weight: 700;
  width: max-content;
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 22px;
}
.see-all-btn i {
  font-size: 20px;
  margin-right: 10px;
}

.wrapp-about-section p {
  text-align: justify !important;
  font-size: 13px;
}

.btn-area {
  height: 50px;
  display: flex;
  justify-content: end;
  padding-left: 20px !important;
}

.blog-cart-wrapp-big {
  margin-bottom: 35px;
  text-align: right;
  padding: 15px;
  background: rgb(255, 255, 255);
  border-radius: 8px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}
.blog-cart-wrapp-big p {
  font-size: 13px;
  text-align: justify;
}

.blog-img {
  height: 350px;
  width: 100%;
  object-fit: cover;
  position: relative;
  border-radius: 8px;
  top: -30px;
}
.blog-img img {
  height: 100%;
  border-radius: 8px;
  width: 100%;
  object-fit: cover;
}

.blog-margins {
  margin-top: 50px;
}

.blog-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.blog-link .blog-date i {
  font-size: 20px;
  color: #ffca1e;
  margin-left: 5px;
  display: inline-block;
}
.blog-link .blog-date strong {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 20px;
}
.blog-link .blog-date span {
  font-weight: 600;
  margin-right: 5px;
  display: inline-block;
}

.btn-link {
  background-color: rgba(255, 202, 30, 0.1411764706);
  padding: 5px 12px;
  padding-left: 10px;
  border-radius: 6px;
  color: #1e1e1e;
  font-weight: 600;
  display: flex;
  margin-top: 5px;
  align-items: center;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
}
.btn-link i {
  margin-right: 5px;
  font-size: 18px;
  display: inline-block;
}

.blog-link-small {
  padding: 5px 12px;
  padding-left: 10px;
  border-radius: 6px;
  color: #1e1e1e;
  font-weight: 600;
  display: flex;
  margin-top: 5px;
  align-items: center;
  text-decoration: none;
  font-size: 14px;
  font-weight: 600;
  display: flex;
  justify-content: space-between;
}
.blog-link-small .blog-date i {
  font-size: 20px;
  color: #ffca1e;
  margin-left: 5px;
  display: inline-block;
}
.blog-link-small .blog-date strong {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 20px;
}
.blog-link-small .blog-date span {
  font-weight: 600;
  margin-right: 5px;
  display: inline-block;
}
.blog-link-small i {
  margin-right: 5px;
  font-size: 18px;
  display: inline-block;
}

.blog-cart-wrapp-small {
  display: flex;
  margin-bottom: 10px;
  text-align: right;
  align-items: center;
  padding: 15px;
  background: rgb(255, 255, 255);
  border-radius: 8px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.blog-img-small {
  height: 150px;
  width: 320px;
  border-radius: 8px;
  object-fit: cover;
}
.blog-img-small img {
  height: 100%;
  width: 100%;
  border-radius: 8px;
  object-fit: cover;
}

.small-blog-caption {
  margin-right: 20px;
}
.small-blog-caption h4 {
  font-size: 26px !important;
  margin: 4px 0px;
  margin-top: -8px;
  border-bottom: 1px solid #eee;
  padding-bottom: 10px;
  margin-bottom: 10px;
  font-family: KalamehWeb;
  font-weight: 800;
  position: relative;
}

.blogs-details {
  display: flex;
  flex-direction: column;
}

.information-banner {
  height: 250px;
  object-fit: cover;
  width: 100%;
}
.information-banner img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.course-info-boxes {
  height: 250px;
  padding: 0px;
  border: 0.5px solid rgba(17, 17, 17, 0.12);
}

.information-box {
  padding: 10px 30px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: right;
  height: 100%;
  justify-content: center;
}
.information-box .info-title {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 22px;
  height: 55px;
}

.information-icon {
  height: 45px;
  width: 45px;
  object-fit: contain;
}
.information-icon img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.course-title-area {
  padding: 0px;
  margin-bottom: 30px;
}
.course-title-area h5 {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 28px;
}
.course-title-area h5 strong {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 28px;
  background: #ffca1e;
}

.course-caption-img {
  height: 400px;
  width: 100%;
  object-fit: cover;
  border-radius: 6px;
}
.course-caption-img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 6px;
}

.course-caption-area {
  padding: 0px;
  margin-top: 55px;
}

.course-caption-details {
  padding: 20px 30px;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  justify-content: center;
}
.course-caption-details h3 {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 28px;
  margin-bottom: 15px;
}
.course-caption-details p {
  margin-top: 10px;
  font-size: 14px;
  text-align: justify;
}

.course-wrapp-banner {
  border: none !important;
}

.strong-margin {
  margin-top: 50px;
}

.level-sort-areas {
  padding: 0px;
  border: 0.5px solid rgba(17, 17, 17, 0.12);
  height: 220px;
}

.wrapp-level-box {
  padding: 20px 30px;
}
.wrapp-level-box h4 {
  font-size: 18px;
  font-weight: 600;
  text-align: center;
}
.wrapp-level-box ul {
  list-style: none;
  padding-right: 22px;
  margin-top: 20px;
  height: 80px;
}
.wrapp-level-box li {
  font-size: 14px;
  margin-bottom: 0.5em;
  list-style-type: none;
  padding: 0.25em 0 0 2.5em;
  position: relative;
  color: #000;
}
.wrapp-level-box li:before {
  content: " ";
  display: block;
  border: solid 0.55em #add2ae;
  border-radius: 0.8em;
  height: 0;
  width: 0;
  position: absolute;
  top: 40%;
  right: -1.5em;
  margin-top: -0.2em;
}
.wrapp-level-box li::after {
  content: " ";
  display: block;
  width: 0.4em;
  height: 0.6em;
  border: solid #fff;
  border-width: 0 0.2em 0.2em 0;
  position: absolute;
  top: 42%;
  right: -17px;
  margin-top: -2px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
}
.wrapp-level-box .level-btn {
  height: 45px;
  width: 100%;
  border-radius: 6px;
  background-color: rgba(255, 202, 30, 0.3882352941);
  padding: 0px 8px;
  justify-content: center;
  color: #000000;
  font-weight: 600;
  display: flex;
  margin-top: 5px;
  text-align: center;
  align-items: center;
  margin-top: 15px;
}
.wrapp-level-box .level-btn:hover {
  background: #1e1e1e;
  color: #ffca1e;
}

.panel-btn {
  width: 100%;
  font-weight: 600;
  font-size: 16px;
}

.accordion-button::after {
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  margin-right: auto;
  margin-left: 0 !important;
}

.accordion-button:not(.collapsed) {
  color: #000000;
  background-color: rgba(12, 12, 12, 0.0666666667);
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.125);
}

.accordion-button:focus {
  z-index: 3;
  border-color: rgba(255, 255, 255, 0);
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0);
}

.few-padding {
  padding: 20px 55px;
}

.low-margin {
  margin-top: 30px;
}

.calender-img-area {
  display: flex;
  justify-content: center;
}

.accordion-button {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  padding: 1.5rem 1.25rem;
}

.wrapp-contact-box {
  padding: 15px;
  border-radius: 6px;
  height: 180px;
  background-color: rgba(102, 147, 227, 0.15);
  border: 1px solid #f2f2f2;
}
.wrapp-contact-box i {
  text-align: center;
  font-size: 30px;
  background: #fff;
  border-radius: 50%;
  width: 60px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.101);
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #060023;
}
.wrapp-contact-box h4 {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 28px;
  color: #000;
  margin-top: 8px;
}
.wrapp-contact-box strong {
  font-weight: 600;
  color: #000;
}

.contact-section h3 {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 36px;
  color: #000;
  margin-bottom: 20px;
}

.contact-us-tltle {
  margin-top: 20px;
  margin-bottom: 30px;
  border-bottom: 1px solid #eee;
  padding-bottom: 10px;
}
.contact-us-tltle h5 {
  margin-top: 30px;
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 28px;
  padding: 2px 8px;
  background: #ffca1e;
  width: max-content;
}

.branch-wrapper {
  background: #e8effb;
  border-radius: 6px;
  padding: 20px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 3px #e8effb;
}
.branch-wrapper h3 {
  font-size: 20px;
  font-weight: 600;
  text-align: center;
  border-bottom: 1px solid #dedede;
  padding-bottom: 10px;
  font-family: IRANYekan !important;
}
.branch-wrapper i {
  font-size: 18px;
}

.address span {
  font-size: 13px;
}

.branch-phone {
  background: #fff;
  padding: 10px;
  width: 100%;
  border-radius: 4px;
  margin: 5px 0px;
  text-align: center;
  display: block;
  direction: rtl;
  color: #000;
  font-weight: 600;
}

.see-more-btn {
  background: #1e1e1e;
  color: #ffca1e;
  padding: 10px;
  width: 100%;
  display: block;
  text-align: center;
  border-radius: 4px;
  margin: 5px 0px;
}

.branch-img-wrapp {
  width: 100%;
  height: 320px;
  object-fit: cover;
  position: relative;
  top: -30px;
  border-radius: 6px;
}
.branch-img-wrapp img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 6px;
}

.signup-content {
  padding: 40px 35px;
  background: rgb(255, 255, 255);
  border-radius: 8px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.signup {
  position: relative;
  top: -90px;
}

.signup-image figure {
  height: 100%;
  width: 100%;
  display: flex;
}

.page-wrapp select {
  margin-right: 0px !important;
  padding: 0.5rem 1rem;
  direction: rtl;
  padding-right: 2rem;
  background-position: left;
}

.page-wrapp label {
  display: block;
  margin-bottom: 5px;
  position: relative;
  top: 18px;
  font-size: 15px;
  padding: 5px 10px;
  background: #fff;
  width: max-content;
  right: 15px;
  font-weight: 600;
  z-index: 2;
}

.page-wrapp .form-control {
  display: block;
  width: 100%;
  padding: 14px 20px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgba(48, 48, 48, 0.2117647059);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.page-wrapp .vpd-icon-btn {
  background: #ffca1e !important;
  display: block;
  margin-bottom: 5px;
  position: relative;
  top: 0px;
  font-size: 15px;
  padding: 5px 15px;
  background: #fff;
  width: max-content;
  right: -2px;
  font-weight: 600;
  height: 50px;
  z-index: 1;
  margin-bottom: 0px;
  display: flex;
  border-radius: 4px;
}

.vpd-main {
  direction: ltr;
}

.vpd-input-group input {
  padding: 5px 20px !important;
}

.page-wrapp .form-control::placeholder {
  color: #c7c7c7;
  font-size: 13px;
}

.btns-row {
  display: flex;
  justify-content: end;
  flex-direction: row-reverse;
  align-items: center;
  margin-top: 30px;
}

.register-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #000;
  color: #ffca1e !important;
  font-size: 16px;
  text-align: center;
  width: 100%;
  font-weight: 600;
}

.login-nav {
  color: #000;
  border-bottom: 1px solid #eee;
  padding-bottom: 8px;
  padding: 10px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: space-around;
  background: rgba(255, 202, 30, 0.3607843137);
  font-size: 16px;
  text-align: center;
  width: 100%;
  font-weight: 600;
}

.login-nav i {
  font-size: 18px;
  color: #000 !important;
}

.signup-image {
  display: flex;
  flex-direction: column;
}

.check-form label {
  position: relative;
  top: 0px !important;
}

input[type=checkbox]:not(old) + label > span {
  display: inline-block;
  width: 0px;
  height: 0px;
  margin-right: -18px;
  margin-bottom: 3px;
  border: none;
  border-radius: 2px;
  background: none;
  vertical-align: bottom;
}

.signup-form, .signup-image, .signin-form, .signin-image {
  width: 65%;
  overflow: hidden;
}

.wrapp-links-box {
  border-radius: 10px;
  height: 175px;
  background-position: center;
  background-size: cover;
  margin: 10px 0px;
}

.wrapp-links-bg {
  height: 100%;
  width: 100%;
  background: -webkit-linear-gradient(96deg, hsl(0, 0%, 13.65%) 0%, rgba(57, 44, 1, 0.27) 100%);
  border-radius: 10px;
  display: flex;
  align-items: end;
  padding: 30px 30px;
}
.wrapp-links-bg h3 {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 28px;
  color: #fff;
  background: #000;
  height: 8px;
  position: relative;
  top: -20px;
}

.wrapp-student-histories {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: rgb(255, 255, 255);
  border-radius: 4px;
  padding: 15px 20px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.13);
  margin-top: 10px;
}
.wrapp-student-histories .alert-icon-box {
  padding: 10px;
  background: hsl(0, 0%, 15%);
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
}
.wrapp-student-histories .alert-icon-box i {
  font-size: 25px;
  color: #ffca1e;
}
.wrapp-student-histories a {
  width: 115px;
  font-size: 16px;
  color: #000;
  font-weight: 600;
  padding: 8px 10px;
  background: rgba(255, 202, 30, 0.2117647059);
  border-radius: 6px;
}
.wrapp-student-histories a i {
  margin-right: 5px;
}

.wrapp-first {
  display: flex;
  align-items: center;
}
.wrapp-first h4 {
  font-size: 18px;
  font-weight: 600;
  margin-right: 20px;
}

.success-alert-box {
  background: #e5ffeb !important;
  box-shadow: none !important;
}
.success-alert-box .wrapp-first .alert-icon-box i {
  color: #00f455 !important;
}

.danger-alert-box {
  background: #ffcece !important;
  box-shadow: none !important;
}
.danger-alert-box .wrapp-first .alert-icon-box i {
  color: #cf0000 !important;
}

.notification-center {
  background: rgb(255, 255, 255);
  border-radius: 4px;
  padding: 15px 20px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.13);
  margin-top: 10px;
}
.notification-center .notif-head {
  margin-bottom: 15px;
  padding-bottom: 10px;
  border-bottom: 1px solid hsl(0, 0%, 87%);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.notification-center .notif-body {
  padding: 10px;
}
.notification-center .notif-body p {
  font-size: 14px;
  text-align: justify;
}
.notification-center .notif-body ul {
  padding-right: 30px;
}
.notification-center .alert-icon-box {
  padding: 10px;
  background: hsl(46.67, 63.38%, 86.08%);
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
}
.notification-center .alert-icon-box i {
  font-size: 25px;
  color: #000;
}

.wrapp-calender {
  padding: 15px;
  border-radius: 6px;
  height: 220px;
  background-color: rgba(102, 147, 227, 0.15);
  border: 1px solid #f2f2f2;
}
.wrapp-calender .calender-body {
  padding: 10px;
}
.wrapp-calender .calender-body p {
  font-size: 16px;
  font-weight: 600;
  height: 70px;
}
.wrapp-calender .calender-body .see-calendar {
  background: #fff;
  padding: 2px 6px;
  border-radius: 6px;
  display: block;
  margin-top: 10px;
  border: 1px solid #f2f2f2;
  width: max-content;
}
.wrapp-calender:hover {
  background-color: rgba(17, 39, 77, 0.829);
  border: 1px solid #f2f2f2;
}
.wrapp-calender:hover p {
  color: #fff;
}

.calender-header {
  display: flex;
  justify-content: space-between;
  direction: ltr;
  align-items: center;
  border-bottom: 1px solid rgba(102, 148, 227, 0.546);
  padding-bottom: 10px;
}
.calender-header .mdi-calendar-multiple-check {
  color: #0b0044;
  font-size: 26px;
  text-align: center;
  font-size: 30px;
  background: #fff;
  border-radius: 50%;
  width: 60px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.101);
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.calender-header .mdi-circle {
  color: rgba(102, 148, 227, 0.546);
}

.calnedar-img {
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 800px;
  border-radius: 8px;
  object-fit: contain;
  padding: 10px;
}
.calnedar-img img {
  border-radius: 8px;
  object-fit: contain;
}

.tabs {
  margin: 0 auto;
  font-size: 0;
  text-align: center;
}

.tabs > input[type=radio] {
  display: none;
}

.tabs > div {
  display: none;
  padding: 10px 15px;
  font-size: 16px;
  margin-top: 20px;
}

#tab-btn-1:checked ~ #content-1, #tab-btn-2:checked ~ #content-2, #tab-btn-3:checked ~ #content-3 {
  display: block;
  display: flex;
  justify-content: center;
}

.tabs > label {
  display: inline-block;
  text-align: center;
  vertical-align: middle;
  user-select: none;
  background-color: hsl(46.67, 63.38%, 86.08%);
  border: 1px solid hsl(46.67, 63.38%, 86.08%);
  color: #000;
  padding: 18px 30px;
  width: 180px;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out;
  cursor: pointer;
  position: relative;
  border-radius: 4px;
  top: 1px;
  margin: 0px 5px;
}

.tabs > input[type=radio]:checked + label {
  background-color: #454545;
  color: #ffca1e;
}

.page-wrapp .cart-wrappering {
  margin-bottom: 35px;
  text-align: right;
  height: 19rem;
  padding: 15px;
  background: rgb(255, 255, 255);
  border-radius: 8px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 0px 14px 8px rgba(0, 0, 0, 0.06);
}
.page-wrapp .cart-wrappering .course-name {
  font-size: 16px;
}

.all-course-caption {
  margin: 20px 0px;
  margin-bottom: 40px;
}
.all-course-caption p {
  text-align: justify;
}

.wrapp-branch-caption h3 {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 28px;
  margin-bottom: 10px;
  padding-bottom: 15px;
  border-bottom: 1px solid #eee;
}
.wrapp-branch-caption p {
  font-size: 14px;
  margin-bottom: 20px;
  text-align: justify;
}

.page-wrapp select {
  margin-right: 0px !important;
  padding: 0.5rem 1rem;
  direction: rtl;
  padding-right: 2rem;
  background-position: left;
}

.page-wrapp label {
  display: block;
  margin-bottom: 5px;
  position: relative;
  top: 18px;
  font-size: 15px;
  padding: 5px 10px;
  background: #fff;
  width: max-content;
  right: 15px;
  font-weight: 600;
  z-index: 2;
}

.page-wrapp .tabs label {
  display: inline !important;
}

.page-wrapp .form-control {
  display: block;
  width: 100%;
  padding: 14px 20px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgba(48, 48, 48, 0.2117647059);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.page-wrapp .vpd-icon-btn {
  background: #ffca1e !important;
  display: block;
  margin-bottom: 5px;
  position: relative;
  top: 0px;
  font-size: 15px;
  padding: 5px 15px;
  background: #fff;
  width: max-content;
  right: -2px;
  font-weight: 600;
  height: 50px;
  z-index: 1;
  margin-bottom: 0px;
  display: flex;
  border-radius: 4px;
}

.vpd-main {
  direction: ltr;
}

.vpd-input-group input {
  padding: 5px 20px !important;
}

.page-wrapp .form-control::placeholder {
  color: #c7c7c7;
  font-size: 13px;
}

.btns-row {
  display: flex;
  justify-content: end;
  flex-direction: row-reverse;
  align-items: center;
  margin-top: 30px;
}

.register-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #000;
  color: #ffca1e !important;
  font-size: 16px;
  text-align: center;
  width: 100%;
  font-weight: 600;
}

.login-nav {
  color: #000;
  border-bottom: 1px solid #eee;
  padding-bottom: 8px;
  padding: 10px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: space-around;
  background: rgba(255, 202, 30, 0.3607843137);
  font-size: 16px;
  text-align: center;
  width: 100%;
  font-weight: 600;
}

.login-nav i {
  font-size: 18px;
  color: #000 !important;
}

.signup-image {
  display: flex;
  flex-direction: column;
}

.check-form label {
  position: relative;
  top: 0px !important;
}

input[type=checkbox]:not(old) + label > span {
  display: inline-block;
  width: 0px;
  height: 0px;
  margin-right: -18px;
  margin-bottom: 3px;
  border: none;
  border-radius: 2px;
  background: none;
  vertical-align: bottom;
}

.signup-form, .signup-image, .signin-form, .signin-image {
  width: 65%;
  overflow: hidden;
}

.select-city {
  background: #e7edff;
  padding: 30px 50px;
  border-radius: 8px;
  border-radius: 8px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.select-city select {
  margin-right: 0px !important;
  padding: 0.8rem 1rem !important;
  direction: rtl;
  padding-right: 2rem;
  background-position: left;
  width: 36%;
  background-color: #fff !important;
  border-radius: 5px;
  border: 1px solid #eee !important;
}

.terms-selector {
  width: 73% !important;
}

.select-city-title {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 22px;
}

.select-city-title i {
  color: #3e8cff;
  margin: 0px 10px;
}

.select-city-flex {
  display: flex !important;
  align-items: center;
  justify-content: space-around;
}

.terms-row thead {
  border: none !important;
  background: #eee;
}

.terms-row .table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
  padding: 8px;
  line-height: 1.42857143;
  vertical-align: middle;
  border: none !important;
}

.terms-select-img img {
  height: 100px;
  object-fit: cover;
  border-radius: 6px;
}

.wrapp-terms-details {
  margin-bottom: 35px;
  text-align: right;
  height: 15rem;
  padding: 15px;
  background: rgb(255, 255, 255);
  border-radius: 8px;
  border: 1px solid #f2f2f2;
  margin-top: 22px;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.wrapp-term-img {
  border-radius: 8px;
  height: 200px;
  width: 100%;
  object-fit: cover;
  position: relative;
  top: -30px;
}

.wrapp-term-img img {
  border-radius: 8px;
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.wrapp-terms-caption {
  height: 0px;
  display: flex;
  align-items: center;
}

.wrapp-terms-caption p {
  font-size: 17px;
  line-height: 25px;
  font-weight: 700;
  color: #000000;
}

.term-titles {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 24px;
}

.terms-head {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 24px;
  margin: 25px 0px;
  padding-bottom: 10px;
  border-bottom: 1px solid #eee;
}

.terms-head i {
  color: #ffca1e;
  font-size: 16px;
}

.table > thead {
  vertical-align: bottom;
  background: #e7edff;
  padding: 10px;
  height: 50px;
  line-height: 37px;
  border: none !important;
}

.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
  padding: 8px;
  line-height: 1.42857143;
  vertical-align: middle;
  border-top: none !important;
}

tr:hover {
  background-color: #ffca1e;
}

.btn-submited {
  color: #000;
  width: max-content;
  border: 2px solid transparent;
  padding: 12px 25px;
  border-radius: 6px;
  background: #ffca1e;
  font-weight: 600;
}

.btn-submited:hover {
  background: #000;
  color: #ffca1e;
}

.capacity {
  padding: 5px 10px;
  border-radius: 6px;
}

.max-capacity {
  background: #ffd4d8;
}

.high-capacity {
  background: #ffe2d6;
}

.mid-capacity {
  background: #e4f2ff;
}

.low-capacity {
  background: #d7ffed;
}

.wrapp-teacher-cart {
  display: flex;
  align-items: center;
  background: rgba(102, 147, 227, 0.15);
  border-radius: 4px;
  padding: 15px 20px;
  border: 1px solid rgba(102, 147, 227, 0.17);
  margin-top: 10px;
}
.wrapp-teacher-cart .wrapp-teacher-caption {
  display: flex;
  align-items: start;
  text-align: right;
  flex-direction: column;
}
.wrapp-teacher-cart .wrapp-teacher-caption .mini-name-line {
  background: #ffca1e;
  height: 3px;
  width: 35px;
  margin-top: -2px;
}
.wrapp-teacher-cart .wrapp-teacher-caption .teacher-name {
  width: 100%;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(102, 147, 227, 0.17);
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 24px;
}
.wrapp-teacher-cart .wrapp-teacher-caption p {
  font-size: 14px;
}
.wrapp-teacher-cart:hover {
  background: rgba(51, 92, 161, 0.15);
  border: 1px solid #f2f2f2;
  box-shadow: none;
}

.currency {
  height: 47px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 700;
  margin-top: 22px;
  background: #e8effb;
  border-radius: 6px;
}

.form-row-title h3 {
  display: block;
  margin-bottom: 5px;
  position: relative;
  top: 18px;
  font-size: 15px;
  padding: 5px 10px;
  background: #fff;
  width: max-content;
  right: 15px;
  font-weight: 600;
  z-index: 2;
}

.account-form-select {
  margin-right: 0px;
  width: 100% !important;
  height: 48px;
  margin: auto;
  background-color: #fff;
  border: 1px solid #eee;
  border-radius: 6px;
  outline: none;
  padding: 2px 15px;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-repeat: no-repeat;
  background-position-x: 5px;
  background-position-y: 10px;
  border: 1px solid #dfdfdf;
}

.plans {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  direction: rtl;
  max-width: 970px;
  padding: 30px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background: #fff;
  -webkit-box-shadow: 0px 8px 10px 0px #d8dfeb;
  box-shadow: 0px 8px 10px 0px rgba(216, 223, 235, 0.5098039216);
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  border-radius: 10px;
  flex-wrap: wrap;
  margin-top: 15px;
  flex-direction: row-reverse;
  text-align: right;
}

.no-plans-style {
  max-width: unset;
  box-shadow: none !important;
  padding: 0px !important;
}

.plans .payment-method-inpt {
  cursor: pointer;
  margin-left: 10px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  flex-direction: column;
  font-weight: 600;
}

.inpt-content {
  padding: 10px !important;
  width: 170px;
  display: flex;
  direction: rtl;
  align-items: center;
  justify-content: space-around;
}

.inpt-content img {
  margin-left: 0px !important;
}

.panel-default > .panel-heading {
  color: #333;
  background-color: rgba(246, 153, 4, 0.1019607843);
  border-color: #e4e5e7;
  padding: 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border-radius: 10px;
}

.collapse-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.panel-default > .panel-heading a {
  display: block;
  padding: 10px 15px;
  padding-left: 20px;
  font-size: 14px;
  color: #000000;
  margin-bottom: 15px;
}

.panel-default > .panel-heading a:after {
  content: "";
  position: relative;
  top: 1px;
  display: inline-block;
  font-family: "Glyphicons Halflings";
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  float: right;
  transition: transform 0.25s linear;
  -webkit-transition: -webkit-transform 0.25s linear;
}

.panel-default > .panel-heading a[aria-expanded=true] {
  background-color: #fcfcfc;
  border-radius: 5px;
  border: 1px solid rgba(229, 229, 229, 0.3019607843);
}

.image-title-wrapping {
  display: flex;
  align-items: center;
}

.no-plans-style {
  max-width: unset;
  box-shadow: none !important;
  padding: 0px !important;
}

.plans .payment-method-inpt {
  cursor: pointer;
  margin-left: 10px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  flex-direction: column;
  font-weight: 600;
}

.inpt-content {
  padding: 10px !important;
  width: 170px;
  display: flex;
  direction: rtl;
  align-items: center;
  justify-content: space-around;
}

.inpt-content img {
  margin-left: 0px !important;
}

.panel-default > .panel-heading {
  color: #333;
  background-color: rgba(246, 153, 4, 0.1019607843);
  border-color: #e4e5e7;
  padding: 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border-radius: 10px;
}

.plans .plan input[type=radio] {
  position: absolute;
  opacity: 0;
}

.plans .plan {
  cursor: pointer;
  width: 48.5%;
}

.full-width {
  width: 100%;
  z-index: 1;
}

.plans .full-width {
  width: 100% !important;
}

.plans .plan .plan-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 30px 20px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid rgba(0, 0, 0, 0.81);
  border-radius: 10px;
  -webkit-transition: -webkit-box-shadow 0.4s;
  transition: -webkit-box-shadow 0.4s;
  -o-transition: box-shadow 0.4s;
  transition: box-shadow 0.4s;
  transition: box-shadow 0.4s, -webkit-box-shadow 0.4s;
  position: relative;
}

.plans .plan .plan-content img {
  margin-left: 30px;
  height: 45px;
}

.plans .plan .plan-details span {
  margin-bottom: 10px;
  display: block;
  font-size: 18px;
  line-height: 24px;
  color: #252f42;
}

.plans .plan .plan-details strong {
  margin-bottom: 10px;
  display: block;
  font-size: 14px;
  font-weight: normal;
}

.plans .plan .plan-details select {
  font-size: 14px;
  height: 42px;
}

.container .title {
  font-size: 16px;
  font-weight: 500;
  -ms-flex-preferred-size: 100%;
  flex-basis: 100%;
  color: #252f42;
  margin-bottom: 0px;
}

.plans .plan .plan-details p {
  color: #646a79;
  font-size: 12px;
  line-height: 18px;
}

.faq-space {
  margin-top: 140px;
}

.plans .plan .plan-content:hover {
  -webkit-box-shadow: 0px 3px 5px 0px #e8e8e8;
  box-shadow: 0px 3px 5px 0px #e8e8e8;
}

.plans .plan input[type=radio]:checked + .plan-content:after {
  content: "";
  position: absolute;
  height: 8px;
  width: 8px;
  background: #216fe0;
  right: 20px;
  top: 20px;
  border-radius: 100%;
  border: 3px solid #fff;
  -webkit-box-shadow: 0px 0px 0px 2px #0066ff;
  box-shadow: 0px 0px 0px 2px #0066ff;
  display: none;
  margin-bottom: 20px;
}

.plans .plan input[type=radio] + .plan-content {
  margin-bottom: 20px;
}

.plans .plan input[type=radio]:checked + .plan-content {
  border: 1px solid #fef2f4;
  background: #f8ebff;
  -webkit-transition: ease-in 0.3s;
  -o-transition: ease-in 0.3s;
  transition: ease-in 0.3s;
  box-shadow: rgba(0, 0, 0, 0.04);
  background: linear-gradient(44deg, #fdfeff 0.64%, #ffebed 98.23%);
  box-shadow: 0px 3px 5px 0px #fef4f5;
}

.main-payment {
  background: #b3f7d7;
  border: none;
  height: 60px;
  border-radius: 6px;
  padding: 0px 25px;
  width: max-content;
}
.main-payment i {
  margin-right: 10px;
}

.payment-method-row {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
}

.wrapp-payment a {
  padding: 10px 15px;
  background-color: #ffca1e;
  color: #000;
  font-size: 14px;
  font-weight: 600;
  height: 42px;
  width: 176px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 4px;
}

.btn-upload {
  background: #ffca1e;
  padding: 13px 15px;
  font-size: 15px;
  border-radius: 0px 4px 4px 0px;
  font-weight: 600;
  margin-top: -1px;
  display: inline-block;
}

.file-inpt {
  border-radius: 4px 0px 0px 4px !important;
  height: 48px;
  margin: auto;
  background-color: #fff;
  border: 1px solid #dfdfdf;
  outline: none;
  padding: 2px 15px;
}

.profile-img-wrapp {
  height: 250px;
  width: 100%;
  object-fit: cover;
  padding: 10px;
  border: 1px solid #eee;
  background-color: #f3f3f3;
  border-radius: 4px;
  margin-bottom: 30px;
}
.profile-img-wrapp img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 4px;
}

.section-top {
  margin-bottom: 30px;
}

.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.mini-padding {
  padding: 0 25px;
}

.rounded {
  border-radius: 8px;
}

.medium-top-space {
  margin-top: 25px;
}

.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.purple-ring {
  height: 2px;
  background: #ffca1e;
}

.logo {
  height: 60px;
  width: 205px;
  object-fit: contain;
}
.logo img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.wrapp-all-menu {
  background-color: rgba(252, 252, 252, 0.523);
  position: fixed;
  /* left: 0; */
  top: 0;
  /* right: 0; */
  z-index: 100000000;
  width: 100vw;
}

.header {
  box-shadow: 0px 5px 8px 3px rgba(0, 0, 0, 0.07);
  display: block;
  width: 100%;
  position: relative;
  z-index: 99;
  padding: 0px 15px !important;
  direction: rtl;
  background: transparent;
}
.header:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: #fff;
  backdrop-filter: blur(10px);
  top: 0px;
  right: 0px;
  left: 0px;
}

.topper-back {
  background: rgba(65, 63, 63, 0.81);
  background: rgba(0, 0, 0, 0.81);
}

.v-center {
  z-index: 1000;
  display: block;
  position: relative;
  display: flex;
  align-items: center;
}

.header .item-left {
  flex: 0 0 15%;
}

.header .logo a {
  color: #000000;
  font-weight: 700;
  text-decoration: none;
}

.header .item-center {
  flex: 0 0 61%;
}

.header .item-right {
  flex: 0 0 22.5%;
  display: flex;
  justify-content: flex-end;
}

.header .item-right a {
  text-decoration: none;
  transition: color 0.3s ease;
}

.header .menu > ul > li {
  display: inline-block;
  line-height: 50px;
  margin-left: 12px;
}

.header .menu > ul > li > a {
  font-size: 15px;
  font-weight: 600;
  color: #000;
  position: relative;
  text-decoration: none;
  transition: color 0.3s ease;
}

.header .menu > ul > li .sub-menu {
  position: absolute;
  z-index: 500;
  background-color: #ffffff;
  box-shadow: -2px 2px 70px -25px rgba(0, 0, 0, 0.3);
  padding: 20px 30px;
  transition: all 0.5s ease;
  margin-top: 25px;
  opacity: 0;
  visibility: hidden;
}

@media (min-width: 992px) {
  .header .menu > ul > li.menu-item-has-children:hover .sub-menu {
    margin-top: 0;
    visibility: visible;
    opacity: 1;
  }
}
.header .menu > ul > li .sub-menu > ul > li {
  line-height: 1;
}

.header .menu > ul > li .sub-menu > ul > li > a {
  display: inline-block;
  padding: 10px 0;
  font-size: 14px;
  color: #000000;
  font-weight: 600;
  transition: color 0.3s ease;
  text-decoration: none;
  text-transform: capitalize;
}

.header .menu > ul > li .single-column-menu {
  min-width: 280px;
  max-width: 350px;
}

.header .menu > ul > li .sub-menu.mega-menu > .list-item > ul > li {
  line-height: 1;
  display: block;
}

.header .menu > ul > li .sub-menu.mega-menu > .list-item > ul > li > a {
  padding: 10px 0;
  display: inline-block;
  font-size: 14px;
  color: #1b1b1b;
  transition: color 0.3s ease;
}

.header .menu > ul > li .sub-menu.mega-menu {
  left: 50%;
  transform: translateX(-50%);
}

.header .menu > ul > li .sub-menu.mega-menu-column-4 {
  max-width: 1300px;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 20px 15px;
  border-radius: 10px;
}

.header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item {
  flex: 0 0 25%;
  padding: 0 15px;
}

.header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item .title {
  font-size: 15px;
  color: rgba(0, 0, 0, 0.81);
  font-weight: 600;
  line-height: 1;
  padding: 10px 0;
  border-bottom: 1px solid #ffca1e;
}

.header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item.text-center .title {
  text-align: center;
}

.header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item img {
  max-width: 100%;
  width: 75%;
  margin-top: 10px;
  height: 100px;
  border-radius: 6px;
  object-fit: cover;
  display: flex;
  justify-content: flex-start;
}

.header .menu > ul > li .sub-menu.mega-menu > .list-item > ul > li > a:hover,
.header .menu > ul > li .sub-menu > ul > li > a:hover,
.header .item-right a:hover,
.header .menu > ul > li:hover > a {
  color: #000;
}

/* banner section */
.banner-section {
  background-size: cover;
  background-position: center;
  height: 700px;
  width: 100%;
  display: block;
}

.mobile-menu-head,
.mobile-menu-trigger {
  display: none;
}

/*responsive*/
@media (max-width: 1270px) {
  .main-slider-slide {
    height: 350px;
  }
  .cart-wrappering .cart-img {
    height: 150px;
  }
  .w-absolute {
    height: 100px;
  }
  .cart-wrappering {
    height: 15rem;
  }
  .cart-big-wrapping {
    height: 17rem;
  }
  .name-course {
    margin-top: 20px;
    font-size: 14px;
    line-height: 22px;
    height: 45px;
    font-weight: 600;
  }
  .w-see-course {
    padding: 0px 5px;
    padding-left: 6px;
    border-radius: 6px;
    margin-top: 5px;
    font-size: 12px;
  }
  .w-see-course i {
    font-size: 16px;
    margin-right: 0px;
    margin-bottom: 2px;
  }
  .container.main-container .row.rtl {
    display: flex;
    justify-content: space-between;
  }
  .blog-img-small {
    height: 100px;
    width: 220px;
  }
  .small-blog-caption h4 {
    font-size: 22px !important;
    margin: 4px 0px;
    margin-top: -8px;
    padding-bottom: 0px;
  }
  .btn-link {
    padding: 0px 12px;
    padding-left: 4px;
    margin-top: 0px;
    font-size: 12px;
  }
  .blog-cart-wrapp-small {
    display: flex;
    margin-bottom: 10px;
    padding: 10px;
  }
  .blog-link-small .blog-date i {
    font-size: 16px;
  }
  .blog-img {
    height: 172px;
    top: -30px;
  }
  .about-count-box strong {
    font-size: 14px;
  }
  .about-us-section h3 {
    font-size: 26px;
    margin-bottom: 15px;
  }
  .carousel__item-head .skill-icon-header {
    width: 60px;
  }
  .carousel__item-head {
    width: 70px;
    height: 70px;
    color: #fff;
  }
  .carousel__item-body {
    width: 100%;
    background-color: rgb(27, 27, 27);
    border-radius: 6px;
    padding: 18px 20px;
    margin-right: 20px;
  }
  .blog-name {
    font-size: 27px !important;
  }
  .carousel__item-body p {
    font-size: 22px !important;
    flex-basis: 100%;
    font-weight: 700 !important;
    color: #ffffff !important;
    margin-bottom: 0px !important;
  }
  .wrapp-static-box .static-box-img {
    height: 60px;
    width: 60px;
    padding: 10px;
  }
  .wrapp-static-box {
    height: 170px;
    border-radius: 8px;
    padding: 10px 20px;
    margin: 12px 5px;
  }
  .wrapp-static-box h4 {
    font-size: 14px;
    font-weight: 600;
    margin: 12px 0px;
  }
  .links-area a {
    font-size: 12px;
    padding: 2px 6px;
  }
  .logo {
    height: 50px;
    width: 185px;
    object-fit: contain;
    margin-right: 25px;
    margin-top: 8px;
  }
  .header .item-center {
    order: 3;
    flex: 0 0 100%;
  }
  .header .item-left, .header .item-right {
    flex: 0 0 50%;
  }
  .header {
    height: 80px;
  }
  .v-center {
    justify-content: space-between;
  }
  .header .mobile-menu-trigger {
    display: flex;
    height: 30px;
    width: 30px;
    margin-left: 0px;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    right: 15px;
    position: absolute;
    top: 25px;
  }
  .header .mobile-menu-trigger span {
    display: block;
    height: 2px;
    background-color: #333333;
    width: 24px;
    position: relative;
  }
  .header .mobile-menu-trigger span:before,
  .header .mobile-menu-trigger span:after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #333333;
  }
  .header .mobile-menu-trigger span:before {
    top: -6px;
  }
  .header .mobile-menu-trigger span:after {
    top: 6px;
  }
  .header .item-right {
    align-items: center;
  }
  .header .menu {
    position: fixed;
    width: 320px;
    background-color: hsl(240, 100%, 100%);
    right: 0;
    top: 0;
    height: 100%;
    overflow: hidden;
    transform: translate(100%);
    transition: all 0.5s ease;
    z-index: 1099;
  }
  .header .menu.active {
    transform: translate(0%);
  }
  .header .menu > ul > li {
    line-height: 1;
    margin: 0;
    display: block;
  }
  .header .menu > ul > li > a {
    line-height: 0px;
    height: 50px;
    padding: 0 50px 0 15px;
    display: flex;
    background: #f1f1f1;
    margin: 2px 10px;
    border-radius: 8px;
    align-items: center;
  }
  .header .menu > ul > li > a i {
    position: absolute;
    height: 25px;
    width: 25px;
    top: 12px;
    left: 12px;
    text-align: center;
    transform: rotate(90deg);
    font-size: 16px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: 7px;
  }
  .header .menu .mobile-menu-head {
    display: flex;
    height: 50px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 501;
    position: sticky;
    background-color: #ffffff;
    top: 0;
    margin-bottom: 10px;
    padding-right: 22px;
  }
  .header .menu .mobile-menu-head .go-back {
    height: 50px;
    width: 50px;
    border-right: 1px solid rgba(0, 0, 0, 0.1);
    cursor: pointer;
    line-height: 50px;
    text-align: center;
    color: #000000;
    font-size: 16px;
    display: none;
  }
  .header .menu .mobile-menu-head.active .go-back {
    display: block;
  }
  .header .menu .mobile-menu-head .current-menu-title {
    font-size: 15px;
    font-weight: 500;
    color: #000000;
    font-weight: 800;
    font-family: KalamehWeb;
    font-size: 20px;
  }
  .header .menu > ul > li > a {
    font-size: 13px;
  }
  .header .menu .mobile-menu-head .mobile-menu-close {
    height: 50px;
    width: 50px;
    border-left: 1px solid rgba(0, 0, 0, 0.1);
    cursor: pointer;
    line-height: 50px;
    text-align: center;
    color: #000000;
    font-size: 25px;
  }
  .header .menu .menu-main {
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
  }
  .header .menu > ul > li .sub-menu.mega-menu,
  .header .menu > ul > li .sub-menu {
    visibility: visible;
    opacity: 1;
    position: absolute;
    box-shadow: none;
    margin: 0;
    padding: 15px;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding-top: 65px;
    max-width: none;
    min-width: auto;
    display: none;
    transform: translateX(0%);
    overflow-y: auto;
  }
  .header .menu > ul > li .sub-menu.active {
    display: block;
  }
  .header .menu > ul > li .sub-menu.active ul {
    list-style: none;
  }
  .header .menu > ul > li .sub-menu > ul > li {
    line-height: 15px;
    height: 40px;
    padding: 0 20px 0 15px;
    display: block;
    /* border-bottom: 1px solid rgba(0, 0, 0, 0.1); */
    background: #f1f1f1;
    margin: 2px 10px;
    border-radius: 8px;
  }
  @keyframes slideLeft {
    0% {
      opacity: 0;
      transform: translateX(100%);
    }
    100% {
      opacity: 1;
      transform: translateX(0%);
    }
  }
  @keyframes slideRight {
    0% {
      opacity: 1;
      transform: translateX(0%);
    }
    100% {
      opacity: 0;
      transform: translateX(100%);
    }
  }
  .header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item img {
    margin-top: 0;
  }
  .header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item.text-center .title {
    margin-bottom: 20px;
  }
  .header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item.text-center:last-child .title {
    margin-bottom: 0px;
  }
  .header .menu > ul > li .sub-menu.mega-menu-column-4 > .list-item {
    flex: 0 0 100%;
    padding: 0px;
  }
  .header .menu > ul > li .sub-menu > ul > li > a,
  .header .menu > ul > li .sub-menu.mega-menu > .list-item > ul > li > a {
    display: block;
  }
  .header .menu > ul > li .sub-menu.mega-menu > .list-item > ul {
    margin-bottom: 15px;
  }
  .menu-overlay {
    position: fixed;
    background-color: rgba(0, 0, 0, 0.5);
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1098;
    visibility: hidden;
    opacity: 0;
    transition: all 0.5s ease;
  }
  .menu-overlay.active {
    visibility: visible;
    opacity: 1;
  }
}
.right-top-header {
  display: flex;
  direction: rtl;
  text-align: right;
  align-items: center;
}

.left-top-header {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.center-top-header {
  display: flex;
  align-items: center;
  justify-content: center;
}

.dashboard-btn-holder {
  padding: 5px 20px;
  background: #514e4e;
  border-radius: 4px;
  margin: 5px;
  color: #000;
  display: flex;
  align-items: center;
  box-shadow: rgba(0, 0, 0, 0.11) 0px 10px 18px 0px, rgba(0, 0, 0, 0) 0px 4px 6px -2px !important;
}
.dashboard-btn-holder a {
  font-weight: 600;
  color: #fff;
  font-size: 15px;
}

.menu-link {
  padding: 5px 15px;
  font-size: 14px;
  color: #000000;
  display: flex;
  justify-content: space-between;
  border-radius: 4px;
  align-items: center;
  font-weight: 600;
}

.border-link {
  border: 1px solid rgba(0, 0, 0, 0.81);
}
.border-link i {
  color: rgba(0, 0, 0, 0.81);
  font-size: 18px;
  margin-left: 12px;
}

.colored-link {
  margin-right: 12px;
  background: #ffca1e;
  color: #000000;
}
.colored-link i {
  color: #000000;
  font-size: 18px;
  margin-left: 8px;
  position: relative;
  top: 2px;
}
.colored-link:hover {
  color: #fff !important;
}

.wrapp-heaader-top {
  padding: 3px 5px;
}
.wrapp-heaader-top a {
  color: white;
  font-size: 12px;
  margin: 0px 4px;
}
.wrapp-heaader-top span {
  color: white;
  font-size: 12px;
}
.wrapp-heaader-top .slash {
  color: rgba(238, 238, 238, 0.9333333333);
}
.wrapp-heaader-top strong {
  color: white;
  font-size: 12px;
}
.wrapp-heaader-top i {
  color: #ffca1e;
  font-size: 20px;
  margin-left: 5px;
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .logo {
    height: 44px;
    width: 150px;
  }
  .header {
    box-shadow: 0px 5px 8px 3px rgba(0, 0, 0, 0.3);
    display: block;
    width: 100%;
    position: relative;
    z-index: 99;
    padding: 0px 15px;
    direction: rtl;
    background: transparent;
  }
}
.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.mini-padding {
  padding: 0 25px;
}

.rounded {
  border-radius: 8px;
}

.medium-top-space {
  margin-top: 25px;
}

.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.card-img-holder {
  width: 100%;
  height: 185px;
}
.card-img-holder img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 8px 8px 0px 0px;
  box-shadow: -1px 4px 8px 0px rgba(0, 0, 0, 0.07);
}

.blog-title {
  color: #000000;
  padding: 0px 0px;
  font-size: 13px;
  font-weight: 600;
  line-height: 21px;
  text-align: right;
  direction: rtl;
  height: 40px;
}

.description {
  padding: 3px 0;
  font-size: 12px;
  line-height: 22px;
  text-align: right;
  direction: rtl;
  font-weight: 500;
  color: #616161;
  overflow: hidden;
  font-family: IRANYekan !important;
  margin-bottom: 0px;
  display: -webkit-box;
  max-width: 400px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.blog-time {
  font-size: 0.8rem;
}

.options {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  font-size: 14px;
}
.options a {
  direction: rtl;
  text-align: right;
  background: #f0ebff;
  padding: 2px 8px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-right: 8px;
  margin-top: 10px;
}
.options a span {
  font-size: 12px;
  color: #000000;
}
.options a i {
  color: #ffca1e;
}

.options span {
  font-weight: 600;
}

.blog-card {
  margin-top: 15px;
  background: #fff;
  border-radius: 8px;
  padding: 0;
  border: none;
  position: relative;
  box-shadow: 0px 0px 6px 3px rgba(0, 0, 0, 0.06);
  height: 365px;
}
.blog-card .btn {
  font-size: 1rem;
  padding: 0.5rem 1rem;
  border-radius: 0.5rem;
  font-weight: 400;
  background: #eef7fe;
  color: #22215b;
  cursor: pointer;
}

.padding-blog-cart {
  padding: 5px;
}

.category-tag {
  margin-top: -25px;
  height: 21px;
  background: linear-gradient(44deg, #e2f3f3 0.64%, #94c4c4 98.23%);
  width: max-content;
  direction: rtl;
  text-align: right;
  color: #000;
  padding: 2px 8px;
  font-weight: 600;
  border-radius: 4px;
  font-size: 12px;
}
.category-tag strong {
  font-weight: 800 !important;
  color: #ffca1e;
  margin-left: 3px;
}

.blog-card:hover {
  cursor: pointer;
}
.blog-card:hover .card-img-holder {
  transition: all cubic-bezier(0.75, -0.02, 0.37, 0.99) 0.4s;
}
.blog-card:hover .options a {
  background: linear-gradient(271deg, #f2f6ff 0.64%, #c8d9ff 98.23%);
}

.main-blog-banner {
  height: 400px;
  background-repeat: no-repeat;
  border-radius: 8px;
  background-size: cover;
  background-position: center;
}

.side-blog-banner {
  background-size: cover !important;
  border-radius: 8px;
  height: 195px;
}
.side-blog-banner a img {
  display: block;
  height: 195px;
  margin-bottom: 0px;
  border-radius: 8px;
  background-size: cover !important;
  background-position: center;
  width: 100%;
}

.blog-headder-padding {
  padding: 0px 50px;
}

.topper-blog {
  margin-top: 150px !important;
}

.wrapp-all-content {
  width: 100%;
  height: 100%;
  border-radius: 8px;
  background: linear-gradient(180deg, hsla(0, 0%, 100%, 0) 0, #000);
  display: flex;
  align-items: flex-end;
  padding: 20px 30px;
}
.wrapp-all-content h3 {
  font-size: 16px;
  color: #fff;
  margin-bottom: 25px;
  text-align: right;
  direction: rtl;
}
.wrapp-all-content p {
  color: #fff;
  font-size: 14px;
  display: -webkit-box;
  max-width: 100%;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cart-blog-padding {
  padding: 5px;
}

.side-blog-banner img {
  border-radius: 8px;
}
.side-blog-banner .wrapp-all-content {
  direction: rtl;
  padding: 10px 15px;
}
.side-blog-banner h3 {
  font-size: 14px;
  margin-bottom: 10px;
  line-height: 28px;
}

.wroter-ic {
  height: 40px;
  width: 40px;
  object-fit: cover;
}

.wroter-ic img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.name-wr {
  font-size: 12px;
  margin-left: 12px;
  font-weight: 600;
}

.name-date {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  justify-content: space-between;
  margin-top: 10px;
  border-top: 1px solid rgba(63, 53, 255, 0.1);
  padding-top: 10px;
}

.date-pick span {
  text-transform: uppercase;
  background: linear-gradient(to right, #308dd0 0%, #070067 100%);
  -webkit-text-fill-color: transparent;
  font-weight: 600;
  font-size: 12px;
}

.category {
  font-size: 12px;
  color: #fff;
  width: max-content;
  height: 0px;
  position: relative;
  top: -46px;
  right: 10px;
  direction: ltr;
  text-align: right;
}

.cate-name {
  font-size: 11px;
  padding: 8px 10px;
  border-radius: 6px;
  background: linear-gradient(304deg, #1b92ff 0.64%, #2a41b7 98.23%);
  text-align: center;
}

.sidebar-form input {
  width: 100% !important;
  padding: 15px 10px;
  background: #ebebeb !important;
  border: none;
  color: rgb(0, 0, 0) !important;
  border-radius: 10px;
  margin-bottom: 10px;
}

.sidebar-form input::placeholder {
  color: #676767 !important;
  font-size: 12px;
  font-weight: 600;
}

.cat-header {
  margin-top: 0px;
  padding: 10px;
}

.new-catg {
  text-align: right;
  font-weight: 600;
  text-align: right;
  border-bottom: 1px solid #e7e7e7;
  padding-bottom: 14px;
}

.bb-blue {
  font-size: 16px;
  padding-bottom: 10px;
  border-bottom: 2px solid #ffca1e;
}

.name-of {
  padding: 2px 6px;
  display: flex;
  direction: ltr;
  cursor: pointer;
  align-items: center;
  flex-direction: row-reverse;
  justify-content: space-between;
}

.nm-ct {
  direction: rtl;
  text-align: right;
  color: #000;
}

.blog-discription .description {
  height: unset !important;
}

.nm-ct span {
  font-size: 12px;
}

.nm-ct strong {
  font-size: 14px;
  font-weight: 900;
  margin-left: 5px;
  font-weight: 800 !important;
}

.cat-ico {
  font-size: 20px;
}

.all-blog {
  text-align: right;
  border-bottom: 1px solid #eee;
  padding-bottom: 15px;
  margin: 10px 0px;
  margin-bottom: 40px;
  display: flex;
  align-items: flex-start;
}
.all-blog h4 {
  text-align: right;
}

.plan-img {
  height: 170px;
  width: 100%;
  border-radius: 8px 8px 0px 0px;
  object-fit: cover;
}

.poin-navigation {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.subscribe-form button.blog-search-btn {
  position: absolute;
  left: 10px;
  background: -webkit-linear-gradient(303deg, #cecece 0%, #050505 100%);
  padding: 8px 8px;
  bottom: none;
  top: 7px;
  height: 38px;
  border-radius: 5px;
  border: none;
  width: max-content;
}
.subscribe-form button.blog-search-btn i {
  position: relative;
  top: -4px;
  left: -2px;
  font-size: 22px;
}

.lastest-product {
  margin-bottom: 10px;
}

.wrapp-sidebar-section {
  background: #fff;
  border-radius: 10px;
  padding: 15px 10px;
  border: 1px solid #eee;
  padding-top: 5px;
  margin-bottom: 10px;
}

.widget-suggestion {
  margin-bottom: 10px;
}

.blog-page-right {
  padding-right: 30px;
}

.nm-ct span {
  font-size: 12px;
}

.nm-ct strong {
  font-size: 12px;
  font-weight: 900;
  margin-right: 5px;
}

.cat-ico {
  font-size: 18px;
}

.name-of {
  margin-top: 8px;
}

.wrapp-new {
  display: flex;
  padding: 10px;
  direction: rtl;
  text-align: right;
  align-items: flex-start;
  transition: all cubic-bezier(0.75, -0.02, 0.37, 0.99) 0.4s;
  justify-content: flex-start;
}

.img-new-blog {
  height: 50px;
  width: 52px !important;
  border-radius: 8px;
  object-fit: cover;
  margin-left: 15px;
  -webkit-box-shadow: 0px 10px 10px rgba(151, 151, 151, 0.15);
  box-shadow: 0px 0px 6px 1px rgba(1, 1, 1, 0.11);
  overflow: hidden;
  transition: all cubic-bezier(0.75, -0.02, 0.37, 0.99) 0.4s;
}
.img-new-blog img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 8px;
  transition: all cubic-bezier(0.75, -0.02, 0.37, 0.99) 0.4s;
}

.new-head {
  font-size: 14px;
  font-weight: 600;
  color: #000;
}

.caption-wrote {
  font-size: 12px;
  color: rgb(152, 152, 152);
}

.arch-date {
  font-size: 13px;
  padding: 4px 6px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(241, 241, 241, 0.35);
  direction: rtl;
  text-align: right;
  color: rgb(21, 0, 54);
  font-weight: 600;
}

.arch-date:hover {
  border-bottom: 1px solid rgb(200, 224, 255);
}

.wrapp-new-title {
  width: 63%;
}

.wrapp-all-tags .tag {
  height: 22px;
  background: linear-gradient(44deg, #f2f6ff 0.64%, #c8d9ff 98.23%);
  width: max-content;
  direction: rtl;
  text-align: right;
  color: #000;
  padding: 2px 12px;
  font-weight: 600;
  border-radius: 4px;
  font-size: 12px;
  margin: 5px 2px;
  display: inline-block;
}

.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
  color: #eee !important;
  background: #dddddd !important;
}

.product-carousel.carousel-md .item {
  margin-bottom: 20px;
}

.widget-suggestion .widget-suggestion-title {
  margin-bottom: 10px;
}

.widget-suggestion .widget-suggestion-title img {
  max-width: 100%;
}

.widget-suggestion #progressBar {
  height: 1px;
  background: #e0e1e2;
  position: relative;
  margin-bottom: 25px;
}

.widget-suggestion .slide-progress {
  box-shadow: 0 0 8px 0 rgba(255, 138, 138, 0.5);
  border-top-style: solid;
  border-width: 0;
  border-top-width: 3px;
  border-radius: 4px;
  border-color: #ffca1e;
  position: absolute;
  width: 0;
  right: 0;
  top: 0;
  max-width: 100%;
  display: inline-block;
  animation: progressbar 10s ease-in-out;
  animation-iteration-count: infinite;
}

.widget-suggestion .owl-dots {
  margin-top: 0 !important;
  text-align: center;
  display: flex;
}

.owl-theme .owl-dots .owl-dot span {
  width: 6px;
  height: 6px;
  margin: 5px 2px;
  background: #f5821f;
  display: block;
  transition: opacity 0.2s ease;
}

.widget-suggestion .owl-dot {
  outline: none;
}

.widget-suggestion .owl-dot span {
  width: 8px;
  height: 8px;
  margin: 5px 1px;
  background: #ddd;
  display: block;
  transition: opacity 200ms ease;
  border-radius: 30px;
  -webkit-transition: all 0.2s ease-in-out !important;
  transition: all 0.2s ease-in-out !important;
}

.widget-suggestion .owl-dot.active span,
.widget-suggestion .owl-dot:hover span {
  background: #f7858d;
}

.widget-suggestion .owl-dot.active span {
  width: 30px;
}

.wrapp-last-products {
  display: flex;
  align-items: center;
}

.product-thub-img {
  height: 70px;
  width: 90px;
  object-fit: contain;
}
.product-thub-img img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.product-details-caption {
  display: flex;
  flex-direction: column;
  align-content: flex-end;
  width: 100%;
  align-items: flex-end;
}
.product-details-caption a.buy-product {
  padding: 0px 12px;
  border-radius: 4px;
  color: #fff;
  background: #054545;
  height: 20px;
  display: block;
  width: max-content;
  font-size: 12px;
  margin-left: 5px;
  margin-top: 5px;
}
.product-details-caption p {
  font-size: 12px;
  display: -webkit-box;
  max-width: 400px;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 24px;
}

.wrapp-last-products-first {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.wrapp-all-last-product-card {
  padding: 10px 5px;
  border: 1px solid #eee;
  border-radius: 8px;
  margin: 10px 0px;
}

.new-catg i {
  color: #054545;
  position: relative;
  top: 5px;
}

.blog-body {
  padding: 40px 35px;
  background: rgb(255, 255, 255);
  border-radius: 8px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.blog-main-img {
  height: 450px;
  border-radius: 8px;
  width: 100%;
  object-fit: cover;
}
.blog-main-img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.blog-name {
  font-size: 30px !important;
  margin: 12px 0px;
  margin-top: -8px;
  border-bottom: 1px solid #eee;
  padding-bottom: 30px;
  margin-bottom: 30px;
  font-family: KalamehWeb;
  font-weight: 800;
  position: relative;
  color: #000;
}
.blog-name::after {
  content: "";
  position: absolute;
  right: -4px;
  bottom: -2px;
  height: 75px;
  width: 15%;
  z-index: 10000;
  border-bottom: 6px solid #1a1a1a;
}

.blog-details {
  border-top: 1px solid #eee;
  margin-top: 30px;
  padding-top: 20px;
  border-bottom: 1px solid #eee;
}

.wrapp-details-blog {
  padding: 6px 12px;
  border-radius: 4px;
  color: #282828 !important;
  margin-bottom: 20px;
  font-weight: 600;
  background: linear-gradient(44deg, #f2f6ff 0.64%, #f1f1f1 98.23%);
}
.wrapp-details-blog a {
  color: #282828 !important;
  font-weight: 600;
}

.wrapp-product-present {
  border: 1px solid #eee;
  padding: 10px 20px;
  border-radius: 8px;
  display: flex;
  justify-content: space-between;
  direction: rtl;
  align-items: center;
}
.wrapp-product-present:hover {
  border: 1px solid rgba(151, 168, 255, 0.4117647059);
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.product-blog-image {
  height: 120px;
  width: 120px;
  object-fit: contain;
  margin-left: 20px;
}
.product-blog-image img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.product-blog-caption {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: flex-end;
}
.product-blog-caption p.product-name {
  margin-bottom: 20px;
  font-weight: 600;
}

.first-colum {
  display: flex;
  align-items: center;
}

.buy-from-blog {
  padding: 5px 25px;
  color: #fff;
  background: #ffca1e;
  border-radius: 4px;
  text-align: center;
}
.buy-from-blog:hover {
  color: #000;
  background-color: #f5821f;
}

.mn-social-bottom {
  background: linear-gradient(44deg, #f2f6ff 0.64%, #f1f1f1 98.23%);
  width: 46px;
  height: 46px;
  box-sizing: border-box;
  padding: 9px 0 0;
  color: #054545;
  border-radius: 4px;
  margin: 0 3.5px 0px;
  transition: all 0.1s;
  font-size: 19px;
  display: inline-block;
  text-align: center;
  position: relative;
}

.mn-social-bottom:hover {
  background: #ffca1e;
  color: #fff;
  top: -3px;
}

.all-blog-filter {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.each-category {
  direction: rtl;
}

.category-icon {
  font-size: 10px;
}

.blog-footer {
  display: flex;
  align-items: center;
  border-top: 1px solid #eee;
  border-bottom: 1px solid #eee;
  padding: 10px 0px;
  margin: 15px 0px;
  justify-content: space-between;
}

@media (max-width: 991px) {
  .blog-order-1 {
    order: 1;
  }
  .blog-order-2 {
    order: 2;
  }
  .all-blog {
    margin: 10px 0px;
    margin-bottom: 10px;
  }
  .blog-title {
    font-size: 12px;
    line-height: 20px;
    margin-bottom: 0px;
    display: -webkit-box;
    max-width: 400px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .cart-blog-padding {
    padding: 0px 15px;
  }
  .all-blog .col-xl-3 {
    padding: 0;
  }
  .none-mobile-cart {
    display: none;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .none-mobile-cart {
    display: none;
  }
  .main-blog-banner {
    height: 200px;
  }
  .side-blog-banner a img {
    height: 110px;
  }
  .blog-headder-padding {
    padding: 0px 0px;
  }
  .product-blog-image {
    height: 110px;
    width: 110px;
    margin-left: 10px;
  }
  .wrapp-product-present {
    padding: 10px 20px;
    flex-direction: column;
  }
  .blog-page-right {
    padding: 20px;
  }
  .side-blog-banner {
    display: none;
  }
  .card-img-holder {
    width: 100%;
    height: 118px;
  }
}
@media (max-width: 575px) {
  .card-img-holder {
    width: 100%;
    height: 118px;
  }
  .side-blog-banner {
    display: none;
  }
  .blog-page-right {
    padding: 20px;
  }
  .wrapp-product-present {
    padding: 10px 20px;
    flex-direction: column;
    justify-content: space-between;
    direction: rtl;
    align-items: flex-end;
  }
  .blog-headder-padding {
    padding: 0px 15px;
  }
  .none-mobile-cart {
    display: none;
  }
  .main-blog-banner {
    height: 200px;
  }
  .side-blog-banner a img {
    height: 110px;
  }
  .product-blog-image {
    height: 110px;
    width: 110px;
    margin-left: 10px;
  }
  .product-blog-caption p.product-name {
    font-size: 14px;
    margin-bottom: 10px;
    font-weight: 600;
  }
  .blog-name {
    font-size: 16px;
    margin-top: 20px;
  }
  .wrapp-details-blog {
    padding: 6px 12px;
    border-radius: 4px;
    margin-bottom: 5px;
  }
  .blog-main-img {
    height: 200px;
  }
  .blog-caption p {
    font-size: 13px;
    text-align: justify;
  }
  .blog-caption h3,
  .blog-caption h4,
  .blog-caption h5,
  .blog-caption h6 {
    font-size: 16px;
  }
  .blog-detail {
    width: 96%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1500px) {
  .blog-title {
    font-size: 12px;
    font-weight: 600;
    line-height: 20px;
    height: 40px;
    display: -webkit-box;
    max-width: 400px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
.product-details-caption > a {
  display: flex !important;
  justify-content: flex-start !important;
  width: 100%;
  padding-right: 8px;
  margin-top: 3.5px;
}

.show-all-blogs {
  background: #ffca1e;
  padding: 4px 12px;
  height: 40px;
  border-radius: 6px;
  color: #fff;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: max-content;
  font-weight: 600;
}
.show-all-blogs i {
  margin-right: 4px;
  margin-top: 2px;
}

.tag {
  display: flex;
  direction: rtl;
  align-items: center;
  padding: 0px 4px;
  border-radius: 7px 0;
  background: rgba(150, 165, 192, 0.4392156863);
  margin-left: 0px;
  -webkit-transform: skewX(10deg);
  transform: skewX(352deg);
  position: absolute;
  top: 15px;
  left: 20px;
  padding: 2px 20px;
  color: #fff;
}

.services-title h1 {
  font-size: 25px;
  font-weight: 600;
  margin-bottom: 0px;
  line-height: 32px;
  margin-top: 10px;
}

.date-tag {
  background: #ffca1e;
  padding: 0px 12px;
  padding-left: 48px;
  margin-top: -20px;
}
.date-tag strong {
  font-family: KalamehWeb;
  font-weight: 800;
  font-size: 20px;
  margin-left: 4px;
}

.blog-discription {
  padding: 8px 12px;
}

.options {
  justify-content: space-between;
}
.options span {
  color: #ccc;
  font-size: 13px;
}

.product-details-caption > a {
  display: flex !important;
  justify-content: flex-start !important;
  width: 100%;
  padding-right: 8px;
  margin-top: 3.5px;
}

.blog-body table {
  border-collapse: collapse;
  margin: 25px 0;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.04);
  border: 1px solid #eee;
  width: 100%;
}

.blog-body table thead tr {
  background-color: #ffca1e;
  color: #ffffff;
  text-align: left;
}

.blog-body table th,
.blog-body table td {
  padding: 12px 15px;
  border: 1px solid #eee;
}

.blog-body table tbody tr {
  border-bottom: 1px solid #dddddd;
}

.blog-body table tbody tr:nth-of-type(even) {
  background-color: #f3f3f3;
}

.blog-body table tbody tr:last-of-type {
  border-bottom: 2px solid #ffca1e;
}

.blog-body h1 {
  font-size: 2em;
  font-weight: bolder;
  font-size: 32px;
}
.blog-body h2 {
  font-size: 1.5em;
  font-weight: bolder;
}
.blog-body h3 {
  font-size: 1.17em;
  font-weight: bolder;
}
.blog-body h4 {
  font-size: 1em;
  font-weight: bolder;
}
.blog-body h5 {
  font-size: 0.83em;
  font-weight: bolder;
}
.blog-body h6 {
  font-size: 0.67em;
  font-weight: bolder;
}
.blog-body ul {
  list-style: initial !important;
  padding-right: 35px;
}
.blog-body ol {
  list-style: auto !important;
  padding-right: 35px;
}

.bb-blue {
  font-size: 16px;
  padding-bottom: 11px;
  border-bottom: 2px solid rgb(21, 0, 54);
}

.widget-suggestion-title h4 {
  font-size: 16px;
  font-weight: 600;
}

.new-catg i {
  color: #054545;
  position: relative;
  top: 5px;
  font-size: 18px;
}

.price-main {
  margin-top: 5px;
  padding: 0px 5px;
  display: flex;
  align-items: center;
  font-size: 14px;
  margin-bottom: 0px;
  font-weight: 600;
  color: #0c007b;
}

.price-main span {
  margin-right: 12px;
}

.dt-sn {
  padding: 10px 15px;
  border-radius: 8px;
  background-color: #fff;
  -webkit-transition: all 0.1s;
  transition: all 0.1s;
}

.del {
  color: #aaacb0;
  text-decoration: line-through;
  padding: 0px 5px;
  width: max-content;
}

.late-p {
  font-size: 14px;
}

.price-area {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  height: 50px;
  justify-content: flex-end;
}

#suggestion-slider .owl-dot {
  display: none !important;
  opacity: 0 !important;
}

.widget-suggestion.dt-sn .owl-nav {
  display: none !important;
}
.widget-suggestion.dt-sn .owl-dot {
  display: none !important;
  opacity: 0 !important;
}

.fl-show {
  width: 295px;
  border-radius: 8px;
  height: 50px;
  direction: rtl;
  text-align: right;
  display: flex;
  align-items: center;
  background: white;
  border: none;
  border-bottom: none;
  font-size: 13px;
}

.selectBox {
  border: 1px solid #f1f1f1;
  position: relative;
  padding: 5px 48px;
  cursor: pointer;
  background-color: rgba(245, 245, 245, 0.6431372549);
}

.sidebar-form input {
  width: 100% !important;
  padding: 15px 10px;
  background: #f1f1f1 !important;
  border: none;
  color: rgb(0, 0, 0) !important;
  border-radius: 10px;
  margin-bottom: 10px;
}

.wrapp-first-title h2 {
  font-size: 16px;
  font-weight: 600;
}

.plan-cart .btn-holder {
  background: #e1e1e1;
  border-radius: 6px;
  padding: 5px 8px;
  width: max-content;
}
.plan-cart .btn-holder a {
  color: #000 !important;
  font-size: 12px;
  font-weight: 600;
}

.layout {
  min-height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  position: relative;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}

.layout.has-sidebar {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  direction: rtl;
}

.layout .header {
  -webkit-transition: width, 0.3s;
  transition: width, 0.3s;
  height: 64px;
  min-height: 64px;
  position: relative;
}

.layout .sidebar {
  width: 280px;
  min-width: 312px;
  -webkit-transition: width, left, right, 0.3s;
  transition: width, left, right, 0.3s;
}

.layout .sidebar.collapsed {
  width: 80px;
  min-width: 80px;
}

@media (max-width: 480px) {
  .layout .sidebar.break-point-xs {
    position: fixed;
    left: -280px;
    height: 100%;
    top: 0;
    z-index: 100;
  }
  .layout .sidebar.break-point-xs.collapsed {
    left: -80px;
  }
  .layout .sidebar.break-point-xs.toggled {
    left: 0;
  }
  .layout .sidebar.break-point-xs.toggled ~ .overlay {
    display: block;
  }
  .layout .sidebar.break-point-xs ~ .layout .header {
    width: 100% !important;
    -webkit-transition: none;
    transition: none;
  }
}
@media (max-width: 576px) {
  .wrapp-student-histories .alert-icon-box {
    padding: 10px;
    background: hsl(0, 0%, 15%);
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
  }
  .wrapp-student-histories a {
    width: 72px;
    font-size: 12px;
    font-weight: 600;
    padding: 3px 5px;
    border-radius: 6px;
  }
  .wrapp-links-bg h3 {
    font-size: 20px;
    height: 8px;
    top: -20px;
  }
  .wrapp-first h4 {
    font-size: 14px;
    font-weight: 600;
    margin-right: 0px;
    margin-top: 10px;
    margin-bottom: 10px;
  }
  .wrapp-student-histories .alert-icon-box i {
    font-size: 18px;
    color: #ffca1e;
  }
  .wrapp-links-box {
    border-radius: 10px;
    height: 140px;
    background-position: center;
    background-size: cover;
    margin: 10px 0px;
  }
  .wrapp-first {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    margin-top: 0;
  }
  .wrapp-student-histories {
    padding: 10px;
    margin-top: 10px;
    align-items: flex-end;
    flex-direction: column;
  }
  .layout .sidebar {
    width: 0px;
    min-width: 0px;
    -webkit-transition: width, left, right, 0.3s;
    transition: width, left, right, 0.3s;
  }
  .layout .sidebar.break-point-sm {
    position: fixed;
    right: -320px;
    height: 100%;
    top: 0;
    z-index: 100;
  }
  .layout .sidebar.break-point-sm.collapsed {
    left: -80px;
  }
  .layout .sidebar.break-point-sm.toggled {
    right: 0;
    width: 320px;
    min-width: 320px;
  }
  .layout .sidebar.break-point-sm.toggled ~ .overlay {
    display: block;
  }
  .layout .sidebar.break-point-sm ~ .layout .header {
    width: 100% !important;
    -webkit-transition: none;
    transition: none;
  }
  .layout .sidebar.collapsed {
    width: 80px !important;
    min-width: 80px !important;
  }
  .layout .content {
    padding: 0px 0px;
    display: flex;
    flex-direction: column;
    position: relative;
    right: -15px;
  }
  .additional-info .mt-3 {
    margin-bottom: 0 !important;
  }
  .profile-img-wrapp {
    height: 100px;
    width: 100px;
    padding: 5px;
    margin-bottom: 30px;
  }
  .btn-primary-cm {
    margin-bottom: 10px;
    margin-left: 0;
  }
}
@media (max-width: 768px) {
  .layout .sidebar.break-point-md {
    position: fixed;
    left: -280px;
    height: 100%;
    top: 0;
    z-index: 100;
  }
  .layout .sidebar.break-point-md.collapsed {
    left: -80px;
  }
  .layout .sidebar.break-point-md.toggled {
    left: 0;
  }
  .layout .sidebar.break-point-md.toggled ~ .overlay {
    display: block;
  }
  .layout .sidebar.break-point-md ~ .layout .header {
    width: 100% !important;
    -webkit-transition: none;
    transition: none;
  }
}
@media (max-width: 992px) {
  .layout .sidebar.break-point-lg {
    position: fixed;
    left: -280px;
    height: 100%;
    top: 0;
    z-index: 100;
  }
  .layout .sidebar.break-point-lg.collapsed {
    left: -80px;
  }
  .layout .sidebar.break-point-lg.toggled {
    left: 0;
  }
  .layout .sidebar.break-point-lg.toggled ~ .overlay {
    display: block;
  }
  .layout .sidebar.break-point-lg ~ .layout .header {
    width: 100% !important;
    -webkit-transition: none;
    transition: none;
  }
}
@media (max-width: 1200px) {
  .layout .sidebar.break-point-xl {
    position: fixed;
    left: -280px;
    height: 100%;
    top: 0;
    z-index: 100;
  }
  .layout .sidebar.break-point-xl.collapsed {
    left: -80px;
  }
  .layout .sidebar.break-point-xl.toggled {
    left: 0;
  }
  .layout .sidebar.break-point-xl.toggled ~ .overlay {
    display: block;
  }
  .layout .sidebar.break-point-xl ~ .layout .header {
    width: 100% !important;
    -webkit-transition: none;
    transition: none;
  }
}
@media (max-width: 1600px) {
  .layout .sidebar.break-point-xxl {
    position: fixed;
    left: -280px;
    height: 100%;
    top: 0;
    z-index: 100;
  }
  .layout .sidebar.break-point-xxl.collapsed {
    left: -80px;
  }
  .layout .sidebar.break-point-xxl.toggled {
    left: 0;
  }
  .layout .sidebar.break-point-xxl.toggled ~ .overlay {
    display: block;
  }
  .layout .sidebar.break-point-xxl ~ .layout .header {
    width: 100% !important;
    -webkit-transition: none;
    transition: none;
  }
}
.layout .footer {
  height: 64px;
  min-height: 64px;
}

.layout .content {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}

.layout .overlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.3);
  z-index: 99;
  display: none;
}

.layout .sidebar-toggler {
  display: none;
}

@media (max-width: 480px) {
  .layout .sidebar-toggler.break-point-xs {
    display: initial;
  }
}
@media (max-width: 576px) {
  .layout .sidebar-toggler.break-point-sm {
    display: initial;
  }
}
@media (max-width: 768px) {
  .layout .sidebar-toggler.break-point-md {
    display: initial;
  }
}
@media (max-width: 992px) {
  .layout .sidebar-toggler.break-point-lg {
    display: initial;
  }
}
@media (max-width: 1200px) {
  .layout .sidebar-toggler.break-point-xl {
    display: initial;
  }
}
@media (max-width: 1600px) {
  .layout .sidebar-toggler.break-point-xxl {
    display: initial;
  }
}
.layout.fixed-sidebar {
  height: 100%;
}

.layout.fixed-sidebar .sidebar {
  overflow: auto;
}

.layout.fixed-header .header {
  position: fixed;
  width: 100%;
  z-index: 2;
}

.layout.fixed-header .header ~ .layout,
.layout.fixed-header .header ~ .content {
  margin-top: 64px;
}

.layout.fixed-header.fixed-sidebar .header {
  width: calc(100% - 280px);
}

.layout.fixed-header.fixed-sidebar .sidebar.collapsed ~ .layout .header {
  width: calc(100% - 80px);
}

.layout.rtl {
  direction: rtl;
}

@media (max-width: 480px) {
  .layout.rtl .sidebar.break-point-xs {
    left: auto;
    right: -280px;
  }
  .layout.rtl .sidebar.break-point-xs.collapsed {
    left: auto;
    right: -80px;
  }
  .layout.rtl .sidebar.break-point-xs.toggled {
    left: auto;
    right: 0;
  }
}
@media (max-width: 576px) {
  .layout.rtl .sidebar.break-point-sm {
    left: auto;
    right: -280px;
  }
  .layout.rtl .sidebar.break-point-sm.collapsed {
    left: auto;
    right: -80px;
  }
  .layout.rtl .sidebar.break-point-sm.toggled {
    left: auto;
    right: 0;
  }
}
@media (max-width: 768px) {
  .layout.rtl .sidebar.break-point-md {
    left: auto;
    right: -280px;
  }
  .layout.rtl .sidebar.break-point-md.collapsed {
    left: auto;
    right: -80px;
  }
  .layout.rtl .sidebar.break-point-md.toggled {
    left: auto;
    right: 0;
  }
}
@media (max-width: 992px) {
  .layout.rtl .sidebar.break-point-lg {
    left: auto;
    right: -280px;
  }
  .layout.rtl .sidebar.break-point-lg.collapsed {
    left: auto;
    right: -80px;
  }
  .layout.rtl .sidebar.break-point-lg.toggled {
    left: auto;
    right: 0;
  }
}
@media (max-width: 1200px) {
  .layout.rtl .sidebar.break-point-xl {
    left: auto;
    right: -280px;
  }
  .layout.rtl .sidebar.break-point-xl.collapsed {
    left: auto;
    right: -80px;
  }
  .layout.rtl .sidebar.break-point-xl.toggled {
    left: auto;
    right: 0;
  }
}
@media (max-width: 1600px) {
  .layout.rtl .sidebar.break-point-xxl {
    left: auto;
    right: -280px;
  }
  .layout.rtl .sidebar.break-point-xxl.collapsed {
    left: auto;
    right: -80px;
  }
  .layout.rtl .sidebar.break-point-xxl.toggled {
    left: auto;
    right: 0;
  }
}
.layout {
  z-index: 1;
  overflow: auto;
}

.layout .header {
  display: flex;
  align-items: center;
  padding: 20px;
}

.layout .content {
  padding: 12px 50px;
  display: flex;
  flex-direction: column;
}

.layout .footer {
  text-align: center;
  margin-top: auto;
  margin-bottom: 20px;
  padding: 20px;
}

.sidebar {
  color: #fff;
  overflow-x: hidden !important;
  position: relative;
}

.sidebar::-webkit-scrollbar-thumb {
  border-radius: 4px;
}

.sidebar:hover::-webkit-scrollbar-thumb {
  background-color: #1a4173;
}

.sidebar::-webkit-scrollbar {
  width: 6px;
  background-color: #0c1e35;
}

.sidebar .image-wrapper {
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  display: none;
}

.sidebar .image-wrapper > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.sidebar.has-bg-image .image-wrapper {
  display: block;
}

.sidebar .sidebar-layout {
  height: auto;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
  background: -webkit-linear-gradient(301deg, #252525 38%, #000000 82%);
  z-index: 2;
}

.sidebar .sidebar-layout .sidebar-header {
  height: 100px;
  min-height: 100px;
  display: flex;
  align-items: center;
  padding: 0 20px;
  border-bottom: 1px solid hsla(238, 100%, 68.07%, 0.1);
}

.sidebar .sidebar-layout .sidebar-header > span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.sidebar .sidebar-layout .sidebar-content {
  flex-grow: 1;
  padding: 10px 0;
}

.sidebar .sidebar-layout .sidebar-footer {
  height: 230px;
  min-height: 230px;
  display: flex;
  align-items: center;
  padding: 0 20px;
}

.sidebar .sidebar-layout .sidebar-footer > span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@keyframes swing {
  0%, 30%, 50%, 70%, 100% {
    transform: rotate(0deg);
  }
  10% {
    transform: rotate(10deg);
  }
  40% {
    transform: rotate(-10deg);
  }
  60% {
    transform: rotate(5deg);
  }
  80% {
    transform: rotate(-5deg);
  }
}
.layout .sidebar .menu ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.layout .sidebar .menu .menu-header {
  font-weight: 600;
  padding: 10px 25px;
  font-size: 0.8em;
  letter-spacing: 2px;
  transition: opacity 0.3s;
  opacity: 0.5;
  border-bottom: none;
}

li.menu-header {
  border-bottom: 1px solid rgba(238, 238, 238, 0.168627451);
}

.layout .sidebar .menu .menu-item a.menu-height {
  height: 50px;
}

.layout .sidebar .menu .menu-item a {
  display: flex;
  align-items: center;
  padding: 8px 20px;
  color: #ffffff;
  font-size: 16px;
  font-weight: 600;
}

.layout .sidebar .menu .menu-item button {
  display: flex;
  align-items: center;
  height: 50px;
  padding: 0 20px;
  color: #ffffff;
  font-size: 16px;
  font-weight: 600;
  border: none;
  outline: none;
  background: none;
  width: 100%;
}

.layout .sidebar .menu .menu-item button .menu-icon {
  font-size: 1.2rem;
  width: 35px;
  min-width: 35px;
  height: 35px;
  line-height: 35px;
  text-align: center;
  display: inline-block;
  margin-left: 10px;
  border-radius: 2px;
  transition: color 0.3s;
}

.layout .sidebar.collapsed .sidebar-header {
  height: 100px;
  min-height: 100px;
  display: flex;
  align-items: center;
  padding: 0 10px;
}
.layout .sidebar.collapsed .pro-sidebar-logo > div {
  width: 60px;
  height: 60px;
  top: 70px;
  position: relative;
}

.layout .sidebar .menu .menu-item a .menu-title {
  font-size: 0.9em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex-grow: 1;
  transition: color 0.3s;
}

.layout .sidebar .menu .menu-item a .menu-prefix,
.layout .sidebar .menu .menu-item a .menu-suffix {
  display: inline-block;
  padding: 5px;
  opacity: 1;
  transition: opacity 0.3s;
}

.layout .sidebar .menu .menu-item a:hover .menu-title {
  color: #dee2ec;
}

.layout .sidebar .menu .menu-item a:hover .menu-icon {
  color: #dee2ec;
}

.layout .sidebar .menu .menu-item a:hover .menu-icon i {
  animation: swing ease-in-out 0.5s 1 alternate;
}

.layout .sidebar .menu .menu-item a:hover::after {
  border-color: #dee2ec !important;
}

.layout .sidebar .menu .menu-item.sub-menu {
  position: relative;
}

.layout .sidebar .menu .menu-item.sub-menu > a::after {
  content: "";
  transition: transform 0.3s;
  border-right: 2px solid currentcolor;
  border-bottom: 2px solid currentcolor;
  width: 8px;
  height: 8px;
  transform: rotate(138deg);
}

.layout .sidebar .menu .menu-item.sub-menu > .sub-menu-list {
  padding-left: 20px;
  display: none;
  overflow: hidden;
  z-index: 999;
}

.layout .sidebar .menu .menu-item.sub-menu.open > a {
  color: #dee2ec;
}

.layout .sidebar .menu .menu-item.sub-menu.open > a::after {
  transform: rotate(45deg);
}

.layout .sidebar .menu .menu-item.active > a .menu-title {
  color: #dee2ec;
}

.layout .sidebar .menu .menu-item.active > a::after {
  border-color: #dee2ec;
}

.layout .sidebar .menu .menu-item.active > a .menu-icon {
  color: #dee2ec;
}

.layout .sidebar .menu > ul > .sub-menu > .sub-menu-list {
  background-color: #0b1a2c;
}

.layout .sidebar .menu.icon-shape-circle .menu-item a .menu-icon,
.layout .sidebar .menu.icon-shape-rounded .menu-item a .menu-icon,
.layout .sidebar .menu.icon-shape-square .menu-item a .menu-icon {
  background-color: #0b1a2c;
}

.layout .sidebar .menu.icon-shape-circle .menu-item a .menu-icon {
  border-radius: 50%;
}

.layout .sidebar .menu.icon-shape-rounded .menu-item a .menu-icon {
  border-radius: 4px;
}

.layout .sidebar .menu.icon-shape-square .menu-item a .menu-icon {
  border-radius: 0;
}

.layout .sidebar:not(.collapsed) .menu > ul > .menu-item.sub-menu > .sub-menu-list {
  visibility: visible !important;
  position: static !important;
  transform: translate(0, 0) !important;
}

.layout .sidebar.collapsed .menu > ul > .menu-header {
  opacity: 0;
}

.layout .sidebar.collapsed .menu > ul > .menu-item > a .menu-prefix,
.layout .sidebar.collapsed .menu > ul > .menu-item > a .menu-suffix {
  opacity: 0;
}

.layout .sidebar.collapsed .menu > ul > .menu-item.sub-menu > a::after {
  content: "";
  width: 5px;
  height: 5px;
  background-color: currentcolor;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
  left: 10px;
  top: 50%;
  border: none;
  transform: translateY(-50%);
}

.layout .sidebar.collapsed .menu > ul > .menu-item.sub-menu > a:hover::after {
  background-color: #dee2ec;
}

.layout .sidebar.collapsed .menu > ul > .menu-item.sub-menu > .sub-menu-list {
  transition: none !important;
  width: 200px;
  margin-left: 3px !important;
  border-radius: 4px;
  display: block !important;
}

.layout .sidebar.collapsed .menu > ul > .menu-item.active > a::after {
  background-color: #dee2ec;
}

.layout .sidebar.has-bg-image:not(.collapsed) .menu > ul > .sub-menu > .sub-menu-list {
  background-color: rgba(0, 0, 0, 0.6);
  padding-right: 45px;
}

.layout .sidebar.has-bg-image:not(.collapsed) .menu > ul > .sub-menu > .sub-menu-list {
  background-color: rgba(0, 0, 0, 0.6);
}

.layout.rtl .sidebar .menu .menu-item a .menu-icon {
  margin-left: 10px;
  margin-right: 0;
}

.layout.rtl .sidebar .menu .menu-item.sub-menu > a::after {
  transform: rotate(135deg);
}

.layout.rtl .sidebar .menu .menu-item.sub-menu > .sub-menu-list {
  padding-left: 0;
  padding-right: 20px;
}

.layout.rtl .sidebar .menu .menu-item.sub-menu.open > a::after {
  transform: rotate(45deg);
}

.layout.rtl .sidebar.collapsed .menu > ul > .menu-item.sub-menu a::after {
  right: auto;
  left: 10px;
}

.layout.rtl .sidebar.collapsed .menu > ul > .menu-item.sub-menu > .sub-menu-list {
  margin-left: -3px !important;
}

.layout .sidebar .pro-sidebar-logo {
  display: flex;
  align-items: center;
}

.layout .sidebar .pro-sidebar-logo > div {
  width: 65px;
  height: 65px;
  display: flex;
  align-items: center;
  justify-content: center;
  object-fit: contain;
}
.layout .sidebar .pro-sidebar-logo > div img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.layout .sidebar .pro-sidebar-logo > h5 {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 20px;
  line-height: 30px;
  transition: opacity 0.3s;
  opacity: 1;
  margin-right: 15px;
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 23px;
}

.layout .sidebar .footer-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 0.8em;
  padding: 20px 0;
  border-radius: 8px;
  width: 180px;
  min-width: 190px;
  margin: 0 auto;
}

.layout .sidebar .footer-box img.react-logo {
  width: 40px;
  height: 40px;
  margin-bottom: 10px;
}

.layout .sidebar .footer-box a {
  color: #fff;
  font-weight: 600;
  margin-bottom: 10px;
}

.layout .sidebar .sidebar-collapser {
  transition: left, right, 0.3s;
  position: absolute;
  right: 275px;
  top: 32px;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background-color: hsla(255, 100%, 95%, 0.1);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  justify-content: center;
  font-size: 22px;
  transform: translateX(50%);
  z-index: 1000000000000000000000;
  cursor: pointer;
  color: #ffffff;
  align-items: center;
}

.dashboard-header {
  box-shadow: 1px 1px 4px #9aa0b9;
  display: flex;
  align-items: center;
  padding: 20px 60px;
  justify-content: space-between;
  flex-direction: row-reverse;
  z-index: 10000000;
  position: relative;
}

.layout .sidebar.collapsed .pro-sidebar-logo > h5 {
  opacity: 0;
}

.layout .sidebar.collapsed .footer-box {
  display: none;
}

.layout .sidebar.collapsed .sidebar-collapser {
  right: 40px;
}

.layout .sidebar.collapsed .sidebar-collapser i {
  transform: rotate(180deg);
}

.badge {
  display: inline-block;
  padding: 0.25em 0.4em;
  font-size: 75%;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: 0.25rem;
  color: #fff;
  background-color: #6c757d;
}

.badge.primary {
  background-color: #ab2dff;
}

.badge.secondary {
  background-color: #079b0b;
}

.sidebar-toggler {
  position: fixed;
  right: 20px;
  top: 20px;
}

.social-links a {
  margin: 0 10px;
  color: #3f4750;
}

.dashboard-content {
  padding: 15px 25px;
  background: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.13);
  margin-top: 20px;
}

.layout {
  z-index: 1;
}

.layout .header {
  display: flex;
  align-items: center;
  padding: 20px;
}

.layout .content {
  padding: 12px 50px;
  display: flex;
  flex-direction: column;
}

.layout .footer {
  text-align: center;
  margin-top: auto;
  margin-bottom: 20px;
  padding: 20px;
}

.sidebar {
  color: #fff;
  overflow-x: hidden !important;
  position: relative;
}

.sidebar::-webkit-scrollbar-thumb {
  border-radius: 4px;
}

.sidebar:hover::-webkit-scrollbar-thumb {
  background-color: #1a4173;
}

.sidebar::-webkit-scrollbar {
  width: 6px;
  background-color: #0c1e35;
}

.sidebar .image-wrapper {
  overflow: hidden;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  display: none;
}

.sidebar .image-wrapper > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.sidebar.has-bg-image .image-wrapper {
  display: block;
}

.sidebar .sidebar-layout .sidebar-header {
  height: 100px;
  min-height: 100px;
  display: flex;
  align-items: center;
  padding: 0 20px;
}

.sidebar .sidebar-layout .sidebar-header > span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.sidebar .sidebar-layout .sidebar-content {
  flex-grow: 1;
  padding: 10px 0;
}

.sidebar .sidebar-layout .sidebar-footer {
  height: 230px;
  min-height: 230px;
  display: flex;
  align-items: center;
  padding: 0 20px;
}

.sidebar .sidebar-layout .sidebar-footer > span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@keyframes swing {
  0%, 30%, 50%, 70%, 100% {
    transform: rotate(0deg);
  }
  10% {
    transform: rotate(10deg);
  }
  40% {
    transform: rotate(-10deg);
  }
  60% {
    transform: rotate(5deg);
  }
  80% {
    transform: rotate(-5deg);
  }
}
.layout .sidebar .menu ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.layout .sidebar .menu .menu-header {
  font-weight: 600;
  padding: 10px 25px;
  font-size: 0.8em;
  letter-spacing: 2px;
  transition: opacity 0.3s;
  opacity: 0.5;
}

.layout .sidebar .menu .menu-item a .menu-icon {
  font-size: 1.2rem;
  width: 35px;
  min-width: 35px;
  height: 35px;
  line-height: 35px;
  text-align: center;
  display: inline-block;
  margin-left: 10px;
  border-radius: 2px;
  transition: color 0.3s;
}

.layout .sidebar .menu .menu-item a .menu-icon i {
  display: inline-block;
}

.layout .sidebar .menu .menu-item a .menu-title {
  font-size: 0.9em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex-grow: 1;
  transition: color 0.3s;
}

.layout .sidebar .menu .menu-item a .menu-prefix,
.layout .sidebar .menu .menu-item a .menu-suffix {
  display: inline-block;
  padding: 5px;
  opacity: 1;
  transition: opacity 0.3s;
}

.layout .sidebar .menu .menu-item a:hover .menu-title {
  color: #dee2ec;
}

.layout .sidebar .menu .menu-item a:hover .menu-icon {
  color: #dee2ec;
}

.layout .sidebar .menu .menu-item a:hover .menu-icon i {
  animation: swing ease-in-out 0.5s 1 alternate;
}

.layout .sidebar .menu .menu-item a:hover::after {
  border-color: #dee2ec !important;
}

.layout .sidebar .menu .menu-item.sub-menu {
  position: relative;
}

.layout .sidebar .menu .menu-item.sub-menu > .sub-menu-list {
  padding-left: 20px;
  display: none;
  overflow: hidden;
  z-index: 999;
}

.layout .sidebar .menu .menu-item.sub-menu.open > a {
  color: #dee2ec;
}

.layout .sidebar .menu .menu-item.sub-menu.open > a::after {
  transform: rotate(45deg);
}

.layout .sidebar .menu .menu-item.active > a .menu-title {
  color: #dee2ec;
}

.layout .sidebar .menu .menu-item.active > a::after {
  border-color: #dee2ec;
}

.layout .sidebar .menu .menu-item.active > a .menu-icon {
  color: #dee2ec;
}

.layout .sidebar .menu > ul > .sub-menu > .sub-menu-list {
  background-color: #0b1a2c;
}

.layout .sidebar .menu.icon-shape-circle .menu-item a .menu-icon,
.layout .sidebar .menu.icon-shape-rounded .menu-item a .menu-icon,
.layout .sidebar .menu.icon-shape-square .menu-item a .menu-icon {
  background-color: #0b1a2c;
}

.layout .sidebar .menu.icon-shape-circle .menu-item a .menu-icon {
  border-radius: 50%;
}

.layout .sidebar .menu.icon-shape-rounded .menu-item a .menu-icon {
  border-radius: 4px;
}

.layout .sidebar .menu.icon-shape-square .menu-item a .menu-icon {
  border-radius: 0;
}

.layout .sidebar:not(.collapsed) .menu > ul > .menu-item.sub-menu > .sub-menu-list {
  visibility: visible !important;
  position: static !important;
  transform: translate(0, 0) !important;
}

.layout .sidebar.collapsed .menu > ul > .menu-header {
  opacity: 0;
}

.layout .sidebar.collapsed .menu > ul > .menu-item > a .menu-prefix,
.layout .sidebar.collapsed .menu > ul > .menu-item > a .menu-suffix {
  opacity: 0;
}

.layout .sidebar.collapsed .menu > ul > .menu-item.sub-menu > a:hover::after {
  background-color: #dee2ec;
}

.layout .sidebar.collapsed .menu > ul > .menu-item.sub-menu > .sub-menu-list {
  transition: none !important;
  width: 200px;
  margin-left: 3px !important;
  border-radius: 4px;
  display: block !important;
}

.layout .sidebar.collapsed .menu > ul > .menu-item.active > a::after {
  background-color: #dee2ec;
}

.layout .sidebar.has-bg-image .menu.icon-shape-circle .menu-item a .menu-icon,
.layout .sidebar.has-bg-image .menu.icon-shape-rounded .menu-item a .menu-icon,
.layout .sidebar.has-bg-image .menu.icon-shape-square .menu-item a .menu-icon {
  background-color: rgba(0, 0, 0, 0.6);
}

.layout .sidebar.has-bg-image:not(.collapsed) .menu > ul > .sub-menu > .sub-menu-list {
  background-color: rgba(0, 0, 0, 0.6);
}

.layout.rtl .sidebar .menu .menu-item a .menu-icon {
  margin-left: 10px;
  margin-right: 0;
}

.layout.rtl .sidebar .menu .menu-item.sub-menu > a::after {
  transform: rotate(135deg);
}

.layout.rtl .sidebar .menu .menu-item.sub-menu > .sub-menu-list {
  padding-left: 0;
  padding-right: 20px;
}

.layout.rtl .sidebar .menu .menu-item.sub-menu.open > a::after {
  transform: rotate(45deg);
}

.layout.rtl .sidebar.collapsed .menu > ul > .menu-item.sub-menu a::after {
  right: auto;
  left: 10px;
}

.layout.rtl .sidebar.collapsed .menu > ul > .menu-item.sub-menu > .sub-menu-list {
  margin-left: -3px !important;
}

.layout .sidebar .pro-sidebar-logo {
  display: flex;
  align-items: center;
}

.layout .sidebar .pro-sidebar-logo > h5 {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 20px;
  line-height: 30px;
  transition: opacity 0.3s;
  opacity: 1;
  margin-right: 15px;
}

.layout .sidebar .footer-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 0.8em;
  padding: 20px 0;
  border-radius: 8px;
  width: 180px;
  min-width: 190px;
  margin: 0 auto;
}

.layout .sidebar .footer-box img.react-logo {
  width: 40px;
  height: 40px;
  margin-bottom: 10px;
}

.layout .sidebar .footer-box a {
  color: #fff;
  font-weight: 600;
  margin-bottom: 10px;
}

.layout .sidebar.collapsed .pro-sidebar-logo > h5 {
  opacity: 0;
}

.layout .sidebar.collapsed .menu-item button span {
  display: none;
}

.layout .sidebar.collapsed .footer-box {
  display: none;
}

.layout .sidebar.collapsed .sidebar-collapser i {
  transform: rotate(180deg);
}

.badge {
  display: inline-block;
  padding: 0.25em 0.4em;
  font-size: 75%;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: 0.25rem;
  color: #fff;
  background-color: #6c757d;
}

.badge.primary {
  background-color: #ab2dff;
}

.badge.secondary {
  background-color: #079b0b;
}

.sidebar-toggler {
  position: fixed;
  right: 20px;
  top: 20px;
}

.social-links a {
  margin: 0 10px;
  color: #3f4750;
}

.dashboard-alert-box .alert-icon-box {
  padding: 10px;
  background: hsl(0, 0%, 15%);
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  animation: mover-icon 2s infinite alternate;
}
.dashboard-alert-box .alert-icon-box i {
  font-size: 25px;
  color: #ffca1e;
}
.dashboard-alert-box .alert-title {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 25px;
}
.dashboard-alert-box p {
  font-size: 13px;
}

@-webkit-keyframes mover-icon {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-10px);
  }
}
.dashboard-content .plan-cart {
  overflow: hidden;
  background: #faf8ff;
  box-shadow: 0px 0px 6px 3px rgba(0, 0, 0, 0.06);
}

.plan-cart .btn-holder {
  margin-top: 10px;
  display: block;
}

.dashboard-icon {
  padding: 10px;
  background: hsl(0, 0%, 31.61%);
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  margin-left: 15px;
}
.dashboard-icon i {
  font-size: 25px;
  color: #ffca1e;
}

.wrapp-details-dashboard {
  display: flex;
  align-items: center;
}
.wrapp-details-dashboard .content-box {
  display: flex;
  flex-direction: column;
}
.wrapp-details-dashboard strong {
  margin-top: 5px;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #3a3e42;
}
.wrapp-details-dashboard span {
  margin-top: 5px;
  font-size: 16px !important;
  font-weight: 600 !important;
  margin-left: 8px;
  color: #3a3e42;
  margin-right: 10px;
}

.time-title {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 25px;
}

#calender {
  margin-top: 5px;
  font-size: 18px;
}

#clock {
  margin-top: 5px;
  font-size: 18px;
  font-weight: 600;
}

.col-banner-dashboard {
  height: 140px;
  width: 100%;
  border-radius: 4px;
  object-fit: cover;
  margin-top: 20px;
}
.col-banner-dashboard img {
  border-radius: 4px;
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.wrapp-home-btn a {
  display: flex;
  align-items: center;
  direction: rtl;
  text-align: right;
}
.wrapp-home-btn a i {
  font-size: 25px;
  color: #ffca1e;
  margin-left: 8px;
}
.wrapp-home-btn a strong {
  font-size: 14px;
  color: #000c1c;
}

.logo-area {
  margin-right: 0px;
}
.logo-area strong {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 20px;
  color: #000;
}

.clock-bg {
  height: 140px;
  background-size: 50px;
  background-image: url(../../assets/images/vectors/icons8-clock-100.png);
  background-position: 25px 20px;
  background-repeat: no-repeat;
}

.calender-bg {
  height: 140px;
  background-size: 45px;
  background-image: url(../../assets/images/vectors/icons8-schedule-100.png);
  background-position: 25px 20px;
  background-repeat: no-repeat;
}

.package-bg {
  height: 140px;
  background-size: 50px;
  background-image: url(../../assets/images/vectors/icons8-trophy-100.png);
  background-position: 25px 20px;
  background-repeat: no-repeat;
}

.item-link-nav {
  height: 45px !important;
  font-size: 13px !important;
}

.form-ui .form-row .input-ui {
  width: 100% !important;
  height: 48px;
  margin: auto;
  background-color: #fff;
  border: 1px solid #dfdfdf;
  border-radius: 6px;
  outline: none;
  padding: 2px 15px;
}

.form-ui .form-row-title h3 {
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: 600;
  color: #000;
}

.custom-control-label {
  padding-right: 10px;
  padding-top: 2px;
  cursor: pointer;
}

.title-wide a {
  color: #ffca1e;
}

.product-carousel .owl-dot.active span,
.product-carousel .owl-dot:hover span {
  background: #ffca1e;
}

.custom-control-input:checked ~ .custom-control-label::before {
  border-color: #ffca1e;
  background-color: #ffca1e;
}

.discount span {
  background: #ffca1e;
}

.btn-primary-cm {
  background-color: #ffca1e;
}

.btn-primary-cm {
  padding: 10px;
  font-size: 16px;
  font-weight: normal;
  position: relative;
  border-radius: 10px;
  color: #000000;
  border: 0;
  outline: 0;
  background-color: #ffca1e;
  overflow: hidden;
  margin-left: 15px;
}

a.bg-secondary:focus,
a.bg-secondary:hover,
button.bg-secondary:focus,
button.bg-secondary:hover {
  background-color: #545b62 !important;
}

.btn-primary-cm:hover {
  color: #000000;
}

[type=button]:not(:disabled),
[type=reset]:not(:disabled),
[type=submit]:not(:disabled),
button:not(:disabled) {
  cursor: pointer;
}

.btn-primary-cm {
  background-color: #ffca1e;
}

.mini-padding {
  padding: 5px 10px !important;
}

.btn-primary-cm {
  padding: 10px 20px;
  font-size: 16px;
  font-weight: 600;
  position: relative;
  border-radius: 6px;
  color: #000000;
  border: 0;
  outline: 0;
  background-color: #ffca1e;
  overflow: hidden;
}

.text-justify {
  text-align: justify !important;
}

.custom-control {
  position: relative;
  display: flex;
  min-height: 1.5rem;
  padding-left: 0.5rem;
}

.form-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -5px;
  margin-left: -5px;
}

.dashboard-content input[type=checkbox]:not(old) + label {
  display: flex;
  align-items: center;
  line-height: 1.5em;
  font-size: 14px;
  margin-right: 8px;
  font-weight: 600;
  color: #3a3e42;
  direction: rtl;
  text-align: right;
}

.form-ui .form-row .input-ui::placeholder {
  font-size: 13px;
  color: #000c1c;
}

.txt-height {
  min-height: 110px !important;
  width: 100%;
  margin: auto;
  background-color: #fff !important;
  border: 1px solid #eee !important;
  border-radius: 10px !important;
  outline: none;
  padding: 10px 15px;
}

.txt-height::placeholder {
  font-size: 13px;
  color: #000c1c;
}

.table-responsive {
  background-color: #fff;
}

.table-order {
  margin-bottom: 0;
}

.table-order td,
.table-order th {
  text-align: center;
  vertical-align: middle;
}

.table-order thead th {
  border: 0;
}

.table-order td.details-link,
.table-order td.link-to-orders {
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.table-order td.details-link a {
  display: block;
  font-size: 30px;
  border-radius: 50%;
  color: #a9a9a9;
}

.table-order td.details-link:hover {
  background-color: #e5e5e5;
}

.table-order td.link-to-orders a {
  display: block;
  color: #535353;
}

.table-order td.link-to-orders:hover {
  background-color: #e5e5e5;
}

.table-order-details td {
  border-left: 1px solid #ededed;
}

.table-order-details .details-product-area {
  display: flex;
  align-items: center;
}

.table-order-details img.thumbnail-product {
  width: 60px;
  margin-left: 7px;
}

.table-order-details .details-product {
  font-size: 13px;
  line-height: 2;
  letter-spacing: -0.7px;
  text-align: right;
  text-overflow: ellipsis;
  width: 160px;
  overflow: hidden;
  position: relative;
}

.table-order-details .details-product span {
  display: block;
  font-size: 12px;
  line-height: 1.833;
  color: #4d4b4b;
  letter-spacing: 0;
}

.table-draught div {
  padding-top: 1rem;
  padding-bottom: 1rem;
  line-height: 36px;
  border-bottom: 1px solid #ededed;
}

.table-draught div:last-child {
  border-bottom: 0;
}

.table-draught div span.title {
  display: block;
  color: #00bfd6;
  font-size: 17px;
  font-weight: 600;
}

.table-draught div span.value {
  color: #666;
  font-size: 15px;
  font-weight: 600;
}

.profile-order-steps-item {
  height: 160px;
  position: relative;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.4;
  text-align: center;
}

.table-order-details td {
  border: 1px solid #ededed;
}

.table-order thead {
  background-color: #000;
  color: #ffca1e;
  border-radius: 10px;
}

thead tr {
  font-weight: 600;
}

.table-order thead th {
  font-weight: 600 !important;
}

.btn-info {
  color: #000;
  background-color: #ffca1e;
  border-color: hsl(46.67, 63.38%, 86.08%);
  border: none;
  border-radius: 4px;
  padding: 5px;
  font-size: 13px;
  font-weight: 600;
}

.bg-secondary {
  border: none;
  border-radius: 4px;
  padding: 5px;
  font-size: 13px;
  font-weight: 600;
  background-color: #dddddd !important;
}

a.bg-secondary:focus, a.bg-secondary:hover, button.bg-secondary:focus, button.bg-secondary:hover {
  background-color: #c7deff !important;
  border: none;
}

.details-box-header {
  font-size: 20px;
  font-weight: 800;
  font-family: KalamehWeb;
  color: #ffca1e;
  margin-bottom: 10px;
}

.wrapp-details-box {
  background: #fff;
  box-shadow: 0px 1.60568px 5px rgba(0, 0, 0, 0.13);
}
.wrapp-details-box strong {
  font-size: 17px;
  font-family: KalamehWeb;
}

.plan-details-btn {
  padding: 5px 20px;
  height: 40px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  background: #f2edff;
  font-size: 20px;
  font-weight: 800;
  font-family: KalamehWeb;
  color: rgb(21, 0, 54);
  font-weight: 600;
}
.plan-details-btn i {
  position: relative;
  top: 0px;
  font-size: 18px;
  font-weight: 800;
  margin-right: 3px;
}
.plan-details-btn:hover {
  background: #ffca1e;
  color: #fff;
  transition: all linear 0.3s;
}

.wrapp-details-box {
  padding: 8px 15px;
  border-radius: 8px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.plan-box-btn {
  background: #f7f4ff;
  border: 1px solid #ebe4ff;
  border-radius: 10px;
  height: 130px;
  padding: 30px !important;
}

.plans-header-section {
  margin: 30px 0px;
  padding-bottom: 10px;
}

.plan-box-btn {
  background-image: url(../../assets/images/vectors/exer.png);
  background-size: 70px;
  background-position: 40px 20px;
  background-repeat: no-repeat;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  border: none;
}
.plan-box-btn h3 {
  letter-spacing: 1px;
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 44px;
  text-transform: uppercase;
  background: linear-gradient(to left, #000000 20%, #6022ff 80%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.plan-according {
  background: #a686e0;
  padding: 8px 15px;
  border-radius: 50%;
}

.plan-collapses {
  border-radius: 6px;
  margin-top: 12px;
  padding: 10px 20px;
}

.wrapp-plan-details {
  padding: 40px 30px;
  position: relative;
  background-image: url(../../assets/images/Services/shape-17.png);
  box-shadow: 0px 1.60568px 5px rgba(0, 0, 0, 0.13);
}
.wrapp-plan-details::before {
  content: "";
  position: absolute;
  left: -4px;
  top: -2px;
  height: 65px;
  width: 10%;
  z-index: 10000;
  border-left: 6px solid rgba(0, 0, 0, 0.81);
  border-top: 6px solid rgba(0, 0, 0, 0.81);
}

.exercise-number {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #fff;
  margin-left: 10px;
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.exercises-box-exp {
  display: flex;
  align-items: center;
  padding: 15px;
  height: 50px;
  border-radius: 6px;
  background-color: #f7f4ff;
  margin-bottom: 10px;
}

.property {
  font-weight: 600;
  font-size: 16px;
  margin-left: 10px;
}

.property-name {
  font-size: 14px;
}

.video-body-wrapper {
  padding: 10px 15px;
}
.video-body-wrapper iframe {
  border-radius: 6px;
}

.exer-caption {
  padding: 10px 15px;
}
.exer-caption h5 {
  font-weight: 800;
  font-family: KalamehWeb;
  font-size: 25px;
}
.exer-caption p {
  text-align: justify;
  font-size: 13px;
}

.title-according {
  padding: 15px;
}
.title-according i {
  font-size: 16px;
  color: #ffca1e;
}
.title-according h3 {
  font-size: 16px;
}
.title-according p {
  font-size: 12px;
  text-align: justify;
}

.exer-img-wrapp {
  padding: 10px;
  border-radius: 6px;
  object-fit: cover;
  width: 100%;
  height: 450px;
}
.exer-img-wrapp img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 6px;
  box-shadow: 0px 1.60568px 5px rgba(0, 0, 0, 0.13);
}

.plans-info {
  margin-top: 10px;
  display: flex;
  align-items: center;
}
.plans-info i {
  color: #ffca1e;
  font-size: 18px;
  margin-left: 5px;
}
.plans-info span {
  font-size: 14px;
}

.table-design {
  background: #fff;
  display: flex;
  justify-content: center;
  flex-direction: column;
  padding: 30px;
  border-radius: 10px;
}

.table-design {
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.13);
}

.header-table {
  border: 1px solid #eee;
  border-radius: 10px;
  margin-bottom: 10px;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.13);
  padding: 10px;
}

.gym-logo {
  height: 70px;
  width: 200px;
  object-fit: contain;
}

.gym-logo img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.header-table {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.wrapp-table-details {
  display: flex;
  justify-content: center;
}

.table-details {
  display: flex;
  align-items: center;
  margin-top: 15px;
  background-color: #f5f5f5;
  padding: 5px 10px;
  width: 100%;
}
.table-details i {
  font-size: 20px;
  color: #ffca1e;
  margin-left: 8px;
}
.table-details strong {
  font-size: 18px;
  margin-left: 5px;
  font-size: 14px;
}

.table-header-group {
  width: max-content;
  padding: 10px 40px;
  background: #ffca1e;
  clip-path: polygon(30% 0, 100% 0, 100% 100%, 0 100%);
  height: 43px;
  position: relative;
  top: 5px;
  padding-right: 10px;
}
.table-header-group h4 {
  font-size: 22px;
  color: #fff;
  font-family: KalamehWeb;
  font-weight: 800;
  border-bottom: 1px solid rgba(238, 238, 238, 0.4);
  padding-bottom: 5px;
  padding-left: 30px;
}

.table-order tr:nth-child(odd) {
  background-color: #ffffff;
}

.table-order tr:nth-child(even) {
  background-color: #f7f7f7;
}

.table-order thead tr {
  background-color: rgba(0, 0, 0, 0) !important;
  color: #ffca1e !important;
  border-radius: 10px;
}

.table-footer {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  margin-top: 20px;
}

.plan-table {
  position: relative;
  padding-bottom: 20px !important;
}
.plan-table::after {
  content: "";
  position: absolute;
  left: -4px;
  bottom: -2px;
  height: 49px;
  width: 5%;
  z-index: 10000;
  border-left: 6px solid #ffca1e;
  border-bottom: 6px solid #5f23f2;
}

.services-title h3 {
  font-size: 28px;
  background-color: #ffca1e;
  padding: 5px;
  padding-left: 30px;
  font-family: KalamehWeb;
  font-weight: 800;
  width: max-content;
}

.button_outer {
  background: #212529;
  border-radius: 9px;
  text-align: center;
  height: 50px;
  width: 200px;
  display: inline-block;
  transition: 0.2s;
  position: relative;
  overflow: hidden;
}
.button_outer i {
  margin-left: 5px;
}

.btn_upload {
  padding: 17px 30px 12px;
  color: #fff;
  text-align: center;
  position: relative;
  display: inline-block;
  overflow: hidden;
  z-index: 3;
  white-space: nowrap;
}

.btn_upload input {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  width: 100%;
  height: 105%;
  cursor: pointer;
  opacity: 0;
}

.file_uploading {
  width: 100%;
  height: 10px;
  margin-top: 20px;
  background: #ccc;
}

.file_uploading .btn_upload {
  display: none;
}

.processing_bar {
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  height: 100%;
  border-radius: 30px;
  background: #ffca1e;
  transition: 3s;
}

.file_uploading .processing_bar {
  width: 100%;
}

.success_box {
  display: none;
  width: 50px;
  height: 50px;
  position: relative;
}

.file_uploaded .success_box {
  display: inline-block;
}

.file_uploaded {
  margin-top: 0;
  width: 50px;
  background: #ffca1e;
  height: 50px;
}

.file_remove {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: block;
  position: absolute;
  background: #000;
  line-height: 33px;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  left: 8px;
  top: -18px;
  text-align: center;
}

.uploaded_file_view {
  max-width: 300px;
  position: relative;
  transition: 0.2s;
  border: 2px solid #ddd;
  padding: 15px;
}

.file_remove:hover {
  background: #222;
  transition: 0.2s;
}

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

.uploaded_file_view.show {
  opacity: 1;
}

.error_msg {
  text-align: center;
  color: #f00;
}

.success_box:before {
  content: "";
  display: block;
  width: 12px;
  height: 28px;
  border-bottom: 4px solid #000;
  border-right: 4px solid #191919;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  left: 20px;
  top: 8px;
}

.services-title i {
  font-size: 20px;
}
.services-title p {
  border-bottom: 1px solid #eee;
  padding-bottom: 10px;
  margin-top: 15px;
  margin-bottom: -8px;
}

.about {
  position: fixed;
  z-index: 10;
  bottom: 10px;
  right: 10px;
  width: 40px;
  height: 40px;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  transition: all 0.2s ease;
}

.about .bg_links {
  width: 40px;
  height: 40px;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 100%;
  backdrop-filter: blur(5px);
  position: absolute;
}

.about .social {
  opacity: 0;
  right: 0;
  bottom: 0;
}

.about .social .icon {
  width: 100%;
  height: 100%;
  background-size: 20px;
  background-repeat: no-repeat;
  background-position: center;
  background-color: transparent;
  display: flex;
  transition: all 0.2s ease, background-color 0.4s ease;
  opacity: 0;
  border-radius: 100%;
}

.about:hover {
  width: 105px;
  height: 105px;
  transition: all 0.6s cubic-bezier(0.64, 0.01, 0.07, 1.65);
}

.about:hover .social {
  opacity: 1;
}

.about:hover .social .icon {
  opacity: 0.9;
}

.about:hover .social:hover {
  background-size: 28px;
}

.about:hover .social:hover .icon {
  background-size: 65%;
  opacity: 1;
}

.about:hover .social.portfolio {
  right: 0;
  bottom: calc(100% - 40px);
  transition: all 0.3s 0s cubic-bezier(0.64, 0.01, 0.07, 1.65);
}

.about:hover .social.portfolio .icon:hover {
  background-color: #698fb7;
}

.about:hover .social.dribbble {
  bottom: 45%;
  right: 45%;
  transition: all 0.3s 0.15s cubic-bezier(0.64, 0.01, 0.07, 1.65);
}

.about:hover .social.dribbble .icon:hover {
  background-color: #ea4c89;
}

.about:hover .social.linkedin {
  bottom: 0;
  right: calc(100% - 40px);
  transition: all 0.3s 0.25s cubic-bezier(0.64, 0.01, 0.07, 1.65);
}

.about:hover .social.linkedin .icon:hover {
  background-color: #0077b5;
}

h1:focus,
h2:focus,
h3:focus,
h4:focus,
h5:focus,
h6:focus,
p:focus,
ul:focus,
li:focus,
button:focus,
a:focus,
i:focus,
input:focus,
body:focus {
  outline: 0;
}

.wrapper {
  margin: 0;
  padding: 0;
  height: auto;
  font-family: KalamehWeb;
  font-weight: 800;
  background: #f1e6ff;
}

.wrapper {
  display: grid;
  grid-template-columns: 1fr;
  justify-content: center;
  align-items: center;
  height: 100vh;
  overflow-x: hidden;
}

.wrapper .container {
  margin: 0 auto;
  transition: all 0.4s ease;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.wrapper .container .scene {
  position: absolute;
  width: 100vw;
  height: 100vh;
  vertical-align: middle;
}

.wrapper .container .one,
.wrapper .container .two,
.wrapper .container .three,
.wrapper .container .circle,
.wrapper .container .p404 {
  width: 60%;
  height: 60%;
  top: 20% !important;
  left: 20% !important;
  min-width: 400px;
  min-height: 400px;
}

.wrapper .container .one .content,
.wrapper .container .two .content,
.wrapper .container .three .content,
.wrapper .container .circle .content,
.wrapper .container .p404 .content {
  width: 600px;
  height: 600px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  animation: content 0.8s cubic-bezier(1, 0.06, 0.25, 1) backwards;
}

@keyframes content {
  0% {
    width: 0;
  }
}
.wrapper .container .one .content .piece,
.wrapper .container .two .content .piece,
.wrapper .container .three .content .piece,
.wrapper .container .circle .content .piece,
.wrapper .container .p404 .content .piece {
  width: 200px;
  height: 80px;
  display: flex;
  position: absolute;
  border-radius: 80px;
  z-index: 1;
  animation: pieceLeft 8s cubic-bezier(1, 0.06, 0.25, 1) infinite both;
}

@keyframes pieceLeft {
  50% {
    left: 80%;
    width: 10%;
  }
}
@keyframes pieceRight {
  50% {
    right: 80%;
    width: 10%;
  }
}
@media screen and (max-width: 799px) {
  .wrapper .container .one,
  .wrapper .container .two,
  .wrapper .container .three,
  .wrapper .container .circle,
  .wrapper .container .p404 {
    width: 90%;
    height: 90%;
    top: 5% !important;
    left: 5% !important;
    min-width: 280px;
    min-height: 280px;
  }
}
@media screen and (max-height: 660px) {
  .wrapper .container .one,
  .wrapper .container .two,
  .wrapper .container .three,
  .wrapper .container .circle,
  .wrapper .container .p404 {
    min-width: 280px;
    min-height: 280px;
    width: 60%;
    height: 60%;
    top: 20% !important;
    left: 20% !important;
  }
}
.wrapper .container .text {
  width: 60%;
  height: 40%;
  min-width: 400px;
  min-height: 500px;
  position: absolute;
  margin: 40px 0;
  animation: text 0.6s 1.8s ease backwards;
}

@keyframes text {
  0% {
    opacity: 0;
    transform: translateY(40px);
  }
}
@media screen and (max-width: 799px) {
  .wrapper .container .text {
    min-height: 400px;
    height: 80%;
  }
}
.wrapper .container .text article {
  width: 400px;
  position: absolute;
  bottom: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

@media screen and (max-width: 799px) {
  .wrapper .container .text article {
    width: 100%;
  }
}
.wrapper .container .text article p {
  color: rgb(0, 0, 0);
  font-size: 18px;
  letter-spacing: 0.6px;
  margin-bottom: 40px;
  text-align: center;
  background: rgba(255, 255, 255, 0.2392156863);
  direction: rtl;
  border-radius: 8px;
  padding: 10px;
}

.wrapper .container .text article a {
  height: 40px;
  padding: 0 30px;
  border-radius: 50px;
  cursor: pointer;
  box-shadow: 0px 15px 20px rgba(54, 24, 79, 0.5);
  z-index: 3;
  color: #ffca1e;
  background-color: white;
  text-transform: uppercase;
  font-weight: 800;
  font-size: 18px;
  display: flex;
  transition: all 0.3s ease;
  align-items: center;
  font-family: KalamehWeb;
  font-weight: 800;
}

.wrapper .container .text article button:hover {
  box-shadow: 0px 10px 10px -10px rgba(54, 24, 79, 0.5);
  transform: translateY(5px);
  background: #fb8a8a;
  color: white;
}

.wrapper .container .p404 {
  font-size: 200px;
  font-weight: 700;
  letter-spacing: 4px;
  color: white;
  display: flex !important;
  justify-content: center;
  align-items: center;
  position: absolute;
  z-index: 2;
  animation: anime404 0.6s cubic-bezier(0.3, 0.8, 1, 1.05) both;
  animation-delay: 1.2s;
}

@media screen and (max-width: 799px) {
  .wrapper .container .p404 {
    font-size: 100px;
  }
}
@keyframes anime404 {
  0% {
    opacity: 0;
    transform: scale(10) skew(20deg, 20deg);
  }
}
.wrapper .container .p404:nth-of-type(2) {
  color: #36184f;
  z-index: 1;
  animation-delay: 1s;
  filter: blur(10px);
  opacity: 0.8;
}

.wrapper .container .circle {
  position: absolute;
}

.wrapper .container .circle:before {
  content: "";
  position: absolute;
  width: 800px;
  height: 800px;
  background-color: rgba(54, 24, 79, 0.2);
  border-radius: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: inset 5px 20px 40px rgba(54, 24, 79, 0.25), inset 5px 0px 5px rgba(50, 36, 62, 0.3), inset 5px 5px 20px rgba(50, 36, 62, 0.25), 2px 2px 5px rgba(255, 255, 255, 0.2);
  animation: circle 0.8s cubic-bezier(1, 0.06, 0.25, 1) backwards;
}

@keyframes circle {
  0% {
    width: 0;
    height: 0;
  }
}
@media screen and (max-width: 799px) {
  .wrapper .container .circle:before {
    width: 400px;
    height: 400px;
  }
}
.wrapper .container .one .content:before {
  content: "";
  position: absolute;
  width: 600px;
  height: 600px;
  background-color: rgba(54, 24, 79, 0.3);
  border-radius: 100%;
  box-shadow: inset 5px 20px 40px rgba(54, 24, 79, 0.25), inset 5px 0px 5px rgba(50, 36, 62, 0.3), inset 5px 5px 20px rgba(50, 36, 62, 0.25), 2px 2px 5px rgba(255, 255, 255, 0.2);
  animation: circle 0.8s 0.4s cubic-bezier(1, 0.06, 0.25, 1) backwards;
}

@media screen and (max-width: 799px) {
  .wrapper .container .one .content:before {
    width: 300px;
    height: 300px;
  }
}
.wrapper .container .one .content .piece {
  background: linear-gradient(282deg, #6d61ff 13.7%, hsl(238, 81.08%, 82.8%) 94.65%);
}

.wrapper .container .one .content .piece:nth-child(1) {
  right: 15%;
  top: 18%;
  height: 30px;
  width: 120px;
  animation-delay: 0.5s;
  animation-name: pieceRight;
}

.wrapper .container .one .content .piece:nth-child(2) {
  left: 15%;
  top: 45%;
  width: 150px;
  height: 50px;
  animation-delay: 1s;
  animation-name: pieceLeft;
}

.wrapper .container .one .content .piece:nth-child(3) {
  left: 10%;
  top: 75%;
  height: 20px;
  width: 70px;
  animation-delay: 1.5s;
  animation-name: pieceLeft;
}

.wrapper .container .two .content .piece {
  background: linear-gradient(90deg, #4d1dc7 0%, #ffca1e 100%);
}

.wrapper .container .two .content .piece:nth-child(1) {
  left: 0%;
  top: 25%;
  height: 40px;
  width: 120px;
  animation-delay: 2s;
  animation-name: pieceLeft;
}

.wrapper .container .two .content .piece:nth-child(2) {
  right: 15%;
  top: 35%;
  width: 180px;
  height: 50px;
  animation-delay: 2.5s;
  animation-name: pieceRight;
}

.wrapper .container .two .content .piece:nth-child(3) {
  right: 10%;
  top: 80%;
  height: 20px;
  width: 160px;
  animation-delay: 3s;
  animation-name: pieceRight;
}

.wrapper .container .three .content .piece {
  background: hsla(238, 100%, 92.27%, 0.66);
}

.wrapper .container .three .content .piece:nth-child(1) {
  left: 25%;
  top: 35%;
  height: 20px;
  width: 80px;
  animation-name: pieceLeft;
  animation-delay: 3.5s;
}

.wrapper .container .three .content .piece:nth-child(2) {
  right: 10%;
  top: 55%;
  width: 140px;
  height: 40px;
  animation-name: pieceRight;
  animation-delay: 4s;
}

.wrapper .container .three .content .piece:nth-child(3) {
  left: 40%;
  top: 68%;
  height: 20px;
  width: 80px;
  animation-name: pieceLeft;
  animation-delay: 4.5s;
}

.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.mini-padding {
  padding: 0 25px;
}

.rounded {
  border-radius: 8px;
}

.medium-top-space {
  margin-top: 25px;
}

.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

@media only screen and (min-width: 1347px) and (max-width: 1366px) {
  .max {
    margin-top: 0px;
  }
}
@media only screen and (min-width: 1300px) and (max-width: 1400px) {
  .group-first {
    display: flex;
    align-items: center;
    justify-content: space-around;
  }
  .exercise-cover-thub {
    height: 100px;
    width: 100px !important;
    object-fit: cover;
    border-radius: 8px;
  }
  .coach-profile-img {
    height: 183px;
    width: 183px;
    position: relative;
    margin-bottom: 20px;
  }
  .coach-profile-img::before {
    height: 160px;
    width: 12px;
    bottom: 5px;
    left: 132px;
  }
  .coach-profile-img::after {
    height: 190px;
    width: 10px;
    bottom: -15px;
    left: 35px;
    z-index: -1;
  }
  .coach-name-bar {
    font-size: 26px;
    margin-bottom: 20px;
  }
  .coach-phone-call span {
    font-size: 15px;
  }
  .wrapp-teacher-profile {
    height: 440px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1660px) {
  .sett-topping-space {
    margin-top: -30px;
    padding: 0px 120px;
  }
  .menu-link {
    padding: 5px 10px;
    font-size: 11px;
    display: flex;
    justify-content: space-between;
    border-radius: 4px;
    align-items: center;
  }
  .header .menu > ul > li {
    display: inline-block;
    line-height: 50px;
    margin-left: 10px;
  }
  .header .menu > ul > li > a {
    font-size: 13px;
    font-weight: 600;
  }
}
@media only screen and (min-width: 1401px) and (max-width: 1600px) {
  .header .item-center {
    flex: 0 0 59%;
  }
  .wrapp-static-box {
    padding: 20px 20px;
  }
  .wrapp-static-box h4 {
    font-size: 14px;
  }
  .name-course {
    margin-top: 20px;
    font-size: 15px;
  }
  .cart-title p {
    font-size: 12px;
  }
  .w-see-course {
    display: flex;
    margin-top: 5px;
    font-size: 12px;
    padding: 4px 6px;
  }
  .w-see-course i {
    font-size: 15px;
    margin-right: 5px;
    margin-bottom: 0px;
  }
  .dummy {
    position: absolute;
    width: 100%;
    right: 15px;
  }
  .plan-header-row h2 {
    font-size: 46px;
    color: #fff;
  }
  .d-top,
  .d-bottom {
    opacity: 0;
  }
  .plan-header-row {
    display: flex;
    height: 670px;
  }
  .plan-svg text {
    font-size: 3.6rem;
  }
  .plan-page-header {
    height: 550px;
  }
}
@media only screen and (min-width: 1201px) and (max-width: 1400px) {
  .plan-header-row h2 {
    font-size: 38px;
  }
  .AppFormLeft .col-lg-6.mb-5 {
    width: 100% !important;
  }
  .AppFormLeft .linear-bg {
    height: 15px;
    margin-top: 15px;
  }
  .section-top {
    position: absolute;
    top: -60px;
  }
}
@media only screen and (min-width: 991px) and (max-width: 1180px) {
  .header .item-center {
    flex: 0 0 55%;
  }
}
@media only screen and (min-width: 990px) and (max-width: 1300px) {
  .buy-package {
    margin-right: 5px;
    height: 42px;
    padding: 10px 12px;
    border-radius: 6px;
    margin-top: 10px;
  }
  .poster iframe {
    border-radius: 10px;
    z-index: 200;
    height: 350px;
  }
  .buy-package strong {
    font-size: 18px;
  }
  .price .main-price {
    font-size: 20px;
    margin: 0px 10px;
  }
  .plan-header-row h2 {
    font-size: 32px;
  }
  .records p i {
    font-size: 18px;
  }
  .records p .numbers {
    font-size: 18px;
  }
  .records .qty {
    font-size: 18px;
  }
  .coach-icon {
    height: 45px;
    width: 45px;
    object-fit: contain;
  }
  .price .title-price {
    font-size: 28px;
  }
  .set-medium-space {
    margin-bottom: 60px;
    margin-top: -20px;
    padding: 20px 50px;
  }
  .sett-topping-space {
    margin-top: -30px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .sett-topping-space h2 {
    margin-right: -85px;
  }
  .plan-header-row {
    display: flex;
    height: 600px;
  }
  .plan-svg text {
    font-size: 3rem;
  }
  .plan-svg {
    position: absolute;
    top: -66px;
    left: -250px;
  }
  .plan-page-header {
    height: 456px;
  }
  .coach-name-title h3 {
    font-size: 16px;
    font-weight: 600;
    margin: 10px 0;
  }
  .group-first .exercise-group-btn {
    padding: 5px 5px;
    height: 25px;
    border-radius: 4px;
    margin: 0px 5px;
    width: max-content;
  }
  .group-first .exercise-group-btn strong {
    font-size: 10px;
  }
  .group-first .exercise-group-btn i {
    font-size: 17px;
  }
  .group-first {
    display: flex;
    align-items: center;
    justify-content: space-around;
  }
  .exercise-cover-thub {
    height: 100px;
    width: 100px !important;
    object-fit: cover;
    border-radius: 8px;
  }
  .coach-header {
    height: 500px;
    background-position: right;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
  .wrapp-teacher-profile .coach-profile-img {
    height: 142px !important;
    width: 142px !important;
    margin-bottom: 10px;
  }
  .classes-row .wrapp-service-cart {
    height: 320px;
    position: relative;
  }
  .wrapp-main-content {
    padding: 15px 25px;
  }
  .wrapp-main-content .wrapp-patern {
    height: 330px;
  }
  .wrapp-main-content .exercise-cover {
    height: 318px;
    width: 100%;
    object-fit: cover;
  }
  .wrapp-main-content .cover-part {
    padding: 20px 20px;
  }
  .wrapp-class-details-option strong {
    font-size: 12px;
  }
  .wrapp-class-details-option i {
    font-size: 16px;
  }
  .content-title strong {
    font-size: 20px;
  }
  .breadcrumb ul li a {
    font-size: 14px;
  }
  .header-title-2 {
    font-size: 30px;
    padding: 10px 20px;
    border-radius: 22px;
    margin-top: 90px;
  }
  .all-exercises-row .wrapp-service-cart {
    height: 375px;
    position: relative;
  }
  .all-exercises-row .caption-cart h4 {
    font-size: 18px;
    height: 40px;
    overflow: hidden;
  }
  .all-exercises-header {
    height: 400px;
    background-image: url(../../assets/images/banners/bmi.jpg);
    margin-bottom: 50px;
  }
  .img-holder {
    height: 250px;
  }
  .footer-content {
    position: relative;
    z-index: 2;
    padding: 20px;
    padding-right: 40px;
  }
  .title-general-page {
    font-weight: 800;
    font-size: 50px;
    margin-top: 10px;
  }
  .about-us-header {
    height: 450px;
    background-size: cover;
  }
  .about-vector-holder {
    height: 430px;
    object-fit: contain;
  }
  .section-top {
    position: absolute;
    top: -44px;
  }
  .section-latin-name {
    font-size: 18px;
    margin-bottom: 8px;
  }
  .section-title {
    font-size: 24px;
  }
  .linear-bg {
    height: 15px;
    margin-top: -10px;
  }
  .linear-bg img {
    height: 4px;
  }
  .option-header {
    width: 100%;
  }
  .info-icon-holder {
    background-repeat: no-repeat;
    height: 75px;
    width: 75px;
    object-fit: contain;
    padding: 14px;
    background-size: 75px;
  }
  .services-title h3 {
    font-size: 22px;
    margin-left: 20px;
  }
  .caption-cart h4 {
    font-size: 18px;
  }
  .caption-cart p {
    font-size: 11px;
    display: -webkit-box;
    max-width: 280px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 22px;
  }
  .navigate a {
    display: block;
    background: #e7dffd;
    padding: 2px 4px;
    height: 25px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 11px;
  }
  .navigate a i {
    font-size: 12px;
  }
  .date-caption i {
    font-size: 12px;
  }
  .date-caption span {
    font-size: 12px;
  }
  .wrapp-service-cart {
    height: 400px;
    position: relative;
  }
  #service-slider .owl-carousel .owl-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .vector-weight {
    margin-top: 40px;
    height: 100px;
    width: 100%;
    object-fit: contain;
  }
  p {
    text-align: justify;
    font-size: 12px !important;
    line-height: 24px;
  }
  .caption-cart {
    height: 170px;
    position: relative;
    z-index: 2;
    top: -92px;
    border-radius: 50px 0px 0px 0px;
    padding: 15px;
  }
  .fnc-slider__slides {
    position: relative;
    height: 515px;
    transition: transform 1s 0.6666666667s;
  }
  .fnc-slider {
    overflow: hidden;
    box-sizing: border-box;
    position: relative;
    height: 515px;
    background-size: cover;
    background-size: cover;
    background-position: top right;
  }
  .fnc-slide__heading-line h1 {
    font-size: 42px;
    margin-bottom: 0%;
  }
  .slider-area {
    position: relative;
    height: 520px;
    perspective: 1500px;
    background: #000;
  }
  .fnc-nav {
    display: none;
  }
  .plan-section {
    padding: 15px 0px;
    margin: 36px 0px;
    background-size: 141px;
  }
  .gallery-content img {
    height: 18px;
    margin-bottom: 5px;
  }
  .gallery-content .gallery-latin-name {
    font-size: 20px;
    padding-left: 22px;
    height: 18px;
  }
  .gallery-content .gallery-name {
    font-size: 14px;
    margin: 3px 0;
  }
  .gallery-content .gallery-text {
    font-size: 10px !important;
    line-height: 22px;
  }
  .vector-img {
    top: -85px;
    height: 150px;
    width: 100px;
  }
  .coach-banner {
    height: 570px;
    padding: 70px;
    padding-left: 0;
    width: 460px;
    object-fit: contain;
  }
  .certificated-parent {
    flex-wrap: wrap;
  }
  .wrapp-gallery-img {
    height: 250px;
    margin-bottom: 24px;
  }
  .fitnes-vector {
    height: 0px;
    position: relative;
  }
  .fitness-vector-holder {
    position: absolute;
    right: -35px;
    top: -115px;
  }
  .coaching-ico {
    height: 45px;
    width: 45px;
    object-fit: contain;
    padding: 8px;
  }
  .mini-circle-1 {
    height: 70px;
    width: 70px;
    background-size: 75px;
    margin: 2px;
  }
  .mini-circle-2 {
    height: 70px;
    width: 60px;
    background-size: 68px;
    margin: 2px;
  }
  .coaching-content h4 {
    font-size: 20px;
  }
  .coaching-content p {
    font-size: 11px;
    line-height: 19px;
  }
  .animation-text span {
    font-size: 30px;
    font-weight: 900;
    text-align: center;
    height: 20px;
  }
  .wide-linear-gradient {
    width: 194px;
    height: 3px;
    position: relative;
    right: 25px;
    top: -20px;
    background-size: 400% 400%;
    animation: gradient 5s linear infinite;
  }
  .linear-stand-line {
    height: 209px;
    width: 4px;
    background: hsl(238, 100%, 71%);
    background: linear-gradient(90deg, hsl(238, 100%, 71%) 0%, hsl(295, 100%, 84%) 100%);
    background: -moz-linear-gradient(90deg, hsl(238, 100%, 71%) 0%, hsl(295, 100%, 84%) 100%);
    background: -webkit-linear-gradient(189deg, #6329f8 38%, rgba(94, 35, 242, 0) 62%);
    position: relative;
    right: -55px;
    z-index: 100000;
    top: 71px;
  }
  .coaches {
    padding: 20px 10px;
  }
  .wrapp-patern {
    height: 270px;
    width: 100%;
    object-fit: cover;
    background-image: url(../../assets/images/vectors/pattern-1.webp);
    background-size: cover;
    padding: 5px;
  }
  .blogs {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .videobar-title h4 {
    font-size: 24px;
    padding: 0px 10px;
  }
  .hero-holder {
    position: absolute;
    top: -170px;
    right: -125px;
    height: 100px;
    width: 100px;
  }
  .classes-row .caption-cart {
    height: 158px !important;
  }
  .wrapp-coach-detail-table p {
    font-size: 22px !important;
  }
  .wrapp-teacher-profile {
    z-index: 1;
    padding: 45px 10px 65px;
    height: 415px;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
    align-content: center;
    align-items: center;
  }
  .coach-profile-img::before {
    content: "";
    height: 160px;
    width: 12px;
    bottom: 5px;
    left: 85px;
  }
  .coach-profile-img::after {
    content: "";
    height: 190px;
    width: 10px;
    bottom: -15px;
    left: 35px;
    z-index: -1;
  }
  .coach-name-bar {
    font-size: 26px;
    margin-bottom: 20px;
  }
  .coach-phone-call span {
    color: #eee;
    font-size: 15px;
    direction: ltr;
  }
  .wrapp-coach-detail-table .title-detail {
    font-size: 17px;
    margin-left: 5px;
  }
  .wrapp-coach-detail-table p {
    font-size: 17px !important;
  }
  .wrapp-coach-detail-table span {
    font-size: 17px;
  }
}
/*ipod pro */
@media (max-width: 991px) {
  .header .item-center {
    flex: 0 0 58%;
  }
  .video-part {
    margin-top: 20px;
    margin-bottom: 40px;
  }
  .wrapp-patern-1 {
    height: 200px;
    width: 100%;
    background-image: url(../../assets/images/vectors/brush-3.png);
    background-size: contain;
    padding: 10px;
  }
  .table-details {
    display: flex;
    align-items: center;
    margin-top: 15px;
    background-color: #f5f5f5;
    padding: 5px 10px;
    width: 100%;
    flex-direction: column;
  }
  .table-details strong {
    font-size: 18px;
    margin-left: 5px;
    font-size: 12px;
  }
  .table-order td,
  .table-order th {
    text-align: center;
    vertical-align: middle;
    font-size: 10px;
  }
  .table-order thead th {
    border: 0;
    font-size: 10px;
  }
  .header-contex h1 {
    font-size: 24px;
  }
  .property-name {
    font-size: 10px;
  }
  .title-according i {
    font-size: 10px;
    color: #ffca1e;
  }
  .exercises-box-exp {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px;
    height: 50px;
    border-radius: 6px;
    background-color: #f7f4ff;
    margin-bottom: 10px;
    flex-direction: column;
  }
  .title-according h3 {
    font-size: 14px;
  }
  .exer-caption h5 {
    font-size: 22px;
  }
  .property {
    font-weight: 600;
    font-size: 10px;
    margin-left: 0px;
  }
  .exer-caption p {
    text-align: justify;
    font-size: 11px;
  }
  .video-body-wrapper iframe {
    border-radius: 6px;
    width: 100%;
  }
  .plan-box-btn {
    background-size: 42px;
    background-position: 40px 20px;
    width: 100%;
    border: none;
  }
  .plan-box-btn h3 {
    font-size: 28px;
  }
  .plan-details-btn {
    padding: 5px 8px;
    height: 34px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    background: #f2edff;
    font-size: 16px;
  }
  .plan-box-btn {
    height: 75px;
    padding: 20px !important;
  }
  .wrapp-plan-details {
    padding: 10px 10px;
  }
  .details-box-header {
    font-size: 15px;
    margin-bottom: 0px;
  }
  .wrapp-details-box {
    padding: 8px 15px;
    border-radius: 4px;
    height: 58px;
    margin-bottom: 10px;
  }
  .dashboard-header {
    padding-right: 55px;
  }
  .sidebar-toggler {
    position: fixed;
    right: 17px;
    top: 12px;
    height: 30px;
    width: 30px;
    padding: 1px 6px;
    font-size: 18px;
    color: #000;
    background: rgba(255, 240, 157, 0.7803921569);
    border-radius: 6px;
  }
  .layout .sidebar .menu .menu-item a {
    display: flex;
    align-items: center;
    padding: 3px 20px;
    font-size: 12px;
    font-weight: 600;
  }
  .dashboard-content.space-top {
    margin-top: 12px !important;
  }
  .layout .sidebar .menu .menu-item a .menu-icon {
    font-size: 14px;
    width: 35px;
    min-width: 35px;
    height: 35px;
    line-height: 35px;
    margin-left: 5px;
  }
  .dashboard-icon {
    padding: 10px;
    width: 42px;
    height: 42px;
    border-radius: 10px;
    margin-left: 15px;
  }
  .dashboard-icon i {
    font-size: 22px;
  }
  .wrapp-details-dashboard span {
    margin-top: 5px;
    font-size: 13px !important;
    margin-left: 8px;
    margin-right: 2px;
  }
  #clock {
    margin-top: 2px;
    font-size: 14px;
    margin-left: 5px;
  }
  .wrapp-details-dashboard strong {
    margin-top: 5px;
    font-size: 12px !important;
    font-weight: 600 !important;
  }
  .dashboard-alert-box .alert-icon-box {
    padding: 10px;
    width: 42px;
    height: 42px;
  }
  .dashboard-alert-box .alert-icon-box i {
    font-size: 22px;
  }
  .dashboard-alert-box .alert-title {
    font-size: 20px;
  }
  .dashboard-alert-box p {
    font-size: 10px;
    line-height: 20px;
    text-align: justify;
  }
  .col-banner-dashboard {
    height: 90px;
    width: 100%;
    margin-top: 10px;
  }
  .dashboard-content .plan-cart {
    height: 255px;
    border-radius: 8px;
    margin-top: 25px;
  }
  .calender-bg {
    background-size: 30px;
    background-position: 25px 20px;
    height: 80px;
  }
  .clock-bg {
    background-size: 30px;
    height: 80px;
  }
  .package-bg {
    background-size: 30px;
    height: 80px;
  }
  .time-title {
    font-size: 18px;
  }
  .dashboard-content {
    padding: 20px 15px;
    border-radius: 4px;
    box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.13);
    margin-top: 5px;
  }
  .layout .content {
    padding: 0px 0px;
    display: flex;
    flex-direction: column;
  }
  .logo-area strong {
    font-size: 14px;
  }
  .wrapp-home-btn a i {
    font-size: 18px;
    margin-left: 8px;
  }
  .wrapp-home-btn a strong {
    font-size: 10px;
  }
  .dashboard-header {
    display: flex;
    align-items: center;
    padding: 12px 15px;
    justify-content: space-between;
    flex-direction: row-reverse;
    z-index: -10;
    position: relative;
    padding-right: 70px;
  }
  .buy-package-header {
    height: 350px;
  }
  .buy-vector img {
    position: absolute;
    top: -140px;
    right: 0;
    height: 100px;
  }
  .plan-header-row h2 {
    font-size: 28px;
  }
  .wrapp-payment a i {
    position: relative;
    top: 2px;
    margin-left: 2px;
    margin-right: 0px;
    font-size: 12px;
    font-weight: 600;
  }
  .wrapp-payment .wrapp-img-payment {
    height: 60px;
    width: 70px;
    padding: 0px 0px;
    object-fit: cover;
    border-radius: 4px;
    margin-left: 5px;
    background-color: #fff !important;
  }
  .null-payment h5 span {
    font-size: 11px;
    font-weight: 600;
  }
  .wrapp-payment-btn h4 {
    display: none;
  }
  .ui-error {
    height: 70px;
    width: 70px;
  }
  .error-title {
    margin-top: 12px;
    font-size: 20px;
    direction: rtl;
  }
  .date-detail,
  .price-detail {
    justify-content: right;
    font-size: 12px;
  }
  .box-de {
    margin-top: 20px;
    height: 80px;
    display: flex;
    justify-content: center;
    direction: rtl;
    flex-direction: column;
    align-content: center;
    align-items: center;
  }
  .st-title {
    font-weight: 600;
    font-size: 14px;
  }
  .back-to-home {
    height: 38px;
    min-width: 122px;
    font-weight: 600;
    font-size: 12px;
    padding: 0;
  }
  .errors-header {
    background-position: center;
    background-size: cover;
    height: 350px;
  }
  .checkmark {
    width: 68px;
    height: 68px;
    border-radius: 50%;
    position: relative;
    top: 5px;
    right: 5px;
    margin: 0 auto;
  }
  .ca-title {
    margin-right: 0px;
    font-size: 12px;
    margin-top: 10px;
  }
  .zarinpal-wrapper {
    height: 30px;
    width: 30px;
    object-fit: contain;
    margin-right: 2px;
  }
  .wrapp-payment-btn i {
    font-size: 16px;
    font-weight: 800;
    padding: 2px 3px;
  }
  .wrapp-payment-btn {
    border-radius: 4px;
    display: flex;
    align-items: center;
    direction: rtl;
    justify-content: space-around;
    padding-left: 15px;
    padding: 2px !important;
  }
  .wrapp-payment .wrapp-course-payment h1 {
    font-size: 11px;
    padding-right: 12px;
  }
  .wrapp-payment .wrapp-course-payment strong {
    font-size: 12px;
    margin-top: 8px;
  }
  .wrapp-payment .wrapp-course-details-header h3 {
    font-size: 12px;
  }
  .wrapp-payment .wrapp-course-details-header {
    padding: 5px 0px;
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
  }
  .wrapp-payment a {
    padding: 0px 5px;
    font-size: 9px;
    font-weight: 600;
    height: 32px;
    min-width: 97px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 4px;
  }
  .sett-position {
    top: 0px !important;
  }
  .present-way strong {
    font-size: 24px;
  }
  .price i {
    font-size: 16px;
    margin-left: 10px;
  }
  .present-way i {
    font-size: 16px;
    margin-left: 10px;
  }
  .shape {
    font-size: 1.125em;
    height: 72px;
    padding: 13px 35px;
    top: 10px;
    width: 100%;
  }
  .header-contex h2 {
    font-size: 24px;
  }
  .header-contex svg {
    position: absolute;
    z-index: 10000;
    top: -1px;
    left: -133px;
    height: 80px;
    width: 215px;
  }
  .option-header h5 {
    font-size: 12px;
  }
  .small-padding {
    padding: 3px 20px;
  }
  .plan-container .cover-part {
    margin-bottom: 30px;
  }
  .card-text {
    font-size: 12px;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .coach-vector {
    height: 200px;
  }
  .plan-img-holder {
    height: 250px;
    animation: mover-gym-3 3.5s infinite alternate;
    object-fit: contain;
  }
  .plan-img-holder img {
    height: 100%;
    width: 100%;
    object-fit: contain;
  }
  .wrapp-main-content .exercise-cover {
    height: 255px;
    width: 100%;
    object-fit: cover;
  }
  .poster iframe {
    border-radius: 10px;
    z-index: 200;
    height: 250px;
  }
  .plan-svg {
    top: -115px;
    left: -250px;
  }
  .price .main-price {
    font-size: 18px;
    margin: 0px 10px;
  }
  .group-first .exercise-group-btn {
    padding: 5px 5px;
    height: 25px;
    border-radius: 4px;
    margin: 0px 5px;
    width: max-content;
  }
  .group-first .exercise-group-btn strong {
    font-size: 10px;
  }
  .group-first .exercise-group-btn i {
    font-size: 17px;
  }
  .group-first {
    margin-bottom: 25px;
    height: 225px;
    background-color: #fff;
    background-position: top left;
    background-repeat: no-repeat;
    justify-content: space-between;
    align-items: flex-start;
    padding: 10px 12px;
    flex-direction: column;
  }
  .exercise-cover-thub {
    height: 90px;
    width: 120px !important;
    object-fit: cover;
    border-radius: 8px;
  }
  .group-first .exercise-caption-sm p {
    font-size: 11px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    text-align: justify;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 20px;
    margin-top: 0px;
  }
  .btn-holder-exc {
    height: 100%;
    display: flex;
    align-items: flex-end;
    padding-bottom: 5px;
    justify-content: flex-end;
    width: 100%;
  }
  .group-first .exercise-caption-sm .exercises-name-sm {
    display: flex;
    align-items: center;
    font-size: 17px;
    height: 32px;
    margin-top: 5px;
    overflow: hidden;
  }
  .wrapp-coach-detail-table p,
  .wrapp-coach-detail-table span {
    font-size: 18px;
  }
  .coach-header {
    height: 323px;
    background-image: url(../../assets/images/banners/banner.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom right;
  }
  .coach-header h1 {
    margin-top: 128px;
    font-size: 40px;
  }
  .coach-profile-img::before {
    content: "";
    height: 208px;
    width: 10px;
  }
  .wrapp-coach-detail-table {
    border: 1px solid #eee;
    padding: 5px 10px;
    border-radius: 5px;
    margin-bottom: 5px;
  }
  .coach-profile-img::after {
    content: "";
    height: 230px;
    width: 10px;
    border-radius: 100px;
    position: absolute;
    bottom: -35px;
    left: 100px;
    z-index: -1;
  }
  .wrapp-teacher-profile {
    padding: 35px 10px 0px;
    height: 382px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .wrapp-coach-detail-table .title-detail {
    font-size: 18px;
  }
  .wrapp-coach-detail-table i {
    font-size: 17px;
  }
  .biography p {
    text-align: justify;
    font-size: 12px;
    line-height: 28px;
  }
  .wrapp-teacher-content {
    padding: 20px 25px;
    z-index: 1000;
    position: relative;
    top: -38px;
  }
  .classes-row .caption-cart {
    height: 158px !important;
  }
  .content-trust h3 {
    font-size: 18px;
  }
  .wrapp-trust-builder {
    height: 170px;
  }
  .img-trust-2 {
    height: 165px;
  }
  .banner-trust-2 {
    height: 165px;
    object-fit: cover;
  }
  .banner-trust-2 img {
    height: 100%;
    object-fit: cover;
  }
  .space-top {
    margin-top: 20px;
  }
  .section-last-caption {
    padding: 0px 20px;
  }
  .mb-4 {
    margin-bottom: 20px !important;
  }
  .wrapp-list-item {
    padding: 0px 15px;
  }
  .wrapp-list-item ul li {
    font-size: 12px;
  }
  .banner-trust {
    height: 165px;
  }
  .img-trust {
    height: 165px;
  }
  .wrapp-trust-icon {
    height: 60px;
    width: 60px;
    background-image: url(../../assets/images/vectors/line-brush.png);
    background-size: 86px;
  }
  .man-box {
    direction: rtl;
  }
  .man-box .img-gym-box {
    width: 50%;
    object-fit: cover;
    clip-path: polygon(0% 0, 47% 0, 100% 100%, 0 100%);
    height: 130px;
  }
  .content-trust p {
    font-size: 11px;
    line-height: 18px;
    text-align: justify;
    height: 109px;
    overflow: hidden;
  }
  .man-box {
    background-position: right;
  }
  .wrapp-gym-plan-box {
    height: 130px;
    justify-content: space-between;
    flex-direction: row-reverse;
    margin-bottom: 20px;
  }
  .gym-box-content {
    padding: 20px;
    width: 64%;
    direction: rtl;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .img-gym-box {
    width: 35%;
    height: 130px;
    border-radius: 4px;
  }
  .wrapp-about-item h3 {
    font-size: 13px;
    margin-bottom: 5px;
  }
  .about-vector-holder {
    height: 200px;
    object-fit: contain;
    margin-bottom: 50px;
  }
  .wrapp-about-info {
    padding: 0px 15px;
  }
  .snip1482 {
    min-width: 300px;
    max-width: 332px;
    min-height: 147px;
    font-size: 16px;
  }
  .title-general-page {
    font-weight: 800;
    font-size: 35px;
    margin-top: 10px;
    padding: 0px 20px;
  }
  .AppFormLeft .linear-bg {
    display: none;
  }
  .otp-login {
    height: 40px;
  }
  .otp-login strong {
    font-size: 18px;
  }
  .otp-login i {
    height: 30px;
    width: 30px;
    border-radius: 6px;
    padding: 0px;
    margin-left: 10px;
    padding-right: 5px;
    color: #ffca1e;
    font-size: 22px;
  }
  .centeral-page {
    width: 100%;
    margin-bottom: 0px;
  }
  .blog-body {
    padding: 40px 15px;
  }
  .wrapp-comments {
    border: 1px solid rgb(242, 242, 242);
    margin: 0px 0px;
    border-radius: 4px;
  }
  .selectBox {
    padding: 5px 12px;
  }
  .topper-blog {
    margin-top: 125px !important;
  }
  .services-title h1 {
    font-size: 20px;
    margin-left: 20px;
  }
  .header .item-right {
    align-items: flex-end;
    position: relative;
    top: -35px;
    display: flex;
    flex-direction: column;
    flex-direction: column-reverse;
  }
  .colored-link i {
    color: #000000;
    font-size: 12px;
    margin-left: 4px;
    position: relative;
    top: 2px;
  }
  .menu-link {
    padding: 5px 8px;
    font-size: 10px;
    display: flex;
    justify-content: space-between;
    border-radius: 4px;
    margin-bottom: 3px;
    font-weight: 600;
    width: 95px;
    height: 30px;
    align-items: center;
  }
  .border-link i {
    color: rgba(0, 0, 0, 0.81);
    font-size: 15px;
    margin-left: 12px;
  }
  .border-link {
    border: 1px solid rgba(0, 0, 0, 0.292);
  }
  .header .mobile-menu-trigger {
    display: flex;
    height: 30px;
    width: 20px;
    margin-left: 0px;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    right: 18px;
    position: absolute;
    top: 36px;
  }
  .header {
    box-shadow: 0px 5px 8px 3px rgba(0, 0, 0, 0.3);
    display: block;
    width: 100%;
    position: relative;
    z-index: 99;
    padding: 0px 15px;
    direction: rtl;
    background: transparent;
    height: 75px;
  }
  .menu-link span {
    margin-bottom: 2px;
  }
  .fnc-slider__slides {
    position: relative;
    height: 290px;
    transition: transform 1s 0.6666666667s;
  }
  .slider-area {
    position: relative;
    height: 380px;
    padding-top: 100px;
  }
  .fnc-slide__mask-inner {
    height: 450px;
  }
  .fnc-slide__heading-line h1 {
    font-size: 22px;
    margin-bottom: 0%;
  }
  .fnc-slide__heading-line strong {
    font-weight: 500;
    font-size: 20px;
    font-family: KalamehWeb;
  }
  .fnc-slide__action-btn {
    width: 125px;
    height: 35px;
    padding: 0px 5px;
    font-size: 10px;
    margin-bottom: 30px;
    margin-right: 20px;
    display: flex;
    align-items: center;
  }
  .fnc-slide__action-btn span {
    line-height: 35px;
  }
  .fnc-slide__action-btn span:after {
    line-height: 35px;
  }
  .line-box {
    position: relative;
    border-right: 5px solid rgba(255, 255, 255, 0.3215686275);
    top: -20px;
    right: 32px;
  }
  .button-line {
    height: 5px;
    width: 100px;
  }
  .topper-line {
    height: 5px;
    width: 100px;
  }
  .fnc-slide__heading {
    padding: 20px 0px;
    margin-bottom: 10px;
  }
  .about-section {
    margin-top: 0px;
    padding: 5px 15px;
  }
  .packages-section {
    margin-top: 50px;
    margin-bottom: 10px;
  }
  .fnc-slider {
    height: 290px;
  }
  .fnc-nav {
    display: none;
  }
  .gray-box {
    height: 35px;
    top: -24px;
  }
  .gradient-bar .col-lg-2 {
    width: 50%;
  }
  .gradient-bar .col-lg-3 {
    width: 60%;
  }
  .gradient-wrapper {
    height: 5px;
    margin-bottom: 0.5px;
    top: -22px;
    background-size: 400% 400%;
  }
  .gray-box h2 {
    position: relative;
    font-size: 30px;
    top: -4px;
    padding-left: 20px;
    text-align: left;
  }
  .section-latin-name {
    font-size: 18px;
    margin-bottom: 8px;
  }
  .section-title {
    font-size: 24px;
  }
  .linear-bg {
    height: 15px;
    margin-top: -10px;
  }
  .linear-bg img {
    height: 4px;
  }
  .about-section p {
    font-size: 12px;
    line-height: 24px;
  }
  .thubmnail-img {
    height: 50px;
    width: 50px;
    border-radius: 10px;
    padding: 10px;
  }
  .thubmnail-name h4 {
    font-size: 18px;
  }
  .thubmnail-caption {
    margin-bottom: 5px;
  }
  .thubmnail-caption p {
    font-size: 10px;
    line-height: 18px;
  }
  .medium-circle > div {
    background: #f7f7f7;
    width: 230px;
    height: 230px;
    border-style: solid;
    border-color: transparent;
    border-radius: 50%;
    border-width: 1px;
  }
  .medium-circle {
    width: 240px;
    height: 240px;
    border-radius: 50%;
    border-width: 1px;
  }
  .big-circle {
    width: 490px;
    height: 420px;
    background-size: 330px;
    width: 100%;
  }
  .football-section {
    height: 290px;
  }
  .topper-text h3 {
    font-size: 25px;
    font-weight: 900;
  }
  .bottom-text h3 {
    font-size: 25px;
  }
  .plan-section {
    padding: 20px 0px;
    margin: 35px 0px;
    background-size: 90px;
  }
  .plan-cart {
    height: 290px;
    border-radius: 8px;
    margin-top: 25px;
  }
  .plan-img {
    height: 135px;
  }
  .plan-caption h2 {
    font-size: 16px;
  }
  .plan-caption p {
    font-size: 10px;
    display: -webkit-box;
    max-width: 280px;
    line-height: 18px;
  }
  .plan-caption {
    padding: 8px 8px;
    background: #f1eef9;
    border-radius: 8px;
    background-size: 30px;
  }
  .mini-logo-holder {
    height: 25px;
    width: 25px;
    object-fit: contain;
  }
  .plan-caption .btn-holder a {
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 5px;
    margin-top: 5px;
    font-size: 10px;
  }
  .plans_slider .owl-item.center .item .plan-cart {
    box-shadow: none;
    direction: rtl;
    position: relative;
    height: 300px !important;
    border-radius: 8px 8px 0px 0px;
  }
  .plan-tag {
    padding: 2px 20px;
    top: 10px;
    left: 9px;
    height: 30px;
    border-radius: 8px;
  }
  .owl-carousel .owl-nav button.owl-next,
  .owl-carousel .owl-nav button.owl-prev,
  .owl-carousel button.owl-dot {
    display: none !important;
  }
  .plan-tag p {
    font-size: 12px;
    right: unset !important;
  }
  .caption-wrapper {
    display: flex;
    flex-direction: column-reverse;
  }
  .gallery-header h4 {
    font-size: 24px;
  }
  .caption-wrapper strong {
    font-size: 30px;
    text-align: left;
  }
  .gallery-caption {
    margin-top: 0px;
    width: 100%;
    font-size: 12px;
    line-height: 22px;
  }
  .gallery-content {
    padding: 10px 10px;
    border-radius: 10px;
  }
  .wrapp-gallery-img {
    height: 180px;
    margin-bottom: 18px;
  }
  .gallery-content img {
    height: 18px;
    margin-bottom: 5px;
  }
  .gallery-content .gallery-latin-name {
    font-size: 20px;
    padding-left: 22px;
    height: 18px;
  }
  .gallery-content .gallery-name {
    font-size: 14px;
    margin: 3px 0;
  }
  .wrapp-gallery-big .gallery-text {
    font-size: 10px;
    width: 75%;
    line-height: 20px;
    height: 60px;
    overflow: hidden;
  }
  .gallery-content .gallery-text {
    font-size: 10px;
    width: 100%;
    color: #e2e2e2;
    line-height: 18px;
    height: 60px;
    overflow: hidden;
  }
  .gallery-section {
    position: relative;
    height: 565px;
    overflow: hidden;
  }
  .purple-section {
    margin: 20px 0;
    padding: 30px 15px;
  }
  .services-title h3 {
    font-size: 20px;
    margin-left: 20px;
  }
  .service-caption p {
    margin-top: 0px;
    font-size: 12px;
    line-height: 24px;
  }
  .show-all-services {
    height: 34px;
    padding: 10px;
    font-size: 10px;
    margin-top: 5px;
  }
  .vector-weight {
    margin-top: -58px;
    height: 75px;
    width: 100%;
    direction: ltr;
  }
  .img-holder {
    height: 185px;
  }
  .caption-cart {
    height: 155px;
    position: relative;
    background-color: #fff;
    z-index: 2;
    top: -92px;
    border-radius: 45px 0px 7px 15px;
    padding: 8px 12px;
    box-shadow: 0px 0px 3px 1px rgba(0, 0, 0, 0.07);
  }
  .purple-filter {
    height: 185px;
  }
  .header-caption {
    background-image: url(../../assets/images/vectors/brush.png);
    background-size: 45px;
    height: 19px;
    margin-bottom: 0px;
  }
  .caption-cart h4 {
    font-weight: 800;
    font-family: KalamehWeb;
    font-size: 18px;
  }
  .caption-cart p {
    font-size: 11px;
    display: -webkit-box;
    max-width: 280px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 22px;
  }
  .navigate a {
    display: block;
    background: #e7dffd;
    padding: 2px 6px;
    height: 22px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 10px;
  }
  .navigate a i {
    font-size: 12px;
  }
  .date-caption i {
    font-size: 12px;
  }
  .date-caption span {
    font-size: 10px;
  }
  .wrapp-service-cart {
    height: 250px;
    position: relative;
  }
  #service-slider .owl-carousel .owl-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .product-title h2 {
    font-size: 24px;
    margin-left: 20px;
  }
  .vector-img {
    top: -85px;
    height: 150px;
    width: 100px;
  }
  .see-all-products {
    padding: 0px 8px;
    border-radius: 6px;
    font-size: 10px;
    height: 35px;
    top: 10px;
  }
  .product-img-holder {
    height: 110px;
    width: 100%;
    object-fit: cover;
  }
  .product-img-holder img {
    object-fit: contain !important;
  }
  .product-name h2 {
    font-size: 12px;
    line-height: 20px;
    margin-top: 0px;
    height: 40px;
    margin-bottom: 0px;
  }
  .product-details .buy-product {
    display: flex;
    align-items: center;
    justify-content: start;
    width: 50%;
    object-fit: contain;
    height: 30px;
    width: 30px;
    padding: 1px;
  }
  .product-price-holder {
    display: flex;
    width: 100%;
    justify-content: flex-end;
  }
  .wrapp-product-cart {
    height: 225px;
    background: #fff;
    border-radius: 6px;
    border: 0.8px solid #eeeeee;
    border-radius: 10px;
    padding: 10px 0px;
  }
  .product-caption {
    padding: 10px;
  }
  .coaches {
    background: url(../../assets/images/Services/shape-17.png);
    padding: 40px 10px;
    direction: rtl;
    margin: 0px 0;
  }
  .coach-section p {
    font-size: 12px;
    line-height: 24px;
  }
  .coaching-ico {
    height: 45px;
    width: 45px;
    object-fit: contain;
    padding: 8px;
  }
  .mini-circle-1 {
    height: 70px;
    width: 70px;
    background-size: 75px;
    margin: 2px;
  }
  .mini-circle-2 {
    height: 70px;
    width: 60px;
    background-size: 68px;
    margin: 2px;
  }
  .coaching-content h4 {
    font-size: 16px;
  }
  .coaching-content p {
    font-size: 11px;
    line-height: 19px;
  }
  .coach-flex {
    margin-bottom: 0px;
  }
  .coach-banner {
    height: 350px;
    width: 357px;
    object-fit: contain;
  }
  .wrapp-collage {
    display: flex;
    flex-direction: row-reverse;
    margin-top: 20px;
  }
  .linear-stand-line {
    height: 180px;
    width: 3px;
    right: -65px;
  }
  .animation-text {
    display: grid;
    height: 200px;
  }
  .animation-text span {
    font-size: 25px;
    text-align: center;
  }
  .wide-linear-gradient {
    width: 168px;
    height: 3px;
    right: 40px;
    top: -21px;
  }
  .fitnes-vector {
    height: 120px;
    width: 170px;
    position: absolute;
  }
  .video-part {
    padding: 30px 20px;
    padding-left: 20px;
  }
  .videobar-title h4 {
    font-size: 24px;
    padding: 0px 10px;
  }
  .video-caption {
    margin-top: 22px;
    width: 100%;
    font-size: 10px;
    direction: rtl;
    text-align: justify;
  }
  .video-caption p {
    font-size: 12px;
    line-height: 24px;
  }
  .video-bar-holder {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-end;
  }
  .fitness-vector-holder {
    position: absolute;
    right: -35px;
    top: 158px;
  }
  .dott-bg {
    height: 100px;
    background-size: 80px;
    margin-top: 0px;
  }
  .channel-btn {
    padding: 6px 15px;
    font-size: 14px;
  }
  .wrapp-patern {
    height: 240px;
    width: 100%;
    padding: 0px;
  }
  .hero {
    display: none;
  }
  .video-cover {
    height: 100%;
    width: 100%;
    border-radius: 8px;
    right: -13px;
    top: 15px;
  }
  .video-play-button {
    width: 18px;
    height: 18px;
    padding: 15px;
    display: flex;
    justify-content: center;
  }
  .video-play-button:before {
    width: 50px;
    height: 50px;
    background: #faf8ff;
    border-radius: 50%;
    animation: pulse-border 1500ms ease-out infinite;
  }
  .blogs {
    margin-top: 0px;
    margin-bottom: 0px;
  }
  #blogs-slider {
    margin-top: -30px;
  }
  .show-all-blogs {
    padding: 0px 10px;
    height: 30px;
    font-size: 10px;
  }
  .blog-card {
    margin-top: 0px;
    padding: 0;
    height: 270px;
    overflow: hidden;
  }
  .blog-card {
    margin-top: 0px;
    background: #fff;
    border-radius: 8px;
    height: 270px;
    overflow: hidden;
  }
  .date-tag strong {
    font-size: 16px;
    margin-left: 4px;
  }
  .date-tag {
    padding: 0px 12px;
    padding-left: 30px;
    margin-top: -20px;
    height: 24px;
    display: flex;
    align-items: center;
  }
  .options span {
    font-size: 12px;
  }
  .topper-footer {
    height: 70px;
    margin-top: 40px;
  }
  .class-time {
    font-size: 12px;
    text-align: center;
    margin-bottom: 8px;
  }
  .class-time-details {
    display: flex;
    justify-content: center;
  }
  .class-time-details p {
    color: #fff;
    font-weight: 600;
    font-size: 12px;
  }
  .footer-logo a {
    display: block;
    height: 50px;
    width: 100%;
    object-fit: contain;
  }
  .footer-logo a img {
    height: 100%;
    object-fit: contain;
  }
  .footer-design {
    margin-top: 0px;
    padding: 0px 20px;
  }
  .footer-text p {
    margin-bottom: 5px;
    font-size: 12px;
    line-height: 24px;
    text-align: justify;
  }
  .footer-social-icon i {
    color: #6f7086;
    font-size: 18px;
    padding: 10px 14px;
  }
  .footer-widget ul li {
    margin-bottom: 2px;
    text-align: right;
  }
  .footer-widget ul li a {
    font-size: 10px;
  }
  .footer-widget-heading {
    margin-top: 15px;
  }
  .certificated-parent {
    display: flex;
    justify-content: center;
  }
  .copyright-text-p {
    font-size: 10px;
    text-align: center;
  }
  .ads-align {
    display: flex;
    justify-content: center;
  }
  .certificate-area {
    height: 70px;
    width: 70px;
    object-fit: contain;
    border-radius: 8px;
    padding: 10px;
    margin: 8px;
    background: rgba(255, 255, 255, 0.231372549);
  }
  .footer-content {
    padding-top: 20px !important;
  }
  .wrapp-all-prurple {
    padding: 10px 20px;
    display: flex;
    align-items: center;
    direction: rtl;
    text-align: right;
    justify-content: center;
  }
  .class-trainer-header {
    height: 450px;
  }
  .header-title {
    font-size: 26px;
    padding: 10px 20px;
    border-radius: 12px;
  }
  .vec-circle {
    top: -150px;
    height: 50px;
    left: 100px;
    width: 50px;
  }
  .wrapp-main-content {
    text-align: right;
    padding: 20px 15px;
  }
  .cover-part {
    padding: 0px 10px;
  }
  .exercise-cover {
    height: 175px;
    width: 100%;
    object-fit: cover;
    border-radius: 10px;
  }
  .exercise-cover img {
    border-radius: 10px;
  }
  .wrapp-main-content p {
    text-align: justify;
    font-size: 12px;
    line-height: 22px;
  }
  .wrapp-main-content .services-title {
    background-image: url(../../assets/images/vectors/brush.png);
    background-size: 130px;
    background-repeat: no-repeat;
    background-position: right;
    padding: 0px 20px;
  }
  .wrapp-main-content .row {
    justify-content: center;
  }
  .wrapp-class-details-option i {
    font-size: 12px;
    margin-left: 2px;
  }
  .wrapp-class-details-option strong {
    font-size: 12px;
  }
  .titie-side {
    font-size: 18px;
  }
  .wrapp-class-details-option {
    padding: 10px 8px;
    margin-bottom: 4px;
  }
  .section-title-2 {
    font-size: 20px;
  }
  .class-details-wrapp {
    box-shadow: -1px 0px 2px rgba(0, 0, 0, 0.13);
    height: 85px;
    padding: 8px;
    background-position: 20px 20px;
    background-size: 40px;
    background-repeat: no-repeat;
    margin-bottom: 10px;
  }
  .days-title span,
  .days-title strong {
    font-size: 12px;
  }
  .hours-title span,
  .hours-title strong {
    font-size: 12px;
  }
  .medium-margin {
    margin-top: 15px;
  }
  .w-course-side {
    top: -130px;
    box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  }
  .side-wrapper {
    position: relative;
    top: -115px;
  }
  .contacting {
    height: 300px;
    border-radius: 4px;
    margin-top: 30px;
    background-position: 0 0;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    top: -128px;
  }
  .wrapp-comments .wrapp-user-comments .comment-body p {
    font-size: 12px;
  }
  .wrapp-name-comment strong {
    font-size: 12px !important;
  }
  .wrapp-name-comment span {
    font-size: 12px !important;
  }
  .wrapp-name-comment p {
    font-size: 12px !important;
  }
  .wrapp-comments .wrapp-user-comments .comment-user strong {
    font-size: 12px;
  }
  .wrapp-comments .wrapp-user-comments .comment-user {
    padding: 5px 10px;
  }
  .owner-comments .reply-name p {
    font-size: 12px;
    font-weight: 600;
    margin-left: 5px;
  }
  .owner-comments .reply-name span {
    margin-right: 10px;
    font-size: 12px;
  }
  .wrapp-main-content section p {
    font-size: 12px;
  }
  .wrapp-main-content.medium-margin .mt-3 {
    margin-top: 0px !important;
    padding-top: 0px !important;
  }
  .wrapp-main-content.medium-margin .form-label {
    margin-bottom: 5px;
    font-size: 12px !important;
    margin-top: 10px;
    padding-right: 8px;
  }
  .wrapp-main-content.medium-margin .form-control {
    border: 1px solid rgba(176, 144, 255, 0.15);
    height: 38px;
    border-radius: 4px;
  }
  .wrapp-main-content.medium-margin .comment-btn {
    margin-top: 12px;
  }
  .ecr-img {
    height: 50px;
    width: 50px;
  }
  .ecr-content strong {
    font-size: 13px;
    margin-right: 10px;
  }
  .wrapp-sidebar-couese .each-wrapp-options {
    padding: 5px;
  }
  .icons-wrapp i {
    font-size: 16px !important;
  }
  .icons-wrapp span {
    font-size: 12px;
  }
  .vaiable-wrapp span {
    font-size: 12px;
  }
  .wrapp-sidebar-couese .wrapp-side-btn {
    padding: 5px;
    border-radius: 4px;
    margin-bottom: 5px;
  }
  .wrapp-sidebar-couese .wrapp-side-btn a span {
    font-size: 12px;
  }
  .wrapp-sidebar-couese .wrapp-side-btn a i {
    font-size: 16px;
  }
  .wrapp-sidebar-couese .teacher-wrapping a {
    font-family: KalamehWeb;
    font-weight: 800;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .about-count-box span {
    font-size: 24px;
  }
  .about-count-box strong {
    font-size: 26px;
  }
  .AppFormLeft .linear-bg {
    display: none;
  }
  .product-title h2 {
    font-weight: 800;
    font-family: KalamehWeb;
    font-size: 30px;
    margin-left: 20px;
  }
  .logo {
    width: 150px;
  }
  .colored-link {
    margin-right: 30px;
  }
  .main-slider {
    margin-top: 120px;
    padding: 5px !important;
  }
  .categories-area {
    margin-top: 20px;
    padding: 0px 50px;
  }
  .flex-title {
    display: flex;
    align-items: center;
    padding: 0px 50px;
  }
  .cart-wrappering {
    padding: 25px 30px;
  }
  .header {
    box-shadow: 0px 5px 8px 3px rgba(0, 0, 0, 0.3);
    display: block;
    width: 100%;
    position: relative;
    z-index: 99;
    padding: 0px 15px;
    direction: rtl;
    background: transparent;
  }
  .box-margin {
    margin-top: 20px;
    padding: 0px 50px;
    display: flex;
    justify-content: flex-end;
  }
  .wrapp-title {
    padding-right: 75px;
    margin-bottom: 15px;
  }
  .container.main-container .row.rtl.sett-margins {
    display: flex;
    justify-content: flex-end;
  }
  .mobile-padding {
    padding: 5px 50px;
  }
  .header .item-right {
    align-items: flex-end;
    position: relative;
    top: -48px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row-reverse;
    justify-content: flex-start;
  }
  .blog-margins {
    padding: 0px 50px;
  }
  .menu-link {
    margin-right: 10px;
  }
  .blog-title {
    padding-right: 72px;
  }
  .wrapp-title {
    margin-top: 25px;
  }
  .blog-margins .col-lg-7 {
    height: 290px;
    overflow: hidden;
  }
  .header .item-left, .header .item-right {
    flex: 0 0 auto;
  }
  .sett-margins {
    margin-bottom: 0px;
  }
  .btn-area {
    height: 50px;
    padding-left: 72px;
  }
  .menu {
    margin-top: 10px;
  }
  .header .menu > ul > li > a {
    font-size: 13px;
  }
  .header .menu > ul > li {
    line-height: 0;
  }
  .colored-link i {
    color: #000000;
    font-size: 12px;
    margin-left: 4px;
    position: relative;
    top: 2px;
  }
  .fnc-slider__slides {
    position: relative;
    height: 460px;
    transition: transform 1s 0.6666666667s;
  }
  .fnc-slider {
    overflow: hidden;
    box-sizing: border-box;
    position: relative;
    height: 460px;
  }
  .about-section {
    padding: 20px;
    margin-top: 20px;
  }
  .medium-circle > div {
    background: #f7f7f7;
    width: 300px;
    height: 295px;
    border-style: solid;
    border-color: transparent;
    border-radius: 50%;
    border-width: 1px;
  }
  .medium-circle {
    width: 310px;
    height: 305px;
    display: flex;
  }
  .big-circle {
    width: 491px;
    height: 269px;
    background-size: 703px;
    width: 100%;
  }
  .plan-img {
    height: 138px;
    width: 100%;
    border-radius: 8px 8px 0px 0px;
    object-fit: cover;
  }
  .fnc-slide__heading-line strong {
    font-weight: 500;
    font-size: 18px;
  }
  .fnc-slide__heading-line h1 {
    font-size: 30px;
    margin-bottom: -2%;
  }
  .fnc-slide__action-btn {
    width: 125px;
    height: 35px;
    padding: 0px 5px;
    font-size: 10px;
    margin-bottom: 30px;
    margin-right: 20px;
    display: flex;
    align-items: center;
  }
  .thubmnail-img {
    height: 42px;
    width: 42px;
    border-radius: 10px;
    background: #f2edff;
    object-fit: contain;
    padding: 5px;
  }
  .about-section p {
    text-align: justify;
    font-size: 12px;
  }
  .fnc-slide__action-btn span {
    line-height: 35px;
  }
  .fnc-slide__action-btn span:after {
    line-height: 35px;
  }
  .slider-area {
    position: relative;
    height: 460px;
    perspective: 1500px;
    background: #000;
  }
  .menu-link {
    padding: 5px 8px;
    font-size: 10px;
    display: flex;
    justify-content: space-between;
    border-radius: 4px;
    margin-bottom: 3px;
    font-weight: 600;
    width: 95px;
    height: 30px;
    align-items: center;
  }
  .border-link i {
    color: rgba(0, 0, 0, 0.81);
    font-size: 15px;
    margin-left: 12px;
  }
  .border-link {
    border: 1px solid rgba(0, 0, 0, 0.81);
  }
  .header .mobile-menu-trigger {
    display: flex;
    height: 30px;
    width: 20px;
    margin-left: 0px;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    right: 27px;
    position: absolute;
    top: -3px;
  }
  .header {
    box-shadow: 0px 5px 8px 3px rgba(0, 0, 0, 0.3);
    display: block;
    width: 100%;
    position: relative;
    z-index: 99;
    padding: 0px 15px;
    direction: rtl;
    background: transparent;
    height: 75px;
  }
  .menu-link span {
    margin-bottom: 2px;
  }
  .AppFormLeft {
    padding: 20px;
  }
  .product-title h2 {
    font-size: 24px;
    margin-left: 20px;
  }
  .AppForm .AppFormLeft a {
    font-size: 11px;
  }
  .sett-height strong {
    font-size: 11px;
  }
  .sign-btn {
    font-size: 18px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .w-video-box {
    display: flex;
    justify-content: center;
    margin-top: 15px;
  }
  .course-page-header {
    margin-top: 125px;
    height: 850px;
    margin-bottom: 40px;
    direction: rtl;
    padding: 20px 50px;
  }
  .course-caption {
    width: 100%;
    padding-left: 0px;
  }
  .course-star {
    padding-right: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .cart-wrappering {
    margin-bottom: 35px;
    height: 15rem !important;
    padding: 15px 10px;
  }
  .cart-big-wrapping {
    height: 17rem !important;
  }
  .gray-box {
    height: 35px;
    top: -24px;
    padding: 0px 72px;
  }
  .about-us-section {
    background-position: center;
    padding: 20px 20px;
    height: 860px;
    direction: rtl;
    align-items: center;
    display: flex;
    justify-content: space-around;
    margin-bottom: 20px;
  }
  .main-container {
    max-width: 94vw;
  }
  .main-slider-slide {
    height: 250px;
  }
  .logo {
    height: 50px;
    width: 185px;
    object-fit: contain;
    margin-right: -32px;
    margin-top: 8px;
  }
  .carousel-control-next-icon, .carousel-control-prev-icon {
    height: 1.3rem;
  }
  .main-slider {
    margin-top: 122px;
  }
  .header .mobile-menu-trigger {
    display: flex;
    height: 30px;
    width: 20px;
    margin-left: 0px;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    right: 5px;
    position: absolute;
    top: 18px;
  }
  .header .item-right {
    align-items: flex-end;
    position: relative;
    top: -60px;
    display: flex;
    flex-direction: column;
    flex-direction: column-reverse;
    padding-left: 30px;
  }
  .header .item-left, .header .item-right {
    flex: 0 0 100%;
  }
  .plan-header-row {
    display: flex;
    height: 640px;
    direction: rtl;
    text-align: right;
    align-content: center;
    padding: 10px 80px;
  }
  .plan-header-row h2 {
    font-size: 26px;
  }
  .buy-package strong {
    font-size: 18px;
  }
  .buy-package {
    margin-right: 5px;
    height: 38px;
    padding: 5px 12px;
    margin-top: 10px;
  }
  .price .title-price {
    font-size: 24px;
  }
  .plan-page-header {
    height: 500px;
    margin-bottom: 50px;
  }
  .plan-svg text {
    font-size: 3rem;
  }
  .coach-profile-img {
    height: 150px;
    width: 150px;
    margin-bottom: 10px;
  }
  .coach-phone-call span {
    font-size: 16px;
    direction: ltr;
  }
  .coach-profile-img::before {
    content: "";
    height: 135px;
    width: 10px;
  }
  .coach-profile-img::after {
    content: "";
    height: 157px;
    width: 10px;
    border-radius: 100px;
    position: absolute;
    bottom: -35px;
    left: 100px;
    z-index: -1;
  }
  .coach-phone-call i {
    height: 30px;
    width: 30px;
    font-size: 16px;
  }
  .coach-name-bar {
    margin-top: 20px;
    font-size: 24px;
    margin-bottom: 10px;
  }
  .wrapp-teacher-profile {
    padding: 35px 10px 0px;
    height: 382px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    top: 30px;
  }
  .all-exercises-row .wrapp-service-cart {
    height: 330px;
  }
  .ecr-content strong {
    font-size: 10px;
    margin-right: 10px;
  }
  .ct-title {
    font-size: 20px;
  }
  .exercise-cover {
    height: 225px;
    width: 100%;
    object-fit: cover;
    border-radius: 10px;
  }
  .wrapp-main-content .wrapp-patern {
    height: 250px;
    width: 100%;
    padding: 12px;
  }
  .about-us-header {
    height: 510px;
  }
  .section-top {
    position: absolute;
    top: -35px;
  }
  .logo {
    height: 44px;
    width: 150px;
  }
  .header {
    box-shadow: 0px 5px 8px 3px rgba(0, 0, 0, 0.3);
    display: block;
    width: 100%;
    position: relative;
    z-index: 99;
    padding: 0px 15px;
    direction: rtl;
    background: transparent;
  }
  .exercies-cart .purple-filter {
    height: 280px;
  }
  .content-title strong {
    font-size: 20px;
  }
  .caption-cart h4 {
    font-size: 18px;
    height: 40px;
    overflow: hidden;
  }
  .header-title-2 {
    font-size: 32px;
    margin-top: 90px;
  }
  .blog-card {
    margin-top: 0px;
    background: #fff;
    border-radius: 8px;
    height: 330px !important;
    overflow: hidden;
  }
  .gallery-section {
    position: relative;
    height: 520px;
    overflow: hidden;
  }
  .slider-area {
    position: relative;
    height: 480px;
    padding-top: 100px;
  }
  .fnc-slider {
    height: 390px;
  }
  .fnc-slider__slides {
    position: relative;
    height: 390px;
    transition: transform 1s 0.6666666667s;
  }
  .fnc-slide__inner {
    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
    background-size: cover;
    background-position: center top;
    transform: translate3d(0, 0, 0);
    padding-top: 2%;
  }
  .AppForm .AppFormRight {
    height: 578px;
    padding: 0px !important;
  }
  .FormRight-img {
    height: 600px !important;
  }
  .sign-in-form {
    min-height: 550px;
  }
  .sign-btn {
    font-size: 18px;
  }
  .group-exercises-header {
    height: 400px;
  }
  .back-header {
    position: absolute;
    top: -20px;
    height: 160px;
    background-size: cover;
  }
  .back-header-1 {
    height: 320px;
  }
  .information-box .info-title {
    font-size: 16px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .level-sort-areas {
    padding: 0px;
    border: 0.5px solid rgba(17, 17, 17, 0.12);
    height: 240px;
  }
  .wrapp-course-captions p {
    font-size: 12px;
    font-weight: 500;
    line-height: 24px;
    text-align: justify;
    height: 145px;
    overflow: hidden;
  }
  .back-header {
    position: absolute;
    top: -20px;
    height: 160px;
    background-size: cover;
  }
  .back-header-1 {
    height: 300px;
  }
  .information-box .info-title {
    font-size: 16px;
  }
  .course-caption p {
    font-size: 12px;
    line-height: 20px;
  }
  .course-qty .course-qty-box span {
    font-size: 12px;
    margin-bottom: 5px;
  }
  .course-qty .course-qty-box strong {
    font-size: 12px;
  }
  .course-page-header {
    margin-top: 110px;
    height: 730px;
    margin-bottom: 40px;
    direction: rtl;
    padding: 0px 20px;
  }
  .course-name {
    font-size: 24px;
    margin-bottom: 8px;
  }
  .course-sumbit-btn {
    font-size: 20px;
    padding: 5px 15px;
    border-radius: 4px;
    margin: 10px 0;
  }
  .blog-title {
    padding-right: 20px;
  }
  .see-all-btn {
    background: #ffca1e;
    padding: 2px 10px;
    font-size: 18px;
  }
  .blog-name {
    font-size: 26px !important;
    margin: 5px 0px;
    margin-top: 0px;
    padding-bottom: 30px;
    margin-bottom: 24px;
    color: #000;
  }
  .about-count-box {
    padding: 10px 15px;
    margin: 8px 0px;
    height: 50px;
  }
  .cart-title p {
    font-size: 12px;
  }
  .blog-link-small {
    padding: 2px 12px;
    padding-left: 10px;
    display: flex;
    margin-top: 0px;
    font-size: 12px;
  }
  .small-blog-caption p {
    font-size: 12px;
    line-height: 20px;
  }
  .header .menu > ul > li > a {
    line-height: 0px;
    height: 50px;
    padding: 0 20px 0 15px;
    background: #ededed;
    margin: 5px 5px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
  }
  .header .menu > ul > li > a:hover i {
    background-color: #ffca1e;
    font-weight: 700;
  }
  .header .menu > ul > li {
    padding: 0px 8px;
  }
  .wrapp-title h3 {
    font-size: 24px;
  }
  .wrapp-title h3 span {
    font-weight: 800;
    font-size: 24px;
  }
  .blog-margins {
    padding: 10px 20px;
  }
  .cart-big-wrapping {
    height: 16.5rem !important;
  }
  .footer-widget ul li a {
    font-size: 12px;
  }
  .about-us-section {
    background-position: center;
    padding: 50px 40px;
    height: 720px;
    direction: rtl;
    align-items: stretch;
    display: flex;
    justify-content: space-around;
    margin-bottom: 20px;
  }
  .about-count-box strong {
    font-size: 12px;
  }
  .wrapp-about-section p {
    font-size: 13px;
    text-align: justify;
    direction: rtl;
  }
  .about-us-vector {
    height: 120px;
    margin-bottom: 15px;
  }
  .about-count-box span {
    font-size: 20px;
    color: #000;
    margin-left: 5px;
  }
  .main-slider-slide {
    height: 200px;
  }
  .header .mobile-menu-trigger {
    display: flex;
    height: 28px;
    width: 18px;
    margin-left: 0px;
    right: 18px;
    position: absolute;
    top: 18px;
  }
  .main-slider {
    margin-top: 120px;
    padding: 0px !important;
    border-radius: 12px;
  }
  .header .item-right {
    align-items: flex-end;
    position: relative;
    top: -62px;
    display: flex;
    flex-direction: column;
    flex-direction: column-reverse;
  }
  .header .item-left, .header .item-right {
    flex: 0 0 100%;
  }
  .sett-position {
    top: 20px !important;
  }
  .plan-header-row {
    display: flex;
    height: 640px;
    direction: rtl;
    text-align: right;
    align-content: center;
    padding: 10px 80px;
  }
  .plan-header-row h2 {
    font-size: 26px;
  }
  .buy-package strong {
    font-size: 18px;
  }
  .buy-package {
    margin-right: 5px;
    height: 38px;
    padding: 5px 12px;
    margin-top: 10px;
  }
  .price .title-price {
    font-size: 24px;
  }
  .plan-page-header {
    height: 500px;
    margin-bottom: 50px;
  }
  .plan-svg text {
    font-size: 3rem;
  }
  .plan-svg {
    top: -115px;
    left: -150px;
  }
  .coach-profile-img {
    height: 180px;
    width: 180px;
    margin-bottom: 10px;
  }
  .wrapp-main-content {
    padding: 15px 25px;
  }
  .wrapp-main-content .wrapp-patern {
    height: 330px;
  }
  .wrapp-main-content .exercise-cover {
    height: 318px;
    width: 100%;
    object-fit: cover;
  }
  .wrapp-main-content .cover-part {
    padding: 20px 20px;
  }
  .wrapp-class-details-option strong {
    font-size: 12px;
  }
  .wrapp-class-details-option i {
    font-size: 16px;
  }
  .group-exercises-header {
    height: 400px;
  }
  .wrapp-heaader-top i {
    font-size: 16px;
    margin-left: 2px;
  }
  .logo {
    height: 44px;
    width: 150px;
  }
  .header {
    box-shadow: 0px 5px 8px 3px rgba(0, 0, 0, 0.3);
    display: block;
    width: 100%;
    position: relative;
    z-index: 99;
    padding: 0px 15px;
    direction: rtl;
    background: transparent;
  }
  .gallery-section {
    position: relative;
    height: 545px;
    overflow: hidden;
  }
  .FormRight-img {
    height: 265px !important;
    background-image: url(../../assets/images/Services/slider-1.jpg) !important;
    background-size: cover;
    background-position: center;
    border-radius: 10px !important;
  }
  .AppForm .AppFormRight {
    top: 20px;
    border-radius: 10px !important;
  }
  .sett-padding-button {
    padding: 20px;
  }
  .AppForm .AppFormRight {
    height: 280;
    position: relative;
    top: -10px;
    border-radius: 10px !important;
  }
  .about-us-header {
    height: 355px;
    background-size: cover;
  }
  .section-top {
    position: absolute;
    top: -23px;
  }
  .info-icon-holder {
    height: 75px;
    width: 75px;
    object-fit: contain;
    padding: 14px;
    background-size: 75px;
  }
  .about-info p {
    font-size: 11px;
    margin-top: 15px;
    margin-bottom: 0px;
    line-height: 20px;
  }
  .wrapp-all-header h1 {
    margin-top: 120px;
    font-size: 25px;
  }
  .cart-wrappering {
    height: 15rem;
  }
}
/*iphone 6*/
@media (max-width: 576px) {
  .wrapp-course-captions p {
    font-size: 12px;
    font-weight: 500;
    line-height: 24px;
    text-align: justify;
    height: 145px;
    overflow: hidden;
  }
  .additional-info .mb-3 {
    margin-bottom: 0px !important;
  }
  .currency {
    display: none;
  }
  .wrapp-numbers {
    display: flex;
    padding: 5px;
    margin-bottom: 10px;
  }
  .wrapp-numbers strong {
    font-size: 16px;
  }
  .wrapp-numbers span {
    font-size: 26px;
    color: #003ad6;
  }
  .wrapp-numbers h3 {
    font-size: 16px;
  }
  .course-qty {
    margin-top: 10px;
    display: flex;
  }
  .course-name {
    font-size: 22px;
    margin-bottom: 10px;
  }
  .blog-title {
    padding-right: 25px;
  }
  .btn-area {
    padding-left: 25px;
  }
  .course-qty .course-qty-box span {
    font-size: 12px;
    margin-bottom: 5px;
  }
  .course-qty .course-qty-box strong {
    font-size: 12px;
  }
  .see-all-btn {
    border-radius: 6px;
    padding: 2px 8px;
    font-size: 16px;
    height: 35px;
  }
  .course-main-details {
    margin-top: 0px;
  }
  .information-icon {
    height: 28px;
    width: 28px;
  }
  .course-caption {
    width: 100%;
    padding-left: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .course-caption p {
    font-size: 10px;
  }
  .course-caption-area {
    margin-top: 15px;
  }
  .wrapp-level-box ul {
    padding-right: 22px;
    margin-top: 8px;
    height: 75px;
  }
  .few-padding {
    padding: 20px 35px;
  }
  .wrapp-course-captions h2 {
    font-size: 1rem;
    margin: 0;
  }
  .wrapp-level-box h4 {
    font-size: 14px;
  }
  .wrapp-level-box li {
    font-size: 13px;
    margin-bottom: 0.5em;
    list-style-type: none;
    padding: 0.25em 0 0 2.5em;
  }
  .panel-btn {
    font-size: 14px;
  }
  .accordion-body {
    font-size: 13px;
    text-align: justify;
  }
  .accordion-button {
    padding: 15px 10px;
  }
  .wrapp-level-box .level-btn {
    height: 35px;
    padding: 0px 8px;
    margin-top: 5px;
  }
  .information-banner {
    height: 280px;
    width: 100%;
  }
  .strong-margin {
    margin-top: 10px;
  }
  .course-title-area {
    padding: 0px;
    margin-bottom: 10px;
  }
  .course-title-area h5 strong {
    font-size: 22px;
  }
  .wrapp-course-captions a, .wrapp-course-captions p {
    font-size: 12px;
  }
  .course-caption-details {
    padding: 0px 10px;
  }
  .course-title-area h5 {
    font-size: 22px;
  }
  .course-caption-details h3 {
    font-size: 22px;
    margin-bottom: 0px;
  }
  .course-caption-img {
    height: 200px;
    width: 100%;
    border-radius: 6px;
  }
  .information-box .info-title {
    font-size: 19px;
  }
  .course-info-boxes {
    height: 280px;
  }
  .information-box {
    padding: 5px 15px;
  }
  .courses-post {
    margin-bottom: 10px;
    display: flex;
    justify-content: center;
    margin-top: 10px;
  }
  .course-qty .course-qty-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .breadcrumb ul {
    padding: 0px 0px;
  }
  .course-page-header {
    margin-top: 110px;
    height: 630px;
    margin-bottom: 40px;
    direction: rtl;
    padding: 0px 20px;
  }
  .course-sumbit-btn {
    font-size: 20px;
    padding: 2px 15px;
    margin: 0px 0;
  }
  .see-all-btn i {
    font-size: 15px;
    margin-right: 10px;
  }
  .footer-design {
    margin-top: 40px;
  }
  .blog-name {
    font-size: 16px !important;
    margin-top: 0px;
  }
  .small-blog-caption p {
    font-size: 11px;
    line-height: 20px;
  }
  .small-blog-caption h4 {
    font-size: 20px !important;
    margin: 4px 0px;
    margin-top: -4px;
  }
  .blog-link-small {
    padding: 0px 12px;
    margin-top: 0px;
    font-size: 12px;
  }
  .blog-link-small .blog-date i {
    font-size: 14px;
    margin-left: 2px;
  }
  .blog-link-small .blog-date strong {
    font-size: 16px;
  }
  .blog-link-small .blog-date span {
    margin-right: 2px;
    font-size: 12px;
  }
  .blog-link-small i {
    margin-right: 2px;
    font-size: 14px;
  }
  .about-us-section {
    background-position: center;
    padding: 50px 40px;
    height: 720px;
    direction: rtl;
    align-items: stretch;
    display: flex;
    justify-content: space-around;
    margin-bottom: 20px;
  }
  .about-count-box strong {
    font-size: 12px;
  }
  .wrapp-about-section p {
    font-size: 13px;
    text-align: justify;
    direction: rtl;
  }
  .cart-title p {
    font-size: 12px;
  }
  .carousel__item-head .skill-icon-header {
    width: 50px;
  }
  .about-count-box {
    padding: 10px 5px;
    margin: 12px 0px;
    height: 48px;
  }
  .cart-wrappering {
    margin-bottom: 35px;
    height: 14rem;
    padding: 15px 10px;
  }
  .cart-wrappering.cart-big-wrapping {
    height: 14rem;
  }
  .see-all-btn i {
    font-size: 15px;
    margin-right: 10px;
  }
  .about-us-vector {
    height: 120px;
    margin-bottom: 15px;
  }
  .about-count-box span {
    font-size: 20px;
    color: #000;
    margin-left: 5px;
  }
  .main-slider-slide {
    height: 200px;
  }
  .header .mobile-menu-trigger {
    display: flex;
    height: 28px;
    width: 18px;
    margin-left: 0px;
    right: 18px;
    position: absolute;
    top: 18px;
  }
  .cart-wrappering {
    height: 12rem;
  }
  .cart-wrappering .cart-img {
    height: 110px;
  }
  .cart-wrappering i {
    margin: 0px 4px;
    font-size: 14px;
  }
  .cart-wrappering .w-absolute {
    height: 70px;
  }
  .cart-wrappering .w-see-course {
    padding: 5px;
    font-size: 10px;
  }
  .name-course {
    margin-top: 5px !important;
    font-size: 13px;
  }
  .categories-title {
    padding: 0px 15px;
  }
  .categories-title h3 {
    font-size: 22px;
  }
  .categories-title strong {
    font-size: 12px;
  }
  .main-slider-slide {
    height: 165px;
  }
  .carousel-control-next-icon, .carousel-control-prev-icon {
    height: 1rem;
  }
  .main-slider {
    margin-top: 125px;
    border-radius: 10px;
  }
  .logo {
    height: 41px;
    width: 118px;
    margin-top: -4px;
    position: relative;
    top: 13px;
  }
  .header .mobile-menu-trigger {
    display: flex;
    height: 30px;
    width: 18px;
    margin-left: 0px;
    right: 18px;
    position: absolute;
    top: 18px;
  }
  .header .item-left, .header .item-right {
    flex: 0 0 100%;
  }
  .header .item-right {
    top: -50px;
  }
  .exercise-thumbnail-caption h4 {
    font-weight: 800;
    font-family: KalamehWeb;
    font-size: 14px;
  }
  .exercise-thumbnail-caption p {
    font-size: 12px;
  }
  .purple-section {
    background-image: none;
  }
  .exercise-thumbnail {
    height: 65px;
    width: 85px;
    object-fit: cover;
    border-radius: 10px;
  }
  .exercise-box {
    height: 85px;
    padding: 10px;
    border-radius: 10px;
    margin-top: 12px;
    margin: 5px;
    width: 47%;
  }
  .package-icon {
    padding: 4px;
    height: 35px;
    width: 35px;
    margin-bottom: 5px;
  }
  .packages-box:hover {
    background-size: cover;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
  }
  .packages-box:hover h3 {
    display: none;
  }
  .packages-box:hover .package-icon {
    display: none;
  }
  .packages-box h3 {
    font-size: 14px;
  }
  .packages-box a {
    padding: 2px 4px;
    border-radius: 4px;
    padding-right: 4px;
    margin-top: 5px;
    font-size: 10px;
    font-weight: 600;
  }
  .packages-box-1 {
    width: 10em;
    height: 10em;
  }
  .packages-box {
    width: 10em;
    height: 10em;
  }
  .buy-package strong {
    font-size: 16px;
  }
  .buy-package {
    margin-right: 5px;
    height: 38px;
    padding: 2px 12px;
    border-radius: 6px;
    margin-top: 10px;
    z-index: 10;
  }
  .sett-topping-space {
    margin-top: -30px;
    padding-right: 20px;
  }
  .plan-header-row h2 {
    font-size: 22px;
  }
  .price .title-price {
    font-size: 22px;
  }
  .price .del-price {
    margin-right: 10px;
    font-size: 18px;
  }
  .d-top,
  .d-bottom {
    opacity: 0;
    letter-spacing: 4px;
  }
  .present-way strong {
    font-size: 20px;
  }
  .plan-page-header {
    height: 450px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: right;
    margin-bottom: 50px;
  }
  .plan-header-row {
    display: flex;
    height: 540px;
    padding: 22px;
    padding-top: 25%;
  }
  .plan-svg text {
    font-size: 2.2rem;
  }
  .plan-svg {
    top: -87px;
    left: -9px;
  }
  .wrapp-patern .silver-plan {
    width: 122px;
    padding: 10px;
    font-size: 15px;
    left: 4px;
    top: 45px;
  }
  .wrapp-patern .gold-plan {
    width: 122px;
    padding: 10px;
    font-size: 15px;
    left: 4px;
    top: 45px;
  }
  .wrapp-patern .silver-plan {
    width: 122px;
    padding: 10px;
    font-size: 15px;
    left: 4px;
    top: 45px;
  }
  .sett-position {
    top: 15px !important;
  }
  .animated-success .checkmark {
    width: 40px;
    height: 40px;
    top: 0px;
    right: 0px;
    margin: 0px !important;
  }
  .alert-body h3 {
    font-size: 18px;
  }
  .animated-faild .ui-error {
    height: 42px;
    width: 42px;
  }
  .message-alert {
    padding: 10px;
    margin: 20px 0px;
  }
  .option-header {
    width: 100%;
    margin: 5px 0;
  }
  .records p i {
    font-size: 14px;
  }
  .coach-icon {
    height: 45px;
    width: 45px;
  }
  .records p .numbers {
    font-size: 18px;
  }
  .records .qty {
    font-size: 18px;
  }
  .coach-name-title h3 {
    font-size: 14px;
  }
  .content-title strong {
    font-size: 20px;
  }
  .breadcrumb ul li {
    font-size: 14px;
    margin: 0px 5px;
  }
  .header-title-2 {
    font-size: 24px;
    padding: 10px 20px;
    border-radius: 22px;
    margin-top: 90px;
  }
  .all-exercises-row {
    margin: 15px;
    top: -100px;
    padding: 30px 15px;
  }
  .coach-profile-img {
    height: 160px;
    width: 160px;
    margin-bottom: 10px;
  }
  .wrapp-main-content {
    padding: 15px 25px;
  }
  .wrapp-main-content .wrapp-patern {
    height: 280px;
    padding: 20px;
  }
  .wrapp-main-content .exercise-cover {
    height: 245px;
    width: 100%;
    object-fit: cover;
    border-radius: 4px;
  }
  .wrapp-main-content .exercise-cover img {
    border-radius: 4px;
  }
  .wrapp-main-content .cover-part {
    padding: 0px 20px;
  }
  .wrapp-class-details-option strong {
    font-size: 12px;
  }
  .wrapp-class-details-option i {
    font-size: 16px;
  }
  .flex-header {
    padding: 10px 20px;
  }
  .button-filters .filter-select {
    height: 50px;
    border: 1px solid #eee !important;
    background: #fff !important;
    margin-bottom: 18px;
    font-size: 12px;
    font-weight: 600;
    border-radius: 10px;
    margin-top: 8px !important;
    margin-right: 8px;
    padding: 0px 15px;
  }
  .button-filters .search-filter {
    border: 1px solid #eee !important;
    border-radius: 12px;
    height: 50px;
  }
  .button-filters .filter-abs-icon {
    font-size: 23px;
    left: 25px;
    top: 16px;
    font-weight: 500;
  }
  .button-filters .search-filter .input-group button {
    top: 0px;
    left: -12px;
  }
  .coach-cart .coach-img .wra-scale {
    height: 215px;
    top: -30px;
  }
  .coach-cart .coach-img {
    width: 100%;
    border-radius: 10px;
    object-fit: cover;
    height: 220px;
    position: relative;
    top: 0px;
  }
  .wrapp-all-header h1 {
    margin-top: 120px;
    font-size: 25px;
  }
  .coach-row {
    padding: 10px 20px;
    margin-top: 50px;
  }
  .coach-cart-content .coach-name-cart {
    font-size: 22px;
    text-align: center;
    margin-top: -20px;
    height: 35px;
    overflow: hidden;
  }
  .coach-cart {
    position: relative;
    padding: 0px 15px;
    height: 385px;
  }
  .info-icon-holder {
    height: 55px;
    width: 55px;
    object-fit: contain;
    padding: 8px;
    background-size: 50px;
  }
  .about-info p {
    font-size: 11px;
    margin-top: 15px;
    margin-bottom: 0px;
  }
  .about-us-header {
    height: 280px;
    background-size: cover;
  }
  .wrapp-gym-plan-box {
    height: 130px;
    justify-content: space-between;
    flex-direction: row-reverse;
    margin-bottom: 20px;
  }
  .gym-box-content {
    padding: 20px;
    width: 64%;
    direction: rtl;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .img-gym-box {
    width: 35%;
    height: 130px;
    border-radius: 4px;
  }
  .wrapp-about-item h3 {
    font-size: 13px;
    margin-bottom: 5px;
  }
  .about-vector-holder::before {
    content: "";
    position: absolute;
    right: 50px;
    bottom: 10px;
    height: 32px;
    width: 8%;
    z-index: 10000;
    border-right: 2px solid #ffca1e;
    border-bottom: 2px solid #5f23f2;
  }
  .about-vector-holder::after {
    content: "";
    position: absolute;
    left: 70px;
    top: 8px;
    height: 32px;
    width: 8%;
    z-index: 10000;
    border-left: 2px solid #ffca1e;
    border-top: 2px solid #5f23f2;
  }
  .section-top {
    position: absolute;
    top: -19px;
  }
  .AppForm .AppFormRight h2 {
    z-index: 1;
    color: #ffffff;
    font-size: 35px;
  }
  .AppForm .AppFormRight p strong {
    direction: rtl;
    font-size: 12px;
  }
  .AppForm .form-feild {
    border-radius: 2px;
    background: #f2f1ff;
    border: none;
    height: 42px;
    padding: 2px 40px;
  }
  .AppFormLeft strong {
    font-size: 14px;
  }
  .gym-vector-img {
    height: 120px;
    width: 125px;
    object-fit: contain;
    position: relative;
    right: 0;
    top: -20px;
    z-index: 1000000;
  }
  .sign-in-form {
    min-height: 610px;
    display: flex;
    flex-direction: column-reverse;
  }
  .sign-form-header {
    height: 150px;
  }
  .FormRight-img {
    height: 185px !important;
  }
  .class-time-details p {
    padding: 0px 0px;
    width: fit-content;
  }
  .logo {
    height: 44px;
    width: 140px;
    margin-top: -4px;
  }
  .wrapp-heaader-top strong {
    color: white;
    font-size: 2px;
    display: none;
  }
  .header {
    box-shadow: 0px 5px 8px 3px rgba(0, 0, 0, 0.3);
    display: block;
    width: 100%;
    position: relative;
    z-index: 99;
    padding: 0px 15px;
    direction: rtl;
    background: transparent;
  }
  .appform-height {
    min-height: max-content !important;
    display: flex;
    height: max-content;
    flex-direction: column-reverse;
  }
  .AppForm .AppFormRight {
    height: 170px;
    background-size: cover;
    background-position: center;
    position: relative;
    top: -38px;
    border-radius: 10px !important;
  }
  .AppFormLeft .col-lg-6.mb-5 {
    margin-bottom: 1rem !important;
  }
  .AppFormLeft .form-group.position-relative.mb-4 {
    margin-bottom: 1rem !important;
  }
  .AppFormLeft .linear-bg {
    display: none;
  }
  .sett-height .col-md-6 {
    width: 50% !important;
  }
  .checkbox-custom + .checkbox-custom-label:before {
    display: inline-block;
    vertical-align: middle;
    width: 18px;
    height: 18px;
    padding: 2px;
    margin-left: 6px;
    text-align: center;
  }
  .AppFormLeft {
    width: 85%;
  }
  .group-exercises-header {
    height: 300px;
  }
  .button-filters {
    position: relative;
  }
  .spacer-rows {
    margin-top: 0px;
  }
  .course-count {
    padding: 0px 10px;
    margin-left: 5px;
    height: 20px;
    display: flex;
    align-items: center;
    border: none !important;
    border-radius: 10px;
    position: absolute;
    top: -35px;
    right: 20px;
  }
  .course-count span {
    font-size: 12px;
  }
  .course-count strong {
    font-size: 12px;
  }
  .course-count i {
    display: none;
  }
  .category-body {
    margin-bottom: 5px;
    padding: 0px 15px;
    margin-top: 5px;
  }
  .header-price-filter {
    padding: 0.4rem 0.8rem;
  }
  .accordion-button.filter-hd {
    padding: 0.8rem 0.8rem !important;
  }
  .cc-text {
    font-size: 12px !important;
  }
  .header-price-filter p {
    font-size: 12px;
  }
  .childs-link,
  .tree-view-title {
    font-size: 12px;
  }
  .checkbox-custom:checked + .checkbox-custom-label:before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 12px;
    border: solid #ffca1e;
    border-width: 0 3px 3px 0;
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    border-radius: 0px;
    margin: 0px 2px 5px 20px;
  }
  .parent,
  .each-childs {
    height: 40px;
    display: flex;
    align-items: center;
    width: 100%;
  }
  .plan-caption .btn-holder a {
    font-size: 12px;
    padding: 3px 8px;
    border-radius: 5px;
    margin-top: 5px;
    font-size: 9px;
  }
  .medium-margin-bottom {
    margin-bottom: 50px;
    display: flex;
    flex-direction: column;
  }
  .group-first {
    margin-bottom: 25px;
    height: 225px;
    background-color: #fff;
    background-position: top left;
    background-repeat: no-repeat;
    justify-content: space-between;
    align-items: flex-start;
    padding: 10px 12px;
    flex-direction: column;
  }
  .exercise-cover-thub {
    height: 90px;
    width: 120px !important;
    object-fit: cover;
    border-radius: 8px;
  }
  .group-first .exercise-caption-sm p {
    font-size: 11px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    text-align: justify;
    -webkit-box-orient: vertical;
    overflow: hidden;
    line-height: 20px;
    margin-top: 0px;
  }
  .btn-holder-exc {
    height: 100%;
    display: flex;
    align-items: flex-end;
    padding-bottom: 0px;
    justify-content: flex-end;
    width: 100%;
  }
  .group-first .exercise-caption-sm .exercises-name-sm {
    display: flex;
    align-items: center;
    font-size: 17px;
    height: 32px;
    margin-top: 5px;
    overflow: hidden;
  }
  .medium-margin-bottom {
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
  }
  .wrapp-contact-right-box {
    padding: 20px;
  }
  .contact-wrapper p {
    font-size: 12px;
    line-height: 22px;
    text-align: justify;
  }
  .contact-option-header {
    margin-top: 10px;
  }
  .copyright-text p {
    margin: 0;
    font-size: 12px;
  }
  .contact-us-header {
    height: 322px;
    align-items: center;
    background-position: center;
  }
  .contact-option-header h4 {
    font-size: 20px;
  }
  .contact-option-header .linear-bg-mini {
    width: 45%;
    padding-left: 25px;
  }
  .contact-section h3 {
    font-size: 20px;
    margin-bottom: 2px;
  }
  .contact-us-head h2 {
    font-size: 22px;
  }
  .contact-form-holder .mt-3 {
    margin-top: 5px !important;
  }
  .contact-form-holder label {
    margin-top: -20px;
  }
  .contact-form-holder .comment-btn {
    font-size: 14px;
    padding: 5px 32px;
    border-radius: 4px;
  }
  .contact-us-head p {
    font-size: 14px;
    margin-bottom: 10px;
    margin-right: 0px;
  }
  .contact-option-content p {
    font-size: 12px;
    margin-bottom: -3px;
  }
  .contact-option-header h4 i {
    font-size: 15px;
  }
  .contact-wrapper p {
    text-align: justify;
  }
  .contact-option-content a {
    font-size: 13px;
    margin-top: 5px;
  }
  .wrapp-contact-form {
    padding: 40px 25px;
    box-shadow: 0px 1.60568px 5px rgba(0, 0, 0, 0.13);
  }
  .wrapp-contact-form .form-feild {
    border-radius: 5px;
    height: 40px;
    padding: 2px 40px;
  }
  .wrapp-contact-form i.feild-icons {
    right: 13px;
    font-size: 14px;
  }
  input::placeholder {
    font-size: 10px !important;
  }
  input {
    font-size: 10px !important;
  }
  .form-control::placeholder {
    font-size: 12px !important;
  }
  .social-icon-holder {
    font-size: 18px !important;
  }
  .wrapp-contact-form .form-feild-text-area {
    height: 65px;
  }
  .sign-btn {
    border-radius: 4px;
    height: 40px;
    line-height: 40px;
    font-size: 20px;
  }
  .mt-3 {
    padding-top: 12px !important;
  }
  .contact-img {
    height: 75px;
    top: 10px;
  }
  .map-holder-box {
    margin-top: 20px !important;
  }
  .wrapp-contact-form::before {
    left: 6px;
    top: -10px;
    height: 45px;
    width: 10%;
    border-left: 3px solid rgba(0, 0, 0, 0.81);
    border-top: 3px solid rgba(0, 0, 0, 0.81);
  }
  .wrapp-contact-form::after {
    content: "";
    position: absolute;
    right: 6px;
    bottom: -12px;
    height: 45px;
    width: 10%;
    z-index: 10000;
    border-right: 3px solid #ffca1e;
    border-bottom: 3px solid #5f23f2;
  }
  .wrapp-contact-right-box .section-latin-name {
    font-size: 30px;
    margin-bottom: 8px;
  }
  .wrapp-contact-right-box .product-title {
    background-image: url(../../assets/images/vectors/brush.png);
    background-size: 30px;
  }
  .wrapp-all-prurple {
    padding: 10px 20px;
    display: flex;
    align-items: center;
    direction: rtl;
    text-align: right;
    justify-content: center;
  }
  .class-trainer-header {
    height: 450px;
  }
  .header-title {
    font-size: 22px;
    padding: 10px 20px;
    border-radius: 12px;
  }
  .vec-circle {
    top: -150px;
    height: 50px;
    left: 100px;
    width: 50px;
  }
  .wrapp-main-content {
    text-align: right;
    padding: 20px 15px;
  }
  .card-coach {
    height: 280px;
    width: 100%;
    background-size: cover;
  }
  .coach-details {
    z-index: 2;
    position: relative;
    width: 100%;
    border-radius: 100px 50px;
    top: -40px;
    background-color: #fff;
    border-radius: 40px 0px 10px 10px;
    padding: 15px;
    height: 104px;
    box-shadow: 0px 0px 14px 3px rgba(0, 0, 0, 0.07);
    background-image: url(../../assets/images/vectors/shape-26.png);
    background-size: 40px;
    background-repeat: no-repeat;
  }
  .back-header {
    position: absolute;
    top: -20px;
    height: 160px;
    background-size: cover;
  }
  .back-header-1 {
    height: 280px;
  }
  .information-box .info-title {
    font-size: 16px;
  }
  .course-page-header {
    margin-top: 90px;
    height: auto;
    margin-bottom: 40px;
    direction: rtl;
    padding: 0px 20px;
  }
  .bg-head h2 {
    font-size: 24px;
  }
  .branch-wrapper {
    margin-bottom: 20px;
  }
  .branch-wrapper .address span {
    font-size: 11px;
  }
  .branch-wrapper .level-categories {
    font-size: 12px;
  }
  .branch-wrapper h3 {
    font-size: 16px !important;
    font-weight: 700;
  }
  .low-margin {
    margin-top: 10px;
  }
  .contact-us-tltle h5 {
    margin-top: 15px;
    font-size: 25px;
    padding: 0px 5px;
  }
  .social-contact-holder i {
    font-size: 20px;
  }
  .branch-img-wrapp {
    height: 180px;
    top: 0px;
    margin-bottom: 10px;
  }
  .social-contact-holder {
    height: 50px;
    width: 50px;
  }
  .phone-link {
    font-size: 15px;
    margin-bottom: 20px;
    margin-right: 0px;
  }
  .col-12 .mt-5 {
    margin-top: 10px !important;
  }
  .col-12 .mb-5 {
    margin-bottom: 20px !important;
  }
  .branch-wrapper i {
    font-size: 14px;
  }
  .see-more-btn {
    padding: 5px;
    margin: 5px 0px;
  }
  .branch-phone {
    padding: 5px;
    margin: 5px 0px;
  }
  .wrapp-contact-box {
    padding: 15px;
    border-radius: 6px;
    height: 150px;
    margin-top: 10px;
  }
  .wrapp-contact-box h4 {
    font-size: 20px;
    margin-top: 4px;
  }
  .wrapp-contact-box i {
    font-size: 20px;
    width: 40px;
    height: 40px;
  }
  .wrapp-contact-box p {
    font-size: 12px;
  }
  .lg-outer {
    width: 95%;
    height: 78%;
    position: fixed;
    top: 131px;
    left: 8px;
  }
  .show-galley {
    height: 225px !important;
    width: 100% !important;
    object-fit: cover;
    border-radius: 10px;
    position: relative;
    top: -20px;
  }
  .show-images {
    top: -20px;
    padding: 8px 20px;
    right: 18px;
    width: 115px;
    border-radius: 5px;
    font-weight: 600;
    font-size: 14px;
    display: block;
    direction: ltr;
  }
  .signup-form, .signup-image, .signin-form, .signin-image {
    width: 100%;
    overflow: hidden;
  }
  .signup-image {
    margin: 0px 0px;
  }
  .all-course-caption p {
    text-align: justify;
    font-size: 12px;
  }
}
/*iphon 8,X,XS,11,12*/
@media (max-width: 480px) {
  .page-wrapp .cart-wrappering {
    margin-bottom: 35px;
    text-align: right;
    height: 11rem;
    padding: 10px;
  }
  .all-course-caption p {
    text-align: justify;
    font-size: 12px;
  }
  .lost-pass span {
    font-size: 10px;
    font-weight: 500;
  }
  .signup-image figure {
    height: 80%;
    width: 80%;
    display: flex;
  }
  .terms-service {
    margin-right: 18px;
    font-size: 10px;
  }
  .signup-image {
    margin: 0px 0px;
  }
  .signup-form, .signup-image, .signin-form, .signin-image {
    width: 100%;
    overflow: hidden;
  }
  .social-contact-holder {
    margin: 5px;
  }
  .show-galley {
    height: 225px !important;
    width: 100% !important;
    object-fit: cover;
    border-radius: 10px;
    position: relative;
    top: -20px;
  }
  .lg-outer {
    width: 95%;
    height: 78%;
    position: fixed;
    top: 131px;
  }
  .signup-content {
    padding: 5px 10px;
    background: rgb(255, 255, 255);
    border-radius: 8px;
    border: 1px solid #f2f2f2;
    box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  }
  .show-images {
    top: -20px;
    padding: 8px 20px;
    right: 18px;
    width: 115px;
    border-radius: 5px;
    font-size: 14px;
  }
  .contact-form-feild {
    margin: 0;
  }
  .wrapp-contact-box p {
    font-size: 10px;
    line-height: 15px;
  }
  .wrapp-contact-box h4 {
    font-size: 18px;
    margin-top: 8px;
  }
  .page-wrapp .tabs label {
    display: inline !important;
  }
  .back-header {
    position: absolute;
    top: -50px;
    height: 160px;
    background-size: cover;
  }
  .back-header-1 {
    height: 180px;
  }
  .information-box .info-title {
    font-size: 16px;
  }
  .course-page-header {
    margin-top: 90px;
    height: auto;
    margin-bottom: 40px;
    direction: rtl;
    padding: 0px 20px;
  }
  .bg-head h2 {
    font-size: 24px;
  }
  .wrapp-course-captions h4, .wrapp-course-captions h5, .wrapp-course-captions h6 {
    font-size: 20px;
    margin: 2px;
    margin-left: 0.5rem;
  }
  .calender-header .mdi-calendar-multiple-check {
    font-size: 24px;
    font-size: 20px;
    width: 45px;
    height: 45px;
  }
  .wrapp-calender {
    padding: 15px;
    border-radius: 6px;
    height: 185PX;
    margin-top: 10px;
  }
  .wrapp-calender .calender-body p {
    font-size: 14px;
    font-weight: 600;
    height: 50px;
  }
  .course-info-boxes {
    height: 250px;
  }
  .course-caption-img {
    height: 150px;
  }
  .wrapp-level-box h4 {
    font-size: 14px;
  }
  .level-sort-areas {
    height: 190px;
  }
  .wrapp-course-captions a, .wrapp-course-captions p {
    font-size: 12px;
    line-height: 24px;
  }
  .wrapp-level-box li {
    font-size: 13px;
    margin-bottom: 0.5em;
    list-style-type: none;
    padding: 0.1em 0 0 2.5em;
    padding-left: 0;
  }
  .information-box p {
    font-size: 10px;
    line-height: 18px;
  }
  .information-banner {
    height: 145px;
  }
  .blog-link-small {
    padding: 0px 12px;
    margin-top: 0px;
    font-size: 10px;
  }
  .blog-link-small .blog-date i {
    font-size: 12px;
    margin-left: 2px;
  }
  .blog-link-small .blog-date strong {
    font-size: 14px;
  }
  .blog-link-small .blog-date span {
    margin-right: 2px;
    font-size: 10px;
  }
  .blog-link-small i {
    margin-right: 2px;
    font-size: 12px;
  }
  .blog-link .blog-date span {
    font-size: 10px;
  }
  .categories-title strong {
    font-size: 11px;
  }
  .name-course {
    margin-top: 5px !important;
    font-size: 11px;
    line-height: 15px;
    height: 30px;
    font-weight: 600;
  }
  .cart-wrappering {
    height: 10.5rem;
  }
  .about-us-section {
    background-position: center;
    padding: 20px 10px;
    height: 720px;
    direction: rtl;
    align-items: stretch;
    display: flex;
    justify-content: space-around;
    margin-bottom: 20px;
  }
  .about-us-section h3 {
    font-size: 20px;
    margin-bottom: 5px;
  }
  .wrapp-about-section p {
    font-size: 11px;
    text-align: justify;
    direction: rtl;
    line-height: 22px;
  }
  .about-count-box {
    padding: 10px 0px;
    margin: 12px 0px;
    height: 48px;
  }
  .wrapp-static-box .static-box-img {
    height: 50px;
    width: 50px;
    padding: 8px;
  }
  .wrapp-static-box h4 {
    font-size: 11px;
    font-weight: 600;
    margin: 12px 0px;
    line-height: 17px;
  }
  .links-area a {
    font-size: 10px;
    padding: 0px 6px;
    height: 22px;
    display: flex;
    align-items: center;
  }
  .cart-title p {
    font-size: 10px;
  }
  .cart-wrappering {
    padding: 15px 5px;
  }
  .carousel__item-head {
    width: 45px;
    height: 45px;
    padding: 10px;
  }
  .carousel__item-head .skill-icon-header {
    width: 40px;
  }
  .carousel__item-body {
    padding: 12px 16px;
    margin-right: 20px;
  }
  .carousel__item-body p {
    font-size: 17px !important;
  }
  .categories-title h3 {
    font-size: 20px;
  }
  .gray-box {
    height: 35px;
    top: -24px;
    padding: 0px 30px;
  }
  .wrapp-title h3 {
    font-weight: 800;
    font-family: KalamehWeb;
    font-size: 20px;
  }
  .wrapp-title h3 span {
    font-size: 18px;
  }
  .categories-area {
    margin-top: 20px;
  }
  .blog-img-small {
    height: 0px;
    width: 0px;
  }
  .header .item-right {
    top: -35px;
  }
  .colored-link {
    margin-right: 12px;
    background: #ffca1e;
    color: #000;
    font-weight: 600;
  }
  .wrapp-static-box {
    height: 150px;
    border-radius: 8px;
    padding: 5px 10px;
    margin: 5px 5px;
  }
  .cart-wrappering.cart-big-wrapping {
    height: 13.3rem;
  }
  .cart-wrappering .w-see-course {
    padding: 5px;
    background: none;
    font-size: 9px;
  }
  .cart-wrappering i {
    margin: 0px 0px;
    font-size: 12px;
  }
  #blogs-slider {
    margin-top: 20px;
  }
  .packages-box-1 {
    width: 8em;
    height: 8em;
    background-size: 40px;
  }
  .package-icon {
    padding: 4px;
    height: 30px;
    width: 30px;
    margin-bottom: 5px;
  }
  .about-section p {
    font-size: 12px;
    line-height: 24px;
    margin-top: 10px;
  }
  .sett-margin-container {
    margin: 0px 0px;
  }
  .plan-section {
    border-radius: 0;
  }
  .plan-caption h2 {
    font-size: 12px;
    overflow: hidden;
    height: 28px;
    margin-top: 5px;
  }
  .plan-caption p {
    font-size: 9px;
    display: -webkit-box;
    max-width: 280px;
    line-height: 15px;
  }
  .packages-box a {
    padding: 1px 4px;
    border-radius: 4px;
    padding-right: 4px;
    margin-top: 5px;
    font-size: 8px;
    font-weight: 600;
  }
  .packages-box {
    width: 8em;
    height: 8em;
  }
  .packages-box h3 {
    font-size: 12px;
  }
  .header-contex strong {
    font-size: 12px;
    display: flex;
    align-items: center;
    margin-right: 8px;
  }
  .overley-icon {
    height: 35px;
    width: 35px;
    padding: 5px;
    margin-bottom: 15px;
    object-fit: contain;
    position: relative;
    z-index: 100;
  }
  .brushed {
    position: absolute;
    height: 38px;
    width: 38px;
    object-fit: contain;
    top: 12px;
    opacity: 0.6;
  }
  .blog-cart-wrapp-small {
    padding: 15px 10px;
  }
  .card-text {
    font-size: 10px !important;
  }
  .card-link {
    display: flex;
    justify-content: center;
    margin-top: 5px;
    direction: rtl;
    text-align: center;
    background: #f0ebff;
    padding: 2px 8px;
    border-radius: 4px;
    width: max-content;
    color: #000;
    font-weight: 600;
    font-size: 8px;
  }
  .card-body {
    background-size: 25px;
    background-position: bottom left;
  }
  .services-card {
    direction: rtl;
    text-align: right;
    height: 300px;
    padding: 3px;
    border-radius: 10px;
    background-size: 320px;
  }
  .services-over-title {
    font-weight: 600;
    font-size: 12px;
    margin-bottom: 5px;
    font-weight: 600;
    color: #000;
  }
  .plan-card {
    position: relative;
    overflow: hidden;
    height: 170px;
    -webkit-box-shadow: 5px 5px 24px 0px rgba(2, 45, 98, 0.1);
    box-shadow: 5px 5px 24px 0px rgba(2, 45, 98, 0.1);
    border: none;
    margin-bottom: 10px;
    z-index: 1000000;
  }
  .plan-container .wrapp-main-content section p {
    font-size: 10px !important;
  }
  .plan-container .video-part {
    padding: 0px 20px !important;
    padding-left: 20px;
  }
  .plan-container .wrapp-main-content .services-title {
    background-image: url(../../assets/images/vectors/brush.png);
    background-size: 69px;
    padding: 0px 20px;
    height: 24px;
  }
  .plan-container .coach {
    margin: 10px 0;
    background: url(../../assets/images/Services/shape-17.png);
    border-radius: 10px;
    background-position: center;
    padding: 10px;
  }
  .plan-container .mt-4 {
    margin-top: 20px !important;
  }
  .plan-img-holder {
    height: 200px;
  }
  .animated-faild .ui-error {
    height: 35px;
    width: 35px;
  }
  .animated-success .checkmark {
    width: 35px;
    height: 35px;
  }
  .mb-2 {
    margin-bottom: 0px !important;
  }
  .section-title {
    font-size: 20px;
  }
  .title-cell i {
    font-size: 8px;
    margin-left: 3px;
  }
  .title-cell {
    height: 40px;
    padding: 5px;
    border-radius: 4px;
  }
  .title-cell strong {
    font-family: KalamehWeb;
    font-weight: 800;
    font-size: 13px;
  }
  .wrapp-comment-reply-btn a {
    padding: 2px 4px;
    border-radius: 6px;
    display: flex;
    align-items: center;
  }
  .wrapp-ecr-nxt {
    padding: 0px;
    border-radius: 4px;
    margin: 5px 0px;
  }
  .wrapp-comments .wrapp-user-comments .comment-user strong {
    font-size: 8px;
  }
  .owner-comments {
    padding: 8px 5px;
    margin: 10px 8px;
    border-radius: 4px;
  }
  .content-cell {
    height: 40px;
    border-radius: 4px;
    padding: 10px 4px;
    margin: 0px 0px;
  }
  .exercises-header {
    height: 400px;
    background-size: cover;
  }
  .mini-padding {
    padding: 2px !important;
  }
  .accordion-button {
    padding: 10px !important;
    font-size: 11px;
    border-radius: 4px !important;
    margin-bottom: 0px !important;
    margin-top: 0px !important;
  }
  .title-tag {
    font-family: KalamehWeb;
    font-weight: 800;
    font-size: 20px;
  }
  .content-cell strong {
    font-weight: 600;
    font-size: 10px;
  }
  .content-cell i {
    font-size: 8px;
    margin-left: 2px;
  }
  .category-wrapp h6 {
    font-size: 13px;
  }
  .category-wrapp p {
    font-size: 12px;
  }
  .alert-body {
    margin-right: 5px;
  }
  .alert-body p {
    font-size: 10px !important;
  }
  blockquote {
    margin: 10px 0px;
    border-radius: 5px;
    padding: 10px;
    padding-right: 20px;
    font-size: 12px;
    position: relative;
    direction: rtl;
  }
  .link-form {
    display: block;
    height: 22px;
    padding: 2px 9px;
    border-radius: 5px;
    margin-top: 10px;
    font-weight: 600;
    font-size: 10px;
  }
  .records p .numbers {
    font-size: 13px;
  }
  .records .qty {
    font-size: 13px;
  }
  .coach-icon {
    height: 35px;
    width: 35px;
    object-fit: contain;
  }
  .records p i {
    font-size: 12px;
  }
  .coach-vector {
    height: 150px;
  }
  .coach-name-title h3 {
    font-size: 12px;
  }
  .coach-name-title strong {
    font-size: 16px;
    color: #ffca1e;
    font-weight: 600;
  }
  .poster iframe {
    border-radius: 10px;
    z-index: 200;
    height: 192px;
  }
  .cards-holder {
    margin-top: 20px;
  }
  .wrapp-main-content .services-title {
    background-image: url(../../assets/images/vectors/brush.png);
    background-size: 72px;
    padding: 0px 20px;
  }
  .plan-container .cover-part {
    margin-bottom: 10px;
  }
  .wrapp-patern .gold-plan::before {
    content: "";
    position: absolute;
    border-width: 7px;
    border-style: solid;
    left: 1px;
    top: -14px;
  }
  .wrapp-patern .silver-plan::before {
    content: "";
    position: absolute;
    border-width: 7px;
    border-style: solid;
    left: 1px;
    top: -14px;
  }
  .wrapp-patern .basic::before {
    content: "";
    position: absolute;
    border-width: 7px;
    border-style: solid;
    left: 1px;
    top: -14px;
  }
  .shape:after {
    height: 41px;
    position: absolute;
    left: -10px;
    top: 0;
    width: 35px;
  }
  .wrapp-patern .silver-plan {
    width: 66px;
    padding: 3px;
    font-size: 10px;
    left: -7px;
    top: 35px;
  }
  .wrapp-patern .gold-plan {
    width: 66px;
    padding: 3px;
    font-size: 10px;
    left: -7px;
    top: 35px;
  }
  .wrapp-patern .basic {
    width: 66px;
    padding: 3px;
    font-size: 10px;
    left: -7px;
    top: 45px;
  }
  .wrapp-main-content .exercise-cover {
    height: 145px;
  }
  .plan-container .wrapp-main-content .wrapp-patern {
    height: 160px;
    width: 100%;
    padding: 8px;
  }
  .accordion-button:not(.collapsed) {
    border-radius: 6px !important;
    margin: 10px 0px;
  }
  .header-contex::before {
    right: -3px;
    top: -3px;
    height: 23px;
    width: 8%;
    z-index: 10000;
    border-right: 3px solid #ffca1e;
    border-top: 3px solid #ffca1e;
  }
  .header-contex h2 {
    font-size: 16px;
  }
  .header-contex svg {
    position: absolute;
    z-index: 10000;
    top: -5px;
    left: -112px;
    height: 60px;
    width: 215px;
  }
  .header-contex {
    box-shadow: 0px -4px 20px rgba(0, 0, 0, 0.13);
    width: 87%;
  }
  .shape {
    font-size: 18px;
    height: 50px;
    padding: 10px 10px;
    top: 10px;
    width: 100%;
  }
  .plan-page-header {
    height: 385px;
    margin-bottom: 50px;
  }
  .plan-header-row {
    display: flex;
    height: 455px;
    padding: 22px;
    padding-top: 25%;
  }
  .buy-package strong {
    font-size: 14px;
  }
  .buy-package {
    margin-right: 5px;
    height: 35px;
    padding: 2px 12px;
    border-radius: 6px;
    margin-top: 10px;
    z-index: 10;
  }
  .present-way strong {
    font-size: 18px;
  }
  .sett-topping-space {
    margin-top: -30px;
    padding-right: 10px;
  }
  .price .main-price {
    font-size: 15px;
    margin: 0px 5px;
  }
  .price .del-price {
    margin-right: 5px;
    font-size: 15px;
  }
  .price .toman {
    font-size: 18px;
  }
  .price .title-price {
    font-size: 18px;
  }
  .group-first .exercise-group-btn {
    padding: 5px 5px;
    height: 25px;
    border-radius: 4px;
    margin: 0px 5px;
    width: max-content;
  }
  .group-first .exercise-group-btn strong {
    font-size: 10px;
  }
  .group-first .exercise-group-btn i {
    font-size: 17px;
  }
  .medium-margin-bottom {
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
  }
  .plan-request a {
    width: 198px;
    height: 35px;
    display: flex;
    border-radius: 10px;
    align-items: center;
    padding-left: 18px;
    font-size: 12px;
  }
  input[type=checkbox]:not(old) + label {
    display: flex;
    align-items: center;
    line-height: 1.5em;
    font-size: 11px;
    margin-right: 8px;
    font-weight: 600;
    color: #3a3e42;
    font-size: 10px;
    font-size: 11px !important;
  }
  .search-filter .input-group input::placeholder {
    font-size: 12px;
  }
  .padding-carts .plan-cart {
    height: 260px;
    border-radius: 8px;
    margin-top: 15px;
  }
  .coach-cart .coach-img .wra-scale {
    height: 170px;
    top: -30px;
  }
  .all-exercises-header {
    height: 285px;
    margin-bottom: 50px;
    background-position: revert;
    background-size: cover;
  }
  .flex-header {
    padding: 10px 20px;
  }
  .wrapp-about-item h3 {
    font-size: 13px;
    margin-bottom: 5px;
  }
  .coach-row {
    padding: 10px 10px;
    margin-top: 50px;
  }
  .coach-cart {
    padding: 0px 8px;
    height: 343px;
  }
  .coach-cart .coach-img {
    height: 180px;
  }
  .coach-cart-content .coach-category {
    font-size: 12px;
  }
  .section-top {
    position: absolute;
    top: -18px;
  }
  .breadcrumb ul li {
    font-size: 15px;
    margin: 0px 3px;
  }
  .breadcrumb ul li .mdi-home-outline {
    font-size: 16px !important;
  }
  .content-title strong {
    font-size: 20px;
  }
  .all-exercises-row .wrapp-service-cart {
    height: 300px;
  }
  .content-title i {
    font-size: 16px;
  }
  .all-exercises-row {
    top: -70px;
    padding: 20px 5px;
    margin: 5px;
  }
  .exercies-cart .purple-filter {
    height: 250px;
  }
  .exercies-cart .caption-cart {
    height: 130px;
    top: -38px;
  }
  .header-title-2 {
    font-size: 24px;
    padding: 10px 20px;
    border-radius: 22px;
    margin-top: 90px;
  }
  .info-icon-holder {
    height: 55px;
    width: 55px;
    object-fit: contain;
    padding: 8px;
    background-size: 50px;
  }
  .mt-5 {
    margin-top: 1.5rem !important;
  }
  .about-info p {
    font-size: 11px;
    margin-top: 15px;
    margin-bottom: 2px;
    line-height: 20px;
  }
  .topper-space {
    margin-top: 90px;
  }
  .gym-vector-img {
    height: 71px;
    width: 115px;
    right: 0;
    top: -92px;
  }
  .sign-btn {
    font-size: 18px;
  }
  .sett-padding-button {
    background-size: 90px;
  }
  .form-vector-img {
    height: 150px;
    width: 150px;
    right: 0px;
  }
  .AppFormLeft {
    padding: 0px 20px;
    width: 100%;
  }
  .AppFormLeft strong {
    font-size: 12px;
  }
  .class-time-details p {
    padding: 0px 0px;
    width: fit-content;
  }
  .gallery-content .gallery-text {
    display: none;
  }
  .gallery-content .gallery-name {
    font-size: 10px;
    margin: 3px 0;
  }
  .wrapp-heaader-top i {
    color: #ffca1e;
    font-size: 10px;
    margin-left: 0px;
  }
  .wrapp-heaader-top span {
    color: white;
    font-size: 10px;
  }
  .wrapp-heaader-top a {
    color: white;
    font-size: 10px;
    margin: 0px 4px;
  }
  .caption-cart {
    padding: 8px 10px;
  }
  .img-holder {
    height: 155px;
  }
  .date-caption span {
    font-size: 10px;
  }
  .card-coach {
    height: 185px;
    width: 100%;
    background-size: cover;
  }
  .coach-details .coach-name-cart {
    font-size: 18px;
    font-weight: 800;
    font-family: KalamehWeb;
    height: 25px;
  }
  .video-wrapp {
    margin-top: 0px;
    margin-bottom: 40px;
  }
  .video-wrapp .video-cover {
    height: 100%;
    width: 100%;
    border-radius: 8px;
    right: 0;
    top: 0px;
  }
  .video-wrapp .dott-bg {
    height: 45px;
    background-size: 55px;
    margin-top: 0px;
  }
  .circle-two .holder-circle {
    height: 175px;
    width: 235px;
    object-fit: contain;
    transform: rotate(119deg);
  }
  .video-wrapp {
    background-size: 55px;
  }
  .channel-btn {
    padding: 5px 10px;
    font-size: 12px;
  }
  .coach-details .coach-category {
    font-size: 8px;
    margin-top: 5px;
    background-image: none;
    width: 100%;
  }
  .coach-wrapp-details {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    flex-direction: column;
  }
  .coach-details {
    z-index: 2;
    position: relative;
    width: 100%;
    border-radius: 100px 50px;
    top: -40px;
    background-color: #fff;
    border-radius: 40px 0px 10px 10px;
    padding: 9px;
    height: 85px;
    box-shadow: 0px 0px 14px 3px rgba(0, 0, 0, 0.07);
    background-image: url(../../assets/images/vectors/shape-26.png);
    background-size: 28px;
    background-repeat: no-repeat;
  }
  .coach-wrapp-details a i {
    font-size: 12px;
    margin-right: 2px;
  }
  .coach-wrapp-details a {
    padding: 0px 2px;
    border-radius: 4px;
    padding-right: 8px;
    margin-top: 5px;
    font-size: 8px;
    font-weight: 600;
    color: #000;
    height: 17px;
  }
  .caption-cart p {
    font-size: 10px;
    display: -webkit-box;
    max-width: 280px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 40px;
    line-height: 20px;
  }
  .navigate a {
    padding: 2px 4px;
    height: 20px;
    border-radius: 4px;
    font-size: 11px;
    margin-top: 8px;
  }
  .caption-cart h4 {
    font-size: 14px;
    height: 25px;
    overflow: hidden;
  }
  .caption-cart {
    height: 142px;
    z-index: 2;
    top: -42px;
    padding: 8px 8px;
  }
  .product-title h2 {
    font-size: 22px;
    margin-left: 20px;
  }
  .fitness-vector-holder {
    display: none;
  }
  .colored-link i {
    color: rgba(0, 0, 0, 0.81);
    font-size: 14px;
    margin-left: 4px;
    position: relative;
    top: 2px;
  }
  .menu-link {
    padding: 2px 8px;
    font-size: 10px;
    margin-bottom: 3px;
    font-weight: 600;
    width: 95px;
    height: 27px;
    align-items: center;
  }
  .border-link {
    margin-top: 2px;
  }
  .header .item-right {
    padding: 0;
  }
  .about-count-box strong {
    font-size: 10px;
  }
  .header .mobile-menu-trigger {
    right: 0px;
    top: 12px;
  }
  .logo {
    height: 48px;
    width: 90px;
    margin-top: -4px;
    margin-right: 10px;
  }
  .header-item {
    padding-right: 0;
  }
  .plan-caption .btn-holder a {
    font-size: 12px;
    padding: 3px 8px;
    border-radius: 5px;
    margin-top: 5px;
    font-size: 8px;
  }
  .plan-caption strong {
    font-size: 10px;
    margin-bottom: 5px;
  }
  .plan-img {
    height: 100px;
    width: 100%;
    border-radius: 8px 8px 0px 0px;
    object-fit: cover;
  }
  .plan-tag:before {
    height: 0;
    width: 0;
    border: none;
  }
  .exercise-thumbnail {
    height: 38px;
    width: 38px;
    object-fit: cover;
    border-radius: 4px;
  }
  .exercise-thumbnail img {
    border-radius: 6px;
  }
  .wrapp-chevron {
    display: flex;
    align-items: center;
    padding-right: 0px;
  }
  .wrapp-chevron a i {
    font-size: 14px;
    color: #000;
  }
  .exercise-thumbnail-caption {
    margin-right: 0px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 60%;
  }
  .exercise-thumbnail-caption h4 {
    font-weight: 800;
    font-family: KalamehWeb;
    font-size: 12px;
    height: 22px;
  }
  .exercise-thumbnail-caption p {
    font-size: 12px;
  }
  .exercise-thumbnail-caption p {
    font-size: 8px;
    line-height: 15px;
  }
  .exercise-box {
    height: 55px;
    padding: 5px;
    border-radius: 6px;
    margin-top: 12px;
    margin: 2px;
    width: 48%;
    display: flex;
    align-items: center;
  }
  .see-all-exr {
    padding: 2px 5px;
    padding-right: 7px;
    margin-top: 10px;
    font-size: 8px;
    margin-left: 11px;
  }
  .see-all-exr i {
    font-size: 14px;
    top: 0px;
    left: -3px;
  }
  .coach-banner {
    height: 328px;
    width: 330px;
    object-fit: contain;
  }
  .gallery-header h4 {
    font-size: 18px;
  }
  .coaching-content p {
    font-size: 10px;
  }
  .gallery-content .gallery-latin-name {
    font-size: 14px;
    padding-left: 22px;
    height: 15px;
  }
  .coaches {
    border-radius: 0;
  }
  .plan-tag {
    padding: 0px 10px;
    top: 10px;
    left: 9px;
    height: 20px;
    border-radius: 4px;
    line-height: 20px;
  }
  .plan-tag p {
    line-height: 20px;
    font-size: 10px;
  }
  .wrapp-gallery-img {
    height: 125px;
    margin-bottom: 15px;
  }
  .product-details .buy-product img {
    object-fit: contain;
    padding: 5px;
    border-radius: 4px;
    height: 25px;
    width: 30px;
    background-color: rgb(232, 225, 253);
  }
  .bottom-text {
    display: flex;
    justify-content: flex-end;
    width: 200px;
    position: relative;
    top: -20px;
    right: unset;
  }
  .slider-area {
    position: relative;
    height: 380px;
    padding-top: 100px;
    width: 100%;
    overflow: hidden;
  }
  .caption-details {
    padding: 0px 0px;
    display: flex;
    justify-content: space-between;
    direction: rtl;
    align-items: flex-end;
  }
  .navigate a strong {
    color: #000;
    font-weight: 600;
    font-size: 10px;
    line-height: 10px;
  }
  .navigate a {
    padding-left: 6px;
  }
  .wrapp-patern {
    height: 175px;
    width: 100%;
    padding: 0px;
  }
  .wrapp-main-content .wrapp-patern {
    height: 195px;
    width: 100%;
    padding: 8px;
  }
  .wrapp-main-content .exercise-cover img {
    border-radius: 3px;
  }
  .header {
    box-shadow: 0px 5px 8px 3px rgba(0, 0, 0, 0.09);
    display: block;
    width: 100%;
    position: relative;
    z-index: 99;
    padding: 0px 15px;
    direction: rtl;
    background: transparent;
  }
}
@media only screen and (min-width: 360px) and (max-width: 473px) {
  .gallery-content .gallery-text {
    display: none;
  }
  .class-time-details p {
    color: #fff;
    font-weight: 600;
    font-size: 10px;
  }
  .fnc-slide__heading-line strong {
    font-weight: 500;
    font-size: 17px;
    font-family: KalamehWeb;
  }
  .wrapp-heaader-top span {
    color: white;
    font-size: 9px;
  }
  .caption-cart {
    height: 142px;
    z-index: 2;
    top: -42px;
    padding: 8px 8px;
  }
  .services-title h3 {
    font-size: 17px;
    margin-left: 20px;
  }
  .date-caption span {
    font-size: 8px;
  }
}