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

    Theme Name: Brand - Kids, Children, School & Kindergarten HTML Template
    Author: Ordianit
    Support:ordianit@gmail.com
    Description: Brand - Kids, Children, School & Kindergarten HTML Template
    Version: 1.0

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

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

    01. THEME DEFAULT CSS
	02. MEANMENU CSS START
	03. about css start
	04. blog css start
	05. brand css start
    06. cart css start
	07. checkout css start
	08. choose css start
	09. classes css st
	10. contact css start
	11. cta css start
	12. error css start 
	13. event css start
	14. faq css startt 
	15. feature css start
	16. footer css start
	17. funfact css start
	18. gallery css start
	19. header css start
	20. hero css start
	21. menu css start
	22. newsletter css start
	23. price css start
	24. program css start
	25. service css start
	26. shop css start
	27. slider css start
	28. team css start
	29. testimonial css start

    **********************************************/
/*----------------------------------------*/
/* 01. THEME DEFAULT CSS START
/*----------------------------------------*/
/* @import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Outfit:wght@100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100..900;1,100..900&family=Rubik:ital,wght@0,300..900;1,300..900&family=Ruluko&family=Zalando+Sans+SemiExpanded:ital,wght@0,200..900;1,200..900&display=swap'); */
/* @import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Jost:ital,wght@0,100..900;1,100..900&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Outfit:wght@100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100..900;1,100..900&family=Rubik:ital,wght@0,300..900;1,300..900&family=Ruluko&family=Zalando+Sans+SemiExpanded:ital,wght@0,200..900;1,200..900&display=swap'); */
:root {
  /**
  @font family declaration
  */
  /* --it-ff-body: "MATTEHEKFREE", sans-serif; */
  --it-ff-body: "Twentieth-Century";
  --it-ff-heading: "Twentieth-Century" !important;
  --it-ff-schoolbell: "Twentieth-Century" !important;
  --it-ff-fontawesome: Font Awesome 6 Pro;
  /**
  @color declaration
  */
  --it-common-white: #ffffff;
  --it-common-black: #021316;
  --it-heading-primary: #021316;
  --it-grey-1: #E7F8FE;
  --it-text-body: #898989;
  --it-theme-1: #3B5F51;
  --it-theme-2: #487339;
}

@font-face {
  font-family: 'Twentieth-Century';
  src: url('../Twentieth-Century.ttf') format("truetype");
  /* src: url('http://localhost/eduplaynation/public/assets/Twentieth-Century.ttf') format("truetype"); */
  /* font-weight: 600; */
}

@font-face {
  font-family: 'MATTEKEK';
  /* src: url('http://localhost/eduplaynation/public/assets/MATTEHEKFREE-BF64aed90350aea.ttf') format('truetype'); */
  src: url('../MATTEHEKFREE-BF64aed90350aea.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

/* i, .fa-light {
    font-family: "Font Awesome 6 Pro" !important;
    font-weight: 300 !important;
}
.fa-light {
    font-family: "Font Awesome 6 Pro" !important;
    font-weight: 300 !important;
} */
.fa-light,
.fal {
  font-family: "Font Awesome 6 Pro";
  font-weight: 300;
  font-size: 25px;
}

.fa-regular,
.far {
  font-family: "Font Awesome 6 Pro";
  font-weight: 400;
  font-size: 22px;
}

.unicode-check {
  color: #22c55e;
  font-weight: 700;
  margin-right: 8px;
  font-size: 16px;
}

/* 1400px+ */
@media (min-width: 1400px) {

  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: 1350px;
  }
}

/* 1920px+ */
@media (min-width: 1920px) {

  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: 1600px;
  }
}

/* 2560px+ */
@media (min-width: 2560px) {

  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: 1850px;
  }
}

/* 3240px+ */
@media (min-width: 3240px) {

  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: 2100px;
  }
}

/*---------------------------------
	typography css start 
---------------------------------*/
body {
  font-family: var(--it-ff-body);
  /* font-family: 'MATTEKEK', sans-serif;  */
  font-size: 17px;
  font-weight: 400;
  color: var(--it-text-body);
  line-height: 32px;
  overflow-x: hidden;
  letter-spacing: 1.1px;
  /* text-transform: capitalize; */
}

body,
html {
  overflow-x: hidden;
}

a {
  text-decoration: none;
  transition: 0.3s;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--it-ff-heading);
  color: var(--it-heading-primary);
  margin-top: 0px;
  margin-bottom: 0;
  font-weight: 500;
  line-height: 1.2;
  -webkit-transition: all 0.3s ease-out 0s;
  -moz-transition: all 0.3s ease-out 0s;
  -ms-transition: all 0.3s ease-out 0s;
  -o-transition: all 0.3s ease-out 0s;
  transition: all 0.3s ease-out 0s;
}

img {
  max-width: 100%;
}

h1 {
  font-size: 40px;
}

h2 {
  font-size: 32px;
}

h3 {
  font-size: 28px;
}

h4 {
  font-size: 24px;
}

h5 {
  font-size: 20px;
}

h6 {
  font-size: 16px;
}

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

p {
  color: var(--it-text-body);
  font-weight: 500;
  font-size: 18px;
  line-height: 25px;
  /* text-transform: capitalize; */
}

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

.z-index-3 {
  position: relative;
  z-index: 3;
}

.z-index-4 {
  position: relative;
  z-index: 4;
}

.z-index-5 {
  position: relative;
  z-index: 5;
}

.z-index-6 {
  position: relative;
  z-index: 6;
}

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

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

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

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

button:hover {
  cursor: pointer;
}

button:focus {
  outline: 0;
}

.uppercase {
  text-transform: uppercase;
}

.capitalize {
  text-transform: capitalize;
}

input {
  height: 58px;
  width: 100%;
  border: none;
  outline: none;
  padding: 0 20px;
  line-height: 58px;
  font-size: 19px;
  color: var(--it-common-white);
  text-transform: capitalize;
}

input::-webkit-input-placeholder {
  color: #898989;

}

input:-moz-placeholder {
  color: #898989;
}

input::-moz-placeholder {
  color: #898989;
}

input:-ms-input-placeholder {
  color: #898989;
}

.it-student-regiform-button {
  width: 15%;
  margin: 0 auto;
}

textarea {
  outline: none;
  width: 100%;
  padding: 0 20px;
  border: none;
  resize: none;
  font-size: 19px;
  color: var(--it-common-black);
  text-transform: capitalize;
}

textarea::-webkit-input-placeholder {
  color: #898989;
}

textarea:-moz-placeholder {
  color: #898989;
}

textarea::-moz-placeholder {
  color: #898989;
}

textarea:-ms-input-placeholder {
  color: #898989;
}

input[type=color] {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  background: none;
  border: 0;
  cursor: pointer;
  height: 100%;
  width: 100%;
  padding: 0;
  border-radius: 50%;
}

*::-moz-selection {
  background: var(--it-theme-1);
  color: var(--it-common-white);
  text-shadow: none;
}

::-moz-selection {
  background: var(--it-theme-1);
  color: var(--it-common-white);
  text-shadow: none;
}

::selection {
  background: var(--it-theme-1);
  color: var(--it-common-white);
  text-shadow: none;
}

*::-moz-placeholder {
  color: var(--it-common-black);
  font-size: var(--it-fz-body);
  opacity: 1;
}

*::placeholder {
  color: var(--it-common-black);
  font-size: var(--it-fz-body);
  opacity: 1;
}

/*---------------------------------
    common classes css start 
---------------------------------*/
.w-img img {
  width: 100%;
}

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

.fix {
  overflow: hidden;
}

.clear {
  clear: both;
}

.f-left {
  float: left;
}

.f-right {
  float: right;
}

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

.p-relative {
  position: relative;
}

.p-absolute {
  position: absolute;
}

.include-bg {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.gx-5 {
  --bs-gutter-x: 5px;
}

.gx-20 {
  --bs-gutter-x: 20px;
}

.gx-35 {
  --bs-gutter-x: 35px;
}

.gx-55 {
  --bs-gutter-x: 55px;
}

/*--
    - Spacing
-----------------------------------------*/
.it-btn {
  display: inline-block;
  font-weight: 600;
  text-transform: uppercase;
  padding: 8px 29px;
  /* height: 55px; */
  /* line-height: 55px; */
  position: relative;
  transition: 0.4s;
  border-radius: 5px;
  z-index: 1;
  color: var(--it-common-white);
  background-color: var(--it-theme-2);
  font-size: 15px;
  overflow: hidden;
}

.it-btn.circle-effect {
  position: relative;
}

.it-btn.circle-effect::after {
  background-color: var(--it-common-black);
  bottom: -100%;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: -100%;
  width: 100%;
  transform: scaleY(0);
  transform-origin: bottom;
  transition-duration: 1s;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.14, 0, 0, 1.01);
  will-change: transform;
  z-index: -1;
}

.it-btn.white-style::after {
  background-color: var(--it-common-white);
}

.it-btn.theme-style::after {
  background-color: var(--it-theme-2);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-btn {
    font-size: 14px;
  }
}

.it-btn span svg {
  margin-left: 6px;
  display: inline-block;
  transform: translateY(-1px);
}

.it-btn.black-bg {
  background-color: var(--it-common-black);
}

.it-btn.theme-2-bg {
  background-color: var(--it-theme-2);
}

.it-btn.white-bg {
  color: var(--it-theme-1);
  background-color: var(--it-common-white);
}

.it-btn:hover {
  color: var(--it-common-white);
}

.it-btn:hover.circle-effect::after {
  transform: scaleY(1);
  transform-origin: top;
}

.it-btn:hover.white-style {
  color: var(--it-common-black);
}

.it-btn-white {
  display: inline-block;
  font-weight: 600;
  text-transform: uppercase;
  padding: 0 29px;
  height: 55px;
  line-height: 55px;
  position: relative;
  transition: 0.4s;
  border-radius: 5px;
  z-index: 1;
  color: var(--it-theme-1);
  background-color: var(--it-common-white);
  font-size: 15px;
  overflow: hidden;
}

.it-btn-white.circle-effect {
  position: relative;
}

.section-padding {
  padding-top: 130px;
  padding-bottom: 110px;
}

.it-contact-area {
  padding: 90px 0px;
}

/* Tablet */
@media (max-width: 992px) {
  .section-padding {
    padding-top: 40px;
    padding-bottom: 70px;
  }
}

/* Mobile */
@media (max-width: 576px) {
  .section-padding {
    padding-top: 60px;
    padding-bottom: 40px;
  }
}

.it-btn-white.circle-effect::after {
  background-color: var(--it-common-black);
  bottom: -100%;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: -100%;
  width: 100%;
  transform: scaleY(0);
  transform-origin: bottom;
  transition-duration: 1s;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.14, 0, 0, 1.01);
  will-change: transform;
  z-index: -1;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-btn-white {
    font-size: 14px;
  }

  .it-student-regiform-button {
    width: 100%;
    margin: 0 auto;
  }
}

.it-btn-white span svg {
  margin-left: 6px;
  display: inline-block;
  transform: translateY(-1px);
}

.it-btn-white:hover {
  color: var(--it-common-white);
}

.it-btn-white:hover.circle-effect::after {
  transform: scaleY(1);
  transform-origin: top;
}

.it-btn-border {
  display: inline-block;
  font-weight: 600;
  text-transform: uppercase;
  padding: 0 29px;
  height: 55px;
  line-height: 55px;
  position: relative;
  transition: 0.4s;
  border-radius: 5px;
  z-index: 1;
  color: var(--it-common-white);
  background-color: transparent;
  font-size: 15px;
  border: 1px solid var(--it-common-white);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-btn-border {
    font-size: 14px;
  }
}

.it-btn-border span svg {
  margin-left: 6px;
  display: inline-block;
  transform: translateY(-1px);
}

.it-btn-border:hover {
  color: var(--it-theme-1);
  background-color: var(--it-common-white);
}

.it-btn-sm {
  display: inline-block;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  padding: 0 20px;
  height: 44px;
  line-height: 44px;
  position: relative;
  transition: 0.4s;
  border-radius: 5px;
  z-index: 1;
  color: var(--it-common-white);
  background-color: var(--it-theme-1);
  overflow: hidden;
}

.it-btn-sm.circle-effect {
  position: relative;
}

.it-btn-sm.circle-effect::after {
  background-color: var(--it-common-black);
  bottom: -100%;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: -100%;
  width: 100%;
  transform: scaleY(0);
  transform-origin: bottom;
  transition-duration: 1s;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.14, 0, 0, 1.01);
  will-change: transform;
  z-index: -1;
}

.it-btn-sm span svg {
  margin-left: 6px;
  display: inline-block;
  transform: translateY(-1px);
}

.it-btn-sm:hover {
  color: var(--it-common-white);
}

.it-btn-sm:hover.circle-effect::after {
  transform: scaleY(1);
  transform-origin: top;
}

.it-btn-white-sm {
  display: inline-block;
  font-weight: 700;
  font-size: 14px;
  padding: 0 20px;
  height: 40px;
  width: 140px;
  line-height: 40px;
  height: 40px;
  line-height: 40px;
  position: relative;
  transition: 0.3s;
  text-transform: uppercase;
  color: var(--it-common-white);
  background-color: var(--it-theme-1);
  box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
  margin: 5px 0;
  overflow: hidden;
}

.it-btn-white-sm span {
  position: relative;
  z-index: 5;
}

.it-btn-white-sm.circle-effect {
  position: relative;
}

.it-btn-white-sm.circle-effect::after {
  background-color: var(--it-common-black);
  bottom: -100%;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: -100%;
  width: 100%;
  transform: scaleY(0);
  transform-origin: bottom;
  transition-duration: 1s;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.14, 0, 0, 1.01);
  will-change: transform;
}

.it-btn-white-sm:hover {
  color: var(--it-common-white);
}

.it-btn-white-sm:hover.circle-effect::after {
  transform: scaleY(1);
  transform-origin: top;
}

/* pulse effect animation */
@-webkit-keyframes pulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
  }

  70% {
    -webkit-box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);
  }

  100% {
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}

@keyframes itrotate {
  0% {
    transform: rotate(0);
  }

  to {
    transform: rotate(1turn);
  }
}

@keyframes itswing {
  0% {
    -webkit-transform: rotate(25deg);
    -ms-transform: rotate(25deg);
    transform: rotate(25deg);
  }

  100% {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
  }
}

@keyframes itleftright {
  0% {
    transform: translate(0);
  }

  to {
    transform: translate(-20px);
  }
}

@keyframes itupdown {
  0% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    -webkit-transform: translateY(-20px);
    -moz-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    -o-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

@-moz-keyframes headerSlideDown {
  0% {
    margin-top: -150px;
  }

  100% {
    margin-top: 0;
  }
}

@-ms-keyframes headerSlideDown {
  0% {
    margin-top: -150px;
  }

  100% {
    margin-top: 0;
  }
}

@-webkit-keyframes headerSlideDown {
  0% {
    margin-top: -150px;
  }

  100% {
    margin-top: 0;
  }
}

@keyframes headerSlideDown {
  0% {
    margin-top: -150px;
  }

  100% {
    margin-top: 0;
  }
}

@keyframes pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
  }

  70% {
    -moz-box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 45px rgba(255, 255, 255, 0);
  }

  100% {
    -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}

@keyframes section-animation {
  0% {
    width: 0;
  }

  15% {
    width: 100%;
  }

  85% {
    opacity: 1;
  }

  90% {
    width: 100%;
    opacity: 0;
  }

  to {
    width: 0;
    opacity: 0;
  }
}

@keyframes about-sm {
  100% {
    transform: translateY(60px);
  }

  100% {
    transform: translateY(50px);
  }
}

@keyframes hero-thumb-animation {
  0% {
    transform: translateY(-20px);
  }

  100% {
    transform: translateY(0px);
  }
}

@keyframes itleftright {
  0% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    -webkit-transform: translateX(-20px);
    -moz-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    -o-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}

@keyframes itrotate {
  0% {
    transform: rotateY(0deg);
  }

  100% {
    transform: rotateY(360deg);
  }
}

