@charset "UTF-8";
@import url(fontiran.css);
@import url(fontiran.css);
@import url(fontiran.css);
.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.space-top {
  margin-top: 200px;
}

@font-face {
  font-display: swap;
  font-family: iranyekanBakh;
  font-weight: 400;
  src: local("?"), url("/assets/font/fonts/ttf/Yekan-Bakh-FaNum-04-Regular.woff") format("woff");
}
@font-face {
  font-display: swap;
  font-family: iranyekanBakh;
  font-weight: 500;
  src: local("?"), url("/assets/font/fonts/ttf/Yekan-Bakh-FaNum-06-Bold.woff") format("woff");
}
@font-face {
  font-display: swap;
  font-family: iranyekanBakh;
  font-weight: 600;
  src: local("?"), url("/assets/font/fonts/ttf/Yekan-Bakh-FaNum-06-Bold.woff") format("woff");
}
@font-face {
  font-display: swap;
  font-family: iranyekanBakh;
  font-weight: 600;
  src: local("?"), url("/assets/font/fonts/ttf/Yekan-Bakh-FaNum-08-Fat.woff") format("woff");
}
@font-face {
  font-family: LilitaOne;
  src: local("?"), url("/assets/font/fonts/ttf/LilitaOne-Regular.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: Cinema;
  font-weight: 600;
  src: local("?"), url("../../assets/font/fonts/ttf/CinemaFont.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: KalamehWeb;
  font-weight: 500;
  src: local("?"), url("../../assets/font/fonts/ttf/KalamehWeb_Regular.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: IRANYekan;
  font-weight: 500;
  src: local("?"), url("../../assets/font/fonts/ttf/IRANYekanMediumFaNum.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: KalamehWeb;
  font-weight: 600;
  src: local("?"), url("../../assets/font/fonts/ttf/KalamehWeb_Black.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: Sinethar;
  font-weight: 600;
  src: local("?"), url("../../assets/font/fonts/ttf/Sinethar.woff2");
}
@media (min-width: 1400px) {
  .main-container {
    max-width: 90vw;
  }
}
@media (min-width: 1600px) {
  .main-container {
    max-width: 80vw;
  }
}
@media (max-width: 1200px) {
  .main-container {
    max-width: 100%;
  }
}
body {
  font-size: 13px;
  color: rgb(34, 34, 34);
  background: #ffffff;
  font-weight: 400;
  font-family: iranyekanBakh !important;
  overflow-x: hidden;
}

* {
  box-sizing: border-box;
  z-index: auto;
  scroll-behavior: smooth;
}

img {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
}

::-webkit-scrollbar {
  background: #cecece;
  height: 5px;
  width: 8px;
}

::-webkit-scrollbar-thumb {
  background: #278376;
  border-radius: 2px;
}

::-webkit-scrollbar-thumb:hover {
  background: #f7a1ff;
}

a {
  text-decoration: none !important;
  cursor: pointer !important;
}

a:focus,
a:active {
  text-decoration: underline;
  outline: none;
  color: #e4316c;
}

input,
select,
textarea {
  outline: none;
  cursor: pointer;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  margin: 0px;
  appearance: none !important;
}

input:focus,
select:focus,
textarea:focus {
  cursor: pointer;
  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;
}

h2 {
  margin: 0px;
  padding: 0px;
  font-weight: bold;
  color: rgb(34, 34, 34);
  font-size: 36px;
}

figure {
  margin-bottom: 50px;
  text-align: center;
}

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: #000;
}

input:focus::-webkit-input-placeholder {
  color: #000;
}

label {
  display: block;
  margin-bottom: 5px;
  color: #e4316c;
}

textarea {
  color: #000;
}

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: "e";
  width: 100%;
  height: 100%;
  position: absolute;
  font-size: 16px;
  color: green;
}

.breadcrumb {
  color: #000;
  font-size: 16px;
  padding-right: 15px;
}
.breadcrumb a {
  color: #000;
}
.breadcrumb i {
  color: #f1739d;
}
.breadcrumb span {
  color: rgb(226, 193, 255);
  font-weight: 600;
  margin: 0px 8px;
}
.breadcrumb .active {
  color: #f56295;
}

@media (max-width: 800px) {
  .breadcrumb {
    font-size: 12px;
  }
}
.form-control {
  font-family: iranyekanBakh !important;
}

input::placeholder {
  font-family: iranyekanBakh !important;
}

input,
button,
form,
select,
option,
textarea,
table {
  font-family: iranyekanBakh !important;
}

/**
 * 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;
  -moz-backface-visibility: hidden;
}

.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;
  -webkit-transform: translate3d(0, 0, 0);
}

.owl-carousel .owl-item,
.owl-carousel .owl-wrapper {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
}

.owl-carousel .owl-item {
  min-height: 1px;
  float: left;
  -webkit-backface-visibility: hidden;
  -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;
  -webkit-backface-visibility: hidden;
  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%;
}

.swiper-slide {
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

/* override swipers transition */
.swiper-container-free-mode > .swiper-wrapper {
  -webkit-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  transition-timing-function: linear;
}

.swiper-container {
  padding: 10px 100px !important;
  overflow: hidden;
}

.pol-2 {
  direction: ltr !important;
}

.video-cover {
  height: 85%;
  width: 100%;
  object-fit: cover;
  background-image: url(../../assets/images/banner/bg.webp);
  border-radius: 6px;
  position: relative;
  background-size: cover;
}

.video-filter {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 6px;
  background-size: cover;
  background-position: 0;
}

.video-part {
  padding: 30px 60px;
  padding-left: 25px;
}

.video-play-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.video-play-button {
  position: absolute;
  z-index: 10;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  box-sizing: content-box;
  display: block;
  width: 32px;
  height: 44px;
  outline: none;
  border: none;
  border-radius: 50%;
  padding: 18px 20px 18px 28px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.video-play-button:before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 80px;
  height: 80px;
  background: rgba(255, 255, 255, 0.3568627451);
  border-radius: 50%;
  animation: pulse-border 1500ms ease-out infinite;
}

.video-play-button:after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 80px;
  height: 80px;
  background: rgba(255, 255, 255, 0.1058823529);
  border-radius: 50%;
  transition: all 200ms;
}

.video-play-button:hover:after {
  background-color: #fff;
}

.video-play-button:before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  animation: pulse-border 1500ms ease-out infinite;
}

.video-play-button img {
  position: relative;
  z-index: 3;
  max-width: 100%;
  width: auto;
  height: auto;
}

.video-play-button span {
  display: block;
  position: relative;
  z-index: 3;
  width: 0;
  height: 0;
  border-left: 32px solid #fff;
  border-top: 22px solid transparent;
  border-bottom: 22px solid transparent;
}

@keyframes pulse-border {
  0% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}
.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.space-top {
  margin-top: 200px;
}

@font-face {
  font-display: swap;
  font-family: iranyekanBakh;
  font-weight: 400;
  src: local("?"), url("/assets/font/fonts/ttf/Yekan-Bakh-FaNum-04-Regular.woff") format("woff");
}
@font-face {
  font-display: swap;
  font-family: iranyekanBakh;
  font-weight: 500;
  src: local("?"), url("/assets/font/fonts/ttf/Yekan-Bakh-FaNum-06-Bold.woff") format("woff");
}
@font-face {
  font-display: swap;
  font-family: iranyekanBakh;
  font-weight: 600;
  src: local("?"), url("/assets/font/fonts/ttf/Yekan-Bakh-FaNum-06-Bold.woff") format("woff");
}
@font-face {
  font-display: swap;
  font-family: iranyekanBakh;
  font-weight: 600;
  src: local("?"), url("/assets/font/fonts/ttf/Yekan-Bakh-FaNum-08-Fat.woff") format("woff");
}
@font-face {
  font-family: LilitaOne;
  src: local("?"), url("/assets/font/fonts/ttf/LilitaOne-Regular.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: Cinema;
  font-weight: 600;
  src: local("?"), url("../../assets/font/fonts/ttf/CinemaFont.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: KalamehWeb;
  font-weight: 500;
  src: local("?"), url("../../assets/font/fonts/ttf/KalamehWeb_Regular.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: IRANYekan;
  font-weight: 500;
  src: local("?"), url("../../assets/font/fonts/ttf/IRANYekanMediumFaNum.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: KalamehWeb;
  font-weight: 600;
  src: local("?"), url("../../assets/font/fonts/ttf/KalamehWeb_Black.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: Sinethar;
  font-weight: 600;
  src: local("?"), url("../../assets/font/fonts/ttf/Sinethar.woff2");
}
@media (min-width: 1400px) {
  .main-container {
    max-width: 90vw;
  }
}
@media (min-width: 1600px) {
  .main-container {
    max-width: 80vw;
  }
}
@media (max-width: 1200px) {
  .main-container {
    max-width: 100%;
  }
}
body {
  font-size: 13px;
  color: rgb(34, 34, 34);
  background: #ffffff;
  font-weight: 400;
  font-family: iranyekanBakh !important;
  overflow-x: hidden;
}

* {
  box-sizing: border-box;
  z-index: auto;
  scroll-behavior: smooth;
}

img {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
}

::-webkit-scrollbar {
  background: #cecece;
  height: 5px;
  width: 8px;
}

::-webkit-scrollbar-thumb {
  background: #278376;
  border-radius: 2px;
}

::-webkit-scrollbar-thumb:hover {
  background: #f7a1ff;
}

a {
  text-decoration: none !important;
  cursor: pointer !important;
}

a:focus,
a:active {
  text-decoration: underline;
  outline: none;
  color: #e4316c;
}

input,
select,
textarea {
  outline: none;
  cursor: pointer;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  margin: 0px;
  appearance: none !important;
}

input:focus,
select:focus,
textarea:focus {
  cursor: pointer;
  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;
}

h2 {
  margin: 0px;
  padding: 0px;
  font-weight: bold;
  color: rgb(34, 34, 34);
  font-size: 36px;
}

figure {
  margin-bottom: 50px;
  text-align: center;
}

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: #000;
}

input:focus::-webkit-input-placeholder {
  color: #000;
}

label {
  display: block;
  margin-bottom: 5px;
  color: #e4316c;
}

textarea {
  color: #000;
}

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: "e";
  width: 100%;
  height: 100%;
  position: absolute;
  font-size: 16px;
  color: green;
}

.breadcrumb {
  color: #000;
  font-size: 16px;
  padding-right: 15px;
}
.breadcrumb a {
  color: #000;
}
.breadcrumb i {
  color: #f1739d;
}
.breadcrumb span {
  color: rgb(226, 193, 255);
  font-weight: 600;
  margin: 0px 8px;
}
.breadcrumb .active {
  color: #f56295;
}

@media (max-width: 800px) {
  .breadcrumb {
    font-size: 12px;
  }
}
.form-control {
  font-family: iranyekanBakh !important;
}

input::placeholder {
  font-family: iranyekanBakh !important;
}

input,
button,
form,
select,
option,
textarea,
table {
  font-family: iranyekanBakh !important;
}

/**
 * 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;
  -moz-backface-visibility: hidden;
}

.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;
  -webkit-transform: translate3d(0, 0, 0);
}

.owl-carousel .owl-item,
.owl-carousel .owl-wrapper {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
}

.owl-carousel .owl-item {
  min-height: 1px;
  float: left;
  -webkit-backface-visibility: hidden;
  -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;
  -webkit-backface-visibility: hidden;
  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%;
}

.swiper-slide {
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

/* override swipers transition */
.swiper-container-free-mode > .swiper-wrapper {
  -webkit-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  transition-timing-function: linear;
}

.swiper-container {
  padding: 10px 100px !important;
  overflow: hidden;
}

.pol-2 {
  direction: ltr !important;
}

.video-cover {
  height: 85%;
  width: 100%;
  object-fit: cover;
  background-image: url(../../assets/images/banner/bg.webp);
  border-radius: 6px;
  position: relative;
  background-size: cover;
}

.video-filter {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 6px;
  background-size: cover;
  background-position: 0;
}

.video-part {
  padding: 30px 60px;
  padding-left: 25px;
}

.video-play-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.video-play-button {
  position: absolute;
  z-index: 10;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  box-sizing: content-box;
  display: block;
  width: 32px;
  height: 44px;
  outline: none;
  border: none;
  border-radius: 50%;
  padding: 18px 20px 18px 28px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.video-play-button:before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 80px;
  height: 80px;
  background: rgba(255, 255, 255, 0.3568627451);
  border-radius: 50%;
  animation: pulse-border 1500ms ease-out infinite;
}

.video-play-button:after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 80px;
  height: 80px;
  background: rgba(255, 255, 255, 0.1058823529);
  border-radius: 50%;
  transition: all 200ms;
}

.video-play-button:hover:after {
  background-color: #fff;
}

.video-play-button:before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  animation: pulse-border 1500ms ease-out infinite;
}

.video-play-button img {
  position: relative;
  z-index: 3;
  max-width: 100%;
  width: auto;
  height: auto;
}

.video-play-button span {
  display: block;
  position: relative;
  z-index: 3;
  width: 0;
  height: 0;
  border-left: 32px solid #fff;
  border-top: 22px solid transparent;
  border-bottom: 22px solid transparent;
}

@keyframes pulse-border {
  0% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}
.header-design nav {
  position: relative;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  height: 80px;
  z-index: 99;
  direction: rtl;
}
.header-design nav .navbar {
  height: 100%;
  max-width: 1520px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: auto;
  padding: 0 0px;
}
.header-design nav .navbar .logo a {
  width: 100%;
  object-fit: contain;
  padding: 8px 9px;
  margin-top: -5px;
  height: 65px !important;
}
.header-design nav .navbar .nav-links {
  line-height: 70px;
  height: 100%;
}

.header-design nav {
  background: #fff;
}

nav .navbar .links {
  display: flex;
  align-items: center;
  padding: 0px;
  padding-top: 0px;
}

nav .navbar .links li {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  list-style: none;
  padding: 0 14px;
  flex-direction: row-reverse;
}

nav .navbar .links li a {
  height: 100%;
  text-decoration: none;
  white-space: nowrap;
  color: #000000;
  font-size: 15px;
  font-weight: 500;
}

.links li:hover .course-arrow,
.links li:hover .blog-arrow {
  transform: rotate(0deg);
}

nav .navbar .links li .arrow {
  /* background: red; */
  height: 100%;
  width: 18px;
  line-height: 70px;
  text-align: center;
  display: inline-block;
  color: #000000;
  transition: all 0.3s ease;
  font-size: 17px;
}

nav .navbar .links li .sub-menu {
  position: absolute;
  top: 70px;
  right: 0;
  min-width: 250px;
  padding: 10px 8px;
  line-height: 40px;
  background: #b80054;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  border-radius: 0 0 4px 4px;
  display: none;
  z-index: 2;
  border-top: 2px solid #ccc;
}

nav .navbar .links li:hover .Course-sub-menu,
nav .navbar .links li:hover .js-sub-menu {
  display: block;
}

.arrow {
  height: 20px;
  margin-right: 0px !important;
}

.logo {
  height: 82px !important;
  object-fit: contain;
  padding: 8px 0px;
  display: flex;
  align-items: center;
}
.logo a {
  width: 100%;
  object-fit: contain;
  padding: 8px 0px;
  margin-top: 2px;
  height: 80px !important;
}
.logo a img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.navbar .links li .sub-menu li:hover {
  background: #3b0022;
}

.navbar .links li .sub-menu li {
  padding: 0 22px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.032);
  padding-right: 10px;
}

.navbar .links li .sub-menu a {
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  width: 100%;
  text-align: right;
}

.navbar .links li .sub-menu a:hover {
  color: #ffffff;
}

.more-arrow {
  width: 100%;
  text-align: right;
}
.more-arrow .arrow {
  color: #fff;
}

.navbar .links li .htmlCss-more-sub-menu {
  /* line-height: 40px; */
}

.blog-arrow {
  direction: ltr;
  text-align: right;
}

.navbar .links li .sub-menu .more-sub-menu {
  position: absolute;
  top: 0;
  right: 98%;
  border-radius: 0px;
  z-index: 1;
  display: none;
}

.links li .sub-menu .more:hover .more-sub-menu {
  display: block;
}

.navbar .search-box {
  position: relative;
  display: flex;
}

.bx-search {
  color: #494949 !important;
}

.input-group-append .bx-search {
  color: #ffffff !important;
}

.navbar .search-box .input-box {
  position: absolute;
  right: calc(100% - 40px);
  top: 80px;
  height: 60px;
  width: 300px;
  background: #30045a;
  border-radius: 6px;
  opacity: 0;
  pointer-events: none;
  transition: all 0.4s ease;
}

.navbar.showInput .search-box .input-box {
  top: 65px;
  opacity: 1;
  pointer-events: auto;
  background: #30045a;
}

.search-box .input-box::before {
  content: "";
  position: absolute;
  height: 20px;
  width: 20px;
  background: #30045a;
  right: 10px;
  top: -6px;
  transform: rotate(45deg);
}

.search-box .input-box input {
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 4px;
  transform: translate(-50%, -50%);
  height: 35px;
  width: 280px;
  outline: none;
  padding: 0 15px;
  font-size: 16px;
  border: none;
}

.navbar .nav-links .sidebar-logo {
  display: none;
}

.navbar .bx-menu {
  display: none;
}

.course-arrow {
  display: flex;
}

@media (max-width: 920px) {
  nav .navbar {
    max-width: 100%;
    padding: 0 0px;
    padding-left: 10px;
  }
  nav .navbar .logo a {
    font-size: 27px;
  }
  nav .navbar .links li {
    padding: 0 10px;
    white-space: nowrap;
    height: 45px;
  }
  nav .navbar .links li a {
    font-size: 14px;
    color: #fff;
  }
  .navbar .links li .sub-menu a {
    font-size: 14px;
    color: #fff;
  }
}
@media (max-width: 1000px) {
  .Course-sub-menu .sub-menu li {
    padding: 0 10px;
    white-space: nowrap;
    height: 32px !important;
  }
  nav .navbar .links li .sub-menu {
    position: absolute;
    top: 70px;
    right: -15px;
    min-width: 235px;
    padding: 10px 20px;
    /* left: 0px; */
    line-height: 40px;
    background: #710033;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    border-radius: 0 0 4px 4px;
    display: none;
    z-index: 2;
    border-top: 2px solid #ccc;
  }
  .blog-arrow {
    direction: rtl;
    text-align: right;
  }
  .logo {
    height: 0px !important;
  }
  .sidebar-logo .logo {
    height: 100px !important;
  }
  nav {
    height: 60px;
  }
  nav .navbar .links li:before {
    right: -13px;
    content: "";
    border-color: transparent #f7c4d8;
    border-style: solid;
    border-width: 0.3em 0.3em 0.3em 0em;
    display: block;
    height: 0;
    left: 1.8rem;
    position: relative;
    top: 2.4rem;
    width: 0;
  }
  .bxs-chevron-down:before {
    content: "\ec89";
    border: 1px solid rgba(204, 204, 204, 0.1607843137);
  }
  nav .navbar .links .sub-menu li:before {
    border: none !important;
    content: "•";
    color: #fff;
    font-weight: bold;
    width: 3px;
    font-size: 12px;
    margin-left: 5px;
    height: 0;
    left: 1.8rem;
    position: relative;
    top: 0px;
    width: 0;
  }
  .navbar .links li .sub-menu li {
    padding: 0px 0px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    padding-right: 0px;
  }
  .sub-menu {
    padding: 0px;
  }
  .navbar .links li .sub-menu .more-sub-menu li:before {
    border: none !important;
    content: none;
  }
  nav .navbar .links li .sub-menu {
    border-top: 1px solid rgba(255, 255, 255, 0.6980392157);
  }
  .blog-arrow,
  .course-arrow {
    border-bottom: 1px solid rgba(233, 233, 233, 0);
  }
  nav {
    /* position: relative; */
  }
  .course-links {
    padding-left: 0px !important;
  }
  .navbar .bx-menu {
    display: block;
  }
  nav .navbar .nav-links {
    position: fixed;
    top: 0;
    right: -100%;
    display: block;
    max-width: 270px;
    width: 100%;
    background: #991440;
    line-height: 40px;
    padding: 20px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    transition: all 0.5s ease;
    z-index: 9999 !important;
  }
  .navbar .nav-links .sidebar-logo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: rgba(255, 255, 255, 0.0588235294);
    padding: 10px;
    height: 65px;
  }
  .navbar .nav-links .sidebar-logo .logo a {
    width: 100%;
    object-fit: contain;
    padding: 8px 9px;
    margin-top: -23px;
    height: 65px !important;
  }
  .sidebar-logo .logo-name {
    font-size: 25px;
    color: #fff;
  }
  .sidebar-logo i,
  .navbar .bx-menu {
    font-size: 25px;
    color: #000000;
  }
  .bx-x {
    padding: 5px;
    color: #ffffff !important;
    border-radius: 6px;
    background-color: rgba(255, 255, 255, 0.2352941176);
  }
  nav .navbar .links {
    display: block;
    margin-top: 20px;
  }
  nav .navbar .links li .arrow {
    line-height: 40px;
  }
  nav .navbar .links li {
    display: block;
  }
  nav .navbar .links li .sub-menu {
    position: relative;
    top: -15px;
    box-shadow: none;
    display: none;
    padding-left: 8px;
  }
  nav .navbar .links li .sub-menu li {
    border-bottom: none;
    height: 40px;
  }
  .navbar .links li .sub-menu .more-sub-menu {
    display: none;
    position: relative;
    left: 0;
  }
  .navbar .links li .sub-menu .more-sub-menu li {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .links li:hover .course-arrow,
  .links li:hover .blog-arrow {
    transform: rotate(0deg);
  }
  .navbar .links li .sub-menu .more-sub-menu {
    display: none;
  }
  .navbar .links li .sub-menu .more span {
    /* background: red; */
    display: flex;
    align-items: center;
    /* justify-content: space-between; */
  }
  .links li .sub-menu .more:hover .more-sub-menu {
    display: none;
  }
  nav .navbar .links li:hover .Course-sub-menu,
  nav .navbar .links li:hover .js-sub-menu {
    display: none;
  }
  .navbar .nav-links.show1 .links .Course-sub-menu,
  .navbar .nav-links.show3 .links .js-sub-menu,
  .navbar .nav-links.show2 .links .more .more-sub-menu {
    display: block;
  }
  .navbar .nav-links.show1 .links .course-arrow,
  .navbar .nav-links.show3 .links .blog-arrow {
    transform: rotate(0deg);
  }
  .navbar .nav-links.show2 .links .more-arrow {
    transform: rotate(0deg);
  }
  nav .navbar .links li .arrow {
    height: 22px;
    width: 25px;
    line-height: 70px;
    text-align: center;
    display: inline-block;
    color: #fff;
    transition: all 0.3s ease;
    position: absolute;
    left: 0;
  }
  .navbar .links li .sub-menu .more-sub-menu {
    top: 0;
    right: -20px;
    z-index: 1;
  }
  .sidebar-logo {
    border-bottom: 1px solid rgba(204, 204, 204, 0.0392156863);
  }
  .sidebar-logo .logo {
    width: 150px;
    object-fit: contain;
    padding: 0px;
    position: relative;
    right: 8px;
  }
  .sidebar-logo .navbar .links li .sub-menu a {
    font-size: 14px;
  }
  .navbar .search-box i {
    font-size: 18px;
  }
  .main-btn {
    margin-right: 2px;
  }
  .more {
    height: unset !important;
  }
  .more-sub-menu.sub-menu li a {
    padding-right: 20px;
  }
}
@media (max-width: 370px) {
  .blog-arrow {
    direction: ltr;
    text-align: right;
  }
  nav .navbar .nav-links {
    max-width: 100%;
  }
  .navbar .links li .sub-menu a {
    font-size: 14px;
  }
}
.bxs-chevron-down.arrow {
  margin-right: 0px;
}

nav .navbar .links li a:hover {
  color: #ff89e0;
}

header.comments-user {
  box-shadow: none !important;
}

.search-box {
  display: flex;
  justify-content: end;
}

.header-design {
  z-index: 1;
  background: #fff;
  position: relative;
  height: 85px;
}

.menu-bottom-design {
  height: 30px;
  position: relative;
  z-index: 10;
}

.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;
}

.wrapp-heaader-top {
  padding: 3px 5px;
}
.wrapp-heaader-top a {
  color: white;
  font-size: 13px;
  margin: 0px 4px;
}
.wrapp-heaader-top span {
  color: white;
  font-size: 13px;
}
.wrapp-heaader-top .slash {
  color: rgba(238, 238, 238, 0.9333333333);
}
.wrapp-heaader-top strong {
  color: white;
  font-size: 13px;
}
.wrapp-heaader-top i {
  color: #ffffff;
  font-size: 22px;
  margin-left: 5px;
}
.wrapp-heaader-top .mdi-phone-in-talk {
  font-size: 20px !important;
}

.topper-back {
  background: #f1739d;
}

.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.space-top {
  margin-top: 200px;
}

.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.space-top {
  margin-top: 200px;
}

.w-name-course {
  font-size: 36px;
  color: #fff;
  margin-bottom: 20px;
  text-align: right;
  direction: rtl;
  line-height: 50px;
  font-family: kalamehweb;
}

.course-page-header {
  height: 920px;
  position: relative;
  background-image: url(../images/banner/course-pb.webp);
  background-repeat: no-repeat;
  background-position: center;
  top: -68px;
  padding-top: 50px;
}

.courses-banner {
  height: 800px;
  background: center;
  background-color: #970b3e;
  background-image: url(../images/vectors/topbgimg2.webp);
  background-size: 500px;
  position: relative;
  top: -82px;
}

.student-courses-banner {
  height: 200px;
  background: center;
  background-color: #f1739d;
  background-image: url(../images/vectors/topbgimg2.webp);
  background-size: 500px;
  position: relative;
  top: -82px;
}

.all-courses-banner {
  height: 300px;
  background: center;
  background-color: #278376;
  background-image: url(../images/vectors/topbgimg2.webp);
  background-size: 500px;
  position: relative;
  top: -82px;
}

.course-wave {
  position: relative;
  padding: 0px;
  width: 100%;
  object-fit: cover;
}
.course-wave img {
  height: 200px;
  width: 100%;
  position: absolute;
  top: -220px;
  width: 100%;
  object-fit: cover;
}

.courses-post {
  width: 100%;
  height: 400px;
}

.w-video-box video {
  height: 415px;
  width: 100%;
  border-radius: 6px;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.course-name-main {
  font-family: kalamehweb;
  font-size: 40px;
  margin-bottom: 15px;
  font-weight: 600;
}

.course-price-row .course-price {
  font-family: iranyekanBakh !important;
  color: #000;
  font-size: 20px;
  direction: rtl;
}
.course-price-row .course-price span {
  font-size: 33px;
  color: #000;
  font-family: iranyekanBakh !important;
  font-weight: 600;
}
.course-price-row .course-price del {
  color: #9b9b9b;
  margin-left: 8px;
}
.course-price-row .course-price .toman {
  font-family: iranyekanBakh !important;
  font-size: 16px;
}

.help-box {
  padding: 20px 15px;
  background-color: rgb(255, 239, 245);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  margin-bottom: 20px;
  display: flex;
  height: 138px;
  background-image: url(../images/icons/help.png);
  background-position: bottom left;
  background-size: 50px;
  background-repeat: no-repeat;
}
.help-box h4 {
  color: #000;
  font-size: 20px;
  display: flex;
  align-items: center;
}
.help-box h4 img.lights {
  height: 40px;
}
.help-box h4 img.arrows {
  height: 25px;
  border-radius: 50%;
  background: #fff;
  padding: 2px;
  margin-right: 10px;
}
.help-box p {
  font-size: 14px;
  line-height: 25px;
  font-weight: 500;
  padding: 5px 8px;
}

.course-price-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 35px;
}

.add-to-cart-btn {
  background: #e4316c;
  padding: 10px;
  border-radius: 6px;
  color: #fff;
  width: 305px;
  height: 57px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.add-to-cart-btn strong {
  font-size: 20px;
  font-weight: 500;
}
.add-to-cart-btn img {
  height: 40px;
  width: 40px;
  margin-left: 25px;
}
.add-to-cart-btn::hover {
  box-shadow: 0 4px 15px 0 rgba(116, 79, 168, 0.021);
  background-image: linear-gradient(to right, #e4316c, #e4316c, #ff95b8, #c30040);
  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;
}

.add-to-cart-btn.pre-registration {
  background: #278376;
}

.accordion-body {
  font-family: IRANYekan !important;
  font-size: 14px;
}

.course-story p {
  font-family: IRANYekan;
  font-size: 14px;
  direction: rtl;
  text-align: justify;
  color: #000;
  line-height: 28px;
  margin-top: 10px;
  display: -webkit-box;
  margin-bottom: 20px;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  direction: rtl;
}

.soft-padding {
  padding-top: 50px;
}

.soft-margin {
  margin-top: 25px;
}

.countdown-time {
  position: relative;
}

.countdown-time::before {
  position: absolute;
  bottom: -10px;
  right: -10px;
  width: 75px;
  height: 55px;
  border-bottom: 2px dashed white;
  border-right: 2px solid white;
  border-radius: 0 0 5px 0;
  content: "";
  transition: all 0.3s ease;
}

.countdown-time::after {
  position: absolute;
  top: -10px;
  left: -10px;
  width: 70px;
  height: 60px;
  border-top: 2px solid white;
  border-left: 2px dashed white;
  border-radius: 5px 0 0 0;
  content: "";
  transition: all 0.3s ease;
}

.course-design .support-flower {
  position: absolute;
  object-fit: contain;
  height: 213px;
  right: -100px;
  top: -80px;
}
.course-design .support-flower img {
  height: 120px;
}

.course-active-time {
  display: flex;
  padding-right: 0px;
  align-items: center;
  margin-bottom: 15px;
  margin-top: 25px;
}
.course-active-time i {
  font-size: 22px;
  color: #f1739d;
  margin-left: 5px;
}
.course-active-time p {
  font-weight: 500;
  font-size: 15px;
}
.course-active-time p strong {
  color: #e4316c;
  font-size: 18px;
  font-weight: 600;
}

.glass-wrapper {
  background-color: #fff;
  background-image: url(../images/vectors/flower-vec.png);
  background-size: 30px;
  background-position: top left;
  background-repeat: no-repeat;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  border-radius: 6px;
  margin-bottom: 15px;
  display: flex;
  justify-content: flex-start;
  padding: 10px 15px;
  align-items: center;
}
.glass-wrapper .d-icon-holder {
  height: 35px;
  width: 35px;
  object-fit: contain;
  margin-left: 15px;
}
.glass-wrapper .d-icon-holder img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}
.glass-wrapper .d-caption {
  display: flex;
  flex-direction: column;
  justify-content: start;
}
.glass-wrapper .d-caption strong {
  font-size: 16px;
  margin-bottom: 0px;
  font-weight: 600;
}
.glass-wrapper .d-caption span {
  font-family: kalamehweb;
  font-weight: 500;
  font-size: 16px;
}

.course-road-mad {
  flex-wrap: wrap;
  padding: 40px 35px;
  background: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  margin-bottom: 20px;
  display: flex;
}

.top-hack {
  position: relative;
  top: -55px;
}

.courses-items {
  padding-right: 10px;
  margin-bottom: 5px;
  display: flex;
  align-items: stretch;
  width: 100%;
}
.courses-items span {
  background: rgb(255, 221, 233);
  padding: 10px;
  border-radius: 4px;
  width: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 600;
  font-size: 15px;
  margin-left: 5px;
}
.courses-items .course-item {
  background: #ffeff5;
  padding: 10px;
  border-radius: 4px;
  width: 100%;
}
.courses-items .course-item p {
  font-size: 14px;
}

.high-season {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px 2px;
  text-align: center;
  background: #ffeff5;
  margin: 2px;
  color: #000;
  border-radius: 6px;
  height: 52px;
}
.high-season a {
  color: #000;
  font-size: 16px;
}
.high-season a:active, .high-season a :hover {
  color: #000;
}
.high-season span {
  font-size: 15px;
}

.highlight {
  background-color: gold;
  color: darkblue;
  padding: 10px;
  border-radius: 5px;
}

.buy-caption {
  padding: 10px 15px;
  border-radius: 8px;
  background: rgb(226, 193, 255);
}

.active-season {
  background-color: #ffd4e2;
  background-image: url(../images/vectors/sweet.png);
  background-size: 30px;
  border: 2px solid #ffc1d7;
  background-repeat: no-repeat;
  background-position: right bottom;
  font-weight: 500;
}
.active-season span {
  font-size: 15px;
}

.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: 10px;
}

.countdown-time {
  display: flex;
  direction: rtl;
  align-items: center;
  background: #fff;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  border-radius: 6px;
  padding: 5px 20px;
  justify-content: space-between;
  display: flex;
  align-items: center;
  background: #fff;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  border-radius: 6px;
  padding: 5px 20px;
}
.countdown-time h4 {
  margin-bottom: 0px;
  color: #f56295;
  font-size: 20px;
  font-weight: 500;
}
.countdown-time h4 span {
  margin-left: 10px;
}

#the-24h-countdown {
  direction: rtl;
}
#the-24h-countdown p {
  direction: ltr !important;
  display: flex;
  align-items: center;
  font-size: 20px;
  color: #000;
  font-family: iranyekanBakh !important;
  font-weight: 600;
  justify-content: end;
  margin-top: 0 !important;
  margin-bottom: 0px !important;
}

#the-24h-countdown span {
  position: relative;
  height: 35px;
  width: 35px;
  border-radius: 10px;
  display: inline-block;
  margin: 5px;
  overflow: hidden;
  color: #000;
  font-size: 24px;
  color: #000;
  font-family: iranyekanBakh !important;
  font-weight: 600;
  margin-top: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding-top: 2px;
}

.offers {
  margin-top: 12px;
}

.zarinpal-wrapper {
  height: 40px;
  width: 30px;
}

.w-name-course-content {
  position: relative;
  direction: rtl;
  font-size: 18px;
  color: #000;
  padding: 5px;
  margin-bottom: 25px;
}
.w-name-course-content .heading-design {
  position: absolute;
  right: -40px;
  display: block;
  height: 45px;
  width: 6px;
  border-radius: 0px 4px 4px 0px;
  background: #f1739d;
}
.w-name-course-content img {
  height: 40px;
  width: 40px;
  margin-left: 8px;
  padding: 2px;
}

.teacher-wrapping-hero {
  background-color: #fff;
  background-image: url(../images/vectors/flower-vec.png);
  background-size: 50px;
  background-position: top left;
  background-repeat: no-repeat;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  border-radius: 6px;
  margin-bottom: 15px;
  display: flex;
  justify-content: flex-start;
  padding: 8px 15px;
  align-items: start;
  flex-direction: column;
  height: 155px;
}
.teacher-wrapping-hero .teacher-img {
  height: 60px;
  width: 60px;
  margin-bottom: 10px;
}
.teacher-wrapping-hero .wrapp-teacher-name {
  border-top: 1px solid #fdf0f5;
}
.teacher-wrapping-hero a {
  display: block;
  font-size: 16px;
  margin-bottom: 0px;
  font-weight: 600;
  color: #000;
}
.teacher-wrapping-hero span {
  font-family: kalamehweb;
  font-weight: 500;
  font-size: 16px;
}

.course-start {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: strart;
  padding-right: 50px;
}

.course-price {
  font-size: 2rem;
  color: #fff;
}
.course-price strong {
  margin-left: 12px;
}
.course-price span {
  color: #ffe0ea;
  font-family: Cinema;
  font-weight: 600;
}

.comments-btn-hero {
  justify-content: flex-end;
}

.offer-area {
  background-color: rgb(255, 255, 255);
  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: #000000;
}
.offer-area img {
  height: 40px;
}
.offer-area #countdown ul {
  display: flex;
  direction: rtl;
  flex-direction: row-reverse;
  list-style: none;
  width: 150px;
}
.offer-area #countdown ul li {
  list-style: none;
  color: #8f0051;
  font-size: 24px;
  font-weight: 600;
}
.offer-area #countdown ul span {
  color: #000000;
  padding: 0px 5px;
  font-size: 18px;
}
.offer-area .del-price {
  font-size: 20px;
  margin-right: 20px;
  text-decoration-line: line-through;
  color: #000000;
}

.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: 0px;
}
.hero-margin .w-name-course {
  font-size: 36px;
  color: #fff;
  margin-bottom: 0px !important;
  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: 4px;
  font-size: 16px;
  background: #fff;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  font-weight: 500;
  margin: 15px 0;
  display: flex;
  align-items: center;
}
.add-cart a span {
  color: #000000;
}
.add-cart i {
  font-size: 20px;
  color: #970b3e;
  font-weight: 600;
  position: relative;
  top: 3px;
  margin-right: 5px;
}

.add-cart:hover {
  background: #3b0022;
  color: #fff;
}
.add-cart:hover span {
  color: #fff;
}

.read-caption {
  border-radius: 4px;
  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(255, 255, 255, 0.5215686275);
  border-radius: 4px;
  padding: 5px 10px;
  margin: 0px 12px;
}
.category-label a {
  color: #970b3e;
  font-weight: 600;
  font-size: 14px;
}

.h_iframe-aparat_embed_frame {
  position: relative;
  display: block;
  justify-content: center;
}

.h_iframe-aparat_embed_frame .ratio {
  display: block;
  width: 100%;
  height: auto;
}

.h_iframe-aparat_embed_frame iframe {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: 680px;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.h_iframe-aparat_embed_frame {
  position: relative;
  display: flex;
  padding: 30px 30px;
  background: #ffe3ed;
  justify-content: center;
  border-radius: 10px;
}

.wrapp-course-captions p {
  font-family: IRANYekan;
  font-size: 14px;
}
.wrapp-course-captions iframe {
  border-radius: 8px;
}
.wrapp-course-captions .embed-responsive {
  padding: 30px;
  border-radius: 8px;
  background: rgba(255, 228, 239, 0.16);
  margin: 20px 0;
}

#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: 4px;
  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: #e4316c;
  font-weight: 600;
  font-size: 16px;
}

.wrapp-comment-reply-btn a {
  padding: 5px 10px;
  border-radius: 6px;
  background: #fff;
  color: #e4316c;
}
.wrapp-comment-reply-btn strong {
  font-size: 14px !important;
}

.wrapp-course-captions {
  text-align: right;
  padding: 40px 35px;
  background: rgb(255, 255, 255);
  border-radius: 4px;
  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: 4px;
  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: #000;
  font-weight: 600;
}
.wrapp-sidebar-couese .teacher-wrapping a span {
  color: #000;
}
.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: #f56295;
}
.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 span {
  font-weight: 600;
}
.wrapp-sidebar-couese .each-wrapp-options .icons-wrapp i {
  font-size: 22px;
  color: #f56295;
  margin-left: 8px;
}
.wrapp-sidebar-couese .wrapp-side-btn {
  padding: 10px;
}
.wrapp-sidebar-couese .wrapp-side-btn a {
  display: flex;
  align-items: center;
  color: #000;
}
.wrapp-sidebar-couese .wrapp-side-btn a span {
  font-weight: 600;
}
.wrapp-sidebar-couese .wrapp-side-btn i {
  font-size: 22px;
  color: #f56295;
  margin-left: 8px;
}

.wrapp-side-btn:hover {
  background-color: #f56295;
}
.wrapp-side-btn:hover a {
  color: #ffffff;
}
.wrapp-side-btn:hover i {
  color: #fff;
}

.wrapp-course-sections {
  padding: 15px 10px;
  border-radius: 4px;
  background: #ffeff5;
  /* border: 1px solid rgb(255, 205, 225); */
  margin-bottom: 10px;
  display: flex;
  align-items: center;
}
.wrapp-course-sections p {
  font-size: 14px;
  text-align: right;
  direction: rtl;
}
.wrapp-course-sections .time-holder {
  padding: 4px 10px;
  border-radius: 4px;
  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: #f56295;
}

.download-now {
  background: #e4316c;
  color: #fff;
  border-radius: 4px;
  display: flex;
  padding: 4px 15px;
  padding-top: 6px;
}
.download-now span {
  font-weight: 600;
  font-size: 14px;
}
.download-now i {
  font-size: 14px;
  margin-left: 5px;
}

.course-cake {
  height: 0px;
}
.course-cake .cake-slice-2 {
  position: relative;
}
.course-cake .cake-slice-2 img {
  position: absolute;
  height: 350px;
  top: -350px;
  animation: third-cooki 1.5s infinite alternate;
}
@-webkit-keyframes third-cooki {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(12px);
  }
}
@keyframes third-cooki {
  10% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(12px);
  }
}
.course-cake .cake-slice-3 {
  display: none;
}
.course-cake .cake-slice-3 img {
  position: absolute;
  height: 250px;
  top: -250px;
}

.price-filter-wrapp {
  background: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  margin-bottom: 25px;
}

.course-count {
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
  background: #fff;
  font-size: 15px;
  font-weight: 600;
  border-radius: 50%;
  margin-bottom: 0px;
  margin-left: 15px;
}

.comment-btn {
  background: #f1739d;
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  padding: 8px 22px;
  width: max-content;
  border: none;
  border-radius: 4px;
}

.wrapp-comments {
  border: 1px solid rgb(242, 242, 242);
  margin: 0px 10px;
  border-radius: 4px;
}
.wrapp-comments .wrapp-user-comments {
  border: 1px solid rgb(242, 242, 242);
  border-radius: 4px;
  border-bottom: none;
}
.wrapp-comments .wrapp-user-comments .comment-user {
  background: #f9f4ff;
  box-shadow: none !important;
  border-radius: 4px;
  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: 4px;
}
.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: #f56295;
  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: 1300px) and (max-width: 1600px) {
  .cooki-dance {
    padding-right: 100px !important;
  }
}
@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;
  }
  .add-to-cart-btn {
    background: #d22d64;
    padding: 10px;
    border-radius: 6px;
    color: #fff;
    width: 170px;
    height: 50px;
  }
  .add-to-cart-btn img {
    height: 30px;
    width: 30px;
    margin-left: 10px;
  }
  .add-to-cart-btn strong {
    font-size: 16px;
    font-weight: 500;
  }
  .add-to-cart-btn .course-price-row .course-price span {
    font-size: 27px;
    color: #000;
    font-family: iranyekanBakh !important;
    font-weight: 600;
  }
  .add-to-cart-btn .logo {
    height: auto !important;
    width: 228px !important;
    object-fit: cover;
    padding: 0px;
    position: relative;
    right: -140px;
  }
  .add-to-cart-btn .soft-padding {
    padding-top: 20px;
  }
  .add-to-cart-btn .course-page-header {
    background-repeat: repeat-y !important;
  }
}
@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: 290px;
    max-width: 100%;
    box-shadow: 0px 1.60568px 13px rgba(0, 0, 0, 0.2);
  }
  .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: 25px;
    height: 25px;
  }
  #sidebar {
    position: relative !important;
    top: unset !important;
  }
  .wrapp-course-captions {
    padding: 20px 15px;
    padding-bottom: 30px;
  }
  .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: 14px;
  }
  .wrapp-course-captions span,
  .wrapp-course-captions small,
  .wrapp-course-captions strong,
  .wrapp-course-captions article {
    font-size: 14px;
  }
  .wrapp-course-captions h1 {
    font-size: 17px;
  }
  .wrapp-course-captions h2 {
    font-size: 16px;
  }
  .wrapp-course-captions h3 {
    font-size: 15px;
    margin: 0.7rem 0rem;
    font-weight: 600;
  }
  .wrapp-course-captions h4,
  .wrapp-course-captions h5,
  .wrapp-course-captions h6 {
    font-size: 14px;
    margin: 0.7rem 0rem;
    margin-left: 0.5rem;
  }
  .wrapp-course-captions video {
    padding: 20px;
    min-height: 200px;
    height: 200px !important;
    width: 100%;
  }
}
.video-info {
  height: 175px;
  direction: rtl;
}
.video-info .description p {
  line-height: 24px;
  margin-bottom: 0px;
  display: -webkit-box;
  max-width: 100%;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: right;
  direction: rtl;
}

@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;
  background: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.pamphlet {
  background-color: rgba(39, 131, 118, 0.1882352941);
  border-radius: 4px;
  border: 1px solid rgba(39, 131, 118, 0.1411764706);
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  direction: rtl;
  display: flex;
  align-items: center;
  padding: 20px 15px;
  padding-left: 45px;
  margin-top: -19px;
  background-image: url(../images/vectors/login-flower.webp);
  background-size: 400px;
  background-position: center 15px;
  background-repeat: no-repeat;
  justify-content: space-between;
}
.pamphlet h4 {
  -weight: 600;
  font-size: 20px;
}
.pamphlet a {
  width: 150px;
  height: 45px;
  background: #278376;
  color: #fff;
  font-weight: 600;
  font-size: 18px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: space-around;
  border-radius: 6px;
}
.pamphlet a i {
  font-size: 18px;
}
.pamphlet a:hover {
  background: #e4316c;
  transition: all linear 0.3s;
}

@-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: url(../images/banner/bg.webp);
  background-size: cover;
  background-position: bottom;
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 612px;
}

.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: 690px;
  max-height: 700px;
  direction: rtl;
  overflow-y: scroll;
  padding: 0px 1px;
  padding-right: 0;
  border-bottom-left-radius: 6px;
  background-color: rgba(241, 115, 157, 0.0705882353);
}

.iframe.no-ad {
  padding-top: 42%;
}

.video-playlist::-webkit-scrollbar-track {
  border-radius: 0px;
  background-color: #ffffff;
}

.video-playlist::-webkit-scrollbar {
  border-radius: 0px;
  width: 6px;
  background-color: #f1739d;
}

.blogs-row .blog-caption {
  margin-top: 0px !important;
}

.blogs-row span {
  color: #000 !important;
}

.blog-wrapper .person-in span {
  font-size: 16px;
}

.blog-wrapper .tag-in p {
  font-size: 14px;
  font-weight: 500;
  color: #e4316c;
  padding: 0px 20px;
  background: #ffecf2;
  border-radius: 4px;
}

.blogs-row .blog-wrapper .calc-width {
  text-align: right;
  direction: rtl;
  padding-left: 0px;
  display: flex;
  align-items: center;
}

.video-playlist::-webkit-scrollbar-thumb {
  border-radius: 0px;
  background-color: #f1739d;
}

.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: rgb(215, 46, 102);
  padding: 13px;
  height: 89px;
  text-align: right;
  direction: rtl;
  width: 25.5%;
  display: flex;
  color: #ffffff;
  font-weight: 500;
  font-size: 20px;
  align-items: center;
  display: flex;
  justify-content: space-between;
}

.next-video {
  display: block;
  height: 90px;
  position: relative;
  overflow: hidden;
  background-color: #ffe3ed;
  border-bottom: 1px solid #fff;
}

.next-video img {
  display: block;
}

.next-video::before {
  width: 100%;
  height: 100%;
  position: absolute;
  transition: all 0.5s;
}

.next-video-title {
  padding-top: 12px;
  transition: all 0.5s;
  font-size: 15px;
  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: rgb(255, 233, 240);
}

.sv-content {
  margin-bottom: 20px;
}

.read-video-article {
  margin-right: 10px;
  height: 45px;
  padding: 10px 15px;
  width: max-content;
  background: #278376;
  color: #fff;
  border-radius: 6px;
  font-size: 16px;
  font-weight: 600;
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.read-video-article i {
  font-size: 18px;
  margin-right: 15px;
}
.read-video-article:hover {
  background: #e4316c;
}

.views {
  color: #000;
  margin-right: 15px;
  font-weight: 600;
  font-size: 20px;
  margin-top: 10px;
  margin-bottom: 5px;
  display: block;
}

.video-popularity {
  font-size: 18px;
  font-weight: 600;
  text-align: right;
}

.video-popularity {
  background: #ffffff;
  line-height: 1.5rem;
  padding: 5px 15px;
  direction: rtl;
}

.description {
  background: #ffffff;
  line-height: 1.5rem;
  padding: 0px 10px;
  padding-bottom: 0;
  direction: rtl;
  border-bottom-right-radius: 6px;
  margin-bottom: 0px;
  height: auto;
  color: #000;
  font-size: 14px;
  text-align: justify;
}
.description h3 {
  font-size: 28px;
  margin-top: 10px;
  color: #000;
}

.video-description-action {
  display: flex;
  direction: rtl;
  justify-content: space-between;
  padding: 0px 15px;
}
.video-description-action .download-video {
  border: 1px solid #f1739d;
  padding: 6px 10px;
  border-radius: 5px;
  color: #000000;
  display: inline-block;
}
.video-description-action .download-video i {
  color: #f1739d;
  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 #f1739d;
  padding: 6px 10px;
  border-radius: 5px;
  font-weight: 500;
  color: #000;
}
.video-description-action .attach-btn .attachment-download i {
  font-size: 16px;
  margin-left: 4px;
  position: relative;
  top: 4px;
  color: #f1739d;
}
.video-description-action .attach-btn .each-video-time {
  display: flex;
  align-items: center;
  margin-left: 12px;
  font-weight: 500;
}
.video-description-action .attach-btn .each-video-time i {
  color: #f1739d;
  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 {
  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 rgb(242, 204, 217);
}

.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: 600;
  color: #eeedf0;
  text-transform: uppercase;
  margin: 20px 0;
}

.skill-bar {
  height: 14px;
  background: #4d098e;
  border-radius: 3px;
}

.skill-percentage {
  height: 14px;
  background: #f1739d;
  border-radiud: 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: #f1739d;
  top: -20px;
  right: 0;
  transform: translateX(50%) rotate(45deg);
  border-radius: 2px;
}

@keyframes fillBars {
  from {
    width: 0;
  }
  to {
    width: 100%;
  }
}
.for-mobile {
  display: none;
}

.default-breadcrumb {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  list-style: none;
  margin-top: 1rem;
  margin-bottom: 1rem;
  font-size: 1.3rem;
  padding-right: 0;
}

.default-breadcrumb li.crumb {
  position: relative;
  margin-bottom: 0.5em;
  padding: 0.25em;
  background-color: #fff;
  color: #516171;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-left: 20px;
}

.default-breadcrumb li.crumb::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 100%;
  height: 100%;
  width: 1.5em;
  background-color: #fff;
  clip-path: polygon(50% 50%, -50% -50%, 0 100%);
}

.default-breadcrumb li.crumb::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 1px;
  height: 100%;
  width: 1.5em;
  background-color: #fff;
  clip-path: polygon(100% 0, 100% 100%, 0% 100%, 50% 50%, 0% 0%);
  transform: translateX(-100%);
}

.default-breadcrumb li.crumb:not(:first-child) {
  margin-left: 2em;
}

.default-breadcrumb li.crumb:first-child {
  padding-left: 0.5em;
  border-radius: 5px 0 0 5px;
}

.default-breadcrumb li.crumb:first-child::before {
  display: none;
}

.default-breadcrumb li.crumb:last-child {
  padding-right: 1em;
  border-radius: 0 5px 5px 0;
}

.default-breadcrumb li.crumb:last-child::after {
  display: none;
}

.default-breadcrumb li.crumb.active {
  background-color: #ffb9d1;
  color: #000000;
}

.default-breadcrumb li.crumb.active::before,
.default-breadcrumb li.crumb.active::after {
  background-color: #ffb9d1;
}

.default-breadcrumb li.crumb .link {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 18px;
  text-align: right;
}

.default-breadcrumb li.crumb a {
  color: #8093a7;
}

.default-breadcrumb li.crumb a:hover {
  color: #f1739d;
}

.home-bread {
  padding-left: 10px;
}
.home-bread a {
  color: #f1739d !important;
  font-size: 20px !important;
  padding: 10px;
}
.home-bread a i {
  color: #f1739d !important;
  font-size: 22px !important;
  padding-right: 10px !important;
}

*[dir=rtl] .default-breadcrumb li.crumb {
  text-align: right;
  direction: rtl !important;
}

*[dir=rtl] .default-breadcrumb li.crumb::after {
  right: 100% !important;
  left: unset !important;
  background-color: #fff;
  clip-path: polygon(50% 50%, 100% 100%, 100% 0);
}

*[dir=rtl] .default-breadcrumb li.crumb::before {
  right: 1px !important;
  left: unset !important;
  clip-path: polygon(0 0, 0 100%, 100% 100%, 50% 50%, 100% 0);
  transform: translateX(100%);
}

*[dir=rtl] .default-breadcrumb li.crumb:not(:first-child) {
  margin-right: 2em;
  margin-left: 0;
}

*[dir=rtl] .default-breadcrumb li.crumb:first-child {
  padding-right: 0.5em;
  padding-left: 0;
  border-radius: 0 5px 5px 0;
}

*[dir=rtl] .default-breadcrumb li.crumb:last-child {
  padding-right: 0;
  padding-left: 1em;
  border-radius: 5px 0 0 5px;
}

.special-course-header {
  background-image: url(../images/banner/special-offer.webp);
  position: relative;
  height: 880px;
  background-repeat: no-repeat;
  background-position: center;
}

.special-product {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  border: 2px solid #ffe4ef;
  padding: 15px 5px;
  border-radius: 6px;
  background: #fff4f8;
}
.special-product .special-cover {
  height: 220px;
  width: 250px;
  object-fit: cover;
  border-radius: 6px;
}
.special-product .special-cover img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 6px;
}
.special-product .special-name {
  font-family: kalamehweb;
  font-size: 24px;
  margin-bottom: 15px;
  font-weight: 600;
}
.special-product p {
  font-size: 14px;
  display: -webkit-box;
  max-width: 500px;
  -webkit-line-clamp: 3;
  line-height: 24px;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: right;
  direction: rtl;
}
.special-product .rower-price {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.special-product .rower-price .n-attr {
  font-size: 14px;
  color: #878787;
}
.special-product .rower-price .c-attr {
  font-size: 20px;
  color: #878787;
}
.special-product .rower-price span.toman {
  font-size: 12px;
}
.special-product .new-offer .n-attr {
  font-weight: 500;
  color: #000 !important;
}
.special-product .new-offer .c-attr {
  color: #000 !important;
  font-size: 22px;
}
.special-product .rower-btn {
  display: flex;
  flex-direction: column;
}
.special-product .rower-btn .each-special-order {
  background: #f1739d;
  font-size: 14px;
  border-radius: 6px;
  padding: 8px 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 5px 0px;
}
.special-product .rower-btn .each-special-order span {
  font-size: 14px;
  color: #fff;
  font-weight: 600;
  text-align: center;
}
.special-product .rower-btn .each-special-order i {
  font-size: 20px;
  color: #fff;
}
.special-product .rower-btn .each-special-see {
  background: #f1cbda;
  font-size: 14px;
  border-radius: 6px;
  padding: 8px 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.special-product .rower-btn .each-special-see span {
  font-size: 14px;
  color: #000;
  font-weight: 600;
  text-align: center;
}
.special-product .rower-btn .each-special-see i {
  font-size: 20px;
  color: #000000;
}

.breadcrumb-navs {
  background: none;
}

.mirror-section {
  display: flex;
  align-items: center;
}

.green-row {
  height: 800px;
  background-image: url(../images/vectors/art-decore.png);
  background-repeat: no-repeat;
  background: linear-gradient(73deg, #02322b 35%, #278376 100%);
}

.coach-workshop {
  height: 630px;
  width: 530px;
  object-fit: cover;
  background-image: url(../images/vectors/mirror.png);
  background-size: cover;
  margin-top: 108px;
  display: flex;
  justify-content: center;
}
.coach-workshop img {
  height: 90%;
  width: auto;
  object-fit: contain;
  position: relative;
  top: 124px;
}

.workshop-intro-box {
  display: flex;
  padding-top: 60px;
}
.workshop-intro-box .workshop-name {
  color: #fff;
}
.workshop-intro-box p {
  font-size: 27px;
  line-height: 45px;
  color: rgb(255, 255, 255);
  text-align: right;
  direction: rtl;
  font-family: KalamehWeb;
  font-weight: 400;
  text-shadow: rgba(0, 0, 0, 0.15) 5px 5px 0px;
}

.workshop-intro-vector {
  height: 0;
  width: 100%;
  object-fit: contain;
  position: relative;
}
.workshop-intro-vector img {
  height: 420px;
  width: 100%;
  object-fit: contain;
  position: relative;
  top: 10px;
  right: 150px;
}

.workshop-bg-design {
  position: relative;
  height: 0px;
  width: 100%;
  object-fit: contain;
  right: -255px;
  opacity: 0.2;
}
.workshop-bg-design img {
  position: absolute;
  right: 0px;
  top: -10px;
  height: 290px;
}

.wall-padding {
  padding-top: 65px;
}

.wall-design {
  height: 450px;
  width: 100%;
  background-image: url(../images/vectors/wall-design.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: left;
  margin-top: 100px;
  padding-right: 70px;
}

.learn-points {
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  margin-top: 50px;
}

.workshop-window-img {
  height: 320px;
  width: 120px;
  object-fit: cover;
  padding: 5px;
}
.workshop-window-img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.learn-points .icons-holder {
  height: 60px;
  width: 60px;
  padding: 8px;
  object-fit: contain;
  background: rgba(234, 177, 200, 0.3607843137) !important;
}

.green-access {
  background-color: #ffedf4;
  border-radius: 8px;
  direction: rtl;
  margin-top: 100px;
  padding: 100px 40px;
  background-image: url(../images/vectors/flower-vec.png);
  background-position: 15px 0px;
  background-repeat: no-repeat;
  background-size: 150px;
}

.certi-holder {
  display: flex;
  justify-content: center;
}

.regular-padding {
  padding: 5px 25px;
}

.certificate {
  height: 350px;
  width: 500px;
  position: relative;
  border-radius: 8px;
}
.certificate img {
  height: 100%;
  width: 100%;
  position: relative;
  z-index: 1;
  border-radius: 8px;
}
.certificate::before {
  width: 100%;
  height: 100%;
  position: absolute;
  background-color: #eab1c8;
  z-index: 0;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 8px;
  box-shadow: 0 0 4px #f5dae3;
  left: -5px;
  top: -10px;
  transform: rotate(-8deg);
  -moz-transform: rotate(-8deg);
  -webkit-transform: rotate(349deg);
  content: "";
}

.workshop-samples .swiper-slide.swiper-slide-active::before {
  position: absolute;
  bottom: 0px;
  right: 0;
  width: 20px !important;
  height: 20px !important;
  border-bottom: 2px solid #e4acc3 !important;
  border-right: 2px solid #e8b0c6 !important;
  border-radius: 0 0 4px 0;
  content: "";
  transition: all 0.3s ease;
}
.workshop-samples .swiper-slide.swiper-slide-active::after {
  position: absolute;
  top: 0;
  left: 10px;
  width: 20px !important;
  height: 20px !important;
  border-top: 2px solid #e2abc1 !important;
  border-left: 2px solid #e7afc6 !important;
  border-radius: 4px 0 0 0;
  content: "";
  transition: all 0.3s ease;
}

.workshop-samples .swiper-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgb(255, 237, 244), rgba(0, 0, 0, 0));
}
.workshop-samples .swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to left, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0));
}
.workshop-samples .shop-img {
  height: 320px;
  width: 100%;
  object-fit: cover;
  margin-bottom: 10px;
}
.workshop-samples .swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
}

.first-s-box {
  margin-top: 112px;
}

.second-s-box {
  margin-top: -10px;
}

.third-s-box {
  margin-top: 40px;
}

.btn-area-direct {
  display: flex;
  align-items: center;
  justify-content: start;
  direction: rtl;
}

.sign-in-workshop {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #ffffff;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  padding: 8px 15px;
  margin-top: 0px;
  min-width: 250px;
  border-radius: 6px;
  position: relative;
  right: 0px;
}
.sign-in-workshop span {
  color: #000000;
  font-size: 18px;
  font-weight: 600;
}
.sign-in-workshop img {
  height: 30px;
  margin-left: 10px;
}
.sign-in-workshop i {
  font-size: 20px;
  color: #507d77;
  margin-top: 1px;
}

.submit-workshop:hover {
  background: linear-gradient(30deg, #f56295 35%, #fff2f6 100%);
}
.submit-workshop:hover span {
  color: #000;
}

.workshop-summery {
  border-radius: 8px;
  margin-top: 50px;
}
.workshop-summery .about-title {
  color: #000000;
}

.workshop-en-name {
  font-family: Sinethar;
  font-size: 100px;
  color: #278376;
}

.workshop-name {
  font-family: KalamehWeb;
  font-weight: 600;
  font-size: 53px;
  margin-bottom: 20px;
  display: flex;
  flex-direction: row-reverse;
}

.workshop-description {
  margin-top: 30px;
  margin-bottom: 25px;
}

.middle-padding {
  padding: 15px;
}

.items-intro-title {
  font-size: 22px;
  font-family: KalamehWeb;
  font-weight: 600;
  margin-top: 30px;
  background: #278376;
  padding: 5px 20px;
  width: max-content;
  border-radius: 8px;
  position: absolute;
  color: #fff;
  top: -50px;
  right: 30px;
}

.position-relative {
  position: relative;
}

.workshop-list-item-wrapp {
  display: flex;
  align-items: center;
}

.wrapp-line {
  display: flex;
  flex-wrap: wrap;
  border: 2.5px solid #59847e;
  border-radius: 8px;
  padding-bottom: 15px;
  padding-top: 30px;
}

.flower-box {
  height: 240px;
  width: 100%;
  object-fit: contain;
}
.flower-box img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.workshop-learn-list .icons-holder {
  height: 35px !important;
  padding: 2px;
  width: 35px !important;
}
.workshop-learn-list .service-box h3 {
  font-weight: 500 !important;
}

.service-wrapp.workshop-learn-list {
  margin: 5px 0px !important;
}

.summery-bnnr {
  background-image: url(../images/vectors/worshop-window.png);
  height: 420px;
  background-repeat: no-repeat;
  position: relative;
  background-position: left;
  background-size: contain;
}
.summery-bnnr .summery-bnr-img {
  height: 350px;
  width: 280px;
  object-fit: cover;
  position: relative;
  border-radius: 8px;
}
.summery-bnnr .summery-bnr-img img {
  height: 100%;
  position: absolute;
  width: 100%;
  object-fit: cover;
  border-radius: 8px;
  top: 70px;
  left: -60px;
}

.padding-fix {
  padding: 0px 28px !important;
}

.date-submiting {
  display: flex;
  height: 700px;
  background: linear-gradient(73deg, #02322b 35%, #278376 100%);
  border-radius: 8px;
  padding: 50px 60px;
  margin-top: 55px;
}
.date-submiting .submitting-description {
  margin-bottom: 25px;
}
.date-submiting .submitting-description p {
  color: #fff;
}
.workshop-detail-box {
  padding: 10px 15px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: space-between;
  background: rgba(255, 255, 255, 0.15);
  margin-bottom: 20px;
}
.workshop-detail-box .wrapp-fd-box {
  display: flex;
  align-items: center;
  flex-direction: column;
}
.workshop-detail-box strong {
  font-size: 15px;
  color: #fff;
}
.workshop-detail-box .fd-img {
  height: 50px;
  width: 50px;
  object-fit: contain;
  padding: 5px;
  background: linear-gradient(73deg, rgba(21, 21, 21, 0.43) 35%, rgba(255, 255, 255, 0) 100%);
  border-radius: 10px;
  margin-bottom: 8px;
}
.workshop-detail-box .fd-img img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}
.workshop-detail-box .wrapp-sd-box p {
  color: #fff;
  font-size: 15px;
}

.box-big-design {
  position: relative;
  width: 120px;
}
.box-big-design img {
  position: absolute;
  top: -50px;
  right: -50px;
}

.box-mini-design {
  position: relative;
  width: 120px;
}
.box-mini-design img {
  position: absolute;
  top: -87px;
  left: -11px;
}

.submit-design {
  width: 100%;
  display: flex;
  justify-content: end;
}

.box-submit-class {
  background: rgba(255, 255, 255, 0.2);
  width: 97%;
  border-radius: 8px;
  position: relative;
  top: -13px;
  right: -13px;
  height: 390px;
}

.wrapp-detail-boxes {
  display: flex;
  height: 100%;
  align-items: center;
  align-content: center;
}

.wrapp-sub-design {
  position: relative;
}

.submit-workshop {
  background-color: #ffd4e3;
  display: flex;
  align-items: center;
  border-radius: 8px;
  padding: 15px 15px;
  background-image: url(../images/vectors/flower-vec.png);
  background-size: 30px;
  background-position: top left;
  background-repeat: no-repeat;
  justify-content: space-between;
  height: 80px;
}
.submit-workshop img {
  height: 50px;
}
.submit-workshop p {
  color: #000;
  font-size: 16px;
}
.submit-workshop p span {
  color: #e4316c;
}
.submit-workshop p .date-work {
  font-weight: 600;
  margin-right: 8px;
  font-size: 24px;
}
.submit-workshop p .month-work {
  font-size: 18px;
  margin-left: 4px;
  font-weight: 600;
}
.submit-workshop i {
  font-size: 22px;
  color: #02322b;
}

.box-submit-class .row {
  display: flex;
  padding: 25px;
  justify-content: space-around;
}

.green-box-title {
  color: #fff;
}

.average-data {
  background-color: rgb(255, 239, 244);
  background-image: url(../images/vectors/flower-vec.png);
  background-size: 50px;
  background-position: top left;
  background-repeat: no-repeat;
  padding: 20px 25px;
  margin-top: 20px;
  border-radius: 8px;
}
.average-data .class-status-header h3 {
  display: flex;
  color: #000000;
  align-items: center;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1098039216);
  padding-bottom: 15px;
  font-size: 16px;
}
.average-data .class-status-header h3 .date-work {
  font-weight: 600;
  margin-right: 8px;
  font-size: 24px;
}
.average-data .class-status-header h3 .month-work {
  font-size: 18px;
  margin-left: 4px;
  font-weight: 600;
  margin-right: 5px;
}
.average-data .class-status i {
  color: #d22d64;
  font-size: 12px;
  margin-left: 8px;
}
.average-data .class-status strong {
  font-size: 14px;
  font-weight: 600;
  color: #000000;
}
.average-data .class-status span {
  font-size: 18px;
  color: #000000;
  font-weight: 600;
  margin-right: 10px;
}

.progress-work*:not([data-progress]) {
  margin: 5px 0;
  font-size: 14px;
}

.progress-work {
  width: 100%;
  max-width: 500px;
  padding: 15px;
  box-sizing: border-box;
}

.progress-work[data-progress] {
  height: 15px;
  box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.25) inset;
  border-radius: 2px;
  margin: 5px 0 10px 0;
  overflow: hidden;
}

[data-progress]::after {
  content: "";
  display: flex;
  justify-content: flex-end;
  align-items: center;
  background-image: linear-gradient(#f1739d, #ec5187 50%, #f56295 50%);
  width: 0;
  height: 100%;
  box-sizing: border-box;
  font-size: 12px;
  font-weight: 600;
  color: rgb(0, 0, 0);
  padding: 0 10px;
  transition: 2s;
  border-radius: 0px 20px 20px 0px;
}

.animate-progress {
  border-radius: 2px;
  background: rgb(255, 212, 227);
}

[data-progress].animate-progress::after {
  content: attr(data-progress) "%";
  width: var(--animate-progress);
}

.progress {
  height: 62px !important;
  background: none !important;
  display: flex !important;
  border-radius: 2px !important;
  flex-direction: column !important;
  width: 100% !important;
  direction: ltr !important;
}
.progress p {
  margin-bottom: 12px;
  direction: rtl;
  font-size: 16px;
  color: #000000;
  font-weight: 600;
}
.progress p i {
  color: #d22d64;
  font-size: 12px;
  margin-left: 8px;
}
.progress p strong {
  margin-right: 10px;
}

.workshop-cart {
  margin-bottom: 35px;
  text-align: right;
  height: 28rem !important;
  padding: 15px;
  background-color: #f8eff2 !important;
  border-radius: 4px;
  border: 2px solid #f5cdda !important;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  background-image: url(../images/vectors/super-white-flower.webp) !important;
  background-size: 150px !important;
  background-position: -48px 180px;
  background-repeat: no-repeat;
}
.workshop-cart .money {
  height: unset;
}
.workshop-cart a.w-see-course {
  justify-content: space-between;
  display: flex;
  justify-content: space-between;
  background: linear-gradient(259deg, #e4316c 35%, #b6003d 100%);
  color: #ffffff;
  color: #ffffff;
}
.workshop-cart .wrapp-date {
  display: flex;
  align-items: center;
}
.workshop-cart .wrapp-date span {
  font-weight: 400;
  font-size: 13px;
}
.workshop-cart .workshop-date {
  color: #000;
}
.workshop-cart section {
  color: #000;
}
.workshop-cart section strong {
  font-size: 14px;
  margin-bottom: 8px;
}
.workshop-cart .clime {
  font-size: 16px;
  margin: 0px 3px;
  font-weight: 600;
  color: #d22d64;
}
.workshop-cart .person-thing i {
  color: #d22d64;
  font-size: 16px;
  margin-left: 4px;
}
.workshop-cart .person-thing strong {
  font-size: 14px;
  color: #000;
}
.workshop-cart .name-course {
  margin-top: 0px;
  font-size: 1.1rem;
  line-height: 28px;
  font-weight: 600;
}
.workshop-cart .workshop-label-deactive {
  position: relative;
}
.workshop-cart .workshop-label-deactive h4 {
  position: absolute;
  background-color: #7d002a;
  background-image: url(../images/vectors/sweet.png);
  background-size: 17px;
  background-repeat: no-repeat;
  background-position: 85px 6px;
  color: #f8eff2;
  top: -220px;
  left: 0px;
  font-size: 13px;
  padding: 5px 15px;
  display: flex;
  border-radius: 3px;
  padding-right: 30px;
  align-items: center;
  padding-top: 7px;
}
.workshop-cart .workshop-label-active {
  position: relative;
}
.workshop-cart .workshop-label-active h4 {
  position: absolute;
  background-color: #278376;
  background-image: url(../images/vectors/active-ico.png);
  background-size: 10px;
  background-repeat: no-repeat;
  background-position: 95px 5px;
  color: #f8eff2;
  top: -220px;
  left: 0px;
  font-size: 13px;
  padding: 5px 15px;
  display: flex;
  border-radius: 3px;
  padding-right: 30px;
  align-items: center;
  padding-top: 7px;
}

.workshop-intro {
  width: 100%;
}

.add-workshop-cart {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-direction: row-reverse;
}

.add-workshop-cart {
  margin-top: 15px;
}
.add-workshop-cart .course-price {
  margin-right: 20px;
  font-family: iranyekanBakh !important;
  color: #ffffff;
  font-size: 20px;
  direction: rtl;
}
.add-workshop-cart .course-price span {
  font-size: 33px;
  color: #ffffff;
  font-family: iranyekanBakh !important;
  font-weight: 600;
}
.add-workshop-cart .course-price del {
  color: #a6c9c5;
  margin-left: 8px;
}
.add-workshop-cart .course-price .toman {
  font-family: iranyekanBakh !important;
  font-size: 16px;
}

.de-active-workshop .submit-workshop {
  background-color: #868686;
}
.de-active-workshop .submit-workshop:hover {
  background: linear-gradient(30deg, #939393 35%, #fff2f6 100%);
}
.de-active-workshop .average-data {
  background-color: rgb(134, 134, 134);
}
.de-active-workshop .progress p i {
  color: #000000;
  font-size: 12px;
  margin-left: 8px;
}
.de-active-workshop .average-data .class-status i {
  color: #000000;
  font-size: 12px;
  margin-left: 8px;
}
.de-active-workshop .animate-progress {
  border-radius: 2px;
  background: rgb(80, 80, 80);
}
.de-active-workshop [data-progress]::after {
  background-image: linear-gradient(#323232, #212020 50%, #000000 50%);
  font-size: 12px;
  font-weight: 600;
  color: rgb(255, 255, 255);
}
.de-active-workshop .submit-workshop p span {
  color: #000000;
}

/* End Progress bar CSS */
@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: #ffe3ed;
    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;
  }
  .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) {
  .w-name-course-content .heading-design {
    position: absolute;
    right: -20px;
    display: block;
    height: 45px;
    width: 6px;
    border-radius: 0px 4px 4px 0px;
    background: #f1739d;
  }
  .add-to-cart-btn {
    background: #d22d64;
    padding: 2px;
    border-radius: 6px;
    color: #fff;
    width: 158px !important;
    height: 45px;
  }
  .add-to-cart-btn img {
    height: 35px;
    width: 35px;
    margin-left: 15px;
  }
  .add-to-cart-btn strong {
    font-size: 12px;
  }
  .course-price-row .course-price {
    margin-top: 20px;
  }
  .course-price-row .course-price strong {
    font-size: 16px;
  }
  .next-video {
    height: 82px;
  }
  .video-description-action {
    display: flex;
    direction: rtl;
    justify-content: space-between;
    padding: 0px 0px;
    flex-direction: column;
  }
  .video-description-action .download-video {
    border: 1px solid #f1739d;
    padding: 7px 10px;
    border-radius: 5px;
    color: #000000;
    display: inline-block;
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: baseline;
  }
  .video-area {
    padding: 0px 8px;
    margin-top: 50px;
  }
  .video {
    display: block;
    cursor: pointer;
    width: 100%;
    position: relative;
    top: 50%;
    height: 100%;
    transition: all linear 0.5s;
    transform: translateY(-50%);
    border-radius: 10px;
    object-fit: contain;
  }
  .video-column {
    float: unset;
    max-width: 100% !important;
    width: 100% !important;
    padding: 0px 1px;
    padding-left: 0;
  }
  .video-player {
    background: #ffe3ed;
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 400px;
    padding: 10px;
    border-radius: 10px;
  }
  .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;
  }
  .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;
  }
}
.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.space-top {
  margin-top: 200px;
}

@font-face {
  font-display: swap;
  font-family: iranyekanBakh;
  font-weight: 400;
  src: local("?"), url("/assets/font/fonts/ttf/Yekan-Bakh-FaNum-04-Regular.woff") format("woff");
}
@font-face {
  font-display: swap;
  font-family: iranyekanBakh;
  font-weight: 500;
  src: local("?"), url("/assets/font/fonts/ttf/Yekan-Bakh-FaNum-06-Bold.woff") format("woff");
}
@font-face {
  font-display: swap;
  font-family: iranyekanBakh;
  font-weight: 600;
  src: local("?"), url("/assets/font/fonts/ttf/Yekan-Bakh-FaNum-06-Bold.woff") format("woff");
}
@font-face {
  font-display: swap;
  font-family: iranyekanBakh;
  font-weight: 600;
  src: local("?"), url("/assets/font/fonts/ttf/Yekan-Bakh-FaNum-08-Fat.woff") format("woff");
}
@font-face {
  font-family: LilitaOne;
  src: local("?"), url("/assets/font/fonts/ttf/LilitaOne-Regular.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: Cinema;
  font-weight: 600;
  src: local("?"), url("../../assets/font/fonts/ttf/CinemaFont.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: KalamehWeb;
  font-weight: 500;
  src: local("?"), url("../../assets/font/fonts/ttf/KalamehWeb_Regular.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: IRANYekan;
  font-weight: 500;
  src: local("?"), url("../../assets/font/fonts/ttf/IRANYekanMediumFaNum.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: KalamehWeb;
  font-weight: 600;
  src: local("?"), url("../../assets/font/fonts/ttf/KalamehWeb_Black.ttf") format("truetype");
}
@font-face {
  font-display: swap;
  font-family: Sinethar;
  font-weight: 600;
  src: local("?"), url("../../assets/font/fonts/ttf/Sinethar.woff2");
}
@media (min-width: 1400px) {
  .main-container {
    max-width: 90vw;
  }
}
@media (min-width: 1600px) {
  .main-container {
    max-width: 80vw;
  }
}
@media (max-width: 1200px) {
  .main-container {
    max-width: 100%;
  }
}
body {
  font-size: 13px;
  color: rgb(34, 34, 34);
  background: #ffffff;
  font-weight: 400;
  font-family: iranyekanBakh !important;
  overflow-x: hidden;
}

* {
  box-sizing: border-box;
  z-index: auto;
  scroll-behavior: smooth;
}

img {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
}

::-webkit-scrollbar {
  background: #cecece;
  height: 5px;
  width: 8px;
}

::-webkit-scrollbar-thumb {
  background: #278376;
  border-radius: 2px;
}

::-webkit-scrollbar-thumb:hover {
  background: #f7a1ff;
}

a {
  text-decoration: none !important;
  cursor: pointer !important;
}

a:focus,
a:active {
  text-decoration: underline;
  outline: none;
  color: #e4316c;
}

input,
select,
textarea {
  outline: none;
  cursor: pointer;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  margin: 0px;
  appearance: none !important;
}

input:focus,
select:focus,
textarea:focus {
  cursor: pointer;
  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;
}

h2 {
  margin: 0px;
  padding: 0px;
  font-weight: bold;
  color: rgb(34, 34, 34);
  font-size: 36px;
}

figure {
  margin-bottom: 50px;
  text-align: center;
}

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: #000;
}

input:focus::-webkit-input-placeholder {
  color: #000;
}

label {
  display: block;
  margin-bottom: 5px;
  color: #e4316c;
}

textarea {
  color: #000;
}

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: "e";
  width: 100%;
  height: 100%;
  position: absolute;
  font-size: 16px;
  color: green;
}

.breadcrumb {
  color: #000;
  font-size: 16px;
  padding-right: 15px;
}
.breadcrumb a {
  color: #000;
}
.breadcrumb i {
  color: #f1739d;
}
.breadcrumb span {
  color: rgb(226, 193, 255);
  font-weight: 600;
  margin: 0px 8px;
}
.breadcrumb .active {
  color: #f56295;
}

@media (max-width: 800px) {
  .breadcrumb {
    font-size: 12px;
  }
}
.form-control {
  font-family: iranyekanBakh !important;
}

input::placeholder {
  font-family: iranyekanBakh !important;
}

input,
button,
form,
select,
option,
textarea,
table {
  font-family: iranyekanBakh !important;
}

/**
 * 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;
  -moz-backface-visibility: hidden;
}

.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;
  -webkit-transform: translate3d(0, 0, 0);
}

.owl-carousel .owl-item,
.owl-carousel .owl-wrapper {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
}

.owl-carousel .owl-item {
  min-height: 1px;
  float: left;
  -webkit-backface-visibility: hidden;
  -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;
  -webkit-backface-visibility: hidden;
  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%;
}

.swiper-slide {
  /* Center slide text vertically */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

/* override swipers transition */
.swiper-container-free-mode > .swiper-wrapper {
  -webkit-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  transition-timing-function: linear;
}

.swiper-container {
  padding: 10px 100px !important;
  overflow: hidden;
}

.pol-2 {
  direction: ltr !important;
}

.video-cover {
  height: 85%;
  width: 100%;
  object-fit: cover;
  background-image: url(../../assets/images/banner/bg.webp);
  border-radius: 6px;
  position: relative;
  background-size: cover;
}

.video-filter {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 6px;
  background-size: cover;
  background-position: 0;
}

.video-part {
  padding: 30px 60px;
  padding-left: 25px;
}

.video-play-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.video-play-button {
  position: absolute;
  z-index: 10;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  box-sizing: content-box;
  display: block;
  width: 32px;
  height: 44px;
  outline: none;
  border: none;
  border-radius: 50%;
  padding: 18px 20px 18px 28px;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}

.video-play-button:before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 80px;
  height: 80px;
  background: rgba(255, 255, 255, 0.3568627451);
  border-radius: 50%;
  animation: pulse-border 1500ms ease-out infinite;
}

.video-play-button:after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 80px;
  height: 80px;
  background: rgba(255, 255, 255, 0.1058823529);
  border-radius: 50%;
  transition: all 200ms;
}

.video-play-button:hover:after {
  background-color: #fff;
}

.video-play-button:before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  display: block;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  animation: pulse-border 1500ms ease-out infinite;
}

.video-play-button img {
  position: relative;
  z-index: 3;
  max-width: 100%;
  width: auto;
  height: auto;
}

.video-play-button span {
  display: block;
  position: relative;
  z-index: 3;
  width: 0;
  height: 0;
  border-left: 32px solid #fff;
  border-top: 22px solid transparent;
  border-bottom: 22px solid transparent;
}

@keyframes pulse-border {
  0% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}
.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.space-top {
  margin-top: 200px;
}

.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;
}

header.header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.back-home i {
  font-size: 18px;
  color: #000;
}

.layout.has-sidebar {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
}

.layout .header {
  -webkit-transition: width, 0.3s;
  transition: width, 0.3s;
  height: 64px;
  min-height: 64px;
  position: relative;
  background-color: #fff;
}

.layout .sidebar-panel {
  width: 280px;
  min-width: 280px;
  -webkit-transition: width, left, right, 0.3s;
  transition: width, left, right, 0.3s;
}

.layout .sidebar-panel.collapsed {
  width: 80px;
  min-width: 80px;
}

.wrapp-image-right {
  height: 300px;
  object-fit: cover;
}

.wrapp-image-second {
  height: 180px;
  object-fit: cover;
}

.wrapp-image-third {
  height: 115px;
  object-fit: cover;
}

.last-wrapp-content {
  margin-bottom: 100px;
}

.sidebar-header {
  padding: 10px 20px;
}
.sidebar-header h4 {
  font-size: 1rem;
  color: #fff;
  margin-right: 1.5rem;
  margin-bottom: 0px;
}
.sidebar-header .user-profile {
  height: 50px;
  width: 50px;
  object-fit: cover;
  outline: 2px solid rgba(255, 255, 255, 0.3019607843);
  outline-offset: -1px;
  border-radius: 50%;
}
.sidebar-header .user-profile img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.layout .sidebar-panel.collapsed .sidebar-header {
  padding: 10px 10px;
  padding-left: 0;
  padding-right: 15px;
}
.layout .sidebar-panel.collapsed .sidebar-header h4 {
  display: none;
}

@media (max-width: 480px) {
  .layout .sidebar-panel.break-point-xs {
    position: fixed;
    left: -280px;
    height: 100%;
    top: 0;
    z-index: 100;
  }
  .layout .sidebar-panel.break-point-xs.collapsed {
    left: -80px;
  }
  .layout .sidebar-panel.break-point-xs.toggled {
    left: 0;
  }
  .layout .sidebar-panel.break-point-xs.toggled ~ .overlay {
    display: block;
  }
  .layout .sidebar-panel.break-point-xs ~ .layout .header {
    width: 100% !important;
    -webkit-transition: none;
    transition: none;
  }
}
@media (max-width: 768px) {
  .layout .sidebar-panel.break-point-md {
    position: fixed;
    left: -280px;
    height: 100%;
    top: 0;
    z-index: 100;
  }
  .layout .sidebar-panel.break-point-md.collapsed {
    left: -80px;
  }
  .layout .sidebar-panel.break-point-md.toggled {
    left: 0;
  }
  .layout .sidebar-panel.break-point-md.toggled ~ .overlay {
    display: block;
  }
  .layout .sidebar-panel.break-point-md ~ .layout .header {
    width: 100% !important;
    -webkit-transition: none;
    transition: none;
  }
}
@media (max-width: 992px) {
  .layout .sidebar-panel.break-point-lg {
    position: fixed;
    left: -280px;
    height: 100%;
    top: 0;
    z-index: 100;
  }
  .layout .sidebar-panel.break-point-lg.collapsed {
    left: -80px;
  }
  .layout .sidebar-panel.break-point-lg.toggled {
    left: 0;
  }
  .layout .sidebar-panel.break-point-lg.toggled ~ .overlay {
    display: block;
  }
  .layout .sidebar-panel.break-point-lg ~ .layout .header {
    width: 100% !important;
    -webkit-transition: none;
    transition: none;
  }
}
@media (max-width: 1200px) {
  .layout .sidebar-panel.break-point-xl {
    position: fixed;
    left: -280px;
    height: 100%;
    top: 0;
    z-index: 100;
  }
  .layout .sidebar-panel.break-point-xl.collapsed {
    left: -80px;
  }
  .layout .sidebar-panel.break-point-xl.toggled {
    left: 0;
  }
  .layout .sidebar-panel.break-point-xl.toggled ~ .overlay {
    display: block;
  }
  .layout .sidebar-panel.break-point-xl ~ .layout .header {
    width: 100% !important;
    -webkit-transition: none;
    transition: none;
  }
}
@media (max-width: 1600px) {
  .layout .sidebar-panel.break-point-xxl {
    position: fixed;
    left: -280px;
    height: 100%;
    top: 0;
    z-index: 100;
  }
  .layout .sidebar-panel.break-point-xxl.collapsed {
    left: -80px;
  }
  .layout .sidebar-panel.break-point-xxl.toggled {
    left: 0;
  }
  .layout .sidebar-panel.break-point-xxl.toggled ~ .overlay {
    display: block;
  }
  .layout .sidebar-panel.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;
    font-size: 18px;
    color: #000;
  }
}
@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-panel {
  height: 100%;
  overflow: auto;
}

.layout.fixed-sidebar .sidebar-panel ~ .layout {
  height: 100%;
  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-panel.collapsed ~ .layout .header {
  width: calc(100% - 80px);
}

.layout.rtl {
  direction: rtl;
}

.label {
  padding: 10px;
  font-size: 18px;
  color: #111;
}

.course-pass {
  text-align: center;
}
.course-pass p {
  font-size: 1rem;
  font-weight: 500;
}
.course-pass a {
  color: #f1739d;
}
.course-pass h3 {
  font-size: 1.2rem;
  color: #000;
  padding: 15px;
  border-bottom: 1px solid #f9efff;
}

.open-current-submenu {
  box-shadow: none !important;
}

.none-result h5 {
  font-size: 24px;
  text-align: center;
  margin-bottom: 10px;
  margin-top: 15px;
}
.none-result .wrapp-hint {
  display: flex;
  text-align: center;
  justify-content: center;
  align-items: center;
}
.none-result .wrapp-hint p {
  font-size: 20px;
  font-weight: 500;
  color: #000000;
  border-left: 1px solid #ccc;
  padding: 0px 10px;
}
.none-result .wrapp-hint a {
  color: #f1739d;
  font-weight: 600;
  margin-right: 10px;
  font-size: 18px;
  display: flex;
  align-items: center;
}

.none-search-img {
  height: 250px;
  object-fit: contain;
  margin: 30px;
}
.none-search-img img {
  height: 100%;
  object-fit: contain;
}

.copy-text {
  position: relative;
  padding: 10px 40px;
  background: #fff;
  border: 1px solid #ececec;
  border-radius: 10px;
  display: flex;
  justify-content: space-between;
  margin-top: 15px;
}

.copy-text input.text {
  padding: 10px;
  font-size: 20px;
  color: #000000;
  border: none;
  outline: none;
  font-weight: 600;
  text-align: center;
  width: 100% !important;
}

.copy-text button {
  padding: 10px;
  background: #f1739d;
  color: #fff;
  font-size: 18px;
  border: none;
  outline: none;
  border-radius: 10px;
  cursor: pointer;
  width: 58px;
  height: 53px;
  position: relative;
  margin-top: 0px;
}

.copy-text button:active {
  background: #f1739d;
}

.copy-text button:before {
  content: " کپی شد 💜       ";
  color: #000000;
  font-weight: 600;
  position: absolute;
  top: -75px;
  left: 0px;
  background: #ded3ff;
  padding: 8px 10px;
  width: 120px;
  border-radius: 20px;
  font-size: 15px;
  display: none;
}

.copy-text button:after {
  content: "";
  position: absolute;
  top: -42px;
  left: 25px;
  width: 10px;
  height: 10px;
  background: #ded3ff;
  transform: rotate(45deg);
  display: none;
}

.copy-text.active button:before,
.copy-text.active button:after {
  display: block;
}

.col-lg-6 > .download-btn {
  display: flex;
  background: #fbfaff;
  padding: 8px 12px;
  border-radius: 8px;
  position: relative;
  border: 1px solid rgb(242, 242, 242);
}
.col-lg-6 > .download-btn a {
  display: flex;
  color: #0e0128;
  font-size: 1rem;
  align-items: center;
  cursor: pointer;
}
.col-lg-6 > .download-btn a .dwn-icons {
  height: 60px;
  padding: 10px;
  width: 60px;
  object-fit: cover;
}
.col-lg-6 > .download-btn a .dwn-icons img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.col-lg-6 > .download-btn a i {
  position: absolute;
  left: 8px;
  font-size: 1.1rem;
  color: #f1739d;
}
.col-lg-6 > .download-btn:hover {
  background-color: #ded3ff;
}

.steps-license h5 {
  margin-bottom: 0px;
  background-color: #ccbbff;
  padding: 10px;
  width: 35px;
  height: 35px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  border-radius: 8px;
  margin-left: 8px;
}
.steps-license p {
  margin-top: 15px;
  font-size: 1rem;
}
.steps-license img {
  border-radius: 8px;
  margin-top: 20px;
}
.steps-license a {
  color: #f1739d;
  font-weight: 600;
}

.download-title {
  font-size: 1.3rem;
  font-weight: 600;
  display: flex;
  align-items: center;
}
.download-title i {
  color: #f1739d;
}

@media (max-width: 480px) {
  .layout.rtl .sidebar-panel.break-point-xs {
    left: auto;
    right: -280px;
  }
  .layout.rtl .sidebar-panel.break-point-xs.collapsed {
    left: auto;
    right: -80px;
  }
  .layout.rtl .sidebar-panel.break-point-xs.toggled {
    left: auto;
    right: 0;
  }
}
@media (max-width: 576px) {
  .layout.rtl .sidebar-panel.break-point-sm {
    left: auto;
    right: -280px;
  }
  .layout.rtl .sidebar-panel.break-point-sm.collapsed {
    left: auto;
    right: -80px;
  }
  .layout.rtl .sidebar-panel.break-point-sm.toggled {
    left: auto;
    right: 0;
  }
}
@media (max-width: 768px) {
  .layout.rtl .sidebar-panel.break-point-md {
    left: auto;
    right: -280px;
  }
  .layout.rtl .sidebar-panel.break-point-md.collapsed {
    left: auto;
    right: -80px;
  }
  .layout.rtl .sidebar-panel.break-point-md.toggled {
    left: auto;
    right: 0;
  }
}
@media (max-width: 992px) {
  .layout.rtl .sidebar-panel.break-point-lg {
    left: auto;
    right: -280px;
  }
  .layout.rtl .sidebar-panel.break-point-lg.collapsed {
    left: auto;
    right: -80px;
  }
  .layout.rtl .sidebar-panel.break-point-lg.toggled {
    left: auto;
    right: 0;
  }
}
@media (max-width: 1200px) {
  .layout.rtl .sidebar-panel.break-point-xl {
    left: auto;
    right: -280px;
  }
  .layout.rtl .sidebar-panel.break-point-xl.collapsed {
    left: auto;
    right: -80px;
  }
  .layout.rtl .sidebar-panel.break-point-xl.toggled {
    left: auto;
    right: 0;
  }
}
@media (max-width: 1600px) {
  .layout.rtl .sidebar-panel.break-point-xxl {
    left: auto;
    right: -280px;
  }
  .layout.rtl .sidebar-panel.break-point-xxl.collapsed {
    left: auto;
    right: -80px;
  }
  .layout.rtl .sidebar-panel.break-point-xxl.toggled {
    left: auto;
    right: 0;
  }
}
.layout {
  z-index: 1;
}

.layout .header {
  box-shadow: 1px 1px 4px #9aa0b9;
  display: flex;
  align-items: center;
  padding: 20px;
}

.layout .content {
  padding: 20px;
  display: flex;
  flex-direction: column;
}

.user-panel-title {
  background: #ffe4ef;
  padding: 10px 10px;
  border-radius: 8px;
}
.user-panel-title strong {
  font-weight: 500;
  font-size: 17px;
}

.user-panel-row-padding {
  padding: 0px 10px;
}
.user-panel-row-padding .name-course {
  font-size: 16px;
  height: 50px;
}

.wrapp-content {
  padding: 40px 15px;
  padding-bottom: 50px;
  background: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  margin-top: 10px;
}
.wrapp-content h5 {
  font-weight: 900;
  font-size: 22px;
  margin-top: 20px;
}

.layout .footer {
  text-align: center;
  margin-top: auto;
  margin-bottom: 20px;
  padding: 20px;
}

.layout.rtl .header {
  box-shadow: -1px 1px 4px #9aa0b9;
}

.sidebar-panel {
  color: #b3b8d4;
  overflow-x: hidden !important;
  position: relative;
  background-color: #a32851;
}

#btn-collapse {
  font-size: 18px;
  display: flex;
  color: #000;
}

.sidebar-panel .image-wrapper {
  overflow: hidden;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  top: 60%;
  opacity: 0.2;
  z-index: 1;
  display: none;
}

.sidebar-panel .image-wrapper > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.sidebar-panel.has-bg-image .image-wrapper {
  display: block;
}

.sidebar-panel .sidebar-layout {
  height: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
  z-index: 2;
}

.sidebar-panel .sidebar-layout .sidebar-header {
  height: 64px;
  min-height: 64px;
  display: flex;
  align-items: center;
  padding: 10px 20px;
  border-bottom: 1px solid rgba(83, 93, 125, 0.3);
}

.sidebar-panel .sidebar-layout .sidebar-header > span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.sidebar-panel .sidebar-layout .sidebar-content {
  flex-grow: 1;
  padding: 10px 0;
}

.sidebar-panel .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-panel .sidebar-layout .sidebar-footer > span {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.reply-comment {
  margin-left: 10px;
}

.reply {
  padding: 30px;
}

@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-panel.menu ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}

li.menu-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 15px;
}
li.menu-item i.fa-chevron-left {
  font-size: 10px;
}
li.menu-item:hover {
  background: #0e0128;
}

.menu-item .log-out-icn {
  margin-left: 20px;
}
.menu-item .log-out-icn i {
  font-size: 20px;
}
.menu-item button {
  border: none;
  padding: 0;
  height: 50px;
  background: none;
  box-shadow: none !important;
  color: #fff;
  display: flex;
  align-items: center;
  padding-right: 28px;
  font-size: 0.8rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex-grow: 1;
  transition: color 0.3s;
}

.layout .sidebar-panel.collapsed .menu-title {
  display: none;
}

.layout .sidebar-panel.collapsed .menu-title .log-out-icn {
  display: none;
}

.layout .sidebar-panel.collapsed li.menu-item i.fa-chevron-left {
  display: none;
}

.layout .sidebar-panel .menu .menu-item a {
  display: flex;
  align-items: center;
  height: 50px;
  padding: 0 20px;
  color: #ffffff;
}

.accordion-button.user-panel::after {
  display: none;
}

.course-panel-item {
  padding: 0;
}

.user-panel {
  height: 38px;
  width: 120px !important;
  border-radius: 9px !important;
  text-align: center;
  background: #f1739d !important;
  color: #fff !important;
  font-size: 15px;
  font-weight: 500;
  -webkit-transition: all 0.3s linear;
  transition: all 0.3s linear;
  border: 0;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: relative;
  z-index: 1;
  margin-right: 12px;
}
.user-panel span {
  margin-bottom: 3px;
}
.user-panel:hover {
  background-color: #000;
}

.wrap-course-panel {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.course-cart-wrapp {
  display: flex;
}

.dashboard-icon {
  padding: 8px;
  background: hsl(338.18, 100%, 97.84%);
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 15%;
  margin-left: 15px;
}
.dashboard-icon i {
  font-size: 28px;
  height: 38px;
  color: #f1739d;
}

.wrap-course-panel {
  display: flex;
  border: 1px solid rgb(242, 242, 242);
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  padding: 15px;
  border-radius: 8px;
}
.wrap-course-panel h3 {
  color: #841339;
  font-size: 1.2rem;
  display: flex;
  align-items: center;
  margin-top: 10px;
  font-weight: 600;
}
.wrap-course-panel h3 span {
  font-size: 12px;
  border-radius: 15px;
  background: hsl(338.18, 100%, 97.84%);
  padding: 2px 10px;
  text-align: center;
  margin-right: 10px;
}
.wrap-course-panel .wrapp-mini-detail {
  display: flex;
  align-items: center;
  margin-bottom: 0px;
}
.wrap-course-panel .wrapp-mini-detail strong {
  font-size: 1rem;
  color: #000;
  display: block;
  width: 80px;
  margin-left: 10px;
}
.wrap-course-panel .wrapp-mini-detail strong i {
  font-size: 6px;
  margin-left: 10px;
  color: #e2d8ff;
}
.wrap-course-panel .wrapp-mini-detail span {
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 30px;
}
.wrap-course-panel .course-img-panel {
  height: 200px;
  width: 250px;
  object-fit: cover;
  border-radius: 8px;
  margin-left: 20px;
}
.wrap-course-panel .course-img-panel img {
  height: 100%;
  width: 100%;
  border-radius: 8px;
}

.btn-course-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-left: 25px;
}

.see-course-btn {
  padding: 5px 15px;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  background: #f1739d;
  border-radius: 6px;
}
.see-course-btn i {
  margin-right: 10px;
  position: relative;
  top: 1px;
}

.helpers {
  padding: 5px 15px;
  padding-top: 6px;
  background: #ffe4ef;
  color: #a32851;
  border-radius: 6px;
  font-size: 16px;
  font-weight: 600;
  display: flex;
  align-items: center;
  width: max-content;
}
.helpers i {
  margin-right: 10px;
  position: relative;
}

.c-see-btn {
  display: flex;
  justify-content: end;
}

.dashboard-alert-box {
  background-image: url(../images/vectors/message-bg.png) !important;
  background-repeat: no-repeat;
  background-position: 0px 152px;
  background-size: 700px;
  padding: 0 !important;
  padding-bottom: 20px !important;
}
.dashboard-alert-box .alert-icon-box {
  margin-bottom: 10px;
  padding: 10px;
  background: hsl(338.18, 100%, 97.84%);
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  animation: mover-bg 2s infinite alternate;
}
.dashboard-alert-box .alert-icon-box i {
  font-size: 25px;
  color: #fff;
  height: 32px;
}
.dashboard-alert-box .alert-title {
  font-weight: 600;
  font-family: KalamehWeb;
  font-size: 25px;
}
.dashboard-alert-box p {
  font-size: 15px;
  font-weight: 500;
  margin-top: 10px;
}

@-webkit-keyframes mover-bg {
  0% {
    background: #ffe4ef;
  }
  100% {
    background: #f1739d;
  }
}
.flex-details {
  margin-top: 5px;
}
.flex-details a {
  background: rgba(39, 131, 119, 0.2588235294);
  padding: 5px 8px;
  border-radius: 4px;
  margin-right: 2px;
  font-size: 14px;
}
.flex-details a span {
  color: #02322b;
  font-size: 14px !important;
}
.flex-details a i {
  color: #02322b;
  background: #fff;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  padding: 3px 4px;
  line-height: 18px;
  height: 23px;
  position: relative;
  display: inline-block;
  border-radius: 17px;
  top: 2px;
}
.flex-details strong {
  background: rgba(39, 131, 119, 0.0901960784);
  font-size: 20px;
  margin-left: 5px;
  padding: 2px 12px;
  border-radius: 4px;
}

.whatsapp-dashboard {
  background: hsl(46, 73%, 75%);
  background: linear-gradient(90deg, hsl(46, 73%, 75%) 0%, hsl(176, 73%, 88%) 100%);
  background: -moz-linear-gradient(90deg, hsl(46, 73%, 75%) 0%, hsl(176, 73%, 88%) 100%);
  background: -webkit-linear-gradient(76deg, hsl(121.31, 100%, 95.02%) 0%, hsl(0, 0%, 100%) 100%);
  padding: 15px 30px;
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  margin-top: 5px;
}
.whatsapp-dashboard .time-title {
  font-weight: 600;
  font-family: KalamehWeb;
  font-size: 22px;
  margin-bottom: 0px;
}
.whatsapp-dashboard .dashboard-icon {
  height: 65px;
  width: 65px;
  padding: 8px;
  background: #dff1e6;
}

#calender {
  margin-left: 5px;
  margin-right: 5px;
}

.dashboard-content {
  padding: 40px 35px;
  background-color: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  margin-top: 15px;
  margin-bottom: 10px;
}

.banner-dashboard {
  height: 95px;
  width: 100%;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  margin-top: 5px;
}
.banner-dashboard img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 4px;
}

.clock-bg {
  height: 140px;
  background-size: 50px;
  background-image: url(../../assets/images/icons/clock.png);
  background-position: 25px 20px;
  background-repeat: no-repeat;
}

.calender-bg {
  height: 140px;
  background-size: 45px;
  background-image: url(../../assets/images/icons/date.png);
  background-position: 25px 20px;
  background-repeat: no-repeat;
}

.package-bg {
  display: flex;
  align-items: center;
  height: 140px;
  background-size: 50px;
  background-image: url(../../assets/images/icons/video-pannel.png);
  background-color: rgb(245, 98, 149);
  background-position: 25px 20px;
  background-repeat: no-repeat;
}
.package-bg .time-title {
  color: #fff;
}
.package-bg .flex-details {
  background-color: #fff;
  padding: 2px 5px;
  border-radius: 4px;
  display: flex;
  align-items: center;
}
.package-bg .flex-details i {
  font-size: 20px;
  color: #f1739d;
}
.package-bg i {
  font-size: 28px;
  height: 38px;
  color: #f1739d;
  line-height: 40px;
}
.package-bg:hover {
  background-color: #ba0f47;
}

.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: 18px !important;
  font-weight: 600 !important;
  color: #278376;
}
.wrapp-details-dashboard span {
  margin-top: 5px;
  font-size: 18px !important;
  font-weight: 600 !important;
  margin-left: 8px;
  color: #000000;
  margin-right: 5px;
}
.wrapp-details-dashboard .clock {
  margin-top: 5px;
  font-size: 18px !important;
  font-weight: 600 !important;
  margin-left: 8px;
  color: #278376;
  margin-right: 5px;
}

.time-title {
  font-weight: 600;
  font-family: KalamehWeb;
  font-size: 25px;
}

.your-date {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 20px;
  width: 100%;
  text-align: right;
}

.message-body {
  padding: 30px 30px;
}

.message-header {
  display: flex;
  width: 100%;
  background: #f56295;
  height: 45px;
  border-radius: 10px 10px 0px 0px;
  display: flex;
  align-items: center;
  padding: 5px 25px;
}
.message-header p {
  margin-top: 0px;
  display: flex;
  align-items: center;
  color: #fff;
}
.message-header span {
  display: inline-block;
  height: 12px;
  width: 12px;
  border-radius: 50%;
  color: #fff;
  background: #fff;
  margin: 3px;
}
.message-header .cmi-1 {
  animation: message-1 2s linear infinite;
}
.message-header .cmi-2 {
  animation: message-2 4s linear infinite;
}
.message-header .cmi-3 {
  animation: message-3 6s linear infinite;
}
@-webkit-keyframes message-1 {
  0% {
    background: #fff;
  }
  100% {
    background: #f1739d;
  }
}
@-webkit-keyframes message-2 {
  0% {
    background: #fff;
  }
  100% {
    background: #f1739d;
  }
}
@-webkit-keyframes message-3 {
  0% {
    background: #fff;
  }
  100% {
    background: #f1739d;
  }
}

.fact-print {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 10px;
}

.rasmi {
  font-size: 14px;
  margin-bottom: 10px;
}

.fbt-gray {
  border-top: 1px solid #eee;
  padding-top: 15px;
}

.capt-test h5 {
  font-size: 12px;
}

.capt-test i {
  font-size: 8px;
  color: #ff9f1c;
}

.name {
  font-size: 14px;
  margin-left: 5px;
}

.name-family {
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid rgb(241, 241, 241);
}

.icon-location-p {
  font-size: 20px;
  color: #fc4e03;
  margin-left: 5px;
}

.table-bordered th,
.table-bordered td {
  border: 1px solid #ffffff;
  border-radius: 4px;
}

.table .thead-dark th {
  color: #fff;
  background: #a32851 !important;
  border-color: #ffffff;
  border-radius: 8px;
  font-weight: 500;
  font-size: 16px;
}

.facture-under {
  border-radius: 8px;
  background-color: #ecf3f8;
  background: linear-gradient(44deg, #e6e6e6 0.64%, #f3f3f3 98.23%);
  padding: 10px 12px;
  display: flex;
  align-items: center;
  margin: 1px 0px;
}

.facture-under h4 {
  margin-bottom: 0;
}

.facture-under img {
  height: 10px;
  width: 8px;
  margin-left: 8px;
}

table .toman {
  font-size: 14px;
}

.pay-last {
  border-radius: 6px;
  background: #08c572;
  color: #fff;
  font-weight: 600;
  cursor: pointer;
  padding: 15px 60px;
  border: none;
  font-family: IRANYekan;
  height: 50px;
  margin-top: 40px;
}

.pay-last:hover {
  background: #03db6f;
  color: #fff;
  transition: all linear 0.3s;
}

.re-pay {
  font-size: 16px;
  margin-left: 10px;
}

.pay-now {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

.pay-now strong {
  font-size: 16px;
}

.pay-now .toman {
  font-size: 14px;
}

.table > :not(caption) > * > * {
  background-color: unset !important;
}

.table-bordered tr:nth-child(even) {
  background-color: rgb(255, 239, 245) !important;
}

.table-bordered tr:nth-child(odd) {
  background-color: #f1f1f1 !important;
}

.camp-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  direction: rtl;
  padding-left: 20px;
}

.layout .sidebar-panel .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-right: 10px;
  border-radius: 2px;
  display: flex;
  align-items: center;
  transition: color 0.3s;
}

.layout .sidebar-panel .menu .menu-item a .menu-icon i {
  display: inline-block;
}

.layout .sidebar-panel .menu .menu-item a .menu-title {
  font-size: 0.9rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex-grow: 1;
  transition: color 0.3s;
  margin-top: 4px;
}

.layout .sidebar-panel .menu .menu-item a .menu-prefix,
.layout .sidebar-panel .menu .menu-item a .menu-suffix {
  display: inline-block;
  padding: 5px;
  opacity: 1;
  transition: opacity 0.3s;
}

.layout .sidebar-panel .menu .menu-item a:hover .menu-title {
  color: #dee2ec;
}

.layout .sidebar-panel .menu .menu-item a:hover .menu-icon {
  color: #dee2ec;
}

.layout .sidebar-panel .menu .menu-item a:hover .menu-icon i {
  animation: swing ease-in-out 0.5s 1 alternate;
}

.layout .sidebar-panel .menu .menu-item a:hover::after {
  border-color: #dee2ec !important;
}

.layout .sidebar-panel .menu .menu-item.sub-menu {
  position: relative;
}

.layout .sidebar-panel .menu .menu-item.sub-menu > a::after {
  content: "";
  transition: transform 0.3s;
  border-left: 2px solid currentcolor;
  border-bottom: 2px solid currentcolor;
  width: 5px;
  height: 5px;
  transform: rotate(42deg);
}

.wrapp-course-details {
  width: 50%;
}

.layout .sidebar-panel .menu .menu-item.sub-menu > .sub-menu-list {
  padding-left: 20px;
  display: none;
  overflow: hidden;
  z-index: 999;
}

.layout .sidebar-panel .menu .menu-item.sub-menu.open > a::after {
  transform: rotate(45deg);
}

.layout .sidebar-panel .menu .menu-item.active > a .menu-title {
  color: #dee2ec;
}

.layout .sidebar-panel .menu .menu-item.active > a::after {
  border-color: #dee2ec;
}

.layout .sidebar-panel .menu .menu-item.active > a .menu-icon {
  color: #dee2ec;
}

.layout .sidebar-panel .menu > ul > .sub-menu > .sub-menu-list {
  background-color: #0b1a2c;
}

.layout .sidebar-panel .menu.icon-shape-circle .menu-item a .menu-icon,
.layout .sidebar-panel .menu.icon-shape-rounded .menu-item a .menu-icon,
.layout .sidebar-panel .menu.icon-shape-square .menu-item a .menu-icon {
  background-color: #0b1a2c;
}

.layout .sidebar-panel .menu.icon-shape-circle .menu-item a .menu-icon {
  border-radius: 50%;
}

.layout .sidebar-panel .menu.icon-shape-rounded .menu-item a .menu-icon {
  border-radius: 4px;
}

.layout .sidebar-panel .menu.icon-shape-square .menu-item a .menu-icon {
  border-radius: 0;
}

.layout .sidebar-panel:not(.collapsed) .menu > ul > .menu-item.sub-menu > .sub-menu-list {
  visibility: visible !important;
  position: static !important;
  transform: translate(0, 0) !important;
}

.layout .sidebar-panel.collapsed .menu > ul > .menu-item > a .menu-prefix,
.layout .sidebar-panel.collapsed .menu > ul > .menu-item > a .menu-suffix {
  opacity: 0;
}

.layout .sidebar-panel.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;
  right: 10px;
  top: 50%;
  border: none;
  transform: translateY(-50%);
}

.layout .sidebar-panel.collapsed .menu > ul > .menu-item.sub-menu > a:hover::after {
  background-color: #dee2ec;
}

.layout .sidebar-panel.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-panel.collapsed .menu > ul > .menu-item.active > a::after {
  background-color: #dee2ec;
}

.layout .sidebar-panel.has-bg-image .menu.icon-shape-circle .menu-item a .menu-icon,
.layout .sidebar-panel.has-bg-image .menu.icon-shape-rounded .menu-item a .menu-icon,
.layout .sidebar-panel.has-bg-image .menu.icon-shape-square .menu-item a .menu-icon {
  background-color: rgba(11, 26, 44, 0.6);
}

.layout .sidebar-panel.has-bg-image:not(.collapsed) .menu > ul > .sub-menu > .sub-menu-list {
  background-color: rgba(11, 26, 44, 0.6);
}

.layout.rtl .sidebar-panel.menu .menu-item a .menu-icon {
  margin-left: 10px;
  margin-right: 0;
}

.layout.rtl .sidebar-panel.menu .menu-item.sub-menu > a::after {
  transform: rotate(135deg);
}

.layout.rtl .sidebar-panel.menu .menu-item.sub-menu > .sub-menu-list {
  padding-left: 0;
  padding-right: 20px;
}

.layout.rtl .sidebar-panel.menu .menu-item.sub-menu.open > a::after {
  transform: rotate(45deg);
}

.layout.rtl .sidebar-panel.collapsed .menu > ul > .menu-item.sub-menu a::after {
  right: auto;
  left: 10px;
}

.layout.rtl .sidebar-panel.collapsed .menu > ul > .menu-item.sub-menu > .sub-menu-list {
  margin-left: -3px !important;
}

* {
  box-sizing: border-box;
}

body {
  height: 100vh;
}

a {
  text-decoration: none;
}

@media (max-width: 992px) {
  #btn-collapse {
    display: none;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .wrap-course-panel {
    padding: 15px;
    border-radius: 8px;
  }
  .wrap-course-panel h3 {
    font-size: 0.9rem;
    margin-top: 5px;
  }
  .wrap-course-panel .wrapp-mini-detail strong {
    font-size: 0.8rem;
    width: 60px;
    margin-left: 5px;
  }
  .wrap-course-panel .wrapp-mini-detail span {
    font-size: 0.7rem;
  }
  .wrap-course-panel .course-img-panel {
    display: none;
  }
  .user-panel {
    height: 30px;
    width: 80px !important;
    margin-right: 0px;
    padding: 0;
  }
  .user-panel span {
    font-size: 0.7rem;
  }
  .wrapp-image-right {
    height: 200px;
  }
  .wrapp-image-second {
    height: 120px;
  }
}
@media (max-width: 576px) {
  .c-see-btn {
    display: flex;
    justify-content: start;
    margin-top: 10px;
  }
  .spotplayer-prev {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 30px;
  }
  .spotplayer-prev img {
    height: 150px;
  }
  .download-title {
    font-size: 1rem;
  }
  .col-lg-6 > .download-btn {
    padding: 6px 10px;
    border-radius: 8px;
    width: 200px;
  }
  .col-lg-6 > .download-btn a {
    font-size: 0.8rem;
  }
  .col-lg-6 > .download-btn a .dwn-icons {
    height: 40px;
    padding: 5px;
    width: 40px;
  }
  .col-lg-6 > .download-btn a i {
    left: 4px;
    font-size: 1rem;
  }
  .steps-license div {
    display: flex;
    flex-direction: column;
    align-items: flex-start !important;
  }
  .steps-license h5 {
    padding: 5px;
    width: 25px;
    height: 25px;
    border-radius: 5px;
    margin-left: 5px;
  }
  .steps-license img {
    height: 250px;
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .none-result {
    margin-top: 30px;
  }
  .none-result h5 {
    font-size: 22px;
    margin-bottom: 5px;
    margin-top: 20px;
  }
  .none-result .wrapp-hint p {
    font-size: 16px;
    padding: 0px 10px;
  }
  .none-result .wrapp-hint a {
    font-size: 14px;
  }
  .none-search-img {
    height: 200px;
    margin: 20px;
  }
  .wrapp-content {
    padding: 20px 0px;
    padding-bottom: 30px;
  }
  .wrapp-content input {
    margin-right: 0px !important;
  }
  .wrapp-content .contact-form-lable {
    font-weight: 600;
    font-size: 12px;
    margin-right: 0px;
  }
  .wrapp-content h5 {
    font-weight: 600;
    font-size: 17px;
    margin-top: 20px;
    margin-right: 13px;
  }
  .wrapp-course-sections .time-holder {
    padding: 2px 10px;
    margin-left: 5px;
    font-size: 12px;
  }
  .download-now {
    background: #fff;
    color: #278376;
    font-weight: 500;
    display: flex;
    align-items: center;
    height: 23px;
    display: flex;
    padding: 4px 10px;
    padding-top: 2px;
    font-size: 10px;
  }
  .download-now i {
    font-size: 12px;
    margin-left: 5px;
  }
  .none-result .wrapp-hint {
    text-align: center;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }
  .wrapp-course-sections p {
    font-size: 14px;
    line-height: 20px;
  }
  .wrapp-comments {
    margin: 0px 10px;
  }
  .wrapp-comments .wrapp-user-comments .comment-user {
    padding: 8px 5px;
  }
  .wrapp-comments .wrapp-user-comments .comment-user p {
    margin-right: 10px;
    font-size: 12px;
  }
  .wrapp-comments .wrapp-user-comments .comment-user strong {
    font-size: 12px;
  }
  .wrapp-comments .wrapp-user-comments .comment-body p {
    font-size: 12px;
  }
  .owner-comments {
    padding: 10px 8px;
    margin: 10px 10px;
  }
  .owner-comments .reply-name {
    padding: 8px 5px;
  }
  .owner-comments .reply-name p {
    font-size: 12px;
    margin-left: 5px;
  }
  .owner-comments .reply-name i {
    font-size: 14px;
    margin-left: 2px;
  }
  .owner-comments .reply-name span {
    color: #000000 !important;
    margin-right: 10px;
    font-size: 12px;
  }
  .course-pass p {
    font-size: 0.7rem;
  }
  .course-pass a {
    color: #f1739d;
  }
  .course-pass h3 {
    font-size: 0.8rem;
    padding: 10px;
  }
  .wrap-course-panel {
    padding: 15px;
    border-radius: 8px;
  }
  .wrap-course-panel h3 {
    font-size: 20px;
    display: flex;
    align-items: flex-start;
    margin-top: 5px;
    line-height: 35px;
    flex-direction: column;
  }
  .wrap-course-panel h3 span {
    margin-right: 0;
    margin-top: 10px;
  }
  .wrap-course-panel .wrapp-mini-detail strong {
    font-size: 16px;
    width: 80px;
    margin-left: 5px;
  }
  .wrap-course-panel .wrapp-mini-detail span {
    font-size: 16px;
  }
  .wrap-course-panel .course-img-panel {
    display: none;
  }
  .wrap-course-panel .wrapp-mini-detail strong i {
    font-size: 18px;
    color: #f1739d;
  }
  .btn-course-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: 0;
  }
  .helpers {
    padding: 5px 15px;
    padding-top: 6px;
    background: #ffe4ef;
    color: #a32851;
    border-radius: 6px;
    font-size: 16px;
    align-items: center;
    width: 100%;
    justify-content: space-between;
  }
  .see-course-btn {
    padding: 5px 15px;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    background: #f1739d;
    border-radius: 6px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .user-panel {
    height: 30px;
    width: 80px !important;
    margin-right: 0px;
    padding: 0;
  }
  .user-panel span {
    font-size: 0.7rem;
  }
  .wrapp-image-right {
    height: 200px;
  }
  .wrapp-image-second {
    height: 120px;
  }
  .layout .sidebar-panel.break-point-sm {
    position: fixed;
    left: -280px;
    height: 100%;
    top: 0;
    z-index: 100;
  }
  .layout .sidebar-panel.break-point-sm.collapsed {
    left: -80px;
  }
  .layout .sidebar-panel.break-point-sm.toggled {
    left: 0;
  }
  .layout .sidebar-panel.break-point-sm.toggled ~ .overlay {
    display: block;
  }
  .layout .sidebar-panel.break-point-sm ~ .layout .header {
    width: 100% !important;
    -webkit-transition: none;
    transition: none;
  }
}
.rtl {
  direction: rtl !important;
}

.ltr {
  direction: ltr !important;
}

.space-top {
  margin-top: 200px;
}

#fluid-player-e2e-case {
  width: 90%;
}

.dotnettime {
  background-color: #ededed;
}

.dotnettime-section {
  direction: rtl;
}

.dotnettime-area {
  display: flex;
  align-items: center;
}

.dotnettime-area a {
  filter: grayscale(1);
}

.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: #fff;
  display: inline-block;
  margin-top: 9px;
}

.copyright-text-p {
  font-size: 12px;
  color: #fff;
}

.copyright-text p {
  margin: 0;
  font-size: 14px;
  color: #878787;
  text-align: center;
}

.copyright-text p a {
  color: #f1739d;
}

.more {
  height: 40px;
}

.carousel {
  padding: 0px;
}

.no-padding {
  padding: 0px;
}

.carousel-inner {
  width: 100%;
  overflow: hidden;
  height: 400px;
  object-fit: contain;
}

.form-control::placeholder {
  text-align: right;
  font-size: 13px;
}

.sr-only {
  display: none !important;
}

.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;
}

.padding-z {
  padding: 0px !important;
}

.zero-height {
  height: 0px;
}

.mb-sett {
  margin-bottom: 90px;
}

.caption-hro {
  font-size: 16px;
  margin-top: 30px;
  margin-bottom: 30px;
  line-height: 28px;
  color: #fff;
  text-align: center;
  padding: 10px 130px;
}

.herosection-bg {
  padding: 0px;
  margin-top: -45px;
  height: 750px;
  object-fit: cover;
  background: url(../images/banner/hero-background.webp);
  width: 100%;
  margin-bottom: 50px;
}
.herosection-bg img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.coach-section {
  display: flex;
  justify-content: flex-end;
}

.coach-vector {
  height: 680px;
  object-fit: contain;
  top: 55px;
  position: relative;
  margin-right: 60px;
}
.coach-vector img {
  height: 100%;
  object-fit: contain;
}

.details-buy .box-de {
  color: #fff;
  font-weight: 600;
  font-size: 16px;
}

.animated-shape {
  z-index: 0;
  position: absolute;
  height: 0px;
  width: 800px;
  top: 50px;
  right: -50px;
  opacity: 0.8;
}

.cooki-row {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.cooki-dance {
  background-image: url(../images/vectors/flower-bg-herro.webp);
  /* background-position: 72px; */
  background-repeat: no-repeat;
  height: 470px;
  top: -162px;
  right: -180px;
  width: 350px;
  background-size: cover;
}

.half-part {
  height: 50%;
}

.text-holder {
  display: flex;
  justify-content: center;
  text-align: right;
  padding-right: 50px;
}

.green-effect {
  display: flex;
  flex-direction: column;
  margin-right: 10px;
}
.green-effect img {
  height: 35px;
  width: 70px;
  object-fit: contain;
  margin-top: -84px;
  /* padding-right: 33px; */
  position: relative;
  right: 50px;
  animation: mini-leave 3s infinite alternate;
}
@-webkit-keyframes mini-leave {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(12px);
  }
}
@keyframes mini-leave {
  10% {
    transform: translateY(0px);
  }
  100% {
    transform: translateY(12px);
  }
}

.hero-texts {
  position: relative;
  top: 50px;
}
.hero-texts h2 {
  position: absolute;
  font-family: KalamehWeb;
  font-weight: 600;
  font-size: 53px;
  width: 100%;
  top: 210px;
  display: flex;
  flex-direction: row-reverse;
}
.hero-texts strong {
  font-family: KalamehWeb;
  font-weight: 600;
  color: #00633f !important;
}

.hero-caption {
  position: relative;
}
.hero-caption p {
  position: absolute;
  top: 290px;
  padding-left: 80px;
  right: 0;
  font-size: 30px;
  line-height: 45px;
  color: #000;
  text-align: right;
  direction: rtl;
  font-family: KalamehWeb;
  font-weight: 400;
  text-shadow: 5px 5px 0px #fef2f2;
}

.playing-btn {
  position: absolute;
  top: 410px;
  right: 0px;
  display: flex;
  align-items: center;
  justify-content: space-around;
  width: 200px;
  background: #ffffff;
  height: 48px;
  border-radius: 38px;
  flex-direction: row-reverse;
  padding: 5px 10px;
}
.playing-btn strong {
  color: #000 !important;
  font-size: 14px;
  font-weight: 500;
  font-family: iranyekanBakh;
}

.button-play {
  display: inline-block;
  position: relative;
}

.button-play.is-play {
  background-color: rgba(255, 255, 255, 0);
  border-radius: 50%;
  width: 50px;
  height: 50px;
}

.button-play.is-play .button-outer-circle {
  background: #ffb1ca;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
}

.button-play.is-play .button-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  transform: translate(-50%, -50%);
}

.button-play.is-play .button-icon .triangle {
  -webkit-animation: fadeIn 7s ease;
  animation: fadeIn 7s ease;
}

.button-play.is-play .button-icon .path {
  stroke-dasharray: 90;
  stroke-dashoffset: 2;
  -webkit-animation: triangleStroke 3s;
  animation: triangleStroke 3s;
  -webkit-animation-timing-function: ease;
  animation-timing-function: ease;
}

.has-scale-animation {
  -webkit-animation: smallScale 3s infinite;
  animation: smallScale 3s infinite;
}

.has-delay-short {
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes triangleStroke {
  from {
    stroke-dashoffset: 90;
  }
  to {
    stroke-dashoffset: 0;
  }
}
@keyframes triangleStroke {
  from {
    stroke-dashoffset: 90;
  }
  to {
    stroke-dashoffset: 0;
  }
}
@-webkit-keyframes smallScale {
  from {
    transform: scale(1);
    opacity: 1;
  }
  to {
    transform: scale(1.5);
    opacity: 0;
  }
}
@keyframes smallScale {
  from {
    transform: scale(1);
    opacity: 1;
  }
  to {
    transform: scale(1.5);
    opacity: 0;
  }
}
.st-padding {
  padding: 15px;
}

.cake-topping {
  position: relative;
  top: -150px;
  z-index: 0;
  width: 100%;
  padding: 0;
}
.cake-topping img {
  width: 100%;
}

.cooki-dance {
  display: flex;
  position: relative;
  flex-direction: column;
  justify-content: start;
  direction: rtl;
  padding-right: 250px;
}
.cooki-dance .first-cooki {
  position: relative;
  object-fit: contain;
  z-index: 10000 !important;
}
.cooki-dance .first-cooki img {
  position: absolute;
  height: 200px;
  width: 160px;
  object-fit: contain;
  top: -100px;
}
@-webkit-keyframes first-cooki {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(15px);
  }
}
@keyframes first-cooki {
  10% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(10px);
  }
}
.cooki-dance .growing {
  display: flex;
  position: relative;
  top: -15px;
  justify-content: center;
}

.first-leave {
  position: relative;
  object-fit: contain;
}
.first-leave img {
  position: absolute;
  height: 100px;
  width: 120px;
  object-fit: contain;
  top: 20px;
  right: 135px;
  animation: first-leave 3s infinite alternate;
}
@-webkit-keyframes first-leave {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(20px);
  }
}
@keyframes first-leave {
  10% {
    transform: translateY(0px);
  }
  100% {
    transform: translateY(20px);
  }
}

.second-cooki {
  position: relative;
  object-fit: contain;
}
.second-cooki img {
  position: absolute;
  height: 200px;
  width: 160px;
  object-fit: contain;
  top: 80px;
  right: 10px;
  animation: second-cooki 2s infinite alternate;
}
@-webkit-keyframes second-cooki {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(20px);
  }
}
@keyframes second-cooki {
  10% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(20px);
  }
}

.second-leave {
  position: relative;
  object-fit: contain;
}
.second-leave img {
  position: absolute;
  height: 100px;
  width: 120px;
  object-fit: contain;
  top: 180px;
  right: -95px;
}

.third-cooki {
  position: relative;
  object-fit: contain;
  z-index: 100000 !important;
}
.third-cooki img {
  z-index: 100000 !important;
  position: absolute;
  height: 200px;
  width: 160px;
  object-fit: contain;
  top: 240px;
  animation: third-cooki 1.5s infinite alternate;
}
@-webkit-keyframes third-cooki {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(12px);
  }
}
@keyframes third-cooki {
  10% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(12px);
  }
}

@-webkit-keyframes mover-mobile {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(10px);
  }
}
@keyframes mover-mobile {
  10% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(15px);
  }
}
.hero-title {
  font-weight: 600;
  font-size: 26px;
}

.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;
}

list-type-ulli,
.socials {
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}

.to-the-space {
  height: 200px;
  background: center;
  background-color: #f1739d;
  background-image: url(../images/vectors/topbgimg2.webp);
  background-size: 500px;
  position: relative;
  top: -82px;
}

.main {
  background: rgb(248, 248, 248);
  padding: 150px 0px;
}

.clear {
  clear: both;
}

.container-box {
  width: 1000px;
  background-color: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  margin: 0px auto;
  border-radius: 20px;
  margin-top: -120px;
  position: relative;
  background-image: url(../images/vectors/login-flower.webp);
  background-position: right bottom;
  background-size: 500px;
  background-repeat: no-repeat;
}

#status {
  font-size: 16px;
  height: 40px;
}

.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;
}

.otp-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.signup-content {
  padding: 30px 0px 15px;
  text-align: right;
}

.lost-pass i {
  font-size: 18px;
  color: #f1739d;
  margin-left: 4px;
}
.lost-pass span {
  color: #000;
  font-size: 15px;
  font-weight: 500;
}

.buttoms-colm {
  display: flex;
  height: auto !important;
  flex-direction: column;
}

.d-flex .mobile-btn {
  margin: 5px 2px;
}

.hide-btn {
  display: none !important;
}

.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: #f1739d;
  color: #000000;
}
.login-with-google-btn:focus {
  outline: none;
}

.term-service {
  color: #f1739d;
  margin-bottom: 0;
}

.signup-form,
.signup-image,
.signin-form,
.signin-image {
  width: 50%;
  overflow: hidden;
}

.signup-image {
  margin: 0px 35px;
  padding: 0px 50px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.form-title {
  font-size: 30px;
  padding-right: 20px;
  color: #000000;
  margin-bottom: 15px;
  font-family: kalamehweb;
}

.form-title h2 {
  font-size: 26px;
  margin-bottom: 20px;
  color: #fff;
}

.signup-form input {
  background-color: rgba(171, 171, 171, 0.16);
  border: 1px solid rgba(194, 194, 194, 0);
  color: #000;
  padding: 15px 55px;
  font-size: 16px;
  font-weight: 500;
}
.signup-form input::placeholder {
  font-size: 15px !important;
  font-weight: 400 !important;
}

.signup-form input[type=checkbox] {
  padding: 10px 5px !important;
  font-size: 13px;
}

.signup-form input:hover {
  background-color: rgba(151, 151, 151, 0.16);
  border: 1px solid rgba(209, 194, 255, 0);
  color: rgb(0, 0, 0);
}
.signup-form input:hover::placeholder {
  font-size: 15px !important;
  font-weight: 400 !important;
}

.signup-form input:active {
  background-color: rgb(241, 241, 241);
  border: 1px solid rgb(183, 183, 183);
}
.signup-form input:active::placeholder {
  font-size: 15px !important;
  font-weight: 400 !important;
}

.logins-link-option {
  width: 100%;
  display: flex;
  align-items: center;
}

.login-2 {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.opp-options {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  padding: 0px 2px;
  margin-bottom: 10px;
}

.opp-options label {
  margin-bottom: 0;
  font-weight: 500 !important;
  font-size: 16px !important;
  margin-right: 0px;
  color: #e4316c;
}

.forget {
  text-align: right;
  display: flex;
  flex-direction: row-reverse;
  align-items: center;
  color: #e4316c;
  font-weight: 500 !important;
  font-size: 16px !important;
}

.login-icon {
  font-size: 22px !important;
}

.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(151, 151, 151, 0.16);
  border: 1px solid rgba(209, 194, 255, 0);
  color: rgb(0, 0, 0) !important;
  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;
}

.signup-image {
  margin-top: 45px;
}

.form-submit {
  display: inline-block;
  background: #e4316c;
  border-bottom: none;
  border: none !important;
  width: auto;
  padding: 15px 40px;
  border-radius: 10px;
  font-size: 18px;
  margin-top: 5px;
  font-family: iranyekanBakh !important;
  cursor: pointer;
  font-weight: 600;
  color: rgb(255, 255, 255) !important;
}
.form-submit:hover {
  background: #406964;
}

.mobile-btn {
  background: #ffffff !important;
  border-bottom: none;
  width: 100%;
  margin-top: 15px !important;
  padding: 8px 0px;
  border-radius: 10px;
  font-size: 15px;
  margin-top: 5px;
  font-family: iranyekanBakh !important;
  cursor: pointer;
  font-weight: normal;
  color: #000000 !important;
  border: none;
  text-align: right;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.mobile-btn a {
  margin: 0px 8px;
  color: #e4316c;
  font-weight: 500;
  display: flex;
  align-items: center;
  font-size: 17px;
}
.mobile-btn::hover {
  background: #e7bcd0 !important;
  color: rgb(255, 255, 255) !important;
  border: none !important;
}

#signin {
  margin-top: 16px;
}

.only-mobile-show {
  display: none;
}

.signup-image-link {
  font-size: 16px;
  color: rgb(241, 0, 80);
  display: block;
  text-align: center;
  background: #fdebf3;
  width: 169px;
  border-radius: 10px;
  padding: 13px 10px;
  display: flex;
  height: 42px;
  /* border-bottom: 1px solid rgba(0, 0, 0, 0.068); */
  align-items: center;
  justify-content: space-between;
  font-weight: 600;
}

.term-service {
  font-size: 14px;
  margin-right: 10px;
  color: rgb(255, 255, 255);
}

.signup-form {
  margin-right: 55px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-bottom: 65px;
}
.signup-form .about-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.signup-form .about-title a {
  display: flex;
  align-items: center;
  font-weight: 500;
  color: #004037;
  font-size: 16px;
  background-color: rgba(0, 64, 55, 0.0901960784);
  border-radius: 4px;
  padding: 2px 5px;
  padding-top: 3px;
}
.signup-form .about-title a i {
  font-size: 14px;
  margin-left: 4px;
}

.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: auto;
}

.label {
  position: absolute;
  right: 4px;
  top: 25px;
  transform: translateY(-50%);
  color: rgb(34, 34, 34);
}

.label-has-error {
  top: 22%;
}

.terms-service {
  margin-right: 10px;
  font-size: 15px;
  font-weight: 500;
  color: #f1739d;
}
.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;
}

input {
  color: white;
}

.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: 15px 5px 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;
  }
  .form-button {
    text-align: 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: 17px;
    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;
}

@media only screen and (min-width: 1660px) and (max-width: 1750px) {
  .coach-vector {
    height: 650px;
    object-fit: contain;
    top: 85px;
    position: relative;
    margin-right: 0;
  }
}
@media only screen and (min-width: 995px) and (max-width: 1660px) {
  .coach-vector {
    height: 550px;
    object-fit: contain;
    top: 185px;
    position: relative;
    margin-right: 0;
  }
  nav .navbar .links li {
    padding: 0px 10px;
  }
  nav .navbar .links li .arrow {
    height: 100%;
    width: 12px;
    font-size: 10px;
  }
  nav .navbar .links li a {
    font-size: 13px;
  }
  .hero-texts h2 {
    position: absolute;
    font-family: KalamehWeb;
    font-weight: 600;
    font-size: 31px;
    width: 100%;
    top: 210px;
  }
  .growing svg {
    height: 400px;
  }
  .hero-caption p {
    position: absolute;
    top: 290px;
    padding-left: 80px;
    right: 0;
    font-size: 23px;
    line-height: 45px;
    color: #000;
    text-align: right;
    direction: rtl;
    font-family: KalamehWeb;
    font-weight: 400;
    text-shadow: 5px 5px 0px #fef2f2;
  }
  .cooki-dance {
    padding-right: 40px !important;
    height: 375px;
    background-size: contain;
    top: -20px;
    right: -50px;
  }
  .cooki-dance .growing {
    display: flex;
    position: relative;
    top: -45px;
    justify-content: center;
    right: 88px;
  }
}
/*responsive*/
@media (max-width: 991px) {
  .advertising-campaign a {
    height: 350px;
    border-radius: 8px;
    display: block;
    position: relative;
    cursor: pointer;
    object-fit: cover;
  }
  .mobile-btn {
    width: 100%;
    padding: 10px 5px;
    margin-top: 20px !important;
  }
  .hide-btn {
    width: 50%;
    display: block !important;
  }
  .signup-image-link {
    display: none !important;
  }
  .cooki-dance {
    direction: rtl;
    padding-right: 0px !important;
  }
  .cooki-dance .growing {
    top: 15px;
    justify-content: center;
    height: 250px;
    right: 35px;
  }
  .playing-btn {
    position: absolute;
    top: 150px;
    right: 0px;
    width: 150px;
    background: #ffffff;
    height: 45px;
    border-radius: 38px;
    flex-direction: row-reverse;
    padding: 5px 7px;
    cursor: pointer;
  }
  .playing-btn strong {
    color: #000 !important;
    font-size: 12px;
    font-weight: 500;
    font-family: iranyekanBakh;
  }
  .button-play.is-play {
    width: 30px;
    height: 30px;
  }
  .herosection-bg {
    padding: 0px;
    margin-top: -45px;
    height: 632px;
    width: 100%;
    margin-bottom: 50px;
    background-size: cover;
    background-position: right 10px;
  }
  .coach-vector {
    height: 640px;
    object-fit: contain;
    top: 130px;
    position: relative;
    margin-right: 5px;
  }
  .cooki-dance {
    background-image: url(../images/vectors/flower-bg-herro.webp);
    background-position: 0;
    background-repeat: no-repeat;
    height: 330px;
    top: -100px;
    right: -15px;
    background-size: contain;
  }
  .hero-caption p {
    top: 80px;
    padding-left: 0px;
    right: 0;
    font-size: 20px;
    line-height: 34px;
  }
  .green-effect img {
    height: 30px;
    width: 45px;
    margin-top: -90px;
    position: relative;
    right: 20px;
  }
  .hero-texts h2 {
    font-size: 32px;
    width: 100%;
    top: 40px;
  }
  .search-btn {
    font-size: 16px;
    color: rgb(195, 136, 250);
    padding: 0px 9px;
    bottom: 3px;
    height: 36px;
    padding-bottom: 2px;
    margin-bottom: 0 !important;
  }
  .search-box i {
    height: 100%;
    position: relative;
    color: #000000;
    cursor: pointer;
    transition: all 0.3s ease;
    top: -2px;
  }
  .header-design {
    height: 95px;
  }
  .bx-search-alt {
    top: -3px !important;
  }
  .close .mdi-close {
    transition: all 1s ease;
    top: 4px !important;
    font-size: 22px !important;
    font-weight: 600;
    color: #fff !important;
  }
  .cart-btn {
    margin-left: 5px;
  }
  .wrapp-heaader-top .mdi-phone-in-talk {
    font-size: 12px !important;
  }
  .wrapp-heaader-top strong {
    color: white;
    font-size: 10px;
  }
  .wrapp-heaader-top i {
    font-size: 12px;
  }
  .wrapp-heaader-top a,
  .wrapp-heaader-top span {
    font-size: 10px;
  }
  .new-courses .nw-cr {
    font-size: 1.8rem;
  }
  .w-wrapp-blogs {
    display: flex;
    flex-wrap: wrap;
  }
  .dotnettime-row {
    display: none;
  }
  .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;
  }
  .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: #ffeef3 !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: 50px;
    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:hover {
    background-color: rgb(15, 15, 15);
  }
  .header .menu > ul > li:hover a {
    color: rgb(226, 185, 255);
  }
  .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: 600;
}

.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: #e4316c;
  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: #e4316c;
  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: 600;
}

.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: #f1739d;
  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: 4px;
  direction: rtl;
}
.w-wrapp-blogs .w-blog-block {
  flex-direction: column;
  margin: 10px;
}

.person-in {
  font-size: 16px;
  padding: 2px 10px !important;
  font-weight: 500;
  border-radius: 4px;
  display: flex;
  height: 30px;
  align-items: center;
}

.blog-caption {
  margin-top: 25px;
}

.blog-name {
  font-size: 18px;
  margin-bottom: 0px;
  display: -webkit-box;
  max-width: 400px;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: right;
  direction: rtl;
}

.cart-wrappering {
  margin-bottom: 35px;
  text-align: right;
  height: 26rem;
  padding: 15px;
  background-color: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}
.cart-wrappering .cart-img {
  border-radius: 4px;
  height: 230px;
  width: 100%;
  object-fit: cover;
}
.cart-wrappering .cart-img img {
  border-radius: 4px;
  height: 100%;
  width: 100%;
  object-fit: cover;
  overflow: hidden;
}

.money .toman {
  font-size: 14px;
}

.name-course {
  margin-top: 0px;
  font-size: 1.1rem;
  line-height: 28px;
  font-weight: 500;
  color: #000000;
  height: 70px;
  overflow: hidden;
}

.w-absolute {
  height: 210px;
  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: #f1739d;
}
.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: #f56295;
  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: #f1739d;
}

.pricing del {
  color: #959595;
  font-size: 16px;
}

.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;
}

@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;
  background: rgba(241, 115, 157, 0.1607843137);
  font-weight: 600;
}
.course-level p {
  color: rgb(0, 0, 0);
  font-weight: normal;
  font-size: 10px;
}

.ct-6 {
  color: #fff;
}

.cart-capt {
  margin-bottom: 5px;
  font-size: 12px;
}

.cart-wrappering .name-course {
  height: 40px;
}

.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: 10px 15px;
  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;
  font-weight: 600;
}

.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 {
  background: #f1739d;
  color: #ffffff;
  font-weight: 600;
  display: flex;
  align-items: center;
  padding: 4px 8px;
  padding-top: 5px;
  border-radius: 4px;
}
.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(0, 0, 0);
}

.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-page .blog-wrapper {
  text-align: right;
  background-color: #ffffff;
  border-radius: 4px;
  height: 28rem;
}
.blog-page .blog-banner-wraper {
  height: 260px !important;
}
.blog-page .blog-banner {
  height: 260px !important;
}

.blog-wrapper {
  text-align: right;
  background-color: #ffffff;
  border-radius: 4px;
  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: 4px;
}
.blog-wrapper .blog-banner img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 4px;
}
.blog-wrapper .blog-banner .category-label {
  position: relative;
  top: -45px;
  right: -27px;
  font-size: 14px;
  padding: 5px 15px;
  border-radius: 6px 0px 0px 6px;
  background: #f1739d;
  text-align: right;
  width: max-content;
  color: #ffffff;
  font-weight: 500;
}
.blog-wrapper .blog-intro {
  line-height: 24px;
  font-size: 15px;
  font-weight: 600;
  height: 62px;
  overflow: hidden;
  display: flex;
  align-items: center;
  color: rgb(48, 48, 48);
  margin-bottom: 0px;
}
.blog-wrapper .blog-caption {
  font-size: 14px;
  height: 40px;
  line-height: 22px;
  margin-bottom: 20px;
  overflow: hidden;
  color: #343434;
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: flex-start;
  text-align: right;
  direction: rtl;
  font-weight: 500;
  color: #616161;
  overflow: hidden;
  display: -webkit-box;
  max-width: 400px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.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: #f56295;
  font-size: 12px;
}
.blog-wrapper .person-in span {
  color: #f56295;
  font-size: 12px;
}
.blog-wrapper .blog-user {
  font-size: 16px;
  color: #f1739d;
  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;
}

.faq-button {
  display: flex;
  align-items: center;
}
.faq-button strong {
  font-size: 16px;
  margin-top: 5px;
  color: #000;
}
.faq-button img {
  height: 25px;
  margin-left: 12px;
}

.accordion-button {
  text-align: right;
  width: 100% !important;
  margin-top: 0px;
  border: none;
  background: #ffeff5 !important;
  border-radius: 4px !important;
  border: none !important;
}

.first-wrap-mobile {
  display: flex;
}

.submitting {
  padding: 2px 15px;
  text-align: center;
  background: #f1739d;
  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;
  direction: rtl;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  flex-direction: row-reverse;
  position: relative;
  border-radius: 3px;
  z-index: 1;
  margin-right: 6px;
  margin-left: 2px;
  padding-left: 18px;
}

.submitimng-ico i {
  font-size: 24px;
  margin-left: 5px;
  color: #fff;
}

.help-link-mobile {
  display: none;
  flex-direction: row;
  direction: ltr;
  background: #fbe4ec;
  align-items: center;
  border-radius: 4px;
  color: #e4316c;
  font-size: 14px;
  font-weight: 500;
}

.cart-btn {
  background: #f1739d;
  padding: 5px 12px;
}
.cart-btn a {
  color: #fff !important;
  font-size: 20px;
}
.cart-btn a i {
  color: #fff !important;
  position: relative;
  top: 3px;
}

.topper-back-img .hello-bar {
  height: 60px;
  width: 100%;
  object-fit: cover;
}
.topper-back-img .hello-bar img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.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, #e4316c, #e4316c, #ff95b8, #c30040);
  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(183, 58, 141, 0.071);
  border: 1px solid rgba(255, 194, 231, 0);
  color: #000;
  padding: 15px 40px;
}
.login-form i {
  font-size: 20px;
  color: #e4316c;
  background: #fff;
  padding: 7px 8px;
  height: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.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;
}

.input-group .btn {
  position: relative;
  z-index: 0 !important;
}

.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: #f1739d;
  font-size: 20px;
  background: #ffe4ef;
  border-radius: 4px;
  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: 600;
}

.news-btn:hover {
  background: #f8b014;
  border: 2px solid #f8b014;
}

.news-input:hover,
.news-input:focus,
.news-input:active {
  z-index: 1 !important;
}

.dotnettime {
  width: auto;
}

.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;
}

.gallery-spacer {
  margin-bottom: 100px;
}

.gallery-title {
  margin: 50px 0;
}

.news-btn {
  padding: 0px 30px;
  position: relative;
  right: -23px;
  background: #90e0ef;
  border-radius: 50px !important;
  z-index: 3;
  border: 2px solid #90e0ef;
  font-weight: 600;
}

.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: 4px;
  top: -40px;
}

.w-footer-label {
  text-align: right;
  font-weight: 600;
  color: #f56295;
  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: #494949;
  pointer-events: none;
  cursor: auto;
  background-color: #fbbedb;
  border-color: none;
  border: none;
}

.page-item .page-link {
  z-index: 1;
  color: #ffffff;
  background-color: #f1739d;
  border-color: #f1739d;
  border: none;
  display: flex;
  align-items: center;
  border-radius: 5px;
  margin: 3px;
}

.page-item.active .page-link {
  z-index: 3;
  color: #fff;
  background: #e4316c;
  border-color: #e4316c;
}

.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 #e4316c;
  -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-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: 600;
  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: 600;
}

.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: 600;
  font-size: 16px;
  margin-bottom: 20px;
}

.address {
  font-size: 14px;
  text-align: right;
  direction: rtl;
  color: #ffffff;
}

.detail-wrapp a {
  color: #ffffff;
}

.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: 600;
  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: #f1739d;
  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-row-des {
  height: 100vh;
  display: flex;
  align-items: center;
}

.search-box.search-elem {
  margin: 0;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
  background: rgba(88, 19, 42, 0.65);
  transition: all 0.3sease-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: #e4316c;
  font-size: 1rem;
  color: white;
  width: 200px;
  border-radius: 0px;
  margin-top: 0px;
}

.search-box.search-elem button.submit[disabled] {
  background: #f1739d;
  color: #fff;
}

.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 #f1739d;
  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 #f1739d;
  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: #f1739d;
}

.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: #000000;
  display: flex;
  align-items: center;
  background: rgb(251, 228, 236);
  padding: 10px 15px;
  border-radius: 6px;
}
.search-btn span {
  font-size: 12px;
  color: #000000;
  margin-left: 8px;
  border-left: 1px solid #eee;
}
.search-btn i {
  font-size: 23px;
  color: #585556;
}
.search-btn::hover {
  font-size: 16px;
  display: inline-block;
  margin-bottom: 0px;
  position: relative;
  bottom: 0px;
  color: rgb(255, 255, 255) !important;
  background: #e4316c;
}

.search-box-holder {
  z-index: 1;
  margin-left: 4px;
  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: 600;
}

.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: 13px;
  text-align: right;
  display: flex;
  align-items: center;
  color: #ffffff;
  justify-content: space-between;
  background: #e4316c !important;
}

.contact-feild::placeholder {
  color: #ccc !important;
}

.mb-0 i {
  color: #e4316c;
  float: left;
}

.btn-link span {
  color: #000;
  -webkit-text-fill-color: #000;
}

.each-according {
  border-radius: 8px;
}

#collapseOne {
  border-radius: 8px !important;
}

.accordion .card:first-of-type {
  border-radius: 8px !important;
}

.filter-hd,
.btn-block {
  color: #000000 !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 #e4316c;
}

.caption-title {
  font-weight: normal;
  color: #e4316c;
}

.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: 600;
  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: #278376;
  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 #278376;
  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;
}

.wrapp-payment {
  align-items: center;
}
.wrapp-payment a {
  padding: 5px 8px;
  background-color: #f1739d;
  color: #fff;
  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: #f1739d;
  color: #fff;
}
.wrapp-payment a span {
  margin-top: 5px;
}

.wrapp-payment {
  border-radius: 4px;
  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: #f1739d;
  margin-left: 10px;
}
.wrapp-payment .wrapp-course-payment {
  display: flex;
}
.wrapp-payment .wrapp-course-payment h1 {
  font-size: 18px;
  color: #000;
}
.wrapp-payment .wrapp-course-payment strong {
  font-size: 16px;
}
.wrapp-payment .wrapp-course-payment .main-price {
  font-size: 22px;
  font-weight: 600;
  color: #c30041;
}
.wrapp-payment .wrapp-course-payment span {
  font-size: 14px;
  font-weight: 600;
  color: #f1739d;
  margin-right: 10px;
}
.wrapp-payment .wrapp-course-details-header {
  border-bottom: 1px solid rgb(242, 242, 242);
  margin-bottom: 20px;
}
.wrapp-payment .wrapp-course-details-header h3 {
  font-size: 1.1rem;
}
.wrapp-payment .wrapp-img-payment {
  height: 130px;
  width: 140px;
  object-fit: cover;
  border-radius: 4px;
  margin-left: 35px;
  background-color: #fff !important;
}
.wrapp-payment .wrapp-img-payment img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 4px;
}

.wrapp-payment-btn {
  border: 1px solid #38a815;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding-left: 15px;
  background-color: #fff !important;
  padding: 0px !important;
}
.wrapp-payment-btn h4 {
  font-size: 14px !important;
  margin-bottom: 0;
  font-weight: 600;
  padding: 5px;
}
.wrapp-payment-btn i {
  font-size: 28px;
  color: #38a815;
  font-weight: 600;
  padding: 20px 10px;
  padding-left: 15px;
  border-left: 1px solid #38a815;
}
.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: #f1739d;
  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: 600;
  font-size: 16px;
  color: #278376;
  margin-right: 16px;
}

.contact-form-holder {
  padding: 50px;
  border: 1px solid #faf4ff;
  border-radius: 10px;
  background-color: #fff;
  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);
  border-radius: 4px;
  position: relative;
  top: -65px;
}

.contact-us-head h2 {
  font-family: kalamehweb;
  font-size: 32px;
  font-weight: 600;
  color: #278376;
  padding-right: 20px;
  margin-bottom: 30px;
}
.contact-us-head h3 {
  font-family: kalamehweb;
  font-size: 22px;
  color: #278376;
  font-weight: 600;
  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: #f1739d;
  height: 70px;
  width: 70px;
  align-items: center;
  border-radius: 4px;
}
.social-contact-holder i {
  font-size: 24px;
  color: #fff;
}

.bg-head h2 {
  padding-top: 50px;
  color: #000;
  font-size: 40px;
  font-family: kalamehweb;
  font-weight: 600;
}

.abou-section {
  padding: 40px 0;
}
.abou-section h3 {
  font-size: 44px;
  font-weight: 600;
  color: #278376;
  margin-bottom: 40px;
}
.abou-section p {
  font-size: 18px;
  margin-bottom: 20px;
}

.bg-circles {
  background-image: url(/assets/images/vectors/white-flower.webp);
  height: 400px;
  background-size: contain;
  background-repeat: no-repeat;
}

.about-us-vector {
  height: 450px;
  width: 100%;
  object-fit: contain;
  padding: 50px;
  position: relative;
  background-image: url(../images/vectors/hero-bg-vec.webp);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.about-us-vector img {
  top: 50px;
  position: absolute;
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.about-us-sections-img {
  height: 350px;
  width: 70%;
  padding: 25px;
  object-fit: cover;
}
.about-us-sections-img img {
  height: 100%;
  width: 700%;
  object-fit: cover;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  border-radius: 4px;
}

.about-titles {
  font-size: 32px;
  font-weight: 600;
  color: #278376;
}

.about-article {
  padding: 10px 25px;
}
.about-article h4 {
  color: #278376;
  margin-bottom: 0px;
  font-weight: 600;
}
.about-article i {
  color: #f1739d;
}

.our-goal h3 {
  font-size: 44px;
  font-size: 32px;
  font-weight: 600;
  color: #278376;
}
.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;
}

.error-body {
  background: #fff;
  border-radius: 4px;
  position: relative;
  top: -80px;
  padding: 60px 40px;
}
.error-body h2 {
  color: #393939;
  font-size: 28px;
  font-weight: 600;
  margin-top: 20px;
}
.error-body .last-courses-heading {
  font-size: 22px;
  font-weight: 600;
  color: #278376;
}
.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: #f56295;
  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;
  color: #fff;
}

.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: #278376;
  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: 12px;
  padding-right: 12px;
  margin-bottom: 12px;
  color: #f56295;
}

#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: #000;
}

.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: #000;
  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: 400px;
  margin: auto;
  background: #ffdee9;
  border-radius: 10px;
  padding: 30px 20px;
  margin-bottom: 50px;
}

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 #f1739d;
  -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 #ffc5d8;
}

body .scene_saturn__shadowRing {
  width: 330px;
  height: 19px;
  border-radius: 100%;
  box-shadow: 0 150px 40px #ffc5d8;
  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 #ffc5d8 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);
}

.slider-area {
  margin-top: 100px;
  position: relative;
  height: 450px;
  border-radius: 8px;
}
.slider-area .carousel-item {
  height: 450px;
  width: 100%;
  object-fit: cover;
  border-radius: 8px;
}
.slider-area .carousel-item img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.modal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000000000;
  display: none;
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  outline: 0;
}

.hero-section {
  overflow: hidden;
  border-radius: 10px;
  margin-top: 20px;
  height: 485px;
}

.creative-parallax--slider {
  overflow: hidden;
  border-radius: 10px;
}

.slider-wrap {
  background: #162340;
  height: 485px;
}

.swiper-slide--inner {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 485px;
  border-radius: 10px;
}

.swiper-slide {
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  direction: rtl;
}

.slide--bg {
  z-index: 0;
  visibility: inherit;
  font-weight: 400;
  white-space: nowrap;
  min-height: 500px;
  min-width: 500px;
  max-height: 500px;
  max-width: 500px;
  background-color: rgba(22, 35, 64, 0.2);
  border-radius: 50%;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  overflow: auto;
}

.swiper-slide-active .slide--bg {
  animation: zoomInBg 1.5s ease forwards;
}

.swiper-creative .swiper-slide {
  border-radius: 10px;
}

.slide--bg .slide-bg--inner {
  width: 430px;
  height: 430px;
  background: rgba(22, 35, 64, 0.5882352941);
  margin: auto;
  border-radius: 50%;
}

.swiper-slide-active .slide--bg .slide-bg--inner {
  animation: zoomInInner 1s ease forwards;
}

.slide-detail {
  position: relative;
  z-index: 1;
  text-align: center;
}

.swiper-wrapper {
  border-radius: 10px;
}

.workshop-swiper .swiper-wrapper {
  height: 30rem !important;
}

.slide-main--heading {
  display: block;
  text-align: center;
  color: #fff;
  line-height: normal;
  text-shadow: rgb(11, 18, 54) 3px 3px 15px;
  padding: 0px 0px 10px;
  font-weight: 600;
  font-size: 54px;
  white-space: normal;
  margin-top: 20px;
  text-transform: capitalize;
}
.slide-main--heading .from-right {
  font-size: 40px !important;
  margin-top: -20px;
}

.from-left,
.from-right {
  opacity: 0;
  filter: blur(4px);
  transition: opacity 0.5s ease, filter 0.5s ease;
}

.swiper-slide-active .from-left {
  animation: fadeInLeft 1s ease forwards;
  animation-delay: 0.8s;
}

.swiper-slide-active .from-right {
  animation: fadeInRight 1s ease forwards;
  animation-delay: 1s;
}

.slide-main--subheading {
  color: #ffffff;
  font-size: 12px;
  text-transform: uppercase;
  line-height: 20px;
  padding-bottom: 25px;
  font-weight: 500;
  letter-spacing: 1px;
  opacity: 0;
  filter: blur(4px);
}

.swiper-slide-active .slide-main--subheading {
  transition: opacity 0.5s ease, filter 0.5s ease;
  animation: fadeInDown 1s ease forwards;
  animation-delay: 1.2s;
}

.slide-des {
  text-align: center;
  line-height: 25px;
  border-width: 0px;
  padding: 0px 0px 25px;
  letter-spacing: 0px;
  font-weight: 600;
  font-size: 14px;
  white-space: normal;
  min-height: 0px;
  min-width: 347px;
  max-height: none;
  max-width: 347px;
  color: rgb(255, 255, 255);
  margin: auto;
  opacity: 0;
}
.slide-des p {
  color: #fff;
}

.swiper-slide-active .slide-des {
  transition: opacity 0.5s ease, filter 0.5s ease;
  animation: fadeInUp 1s ease forwards;
  animation-delay: 1.4s;
}

.slide-cta .slide-btn {
  text-align: inherit;
  line-height: 27px;
  border-width: 1px;
  margin: 0px;
  padding: 5px 60px 5px 30px;
  letter-spacing: 0px;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  background: #278376;
  background-size: 200% auto;
  color: #ffffff;
  display: inline-block;
  border: 2px solid transparent;
  width: auto;
  border-radius: 50px;
  position: relative;
  transition: 0.3s ease-in-out !important;
  opacity: 0;
}

.swiper-slide-active .slide-cta .slide-btn {
  transition: opacity 0.5s ease, filter 0.5s ease;
  animation: fadeInUp2 1s ease forwards;
  animation-delay: 1.4s;
}

.slide-cta .slide-btn:hover {
  -webkit-box-shadow: 0 8px 30px 0 rgba(0, 0, 0, 0.15);
  box-shadow: 0 8px 30px 0 rgba(0, 0, 0, 0.15);
  -webkit-transform: translate3d(0, -2px, 0);
  transform: translate3d(0, -2px, 0);
  background: right center;
}

.slide-cta .slide-btn span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  position: absolute;
  border-radius: 100%;
  right: 8px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.35);
  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.35);
  background: #fff;
  color: #3c2fc0;
}

.slide-badge {
  display: flex;
  flex-direction: column;
  width: 60px;
  height: 60px;
  background: #3c2fc0;
  line-height: normal;
  font-size: 9px;
  justify-content: center;
  border-radius: 50%;
  color: #fff;
  text-transform: uppercase;
  font-weight: 500;
  position: absolute;
  right: -15px;
  top: 0;
  transition: 0.3s ease-in-out !important;
  opacity: 0;
}
.slide-badge .badge-heading {
  font-size: 10px;
}

.swiper-slide-active .slide-badge {
  transition: opacity 0.5s ease, filter 0.5s ease;
  animation: fadeInUp3 1s ease forwards;
  animation-delay: 1.5s;
}

.slide-badge .patch-check svg {
  height: 12px;
  width: 12px;
  margin-bottom: 4px;
}

/* Keyframe animations for Badge */
@keyframes fadeInUp3 {
  0% {
    opacity: 0;
    transform: translateY(50px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}
/* Keyframe animations for CTA */
@keyframes fadeInUp2 {
  0% {
    opacity: 0;
    transform: translateY(50px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}
/* Keyframe animations for Description */
@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(-50px);
  }
  100% {
    opacity: 0.7;
    transform: translateY(0);
    filter: blur(0);
  }
}
/* Keyframe animations for Sub Heading */
@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translateY(-50px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}
/* Keyframe animations for Main Heading */
@keyframes fadeInLeft {
  0% {
    opacity: 0;
    transform: translateX(-50px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
    filter: blur(0);
  }
}
@keyframes fadeInRight {
  0% {
    opacity: 0;
    transform: translateX(50px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
    filter: blur(0);
  }
}
/* Keyframe animations for background */
@keyframes zoomInBg {
  from {
    opacity: 0;
    transform: scale(0.5);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes zoomInInner {
  from {
    opacity: 0;
    transform: scale(0.5);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
.parallax-slider .slide-btns {
  width: 54px;
  height: 54px;
  background: 0 0;
  border: 1px solid rgba(255, 255, 255, 0.2);
  -webkit-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
  border-radius: 50%;
  font-size: 16px;
  font-weight: 900;
}

.slide-btns.swiper-button-next:after,
.slide-btns.swiper-button-prev:after {
  font-size: 16px;
  font-weight: 900;
  color: #fff;
}

.slide-btns:hover {
  border: 1px solid #fff;
  background: #fff;
}

.slide-btns:hover:after {
  color: #232323;
}

span.swiper-pagination-bullet {
  width: 16px;
  height: 16px;
  background: transparent;
  background-color: transparent;
  box-shadow: inset 0 0 0 2px #fff;
  -webkit-transition: background 0.3s ease;
  transition: background 0.3s ease;
  opacity: 1;
  display: none;
}

span.swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: #fff;
}

.autoplay-progress {
  position: absolute;
  right: 0px;
  top: 0px;
  z-index: 10;
  width: 100%;
  height: 10px;
}

.progress-fill {
  --progress: 0;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 10;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.1490196078);
  width: var(--progress, 0%);
  transition: width 0.5s ease;
}

/* ======== Sticky Footer ========= */
.sticky-footer {
  position: fixed;
  width: 100%;
  background: #333;
  z-index: 999;
  bottom: 0;
}

.sticky-footer .footer-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 10px;
  padding-right: 15px;
}

.creditd a {
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  font-size: 16px;
}

.social ul {
  display: flex;
  list-style-type: none;
  margin: 0;
  padding: 0px;
  column-gap: 10px;
  align-items: center;
}

.social ul li a {
  display: flex;
  background: #fff;
  height: 30px;
  width: 30px;
  border-radius: 4px;
  align-items: center;
  justify-content: center;
}

.social ul li a img {
  max-width: 20px;
}

/* ==================== Responsive Ipad ========================== */
@media only screen and (max-width: 981px) {
  .slider-wrap {
    height: 750px;
  }
  .slide--bg {
    min-height: 720px;
    min-width: 720px;
    max-height: 720px;
    max-width: 720px;
  }
  .slide--bg .slide-bg--inner {
    width: 590px;
    height: 590px;
  }
  .slide-badge {
    right: -116px;
  }
}
/* ==================== Responsive Ipad ========================== */
@media only screen and (max-width: 480px) {
  .slider-wrap {
    height: 736px;
  }
  .slide--bg {
    min-height: 550px;
    min-width: 550px;
    max-height: 550px;
    max-width: 550px;
  }
  .slide--bg .slide-bg--inner {
    width: 450px;
    height: 450px;
  }
  .parallax-slider .slide-btns {
    display: none;
  }
  .slide-main--heading {
    font-size: 32px;
  }
  .swiper-pagination {
    display: flex;
    column-gap: 15px;
    justify-content: center;
    bottom: 100px !important;
  }
  span.swiper-pagination-bullet {
    display: block;
  }
}
@media (min-width: 576px) {
  .modal-dialog {
    max-width: 60vw;
    margin: 1.75rem auto;
  }
}
.modal-content {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  pointer-events: auto;
  background-color: #278376;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 0.3rem;
  outline: 0;
}

.modal-footer {
  display: flex;
  flex-wrap: wrap;
  flex-shrink: 0;
  align-items: center;
  justify-content: flex-end;
  padding: 0.75rem;
  border-top: 1px solid rgba(93, 35, 242, 0.2);
  border-bottom-right-radius: calc(0.3rem - 1px);
  border-bottom-left-radius: calc(0.3rem - 1px);
}

.modal-header {
  display: flex;
  justify-content: space-between;
}
.modal-header h5 {
  color: #fff;
}

.modal-header .btn-close {
  margin: 0;
  padding: 0.5rem 0.5rem;
  color: #fff;
}
.modal-header .btn-close i {
  color: #fff;
  font-size: 22px;
  position: relative;
  top: -10px;
}

.sample {
  width: 100%;
}

.sample-caption {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.btn-close-modal {
  background: #f1739d;
  color: #000000;
  height: 40px;
  font-family: iranyekanBakh !important;
  font-weight: 500;
  width: max-content;
  font-size: 18px;
  display: flex;
  align-items: center;
  width: 150px;
  justify-content: center;
}

.modal-footer {
  flex-wrap: wrap;
  flex-shrink: 0;
  align-items: center;
  justify-content: flex-end;
  padding: 0.75rem;
  border-top: 1px solid rgb(54, 111, 103);
  border-bottom-right-radius: calc(0.3rem - 1px);
  border-bottom-left-radius: calc(0.3rem - 1px);
}

.about-container {
  margin-top: 30px;
  direction: rtl;
}

.support-container {
  margin-top: 50px;
  direction: rtl;
}

.workshop-container {
  background-color: #ffedf4;
  background-image: url(../images/vectors/brush.webp);
  background-size: 750px;
  background-position: right 515px;
  background-repeat: no-repeat;
  height: 750px;
  margin-top: 100px;
  margin-bottom: 50px;
  padding: 30px;
  border-radius: 10px;
}

.support-flower {
  position: absolute;
  object-fit: contain;
  height: 200px;
}
.support-flower img {
  object-fit: contain;
  height: 150px;
  width: 150px;
}

.slider-wave {
  display: flex;
  justify-content: center;
  margin: 80px 0;
  margin-bottom: 50px;
  opacity: 0.4;
}

.advertising-campaign {
  margin-bottom: 60px;
}
.advertising-campaign picture {
  border-radius: 8px;
}
.advertising-campaign a {
  height: 280px;
  border-radius: 8px;
  display: block;
  position: relative;
  cursor: pointer;
  object-fit: cover;
}
.advertising-campaign a img {
  height: 100%;
  border-radius: 8px;
  width: 100%;
  object-fit: cover;
}

.ribbon-holder {
  height: 0;
}

.ribbon {
  position: relative;
  width: 50%;
}
.ribbon img {
  position: absolute;
  top: -10px;
  opacity: 0.8;
  width: 40%;
  z-index: -1;
}

.workshop-container .title-design .thin-line {
  width: 94%;
  height: 1px;
  background: #e6c8d2;
}

.ribbon-holder-2 {
  height: 0;
  display: flex;
  justify-content: flex-end;
}

.ribbon-2 {
  position: relative;
  width: 50%;
}
.ribbon-2 img {
  position: absolute;
  z-index: -1;
  top: -150px;
  right: 0px;
  opacity: 0.3;
  width: 40%;
}

.row-design-margin {
  margin-top: 0px;
  margin: 0px !important;
}
.row-design-margin img {
  opacity: 0.4;
}

.video-sample {
  margin-top: 70px;
  margin-bottom: 70px;
}

.about-mall-caption {
  text-align: justify;
  direction: rtl;
  margin-bottom: 40px;
}
.about-mall-caption p {
  font-size: 15px;
}

.about-shape-img {
  height: 450px;
  width: 400px;
  background-image: url(/assets/images/vectors/hero-bg-vec.webp);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right;
}

.shape-area {
  display: flex;
  justify-content: end;
  align-items: end;
}

.about-img-wrapp {
  height: 200px;
  width: 180px;
  object-fit: cover;
  position: relative;
  top: 20px;
  border-radius: 10px;
  left: 25px;
}
.about-img-wrapp img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 98px 98px 0px 0px;
  background: #f4f8fc;
}

.mina-cake-logo {
  height: 318px;
  width: 248px;
  object-fit: cover;
  position: relative;
  top: 27px;
  border-radius: 10px;
  left: -20px;
}
.mina-cake-logo img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.top-img {
  z-index: 0;
  position: relative;
  top: 85px;
  left: -31px;
  height: 500px;
  width: 450px;
  object-fit: cover;
}
.top-img img {
  height: 100%;
  width: 100%;
  background: none !important;
  object-fit: cover;
}

.about-caption-section {
  margin-top: 35px;
}

.about-title {
  font-size: 34px;
  font-family: KalamehWeb;
  font-weight: 600;
}

.top-space-box {
  margin-top: 0px !important;
}

.title-design {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 12px 0;
}
.title-design .rubic {
  height: 8px;
  width: 200px;
  background: #f56295;
}
.title-design .thin-line {
  width: 94%;
  height: 1px;
  background: #f2f4ff;
}
.title-design .mini-line {
  width: 30%;
  height: 1px;
  background: #f2f4ff;
}
.title-design .star {
  height: 25px;
  object-fit: contain;
}
.title-design .star img {
  height: 100%;
  object-fit: contain;
}

.comment-title {
  margin-top: 80px;
}
.comment-title .thin-line {
  width: 32%;
  height: 1px;
  background: #f2f4ff;
}

.comment-slider .item {
  filter: blur(1);
}

.comment-slider .item.active {
  transform: scale(1.01);
  filter: blur(0);
}

.service-wrapp {
  display: flex;
  margin-top: 10px;
  align-items: center;
  margin-bottom: 20px;
}
.service-wrapp .icons-holder {
  height: 60px;
  width: 60px;
  padding: 8px;
  object-fit: contain;
  background: #2d8078;
  background-size: 50px;
  background-repeat: no-repeat;
  background-position: right;
  margin-left: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50px;
}
.service-wrapp .icons-holder img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  position: relative;
}
.service-wrapp .service-box {
  width: 80%;
}
.service-wrapp .service-box h3 {
  font-size: 20px;
  font-family: KalamehWeb;
  font-weight: 600;
}
.service-wrapp .service-box p {
  font-size: 14px;
  line-height: 24px;
}

.mall-top-services {
  margin-top: 20px;
  display: flex;
  flex-wrap: wrap;
}

.support-top-services {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 30px;
}

/* ----------------- Start Category-Section */
.cup-cake {
  height: 200px;
  padding-left: 50px;
  position: relative;
  object-fit: contain;
  animation: cup-cake 2s infinite alternate;
}
@-webkit-keyframes cup-cake {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(10px);
  }
}
@keyframes cup-cake {
  10% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(10px);
  }
}
.cup-cake img {
  height: 100%;
  object-fit: contain;
  position: absolute;
  top: -122px;
  left: 125px;
}

.cup-cake-height {
  height: 0px;
}

.category-section-title {
  color: #656565;
  margin: 10px auto 24px;
  line-height: 30px;
  opacity: 0.7;
  width: 100%;
  text-align: center;
}

.category-section-title h3 {
  font-size: 19px;
}

.category-section-slider .owl-carousel {
  width: 100%;
  z-index: 0;
}

.comment-slider.owl-carousel {
  z-index: 0;
}

.swiper.swiper-watch-progress .swiper-wrapper {
  z-index: 0;
}
.swiper.swiper-watch-progress .swiper {
  z-index: 0;
}

.swiper {
  margin-left: auto;
  margin-right: auto;
  position: relative;
  overflow: hidden;
  list-style: none;
  padding: 0;
  z-index: 0;
  display: block;
}

.category-section-slider .category-slider .item {
  text-align: center;
}

.category-section-slider .category-slider .item img {
  display: block;
  background-image: url(../images/banner/category-bg.webp);
  background-position: center;
  width: 90px;
  height: 90px;
  padding: 20px;
  margin: auto;
  border-radius: 20px;
  object-fit: contain;
}

.category-section-slider .category-slider .item h4 {
  font-size: 13px;
  line-height: 30px;
  color: #2a2a2a;
  margin-top: 8px;
  text-align: center;
}

.category-section-slider .category-slider .item h6 {
  color: rgba(8, 62, 119, 0.3725490196);
  font-size: 12px;
  line-height: 10px;
}

.category-section-slider .category-slider .item h6::before {
  content: "+";
  margin-left: 2px;
}

.category-section-slider .owl-carousel .owl-nav .owl-prev,
.category-section-slider .owl-carousel .owl-nav .owl-next {
  width: 40px;
  height: 80px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-color: #fff;
  background-image: unset;
  font-size: 40px;
  color: #6a6a6a;
  line-height: 40px;
  outline: none;
  -webkit-box-shadow: 0 8px 9px 0 rgba(0, 0, 0, 0.05);
  box-shadow: 0 8px 9px 0 rgba(0, 0, 0, 0.05);
}

.category-section-slider .owl-carousel .owl-nav .owl-prev {
  position: absolute;
  right: -10px;
  border-radius: 8px 0 0 8px;
}

.category-section-slider .owl-carousel .owl-nav .owl-next {
  position: absolute;
  left: -10px;
  border-radius: 0 8px 8px 0;
}

.category-section-slider .owl-carousel .owl-nav .disabled {
  opacity: 0;
  cursor: auto;
  pointer-events: all;
}

.category-section {
  margin-top: 25px;
}

.mouse {
  margin: 0 auto;
  display: block;
  border-radius: 50px;
  border: 2px solid rgba(8, 62, 119, 0.6901960784);
  height: 50px;
  width: 30px;
  position: relative;
}

.move {
  position: absolute;
  background-color: rgba(8, 62, 119, 0.6901960784);
  height: 10px;
  width: 10px;
  border-radius: 50%;
  left: 50%;
  transform: translateX(-50%);
  animation: move 2s linear infinite;
}

@keyframes move {
  0% {
    transform: translate(-50%, 10px);
    opacity: 0;
  }
  50% {
    transform: translate(-50%, 40px);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, 80px);
    opacity: 0;
  }
}
.curved-section {
  border-radius: 0 0 42% 42%/0 0 100% 100%;
  padding-bottom: 55px;
  z-index: -1;
  padding-top: 125px;
  position: relative;
  top: -132px;
  background-image: url(/assets/images/vectors/shadow.png);
  background-size: cover;
  background-position: center;
}

.bg-white {
  background: #fff;
}

.support-wrapp {
  display: flex;
  margin-top: 10px;
}
.support-wrapp .icons-holder {
  height: 50px;
  width: 50px;
  padding: 10px;
  margin-bottom: 10px;
  object-fit: contain;
  background: #f1739d;
}
.support-wrapp .service-box h3 {
  width: max-content;
  color: #000;
  padding: 0px 10px;
}

.our-support {
  display: flex;
  margin-top: 50px;
  background-image: url(../images/vectors/support-bg.webp);
  background-size: contain;
  width: 486px;
  height: 408px;
  background-repeat: no-repeat;
}
.our-support .wrapp-first-img {
  width: 100px;
  height: 350px;
  object-fit: cover;
  position: relative;
  border-radius: 2px;
}
.our-support .wrapp-first-img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 2px;
  position: absolute;
  right: 30px;
}
.our-support .wrapp-second-img {
  width: 100px;
  height: 350px;
  object-fit: cover;
  position: relative;
  border-radius: 2px;
  margin-right: 5px;
}
.our-support .wrapp-second-img img {
  height: 100%;
  position: absolute;
  top: 130px;
  right: 30px;
  width: 100%;
  object-fit: cover;
  border-radius: 2px;
}
.our-support .wrapp-third-img {
  width: 100px;
  height: 350px;
  object-fit: cover;
  position: relative;
  border-radius: 2px;
  margin-right: 5px;
}
.our-support .wrapp-third-img img {
  height: 100%;
  position: absolute;
  right: 30px;
  top: 70px;
  width: 100%;
  object-fit: cover;
  border-radius: 2px;
}

.comment-slider {
  margin-top: 100px;
}

.comment-box {
  padding: 15px 20px;
  background-color: rgba(39, 131, 118, 0.0784313725);
  background-image: url(../images/vectors/comma.png);
  background-size: 70px;
  background-position: 20px 10px;
  background-repeat: no-repeat;
  border-radius: 6px;
  height: 170px;
}
.comment-box .comment-caption p {
  font-size: 13px;
}
.comment-box .name-user {
  padding-right: 0;
}
.comment-box h4 {
  font-family: cinema;
  color: #278376;
  background-color: rgba(39, 131, 118, 0.0705882353);
  padding: 0px 8px;
  border-radius: 4px;
  width: max-content;
  font-size: 20px;
}
.comment-box::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 80px;
  height: 80px;
  border-top: 2px solid rgba(80, 125, 119, 0.3490196078);
  border-left: 2px dashed rgba(80, 125, 119, 0.3490196078);
  border-radius: 7px 0 0 0;
  content: "";
  transition: all 0.3s ease;
}

.birthday-cake {
  margin-top: 0px;
  direction: rtl;
  display: flex;
  justify-content: end;
  position: relative;
  height: 100%;
}
.birthday-cake img {
  height: 250px;
  bottom: -25px;
  position: absolute;
}

.title-space {
  margin-bottom: 50px;
}

.art {
  height: 0px;
  position: relative;
}
.art img {
  position: absolute;
  height: 135px;
  top: -15px;
  left: -90px;
}

.gallery-slider {
  height: 210px;
}

.gallery-wrapper-img {
  height: 180px;
  width: 100%;
  border-radius: 4px;
  object-fit: cover;
}
.gallery-wrapper-img img {
  height: 100%;
  width: 100%;
  border-radius: 4px;
  object-fit: cover;
  filter: grayscale(0.4);
  opacity: 0.9;
}

.slice-row {
  display: flex;
  justify-content: end;
  direction: rtl;
}

.slice {
  height: 0;
  padding-left: 50px;
  position: relative;
  width: 235px;
  object-fit: contain;
  display: flex;
  direction: rtl;
  justify-content: flex-start;
}

.slice img {
  position: absolute;
  width: 100%;
  height: 210px;
  object-fit: contain;
  top: -74px;
  right: -11px;
}

.about-space {
  margin-top: 80px;
}

.see-all-courses {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 35px;
  background: rgba(39, 130, 118, 0.2196078431);
  padding: 5px 20px;
  line-height: 20px;
  margin-top: 15px;
  border-radius: 5px;
  padding-top: 8px;
}
.see-all-courses span {
  font-size: 14px;
  font-weight: 500;
  color: #02322b;
  line-height: 20px;
}
.see-all-courses i {
  font-size: 16px;
  color: #02322b;
}
.see-all-courses:hover {
  background: #278376;
  transition: all 0.3s linear;
}
.see-all-courses:hover span {
  color: #fff;
}
.see-all-courses:hover i {
  color: #fff;
}

.sectionWrapper {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}

.swiper {
  width: 100%;
  height: 100%;
  padding: 50px 20px;
  overflow: hidden;
}

.swiper .parallax-bg {
  position: absolute;
  right: -5%;
  top: -10%;
  width: 200%;
  height: 200%;
  background-size: cover;
  background-position: top center;
  background-repeat: no-repeat;
}

.swiper .swiper-wrapper {
  align-items: center;
}

.swiper .swiper-slide {
  position: relative;
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  border-radius: 7px;
  padding: 10px;
  margin: 0;
  cursor: grab;
  user-select: none;
  text-wrap: pretty;
}

.swiper .swiper-slide::before {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 80px;
  height: 80px;
  border-bottom: 2px dashed white;
  border-right: 2px solid white;
  border-radius: 0 0 7px 0;
  content: "";
  transition: all 0.3s ease;
}

.swiper .swiper-slide::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 80px;
  height: 80px;
  border-top: 2px solid white;
  border-left: 2px dashed white;
  border-radius: 7px 0 0 0;
  content: "";
  transition: all 0.3s ease;
}

.swiper .swiper-slide:hover::before,
.swiper .swiper-slide:hover::after {
  width: 170px;
  height: 170px;
  transition: all 0.3s ease;
}

.swiper .swiper-slide .cardPopout {
  width: 100%;
  height: 100%;
  background-color: rgb(255, 255, 255);
  border-radius: 7px;
  padding: 20px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}

.workshop-swiper .swiper-slide .cardPopout {
  width: 100%;
  height: 100%;
  background-color: rgba(221, 221, 221, 0) !important;
  border-radius: 7px;
  padding: 0px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
}
.workshop-swiper .swiper-slide .cardPopout .w-absolute {
  height: 212px;
  position: relative;
  top: -5px;
}
.workshop-swiper .swiper-slide .cardPopout .cart-wrappering .cart-img {
  border-radius: 4px;
  height: 205px;
  width: 100%;
  object-fit: cover;
}
.workshop-swiper .swiper-slide .cardPopout .workshop-cart {
  margin-bottom: 35px;
  text-align: right;
  height: 28rem !important;
  padding: 15px;
  background-color: #ffffff !important;
  border-radius: 4px;
  border: 2px solid #efdce1 !important;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  background-image: url(../images/vectors/flower-box.png) !important;
  background-size: 100px !important;
  background-position: -20px 250px;
  background-repeat: no-repeat;
  width: 275px;
}
.workshop-swiper .swiper-slide .cardPopout .workshop-samples .swiper .swiper-slide.swiper-slide-active::after .swiper .swiper-slide::before {
  position: absolute;
  bottom: 36px;
  right: 2px;
  width: 30px;
  height: 30px;
  border-bottom: 2px solid #f56295;
  border-right: 2px solid #f1739d;
  border-radius: 0 0 7px 0;
  content: "";
  transition: all 0.3s ease;
}

.swiper .swiper-slide img {
  margin-bottom: 25px;
  border-radius: 5px;
}

.swiper .swiper-slide h2 {
  font-size: 23px;
  line-height: 27px;
  font-family: Cinema;
  border-bottom: 1px solid rgba(39, 131, 118, 0.1);
  padding: 5px 0;
  padding-bottom: 10px;
  margin: 0 0 7px 0;
}

.swiper .swiper-slide h4 {
  font-size: 11px;
  line-height: 120%;
  font-weight: 600;
  margin: 0 0 13px 0;
  color: #f1739d;
}

.swiper .swiper-slide figcaption {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  margin: 0 0 20px 0;
  padding-left: 20px;
  border-left: 2px solid white;
}

.swiper .swiper-slide figcaption p {
  color: #2a2a2a;
  margin: 0;
  font-size: 13px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  text-align: justify;
  line-height: 22px;
  -webkit-box-orient: vertical;
  overflow: hidden;
  letter-spacing: 0;
  font-weight: 400;
}

.swiper .swiper-slide a.course-more-btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 20px;
  background-color: #f1739d;
  color: white;
  border-radius: 3px;
  text-decoration: none;
  overflow: hidden;
  z-index: 1000 !important;
  transition: all 0.6s ease !important;
}
.swiper .swiper-slide a.course-more-btn i {
  margin-right: 5px;
}

.swiper .swiper-slide a.course-more-btn:hover {
  color: rgb(255, 255, 255);
  transition: all 0.6s ease;
}

.swiper .swiper-slide a.course-more-btn::after {
  position: absolute;
  right: 100%;
  bottom: 0;
  width: 100%;
  height: 100%;
  background-color: #278376;
  color: #fff;
  content: "";
  z-index: -1;
  transition: all 0.6s ease;
}

.swiper .swiper-slide a.course-more-btn:hover::after {
  right: 0;
  transition: all 0.6s ease;
}

.swiper .swiper-slide a.course-more-btn svg {
  width: 23px;
  height: auto;
  fill: white;
  margin-left: 5px;
  transition: all 0.6s ease;
}

.swiper .swiper-slide a.course-more-btn:hover svg {
  margin-left: 10px;
  fill: black;
  transition: all 0.6s ease;
}

.swiper .swiper-scrollbar {
  --swiper-scrollbar-bottom: 0px;
  --swiper-scrollbar-size: 10px;
}

@media (max-height: 550px) {
  .swiper .swiper-slide figcaption p {
    -webkit-line-clamp: 2;
  }
}
@media (max-height: 490px) {
  .swiper .swiper-slide figcaption p {
    -webkit-line-clamp: 1;
  }
}
@media (max-height: 460px) {
  .swiper .swiper-slide figcaption p {
    display: none;
  }
  .swiper .swiper-slide h4 {
    margin: 0;
  }
}
@media (max-height: 430px) {
  .swiper .swiper-wrapper {
    position: relative;
    bottom: 6px;
  }
}
@media (max-width: 750px) {
  .swiper .parallax-bg {
    width: 320%;
  }
}
.sectionWrapper {
  background-color: #278376;
  background-image: url(../images/vectors/flower.webp);
  background-size: 400px;
  background-position: bottom;
  background-repeat: repeat-x;
  border-radius: 10px;
  margin-top: 50px;
  margin-bottom: 40px;
  padding: 30px;
}

.row-curved {
  height: 70px;
}

.swiper-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgba(213, 222, 255, 0.238), rgba(0, 0, 0, 0));
}

.swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to left, rgba(213, 222, 255, 0.238), rgba(0, 0, 0, 0));
}

.shop-img {
  height: 220px;
  width: 100%;
  object-fit: cover;
  margin-bottom: 20px;
}
.shop-img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.around-padding {
  padding: 0px 10px;
}

.wrapp-half-ads {
  display: inline-block;
  border-radius: 10px;
  height: 170px;
  width: 100%;
  object-fit: cover;
  margin-bottom: 20px;
}
.wrapp-half-ads img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.line-row {
  width: 100%;
  height: 1px;
  background: #f2f4ff;
}

.test-margin {
  margin-bottom: 150px;
}

.wrapp-step {
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.wrapp-step .wrapp-step-img {
  height: 125px;
  width: 125px;
  object-fit: contain;
  border-radius: 100%;
}
.wrapp-step .wrapp-step-img img {
  object-fit: contain;
  border-radius: 100%;
  height: 100%;
  width: 100%;
}
.wrapp-step strong {
  background: rgba(204, 41, 55, 0.0901960784);
  color: #278376;
  padding: 3px 18px;
  font-weight: 600;
  font-size: 13px;
  border-radius: 20px;
  margin-bottom: 10px;
  display: inline-block;
}
.wrapp-step h4 {
  font-size: 22px;
}
.wrapp-step p {
  padding: 0px 12px;
  font-size: 13px;
}

.steps-row {
  position: relative;
  top: -50px;
}

.wave-holder {
  margin-bottom: -20px;
}

.margin-top-sett {
  margin-top: 35px;
}

.researcher {
  width: 200px;
  height: 380px;
  object-fit: contain;
  position: relative;
}
.researcher img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  position: absolute;
  top: 50px;
}

.search-vc-1 {
  width: 200px;
  height: 180px;
  object-fit: contain;
}
.search-vc-1 img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.search-title {
  color: #fff;
}
.search-title h3 {
  font-family: cinema !important;
  font-size: 30px;
}

.search__box {
  float: left;
  width: 0;
  height: 4rem;
  /*   display: inline; */
  background: none;
  color: #f7f7f7;
  font-size: 1.5rem;
  border-radius: 2rem;
  outline: none;
  border: none;
  position: relative;
  opacity: 1;
  transition: all 0.75s ease-in;
  cursor: pointer;
  /*   border: 2px solid tomato; */
  /*   margin-top: 5px; */
}

/* .search__box:focus, .search__box:hover {
    background-color: #f1f2f6;
  } */
.search__icon {
  box-sizing: border-box;
  float: right;
  font-size: 2.5rem;
  display: inline-block;
  /*   justify-content: center;
    align-items: center; */
  margin-left: 0.8rem;
  margin-top: 0;
  cursor: pointer;
  position: absolute;
  color: #fa983a;
  transition: all 0.25s ease-in;
  padding: 0.7rem;
  border-radius: 50%;
}

.container:hover > .search__box {
  width: 85%;
  padding: 0 1rem;
}

.container:hover > .search__icon {
  background-color: #eee;
}

.form-field {
  display: block;
  width: 100%;
  padding: 8px 16px;
  line-height: 25px;
  font-size: 14px;
  font-weight: 500;
  font-family: inherit;
  border-radius: 6px;
  -webkit-appearance: none;
  color: var(--input-color);
  border: 1px solid var(--input-border);
  background: var(--input-background);
  transition: border 0.3s ease;
  direction: rtl;
}
.form-field::placeholder {
  color: var(--input-placeholder);
}
.form-field:focus {
  outline: none;
  border-color: var(--input-border-focus);
}

.form-group {
  position: relative;
  display: flex;
  width: 100%;
}
.form-group > span,
.form-group .form-field {
  white-space: nowrap;
  display: block;
}
.form-group > span:not(:first-child):not(:last-child),
.form-group .form-field:not(:first-child):not(:last-child) {
  border-radius: 0;
}
.form-group > span:first-child,
.form-group .form-field:first-child {
  border-radius: 6px 0 0 6px;
}
.form-group > span:last-child,
.form-group .form-field:last-child {
  border-radius: 0 6px 6px 0;
}
.form-group > span:not(:first-child),
.form-group .form-field:not(:first-child) {
  margin-left: -1px;
}
.form-group .form-field {
  position: relative;
  z-index: 1;
  flex: 1 1 auto;
  width: 1%;
  margin-top: 0;
  margin-bottom: 0;
}
.form-group > span {
  text-align: center;
  padding: 8px 36px;
  font-size: 14px;
  line-height: 25px;
  color: #ffffff;
  background: #278376;
  border: 1px solid #278376;
  transition: background 0.3s ease, border 0.3s ease, color 0.3s ease;
  display: flex;
  align-items: center;
  font-family: Cinema;
  font-size: 18px;
}
.form-group:focus-within > span {
  color: var(--group-color-focus);
  background: var(--group-background-focus);
  border-color: var(--group-border-focus);
}

.search-feild-holder {
  display: flex;
  align-items: flex-end;
  flex-direction: column;
  justify-content: center;
  text-align: right;
  height: 300px;
}

.search-title h3 {
  margin-bottom: 15px;
}
.search-title p {
  font-size: 14px;
  color: #fff;
  margin-bottom: 10px;
  font-weight: 600;
}

.form-group {
  position: relative;
  display: flex;
  width: 100%;
  height: 60px;
}

/* ------------ Start Product-Carousel */
section.slider-section {
  padding: 40px 25px 15px;
  background-color: #fff;
  border: 1px solid #eee;
  border-radius: 8px;
}

section.slider-section .product-card {
  border-radius: 0;
  border-left: 1px solid #eee;
  border: 1px solid #eee;
  border-radius: 10px;
  padding: 15px 10px;
}

.free-shipping {
  display: flex;
  align-items: center;
  width: max-content;
  position: absolute;
  z-index: 1;
  background: rgba(211, 81, 84, 0.1019607843);
  right: 7px;
  border-radius: 5px;
  padding: 0px 8px;
}
.free-shipping i {
  font-size: 17px;
  color: #d35154;
  margin-left: 5px;
}
.free-shipping strong {
  font-size: 12px;
}

.amazing-section {
  border-radius: 0 !important;
}

.amazing-product a {
  display: block;
  padding: 10px 15px;
}

.amazing-product img {
  -o-object-fit: contain;
  object-fit: contain;
  margin: auto;
  height: 250px;
}

.amazing-product a.view-all-amazing-btn {
  display: inline-block;
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  border: 1px solid #fff;
  padding: 9px 18px;
  border-radius: 5px;
}

.amazing-product a.view-all-amazing-btn.black-btn {
  color: #000000;
  border: 1px solid #000000;
}

.category-banner a {
  height: 220px;
  width: 220px;
  object-fit: contain;
}
.category-banner a img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.amazing-section .product-card {
  border-radius: 10px !important;
  border-left: 0 !important;
}

.amazing-section .product-carousel .item {
  margin-bottom: 20px !important;
}

.product-carousel .item {
  margin-bottom: 0px !important;
}

.product-carousel {
  position: relative;
}

.product-carousel .owl-dots {
  margin-top: 0 !important;
  text-align: center;
}

.product-carousel .owl-dot {
  outline: none;
}

.product-carousel .owl-dot span {
  width: 8px;
  height: 8px;
  margin: 5px 7px;
  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;
}

.product-carousel .owl-dot.active span,
.product-carousel .owl-dot:hover span {
  background: #d35154;
}

.product-carousel .owl-dot.active span {
  width: 38px;
}

.product-carousel .owl-nav {
  margin-top: 0;
}

.product-carousel .owl-nav button {
  opacity: 1;
  -ms-filter: none;
  filter: none;
  position: absolute;
  top: 50%;
  width: 40px;
  height: 80px;
  margin-top: -20px;
  line-height: 37px !important;
  text-align: center;
  outline: none;
  -webkit-box-shadow: 0 8px 9px 0 rgba(0, 0, 0, 0.05);
  box-shadow: 0 8px 9px 0 rgba(0, 0, 0, 0.05);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.product-carousel .owl-nav button.owl-next,
.product-carousel .owl-nav button.owl-prev {
  background-color: #fff;
  font-size: 40px;
  color: #6a6a6a;
}

.product-carousel .owl-nav button.owl-next {
  left: 10px;
  cursor: pointer;
  border-radius: 0 8px 8px 0;
}

.product-carousel .owl-nav button.owl-prev {
  right: 10px;
  cursor: pointer;
  border-radius: 8px 0 0 8px;
}

.product-carousel .owl-nav button.owl-next:hover,
.product-carousel .owl-nav button.owl-prev:hover {
  background-color: #fff;
  color: #000;
}

.product-carousel .owl-nav button.disabled {
  opacity: 0 !important;
}

/* ------------ Start Product-Card */
.product-card {
  position: relative;
  background-color: #fff;
  padding-top: 10px;
  padding-bottom: 20px;
  margin: 5px;
  border-radius: 8px;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}

.seggest-items .product-card {
  margin: 0px;
  padding: 8px 5px;
}
.seggest-items .product-card .product-img {
  height: 220px;
  width: 100%;
  object-fit: contain;
}
.seggest-items .product-card .product-img img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.product-img {
  height: 230px;
  width: 100%;
  object-fit: contain;
}
.product-img img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.product-card .promotion-badge {
  font-size: 12px;
}
.product-card .product-timeout {
  position: absolute;
  bottom: -14px;
  right: -8px;
}
.product-card .product-timeout .countdown-timer span {
  display: inline-block;
  width: 50px;
  height: 20px;
  position: relative;
}
.product-card .promotion-badge {
  color: #d35154;
  border-bottom: 1px solid #d35154;
}
.product-card .product-timeout .countdown-timer {
  direction: ltr;
  text-align: center;
  font-weight: 600;
  font-size: 14px;
}
.product-card .promotion-badge {
  width: 100%;
  height: 25px;
  font-size: 20px;
  font-weight: 600;
  text-align: right;
  line-height: 12px;
  color: #d35154;
  border-bottom: 1px solid rgba(211, 81, 84, 0.2196078431);
  position: absolute;
  top: -31px;
  z-index: 10000000;
}

.product-card .product-timeout .countdown-timer span {
  display: inline-block;
  width: 40px;
  height: 20px;
  position: relative;
  color: #d35154;
}

.product-card .promotion-badge {
  font-size: 12px !important;
  padding-right: 8px;
}

.amazing-section .product-card .product-card-body {
  padding: 5px 15px;
}
.amazing-section .product-card .product-card-body .product-price {
  padding-left: 0;
}

.first-widget-seggustion {
  height: 452px;
  margin-top: 5px;
}

.widget-suggestion .owl-dots {
  margin-top: 0 !important;
  text-align: center;
  top: -10px !important;
  position: relative;
}

.product-card:hover {
  -webkit-box-shadow: 0 2px 6px 0 rgba(51, 73, 94, 0.15);
  box-shadow: 0 2px 6px 0 rgba(51, 73, 94, 0.15);
}

.product-card .product-head {
  padding: 5px 8px;
}

.rating-stars {
  display: inline-block;
  white-space: nowrap;
  vertical-align: middle;
}

.rating-stars i {
  display: inline-block;
  margin-left: -7px;
  color: #bfbfbf;
  font-size: 0.875rem;
}

.rating-stars i.active {
  color: #ffd800;
}

.discount {
  position: absolute;
  top: 10px;
  left: 10px;
}

.discount span {
  display: inline-block;
  padding: 2px 8px;
  font-size: 12px;
  color: #fff;
  background: #d35154;
  border-radius: 15px 15px 0 15px;
}

.product-card .product-thumb {
  display: block;
  position: relative;
  overflow: hidden;
}

.product-card .product-thumb::before {
  background-color: #fff;
  opacity: 0.5;
  top: 0;
  bottom: 0;
  content: "";
  left: -130%;
  position: absolute;
  width: 200px;
  box-shadow: 0 0 100px #fff;
  -webkit-transform: skew(-20deg);
  transform: skew(-20deg);
  -webkit-transition: all 0.6s ease;
  transition: all 0.6s ease;
}

.product-card:hover .product-thumb::before {
  left: 200%;
}

.fire-icon-title {
  font-size: 50px;
  width: 20px;
  display: inline-block;
  color: #d35154;
  position: relative;
  top: 8px;
}

.product-card .product-card-body {
  padding: 0px 2px;
  position: relative;
}

.product-card .product-card-body .add-to-compare {
  position: absolute;
  top: -45px;
  left: 15px;
  background-color: #fff;
  border-radius: 10px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
  padding: 5px 15px;
  box-sizing: border-box;
  opacity: 0;
  transition: all 0.1s ease;
}

.product-card:hover .product-card-body .add-to-compare {
  opacity: 1;
}

.product-card .product-card-body .add-to-compare .custom-control {
  padding-left: 0;
}

.product-card .product-card-body .add-to-compare .custom-control-label {
  padding-right: 20px;
}

.product-card .product-meta {
  display: block;
  margin-bottom: 0.5rem;
  color: rgba(140, 140, 140, 0.75);
  font-size: 10px;
  font-weight: 600;
  text-decoration: none;
  -webkit-transition: color 0.25s;
  transition: color 0.25s;
}

.product-card .product-meta:hover {
  color: #404040;
}

.see-all-salers {
  height: 70px;
  border-radius: 12px;
  padding: 20px;
  display: inline-block;
  background: #ff7d00;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.see-all-salers p {
  font-size: 16px;
  color: #fff;
  font-weight: 600;
}
.see-all-salers p img {
  height: 45px;
  margin-left: 10px;
  background: linear-gradient(44deg, rgba(255, 255, 255, 0.1294117647) 0.64%, rgba(255, 205, 156, 0.8117647059) 98.23%);
  padding: 6px;
  border-radius: 12px;
}
.see-all-salers i {
  font-size: 26px;
  color: #fff;
  font-weight: 600;
}

.see-lower-price {
  height: 70px;
  border-radius: 12px;
  padding: 20px;
  display: inline-block;
  background: #fff3e8;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.see-lower-price p {
  font-size: 16px;
  color: #000;
  font-weight: 600;
}
.see-lower-price p img {
  height: 45px;
  margin-left: 10px;
  background: linear-gradient(44deg, rgba(255, 123, 0, 0.3960784314) 0.64%, rgba(255, 254, 253, 0.9058823529) 98.23%);
  padding: 6px;
  border-radius: 12px;
}

.price-tg {
  color: #000000;
  font-weight: 600;
  font-size: 22px;
  font-variation-settings: "dots" 4;
}

.qty-tg {
  color: #1f1f1f;
  font-size: 12px;
  font-weight: 500;
}

.product-title {
  font-size: 18px;
  font-weight: 600;
}

.salers-row {
  margin: 10px 0px;
}

.product-card .product-title {
  font-size: 14px;
  font-weight: 600;
  color: #000;
  line-height: 24px;
  margin-top: 0px;
  margin-bottom: 10px;
  display: -webkit-box;
  max-width: 400px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: right;
  direction: rtl;
}

.product-card .product-title > a {
  -webkit-transition: color 0.3s;
  transition: color 0.3s;
  color: #d35154;
  text-decoration: none;
  display: block;
  font-weight: 600;
}

.product-card .product-title > a:hover {
  color: #f44336;
}

.product-card .product-price {
  display: block;
  color: #000000;
  font-weight: 600;
  text-align: left;
  font-size: 15px;
  padding-left: 15px;
}
.product-card .product-price strong {
  font-weight: 600;
}

.hover-effect-img {
  display: block;
  position: relative;
  overflow: hidden;
}

.hover-effect-img::before {
  background-color: white;
  opacity: 0.5;
  top: 0;
  bottom: 0;
  content: "";
  left: -100%;
  position: absolute;
  width: 200px;
  box-shadow: 0 0 100px white;
  -webkit-transform: skew(-20deg);
  transform: skew(-20deg);
  -webkit-transition: all 0.6s ease;
  transition: all 0.6s ease;
}

.card-row:hover .hover-effect-img::before {
  left: 200%;
}

.search-amazing-content {
  padding-top: 65px;
}

.search-amazing-tab .product-card {
  padding-top: 40px;
  border-bottom: 1px solid #eee;
  border-radius: 0;
}

.btn-filter-sidebar {
  background-color: #e0e0e0;
  border: 0;
  border-radius: 7px;
  padding: 10px 20px;
  margin-bottom: 15px;
  margin-right: 15px;
}

.promotion-badge {
  width: 100%;
  height: 29px;
  font-size: 20px;
  font-weight: 600;
  text-align: center;
  line-height: 17px;
  color: #d35154;
  border-bottom: 1px solid #d35154;
  position: absolute;
  top: 10px;
}

.promotion-badge.not-available {
  color: #6c757d;
  border-color: #6c757d;
}

.product-card .promotion-badge {
  font-size: 16px;
}

.search-amazing-tab .discount {
  top: 42px;
}

/* End Product-Card------------ */
/* ------------ Start Section-Title */
.section-title {
  position: relative;
  margin-bottom: 20px;
  z-index: 0;
}

.title-wide::after {
  content: "";
  background-color: #d9e1eb;
  height: 2px;
  width: 100%;
  position: absolute;
  left: 0;
  top: 16px;
}

.no-after-title-wide::after {
  display: none;
}

.title-wide a,
.title-wide h2 {
  color: #1c1c1c;
  line-height: 33px;
}

.title-wide h2 {
  font-size: 20px;
  height: 33px;
  position: relative;
  z-index: 10;
  display: inline-block;
  padding-right: 40px;
  padding-left: 10px;
}

.text-sm-title h2 {
  font-size: 26px !important;
  font-weight: 600;
  margin-bottom: 12px;
  font-family: Cinema;
}

.title-wide h2:after,
.title-wide h2:before {
  content: "";
}

.mini-banner {
  height: 108px;
  margin-top: 10px;
  width: 100%;
  object-fit: cover;
  border-radius: 10px;
}
.mini-banner img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.see-all h4 {
  font-size: 16px;
  font-weight: 600;
}
.see-all a {
  padding: 5px 25px;
  background: rgba(252, 226, 227, 0.55);
  border: 1px solid #d35154;
  border-radius: 8px;
  text-align: center;
  color: #d35154;
  font-weight: 600;
  font-size: 15px;
  margin-top: 26px;
}

.title-wide h2:before {
  background: url(/assets/images/vectors/red-star.png) left no-repeat;
  display: block;
  position: absolute;
  right: -20px;
  top: 4px;
  padding: 12px;
  height: 14px;
  width: 32px;
  margin-right: 9px;
  height: 35px;
  width: 40px;
}

.no-title-wide-before h2 {
  padding-right: 10px;
}

.no-title-wide-before h2::before {
  background: none;
}

.title-wide a {
  display: block;
  position: relative;
  float: left;
  padding: 0 10px;
  margin: 4px;
  height: 33px;
  background-color: #f1739d;
  color: #fff !important;
  font-weight: 600;
  border-radius: 3px;
  z-index: 100;
}

.title-wide a::before {
  content: "";
  position: absolute;
  top: 16px;
  left: -28px;
  width: 28px;
  height: 2px;
}

.section-title p {
  margin: -10px 40px 0;
  color: #000;
  font-weight: 600;
  font-size: 18px;
}

/* End Section-Title------------ */
.shop-name {
  display: flex;
  background-color: rgba(204, 41, 55, 0.1058823529);
  padding: 5px 10px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  margin-bottom: 8px;
}
.shop-name img {
  height: 22px;
  width: 22px !important;
  margin-left: 6px;
}
.shop-name strong {
  font-size: 13px;
  font-weight: 600;
  color: #278376;
}

.shop-details {
  display: flex;
  align-items: center;
}
.shop-details .plak {
  width: 50%;
  padding: 4px 8px;
  display: flex;
  align-items: center;
  border-radius: 4px;
  background: rgba(228, 233, 255, 0.5647058824);
  margin-left: 5px;
}
.shop-details .plak img {
  height: 20px;
  width: 22px !important;
  margin-left: 4px;
}
.shop-details .plak span {
  font-size: 12px;
  font-weight: 600;
  color: #f1739d;
}
.shop-details .plak strong {
  color: #f1739d;
  margin-right: 5px;
}
.shop-details .rate {
  width: 50%;
  padding: 4px 8px;
  display: flex;
  align-items: center;
  border-radius: 4px;
  background: rgba(228, 233, 255, 0.5647058824);
  margin-right: 5px;
}
.shop-details .rate img {
  height: 18px;
  width: 18px !important;
  margin-left: 4px;
}
.shop-details .rate span {
  font-size: 12px;
  font-weight: 600;
  color: #f1739d;
}
.shop-details .rate strong {
  color: #f1739d;
  margin-right: 5px;
}

.prouct-order-details {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0px 5px;
}
.prouct-order-details a {
  color: #f1739d;
  background: rgba(228, 233, 255, 0.3333333333);
  border-radius: 4px;
  padding: 2px 12px;
  display: flex;
  align-items: center;
}
.prouct-order-details a span {
  font-size: 12px;
  font-weight: 600;
}
.prouct-order-details a i {
  font-size: 13px;
  margin-right: 5px;
}

.tall-banner {
  height: 490px;
  width: 100%;
  object-fit: cover;
  border-radius: 8px;
}
.tall-banner img {
  height: 100%;
  object-fit: cover;
  width: 100%;
  border-radius: 8px;
}

.padding-left {
  padding-left: 0;
}

.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 .btn-link {
  font-size: 13px;
  text-align: right;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #ffe4ef !important;
}
.blog-cart-wrapp-big p {
  font-size: 12px;
  color: #000;
  line-height: 24px;
  margin-top: 10px;
  margin-bottom: 0px;
  display: -webkit-box;
  max-width: 400px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: right;
  direction: rtl;
}

.blog-img {
  height: 200px;
  width: 100%;
  object-fit: cover;
  position: relative;
  border-radius: 8px;
}
.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 strong {
  font-size: 12px;
}
.blog-link .blog-date span {
  font-weight: 600;
  margin-right: 2px;
  font-size: 12px;
  display: inline-block;
}
.blog-link i {
  margin-right: 5px;
  font-size: 14px;
  color: #f1739d;
  display: inline-block;
}

.btn-link {
  background: rgba(242, 128, 166, 0.16);
  padding: 2px 10px;
  padding-left: 16px;
  border-radius: 4px;
  color: #1e1e1e;
  font-weight: 600;
  display: flex;
  margin-top: -1px;
  align-items: center;
  text-decoration: none;
  font-size: 15px;
  font-weight: 600;
  padding-top: 4px;
}
.btn-link i {
  margin-right: 5px;
  font-size: 16px;
  display: inline-block;
}

.form-select {
  --bs-form-select-bg-img: url(
    data:image/svg + xml,
    %3csvgxmlns="http://www.w3.org/2000/svg"viewBox="0 0 16 16"%3e%3cpathfill="none"stroke="%23343a40"stroke-linecap="round"stroke-linejoin="round"stroke-width="2"d="m2 5 6 6 6-6"/%3e%3c/svg%3e
  );
  display: block;
  width: 100%;
  padding: 0.375rem 2.25rem 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--bs-body-color);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: var(--bs-body-bg);
  background-image: var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none);
  background-repeat: no-repeat;
  background-position: left 0.75rem center;
  background-size: 16px 12px;
  border: var(--bs-border-width) solid var(--bs-border-color);
  border-radius: var(--bs-border-radius);
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.button-filters .form-select {
  background-color: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2 !important;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.blog-link-small {
  padding: 5px 12px;
  padding-left: 10px;
  border-radius: 6px;
  color: #1e1e1e;
  display: flex;
  margin-top: 5px;
  align-items: center;
  text-decoration: none;
  font-size: 10px;
  display: flex;
  justify-content: space-between;
}
.blog-link-small .btn-link {
  font-size: 13px;
  text-align: right;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #ffe4ef !important;
}
.blog-link-small .blog-date strong {
  font-size: 12px;
}
.blog-link-small .blog-date span {
  font-weight: 600;
  margin-right: 2px;
  font-size: 12px;
  display: inline-block;
}
.blog-link-small i {
  margin-right: 5px;
  font-size: 14px;
  color: #f1739d;
  display: inline-block;
}

.blog-cart-wrapp-small {
  display: flex;
  margin-bottom: 10px;
  text-align: right;
  align-items: center;
  padding: 15px;
  font-size: 11px;
  background: rgb(255, 255, 255);
  border-radius: 8px;
  border: 1px solid #f2f2f2;
}

.blog-img-small {
  height: 150px;
  width: 260px !important;
  border-radius: 4px;
  object-fit: cover;
}
.blog-img-small img {
  height: 100%;
  width: 100% !important;
  border-radius: 4px;
  object-fit: cover;
}

.small-blog-caption {
  margin-right: 20px;
}
.small-blog-caption h4 {
  font-size: 14px !important;
  margin: 4px 0px;
  margin-top: 5px;
  border-bottom: 1px solid #eee;
  padding-bottom: 10px;
  margin-bottom: 5px;
  position: relative;
  height: 38px;
  font-weight: 600;
  max-width: 400px;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: right;
  direction: rtl;
}
.small-blog-caption p {
  font-size: 12px;
  color: #000;
  line-height: 24px;
  margin-top: 10px;
  margin-bottom: 0px;
  display: -webkit-box;
  max-width: 400px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: right;
  direction: rtl;
}

.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;
}

.tall-blog-banner {
  height: 375px;
  width: 100%;
  object-fit: cover;
  border-radius: 8px;
}
.tall-blog-banner img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 8px;
}

.footer-section {
  width: 100%;
}

q.footer-section {
  position: relative;
  direction: rtl;
  text-align: right;
}

.footer-cta {
  border-bottom: 1px solid #e8e8e8;
}

.brod-c {
  direction: rtl;
  background: #ffffff;
  height: 60px;
  display: flex;
  align-items: center;
  border-radius: 8px;
  border: 1px solid #f5f5f5;
  margin-top: 10px;
  padding: 0px 15px;
}

.searching-title {
  font-size: 15px;
  margin-bottom: 0px;
}

.brod-c a {
  color: #6b6b6b;
}

.brod-c a:hover {
  text-decoration: underline !important;
}

.searching-title span {
  font-size: 16px;
  margin-left: 15px;
  color: #f1739d;
}

.cta-text {
  padding-left: 15px;
  display: inline-block;
}

.cta-text h4 {
  color: #fff;
  font-size: 20px;
  font-weight: normal;
  margin-bottom: 2px;
}

.cta-text span {
  color: #757575;
  font-size: 15px;
}

.footer-content {
  position: relative;
  z-index: 2;
}

.footer-pattern img {
  position: absolute;
  top: 0;
  left: 0;
  height: 330px;
  background-size: cover;
  background-position: 100% 100%;
}

.footer-logo {
  margin-bottom: 10px;
}

.footer-logo img {
  max-width: 180px;
}

.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(255, 255, 255);
  display: block;
  font-size: 14px;
  font-weight: normal;
  margin-bottom: 20px;
}

.certificated-parent {
  display: flex;
  justify-content: flex-start;
}

.footer-design {
  margin-top: 0px;
  padding: 30px 0px;
  direction: rtl;
  display: flex;
  justify-content: center;
  text-align: right;
  background-color: #02322b;
  background-image: url(../images/vectors/footer-bg.svg);
  background-size: 250px;
  background-position: bottom left;
  background-repeat: no-repeat;
}

.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: #ffffff;
  font-size: 32px;
  margin-left: 10px;
}

.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: #278376;
}

.footer-widget ul li {
  margin-bottom: 12px;
  text-align: right;
}

.footer-widget ul li a:hover {
  color: #f1739d;
}

.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: #f1739d;
  padding: 7px 20px;
  border: 1px solid #f1739d;
  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);
}

.copyright-area {
  border-top: 1px solid #133d37;
  padding: 12px 0;
  background: #03332c;
  width: 100%;
  direction: rtl;
  text-align: right;
}

.ads-align {
  display: flex;
  justify-content: end;
}

.dotnettime {
  width: auto;
  height: 55px;
  display: flex;
  align-items: center;
  background: #002a24;
}

.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: 13px;
  color: #878787;
  display: inline-block;
  margin-top: 9px;
}

.copyright-text-p {
  font-size: 12px;
  color: #878787;
}

.copyright-text p {
  margin: 0;
  font-size: 14px;
  color: #878787;
  text-align: center;
}

.copyright-text p a {
  color: #f1739d;
}

.footer-menu li {
  display: inline-block;
  margin-left: 20px;
}

.footer-menu li:hover a {
  color: #f1739d;
}

.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/vectors/footer.png);
  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 {
  display: flex;
  justify-content: center;
}
.class-time-details p {
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  background: #f1739d;
  border-radius: 4px;
  padding: 0px 30px;
  width: fit-content;
}
.class-time-details p strong {
  color: #ccc;
}

.cake-vector {
  height: 120px;
  width: 170px;
  position: relative;
}

.cakes-vector-holder {
  position: absolute;
  right: -250px;
  top: -35px;
}

.video-sample-box {
  height: 480px;
  border-radius: 6px;
  background: #ffe4ef;
  display: flex;
  align-items: center;
  direction: rtl;
}
.video-sample-box .title-design {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 12px 0;
}
.video-sample-box .title-design .rubic {
  height: 8px;
  width: 120px;
  background: #507d77;
}
.video-sample-box .title-design .thin-line {
  width: 94%;
  height: 1px;
  background: #fff;
}
.video-sample-box .title-design .mini-line {
  width: 30%;
  height: 1px;
  background: #f2f4ff;
}
.video-sample-box .title-design .star {
  height: 25px;
  object-fit: contain;
}
.video-sample-box .title-design .star img {
  height: 100%;
  object-fit: contain;
}

.sample-article P {
  direction: rtl;
  text-align: justify;
}

.window-bg {
  background-image: url(../images/vectors/window.svg);
  height: 420px;
  background-repeat: no-repeat;
  width: 400px;
  position: relative;
  background-position: right;
  background-size: contain;
}

.blogs {
  margin-top: 60px;
  margin-bottom: 60px;
}

.footer-widget ul {
  list-style: none;
}

.dotnettime-logo img {
  height: 18px;
}

.card {
  width: 100%;
  height: 260px;
  background: linear-gradient(180deg, #eff2fe 0%, #e4e9ff 100%);
  border-radius: 10px;
  border: 1px solid #e4e9ff;
  font-size: 16px;
  transition: all 0.3s ease;
  position: relative;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-direction: column;
  cursor: pointer;
  direction: rtl;
  padding: 20px;
  transition: all 0.3s ease;
  text-align: right;
  margin: 0px;
}

.card:hover {
  background: linear-gradient(180deg, #ffffff 0%, #e4e9ff 100%);
}

.icon {
  margin: 0 auto;
  width: 100%;
  height: 80px;
  padding: 18px;
  max-width: 80px;
  background: linear-gradient(90deg, #d75dbc 0%, #6a4bc4 40%, #432a90 60%);
  background: radial-gradient(circle farthest-corner at 100% 150%, #b28eff 10%, #eee9ff 50%);
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  color: rgb(0, 0, 0);
  transition: all 0.8s ease;
  background-position: 0px;
  background-size: 200px;
}

.material-icons.md-18 {
  font-size: 18px;
}

.material-icons.md-24 {
  font-size: 24px;
}

.material-icons.md-36 {
  font-size: 36px;
}

.material-icons.md-48 {
  font-size: 48px;
}

.card .title {
  width: 100%;
  margin: 0;
  text-align: center;
  margin-top: 20px;
  color: rgb(0, 0, 0);
  font-weight: 600;
  font-size: 18px;
}

.card .text {
  width: 80%;
  margin: 0 auto;
  font-size: 14px;
  text-align: center;
  margin-top: 10px;
  color: rgb(0, 0, 0);
  font-weight: 500;
  letter-spacing: 0px;
  max-height: 0;
  direction: rtl;
  transition: all 0.3s ease;
  text-align: center;
}

.card:hover .info {
  height: 90%;
}

.card:hover .text {
  transition: all 0.3s ease;
  opacity: 1;
  margin-top: 0;
}

.card:hover .icon {
  background-position: -120px;
  transition: all 0.3s ease;
}

.card:hover .icon i {
  background: linear-gradient(90deg, #ff7e7e, #ff4848);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  opacity: 1;
  transition: all 0.3s ease;
}

.wrapping-larg-view {
  width: 100%;
  margin-bottom: 0px;
}

.main-layer {
  padding: 0 15px;
}

.centeral-page {
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}

.heading-title {
  margin-top: 60px;
  padding: 10px 25px;
}

.heading-title h4 {
  font-weight: 600;
}

.wrapping-larg-view {
  width: 100%;
  margin-bottom: 0px;
}

.main-layer {
  padding: 0 15px;
}

.centeral-page {
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
}

.heading-title {
  margin-top: 60px;
  padding: 10px 25px;
}

.heading-title h4 {
  font-weight: 600;
}

.mission-row {
  margin-bottom: 50px;
}

.shop-bg-banner {
  height: 650px;
  background-image: url(../../assets/images/banners/w1.jpg);
  background-position: center;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0px;
}

.glass-banner {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: start;
  align-items: center;
  background: linear-gradient(27deg, rgba(118, 152, 188, 0.25) 0%, rgb(0, 16, 33) 100%);
}
.glass-banner:hover {
  background: linear-gradient(27deg, rgba(118, 152, 188, 0.25) 0%, rgb(0, 7, 14) 100%);
}

.shop-info {
  display: flex;
  align-items: center;
}
.shop-info .shop-logo {
  height: 130px;
  min-width: 130px;
  padding: 15px;
  object-fit: contain;
  background: #fff;
  position: relative;
  border-radius: 8px;
}
.shop-info .shop-logo img {
  height: 100%;
  width: 100%;
  object-fit: contain;
}
.shop-info .shop-logo::before {
  position: absolute;
  bottom: -15px;
  right: -15px;
  width: 40px;
  height: 40px;
  border-bottom: 2px dashed white;
  border-right: 2px solid white;
  border-radius: 0 0 7px 0;
  content: "";
  transition: all 0.3s ease;
}
.shop-info .shop-logo::after {
  position: absolute;
  top: -15px;
  left: -15px;
  width: 60px;
  height: 40px;
  border-top: 2px solid #7892c0;
  border-left: 2px dashed #7892c0;
  border-radius: 7px 0 0 0;
  content: "";
  transition: all 0.3s ease;
}
.shop-info .shop-name {
  background: #fff;
  color: #000000;
  margin-bottom: 0px;
  margin-right: 45px;
  position: relative;
  padding: 5px 20px;
  padding-left: 60px;
}
.shop-info .shop-name h3 {
  font-size: 34px;
  font-family: Cinema !important;
  margin-bottom: 0px;
}
.shop-info .shop-name::after {
  position: absolute;
  bottom: -8px;
  left: -10px;
  width: 30px;
  height: 28px;
  border-bottom: 2px solid #ffffff;
  border-left: 2px dashed #ffffff;
  border-radius: 0px 4px 0px 5px;
  content: "";
  transition: all 0.3s ease;
}

.top-relative {
  position: relative;
  top: -120px;
}

.caption-content {
  background: #fff;
  border: 1px solid #f2f2f2;
  border-top: none;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.13);
}

.header-content {
  padding: 5px 20px;
  border-radius: 8px;
  position: relative;
  display: flex;
  background: #fff;
}

.shop-info-content {
  padding: 0;
  direction: rtl;
  padding: 10px;
  padding-bottom: 20px;
  border-radius: 8px 8px 0px 0px;
  position: relative;
  right: -75px;
}
.shop-info-content .shop-main-name {
  font-size: 28px;
  font-family: Cinema !important;
  background: #fff;
  padding: 5px 20px;
  border-radius: 8px;
  margin-bottom: 10px;
  width: max-content;
}

.lg-toolbar {
  top: 120px;
}

.info-holder {
  direction: rtl;
  display: flex;
  justify-content: start;
}

.wrapp-content-body {
  padding: 40px 35px;
  background: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.14);
}

.content-top {
  position: relative;
  top: -50px;
}

.demo-gallery {
  height: 480px;
  overflow: hidden;
  direction: ltr;
}

.gallery-area .wrapp-gallery-bg {
  height: 400px;
  width: 100%;
  object-fit: cover;
  background-image: url(../../assets/images/vectors/pattern-1.webp);
  background-size: cover;
  padding: 10px;
}

.show-galley {
  height: 400px !important;
  width: 100% !important;
  object-fit: cover;
  position: relative;
  top: -40px;
}

.show-galley img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  filter: grayscale(0.5);
  box-shadow: 0px 2px 13px 0px rgba(0, 0, 0, 0.26);
}

.see-all-imges {
  font-size: 16px;
}

.show-btn-img {
  height: 30px;
  width: 30px;
  object-fit: contain;
}
.show-btn-img img {
  box-shadow: none !important;
  height: 100%;
  width: 100%;
  object-fit: contain;
}

.show-images {
  background: #f1739d;
  position: relative;
  padding: 10px 10px;
  border-radius: 4px;
  color: #fff;
  top: -30px;
  left: 30px;
  font-size: 16px;
  width: 200px;
  box-shadow: 0px 2px 13px 0px rgba(0, 0, 0, 0.26);
  display: flex;
  direction: rtl;
  align-items: center;
  justify-content: space-around;
}

.sidebar-wrapp {
  padding: 20px 15px;
  background: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.14);
  margin-top: -50px;
}

.show-gallery {
  height: 400px;
  object-fit: cover;
  border-radius: 10px;
}

.about-shop {
  font-size: 30px;
  font-family: Cinema !important;
  padding-right: 60px;
  position: relative;
  margin-bottom: 0px;
  margin-top: 40px;
}
.about-shop::before {
  content: "";
  position: absolute;
  right: 0px !important;
  bottom: 12px;
  width: 35px;
  height: 10px;
  background: #f1739d;
}

.description-area p {
  text-align: justify;
  font-size: 14px;
  direction: rtl;
  line-height: 30px;
  color: #000000;
}

.product-area {
  padding: 20px 0px;
}
.product-area .slider-section {
  margin-top: 40px;
  background: #ccc;
}

.shop-mini-name {
  color: #f1739d;
  margin-right: 5px;
  font-family: Cinema !important;
  display: inline-block;
}

.category-item {
  display: flex;
  margin-top: 0px;
  align-items: center;
}
.category-item .icons-holder {
  height: 75px;
  width: 75px;
  padding: 20px;
  object-fit: contain;
  background-image: url(/assets/images/vectors/c.png);
  background-size: 60px;
  background-repeat: no-repeat;
  background-position: right;
  margin-left: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.category-item .icons-holder img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  position: relative;
  right: -5px;
}
.category-item .service-box h3 {
  font-size: 22px;
  font-family: Cinema !important;
}
.category-item .service-box p {
  font-size: 14px;
  line-height: 24px;
}

.shop-product-cart {
  margin-top: 20px;
}
.shop-product-cart .product-card {
  border-radius: 8px;
}

.not-active {
  filter: blur(3px);
}

.address-item {
  display: flex;
  margin-top: 0px;
  align-items: center;
}
.address-item i {
  color: #083d77;
  font-size: 26px;
  text-align: center;
}
.address-item .icons-holder {
  height: 75px;
  width: 75px;
  padding: 20px;
  object-fit: contain;
  background-image: url(/assets/images/vectors/c.png);
  background-size: 60px;
  background-repeat: no-repeat;
  background-position: right;
  margin-left: 12px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
.address-item .icons-holder img {
  height: 100%;
  width: 100%;
  object-fit: contain;
  position: relative;
  right: -5px;
}
.address-item .service-box h3 {
  font-size: 22px;
  font-family: Cinema !important;
}
.address-item .service-box p {
  font-size: 14px;
  line-height: 24px;
}

.wrapp-content-body .form-control {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #dee4eb;
  -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;
}
.wrapp-content-body .form-control::placeholder {
  font-size: 13px;
  font-weight: light;
}
.wrapp-content-body .comment-btn {
  background: #eee;
  color: #f1739d;
  font-size: 18px;
  padding: 8px 30px;
  width: max-content;
  border: none;
  border-radius: 8px;
  font-family: Cinema;
}
.wrapp-content-body .w-name-course-content {
  position: relative;
  direction: rtl;
  font-size: 18px;
  color: #000;
  padding: 5px;
  margin-bottom: 25px;
}

.wrapp-comments {
  border: 1px solid rgb(242, 242, 242);
  margin: 0px 10px;
  border-radius: 4px;
}
.wrapp-comments .wrapp-user-comments {
  border: 1px solid rgb(242, 242, 242);
  border-radius: 4px;
  border-bottom: none;
}
.wrapp-comments .wrapp-user-comments .comment-user {
  background: rgba(255, 228, 239, 0.65);
  box-shadow: none !important;
  border-radius: 4px;
  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: 4px;
}
.owner-comments .reply-name {
  background: rgb(255, 228, 239);
  box-shadow: none !important;
  border-right: 4px solid #f1739d;
  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: #f1739d;
  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;
}

.wrapp-comment-reply-btn a {
  background: #ffffff;
  box-shadow: none !important;
  border-radius: 6px;
  padding: 8px 10px;
  color: #000;
}

.share-page-link a {
  display: flex;
  text-align: center;
  background-color: #ccc;
  border-radius: 8px;
}
.share-page-link a h4 {
  font-size: 22px;
  font-family: Cinema;
  font-weight: 600;
  width: 100%;
  text-align: center;
  justify-content: center;
  display: flex;
  color: #000;
  align-items: center;
}
.share-page-link a .share-link {
  height: 60px;
  width: 60px;
  background-color: #ccc;
  display: flex;
  align-items: center;
  justify-content: center;
  border-left: 2px solid #fff;
}
.share-page-link a .share-link img {
  height: 30px;
  width: 30px;
}

.map-holder {
  border-radius: 8px;
}

.shop-details {
  display: flex;
  align-items: center;
  margin-bottom: 5px;
}
.shop-details i {
  color: #f1739d;
  font-size: 28px;
}
.shop-details h5 {
  font-weight: 600;
  font-size: 24px;
  font-family: Cinema;
  margin-right: 15px;
}

.shop-details-caption {
  border-top: 1px solid #ccc;
}
.shop-details-caption span {
  display: inline-block;
  padding-top: 12px;
  width: 100%;
  text-align: center;
}

.socials {
  display: flex;
  flex-wrap: wrap;
  padding-top: 12px;
  justify-content: center;
}
.socials .shop-social {
  background: #ccc;
  padding: 8px 16px;
  border-radius: 8px;
  margin: 5px;
}
.socials .shop-social i {
  color: #f1739d;
  font-size: 26px;
}

.wrapp-wp {
  background: url(../images/banners/wp.webp) !important;
  background-size: cover;
}
.wrapp-wp .special-chat-whatsapp {
  padding: 20px 15px;
}
.wrapp-wp .wp-color {
  background: rgba(198, 250, 225, 0.6784313725);
  background-size: cover;
  box-shadow: none;
  padding: 0px !important;
}
.wrapp-wp .wp-color .header-chat-box {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #ccf0df;
  padding-bottom: 12px;
}
.wrapp-wp .wp-color .header-chat-box h3 {
  font-size: 24px;
  font-family: Cinema;
}
.wrapp-wp .wp-color .header-chat-box img {
  height: 60px;
  width: 60px;
  margin-left: 15px;
}
.wrapp-wp .wp-color .each-sales-man {
  background: #f5fffa !important;
  display: flex;
  justify-content: space-between;
  border-radius: 8px;
  align-items: center;
  margin: 10px 0px;
  padding: 8px 10px;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.18);
}
.wrapp-wp .wp-color .each-sales-man .avatar {
  height: 55px;
  width: 55px;
}
.wrapp-wp .wp-color .each-sales-man h6 {
  text-align: right;
  width: 100%;
  margin-right: 15px;
}
.wrapp-wp .wp-color .avatar-info {
  display: flex;
  align-items: center;
}

.wrapp-tlg {
  background-image: url(../images/banners/tg.svg) !important;
  background-size: 330px;
}
.wrapp-tlg .special-chat-telegram {
  padding: 20px 15px;
}
.wrapp-tlg .tlg-color {
  background: rgba(198, 237, 250, 0.93);
  background-size: cover;
  box-shadow: none;
  padding: 0px !important;
}
.wrapp-tlg .tlg-color .header-chat-box {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #ccf0df;
  padding-bottom: 12px;
}
.wrapp-tlg .tlg-color .header-chat-box h3 {
  font-size: 24px;
  font-family: Cinema;
}
.wrapp-tlg .tlg-color .header-chat-box img {
  height: 60px;
  width: 60px;
  margin-left: 15px;
}
.wrapp-tlg .tlg-color .each-sales-man {
  background: #f5fffa !important;
  display: flex;
  justify-content: space-between;
  border-radius: 8px;
  align-items: center;
  margin: 10px 0px;
  padding: 8px 10px;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.18);
}
.wrapp-tlg .tlg-color .each-sales-man .avatar {
  height: 55px;
  width: 55px;
}
.wrapp-tlg .tlg-color .each-sales-man h6 {
  text-align: right;
  width: 100%;
  margin-right: 15px;
}
.wrapp-tlg .tlg-color .avatar-info {
  display: flex;
  align-items: center;
}

blockquote {
  margin: 10px 0px;
  background: #fff2f7;
  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, #fff2f7 0.64%, #f1739d 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: #3b0022;
}
.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: #3b0022;
}

.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: #278376;
  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: 600;
  font-size: 18px;
  color: #fff;
}

.nm-cc {
  color: #fff;
  font-size: 14px;
}

.count {
  margin-right: 12px;
  font-size: 14px;
  color: #e4316c;
  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: #f1739d;
  border-radius: 30px;
}

.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: #e4316c;
}

.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: #f1739d;
  margin-right: 10px;
  font-size: 20px;
}

.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: #e4316c;
  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;
}

.accordion .card:last-of-type {
  border-radius: 8px;
}

.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 #278376;
  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;
}

.accordion .card.qu-collapse:first-of-type {
  border-radius: 8px !important;
}

.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 #278376;
  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;
}

.accordion-collapse {
  background: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  margin-bottom: 25px;
}

.filter-hd {
  text-align: right;
  width: 100% !important;
  margin-top: 0px;
  border: none;
  background: #ffe4ef !important;
  border-radius: 4px !important;
  border: none !important;
}
.filter-hd span {
  font-size: 0.9rem;
  font-weight: 600;
}
.filter-hd:hover {
  outline: none;
}

.accordion-button::after {
  flex-shrink: 0;
  width: 10px;
  height: 10px;
  margin-right: auto;
  content: "";
  background-image: url(/assets/images/icons/chevron-down.png) !important;
  background-repeat: no-repeat;
  background-size: 0.8rem;
  transition: transform 0.2s ease-in-out;
  background: #fff;
  padding: 12px !important;
  background-size: 18px !important;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 50%;
}

.accordion-item {
  margin-bottom: 20px;
}

.accordion-body p {
  font-size: 14px;
  line-height: 28px;
}

.page-link {
  width: 40px;
  height: 42px;
  padding: 10px 20px;
  border-radius: 8px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #f1739d;
  color: #fff !important;
  margin: 5px 15px;
  -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;
}

.accordion-button:focus {
  box-shadow: none !important;
}

.accordion-item {
  border: none !important;
}

.header-all-c {
  height: 400px;
  background-position: bottom left;
  background-image: url(/assets/images/header/Web\ 1920\ ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã¢â‚¬Â ÃƒÂ¢Ã¢â€šÂ¬Ã¢â€žÂ¢ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã†â€™Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡Ãƒâ€šÃ‚Â¬ÃƒÆ’Ã¢â‚¬Â¦Ãƒâ€šÃ‚Â¡ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã…Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¬ÃƒÆ’Ã†â€™Ãƒâ€ Ã¢â‚¬â„¢ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã†â€™Ãƒâ€šÃ‚Â¢ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â‚¬Å¡Ã‚Â¬Ãƒâ€¦Ã‚Â¡ÃƒÆ’Ã¢â‚¬Å¡Ãƒâ€šÃ‚Â¬ÃƒÆ’Ã†â€™ÃƒÂ¢Ã¢â€šÂ¬Ã‚Â¦ÃƒÆ’Ã‚Â¢ÃƒÂ¢Ã¢â‚¬Å¡Ã‚Â¬Ãƒâ€¦Ã¢â‚¬Å“\ 1.webp);
  background-size: cover;
  position: relative;
  top: -82px;
}

.boat {
  height: 350px;
  object-fit: contain;
  margin-top: 100px;
  display: flex;
  justify-content: center;
}

.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: #fff;
}

.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: #ccc;
  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;
  height: 35px;
}

.top-jump-course {
  position: relative;
  top: -30px;
}

.pagination__item > a {
  width: 40px;
  height: 42px;
  padding: 10px 20px;
  border-radius: 8px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #f1739d;
  color: #fff !important;
  margin: 5px 15px;
  -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: #e4316c;
  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: #e4316c;
  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: 8px;
  text-align: center;
  display: flex;
  justify-content: center;
  font-size: 18px;
  align-items: center;
  background-color: #f1739d;
  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/banner/blog-banner.webp);
  background-position: center;
  background-size: cover;
  width: 100%;
  position: absolute;
  top: -32px;
}

.blog-bner-page {
  height: 300px;
  background-image: url(/assets/images/banner/blog.webp);
  background-position: center;
  background-size: cover;
  width: 100%;
  position: absolute;
  top: -32px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.blog-bner-page h1 {
  font-family: kalamehweb;
  font-size: 35px;
  font-weight: 600;
  background-color: #fff;
  width: max-content;
  padding: 5px 20px;
  border-radius: 6px;
}

.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;
}

.img-mc img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.blog-wrapper .blog-caption {
  margin-top: 0px;
}

.blog-master-row {
  direction: rtl;
  text-align: right;
  background: #ffedf4;
  padding: 20px 10px;
  border-radius: 10px;
  margin-top: 50px;
}

.img-mc {
  margin-bottom: 15px;
}

.name-bl {
  color: #000 !important;
  margin: 10px 0px;
  margin-top: 20px;
  margin-bottom: 30px;
  font-size: 1.5rem;
  font-weight: 600;
  cursor: pointer;
  text-align: right;
  position: relative;
}
.name-bl .heading-design {
  position: absolute;
  right: -20px;
  display: block;
  height: 45px;
  width: 6px;
  border-radius: 0px 4px 4px 0px;
  background: #f1739d;
}
.name-bl img {
  height: 45px;
  width: 45px;
  margin-left: 8px;
  padding: 2px;
}

.blog-bl {
  color: #000;
  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: #000;
  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 {
  color: #000;
  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: #e4316c;
  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;
  height: 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: #000;
  font-size: 14px;
}

.img-min img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.custom-control-label {
  color: #000;
}

.search-tag {
  color: #000;
  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 rgba(240, 115, 157, 0.18);
}

.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: 14px;
  color: #000;
  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: 4px;
}

.blog-body mark {
  background-color: rgba(204, 159, 255, 0.21) !important;
  border-radius: 8px;
}
.blog-body img {
  border-radius: 4px;
}

.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: #02322b;
  font-weight: 600;
}

.rw-names a {
  display: flex;
  align-items: center;
  color: #02322b;
  font-weight: 600;
}

.rw-names i {
  color: #023c3f;
  background: #eee;
  padding: 7px 13px;
  border-radius: 50%;
  font-size: 16px;
  font-weight: 600;
}

.rw-names strong {
  color: #000;
  font-size: 14px;
  margin-left: 15px;
}

.bg-gray {
  border-radius: 6px;
  padding: 10px 10px;
  background-color: #fff;
  color: #000;
  background: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.workshop-index .swiper-3d .swiper-slide-shadow-left {
  background-image: linear-gradient(to left, rgb(255, 237, 244), rgba(0, 0, 0, 0));
}

.workshop-index .swiper-3d .swiper-slide-shadow-right {
  background-image: linear-gradient(to left, rgb(255, 237, 244), rgba(0, 0, 0, 0));
}

.swiper.swiper-2 .swiper-slide::before {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 0px;
  height: 0px;
  border-bottom: 0px dashed rgba(228, 172, 195, 0);
  border-right: 0px dashed rgba(228, 172, 195, 0);
  border-radius: 0 0 7px 0;
  content: "";
  transition: all 0.3s ease;
}

.swiper.swiper-2 .swiper-slide::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 0px;
  height: 0px;
  border-top: 0px solid rgba(228, 172, 195, 0);
  border-left: 0px solid rgba(228, 172, 195, 0);
  border-radius: 7px 0 0 0;
  content: "";
  transition: all 0.3s ease;
}

.workshop-swiper .swiper-slide.swiper-slide-active::before {
  position: absolute;
  bottom: -5px;
  right: 0;
  width: 30px;
  height: 30px;
  border-bottom: 2px solid #e4acc3;
  border-right: 2px solid #e8b0c6;
  border-radius: 0 0 4px 0;
  content: "";
  transition: all 0.3s ease;
}

.workshop-swiper .swiper-slide.swiper-slide-active::after {
  position: absolute;
  top: 0;
  left: 20px;
  width: 30px;
  height: 30px;
  border-top: 2px solid #e2abc1;
  border-left: 2px solid #e7afc6;
  border-radius: 4px 0 0 0;
  content: "";
  transition: all 0.3s ease;
}

.window-design {
  background-image: url(../images/vectors/main-window.png);
  height: 400px;
  width: 350px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.workshop-slider-wrapp {
  padding: 0 30px;
}
.workshop-slider-wrapp .workshop-label-active h4,
.workshop-slider-wrapp .workshop-label-deactive h4 {
  padding-right: 45px;
}

.swiper-2 .swiper-slide {
  height: 29rem;
}

.swiper-2 {
  padding: 0px 130px;
}

.design-wrapp {
  display: flex;
  align-items: center;
  position: relative;
}

.bg-gray div.rw-names {
  border-bottom: 1px solid rgba(228, 49, 108, 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 #f1739d;
  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: 16px;
  font-family: kalamehweb;
  font-weight: 600;
  color: #000;
}

.medium-margin {
  margin-top: 70px;
}

.cb-img {
  height: 40px;
  width: 40px;
  object-fit: cover;
}

.cb-img img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.black-cat h2 {
  display: flex;
}

.mini-cat {
  padding: 5px;
}

.black-cat {
  background-color: #fff;
  border-radius: 4px;
  background: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.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: #fff;
  margin-top: 20px;
  height: 80px;
  display: flex;
  align-items: center;
  background: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.next-arrticle a {
  color: #000;
  font-size: 14px;
  padding: 0px 11px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.next-arrticle i {
  color: #023c3f;
  background: #eee;
  padding: 7px 13px;
  border-radius: 50%;
  font-size: 16px;
  font-weight: 600;
}

.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: center;
  width: 100%;
}

.modal-content {
  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;
  width: max-content;
  pointer-events: auto;
  background-color: #02322b;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 0.3rem;
  outline: 0;
  padding: 20px;
  width: 100%;
}

.modal-header {
  flex-shrink: 0;
  align-items: center;
  padding: var(--bs-modal-header-padding);
  border-bottom: var(--bs-modal-header-border-width) solid #02322b;
  border-top-left-radius: var(--bs-modal-inner-border-radius);
  border-top-right-radius: var(--bs-modal-inner-border-radius);
}

.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: #e4316c !important;
}

.filter-button:hover {
  opacity: 1 !important;
}

.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;
}

.accordion .each-according {
  border-bottom: 1px solid #000 !important;
  margin-bottom: 20px;
}

.accordion .each-according:last-child {
  border-bottom: none !important;
}

.custom-checkbox .custom-control-input:checked ~ .custom-control-label:before {
  background-color: #e4316c !important;
  border: 2px solid #e4316c !important;
}

.sidebar {
  color: #fff;
  background: #2b2b2d;
  width: 250px;
  max-width: 250px;
  height: 100%;
  float: right;
  display: block;
  -webkit-transition: margin 2s;
  transition: margin 2s;
  flex: 1;
  position: absolute;
  right: 0;
  top: 70px;
}

#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: #e4316c;
  /*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: #e4316c;
}

.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: #e4316c;
}

.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: #e4316c;
  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;
  color: #000;
  background-image: url(../images/vectors/pink-flower.webp);
  background-position: top left;
  background-size: 60px;
  background-repeat: no-repeat;
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  padding: 10px 15px;
  height: 150px;
  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 #f4d0dc;
  transition: allease-in-out 0.3s;
}

.course-details {
  height: 140px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.c-icon {
  height: 110px;
  width: 110px;
  border-radius: 6px;
  object-fit: cover;
}
.c-icon img {
  height: 100%;
  width: 100%;
  border-radius: 6px;
  object-fit: contain;
}

.c-icon .c-name {
  text-align: right;
  padding: 0px 20px;
  min-width: 550px;
}

.nc-black {
  color: #000;
  margin-bottom: 10px;
  font-size: 20px;
  font-family: kalamehweb;
  font-weight: 500;
}

.teacher-n {
  color: #000;
}

.tc-n {
  color: #f1739d;
}

.p-bord {
  font-weight: 600;
  color: #f1739d;
  margin-left: 4px;
  font-size: 18px;
}

.price-unite {
  color: #000;
  font-weight: 600;
  font-size: 14px;
}

.remove-course {
  width: 35px;
  height: 35px;
  padding: 2px;
  background-color: #f1739d;
  border: none;
  text-align: center;
  margin-right: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  cursor: pointer;
}
.remove-course i {
  color: #fff;
  font-size: 20px;
  margin-top: 4px;
}

.offer-code {
  padding-right: 15px;
  height: 70px;
  margin-bottom: 15px;
}

.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 5px;
  border-radius: 6px;
}

.offer-input {
  height: 50px;
  border: 1px solid #f1739d;
  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: #f1739d;
  font-weight: 600;
}

.offer-input::placeholder {
  font-size: 12px;
}

.offer-btn {
  margin-top: 0px;
  background-color: #f1739d;
  display: flex;
  color: #fff;
  font-weight: 600;
  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: #f1739d;
  font-size: 14px;
  font-weight: 600;
}

.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%;
  color: #000;
  background: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  display: flex;
  padding: 10px 15px;
  border-radius: 6px;
}

.gt-m {
  direction: rtl;
  width: 100%;
  background: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  display: flex;
  padding: 30px 15px;
  border-radius: 6px;
  margin-top: 10px;
  flex-direction: column;
}

.capt-title {
  color: #000;
  font-weight: 600;
  font-size: 16px;
}

.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: #000;
  font-weight: 600;
  font-size: 16px;
}

.cart-margin {
  margin-top: 0px;
  margin-bottom: 150px;
}

.the-last-r {
  border-top: 1px solid #f1739d;
  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;
  font-size: 18px;
  width: 100%;
  text-align: center;
  margin-top: 20px;
  color: #fff !important;
  background-size: 300% 100%;
  background-image: linear-gradient(to right, #f1739d, #f1739d, #ffffff);
  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;
  font-weight: 600;
}

.pay-btn:hover {
  color: #000;
  font-weight: normal;
  background-size: 300% 100%;
  background-image: linear-gradient(to right, #e0366f, #f1739d, #ffffff);
  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;
  justify-content: flex-end;
}

.des-title {
  margin-bottom: 0px;
  color: #000;
  font-weight: 600;
  width: 65px;
  display: flex;
  font-size: 18px;
  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, #ffd2e0, #ffe7ef);
  justify-content: flex-end;
  color: #000;
}

.panel-qu:last-child {
  border: none !important;
}

.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: 10px 0px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid #dfdfdf;
  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;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: 5px;
}

.payment-name {
  font-weight: 600;
}

.plans .plan .plan-content img {
  margin-left: 0px;
  height: 50px;
  margin: 6px;
}

.plans .plan .plan-details span {
  margin-bottom: 10px;
  display: block;
  font-size: 18px;
  font-weight: 600;
  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: 20px;
}

.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 {
  background: #f4b79a;
  -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%, #ffbbd2 98.23%);
  box-shadow: 0px 3px 5px 0px #f4f4f4;
}

.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;
  margin-bottom: 0px;
}

.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;
}

.static-width {
  width: 40%;
  display: flex;
}

.search-static-width {
  justify-content: end;
}

@-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-margin {
  margin-bottom: 200px;
}

.error-boxes {
  height: 500px;
  border: 1px solid #faf4ff;
  border-radius: 10px;
  background-color: #fff;
  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: 600;
  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: cinema;
  font-size: 180px;
}

.error-boxes section {
  display: flex;
  justify-content: center;
}

.content {
  position: relative;
  height: 250px;
  display: flex;
}

.content h2 {
  color: #fff;
  font-size: 180px;
  font-family: cinema;
  position: absolute;
  transform: translate(-50%, 0%);
}

.text-err {
  direction: rtl;
  text-align: center;
  color: #000;
}

.back-to-home {
  color: #fff;
  padding: 10px 45px;
  margin-top: 25px;
  background: #f1739d;
  font-size: 18px;
  border-radius: 8px;
  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;
  font-weight: 600;
}

.content h2:nth-child(1) {
  color: #fabed5;
  -webkit-text-stroke: 2px #ff6397;
}

.content h2:nth-child(2) {
  color: #e85082;
  animation: animate 4s ease-in-out infinite;
}

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;
}

.checkmark {
  width: 65px;
  height: 65px;
  border-radius: 50%;
  display: block;
  stroke-width: 2;
  stroke: #e4316c;
  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: 5px;
  right: 5px;
  margin: 0 auto;
}

.succes-title {
  text-align: center;
  color: #fff;
  direction: rtl;
  font-size: 20px;
}

.checkmark__circle {
  stroke-dasharray: 166;
  stroke-dashoffset: 166;
  stroke-width: 2;
  stroke-miterlimit: 10;
  stroke: #f1739d;
  fill: #fdf5fa;
  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 {
  background-color: #e4316c;
  background-image: url(../images/vectors/flower-bar.webp);
  background-size: 700px;
  background-position: bottom;
  background-repeat: repeat-x;
  margin-top: 120px;
  padding: 50px 20px;
  padding-top: 0px;
  z-index: 1;
  border-radius: 10px;
  margin-bottom: 100px;
}

.workshop-detail {
  background-color: #ffe1e9;
  background-image: url(../images/vectors/slider-wave.png);
  background-size: 500px;
  background-position: bottom;
  background-repeat: no-repeat;
  margin-top: 120px;
  padding: 50px 20px;
  padding-top: 0px;
  z-index: 1;
  border-radius: 10px;
  margin-bottom: 100px;
}
.workshop-detail .box-de {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.workshop-detail .succes-title {
  text-align: center;
  color: #000;
  direction: rtl;
  font-size: 20px;
}
.workshop-detail ul {
  list-style: none;
}
.workshop-detail ul li {
  list-style: none;
}
.workshop-detail .box-de {
  color: #000;
  font-weight: 600;
  font-size: 16px;
  border-bottom: 1px solid rgba(241, 115, 157, 0.1215686275);
  padding-bottom: 10px;
}
.workshop-detail span {
  color: #004037;
  font-weight: 600;
  font-size: 18px;
}
.workshop-detail .st-title {
  color: #000;
  font-weight: 600;
  margin-bottom: 4px;
  font-size: 20px;
}
.workshop-detail .ca-title {
  margin-right: 10px;
  margin-left: 5px;
  font-size: 18px;
  color: #004037;
  font-weight: 600;
}
.workshop-detail a {
  border-radius: 8px;
  font-size: 18px;
  height: 50px;
  color: #fff !important;
  width: 320px;
  margin-top: 20px;
  border: none;
  background-size: 300% 100%;
  background: linear-gradient(to left, #e4316c, #f56295, #e4316c);
  display: flex;
  align-items: center;
  font-weight: 600;
  justify-content: space-between;
  cursor: pointer;
  flex-direction: row-reverse;
}
.workshop-detail a::hover {
  background: linear-gradient(to left, #ff7da8, #f56295, #9c1340);
  transition: all linear 0.5s;
}

.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, #e4316c, #f1a2ff, #f05a28) !important;
}

.box-de {
  margin-top: 20px;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.workshop-padding {
  padding: 20px 100px;
  display: flex;
  justify-content: center;
}

.pages-header {
  position: relative;
}

.wrapp-patern-1 {
  height: 400px;
  width: 450px;
  position: absolute;
  top: 60px;
  right: 100px;
  padding: 10px;
}

.wrapp-patern {
  height: 400px;
  width: 100%;
  object-fit: cover;
  background-image: url(../../assets/images/vectors/pattern-1.webp);
  background-size: cover;
  padding: 10px;
}

.back-header {
  position: absolute;
  top: -45px;
  height: 200px;
  background-image: url(/assets/images/banner/banner-site.webp);
  background-size: cover;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}

.default-header {
  position: relative !important;
  top: unset !important;
  height: 200px;
  background-image: url(/assets/images/banner/banner-site.webp);
  background-size: cover;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  margin-bottom: 30px;
}

.bg-head {
  background-image: url(/assets/images/banner/bg.webp);
  background-position: bottom;
  background-size: cover;
}

.wild-coder-t {
  margin-top: 80px;
}

.st-title {
  font-size: 17px;
  color: white;
}

.ca-title {
  margin-right: 10px;
  font-size: 20px;
  color: #ffffff;
}

.checking {
  height: 80px;
  width: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  border: 2px solid #28da87;
  border-radius: 50%;
}

.go-panel i {
  margin-right: 8px;
}

.back-tp {
  border-radius: 8px;
  font-size: 16px;
  height: 50px;
  color: #000000 !important;
  background: #278376;
  width: 260px;
  margin-top: 20px;
  border: none;
  background-size: 300% 100%;
  background-image: linear-gradient(to right, #fbfaff, #f8e2f0, #f1739d);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.whatsapp-btn {
  border-radius: 8px;
  font-size: 16px;
  height: 70px;
  color: #000000 !important;
  background: #278376;
  width: 280px;
  margin-top: 20px;
  border: none;
  background-size: 300% 100%;
  background-image: linear-gradient(to right, #cdffe4, #7af4b1, #024138);
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row-reverse;
  cursor: pointer;
}
.whatsapp-btn img {
  padding: 3px;
  background: #c9ffe2;
  border-radius: 6px;
  height: 50px;
}
.whatsapp-btn h5 {
  margin-bottom: 0px;
  font-size: 16px;
}

.back-tp:hover {
  color: #000;
  transition: all 0.3s ease;
}

.free-black {
  color: #000;
  font-family: kalamehweb;
  margin-right: 20px;
  font-size: 20px;
}

@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) {
  .whatsapp-btn {
    border-radius: 8px;
    font-size: 14px;
    height: 60px;
    color: #000000 !important;
    width: 260px;
    margin-top: 20px;
  }
  .whatsapp-btn img {
    padding: 2px;
    background: #c9ffe2;
    border-radius: 6px;
    height: 40px;
  }
  .whatsapp-btn h5 {
    margin-bottom: 0px;
    font-size: 14px;
  }
  .workshop-detail {
    background-color: #ffe1e9;
    background-image: url(../images/vectors/slider-wave.png);
    background-size: 500px;
    background-position: bottom;
    background-repeat: no-repeat;
    margin-top: 120px;
    padding: 50px 20px;
    padding-top: 0px;
    z-index: 1;
    border-radius: 10px;
    margin-bottom: 100px;
  }
  .workshop-detail .box-de {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .workshop-detail .succes-title {
    text-align: center;
    color: #000;
    direction: rtl;
    font-size: 20px;
  }
  .workshop-detail ul {
    list-style: none;
  }
  .workshop-detail ul li {
    list-style: none;
  }
  .workshop-detail .box-de {
    font-size: 16px;
    padding-bottom: 10px;
  }
  .workshop-detail span {
    font-size: 14px;
  }
  .workshop-detail .st-title {
    margin-bottom: 4px;
    font-size: 16px;
  }
  .workshop-detail .ca-title {
    margin-right: 5px;
    margin-left: 2px;
    font-size: 14px;
  }
  .workshop-detail a {
    border-radius: 8px;
    font-size: 14px;
    height: 50px;
    color: #fff !important;
    width: 250px;
    margin-top: 20px;
  }
  .label {
    position: absolute;
    right: 4px;
    top: 18px;
    transform: translateY(-50%);
    color: rgb(34, 34, 34);
  }
  .timer-title {
    color: #000;
    font-size: 0.5rem;
    margin-top: 3px;
    font-weight: 600;
  }
  .blog-wrapper .blog-banner .category-label {
    top: -26px;
    right: -13px;
    font-size: 14px;
    padding: 2px 10px;
    border-radius: 4px 0px 0px 4px;
    background: linear-gradient(304deg, #e4316c 0.64%, #f1739d 98.23%);
    color: #fff;
  }
  .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;
  }
  .flex-wrap {
    display: flex;
    justify-content: center;
  }
  .social-contact-holder {
    height: 60px;
    width: 60px;
    margin: 5px;
  }
  .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: 34px;
    height: 34px;
    padding: 10px 15px;
    font-size: 20px;
  }
  .pagination__item {
    margin: 5px 5px;
    padding: 10px !important;
    width: 25px;
  }
  .btn-fb {
    width: 32px;
    height: 32px;
    padding: 5px 10px;
    font-size: 24px;
    padding-top: 8px;
  }
  .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: #000;
    margin-bottom: 10px;
    text-align: right;
    font-size: 16px;
  }
  .name-bl .heading-design {
    position: absolute;
    right: -10px;
    display: block;
    height: 45px;
    width: 6px;
    border-radius: 5px;
    background: #f1739d;
  }
  .container.nw-dr.medium-margin {
    padding: 0px 15px;
  }
  .blog-banner {
    height: 200px;
    width: 100%;
    object-fit: cover;
    border-radius: 10px;
    margin-bottom: 20px;
  }
  .blog-wroter {
    display: flex;
    height: 52px;
    background: rgba(255, 255, 255, 0.8392156863);
    align-items: center;
    justify-content: flex-start;
    padding-right: 15px;
    margin: 10px 0px;
  }
  .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;
  }
  .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: 120px;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    transition: all ease-in-out 0.3s;
    margin-bottom: 15px;
  }
  .c-icon {
    width: 150px;
    height: 100px;
    object-fit: cover;
    border-radius: 50%;
  }
  .back-header {
    position: absolute;
    top: -42px;
    height: 82px;
    background-size: cover;
  }
  .about-header {
    height: 220px;
  }
  .space-top {
    margin-top: 120px;
  }
  .abou-section {
    padding: 40px 0;
  }
  .abou-section h3 {
    font-size: 30px;
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .abou-section p {
    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: 70%;
    padding: 15px;
  }
  .about-us-sections-img img {
    height: 100%;
    width: 100%;
  }
  .ss-back {
    margin-top: 60px;
    padding: 50px 20px;
    border-radius: 0;
  }
  .checkmark {
    width: 65px;
    height: 65px;
    border-radius: 50%;
    display: block;
    stroke-width: 2;
    stroke: #e4316c;
    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: 14px;
    color: white;
  }
  .ca-title {
    margin-right: 10px;
    font-size: 14px;
    color: #fff;
  }
  .succes-title {
    text-align: center;
    color: #fff;
    direction: rtl;
    font-size: 14px;
  }
  .back-tp {
    border-radius: 8px;
    font-size: 11px;
    height: 40px;
    width: 185px;
    margin-top: 20px;
    border: none;
    background-size: 300% 100%;
    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;
    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;
  }
  .default-breadcrumb {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap !important;
    list-style: none;
    margin-top: 1rem;
    margin-bottom: 1rem;
    font-size: 1.3rem;
    padding-right: 0;
    overflow-y: auto !important;
  }
  .default-breadcrumb::-webkit-scrollbar {
    width: 1px !important;
  }
  .default-breadcrumb::-webkit-scrollbar-thumb {
    background: #e9afc4;
    border-radius: 2px;
  }
  *[dir=rtl] .default-breadcrumb li.crumb {
    width: max-content !important;
  }
  .workshop-container .workshop-cart .workshop-label-active h4 {
    top: -180px;
  }
  .workshop-container .about-mall-caption {
    margin-bottom: 0px;
    z-index: 0;
  }
}
@media only screen and (max-width: 480px) {
  .default-breadcrumb {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap !important;
    list-style: none;
    margin-top: 1rem;
    margin-bottom: 1rem;
    font-size: 1.3rem;
    padding-right: 0;
    overflow-y: auto !important;
  }
  .default-breadcrumb::-webkit-scrollbar {
    width: 0 !important;
    display: none !important;
  }
  *[dir=rtl] .default-breadcrumb li.crumb {
    width: max-content !important;
  }
}
/* media query*/
li {
  display: list-item;
  text-align: -webkit-match-parent;
}

ul {
  padding: 20px;
  list-style-type: unset;
}

.theme-design {
  position: relative;
  height: 0px;
  width: 255px;
  object-fit: cover;
}

.theme-design img {
  position: absolute;
  height: 200px;
  width: 195px;
  top: 330px;
  left: 52px;
}

@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: 140px) {
  .wrapp-patern-1 {
    height: 400px;
    width: 365px;
    position: absolute;
    top: 60px;
    right: 100px;
    padding: 10px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1560px) {
  .cooki-dance .growing {
    top: -45px;
    justify-content: center;
    right: unset;
  }
  .about-shape-img {
    height: 450px;
    width: 358px;
    background-image: url(/assets/images/vectors/hero-bg-vec.webp);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right;
  }
  .our-support {
    margin-top: 40px;
    background-image: url(../images/vectors/support-bg.webp);
    background-size: contain;
    width: 385px;
    height: 335px;
    background-repeat: no-repeat;
  }
  .video-cover {
    height: 80% !important;
    width: 75% !important;
    object-fit: cover;
    background-image: url(../../assets/images/banner/bg.webp);
    border-radius: 6px;
    position: relative;
    background-size: cover;
    margin-top: 20px;
  }
}
@media only screen and (min-width: 1201px) and (max-width: 1480px) {
  .navbar-padding {
    padding: 0px 0px;
    height: 82px;
  }
  .header .item-center {
    flex: 0 0 60%;
  }
}
/* ipod */
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  nav .navbar .links li .arrow {
    height: 22px;
    width: 25px;
    line-height: 70px;
    text-align: center;
    display: inline-block;
    color: #fff;
    transition: all 0.3s ease;
    position: absolute;
    left: 0;
    top: 0px;
  }
  .wrapp-first-img,
  .wrapp-second-img,
  .wrapp-third-img {
    width: 80px;
    height: 280px !important;
    object-fit: cover;
    position: relative;
    border-radius: 2px;
  }
  .hero-texts {
    position: relative;
    top: -65px;
  }
  .about-shape-img {
    height: 360px;
    width: 315px;
  }
  .hero-caption p {
    position: absolute;
    top: 270px;
    padding-left: 80px;
    right: 0;
    font-size: 23px;
    line-height: 45px;
  }
  .cooki-dance .growing {
    top: -15px;
    right: -17px;
    justify-content: center;
  }
  .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;
    padding-left: 22px;
  }
  .art img {
    position: absolute;
    height: 135px;
    top: -15px;
    left: 30px;
  }
  .blog-cart-wrapp-big {
    margin-bottom: 35px;
    text-align: right;
    padding: 20px 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);
  }
  .btn-link {
    background: rgba(242, 128, 166, 0.16);
    padding: 0px 7px;
    padding-left: 9px;
    border-radius: 4px;
    color: #1e1e1e;
    margin-top: 10px;
    align-items: center;
    text-decoration: none;
    font-size: 12px;
    font-weight: 600;
    padding-top: 0px;
  }
  .our-support {
    background-size: contain;
    width: 226px;
    height: 320px;
    background-repeat: no-repeat;
    padding-top: 100px;
  }
  .birthday-cake img {
    height: 200px;
    bottom: -25px;
    position: absolute;
  }
  .wrapp-patern-1 {
    height: 400px;
    width: 320px;
    position: absolute;
    top: 60px;
    right: 100px;
    padding: 10px;
  }
  .mina-cake-logo {
    height: 265px;
    width: 215px;
    object-fit: cover;
    position: relative;
    top: 120px;
    border-radius: 10px;
    left: -12px;
  }
  .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 {
    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 {
    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;
    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: 20px 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 51% !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;
  }
  .hero-texts {
    position: relative;
    top: 100px;
  }
  .playing-btn {
    position: absolute;
    top: 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;
  }
  .nc-black {
    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) {
  .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;
  }
  .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: max-content;
    margin-bottom: 15px;
  }
  .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;
}

form div {
  position: relative;
}

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;
}

button {
  display: inline-block;
  background: rgb(59, 31, 158);
  border: 1px solid #f1739d;
  padding: 11px 39px;
  border-radius: 24px;
  font-size: 15px;
  margin-top: 5px;
  font-family: iranyekan, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  cursor: pointer;
  width: 100%;
  transition: all 0.1s ease 0s;
}

button:hover {
  opacity: 0.8;
}

@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: 22px;
  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 {
  margin-bottom: 15px;
}
.warrning-alert ul {
  padding-right: 0;
}
.warrning-alert ul li {
  padding: 10px;
  border-radius: 10px;
  margin-bottom: 15px;
  background-color: rgba(255, 0, 0, 0.168627451);
  display: flex;
  align-items: center;
}

.error-field {
  padding-right: 15px;
  display: block;
  margin-top: 8px;
  color: #b1003c;
  font-weight: 500;
}

.paragraph-txt {
  color: #000;
  font-size: 17px;
  margin-bottom: 30px;
  padding-right: 0px;
  font-weight: 500;
}

.all-courses-view {
  padding: 0px 6px;
  color: #e4316c;
  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(228, 49, 108, 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;
}

.blog-title {
  background: rgb(125, 75, 255);
}

.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: 250px;
  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: 1440px) and (max-width: 1800px) {
  .workshop-swiper .swiper-slide.swiper-slide-active::after {
    position: absolute;
    top: 0;
    left: -24px;
    width: 30px;
    height: 30px;
    border-top: 2px solid #e2abc1;
    border-left: 2px solid #e7afc6;
    border-radius: 4px 0 0 0;
    content: "";
    transition: all 0.3s ease;
  }
}
@media only screen and (min-width: 1701px) and (max-width: 1780px) {
  .hero-texts h2 {
    font-size: 48px;
  }
  .cooki-dance .growing {
    position: relative;
    top: -15px;
    justify-content: center;
    right: -32px;
  }
}
@media only screen and (min-width: 1620px) and (max-width: 1698px) {
  .coach-vector {
    height: 650px;
    object-fit: contain;
    top: 86px;
    position: relative;
    margin-right: 85px;
  }
  .hero-texts h2 {
    font-size: 48px;
  }
  .cooki-dance {
    direction: rtl;
    padding-right: 180px;
  }
}
@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) {
  .about-container .col-lg-4 {
    order: 2 !important;
  }
  .art img {
    position: absolute;
    height: 90px;
    top: -40px;
    left: 55px;
  }
  .about-caption-section {
    order: 1 !important;
  }
  .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: 600;
    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;
  }
  .content h2 {
    color: #fff;
    font-size: 140px;
    font-family: cursive;
    position: absolute;
    text-align: center;
    transform: unset;
  }
  .content {
    display: flex;
    justify-content: center;
  }
  .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;
  }
  .course-page-header {
    background-repeat: repeat-y !important;
  }
  .logo {
    height: auto !important;
    width: 228px !important;
    object-fit: cover;
    padding: 0px;
    position: relative;
  }
  nav .navbar .links li {
    align-items: center;
    justify-content: space-between;
    list-style: none;
    padding: 0 5px;
    flex-direction: row-reverse;
  }
  .static-width {
    width: 38%;
    display: flex;
  }
  .certificated-parent {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  .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;
  }
}
@media (max-width: 991px) {
  .course-cart-wrapp {
    display: flex;
    width: 100%;
  }
  .wrapp-course-details {
    width: 100%;
  }
  .package-bg .flex-details {
    background-color: #fff;
    padding: 2px 5px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    height: 28px;
  }
  .only-mobile-show {
    display: flex;
  }
  .help-box {
    padding: 20px 15px;
    background-color: rgb(255, 239, 245);
    border-radius: 4px;
    border: 1px solid #f2f2f2;
    box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
    margin-bottom: 20px;
    display: flex;
    height: 120px;
    background-image: url(../images/icons/help.png);
    background-position: bottom left;
    background-size: 50px;
    background-repeat: no-repeat;
    position: relative;
  }
  .help-box h4 {
    color: #000;
    font-size: 22px;
    display: flex;
    align-items: center;
  }
  .help-box h4 img.lights {
    height: 45px;
  }
  .help-box h4 img.arrows {
    height: 25px;
    border-radius: 50%;
    background: #fff;
    padding: 2px;
    margin-right: 10px;
  }
  .help-box p {
    font-size: 14px;
    line-height: 25px;
    font-weight: 500;
    padding: 5px 8px;
  }
  .submitimng-ico {
    height: 50px;
    margin-left: 0px;
  }
  .submitimng-ico i {
    font-size: 18px !important;
  }
  .help-link-mobile {
    display: flex;
    flex-direction: row-reverse;
    direction: rtl;
    background: #ffffff;
    align-items: center;
    border-radius: 4px;
    color: #e4316c;
    font-size: 12px;
    width: 120px;
    font-weight: 500;
    padding: 0px;
    font-size: 13px;
    height: 0;
    position: relative;
    justify-content: center;
    top: 17px;
  }
  .help-link-mobile span {
    display: flex;
    align-items: center;
    width: 100%;
    border-radius: 4px;
    justify-content: space-evenly;
    font-size: 12px;
  }
  .help-link-mobile span i {
    font-size: 15px !important;
    color: #f1739d;
    top: -1px !important;
    margin-right: 10px;
    margin-left: 2px;
  }
  .signup-image {
    margin-top: -25px;
  }
  .mobile-handle .mobile-btn {
    display: flex;
    flex-direction: column;
  }
  .mobile-handle .mobile-btn span {
    margin-bottom: 10px;
    font-size: 17px;
  }
  .pamphlet {
    background-color: rgba(39, 131, 118, 0.1882352941);
    border-radius: 4px;
    border: 1px solid rgba(39, 131, 118, 0.1411764706);
    box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
    direction: rtl;
    display: flex;
    align-items: center;
    padding: 20px 15px;
    padding-left: 20px;
    margin-top: -19px;
    background-image: url(../images/vectors/login-flower.webp);
    background-size: 250px;
    background-position: left bottom;
  }
  .pamphlet h4 {
    -weight: 600;
    font-size: 18px;
  }
  .pamphlet a {
    width: 120px;
    height: 40px;
    font-size: 14px;
  }
  .pamphlet a i {
    font-size: 14px;
  }
  .topper-back-img .hello-bar {
    height: 55px;
    width: 100%;
    object-fit: cover;
  }
  .advertising-campaign a {
    margin-top: 35px;
    height: 350px;
    border-radius: 8px;
    display: block;
    position: relative;
    cursor: pointer;
    object-fit: cover;
    padding: 0px 3px;
  }
  .advertising-campaign {
    margin-bottom: 10px;
  }
  .pagination {
    margin-bottom: 30px;
  }
  .course-design .support-flower img {
    height: 65px;
  }
  .course-design .support-flower {
    position: absolute;
    object-fit: contain;
    height: 200px;
    right: 0px;
    top: 5px;
  }
  .course-active-time {
    display: flex;
    padding-right: 0px;
    align-items: flex-start;
    margin-bottom: 0px;
    margin-top: 10px;
  }
  .course-active-time strong {
    font-size: 15px !important;
  }
  .course-active-time i {
    font-size: 22px;
    color: #f1739d;
    margin-top: 5px;
  }
  .wrapp-comments .wrapp-user-comments .comment-body p {
    font-size: 14px;
  }
  .faq-button {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
  }
  .wrapp-course-captions p {
    text-align: justify;
    font-size: 14px;
    line-height: 28px;
  }
  .wrapp-course-sections p {
    text-align: right !important;
    font-size: 13px;
    line-height: 26px;
  }
  .faq-button strong {
    font-size: 14px;
    margin-top: 5px;
    padding-right: 10px;
    color: #000;
  }
  .accordion-body p {
    font-size: 14px;
    line-height: 28px;
    text-align: justify;
  }
  .courses-items span {
    width: 35px;
  }
  .courses-items .course-item {
    padding: 5px;
  }
  .courses-items .course-item p {
    font-size: 13px;
  }
  .w-name-course-content {
    margin-bottom: 15px;
  }
  .high-season {
    display: flex;
    padding: 10px 2px;
    margin: 4px 4px;
    color: #000;
    border-radius: 6px;
    height: 50px;
  }
  .course-road-mad {
    flex-wrap: wrap;
    padding: 20px 15px;
    background: rgb(255, 255, 255);
    margin-bottom: 20px;
  }
  .course-road-mad span {
    font-size: 12px;
  }
  .wrapp-holder-btn {
    display: none;
  }
  .options-wrapp :last-child {
    border-bottom: none;
  }
  .top-hack {
    position: relative;
    top: 0px;
  }
  .workshop-learn-list h3 {
    font-size: 15px !important;
    font-family: KalamehWeb;
    font-weight: 600;
    text-align: center;
    margin: 5px 0;
  }
  .workshop-learn-list .icons-holder {
    height: 30px !important;
    padding: 2px;
    width: 30px !important;
  }
  .items-intro-title {
    font-size: 17px;
    margin-top: 32px;
    background: #278376;
    padding: 5px 10px;
    top: -50px;
    right: 30px;
  }
  .wrapp-line .col-lg-3 {
    position: relative;
  }
  .wrapp-line .flower-box {
    height: 255px;
    width: 100%;
    object-fit: contain;
    position: absolute;
    top: -112px;
  }
  .average-data {
    background-size: 40px;
    padding: 20px 20px;
    margin-top: 4px;
    border-radius: 8px;
  }
  .average-data .class-status-header h3 {
    padding-bottom: 10px;
    font-size: 14px;
  }
  .average-data .class-status-header h3 .date-work {
    font-weight: 600;
    margin-right: 4px;
    font-size: 20px;
  }
  .average-data .class-status-header h3 .month-work {
    font-size: 16px;
    margin-left: 2px;
    margin-right: 2px;
  }
  .average-data .class-status {
    margin-bottom: 5px;
  }
  .average-data .class-status i {
    font-size: 10px;
    margin-left: 4px;
  }
  .average-data .class-status strong {
    font-size: 14px;
  }
  .average-data .class-status span {
    font-size: 14px;
    margin-right: 5px;
  }
  .progress p {
    margin-bottom: 12px;
    direction: rtl;
    font-size: 14px;
    color: #000000;
    font-weight: 600;
    line-height: 18px;
  }
  .progress p i {
    font-size: 10px;
    margin-left: 4px;
  }
  .submit-workshop {
    padding: 15px 5px;
    background-size: 30px;
    height: 70px;
  }
  .submit-workshop img {
    height: 30px;
  }
  .submit-workshop p {
    font-size: 14px;
  }
  .submit-workshop p .date-work {
    margin-right: 4px;
    font-size: 20px;
  }
  .submit-workshop p .month-work {
    font-size: 16px;
    margin-left: 2px;
  }
  .submit-workshop i {
    font-size: 18px;
  }
  .submit-workshop img {
    height: 30px;
  }
  .submit-btns {
    margin-top: 25px;
  }
  .box-big-design,
  .box-mini-design {
    position: relative;
    width: 85px;
  }
  .box-mini-design img {
    position: absolute;
    top: -45px;
    left: -25px;
  }
  .box-big-design img {
    position: absolute;
    top: 2px;
    right: -18px;
  }
  .box-submit-class {
    width: 100%;
    border-radius: 8px;
    position: relative;
    top: 20px;
    right: 0;
    height: auto;
  }
  .workshop-detail-box {
    padding: 10px 10px;
    border-radius: 8px;
    margin-bottom: 10px;
  }
  .workshop-detail-box strong {
    font-size: 13px;
  }
  .workshop-detail-box .fd-img {
    height: 30px;
    width: 30px;
    padding: 5px;
    margin-bottom: 4px;
  }
  .workshop-detail-box .wrapp-sd-box p {
    font-size: 14px;
  }
  .date-submiting {
    background: linear-gradient(73deg, #02322b 35%, #278376 100%);
    border-radius: 8px;
    padding: 40px 20px;
    margin-top: 30px;
    height: auto;
  }
  .summery-bnnr {
    background-image: url(../images/vectors/worshop-window.png);
    height: 370px;
  }
  .summery-bnnr .summery-bnr-img {
    height: 290px;
    width: 225px;
  }
  .certificate {
    height: 265px;
    width: 433px;
    position: relative;
    margin-bottom: 30px;
    border-radius: 8px;
  }
  .green-access {
    padding-bottom: 40px;
  }
  .second-s-box {
    margin-top: -60px;
  }
  .third-s-box {
    margin-top: 20px;
  }
  .first-s-box {
    margin-top: -25px;
  }
  .wall-design {
    height: 300px;
    width: 100%;
    margin-top: -10px;
    padding-right: 20px;
  }
  .workshop-window-img {
    height: 235px;
    width: 82px;
    object-fit: cover;
    padding: 5px;
  }
  .workshop-intro-vector img {
    height: 170px;
    width: 100%;
    object-fit: contain;
    position: relative;
    top: -70px;
    right: 118px;
  }
  .mirror-section {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .coach-workshop {
    height: 410px;
    width: 335px;
    object-fit: cover;
    background-image: url(../images/vectors/mirror.png);
    background-size: cover;
    margin-top: -25px;
    display: flex;
    justify-content: center;
  }
  .workshop-bg-design {
    position: relative;
    height: 0px;
    width: 100%;
    object-fit: contain;
    right: -80px;
    opacity: 0.2;
  }
  .workshop-bg-design img {
    position: absolute;
    right: 0px;
    top: -10px;
    height: 200px;
  }
  .sign-in-workshop {
    padding: 8px 12px;
    margin-top: 0px;
    min-width: 200px;
    right: 0px;
  }
  .sign-in-workshop span {
    font-size: 17px;
  }
  .sign-in-workshop img {
    height: 20px;
  }
  .sign-in-workshop i {
    font-size: 16px;
  }
  .add-workshop-cart .course-price span {
    font-size: 26px;
  }
  .add-workshop-cart {
    display: flex;
    align-items: flex-end;
    justify-content: flex-start;
    flex-direction: column-reverse;
  }
  .workshop-intro-box {
    order: 0 !important;
  }
  .workshop-intro-box p {
    font-size: 20px;
    line-height: 26px;
  }
  .mirror-section {
    order: 1 !important;
  }
  .workshop-en-name {
    font-size: 34px;
  }
  .workshop-name {
    font-size: 30px;
    margin-bottom: 10px;
  }
  .theme-design {
    position: relative;
    height: 0px;
    width: 200px;
    object-fit: cover;
  }
  .theme-design img {
    position: absolute;
    height: 160px;
    width: 160px;
    top: -79px;
    left: -232px;
  }
  .workshop-container {
    padding: 15px 30px;
    height: 760px;
  }
  .workshop-swiper .swiper-slide.swiper-slide-active::before {
    position: absolute;
    bottom: 30px;
    right: 0;
    width: 30px;
    height: 30px;
    border-bottom: 2px solid #e4acc3;
    border-right: 2px solid #e8b0c6;
    border-radius: 0 0 4px 0;
    content: "";
    transition: all 0.3s ease;
  }
  .swiper.workshop-swiper .swiper-slide img {
    margin-bottom: 5px;
  }
  .workshop-swiper .swiper-slide .cardPopout .workshop-cart .workshop-label h4 {
    background-position: 85px 6px;
    top: -175px;
    left: 10px;
    font-size: 10px;
    padding: 5px 15px;
    display: flex;
    border-radius: 3px;
    padding-right: 43px;
    align-items: center;
    padding-top: 7px;
  }
  .workshop-swiper .swiper-slide .cardPopout .w-see-course {
    padding: 5px 8px;
    padding-top: 8px;
    width: 100%;
    height: 35px;
    font-size: 13px;
  }
  .workshop-swiper .swiper-slide .cardPopout .workshop-cart section strong {
    font-size: 12px;
    margin-bottom: 4px;
  }
  .workshop-swiper .swiper-slide .cardPopout .name-course {
    top: 10px;
    font-size: 14px;
  }
  .workshop-swiper .swiper-slide .cardPopout .w-absolute {
    height: 180px;
    position: relative;
    top: -5px;
  }
  .workshop-swiper .swiper-slide .cardPopout .cart-wrappering .cart-img {
    border-radius: 4px;
    height: 180px;
    width: 100%;
    object-fit: cover;
    margin-bottom: 10px;
  }
  .workshop-swiper .swiper-slide .cardPopout .workshop-cart {
    margin-bottom: 10px;
    text-align: right;
    height: 25rem !important;
    padding: 15px;
    background-repeat: no-repeat;
    width: 260px;
  }
  .workshop-swiper .swiper-slide .cardPopout .workshop-samples .swiper .swiper-slide.swiper-slide-active::after .swiper .swiper-slide::before {
    position: absolute;
    bottom: 36px;
    right: 2px;
    width: 30px;
    height: 30px;
    border-bottom: 2px solid #f56295;
    border-right: 2px solid #f1739d;
    border-radius: 0 0 7px 0;
    content: "";
    transition: all 0.3s ease;
  }
  .window-design {
    background-image: url(../images/vectors/main-window.png);
    height: 300px;
    width: 350px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    z-index: revert-layer;
    top: -182px;
    right: -65px;
    opacity: 0.3;
    z-index: 0;
  }
  .swiper-2 {
    padding: 0px 50px;
  }
  .workshop-swiper .swiper-slide.swiper-slide-active::after {
    position: absolute;
    top: 0;
    left: -25px;
    width: 30px;
    height: 30px;
    border-top: 2px solid #e2abc1;
    border-left: 2px solid #e7afc6;
    border-radius: 4px 0 0 0;
    content: "";
    transition: all 0.3s ease;
  }
  .courses-wrapp-title {
    display: flex;
    justify-content: center;
    flex-direction: column;
  }
  .video-play-button {
    position: absolute;
    z-index: 0;
  }
  .blogs-slider.owl-carousel {
    z-index: 0;
  }
  .footer-content {
    position: relative;
    z-index: 0;
  }
  .page-item.active .page-link {
    z-index: 0;
  }
  .see-all-courses {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 28px;
    background: rgba(39, 130, 118, 0.2196078431);
    padding: 5px 10px;
    line-height: 20px;
    margin-top: 15px;
    border-radius: 5px;
    padding-top: 6px;
  }
  .see-all-courses span {
    font-size: 12px;
    font-weight: 500;
    color: #02322b;
    line-height: 20px;
  }
  .see-all-courses i {
    font-size: 12px;
    color: #02322b;
  }
  .video-player {
    height: 400px;
  }
  .read-video-article {
    display: flex;
    margin-right: 10px;
    height: 40px;
    padding: 10px 10px;
    width: 100%;
    color: #fff;
    border-radius: 6px;
    font-size: 15px;
    margin-top: 10px;
    justify-content: space-between;
    flex-direction: row;
    align-items: center;
    margin-right: 0;
    margin-bottom: 10px;
    background: #278376;
  }
  .person-in {
    padding: 8px 10px !important;
  }
  body.device-desktop {
    background: #ffe3ed !important;
  }
  .h_iframe-aparat_embed_frame iframe {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 20 0px;
    box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
  }
  .iframe.no-ad {
    padding-top: 57%;
  }
  .gallery-slider {
    height: 170px;
  }
  .comment-title .thin-line {
    width: 22%;
    height: 1px;
  }
  .layout .content {
    padding: 15px;
  }
  .to-the-space {
    height: 200px;
    background: center;
    background-color: #f1739d;
    background-image: url(../images/vectors/topbgimg2.webp);
    background-size: 500px;
    position: relative;
    top: -40px;
  }
  .flex-details a {
    background: rgba(39, 131, 119, 0.2588235294);
    padding: 5px 8px;
    border-radius: 4px;
    margin-right: 0px;
    font-size: 12px;
  }
  .flex-details strong {
    background: rgba(39, 131, 119, 0.0901960784);
    font-size: 20px;
    margin-left: 5px;
    padding: 4px 12px;
    border-radius: 4px;
  }
  .package-bg {
    height: 90px;
    background-size: 30px;
  }
  .wrapp-details-dashboard span {
    margin-top: 5px;
    font-size: 14px !important;
    margin-left: 4px;
    margin-right: 0px;
  }
  .dashboard-alert-box .alert-title {
    font-weight: 500;
    font-family: "iranyekanBakh";
    font-size: 15px;
  }
  .wrapp-details-dashboard strong {
    margin-top: 4px;
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #278376;
  }
  .calender-bg {
    height: 85px;
    background-size: 30px;
  }
  .dashboard-alert-box p {
    font-size: 13px;
    font-weight: 500;
    margin-top: 10px;
  }
  .dashboard-content {
    padding: 12px 10px;
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .whatsapp-dashboard {
    padding: 5px;
  }
  .whatsapp-dashboard .flex-details {
    margin-top: 0px;
  }
  .whatsapp-dashboard .content-box {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
  .whatsapp-dashboard .wrapp-details-dashboard {
    display: flex;
    align-items: center;
    justify-content: space-around;
  }
  .whatsapp-dashboard .time-title {
    display: none;
  }
  .whatsapp-dashboard a {
    background: rgba(39, 131, 119, 0.2588235294);
    border-radius: 4px;
    margin-right: 0px;
    font-size: 12px;
    height: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .whatsapp-dashboard a i {
    color: #02322b;
    background: #fff;
    box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
    padding: 3px 5px;
    line-height: 18px;
    height: 23px;
    position: relative;
    display: inline-block;
    border-radius: 17px;
    top: 2px;
  }
  .whatsapp-dashboard a span {
    display: block;
    font-size: 12px !important;
  }
  .whatsapp-dashboard .dashboard-icon {
    display: none;
  }
  .whatsapp-dashboard .time-title {
    font-weight: 500;
    font-family: "iranyekanBakh";
    font-size: 15px;
    margin-bottom: 0px;
  }
  .whatsapp-dashboard {
    padding: 10px 5px;
  }
  .time-title {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 2px;
    font-family: "iranyekanBakh";
  }
  .mobile-diplay-none {
    display: none !important;
  }
  .student-courses-banner {
    height: 200px;
    background: center;
    background-color: #f1739d;
    background-image: url(../images/vectors/topbgimg2.webp);
    background-size: 500px;
    position: relative;
    top: -40px;
  }
  .video-info {
    height: 200px;
    direction: rtl;
  }
  .fluid_video_wrapper.fluid_player_layout_default .fluid_controls_container .fluid_controls_left {
    width: 24px;
    left: -7px;
  }
  .views {
    color: #000;
    margin-right: 15px;
    font-weight: 600;
    font-size: 18px;
  }
  .playlist-title {
    background: rgb(215, 46, 102);
    padding: 13px;
    height: 45px;
    text-align: right;
    direction: rtl;
    width: 100%;
    color: #ffffff;
    font-weight: 500;
    font-size: 20px;
    align-items: center;
  }
  main.content {
    height: max-content;
  }
  .course-price-row {
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
    flex-direction: column;
  }
  .special-product .special-cover {
    height: 315px;
    width: 100%;
    object-fit: cover;
    border-radius: 6px;
  }
  .signup-form input[type=checkbox] {
    padding: 10px 5px !important;
    font-size: 13px;
  }
  .download-now {
    background: #e4316c;
    color: #ffffff;
    font-weight: 500;
    display: flex;
    align-items: center;
    height: 25px;
    padding: 2px 15px;
    padding-top: 2px;
    font-size: 10px;
  }
  .login-icon {
    padding: 0;
  }
  .forget {
    font-size: 15px !important;
  }
  #login-page .check-form input {
    width: 18px !important;
    height: 18px !important;
  }
  .wrapp-heaader-top {
    padding: 0px 0px;
    padding-top: 5px;
  }
  .main-layer {
    padding: 0;
  }
  .gallery-wrapper-img {
    height: 140px;
  }
  .bg-head {
    height: 150px !important;
  }
  .banner--cart {
    top: -38px;
  }
  .each-row {
    margin-bottom: 20px;
    justify-content: space-between;
  }
  .contact-us-head {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .video-area .description {
    background: #ffffff;
    padding: 5px 10px;
    padding-bottom: 0;
    direction: rtl;
    margin: 0px;
    color: #000;
    font-size: 13px;
    text-align: justify;
  }
  .video-area .video-column {
    float: right;
    max-width: 100% !important;
    width: 100% !important;
    padding: 0px 1px;
    padding-left: 0;
    display: flex;
    flex-direction: column;
  }
  .video-area .video-playlist {
    float: right;
    font-size: 18px;
    font-weight: 600;
    width: 100%;
    min-height: 250px;
    max-height: 400px;
    direction: rtl;
    overflow-y: scroll;
    padding: 0px 1px;
    padding-right: 0;
  }
  .glass-wrapper {
    margin-bottom: 10px;
  }
  .glass-wrapper .d-caption strong {
    font-size: 14px;
  }
  .glass-wrapper .d-caption span {
    font-size: 14px;
  }
  .glass-wrapper .d-icon-holder {
    height: 25px;
    width: 25px;
    object-fit: contain;
    margin-left: 8px;
  }
  .soft-padding {
    padding-top: 20px;
  }
  .soft-margin {
    margin-top: 10px;
  }
  *[dir=rtl] .default-breadcrumb li.crumb {
    text-align: right;
    direction: rtl !important;
    height: 35px;
    width: 56px;
  }
  *[dir=rtl] .default-breadcrumb li.crumb:first-child {
    padding-right: 0;
    padding-left: 0;
    border-radius: 0 5px 5px 0;
    width: 28px;
  }
  .add-to-cart-btn {
    background: #e4316c;
    padding: 2px;
    border-radius: 6px;
    color: #fff;
    width: 178px;
    height: 50px;
    width: 100% !important;
    display: flex;
    justify-content: center;
    margin-top: 10px;
  }
  .add-to-cart-btn strong {
    font-size: 18px;
    font-weight: 500;
  }
  .countdown-time {
    padding: 8px 8px;
  }
  .countdown-time h4 {
    margin-bottom: 0px;
    color: #f56295;
    font-size: 15px;
    font-weight: 500;
  }
  .countdown-time #the-24h-countdown p {
    font-size: 17px;
  }
  .countdown-time #the-24h-countdown p span {
    font-size: 16px;
  }
  .course-name-main {
    font-family: kalamehweb;
    font-size: 28px;
    margin-bottom: 0px;
    font-weight: 600;
  }
  .course-story p {
    font-size: 14px;
    direction: rtl;
    text-align: justify;
    line-height: 24px;
  }
  .courses-post {
    width: 100%;
    height: 300px;
    margin-top: 20px;
  }
  .course-page-header {
    height: max-content;
    background-repeat: repeat;
    background-position: center;
    top: -22px;
    padding-top: 50px;
  }
  .course-price-row {
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
    flex-direction: row-reverse;
    flex-direction: column;
  }
  .course-price-row .course-price {
    margin-top: 20px;
  }
  .course-price-row .course-price span {
    font-size: 22px;
  }
  .course-price-row .course-price del {
    font-size: 16px;
  }
  .default-breadcrumb li.crumb .link {
    font-size: 10px;
  }
  .default-breadcrumb li.crumb {
    position: relative;
    margin-bottom: 0.5em;
    padding: 5px;
    padding-left: 0px;
  }
  .all-courses-banner {
    height: 186px;
    background-size: 418px;
    top: -40px;
  }
  .cart-course {
    margin-bottom: 10px;
  }
  .courses-cn {
    padding: 10px;
    margin-top: 50px;
  }
  .filter-box {
    margin-bottom: 40px;
    order: 2;
  }
  .button-filters {
    margin-top: 100px;
    direction: rtl;
  }
  .hero-margin {
    margin-top: 20px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-bottom: 50px;
  }
  .hero-margin .w-name-course {
    font-size: 30px;
    color: #fff;
    margin-bottom: 0px !important;
  }
  .pb-5 {
    padding-bottom: 2rem !important;
  }
  .pt-5 {
    padding-top: 1rem !important;
  }
  .text-holder {
    text-align: right;
    padding-right: 22px;
  }
  .tall-blog-banner {
    height: 270px;
    margin-top: 8px;
  }
  .small-blog-caption h4 {
    font-size: 14px !important;
    margin: 0px 0px;
    margin-top: 0px;
    padding-bottom: 2px;
    margin-bottom: 0px;
    height: 19px;
    display: -webkit-box;
    max-width: 202px;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: right;
    direction: rtl;
  }
  .small-blog-caption p {
    font-size: 12px;
    color: #000;
    line-height: 24px;
    margin-top: 10px;
    margin-bottom: 0px;
    display: -webkit-box;
    max-width: 345px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: right;
    direction: rtl;
  }
  .ads-align {
    display: flex;
    justify-content: center;
  }
  .dotnettime-area {
    margin-bottom: 15px;
    height: 30px;
  }
  .copyright-text-p {
    font-size: 12px;
    color: #878787;
    display: flex;
    height: 18px;
    justify-content: center;
  }
  .blog-cart-wrapp-big {
    margin-bottom: 15px;
  }
  .blog-img-small {
    height: 125px;
    width: 245px !important;
    border-radius: 4px;
    object-fit: cover;
  }
  .blog-link-small {
    padding: 2px 6px;
    padding-left: 0px;
    margin-top: 5px;
    font-size: 10px;
  }
  .ribbon-2 img {
    width: 70%;
    top: -70px;
    right: 0px;
  }
  .btn-link {
    padding: 2px 15px;
    padding-left: 15px;
    font-size: 12px;
    padding-top: 4px;
  }
  .btn-link i {
    margin-right: 0px;
    font-size: 12px;
    display: inline-block;
  }
  .gallery-spacer {
    margin-bottom: 0px;
  }
  .blog-margins {
    margin-top: 10px;
  }
  .video-sample-box {
    height: 740px;
  }
  .birthday-cake img {
    height: 138px;
    bottom: -120px;
    position: absolute;
  }
  .sample-article P {
    font-size: 15px;
    line-height: 32px;
  }
  .video-sample-box .title-design .rubic {
    height: 2px;
    width: 120px;
  }
  .video-play-button {
    width: 25px !important;
    height: 18px !important;
    padding: 15px 10px 15px 13px !important;
  }
  .video-sample {
    margin-top: 20px;
    margin-bottom: 70px;
  }
  .window-bg {
    height: 280px;
    width: 300px;
    margin-bottom: 40px;
  }
  .wrapp-patern-1 {
    height: 260px;
    width: 330px;
    position: absolute;
    top: 40px;
    right: 70px;
    padding: 10px;
  }
  .comment-box .comment-caption p {
    font-size: 12px;
    line-height: 20px;
  }
  .comment-box {
    padding: 10px 12px;
    background-size: 50px;
    height: 150px;
    overflow: hidden;
  }
  .comment-box h4 {
    padding: 0px 8px;
    border-radius: 4px;
    width: max-content;
    height: 20px;
    font-size: 15px;
  }
  .comment-slider {
    margin-top: 20px;
  }
  .our-support {
    margin-bottom: 40px;
  }
  .our-support .wrapp-first-img,
  .our-support .wrapp-second-img,
  .our-support .wrapp-third-img {
    width: 80px;
    height: 280px;
    object-fit: cover;
    position: relative;
    border-radius: 2px;
  }
  .support-flower img {
    object-fit: contain;
    height: 100px;
    width: 95px;
  }
  .our-support {
    margin-top: 40px;
    background-size: contain;
    width: 430px;
    height: 320px;
    background-repeat: no-repeat;
  }
  .our-support {
    margin-bottom: 30px;
  }
  .support-container {
    margin-top: 0px;
    direction: rtl;
  }
  .about-caption-section {
    margin-top: 0;
  }
  .about-caption-section {
    order: 1 !important;
  }
  .support-container .col-lg-4 {
    order: 2 !important;
  }
  .swiper .swiper-slide a.course-more-btn {
    padding: 4px 8px;
    font-size: 12px;
  }
  .shop-img {
    height: 240px;
    width: 100%;
    margin-bottom: 5px;
  }
  .swiper .swiper-slide figcaption p {
    margin: 0;
    font-size: 13px;
    -webkit-line-clamp: 2;
    text-align: justify;
    line-height: 22px;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .swiper .swiper-slide h2 {
    font-size: 18px;
    line-height: 18px;
    font-family: kalamehweb;
    padding: 5px 0;
    margin: 0 0 7px 0;
    display: -webkit-box;
    max-width: 400px;
    font-weight: 600;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: right;
    direction: rtl;
  }
  .sectionWrapper {
    background-size: 300px;
    background-position: bottom;
    background-repeat: repeat-x;
    border-radius: 10px;
    margin-top: 30px;
    margin-bottom: 40px;
    padding: 10px 30px;
  }
  .category-section-slider .category-slider .item h4 {
    font-size: 10px;
    line-height: 30px;
    margin-top: 5px;
    text-align: center;
  }
  .slice {
    height: 0px;
  }
  .slice img {
    position: absolute;
    width: 100%;
    height: 130px;
    object-fit: contain;
    top: -38px;
    right: 40px;
  }
  .title-design .mini-line {
    width: 15%;
    height: 1px;
  }
  .category-section-slider .category-slider .item img {
    display: block;
    width: 65px;
    height: 65px;
    padding: 10px;
    margin: auto;
    border-radius: 8px;
    object-fit: contain;
  }
  .title-design .rubic {
    height: 2px;
    width: 130px;
    background: #f56295;
  }
  .about-title {
    font-size: 20px;
    font-family: KalamehWeb;
    font-weight: 600;
  }
  .mina-cake-logo {
    height: 220px;
    width: 190px;
    object-fit: cover;
    position: relative;
    top: 18px;
    border-radius: 10px;
    left: -62px;
  }
  .about-shape-img {
    height: 280px;
    width: 220px;
    background-position: right;
    right: 54px;
    position: relative;
    margin-top: 30px;
  }
  .about-space {
    margin-top: 40px;
  }
  .video-sample-box {
    padding: 0px 20px;
  }
  .service-wrapp .service-box {
    width: 80%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .service-wrapp {
    margin-top: 10px;
    align-items: center;
    margin-bottom: 10px;
    flex-direction: column;
    text-align: justify;
    justify-content: center;
  }
  .service-wrapp .service-box h3 {
    font-size: 18px;
    font-family: KalamehWeb;
    font-weight: 600;
    text-align: center;
    margin: 5px 0;
  }
  .service-wrapp .service-box p {
    font-size: 14px;
    line-height: 26px;
    text-align: center;
    display: -webkit-box;
    max-width: 400px;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    direction: rtl;
  }
  .service-wrapp .icons-holder {
    height: 40px;
    width: 40px;
    padding: 4px;
    object-fit: contain;
    background: #2d8078;
    background-size: 52px;
    background-repeat: no-repeat;
    background-position: right;
    margin-left: 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
  }
  .category-section {
    margin-top: 25px !important;
  }
  .support-wrapp .icons-holder {
    background: #f1739d;
  }
  .about-mall-caption {
    margin-bottom: 0px;
  }
  .about-mall-caption p {
    font-size: 15px;
    line-height: 30px;
  }
  .main-container {
    max-width: 96% !important;
  }
  .about-container {
    margin-top: 0px;
  }
  .art img {
    position: absolute;
    height: 90px;
    top: -40px;
    left: 55px;
  }
  .cooki-dance {
    direction: rtl;
    padding-right: 0px;
  }
  .cooki-dance .growing {
    top: 60px;
    justify-content: center;
    height: 250px;
    right: 20px;
  }
  .growing svg {
    height: 250px;
  }
  .ribbon {
    position: relative;
    width: 100%;
  }
  .playing-btn {
    position: absolute;
    top: 120px;
    right: -2px;
    width: 150px;
    background: #ffffff;
    height: 42px;
    border-radius: 8px;
    flex-direction: row-reverse;
    padding: 5px 7px;
    cursor: pointer;
  }
  .playing-btn strong {
    color: #000 !important;
    font-size: 12px;
    font-weight: 500;
    font-family: iranyekanBakh;
  }
  .button-play.is-play {
    width: 30px;
    height: 30px;
  }
  .herosection-bg {
    padding: 0px;
    margin-top: -45px;
    height: 632px;
    width: 100%;
    margin-bottom: 50px;
    background-size: cover;
    background-position: right 10px;
    overflow: hidden;
  }
  .hero-text {
    height: 640px;
  }
  .coach-vector {
    height: 680px;
    object-fit: contain;
    top: 82px;
    position: relative;
    margin-right: 5px;
  }
  .coach-section {
    display: flex;
    justify-content: flex-end;
    align-items: center;
  }
  .cooki-dance {
    background-image: url(../images/vectors/flower-bg-herro.webp);
    background-position: 0;
    background-repeat: no-repeat;
    height: 280px;
    top: -100px;
    right: -15px;
    background-size: contain;
  }
  .hero-caption p {
    top: 65px;
    padding-left: 0px;
    right: 0;
    font-size: 20px;
    line-height: 25px;
  }
  .green-effect img {
    height: 30px;
    width: 45px;
    margin-top: -90px;
    position: relative;
    right: 20px;
  }
  .hero-texts h2 {
    font-size: 32px;
    width: 100%;
    top: 20px;
  }
  .search-btn {
    font-size: 16px;
    color: rgb(195, 136, 250);
    padding: 0px 9px;
    bottom: 3px;
    height: 40px;
    padding-bottom: 2px;
  }
  .search-box i {
    height: 100%;
    position: relative;
    color: #000000;
    cursor: pointer;
    transition: all 0.3s ease;
    top: 10px;
  }
  .header-design {
    height: 95px;
  }
  .cart-btn {
    margin-left: 5px;
  }
  .static-width {
    width: 50%;
  }
  .wrapp-heaader-top .mdi-phone-in-talk {
    font-size: 12px !important;
  }
  .topper-back {
    background: #f1739d;
    height: 35px;
    display: flex;
    align-items: center;
  }
  .wrapp-heaader-top strong {
    color: white;
    font-size: 10px;
    display: none;
  }
  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: 18px;
  }
  .money {
    height: 2rem;
  }
  .money p {
    font-size: 12px;
    color: #d7a7ff;
    height: 20px;
  }
  .money .toman {
    float: left;
    margin-right: 4px;
  }
  .money del {
    color: #f56295;
    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: 160px;
    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: 28px;
    font-size: 18px;
    font-weight: 600;
    height: 60px;
    overflow: hidden;
    margin-bottom: 0px;
    display: flex;
    align-items: center;
  }
  .blog-wrapper .blog-caption {
    font-size: 14px;
    height: 65px;
    line-height: 17px;
    overflow: hidden;
    color: #000;
    line-height: 24px;
    height: 50px;
    display: -webkit-box;
    max-width: 360px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: right;
    direction: rtl;
  }
  .blog-wrapper .blog-setting {
    display: flex;
    margin-top: 8px;
  }
  .blog-wrapper .blog-user {
    display: none;
  }
  .blog-wrapper .category-label {
    top: 56px;
    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 #278376;
    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;
    margin-bottom: 20px;
  }
  .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 #f1739d;
    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;
  }
  .nc-black {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: 600;
  }
  .teacher-n {
    font-size: 14px;
  }
  .tc-n {
    font-size: 14px;
  }
  .c-name {
    text-align: right;
    padding: 0px 10px;
    min-width: 200px;
  }
  .remove-course {
    width: 25px;
    height: 25px;
    padding: 5px;
    background-color: #f1739d;
    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: 18px;
  }
  .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: #e4316c;
    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: 150px;
    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);
  }
  .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: #e4316c;
    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 {
    padding: 3px 10px;
    text-align: center;
    font-size: 17px;
    font-weight: 500;
    border: none;
    border-radius: 6px;
    color: #fff;
    height: 40px;
    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: #000;
  }
  .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: 13px;
  }
  .po-color {
    color: #c78bff !important;
    font-size: 17px !important;
  }
  .search-main {
    width: 115px;
    height: 46px;
    margin-right: 5px;
    border-radius: 0px;
    background: #e4316c;
    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: 0px;
    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: 10px;
    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: 600;
  }
  .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;
  }
  .search-btn span {
    display: none;
  }
  .logo {
    width: 150px;
    object-fit: contain;
    padding: 0px;
    position: relative;
    right: -25px;
  }
  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: #e4316c;
    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: 55px;
    text-align: right;
    height: 420px;
    padding: 15px 10px;
  }
  .name-course {
    margin-top: 20px;
    font-size: 16px;
    line-height: 40px;
    height: 40px;
    position: relative;
    overflow: hidden;
    top: 23px;
  }
  .first-details {
    margin-top: 0rem;
    padding-bottom: 10px;
  }
  .w-see-course {
    background: #f1739d;
    color: #ffffff;
    font-weight: 600;
    display: flex;
    align-items: center;
    padding: 8px 8px;
    padding-top: 8px;
    width: 100%;
    height: 40px;
    border-radius: 4px;
    justify-content: space-between;
    font-size: 14px;
  }
  .w-see-course i {
    font-size: 16px;
  }
  .money {
    justify-content: flex-end;
  }
  .money del {
    font-size: 16px;
  }
  .new-courses {
    margin-bottom: 15px !important;
  }
  .cart-wrappering .w-absolute {
    height: 215px;
    top: -50px;
  }
  .cart-wrappering .cart-img {
    height: 300px;
  }
  .cart-wrappering i {
    font-size: 16px;
    margin-left: 5px;
    color: #fff;
  }
  .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: 16px !important;
  }
  .filter-box {
    margin-bottom: 40px;
  }
  .filter-wrapping {
    margin-top: -30px;
    padding: 5px 20px;
  }
  .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;
  }
  .blog-bner {
    height: 135px;
    background-image: url(/assets/images/banner/blog-banner.webp);
    background-position: center;
    background-size: cover;
    width: 100%;
    position: absolute;
    top: 5px;
  }
  .hh-margin {
    height: 105px;
    position: relative;
  }
  .blog-master-row {
    margin: 10px;
    margin-top: 60px;
  }
  .wrapp-heaader-top a {
    font-size: 12px;
  }
  .wrapp-heaader-top span {
    font-size: 12px;
  }
}
/* ipod */
@media only screen and (min-width: 630px) and (max-width: 768px) {
  .cooki-dance {
    height: 300px;
    top: -98px;
    right: -40px;
    background-size: contain;
  }
  .coach-vector {
    height: 400px;
    object-fit: contain;
    top: 130px;
    position: relative;
    margin-right: 85px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .mina-cake-logo {
    height: 310px;
    width: 250px;
    object-fit: cover;
    position: relative;
    top: 18px;
    border-radius: 10px;
  }
  .logo {
    height: 100px;
    width: 155px;
    object-fit: cover;
    padding: 0px;
    position: relative;
    /* right: 65px; */
  }
  .logo picture {
    height: 45px;
    width: 42px;
    display: block;
    position: relative;
    top: 5px;
  }
  .wrapp-patern-1 {
    height: 302px;
    width: 480px;
    position: absolute;
    top: -15px;
    right: 120px;
    padding: 10px;
  }
  .our-support {
    margin-top: 5px;
    background-size: contain;
    width: 430px;
    height: 320px;
    right: 130px;
    background-repeat: no-repeat;
    position: relative;
  }
  .coach-vector {
    height: 378px !important;
    object-fit: contain;
    top: 108px;
    position: relative;
    margin-right: 75px;
  }
  .cooki-dance {
    height: 310px;
    top: -120px;
    right: -75px;
    background-size: contain;
  }
  .about-shape-img {
    height: 350px;
    width: 320px;
    background-position: right;
    right: 175px;
    position: relative;
    margin-top: 30px;
  }
  .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 {
    font-size: 12px;
    line-height: 20px;
  }
  .nc-black {
    margin-bottom: 10px;
    font-size: 12px;
  }
  .teacher-n {
    font-size: 12px;
  }
  .tc-n {
    font-size: 12px;
  }
  .remove-course {
    width: 28px;
    height: 28px;
    padding: 8px;
    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;
  }
  .submitting {
    padding: 3px 8px;
    text-align: center;
    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: #000;
  }
  .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;
  }
  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;
  }
  .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: #e4316c;
    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;
  }
  .static-width {
    width: 0%;
    display: flex;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .static-width {
    width: 48%;
  }
  .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;
    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: #e4316c;
    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;
  }
  .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: #e4316c !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: 600;
    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 {
    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;
    color: #fff !important;
    font-size: 17px;
    font-weight: 500;
    border-radius: 6px;
  }
  .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 #278376;
    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: 480px) {
  .pamphlet {
    direction: rtl;
    display: flex;
    align-items: center;
    padding: 20px 15px;
    padding-left: 15px;
    margin-top: -15px;
    background-size: 250px;
    background-position: left bottom;
  }
  .pamphlet h4 {
    -weight: 600;
    font-size: 14px;
  }
  .pamphlet p {
    font-size: 14px;
  }
  .pamphlet a {
    width: 120px;
    height: 40px;
    font-size: 13px;
  }
  .pamphlet a i {
    font-size: 13px;
  }
  .plans .plan {
    cursor: pointer;
    width: 100%;
  }
  .cart-margin {
    margin-top: -100px;
    margin-bottom: 150px;
  }
  .nc-black {
    margin-bottom: 10px;
    font-size: 20px;
    font-weight: 600;
  }
  .wrapp-course-captions input {
    width: 100% !important;
  }
  .pagination {
    margin-bottom: 30px;
  }
  .course-design .support-flower {
    position: absolute;
    object-fit: contain;
    height: 200px;
    right: 0px;
    top: 5px;
  }
  .course-design .support-flower img {
    height: 65px;
  }
  .green-effect {
    flex-direction: column;
    margin-right: 5px;
  }
  .glass-wrapper {
    margin-bottom: 10px;
    padding-right: 5px;
    background-size: 20px;
  }
  .glass-wrapper .d-caption strong {
    font-size: 13px;
  }
  .active-season {
    background-size: 22px;
  }
  .w-video-box video {
    height: 250px;
    object-fit: cover;
  }
  .courses-post {
    width: 100%;
    height: 250px;
    margin-top: 20px;
  }
  .course-name-main {
    margin-bottom: 15px;
    font-size: 26px;
  }
  .static-width {
    width: 47%;
  }
  .green-row {
    height: 773px;
  }
  .add-workshop-cart .course-price {
    margin-right: 0;
  }
  .workshop-intro-box p {
    font-size: 18px;
    line-height: 26px;
  }
  .submit-workshop p {
    font-size: 15px;
  }
  .certificate {
    height: 195px;
  }
  .coach-workshop {
    height: 380px;
    width: 310px;
    background-size: cover;
    margin-top: -25px;
  }
  .window-design {
    background-image: url(../images/vectors/main-window.png);
    height: 300px;
    width: 264px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    z-index: revert-layer;
    top: -260px;
    right: -25px;
    opacity: 0.2;
  }
  .theme-design img {
    position: absolute;
    height: 140px;
    width: 120px;
    top: -79px;
    left: -153px;
  }
  .workshop-container {
    padding: 15px 30px;
    height: 780px;
  }
  .swiper-2 {
    padding: 0px 0px;
  }
  .workshop-container {
    padding: 15px 30px;
    height: 780px;
  }
  .banner-dashboard {
    height: 75px;
  }
  .flex-details a i {
    color: #02322b;
    background: #fff;
    box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
    padding: 2px 4px;
    line-height: 18px;
    height: 22px;
    position: relative;
    display: inline-block;
    border-radius: 17px;
    font-size: 14px;
    top: 4px;
  }
  .flex-details a span {
    color: #02322b;
    font-size: 12px !important;
  }
  .blog-bner-page {
    height: 188px;
    background-image: url(/assets/images/banner/blog.webp);
    background-position: center;
    background-size: cover;
    width: 100%;
    position: absolute;
    top: 0px;
  }
  #login-page .check-form input {
    width: 18px !important;
    height: 18px !important;
  }
  .wrapp-heaader-top strong {
    color: white;
    font-size: 9px;
    display: none;
  }
  .wrapp-heaader-top .mdi-phone-in-talk {
    font-size: 10px !important;
  }
  .wrapp-heaader-top i {
    font-size: 10px;
    margin-left: 1px;
  }
  .search-btn {
    bottom: -1px;
  }
  .green-effect img {
    height: 30px;
    width: 45px;
    margin-top: 30px;
    position: relative;
    right: 20px;
  }
  .coach-vector {
    height: max-content;
    object-fit: contain;
    top: 155px;
    position: relative;
    margin-right: 5px;
  }
  .growing svg {
    height: 160px;
  }
  .cooki-dance {
    background-image: url(../images/vectors/flower-bg-herro.webp);
    background-position: 0;
    background-repeat: no-repeat;
    height: 215px;
    top: -130px;
    right: -25px;
    background-size: contain;
  }
  .herosection-bg {
    padding: 0px;
    margin-top: -45px;
    height: 540px;
    width: 100%;
    margin-bottom: 50px;
    background-size: cover;
    background-position: right 10px;
    overflow: hidden;
  }
  .wrapp-heaader-top {
    padding: 0px 0px;
    padding-top: 5px;
  }
  .main-layer {
    padding: 0;
  }
  .coach-vector {
    height: 320px;
    object-fit: contain;
    top: 45px;
    position: relative;
    margin-right: -12px;
  }
  .header-design {
    height: 95px;
  }
  .main-container {
    max-width: 100% !important;
  }
  .around-padding {
    padding: 0px 15px;
  }
  .sectionWrapper {
    background-size: 280px;
    border-radius: 10px;
    margin-top: 30px;
    margin-bottom: 40px;
    padding: 10px 10px;
  }
  .support-container .col-lg-4 {
    order: 2 !important;
    padding: 0px 20px;
  }
  .our-support .wrapp-first-img,
  .our-support .wrapp-second-img,
  .our-support .wrapp-third-img {
    width: 60px;
    height: 220px;
    object-fit: cover;
    position: relative;
    border-radius: 2px;
  }
  .our-support {
    margin-top: 5px;
    background-size: contain;
    width: 350px;
    height: 320px;
    background-repeat: no-repeat;
  }
  .wrapp-patern-1 {
    height: 280px;
    width: 285px;
    position: absolute;
    top: 30px;
    left: 0px;
    padding: 10px;
  }
  .slider-wave {
    display: flex;
    justify-content: center;
    margin: unset;
    margin-top: 50px;
  }
  .about-title {
    font-size: 22px;
    font-family: KalamehWeb;
    font-weight: 600;
  }
  .title-design .star {
    height: 15px;
    object-fit: contain;
  }
  .video-sample {
    margin-top: 20px;
    width: 95%;
  }
  .video-sample-box {
    height: 800px;
  }
  .birthday-cake img {
    height: 138px;
    bottom: -110px;
    position: absolute;
  }
}
@media only screen and (min-width: 481px) and (max-width: 490px) {
  .cart-margin {
    margin-top: -28px;
    margin-bottom: 150px;
  }
}
/*
    Galaxy s5
    */
@media only screen and (min-width: 414px) and (max-width: 474px) {
  .hero-texts h2 {
    font-size: 22px;
    width: 100%;
    top: 32px;
  }
  .static-width {
    width: 46%;
  }
  .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;
  }
  .green-effect {
    flex-direction: column;
    margin-right: 5px;
  }
}
/*
    iphon
    8,X,XS,11,12
    */
@media only screen and (min-width: 371px) and (max-width: 474px) {
  .courses-items .course-item p {
    font-size: 12px;
  }
  .accordion-button::after {
    top: 15px;
    border-radius: 50%;
  }
  .wrapp-course-sections {
    padding: 15px 10px;
    border-radius: 4px;
    background: #ffeff5;
    /* border: 1px solid rgb(255, 205, 225); */
    margin-bottom: 10px;
    align-items: center;
    flex-direction: column;
    align-content: flex-start;
  }
  .wrapp-course-sections .align-items-center {
    width: 100%;
  }
  .static-width {
    width: 46%;
  }
  .about-title {
    font-size: 21px;
    font-family: KalamehWeb;
    font-weight: 600;
  }
  .slice img {
    height: 90px;
    object-fit: contain;
    top: -5px;
    right: 40px;
  }
  .wrapp-patern-1 {
    height: 260px;
    width: 330px;
    position: absolute;
    top: 40px;
    right: 45px;
    padding: 10px;
  }
  .coach-vector {
    height: 290px;
    object-fit: contain;
    top: 60px;
    position: relative;
    margin-right: -12px;
  }
  .hero-caption p {
    top: 70px;
    padding-left: 0px;
    right: 0;
    font-size: 17px;
    line-height: 25px;
  }
  .hero-texts h2 {
    font-size: 20px;
    width: 100%;
    top: 32px;
  }
  .green-effect {
    flex-direction: column;
    margin-right: 5px;
  }
  .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: 14px;
    padding: 2px 10px;
    font-weight: 500;
    border-radius: 4px;
  }
  .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;
  }
  .accordion > form {
    padding: 0px !important;
  }
  .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 #278376;
    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;
  }
  .content h2 {
    color: #fff;
    font-size: 100px;
    font-family: cursive;
    position: absolute;
  }
  .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: #000;
    font-size: 10px;
    margin-left: 15px;
  }
  .rw-names span {
    font-size: 10px;
    color: #e4316c;
  }
  .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: 180px;
  }
  .name-bl {
    font-size: 16px;
    font-weight: 600;
  }
  .blog-bl {
    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: 12px;
    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: #000;
    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: 14px;
  }
  .colori {
    font-size: 14px;
  }
  .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: #ffedf4;
    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;
  }
  .nm-min {
    font-size: 14px;
    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: #e4316c;
    top: 30px;
    right: 5px;
    margin: 0 auto;
  }
  .remove-course {
    width: 25px;
    height: 25px;
    padding: 8px;
    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: 0px;
  }
  .payment-way {
    padding-right: 0px;
    height: max-content;
    margin-bottom: 10px;
  }
  .pages-header {
    position: relative;
  }
  .contact-form-feild {
    width: 100% !important;
  }
  .bg-head h2 {
    display: none;
  }
  .contact-form-holder {
    padding: 15px;
  }
  .back-tp {
    border-radius: 8px;
    font-size: 14px;
    height: 40px;
    width: 160px;
    margin-top: 20px;
    border: none;
    background-size: 300% 100%;
    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: 12px;
  }
  .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: 145px;
    position: relative;
    right: -8px;
    max-height: 45px;
  }
  .logo picture {
    height: 45px;
    width: 42px;
    display: block;
    position: relative;
    top: 5px;
    right: -15px;
  }
  .wrapp-heaader-top a {
    font-size: 13px;
  }
  .wrapp-heaader-top span {
    font-size: 12px;
  }
  .hero-texts h2 {
    font-size: 24px;
    width: 100%;
    top: 35px;
  }
  .sidebar-logo .logo {
    max-height: unset;
  }
  .submitting {
    padding: 3px 8px;
    font-size: 14px;
    margin-right: 0px;
    height: 40px;
  }
  .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: -30px;
    padding: 5px 20px;
  }
  .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(228, 49, 108, 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: 20px;
  }
  .course-level p {
    font-size: 14px;
    line-height: 20px;
  }
  .course-level {
    width: max-content;
    padding: 0px 22px;
    padding-bottom: 2px;
    border-radius: 3px;
    height: 40px;
    display: flex;
    align-items: center;
  }
  .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: 14px;
    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: 12px;
    height: 90px;
    line-height: 18px;
    overflow: hidden;
  }
  .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: -13px;
    font-size: 14px;
    padding: 2px 10px;
    border-radius: 4px 0px 0px 4px;
    background: linear-gradient(304deg, #e4316c 0.64%, #f1739d 98.23%);
    color: #fff;
  }
  .blog-wrapper .tag-in p {
    font-size: 14px;
    font-weight: 500;
    color: #e4316c;
    padding: 0px 20px;
    background: #ffecf2;
    border-radius: 4px;
  }
  .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: 16px;
    font-weight: 600;
    height: 60px;
    overflow: hidden;
    margin-bottom: 0px;
    display: flex;
    align-items: center;
  }
  .blog-wrapper .blog-caption {
    font-size: 14px;
    line-height: 25px;
    overflow: hidden;
    color: #000;
    line-height: 24px;
    height: 50px;
    display: -webkit-box;
    max-width: 360px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: right;
    direction: rtl;
  }
  .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: 300px) and (max-width: 371px) {
  .header-design nav .navbar .logo a {
    width: 82%;
    object-fit: contain;
    padding: 8px 9px;
    margin-top: -5px;
    height: 65px !important;
  }
  .advertising-campaign a {
    height: 350px;
    border-radius: 8px;
    display: block;
    position: relative;
    cursor: pointer;
    object-fit: cover;
  }
  .offer-input {
    width: 70%;
  }
  .nc-black {
    font-size: 20px;
  }
  .remove-course {
    margin-right: 10px;
  }
  .course-story p {
    font-size: 13px;
    direction: rtl;
    text-align: justify;
    line-height: 24px;
  }
  .wrapp-course-captions {
    text-align: right;
    padding: 20px 20px;
  }
  .countdown-time #the-24h-countdown p {
    font-size: 15px;
  }
  .cart-wrappering .cart-img {
    height: 260px;
  }
  .hero-texts h2 {
    font-size: 24px;
    width: 100%;
    top: 29px;
  }
  .cart-wrappering .w-absolute {
    height: 185px;
    top: -50px;
  }
  .cart-wrappering {
    margin-bottom: 55px;
    text-align: right;
    height: 390px;
    padding: 15px 10px;
  }
  .header-design nav .navbar .logo a {
    width: 75%;
    object-fit: contain;
    padding: 8px 3px;
    margin-top: -5px;
    height: 58px !important;
  }
  .coach-vector {
    height: 275px !important;
    object-fit: contain;
    top: 75px;
    position: relative;
    margin-right: -20px;
  }
  .courses-items .course-item p {
    font-size: 12px;
  }
  .accordion-button::after {
    top: 15px;
    border-radius: 50%;
  }
  .wrapp-course-sections {
    padding: 15px 10px;
    border-radius: 4px;
    background: #ffeff5;
    /* border: 1px solid rgb(255, 205, 225); */
    margin-bottom: 10px;
    align-items: center;
    flex-direction: column;
    align-content: flex-start;
  }
  .wrapp-course-sections .align-items-center {
    width: 100%;
  }
  .static-width {
    width: 44%;
  }
  .about-title {
    font-size: 21px;
    font-family: KalamehWeb;
    font-weight: 600;
  }
  .slice img {
    height: 90px;
    object-fit: contain;
    top: -5px;
    right: 40px;
  }
  .wrapp-patern-1 {
    height: 260px;
    width: 330px;
    position: absolute;
    top: 40px;
    right: 45px;
    padding: 10px;
  }
  .blog-wrapper .blog-intro {
    line-height: 28px;
    font-size: 15px;
  }
  .blog-wrapper .person-in span {
    color: #f56295;
    font-size: 8px;
  }
  .static-width {
    width: 38%;
  }
}
@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;
  }
}
@media only screen and (min-width: 1300px) and (max-width: 1600px) {
  .cooki-dance {
    padding-right: 200px !important;
  }
}
@media (min-width: 576px) {
  .modal-dialog {
    max-width: 70vw;
    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;
  }
}
ul,
li {
  margin: 0;
  padding: 0;
}

.tree-box ul li {
  list-style: none;
}

label {
  font-weight: normal;
}

.banner-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  background-color: rgba(255, 255, 255, 0.0862745098);
  border-radius: 6px;
  width: max-content;
}

/*Tree*/
input {
  width: max-content !important;
}

.trees {
  margin-left: 10px;
}

.trees li {
  border-right: dotted 1px #e8e8e8;
  padding: 1px 15px 1px 0px;
  position: relative;
}

.trees li > label {
  position: relative;
  left: -11px;
}

.trees li:before {
  content: "";
  width: 13px;
  height: 1px;
  border-bottom: dotted 1px #e8e8e8;
  position: absolute;
  top: 10px;
  right: 0;
}

.trees li:last-child:after {
  content: "";
  position: absolute;
  width: 2px;
  height: 13px;
  background: #fff;
  left: -1px;
  bottom: 0px;
}

.trees li input {
  margin-right: 5px;
  margin-left: 5px;
}

.trees li.has-child > ul {
  display: none;
}

.trees li.has-child > input {
  opacity: 0;
  position: absolute;
  left: -14px;
  z-index: 9999;
  width: 22px;
  height: 22px;
  top: -5px;
}

.trees li.has-child > input + .tree-control {
  position: absolute;
  left: -4px;
  top: 6px;
  width: 8px;
  height: 8px;
  line-height: 8px;
  z-index: 2;
  display: inline-block;
  color: #fff;
  border-radius: 3px;
}

label {
  display: block;
  margin-bottom: 5px;
  color: #000000;
  font-size: 14px !important;
}

.trees li.has-child > input ~ ul {
  display: block;
}

.trees ul li.has-child:last-child {
  border-left: none;
}

.trees ul li.has-child:nth-last-child(2):after {
  content: "";
  width: 1px;
  height: 5px;
  border-left: dotted 1px #f2f2f2;
  position: absolute;
  bottom: -5px;
  left: -1px;
}

.tree-alt li {
  padding: 4px 0;
}

.trees li input:hover, .trees li input:focus, .trees li input:active {
  outline: none !important;
  box-shadow: none;
  border: none;
}

.trees li input:before {
  transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
  border: 1px solid;
  border-radius: 0;
  background-color: white;
  border-color: transparent;
  box-sizing: border-box;
  color: #f1739d;
  content: close-quote;
  display: inline-block;
  height: 12px;
  outline: 1px solid #f1739d !important;
  transition-duration: 0.5s;
  transition-property: background-color, border-color;
  width: 12px;
  border-radius: 1px;
}

.trees li input:checked:before {
  background-color: #f1739d;
  border-color: white !important;
}

.has-child {
  padding-right: 10 !important;
}

.switch-radio li {
  display: inline-block;
  position: relative;
  width: 30%;
}

.switch-radio li span {
  position: relative;
  display: inline-block;
  width: 100%;
  height: 35px;
  background: #ffffff;
  border-radius: 6px;
  border: 1px solid #ebebeb;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
  padding-top: 12px;
  margin-top: -2px;
}

.accordion-button::after {
  flex-shrink: 0;
  width: 0.8rem;
  height: 0.8rem;
  margin-right: 0;
  content: "";
  background-repeat: no-repeat;
  background-size: 0.8rem;
  transition: transform 0.2s ease-in-out;
  left: 12px;
  position: absolute;
}

.switch-radio li input[type=radio] {
  position: absolute;
  top: 40%;
  z-index: 99;
  opacity: 0;
  right: 20px;
  -webkit-transform: translate(-50%, -50%) scale(4, 2.5);
  transform: translate(-50%, -50%) scale(4, 2.5);
  width: 20px !important;
  padding: 20px;
}

.switch-radio li input[type=radio]:checked + span {
  background: #f1739d;
}

.switch-radio li input[type=radio]:checked + span + label {
  color: #fff;
}

.switch-radio li label {
  position: absolute;
  top: 5px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  font-size: 14px;
  font-weight: 600;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.switch-radio li span.full-width {
  position: relative;
  display: inline-block;
  width: 100% !important;
  height: 35px;
  background: #cccccc;
  border-radius: 3px;
  border: 1px solid #b3b3b3;
  -webkit-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.free-radio {
  width: 100% !important;
}

.price-filters {
  background-color: #fff;
  border-radius: 4px;
  padding: 20px 15px;
}

.header-price-filter {
  text-align: right;
  width: 100% !important;
  margin-top: 0px;
  background: #ffe4ef !important;
  border-radius: 4px !important;
  border: none !important;
  padding: 0.7rem 0.8rem;
}
.header-price-filter p {
  font-size: 0.9rem;
  font-weight: 600;
  color: #000000;
}

.right-padding {
  padding-right: 20px;
}

.search-filter {
  background-color: #fff;
  border-radius: 4px;
  background: rgb(255, 255, 255);
  border-radius: 4px;
  border: 1px solid #f2f2f2;
  box-shadow: 0px 1.60568px 61.0158px rgba(0, 0, 0, 0.05);
}

.search-filter > .input-group > input {
  font-style: 0.9rem;
  font-weight: 600;
}

.search-btns {
  padding-left: 0px;
}
.search-btns i {
  font-size: 20px;
  color: #fff;
}

.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;
}

.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;
}

.form-select {
  margin-right: 0px;
  border: none !important;
  padding: 15px 10px;
  margin-top: 1.2rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: #000;
}

.accordion-button::after {
  flex-shrink: 0;
  width: 0.8rem;
  height: 0.8rem;
  margin-right: auto;
  background-repeat: no-repeat;
  background-size: 0.8rem;
  transition: transform 0.2s ease-in-out;
}

.accordion-button {
  padding: 1rem 0.8rem !important;
}

@media (max-width: 575px) {
  .trees li input {
    height: 10px;
  }
}
@media (max-width: 991px) {
  .switch-radio li label {
    position: absolute;
    top: 0px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    font-size: 14px;
    font-weight: 600;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
  }
}
.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;
  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;
  top: 3px;
  position: relative;
}

.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: 18px;
  font-weight: 600;
}

.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: 2px solid #34af7c;
  animation-duration: 2s;
  text-align: right;
  background-color: #ffffff;
}

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: 600;
  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: #ffffff;
  width: 75px;
  font-size: 22px;
  margin-right: 5px;
  font-weight: 600;
  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;
}

.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;
  background-color: #f5f5f5;
  background-image: url(../../assets/images/vectors/wp.webp);
  background-size: cover;
  background-repeat: no-repeat;
}
