@charset "UTF-8";
/*-----------------------------------------------------------------------------------

    Template Name: Cetalog - Marketing & SEO Agency Html Template
    Author: Theme Pure
    Support: https://help.themepure.net/support/
    Description: It’s suitable for Modern Business, SEO Websites, Agency Websites  or any kind of seo related profile.
    Version: 1.0

-----------------------------------------------------------------------------------

/************ TABLE OF CONTENTS ***************

	-----------------
    01. THEME CSS
	-----------------
		1.1 Theme Default
		1.2 Common Classes
		1.3 Default Spacing

	-----------------
    02. COMPONENTS css
	-----------------
		2.1 Back to top
		2.2 Theme Settings
		2.3 Buttons
		2.4 Animations
		2.5 Preloader
		2.6 Background 
		2.7 Carousel
		2.8 Nice Select
		2.9 Pagination
		2.10 Offcanvas
		2.11 Breadcrumb
		2.12 Accordion
		2.13 Tab
		2.14 Modal
		2.15 Section Title
	-----------------
    03. HEADER CSS
	-----------------
		3.1 Header Style 1

    ---------------------------------
	04. MENU CSS
	---------------------------------
		4.1 Main menu css
		4.2 Meanmenu css

	---------------------------------
	05. BLOG CSS
	---------------------------------
		5.1 Blog Details
		5.2 Sidebar css

	---------------------------------
	06. FOOTER CSS
	---------------------------------
		6.1 Footer Style 1
		6.2 Footer Style 2

	---------------------------------
	07. PAGES CSS
	---------------------------------
		7.1 About css
		7.2 Blog css
		7.3 Case css
		7.4 Contact css
		7.5 Cta css
		7.6 Fact css
		7.7 Faq css
		7.8 Features css
		7.9 Hero css
		7.10 Portfolio css
		7.11 Pricing css 
		7.12 Service css
		7.13 Team css
		7.14 Testimonial css
		7.15 Login css



**********************************************/
/*----------------------------------------*/
/*  1.1 Theme Default
/*----------------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Montserrat+Alternates:wght@400;500;600;700;800&family=Outfit:wght@400;500;600;700;800&display=swap");
.home-2-bg {
  background-color: #351E8A;
}

.gray-bg {
  background-color: #F8F8F8;
}

.tp-main-menu ul li .submenu, .tp-accordion .accordion-button .tp-accordion-plus, .tp-accordion .accordion-button .tp-accordion-plus::after, .tp-accordion .accordion-button .tp-accordion-plus::before, .back-to-top-wrapper, a,
button,
p,
input,
select,
textarea,
li,
.transition-3 {
  -webkit-transition: all 0.3s 0s ease-out;
  -moz-transition: all 0.3s 0s ease-out;
  -ms-transition: all 0.3s 0s ease-out;
  -o-transition: all 0.3s 0s ease-out;
  transition: all 0.3s 0s ease-out;
}

.back-to-top-btn {
  -webkit-transition: transform 0.3s 0s ease-out;
  -moz-transition: transform 0.3s 0s ease-out;
  -ms-transition: transform 0.3s 0s ease-out;
  -o-transition: transform 0.3s 0s ease-out;
  transition: transform 0.3s 0s ease-out;
}

:root {
  /**
  @font family declaration
  */
  --tp-ff-body: 'Outfit', sans-serif;
  --tp-ff-heading: 'Montserrat Alternates', sans-serif;
  --tp-ff-p: 'Outfit', sans-serif;
  --tp-ff-fontawesome: "Font Awesome 6 Pro";
  /**
  @color declaration
  */
  --tp-common-white: #ffffff;
  --tp-common-black: #000;
  --tp-heading-primary: #000D44;
  --tp-heading-secondary: #52525C;
  --tp-grey-1: #F1F1F1;
  --tp-grey-2: #F5F6F8;
  --tp-text-body: #727885;
  --tp-text-1: #000;
  --tp-text-2: #7A8085;
  --tp-theme-primary: #162DE4;
  --tp-theme-secondary: #030A39;
  --tp-gradient-primary: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  --tp-gradient-secondary: linear-gradient(90deg, #9EFBD3 0%, #57E9F2 48%, #45D4FB 100%);
  --tp-border-primary: #000;
  --tp-border-secondary: #000;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/*---------------------------------
	typography css start 
---------------------------------*/
body {
  font-family: var(--tp-ff-body);
  font-size: 14px;
  font-weight: normal;
  color: var(--tp-text-body);
  line-height: 26px;
}

a {
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--tp-ff-heading);
  color: var(--tp-heading-primary);
  margin-top: 0px;
  font-weight: 700;
  line-height: 1.2;
  -webkit-transition: color 0.3s 0s ease-out;
  -moz-transition: color 0.3s 0s ease-out;
  -ms-transition: color 0.3s 0s ease-out;
  -o-transition: color 0.3s 0s ease-out;
  transition: color 0.3s 0s ease-out;
}

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-family: var(--tp-ff-p);
  font-size: 18px;
  font-weight: 400;
  color: var(--tp-text-body);
  margin-bottom: 15px;
  line-height: 30px;
}

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;
}

.uppercase {
  text-transform: uppercase;
}

.capitalize {
  text-transform: capitalize;
}

input[type=text],
input[type=email],
input[type=tel],
input[type=number],
input[type=password],
input[type=url],
textarea {
  outline: none;
  background-color: #EFF0F2;
  height: 54px;
  width: 100%;
  line-height: 54px;
  font-size: 16px;
  border: 1px solid #EFF0F2;
  color: var(--tp-common-black);
  padding-left: 29px;
  padding-right: 29px;
}
[dir=rtl] input[type=text],
[dir=rtl] input[type=email],
[dir=rtl] input[type=tel],
[dir=rtl] input[type=number],
[dir=rtl] input[type=password],
[dir=rtl] input[type=url],
[dir=rtl] textarea {
  text-align: right;
}
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: #84848B;
}
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: #84848B;
}
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: #84848B;
}
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: #84848B;
}
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: #84848B;
}

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(--tp-common-black);
  color: var(--tp-common-white);
  text-shadow: none;
}

::-moz-selection {
  background: var(--tp-common-black);
  color: var(--tp-common-white);
  text-shadow: none;
}

::selection {
  background: var(--tp-common-black);
  color: var(--tp-common-white);
  text-shadow: none;
}

*::-moz-placeholder {
  color: var(--tp-common-black);
  font-size: var(--tp-fz-body);
  opacity: 1;
}

*::placeholder {
  color: var(--tp-common-black);
  font-size: var(--tp-fz-body);
  opacity: 1;
}

