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

    Theme Name: Reak - Creative Agency & Portfolio HTML Template
    Author: Ordianit
    Support:ordianit@gmail.com
    Description: Reak - Creative Agency & Portfolio HTML Template
    Version: 1.0.0

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

/************ ================= ***************

	-----------------
    INDEXING START HERE
	-----------------
	1.1 Theme Css
	1.2 Common Classes
	1.4 BRAND AGENCY CSS START HERE 
	1.5 DESIGN AGENCY CSS START HERE
	1.6 DESIGN STUDIO CSS START HERE
	1.7 DIGITAL AGENCY CSS HERE 
	1.8 SOLO DESIGN AGENCY CSS START HERE



**********************************************/
/*----------------------------------------*/
/*  1.1 Theme Css
/*----------------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&family=Funnel+Display:wght@300..800&display=swap");
:root {
  /**=========== color ===========*/
  --oit-clr-white: #fff;
  --oit-clr-black: #000;
  --oit-grey-1: #f5f5f5;
  --oit-grey-2: #494949;
  --oit-text-body: #5d5d5d;
  --oit-theme-1: #000;
  --oit-border-1: #EAEBED;
}

:root {
  /**========== font family ==============*/
  --oit-ff-body: "Plus Jakarta Sans", sans-serif;
  --oit-ff-heading: "Funnel Display", sans-serif;
  --oit-ff-funnel: "Funnel Display", sans-serif;
  --oit-ff-p: "Plus Jakarta Sans", sans-serif;
  --oit-ff-fontawesome: "Font Awesome 6 Pro";
}

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

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

/*---------------------------------
	typography css start 
---------------------------------*/
body {
  font-size: 14px;
  line-height: 26px;
  font-weight: normal;
  color: var(--oit-text-body);
  font-family: var(--oit-ff-body);
}

img {
  max-width: 100%;
}

a {
  text-decoration: none;
}

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

h1 {
  font-size: 40px;
}

h2 {
  font-size: 36px;
}

h3 {
  font-size: 28px;
}

h4 {
  font-size: 24px;
}

h5 {
  font-size: 20px;
}

h6 {
  font-size: 16px;
}

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

p {
  font-size: 14px;
  font-weight: 400;
  margin-bottom: 15px;
  line-height: 26px;
  font-family: var(--oit-ff-p);
  color: var(--oit-text-body);
}

a,
button,
p,
input,
select,
textarea,
li,
.transition-3 {
  transition: 0.3s;
}

a:not([href]):not([class]),
a:not([href]):not([class]):hover {
  color: inherit;
  text-decoration: none;
}

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;
}

input[type=text],
input[type=email],
input[type=tel],
input[type=number],
input[type=password],
input[type=url],
textarea {
  outline: none;
  height: 56px;
  width: 100%;
  line-height: 56px;
  font-size: 14px;
  padding-left: 26px;
  padding-right: 26px;
  color: var(--oit-clr-white);
  border: 1px solid var(--oit-clr-white);
  background-color: var(--oit-clr-white);
}
input[type=text]::-webkit-input-placeholder,
input[type=email]::-webkit-input-placeholder,
input[type=tel]::-webkit-input-placeholder,
input[type=number]::-webkit-input-placeholder,
input[type=password]::-webkit-input-placeholder,
input[type=url]::-webkit-input-placeholder,
textarea::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: var(--oit-clr-white);
}
input[type=text]::-moz-placeholder,
input[type=email]::-moz-placeholder,
input[type=tel]::-moz-placeholder,
input[type=number]::-moz-placeholder,
input[type=password]::-moz-placeholder,
input[type=url]::-moz-placeholder,
textarea::-moz-placeholder { /* Firefox 19+ */
  color: var(--oit-clr-white);
}
input[type=text]:-moz-placeholder,
input[type=email]:-moz-placeholder,
input[type=tel]:-moz-placeholder,
input[type=number]:-moz-placeholder,
input[type=password]:-moz-placeholder,
input[type=url]:-moz-placeholder,
textarea:-moz-placeholder { /* Firefox 4-18 */
  color: var(--oit-clr-white);
}
input[type=text]:-ms-input-placeholder,
input[type=email]:-ms-input-placeholder,
input[type=tel]:-ms-input-placeholder,
input[type=number]:-ms-input-placeholder,
input[type=password]:-ms-input-placeholder,
input[type=url]:-ms-input-placeholder,
textarea:-ms-input-placeholder { /* IE 10+  Edge*/
  color: var(--oit-clr-white);
}
input[type=text]::placeholder,
input[type=email]::placeholder,
input[type=tel]::placeholder,
input[type=number]::placeholder,
input[type=password]::placeholder,
input[type=url]::placeholder,
textarea::placeholder { /* MODERN BROWSER */
  color: var(--oit-clr-white);
}
input[type=text]:focus,
input[type=email]:focus,
input[type=tel]:focus,
input[type=number]:focus,
input[type=password]:focus,
input[type=url]:focus,
textarea:focus {
  border-color: var(--oit-clr-white);
}
input[type=text]:focus::placeholder,
input[type=email]:focus::placeholder,
input[type=tel]:focus::placeholder,
input[type=number]:focus::placeholder,
input[type=password]:focus::placeholder,
input[type=url]:focus::placeholder,
textarea:focus::placeholder {
  opacity: 0;
}

textarea {
  line-height: 1.4;
  padding-top: 17px;
  padding-bottom: 17px;
}

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(--oit-clr-black);
  color: var(--oit-clr-white);
  text-shadow: none;
}

::-moz-selection {
  background: var(--oit-clr-black);
  color: var(--oit-clr-white);
  text-shadow: none;
}

::selection {
  background: var(--oit-clr-black);
  color: var(--oit-clr-white);
  text-shadow: none;
}

*::-moz-placeholder {
  color: var(--oit-clr-black);
  font-size: 14px;
  opacity: 1;
}

*::placeholder {
  color: var(--oit-clr-black);
  font-size: 14px;
  opacity: 1;
}

/*---------------------------------
    1.2 Common Classes
---------------------------------*/
.w-img img {
  width: 100%;
}

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

.fix {
  overflow: hidden;
}

.clear {
  clear: both;
}

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

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

.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;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.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;
}

.oit-text-white {
  color: var(--oit-clr-white);
}

.oit-text-black {
  color: var(--oit-clr-black);
}

/* dropcap */
.oit-dropcap::first-letter {
  margin-left: 280px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-dropcap::first-letter {
    margin-left: 0;
  }
}

.border-radius-10 {
  border-radius: 10px;
}

.oit-img-wrap {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  z-index: 3;
  width: 300px;
  height: 400px;
  overflow: hidden;
  border-radius: 10px;
  pointer-events: none;
  transform: translate(-50%, -50%);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-img-wrap {
    width: 200px;
    height: 250px;
  }
}
.oit-img-wrap .oit-img-inner-wrap {
  display: flex;
  flex-direction: column;
}
.oit-img-wrap img {
  width: 300px;
  height: 400px;
  object-fit: cover;
  object-position: 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) {
  .oit-img-wrap img {
    width: 200px;
    height: 250px;
  }
}

.image-gsl {
  position: relative;
  display: inline-block;
}
.image-gsl img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: inline-block;
}
.image-gsl-canvas {
  position: absolute;
  inset: 0;
  display: inline-block;
  pointer-events: none;
  object-fit: cover;
}

.border-line {
  display: inline;
  background-repeat: no-repeat;
  background-size: 0% 2px, 0 2px;
  background-position: 100% 100%, 0 100%;
  transition: background-size 0.3s linear;
  background-image: linear-gradient(currentcolor, currentcolor), linear-gradient(currentcolor, currentcolor);
}
.border-line:hover {
  background-size: 0% 2px, 100% 2px;
}

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

.white-bg {
  background-color: var(--oit-clr-white);
}

.black-bg {
  background-color: var(--oit-clr-black);
}

/*----------------------------------------*/
/*  2.3 Buttons
/*----------------------------------------*/
.oit-btn-border {
  font-size: 16px;
  font-weight: 500;
  padding: 8px 22px;
  padding-right: 8px;
  border-radius: 30px;
  display: inline-block;
  text-transform: uppercase;
  color: var(--oit-clr-white);
  border: 1px solid var(--oit-clr-white);
  gap: 10px;
}
@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) {
  .oit-btn-border {
    font-size: 14px;
    padding: 5px 22px;
    padding-right: 8px;
  }
}
.oit-btn-border.btn-blur-bg {
  backdrop-filter: blur(40px);
  background-color: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.2);
}
.oit-btn-border.btn-black-bg {
  color: var(--oit-clr-white);
  border-color: var(--oit-clr-black);
  background-color: var(--oit-clr-black);
}
.oit-btn-border.btn-black-bg i {
  color: var(--oit-clr-black);
  background-color: var(--oit-clr-white);
}
.oit-btn-border.btn-white-bg {
  padding: 10px 26px;
  padding-right: 8px;
  color: var(--oit-clr-black);
  border-color: var(--oit-clr-white);
  background-color: var(--oit-clr-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) {
  .oit-btn-border.btn-white-bg {
    padding: 5px 26px;
    padding-right: 8px;
  }
}
.oit-btn-border.btn-white-bg i {
  color: var(--oit-clr-white);
  background-color: var(--oit-clr-black);
}
.oit-btn-border.btn-white-bg:hover {
  color: var(--oit-clr-black);
}
.oit-btn-border.btn-large {
  padding: 17px 26px;
}
@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) {
  .oit-btn-border.btn-large {
    padding: 12px 26px;
  }
}
.oit-btn-border.btn-small {
  padding-top: 4px;
  padding-bottom: 4px;
  border: none;
  color: var(--oit-grey-2);
  background-color: var(--oit-grey-1);
}
.oit-btn-border.btn-small:hover {
  background-color: var(--oit-clr-black);
}
.oit-btn-border span {
  position: relative;
  z-index: 1;
  overflow: hidden;
  display: inline-block;
}
.oit-btn-border span span.text-1 {
  position: relative;
  display: block;
  transition: 0.3s;
  transform: translateY(-1px);
}
.oit-btn-border span span.text-2 {
  position: absolute;
  top: 100%;
  display: block;
  transition: 0.3s;
  transform: translateY(-1px);
}
.oit-btn-border i {
  height: 38px;
  width: 38px;
  line-height: 38px;
  border-radius: 50%;
  margin-left: 2px;
  text-align: center;
  display: inline-block;
  color: var(--oit-clr-black);
  background-color: var(--oit-clr-white);
}
.oit-btn-border i span {
  position: relative;
  overflow: hidden;
  width: 14px;
  height: 14px;
  display: inline-flex;
}
.oit-btn-border i svg {
  transform: translateY(-2px);
  position: absolute;
  bottom: -1px;
  left: 1px;
  transition: all 0.2s ease-out;
}
.oit-btn-border i svg:last-child {
  left: -12px;
  bottom: -12px;
  transform: translate(0, 0);
  opacity: 0;
}
.oit-btn-border:hover {
  color: var(--oit-clr-white);
}
.oit-btn-border:hover span span.text-1 {
  -webkit-transform: translateY(-150%);
  transform: translateY(-150%);
}
.oit-btn-border:hover span span.text-2 {
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.oit-btn-border:hover i svg:first-child {
  transform: translate(16px, -16px);
}
.oit-btn-border:hover i svg:last-child {
  opacity: 1;
  visibility: visible;
  transform: translate(13px, -13px);
}
.oit-btn-line {
  display: inline-flex;
  align-items: center;
  font-weight: 500;
  font-size: 16px;
  color: var(--oit-clr-black);
}
.oit-btn-line.fsz-30 {
  font-size: 30px;
}
.oit-btn-line.fsz-30 span {
  padding-bottom: 5px;
}
.oit-btn-line.fsz-30 i {
  width: 24px;
  height: 24px;
  padding-bottom: 5px;
}
.oit-btn-line.fsz-30:hover i svg:first-child {
  transform: translate(24px, -24px);
}
.oit-btn-line i {
  position: relative;
  overflow: hidden;
  width: 14px;
  height: 14px;
  display: inline-flex;
  margin-left: 7px;
}
.oit-btn-line i svg {
  transform: translateY(-2px);
  position: absolute;
  bottom: -1px;
  left: 1px;
  transition: all 0.2s ease-out;
}
.oit-btn-line i svg:last-child {
  left: -12px;
  bottom: -12px;
  transform: translate(0, 0);
  opacity: 0;
}
.oit-btn-line:hover {
  color: var(--oit-clr-black);
}
.oit-btn-line:hover i svg:first-child {
  transform: translate(16px, -16px);
}
.oit-btn-line:hover i svg:last-child {
  opacity: 1;
  visibility: visible;
  transform: translate(13px, -13px);
}
.oit-btn-line:hover span::after {
  transform: translate(1rem);
}
.oit-btn-line:hover span::before {
  transform: translate(calc(100% + 1rem));
}
.oit-btn-line span {
  position: relative;
  overflow: hidden;
}
.oit-btn-line span::before, .oit-btn-line span::after {
  content: "";
  position: absolute;
  display: block;
  bottom: 2px;
  width: 100%;
  height: 1px;
  background-color: currentColor;
  transition: transform 0.5s cubic-bezier(0.59, 0.23, 0.22, 0.96);
}
.oit-btn-line span::before {
  left: 0;
}
.oit-btn-line span::after {
  left: -1rem;
  transform: translate(-100%);
}

/*----------------------------------------*/
/*  2.4 Animations
/*----------------------------------------*/
@keyframes animate-pulse-white {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.8), 0 0 0 0 rgba(255, 255, 255, 0.8);
  }
  40% {
    box-shadow: 0 0 0 50px rgba(255, 255, 255, 0), 0 0 0 0 rgba(255, 255, 255, 0.8);
  }
  80% {
    box-shadow: 0 0 0 50px rgba(255, 255, 255, 0), 0 0 0 30px rgba(255, 255, 255, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0), 0 0 0 30px rgba(255, 255, 255, 0);
  }
}
.pulse-white {
  animation: animate-pulse-white 3s linear infinite;
}

/*----------------------------------------*/
/*  2.5 Preloader
/*----------------------------------------*/
/* ===== Preloader Wrapper ===== */
#preloader {
  position: fixed;
  inset: 0;
  backdrop-filter: blur(40px);
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 999999;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.5s ease, visibility 0.5s ease;
}

#preloader.is-loading {
  opacity: 1;
  visibility: visible;
}

#preloader.is-loaded {
  pointer-events: none;
}

/* ===== Loader Animation ===== */
.preloader {
  width: 100px;
  height: 100px;
  position: relative;
}

.preloader span {
  position: absolute;
  display: inline-block;
  width: 100px;
  height: 100px;
  border-radius: 100%;
  background: #fff;
  animation: preloader 1.3s linear infinite;
}

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