@keyframes ittranslateY2 {
  0% {
    -webkit-transform: translateY(-30px);
    -moz-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    -o-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  100% {
    -webkit-transform: translateY(20px);
    -moz-transform: translateY(20px);
    -ms-transform: translateY(20px);
    -o-transform: translateY(20px);
    transform: translateY(20px);
  }
}

@keyframes scroll {
  0% {
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    -o-transform: translateY(0px);
    transform: translateY(0px);
  }

  100% {
    -webkit-transform: translateY(8px);
    -moz-transform: translateY(8px);
    -ms-transform: translateY(8px);
    -o-transform: translateY(8px);
    transform: translateY(8px);
  }
}

@keyframes RL_smooth {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  50% {
    -webkit-transform: translateX(5px);
    transform: translateX(5px);
  }

  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes slide_up_down {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

@keyframes ittranslateX2 {
  0% {
    -webkit-transform: translateX(-30px);
    -moz-transform: translateX(-30px);
    -ms-transform: translateX(-30px);
    -o-transform: translateX(-30px);
    transform: translateX(-30px);
  }

  100% {
    -webkit-transform: translatXY(20px);
    -moz-transform: translateX(20px);
    -ms-transform: translateX(20px);
    -o-transform: translateX(20px);
    transform: translateX(20px);
  }
}

@keyframes rotate-center {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes scale_up_down {
  0% {
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes dash {
  to {
    stroke-dashoffset: 0px;
    stroke-dasharray: 3000;
  }
}

@keyframes itupdown {
  0% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    -webkit-transform: translateY(-20px);
    -moz-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    -o-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

@keyframes itswing {
  0% {
    -webkit-transform: rotate(6deg);
    -moz-transform: rotate(6deg);
    -ms-transform: rotate(6deg);
    -o-transform: rotate(6deg);
    transform: rotate(6deg);
  }

  100% {
    -webkit-transform: rotate(-6deg);
    -moz-transform: rotate(-6deg);
    -ms-transform: rotate(-6deg);
    -o-transform: rotate(-6deg);
    transform: rotate(-6deg);
  }
}

@keyframes borderanimate2 {
  0% {
    transform: translate(-50%, -50%) scale(1);
  }

  60% {
    opacity: 1;
  }

  100% {
    transform: translate(-50%, -50%) scale(2.5);
    opacity: 0;
  }
}

@keyframes bounceInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  60% {
    opacity: 1;
    -webkit-transform: translateY(-30px);
    -ms-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  80% {
    -webkit-transform: translateY(10px);
    -ms-transform: translateY(10px);
    transform: translateY(10px);
  }

  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes moving {
  0% {
    transform: translatey(0px);
  }

  50% {
    transform: translatey(-20px);
  }

  100% {
    transform: translatey(0px);
  }
}

@keyframes about-circle {
  0% {
    -webkit-transform: translateX(100px);
    -moz-transform: translateX(100px);
    -ms-transform: translateX(100px);
    -o-transform: translateX(100px);
    transform: translateX(100px);
  }

  100% {
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    -ms-transform: translateX(0px);
    -o-transform: translateX(0px);
    transform: translateX(0px);
  }
}

@keyframes services-triangle {
  0% {
    -webkit-transform: rotate(0deg) translateX(-50px);
    -moz-transform: rotate(0deg) translateX(-50px);
    -ms-transform: rotate(0deg) translateX(-50px);
    -o-transform: rotate(0deg) translateX(-50px);
    transform: rotate(0deg) translateX(-50px);
  }

  100% {
    -webkit-transform: rotate(360deg) translateY(100px);
    -moz-transform: rotate(360deg) translateY(100px);
    -ms-transform: rotate(360deg) translateY(100px);
    -o-transform: rotate(360deg) translateY(100px);
    transform: rotate(360deg) translateY(100px);
  }
}

@keyframes hero-3-dot-2 {
  0% {
    transform: translateY(-50px);
  }

  100% {
    transform: translateY(0px);
  }
}

@keyframes tfLeftToRight {
  49% {
    transform: translateX(60%);
  }

  50% {
    opacity: 0;
    transform: translateX(-60%);
  }

  51% {
    opacity: 1;
  }
}

@keyframes rotate2 {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

@keyframes moving {
  0% {
    transform: translatey(0px);
  }

  20% {
    transform: translateX(-50px);
  }

  50% {
    transform: translatey(-40px);
  }

  100% {
    transform: translatey(0px);
  }
}

@keyframes leftright {
  0% {
    transform: translatex(0);
  }

  50% {
    transform: translateX(100%);
  }

  100% {
    transform: translateX(0);
  }
}

@keyframes movinglight {
  0% {
    transform: translatey(0px);
  }

  20% {
    transform: translateX(-70px);
  }

  50% {
    transform: translatey(-70px);
  }

  100% {
    transform: translatey(0px);
  }
}

@keyframes movinglight2 {
  0% {
    transform: translatey(0px);
  }

  20% {
    transform: translateX(70px);
  }

  50% {
    transform: translatey(70px);
  }

  100% {
    transform: translatey(0px);
  }
}

@keyframes movingtop {
  0% {
    transform: translatey(0px);
  }

  20% {
    transform: translatey(70px);
  }

  50% {
    transform: translatey(-70px);
  }

  100% {
    transform: translatey(0px);
  }
}

@keyframes circle-animation {
  0% {
    right: 0;
  }

  50% {
    right: 100%;
  }

  100% {
    right: 0%;
  }
}

@keyframes circle-animation-2 {
  0% {
    left: 0;
  }

  50% {
    left: 100%;
  }

  100% {
    left: 0%;
  }
}

@keyframes animationglob {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes zoom {
  0% {
    transform: scale(0.5);
  }

  50% {
    transform: scale(1);
  }

  100% {
    transform: scale(0.5);
  }
}

@keyframes zoom2 {
  0% {
    transform: scale(0.9);
  }

  50% {
    transform: scale(1);
  }

  100% {
    transform: scale(0.9);
  }
}

@keyframes wobble-vertical {
  10% {
    transform: translateY(-10px);
  }

  50% {
    transform: skew(15deg);
  }

  80% {
    transform: rotate(10deg);
  }

  100% {
    transform: translate(0);
  }
}

@-webkit-keyframes section-highlight {
  0% {
    width: 0%;
  }

  100% {
    width: 100%;
  }
}

@-moz-keyframes section-highlight {
  0% {
    width: 0%;
  }

  100% {
    width: 100%;
  }
}

@-ms-keyframes section-highlight {
  0% {
    width: 0%;
  }

  100% {
    width: 100%;
  }
}

@keyframes section-highlight {
  0% {
    width: 0%;
  }

  100% {
    width: 100%;
  }
}

@keyframes widthcalc {
  0% {
    width: 20%;
  }

  50% {
    width: 50%;
  }

  75% {
    width: 90%;
  }

  90% {
    opacity: 75%;
  }

  90% {
    opacity: 100%;
  }
}

/* right bounce */
@keyframes bounceRight {

  0%,
  20%,
  50%,
  80%,
  100% {
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  40% {
    -ms-transform: translateY(-35px);
    transform: translateY(-35px);
  }

  60% {
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

/* /right bounce */
@keyframes icon-bounce {

  0%,
  100%,
  20%,
  50%,
  80% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }

  40% {
    -webkit-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    -o-transform: translateY(-10px);
    transform: translateY(-10px);
  }

  60% {
    -webkit-transform: translateY(-5px);
    -moz-transform: translateY(-5px);
    -ms-transform: translateY(-5px);
    -o-transform: translateY(-5px);
    transform: translateY(-5px);
  }
}

@keyframes light-one {
  0% {
    opacity: 1;
  }

  25% {
    opacity: 0.4;
  }

  50% {
    opacity: 0.6;
  }

  75% {
    opacity: 0.8;
  }

  100% {
    opacity: 1;
  }
}

@keyframes sliderShape {

  0%,
  100% {
    border-radius: 42% 58% 70% 30%/45% 45% 55% 55%;
    transform: translate3d(0, 0, 0) rotateZ(0.01deg);
  }

  34% {
    border-radius: 70% 30% 46% 54%/30% 29% 71% 70%;
    transform: translate3d(0, 5px, 0) rotateZ(0.01deg);
  }

  50% {
    transform: translate3d(0, 0, 0) rotateZ(0.01deg);
  }

  67% {
    border-radius: 100% 60% 60% 100%/100% 100% 60% 60%;
    transform: translate3d(0, -3px, 0) rotateZ(0.01deg);
  }
}

@keyframes shine {
  100% {
    left: 125%;
  }
}

/*--- preloader ---*/
.dark #preloader {
  background-color: var(--it-theme-1);
}

#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #f7f7f7;
  z-index: 999999;
}

.preloader {
  width: 50px;
  height: 50px;
  display: inline-block;
  padding: 0px;
  text-align: left;
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -25px;
  margin-top: -25px;
}

.preloader span {
  position: absolute;
  display: inline-block;
  width: 50px;
  height: 50px;
  border-radius: 100%;
  background: var(--it-theme-1);
  -webkit-animation: preloader 1.3s linear infinite;
  animation: preloader 1.3s linear infinite;
}

.preloader span:last-child {
  animation-delay: -0.9s;
  -webkit-animation-delay: -0.9s;
}

@keyframes preloader {
  0% {
    transform: scale(0, 0);
    opacity: 0.5;
  }

  100% {
    transform: scale(1, 1);
    opacity: 0;
  }
}

@-webkit-keyframes preloader {
  0% {
    -webkit-transform: scale(0, 0);
    opacity: 0.5;
  }

  100% {
    -webkit-transform: scale(1, 1);
    opacity: 0;
  }
}

/*--- end of preloader ---*/
.scroll-top {
  width: 40px;
  height: 40px;
  line-height: 40px;
  position: fixed;
  bottom: -10%;
  right: 50px;
  font-size: 16px;
  z-index: 9;
  text-align: center;
  border-radius: 50%;
  color: var(--it-common-white);
  cursor: pointer;
  background: var(--it-theme-2);
  transition: 1s ease;
  border: none;
}

.scroll-top.open {
  bottom: 80px;
}

/*---------------------------------------*/
/*Background color
/*-----------------------------------------*/
.white-bg {
  background: var(--it-common-white);
}

.black-bg {
  background: var(--it-common-black);
}

.theme-bg {
  background: var(--it-theme-2);
}

.theme-bg-2 {
  background: var(--it-theme-2);
}

.grey-bg {
  background: var(--it-grey-1);
}

.body-overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  width: 100%;
  height: 100%;
  background: rgba(24, 24, 24, 0.8);
  visibility: hidden;
  opacity: 0;
  transition: 0.45s ease-in-out;
}

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

.body-overlay:hover {
  cursor: url(../img/cross-out.html), pointer;
}

.it-instagram img {
  width: 100%;
}

.itoffcanvas {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: fixed;
  top: 0;
  right: -100%;
  width: 480px;
  bottom: 0;
  box-shadow: 0 16px -32px 0 rgba(0, 0, 0, 0.8);
  background-color: var(--it-common-black);
  z-index: 999999;
  padding: 50px;
  scrollbar-width: none;
  opacity: 0;
  visibility: hidden;
  transition: 0.45s ease-in-out;
  overflow-y: scroll;
}

.itoffcanvas.opened {
  opacity: 1;
  visibility: visible;
}

@media (max-width: 767px) {
  .itoffcanvas {
    width: 300px;
    padding: 40px 35px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .itoffcanvas {
    width: 400px;
    padding: 40px;
  }
}

.itoffcanvas.opened {
  right: 0;
  -webkit-transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-duration: 0.6s;
}

.itoffcanvas__logo {
  margin-bottom: 60px;
}

@media (max-width: 767px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .itoffcanvas__logo {
    padding-top: 0;
  }
}

.itoffcanvas__logo img {
  width: 157px;
  height: 100%;
}

.itoffcanvas__close-btn button {
  font-size: 35px;
  color: rgb(0, 0, 0);
  position: absolute;
  right: 50px;
  top: 42px;
  transition: 1s;
  font-weight: 300;
  /* opacity: 0.2; */
  -webkit-transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition-duration: 0.3s;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .itoffcanvas__close-btn button {
    font-size: 28px;
    right: 48px;
    top: 52px;
  }
}

@media (max-width: 767px) {
  .itoffcanvas__close-btn button {
    font-size: 28px;
    right: 39px;
    top: 38px;
  }
}

.itoffcanvas__close-btn button:hover {
  color: #fff;
  opacity: 1;
}

.itoffcanvas__content {
  margin-bottom: 30px;
}

.itoffcanvas__content p {
  font-size: 16px;
  color: #fff;
  font-weight: 400;
  line-height: 1.6;
  margin-bottom: 25px;
}

.itoffcanvas__content span {
  color: #fff;
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 5px;
  display: inline-block;
}

.itoffcanvas__content a {
  font-size: 30px;
  line-height: 51px;
  font-weight: 700;
  color: var(--it-common-white);
  display: inline-block;
}

@media (max-width: 767px) {
  .itoffcanvas__content a {
    font-size: 27px;
  }
}

.itoffcanvas__social {
  margin-top: 50px;
}

.itoffcanvas__social .social-icon a {
  height: 50px;
  width: 50px;
  line-height: 50px;
  text-align: center;
  font-size: 18px;
  background-color: var(--it-theme-1);
  color: var(--it-common-white);
  margin-right: 15px;
  transition: 0.3s;
  display: inline-block;
  border-radius: 50%;
}

@media (max-width: 767px) {
  .itoffcanvas__social .social-icon a {
    margin-right: 3px;
  }
}

.itoffcanvas__social .social-icon a:hover {
  background-color: var(--it-theme-1);
  color: var(--it-common-white);
}

.itoffcanvas__text {
  padding-bottom: 20px;
  margin-bottom: 20px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .itoffcanvas__text {
    display: none;
  }
}

.itoffcanvas__text p {
  color: #ddd;
  font-size: 18px;
}

.itoffcanvas__info {
  border-bottom: 1px solid #3b3838;
  padding-bottom: 30px;
  margin-bottom: 20px;
}

.itoffcanvas__info .offcanva-title {
  color: var(--it-common-white);
  margin: 30px 0 40px 0;
  font-size: 20px;
  font-weight: 600;
}

.itoffcanvas__info-icon a {
  height: 50px;
  width: 50px;
  background-color: var(--it-theme-1);
  color: var(--it-common-white);
  display: inline-block;
  text-align: center;
  line-height: 50px;
  border-radius: 50px;
  font-weight: 400;
  font-size: 21px;
  margin-right: 20px;
}

.itoffcanvas__info-address span {
  display: block;
  color: rgba(255, 255, 255, 0.6392156863);
  font-size: 16px;
  font-weight: 400;
}

.itoffcanvas__info-address a {
  display: block;
  color: var(--it-common-white);
  font-size: 18px;
  font-weight: 600;
  transition: 0.3s;
}

@media (max-width: 767px) {
  .itoffcanvas__info-address a {
    font-size: 16px;
  }
}

.itoffcanvas__info-address a:hover {
  color: var(--it-theme-1);
}

.itoffcanvas .home-img-title {
  color: var(--it-common-white);
}

.it-offcanva-bottom-shape {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  z-index: -1;
}

.it-offcanva-bottom-shape img {
  width: 100%;
}

.it-breadcrumb-height {
  padding-top: 105px;
  padding-bottom: 120px;
}

@media (max-width: 767px) {
  .it-breadcrumb-height {
    padding: 100px 0;
  }
}

.it-breadcrumb-title {
  color: var(--it-common-white);
  font-size: 60px;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 5px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-breadcrumb-title {
    font-size: 55px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-breadcrumb-title {
    font-size: 52px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-breadcrumb-title {
    font-size: 42px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-breadcrumb-title {
    font-size: 40px;
  }
}

@media (max-width: 767px) {
  .it-breadcrumb-title {
    font-size: 32px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-breadcrumb-title {
    font-size: 42px;
  }
}

.it-breadcrumb-list {
  display: inline-block;
  border-radius: 30px;
}

.it-breadcrumb-list span {
  color: var(--it-common-white);
  font-size: 19px;
  font-style: normal;
  text-transform: capitalize;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-breadcrumb-list span {
    font-size: 14px;
  }
}

.it-breadcrumb-list span.dvdr {
  color: var(--it-common-white);
  font-weight: 500;
  font-size: 16px;
  /* padding: 0 18px; */
}

.it-breadcrumb-list span.color {
  color: #FFFFFF;
}

.it-breadcrumb-shape-1 {
  position: absolute;
  top: 28%;
  left: 6%;
  animation: rotate2 4s linear infinite;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-breadcrumb-shape-1 {
    transform: scale(0.7);
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-breadcrumb-shape-1 {
    transform: scale(0.5);
    top: 49%;
    left: 1%;
  }
}

.it-breadcrumb-shape-2 {
  position: absolute;
  top: 22%;
  right: 12%;
  animation: moving 9s linear infinite;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-breadcrumb-shape-2 {
    transform: scale(0.7);
    right: 3%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-breadcrumb-shape-2 {
    display: none;
  }
}

.it-breadcrumb-shape-3 {
  position: absolute;
  top: 33%;
  right: 28%;
  animation: rotate2 4s linear infinite;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-breadcrumb-shape-3 {
    transform: scale(0.7);
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-breadcrumb-shape-3 {
    transform: scale(0.5);
    top: 10%;
    right: 4%;
  }
}

.it-breadcrumb-shape-4 {
  position: absolute;
  bottom: 15%;
  right: 23%;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-breadcrumb-shape-4 {
    transform: scale(0.7);
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-breadcrumb-shape-4 {
    transform: scale(0.5);
  }
}

.it-breadcrumb-shape-5 {
  position: absolute;
  left: 2%;
  bottom: 5%;
  animation: rotate2 4s linear infinite;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-breadcrumb-shape-5 {
    transform: scale(0.7);
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-breadcrumb-shape-5 {
    transform: scale(0.5);
  }
}

.it-breadcrumb-shape-6 {
  position: absolute;
  bottom: 19%;
  left: 28%;
  animation: moving 3s linear infinite;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-breadcrumb-shape-6 {
    transform: scale(0.7);
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-breadcrumb-shape-6 {
    transform: scale(0.5);
  }
}

.it-breadcrumb-shape-7 {
  position: absolute;
  top: 5%;
  left: 39%;
  animation: ittranslateX2 4s infinite alternate;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-breadcrumb-shape-7 {
    transform: scale(0.7);
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-breadcrumb-shape-7 {
    transform: scale(0.5);
  }
}

.it-breadcrumb-shape-8 {
  position: absolute;
  bottom: 13%;
  right: 40%;
  animation: moving 9s linear infinite;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-breadcrumb-shape-8 {
    transform: scale(0.7);
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-breadcrumb-shape-8 {
    transform: scale(0.5);
  }
}

.it-breadcrumb-shape-9 {
  position: absolute;
  right: 4%;
  bottom: 15%;
  animation: ittranslateY2 4s infinite alternate;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-breadcrumb-shape-9 {
    transform: scale(0.7);
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-breadcrumb-shape-9 {
    transform: scale(0.5);
  }
}

.it-custom-accordion .accordion-items {
  margin-bottom: 20px;
  border: 1px solid #E2E1E1;
  border-radius: 5px;
}

.it-custom-accordion .accordion-buttons {
  font-size: 20px;
  font-weight: 500;
  padding: 21px 25px;
  font-family: var(--it-ff-heading);
  color: #000000;
  position: relative;
  width: 100%;
  text-align: left;
  background: #48733930;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-custom-accordion .accordion-buttons {
    font-size: 17px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-custom-accordion .accordion-buttons {
    font-size: 16px;
  }
}

@media (max-width: 767px) {
  .it-custom-accordion .accordion-buttons {
    font-size: 15px;
    padding-right: 60px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-custom-accordion .accordion-buttons {
    font-size: 17px;
  }
}

.it-custom-accordion .accordion-buttons::after {
  position: absolute;
  content: "\f068";
  font-family: "Font Awesome 5 Pro";
  top: 50%;
  right: 30px;
  font-weight: 400;
  font-size: 16px;
  opacity: 1;
  transform: translateY(-50%);
  color: var(--it-common-black);
}

.it-custom-accordion .accordion-buttons.collapsed::after {
  content: "\f067";
}

.it-custom-accordion .accordion-buttons:not(.collapsed) {
  background-color: var(--it-theme-1);
  color: var(--it-common-white);
}

.it-custom-accordion .accordion-buttons:not(.collapsed)::after {
  color: var(--it-common-black);
}

.it-custom-accordion .collapsed {
  position: relative;
  z-index: 99;
  /* background-color: var(--it-theme-2); */
}

.it-custom-accordion .accordion-body {
  padding: 30px 28px;
  position: relative;
  z-index: 1;
  font-size: 17px;
  font-style: normal;
  font-weight: 400;
  line-height: 32px;
  justify-content: space-between;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-custom-accordion .accordion-body {
    font-size: 15px;
    padding: 30px 21px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-custom-accordion .accordion-body {
    font-size: 14px;
    flex-wrap: wrap;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-custom-accordion .accordion-body {
    font-size: 14px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-custom-accordion .accordion-body {
    font-size: 15px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-custom-accordion .accordion-body p {
    font-size: 13px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-custom-accordion .accordion-body p {
    font-size: 15px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-custom-accordion .accordion-body p {
    font-size: 14px;
  }
}

.it-custom-accordion-style-3 .accordion-buttons:not(.collapsed) {
  background-color: #48733930;
  color: var(--it-common-black);
  text-transform: capitalize;
}
.it-footer-contact-box p{
  text-transform: capitalize;
}
.it-custom-accordion-style-3 .accordion-body p {
  margin-right: 40px;
  color: var(--it-common-black);
  text-transform: capitalize;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-custom-accordion-style-3 .accordion-body p {
    margin-right: 0;
  }
}

/*----------------------------------------*/
/*  SEARCH CSS START
/*----------------------------------------*/
.search__popup {
  padding-top: 70px;
  padding-bottom: 100px;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 55%;
  z-index: 9999999;
  background-color: var(--it-common-black);
  -webkit-transform: translateY(calc(-100% - 80px));
  -moz-transform: translateY(calc(-100% - 80px));
  -ms-transform: translateY(calc(-100% - 80px));
  -o-transform: translateY(calc(-100% - 80px));
  transform: translateY(calc(-100% - 80px));
  -webkit-transition: transform 0.6s ease-in-out, opacity 0.6s ease-in-out;
  -moz-transition: transform 0.6s ease-in-out, opacity 0.6s ease-in-out;
  transition: transform 0.6s ease-in-out, opacity 0.6s ease-in-out;
  transition-delay: 0.7s;
}

.search__popup.search-opened {
  -webkit-transform: translateY(0%);
  -moz-transform: translateY(0%);
  -ms-transform: translateY(0%);
  -o-transform: translateY(0%);
  transform: translateY(0%);
  transition-delay: 0s;
}

.search__popup.search-opened .search__input {
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -o-transform: translateY(0px);
  transform: translateY(0px);
  opacity: 1;
  transition-delay: 0.3s;
}

.search__popup.search-opened .search__input::after {
  width: 100%;
  transition-delay: 0.5s;
}

.search__popup-2 {
  background-color: var(--it-common-black-13);
}

.search__popup-2 .search__input .search-input-field~.search-focus-border {
  background-color: var(--it-theme-8);
}

.search__popup-3 .search__input .search-input-field~.search-focus-border {
  background-color: var(--it-theme-10);
}

.search__top {
  margin-bottom: 80px;
}

.search__input {
  position: relative;
  height: 80px;
  transition-delay: 0.5s;
  opacity: 0;
}

.search__input::after {
  position: absolute;
  content: "";
  left: 0;
  bottom: 0;
  width: 0%;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.3);
  transition-delay: 0.3s;
}

.search__input input {
  width: 100%;
  height: 100%;
  background-color: transparent;
  border: 0;
  outline: 0;
  font-size: 24px;
  color: var(--it-common-white);
  border-bottom: 1px solid transparent;
  padding: 0;
  padding-right: 30px;
}

.search__input input::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
  font-size: 24px;
}

.search__input input:-moz-placeholder {
  color: rgba(255, 255, 255, 0.5);
  font-size: 24px;
}

.search__input input::-moz-placeholder {
  color: rgba(255, 255, 255, 0.5);
  font-size: 24px;
}

.search__input input:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.5);
  font-size: 24px;
}

.search__input button {
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 18px;
  color: var(--it-common-white);
}

.search__input .search-input-field~.search-focus-border {
  position: absolute;
  bottom: 0;
  left: auto;
  right: 0;
  width: 0;
  height: 1px;
  background-color: var(--it-common-orange);
  -webkit-transition: all 0.5s ease-out 0s;
  -moz-transition: all 0.5s ease-out 0s;
  -ms-transition: all 0.5s ease-out 0s;
  -o-transition: all 0.5s ease-out 0s;
  transition: all 0.5s ease-out 0s;
}

.search__input .search-input-field:focus~.search-focus-border {
  width: 100%;
  left: 0;
  right: auto;
  -webkit-transition: all 0.5s ease-out 0s;
  -moz-transition: all 0.5s ease-out 0s;
  -ms-transition: all 0.5s ease-out 0s;
  -o-transition: all 0.5s ease-out 0s;
  transition: all 0.5s ease-out 0s;
}

.search__close-btn {
  font-size: 25px;
  color: rgba(255, 255, 255, 0.3);
}

.search__close-btn:hover {
  color: var(--it-common-white);
}

.search__result-title {
  font-size: 50px;
  letter-spacing: -0.04em;
  margin-bottom: 0;
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .search__result-title {
    font-size: 40px;
  }
}

@media (max-width: 767px) {
  .search__result-title {
    font-size: 35px;
  }
}

.search__result-title span {
  color: var(--it-theme-1);
  display: inline-block;
}

.search__result-content p {
  font-size: 16px;
  line-height: 1.62;
  color: var(--it-text-1);
}

.search__result-input {
  position: relative;
}

.search__result-input-box {
  position: relative;
  margin-bottom: 20px;
}

.search__result-input-box button {
  position: absolute;
  top: 0;
  right: 0;
  padding: 22px 43px;
}

@media (max-width: 767px) {
  .search__result-input-box button {
    position: relative;
    margin-top: 15px;
  }
}

.search__result-input-box button:hover {
  background-color: var(--it-common-black);
}

.search__result-input input {
  width: 100%;
  height: 70px;
  padding-left: 60px;
  padding-right: 177px;
  background-color: var(--it-common-white);
  border: 1px solid var(--it-common-white);
  box-shadow: -3px 0px 0px var(--it-theme-1), 0px 1px 2px rgba(3, 4, 28, 0.14);
}

@media (max-width: 767px) {
  .search__result-input input {
    padding-right: 25px;
  }
}

.search__result-input span {
  position: absolute;
  top: 50%;
  left: 30px;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 18px;
  color: #A0A0B5;
}

.search__result-input span svg {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  transform: translateY(-2px);
}

.search__result-tags a {
  display: inline-block;
  font-family: var(--it-ff-space);
  font-size: 13px;
  font-weight: 500;
  border: 1px solid #D5D5DD;
  padding: 5px 18px;
  line-height: 1;
  margin-right: 2px;
  margin-bottom: 7px;
}

.search__result-tags a:hover {
  background-color: var(--it-theme-1);
  border-color: var(--it-theme-1);
  color: var(--it-common-white);
}

.search__blog-item {
  padding: 50px 50px;
  border: 1px solid #EAEAEF;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .search__blog-item {
    padding: 30px 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .search__blog-item {
    padding: 25px;
  }
}

@media (max-width: 767px) {
  .search__blog-item {
    padding: 20px;
  }
}

.search__blog-title {
  font-size: 30px;
  line-height: 1.2;
  letter-spacing: -0.04em;
  margin-bottom: 13px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .search__blog-title {
    font-size: 28px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .search__blog-title {
    font-size: 21px;
  }

  .search__blog-title br {
    display: none;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px),
(max-width: 767px) {
  .search__blog-title br {
    display: none;
  }
}

@media (max-width: 767px) {
  .search__blog-title {
    font-size: 25px;
  }
}

.search__blog-title a:hover {
  color: var(--it-theme-1);
}

.search__blog-tag {
  margin-bottom: 10px;
}

.search__blog-tag a {
  display: inline-block;
  background-color: rgba(99, 100, 219, 0.06);
  font-family: var(--it-ff-space);
  font-weight: 500;
  font-size: 15px;
  line-height: 1;
  color: var(--it-common-purple);
  padding: 4px 12px;
}

.search__blog-tag a:hover {
  background-color: var(--it-common-purple);
  color: var(--it-common-white);
}

.search__blog-meta span {
  color: var(--it-text-1);
  margin-right: 15px;
  margin-bottom: 10px;
  display: inline-block;
}

.search__blog-meta span i,
.search__blog-meta span svg {
  margin-right: 2px;
}

.search__blog-meta span svg {
  -webkit-transform: translateY(-1px);
  -moz-transform: translateY(-1px);
  -ms-transform: translateY(-1px);
  -o-transform: translateY(-1px);
  transform: translateY(-1px);
}

.search__blog-meta span svg path {
  stroke: #7A7E83;
}

.search__blog-meta-author {
  margin-bottom: 10px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .search__blog-meta-author {
    margin-right: 20px;
  }
}

.search__blog-meta-author-thumb img {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  margin-right: 10px;
}

.search__blog-meta-author-content span {
  display: inline-block;
  font-family: var(--it-ff-inter);
  font-size: 14px;
  color: #7A7E83;
}

.search__blog-meta-author-content span a {
  color: var(--it-common-black-11);
  font-weight: 500;
}

.search__blog-meta-author-content span a:hover {
  color: var(--it-theme-1);
}

.search__blog-content p {
  font-size: 15px;
  line-height: 1.47;
  color: var(--it-text-1);
  margin-bottom: 20px;
}

.search__blog-btn .it-btn-border {
  padding: 8px 29px;
}

.search__blog-btn .it-btn-border svg,
.search__blog-btn .it-btn-border i {
  margin-left: 5px;
}

.search__blog-btn .it-btn-border svg {
  -webkit-transform: translateY(-1px);
  -moz-transform: translateY(-1px);
  -ms-transform: translateY(-1px);
  -o-transform: translateY(-1px);
  transform: translateY(-1px);
}

.search__blog-btn .it-btn-border:hover {
  background-color: var(--it-theme-1);
  border-color: var(--it-theme-1);
  color: var(--it-common-white);
}

.it-section-subtitle {
  /* color: #FFFFFF; */
  font-family: var(--it-ff-schoolbell);
  font-size: 31px;
  font-weight: 400;
  line-height: 30px;
  display: block;
  margin-bottom: 20px;
  text-transform: capitalize;
}

.it-section-subtitle.theme-2 {
  color: var(--it-theme-2);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-section-subtitle {
    font-size: 21px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-section-subtitle {
    font-size: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-section-subtitle {
    font-size: 19px;
  }
}

.it-section-title {
  font-size: 45px;
  font-weight: 600;
  text-transform: capitalize;
  margin-bottom: 0;
}

.it-section-title span {
  color: var(--it-theme-2);
  font-family: "MATTEKEK";
  font-size: 45px;
  text-transform: none;
}

.eduplay-box .icon i {
  font-size: 31px;
  color: #487339;
}

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

.edu-1 {
  color: var(--it-common-white) !important;
  font-family: "MATTEKEK";
  font-size: 45px;
}

.edu-2 {
  color: var(--it-theme-2) !important;
  font-family: var(--it-ff-body) !important;
  font-size: 45px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-section-title {
    font-size: 42px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-section-title {
    font-size: 37px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-section-title {
    font-size: 35px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-section-title {
    font-size: 33px;
  }

  .it-section-title br {
    display: none;
  }
}

@media (max-width: 767px) {
  .it-section-title {
    font-size: 27px;
  }

  .it-section-title br {
    display: none;
  }

  .it-section-title span {
    color: var(--it-theme-2);
    font-family: "MATTEKEK";
    font-size: 35px;
  }
}

/*----------------------------------------*/
/*  19. header css start
/*----------------------------------------*/
.header-sticky {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  opacity: 1;
  visibility: visible;
  width: 100%;
  -webkit-animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
  -khtml-animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
  -moz-animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
  -ms-animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
  -o-animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
  animation: 0.95s ease 0s normal forwards 1 running headerSlideDown;
  background-color: var(--it-common-white);
  -webkit-box-shadow: 0 10px 15px rgba(25, 25, 25, 0.1);
  z-index: 1111;
}

.it-header-transparent {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2;
}

.it-header-menu {
  padding-left: 55px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-header-menu {
    padding-left: 30px;
  }
}

.it-header-menu>nav>ul>li {
  display: inline-block;
  list-style-type: none;
  position: relative;
}

.it-header-menu>nav>ul>li.p-static {
  position: static;
}

.it-header-menu>nav>ul>li>a {
  font-size: 18px;
  font-weight: 600;
  padding: 30px 15px;
  padding-top: 50px;
  display: inline-block;
  color: var(--it-theme-2);
  line-height: 1;
  position: relative;
  transition: 0.3s;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-header-menu>nav>ul>li>a {
    font-size: 14px;
    padding: 30px 12px;
    padding-top: 50px;
  }
}

.it-header-menu>nav>ul>li>a::after {
  position: absolute;
  content: "";
  top: 0;
  left: 50%;
  width: 0%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
  z-index: -1;
  transform: translateX(-50%);
  background-color: var(--it-theme-1);
}

.it-header-menu>nav>ul>li>a span {
  position: absolute;
  top: 29%;
  left: 0;
  right: 0;
  max-width: 16px;
  text-align: center;
  margin: 0 auto;
}

.it-header-menu>nav>ul>li>.submenu {
  position: absolute;
  top: 99%;
  left: 0;
  width: 280px;
  text-align: left;
  padding: 30px;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
  transition-duration: 0.1s;
  transform-origin: top;
  z-index: 9;
  -webkit-transform: perspective(300px) rotateX(-18deg);
  -moz-transform: perspective(300px) rotateX(-18deg);
  -ms-transform: perspective(300px) rotateX(-18deg);
  -o-transform: perspective(300px) rotateX(-18deg);
  transform: perspective(300px) rotateX(-18deg);
  border-top: 4px solid var(--it-theme-1);
  background-color: var(--it-common-white);
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
  z-index: 9999;
}

.it-header-height {
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.it-header-menu>nav>ul>li>.submenu>li {
  margin: 0;
  display: block;
  margin-bottom: 5px;
}

.it-header-menu>nav>ul>li>.submenu>li:last-child {
  margin-bottom: 0;
}

.it-header-menu>nav>ul>li>.submenu>li>a {
  display: inline-block;
  padding: 0;
  font-weight: 700;
  color: var(--it-common-black);
  transition: 0.3s;
  position: relative;
}

.it-header-menu>nav>ul>li>.submenu>li>a::before {
  position: absolute;
  top: 16px;
  left: 0;
  content: "";
  height: 1px;
  width: 0px;
  background-color: var(--it-theme-1);
  display: inline-block;
  transition: all 0.3s ease-out 0s;
  opacity: 0;
  visibility: hidden;
}

.it-header-menu>nav>ul>li>.submenu>li>a:hover {
  padding-left: 25px;
}

.it-header-menu>nav>ul>li>.submenu>li>a:hover::before {
  width: 20px;
  visibility: visible;
  opacity: 1;
}

.it-header-menu>nav>ul>li:hover>a {
  color: var(--it-common-white);
  background-color: var(--it-theme-2);
}

.it-header-menu>nav>ul>li:hover>a::after {
  width: 100%;
  opacity: 1;
  visibility: visible;
}

.it-header-menu>nav>ul>li:hover .submenu {
  opacity: 1;
  visibility: visible;
  transition-duration: 0.2s;
  -webkit-transform: perspective(300px) rotateX(0deg);
  -moz-transform: perspective(300px) rotateX(0deg);
  -ms-transform: perspective(300px) rotateX(0deg);
  -o-transform: perspective(300px) rotateX(0deg);
  transform: perspective(300px) rotateX(0deg);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-header-icon-box {
    margin-left: -30px;
  }
}

.it-header-icon-box ul li {
  display: inline-block;
  list-style-type: none;
}

.it-header-icon-box ul li:not(:last-child) {
  margin-right: 25px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-header-icon-box ul li:not(:last-child) {
    margin-right: 20px;
  }
}

.it-header-icon span,
.it-header-icon button,
.it-header-icon a {
  color: var(--it-common-black);
  font-size: 20px;
}

.it-header-button {
  margin-left: 20px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-header-button {
    margin-left: 30px;
  }
}

.it-header-bar button {
  height: 45px;
  width: 45px;
  line-height: 41px;
  text-align: center;
  margin: 15px 0;
  font-size: 18px;
  color: var(--it-theme-2);
  margin-left: 20px;
  border: 1px solid var(--it-theme-2);
}

.it-header-top-ptb {
  padding: 9px 0;
  background-color: var(--it-common-white);
}

.it-header-top-left ul li {
  list-style-type: none;
  display: inline-block;
  padding-left: 30px;
  position: relative;
}

.it-header-top-left ul li:not(:last-child) {
  margin-right: 35px;
}

@media (max-width: 767px) {
  .it-header-top-left ul li:not(:last-child) {
    margin-right: 0;
  }
}

.it-header-top-left ul li a {
  color: var(--it-common-black);
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 26px;
}

.it-header-top-left ul li i {
  position: absolute;
  top: 3px;
  left: 0;
  color: var(--it-theme-2);
}

.it-header-top-action-box a,
.it-header-top-action-box button {
  font-size: 20px;
  margin: 0 13px;
  color: var(--it-common-black);
}

.it-header-top-action-box a:not(:last-child),
.it-header-top-action-box button:not(:last-child) {
  margin-right: 0px;
}

.it-header-top-action-box a.cart-icon,
.it-header-top-action-box button.cart-icon {
  position: relative;
}

.it-header-top-action-box a.cart-icon span,
.it-header-top-action-box button.cart-icon span {
  position: absolute;
  top: -2px;
  right: -3px;
  color: #0D1C37;
  font-size: 10px;
  font-weight: 400;
  height: 13.5px;
  line-height: 13.5px;
  width: 13.5px;
  border-radius: 50%;
  display: inline-block;
  text-align: center;
  background-color: var(--it-theme-1);
}

.it-header-top-style-1 {
  background-color: var(--it-theme-2);
}

.it-header-top-style-1 .it-header-top-left ul li a {
  color: var(--it-common-white);
}

.it-header-top-style-1 .it-header-top-left ul li i {
  color: var(--it-common-white);
}

.it-header-top-style-1 .it-header-top-social {
  position: relative;
}

.it-header-top-style-1 .it-header-top-social::after {
  /* position: absolute;
  content: "";
  top: 50%;
  left: -23px;
  height: 25px;
  width: 1px;
  background-color: var(--it-common-white);
  opacity: 0.2;
  transform: translateY(-50%); */
}

.it-header-top-style-1 .it-header-top-social a {
  font-size: 15px;
  margin: 0 5px;
  color: var(--it-common-white);
}

.it-header-top-style-1 .it-header-top-right {
  display: inline-block;
  padding: 7px 0;
  padding-left: 5px;
  /* padding-right: 50px; */
  /* background-color: var(--it-theme-1); */
  position: relative;
}

.it-header-top-style-1 .it-header-top-right::after {
  content: "";
  position: absolute;
  top: 0;
  right: 15px;
  height: 100%;
  width: 4px;
  background-color: var(--it-theme-2);
}

.it-header-top-style-1 .it-header-top-right ul li {
  list-style: none;
  display: inline-block;
}

.it-header-top-style-1 .it-header-top-right ul li:not(:last-child) {
  margin-right: 30px;
}

.it-header-top-style-1 .it-header-top-lang {
  position: relative;
}

.it-header-top-style-1 .it-header-top-lang.open ul li a span svg {
  transform: rotate(-180deg);
}

.it-header-top-style-1 .it-header-top-lang.open .it-header-top-lang-submenu {
  opacity: 1;
  visibility: visible;
  top: 115%;
}

.it-header-top-style-1 .it-header-top-lang>ul>li {
  font-weight: 400;
  font-size: 15px;
  display: inline-block;
  width: 115px;
  height: 36px;
  text-align: center;
  color: var(--it-common-white);
}

.it-header-top-style-1 .it-header-top-lang>ul>li a img {
  margin-right: 4px;
}

.it-header-top-style-1 .it-header-top-lang>ul>li a span {
  margin-left: 5px;
}

.it-header-top-style-1 .it-header-top-lang>ul>li a span svg {
  display: inline-block;
  transition: 0.3s;
}

.it-header-top-style-1 .it-header-top-lang>ul>li>ul.it-header-top-lang-submenu {
  position: absolute;
  top: 130%;
  left: 0px;
  z-index: 9;
  transition: all 0.3s ease-out 0s;
  opacity: 0;
  visibility: hidden;
  background-color: var(--it-common-white);
  padding: 12px 22px;
  box-shadow: 0 30px 70px 6px rgba(11, 6, 70, 0.08);
  width: 100%;
}

.it-header-top-style-1 .it-header-top-lang>ul>li>ul.it-header-top-lang-submenu>li {
  list-style-type: none;
  padding-bottom: 5px;
}

.it-header-top-style-1 .it-header-top-lang>ul>li>ul.it-header-top-lang-submenu>li>a {
  border-radius: 0;
  transition: 0.3s;
  color: var(--it-common-black);
}

.it-header-top-style-1 .it-header-top-lang>ul>li>ul.it-header-top-lang-submenu>li>a:hover {
  color: var(--it-theme-2);
}

.it-header-top-style-1 .it-header-top-lang>ul>li>ul.it-header-top-lang-submenu>li:last-child {
  margin-bottom: 0;
}

.it-header-logo img {
  height: 100%;
  width: 160px;
}

.it-footer-logo img {
  height: 100%;
  width: 160px;
}

.search__logo img {
  height: 100%;
  width: 160px;
}

/*----------------------------------------*/
/*  27. slider css start
/*----------------------------------------*/
.it-slider-bg {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: right center;
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition: opacity 2500ms ease-in, -webkit-transform 7000ms ease;
  transition: opacity 2500ms ease-in, -webkit-transform 7000ms ease;
  transition: transform 7000ms ease, opacity 2500ms ease-in;
  transition: transform 7000ms ease, opacity 2500ms ease-in, -webkit-transform 7000ms ease;
  opacity: 0;
  visibility: hidden;
}

.it-slider-overlay {
  position: relative;
}

.it-slider-overlay::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  content: "";
}

.it-slider-height {
  height: 880px;
  display: flex;
  justify-content: center;
  align-items: center;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-slider-height {
    height: 750px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-slider-height {
    height: 700px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-slider-height {
    height: 600px;
  }
}

@media (max-width: 767px) {
  .it-slider-height {
    height: 470px;
  }
}

.it-slider-title {
  font-size: 75px;
  line-height: 1.1;
  color: var(--it-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-slider-title {
    font-size: 62px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-slider-title {
    font-size: 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-slider-title {
    font-size: 40px;
  }
}

@media (max-width: 767px) {
  .it-slider-title {
    font-size: 30px;
  }
}

.it-slider-content-box {
  background-color: var(--it-theme-1);
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  mask-size: contain;
  mask-repeat: no-repeat;
  width: 100%;
  height: 720px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-slider-content-box {
    height: 600px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-slider-content-box {
    height: 500px;
    width: 550px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-slider-content-box {
    height: 450px;
    width: 450px;
  }
}

@media (max-width: 767px) {
  .it-slider-content-box {
    height: 320px;
    width: 320px;
  }
}

@media (max-width: 767px) {
  .it-slider-content-box .it-btn {
    padding: 0 20px;
    height: 45px;
    line-height: 45px;
    font-size: 12px;
  }
}

.it-slider-shape-1 {
  position: absolute;
  bottom: 5%;
  left: 0;
}

.it-slider-shape-2 {
  position: absolute;
  bottom: 0;
  top: 0;
  left: 0;
  right: 0;
  text-align: center;
  transform: scale(1.1);
}

.it-slider-content-wrap {
  transform: scale(0.8) rotateY(360deg);
  transition: 1.2s;
  opacity: 0;
  visibility: hidden;
}

.it-slider-active .swiper-slide.swiper-slide-active .it-slider-bg {
  -webkit-transform: scale(1.15);
  transform: scale(1.15);
  opacity: 1;
  visibility: visible;
}

.it-slider-active .swiper-slide.swiper-slide-active .it-slider-content-wrap {
  transform: scale(1) rotateY(0deg);
  opacity: 1;
  visibility: visible;
}

/*----------------------------------------*/
/*  20. hero css start
/*----------------------------------------*/
.it-hero-ptb {
  padding-top: 205px;
  padding-bottom: 90px;
  position: relative;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-ptb {
    padding-top: 140px;
    padding-bottom: 90px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-ptb {
    padding-top: 170px;
    padding-bottom: 90px;
  }
}

@media (max-width: 767px) {
  .it-hero-ptb {
    padding-top: 180px;
    padding-bottom: 90px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-hero-ptb {
    padding-top: 190px;
    padding-bottom: 90px;
  }
}

.it-hero-title {
  font-size: 65px;
  font-weight: 600;
  line-height: 1.1;
  text-transform: capitalize;
}

.it-header-logo {
  font-size: 40px;
  color: var(--it-common-black);
  font-family: "MATTEKEK";
}

.it-footer-logo {
  font-size: 40px;
  color: var(--it-common-white);
  font-family: "MATTEKEK";
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-title {
    font-size: 60px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-title {
    font-size: 66px;
  }

  .it-hero-title br {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-hero-title {
    font-size: 67px;
  }

  .it-hero-title br {
    display: none;
  }
}

@media (max-width: 767px) {
  .it-hero-title {
    font-size: 42px;
  }

  .it-hero-title br {
    display: none;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-hero-title {
    font-size: 52px;
  }

  .it-hero-title br {
    display: none;
  }
}

.it-hero-title span {
  color: var(--it-theme-1);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-hero-content {
    margin-bottom: 50px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-hero-content {
    margin-bottom: 80px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-text p {
    padding-right: 70px;
  }

  .it-hero-text p br {
    display: none;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-hero-text p {
    font-size: 15px;
  }

  .it-hero-text p br {
    display: none;
  }
}

.it-hero-thumb-box {
  margin-right: -120px;
}

@media only screen and (min-width: 1600px) and (max-width: 1800px) {
  .it-hero-thumb-box {
    transform: translateX(-70px);
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-hero-thumb-box {
    transform: translateX(-140px) scale(0.9);
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-thumb-box {
    transform: translateX(-140px) scale(0.9);
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-thumb-box {
    margin-right: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-hero-thumb-box {
    margin-right: 0;
    text-align: center;
  }
}

.it-hero-thumb {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  mask-size: contain;
  mask-repeat: no-repeat;
  z-index: 2;
  display: inline-block;
  width: auto;
  height: auto;
  max-width: 100%;
  overflow: hidden;
  transform: translateX(105px);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-thumb {
    transform: translateX(50px);
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .it-hero-thumb {
    transform: translateX(0px);
  }
}

@media (max-width: 767px) {
  .it-hero-thumb {
    transform: translateX(0px);
  }
}

.it-hero-thumb>img {
  position: relative;
  z-index: 2;
}

.it-hero-shape-1 {
  position: absolute;
  top: -4%;
  z-index: -1;
  right: -5.5%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-shape-1 {
    right: -11.5%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-hero-shape-1 {
    left: -4%;
    top: -4%;
  }
}

.it-hero-shape-2 {
  position: absolute;
  top: -4%;
  right: -2%;
  animation: itswing 0.9s forwards infinite alternate;
  transform-origin: bottom right;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-shape-2 {
    transform: scale(0.5);
  }
}

.it-hero-shape-3 {
  position: absolute;
  bottom: -5%;
  left: 8%;
  animation: itswing 1.1s forwards infinite alternate;
  transform-origin: top right;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-shape-3 {
    transform: scale(0.5);
  }
}

.it-hero-shape-4 {
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  width: 48%;
  background-size: cover;
  background-repeat: no-repeat;
}

.it-hero-shape-5 {
  position: absolute;
  bottom: 0;
  left: 0;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-shape-5 {
    bottom: -3px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-shape-5 {
    bottom: -5px;
  }
}

.it-hero-shape-5 img {
  max-width: inherit;
}

.it-hero-shape-6 {
  position: absolute;
  bottom: 0;
  right: 0;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-shape-6 {
    bottom: -5%;
  }
}

.it-hero-shape-7 {
  position: absolute;
  top: 27%;
  right: 41%;
  animation: rotate2 4s linear infinite;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-shape-7 {
    transform: scale(0.5);
  }
}

.it-hero-shape-8 {
  position: absolute;
  bottom: 9%;
  left: 40%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-shape-8 {
    transform: scale(0.5);
  }
}

.it-hero-shape-9 {
  position: absolute;
  top: 18%;
  left: 3%;
  animation: rotate2 4s linear infinite;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-shape-9 {
    transform: scale(0.5);
  }
}

.it-hero-shape-10 {
  position: absolute;
  bottom: 11%;
  left: 2%;
  animation: rotate2 4s linear infinite;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-shape-10 {
    transform: scale(0.5);
  }
}

.it-hero-shape-11 {
  position: absolute;
  top: 14%;
  left: 31%;
  animation: ittranslateX2 4s infinite alternate;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-shape-11 {
    transform: scale(0.5);
  }
}

.it-hero-shape-12 {
  position: absolute;
  left: 55%;
  top: 44%;
  animation: moving 7s linear infinite;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-shape-12 {
    transform: scale(0.5);
  }
}

.it-hero-shape-13 {
  position: absolute;
  left: 0;
  bottom: 55%;
  animation: moving 7s linear infinite;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-shape-13 {
    transform: scale(0.5);
  }
}

.it-hero-shape-14 {
  position: absolute;
  bottom: 13%;
  left: 28%;
  animation: moving 9s linear infinite;
}

.it-hero-2-ptb {
  padding-top: 90px;
  padding-bottom: 210px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-2-ptb {
    padding-bottom: 150px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-2-ptb {
    padding-top: 80px;
    padding-bottom: 140px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-hero-2-ptb {
    padding-top: 120px;
    padding-bottom: 70px;
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-hero-2-ptb .it-hero-title {
    font-size: 65px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-2-ptb .it-hero-title {
    font-size: 60px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-2-ptb .it-hero-title {
    font-size: 52px;
  }

  .it-hero-2-ptb .it-hero-title br {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-hero-2-ptb .it-hero-title {
    font-size: 55px;
  }

  .it-hero-2-ptb .it-hero-title br {
    display: none;
  }
}

@media (max-width: 767px) {
  .it-hero-2-ptb .it-hero-title {
    font-size: 40px;
  }

  .it-hero-2-ptb .it-hero-title br {
    display: none;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-hero-2-ptb .it-hero-title {
    font-size: 49px;
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-hero-2-ptb .it-hero-text p {
    padding-right: 140px;
  }

  .it-hero-2-ptb .it-hero-text p br {
    display: none;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-2-ptb .it-hero-text p {
    font-size: 16px;
    padding-right: 100px;
  }

  .it-hero-2-ptb .it-hero-text p br {
    display: none;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-2-ptb .it-hero-text p {
    font-size: 14px;
    padding-right: 100px;
  }

  .it-hero-2-ptb .it-hero-text p br {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-hero-2-ptb .it-hero-text p {
    font-size: 16px;
  }

  .it-hero-2-ptb .it-hero-text p br {
    display: none;
  }
}

@media (max-width: 767px) {
  .it-hero-2-ptb .it-hero-text p {
    font-size: 14px;
  }

  .it-hero-2-ptb .it-hero-text p br {
    display: none;
  }
}

.it-hero-2-thumb {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  mask-size: contain;
  mask-repeat: no-repeat;
  z-index: 2;
  display: inline-block;
  width: auto;
  height: auto;
  max-width: 100%;
  overflow: hidden;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-hero-2-thumb img {
    max-width: 100%;
  }
}

.it-hero-2-thumb-box {
  margin-right: -80px;
  transform: translateX(30px);
  animation: ittranslateY2 4s infinite alternate;
}

@media only screen and (min-width: 1600px) and (max-width: 1800px) {
  .it-hero-2-thumb-box {
    margin-left: -50px;
    transform: scale(0.9);
    transform: translateX(0px);
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-hero-2-thumb-box {
    transform: translateX(-100px) scale(0.9);
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-2-thumb-box {
    margin-left: -100px;
    transform: scale(0.85);
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-2-thumb-box {
    transform: translateX(-90px) scale(0.9);
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-hero-2-thumb-box {
    margin-right: 0;
  }
}

.it-hero-2-shape-1 {
  position: absolute;
  top: -11px;
  left: -15px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-hero-2-shape-1 {
    top: -12px;
    left: 22px;
  }
}

.it-hero-2-shape-1 img {
  max-width: inherit;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-hero-2-shape-1 img {
    max-width: 100%;
  }
}

.it-hero-2-shape-2 {
  position: absolute;
  bottom: 0;
  left: 0;
}

.it-hero-2-shape-3 {
  position: absolute;
  left: 4%;
  bottom: 0;
  z-index: -1;
  animation: ittranslateX2 9s infinite alternate;
}

.it-hero-2-shape-31 {
  position: absolute;
  right: 13%;
  bottom: 72%;
  z-index: 9999;
  /* animation: ittranslateX2 9s infinite alternate; */
  width: 200px;
}

.it-hero-2-shape-4 {
  position: absolute;
  right: 0;
  top: 0;
  z-index: -1;
}

.it-hero-2-shape-5 {
  position: absolute;
  bottom: 15%;
  left: 43%;
  animation: ittranslateX2 2s infinite alternate;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-2-shape-5 {
    transform: scale(0.6);
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-2-shape-5 {
    transform: scale(0.4);
  }
}

.it-hero-2-shape-6 {
  position: absolute;
  top: 11%;
  left: 54%;
  animation: moving 9s linear infinite;
}

.it-hero-2-shape-7 {
  position: absolute;
  top: 3%;
  right: -7%;
  animation: itswing 0.9s forwards infinite alternate;
  transform-origin: top right;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-2-shape-7 {
    top: -8%;
  }
}

.it-hero-3-bg {
  height: 795px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
  z-index: 2;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-3-bg {
    height: 700px;
    background-position: center;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-3-bg {
    height: 650px;
    background-position: center;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-hero-3-bg {
    height: 600px;
    background-position: center;
  }
}

@media (max-width: 767px) {
  .it-hero-3-bg {
    height: 580px;
    background-position: center;
  }
}

.it-hero-3-bg::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: -1;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.9) 0%, rgba(255, 255, 255, 0.1) 100%);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-3-bg .it-hero-title {
    font-size: 66px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-3-bg .it-hero-title {
    font-size: 62px;
  }

  .it-hero-3-bg .it-hero-title br {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-hero-3-bg .it-hero-title {
    font-size: 59px;
  }

  .it-hero-3-bg .it-hero-title br {
    display: none;
  }
}

@media (max-width: 767px) {
  .it-hero-3-bg .it-hero-title {
    font-size: 40px;
  }

  .it-hero-3-bg .it-hero-title br {
    display: none;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-hero-3-bg .it-hero-title {
    font-size: 53px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-3-bg .it-hero-2-text p {
    font-size: 16px;
    padding-right: 100px;
  }

  .it-hero-3-bg .it-hero-2-text p br {
    display: none;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-3-bg .it-hero-2-text p {
    font-size: 14px;
    padding-right: 100px;
  }

  .it-hero-3-bg .it-hero-2-text p br {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-hero-3-bg .it-hero-2-text p {
    font-size: 16px;
  }

  .it-hero-3-bg .it-hero-2-text p br {
    display: none;
  }
}

@media (max-width: 767px) {
  .it-hero-3-bg .it-hero-2-text p {
    font-size: 16px;
  }

  .it-hero-3-bg .it-hero-2-text p br {
    display: none;
  }
}

.it-hero-3-button .it-btn.black-bg {
  margin-left: 20px;
}

@media (max-width: 767px) {
  .it-hero-3-button .it-btn.black-bg {
    margin-left: 0;
    margin-top: 20px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-hero-3-button .it-btn.black-bg {
    margin-left: 20px;
    margin-top: 0px;
  }
}

.it-hero-3-shape-1 {
  position: absolute;
  bottom: -3%;
  left: 0;
  animation: ittranslateY2 3s infinite alternate;
  z-index: -1;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-3-shape-1 {
    bottom: -5%;
    left: -2%;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-hero-3-shape-1 {
    bottom: -5%;
    left: -2%;
  }
}

@keyframes rocketDiagonal {
  0% {
    transform: translate(0px, 0px);
    /* Start center */
  }

  50% {
    transform: translate(35px, -25px);
    /* Move RIGHT + UP */
  }

  100% {
    transform: translate(-35px, 50px);
    /* Move LEFT + DOWN */
  }
}




.it-hero-3-shape-22 {
  position: absolute;
  top: 10%;
  left: 2%;
  animation: rocketDiagonal 4s infinite alternate;
}

.it-hero-3-shape-2 {
  position: absolute;
  top: 10%;
  left: 2%;
  animation: ittranslateX2 4s infinite alternate;
}

@media only screen and (min-width: 1600px) and (max-width: 1800px) {
  .it-hero-3-shape-2 {
    top: 5%;
    transform: scale(0.6);
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-hero-3-shape-2 {
    top: 5%;
    transform: scale(0.7);
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-3-shape-2 {
    top: 1%;
    transform: scale(0.6);
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-3-shape-2 {
    top: 1%;
    transform: scale(0.5);
  }
}

.it-hero-3-shape-3 {
  position: absolute;
  right: 47%;
  top: 6%;
  animation: itswing 0.9s forwards infinite alternate;
  transform-origin: top right;
}

@media only screen and (min-width: 1600px) and (max-width: 1800px) {
  .it-hero-3-shape-3 {
    top: 5%;
    transform: scale(0.8);
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-hero-3-shape-3 {
    top: 5%;
    transform: scale(0.7);
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-hero-3-shape-3 {
    top: 5%;
    transform: scale(0.6);
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-hero-3-shape-3 {
    top: 5%;
    right: 35%;
    transform: scale(0.6);
  }
}

/*----------------------------------------*/
/*  15. feature css start
/*----------------------------------------*/
.it-feature-item:hover .it-feature-shape-1 span {
  color: var(--it-theme-1);
}

.it-feature-item:hover .it-feature-thumb img {
  transform: scale(1.1);
}

.it-feature-border {
  border-bottom: 1px dashed var(--it-theme-2);
}

.it-feature-title {
  font-size: 22px;
  font-style: normal;
  transition: 0.3s;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-feature-title {
    font-size: 20px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-feature-title {
    font-size: 19px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-feature-title {
    font-size: 20px;
  }
}

.it-feature-title:hover a {
  color: var(--it-theme-1);
}

.it-feature-thumb {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  mask-size: contain;
  mask-repeat: no-repeat;
  z-index: 2;
  display: inline-block;
  width: auto;
  height: auto;
  max-width: 100%;
  overflow: hidden;
}

.it-feature-thumb img {
  transition: 0.5s;
}

.it-feature-shape-1 {
  position: absolute;
  top: -15px;
  left: 0;
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-feature-shape-1 {
    display: none;
  }
}

.it-feature-shape-1 span {
  color: var(--it-common-black);
  transition: 0.3s;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-feature-shape-1 span svg {
    width: 256px;
    height: 245px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-feature-shape-1 span svg {
    width: 210px;
    height: 202px;
  }
}

.it-feature-2-thumb {
  mask-image: url(../img/feature/thumb-2-1.png);
  -webkit-mask-image: url(../img/feature/thumb-2-1.png);
  height: 100%;
  width: auto;
  mask-repeat: no-repeat;
  background-position: center center;
  overflow: hidden;
  display: inline-block;
  position: relative;
  z-index: 2;
}

.it-feature-2-thumb img {
  width: 303px;
  height: 300px;
}

/*----------------------------------------*/
/*  29. testimonial css start
/*----------------------------------------*/
.it-testimonial-bg {
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
}

@media (max-width: 767px) {
  .it-testimonial-bg {
    display: none;
  }
}

.it-testimonial-pt {
  padding-top: 50px;
  padding-bottom: 80px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .it-testimonial-pt {
    padding-top: 70px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-testimonial-pt {
    padding-top: 30px;
    padding-bottom: 30px;
  }
}

@media (max-width: 767px) {
  .it-testimonial-pt {
    padding-top: 30px;
    padding-bottom: 30px;
  }
}

.it-testimonial-avata {
  mask-image: url(../img/testimonial/png.png);
  -webkit-mask-image: url(../img/testimonial/png.png);
  height: 100%;
  width: auto;
  mask-repeat: no-repeat;
  background-position: center center;
  overflow: hidden;
  margin-right: 20px;
}

.edumaintab {
  font-family: "MATTEKEK";
}

.it-testimonial-rate i {
  color: yellow;
  display: inline-block;
  margin: 0 1px;
  font-size: 15px;
}

.it-Teachers-rate {
  color: yellow;
  display: inline-block;
  margin: 0 1px;
  font-size: 13px;
}

.it-testimonial-section-title {
  /* padding-bottom: 60px; */
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-testimonial-section-title {
    padding-bottom: 26px;
  }
}

.it-testimonial-text p {
  max-width: 880px;
  margin: 0 auto;
  color: var(--it-common-black);
  margin-bottom: 15px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-testimonial-text p {
    font-size: 14px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-testimonial-text p {
    font-size: 14px;
    max-width: 660px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-testimonial-text p {
    font-size: 14px;
    width: auto;
  }
}

@media (max-width: 767px) {
  .it-testimonial-text p {
    font-size: 13px;
    width: auto;
  }
}

.it-testimonial-author-info h6 {
  font-size: 22px;
  color: var(--it-theme-1);
  padding-bottom: 2px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-testimonial-author-info h6 {
    font-size: 18px;
  }
}

.it-testimonial-author-info span {
  color: var(--it-common-black);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-testimonial-author-info span {
    font-size: 14px;
  }
}

.it-testimonial-shape-1 {
  position: absolute;
  top: 10%;
  left: -1%;
  animation: itswing 1s forwards infinite alternate;
  transform-origin: top left;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-testimonial-shape-1 {
    transform: scale(0.6);
  }
}

.it-testimonial-shape-2 {
  position: absolute;
  right: 3%;
  bottom: -1%;
  animation: itswing 0.9s forwards infinite alternate;
  transform-origin: top right;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-testimonial-shape-2 {
    transform: scale(0.6);
  }
}

.it-testimonial-shape-3 {
  position: absolute;
  right: 24%;
  bottom: 23%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-testimonial-shape-3 {
    transform: scale(0.6);
  }
}

.it-testimonial-shape-3 span {
  color: var(--it-theme-2);
}

.it-testimonial-arrow-box {
  margin-top: 15px;
}

.it-testimonial-arrow-box button {
  height: 62px;
  width: 62px;
  line-height: 62px;
  border-radius: 50%;
  background-color: var(--it-theme-2);
}

.it-testimonial-arrow-box button i {
  transition: 0.3s;
  font-size: 32px;
  color: var(--it-theme-2);
}

.it-testimonial-arrow-box button i:hover {
  font-size: 32px;
  color: var(--it-theme-2);
}

.it-testimonial-arrow-box button:hover {
  background-color: var(--it-theme-1);
}

.it-testimonial-arrow-box button.testimonial-prev {
  position: absolute;
  z-index: 9;
  left: -7.8%;
  bottom: 41%;
}

.it-testimonial-arrow-box button.testimonial-next {
  position: absolute;
  z-index: 9;
  right: -7.8%;
  bottom: 41%;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-testimonial-2-box {
    margin-bottom: 50px;
  }
}

.it-testimonial-2-item-box {
  border-radius: 10px;
  padding: 55px 65px;
  margin-right: 80px;
  background-color: var(--it-common-white);
  margin-left: -222px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-testimonial-2-item-box {
    padding: 35px 35px;
    margin-right: 80px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-testimonial-2-item-box {
    margin-left: 0;
  }
}

@media (max-width: 767px) {
  .it-testimonial-2-item-box {
    margin-left: 0;
    margin-right: 0;
    padding: 25px;
  }
}

.it-testimonial-2-text p {
  color: var(--it-common-black);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .it-testimonial-2-text p {
    font-size: 14px;
  }
}

@media (max-width: 767px) {
  .it-testimonial-2-text p {
    font-size: 13px;
  }
}

.it-testimonial-2-thumb {
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid var(--it-theme-1);
  position: relative;
}

.it-testimonial-2-thumb::after {
  position: absolute;
  top: 0;
  left: -80%;
  z-index: 2;
  display: block;
  content: "";
  width: 50%;
  height: 100%;
  background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.3)));
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  -webkit-transform: skewX(-25deg);
  -ms-transform: skewX(-25deg);
  transform: skewX(-25deg);
  z-index: 1;
}

.it-testimonial-2-thumb img {
  width: 100%;
  border-radius: 14px;
  transition: 1.3s all ease;
}

.it-testimonial-2-thumb:hover::after {
  -webkit-animation: shine 1s;
  animation: shine 1s;
}

.it-testimonial-2-thumb:hover img {
  transform: scale(1.1);
  border-radius: 14px;
}

.it-testimonial-2-title {
  font-size: 45px;
}

.it-testimonial-2-title-box p {
  color: var(--it-common-black);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-testimonial-2-title-box p {
    font-size: 14px;
  }
}

.it-testimonial-2-author-title {
  font-size: 22px;
  padding-bottom: 10px;
}

.it-testimonial-2-author-info span {
  color: var(--it-theme-2);
}

.it-testimonial-2-quot {
  position: absolute;
  right: -1%;
  bottom: -7%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .it-testimonial-2-quot {
    transform: scale(0.6);
  }
}

.it-testimonial-2-active {
  margin: -30px;
  padding: 30px;
}

.it-testimonial-2-shape-1 {
  position: absolute;
  bottom: -7%;
  left: 35%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .it-testimonial-2-shape-1 {
    transform: scale(0.6);
  }
}

.it-testimonial-2-shape-2 {
  position: absolute;
  top: 7%;
  left: 11%;
  animation: itswing 0.9s forwards infinite alternate;
  transform-origin: top right;
}

@media only screen and (min-width: 1600px) and (max-width: 1800px) {
  .it-testimonial-2-shape-2 {
    left: 4%;
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-testimonial-2-shape-2 {
    top: 6%;
    left: -2%;
  }
}

.it-testimonial-2-shape-3 {
  position: absolute;
  bottom: 14%;
  left: 3%;
  animation: moving 9s linear infinite;
}

@media only screen and (min-width: 1600px) and (max-width: 1800px) {
  .it-testimonial-2-shape-3 {
    left: 0%;
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-testimonial-2-shape-3 {
    left: 0%;
    bottom: 4%;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-testimonial-2-shape-3 {
    left: 0%;
    bottom: 4%;
  }
}

.it-testimonial-2-shape-4 {
  position: absolute;
  top: 10%;
  right: 4%;
  animation: itrotate 3s ease-in-out 3s infinite alternate forwards;
}

@media only screen and (min-width: 1600px) and (max-width: 1800px) {
  .it-testimonial-2-shape-4 {
    right: 1%;
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-testimonial-2-shape-4 {
    top: 2%;
    right: 1%;
    transform: scale(0.7);
  }
}

.it-testimonial-2-shape-5 {
  position: absolute;
  right: 0;
  bottom: 0;
}

.it-testimonial-style-2 .it-testimonial-text p {
  color: var(--it-common-white);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-testimonial-style-2 .it-testimonial-text p {
    color: var(--it-common-white);
  }
}

.it-testimonial-style-2 .it-section-title {
  color: var(--it-common-white);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-testimonial-style-2 .it-section-title {
    color: var(--it-common-black);
  }
}

.it-testimonial-style-2 .it-testimonial-author-info h6 {
  color: var(--it-common-white);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-testimonial-style-2 .it-testimonial-author-info h6 {
    color: var(--it-common-white);
  }
}

.it-testimonial-style-2 .it-testimonial-author-info span {
  color: #FFFFFF;
}

.it-testimonial-dots {
  position: absolute;
  top: 50%;
  right: 2%;
  display: flex;
  flex-direction: column;
  transform: translateY(-50%);
}

.it-testimonial-dots .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
  border-radius: 50%;
  background-color: transparent;
  opacity: 1;
  margin: 5px 0px;
  transition: 0.3s;
  background-color: var(--it-theme-2);
  margin: 10px 0;
  position: relative;
}

.it-testimonial-dots .swiper-pagination-bullet::after {
  position: absolute;
  content: "";
  top: 50%;
  left: 50%;
  height: 300%;
  width: 300%;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid var(--it-theme-2);
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
}

.it-testimonial-dots .swiper-pagination-bullet-active {
  background-color: var(--it-theme-2);
}

.it-testimonial-dots .swiper-pagination-bullet-active::after {
  opacity: 1;
  visibility: visible;
}

.it-testimonial-2-dots {
  position: absolute;
  top: 50%;
  right: 2%;
  display: flex;
  flex-direction: column;
  transform: translateY(-50%);
}

@media (max-width: 767px) {
  .it-testimonial-2-dots {
    display: none;
  }
}

.it-testimonial-2-dots .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
  border-radius: 50%;
  background-color: transparent;
  opacity: 1;
  margin: 5px 0px;
  transition: 0.3s;
  background-color: var(--it-theme-2);
  margin: 10px 0;
  position: relative;
}

.it-testimonial-2-dots .swiper-pagination-bullet::after {
  position: absolute;
  content: "";
  top: 50%;
  left: 50%;
  height: 300%;
  width: 300%;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid var(--it-theme-2);
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
}

.it-testimonial-2-dots .swiper-pagination-bullet-active {
  background-color: var(--it-theme-2);
}

.it-testimonial-2-dots .swiper-pagination-bullet-active::after {
  opacity: 1;
  visibility: visible;
}

/*----------------------------------------*/
/*  17. funfact css start
/*----------------------------------------*/
@media (max-width: 767px) {
  .it-funfact-wrap {
    flex-wrap: wrap;
  }
}

@media (max-width: 767px) {
  .it-funfact-item {
    width: 100%;
    margin-bottom: 40px;
    justify-content: center;
  }
}

.it-funfact-ptb {
  padding: 86px 0;
}

.it-funfact-ptb-2 {
  padding-top: 220px;
  padding-bottom: 100px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-funfact-ptb-2 {
    padding-top: 120px;
  }
}

.it-funfact-icon {
  margin-right: 15px;
}

.it-funfact-icon span {
  color: var(--it-theme-2);
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-funfact-icon span svg {
    width: 45px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-funfact-thumb-box {
    text-align: center;
  }
}

.it-funfact-content h6 {
  font-size: 45px;
  margin-bottom: 0px;
  color: #FFF;
  line-height: 1;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-funfact-content h6 {
    font-size: 38px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-funfact-content h6 {
    font-size: 32px;
  }
}

@media (max-width: 767px) {
  .it-funfact-content h6 {
    font-size: 38px;
  }
}

.it-funfact-content h6 i {
  font-style: normal;
}

.it-funfact-content span {
  font-family: var(--it-ff-schoolbell);
  color: var(--it-common-white);
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-funfact-content span {
    font-size: 14px;
  }
}

.it-funfact-shape-1 {
  position: absolute;
  left: 0;
  bottom: 0;
}

.it-funfact-shape-2 {
  position: absolute;
  top: 0;
  left: 0;
}

.it-funfact-2-ptb {
  padding-top: 220px;
  padding-bottom: 130px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 767px) {
  .it-funfact-2-ptb .it-funfact-icon span svg {
    width: 40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-funfact-2-left {
    margin-bottom: 50px;
  }
}

.it-funfact-2-title-box p {
  color: var(--it-common-black);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-funfact-2-title-box p {
    font-size: 14px;
  }
}

.it-funfact-2-wrap {
  margin-right: 57px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-funfact-2-wrap {
    margin-right: 0;
  }
}

.it-funfact-2-wrap .it-funfact-item {
  padding: 31px 25px;
  border-radius: 5px;
  background-color: var(--it-common-black);
  margin-bottom: 30px;
}

.it-funfact-2-wrap .it-funfact-content span {
  font-size: 19px;
  font-family: var(--it-ff-body);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 767px) {
  .it-funfact-2-wrap .it-funfact-content span {
    font-size: 13px;
  }
}

.it-funfact-2-thumb {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  mask-size: contain;
  mask-repeat: no-repeat;
  z-index: 1;
  display: inline-block;
  width: auto;
  height: auto;
  max-width: 100%;
  overflow: hidden;
}

.it-funfact-2-thumb img {
  width: 624px;
}

.it-funfact-2-shape-1 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  animation: itupdown 0.8s infinite alternate;
}

.it-funfact-2-shape-2 {
  position: absolute;
  top: -1%;
  left: -1%;
  z-index: -1;
}

.it-funfact-2-shape-3 {
  position: absolute;
  top: 23%;
  left: -4%;
  animation: zoom 7s infinite;
}

.it-funfact-2-shape-4 {
  position: absolute;
  right: -20%;
  top: 5%;
  animation: itrotate 3s ease-in-out 3s infinite alternate forwards;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-funfact-2-shape-4 {
    right: 0;
    top: -20%;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-funfact-2-shape-4 {
    right: 0;
    top: -20%;
  }
}

.it-funfact-style-2.it-funfact-ptb {
  padding-bottom: 200px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .it-funfact-style-2.it-funfact-ptb {
    padding-bottom: 140px;
  }
}

@media (max-width: 767px) {
  .it-funfact-style-2.it-funfact-ptb {
    padding-bottom: 86px;
  }
}

/*----------------------------------------*/
/*  05. brand css start
/*----------------------------------------*/
.it-brand-height {
  padding: 49px 0;
}

.it-brand-shape-1 {
  position: absolute;
  top: 50%;
  right: 15%;
  transform: translateY(-50%);
}

/*----------------------------------------*/
/*  28. team css start
/*----------------------------------------*/
.it-team-item:hover .it-team-icon span {
  background-color: var(--it-theme-1);
}

.it-team-item:hover .it-team-icon span i {
  transform: rotate(225deg);
}

.it-team-item:hover .it-team-social {
  bottom: 0;
  opacity: 1;
  visibility: visible;
}

.it-team-item:hover .it-team-thumb::after {
  -webkit-animation: shine 1s;
  animation: shine 1s;
}

.it-team-item:hover .it-team-thumb img {
  transform: scale(1.2);
}

.it-team-thumb {
  margin-bottom: 25px;
  overflow: hidden;
  border-radius: 10px;
  position: relative;
}

.it-team-thumb::after {
  position: absolute;
  top: 0;
  left: -80%;
  z-index: 2;
  display: block;
  content: "";
  width: 50%;
  height: 100%;
  background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.3)));
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  -webkit-transform: skewX(-25deg);
  -ms-transform: skewX(-25deg);
  transform: skewX(-25deg);
  z-index: 1;
}

.it-team-thumb img {
  width: 100%;
  border-radius: 10px;
  transition: 1.3s all ease;
}

.it-team-icon {
  position: absolute;
  bottom: -20px;
  right: 30px;
  z-index: 3;
}

.it-team-icon span {
  height: 40px;
  width: 40px;
  border-radius: 50%;
  display: inline-block;
  line-height: 44px;
  text-align: center;
  background-color: var(--it-theme-2);
  color: var(--it-common-white);
  transition: 0.3s;
}

.it-team-icon span i {
  font-weight: 700;
  font-size: 24px;
  transition: 0.3s;
}

.it-team-social {
  position: absolute;
  bottom: -7%;
  right: 30px;
  padding-top: 7px;
  padding-bottom: 20px;
  width: 40px;
  border-radius: 30px 30px 0 0;
  background-color: var(--it-theme-1);
  text-align: center;
  transition: 0.4s;
  z-index: 2;
  opacity: 0;
  visibility: hidden;
}

.it-team-social a {
  padding: 7px 0;
  display: block;
  color: var(--it-common-white);
  line-height: 0;
}

.it-team-title {
  font-size: 22px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-team-title {
    font-size: 20px;
  }
}

.it-team-title a {
  transition: 0.3s;
}

.it-team-title a:hover {
  color: var(--it-theme-1);
}

.it-team-content span {
  color: var(--it-theme-1);
  font-family: var(--it-ff-schoolbell);
}

.it-team-2-item {
  padding: 20px 20px;
  border-radius: 10px;
  position: relative;
  border: 1px solid var(--it-theme-2);
  /* background-color: var(--it-theme-2); */
  transition: 0.5s;
  height: 100%;
}

.it-team-2-item:hover {
  /* background-color: var(--it-theme-2); */
  border: 1px solid var(--it-theme-1);
}

.it-team-2-item:hover .it-team-2-author-info span {
  color: var(--it-common-white);
}

.it-team-2-item:hover .it-team-2-thumb::after {
  height: 100%;
  opacity: 1;
  visibility: visible;
}

.it-team-2-item:hover .it-team-2-social {
  top: 50%;
  opacity: 1;
  visibility: visible;
  transform: translateY(-50%);
}

.it-team-2-item:hover .it-team-2-social a {
  transform: scale(1);
}

@media (max-width:768px) {
  .it-team-2-item {
    padding: 30px 20px;
    border-radius: 10px;
    position: relative;
    /* border: 1px solid var(--it-theme-2); */
    /* background-color: var(--it-theme-1); */
    transition: 0.5s;
    height: 100% !important;
  }
}

.it-team-2-thumb {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  mask-size: contain;
  mask-repeat: no-repeat;
  z-index: 2;
  display: inline-block;
  width: auto;
  height: auto;
  max-width: 100%;
  overflow: hidden;
}

.it-team-2-thumb img {
  width: 294px;
}

.it-team-2-thumb::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  height: 40%;
  width: 100%;
  opacity: 0;
  visibility: hidden;
  transition: 0.5s;
  background-color: rgba(2, 20, 23, 0.6);
}

.it-team-2-social {
  position: absolute;
  top: 0%;
  left: 0;
  right: 0;
  z-index: 4;
  transition: 0.5s;
  opacity: 0;
  visibility: visible;
}

.it-team-2-social a {
  height: 52px;
  width: 52px;
  line-height: 56px;
  text-align: center;
  font-size: 16px;
  border-radius: 50%;
  color: var(--it-theme-2);
  background-color: var(--it-common-white);
  display: inline-block;
  margin: 0 3px;
  transition: 0.7s;
  transform: scale(0);
}

.it-team-2-social a:hover {
  color: var(--it-common-white);
  background-color: var(--it-theme-2);
}

.it-team-2-author-info {
  border-radius: 10px;
  /* padding: 19px 20px; */
  /* background-color: var(--it-common-white); */
}


.cat-empires:hover {
  background-color:
    #b4433c47 !important;
}

.cat-context:hover {
  background-color: #d28d8654 !important;
}

.cat-creativity:hover {
  background-color: #944e7847 !important;
}

.cat-economics:hover {
  background-color:
    #cb7f5952 !important;
}

.cat-geography:hover {
  background-color: #697e374f !important;
}

.cat-technology:hover {
  background-color: #c7b14b40 !important;
}

.cat-medicine:hover {
  background-color: #6fae994a !important;
}

.cat-father:hover {
  background-color:
    #78b2bc38 !important;
}

.cat-connection:hover {
  background-color: #43508947 !important;
}

.cat-trust:hover {
  background-color: #6a4b8e42 !important;
}

.coming-soon-btn {
  background: #ccc !important;
  color: #666 !important;
  pointer-events: none;
  /* 🔥 disabled */
  cursor: not-allowed;
  border: none;
  opacity: 0.7;
}

/* .jam-card-box:hover{
    background-color: rgb(252, 179, 252);
} */
.it-team-2-author-info span {
  transition: 0.5s;
  color: var(--it-common-white);
}

.it-team-2-title {
  font-size: 22px;
  margin-bottom: 5px;
  color: white;
}

.it-team-2-title a {
  transition: 0.3s;
}

.it-team-2-title a:hover {
  color: var(--it-theme-1);
}

.it-team-2-shape-1 {
  position: absolute;
  bottom: 32%;
  right: 9%;
  animation: rotate2 4s linear infinite;
}

.it-team-2-shape-2 {
  position: absolute;
  top: -1.5%;
  left: 50%;
  transform: translateX(-50%);
}

.it-team-2-shape-2>img {
  max-width: inherit;
}

.it-team-2-shape-3 {
  position: absolute;
  top: 5%;
  left: 1%;
  animation: zoom 7s infinite;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-team-2-shape-3 {
    transform: scale(0.7);
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-team-2-shape-3 {
    transform: scale(0.5);
  }
}

.it-team-2-shape-4 {
  position: absolute;
  top: 2%;
  right: 8%;
  animation: rotate2 4s linear infinite;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-team-2-shape-4 {
    transform: scale(0.7);
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-team-2-shape-4 {
    transform: scale(0.5);
  }
}

.it-team-dots .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
  border-radius: 50%;
  background-color: transparent;
  opacity: 1;
  margin: 5px 0px;
  transition: 0.3s;
  background-color: var(--it-theme-2);
  margin: 0 10px;
  position: relative;
}

.it-team-dots .swiper-pagination-bullet::after {
  position: absolute;
  content: "";
  top: 50%;
  left: 50%;
  height: 300%;
  width: 300%;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  border: 1px solid var(--it-theme-2);
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
}

.it-team-dots .swiper-pagination-bullet-active {
  background-color: var(--it-theme-2);
}

.it-team-dots .swiper-pagination-bullet-active::after {
  opacity: 1;
  visibility: visible;
}

.it-teacher-details-wrap {
  background-color: #E7F8FE;
  padding: 50px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .it-teacher-details-wrap {
    font-size: 14px;
    padding: 50px 20px;
  }
}

@media (max-width: 767px) {
  .it-teacher-details-wrap {
    font-size: 14px;
    padding: 50px 15px;
  }
}

.it-teacher-details-left-thumb img {
  width: 100%;
  margin-bottom: 30px;
}

.it-teacher-details-left-social {
  padding-bottom: 30px;
  margin-bottom: 30px;
  border-bottom: 1px solid #898989;
}

.it-teacher-details-left-social a {
  height: 45px;
  width: 45px;
  border-radius: 50%;
  line-height: 45px;
  text-align: center;
  display: inline-block;
  margin: 0px 6px;
  color: var(--it-theme-1);
  background-color: var(--it-common-white);
  transition: 0.3s;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-teacher-details-left-social a {
    height: 35px;
    width: 35px;
    margin: 0 2px;
    line-height: 35px;
  }
}

.it-teacher-details-left-social a:hover {
  color: var(--it-common-white);
  background-color: var(--it-theme-1);
}

.it-teacher-details-left-info {
  margin-bottom: 40px;
}

.it-teacher-details-left-info ul li {
  list-style-type: none;
  position: relative;
  padding-left: 30px;
}

.it-teacher-details-left-info ul li a {
  color: var(--it-common-black);
  font-size: 15px;
  font-weight: 400;
  line-height: 1;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-teacher-details-left-info ul li a {
    font-size: 14px;
  }
}

.it-teacher-details-left-info ul li i {
  color: var(--it-theme-1);
  position: absolute;
  top: 8px;
  left: 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-teacher-details-left {
    margin-bottom: 50px;
  }
}

.it-teacher-details-right {
  padding: 60px;
  margin-left: 20px;
  background-color: var(--it-common-white);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-teacher-details-right {
    padding: 60px 40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-teacher-details-right {
    padding: 60px 15px;
    margin-left: 0;
    margin-bottom: 50px;
  }
}

.it-teacher-details-right .it-progress-bar-wrap h4 {
  text-transform: uppercase;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-teacher-details-right .it-progress-bar-wrap h4 {
    font-size: 18px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-teacher-details-right .it-progress-bar-item label {
    font-size: 14px;
  }
}

.it-teacher-details-right-title-box {
  margin-bottom: 40px;
}

.it-teacher-details-right-title-box h4 {
  color: #0E2A46;
  font-size: 30px;
  font-weight: 700;
  text-transform: uppercase;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .it-teacher-details-right-title-box h4 {
    font-size: 24px;
  }
}

@media (max-width: 767px) {
  .it-teacher-details-right-title-box h4 {
    font-size: 19px;
  }
}

.it-teacher-details-right-title-box span {
  color: var(--it-theme-1);
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  text-transform: uppercase;
  margin-bottom: 30px;
  display: inline-block;
  font-family: var(--it-ff-schoolbell);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-teacher-details-right-title-box p {
    font-size: 14px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-teacher-details-right-content p {
    font-size: 14px;
  }
}

@media (max-width: 767px) {
  .it-teacher-details-right-content h4 {
    font-size: 20px;
  }
}

.it-teacher-details-right .it-progress-bar-wrap .it-progress-bar-item {
  padding: 5px 0;
}

@media (max-width: 767px) {
  .it-teacher-details-right .it-progress-bar-wrap h4 {
    margin-bottom: 10px;
  }
}

.it-teacher-details-right .it-progress-bar-wrap .it-progress-bar .progress-bar span {
  top: -22px;
}

@media (max-width: 767px) {
  .it-teacher-details-right .it-progress-bar-wrap .it-progress-bar .progress-bar span {
    top: -18px;
    font-size: 14px;
  }
}

.it-progress-bar-item {
  padding: 30px 0px;
  overflow: hidden;
  padding-bottom: 5px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-progress-bar-item {
    padding-top: 20px;
  }
}

.it-progress-bar-item label {
  font-size: 17px;
  font-weight: 600;
  line-height: 1;
  margin-bottom: 12px;
  display: inline-block;
  color: var(--it-common-black);
}

.it-progress-bar .progress {
  overflow: visible;
  border-radius: 10px;
  background: rgba(245, 154, 49, 0.1);
  height: 10px;
}

.it-progress-bar .progress-bar {
  background-color: var(--it-theme-1);
  border-radius: 30px;
  position: relative;
  overflow: visible;
  height: 100%;
  border-radius: 10px;
  top: 0;
}

.it-progress-bar .progress-bar span {
  position: absolute;
  right: 0;
  top: -30px;
  transform: translateY(-50%);
  font-size: 19px;
  font-weight: 400;
  line-height: 1;
  color: var(--it-common-black);
}

/*----------------------------------------*/
/*  08. choose css start
/*----------------------------------------*/
.it-choose-ptb {
  padding: 150px 0;
  margin-top: 80px;
  margin-bottom: 80px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-choose-ptb {
    padding: 100px 0;
    margin-top: 0;
    margin-bottom: 0px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-choose-content {
    margin-bottom: 50px;
  }
}

.it-choose-thumb {
  mask-image: url(../img/choose/png.png);
  -webkit-mask-image: url(../img/choose/png.png);
  height: 100%;
  width: 100%;
  mask-repeat: no-repeat;
  background-position: center center;
  overflow: hidden;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-choose-text p {
    font-size: 14px;
  }
}

.it-choose-shape-1 {
  position: absolute;
  top: -34%;
  left: -21%;
  z-index: -1;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-choose-shape-1 {
    transform: scale(0.9);
  }
}

.it-choose-shape-2 {
  position: absolute;
  top: 3%;
  left: 49%;
  animation: itswing 0.9s forwards infinite alternate;
  transform-origin: top right;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-choose-shape-2 {
    transform: scale(0.5);
  }
}

.it-choose-shape-3 {
  position: absolute;
  top: 0;
  left: 0;
  transform: scale(1.08);
}

.it-choose-shape-4 {
  position: absolute;
  bottom: 23%;
  right: -1%;
  animation: rotate2 4s linear infinite;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-choose-shape-4 {
    transform: scale(0.7);
  }
}

.it-choose-shape-5 {
  position: absolute;
  bottom: -4%;
  left: -16%;
  animation: itswing 1.4s forwards infinite alternate;
  transform-origin: top right;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-choose-shape-5 {
    transform: scale(0.7);
  }
}

.it-choose-shape-6 {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
}

.it-choose-shape-7 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  animation: moving 9s linear infinite;
}

.it-choose-shape-8 {
  position: absolute;
  top: -34px;
  left: -31px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-choose-shape-8 {
    top: -10px;
    left: -5px;
    transform: scale(1.06);
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-choose-shape-8 {
    top: 0;
    left: 0;
    transform: scale(1.07);
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-choose-shape-8 {
    top: -28px;
    left: 0;
    transform: scale(0.96);
  }
}

@media (max-width: 767px) {
  .it-choose-shape-8 {
    top: 0;
    left: 0;
    transform: scale(1.08);
  }
}

.it-choose-shape-9 {
  position: absolute;
  top: -11%;
  left: 0;
  z-index: -1;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-choose-shape-9 {
    top: -9%;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-choose-shape-9 {
    top: -7%;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-choose-shape-9 {
    top: -6%;
  }
}

.it-choose-shape-10 {
  position: absolute;
  bottom: -10%;
  left: 0;
}

.it-choose-2-thumb {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  mask-size: contain;
  mask-repeat: no-repeat;
  z-index: 2;
  display: inline-block;
  width: auto;
  height: auto;
  max-width: 100%;
  overflow: hidden;
}

.it-choose-2-thumb-box {
  margin-left: 90px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-choose-2-thumb-box {
    margin-left: 0;
  }
}

.it-choose-2-icon {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  text-align: center;
  transform: translateY(-50%);
}

.it-choose-2-icon a {
  display: inline-block;
  height: 80px;
  line-height: 77px;
  width: 80px;
  border-radius: 50%;
  font-size: 30px;
  text-align: center;
  border: 3px solid var(--it-common-black);
  color: var(--it-common-black);
}

@media (max-width: 767px) {
  .it-choose-2-icon a {
    height: 60px;
    line-height: 57px;
    width: 60px;
    font-size: 20px;
  }
}

.it-choose-2-icon a i {
  display: inline-block;
  padding-left: 8px;
}

@media (max-width: 767px) {
  .it-choose-2-icon a i {
    padding-left: 3px;
  }
}

/*----------------------------------------*/
/*  07. checkout css start
/*----------------------------------------*/
/* 17. Checkout */
.coupon-accordion h3 {
  background-color: #f7f7f7;
  border-top: 3px solid var(--it-theme-1);
  font-size: 14px;
  font-weight: 400;
  margin: 0 0 25px;
  padding: 1em 2em 1em 3.5em;
  position: relative;
  width: auto;
}

.coupon-accordion h3::before {
  content: "\f07b";
  left: 15px;
  top: 13px;
  position: absolute;
  color: var(--it-theme-1);
  font-family: "Font Awesome 5 Pro";
  font-weight: 700;
}

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

.coupon-accordion span:hover,
p.lost-password a:hover {
  color: var(--it-common-black);
}

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

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

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

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

.coupon-info p.form-row-first label span.required,
.coupon-info p.form-row-last label span.required {
  color: var(--it-theme-1);
  font-weight: 700;
}

.coupon-info p.form-row-first input,
.coupon-info p.form-row-last input {
  border: 1px solid #eaedff;
  height: 45px;
  margin: 0 0 14px;
  max-width: 100%;
  padding: 0 0 0 10px;
  width: 100%;
  outline: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
}

.coupon-info p.form-row-first input:focus,
.coupon-info p.form-row-last input:focus {
  border-color: var(--it-theme-1);
}

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

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

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

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

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

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

p.checkout-coupon input[type=text] {
  height: 45px;
  padding: 0 15px;
  width: 100%;
  border: 1px solid #eaedff;
  margin-bottom: 15px;
  outline: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
}

p.checkout-coupon input[type=text]:focus {
  border-color: var(--it-theme-1);
}

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

.checkbox-form h3 {
  border-bottom: 1px solid #eaedff;
  font-size: 26px;
  margin: 0 0 20px;
  padding-bottom: 10px;
  width: 100%;
}

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

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

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

.country-select label span.required,
.checkout-form-list label span.required {
  color: var(--it-theme-1);
}

.country-select .nice-select {
  border: 1px solid #eaedff;
  height: 45px;
  padding-left: 10px;
  width: 100%;
  color: #6f7172;
  margin-bottom: 20px;
}

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

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

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

.checkout-form-list input[type=text],
.checkout-form-list input[type=password],
.checkout-form-list input[type=email] {
  background: #ffffff;
  border: 1px solid #eaedff;
  border-radius: 0;
  height: 45px;
  padding: 0 0 0 10px;
  width: 100%;
  outline: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
}

.checkout-form-list input[type=text]:focus,
.checkout-form-list input[type=password]:focus,
.checkout-form-list input[type=email]:focus {
  border-color: var(--it-theme-1);
}

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

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

input[type=checkbox] {
  display: inline-block;
  margin-right: 10px;
  position: relative;
  top: -1px;
  height: 15px;
  width: 15px;
}

input[type=radio] {
  display: inline-block;
  margin-right: 10px;
  position: relative;
  top: -1px;
  height: 15px;
  width: 15px;
}

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

.create-account {
  display: none;
}

.ship-different-title h3 label {
  display: inline-block;
  margin-right: 20px;
  color: var(--it-common-black);
}

.order-notes textarea {
  border: 1px solid #eaedff;
  height: 120px;
  padding: 15px;
  width: 100%;
  outline: 0;
  resize: none;
}

.order-notes textarea:focus {
  border-color: var(--it-theme-1);
}

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

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

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

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

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

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

@media (max-width: 767px) {
  .your-order {
    padding: 15px;
  }
}

.your-order h3 {
  border-bottom: 1px solid #eaedff;
  font-size: 30px;
  margin: 0 0 20px;
  padding-bottom: 10px;
  width: 100%;
}

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

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

@media (max-width: 767px) {

  .your-order-table table th,
  .your-order-table table td {
    font-size: 13px;
  }
}

@media (max-width: 767px) {

  .your-order-table table th,
  .your-order-table table td {
    padding-right: 10px;
  }
}

.your-order-table table th {
  border-top: medium none;
  color: #6f7172;
  font-weight: normal;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
  width: 250px;
}

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

.your-order-table table .shipping ul li {
  list-style: none;
}

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

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

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

.your-order-table table .order-total th {
  border-bottom: 0;
  font-size: 14px;
}

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

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

.your-order-table table tr.order-total td span {
  color: var(--it-common-black);
  font-size: 18px;
  font-weight: 500;
}

.payment-method {
  margin-top: 40px;
}

.payment-method .accordion-item:last-of-type {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.payment-method .accordion-item {
  background-color: #fff;
  border: 0;
  border-bottom: 1px solid #e7e7e7;
}

.payment-method .accordion-button {
  font-size: 16px;
  font-weight: 500;
  color: var(--it-common-black);
  padding: 23px 0;
  border: none;
}

.payment-method .accordion-button:focus {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
}

.payment-method .accordion-button::after {
  position: absolute;
  content: "\f067";
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 16px;
  font-weight: 400;
  margin-left: 0;
  background-image: none;
  color: var(--it-common-black);
  font-family: "Font awesome 5 pro";
}

.payment-method .accordion-button:not(.collapsed) {
  color: var(--it-common-black);
  background-color: var(--it-common-white);
  box-shadow: none;
}

.payment-method .accordion-button:not(.collapsed)::after {
  content: "\f068";
  font-family: "Font awesome 5 pro";
}

.payment-method .accordion-body {
  padding: 8px 0;
  padding-bottom: 40px;
}

.payment-method .accordion-collapse {
  border: none;
}

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

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

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

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

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

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

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

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

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

.checkout-form-list .postbox__select .nice-select {
  height: 45px;
  line-height: 45px;
  background: #ffffff;
  border: 1px solid #eaedff;
  border-radius: 0;
}

/*----------------------------------------*/
/* 06. cart css start
/*----------------------------------------*/
.table-content .table> :not(:first-child) {
  border-top: 0;
}

.table-content table {
  background: #ffffff;
  border-color: #eaedff;
  border-radius: 0;
  border-style: solid;
  border-width: 1px 0 0 1px;
  text-align: center;
  width: 100%;
  margin-bottom: 0;
}

.table-content .table> :not(:last-child)> :last-child>* {
  border-bottom-color: #eaedff;
}

.table-content .product-quantity {
  float: none;
}

.table-content table td.product-name {
  font-size: 16px;
  font-weight: 400;
  text-transform: capitalize;
  font-family: var(--it-ff-heading);
  color: var(--it-common-black);
}

.table-content table td.product-name a:hover {
  color: var(--it-theme-1);
}

.table-content table td {
  border-top: medium none;
  padding: 20px 10px;
  vertical-align: middle;
  font-size: 16px;
}

.table-content table th,
.table-content table td {
  border-bottom: 1px solid #eaedff;
  border-right: 1px solid #eaedff;
}

.product-quantity>input {
  color: #000;
  font-size: 14px;
  font-weight: normal;
  border: 1px solid #dcdcdc;
  height: 22px;
  line-height: 22px;
  padding: 0;
}

.table td,
.table th {
  border-top: 1px solid #eaedff;
}

.product-quantity>input {
  width: 80px;
  text-align: center;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-quantity>input {
    width: 100%;
  }
}

.table-content table td.product-subtotal {
  font-size: 16px;
}

.table-content table td .cart-plus-minus {
  float: none;
  margin: 0 auto;
}

.coupon-all {
  margin-top: 50px;
}

.coupon {
  float: left;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .coupon .it-btn-red {
    padding: 0 35px;
  }
}

@media (max-width: 767px) {
  .coupon {
    float: none;
  }
}

#coupon_code {
  height: 58px;
  border: 2px solid #eaedff;
  padding: 0 30px;
  margin-right: 10px;
  width: auto;
}

@media (max-width: 767px) {
  #coupon_code {
    margin-bottom: 15px;
  }
}

.coupon2 {
  float: right;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .coupon2 .it-btn {
    padding: 0 35px;
  }
}

@media (max-width: 767px) {
  .coupon2 {
    float: none;
    margin-top: 15px;
  }
}

.cart-page-total {
  padding-top: 50px;
}

.cart-page-total>h2 {
  font-size: 25px;
  margin-bottom: 20px;
  text-transform: capitalize;
}

.cart-page-total>ul {
  border: 1px solid #eaedff;
}

.cart-page-total>ul>li {
  list-style: none;
  font-size: 15px;
  color: #6f7172;
  padding: 10px 30px;
  border-bottom: 1px solid #eaedff;
  font-weight: 400;
}

.cart-page-total ul>li>span {
  float: right;
}

.cart-page-total li:last-child {
  border-bottom: 0;
}

td.product-thumbnail img {
  width: 60px;
}

.cart-plus,
.cart-minus {
  width: 20px;
  height: 20px;
  border: 1px solid #e7e7e7;
  display: inline-block;
  vertical-align: middle;
  text-align: center;
  font-size: 14px;
  line-height: 18px;
  cursor: pointer;
}

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

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

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

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

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

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

@media (max-width: 767px) {
  .your-order {
    padding: 15px;
  }
}

.your-order h3 {
  border-bottom: 1px solid #eaedff;
  font-size: 30px;
  margin: 0 0 20px;
  padding-bottom: 10px;
  width: 100%;
}

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

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

@media (max-width: 767px) {

  .your-order-table table th,
  .your-order-table table td {
    font-size: 13px;
  }
}

@media (max-width: 767px) {

  .your-order-table table th,
  .your-order-table table td {
    padding-right: 10px;
  }
}

.your-order-table table th {
  border-top: medium none;
  color: #6f7172;
  font-weight: normal;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
  width: 250px;
}

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

.your-order-table table .shipping ul li {
  list-style: none;
}

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

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

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

.your-order-table table .order-total th {
  border-bottom: 0;
  font-size: 14px;
}

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

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

.your-order-table table tr.order-total td span {
  color: var(--it-common-black);
  font-size: 18px;
  font-weight: 500;
}

.payment-method {
  margin-top: 40px;
}

.payment-method .accordion-item:last-of-type {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}

.payment-method .accordion-item {
  background-color: #fff;
  border: 0;
  border-bottom: 1px solid #e7e7e7;
}

.payment-method .accordion-button {
  font-size: 16px;
  font-weight: 500;
  color: var(--it-common-black);
  padding: 23px 0;
  border: none;
}

.payment-method .accordion-button:focus {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
}

.payment-method .accordion-button::after {
  position: absolute;
  content: "\f067";
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 16px;
  font-weight: 400;
  margin-left: 0;
  background-image: none;
  color: var(--it-common-black);
  font-family: "Font awesome 5 pro";
}

.payment-method .accordion-button:not(.collapsed) {
  color: var(--it-common-black);
  background-color: var(--it-common-white);
  box-shadow: none;
}

.payment-method .accordion-button:not(.collapsed)::after {
  content: "\f068";
  font-family: "Font awesome 5 pro";
}

.payment-method .accordion-body {
  padding: 8px 0;
  padding-bottom: 40px;
}

.payment-method .accordion-collapse {
  border: none;
}

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

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

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

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

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

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

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

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

/*----------------------------------------*/
/*  24. program css start
/*----------------------------------------*/
.it-program-item-wrap {
  padding: 10px;
  border-radius: 10px;
  background-color: var(--it-common-black);
  transition: 0.5s;
}

.it-program-item-wrap:hover {
  background-color: var(--it-theme-1);
}

.it-program-item-wrap:hover .it-program-item {
  border: 1px dashed var(--it-common-white);
}

.it-program-item-wrap:hover .it-program-icon span {
  color: var(--it-theme-1);
  background-color: var(--it-common-white);
}

.it-program-item-wrap:hover .it-program-icon span::after {
  border-color: var(--it-common-white);
}

.it-program-item-wrap:hover .it-program-content span {
  color: var(--it-common-white);
}

.it-program-item-wrap:hover .it-program-link a {
  background-color: var(--it-common-white);
  color: var(--it-theme-1);
}

.it-program-item {
  padding: 35px 15px;
  padding-bottom: 22px;
  border-radius: 10px;
  border: 1px dashed var(--it-theme-1);
}

.it-program-icon span {
  height: 87px;
  width: 87px;
  line-height: 90px;
  text-align: center;
  display: inline-block;
  border-radius: 50%;
  background-color: var(--it-theme-1);
  position: relative;
  color: var(--it-common-white);
  transition: 0.5s;
  font-size: 45px;
}

.it-program-icon span::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  transform: scale(1.2);
  border-radius: 50%;
  border: 1px dashed var(--it-theme-1);
  transition: 0.5s;
}

.it-program-content span {
  color: var(--it-theme-1);
  transition: 0.5s;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-program-content span {
    font-size: 14px;
  }
}

.it-program-content p {
  color: var(--it-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-program-content p {
    font-size: 14px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-program-content p {
    font-size: 14px;
    padding: 0 40px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-program-content p {
    padding: 0px;
  }
}

.it-program-title {
  font-size: 22px;
  color: var(--it-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-program-title {
    font-size: 20px;
  }
}

.it-program-link a {
  height: 45px;
  width: 45px;
  line-height: 42px;
  display: inline-block;
  text-align: center;
  border-radius: 50%;
  background-color: var(--it-theme-1);
  color: var(--it-common-white);
  transition: 0.5s;
}

.it-program-2-ptb {
  padding-top: 115px;
  padding-bottom: 210px;
}

.it-program-2-item {
  padding: 20px;
  padding-bottom: 35px;
  border-radius: 10px;
  transition: 0.3s;
  background-color: var(--it-common-white);
}

.it-program-2-item .it-program-title {
  color: var(--it-common-black);
  transition: 0.3s;
}

.it-program-2-item .it-program-content span {
  transition: 0.3s;
}

.it-program-2-item .it-program-content p {
  color: var(--it-common-black);
  transition: 0.3s;
}

.it-program-2-item .it-program-link a {
  line-height: 40px;
  color: var(--it-common-white);
  background-color: var(--it-theme-2);
  transition: 0.3s;
}

.it-program-2-item:hover {
  background-color: var(--it-theme-2);
}

.it-program-2-item:hover .it-program-2-thumb::after {
  -webkit-animation: shine 1s;
  animation: shine 1s;
}

.it-program-2-item:hover .it-program-2-thumb::after {
  position: absolute;
  top: 0;
  left: -80%;
  z-index: 2;
  display: block;
  content: "";
  width: 50%;
  height: 100%;
  background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.3)));
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  -webkit-transform: skewX(-25deg);
  -ms-transform: skewX(-25deg);
  transform: skewX(-25deg);
  z-index: 1;
}

.it-program-2-item:hover .it-program-2-thumb img {
  transform: scale(1.2);
}

.it-program-2-item:hover .it-program-title {
  color: var(--it-common-white);
}

.it-program-2-item:hover .it-program-content span {
  color: var(--it-common-white);
}

.it-program-2-item:hover .it-program-content p {
  color: var(--it-common-white);
}

.it-program-2-item:hover .it-program-link a {
  background-color: var(--it-theme-1);
}

.it-program-2-thumb {
  border-radius: 10px;
  overflow: hidden;
  position: relative;
}

.it-program-2-thumb img {
  border-radius: 10px;
  transition: 1.3s all ease;
  width: 100%;
}

.it-program-2-shape-1 {
  position: absolute;
  right: 15px;
  bottom: 15px;
  z-index: -1;
}

.it-program-2-shape-2 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  animation: ittranslateY2 4s infinite alternate;
}

.it-program-2-shape-3 {
  position: absolute;
  bottom: 0;
  right: -3%;
  z-index: -1;
  animation: ittranslateX2 3s infinite alternate;
}

.it-program-2-shape-4 {
  position: absolute;
  top: 12%;
  left: 1%;
  z-index: -1;
  animation: zoom 9s infinite;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-program-2-shape-4 {
    left: -1%;
    transform: scale(0.7);
  }
}

.it-program-2-shape-5 {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
}

.it-program-2-shape-5 img {
  max-width: inherit;
}

.it-program-2-shape-6 {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
}

.it-program-details-wrap {
  margin-right: 74px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-program-details-wrap {
    margin-right: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-program-details-wrap {
    margin-right: 0;
    margin-bottom: 50px;
  }
}

.it-program-details-wrap .postbox__meta {
  padding-top: 3px;
  padding-bottom: 24px;
  margin-bottom: 40px;
  border-bottom: 1px solid rgba(77, 87, 86, 0.5);
}

.it-program-details-content .it-evn-details-title-sm {
  text-transform: uppercase;
}

.it-program-details-content .it-evn-details-text p {
  margin-bottom: 0;
  padding-bottom: 6px;
  padding-right: 10px;
}

.it-program-details-nav button {
  font-size: 16px;
  font-weight: 500;
  text-transform: capitalize;
  height: 53px;
  line-height: 53px;
  padding: 0 19px;
  color: var(--it-common-black);
  background-color: #F2F2F2;
  border-radius: 5px;
  transition: 0.3s;
  font-family: var(--it-ff-heading);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-program-details-nav button {
    margin-bottom: 15px;
  }
}

.it-program-details-nav button:not(:last-child) {
  margin-right: 18px;
}

@media (max-width: 767px) {
  .it-program-details-nav button:not(:last-child) {
    margin-right: 10px;
  }
}

.it-program-details-nav button:hover {
  color: var(--it-common-white);
  background-color: var(--it-theme-1);
}

.it-program-details-nav button.active {
  color: var(--it-common-white);
  background-color: var(--it-theme-1);
}

.it-program-sidebar-box {
  padding: 30px 22px;
  margin-left: -30px;
  border-radius: 5px;
  background-color: #E7F8FE;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-program-sidebar-box {
    margin-left: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-program-sidebar-box {
    margin-left: 0;
    margin-bottom: 50px;
  }
}

.it-program-sidebar-box .it-evn-sidebar-list ul li {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.it-program-sidebar-thumb img {
  width: 100%;
  border-radius: 5px;
}

.it-program-sidebar-rate {
  line-height: normal;
}

.it-program-sidebar-rate>span {
  text-transform: capitalize;
  font-size: 24px;
  font-family: var(--it-ff-heading);
  color: var(--it-common-black);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-program-sidebar-rate>span {
    font-size: 14px;
  }
}

.it-program-sidebar-rate>span.rate {
  color: var(--it-theme-1);
  font-size: 21px;
  font-family: var(--it-ff-heading);
  font-weight: 700;
  text-transform: capitalize;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-program-sidebar-rate>span.rate {
    font-size: 18px;
  }
}

.it-program-sidebar-rate>span.rate del {
  font-weight: 500;
  color: #898989;
}

.it-program-sidebar-rate-box>span {
  font-size: 19px;
  color: var(--it-common-black);
  text-transform: capitalize;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-program-sidebar-rate-box>span {
    font-size: 16px;
  }
}

.it-program-sidebar-list ul li {
  list-style: none;
  color: #021316;
  font-size: 19px;
  font-weight: 400;
  text-transform: capitalize;
  line-height: 30px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-program-sidebar-list ul li {
    font-size: 14px;
  }
}

.it-program-sidebar-list ul li:not(:last-child) {
  margin-bottom: 14px;
}

.it-program-sidebar-list-2 ul li {
  list-style: none;
  color: #021316;
  font-size: 19px;
  font-weight: 400;
  text-transform: capitalize;
  line-height: 30px;
  padding-left: 30px;
  position: relative;
}

.it-program-sidebar-list-2 ul li a {
  transition: 0.3s;
}

.it-program-sidebar-list-2 ul li a:hover {
  color: var(--it-theme-1);
}

.it-program-sidebar-list-2 ul li i {
  position: absolute;
  top: 2px;
  left: 0;
  color: var(--it-theme-1);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-program-sidebar-list-2 ul li {
    font-size: 14px;
  }
}

.it-program-sidebar-list-2 ul li:not(:last-child) {
  margin-bottom: 14px;
}

.it-evn-details-map {
  line-height: 0;
}

.it-evn-details-map iframe {
  height: 600px;
  width: 100%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-evn-details-map iframe {
    height: 400px;
  }
}

.it-evn-details-thumb img {
  width: 100%;
  border-radius: 10px;
}

.it-evn-details-title {
  font-size: 50px;
  font-weight: 400;
  text-transform: capitalize;
  line-height: 1.2;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-evn-details-title {
    font-size: 38px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-evn-details-title {
    font-size: 35px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-evn-details-title {
    font-size: 30px;
  }
}

.it-evn-details-title-sm {
  font-size: 20px;
}

.it-evn-details-text p {
  font-size: 16px;
  padding-right: 35px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-evn-details-text p {
    padding-right: 0;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-evn-details-text p {
    padding-right: 0;
    font-size: 14px;
  }
}

.it-evn-details-wrap {
  margin-right: 60px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-evn-details-wrap {
    margin-right: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-evn-details-wrap {
    margin-right: 0;
    margin-bottom: 50px;
  }
}

.it-evn-details-wrap .postbox__meta span {
  color: #4D5756;
  font-size: 21px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-evn-details-wrap .postbox__meta span {
    font-size: 16px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-evn-details-wrap .postbox__meta span {
    font-size: 14px;
  }
}

.it-evn-details-wrap .postbox__meta span:not(:last-child) {
  margin-right: 45px;
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-evn-details-wrap .postbox__meta span:not(:last-child) {
    margin-right: 20px;
  }
}

.it-evn-details-rate span i {
  color: var(--it-theme-1);
}

/*----------------------------------------*/
/*  13. event css start
/*----------------------------------------*/
.it-event-item {
  border-radius: 10px;
  border: 1px solid rgba(31, 144, 162, 0.1);
  transition: 0.3s;
}

.it-event-item:hover {
  border: 1px solid rgba(31, 144, 162, 0.1);
  box-shadow: 0px 0px 20px 0px rgba(2, 19, 22, 0.1);
}

.it-event-item:hover .it-event-thumb::after {
  -webkit-animation: shine 1s;
  animation: shine 1s;
}

.it-event-item:hover .it-event-thumb img {
  transform: scale(1.2);
}

.it-event-item:hover .it-event-meta {
  background-color: var(--it-theme-2);
}

.it-event-item:hover .it-event-tag span {
  background-color: var(--it-theme-1);
}

.it-event-item:hover .it-btn {
  background-color: var(--it-theme-2);
}

.it-event-thumb {
  overflow: hidden;
  border-radius: 10px;
  position: relative;
}

.it-event-thumb::after {
  position: absolute;
  top: 0;
  left: -80%;
  z-index: 2;
  display: block;
  content: "";
  width: 50%;
  height: 100%;
  background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.3)));
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  -webkit-transform: skewX(-25deg);
  -ms-transform: skewX(-25deg);
  transform: skewX(-25deg);
  z-index: 1;
}

.it-event-thumb img {
  width: 100%;
  border-radius: 10px;
  transition: 1.3s all ease;
}

.it-event-tag {
  position: absolute;
  bottom: 53px;
  right: 20px;
  z-index: 1;
}

.it-event-tag span {
  font-size: 14px;
  font-weight: 600;
  padding: 0px 20px;
  display: inline-block;
  border-radius: 5px;
  text-transform: uppercase;
  color: var(--it-common-white);
  background-color: var(--it-theme-2);
  transition: 0.3s;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-event-tag span {
    font-size: 12px;
  }
}

.it-event-meta {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 1;
  padding: 2px 30px;
  width: 100%;
  background-color: var(--it-theme-1);
  transition: 0.3s;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-event-meta {
    padding: 2px 20px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-event-meta {
    padding: 2px 30px;
  }
}

.it-event-meta>span {
  font-size: 15px;
  color: var(--it-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-event-meta>span {
    font-size: 13px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-event-meta>span {
    font-size: 12px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-event-meta>span {
    font-size: 15px;
  }
}

.it-event-meta>span>i {
  display: inline-block;
  margin-right: 7px;
}

.it-event-meta>span:not(:last-child) {
  margin-right: 30px;
}

.it-event-content {
  padding: 28px 30px;
  padding-top: 18px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-event-content {
    padding: 28px 20px;
    padding-top: 18px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-event-content {
    padding: 28px 30px;
    padding-top: 18px;
  }
}

.it-event-location>a {
  font-size: 15px;
  color: var(--it-common-black);
  position: relative;
  padding-left: 32px;
}

@media (max-width: 767px) {
  .it-event-location>a {
    font-size: 13px;
    padding-left: 25px;
  }
}

.it-event-location>a>i {
  position: absolute;
  top: -8px;
  left: 0;
  font-size: 20px;
  display: inline-block;
  color: var(--it-theme-1);
  transform: translateY(4px);
}

@media (max-width: 767px) {
  .it-event-location>a>i {
    font-size: 15px;
  }
}

.it-event-title {
  font-size: 22px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-event-title {
    font-size: 16px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-event-title {
    font-size: 20px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-event-title {
    font-size: 22px;
  }
}

.it-event-title a {
  transition: 0.3s;
}

.it-event-title a:hover {
  color: var(--it-theme-2);
}

/*----------------------------------------*/
/*  10. contact css start
/*----------------------------------------*/
.it-contact-map-box {
  position: absolute;
  top: 0;
  left: 0;
  width: 45.5%;
  height: 100%;
  line-height: 0;
}

.it-contact-map-box iframe {
  height: 100%;
  width: 100%;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-contact-map-box iframe {
    height: 500px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-contact-map-box {
    position: static;
    margin-top: 70px;
    width: 100%;
  }
}

.it-contact-form-box {
  margin-left: 85px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-contact-form-box {
    margin-left: 45px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-contact-form-box {
    margin-left: 0px;
    margin-bottom: 50px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-contact-form-box p {
    font-size: 14px;
  }

  .it-contact-form-box p br {
    display: none;
  }
}

.it-contact-input-box input {
  border-radius: 5px;
  padding: 0 25px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-contact-input-box input {
    font-size: 14px;
    height: 45px;
    line-height: 45px;
  }
}

.it-contact-textarea-box textarea {
  height: 170px;
  padding: 15px 25px;
  border-radius: 5px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-contact-textarea-box textarea {
    font-size: 14px;
    height: 120px;
  }
}

.it-contact-shape-1 {
  position: absolute;
  bottom: 0;
  right: 0;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-contact-shape-1 {
    right: -15%;
  }
}

.it-contact-shape-2 {
  position: absolute;
  top: 10%;
  right: 5%;
  animation: rotate2 4s linear infinite;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-contact-shape-2 {
    right: 2%;
    transform: scale(0.7);
  }
}

.it-contact-shape-3 {
  position: absolute;
  top: 0%;
  left: 0%;
  z-index: -1;
  transform: scale(1.05);
}

.it-contact-shape-4 {
  position: absolute;
  bottom: 0;
  left: 0;
}

.it-contact-shape-5 {
  position: absolute;
  top: 1%;
  right: -6%;
  animation: itswing 0.9s forwards infinite alternate;
  transform-origin: top right;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-contact-shape-5 {
    top: -10%;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-contact-shape-5 {
    top: -11%;
  }
}

.it-contact-shape-6 {
  position: absolute;
  top: 21%;
  left: 6%;
  animation: rotate2 15s linear infinite;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-contact-shape-6 {
    left: 2%;
    top: 10%;
  }
}

.it-contact-shape-7 {
  position: absolute;
  top: 11%;
  right: 4%;
  animation: zoom 7s infinite;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-contact-shape-7 {
    transform: scale(0.7);
    top: 5%;
    right: 0%;
  }
}

.it-contact-shape-8 {
  position: absolute;
  right: 0%;
  bottom: 0%;
}

.it-contact-thumb {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  mask-size: contain;
  mask-repeat: no-repeat;
  z-index: 2;
  display: inline-block;
  width: auto;
  height: auto;
  max-width: 100%;
  overflow: hidden;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-contact-thumb img {
    max-width: 100%;
  }
}

.it-contact-icon span {
  height: 100px;
  width: 100px;
  line-height: 111px;
  border-radius: 50%;
  display: inline-block;
  font-size: 40px;
  color: var(--it-theme-1);
  text-align: center;
  background-color: var(--it-common-white);
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-contact-icon span {
    height: 80px;
    width: 80px;
    line-height: 91px;
  }
}

.it-contact-item {
  padding: 60px 70px;
  padding-bottom: 50px;
  text-align: center;
  border-radius: 10px;
  background: var(--it-theme-1);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-contact-item {
    padding: 60px 20px;
    padding-bottom: 50px;
  }
}

.it-contact-item.it-contact-item-style-2 {
  background-color: var(--it-theme-2);
}

.it-contact-item.it-contact-item-style-2 .it-contact-icon span {
  color: var(--it-theme-2);
}

.it-contact-item.it-contact-item-style-3 {
  background-color: var(--it-common-black);
}

.it-contact-item.it-contact-item-style-3 .it-contact-icon span {
  color: var(--it-common-black);
}

.it-contact-title {
  font-size: 24px;
  font-weight: 400;
  margin-bottom: 15px;
  color: var(--it-common-white);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-contact-title {
    font-size: 20px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-contact-title {
    font-size: 18px;
  }
}

.it-contact-content a {
  font-size: 19px;
  font-weight: 600;
  color: var(--it-common-white);
  background-repeat: no-repeat;
  background-size: 0% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  transition: background-size 0.6s linear;
  background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-contact-content a {
    font-size: 17px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-contact-content a {
    font-size: 15px;
  }
}

.it-contact-content a:hover {
  background-size: 0% 1px, 100% 1px;
}

.it-contact-thumb-wrap {
  margin-left: -140px;
  transform: translateX(20px);
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-contact-thumb-wrap {
    margin-left: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-contact-thumb-wrap {
    margin-left: 0;
    transform: translateX(0px);
  }
}

.it-map-wrap {
  margin-top: -120px;
  line-height: 0;
}

.it-map-wrap iframe {
  width: 100%;
  height: 650px;
}

.it-signup-bg {
  border-radius: 10px;
  padding: 45px;
  background-color: var(--it-common-black);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-signup-bg {
    padding: 40px 35px;
  }
}

@media (max-width: 767px) {
  .it-signup-bg {
    padding: 40px 15px;
  }
}

.it-signup-wrap {
  margin-left: 30px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-signup-wrap {
    margin-left: 30px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-signup-wrap {
    margin-left: 0px;
  }
}

.it-signup-wrap>span {
  font-size: 19px;
  color: var(--it-common-white);
  display: block;
  padding-bottom: 50px;
}

.it-signup-title {
  font-size: 30px;
  font-style: normal;
  line-height: 1;
  color: #FFFFFF;
  text-transform: capitalize;
  padding-bottom: 18px;
}

.it-signup-input input {
  border-radius: 5px;
  color: var(--it-common-white);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  text-transform: capitalize;
  background-color: transparent;
  border: 1px solid var(--it-common-white);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-signup-input input {
    height: 55px;
    line-height: 55px;
  }
}

.it-signup-input input::placeholder {
  color: var(--it-common-white);
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  text-transform: capitalize;
}

.it-signup-text span {
  color: var(--it-common-white);
  font-size: 19px;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
}

.it-about-3-area {
  padding: 100px 0px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-signup-text span {
    font-size: 15px;
  }

  .it-about-3-area {
    padding: 40px 0px;
  }
}

.it-signup-text span a {
  color: #FFFFFF;
}

.it-signup-thumb {
  margin-right: -30px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-signup-thumb {
    margin-right: 0;
  }
}

.it-signup-thumb img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-radius: 10px;
}

.it-signup-forget a {
  font-size: 19px;
  color: #FFFFFF;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .it-signup-forget a {
    font-size: 16px;
  }
}

@media (max-width: 767px) {
  .it-signup-forget a {
    font-size: 18px;
  }
}

.it-signup-agree label {
  color: var(--it-common-white);
}

@media (max-width: 767px) {
  .it-signup-agree label {
    font-size: 18px;
  }
}

.it-signup-agree .form-check-input:checked {
  background-color: var(--it-common-black);
  border-color: transparent;
}

.it-signup-agree .form-check-input:focus {
  box-shadow: none;
}

.it-signup-agree .form-check-input.form-check-input[type=checkbox] {
  border-radius: 2px;
  margin-top: 10px;
  height: 15px;
  width: 15px;
  padding: 0;
  border-radius: 3px;
  border: 1px solid #E2E1E1;
}

@media (max-width: 767px) {
  .it-signup-continue-wrap {
    flex-wrap: wrap;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-signup-continue-wrap {
    flex-wrap: nowrap;
  }
}

.it-signup-continue-item {
  padding: 12px 23px;
  border-radius: 5px;
  border: 1px solid var(--it-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-signup-continue-item {
    padding: 12px 12px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-signup-continue-item {
    padding: 12px 15px;
  }
}

@media (max-width: 767px) {
  .it-signup-continue-item {
    width: 100%;
    margin-bottom: 10px;
  }
}

.it-signup-continue-item span {
  font-size: 18px;
  color: var(--it-common-white);
  display: inline-block;
  padding-left: 10px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-signup-continue-item span {
    font-size: 17px;
  }
}

.it-signup-border {
  margin-bottom: 25px;
}

.it-signup-border span {
  display: block;
  font-size: 16px;
  position: relative;
  text-transform: capitalize;
  color: var(--it-common-white);
}

.it-signup-border span::after {
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  content: "";
  width: 44%;
  height: 1px;
  background-color: var(--it-common-white);
}

.it-signup-border span::before {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  content: "";
  width: 44%;
  height: 1px;
  background-color: var(--it-common-white);
}

.faq-img {
  width: 250px;
  height: 180px;
  border-radius: 10px !important;
  object-fit: cover;
}

.it-student-bg {
  /* background-color: #E7F8FE; */
  padding: 100px 70px;
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
  border: 1px solid #e0e3e3;
  border-radius: 20px;
}

@media (max-width: 767px) {
  .it-student-bg {
    padding: 80px 30px;
  }
}

.it-student-title {
  color: #0E2A46;
  font-size: 40px;
  font-weight: 700;
  line-height: 30px;
  text-transform: uppercase;
  margin-bottom: 40px;
}

.it-student-subtitle {
  color: #0E2A46;
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  text-transform: capitalize;
  margin-bottom: 10px;
}

.it-student-content p {
  color: #333931;
  font-size: 15px;
  font-style: normal;
  font-weight: 400;
  line-height: 32px;
  text-transform: capitalize;
}

.it-student-regiform-item {
  margin-bottom: 20px;
}

.it-student-regiform-item label {
  color: var(--it-common-black);
  font-size: 19px;
  line-height: normal;
  text-transform: capitalize;
  margin-bottom: 10px;
}

@media (max-width: 767px) {
  .it-student-regiform-item label {
    font-size: 15px;
  }
}

.it-student-regiform-item input {
  border-radius: 10px;
  background-color: white;
  border: 1px solid rgba(137, 137, 137, 0.5);
  color: #000;
}

.it-student-regiform-item input::-webkit-input-placeholder {
  font-size: 15px;
  font-weight: 400;
}

.it-student-regiform-item input:-moz-placeholder {
  font-size: 15px;
  font-weight: 400;
}

.it-student-regiform-item input::-moz-placeholder {
  font-size: 15px;
  font-weight: 400;
}

.it-student-regiform-item input:-ms-input-placeholder {
  font-size: 15px;
  font-weight: 400;
}

.it-student-regiform-item input:focus {
  border: 1px solid var(--it-theme-1);
}

.it-student-regiform-item textarea {
  border-radius: 10px;
  height: 200px;
  background-color: white;
  padding: 15px 20px;
  border: 1px solid rgba(137, 137, 137, 0.5);
}

.it-student-regiform-item textarea::-webkit-input-placeholder {
  font-size: 15px;
  font-weight: 400;
}

.it-student-regiform-item textarea:-moz-placeholder {
  font-size: 15px;
  font-weight: 400;
}

.it-student-regiform-item textarea::-moz-placeholder {
  font-size: 15px;
  font-weight: 400;
}

.it-student-regiform-item textarea:-ms-input-placeholder {
  font-size: 15px;
  font-weight: 400;
}

.it-student-regiform-item textarea:focus {
  border: 1px solid var(--it-theme-1);
}

.it-student-regiform-gender-info>span>input:checked~label::before {
  opacity: 1;
  visibility: visible;
}

.it-student-regiform-gender-info>span input {
  display: none;
}

.it-student-regiform-gender-info>span>label {
  position: relative;
  padding-right: 41px;
}

.it-student-regiform-gender-info>span>label::before {
  position: absolute;
  content: "";
  right: 14px;
  top: 8px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: var(--it-theme-1);
  visibility: hidden;
  opacity: 0;
  transition: 0.3s;
}

.it-student-regiform-gender-info>span>label::after {
  position: absolute;
  content: "";
  right: 10px;
  top: 4px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 1px solid var(--it-theme-1);
  transition: 0.3s;
}

.it-student-regiform-title {
  color: #0E2A46;
  font-size: 20px;
  font-weight: 600;
  text-transform: capitalize;
  margin-bottom: 30px;
  display: inline-block;
}

@media (max-width: 767px) {
  .it-student-regiform-btn .it-btn {
    margin-top: 20px;
    margin-left: 0;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-student-regiform-btn .it-btn {
    margin-top: 0px;
    margin-left: 15px;
  }
}

.postbox__select {
  display: inline-block;
  width: 100%;
}

.postbox__select .nice-select {
  width: 100%;
  height: 58px;
  line-height: 58px;
  padding: 0px 20px;
  position: relative;
  border-radius: 10px;
  background-color: white;
  border: 1px solid rgba(137, 137, 137, 0.5);
}

.postbox__select .nice-select:focus {
  border: 1px solid var(--it-theme-1);
}

.postbox__select .nice-select::after {
  border: none;
  background-color: transparent;
  transform: translateY(-45%);
  margin-top: -4px;
  right: 20px;
  content: "\f107";
  font-family: "Font Awesome 5 Pro";
  transform-origin: center;
  color: #0E2A46;
  font-weight: 500;
  height: auto;
  width: auto;
}

.postbox__select .nice-select span {
  font-weight: 500;
  font-size: 15px;
  color: #898989;
}

.postbox__select .nice-select.open::after {
  transform: translateY(-45%) rotate(-180deg);
}

.postbox__select .nice-select .list {
  width: 100%;
  border: 1px solid var(--it-theme-1);
}

.postbox__select .nice-select .list li:last-child {
  border-bottom: 0;
}

.postbox__select .nice-select .selected {
  color: #0E2A46;
  font-weight: 600;
}

.postbox__resume {
  height: 25px;
  line-height: 25px;
  display: inline-block;
  padding: 0px 15px;
  color: #4D5756;
  font-size: 14px;
  font-weight: 400;
  text-transform: capitalize;
  border: 1px solid #CACACA;
  border-radius: 5px;
}

.postbox__resume.border-transparent {
  border: none;
}

.it-instructor-style .it-student-regiform-item input {
  background-color: transparent;
}

.it-instructor-style .postbox__select .nice-select {
  background-color: transparent;
}

.it-instructor-wrap {
  margin-bottom: 40px;
}

.it-instructor-wrap .it-signup-agree .form-check-input.form-check-input[type=checkbox] {
  border-radius: 2px;
  margin-top: 0;
  margin-right: 10px;
  height: 20px;
  width: 20px;
  padding: 0;
  transform: translateY(32px);
}

.it-instructor-wrap .form-check label {
  color: #333931;
  font-size: 15px;
  font-weight: 400;
  line-height: 32px;
  text-transform: capitalize;
  margin-left: 7px;
}

/*----------------------------------------*/
/*  26. shop css start
/*----------------------------------------*/
.it-shop-item {
  position: relative;
  border-radius: 5px;
  background-color: var(--it-common-white);
  box-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.04), 0px 0px 100px 0px rgba(255, 255, 255, 0.1);
}

.it-shop-item:hover .it-shop-thumb img {
  transform: scale(1.1);
}

.it-shop-thumb {
  overflow: hidden;
}

.it-shop-thumb img {
  transition: 0.6s;
}

.it-shop-title {
  font-size: 22px;
  font-style: normal;
  font-weight: 500;
  padding-top: 27px;
  color: var(--it-common-black);
  transition: 0.3s;
  display: inline-block;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-shop-title {
    font-size: 20px;
  }
}

.it-shop-title:hover {
  color: var(--it-theme-1);
}

.it-shop-icon {
  position: absolute;
  right: 20px;
  top: 20px;
  z-index: 2;
}

.it-shop-icon a {
  height: 28px;
  width: 28px;
  line-height: 28px;
  text-align: center;
  border-radius: 50%;
  display: block;
  color: var(--it-theme-1);
  background: rgba(245, 152, 49, 0.1);
}

.it-shop-icon a:not(:last-child) {
  margin-bottom: 8px;
}

.it-shop-badge-item {
  position: absolute;
  left: 20px;
  top: 20px;
}

.it-shop-badge-item span {
  color: var(--it-common-white);
  background-color: var(--it-theme-1);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  text-transform: uppercase;
  display: inline-block;
  padding: 7px 20px;
  border-radius: 5px;
  line-height: 1;
}

.it-shop-rate span {
  font-size: 15px;
  font-weight: 600;
  color: var(--it-common-black);
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-shop-rate span {
    font-size: 13px;
  }
}

.it-shop-rate span:not(:last-child) {
  margin-right: 28px;
}

.it-shop-rate span.color {
  color: #FF824C;
}

.it-shop-rate span del {
  padding-right: 10px;
  color: var(--it-text-body);
}

.it-shop-rate span i {
  color: #FF824C;
  margin-right: 5px;
  display: inline-block;
}

.it-shop-content {
  border-top: 1px dashed #D9D9D9;
}

.it-shop-content-box {
  padding: 35px 20px;
  padding-top: 0;
}

.it-product__filter {
  width: 280px;
}

.it-product__filter .nice-select {
  border: 1px solid rgba(13, 40, 37, 0.1);
  border-radius: 5px;
  font-size: 16px;
  height: 62px;
  line-height: 62px;
  padding: 0 25px;
  padding-right: 25px;
  padding-right: 60px;
  width: 280px;
  font-weight: 500;
  float: none;
}

.it-product__text span {
  font-size: 24px;
  color: var(--it-common-black);
  font-family: var(--it-ff-heading);
}

.basic-pagination ul li {
  display: inline-block;
}

.basic-pagination ul li:not(:last-child) {
  margin-right: 8px;
}

.basic-pagination ul li a,
.basic-pagination ul li span {
  display: inline-block;
  width: 49px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  font-size: 15px;
  transition: 0.3s;
  font-weight: 500;
  border-radius: 5px;
  background-color: rgba(245, 154, 49, 0.1);
  color: var(--it-theme-1);
}

.basic-pagination ul li a.current,
.basic-pagination ul li span.current {
  line-height: 46px;
}

.basic-pagination ul li a.current>span,
.basic-pagination ul li span.current>span {
  background-color: var(--it-theme-1);
  color: var(--it-common-white);
}

.basic-pagination ul li a.current i,
.basic-pagination ul li span.current i {
  display: inline-block;
  transform: translateY(2px);
}

.basic-pagination ul li a i {
  font-size: 20px;
}

/*--- shop-details css start---*/
@media (max-width: 767px) {
  .it-shop-details__quantity-wrap {
    flex-wrap: wrap;
  }
}

.it-shop-details__quantity {
  background-color: #F7F7F7;
  width: 205px;
  height: 67px;
  position: relative;
  margin-right: 15px;
}

@media (max-width: 767px) {
  .it-shop-details__quantity {
    margin-bottom: 30px;
  }
}

.it-shop-details__quantity input {
  border: 0;
  background-color: transparent;
  width: 100%;
  height: 100%;
  text-align: center;
  color: var(--it-common-black);
}

.it-shop-details__quantity .it-cart-minus {
  position: absolute;
  top: 0;
  left: 0;
  height: 64px;
  width: 64px;
  line-height: 64px;
  text-align: center;
  color: var(--it-common-black);
}

.it-shop-details__quantity .it-cart-plus {
  position: absolute;
  top: 0;
  right: 0;
  height: 64px;
  width: 64px;
  line-height: 64px;
  text-align: center;
  color: var(--it-common-black);
}

.it-shop-details__btn {
  line-height: 0;
}

@media (max-width: 767px) {
  .it-shop-details__btn {
    margin-bottom: 30px;
  }
}

.it-shop-details__right-warp {
  margin-top: 15px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-shop-details__right-warp {
    margin-bottom: 50px;
  }
}

.it-shop-details__title-sm {
  font-weight: 500;
  font-size: 28px;
  color: var(--it-common-black);
  padding-bottom: 15px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-shop-details__title-sm br {
    display: none;
  }
}

.it-shop-details__text {
  margin-bottom: 50px;
}

.it-shop-details__text-2 p {
  padding-bottom: 15px;
  padding-right: 40px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-shop-details__text-2 p {
    font-size: 15px;
  }
}

.it-shop-details__price {
  margin-bottom: 20px;
}

.it-shop-details__price span {
  font-weight: 700;
  font-size: 18px;
  color: #060728;
}

.it-shop-details__price span.red-color {
  border-radius: 1px;
  background: #EA1B25;
  font-size: 14px;
  color: var(--it-common-white);
  width: 51px;
  line-height: 20px;
  height: 20px;
  display: inline-block;
  text-align: center;
}

.it-shop-details__price del {
  color: rgba(0, 0, 0, 0.5);
  font-size: 14px;
  font-weight: 400;
  display: inline-block;
  margin-left: 13px;
  margin-right: 10px;
}

.it-shop-details__product-info {
  margin-bottom: 30px;
}

.it-shop-details__product-info ul li {
  color: rgba(20, 33, 43, 0.8);
  font-size: 15px;
  font-weight: 400;
  margin-bottom: 23px;
  list-style-type: none;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-shop-details__product-info ul li {
    font-size: 17px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-shop-details__product-info ul li {
    font-size: 15px;
  }
}

@media (max-width: 767px) {
  .it-shop-details__product-info ul li {
    font-size: 16px;
  }
}

.it-shop-details__product-info ul li:last-child {
  margin-bottom: 0;
}

.it-shop-details__product-info ul li>span {
  color: var(--it-common-black);
  font-family: var(--it-ff-heading);
  font-size: 16px;
  font-weight: 600;
}

.it-shop-details__social span {
  color: #121416;
  font-family: var(--it-ff-heading);
  font-size: 16px;
  font-weight: 600;
  line-height: 30px;
  display: inline-block;
  margin-right: 10px;
}

.it-shop-details__social a {
  display: inline-block;
  font-size: 16px;
  color: var(--it-common-black);
  transition: 0.3s;
  margin-right: 11px;
}

.it-shop-details__social a:hover {
  color: var(--it-theme-1);
}

.it-shop-details__ratting span {
  color: #EA1B25;
}

.it-shop-details__ratting span svg {
  color: var(--it-theme-1);
}

.it-shop-details__tab-big-img {
  border: 1px solid #EDE7E7;
  margin-right: 30px;
  text-align: center;
  padding-top: 30px;
  padding-bottom: 30px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-shop-details__tab-big-img {
    margin-right: 16px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-shop-details__tab-big-img {
    margin-right: 0px;
  }
}

.it-shop-details__tab-btn-box button {
  padding: 10px;
  margin-right: 10px;
  border: 1px solid #EDE7E7;
}

@media (max-width: 767px) {
  .it-shop-details__tab-btn-box button {
    padding: 5px;
    margin-bottom: 10px;
  }
}

.it-shop-details__wrapper {
  margin-bottom: 120px;
}

@media (max-width: 767px) {
  .it-shop-details__wrapper {
    margin-bottom: 70px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-product-img {
    margin-bottom: 50px;
  }
}

@media (max-width: 767px) {
  .it-product-img img {
    max-width: 100%;
  }
}

.it-product-quantity .cart-minus,
.it-product-quantity .cart-plus {
  cursor: pointer;
  color: #8D8884;
}

.it-product-quantity .cart-minus:hover,
.it-product-quantity .cart-plus:hover {
  color: var(--it-theme-primary);
}

.it-product-quantity input {
  height: 30px;
  width: 32px;
  font-size: 14px;
  border: none;
  font-weight: 700;
  text-align: center;
}

.product-rating {
  margin-right: 20px;
}

.product-rating a {
  font-size: 16px;
  color: #FFDC60;
}

.product-dinfo {
  display: flex;
}

.product-dprice del {
  font-size: 20px;
  color: #B9B9B9;
}

.pro-details-nav {
  background: #F9FAFB;
  display: inline-block;
  padding: 7px 7px;
}

.pro-details-nav-btn {
  border: none;
}

.pro-details-nav-btn li {
  font-weight: 500;
  font-size: 18px;
  color: var(--it-text-body);
  position: relative;
}

.pro-details-nav-btn li button span {
  position: relative;
  z-index: 9;
}

.pro-details-nav-btn li button::before {
  content: "";
  height: 100%;
  width: 102%;
  top: 0;
  left: -1px;
  background: #fff;
  position: absolute;
  z-index: 3;
  opacity: 0;
  visibility: hidden;
}

.pro-details-nav-btn li button.active::before {
  opacity: 1;
  visibility: visible;
}

.pro-details-nav-btn li::after {
  position: absolute;
  content: "";
  height: 40px;
  width: 1px;
  background: #DFE3E9;
  top: 50%;
  transform: translateY(-50%);
}

@media (max-width: 767px) {
  .pro-details-nav-btn li::after {
    display: none;
  }
}

.pro-details-nav-btn li:last-child::after {
  display: none;
}

@media (max-width: 767px) {
  .pro-details-nav-btn li {
    font-size: 16px;
  }
}

.pro-details-nav-btn li .nav-links {
  padding: 20px 45px;
  border-radius: 5px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pro-details-nav-btn li .nav-links {
    padding: 10px 20px;
  }
}

@media (max-width: 767px) {
  .pro-details-nav-btn li .nav-links {
    padding: 5px 15px;
  }
}

.pro-details-nav-btn li .nav-links.active {
  background: var(--it-common-white);
  color: var(--it-common-black);
}

.tab-para p {
  font-size: 16px;
  line-height: 30px;
}

@media (max-width: 767px) {
  .tab-para p {
    font-size: 14px;
  }
}

.comments-box {
  margin-bottom: 50px;
}

.user-rating ul li {
  display: inline-block;
  color: #FFDC60;
}

.comments-text span,
.comments-text p {
  font-size: 14px;
  color: #777777;
  line-height: 26px;
}

.comment-title p {
  color: #777777;
  font-size: 16px;
}

.comment-rating span {
  font-weight: 500;
  margin-right: 5px;
}

.comment-rating ul li {
  display: inline-block;
  color: #FFDC60;
}

.comment-input textarea {
  width: 100%;
  height: 120px;
  margin-bottom: 20px;
  border: 1px solid #e7e7e7;
  padding: 20px;
  resize: none;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .comment-input textarea {
    font-size: 14px;
  }
}

.comment-input textarea:focus {
  outline: 0;
  border: 1px solid var(--it-theme-1);
}

.comment-input input {
  width: 100%;
  height: 50px;
  resize: none;
  outline: 0;
  border: 1px solid #e7e7e7;
  padding: 8px 20px;
  margin-bottom: 30px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .comment-input input {
    font-size: 14px;
  }
}

.comment-input input:focus {
  border: 1px solid var(--it-theme-1);
}

.comments-avatar {
  flex: 0 0 auto;
}

.table .add-info {
  font-size: 18px;
  font-weight: 500;
}

.table td {
  padding: 18px;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .shop-left-right {
    margin-left: 0;
    margin-right: 0;
  }
}

.it-comments-title {
  font-size: 24px;
  color: var(--it-common-black);
  font-weight: 700;
  text-transform: capitalize;
}

@media (max-width: 767px) {
  .it-comments-title {
    font-size: 18px;
  }
}

.avatar-name b {
  color: var(--it-common-black);
  font-weight: 700;
  text-transform: uppercase;
  font-size: 18px;
}

.shop-faq .accordion-header button {
  font-size: 18px;
  padding: 20px 55px 20px 30px;
}

@media (max-width: 767px) {
  .shop-faq .accordion-header button {
    font-size: 14px;
  }
}

.shop-faq .accordion-content p br {
  display: none;
}

.shop-faq .accordion-content p {
  padding: 0 75px 20px 30px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-button a {
    margin-bottom: 10px;
  }
}

.latest-comments ul li {
  list-style-type: none;
}

.comment-title {
  font-size: 24px;
  color: var(--it-common-black);
  font-weight: 700;
  text-transform: capitalize;
}

.it-product-slider-title {
  color: var(--it-common-black);
  font-size: 30px;
  font-weight: 500;
}

.product-details-list-box>span {
  color: var(--it-common-black);
  font-size: 22px;
  font-weight: 700;
  display: block;
  margin-bottom: 30px;
}

.product-details-list-box ul {
  display: inline-block;
}

.product-details-list-box ul li {
  color: #445658;
  font-size: 16px;
  font-weight: 400;
  width: 50%;
  float: left;
  padding-left: 30px;
  position: relative;
  padding-bottom: 22px;
  list-style: none;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .product-details-list-box ul li {
    width: 100%;
  }
}

.product-details-list-box ul li svg {
  color: var(--it-theme-1);
  position: absolute;
  top: 3px;
  left: 0;
}

.it-shop-widget-categories-item input:checked~label::before {
  opacity: 1;
  visibility: visible;
}

.it-shop-widget-categories-item input:checked~label::after {
  background-color: var(--it-common-purple);
  border-color: var(--it-common-purple);
}

.basic-pagination-2 ul li {
  display: inline-block;
}

.basic-pagination-2 ul li:not(:last-child) {
  margin-right: 8px;
}

.basic-pagination-2 ul li a,
.basic-pagination-2 ul li span {
  display: inline-block;
  padding: 0 14px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  font-size: 12px;
  transition: 0.3s;
  border: 1px solid #e6e9e9;
  color: var(--it-theme-1);
}

.basic-pagination-2 ul li a.current i,
.basic-pagination-2 ul li span.current i {
  display: inline-block;
  transform: translateY(2px);
}

.basic-pagination-2 ul li a:hover,
.basic-pagination-2 ul li a.current {
  background: var(--it-theme-2);
  color: var(--it-common-white);
}

.basic-pagination-2 ul li span:hover,
.basic-pagination-2 ul li span.current {
  background: var(--it-theme-2);
  color: var(--it-common-white);
}

.basic-pagination-2 ul li a i {
  font-size: 20px;
}

/*----------------------------------------*/
/*  04. blog css start
/*----------------------------------------*/
.it-blog-bg {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-repeat: no-repeat;
  background-size: cover;
  opacity: 7%;
  z-index: -1;
}

.it-blog-item-wrap {
  padding: 40px 36px;
  padding-bottom: 50px;
  border-radius: 10px;
  border: 1px solid rgba(2, 19, 22, 0.1);
  background: #FFF;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-blog-item-wrap {
    padding: 30px 25px;
    padding-bottom: 40px;
  }
}

.it-blog-item-wrap:hover .it-blog-thumb::after {
  -webkit-animation: shine 1s;
  animation: shine 1s;
}

.it-blog-item-wrap:hover .it-blog-thumb img {
  transform: scale(1.2);
}

.it-blog-thumb {
  border-radius: 10px;
  overflow: hidden;
}

.it-blog-thumb::after {
  position: absolute;
  top: 0;
  left: -80%;
  z-index: 2;
  display: block;
  content: "";
  width: 50%;
  height: 100%;
  background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.3)));
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  -webkit-transform: skewX(-25deg);
  -ms-transform: skewX(-25deg);
  transform: skewX(-25deg);
  z-index: 1;
}

.it-blog-thumb img {
  border-radius: 10px;
  width: 100%;
  transition: 1.3s all ease;
}

.it-blog-meta span {
  font-size: 14px;
  padding: 13px 22px;
  display: inline-block;
  border-radius: 5px;
  line-height: 1;
  font-weight: 600;
  font-family: var(--it-ff-schoolbell);
  color: var(--it-common-black);
  background: rgba(31, 144, 162, 0.1);
}

.it-blog-title {
  font-size: 22px;
  font-weight: 400;
  text-transform: capitalize;
}

.it-blog-title a {
  transition: 0.3s;
}

.it-blog-title a:hover {
  color: var(--it-theme-2);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-blog-title {
    font-size: 20px;
  }
}

.it-blog-text p {
  color: var(--it-common-black);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-blog-text p {
    font-size: 14px;
  }
}

.it-blog-2 .it-blog-2-button .it-btn {
  transition: 0.4s;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-blog-2-item {
    margin-left: -30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-blog-2-item {
    margin-left: -40px;
  }
}

@media (max-width: 767px) {
  .it-blog-2-item {
    margin-left: -60px;
    margin-top: -60px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-blog-2-item {
    margin-left: 0px;
    margin-top: 0;
  }
}

@media only screen and (min-width: 440px) and (max-width: 575px) {
  .it-blog-2-item {
    margin-left: 0px;
  }
}

.it-blog-2-item:hover .it-blog-2-item-bg {
  background-color: var(--it-theme-1);
}

.it-blog-2-item:hover .it-blog-2-thumb img {
  transform: scale(1.2);
}

.it-blog-2-item:hover .it-blog-2-category {
  background-color: var(--it-theme-2);
}

.it-blog-2-item:hover .it-blog-2-date-bg span {
  color: var(--it-theme-2);
}

.it-blog-2-item:hover .it-blog-2-button .it-btn {
  background-color: var(--it-theme-2);
}

.it-blog-2-item-bg {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  max-width: calc(100% + 400px);
  mask-size: contain;
  mask-repeat: no-repeat;
  z-index: 2;
  background-color: var(--it-theme-2);
  width: 420px;
  height: 550px;
  transition: 0.4s;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-blog-2-item-bg {
    transform: scale(0.85);
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-blog-2-item-bg {
    transform: scale(0.8);
  }
}

@media (max-width: 767px) {
  .it-blog-2-item-bg {
    transform: scale(0.75);
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-blog-2-item-bg {
    transform: scale(1);
  }
}

@media only screen and (min-width: 440px) and (max-width: 575px) {
  .it-blog-2-item-bg {
    transform: scale(0.78);
  }
}

.it-blog-2-item-bg .dddd {
  padding: 30px;
}

.it-blog-2-thumb {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  mask-size: contain;
  mask-repeat: no-repeat;
  z-index: 2;
  display: inline-block;
  width: auto;
  height: auto;
  max-width: 100%;
  overflow: hidden;
}

.it-blog-2-thumb img {
  text-align: center;
  display: inline-block;
  transition: 1.3s all ease;
}

.it-blog-2-title {
  font-size: 22px;
  color: var(--it-common-white);
}

.it-blog-2-title a {
  transition: 0.3s;
}

.it-blog-2-title a:hover {
  color: var(--it-common-black);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-blog-2-title-box p {
    font-size: 14px;
  }

  .it-blog-2-title-box p br {
    display: none;
  }
}

.it-blog-2-category {
  position: absolute;
  bottom: 0px;
  left: 50%;
  text-align: center;
  padding: 8px 21px;
  display: inline-block;
  transform: translateX(-50%);
  border-radius: 5px;
  background-color: var(--it-theme-1);
  line-height: 0;
  z-index: 2;
  transition: 0.4s;
}

.it-blog-2-category span {
  font-size: 14px;
  color: var(--it-common-white);
  text-transform: uppercase;
  line-height: 1;
}

.it-blog-2-date {
  position: absolute;
  top: 13%;
  right: 15%;
  z-index: 2;
  line-height: 1;
}

.it-blog-2-date i {
  font-size: 14px;
  font-style: normal;
  font-family: var(--it-ff-heading);
  color: var(--it-common-white);
  display: block;
}

.it-blog-2-date span {
  color: var(--it-common-white);
  font-size: 15px;
}

.it-blog-2-date-bg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -1;
}

.it-blog-2-date-bg span {
  color: var(--it-theme-1);
  transition: 0.5s;
}

.it-blog-2-active {
  margin: 0 -30px;
  padding: 0 30px;
}

/*--- details css start here ----*/
@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .postbox__details-tag a {
    font-size: 13px;
  }
}

.postbox__details-checkmark {
  padding-bottom: 40px;
}

.postbox__details-checkmark ul li {
  list-style-type: none;
  position: relative;
  padding-left: 35px;
  margin-bottom: 20px;
  font-weight: 500;
  font-size: 17px;
  line-height: 1.2;
  color: #202124;
}

@media (max-width: 767px) {
  .postbox__details-checkmark ul li {
    font-size: 14px;
  }
}

.postbox__details-checkmark ul li:last-child {
  margin-bottom: 0;
}

.postbox__details-checkmark ul li i {
  height: 20px;
  width: 20px;
  background-color: var(--it-common-black);
  color: var(--it-common-white);
  border-radius: 50%;
  line-height: 20px;
  text-align: center;
  font-size: 10px;
  transform: translateX(2px);
  position: absolute;
  top: -2px;
  left: 0;
}

.postbox__details-title {
  font-weight: 400;
  font-size: 36px;
  line-height: 1.2;
  color: var(--it-common-black);
  padding-bottom: 10px;
}

@media only screen and (min-width: 1600px) and (max-width: 1800px) {
  .postbox__details-title {
    font-size: 33px;
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .postbox__details-title {
    font-size: 33px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .postbox__details-title {
    font-size: 32px;
  }

  .postbox__details-title br {
    display: none;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .postbox__details-title {
    font-size: 25px;
  }

  .postbox__details-title br {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .postbox__details-title {
    font-size: 30px;
  }

  .postbox__details-title br {
    display: none;
  }
}

@media (max-width: 767px) {
  .postbox__details-title {
    font-size: 20px;
  }

  .postbox__details-title br {
    display: none;
  }
}

.postbox__details-title-box>span {
  font-weight: 400;
  font-size: 14px;
  color: #888888;
  display: inline-block;
}

.postbox__details-title-box p {
  font-weight: 400;
  font-size: 16px;
  line-height: 30px;
  margin-bottom: 0;
  padding-bottom: 10px;
  padding-right: 25px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .postbox__details-title-box p {
    font-size: 15px;
  }

  .postbox__details-title-box p br {
    display: none;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .postbox__details-title-box p {
    font-size: 15px;
    padding-right: 0;
  }
}

@media (max-width: 767px) {
  .postbox__details-title-box p {
    font-size: 13px;
    padding-right: 0;
  }

  .postbox__details-title-box p br {
    display: none;
  }
}

.postbox__details-img-box {
  padding-bottom: 20px;
}

@media (max-width: 767px) {
  .postbox__details-img-box {
    flex-wrap: wrap;
  }
}

.postbox__details-img-box span img {
  border-radius: 20px;
  margin-bottom: 20px;
}

.postbox__details-img-box span img.img-mr {
  margin-right: 20px;
}

.postbox__details-img-caption {
  font-weight: 400;
  font-size: 13px;
  line-height: 10px;
  color: #87888A;
}

.postbox__details-img-caption i {
  font-style: normal;
  font-weight: 500;
  font-size: 13px;
  line-height: 10px;
  color: #5F6168;
}

@media (max-width: 767px) {
  .postbox__comment-box {
    flex-wrap: wrap;
  }
}

.postbox__content-wrap .it-contact-wrap {
  padding: 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .postbox__content-wrap .it-contact-wrap {
    margin-bottom: 60px;
  }
}

.postbox__content-wrap .it-contact__textarea-box textarea {
  padding-top: 10px;
  height: 150px;
}

.postbox__p-right {
  margin-right: 20px;
}

@media (max-width: 767px),
only screen and (min-width: 768px) and (max-width: 991px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .postbox__p-right {
    margin-right: 0px;
  }
}

.postbox__thumb img {
  border-radius: 5px;
}

.postbox__thumb .play-btn {
  position: absolute;
  top: calc(50% - 20px);
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 1;
  height: 90px;
  width: 90px;
  background-color: var(--it-common-white);
  text-align: center;
  line-height: 90px;
  color: var(--it-common-black);
  border-radius: 50%;
  animation: pulse 2s infinite;
}

@media (max-width: 767px) {
  .postbox__thumb .play-btn {
    height: 50px;
    width: 50px;
    line-height: 50px;
  }

  .postbox__thumb .play-btn i {
    padding-left: 4px;
  }
}

.postbox__thumb .play-btn:hover {
  background-color: var(--it-common-blue-4);
  color: var(--it-common-white);
}

.postbox__audio {
  height: 100%;
  width: 100%;
}

.postbox__audio iframe {
  width: 100%;
  height: 100%;
  border: none;
}

.postbox__item-single:hover {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  -ms-box-shadow: none;
  -o-box-shadow: none;
  box-shadow: none;
}

.postbox__content p img {
  margin-bottom: 30px;
  max-width: 100%;
  border-radius: 10px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .postbox__content p img {
    width: 100%;
  }
}

.postbox__content-single {
  padding-left: 0;
  padding-right: 0;
  border: none;
}

.postbox__title {
  color: var(--it-common-black);
  line-height: 1.3;
  font-weight: 400;
  font-size: 50px;
  color: #202124;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .postbox__title {
    font-size: 30px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .postbox__title {
    font-size: 30px;
  }

  .postbox__title br {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .postbox__title {
    font-size: 30px;
  }

  .postbox__title br {
    display: none;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .postbox__title {
    font-size: 22px;
  }

  .postbox__title br {
    display: none;
  }
}

@media (max-width: 767px) {
  .postbox__title {
    font-size: 22px;
  }

  .postbox__title br {
    display: none;
  }
}

.postbox__title a:hover {
  color: var(--it-theme-1);
}

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

.postbox__text p {
  font-size: 17px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .postbox__text p {
    font-size: 16px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .postbox__text p {
    font-size: 14px;
  }
}

.postbox__text-single p {
  margin-bottom: 15px;
}

.postbox__slider button {
  position: absolute;
  left: 50px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 1;
  font-size: 30px;
  color: var(--it-common-white);
}

.postbox__slider button.slick-next {
  left: auto;
  right: 50px;
}

@media (max-width: 767px) {
  .postbox__slider button.slick-next {
    right: 10px;
  }
}

@media (max-width: 767px) {
  .postbox__slider button {
    left: 10px;
  }
}

.postbox__comment ul li {
  margin-bottom: 45px;
  padding-bottom: 30px;
  list-style: none;
  padding: 25px;
  padding-right: 40px;
  border: 1px solid var(--it-theme-1);
}

@media (max-width: 767px) {
  .postbox__comment ul li {
    padding-right: 25px;
  }
}

.postbox__comment ul-title {
  font-size: 20px;
  font-weight: 400;
  color: var(--it-common-black);
  margin-bottom: 40px;
  margin-right: 20px;
}

.postbox__comment-title {
  font-weight: 400;
  font-size: 36px;
  line-height: 18px;
  letter-spacing: -0.02em;
  color: var(--it-common-white);
  margin-bottom: 40px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .postbox__comment-title {
    font-size: 22px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .postbox__comment-title {
    font-size: 20px;
  }
}

.postbox__comment-avater img {
  width: 154px;
  height: 154px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -o-border-radius: 50%;
  -ms-border-radius: 50%;
  border-radius: 50%;
}

@media (max-width: 767px) {
  .postbox__comment-avater img {
    width: 65px;
    height: 65px;
  }
}

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

.postbox__comment-name h5 {
  font-weight: 400;
  font-size: 22px;
  line-height: 20px;
  color: var(--it-common-black);
  margin-bottom: 20px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .postbox__comment-name h5 {
    font-size: 18px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .postbox__comment-name h5 {
    font-size: 17px;
  }
}

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

.postbox__comment-text p {
  font-size: 15px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .postbox__comment-text p {
    font-size: 15px;
  }

  .postbox__comment-text p br {
    display: none;
  }
}

@media (max-width: 767px) {
  .postbox__comment-text p {
    font-size: 14px;
  }

  .postbox__comment-text p br {
    display: none;
  }
}

.postbox__comment-reply {
  margin-top: 10px;
  padding-bottom: 17px;
}

.postbox__comment-reply span {
  margin-right: 40px;
  display: inline-block;
}

@media (max-width: 767px) {
  .postbox__comment-reply span {
    font-size: 17px;
  }
}

.postbox__comment-reply a {
  display: inline-block;
  font-weight: 500;
  font-size: 17px;
  color: var(--it-common-black);
  transition: 0.3s;
}

@media (max-width: 767px) {
  .postbox__comment-reply a {
    font-size: 14px;
  }
}

.postbox__comment-reply a:hover {
  color: var(--it-theme-1);
}

.postbox__comment-agree {
  margin-bottom: 30px;
}

.postbox__comment-agree .form-check-label {
  font-weight: 500;
  font-size: 14px;
  line-height: 1.3;
  color: #87888A;
}

.postbox__comment-agree .form-check-input:checked {
  background-color: var(--it-common-blue-4);
  border-color: transparent;
}

.postbox__comment-agree .form-check-input:focus {
  box-shadow: none;
}

.postbox__comment-agree .form-check-input.form-check-input[type=checkbox] {
  border-radius: 2px;
  margin-top: 4px;
}

.postbox__comment-input {
  position: relative;
  margin-bottom: 20px;
}

.postbox__comment-input span {
  font-weight: 600;
  color: var(--it-common-black);
  margin-bottom: 12px;
  display: block;
}

.postbox__comment-input input,
.postbox__comment-input textarea {
  height: 55px;
  padding: 0 20px;
  width: 100%;
  font-size: 14px;
  outline: none;
  border: 1px solid #f7f7f7;
  box-shadow: 0px 16px 24px rgba(189, 196, 205, 0.13);
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  -o-border-radius: 7px;
  -ms-border-radius: 7px;
  border-radius: 7px;
  color: var(--it-common-black);
}

.postbox__comment-input input::placeholder,
.postbox__comment-input textarea::placeholder {
  color: rgba(116, 116, 116, 0.5);
}

.postbox__comment-input input:focus,
.postbox__comment-input textarea:focus {
  border-color: var(--it-common-pink);
  color: var(--it-common-black);
}

.postbox__comment-input textarea {
  height: 175px;
  resize: none;
  padding-top: 20px;
  padding-bottom: 20px;
}

.postbox__tag span {
  font-size: 20px;
  margin-bottom: 17px;
  color: var(--it-common-black);
  margin-right: 30px;
  font-weight: 500;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .postbox__social {
    margin-top: 40px;
  }
}

.postbox__social span {
  font-size: 20px;
  color: var(--it-common-black);
  font-weight: 500;
}

.postbox__social a {
  font-size: 15px;
  padding-left: 30px;
}

.postbox__social a .it-linkedin {
  color: #0E6BA1;
}

.postbox__social a .it-pinterest {
  color: #D70220;
}

.postbox__social a .it-facebook {
  color: #0E6BA1;
}

.postbox__social a .it-twitter {
  color: #36B6ED;
}

@media (max-width: 767px) {
  .postbox__navigation-more {
    flex-wrap: wrap;
  }
}

.postbox__navigation-img {
  margin-right: 15px;
}

.postbox__navigation-img img {
  border-radius: 12px;
}

@media (max-width: 767px) {
  .postbox__navigation-left {
    margin-bottom: 30px;
  }
}

.postbox__navigation-content a:hover span {
  color: var(--it-common-blue-4);
}

.postbox__navigation-content span {
  font-weight: 500;
  font-size: 12px;
  line-height: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #5F6168;
  padding-bottom: 15px;
  display: inline-block;
  transition: 0.3s;
}

.postbox__navigation-content span i {
  margin-right: 10px;
}

.postbox__navigation-content h5 {
  font-weight: 700;
  font-size: 18px;
  line-height: 16px;
  color: #202124;
  transition: 0.3s;
}

@media (max-width: 767px) {
  .postbox__navigation-content h5 {
    font-size: 16px;
  }
}

.postbox__navigation-content h5:hover {
  color: var(--it-common-blue-4);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .postbox__navigation-content h5 {
    font-size: 15px;
  }
}

.postbox__navigation-right .postbox__navigation-img {
  margin-right: 0;
  margin-left: 15px;
}

.postbox__navigation-right .postbox__navigation-content span i {
  margin-right: 0;
  margin-left: 10px;
}

.postbox__item {
  padding-top: 10px;
  padding-bottom: 50px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.postbox__item i {
  font-size: 48px;
  color: var(--it-theme-1);
  margin-bottom: 20px;
}

.postbox__item p {
  font-size: 20px;
  line-height: 35px;
  font-weight: 700;
  color: var(--it-common-black);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .postbox__item p {
    font-size: 17px;
  }
}

@media (max-width: 767px) {
  .postbox__details-tag {
    margin-bottom: 20px;
  }
}

.postbox__details-tag span {
  color: var(--it-common-black);
  font-weight: 700;
  display: inline-block;
  padding-right: 5px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .postbox__details-tag span {
    font-size: 16px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .postbox__details-tag span {
    font-size: 17px;
  }
}

.postbox__details-tag a {
  padding: 0 15px;
  height: 30px;
  line-height: 30px;
  display: inline-block;
  background-color: #F2F2F2;
  color: var(--it-common-black);
  transition: 0.3s;
  margin-left: 10px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .postbox__details-tag a {
    padding: 0 10px;
    font-size: 12px;
    margin-left: 7px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .postbox__details-tag a {
    padding: 0 10px;
    font-size: 14px;
  }
}

@media (max-width: 767px) {
  .postbox__details-tag a {
    padding: 0 10px;
    font-size: 14px;
    margin-bottom: 10px;
  }
}

.postbox__details-tag a:hover {
  background-color: var(--it-theme-1);
  color: var(--it-common-white);
}

.postbox__details-share span {
  color: var(--it-common-black);
  font-weight: 700;
  display: inline-block;
  padding-right: 15px;
}

.postbox__details-share a {
  font-size: 16px;
  color: var(--it-common-black);
  display: inline-block;
  padding: 0 5px;
  transition: 0.3s;
  background-color: #F2F2F2;
  height: 35px;
  line-height: 35px;
  text-align: center;
  width: 35px;
}

.postbox__details-share a:not(:last-child) {
  margin-right: 8px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .postbox__details-share a {
    font-size: 14px;
  }
}

.postbox__details-share a:hover {
  color: var(--it-common-white);
  background-color: var(--it-theme-1);
}

.postbox__details-share-wrapper {
  padding-top: 20px;
  padding-bottom: 65px;
}

.postbox__comment-info {
  flex: 0 0 auto;
}

.postbox__meta>span {
  display: inline-block;
  padding-bottom: 5px;
  position: relative;
  padding-left: 25px;
  font-size: 16px;
  font-weight: 400;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .postbox__meta>span {
    font-size: 14px;
  }
}

@media (max-width: 767px) {
  .postbox__meta>span {
    font-size: 13px;
  }
}

.postbox__meta>span:not(:last-child) {
  margin-right: 28px;
}

.postbox__meta>span i {
  position: absolute;
  top: 8px;
  left: 0;
  display: inline-block;
  font-size: 16px;
  color: var(--it-theme-1);
}

.postbox__main-thumb img {
  width: 100%;
  border-radius: 5px;
}

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

@media (max-width: 767px) {
  .postbox__content-img img {
    margin-right: 0;
    margin-bottom: 15px;
  }
}

@media (max-width: 767px) {
  .postbox__content-img {
    flex-wrap: wrap;
  }
}

@media (max-width: 767px) {
  .postbox__slider-arrow-wrap {
    display: none;
  }
}

.postbox__slider-arrow-wrap .postbox-arrow-prev {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0px;
  z-index: 9;
}

.postbox__slider-arrow-wrap .postbox-arrow-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0px;
  z-index: 9;
}

.postbox__slider-arrow-wrap button {
  height: 60px;
  width: 60px;
  line-height: 64px;
  background-color: var(--it-common-white);
  color: var(--it-common-black);
  text-align: center;
  font-size: 18px;
}

.rc__post {
  transition: 0.3s;
  padding-top: 30px;
  border-top: 1px solid #E2E1E1;
  line-height: normal;
}

.rc__post:last-child {
  padding-bottom: 30px;
  border-bottom: 1px solid #E2E1E1;
}

.rc__post ul li:not(:last-child) {
  margin-bottom: 15px;
}

.rc__post-thumb {
  flex: 0 0 auto;
  object-fit: cover;
}

.rc__post-title {
  font-weight: 400;
  font-size: 16px;
  margin-right: 30px;
  color: var(--it-common-black);
  line-height: 23px;
  margin-bottom: 0;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .rc__post-title {
    font-size: 14px;
    margin-right: 0;
  }
}

.rc__post-title a:hover {
  color: var(--it-theme-1);
}

.rc__meta {
  line-height: 0;
}

.rc__meta span {
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 500;
  line-height: normal;
  display: inline-block;
  margin-bottom: 5px;
}

.rc__meta span i {
  color: var(--it-theme-1);
  display: inline-block;
  margin-right: 5px;
}

.rc__post-thumb img {
  height: 90px;
  width: 90px;
}

.sidebar__wrapper {
  padding-left: 40px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .sidebar__wrapper {
    padding-left: 0;
  }
}

.sidebar__widget-content ul>li {
  padding: 0 30px;
  height: 50px;
  line-height: 50px;
  list-style-type: none;
  position: relative;
  margin-bottom: 10px;
  transition: 0.3s;
  border: 1px solid #E2E1E1;
}

.sidebar__widget-content ul>li:hover {
  background-color: var(--it-theme-1);
}

.sidebar__widget-content ul>li:hover a {
  color: var(--it-common-white);
}

.sidebar__widget-content ul>li:hover::after {
  color: var(--it-common-white);
}

.sidebar__widget-content ul>li::after {
  content: "\f105";
  right: 30px;
  top: 50%;
  position: absolute;
  transform: translateY(-50%);
  font-family: "Font Awesome 6 Pro";
  color: var(--it-common-black);
  font-size: 18px;
}

.sidebar__widget-content ul>li>a {
  font-weight: 500;
  font-size: 16px;
  color: var(--it-common-black);
  transition: 0.3s;
}

.sidebar__widget-title {
  font-weight: 400;
  font-size: 24px;
  line-height: 16px;
  margin-bottom: 30px;
  text-transform: uppercase;
  color: var(--it-common-black);
  display: inline-block;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .sidebar__widget-title {
    font-size: 20px;
  }

  .sidebar__widget-title br {
    display: none;
  }
}

.sidebar__widget.color-box {
  padding: 40px 35px;
  background-color: var(--it-common-black);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
(max-width: 767px) {
  .sidebar__widget.color-box {
    padding: 40px 20px;
  }
}

.sidebar__widget:last-child-title {
  border-bottom: 0;
  font-weight: 400;
}

.sidebar__widget>ul>li {
  list-style: none;
  margin-bottom: 15px;
}

.sidebar__widget>ul>li:last-child {
  margin-bottom: 0;
}

.sidebar__widget>ul>li a {
  font-weight: 500;
  font-size: 14px;
  line-height: 12px;
  color: #5F6168;
  display: flex;
  justify-content: space-between;
}

.sidebar__widget>ul>li a:hover {
  color: var(--it-theme-1);
}

.sidebar__widget>ul>li a i {
  font-size: 18px;
  transform: translateY(2px);
  margin-right: 10px;
}

.sidebar__search {
  position: relative;
}

.sidebar__search input {
  width: 100%;
  height: 60px;
  line-height: 60px;
  padding-left: 30px;
  text-transform: capitalize;
  background-color: #353535;
  border: none;
  padding-right: 60px;
  color: var(--it-common-white);
  outline: none;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sidebar__search input {
    font-size: 15px;
  }
}

@media (max-width: 767px) {
  .sidebar__search input {
    padding-right: 40px;
    padding-left: 15px;
    font-size: 14px;
  }
}

.sidebar__search input:focus {
  border-color: var(--it-theme-1);
}

.sidebar__search input::placeholder {
  color: #777777;
}

.sidebar__search button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 30px;
  border-radius: 50%;
  display: inline-block;
  color: var(--it-common-white);
  font-size: 18px;
}

.sidebar__banner-content {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: 1;
  background: var(--it-theme-1);
}

.sidebar__banner-content h4 {
  padding: 15px 20px;
  font-size: 24px;
  color: var(--it-common-white);
  text-transform: uppercase;
  margin-bottom: 0;
}

.tagcloud.space a {
  padding: 0px 15px;
}

.tagcloud a {
  color: #4D5756;
  background-color: #F2F2F2;
  display: inline-block;
  line-height: 1;
  padding: 0px 50px;
  height: 48px;
  line-height: 48px;
  margin-bottom: 15px;
  margin-right: 10px;
  transition: 0.3s;
  font-weight: 500;
  font-size: 14px;
  text-align: center;
  text-transform: capitalize;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tagcloud a {
    font-size: 13px;
    padding: 0px 36px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tagcloud a {
    font-size: 13px;
    padding: 0px 36px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tagcloud a {
    font-size: 13px;
    font-size: 13px;
    padding: 0px 36px;
  }
}

@media (max-width: 767px) {
  .tagcloud a {
    font-size: 13px;
    font-size: 13px;
    padding: 0px 36px;
  }
}

.tagcloud a:hover {
  background: var(--it-theme-1);
  color: var(--it-common-white);
}

.tagcloud span {
  font-weight: 600;
  font-size: 16px;
  line-height: 12px;
  color: #202124;
  margin-right: 8px;
}

.it-pagination ul li {
  padding-top: 30px;
  display: inline-block;
}

.it-pagination ul li:not(:last-child) {
  margin-right: 10px;
}

.it-pagination ul li a,
.it-pagination ul li span {
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  transition: 0.3s;
  background: var(--it-theme-1);
  font-family: var(--it-ff-heading);
  color: var(--it-common-white);
  border-radius: 4px;
  box-shadow: 2px 3.464px 20px 0px rgba(4, 23, 26, 0.08);
}

.it-pagination ul li a.current i,
.it-pagination ul li span.current i {
  display: inline-block;
  transform: translateY(2px);
}

.it-pagination ul li a:hover,
.it-pagination ul li a.current {
  background-color: var(--it-theme-5);
}

.it-pagination ul li span:hover,
.it-pagination ul li span.current {
  background-color: var(--it-theme-5);
}

.it-pagination ul li a {
  display: inline-block;
}

.it-pagination ul li a.color {
  background-color: var(--it-theme-5);
  color: var(--it-common-white);
  font-size: 18px;
}

/*----------------------------------------*/
/*  03. about css start
/*----------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-left {
    margin-bottom: 70px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-text p {
    font-size: 14px;
  }
}

.it-about-mission-item:not(:last-child) {
  margin-right: 24px;
}

@media (max-width: 767px) {
  .it-about-mission-item {
    margin-bottom: 20px;
  }
}

.it-about-mission-icon {
  flex: 0 0 auto;
  margin-right: 16px;
}

.it-about-mission-icon span {
  height: 58px;
  width: 58px;
  line-height: 58px;
  text-align: center;
  border-radius: 50%;
  background: #E7F8FE;
  display: inline-block;
  color: var(--it-theme-2);
}

.it-about-mission-text h6 {
  font-size: 22px;
  padding-bottom: 5px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-about-mission-text h6 {
    font-size: 20px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-mission-text h6 {
    font-size: 18px;
  }
}

.it-about-mission-text p {
  font-size: 15px;
  line-height: 26px;
  margin-bottom: 0;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-mission-text p {
    font-size: 14px;
  }
}

.it-about-info-item {
  position: relative;
}

@media (max-width: 767px) {
  .it-about-info-item {
    margin-bottom: 20px;
  }
}

.it-about-info-item:not(:last-child) {
  margin-right: 50px;
  padding-right: 50px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-info-item:not(:last-child) {
    margin-right: 0;
  }
}

.it-about-info-item:not(:last-child)::after {
  position: absolute;
  content: "";
  top: 0;
  right: 0;
  height: 53px;
  width: 1px;
  border: 1px dashed rgba(31, 144, 162, 0.5);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-info-item:not(:last-child)::after {
    display: none;
  }
}

.it-about-info-avata {
  margin-right: 20px;
}

.it-about-info-icon {
  margin-right: 20px;
}

.it-about-info-icon span {
  height: 70px;
  width: 70px;
  line-height: 70px;
  text-align: center;
  border-radius: 50%;
  display: inline-block;
  color: var(--it-theme-1);
  background: rgba(245, 153, 48, 0.1);
}

.it-about-info-text h6 {
  font-size: 22px;
  padding-bottom: 5px;
  text-transform: capitalize;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-about-info-text h6 {
    font-size: 20px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-info-text h6 {
    font-size: 18px;
  }
}

.it-about-thumb-box {
  margin-left: 75px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-about-thumb-box {
    margin-left: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-thumb-box {
    margin-left: 0px;
    display: inline-block;
    text-align: center;
  }
}

.it-about-thumb {
  mask-image: url(../img/about/png.png);
  -webkit-mask-image: url(../img/about/png.png);
  height: 100%;
  width: 100%;
  mask-repeat: no-repeat;
  background-position: center center;
  overflow: hidden;
}

.it-about-thumb img {
  width: 100%;
}

.it-about-award {
  position: absolute;
  bottom: 2%;
  left: 0;
  background-color: var(--it-theme-2);
  padding: 24px 24px;
  border-radius: 10px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-about-award {
    bottom: 0;
    left: 6%;
  }
}

.it-about-award span {
  margin-right: 15px;
  color: var(--it-common-white);
}

.it-about-award h6 {
  color: var(--it-common-white);
  font-family: var(--it-ff-body);
}

.it-about-award h6 i {
  font-size: 50px;
  font-style: normal;
  font-family: var(--it-ff-heading);
}

.it-about-2-thumb-box {
  margin-left: 40px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-about-2-thumb-box {
    margin-left: 0px;
    transform: scale(0.9);
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-about-2-thumb-box {
    margin-left: 0px;
    margin-right: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-2-thumb-box {
    margin-left: 0px;
    margin-bottom: 0px;
  }
}

.it-about-2-right {
  margin-left: -35px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-2-right {
    margin-left: 0;
  }
}

.it-about-2-thumb {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  mask-size: contain;
  mask-repeat: no-repeat;
  z-index: 1;
  display: inline-block;
  width: auto;
  height: auto;
  max-width: 100%;
  overflow: hidden;
}

.it-about-2-thumb img {
  width: 600px;
}

.it-about-2-text {
  position: relative;
}

.it-about-2-text::after {
  position: absolute;
  content: "";
  top: 12px;
  left: 0%;
  width: 2px;
  height: 80px;
  background-color: var(--it-theme-1);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-2-text::after {
    display: none;
  }
}

.it-about-2-text p {
  padding-left: 10px;
  color: var(--it-common-black);
  margin-bottom: 0;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-2-text p {
    font-size: 14px;
  }
}

.it-about-2-nursery-title {
  color: var(--it-theme-2);
}

.it-about-2-nursery-icon {
  margin-right: 22px;
}

.it-about-2-nursery-text p {
  color: var(--it-common-black);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-2-nursery-text p {
    font-size: 14px;
  }
}

.it-about-2-shape-1 {
  position: absolute;
  top: -3.5%;
  left: -2%;
}

.it-teacher-2-shape-1 {
  position: absolute;
  top: -3.5%;
  left: -2%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-2-shape-1 {
    left: 0;
    top: -1%;
    transform: scale(1.03);
  }

  .it-teacher-2-shape-1 {
    position: absolute;
    top: -3.5%;
    left: -2%;
  }
}

.it-about-2-shape-2 {
  position: absolute;
  top: -8.5%;
  left: -5%;
}

.it-about-2-shape-3 {
  position: absolute;
  bottom: 7%;
  left: 4%;
}

@media only screen and (min-width: 1600px) and (max-width: 1800px) {
  .it-about-2-shape-3 {
    left: -4%;
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-about-2-shape-3 {
    left: -7%;
    bottom: 4%;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-about-2-shape-3 {
    left: -7%;
    bottom: 4%;
    transform: scale(0.6);
  }
}

.it-about-2-shape-4 {
  position: absolute;
  top: 15%;
  left: 13%;
  animation: itswing 1.4s forwards infinite alternate;
  transform-origin: bottom left;
}

.it-about-2-shape-11 {
  position: absolute;
  top: 15%;
  left: -6%;
  animation: itswing 1.4s forwards infinite alternate;
  transform-origin: bottom left;
}

.it-about-2-ourstory-4 {
  position: absolute;
  bottom: 87%;
  left: 6%;
  animation: itswing 1.4s forwards infinite alternate;
  transform-origin: bottom left;
}

.it-about-2-ourstory-4 img {
  width: 150px;
}

.it-about-2-butterfly-4 {
  position: absolute;
  bottom: 95%;
  left: 4%;
  animation: itswing 1.4s forwards infinite alternate;
  transform-origin: bottom left;
}

.it-about-2-butterfly-4 img {
  width: 150px;
}

@media only screen and (min-width: 1600px) and (max-width: 1800px) {
  .it-about-2-shape-4 {
    left: 4%;
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-about-2-shape-4 {
    left: 1%;
    top: 10%;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-about-2-shape-4 {
    left: 1%;
    top: 10%;
  }
}

.it-about-2-shape-5 {
  position: absolute;
  right: 0;
  bottom: 0;
}

.it-about-2-shape-6 {
  position: absolute;
  right: 7%;
  bottom: 28%;
  animation: zoom 5s infinite;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-about-2-shape-6 {
    bottom: 10%;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-about-2-shape-6 {
    bottom: 10%;
  }
}

.it-about-2-shape-7 {
  position: absolute;
  top: 13%;
  right: 5%;
  animation: rotate2 4s linear infinite;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-3-left {
    margin-bottom: 80px;
  }
}

.it-about-3-thumb {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  mask-size: contain;
  mask-repeat: no-repeat;
  z-index: 2;
  display: inline-block;
  width: auto;
  height: auto;
  max-width: 100%;
  overflow: hidden;
}

.it-about-3-thumb img {
  width: 605px;
}

.it-about-3-text p {
  color: var(--it-common-black);
  text-transform: capitalize;
}

.it-about-3-thumb-box {
  padding-right: 18px;
}

.it-about-3-icon-box {
  padding: 10px 17px;
  border-radius: 10px;
  background: #E7F8FE;
  border: 1px solid rgba(31, 144, 162, 0.3);
}

.it-team-2-area {
  padding: 100px 0px;
}

.brave-game {
  display: flex;
  margin: 20px auto;
  width: 100%;
  padding: 40px 25px;
  background: #fff;
  border-radius: 14px;
  border: 1px solid #e0e7e0;
}
@media (max-width:425px) {
.brave-game {
  display: flex;
  margin: 20px auto;
  width: 100%;
  padding: 0px;
  background: #fff;
  border-radius: 14px;
  border: 1px solid #e0e7e0;
}
}
@media (max-width:1024px) {
  .it-team-2-area {
    padding: 50px 0px;
  }
}

.itoffcanvas__logo a {
  font-family: "MATTEKEK";
  font-size: 30px;
  color: white;
  text-transform: none;
}

.it-footer-area {
  padding: 90px 0px 50px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-about-3-icon-box {
    padding: 10px 10px;
  }

}

.it-about-3-icon>span {
  font-size: 20px;
  width: 40px;
  height: 40px;
  line-height: 44px;
  border-radius: 50%;
  text-align: center;
  display: inline-block;
  margin-right: 10px;
  color: var(--it-common-white);
  background-color: var(--it-theme-2);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .it-about-3-icon>span {
    font-size: 16px;
    width: 35px;
    height: 35px;
    line-height: 41px;
  }

}

.it-about-3-text span {
  font-size: 17px;
  font-weight: 600;
  color: var(--it-common-black);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 576px) and (max-width: 767px) {
  .it-about-3-text span {
    font-size: 13px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-3-text p {
    font-size: 17px;
  }

  .it-about-3-text p br {
    display: none;
  }
}

.it-about-3-title-box {
  /* margin-right: -190px; */
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-about-3-title-box {
    margin-right: -50px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-about-3-title-box {
    margin-right: 0px;
  }
}

.it-about-3-shape-1 {
  position: absolute;
  right: 0;
  top: -10px;
  z-index: -1;
}

.it-about-3-shape-2 {
  position: absolute;
  top: -5%;
  right: 7%;
  animation: itswing 0.9s forwards infinite alternate;
  transform-origin: bottom right;
}

.it-about-3-shape-7 {
  position: absolute;
  top: -15%;
  right: -7%;
  animation: itswing 0.9s forwards infinite alternate;
  transform-origin: bottom right;
}

.it-jam-3-shape-2 {
  position: absolute;
  top: 12%;
  right: 4%;
  animation: itswing 0.9s forwards infinite alternate;
  transform-origin: bottom right;
}

.it-jam-3-shape-22 {
  position: absolute;
  top: 2%;
  right: 4%;
  animation: itswing 0.9s forwards infinite alternate;
  transform-origin: bottom right;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-about-3-shape-2 {
    top: -12%;
  }
}

.it-about-3-shape-3 {
  position: absolute;
  bottom: -5%;
  left: 4%;
  animation: itswing 1.1s forwards infinite alternate;
  transform-origin: top right;
}

.it-about-3-shape-8 {
  position: absolute;
  bottom: -13%;
  left: -6%;
  animation: itswing 1.1s forwards infinite alternate;
  transform-origin: top right;
}

.it-about-3-shape-4 {
  position: absolute;
  top: 23%;
  left: 10%;
}

.it-about-3-shape-5 {
  position: absolute;
  right: 15%;
  bottom: 0%;
  animation: rotate2 4s linear infinite;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-about-3-shape-5 {
    transform: scale(0.6);
  }
}

.it-about-3-shape-6 {
  position: absolute;
  top: 5%;
  left: 38%;
  z-index: -1;
}

/*----------------------------------------*/
/*  23. price css start
/*----------------------------------------*/
.it-price-item {
  border-radius: 10px;
  padding: 30px 0;
  background-color: var(--it-theme-1);
}

.it-price-item.it-price-item-bg-2 {
  background-color: var(--it-theme-2);
}

.it-price-item.it-price-item-bg-3 {
  background-color: var(--it-common-black);
}

.it-price-top {
  padding-bottom: 16px;
  border-bottom: 1px solid var(--it-common-white);
}

.it-price-top span {
  font-size: 22px;
  font-weight: 500;
  color: var(--it-common-white);
  font-family: var(--it-ff-heading);
}

.it-price-title {
  font-size: 45px;
  font-weight: 500;
  color: var(--it-common-white);
}

.it-price-list ul li {
  list-style: none;
  font-size: 18px;
  font-weight: 400;
  padding: 4px 15px;
  color: var(--it-common-white);
  border-bottom: 1px solid var(--it-common-white);
}

.it-price-tab ul li button {
  font-size: 15px;
  font-weight: 400;
  margin: 0 8px;
  border-radius: 5px;
  padding: 3px 30px;
  text-transform: uppercase;
  font-family: var(--it-ff-heading);
  color: var(--it-common-white);
  background-color: var(--it-theme-2);
  transition: 0.3s;
}

.it-price-tab ul li button:hover {
  color: var(--it-common-white);
  background-color: var(--it-theme-1);
}

.it-price-tab ul li button.active {
  color: var(--it-common-white);
  background-color: var(--it-theme-1);
}

.it-price-shape-1 {
  position: absolute;
  top: -40px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
}

/*----------------------------------------*/
/*  11. cta css start
/*----------------------------------------*/
.it-cta-ptb {
  padding: 133px 0;
}

.it-cta-title {
  font-size: 45px;
  color: var(--it-common-white);
}

@media (max-width: 767px) {
  .it-cta-title {
    font-size: 35px;
  }
}

.it-cta-content p {
  padding: 0 250px;
  margin-bottom: 32px;
  color: var(--it-common-white);
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-cta-content p {
    font-size: 14px;
    padding: 0 100px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-cta-content p {
    font-size: 14px;
    padding: 0px;
  }
}

.it-cta-shape-1 {
  position: absolute;
  bottom: 18%;
  left: 5%;
  animation: moving 9s linear infinite;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-cta-shape-1 {
    bottom: 4%;
    left: -2%;
    transform: scale(0.8);
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-cta-shape-1 {
    bottom: 4%;
    left: -2%;
    transform: scale(0.8);
  }
}

.it-cta-shape-2 {
  position: absolute;
  bottom: 0;
  right: 0;
}

.it-cta-shape-3 {
  position: absolute;
  top: 22%;
  right: 7%;
  animation: rotate2 4s linear infinite;
}

/*----------------------------------------*/
/*  14. faq css start
/*----------------------------------------*/
.it-faq-sidebar {
  /* margin-right: 30px; */
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-faq-sidebar {
    margin-right: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-faq-wrap {
    margin-bottom: 80px;
  }
}

/*----------------------------------------*/
/*  09. classes css start
/*----------------------------------------*/
.it-classes-item-wrap {
  border-radius: 10px;
  border: 1px solid rgba(245, 152, 49, 0.2);
  transition: 0.3s;
}

.it-classes-item-wrap:hover {
  border: 1px solid transparent;
  box-shadow: 0px 0px 20px 0px rgba(2, 19, 22, 0.1);
}

.it-classes-item {
  padding: 20px;
}

.it-classes-item:hover .it-classes-thumb::after {
  -webkit-animation: shine 1s;
  animation: shine 1s;
}

.it-classes-item:hover .it-classes-thumb img {
  transform: scale(1.2);
}

.it-classes-thumb {
  overflow: hidden;
  border-radius: 10px;
  position: relative;
}

.it-classes-thumb::after {
  position: absolute;
  top: 0;
  left: -80%;
  z-index: 2;
  display: block;
  content: "";
  width: 50%;
  height: 100%;
  background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.3)));
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
  -webkit-transform: skewX(-25deg);
  -ms-transform: skewX(-25deg);
  transform: skewX(-25deg);
  z-index: 1;
}

.it-classes-thumb img {
  border-radius: 10px;
  width: 100%;
  transition: 1.3s all ease;
}

.it-classes-title {
  font-size: 22px;
}

.it-classes-title a {
  transition: 0.3s;
}

.it-classes-title a:hover {
  color: var(--it-theme-1);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-classes-title-box p {
    font-size: 14px;
  }

  .it-classes-title-box p br {
    display: none;
  }
}

.it-classes-content p {
  margin-bottom: 0;
  color: var(--it-common-black);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-classes-content p {
    font-size: 14px;
  }
}

.it-classes-meta-box {
  padding: 25px 10px;
  padding-bottom: 30px;
  border-top: 1px solid rgba(245, 152, 49, 0.2);
}

.it-classes-meta-box ul li {
  display: inline-block;
  list-style-type: none;
}

.it-classes-meta-box ul li:not(:last-child) {
  margin-right: 30px;
  padding-right: 30px;
  border-right: 1px dashed var(--it-theme-1);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-classes-meta-box ul li:not(:last-child) {
    margin-right: 0;
    border-right: none;
  }
}

.it-classes-meta h6 {
  font-size: 18px;
  font-family: var(--it-ff-heading);
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-classes-meta h6 {
    font-size: 16px;
  }
}

@media (max-width: 767px) {
  .it-classes-meta h6 {
    font-size: 14px;
  }
}

.it-classes-meta span {
  font-size: 15px;
  color: var(--it-theme-1);
}

@media (max-width: 767px) {
  .it-classes-meta span {
    font-size: 14px;
  }
}

.it-classes-arrow-box button {
  font-size: 20px;
  height: 40px;
  width: 40px;
  line-height: 38px;
  text-align: center;
  border-radius: 50%;
  color: var(--it-theme-2);
  border: 1px solid var(--it-theme-2);
  padding: 0;
  transition: 0.3s;
}

.it-classes-arrow-box button:hover {
  color: var(--it-common-white);
  background-color: var(--it-theme-2);
}

.it-classes-arrow-box .classes-prev {
  position: absolute;
  bottom: -3px;
  left: 29%;
  z-index: 2;
}

.it-classes-arrow-box .classes-next {
  position: absolute;
  bottom: -3px;
  right: 29%;
  z-index: 2;
}

.it-classes-active {
  margin: -30px;
  padding: 30px;
}

.it-classes-dots .swiper-pagination-bullet {
  width: 122px;
  height: 2px;
  display: inline-block;
  border-radius: 0%;
  background-color: transparent;
  opacity: 1;
  margin: 5px 0px;
  transition: 0.3s;
  background-color: #E7F8FE;
}

@media (max-width: 767px) {
  .it-classes-dots .swiper-pagination-bullet {
    width: 30px;
  }
}

.it-classes-dots .swiper-pagination-bullet-active {
  background-color: var(--it-theme-2);
}

/*----------------------------------------*/
/*  12. error css start
/*----------------------------------------*/
.it-error-input-box {
  max-width: 500px;
  margin: 0 auto;
  margin-bottom: 40px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-error-input-box {
    width: 100%;
  }
}

.it-error-input-box input {
  border-radius: 5px;
  padding: 0 20px;
  height: 62px;
  line-height: 62px;
  padding-right: 50px;
  border: 1px solid rgba(13, 40, 37, 0.1);
}

.it-error-input-box input:focus {
  border: 1px solid var(--it-theme-1);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-error-input-box input {
    height: 55px;
    line-height: 55px;
    font-size: 14px;
  }
}

.it-error-content p {
  padding: 0 20px;
  padding-bottom: 5px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-error-content p {
    padding: 0 132px;
    font-size: 14px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-error-content p {
    padding: 0 90px;
    font-size: 14px;
  }
}

@media (max-width: 767px) {
  .it-error-content p {
    padding: 0px;
    font-size: 14px;
  }
}

.it-error-title {
  font-size: 50px;
  padding-bottom: 20px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-error-title {
    font-size: 45px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-error-title {
    font-size: 45px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-error-title {
    font-size: 41px;
  }
}

@media (max-width: 767px) {
  .it-error-title {
    font-size: 32px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .it-error-title {
    font-size: 34px;
  }
}

.it-error-input-icon {
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
}

.it-error-input-icon i {
  color: var(--it-common-black);
}

/*----------------------------------------*/
/*  18. gallery css start
/*----------------------------------------*/
.it-gallery-item:hover .it-gallery-thumb-icon {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -50%) scale(1);
}

.it-gallery-item:hover .it-gallery-thumb img {
  transform: scale(1.2);
}

.it-gallery-item:hover .it-gallery-thumb::after {
  opacity: 1;
  visibility: visible;
}

.it-gallery-thumb {
  position: relative;
  border-radius: 10px;
  overflow: hidden;
}

.it-gallery-thumb::after {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  height: 100%;
  width: 100%;
  border-radius: 10px;
  background-color: rgba(3, 20, 23, 0.6);
  opacity: 0;
  visibility: hidden;
  transition: 0.5s;
}

.it-gallery-thumb img {
  border-radius: 10px;
  width: 100%;
  transition: 1.3s all ease;
}

.it-gallery-thumb-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 2;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  visibility: hidden;
  transition: 0.7s;
}

.it-gallery-thumb-icon a {
  display: inline-block;
  height: 60px;
  width: 60px;
  line-height: 57px;
  text-align: center;
  border-radius: 50%;
  color: var(--it-common-white);
  background-color: var(--it-theme-1);
}

.it-gallery-shape-1 {
  position: absolute;
  left: 20%;
  top: 10%;
  animation: itrotate 3s ease-in-out 3s infinite alternate forwards;
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-gallery-shape-1 {
    left: 10%;
  }
}

.it-gallery-shape-2 {
  position: absolute;
  right: 6%;
  top: 7%;
  animation: rotate2 15s linear infinite;
}

.it-gallery-shape-3 {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
  animation: ittranslateY2 4s infinite alternate;
}

.tp-gallery-filter button {
  font-size: 24px;
  width: 25%;
  padding: 35px 0;
  transition: 0.4s;
  font-family: var(--it-ff-schoolbell);
  color: var(--it-common-black);
  background-color: #E7F8FE;
  border-right: 1px solid var(--it-theme-2);
}

@media (max-width: 767px) {
  .tp-gallery-filter button {
    width: 100%;
    padding: 10px 10px;
    font-size: 17px;
  }
}

.tp-gallery-filter button:last-child {
  border-right: none;
}

.tp-gallery-filter button.active {
  color: var(--it-common-white);
  background-color: var(--it-theme-2);
}

.tp-gallery-filter button:hover {
  color: var(--it-common-white);
  background-color: var(--it-theme-2);
}

/*----------------------------------------*/
/*  25. service css start
/*----------------------------------------*/
.it-service-icon {
  width: 190px;
  height: 180px;
  line-height: 180px;
  text-align: center;
  position: relative;
  margin: 0 auto;
  margin-bottom: 20px;
}

.it-service-icon::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 190px;
  height: 180px;
  background-color: var(--it-common-white);
  border-radius: 64% 36% 52% 48%/48% 39% 61% 52%;
  will-change: border-radius, transform, opacity;
  display: block;
  z-index: -1;
}

.it-service-icon span {
  color: var(--it-theme-1);
  position: relative;
  z-index: 2;
  display: inline-block;
}

.it-service-title {
  font-size: 22px;
  color: var(--it-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-service-title {
    font-size: 19px;
  }
}

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

.it-service-2-item-wrap {
  position: relative;
}

.it-service-2-item-wrap::after {
  content: "";
  position: absolute;
  top: -20px;
  left: 0px;
  height: 200px;
  width: 200px;
  border-radius: 10px;
  background-color: #E7F8FE;
  z-index: -1;
  transition: 0.3s;
}

.it-service-2-item-wrap:hover::after {
  background-color: var(--it-theme-1);
}

.it-service-2-item {
  margin: 0 20px;
  padding: 43px 30px;
  border-radius: 10px;
  background-color: var(--it-theme-2);
}

.it-service-2-icon {
  display: inline-block;
}

.it-service-2-icon>span {
  font-size: 50px;
  display: inline-block;
  height: 120px;
  width: 111px;
  line-height: 120px;
  text-align: center;
  color: var(--it-theme-2);
  background-color: var(--it-common-white);
  border-radius: 65% 85% 64% 97%;
}

.it-service-2-title {
  font-size: 22px;
  color: var(--it-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-service-2-title-box p {
    font-size: 14px;
  }
}

.it-service-2-content P {
  padding: 0 10px;
  color: var(--it-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-service-2-content P {
    font-size: 15px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-service-2-content P {
    font-size: 14px;
  }
}

.it-service-2-shape-1 {
  position: absolute;
  top: 2%;
  left: 0;
}

.it-service-2-shape-1>span {
  color: var(--it-theme-1);
}

.it-service-2-style-2 .it-service-2-shape-1 span {
  color: var(--it-common-black);
}

.it-service-2-style-2 .it-service-2-icon>span {
  color: var(--it-theme-1);
}

.it-service-2-style-2 .it-service-2-item {
  background-color: var(--it-theme-1);
}

.it-service-2-style-2:hover.it-service-2-item-wrap::after {
  background-color: var(--it-theme-2);
}

.it-service-2-style-3 .it-service-2-item {
  background-color: var(--it-common-black);
}

.it-service-2-style-3 .it-service-2-icon>span {
  color: var(--it-common-black);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-sv-details-top-content {
    margin-bottom: 60px;
  }
}

.it-sv-details-top-thumb {
  margin-right: 35px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-sv-details-top-thumb {
    margin-right: 0;
  }
}

.it-sv-details-top-thumb img {
  max-width: 100%;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-sv-details-top-thumb img {
    width: 100%;
    margin-bottom: 30px;
  }
}

.it-sv-details-title {
  color: var(--it-common-black);
  font-size: 50px;
  font-weight: 400;
  line-height: 55px;
  text-transform: uppercase;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-sv-details-title {
    font-size: 38px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-sv-details-title {
    font-size: 34px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-sv-details-title {
    font-size: 26px;
  }
}

.it-sv-details-title-sm {
  color: #4D5756;
  font-size: 17px;
  font-weight: 400;
  line-height: 32px;
  text-transform: capitalize;
  margin-bottom: 20px;
}

.it-sv-details-title-sm span {
  height: 20px;
  width: 20px;
  display: inline-block;
  text-align: center;
  line-height: 23px;
  border-radius: 20px;
  color: var(--it-common-white);
  font-size: 12px;
  background-color: var(--it-common-yellow);
  margin-right: 15px;
}

.it-sv-details-content-box {
  background-color: #F2F2F2;
  padding: 40px;
}

.it-sv-details-content-box p {
  color: #4D5756;
  font-size: 15px;
  font-weight: 400;
  line-height: 28px;
  margin-bottom: 0;
}

.it-sv-details-middle-thumb a {
  height: 80px;
  width: 80px;
  line-height: 80px;
  border-radius: 50%;
  display: inline-block;
  text-align: center;
  background-color: var(--it-common-white);
  color: var(--it-common-black);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-sv-details-middle-thumb a {
    height: 50px;
    width: 50px;
    line-height: 50px;
    font-size: 12px;
  }
}

.it-sv-details-middle-thumb a::after {
  position: absolute;
  content: "";
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.2);
  animation: borderanimate2 2s linear infinite;
  z-index: -1;
  border-radius: 50%;
}

.it-sv-details-sidebar {
  /* padding-left: 45px; */
  justify-content: end;
  display: flex;
  align-items: end;
  margin: 0 auto;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-sv-details-sidebar {
    padding-left: 0;
  }
}

.it-sv-details-sidebar-search {
  position: relative;
  width: 450px;
}

.it-sv-details-sidebar-search input {
  width: 100%;
  height: 60px;
  line-height: 60px;
  padding-left: 30px;
  text-transform: capitalize;
  background-color: transparent;
  border: none;
  padding-right: 60px;
  color: var(--it-common-black);
  border: 1px solid #E2E1E1;
  border-radius: 5px;
  outline: none;
}

.it-sv-details-sidebar-search button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 30px;
  border-radius: 50%;
  display: inline-block;
  color: var(--it-common-black);
  font-size: 18px;
}

.it-sv-details-sidebar-category {
  width: 100%;
  height: 60px;
  line-height: 60px;
  border: 1px solid #E2E1E1;
  border-radius: 5px;
  padding: 0px 30px;
  display: flex;
  justify-content: space-between;
  color: #4D5756;
  font-size: 16px;
  font-weight: 400;
  text-transform: capitalize;
  transition: 0.3s;
}

.it-sv-details-sidebar-category.active {
  background-color: var(--it-theme-1);
  border-color: var(--it-theme-1);
  color: var(--it-common-white);
}

.it-sv-details-sidebar-category:hover {
  background-color: var(--it-theme-1);
  border-color: var(--it-theme-1);
  color: var(--it-common-white);
}

.it-sv-details-sidebar-title {
  font-size: 23px;
  font-weight: 400;
  text-transform: uppercase;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-sv-details-sidebar-title {
    padding-left: 0;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-sv-details-top-content p {
    font-size: 14px;
  }
}

/*----------------------------------------*/
/*  22. newsletter css start
/*----------------------------------------*/
.it-newsletter-bg {
  border-radius: 5px;
  padding: 60px 75px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-newsletter-bg {
    padding: 60px 65px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-newsletter-bg {
    padding: 60px 25px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .it-newsletter-bg {
    padding: 60px 45px;
  }
}

@media (max-width: 767px) {
  .it-newsletter-bg {
    padding: 50px 15px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-newsletter-left {
    margin-bottom: 30px;
  }
}

.it-newsletter-title {
  font-size: 30px;
  color: var(--it-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-newsletter-title br {
    display: none;
  }
}

.it-newsletter-input-box input {
  height: 80px;
  line-height: 80px;
  font-size: 15px;
  font-weight: 400;
  border-radius: 10px;
  padding-right: 200px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .it-newsletter-input-box input {
    height: 60px;
    line-height: 60px;
  }
}

@media (max-width: 767px) {
  .it-newsletter-input-box input {
    height: 60px;
    line-height: 60px;
    padding-right: 20px;
  }
}

.it-newsletter-button-box {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .it-newsletter-button-box {
    right: 5px;
  }
}

@media (max-width: 767px) {
  .it-newsletter-button-box {
    position: static;
    transform: translateY(0%);
    margin-top: 20px;
  }
}

.it-newsletter-button-box .it-btn-sm {
  line-height: 50px;
  height: 50px;
  padding: 0 30px;
}

@media (max-width: 767px) {
  .it-newsletter-button-box .it-btn-sm {
    background-color: var(--it-theme-2);
  }
}

.it-newsletter-shape-1 {
  position: absolute;
  left: 40px;
  top: 0;
  z-index: -1;
}

.it-newsletter-2-ptb {
  padding: 100px 0;
  margin-top: 150px;
  margin-bottom: 10%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-newsletter-2-ptb {
    padding-top: 100px;
    padding-bottom: 150px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-newsletter-2-ptb {
    padding: 140px 0;
    margin-top: 45px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-newsletter-2-ptb {
    padding: 100px 0;
    margin: 0;
  }
}

.it-newsletter-2-content .it-newsletter-input-box {
  margin: 0 95px;
}

@media (max-width: 767px) {
  .it-newsletter-2-content .it-newsletter-input-box {
    margin: 0px;
  }
}

.it-newsletter-2-content .it-newsletter-input-box input {
  height: 60px;
  line-height: 60px;
  padding-right: 160px;
}

@media (max-width: 767px) {
  .it-newsletter-2-content .it-newsletter-input-box input {
    padding-right: 30px;
  }
}

.it-newsletter-2-content .it-newsletter-button-box {
  right: 6px;
}

.it-newsletter-2-shape-1 {
  position: absolute;
  top: 35%;
  left: 5%;
  animation: moving 9s linear infinite;
}

@media only screen and (min-width: 1600px) and (max-width: 1800px) {
  .it-newsletter-2-shape-1 {
    top: 45%;
    transform: scale(0.8);
  }
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .it-newsletter-2-shape-1 {
    left: 2%;
    transform: scale(0.75);
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-newsletter-2-shape-1 {
    top: 50%;
    left: 0%;
    transform: scale(0.7);
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-newsletter-2-shape-1 {
    top: 40%;
    left: -4%;
    transform: scale(0.5);
  }
}

.it-newsletter-2-shape-2 {
  position: absolute;
  right: 25%;
  bottom: 8%;
  animation: itswing 1.4s forwards infinite alternate;
  transform-origin: top right;
}

@media only screen and (min-width: 1600px) and (max-width: 1800px),
only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-newsletter-2-shape-2 {
    transform: scale(0.8);
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-newsletter-2-shape-2 {
    right: 31%;
    bottom: 2%;
    transform: scale(0.6);
  }
}

.it-newsletter-2-shape-3 {
  position: absolute;
  right: 5%;
  top: -1%;
  animation: rotate2 4s linear infinite;
}

@media only screen and (min-width: 1600px) and (max-width: 1800px),
only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-newsletter-2-shape-3 {
    transform: scale(0.8);
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-newsletter-2-shape-3 {
    transform: scale(0.6);
  }
}

.it-newsletter-2-shape-4 {
  position: absolute;
  right: 25%;
  bottom: 33%;
  animation: ittranslateX2 4s infinite alternate;
  width: 280px;
}

@media only screen and (min-width: 1600px) and (max-width: 1800px),
only screen and (min-width: 1400px) and (max-width: 1599px),
only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-newsletter-2-shape-4 {
    transform: scale(0.8);

  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-newsletter-2-shape-4 {
    transform: scale(0.5);
    right: 20%;
    bottom: 39%;
  }
}

.it-newsletter-2-shape-5 {
  position: absolute;
  top: -17%;
  left: 37%;
  z-index: -1;
}

.it-newsletter-4 {
  position: absolute;
  top: 2%;
  left: 37%;
  z-index: -1;
  width: 400px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-newsletter-2-shape-5 {
    display: none;
  }
}

.it-newsletter-2-shape-6 {
  position: absolute;
  top: -21%;
  left: 0;
  z-index: -2;
  width: 100%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-newsletter-2-shape-6 {
    display: none;
  }
}

.it-newsletter-2-shape-7 {
  position: absolute;
  bottom: -25%;
  left: 0;
  z-index: -2;
  width: 100%;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-newsletter-2-shape-7 {
    bottom: -16%;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-newsletter-2-shape-7 {
    display: none;
  }
}

/*----------------------------------------*/
/*  21. menu css start
/*----------------------------------------*/
.it-header-menu nav ul li .has-home-img {
  width: 1060px;
  opacity: 0;
  visibility: hidden;
  padding: 30px 30px 10px 30px;
  background-color: var(--it-common-white);
  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
}

.it-header-menu nav ul li .has-home-img .home-img {
  padding: 0px 10px;
  position: relative;
  margin-bottom: 20px;
}

.home-img-btn {
  position: absolute;
  bottom: 20%;
  left: 0;
  right: 0;
  text-align: center;
  opacity: 0;
  visibility: hidden;
  transition: 0.4s;
}

.home-img-title {
  font-size: 15px;
  margin-bottom: 0;
  display: inline-block;
  font-weight: 600;
  color: var(--it-common-black);
  text-decoration: transparent;
  font-family: var(--it-ff-body);
}

.home-img-title:hover {
  text-decoration: underline;
}

.home-img-thumb {
  position: relative;
  border: 1px solid rgba(0, 0, 0, 0.1);
}

.home-img-thumb:hover .home-img-btn {
  opacity: 1;
  visibility: visible;
  bottom: 50%;
  transform: translateY(50%);
}

.it-header-wrap {
  position: relative;
}

.it-menu-mobile .it-submenu {
  display: none;
}

.it-menu-mobile .it-menu-content {
  margin-bottom: 70px;
  margin-top: 70px;
}

.it-menu-mobile .home-img {
  margin-bottom: 40px;
}

.it-menu-mobile ul {
  position: static;
  display: block;
  box-shadow: none;
}

.it-menu-mobile ul li {
  list-style: none;
  position: relative;
  width: 100%;
  padding: 0;
}

.it-menu-mobile ul li:not(:last-child)>a {
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.it-menu-mobile ul li.has-dropdown>a .dropdown-toggle-btn {
  position: absolute;
  right: 0;
  top: 25%;
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  transform: translateY(-2px);
  font-size: 18px;
  color: #7F8387;
  font-family: "Font Awesome 5 Pro";
  transition: all 0.3s ease-in-out;
  z-index: 1;
  width: 25px;
  height: 25px;
  line-height: 22px;
  text-align: center;
  border: 1px solid rgba(255, 255, 255, 0.12);
  transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out;
}

.it-menu-mobile ul li.has-dropdown>a .dropdown-toggle-btn i {
  transition: all 0.3s ease-in-out;
  margin-left: 2px;
}

.it-menu-mobile ul li.has-dropdown>a .dropdown-toggle-btn.dropdown-opened i {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

.it-menu-mobile ul li.has-dropdown>a .dropdown-toggle-btn:hover {
  background-color: var(--it-theme-1);
  border-color: var(--it-theme-1);
  color: var(--it-common-white);
}

.it-menu-mobile ul li.has-dropdown>a .dropdown-toggle-btn:hover i {
  color: var(--it-common-white);
}

.it-menu-mobile ul li.has-dropdown>a.expanded {
  color: var(--it-theme-1);
}

.it-menu-mobile ul li.has-dropdown>a.expanded .dropdown-toggle-btn.dropdown-opened {
  background-color: var(--it-theme-1);
  border-color: var(--it-theme-1);
  color: var(--it-common-white);
}

.it-menu-mobile ul li.has-dropdown>a.expanded .dropdown-toggle-btn.dropdown-opened i {
  color: var(--it-common-white);
}

.it-menu-mobile ul li.has-dropdown:hover>a::after {
  color: var(--it-theme-green);
}

.it-menu-mobile ul li:last-child a span {
  border-bottom: 0;
}

.it-menu-mobile ul li>a {
  display: block;
  font-size: 16px;
  color: var(--it-common-white);
  position: relative;
  padding: 10px 0;
  padding-right: 20px;
}

.it-menu-mobile ul li>a svg {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  transform: translateY(-2px);
}

.it-menu-mobile ul li>a>i {
  display: inline-block;
  width: 11%;
  margin-right: 13px;
  -webkit-transform: translateY(4px);
  -moz-transform: translateY(4px);
  -ms-transform: translateY(4px);
  -o-transform: translateY(4px);
  transform: translateY(4px);
  font-size: 21px;
  line-height: 1;
}

.it-menu-mobile ul li>a .menu-text {
  font-size: 16px;
  line-height: 11px;
  border-bottom: 1px solid #EAEBED;
  width: 82%;
  display: inline-block;
  padding: 19px 0 17px;
}

.it-menu-mobile ul li img {
  width: 100%;
}

.it-menu-mobile ul li ul {
  padding: 0;
}

.it-menu-mobile ul li ul li {
  padding: 0;
}

.it-menu-mobile ul li ul li a {
  margin-left: auto;
  width: 93%;
  padding: 10px 5%;
  text-shadow: none !important;
  visibility: visible;
  padding-left: 0;
  padding-right: 20px;
}

.it-menu-mobile ul li ul li li a {
  width: 88%;
  padding: 10px 7%;
  padding-left: 0;
  padding-right: 20px;
}

.it-menu-mobile ul li ul li li li a {
  width: 83%;
  padding: 10px 9%;
  padding-left: 0;
  padding-right: 20px;
}

.it-menu-mobile ul li ul li li li li a {
  width: 68%;
  padding: 10px 11%;
  padding-left: 0;
  padding-right: 20px;
}

.it-menu-mobile ul li:hover>a {
  color: var(--it-theme-1);
}

.it-menu-mobile ul li:hover>a::after {
  color: var(--it-theme-1);
}

.it-menu-mobile ul li:hover>a .dropdown-toggle-btn i {
  color: var(--it-theme-1);
}

.it-menu-mobile ul li:hover .mega-menu {
  visibility: visible;
  opacity: 1;
  top: 0;
}

.it-menu-mobile ul li .mega-menu,
.it-menu-mobile ul li .submenu {
  position: static;
  min-width: 100%;
  padding: 0;
  box-shadow: none;
  visibility: visible;
  opacity: 1;
  display: none;
}

.it-menu-mobile ul li .mega-menu li,
.it-menu-mobile ul li .submenu li {
  float: none;
  display: block;
  width: 100%;
  padding: 0;
}

.it-menu-mobile ul li .mega-menu li:hover a .dropdown-toggle-btn,
.it-menu-mobile ul li .submenu li:hover a .dropdown-toggle-btn {
  color: var(--it-theme-1);
}

.it-menu-mobile .it-menu-content ul li:not(:last-child) .home-img-title a {
  border-bottom: none;
}

.it-menu-mobile * ul,
.it-menu-mobile * li {
  transition: none !important;
}

/*----------------------------------------*/
/*  16. footer css start
/*----------------------------------------*/
.it-footer-bg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  /* animation: ittranslateX2 2s infinite alternate; */
  width: 100%;
}

.it-footer-bg::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.918);
  /* black opacity */
  z-index: 1;
}

.it-footer-bg img {
  width: 100%;
  display: block;
}

.it-footer-title {
  font-size: 22px;
  margin-bottom: 38px;
  padding-top: 10px;
  color: var(--it-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-footer-title {
    font-size: 20px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-footer-title {
    font-size: 19px;
  }
}

.it-footer-text p {
  font-size: 19px;
  color: var(--it-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .it-footer-text p {
    font-size: 14px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-footer-text p {
    padding-right: 20px;
    font-size: 14px;
  }
}

.it-footer-social a {
  height: 52px;
  width: 52px;
  line-height: 52px;
  border-radius: 50%;
  display: inline-block;
  text-align: center;
  margin-right: 9px;
  color: var(--it-theme-1);
  background-color: var(--it-common-white);
  transition: 0.3s;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-footer-social a {
    height: 40px;
    width: 40px;
    line-height: 40px;
  }
}

.it-footer-social a:hover {
  color: var(--it-common-white);
  background-color: var(--it-theme-1);
}

.it-footer-social.social-color a:hover {
  color: var(--it-theme-1);
  background-color: var(--it-common-white);
}

.it-footer-list-2 ul li {
  list-style-type: none;
  color: var(--it-common-white);
  font-size: 19px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-footer-list-2 ul li {
    font-size: 14px;
  }
}

.it-footer-list-2 ul li:not(:last-child) {
  margin-bottom: 12px;
}

.it-footer-list-2 ul li a {
  transition: 0.3s;
  position: relative;
  display: inline-block;
  padding-left: 24px;
}

.it-footer-list-2 ul li a::after {
  position: absolute;
  content: "";
  top: 50%;
  left: 0;
  width: 5px;
  height: 2px;
  transform: translateY(-50%);
  background-color: var(--it-common-white);
  transition: 0.3s;
}

.it-footer-list-2 ul li a:hover {
  color: var(--it-theme-1);
}

.it-footer-list-2 ul li a:hover::after {
  width: 10px;
  background-color: var(--it-theme-1);
}

.it-footer-list ul li {
  list-style-type: none;
  color: var(--it-common-white);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-footer-list ul li {
    font-size: 18px;
  }
}

.it-footer-list ul li:not(:last-child) {
  margin-bottom: 5px;
}

.it-footer-list ul li a {
  transition: 0.3s;
  position: relative;
  display: inline-block;
  padding-left: 24px;
}

.it-footer-list ul li a::after {
  position: absolute;
  content: "";
  top: 50%;
  left: 0;
  width: 5px;
  height: 2px;
  transform: translateY(-50%);
  background-color: var(--it-common-white);
  transition: 0.3s;
}

.it-footer-list ul li a:hover {
  color: var(--it-theme-1);
}

.it-footer-list ul li a:hover::after {
  width: 10px;
  background-color: var(--it-theme-1);
}

.it-footer-contact ul li {
  list-style-type: none;
  color: var(--it-common-white);
  position: relative;
  padding-left: 70px;
  font-size: 19px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-footer-contact ul li {
    font-size: 14px;
  }
}

.it-footer-contact ul li:not(:last-child) {
  margin-bottom: 32px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-footer-contact ul li:not(:last-child) {
    margin-bottom: 29px;
  }
}

.it-footer-contact ul li:first-child {
  margin-bottom: 25px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-footer-contact ul li:first-child {
    margin-bottom: 17px;
  }
}

.it-footer-contact ul li:first-child>span {
  top: 8px;
}

.it-footer-contact ul li>a:hover {
  color: var(--it-theme-1);
}

.it-footer-contact ul li span {
  height: 52px;
  width: 52px;
  line-height: 52px;
  text-align: center;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
  top: -10px;
  left: 0;
  background: rgba(255, 255, 255, 0.1);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-footer-contact ul li span {
    height: 45px;
    width: 45px;
    line-height: 45px;
  }
}

.it-footer-contact-icon>span {
  height: 70px;
  width: 70px;
  line-height: 70px;
  border-radius: 50%;
  display: inline-block;
  margin-right: 30px;
  text-align: center;
  color: var(--it-common-white);
  background-color: var(--it-theme-2);
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-footer-contact-icon>span {
    height: 50px;
    width: 50px;
    line-height: 50px;
    margin-right: 20px;
  }
}

.it-footer-contact-text>span {
  display: block;
  padding-bottom: 3px;
  color: #FFFFFF;
}

.it-footer-contact-text>a {
  font-size: 22px;
  font-weight: 500;
  color: var(--it-common-white);
  font-family: var(--it-ff-heading);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .it-footer-contact-text>a {
    font-size: 19px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-footer-contact-text>a {
    font-size: 16px;
  }
}

.it-footer-gallery img {
  border-radius: 5px;
}

.it-footer-widget-gallery-single-item {
  display: inline-block;
}

.it-footer-widget-gallery-all {
  display: grid;
  grid: auto auto/auto auto auto;
  column-gap: 10px;
  row-gap: 10px;
  width: 260px;
  height: auto;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-footer-widget-gallery-all {
    width: 100%;
  }
}

.footer-col-2 {
  margin-left: 92px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-col-2 {
    margin-left: 70px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .footer-col-2 {
    margin-left: 0px;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .footer-col-2 {
    margin-left: 30px;
  }
}

.footer-col-3 {
  padding-left: 5px;
}

@media only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .footer-col-3 {
    padding-left: 0;
  }
}

.footer-col-4 {
  margin-left: -20px;
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .footer-col-4 {
    margin-left: 0;
  }
}

@media only screen and (min-width: 576px) and (max-width: 767px) {
  .footer-col-4 {
    margin-left: 30px;
  }
}

@media only screen and (min-width: 440px) and (max-width: 575px) {
  .footer-col-4 {
    margin-right: 120px;
  }
}

.footer-col-2-2 {
  margin-left: 120px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .footer-col-2-2 {
    margin-left: 95px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-col-2-2 {
    margin-left: 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .footer-col-2-2 {
    margin-left: 0;
  }
}

.footer-col-2-3 {
  margin-left: 90px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .footer-col-2-3 {
    margin-left: 60px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-col-2-3 {
    margin-left: 50px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .footer-col-2-3 {
    margin-left: 0;
  }
}

.footer-col-2-4 {
  margin-left: 48px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .footer-col-2-4 {
    margin-left: 0;
    height: 350px;
  }
}

.it-copyright-height {
  padding: 9px 0;
}

.it-copyright-height .it-footer-social a {
  height: 30px;
  width: 30px;
  line-height: 30px;
  font-size: 16px;
}

.it-copyright-text p {
  color: var(--it-common-white);
  margin-bottom: 0;
  text-transform: capitalize;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px) {
  .it-copyright-text p {
    font-size: 14px;
  }
}

@media sm {
  .it-copyright-text p {
    margin-bottom: 0px;
  }
}

@media (max-width: 767px) {
  .it-copyright-text p {
    font-size: 15px;
    margin-bottom: 15px;
  }
}

.it-copyright-2-text p {
  color: var(--it-common-white);
  margin-bottom: 0;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px),
only screen and (min-width: 992px) and (max-width: 1199px),
only screen and (min-width: 768px) and (max-width: 991px),
(max-width: 767px) {
  .it-copyright-2-text p {
    font-size: 14px;
  }
}

/*# sourceMappingURL=main.css.map */


/* SECTION BACKGROUND */
.eduplay-section {

  padding-top: 70px;
}

@media (max-width:425px) {
  .eduplay-section {

    padding: 20px;
  }
}

/* CONTAINER */
.eduplay-container {
  max-width: 1350px;
  margin: auto;
  text-align: center;
}

/* MAIN HEADING */
.eduplay-title {
  font-size: 36px;
  font-weight: 700;
  color: #1a4d1a;
  margin-bottom: 18px;
}

/* MAIN DESCRIPTION */
.eduplay-desc {
  font-size: 18px;
  color: #333;
  max-width: 900px;
  margin: 0 auto 45px auto;
}

/* BOX GRID */
.eduplay-box-wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
  gap: 35px;
  margin-top: 40px;
}

@media (max-width:425px) {
  .eduplay-box-wrapper {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 35px;
    margin-top: 40px;
  }

  .step-number {
    background: #2e7d3220;
    color: #2e7d32;
    font-size: 24px;
    font-weight: 700;
    padding: 10px 18px;
    border-radius: 10px;
    width: 100%;
    text-align: center;
  }
}

/* PREMIUM BOX STYLE */
.eduplay-box {
  background: #e8f7e852;
  border-radius: 20px;
  padding: 35px 30px;
  border: 1px solid #dcecdc;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.07);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
  align-items: center;
  display: flex;
  flex-direction: column;
}

/* TOP GRADIENT LINE */
.eduplay-box::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 6px;
  background: linear-gradient(90deg, #4CAF50, #2E7D32);
  border-radius: 20px 20px 0 0;
}

/* HOVER EFFECT */
.eduplay-box:hover {
  transform: translateY(-8px);
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.12);
}

/* ICON */
.eduplay-box .icon {
  width: 55px;
  height: 55px;
  margin-bottom: 20px;
  border-radius: 14px;
  background: #48733938;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 26px;
}

/* BOX TITLE */
.eduplay-box h3 {
  font-size: 22px;
  margin-bottom: 14px;
  font-weight: 700;
  color: #1a3f1a;
}

/* BOX PARAGRAPH */
.eduplay-box p {
  font-size: 16px;
  color: #444;
  line-height: 1.7;
  margin: 0;
  text-transform: capitalize;
}

/* SECTION */
.infographic-section {
  padding: 40px 20px;
  background: #ffffff;
}

.infographic-container {
  max-width: 1200px;
  margin: auto;
  text-align: center;
}

.infographic-title {
  font-size: 36px;
  font-weight: 700;
  color: #1a4d1a;
  margin-bottom: 100px;
  text-align: center;
}

/* GRID */
.infographic-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 55px;
}

/* MAIN BOX */
.infographic-box {
  position: relative;
  background: #ffffff;
  border-radius: 45px 45px 60px 60px;
  padding: 55px 25px 35px;
  border: 2px solid #48733947;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.08);
  text-align: center;
  transition: .3s ease;
}

.infographic-box:hover {
  transform: translateY(-8px);
  box-shadow: 0 16px 35px rgba(0, 0, 0, 0.12);
}

/* TOP HALF-CIRCLE NUMBER BADGE */
.jam-steps-section {
  /* background: #ffffff; */
  padding: 80px 0px;
}

.jam-title {
  font-size: 45px;
  font-weight: 700;
  color: #253542;
  margin-bottom: 10px;
}

@media (max-width:767px) {
  .jam-title {
    font-size: 35px;
    font-weight: 700;
    color: #253542;
    margin-bottom: 10px;
  }

  .edu-2 {
    color: var(--it-theme-2) !important;
    font-family: var(--it-ff-body) !important;
    font-size: 35px;
  }
}

.jam-subtitle {
  font-size: 18px;
  color: #556270;
  max-width: 700px;
  margin: auto;
  margin-bottom: 60px;
  text-transform: capitalize;
}

/* GRID */
.jam-steps-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 50px;
  justify-content: center;
}

/* BOX */
.jam-step-box {
  text-align: center;
  padding: 20px;
  transition: 0.35s ease;
  transform: translateY(0);
}

.jam-step-box:hover {
  transform: translateY(-10px) scale(1.06);
}

.jam-step-box:hover .jam-circle {
  transform: scale(1.15);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
  transition: 0.3s ease;
  /* border: 1px solid var(--it-theme-2); */
}

/* CIRCLE NUMBER */
.jam-circle {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 22px;
  font-weight: 700;
  margin: 0 auto 15px;
  color: #253542;
  transition: 0.2s ease;
}

/* Smooth text fade on hover */
.jam-step-box:hover h4 {
  color: var(--it-theme-2);
  transition: 0.3s ease;
}

.jam-step-box:hover p {
  opacity: 0.9;
  transition: 0.3s ease;
}

/* HEADINGS */
.jam-step-box h4 {
  font-size: 18px;
  font-weight: 700;
  color: #253542;
  margin-bottom: 8px;
}

/* TEXT */
.jam-step-box p {
  font-size: 16px;
  color: #556270;
  margin: auto;
  text-transform: capitalize;
}

/* BUTTON */

.jam-btn:hover {
  background: #25662c;
  transform: scale(1.05);
}

/* Background Fun Shapes */
.jam-fun-shapes .shape {
  position: absolute;
  opacity: 0.6;
  z-index: 0;
}

.star-1 {
  top: 80px;
  left: 30px;
  width: 45px;
  animation: float 4s infinite ease-in-out;
}

.star-2 {
  top: 160px;
  right: 50px;
  width: 55px;
  animation: float 5s infinite ease-in-out;
}

.triangle {
  bottom: 120px;
  left: 50%;
  width: 60px;
  transform: translateX(-50%);
  animation: float 3.5s infinite ease-in-out;
}

@keyframes float {
  0% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-12px);
  }

  100% {
    transform: translateY(0);
  }
}

/* Step Box */
.jam-step-box {
  text-align: center;
  padding: 25px;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.08);
  transition: 0.35s ease;
  position: relative;
  z-index: 2;
}

.jam-step-box:hover {
  transform: translateY(-12px) scale(1.07);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12);
}

/* Icons inside each step */
.jam-icon {
  font-size: 35px;
  margin-bottom: 12px;
  animation: pop 0.8s ease;
}

@keyframes pop {
  0% {
    transform: scale(0.6);
    opacity: 0;
  }

  100% {
    transform: scale(1);
    opacity: 1;
  }
}

/* Stronger hover color on headings */
.jam-step-box:hover h4 {
  color: var(--it-theme-2);
  letter-spacing: 1px;
}

/* Soft fade */
.jam-step-box:hover p {
  opacity: 1;
}

/* Circle Number */
.jam-circle {
  width: 62px;
  height: 62px;
  font-size: 22px;
  font-weight: 700;
  border-radius: 50%;
  margin-bottom: 12px;
  transition: 0.25s ease;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
}


.jams-btn-space {
  text-align: center;
  margin-top: 50px;
}

.jams-btn-space-1 {
  text-align: start;
  margin-top: 15px;
}

/* Title Enhancement */
.jam-title span.edu-2 {
  position: relative;
}

.jam-title span.edu-2:after {
  content: "✨";
  font-size: 30px;
  margin-left: 6px;
  animation: sparkle 1.5s infinite ease-in-out;
}

@keyframes sparkle {
  0% {
    opacity: 0;
    transform: rotate(0deg);
  }

  50% {
    opacity: 1;
    transform: rotate(25deg);
  }

  100% {
    opacity: 0;
    transform: rotate(0deg);
  }
}

.faqs-images {
  width: 400px;
  height: 150px;
  background-size: cover;
  border-radius: 20px;
}

.brave-steps {
  padding: 70px 20px;
  background: #f7fcf7;
}

.steps-wrapper {
  /* max-width: 900px; */
  margin: auto;
  display: flex;
  flex-direction: column;
  gap: 25px;
}

.step-box {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  width: 100%;
  padding: 20px 25px;
  background: #fff;
  border-radius: 14px;
  border: 1px solid #e0e7e0;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
  transition: .3s ease;
  height: 135px;
}

.step-box:hover {
  transform: translateX(6px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12);
}

.step-box-1 {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  width: 100%;
  padding: 20px 25px;
  background: #fff;
  border-radius: 14px;
  border: 1px solid #e0e7e0;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
  transition: .3s ease;
  height: 100%;
}

.step-box-1:hover {
  transform: translateX(6px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12);
}

@media (max-width:768px) {
  .step-box {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    width: 100%;
    padding: 20px 15px;
    background: #fff;
    border-radius: 14px;
    border: 1px solid #e0e7e0;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.06);
    transition: .3s ease;
    height: 100% !important;
  }
}

.step-number {
  background: #2e7d3220;
  color: #2e7d32;
  font-size: 24px;
  font-weight: 700;
  padding: 10px 18px;
  border-radius: 10px;
  min-width: 70px;
  text-align: center;
}

.step-content h4 {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 6px;
  color: #1a3f1a;
}

.step-content p {
  color: #555;
  margin: 0;
  line-height: 1.6;
  text-transform: capitalize;
}

/* 🌟 MAIN WRAPPER */
.it-testimonial-area {
  background: linear-gradient(135deg, #1e4d2b 0%, #3b7d47 100%);
  /* padding: 120px 0; */
  position: relative;
  overflow: hidden;
  margin-bottom: 145px;
}

@media (max-width:1024px) {
  .it-testimonial-area {
    background: linear-gradient(135deg, #1e4d2b 0%, #3b7d47 100%);
    /* padding: 120px 0; */
    position: relative;
    overflow: hidden;
    margin-bottom: 50px;
  }
}

/* 🟢 TITLE */
.it-testimonial-section-title .it-section-title {
  font-size: 42px;
  font-weight: 700;
  color: #ffffff;
  text-transform: capitalize;
  /* margin-bottom: 45px; */
}

/* ⭐ STAR RATINGS */
.it-testimonial-rate i {
  color: #ffd700;
  font-size: 20px;
  margin: 0 2px;
}

/* 🧊 TESTIMONIAL CARD (Glass Effect) */
.it-testimonial-content {
  background: rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(12px);
  border-radius: 20px;
  padding: 35px;
  text-align: center;
  color: #fff;
  box-shadow: 0 10px 35px rgba(0, 0, 0, 0.25);
  transition: 0.35s ease;
}

/* Hover animation */
.it-testimonial-content:hover {
  /* transform: translateY(-10px) scale(1.03); */
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.3);
}

/* 📝 QUOTE TEXT */
.it-testimonial-text p {
  font-size: 17px;
  line-height: 1.65;
  color: #e9f5eb;
}

/* 👤 AUTHOR BOX */
.it-testimonial-author-box {
  margin-top: 20px;
}

/* Avatar */
.it-testimonial-avata img {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  border: 3px solid #ffffff;
  box-shadow: 0 0 12px rgba(255, 255, 255, 0.4);
}

/* Author name */
.it-testimonial-author-info h6 {
  font-size: 20px;
  color: #ffffff;
  margin-bottom: 4px;
  font-weight: 600;
}

.it-testimonial-author-info span {
  font-size: 14px;
  color: #d8eee1;
}

/* 🟩 SWIPER WRAPPER */
.it-testimonial-wrap {
  margin-top: 40px;
}

/* ⬅️➡️ ARROW BUTTONS */
.it-testimonial-arrow-box button {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: none;
  background: #ffffff;
  color: #1f4b30;
  font-size: 20px;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.25);
  transition: 0.3s ease;
}

.it-testimonial-arrow-box button:hover {
  background: #ffffff;
  color: var(--it-theme-2);
}

/* Position arrows */
.testimonial-prev {
  position: absolute;
  top: 50%;
  left: -60px;
  transform: translateY(-50%);
}

.testimonial-next {
  position: absolute;
  top: 50%;
  right: -60px;
  transform: translateY(-50%);
}

/* 📱 RESPONSIVE */
@media (max-width: 768px) {

  .testimonial-prev,
  .testimonial-next {
    display: none;
  }

  .it-testimonial-content {
    padding: 25px;
  }
}

/* --- CLOUD BACKGROUND SECTION (MATCHES TESTIMONIAL STYLE) --- */
.cloud-bg-section {
  position: relative;
  background-image: url("https://eduplaynation.2min.cloud/assets/img/testimonial/image19.png");
  /* background-image: url("http://localhost/eduplaynation/public/assets/img/testimonial/image19.png"); */
  background-repeat: no-repeat;

  /* MAKE CLOUD BIGGER */
  background-size: 1350px auto;
  /* bigger cloud */
  background-position: top center;

  padding-top: 150px;
  /* extra spacing inside cloud */
  padding-bottom: 150px;
  /* margin-top: 80px; */
  overflow: visible;
  /* cloud won't cut */
}

@media (max-width:1920px) {
  .cloud-bg-section {
    position: relative;
    background-image: url("https://eduplaynation.2min.cloud/assets/img/testimonial/image19.png");
    /* background-image: url("http://localhost/eduplaynation/public/assets/img/testimonial/image19.png"); */
    background-repeat: no-repeat;

    /* MAKE CLOUD BIGGER */
    background-size: 1550px auto;
    /* bigger cloud */
    background-position: top center;

    padding-top: 150px;
    /* extra spacing inside cloud */
    padding-bottom: 250px;

    overflow: visible;
    /* cloud won't cut */
  }
}

@media (max-width:1680px) {
  .cloud-bg-section {
    position: relative;
    background-image: url("https://eduplaynation.2min.cloud/assets/img/testimonial/image19.png");
    /* background-image: url("http://localhost/eduplaynation/public/assets/img/testimonial/image19.png"); */
    background-repeat: no-repeat;

    /* MAKE CLOUD BIGGER */
    background-size: 1350px auto;
    /* bigger cloud */
    background-position: top center;

    padding-top: 150px;
    /* extra spacing inside cloud */
    padding-bottom: 150px;

    overflow: visible;
    /* cloud won't cut */
  }
}


@media (max-width:767px) {
  .cloud-bg-section {

    padding-top: 150px;
    /* extra spacing inside cloud */
    padding-bottom: 100px;

    overflow: visible;
    /* cloud won't cut */
  }
}

.it-faq-wrap {
  width: 100%;
  margin: auto;
}

/* Shapes */
.cloud-bg-section img:not(.testimonial-img) {
  position: relative;
  z-index: 1;
}

.testimonial-img {
  border-radius: 10px;
}

/* Same style as testimonial shapes */
.cloud-shape-1 {
  position: absolute;
  top: -20px;
  right: 60px;
  opacity: .25;
}

.cloud-shape-2 {
  position: absolute;
  bottom: 40px;
  left: 80px;
  opacity: .30;
}

.cloud-shape-3 {
  position: absolute;
  top: 0;
  left: 0;
  opacity: .18;
}

.cloud-shape-4 {
  position: absolute;
  right: 0;
  bottom: -20px;
  opacity: .20;
}

/* Optional Floating Animation */
.cloud-bg-section img {
  animation: float 6s ease-in-out infinite;
}

@keyframes float {
  0% {
    transform: translateY(0px);
  }

  50% {
    transform: translateY(-12px);
  }

  100% {
    transform: translateY(0px);
  }
}

.about-slide-img {
  border-radius: 16px;
  width: 100%;
  height: 260px;
  object-fit: cover;
}

.about-slide-content {
  padding: 30px;
  border-radius: 25px;
  background: rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(4px);
}

.about-slide-content p {
  font-size: 18px;
  color: #fff;
  line-height: 1.6;
  margin-bottom: 20px;
}

.about-slide-content h5 {
  color: #fff;
  font-weight: 600;
}

/* Move arrows OUTSIDE the testimonial box */
.it-about-slider .swiper-button-prev,
.it-about-slider .swiper-button-next {
  top: 50%;
  transform: translateY(-50%);
  width: 45px;
  height: 45px;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  backdrop-filter: blur(4px);
  display: flex;
  justify-content: center;
  align-items: center;
}

.it-about-slider .swiper-button-prev {
  left: -55px;
  /* Move arrow outside left */
}

.it-about-slider .swiper-button-next {
  right: -55px;
  /* Move arrow outside right */
}

/* Style arrows */
.it-about-slider .swiper-button-prev:after,
.it-about-slider .swiper-button-next:after {
  font-size: 18px;
  color: white;
}

.it-about-slider {
  width: 65%;
  /* perfect width inside cloud */
  margin: 60px auto 0;
  /* center slider under title */
}

.about-pagination .swiper-pagination-bullet {
  background: #fff;
  opacity: 0.4;
}

.about-pagination .swiper-pagination-bullet-active {
  background: #fff;
  opacity: 1;
}

/* .search__logo {
  color: rgb(255, 255, 255);
  font-size: 40px;
  font-family: 'MATTEKEK';
}

.search__logo a{
  color: rgb(255, 255, 255);
  font-size: 40px;
  font-family: 'MATTEKEK';
  text-transform: none;
} */


/* Better slider container */
.it-about-slider {
  width: 70%;
  margin: 50px auto;
}

@media (max-width:425px) {
  .it-about-slider {
    width: 100%;
    margin: 0px auto;
  }
}

/* Full premium testimonial card */
.testimonial-card {
  display: flex;
  align-items: center;
  justify-content: space-between;

  /* background: rgba(255, 255, 255, 0.12); */
  /* backdrop-filter: blur(12px); */
  border-radius: 20px;

  padding: 50px;
  gap: 35px;

  width: 100%;
  margin: auto;
  height: 380px;
  /* FIX CARD HEIGHT */
}

/* IMAGE SECTION */
.t-left-img {
  flex: 0 0 32%;
  /* 32% width only */
}

.t-left-img img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  border-radius: 18px;
}

/* TEXT SECTION */
.t-right-content {
  flex: 1;
}

.t-text {
  color: #fff;
  font-size: 18px;
  line-height: 1.6;
  font-weight: 400;
  margin-top: 10px;
  text-transform: capitalize;
}

.t-author {
  color: #FFF;
  font-size: 22px;
  font-weight: 600;
}

.t-text-final {
  color: #fff;
  font-size: 20px;
  line-height: 1.6;
  font-weight: 400;
}

.t-author-final {
  margin-top: 18px;
  color: #fff;
  font-size: 22px;
  font-weight: 700;
}

.it-about-slider,
.it-about-slider .swiper-wrapper {
  /* overflow: visible; */
}

.about-prev,
.about-next {
  color: #fff;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  /* background: rgba(255,255,255,0.2); */
  backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ARROWS POSITION FIX */

.about-next {
  position: absolute;
  right: 18%;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
}

.about-prev {
  position: absolute;
  left: 16%;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
}

@media (max-width:1440px) {
  .about-next {
    position: absolute;
    right: 13%;
    top: 55%;
    transform: translateY(-50%);
    z-index: 10;
  }

  .about-prev {
    position: absolute;
    left: 11%;
    top: 55%;
    transform: translateY(-50%);
    z-index: 10;
  }
}

@media (max-width:1024px) {
  .it-about-slider {
    width: 100%;
  }

  .testimonial-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 20px;
    padding: 50px;
    gap: 35px;
    width: 100%;
    margin: auto;
    height: 470px;
  }
}

@media (max-width:768px) {
  .about-next {
    position: absolute;
    right: 2%;
    top: 55%;
    transform: translateY(-50%);
    z-index: 10;
  }

  .about-prev {
    position: absolute;
    left: 2%;
    top: 55%;
    transform: translateY(-50%);
    z-index: 10;
  }
}


@media (max-width:425px) {
  .it-teacher-2-shape-1 {
    display: none;
  }
}

/* DOTS CENTER */
.about-pagination {
  position: absolute;
  bottom: 18% !important;
  left: 48%;
  transform: translateX(-50%);
  gap: 10px;
  display: flex;
}

.testimonial-right {
  width: 40%;
}


.testimonial-right img {
  height: 250px;
  width: 100%;
}

.testimonial-left {
  width: 60%;
}

/* Pagination Dots */
.about-pagination .swiper-pagination-bullet {
  background: #fff;
  opacity: .4;
}

.about-pagination .swiper-pagination-bullet-active {
  opacity: 1;
}

@media (max-width:1024px) {
  .about-pagination {
    position: absolute;
    bottom: 26% !important;
    left: 50%;
    transform: translateX(-50%);
    gap: 10px;
    display: flex;
  }
}

@media (max-width:425px) {
  .testimonial-right {
    display: none;
  }

  .testimonial-left {
    width: 100%;
  }

  .testimonial-card {
    height: 540px;
    width: 100%;
  }

  .about-pagination {
    position: absolute;
    bottom: 0% !important;
    left: 0%;
    transform: translateX(-50%);
    gap: 10px;
    display: flex;
  }
}

.jam-card.pro {
  background: #ffffff;
  border-radius: 20px;
  padding: 20px;
  border: 1px solid #e5e5e5;
  box-shadow: 0 10px 35px rgba(0, 0, 0, 0.08);
  transition: 0.3s ease;
  height: 350px;
}

.jam-card.pro:hover {
  transform: translateY(-8px);
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.12);
}

.jam-title-1 {
  font-size: 20px;
  margin: 15px 0 10px;
  font-weight: 800;
  color: #222;
}

/* .jam-title {
    font-size: 22px;
    margin: 15px 0 10px;
    font-weight: 800;
    color: #222;
} */



.jam-details {
  margin: 18px 0;
  padding: 0;
  list-style: none;
}

.jam-details-det {
  list-style: none;
  padding: 0;
  margin: 6px 0px;
  display: flex;
  align-items: center;
  /* 🔥 vertical center */
  justify-content: center;
  gap: 14px;
  font-size: 14px;
  color: #333;
}

.jam-details-det li {
  display: flex;
  align-items: center;
  font-size: 15px;
  font-weight: 800;
}

.jam-divider {
  width: 1px;
  height: 18px;
  /* line height */
  background: #b1aeae;
}

.jam-actions {
  display: flex;
  gap: 12px;
}

.jam-actions-btn {
  display: flex;
  gap: 12px;
  flex-direction: row;
}

.jam-actions-1 {
  margin-top: 20px;
  border-radius: 5px;
}

.jam-actions-1 a {
  width: auto;
  padding: 13px;

}

.jam-btn {
  flex: 1;
  padding: 5px 0;
  border-radius: 10px;
  text-align: center;
  font-weight: 700;
  text-decoration: none;
  font-size: 14px;
  transition: 0.3s;
}

@media (max-width:768px) {
  .jam-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  .jam-card-box {
    background: #fff;
    border-radius: 20px;
    padding: 25px;
    transition: 0.3s;
    height: 100% !important;
  }

  .jam-btn {
    flex: 1;
    padding: 6px 0;
    border-radius: 10px;
    text-align: center;
    font-weight: 700;
    text-decoration: none;
    font-size: 14px;
    transition: 0.3s;
  }
}

.jam-section {
  padding: 100px 0px;
}

.jam-btn.preview {
  background: var(--it-theme-2);
  color: #fff;
  font-size: 18px;
}

.jam-btn.preview:hover {
  background: var(--it-theme-2);
}

.jam-btn.download {
  background: #f1f1f1;
  color: #222;
  font-size: 18px;
}

.jam-btn.download:hover {
  background: #e2e2e2;
}

/* Swiper Navigation */
.jam-prev,
.jam-next {
  color: #fff;
  background: #0a8a44;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
}

.jam-prev:hover,
.jam-next:hover {
  background: #066b32;
}

/* Dots */
.jam-pagination .swiper-pagination-bullet {
  background: #0a8a44;
  opacity: 0.5;
}

.jam-pagination .swiper-pagination-bullet-active {
  opacity: 1;
  width: 18px;
  border-radius: 6px;
}

/* Pause animation on hover */
.jam-card:hover {
  animation-play-state: paused;
}


.jam-card-box {
  background: #fff;
  border-radius: 20px;
  padding: 25px;
  transition: 0.3s;
  height: 420px;
}

.it-team-2-title-box p {
  font-size: 19px;
}

/* Floating corner icon */
/* Wrapper for both icons */
.corner-icons {
  position: absolute;
  top: -25px;
  /* half outside */
  right: -25px;
  /* half outside */
  width: 80px;
  height: 110px;
  /* tall because strip hangs down */
  z-index: 999;
  pointer-events: none;
  /* prevent clicks */
}

/* Hanging strip */
.corner-strip {
  position: absolute;
  top: 0;
  left: 10%;
  transform: translateX(-50%);
  width: 26px;
  /* adjust if needed */
}

/* Circle badge under the strip */
.corner-circle {
  position: absolute;
  top: 36px;
  left: 13%;
  transform: translateX(-50%);
  width: 70px;
  height: 70px;
  border-radius: 50%;
  object-fit: cover;
  background: #ffffff;
  padding: 5px;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25);
  animation: zoomPulse 2.2s ease-in-out infinite;
}

.corner-icons-jam {
  position: absolute;
  top: -25px;
  /* half outside */
  right: -25px;
  /* half outside */
  width: 80px;
  height: 110px;
  /* tall because strip hangs down */
  z-index: 999;
  pointer-events: none;
  /* prevent clicks */
}


/* Circle badge under the strip */
.corner-circle-jam {
  position: absolute;
  top: 15px;
  left: 43%;
  transform: translateX(-50%);
  width: 70px;
  height: 70px;
  border-radius: 50%;
  object-fit: cover;
  background: #ffffff;
  padding: 5px;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.25);
  animation: zoomPulse 2.2s ease-in-out infinite;
}

@keyframes zoomPulse {
  0% {
    transform: translateX(-50%) scale(1);
  }

  50% {
    transform: translateX(-50%) scale(1.12);
    /* Zoom in */
  }

  100% {
    transform: translateX(-50%) scale(1);
  }
}

.jam-card-box:hover {
  /* transform: translateY(-10px); */
}

.jam-type-tag {
  position: absolute;
  bottom: -15px;
  left: 50%;
  width: 55%;
  transform: translateX(-50%);
  background: var(--it-theme-2);
  padding: 6px 0px;
  border-radius: 50px;
  color: #fff;
  font-size: 17px;
  font-weight: 600;
}

.jam-type-tag-1 {
  background: var(--it-theme-2);
  padding: 4px 22px;
  border-radius: 50px;
  color: #fff;
  font-size: 17px;
  font-weight: 600;
  display: inline-block;
  /* ⭐ This makes width auto-fit to text */
  width: auto;
  /* optional */
  max-width: max-content;
  /* ⭐ Guarantees shrink-to-fit */
  white-space: nowrap;
  /* no line break */
}

/* =========================
   PRE-GAME BOOKLET DESIGN
========================= */

.jam-type-btn-1 {
  width: 100%;
  min-height: 90px;
  border: none;
  border-radius: 18px;
  color: #ffffff;
  font-size: 15px;
  font-weight: 500;
  padding: 18px 14px;
  cursor: pointer;
  position: relative;
  text-align: center;

  /* card look */
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18);
  transition: all 0.35s ease;

  /* center content */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

/* Book Icon */
.jam-type-btn-1::before {
  content: "\f518";
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: 26px;
  margin-bottom: 8px;
  opacity: 0.95;
}

/* Hover Effect */
.jam-type-btn-1:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.28);
}

/* Smooth Click */
.jam-type-btn-1:active {
  transform: scale(0.97);
}

/* Section spacing */
.mt-40 {
  margin-top: 40px;
}

/* Title improvement */
h2.text-center {
  font-weight: 600;
  margin-bottom: 40px;
}

/* Responsive Fix */
@media (max-width: 768px) {
  .d-flex.gap-4.mt-40 {
    flex-direction: column;
  }

  .jam-type-btn-1 {
    min-height: 80px;
    font-size: 14px;
  }

  .jam-type-tag {

    width: 80%;

  }

  .it-footer-area {
    padding: 90px 0px 0px;
  }
}

.it-team-2-author-info .jam-desc {
  margin: 25px 0px;
  font-size: 16px;
  color: #444;
  margin: 25px 0;
  line-height: 1.6;
  text-transform: capitalize;
}

.jam-desc-1 {
  margin: 0px;
  font-size: 16px;
  color: #444;
  line-height: 1.6;
}


.jam-details {
  list-style: none;
  padding-left: 0;
  margin: 10px 0 20px;
}

.jam-details li {
  font-size: 16px;
  margin-bottom: 6px;
}

/* .jam-actions {
    display: flex;
    justify-content: center;
    gap: 15px;
} */
.it-team-2-wrapper {
  /* height: 600px; */
}

.series-badge {
  /* position: absolute; */
  /* bottom: 268px;
    right: 38px; */
  /* background: var(--series-color, #1f90a2); */
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  padding: 6px 18px;
  /* border-radius: 40px; */
  /* box-shadow: 0 4px 12px rgb(0 0 0 / 18%); */
  /* z-index: 11111111111; */
  transition: 0.3s ease;
}

.series-text {
  color: #000000;
  position: relative;
  bottom: 112px;
  right: 0px;
  font-size: 20px;
  font-weight: 500;

}

.series-badge img {
  width: 155px;
  /* filter: drop-shadow(2px 4px 6px rgb(153, 153, 153)); */
}

/* Hover — same as tag color */
.jam-card-box:hover .series-badge {
  transform: scale(1.05);
  filter: brightness(115%);
}


.jam-btn.preview {
  background: var(--it-theme-2);
  color: #fff;
}

.jam-btn.download {
  border: 1px solid var(--it-theme-2);
  color: var(--it-theme-2);
}

.child-popup {
  border-radius: 20px;
  background: linear-gradient(135deg, #fceff9, #e7f3ff);
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.15);
  padding-bottom: 10px;
  width: 80%;
  padding: 20px;
  margin: auto;
}

.popup-title {
  font-size: 26px;
  font-weight: 700;
  color: var(--it-theme-2);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

.download-form {
  padding: 30px;
}

@media (max-width:767px) {
  .download-form {
    padding: 0px;
  }
}

.popup-icon {
  width: 34px;
  height: 34px;
}

.popup-close {
  border-radius: 50%;
  padding: 5px;
  top: 4%;
  right: 3%;
  position: absolute;
}

.popup-input {
  border-radius: 12px !important;
  background: #ffffffd9;
  border: 1px solid #ddd;
  padding: 12px 14px;
  transition: 0.3s;
}

.popup-input:focus {
  border-color: var(--it-theme-2);
  box-shadow: 0 0 5px var(--it-theme-2);
}

.popup-submit {
  background: var(--it-theme-2);
  color: white;
  padding: 12px 20px;
  border-radius: 14px;
  font-size: 18px;
  font-weight: 600;
  transition: 0.3s;
}

.popup-submit:hover {
  background: var(--it-theme-2);
  transform: translateY(-2px);
  color: #FFF;
}

.clamp-text {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  max-height: 75px;
  transition: 0.3s ease;
}

.spaceship-image {
  width: 180px;
  transform: rotate(-25deg);
  background-size: cover;
}

/* Expanded text */
.clamp-text.expanded {
  -webkit-line-clamp: unset;
  max-height: none;
}

/* Read More button */
.it-team-2-author-info .read-more-btn {
  color: var(--it-theme-2) !important;
  font-weight: 600;
  cursor: pointer;
  font-size: 16px;
  display: inline-block;
}

.modal {
  display: none;
  position: fixed;
  z-index: 11111;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  animation: fadeIn 0.3s;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.modal-content {
  background-color: white;
  margin: 2% auto;
  padding: 30px;
  border-radius: 10px;
  width: 95%;
  max-width: 1400px;
  max-height: 90vh;
  overflow-y: auto;
  position: relative;
  animation: slideDown 0.3s;
}

@keyframes slideDown {
  from {
    transform: translateY(-50px);
    opacity: 0;
  }

  to {
    transform: translateY(0);
    opacity: 1;
  }
}

.close-btn {
  position: absolute;
  right: 20px;
  top: 20px;
  font-size: 35px;
  font-weight: bold;
  color: #aaa;
  cursor: pointer;
  transition: color 0.3s;
  z-index: 1001;
}

.close-btn:hover {
  color: #000;
}

.modal-title {
  text-align: center;
  color: #333;
  margin-bottom: 30px;
  font-size: 24px;
}

.pdf-preview {
  display: flex;
  gap: 30px;
  justify-content: center;
  margin: 20px 0;
  flex-wrap: wrap;
}

.pdf-container {
  text-align: center;
  flex: 1;
  min-width: 300px;
}

.pdf-container h3 {
  color: #333;
  margin-bottom: 15px;
  font-size: 18px;
}

.page-container {
  border: 1px solid #ddd;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  background: white;
  padding: 10px;
  border-radius: 5px;
  display: inline-block;
}

canvas {
  display: block;
  max-width: 100%;
  height: auto;
}

.loading {
  text-align: center;
  color: #666;
  padding: 40px;
  font-size: 18px;
}

.loading::after {
  content: '...';
  animation: dots 1.5s steps(4, end) infinite;
}

@keyframes dots {

  0%,
  20% {
    content: '.';
  }

  40% {
    content: '..';
  }

  60%,
  100% {
    content: '...';
  }
}

/* Custom font family for eduPLAYnation text */

.edu-font-2 {
  font-family: "MATTEKEK" !important;
  font-weight: 500;
  font-size: 22px;
}
.MATTEKEK_font_600{
  font-family: "MATTEKEK" !important;
  font-weight: 600;
  /* font-size: 22px; */
}
.MATTEKEK_font_500{
  font-family: "MATTEKEK" !important;
  font-weight: 500;
  /* font-size: 22px; */
}
.MATTEKEK_font_400{
  font-family: "MATTEKEK" !important;
  font-weight: 400;
  /* font-size: 22px; */
}

.edu-font {
  font-family: "MATTEKEK" !important;
  font-weight: 500;
  font-size: 40px;
}

.edu-font-1 {
  font-family: "MATTEKEK" !important;
  font-weight: 500;
  font-size: 45px;
}

/* Modern Tab Design */
.custom-tabs {
  background: #f8f9fa;
  padding: 10px;
  border-radius: 14px;
  gap: 15px;
}

.custom-tabs .nav-link {
  background: #fff;
  color: #555;
  border-radius: 10px;
  font-weight: 600;
  padding: 12px 22px;
  margin-right: 10px;
  border: 1px solid #ddd;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: 0.25s ease;
}

.custom-tabs .nav-link .icon {
  font-size: 18px;
}

/* Active Tab */
.custom-tabs .nav-link.active {
  background: #487339;
  color: #fff;
  border-color: #487339;
  box-shadow: 0 4px 12px rgb(72 115 57 / 44%);
}

/* Hover Effect */
.custom-tabs .nav-link:hover {
  background: #4873393d;
  color: black;
}

/* Tab Content Animation */
.tab-pane {
  /* padding: 20px; */
  animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.tab-scroll-container {
  position: relative;
  width: 100%;
  padding: 25px;
}

/* Keep tabs in one horizontal row */
.tab-scroll-wrapper {
  overflow-x: auto;
  white-space: nowrap !important;
  scroll-behavior: smooth;
  /* padding: 8px 40px; */
}

.tab-scroll-wrapper.dragging {
  cursor: grabbing;
  cursor: -webkit-grabbing;
}

.tab-scroll-wrapper::-webkit-scrollbar {
  display: none;
}

.tab-scroll-list {
  display: inline-flex !important;
  gap: 12px;
}

.tab-scroll-list .nav-link {
  /* white-space: nowrap !important; */
  padding: 10px 20px;
  border-radius: 10px;
  border: 1px solid #ddd;
  background: #fff;
  font-weight: 600;
  color: black;
  width: 310px;
  text-align: start;
}

.tab-scroll-list .nav-link.active {
  background: #487339;
  color: #fff;
  border-color: #487339;
  box-shadow: 0 4px 12px rgb(72 115 57 / 44%);
}

.tab-scroll-list .nav-link:hover {
  background: #4873393d;
  color: black;
}

/* Arrows */
.tab-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #fff;
  border: none;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
}

.tab-arrow.left {
  left: 0;
}

.tab-arrow.right {
  right: 0;
}

.tab-arrow i {
  font-size: 15px;
  color: #333;
}

.it-more-details {

  padding: 0px;

}

.it-more-details a {
  color: var(--it-common-white);
  background-color: var(--it-theme-2);
  width: auto;
  padding: 10px 20px;
  border-radius: 5px;
}

/* -------------------------
   GLOBAL WATERMARK BG
---------------------------- */
.about-watermark-bg {
  position: relative;
  background-image: url('assets/img/about/watermark.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 450px;
  opacity: 0.07;
  /* watermark softness */
}

/* Box styling for sections */
.about-box {
  background: #ffffffee;
  border-radius: 18px;
  padding: 40px 45px;
  margin-bottom: 40px;
  box-shadow: 0px 6px 25px rgba(0, 0, 0, 0.08);
}

.about-title {
  font-size: 36px;
  font-weight: 800;
  color: #C2185B;
  margin-bottom: 15px;
}

.about-sub {
  font-size: 20px;
  color: #555;
  font-weight: 500;
}

/* Children-friendly icons */
.icon-bubble {
  width: 62px;
  height: 62px;
  background: #FFE3F1;
  color: #C2185B;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  margin-right: 15px;
}

/* New Fun Sections */
.superpower-card {
  background: #FFF5FA;
  border-radius: 20px;
  padding: 30px;
  text-align: center;
  transition: .3s;
}

.superpower-card:hover {
  transform: translateY(-6px);
}

/* Kids Love Section */
.kids-love-box {
  background: #FFFAF4;
  padding: 35px;
  border-radius: 20px;
  margin-bottom: 30px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
}

/* SECTION WRAPPER */
.rangoli-welcome {
  position: relative;
  background: #fff;
  /* margin-top: 120px; */
  /* overflow: hidden; */
}

.rangoli-welcome::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("/assets/img/about/edulogo1.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 40%;
  /* watermark size */
  opacity: 0.13;
  /* light watermark */
  pointer-events: none;
  z-index: 0;
}

.it-footer-widget-gallery-bg {
  /* position: relative; */
  /* background: #fff; */
  /* margin-top: 120px; */
}

.it-footer-widget-gallery-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("/assets/img/about/edulogo1.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 130%;
  opacity: 0.40;
  pointer-events: none;
  z-index: 0;
}

.rangoli-welcome-1 {
  /* margin-top: 50px; */
}

/* FLEX ROW */
.welcome-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 50px;
}

/* LEFT IMAGE */
.welcome-left img {
  width: 100%;
  max-width: 100%;
  object-fit: cover;
}

.welcome-left1 img {
  border-radius: 10px;
}

/* RIGHT CONTENT */
.welcome-right {
  flex: 1;
}

/* TITLE */
.welcome-title {
  font-size: 48px;
  font-weight: 800;
  color: #003D4F;
  /* same color as screenshot */
  margin-bottom: 20px;
  line-height: 1.2;
}

/* PARAGRAPHS */
.welcome-right p {
  font-size: 18px;
  line-height: 32px;
  color: #374151;
  margin-bottom: 20px;
}

/* RESPONSIVE */
@media(max-width: 991px) {
  .welcome-row {
    flex-direction: column;
    text-align: center;
  }

  .welcome-left img {
    width: 300px;
  }

  .welcome-title {
    font-size: 38px;
  }

  .welcome-right p {
    font-size: 16px;
    line-height: 28px;
  }
}

/* MAIN SECTION */
.programs-section {
  padding: 60px 0 0;
  text-align: center;
  background: #ffffff;
}

/* HEADER */
.programs-title {
  font-size: 25px;
  font-weight: 800;
  color: #e24b1c;
  display: inline-block;
  background: #f85f29;
  color: #fff;
  padding: 8px 22px;
  border-radius: 6px;
}

.programs-subtitle {
  margin: 20px auto 40px;
  max-width: 850px;
  font-size: 17px;
  color: #555;
  line-height: 28px;
}

/* PROGRAM CARDS ROW */
.programs-row {
  display: flex;
  justify-content: center;
  gap: 30px;
  /* flex-wrap: wrap; */
  margin-top: 40px;
}

@media (max-width:1024px) {
  .programs-row {
    display: flex;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap;
    margin-top: 40px;
  }
}

/* CARD BASE STYLE */
.program-card {
  width: 100%;
  background: #fff;
  border-radius: 80px 80px 40px 40px;
  padding: 35px 35px 35px;
  text-align: center;
  position: relative;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
}

.program-card h3 {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 15px;
}

.program-card img {
  width: 100%;
  height: 150px;
  border-radius: 14px;
  object-fit: cover;
  margin-bottom: 15px;
}

.program-card p {
  font-size: 15px;
  line-height: 24px;
  color: #555;
}

/* AGE TAG */
.program-age {
  display: block;
  margin-top: 18px;
  font-weight: 700;
  color: #e36c1f;
  font-size: 14px;
}

/* COLOR VARIANTS */
.program-card.pink {
  background: #fde5e4;
  mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNjMgNDM5IiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48cGF0aCBkPSJNMTIuNTA4IDI1LjU0OGMyNi4yNzQtMjguMDggMjQxLjQzNC0zOS41NjcgMjQxLjQzNCAwIDAgNy45MzQgMi43NzMgNzEuNjc4IDMuMjQ0IDgxLjc0IDQuNjQzIDk5LjEyNyAxMS4xMzggMjUwLjM0Mi0zLjI0NCAyNjUuMjQ2LTQuNjMgNC43OTctMTguNjg0IDguNTk3LTYwLjk0MiAxMi43MjctMzQgMy4zMjMtOC42NzYgNDkuNDEyLTYwIDUyLjcyLTU0LjEyIDMuNDg3LTI0LTQ3LjcwMi03MC42NjUtNDcuOTkxLTM4LjM4Ny0uMjM4LTQ4LjU0OC00Ljc1OS00OS44MjctMTcuNDU2QzkuOTcgMzQ3LjM1NC0yLjM0NiAyMDEuNDUxLjM5NiAxMDYuNDY0Yy4xNTctNS40NTIgNy4xODMtNzUuNjUgMTIuMTEyLTgwLjkxNnoiIGZpbGw9IiMwMDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPgo=);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: cover;
  mask-size: cover;
}

.program-card.blue {
  background: #dff4fa;
  -webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNjMgNDM5IiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48cGF0aCBkPSJNMTIuNTA4IDI1LjU0OGMyNi4yNzQtMjguMDggMjQxLjQzNC0zOS41NjcgMjQxLjQzNCAwIDAgNy45MzQgMi43NzMgNzEuNjc4IDMuMjQ0IDgxLjc0IDQuNjQzIDk5LjEyNyAxMS4xMzggMjUwLjM0Mi0zLjI0NCAyNjUuMjQ2LTQuNjMgNC43OTctMTguNjg0IDguNTk3LTYwLjk0MiAxMi43MjctMzQgMy4zMjMtOC42NzYgNDkuNDEyLTYwIDUyLjcyLTU0LjEyIDMuNDg3LTI0LTQ3LjcwMi03MC42NjUtNDcuOTkxLTM4LjM4Ny0uMjM4LTQ4LjU0OC00Ljc1OS00OS44MjctMTcuNDU2QzkuOTcgMzQ3LjM1NC0yLjM0NiAyMDEuNDUxLjM5NiAxMDYuNDY0Yy4xNTctNS40NTIgNy4xODMtNzUuNjUgMTIuMTEyLTgwLjkxNnoiIGZpbGw9IiMwMDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPgo=);
  mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNjMgNDM5IiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48cGF0aCBkPSJNMTIuNTA4IDI1LjU0OGMyNi4yNzQtMjguMDggMjQxLjQzNC0zOS41NjcgMjQxLjQzNCAwIDAgNy45MzQgMi43NzMgNzEuNjc4IDMuMjQ0IDgxLjc0IDQuNjQzIDk5LjEyNyAxMS4xMzggMjUwLjM0Mi0zLjI0NCAyNjUuMjQ2LTQuNjMgNC43OTctMTguNjg0IDguNTk3LTYwLjk0MiAxMi43MjctMzQgMy4zMjMtOC42NzYgNDkuNDEyLTYwIDUyLjcyLTU0LjEyIDMuNDg3LTI0LTQ3LjcwMi03MC42NjUtNDcuOTkxLTM4LjM4Ny0uMjM4LTQ4LjU0OC00Ljc1OS00OS44MjctMTcuNDU2QzkuOTcgMzQ3LjM1NC0yLjM0NiAyMDEuNDUxLjM5NiAxMDYuNDY0Yy4xNTctNS40NTIgNy4xODMtNzUuNjUgMTIuMTEyLTgwLjkxNnoiIGZpbGw9IiMwMDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPgo=);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: cover;
  mask-size: cover;
}

.program-card.yellow {
  background: #feeecf;
  -webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNjMgNDM5IiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48cGF0aCBkPSJNMTIuNTA4IDI1LjU0OGMyNi4yNzQtMjguMDggMjQxLjQzNC0zOS41NjcgMjQxLjQzNCAwIDAgNy45MzQgMi43NzMgNzEuNjc4IDMuMjQ0IDgxLjc0IDQuNjQzIDk5LjEyNyAxMS4xMzggMjUwLjM0Mi0zLjI0NCAyNjUuMjQ2LTQuNjMgNC43OTctMTguNjg0IDguNTk3LTYwLjk0MiAxMi43MjctMzQgMy4zMjMtOC42NzYgNDkuNDEyLTYwIDUyLjcyLTU0LjEyIDMuNDg3LTI0LTQ3LjcwMi03MC42NjUtNDcuOTkxLTM4LjM4Ny0uMjM4LTQ4LjU0OC00Ljc1OS00OS44MjctMTcuNDU2QzkuOTcgMzQ3LjM1NC0yLjM0NiAyMDEuNDUxLjM5NiAxMDYuNDY0Yy4xNTctNS40NTIgNy4xODMtNzUuNjUgMTIuMTEyLTgwLjkxNnoiIGZpbGw9IiMwMDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPgo=);
  mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNjMgNDM5IiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48cGF0aCBkPSJNMTIuNTA4IDI1LjU0OGMyNi4yNzQtMjguMDggMjQxLjQzNC0zOS41NjcgMjQxLjQzNCAwIDAgNy45MzQgMi43NzMgNzEuNjc4IDMuMjQ0IDgxLjc0IDQuNjQzIDk5LjEyNyAxMS4xMzggMjUwLjM0Mi0zLjI0NCAyNjUuMjQ2LTQuNjMgNC43OTctMTguNjg0IDguNTk3LTYwLjk0MiAxMi43MjctMzQgMy4zMjMtOC42NzYgNDkuNDEyLTYwIDUyLjcyLTU0LjEyIDMuNDg3LTI0LTQ3LjcwMi03MC42NjUtNDcuOTkxLTM4LjM4Ny0uMjM4LTQ4LjU0OC00Ljc1OS00OS44MjctMTcuNDU2QzkuOTcgMzQ3LjM1NC0yLjM0NiAyMDEuNDUxLjM5NiAxMDYuNDY0Yy4xNTctNS40NTIgNy4xODMtNzUuNjUgMTIuMTEyLTgwLjkxNnoiIGZpbGw9IiMwMDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPgo=);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: cover;
  mask-size: cover;
}

.program-card.green {
  background: #e6f7e5;
  -webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNjMgNDM5IiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48cGF0aCBkPSJNMTIuNTA4IDI1LjU0OGMyNi4yNzQtMjguMDggMjQxLjQzNC0zOS41NjcgMjQxLjQzNCAwIDAgNy45MzQgMi43NzMgNzEuNjc4IDMuMjQ0IDgxLjc0IDQuNjQzIDk5LjEyNyAxMS4xMzggMjUwLjM0Mi0zLjI0NCAyNjUuMjQ2LTQuNjMgNC43OTctMTguNjg0IDguNTk3LTYwLjk0MiAxMi43MjctMzQgMy4zMjMtOC42NzYgNDkuNDEyLTYwIDUyLjcyLTU0LjEyIDMuNDg3LTI0LTQ3LjcwMi03MC42NjUtNDcuOTkxLTM4LjM4Ny0uMjM4LTQ4LjU0OC00Ljc1OS00OS44MjctMTcuNDU2QzkuOTcgMzQ3LjM1NC0yLjM0NiAyMDEuNDUxLjM5NiAxMDYuNDY0Yy4xNTctNS40NTIgNy4xODMtNzUuNjUgMTIuMTEyLTgwLjkxNnoiIGZpbGw9IiMwMDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPgo=);
  mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNjMgNDM5IiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48cGF0aCBkPSJNMTIuNTA4IDI1LjU0OGMyNi4yNzQtMjguMDggMjQxLjQzNC0zOS41NjcgMjQxLjQzNCAwIDAgNy45MzQgMi43NzMgNzEuNjc4IDMuMjQ0IDgxLjc0IDQuNjQzIDk5LjEyNyAxMS4xMzggMjUwLjM0Mi0zLjI0NCAyNjUuMjQ2LTQuNjMgNC43OTctMTguNjg0IDguNTk3LTYwLjk0MiAxMi43MjctMzQgMy4zMjMtOC42NzYgNDkuNDEyLTYwIDUyLjcyLTU0LjEyIDMuNDg3LTI0LTQ3LjcwMi03MC42NjUtNDcuOTkxLTM4LjM4Ny0uMjM4LTQ4LjU0OC00Ljc1OS00OS44MjctMTcuNDU2QzkuOTcgMzQ3LjM1NC0yLjM0NiAyMDEuNDUxLjM5NiAxMDYuNDY0Yy4xNTctNS40NTIgNy4xODMtNzUuNjUgMTIuMTEyLTgwLjkxNnoiIGZpbGw9IiMwMDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvc3ZnPgo=);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: cover;
  mask-size: cover;
}

.vamtam-eye {
  position: absolute;
  left: 0;
}

/* BOTTOM CIRCLE */
.program-card:after {
  content: "";
  width: 26px;
  height: 26px;
  background: #fff;
  border-radius: 50%;
  position: absolute;
  bottom: 15px;
  left: 50%;
  transform: translateX(-50%);
  border: 6px solid #fff;
  outline: 4px solid rgba(0, 0, 0, 0.05);
}

/* BOTTOM WAVE SHAPE */
.program-wave {
  margin-top: 60px;
  width: 100%;
  display: block;
}

/* RESPONSIVE */
@media (max-width: 768px) {
  .program-card {
    width: 90%;
    max-width: 320px;
  }

  .programs-title {
    font-size: 32px;
  }
}

/* MAIN SECTION */
.attractive-sec {
  padding: 80px 0;
  position: relative;
  overflow: hidden;
  background: #ffffff;
}

/* TOP LIGHT WAVE */
.top-soft-wave {
  position: absolute;
  top: 0;
  left: 0;
  height: 120px;
  width: 100%;
  background: linear-gradient(to right, #e2f8ff, #d7f3ff);
  opacity: 0.6;
  border-bottom-left-radius: 40%;
  border-bottom-right-radius: 40%;
}

/* DECOR ELEMENTS */
.decor-butterfly {
  position: absolute;
  top: -10px;
  left: 40px;
  width: 90px;
}

.decor-star-1 {
  position: absolute;
  right: 60px;
  top: 80px;
  width: 50px;
}

.decor-star-2 {
  position: absolute;
  right: 120px;
  top: 160px;
  width: 65px;
}

.decor-cloud {
  position: absolute;
  right: -20px;
  bottom: -20px;
  width: 230px;
  opacity: 0.25;
}

/* LAYOUT */
.welcome-row {
  display: flex;
  align-items: center;
  gap: 50px;
}

.welcome-left {
  flex: 0 0 38%;
}

.kids-img {
  width: 100%;
  max-width: 420px;
}

/* RIGHT CONTENT */
.welcome-right {
  flex: 1;
}

/* TITLE BAR */
.cute-title {
  font-size: 36px;
  font-weight: 800;
  margin-bottom: 20px;
  background: #1d4b38;
  display: inline-block;
  padding: 10px 22px;
  border-radius: 8px;
  color: #ffffff;
}

.cute-title span {
  color: #ffdd60;
}

/* PARAGRAPHS */
.welcome-right p {
  font-size: 18px;
  line-height: 30px;
  color: #444;
  margin-bottom: 18px;
  max-width: 650px;
}

/* RESPONSIVE */
@media(max-width: 991px) {
  .welcome-row {
    flex-direction: column;
    text-align: center;
  }

  .cute-title {
    font-size: 28px;
  }

  .welcome-left img {
    max-width: 300px;
  }

  .decor-butterfly,
  .decor-cloud,
  .decor-star-1,
  .decor-star-2 {
    display: none;
  }
}

/* ================================
   UNIQUE WHAT WE OFFER SECTION
================================ */
.inclusive-by-design {
  position: relative;
  padding: 90px 0 120px;
  background: #fdfefe;
  overflow: hidden;
}

.inclusive-by-design .unique-card {
  width: 100%;
  background: #fff;
  border-radius: 30px;
  padding: 35px 28px 40px;
  text-align: center;
  position: relative;
  box-shadow: 0 14px 35px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  transition:
    transform 0.35s ease,
    box-shadow 0.35s ease,
    border-radius 0.35s ease,
    background 0.35s ease;
}

.inclusive-by-design .unique-card h3 {
  font-size: 35px;
  font-weight: 800;
  margin-bottom: 14px;
  z-index: 3;
  position: relative;
}

.unique-offer-section {
  position: relative;
  padding: 90px 0 120px;
  background: #fdfefe;
  overflow: hidden;
}

/* TITLE */
.unique-title {
  text-align: center;
  font-size: 46px;
  margin-bottom: 10px;
  font-weight: 900;
  color: #000000;
}

/* SUBTITLE */
.unique-subtitle {
  text-align: center;
  color: #555;
  font-size: 18px;
  margin-bottom: 50px;
}

/* ROW */
.unique-offer-row {
  display: flex;
  justify-content: center;
  gap: 15px;
  flex-wrap: wrap;
}

/* UNIQUE CARDS */
.unique-card {
  width: 320px;
  background: #fff;
  border-radius: 30px;
  padding: 35px 28px 40px;
  text-align: center;
  position: relative;
  box-shadow: 0 14px 35px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  transition:
    transform 0.35s ease,
    box-shadow 0.35s ease,
    border-radius 0.35s ease,
    background 0.35s ease;
}

/* Floating background blob */
.card-shape {
  position: absolute;
  top: -40px;
  right: -40px;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  opacity: 0.18;
  transition: 0.35s ease;
}

.shape-pink {
  background: #ffb1c8;
}

.shape-blue {
  background: #9fd8ff;
}

.shape-green {
  background: #48733973;
}

.shape-yellow {
  background: #eec291;
}


/* ICON */
.unique-icon {
  width: 85px;
  margin-bottom: 15px;
  position: relative;
  z-index: 3;
  transition: transform 0.35s ease;
}

.unique-card:hover .unique-icon {
  transform: translateY(-6px);
}

/* TITLE */
.unique-card h3 {
  font-size: 24px;
  font-weight: 800;
  margin-bottom: 14px;
  z-index: 3;
  position: relative;
}

/* TEXT */
.unique-card p {
  font-size: 16px;
  color: #000000;
  line-height: 28px;
  margin-bottom: 25px;
  position: relative;
  z-index: 3;
}

/* KIDS ILLUSTRATION */
.card-illustration img {
  width: 120px;
  position: absolute;
  bottom: -8px;
  right: 10px;
  opacity: 0.95;
  pointer-events: none;
  transition: transform 0.35s ease;
}

/* BACKGROUND DECOR */
.unique-star-1 {
  width: 70px;
  position: absolute;
  left: 60px;
  top: 80px;
}

.unique-star-2 {
  width: 80px;
  position: absolute;
  right: 100px;
  top: 180px;
}

.unique-cloud {
  width: 300px;
  position: absolute;
  right: -60px;
  bottom: -30px;
  opacity: 0.25;
}

/* RESPONSIVE */
@media(max-width: 768px) {
  .unique-card {
    width: 90%;
    max-width: 350px;
  }

  .unique-title {
    font-size: 34px;
  }
}

/* ----------- HOVER EFFECTS ----------- */

/* ZOOM + LIFT */
.unique-card:hover {
  transform: scale(1.06);
  /* Zoom */
  border-radius: 45px;
  /* More rounded */
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.15);
  /* Darker shadow */
  background: #f7f7f7;
}

/* DARK CORNER FOCUS ON HOVER */
.unique-card:hover .card-shape {
  height: 110px;
  top: -10px;
  border-radius: 0 0 60% 60%;
}



/* RESPONSIVE */
@media(max-width: 768px) {
  .unique-card {
    width: 95%;
    max-width: 350px;
  }

  .unique-title {
    font-size: 32px;
  }
}

/* OUR STORY MAIN */
.story-section {
  /* padding: 100px 0; */
  background: #ffffff;
  position: relative;
  overflow: hidden;
}

/* TOP WAVE */
.story-top-wave {
  position: absolute;
  top: 0;
  left: 0;
  height: 110px;
  width: 100%;
  background: linear-gradient(to right, #def6ff, #d7f3ff);
  opacity: 0.6;
  border-bottom-left-radius: 45%;
  border-bottom-right-radius: 45%;
}

/* BOTTOM WAVE */
.story-bottom-wave {
  position: absolute;
  bottom: -30px;
  left: 0;
  height: 140px;
  width: 100%;
  background: #f4fbff;
  border-top-left-radius: 45%;
  border-top-right-radius: 45%;
}

/* DECOR ELEMENTS */
.story-butterfly {
  position: absolute;
  top: -18px;
  left: 50px;
  width: 90px;
}

.story-star-1 {
  position: absolute;
  right: 50px;
  top: 100px;
  width: 45px;
}

.story-star-2 {
  position: absolute;
  right: 120px;
  top: 170px;
  width: 60px;
}

.story-cloud {
  position: absolute;
  right: -20px;
  bottom: 40px;
  width: 230px;
  opacity: 0.25;
}

/* TITLE */
.story-title {
  text-align: center;
  font-size: 48px;
  font-weight: 800;
  margin-bottom: 10px;
  color: #000000;
}

.story-subtitle {
  text-align: center;
  font-size: 18px;
  color: #555;
  /* margin-bottom: 50px; */
}

/* TIMELINE */
.story-timeline {
  width: 100%;
  position: relative;
  margin-top: 30px;
}

/* TIMELINE ITEM */
.story-item {
  display: flex;
  align-items: center;
  gap: 35px;
  margin-bottom: 80px;
}

/* REVERSED FOR ZIGZAG EFFECT */
.story-item.reverse {
  flex-direction: row-reverse;
}

/* ICON CIRCLE */
.story-icon {
  width: 130px;
  font-size: 40px;
  height: 130px;
  color: #000;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);

}

.story-icon img {
  width: 70%;
  height: auto;
  animation: zoom11 5s infinite;
}

@keyframes zoom11 {
  0% {
    transform: scale(0.8);
  }

  50% {
    transform: scale(1);
  }

  100% {
    transform: scale(0.8);
  }
}

/* ICON COLORS */
.pink-bg {
  background: #ffe7ef;
}

.blue-bg {
  background: #e1f4ff;
}

.yellow-bg {
  background: #fff6d9;
}

/* CONTENT */
.story-content {
  flex: 1;
  background: #ffffff;
  padding: 30px 35px;
  border-radius: 20px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
  position: relative;
  border: 1px solid #f1efef;
}

.story-content h3 {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 15px;
  color: #1c4b38;
}

.story-content h3 span {
  color: #ff9933;
}

.story-content p {
  font-size: 16px;
  color: #444;
  line-height: 28px;
}

/* RESPONSIVE */
@media(max-width: 991px) {

  .story-item,
  .story-item.reverse {
    flex-direction: column;
    text-align: center;
  }

  .story-icon {
    margin-bottom: 20px;
  }
}

.improved-ui {
  background: #f6f8f6;
  padding: 80px 0;
}

.improved-ui .container {
  /* max-width: 1200px; */
  margin: auto;
  padding: 0 20px;
}

/* TOP SECTION */
.improved-ui .about-top {
  display: flex;
  background: linear-gradient(135deg, #2e7d32, #1b5e20);
  padding: 40px;
  border-radius: 16px;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
  width: 100%;
  margin: auto;
  align-items: center;
}

.improved-ui .about-text p {
  color: #ffffff;
  font-size: 18px;
  line-height: 1.9;
}

.improved-ui .about-text strong {
  color: #b9f6ca;
}

.improved-ui .about-text em {
  color: #e8f5e9;
  font-style: italic;
}

.improved-ui .about-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 14px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.25);
  border: none;
}

/* CARD SECTION */
.improved-ui .about-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 25px;
  margin-top: 40px;
}

.improved-ui .about-card {
  padding: 28px;
  border-radius: 16px;
  font-size: 15px;
  line-height: 1.7;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.improved-ui .about-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.18);
}

.improved-ui .about-card h3 {
  font-size: 17px;
  margin-bottom: 14px;
  font-weight: 700;
  letter-spacing: 0.5px;
}

/* COLOR VARIANTS */
.improved-ui .light-green {
  background: #b4e5a2;
}

.improved-ui .light-green h3 {
  color: #285317;
  font-size: 19px;
  font-weight: 600;
}

.improved-ui .light-green p {
  color: #275317;
  font-size: 18px;
}

.improved-ui .mid-green {
  background:
    #81cb8c;
}

.improved-ui .mid-green h3 {
  color: #1c6b24;
  font-size: 19px;
  font-weight: 600;
}

.improved-ui .mid-green p {
  color: #246e29;
  font-size: 18px;
}

.improved-ui .dark-green {
  background: #337d4c;
  color: #ffffff;
}

.improved-ui .dark-green p {
  color: #b9f6ca;
  font-size: 18px;
}

.improved-ui .dark-green h3 {
  color: #b9f6ca;
  font-size: 19px;
  font-weight: 600;
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .improved-ui .about-top {
    grid-template-columns: 1fr;
  }

  .improved-ui .about-cards {
    grid-template-columns: 1fr;
  }

  .improved-ui .about-image img {
    max-height: 360px;
  }
}

@media (max-width: 576px) {
  .improved-ui {
    padding: 60px 0;
  }

  .improved-ui .about-text {
    font-size: 14px;
  }

  .improved-ui .about-card {
    font-size: 14px;
    padding: 22px;
  }
}

/* / resource page / */
.hero {
  /* background: linear-gradient(180deg, #eaf7ee, #ffffff); */
  border-radius: 18px;
  padding: 20px 40px;
  text-align: center;
  margin: 45px 0px;
  border: 1px solid #e5e7eb;
}

.hero small {
  color: #2f9e44;
  font-weight: 600;
  letter-spacing: 1px;
}

.hero h1 {
  font-size: 28px;
  margin: 12px 0;
}

.understeding-jams {
  text-align: start;
  margin-top: 20px;
}

.understeding-jams h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: #111827;
}

.understeding-jams p {
  font-size: 16px;
  line-height: 1.65;
  color: #374151;
  margin-bottom: 12px;
}

/* Video Box */
.video-box {
  cursor: pointer;
  background: #d1fae5;
  border-radius: 16px;
  padding: 40px 20px;
  text-align: center;
  margin: 20px auto;
  /* max-width: 800px; */
  justify-content: center;
  height: 400px;
  display: flex;
  flex-direction: column;
}

.video-box p {
  width: 1000px;
  margin: 0 auto;
  text-transform: capitalize;
}

.video-box i {
  font-size: 60px;
  color: #2f9e44;
  margin-bottom: 10px;
}

/* MODAL BACKDROP */
.video-modal {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  z-index: 9999;
  align-items: center;
  justify-content: center;
}

.video-iframe {
  display: none;
}

/* MODAL CONTENT */
.video-content {
  background: #000;
  padding: 10px;
  border-radius: 12px;
  max-width: 900px;
  width: 90%;
  position: relative;
}

/* CLOSE BUTTON */
.close-btn {
  position: absolute;
  top: 0px;
  right: 0px;
  background: #ffffff;
  color: #000;
  font-size: 22px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

@media (max-width:1024px) {
  .video-box p {
    width: 100%;
    margin: 0 auto;
  }
}

@media (max-width:425px) {
  .hero {
    padding: 0px 20px;
  }
}

/* CARD */


.info-card {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 24px 28px;
  margin-top: 32px;
}

.info-header {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
}

.info-icon {
  width: 46px;
  height: 46px;
  background: #2f9e44;
  color: #ffffff;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
}

.info-title h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  color: #111827;
}

.info-icon i {
  font-size: 25px;
}

/* .info-title span {
        font-size: 16px;
        color: #2f9e44;
        font-weight: 500;
    } */

.info-text {
  font-size: 16px;
  line-height: 1.65;
  color: #374151;
  margin-bottom: 12px;
}

/* Inner Grey Box */
.inner-note {
  background: #f9fafb;
  border-radius: 12px;
  margin: 20px 0;
  font-size: 18px;
}

.inner-note ul {
  padding-left: 18px;
  margin: 10px 0;
  color: #374151;
}

.inner-note li {
  margin-bottom: 10px;
  font-size: 17px;
}

.note-text {
  font-size: 15px;
  color: #454950;
}

.inner-note strong {
  font-size: 16px;
  color: #000000bf;
}

/* Highlight */
.highlight-text {
  color: #2f9e44;
  font-style: italic;
  font-size: 16px;
  margin: 20px 0;
}

/* Series Section */
.series-section {
  margin-top: 20px;
}

.series-title {
  font-weight: 600;
  margin-bottom: 10px;
}

.series-item {
  padding-left: 14px;
  margin-bottom: 14px;
  border-left: 3px solid #2f9e44;
}

/* Series items – base */
.series-item span {
  font-weight: 600;
  font-size: 17px;
  color: #111827;
  /* title always dark */
}

/* DETAILS TEXT = BLACK */
.series-item p {
  margin-top: 6px;
  font-size: 16px;
  color: #000000;
  /* BLACK details text */
  line-height: 1.6;
}

/* COMING SOON – DARK GRAY */
.series-item.muted {
  border-left-color: #9ca3af;
  color: #4b5563;
  /* dark gray */
}

.series-item.muted span {
  color: #4b5563;
  /* dark gray title */
}

.series-item.muted em {
  font-size: 17px;
  margin-left: 6px;
  color: #6b7280;
  /* slightly lighter gray */
}

.schema-list {
  margin-top: 20px;
}

/* Each schema item */
.schema-item {
  display: flex;
  gap: 14px;
  background: #f9fafb;
  border-radius: 12px;
  padding: 14px 16px;
  margin-bottom: 12px;
}

/* Green number circle */
.schema-num {
  min-width: 30px;
  height: 30px;
  background: #2f9e44;
  color: #ffffff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 600;
}

/* Schema text */
.schema-item h4 {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  color: #2f9e44;
}

.schema-item p {
  margin: 4px 0 0;
  font-size: 16px;
  line-height: 1.6;
  color: #000000;
  /* details black as requested */
}

/* Accordion container */
/* Outer accordion box */
.resource-accodian .accordion {
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  overflow: hidden;
}

/* Each row */
.resource-accodian .accordion-item {
  border: none;
  border-bottom: 1px solid #e5e7eb;
}

.resource-accodian .accordion-item:last-child {
  border-bottom: none;
}

/* Accordion button */
.resource-accodian .accordion-button {
  font-size: 16px;
  font-weight: 600;
  color: #2f9e44;
  /* GREEN text */
  background-color: #ffffff;
  /* White background */
  padding: 14px 18px;
}

/* Remove Bootstrap blue background */
.resource-accodian .accordion-button:not(.collapsed) {
  background-color: #ffffff;
  color: #2f9e44;
  box-shadow: none;
}

/* Chevron icon (right side) */
.resource-accodian .accordion-button::after {
  background-size: 14px;
  filter: grayscale(1);
}

/* Body text */
.resource-accodian .accordion-body {
  font-size: 18px;
  color: #423b3b;
  line-height: 1.6;
  padding: 12px 18px 16px;
}

/* Remove focus outline */
.resource-accodian .accordion-button:focus {
  box-shadow: none;
}

.cta-box {
  background: #3f9142;
  /* green */
  border-radius: 12px;
  padding: 40px 20px;
  text-align: center;
  margin: 50px 0;
}

.cta-box h2 {
  color: #ffffff;
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 10px;
}

.cta-box p {
  color: #ffffff;
  font-size: 16px;
  margin-bottom: 24px;
  text-transform: capitalize;
}

.cta-actions {
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}

/* Buttons */
.cta-actions .btn {
  padding: 10px 22px;
  font-size: 18px;
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
}

/* White button */
.cta-actions .btn-light {
  background: #ffffff;
  color: #3f9142;
}

/* Outline button */
.cta-actions .btn-outline {
  border: 1px solid #ffffff;
  color: #ffffff;
  background: transparent;
}

/* / resource end / */
.signin-wrapper {
  position: relative;
  width: 100%;
}

.signin-wrapper img {
  width: 100%;
  height: auto;
  display: block;
}

/* 🔥 DARK OVERLAY (ONLY IMAGE, NOT TEXT) */
.image-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.35);
  z-index: 1;
}

/* 🔥 TEXT LAYER */
.signin-text {
  position: absolute;
  inset: 0;
  z-index: 2;
  /* text always on top */
  display: flex;
  flex-direction: column;
  gap: 55px;
  justify-content: center;
  align-items: center;
  text-align: center;
  color: #ffffff;
  padding: 20px;
}

/* EXACT TEXT STYLES */
.signin-text .welcome {
  font-size: 35px;
  font-weight: 500;
  color: #fff;
}

.signin-text .to {
  font-size: 22px;
  margin: 8px 0;
  color: #fff;
}

.signin-text .brand {
  font-size: 42px;
  margin-bottom: 20px;
  color: #fff;
  font-family: "MATTEKEK";
}

/* MAIN TAGLINE */
.signin-text .tagline {
  font-size: 32px;
  font-weight: 700;
  color: #fff;
  line-height: 1.3;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.6);
}

.donate-same-wrapper {
  display: flex;
  border: 2px solid #77d0f3;
  border-radius: 6px;
  overflow: hidden;
  height: 600px;
  position: relative;
}

/* LEFT IMAGE */
.donate-left {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.donate-left img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: relative;
  z-index: -1;
}

.donate-same-section {
  margin: 80px 0px;
}

/* CURVE */
.donate-left::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  -webkit-backdrop-filter: blur(4px);
  background: #cfeefa52;
  border-right: 1px solid rgba(255, 255, 255, 0.25);
  backdrop-filter: blur(4px);
  top: -5%;
  right: 0px;
  left: -4px;
  width: 380px;
  height: 650px;
  border-radius: 0 80% 100% 0;

}

.donate-left::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to right,
      rgba(0, 0, 0, 0.55),
      rgba(0, 0, 0, 0.25),
      rgba(0, 0, 0, 0));
  z-index: 1;
}

/* TEXT ON IMAGE */
.donate-text-1 {
  position: absolute;
  top: 70px;
  left: 50px;
  /* position: absolute;
    top: 60px;
    left: 40px; */
  z-index: 5;

  /* background: rgba(255, 255, 255, 0.18); */
  /* backdrop-filter: blur(10px); */
  /* -webkit-backdrop-filter: blur(10px); */

  /* border: 1px solid rgba(255, 255, 255, 0.3); */
  border-radius: 14px;

  padding: 22px 26px;
  max-width: 360px;
}

/* .donate-text {
    position: absolute;
    top: 70px;
    left: 50px;
    z-index: 3;
    max-width: 380px;
} */
.donate-text-1 h2 {
  width: 200px;
  font-size: 45px;
  /* color: white; */
  /* z-index: 9999999; */
  /* position: absolute; */
text-transform: capitalize;
  margin: 0;
  line-height: 1.15;
  color: #ffffff;

  text-shadow:
    0 2px 10px rgba(0, 0, 0, 0.45);
}

@media (max-width:768px) {
  .donate-text-1 h2 {
    width: 250px;
    font-size: 35px;
    color: white;
    z-index: 9999999;
    position: absolute;

  }

  .donate-same-wrapper {
    display: flex;
    border: 2px solid #77d0f3;
    border-radius: 6px;
    overflow: hidden;
    height: 100%;
  }
}

.donate-text h2 {
  color: #ffffff;
  font-size: 40px;
  font-weight: 800;
  line-height: 1.15;

  /* makes text sharp & readable */
  text-shadow:
    0 2px 8px rgba(0, 0, 0, 0.45);
}

/* RIGHT PANEL */
.donate-right-box {
  width: 26%;
  /* background: #cfeefa; */
  position: absolute;
  border-radius: 20px;
  right: 50px;
  top: 80px;
  height: 70%;
  bottom: 19px;
  padding: 30px 25px;
  text-align: center;
  justify-content: space-between;
  display: flex;
  flex-direction: column;
  z-index: 111;
  border-left: 1px solid rgba(255, 255, 255, 0.4);
  box-shadow: -10px 0 30px rgba(0, 0, 0, 0.1);
  -webkit-backdrop-filter: blur(4px);
  background: #4d616852;
  backdrop-filter: blur(4px);
}

/* BOOTSTRAP TAB LOOK */
.donate-tabs {
  border: 2px solid var(--it-theme-2);
  display: inline-flex;
}

.donate-tabs .nav-link {
  border-radius: 0;
  font-weight: 600;
  color: #fff;
}

.donate-tabs .nav-link.active {
  background: #1e7f3f;
  color: #fff;
}

/* AMOUNT BUTTONS */
.donate-amounts {
  display: flex;
  /* grid-template-columns: repeat(2, 1fr); */
  gap: 16px;
  margin: 30px 0;
  justify-content: center;
}

@media (max-width:768px) {
  .donate-amounts {
    display: flex;
    /* grid-template-columns: repeat(4, 1fr); */
    gap: 10px;
    margin: 10px 0;
  }
}

.donate-amounts button {
  padding: 8px;
  background: transparent;
  border: 2px solid #ffffff;
  font-size: 22px;
  font-weight: 700;
  color: #ffffff;
  width: 100px;
}

.donate-amounts button:hover {
  background: #fff;
  color: #000;
}

/* DONATE BUTTON */
.donate-now-btn {
  display: inline-block;
  background: #f7c600;
  padding: 8px 28px;
  font-weight: 800;
  font-size: 20px;
  color: #000;
  border: 2px solid #333;
  text-decoration: none;
  margin-bottom: 25px;
}

.donate-now-btn:hover {
  color: #000;
}

/* FOOTER TEXT */
.donate-note {
  font-size: 19px;
  font-weight: 600;
  text-align: center;
  color: #ffffff;
}


@media (max-width: 1024px) {
  .donate-same-wrapper {
    flex-direction: column;
  }

  .donate-text-1 {
    position: absolute;
    top: 135px;
    left: 50px;
  }

  .donate-right-box {
    width: 40%;
    height: 80%;
    top: 50px;
  }

}

@media (max-width:425px) {
  .donate-text-1 h2 {
    width: 200px;
    font-size: 28px;
    color: white;
    z-index: 9999999;
    position: absolute;
  }

  .donate-text-1 {
    position: absolute;
    top: 40px;
    left: 50px;
  }

  .donate-right-box {
    width: 80%;
    height: 100%;
    top: 0px;
  }
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .donate-same-wrapper {
    flex-direction: column;
  }

  .donate-text-1 {
    position: absolute;
    top: 135px;
    left: 50px;
  }


  .donate-left {
    width: 100%;
  }

  .donate-left::after {
    display: none;
  }
}

.donate-testimonial-section {
  background: #ffffff;
  /* padding:50px 0; */
}

/* Big text */
.testimonial-heading h2 {
  font-size: 22px;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 25px;
  text-transform: capitalize;
}

/* Green box */
.testimonial-box {
  background: #3f6b2f;
  /* image green */
  color: #ffffff;
  padding: 30px;
  border-radius: 10px;
  max-width: 900px;
  margin: 0 auto;
}

.testimonial-box h5 {
  font-weight: 700;
  margin-bottom: 10px;
  color: #fff;
}

/* Stars */
.testimonial-stars img {
  width: 120px;
  margin-bottom: 15px;
}

.testimonial-stars i {
  color: yellow;
}

/* Paragraph */
.testimonial-box p {
  font-size: 17px;
  line-height: 1.6;
  margin: 0;
  color: #fff;
  text-transform: capitalize;
}

.testimonial-heading {
  width: 50%;
  margin: auto;
}

/* Mobile */
@media(max-width:768px) {
  .testimonial-heading h2 {
    font-size: 18px;
    width: 100%;
  }

  .testimonial-box {
    padding: 20px;
  }

  .testimonial-heading {
    width: 100%;
  }
}

.donation-matters-section {
  background: #ffffff;
  padding: 50px 0;
  /* border-top:1px solid #e6e6e6; */
  /* border-bottom:1px solid #e6e6e6; */
}

.donation-matters-title {
  font-weight: 700;
  font-size: 22px;
}

.donation-matter-box {
  background: #ffffff;
  padding: 25px 20px;
  border-radius: 12px;
  height: 100%;
  text-align: center;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;
  border: 1px solid #d7d7d7;
}

.donation-matter-box img {
  width: 55px;
  max-width: 100%;
  margin-bottom: 15px;
}

.donation-matter-box h5 {
  font-weight: 700;
  font-size: 16px;
  margin-bottom: 8px;
}

.donation-matter-box p {
  font-size: 16px;
  color: #555;
  margin: 0;
}

/* Hover effect (optional) */
.donation-matter-box:hover {
  transform: translateY(-6px);
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.12);
}

/* MOBILE FIX */
@media (max-width: 767px) {
  .donation-matter-box {
    margin-bottom: 20px;
  }
}

/* MAIN SECTION */
.donate-info-section {
  padding: 40px 0;
  /* background:#f6f7f6; */
}

/* WRAPPER */
.donate-info-wrapper {
  background: #ffffff;
  border-radius: 10px;
  overflow: hidden;
}

/* LEFT GREEN BOX */
.donate-info-left {
  background: #b9cbb2bf;
  padding: 25px;
  height: 100%;
  display: flex;
  gap: 15px;
  align-items: center;
}

.donate-icon-box {
  font-size: 45px;
  color: #2e7d32;
  flex-shrink: 0;
  background: #48733952;
  padding: 20px;
  border-radius: 50%;
}

.donate-text h3 {
  font-weight: 800;
  margin-bottom: 6px;
}

.donate-text p {
  margin: 0;
  font-size: 18px;
  color: black;
  text-transform: capitalize;
}

/* RIGHT BOX */
.donate-info-right {
  padding: 25px;
  background: #48733914;
}

.donate-info-right h4 {
  font-weight: 800;
  margin-bottom: 8px;
}

.donate-info-right a {
  color: #2e7d32;
  font-weight: 600;
  text-decoration: none;
}

.check-text {
  margin-top: 10px;
  font-weight: 600;
  color: #2e7d32;
}

.check-text i {
  margin-right: 6px;
}

.org-text {
  font-size: 16px;
  color: #555;
  margin: 0px;
}

/* MOBILE */
@media(max-width:768px) {

  .donate-info-left,
  .donate-info-right {
    padding: 20px;
  }
}

.pre-game-wrapper {
  background: #ffffff;
  padding: 20px 15px;
  /* margin-top: 25px; */
  border-radius: 18px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);
  border: 1px solid #487339;
}

.pre-game-wrapper .section-title {
  text-align: center;
  font-size: 32px;
  font-weight: 600;
  margin-bottom: 15px;
}

.booklet-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 22px;
}

.booklet-card {
  color: #ffffff;
  padding: 14px 8px;
  border-radius: 16px;
  text-align: center;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}

.booklet-card i {
  font-size: 30px;
  margin-bottom: 5px;
  display: block;
}

.booklet-card p {
  font-size: 14px;
  line-height: 1.4;
  font-size: 14px;
  line-height: 1.4;
  margin: 0px;
  color: white;

}

.booklet-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 35px rgba(0, 0, 0, 0.25);
}

/* Colors */
.orange {
  background: linear-gradient(135deg, #ab312b);
}

.dark-orange {
  background: linear-gradient(135deg, #d26953);
}

.gold {
  background: linear-gradient(135deg, #c65519);
}

.pink {
  background: linear-gradient(135deg, #cbab2d);
}

.magenta {
  background: linear-gradient(135deg, #526e23);
}

.purple {
  background: linear-gradient(135deg, #24594a);
}

.blue {
  background: linear-gradient(135deg, #4997a3);
}

.royal-blue {
  background: linear-gradient(135deg, #223470);
}

.teal {
  background: linear-gradient(135deg, #56317d);
}

.green {
  background: linear-gradient(135deg, #8e3165);
}

/* Responsive */
@media(max-width: 991px) {
  .booklet-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media(max-width: 425px) {
  .booklet-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #e5e5e5;
  padding-bottom: 12px;
  margin-bottom: 15px;
}

.modal-title {
  font-size: 20px;
  font-weight: 600;
  margin: 0;
}

.header-actions {
  display: flex;
  align-items: center;
  gap: 14px;
}

.download-btn {
  background: var(--it-theme-2);
  color: #fff;
  padding: 8px 14px;
  border-radius: 6px;
  font-size: 16px;
  text-decoration: none;
  transition: .3s;
}

.download-btn:hover {
  background: var(--it-theme-1);
  color: #fff;
}

.limit-2-lines {
    display: -webkit-box;       
    -webkit-line-clamp: 2;       
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    /* optional */
    line-height: 1.3;            
    max-height: calc(1.2em * 3); 
    white-space: normal;
}