.tp-gx-18 {
  --bs-gutter-x: 18px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-gx-18 {
    --bs-gutter-x: 18px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-gx-18 {
    --bs-gutter-x: 10px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-gx-18 {
    --bs-gutter-x: 10px;
  }
}
@media (max-width: 575px) {
  .tp-gx-18 {
    --bs-gutter-x: 10px;
  }
}
.tp-gx-18 [class*=col-] {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

.tp-gx-20 {
  --bs-gutter-x: 20px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-gx-20 {
    --bs-gutter-x: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-gx-20 {
    --bs-gutter-x: 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-gx-20 {
    --bs-gutter-x: 10px;
  }
}
@media (max-width: 575px) {
  .tp-gx-20 {
    --bs-gutter-x: 10px;
  }
}
.tp-gx-20 [class*=col-] {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

.tp-gx-25 {
  --bs-gutter-x: 25px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-gx-25 {
    --bs-gutter-x: 25px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-gx-25 {
    --bs-gutter-x: 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-gx-25 {
    --bs-gutter-x: 10px;
  }
}
@media (max-width: 575px) {
  .tp-gx-25 {
    --bs-gutter-x: 10px;
  }
}
.tp-gx-25 [class*=col-] {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

.tp-gx-38 {
  --bs-gutter-x: 38px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-gx-38 {
    --bs-gutter-x: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-gx-38 {
    --bs-gutter-x: 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-gx-38 {
    --bs-gutter-x: 10px;
  }
}
@media (max-width: 575px) {
  .tp-gx-38 {
    --bs-gutter-x: 10px;
  }
}
.tp-gx-38 [class*=col-] {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

.tp-gx-42 {
  --bs-gutter-x: 42px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-gx-42 {
    --bs-gutter-x: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-gx-42 {
    --bs-gutter-x: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-gx-42 {
    --bs-gutter-x: 10px;
  }
}
@media (max-width: 575px) {
  .tp-gx-42 {
    --bs-gutter-x: 10px;
  }
}
.tp-gx-42 [class*=col-] {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

/*---------------------------------
    1.2 Common Classes
---------------------------------*/
@media (min-width: 1400px) {
  .container-large,
  .container-large-lg,
  .container-large-md,
  .container-large-sm,
  .container-large-xl,
  .container-large-xxl {
    max-width: 1320px;
  }
}

.w-img img {
  width: 100%;
}

.m-img img {
  max-width: 100%;
}

.fix {
  overflow: hidden;
}

.clear {
  clear: both;
}

.z-index-1 {
  z-index: 1;
}

.z-index-11 {
  z-index: 11;
}

.overflow-y-visible {
  overflow-x: hidden;
  overflow-y: visible;
}

.p-relative {
  position: relative;
}

.p-absolute {
  position: absolute;
}

.include-bg {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.demo {
  -webkit-transition: color 0.3s 0s linear;
  -moz-transition: color 0.3s 0s linear;
  -ms-transition: color 0.3s 0s linear;
  -o-transition: color 0.3s 0s linear;
  transition: color 0.3s 0s linear;
  -webkit-transition: color 0.3s linear, transform 0.2s ease;
  -moz-transition: color 0.3s linear, transform 0.2s ease;
  -ms-transition: color 0.3s linear, transform 0.2s ease;
  -o-transition: color 0.3s linear, transform 0.2s ease;
  transition: color 0.3s linear, transform 0.2s ease;
}
[dir=rtl] .demo {
  margin-left: 0;
  margin-right: 15px;
}
div.demo img {
  margin-left: 10px;
}

[tp-theme=tp-theme-dark] .demo {
  color: yellow;
}

/*----------------------------------------
    Body Overlay 
-----------------------------------------*/
.body-overlay {
  background-color: var(--tp-common-black);
  height: 100%;
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 99;
  left: 0;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.3s 0s ease-out;
  -moz-transition: all 0.3s 0s ease-out;
  -ms-transition: all 0.3s 0s ease-out;
  -o-transition: all 0.3s 0s ease-out;
  transition: all 0.3s 0s ease-out;
}
.body-overlay:hover {
  cursor: pointer;
}

.body-overlay.opened {
  opacity: 0.5;
  visibility: visible;
}

/* dropcap */
.tp-dropcap::first-letter {
  font-size: 50px;
  font-weight: 700;
  float: left;
  text-align: center;
  color: var(--tp-common-black);
  background-color: var(--tp-common-white);
  box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.06);
  margin-right: 5px;
  line-height: inherit;
}

.class {
  stroke-dasharray: 189px, 191px;
  stroke-dashoffset: 0px;
}

/*---------------------------------
    1.3 Default Spacing
---------------------------------*/ /*----------------------------------------*/
/*  2.1 Back to top
/*----------------------------------------*/
.back-to-top-wrapper {
  position: fixed;
  right: 50px;
  bottom: 0;
  height: 44px;
  width: 44px;
  cursor: pointer;
  display: block;
  border-radius: 50%;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
}
@media (max-width: 575px) {
  .back-to-top-wrapper {
    right: 20px;
    bottom: 20px;
  }
}
.back-to-top-wrapper.back-to-top-btn-show {
  visibility: visible;
  opacity: 1;
  bottom: 50px;
}

.back-to-top-btn {
  display: inline-block;
  width: 44px;
  height: 44px;
  line-height: 44px;
  text-align: center;
  background: linear-gradient(22.13deg, #01124E 7.64%, #1471B7 114.23%);
  box-shadow: 0px 8px 16px rgba(3, 4, 28, 0.3);
  color: var(--tp-common-white);
  border-radius: 50%;
}
.back-to-top-btn svg {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  transform: translateY(-2px);
}
.back-to-top-btn:hover {
  -webkit-transform: translateY(-4px);
  -moz-transform: translateY(-4px);
  -ms-transform: translateY(-4px);
  -o-transform: translateY(-4px);
  transform: translateY(-4px);
}

/*----------------------------------------*/
/*  2.2 Theme Settings
/*----------------------------------------*/
.tp-theme-settings-area {
  position: fixed;
  top: 50%;
  left: 0;
  width: 240px;
  background-color: #fff;
  border: 1px solid #EAEAEF;
  -webkit-transform: translateY(-50%) translateX(-100%);
  -moz-transform: translateY(-50%) translateX(-100%);
  -ms-transform: translateY(-50%) translateX(-100%);
  -o-transform: translateY(-50%) translateX(-100%);
  transform: translateY(-50%) translateX(-100%);
  z-index: 991;
  direction: ltr;
  border-bottom-right-radius: 4px;
}
.tp-theme-settings-area.settings-opened {
  -webkit-transform: translateY(-50%) translateX(0%);
  -moz-transform: translateY(-50%) translateX(0%);
  -ms-transform: translateY(-50%) translateX(0%);
  -o-transform: translateY(-50%) translateX(0%);
  transform: translateY(-50%) translateX(0%);
}
.tp-theme-settings-area.settings-opened .tp-theme-settings-gear {
  opacity: 0;
}
.tp-theme-settings-area.settings-opened .tp-theme-settings-close {
  opacity: 1;
}
.tp-theme-settings-open {
  position: absolute;
  top: -1px;
  left: 100%;
}
.tp-theme-settings-open button {
  background-color: var(--tp-common-white);
  border: 1px solid #EAEAEF;
  border-left: 0;
  width: 60px;
  height: 60px;
  line-height: 60px;
  text-align: center;
  font-size: 24px;
  color: var(--tp-common-black);
  position: relative;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.tp-theme-settings-gear {
  display: inline-block;
  -webkit-animation: tp-theme-setting-spin 4s linear infinite;
  -moz-animation: tp-theme-setting-spin 4s linear infinite;
  -ms-animation: tp-theme-setting-spin 4s linear infinite;
  -o-animation: tp-theme-setting-spin 4s linear infinite;
  animation: tp-theme-setting-spin 4s linear infinite;
}
@-webkit-keyframes tp-theme-setting-spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-moz-keyframes tp-theme-setting-spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-ms-keyframes tp-theme-setting-spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes tp-theme-setting-spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.tp-theme-settings-close {
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  opacity: 0;
}
.tp-theme-header-title {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 30px;
}
.tp-theme-wrapper {
  padding: 20px 30px 30px;
}
.tp-theme-toggle {
  text-align: center;
}
.tp-theme-toggle-main {
  display: inline-block;
  width: 160px;
  margin: auto;
  position: relative;
  z-index: 1;
  background-color: #f0f0f5;
  padding: 4px;
  border-radius: 20px;
}
.tp-theme-toggle-light, .tp-theme-toggle-dark {
  display: inline-block;
  width: 48%;
  height: 26px;
  line-height: 26px;
}
.tp-theme-toggle input {
  display: none;
}
.tp-theme-toggle:hover {
  cursor: pointer;
}
.tp-theme-toggle label {
  color: var(--tp-common-black);
  font-size: 14px;
  font-weight: 500;
}
.tp-theme-toggle label:hover {
  cursor: pointer;
}
.tp-theme-toggle #tp-theme-toggler {
  display: none;
}
.tp-theme-toggle #tp-theme-toggler:checked + i {
  right: calc(50% - 4px);
}
.tp-theme-toggle-slide {
  position: absolute;
  top: 50%;
  right: 4px;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 50%;
  height: 26px;
  color: var(--tp-common-black);
  background-color: var(--tp-common-white);
  border-radius: 30px;
  -webkit-transform: translate3d(0, 0);
  transform: translate3d(0, 0);
  -webkit-transition: all 0.2s 0s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s 0s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s 0s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s 0s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s 0s cubic-bezier(0.25, 1, 0.5, 1);
  z-index: -1;
}
.tp-theme-dir {
  text-align: center;
}
.tp-theme-dir-main {
  display: inline-block;
  width: 160px;
  margin: auto;
  position: relative;
  z-index: 1;
  background-color: #f0f0f5;
  padding: 4px;
  border-radius: 20px;
}
.tp-theme-dir-ltr, .tp-theme-dir-rtl {
  display: inline-block;
  width: 48%;
  height: 26px;
  line-height: 26px;
}
.tp-theme-dir input {
  display: none;
}
.tp-theme-dir:hover {
  cursor: pointer;
}
.tp-theme-dir label {
  color: var(--tp-common-black);
  font-size: 14px;
  font-weight: 500;
}
.tp-theme-dir label:hover {
  cursor: pointer;
}
.tp-theme-dir #tp-dir-toggler {
  display: none;
}
.tp-theme-dir #tp-dir-toggler:checked + i {
  right: calc(50% - 4px);
}
.tp-theme-dir-slide {
  position: absolute;
  top: 50%;
  right: 4px;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 50%;
  height: 26px;
  color: var(--tp-common-black);
  background-color: var(--tp-common-white);
  border-radius: 30px;
  -webkit-transform: translate3d(0, 0);
  transform: translate3d(0, 0);
  -webkit-transition: all 0.2s 0s cubic-bezier(0.25, 1, 0.5, 1);
  -moz-transition: all 0.2s 0s cubic-bezier(0.25, 1, 0.5, 1);
  -ms-transition: all 0.2s 0s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: all 0.2s 0s cubic-bezier(0.25, 1, 0.5, 1);
  transition: all 0.2s 0s cubic-bezier(0.25, 1, 0.5, 1);
  z-index: -1;
}
.tp-theme-color-item.active button::before {
  opacity: 1;
  visibility: visible;
}
.tp-theme-color-btn {
  width: 100%;
  height: 40px;
  line-height: 40px;
  text-align: center;
  position: relative;
}
.tp-theme-color-btn::before {
  position: absolute;
  content: "\f00c";
  font-weight: 600;
  font-family: var(--tp-ff-fontawesome);
  color: var(--tp-common-white);
  font-size: 16px;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: all 0.3s 0s ease-out;
  -moz-transition: all 0.3s 0s ease-out;
  -ms-transition: all 0.3s 0s ease-out;
  -o-transition: all 0.3s 0s ease-out;
  transition: all 0.3s 0s ease-out;
  opacity: 0;
  visibility: hidden;
}
.tp-theme-color-btn.tp-color-settings-btn[data-color="#F50963"] {
  background-color: #F50963;
}
.tp-theme-color-btn.tp-color-settings-btn[data-color="#008080"] {
  background-color: #008080;
}
.tp-theme-color-btn.tp-color-settings-btn[data-color="#F31E5E"] {
  background-color: #F31E5E;
}
.tp-theme-color-btn.tp-color-settings-btn[data-color="#AB6C56"] {
  background-color: #AB6C56;
  color: black;
}
.tp-theme-color-btn.tp-color-settings-btn[data-color="#4353FF"] {
  background-color: #4353FF;
}
.tp-theme-color-btn.tp-color-settings-btn[data-color="#3661FC"] {
  background-color: #3661FC;
}
.tp-theme-color-btn.tp-color-settings-btn[data-color="#2CAE76"] {
  background-color: #2CAE76;
}
.tp-theme-color-btn.tp-color-settings-btn[data-color="#FF5A1B"] {
  background-color: #FF5A1B;
}
.tp-theme-color-btn.tp-color-settings-btn[data-color="#03041C"] {
  background-color: #03041C;
}
.tp-theme-color-btn.tp-color-settings-btn[data-color="#ED212C"] {
  background-color: #ED212C;
}
.tp-theme-color-input {
  margin-top: 15px;
}
.tp-theme-color-input h6 {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 5px;
}
.tp-theme-color-input label {
  display: inline-block;
  width: 100%;
  height: 40px;
  line-height: 40px;
  text-align: center;
  background-color: var(--tp-theme-1);
  -webkit-transition: all 0.3s 0s ease-out;
  -moz-transition: all 0.3s 0s ease-out;
  -ms-transition: all 0.3s 0s ease-out;
  -o-transition: all 0.3s 0s ease-out;
  transition: all 0.3s 0s ease-out;
}
.tp-theme-color-input label:hover {
  cursor: pointer;
}
.tp-theme-color-input input {
  display: none;
}

/*----------------------------------------*/
/*  2.3 Buttons
/*----------------------------------------*/
/* theme btn */
.tp-btn {
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  color: var(--tp-common-white);
  background-image: var(--tp-gradient-primary);
  text-align: center;
  font-family: var(--tp-ff-heading);
  padding: 22px 36px;
  position: relative;
  border-radius: 10px;
  letter-spacing: 0.1em;
  z-index: 1;
  overflow: hidden;
  transition: 0.3s ease;
}
@media only screen and (min-width: 398px) and (max-width: 575px) {
  .tp-btn {
    padding: 20px 30px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-btn {
    padding: 20px 15px;
    margin-bottom: 30px;
  }
}
.tp-btn i, .tp-btn svg {
  margin-left: 5px;
}
.tp-btn svg {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  transform: translateY(-2px);
}
.tp-btn:hover {
  color: var(--tp-common-white);
  transform: translateY(-5px);
}
.tp-btn:focus {
  color: var(--tp-common-white);
}

.tp-btn-sm {
  display: inline-block;
  font-size: 14px;
  font-weight: 700;
  color: var(--tp-common-white);
  background-image: var(--tp-gradient-primary);
  text-align: center;
  font-family: var(--tp-ff-heading);
  padding: 15px 39px;
  position: relative;
  border-radius: 5px;
  letter-spacing: 0.1em;
  z-index: 1;
  text-transform: uppercase;
  overflow: hidden;
  transition: 0.3s ease;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-btn-sm {
    padding: 15px 23px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-btn-sm {
    padding: 15px 32px;
  }
}
.tp-btn-sm i, .tp-btn-sm svg {
  margin-left: 5px;
}
.tp-btn-sm svg {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  transform: translateY(-2px);
}
.tp-btn-sm:hover {
  color: var(--tp-common-white);
  transform: translateY(-5px);
}
.tp-btn-sm:focus {
  color: var(--tp-common-white);
}
.tp-btn-sm-blue {
  display: inline-block;
  font-size: 14px;
  font-weight: 700;
  color: var(--tp-common-white);
  background-image: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  text-align: center;
  font-family: var(--tp-ff-heading);
  padding: 15px 45px;
  position: relative;
  border-radius: 5px;
  letter-spacing: 0.1em;
  z-index: 1;
  text-transform: uppercase;
  overflow: hidden;
  transition: 0.3s ease;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-btn-sm-blue {
    padding: 15px 18px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-btn-sm-blue {
    padding: 15px 35px;
  }
}
.tp-btn-sm-blue i, .tp-btn-sm-blue svg {
  margin-left: 5px;
}
.tp-btn-sm-blue svg {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  transform: translateY(-2px);
}
.tp-btn-sm-blue:hover {
  color: var(--tp-common-white);
}
.tp-btn-sm-blue:focus {
  color: var(--tp-common-white);
}

.tp-btn-black {
  display: inline-block;
  font-size: 14px;
  font-weight: 700;
  color: var(--tp-common-white);
  background: #161616;
  text-align: center;
  font-family: var(--tp-ff-heading);
  padding: 15px 45px;
  position: relative;
  border-radius: 5px;
  letter-spacing: 0.1em;
  z-index: 1;
  text-transform: uppercase;
  overflow: hidden;
  transition: 0.3s ease;
}
@media only screen and (min-width: 1600px) and (max-width: 1699px), only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-btn-black {
    padding: 15px 35px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-btn-black {
    padding: 15px 20px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-btn-black {
    padding: 15px 35px;
  }
}
.tp-btn-black i, .tp-btn-black svg {
  margin-left: 5px;
}
.tp-btn-black svg {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  transform: translateY(-2px);
}
.tp-btn-black:hover {
  color: var(--tp-common-white);
}
.tp-btn-black:focus {
  color: var(--tp-common-white);
}

.tp-white-btn {
  font-family: var(--tp-ff-heading);
  background: var(--tp-common-white);
  box-shadow: 0px 7px 13px rgba(44, 65, 97, 0.13);
  border-radius: 10px;
  padding: 18px 50px;
  line-height: 2;
  font-weight: 700;
  font-size: 16px;
  color: #000D44;
  display: inline-block;
}
.tp-white-btn:hover {
  color: var(--tp-theme-primary);
}

.tp-round-btn {
    font-family: var(--tp-ff-heading);
    font-weight: 700;
    font-size: 14px;
    background: #00c9bd;
    border-radius: 69px;
    padding: 15px 39px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--tp-common-white);
    display: inline-block;
    -webkit-border-radius: 69px;
    -moz-border-radius: 69px;
    -o-border-radius: 69px;
    -ms-border-radius: 69px;
    position: relative;
    z-index: 1;
    overflow: hidden;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-round-btn {
    padding: 10px 15px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-round-btn {
    padding: 15px 35px;
  }
}
.tp-round-btn-sky {
  background: #2DA9E9;
  font-family: var(--tp-ff-heading);
  font-weight: 700;
  font-size: 14px;
  border-radius: 69px;
  padding: 15px 35px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--tp-common-white);
  display: inline-block;
  -webkit-border-radius: 69px;
  -moz-border-radius: 69px;
  -o-border-radius: 69px;
  -ms-border-radius: 69px;
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.shine-effect:after {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.5);
  -webkit-transition: all 0.4s;
  transition: all 0.4s;
  -webkit-transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, -45deg) translate3d(0, -150%, 0);
  transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, -45deg) translate3d(0, -160%, 0);
}
.shine-effect:hover:after {
  -webkit-transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, -45deg) translate3d(0, 150%, 0);
  transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, -45deg) translate3d(0, 150%, 0);
}

.button-bounce-shine::after {
  content: "";
  height: 300px;
  width: 300px;
  background-color: var(--tp-common-white);
  opacity: 0.2;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%) scale(0);
  transition: 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  z-index: -1;
}
.button-bounce-shine:hover {
  color: #fff;
}
.button-bounce-shine:hover::after {
  transform: translateY(-50%) translateX(-50%) scale(1);
}

/* offcanvas btn */
.tp-btn-offcanvas {
  display: inline-block;
  font-size: 14px;
  font-weight: 600;
  color: var(--tp-common-white);
  background: var(--tp-theme-primary);
  text-align: center;
  font-family: var(--tp-ff-space);
  padding: 9px 22px;
  letter-spacing: -0.02em;
  position: relative;
  z-index: 1;
  text-transform: capitalize;
}
.tp-btn-offcanvas i {
  padding-left: 5px;
}
.tp-btn-offcanvas:hover {
  background-color: var(--tp-common-black);
  color: var(--tp-common-white);
}

.tp-btn-hover {
  position: relative;
  z-index: 9;
  overflow: hidden;
}
.tp-btn-hover b {
  position: absolute;
  width: 0px;
  height: 0px;
  background-color: var(--tp-common-white);
  border-radius: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
  z-index: -1;
}
.tp-btn-hover:hover {
  color: var(--tp-common-white);
}
.tp-btn-hover:hover b {
  width: 500px;
  height: 500px;
  display: inline-block;
}
.tp-btn-hover.alt-color b {
  background-color: #7924C8;
}
.tp-btn-hover.alt-bg-pink b {
  background-color: #FF3A8A;
}
.tp-btn-hover.alt-black-color b {
  background-color: black;
}
.tp-btn-hover.alt-bg-white b {
  background-color: #fff;
}
.tp-btn-hover.alt-bg-red b {
  background-color: var(--tp-theme-red);
}

.tp-pulse-border {
  position: relative;
  border-radius: 50%;
}
.tp-pulse-border-inner {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: -1;
}
.tp-pulse-border-inner::after, .tp-pulse-border-inner::before {
  position: absolute;
  content: "";
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  border-radius: 50%;
  border: 1px solid #FF3A8A;
  animation: borderanimate 1.5s linear infinite;
  animation-delay: 0s;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
  transition: all 0.3s ease;
  z-index: -1;
}
.tp-pulse-border-inner::before {
  animation-delay: 0.5s;
}

/*----------------------------------------*/
/*  2.4 Animations
/*----------------------------------------*/
/* pulse effect animation */
@-webkit-keyframes pulse {
  0% {
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
  }
  70% {
    -webkit-box-shadow: 0 0 0 25px rgba(255, 255, 255, 0);
  }
  100% {
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}
@keyframes pulse {
  0% {
    -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
  }
  70% {
    -moz-box-shadow: 0 0 0 25px rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 25px rgba(255, 255, 255, 0);
  }
  100% {
    -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}
@-webkit-keyframes borderanimate {
  0% {
    transform: translate(-50%, -50%) scale(0.8);
  }
  60% {
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(2);
    opacity: 0;
  }
}
@-moz-keyframes borderanimate {
  0% {
    transform: translate(-50%, -50%) scale(0.8);
  }
  60% {
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(2);
    opacity: 0;
  }
}
@-ms-keyframes borderanimate {
  0% {
    transform: translate(-50%, -50%) scale(0.8);
  }
  60% {
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(2);
    opacity: 0;
  }
}
@keyframes borderanimate {
  0% {
    transform: translate(-50%, -50%) scale(0.8);
  }
  60% {
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) scale(2);
    opacity: 0;
  }
}
@-webkit-keyframes tp_arrow {
  49% {
    transform: translateX(30%);
  }
  50% {
    opacity: 0;
    transform: translateX(-30%);
  }
  51% {
    opacity: 1;
  }
}
@-moz-keyframes tp_arrow {
  49% {
    transform: translateX(30%);
  }
  50% {
    opacity: 0;
    transform: translateX(-30%);
  }
  51% {
    opacity: 1;
  }
}
@-ms-keyframes tp_arrow {
  49% {
    transform: translateX(30%);
  }
  50% {
    opacity: 0;
    transform: translateX(-30%);
  }
  51% {
    opacity: 1;
  }
}
@keyframes tp_arrow {
  49% {
    transform: translateX(30%);
  }
  50% {
    opacity: 0;
    transform: translateX(-30%);
  }
  51% {
    opacity: 1;
  }
}
@-webkit-keyframes hero-bounce-updown {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-20px);
  }
  60% {
    transform: translateY(-10px);
  }
}
@-moz-keyframes hero-bounce-updown {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-20px);
  }
  60% {
    transform: translateY(-10px);
  }
}
@-ms-keyframes hero-bounce-updown {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-20px);
  }
  60% {
    transform: translateY(-10px);
  }
}
@keyframes hero-bounce-updown {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-20px);
  }
  60% {
    transform: translateY(-10px);
  }
}
@-webkit-keyframes hero-bounce-leftright {
  0% {
    transform: translateX(3px);
  }
  25% {
    transform: translateX(7px);
  }
  50% {
    transform: translateX(15px);
  }
  75% {
    transform: translateX(7px);
  }
  100% {
    transform: translateX(2px);
  }
}
@-moz-keyframes hero-bounce-leftright {
  0% {
    transform: translateX(3px);
  }
  25% {
    transform: translateX(7px);
  }
  50% {
    transform: translateX(15px);
  }
  75% {
    transform: translateX(7px);
  }
  100% {
    transform: translateX(2px);
  }
}
@-ms-keyframes hero-bounce-leftright {
  0% {
    transform: translateX(3px);
  }
  25% {
    transform: translateX(7px);
  }
  50% {
    transform: translateX(15px);
  }
  75% {
    transform: translateX(7px);
  }
  100% {
    transform: translateX(2px);
  }
}
@keyframes hero-bounce-leftright {
  0% {
    transform: translateX(3px);
  }
  25% {
    transform: translateX(7px);
  }
  50% {
    transform: translateX(15px);
  }
  75% {
    transform: translateX(7px);
  }
  100% {
    transform: translateX(2px);
  }
}
@-webkit-keyframes tp-hotspot-2 {
  0% {
    -webkit-transform: scale(0.1);
    -moz-transform: scale(0.1);
    -ms-transform: scale(0.1);
    -o-transform: scale(0.1);
    transform: scale(0.1);
    opacity: 0;
  }
  70% {
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -ms-transform: scale(1.3);
    -o-transform: scale(1.3);
    transform: scale(1.3);
    opacity: 0;
  }
}
@-moz-keyframes tp-hotspot-2 {
  0% {
    -webkit-transform: scale(0.1);
    -moz-transform: scale(0.1);
    -ms-transform: scale(0.1);
    -o-transform: scale(0.1);
    transform: scale(0.1);
    opacity: 0;
  }
  70% {
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -ms-transform: scale(1.3);
    -o-transform: scale(1.3);
    transform: scale(1.3);
    opacity: 0;
  }
}
@-ms-keyframes tp-hotspot-2 {
  0% {
    -webkit-transform: scale(0.1);
    -moz-transform: scale(0.1);
    -ms-transform: scale(0.1);
    -o-transform: scale(0.1);
    transform: scale(0.1);
    opacity: 0;
  }
  70% {
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -ms-transform: scale(1.3);
    -o-transform: scale(1.3);
    transform: scale(1.3);
    opacity: 0;
  }
}
@keyframes tp-hotspot-2 {
  0% {
    -webkit-transform: scale(0.1);
    -moz-transform: scale(0.1);
    -ms-transform: scale(0.1);
    -o-transform: scale(0.1);
    transform: scale(0.1);
    opacity: 0;
  }
  70% {
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -ms-transform: scale(1.3);
    -o-transform: scale(1.3);
    transform: scale(1.3);
    opacity: 0;
  }
}
@-webkit-keyframes tp-hotspot-3 {
  0% {
    transform: translate(0px, 0px);
  }
  20% {
    transform: translate(20px, -5px);
  }
  40% {
    transform: translate(40px, 20px);
  }
  60% {
    transform: translate(20px, 40px);
  }
  80% {
    transform: translate(-20px, 30px);
  }
  100% {
    transform: translate(0px, 0px);
  }
}
@-moz-keyframes tp-hotspot-3 {
  0% {
    transform: translate(0px, 0px);
  }
  20% {
    transform: translate(20px, -5px);
  }
  40% {
    transform: translate(40px, 20px);
  }
  60% {
    transform: translate(20px, 40px);
  }
  80% {
    transform: translate(-20px, 30px);
  }
  100% {
    transform: translate(0px, 0px);
  }
}
@-ms-keyframes tp-hotspot-3 {
  0% {
    transform: translate(0px, 0px);
  }
  20% {
    transform: translate(20px, -5px);
  }
  40% {
    transform: translate(40px, 20px);
  }
  60% {
    transform: translate(20px, 40px);
  }
  80% {
    transform: translate(-20px, 30px);
  }
  100% {
    transform: translate(0px, 0px);
  }
}
@keyframes tp-hotspot-3 {
  0% {
    transform: translate(0px, 0px);
  }
  20% {
    transform: translate(20px, -5px);
  }
  40% {
    transform: translate(40px, 20px);
  }
  60% {
    transform: translate(20px, 40px);
  }
  80% {
    transform: translate(-20px, 30px);
  }
  100% {
    transform: translate(0px, 0px);
  }
}
@-webkit-keyframes tp-popup-pink {
  0% {
    box-shadow: 0 0 0 0 rgb(255, 58, 188);
  }
  70% {
    box-shadow: 0 0 0 45px rgba(16, 208, 161, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(16, 208, 161, 0);
  }
}
@-moz-keyframes tp-popup-pink {
  0% {
    box-shadow: 0 0 0 0 rgb(255, 58, 188);
  }
  70% {
    box-shadow: 0 0 0 45px rgba(16, 208, 161, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(16, 208, 161, 0);
  }
}
@-ms-keyframes tp-popup-pink {
  0% {
    box-shadow: 0 0 0 0 rgb(255, 58, 188);
  }
  70% {
    box-shadow: 0 0 0 45px rgba(16, 208, 161, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(16, 208, 161, 0);
  }
}
@keyframes tp-popup-pink {
  0% {
    box-shadow: 0 0 0 0 rgb(255, 58, 188);
  }
  70% {
    box-shadow: 0 0 0 45px rgba(16, 208, 161, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(16, 208, 161, 0);
  }
}
@-webkit-keyframes rotate-anim {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-moz-keyframes rotate-anim {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@-ms-keyframes rotate-anim {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes rotate-anim {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/*----------------------------------------*/
/*  2.5 Preloader
/*----------------------------------------*/
#loading {
  background-color: #fff;
  height: 100%;
  width: 100%;
  position: fixed;
  z-index: 999999;
  margin-top: 0px;
  top: 0px;
}

#loading-center {
  width: 100%;
  height: 100%;
  position: relative;
}

#loading-center-absolute {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 25%;
  transform: translate(-50%, -50%);
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  #loading-center-absolute {
    width: 40%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  #loading-center-absolute {
    width: 40%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  #loading-center-absolute {
    width: 45%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  #loading-center-absolute {
    width: 50%;
  }
}
@media (max-width: 575px) {
  #loading-center-absolute {
    width: 60%;
  }
}
#loading {
  background-color: #fff;
  height: 100%;
  width: 100%;
  position: fixed;
  z-index: 999999;
  margin-top: 0px;
  top: 0px;
}

#loading-center {
  width: 100%;
  height: 100%;
  position: relative;
}

#loading-center-absolute {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.loading__letter {
  display: inline-block;
  font-size: 28px;
  font-weight: 600;
  color: var(--tp-common-black);
  text-transform: capitalize;
  animation-name: tp-preloader-bounce;
  animation-duration: 1.5s;
  animation-iteration-count: infinite;
}
.loading__letter:nth-child(2) {
  animation-delay: 0.1s;
}
.loading__letter:nth-child(3) {
  animation-delay: 0.2s;
}
.loading__letter:nth-child(4) {
  animation-delay: 0.3s;
}
.loading__letter:nth-child(5) {
  animation-delay: 0.4s;
}
.loading__letter:nth-child(6) {
  animation-delay: 0.5s;
}
.loading__letter:nth-child(7) {
  animation-delay: 0.6s;
}
.loading__letter:nth-child(8) {
  animation-delay: 0.8s;
}
.loading__letter:nth-child(9) {
  animation-delay: 1s;
}
.loading__letter:nth-child(10) {
  animation-delay: 1.2s;
}

@-webkit-keyframes tp-preloader-bounce {
  0% {
    transform: translateY(0px);
  }
  40% {
    transform: translateY(-25px);
  }
  80%, 100% {
    transform: translateY(0px);
  }
}
@-moz-keyframes tp-preloader-bounce {
  0% {
    transform: translateY(0px);
  }
  40% {
    transform: translateY(-25px);
  }
  80%, 100% {
    transform: translateY(0px);
  }
}
@-ms-keyframes tp-preloader-bounce {
  0% {
    transform: translateY(0px);
  }
  40% {
    transform: translateY(-25px);
  }
  80%, 100% {
    transform: translateY(0px);
  }
}
@keyframes tp-preloader-bounce {
  0% {
    transform: translateY(0px);
  }
  40% {
    transform: translateY(-25px);
  }
  80%, 100% {
    transform: translateY(0px);
  }
}
/*----------------------------------------*/
/*  2.6 Background
/*----------------------------------------*/
.grey-bg {
  background: var(--tp-grey-1);
}

.grey-bg-2 {
  background: var(--tp-grey-2);
}

.white-bg {
  background: var(--tp-common-white);
}

.black-bg {
  background: var(--tp-common-black);
}

/*----------------------------------------*/
/*  2.7 Carousel
/*----------------------------------------*/
/* tp range slider css */
.tp-range-slider .inside-slider {
  padding-left: 7px;
  padding-right: 17px;
}
.tp-range-slider .noUi-target {
  background-color: #191C3C;
  border-radius: 12px;
  border: 0;
  box-shadow: none;
}
.tp-range-slider .noUi-connect {
  background-color: var(--tp-theme-primary);
}
.tp-range-slider .noUi-horizontal {
  height: 6px;
}
.tp-range-slider .noUi-handle {
  height: 24px;
  width: 24px;
  background-color: var(--tp-theme-primary);
  border-radius: 50%;
  border: 4px solid var(--tp-common-white);
  box-shadow: 0px 4px 10px rgba(5, 9, 43, 0.3);
  top: -9px;
}
.tp-range-slider .noUi-handle:hover {
  cursor: pointer;
}
.tp-range-slider .noUi-handle::before, .tp-range-slider .noUi-handle::after {
  display: none;
}
.tp-range-slider-dark .noUi-handle {
  border: 4px solid #2D314B;
}

/* tp swiper slider dot */
.tp-swiper-dot .swiper-pagination-bullet {
  width: 8px;
  height: 8px;
  background-color: var(--tp-grey-1);
  opacity: 1;
  margin: 0 9px;
  position: relative;
}
.tp-swiper-dot .swiper-pagination-bullet::after {
  position: absolute;
  content: "";
  left: 50%;
  top: 50%;
  width: calc(100% + 16px);
  height: calc(100% + 16px);
  background-color: transparent;
  border: 2px solid transparent;
  border-radius: 50%;
  transform: translate(-50%, -50%) scale(0);
}
.tp-swiper-dot .swiper-pagination-bullet button {
  font-size: 0;
}
.tp-swiper-dot .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: var(--tp-theme-primary);
}
.tp-swiper-dot .swiper-pagination-bullet.swiper-pagination-bullet-active::after {
  border-color: var(--tp-theme-primary);
  transform: translate(-50%, -50%) scale(1);
}

.tp-swiper-arrow {
  width: 80px;
  height: 80px;
  line-height: 80px;
  font-size: 20px;
  text-align: center;
  background-color: var(--tp-common-white);
  color: var(--tp-common-black);
}
.tp-swiper-arrow:hover {
  background-color: var(--tp-common-black);
  color: var(--tp-common-white);
}

/* tp slick arrow */
/*----------------------------------------*/
/*  2.8 Nice Select
/*----------------------------------------*/
.nice-select {
  -webkit-tap-highlight-color: transparent;
  background-color: #fff;
  border-radius: 5px;
  border: solid 1px #e8e8e8;
  box-sizing: border-box;
  clear: both;
  cursor: pointer;
  display: block;
  float: left;
  font-family: inherit;
  font-size: 14px;
  font-weight: normal;
  height: 42px;
  line-height: 40px;
  outline: none;
  padding-left: 18px;
  padding-right: 30px;
  position: relative;
  text-align: left !important;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  white-space: nowrap;
  width: auto;
}
.nice-select:hover {
  border-color: #dbdbdb;
}
.nice-select:active, .nice-select.open, .nice-select:focus {
  border-color: #999;
}
.nice-select::after {
  background-color: transparent;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  margin-top: 0;
  right: 0;
  content: "\f107";
  font-family: var(--tp-ff-fontawesome);
  transform-origin: center;
  color: var(--tp-common-black);
  font-weight: 500;
  height: auto;
  width: auto;
}
.nice-select.open::after {
  -webkit-transform: translateY(-50%) rotate(-180deg);
  -moz-transform: translateY(-50%) rotate(-180deg);
  -ms-transform: translateY(-50%) rotate(-180deg);
  -o-transform: translateY(-50%) rotate(-180deg);
  transform: translateY(-50%) rotate(-180deg);
}
.nice-select.open .list {
  opacity: 1;
  pointer-events: auto;
  -webkit-transform: scale(1) translateY(0);
  -ms-transform: scale(1) translateY(0);
  transform: scale(1) translateY(0);
}
.nice-select.disabled {
  border-color: #ededed;
  color: #999;
  pointer-events: none;
}
.nice-select.disabled::after {
  border-color: #cccccc;
}
.nice-select.wide {
  width: 100%;
}
.nice-select.wide .list {
  left: 0 !important;
  right: 0 !important;
}
.nice-select.right {
  float: right;
}
.nice-select.right .list {
  left: auto;
  right: 0;
}
.nice-select.small {
  font-size: 12px;
  height: 36px;
  line-height: 34px;
}
.nice-select.small::after {
  height: 4px;
  width: 4px;
}
.nice-select.small .option {
  line-height: 34px;
  min-height: 34px;
}
.nice-select .list {
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 0 0 0 1px rgba(68, 68, 68, 0.11);
  box-sizing: border-box;
  margin-top: 4px;
  opacity: 0;
  overflow: hidden;
  padding: 0;
  pointer-events: none;
  position: absolute;
  top: 100%;
  left: 0;
  -webkit-transform-origin: 50% 0;
  -ms-transform-origin: 50% 0;
  transform-origin: 50% 0;
  -webkit-transform: scale(0.75) translateY(-21px);
  -ms-transform: scale(0.75) translateY(-21px);
  transform: scale(0.75) translateY(-21px);
  -webkit-transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out;
  transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out;
  z-index: 9;
}
.nice-select .option {
  cursor: pointer;
  font-weight: 400;
  line-height: 40px;
  list-style: none;
  min-height: 40px;
  outline: none;
  padding-left: 18px;
  padding-right: 29px;
  text-align: left;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
}
.nice-select .option.selected {
  font-weight: bold;
}
.nice-select .option.disabled {
  background-color: transparent;
  color: #999;
  cursor: default;
}

.no-csspointerevents .nice-select .list {
  display: none;
}

.no-csspointerevents .nice-select.open .list {
  display: block;
}

/*----------------------------------------*/
/*  2.9 Pagination
/*----------------------------------------*/
.tp-pagination ul li {
  display: inline-block;
}
.tp-pagination ul li:not(:last-child) {
  margin-right: 10px;
}
.tp-pagination ul li a, .tp-pagination ul li span {
  display: inline-block;
  width: 50px;
  height: 50px;
  line-height: 46px;
  text-align: center;
  border-radius: 7px;
  border: 2px solid #f1f1f1;
  font-size: 18px;
  font-weight: 600;
}
.tp-pagination ul li a:hover, .tp-pagination ul li a.current, .tp-pagination ul li span:hover, .tp-pagination ul li span.current {
  background: var(--tp-theme-primary);
  border-color: var(--tp-theme-primary);
  color: var(--tp-common-white);
}

/*----------------------------------------*/
/*  2.10 Offcanvas
/*----------------------------------------*/
.offcanvas__area {
  position: fixed;
  right: 0;
  top: 0;
  width: 360px;
  height: 100%;
  -webkit-transform: translateX(calc(100% + 80px));
  -moz-transform: translateX(calc(100% + 80px));
  -ms-transform: translateX(calc(100% + 80px));
  -o-transform: translateX(calc(100% + 80px));
  transform: translateX(calc(100% + 80px));
  background: var(--tp-common-white) none repeat scroll 0 0;
  -webkit-transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  -moz-transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  -ms-transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  -o-transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  transition: transform 0.45s ease-in-out, opacity 0.45s ease-in-out;
  z-index: 999;
  overflow-y: scroll;
  overscroll-behavior-y: contain;
  scrollbar-width: none;
}
.offcanvas__area::-webkit-scrollbar {
  display: none; /* for Chrome, Safari, and Opera */
}
.offcanvas__area.offcanvas-opened {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
  opacity: 1;
}
@media (max-width: 575px) {
  .offcanvas__area {
    width: 100%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .offcanvas__top {
    margin-bottom: 30px;
  }
}
.offcanvas__wrapper {
  position: relative;
  padding: 50px 40px 145px;
  z-index: 1;
  min-height: 100%;
}
@media (max-width: 575px) {
  .offcanvas__wrapper {
    padding: 20px;
  }
}
.offcanvas__close {
  position: absolute;
  top: 30px;
  right: 30px;
}
@media (max-width: 575px) {
  .offcanvas__close {
    right: 20px;
    top: 20px;
  }
}
.offcanvas__close-btn {
  display: inline-block;
  font-size: 16px;
  height: 44px;
  width: 44px;
  line-height: 40px;
  border: 2px solid var(--tp-border-primary);
  background-color: transparent;
  color: var(--tp-text-1);
  border-radius: 50%;
}
.offcanvas__close-btn:hover {
  background-color: var(--tp-theme-primary);
  border-color: transparent;
  color: var(--tp-common-white);
}
.offcanvas__close-btn svg {
  -webkit-transform: translateY(-1px);
  -moz-transform: translateY(-1px);
  -ms-transform: translateY(-1px);
  -o-transform: translateY(-1px);
  transform: translateY(-1px);
}
.offcanvas__inner h4 {
  font-family: var(--tp-ff-space);
  font-size: 24px;
  color: var(--tp-common-white);
  line-height: 1.3;
  margin-bottom: 15px;
}
.offcanvas__inner p {
  font-family: var(--tp-ff-inter);
  font-size: 16px;
  line-height: 22px;
  color: var(--tp-common-white);
  margin-bottom: 30px;
}
.offcanvas__inner > img {
  margin-bottom: 30px;
}
.offcanvas__menu ul li {
  list-style: none;
  margin-bottom: 10px;
}
.offcanvas__menu ul li:last-child {
  margin-bottom: 0;
}
.offcanvas__menu ul li a {
  font-weight: 700;
  font-size: 20px;
  color: var(--tp-common-black);
}
.offcanvas__menu ul li:hover > a {
  color: var(--tp-theme-primary);
}
.offcanvas__text p {
  font-family: var(--tp-ff-inter);
  font-weight: 400;
  font-size: 14px;
  line-height: 1.7;
  letter-spacing: 0.01em;
  color: var(--tp-common-black-4);
  margin-bottom: 25px;
}
.offcanvas__contact-call {
  font-family: var(--tp-ff-space);
  font-weight: 700;
  font-size: 20px;
  color: var(--tp-common-black);
  margin-bottom: 5px;
}
.offcanvas__contact-call a:hover {
  color: var(--tp-theme-primary);
}
.offcanvas__contact-mail {
  font-family: var(--tp-ff-space);
  font-weight: 400;
  font-size: 16px;
  color: var(--tp-text-1);
}
.offcanvas__contact-mail a:hover {
  color: var(--tp-theme-primary);
}
.offcanvas__social {
  margin-bottom: 22px;
  padding-bottom: 40px;
  border-bottom: 1px solid var(--tp-border-primary);
}
.offcanvas__social a {
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 38px;
  text-align: center;
  background: transparent;
  color: var(--tp-common-black);
  margin-right: 5px;
  border: 2px solid var(--tp-border-primary);
}
.offcanvas__social a:hover {
  background: var(--tp-theme-primary);
  color: var(--tp-common-white);
  border-color: var(--tp-theme-primary);
}
.offcanvas__btn {
  margin-bottom: 125px;
}
.offcanvas__btn a {
  margin-bottom: 20px;
}
.offcanvas__info-item {
  margin-bottom: 38px;
}
.offcanvas__info-item-title {
  font-family: var(--tp-ff-space);
  font-weight: 700;
  font-size: 18px;
  color: var(--tp-common-white);
  margin-bottom: 12px;
}
.offcanvas__info-item p {
  font-size: 16px;
  color: var(--tp-text-16);
  margin-bottom: 0;
  line-height: 22px;
}
.offcanvas__info-item p a:hover {
  color: var(--tp-theme-primary);
}

/*----------------------------------------*/
/*  2.11 Breadcrumb
/*----------------------------------------*/
.breadcrumb__title {
    font-size: 48px;
    color: #351E8A;/*var(--tp-common-white);*/
}
.breadcrumb__title-pre {
    display: inline-block;
    height: 24px;
    line-height: 26px;
    font-size: 14px;
    color: #351E8A;
    font-weight: 500;
    background: var(--tp-theme-2);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    padding: 0 7px;
    margin-bottom: 12px;
}
.breadcrumb__list span {
  font-size: 16px;
  color:#000;/* var(--tp-common-white);*/
  font-weight: 500;
  padding-right: 3px;
  margin-right: 3px;
  text-transform: capitalize;
}
.breadcrumb__list span a:hover {
  color: var(--tp-theme-primary);
}

/*----------------------------------------*/
/*  2.12 Accordion
/*----------------------------------------*/
.tp-accordion .accordion-item {
  background-color: transparent;
  border: 0;
  border-bottom: 1px solid rgba(var(--tp-common-black), 1);
}
.tp-accordion .accordion-item:first-of-type .accordion-button {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}
.tp-accordion .accordion-item:last-of-type {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.tp-accordion .accordion-item:last-of-type .accordion-button.collapsed {
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.tp-accordion .accordion-button {
  padding: 30px 0;
  padding-right: 15px;
  font-size: 24px;
  font-weight: 500;
  color: var(--tp-common-black);
  background-color: transparent;
  /* plus icon css */
}
.tp-accordion .accordion-button::after {
  position: absolute;
  content: "\f106";
  font-family: var(--tp-ff-fontawesome);
  background-image: none;
  top: 28%;
  right: 0;
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  color: var(--tp-theme-primary);
  width: auto;
  height: auto;
  font-weight: 500;
  background: none;
}
.tp-accordion .accordion-button.has-plus-icon::after {
  display: none;
}
.tp-accordion .accordion-button .tp-accordion-plus {
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  display: inline-block;
  width: 14px;
  height: 14px;
}
[dir=rtl] .tp-accordion .accordion-button .tp-accordion-plus {
  right: auto;
  left: 0;
}
.tp-accordion .accordion-button .tp-accordion-plus::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 2px;
  left: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  background-color: #525258;
  border-radius: 2px;
}
[dir=rtl] .tp-accordion .accordion-button .tp-accordion-plus::after {
  right: 0;
  left: auto;
}
.tp-accordion .accordion-button .tp-accordion-plus::before {
  position: absolute;
  content: "";
  width: 2px;
  height: 100%;
  left: 50%;
  top: 0;
  background-color: #525258;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  border-radius: 2px;
}
[dir=rtl] .tp-accordion .accordion-button .tp-accordion-plus::before {
  right: 50%;
  left: auto;
  -webkit-transform: translateX(50%);
  -moz-transform: translateX(50%);
  -ms-transform: translateX(50%);
  -o-transform: translateX(50%);
  transform: translateX(50%);
}
.tp-accordion .accordion-button.collapsed::after {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  color: var(--tp-common-black);
}
.tp-accordion .accordion-button:not(.collapsed) {
  color: var(--tp-theme-primary);
  background-color: transparent;
  box-shadow: none;
}
.tp-accordion .accordion-button:not(.collapsed) .tp-accordion-plus::before {
  -webkit-transform: translateX(-50%) rotate(90deg);
  -moz-transform: translateX(-50%) rotate(90deg);
  -ms-transform: translateX(-50%) rotate(90deg);
  -o-transform: translateX(-50%) rotate(90deg);
  transform: translateX(-50%) rotate(90deg);
  background-color: var(--tp-theme-1);
}
[dir=rtl] .tp-accordion .accordion-button:not(.collapsed) .tp-accordion-plus::before {
  -webkit-transform: translateX(50%) rotate(90deg);
  -moz-transform: translateX(50%) rotate(90deg);
  -ms-transform: translateX(50%) rotate(90deg);
  -o-transform: translateX(50%) rotate(90deg);
  transform: translateX(50%) rotate(90deg);
}
.tp-accordion .accordion-button:not(.collapsed) .tp-accordion-plus::after {
  background-color: var(--tp-theme-1);
}
.tp-accordion .accordion-button:focus {
  box-shadow: none;
  border: 0;
}
.tp-accordion .accordion-button:hover {
  color: var(--tp-theme-primary);
}
.tp-accordion .accordion-button:hover::after {
  color: var(--tp-theme-primary);
}
.tp-accordion .accordion-body {
  padding: 0 0 25px;
}
.tp-accordion .accordion-body p {
  font-size: 16px;
  color: var(--tp-text-1);
}

/*----------------------------------------*/
/*  2.13 Tab
/*----------------------------------------*/
.tp-tab .nav-tabs {
  padding: 0;
  margin: 0;
  border: 0;
}
.tp-tab .nav-tabs .nav-link {
  padding: 0;
  margin: 0;
  border: 0;
}
@media only screen and (min-width: 351px) and (max-width: 399px) {
  .tp-tab .nav-tabs .nav-link {
    /*margin: auto;*/
    float:left;
  }
}

/*----------------------------------------*/
/*  2.14 Modal
/*----------------------------------------*/
/*----------------------------------------*/
/*  2.15 Section Title
/*----------------------------------------*/
.tp-section__title {
  font-size: 45px;
  color: var(--tp-heading-primary);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.3;
  margin-bottom: 30px;
}
@media (max-width: 575px) {
  .tp-section__title br {
    display: none;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-section__title {
    font-size: 42px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-section__title {
    font-size: 35px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-section__title {
    font-size: 42px;
  }
}
@media (max-width: 575px) {
  .tp-section__title {
    font-size: 30px;
  }
}
.tp-section__title-pre {
  font-family: var(--tp-ff-heading);
  font-weight: 600;
  font-size: 18px;
  color: var(--tp-heading-secondary);
  display: inline-block;
  letter-spacing: -0.02em;
  background: #FFFFFF;
  border: 1px solid #F5F5F5;
  box-shadow: 0px 9px 15px rgba(7, 18, 35, 0.08);
  border-radius: 65px;
  padding: 5px 20px;
  margin-bottom: 20px;
}
.tp-section__title-pre.has-before::before {
  content: "";
  width: 12px;
  height: 12px;
  margin-right: 10px;
  display: inline-block;
  background: linear-gradient(90deg, #9EFBD3 0%, #57E9F2 48%, #45D4FB 100%);
  border-radius: 30px;
}
.tp-section__title-pre.has-after::after {
  content: "";
  width: 12px;
  height: 12px;
  margin-left: 10px;
  display: inline-block;
  background: linear-gradient(90deg, #9EFBD3 0%, #57E9F2 48%, #45D4FB 100%);
  border-radius: 30px;
}
.tp-section__title-pre.has-after-2::before {
  content: "";
  width: 3px;
  height: 14px;
  margin-right: 10px;
  display: inline-block;
  background: #2DA9E9;
}
.tp-section__title-pre-3 {
  font-weight: 500;
  font-size: 15px;
  line-height: 19px;
  color: #161616;
  display: inline-block;
  letter-spacing: -0.02em;
  background: #FFFFFF;
  border: 1px solid #F5F5F5;
  box-shadow: 0px 15px 45px #DDDDDD;
  border-radius: 10px;
  padding: 10px 18px;
  margin-bottom: 20px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-section__title-pre-3 {
    font-size: 14px;
    padding: 10px;
  }
}
.tp-section__title-pre-3 i {
  height: 26px;
  width: 26px;
  background: linear-gradient(180deg, #003CFF 0%, #00EEFF 100%);
  border-radius: 5px;
  text-align: center;
  line-height: 1.4;
  font-size: 18px;
  color: #fff;
  margin-right: 13px;
}

/*----------------------------------------*/
/*  3.1 Header Style 1
/*----------------------------------------*/
.tp-header-transparent {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  z-index: 10;
}

.tp-header-space {
  padding-left: 64px;
  padding-right: 74px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-header-space {
    padding-left: 40px;
    padding-right: 40px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-header-space {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-header-space {
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 35px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-header-space {
    padding-left: 10px;
  }
}
.tp-header-space-3 {
  padding-left: 145px;
  padding-right: 145px;
  padding-top: 17px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-header-space-3 {
    padding-left: 45px;
    padding-right: 45px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-header-space-3 {
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-header-space-3 {
    padding-left: 30px;
    padding-right: 70px;
    padding-top: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-header-space-3 {
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 20px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-header-space-3 {
    padding-left: 0px;
    padding-right: 30px;
    padding-top: 20px;
  }
}
.tp-header-bottom-border {
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
}
.tp-header-logo img {
  max-width: 220px;
}
.tp-header-logo-border::after {
  position: absolute;
  content: "";
  height: 100%;
  top: 0;
  left: 312px;
  border-right: 0px solid rgba(255, 255, 255, 0.15);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-header-logo-border::after {
    content: none;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-header-logo-border::after {
    left: 255px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-header-logo-border::after {
    left: 240px;
  }
}
.tp-header-navbar a {
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 60px;
  width: 56px;
  height: 56px;
  display: inline-block;
  text-align: center;
  line-height: 56px;
  margin-right: 87px;
  color: var(--tp-common-white);
  transition: 0.3s ease;
}
@media only screen and (min-width: 1700px) and (max-width: 1899px), only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-header-navbar a {
    margin-right: 30px;
  }
}
@media only screen and (min-width: 1600px) and (max-width: 1699px) {
  .tp-header-navbar a {
    margin-right: 45px;
  }
}
.tp-header-navbar a:hover {
  background: #fff;
  color: black;
}
.tp-header-right::before {
  position: absolute;
  content: "";
  height: 100%;
  top: 0;
  right: 568px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-header-right::before {
    right: 500px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-header-right::before {
    right: 425px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-header-right::before {
    content: none;
  }
}
.tp-header-search a {
  color: var(--tp-common-white);
  border-radius: 60px;
  width: 56px;
  height: 56px;
  display: inline-block;
  text-align: center;
  line-height: 56px;
  transition: 0.3s ease;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-header-login {
    margin-left: 10px;
  }
}
.tp-header-login a {
  font-family: var(--tp-ff-heading);
  font-weight: 700;
  color: var(--tp-common-white);
  padding: 18px 33px;
  font-size: 14px;
  text-transform: uppercase;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 60px;
  letter-spacing: 0.1em;
  transition: 0.3s ease;
}
.tp-header-login a:hover {
  background: #fff;
  color: black;
}
.tp-header-login.home-3 a {
  color: #161616;
  border: 1px solid rgba(0, 0, 0, 0.09);
  transition: all 0.3s ease;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-header-btn {
    margin-left: 10px;
  }
}

.header-color {
  position: relative;
  z-index: 9;
  background: #351E8A;
}

.header__sticky.header-sticky {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  -webkit-animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
  animation: 500ms ease-in-out 0s normal none 1 running fadeInDown;
  z-index: 99;
  transition: 0.3s ease;
}

.home-1-sticky.header__sticky.header-sticky {
  background-color: #031753;
}
.home-1-sticky.header__sticky.header-sticky .tp-main-menu ul > li a {
  padding: 25px 38px;
}
@media only screen and (min-width: 1700px) and (max-width: 1899px) {
  .home-1-sticky.header__sticky.header-sticky .tp-main-menu ul > li a {
    padding: 25px 32px;
  }
}
@media only screen and (min-width: 1600px) and (max-width: 1699px) {
  .home-1-sticky.header__sticky.header-sticky .tp-main-menu ul > li a {
    padding: 25px 25px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .home-1-sticky.header__sticky.header-sticky .tp-main-menu ul > li a {
    padding: 25px 18px;
  }
}
.home-1-sticky.header__sticky.header-sticky .tp-main-menu ul > li .submenu li a {
  padding: 5px 25px;
}
.home-1-sticky.header__sticky.header-sticky .tp-main-menu ul > li .submenu li:hover > a {
  padding-left: 30px;
}

.home-2-sticky.header__sticky.header-sticky {
  background-color: #351E8A;
}
.home-2-sticky.header__sticky.header-sticky .tp-main-menu ul li a {
  padding: 25px 20px;
}
@media only screen and (min-width: 1700px) and (max-width: 1899px) {
    .home-2-sticky.header__sticky.header-sticky .tp-main-menu ul li a {
        padding: 25px 20px;
    }
}
@media only screen and (min-width: 1600px) and (max-width: 1699px) {
  .home-2-sticky.header__sticky.header-sticky .tp-main-menu ul li a {
    padding: 25px 10px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .home-2-sticky.header__sticky.header-sticky .tp-main-menu ul li a {
    padding: 25px 18px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .home-2-sticky.header__sticky.header-sticky .tp-main-menu ul li a {
    padding: 25px 12px;
  }
}
.home-2-sticky.header__sticky.header-sticky .tp-main-menu ul li .submenu li a {
  padding: 5px 25px;
}
.home-2-sticky.header__sticky.header-sticky .tp-main-menu ul li .submenu li:hover > a {
  padding-left: 30px;
}

.home-3-sticky.header__sticky.header-sticky {
  background-color: #fff;
  box-shadow: 0px 4px 10px rgba(3, 4, 28, 0.1);
}
.home-3-sticky.header__sticky.header-sticky .tp-header-space-3 {
  padding-top: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .home-3-sticky.header__sticky.header-sticky .tp-header-space-3 {
    padding-top: 5px;
    padding-bottom: 5px;
  }
}
.home-3-sticky.header__sticky.header-sticky .tp-main-menu ul li a {
  padding: 25px 39px;
}
@media only screen and (min-width: 1700px) and (max-width: 1899px) {
  .home-3-sticky.header__sticky.header-sticky .tp-main-menu ul li a {
    padding: 25px 32px;
  }
}
@media only screen and (min-width: 1600px) and (max-width: 1699px) {
  .home-3-sticky.header__sticky.header-sticky .tp-main-menu ul li a {
    padding: 25px 10px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .home-3-sticky.header__sticky.header-sticky .tp-main-menu ul li a {
    padding: 25px 26px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .home-3-sticky.header__sticky.header-sticky .tp-main-menu ul li a {
    padding: 25px 19px;
  }
}
.home-3-sticky.header__sticky.header-sticky .tp-main-menu ul li .submenu li a {
  padding: 5px 25px;
}
.home-3-sticky.header__sticky.header-sticky .tp-main-menu ul li .submenu li:hover > a {
  padding-left: 30px;
}
.home-3-sticky.header__sticky.header-sticky .tp-header-login.home-3 a:hover {
  border-color: #031753;
}
.home-3-sticky.header__sticky.header-sticky .tp-header-search.home-3 a:hover {
  border-color: #031753;
}
.home-3-sticky.header__sticky.header-sticky .tp-side-action {
  position: absolute;
  top: 53%;
  right: 25px;
  transform: translateY(-40%);
}
.home-3-sticky.header__sticky.header-sticky .hamburger-btn span {
  background: #01124E;
}

.offcanvas-overlay {
  position: fixed;
  height: 100%;
  width: 100%;
  background: #000D44;
  z-index: 110;
  opacity: 0.7;
  top: 0;
  left: 0;
  transition: 0.8s;
  opacity: 0;
  visibility: hidden;
}
.offcanvas-overlay.offcanvas-overlay-open {
  opacity: 0.9;
  visibility: visible;
}

.mean-container .mean-nav ul li a.mean-expand:hover {
  background: #858585;
}

.mobile-menu.home3-hamburger-color .tp-side-action {
  position: absolute;
  top: 53%;
  right: 25px;
  transform: translateY(-4%);
}

.hamburger-btn {
  width: 34px;
  height: 24px;
  position: relative;
  cursor: pointer;
  background: transparent;
  border: 0;
  outline: 0;
}
.hamburger-btn:hover span {
  background: #53e4f4;
}
.hamburger-btn span {
  display: inline-block;
  position: absolute;
  left: 0;
  background: var(--tp-common-white);
  height: 2px;
  width: 25px;
  opacity: 1;
  z-index: 1;
  border-radius: 10px;
  transition: 0.3s ease;
}
.hamburger-btn span:nth-child(1) {
  top: 0;
}
.hamburger-btn span:nth-child(2) {
  top: 10px;
  width: 14px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
}
.hamburger-btn span:nth-child(3) {
  top: 20px;
  right: 0;
  left: auto;
}
.hamburger-btn:hover span:nth-child(1) {
  left: 10px;
}
.hamburger-btn:hover span:nth-child(3) {
  right: 10px;
}
.hamburger-btn-black {
  height: 15px;
  width: 30px;
  top: -4px;
}
.hamburger-btn-black span {
  background-color: var(--tp-common-black);
}
.hamburger-btn-black span:nth-child(1) {
  top: 0;
}
.hamburger-btn-black span:nth-child(2) {
  top: 7px;
}
.hamburger-btn-black span:nth-child(3) {
  top: 14px;
}
.hamburger-btn-black:hover span {
  background-color: var(--tp-theme-primary);
}

.tp-side-info {
  position: fixed;
  top: 0;
  right: 0;
  width: 400px;
  height: 100%;
  background: linear-gradient(22.13deg, #01124E 7.64%, #1471B7 114.23%);
  box-shadow: -15px 31px 55px rgba(0, 2, 11, 0.31);
  padding: 40px;
  z-index: 999;
  opacity: 0;
  visibility: hidden;
  transition: 0.5s;
  overflow-y: scroll;
  overscroll-behavior-y: contain;
  scrollbar-width: none;
  transform: translateX(720px);
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-side-info {
    width: 400px;
    padding: 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-side-info {
    width: 445px;
    padding: 40px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-side-info {
    width: 400px;
    padding: 40px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-side-info {
    width: 100%;
    padding: 30px;
  }
}
.tp-side-info.tp-side-info-open {
  opacity: 1;
  visibility: visible;
  transform: translateX(0);
}
.tp-side-logo {
  margin-bottom: 15px;
  position: relative;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-side-logo {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-side-logo {
    margin-bottom: 15px;
  }
}
.tp-side-logo img {
  max-width: 160px;
}
.tp-side-social li {
  list-style: none;
  margin-left: 10px;
}
.tp-side-close button i {
  position: absolute;
  top: 50px;
  right: 40px;
  font-size: 30px;
  color: var(--tp-common-white);
  display: inline-block;
  transition: 0.3s ease;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-side-close button i {
    top: 40px;
    right: 30px;
  }
}
.tp-side-close button:hover i {
  transform: rotate(90deg);
}
.tp-side-action {
  position: absolute;
  top: 53%;
  right: 25px;
  transform: translateY(-55%);
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-side-action {
    right: 50px;
  }
}
.tp-side-content__inner-btn .tp-btn {
  padding: 12px 42px;
  width: 100%;
}
.tp-side-content__inner-btn .tp-btn:hover {
  background: #121212;
  color: #fff;
}
.tp-side-content .tp-side-title {
  font-weight: 600;
  font-size: 24px;
  line-height: 1.3;
  color: var(--tp-common-white);
  text-shadow: 0px 4px 4px rgba(14, 15, 72, 0.15);
  margin-bottom: 15px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-side-content .tp-side-title {
    font-size: 23px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-side-content .tp-side-title {
    font-size: 20px;
  }
}
.tp-side-content p {
  font-size: 16px;
  line-height: 22px;
  color: var(--tp-common-white);
  margin-bottom: 40px;
}
.tp-side-content-inner-content img {
  transform: translateX(30px);
  width: 65%;
  text-align: center;
  margin-bottom: 60px;
}
.tp-side-content-inner-content .tp-btn {
  padding: 16px 100px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-side-content-inner-content .tp-btn {
    padding: 15px 65px;
  }
}
.tp-side-content-inner-content .call {
  font-family: var(--tp-ff-heading);
  font-weight: 600;
  font-size: 20px;
  margin-bottom: 10px;
}
.tp-side-content-inner-content .call:hover {
  opacity: 0.7;
}
.tp-side-content-inner-content .mail {
  font-family: var(--tp-ff-heading);
  font-weight: 400;
  font-size: 20px;
}
.tp-side-content-inner-content .mail:hover {
  opacity: 0.7;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-side-content-inner-content .tp-footer-social-1 a {
    margin-right: 8px;
  }
}

.search-popup-overlay {
  position: fixed;
  height: 100%;
  width: 100%;
  background: #000D44;
  z-index: 10;
  opacity: 0.7;
  top: 0;
  left: 0;
  transition: 0.8s;
  opacity: 0;
  visibility: hidden;
  transition-delay: 0.9s;
}
.search-popup-overlay.search-popup-overlay-open {
  opacity: 0.9;
  visibility: visible;
  transition-delay: 0s;
}

/* search css start */
.search__popup {
  padding-top: 70px;
  padding-bottom: 100px;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 380px;
  background: rgba(0, 0, 0, 0.1803921569);
  backdrop-filter: blur(10px);
  z-index: 99;
  -webkit-transform: translateY(calc(-100% - 80px));
  -moz-transform: translateY(calc(-100% - 80px));
  -ms-transform: translateY(calc(-100% - 80px));
  -o-transform: translateY(calc(-100% - 80px));
  transform: translateY(calc(-100% - 80px));
  -webkit-transition: transform 0.6s ease-in-out, opacity 0.6s ease-in-out;
  -moz-transition: transform 0.6s ease-in-out, opacity 0.6s ease-in-out;
  transition: transform 0.6s ease-in-out, opacity 0.6s ease-in-out;
  transition-delay: 0.7s;
}
.search__popup.search-opened {
  -webkit-transform: translateY(0%);
  -moz-transform: translateY(0%);
  -ms-transform: translateY(0%);
  -o-transform: translateY(0%);
  transform: translateY(0%);
  transition-delay: 0s;
}
.search__popup.search-opened .search__input {
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -o-transform: translateY(0px);
  transform: translateY(0px);
  opacity: 1;
  transition-delay: 0.3s;
}
.search__popup.search-opened .search__input::after {
  width: 100%;
  transition-delay: 0.5s;
}
.search__popup-2 {
  background-color: var(--tp-common-black-13);
}
.search__popup-2 .search__input .search-input-field ~ .search-focus-border {
  background-color: var(--tp-theme-8);
}
.search__popup-3 .search__input .search-input-field ~ .search-focus-border {
  background-color: var(--tp-theme-10);
}
.search__top {
  margin-bottom: 80px;
}
.search__top .search__logo img {
  max-width: 160px;
}
.search__input {
  position: relative;
  height: 80px;
  -webkit-transform: translateY(-40px);
  -moz-transform: translateY(-40px);
  -ms-transform: translateY(-40px);
  -o-transform: translateY(-40px);
  transform: translateY(-40px);
  transition: all 0.3s ease-in-out;
  transition-delay: 0.5s;
  opacity: 0;
}
.search__input::after {
  position: absolute;
  content: "";
  left: 0;
  bottom: 0;
  width: 0%;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.3);
  transition-delay: 0.3s;
  transition: all 0.3s ease-in-out;
}
.search__input input {
  width: 100%;
  height: 100%;
  background-color: transparent;
  border: 0;
  outline: 0;
  font-size: 24px;
  color: var(--tp-common-white);
  border-bottom: 1px solid transparent;
  padding: 0;
  padding-right: 30px;
}
.search__input input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: rgba(255, 255, 255, 0.5);
  font-size: 24px;
}
.search__input input::-moz-placeholder { /* Firefox 19+ */
  color: rgba(255, 255, 255, 0.5);
  font-size: 24px;
}
.search__input input:-moz-placeholder { /* Firefox 4-18 */
  color: rgba(255, 255, 255, 0.5);
  font-size: 24px;
}
.search__input input:-ms-input-placeholder { /* IE 10+  Edge*/
  color: rgba(255, 255, 255, 0.5);
  font-size: 24px;
}
.search__input input::placeholder { /* MODERN BROWSER */
  color: rgba(255, 255, 255, 0.5);
  font-size: 24px;
}
.search__input button {
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 18px;
  color: var(--tp-common-white);
}
.search__input .search-input-field ~ .search-focus-border {
  position: absolute;
  bottom: 0;
  left: auto;
  right: 0;
  width: 0;
  height: 1px;
  background-color: var(--tp-common-white);
  -webkit-transition: all 0.5s ease-out 0s;
  -moz-transition: all 0.5s ease-out 0s;
  -ms-transition: all 0.5s ease-out 0s;
  -o-transition: all 0.5s ease-out 0s;
  transition: all 0.5s ease-out 0s;
}
.search__input .search-input-field:focus ~ .search-focus-border {
  width: 100%;
  left: 0;
  right: auto;
  -webkit-transition: all 0.5s ease-out 0s;
  -moz-transition: all 0.5s ease-out 0s;
  -ms-transition: all 0.5s ease-out 0s;
  -o-transition: all 0.5s ease-out 0s;
  transition: all 0.5s ease-out 0s;
}

.search__close-btn {
  font-size: 25px;
  color: rgba(255, 255, 255, 0.3);
}
.search__close-btn:hover {
  color: var(--tp-common-white);
}
.search__result-title {
  font-size: 50px;
  letter-spacing: -0.04em;
  margin-bottom: 0;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .search__result-title {
    font-size: 40px;
  }
}
@media (max-width: 575px) {
  .search__result-title {
    font-size: 35px;
  }
}
.search__result-title span {
  color: var(--tp-theme-primary);
  display: inline-block;
}
.search__result-content p {
  font-size: 16px;
  line-height: 1.62;
  color: var(--tp-text-1);
}
.search__result-input {
  position: relative;
}
.search__result-input-box {
  position: relative;
  margin-bottom: 20px;
}
.search__result-input-box button {
  position: absolute;
  top: 0;
  right: 0;
  padding: 22px 43px;
}
@media (max-width: 575px) {
  .search__result-input-box button {
    position: relative;
    margin-top: 15px;
  }
}
.search__result-input-box button:hover {
  background-color: var(--tp-common-black);
}
.search__result-input input {
  width: 100%;
  height: 70px;
  padding-left: 60px;
  padding-right: 177px;
  background-color: var(--tp-common-white);
  border: 1px solid var(--tp-common-white);
  box-shadow: -3px 0px 0px var(--tp-theme-1), 0px 1px 2px rgba(3, 4, 28, 0.14);
}
@media (max-width: 575px) {
  .search__result-input input {
    padding-right: 25px;
  }
}
.search__result-input span {
  position: absolute;
  top: 50%;
  left: 30px;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  font-size: 18px;
  color: #A0A0B5;
}
.search__result-input span svg {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  transform: translateY(-2px);
}
.search__result-tags a {
  display: inline-block;
  font-family: var(--tp-ff-space);
  font-size: 13px;
  font-weight: 500;
  border: 1px solid #D5D5DD;
  padding: 5px 18px;
  line-height: 1;
  margin-right: 2px;
  margin-bottom: 7px;
}
.search__result-tags a:hover {
  background-color: var(--tp-theme-primary);
  border-color: var(--tp-theme-primary);
  color: var(--tp-common-white);
}
.search__blog-item {
  padding: 50px 50px;
  border: 1px solid #EAEAEF;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .search__blog-item {
    padding: 30px 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .search__blog-item {
    padding: 25px;
  }
}
@media (max-width: 575px) {
  .search__blog-item {
    padding: 20px;
  }
}
.search__blog-title {
  font-size: 30px;
  line-height: 1.2;
  letter-spacing: -0.04em;
  margin-bottom: 13px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .search__blog-title {
    font-size: 28px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .search__blog-title {
    font-size: 21px;
  }
  .search__blog-title br {
    display: none;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .search__blog-title br {
    display: none;
  }
}
@media (max-width: 575px) {
  .search__blog-title {
    font-size: 25px;
  }
}
.search__blog-title a:hover {
  color: var(--tp-theme-primary);
}
.search__blog-tag {
  margin-bottom: 10px;
}
[dir=rtl] .search__blog-tag {
  margin-right: 0;
  margin-left: 15px;
}
.search__blog-tag a {
  display: inline-block;
  background-color: rgba(99, 100, 219, 0.06);
  font-family: var(--tp-ff-space);
  font-weight: 500;
  font-size: 15px;
  line-height: 1;
  color: var(--tp-common-purple);
  padding: 4px 12px;
}
.search__blog-tag a:hover {
  background-color: var(--tp-common-purple);
  color: var(--tp-common-white);
}
.search__blog-meta span {
  color: var(--tp-text-1);
  margin-right: 15px;
  margin-bottom: 10px;
  display: inline-block;
}
.search__blog-meta span i, .search__blog-meta span svg {
  margin-right: 2px;
}
[dir=rtl] .search__blog-meta span i, [dir=rtl] .search__blog-meta span svg {
  margin-right: 2px;
  margin-left: 2px;
}
.search__blog-meta span svg {
  -webkit-transform: translateY(-1px);
  -moz-transform: translateY(-1px);
  -ms-transform: translateY(-1px);
  -o-transform: translateY(-1px);
  transform: translateY(-1px);
}
.search__blog-meta span svg path {
  stroke: #7A7E83;
}
.search__blog-meta-author {
  margin-bottom: 10px;
}
[dir=rtl] .search__blog-meta-author {
  margin-right: 0;
  margin-left: 45px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .search__blog-meta-author {
    margin-right: 20px;
  }
  [dir=rtl] .search__blog-meta-author {
    margin-right: 0;
    margin-left: 20px;
  }
}
.search__blog-meta-author-thumb img {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  margin-right: 10px;
}
[dir=rtl] .search__blog-meta-author-thumb img {
  margin-right: 0;
  margin-left: 10px;
}
.search__blog-meta-author-content span {
  display: inline-block;
  font-family: var(--tp-ff-inter);
  font-size: 14px;
  color: #7A7E83;
}
.search__blog-meta-author-content span a {
  color: var(--tp-common-black-11);
  font-weight: 500;
}
.search__blog-meta-author-content span a:hover {
  color: var(--tp-theme-primary);
}
.search__blog-content p {
  font-size: 15px;
  line-height: 1.47;
  color: var(--tp-text-1);
  margin-bottom: 20px;
}
.search__blog-btn .tp-btn-border {
  padding: 8px 29px;
}
.search__blog-btn .tp-btn-border svg, .search__blog-btn .tp-btn-border i {
  margin-left: 5px;
}
[dir=rtl] .search__blog-btn .tp-btn-border svg, [dir=rtl] .search__blog-btn .tp-btn-border i {
  margin-left: 5px;
  margin-right: 5px;
}
.search__blog-btn .tp-btn-border svg {
  -webkit-transform: translateY(-1px);
  -moz-transform: translateY(-1px);
  -ms-transform: translateY(-1px);
  -o-transform: translateY(-1px);
  transform: translateY(-1px);
}
.search__blog-btn .tp-btn-border:hover {
  background-color: var(--tp-theme-primary);
  border-color: var(--tp-theme-primary);
  color: var(--tp-common-white);
}

/* HEADER CSS */
/*----------------------------------------*/
/*  4.2 Meanmenu css
/*----------------------------------------*/
.tp-main-menu ul li {
  list-style: none;
  position: relative;
  display: inline-block;
  font-weight: 700;
  font-size: 16px;
  color: var(--tp-common-white);
  transition: 0.3s ease;
}
.tp-main-menu ul li.has-dropdown > a {
  position: relative;
}
.tp-main-menu ul li.has-dropdown > a::after {
  content: "\f107";
  -webkit-transform: translateY(1px);
  -moz-transform: translateY(1px);
  -ms-transform: translateY(1px);
  -o-transform: translateY(1px);
  transform: translateY(1px);
  font-size: 16px;
  color: var(--tp-common-white);
  font-family: var(--tp-ff-fontawesome);
  font-weight: 400;
  margin-left: 5px;
  display: inline-block;
  transition: all 0.2s ease-in-out;
}
.tp-main-menu ul li a {
  position: relative;
  padding: 43px 20px;
  display: inline-block;
  transition: 0.3s ease;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.14em;
}
@media only screen and (min-width: 1700px) and (max-width: 1899px) {
  .tp-main-menu ul li a {
    padding: 42px 15px;
  }
}
@media only screen and (min-width: 1600px) and (max-width: 1699px) {
  .tp-main-menu ul li a {
    padding: 40px 10px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-main-menu ul li a {
    padding: 40px 12px;
  }
}
.tp-main-menu ul li a::before {
  position: absolute;
  content: "";
  left: auto;
  right: 0;
  bottom: 0;
  width: 0%;
  height: 2px;
  background-image: linear-gradient(90deg, #9EFBD3 0%, #57E9F2 48%, #45D4FB 100%);
  z-index: 1;
  transition: width 0.3s ease-in-out;
}
.tp-main-menu ul li .submenu {
  position: absolute;
  top: 100%;
  left: 0px;
  min-width: 270px;
  background: #fff;
  z-index: 99;
  visibility: hidden;
  opacity: 0;
  transform: scaleY(0);
  transform-origin: top center;
  box-shadow: 0px 30px 70px 0px rgba(11, 6, 70, 0.08);
  padding: 10px 0;
  transform-origin: top center;
}
.tp-main-menu ul li .submenu li {
  display: block;
  width: 100%;
  margin: 0;
}
.tp-main-menu ul li .submenu li a {
  padding: 5px 25px;
  font-size: 14px;
  position: relative;
  z-index: 1;
  color: var(--tp-common-white);
  width: 100%;
  transition: 0.3s;
  border: 0;
  text-transform: capitalize;
  color: #031753;
  letter-spacing: 0;
}
.tp-main-menu ul li .submenu li a::before {
  display: none;
}
.tp-main-menu ul li .submenu li.has-dropdown > a {
  display: block;
}
.tp-main-menu ul li .submenu li.has-dropdown > a::after {
  color: #031753;
  float: right;
  -webkit-transform: translateY(1px) rotate(-90deg);
  -moz-transform: translateY(1px) rotate(-90deg);
  -ms-transform: translateY(1px) rotate(-90deg);
  -o-transform: translateY(1px) rotate(-90deg);
  transform: translateY(1px) rotate(-90deg);
}
.tp-main-menu ul li .submenu li .submenu {
  left: 120%;
  top: 0;
  visibility: hidden;
  opacity: 0;
}
.tp-main-menu ul li .submenu li:hover.has-dropdown > a::after {
  color: var(--tp-theme-primary);
}
.tp-main-menu ul li .submenu li:hover > a {
  color: var(--tp-theme-primary);
  padding-left: 30px;
}
.tp-main-menu ul li .submenu li:hover > .submenu {
  left: 100%;
  visibility: visible;
  opacity: 1;
}
.tp-main-menu ul li:hover > a {
  background: rgba(255, 255, 255, 0.05);
}
.tp-main-menu ul li:hover > a::before {
  width: 100%;
  right: auto;
  left: 0;
}
.tp-main-menu ul li:hover .submenu {
  transform: scaleY(1);
  top: 100%;
  visibility: visible;
  opacity: 1;
}
.tp-main-menu.home-2 ul li a::before {
  background-image: none;
  background-color: #FF3A8A;
}
.tp-main-menu.home-2 ul li .submenu li.has-dropdown:hover > a {
  color: #FF3A8A;
}
.tp-main-menu.home-2 ul li .submenu li.has-dropdown:hover > a::after {
  color: #FF3A8A;
}
.tp-main-menu.home-2 ul li .submenu li:hover > a {
  color: #FF3A8A;
}
.tp-main-menu.home-2 ul li .submenu li:hover > a::after {
  color: #FF3A8A;
}
.tp-main-menu.home-3 {
  padding-left: 40px;
}
@media only screen and (min-width: 1600px) and (max-width: 1699px) {
  .tp-main-menu.home-3 {
    padding-left: 25px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-main-menu.home-3 {
    padding-left: 15px;
  }
}
.tp-main-menu.home-3 ul li {
  color: #161616;
}
.tp-main-menu.home-3 ul li.has-dropdown > a::after {
  color: #161616;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-main-menu.home-3 ul li a {
    padding: 50px 24px;
  }
}

/*----------------------------------------*/
/*  4.1 Main menu css
/*----------------------------------------*/
.mean-container a.meanmenu-reveal {
  display: none !important;
}
.mean-container .mean-nav {
  background: none;
  margin-top: 0;
  margin-bottom: 15px;
}
.mean-container .mean-nav > ul {
  padding: 0;
  margin: 0;
  width: 100%;
  list-style-type: none;
  display: block !important;
}
.mean-container .mean-nav > ul > li:first-child > a {
  border-top: 0;
}
.mean-container .mean-nav > ul > li:first-child > a:hover {
  background: none;
  color: #00a8ff;
}
.mean-container .mean-nav ul li.dropdown-opened > a {
  color: var(--tp-common-white);
}
.mean-container .mean-nav ul li a {
  width: 100%;
  padding: 10px 0;
  color: var(--tp-common-white);
  font-size: 14px;
  line-height: 1.5;
  font-weight: 700;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.mean-container .mean-nav ul li a:hover {
  background: none;
  color: #00a8ff;
}
.mean-container .mean-nav ul li a.mean-expand {
  margin-top: 5px;
  padding: 0 !important;
  border: 1px solid rgba(255, 255, 255, 0.1);
  height: 30px;
  width: 30px;
  line-height: 28px;
  top: 0;
  font-weight: 400;
  transition: 0.2s ease;
}
.mean-container .mean-nav ul li a.mean-expand:hover {
  background: #00a8ff;
  color: var(--tp-common-white);
}
.mean-container .mean-nav ul li a.mean-expand.mean-clicked {
  background: #00a8ff;
  color: var(--tp-common-white);
}
.mean-container .mean-nav ul li a.mean-expand.mean-clicked i {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  color: var(--tp-common-white);
}
.mean-container .mean-nav ul li > a > i {
  display: none;
}
.mean-container .mean-nav ul li > a .mean-expand i {
  display: inline-block;
}
.mean-container .mean-bar {
  padding: 0;
  min-height: auto;
  background: none;
  margin-bottom: 40px;
}

.mean-container .mean-nav ul li li a {
  width: 80%;
  padding: 10px 10%;
  text-shadow: none !important;
  visibility: visible;
}

.mean-container .mean-nav ul li.mean-last a {
  border-bottom: none;
  margin-bottom: 0;
}

.mean-container .mean-nav ul li li li a {
  width: 70%;
  padding: 10px 15%;
}

.mean-container .mean-nav ul li li li li a {
  width: 60%;
  padding: 10px 20%;
}

.mean-container .mean-nav ul li li li li li a {
  width: 50%;
  padding: 10px 25%;
}

/*----------------------------------------*/
/*  5.1 blog details css
/*----------------------------------------*/
.tp-blog-details-thumb img {
  max-width: 100%;
  border-radius: 20px;
}
.tp-blog-details-content {
  padding-right: 44px;
  padding-left: 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), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-details-content {
    padding-right: 0;
    padding-left: 0;
  }
}
.tp-blog-details-content .tp-read-blog-info.tp-blog-details span {
  margin-right: 80px;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-blog-details-content .tp-read-blog-info.tp-blog-details span {
    margin-right: 60px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-details-content .tp-read-blog-info.tp-blog-details span {
    margin-bottom: 5px;
  }
}
.tp-blog-details-content .tp-read-blog-info.tp-blog-details span i {
  margin-right: 5px;
}
.tp-blog-details-content h3 {
  font-weight: 600;
  font-size: 45px;
  line-height: 1.3;
  letter-spacing: -0.02em;
  color: #000D44;
  margin-bottom: 25px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-blog-details-content h3 {
    font-size: 38px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-blog-details-content h3 {
    font-size: 35px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-details-content h3 {
    font-size: 32px;
  }
}
.tp-blog-details-content .p1 {
  margin-bottom: 25px;
}
.tp-blog-details-content .p3 {
  margin-bottom: 40px;
}
.tp-blog-details-content .p4 {
  margin-bottom: 40px;
}
.tp-blog-details-quote {
  background: #F8F8F8;
  border-radius: 15px;
  padding: 35px 60px 25px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-blog-details-quote {
    padding: 35px 45px 25px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-details-quote {
    padding: 20px;
  }
}
.tp-blog-details-quote-thumb {
  margin-bottom: 10px;
}
.tp-blog-details-quote p {
  font-weight: 500;
  font-size: 22px;
  letter-spacing: -0.02em;
  color: #000D44;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-details-tagcloud {
    margin-bottom: 15px;
  }
}
.tp-blog-details-tagcloud span {
  font-weight: 700;
  font-size: 14px;
  line-height: 10px;
  color: #000D44;
  margin-right: 10px;
}
.tp-blog-details-tagcloud a {
  position: relative;
  background: var(--tp-common-white);
  border: 1px solid #EAEAEF;
  border-radius: 5px;
  font-weight: 500;
  font-size: 13px;
  line-height: 10px;
  display: inline-block;
  color: #000D44;
  padding: 9px 14px;
  margin-right: 5px;
  z-index: 1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-details-tagcloud a {
    margin-bottom: 5px;
  }
}
.tp-blog-details-tagcloud a:hover {
  color: var(--tp-common-white);
}
.tp-blog-details-tagcloud a:hover::before {
  opacity: 1;
  visibility: visible;
  border: var(--tp-common-white);
}
.tp-blog-details-tagcloud a::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  border-radius: 5px;
  opacity: 0;
  visibility: hidden;
  z-index: -1;
  transition: 0.3s ease;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-details-postbox__share {
    margin-top: 10px;
  }
}
.tp-blog-details-postbox__share span {
  font-weight: 700;
  font-size: 14px;
  line-height: 10px;
  color: #000D44;
  margin-right: 10px;
}
.tp-blog-details-postbox__share a {
  position: relative;
  display: inline-block;
  background: var(--tp-common-white);
  border: 1px solid #EAEAEF;
  border-radius: 5px;
  height: 36px;
  width: 36px;
  line-height: 2.5;
  text-align: center;
  color: #525258;
  font-size: 13px;
  z-index: 1;
  margin-right: 2px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-blog-details-postbox__share a {
    margin-bottom: 5px;
  }
}
.tp-blog-details-postbox__share a:hover {
  color: var(--tp-common-white);
}
.tp-blog-details-postbox__share a:hover::before {
  opacity: 1;
}
.tp-blog-details-postbox__share a::before {
  position: absolute;
  content: "";
  width: 100%;
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  top: 0;
  left: 0;
  height: 100%;
  border-radius: 5px;
  opacity: 0;
  color: var(--tp-common-white);
  transition: 0.3s ease;
  z-index: -1;
}
.tp-blog-details-comment {
  margin-top: 35px;
  margin-bottom: 80px;
}
.tp-blog-details-comment-thumb img {
  border-radius: 82px;
  margin-right: 23px;
  margin-top: -5px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-details-comment-thumb img {
    margin-bottom: 30px;
  }
}
.tp-blog-details-comment-wrapper {
  background: #F8F8F8;
  border-radius: 15px;
  padding: 37px 82px 40px 34px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-blog-details-comment-wrapper {
    padding: 37px 40px 40px 34px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-details-comment-wrapper {
    padding: 30px;
    flex-wrap: wrap;
  }
}
.tp-blog-details-comment-content h5 {
  font-weight: 600;
  font-size: 18px;
  line-height: 14px;
  color: #000D44;
  margin-bottom: 10px;
}
.tp-blog-details-comment-content p {
  font-size: 15px;
  margin-bottom: 25px;
}
.tp-blog-details-text-wrapper {
  padding-right: 60px;
  padding-left: 18px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-details-text-wrapper {
    padding-right: 0;
    padding-left: 0;
  }
}
.tp-blog-details-text-wrapper h3 {
  font-weight: 600;
  font-size: 28px;
  letter-spacing: -0.02em;
  color: #000D44;
  margin-bottom: 22px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-details-text-wrapper h3 {
    font-size: 27px;
  }
}
.tp-blog-details-reply {
  padding-left: 20px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-details-reply {
    padding-left: 0;
  }
}
.tp-blog-details-reply h3 {
  font-weight: 600;
  letter-spacing: -0.02em;
  margin-bottom: 44px;
}
.tp-blog-details-reply ul li {
  list-style: none;
}
.tp-blog-details-reply-wrapper {
  margin-bottom: 43px;
  border-bottom: 1px solid #EAEAEF;
  padding-bottom: 25px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-details-reply-wrapper {
    flex-wrap: wrap;
  }
}
.tp-blog-details-reply-thumb img {
  width: 80px;
  border-radius: 80px;
  margin-right: 24px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-details-reply-thumb img {
    margin-bottom: 20px;
  }
}
.tp-blog-details-reply-content span {
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.02em;
  margin-bottom: 10px;
  display: block;
}
.tp-blog-details-reply-content h3 {
  font-weight: 500;
  font-size: 20px;
  line-height: 14px;
  color: #000000;
  margin-bottom: 13px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-details-reply-content p br {
    display: none;
  }
}
.tp-blog-details-reply-content .reply a {
  border-radius: 69px;
}
.tp-blog-details-reply-content .reply a::before {
  border-radius: 69px;
}

.tp-bolg-details-contact h3 {
  margin-bottom: 35px;
}

.tp-read-blog-active .slick-list {
  margin-bottom: -26px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-read-blog-active .slick-list {
    margin-bottom: 0;
  }
}

/*----------------------------------------*/
/*  5.3 Sidebar css
/*----------------------------------------*/
.tp-read-blog__search-box {
  background: var(--tp-common-white);
  border: 1px solid #F7F7F7;
  box-shadow: 0px 12px 10px rgba(238, 239, 240, 0.25);
  border-radius: 10px;
  padding: 35px 30px;
}
.tp-read-blog__search-box h3 {
  font-weight: 600;
  font-size: 22px;
  letter-spacing: -0.02em;
  color: #000D44;
  margin-bottom: 20px;
}
.tp-read-blog__search-box .search-form input {
  height: 61px;
  width: 100%;
  padding: 20px;
  padding-right: 50px;
  background: #F8F8F8;
  border: 1px solid #F2F4F6;
  border-radius: 10px;
}
.tp-read-blog__search-box .search-form input:focus {
  border-color: #162DE4;
}
.tp-read-blog__search-box .search-form input:focus::placeholder {
  opacity: 0;
}
.tp-read-blog__search-box .search-form input::placeholder {
  font-weight: 500;
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #6A6A74;
}
.tp-read-blog__search-box .search-form button {
  position: absolute;
  right: 30px;
  top: 18px;
  font-weight: 400;
  font-size: 14px;
  color: #030A39;
}

.blog-details__search-box {
  background: #F6F6F4;
  border: 1px solid #F2F5FA;
  padding: 40px 30px;
  border-radius: 10px;
}
.blog-details__search-box h3 {
  font-weight: 800;
  font-size: 20px;
  margin-bottom: 20px;
}
.blog-details__search-box .search-form input {
  height: 61px;
  width: 100%;
  background: var(--tp-common-white);
  border: 1px solid #F2F4F6;
  padding: 20px;
  padding-right: 50px;
}
.blog-details__search-box .search-form input:focus {
  border-color: #EB9309;
}
.blog-details__search-box .search-form input::placeholder {
  font-weight: 500;
  font-size: 12px;
  text-transform: uppercase;
  color: #8A879F;
}
.blog-details__search-box .search-form button {
  position: absolute;
  right: 30px;
  top: 18px;
  font-weight: 400;
  font-size: 14px;
  color: #030A39;
}

@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-blog-right-wrapper {
    padding-left: 0;
    margin-top: 30px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-blog-details-area .left {
    padding-bottom: 40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .blog-details-items {
    padding-bottom: 40px;
  }
}

.sidebar__widget {
  background: var(--tp-common-white);
  border: 1px solid #F7F7F7;
  box-shadow: 0px 12px 10px rgba(238, 239, 240, 0.25);
  border-radius: 10px;
  padding: 33px 35px 25px 28px;
}
.sidebar__widget-title {
  font-weight: 600;
  font-size: 22px;
  letter-spacing: -0.02em;
  color: #000D44;
  margin-bottom: 20px;
}

.sidebar-pages {
  background: var(--tp-common-white);
  box-shadow: 0px 12px 10px rgba(238, 239, 240, 0.25);
  border-radius: 10px;
  padding: 34px 30px 30px 30px;
}
.sidebar-pages ul li {
  list-style: none;
  margin-bottom: 16px;
  cursor: pointer;
}
.sidebar-pages ul li:hover a, .sidebar-pages ul li:hover span {
  color: #162DE4;
}
.sidebar-pages ul li:last-child {
  margin-bottom: 0;
}
.sidebar-pages ul li a {
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #727885;
}
.sidebar-pages ul li a span {
  font-weight: 400;
  font-size: 16px;
  color: #727885;
  float: right;
  margin-top: 3px;
}

.rc__post-thumb {
  overflow: hidden;
  border-radius: 10px;
  flex: 0 0 auto;
}
.rc__post-thumb img {
  border-radius: 10px;
  margin-right: 25px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .rc__post-thumb img {
    margin-right: 20px;
  }
}
.rc__post-content span {
  font-weight: 500;
  font-size: 12px;
  text-transform: uppercase;
  color: #727885;
  display: block;
  margin-bottom: 5px;
}
.rc__post-title {
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
  color: #000D44;
  font-family: var(--tp-ff-body);
}
@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), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .rc__post-title a br {
    display: none;
  }
}
.rc__post-title a:hover {
  color: #162DE4;
}

@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), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-left-box {
    padding-left: 0;
  }
}

.sidebar__post {
  margin-bottom: 20px;
}

.side__tagcloud {
  margin-top: 30px;
}
.side__tagcloud a {
  background: var(--tp-common-white);
  border: 1px solid #F2F4F6;
  border-radius: 5px;
  padding: 2px 22px;
  margin-bottom: 10px;
  display: inline-block;
  text-transform: uppercase;
  margin-right: 10px;
  font-weight: 700;
  font-size: 12px;
  line-height: 30px;
  text-align: center;
  color: #8A879F;
  transition: 0.3s;
}
.side__tagcloud a:hover {
  background: #162DE4;
  border: 1px solid rgba(0, 0, 0, 0.06);
  box-shadow: 0px 4px 7px rgba(205, 205, 205, 0.24);
  border-radius: 5px;
  color: var(--tp-common-white);
}

.tp-blog-play a {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: 90px;
  width: 90px;
  line-height: 90px;
  border-radius: 50%;
  display: inline-block;
  text-align: center;
  font-weight: 900;
  font-size: 24px;
  color: #162DE4;
  background: linear-gradient(164.71deg, #FFFFFF 8.83%, #EAEAEF 128.86%);
  box-shadow: 0px 0px 50px rgba(3, 4, 28, 0.1);
  z-index: 2;
  animation: pulse 2s infinite;
}

.tp-read-blog-items {
  border-radius: 20px;
}
.tp-read-blog-thumb img {
  width: 100%;
  border-radius: 20px 20px 0 0;
}
.tp-read-blog-content {
  background: var(--tp-common-white);
  border: 1px solid #F7F7F7;
  border-radius: 0 0 20px 20px;
  padding: 40px 50px 30px 45px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-read-blog-content {
    padding: 30px 20px 30px 20px;
  }
}
.tp-read-blog-content .tp-read-blog-title a {
  font-weight: 600;
  font-size: 30px;
  letter-spacing: -0.02em;
  color: #000D44;
  line-height: 1.4;
  margin-bottom: 12px;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-read-blog-content .tp-read-blog-title a {
    font-size: 28px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-read-blog-content .tp-read-blog-title a {
    font-size: 25px;
  }
}
.tp-read-blog-content .tp-read-blog-title a:hover {
  color: #162DE4;
}
.tp-read-blog-content p {
  font-weight: 400;
  font-size: 18px;
  line-height: 29px;
  color: #727885;
  margin-bottom: 30px;
}
.tp-read-blog-content .tp-read-blog__btn .tp-btn {
  padding: 15px 30px;
  background: #162DE4;
  box-shadow: none;
}
.tp-read-blog-content .tp-read-blog__btn .tp-btn:hover {
  box-shadow: 0px 4px 15px rgba(76, 126, 243, 0.4);
}
.tp-read-blog-info {
  margin-bottom: 24px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-read-blog-info {
    margin-bottom: 20px;
  }
}
.tp-read-blog-info span {
  font-weight: 600;
  font-size: 14px;
  text-transform: uppercase;
  color: #727885;
  margin-right: 30px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-read-blog-info span {
    margin-bottom: 4px;
  }
}
.tp-read-blog-info span i {
  color: #162DE4;
  margin-right: 2px;
}
.tp-read-blog-pagination .page-item {
  margin: 0 5px;
}
.tp-read-blog-pagination .page-item.active .page-link {
  background: #162DE4;
  border-radius: 5px;
  border: none;
}
.tp-read-blog-pagination ul li a:hover {
  color: var(--tp-common-white);
  background: #162DE4;
  border-color: #162DE4;
}
.tp-read-blog-pagination .page-link {
  position: relative;
  background: var(--tp-common-white);
  border: 1px solid #F5F5F5;
  border-radius: 5px;
  height: 49px;
  width: 49px;
  line-height: 2.4;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: 0.02em;
  color: #292930;
  display: block;
  text-align: center;
  box-shadow: none;
  transition: 0.3s ease;
  z-index: 1;
}

/*----------------------------------------*/
/*  6.1 Footer Style 1
/*----------------------------------------*/
.footer-bg-1 {
  background-color: #000D44;
}

@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-footer-area {
    padding-top: 90px;
  }
}
.tp-footer-social-1 a {
  background: rgba(255, 255, 255, 0.04);
  border-radius: 27.5px;
  height: 48px;
  width: 48px;
  display: inline-block;
  text-align: center;
  margin-right: 15px;
  line-height: 48px;
  transition: all 0.3s ease;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-footer-social-1 a {
    margin-right: 12px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-social-1 a {
    margin-right: 2px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-footer-social-1 a {
    margin-right: 8px;
  }
}
.tp-footer-social-1 a:hover {
  color: var(--tp-common-white);
}
.tp-footer-social-1 a:hover::before {
  opacity: 1;
}
.tp-footer-social-1 a::before {
  position: absolute;
  content: "";
  width: 100%;
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  top: 0;
  left: 0;
  border-radius: 50%;
  height: 100%;
  opacity: 0;
  color: var(--tp-common-white);
  transition: 0.3s ease;
  z-index: -1;
}
.tp-footer-social-1 i {
  font-weight: 400;
  font-size: 15px;
  color: var(--tp-common-white);
}
.tp-footer-subscribe-input {
  margin-top: 70px;
}
@media (max-width: 575px) {
  .tp-footer-subscribe-input {
    margin-top: 30px;
  }
}
.tp-footer-subscribe-input input {
  width: 100%;
  height: 60px;
  background: #1E277D;
  border: 1px solid #3359C9;
  border-radius: 55px;
  padding-right: 80px;
}
.tp-footer-subscribe-input input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #9FA4CD;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input input::-webkit-input-placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input input::-moz-placeholder { /* Firefox 19+ */
  color: #9FA4CD;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input input::-moz-placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input input:-moz-placeholder { /* Firefox 4-18 */
  color: #9FA4CD;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input input:-moz-placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input input:-ms-input-placeholder { /* IE 10+  Edge*/
  color: #9FA4CD;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input input:-ms-input-placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input input::placeholder { /* MODERN BROWSER */
  color: #9FA4CD;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input input::placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input input:focus {
  color: var(--tp-common-white);
}
.tp-footer-subscribe-input .tp-footer-btn {
  position: absolute;
  right: 1px;
  top: 1px;
  padding: 16px 22px;
  text-transform: uppercase;
  border-radius: 50%;
  background: #FF3A8A;
  font-weight: 900;
  font-size: 18px;
  color: #fff;
  display: inline-block;
}
.tp-footer-subscribe-input-1 {
  margin-top: 70px;
}
@media (max-width: 575px) {
  .tp-footer-subscribe-input-1 {
    margin-top: 30px;
  }
}
.tp-footer-subscribe-input-1 input {
  width: 100%;
  height: 60px;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 55px;
  padding-right: 80px;
}
.tp-footer-subscribe-input-1 input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #B9BAC0;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input-1 input::-webkit-input-placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input-1 input::-moz-placeholder { /* Firefox 19+ */
  color: #B9BAC0;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input-1 input::-moz-placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input-1 input:-moz-placeholder { /* Firefox 4-18 */
  color: #B9BAC0;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input-1 input:-moz-placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input-1 input:-ms-input-placeholder { /* IE 10+  Edge*/
  color: #B9BAC0;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input-1 input:-ms-input-placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input-1 input::placeholder { /* MODERN BROWSER */
  color: #B9BAC0;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input-1 input::placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input-1 input:focus {
  color: var(--tp-common-white);
}
.tp-footer-subscribe-input-1 input:focus::placeholder {
  opacity: 0;
}
.tp-footer-subscribe-input-1 .tp-footer-btn {
  position: absolute;
  right: 1px;
  top: 1px;
  padding: 16px 22px;
  text-transform: uppercase;
  border-radius: 50%;
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  font-weight: 900;
  font-size: 18px;
  color: #fff;
  display: inline-block;
}
.tp-footer-top-widget-1 {
  padding-bottom: 55px;
  margin-bottom: 30px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.13);
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-footer-top-widget-1 {
    padding-bottom: 20px;
  }
}
.tp-footer-top-widget-1 .tp-space-col-2 {
  padding-left: 57px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-footer-top-widget-1 .tp-space-col-2 {
    padding-left: 49px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-footer-top-widget-1 .tp-space-col-2 {
    padding-left: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-footer-top-widget-1 .tp-space-col-2 {
    padding-left: 10px;
  }
}
.tp-footer-top-widget-1 .tp-space-col-3 {
  padding-left: 86px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-footer-top-widget-1 .tp-space-col-3 {
    padding-left: 71px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-top-widget-1 .tp-space-col-3 {
    padding-left: 25px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-footer-top-widget-1 .tp-space-col-3 {
    padding-left: 0;
  }
}
.tp-footer-top-widget-1 .tp-space-col-4 {
  padding-left: 88px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-footer-top-widget-1 .tp-space-col-4 {
    padding-left: 50px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-footer-top-widget-1 .tp-space-col-4 {
    padding-left: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-footer-top-widget-1 .tp-space-col-4 {
    padding-left: 10px;
  }
}

.tp-footer-bg {
  position: absolute;
  height: 100%;
  width: 100%;
  bottom: 0;
  left: 0;
  background-size: cover;
  background-repeat: no-repeat;
  z-index: -1;
}
.tp-footer-bg::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: #000D44;
  opacity: 0.7;
}
.tp-footer-widget {
  position: relative;
  z-index: 2;
}
.tp-footer-widget__title {
  font-weight: 700;
  font-size: 16px;
  line-height: 20px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--tp-common-white);
  margin-bottom: 30px;
  display: block;
}
.tp-footer-widget li {
  list-style: none;
  font-size: 14px;
  line-height: 18px;
  color: var(--tp-common-white);
  margin-bottom: 15px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-list-item {
    margin-bottom: 15px;
  }
}
.tp-footer-list-icon {
  margin-right: 10px;
}
.tp-footer-list-icon span {
  color: var(--tp-common-white);
  height: 24px;
  width: 24px;
  display: inline-block;
}
.tp-footer-list-content p {
  font-size: 14px;
  line-height: 18px;
  color: #BCC4DB;
  margin-bottom: 0;
}
.tp-footer-col-2 {
  margin-left: 38px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-footer-col-2 {
    margin-left: 0;
  }
}
.tp-footer-col-4 {
  margin-left: 32px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-footer-col-4 {
    margin-left: 0px;
  }
}
.tp-footer-col-5 {
  margin-left: 48px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-footer-col-5 {
    margin-left: 0;
  }
}
.tp-footer-subscribe-content {
  width: 100%;
  height: 100%;
  background: #000D44;
  border-radius: 5px;
  padding: 20px 40px;
  position: relative;
}
@media (max-width: 575px) {
  .tp-footer-subscribe-content {
    padding: 20px;
  }
}
.tp-footer-subscribe-content::after {
  position: absolute;
  content: "";
  left: -1px;
  top: -1px;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  background-image: var(--tp-gradient-primary);
  z-index: -1;
  border-radius: 5px;
}
.tp-footer-subscribe-content h3 {
  font-family: "Outfit";
  font-weight: 600;
  font-size: 35px;
  line-height: 67px;
  color: #FFFFFF;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-footer-subscribe-content h3 {
    display: none;
  }
}
.tp-footer-subscribe-content h3 span {
  font-weight: 200;
}
.tp-footer-subscribe-content input {
  width: 537px;
  height: 60px;
  background: #182560;
  box-shadow: 0px 14px 15px rgba(35, 33, 142, 0.04);
  border-radius: 5px;
  border: none;
  padding-left: 25px;
  padding-right: 245px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-footer-subscribe-content input {
    width: 120%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-footer-subscribe-content input {
    width: 440px;
    padding-right: 220px;
  }
}
@media (max-width: 575px) {
  .tp-footer-subscribe-content input {
    padding-right: 25px;
    width: 100%;
  }
}
.tp-footer-subscribe-content input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: var(--tp-common-white);
  font-weight: 400;
  font-size: 14px;
}
.tp-footer-subscribe-content input::-moz-placeholder { /* Firefox 19+ */
  color: var(--tp-common-white);
  font-weight: 400;
  font-size: 14px;
}
.tp-footer-subscribe-content input:-moz-placeholder { /* Firefox 4-18 */
  color: var(--tp-common-white);
  font-weight: 400;
  font-size: 14px;
}
.tp-footer-subscribe-content input:-ms-input-placeholder { /* IE 10+  Edge*/
  color: var(--tp-common-white);
  font-weight: 400;
  font-size: 14px;
}
.tp-footer-subscribe-content input::placeholder { /* MODERN BROWSER */
  color: var(--tp-common-white);
  font-weight: 400;
  font-size: 14px;
}
.tp-footer-subscribe-content input:focus {
  color: var(--tp-common-white);
}
.tp-footer-subscribe-content button {
  position: absolute;
  right: 0px;
  padding: 17px 50px;
  text-transform: uppercase;
  font-family: "Outfit";
  border-radius: 5px;
  box-shadow: none;
}
.tp-footer-subscribe-content button:hover i {
  animation: tp_arrow 0.2s linear;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-footer-subscribe-content button {
    top: 0;
    right: -120px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 398px) and (max-width: 575px) {
  .tp-footer-subscribe-content button {
    padding: 17px 35px;
  }
}
@media (max-width: 575px) {
  .tp-footer-subscribe-content button {
    position: static;
    margin-top: 10px;
    padding: 16px 30px;
  }
}
.tp-footer-copyright-inner p {
  font-size: 16px;
  line-height: 18px;
  color: #FFFFFF;
  margin-bottom: 0;
}
.tp-footer-copyright-link a {
  font-size: 16px;
  line-height: 18px;
  color: #FFFFFF;
  margin-left: 48px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-copyright-link a {
    margin-left: 35px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-footer-copyright-link a {
    margin-left: 0px;
    margin-right: 20px;
  }
}
.tp-footer-shape {
  position: absolute;
  top: -69px;
  left: 0px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-footer-shape {
    top: -20px;
  }
}
.tp-footer-shape img {
  width: 100%;
}

/*----------------------------------------*/
/*  6.2 Footer Style 2
/*----------------------------------------*/
.tp-footer-area-2 {
  overflow: hidden;
  background: #2D1877;
  z-index: 1;
  position: relative;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-footer-area-2 {
    padding-top: 100px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-footer-area-2 {
    padding-top: 60px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-footer-area-3 {
    padding-top: 60px;
  }
}
.tp-footer-widget-2 p {
  font-weight: 400;
  font-size: 15px;
  line-height: 26px;
  color: #A8BBFF;
  margin-bottom: 32px;
}
.tp-footer-widget-2 .tp-footer-widget__title {
  font-family: var(--tp-ff-heading);
  font-weight: 700;
  font-size: 18px;
  line-height: 28px;
  color: var(--tp-common-white);
  letter-spacing: 0;
  text-transform: none;
  margin-bottom: 26px;
  display: block;
}
.tp-footer-widget-2 li {
  list-style: none;
}
.tp-footer-widget-2 li a {
  font-weight: 500;
  font-size: 14px;
  line-height: 31px;
  color: #A8BBFF;
  background-image: linear-gradient(#fcfcff, #d8d8da), linear-gradient(#ffffff, #dbdbe6);
  background-size: 0% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.4s linear;
  transition: 0.3s ease;
}
.tp-footer-widget-2 li a:hover {
  color: var(--tp-common-white);
  background-size: 0 1px, 100% 1px;
}
.tp-footer-widget-3 p {
  color: #B9BAC0;
  font-weight: 400;
  font-size: 15px;
  line-height: 26px;
  margin-bottom: 32px;
}
.tp-footer-widget-3 .tp-footer-widget__title {
  font-family: var(--tp-ff-heading);
  font-weight: 700;
  font-size: 18px;
  line-height: 28px;
  color: var(--tp-common-white);
  letter-spacing: 0;
  text-transform: none;
  margin-bottom: 26px;
  display: block;
}
.tp-footer-widget-3 li {
  list-style: none;
}
.tp-footer-widget-3 li a {
  font-weight: 500;
  font-size: 14px;
  line-height: 31px;
  color: #B9BAC0;
  background-image: linear-gradient(#fcfcff, #d8d8da), linear-gradient(#ffffff, #dbdbe6);
  background-size: 0% 1px, 0 1px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.4s linear;
  transition: 0.3s ease;
}
.tp-footer-widget-3 li a:hover {
  color: var(--tp-common-white);
  background-size: 0 1px, 100% 1px;
}
.tp-footer-logo {
  margin-bottom: 35px;
}
.tp-footer-logo img {
  max-width: 160px;
}
.tp-footer-social a {
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 50%;
  height: 48px;
  width: 48px;
  display: inline-block;
  text-align: center;
  margin-right: 15px;
  line-height: 46px;
  transition: all 0.3s ease;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-footer-social a {
    margin-right: 12px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-social a {
    margin-right: 2px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-footer-social a {
    margin-right: 8px;
  }
}
.tp-footer-social a:hover {
  background: #34B2F3;
  border: 1px solid rgba(255, 255, 255, 0.06);
}
.tp-footer-social a:hover i {
  color: var(--tp-common-white);
}
.tp-footer-social i {
  font-weight: 400;
  font-size: 15px;
  color: #BBC2CC;
}
.tp-footer-social-3 a {
  background: #161616;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 27.5px;
  height: 48px;
  width: 48px;
  display: inline-block;
  text-align: center;
  margin-right: 15px;
  line-height: 48px;
  transition: all 0.3s ease;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-footer-social-3 a {
    margin-right: 12px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-social-3 a {
    margin-right: 2px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-footer-social-3 a {
    margin-right: 8px;
  }
}
.tp-footer-social-3 a:hover {
  color: var(--tp-common-white);
}
.tp-footer-social-3 a:hover::before {
  opacity: 1;
}
.tp-footer-social-3 a::before {
  position: absolute;
  content: "";
  width: 100%;
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  top: 0;
  left: 0;
  border-radius: 50%;
  height: 100%;
  opacity: 0;
  color: var(--tp-common-white);
  transition: 0.3s ease;
  z-index: -1;
}
.tp-footer-social-3 i {
  font-weight: 400;
  font-size: 15px;
  color: var(--tp-common-white);
}
.tp-footer-subscribe-input {
  margin-top: 70px;
}
@media (max-width: 575px) {
  .tp-footer-subscribe-input {
    margin-top: 30px;
  }
}
.tp-footer-subscribe-input input {
  width: 100%;
  height: 60px;
  background-color: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.13);
  border-radius: 55px;
  padding-right: 80px;
}
.tp-footer-subscribe-input input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #9FA4CD;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input input::-webkit-input-placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input input::-moz-placeholder { /* Firefox 19+ */
  color: #9FA4CD;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input input::-moz-placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input input:-moz-placeholder { /* Firefox 4-18 */
  color: #9FA4CD;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input input:-moz-placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input input:-ms-input-placeholder { /* IE 10+  Edge*/
  color: #9FA4CD;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input input:-ms-input-placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input input::placeholder { /* MODERN BROWSER */
  color: #9FA4CD;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input input::placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input input:focus {
  color: var(--tp-common-white);
}
.tp-footer-subscribe-input input:focus::placeholder {
  opacity: 0;
}
.tp-footer-subscribe-input .tp-footer-btn {
  position: absolute;
  right: 1px;
  top: 1px;
  padding: 16px 22px;
  text-transform: uppercase;
  border-radius: 50%;
  background: #FF3A8A;
  font-weight: 900;
  font-size: 18px;
  color: #fff;
  display: inline-block;
}
.tp-footer-subscribe-input-3 {
  margin-top: 70px;
}
@media (max-width: 575px) {
  .tp-footer-subscribe-input-3 {
    margin-top: 30px;
  }
}
.tp-footer-subscribe-input-3 input {
  width: 100%;
  height: 60px;
  background: #161616;
  border: 1px solid #323232;
  border-radius: 55px;
  padding-right: 80px;
}
.tp-footer-subscribe-input-3 input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #B9BAC0;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input-3 input::-webkit-input-placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input-3 input::-moz-placeholder { /* Firefox 19+ */
  color: #B9BAC0;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input-3 input::-moz-placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input-3 input:-moz-placeholder { /* Firefox 4-18 */
  color: #B9BAC0;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input-3 input:-moz-placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input-3 input:-ms-input-placeholder { /* IE 10+  Edge*/
  color: #B9BAC0;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input-3 input:-ms-input-placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input-3 input::placeholder { /* MODERN BROWSER */
  color: #B9BAC0;
  font-weight: 400;
  font-size: 16px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-subscribe-input-3 input::placeholder {
    font-size: 14px;
  }
}
.tp-footer-subscribe-input-3 input:focus {
  color: var(--tp-common-white);
}
.tp-footer-subscribe-input-3 input:focus::placeholder {
  opacity: 0;
}
.tp-footer-subscribe-input-3 .tp-footer-btn {
  position: absolute;
  right: 2px;
  top: 0px;
  padding: 17px 22px;
  text-transform: uppercase;
  border-radius: 50%;
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  font-weight: 900;
  font-size: 18px;
  color: #fff;
  display: inline-block;
}
.tp-footer-top-widget {
  padding-bottom: 60px;
  margin-bottom: 30px;
  border-bottom: 1px solid #2839B0;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-footer-top-widget {
    padding-bottom: 20px;
  }
}
.tp-footer-top-widget .tp-space-col-2 {
  padding-left: 80px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-footer-top-widget .tp-space-col-2 {
    padding-left: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-footer-top-widget .tp-space-col-2 {
    padding-left: 10px;
  }
}
.tp-footer-top-widget .tp-space-col-4 {
  padding-left: 88px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-footer-top-widget .tp-space-col-4 {
    padding-left: 50px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-footer-top-widget .tp-space-col-4 {
    padding-left: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-footer-top-widget .tp-space-col-4 {
    padding-left: 10px;
  }
}
.tp-footer-top-widget-3 {
  padding-bottom: 60px;
  margin-bottom: 30px;
  border-bottom: 1px solid #323232;
}
@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), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-footer-top-widget-3 {
    padding-bottom: 30px;
  }
}
.tp-footer-top-widget-3 .tp-space-col-2 {
  padding-left: 80px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-footer-top-widget-3 .tp-space-col-2 {
    padding-left: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-footer-top-widget-3 .tp-space-col-2 {
    padding-left: 10px;
  }
}
.tp-footer-top-widget-3 .tp-space-col-4 {
  padding-left: 88px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-footer-top-widget-3 .tp-space-col-4 {
    padding-left: 50px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-footer-top-widget-3 .tp-space-col-4 {
    padding-left: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-footer-top-widget-3 .tp-space-col-4 {
    padding-left: 10px;
  }
}
.tp-footer-copyright-2 p {
  font-weight: 500;
  font-size: 15px;
  line-height: 27px;
  color: var(--tp-common-white);
}
.tp-footer-copyright-2 a {
  font-weight: 500;
  font-size: 15px;
  line-height: 27px;
  color: var(--tp-common-white);
}
.tp-footer-copyright-2 a:hover {
  opacity: 0.7;
}
@media (max-width: 397px) {
  .tp-footer-copyright-2 a:last-child {
    margin-left: 30px;
  }
}
.tp-footer-blur-effect .footer-blur-1 {
  position: absolute;
  top: -740px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-blur-effect .footer-blur-1 {
    top: -345px;
  }
}
@media (max-width: 575px) {
  .tp-footer-blur-effect .footer-blur-1 {
    display: none;
  }
}
.tp-footer-blur-effect .footer-blur-1 img {
  max-width: 100%;
}
.tp-footer-blur-effect .footer-blur-2 {
  position: absolute;
  top: -620px;
  right: 0;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-footer-blur-effect .footer-blur-2 {
    top: -345px;
  }
}
@media (max-width: 575px) {
  .tp-footer-blur-effect .footer-blur-2 {
    display: none;
  }
}
.tp-footer-blur-effect .footer-blur-2 img {
  max-width: 100%;
}

/*----------------------------------------*/
/*  7.1- About css
/*----------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-area {
    margin-top: -50px;
  }
}
.tp-about-wrapper p {
  font-weight: 400;
  font-size: 18px;
  line-height: 30px;
  margin-bottom: 35px;
}
.tp-about-list li {
  margin-bottom: 13px;
  list-style: none;
  font-weight: 500;
  font-size: 16px;
  line-height: 25px;
  color: var(--tp-heading-primary);
  float: left;
  width: 40%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-about-list li {
    width: 50%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-list li {
    width: 45%;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-list li {
    float: none;
    width: auto;
  }
}
.tp-about-list li i {
  color: var(--tp-theme-primary);
  margin-right: 10px;
  font-size: 16px;
  font-weight: 500;
}
.tp-about-btn .tp-btn {
  padding: 22px 36px;
}
.tp-about-thumb {
  margin-top: 20px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-about-thumb {
    margin-top: 80px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-about-thumb {
    margin-top: 100px;
  }
}
@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), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-about-thumb img {
    max-width: 100%;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-about-area-2 {
    padding-top: 125px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-area-2 {
    padding-top: 120px;
    padding-bottom: 500px;
  }
}
@media (max-width: 575px) {
  .tp-about-area-2 {
    padding-top: 80px;
    padding-bottom: 500px;
  }
}
.tp-about-wrapper-2 .tp-section__title-pre {
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
  margin-bottom: 18px;
  color: var(--tp-common-white);
}
.tp-about-wrapper-2 .tp-section__title {
  color: var(--tp-common-white);
  font-size: 54px;
  line-height: 62px;
  padding-bottom: 90px;
  margin-bottom: 65px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-about-wrapper-2 .tp-section__title {
    padding-bottom: 60px;
    margin-bottom: 52px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-wrapper-2 .tp-section__title {
    padding-bottom: 40px;
    margin-bottom: 35px;
  }
}
@media (max-width: 575px) {
  .tp-about-wrapper-2 .tp-section__title {
    font-size: 50px;
    padding-bottom: 40px;
    margin-bottom: 30px;
  }
}
.tp-about-wrapper-2 .tp-section__title::before {
  position: absolute;
  content: "";
  height: 1px;
  width: 529px;
  background: #623CB4;
  bottom: 0;
  left: 42%;
  transform: translateX(-50%);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-about-wrapper-2 .tp-section__title::before {
    width: 445px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-about-wrapper-2 .tp-section__title::before {
    width: 400px;
    left: 45%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-about-wrapper-2 .tp-section__title::before {
    width: 540px;
    left: 40%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-wrapper-2 .tp-section__title::before {
    width: 470px;
    left: 46%;
  }
}
@media (max-width: 575px) {
  .tp-about-wrapper-2 .tp-section__title::before {
    width: 270px;
    left: 50%;
  }
}
.tp-about-wrapper-2 .tp-subtitle {
  font-style: normal;
  font-weight: 600;
  font-size: 28px;
  line-height: 45px;
  letter-spacing: -0.01em;
  color: var(--tp-common-white);
}
.tp-about-wrapper-2 p {
  font-size: 18px;
  line-height: 30px;
  letter-spacing: -0.02em;
  color: #BEB2E7;
  margin-bottom: 45px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-about-wrapper-2 p br {
    display: none;
  }
}
.tp-about-btn-wrapper .tp-pulse-border {
  position: relative;
  font-weight: 900;
  font-size: 18px;
  height: 70px;
  width: 70px;
  color: #FF3A8A;
  line-height: 70px;
  background: #5638AF;
  border: 1px solid rgba(255, 255, 255, 0.17);
  border-radius: 50%;
  display: inline-block;
  text-align: center;
  margin-right: 15px;
}
.tp-about-btn-wrapper .tp-pulse-border i {
  transform: translateX(2px);
}
.tp-about-btn-wrapper a {
  font-family: var(--tp-ff-heading);
  font-weight: 600;
  font-size: 14px;
  line-height: 15px;
  letter-spacing: 0.135em;
  text-transform: uppercase;
  color: var(--tp-common-white);
}
.tp-about-box-item.item-left {
  background: #FF3A8A;
  height: 312px;
  width: 285px;
  border-radius: 20px;
  padding: 43px 31px;
  z-index: 1;
  position: absolute;
  left: 10px;
  top: 135px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-about-box-item.item-left {
    height: 285px;
    width: 230px;
    padding: 38px 26px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-about-box-item.item-left {
    height: 295px;
    width: 242px;
    padding: 40px 28px;
    left: -30px;
    top: 103px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-box-item.item-left {
    top: 85px;
  }
}
@media only screen and (min-width: 398px) and (max-width: 575px), (max-width: 575px) {
  .tp-about-box-item.item-left {
    left: 0;
    width: 270px;
    top: 85px;
  }
}
.tp-about-box-item h4 {
  font-family: var(--tp-ff-heading);
  font-weight: 700;
  font-size: 75px;
  line-height: 62px;
  letter-spacing: 0.02em;
  color: var(--tp-common-white);
  margin-bottom: 120px;
  display: block;
  margin-left: 3px;
}
.tp-about-box-item p {
  font-weight: 500;
  font-size: 25px;
  line-height: 30px;
  letter-spacing: -0.02em;
  color: #FFFFFF;
}
.tp-about-box-item img {
  position: absolute;
  left: 0;
  bottom: 0;
  border-radius: 20px;
  z-index: -1;
  max-width: 100%;
}
.tp-about-box-item.item-top {
  background: #34B2F3;
  height: 237px;
  width: 233px;
  border-radius: 20px;
  padding: 43px 36px;
  z-index: 1;
  position: absolute;
  right: 56px;
  top: -15px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-about-box-item.item-top {
    height: 230px;
    width: 212px;
    padding: 42px 35px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-about-box-item.item-top {
    height: 238px;
    width: 200px;
    padding: 40px 35px;
    right: 12px;
    top: -30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-about-box-item.item-top {
    right: 130px;
    top: -25px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-box-item.item-top {
    right: 266px;
    top: 425px;
  }
}
@media only screen and (min-width: 398px) and (max-width: 575px), (max-width: 575px) {
  .tp-about-box-item.item-top {
    right: auto;
    top: 425px;
  }
}
.tp-about-box-item.item-top h4 {
  font-size: 60px;
  margin-bottom: 60px;
}
.tp-about-box-item.item-bottom {
  background: #7924C8;
  height: 311px;
  width: 329px;
  border-radius: 20px;
  padding: 50px 40px;
  z-index: 1;
  position: absolute;
  right: -41px;
  top: 280px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-about-box-item.item-bottom {
    width: 277px;
    padding: 45px 30px;
    right: -9px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-about-box-item.item-bottom {
    height: 290px;
    width: 230px;
    padding: 46px 20px;
    right: -20px;
    top: 252px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-about-box-item.item-bottom {
    width: 320px;
    right: 40px;
    top: 250px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-box-item.item-bottom {
    right: 168px;
    top: 685px;
  }
}
@media only screen and (min-width: 398px) and (max-width: 575px), (max-width: 575px) {
  .tp-about-box-item.item-bottom {
    right: auto;
    top: 685px;
    width: 270px;
  }
}
.tp-about-box-item.item-bottom h4 {
  font-size: 85px;
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-about-area-3 {
    padding-top: 130px;
    padding-bottom: 110px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-about-area-3 {
    padding-top: 140px;
    padding-bottom: 110px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-area-3 {
    padding-top: 100px;
    padding-bottom: 110px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-area-3 {
    padding-top: 60px;
    padding-bottom: 80px;
  }
}
.tp-about-thumb-3 {
  margin-left: -74px;
}
@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: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-thumb-3 {
    margin-left: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-about-thumb-3 {
    margin-left: 0;
    margin-top: 35px;
  }
}
.tp-about-thumb-3 img {
  max-width: 100%;
  border-radius: 50%;
  margin-top: -30px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-thumb-3-wrapper {
    margin-bottom: 60px;
  }
}
.tp-about-thumb-3-shape-top .tp-shape-top {
  position: absolute;
  top: 30px;
  left: -100px;
  animation: hero-bounce-leftright 5s infinite linear;
}
.tp-about-thumb-3-shape-top .tp-shape-top img {
  border-radius: 10px;
  box-shadow: 0px 25px 40px rgba(0, 0, 0, 0.1);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-about-thumb-3-shape-top .tp-shape-top {
    top: 10px;
    left: -30px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-about-thumb-3-shape-top .tp-shape-top {
    top: -5px;
    left: -25px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-about-thumb-3-shape-top .tp-shape-top {
    top: -40px;
    left: -15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-about-thumb-3-shape-top .tp-shape-top {
    top: -5px;
    left: 0px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-thumb-3-shape-top .tp-shape-top {
    top: -10px;
    left: -15px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-thumb-3-shape-top .tp-shape-top {
    display: none;
  }
}
.tp-about-thumb-3-shape-end .tp-shape-end {
  position: absolute;
  bottom: 40px;
  left: -115px;
  animation: hero-bounce-leftright 2s infinite linear;
}
.tp-about-thumb-3-shape-end .tp-shape-end img {
  box-shadow: 0px 15px 45px rgba(77, 62, 62, 0.29);
  border-radius: 20px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-about-thumb-3-shape-end .tp-shape-end {
    bottom: 10px;
    left: -40px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-about-thumb-3-shape-end .tp-shape-end {
    bottom: -30px;
    left: -35px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-about-thumb-3-shape-end .tp-shape-end {
    bottom: -55px;
    left: -12px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-about-thumb-3-shape-end .tp-shape-end {
    bottom: 15px;
    left: 0px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-about-thumb-3-shape-end .tp-shape-end {
    bottom: -10px;
    left: -5px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-thumb-3-shape-end .tp-shape-end {
    display: none;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-about-content-3 {
    padding-left: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-content-3 {
    padding-left: 0;
  }
}
.tp-about-content-3 .tp-section__title-pre-3 {
  margin-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), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-content-3 .tp-section__title-pre-3 {
    margin-bottom: 20px;
  }
}
.tp-about-content-3 h3 {
  font-weight: 600;
  font-size: 54px;
  letter-spacing: -0.03em;
  color: #161616;
  margin-bottom: 35px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-about-content-3 h3 {
    font-size: 45px;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-about-content-3 h3 {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-content-3 h3 {
    font-size: 35px;
    margin-bottom: 30px;
  }
}
.tp-about-content-3 p {
  font-weight: 400;
  font-size: 20px;
  line-height: 32px;
  color: #6A6A74;
  margin-bottom: 45px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-content-3 p {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-content-3 p br {
    display: none;
  }
}
.tp-about-content-3 .tp-btn-black {
  padding: 15px 43px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-about-content-3 .tp-btn-black {
    padding: 15px 22px;
  }
}
.tp-about-left-bg {
  position: absolute;
  top: -300px;
  left: 0;
  z-index: -1;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-about-left-bg {
    top: -315px;
    left: -100px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-about-left-bg {
    top: -510px;
    left: -200px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-left-bg {
    display: none;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-about-left-bg {
    top: -485px;
    left: -205px;
  }
}
.tp-about-right-bg {
  position: absolute;
  right: 0;
  top: -400px;
  z-index: -1;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-about-right-bg {
    top: -500px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-right-bg {
    display: none;
  }
}

.breadcrumb__title {
    font-weight: 600;
    font-size: 75px;
    letter-spacing: -0.02em;
    color: #351E8A;
    /*color: var(--tp-common-white);*/
    margin-bottom: 20px;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .breadcrumb__title {
    font-size: 65px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .breadcrumb__title {
    font-size: 55px;
  }
}
.breadcrumb__list span {
  font-weight: 600;
  font-size: 18px;
  line-height: 20px;
  letter-spacing: 0.135em;
  text-transform: uppercase;
  color:#000;/*var(--tp-common-white);*/
} /* var(--tp-common-white);*/
.breadcrumb__overlay {
    position: relative;
}
    .breadcrumb__overlay::after {
        position: absolute;
        content: "";
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: #3e9be6;
        opacity: 0.6;
    }

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-about-breadcrumb {
    padding-top: 150px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-breadcrumb {
    padding-top: 100px;
  }
}
@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), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-breadcrumb-wrapper-2 {
    padding-top: 70px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-breadcrumb-wrapper-2 {
    padding-right: 0;
  }
}
.tp-about-breadcrumb-about-us p {
  margin-bottom: 38px;
}
.tp-about-breadcrum-thumb img {
  max-width: 100%;
  border-radius: 13px;
  margin-top: -50px;
  z-index: 1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-breadcrum-thumb img {
    margin-top: 0;
  }
}
.tp-about-btn-play {
  position: absolute;
}
.tp-about-play a {
  position: absolute;
  top: 40%;
  left: 45%;
  height: 90px;
  width: 90px;
  line-height: 90px;
  border-radius: 50%;
  display: inline-block;
  text-align: center;
  font-weight: 900;
  font-size: 24px;
  color: #162DE4;
  background: linear-gradient(164.71deg, #FFFFFF 8.83%, #EAEAEF 128.86%);
  box-shadow: 0px 0px 50px rgba(3, 4, 28, 0.1);
  z-index: 2;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-play a {
    top: 40%;
    left: 39%;
  }
}
.tp-about-breadcrumb-content .content-1 {
  margin-bottom: 30px;
}
.tp-about-breadcrumb-content .content-2 {
  margin-bottom: 30px;
}
.tp-about-wrapper-3 {
  padding-left: 44px;
  padding-right: 24px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-wrapper-3 {
    padding-left: 0;
    padding-right: 0;
  }
}
.tp-about-wrapper-3 p {
  margin-bottom: 25px;
}
.tp-about-breadcrumb-thumb-2 img {
  border-radius: 13px;
  max-width: 100%;
}
.tp-about-breadcrumb-thumb-3 img {
  border-radius: 13px;
  max-width: 100%;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-about-wrapper-breadcrumb {
    padding-right: 30px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-about-wrapper-breadcrumb {
    padding-right: 0px;
  }
}

.thumb-3 {
  position: absolute;
  bottom: -110px;
  right: 15px;
  z-index: 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .thumb-3 {
    bottom: -130px;
    right: -35px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .thumb-3 {
    position: static;
    margin-top: 30px;
    margin-bottom: 30px;
  }
}
.thumb-3::before {
  position: absolute;
  content: "";
  top: -10px;
  left: -9px;
  width: 411px;
  height: 306px;
  background-image: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  border-radius: 13px;
  z-index: -1;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .thumb-3::before {
    display: none;
  }
}

.tp-tooltip-effect-1, .tp-tooltip-effect-2 {
  position: absolute;
  left: 40%;
  top: 34%;
  width: 150px;
  height: 150px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.6);
  box-shadow: 0px 0px 40px rgba(3, 4, 28, 0.06);
  backdrop-filter: blur(4px);
  border-radius: 50%;
  z-index: 0;
  -webkit-animation: tp-hotspot-2 2s infinite cubic-bezier(0.4, 0, 1, 1);
  animation: tp-hotspot-2 2s infinite cubic-bezier(0.4, 0, 1, 1);
  animation-delay: 0s;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-tooltip-effect-1, .tp-tooltip-effect-2 {
    left: 38%;
    top: 32%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-tooltip-effect-1, .tp-tooltip-effect-2 {
    left: 41%;
    top: 35%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-tooltip-effect-1, .tp-tooltip-effect-2 {
    left: 39%;
    top: 33%;
  }
}
@media only screen and (min-width: 398px) and (max-width: 575px) {
  .tp-tooltip-effect-1, .tp-tooltip-effect-2 {
    left: 32%;
    top: 32%;
  }
}
@media (max-width: 397px) {
  .tp-tooltip-effect-1, .tp-tooltip-effect-2 {
    left: 27%;
    top: 28%;
  }
}
.tp-tooltip-effect-2 {
  animation-delay: 0.4s;
}

/*----------------------------------------*/
/*  7.2 Blog css
/*----------------------------------------*/
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-area {
    padding-top: 90px;
  }
}
.tp-blog-section-space {
  margin-bottom: 50px;
}
.tp-blog-section-wrapper .tp-section__title-pre-3 {
  margin-bottom: 10px;
}
.tp-blog-section-wrapper .tp-section__title {
  margin-bottom: 0px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-blog-section-wrapper .tp-section__title {
    font-size: 40px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-blog-section-wrapper .tp-section__title {
    margin-bottom: 20px;
  }
}
.tp-blog-item {
  transition: 0.3s ease;
  border: 1px solid rgba(3, 4, 28, 0.1);
  border-radius: 10px;
}
.tp-blog-item:hover {
  background: #FFFFFF;
  box-shadow: 0px 20px 30px rgba(3, 4, 28, 0.1);
}
.tp-blog-thumb {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 220px;
  background-size: cover;
  background-repeat: no-repeat;
  border-radius: 10px 0 0px 10px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-thumb {
    width: 100%;
    height: 390px;
    border-radius: 10px 10px 0 0;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center 19%;
  }
}
.tp-blog-content {
  padding: 30px 30px 15px 15px;
  margin-left: -24px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-content {
    margin-top: 390px;
  }
}
@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), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-blog-content {
    margin-left: 0;
    padding: 30px 43px 25px 25px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-blog-content {
    margin-left: 0;
    padding: 30px 20px 25px 25px;
  }
}
.tp-blog-content:hover h3 a {
  background-size: 0 2px, 100% 2px;
}
.tp-blog-content h3 {
  font-weight: 600;
  font-size: 24px;
  letter-spacing: -0.03em;
  color: #161616;
  margin-bottom: 15px;
}
.tp-blog-content h3 a {
  background-image: linear-gradient(#03041C, #03041C), linear-gradient(#03041C, #03041C);
  background-size: 0% 2px, 0 2px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.4s linear;
}
.tp-blog-content p {
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  letter-spacing: -0.04em;
  color: #6A6A74;
  margin-bottom: 25px;
}
.tp-blog-user {
  border-bottom: 1px solid rgba(3, 4, 28, 0.1);
  padding-bottom: 32px;
  margin-bottom: 18px;
}
.tp-blog-user span {
  font-weight: 500;
  font-size: 16px;
  line-height: 10px;
  color: #161616;
  margin-left: 8px;
}
.tp-blog-user img {
  width: 38px;
}
.tp-blog-tag a {
  font-weight: 500;
  font-size: 14px;
  line-height: 10px;
  color: #000D44;
  background: #F8F8F8;
  border-radius: 40px;
  padding: 10px 17px;
  display: inline-block;
  margin-bottom: 15px;
  transition: 0.3s ease;
  position: relative;
  z-index: 1;
}
.tp-blog-tag a:hover {
  color: var(--tp-common-white);
}
.tp-blog-tag a:hover::before {
  opacity: 1;
}
.tp-blog-tag a::before {
  position: absolute;
  content: "";
  width: 100%;
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  top: 0;
  left: 0;
  border-radius: 40px;
  height: 100%;
  opacity: 0;
  color: var(--tp-common-white);
  transition: 0.3s ease;
  z-index: -1;
}
.tp-blog-meta span {
  font-weight: 400;
  font-size: 14px;
  line-height: 12px;
  color: #6A6A74;
}
.tp-blog-meta svg {
  color: #525258;
  margin-right: 2px;
  transform: translateY(-3px);
}

.tp-blog__arrows .slick-prev {
  color: #000;
  background: var(--tp-common-white);
  border: 2px solid #EAEAEF;
  width: 48px;
  height: 48px;
  margin-right: 12px;
  display: inline-block;
  font-size: 20px;
  border-radius: 6px;
  overflow: hidden;
  transition: 0.3s ease;
  position: relative;
  z-index: 1;
}
.tp-blog__arrows .slick-prev:hover {
  color: var(--tp-common-white);
  border: 2px solid #161616;
}
.tp-blog__arrows .slick-prev:hover::before {
  opacity: 1;
}
.tp-blog__arrows .slick-prev::before {
  position: absolute;
  content: "";
  width: 100%;
  background: #161616;
  top: 0;
  left: 0;
  height: 100%;
  opacity: 0;
  color: var(--tp-common-white);
  transition: 0.3s ease;
  z-index: -1;
}
.tp-blog__arrows .slick-next {
  color: #000;
  background: var(--tp-common-white);
  border: 2px solid #EAEAEF;
  width: 48px;
  height: 48px;
  display: inline-block;
  font-size: 20px;
  border-radius: 6px;
  overflow: hidden;
  transition: 0.3s ease;
  position: relative;
  z-index: 1;
}
.tp-blog__arrows .slick-next:hover {
  color: var(--tp-common-white);
  border: 2px solid #161616;
}
.tp-blog__arrows .slick-next:hover::before {
  opacity: 1;
}
.tp-blog__arrows .slick-next::before {
  position: absolute;
  content: "";
  width: 100%;
  background: #161616;
  top: 0;
  left: 0;
  height: 100%;
  opacity: 0;
  color: var(--tp-common-white);
  transition: 0.3s ease;
  z-index: -1;
}

.tp-read-blog-active .slick-next.slick-arrow i {
  position: absolute;
  z-index: 2;
  top: 50%;
  transform: translateY(-50%);
  right: 2%;
  background: var(--tp-common-white);
  color: #B3B6C4;
  transition: 0.3s ease;
  height: 55px;
  width: 55px;
  border-radius: 50%;
  line-height: 55px;
  font-size: 17px;
  box-shadow: 0px 7px 13px rgba(44, 65, 97, 0.13);
}
@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) {
  .tp-read-blog-active .slick-next.slick-arrow i {
    right: 2%;
  }
}
.tp-read-blog-active .slick-next.slick-arrow i:hover {
  color: #030A39;
}
.tp-read-blog-active .slick-prev.slick-arrow i {
  position: absolute;
  z-index: 2;
  top: 50%;
  transform: translateY(-50%);
  left: 2%;
  background: var(--tp-common-white);
  color: #B3B6C4;
  transition: 0.3s ease;
  height: 55px;
  width: 55px;
  border-radius: 50%;
  line-height: 55px;
  font-size: 17px;
  box-shadow: 0px 7px 13px rgba(44, 65, 97, 0.13);
}
@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) {
  .tp-read-blog-active .slick-prev.slick-arrow i {
    left: 2%;
  }
}
.tp-read-blog-active .slick-prev.slick-arrow i:hover {
  color: #030A39;
}

/*----------------------------------------*/
/* 		7.3 Case css
/*----------------------------------------*/
.tp-case-studies-tab-button {
  background-color: #F9FAFB;
  padding: 13px 90px;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 80px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-case-studies-tab-button {
    padding: 15px 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-case-studies-tab-button {
    padding: 15px 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-case-studies-tab-button {
    padding: 12px 16px;
  }
}
.tp-case-studies-tab-button button {
  font-size: 18px;
  font-weight: 600;
  padding: 15px 40px;
  position: relative;
  background: var(--tp-common-white);
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-case-studies-tab-button button {
    padding: 15px 25px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-case-studies-tab-button button {
    padding: 12px 30px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-case-studies-tab-button button {
    background: none;
    padding: 8px 20px;
    font-size: 15px;
  }
}
.tp-case-studies-tab-button button:last-child:after {
  display: none;
}
.tp-case-studies-tab-button button span {
  position: relative;
  z-index: 3;
}
.tp-case-studies-tab-button button.active {
  color: var(--tp-common-white);
  transition: 0.3s ease;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-case-studies-tab-button button.active {
    color: #003CFF;
  }
}
.tp-case-studies-tab-button button.active:before {
  opacity: 1;
  visibility: visible;
}
.tp-case-studies-tab-button button:before {
  position: absolute;
  content: "";
  height: 101%;
  width: 102%;
  top: 0;
  left: -1px;
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  color: var(--tp-common-white);
  border-radius: 5px;
  z-index: 3;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s ease;
}
@media only screen and (min-width: 270px) and (max-width: 575px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-case-studies-tab-button button:before {
    display: none;
  }
}
.tp-case-studies-tab-button button:after {
  content: "";
  height: 40px;
  width: 1px;
  top: 50%;
  right: 0;
  background: #E4E6EA;
  transform: translateY(-50%);
  position: absolute;
  z-index: 1;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-case-studies-tab-button button:after {
    height: 25px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-case-studies-tab-button button:after {
    display: none;
  }
}

.plr-210 {
  padding-left: 210px;
  padding-right: 210px;
}
@media only screen and (min-width: 1600px) and (max-width: 1699px) {
  .plr-210 {
    padding-left: 155px;
    padding-right: 155px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .plr-210 {
    padding-left: 55px;
    padding-right: 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), only screen and (min-width: 576px) and (max-width: 767px) {
  .plr-210 {
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .plr-210 {
    padding-left: 15px;
    padding-right: 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) {
  .tp-case-details-area {
    padding-top: 100px;
    padding-bottom: 100px;
  }
}
.tp-case-details-titile-wrapper {
  padding-left: 60px;
  padding-bottom: 25px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-case-details-titile-wrapper {
    padding-left: 0;
  }
}
.tp-case-details-titile-wrapper h3 {
  margin-bottom: 10px;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-case-details-titile-wrapper h3 {
    font-size: 40px;
  }
}
.tp-case-details-titile-wrapper span {
  font-weight: 500;
  font-size: 22px;
  line-height: 28px;
  color: #000D44;
  margin-bottom: 25px;
}
.tp-case-details-title span {
  font-weight: 600;
  font-size: 16px;
  line-height: 14px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #000D44;
}
.tp-case-details-items {
  margin-left: 75px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-case-details-items {
    margin-left: 55px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-case-details-items {
    margin-left: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-case-details-items {
    margin-right: 20px;
    margin-left: 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-case-details-items {
    margin-left: 0px;
    margin-right: 20px;
  }
}
.tp-case-details-items span {
  font-weight: 600;
  font-size: 16px;
  line-height: 14px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #000D44;
}
.tp-case-details-border {
  border-top: 1px solid #EFEFEF;
  padding-top: 28px;
}
.tp-case-details-thumb img {
  border-radius: 20px;
  max-width: 100%;
}
.tp-case-details-about-seo {
  padding-right: 120px;
}
@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), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-case-details-about-seo {
    padding-right: 0;
  }
}
.tp-case-details-about-seo-2 {
  padding-right: 125px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-case-details-about-seo-2 {
    padding-right: 0;
  }
}
.tp-case-details-title {
  margin-bottom: 40px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-case-details-title {
    font-size: 27px;
  }
}
.tp-case-details-title p {
  font-size: 17px;
}
.tp-case-details-p1 {
  margin-bottom: 27px;
}
.tp-case-details-p2 {
  margin-bottom: 27px;
}
.tp-case-details-p3 {
  margin-bottom: 38px;
}
.tp-case-details-span1 {
  font-family: var(--tp-ff-heading);
  font-weight: 600;
  font-size: 28px;
  letter-spacing: -0.02em;
  color: #000D44;
  display: block;
  margin-bottom: 10px;
  margin-top: 40px;
}
.tp-case-details-p4 {
  margin-bottom: 27px;
}
.tp-case-details-p5 {
  margin-bottom: 90px;
}
.tp-case-details-span2 {
  font-family: var(--tp-ff-heading);
  font-weight: 600;
  font-size: 28px;
  letter-spacing: -0.02em;
  color: #000D44;
  display: block;
  margin-bottom: 20px;
}
.tp-case-details-p6 {
  margin-bottom: 27px;
}
.tp-case-details-p7 {
  margin-bottom: 32px;
}
.tp-case-details-barchart img {
  max-width: 100%;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-case-details-barchart img {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-case-details-lr-wrapper {
    margin-bottom: 30px;
  }
}
.tp-case-details-lr-wrapper a i {
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  box-shadow: -2px 1px 2px rgba(237, 237, 237, 0.51);
  border-radius: 3px;
  height: 67px;
  width: 26px;
  text-align: center;
  line-height: 67px;
  font-weight: 400;
  font-size: 22px;
  color: var(--tp-common-white);
}
.tp-case-details-lr-wrapper span {
  display: block;
  font-weight: 500;
  font-size: 20px;
  line-height: 14px;
  color: #000D44;
}
.tp-case-details-btn {
  margin-top: 12px;
}
.tp-case-details-prev-btn {
  font-weight: 600;
  font-size: 14px;
  line-height: 14px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #162DE4;
  margin-bottom: 16px;
  display: block;
}
.tp-case-details-border-button {
  border: 1px solid #EFEFEF;
  border-radius: 10px;
  padding: 20px;
  margin-left: 210px;
  margin-right: 210px;
  margin-top: 90px;
}
@media only screen and (min-width: 1700px) and (max-width: 1899px) {
  .tp-case-details-border-button {
    margin-left: 172px;
    margin-right: 172px;
  }
}
@media only screen and (min-width: 1600px) and (max-width: 1699px) {
  .tp-case-details-border-button {
    margin-left: 122px;
    margin-right: 122px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-case-details-border-button {
    margin-left: 45px;
    margin-right: 45px;
  }
}
@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), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-case-details-border-button {
    margin-left: 30px;
    margin-right: 30px;
    margin-top: 50px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-case-details-border-button {
    display: none;
  }
}

.case-detials-slider img {
  border-radius: 20px;
  max-width: 100%;
}

.tp-casedetails-active .slick-list {
  margin: 0 -26px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-casedetails-active .slick-list {
    margin: 0 -7px;
  }
}
.tp-casedetails-active .slick-slide {
  margin: 0 18px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-casedetails-active .slick-slide {
    margin: 0 14px;
  }
}

.tp-casedetails-active .slick-next.slick-arrow i {
  position: absolute;
  z-index: 2;
  top: 50%;
  transform: translateY(-50%);
  right: -3%;
  background: var(--tp-common-white);
  color: #B3B6C4;
  transition: 0.3s ease;
  height: 70px;
  width: 70px;
  border-radius: 50%;
  line-height: 3.5;
  font-size: 20px;
  box-shadow: 0px 7px 13px rgba(44, 65, 97, 0.13);
}
@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) {
  .tp-casedetails-active .slick-next.slick-arrow i {
    right: -3%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-casedetails-active .slick-next.slick-arrow i {
    right: -2%;
  }
}
.tp-casedetails-active .slick-next.slick-arrow i:hover {
  color: #030A39;
}
.tp-casedetails-active .slick-prev.slick-arrow i {
  position: absolute;
  z-index: 2;
  top: 50%;
  transform: translateY(-50%);
  left: -3%;
  background: var(--tp-common-white);
  color: #B3B6C4;
  transition: 0.3s ease;
  height: 70px;
  width: 70px;
  border-radius: 50%;
  line-height: 3.5;
  font-size: 20px;
  box-shadow: 0px 7px 13px rgba(44, 65, 97, 0.13);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-casedetails-active .slick-prev.slick-arrow i {
    left: -3%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-casedetails-active .slick-prev.slick-arrow i {
    left: -2%;
  }
}
.tp-casedetails-active .slick-prev.slick-arrow i:hover {
  color: #030A39;
}

/*----------------------------------------*/
/*  7.4 Contact css
/*----------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-contact-area {
    padding-bottom: 60px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact-area {
    padding-top: 70px;
    padding-bottom: 50px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-contact-wrapper {
    padding-right: 60px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact-wrapper {
    padding-right: 0;
  }
}
.tp-contact-section-wrapper .tp-section__title {
  margin-bottom: 15px;
}
.tp-contact-section-wrapper p {
  font-size: 20px;
  line-height: 25px;
  color: #000D44;
}
.tp-contact-list-icon {
  background: var(--tp-common-white);
  box-shadow: 0px 7px 13px rgba(44, 65, 97, 0.13);
  border-radius: 10px;
  height: 70px;
  width: 70px;
  text-align: center;
  line-height: 4;
  margin-right: 20px;
}
.tp-contact-list-content span {
  font-size: 16px;
  line-height: 22px;
  letter-spacing: -0.04em;
  color: var(--tp-heading-secondary);
}
.tp-contact-list-content p {
  font-size: 18px;
  line-height: 22px;
  letter-spacing: -0.01em;
  color: #03041C;
}
.tp-contact__form {
  background: #F1F6FB;
  border-radius: 10px;
  padding: 65px 50px 52px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact__form {
    padding: 60px 30px 50px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact__form {
    margin-left: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact__from-breadcrumb.contact-from {
    margin-left: 0;
  }
}
.tp-contact__form-breadcrumb {
  background: #F8F8F8;
  border-radius: 10px;
  padding: 65px 50px 52px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact__form-breadcrumb {
    margin-left: 0;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact__form-breadcrumb {
    padding: 60px 20px 20px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact__form-breadcrumb.team-details {
    margin-left: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact__form-breadcrumb.about-us {
    margin-left: 0;
  }
}
.tp-contact__input {
  margin-bottom: 20px;
}
.tp-contact__input input, .tp-contact__input textarea {
  background: #FFFFFF;
  box-shadow: 0px 4px 4px rgba(115, 135, 164, 0.13);
  border-radius: 10px;
  width: 100%;
  height: 60px;
  border: 1px solid #FFFFFF;
  outline: 0;
  resize: none;
  padding: 0 25px;
}
.tp-contact__input input::-webkit-input-placeholder, .tp-contact__input textarea::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  font-size: 14px;
  color: var(--tp-heading-primary);
  opacity: 0.5;
}
.tp-contact__input input::-moz-placeholder, .tp-contact__input textarea::-moz-placeholder { /* Firefox 19+ */
  font-size: 14px;
  color: var(--tp-heading-primary);
  opacity: 0.5;
}
.tp-contact__input input:-moz-placeholder, .tp-contact__input textarea:-moz-placeholder { /* Firefox 4-18 */
  font-size: 14px;
  color: var(--tp-heading-primary);
  opacity: 0.5;
}
.tp-contact__input input:-ms-input-placeholder, .tp-contact__input textarea:-ms-input-placeholder { /* IE 10+  Edge*/
  font-size: 14px;
  color: var(--tp-heading-primary);
  opacity: 0.5;
}
.tp-contact__input input::placeholder, .tp-contact__input textarea::placeholder { /* MODERN BROWSER */
  font-size: 14px;
  color: var(--tp-heading-primary);
  opacity: 0.5;
}
.tp-contact__input input:focus, .tp-contact__input textarea:focus {
  border-color: #000D44;
}
.tp-contact__input input:focus::placeholder, .tp-contact__input textarea:focus::placeholder {
  opacity: 0;
}
.tp-contact__input textarea {
  width: 100%;
  height: 160px;
}
.tp-contact__btn .tp-btn {
  padding: 20px 45px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact__btn .tp-btn {
    padding: 17px 30px;
  }
}
.tp-contact__btn.contact-3 .tp-btn {
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-contact-section-wrapper-breadcrumb {
    margin-bottom: 30px;
  }
}
.tp-contact-section-wrapper-breadcrumb p {
  font-size: 16px;
}
.tp-contact-icons a {
  position: relative;
  display: inline-block;
  background: #FFFFFF;
  border: 1px solid #EAEAEF;
  border-radius: 5px;
  height: 58px;
  width: 58px;
  line-height: 3.2;
  text-align: center;
  color: #000D44;
  margin-right: 2px;
  transition: 0.3s ease;
  font-size: 18px;
  z-index: 1;
  margin-bottom: 10px;
}
.tp-contact-icons a:hover {
  color: var(--tp-common-white);
}
.tp-contact-icons a:hover::before {
  opacity: 1;
}
.tp-contact-icons a::before {
  position: absolute;
  content: "";
  width: 100%;
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  top: 0;
  left: 0;
  height: 100%;
  border-radius: 5px;
  opacity: 0;
  color: var(--tp-common-white);
  transition: 0.3s ease;
  z-index: -1;
}
.tp-contact-details {
  background: #F8F8F8;
  border-radius: 20px;
  padding: 58px 100px 50px 60px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact-details {
    padding: 50px 15px 50px 10px;
  }
}
.tp-contact-details li {
  list-style: none;
  position: relative;
  padding-left: 50px;
  border-bottom: 1px dashed #50413C;
  margin-bottom: 30px;
  padding-bottom: 26px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact-details li {
    padding-left: 28px;
  }
}
.tp-contact-details li:last-child {
  border: none;
  margin-bottom: 0;
  padding-bottom: 0;
}
.tp-contact-details li a {
  font-weight: 500;
  font-size: 22px;
  line-height: 29px;
  color: #000D44;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact-details li a {
    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), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact-details li a br {
    display: none;
  }
}
.tp-contact-details li a i {
  position: absolute;
  font-weight: 400;
  font-size: 22px;
  left: 0;
  top: 5px;
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact-map {
    margin-bottom: 40px;
  }
}
.tp-contact-map iframe {
  width: 536px;
  height: 424px;
  border-radius: 20px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact-map iframe {
    width: 100%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact-about-us-area {
    padding-top: 30px;
  }
}

/*----------------------------------------*/
/*  7.5 Cta css
/*----------------------------------------*/
.box-space {
  padding-left: 275px;
  padding-right: 275px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .box-space {
    padding-left: 110px;
    padding-right: 110px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .box-space {
    padding-left: 45px;
    padding-right: 45px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .box-space {
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .box-space {
    padding-left: 0px;
    padding-right: 0px;
  }
}

@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-cta-area {
    padding-bottom: 50px;
  }
}
.tp-cta-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
}
.tp-cta-wrapper {
  padding: 75px 105px 66px;
  border-radius: 30px;
  background-repeat: no-repeat;
  background-size: cover;
}
@media only screen and (min-width: 1600px) and (max-width: 1699px) {
  .tp-cta-wrapper {
    padding: 60px 85px 62px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-cta-wrapper {
    padding: 60px 35px 45px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-cta-wrapper {
    padding: 35px 40px 50px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-cta-wrapper {
    padding: 40px 58px 42px;
  }
}
@media only screen and (min-width: 398px) and (max-width: 575px) {
  .tp-cta-wrapper {
    padding: 30px 35px 40px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-cta-wrapper {
    padding: 40px 20px 25px;
  }
}
.tp-cta-wrapper p {
  font-weight: 500;
  font-size: 20px;
  line-height: 29px;
  color: var(--tp-common-white);
}
.tp-cta-title {
  font-weight: 600;
  font-size: 55px;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--tp-common-white);
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-cta-title {
    font-size: 50px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-cta-title {
    font-size: 44px;
  }
}
.tp-cta-shape {
  position: absolute;
  bottom: 0;
  left: 0px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-cta-shape {
    bottom: 45px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-cta-shape {
    bottom: 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-cta-shape {
    bottom: 70px;
  }
}
.tp-cta-shape img {
  width: 100%;
}
@media (max-width: 575px) {
  .tp-cta-shape img {
    display: none;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-cta-btn {
    margin-top: 20px;
  }
}
.tp-cta-team-wrapper {
  padding: 70px 72px 75px;
  border-radius: 30px;
  background-repeat: no-repeat;
  background-size: cover;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-cta-team-wrapper {
    padding: 65px 60px 65px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-cta-team-wrapper {
    padding: 55px 20px 55px;
  }
}
.tp-cta-team-btn .tp-btn-sm-blue {
  padding: 22px 35px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-cta-team-btn .tp-btn-sm-blue {
    padding: 22px 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-cta-team-btn .tp-btn-sm-blue {
    margin-top: 20px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-cta-team-btn .tp-btn-sm-blue {
    padding: 20px;
    margin-top: 20px;
  }
}

/*----------------------------------------*/
/*  7.6 Fact css
/*----------------------------------------*/
.tp-fact-wrapper {
  padding: 85px 105px 56px;
  border-radius: 30px;
  background-repeat: no-repeat;
  background-size: cover;
}
@media only screen and (min-width: 1600px) and (max-width: 1699px) {
  .tp-fact-wrapper {
    padding: 60px 55px 40px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-fact-wrapper {
    padding: 70px 75px 45px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-fact-wrapper {
    padding: 60px 50px 45px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-fact-wrapper {
    padding: 53px 0px 32px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-fact-wrapper {
    padding: 45px 30px 35px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-fact-wrapper {
    padding: 45px 50px 20px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-fact-wrapper {
    padding: 55px 50px 30px;
  }
}
.tp-fact-content h4 {
  font-weight: 700;
  font-size: 60px;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--tp-common-white);
  margin-bottom: 3px;
}
.tp-fact-content p {
  font-family: var(--tp-ff-heading);
  font-weight: 500;
  font-size: 20px;
  line-height: 29px;
  color: #FFFFFF;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-fact-content {
    padding-left: 40px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-fact-content {
    padding-left: 0px;
    margin-bottom: 30px;
  }
}
.tp-fact-icon span {
  background: var(--tp-gradient-primary);
  height: 58px;
  width: 58px;
  display: inline-block;
  border-radius: 50%;
  line-height: 58px;
  text-align: center;
  margin-bottom: 8px;
}
.tp-fact-icon span svg {
  transform: translateY(-2px);
}
.tp-fact-shape {
  position: absolute;
  left: 0px;
  top: -70px;
}
.tp-fact-shape img {
  width: 100%;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-fact-shape {
    top: -30px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-fact-shape {
    display: none;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-fun-fact-area {
    padding-bottom: 70px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-fun-fact-area {
    padding-bottom: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-fun-fact-content {
    padding-left: 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-fun-fact-content {
    padding-left: 0;
    margin-bottom: 30px;
  }
}
.tp-fun-fact-content h4 {
  font-weight: 700;
  font-size: 55px;
  text-transform: uppercase;
  color: var(--tp-common-white);
  margin-bottom: 25px;
}
.tp-fun-fact-content p {
  font-weight: 500;
  font-size: 18px;
  line-height: 26px;
  color: #D7DFFF;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-fun-fact-content p br {
    display: none;
  }
}
.tp-fun-fact-icon > span {
  background: #2D1877;
  border: 1px solid #2B3EBE;
  height: 65px;
  width: 65px;
  display: inline-block;
  text-align: center;
  line-height: 3.8;
  border-radius: 50%;
  margin-bottom: 25px;
  position: relative;
}
.tp-fun-fact-icon > span span {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: inline-block;
}
.tp-fun-fact-icon > span span svg circle {
  stroke: #2DA9E9;
  stroke-dashoffset: 0;
}
.tp-fun-fact-icon > span span svg circle:last-child {
  stroke-dasharray: 250%, 366px;
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-name: tp-fff-icon;
  animation-name: tp-fff-icon;
  animation-delay: 0.5s;
}
@-webkit-keyframes tp-fff-icon {
  0% {
    stroke-dasharray: 0%, 366px;
  }
  100% {
    stroke-dasharray: 250%, 366px;
  }
}
@-moz-keyframes tp-fff-icon {
  0% {
    stroke-dasharray: 0%, 366px;
  }
  100% {
    stroke-dasharray: 250%, 366px;
  }
}
@-ms-keyframes tp-fff-icon {
  0% {
    stroke-dasharray: 0%, 366px;
  }
  100% {
    stroke-dasharray: 250%, 366px;
  }
}
@keyframes tp-fff-icon {
  0% {
    stroke-dasharray: 0%, 366px;
  }
  100% {
    stroke-dasharray: 250%, 366px;
  }
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-fun-fact-area-3 {
    padding-top: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-fun-fact-area-3 {
    padding-top: 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-fun-fact-content-2 {
    padding-left: 0;
  }
}
.tp-fun-fact-content-2 h4 {
  font-weight: 600;
  font-size: 48px;
  letter-spacing: -0.01em;
  color: var(--tp-common-white);
  margin-bottom: 15px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-fun-fact-content-2 h4 {
    font-size: 40px;
  }
}
.tp-fun-fact-content-2 p {
  font-weight: 400;
  font-size: 18px;
  color: #A8BBFF;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-fun-fact-content-2 p {
    font-size: 17px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-fun-fact-content-3 {
    padding-left: 0;
  }
}
.tp-fun-fact-content-3 h4 {
  font-weight: 600;
  font-size: 48px;
  letter-spacing: -0.01em;
  color: #161616;
  margin-bottom: 15px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-fun-fact-content-3 h4 {
    font-size: 40px;
  }
}
.tp-fun-fact-content-3 p {
  font-weight: 400;
  font-size: 18px;
  color: #5E626A;
}
.tp-fun-fact-icon-2 span {
  width: 70px;
  height: 70px;
  display: inline-block;
  border-radius: 50%;
  text-align: center;
  line-height: 70px;
  margin-bottom: 20px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.21) 0%, rgba(255, 255, 255, 0) 100%);
  box-shadow: 0px 8px 25px rgba(2, 8, 29, 0.11);
}
.tp-fun-fact-icon-2 span img {
  transform: translateY(-6px);
}
.tp-fun-fact-border-2-1::before {
  position: absolute;
  width: 3px;
  height: 245px;
  content: "";
  background: rgba(248, 248, 248, 0.08);
  border-radius: 10px;
  right: 45px;
  top: -20px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-fun-fact-border-2-1::before {
    right: 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-fun-fact-border-2-1::before {
    display: none;
  }
}
.tp-fun-fact-border-2-2::before {
  position: absolute;
  width: 3px;
  height: 245px;
  content: "";
  background: rgba(248, 248, 248, 0.08);
  border-radius: 10px;
  right: 5px;
  top: -20px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-fun-fact-border-2-2::before {
    display: none;
  }
}
.tp-fun-fact-border-2-3::before {
  position: absolute;
  width: 3px;
  height: 245px;
  content: "";
  background: rgba(248, 248, 248, 0.08);
  border-radius: 10px;
  right: 0px;
  top: -20px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-fun-fact-border-2-3::before {
    display: none;
  }
}
.tp-fun-fact-icon-3 span {
  background: #FFFFFF;
  border: 1px solid #F5F5F5;
  box-shadow: 0px 40px 34px rgba(29, 40, 78, 0.06);
  width: 70px;
  height: 70px;
  display: block;
  border-radius: 50%;
  text-align: center;
  line-height: 4;
  margin-bottom: 20px;
}
.tp-fun-fact-border::before {
  position: absolute;
  width: 3px;
  height: 245px;
  content: "";
  background: #F8F8F8;
  border: 1px solid #F1F2F7;
  border-radius: 10px;
  right: 45px;
  top: -20px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-fun-fact-border::before {
    right: 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-fun-fact-border::before {
    display: none;
  }
}
.tp-fun-fact-border-2::before {
  position: absolute;
  width: 3px;
  height: 245px;
  content: "";
  background: #F8F8F8;
  border: 1px solid #F1F2F7;
  border-radius: 10px;
  right: 5px;
  top: -20px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-fun-fact-border-2::before {
    right: 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-fun-fact-border-2::before {
    display: none;
  }
}
.tp-fun-fact-border-3::before {
  position: absolute;
  width: 3px;
  height: 245px;
  content: "";
  background: #F8F8F8;
  border: 1px solid #F1F2F7;
  border-radius: 10px;
  right: 0px;
  top: -20px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-fun-fact-border-3::before {
    right: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-fun-fact-border-3::before {
    display: none;
  }
}

/*----------------------------------------*/
/*  7.7 Faq css
/*----------------------------------------*/
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-faq-area {
    padding-bottom: 80px;
  }
}
.tp-faq-area .tp-section__title {
  margin-bottom: 45px;
}

.tp-custom-accordion .accordion-items:not(.collapsed) {
  background: var(--tp-common-white);
  border: 1px solid rgba(4, 18, 31, 0.08);
  border-radius: 10px;
  margin-bottom: 16px;
  transition: all 0.3s ease;
}
.tp-custom-accordion .accordion-items.tp-faq-active {
  box-shadow: 0px 14px 50px rgba(4, 11, 17, 0.12);
}
.tp-custom-accordion .accordion-buttons,
.tp-custom-accordion .accordion-buttons.collapsed {
  position: relative;
  width: 100%;
  font-family: "Outfit";
  text-align: left;
  font-weight: 500;
  font-size: 22px;
  line-height: 28px;
  color: #000D44;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-custom-accordion .accordion-buttons,
  .tp-custom-accordion .accordion-buttons.collapsed {
    font-size: 17px;
    padding: 22px 38px 20px 20px;
  }
}
.tp-custom-accordion .accordion-buttons::after,
.tp-custom-accordion .accordion-buttons.collapsed::after {
  position: absolute;
  content: "\f077";
  font-family: "Font Awesome 5 Pro";
  background-image: none;
  top: 32px;
  right: 45px;
  width: auto;
  height: auto;
  font-weight: 400;
  font-size: 20px;
  letter-spacing: 0.05em;
  color: #162DE4;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-custom-accordion .accordion-buttons::after,
  .tp-custom-accordion .accordion-buttons.collapsed::after {
    top: 30px;
    right: 18px;
  }
}
.tp-custom-accordion .accordion-buttons.collapsed,
.tp-custom-accordion .accordion-buttons.collapsed.collapsed {
  background-color: var(--tp-common-white);
}
.tp-custom-accordion .accordion-buttons.collapsed::after,
.tp-custom-accordion .accordion-buttons.collapsed.collapsed::after {
  color: #000D44;
  content: "\f078";
}
.tp-custom-accordion .accordion-buttons {
  width: 100%;
  font-family: "Outfit";
  text-align: left;
  font-weight: 500;
  font-size: 22px;
  line-height: 28px;
  color: blue;
  padding: 31px 45px;
  border-radius: 10px 10px 0 0;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-custom-accordion .accordion-buttons {
    font-size: 20px;
    padding: 30px 45px 20px 25px;
  }
}
.tp-custom-accordion .collapsed {
  border-radius: 10px 10px 10px 10px;
}
.tp-custom-accordion .accordion-body {
  padding: 0 70px 55px 45px;
  position: relative;
  z-index: 1;
  border-radius: 0 0 10px 10px;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #727885;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-custom-accordion .accordion-body {
    padding: 0px 42px 45px 32px;
  }
}

.faq-accordion-border .accordion-items {
  background-color: #FFF;
  border: 1px solid #F5F5F5;
  border-radius: 10px;
}

/*----------------------------------------*/
/* 7.8 Features css
/*----------------------------------------*/
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-features-area {
    padding-bottom: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-features-area {
    padding-bottom: 0;
  }
}
.tp-features-wrapper {
  margin-top: -110px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-features-wrapper {
    margin-top: -125px;
    margin-bottom: 160px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-features-wrapper {
    margin-bottom: 120px;
  }
}
@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), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-features-wrapper p br {
    display: none;
  }
}
.tp-features-icon span {
  position: relative;
  margin-top: 15px;
  height: 78px;
  width: 78px;
  background: var(--tp-common-white);
  box-shadow: 0px 8px 18px rgba(44, 52, 128, 0.12);
  border-radius: 88px;
  display: inline-block;
  line-height: 78px;
  text-align: center;
  font-size: 30px;
  -webkit-text-fill-color: transparent;
  background-image: var(--tp-gradient-primary);
  -webkit-background-clip: text;
}
.tp-features-icon span img {
  transform: translateY(-2px);
}
.tp-features-icon span::before {
  content: "";
  position: absolute;
  height: 102px;
  width: 102px;
  background: var(--tp-common-white);
  box-shadow: 0px 8px 18px rgba(44, 52, 128, 0.12);
  border-radius: 88px;
  left: -12px;
  top: -12px;
  z-index: -1;
}
.tp-features-title {
  font-weight: 600;
  font-size: 20px;
  line-height: 30px;
}

.fml {
  margin-left: 70px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .fml {
    margin-left: 50px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .fml {
    margin-left: 15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .fml {
    margin-left: 0px;
  }
}

.fml-2 {
  margin-left: 120px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .fml-2 {
    margin-left: 105px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .fml-2 {
    margin-left: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .fml-2 {
    margin-left: 0px;
  }
}

.tp-feature-area {
  background: no-repeat;
  background-size: cover;
}
.tp-feature-wrapper .tp-section__title-pre-3 {
  background: #272727;
  color: var(--tp-common-white);
  box-shadow: none;
  border: none;
}
.tp-feature-wrapper .tp-section__title {
  color: var(--tp-common-white);
  margin-bottom: 50px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-feature-wrapper .tp-section__title br {
    display: none;
  }
}

.row-custom {
  display: flex;
  margin: 0 -15px;
  padding-left: 30px;
  padding-right: 30px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .row-custom {
    padding: 0;
    flex-wrap: wrap;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .row-custom {
    flex-direction: column;
    width: 100%;
    padding-left: 0px;
    padding-right: 0px;
  }
}

.col-custom {
  position: relative;
  flex: 1;
  width: 176px;
  height: 506px;
  margin: 15px;
  padding: 48px 52px 0 50px;
  transition: 0.5s;
  cursor: pointer;
  overflow: hidden;
  background: #171717;
  border-radius: 10px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .col-custom {
    padding: 40px 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .col-custom {
    padding: 40px 15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .col-custom {
    width: 15%;
    padding: 40px 25px;
    flex: 0 0 15%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .col-custom {
    width: 25%;
    padding: 40px 25px;
    flex: 0 0 25%;
  }
}
@media only screen and (min-width: 398px) and (max-width: 575px) {
  .col-custom {
    width: 100%;
    padding: 36px 40px;
  }
}
@media (max-width: 397px) {
  .col-custom {
    width: 100%;
    padding: 36px 15px;
  }
}
.col-custom::before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  border-radius: 10px;
  height: 100%;
  width: 100%;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease-in-out;
}
.col-custom.active {
  flex: 4;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .col-custom.active {
    flex: 5;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .col-custom.active {
    flex: 0 0 55%;
    width: 55%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .col-custom.active {
    flex: 0 0 63%;
    width: 55%;
  }
}
.col-custom.active .tp-panel-item {
  display: none;
}
.col-custom.active .tp-panel-item-2 {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}
.col-custom.active::before {
  visibility: visible;
  opacity: 1;
}

.tp-panel-title {
  width: 240px;
  transform: rotate(90deg) translate(145px, 80px);
  font-weight: 600;
  font-size: 26px;
  color: #fff;
  margin-bottom: 0;
}
@media (max-width: 575px) {
  .tp-panel-title {
    transform: rotate(90deg) translate(145px, -10px);
  }
}
.tp-panel-title.child-one {
  transform: rotate(90deg) translate(172px, 100px);
  width: 275px;
}
@media (max-width: 575px) {
  .tp-panel-title.child-one {
    transform: rotate(90deg) translate(172px, 7px);
  }
}
.tp-panel-title.child-two {
  transform: rotate(90deg) translate(172px, 100px);
  width: 275px;
}
@media (max-width: 575px) {
  .tp-panel-title.child-two {
    transform: rotate(90deg) translate(172px, 10px);
  }
}
.tp-panel-title.child-three {
  transform: rotate(90deg) translate(180px, 104px);
  width: 290px;
}
@media (max-width: 575px) {
  .tp-panel-title.child-three {
    transform: rotate(90deg) translate(180px, 23px);
  }
}
.tp-panel-title.child-four {
  transform: rotate(90deg) translate(146px, 104px);
  width: 290px;
}
@media (max-width: 575px) {
  .tp-panel-title.child-four {
    transform: rotate(90deg) translate(146px, 20px);
  }
}

.tp-panel-content {
  text-align: center;
}
.tp-panel-content span {
  font-weight: 700;
  font-size: 26px;
  line-height: 28px;
  color: var(--tp-common-white);
}

.tp-panel-content-2 .tp-panel-shape {
  position: absolute;
  bottom: -85px;
  left: -50px;
  z-index: -1;
}
.tp-panel-content-2 .tp-panel-icon {
  margin-bottom: 40px;
}
.tp-panel-content-2 p {
  font-weight: 400;
  font-size: 20px;
  color: var(--tp-common-white);
  margin-bottom: 83px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-panel-content-2 p {
    font-size: 18px;
  }
}
.tp-panel-content-2 i {
  font-weight: 900;
  font-size: 16px;
  height: 54px;
  width: 54px;
  color: #161616;
  line-height: 54px;
  background: var(--tp-common-white);
  border-radius: 50%;
  display: inline-block;
  text-align: center;
  margin-right: 10px;
}
.tp-panel-content-2 span {
  font-weight: 600;
  font-size: 15px;
  color: #FFFFFF;
}

.tp-panel-title-2 {
  font-weight: 600;
  font-size: 26px;
  color: var(--tp-common-white);
  margin-bottom: 30px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-panel-title-2 {
    font-size: 22px;
  }
}

.tp-panel-item-2 {
  opacity: 0;
  visibility: hidden;
  transition: 0.3s;
  transform: scale(0.7);
  width: 290px;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-panel-item-2 {
    width: 290px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-panel-item-2 {
    width: 100%;
  }
}

/* line animation css - start
================================================== */
.tp-line-wrapper {
  position: fixed;
  top: 0;
  left: 50%;
  bottom: 0px;
  margin: auto;
  width: calc(100% - 400px);
  z-index: -1;
  transform: translateX(-50%);
  border-left: 1px solid #EEF3F8;
}
@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) {
  .tp-line-wrapper {
    width: calc(100% - 200px);
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-line-wrapper {
    width: calc(100% - 80px);
  }
}
.tp-line-wrapper::before {
  width: 1px;
  right: 0;
  content: "";
  height: 100px;
  position: absolute;
  background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.5), transparent);
  animation: line_anim_2 15s ease-out infinite alternate;
  z-index: 1;
}
.tp-line-item {
  width: 12.5%;
  float: left;
  height: 100%;
  position: relative;
  border-right: 1px solid #EEF3F8;
  /* for animation */
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-line-item {
    width: 20.5%;
  }
}
.tp-line-item::before {
  width: 1px;
  left: 0;
  content: "";
  height: 100px;
  position: absolute;
  background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.3), transparent);
}
.tp-line-item:nth-child(even)::before {
  animation: line_anim 15s ease-out infinite alternate;
  background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.3), transparent);
}
.tp-line-item:nth-child(odd)::before {
  animation: line_anim_2 15s ease-out infinite;
}
@-webkit-keyframes line_anim {
  0% {
    top: 0;
    opacity: 1;
  }
  50% {
    top: 50%;
  }
  90% {
    opacity: 1;
  }
  100% {
    top: 100%;
    opacity: 0.5;
  }
}
@-moz-keyframes line_anim {
  0% {
    top: 0;
    opacity: 1;
  }
  50% {
    top: 50%;
  }
  90% {
    opacity: 1;
  }
  100% {
    top: 100%;
    opacity: 0.5;
  }
}
@-ms-keyframes line_anim {
  0% {
    top: 0;
    opacity: 1;
  }
  50% {
    top: 50%;
  }
  90% {
    opacity: 1;
  }
  100% {
    top: 100%;
    opacity: 0.5;
  }
}
@keyframes line_anim {
  0% {
    top: 0;
    opacity: 1;
  }
  50% {
    top: 50%;
  }
  90% {
    opacity: 1;
  }
  100% {
    top: 100%;
    opacity: 0.5;
  }
}
@-webkit-keyframes line_anim_2 {
  0% {
    opacity: 1;
    bottom: 0;
  }
  50% {
    bottom: 50%;
  }
  90% {
    opacity: 1;
  }
  100% {
    bottom: 100%;
    opacity: 0.5;
  }
}
@-moz-keyframes line_anim_2 {
  0% {
    opacity: 1;
    bottom: 0;
  }
  50% {
    bottom: 50%;
  }
  90% {
    opacity: 1;
  }
  100% {
    bottom: 100%;
    opacity: 0.5;
  }
}
@-ms-keyframes line_anim_2 {
  0% {
    opacity: 1;
    bottom: 0;
  }
  50% {
    bottom: 50%;
  }
  90% {
    opacity: 1;
  }
  100% {
    bottom: 100%;
    opacity: 0.5;
  }
}
@keyframes line_anim_2 {
  0% {
    opacity: 1;
    bottom: 0;
  }
  50% {
    bottom: 50%;
  }
  90% {
    opacity: 1;
  }
  100% {
    bottom: 100%;
    opacity: 0.5;
  }
}

/*----------------------------------------*/
/*  7.9 Hero css
/*----------------------------------------*/
.tp-hero-height {
  min-height: 1100px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-height {
    min-height: 870px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-hero-height {
    min-height: 740px;
  }
}

.tp-hero-bg {
  position: absolute;
  height: 100%;
  width: 100%;
  bottom: 0;
  left: 0;
  background-repeat: no-repeat;
  z-index: -1;
}
.tp-hero-content {
  margin-bottom: 135px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-content {
    margin-bottom: 0;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-hero-content {
    margin-bottom: 50px;
  }
}
.tp-hero-title {
  font-weight: 600;
  font-size: 75px;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--tp-common-white);
  text-shadow: 0px 4px 4px rgba(14, 15, 72, 0.15);
  margin-bottom: 45px;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-title {
    font-size: 65px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-hero-title {
    font-size: 37px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-hero-title br {
    display: none;
  }
}
.tp-hero-btn-wrapper {
  display: flex;
}
.tp-hero-btn-wrapper .tp-btn-video {
  margin-left: 30px;
}
.tp-hero-btn-wrapper i {
  height: 70px;
  width: 70px;
  line-height: 70px;
  border: 1px solid rgba(255, 255, 255, 0.17);
  border-radius: 50%;
  display: inline-block;
  text-align: center;
  margin-right: 15px;
  animation: pulse 2s infinite;
  background: linear-gradient(90deg, #9EFBD3 0%, #57E9F2 48%, #45D4FB 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 900;
  font-size: 18px;
}
.tp-hero-btn-wrapper span {
  font-weight: 600;
  font-size: 14px;
  line-height: 15px;
  letter-spacing: 0.135em;
  text-transform: uppercase;
  color: var(--tp-common-white);
  margin: 0;
}

.tp-hero-area-2 {
  position: relative;
  z-index: 2;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-area-2 {
    padding-top: 120px;
  }
}
@media (max-width: 575px) {
  .tp-hero-area-2 {
    padding-top: 50px;
  }
}
.tp-hero-content-2 .tp-hero-title {
  margin-bottom: 30px;
  text-shadow: 0px 4px 4px rgba(14, 15, 72, 0.15);
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-content-2 .tp-hero-title {
    font-size: 70px;
  }
}
.tp-hero-content-2 p {
  font-weight: 400;
  font-size: 20px;
  line-height: 30px;
  letter-spacing: -0.02em;
  color: #BEB2E7;
  margin-bottom: 35px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-hero-content-2 p br {
    display: none;
  }
}
.tp-hero-thumb-main {
  margin-right: -25px;
  margin-top: 0px;
  object-fit: cover;
  max-width: 100%;
  border-radius: 50%;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-hero-thumb-main {
    margin-right: 15px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-thumb-main {
    margin-top: -60px;
    max-width: 90%;
    margin-right: 20px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-thumb-main {
    margin-right: 30px;
    margin-top: -35px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-thumb-main {
    margin-right: 138px;
    margin-top: 30px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
    .tp-hero-thumb-main {
        margin-right: 0;
        margin-top: 25px;
        display: none;
    }
}
@media (max-width: 575px) {
  .tp-hero-thumb-main {
    margin-top: 30px;
    margin-right: 0;
    display:none
  }
}
.tp-hero-thumb span::after {
  background: #FF3A8A;
  content: "";
  height: 538px;
  width: 539px;
  top: -10px;
  left:35px;
  border-radius: 100%;
  z-index: -1;
  transition: 0.3s ease;
  position: absolute;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-hero-thumb span::after {
    left: 56px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-thumb span::after {
    top: -40px;
    left: 20px;
    height: 476px;
    width: 477px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-thumb span::after {
    height: 444px;
    width: 447px;
    top: -22px;
    left: -42px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-thumb span::after {
    height: 527px;
    width: 538px;
    top: 60px;
    left: -12px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-thumb span::after {
    height: 500px;
    width: 495px;
    top: 42px;
    left: -10px;
  }
}
@media (max-width: 575px) {
  .tp-hero-thumb span::after {
    display: none;
  }
}
.tp-hero-thumb-shape::before {
  background: #34B2F3;
  content: "";
  height: 545px;
  width: 532px;
  top: -10px;
  left: 56px;
  border-radius: 100%;
  z-index: -1;
  transition: 0.3s ease;
  position: absolute;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-hero-thumb-shape::before {
    left: 45px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-thumb-shape::before {
    top: -70px;
    left: 4px;
    height: 483px;
    width: 486px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-thumb-shape::before {
    height: 446px;
    width: 440px;
    top: -40px;
    left: -54px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-thumb-shape::before {
    height: 540px;
    width: 553px;
    top: 22px;
    left: -20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-thumb-shape::before {
    height: 510px;
    width: 517px;
    top: 20px;
    left: -20px;
  }
}
@media (max-width: 575px) {
  .tp-hero-thumb-shape::before {
    display: none;
  }
}
.tp-hero-thumb::after {
  background: #7924C8;
  content: "";
  height: 544px;
  width: 547px;
  top: -10px;
  right: -40px;
  border-radius: 100%;
  z-index: -1;
  transition: 0.3s ease;
  position: absolute;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-hero-thumb::after {
    right: 0;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-thumb::after {
    height: 480px;
    top: -66px;
    right: 1px;
    width: 475px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-thumb::after {
    height: 439px;
    width: 433px;
    top: -40px;
    right: 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-thumb::after {
    height: 536px;
    width: 560px;
    top: 24px;
    right: 110px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-thumb::after {
    height: 500px;
    width: 484px;
    top: 20px;
    right: -20px;
  }
}
@media (max-width: 575px) {
  .tp-hero-thumb::after {
    display: none;
  }
}
.tp-hero-shape img {
  position: absolute;
  right: -110px;
  top: 22%;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-shape img {
    right: -35px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-shape img {
    right: -12px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-shape img {
    right: 22px;
    top: 40%;
  }
}
.tp-hero-shape-1 {
  position: absolute;
  bottom: 0;
  left: 1px;
  right: auto;
  z-index: -1;
}
.tp-hero-shape-1 img {
  max-width: 100%;
}
.tp-hero-blur-effect .hero-blur {
  position: absolute;
  top: -150px;
  z-index: -1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-blur-effect .hero-blur {
    left: -230px;
  }
}
.tp-hero-blur-effect .hero-blur img {
  max-width: 100%;
}

.tp-left-shape {
  position: absolute;
  left: 0;
  bottom: 30px;
  z-index: -1;
}
@media only screen and (min-width: 1600px) and (max-width: 1699px), only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-left-shape {
    bottom: 0;
    left: -200px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-left-shape {
    bottom: 0;
    left: -400px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-left-shape {
    bottom: 85px;
    left: -560px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-left-shape {
    display: none;
  }
}

.tp-right-shape {
  position: absolute;
  top: 0;
  right: 0;
  z-index: -1;
  max-width: 100%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-right-shape {
    top: -25px;
  }
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-area-3 {
    padding-top: 210px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-area-3 {
    padding-top: 160px;
    padding-bottom: 0;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-hero-area-3 {
    padding-top: 160px;
    padding-bottom: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-content-3 {
    margin-bottom: 60px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-hero-content-3 {
    margin-bottom: 40px;
  }
}
.tp-hero-content-3 .tp-hero-title {
  font-size: 62px;
  line-height: 122.4%;
  letter-spacing: -0.03em;
  color: #161616;
  margin-bottom: 26px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-content-3 .tp-hero-title {
    font-size: 60px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-hero-content-3 .tp-hero-title {
    font-size: 48px;
  }
}
.tp-hero-content-3 p {
  color: #6A6A74;
  margin-bottom: 40px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-hero-content-3 p br {
    display: none;
  }
}
.tp-hero-content-3 .tp-btn-black {
  padding: 15px 43px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-hero-content-3 .tp-btn-black {
    margin-bottom: 10px;
  }
}
.tp-hero-content-3 .tp-btn-sm-blue {
  margin-right: 15px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-content-3 .tp-btn-sm-blue {
    padding: 15px 45px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-hero-content-3 .tp-btn-sm-blue {
    margin-bottom: 10px;
  }
}
.tp-hero-thumb-3-main {
  margin-left: 70px;
  margin-top: -25px;
  object-fit: cover;
  max-width: 100%;
  border-radius: 50%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-thumb-3-main {
    margin-left: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-hero-thumb-3-main {
    margin-left: 0;
    margin-top: 0;
  }
}
.tp-hero-thumb-3-shape-top .tp-shape-top {
  top: -26px;
  right: 65px;
  position: absolute;
  box-shadow: 0px 30px 50px 0px rgba(0, 10, 38, 0.16);
  animation: hero-bounce-updown 5s infinite both;
}
.tp-hero-thumb-3-shape-top .tp-shape-top img {
  border-radius: 10px;
  box-shadow: 0px 25px 40px rgba(0, 0, 0, 0.1);
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-hero-thumb-3-shape-top .tp-shape-top {
    top: -5px;
    right: 60px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-thumb-3-shape-top .tp-shape-top {
    top: 0px;
    right: -40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-thumb-3-shape-top .tp-shape-top {
    top: -15px;
    right: -20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-thumb-3-shape-top .tp-shape-top {
    top: 25px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-thumb-3-shape-top .tp-shape-top {
    top: 20px;
    right: -25px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-hero-thumb-3-shape-top .tp-shape-top {
    display: none;
  }
}
.tp-hero-thumb-3-shape-center .tp-shape-center {
  position: absolute;
  top: 155px;
  right: -58px;
  animation: hero-bounce-leftright 3s infinite linear;
}
.tp-hero-thumb-3-shape-center .tp-shape-center img {
  box-shadow: 0px 15px 45px rgba(77, 62, 62, 0.29);
  border-radius: 20px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-hero-thumb-3-shape-center .tp-shape-center {
    top: 182px;
    right: -50px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-thumb-3-shape-center .tp-shape-center {
    right: -40px;
    top: 255px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-hero-thumb-3-shape-center .tp-shape-center {
    display: none;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-hero-thumb-3-shape-center .tp-shape-center {
    top: 190px;
    right: -30px;
  }
}
.tp-hero-thumb-3-shape-end .tp-shape-end {
  position: absolute;
  bottom: 25px;
  right: 40px;
  animation: hero-bounce-updown 3s infinite both;
}
.tp-hero-thumb-3-shape-end .tp-shape-end img {
  box-shadow: 0px 25px 40px rgba(0, 0, 0, 0.1);
  border-radius: 10px;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-hero-thumb-3-shape-end .tp-shape-end {
    bottom: 5px;
    right: 40px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-hero-thumb-3-shape-end .tp-shape-end {
    bottom: -55px;
    right: -10px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-hero-thumb-3-shape-end .tp-shape-end {
    bottom: 0px;
    right: -20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-hero-thumb-3-shape-end .tp-shape-end {
    bottom: 15px;
    right: -25px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-hero-thumb-3-shape-end .tp-shape-end {
    display: none;
  }
}

/*----------------------------------------*/
/*  7.10 Portfolio css
/*----------------------------------------*/
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-portfolio-area {
    padding-top: 35px;
    padding-bottom: 90px;
  }
}
.tp-portfolio-section-wrapper .tp-section__title-pre {
  padding: 5px 12px;
}
.tp-portfolio-item {
  background: var(--tp-common-white);
  box-shadow: 0px 11px 13px rgba(50, 56, 112, 0.07);
  border-radius: 20px;
}
.tp-portfolio-content {
  padding: 40px 50px 20px 30px;
  transition: 0.3s ease;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-portfolio-content {
    padding: 40px 40px 20px 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-portfolio-content {
    padding: 25px 20px 20px 20px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-portfolio-content {
    padding: 10px 45px 15px 15px;
  }
}
.tp-portfolio-content:hover a {
  background-size: 0 2px, 100% 2px;
  color: var(--tp-heading-primary);
}
.tp-portfolio-content:hover .tp-portfolio-btn span {
  color: var(--tp-theme-secondary);
}
.tp-portfolio-inner h4 {
  font-weight: 600;
  font-size: 28px;
  line-height: 1.4;
  letter-spacing: -0.01em;
  color: var(--tp-heading-primary);
  margin-bottom: 20px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-portfolio-inner h4 {
    font-size: 24px;
  }
}
.tp-portfolio-inner h4 a {
  background-image: linear-gradient(#03041C, #03041C), linear-gradient(#03041C, #03041C);
  background-size: 0% 2px, 0 2px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.4s linear;
}
.tp-portfolio-inner p {
  color: var(--tp-text-2);
  margin-bottom: 0;
}
.tp-portfolio-thumb {
  overflow: hidden;
  border-radius: 20px 20px 0 0;
}
.tp-portfolio-thumb img {
  border-radius: 20px 20px 0 0;
  overflow: hidden;
  max-width: 100%;
  -webkit-transition: all 0.5s ease-out 0s;
  -moz-transition: all 0.5s ease-out 0s;
  -ms-transition: all 0.5s ease-out 0s;
  -o-transition: all 0.5s ease-out 0s;
  transition: all 0.5s ease-out 0s;
}
.tp-portfolio-thumb img:hover {
  transform: scale(1.1);
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-portfolio-buttons {
    padding-left: 0;
  }
}

/*----------------------------------------*/
/* portfolio Slider css
/*----------------------------------------*/
.tp-portfolio-active .slick-list {
  overflow: visible;
}
.tp-portfolio-active .slick-slide {
  margin: 0px 17px;
}

.tp-portfolio-active .slick-next.slick-arrow i {
  position: absolute;
  z-index: 2;
  top: 50%;
  transform: translateY(-50%);
  right: -5%;
  background: var(--tp-common-white);
  color: #B3B6C4;
  transition: 0.3s ease;
  height: 70px;
  width: 70px;
  border-radius: 50%;
  line-height: 3.5;
  font-size: 20px;
  box-shadow: 0px 7px 13px rgba(44, 65, 97, 0.13);
}
.tp-portfolio-active .slick-next.slick-arrow i:hover {
  color: #030A39;
}
.tp-portfolio-active .slick-prev.slick-arrow i {
  position: absolute;
  z-index: 2;
  top: 50%;
  transform: translateY(-50%);
  left: -5%;
  background: var(--tp-common-white);
  color: #B3B6C4;
  transition: 0.3s ease;
  height: 70px;
  width: 70px;
  border-radius: 50%;
  line-height: 3.5;
  font-size: 20px;
  box-shadow: 0px 7px 13px rgba(44, 65, 97, 0.13);
}
.tp-portfolio-active .slick-prev.slick-arrow i:hover {
  color: #030A39;
}

.tp-portfolio-area-2 {
  overflow: hidden;
}
.tp-portfolio-wrapper-2 .tp-section__title-pre {
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
  margin-bottom: 22px;
  color: var(--tp-common-white);
}
.tp-portfolio-wrapper-2 .tp-section__title {
  color: var(--tp-common-white);
  font-size: 54px;
  margin-bottom: 50px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-portfolio-wrapper-2 .tp-section__title br {
    display: none;
  }
}
@media (max-width: 575px) {
  .tp-portfolio-wrapper-2 .tp-section__title {
    font-size: 38px;
  }
}
.tp-portfolio-blur-effect .portfolio-blur-1 {
  position: absolute;
  top: 162px;
  left: -90px;
}
.tp-portfolio-blur-effect img {
  max-width: 100%;
}
.tp-portfolio-item-2 {
  position: relative;
}
.tp-portfolio-item-2 .tp-portfolio-content-2 {
  position: absolute;
  bottom: 30px;
  left: 40px;
  z-index: 1;
  transition: all 0.3s ease-in-out;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-portfolio-item-2 .tp-portfolio-content-2 {
    left: 20px;
    bottom: 20px;
    width: 85%;
  }
}
@media (max-width: 575px) {
  .tp-portfolio-item-2 .tp-portfolio-content-2 {
    left: 12px;
    bottom: 12px;
    width: 80%;
  }
}
.tp-portfolio-item-2 .tp-portfolio-category {
  font-family: var(--tp-ff-heading);
  background: #FF3A8A;
  font-size: 12px;
  padding: 11px 25px;
  font-weight: 700;
  color: var(--tp-common-white);
  line-height: 15px;
  letter-spacing: 0.075em;
  text-transform: uppercase;
  display: inline-block;
  position: relative;
}
.tp-portfolio-item-2 .tp-portfolio-title {
  font-family: var(--tp-ff-heading);
  background: #7924C8;
  font-weight: 600;
  font-size: 26px;
  line-height: 32px;
  letter-spacing: -0.02em;
  color: var(--tp-common-white);
  padding: 25px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-portfolio-item-2 .tp-portfolio-title {
    padding: 15px 20px;
  }
}
@media (max-width: 575px) {
  .tp-portfolio-item-2 .tp-portfolio-title {
    padding: 10px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-portfolio-item-2 .tp-portfolio-title {
    font-size: 20px;
  }
}
.tp-portfolio-item-2 .tp-portfolio-title a {
  background-image: linear-gradient(#fff, #fff), linear-gradient(#fff, #fff);
  background-size: 0% 2px, 0 2px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.3s linear;
}
.tp-portfolio-item-2 .tp-portfolio-title a:hover {
  background-size: 0 2px, 100% 2px;
}
.tp-portfolio-thumb-2 img {
  max-width: 100%;
}
.tp-portfolio-thumb-4 img {
  border-radius: 10px;
  max-width: 100%;
}

.tp-portfolio-wrapper-3 .tp-section__title {
  color: #161616;
  margin-bottom: 35px;
}
.tp-portfolio-item-3 {
  background: #FFFFFF;
  box-shadow: 0px 11px 13px rgba(50, 56, 112, 0.07);
  border-radius: 20px;
}
.tp-portfolio-thumb-3 {
  overflow: hidden;
  border-radius: 20px 20px 0 0;
}
.tp-portfolio-thumb-3 img {
  border-radius: 20px 20px 0 0;
  transition: all 0.3s ease-out;
  min-width: 100%;
}
.tp-portfolio-thumb-3 img:hover {
  transform: scale(1.05);
}
.tp-portfolio-content-3 {
  padding: 27px 34px 42px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-portfolio-content-3 {
    padding: 25px 20px;
  }
}
.tp-portfolio-content-3 h3 {
  font-weight: 600;
  font-size: 28px;
  letter-spacing: -0.01em;
  color: #161616;
  margin-bottom: 20px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-portfolio-content-3 h3 {
    font-size: 25px;
  }
}
.tp-portfolio-content-3 h3 a {
  background-image: linear-gradient(#03041C, #03041C), linear-gradient(#03041C, #03041C);
  background-size: 0% 2px, 0 2px;
  background-position: 100% 100%, 0 100%;
  background-repeat: no-repeat;
  transition: background-size 0.4s linear;
}
.tp-portfolio-content-3 h3 a:hover {
  background-size: 0 2px, 100% 2px;
}
.tp-portfolio-buttons .tp-portfolio-btn {
  border: 1px solid #E6EEFB;
  border-radius: 5px;
  display: inline-block;
  font-weight: 500;
  font-size: 14px;
  color: #BBC0CD;
  padding: 2px 11px;
  margin-right: 8px;
  transition: 0.3s ease;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-portfolio-buttons .tp-portfolio-btn {
    margin-bottom: 10px;
  }
}
.tp-portfolio-buttons .tp-portfolio-btn::before {
  position: absolute;
  content: "";
  width: 100%;
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  top: 0;
  left: 0;
  height: 100%;
  border-radius: 5px;
  opacity: 0;
  color: var(--tp-common-white);
  transition: 0.3s ease;
  z-index: -1;
}
.tp-portfolio-buttons .tp-portfolio-btn:hover {
  color: var(--tp-common-white);
}
.tp-portfolio-buttons .tp-portfolio-btn:hover::before {
  opacity: 1;
}

.tp-portfolio-active-3 .slick-list {
  margin: 0 -20px;
}
.tp-portfolio-active-3 .slick-slide {
  margin: 0 20px;
}

.tp-portfolio-active-3 .slick-next.slick-arrow i {
  position: absolute;
  z-index: 2;
  top: 50%;
  transform: translateY(-50%);
  right: -7%;
  background: var(--tp-common-white);
  color: #B3B6C4;
  transition: 0.3s ease;
  height: 70px;
  width: 70px;
  border-radius: 50%;
  line-height: 3.5;
  font-size: 20px;
  box-shadow: 0px 7px 13px rgba(44, 65, 97, 0.13);
}
@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) {
  .tp-portfolio-active-3 .slick-next.slick-arrow i {
    right: -3%;
  }
}
.tp-portfolio-active-3 .slick-next.slick-arrow i:hover {
  color: #030A39;
}
.tp-portfolio-active-3 .slick-prev.slick-arrow i {
  position: absolute;
  z-index: 2;
  top: 50%;
  transform: translateY(-50%);
  left: -7%;
  background: var(--tp-common-white);
  color: #B3B6C4;
  transition: 0.3s ease;
  height: 70px;
  width: 70px;
  border-radius: 50%;
  line-height: 3.5;
  font-size: 20px;
  box-shadow: 0px 7px 13px rgba(44, 65, 97, 0.13);
}
@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) {
  .tp-portfolio-active-3 .slick-prev.slick-arrow i {
    left: -3%;
  }
}
.tp-portfolio-active-3 .slick-prev.slick-arrow i:hover {
  color: #030A39;
}

/*----------------------------------------*/
/*  7.11 Pricing css 
/*----------------------------------------*/
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-pricing-area {
    padding-top: 80px;
  }
}
.tp-pricing-wrapper .tp-section__title-pre-3 {
  margin-bottom: 25px;
}
.tp-pricing-wrapper .tp-section__title {
  font-weight: 600;
  font-size: 54px;
  letter-spacing: -0.03em;
  color: #161616;
  line-height: 1.1;
  margin-bottom: 40px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-pricing-wrapper .tp-section__title {
    font-size: 38px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-pricing-wrapper .tp-section__title br {
    display: none;
  }
}
.tp-pricing-tab-nav {
  padding: 14px 10px;
  background-color: #EEEEEE;
  border-radius: 5px;
  width: 400px;
}
@media (max-width: 397px) {
  .tp-pricing-tab-nav {
    width: 100%;
    height: 60px;
  }
}
.tp-pricing-tab-nav .tp-price-tab-bg-slide {
  display: inline-block;
  position: absolute;
  top: -6px;
  right: -19px;
  width: 150px;
  height: 38px;
  color: var(--tp-common-black);
  background-color: var(--tp-common-white);
  box-shadow: 0px 1px 4px rgba(0, 20, 90, 0.1);
  border-radius: 5px;
  -webkit-transform: translate3d(0, 0);
  transform: translate3d(0, 0);
  -webkit-transition: 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  -o-transition: 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: 0.2s cubic-bezier(0.25, 1, 0.5, 1);
  z-index: -1;
}
@media (max-width: 397px) {
    .tp-pricing-tab-nav .tp-price-tab-bg-slide {
        width: 45%;
        right: 0;
        top: 0px;
        bottom: -5px;
        left: 190px;
    }
}
.tp-pricing-tab-nav .nav-link {
  font-weight: 500;
  font-size: 14px;
  background-color: transparent;
  color: #525258;
  padding: 6px 27px;
  padding-right: 14px;
  border-radius: 10px;
  border: 0;
}
.tp-pricing-tab-nav .nav-link .offer {
  font-weight: 700;
  font-size: 13px;
  color: #FF3A8A;
  padding: 4px 10px;
  border-radius: 30px;
  display: inline-block;
  line-height: 1;
  margin-left: 5px;
  background-color: rgba(255, 58, 138, 0.1);
}
    .tp-pricing-tab-nav .nav-link:first-child {
        padding: 0 65px 12px 15px;
    }
@media (max-width: 397px) {
    .tp-pricing-tab-nav .nav-link:first-child {
        padding: 0px 50px 12px 30px;
    }
}
.tp-pricing-tab-nav .nav-link.tp-monthly.active ~ .tp-price-tab-bg-slide {
  transform: translateX(-200px);
}
@media only screen and (min-width: 351px) and (max-width: 399px), (max-width: 397px) {
    .tp-pricing-tab-nav .nav-link.tp-monthly.active ~ .tp-price-tab-bg-slide {
        transform: translateY(-35px);
        transform: translateX(-190px) !important;
    }
}
.tp-pricing-tab-nav .nav-link.active {
  background-color: transparent;
  color: var(--tp-common-black);
}
@media only screen and (min-width: 351px) and (max-width: 399px) {
  .tp-pricing-tab-nav .nav-link.active {
    /*margin: auto;*/
    float:left;
  }
}
.tp-pricing-tab-nav .price-tab-slide {
  position: relative;
  z-index: 1;
}
.tp-pricing-tab-nav .price-tab-slide:hover {
  cursor: pointer;
}
.tp-pricing-tab-nav .price-tab-slide .nav-link {
  display: inline-block;
}
@media (max-width: 397px) {
  .tp-pricing-tab-nav .price-tab-slide .nav-link {
    margin-top: 15px;
    margin-bottom: 5px;
  }
}
@media only screen and (min-width: 351px) and (max-width: 399px) {
  .tp-pricing-tab-nav .price-tab-slide .nav-link {
    display: block;
  }
}
.tp-pricing-tab-nav .price-tab-slide label:hover {
  cursor: pointer;
}
.tp-pricing-tab-nav .price-tab-slide #price-tab-check {
  display: none;
}
.tp-pricing-tab-nav .price-tab-slide #price-tab-check:checked + i {
  right: 190px;
  width: 150px;
}
@media (max-width: 397px) {
  .tp-pricing-tab-nav .price-tab-slide #price-tab-check:checked + i {
    bottom: 38px;
    right: 0;
    width: 100%;
  }
}
@media (max-width: 575px) {
  .tp-pricing-tab-nav .price-tab-slide #price-tab-check:checked + i {
    bottom: 44px;
  }
}
@media only screen and (min-width: 351px) and (max-width: 399px) {
  .tp-pricing-tab-nav nav .nav {
    display: block;
  }
}
.tp-pricing-item {
    background: #FFFFFF;
    border: 1px solid rgba(4, 18, 31, 0.08);
    box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.03);
    border-radius: 10px;
    position: relative;
    height: 480px;
}
.tp-pricing-item.has-popular .tp-pricing-popular {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  z-index: 1;
}
.tp-pricing-item.pricing-active .tp-pricing-btn .tp-price-btn {
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  color: var(--tp-common-white);
}
.tp-pricing-popular {
  background: #FF3A8A;
  border-radius: 10px 10px 0px 0px;
}
.tp-pricing-popular p {
  font-weight: 700;
  font-size: 12px;
  text-align: center;
  letter-spacing: 0.06em;
  color: #FFFFFF;
  margin: 0;
}
.tp-pricing-top {
  border-radius: 10px 10px 0 0;
}
.tp-pricing-title-wrapper {
    padding: 73px 0 42px 38px;
    min-height: 260px;
}
.tp-pricing-title-wrapper .tp-pricing__title {
  font-weight: 500;
  font-size: 45px;
  letter-spacing: -0.04em;
  color: #FFFFFF;
}
.tp-pricing-title-wrapper .tp-pricing__title span {
  font-weight: 400;
  font-size: 16px;
  letter-spacing:normal;
}
.tp-pricing-title-wrapper p {
  font-family: var(--tp-ff-heading);
  font-size: 18px;
  color: #FFFFFF;
}
.tp-pricing-icon img {
  width: 100%;
  position: absolute;
  top: 0;
  right: 0;
}
.tp-pricing-feature.tp-mb-1 {
  margin-bottom: 73px;
}
.tp-pricing-feature.tp-mb-2 {
  margin-bottom: 35px;
}
.tp-pricing-feature p {
  font-weight: 400;
  font-size: 14px;
  color: #84858D;
}
.tp-pricing-feature ul li {
  position: relative;
  font-weight: 500;
  font-size: 15px;
  letter-spacing: -0.02em;
  color: #161616;
  list-style: none;
  padding-left: 35px;
  margin-bottom: 12px;
}
.tp-pricing-feature ul li::after {
  position: absolute;
  content: "\f00c";
  font-family: var(--tp-ff-fontawesome);
  color: var(--tp-common-white);
  font-size: 12px;
  font-weight: 700;
  text-align: center;
  left: 0;
  top: 3px;
  width: 20px;
  height: 20px;
  line-height: 1.6;
  border-radius: 50%;
  background: linear-gradient(142.96deg, #22E17F 14.78%, #0EAC60 95.99%);
  box-shadow: 0px 1px 2px rgba(6, 138, 75, 0.3);
}
.tp-pricing-content {
  padding: 32px 40px 40px 40px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-pricing-content {
    padding: 30px;
  }
}
.tp-pricing-btn .tp-price-btn {
  font-family: var(--tp-ff-heading);
  display: inline-block;
  font-size: 15px;
  font-weight: 700;
  color: #161616;
  height: 44px;
  line-height: 44px;
  background-color: #F8F8F8;
  text-align: center;
  border-radius: 5px;
  transition: 0.3s ease;
  position: relative;
  z-index: 1;
}
.tp-pricing-btn .tp-price-btn:hover {
  color: var(--tp-common-white);
}
.tp-pricing-btn .tp-price-btn:hover::before {
  opacity: 1;
}
.tp-pricing-btn .tp-price-btn::before {
  position: absolute;
  content: "";
  width: 100%;
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  top: 0;
  left: 0;
  height: 100%;
  border-radius: 5px;
  opacity: 0;
  color: var(--tp-common-white);
  transition: 0.3s ease;
  z-index: -1;
}

/*----------------------------------------*/
/*  7.12 Service css
/*----------------------------------------*/
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-service-area {
    padding-bottom: 150px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-service-area {
    padding-bottom: 85px;
  }
}
.tp-service-item {
  padding: 10px 18px;
  background: var(--tp-common-white);
  border: 1px solid #EEF3F8;
  border-radius: 20px;
  transition: 0.3s ease;
  z-index: 1;
  height:180px;
}
@media only screen and (min-width: 1600px) and (max-width: 1699px) {
  .tp-service-item {
    padding: 30px 28px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), (max-width: 575px) {
    .tp-service-item {
        padding: 15px 15px;
    }
    .tp-pricing-tab-nav .nav-link.tp-monthly.active ~ .tp-price-tab-bg-slide {
        transform: translateX(-200px);
    }
}
.tp-service-item::after {
  position: absolute;
  content: "";
  top: -30px;
  left: 0;
  right: 0;
  width: 100%;
  height: calc(100% + 60px);
  background: #fff;
  visibility: hidden;
  opacity: 0;
  z-index: -1;
  transition: 0.3s ease;
  border-radius: 20px;
  border: 1px solid #EEF3F8;
  transform: scaleY(0.9);
  transform-origin: center center;
}
/*.tp-service-item:hover {
  border: 1px solid #EEF3F8;*/
  /*box-shadow: 0px 55px 89px rgba(111, 138, 177, 0.06);*/
/*}
.tp-service-item:hover a {
  visibility: visible;*/
  /*transform: translateY(-18px);*/
/*opacity: 1;
}
@media only screen and (min-width: 1600px) and (max-width: 1699px), 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), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-service-item:hover a {
    transform: translateY(0px);
  }
}
.tp-service-item:hover::after {
  box-shadow: 0px 55px 89px rgba(111, 138, 177, 0.06);
  opacity: 1;
  visibility: visible;
  transform: scaleY(1);
}
.tp-service-item:hover .tp-service-icon img {
  transform: translate3d(0, -5px, 0);
}*/
.tp-service-icon {
  margin-bottom: 5px;
}
.tp-service-icon img {
  height: 100px;
  object-fit: cover;
  transform: translate3d(0, 0, 0);
  transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
}
.tp-service-content .service-title {
  font-weight: 600;
  font-size: 1.1rem;
  /*line-height: 1.3;*/
  /*letter-spacing: -0.01em;*/
  color: #202026;
  margin-bottom: 5px;
}
.tp-service-content .service-title:hover {
  color: var(--tp-theme-primary);
}
.tp-service-content p {
  font-size: 18px;
  line-height: 30px;
}
.tp-service-btn a {
  font-family: var(--tp-ff-heading);
  font-weight: 700;
  font-size: 15px;
  line-height: 18px;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #202026;
  transform: translateY(20px);
  position: absolute;
  bottom: 20px;
  left: 0;
  right: 0;
  visibility: hidden;
  opacity: 0;
  transition: 0.3s ease;
}
.tp-service-btn a:hover {
  color: var(--tp-theme-primary);
}
.tp-service-btn i {
  background: var(--tp-gradient-primary);
  border-radius: 50%;
  padding: 1px 10px 0px 0px;
  height: 29px;
  width: 29px;
  line-height: 28px;
  color: #fff;
  font-size: 22px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-service-buttons-wrapper {
    padding-top: 30px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-service-buttons-wrapper {
    padding-top: 35px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-service-buttons {
    padding-left: 0;
  }
}

/*----------------------------------------*/
/*----------------------------------------*/
.tp-service-slider .tp-service-active .slick-list {
  overflow: visible;
}

.tp-service-active .slick-list {
  margin: 0 -20px;
}
.tp-service-active .slick-slide {
  margin: 0px 20px;
}

.tp-service-active .slick-next.slick-arrow i {
  position: absolute;
  z-index: 2;
  top: 50%;
  transform: translateY(-50%);
  right: -5%;
  background: var(--tp-common-white);
  color: #B3B6C4;
  transition: 0.3s ease;
  height: 70px;
  width: 70px;
  border-radius: 50%;
  line-height: 3.5;
  font-size: 20px;
  box-shadow: 0px 7px 13px rgba(44, 65, 97, 0.13);
}
.tp-service-active .slick-next.slick-arrow i:hover {
  color: #030A39;
}
.tp-service-active .slick-prev.slick-arrow i {
  position: absolute;
  z-index: 2;
  top: 50%;
  transform: translateY(-50%);
  left: -5%;
  background: var(--tp-common-white);
  color: #B3B6C4;
  transition: 0.3s ease;
  height: 70px;
  width: 70px;
  border-radius: 50%;
  line-height: 3.5;
  font-size: 20px;
  box-shadow: 0px 7px 13px rgba(44, 65, 97, 0.13);
}
.tp-service-active .slick-prev.slick-arrow i:hover {
  color: #030A39;
}

.plr-175 {
  padding-left: 175px;
  padding-right: 175px;
}
@media only screen and (min-width: 1600px) and (max-width: 1699px) {
  .plr-175 {
    padding-left: 140px;
    padding-right: 140px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .plr-175 {
    padding-left: 50px;
    padding-right: 50px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px) {
  .plr-175 {
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .plr-175 {
    padding-left: 30px;
    padding-right: 30px;
  }
}
@media (max-width: 575px) {
  .plr-175 {
    padding-left: 15px;
    padding-right: 15px;
  }
}

.services-wrapper-2 {
  background: #351E8A;
  border: 2px solid #511EC5;
  border-radius: 20px;
  padding-top: 100px;
  padding-bottom: 100px;
  position: relative;
  z-index: 1;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .services-wrapper-2 {
    padding-top: 100px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .services-wrapper-2 {
    padding-top: 60px;
    padding-bottom: 40px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-services-area {
    padding-top: 115px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-services-area {
    padding-top: 20px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-services-area {
    padding-bottom: 80px;
  }
}
.tp-services-wrapper .tp-section__title-pre {
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
  margin-bottom: 22px;
  color: var(--tp-common-white);
}
.tp-services-wrapper .tp-section__title {
  color: var(--tp-common-white);
  font-size: 3rem;
  margin-bottom: 50px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-services-wrapper .tp-section__title {
    font-size: 46px;
  }
}
@media (max-width: 575px) {
  .tp-services-wrapper .tp-section__title {
    font-size: 2rem;
  }
}
.tp-services-item {
  background: #331C84;
  border: 2px solid rgba(127, 97, 247, 0.38);
  border-radius: 40px;
  padding: 33px;
  transition: 0.3s ease;
}
.tp-services-item:hover {
  background: #2D1877;
}
.tp-services-item:hover .tp-services-icon span {
  border-color: #2DA9E9;
}
.tp-services-item:hover .tp-services-play-btn {
  color: #2DA9E9;
}
.tp-services-icon span {
  background: #4A2EA9;
  border: 2px solid rgba(127, 97, 247, 0.1);
  border-radius: 25px;
  padding: 43px 46px;
  margin-right: 35px;
  transition: 0.3s ease;
  display: inline-block;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-services-content-wrapper {
    margin-top: 30px;
  }
}
.tp-services-content .number {
  font-family: var(--tp-ff-heading);
  display: block;
  font-weight: 600;
  font-size: 16px;
  line-height: 20px;
  letter-spacing: -0.02em;
  color: #FF3A8A;
  margin-bottom: 23px;
}
.tp-services-content .services-title {
  font-weight: 600;
  font-size: 28px;
  line-height: 38px;
  letter-spacing: -0.02em;
  color: var(--tp-common-white);
}
@media (max-width: 575px) {
  .tp-services-content .services-title {
    font-size: 25px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-services-content .services-title br {
    display: none;
  }
}
.tp-services-play-btn {
  position: absolute;
  right: 56px;
  top: 50%;
  transform: translateY(-50%);
  color: #3154AC;
  font-size: 26px;
  transition: 0.3s ease;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-services-play-btn {
    right: 24px;
  }
}
@media (max-width: 575px) {
  .tp-services-play-btn {
    display: none;
  }
}
.tp-services-blur-effect .services-blur-1 {
  position: absolute;
  top: -570px;
  left: -170px;
}
.tp-services-blur-effect .services-blur-1 img {
  max-width: 100%;
}
.tp-services-blur-effect .services-blur-2 {
  position: absolute;
  right: -170px;
  top: 0;
  max-width: 100%;
}
@media only screen and (min-width: 1600px) and (max-width: 1699px) {
  .tp-services-blur-effect .services-blur-2 {
    right: -110px;
  }
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .tp-services-blur-effect .services-blur-2 {
    right: -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), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-services-blur-effect .services-blur-2 {
    display: none;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-services-btn {
    margin-bottom: 30px;
  }
}

.tp-services-breadcrumb-content .tp-section__title {
  margin-bottom: 20px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-services-breadcrumb-content .tp-section__title br {
    display: none;
  }
}
.tp-services-breadcrumb-content .tp-section__sub-title {
  font-family: var(--tp-ff-heading);
  font-style: normal;
  font-weight: 600;
  font-size: 24px;
  line-height: 28px;
  letter-spacing: -0.02em;
}
.tp-services-breadcrumb-content .section-gap {
  margin-bottom: 95px;
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-services-breadcrumb-content .section-gap {
    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), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-services-breadcrumb-content .section-gap br {
    display: none;
  }
}
.tp-services-breadcrumb-content .services-1 {
  margin-bottom: 27px;
}
@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), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-services-breadcrumb-content .services-1 br {
    display: none;
  }
}
.tp-services-breadcrumb-content .services-2 {
  margin-bottom: 50px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-services-breadcrumb-content .services-2 br {
    display: none;
  }
}
.tp-services-breadcrumb-thumb img {
  min-width: 100%;
  border-radius: 20px;
  margin-bottom: 50px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-services-breadcrumb-thumb img {
    max-width: 100%;
  }
}
.tp-services-breadcrumb-point {
  margin-bottom: 75px;
  padding-left: 25px;
  position: relative;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-services-breadcrumb-point {
    padding-left: 0;
    margin-bottom: 40px;
  }
}
.tp-services-breadcrumb-point h4 {
  font-family: var(--tp-ff-heading);
  font-weight: 600;
  font-size: 24px;
  line-height: 28px;
  letter-spacing: -0.02em;
  margin-bottom: 25px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-services-breadcrumb-point p br {
    display: none;
  }
}
.tp-services-breadcrumb-point.has-border::before {
  position: absolute;
  content: "";
  height: 137px;
  width: 4px;
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  border-radius: 5px;
  left: 0;
  top: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-services-breadcrumb-point.has-border::before {
    display: none;
  }
}

/*----------------------------------------*/
/*  7.13 Team css
/*----------------------------------------*/
.tp-team-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 31%;
  background-color: #000d44;
  z-index: -1;
}
.tp-team-bg {
  background: #F1F6FB;
  border-radius: 20px;
}
.tp-team-wrapper {
  padding: 90px 65px 80px 90px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-team-wrapper {
    padding: 60px 50px 30px 75px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-team-wrapper {
    padding: 50px 30px 0 50px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-team-wrapper {
    padding: 50px 0 0 35px;
  }
}
.tp-team-wrapper p {
  font-weight: 400;
  font-size: 18px;
  line-height: 30px;
  color: #727885;
  margin-bottom: 30px;
}
.tp-team-wrapper-thumb {
  padding: 90px 90px 80px 70px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-team-wrapper-thumb {
    padding: 80px 70px 70px 65px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-team-wrapper-thumb {
    padding: 60px 10px 30px 5px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-team-wrapper-thumb {
    padding: 30px 0 40px 90px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-team-wrapper-thumb {
    padding: 50px 0 50px 65px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-team-wrapper-thumb {
    padding: 35px 0 30px 36px;
  }
}
.tp-team-wrapper-thumb img {
  border-radius: 10px;
}

.tp-team-details-thumb-wrapper {
  background: #F8F8F8;
  padding: 62px 80px 45px;
  border-radius: 0 0 20px 20px;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-team-details-thumb-wrapper {
    display: block;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-team-details-thumb-wrapper {
    padding: 50px 45px 35px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-team-details-thumb-wrapper {
    padding: 40px 20px 30px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-team-details-thumb-wrapper {
    padding: 20px;
  }
}
.tp-team-details-founder {
  font-weight: 600;
  font-size: 14px;
  line-height: 10px;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  color: #162DE4;
}
.tp-team-details h4 {
  font-weight: 600;
  font-size: 44px;
  letter-spacing: -0.02em;
  margin-bottom: 13px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-team-details h4 {
    font-size: 26px;
  }
}
.tp-team-details-mail {
  font-weight: 500;
  font-size: 22px;
  line-height: 28px;
  color: #000D44;
  margin-bottom: 15px;
  display: block;
}
.tp-team-details p {
  font-weight: 400;
  font-size: 18px;
  line-height: 28px;
  color: #727885;
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-team-details p br {
    display: none;
  }
}
.tp-team-details-item-img img {
  border-radius: 10px;
}
.tp-team-details-text .team-text-1 {
  margin-bottom: 28px;
}
.tp-team-details-text .team-text-2 {
  margin-bottom: 26px;
}
.tp-team-thumb-2 img {
  border-radius: 10px;
  max-width: 100%;
}

@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-team-details-area {
    padding-top: 100px;
  }
}
.tp-team-details-thumb img {
  border-radius: 20px 20px 0 0;
  max-width: 100%;
}

.tp-our-team-info {
  position: relative;
}
.tp-our-team-info:hover::before {
  opacity: 0.9;
  visibility: visible;
  transition-delay: 0s;
}
.tp-our-team-info::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: #000D44;
  opacity: 0;
  top: 0;
  left: 0;
  border-radius: 15px;
  -webkit-transition: all 0.4s ease-out 0s;
  -moz-transition: all 0.4s ease-out 0s;
  -ms-transition: all 0.4s ease-out 0s;
  -o-transition: all 0.4s ease-out 0s;
  transition: all 0.3s ease-out 0s;
  visibility: hidden;
  transition-delay: 0.5s;
}
.tp-our-team-info img {
  max-width: 100%;
  border-radius: 15px;
}
.tp-our-team-info:hover .tp-our-team-description h4, .tp-our-team-info:hover .tp-our-team-description .tp-our-team-social {
  visibility: visible;
  opacity: 1;
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  -ms-transform: translateY(0px);
  -o-transform: translateY(0px);
  transform: translateY(0px);
}
.tp-our-team-info:hover .tp-our-team-description h4 {
  transition-delay: 0s;
}
.tp-our-team-info:hover .tp-our-team-description .tp-our-team-social {
  transition-delay: 0.2s;
}
.tp-our-team-info .tp-our-team-description {
  position: absolute;
  bottom: 35%;
  left: 21%;
  z-index: 1;
  transition: all 0.3s ease-in-out;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-our-team-info .tp-our-team-description {
    left: 14%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-our-team-info .tp-our-team-description {
    left: 25px;
    bottom: 30px;
    width: 85%;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-our-team-info .tp-our-team-description {
    left: 25px;
    bottom: 30px;
    width: 80%;
  }
}
.tp-our-team-info .tp-our-team-description h4 {
  font-family: var(--tp-ff-heading);
  background: #7924C8;
  font-weight: 600;
  font-size: 26px;
  line-height: 32px;
  padding: 28px 52px;
  letter-spacing: -0.02em;
  color: var(--tp-common-white);
  display: inline-block;
  margin-bottom: 0;
  position: relative;
  -webkit-transform: translateY(25px);
  -moz-transform: translateY(25px);
  -ms-transform: translateY(25px);
  -o-transform: translateY(25px);
  transform: translateY(25px);
  visibility: hidden;
  opacity: 0;
  transition: all 0.3s ease;
  transition-delay: 0.2s;
  transition-duration: 0.5s;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-our-team-info .tp-our-team-description h4 {
    padding: 20px 24px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-our-team-info .tp-our-team-description h4 {
    padding: 15px 10px;
    font-size: 20px;
  }
}
.tp-our-team-info .tp-our-team-description .tp-our-team-social {
  display: flex;
  justify-content: center;
  -webkit-transform: translateY(20px);
  -moz-transform: translateY(20px);
  -ms-transform: translateY(20px);
  -o-transform: translateY(20px);
  transform: translateY(20px);
  visibility: hidden;
  opacity: 0;
  transition: all 0.3s ease;
  transition-delay: 0s;
  transition-duration: 0.5s;
}
.tp-our-team-info .tp-our-team-description .tp-our-team-social a {
  position: relative;
  font-weight: 400;
  font-size: 12px;
  line-height: 40px;
  letter-spacing: 0.075em;
  color: var(--tp-common-white);
  background: #FF3A8A;
  height: 40px;
  width: 40px;
  text-align: center;
  display: inline-block;
}
.tp-our-team-info .tp-our-team-description .tp-our-team-social a:hover {
  background: #7924C8;
  color: var(--tp-common-white);
  border: none;
}
.tp-our-team-info .tp-our-team-description .tp-our-team-social a:hover::before {
  opacity: 0;
}
.tp-our-team-info .tp-our-team-description .tp-our-team-social a::before {
  position: absolute;
  content: "";
  height: 39px;
  width: 1px;
  background: #F6609D;
  right: 0;
  top: 0;
  opacity: 1;
  transition: all 0.3s ease;
}

@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-contact-team-area {
    padding-bottom: 70px;
  }
}

/*----------------------------------------*/
/*  7.14 Testimonial css
/*----------------------------------------*/
.tp-testimonial-section-wrapper .tp-section__title-pre {
  background: var(--tp-gradient-primary);
  border: none;
  color: var(--tp-common-white);
  margin-bottom: 15px;
}
.tp-testimonial-section-wrapper .tp-section__title {
  color: var(--tp-common-white);
}
.tp-testimonial-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  z-index: -1;
}
.tp-testimonial-bg::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background: #000D44;
  opacity: 0.75;
}
.tp-testimonial-item {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.09) 0%, rgba(255, 255, 255, 0) 100%);
  box-shadow: 0px 48px 47px rgba(1, 0, 50, 0.63);
  border-radius: 15px;
  padding: 40px 47px 50px;
  position: relative;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-testimonial-item {
    padding: 30px 34px 40px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-testimonial-item {
    padding: 30px 20px 30px;
  }
}
.tp-testimonial-item::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  transition: 0.3s ease-out;
  opacity: 0;
  z-index: -1;
  border-radius: 15px;
  background-image: linear-gradient(164.88deg, #00C7C5 12.73%, #2D9BE0 39.91%, #5277F7 64.71%, #5B76F7 69.65%, #7374F6 77.67%, #9A70F4 87.7%, #BB6DF3 95.06%);
}
.tp-testimonial-item:hover::after {
  opacity: 1;
}
.tp-testimonial-logo {
  border-bottom: 1px solid #E8EAF3;
  padding-bottom: 40px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-testimonial-logo {
    margin-bottom: 40px;
  }
}
.tp-testimonial-content p {
  font-size: 18px;
  line-height: 1.8;
  color: var(--tp-common-white);
  margin-bottom: 60px;
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-testimonial-content p {
    margin-bottom: 40px;
  }
}
.tp-testimonial-star i {
  font-weight: 900;
  font-size: 14px;
  line-height: 26px;
  color: #FFCC4A;
}
.tp-testimonial-star span {
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--tp-common-white);
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-testimonial-buttons {
    padding-left: 0;
  }
}

/*----------------------------------------*/
/* testimonial Slider css
/*----------------------------------------*/
.tp-testimonial-active .slick-list {
  overflow: visible;
}
.tp-testimonial-active .slick-slide {
  margin: 0px 18px;
}

.testimonial-slider-nav .slick-arrow {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%);
  transition: 0.3s ease;
  color: #B3B6C4;
  height: 70px;
  width: 70px;
  border-radius: 50%;
  line-height: 3;
  font-size: 20px;
  box-shadow: 0px 4px 36px rgba(5, 6, 48, 0.85);
  margin-right: 15px;
}
.testimonial-slider-nav .slick-arrow:hover {
  color: var(--tp-common-white);
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-testimonial-area-2 {
    padding-bottom: 120px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-testimonial-area-2 {
    padding-bottom: 80px;
  }
}
.tp-testimonial-box-2 {
  background: #351E8A;
  border: 2px solid #511EC5;
  box-shadow: 0px 4px 139px rgba(11, 4, 35, 0.13);
  border-radius: 20px;
  padding-top: 115px;
  padding-bottom: 90px;
  position: relative;
}
.tp-testimonial-wrapper-2 .tp-section__title-pre {
  background: none;
  border: none;
  box-shadow: none;
  padding: 0;
  margin-bottom: 22px;
  color: var(--tp-common-white);
}
.tp-testimonial-wrapper-2 .tp-section__title {
  color: var(--tp-common-white);
  font-size: 54px;
  margin-bottom: 40px;
}
@media (max-width: 575px) {
  .tp-testimonial-wrapper-2 .tp-section__title {
    font-size: 36px;
  }
}
.tp-testimonial-item-2 {
  background: #331D80;
  border: 1px solid #3E2791;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-testimonial-item-2 {
    padding: 40px 30px;
  }
}
@media (max-width: 575px) {
  .tp-testimonial-item-2 {
    padding: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-testimonial-item-2 {
    margin-bottom: 30px;
  }
}
.tp-testimonial-content-2 p {
  font-family: var(--tp-ff-heading);
  font-weight: 600;
  font-size: 18px;
  line-height: 32px;
  color: var(--tp-common-white);
  margin-bottom: 30px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-testimonial-content-2 p br {
    display: none;
  }
}
.tp-testimonial-thumb {
  background: #2E1977;
  padding: 43px 56px 30px;
}
@media (max-width: 575px) {
  .tp-testimonial-thumb {
    padding: 40px 14px;
  }
}
.tp-testimonial-thumb img {
  border-radius: 50%;
  margin-right: 15px;
  width: 66px;
}
.tp-testimonial-thumb-content {
  padding: 38px 20px 45px 50px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-testimonial-thumb-content {
    padding: 36px 0 0 0;
  }
}
@media (max-width: 575px) {
  .tp-testimonial-thumb-content {
    padding: 30px 0;
  }
}
.tp-testimonial-designation {
  font-weight: 700;
  font-size: 24px;
  line-height: 26px;
  color: var(--tp-common-white);
}
@media only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tp-testimonial-designation {
    margin-top: 10px;
  }
}
.tp-testimonial-blur-effect .testimonial-blur-1 {
  position: absolute;
  bottom: -525px;
  right: 0;
  max-width: 100%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-testimonial-blur-effect .testimonial-blur-1 {
    bottom: -250px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-testimonial-blur-effect .testimonial-blur-1 {
    bottom: -180px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-testimonial-blur-effect .testimonial-blur-1 {
    display: none;
  }
}

.tp-testimonial-slider-2-active .slick-next.slick-arrow {
  position: absolute;
  z-index: 2;
  top: 50%;
  transform: translateY(-50%);
  right: -13%;
  height: 70px;
  width: 70px;
  border-radius: 50%;
  line-height: 3.5;
  font-size: 20px;
  background: #34B2F3;
  box-shadow: 0px 7px 13px rgba(44, 65, 97, 0.13);
  color: #fff;
}
@media only screen and (min-width: 1600px) and (max-width: 1699px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-testimonial-slider-2-active .slick-next.slick-arrow {
    right: -5%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-testimonial-slider-2-active .slick-next.slick-arrow {
    right: -4%;
  }
}
.tp-testimonial-slider-2-active .slick-prev.slick-arrow {
  position: absolute;
  z-index: 2;
  top: 50%;
  transform: translateY(-50%);
  left: -13%;
  transition: 0.3s;
  height: 70px;
  width: 70px;
  border-radius: 50%;
  line-height: 3.5;
  font-size: 20px;
  background: #34B2F3;
  box-shadow: 0px 7px 13px rgba(44, 65, 97, 0.13);
  color: #fff;
}
@media only screen and (min-width: 1600px) and (max-width: 1699px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-testimonial-slider-2-active .slick-prev.slick-arrow {
    left: -5%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-testimonial-slider-2-active .slick-prev.slick-arrow {
    left: -4%;
  }
}

.tp-testimonial-area-3 {
  background-repeat: no-repeat;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .tp-testimonial-area-3 {
    padding-bottom: 110px;
    padding-top: 110px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-testimonial-area-3 {
    padding-bottom: 100px;
    padding-top: 110px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px), only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-testimonial-area-3 {
    padding-top: 90px;
    padding-bottom: 0px;
  }
}
.tp-testimonial-wrapper-3 h4 {
  font-weight: 600;
  font-size: 24px;
  color: var(--tp-common-white);
  line-height: 1.8;
  letter-spacing: -0.03em;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-testimonial-wrapper-3 h4 {
    font-size: 22px;
  }
}
.tp-testimonial-ratings-3 {
  margin-bottom: 40px;
}
.tp-testimonial-ratings-3 i {
  font-weight: 900;
  font-size: 24px;
  color: #FFCC4A;
  margin-right: 4px;
}
.tp-testimonial-thumb-3 {
  position: relative;
}
.tp-testimonial-thumb-3::before {
  position: absolute;
  content: "";
  left: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  z-index: -1;
  border-radius: 20px;
}
.tp-testimonial-thumb-3 img {
  border-radius: 20px;
  width: 100%;
}
.tp-testimonial-thumb-wrapper {
  margin: 20px 14px;
}
.tp-testimonial-thumb-wrapper.slick-current .tp-testimonial-thumb-3 img {
  -webkit-transform: scale(0.9);
  -moz-transform: scale(0.9);
  -ms-transform: scale(0.9);
  -o-transform: scale(0.9);
  transform: scale(0.9);
  transform: scale(0.959, 0.97);
}

.tp-slider__arrows {
  margin-top: 50px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), only screen and (min-width: 576px) and (max-width: 767px) {
  .tp-slider__arrows {
    margin-top: 10px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-slider__arrows {
    margin-top: 10px;
    margin-bottom: 30px;
  }
}
.tp-slider__arrows .slick-prev {
  color: #000;
  background: var(--tp-common-white);
  width: 48px;
  height: 48px;
  margin-right: 12px;
  display: inline-block;
  font-size: 20px;
  transition: 0.3s ease;
  border-radius: 6px;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
.tp-slider__arrows .slick-prev:hover {
  color: var(--tp-common-white);
}
.tp-slider__arrows .slick-prev:hover::before {
  opacity: 1;
}
.tp-slider__arrows .slick-prev::before {
  position: absolute;
  content: "";
  width: 100%;
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  top: 0;
  left: 0;
  height: 100%;
  opacity: 0;
  color: var(--tp-common-white);
  transition: 0.3s ease;
  z-index: -1;
}
.tp-slider__arrows .slick-next {
  color: #000;
  background: var(--tp-common-white);
  width: 48px;
  height: 48px;
  display: inline-block;
  font-size: 20px;
  transition: 0.3s ease;
  border-radius: 6px;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
.tp-slider__arrows .slick-next:hover {
  color: var(--tp-common-white);
}
.tp-slider__arrows .slick-next:hover::before {
  opacity: 1;
}
.tp-slider__arrows .slick-next::before {
  position: absolute;
  content: "";
  width: 100%;
  background: linear-gradient(180deg, #00EEFF 0%, #003CFF 100%);
  top: 0;
  left: 0;
  height: 100%;
  opacity: 0;
  color: var(--tp-common-white);
  transition: 0.3s ease;
  z-index: -1;
}

.tp-testimonial-nav {
  margin-right: -390px;
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .tp-testimonial-nav {
    margin-left: 100px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px) {
  .tp-testimonial-nav {
    margin-left: 50px;
  }
}
@media only screen and (min-width: 270px) and (max-width: 575px) {
  .tp-testimonial-nav {
    margin-left: 0;
    margin-top: 30px;
  }
}
.tp-testimonial-nav .slick-list {
  margin: 0 -14px;
}
.tp-testimonial-nav .slick-slide {
  margin: 0 14px;
}

/*----------------------------------------*/
/*  7.15 Login css
/*----------------------------------------*/
/*lkogin css */
.sign__wrapper {
  padding: 50px 70px;
  padding-bottom: 45px;
  margin: 0 30px;
  background-color: #F8F8F8;
  border-radius: 10px;
  box-shadow: 0px 40px 80px 0px rgba(2, 2, 26, 0.14);
  z-index: 11;
}
@media (max-width: 575px) {
  .sign__wrapper {
    margin: 0;
    padding: 30px 20px;
    padding-bottom: 25px;
  }
}
.sign__shape img {
  position: absolute;
  z-index: -1;
}
.sign__shape img.man-1 {
  left: 28%;
  top: 60%;
  z-index: 1;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .sign__shape img.man-1 {
    left: 19%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sign__shape img.man-1 {
    left: 16%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sign__shape img.man-1 {
    left: 7%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sign__shape img.man-1 {
    left: 2%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .sign__shape img.man-1 {
    left: 1%;
  }
}
@media (max-width: 575px) {
  .sign__shape img.man-1 {
    display: none;
  }
}
.sign__shape img.man-2 {
  right: 24%;
  top: 65%;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .sign__shape img.man-2 {
    top: 55%;
    right: 20%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sign__shape img.man-2 {
    top: 60%;
    right: 15%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sign__shape img.man-2 {
    top: 60%;
    right: 7%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sign__shape img.man-2 {
    top: 60%;
    right: 0%;
    z-index: 1;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .sign__shape img.man-2 {
    top: 60%;
    right: 0%;
    z-index: 1;
  }
}
@media (max-width: 575px) {
  .sign__shape img.man-2 {
    display: none;
  }
}
.sign__shape img.man-2.man-22 {
  top: 50%;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .sign__shape img.man-2.man-22 {
    top: 55%;
    right: 20%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sign__shape img.man-2.man-22 {
    top: 60%;
    right: 15%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sign__shape img.man-2.man-22 {
    top: 60%;
    right: 7%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sign__shape img.man-2.man-22 {
    top: 60%;
    right: 0%;
    z-index: 1;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .sign__shape img.man-2.man-22 {
    top: 60%;
    right: 0%;
    z-index: 1;
  }
}
.sign__shape img.circle {
  right: 32%;
  top: 38%;
  animation: signCircle 5s linear 0s infinite alternate;
  -webkit-animation: signCircle 5s linear 0s infinite alternate;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .sign__shape img.circle {
    right: 25%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sign__shape img.circle {
    right: 22%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sign__shape img.circle {
    right: 11%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sign__shape img.circle {
    right: 4%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .sign__shape img.circle {
    right: 2%;
  }
}
@media (max-width: 575px) {
  .sign__shape img.circle {
    display: none;
  }
}
.sign__shape img.dot {
  right: 34%;
  top: 43%;
  animation: signDot 5s linear 0s infinite alternate;
  -webkit-animation: signDot 5s linear 0s infinite alternate;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .sign__shape img.dot {
    right: 29%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sign__shape img.dot {
    right: 26%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sign__shape img.dot {
    right: 18%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sign__shape img.dot {
    right: 5%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .sign__shape img.dot {
    right: 3%;
  }
}
@media (max-width: 575px) {
  .sign__shape img.dot {
    display: none;
  }
}
.sign__shape img.bg {
  left: 33%;
  top: 26%;
  opacity: 0.06;
  max-width: 100%;
  animation: signBg 5s linear 0s infinite alternate;
  -webkit-animation: signBg 5s linear 0s infinite alternate;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sign__shape img.bg {
    left: 10%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .sign__shape img.bg {
    left: 0%;
  }
}
@media (max-width: 575px) {
  .sign__shape img.bg {
    display: none;
  }
}
.sign__shape img.zigzag {
  left: 32%;
  top: 43%;
  animation: signZigzag 5s linear 0s infinite alternate;
  -webkit-animation: signZigzag 5s linear 0s infinite alternate;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .sign__shape img.zigzag {
    left: 24%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sign__shape img.zigzag {
    left: 23%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sign__shape img.zigzag {
    left: 11%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sign__shape img.zigzag {
    left: 3%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .sign__shape img.zigzag {
    left: 2%;
  }
}
@media (max-width: 575px) {
  .sign__shape img.zigzag {
    display: none;
  }
}
.sign__shape img.flower {
  bottom: 13%;
  right: 30%;
}
@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .sign__shape img.flower {
    right: 24%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .sign__shape img.flower {
    right: 24%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sign__shape img.flower {
    right: 12%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sign__shape img.flower {
    right: 3%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .sign__shape img.flower {
    right: 1%;
  }
}
@media (max-width: 575px) {
  .sign__shape img.flower {
    right: 1%;
    bottom: 3%;
  }
}
.sign__header {
  padding: 0 35px;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .sign__header {
    padding: 0 10px;
  }
}
@media (max-width: 575px) {
  .sign__header {
    padding: 0px;
  }
}
.sign__header p {
  margin-bottom: 0;
  color: #53545b;
  font-size: 14px;
  position: relative;
  padding: 0 40px;
  display: inline-block;
}
.sign__header p span {
  position: absolute;
  top: 40%;
  left: 0;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.sign__header p span:last-child {
  left: auto;
  right: 0;
}
.sign__header p a:hover {
  color: var(--tp-theme-primary);
}
.sign__social {
  display: block;
  height: 50px;
  background: #eeedf2;
  border-radius: 6px;
  position: relative;
  line-height: 52px;
  padding-left: 23px;
  z-index: 1;
  overflow: hidden;
  font-size: 16px;
}
.sign__social::after {
  position: absolute;
  content: "";
  left: -55%;
  top: 45%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  height: 220px;
  width: 220px;
  background: #3360bd;
  border-radius: 50%;
  z-index: -1;
  transition: all 0.3s ease-out 0s;
}
@media only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 398px) and (max-width: 575px) {
  .sign__social::after {
    left: -52%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sign__social::after {
    left: -40%;
  }
}
@media (max-width: 397px) {
  .sign__social::after {
    left: -70%;
  }
}
.sign__social i {
  color: var(--tp-common-white);
  font-size: 16px;
  margin-right: 50px;
}
@media (max-width: 575px) {
  .sign__social i {
    margin-right: 35px;
  }
}
.sign__social:hover {
  color: var(--tp-common-white);
}
.sign__social:hover::after {
  width: 100%;
  height: 150%;
  left: 0;
  border-radius: 6px;
}
.sign__social.g-plus::after {
  background: #e93e30;
}
.sign__form h5 {
  font-size: 16px;
  font-weight: 500;
  color: var(--tp-common-black);
  margin-bottom: 11px;
}
.sign__input {
  position: relative;
}
.sign__input input {
  width: 100%;
  height: 60px;
  line-height: 52px;
  padding: 0 50px;
  font-size: 14px;
  background: #FFFFFF;
  color: var(--tp-common-black);
  border-radius: 6px;
}
.sign__input input::placeholder {
  color: #8e8c94;
}
.sign__input input:focus {
  outline: none;
  background: var(--tp-common-white);
  border-color: var(--tp-theme-primary);
  box-shadow: 0px 1px 4px 0px rgba(8, 0, 42, 0.2);
}
.sign__input i {
  position: absolute;
  top: 51%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  left: 25px;
  font-size: 14px;
  color: #8e8c94;
}
.sign__agree input {
  margin: 0;
  appearance: none;
  -moz-appearance: none;
  display: block;
  width: 14px;
  height: 14px;
  background: transparent;
  border: 1px solid #7a797f;
  outline: none;
  border-radius: 4px;
}
.sign__agree input:checked {
  position: relative;
  background-color: var(--tp-theme-primary);
  border-color: transparent;
}
.sign__agree input:checked::after {
  box-sizing: border-box;
  content: "\f00c";
  position: absolute;
  font-family: var(--tp-ff-fontawesome);
  font-size: 10px;
  color: var(--tp-common-white);
  top: 46%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.sign__agree input:hover {
  cursor: pointer;
}
.sign__agree label {
  padding-left: 10px;
  font-size: 14px;
}
.sign__agree label:hover {
  cursor: pointer;
}
.sign__agree label a {
  color: var(--tp-common-black);
  font-weight: 500;
}
.sign__agree label a:hover {
  color: var(--tp-theme-primary);
}
.sign__forgot a {
  color: #7a797f;
}
.sign__forgot a:hover {
  color: var(--tp-theme-primary);
}
.sign__new p {
  color: #7a797f;
  margin-bottom: 0;
}
.sign__new p a {
  color: var(--tp-theme-primary);
}

@keyframes signDot {
  0% {
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
  }
  100% {
    transform: translateY(50px);
    -webkit-transform: translateY(50px);
    -moz-transform: translateY(50px);
    -ms-transform: translateY(50px);
    -o-transform: translateY(50px);
  }
}
@keyframes signZigzag {
  0% {
    transform: translateY(0);
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
  }
  100% {
    transform: translateY(50px);
    -webkit-transform: translateY(50px);
    -moz-transform: translateY(50px);
    -ms-transform: translateY(50px);
    -o-transform: translateY(50px);
  }
}
@keyframes signCircle {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

/*# sourceMappingURL=main.css.map */