/* ===== Keyframes ===== */
@keyframes preloader {
  0% {
    transform: scale(0);
    opacity: 0.5;
  }
  100% {
    transform: scale(2);
    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(--oit-common-white);
  cursor: pointer;
  background: var(--oit-theme-1);
  transition: 1s ease;
  border: none;
}

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

/*----------------------------------------*/
/*  2.15 Section Title
/*----------------------------------------*/
.oit-section-subtitle {
  font-weight: 500;
  font-size: 14px;
  line-height: 1.1;
  display: inline-block;
  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) {
  .oit-section-subtitle-box {
    margin-bottom: 20px;
  }
}
.oit-section-title {
  font-weight: 700;
  font-size: 144px;
  line-height: 1.06;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .oit-section-title {
    font-size: 100px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-section-title {
    font-size: 80px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .oit-section-title {
    font-size: 80px;
  }
  .oit-section-title span {
    padding-left: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-section-title {
    font-size: 70px;
  }
  .oit-section-title span {
    padding-left: 0;
  }
}
@media (max-width: 767px) {
  .oit-section-title {
    font-size: 40px;
  }
  .oit-section-title br {
    display: none;
  }
  .oit-section-title span {
    padding-left: 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .oit-section-title {
    font-size: 50px;
  }
  .oit-section-title span {
    padding-left: 0;
  }
}
.oit-section-title.fsz-60 {
  font-size: 60px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .oit-section-title.fsz-60 {
    font-size: 50px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-section-title.fsz-60 {
    font-size: 44px;
  }
}
@media (max-width: 767px) {
  .oit-section-title.fsz-60 {
    font-size: 35px;
  }
}
.oit-section-title.fsz-120 {
  font-size: 120px;
  font-weight: 500;
  line-height: 0.9;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .oit-section-title.fsz-120 {
    font-size: 90px;
  }
}
@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) {
  .oit-section-title.fsz-120 {
    font-size: 80px;
  }
}
@media (max-width: 767px) {
  .oit-section-title.fsz-120 {
    font-size: 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) {
  .oit-section-title-box {
    padding-left: 0;
    margin-bottom: 40px;
  }
}

/*----------------------------------------*/
/*  2.10 Offcanvas
/*----------------------------------------*/
.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.png), pointer;
}

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

.oitoffcanvas {
  position: fixed;
  top: 0;
  bottom: 0;
  right: -100%;
  width: 450px;
  z-index: 9999;
  padding: 50px;
  opacity: 0;
  z-index: 1000;
  visibility: hidden;
  overflow-y: scroll;
  scrollbar-width: none;
  transition: 0.3s linear;
  overscroll-behavior-y: contain;
  background: var(--oit-clr-white) none repeat scroll 0 0;
}
.oitoffcanvas.opened {
  opacity: 1;
  visibility: visible;
}
@media (max-width: 767px) {
  .oitoffcanvas {
    width: 90%;
    padding: 40px 35px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .oitoffcanvas {
    width: 75%;
    padding: 40px;
  }
}
.oitoffcanvas.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;
}
.oitoffcanvas__logo {
  margin-bottom: 60px;
}
@media (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px) {
  .oitoffcanvas__logo {
    padding-top: 0;
  }
}
.oitoffcanvas__logo img {
  width: 100px;
  height: 100%;
}
.oitoffcanvas__close-btn button {
  font-size: 35px;
  position: absolute;
  right: 50px;
  top: 42px;
  transition: 1s;
  font-weight: 300;
  opacity: 0.6;
  color: var(--oit-clr-black);
  -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) {
  .oitoffcanvas__close-btn button {
    font-size: 28px;
    right: 48px;
    top: 52px;
  }
}
@media (max-width: 767px) {
  .oitoffcanvas__close-btn button {
    font-size: 28px;
    right: 39px;
    top: 38px;
  }
}
.oitoffcanvas__close-btn button:hover {
  opacity: 1;
  color: var(--oit-clr-black);
}
.oitoffcanvas__content {
  margin-bottom: 30px;
}
.oitoffcanvas__content p {
  font-size: 16px;
  color: #fff;
  font-weight: 400;
  line-height: 1.6;
  margin-bottom: 25px;
}
.oitoffcanvas__content span {
  color: #fff;
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 5px;
  display: inline-block;
}
.oitoffcanvas__content a {
  font-size: 30px;
  line-height: 51px;
  font-weight: 700;
  color: var(--oit-clr-white);
  display: inline-block;
}
@media (max-width: 767px) {
  .oitoffcanvas__content a {
    font-size: 27px;
  }
}
.oitoffcanvas__social {
  margin-top: 50px;
}
.oitoffcanvas__social .social-icon a {
  height: 50px;
  width: 50px;
  line-height: 50px;
  text-align: center;
  font-size: 18px;
  background-color: var(--oit-theme-1);
  color: var(--oit-clr-white);
  margin-right: 15px;
  transition: 0.3s;
  display: inline-block;
  border-radius: 50%;
}
@media (max-width: 767px) {
  .oitoffcanvas__social .social-icon a {
    margin-right: 3px;
  }
}
.oitoffcanvas__social .social-icon a:hover {
  background-color: var(--oit-theme-1);
  color: var(--oit-clr-white);
}
.oitoffcanvas__text {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  padding-bottom: 20px;
  margin-bottom: 20px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oitoffcanvas__text {
    display: none;
  }
}
.oitoffcanvas__text p {
  font-size: 16px;
  color: #414144;
}
.oitoffcanvas__info {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  padding-bottom: 30px;
  margin-bottom: 20px;
}
.oitoffcanvas__info .offcanva-title {
  color: var(--oit-clr-black);
  margin: 30px 0 40px 0;
  font-size: 20px;
  font-weight: 600;
}
.oitoffcanvas__info-icon a {
  height: 50px;
  width: 50px;
  background-color: var(--oit-theme-1);
  color: var(--oit-clr-white);
  display: inline-block;
  text-align: center;
  line-height: 50px;
  border-radius: 50px;
  font-weight: 400;
  font-size: 21px;
  margin-right: 20px;
}
.oitoffcanvas__info-address span {
  display: block;
  font-size: 16px;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.6);
}
.oitoffcanvas__info-address a {
  display: block;
  color: var(--oit-clr-black);
  font-size: 16px;
  font-weight: 600;
  transition: 0.3s;
}
@media (max-width: 767px) {
  .oitoffcanvas__info-address a {
    font-size: 16px;
  }
}
.oitoffcanvas__info-address a:hover {
  color: var(--oit-theme-1);
}
.oitoffcanvas .oit-homemenu-wrapper {
  padding: 0;
}
.oitoffcanvas .home-img-thumb {
  padding: 0px;
  height: 135px;
}
.oitoffcanvas .oit-menu-mobile .home-img-title, .oitoffcanvas .oit-category-mobile-menu .home-img-title {
  font-weight: 400;
}
.oitoffcanvas .oit-megamenu-thumb {
  display: none;
}
.oitoffcanvas .oit-megamenu-text {
  display: none;
}
.oitoffcanvas .oit-megamenu-list li a::before {
  display: none;
}
.oitoffcanvas .oit-megamenu-list li:hover > a {
  padding-left: 0px;
  font-weight: 400;
}
.oitoffcanvas .oit-megamenu-list li:not(:last-child) {
  margin-bottom: 0;
}
.oitoffcanvas .oit-menu-mobile ul li > a, .oitoffcanvas .oit-category-mobile-menu ul li > a {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.oitoffcanvas .oit-megamenu-title {
  font-size: 16px;
  margin-bottom: 15px;
  padding-bottom: 14px;
  margin-right: 65px;
  margin-top: 30px;
  font-weight: 500;
  color: var(--oit-clr-black);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.oitoffcanvas .home-img:hover .home-img-title a {
  color: var(--oit-clr-white);
}
.oitoffcanvas .home-img:hover .home-img-title {
  background-size: 0% 1px, 100% 1px;
}

/* HEADER CSS */
/*----------------------------------------*/
/*  3.1 Header Style 1
/*----------------------------------------*/
.oit-header-transparent {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 99;
}

@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-header-logo {
    padding: 15px 0;
  }
}
.oit-header-bar {
  height: 56px;
  width: 56px;
  line-height: 56px;
  border-radius: 50%;
  background-color: var(--oit-clr-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) {
  .oit-header-bar {
    height: 50px;
    width: 50px;
  }
}
.oit-header-bar span {
  height: 2px;
  width: 28px;
  display: block;
  margin: 5px auto;
  transition: all 0.3s ease-in-out;
  background-color: var(--oit-clr-black);
}
.oit-header-bar span:first-child {
  transform-origin: right center;
  transform: scaleX(0.5);
}
.oit-header-bar span:last-child {
  transform-origin: left center;
  transform: scaleX(0.5);
}
.oit-header-bar:hover span:first-child {
  transform: scaleX(1);
}
.oit-header-bar:hover span:last-child {
  transform: scaleX(1);
}
.oit-header-menu nav > ul > li {
  display: inline-block;
  margin: 0 20px;
}
.oit-header-menu nav > ul > li > a {
  padding: 35px 0;
  font-weight: 600;
  font-size: 16px;
  display: inline-block;
  color: var(--oit-clr-black);
}
.oit-header-menu-2 > nav > ul > li {
  margin: 0 30px;
}
.oit-header-menu-2 > nav > ul > li > a {
  text-transform: uppercase;
  color: var(--oit-clr-white);
}
.oit-header-bdr {
  border-bottom: 1px dashed var(--oit-clr-black);
}

/*----------------------------------------*/
/*  4.1 Main menu css
/*----------------------------------------*/
.oit-header-menu nav ul li {
  position: relative;
}
.oit-header-menu nav ul li .submenu {
  position: absolute;
  top: 100%;
  left: 0;
  width: 230px;
  text-align: left;
  padding: 30px 0;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
  border-radius: 5px;
  transition-duration: 0.1s;
  transform-origin: top;
  -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);
  background-color: var(--oit-clr-white);
  border: 1px solid rgba(48, 48, 47, 0.1);
  box-shadow: 0px 1px 2px 1px rgba(3, 11, 30, 0.06), 0px 1px 1px 0px rgba(3, 11, 30, 0.1);
  z-index: 9999;
}
.oit-header-menu nav ul li .submenu.index-submenu {
  width: 270px;
}
.oit-header-menu nav ul li .submenu li {
  list-style: none;
  display: block;
  padding: 0 30px;
}
.oit-header-menu nav ul li .submenu li:not(:last-child) {
  margin-bottom: 5px;
}
.oit-header-menu nav ul li .submenu li a {
  font-weight: 600;
  font-size: 14px;
  position: relative;
  display: inline-block;
  letter-spacing: 0.2px;
  text-transform: capitalize;
  color: var(--oit-clr-black);
}
.oit-header-menu nav ul li .submenu li a::before {
  position: absolute;
  top: 13px;
  left: 0;
  content: "";
  height: 2px;
  width: 0px;
  opacity: 0;
  visibility: hidden;
  display: inline-block;
  transition: all 0.3s ease-out 0s;
  background-color: var(--oit-clr-black);
}
.oit-header-menu nav ul li .submenu li:hover > a {
  padding-left: 20px;
  color: var(--oit-clr-black);
}
.oit-header-menu nav ul li .submenu li:hover > a::before {
  width: 15px;
  visibility: visible;
  opacity: 1;
}
.oit-header-menu nav ul li .submenu .submenu {
  left: 100%;
  top: 0;
}
.oit-header-menu nav ul li:hover.has-dropdown a::after {
  color: var(--oit-clr-black);
  transform: rotate(-180deg);
}
.oit-header-menu nav ul li:hover > .submenu {
  visibility: visible;
  opacity: 1;
  transition-duration: 0.2s;
  transform: perspective(300px) rotateX(0deg);
}

.oit-menu-mobile .oit-menu-content,
.oit-category-mobile-menu .oit-menu-content {
  margin-bottom: 70px;
}
.oit-menu-mobile ul,
.oit-category-mobile-menu ul {
  position: static;
  display: block;
  box-shadow: none;
}
.oit-menu-mobile ul li,
.oit-category-mobile-menu ul li {
  list-style: none;
  position: relative;
  width: 100%;
  padding: 0;
}
.oit-menu-mobile ul li:not(:last-child) > a,
.oit-category-mobile-menu ul li:not(:last-child) > a {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.oit-menu-mobile ul li.has-dropdown > a .dropdown-toggle-btn,
.oit-category-mobile-menu ul li.has-dropdown > a .dropdown-toggle-btn {
  position: absolute;
  right: 0;
  top: 25%;
  transform: translateY(-2px);
  font-size: 18px;
  color: var(--oit-clr-black);
  font-family: "Font Awesome 5 Pro";
  transition: all 0.3s ease-in-out;
  z-index: 1;
  width: 25px;
  height: 25px;
  line-height: 21px;
  text-align: center;
  border: 1px solid rgba(176, 162, 162, 0.35);
  transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out;
}
.oit-menu-mobile ul li.has-dropdown > a .dropdown-toggle-btn i,
.oit-category-mobile-menu ul li.has-dropdown > a .dropdown-toggle-btn i {
  transition: all 0.3s ease-in-out;
  margin-left: 2px;
}
.oit-menu-mobile ul li.has-dropdown > a .dropdown-toggle-btn.dropdown-opened i,
.oit-category-mobile-menu ul li.has-dropdown > a .dropdown-toggle-btn.dropdown-opened i {
  transform: rotate(90deg);
}
.oit-menu-mobile ul li.has-dropdown > a .dropdown-toggle-btn:hover,
.oit-category-mobile-menu ul li.has-dropdown > a .dropdown-toggle-btn:hover {
  background-color: var(--oit-theme-1);
  border-color: var(--oit-theme-1);
  color: var(--oit-clr-white);
}
.oit-menu-mobile ul li.has-dropdown > a .dropdown-toggle-btn:hover i,
.oit-category-mobile-menu ul li.has-dropdown > a .dropdown-toggle-btn:hover i {
  color: var(--oit-clr-white);
}
.oit-menu-mobile ul li.has-dropdown > a.expanded,
.oit-category-mobile-menu ul li.has-dropdown > a.expanded {
  color: var(--oit-theme-1);
}
.oit-menu-mobile ul li.has-dropdown > a.expanded .dropdown-toggle-btn.dropdown-opened,
.oit-category-mobile-menu ul li.has-dropdown > a.expanded .dropdown-toggle-btn.dropdown-opened {
  background-color: var(--oit-theme-1);
  border-color: var(--oit-theme-1);
  color: var(--oit-clr-white);
}
.oit-menu-mobile ul li.has-dropdown > a.expanded .dropdown-toggle-btn.dropdown-opened i,
.oit-category-mobile-menu ul li.has-dropdown > a.expanded .dropdown-toggle-btn.dropdown-opened i {
  color: var(--oit-clr-white);
}
.oit-menu-mobile ul li.has-dropdown:hover > a::after,
.oit-category-mobile-menu ul li.has-dropdown:hover > a::after {
  color: var(--oit-theme-1);
}
.oit-menu-mobile ul li:last-child a span,
.oit-category-mobile-menu ul li:last-child a span {
  border-bottom: 0;
}
.oit-menu-mobile ul li > a,
.oit-category-mobile-menu ul li > a {
  display: block;
  font-size: 16px;
  position: relative;
  padding: 10px 0;
  font-weight: 500;
  padding-right: 20px;
  text-transform: capitalize;
  color: var(--oit-clr-black);
}
.oit-menu-mobile ul li > a:hover,
.oit-category-mobile-menu ul li > a:hover {
  color: var(--oit-theme-1);
}
.oit-menu-mobile ul li > a svg,
.oit-category-mobile-menu ul li > a svg {
  transform: translateY(-2px);
}
.oit-menu-mobile ul li > a > i,
.oit-category-mobile-menu ul li > a > i {
  display: inline-block;
  width: 11%;
  margin-right: 13px;
  transform: translateY(4px);
  font-size: 21px;
  line-height: 1;
}
.oit-menu-mobile ul li > a .menu-text,
.oit-category-mobile-menu 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;
}
.oit-menu-mobile ul li img,
.oit-category-mobile-menu ul li img {
  width: 100%;
  height: 100%;
}
.oit-menu-mobile ul li ul,
.oit-category-mobile-menu ul li ul {
  padding: 0;
}
.oit-menu-mobile ul li ul li,
.oit-category-mobile-menu ul li ul li {
  padding: 0;
}
.oit-menu-mobile ul li ul li a,
.oit-category-mobile-menu 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;
}
.oit-menu-mobile ul li ul li li a,
.oit-category-mobile-menu ul li ul li li a {
  width: 88%;
  padding: 10px 7%;
  padding-left: 0;
  padding-right: 20px;
}
.oit-menu-mobile ul li ul li li li a,
.oit-category-mobile-menu ul li ul li li li a {
  width: 83%;
  padding: 10px 9%;
  padding-left: 0;
  padding-right: 20px;
}
.oit-menu-mobile ul li ul li li li li a,
.oit-category-mobile-menu ul li ul li li li li a {
  width: 68%;
  padding: 10px 11%;
  padding-left: 0;
  padding-right: 20px;
}
.oit-menu-mobile ul li:hover > a::after,
.oit-category-mobile-menu ul li:hover > a::after {
  color: var(--oit-theme-1);
}
.oit-menu-mobile ul li:hover > a .dropdown-toggle-btn i,
.oit-category-mobile-menu ul li:hover > a .dropdown-toggle-btn i {
  color: var(--oit-theme-1);
}
.oit-menu-mobile ul li:hover .mega-menu,
.oit-category-mobile-menu ul li:hover .mega-menu {
  visibility: visible;
  opacity: 1;
  top: 0;
}
.oit-menu-mobile ul li .mega-menu, .oit-menu-mobile ul li .submenu,
.oit-category-mobile-menu ul li .mega-menu,
.oit-category-mobile-menu ul li .submenu {
  position: static;
  min-width: 100%;
  padding: 0;
  box-shadow: none;
  visibility: visible;
  opacity: 1;
  display: none;
}
.oit-menu-mobile ul li .mega-menu li, .oit-menu-mobile ul li .submenu li,
.oit-category-mobile-menu ul li .mega-menu li,
.oit-category-mobile-menu ul li .submenu li {
  float: none;
  display: block;
  width: 100%;
  padding: 0;
}
.oit-menu-mobile ul li .mega-menu li:hover a .dropdown-toggle-btn, .oit-menu-mobile ul li .submenu li:hover a .dropdown-toggle-btn,
.oit-category-mobile-menu ul li .mega-menu li:hover a .dropdown-toggle-btn,
.oit-category-mobile-menu ul li .submenu li:hover a .dropdown-toggle-btn {
  color: var(--oit-theme-1);
}
.oit-menu-mobile .oit-menu-content ul li:not(:last-child) .home-img-title a,
.oit-category-mobile-menu .oit-menu-content ul li:not(:last-child) .home-img-title a {
  border-bottom: none;
}
.oit-menu-mobile * ul, .oit-menu-mobile * li,
.oit-category-mobile-menu * ul,
.oit-category-mobile-menu * li {
  transition: none !important;
}

/*----------------------------------------*/
/*  5.1 Postbox css
/*----------------------------------------*/
.postbox-title {
  font-weight: 600;
  font-size: 45px;
  line-height: 1.22;
  margin-bottom: 25px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .postbox-title {
    font-size: 40px;
  }
}
@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-title {
    font-size: 35px;
  }
}
@media (max-width: 767px) {
  .postbox-title {
    font-size: 24px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .postbox-title {
    font-size: 28px;
  }
}
.postbox-left {
  margin-right: 80px;
  padding: 40px 50px;
  background-color: var(--oit-clr-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) {
  .postbox-left {
    margin-right: 0;
    padding: 30px 40px;
  }
}
@media (max-width: 767px) {
  .postbox-left {
    margin-right: 0;
    padding: 30px 20px;
  }
}
.postbox-left.left-style {
  margin-right: 0;
  margin-left: 80px;
}
@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-left.left-style {
    margin-left: 0;
  }
}
@media (max-width: 767px) {
  .postbox-left.left-style {
    margin-left: 0;
  }
}
.postbox-content .postbox-form-input-box input {
  background-color: var(--oit-clr-white);
}
.postbox-content .postbox-form-textarea-box textarea {
  background-color: var(--oit-clr-white);
}
.postbox-content .postbox-banner-wrap .postbox-dsc {
  padding-left: 120px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .postbox-content .postbox-banner-wrap .postbox-dsc {
    padding-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) {
  .postbox-content .postbox-banner-wrap .postbox-dsc {
    padding-left: 0;
  }
}
.postbox-content .postbox-dsc p {
  font-weight: 600;
  font-size: 20px;
  line-height: 1.5;
  letter-spacing: 0;
}
@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) {
  .postbox-content .postbox-dsc p {
    font-size: 16px;
  }
}
@media (max-width: 767px) {
  .postbox-content .postbox-dsc p {
    font-size: 14px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .postbox-content .postbox-dsc p {
    font-size: 16px;
  }
}
.postbox-dsc p {
  font-weight: 500;
  font-size: 18px;
  line-height: 1.67;
  letter-spacing: -0.04em;
  color: var(--oit-grey-2);
}
@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) {
  .postbox-dsc p {
    font-size: 16px;
  }
}
@media (max-width: 767px) {
  .postbox-dsc p {
    font-size: 14px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .postbox-dsc p {
    font-size: 16px;
  }
}
.postbox-banner img {
  max-width: inherit;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .postbox-banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}
.postbox-banner-wrap .postbox-banner {
  height: 100%;
}
@media (max-width: 767px) {
  .postbox-banner-wrap .postbox-banner {
    height: auto;
    margin-bottom: 30px;
  }
}
.postbox-banner-wrap .postbox-dsc {
  padding-left: 80px;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .postbox-banner-wrap .postbox-dsc {
    padding-left: 95px;
  }
}
@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) {
  .postbox-banner-wrap .postbox-dsc {
    padding-left: 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) {
  .postbox-tag {
    margin-bottom: 20px;
  }
}
.postbox-tag-title {
  margin: 0;
  margin-right: 18px;
  font-weight: 600;
  font-size: 20px;
  color: var(--oit-clr-black);
}
@media (max-width: 767px) {
  .postbox-tag-title {
    font-size: 16px;
  }
}
.postbox-tag-content a {
  padding: 0 22px;
  height: 32px;
  line-height: 29px;
  display: inline-block;
  font-weight: 400;
  font-size: 16px;
  transition: 0.3s;
  font-weight: 500;
  font-size: 16px;
  border-radius: 1000px;
  letter-spacing: -0.02em;
  border: 1px solid rgba(93, 93, 93, 0.3);
  color: var(--oit-clr-black);
}
@media (max-width: 767px) {
  .postbox-tag-content a {
    padding: 0 15px;
    height: 25px;
    line-height: 22px;
    font-size: 14px;
    margin-bottom: 5px;
  }
}
.postbox-tag-content a:not(:last-child) {
  margin-right: 7px;
}
.postbox-tag-content a:hover {
  color: var(--oit-clr-white);
  background-color: var(--oit-theme-1);
}
.postbox-share-content a {
  font-size: 16px;
  display: inline-block;
  transition: 0.3s;
  height: 50px;
  width: 50px;
  line-height: 45px;
  text-align: center;
  border-radius: 50%;
  color: var(--oit-clr-black);
  border: 1px solid rgba(13, 13, 13, 0.2);
  background-color: rgba(13, 13, 13, 0.08);
}
@media (max-width: 767px) {
  .postbox-share-content a {
    height: 35px;
    width: 35px;
    line-height: 28px;
  }
}
@media (max-width: 767px) {
  .postbox-share-content a svg {
    width: 12px;
  }
}
.postbox-share-content a:not(:last-child) {
  margin-right: 8px;
}
.postbox-share-content a:hover {
  color: var(--oit-clr-white);
  background-color: var(--oit-theme-1);
}
.postbox-user-thumb {
  flex: 0 0 auto;
}
.postbox-user-thumb img {
  height: 150px;
  width: 150px;
  border-radius: 50%;
  margin-right: 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) {
  .postbox-user-thumb img {
    height: 110px;
    width: 110px;
  }
}
@media (max-width: 767px) {
  .postbox-user-thumb img {
    margin-bottom: 30px;
  }
}
.postbox-user-info p {
  font-weight: 600;
  font-size: 20px;
  line-height: 1.5;
  margin-bottom: 0;
  color: var(--oit-grey-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) {
  .postbox-user-info p {
    font-size: 16px;
  }
}
.postbox-user-info .user-title {
  font-weight: 600;
  font-size: 30px;
  line-height: 1.33;
  margin-bottom: 12px;
}
@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-user-info .user-title {
    font-size: 20px;
  }
}
.postbox-comment ul li {
  border-radius: 20px;
  padding: 50px;
  list-style-type: none;
  backdrop-filter: blur(40px);
  background: linear-gradient(209deg, rgba(13, 13, 13, 0.1) 0%, rgba(13, 13, 13, 0.2) 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) {
  .postbox-comment ul li {
    padding: 40px;
  }
}
.postbox-form-input-box input {
  height: 70px;
  font-size: 16px;
  font-weight: 500;
  line-height: 70px;
  border-radius: 10px;
  letter-spacing: -0.02em;
  color: var(--oit-clr-black);
  background-color: transparent;
  border: 1px solid rgba(73, 73, 73, 0.2);
}
@media (max-width: 767px) {
  .postbox-form-input-box input {
    height: 50px;
    line-height: 50px;
  }
}
.postbox-form-input-box input::placeholder {
  font-weight: 500;
  font-size: 16px;
  letter-spacing: -0.02em;
  color: var(--oit-grey-2);
}
@media (max-width: 767px) {
  .postbox-form-input-box input::placeholder {
    font-size: 14px;
  }
}
.postbox-form-input-box input:focus {
  border: 1px solid rgb(73, 73, 73);
}
.postbox-form-textarea-box textarea {
  height: 260px;
  resize: none;
  font-size: 16px;
  font-weight: 500;
  line-height: 50px;
  border-radius: 10px;
  letter-spacing: -0.02em;
  color: var(--oit-clr-black);
  background-color: transparent;
  border: 1px solid rgba(73, 73, 73, 0.2);
}
@media (max-width: 767px) {
  .postbox-form-textarea-box textarea {
    height: 150px;
    line-height: 35px;
    font-size: 14px;
  }
}
.postbox-form-textarea-box textarea::placeholder {
  font-weight: 500;
  font-size: 16px;
  letter-spacing: -0.02em;
  color: var(--oit-grey-2);
}
@media (max-width: 767px) {
  .postbox-form-textarea-box textarea::placeholder {
    font-size: 14px;
  }
}
.postbox-form-textarea-box textarea:focus {
  border: 1px solid rgb(73, 73, 73);
}
.postbox-sidebar.right-sidebar {
  margin-left: -23px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .postbox-sidebar.right-sidebar {
    margin-left: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .postbox-sidebar.right-sidebar {
    margin-left: 0;
    margin-top: 70px;
  }
}
.postbox-sidebar.left-style {
  margin-left: 0;
  margin-right: -23px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .postbox-sidebar.left-style {
    margin-right: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .postbox-sidebar.left-style {
    margin-right: 0;
    margin-bottom: 50px;
  }
}
.postbox-area.blog-standard-style .postbox-left {
  padding: 40px;
}
.postbox-area.blog-standard-style .postbox-content {
  padding: 0 40px 30px 40px;
}
.postbox-area.blog-standard-style .postbox-title {
  margin-bottom: 0;
}
.postbox-area.blog-standard-style .blog-details-breadcrumb-badges .badge {
  background-color: var(--oit-clr-white);
}
.postbox-area.blog-standard-style .blog-details-breadcrumb-badges .badge:first-child {
  margin-left: 0;
}
.postbox-video-btn {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  margin: 0 auto;
  transform: translateY(-50%);
  display: inline-block;
  height: 120px;
  width: 120px;
  line-height: 120px;
  text-align: center;
  border-radius: 50%;
  font-size: 26px;
  background-color: var(--oit-clr-white);
}
.postbox-video-btn svg {
  color: var(--oit-clr-black);
}
.postbox-slider-arrow-wrap .postbox-arrow-prev {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 20px;
  z-index: 9;
}
.postbox-slider-arrow-wrap .postbox-arrow-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 20px;
  z-index: 9;
}
.postbox-slider-arrow-wrap button {
  padding: 0;
  height: 60px;
  width: 60px;
  line-height: 63px;
  text-align: center;
  font-size: 18px;
  border-radius: 50%;
  transition: 0.3s;
  color: var(--oit-clr-black);
  background-color: var(--oit-clr-white);
}
@media (max-width: 767px) {
  .postbox-slider-arrow-wrap button {
    font-size: 14px;
    height: 40px;
    width: 40px;
    line-height: 40px;
  }
}
.postbox-slider-arrow-wrap button:hover {
  color: var(--oit-clr-white);
  background-color: var(--oit-theme-1);
}

.oit-pagination ul li {
  display: inline-block;
  list-style-type: none;
  margin: 0 4px;
}
.oit-pagination ul li a {
  width: 60px;
  height: 60px;
  line-height: 61px;
  font-weight: 400;
  font-size: 18px;
  transition: 0.3s;
  display: inline-block;
  text-align: center;
  border-radius: 10px;
  border: 1px solid rgba(121, 121, 121, 0.2);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-pagination ul li a {
    width: 50px;
    height: 50px;
    line-height: 50px;
  }
}
@media (max-width: 767px) {
  .oit-pagination ul li a {
    width: 40px;
    height: 40px;
    line-height: 40px;
  }
}
.oit-pagination ul li a i {
  font-size: 20px;
}
.oit-pagination ul li.current a {
  color: var(--oit-clr-white);
  background-color: var(--oit-clr-black);
  border: 1px solid var(--oit-clr-black);
}
.oit-pagination ul li:hover a {
  color: var(--oit-clr-white);
  background-color: var(--oit-clr-black);
  border: 1px solid var(--oit-clr-black);
}

/*----------------------------------------*/
/*  5.3 Sidebar css
/*----------------------------------------*/
.sidebar-search-box input {
  width: 100%;
  height: 45px;
  line-height: 45px;
  padding-left: 25px;
  padding-right: 60px;
  text-transform: capitalize;
  color: var(--oit-clr-black);
  background: rgba(73, 73, 73, 0.1);
  border: 1px solid transparent;
}
.sidebar-search-box input::placeholder {
  font-weight: 400;
  font-size: 16px;
  color: var(--oit-grey-2);
}
.sidebar-search-box input:focus {
  border: 1px solid var(--oit-clr-black);
}
.sidebar-search-button button {
  position: absolute;
  top: 50%;
  right: 0;
  height: 100%;
  padding: 0 20px;
  transform: translateY(-50%);
  color: var(--oit-clr-white);
  background-color: var(--oit-clr-black);
}
.sidebar-widget {
  padding: 20px 30px 30px 30px;
  background-color: var(--oit-clr-white);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), (max-width: 767px) {
  .sidebar-widget {
    padding: 45px 25px;
  }
}
.sidebar-widget-title {
  font-weight: 600;
  font-size: 30px;
  line-height: 1.33;
  padding-bottom: 7px;
  margin-bottom: 30px;
  border-bottom: 1px solid rgba(73, 73, 73, 0.3);
}
@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) {
  .sidebar-widget-title {
    font-size: 24px;
  }
}
.sidebar-widget-list-wrap a {
  display: block;
}
.sidebar-widget-list-wrap a:not(:last-child) {
  margin-bottom: 15px;
}
.sidebar-widget-list {
  width: 100%;
  display: flex;
  font-weight: 500;
  font-size: 18px;
  transition: 0.3s;
  text-transform: capitalize;
  justify-content: space-between;
}
@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) {
  .sidebar-widget-list {
    font-size: 16px;
  }
}
.sidebar-widget-list span {
  transition: 0.3s;
}
.sidebar-widget-list.active {
  color: var(--oit-clr-black);
}
.sidebar-widget-list.active span {
  color: var(--oit-clr-black);
}
.sidebar-widget-list:hover {
  color: var(--oit-clr-black);
}
.sidebar-widget-list:hover span {
  color: var(--oit-clr-black);
}
.sidebar-widget-post ul li {
  list-style-type: none;
}
.sidebar-widget-post ul li:not(:last-child) {
  margin-bottom: 30px;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(121, 121, 121, 0.2);
}
.sidebar-widget-post .rc-post-thumb {
  margin-bottom: 15px;
}
.sidebar-widget-post .rc-post-thumb img {
  height: 160px;
  width: 100%;
  object-fit: cover;
  border-radius: 5px;
}
.sidebar-widget-post .rc-post-title {
  font-weight: 600;
  font-size: 20px;
  line-height: 1.5;
  margin-bottom: 0;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sidebar-widget-post .rc-post-title {
    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) {
  .sidebar-widget-post .rc-post-title {
    font-size: 16px;
  }
}
.sidebar-widget-post .rc-post-title a {
  transition: 0.3s;
}
.sidebar-widget-post .rc-post-title a:hover {
  color: var(--it-theme-1);
}
.sidebar-widget-post .rc-meta span {
  display: flex;
  align-items: center;
}
.sidebar-widget-post .rc-meta span i, .sidebar-widget-post .rc-meta span svg {
  margin-right: 7px;
}

/*----------------------------------------*/
/*  5.4 Blog css
/*----------------------------------------*/
@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) {
  .oit-blog-area {
    padding-top: 70px;
    padding-bottom: 40px;
  }
}
.oit-blog-content span {
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
  margin-bottom: 15px;
  display: inline-block;
  letter-spacing: -0.02em;
}
.oit-blog-content span svg {
  margin-right: 8px;
  display: inline-block;
  transform: translateY(-2px);
}
.oit-blog-title {
  font-weight: 600;
  font-size: 45px;
  line-height: 1.2;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .oit-blog-title {
    font-size: 35px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-blog-title {
    font-size: 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) {
  .oit-blog-title {
    font-size: 25px;
  }
}
.oit-blog-thumb {
  overflow: hidden;
  border-radius: 10px;
  margin-bottom: 30px;
}
.oit-blog-thumb img {
  width: 100%;
  transition: 0.9s;
}
.oit-blog-item:hover .oit-blog-thumb img {
  transform: scale(1.1);
}

/*----------------------------------------*/
/*  5.4 Blog details css
/*----------------------------------------*/
.blog-details-breadcrumb-area {
  padding-top: 245px;
}
@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) {
  .blog-details-breadcrumb-area {
    padding-top: 200px;
  }
}
@media (max-width: 767px) {
  .blog-details-breadcrumb-area {
    padding-top: 150px;
  }
}
.blog-details-breadcrumb-area.breadcrumb-style-2 {
  padding-top: 195px;
}
@media (max-width: 767px) {
  .blog-details-breadcrumb-area.breadcrumb-style-2 {
    padding-top: 150px;
  }
}
.blog-details-breadcrumb-area.breadcrumb-style-2 .shape {
  position: absolute;
  top: 15%;
  right: 8%;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .blog-details-breadcrumb-area.breadcrumb-style-2 .shape {
    transform: scale(0.7);
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .blog-details-breadcrumb-area.breadcrumb-style-2 .shape {
    display: none;
  }
}
.blog-details-breadcrumb-area.breadcrumb-style-2 .shape-2 {
  position: absolute;
  right: 8%;
  top: 40%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .blog-details-breadcrumb-area.breadcrumb-style-2 .shape-2 {
    display: none;
  }
}
.blog-details-breadcrumb-area.career-style .shape {
  top: 40%;
}
.blog-details-breadcrumb-badges .badge {
  display: inline-flex;
  align-items: center;
  font-weight: 500;
  font-size: 14px;
  padding: 9px 18px;
  border-radius: 100px;
  margin: 0 10px;
  color: var(--oit-grey-2);
  background-color: var(--oit-grey-1);
  border: 1px solid rgba(13, 13, 13, 0.05);
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .blog-details-breadcrumb-badges .badge {
    margin-bottom: 10px;
  }
}
.blog-details-breadcrumb-badges .badge svg {
  display: inline-block;
  margin-right: 6px;
}
.blog-details-breadcrumb-badges.badges-style-2 {
  padding-bottom: 100px;
  margin-bottom: 55px;
  border-bottom: 1px solid #d9d9d9;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .blog-details-breadcrumb-badges.badges-style-2 {
    padding-bottom: 30px;
    margin-bottom: 40px;
  }
}
.blog-details-breadcrumb-badges.badges-style-2 > div {
  padding: 6px 20px;
  border-radius: 100px;
  display: inline-block;
  background-color: var(--oit-grey-1);
  border: 1px solid rgba(13, 13, 13, 0.05);
}
.blog-details-breadcrumb-badges.badges-style-2 > div > .badge {
  border: none;
  padding: 0;
  background-color: transparent;
}
.blog-details-breadcrumb-title {
  font-weight: 500;
  font-size: 80px;
  line-height: 1.13;
  margin-bottom: 35px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .blog-details-breadcrumb-title {
    font-size: 70px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .blog-details-breadcrumb-title {
    font-size: 55px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog-details-breadcrumb-title {
    font-size: 56px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-details-breadcrumb-title {
    font-size: 45px;
  }
}
@media (max-width: 767px) {
  .blog-details-breadcrumb-title {
    font-size: 35px;
  }
  .blog-details-breadcrumb-title br {
    display: none;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .blog-details-breadcrumb-title {
    font-size: 58px;
  }
}
.blog-details-breadcrumb-author-wrap {
  margin-bottom: 140px;
  border-radius: 1000px;
  padding: 20px 30px 20px 20px;
  background-color: var(--oit-grey-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) {
  .blog-details-breadcrumb-author-wrap {
    margin-bottom: 100px;
  }
}
.blog-details-breadcrumb-author-wrap img {
  width: 60px;
  height: 60px;
  margin-right: 15px;
  border-radius: 1000px;
}
.blog-details-breadcrumb-author-wrap.author-style-2 {
  padding: 0;
  margin-bottom: 0;
  border-radius: 0;
  background-color: transparent;
}
.blog-details-breadcrumb-author-wrap.author-style-2 img {
  border-radius: 10px;
}
.blog-details-breadcrumb-author-info .title-sm {
  font-weight: 500;
  font-size: 18px;
  margin-bottom: 0;
}
.blog-details-breadcrumb-author-info span {
  font-size: 14px;
}
.blog-details-breadcrumb-big-title {
  font-weight: 600;
  font-size: 144px;
  line-height: 1.07;
  margin-bottom: 80px;
}
.blog-details-breadcrumb-big-title.title-mb {
  margin-bottom: 25px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .blog-details-breadcrumb-big-title {
    font-size: 100px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog-details-breadcrumb-big-title {
    font-size: 85px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-details-breadcrumb-big-title {
    font-size: 65px;
  }
}
@media (max-width: 767px) {
  .blog-details-breadcrumb-big-title {
    font-size: 31px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .blog-details-breadcrumb-big-title {
    font-size: 50px;
  }
}
.blog-details-date-box span {
  font-size: 30px;
  font-weight: 500;
  display: inline-block;
  margin-right: 5px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog-details-date-box span {
    font-size: 24px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .blog-details-date-box span {
    font-size: 15px;
  }
}
.blog-details-date-box strong {
  font-weight: 500;
  font-size: 30px;
  color: var(--oit-clr-black);
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog-details-date-box strong {
    font-size: 24px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .blog-details-date-box strong {
    font-size: 15px;
  }
}

/*----------------------------------------*/
/*  6.1 Footer Style 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) {
  .oit-footer-area {
    padding-top: 70px;
    padding-bottom: 0px;
  }
}
.oit-footer-widget {
  padding: 50px;
  min-height: 560px;
  border-radius: 30px;
  background-color: #101216;
  border: 1px solid rgba(255, 255, 255, 0.05);
}
@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) {
  .oit-footer-widget {
    padding: 30px;
  }
}
.oit-footer-widget-menu ul li {
  list-style-type: none;
}
.oit-footer-widget-menu ul li:not(:last-child) {
  margin-bottom: 22px;
}
.oit-footer-widget-menu ul li a {
  font-weight: 400;
  font-size: 30px;
  line-height: 1;
  color: var(--oit-clr-white);
  font-family: var(--oit-ff-funnel);
}
.oit-footer-widget-menu ul li a svg {
  margin-right: 5px;
  display: inline-block;
  transform: translateY(-3px);
}
.oit-footer-widget-menu ul li a:hover svg {
  transform: translateY(-3px);
  animation: shape-rotate 5s linear infinite;
}
.oit-footer-widget-rules a {
  font-weight: 500;
  font-size: 17px;
  line-height: 1;
  color: var(--oit-clr-white);
}
.oit-footer-widget-info {
  flex: 1;
}
.oit-footer-widget-info a {
  display: block;
  text-align: center;
  font-weight: 400;
  font-size: 30px;
  line-height: 1.2;
  padding: 70px 10px;
  letter-spacing: -0.01em;
  color: var(--oit-clr-white);
  font-family: var(--oit-ff-funnel);
  padding: 70px 10px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .oit-footer-widget-info a {
    font-size: 25px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), (max-width: 767px) {
  .oit-footer-widget-info a {
    font-size: 24px;
  }
}
.oit-footer-widget-info a:first-child {
  padding-top: 0;
}
.oit-footer-widget-info a:last-child {
  padding-bottom: 0;
}
.oit-footer-widget-info a:not(:last-child) {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.oit-footer-widget-social a {
  font-weight: 400;
  font-size: 30px;
  line-height: 1;
  color: var(--oit-clr-white);
  font-family: var(--oit-ff-funnel);
  padding: 25px 0;
}
.oit-footer-widget-social a:first-child {
  padding-top: 0;
}
.oit-footer-widget-social a:last-child {
  padding-bottom: 0;
}
.oit-footer-widget-social a:not(:last-child) {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.oit-footer-widget-social a:not(:last-child):hover {
  border-bottom: 1px solid rgba(255, 255, 255, 0.9);
}
.oit-footer-widget-copyright p {
  font-weight: 500;
  font-size: 17px;
  line-height: 1.5;
  margin-bottom: 0;
  color: var(--oit-clr-white);
}
.oit-footer-2-widget-title {
  font-weight: 500;
  font-size: 30px;
  line-height: 1;
  margin-bottom: 25px;
  color: var(--oit-clr-white);
}
.oit-footer-2-widget p {
  font-weight: 500;
  font-size: 20px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.6);
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .oit-footer-2-widget p br {
    display: none;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-footer-2-widget p {
    font-size: 18px;
  }
  .oit-footer-2-widget p br {
    display: none;
  }
}
.oit-footer-2-widget-menu ul li {
  list-style: none;
  display: inline-block;
  margin-bottom: 8px;
}
.oit-footer-2-widget-menu ul li:not(:last-child) {
  margin-right: 5px;
}
.oit-footer-2-widget-menu ul li a {
  padding: 12px 30px;
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
  border-radius: 100px;
  display: inline-block;
  letter-spacing: -0.02em;
  background: #202020;
  color: var(--oit-clr-white);
  text-transform: uppercase;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .oit-footer-2-widget-menu ul li a {
    padding: 12px 19px;
    font-size: 14px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-footer-2-widget-menu ul li a {
    padding: 9px 15px;
    font-size: 14px;
  }
}
.oit-footer-2-widget-menu ul li a:hover {
  color: var(--oit-clr-black);
  border-color: var(--oit-clr-white);
  background-color: var(--oit-clr-white);
}
.oit-footer-2-widget-social a {
  height: 50px;
  width: 50px;
  line-height: 44px;
  display: inline-block;
  border-radius: 50%;
  text-align: center;
  background: #202020;
  color: var(--oit-clr-white);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.oit-footer-2-widget-social a:not(:last-child) {
  margin-right: 5px;
}
.oit-footer-2-widget-social a:hover {
  color: var(--oit-clr-black);
  border-color: var(--oit-clr-white);
  background-color: var(--oit-clr-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) {
  .oit-footer-2-area {
    padding-top: 70px;
  }
}
.oit-footer-2-shape {
  position: absolute;
  bottom: 0%;
  left: 28%;
  z-index: -1;
  animation: shape-rotate 40s linear infinite;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-footer-2-shape {
    bottom: 10%;
  }
}

@media (max-width: 767px) {
  .footer-widget-2-1 {
    padding-bottom: 0;
    margin-bottom: 60px;
  }
}
.footer-widget-2-2, .footer-widget-2-4 {
  padding-left: 115px;
}
@media (max-width: 767px) {
  .footer-widget-2-2, .footer-widget-2-4 {
    padding-left: 0;
  }
}

.oit-copyright-2-style {
  padding-top: 20px;
  padding-bottom: 15px;
  border-top: 1px solid rgba(255, 255, 255, 0.2);
}
.oit-copyright-2-style .oit-copyright-left p {
  color: var(--oit-clr-white);
}
.oit-copyright-2-style .oit-copyright-right a, .oit-copyright-2-style .oit-copyright-right span {
  color: var(--oit-clr-white);
}

/*----------------------------------------*/
/*                                         \
\   1.5 DESIGN AGENCY CSS START HERE       \          
|                                          \
/*----------------------------------------*/
/*----------------------------------------*/
/* hero css start here
/*----------------------------------------*/
.oit-hero-ptb {
  padding-top: 160px;
  padding-bottom: 50px;
}
.oit-hero-img {
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
}
.oit-hero-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (max-width: 767px) {
  .oit-hero-content {
    margin-bottom: 40px;
  }
}
.oit-hero-content p {
  font-weight: 600;
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 35px;
  letter-spacing: -0.01em;
  color: var(--oit-clr-white);
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-hero-content p {
    font-size: 16px;
  }
  .oit-hero-content p br {
    display: none;
  }
}
.oit-hero-category {
  padding: 30px;
  padding-top: 20px;
  min-width: 350px;
  border-radius: 10px;
  display: inline-block;
  backdrop-filter: blur(40px);
  border: 1px solid rgba(255, 255, 255, 0.2);
  background-color: rgba(255, 255, 255, 0.1);
}
.oit-hero-category-title {
  font-weight: 600;
  font-size: 20px;
  line-height: 1.5;
  letter-spacing: -0.01em;
  color: var(--oit-clr-white);
}
.oit-hero-category-item a {
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
  padding: 20px 0;
  display: block;
  letter-spacing: -0.02em;
  color: rgba(255, 255, 255, 0.6);
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.oit-hero-category-item a:hover {
  color: var(--oit-clr-white);
}
.oit-hero-category-item.active a {
  color: var(--oit-clr-white);
}
.oit-hero-bigtext {
  line-height: 0.8;
  font-size: 245px;
  font-weight: 700;
  margin-bottom: 0;
  letter-spacing: -7px;
  color: var(--oit-clr-white);
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .oit-hero-bigtext {
    font-size: 220px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .oit-hero-bigtext {
    font-size: 195px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-hero-bigtext {
    font-size: 165px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .oit-hero-bigtext {
    font-size: 135px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-hero-bigtext {
    font-size: 110px;
  }
}
@media (max-width: 767px) {
  .oit-hero-bigtext {
    font-size: 80px;
    letter-spacing: 0.7px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .oit-hero-bigtext {
    font-size: 70px;
    letter-spacing: 0.7px;
  }
}
.oit-hero-shape-1 {
  margin-bottom: 160px;
  display: inline-block;
  color: var(--oit-clr-white);
  animation: shape-rotate 2s linear infinite;
}
@media (max-width: 767px) {
  .oit-hero-shape-1 {
    margin-bottom: 50px;
  }
}
@media (max-width: 767px) {
  .oit-hero-text-wrap {
    margin-top: 40px;
  }
}

/*----------------------------------------*/
/* about css start here
/*----------------------------------------*/
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-about-area {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .oit-about-area {
    padding-bottom: 80px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-about-area {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
@media (max-width: 767px) {
  .oit-about-text {
    margin-bottom: 30px;
  }
}
.oit-about-text p {
  font-weight: 600;
  font-size: 45px;
  line-height: 1.2;
  color: var(--oit-clr-black);
  font-family: var(--oit-ff-funnel);
}
.oit-about-text p span {
  color: rgba(0, 0, 0, 0.4);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .oit-about-text p {
    font-size: 40px;
  }
  .oit-about-text p br {
    display: none;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-about-text p {
    font-size: 35px;
  }
  .oit-about-text p br {
    display: none;
  }
}
@media (max-width: 767px) {
  .oit-about-text p {
    font-size: 30px;
  }
  .oit-about-text p br {
    display: none;
  }
}
.oit-about-thumb {
  flex: 0 0 auto;
  margin-right: 35px;
  height: 100%;
  border-radius: 20px;
  overflow: hidden;
}
@media (max-width: 767px) {
  .oit-about-thumb {
    width: 100%;
    margin-right: 0;
    margin-bottom: 30px;
  }
}
.oit-about-thumb img {
  width: 100%;
  border-radius: 20px;
}
.oit-about-content {
  height: 100%;
  padding-right: 80px;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), 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) {
  .oit-about-content {
    padding-right: 0;
  }
}
@media (max-width: 767px) {
  .oit-about-content {
    flex-wrap: wrap;
  }
}
.oit-about-content p {
  font-weight: 500;
  font-size: 18px;
  line-height: 1.8;
  margin-bottom: 130px;
  letter-spacing: -0.04em;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), 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) {
  .oit-about-content p br {
    display: none;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .oit-about-content p {
    font-size: 16px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-about-content p {
    font-size: 15px;
  }
}
@media (max-width: 767px) {
  .oit-about-content p {
    margin-bottom: 40px;
  }
}
@media (max-width: 767px) {
  .oit-about-content-wrap {
    flex-wrap: wrap;
  }
}
.oit-about-shape {
  position: absolute;
  top: 14%;
  left: 12%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .oit-about-shape {
    top: 1%;
    left: auto;
    right: 5%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-about-btn {
    padding-bottom: 65px;
  }
}
@media (max-width: 767px) {
  .oit-about-btn {
    padding-bottom: 40px;
  }
}

/*----------------------------------------*/
/* project css start here
/*----------------------------------------*/
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-project-area {
    padding-top: 70px;
  }
}
.oit-project-area.dg-project-style .oit-project-content {
  padding-left: 0;
  padding-right: 0;
}
.oit-project-area.dg-project-style span:first-child::after {
  display: none;
}
.oit-project-area.project-style-2 .project-item-1 {
  margin-top: 285px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-project-area.project-style-2 .project-item-1 {
    margin-top: 60px;
  }
}
@media (max-width: 767px) {
  .oit-project-area.project-style-2 .project-item-1 {
    margin-top: 0;
  }
}
.oit-project-area.project-style-2 .project-item-3 {
  margin-top: 55px;
  margin-bottom: 95px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-project-area.project-style-2 .project-item-3 {
    margin-top: 20px;
  }
}
@media (max-width: 767px) {
  .oit-project-area.project-style-2 .project-item-3 {
    margin-bottom: 40px;
    margin-top: 0px;
  }
}
.oit-project-area.project-style-2 .project-item-5 {
  margin-top: 80px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-project-area.project-style-2 .project-item-5 {
    margin-top: 20px;
  }
}
.oit-project-area.project-style-2 .oit-project-thumb {
  border-radius: 0;
}
.oit-project-area.project-style-2 .oit-project-thumb img {
  border-radius: 0;
}
.oit-project-area.project-style-2 .oit-project-item {
  border-radius: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .oit-project-area.project-style-2 .oit-project-title {
    font-size: 25px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-project-area.project-style-2 .oit-project-title {
    font-size: 20px;
  }
}
@media (max-width: 767px) {
  .oit-project-area.project-style-2 .oit-project-title {
    font-size: 25px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-project-area.project-style-2 .oit-project-category span {
    font-size: 16px;
  }
}
.oit-project-shape {
  position: absolute;
  top: 95px;
  right: 2%;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .oit-project-shape {
    right: -3%;
    transform: scale(0.6);
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-project-shape {
    top: 0;
    right: -4%;
    transform: scale(0.6);
  }
}
.oit-project-thumb {
  width: 100%;
}
.oit-project-thumb img {
  border-radius: 10px;
}
.oit-project-content {
  padding: 30px;
  padding-bottom: 15px;
  padding-top: 25px;
  background-color: var(--oit-grey-1);
}
@media (max-width: 767px) {
  .oit-project-content {
    flex-wrap: wrap;
  }
}
.oit-project-title {
  font-weight: 500;
  font-size: 45px;
  line-height: 1;
  margin-bottom: 0;
  padding-bottom: 15px;
  letter-spacing: -0.01em;
  color: var(--oit-clr-black);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .oit-project-title {
    font-size: 35px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-project-title {
    font-size: 30px;
  }
}
@media (max-width: 767px) {
  .oit-project-title {
    font-size: 25px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .oit-project-title {
    font-size: 30px;
  }
}
.oit-project-category {
  padding-bottom: 15px;
}
.oit-project-category span {
  position: relative;
  font-weight: 500;
  font-size: 20px;
  line-height: 1;
  color: #494949;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .oit-project-category span {
    font-size: 18px;
  }
}
.oit-project-category span:first-child {
  padding-right: 20px;
  margin-right: 20px;
}
.oit-project-category span:first-child::after {
  position: absolute;
  top: 9px;
  right: -5px;
  content: "";
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background-color: #494949;
}
.oit-project-item {
  border-radius: 10px;
  overflow: hidden;
}

/*----------------------------------------*/
/* service css start here
/*----------------------------------------*/
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-service-area {
    padding-top: 80px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-service-area .oit-project-shape {
    top: 2%;
    right: 4%;
  }
}
.oit-service-item {
  padding: 50px;
  border-radius: 24px;
  margin: 0 125px;
  margin-bottom: 50px;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), 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) {
  .oit-service-item {
    margin: 0;
    margin-bottom: 50px;
  }
}
@media (max-width: 767px) {
  .oit-service-item {
    margin: 0;
    padding: 30px;
    margin-bottom: 30px;
  }
}
.oit-service-thumb {
  flex: 0 0 auto;
  overflow: hidden;
  margin-right: 35px;
  border-radius: 14px;
  border: 2px solid var(--oit-clr-white);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-service-thumb {
    margin-right: 0;
    margin-bottom: 30px;
  }
}
@media (max-width: 767px) {
  .oit-service-thumb {
    margin-right: 0;
    margin-bottom: 30px;
    flex: auto;
  }
}
.oit-service-title {
  font-weight: 600;
  font-size: 45px;
  line-height: 1.2;
  margin-bottom: 40px;
  color: var(--oit-clr-black);
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .oit-service-title {
    margin-bottom: 25px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-service-title {
    font-size: 35px;
    margin-bottom: 25px;
  }
}
@media (max-width: 767px) {
  .oit-service-title {
    font-size: 30px;
    margin-bottom: 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) {
  .oit-service-content-wrap {
    flex-wrap: wrap;
  }
}
.oit-service-content p {
  font-weight: 500;
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 30px;
  letter-spacing: -0.04em;
  color: var(--oit-clr-black);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .oit-service-content p br {
    display: none;
  }
}
@media (max-width: 767px) {
  .oit-service-content p {
    font-size: 17px;
  }
  .oit-service-content p br {
    display: none;
  }
}
.oit-service-category {
  margin-bottom: 15px;
}
.oit-service-category span {
  font-weight: 500;
  font-size: 18px;
  line-height: 1.1;
  color: #494949;
  letter-spacing: -0.04em;
}
@media (max-width: 767px) {
  .oit-service-category span {
    font-size: 16px;
  }
}
.oit-service-category span svg {
  margin-right: 10px;
  transform: translateY(2px);
}

/*----------------------------------------*/
/* funfact css start here
/*----------------------------------------*/
.oit-funfact-title {
  font-weight: 400;
  font-size: 100px;
  line-height: 0.8;
  margin-bottom: 35px;
  text-transform: uppercase;
  color: var(--oit-clr-black);
}
.oit-funfact-title i {
  font-style: normal;
}
.oit-funfact-area .row > [class^=col]:not(:last-child) .oit-funfact-item {
  border-inline-end: 1px solid rgba(0, 0, 0, 0.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) {
  .oit-funfact-area .row > [class^=col]:not(:last-child) .oit-funfact-item {
    border-inline-end: 0;
  }
}
.oit-funfact-item {
  padding: 65px 30px;
  height: 100%;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-funfact-item {
    padding: 40px 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) {
  .oit-funfact-item {
    padding: 30px 0;
    border-right: 0;
  }
}
.oit-funfact-item span {
  font-weight: 500;
  font-size: 16px;
  line-height: 1.5;
  text-transform: uppercase;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-funfact-item span {
    font-size: 14px;
  }
}
.oit-funfact-bdr {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.oit-funfact-area .row [class*=col-]:last-child .oit-funfact-item {
  border-right: 0;
}

/*----------------------------------------*/
/* award css start here
/*----------------------------------------*/
@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) {
  .oit-award-area {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
.oit-award-title-box p {
  font-weight: 500;
  font-size: 18px;
  line-height: 1.6;
  letter-spacing: -0.04em;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-award-title-box p br {
    display: none;
  }
}
@media (max-width: 767px) {
  .oit-award-title-box p {
    font-size: 16px;
  }
  .oit-award-title-box p br {
    display: none;
  }
}
.oit-award-icon {
  transition: all 0.3s ease-in-out;
}
@media (max-width: 767px) {
  .oit-award-icon {
    text-align: center;
  }
}
@media (max-width: 767px) {
  .oit-award-content {
    flex-direction: column;
  }
}
.oit-award-content p, .oit-award-content span {
  font-weight: 500;
  font-size: 30px;
  line-height: 0.87;
  margin-bottom: 0;
  transition: all 0.3s ease-in-out;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .oit-award-content p, .oit-award-content span {
    font-size: 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) {
  .oit-award-content p, .oit-award-content span {
    font-size: 20px;
  }
}
@media (max-width: 767px) {
  .oit-award-content p, .oit-award-content span {
    flex-wrap: wrap;
    font-size: 18px;
    text-align: center;
  }
}
.oit-award-content p {
  padding-left: 20px;
}
@media (max-width: 767px) {
  .oit-award-content p {
    padding-left: 0;
    padding: 20px 0;
  }
}
.oit-award-content span {
  color: var(--oit-clr-black);
}
.oit-award-item {
  padding: 35px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.oit-award-item:hover .oit-award-icon {
  transform: translateX(20px);
}
@media (max-width: 767px) {
  .oit-award-item:hover .oit-award-icon {
    transform: translateX(0px);
  }
}
@media (max-width: 767px) {
  .oit-award-item:hover .oit-award-content span {
    transform: translateX(0px);
  }
}
.oit-award-item-wrap {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

/*----------------------------------------*/
/* team css start here
/*----------------------------------------*/
@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) {
  .oit-team-area {
    padding-top: 80px;
    padding-bottom: 60px;
  }
}
.oit-team-item {
  padding: 55px 50px;
  border-radius: 10px;
  background-color: #F5F5F5;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-team-item {
    padding: 30px 30px;
  }
}
.oit-team-title {
  font-weight: 600;
  font-size: 45px;
  line-height: 1.2;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-team-title {
    font-size: 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .oit-team-title {
    font-size: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-team-title {
    font-size: 25px;
  }
}
@media (max-width: 767px) {
  .oit-team-title {
    font-size: 25px;
  }
}
.oit-team-content span {
  font-weight: 600;
  font-size: 20px;
  line-height: 1;
  display: inline-block;
  color: rgba(13, 13, 13, 0.6);
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-team-content span {
    font-size: 16px;
  }
}
@media (max-width: 767px) {
  .oit-team-content span {
    font-size: 16px;
    margin-bottom: 10px;
  }
}
.oit-team-social span {
  font-weight: 400;
  font-size: 30px;
  line-height: 1;
  color: var(--oit-clr-black);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-team-social span {
    font-size: 20px;
  }
}
@media (max-width: 767px) {
  .oit-team-social span {
    font-size: 16px;
  }
}
.oit-team-social span:not(:first-child) {
  margin-left: 30px;
}
@media (max-width: 767px) {
  .oit-team-social span:not(:first-child) {
    margin-left: 15px;
  }
}

/*----------------------------------------*/
/* price css start here
/*----------------------------------------*/
@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) {
  .oit-price-area {
    padding-top: 80px;
    padding-bottom: 50px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-price-area .oit-section-title-box {
    padding-left: 0;
    margin-bottom: 50px;
  }
}
.oit-price-item {
  padding: 45px 50px;
  border-radius: 30px;
  min-height: 585px;
  background-color: #101216;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
@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) {
  .oit-price-item {
    min-height: auto;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-price-item {
    padding: 35px 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) {
  .oit-price-item {
    padding: 30px;
  }
}
.oit-price-title {
  font-weight: 600;
  font-size: 30px;
  line-height: 1.3;
  color: var(--oit-clr-white);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-price-title {
    font-size: 25px;
  }
}
@media (max-width: 767px) {
  .oit-price-title {
    font-size: 20px;
  }
}
.oit-price-head {
  padding-bottom: 40px;
  margin-bottom: 40px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-price-head {
    flex-wrap: wrap;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-price-head-content {
    margin-right: 20px;
    margin-bottom: 30px;
  }
}
@media (max-width: 767px) {
  .oit-price-head-content {
    margin-right: 0;
    margin-bottom: 30px;
  }
}
.oit-price-head-content p {
  font-weight: 500;
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 0;
  color: rgba(255, 255, 255, 0.7);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .oit-price-head-content p br {
    display: none;
  }
}
@media (max-width: 767px) {
  .oit-price-head-content p {
    font-size: 16px;
  }
  .oit-price-head-content p br {
    display: none;
  }
}
.oit-price-head-btn .nav {
  padding: 6px;
  border-radius: 1000px;
  background-color: #0D0D0D;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.oit-price-head-btn .nav button {
  font-weight: 600;
  font-size: 18px;
  line-height: 1;
  text-align: center;
  border-radius: 1000px;
  padding: 18px 19px;
  display: inline-block;
  color: var(--oit-clr-white);
  background-color: transparent;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .oit-price-head-btn .nav button {
    font-size: 16px;
    padding: 10px 19px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-price-head-btn .nav button {
    padding: 11px 20px;
  }
}
.oit-price-head-btn .nav button.active {
  color: var(--oit-clr-black);
  background-color: var(--oit-clr-white);
}
.oit-price-list-item {
  display: flex;
  font-weight: 500;
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 15px;
  letter-spacing: -0.04em;
  color: rgba(255, 255, 255, 0.7);
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-price-list-item {
    font-size: 14px;
  }
}
.oit-price-list-item i {
  margin-right: 8px;
  transform: translateY(-1px);
}
.oit-price-list-label {
  font-weight: 600;
  font-size: 20px;
  line-height: 1.2;
  color: var(--oit-clr-white);
}
.oit-price-btn-box {
  padding: 20px 40px;
  padding-right: 20px;
  border-radius: 10px;
  background-color: #0D0D0D;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
@media (max-width: 767px) {
  .oit-price-btn-box {
    flex-wrap: wrap;
    padding: 20px;
  }
}
.oit-price-range {
  font-weight: 600;
  font-size: 45px;
  line-height: 1.2;
  color: var(--oit-clr-white);
}
@media (max-width: 767px) {
  .oit-price-range {
    margin-right: 20px;
    margin-bottom: 20px;
  }
}
.oit-price-range i {
  font-style: normal;
  font-size: 14px;
  letter-spacing: -0.01em;
  color: rgba(255, 255, 255, 0.7);
}
@media (max-width: 767px) {
  .oit-price-avater-box {
    flex-wrap: wrap;
  }
  .oit-price-avater-box img {
    margin-bottom: 10px;
  }
}
.oit-price-avater-box span {
  position: relative;
  font-weight: 500;
  font-size: 18px;
  line-height: 1.6;
  letter-spacing: -0.04em;
  color: rgba(255, 255, 255, 0.7);
}
.oit-price-avater-box span::before {
  content: "";
  height: 15px;
  width: 15px;
  margin-right: 7px;
  border-radius: 50%;
  display: inline-block;
  background-color: #15DB46;
}
.oit-price-info {
  padding: 40px 40px;
  border-radius: 10px;
  background-color: #0D0D0D;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .oit-price-info {
    padding: 40px 30px;
  }
}
@media (max-width: 767px) {
  .oit-price-info {
    padding: 10px;
  }
}
.oit-price-info-icon {
  height: 60px;
  width: 60px;
  border-radius: 50%;
  display: inline-block;
  line-height: 58px;
  text-align: center;
  font-size: 24px;
  margin-right: 15px;
  flex: 0 0 auto;
  color: rgba(255, 255, 255, 0.8);
  background-color: #101216;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
.oit-price-info-desc span {
  display: block;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.2;
  margin-bottom: 12px;
  color: rgba(255, 255, 255, 0.7);
}
.oit-price-info-desc a {
  font-weight: 600;
  font-size: 20px;
  line-height: 1.1;
  color: var(--oit-clr-white);
}
@media (max-width: 767px) {
  .oit-price-info-desc a {
    font-size: 16px;
  }
}

/*----------------------------------------*/
/* faq css start here
/*----------------------------------------*/
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-faq-area {
    padding-top: 70px;
    padding-bottom: 50px;
  }
}
.oit-faq-style .oit-price-item {
  padding: 45px 50px;
  min-height: auto;
  display: inline-block;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-faq-style .oit-price-item {
    padding: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-faq-style .oit-price-item {
    padding: 30px;
    width: 100%;
  }
}
.oit-faq-accordion-wrap .accordion-item {
  position: relative;
  margin-bottom: 25px;
  padding: 30px 40px;
  border-radius: 10px;
  background-color: var(--oit-clr-white);
}
@media (max-width: 767px) {
  .oit-faq-accordion-wrap .accordion-item {
    padding: 30px;
  }
}
.oit-faq-accordion-wrap .accordion-button {
  font-weight: 600;
  font-size: 30px;
  line-height: 1.3;
  padding-right: 40px;
  font-family: var(--oit-ff-funnel);
}
@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) {
  .oit-faq-accordion-wrap .accordion-button {
    font-size: 20px;
  }
}
.oit-faq-accordion-wrap .accordion-button:not(.collapsed) .accordion-icon svg {
  transform: rotate(135deg);
}
.oit-faq-accordion-wrap .accordion-body {
  padding-right: 50px;
}
@media (max-width: 767px) {
  .oit-faq-accordion-wrap .accordion-body {
    padding-right: 0;
  }
}
.oit-faq-accordion-wrap .accordion-body p {
  padding-top: 10px;
  margin-bottom: 0;
  font-weight: 500;
  font-size: 18px;
  line-height: 1.6;
  letter-spacing: -0.04em;
}
@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) {
  .oit-faq-accordion-wrap .accordion-body p {
    font-size: 15px;
  }
}
.oit-faq-accordion-wrap .accordion-icon {
  position: absolute;
  top: -3px;
  right: 0;
}
.oit-faq-accordion-wrap .accordion-icon svg {
  transition: 0.3s;
}

/*----------------------------------------*/
/* text-slider css start here
/*----------------------------------------*/
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-text-slider-area {
    padding-top: 70px;
    padding-bottom: 60px;
  }
}
.oit-text-slider-item {
  gap: 40px;
  -webkit-animation: text-slide-animation 30s linear infinite;
  animation: text-slide-animation 30s linear infinite;
  transition: animation-duration 300ms;
}
.oit-text-slider-item.slide-ltr {
  -webkit-animation: text-slide-animation-2 30s linear infinite;
  animation: text-slide-animation-2 30s linear infinite;
  transition: animation-duration 300ms;
}
.oit-text-slider-item span {
  font-weight: 800;
  font-size: 100px;
  line-height: 1;
  color: #494949;
  white-space: nowrap;
  text-transform: uppercase;
}
@media (max-width: 767px) {
  .oit-text-slider-item span {
    font-size: 60px;
  }
}
.oit-text-slider-item span svg {
  margin-top: -10px;
  display: inline-block;
  animation: shape-rotate 10s linear infinite;
}
.oit-text-slider-item img {
  margin: 0 -20px;
}
.oit-text-slider-btn {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  z-index: 1;
  margin: 0 auto;
  text-align: center;
  transform: translateY(-50%);
}

/*----------------------------------------*/
/*                                         \
\   1.7 DIGITAL AGENCY CSS HERE            \          
|                                          \
/*----------------------------------------*/
/*----------------------------------------*/
/* hero css start here
/*----------------------------------------*/
.dg-hero-bdr {
  padding-left: 110px;
  border-left: 1px dashed var(--oit-clr-black);
  border-right: 1px dashed var(--oit-clr-black);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .dg-hero-bdr {
    padding-left: 20px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .dg-hero-bdr {
    padding-left: 20px;
    padding-top: 120px;
    padding-bottom: 60px;
  }
}
@media (max-width: 767px) {
  .dg-hero-bdr {
    padding-left: 20px;
    padding-top: 120px;
    padding-right: 20px;
    padding-bottom: 60px;
  }
}
.dg-hero-title {
  font-weight: 800;
  font-size: 200px;
  line-height: 0.95;
  text-transform: uppercase;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .dg-hero-title {
    font-size: 145px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .dg-hero-title {
    font-size: 140px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .dg-hero-title {
    font-size: 100px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .dg-hero-title {
    font-size: 90px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .dg-hero-title {
    font-size: 60px;
  }
}
@media (max-width: 767px) {
  .dg-hero-title {
    font-size: 35px;
    margin-bottom: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .dg-hero-title-box {
    margin-bottom: 20px;
  }
}
.dg-hero-title img {
  transform: translateY(-16px);
  border-radius: 1000px;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px) {
  .dg-hero-title img {
    transform: translateY(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) {
  .dg-hero-title img {
    display: none;
  }
}
.dg-hero-content p {
  font-weight: 600;
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 0;
  letter-spacing: -0.01em;
  color: var(--oit-clr-black);
}
@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) {
  .dg-hero-content p br {
    display: none;
  }
}
@media (max-width: 767px) {
  .dg-hero-content p {
    font-size: 16px;
  }
}
.dg-hero-img {
  position: absolute;
  bottom: 0;
  right: 0;
  overflow: hidden;
  border-radius: 10px 10px 0 0;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .dg-hero-img {
    max-width: 40%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .dg-hero-img {
    border-radius: 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) {
  .dg-hero-img {
    position: static;
    max-width: 40%;
    border-radius: 10px;
    margin-bottom: 20px;
  }
}

/*----------------------------------------*/
/* about css start here
/*----------------------------------------*/
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .dg-about-style {
    padding-top: 70px;
  }
}
@media (max-width: 767px) {
  .dg-about-style.oit-about-area {
    padding-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) {
  .dg-about-style .oit-about-text {
    margin-bottom: 40px;
  }
}
.dg-about-style .oit-about-thumb {
  margin-right: 0;
  height: auto;
}
.dg-about-style .oit-about-content {
  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) {
  .dg-about-style .oit-about-content {
    margin-bottom: 40px;
  }
}
.dg-about-style .oit-about-content p {
  margin-bottom: 40px;
  padding-right: 120px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .dg-about-style .oit-about-content 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) {
  .dg-about-style .oit-about-content p {
    padding-right: 0;
    font-size: 16px;
  }
}
.dg-about-style .oit-funfact-item {
  padding: 0;
  border-right: 0;
}
@media (max-width: 767px) {
  .dg-about-style .oit-funfact-item {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), (max-width: 767px) {
  .dg-about-style .oit-funfact-item span {
    font-size: 14px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .dg-about-style .oit-funfact-title {
    font-size: 80px;
    margin-bottom: 12px;
  }
}
.dg-about-shape {
  position: absolute;
  top: 8%;
  right: 10%;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .dg-about-shape {
    right: 3%;
  }
}

/*----------------------------------------*/
/* service css start here
/*----------------------------------------*/
.dg-service-style .oit-service-item {
  padding: 20px;
  border: 1px solid rgba(255, 255, 255, 0.1);
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .dg-service-style .oit-service-item {
    flex-wrap: wrap;
  }
}
.dg-service-style .oit-service-title {
  color: var(--oit-clr-white);
}
@media (max-width: 767px) {
  .dg-service-style .oit-service-content {
    padding-bottom: 30px;
  }
}
.dg-service-style .oit-service-content p {
  padding-bottom: 30px;
  margin-bottom: 40px;
  color: rgba(255, 255, 255, 0.7);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.dg-service-style .oit-service-content-wrap {
  padding: 20px 30px;
  padding-right: 62px;
}
@media (max-width: 767px) {
  .dg-service-style .oit-service-content-wrap {
    padding: 0;
  }
}
.dg-service-style .oit-service-category span {
  color: rgba(255, 255, 255, 0.7);
}
.dg-service-style .oit-service-thumb {
  margin-right: 0;
  border: 2px solid var(--oit-clr-white);
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .dg-service-style .oit-service-thumb {
    margin-bottom: 0;
    width: 100%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .dg-service-style .oit-service-thumb img {
    width: 100%;
  }
}

/*----------------------------------------*/
/* project css start here
/*----------------------------------------*/
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .dg-project-style {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}
.dg-project-style .oit-project-content {
  background-color: transparent;
}
.dg-project-style .oit-project-thumb {
  border-radius: 14px;
  overflow: hidden;
}
.dg-project-style .oit-project-shape {
  top: -3%;
  right: -6%;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .dg-project-style .oit-project-shape {
    right: -7%;
    transform: scale(0.4);
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .dg-project-style .oit-section-title-box {
    margin-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) {
  .dg-project-style .oit-project-btn {
    margin-top: 0px;
  }
}

/*----------------------------------------*/
/* funfact css start here
/*----------------------------------------*/
@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) {
  .dg-funfact-area {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
.dg-funfact-style .oit-award-title-box p {
  padding-right: 110px;
}
@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) {
  .dg-funfact-style .oit-award-title-box p {
    padding-right: 0;
  }
}
.dg-funfact-item {
  padding-bottom: 30px;
  margin-bottom: 30px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.dg-funfact-item p {
  font-weight: 600;
  font-size: 20px;
  line-height: 1.4;
  margin-bottom: 0;
  text-align: end;
}
@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) {
  .dg-funfact-item p {
    font-size: 16px;
  }
}
.dg-funfact-title {
  font-weight: 500;
  font-size: 120px;
  line-height: 0.67;
  text-transform: uppercase;
  color: var(--oit-clr-black);
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .dg-funfact-title {
    font-size: 90px;
  }
}
@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) {
  .dg-funfact-title {
    font-size: 80px;
  }
}
@media (max-width: 767px) {
  .dg-funfact-title {
    font-size: 60px;
  }
}
.dg-funfact-title span {
  font-size: 45px;
}
.dg-funfact-title i {
  font-style: normal;
}

/*----------------------------------------*/
/* bin-to-card css start here
/*----------------------------------------*/
@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) {
  .oit-bin-to-card-area {
    padding-top: 70px;
    padding-bottom: 40px;
  }
}
.oit-bin-to-card-item {
  position: relative;
  z-index: 1;
  overflow: hidden;
  border-radius: 10px;
  padding: 30px 30px 40px 30px;
}
.oit-bin-to-card-item.card-1 {
  min-height: 425px;
}
.oit-bin-to-card-item.card-3 {
  min-height: 300px;
}
.oit-bin-to-card-item p {
  font-weight: 600;
  font-size: 20px;
  color: var(--oit-clr-white);
}
.oit-bin-to-card-item > span {
  font-weight: 500;
  font-size: 18px;
  color: var(--oit-grey-2);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .oit-bin-to-card-item > span {
    font-size: 14px;
  }
}
.oit-bin-to-card-item > span i {
  font-weight: 700;
  font-size: 16px;
  font-style: normal;
  letter-spacing: -0.02em;
  color: var(--oit-clr-black);
}
.oit-bin-to-card-item > span.style-2 {
  font-size: 16px;
}
.oit-bin-to-card-item > img {
  border-radius: 20px;
}
.oit-bin-to-card-item .ratting-text > span {
  font-size: 20px;
  line-height: 1.5;
}
.oit-bin-to-card-item .ratting-text > span:first-child {
  font-weight: 600;
  font-size: 30px;
  line-height: 1.3;
  color: var(--oit-clr-black);
  font-family: var(--oit-ff-funnel);
}
.oit-bin-to-card-item.item-style-2 {
  padding-bottom: 0;
}
.oit-bin-to-card-item.item-style-3 {
  padding: 30px 45px 35px 50px;
}
.oit-bin-to-card-item.item-overlay {
  height: 100%;
  object-fit: cover;
  justify-content: center;
  align-items: center;
  display: flex;
}
.oit-bin-to-card-item.item-overlay::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: -1;
  background: rgba(0, 0, 0, 0.7);
}
.oit-bin-to-card-title {
  font-weight: 600;
  font-size: 30px;
  line-height: 1.33;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .oit-bin-to-card-title {
    font-size: 25px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .oit-bin-to-card-title {
    font-size: 20px;
  }
}
.oit-bin-to-card-big-title {
  font-weight: 600;
  font-size: 45px;
  line-height: 1.2;
  color: var(--oit-clr-white);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .oit-bin-to-card-big-title {
    font-size: 35px;
  }
}
.oit-bin-to-card-list ul li {
  list-style-type: none;
}
.oit-bin-to-card-list ul li:not(:last-child) {
  margin-bottom: 15px;
}
.oit-bin-to-card-list ul li span {
  position: relative;
  padding-left: 30px;
  font-weight: 500;
  font-size: 20px;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.7);
}
.oit-bin-to-card-list ul li span svg {
  position: absolute;
  top: 2px;
  left: 0;
}
.oit-bin-to-card-shape-1 {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: -1;
}
.oit-bin-to-card-shape-2 {
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0.5;
  z-index: -1;
}
.oit-bin-to-card-shape-3 {
  position: absolute;
  right: 0;
  top: 0;
  z-index: -1;
}

/*----------------------------------------*/
/* team css start here
/*----------------------------------------*/
@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) {
  .dg-team-area {
    padding-top: 80px;
    padding-bottom: 60px;
  }
}
.dg-team-author-wrap {
  padding: 8px 20px;
  border-radius: 10px;
  background-color: var(--oit-clr-white);
}
.dg-team-author-info span {
  font-weight: 400;
  font-size: 14px;
  line-height: 1.7;
  color: rgba(13, 13, 13, 0.6);
}
.dg-team-title {
  font-weight: 600;
  font-size: 20px;
  margin-bottom: 5px;
}
.dg-team-social a {
  height: 38px;
  width: 38px;
  line-height: 34px;
  border-radius: 50%;
  display: inline-block;
  text-align: center;
  transition: 0.4s;
  color: var(--oit-clr-black);
  background-color: var(--oit-grey-1);
  outline: 1px solid rgba(13, 13, 13, 0.08);
}
.dg-team-social a:not(:last-child) {
  margin-right: 10px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .dg-team-social a:not(:last-child) {
    margin-right: 2px;
  }
}
.dg-team-social a:hover {
  color: var(--oit-clr-white);
  background-color: var(--oit-clr-black);
}
.dg-team-thumb {
  overflow: hidden;
}
.dg-team-thumb img {
  transition: 1.3s all ease;
}
.dg-team-shape {
  position: absolute;
  right: 7%;
  top: -16%;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .dg-team-shape {
    transform: scale(0.6);
  }
}
@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) {
  .dg-team-btn {
    padding-top: 0;
  }
}

/*----------------------------------------*/
/* step css start here
/*----------------------------------------*/
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .dg-step-area {
    padding-top: 60px;
    padding-bottom: 40px;
  }
}
.dg-step-area.about-style .dg-step-item {
  background-color: var(--oit-grey-1);
}
.dg-step-item {
  border-radius: 10px;
  padding: 25px 30px 30px;
  background-color: var(--oit-clr-white);
}
.dg-step-item span {
  font-weight: 500;
  font-size: 14px;
  display: block;
  margin-bottom: 125px;
  text-transform: uppercase;
}
.dg-step-item p {
  font-weight: 400;
  font-size: 18px;
  line-height: 1.7;
  letter-spacing: -0.8px;
  margin-bottom: 0;
}
@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) {
  .dg-step-item p {
    font-size: 16px;
  }
}
.dg-step-big-text {
  position: absolute;
  top: 1%;
  right: 6%;
  font-size: 150px;
  color: transparent;
  margin-bottom: 0;
  line-height: 1;
  letter-spacing: -0.01em;
  font-family: var(--oit-ff-funnel);
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: rgba(0, 0, 0, 0.4);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .dg-step-big-text {
    font-size: 80px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .dg-step-big-text {
    font-size: 60px;
  }
}
.dg-step-title {
  font-size: 30px;
  margin-bottom: 25px;
  letter-spacing: -0.01em;
}

/*----------------------------------------*/
/* testimonial css start here
/*----------------------------------------*/
@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) {
  .dg-testimonial-area {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
.dg-testimonial-item {
  padding: 40px;
  min-height: 550px;
  border-radius: 10px;
  background-color: var(--oit-clr-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) {
  .dg-testimonial-item {
    min-height: 500px;
  }
}
.dg-testimonial-item p.text-large {
  font-weight: 600;
  font-size: 30px;
  line-height: 1.3;
  margin-right: 45px;
  color: var(--oit-clr-black);
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .dg-testimonial-item p.text-large {
    font-size: 27px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .dg-testimonial-item p.text-large {
    font-size: 20px;
  }
}
@media (max-width: 767px) {
  .dg-testimonial-item p.text-large {
    font-size: 20px;
    margin-right: 0;
  }
}
.dg-testimonial-item p.text-large.large-style-2 {
  margin-right: 0;
  margin-top: 35px;
}
.dg-testimonial-item p.text-small {
  font-weight: 500;
  font-size: 18px;
  line-height: 1.65;
}
@media (max-width: 767px) {
  .dg-testimonial-item p.text-small {
    font-size: 15px;
  }
}
.dg-testimonial-item p.text-small span {
  color: var(--oit-text-body);
}
.dg-testimonial-authour-title {
  font-weight: 500;
  font-size: 18px;
  margin-bottom: 3px;
}
.dg-testimonial-authour-info {
  font-weight: 400;
  font-size: 14px;
}
.dg-testimonial-shape {
  position: absolute;
  top: 7%;
  right: 6.5%;
  z-index: -1;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .dg-testimonial-shape {
    right: -3%;
    transform: scale(0.5);
  }
}
@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) {
  .dg-testimonial-shape {
    right: -3%;
    transform: scale(0.5);
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .dg-testimonial-shape {
    top: 0;
    right: -3%;
    transform: scale(0.5);
  }
}
.dg-testimonial-active {
  margin-right: -555px;
}
@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) {
  .dg-testimonial-active {
    margin-right: 0;
  }
}

/*----------------------------------------*/
/* contact css start here
/*----------------------------------------*/
@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) {
  .dg-contact-area {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .dg-contact-area.faq-style .dg-contact-info-wrap {
    padding-bottom: 40px;
  }
}
.dg-contact-info span {
  font-weight: 600;
  font-size: 18px;
  display: block;
  margin-bottom: 7px;
  color: var(--oit-clr-white);
  text-transform: uppercase;
}
.dg-contact-info a {
  line-height: 1.63;
  color: rgba(255, 255, 255, 0.7);
}
.dg-contact-info-wrap {
  max-width: 590px;
}
@media (max-width: 767px) {
  .dg-contact-info-wrap {
    max-width: 100%;
    flex-wrap: wrap;
  }
}
.dg-contact-social a {
  font-weight: 500;
  font-size: 14px;
  text-transform: uppercase;
  color: var(--oit-clr-white);
  display: inline-block;
}
.dg-contact-social a:not(:last-child) {
  margin-right: 40px;
}
@media (max-width: 767px) {
  .dg-contact-social a:not(:last-child) {
    margin-right: 20px;
  }
}
.dg-contact-social a svg {
  height: 10px;
  width: 10px;
  margin-left: 3px;
  display: inline-block;
}
.dg-contact-form-box {
  padding: 50px;
  border-radius: 20px;
  backdrop-filter: blur(40px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}
@media (max-width: 767px) {
  .dg-contact-form-box {
    padding: 30px;
  }
}
.dg-contact-form-box label {
  font-weight: 500;
  font-size: 18px;
  line-height: 1.44;
  margin-bottom: 8px;
  text-transform: uppercase;
  color: var(--oit-clr-white);
}
.dg-contact-input-box input {
  border: none;
  padding: 0;
  height: 50px;
  line-height: 50px;
  font-size: 14px;
  color: var(--oit-clr-white);
  background-color: transparent;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.dg-contact-input-box input::placeholder {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.8);
}
.dg-contact-input-box input:focus {
  border-color: var(--oit-clr-white);
}
.dg-contact-textarea-box label {
  margin-bottom: 20px;
}
.dg-contact-textarea-box textarea {
  padding: 0;
  height: 130px;
  resize: none;
  border: none;
  background-color: transparent;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.dg-contact-textarea-box textarea::placeholder {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.8);
}
.dg-contact-textarea-box textarea:focus {
  border-color: var(--oit-clr-white);
}
.dg-contact-textarea-box textarea:focus::placeholder {
  opacity: 0;
}
.dg-contact-select {
  height: 50px;
  line-height: 50px;
}
.dg-contact-select .nice-select {
  border: none;
  padding: 0;
  width: 100%;
  font-size: 14px;
  width: 100%;
  height: 50px;
  line-height: 50px;
  border-radius: 0;
  background-color: transparent;
  color: rgba(255, 255, 255, 0.8);
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.dg-contact-select .nice-select span.current {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.8);
}
.dg-contact-shape-1 {
  position: absolute;
  bottom: 0;
  left: 16%;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .dg-contact-shape-1 {
    left: 0;
  }
}
.dg-contact-shape-1 img {
  opacity: 0.3;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .dg-contact-left {
    padding-top: 0;
  }
}

/*----------------------------------------*/
/*                                         \
|   1.6 DESIGN STUDIO CSS START HERE       \          
|                                          \
/*----------------------------------------*/
/*----------------------------------------*/
/* hero css start here
/*----------------------------------------*/
.st-hero-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.st-hero-bg img {
  width: 100%;
  height: 100%;
}
.st-hero-title {
  font-weight: 700;
  font-size: 250px;
  line-height: 1;
  text-transform: uppercase;
  padding-bottom: 250px;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .st-hero-title {
    font-size: 225px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .st-hero-title {
    font-size: 195px;
    padding-bottom: 90px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .st-hero-title {
    font-size: 170px;
    padding-bottom: 80px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .st-hero-title {
    font-size: 130px;
    padding-bottom: 60px;
  }
}
@media (max-width: 767px) {
  .st-hero-title {
    font-size: 90px;
    padding-bottom: 50px;
  }
}
.st-hero-title span {
  display: inline-block;
}
.st-hero-title span:first-child {
  background: url("../../assets/img/hero/hero-text-1.jpg");
  background-size: cover;
  color: var(--oit-clr-white);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
}
.st-hero-title span:last-child {
  background: url("../../assets/img/hero/hero-text-2.jpg");
  background-size: cover;
  color: var(--oit-clr-white);
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  transform: translateY(220px);
  margin-left: 30px;
}
@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) {
  .st-hero-title span:last-child {
    transform: translateY(0);
    margin-left: 0px;
  }
}
.st-hero-content p {
  font-weight: 600;
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 30px;
  padding-right: 60px;
  letter-spacing: -0.01em;
  color: var(--oit-clr-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) {
  .st-hero-content p {
    padding-right: 0;
    font-size: 16px;
  }
}
.st-hero-text-circle {
  position: absolute;
  cursor: pointer;
  bottom: 10%;
  right: 20%;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .st-hero-text-circle {
    bottom: 2%;
    right: 5%;
    transform: scale(0.7);
  }
}
@media (max-width: 767px) {
  .st-hero-text-circle {
    bottom: 1%;
    right: 1%;
    transform: scale(0.6);
  }
}
.st-hero-text-circle img {
  animation: shape-rotate 20s linear infinite;
}
.st-hero-text-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*----------------------------------------*/
/* text slider css start here
/*----------------------------------------*/
.st-text-slider-stye .oit-text-slider-item span {
  color: var(--oit-clr-white);
}

/*----------------------------------------*/
/* service css start here
/*----------------------------------------*/
@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) {
  .st-service-area {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
.st-service-style .oit-project-shape {
  right: 11%;
}
.st-service-style .oit-service-item {
  padding: 0;
  margin-left: 0;
  margin-right: 0;
  border-radius: 0;
  padding-bottom: 50px;
  background-color: var(--oit-clr-white);
  border-bottom: 1px solid rgba(0, 0, 0, 0.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) {
  .st-service-style .oit-service-item {
    flex-wrap: wrap;
    padding-bottom: 45px;
  }
}
.st-service-style .oit-service-thumb {
  margin-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) {
  .st-service-style .oit-service-thumb {
    width: 100%;
    height: 400px;
    overflow: hidden;
  }
  .st-service-style .oit-service-thumb img {
    width: 100%;
    object-fit: cover;
  }
}
.st-service-style .oit-service-content p {
  font-size: 30px;
  font-weight: 600;
  margin-bottom: 50px;
  padding-right: 100px;
  color: var(--oit-grey-2);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .st-service-style .oit-service-content p {
    font-size: 25px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .st-service-style .oit-service-content p {
    font-size: 20px;
  }
  .st-service-style .oit-service-content p br {
    display: none;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .st-service-style .oit-service-content p {
    font-size: 20px;
    padding-right: 0;
  }
  .st-service-style .oit-service-content p br {
    display: none;
  }
}
@media (max-width: 767px) {
  .st-service-style .oit-service-content p {
    font-size: 16px;
    padding-right: 0;
  }
  .st-service-style .oit-service-content p br {
    display: none;
  }
}
.st-service-style .oit-service-title {
  font-size: 144px;
  margin-bottom: 60px;
  display: flex;
  line-height: 1.1;
}
.st-service-style .oit-service-title span {
  font-weight: 400;
  font-size: 20px;
  margin-right: 30px;
  margin-top: 35px;
  display: inline-block;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .st-service-style .oit-service-title {
    font-size: 100px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .st-service-style .oit-service-title {
    font-size: 70px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .st-service-style .oit-service-title {
    font-size: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .st-service-style .oit-service-title {
    font-size: 50px;
  }
}
@media (max-width: 767px) {
  .st-service-style .oit-service-title {
    font-size: 40px;
  }
}
.st-service-cat span {
  font-weight: 500;
  font-size: 16px;
  letter-spacing: -0.02em;
  border-radius: 100px;
  padding: 5px 20px;
  margin-right: 20px;
  margin-bottom: 20px;
  display: inline-block;
  border: 1px solid rgba(93, 93, 93, 0.3);
}
@media (max-width: 767px) {
  .st-service-cat span {
    font-size: 14px;
  }
}

/*----------------------------------------*/
/* project css start here
/*----------------------------------------*/
@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) {
  .st-project-area {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
.st-project-content span {
  font-weight: 500;
  font-size: 20px;
  line-height: 1;
  color: var(--oit-clr-white);
}
@media (max-width: 767px) {
  .st-project-content span {
    font-size: 14px;
  }
}
.st-project-content-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 40px;
  pointer-events: none;
}
@media (max-width: 767px) {
  .st-project-content-wrap {
    padding: 20px;
  }
}
@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) {
  .st-project-subtitle-box {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .st-project-subtitle-box {
    margin-bottom: 15px;
  }
}
.st-project-title {
  font-weight: 500;
  font-size: 30px;
  line-height: 1.1;
  letter-spacing: -0.01em;
  color: var(--oit-clr-white);
}
@media (max-width: 767px) {
  .st-project-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), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .st-project-title-box {
    margin-bottom: 60px;
    padding-left: 0;
  }
}
.st-project-category a {
  font-weight: 400;
  font-size: 16px;
  border-radius: 20px;
  padding: 3px 22px;
  display: inline-block;
  letter-spacing: -0.02em;
  backdrop-filter: blur(40px);
  color: var(--oit-clr-white);
  background-color: rgba(0, 0, 0, 0.4);
}
.st-project-category a:hover {
  color: var(--oit-clr-black);
  background-color: var(--oit-clr-white);
}
.st-project-item {
  overflow: hidden;
  border-radius: 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), (max-width: 767px) {
  .st-project-btn {
    margin-top: 30px;
  }
}

/*----------------------------------------*/
/* team css start here
/*----------------------------------------*/
.st-team-style .dg-team-item {
  overflow: hidden;
  border-radius: 10px;
}
.st-team-style .dg-team-author-wrap {
  border-radius: 0;
  padding: 17px 25px;
  background-color: var(--oit-grey-1);
}

/*----------------------------------------*/
/* price css start here
/*----------------------------------------*/
@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) {
  .st-price-area {
    padding-top: 70px;
    padding-bottom: 40px;
  }
}
.st-price-item {
  padding: 10px;
  border-radius: 20px;
  background-color: var(--oit-grey-1);
  border: 1px solid rgba(0, 0, 0, 0.1);
}
.st-price-item.active .st-price-btn .oit-btn-border {
  color: var(--oit-clr-white);
  border: 1px solid var(--oit-clr-black);
  background-color: var(--oit-clr-black);
}
.st-price-head {
  padding: 30px;
  border-radius: 20px;
  background-color: var(--oit-clr-white);
}
.st-price-head p {
  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) {
  .st-price-head p br {
    display: none;
  }
}
.st-price-body {
  padding: 30px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .st-price-body {
    padding: 20px;
  }
}
.st-price-badge {
  font-weight: 500;
  font-size: 14px;
  line-height: 1;
  text-transform: uppercase;
}
.st-price-badge-wrap {
  line-height: 1;
  margin-bottom: 20px;
}
.st-price-value {
  font-weight: 500;
  font-size: 30px;
  line-height: 1;
  margin-bottom: 22px;
  letter-spacing: -0.01em;
  color: var(--oit-clr-black);
}
.st-price-value span {
  margin-left: 7px;
  font-size: 14px;
  font-weight: 400;
  display: inline-block;
}
.st-price-list {
  margin-bottom: 40px;
}
.st-price-list-label {
  font-weight: 500;
  font-size: 14px;
  line-height: 1;
  margin-bottom: 35px;
  display: inline-block;
  text-transform: uppercase;
}
.st-price-list ul li {
  list-style-type: none;
  font-weight: 500;
  font-size: 16px;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--oit-clr-black);
}
.st-price-list ul li::before {
  content: "";
  height: 8px;
  width: 8px;
  margin-right: 7px;
  border-radius: 50%;
  display: inline-block;
  background-color: #FF5E00;
  transform: translateY(-2px);
}
.st-price-list ul li:not(:last-child) {
  margin-bottom: 25px;
}
.st-price-btn .oit-btn-border {
  padding: 13px 22px;
  border-radius: 10px;
  color: var(--oit-clr-black);
  border: 1px solid var(--oit-clr-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) {
  .st-price-tab-btn {
    margin-top: 0px;
  }
}

/*----------------------------------------*/
/* testimonial css start here
/*----------------------------------------*/
.st-testimonial-style .dg-testimonial-item p.text-large {
  margin-right: 0;
}
.st-testimonial-style .dg-testimonial-item {
  border-radius: 0;
}
.st-testimonial-active {
  margin-right: -300px;
}
@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) {
  .st-testimonial-active {
    margin-right: 0;
  }
}
.st-testimonial-info {
  height: 100%;
  padding: 30px;
  border-radius: 20px 0 0 20px;
  background-color: var(--oit-clr-white);
}
.st-testimonial-info span {
  font-weight: 400;
  font-size: 30px;
  line-height: 1;
  display: block;
  margin-bottom: 20px;
  letter-spacing: -0.03em;
}
.st-testimonial-info p {
  font-weight: 500;
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: -0.05em;
}
.st-testimonial-info img {
  margin-bottom: 20px;
}
.st-testimonial-ratting {
  font-weight: 700;
  font-size: 144px;
  line-height: 1;
  margin-bottom: 18px;
  color: var(--oit-clr-black);
}
.st-testimonial-ratting-icon {
  margin-bottom: 35px;
}
.st-testimonial-ratting-icon i {
  color: #FF5E00;
  margin: 0 2px;
  display: inline-block;
}

/*----------------------------------------*/
/*                                         \
\   1.8 SOLO DESIGN AGENCY CSS START HERE  \          
|                                          \
/*----------------------------------------*/
/*----------------------------------------*/
/* hero css start here
/*----------------------------------------*/
.sd-hero-bg {
  overflow: hidden;
  padding-top: 300px;
  padding-bottom: 40px;
}
@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) {
  .sd-hero-bg {
    padding-top: 230px;
  }
}
@media (max-width: 767px) {
  .sd-hero-bg {
    padding-top: 180px;
  }
}
.sd-hero-bg::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3);
}
.sd-hero-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.sd-hero-video video {
  object-fit: cover;
  background-size: covar;
}
.sd-hero-title {
  font-size: 320px;
  line-height: 0.8;
  margin-bottom: 220px;
  color: var(--oit-clr-white);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sd-hero-title {
    font-size: 200px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sd-hero-title {
    font-size: 180px;
    margin-bottom: 100px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sd-hero-title {
    font-size: 150px;
    margin-bottom: 100px;
  }
}
@media (max-width: 767px) {
  .sd-hero-title {
    font-size: 70px;
    margin-bottom: 100px;
  }
}
.sd-hero-info span, .sd-hero-info a {
  font-weight: 500;
  font-size: 16px;
  line-height: 1.3;
  letter-spacing: -0.05em;
  color: var(--oit-clr-white);
}
.sd-hero-info img {
  flex: 0 0 auto;
  margin-right: 20px;
}

/*----------------------------------------*/
/* about css start here
/*----------------------------------------*/
.sd-about-mission-wrap {
  padding: 35px 30px;
  min-width: 900px;
  border-radius: 10px;
  display: inline-block;
  background: var(--oit-clr-white);
  box-shadow: 0 4px 50px 0 rgba(13, 13, 13, 0.05);
}
@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) {
  .sd-about-mission-wrap {
    min-width: auto;
  }
}
.sd-about-mission-wrap .nav-tab {
  padding-bottom: 20px;
}
.sd-about-mission-wrap .nav-tab li button {
  font-weight: 600;
  font-size: 18px;
  line-height: 1;
  letter-spacing: -0.04em;
  color: rgba(73, 73, 73, 0.8);
}
.sd-about-mission-wrap .nav-tab li button.active {
  color: var(--oit-clr-black);
}
.sd-about-mission-wrap .nav-tab li:not(:last-child) {
  margin-right: 50px;
}
@media (max-width: 767px) {
  .sd-about-mission-wrap .nav-tab li:not(:last-child) {
    margin-right: 20px;
  }
}
.sd-about-mission-wrap .tab-content p {
  margin-bottom: 0;
  font-weight: 500;
  font-size: 16px;
  line-height: 1.7;
  letter-spacing: -0.02em;
  color: rgba(73, 73, 73, 0.8);
}
@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) {
  .sd-about-mission-wrap .tab-content p br {
    display: none;
  }
}

/*----------------------------------------*/
/* service css start here
/*----------------------------------------*/
@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) {
  .sd-service-style.oit-service-area {
    padding-top: 70px;
    padding-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) {
  .sd-service-style .oit-section-title-box {
    margin-bottom: 40px;
  }
}
.sd-service-style .oit-service-thumb {
  margin-right: 0;
  border: none;
  margin-bottom: 0;
}
@media (max-width: 767px) {
  .sd-service-style .oit-service-thumb img {
    width: 100%;
  }
}
.sd-service-style .oit-service-content-wrap {
  padding-right: 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) {
  .sd-service-style .oit-service-content-wrap {
    padding-right: 20px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sd-service-style .oit-service-item {
    padding: 30px;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .sd-service-style .oit-service-item {
    flex-wrap: wrap;
    padding: 30px;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .sd-service-style .oit-service-content {
    margin-bottom: 30px;
  }
}
.sd-service-style .oit-service-content p {
  margin-bottom: 50px;
}
.sd-service-style .oit-service-category span {
  color: var(--oit-clr-black);
}

/*----------------------------------------*/
/* project css start here
/*----------------------------------------*/
@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) {
  .sd-project-area {
    padding-top: 70px;
  }
}

/*----------------------------------------*/
/* funfact css start here
/*----------------------------------------*/
.sd-funfact-title {
  font-weight: 400;
  font-size: 60px;
  line-height: 0.9;
  text-transform: uppercase;
  color: var(--oit-clr-black);
}
.sd-funfact-title i {
  font-style: normal;
}
.sd-funfact-card {
  position: relative;
  padding: 40px;
  z-index: 1;
  border-radius: 10px;
}
.sd-funfact-card.card-1 {
  min-height: 200px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .sd-funfact-card.card-1 {
    min-height: 300px;
  }
}
.sd-funfact-card.card-2 {
  min-height: 540px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .sd-funfact-card.card-2 {
    min-height: 450px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sd-funfact-card.card-2 {
    min-height: 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) {
  .sd-funfact-card.card-2 {
    min-height: 300px;
  }
}
.sd-funfact-card.card-3 {
  min-height: 260px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .sd-funfact-card.card-3 {
    min-height: 300px;
  }
}
.sd-funfact-card.card-4 {
  min-height: 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) {
  .sd-funfact-card.card-4 {
    min-height: 300px;
  }
}
.sd-funfact-card span {
  font-weight: 500;
  font-size: 18px;
  line-height: 1.4;
  text-align: end;
  text-transform: uppercase;
}
@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) {
  .sd-funfact-card span {
    font-size: 16px;
  }
}
.sd-funfact-card.sd-content-white span {
  color: var(--oit-clr-white);
}
.sd-funfact-card.sd-content-white .sd-funfact-title {
  color: var(--oit-clr-white);
}
.sd-funfact-shape-1 {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
}
.sd-funfact-shape-1 {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: -1;
}
.sd-funfact-shape-3 {
  position: absolute;
  top: 0%;
  right: 14%;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .sd-funfact-shape-3 {
    transform: scale(0.7);
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sd-funfact-shape-3 {
    top: -5%;
    transform: scale(0.5);
  }
}

/*----------------------------------------*/
/* choose css start here
/*----------------------------------------*/
.sd-choose-top-content p {
  font-weight: 500;
  font-size: 18px;
  line-height: 1.7;
  color: rgba(255, 255, 255, 0.7);
}
.sd-choose-card {
  border-radius: 10px;
  padding: 10px;
  background-color: var(--oit-clr-white);
}
.sd-choose-card-icon {
  margin-right: 10px;
  color: var(--oit-clr-black);
}
.sd-choose-card-title {
  font-weight: 500;
  font-size: 30px;
  line-height: 1.1;
  margin-bottom: 0;
  letter-spacing: -0.01em;
  color: var(--oit-clr-black);
}
.sd-choose-card-inner {
  border-radius: 10px;
  border: 1px solid var(--oit-clr-black);
}
.sd-choose-card-head {
  padding: 40px;
  border-bottom: 1px solid var(--oit-clr-black);
}
.sd-choose-card-body {
  padding: 50px 40px 35px 40px;
}
.sd-choose-card-body p {
  font-weight: 500;
  font-size: 18px;
  line-height: 1.6;
  margin-bottom: 0;
  letter-spacing: -0.04em;
}

/*----------------------------------------*/
/* team css start here
/*----------------------------------------*/
@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) {
  .sd-team-area .oit-section-title-box {
    margin-bottom: 40px;
  }
}
.sd-team-area .shape-1 {
  position: absolute;
  top: 6%;
  right: 13%;
}
.sd-team-row-wrap {
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.sd-team-row-item {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.sd-team-row-item .row [class*=col]:not(:last-child) .sd-team-item {
  border-right: 1px solid rgba(0, 0, 0, 0.1);
}
.sd-team-thumb {
  overflow: hidden;
  flex: 0 0 auto;
  margin-right: 25px;
}
.sd-team-thumb img {
  border-radius: 10px;
}
.sd-team-content span {
  font-weight: 400;
  font-size: 18px;
  line-height: 1;
}
.sd-team-title {
  font-weight: 500;
  font-size: 30px;
  line-height: 1.1;
  color: var(--oit-clr-black);
}
.sd-team-item {
  height: 100%;
  padding: 30px 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) {
  .sd-team-item {
    padding: 15px 0;
  }
}
.sd-team-social a {
  height: 50px;
  width: 50px;
  line-height: 46px;
  display: inline-block;
  text-align: center;
  border-radius: 50%;
  color: var(--oit-clr-black);
  background-color: rgba(13, 13, 13, 0.08);
}
.sd-team-social a:hover {
  color: var(--oit-clr-white);
  background-color: var(--oit-clr-black);
}

/*----------------------------------------*/
/*                                         \
\   1.4 BRAND AGENCY CSS START HERE        \          
|                                          \
/*----------------------------------------*/
/*----------------------------------------*/
/* hero css start here
/*----------------------------------------*/
.oit-hero-5-bg {
  padding-top: 260px;
  padding-bottom: 110px;
  background-repeat: no-repeat;
  background-size: cover;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .oit-hero-5-bg {
    padding-top: 200px;
    padding-bottom: 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-hero-5-bg {
    padding-top: 160px;
    padding-bottom: 50px;
  }
}
@media (max-width: 767px) {
  .oit-hero-5-bg {
    padding-top: 120px;
    padding-bottom: 30px;
  }
}
.oit-hero-5-title {
  font-size: 195px;
  line-height: 1;
  letter-spacing: -3px;
  color: var(--oit-clr-white);
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .oit-hero-5-title {
    font-size: 175px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .oit-hero-5-title {
    font-size: 155px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .oit-hero-5-title {
    font-size: 135px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .oit-hero-5-title {
    font-size: 110px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-hero-5-title {
    font-size: 100px;
  }
}
@media (max-width: 767px) {
  .oit-hero-5-title {
    font-size: 70px;
  }
}
.oit-hero-5-title.stroke-text {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 2;
  text-align: center;
  color: transparent;
  -webkit-text-stroke: 1px var(--oit-clr-white);
}
.oit-hero-5-glob {
  margin-top: -240px;
  display: inline-block;
  height: 720px;
  width: 720px;
  border-radius: 50%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .oit-hero-5-glob {
    height: 500px;
    width: 500px;
    margin-top: -150px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-hero-5-glob {
    height: 400px;
    width: 400px;
    margin-top: -100px;
  }
}
@media (max-width: 767px) {
  .oit-hero-5-glob {
    height: 360px;
    width: 360px;
    margin-top: -100px;
  }
}
.oit-hero-5-glob::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgb(0, 0, 0) 0%, rgba(0, 0, 0, 0.9) 35%, rgba(0, 0, 0, 0) 75%);
}
.oit-hero-5-glob img {
  animation: shape-rotate 60s linear infinite;
}
.oit-hero-5-bottom {
  margin-top: -300px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .oit-hero-5-bottom {
    margin-top: -100px;
  }
}
@media (max-width: 767px) {
  .oit-hero-5-bottom {
    margin-top: 0px;
  }
}

/*----------------------------------------*/
/* about css start here
/*----------------------------------------*/
.oit-about-text.fs-120 p {
  font-weight: 500;
  font-size: 120px;
  line-height: 1;
  color: var(--oit-clr-black);
}

/*----------------------------------------*/
/* about vision css start here
/*----------------------------------------*/
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .ba-about-area {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .ba-about-area {
    padding-top: 70px;
    padding-bottom: 40px;
  }
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .ba-about-area .oit-section-title {
    font-size: 110px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .ba-about-area .oit-section-title {
    font-size: 70px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .ba-about-area .oit-section-title {
    font-size: 55px;
  }
}
@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) {
  .ba-about-area .dg-about-content-wrap {
    padding-left: 0;
  }
}
.ba-about-vision-wrap .row [class*=col-]:not(:last-child) .ba-about-vision-item {
  border-right: 1px solid #d9d9d9;
}
.ba-about-vision-title {
  font-weight: 600;
  font-size: 30px;
  line-height: 1;
  margin-bottom: 30px;
  color: var(--oit-clr-black);
}
.ba-about-vision-inner {
  padding-left: 70px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .ba-about-vision-inner {
    padding-left: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .ba-about-vision-inner {
    padding-left: 0;
  }
}
.ba-about-vision-item {
  height: 100%;
}
.ba-about-vision-item p {
  font-weight: 500;
  font-size: 18px;
  line-height: 1.4;
  padding-right: 85px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .ba-about-vision-item p {
    font-size: 16px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .ba-about-vision-item p {
    font-size: 16px;
    padding-right: 10px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .ba-about-vision-item p {
    font-size: 16px;
    padding-right: 70px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .ba-about-vision-item p {
    padding-right: 0;
  }
}
.ba-about-vision-item p span {
  color: var(--oit-clr-black);
}
.ba-about-vision-item ul li {
  list-style-type: none;
  margin-bottom: 15px;
}
.ba-about-vision-item ul li span {
  font-weight: 500;
  font-size: 16px;
  line-height: 1.1;
  color: #494949;
  letter-spacing: -0.02em;
}
.ba-about-vision-item ul li span::before {
  content: "";
  height: 7px;
  width: 7px;
  margin-right: 7px;
  border-radius: 50%;
  display: inline-block;
  transform: translateY(-2px);
  background-color: var(--oit-clr-black);
}

/*----------------------------------------*/
/* funfact css start here
/*----------------------------------------*/
.ba-funfact-style .sd-funfact-card {
  padding: 30px;
  min-height: 300px;
}
.ba-funfact-style .sd-funfact-shape-3 {
  top: -25%;
  right: 16%;
}
.ba-funfact-style .sd-funfact-title {
  margin-bottom: 0;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), (max-width: 767px) {
  .ba-funfact-style .sd-funfact-title {
    font-size: 35px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .ba-funfact-style .sd-funfact-title {
    font-size: 55px;
  }
}
.ba-funfact-style .sd-funfact-card.sd-content-white p {
  color: var(--oit-clr-white);
}
.ba-funfact-content p {
  font-weight: 400;
  font-size: 14px;
  line-height: 1.5;
  text-align: right;
  color: #5d5d5d;
  margin-bottom: 0;
  flex: 0 0 auto;
}

/*----------------------------------------*/
/* service css start here
/*----------------------------------------*/
.ba-service-style .oit-service-content-wrap {
  padding: 20px 30px;
  padding-right: 45px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .ba-service-style .oit-service-content-wrap {
    padding: 5px 8px;
    padding-right: 20px;
  }
}
@media (max-width: 767px) {
  .ba-service-style .oit-service-content-wrap {
    padding: 0;
  }
}
.ba-service-style .oit-service-item {
  margin: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .ba-service-style .oit-project-shape {
    top: 34px;
  }
}
.ba-service-tab-btn {
  margin-right: 50px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
@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) {
  .ba-service-tab-btn {
    margin-right: 0;
  }
}
.ba-service-tab-btn ul {
  flex-direction: column;
}
.ba-service-tab-btn ul li button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-weight: 600;
  font-size: 45px;
  width: 100%;
  line-height: 1;
  padding: 35px 10px;
  color: rgba(255, 255, 255, 0.5);
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .ba-service-tab-btn ul li button {
    font-size: 30px;
  }
}
@media (max-width: 767px) {
  .ba-service-tab-btn ul li button {
    font-size: 30px;
  }
}
.ba-service-tab-btn ul li button.active {
  color: var(--oit-clr-white);
}

/*----------------------------------------*/
/* career css start here
/*----------------------------------------*/
.career-details-meta span {
  font-weight: 500;
  font-size: 30px;
  line-height: 1;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .career-details-meta span {
    font-size: 25px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .career-details-meta span {
    font-size: 18px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .career-details-meta span {
    font-size: 16px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .career-details-meta span {
    font-size: 15px;
  }
}
.career-details-meta strong {
  font-weight: 500;
  font-size: 30px;
  margin-left: 20px;
  line-height: 1.5;
  color: var(--oit-clr-black);
}
@media only screen and (min-width: 1600px) and (max-width: 1700px) {
  .career-details-meta strong {
    font-size: 25px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .career-details-meta strong {
    font-size: 18px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .career-details-meta strong {
    font-size: 16px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .career-details-meta strong {
    font-size: 15px;
  }
}
.career-details-meta:not(:last-child) {
  padding-right: 40px;
  margin-right: 40px;
  line-height: 1;
  border-right: 1px solid rgba(73, 73, 73, 0.5);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .career-details-meta:not(:last-child) {
    margin-bottom: 15px;
  }
}
@media (max-width: 767px) {
  .career-details-meta:not(:last-child) {
    margin-bottom: 15px;
    border: 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) {
  .career-details-meta-box {
    flex-wrap: wrap;
    align-items: start !important;
    justify-content: start !important;
    margin-bottom: 50px;
  }
}
.career-details-list li {
  list-style-type: none;
  padding-left: 30px;
  position: relative;
}
.career-details-list li:not(:last-child) {
  margin-bottom: 25px;
}
.career-details-list li span {
  font-weight: 600;
  font-size: 20px;
  line-height: 1.5;
  color: var(--oit-clr-black);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .career-details-list li span {
    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) {
  .career-details-list li span {
    font-size: 16px;
  }
}
.career-details-list li span svg, .career-details-list li span i {
  position: absolute;
  top: 0;
  left: 0;
}
.career-details-deadline span {
  font-weight: 600;
  font-size: 30px;
  line-height: 1.33;
}
@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) {
  .career-details-deadline span {
    font-size: 18px;
  }
}
.career-details-deadline strong {
  font-weight: 600;
  font-size: 30px;
  line-height: 1.33;
  margin-right: 15px;
  display: inline-block;
  color: var(--oit-clr-black);
}
@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) {
  .career-details-deadline strong {
    font-size: 18px;
  }
}
.career-details-area .postbox-dsc p {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 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) {
  .career-details-area .postbox-dsc p {
    font-size: 16px;
  }
}

.career-item {
  padding: 20px 30px 30px 30px;
  border-radius: 10px;
  background-color: var(--oit-clr-white);
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), 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) {
  .career-item {
    padding: 25px 20px;
  }
}
@media (max-width: 767px) {
  .career-item {
    padding: 25px 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .career-item {
    padding: 40px;
  }
}
.career-item p {
  font-weight: 400;
  font-size: 14px;
  line-height: 1.71;
  margin-bottom: 35px;
  margin-right: 40px;
  letter-spacing: -0.06em;
}
.career-item .title {
  font-weight: 500;
  font-size: 30px;
  line-height: 1.47;
  margin-bottom: 10px;
  letter-spacing: -0.01em;
}
@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) {
  .career-item .title {
    font-size: 25px;
  }
}
.career-price {
  font-size: 14px;
  border-radius: 5px;
  padding: 11px 20px;
  display: inline-block;
  line-height: 1;
  color: var(--it-common-white);
  background-color: var(--it-text-body);
  border: 1px solid rgba(26, 182, 157, 0.3);
}
@media (max-width: 767px) {
  .career-price {
    margin-bottom: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .career-price {
    margin-bottom: 0;
  }
}
.career-meta {
  margin-bottom: 25px;
}
.career-meta span {
  font-weight: 500;
  font-size: 14px;
  line-height: 1;
  display: inline-block;
  text-transform: uppercase;
}
@media only screen and (min-width: 1600px) and (max-width: 1700px), 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) {
  .career-meta span {
    font-size: 12px;
  }
}
.career-meta span svg {
  display: inline-block;
  margin-right: 5px;
}
.career-meta span:not(:last-child) {
  padding-right: 20px;
  margin-right: 20px;
  border-right: 1px solid #D9D9D9;
}
.career-area .shape-1 {
  position: absolute;
  top: 5%;
  right: 20%;
}

.dg-step-area.career-style .shape {
  position: absolute;
  top: -10%;
  right: -8%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .dg-step-area.career-style .shape {
    display: none;
  }
}
.dg-step-area.career-style .dg-step-item {
  padding: 35px 40px 38px 40px;
}
.dg-step-area.career-style .dg-step-item > span {
  margin-bottom: 25px;
}
.dg-step-area.career-style .dg-step-item p {
  font-weight: 400;
  font-size: 14px;
  line-height: 1.71;
  letter-spacing: -0.06em;
}
.dg-step-area.career-style .dg-step-item .dg-step-title {
  font-weight: 500;
  line-height: 1.47;
  margin-bottom: 23px;
  letter-spacing: -0.01em;
}

.dg-contact-area.faq-style .dg-contact-info span {
  color: var(--oit-clr-black);
}
.dg-contact-area.faq-style .dg-contact-info a {
  color: rgba(13, 13, 13, 0.7);
}
@media (max-width: 767px) {
  .dg-contact-area.faq-style .dg-contact-info a br {
    display: none;
  }
}
.dg-contact-area.faq-style .dg-contact-social a {
  color: var(--oit-clr-black);
}
.dg-contact-area.faq-style .dg-contact-form-box {
  border: none;
  box-shadow: none;
  backdrop-filter: blur(10px);
  background: rgba(237, 237, 237, 0.7);
}
.dg-contact-area.faq-style .dg-contact-form-box label {
  color: var(--oit-clr-black);
}
.dg-contact-area.faq-style .dg-contact-input-box input {
  color: var(--oit-clr-black);
  background-color: transparent;
  border-bottom: 1px solid rgba(13, 13, 13, 0.2);
}
.dg-contact-area.faq-style .dg-contact-input-box input::placeholder {
  color: rgba(13, 13, 13, 0.8);
}
.dg-contact-area.faq-style .dg-contact-input-box input:focus {
  border-color: var(--oit-clr-black);
}
.dg-contact-area.faq-style .dg-contact-textarea-box textarea {
  background-color: transparent;
  border-bottom: 1px solid rgba(13, 13, 13, 0.2);
}
.dg-contact-area.faq-style .dg-contact-textarea-box textarea::placeholder {
  color: rgba(13, 13, 13, 0.8);
}
.dg-contact-area.faq-style .dg-contact-textarea-box textarea:focus {
  border-color: var(--oit-clr-black);
}
.dg-contact-area.faq-style .dg-contact-select .nice-select {
  background-color: transparent;
  color: rgba(255, 255, 255, 0.8);
  border-bottom: 1px solid rgba(13, 13, 13, 0.2);
}
.dg-contact-area.faq-style .dg-contact-select .nice-select span.current {
  color: rgba(13, 13, 13, 0.8);
}
.dg-contact-area.faq-style .dg-contact-select .nice-select::after {
  border-bottom: 2px solid var(--oit-clr-black);
  border-right: 2px solid var(--oit-clr-black);
}
.dg-contact-area.faq-style .dg-contact-shape-1 {
  position: absolute;
  bottom: auto;
  top: -9%;
  left: auto;
  right: -7%;
  opacity: 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) {
  .dg-contact-area.faq-style .dg-contact-shape-1 {
    display: none;
  }
}
.dg-contact-area.faq-style .dg-contact-shape-1 img {
  opacity: 1;
}

/*----------------------------------------*/
/*  7.7 error agency css here
/*----------------------------------------*/
.error-ptb {
  padding-top: 170px;
  padding-bottom: 120px;
}
.error-title {
  font-weight: 700;
  font-size: 60px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .error-title {
    font-size: 50px;
  }
}
@media (max-width: 767px) {
  .error-title {
    font-size: 35px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .error-title {
    font-size: 55px;
  }
}

/*----------------------------------------*/
/*  5.4 project details css
/*----------------------------------------*/
@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) {
  .project-details-area {
    padding: 70px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .project-details-area .project-details-thumb-box.mb-110 {
    margin-bottom: 50px !important;
  }
}
.project-details-area .postbox-dsc p {
  font-size: 30px;
  line-height: 1.33;
  letter-spacing: 0;
  margin-right: 70px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .project-details-area .postbox-dsc p {
    margin-right: 0;
    font-size: 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) {
  .project-details-area .postbox-dsc p {
    margin-right: 0;
    font-size: 20px;
  }
}
@media (max-width: 767px) {
  .project-details-area .postbox-dsc p {
    margin-right: 0;
    font-size: 16px;
  }
}
.project-details-area .career-details-list li {
  padding-left: 35px;
}
.project-details-area .career-details-list li:not(:last-child) {
  margin-bottom: 17px;
}
.project-details-area .career-details-list li span {
  font-weight: 600;
  font-size: 30px;
  display: inline-block;
  margin-bottom: 5px;
}
@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) {
  .project-details-area .career-details-list li span {
    font-size: 16px;
  }
}
.project-details-area .career-details-list li span svg, .project-details-area .career-details-list li span i {
  top: 8px;
}
.project-details-area .career-details-list li p {
  font-weight: 500;
  font-size: 20px;
  line-height: 1.5;
  margin-bottom: 0;
}
@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) {
  .project-details-area .career-details-list li p {
    font-size: 15px;
  }
}
.project-details-area.style-2 .career-details-list li span {
  font-weight: 500;
  font-size: 20px;
  margin-bottom: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .project-details-area.style-2 .career-details-list li span {
    font-size: 15px;
  }
}
.project-details-area.style-2 .career-details-list li span svg, .project-details-area.style-2 .career-details-list li span i {
  top: 0;
}
.project-details-area.style-2 .sd-funfact-card {
  padding: 30px 40px;
  display: flex;
  flex-direction: column;
  align-items: start;
  justify-content: space-between;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .project-details-area.style-2 .sd-funfact-card.card-1 {
    min-height: 200px;
  }
}
.project-details-area.style-2 .sd-funfact-card span {
  text-align: start;
}
.project-details-thumb img {
  border-radius: 10px;
}
.project-details-subtitle {
  display: block;
  margin-bottom: 55px;
}
.project-details-author-list ul li {
  display: flex;
  padding: 26px 0;
  align-items: center;
  list-style-type: none;
  justify-content: space-between;
  border-bottom: 1px solid var(--oit-grey-2);
}
.project-details-author-list ul li:first-child {
  border-top: 1px solid var(--oit-grey-2);
}
.project-details-author-list ul li span {
  font-weight: 500;
  font-size: 30px;
  color: var(--oit-clr-black);
}
@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) {
  .project-details-author-list ul li span {
    font-size: 20px;
  }
}
@media (max-width: 767px) {
  .project-details-author-list ul li span {
    font-size: 15px;
  }
}

.project-slide-active {
  margin: 0 -480px;
}
@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) {
  .project-slide-active {
    margin: 0;
  }
}
.project-slide-style .oit-project-title {
  font-weight: 600;
  font-size: 30px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .project-slide-style .oit-project-title {
    font-size: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .project-slide-style .oit-project-category span {
    font-size: 14px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .project-slide-style .oit-project-category span:first-child::after {
    top: 7px;
    height: 5px;
    width: 5px;
  }
}
.project-slide-style .oit-project-content {
  background-color: var(--oit-clr-white);
}
.project-slide-style .oit-project-item {
  background-color: var(--oit-clr-white);
}

@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .oit-project-area.p-relative.mt-50.pt-150.pb-150 {
    padding: 70px 0 !important;
  }
}

/*----------------------------------------*/
/*  5.4 service details css
/*----------------------------------------*/
.service-details-area .career-details-list li span {
  font-weight: 500;
  color: var(--oit-text-body);
}
.service-details-area .dg-step-item p {
  font-size: 14px;
  line-height: 1.7;
  letter-spacing: -0.06em;
}
.service-details-area .dg-step-title {
  margin-bottom: 15px;
}

.oit-service-1 .oit-service-item {
  margin: 0;
  margin-bottom: 50px;
}

/*----------------------------------------*/
/*  5.4 contact details css
/*----------------------------------------*/
.contact-details-big-title {
  font-weight: 500;
  font-size: 120px;
  line-height: 1.08;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .contact-details-big-title {
    font-size: 90px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .contact-details-big-title {
    font-size: 80px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-details-big-title {
    font-size: 60px;
  }
  .contact-details-big-title br {
    display: none;
  }
}
@media (max-width: 767px) {
  .contact-details-big-title {
    font-size: 28px;
    margin-bottom: 40px !important;
  }
  .contact-details-big-title br {
    display: none;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .contact-details-big-title {
    font-size: 45px;
    margin-bottom: 60px !important;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .contact-details-thumb {
    padding-bottom: 60px !important;
  }
}
.contact-details-thumb img {
  border-radius: 20px;
}
.contact-details-time span {
  display: block;
  margin-bottom: 30px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .contact-details-time span svg {
    height: 50px;
    width: 50px;
  }
}
.contact-details-time strong {
  font-weight: 600;
  font-size: 45px;
  color: var(--oit-clr-black);
  font-family: var(--oit-ff-heading);
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .contact-details-time strong {
    font-size: 18px;
  }
}
.contact-details-info-wrap {
  padding-top: 60px;
  padding-bottom: 60px;
  border-top: 1px solid #D9D9D9;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .contact-details-info-wrap {
    fpb: 30px;
  }
}
.contact-details-info-wrap .oit-btn-border {
  padding: 15px 24px;
}
@media (max-width: 767px) {
  .contact-details-info-wrap .contact-btn {
    margin-top: 30px;
  }
}
@media (max-width: 767px) {
  .contact-details-info-wrap .oit-btn-border {
    padding: 4px 24px;
    font-size: 12px;
  }
}
.contact-details-info-top span {
  font-weight: 600;
  font-size: 30px;
  display: block;
  margin-bottom: 20px;
  color: var(--oit-clr-black);
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .contact-details-info-top span {
    font-size: 18px;
  }
}
.contact-details-info-top a {
  font-weight: 600;
  font-size: 20px;
  line-height: 1.5;
  display: block;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .contact-details-info-top a {
    font-size: 15px;
  }
}
.contact-details-info-top-box {
  padding-bottom: 35px;
  margin-bottom: 30px;
  border-bottom: 1px solid #D9D9D9;
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .contact-details-info-top-box {
    flex-wrap: wrap;
  }
}
.contact-details-info-bottom span {
  font-weight: 500;
  font-size: 16px;
  margin-bottom: 20px;
  letter-spacing: -0.02em;
  display: block;
}
.contact-details-info-bottom a {
  font-weight: 400;
  font-size: 30px;
  display: block;
  margin-bottom: 30px;
  letter-spacing: -0.01em;
  color: var(--oit-clr-black);
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .contact-details-info-bottom a {
    font-size: 18px;
    margin-bottom: 15px;
  }
}
.contact-style .oit-price-item {
  border: none;
  width: 555px;
  min-height: auto;
  background-color: var(--oit-clr-white);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .contact-style .oit-price-item {
    width: auto;
  }
}
@media (max-width: 767px) {
  .contact-style .oit-price-item {
    width: auto;
  }
}
.contact-style .oit-price-title {
  color: var(--oit-clr-black);
}
.contact-style .oit-price-avater-box img {
  height: 50px;
}
.contact-style .shape-1 {
  position: absolute;
  top: 0;
  left: 0;
}
.contact-style .shape-2 {
  position: absolute;
  bottom: 0;
  right: 0;
}
.contact-style .dg-contact-info a {
  font-weight: 400;
  font-size: 30px;
  display: block;
  color: var(--oit-clr-white);
}
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .contact-style .dg-contact-info a {
    font-size: 18px;
  }
}

.map-area {
  line-height: 0;
}
.map-area iframe {
  width: 100%;
  height: 665px;
  border: 0;
  line-height: 0;
  filter: grayscale(100%) brightness(65%) contrast(120%);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .map-area iframe {
    height: 400px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .map-area iframe {
    height: 350px;
  }
}
@media (max-width: 767px) {
  .map-area iframe {
    height: 350px;
  }
}

/*----------------------------------------*/
/* brand details css
/*----------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {
  .brand-area {
    padding-bottom: 0;
  }
}
.brand-area.brand-style-2 .brand-item {
  background-color: #101216;
  border: 1px solid rgba(255, 255, 255, 0.05);
}
.brand-item {
  height: 125px;
  line-height: 125px;
  padding: 10px 49px;
  border-radius: 10px;
  margin-bottom: 35px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: var(--oit-grey-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) {
  .brand-item {
    height: 90px;
    padding: 10px 15px;
  }
}
.brand-item img {
  height: 40px;
}
@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) {
  .brand-item img {
    width: 120px;
    height: 30px;
  }
}

/*----------------------------------------*/
/*  5.4 team-details details css
/*----------------------------------------*/
.team-details-area .row ~ .col {
  height: 100%;
}

.profile-card {
  border-radius: 30px;
}
.profile-thumb {
  margin-right: 35px;
  height: 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) {
  .profile-thumb {
    margin-right: 0;
  }
}
.profile-thumb img {
  height: 100%;
  object-fit: cover;
  border-radius: 30px;
}
.profile-content {
  padding: 30px 70px 30px 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) {
  .profile-content {
    padding: 30px;
  }
}
.profile-content .title {
  font-weight: 600;
  font-size: 45px;
  margin-bottom: 15px;
}
@media (max-width: 767px) {
  .profile-content .title {
    font-size: 30px;
  }
}
.profile-content > span {
  font-weight: 600;
  font-size: 20px;
  display: block;
  margin-bottom: 45px;
  color: rgba(13, 13, 13, 0.6);
}
.profile-content > p {
  font-weight: 500;
  font-size: 18px;
  line-height: 1.67;
}
@media (max-width: 767px) {
  .profile-content > p {
    font-size: 16px;
  }
}
.profile-content .contact-info {
  position: relative;
  padding-left: 40px;
  padding-bottom: 15px;
  margin-bottom: 55px;
  border-bottom: 1px solid #D9D9D9;
}
.profile-content .contact-info > a {
  font-weight: 600;
  font-size: 20px;
  color: var(--oit-clr-black);
}
.profile-content .contact-info span {
  display: block;
  font-size: 14px;
  margin-top: 3px;
}
.profile-content .contact-info svg {
  position: absolute;
  top: 10px;
  left: 0;
}
.profile-content .contact-social {
  padding-bottom: 32px;
  margin-bottom: 55px;
  border-bottom: 1px solid #D9D9D9;
}
.profile-content .contact-social a {
  height: 40px;
  width: 40px;
  line-height: 36px;
  display: inline-block;
  border-radius: 50%;
  text-align: center;
  transition: 0.3s;
  color: var(--oit-grey-2);
  background: rgba(13, 13, 13, 0.08);
}
.profile-content .contact-social a:not(:last-child) {
  margin-right: 10px;
}
.profile-content .contact-social a:hover {
  color: var(--oit-clr-white);
  background-color: var(--oit-clr-black);
}

/*----------------------------------------*/
/*  5.4 testimonial details css
/*----------------------------------------*/
.dg-testimonial-area.service-style .dg-testimonial-item {
  min-height: auto;
  transition: 0.3s;
}
.dg-testimonial-area.service-style .dg-testimonial-item:hover {
  background-color: #EEEEEE;
}
.dg-testimonial-area.service-style .text-large {
  margin-top: 110px;
}
@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) {
  .dg-testimonial-area.service-style .text-large {
    margin-top: 20px;
  }
}

/*----------------------------------------*/
/*  5.4 reak-dark css start here
/*----------------------------------------*/
.reak-dark .oit-about-content p {
  color: #999999;
}
.reak-dark .oit-award-area p {
  color: #999999;
}
.reak-dark .oit-project-content {
  background-color: #101216;
}
.reak-dark .oit-team-item {
  background-color: #101216;
}
.reak-dark .oit-btn-line {
  color: var(--oit-clr-white);
}
.reak-dark .oit-project-category span:first-child::after {
  background-color: #999999;
}
.reak-dark .oit-about-text p {
  color: var(--oit-clr-white);
}
.reak-dark .oit-about-text span {
  color: var(--oit-clr-white);
}
.reak-dark .oit-team-title {
  color: var(--oit-clr-white);
}
.reak-dark .oit-team-content span {
  color: var(--oit-clr-white);
}
.reak-dark .oit-team-social span {
  color: var(--oit-clr-white);
}
.reak-dark .oit-faq-accordion-wrap .accordion-body p {
  color: #999999;
}
.reak-dark .oit-section-subtitle {
  color: #999999;
}
.reak-dark .oit-section-title {
  color: var(--oit-clr-white);
}
.reak-dark .oit-funfact-title {
  color: var(--oit-clr-white);
}
.reak-dark .oit-funfact-item span {
  color: #999999;
}
.reak-dark .oit-funfact-area .row > [class^=col]:not(:last-child) .oit-funfact-item {
  border-inline-end: 1px solid #303030;
}
.reak-dark .oit-funfact-bdr {
  border-top: 1px solid #303030;
  border-bottom: 1px solid #303030;
}
.reak-dark .oit-award-content p, .reak-dark .oit-award-content span {
  color: var(--oit-clr-white);
}
.reak-dark .oit-award-icon img {
  opacity: 0.7;
}
.reak-dark .oit-blog-content span {
  color: #999999;
}
.reak-dark .oit-blog-title {
  color: var(--oit-clr-white);
}
.reak-dark .dg-step-item {
  background-color: #101216 !important;
}
.reak-dark .dg-step-item span {
  color: #999999;
}
.reak-dark .dg-step-item p {
  color: #999999;
}
.reak-dark .dg-step-title {
  color: var(--oit-clr-white);
}
.reak-dark .dg-step-big-text {
  -webkit-text-stroke-color: rgba(255, 255, 255, 0.05);
}
.reak-dark .oit-project-title {
  color: var(--oit-clr-white);
}
.reak-dark .oit-project-category span {
  color: #999999;
}
.reak-dark .dg-team-title {
  color: var(--oit-clr-white);
}
.reak-dark .dg-team-author-info span {
  color: rgba(255, 255, 255, 0.6);
}
.reak-dark .dg-team-author-wrap {
  background-color: #101216;
}
.reak-dark .oit-text-slider-item span {
  color: var(--oit-clr-white);
}
.reak-dark .oit-bin-to-card-area .shape-1 {
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
}
.reak-dark .oit-bin-to-card-item .ratting-text > span:first-child {
  color: var(--oit-clr-white);
}
.reak-dark .dg-funfact-title {
  color: var(--oit-clr-white);
}
.reak-dark .dg-funfact-item p {
  color: #999999;
}
.reak-dark .oit-section-title-box p {
  color: #999999;
}
.reak-dark .dg-testimonial-item {
  background-color: #101216;
}
.reak-dark .dg-testimonial-item p.text-large {
  color: var(--oit-clr-white);
}
.reak-dark .dg-testimonial-item p.text-small {
  color: #999999;
}
.reak-dark .dg-testimonial-item p span {
  color: var(--oit-clr-white);
}
.reak-dark .dg-testimonial-item .quote svg {
  color: var(--oit-clr-white);
}
.reak-dark .dg-testimonial-authour-title {
  color: var(--oit-clr-white);
}
.reak-dark .dg-testimonial-authour-info span {
  color: #999999;
}
.reak-dark .oit-faq-accordion-wrap .accordion-item {
  background-color: var(--oit-clr-black);
}
.reak-dark .accordion-header {
  color: var(--oit-clr-white);
}
.reak-dark .oit-footer-widget {
  background-color: #0D0D0D;
}
.reak-dark .sd-about-mission-wrap {
  background: #101216;
}
.reak-dark .sd-about-mission-wrap .nav-tab li button.active {
  color: var(--oit-clr-white);
}
.reak-dark .sd-about-mission-wrap .nav-tab li button {
  color: rgba(255, 255, 255, 0.5);
}
.reak-dark .sd-about-mission-wrap .tab-content p {
  color: rgba(255, 255, 255, 0.5);
}
.reak-dark .st-service-style .oit-service-item {
  background-color: #0D0D0D;
}
.reak-dark .st-service-style .oit-service-title {
  color: var(--oit-clr-white);
}
.reak-dark .dg-service-style .oit-service-title {
  color: var(--oit-clr-white);
}
.reak-dark .st-service-style .oit-service-content p {
  color: #999999;
}
.reak-dark .st-service-cat span {
  border: 1px solid rgba(255, 255, 255, 0.3);
}
.reak-dark .dg-team-social a {
  background-color: #0D0D0D;
  color: var(--oit-clr-white);
}
.reak-dark .dg-team-social a:hover {
  color: var(--oit-clr-black);
  background-color: var(--oit-clr-white);
}
.reak-dark .st-testimonial-info {
  background-color: #101216;
}
.reak-dark .st-testimonial-ratting {
  color: var(--oit-clr-white);
}
.reak-dark .reak-dark p {
  color: var(--oit-clr-white);
}
.reak-dark .dg-contact-form-box {
  background: #0D0D0D;
}
.reak-dark .st-price-value {
  color: var(--oit-clr-white);
}
.reak-dark .st-price-list ul li {
  color: var(--oit-clr-white);
}
.reak-dark .st-price-item {
  background-color: #0D0D0D;
}
.reak-dark .st-price-btn .oit-btn-border {
  color: var(--oit-clr-white);
  border: 1px solid #999999;
}
.reak-dark .st-price-head {
  background-color: #101216;
}
.reak-dark .st-price-item.active .st-price-btn .oit-btn-border {
  color: var(--oit-clr-black);
  border: 1px solid var(--oit-clr-white);
  background-color: var(--oit-clr-white);
}
.reak-dark .sd-service-style .oit-service-title {
  color: var(--oit-clr-black);
}
.reak-dark .sd-service-style .oit-service-content p {
  color: var(--oit-clr-black);
}
.reak-dark .sd-funfact-card span {
  color: #999999;
}
.reak-dark .sd-funfact-card.card-1 {
  background-color: rgba(255, 255, 255, 0.2) !important;
}
.reak-dark .sd-funfact-card.card-3 {
  background-color: rgba(255, 255, 255, 0.2) !important;
}
.reak-dark .sd-funfact-card.card-2 {
  background-color: #101216 !important;
}
.reak-dark .sd-funfact-card.card-4 {
  background-color: #101216 !important;
}
.reak-dark .sd-funfact-title {
  color: var(--oit-clr-white);
}
.reak-dark .sd-choose-card-title {
  color: var(--oit-clr-white);
}
.reak-dark .sd-choose-card {
  background-color: #0D0D0D;
}
.reak-dark .sd-choose-card-inner {
  border: 1px solid rgba(255, 255, 255, 0.2);
}
.reak-dark .sd-choose-card-icon svg {
  color: var(--oit-clr-white);
}
.reak-dark .sd-choose-card-body p {
  color: #999999;
}
.reak-dark .sd-team-title {
  color: var(--oit-clr-white);
}
.reak-dark .sd-team-content span {
  color: #999999;
}
.reak-dark .reak-dark .sd-team-social a {
  background-color: rgba(255, 255, 255, 0.4);
}
.reak-dark .reak-dark .sd-team-social a:hover {
  color: var(--oit-clr-black);
  background-color: var(--oit-clr-white);
}
.reak-dark .sd-team-row-item .row [class*=col]:not(:last-child) .sd-team-item {
  border-right: 1px solid #D9D9D9;
}
.reak-dark .sd-team-row-item {
  border-bottom: 1px solid #D9D9D9;
}
.reak-dark .oit-bin-to-card-item.grey-bg.card-1 {
  background-color: #101216 !important;
}
.reak-dark .oit-bin-to-card-item.grey-bg.card-3 {
  background-color: #101216 !important;
}
.reak-dark .oit-bin-to-card-title {
  color: var(--oit-clr-white);
}
.reak-dark .oit-bin-to-card-item span {
  color: #999999;
}
.reak-dark .st-testimonial-info p {
  color: var(--oit-clr-white);
}
.reak-dark .st-testimonial-info span {
  color: var(--oit-clr-white);
}
.reak-dark .sd-team-social a {
  background-color: var(--oit-clr-white);
}
.reak-dark .sd-team-social a:hover {
  background-color: #101216;
}
.reak-dark .ba-about-vision-title {
  color: var(--oit-clr-white);
}
.reak-dark .ba-about-vision-item p {
  color: #999999;
}
.reak-dark .ba-about-vision-item p span {
  color: var(--oit-clr-white);
}
.reak-dark .ba-about-vision-item ul li span {
  color: #999999;
}
.reak-dark .ba-about-vision-item ul li span::before {
  background-color: var(--oit-clr-white);
}
.reak-dark .dg-contact-area.faq-style .dg-contact-info span {
  color: var(--oit-clr-white);
}
.reak-dark .dg-contact-area.faq-style .dg-contact-info a {
  color: rgba(255, 255, 255, 0.7) !important;
}
.reak-dark .dg-contact-area.faq-style .dg-contact-social a {
  color: var(--oit-clr-white);
}
.reak-dark .dg-contact-area.faq-style .dg-contact-form-box {
  background: rgba(0, 0, 0, 0.8);
}
.reak-dark .dg-contact-area.faq-style .dg-contact-form-box label {
  color: var(--oit-clr-white);
}
.reak-dark .dg-contact-area.faq-style .dg-contact-input-box input {
  color: var(--oit-clr-white);
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.reak-dark .dg-contact-area.faq-style .dg-contact-input-box input::placeholder {
  color: rgba(255, 255, 255, 0.8);
}
.reak-dark .dg-contact-area.faq-style .dg-contact-select .nice-select {
  color: rgba(255, 255, 255, 0.8);
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.reak-dark .dg-contact-area.faq-style .dg-contact-textarea-box textarea {
  background-color: transparent;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.reak-dark .dg-contact-area.faq-style .dg-contact-select .nice-select span.current {
  color: rgba(255, 255, 255, 0.8);
}
.reak-dark .blog-details-breadcrumb-big-title {
  color: var(--oit-clr-white);
}
.reak-dark .dg-contact-area.faq-style .dg-contact-select .nice-select::after {
  border-bottom: 2px solid var(--oit-clr-white);
  border-right: 2px solid var(--oit-clr-white);
}
.reak-dark .career-item {
  background-color: #101216;
}
.reak-dark .career-item p {
  color: #999999;
}
.reak-dark .career-item .title {
  color: var(--oit-clr-white);
}
.reak-dark .career-meta span {
  color: #999999;
}
.reak-dark .career-meta span:not(:last-child) {
  border-right: 1px solid #999999;
}
.reak-dark .oit-btn-border.btn-small:hover {
  color: var(--oit-clr-black);
  background-color: var(--oit-clr-white);
}
.reak-dark .blog-details-breadcrumb-title {
  color: var(--oit-clr-white);
}
.reak-dark .blog-details-breadcrumb-badges.badges-style-2 {
  border-bottom: 1px solid #999999;
}
.reak-dark .sidebar-widget-title {
  color: var(--oit-clr-white);
  border-bottom: 1px solid rgba(73, 73, 73, 0.6);
}
.reak-dark .sidebar-search-box input {
  color: var(--oit-clr-white);
  background: #0D0D0D;
}
.reak-dark .sidebar-search-button button {
  color: var(--oit-clr-black);
  background-color: var(--oit-clr-white);
}
.reak-dark .sidebar-widget {
  background-color: #101216;
}
.reak-dark .sidebar-widget-list span {
  color: #999999;
}
.reak-dark .sidebar-widget-list:hover {
  color: var(--oit-clr-white);
}
.reak-dark .sidebar-widget-post .rc-post-title {
  color: var(--oit-clr-white);
}
.reak-dark .sidebar-widget-post .rc-meta span {
  color: #999999;
}
.reak-dark .sidebar-widget-list {
  color: #999999;
}
.reak-dark .sidebar-widget-list.active {
  color: #999999;
}
.reak-dark .sidebar-widget-list:hover svg {
  color: var(--oit-clr-white);
}
.reak-dark .postbox-title {
  color: var(--oit-clr-white);
}
.reak-dark .postbox-dsc p {
  color: #999999;
}
.reak-dark .postbox-left {
  background-color: #101216;
}
.reak-dark .postbox-tag-title {
  color: var(--oit-clr-white);
}
.reak-dark .postbox-tag-content a {
  color: var(--oit-clr-white);
  border: 1px solid rgba(93, 93, 93, 0.7);
}
.reak-dark .postbox-share-content a {
  color: var(--oit-clr-white);
  border: 1px solid rgba(93, 93, 93, 0.7);
  background-color: rgba(13, 13, 13, 0.08);
}
.reak-dark .postbox-share-content a:hover {
  color: var(--oit-clr-white);
  background-color: #000;
}
.reak-dark .postbox-share-content a svg {
  color: var(--oit-clr-white);
}
.reak-dark .postbox-user-info .user-title {
  color: var(--oit-clr-white);
}
.reak-dark .postbox-user-info p {
  color: #999999;
}
.reak-dark .postbox-form-input-box input {
  color: var(--oit-clr-white);
  border: 1px solid rgba(73, 73, 73, 0.8);
}
.reak-dark .postbox-form-input-box input::placeholder {
  color: var(--oit-clr-white);
}
.reak-dark .postbox-form-textarea-box textarea {
  color: var(--oit-clr-white);
  border: 1px solid rgba(73, 73, 73, 0.8);
}
.reak-dark .postbox-form-textarea-box textarea::placeholder {
  color: var(--oit-clr-white);
}
.reak-dark .blog-details-breadcrumb-author-info .title-sm {
  color: var(--oit-clr-white);
}
.reak-dark .blog-details-breadcrumb-author-info span {
  color: #999999;
}
.reak-dark .blog-details-date-box span {
  color: #999999;
}
.reak-dark .blog-details-date-box strong {
  color: var(--oit-clr-white);
}
.reak-dark .postbox-comment ul li {
  background: linear-gradient(209deg, oklab(18.184% -0.00087 -0.00879/0.9) 0%, rgba(16, 18, 22, 0.9) 100%);
}
.reak-dark .postbox-content .postbox-form-input-box input {
  background-color: #101216;
}
.reak-dark .postbox-content .postbox-form-textarea-box textarea {
  background-color: #101216;
}
.reak-dark .postbox-form-input-box input:focus {
  border: 1px solid rgba(255, 255, 255, 0.7);
}
.reak-dark .postbox-form-textarea-box textarea:focus {
  border: 1px solid rgba(255, 255, 255, 0.7);
}
.reak-dark .postbox-area.blog-standard-style .blog-details-breadcrumb-badges .badge {
  background-color: #434343;
  color: #999999;
}
.reak-dark .blog-details-breadcrumb-badges.badges-style-2 > div {
  background-color: #434343;
}
.reak-dark .blog-details-breadcrumb-badges .badge {
  color: #999999;
}
.reak-dark .oit-btn-border.btn-small {
  color: #999999;
  background-color: #434343;
}
.reak-dark .oit-btn-border.btn-black-bg:hover i {
  color: var(--oit-clr-white);
  background-color: var(--oit-clr-black);
}
.reak-dark .career-details-meta strong {
  color: var(--oit-clr-white);
}
.reak-dark .career-details-meta span {
  color: #999999;
}
.reak-dark .career-details-list li span {
  font-weight: 600;
  font-size: 20px;
  line-height: 1.5;
  color: var(--oit-clr-white);
}
.reak-dark .career-details-list li span svg, .reak-dark .career-details-list li span i {
  color: var(--oit-clr-white);
}
.reak-dark .career-details-deadline strong {
  color: var(--oit-clr-white);
}
.reak-dark .career-details-deadline span {
  color: #999999;
}
.reak-dark .contact-style .oit-price-item {
  border: none;
  width: 555px;
  min-height: auto;
  background-color: var(--oit-clr-black);
}
.reak-dark .contact-style .oit-price-title {
  color: var(--oit-clr-white);
}
.reak-dark .contact-details-big-title {
  color: var(--oit-clr-white);
}
.reak-dark .contact-details-info-wrap {
  border-top: 1px solid #434343;
}
.reak-dark .contact-details-info-top-box {
  border-bottom: 1px solid #434343;
}
.reak-dark .contact-details-info-top span {
  color: var(--oit-clr-white);
}
.reak-dark .contact-details-info-top a {
  color: #999999;
}
.reak-dark .contact-details-info-bottom a {
  color: #999999;
}
.reak-dark .contact-details-time strong {
  color: var(--oit-clr-white);
}
.reak-dark .contact-details-time svg {
  color: var(--oit-clr-white);
}
.reak-dark .contact-details-info-wrap .oit-btn-border {
  border-color: #101216;
  background-color: #101216;
}
.reak-dark .project-slide-style .oit-project-item {
  background-color: var(--oit-clr-black);
}
.reak-dark .project-details-author-list ul li span {
  color: var(--oit-clr-white);
}
.reak-dark .project-details-subtitle {
  color: #999999;
}
.reak-dark .profile-content .title {
  color: var(--oit-clr-white);
}
.reak-dark .profile-content > span {
  font-weight: 600;
  font-size: 20px;
  display: block;
  margin-bottom: 45px;
  color: rgba(255, 255, 255, 0.6);
}
.reak-dark .profile-content > p {
  color: #999999;
}
.reak-dark .profile-content .contact-info > a {
  font-weight: 600;
  font-size: 20px;
  color: var(--oit-clr-white);
}
.reak-dark .profile-content .contact-info span {
  color: #999999;
}
.reak-dark .profile-content .contact-social a {
  color: #999999;
  background: #0D0D0D;
}
.reak-dark .profile-content .contact-social a:hover {
  color: var(--oit-clr-white);
}
.reak-dark .error-title {
  color: var(--oit-clr-white);
}
.reak-dark .error-thumb img {
  filter: invert(1);
}
.reak-dark .header-dark .oit-header-logo img {
  filter: invert(1);
}
.reak-dark .header-dark.oit-header-bdr {
  border-bottom: 1px dashed var(--oit-clr-white);
}
.reak-dark .header-dark .oit-header-menu nav > ul > li > a {
  color: var(--oit-clr-white);
}
.reak-dark .oit-award-icon img {
  opacity: 0.7;
  filter: invert(1);
}
.reak-dark .blog-details-breadcrumb-badges .badge {
  background-color: #434343;
}
.reak-dark .blog-details-breadcrumb-area .blog-details-breadcrumb-author-wrap {
  background-color: #434343;
}
.reak-dark .dg-testimonial-area.service-style .dg-testimonial-item:hover {
  background-color: #0D0D0D;
}
.reak-dark .oitoffcanvas__logo img {
  filter: invert(1);
}
.reak-dark .oitoffcanvas__text p {
  color: rgba(153, 153, 153, 0.6);
}
.reak-dark .oit-menu-mobile ul li:not(:last-child) > a, .reak-dark .oit-category-mobile-menu ul li:not(:last-child) > a {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}
.reak-dark .oit-menu-mobile ul li > a, .reak-dark .oit-category-mobile-menu ul li > a {
  color: var(--oit-clr-white);
}
.reak-dark .oitoffcanvas__info .offcanva-title {
  color: var(--oit-clr-white);
}
.reak-dark .oitoffcanvas__info-icon a {
  color: var(--oit-clr-black);
  background-color: var(--oit-clr-white);
}
.reak-dark .oitoffcanvas__info-address a {
  color: var(--oit-clr-white);
}
.reak-dark .oitoffcanvas__info-address span {
  color: rgba(153, 153, 153, 0.6);
}
.reak-dark .oitoffcanvas {
  background: var(--oit-clr-black) none repeat scroll 0 0;
}
.reak-dark .oitoffcanvas__text {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.reak-dark .oit-menu-mobile ul li.has-dropdown > a .dropdown-toggle-btn {
  color: var(--oit-clr-white);
  border: 1px solid rgba(255, 255, 255, 0.2);
}
.reak-dark .oit-menu-mobile ul li.has-dropdown > a .dropdown-toggle-btn:hover {
  background-color: var(--oit-clr-white);
}
.reak-dark .oit-menu-mobile ul li.has-dropdown > a .dropdown-toggle-btn:hover i {
  color: var(--oit-clr-black);
}
.reak-dark .oit-menu-mobile ul li:hover > a .dropdown-toggle-btn i, .reak-dark .oit-category-mobile-menu ul li:hover > a .dropdown-toggle-btn i {
  color: var(--oit-clr-white);
}
.reak-dark .oitoffcanvas__close-btn button {
  color: var(--oit-clr-white);
  -webkit-transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.5);
  -moz-transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.5);
  transition: all 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.5);
}

/*# sourceMappingURL=reak.css.map */