/* Default  */

@import url("https://fonts.googleapis.com/css2?family=Mona+Sans:ital,wght@0,200..900;1,200..900&display=swap");

:root {

  --color-primary: #408cea;

  --color-primary-2: #5c9cea;

  --color-secondary: #FF7029;

  --color-secondary: rgb(255, 112, 41, .20);

  --color-body: #000;

  --color-body-2: #717580;

  --color-border: #E4E4E4;

  --color-heading-1: #001b46;

  --color-black: #000000;

  --color-white:#fff;

  --shadow-1: 0px 6px 34px rgba(215, 216, 222, 0.41);

  --primary-50: #effcfd;

  --primary-100: #dffafc;

  --primary-200: #CCF9FE;

  --primary-300: #3ADAE5;

  --primary-400: #31BCC6;

  --primary-500: #289FA8;

  --primary-600: #1F838B;

  --primary-700: #1A747B;

  --primary-900: #17686F;

  --secondary-100: #fff1ea;

  --secondary-200: #ffd4bf;

  --secondary-300: #ffc6a9;

  --secondary-400: #ffa97f;

  --secondary-500: #ff9b69;

  --secondary-600: #ff8d54;

  --secondary-700: #ff7029;

  --secondary-900: #e66525;

  --color-success: #3EB75E;

  --color-danger: #FF0003;

  --color-warning: #FF8F3C;

  --color-info: #1BA2DB;

  --color-facebook: #3B5997;

  --color-twitter: #1BA1F2;

  --color-youtube: #ED4141;

  --color-linkedin: #0077B5;

  --color-pinterest: #E60022;

  --color-instagram: #C231A1;

  --color-vimeo: #00ADEF;

  --color-twitch: #6441A3;

  --color-discord: #7289da;

  --p-light: 300;

  --p-regular: 400;

  --p-medium: 500;

  --p-semi-bold: 600;

  --p-bold: 700;

  --p-extra-bold: 800;

  --p-black: 900;

  --s-light: 300;

  --s-regular: 400;

  --s-medium: 500;

  --s-semi-bold: 600;

  --s-bold: 700;

  --s-extra-bold: 800;

  --s-black: 900;

  --transition: all 0.4s ease;

  --font-primary: "Source Serif 4", serif;

  --font-secondary: "Manrope", sans-serif;

  --font-awesome: "FontAwesome";

  --font-size-b1: 16px;

  --font-size-b2: 16px;

  --font-size-b3: 22px;

  --line-height-b1: 26px;

  --line-height-b2: 26px;

  --line-height-b3: 1.7;

  --h1: 66px;

  --h2: 44px;

  --h3: 36px;

  --h4: 30px;

  --h5: 24px;

  --h6: 20px;

}



* {

  box-sizing: border-box;

}



html {

  margin: 0;

  padding: 0;

  font-size: 10px;

  overflow: hidden;

  overflow-y: auto;

  scroll-behavior: auto !important;

}



body {

  font-size: var(--font-size-b1);

  line-height: var(--line-height-b1);

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale;

  font-family: "Manrope", sans-serif;

  color: var(--color-body);

  font-weight: var(--p-regular);

  position: relative;

  overflow-x: hidden;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  body {

    overflow: hidden;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  body {

    overflow: hidden;

  }

}

@media only screen and (max-width: 767px) {

  body {

    overflow: hidden;

  }

}

body::before {

  content: "";

  width: 100%;

  height: 100%;

  position: absolute;

  left: 0;

  top: 0;

  z-index: -1;

  opacity: 0.05;

}



h1,

h2,

h3,

h4,

h5,

h6,

.h1,

.h2,

.h3,

.h4,

.h5,

.h6,

address,

p,

pre,

blockquote,

menu,

ol,

ul,

table,

hr {

  margin: 0;

  margin-bottom: 20px;

}



h1,

h2,

h3,

h4,

h5,

h6,

.h1,

.h2,

.h3,

.h4,

.h5,

.h6 {

  word-break: break-word;

  font-family: "Source Serif 4", serif;

  line-height: 1.4074;

  color: var(--color-heading-1);

}



h1,

.h1 {

  font-size: var(--h1);

  line-height: 91px;

  font-weight: 600;

}



h2,

.h2 {

  font-size: var(--h2);

  line-height: 1.23;

}



h3,

.h3 {

  font-size: var(--h3);

  line-height: 1.3;

}



h4,

.h4 {

  font-size: var(--h4);

  line-height: 1.25;

}



h5,

.h5 {

  font-size: var(--h5);

  line-height: 1.24;

}



h6,

.h6 {

  font-size: var(--h6);

  line-height: 1.4;

}



h1 a,

h2 a,

h3 a,

h4 a,

h5 a,

h6 a,

.h1 a,

.h2 a,

.h3 a,

.h4 a,

.h5 a,

.h6 a {

  color: inherit;

}



.bg-color-tertiary h1,

.bg-color-tertiary h2,

.bg-color-tertiary h3,

.bg-color-tertiary h4,

.bg-color-tertiary h5,

.bg-color-tertiary h6,

.bg-color-tertiary .h1,

.bg-color-tertiary .h2,

.bg-color-tertiary .h3,

.bg-color-tertiary .h4,

.bg-color-tertiary .h5,

.bg-color-tertiary .h6 {

  color: #fff;

}

.bg-color-tertiary p {

  color: #6c7279;

}

.bg-color-tertiary a {

  color: #6c7279;

}



@media only screen and (min-width: 768px) and (max-width: 991px) {

  h1,

  .h1 {

    font-size: 38px;

  }

  h2,

  .h2 {

    font-size: 32px;

  }

  h3,

  .h3 {

    font-size: 28px;

  }

  h4,

  .h4 {

    font-size: 24px;

  }

  h5,

  .h5 {

    font-size: 18px;

  }

}

@media only screen and (max-width: 767px) {

  h1,

  .h1 {

    font-size: 34px;

  }

  h2,

  .h2 {

    font-size: 28px;

  }

  h3,

  .h3 {

    font-size: 24px;

  }

  h4,

  .h4 {

    font-size: 20px;

  }

  h5,

  .h5 {

    font-size: 20px;

  }

}

h1,

.h1,

h2,

.h2,

h3,

.h3 {

  font-weight: var(--s-semi-bold);

}



h4,

.h4,

h5,

.h5 {

  font-weight: var(--s-semi-bold);

}



h6,

.h6 {

  font-weight: var(--s-semi-bold);

}



p {

  font-size: var(--font-size-b2);

  line-height: var(--line-height-b2);

  font-weight: var(--p-regular);

  color: var(--color-body);

  margin: 0 0 40px;

}

@media only screen and (max-width: 767px) {

  p {

    margin: 0 0 20px;

    font-size: 16px;

    line-height: 28px;

  }

}

p.b1 {

  font-size: var(--font-size-b1);

  line-height: var(--line-height-b1);

}

p.b3 {

  font-size: var(--font-size-b3);

  line-height: var(--line-height-b3);

}

p.has-large-font-size {

  line-height: 1.5;

  font-size: 36px;

}

p.has-medium-font-size {

  font-size: 24px;

  line-height: 36px;

}

p.has-small-font-size {

  font-size: 13px;

}

p.has-very-light-gray-color {

  color: var(--color-white);

}

p.has-background {

  padding: 20px 30px;

}

p.b1 {

  font-size: var(--font-size-b1);

  line-height: var(--line-height-b1);

}

p.b2 {

  font-size: var(--font-size-b2);

  line-height: var(--line-height-b2);

}

p.b3 {

  font-size: var(--font-size-b3);

  line-height: var(--line-height-b3);

}

p:last-child {

  margin-bottom: 0;

}



.b1 {

  font-size: var(--font-size-b1);

  line-height: var(--line-height-b1);

}



.b2 {

  font-size: var(--font-size-b2);

  line-height: var(--line-height-b2);

}



.b3 {

  font-size: var(--font-size-b3);

  line-height: var(--line-height-b3);

}



.b4 {

  font-size: var(--font-size-b4);

  line-height: var(--line-height-b4);

}



table {

  border-collapse: collapse;

  border-spacing: 0;

  margin: 0 0 20px;

  width: 100%;

}



table a,

table a:link,

table a:visited {

  text-decoration: none;

}



cite,

.wp-block-pullquote cite,

.wp-block-pullquote.is-style-solid-color blockquote cite,

.wp-block-quote cite {

  color: var(--color-heading);

}



var {

  font-family: "Mona Sans", sans-serif;

}



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

	List Style 

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

ul,

ol {

  padding-left: 18px;

}



ul {

  list-style: square;

  margin-bottom: 30px;

  padding-left: 20px;

}

ul.liststyle.bullet li {

  font-size: 18px;

  line-height: 30px;

  color: var(--color-body);

  position: relative;

  padding-left: 30px;

}

@media only screen and (max-width: 767px) {

  ul.liststyle.bullet li {

    padding-left: 19px;

  }

}

ul.liststyle.bullet li::before {

  position: absolute;

  content: "";

  width: 6px;

  height: 6px;

  border-radius: 100%;

  background: var(--color-body);

  left: 0;

  top: 10px;

}

ul.liststyle.bullet li + li {

  margin-top: 8px;

}

ul li {

  font-size: var(--font-size-b1);

  line-height: var(--line-height-b1);

  margin-top: 10px;

  margin-bottom: 10px;

  color: var(--color-body);

}

ul li a {

  text-decoration: none;

  color: var(--color-gray);

}

ul li a:hover {

  color: var(--color-primary);

}

ul ul {

  margin-bottom: 0;

}



ol {

  margin-bottom: 30px;

}

ol li {

  font-size: var(--font-size-b1);

  line-height: var(--line-height-b1);

  color: var(--color-body);

  margin-top: 10px;

  margin-bottom: 10px;

}

ol li a {

  color: var(--color-heading);

  text-decoration: none;

}

ol li a:hover {

  color: var(--color-primary);

}

ol ul {

  padding-left: 30px;

}



.typo-title-area .title {

  margin-top: 0;

}



.paragraph-area p.disc {

  margin-bottom: 20px;

  color: #fff;

}



@media only screen and (max-width: 1199px) {

  h1 {

    font-size: 64px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  h1 {

    font-size: 54px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  h1 {

    font-size: 40px;

    line-height: 56px;

  }

}

@media only screen and (max-width: 767px) {

  h1 {

    font-size: 30px;

    line-height: 45px;

  }

}

@media only screen and (max-width: 576px) {

  h1 {

    font-size: 28px;

    line-height: 36px;

  }

}

@media only screen and (max-width: 479px) {

  h1 {

    font-size: 26px;

    line-height: 30px;

  }

}



@media only screen and (max-width: 1199px) {

  h2 {

    font-size: 54px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  h2 {

    font-size: 44px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  h2 {

    font-size: 36px;

    line-height: 56px;

  }

}

@media only screen and (max-width: 767px) {

  h2 {

    font-size: 30px;

    line-height: 45px;

  }

}

@media only screen and (max-width: 576px) {

  h2 {

    font-size: 26px;

    line-height: 36px;

  }

}

@media only screen and (max-width: 479px) {

  h2 {

    font-size: 26px;

    line-height: 38px;

  }

}



@media only screen and (max-width: 1199px) {

  h3 {

    font-size: 40px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  h3 {

    font-size: 36px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  h3 {

    font-size: 30px;

    line-height: 56px;

  }

}

@media only screen and (max-width: 767px) {

  h3 {

    font-size: 30px;

    line-height: 45px;

  }

}

@media only screen and (max-width: 576px) {

  h3 {

    font-size: 24px;

    line-height: 36px;

  }

}

@media only screen and (max-width: 479px) {

  h3 {

    font-size: 22px;

    line-height: 30px;

  }

}



* {

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

}



article,

aside,

details,

figcaption,

figure,

footer,

header,

nav,

section,

summary {

  display: block;

}



audio,

canvas,

video {

  display: inline-block;

}



audio:not([controls]) {

  display: none;

  height: 0;

}



[hidden] {

  display: none;

}



a {

  color: var(--color-heading);

  text-decoration: none;

  outline: none;

  transition: var(--transition);

}



a:hover,

a:focus,

a:active {

  text-decoration: none;

  outline: none;

  color: var(--color-primary);

}



a:focus {

  outline: none;

}



address {

  margin: 0 0 24px;

}



abbr[title] {

  border-bottom: 1px dotted;

}



b,

strong {

  font-weight: bold;

}



mark {

  background: var(--color-primary);

  color: #ffffff;

}



code,

kbd,

pre,

samp {

  font-size: var(--font-size-b3);

  -webkit-hyphens: none;

  -moz-hyphens: none;

  -ms-hyphens: none;

  hyphens: none;

  color: var(--color-primary);

}



kbd,

ins {

  color: #ffffff;

}



pre {

  font-family: "Raleway", sans-serif;

  font-size: var(--font-size-b3);

  margin: 10px 0;

  overflow: auto;

  padding: 20px;

  white-space: pre;

  white-space: pre-wrap;

  word-wrap: break-word;

  color: var(--color-body);

  background: var(--color-lighter);

}



small {

  font-size: smaller;

}



sub,

sup {

  font-size: 75%;

  line-height: 0;

  position: relative;

  vertical-align: baseline;

}



sup {

  top: -0.5em;

}



sub {

  bottom: -0.25em;

}



dl {

  margin-top: 0;

  margin-bottom: 10px;

}



dd {

  margin: 0 15px 15px;

}



dt {

  font-weight: bold;

  color: var(--color-heading);

}



menu,

ol,

ul {

  margin: 16px 0;

  padding: 0 0 0 40px;

}



nav ul,

nav ol {

  list-style: none;

  list-style-image: none;

}



li > ul,

li > ol {

  margin: 0;

}



ol ul {

  margin-bottom: 0;

}



img {

  -ms-interpolation-mode: bicubic;

  border: 0;

  vertical-align: middle;

  max-width: 100%;

  height: auto;

}



svg:not(:root) {

  overflow: hidden;

}



figure {

  margin: 0;

}



form {

  margin: 0;

}



fieldset {

  border: 1px solid var(--color-border);

  margin: 0 2px;

  min-width: inherit;

  padding: 0.35em 0.625em 0.75em;

}



legend {

  border: 0;

  padding: 0;

  white-space: normal;

}



button,

input,

select,

textarea {

  font-size: 100%;

  margin: 0;

  max-width: 100%;

  vertical-align: baseline;

}



button,

input {

  line-height: normal;

}



button,

html input[type=button],

input[type=reset],

input[type=submit] {

  -webkit-appearance: button;

  -moz-appearance: button;

  appearance: button;

  cursor: pointer;

}



button[disabled],

input[disabled] {

  cursor: default;

}



input[type=checkbox],

input[type=radio] {

  padding: 0;

}



input[type=search] {

  -webkit-appearance: textfield;

  -moz-appearance: textfield;

  appearance: textfield;

  appearance: textfield;

  padding-right: 2px;

  width: 270px;

}



input[type=search]::-webkit-search-decoration {

  -webkit-appearance: none;

  appearance: none;

}



button::-moz-focus-inner,

input::-moz-focus-inner {

  border: 0;

  padding: 0;

}



textarea {

  overflow: auto;

  vertical-align: top;

}



caption,

th,

td {

  font-weight: normal;

}



th {

  font-weight: 500;

  text-transform: uppercase;

}



td,

.wp-block-calendar tfoot td {

  border: 1px solid var(--color-border);

  padding: 7px 10px;

}



del {

  color: #333;

}



ins {

  background: rgba(255, 47, 47, 0.4);

  text-decoration: none;

}



hr {

  background-size: 4px 4px;

  border: 0;

  height: 1px;

  margin: 0 0 24px;

}



table a,

table a:link,

table a:visited {

  text-decoration: underline;

}



dt {

  font-weight: bold;

  margin-bottom: 10px;

}



dd {

  margin: 0 15px 15px;

}



caption {

  caption-side: top;

}



kbd {

  background: var(--heading-color);

}



dfn,

cite,

em {

  font-style: italic;

}



/* BlockQuote  */

blockquote,

q {

  -webkit-hyphens: none;

  -moz-hyphens: none;

  -ms-hyphens: none;

  hyphens: none;

  quotes: none;

}



blockquote:before,

blockquote:after,

q:before,

q:after {

  content: "";

  content: none;

}



blockquote {

  font-size: var(--font-size-b1);

  font-style: italic;

  font-weight: var(--p-light);

  margin: 24px 40px;

}



blockquote blockquote {

  margin-right: 0;

}



blockquote cite,

blockquote small {

  font-size: var(--font-size-b3);

  font-weight: normal;

}



blockquote strong,

blockquote b {

  font-weight: 700;

}



/* ========= Forms Styles ========= */

input,

button,

select,

textarea {

  background: transparent;

  border: 1px solid var(--color-border);

  transition: all 0.4s ease-out 0s;

  color: var(--color-body);

  width: 100%;

}

input:focus, input:active,

button:focus,

button:active,

select:focus,

select:active,

textarea:focus,

textarea:active {

  outline: none;

  border-color: var(--color-primary);

}



button,

[type=button],

[type=reset],

[type=submit] {

  -webkit-appearance: button;

}



input {

  height: 40px;

  padding: 0 15px;

}



input[type=text],

input[type=password],

input[type=email],

input[type=number],

input[type=tel],

textarea {

  font-size: var(--font-size-b2);

  font-weight: 400;

  height: auto;

  line-height: 28px;

  background: transparent;

  -webkit-box-shadow: none;

  box-shadow: none;

  padding: 0 15px;

  outline: none;

  border: var(--border-width) solid var(--color-border);

  border-radius: var(--radius);

  /* -- Placeholder -- */

}

input[type=text]::placeholder,

input[type=password]::placeholder,

input[type=email]::placeholder,

input[type=number]::placeholder,

input[type=tel]::placeholder,

textarea::placeholder {

  color: var(--body-color);

  /* Firefox */

  opacity: 1;

}

input[type=text]:-ms-input-placeholder,

input[type=password]:-ms-input-placeholder,

input[type=email]:-ms-input-placeholder,

input[type=number]:-ms-input-placeholder,

input[type=tel]:-ms-input-placeholder,

textarea:-ms-input-placeholder {

  /* Internet Explorer 10-11 */

  color: var(--body-color);

}

input[type=text]::-ms-input-placeholder,

input[type=password]::-ms-input-placeholder,

input[type=email]::-ms-input-placeholder,

input[type=number]::-ms-input-placeholder,

input[type=tel]::-ms-input-placeholder,

textarea::-ms-input-placeholder {

  /* Microsoft Edge */

  color: var(--body-color);

}

input[type=text].p-holder__active, .input-active input[type=text], input[type=text].input-active,

input[type=password].p-holder__active,

.input-active input[type=password],

input[type=password].input-active,

input[type=email].p-holder__active,

.input-active input[type=email],

input[type=email].input-active,

input[type=number].p-holder__active,

.input-active input[type=number],

input[type=number].input-active,

input[type=tel].p-holder__active,

.input-active input[type=tel],

input[type=tel].input-active,

textarea.p-holder__active,

textarea.input-active {

  border-color: var(--color-primary);

  /* -- Placeholder -- */

}

input[type=text].p-holder__active::placeholder, .input-active input[type=text]::placeholder, input[type=text].input-active::placeholder,

input[type=password].p-holder__active::placeholder,

.input-active input[type=password]::placeholder,

input[type=password].input-active::placeholder,

input[type=email].p-holder__active::placeholder,

.input-active input[type=email]::placeholder,

input[type=email].input-active::placeholder,

input[type=number].p-holder__active::placeholder,

.input-active input[type=number]::placeholder,

input[type=number].input-active::placeholder,

input[type=tel].p-holder__active::placeholder,

.input-active input[type=tel]::placeholder,

input[type=tel].input-active::placeholder,

textarea.p-holder__active::placeholder,

textarea.input-active::placeholder {

  color: var(--color-primary);

  /* Firefox */

  opacity: 1;

}

input[type=text].p-holder__active:-ms-input-placeholder, .input-active input[type=text]:-ms-input-placeholder, input[type=text].input-active:-ms-input-placeholder,

input[type=password].p-holder__active:-ms-input-placeholder,

.input-active input[type=password]:-ms-input-placeholder,

input[type=password].input-active:-ms-input-placeholder,

input[type=email].p-holder__active:-ms-input-placeholder,

.input-active input[type=email]:-ms-input-placeholder,

input[type=email].input-active:-ms-input-placeholder,

input[type=number].p-holder__active:-ms-input-placeholder,

.input-active input[type=number]:-ms-input-placeholder,

input[type=number].input-active:-ms-input-placeholder,

input[type=tel].p-holder__active:-ms-input-placeholder,

.input-active input[type=tel]:-ms-input-placeholder,

input[type=tel].input-active:-ms-input-placeholder,

textarea.p-holder__active:-ms-input-placeholder,

textarea.input-active:-ms-input-placeholder {

  /* Internet Explorer 10-11 */

  color: var(--color-primary);

}

input[type=text].p-holder__active::-ms-input-placeholder, .input-active input[type=text]::-ms-input-placeholder, input[type=text].input-active::-ms-input-placeholder,

input[type=password].p-holder__active::-ms-input-placeholder,

.input-active input[type=password]::-ms-input-placeholder,

input[type=password].input-active::-ms-input-placeholder,

input[type=email].p-holder__active::-ms-input-placeholder,

.input-active input[type=email]::-ms-input-placeholder,

input[type=email].input-active::-ms-input-placeholder,

input[type=number].p-holder__active::-ms-input-placeholder,

.input-active input[type=number]::-ms-input-placeholder,

input[type=number].input-active::-ms-input-placeholder,

input[type=tel].p-holder__active::-ms-input-placeholder,

.input-active input[type=tel]::-ms-input-placeholder,

input[type=tel].input-active::-ms-input-placeholder,

textarea.p-holder__active::-ms-input-placeholder,

textarea.input-active::-ms-input-placeholder {

  /* Microsoft Edge */

  color: var(--color-primary);

}

input[type=text].p-holder__error, .input-error input[type=text], input[type=text].input-error,

input[type=password].p-holder__error,

.input-error input[type=password],

input[type=password].input-error,

input[type=email].p-holder__error,

.input-error input[type=email],

input[type=email].input-error,

input[type=number].p-holder__error,

.input-error input[type=number],

input[type=number].input-error,

input[type=tel].p-holder__error,

.input-error input[type=tel],

input[type=tel].input-error,

textarea.p-holder__error,

textarea.input-error {

  border-color: #f4282d;

  /* -- Placeholder -- */

}

input[type=text].p-holder__error::placeholder, .input-error input[type=text]::placeholder, input[type=text].input-error::placeholder,

input[type=password].p-holder__error::placeholder,

.input-error input[type=password]::placeholder,

input[type=password].input-error::placeholder,

input[type=email].p-holder__error::placeholder,

.input-error input[type=email]::placeholder,

input[type=email].input-error::placeholder,

input[type=number].p-holder__error::placeholder,

.input-error input[type=number]::placeholder,

input[type=number].input-error::placeholder,

input[type=tel].p-holder__error::placeholder,

.input-error input[type=tel]::placeholder,

input[type=tel].input-error::placeholder,

textarea.p-holder__error::placeholder,

textarea.input-error::placeholder {

  color: #f4282d;

  /* Firefox */

  opacity: 1;

}

input[type=text].p-holder__error:-ms-input-placeholder, .input-error input[type=text]:-ms-input-placeholder, input[type=text].input-error:-ms-input-placeholder,

input[type=password].p-holder__error:-ms-input-placeholder,

.input-error input[type=password]:-ms-input-placeholder,

input[type=password].input-error:-ms-input-placeholder,

input[type=email].p-holder__error:-ms-input-placeholder,

.input-error input[type=email]:-ms-input-placeholder,

input[type=email].input-error:-ms-input-placeholder,

input[type=number].p-holder__error:-ms-input-placeholder,

.input-error input[type=number]:-ms-input-placeholder,

input[type=number].input-error:-ms-input-placeholder,

input[type=tel].p-holder__error:-ms-input-placeholder,

.input-error input[type=tel]:-ms-input-placeholder,

input[type=tel].input-error:-ms-input-placeholder,

textarea.p-holder__error:-ms-input-placeholder,

textarea.input-error:-ms-input-placeholder {

  /* Internet Explorer 10-11 */

  color: #f4282d;

}

input[type=text].p-holder__error::-ms-input-placeholder, .input-error input[type=text]::-ms-input-placeholder, input[type=text].input-error::-ms-input-placeholder,

input[type=password].p-holder__error::-ms-input-placeholder,

.input-error input[type=password]::-ms-input-placeholder,

input[type=password].input-error::-ms-input-placeholder,

input[type=email].p-holder__error::-ms-input-placeholder,

.input-error input[type=email]::-ms-input-placeholder,

input[type=email].input-error::-ms-input-placeholder,

input[type=number].p-holder__error::-ms-input-placeholder,

.input-error input[type=number]::-ms-input-placeholder,

input[type=number].input-error::-ms-input-placeholder,

input[type=tel].p-holder__error::-ms-input-placeholder,

.input-error input[type=tel]::-ms-input-placeholder,

input[type=tel].input-error::-ms-input-placeholder,

textarea.p-holder__error::-ms-input-placeholder,

textarea.input-error::-ms-input-placeholder {

  /* Microsoft Edge */

  color: #f4282d;

}

input[type=text].p-holder__error:focus, .input-error input[type=text]:focus, input[type=text].input-error:focus,

input[type=password].p-holder__error:focus,

.input-error input[type=password]:focus,

input[type=password].input-error:focus,

input[type=email].p-holder__error:focus,

.input-error input[type=email]:focus,

input[type=email].input-error:focus,

input[type=number].p-holder__error:focus,

.input-error input[type=number]:focus,

input[type=number].input-error:focus,

input[type=tel].p-holder__error:focus,

.input-error input[type=tel]:focus,

input[type=tel].input-error:focus,

textarea.p-holder__error:focus,

textarea.input-error:focus {

  border-color: #f4282d;

}

input[type=text]:focus,

input[type=password]:focus,

input[type=email]:focus,

input[type=number]:focus,

input[type=tel]:focus,

textarea:focus {

  border-color: var(--color-primary);

}



input[type=checkbox],

input[type=radio] {

  opacity: 0;

  position: absolute;

}

input[type=checkbox] ~ label,

input[type=radio] ~ label {

  position: relative;

  font-size: 15px;

  line-height: 25px;

  color: var(--body-color);

  font-weight: 400;

  padding-left: 20px;

  cursor: pointer;

  margin-bottom: 0;

}

input[type=checkbox] ~ label::before,

input[type=radio] ~ label::before {

  content: " ";

  position: absolute;

  top: 5px;

  left: 0;

  width: 14px;

  height: 14px;

  background-color: #fff;

  border: 2px solid var(--color-border);

  border-radius: 2px;

  transition: all 0.3s;

}

input[type=checkbox] ~ label::after,

input[type=radio] ~ label::after {

  content: " ";

  position: absolute;

  top: 9px;

  left: 2px;

  width: 10px;

  height: 5px;

  background-color: transparent;

  border-bottom: 2px solid #fff;

  border-left: 2px solid #fff;

  border-radius: 2px;

  transform: rotate(-45deg);

  opacity: 0;

  transition: all 0.3s;

}

input[type=checkbox]:checked ~ label::before,

input[type=radio]:checked ~ label::before {

  background-color: var(--color-primary);

  border-color: var(--color-primary);

}

input[type=checkbox]:checked ~ label::after,

input[type=radio]:checked ~ label::after {

  opacity: 1;

}



input:checked ~ .rn-check-box-label::before {

  background: var(--color-primary) !important;

}



input[type=radio] ~ label::before {

  border-radius: 50%;

}

input[type=radio] ~ label::after {

  width: 8px;

  height: 8px;

  left: 3px;

  background: #fff;

  border-radius: 50%;

}



.form-group {

  margin-bottom: 20px;

}

.form-group label {

  margin-bottom: 6px;

  font-size: 14px;

  line-height: 22px;

  font-weight: 500;

}

.form-group input {

  border: 0 none;

  border-radius: 4px;

  height: 50px;

  font-size: var(--font-size-b2);

  transition: var(--transition);

  padding: 0 20px;

  background-color: var(--color-lightest);

  border: 1px solid transparent;

  transition: var(--transition);

}

.form-group input:focus {

  border-color: var(--color-primary);

  box-shadow: none;

}

.form-group textarea {

  min-height: 160px;

  border: 0 none;

  border-radius: 4px;

  resize: none;

  padding: 15px;

  font-size: var(--font-size-b2);

  transition: var(--transition);

  background-color: var(--color-lightest);

  border: 1px solid transparent;

}

.form-group textarea:focus {

  border-color: var(--color-primary);

}



input[type=submit] {

  width: auto;

  padding: 0 30px;

  border-radius: 500px;

  display: inline-block;

  font-weight: 500;

  transition: 0.3s;

  height: 60px;

  background: var(--color-primary);

  color: var(--color-white);

  font-weight: var(--p-medium);

  font-size: var(--font-size-b2);

  line-height: var(--line-height-b3);

  height: 50px;

  border: 2px solid var(--color-primary);

  transition: var(--transition);

}

input[type=submit]:hover {

  background: transparent;

  color: var(--color-primary);

  transform: translateY(-5px);

}



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

 *  Utilities

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

.clearfix:before,

.clearfix:after {

  content: " ";

  display: table;

}



.clearfix:after {

  clear: both;

}



.fix {

  overflow: hidden;

}



.slick-initialized .slick-slide {

  margin-bottom: -10px;

}



.slick-gutter-15 {

  margin: -30px -15px;

}

.slick-gutter-15 .slick-slide {

  padding: 30px 15px;

}



iframe {

  width: 100%;

}



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

    Background Color 

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

.bg-color-primary {

  background: var(--color-primary);

}



.bg-color-secondary {

  background: var(--color-secondary);

}



.bg-color-tertiary {

  background: var(--color-tertiary);

}



.bg-color-gray {

  background: var(--color-gray);

}



.bg-color-white {

  background: #FFFFFF;

}



.bg-color-black {

  background: #1A1A1A;

}



.bg-color-extra03 {

  background: var(--color-extra03);

}



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

Background Image 

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

.bg_image {

  background-repeat: no-repeat;

  background-size: cover;

  background-position: center center;

}



.bg_image--1 {

  background-image: url(../images/bg/bg-image-1.webp);

}



.bg_image--2 {

  background-image: url(../images/bg/bg-image-2.webp);

}



.bg_image--3 {

  background-image: url(../images/bg/bg-image-3.webp);

}



.bg_image--4 {

  background-image: url(../images/bg/bg-image-4.webp);

}



.bg_image--5 {

  background-image: url(../images/bg/bg-image-5.webp);

}



.bg_image--6 {

  background-image: url(../images/bg/bg-image-6.webp);

}



.bg_image--7 {

  background-image: url(../images/bg/bg-image-7.webp);

}



.bg_image--8 {

  background-image: url(../images/bg/bg-image-8.webp);

}



.bg_image--9 {

  background-image: url(../images/bg/bg-image-9.webp);

}



.bg_image--10 {

  background-image: url(../images/bg/bg-image-10.webp);

}



.bg_image--11 {

  background-image: url(../images/bg/bg-image-11.webp);

}



.bg_image--12 {

  background-image: url(../images/bg/bg-image-12.webp);

}



.bg_image--13 {

  background-image: url(../images/bg/bg-image-13.webp);

}



.bg_image--14 {

  background-image: url(../images/bg/bg-image-14.webp);

}



.bg_image--15 {

  background-image: url(../images/bg/bg-image-15.webp);

}



.bg_image--16 {

  background-image: url(../images/bg/bg-image-16.webp);

}



.bg_image--17 {

  background-image: url(../images/bg/bg-image-17.html);

}



.bg_image--18 {

  background-image: url(../images/bg/bg-image-18.html);

}



.bg_image--19 {

  background-image: url(../images/bg/bg-image-19.html);

}



.bg_image--20 {

  background-image: url(../images/bg/bg-image-20.html);

}



.bg_image--21 {

  background-image: url(../images/bg/bg-image-21.html);

}



.bg_image--22 {

  background-image: url(../images/bg/bg-image-22.html);

}



.bg_image--23 {

  background-image: url(../images/bg/bg-image-23.html);

}



.bg_image--24 {

  background-image: url(../images/bg/bg-image-24.html);

}



.bg_image--25 {

  background-image: url(../images/bg/bg-image-25.html);

}



.bg_image--26 {

  background-image: url(../images/bg/bg-image-26.html);

}



.bg_image--27 {

  background-image: url(../images/bg/bg-image-27.html);

}



.bg_image--28 {

  background-image: url(../images/bg/bg-image-28.html);

}



.bg_image--29 {

  background-image: url(../images/bg/bg-image-29.html);

}



.bg_image--30 {

  background-image: url(../images/bg/bg-image-30.html);

}



.bg_image--31 {

  background-image: url(../images/bg/bg-image-31.html);

}



.bg_image--32 {

  background-image: url(../images/bg/bg-image-32.html);

}



.bg_image--33 {

  background-image: url(../images/bg/bg-image-33.html);

}



.bg_image--34 {

  background-image: url(../images/bg/bg-image-34.html);

}



.bg_image--35 {

  background-image: url(../images/bg/bg-image-35.html);

}



.bg_image--36 {

  background-image: url(../images/bg/bg-image-36.html);

}



.bg_image--37 {

  background-image: url(../images/bg/bg-image-37.html);

}



.bg_image--38 {

  background-image: url(../images/bg/bg-image-38.html);

}



.bg_image--39 {

  background-image: url(../images/bg/bg-image-39.html);

}



.bg_image--40 {

  background-image: url(../images/bg/bg-image-40.html);

}



.bg_tr-image--1 {

  background-image: url(../images/bg/bg-image-1.webp) !important;

  background-size: cover !important;

}



.bg_tr-image--2 {

  background-image: url(../images/bg/bg-image-2.webp) !important;

  background-size: cover !important;

}



.bg_tr-image--3 {

  background-image: url(../images/bg/bg-image-3.webp) !important;

  background-size: cover !important;

}



.bg_tr-image--4 {
  background-image: url(../images/bg/bg-image-4.webp) !important;

  background-size: cover !important;

}



.bg_tr-image--5 {

  background-image: url(../images/bg/bg-image-5.webp) !important;

  background-size: cover !important;

}



.bg_tr-image--6 {

  background-image: url(../images/bg/bg-image-6.webp) !important;

  background-size: cover !important;

}



.bg_tr-image--7 {

  background-image: url(../images/bg/bg-image-7.webp) !important;

  background-size: cover !important;

}



.bg_tr-image--8 {

  background-image: url(../images/bg/bg-image-8.webp) !important;

  background-size: cover !important;

}



.bg_tr-image--9 {

  background-image: url(../images/bg/bg-image-9.webp) !important;

  background-size: cover !important;

}



.bg_tr-image--10 {

  background-image: url(../images/bg/bg-image-10.webp) !important;

  background-size: cover !important;

}



.bg_tr-image--11 {

  background-image: url(../images/bg/bg-image-11.webp) !important;

  background-size: cover !important;

}



.bg_tr-image--12 {

  background-image: url(../images/bg/bg-image-12.webp) !important;

  background-size: cover !important;

}



.bg_tr-image--13 {

  background-image: url(../images/bg/bg-image-13.webp) !important;

  background-size: cover !important;

}



.bg_tr-image--14 {

  background-image: url(../images/bg/bg-image-14.webp) !important;

  background-size: cover !important;

}



.bg_tr-image--15 {

  background-image: url(../images/bg/bg-image-15.webp) !important;

  background-size: cover !important;

}



.bg_tr-image--16 {

  background-image: url(../images/bg/bg-image-16.webp) !important;

  background-size: cover !important;

}



.bg_tr-image--17 {

  background-image: url(../images/bg/bg-image-17.html) !important;

  background-size: cover !important;

}



.bg_tr-image--18 {

  background-image: url(../images/bg/bg-image-18.html) !important;

  background-size: cover !important;

}



.bg_tr-image--19 {

  background-image: url(../images/bg/bg-image-19.html) !important;

  background-size: cover !important;

}



.bg_tr-image--20 {

  background-image: url(../images/bg/bg-image-20.html) !important;

  background-size: cover !important;

}



/* Height and width */

.fullscreen {

  min-height: 980px;

  width: 100%;

}



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

Custom Row

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

.row--0 {

  margin-left: 0px;

  margin-right: 0px;

}

.row--0 > [class*=col] {

  padding-left: 0px;

  padding-right: 0px;

}



.row--5 {

  margin-left: -5px;

  margin-right: -5px;

}

.row--5 > [class*=col] {

  padding-left: 5px;

  padding-right: 5px;

}



.row--10 {

  margin-left: -10px;

  margin-right: -10px;

}

.row--10 > [class*=col] {

  padding-left: 10px;

  padding-right: 10px;

}



.row--20 {

  margin-left: -20px;

  margin-right: -20px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .row--20 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .row--20 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .row--20 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (max-width: 767px) {

  .row--20 {

    margin-left: -15px !important;

    margin-right: -15px !important;

  }

}

.row--20 > [class*=col], .row--20 > [class*=col-] {

  padding-left: 20px;

  padding-right: 20px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .row--20 > [class*=col], .row--20 > [class*=col-] {

    padding-left: 15px;

    padding-right: 15px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .row--20 > [class*=col], .row--20 > [class*=col-] {

    padding-left: 15px;

    padding-right: 15px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .row--20 > [class*=col], .row--20 > [class*=col-] {

    padding-left: 15px !important;

    padding-right: 15px !important;

  }

}

@media only screen and (max-width: 767px) {

  .row--20 > [class*=col], .row--20 > [class*=col-] {

    padding-left: 15px !important;

    padding-right: 15px !important;

  }

}



.row--25 {

  margin-left: -25px;

  margin-right: -25px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .row--25 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .row--25 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .row--25 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (max-width: 767px) {

  .row--25 {

    margin-left: -15px !important;

    margin-right: -15px !important;

  }

}

.row--25 > [class*=col], .row--25 > [class*=col-] {

  padding-left: 25px;

  padding-right: 25px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .row--25 > [class*=col], .row--25 > [class*=col-] {

    padding-left: 15px;

    padding-right: 15px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .row--25 > [class*=col], .row--25 > [class*=col-] {

    padding-left: 15px;

    padding-right: 15px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .row--25 > [class*=col], .row--25 > [class*=col-] {

    padding-left: 15px !important;

    padding-right: 15px !important;

  }

}

@media only screen and (max-width: 767px) {

  .row--25 > [class*=col], .row--25 > [class*=col-] {

    padding-left: 15px !important;

    padding-right: 15px !important;

  }

}



.row--30 {

  margin-left: -30px;

  margin-right: -30px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .row--30 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .row--30 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .row--30 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (max-width: 767px) {

  .row--30 {

    margin-left: -15px !important;

    margin-right: -15px !important;

  }

}

.row--30 > [class*=col], .row--30 > [class*=col-] {

  padding-left: 30px;

  padding-right: 30px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .row--30 > [class*=col], .row--30 > [class*=col-] {

    padding-left: 15px;

    padding-right: 15px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .row--30 > [class*=col], .row--30 > [class*=col-] {

    padding-left: 15px;

    padding-right: 15px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .row--30 > [class*=col], .row--30 > [class*=col-] {

    padding-left: 15px !important;

    padding-right: 15px !important;

  }

}

@media only screen and (max-width: 767px) {

  .row--30 > [class*=col], .row--30 > [class*=col-] {

    padding-left: 15px !important;

    padding-right: 15px !important;

  }

}



.row--45 {

  margin-left: -45px;

  margin-right: -45px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .row--45 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .row--45 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .row--45 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (max-width: 767px) {

  .row--45 {

    margin-left: -15px !important;

    margin-right: -15px !important;

  }

}

.row--45 > [class*=col], .row--45 > [class*=col-] {

  padding-left: 45px;

  padding-right: 45px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .row--45 > [class*=col], .row--45 > [class*=col-] {

    padding-left: 15px;

    padding-right: 15px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .row--45 > [class*=col], .row--45 > [class*=col-] {

    padding-left: 15px;

    padding-right: 15px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .row--45 > [class*=col], .row--45 > [class*=col-] {

    padding-left: 15px !important;

    padding-right: 15px !important;

  }

}

@media only screen and (max-width: 767px) {

  .row--45 > [class*=col], .row--45 > [class*=col-] {

    padding-left: 15px !important;

    padding-right: 15px !important;

  }

}



.row--40 {

  margin-left: -40px;

  margin-right: -40px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .row--40 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .row--40 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .row--40 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (max-width: 767px) {

  .row--40 {

    margin-left: -15px !important;

    margin-right: -15px !important;

  }

}

.row--40 > [class*=col], .row--40 > [class*=col-] {

  padding-left: 40px;

  padding-right: 40px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .row--40 > [class*=col], .row--40 > [class*=col-] {

    padding-left: 15px;

    padding-right: 15px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .row--40 > [class*=col], .row--40 > [class*=col-] {

    padding-left: 15px;

    padding-right: 15px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .row--40 > [class*=col], .row--40 > [class*=col-] {

    padding-left: 15px !important;

    padding-right: 15px !important;

  }

}

@media only screen and (max-width: 767px) {

  .row--40 > [class*=col], .row--40 > [class*=col-] {

    padding-left: 15px !important;

    padding-right: 15px !important;

  }

}



.row--60 {

  margin-left: -60px;

  margin-right: -60px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .row--60 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .row--60 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .row--60 {

    margin-left: -15px;

    margin-right: -15px;

  }

}

@media only screen and (max-width: 767px) {

  .row--60 {

    margin-left: -15px !important;

    margin-right: -15px !important;

  }

}

.row--60 > [class*=col], .row--60 > [class*=col-] {

  padding-left: 60px;

  padding-right: 60px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .row--60 > [class*=col], .row--60 > [class*=col-] {

    padding-left: 15px;

    padding-right: 15px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .row--60 > [class*=col], .row--60 > [class*=col-] {

    padding-left: 15px;

    padding-right: 15px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .row--60 > [class*=col], .row--60 > [class*=col-] {

    padding-left: 15px !important;

    padding-right: 15px !important;

  }

}

@media only screen and (max-width: 767px) {

  .row--60 > [class*=col], .row--60 > [class*=col-] {

    padding-left: 15px !important;

    padding-right: 15px !important;

  }

}



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

    Input Placeholder

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

input:-moz-placeholder,

textarea:-moz-placeholder {

  opacity: 1;

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";

}



input::-webkit-input-placeholder,

textarea::-webkit-input-placeholder {

  opacity: 1;

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";

}



input::-moz-placeholder,

textarea::-moz-placeholder {

  opacity: 1;

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";

}



input:-ms-input-placeholder,

textarea:-ms-input-placeholder {

  opacity: 1;

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";

}



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

	Overlay styles 

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

[data-overlay],

[data-black-overlay],

[data-white-overlay] {

  position: relative;

  z-index: 2;

}



[data-overlay] > div,

[data-overlay] > *,

[data-black-overlay] > div,

[data-black-overlay] > *,

[data-white-overlay] > div,

[data-white-overlay] > * {

  position: relative;

  z-index: 2;

}



[data-overlay]:before,

[data-black-overlay]:before,

[data-white-overlay]:before {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  height: 100%;

  width: 100%;

  z-index: -1;

}



[data-overlay]:before {

  background: var(--color-primary);

}



[data-black-overlay]:before {

  background-color: #000000;

}



[data-white-overlay]:before {

  background-color: #ffffff;

}



[data-overlay="1"]:before,

[data-black-overlay="1"]:before,

[data-white-overlay="1"]:before {

  opacity: 0.1;

}



[data-overlay="2"]:before,

[data-black-overlay="2"]:before,

[data-white-overlay="2"]:before {

  opacity: 0.2;

}



[data-overlay="3"]:before,

[data-black-overlay="3"]:before,

[data-white-overlay="3"]:before {

  opacity: 0.3;

}



[data-overlay="4"]:before,

[data-black-overlay="4"]:before,

[data-white-overlay="4"]:before {

  opacity: 0.4;

}



[data-overlay="5"]:before,

[data-black-overlay="5"]:before,

[data-white-overlay="5"]:before {

  opacity: 0.5;

}



[data-overlay="6"]:before,

[data-black-overlay="6"]:before,

[data-white-overlay="6"]:before {

  opacity: 0.6;

}



[data-overlay="7"]:before,

[data-black-overlay="7"]:before,

[data-white-overlay="7"]:before {

  opacity: 0.7;

}



[data-overlay="8"]:before,

[data-black-overlay="8"]:before,

[data-white-overlay="8"]:before {

  opacity: 0.8;

}



[data-overlay="9"]:before,

[data-black-overlay="9"]:before,

[data-white-overlay="9"]:before {

  opacity: 0.9;

}



[data-overlay="10"]:before,

[data-black-overlay="10"]:before,

[data-white-overlay="10"]:before {

  opacity: 1;

}



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

    Scroll Up 

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

#scrollUp {

  width: 70px;

  height: 80px;

  right: 100px;

  bottom: 60px;

  text-align: center;

  z-index: 9811 !important;

  text-decoration: none;

  background: #fff;

  line-height: 80px;

  color: #757589;

  font-size: 15px;

  font-weight: 400;

  transition: var(--transition);

  display: inline-block;

  background: #ffffff;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  #scrollUp {

    right: 20px;

    bottom: 40px;

  }

}

@media only screen and (max-width: 767px) {

  #scrollUp {

    right: 20px;

    bottom: 40px;

  }

}

#scrollUp::before {

  width: 100%;

  height: 100%;

  left: 0;

  bottom: 0;

  background: rgba(0, 2, 72, 0.1);

  content: "";

  position: absolute;

  z-index: -1;

  transform-style: preserve-3d;

  transform: rotateY(-10deg);

  filter: blur(50px);

}

#scrollUp::after {

  background: #ffffff;

  position: absolute;

  content: "";

  top: 0;

  bottom: 0;

  left: 0;

  right: 0;

  width: 100%;

  height: 100%;

  z-index: -1;

  transform-style: preserve-3d;

  transform: rotateY(-10deg);

}

@media only screen and (max-width: 767px) {

  #scrollUp {

    right: 20px;

    bottom: 30px;

    width: 50px;

    height: 60px;

    line-height: 60px;

  }

}

#scrollUp span.text {

  position: relative;

  display: inline-block;

  margin-top: 7px;

}

@media only screen and (max-width: 767px) {

  #scrollUp span.text {

    margin-top: 3px;

  }

}

#scrollUp span.text::after {

  width: 0;

  height: 0;

  border-style: solid;

  border-width: 0 5px 7px 5px;

  border-color: transparent transparent var(--color-primary) transparent;

  position: absolute;

  content: "";

  left: 50%;

  top: 21%;

  transform: translateX(-50%);

}

#scrollUp:hover span.text {

  color: var(--color-primary);

}



body {

  scroll-behavior: auto;

  background: #ffffff;

  overflow-x: hidden;

  padding: 0;

  padding-right: 0 !important;

}

body.with-sidebar {

  overflow-x: visible;

}



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

    Header Sticky 

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

.col-lg-20 {

  width: 20%;

  float: left;

}



.col-xs-20,

.col-sm-20,

.col-md-20,

.col-lg-20 {

  position: relative;

  min-height: 1px;

  padding-right: 15px;

  padding-left: 15px;

  padding-bottom: 15px;

  padding-top: 15px;

}



@media (min-width: 1200px) {

  .col-lg-20 {

    width: 20%;

    float: left;

  }

}

@media only screen and (max-width: 1199px) {

  .col-lg-20 {

    width: 33%;

    float: left;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .col-lg-20 {

    width: 50%;

    float: left;

  }

}

@media only screen and (max-width: 767px) {

  .col-lg-20 {

    width: 50%;

    float: left;

  }

}

@media only screen and (max-width: 576px) {

  .col-lg-20 {

    width: 50%;

    float: left;

  }

}

@media only screen and (max-width: 479px) {

  .col-lg-20 {

    width: 100%;

    float: left;

  }

}



::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */

  color: #5D666F !important;

  opacity: 1 !important; /* Firefox */

  font-size: 16px;

}



:-ms-input-placeholder { /* Internet Explorer 10-11 */

  color: #5D666F !important;

  font-size: 16px;

}



::-ms-input-placeholder { /* Microsoft Edge */

  color: #5D666F !important;

  font-size: 16px;

}



.accordion-item:last-of-type .accordion-button.collapsed {

  border-bottom-right-radius: 5px;

  border-bottom-left-radius: 5px;

}



.over_link {

  position: absolute;

  height: 100%;

  width: 100%;

  z-index: 9;

  left: 0;

  top: 0;

}



.home-one {

  background: #FFFFFF;

}



.elecate-center-title {

  text-align: center;

}

.elecate-center-title span {

  font-weight: 600;

  font-size: 16px;

  line-height: 24px;

  letter-spacing: 0.1em;

  color: #FF6600;

  text-transform: uppercase;

  font-family: var(--font-primary);

}

.elecate-center-title h3.title {

  font-weight: 700;

  font-size: 40px;

  line-height: 61px;

  color: #0C0A0A;

  text-transform: uppercase;

  margin-top: 5px;

}

@media only screen and (max-width: 767px) {

  .elecate-center-title h3.title {

    font-size: 30px;

    line-height: 42px;

  }

  .elecate-center-title h3.title br {

    display: none;

  }

}



#menu-btn .icon {

  margin: 0 !important;

}



.elecate-left-title {

  text-align: left;

}

.elecate-left-title span {

  font-weight: 600;

  font-size: 16px;

  line-height: 24px;

  letter-spacing: 0.1em;

  color: #FF6600;

  text-transform: uppercase;

  font-family: var(--font-primary);

}

.elecate-left-title h3.title {

  font-weight: 700;

  font-size: 40px;

  line-height: 50px;

  color: #0C0A0A;

  text-transform: uppercase;

  margin-top: 5px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .elecate-left-title h3.title {

    font-size: 28px;

    line-height: 43px;

  }

}

@media only screen and (max-width: 767px) {

  .elecate-left-title h3.title {

    font-size: 29px;

    line-height: 41px;

  }

}



body.index-nine {

  background: #F2F2F2;

}

body.index-nine .main-title-area-center {

  text-align: center;

}

body.index-nine .main-title-area-center span.pre {

  color: var(--color-primary);

  font-weight: 500;

  font-size: 16px;

  line-height: 24px;

  text-transform: uppercase;

}



@media (min-width: 576px) {

  .container, .container-sm {

    max-width: 540px;

  }

}

@media (min-width: 768px) {

  .container, .container-md, .container-sm {

    max-width: 720px;

  }

}

@media (min-width: 992px) {

  .container, .container-lg, .container-md, .container-sm {

    max-width: 960px;

  }

}

@media (min-width: 1200px) {

  .container, .container-lg, .container-md, .container-sm, .container-xl {

    max-width: 1140px;

  }

}

@media (min-width: 1400px) {

  .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {

    max-width: 1346px;

  }

}

@media (min-width: 1500px) {

  .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {

    max-width: 1370px;

  }

}

@media (min-width: 576px) {

  .container-2, .container-2-sm {

    max-width: 540px;

  }

}

@media (min-width: 768px) {

  .container-2, .container-2-md, .container-2-sm {

    max-width: 720px;

  }

}

@media (min-width: 992px) {

  .container-2, .container-2-lg, .container-2-md, .container-2-sm {

    max-width: 960px;

  }

}

@media (min-width: 1200px) {

  .container-2, .container-2-lg, .container-2-md, .container-2-sm, .container-2-xl {

    max-width: 1140px;

  }

}

@media (min-width: 1400px) {

  .container-2, .container-2-lg, .container-2-md, .container-2-sm, .container-2-xl, .container-2-xxl {

    max-width: 1366px;

  }

}

@media (min-width: 1600px) {

  .container-2, .container-2-lg, .container-2-md, .container-2-sm, .container-2-xl, .container-2-xxl {

    max-width: 1544px;

  }

}

.container-2 {

  width: 100%;

  padding-right: var(--bs-gutter-x, 0.75rem);

  padding-left: var(--bs-gutter-x, 0.75rem);

  margin-right: auto;

  margin-left: auto;

}



@media (min-width: 576px) {

  .container-3, .container-3-sm {

    max-width: 540px;

  }

}

@media (min-width: 768px) {

  .container-3, .container-3-md, .container-3-sm {

    max-width: 720px;

  }

}

@media (min-width: 992px) {

  .container-3, .container-3-lg, .container-3-md, .container-3-sm {

    max-width: 960px;

  }

}

@media (min-width: 1200px) {

  .container-3, .container-3-lg, .container-3-md, .container-3-sm, .container-3-xl {

    max-width: 1140px;

  }

}

@media (min-width: 1400px) {

  .container-3, .container-3-lg, .container-3-md, .container-3-sm, .container-3-xl, .container-3-xxl {

    max-width: 1320px;

  }

}

@media (min-width: 576px) {

  .container-header, .container-header-sm {

    max-width: 540px;

  }

}

@media (min-width: 768px) {

  .container-header, .container-header-md, .container-header-sm {

    max-width: 720px;

  }

}

@media (min-width: 992px) {

  .container-header, .container-header-lg, .container-header-md, .container-header-sm {

    max-width: 98%;

  }

}

@media (min-width: 1200px) {

  .container-header, .container-header-lg, .container-header-md, .container-header-sm, .container-header-xl {

    max-width: 1140px;

  }

}

@media (min-width: 1400px) {

  .container-header, .container-header-lg, .container-header-md, .container-header-sm, .container-header-xl, .container-header-xxl {

    max-width: 1320px;

  }

}

.container-3, .container-header {

  width: 100%;

  padding-right: var(--bs-gutter-x, 0.75rem);

  padding-left: var(--bs-gutter-x, 0.75rem);

  margin-right: auto;

  margin-left: auto;

}



.header-custom-container {

  max-width: 1600px;

  width: 100%;

  padding-right: var(--bs-gutter-x, 0.75rem);

  padding-left: var(--bs-gutter-x, 0.75rem);

  margin-right: auto;

  margin-left: auto;

}



.banner-custom-container {

  max-width: 100%;

  width: 100%;

  padding-right: var(--bs-gutter-x, 0.75rem);

  padding-left: var(--bs-gutter-x, 0.75rem);

  margin-right: auto;

  margin-left: auto;

}



.header-custom-container2 {

  max-width: 1400px;

  width: 100%;

  padding-right: var(--bs-gutter-x, 0.75rem);

  padding-left: var(--bs-gutter-x, 0.75rem);

  margin-right: auto;

  margin-left: auto;

}



.custom-container3 {

  max-width: 1599px;

  width: 100%;

  padding-right: var(--bs-gutter-x, 0.75rem);

  padding-left: var(--bs-gutter-x, 0.75rem);

  margin-right: auto;

  margin-left: auto;

}



.section-title-area .pre-title {

  color: var(--color-primary);

  font-weight: 400;

  border-radius: 4px;

  line-height: 1;

  padding: 10px 20px;

  background: var(--primary-50);

  max-width: max-content;

  margin-bottom: 20px;

}

.section-title-area .Section-title {

  font-weight: 600;

  max-width: 469px;

  color: var(--color-heading-1);

  margin-bottom: 15px;

}



.button-group-area .button-group {

  flex-wrap: wrap;

  gap: 20px;

}



.demo-orange .section-title-area .pre-title {

  background: var(--secondary-100);

}

.demo-orange .tmp-testimonials-area .client-content .reveiw-area .counter-area {

  background: var(--secondary-100);

  border-radius: 4px;

}



.section-title-area-2 {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

@media only screen and (max-width: 991px) {

  .section-title-area-2 {

    flex-wrap: wrap;

  }

}

.section-title-area-2 .left-side-content .sub-title {

  margin-bottom: 15px;

  font-size: 16px;

  line-height: 24px;

  font-weight: 600;

  color: var(--color-primary);

  font-family: var(--font-primary);

  position: relative;

  z-index: 1;

  padding-left: 0;

  max-width: max-content;

}

.section-title-area-2 .left-side-content .sub-title::after {

  content: "";

  position: absolute;

  width: 40px;

  height: 2px;

  background: linear-gradient(90deg, var(--color-primary), rgba(33, 38, 45, 0)) !important;

  right: -48px;

  top: 50%;

  transform: translateY(-50%);

}

.section-title-area-2 .left-side-content .section-title {

  font-weight: 600;

  line-height: 58px;

}

.section-title-area-2 .left-side-content .section-title span {

  color: var(--color-primary);

}

.section-title-area-2 .right-side-button .rts-text-btn {

  display: flex;

  align-items: center;

  gap: 10px;

}

.section-title-area-2 .right-side-button .rts-text-btn span {

  display: block;

  background: var(--color-primary);

  width: 80px;

  height: 80px;

  line-height: 95px;

  border-radius: 50%;

  text-align: center;

  color: var(--color-white);

}

.section-title-area-2 .right-side-button .rts-text-btn span i {

  transform: rotate(-45deg);

  font-size: 30px;

  font-weight: 500;

}

.section-title-area-2 .right-side-button .rts-text-btn span.bcg {

  background: var(--color-primary-2);

}

.section-title-area-2 .right-side-button .rts-text-btn p {

  font-size: 30px;

  line-height: 37px;

  color: var(--color-black);

  font-family: var(--font-primary);

  font-weight: 600;

}



.section-title-area-3 .sub-title {

  margin: 0 auto;

  margin-bottom: 15px;

  font-size: 16px;

  line-height: 24px;

  font-weight: 600;

  color: var(--color-primary);

  font-family: var(--font-primary);

  position: relative;

  max-width: max-content;

  z-index: 1;

  padding: 0 35px;

}

.section-title-area-3 .sub-title::before {

  content: "";

  position: absolute;

  width: 56px;

  height: 2px;

  background: linear-gradient(-90deg, var(--color-primary), rgba(33, 38, 45, 0)) !important;

  left: -30px;

  top: 50%;

  transform: translateY(-50%);

}

.section-title-area-3 .sub-title::after {

  content: "";

  position: absolute;

  width: 56px;

  height: 2px;

  background: linear-gradient(90deg, var(--color-primary), rgba(33, 38, 45, 0)) !important;

  right: -30px;

  top: 50%;

  transform: translateY(-50%);

}

.section-title-area-3 .section-title {

  font-weight: 600;

  line-height: 58px;

  text-align: center;

}

.section-title-area-3 .section-title span {

  color: var(--color-primary);

}



.title-between-shop {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

@media only screen and (max-width: 576px) {

  .title-between-shop {

    flex-wrap: wrap;

    gap: 20px;

  }

}

.title-between-shop .left-area-start span {

  margin-bottom: 10px;

  font-weight: 500;

  display: block;

  color: var(--color-primary);

}

.title-between-shop .left-area-start .title {

  margin-bottom: 0;

  font-size: 26px;

  font-weight: 700;

}



.section-title-area-4 .sub-title {

  margin-bottom: 15px;

  font-size: 16px;

  line-height: 24px;

  font-weight: 500;

  font-family: var(--font-primary);

  position: relative;

  z-index: 1;

  padding-left: 0;

  max-width: max-content;

}

.section-title-area-4 .sub-title::after {

  content: "";

  position: absolute;

  width: 42px;

  right: -50px;

  top: 50%;

  transform: translateY(-50%);

  height: 2px;

  background: linear-gradient(90deg, var(--color-primary), rgba(33, 38, 45, 0)) !important;

}

.section-title-area-4 .section-title {

  font-weight: 600;

  line-height: 58px;

}

.section-title-area-4 .section-title span {

  color: var(--color-primary);

}



ul {

  padding: 0;

  margin: 0;

}

ul li {

  list-style: none;

  padding: 0;

  margin: 0;

}



.bg-style {

  background-position: center !important;

  background-repeat: no-repeat !important;

  background-size: cover !important;

}



.slider-img-one {

  background: url(../images/banner/03.webp);

}



.slider-img-two {

  background: url(../images/banner/03.webp);

}



.slider-img-three {

  background: url(../images/banner/03.webp);

}



.slider-img-four {

  background: url(../images/banner/11.webp);

}



.slider-img-seven {

  background: url(../images/banner/12.webp);

}



.slider-img-ten {

  background: url(../images/banner/25.webp);

}



.slider-img-nine {

  background: url(../images/banner/26.webp);

}



.slider-img-01 {

  background: url(../images/bg/01.webp);

}



.slider-img-02 {

  background: url(../images/bg/02.webp);

}



.slider-img-28 {

  background: url(../images/banner/28.webp);

}



.slider-img-29 {

  background: url(../images/banner/29.webp);

}



.slider-img-eight {

  background: url(../images/banner/19.webp);

}

.slider-img-eight::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  z-index: -2 !important;

}



@media only screen and (max-width: 576px) {

  p.desc br {

    display: none;

  }

}



.bg-color-n {

  background: var(--primary-50);

}



.z-1 {

  z-index: 1;

}



.cg {

  color: var(--color-primary-2) !important;

}

.cg::after, .cg::before {

  background: var(--color-primary-2) !important;

}



.cw {

  color: var(--color-white) !important;

}



.bg-dark {

  background-color: #1F242E !important;

}



.radius-small {

  border-radius: 6px !important;

}



.swiper-slider {

  overflow: hidden;

}



.cp-none {

  clip-path: none !important;

  border-radius: 4px;

  overflow: hidden;

}



.bg-project {

  background: #F6F6F6;

}



.bg-project2 {

  background: #f7fdff !important;

}



@media (max-width: 1200px) {

  .order-change-lg {

    order: -1;

  }

}



.bg-white-v2 {

  background: #F6F6F6 !important;

}



.pagination-area ul {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 10px;

}

.pagination-area ul li {

  width: 45px;

  height: 45px;

  line-height: 45px;

  border-radius: 50%;

  text-align: center;

  display: block;

  background: rgb(255, 255, 255);

  transition: var(--transition);

  font-family: var(--font-primary);

  font-size: 18px;

  font-weight: 600;

  cursor: pointer;

  box-shadow: 0px 6px 34px rgba(215, 216, 222, 0.41);

}

.pagination-area ul li i {

  font-size: 18px;

  font-weight: 300;

}

.pagination-area ul li.active, .pagination-area ul li:hover {

  background: var(--color-primary-2);

  color: var(--color-white);

}



.color-primary {

  color: var(--color-primary);

}



.color-light-text {

  color: var(--color-primary);

}



.margin-shadow-30 {

  padding: 20px;

  margin: -20px;

}

.margin-shadow-30 .product-wrapper:hover {

  box-shadow: 0 4px 15px 0 rgba(215, 216, 222, 0.44);

  border: 1px solid transparent;

  transform: scale(1.02);

}



.hover-moving-primary {

  position: relative;

  display: inline-block;

  transition: 0.3s;

}

.hover-moving-primary::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 2px;

  bottom: 0;

  left: 0;

  background-color: currentColor;

  transform: scaleX(0);

  transform-origin: bottom right;

  transition: transform 0.3s;

}

.hover-moving-primary:hover {

  color: var(--color-primary) !important;

}

.hover-moving-primary:hover::after {

  transform-origin: bottom left;

  transform: scaleX(1);

}



.hover-bg-light {

  position: relative;

  cursor: pointer;

  z-index: 1;

}

.hover-bg-light::after {

  position: absolute;

  content: "";

  width: 45px;

  height: 45px;

  border-radius: 50%;

  background: rgba(0, 0, 0, 0.04);

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%) scale(0);

  transition: all 0.3s;

  z-index: -1;

}

.hover-bg-light:hover::after {

  transform: translate(-50%, -50%) scale(1);

}



.subtitle-bg {

  padding: 3px 7px;

  background: var(--color-primary);

  border-radius: 3px;

  color: #fff;

}



.demo-orange {

  --color-primary: #FF7029;

  --color-primary-2: #FF7029;

}



.swiper-default-btn-style {

  position: relative;

}

.swiper-default-btn-style .swiper-btn {

  transform: translateY(-50%);

  font-size: 18px;

  background: #FFFFFF;

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

  width: 60px;

  height: 60px;

  line-height: 62px;

  display: block;

  text-align: center;

  border-radius: 50%;

  transition: 0.3s;

  color: var(--color-heading-1);

}

@media only screen and (max-width: 767px) {

  .swiper-default-btn-style .swiper-btn {

    font-size: 16px;

    width: 45px;

    height: 45px;

    line-height: 47px;

  }

}

.swiper-default-btn-style .swiper-btn i {

  color: var(--color-primary);

}

.swiper-default-btn-style .swiper-btn::after {

  display: none;

}

.swiper-default-btn-style .swiper-btn.swiper-button-prev {

  left: 0px;

  opacity: 0;

}

@media only screen and (max-width: 1199px) {

  .swiper-default-btn-style .swiper-btn.swiper-button-prev {

    left: -30px;

    opacity: 1;

  }

}

@media only screen and (max-width: 767px) {

  .swiper-default-btn-style .swiper-btn.swiper-button-prev {

    left: 0;

  }

}

.swiper-default-btn-style .swiper-btn.swiper-button-next {

  right: 0px;

  opacity: 0;

}

@media only screen and (max-width: 1199px) {

  .swiper-default-btn-style .swiper-btn.swiper-button-next {

    right: -30px;

    opacity: 1;

  }

}

@media only screen and (max-width: 767px) {

  .swiper-default-btn-style .swiper-btn.swiper-button-next {

    right: 0;

  }

}

.swiper-default-btn-style .swiper-btn:hover {

  background: var(--color-primary);

  transform: translateY(-50%) scale(1.15);

}

.swiper-default-btn-style .swiper-btn:hover i {

  color: #fff;

}

.swiper-default-btn-style:hover .swiper-button-prev {

  left: -90px;

  opacity: 1;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .swiper-default-btn-style:hover .swiper-button-prev {

    left: -60px;

  }

}

@media only screen and (max-width: 1199px) {

  .swiper-default-btn-style:hover .swiper-button-prev {

    left: -30px;

    opacity: 1;

  }

}

@media only screen and (max-width: 767px) {

  .swiper-default-btn-style:hover .swiper-button-prev {

    left: 0;

  }

}

.swiper-default-btn-style:hover .swiper-button-next {

  right: -90px;

  opacity: 1;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .swiper-default-btn-style:hover .swiper-button-next {

    right: -60px;

  }

}

@media only screen and (max-width: 1199px) {

  .swiper-default-btn-style:hover .swiper-button-next {

    right: -30px;

    opacity: 1;

  }

}

@media only screen and (max-width: 767px) {

  .swiper-default-btn-style:hover .swiper-button-next {

    right: 0;

  }

}



.demo-orange .tmp-button-overlay-with-text .tmp-icon-overlay-link-btn::after {

  background-color: var(--secondary-100);

}

.demo-orange .tmp-button-overlay-with-text:hover .tmp-icon-overlay-link-btn {

  background-color: var(--color-primary);

}

.demo-orange .tmp-button-overlay-with-text:hover .tmp-icon-overlay-link-btn::after {

  background-color: var(--color-primary);

}



.error-msg p {

  color: var(--color-danger);

  margin-top: 10px;

  margin-bottom: 0;

}



.success-msg p {

  color: var(--color-success);

  margin-top: 10px;

}



#smooth-content {

  padding-bottom: 15px;

  will-change: transform;

}



.process-icon-last {

  position: relative !important;

  z-index: 3 !important;

}

.process-icon-last::after {

  content: "\f061";

  font-size: 24px;

  position: absolute;

  width: 62px;

  height: 62px;

  font-family: var(--font-awesome);

  right: -15%;

  top: 50%;

  color: var(--color-primary);

  transform: translateY(-50%);

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

  background: #fff;

  z-index: 5;

  border: 7px solid #d8e5e5;

}

@media only screen and (max-width: 1199px) {

  .process-icon-last::after {

    display: none;

  }

}



.primary-dark {

  --color-primary: #20282D;

}



.text-underline-hover {

  background-image: -webkit-gradient(linear, left top, left bottom, from(currentColor), to(currentColor));

  background-image: linear-gradient(to bottom, currentColor 0%, currentColor 100%);

  background-size: 0 2px;

  background-repeat: no-repeat;

  background-position: 0 85%;

  display: inline;

}

.text-underline-hover:hover {

  background-size: 100% 2px;

}



.text-scale-anim {

  white-space: pre-wrap;

  transform-origin: top left;

}



.invers-letter-span {

  display: inline-block;

  transition: color 0.3s;

}



.container-1600 {

  max-width: 1600px;

  margin: auto;

  padding: 0 15px;

}



@media only screen and (min-width: 1200px) {

  .col-xl-20 {

    width: 20%;

  }

}

.inv-text-anim-y > div {

  overflow: hidden;

}

.inv-text-anim-y span {

  display: inline-block !important;

  overflow: hidden;

}



span.line-brack {

  color: unset !important;

  overflow: hidden;

  display: flex !important;

  align-items: center;

  gap: 6px;

}



.sticky-bottom-section {

  position: relative;

  z-index: 10;

}



.corva-svg-animate svg path {

  fill: var(--color-primary);

  stroke: var(--color-primary);

  stroke-width: 0px;

  stroke-linecap: round;

  stroke-linejoin: round;

  transition: fill 0.6s ease;

}



.corva-svg-animate.is-animating svg path {

  fill: transparent;

  stroke-width: 2px;

}



/*!

Animate.css - http://daneden.me/animate

Version - 3.4.0

Licensed under the MIT license - http://opensource.org/licenses/MIT



Copyright (c) 2015 Daniel Eden

*/

.animated {

  -webkit-animation-duration: 1s;

  animation-duration: 1s;

  -webkit-animation-fill-mode: both;

  animation-fill-mode: both;

}



.animated.infinite {

  -webkit-animation-iteration-count: infinite;

  animation-iteration-count: infinite;

}



.animated.hinge {

  -webkit-animation-duration: 2s;

  animation-duration: 2s;

}



.animated.bounceIn,

.animated.bounceOut {

  -webkit-animation-duration: 0.75s;

  animation-duration: 0.75s;

}



.animated.flipOutX,

.animated.flipOutY {

  -webkit-animation-duration: 0.75s;

  animation-duration: 0.75s;

}



@-webkit-keyframes bounce {

  from, 20%, 53%, 80%, to {

    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  40%, 43% {

    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    -webkit-transform: translate3d(0, -30px, 0);

    transform: translate3d(0, -30px, 0);

  }

  70% {

    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    -webkit-transform: translate3d(0, -15px, 0);

    transform: translate3d(0, -15px, 0);

  }

  90% {

    -webkit-transform: translate3d(0, -4px, 0);

    transform: translate3d(0, -4px, 0);

  }

}

@keyframes bounce {

  from, 20%, 53%, 80%, to {

    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  40%, 43% {

    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    -webkit-transform: translate3d(0, -30px, 0);

    transform: translate3d(0, -30px, 0);

  }

  70% {

    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    -webkit-transform: translate3d(0, -15px, 0);

    transform: translate3d(0, -15px, 0);

  }

  90% {

    -webkit-transform: translate3d(0, -4px, 0);

    transform: translate3d(0, -4px, 0);

  }

}

.bounce {

  -webkit-animation-name: bounce;

  animation-name: bounce;

  -webkit-transform-origin: center bottom;

  transform-origin: center bottom;

}



/*jump animation */

@keyframes jump-1 {

  0% {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  40% {

    -webkit-transform: translate3d(0, 20px, 0);

    transform: translate3d(0, 20px, 0);

  }

  100% {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

@keyframes jump-2 {

  0% {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  50% {

    -webkit-transform: translate3d(0, 30px, 0);

    transform: translate3d(0, 30px, 0);

  }

  100% {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

@keyframes jump-3 {

  0% {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  40% {

    -webkit-transform: translate3d(0, 50px, 0) scale(0.7);

    transform: translate3d(0, 50px, 0) scale(0.7);

  }

  100% {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

@keyframes jump-4 {

  0% {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  40% {

    -webkit-transform: translate3d(0, 20px, 0) scale(0.8);

    transform: translate3d(0, 20px, 0) scale(0.8);

  }

  100% {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

@keyframes jump-5 {

  0% {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  40% {

    transform: translate3d(0, 10px, 0);

  }

  100% {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

@-webkit-keyframes flash {

  from, 50%, to {

    opacity: 1;

  }

  25%, 75% {

    opacity: 0;

  }

}

@keyframes flash {

  from, 50%, to {

    opacity: 1;

  }

  25%, 75% {

    opacity: 0;

  }

}

.flash {

  -webkit-animation-name: flash;

  animation-name: flash;

}



@-webkit-keyframes pulse {

  from {

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

  50% {

    -webkit-transform: scale3d(1.05, 1.05, 1.05);

    transform: scale3d(1.05, 1.05, 1.05);

  }

  to {

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

}

@keyframes pulse {

  from {

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

  50% {

    -webkit-transform: scale3d(1.05, 1.05, 1.05);

    transform: scale3d(1.05, 1.05, 1.05);

  }

  to {

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

}

@keyframes pulse-border {

  from {

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

  50% {

    -webkit-transform: scale3d(1.3, 1.3, 1.3);

    transform: scale3d(1.3, 1.3, 1.3);

  }

  to {

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

}

.pulse {

  -webkit-animation-name: pulse;

  animation-name: pulse;

}



@-webkit-keyframes rubberBand {

  from {

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

  30% {

    -webkit-transform: scale3d(1.25, 0.75, 1);

    transform: scale3d(1.25, 0.75, 1);

  }

  40% {

    -webkit-transform: scale3d(0.75, 1.25, 1);

    transform: scale3d(0.75, 1.25, 1);

  }

  50% {

    -webkit-transform: scale3d(1.15, 0.85, 1);

    transform: scale3d(1.15, 0.85, 1);

  }

  65% {

    -webkit-transform: scale3d(0.95, 1.05, 1);

    transform: scale3d(0.95, 1.05, 1);

  }

  75% {

    -webkit-transform: scale3d(1.05, 0.95, 1);

    transform: scale3d(1.05, 0.95, 1);

  }

  to {

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

}

@keyframes rubberBand {

  from {

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

  30% {

    -webkit-transform: scale3d(1.25, 0.75, 1);

    transform: scale3d(1.25, 0.75, 1);

  }

  40% {

    -webkit-transform: scale3d(0.75, 1.25, 1);

    transform: scale3d(0.75, 1.25, 1);

  }

  50% {

    -webkit-transform: scale3d(1.15, 0.85, 1);

    transform: scale3d(1.15, 0.85, 1);

  }

  65% {

    -webkit-transform: scale3d(0.95, 1.05, 1);

    transform: scale3d(0.95, 1.05, 1);

  }

  75% {

    -webkit-transform: scale3d(1.05, 0.95, 1);

    transform: scale3d(1.05, 0.95, 1);

  }

  to {

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

}

.rubberBand {

  -webkit-animation-name: rubberBand;

  animation-name: rubberBand;

}



@-webkit-keyframes shake {

  from, to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  10%, 30%, 50%, 70%, 90% {

    -webkit-transform: translate3d(-10px, 0, 0);

    transform: translate3d(-10px, 0, 0);

  }

  20%, 40%, 60%, 80% {

    -webkit-transform: translate3d(10px, 0, 0);

    transform: translate3d(10px, 0, 0);

  }

}

@keyframes shake {

  from, to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  10%, 30%, 50%, 70%, 90% {

    -webkit-transform: translate3d(-10px, 0, 0);

    transform: translate3d(-10px, 0, 0);

  }

  20%, 40%, 60%, 80% {

    -webkit-transform: translate3d(10px, 0, 0);

    transform: translate3d(10px, 0, 0);

  }

}

.shake {

  -webkit-animation-name: shake;

  animation-name: shake;

}



@-webkit-keyframes swing {

  20% {

    -webkit-transform: rotate3d(0, 0, 1, 15deg);

    transform: rotate3d(0, 0, 1, 15deg);

  }

  40% {

    -webkit-transform: rotate3d(0, 0, 1, -10deg);

    transform: rotate3d(0, 0, 1, -10deg);

  }

  60% {

    -webkit-transform: rotate3d(0, 0, 1, 5deg);

    transform: rotate3d(0, 0, 1, 5deg);

  }

  80% {

    -webkit-transform: rotate3d(0, 0, 1, -5deg);

    transform: rotate3d(0, 0, 1, -5deg);

  }

  to {

    -webkit-transform: rotate3d(0, 0, 1, 0deg);

    transform: rotate3d(0, 0, 1, 0deg);

  }

}

@keyframes swing {

  20% {

    -webkit-transform: rotate3d(0, 0, 1, 15deg);

    transform: rotate3d(0, 0, 1, 15deg);

  }

  40% {

    -webkit-transform: rotate3d(0, 0, 1, -10deg);

    transform: rotate3d(0, 0, 1, -10deg);

  }

  60% {

    -webkit-transform: rotate3d(0, 0, 1, 5deg);

    transform: rotate3d(0, 0, 1, 5deg);

  }

  80% {

    -webkit-transform: rotate3d(0, 0, 1, -5deg);

    transform: rotate3d(0, 0, 1, -5deg);

  }

  to {

    -webkit-transform: rotate3d(0, 0, 1, 0deg);

    transform: rotate3d(0, 0, 1, 0deg);

  }

}

.swing {

  -webkit-transform-origin: top center;

  transform-origin: top center;

  -webkit-animation-name: swing;

  animation-name: swing;

}



@-webkit-keyframes tada {

  from {

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

  10%, 20% {

    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);

    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);

  }

  30%, 50%, 70%, 90% {

    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);

    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);

  }

  40%, 60%, 80% {

    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);

    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);

  }

  to {

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

}

@keyframes tada {

  from {

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

  10%, 20% {

    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);

    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);

  }

  30%, 50%, 70%, 90% {

    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);

    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);

  }

  40%, 60%, 80% {

    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);

    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);

  }

  to {

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

}

.tada {

  -webkit-animation-name: tada;

  animation-name: tada;

}



/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes wobble {

  from {

    -webkit-transform: none;

    transform: none;

  }

  15% {

    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);

    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);

  }

  30% {

    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);

    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);

  }

  45% {

    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);

    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);

  }

  60% {

    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);

    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);

  }

  75% {

    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);

    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);

  }

  to {

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes wobble {

  from {

    -webkit-transform: none;

    transform: none;

  }

  15% {

    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);

    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);

  }

  30% {

    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);

    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);

  }

  45% {

    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);

    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);

  }

  60% {

    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);

    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);

  }

  75% {

    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);

    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);

  }

  to {

    -webkit-transform: none;

    transform: none;

  }

}

.wobble {

  -webkit-animation-name: wobble;

  animation-name: wobble;

}



@-webkit-keyframes jello {

  from, 11.1%, to {

    -webkit-transform: none;

    transform: none;

  }

  22.2% {

    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);

    transform: skewX(-12.5deg) skewY(-12.5deg);

  }

  33.3% {

    -webkit-transform: skewX(6.25deg) skewY(6.25deg);

    transform: skewX(6.25deg) skewY(6.25deg);

  }

  44.4% {

    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);

    transform: skewX(-3.125deg) skewY(-3.125deg);

  }

  55.5% {

    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);

    transform: skewX(1.5625deg) skewY(1.5625deg);

  }

  66.6% {

    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);

    transform: skewX(-0.78125deg) skewY(-0.78125deg);

  }

  77.7% {

    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);

    transform: skewX(0.390625deg) skewY(0.390625deg);

  }

  88.8% {

    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);

    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);

  }

}

@keyframes jello {

  from, 11.1%, to {

    -webkit-transform: none;

    transform: none;

  }

  22.2% {

    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);

    transform: skewX(-12.5deg) skewY(-12.5deg);

  }

  33.3% {

    -webkit-transform: skewX(6.25deg) skewY(6.25deg);

    transform: skewX(6.25deg) skewY(6.25deg);

  }

  44.4% {

    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);

    transform: skewX(-3.125deg) skewY(-3.125deg);

  }

  55.5% {

    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);

    transform: skewX(1.5625deg) skewY(1.5625deg);

  }

  66.6% {

    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);

    transform: skewX(-0.78125deg) skewY(-0.78125deg);

  }

  77.7% {

    -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);

    transform: skewX(0.390625deg) skewY(0.390625deg);

  }

  88.8% {

    -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);

    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);

  }

}

.jello {

  -webkit-animation-name: jello;

  animation-name: jello;

  -webkit-transform-origin: center;

  transform-origin: center;

}



@-webkit-keyframes bounceIn {

  from, 20%, 40%, 60%, 80%, to {

    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

  }

  0% {

    opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3);

  }

  20% {

    -webkit-transform: scale3d(1.1, 1.1, 1.1);

    transform: scale3d(1.1, 1.1, 1.1);

  }

  40% {

    -webkit-transform: scale3d(0.9, 0.9, 0.9);

    transform: scale3d(0.9, 0.9, 0.9);

  }

  60% {

    opacity: 1;

    -webkit-transform: scale3d(1.03, 1.03, 1.03);

    transform: scale3d(1.03, 1.03, 1.03);

  }

  80% {

    -webkit-transform: scale3d(0.97, 0.97, 0.97);

    transform: scale3d(0.97, 0.97, 0.97);

  }

  to {

    opacity: 1;

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

}

@keyframes bounceIn {

  from, 20%, 40%, 60%, 80%, to {

    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

  }

  0% {

    opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3);

  }

  20% {

    -webkit-transform: scale3d(1.1, 1.1, 1.1);

    transform: scale3d(1.1, 1.1, 1.1);

  }

  40% {

    -webkit-transform: scale3d(0.9, 0.9, 0.9);

    transform: scale3d(0.9, 0.9, 0.9);

  }

  60% {

    opacity: 1;

    -webkit-transform: scale3d(1.03, 1.03, 1.03);

    transform: scale3d(1.03, 1.03, 1.03);

  }

  80% {

    -webkit-transform: scale3d(0.97, 0.97, 0.97);

    transform: scale3d(0.97, 0.97, 0.97);

  }

  to {

    opacity: 1;

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

}

.bounceIn {

  -webkit-animation-name: bounceIn;

  animation-name: bounceIn;

}



@-webkit-keyframes bounceInDown {

  from, 60%, 75%, 90%, to {

    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

  }

  0% {

    opacity: 0;

    -webkit-transform: translate3d(0, -3000px, 0);

    transform: translate3d(0, -3000px, 0);

  }

  60% {

    opacity: 1;

    -webkit-transform: translate3d(0, 25px, 0);

    transform: translate3d(0, 25px, 0);

  }

  75% {

    -webkit-transform: translate3d(0, -10px, 0);

    transform: translate3d(0, -10px, 0);

  }

  90% {

    -webkit-transform: translate3d(0, 5px, 0);

    transform: translate3d(0, 5px, 0);

  }

  to {

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes bounceInDown {

  from, 60%, 75%, 90%, to {

    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

  }

  0% {

    opacity: 0;

    -webkit-transform: translate3d(0, -3000px, 0);

    transform: translate3d(0, -3000px, 0);

  }

  60% {

    opacity: 1;

    -webkit-transform: translate3d(0, 25px, 0);

    transform: translate3d(0, 25px, 0);

  }

  75% {

    -webkit-transform: translate3d(0, -10px, 0);

    transform: translate3d(0, -10px, 0);

  }

  90% {

    -webkit-transform: translate3d(0, 5px, 0);

    transform: translate3d(0, 5px, 0);

  }

  to {

    -webkit-transform: none;

    transform: none;

  }

}

.bounceInDown {

  -webkit-animation-name: bounceInDown;

  animation-name: bounceInDown;

}



@-webkit-keyframes bounceInLeft {

  from, 60%, 75%, 90%, to {

    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

  }

  0% {

    opacity: 0;

    -webkit-transform: translate3d(-3000px, 0, 0);

    transform: translate3d(-3000px, 0, 0);

  }

  60% {

    opacity: 1;

    -webkit-transform: translate3d(25px, 0, 0);

    transform: translate3d(25px, 0, 0);

  }

  75% {

    -webkit-transform: translate3d(-10px, 0, 0);

    transform: translate3d(-10px, 0, 0);

  }

  90% {

    -webkit-transform: translate3d(5px, 0, 0);

    transform: translate3d(5px, 0, 0);

  }

  to {

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes bounceInLeft {

  from, 60%, 75%, 90%, to {

    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

  }

  0% {

    opacity: 0;

    -webkit-transform: translate3d(-3000px, 0, 0);

    transform: translate3d(-3000px, 0, 0);

  }

  60% {

    opacity: 1;

    -webkit-transform: translate3d(25px, 0, 0);

    transform: translate3d(25px, 0, 0);

  }

  75% {

    -webkit-transform: translate3d(-10px, 0, 0);

    transform: translate3d(-10px, 0, 0);

  }

  90% {

    -webkit-transform: translate3d(5px, 0, 0);

    transform: translate3d(5px, 0, 0);

  }

  to {

    -webkit-transform: none;

    transform: none;

  }

}

.bounceInLeft {

  -webkit-animation-name: bounceInLeft;

  animation-name: bounceInLeft;

}



@-webkit-keyframes bounceInRight {

  from, 60%, 75%, 90%, to {

    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

  }

  from {

    opacity: 0;

    -webkit-transform: translate3d(3000px, 0, 0);

    transform: translate3d(3000px, 0, 0);

  }

  60% {

    opacity: 1;

    -webkit-transform: translate3d(-25px, 0, 0);

    transform: translate3d(-25px, 0, 0);

  }

  75% {

    -webkit-transform: translate3d(10px, 0, 0);

    transform: translate3d(10px, 0, 0);

  }

  90% {

    -webkit-transform: translate3d(-5px, 0, 0);

    transform: translate3d(-5px, 0, 0);

  }

  to {

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes bounceInRight {

  from, 60%, 75%, 90%, to {

    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

  }

  from {

    opacity: 0;

    -webkit-transform: translate3d(3000px, 0, 0);

    transform: translate3d(3000px, 0, 0);

  }

  60% {

    opacity: 1;

    -webkit-transform: translate3d(-25px, 0, 0);

    transform: translate3d(-25px, 0, 0);

  }

  75% {

    -webkit-transform: translate3d(10px, 0, 0);

    transform: translate3d(10px, 0, 0);

  }

  90% {

    -webkit-transform: translate3d(-5px, 0, 0);

    transform: translate3d(-5px, 0, 0);

  }

  to {

    -webkit-transform: none;

    transform: none;

  }

}

.bounceInRight {

  -webkit-animation-name: bounceInRight;

  animation-name: bounceInRight;

}



@-webkit-keyframes bounceInUp {

  from, 60%, 75%, 90%, to {

    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

  }

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, 3000px, 0);

    transform: translate3d(0, 3000px, 0);

  }

  60% {

    opacity: 1;

    -webkit-transform: translate3d(0, -20px, 0);

    transform: translate3d(0, -20px, 0);

  }

  75% {

    -webkit-transform: translate3d(0, 10px, 0);

    transform: translate3d(0, 10px, 0);

  }

  90% {

    -webkit-transform: translate3d(0, -5px, 0);

    transform: translate3d(0, -5px, 0);

  }

  to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

@keyframes bounceInUp {

  from, 60%, 75%, 90%, to {

    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

  }

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, 3000px, 0);

    transform: translate3d(0, 3000px, 0);

  }

  60% {

    opacity: 1;

    -webkit-transform: translate3d(0, -20px, 0);

    transform: translate3d(0, -20px, 0);

  }

  75% {

    -webkit-transform: translate3d(0, 10px, 0);

    transform: translate3d(0, 10px, 0);

  }

  90% {

    -webkit-transform: translate3d(0, -5px, 0);

    transform: translate3d(0, -5px, 0);

  }

  to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

.bounceInUp {

  -webkit-animation-name: bounceInUp;

  animation-name: bounceInUp;

}



@-webkit-keyframes bounceOut {

  20% {

    -webkit-transform: scale3d(0.9, 0.9, 0.9);

    transform: scale3d(0.9, 0.9, 0.9);

  }

  50%, 55% {

    opacity: 1;

    -webkit-transform: scale3d(1.1, 1.1, 1.1);

    transform: scale3d(1.1, 1.1, 1.1);

  }

  to {

    opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3);

  }

}

@keyframes bounceOut {

  20% {

    -webkit-transform: scale3d(0.9, 0.9, 0.9);

    transform: scale3d(0.9, 0.9, 0.9);

  }

  50%, 55% {

    opacity: 1;

    -webkit-transform: scale3d(1.1, 1.1, 1.1);

    transform: scale3d(1.1, 1.1, 1.1);

  }

  to {

    opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3);

  }

}

.bounceOut {

  -webkit-animation-name: bounceOut;

  animation-name: bounceOut;

}



@-webkit-keyframes bounceOutDown {

  20% {

    -webkit-transform: translate3d(0, 10px, 0);

    transform: translate3d(0, 10px, 0);

  }

  40%, 45% {

    opacity: 1;

    -webkit-transform: translate3d(0, -20px, 0);

    transform: translate3d(0, -20px, 0);

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(0, 2000px, 0);

    transform: translate3d(0, 2000px, 0);

  }

}

@keyframes bounceOutDown {

  20% {

    -webkit-transform: translate3d(0, 10px, 0);

    transform: translate3d(0, 10px, 0);

  }

  40%, 45% {

    opacity: 1;

    -webkit-transform: translate3d(0, -20px, 0);

    transform: translate3d(0, -20px, 0);

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(0, 2000px, 0);

    transform: translate3d(0, 2000px, 0);

  }

}

.bounceOutDown {

  -webkit-animation-name: bounceOutDown;

  animation-name: bounceOutDown;

}



@-webkit-keyframes bounceOutLeft {

  20% {

    opacity: 1;

    -webkit-transform: translate3d(20px, 0, 0);

    transform: translate3d(20px, 0, 0);

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(-2000px, 0, 0);

    transform: translate3d(-2000px, 0, 0);

  }

}

@keyframes bounceOutLeft {

  20% {

    opacity: 1;

    -webkit-transform: translate3d(20px, 0, 0);

    transform: translate3d(20px, 0, 0);

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(-2000px, 0, 0);

    transform: translate3d(-2000px, 0, 0);

  }

}

.bounceOutLeft {

  -webkit-animation-name: bounceOutLeft;

  animation-name: bounceOutLeft;

}



@-webkit-keyframes bounceOutRight {

  20% {

    opacity: 1;

    -webkit-transform: translate3d(-20px, 0, 0);

    transform: translate3d(-20px, 0, 0);

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(2000px, 0, 0);

    transform: translate3d(2000px, 0, 0);

  }

}

@keyframes bounceOutRight {

  20% {

    opacity: 1;

    -webkit-transform: translate3d(-20px, 0, 0);

    transform: translate3d(-20px, 0, 0);

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(2000px, 0, 0);

    transform: translate3d(2000px, 0, 0);

  }

}

.bounceOutRight {

  -webkit-animation-name: bounceOutRight;

  animation-name: bounceOutRight;

}



@-webkit-keyframes bounceOutUp {

  20% {

    -webkit-transform: translate3d(0, -10px, 0);

    transform: translate3d(0, -10px, 0);

  }

  40%, 45% {

    opacity: 1;

    -webkit-transform: translate3d(0, 20px, 0);

    transform: translate3d(0, 20px, 0);

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(0, -2000px, 0);

    transform: translate3d(0, -2000px, 0);

  }

}

@keyframes bounceOutUp {

  20% {

    -webkit-transform: translate3d(0, -10px, 0);

    transform: translate3d(0, -10px, 0);

  }

  40%, 45% {

    opacity: 1;

    -webkit-transform: translate3d(0, 20px, 0);

    transform: translate3d(0, 20px, 0);

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(0, -2000px, 0);

    transform: translate3d(0, -2000px, 0);

  }

}

.bounceOutUp {

  -webkit-animation-name: bounceOutUp;

  animation-name: bounceOutUp;

}



@-webkit-keyframes fadeIn {

  from {

    opacity: 0;

  }

  to {

    opacity: 1;

  }

}

@keyframes fadeIn {

  from {

    opacity: 0;

  }

  to {

    opacity: 1;

  }

}

.fadeIn {

  -webkit-animation-name: fadeIn;

  animation-name: fadeIn;

}



@-webkit-keyframes fadeInDown {

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, -100%, 0);

    transform: translate3d(0, -100%, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes fadeInDown {

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, -100%, 0);

    transform: translate3d(0, -100%, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

.fadeInDown {

  -webkit-animation-name: fadeInDown;

  animation-name: fadeInDown;

}



@-webkit-keyframes fadeInDownBig {

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, -2000px, 0);

    transform: translate3d(0, -2000px, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes fadeInDownBig {

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, -2000px, 0);

    transform: translate3d(0, -2000px, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

.fadeInDownBig {

  -webkit-animation-name: fadeInDownBig;

  animation-name: fadeInDownBig;

}



@-webkit-keyframes fadeInLeft {

  from {

    opacity: 0;

    -webkit-transform: translate3d(-100%, 0, 0);

    transform: translate3d(-100%, 0, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes fadeInLeft {

  from {

    opacity: 0;

    -webkit-transform: translate3d(-100%, 0, 0);

    transform: translate3d(-100%, 0, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

.fadeInLeft {

  -webkit-animation-name: fadeInLeft;

  animation-name: fadeInLeft;

}



@-webkit-keyframes fadeInLeftBig {

  from {

    opacity: 0;

    -webkit-transform: translate3d(-2000px, 0, 0);

    transform: translate3d(-2000px, 0, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes fadeInLeftBig {

  from {

    opacity: 0;

    -webkit-transform: translate3d(-2000px, 0, 0);

    transform: translate3d(-2000px, 0, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

.fadeInLeftBig {

  -webkit-animation-name: fadeInLeftBig;

  animation-name: fadeInLeftBig;

}



@-webkit-keyframes fadeInRight {

  from {

    opacity: 0;

    -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes fadeInRight {

  from {

    opacity: 0;

    -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

.fadeInRight {

  -webkit-animation-name: fadeInRight;

  animation-name: fadeInRight;

}



@-webkit-keyframes fadeInRightBig {

  from {

    opacity: 0;

    -webkit-transform: translate3d(2000px, 0, 0);

    transform: translate3d(2000px, 0, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes fadeInRightBig {

  from {

    opacity: 0;

    -webkit-transform: translate3d(2000px, 0, 0);

    transform: translate3d(2000px, 0, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

.fadeInRightBig {

  -webkit-animation-name: fadeInRightBig;

  animation-name: fadeInRightBig;

}



@-webkit-keyframes fadeInUp {

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes fadeInUp {

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes fadeInUp2 {

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, 40%, 0);

    transform: translate3d(0, 40%, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

.fadeInUp {

  -webkit-animation-name: fadeInUp;

  animation-name: fadeInUp;

}



@-webkit-keyframes fadeInUpBig {

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, 2000px, 0);

    transform: translate3d(0, 2000px, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes fadeInUpBig {

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, 2000px, 0);

    transform: translate3d(0, 2000px, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

.fadeInUpBig {

  -webkit-animation-name: fadeInUpBig;

  animation-name: fadeInUpBig;

}



@-webkit-keyframes fadeOut {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

  }

}

@keyframes fadeOut {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

  }

}

.fadeOut {

  -webkit-animation-name: fadeOut;

  animation-name: fadeOut;

}



@-webkit-keyframes fadeOutDown {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0);

  }

}

@keyframes fadeOutDown {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0);

  }

}

.fadeOutDown {

  -webkit-animation-name: fadeOutDown;

  animation-name: fadeOutDown;

}



@-webkit-keyframes fadeOutDownBig {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(0, 2000px, 0);

    transform: translate3d(0, 2000px, 0);

  }

}

@keyframes fadeOutDownBig {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(0, 2000px, 0);

    transform: translate3d(0, 2000px, 0);

  }

}

.fadeOutDownBig {

  -webkit-animation-name: fadeOutDownBig;

  animation-name: fadeOutDownBig;

}



@-webkit-keyframes fadeOutLeft {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(-100%, 0, 0);

    transform: translate3d(-100%, 0, 0);

  }

}

@keyframes fadeOutLeft {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(-100%, 0, 0);

    transform: translate3d(-100%, 0, 0);

  }

}

.fadeOutLeft {

  -webkit-animation-name: fadeOutLeft;

  animation-name: fadeOutLeft;

}



@-webkit-keyframes fadeOutLeftBig {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(-2000px, 0, 0);

    transform: translate3d(-2000px, 0, 0);

  }

}

@keyframes fadeOutLeftBig {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(-2000px, 0, 0);

    transform: translate3d(-2000px, 0, 0);

  }

}

.fadeOutLeftBig {

  -webkit-animation-name: fadeOutLeftBig;

  animation-name: fadeOutLeftBig;

}



@-webkit-keyframes fadeOutRight {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0);

  }

}

@keyframes fadeOutRight {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0);

  }

}

.fadeOutRight {

  -webkit-animation-name: fadeOutRight;

  animation-name: fadeOutRight;

}



@-webkit-keyframes fadeOutRightBig {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(2000px, 0, 0);

    transform: translate3d(2000px, 0, 0);

  }

}

@keyframes fadeOutRightBig {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(2000px, 0, 0);

    transform: translate3d(2000px, 0, 0);

  }

}

.fadeOutRightBig {

  -webkit-animation-name: fadeOutRightBig;

  animation-name: fadeOutRightBig;

}



@-webkit-keyframes fadeOutUp {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(0, -100%, 0);

    transform: translate3d(0, -100%, 0);

  }

}

@keyframes fadeOutUp {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(0, -100%, 0);

    transform: translate3d(0, -100%, 0);

  }

}

.fadeOutUp {

  -webkit-animation-name: fadeOutUp;

  animation-name: fadeOutUp;

}



@-webkit-keyframes fadeOutUpBig {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(0, -2000px, 0);

    transform: translate3d(0, -2000px, 0);

  }

}

@keyframes fadeOutUpBig {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(0, -2000px, 0);

    transform: translate3d(0, -2000px, 0);

  }

}

.fadeOutUpBig {

  -webkit-animation-name: fadeOutUpBig;

  animation-name: fadeOutUpBig;

}



@-webkit-keyframes flip {

  from {

    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);

    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);

    -webkit-animation-timing-function: ease-out;

    animation-timing-function: ease-out;

  }

  40% {

    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);

    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);

    -webkit-animation-timing-function: ease-out;

    animation-timing-function: ease-out;

  }

  50% {

    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);

    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

  }

  80% {

    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);

    transform: perspective(400px) scale3d(0.95, 0.95, 0.95);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

  }

  to {

    -webkit-transform: perspective(400px);

    transform: perspective(400px);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

  }

}

@keyframes flip {

  from {

    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);

    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);

    -webkit-animation-timing-function: ease-out;

    animation-timing-function: ease-out;

  }

  40% {

    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);

    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);

    -webkit-animation-timing-function: ease-out;

    animation-timing-function: ease-out;

  }

  50% {

    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);

    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

  }

  80% {

    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);

    transform: perspective(400px) scale3d(0.95, 0.95, 0.95);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

  }

  to {

    -webkit-transform: perspective(400px);

    transform: perspective(400px);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

  }

}

.animated.flip {

  -webkit-backface-visibility: visible;

  backface-visibility: visible;

  -webkit-animation-name: flip;

  animation-name: flip;

}



@-webkit-keyframes flipInX {

  from {

    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

    opacity: 0;

  }

  40% {

    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);

    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

  }

  60% {

    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);

    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);

    opacity: 1;

  }

  80% {

    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);

    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);

  }

  to {

    -webkit-transform: perspective(400px);

    transform: perspective(400px);

  }

}

@keyframes flipInX {

  from {

    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

    opacity: 0;

  }

  40% {

    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);

    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

  }

  60% {

    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);

    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);

    opacity: 1;

  }

  80% {

    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);

    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);

  }

  to {

    -webkit-transform: perspective(400px);

    transform: perspective(400px);

  }

}

.flipInX {

  -webkit-backface-visibility: visible !important;

  backface-visibility: visible !important;

  -webkit-animation-name: flipInX;

  animation-name: flipInX;

}



@-webkit-keyframes flipInY {

  from {

    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);

    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

    opacity: 0;

  }

  40% {

    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);

    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

  }

  60% {

    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);

    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);

    opacity: 1;

  }

  80% {

    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);

    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);

  }

  to {

    -webkit-transform: perspective(400px);

    transform: perspective(400px);

  }

}

@keyframes flipInY {

  from {

    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);

    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

    opacity: 0;

  }

  40% {

    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);

    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);

    -webkit-animation-timing-function: ease-in;

    animation-timing-function: ease-in;

  }

  60% {

    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);

    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);

    opacity: 1;

  }

  80% {

    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);

    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);

  }

  to {

    -webkit-transform: perspective(400px);

    transform: perspective(400px);

  }

}

.flipInY {

  -webkit-backface-visibility: visible !important;

  backface-visibility: visible !important;

  -webkit-animation-name: flipInY;

  animation-name: flipInY;

}



@-webkit-keyframes flipOutX {

  from {

    -webkit-transform: perspective(400px);

    transform: perspective(400px);

  }

  30% {

    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);

    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);

    opacity: 1;

  }

  to {

    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

    opacity: 0;

  }

}

@keyframes flipOutX {

  from {

    -webkit-transform: perspective(400px);

    transform: perspective(400px);

  }

  30% {

    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);

    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);

    opacity: 1;

  }

  to {

    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);

    opacity: 0;

  }

}

.flipOutX {

  -webkit-animation-name: flipOutX;

  animation-name: flipOutX;

  -webkit-backface-visibility: visible !important;

  backface-visibility: visible !important;

}



@-webkit-keyframes flipOutY {

  from {

    -webkit-transform: perspective(400px);

    transform: perspective(400px);

  }

  30% {

    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);

    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);

    opacity: 1;

  }

  to {

    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);

    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);

    opacity: 0;

  }

}

@keyframes flipOutY {

  from {

    -webkit-transform: perspective(400px);

    transform: perspective(400px);

  }

  30% {

    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);

    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);

    opacity: 1;

  }

  to {

    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);

    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);

    opacity: 0;

  }

}

.flipOutY {

  -webkit-backface-visibility: visible !important;

  backface-visibility: visible !important;

  -webkit-animation-name: flipOutY;

  animation-name: flipOutY;

}



@-webkit-keyframes lightSpeedIn {

  from {

    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);

    transform: translate3d(100%, 0, 0) skewX(-30deg);

    opacity: 0;

  }

  60% {

    -webkit-transform: skewX(20deg);

    transform: skewX(20deg);

    opacity: 1;

  }

  80% {

    -webkit-transform: skewX(-5deg);

    transform: skewX(-5deg);

    opacity: 1;

  }

  to {

    -webkit-transform: none;

    transform: none;

    opacity: 1;

  }

}

@keyframes lightSpeedIn {

  from {

    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);

    transform: translate3d(100%, 0, 0) skewX(-30deg);

    opacity: 0;

  }

  60% {

    -webkit-transform: skewX(20deg);

    transform: skewX(20deg);

    opacity: 1;

  }

  80% {

    -webkit-transform: skewX(-5deg);

    transform: skewX(-5deg);

    opacity: 1;

  }

  to {

    -webkit-transform: none;

    transform: none;

    opacity: 1;

  }

}

.lightSpeedIn {

  -webkit-animation-name: lightSpeedIn;

  animation-name: lightSpeedIn;

  -webkit-animation-timing-function: ease-out;

  animation-timing-function: ease-out;

}



@-webkit-keyframes lightSpeedOut {

  from {

    opacity: 1;

  }

  to {

    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);

    transform: translate3d(100%, 0, 0) skewX(30deg);

    opacity: 0;

  }

}

@keyframes lightSpeedOut {

  from {

    opacity: 1;

  }

  to {

    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);

    transform: translate3d(100%, 0, 0) skewX(30deg);

    opacity: 0;

  }

}

.lightSpeedOut {

  -webkit-animation-name: lightSpeedOut;

  animation-name: lightSpeedOut;

  -webkit-animation-timing-function: ease-in;

  animation-timing-function: ease-in;

}



@-webkit-keyframes rotateIn {

  from {

    -webkit-transform-origin: center;

    transform-origin: center;

    -webkit-transform: rotate3d(0, 0, 1, -200deg);

    transform: rotate3d(0, 0, 1, -200deg);

    opacity: 0;

  }

  to {

    -webkit-transform-origin: center;

    transform-origin: center;

    -webkit-transform: none;

    transform: none;

    opacity: 1;

  }

}

@keyframes rotateIn {

  from {

    -webkit-transform-origin: center;

    transform-origin: center;

    -webkit-transform: rotate3d(0, 0, 1, -200deg);

    transform: rotate3d(0, 0, 1, -200deg);

    opacity: 0;

  }

  to {

    -webkit-transform-origin: center;

    transform-origin: center;

    -webkit-transform: none;

    transform: none;

    opacity: 1;

  }

}

.rotateIn {

  -webkit-animation-name: rotateIn;

  animation-name: rotateIn;

}



@-webkit-keyframes rotateInDownLeft {

  from {

    -webkit-transform-origin: left bottom;

    transform-origin: left bottom;

    -webkit-transform: rotate3d(0, 0, 1, -45deg);

    transform: rotate3d(0, 0, 1, -45deg);

    opacity: 0;

  }

  to {

    -webkit-transform-origin: left bottom;

    transform-origin: left bottom;

    -webkit-transform: none;

    transform: none;

    opacity: 1;

  }

}

@keyframes rotateInDownLeft {

  from {

    -webkit-transform-origin: left bottom;

    transform-origin: left bottom;

    -webkit-transform: rotate3d(0, 0, 1, -45deg);

    transform: rotate3d(0, 0, 1, -45deg);

    opacity: 0;

  }

  to {

    -webkit-transform-origin: left bottom;

    transform-origin: left bottom;

    -webkit-transform: none;

    transform: none;

    opacity: 1;

  }

}

.rotateInDownLeft {

  -webkit-animation-name: rotateInDownLeft;

  animation-name: rotateInDownLeft;

}



@-webkit-keyframes rotateInDownRight {

  from {

    -webkit-transform-origin: right bottom;

    transform-origin: right bottom;

    -webkit-transform: rotate3d(0, 0, 1, 45deg);

    transform: rotate3d(0, 0, 1, 45deg);

    opacity: 0;

  }

  to {

    -webkit-transform-origin: right bottom;

    transform-origin: right bottom;

    -webkit-transform: none;

    transform: none;

    opacity: 1;

  }

}

@keyframes rotateInDownRight {

  from {

    -webkit-transform-origin: right bottom;

    transform-origin: right bottom;

    -webkit-transform: rotate3d(0, 0, 1, 45deg);

    transform: rotate3d(0, 0, 1, 45deg);

    opacity: 0;

  }

  to {

    -webkit-transform-origin: right bottom;

    transform-origin: right bottom;

    -webkit-transform: none;

    transform: none;

    opacity: 1;

  }

}

.rotateInDownRight {

  -webkit-animation-name: rotateInDownRight;

  animation-name: rotateInDownRight;

}



@-webkit-keyframes rotateInUpLeft {

  from {

    -webkit-transform-origin: left bottom;

    transform-origin: left bottom;

    -webkit-transform: rotate3d(0, 0, 1, 45deg);

    transform: rotate3d(0, 0, 1, 45deg);

    opacity: 0;

  }

  to {

    -webkit-transform-origin: left bottom;

    transform-origin: left bottom;

    -webkit-transform: none;

    transform: none;

    opacity: 1;

  }

}

@keyframes rotateInUpLeft {

  from {

    -webkit-transform-origin: left bottom;

    transform-origin: left bottom;

    -webkit-transform: rotate3d(0, 0, 1, 45deg);

    transform: rotate3d(0, 0, 1, 45deg);

    opacity: 0;

  }

  to {

    -webkit-transform-origin: left bottom;

    transform-origin: left bottom;

    -webkit-transform: none;

    transform: none;

    opacity: 1;

  }

}

.rotateInUpLeft {

  -webkit-animation-name: rotateInUpLeft;

  animation-name: rotateInUpLeft;

}



@-webkit-keyframes rotateInUpRight {

  from {

    -webkit-transform-origin: right bottom;

    transform-origin: right bottom;

    -webkit-transform: rotate3d(0, 0, 1, -90deg);

    transform: rotate3d(0, 0, 1, -90deg);

    opacity: 0;

  }

  to {

    -webkit-transform-origin: right bottom;

    transform-origin: right bottom;

    -webkit-transform: none;

    transform: none;

    opacity: 1;

  }

}

@keyframes rotateInUpRight {

  from {

    -webkit-transform-origin: right bottom;

    transform-origin: right bottom;

    -webkit-transform: rotate3d(0, 0, 1, -90deg);

    transform: rotate3d(0, 0, 1, -90deg);

    opacity: 0;

  }

  to {

    -webkit-transform-origin: right bottom;

    transform-origin: right bottom;

    -webkit-transform: none;

    transform: none;

    opacity: 1;

  }

}

.rotateInUpRight {

  -webkit-animation-name: rotateInUpRight;

  animation-name: rotateInUpRight;

}



@-webkit-keyframes rotateOut {

  from {

    -webkit-transform-origin: center;

    transform-origin: center;

    opacity: 1;

  }

  to {

    -webkit-transform-origin: center;

    transform-origin: center;

    -webkit-transform: rotate3d(0, 0, 1, 200deg);

    transform: rotate3d(0, 0, 1, 200deg);

    opacity: 0;

  }

}

@keyframes rotateOut {

  from {

    -webkit-transform-origin: center;

    transform-origin: center;

    opacity: 1;

  }

  to {

    -webkit-transform-origin: center;

    transform-origin: center;

    -webkit-transform: rotate3d(0, 0, 1, 200deg);

    transform: rotate3d(0, 0, 1, 200deg);

    opacity: 0;

  }

}

.rotateOut {

  -webkit-animation-name: rotateOut;

  animation-name: rotateOut;

}



@-webkit-keyframes rotateOutDownLeft {

  from {

    -webkit-transform-origin: left bottom;

    transform-origin: left bottom;

    opacity: 1;

  }

  to {

    -webkit-transform-origin: left bottom;

    transform-origin: left bottom;

    -webkit-transform: rotate3d(0, 0, 1, 45deg);

    transform: rotate3d(0, 0, 1, 45deg);

    opacity: 0;

  }

}

@keyframes rotateOutDownLeft {

  from {

    -webkit-transform-origin: left bottom;

    transform-origin: left bottom;

    opacity: 1;

  }

  to {

    -webkit-transform-origin: left bottom;

    transform-origin: left bottom;

    -webkit-transform: rotate3d(0, 0, 1, 45deg);

    transform: rotate3d(0, 0, 1, 45deg);

    opacity: 0;

  }

}

.rotateOutDownLeft {

  -webkit-animation-name: rotateOutDownLeft;

  animation-name: rotateOutDownLeft;

}



@-webkit-keyframes rotateOutDownRight {

  from {

    -webkit-transform-origin: right bottom;

    transform-origin: right bottom;

    opacity: 1;

  }

  to {

    -webkit-transform-origin: right bottom;

    transform-origin: right bottom;

    -webkit-transform: rotate3d(0, 0, 1, -45deg);

    transform: rotate3d(0, 0, 1, -45deg);

    opacity: 0;

  }

}

@keyframes rotateOutDownRight {

  from {

    -webkit-transform-origin: right bottom;

    transform-origin: right bottom;

    opacity: 1;

  }

  to {

    -webkit-transform-origin: right bottom;

    transform-origin: right bottom;

    -webkit-transform: rotate3d(0, 0, 1, -45deg);

    transform: rotate3d(0, 0, 1, -45deg);

    opacity: 0;

  }

}

.rotateOutDownRight {

  -webkit-animation-name: rotateOutDownRight;

  animation-name: rotateOutDownRight;

}



@-webkit-keyframes rotateOutUpLeft {

  from {

    -webkit-transform-origin: left bottom;

    transform-origin: left bottom;

    opacity: 1;

  }

  to {

    -webkit-transform-origin: left bottom;

    transform-origin: left bottom;

    -webkit-transform: rotate3d(0, 0, 1, -45deg);

    transform: rotate3d(0, 0, 1, -45deg);

    opacity: 0;

  }

}

@keyframes rotateOutUpLeft {

  from {

    -webkit-transform-origin: left bottom;

    transform-origin: left bottom;

    opacity: 1;

  }

  to {

    -webkit-transform-origin: left bottom;

    transform-origin: left bottom;

    -webkit-transform: rotate3d(0, 0, 1, -45deg);

    transform: rotate3d(0, 0, 1, -45deg);

    opacity: 0;

  }

}

.rotateOutUpLeft {

  -webkit-animation-name: rotateOutUpLeft;

  animation-name: rotateOutUpLeft;

}



@-webkit-keyframes rotateOutUpRight {

  from {

    -webkit-transform-origin: right bottom;

    transform-origin: right bottom;

    opacity: 1;

  }

  to {

    -webkit-transform-origin: right bottom;

    transform-origin: right bottom;

    -webkit-transform: rotate3d(0, 0, 1, 90deg);

    transform: rotate3d(0, 0, 1, 90deg);

    opacity: 0;

  }

}

@keyframes rotateOutUpRight {

  from {

    -webkit-transform-origin: right bottom;

    transform-origin: right bottom;

    opacity: 1;

  }

  to {

    -webkit-transform-origin: right bottom;

    transform-origin: right bottom;

    -webkit-transform: rotate3d(0, 0, 1, 90deg);

    transform: rotate3d(0, 0, 1, 90deg);

    opacity: 0;

  }

}

.rotateOutUpRight {

  -webkit-animation-name: rotateOutUpRight;

  animation-name: rotateOutUpRight;

}



@-webkit-keyframes hinge {

  0% {

    -webkit-transform-origin: top left;

    transform-origin: top left;

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

  }

  20%, 60% {

    -webkit-transform: rotate3d(0, 0, 1, 80deg);

    transform: rotate3d(0, 0, 1, 80deg);

    -webkit-transform-origin: top left;

    transform-origin: top left;

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

  }

  40%, 80% {

    -webkit-transform: rotate3d(0, 0, 1, 60deg);

    transform: rotate3d(0, 0, 1, 60deg);

    -webkit-transform-origin: top left;

    transform-origin: top left;

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

    opacity: 1;

  }

  to {

    -webkit-transform: translate3d(0, 700px, 0);

    transform: translate3d(0, 700px, 0);

    opacity: 0;

  }

}

@keyframes hinge {

  0% {

    -webkit-transform-origin: top left;

    transform-origin: top left;

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

  }

  20%, 60% {

    -webkit-transform: rotate3d(0, 0, 1, 80deg);

    transform: rotate3d(0, 0, 1, 80deg);

    -webkit-transform-origin: top left;

    transform-origin: top left;

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

  }

  40%, 80% {

    -webkit-transform: rotate3d(0, 0, 1, 60deg);

    transform: rotate3d(0, 0, 1, 60deg);

    -webkit-transform-origin: top left;

    transform-origin: top left;

    -webkit-animation-timing-function: ease-in-out;

    animation-timing-function: ease-in-out;

    opacity: 1;

  }

  to {

    -webkit-transform: translate3d(0, 700px, 0);

    transform: translate3d(0, 700px, 0);

    opacity: 0;

  }

}

.hinge {

  -webkit-animation-name: hinge;

  animation-name: hinge;

}



/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollIn {

  from {

    opacity: 0;

    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);

    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes rollIn {

  from {

    opacity: 0;

    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);

    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

.rollIn {

  -webkit-animation-name: rollIn;

  animation-name: rollIn;

}



/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollOut {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);

    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);

  }

}

@keyframes rollOut {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);

    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);

  }

}

.rollOut {

  -webkit-animation-name: rollOut;

  animation-name: rollOut;

}



@-webkit-keyframes zoomIn {

  from {

    opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3);

  }

  50% {

    opacity: 1;

  }

}

@keyframes zoomIn {

  from {

    opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3);

  }

  50% {

    opacity: 1;

  }

}

.zoomIn {

  -webkit-animation-name: zoomIn;

  animation-name: zoomIn;

}



@-webkit-keyframes zoomInDown {

  from {

    opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

  }

  60% {

    opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

  }

}

@keyframes zoomInDown {

  from {

    opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

  }

  60% {

    opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

  }

}

.zoomInDown {

  -webkit-animation-name: zoomInDown;

  animation-name: zoomInDown;

}



@-webkit-keyframes zoomInLeft {

  from {

    opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

  }

  60% {

    opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

  }

}

@keyframes zoomInLeft {

  from {

    opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

  }

  60% {

    opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

  }

}

.zoomInLeft {

  -webkit-animation-name: zoomInLeft;

  animation-name: zoomInLeft;

}



@-webkit-keyframes zoomInRight {

  from {

    opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

  }

  60% {

    opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

  }

}

@keyframes zoomInRight {

  from {

    opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

  }

  60% {

    opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

  }

}

.zoomInRight {

  -webkit-animation-name: zoomInRight;

  animation-name: zoomInRight;

}



@-webkit-keyframes zoomInUp {

  from {

    opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

  }

  60% {

    opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

  }

}

@keyframes zoomInUp {

  from {

    opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

  }

  60% {

    opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

  }

}

.zoomInUp {

  -webkit-animation-name: zoomInUp;

  animation-name: zoomInUp;

}



@-webkit-keyframes zoomOut {

  from {

    opacity: 1;

  }

  50% {

    opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3);

  }

  to {

    opacity: 0;

  }

}

@keyframes zoomOut {

  from {

    opacity: 1;

  }

  50% {

    opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3);

  }

  to {

    opacity: 0;

  }

}

.zoomOut {

  -webkit-animation-name: zoomOut;

  animation-name: zoomOut;

}



@-webkit-keyframes zoomOutDown {

  40% {

    opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

  }

  to {

    opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);

    -webkit-transform-origin: center bottom;

    transform-origin: center bottom;

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

  }

}

@keyframes zoomOutDown {

  40% {

    opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

  }

  to {

    opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);

    -webkit-transform-origin: center bottom;

    transform-origin: center bottom;

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

  }

}

.zoomOutDown {

  -webkit-animation-name: zoomOutDown;

  animation-name: zoomOutDown;

}



@-webkit-keyframes zoomOutLeft {

  40% {

    opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);

  }

  to {

    opacity: 0;

    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);

    transform: scale(0.1) translate3d(-2000px, 0, 0);

    -webkit-transform-origin: left center;

    transform-origin: left center;

  }

}

@keyframes zoomOutLeft {

  40% {

    opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);

  }

  to {

    opacity: 0;

    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);

    transform: scale(0.1) translate3d(-2000px, 0, 0);

    -webkit-transform-origin: left center;

    transform-origin: left center;

  }

}

.zoomOutLeft {

  -webkit-animation-name: zoomOutLeft;

  animation-name: zoomOutLeft;

}



@-webkit-keyframes zoomOutRight {

  40% {

    opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);

  }

  to {

    opacity: 0;

    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);

    transform: scale(0.1) translate3d(2000px, 0, 0);

    -webkit-transform-origin: right center;

    transform-origin: right center;

  }

}

@keyframes zoomOutRight {

  40% {

    opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);

  }

  to {

    opacity: 0;

    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);

    transform: scale(0.1) translate3d(2000px, 0, 0);

    -webkit-transform-origin: right center;

    transform-origin: right center;

  }

}

.zoomOutRight {

  -webkit-animation-name: zoomOutRight;

  animation-name: zoomOutRight;

}



@-webkit-keyframes zoomOutUp {

  40% {

    opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

  }

  to {

    opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);

    -webkit-transform-origin: center bottom;

    transform-origin: center bottom;

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

  }

}

@keyframes zoomOutUp {

  40% {

    opacity: 1;

    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);

    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

  }

  to {

    opacity: 0;

    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);

    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);

    -webkit-transform-origin: center bottom;

    transform-origin: center bottom;

    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);

  }

}

.zoomOutUp {

  -webkit-animation-name: zoomOutUp;

  animation-name: zoomOutUp;

}



@-webkit-keyframes slideInDown {

  from {

    -webkit-transform: translate3d(0, -100%, 0);

    transform: translate3d(0, -100%, 0);

    visibility: visible;

  }

  to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

@keyframes slideInDown {

  from {

    -webkit-transform: translate3d(0, -100%, 0);

    transform: translate3d(0, -100%, 0);

    visibility: visible;

  }

  to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

.slideInDown {

  -webkit-animation-name: slideInDown;

  animation-name: slideInDown;

}



@-webkit-keyframes slideInLeft {

  from {

    -webkit-transform: translate3d(-100%, 0, 0);

    transform: translate3d(-100%, 0, 0);

    visibility: visible;

  }

  to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

@keyframes slideInLeft {

  from {

    -webkit-transform: translate3d(-100%, 0, 0);

    transform: translate3d(-100%, 0, 0);

    visibility: visible;

  }

  to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

@keyframes slideInLeft2 {

  from {

    -webkit-transform: translate3d(-10%, 0, 0);

    transform: translate3d(-10%, 0, 0);

    visibility: visible;

  }

  to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

.slideInLeft {

  -webkit-animation-name: slideInLeft;

  animation-name: slideInLeft;

}



@-webkit-keyframes slideInRight {

  from {

    -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0);

    visibility: visible;

  }

  to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

@keyframes slideInRight {

  from {

    -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0);

    visibility: visible;

  }

  to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

.slideInRight {

  -webkit-animation-name: slideInRight;

  animation-name: slideInRight;

}



@-webkit-keyframes slideInUp {

  from {

    -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0);

    visibility: visible;

  }

  to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

@keyframes slideInUp {

  from {

    -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0);

    visibility: visible;

  }

  to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

@keyframes slideInUp2 {

  from {

    -webkit-transform: translate3d(0, 20%, 0);

    transform: translate3d(0, 20%, 0);

    visibility: hidden;

  }

  to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

    visibility: visible;

  }

}

@keyframes slideInUp3 {

  from {

    -webkit-transform: translate3d(0, 20px, 0);

    transform: translate3d(0, 20px, 0);

    visibility: hidden;

  }

  to {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

    visibility: visible;

  }

}

[data-aos=slideInUp2] {

  opacity: 0;

  transition-property: transform, opacity;

}

[data-aos=slideInUp2].aos-animate {

  opacity: 1;

}

@media screen and (min-width: 768px) {

  [data-aos=slideInUp2] {

    transform: translateY(30px);

  }

  [data-aos=slideInUp2].aos-animate {

    transform: translateY(0);

  }

}



.slideInUp {

  -webkit-animation-name: slideInUp;

  animation-name: slideInUp;

}



@-webkit-keyframes slideOutDown {

  from {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  to {

    visibility: hidden;

    -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0);

  }

}

@keyframes slideOutDown {

  from {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  to {

    visibility: hidden;

    -webkit-transform: translate3d(0, 100%, 0);

    transform: translate3d(0, 100%, 0);

  }

}

.slideOutDown {

  -webkit-animation-name: slideOutDown;

  animation-name: slideOutDown;

}



@-webkit-keyframes slideOutLeft {

  from {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  to {

    visibility: hidden;

    -webkit-transform: translate3d(-100%, 0, 0);

    transform: translate3d(-100%, 0, 0);

  }

}

@keyframes slideOutLeft {

  from {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  to {

    visibility: hidden;

    -webkit-transform: translate3d(-100%, 0, 0);

    transform: translate3d(-100%, 0, 0);

  }

}

.slideOutLeft {

  -webkit-animation-name: slideOutLeft;

  animation-name: slideOutLeft;

}



@-webkit-keyframes slideOutRight {

  from {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  to {

    visibility: hidden;

    -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0);

  }

}

@keyframes slideOutRight {

  from {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  to {

    visibility: hidden;

    -webkit-transform: translate3d(100%, 0, 0);

    transform: translate3d(100%, 0, 0);

  }

}

.slideOutRight {

  -webkit-animation-name: slideOutRight;

  animation-name: slideOutRight;

}



@-webkit-keyframes slideOutUp {

  from {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  to {

    visibility: hidden;

    -webkit-transform: translate3d(0, -100%, 0);

    transform: translate3d(0, -100%, 0);

  }

}

@keyframes slideOutUp {

  from {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  to {

    visibility: hidden;

    -webkit-transform: translate3d(0, -100%, 0);

    transform: translate3d(0, -100%, 0);

  }

}

.slideOutUp {

  -webkit-animation-name: slideOutUp;

  animation-name: slideOutUp;

}



@keyframes jump-1 {

  0% {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  40% {

    -webkit-transform: translate3d(0, 20px, 0);

    transform: translate3d(0, 20px, 0);

  }

  100% {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

@keyframes jump-2 {

  0% {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

  50% {

    -webkit-transform: translate3d(0, 30px, 0);

    transform: translate3d(0, 30px, 0);

  }

  100% {

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0);

  }

}

@keyframes rotateIt {

  to {

    transform: rotate(-360deg);

  }

}

@keyframes rotateIt2 {

  to {

    transform: rotate(360deg);

  }

}

@keyframes shape-service-1 {

  0% {

    right: -40%;

    top: 30%;

  }

  100% {

    right: -23%;

    top: 0;

  }

}

@keyframes animate-floting {

  0% {

    transform: translateX(50%);

  }

  50% {

    transform: translateX(-40%);

  }

  100% {

    transform: translateX(40%);

  }

}

@keyframes animate-floting-2 {

  0% {

    transform: translateX(-50%);

  }

  50% {

    transform: translateX(40%);

  }

  100% {

    transform: translateX(-40%);

  }

}

@keyframes animate-floting-3 {

  0% {

    transform: translateX(-20%);

  }

  50% {

    transform: translateX(0%);

  }

  100% {

    transform: translateX(-20%);

  }

}

.floting-line {

  animation: animate-floting 15s linear infinite;

}

.floting-line:hover {

  animation-play-state: paused;

}



.floting-line-2 {

  animation: animate-floting-2 15s linear infinite;

}

.floting-line-2:hover {

  animation-play-state: paused;

}



@keyframes waves {

  0% {

    -webkit-transform: scale(0.2, 0.2);

    transform: scale(0.2, 0.2);

    opacity: 0;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";

  }

  50% {

    opacity: 0.9;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";

  }

  100% {

    -webkit-transform: scale(0.9, 0.9);

    transform: scale(0.9, 0.9);

    opacity: 0;

    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";

  }

}

@keyframes vsmorph {

  0% {

    border-radius: var(--morp-value);

  }

  50% {

    border-radius: var(--morp-md-value);

  }

  100% {

    border-radius: 40% 60%;

  }

}

@keyframes morpspin {

  to {

    -webkit-transform: rotate(1turn);

    transform: rotate(1turn);

  }

}

@keyframes marquee {

  0% {

    transform: translateX(0%);

  }

  100% {

    transform: translateX(-100%);

  }

}

.reveal-item {

  position: relative;

  display: block;

  overflow: hidden;

}



.reveal-item .reveal-animation {

  position: absolute;

  top: 0;

  width: 100%;

  height: 101%;

  background: var(--color-primary);

}



.reveal-item .reveal-animation::before {

  position: absolute;

  content: "";

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  background-color: var(--bs-gray-400);

  -webkit-transition-property: -webkit-transform;

  transition-property: -webkit-transform;

  transition-property: transform;

  transition-property: transform, -webkit-transform;

  -webkit-transition-duration: 1s;

  transition-duration: 1s;

}



.reveal-animation.reveal-primary::before {

  background: #0c0c0a;

}



.reveal-animation.reveal-dark::before {

  background: #000;

}



.reveal-animation.reveal-white::before {

  background: #000;

}



.reveal-animation.reveal-top.aos-animate::before,

.reveal-animation.reveal-bottom.aos-animate::before {

  -webkit-transform: scaleY(1);

  transform: scaleY(1);

}



.reveal-animation.reveal-start.aos-animate::before,

.reveal-animation.reveal-end.aos-animate::before {

  -webkit-transform: scaleX(1);

  transform: scaleX(1);

}



.reveal-animation.reveal-top::before {

  -webkit-transform: scaleY(0);

  transform: scaleY(0);

  -webkit-transform-origin: 0% 100%;

  transform-origin: 0% 100%;

}



.reveal-animation.reveal-start::before {

  -webkit-transform: scaleX(0);

  transform: scaleX(0);

  -webkit-transform-origin: 100% 0%;

  transform-origin: 100% 0%;

}



.reveal-animation.reveal-end::before {

  -webkit-transform: scaleX(0);

  transform: scaleX(0);

  -webkit-transform-origin: 0% 100%;

  transform-origin: 0% 100%;

}



.reveal-animation.reveal-bottom::before {

  -webkit-transform: scaleY(0);

  transform: scaleY(0);

  -webkit-transform-origin: 100% 0%;

  transform-origin: 100% 0%;

}



[data-aos=reveal-top],

[data-aos=reveal-start],

[data-aos=reveal-end],

[data-aos=reveal-bottom] {

  -webkit-transition-property: -webkit-transform;

  transition-property: -webkit-transform;

  transition-property: transform;

  transition-property: transform, -webkit-transform;

  -webkit-transition-delay: 1s;

  transition-delay: 1s;

}



[data-aos=reveal-top] {

  -webkit-transform: scaleY(1);

  transform: scaleY(1);

}



[data-aos=reveal-top].aos-animate {

  -webkit-transform: scaleY(0);

  transform: scaleY(0);

  -webkit-transform-origin: 100% 0%;

  transform-origin: 100% 0%;

}



[data-aos=reveal-start] {

  -webkit-transform: scaleX(1);

  transform: scaleX(1);

}



[data-aos=reveal-start].aos-animate {

  -webkit-transform: scaleX(0);

  transform: scaleX(0);

  -webkit-transform-origin: 0% 100%;

  transform-origin: 0% 100%;

}



[data-aos=reveal-end] {

  -webkit-transform: scaleX(1);

  transform: scaleX(1);

}



[data-aos=reveal-end].aos-animate {

  -webkit-transform: scaleX(0);

  transform: scaleX(0);

  -webkit-transform-origin: 100% 0%;

  transform-origin: 100% 0%;

}



[data-aos=reveal-bottom] {

  -webkit-transform: scaleY(1);

  transform: scaleY(1);

}



[data-aos=reveal-bottom].aos-animate {

  -webkit-transform: scaleY(0);

  transform: scaleY(0);

  -webkit-transform-origin: 0% 100%;

  transform-origin: 0% 100%;

}



[data-aos=reveal-item] {

  visibility: hidden;

  -webkit-transition-property: visibility;

  transition-property: visibility;

  -webkit-transition-duration: 0s;

  transition-duration: 0s;

}



[data-aos=reveal-item].aos-animate {

  visibility: visible;

}



@-webkit-keyframes slideInLeftBanner {

  0% {

    opacity: 0;

    -webkit-transform: translateX(-2000px);

    transform: translateX(-2000px);

  }

  100% {

    -webkit-transform: translateX(0);

    transform: translateX(0);

  }

}

@keyframes slideInLeftBanner {

  0% {

    opacity: 0;

    -webkit-transform: translateX(-2000px);

    -ms-transform: translateX(-2000px);

    transform: translateX(-2000px);

  }

  100% {

    -webkit-transform: translateX(0);

    -ms-transform: translateX(0);

    transform: translateX(0);

  }

}

.slideInLeftBanner {

  -webkit-animation-name: slideInLeftBanner;

  animation-name: slideInLeftBanner;

}



@keyframes customOne {

  0% {

    -webkit-transform: translateY(-50%) scale(0);

    transform: translateY(-50%) scale(0);

    opacity: 1;

  }

  100% {

    -webkit-transform: translateY(-50%) scale(1.3);

    transform: translateY(-50%) scale(1.3);

    opacity: 0;

  }

}

@keyframes liveAuction {

  0% {

    background: var(--color-white);

  }

  100% {

    background: var(--color-danger);

  }

}

.cd-intro {

  margin: 4em auto;

}



@media only screen and (min-width: 768px) {

  .cd-intro {

    margin: 5em auto;

  }

}

@media only screen and (min-width: 1170px) {

  .cd-intro {

    margin: 6em auto;

  }

}

.cd-headline {

  font-size: 3rem;

  line-height: 1.2;

}



@media only screen and (min-width: 768px) {

  .cd-headline {

    font-size: 4.4rem;

    font-weight: 300;

  }

}

@media only screen and (min-width: 1170px) {

  .cd-headline {

    font-size: 48px;

  }

}

@media only screen and (max-width: 768px) {

  .cd-headline {

    font-size: 40px;

  }

}

@media only screen and (max-width: 479px) {

  .cd-headline {

    font-size: 26px;

  }

}

.cd-words-wrapper {

  display: inline-block;

  position: relative;

  text-align: left;

}



.cd-words-wrapper b {

  display: inline-block;

  position: absolute;

  white-space: nowrap;

  left: 0;

  top: 0;

}



.cd-words-wrapper b.is-visible {

  position: relative;

}



.no-js .cd-words-wrapper b {

  opacity: 0;

}



.no-js .cd-words-wrapper b.is-visible {

  opacity: 1;

}



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



xclip 



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

.cd-headline.clip span {

  display: inline-block;

  padding: 0;

}



.cd-headline.clip .cd-words-wrapper {

  overflow: hidden;

  vertical-align: middle;

  position: relative;

  margin-top: -20px;

}

.cd-headline.clip .cd-words-wrapper b {

  font-weight: 700;

}



.cd-headline.clip .cd-words-wrapper::after {

  content: "";

  position: absolute;

  top: 50%;

  right: 0;

  width: 4px;

  height: 100%;

  background-color: var(--color-primary-3);

  transform: translateY(-50%);

}



.cd-headline.clip b {

  opacity: 0;

}



.cd-headline.clip b.is-visible {

  opacity: 1;

}



/**

 * Settings

 */

/**

  * Easings

  */

/**

  * Core

  */

[data-sal] {

  transition-duration: 0.2s;

  transition-delay: 0s;

  transition-duration: var(--sal-duration, 0.2s);

  transition-delay: var(--sal-delay, 0s);

  transition-timing-function: var(--sal-easing, ease);

}



[data-sal][data-sal-duration="200"] {

  transition-duration: 0.2s;

}



[data-sal][data-sal-duration="250"] {

  transition-duration: 0.25s;

}



[data-sal][data-sal-duration="300"] {

  transition-duration: 0.3s;

}



[data-sal][data-sal-duration="350"] {

  transition-duration: 0.35s;

}



[data-sal][data-sal-duration="400"] {

  transition-duration: 0.4s;

}



[data-sal][data-sal-duration="450"] {

  transition-duration: 0.45s;

}



[data-sal][data-sal-duration="500"] {

  transition-duration: 0.5s;

}



[data-sal][data-sal-duration="550"] {

  transition-duration: 0.55s;

}



[data-sal][data-sal-duration="600"] {

  transition-duration: 0.6s;

}



[data-sal][data-sal-duration="650"] {

  transition-duration: 0.65s;

}



[data-sal][data-sal-duration="700"] {

  transition-duration: 0.7s;

}



[data-sal][data-sal-duration="750"] {

  transition-duration: 0.75s;

}



[data-sal][data-sal-duration="800"] {

  transition-duration: 0.8s;

}



[data-sal][data-sal-duration="850"] {

  transition-duration: 0.85s;

}



[data-sal][data-sal-duration="900"] {

  transition-duration: 0.9s;

}



[data-sal][data-sal-duration="950"] {

  transition-duration: 0.95s;

}



[data-sal][data-sal-duration="1000"] {

  transition-duration: 1s;

}



[data-sal][data-sal-duration="1050"] {

  transition-duration: 1.05s;

}



[data-sal][data-sal-duration="1100"] {

  transition-duration: 1.1s;

}



[data-sal][data-sal-duration="1150"] {

  transition-duration: 1.15s;

}



[data-sal][data-sal-duration="1200"] {

  transition-duration: 1.2s;

}



[data-sal][data-sal-duration="1250"] {

  transition-duration: 1.25s;

}



[data-sal][data-sal-duration="1300"] {

  transition-duration: 1.3s;

}



[data-sal][data-sal-duration="1350"] {

  transition-duration: 1.35s;

}



[data-sal][data-sal-duration="1400"] {

  transition-duration: 1.4s;

}



[data-sal][data-sal-duration="1450"] {

  transition-duration: 1.45s;

}



[data-sal][data-sal-duration="1500"] {

  transition-duration: 1.5s;

}



[data-sal][data-sal-duration="1550"] {

  transition-duration: 1.55s;

}



[data-sal][data-sal-duration="1600"] {

  transition-duration: 1.6s;

}



[data-sal][data-sal-duration="1650"] {

  transition-duration: 1.65s;

}



[data-sal][data-sal-duration="1700"] {

  transition-duration: 1.7s;

}



[data-sal][data-sal-duration="1750"] {

  transition-duration: 1.75s;

}



[data-sal][data-sal-duration="1800"] {

  transition-duration: 1.8s;

}



[data-sal][data-sal-duration="1850"] {

  transition-duration: 1.85s;

}



[data-sal][data-sal-duration="1900"] {

  transition-duration: 1.9s;

}



[data-sal][data-sal-duration="1950"] {

  transition-duration: 1.95s;

}



[data-sal][data-sal-duration="2000"] {

  transition-duration: 2s;

}



[data-sal][data-sal-delay="50"] {

  transition-delay: 0.05s;

}



[data-sal][data-sal-delay="100"] {

  transition-delay: 0.1s;

}



[data-sal][data-sal-delay="150"] {

  transition-delay: 0.15s;

}



[data-sal][data-sal-delay="200"] {

  transition-delay: 0.2s;

}



[data-sal][data-sal-delay="250"] {

  transition-delay: 0.25s;

}



[data-sal][data-sal-delay="300"] {

  transition-delay: 0.3s;

}



[data-sal][data-sal-delay="350"] {

  transition-delay: 0.35s;

}



[data-sal][data-sal-delay="400"] {

  transition-delay: 0.4s;

}



[data-sal][data-sal-delay="450"] {

  transition-delay: 0.45s;

}



[data-sal][data-sal-delay="500"] {

  transition-delay: 0.5s;

}



[data-sal][data-sal-delay="550"] {

  transition-delay: 0.55s;

}



[data-sal][data-sal-delay="600"] {

  transition-delay: 0.6s;

}



[data-sal][data-sal-delay="650"] {

  transition-delay: 0.65s;

}



[data-sal][data-sal-delay="700"] {

  transition-delay: 0.7s;

}



[data-sal][data-sal-delay="750"] {

  transition-delay: 0.75s;

}



[data-sal][data-sal-delay="800"] {

  transition-delay: 0.8s;

}



[data-sal][data-sal-delay="850"] {

  transition-delay: 0.85s;

}



[data-sal][data-sal-delay="900"] {

  transition-delay: 0.9s;

}



[data-sal][data-sal-delay="950"] {

  transition-delay: 0.95s;

}



[data-sal][data-sal-delay="1000"] {

  transition-delay: 1s;

}



[data-sal][data-sal-easing=linear] {

  transition-timing-function: linear;

}



[data-sal][data-sal-easing=ease] {

  transition-timing-function: ease;

}



[data-sal][data-sal-easing=ease-in] {

  transition-timing-function: ease-in;

}



[data-sal][data-sal-easing=ease-out] {

  transition-timing-function: ease-out;

}



[data-sal][data-sal-easing=ease-in-out] {

  transition-timing-function: ease-in-out;

}



[data-sal][data-sal-easing=ease-in-cubic] {

  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);

}



[data-sal][data-sal-easing=ease-out-cubic] {

  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

}



[data-sal][data-sal-easing=ease-in-out-cubic] {

  transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);

}



[data-sal][data-sal-easing=ease-in-circ] {

  transition-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.335);

}



[data-sal][data-sal-easing=ease-out-circ] {

  transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);

}



[data-sal][data-sal-easing=ease-in-out-circ] {

  transition-timing-function: cubic-bezier(0.785, 0.135, 0.15, 0.86);

}



[data-sal][data-sal-easing=ease-in-expo] {

  transition-timing-function: cubic-bezier(0.95, 0.05, 0.795, 0.035);

}



[data-sal][data-sal-easing=ease-out-expo] {

  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);

}



[data-sal][data-sal-easing=ease-in-out-expo] {

  transition-timing-function: cubic-bezier(1, 0, 0, 1);

}



[data-sal][data-sal-easing=ease-in-quad] {

  transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53);

}



[data-sal][data-sal-easing=ease-out-quad] {

  transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);

}



[data-sal][data-sal-easing=ease-in-out-quad] {

  transition-timing-function: cubic-bezier(0.455, 0.03, 0.515, 0.955);

}



[data-sal][data-sal-easing=ease-in-quart] {

  transition-timing-function: cubic-bezier(0.895, 0.03, 0.685, 0.22);

}



[data-sal][data-sal-easing=ease-out-quart] {

  transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);

}



[data-sal][data-sal-easing=ease-in-out-quart] {

  transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);

}



[data-sal][data-sal-easing=ease-in-quint] {

  transition-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

}



[data-sal][data-sal-easing=ease-out-quint] {

  transition-timing-function: cubic-bezier(0.23, 1, 0.32, 1);

}



[data-sal][data-sal-easing=ease-in-out-quint] {

  transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);

}



[data-sal][data-sal-easing=ease-in-sine] {

  transition-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);

}



[data-sal][data-sal-easing=ease-out-sine] {

  transition-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);

}



[data-sal][data-sal-easing=ease-in-out-sine] {

  transition-timing-function: cubic-bezier(0.445, 0.05, 0.55, 0.95);

}



[data-sal][data-sal-easing=ease-in-back] {

  transition-timing-function: cubic-bezier(0.6, -0.28, 0.735, 0.045);

}



[data-sal][data-sal-easing=ease-out-back] {

  transition-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);

}



[data-sal][data-sal-easing=ease-in-out-back] {

  transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);

}



/**

  * Animations

  */

[data-sal|=fade] {

  opacity: 0;

  transition-property: opacity;

}



[data-sal|=fade].sal-animate,

body.sal-disabled [data-sal|=fade] {

  opacity: 1;

}



[data-sal|=slide] {

  opacity: 0;

  transition-property: opacity, transform;

}



[data-sal=slide-up] {

  transform: translateY(20%);

}



[data-sal=slide-up-large] {

  transform: translateY(50%);

}



[data-sal=slide-down] {

  transform: translateY(-20%);

}



[data-sal=slide-left] {

  transform: translateX(20%);

}



[data-sal=slide-right] {

  transform: translateX(-20%);

}



[data-sal|=slide].sal-animate,

body.sal-disabled [data-sal|=slide] {

  opacity: 1;

  transform: none;

}



[data-sal|=zoom] {

  opacity: 0;

  transition-property: opacity, transform;

}



[data-sal=zoom-in] {

  transform: scale(0.5);

}



[data-sal=zoom-out] {

  transform: scale(1.1);

}



[data-sal|=zoom].sal-animate,

body.sal-disabled [data-sal|=zoom] {

  opacity: 1;

  transform: none;

}



[data-sal|=flip] {

  backface-visibility: hidden;

  transition-property: transform;

}



[data-sal=flip-left] {

  transform: perspective(2000px) rotateY(-91deg);

}



[data-sal=flip-right] {

  transform: perspective(2000px) rotateY(91deg);

}



[data-sal=flip-up] {

  transform: perspective(2000px) rotateX(-91deg);

}



[data-sal=flip-down] {

  transform: perspective(2000px) rotateX(91deg);

}



[data-sal|=flip].sal-animate,

body.sal-disabled [data-sal|=flip] {

  transform: none;

}



/*elements*/

.tmp-btn {

  padding: 0 26px;

  font-family: var(--font-secondary);

  line-height: 10px;

  max-width: max-content;

  font-size: 16px;

  font-weight: 500;

  letter-spacing: 0.05em;

  transition: 0.3s;

  border-radius: 50px;

  display: flex;

  align-items: center;

  min-width: max-content;

  position: relative;

  z-index: 1;

  height: 60px;

  justify-content: center;

}

.tmp-btn:focus, .tmp-btn:active {

  box-shadow: none;

}

.tmp-btn.btn-sm {

  padding: 0 22px;

  font-size: 16px;

  height: 45px;

  line-height: 43px;

}

.tmp-btn.btn-md {

  padding: 0 25px;

  font-size: 16px;

  height: 50px;

  line-height: 48px;

}

.tmp-btn.btn-lg {

  height: 70px;

  line-height: 70px;

  padding: 0 35px;

  font-size: 18px;

}

.tmp-btn.btn-xl {

  padding: 0 45px;

  font-size: 20px;

  height: 75px;

  line-height: 75px;

}

.tmp-btn.btn-xxl {

  padding: 0 60px;

  font-size: 22px;

  height: 100px;

  line-height: 100px;

}

.tmp-btn.button-flip.bg-white {

  background: #fff;

}

.tmp-btn.button-flip span {

  display: inline-flex;

  position: relative;

  z-index: 3;

  transition: opacity 0.65s, transform 0.85s;

  transition-timing-function: cubic-bezier(0.15, 0.85, 0.31, 1);

}

.tmp-btn.button-flip span::after {

  content: attr(data-text);

  display: inline-block;

  position: absolute;

  white-space: nowrap;

  top: 50%;

  opacity: 0;

  transition: inherit;

  left: 100%;

  transform: translate(50%, -50%);

}

.tmp-btn.button-flip:hover {

  transform: none;

}

.tmp-btn.button-flip:hover span {

  transform: translateX(-200%);

}

.tmp-btn.button-flip:hover span::after {

  opacity: 1;

  transform: translate(100%, -50%);

}

.tmp-btn.btn-primary {

  background: var(--color-primary);

  color: #fff;

  position: relative;

  overflow: hidden;

  z-index: 1;

}

.tmp-btn.btn-primary::after {

  content: "";

  position: absolute;

  -webkit-transition-duration: 800ms;

  transition-duration: 800ms;

  width: 200%;

  height: 200%;

  top: 110%;

  left: 50%;

  background: var(--color-heading-1);

  -webkit-transform: translateX(-50%);

  -moz-transform: translateX(-50%);

  -ms-transform: translateX(-50%);

  -o-transform: translateX(-50%);

  transform: translateX(-50%);

  -webkit-border-radius: 50%;

  -moz-border-radius: 50%;

  -o-border-radius: 50%;

  -ms-border-radius: 50%;

  border-radius: 50%;

  z-index: -1;

}

.tmp-btn.btn-primary:hover {

  color: white;

}

.tmp-btn.btn-primary:hover::after {

  top: -40%;

}

.tmp-btn.btn-primary:focus {

  box-shadow: none;

  border: none;

  outline: none;

}

.tmp-btn.btn-primary.btn-two {

  background: var(--color-primary-2);

}

.tmp-btn.btn-primary.hover-white:hover {

  color: var(--color-heading-1);

}

.tmp-btn.btn-primary.hover-white:hover::after {

  background: var(--color-white);

}

.tmp-btn.btn-primary.btn-border {

  background: transparent;

  border: 1px solid var(--color-white);

}

.tmp-btn.btn-seconday {

  background: var(--color-secondary);

  color: #fff;

  position: relative;

  overflow: hidden;

  z-index: 1;

}

.tmp-btn.btn-seconday::after {

  position: absolute;

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  content: "";

  background: var(--color-primary);

  transform: translateY(110%);

  transition: 0.3s;

  z-index: -1;

}

.tmp-btn.btn-seconday:hover::after {

  transform: translateY(0);

}

.tmp-btn.btn-terciary {

  background: #FFFFFF;

  color: #0C0A0A;

  position: relative;

  overflow: hidden;

  z-index: 1;

}

.tmp-btn.btn-terciary::after {

  position: absolute;

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  content: "";

  background: var(--color-primary);

  transform: translateY(110%);

  transition: 0.3s;

  z-index: -1;

}

.tmp-btn.btn-terciary:hover {

  color: #fff;

}

.tmp-btn.btn-terciary:hover::after {

  transform: translateY(0);

}

.tmp-btn.hover-icon-reverse:hover .icon-reverse-wrapper .btn-text {

  transition-delay: 0.1s;

  transform: translateX(23px);

}

.tmp-btn.hover-icon-reverse:hover .icon-reverse-wrapper .btn-icon {

  opacity: 0;

  transition-delay: 0s;

  transform: translateX(10px);

}

.tmp-btn.hover-icon-reverse:hover .icon-reverse-wrapper .btn-icon + .btn-icon {

  opacity: 1;

  transform: translateX(0);

  transition-delay: 0.225s;

}

.tmp-btn.hover-icon-reverse .icon-reverse-wrapper {

  display: flex;

  align-items: center;

  justify-content: center;

}

.tmp-btn.hover-icon-reverse .icon-reverse-wrapper i {

  padding-left: 6px;

  display: inline-block;

  top: 1px;

  position: relative;

  font-size: 16px;

}

.tmp-btn.hover-icon-reverse .icon-reverse-wrapper .btn-text {

  display: inline-block;

  transition: transform 0.6s 0.125s cubic-bezier(0.1, 0.75, 0.25, 1);

  margin-inline-start: -23px;

}

.tmp-btn.hover-icon-reverse .icon-reverse-wrapper .btn-icon {

  display: inline-block;

  transition: opacity 0.4s 0.25s, transform 0.6s 0.25s;

  transition-timing-function: cubic-bezier(0.1, 0.75, 0.25, 1);

}

.tmp-btn.hover-icon-reverse .icon-reverse-wrapper .btn-icon + .btn-icon {

  margin-inline-end: 0;

  margin-inline-start: 8px;

  display: inline-block;

  margin-inline-start: 0;

  margin-inline-end: 10px;

  opacity: 0;

  transform: translateX(-10px);

  transition-delay: 0s;

  order: -2;

}

.tmp-btn.hover-icon-reverse .icon-reverse-wrapper .btn-icon + .btn-icon i {

  padding-right: 6px;

}

.tmp-btn.btn-border {

  border: 1px solid var(--color-border);

  color: var(--color-heading-1);

  overflow: hidden;

}

.tmp-btn.btn-border.btn-bg-dark {

  border-color: rgba(241, 241, 241, 0.1843137255);

  color: white;

}

.tmp-btn.btn-border.btn-bg-dark:hover {

  border-color: var(--color-primary);

}

.tmp-btn.btn-border.btn-bg-dark:hover::after {

  background: var(--color-primary);

}

.tmp-btn.btn-border::after {

  content: "";

  position: absolute;

  -webkit-transition-duration: 800ms;

  transition-duration: 800ms;

  width: 200%;

  height: 200%;

  top: 110%;

  left: 50%;

  background: var(--color-heading-1);

  -webkit-transform: translateX(-50%);

  -moz-transform: translateX(-50%);

  -ms-transform: translateX(-50%);

  -o-transform: translateX(-50%);

  transform: translateX(-50%);

  -webkit-border-radius: 50%;

  -moz-border-radius: 50%;

  -o-border-radius: 50%;

  -ms-border-radius: 50%;

  border-radius: 50%;

  z-index: -1;

}

.tmp-btn.btn-border:hover {

  color: white;

  border: 1px solid transparent;

}

.tmp-btn.btn-border:hover::after {

  top: -40%;

}

.tmp-btn.btn-border.btn-two {

  border: 1px solid var(--color-primary-2);

  color: var(--color-primary-2);

}

.tmp-btn.btn-border.btn-two:hover {

  border: 1px solid var(--color-heading-1);

  color: var(--color-white);

}

.tmp-btn.btn-small {

  padding: 15px 26px;

}

.tmp-btn.btn-arrow {

  font-weight: 400;

}

.tmp-btn.btn-arrow i {

  transform: rotate(-45deg);

}

.tmp-btn.btn-border-white {

  border-color: rgba(255, 255, 255, 0.36);

  color: #fff;

}

.tmp-btn.border-radius {

  border-radius: 30px;

}



.btn-read-more {

  color: #FF6600;

  text-transform: uppercase;

  font-weight: 600;

  font-size: 14px;

  line-height: 21px;

  font-family: var(--font-primary);

}

.btn-read-more i {

  margin-left: 5px;

}



.vedio-icone .popup-video {

  position: absolute;

  z-index: 2;

  top: 50%;

  left: 50%;

  transform: translateX(-50%) translateY(-50%);

  box-sizing: content-box;

  display: block;

  width: 122px;

  height: 122px;

  border-radius: 50%;

  line-height: 135px;

  text-align: center;

  background: var(--color-primary);

}

.vedio-icone .popup-video i {

  color: var(--color-white);

  font-size: 34px;

}

.vedio-icone .popup-video::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  background: rgba(255, 112, 41, 0.2);

  top: 0;

  border-radius: 50%;

  right: 0;

  animation: pulse-border 4s linear infinite;

}

.vedio-icone .video-overlay {

  position: fixed;

  z-index: -1;

  top: 0;

  bottom: 0;

  left: 0;

  right: 0;

  background: rgba(0, 0, 0, 0.8);

  opacity: 0;

  transition: all ease 500ms;

  display: none;

}

.vedio-icone .video-overlay iframe {

  width: 70%;

  height: 70%;

  margin: auto;

  display: flex;

  align-items: center;

  justify-content: center;

  top: 50%;

  top: 50%;

  position: relative;

  transform: translateY(-50%);

}

.vedio-icone .video-overlay.open {

  position: fixed;

  z-index: 1000;

  opacity: 1;

  display: block;

}

.vedio-icone .video-overlay .video-overlay-close {

  position: absolute;

  z-index: 1000;

  top: 15px;

  right: 20px;

  font-size: 36px;

  line-height: 1;

  font-weight: 400;

  color: #fff;

  text-decoration: none;

  cursor: pointer;

  transition: all 200ms;

}



.text-btn {

  color: var(--color-heading-1);

}



.btn-arrow {

  font-weight: 400;

  position: relative;

}

.btn-arrow i {

  transform: rotate(-45deg);

  margin-left: 3px;

  transition: 0.3s;

  font-size: 0;

  position: relative;

  bottom: -1px;

}

.btn-arrow:hover i {

  font-size: 14px;

}



.setting-btn {

  width: 45px;

  height: 45px;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  gap: 6px;

  background-color: var(--color-primary);

  border-radius: 4px;

  cursor: pointer;

  border: none;

}

@media only screen and (max-width: 991px) {

  .setting-btn {

    border-radius: 50%;

  }

}

@media only screen and (max-width: 767px) {

  .setting-btn {

    width: 45px;

    height: 45px;

  }

}

.setting-btn.color-2 {

  background: var(--color-primary-2);

}



.bar {

  width: 50%;

  height: 2px;

  background-color: rgb(229, 229, 229);

  display: flex;

  align-items: center;

  justify-content: center;

  position: relative;

  border-radius: 2px;

}

@media only screen and (max-width: 767px) {

  .bar {

    width: 80%;

  }

}



.bar::before {

  content: "";

  width: 2px;

  height: 2px;

  background-color: rgb(126, 117, 255);

  position: absolute;

  border-radius: 50%;

  border: 2px solid white;

  transition: all 0.3s;

  box-shadow: 0px 0px 5px white;

}



.bar1::before {

  transform: translateX(-4px);

}



.bar2::before {

  transform: translateX(4px);

}



.setting-btn:hover .bar1::before {

  transform: translateX(4px);

}



.setting-btn:hover .bar2::before {

  transform: translateX(-4px);

}



.section-bottom-video-area {

  position: relative;

}



.rounded-player-2 {

  border: 0;

  width: 80px;

  height: 80px;

  margin-left: -40px;

  margin-top: -40px;

  transition: all 1s cubic-bezier(0, 0, 0.2, 1);

  position: absolute;

  border-radius: 100%;

  background: var(--color-white);

  margin: 0 auto;

  display: inline-block;

  padding: 0;

  z-index: 1;

}

@media only screen and (max-width: 767px) {

  .rounded-player-2 {

    width: 60px;

    height: 60px;

  }

}

.rounded-player-2.position-center {

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

}

.rounded-player-2.position-right-top-center {

  top: 50%;

  left: 75%;

  transform: translate(-50%, -50%);

}

.rounded-player-2.position-right-bottom {

  bottom: 50px;

  right: 50px;

}

@media only screen and (max-width: 1199px) {

  .rounded-player-2.position-right-bottom {

    top: 50px;

    bottom: auto;

  }

}

@media only screen and (max-width: 576px) {

  .rounded-player-2.position-right-bottom {

    left: 50%;

    top: 50%;

    bottom: auto;

    right: auto;

    transform: translate(-50%, -50%);

  }

}

.rounded-player-2 .play-icon {

  position: absolute;

  display: block;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

}

.rounded-player-2 .play-icon::before {

  content: "";

  position: absolute;

  top: 50%;

  left: 50%;

  width: 0;

  height: 0;

  transform: translate(-6px, -9px);

  border-top: 9px solid transparent;

  border-bottom: 9px solid transparent;

  border-left: 15px solid var(--color-primary);

}

.rounded-player-2.with-animation::before {

  content: "";

  display: block;

  position: absolute;

  top: 0;

  right: 0;

  z-index: -1;

  bottom: 0;

  left: 0;

  -webkit-transition: 0.3s;

  transition: 0.3s;

  border-radius: 50%;

  border: 1.5px solid var(--color-white);

}

.rounded-player-2.with-animation::after {

  content: "";

  display: block;

  position: absolute;

  top: 0;

  right: 0;

  z-index: -1;

  bottom: 0;

  left: 0;

  -webkit-transition: 0.3s;

  transition: 0.3s;

  border-radius: 50%;

  border: 1.5px solid var(--color-white);

  animation: rippleBorder 2s linear 1s infinite;

}

.rounded-player-2.with-animation::before {

  -webkit-animation: rippleBorder 2s linear infinite;

  animation: rippleBorder 2s linear infinite;

}



.tmp-btn-marquo {

  overflow: hidden;

  padding: 15px 5px;

}

.tmp-btn-marquo::before {

  content: "";

  z-index: -1;

  top: 3px;

  left: 3px;

  position: absolute;

  background: transparent;

  width: calc(100% - 6px);

  height: calc(100% - 6px);

}

.tmp-btn-marquo span {

  display: inline-flex;

  position: relative;

  z-index: 3;

  line-height: 1.2;

  animation: btnMarqueeX 2s linear infinite;

}

.tmp-btn-marquo span::after {

  content: attr(data-text);

  position: absolute;

  white-space: nowrap;

  top: 50%;

  left: 75%;

  transform: translate(75%, -50%);

}



@keyframes btnMarqueeX {

  100% {

    transform: translateX(-150%);

  }

}

@keyframes rippleBorder {

  0% {

    -webkit-transform: scale(0.9);

    transform: scale(0.9);

    opacity: 1;

  }

  75% {

    -webkit-transform: scale(1.9);

    transform: scale(1.9);

    opacity: 0.5;

  }

  100% {

    -webkit-transform: scale(2.3);

    transform: scale(2.3);

    opacity: 0;

  }

}

@keyframes rippleBorder_03 {

  0% {

    -webkit-transform: scale(0.9);

    transform: scale(0.9);

    opacity: 0.1;

  }

  75% {

    -webkit-transform: scale(1.9);

    transform: scale(1.9);

    opacity: 0.1;

  }

  100% {

    -webkit-transform: scale(2.3);

    transform: scale(2.3);

    opacity: 0.1;

  }

}

.button-group {

  display: flex;

  align-items: center;

  gap: 15px;

}



.tmp-icon-overlay-link-btn {

  height: 40px;

  width: 40px;

  border-radius: 50%;

  color: var(--color-primary);

  font-size: 14px;

  text-align: center;

  background: 0 0;

  display: inline-block;

  position: relative;

  overflow: hidden;

  z-index: 1;

}

.tmp-icon-overlay-link-btn.btn-sm {

  min-height: 35px;

  min-width: 35px;

}

.tmp-icon-overlay-link-btn.btn-md {

  min-height: 38px;

  min-width: 38px;

}

.tmp-icon-overlay-link-btn.btn-lg {

  min-height: 45px;

  min-width: 45px;

}

.tmp-icon-overlay-link-btn.btn-xl {

  min-height: 55px;

  min-width: 55px;

}

.tmp-icon-overlay-link-btn.btn-xl i {

  font-size: 22px;

  font-weight: 400;

}

.tmp-icon-overlay-link-btn.btn-xxl {

  min-height: 70px;

  min-width: 70px;

}

.tmp-icon-overlay-link-btn.btn-xxl i {

  font-size: 24px;

  font-weight: 400;

}

.tmp-icon-overlay-link-btn.primary-btn.with-text-btn {

  background-color: var(--color-primary);

}

.tmp-icon-overlay-link-btn.primary-btn.with-text-btn i {

  color: var(--color-white);

}

.tmp-icon-overlay-link-btn.btn-bg-dark::after {

  background-color: var(--color-white);

}

.tmp-icon-overlay-link-btn::after {

  transition: var(--transition);

  content: "";

  width: 100%;

  height: 100%;

  background-color: var(--primary-50);

  border-radius: 50%;

  position: absolute;

  top: 0;

  left: 0;

  -webkit-transform: translateY(0);

  transform: translateY(0);

  opacity: 1;

  z-index: -1;

}

.tmp-icon-overlay-link-btn i.tmp-icon {

  transition: var(--transition);

  color: var(--color-primary);

  transform: rotate(-45deg);

}

.tmp-icon-overlay-link-btn i.tmp-icon-bottom {

  position: absolute;

  transition: var(--transition);

  transform: translateY(300%) translateX(-475%) rotate(-45deg);

  color: var(--color-white);

}

.tmp-icon-overlay-link-btn .tmp-btn-overlay {

  position: relative;

  overflow: hidden;

  height: 100%;

  width: 100%;

  display: flex;

  align-items: center;

  justify-content: center;

}

.tmp-icon-overlay-link-btn:hover {

  background: var(--color-primary);

  border-color: transparent;

  color: var(--color-white);

}

.tmp-icon-overlay-link-btn:hover i.tmp-icon {

  transform: translateY(-300%) translateX(475%);

}

.tmp-icon-overlay-link-btn:hover i.tmp-icon-bottom {

  transform: translateY(0) translateX(0) scale(1.1) rotate(-45deg);

}

.tmp-icon-overlay-link-btn:hover::after {

  background: var(--color-primary);

  border: 2px solid var(--color-primary);

  color: var(--color-white);

}



.tmp-button-overlay-with-text {

  display: flex;

  align-items: center;

  gap: 15px;

}

.tmp-button-overlay-with-text.text-white .text-btn {

  color: var(--color-white);

}

.tmp-button-overlay-with-text.btn-sm .tmp-icon-overlay-link-btn {

  min-height: 35px;

  min-width: 35px;

}

.tmp-button-overlay-with-text.btn-sm .tmp-icon-overlay-link-btn i {

  font-size: 14px;

}

.tmp-button-overlay-with-text.btn-sm .text-btn {

  font-size: 16px;

}

.tmp-button-overlay-with-text.btn-md .tmp-icon-overlay-link-btn {

  min-height: 40px;

  min-width: 40px;

}

.tmp-button-overlay-with-text.btn-md .tmp-icon-overlay-link-btn i {

  font-size: 14px;

}

.tmp-button-overlay-with-text.btn-md .text-btn {

  font-size: 18px;

}

.tmp-button-overlay-with-text.btn-default .tmp-icon-overlay-link-btn {

  min-height: 45px;

  min-width: 45px;

}

.tmp-button-overlay-with-text.btn-default .tmp-icon-overlay-link-btn i {

  font-size: 14px;

}

.tmp-button-overlay-with-text.btn-default .text-btn {

  font-size: 18px;

}

.tmp-button-overlay-with-text.btn-lg .tmp-icon-overlay-link-btn {

  min-height: 50px;

  min-width: 50px;

}

.tmp-button-overlay-with-text.btn-lg .tmp-icon-overlay-link-btn i {

  font-size: 14px;

}

.tmp-button-overlay-with-text.btn-lg .text-btn {

  font-size: 20px;

}

.tmp-button-overlay-with-text.btn-xl .tmp-icon-overlay-link-btn {

  min-height: 60px;

  min-width: 60px;

}

.tmp-button-overlay-with-text.btn-xl .tmp-icon-overlay-link-btn i {

  font-size: 22px;

}

.tmp-button-overlay-with-text.btn-xl .text-btn {

  font-size: 22px;

}

.tmp-button-overlay-with-text .tmp-btn-overlay {

  transition: 0.3s;

}

.tmp-button-overlay-with-text:hover .tmp-btn-overlay {

  background: var(--color-primary);

}

.tmp-button-overlay-with-text:hover .tmp-icon-overlay-link-btn.with-text-btn.primary-btn {

  background-color: var(--color-primary);

}

.tmp-button-overlay-with-text:hover .tmp-icon-overlay-link-btn.with-text-btn.primary-btn i {

  color: var(--color-white);

}

.tmp-button-overlay-with-text .tmp-icon-overlay-link-btn.with-text-btn.primary-btn {

  background-color: var(--primary--100);

}

.tmp-button-overlay-with-text .tmp-icon-overlay-link-btn.with-text-btn.primary-btn i {

  color: var(--color-primary);

}

.tmp-button-overlay-with-text .text-btn {

  font-size: 30px;

  line-height: 37px;

  color: var(--color-black);

  font-family: var(--font-secondary);

  font-weight: 500;

}

.tmp-button-overlay-with-text.fw-400 .text-btn {

  font-weight: 400;

}

.tmp-button-overlay-with-text:hover {

  background: 0 0;

  border-color: transparent;

  color: var(--color-white);

}

.tmp-button-overlay-with-text:hover i.tmp-icon {

  transform: translateY(-300%) translateX(475%);

}

.tmp-button-overlay-with-text:hover i.tmp-icon-bottom {

  transform: translateY(0) translateX(0) scale(1.1) rotate(-45deg);

}

.tmp-button-overlay-with-text:hover::after {

  background: var(--color-primary);

  border: 2px solid var(--color-primary);

  color: var(--color-white);

}



.tmp-btn.read-more-btn-border {

  border: 1px solid #E4E4E4;

  border-radius: 100px;

  min-width: 100%;

  justify-content: space-between;

  padding: 2px 2px 2px 28px;

  transition: var(--transition);

}

.tmp-btn.read-more-btn-border .text {

  max-width: max-content;

  min-width: max-content;

}

.tmp-btn.read-more-btn-border .tmp-btn-overlay {

  position: relative;

  overflow: hidden;

  height: 55px;

  width: 55px;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

  background: var(--primary-100);

  transition: var(--transition);

}

.tmp-btn.read-more-btn-border .tmp-btn-overlay .tmp-icon {

  transition: var(--transition);

  color: var(--color-primary);

  transform: rotate(-45deg);

}

.tmp-btn.read-more-btn-border .tmp-btn-overlay i.tmp-icon-bottom {

  position: absolute;

  transition: var(--transition);

  transform: translateY(300%) translateX(-475%) rotate(-45deg);

  color: var(--color-primary);

}

.tmp-btn.read-more-btn-border:hover {

  background: var(--color-white);

  border-color: transparent;

  box-shadow: var(--shadow-1);

}

.tmp-btn.read-more-btn-border:hover .tmp-btn-overlay {

  background: var(--color-primary);

}

.tmp-btn.read-more-btn-border:hover .tmp-icon {

  transform: translateY(-300%) translateX(475%);

  color: var(--color-white);

}

.tmp-btn.read-more-btn-border:hover i.tmp-icon-bottom {

  color: var(--color-white);

  transform: translateY(0) translateX(0) scale(1.1) rotate(-45deg);

}



header {

  position: relative;

  z-index: 99;

}

header.header-one .header-top {

  overflow: hidden;

  background: var(--color-primary);

}

header.header-one .header-top-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 8px 0 8px;

}

header.header-one .header-top-wrapper .left {

  display: flex;

  align-items: center;

  position: relative;

  padding-right: 25px;

}

header.header-one .header-top-wrapper .left .single-component {

  display: flex;

  align-items: center;

  gap: 10px;

  padding: 0 10px;

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 1199px) {

  header.header-one .header-top-wrapper .left .single-component:first-child {

    

  }

}

header.header-one .header-top-wrapper .left .single-component:last-child::after {

  display: none;

}

header.header-one .header-top-wrapper .left .single-component::after {

  content: "";

  position: absolute;

  background: rgba(255, 255, 255, 0.5);

  width: 1px;

  height: 20px;

  top: 50%;

  right: 0;

  transform: translateY(-50%);

}

header.header-one .header-top-wrapper .left .icon {

  color: var(--color-white);

}

header.header-one .header-top-wrapper .left .icon i {

  font-size: 14px;

}

header.header-one .header-top-wrapper .left .info span {

  color: var(--color-white);

  font-size: 14px;

}

header.header-one .header-top-wrapper .left .info span a:hover {

  color: unset;

}

header.header-one .header-top-wrapper .right {

  display: flex;

  align-items: center;

}



.header-mid {

  background: #F2F3F5;

}



.header-main-2 {

  position: relative;

  z-index: 1;

  margin: auto;

}

.header-main-2 .header-mid-one-wrapper .logo-area::before {

  content: "";

  position: absolute;

  height: 100%;

  width: 585px;

  background: var(--color-heading-1);

  z-index: -1;

  right: 0;

  top: 0;

  clip-path: polygon(0 0, 100% 0, 92% 100%, 0% 100%);

}

@media only screen and (max-width: 991px) {

  .header-main-2 .header-mid-one-wrapper .logo-area::before {

    width: 613px;

  }

}

@media only screen and (max-width: 576px) {

  .header-main-2 .header-mid-one-wrapper .logo-area::before {

    clip-path: none;

  }

}

@media (min-width: 1900px) {

  .header-main-2 .header-mid-one-wrapper .logo-area::before {

    width: 350%;

  }

}



@media only screen and (max-width: 1199px) {

  .header-six .header-mid-one-wrapper .nav-area {

    display: block;

  }

  .header-six .header-mid-one-wrapper .nav-area .tmp-mega-menu.with-home-demos .demos-area-drop-down .mega-menu-item {

    gap: 10px;

  }

}



.header-mid-one-wrapper {

  align-items: center;

  justify-content: space-between;

  position: relative;

}

.header-mid-one-wrapper .logo-area {

  flex-basis: 22%;

  padding: 21px 0 21px;

  position: relative;

  z-index: 1;

}

.header-mid-one-wrapper .logo-area::after {

  position: absolute;

  content: "";

  width: 100%;

  height: 108%;

  background: var(--color-primary);

  bottom: 0px;

  right: -10px;

  z-index: -1;

  clip-path: polygon(92% 0, 100% 0, 73% 100%, 65% 100%);

}

@media (max-width: 1900px) {

  .header-mid-one-wrapper .logo-area::after {

    clip-path: polygon(92% 0, 101% 0, 84% 100%, 75% 100%);

  }

}

@media only screen and (max-width: 1199px) {

  .header-mid-one-wrapper .logo-area::after {

    display: none;

  }

}

@media only screen and (max-width: 991px) {

  .header-mid-one-wrapper .logo-area::after {

    display: block;

  }

}

@media only screen and (max-width: 1199px) {

  .header-mid-one-wrapper .nav-area {

    display: none;

  }

}

.header-mid-one-wrapper .main-nav-desk {

  flex-basis: 58%;

  position: relative;

  z-index: 1;

  padding-left: 10px;

}

.header-mid-one-wrapper .header-right {

  display: flex;

  align-items: center;

  flex-basis: 25%;

  gap: 40px;

  justify-content: end;

}

.header-mid-one-wrapper .header-right .cart-search-area {

  display: flex;

  align-items: center;

  gap: 25px;

}

.header-mid-one-wrapper .header-right .cart-search-area a {

  display: block;

  position: relative;

  z-index: 1;

}

.header-mid-one-wrapper .header-right .cart-search-area a span {

  position: absolute;

  background: var(--color-primary);

  font-size: 10px;

  width: 15px;

  height: 15px;

  line-height: 15px;

  border-radius: 50%;

  top: -2px;

  right: -7px;

  z-index: 1;

  text-align: center;

  display: block;

  color: var(--color-white);

}

.header-mid-one-wrapper .header-right .single-component {

  display: flex;

  align-items: center;

}

@media only screen and (max-width: 1199px) {

  .header-mid-one-wrapper .header-right .single-component.info-con {

    display: none;

  }

}

.header-mid-one-wrapper .header-right .single-component .icon {

  margin-right: 15px;

}

.header-mid-one-wrapper .header-right .single-component .icon i {

  display: block;

  width: 45px;

  height: 45px;

  background: #FFFFFF;

  box-shadow: 0px 4px 24px #DDE2EB;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

  color: #0C0A0A;

  font-weight: 500;

  font-size: 20px;

}

.header-mid-one-wrapper .header-right .single-component .info span {

  display: block;

  font-weight: 600;

  font-size: 16px;

  line-height: 24px;

  color: #6E777D;

  font-family: var(--font-primary);

  margin-bottom: -3px;

}

.header-mid-one-wrapper .header-right .single-component .info a {

  font-weight: 600;

  font-size: 20px;

  line-height: 30px;

  color: #0C0A0A;

  font-family: var(--font-primary);

  transition: 0.3s;

}

.header-mid-one-wrapper .header-right .single-component .info a:hover {

  color: var(--color-primary);

}

.header-mid-one-wrapper .header-right .single-component a.tmp-btn {

  display: flex;

  align-items: center;

}

@media only screen and (max-width: 576px) {

  .header-mid-one-wrapper .header-right .single-component a.tmp-btn {

    display: none;

  }

}

.header-mid-one-wrapper .header-right .single-component a.tmp-btn svg {

  margin-left: 6px;

  margin-top: 3px;

}

.header-mid-one-wrapper .header-right .single-component .menu-area {

  margin-left: 20px;

}

.header-mid-one-wrapper .header-right .single-component .menu-area .icon {

  display: flex;

  align-items: center;

  justify-content: center;

  height: 50px;

  width: 50px;

  background: var(--color-primary);

  border-radius: 2px;

}

.header-mid-one-wrapper .header-right .single-component .menu-area svg rect {

  fill: #fff;

}

.header-one {

  box-shadow: 0px 7px 18px rgba(24, 16, 16, 0.0509803922);

}

@media only screen and (max-width: 1199px) {

  .header-one .dot-btn {

    display: none;

  }

}



.header-one .nav-area-one .nav-header-area {

  position: relative;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .header-one .nav-area-one .nav-header-area {

    display: none;

  }

}

@media only screen and (max-width: 767px) {

  .header-one .nav-area-one .nav-header-area {

    display: none;

  }

}

.header-one .nav-area-one .clip-path {

  clip-path: polygon(100% 0, 100% 42%, 98.5% 100%, 1.5% 100%, 0 42%, 0% 0%);

  position: absolute;

  background: var(--color-primary);

  height: 65px;

  width: 100%;

}

.header-one .nav-area-one .wrapper {

  display: flex;

  align-items: center;

  line-height: 0;

  position: absolute;

  width: 100%;

  justify-content: space-between;

}

.header-one .nav-area-one .wrapper .nav-area nav ul {

  display: flex;

  align-items: center;

  margin-left: 10px;

}

.header-one .nav-area-one .wrapper .nav-area nav ul li a {

  padding: 21px 20px;

  display: block;

}

.header-one .nav-area-one .wrapper .btn-right {

  display: flex;

  align-items: center;

  margin-right: 40px;

}

.header-one .nav-area-one .wrapper .btn-right .search-btn {

  cursor: pointer;

}

.header-one .nav-area-one .wrapper .btn-right .search-btn i {

  color: #fff;

  font-size: 20px;

  margin-top: 2px;

}

.header-one .nav-area-one .wrapper .btn-right .cart-icon {

  margin-left: 30px;

  cursor: pointer;

  position: relative;

}

.header-one .nav-area-one .wrapper .btn-right .cart-icon::after {

  position: absolute;

  right: -10px;

  bottom: -6px;

  height: 20px;

  width: 20px;

  border-radius: 50%;

  content: "2";

  background: #236355;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 12px;

  color: #fff;

}



.nav-area ul {

  padding: 0;

  margin: 0;

}

.nav-area ul li {

  margin: 0;

}

.nav-area ul li a {

  font-family: var(--font-primary);

  color: var(--color-heading-1);

  font-weight: 700;

  letter-spacing: 0.02em;

  font-size: 18px;

  line-height: 24px;

    text-transform: uppercase;

}



.nav-area nav ul {

  display: flex;

  align-items: center;

  gap: 40px;

}

.nav-area nav ul li {

  margin: 0;

}



.heder-two .header-two-container {

  max-width: 1740px;

  margin: auto;

  position: relative;

}

@media screen and (max-width: 1919px) {

  .heder-two .header-two-container {

    max-width: 95%;

  }

}

.heder-two .header-two-container .header-main-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

@media screen and (max-width: 1300px) {

  .heder-two .header-two-container .header-main-wrapper {

    padding: 22px 0;

  }

}

.heder-two .header-two-container .header-main-wrapper .logo-area a {

  padding: 20px 80px 20px 0;

  display: block;

}

@media screen and (max-width: 1420px) {

  .heder-two .header-two-container .header-main-wrapper .logo-area a {

    padding: 0;

    padding-right: 20px;

  }

}

@media (max-width: 400px) {

  .heder-two .header-two-container .header-main-wrapper .logo-area a {

    max-width: 140px;

  }

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right {

  border-right: 1px solid #E9E9E9;

  border-left: 1px solid #E9E9E9;

  position: relative;

}

@media screen and (max-width: 1300px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right {

    margin: auto;

    border: none;

  }

}

@media screen and (max-width: 1200px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right {

    border-left: 0px solid #E9E9E9 !important;

    border-right: 0px solid #E9E9E9 !important;

  }

}

@media screen and (max-width: 1024px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right {

    margin: unset;

    border: none;

  }

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .menu-area {

  position: absolute;

  cursor: pointer;

  right: -29px;

  top: 47%;

  transform: translateY(-50%);

  display: flex;

  align-items: center;

  justify-content: center;

  border: 1px solid #E9E9E9;

  height: 55px;

  width: 55px;

  background: #fff;

}

@media only screen and (max-width: 1199px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right .menu-area {

    right: 0;

  }

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .top {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 444px;

  border-bottom: 1px solid #E9E9E9;

}

@media screen and (max-width: 1820px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right .top {

    gap: inherit;

  }

}

@media screen and (max-width: 1300px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right .top {

    display: none;

  }

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .top .start-top {

  display: flex;

  align-items: center;

  padding: 0 30px;

  padding-top: 18px;

  padding-bottom: 18px;

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .top .start-top p {

  color: #6E777D;

  font-weight: 600;

  font-size: 16px;

  line-height: 24px;

  font-family: var(--font-primary);

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .top .start-top .icon {

  margin-right: 10px;

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .top .start-top .icon i {

  color: var(--color-primary);

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .top .end-top {

  display: flex;

  align-items: center;

  gap: 50px;

  border-left: 1px solid #E9E9E9;

  padding-left: 50px;

  padding: 18px 0;

  padding-right: 110px;

  padding-left: 30px;

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .top .end-top .single-info {

  display: flex;

  align-items: center;

  gap: 10px;

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .top .end-top .single-info p,

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .top .end-top .single-info a {

  color: #0C0A0A;

  font-weight: 600;

  font-size: 16px;

  line-height: 24px;

  font-family: var(--font-primary);

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .top .end-top .single-info i {

  color: #0C0A0A;

  font-weight: 400;

  font-size: 16px;

  line-height: 24px;

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .nav-area {

  padding: 0 30px;

}

@media (max-width: 1024px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .nav-area {

    display: none;

  }

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .nav-area ul li {

  margin-left: 0;

  margin-right: 35px;

  margin-right: 50px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .nav-area ul li {

    margin-right: 45px;

  }

}

@media (max-width: 1200px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .nav-area ul li {

    margin-right: 35px;

  }

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .nav-area ul li a {

  padding: 0;

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .nav-area ul .has-droupdown:hover .nav-link {

  color: var(--color-primary);

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .nav-area ul .has-droupdown:hover .nav-link::before {

  color: var(--color-primary);

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .nav-area ul .has-droupdown .nav-link {

  transition: all 0.3s;

  padding: 22px 0;

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .nav-area ul .has-droupdown .nav-link::before {

  transition: all 0.4s;

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .nav-area ul li a {

  display: block;

  transition: 0.3s;

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .nav-area ul li a.nav-link {

  color: #0C0A0A;

}

@media (max-width: 1599px) and (min-width: 1024px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .nav-area ul li a {

    font-size: 14px;

  }

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .nav-area ul li a:hover {

  color: var(--color-primary);

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .right-area {

  display: flex;

  align-items: center;

  padding-right: 30px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .right-area {

    padding-right: 0;

  }

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .right-area .tmp-btn.btn-seconday {

  background: transparent;

  color: var(--color-primary);

  display: flex;

  align-items: center;

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .right-area .tmp-btn.btn-seconday::after {

  display: none;

}

@media screen and (max-width: 1300px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .right-area .tmp-btn.btn-seconday {

    display: none;

  }

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .right-area .tmp-btn.btn-seconday i {

  margin-left: 10px;

  font-size: 22px;

  font-weight: 400;

  line-height: 22px;

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .right-area .icon-area {

  display: flex;

  align-items: center;

  padding-right: 40px;

  border-right: 1px solid #E9E9E9;

  margin-right: 40px;

  padding-top: 21px;

  padding-bottom: 21px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .right-area .icon-area {

    margin-right: 0;

  }

}

@media screen and (max-width: 1300px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .right-area .icon-area {

    border: none;

  }

}

@media (max-width: 1200px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .right-area .icon-area {

    margin-right: 20px;

  }

}

@media (max-width: 576px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .right-area .icon-area {

    padding-right: 0;

  }

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .right-area .icon-area i {

  cursor: pointer;

  color: #0C0A0A;

  position: relative;

  font-size: 22px;

}

@media (max-width: 576px) {

  .heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .right-area .icon-area .cart {

    display: none;

  }

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .right-area .icon-area .cart i {

  position: relative;

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .right-area .icon-area .cart i::after {

  position: absolute;

  content: "2";

  right: -8px;

  bottom: -5px;

  height: 20px;

  width: 20px;

  background: var(--color-primary);

  border-radius: 50%;

  font-size: 10px;

  display: flex;

  align-items: center;

  justify-content: center;

  color: #fff;

}

.heder-two .header-two-container .header-main-wrapper .tmp-header-right .bottom .right-area .icon-area .search {

  margin-right: 26px;

  color: #0C0A0A;

}

.heder-two.header-six.header--sticky {

  background: #171717;

}

.brand-area-wrapper-4 {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

@media only screen and (max-width: 1199px) {

  .brand-area-wrapper-4 {

    flex-wrap: wrap;

    justify-content: center;

    gap: 40px;

  }

}

.brand-area-wrapper-4 img {

  cursor: pointer;

}

@media only screen and (max-width: 576px) {

  .brand-area-wrapper-4 img {

    width: 33%;

  }

}



.tmp-banner-four-area {

  position: relative;

  display: block;

  overflow: hidden;

  z-index: 2;

}



.banner-four-shape .img-1 {

  position: absolute;

  bottom: 0;

  left: 0;

  animation: fadeInLeftBig 1.8s;

  z-index: 0;

  height: 100%;

  pointer-events: none;

}

.banner-four-shape .img-2 {

  position: absolute;

  bottom: 0;

  left: 0;

  animation: fadeInLeftBig 0.5s;

  z-index: 0;

  height: 100%;

  pointer-events: none;

}



@media screen and (max-width: 1299px) {

  .container.container-header-7 {

    max-width: 100%;

    padding: 0;

  }

}



header.header-one .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li {

  width: 20% !important;

  margin: 0;

  position: relative;

}

header.header-one .main-nav-desk nav ul li.has-droupdown .submenu.menu-home {

  min-width: 1024px;

  justify-content: flex-start;

}



.onepage .header-seven .main-nav-desk nav ul li.menu-item a.nav-item {

  transition: all 0.3s;

  padding: 30px 10px;

  display: block;

}



.header-three {

  position: absolute;

  width: 100%;

}

.header-three .header-top {

  display: flex;

  align-items: center;

  justify-content: space-between;

  background: var(--color-white);

  border-radius: 0px 0px 4px 4px;

  padding-right: 100px;

  overflow: hidden;

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

}

@media only screen and (max-width: 1199px) {

  .header-three .header-top {

    display: none;

  }

}

.header-three .header-top .logo-area {

  max-width: 555px;

  background: var(--color-primary-2);

  width: 100%;

  clip-path: polygon(0% 0%, 99.91% 0%, 82.104% 100%, 0% 100%, 0% 0%);

}

@media (max-width: 1560px) {

  .header-three .header-top .logo-area {

    max-width: 400px;

  }

}

.header-three .header-top .logo-area a {

  margin-left: 100px;

  padding: 34px 0 45px;

  display: block;

}

@media (max-width: 1400px) {

  .header-three .header-top .logo-area a {

    margin-left: 40px;

  }

}

.header-three .header-top .contact-area {

  display: flex;

  align-items: center;

  gap: 20px;

}

.header-three .header-top .contact-area .single-component {

  display: flex;

  align-items: center;

  gap: 10px;

}

.header-three .header-top .contact-area .single-component .icon {

  width: 45px;

  height: 45px;

  line-height: 41px;

  border-radius: 50%;

  text-align: center;

  display: block;

  border: 1px solid var(--color-border);

}

.header-three .header-top .contact-area .single-component .info p {

  margin-bottom: 3px;

  line-height: 1;

  font-family: var(--font-primary);

  font-weight: 600;

  color: var(--color-heading-1);

}

.header-three .header-top .contact-area .single-component .info a:hover {

  color: var(--color-primary-2);

}

.header-three .header-top .social-wrapper {

  display: flex;

  align-items: center;

  gap: 10px;

}

.header-three .header-top .social-wrapper li a {

  display: block;

  width: 45px;

  height: 45px;

  line-height: 45px;

  border-radius: 50%;

  text-align: center;

  display: block;

  border: 1px solid var(--color-border);

  color: var(--color-primary-2);

  text-align: center;

  position: relative;

  z-index: 1;

}

.header-three .header-top .social-wrapper li a::after {

  position: absolute;

  content: "";

  height: 100%;

  width: 100%;

  background: var(--color-primary);

  transform: translate(-50%, -50%) scale(0.2);

  opacity: 0;

  left: 50%;

  top: 50%;

  transition: 0.3s;

  border-radius: 50%;

  z-index: -1;

}

.header-three .header-top .social-wrapper li a:hover {

  color: var(--color-white);

  border-color: transparent;

}

.header-three .header-top .social-wrapper li a:hover i {

  color: var(--color-white);

}

.header-three .header-top .social-wrapper li a:hover::after {

  transform: translate(-50%, -50%) scale(1);

  opacity: 1;

}

.header-three .header-main {

  background: var(--color-heading-1);

  border-radius: 4px;

  padding-left: 40px;

  margin-top: -15px;

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 1199px) {

  .header-three .header-main {

    margin-left: 0;

    padding-left: 20px;

    padding-right: 40px;

    margin-top: 0;

  }

}

.header-three .header-main .main-nav-desk nav ul li.menu-item a.nav-item,

.header-three .header-main .main-nav-desk nav ul li.has-droupdown a.nav-link {

  color: var(--color-white);

  transition: var(--transition);

  padding: 18px 0;

}

.header-three .header-main .main-nav-desk nav ul li.menu-item:hover a.nav-item,

.header-three .header-main .main-nav-desk nav ul li.menu-item:hover a.nav-link,

.header-three .header-main .main-nav-desk nav ul li.has-droupdown:hover a.nav-item,

.header-three .header-main .main-nav-desk nav ul li.has-droupdown:hover a.nav-link {

  color: var(--color-primary-2);

}

.header-three .header-main .header-mid-one-wrapper .header-right .single-component .tmp-btn {

  padding: 25px 37px;

  font-family: var(--font-primary);

  font-weight: 600;

  transition: var(--transition);

  border-radius: 0 4px 4px 0;

}

@media only screen and (max-width: 1199px) {

  .header-three .header-main .header-mid-one-wrapper .header-right .single-component .tmp-btn {

    border-radius: 4px;

    padding: 19px 34px 18px;

    height: 45px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .header-three .header-main .header-mid-one-wrapper .header-right .single-component .tmp-btn {

    height: 45px;

  }

}

.header-three .header-main .header-mid-one-wrapper .header-right .single-component .tmp-btn:hover {

  color: var(--color-heading-1);

}

.header-three .header-main .header-mid-one-wrapper .header-right .single-component .tmp-btn::after {

  background: var(--color-white);

}

@media (min-width: 1200px) {

  .header-three .header-mid-one-wrapper .logo-area {

    display: none;

  }

}

.header-three .header-mid-one-wrapper .logo-area::after {

  display: none;

}



header {

  position: relative;

  z-index: 99;

}

header.header-four .header-top {

  overflow: hidden;

  background: var(--color-primary-2);

}

header.header-four .header-top-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 6px 0 6px;

}

header.header-four .header-top-wrapper .left {

  display: flex;

  align-items: center;

  position: relative;

  padding-right: 25px;

}

header.header-four .header-top-wrapper .left .single-component {

  display: flex;

  align-items: center;

  gap: 10px;

  padding: 0 10px;

  position: relative;

  z-index: 1;

}

header.header-four .header-top-wrapper .left .single-component:first-child {

  padding-left: 0;

}

@media only screen and (max-width: 1199px) {

  header.header-four .header-top-wrapper .left .single-component:first-child {

    display: none;

  }

}

header.header-four .header-top-wrapper .left .single-component:last-child::after {

  display: none;

}

header.header-four .header-top-wrapper .left .single-component::after {

  content: "";

  position: absolute;

  background: rgba(228, 228, 228, 0.2784313725);

  width: 1px;

  height: 20px;

  top: 50%;

  right: 0;

  transform: translateY(-50%);

}

header.header-four .header-top-wrapper .left .icon {

  color: var(--color-white);

}

header.header-four .header-top-wrapper .left .icon i {

  font-size: 12px;

}

header.header-four .header-top-wrapper .left .info span {

  color: var(--color-white);

  font-size: 14px;

}

header.header-four .header-top-wrapper .left .info span a {

  color: var(--color-white);

}

header.header-four .header-top-wrapper .right {

  display: flex;

  align-items: center;

}

header.header-four .header-mid-one-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

header.header-four .header-mid-one-wrapper .logo-area {

  flex-basis: 22%;

  padding: 20px 0 21px;

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 576px) {

  header.header-four .header-mid-one-wrapper .logo-area img {

    max-width: 120px;

  }

}

header.header-four .header-mid-one-wrapper .logo-area::after {

  position: absolute;

  content: "";

  width: 100%;

  height: 108%;

  background: var(--color-primary-2);

  bottom: 0px;

  right: -10px;

  z-index: -1;

  clip-path: polygon(92% 0, 100% 0, 73% 100%, 65% 100%);

}

@media (max-width: 1900px) {

  header.header-four .header-mid-one-wrapper .logo-area::after {

    clip-path: polygon(92% 0, 101% 0, 84% 100%, 75% 100%);

  }

}

header.header-four .header-mid-one-wrapper .main-nav-desk {

  flex-basis: 58%;

  position: relative;

  z-index: 1;

  padding-left: 10px;

}

header.header-four .header-mid-one-wrapper .header-right {

  display: flex;

  align-items: center;

  flex-basis: 25%;

  gap: 25px;

  justify-content: end;

}

header.header-four .header-mid-one-wrapper .header-right .single-component {

  display: flex;

  align-items: center;

}

@media only screen and (max-width: 1199px) {

  header.header-four .header-mid-one-wrapper .header-right .single-component.info-con {

    display: none;

  }

}

header.header-four .header-mid-one-wrapper .header-right .single-component .tmp-btn {

  padding: 21px 20px 21px;

}

header.header-four .header-mid-one-wrapper .header-right .single-component .icon {

  margin-right: 15px;

}

header.header-four .header-mid-one-wrapper .header-right .single-component .icon i {

  display: block;

  width: 45px;

  height: 45px;

  background: #FFFFFF;

  box-shadow: 0px 4px 24px #DDE2EB;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

  color: #0C0A0A;

  font-weight: 500;

  font-size: 20px;

}

header.header-four .header-mid-one-wrapper .header-right .single-component .info span {

  display: block;

  font-weight: 600;

  font-size: 16px;

  line-height: 24px;

  color: #6E777D;

  font-family: var(--font-primary);

  margin-bottom: -3px;

}

header.header-four .header-mid-one-wrapper .header-right .single-component .info a {

  font-weight: 600;

  font-size: 20px;

  line-height: 30px;

  color: #0C0A0A;

  font-family: var(--font-primary);

  transition: 0.3s;

}

header.header-four .header-mid-one-wrapper .header-right .single-component .info a:hover {

  color: var(--color-primary-2);

}

header.header-four .header-mid-one-wrapper .header-right .single-component a.tmp-btn {

  display: flex;

  align-items: center;

}

@media only screen and (max-width: 576px) {

  header.header-four .header-mid-one-wrapper .header-right .single-component a.tmp-btn {

    display: none;

  }

}

header.header-four .header-mid-one-wrapper .header-right .single-component a.tmp-btn svg {

  margin-left: 6px;

  margin-top: 3px;

}

header.header-four .header-mid-one-wrapper .header-right .single-component .menu-area {

  margin-left: 20px;

}

header.header-four .header-mid-one-wrapper .header-right .single-component .menu-area .icon {

  display: flex;

  align-items: center;

  justify-content: center;

  height: 45px;

  width: 45px;

  border-radius: 50%;

  background: var(--color-primary-2);

}

@media only screen and (max-width: 767px) {

  header.header-four .header-mid-one-wrapper .header-right .single-component .menu-area .icon {

    height: 40px;

    width: 40px;

  }

}

header.header-four .header-mid-one-wrapper .header-right .single-component .menu-area svg rect {

  fill: #fff;

}

@media (min-width: 1200px) {

  header.header-four .header-mid-one-wrapper .header-right .menu-area {

    display: none !important;

  }

}



.social-wrapper-1 {

    display: flex;

    align-items: center;

    padding: 0;

    margin: 0;

    list-style: none;

    gap: 20px;

    justify-content: center;

}

.social-wrapper-1 li {

  margin: 0;

  padding: 5px;

  list-style: none;

  position: relative;

}

.social-wrapper-1 li a {

  color: var(--color-white);

  font-family: var(--font-primary);

  font-weight: 600;

  transition: 0.3s;

}

.social-wrapper-1 li a:hover {

  color: var(--color-primary);

}

.social-wrapper-1.hover-bg-white {

  gap: 0;

}

.social-wrapper-1.hover-bg-white li a {

  width: 40px;

  height: 40px;

  display: flex;

  align-items: center;

  justify-content: center;

  position: relative;

  z-index: 1;

        border: 1px solid;

    border-radius: 50%;

}

.social-wrapper-1.hover-bg-white li a::after {

  position: absolute;

  content: "";

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  z-index: -1;

  background: var(--color-white);

  transform: scale(0.5);

  opacity: 0;

  transition: 0.3s;

  border-radius: 100%;

  border: 2px solid var(--color-white);

}

.social-wrapper-1.hover-bg-white li a:hover::after {

  transform: scale(1);

  opacity: 1;

}

.social-wrapper-1.ml_-10 {

  margin-left: -10px;

}



header {

  position: relative;

  z-index: 99;

}

header.header-five .header-top {

  overflow: hidden;

  background: var(--color-primary-2);

  padding: 0 80px;

}

header.header-five .header-top-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 12px 0 11px;

}

header.header-five .header-top-wrapper .left {

  display: flex;

  align-items: center;

  position: relative;

  padding-right: 25px;

}

header.header-five .header-top-wrapper .left .single-component {

  display: flex;

  align-items: center;

  gap: 10px;

  padding: 0 10px;

  position: relative;

  z-index: 1;

}

header.header-five .header-top-wrapper .left .single-component:last-child::after {

  display: none;

}

header.header-five .header-top-wrapper .left .single-component::after {

  content: "";

  position: absolute;

  background: rgba(255, 255, 255, 0.5);

  width: 2px;

  height: 20px;

  top: 50%;

  right: 0;

  transform: translateY(-50%);

}

header.header-five .header-top-wrapper .left .icon {

  color: var(--color-white);

}

header.header-five .header-top-wrapper .left .info span {

  color: var(--color-white);

}

header.header-five .header-top-wrapper .left .info span a {

  color: var(--color-white);

}

header.header-five .header-top-wrapper .right {

  display: flex;

  align-items: center;

}

header.header-five .header-top-wrapper .right ul {

  display: flex;

  align-items: center;

  padding: 0;

  margin: 0;

  list-style: none;

  gap: 20px;

}

header.header-five .header-top-wrapper .right ul li {

  margin: 0;

  padding: 0;

  list-style: none;

  position: relative;

}

header.header-five .header-top-wrapper .right ul li a {

  color: var(--color-white);

  font-family: var(--font-primary);

  font-weight: 600;

  transition: 0.3s;

}

header.header-five .header-top-wrapper .right ul li a:hover {

  color: var(--color-primary);

}

header.header-five .header-mid-one-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 0 80px;

}

header.header-five .header-mid-one-wrapper .logo-area {

  flex-basis: 20%;

  padding: 33px 0 32px;

  position: relative;

  z-index: 1;

  overflow: hidden;

}

header.header-five .header-mid-one-wrapper .logo-area::after {

  display: none;

}

header.header-five .header-mid-one-wrapper .main-nav-desk {

  flex-basis: 58%;

  position: relative;

  z-index: 1;

  padding-left: 10px;

}

header.header-five .header-mid-one-wrapper .header-right {

  display: flex;

  align-items: center;

  flex-basis: 25%;

  gap: 30px;

  justify-content: end;

}

header.header-five .header-mid-one-wrapper .header-right .single-component {

  display: flex;

  align-items: center;

}

@media only screen and (max-width: 1199px) {

  header.header-five .header-mid-one-wrapper .header-right .single-component.info-con {

    display: none;

  }

}

header.header-five .header-mid-one-wrapper .header-right .single-component .tmp-btn {

  padding: 18px 33px 17px;

}

header.header-five .header-mid-one-wrapper .header-right .single-component .icon {

  margin-right: 15px;

}

header.header-five .header-mid-one-wrapper .header-right .single-component .icon i {

  display: block;

  width: 45px;

  height: 45px;

  background: #FFFFFF;

  box-shadow: 0px 4px 24px #DDE2EB;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

  color: #0C0A0A;

  font-weight: 500;

  font-size: 20px;

}

header.header-five .header-mid-one-wrapper .header-right .single-component .info span {

  display: block;

  font-weight: 600;

  font-size: 16px;

  line-height: 24px;

  color: #6E777D;

  font-family: var(--font-primary);

  margin-bottom: -3px;

}

header.header-five .header-mid-one-wrapper .header-right .single-component .info a {

  font-weight: 600;

  font-size: 20px;

  line-height: 30px;

  color: #0C0A0A;

  font-family: var(--font-primary);

  transition: 0.3s;

}

header.header-five .header-mid-one-wrapper .header-right .single-component .info a:hover {

  color: var(--color-primary-2);

}

header.header-five .header-mid-one-wrapper .header-right .single-component a.tmp-btn {

  display: flex;

  align-items: center;

}

@media only screen and (max-width: 576px) {

  header.header-five .header-mid-one-wrapper .header-right .single-component a.tmp-btn {

    display: none;

  }

}

header.header-five .header-mid-one-wrapper .header-right .single-component a.tmp-btn svg {

  margin-left: 6px;

  margin-top: 3px;

}

header.header-five .header-mid-one-wrapper .header-right .single-component .menu-area {

  margin-left: 20px;

}

header.header-five .header-mid-one-wrapper .header-right .single-component .menu-area .icon {

  display: flex;

  align-items: center;

  justify-content: center;

  height: 50px;

  width: 50px;

  background: var(--color-primary-2);

  border-radius: 2px;

}

header.header-five .header-mid-one-wrapper .header-right .single-component .menu-area svg rect {

  fill: #fff;

}

header.header-five .header-mid-one-wrapper.wrapper-two .header-right .single-component .tmp-btn {

  border-radius: 30px;

}

header.header-five .header-main-2::after {

  display: none;

}

header.header-five .cart-search-area {

  display: flex;

  align-items: center;

  gap: 25px;

}

header.header-five .cart-search-area a {

  display: block;

}

header.header-five .header-main-2 .header-mid-one-wrapper .logo-area::before {

  display: none;

}

header.header-seven .header-top {

  overflow: hidden;

  background: var(--color-primary-2);

  padding: 0 80px;

}

header.header-seven .header-top-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 6px 0 6px;

}

header.header-seven .header-top-wrapper .left {

  display: flex;

  align-items: center;

  position: relative;

  padding-right: 25px;

}

header.header-seven .header-top-wrapper .left .single-component {

  display: flex;

  align-items: center;

  gap: 10px;

  padding: 0 20px;

  position: relative;

  z-index: 1;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  header.header-seven .header-top-wrapper .left .single-component {

    padding: 0 10px;

  }

}

@media only screen and (max-width: 1199px) {

  header.header-seven .header-top-wrapper .left .single-component {

    padding: 0 10px;

  }

}

header.header-seven .header-top-wrapper .left .single-component:first-child {

  padding-left: 0;

}

@media only screen and (max-width: 1199px) {

  header.header-seven .header-top-wrapper .left .single-component:first-child {



  }

}

header.header-seven .header-top-wrapper .left .single-component:last-child::after {

  display: none;

}

header.header-seven .header-top-wrapper .left .single-component::after {

  content: "";

  position: absolute;

  background: rgba(255, 255, 255, 0.35);

  width: 1px;

  height: 17px;

  top: 50%;

  right: 0;

  transform: translateY(-50%);

}

header.header-seven .header-top-wrapper .left .icon {

  color: var(--color-white);

}

header.header-seven .header-top-wrapper .left .icon i {

  font-size: 14px;

}

header.header-seven .header-top-wrapper .left .info span {

  color: var(--color-white);

  font-size: 14px;

  font-weight: 600;

}

@media only screen and (max-width: 1199px) {

  header.header-seven .header-top-wrapper .left .info span {

    font-size: 14px;

  }

}

header.header-seven .header-top-wrapper .left .info span a {

  color: var(--color-white);

}

header.header-seven .header-top-wrapper .right {

  display: flex;

  align-items: center;

}

header.header-seven .header-mid-one-wrapper {

  align-items: center;

  justify-content: space-between;

  padding: 0 0px;

}

header.header-seven .header-mid-one-wrapper .left .menu {

  margin-left: 100px;

}

header.header-seven .header-mid-one-wrapper .logo-area {

  flex-basis: 20%;

  padding: 9px 0 3px;

  position: relative;

  z-index: 1;

  overflow: hidden;

}

@media only screen and (max-width: 1199px) {

  header.header-seven .header-mid-one-wrapper .logo-area {

    flex-basis: 100%;

  }

}

@media only screen and (max-width: 576px) {

  header.header-seven .header-mid-one-wrapper .logo-area {

    padding: 10px 0 10px;

  }

}

header.header-seven .header-mid-one-wrapper .logo-area::after {

  display: none;

}

header.header-seven .header-mid-one-wrapper .logo-area a img{

    width: 84px;

}

header.header-seven .header-mid-one-wrapper .main-nav-desk {

  flex-basis: 58%;

  position: relative;

  z-index: 1;

  padding-left: 10px;

}

header.header-seven .header-mid-one-wrapper .header-right {

  display: flex;

  align-items: center;

  flex-basis: 25%;

  gap: 30px;

  justify-content: end;

}

header.header-seven .header-mid-one-wrapper .header-right .single-component {

  display: flex;

  align-items: center;

}

@media only screen and (max-width: 1199px) {

  header.header-seven .header-mid-one-wrapper .header-right .single-component.info-con {

    display: none;

  }

}

header.header-seven .header-mid-one-wrapper .header-right .single-component .icon {

  margin-right: 15px;

}

header.header-seven .header-mid-one-wrapper .header-right .single-component .icon i {

  display: block;

  width: 45px;

  height: 45px;

  background: #FFFFFF;

  box-shadow: 0px 4px 24px #DDE2EB;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

  color: #0C0A0A;

  font-weight: 500;

  font-size: 20px;

}

header.header-seven .header-mid-one-wrapper .header-right .single-component .info span {

  display: block;

  font-weight: 600;

  font-size: 16px;

  line-height: 24px;

  color: #6E777D;

  font-family: var(--font-primary);

  margin-bottom: -3px;

}

header.header-seven .header-mid-one-wrapper .header-right .single-component .info a {

  font-weight: 600;

  font-size: 20px;

  line-height: 30px;

  color: #0C0A0A;

  font-family: var(--font-primary);

  transition: 0.3s;

}

header.header-seven .header-mid-one-wrapper .header-right .single-component .info a:hover {

  color: var(--color-primary-2);

}

header.header-seven .header-mid-one-wrapper .header-right .single-component a.tmp-btn {

  display: flex;

  align-items: center;

}

@media only screen and (max-width: 576px) {

  header.header-seven .header-mid-one-wrapper .header-right .single-component a.tmp-btn {

    display: none;

  }

}

header.header-seven .header-mid-one-wrapper .header-right .single-component a.tmp-btn svg {

  margin-left: 6px;

  margin-top: 3px;

}

header.header-seven .header-mid-one-wrapper .header-right .single-component .menu-area {

  margin-left: 20px;

}

header.header-seven .header-mid-one-wrapper .header-right .single-component .menu-area .icon {

  display: flex;

  align-items: center;

  justify-content: center;

  height: 50px;

  width: 50px;

  background: var(--color-primary-2);

  border-radius: 50% !important;

}

@media only screen and (max-width: 1199px) {

  header.header-seven .header-mid-one-wrapper .header-right .single-component .menu-area .icon {

    height: 45px;

    width: 45px;

  }

}

@media only screen and (max-width: 767px) {

  header.header-seven .header-mid-one-wrapper .header-right .single-component .menu-area .icon {

    height: 40px;

    width: 40px;

  }

}

header.header-seven .header-mid-one-wrapper .header-right .single-component .menu-area svg rect {

  fill: #fff;

}

header.header-seven .header-main-2::after {

  display: none;

}

header.header-seven .cart-search-area {

  display: flex;

  align-items: center;

  gap: 25px;

}

header.header-seven .cart-search-area a {

  display: block;

}

header.header-seven.inner {

  box-shadow: 0px 20px 34px rgba(0, 0, 0, 0.0509803922);

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  header.header-seven.inner .header-mid-one-wrapper .nav-area {

    margin-left: 30px;

  }

}

@media only screen and (max-width: 1199px) {

  header.header-seven.inner .header-mid-one-wrapper .header-right {

    flex-basis: 40% !important;

  }

}

header.header-seven.inner .bg_header-top-inner .header-top-main {

  padding: 0 80px;

}

header.header-seven.inner .bg_header-top-inner .header-top-main * {

  font-size: 14px;

}

header.header-seven.inner.sticky .bg_header-top-inner {

  display: none;

}



@media only screen and (max-width: 991px) {

  body.home-inner .header-mid-one-wrapper .logo-area {

    flex-basis: 49% !important;

  }

}



header {

  position: relative;

  z-index: 99;

}

header.header-six {

  box-shadow: none;

}

header.header-six .header-top {

  overflow: hidden;

  background: var(--color-primary-2);

}

header.header-six .header-mid-area {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 20px 0;

}

header.header-six .header-mid-area .left {

  display: flex;

  align-items: center;

  gap: 10px;

}

@media only screen and (max-width: 576px) {

  header.header-six .header-mid-area .left .logo-area a img {

    max-width: 120px;

  }

}

header.header-six .header-mid-area .left .search-area {

  max-width: max-content;

  position: relative;

  z-index: 1;

}

header.header-six .header-mid-area .left .search-area form {

  width: 666px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  header.header-six .header-mid-area .left .search-area form {

    width: 500px;

  }

}

header.header-six .header-mid-area .left .search-area input {

  width: 100%;

  padding: 10px 120px 10px 20px;

  background: #F6F6F6;

  border-radius: 33px;

  color: var(--color-heading-1);

  border: 2px solid transparent;

}

header.header-six .header-mid-area .left .search-area input:focus {

  border: 2px solid var(--color-primary);

}

header.header-six .header-mid-area .left .search-area button {

  position: absolute;

  top: 50%;

  right: 10px;

  transform: translateY(-50%);

  z-index: 1;

  padding: 12px 13px;

  border: none;

  height: auto;

  gap: 7px;

}

header.header-six .header-mid-area .right {

  display: flex;

  align-items: center;

  gap: 20px;

}

header.header-six .header-mid-area .right a {

  color: var(--color-heading-1);

  gap: 14px;

  height: 45px;

  width: 45px;

  display: flex;

  align-items: center;

  justify-content: center;

  background: #f1f1f1;

  border-radius: 50%;

  position: relative;

  z-index: 1;

}

header.header-six .header-mid-area .right a::after {

  position: absolute;

  left: 50%;

  top: 50%;

  height: 100%;

  width: 100%;

  background: var(--color-primary);

  transform: translate(-50%, -50%) scale(0.2);

  content: "";

  transition: 0.3s;

  z-index: -1;

  border-radius: 50%;

  opacity: 0;

  transition: 0.3s;

}

header.header-six .header-mid-area .right a:hover::after {

  transform: scale(1) translate(-50%, -50%);

  opacity: 1;

}

header.header-six .header-mid-area .right a:hover .icon img {

  filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(3570%) hue-rotate(215deg) brightness(117%) contrast(100%);

}

header.header-six .header-mid-area .right a:hover .icon::after {

  color: var(--color-heading-1);

  background: var(--color-white);

}

header.header-six .header-mid-area .right a.search-btn {

  display: none;

}

header.header-six .header-mid-area .right a .icon {

  position: relative;

  z-index: 1;

}

header.header-six .header-mid-area .right a .icon::after {

  position: absolute;

  content: "2";

  z-index: 1;

  background: var(--color-primary-2);

  font-size: 10px;

  width: 16px;

  height: 16px;

  line-height: 16px;

  color: var(--color-white);

  border-radius: 50%;

  text-align: center;

  display: block;

  top: -2px;

  right: -9px;

}

header.header-six .header-top-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 12px 0 11px;

}

header.header-six .header-top-wrapper .left {

  display: flex;

  align-items: center;

  position: relative;

  gap: 40px;

}

header.header-six .header-top-wrapper .left .desc {

  color: var(--color-white);

  margin-bottom: 0;

  font-size: 14px;

  line-height: 1;

}

header.header-six .header-top-wrapper .left .countDown {

  display: flex;

  align-items: center;

  gap: 10px;

  position: unset;

  transform: none;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  header.header-six .header-top-wrapper .left .countDown {

    display: none;

  }

}

@media only screen and (max-width: 1199px) {

  header.header-six .header-top-wrapper .left .countDown {

    display: none;

  }

}

header.header-six .header-top-wrapper .left .countDown .container {

  position: relative;

  z-index: 1;

  font-size: 18px;

  font-weight: 700;

  font-family: var(--font-primary);

  color: var(--color-white);

  display: flex;

  align-items: center;

  gap: 2px;

  padding: 0 !important;

  background: transparent;

}

header.header-six .header-top-wrapper .left .countDown .container .a {

  color: var(--color-white);

  font-weight: 700;

}

header.header-six .header-top-wrapper .left .countDown .container::after {

  content: "";

  position: relative;

  color: rgba(255, 255, 255, 0.6);

  font-size: 14px;

  font-weight: 600;

  font-family: var(--font-secondary);

  line-height: 1;

  top: 0;

  right: 0;

}

header.header-six .header-top-wrapper .left .countDown .container:nth-child(1)::after {

  content: "days";

}

header.header-six .header-top-wrapper .left .countDown .container:nth-child(2)::after {

  content: "hours";

}

header.header-six .header-top-wrapper .left .countDown .container:nth-child(3)::after {

  content: "minute";

}

header.header-six .header-top-wrapper .left .countDown .container:nth-child(4)::after {

  content: "second";

}

header.header-six .header-top-wrapper .right .contact {

  color: var(--color-white);

}

@media only screen and (max-width: 991px) {

  header.header-six .header-top-wrapper .right .contact {

    display: none;

  }

}

header.header-six .header-top-wrapper .right .contact a:hover {

  color: #fff;

}

header.header-six .header-mid-one-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 0;

}

header.header-six .header-mid-one-wrapper .logo-area {

  flex-basis: 20%;

  padding: 33px 0 32px;

  position: relative;

  z-index: 1;

  overflow: hidden;

}

header.header-six .header-mid-one-wrapper .logo-area::after {

  display: none;

}

header.header-six .header-mid-one-wrapper .main-nav-desk {

  flex-basis: 58%;

  position: relative;

  z-index: 1;

  padding-left: 10px;

}

header.header-six .header-mid-one-wrapper .header-right {

  display: flex;

  align-items: center;

  flex-basis: 42%;

  gap: 30px;

  justify-content: end;

}

header.header-six .header-mid-one-wrapper .header-right .single-component {

  display: flex;

  align-items: center;

}

@media only screen and (max-width: 1199px) {

  header.header-six .header-mid-one-wrapper .header-right .single-component.info-con {

    display: none;

  }

}

header.header-six .header-mid-one-wrapper .header-right .single-component .tmp-btn {

  padding: 18px 33px 17px;

}

header.header-six .header-mid-one-wrapper .header-right .single-component .icon {

  margin-right: 15px;

}

header.header-six .header-mid-one-wrapper .header-right .single-component .icon i {

  display: block;

  width: 45px;

  height: 45px;

  background: #FFFFFF;

  box-shadow: 0px 4px 24px #DDE2EB;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

  color: #0C0A0A;

  font-weight: 500;

  font-size: 20px;

}

header.header-six .header-mid-one-wrapper .header-right .single-component .info span {

  display: block;

  font-weight: 600;

  font-size: 16px;

  line-height: 24px;

  color: #6E777D;

  font-family: var(--font-primary);

  margin-bottom: -3px;

}

header.header-six .header-mid-one-wrapper .header-right .single-component .info a {

  font-weight: 600;

  font-size: 20px;

  line-height: 30px;

  color: #0C0A0A;

  font-family: var(--font-primary);

  transition: 0.3s;

}

header.header-six .header-mid-one-wrapper .header-right .single-component .info a:hover {

  color: var(--color-primary-2);

}

header.header-six .header-mid-one-wrapper .header-right .single-component a.tmp-btn {

  display: flex;

  align-items: center;

}

@media only screen and (max-width: 576px) {

  header.header-six .header-mid-one-wrapper .header-right .single-component a.tmp-btn {

    display: none;

  }

}

header.header-six .header-mid-one-wrapper .header-right .single-component a.tmp-btn svg {

  margin-left: 6px;

  margin-top: 3px;

}

header.header-six .header-mid-one-wrapper .header-right .single-component .menu-area {

  margin-left: 20px;

}

header.header-six .header-mid-one-wrapper .header-right .single-component .menu-area .icon {

  display: flex;

  align-items: center;

  justify-content: center;

  height: 50px;

  width: 50px;

  background: var(--color-primary-2);

  border-radius: 2px;

}

header.header-six .header-mid-one-wrapper .header-right .single-component .menu-area svg rect {

  fill: #fff;

}

header.header-six .header-mid-one-wrapper.wrapper-two .header-right .single-component .tmp-btn {

  border-radius: 30px;

}

header.header-six .header-main-2 {

  background: #F6F6F6;

}

header.header-six .header-main-2::after {

  display: none;

}

header.header-six .header-main-2 .main-nav-desk nav ul li.has-droupdown a.nav-link {

  padding: 20px 0;

}

header.header-six .header-main-2 .header-right .tag {

  color: var(--color-heading-1);

  font-weight: 600;

}

header.header-six .header-main-2 .header-right .tag:last-child {

  background: var(--color-primary-2);

  padding: 20px 25px 18px;

  color: var(--color-white);

  display: flex;

  align-items: center;

  gap: 25px;

}

header.header-six .header-main-2 .header-right .tag:last-child span {

  background: var(--color-white);

  color: var(--color-primary-2);

  padding: 5px 10px;

  line-height: 1;

  font-weight: 12px;

  border-radius: 20px;

}

header.header-six .cart-search-area {

  display: flex;

  align-items: center;

  gap: 25px;

}

header.header-six .cart-search-area a {

  display: block;

}

header.header-six .nav-area ul li.main-nav {

  padding: 20px 20px 20px 0;

}

header.header-three .header-mid-one-wrapper .header-right {

  flex-basis: 30%;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  header.header-three .header-mid-one-wrapper .header-right {

    flex-basis: 40%;

  }

}



.logo-area.shape-none::before {

  display: none !important;

}



.header--sticky.sticky {

  position: fixed !important;

  top: 0;

  display: block;

  z-index: 50;

  width: 100%;

  background: #fff;

  box-shadow: 0px 7px 18px rgba(24, 16, 16, 0.0509803922);

  animation: headerSticky 0.75s ease forwards;

}

.header--sticky.sticky .header-top {

  display: none;

}

.header--sticky.sticky.header-six .header-mid-area {

  display: none;

}

.header--sticky.sticky.header-one {

  background: #fff;

}

.header--sticky.sticky.header-three {

  background: transparent;

  box-shadow: none;

}

.header--sticky.sticky.header-three .header-main {

  margin-top: 0;

}



@keyframes headerSticky {

  0% {

    transform: translateY(-100%);

  }

  100% {

    transform: translateY(0);

  }

}

.modal-backdrop.show {

  opacity: 1;

}



.modal-backdrop {

  background: rgba(0, 0, 0, 0.8);

  backdrop-filter: blur(15px);

}



.bg_header-top-inner {

  background: var(--color-heading-1);

}

@media only screen and (max-width: 576px) {

  .bg_header-top-inner {

    display: none;

  }

}



@media only screen and (max-width: 991px) {

  header.header-seven.inner .bg_header-top-inner .header-top-main .social-wrapper-1 {

    display: none;

  }

}



header.header-center-short.header-seven {

  position: absolute;

  left: 50%;

  transform: translateX(-50%);

  width: 100%;

  box-shadow: none;

  background: transparent;

}

header.header-center-short.header-seven.in-parallax-banner {

  margin-top: 30px;

}

@media only screen and (max-width: 576px) {

  header.header-center-short.header-seven.in-parallax-banner {

    margin-top: 0;

  }

}

header.header-center-short.header-seven.in-parallax-banner.sticky {

  margin-top: 0;

}

header.header-center-short.header-seven.in-parallax-banner.narrow .header-mid-one-wrapper {

  border-radius: 11px;

}

@media only screen and (max-width: 576px) {

  header.header-center-short.header-seven.in-parallax-banner.header-inner-pages {

    margin-top: 10px;

  }

  header.header-center-short.header-seven.in-parallax-banner.header-inner-pages .container-full-header-tranaparent {

    margin: 0 20px;

  }

}

@media only screen and (max-width: 991px) {

  header.header-center-short.header-seven.in-parallax-banner.header-inner-pages .header-mid-one-wrapper .logo-area {

    flex-basis: 100% !important;

  }

}

header.header-center-short.header-seven.in-parallax-banner .tmp-mega-menu.with-home-demos, header.header-center-short.header-seven.in-parallax-banner .tmp-mega-menu.inner-page-mega {

  width: 80% !important;

  left: 50%;

  transform: translateX(-50%) scaleY(1) !important;

}

header.header-center-short.header-seven.with-shadow-nad-top-dark .header-top {

  padding: 0 0;

  background: var(--color-white);

}

header.header-center-short.header-seven.with-shadow-nad-top-dark .header-top .header-top-wrapper {

  padding: 10px 0 10px;

}

header.header-center-short.header-seven.with-shadow-nad-top-dark .header-top * {

  color: var(--color-body) !important;

}

header.header-center-short.header-seven.with-shadow-nad-top-dark .header-mid-one-wrapper {

  box-shadow: var(--shadow-1);

}

header.header-center-short.header-seven.with-shadow-nad-top-dark .header-mid-one-wrapper .logo-area {

  padding: 19px 0 19px;

}

header.header-center-short.header-seven.with-shadow-nad-top-dark .header-mid-one-wrapper {

  padding: 0 40px;

}

header.header-center-short.header-seven.narrow .header-mid-one-wrapper {

  top: 10px;

  border-radius: 6px;

  padding: 0 25px;

}

header.header-center-short.header-seven .header-mid-one-wrapper {

  background: var(--color-white);

  border-radius: 0 0 6px 6px;

}

header.header-center-short.header-seven.sticky {

  left: auto;

  transform: translateX(-50%);

}

header.header-center-short.header-seven.sticky .header-mid-one-wrapper {

  border-radius: 6px;

  top: 10px;

  box-shadow: var(--shadow-1);

}

@media only screen and (max-width: 991px) {

  header.header-center-short.header-seven .header-top {

    display: none;

  }

}



.container-full-header-tranaparent {

  margin: 0 40px;

}

@media only screen and (max-width: 576px) {

  .container-full-header-tranaparent {

    margin: 0px 10px;

  }

}



.main-nav-desk nav ul li.has-droupdown {

  position: relative;

}

.main-nav-desk nav ul li.has-droupdown a.nav-link {

  position: relative;

  transition: all 0.3s;

  padding: 38px 0;

  font-family: var(--font-primary);

}

.main-nav-desk nav ul li.has-droupdown:hover .submenu {

  opacity: 1;

  visibility: visible;

  top: 100%;

  transform: scaleY(1);

}

.main-nav-desk nav ul li.has-droupdown:hover a.nav-link {

  color: var(--color-primary);

}

.main-nav-desk nav ul li.has-droupdown .submenu {

  position: absolute;

  min-width: 100%;

  height: auto;

  position: absolute;

  top: 100%;

  transform: scaleY(0);

  left: 0;

  z-index: 90;

  opacity: 0;

  visibility: hidden;

  text-align: left;

  transition: all 0.3s;

  border-radius: 0 0 10px 10px;

  background-color: var(--color-white);

  border-left: 1px solid rgba(255, 255, 255, 0.0784313725);

  border-bottom: 1px solid rgba(255, 255, 255, 0.0784313725);

  border-right: 1px solid rgba(255, 255, 255, 0.0784313725);

  display: inline-block;

  box-shadow: 0 36px 35px rgba(0, 0, 0, 0.08);

  display: flex;

  align-items: center;

  gap: unset;

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home {

  flex-wrap: wrap;

  min-width: 1276px;

  justify-content: center;

  margin-left: 0;

  margin-top: -1px;

  padding: 25px;

  border-radius: 0;

  margin: auto;

}

@media (max-width: 1400px) and (min-width: 1200px) {

  .main-nav-desk nav ul li.has-droupdown .submenu.menu-home {

    min-width: 1085px;

  }

}

@media (max-width: 1199px) and (min-width: 991px) {

  .main-nav-desk nav ul li.has-droupdown .submenu.menu-home {

    min-width: 900px !important;

  }

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home li {

  width: 16% !important;

  margin: 0;

  position: relative;

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home li:hover .page {

  opacity: 1;

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home li:hover .page li a {

  color: #fff !important;

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home li:hover::after {

  opacity: 1;

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home li a {

  padding: 30px 15px;

  position: relative;

  transition: 0.3s;

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home li a:hover {

  color: var(--color-primary) !important;

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home li a img {

  margin-bottom: 25px;

  width: 100%;

  transition: 0.33s;

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home li a span {

  transition: 0.3s;

  text-transform: capitalize;

  letter-spacing: 0;

  font-size: 14px;

  font-weight: 600;

  left: 50%;

  position: absolute;

  bottom: 15px;

  transform: translateX(-50%);

  z-index: 1;

  min-width: max-content;

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home li a:hover img {

  transform: translateY(-5px);

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home li a:hover span {

  color: var(--color-primary);

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home li .page {

  display: block;

  position: absolute;

  bottom: 50%;

  right: 50%;

  transform: translate(50%, 50%);

  opacity: 0;

  transition: all 0.3s;

  z-index: 1;

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home li .page li {

  width: 100% !important;

  text-align: center;

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home li .page li::after {

  display: none;

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home li .page li a.tmp-btn {

  margin: 0 auto 10px auto;

  padding: 5px 15px !important;

  width: 100%;

  max-width: 100%;

  border-radius: 0;

  font-size: 10px;

  line-height: 20px;

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home li .page li a.tmp-btn:focus {

  box-shadow: none;

}

.main-nav-desk nav ul li.has-droupdown .submenu.menu-home li::after {

  content: "";

  position: absolute;

  background: rgba(0, 0, 0, 0.8);

  opacity: 0;

  width: 100%;

  height: 100%;

  transition: all 0.3s;

  top: 0;

}

.main-nav-desk nav ul li.has-droupdown .submenu.inner-page {

  flex-direction: column;

  min-width: 200px;

  justify-content: flex-start;

  padding-left: 0;

  margin-left: 0;

  align-items: flex-start;

  margin-top: -1px;

  padding: 15px;

  border-radius: 0;

  width: max-content;

}

.main-nav-desk nav ul li.has-droupdown .submenu.inner-page li {

  width: 100%;

  text-align: left;

}

.main-nav-desk nav ul li.has-droupdown .submenu.inner-page li a {

  text-align: left;

  padding: 3px 5px;

  margin: 4px 0;

  transition: 0.3s;

  font-size: 16px;

  text-transform: capitalize;

  font-family: var(--font-secondary);

  letter-spacing: 0;

  font-weight: 500;

  min-width: max-content;

}

.main-nav-desk nav ul li.has-droupdown .submenu.inner-page li a:hover {

  color: var(--color-primary) !important;

}

.main-nav-desk nav ul li.menu-item {

  transition: all 0.3s;

}

.main-nav-desk nav ul li.menu-item a.nav-item {

  transition: all 0.3s;

  padding: 38px 0;

}

.main-nav-desk nav ul li.menu-item:hover a.nav-item {

  color: var(--color-primary);

}



.header-one .has-droupdown .submenu.menu-home li a {

  padding: 15px 15px !important;

}

.header-one .has-droupdown .submenu.menu-home li.last {

  cursor: not-allowed;

}

.header-one .has-droupdown .submenu.menu-home li.last::after {

  background: #000000;

  opacity: 0.9;

}

.header-one .has-droupdown .submenu.menu-home li.last img {

  filter: blur(2px);

}

.header-one .has-droupdown .submenu.menu-home li.last .tmp-btn {

  display: none;

}

.header-one .has-droupdown .submenu.menu-home li.last a span {

  bottom: 50% !important;

  right: 50%;

  left: unset !important;

  transform: translate(50%, 50%);

  cursor: not-allowed;

}

.header-one .has-droupdown .submenu.menu-home li.last a span:hover {

  color: #fff;

}



.header-one .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li a {

  padding: 5px 15px;

  position: relative;

  transition: 0.3s;

}



.header-one .main-nav-desk nav ul li.has-droupdown .submenu.inner-page {

  padding: 15px 5px;

}



header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.inner-page li {

  padding: 7px 0;

}

header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.inner-page li a {

  padding: 0px 15px;

  margin: 0px 0;

}



.onepage ul li.current a {

  color: var(--color-primary) !important;

}



.home-one.onepage ul li.current a {

  color: #0C0A0A !important;

}



.header-one .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li a span {

  bottom: 15px;

}



header.header-seven .main-nav-desk nav ul li.has-droupdown .submenu.menu-home {

  min-width: 1024px;

  margin-left: -202px;

  margin-top: 0;

  justify-content: flex-start;

  padding-bottom: 5px;

}

header.header-seven .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li {

  width: 20% !important;

  padding: 0 10px;

  margin-bottom: 10px;

}

header.header-seven .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li a {

  padding: 0;

  display: block;

}

header.header-seven .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li a span {

  bottom: -3px;

}

header.header-seven .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li .page li {

  width: 100% !important;

}

header.header-seven .main-nav-desk nav ul li.has-droupdown .submenu.inner-page {

  margin-top: 0;

}

header.header-seven .main-nav-desk nav ul li.has-droupdown .submenu.inner-page li {

  padding: 4px 0;

}

header.header-seven .main-nav-desk nav ul li.has-droupdown .submenu.inner-page li.sub-dropdown {

  position: relative;

  display: block;

}

header.header-seven .main-nav-desk nav ul li.has-droupdown .submenu.inner-page li.sub-dropdown::after {

  position: absolute;

  content: "\f054";

  font-family: "Fontawesome";

  font-size: 14px;

  font-weight: 300;

  right: 10px;

  color: #fff;

}

header.header-seven .main-nav-desk nav ul li.has-droupdown .submenu.inner-page li.sub-dropdown ul li {

  padding: 0 !important;

}



header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li {

  width: 24% !important;

  margin: 0;

  position: relative;

  padding: 10px 9px;

}

header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li.last {

  cursor: not-allowed;

}

header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li.last::after {

  background: #000000;

  opacity: 0.9;

}

header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li.last img {

  filter: blur(2px);

}

header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li.last .tmp-btn {

  display: none !important;

}

header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li.last a span {

  bottom: 50% !important;

  right: 50%;

  left: unset !important;

  transform: translate(50%, 50%);

  cursor: not-allowed;

}

header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li.last a span:hover {

  color: #fff;

}

header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.menu-home {

  flex-wrap: wrap;

  min-width: 1276px;

  justify-content: center;

  margin-left: 0;

  margin-top: -1px;

  padding: 25px;

  border-radius: 0;

  margin: auto;

  justify-content: flex-start !important;

}

header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li {

  width: 20% !important;

  margin: 0;

  position: relative;

  padding: 10px 9px;

}

header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li ul li {

  width: 100% !important;

  padding: 0 !important;

}

header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li ul li.last {

  cursor: not-allowed;

}

header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li ul li.last::after {

  background: #000000;

  opacity: 0.9;

}

header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li ul li.last img {

  filter: blur(2px);

}

header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li ul li.last .tmp-btn {

  display: none;

}

header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li ul li.last a span {

  bottom: 50% !important;

  right: 50%;

  left: unset !important;

  transform: translate(50%, 50%);

  cursor: not-allowed;

}

header.header-three .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li ul li.last a span:hover {

  color: #fff;

}



header.heder-two .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li {

  width: 20% !important;

  margin: 0;

  position: relative;

}

header.heder-two .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li ul li {

  width: 100% !important;

  padding: 0;

}

header.heder-two .main-nav-desk nav ul li.has-droupdown .submenu.menu-home {

  justify-content: flex-start;

}

header.heder-two .main-nav-desk nav ul li.has-droupdown .submenu.menu-home li a span {

  bottom: 0 !important;

}



.demo-shop .tmp-mega-menu.with-home-demos .demos-area-drop-down .mega-menu-item {

  row-gap: 36px;

}



.new-badge-round {

  position: absolute;

  top: -9px;

  right: -9px;

  height: 35px;

  width: 35px;

  background: var(--color-primary);

  color: var(--color-white);

  font-size: 12px;

  font-weight: 500;

  margin-bottom: 0;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

}



.mobile-menu nav ul {

  padding: 0 0;

}

.mobile-menu nav ul li {

  margin: 0;

  padding: 0;

}

.mobile-menu nav ul li a.main {

  padding: 10px 0;

  border-bottom: 1px dashed var(--color-border);

  cursor: pointer;

}

.mobile-menu nav ul li.has-droupdown {

  position: relative;

}

.mobile-menu nav ul li.has-droupdown .submenu {

  padding-left: 14px;

}

.mobile-menu nav ul li.has-droupdown ul a.tag {

  font-weight: 700;

  margin-top: 15px;

  font-size: 18px;

}

.mobile-menu nav ul li.has-droupdown ul li {

  padding: 10px 0 !important;

  border-bottom: 1px dashed var(--color-border);

}

.mobile-menu nav ul li.has-droupdown ul li:last-child {

  border-bottom: none;

}

.mobile-menu nav ul li.has-droupdown > a {

  position: relative;

}

.mobile-menu nav ul li.has-droupdown > a::after {

  position: absolute;

  content: "\f107";

  font-family: "Fontawesome" !important;

  font-size: 16px;

  right: 0;

  font-weight: 400;

  top: 50%;

  transform: translateY(-50%);

  color: var(--color-body);

  pointer-events: none;

  cursor: pointer;

}

.mobile-menu nav ul li.has-droupdown.mm-active > a::after {

  content: "\f106";

}

.mobile-menu nav ul li.has-droupdown.third-lvl > a {

  padding: 0 0 10px 0;

}

.mobile-menu nav ul li.has-droupdown.third-lvl::after {

  font-size: 10px;

  padding: 3px 10px;

}

.mobile-menu nav ul li.has-droupdown.third-lvl ul {

  padding: 0 20px;

}

.mobile-menu nav ul li.has-droupdown.third-lvl ul li {

  margin: 0 0 !important;

  position: relative;

  z-index: 1;

  transition: all 0.3s;

}

.mobile-menu nav ul li.has-droupdown.third-lvl ul li:hover {

  color: var(--color-primary);

}

.mobile-menu nav ul li.has-droupdown.third-lvl ul li a {

  position: relative;

  width: 100%;

  height: 100%;

  transition: all 0.3s;

}

.mobile-menu nav ul li a {

  display: block;

}

.mobile-menu .social-wrapper-one {

  margin-top: 50px;

}



@media screen and (max-width: 1024px) {

  .side-bar.header-two .inner-main-wrapper-desk, .side-bar.header-three .inner-main-wrapper-desk {

    display: none;

  }

}

@media screen and (min-width: 1024px) {

  .side-bar.header-two .mobile-menu, .side-bar.header-three .mobile-menu {

    display: none !important;

  }

}



.header-one .main-nav-desk nav ul li.has-droupdown .submenu.inner-page .sub-dropdown {

  position: relative;

}

.header-one .main-nav-desk nav ul li.has-droupdown .submenu.inner-page .sub-dropdown:hover::after {

  color: var(--color-primary);

}

.header-one .main-nav-desk nav ul li.has-droupdown .submenu.inner-page .sub-dropdown::after {

  position: absolute;

  content: "\f105";

  font-family: "Font Awesome 6 Pro" !important;

  font-size: 16px;

  right: 25px;

  top: 50%;

  transform: translateY(-50%);

  color: #fff;

}

.header-one .main-nav-desk nav ul li.has-droupdown .submenu.inner-page .sub-dropdown .third-lvl {

  margin-left: -4px;

}



.header-three .main-nav-desk nav ul li.has-droupdown .submenu.inner-page {

  padding: 15px 0;

}

.header-three .main-nav-desk nav ul li.has-droupdown .submenu.inner-page .sub-dropdown {

  position: relative;

}

.header-three .main-nav-desk nav ul li.has-droupdown .submenu.inner-page .sub-dropdown:hover::after {

  color: var(--color-primary);

}

.header-three .main-nav-desk nav ul li.has-droupdown .submenu.inner-page .sub-dropdown::after {

  position: absolute;

  content: "\f105";

  font-family: "Font Awesome 6 Pro" !important;

  font-size: 16px;

  right: 25px;

  top: 50%;

  transform: translateY(-50%);

  color: #fff;

}

.header-three .main-nav-desk nav ul li.has-droupdown .submenu.inner-page .sub-dropdown .third-lvl {

  margin-left: -4px;

}

.header-three .main-nav-desk nav ul li.has-droupdown .submenu.inner-page li {

  margin: 0;

  width: 100%;

}

.header-three .main-nav-desk nav ul li.has-droupdown .submenu.inner-page li a {

  display: block;

  width: 100%;

  padding: 0 15px;

}



.sub-dropdown {

  position: relative !important;

  display: block !important;

}

.sub-dropdown .submenu.third-lvl {

  opacity: 0 !important;

  min-width: 185px !important;

  left: 100% !important;

  top: -13% !important;

  margin: 0;

  border-radius: 0 !important;

}

.sub-dropdown .submenu.third-lvl.base {

  display: block !important;

}

.sub-dropdown:hover .sub-menu-link {

  color: var(--color-primary);

}

.sub-dropdown:hover .submenu.third-lvl.base {

  opacity: 1 !important;

  min-width: 185px !important;

  top: 0 !important;

  right: 3px;

  display: block !important;

}

.sub-dropdown:hover .submenu.third-lvl.base li {

  display: block;

}

.sub-dropdown:hover .submenu.third-lvl.base li a {

  display: block !important;

}



.header-three .sub-dropdown:hover .submenu.third-lvl.base {

  margin-left: -14px !important;

}



.header-two .header-main-wrapper .sub-dropdown:hover .submenu.third-lvl.base {

  margin-left: 90px !important;

}



header.heder-two .sub-dropdown:hover .submenu.third-lvl.base {

  opacity: 1 !important;

  min-width: 185px !important;

  top: 0 !important;

  right: 3px;

  display: block;

  margin-left: 0 !important;

}

header.heder-two .sub-dropdown::after {

  position: absolute;

  content: "\f105";

  font-family: "Font Awesome 6 Pro" !important;

  font-size: 16px;

  right: 20px;

  top: 8px;

  color: #fff;

}

header.heder-two .sub-dropdown:hover a.sub-menu-link {

  color: var(--color-primary) !important;

}

header.heder-two .sub-dropdown:hover::after {

  color: var(--color-primary) !important;

}

header.heder-two .sub-dropdown .submenu.third-lvl.base {

  display: block;

}



header.header-three .sub-dropdown:hover .submenu.third-lvl.base {

  opacity: 1 !important;

  min-width: 185px !important;

  top: 0 !important;

  right: 3px;

  display: block;

  margin-left: 0 !important;

}

header.header-three .sub-dropdown::after {

  position: absolute;

  content: "\f105";

  font-family: "Font Awesome 6 Pro" !important;

  font-size: 16px;

  right: 10px;

  top: 50%;

  transform: translateY(-50%);

  color: #fff;

}

header.header-three .sub-dropdown:hover a.sub-menu-link {

  color: var(--color-primary) !important;

}

header.header-three .sub-dropdown:hover::after {

  color: var(--color-primary) !important;

}

header.header-three .sub-dropdown .submenu.third-lvl.base {

  display: block;

}



.tmp-bread-crumb-area .breadcrumb-inner {

  position: relative;

  z-index: 1;

}

.tmp-bread-crumb-area .breadcrumb-inner.text-start .meta {

  justify-content: flex-start;

}

.tmp-bread-crumb-area .breadcrumb-inner .watermark {

  color: black;

  -webkit-text-fill-color: white; /* Will override color (regardless of order) */

  -webkit-text-stroke-width: 1px;

  -webkit-text-stroke-color: #E4E4E4;

  font-size: 160px;

  line-height: 1;

  font-weight: 600;

  font-family: var(--font-primary);

  opacity: 0.4;

  position: absolute;

  z-index: -1;

  left: 50%;

  top: 0;

  transform: translateX(-50%);

  width: max-content;

}

.tmp-bread-crumb-area .breadcrumb-inner .title {

  font-size: 46px;

  font-weight: 700;

  line-height: 1.3;

}

@media only screen and (max-width: 767px) {

  .tmp-bread-crumb-area .breadcrumb-inner .title {

    line-height: 1.3;

    font-size: 38px !important;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-bread-crumb-area .breadcrumb-inner .title {

    line-height: 1.3;

    font-size: 28px !important;

  }

}

.tmp-bread-crumb-area .breadcrumb-inner .desc {

  max-width: 519px;

  margin: auto;

  margin-bottom: 20px;

}

.tmp-bread-crumb-area .breadcrumb-inner .meta {

  display: flex;

  align-items: center;

  gap: 10px;

  justify-content: center;

}

.tmp-bread-crumb-area .breadcrumb-inner .meta span i {

  font-size: 11px;

}

.tmp-bread-crumb-area .breadcrumb-inner .meta a {

  font-weight: 400;

  color: #717580;

}

.tmp-bread-crumb-area .breadcrumb-inner .meta a i {

  color: var(--color-primary);

}

.tmp-bread-crumb-area .breadcrumb-inner .meta a.next {

  opacity: 0.54;

}



.gradient-breadcrumb-1 {

  background: linear-gradient(white 0%, #f4f7ff 100%);

}



.breadcrumb-user {

  height: 280px;

}

@media only screen and (max-width: 767px) {

  .breadcrumb-user {

    height: 190px;

  }

}



.pb-controler-breadcrumb {

  padding-bottom: 150px;

}



.pb-controler-breadcrumb + section {

  margin-top: -170px;

}

@media only screen and (max-width: 576px) {

  .pb-controler-breadcrumb + section {

    margin-top: -150px;

  }

}



.bg-image-breadcrumb {

  height: 420px;

  background-image: url(../images/service/breadcrumb.webp);

  display: flex;

  align-items: center;

  justify-content: center;

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 767px) {

  .bg-image-breadcrumb {

    height: 250px;

  }

}

.bg-image-breadcrumb.not-overlay {

  background-image: url(../images/service/breadcrumb-1.webp);

}

.bg-image-breadcrumb.not-overlay::after {

  display: none;

}

.bg-image-breadcrumb * {

  color: var(--color-white);

}

.bg-image-breadcrumb::after {

  position: absolute;

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  content: "";

  background: #000;

  opacity: 0.3;

  z-index: -1;

}

.bg-image-breadcrumb .breadcrumb-inner .title {

  font-size: 54px;

}

.bg-image-breadcrumb .breadcrumb-inner .meta a {

  color: var(--color-white);

}



.about-area-breadcrumb-two {

 background: #001b46;

  height: 120px;

  display: flex;

  align-items: center;

  justify-content: center;

  text-align: center;

  overflow: hidden;

  position: relative;

  z-index: 1;
}

@media only screen and (max-width: 991px) {

  .about-area-breadcrumb-two {

    height: 500px;

  }

}

@media only screen and (max-width: 767px) {

  .about-area-breadcrumb-two {

    height: 140px;

  }

}




.about-content-two-wrapper {

  padding-top: 0px;

}

@media only screen and (max-width: 576px) {

  .about-content-two-wrapper {

    padding-top: 0px;

  }

}

.about-content-two-wrapper .b_one-pre {

  padding: 5px 15px;

  background: rgba(241, 241, 241, 0.1568627451);

  border-radius: 33px;

  backdrop-filter: blur(5px);

}

.about-content-two-wrapper .title-banner {

  margin-top: 30px;
    font-size: 38px;
  margin-bottom: 20px;

}
.about-style-three-content p{
	margin-bottom: 10px;
}

@media only screen and (max-width: 1199px) {

  .about-content-two-wrapper .title-banner {

    line-height: 1.3;

  }

}

@media only screen and (max-width: 576px) {

  .about-content-two-wrapper .title-banner {

    line-height: 1.4;

  }

}

@media only screen and (max-width: 767px) {

  .about-content-two-wrapper .title-banner br {

    display: none;

  }

}

.about-content-two-wrapper .tmp-btn {

  margin: auto;

}



.breadcrumb-style-1 {

  height: 550px;

  display: flex;

  align-items: center;

  justify-content: center;

  background-image: url(../images/breadcrumb/01.webp);

  background-size: cover;

  background-repeat: no-repeat;

  background-position: center;

  overflow: hidden;

  position: relative;

  z-index: 1;

  margin: 15px 15px 0 15px;

  border-radius: 16px;

}

@media only screen and (max-width: 576px) {

  .breadcrumb-style-1 {

    height: 350px;

  }

}

.breadcrumb-style-1.in-shop {

  height: 420px;

  background-image: url(../images/breadcrumb/02.webp);

}

.breadcrumb-style-1.in-shop::after {

  display: none;

}

.breadcrumb-style-1::after {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  height: 100%;

  width: 100%;

  background: var(--color-primary);

  mix-blend-mode: multiply;

  z-index: -1;

}

.breadcrumb-style-1 .inner-content {

  padding-top: 70px;

  text-align: center;

}

.breadcrumb-style-1 .inner-content .title {

  color: var(--color-white);

}

.breadcrumb-style-1 .inner-content .page-breadcrumb {

  display: flex;

  justify-content: center;

  align-items: center;

  gap: 10px;

}

.breadcrumb-style-1 .inner-content .page-breadcrumb li a {

  color: var(--color-white);

}

.breadcrumb-style-1 .inner-content .page-breadcrumb li a i {

  margin-right: 10px;

  font-size: 18px;

}

.breadcrumb-style-1 .inner-content .page-breadcrumb li span.dot {

  display: block;

  height: 8px;

  width: 8px;

  border-radius: 50%;

  background: var(--color-primary);

}



.cart-bar {

  position: fixed;

  top: 0;

  right: 0;

  background: #fff;

  width: 500px;

  height: 100%;

  padding: 20px;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-orient: vertical;

  -webkit-box-direction: normal;

  -ms-flex-direction: column;

  flex-direction: column;

  -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);

  box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);

  visibility: hidden;

  -webkit-transform: translateX(100%);

  transform: translateX(100%);

  -webkit-transition: all 500ms ease;

  transition: all 500ms ease;

  z-index: 1010;

}

@media only screen and (max-width: 576px) {

  .cart-bar {

    width: 360px;

  }

}

@media only screen and (max-width: 479px) {

  .cart-bar {

    width: 320px;

  }

}



.cart-bar.show {

  visibility: visible;

  -webkit-transform: translateX(0);

  transform: translateX(0);

}



.cart-bar .cart-header {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  -webkit-box-pack: justify;

  -ms-flex-pack: justify;

  justify-content: space-between;

  margin-bottom: 12px;

  padding-bottom: 15px;

  border-bottom: 1px dashed #E7E7E7;

}



.cart-bar .cart-header .cart-heading {

  font-size: 17px;

  font-weight: 600;

  color: #000000;

  font-family: var(--font-secondary);

}



.close-cart {

  cursor: pointer;

  margin-top: -11px;

  height: 45px;

  width: 45px;

  background: #f1f1f1;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

}

.close-cart i {

  transition: 0.3s;

  color: var(--color-heading-1);

  font-size: 22px;

}

.close-cart:hover i {

  transform: scale(1.3);

  color: var(--color-primary-2);

}



.cart-bar .product-item {

  width: 100%;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  -webkit-box-pack: justify;

  -ms-flex-pack: justify;

  justify-content: space-between;

  padding-bottom: 12px;

  margin-bottom: 12px;

  border-bottom: 1px dashed #E7E7E7;

}



.product-item {

  margin-bottom: 65px;

  position: relative;

}



.cart-bar .product-item:last-child {

  margin-bottom: 0;

}



.cart-bar .product-detail {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  -webkit-box-pack: justify;

  -ms-flex-pack: justify;

  justify-content: space-between;

}



.cart-bar .cart-edit {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-orient: vertical;

  -webkit-box-direction: normal;

  -ms-flex-direction: column-reverse;

  flex-direction: column-reverse;

  -webkit-box-align: end;

  -ms-flex-align: end;

  align-items: flex-end;

}



.cart-edit {

  margin-right: 40px;

}

@media only screen and (max-width: 479px) {

  .cart-edit {

    margin-right: 13px;

  }

}



.cart-bar .product-detail .product-thumb {

  margin-right: 15px;

  max-width: 75px;

  border-radius: 4px;

  overflow: hidden;

}



.cart-bar .cart-edit .quantity-edit {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  padding: 3px 10px;

  border-radius: 3px;

  margin-top: 3px;

  border: 1px dashed var(--color-border);

}



.cart-edit .quantity-edit {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  padding: 3px 10px;

  border-radius: 3px;

}



.cart-bar .cart-edit .item-wrapper {

  display: inline-block;

}

.cart-bar .cart-edit .item-wrapper .delete-cart {

  height: 30px;

  width: 30px;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

  background: #ffffff;

  position: absolute;

  top: -8px;

  right: 3px;

  z-index: 1;

}

.cart-bar .cart-edit .item-wrapper .delete-cart::after {

  position: absolute;

  content: "";

  height: 100%;

  width: 100%;

  background: #f1f1f1;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%) scale(0.2);

  opacity: 0;

  transition: 0.3s;

  border-radius: 50%;

  z-index: -1;

}

.cart-bar .cart-edit .item-wrapper .delete-cart i {

  color: var(--color-heading-1);

}

.cart-bar .cart-edit .item-wrapper .delete-cart:hover i {

  color: var(--color-heading-1);

}

.cart-bar .cart-edit .item-wrapper .delete-cart:hover::after {

  opacity: 1;

  transform: translate(-50%, -50%) scale(1);

}



.cart-bar .cart-edit .quantity-edit button {

  background: none;

  font-size: 0;

  border: none;

}



.cart-bar .cart-edit .quantity-edit button i {

  font-size: 14px;

  color: #C0C0C0;

}



.cart-edit .quantity-edit button i {

  font-size: 16px;

  color: #d3d3d3;

}



edit .quantity-edit button {

  background: none;

  font-size: 0;

}



.cart-edit .quantity-edit button {

  background: none;

  font-size: 0;

}



.cart-bar .cart-edit .quantity-edit button i {

  font-size: 14px;

  color: #000000;

}

.cart-bar .cart-edit .quantity-edit button i:hover {

  color: var(--color-primary-2);

}



.cart-edit .quantity-edit button i {

  font-size: 16px;

  color: #d3d3d3;

}



.cart-bar .cart-edit .quantity-edit input {

  text-align: center;

  max-width: 26px;

  padding: 0;

}

@media only screen and (max-width: 576px) {

  .cart-bar .cart-edit .quantity-edit input {

    width: 10px;

  }

}



.cart-edit .quantity-edit input {

  text-align: center;

  max-width: 55px;

  font-size: 16px;

  font-weight: 400;

  color: #040404;

}



.cart-bar .cart-edit .product-edit {

  margin-right: 15px;

}



.cart-bar .product-detail .product-name {

  font-size: 14px;

  font-weight: 400;

  color: var(--color-primary-2);

}



.cart-bar .product-detail span {

  display: inline-block;

  line-height: 19px !important;

}



.cart-bar .product-detail .product-variation span {

  color: #868686;

  font-weight: 400;

  font-size: 13px;

  line-height: 15px;

}

.cart-bar .product-detail .product-variation span.size {

  color: var(--color-primary);

}



.cart-bar .product-detail .product-qnty, .cart-bar .product-detail .product-price {

  color: #404040;

  font-weight: 400;

  font-size: 13px;

}



.cart-bar .cart-bottom-area {

  margin-top: auto;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-orient: vertical;

  -webkit-box-direction: normal;

  -ms-flex-direction: column;

  flex-direction: column;

}



.cart-bar .cart-bottom-area .spend-shipping {

  margin-bottom: 30px;

  background: #F5F5F5;

  padding: 10px 15px;

  font-size: 12px;

  font-weight: 500;

  color: var(--color-heading-1);

  text-align: center;

}



.cart-bar .cart-bottom-area .spend-shipping i {

  font-size: 15px;

  margin-right: 7px;

}



.cart-bar .cart-bottom-area .spend-shipping .amount {

  font-weight: 700;

  color: var(--color-primary);

  margin-left: 5px;

}



.cart-bar .cart-bottom-area .total-price {

  font-size: 18px;

  color: #040404;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-pack: justify;

  -ms-flex-pack: justify;

  justify-content: space-between;

  margin-bottom: 20px;

  font-weight: 600;

}

.cart-bar .cart-bottom-area .total-price span {

  color: var(--color-primary-2);

}



.cart-bar .cart-bottom-area .checkout-btn {

  border: 1px solid var(--color-primary-2);

  margin-bottom: 10px;

  color: var(--color-primary-2);

}



.cart-bar .cart-bottom-area .cart-btn {

  width: 100%;

  padding: 10px 20px;

  border-radius: 7px;

  font-size: 14px;

  text-align: center;

  -webkit-transition: all 300ms;

  transition: all 300ms;

}



.cart-bar .cart-bottom-area .view-btn {

  border: 1px solid transparent;

  background: var(--color-primary-2);

  color: #fff;

}



.cart-bar .cart-bottom-area .cart-btn {

  width: 100%;

  padding: 10px 20px;

  border-radius: 7px;

  font-size: 14px;

  text-align: center;

  -webkit-transition: all 300ms;

  transition: all 300ms;

}



.cart-bar .cart-bottom-area .checkout-btn:hover {

  background: var(--color-primary-2);

  color: #fff;

}



.cart-bar .product-detail .product-name {

  color: var(--color-heading-1);

  font-weight: 500;

  transition: 0.3s;

}

.cart-bar .product-detail .product-name:hover {

  color: var(--color-primary);

}



.home-one .cart-bar .cart-bottom-area .total-price span,

.home-one .cart-bar .cart-bottom-area .checkout-btn,

.home-one .cart-bar .cart-bottom-area .spend-shipping, .home-two .cart-bar .cart-bottom-area .total-price span,

.home-two .cart-bar .cart-bottom-area .checkout-btn,

.home-two .cart-bar .cart-bottom-area .spend-shipping {

  color: var(--color-primary);

}

.home-one .cart-bar .cart-bottom-area .checkout-btn, .home-two .cart-bar .cart-bottom-area .checkout-btn {

  border: 1px solid var(--color-primary);

}

.home-one .cart-bar .cart-bottom-area .view-btn, .home-two .cart-bar .cart-bottom-area .view-btn {

  background: var(--color-primary);

}

.home-one .cart-bar .cart-bottom-area .checkout-btn:hover, .home-two .cart-bar .cart-bottom-area .checkout-btn:hover {

  color: var(--color-white);

  background: var(--color-primary);

}



.cart-bar .cart-bottom-area .btn-border {

  border-color: var(--color-primary);

  color: var(--color-primary);

  margin-top: 20px;

}

.cart-bar .cart-bottom-area .btn-border:hover {

  color: var(--color-white);

  border-color: var(--color-heading-1);

}



.offcanvas-trigger {

  display: block;

  color: var(--color-heading-1);

  position: relative;

  cursor: pointer;

  font-size: 0.25em;

  line-height: 1;

}

.offcanvas-trigger .offcanvas-bars {

  display: inline-block;

  width: 21px;

  margin: 0;

  vertical-align: middle;

  height: 20px;

}

.offcanvas-trigger .offcanvas-bars span {

  display: inline-block;

  height: 2px;

  margin-left: 0;

  -webkit-transform-origin: left center;

  transform-origin: left center;

  background-color: var(--color-heading-1);

  width: 100%;

  position: relative;

  overflow: hidden;

  margin-bottom: 5px;

  background-color: transparent;

  transition: transform 0.3s, opacity 0.3s, width 0.3s, background-color 0.3s 0.3s, -webkit-transform 0.3s;

  border-radius: 1px;

}

@media only screen and (max-width: 767px) {

  .offcanvas-trigger .offcanvas-bars span {

    margin-bottom: 4px;

  }

}

.offcanvas-trigger .offcanvas-bars span::before, .offcanvas-trigger .offcanvas-bars span::after {

  content: "";

  display: inline-block;

  width: 100%;

  height: 100%;

  position: absolute;

  top: 0;

  left: 0;

  background-color: var(--color-heading-1);

}

.offcanvas-trigger .offcanvas-bars span::before {

  transform: translate(-100%, 0);

  transition: all 0.325s cubic-bezier(0.38, 0.98, 0.4, 1);

}

.offcanvas-trigger .offcanvas-bars span::after {

  transition: all 0.325s cubic-bezier(0.38, 0.98, 0.4, 1);

}

.offcanvas-trigger.canvas-white .offcanvas-bars span::before, .offcanvas-trigger.canvas-white .offcanvas-bars span::after {

  background-color: var(--color-white);

}

.offcanvas-trigger:hover .offcanvas-bars span::before {

  -webkit-transform: translate(0, 0);

  transform: translate(0, 0);

}

.offcanvas-trigger:hover .offcanvas-bars span::after {

  -webkit-transform: translate(100%, 0);

  transform: translate(100%, 0);

}

.offcanvas-trigger:hover .offcanvas-bars span:first-child::before {

  -webkit-transition-delay: 0.18s;

  transition-delay: 0.18s;

}

.offcanvas-trigger:hover .offcanvas-bars span:nth-child(2)::before {

  -webkit-transition-delay: 0.24s;

  transition-delay: 0.24s;

}

.offcanvas-trigger:hover .offcanvas-bars span:nth-child(2)::after {

  -webkit-transition-delay: 0.06s;

  transition-delay: 0.06s;

}

.offcanvas-trigger:hover .offcanvas-bars span:last-child::before {

  -webkit-transition-delay: 0.3s;

  transition-delay: 0.3s;

}

.offcanvas-trigger:hover .offcanvas-bars span:last-child::after {

  -webkit-transition-delay: 0.12s;

  transition-delay: 0.12s;

}



.side-bar {

  position: fixed;

  overflow: hidden;

  top: 0;

  right: -100%;

  width: 510px;

  padding: 40px 30px;

  padding-top: 50px;

  height: 100%;

  display: block;

  background-color: white;

  z-index: 111111;

  transition: all 600ms ease;

  display: flex;

  flex-direction: column;

  overflow-y: auto;

  overflow: visible;

  border-radius: 10px 0 0 10px;

}

@media only screen and (max-width: 991px) {

  .side-bar {

    width: 50%;

  }

}

@media only screen and (max-width: 767px) {

  .side-bar {

    width: 70%;

  }

}

@media only screen and (max-width: 576px) {

  .side-bar {

    width: 320px;

  }

}

.side-bar .inner-main-wrapper-desk .thumbnail {

  display: flex;

  justify-content: center;

}

.side-bar .inner-main-wrapper-desk .thumbnail img {

  width: 85%;

  margin: auto;

}

.side-bar .inner-main-wrapper-desk .inner-content {

  text-align: center;

  margin-top: 30px;

}

.side-bar .inner-main-wrapper-desk .inner-content p {

  max-width: 95%;

  text-align: center;

  margin: auto;

}

.side-bar .inner-main-wrapper-desk .inner-content .title {

  font-weight: 600;

}

.side-bar .inner-main-wrapper-desk .inner-content .footer {

  padding-top: 50px;

  margin-top: 80px;

  border-top: 1px solid #c2c2c2;

}

.side-bar .inner-main-wrapper-desk .inner-content .footer .title {

  font-weight: 500;

}

.side-bar .inner-main-wrapper-desk .inner-content .footer a.tmp-btn {

  margin: auto;

}

.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-area-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-area-wrapper .logo {

  max-width: 140px;

  display: block;

}

.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-area-wrapper .close-icon-menu {

  position: relative;

  max-width: max-content;

  margin: 0;

  color: #000;

  height: 50px;

  width: 50px;

  border-radius: 0;

  display: flex;

  align-items: center;

  justify-content: center;

  margin-left: 14px;

  margin-top: 0;

  font-size: 27px;

  background: #F6F6F6;

  border-radius: 100%;

}

.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-area-wrapper .close-icon-menu i {

  margin-top: 0;

  margin: 0;

  font-size: 18px;

  transition: 0.3s;

}

.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-area-wrapper .close-icon-menu:hover i {

  transform: scale(1.2);

  color: var(--color-white);

}

.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-bottom-qhick-action {

  margin-top: 20px;

}

.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-bottom-qhick-action p.disc {

  font-size: 18px;

  padding-right: 18%;

  margin-bottom: 0;

  padding-bottom: 35px;

  border-bottom: 1px dashed #E7E7E7;

}

.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-bottom-qhick-action .info-list-wrapper {

  margin-top: 25px;

  padding-bottom: 25px;

  border-bottom: 1px dashed #E7E7E7;

}

.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-bottom-qhick-action .info-list-wrapper ul {

  padding: 0;

  margin: 0;

  display: flex;

  align-items: center;

  gap: 30px;

}

.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-bottom-qhick-action .info-list-wrapper ul li {

  margin: 0;

  padding: 0;

}

.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-bottom-qhick-action .info-list-wrapper ul li a {

  display: flex;

  align-items: center;

  gap: 10px;

  color: var(--color-heading-1);

}

.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-bottom-qhick-action .info-list-wrapper ul li a i {

  display: flex;

  align-items: center;

  justify-content: center;

  height: 30px;

  width: 30px;

  border-radius: 50%;

  background: #F6F6F6;

  font-size: 14px;

  color: var(--color-primary);

}

.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-bottom-qhick-action .side-bar-nav {

  margin-top: 60px;

  margin-bottom: 80px;

}

.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-bottom-qhick-action .side-bar-nav ul {

  list-style: none;

  padding: 0;

  margin: 0;

}

.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-bottom-qhick-action .side-bar-nav ul li {

  padding: 0;

  margin: 10px 0;

}

.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-bottom-qhick-action .side-bar-nav ul li a {

  font-weight: 500;

  font-size: 24px;

  color: var(--color-heading-1);

}



.side-bar.show {

  right: 0;

  overflow-y: auto;

}



.side-bar button {

  max-width: max-content;

  margin-right: auto;

  margin-left: -53px;

  margin-top: 0;

  position: absolute;

  border: none;

}

.side-bar button i {

  color: #000;

  height: 40px;

  min-width: 40px;

  border-radius: 0;

  display: flex;

  align-items: center;

  justify-content: center;

  margin-left: 43px;

  margin-top: -37px;

  font-size: 20px;

  border-radius: 50%;

  position: relative;

  background: #F6F6F6;

  z-index: 1;

}

.side-bar button i::after {

  position: absolute;

  top: 50%;

  left: 50%;

  content: "";

  transform: translate(-50%, -50%) scale(0.2);

  width: 100%;

  height: 100%;

  background: var(--color-primary);

  z-index: -1;

  opacity: 0;

  transition: 0.3s;

  border-radius: 50%;

}

.side-bar button i:hover {

  color: var(--color-white);

}

.side-bar button i:hover::after {

  transform: translate(-50%, -50%) scale(1);

  opacity: 1;

}



.offcanvas-search {

  padding: 40px 0;

  height: max-content !important;

  z-index: 99999;

  background-color: var(--color-white);

  visibility: hidden;

  overflow-y: scroll;

  clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);

  transition: all 0.2s ease-in-out, clip-path 0.4s ease-in-out;

}

.offcanvas-search.offcanvas.show {

  visibility: visible !important;

  opacity: 1;

  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);

  display: block;

}

.offcanvas-search .tmp-container {

  max-width: 1440px;

  width: 100%;

  margin-left: auto;

  margin-right: auto;

  padding-left: 15px;

  padding-right: 15px;

}

.offcanvas-search .title {

  margin-bottom: 16px;

  font-size: 24px;

}

.offcanvas-search .list {

  gap: 12px 20px;

}

@media only screen and (max-width: 576px) {

  .offcanvas-search .list {

    gap: 8px;

  }

}

.offcanvas-search .list a {

  display: flex;

  align-items: center;

  height: 40px;

  padding: 0 20px;

  border: 1px solid #e9e9e9;

  border-radius: 33px;

  color: var(--color-heading-1);

}

@media only screen and (max-width: 576px) {

  .offcanvas-search .list a {

    padding: 0 10px;

    height: 30px;

    font-size: 14px;

  }

}

.offcanvas-search .list a:hover {

  background-color: var(--color-heading-1);

  color: var(--color-white);

  border-color: var(--color-heading-1);

}

.offcanvas-search .btn-close-search {

  position: absolute;

  right: 20px;

  top: 20px;

  background-color: unset;

  -webkit-transition: all 0.3s ease;

  -moz-transition: all 0.3s ease;

  -ms-transition: all 0.3s ease;

  -o-transition: all 0.3s ease;

  transition: all 0.3s ease;

  color: var(--color-heading-1);

  width: unset;

  border: none;

  height: 45px;

  width: 45px;

  background: #fff;

  border-radius: 50%;

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

}

@media only screen and (max-width: 576px) {

  .offcanvas-search .btn-close-search {

    right: 9px;

    top: 9px;

  }

}

.offcanvas-search .btn-close-search i {

  font-size: 16px;

}

.offcanvas-search .btn-close-search:hover {

  transform: rotate(-180deg);

}

@media (min-width: 768px) {

  .offcanvas-search .wrap-form {

    margin-bottom: 40px;

  }

}

@media only screen and (max-width: 767px) {

  .offcanvas-search .wrap-form {

    margin-bottom: 20px;

  }

}

.offcanvas-search .wrap-form form {

  position: relative;

  z-index: 30;

}

.offcanvas-search .tmp-line {

  display: block;

  width: 100%;

  height: 1px;

  margin: 24px 0;

}

.offcanvas-search .form-search fieldset {

  border: none;

  margin: 0;

  padding: 0;

}

.offcanvas-search .form-search fieldset input {

  border-radius: 70px;

  outline: 0;

  -webkit-box-shadow: none;

  -moz-box-shadow: none;

  box-shadow: none;

  width: 100%;

  padding: 10px 14px;

  font-size: 16px;

  font-weight: 400;

  line-height: 26px;

  background-color: var(--color-white);

  border: 2px solid #e9e9e9;

  color: var(--color-heading-1);

  overflow: hidden;

  margin-bottom: 0;

}

.offcanvas-search .form-search fieldset input:focus {

  border-color: var(--color-primary);

}

@media (min-width: 768px) {

  .offcanvas-search .form-search fieldset input {

    height: 60px;

  }

}

.offcanvas-search .form-search .btn-submit1 {

  position: absolute;

  top: 50%;

  transform: translateY(-50%);

  right: 8px;

}

@media (max-width: 576px) {

  .offcanvas-search .form-search .btn-submit1 {

    right: 0px !important;

  }

}

@media only screen and (max-width: 767px) {

  .offcanvas-search .form-search .btn-submit1 {

    right: 0;

  }

}

@media only screen and (max-width: 576px) {

  .offcanvas-search .form-search .btn-submit1 {

    right: 0px;

  }

}

.offcanvas-search .form-search .btn-submit1 .tmp-btn {

  border: none;

}

.offcanvas-search .form-search .tf-btn {

  height: 36px;

}

.offcanvas-search .form-search.style-1 .btn-icon {

  display: flex;

  align-items: center;

  height: 36px;

  width: 36px;

  border-radius: 50%;

  color: var(--color-white);

}

.offcanvas-search .form-search.style-2 {

  max-width: 260px;

  width: 100%;

}

.offcanvas-search .form-search.style-2 fieldset input {

  height: 42px;

  border: none;

  border-bottom: 1px solid var(--color-body);

  border-radius: 0;

  padding: 0;

}

.offcanvas-search .form-search.style-2 .btn-submit {

  top: 11px;

  transform: unset;

  right: 0;

}

.offcanvas-search .form-search.style-2 .btn-icon {

  font-size: 24px;

  height: unset;

}



.tmp-grid-layout {

  display: grid;

  align-items: center;

  justify-content: space-between;

  flex-wrap: wrap;

}

@media (min-width: 992px) {

  .tmp-grid-layout.lg-col-3 {

    grid-template-columns: repeat(3, 1fr);

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-grid-layout.lg-col-3 {

    grid-template-columns: repeat(2, 1fr);

  }

}



@media (min-width: 992px) {

  .offcanvas-search .trending .tmp-grid-layout {

    gap: 28px 49px;

  }

}

@media only screen and (max-width: 991px) {

  .offcanvas-search .trending .tmp-grid-layout {

    gap: 28px 49px;

  }

}

@media only screen and (max-width: 991px) and (max-width: 576px) {

  .offcanvas-search .trending .tmp-grid-layout {

    gap: 10px;

  }

}

.offcanvas-search .tmp-line {

  display: block;

  width: 100%;

  height: 1px;

  background-color: #e9e9e9;

  margin: 25px 0;

}



.feature-post-item {

  transition: var(--transition);

  position: relative;

}

.feature-post-item .img-style {

  position: relative;

  border-radius: 12px;

}

.feature-post-item .img-style img {

  width: 100%;

  object-fit: cover;

  transition: var(--transition);

}

.feature-post-item .img-style img.hide {

  opacity: 0;

}

.feature-post-item .tag {

  height: 32px;

  padding: 0 16px;

  border-radius: 28px;

  background-color: rgba(0, 0, 0, 0.2);

  position: absolute;

  z-index: 4;

  top: 20.5px;

  font-weight: 700;

  display: flex;

  align-items: center;

  gap: 4px;

  text-transform: uppercase;

}

.feature-post-item .tag i {

  font-size: 16px;

}

.feature-post-item .tag.time {

  right: 20px;

  padding: 0 12px;

}

.feature-post-item .tag.categories {

  left: 20px;

}

.feature-post-item .wrap-meta {

  flex-wrap: wrap;

  row-gap: 4px;

}

.feature-post-item .video_btn_play {

  position: absolute;

  left: 20px;

  bottom: 20px;

  background-color: var(--White);

  height: 48px;

  width: 48px;

  border-radius: 50%;

  color: #161616;

  z-index: 7;

  font-size: 20px;

  display: flex;

  justify-content: center;

  align-items: center;

}

.feature-post-item.style-small {

  gap: 20px;

}

@media only screen and (max-width: 479px) {

  .feature-post-item.style-small {

    gap: 10px;

  }

}

.feature-post-item.style-small .img-style {

  margin-bottom: 0;

  border-radius: 8px;

  flex-shrink: 0;

  width: 123px;

  height: 92px;

}

.feature-post-item.style-small .wrap {

  flex-wrap: wrap;

  row-gap: 12px;

}

.feature-post-item.style-small .tag {

  position: unset;

  height: 24px;

  padding: 0 8px;

}

.feature-post-item.style-small .meta-feature {

  gap: 3px 22px;

  flex-wrap: wrap;

}

.feature-post-item.style-small .meta-feature li {

  font-size: 12px;

  font-weight: 600;

}

.feature-post-item.style-small .meta-feature li:not(:last-child) {

  position: relative;

}

.feature-post-item.style-small .meta-feature li:not(:last-child)::after {

  content: "/";

  position: absolute;

  right: -14px;

}

.feature-post-item.style-small h6 {

  font-size: 18px;

  font-weight: 600;

}

@media only screen and (max-width: 576px) {

  .feature-post-item.style-small h6 {

    font-size: 14px;

  }

}

.feature-post-item.style-small h6 a {

  color: var(--color-heading-1);

  transition: var(--transition);

}

.feature-post-item.style-small h6 a:hover {

  color: var(--color-primary);

}

.feature-post-item.style-small .img-style {

  margin-bottom: 0;

  border-radius: 8px;

  flex-shrink: 0;

  width: 123px;

  height: 92px;

  overflow: hidden;

  border-radius: 6px;

}

.feature-post-item.style-list {

  display: flex;

  align-items: center;

  gap: 40px;

}

.feature-post-item.style-list .img-style {

  margin-bottom: 0;

  flex: 20%;

  height: 100%;

}

.feature-post-item.style-list .img-style img {

  height: 100%;

  width: 100%;

  object-fit: cover;

}

.feature-post-item.style-list .content {

  flex: 20%;

}

.feature-post-item.style-list .meta-feature {

  margin-bottom: 16px;

  flex-wrap: wrap;

  row-gap: 3px;

}

.feature-post-item.style-list .title {

  margin-bottom: 20px;

}

.feature-post-item.style-list .heading {

  margin-bottom: 40px;

}

.feature-post-item.style-list.v2, .feature-post-item.style-list.v3 {

  gap: 18px;

}

.feature-post-item.style-list.v2 .img-style, .feature-post-item.style-list.v3 .img-style {

  max-width: unset;

  flex: 25%;

}

.feature-post-item.style-list.v2 .title, .feature-post-item.style-list.v3 .title {

  margin-bottom: 16px;

}

.feature-post-item.style-list.v2 .content, .feature-post-item.style-list.v3 .content {

  flex: 20%;

}

.feature-post-item.style-list.v2 .meta-feature, .feature-post-item.style-list.v3 .meta-feature {

  margin-bottom: 12px;

}

.feature-post-item.style-list.v3 .content {

  flex: 25%;

}

.feature-post-item.style-has-number .content {

  display: flex;

  gap: 12px;

}

.feature-post-item.style-has-number .number {

  flex-shrink: 0;

  display: block;

  height: 80px;

  width: 80px;

  background-color: var(--Surface);

  display: flex;

  align-items: center;

  border-radius: 12px;

}

.feature-post-item.style-line .wrap-meta {

  padding-top: 16px;

  margin-top: 16px;

  border-top: 1px solid var(--Line);

  row-gap: 12px;

}

.feature-post-item.style-line .img-style {

  border-radius: 8px;

}

.feature-post-item.style-line .img-style img {

  height: 100%;

  object-fit: cover;

  width: 100%;

}

.feature-post-item.style-line .tag {

  height: 24px;

}

.feature-post-item.style-line .tag.categories {

  position: unset;

}

.feature-post-item.style-line.v2, .feature-post-item.style-line.v3 {

  display: flex;

  gap: 24px;

}

.feature-post-item.style-line.v2 .img-style, .feature-post-item.style-line.v3 .img-style {

  flex: 17.7%;

  margin-bottom: 0;

}

.feature-post-item.style-line.v2 .tag.categories, .feature-post-item.style-line.v3 .tag.categories {

  height: 24px;

}

.feature-post-item.style-line.v2 .wrap-meta, .feature-post-item.style-line.v3 .wrap-meta {

  padding-top: 16px;

  margin-top: 0;

}

.feature-post-item.style-line.v2 .content, .feature-post-item.style-line.v3 .content {

  flex: 20%;

}

.feature-post-item.style-line.v2 .tag, .feature-post-item.style-line.v3 .tag {

  height: 24px;

  padding: 0 8px;

}

.feature-post-item.style-line.v2 .tag.time, .feature-post-item.style-line.v3 .tag.time {

  height: 32px;

  padding: 0 12px;

}

.feature-post-item.style-line.v2 .content, .feature-post-item.style-line.v3 .content {

  display: flex;

  flex-direction: column;

  justify-content: space-between;

}

.feature-post-item.style-line.v2 .meta-feature, .feature-post-item.style-line.v3 .meta-feature {

  gap: 4px 22px;

}

.feature-post-item.style-line.v3 {

  gap: 32px;

}

.feature-post-item.style-line.v3 .img-style {

  flex: 20%;

}

.feature-post-item.style-line.v4 .wrap-meta {

  padding-top: 13px;

  margin-top: 13px;

}

.feature-post-item.style-line.v4 .tag {

  padding: 0 8px;

}

.feature-post-item.style-line.v4 .tag.categories {

  height: 24px;

}

.feature-post-item.style-line.v4 .tag.time {

  height: 32px;

  padding: 0 12px;

}

.feature-post-item.style-line.v4 .meta-feature {

  gap: 22px;

}

.feature-post-item.style-position {

  border-radius: 12px;

  overflow: hidden;

}

.feature-post-item.style-position .img-style {

  margin-bottom: 0;

  background-color: #161616;

  border-radius: inherit;

}

.feature-post-item.style-position .img-style img {

  opacity: 0.8;

}

.feature-post-item.style-position .heading-title {

  padding: 40px;

}

.feature-post-item.style-position .content {

  position: absolute;

  inset: 0;

  display: flex;

  flex-direction: column;

  justify-content: space-between;

  z-index: 2;

}

.feature-post-item.style-position .tag {

  position: unset;

}

.feature-post-item.style-position .tag.categories {

  height: 40px;

}

.feature-post-item.style-position .wrap-meta {

  padding: 8px 12px;

  background: rgba(22, 22, 22, 0.1019607843);

  border-top: 1px solid rgba(255, 255, 255, 0.1019607843);

  backdrop-filter: blur(4px);

  row-gap: 12px;

}

.feature-post-item.style-position.v2 .img-style {

  border-radius: 12px;

}

.feature-post-item.style-position.v2 .heading-title {

  padding: 20px;

}

.feature-post-item.style-position.v2 .tag {

  height: 24px;

  padding: 0 8px;

}

.feature-post-item.style-border {

  padding: 27px;

  border: 1px solid var(--color-body);

  border-radius: 16px;

  position: relative;

}

.feature-post-item .tmp-video {

  position: absolute;

  z-index: 1;

  inset: 0;

}

.feature-post-item .tmp-video .fn__video_youtube {

  height: 100%;

}

.feature-post-item .tmp-video .mbYTP_wrapper iframe {

  height: 100% !important;

  margin-top: 0 !important;

}



@media (min-width: 992px) {

  .tmp-grid-layout.lg-col-3 .item-grid:not(:nth-child(3n))::before {

    content: "";

    position: absolute;

    height: 100%;

    width: 1px;

    background-color: #e9e9e9;

    right: -15px;

  }

}

@media (min-width: 992px) {

  .offcanvas-search .trending .tmp-grid-layout .item-grid::before {

    right: -20px;

  }

}

.feature-post-item .img-style img {

  width: 100%;

  object-fit: cover;

  -webkit-transition: all 0.3s ease;

  -moz-transition: all 0.3s ease;

  -ms-transition: all 0.3s ease;

  -o-transition: all 0.3s ease;

  transition: all 0.3s ease;

}



.hover-image-rotate:hover .img-style img {

  transform: scale(1.1);

}



.side-bar .inner-main-wrapper-desk.style-one-sidebar .header-area-wrapper .logo.logo-yellow {

  display: none;

}



.demo-orange .side-bar .inner-main-wrapper-desk.style-one-sidebar .header-area-wrapper .logo {

  display: none;

}



.demo-orange .side-bar .inner-main-wrapper-desk.style-one-sidebar .header-area-wrapper .logo.logo-yellow {

  display: block;

}



.about-image-area {

  display: flex;

  align-items: start;

  gap: 30px;

  position: relative;

  z-index: 1;

  height: 100%;

  display: block;

  overflow: hidden;

  border-radius: 8px;

}

.about-image-area .about-card {

  position: absolute;

  z-index: 2;

  background: var(--color-primary);

  border-radius: 8px;

  left: 30px;

  bottom: 60px;

  padding: 20px 20px 20px;

  display: flex;

  flex-direction: column;

  align-items: start;

  gap: 30px;

}

@media only screen and (max-width: 767px) {

  .about-image-area .about-card {

    padding: 25px;

    gap: 30px !important;

  }

}

@media only screen and (max-width: 576px) {

  .about-image-area .about-card {

    margin-top: 30px;

  }

}

.about-image-area .about-card .card-top .title {

  font-size: 60px;

  line-height: 100%;

  font-weight: 600;

  color: var(--color-white);

  margin-bottom: 5px;

}

.about-image-area .about-card .card-top .desc {

  font-size: 20px;

  color: var(--color-white);

  font-family: var(--font-primary);

  line-height: 24px;

  font-weight: 600;

}

.about-image-area .about-card .card-bottom {

  background: var(--color-white);

  border-radius: 6px;

  padding: 10px 15px;

  width: 100%;

}

@media only screen and (max-width: 767px) {

  .about-image-area .about-card .card-bottom {

    padding: 18px !important;

    border-radius: 8px;

  }

}

.about-image-area .about-card .card-bottom .title {

  margin-bottom: 5px;

  font-size: 20px;

  line-height: 1.2;

}

.about-image-area .about-card .card-bottom .designation {

  color: #717580;

  margin-bottom: 3px;

  line-height: 24px;

  font-size: 14px;

}

.about-image-area .about-card .card-bottom .signature {

  font-size: 18px;

  font-weight: 600;

  line-height: 1;

  color: var(--color-heading-1);

}

.about-image-area .about-card.inner {

  background: var(--color-primary-2);

}



.tmp-tab-one-start ul.nav {

  padding: 0;

  border: none;

  margin-top: 40px;

  margin-bottom: 30px;

  max-width: max-content;

  gap: 10px;

}

@media screen and (max-width: 1919px) {

  .tmp-tab-one-start ul.nav {

    padding: 15px;

  }

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-tab-one-start ul.nav {

    margin-top: 10px;

    margin-bottom: 14px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-tab-one-start ul.nav {

    margin: 10px 0;

    background: transparent !important;

  }

}

@media only screen and (max-width: 479px) {

  .tmp-tab-one-start ul.nav {

    padding: 0;

  }

}

.tmp-tab-one-start ul.nav li {

  margin: 0;

  padding: 0;

}

.tmp-tab-one-start ul.nav li button {

  color: var(--color-heading-1);

  font-family: var(--font-primary);

  padding: 12px 19px;

  margin: 0;

  background: transparent;

  border: 1px solid #E4E4E4 !important;

  border: none;

  font-weight: 500;

  font-size: 16px;

  border-radius: 5px;

  position: relative;

  transition: 0.3s;

}

.tmp-tab-one-start ul.nav li button:hover {

  color: var(--color-white);

  background: var(--color-primary);

}

.tmp-tab-one-start ul.nav li button::after {

  position: absolute;

  content: "";

  width: 0;

  height: 0;

  border-left: 18px solid var(--color-primary);

  border-top: 12px solid transparent;

  border-bottom: 12px solid transparent;

  bottom: -20px;

  left: 50%;

  transform: translateX(-50%) rotate(90deg);

  opacity: 0;

  transition: var(--transition);

}

.tmp-tab-one-start ul.nav li button[aria-selected=true] {

  background: var(--color-primary);

  border: none;

  color: var(--color-white);

  border: 1px solid transparent !important;

}

.tmp-tab-one-start ul.nav li button[aria-selected=true]::after {

  opacity: 1;

}



.demo-orange .tmp-tab-one-start ul.nav li button[aria-selected=true] {

  background: var(--secondary-100);

  color: var(--color-primary);

}

.demo-orange .tmp-tab-one-start ul.nav li button[aria-selected=true]::after {

  border-left: 18px solid var(--secondary-100);

}

.demo-orange .tmp-tab-one-start ul.nav li button:hover {

  background: var(--secondary-100);

  color: var(--color-primary);

  border: none;

  border: 1px solid transparent !important;

}

.demo-orange .single-tab-content-one .tab-area-content .right-jr .single .icon {

  background: var(--secondary-100);

}



.single-tab-content-one {

  padding: 25px;

  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.06);

  background: var(--color-white);

  border-radius: 10px;

}

.single-tab-content-one p.desc {

  margin-bottom: 30px;

  max-width: 100%;

}

@media screen and (max-width: 1919px) {

  .single-tab-content-one p.desc {

    font-size: 16px;

    margin-bottom: 20px;

  }

}

@media only screen and (max-width: 1199px) {

  .single-tab-content-one p.desc {

    width: 100%;

    max-width: 100%;

    margin-bottom: 25px;

  }

}

@media only screen and (max-width: 767px) {

  .single-tab-content-one p.desc {

    width: 100%;

  }

}

.single-tab-content-one .tab-area-content {

  display: flex;

  align-items: center;

  gap: 15px;

}

@media screen and (max-width: 1919px) {

  .single-tab-content-one .tab-area-content {

    gap: 20px;

  }

}

@media only screen and (max-width: 479px) {

  .single-tab-content-one .tab-area-content {

    flex-direction: column;

    align-items: flex-start;

    gap: 20px;

    margin-top: 20px;

  }

}

.single-tab-content-one .tab-area-content .left-jr img {

  border-radius: 6px;

}

@media only screen and (max-width: 576px) {

  .single-tab-content-one .tab-area-content .left-jr img {

    width: 100%;

  }

}

.single-tab-content-one .tab-area-content .right-jr {

  display: flex;

  flex-direction: column;

  gap: 7px;

}

.single-tab-content-one .tab-area-content .right-jr .single {

  margin-bottom: 0;

  display: flex;

  align-items: start;

}

.single-tab-content-one .tab-area-content .right-jr .single .icon {

  width: 18px;

  height: 18px;

  display: block;

  border-radius: 50%;

  text-align: center;

  line-height: 18px;

  background: var(--primary-100);

  margin-right: 10px;

  margin-top: 2px;

}

.single-tab-content-one .tab-area-content .right-jr .single .icon i {

  color: var(--color-primary);

  font-size: 12px;

}

.single-tab-content-one .tab-area-content .right-jr .single span {

  font-weight: 400;

  font-size: 16px;

  line-height: 24px;

  color: #717580;

}

@media screen and (max-width: 1919px) {

  .single-tab-content-one .tab-area-content .right-jr .single span {

    font-size: 13px;

  }

}

@media only screen and (max-width: 1199px) {

  .single-tab-content-one .tab-area-content .right-jr .single span {

    font-size: 16px;

  }

}



@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .about-carpenter-area .section-title-area-4 .section-title br {

    display: none;

  }

}



.about-award-area {

  position: relative;

  z-index: 1;

  padding: 35px 37px 33px 38px;

  background: url(../images/about/award-bg.webp);

  background-repeat: no-repeat;

  background-size: cover;

  background-position: center;

  box-shadow: 0px 4px 21px rgba(0, 0, 0, 0.1);

  border-radius: 6px;

}

@media only screen and (max-width: 991px) {

  .about-award-area {

    max-width: max-content;

  }

}

@media only screen and (max-width: 576px) {

  .about-award-area {

    max-width: 100%;

  }

}

.about-award-area.area-2 {

  background: url(../images/about/award-bg-2.webp);

  background-repeat: no-repeat;

  background-size: cover;

}

.about-award-area .award-inner {

  text-align: center;

}

.about-award-area .award-inner .star-rating-area {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 3px;

  background: rgba(255, 112, 41, 0.09);

  padding: 1px 6px 1px;

  border-radius: 3px;

  max-width: max-content;

  margin: auto;

  margin-bottom: 15px;

}

.about-award-area .award-inner .star-rating-area li {

  color: #FFC107;

}

.about-award-area .award-inner .year {

  color: var(--color-primary);

  font-family: var(--font-primary);

  font-weight: 600;

  font-size: 30px;

  line-height: 37px;

  display: block;

  margin-bottom: 5px;

}

.about-award-area .award-inner .title {

  font-size: 20px;

  line-height: 1.2;

  margin-bottom: 0;

}

.about-award-area .hot {

  position: absolute;

  z-index: 1;

  top: -30px;

  left: -20px;

}



.about-feature-area {

  display: flex;

  margin: 0 35px 0 40px;

}

.about-feature-area .title {

  font-size: 26px;

  line-height: 35px;

  font-weight: 600;

  margin-bottom: 15px;

}

.about-feature-area .left-content p {

  margin-bottom: 15px;

}

.about-feature-area .left-content p:last-child {

  margin-bottom: 0;

}

.about-feature-area .about-feature-list li {

  display: flex;

  align-items: center;

  gap: 7px;

  margin-bottom: 7px;

  font-family: var(--font-secondary);

  font-weight: 400;

}

.about-feature-area .about-feature-list li .icon {

  width: 19px;

  height: 19px;

  line-height: 19px;

  text-align: center;

  display: block;

  color: var(--color-primary);

  background: var(--primary-100);

  border-radius: 13px;

  font-size: 8px;

  font-weight: 600;

}



.demo-orange .about-feature-area .about-feature-list li .icon {

  background: var(--secondary-100);

}



.about-image-area2 {

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 1199px) {

  .about-image-area2 {

    margin-bottom: 60px !important;

  }

}

.about-image-area2 img {

  border-radius: 12px;

}

@media only screen and (max-width: 1199px) {

  .about-image-area2 img {

    width: 100%;

  }

}

.about-image-area2 .floating-img,

.about-image-area2 .floating-shape {

  position: absolute;

}

.about-image-area2 .floating-img {

  bottom: -145px;

  right: -40%;

}

@media only screen and (max-width: 1199px) {

  .about-image-area2 .floating-img {

    display: none;

  }

}

.about-image-area2 .floating-shape {

  top: -40px;

  right: -180px;

}



.tmp-about-area {

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 1199px) {

  .tmp-about-area {

    padding-bottom: 120px !important;

  }

}

@media only screen and (max-width: 991px) {

  .tmp-about-area {

    padding-bottom: 70px !important;

  }

}

.tmp-about-area.inner .tmp-tab-one-start ul.nav li button[aria-selected=true] {

  background: var(--color-primary-2);

}

.tmp-about-area.inner .tmp-tab-one-start ul.nav li button::after {

  border-left: 18px solid var(--color-primary-2);

}

.tmp-about-area.inner .section-title-area-4 {

  max-width: 469px;

}



.home-green .tmp-about-area.inner .tmp-tab-one-start ul.nav li button[aria-selected=true] {

  background: var(--color-primary);

  color: var(--color-white);

}

.home-green .tmp-about-area.inner .tmp-tab-one-start ul.nav li button:hover {

  color: var(--color-white);

  background: var(--color-primary);

  border: 1px solid transparent !important;

}

.home-green .tmp-about-area.inner .tmp-tab-one-start ul.nav li button::after {

  border-left: 18px solid var(--color-primary);

}



.marquee-area {

  position: absolute;

  bottom: 0;

  left: 50%;

  transform: translateX(-50%);

  z-index: 1;

  width: auto;

}

.marquee-area .marquee-inner {

  display: inline-block;

  will-change: transform;

  animation: marquee 65s linear infinite;

}

.marquee-area .marquee-inner .main-wrapper-tt {

  display: flex;

  align-items: center;

  max-width: max-content;

}

.marquee-area .marquee-inner .main-wrapper-tt h2 {

  font-size: 130px;

  line-height: 1;

  font-weight: 600;

}



.marquee {

  position: absolute;

  bottom: 0;

}

.marquee .marquee__item {

  display: inline-block;

  will-change: transform;

  animation: marquee 150s linear infinite;

}



.marquee .marquee__item .main--wrapper-tt {

  display: flex;

  align-items: center;

  gap: 20px;

  padding: 15px 0 0;

}

.marquee .marquee__item .main--wrapper-tt h2 {

  font-size: 130px;

  line-height: 1;

  font-weight: 600;

  width: max-content;

  -webkit-text-stroke: 1px rgba(255, 112, 41, 0.19);

  -webkit-text-fill-color: white;

  margin-bottom: 0;

}

@media only screen and (max-width: 991px) {

  .marquee .marquee__item .main--wrapper-tt h2 {

    font-size: 80px;

  }

}

@media only screen and (max-width: 767px) {

  .marquee .marquee__item .main--wrapper-tt h2 {

    font-size: 70px;

  }

}



.marquee .marquee__item .main--wrapper-tt .single-inner-marquree .title {

  text-align: center;

}



.tmp-about-area.area-3 .left-side-content .desc {

  max-width: 527px;

  margin-bottom: 15px;

}

.tmp-about-area.area-3 .left-side-content .about-feature-list {

  display: flex;

  flex-direction: column;

  gap: 10px;

}

.tmp-about-area.area-3 .left-side-content .about-feature-list .single {

  display: flex;

  align-items: center;

  gap: 7px;

}

.tmp-about-area.area-3 .left-side-content .about-feature-list .single .icon {

  width: 18px;

  height: 18px;

  line-height: 20px;

  border-radius: 50px;

  background: var(--primary-100);

  display: block;

  text-align: center;

  color: var(--color-primary-2);

  font-size: 10px;

}

.tmp-about-area.area-3 .left-side-content .about-feature-list .single span {

  font-size: 16px;

  font-weight: 400;

  font-family: var(--font-secondary);

}

.tmp-about-area.area-3 .left-side-content .button-area-about {

  display: flex;

  align-items: center;

  gap: 20px;

  transition-delay: 2s;

  margin-top: 40px;

}

@media only screen and (max-width: 576px) {

  .tmp-about-area.area-3 .left-side-content .button-area-about {

    flex-direction: column;

    justify-content: flex-start;

    align-items: flex-start;

  }

}

.tmp-about-area.area-3 .left-side-content .button-area-about .tmp-btn {

  font-family: var(--font-primary);

  font-weight: 700;

  padding: 21px 33px;

}

.tmp-about-area.area-3 .left-side-content .button-area-about .video-btn {

  display: flex;

  align-items: center;

  gap: 20px;

}

.tmp-about-area.area-3 .left-side-content .button-area-about .video-btn a {

  width: 46px;

  height: 46px;

  line-height: 46px;

  text-align: center;

  display: block;

  border-radius: 50%;

  color: var(--color-white);

  background: var(--color-primary-2);

  position: relative;

  z-index: 1;

}

.tmp-about-area.area-3 .left-side-content .button-area-about .video-btn a i {

  font-size: 12px;

}

.tmp-about-area.area-3 .left-side-content .button-area-about .video-btn a::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  border-radius: 50%;

  top: 0;

  left: 0;

  border: 1px solid var(--color-border);

  animation: pulse-border 4s linear infinite;

}

.tmp-about-area.area-4 .left-side-content .desc {

  margin-bottom: 15px;

}

.tmp-about-area.area-4 .left-side-content .about-feature-list {

  display: flex;

  flex-direction: column;

  gap: 0;

  max-width: 85%;

}

@media only screen and (max-width: 991px) {

  .tmp-about-area.area-4 .left-side-content .about-feature-list {

    max-width: 100%;

  }

}

.tmp-about-area.area-4 .left-side-content .about-feature-list .single {

  display: flex;

  align-items: center;

  padding: 10px 0;

  gap: 18px;

}

@media only screen and (max-width: 991px) {

  .tmp-about-area.area-4 .left-side-content .about-feature-list .single {

    max-width: max-content;

  }

}

.tmp-about-area.area-4 .left-side-content .about-feature-list .single:not(:last-child) {

  border-bottom: 1px solid rgba(217, 217, 217, 0.32);

}

.tmp-about-area.area-4 .left-side-content .about-feature-list .single .icon {

  width: 25px;

  min-width: 25px;

  height: 25px;

  border-radius: 50%;

  background: var(--primary-50);

  display: block;

  text-align: center;

  color: rgba(0, 0, 0, 0.6);

  font-size: 14px;

  display: flex;

  align-items: center;

  justify-content: center;

}

.tmp-about-area.area-4 .left-side-content .about-feature-list .single .icon i {

  color: var(--color-primary);

}

.tmp-about-area.area-4 .left-side-content .about-feature-list .single span {

  font-size: 16px;

  font-weight: 400;

  color: var(--color-body);

  font-family: var(--font-secondary);

}

.tmp-about-area.area-4 .left-side-content .button-area-about {

  display: flex;

  align-items: center;

  gap: 20px;

  transition-delay: 2s;

  margin-top: 40px;

}

@media only screen and (max-width: 576px) {

  .tmp-about-area.area-4 .left-side-content .button-area-about {

    flex-direction: column;

    justify-content: center;

        align-items: center;

        text-align: center;

  }

}

.tmp-about-area.area-4 .left-side-content .button-area-about .tmp-btn {

  font-family: var(--font-primary);

  font-weight: 700;

  padding: 21px 33px;

  display: flex;

  align-items: center;

  gap: 10px;

}

.tmp-about-area.area-4 .left-side-content .button-area-about .text-btn {

  display: flex;

  align-items: center;

  gap: 10px;

  font-weight: 600;

  color: var(--color-heading-1);

  transition: 0.3s;

}

.tmp-about-area.area-4 .left-side-content .button-area-about .text-btn:hover {

  color: var(--color-primary);

}

.tmp-about-area.home-eight .marquee .marquee__item .main--wrapper-tt h2 {

  -webkit-text-stroke: 1px var(--primary-100);

}



.about-image-area3 {

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 991px) {

  .about-image-area3 img {

    width: 100%;

  }

}

.about-image-area3 .main-image {

  display: flex;

  flex-direction: column;

  gap: 30px;

  justify-content: end;

  align-items: end;

}

.about-image-area3 .floating-img {

  position: absolute;

  z-index: 1;

  left: 0;

  top: 152px;

}

@media only screen and (max-width: 1199px) {

  .about-image-area3 .floating-img {

    max-width: 36%;

    left: 38px;

  }

}

@media only screen and (max-width: 991px) {

  .about-image-area3 .floating-img {

    left: 5px;

  }

}

@media only screen and (max-width: 767px) {

  .about-image-area3 .floating-img {

    max-width: 45%;

  }

}

.about-image-area3 .counter-area {

  background: var(--color-white);

  box-shadow: 0px 4px 21px rgba(0, 0, 0, 0.07);

  border-radius: 6px;

  position: absolute;

  top: 0;

  left: 0;

  text-align: center;

  padding: 20px 30px;

}

@media only screen and (max-width: 576px) {

  .about-image-area3 .counter-area {

    top: 11px;

    left: 11px;

  }

}

.about-image-area3 .counter-area .title-main {

  margin-bottom: 3px;

  line-height: 1;

  font-size: 30px;

}

.about-image-area3 .about-award-area {

  position: absolute;

  z-index: 1;

  padding: 35px 37px 33px 38px;

  background-repeat: no-repeat;

  background-size: cover;

  background-position: center;

  box-shadow: 0px 4px 21px rgba(0, 0, 0, 0.1);

  left: 150px;

  bottom: -30px;

  background: #FFFFFF;

  box-shadow: 0px 4px 21px rgba(0, 0, 0, 0.07);

  border-radius: 6px;

}

@media only screen and (max-width: 1199px) {

  .about-image-area3 .about-award-area {

    padding: 20px;

    left: 14px;

  }

}

@media only screen and (max-width: 767px) {

  .about-image-area3 .about-award-area {

    left: 0;

  }

}

.about-image-area3 .about-award-area .award-inner {

  text-align: center;

}

.about-image-area3 .about-award-area .award-inner .star-rating-area {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 3px;

  background: rgba(177, 177, 177, 0.09);

  padding: 3px 13px 3px;

  border-radius: 3px;

  margin-bottom: 15px;

}

@media only screen and (max-width: 1199px) {

  .about-image-area3 .about-award-area .award-inner .star-rating-area {

    gap: 3px;

    background: rgba(255, 112, 41, 0.09);

    padding: 3px 12px 3px;

    border-radius: 4px;

    margin-bottom: 15px;

  }

}

.about-image-area3 .about-award-area .award-inner .star-rating-area li {

  color: #FFC107;

}

.about-image-area3 .about-award-area .award-inner .year {

  color: var(--color-primary-2);

  font-family: var(--font-primary);

  font-weight: 600;

  font-size: 30px;

  line-height: 37px;

  display: block;

  margin-bottom: 10px;

}

.about-image-area3 .about-award-area .award-inner .title {

  margin-bottom: 0;

}

.about-image-area3 .about-award-area .hot {

  position: absolute;

  z-index: 1;

  top: -30px;

  left: -20px;

}



.about-image-area4 {

  position: relative;

  z-index: 1;

}

.about-image-area4 .inner {

  border-radius: 6px;

  overflow: hidden;

  display: block;

  position: relative;

}

.about-image-area4 .main-image {

  clip-path: polygon(0% 1.441%, 0% 1.441%, 0.024% 1.207%, 0.095% 0.985%, 0.209% 0.779%, 0.361% 0.59%, 0.547% 0.422%, 0.765% 0.278%, 1.01% 0.161%, 1.278% 0.073%, 1.566% 0.019%, 1.869% 0%, 84.219% 0%, 84.219% 0%, 84.343% 0.003%, 84.466% 0.013%, 84.588% 0.028%, 84.708% 0.05%, 84.825% 0.078%, 84.94% 0.112%, 85.052% 0.151%, 85.161% 0.196%, 85.265% 0.247%, 85.366% 0.304%, 99.278% 8.645%, 99.278% 8.645%, 99.409% 8.731%, 99.528% 8.826%, 99.635% 8.927%, 99.729% 9.035%, 99.81% 9.149%, 99.877% 9.269%, 99.93% 9.392%, 99.969% 9.52%, 99.992% 9.65%, 100% 9.783%, 100% 98.559%, 100% 98.559%, 99.976% 98.793%, 99.905% 99.015%, 99.791% 99.221%, 99.639% 99.41%, 99.453% 99.578%, 99.235% 99.722%, 98.99% 99.839%, 98.722% 99.927%, 98.434% 99.981%, 98.131% 100%, 1.869% 100%, 1.869% 100%, 1.566% 99.981%, 1.278% 99.927%, 1.01% 99.839%, 0.765% 99.722%, 0.547% 99.578%, 0.361% 99.41%, 0.209% 99.221%, 0.095% 99.015%, 0.024% 98.793%, 0% 98.559%, 0% 1.441%);

}

.about-image-area4 .counter-area {

  background: var(--color-white);

  box-shadow: 0px 4px 21px rgba(0, 0, 0, 0.07);

  border-radius: 6px;

  position: absolute;

  bottom: 30px;

  left: 25px;

  text-align: start;

  padding: 30px;

}

.about-image-area4 .counter-area .icon {

  position: absolute;

  z-index: 1;

  top: -40px;

  left: 30px;

}

.about-image-area4 .counter-area .title-main {

  margin-bottom: 8px;

  line-height: 1;

}

.about-image-area4 .shape {

  position: absolute;

}

.about-image-area4 .shape.one {

  top: 0;

  left: 0;

}

.about-image-area4 .shape.two {

  bottom: 0;

  right: 0;

}

.about-image-area4 .video-btn {

  display: flex;

  align-items: center;

  gap: 20px;

  position: absolute;

  bottom: 50px;

  right: 50px;

}

@media only screen and (max-width: 576px) {

  .about-image-area4 .video-btn {

    left: 50%;

    top: 36%;

    transform: translate(-50%, -50%);

    bottom: auto;

    right: auto;

  }

}

.about-image-area4 .video-btn a {

  width: 74px;

  height: 74px;

  line-height: 85px;

  text-align: center;

  display: block;

  border-radius: 50%;

  color: var(--color-primary-2);

  background: var(--color-white);

  position: relative;

  z-index: 1;

}

.about-image-area4 .video-btn a i {

  font-size: 28px;

}

.about-image-area4 .video-btn a::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  border-radius: 50%;

  top: 0;

  left: 0;

  border: 1px solid var(--color-border);

  animation: pulse-border 4s linear infinite;

}



.tmp-about-area4 .right-side-content {

  margin-left: 45px;

}

.tmp-about-area4 .right-side-content p.desc {

  max-width: 533px;

}

@media only screen and (max-width: 576px) {

  .tmp-about-area4 .right-side-content p.desc {

    max-width: 100%;

  }

}

.tmp-about-area4 .right-side-content .about-feature-list-area {

  margin-top: 40px;

  display: flex;

  gap: 35px;

}

@media only screen and (max-width: 1199px) {

  .tmp-about-area4 .right-side-content .about-feature-list-area {

    margin-top: 20px;

  }

}

.tmp-about-area4 .right-side-content .about-feature-list-area h3 {

  margin-bottom: 15px;

  font-size: 20px;

}

.tmp-about-area4 .right-side-content .about-feature-list-area ul {

  display: flex;

  flex-direction: column;

  gap: 8px;

}

.tmp-about-area4 .right-side-content .about-feature-list-area ul li {

  display: flex;

  align-items: center;

  gap: 4px;

}

.tmp-about-area4 .right-side-content .about-feature-list-area ul li img {

  max-width: 16px;

  opacity: 0.6;

}

.tmp-about-area4 .right-side-content .about-feature-list-area .image {

  clip-path: polygon(0% 3.03%, 0% 3.03%, 0.025% 2.539%, 0.099% 2.072%, 0.217% 1.638%, 0.376% 1.241%, 0.571% 0.888%, 0.798% 0.585%, 1.053% 0.338%, 1.332% 0.154%, 1.632% 0.04%, 1.948% 0%, 85.62% 0%, 85.62% 0%, 85.763% 0.008%, 85.905% 0.032%, 86.044% 0.073%, 86.181% 0.128%, 86.315% 0.199%, 86.445% 0.285%, 86.571% 0.385%, 86.692% 0.499%, 86.808% 0.628%, 86.918% 0.77%, 99.349% 18.036%, 99.349% 18.036%, 99.468% 18.215%, 99.576% 18.409%, 99.672% 18.614%, 99.757% 18.831%, 99.83% 19.058%, 99.89% 19.293%, 99.938% 19.536%, 99.972% 19.785%, 99.993% 20.039%, 100% 20.296%, 100% 96.97%, 100% 96.97%, 99.975% 97.461%, 99.901% 97.928%, 99.783% 98.362%, 99.624% 98.759%, 99.429% 99.113%, 99.202% 99.415%, 98.947% 99.662%, 98.668% 99.846%, 98.368% 99.96%, 98.052% 100%, 1.948% 100%, 1.948% 100%, 1.632% 99.96%, 1.332% 99.846%, 1.053% 99.662%, 0.798% 99.415%, 0.571% 99.113%, 0.376% 98.759%, 0.217% 98.362%, 0.099% 97.928%, 0.025% 97.461%, 0% 96.97%, 0% 3.03%);

}

.tmp-about-area4 .right-side-content .button-area {

  margin-top: 40px;

}

@media only screen and (max-width: 1199px) {

  .tmp-about-area4 .right-side-content .button-area {

    margin-top: 20px;

  }

}

.tmp-about-area4 .right-side-content .button-area .call-btn {

  display: flex;

  gap: 15px;

  margin-bottom: 30px;

}

@media only screen and (max-width: 576px) {

  .tmp-about-area4 .right-side-content .button-area .call-btn {

    flex-wrap: wrap;

  }

}

.tmp-about-area4 .right-side-content .button-area .call-btn .icon {

  min-width: 60px;

  height: 60px;

  line-height: 55px;

  border-radius: 50%;

  border: 1px solid var(--color-border);

  display: block;

  text-align: center;

  transform: rotate(-45deg);

}

.tmp-about-area4 .right-side-content .button-area .call-btn .icon svg {

  max-width: 22px;

  height: auto;

}

.tmp-about-area4 .right-side-content .button-area .call-btn .text p {

  margin-bottom: 5px;

}

.tmp-about-area4 .right-side-content .button-area .call-btn .text a {

  font-family: var(--font-primary);

  color: var(--color-heading-1);

  font-weight: 600;

}

.tmp-about-area4 .right-side-content .button-area .tmp-btn {

  font-family: var(--font-primary);

}

.tmp-about-area4 .right-side-content.modern-about-1 .feature-list-wrap {

  display: flex;

  align-items: flex-start;

  gap: 25px;

}

@media only screen and (max-width: 767px) {

  .tmp-about-area4 .right-side-content.modern-about-1 .feature-list-wrap {

    flex-wrap: wrap;

    gap: 0;

  }

}

.tmp-about-area4 .right-side-content.modern-about-1 .feature-list-wrap ul li {

  font-weight: 500;

  color: var(--color-heading-1);

}

.tmp-about-area4 .right-side-content.modern-about-1 .feature-list-wrap ul li img {

  margin-right: 7px;

}



.tmp-tab-two-start ul.nav {

  padding: 0;

  border: none;

  margin-top: 0;

  margin-bottom: 0;

  max-width: 422px;

  display: block;

}

@media screen and (max-width: 1919px) {

  .tmp-tab-two-start ul.nav {

    padding: 15px;

  }

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-tab-two-start ul.nav {

    margin-top: 10px;

    margin-bottom: 14px;

  }

}

@media only screen and (max-width: 991px) {

  .tmp-tab-two-start ul.nav {

    max-width: 100%;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-tab-two-start ul.nav {

    margin: 10px 0;

    background: transparent !important;

  }

}

@media only screen and (max-width: 479px) {

  .tmp-tab-two-start ul.nav {

    padding: 0;

  }

}

.tmp-tab-two-start ul.nav li {

  margin: 0;

  padding: 0;

}

.tmp-tab-two-start ul.nav li:first-child button {

  padding-top: 0 !important;

}

.tmp-tab-two-start ul.nav li button {

  color: var(--color-heading-1);

  font-family: var(--font-primary);

  padding: 15px 0;

  margin: 0;

  display: flex;

  align-items: center;

  gap: 25px;

  background: none !important;

  border: none;

  font-weight: 600;

  font-size: 20px;

  border-radius: 0;

  position: relative;

  transition: all 0.3s;

  z-index: 1;

  text-align: start;

  line-height: 1.4;

}

@media only screen and (max-width: 576px) {

  .tmp-tab-two-start ul.nav li button {

    gap: 5px;

    font-size: 17px !important;

  }

}

.tmp-tab-two-start ul.nav li button .arrow {

  position: absolute;

  right: -60px;

  bottom: 3px;

  width: 82px;

  opacity: 0;

  transition: var(--transition);

}

.tmp-tab-two-start ul.nav li button svg {

  width: 70px;

  height: 70px;

  border-radius: 6px;

  background: var(--color-white);

  padding: 18px;

}

.tmp-tab-two-start ul.nav li button svg path {

  fill: var(--color-heading-1);

}

.tmp-tab-two-start ul.nav li button[aria-selected=true] {

  border: none;

  color: var(--color-primary-2);

  font-weight: 600;

}

@media only screen and (max-width: 479px) {

  .tmp-tab-two-start ul.nav li button[aria-selected=true] {

    margin-left: 0;

  }

}

.tmp-tab-two-start ul.nav li button[aria-selected=true] svg {

  background: var(--primary-100);

}

.tmp-tab-two-start ul.nav li button[aria-selected=true] svg path {

  fill: var(--color-primary-2);

}

.tmp-tab-two-start ul.nav li button[aria-selected=true] .arrow {

  opacity: 0.2;

}

.tmp-tab-two-start ul.nav li:not(:last-child) button {

  border-bottom: 1px solid var(--color-border) !important;

}



.single-tab-content-two {

  position: relative;

  z-index: 1;

  display: block;

  overflow: hidden;

  border-radius: 8px;

}

.single-tab-content-two .content {

  position: absolute;

  bottom: 40px;

  left: 30px;

  z-index: 2;

}

@media only screen and (max-width: 576px) {

  .single-tab-content-two .content {

    bottom: 25px;

    left: 25px;

  }

}

.single-tab-content-two .content h3 {

  color: var(--color-white);

  font-size: 30px;

  line-height: 1.2;

}

@media only screen and (max-width: 576px) {

  .single-tab-content-two .content h3 {

    font-size: 22px;

    line-height: 1.4;

  }

}

.single-tab-content-two::after {

  content: "";

  position: absolute;

  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 57.78%, rgba(0, 0, 0, 0.37) 70.79%, #000000 100%);

  width: 100%;

  height: 100%;

  left: 0;

  bottom: 0;

  z-index: 1;

}



.about-image-area5 {

  position: relative;

  z-index: 1;

  margin-right: 25px;

}

@media only screen and (max-width: 479px) {

  .about-image-area5 {

    margin-right: 0;

  }

}

.about-image-area5::before {

  content: "";

  position: absolute;

  background: var(--color-primary-2);

  width: 7px;

  height: 30%;

  border-radius: 2px;

  top: 0;

  right: -25px;

}

@media only screen and (max-width: 479px) {

  .about-image-area5::before {

    display: none;

  }

}

.about-image-area5::after {

  content: "";

  position: absolute;

  background: var(--color-primary-2);

  width: 7px;

  height: 60%;

  border-radius: 2px;

  bottom: 0;

  right: -25px;

}

@media only screen and (max-width: 479px) {

  .about-image-area5::after {

    display: none;

  }

}

.about-image-area5 img {

  border-radius: 4px;

}

.about-image-area5 .counter-area {

  background: var(--color-white);

  box-shadow: 0px 4px 21px rgba(0, 0, 0, 0.07);

  border-radius: 6px;

  position: absolute;

  bottom: 30px;

  left: 5px;

  text-align: start;

  padding: 30px;

  z-index: 10;

}

@media only screen and (max-width: 767px) {

  .about-image-area5 .counter-area {

    padding: 30px 30px 20px 30px;

    left: 80px;

  }

}

@media only screen and (max-width: 576px) {

  .about-image-area5 .counter-area {

    left: 8px;

    bottom: 8px;

  }

}

.about-image-area5 .counter-area .icon {

  position: absolute;

  z-index: 1;

  top: -40px;

  left: 30px;

}

.about-image-area5 .counter-area .title-main {

  margin-bottom: 8px;

  line-height: 1;

}

.about-image-area5 .shape {

  position: absolute;

}

.about-image-area5 .shape.one {

  top: 0;

  left: 0;

}

.about-image-area5 .shape.two {

  bottom: 0;

  right: 0;

}

.about-image-area5 .video-btn {

  display: flex;

  align-items: center;

  gap: 20px;

  position: absolute;

  bottom: 50px;

  right: 50px;

}

.about-image-area5 .video-btn a {

  width: 74px;

  height: 74px;

  line-height: 85px;

  text-align: center;

  display: block;

  border-radius: 50%;

  color: var(--color-primary-2);

  background: var(--color-white);

  position: relative;

  z-index: 1;

}

.about-image-area5 .video-btn a i {

  font-size: 28px;

}

.about-image-area5 .video-btn a::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  border-radius: 50%;

  top: 0;

  left: 0;

  border: 1px solid var(--color-border);

  animation: pulse-border 4s linear infinite;

}

.about-image-area5.modern-about-1 {

  margin-right: 0;

}

.about-image-area5.modern-about-1::before, .about-image-area5.modern-about-1::after {

  display: none;

}



.tmp-about-area5 {

  position: relative;

  z-index: 1;

  padding-bottom: 220px;

}

@media only screen and (max-width: 767px) {

  .tmp-about-area5 {

    padding-bottom: 140px;

  }

}

.tmp-about-area5 .section-title-area-3 {

  position: relative;

  z-index: 2;

}

.tmp-about-area5 .section-inner {

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 991px) {

  .tmp-about-area5 .section-inner .floating-img {

    display: none;

  }

}

.tmp-about-area5 .section-inner .floating-img img {

  position: absolute;

  z-index: -1;

}

.tmp-about-area5 .section-inner .floating-img img:nth-child(1) {

  top: -190px;

  left: 0;

}

.tmp-about-area5 .section-inner .floating-img img:nth-child(2) {

  top: -115px;

  right: 0;

}

.tmp-about-area5 .bottom-text {

  font-size: 24px;

  line-height: 1.4;

}

.tmp-about-area5 .bottom-text span {

  font-weight: 600;

}

.tmp-about-area5 .marquee {

  bottom: 60px;

}

.tmp-about-area5 .marquee .marquee__item .main--wrapper-tt {

  display: flex;

  align-items: center;

  gap: 20px;

  padding: 15px 0 0;

}

.tmp-about-area5 .marquee .marquee__item .main--wrapper-tt h2 {

  font-size: 130px;

  line-height: 1;

  font-weight: 600;

  width: max-content;

  -webkit-text-stroke: unset;

  -webkit-text-fill-color: unset;

  color: var(--color-primary);

}

@media only screen and (max-width: 767px) {

  .tmp-about-area5 .marquee .marquee__item .main--wrapper-tt h2 {

    font-size: 50px;

  }

}



.about-wrapper {

  position: relative;

  z-index: 1;

  display: flex;

  padding: 40px;

  border-radius: 6px;

  align-items: flex-start;

  background: #FFFFFF;

  box-shadow: 0px 10px 20px 10px rgba(0, 0, 0, 0.02);

  gap: 20px;

  transition: 0.3s;

}

.about-wrapper:hover {

  transform: scale(1.02);

}

.about-wrapper .icon {

  min-width: 95px;

}

.about-wrapper .content .title {

  margin-bottom: 15px;

  font-size: 20px;

  line-height: 1.2;

}

.about-wrapper.bg {

  background: var(--primary-100);

}



.bg-green {

  background: var(--color-primary-2) !important;

}



.cg {

  color: var(--color-primary-2) !important;

}

.cg::after {

  background: var(--color-primary-2) !important;

}



.bg-gray {

  background: #F6F6F6 !important;

}



.tmp-career-area {

  background: rgba(135, 171, 66, 0.05);

}

@media only screen and (max-width: 767px) {

  .tmp-career-area .rounded-player-2 {

    display: none;

  }

}

.tmp-career-area.area-2 .section-inner {

  background: url(../images/career/bg-02.webp);

  background-repeat: no-repeat;

  background-size: cover;

  background-position: center;

  position: relative;

  z-index: 1;

  background-attachment: fixed;

}

.tmp-career-area.area-2 .section-inner::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  z-index: -1;

  background: linear-gradient(269deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.77) 100%);

}

.tmp-career-area.area-2 .section-inner .content-area .tmp-btn {

  border-radius: 4px;

}



.contact-map.map-incompany-value {

  height: 100%;

}

@media only screen and (max-width: 991px) {

  .contact-map.map-incompany-value {

    height: 450px;

  }

}



.tmp-apply-area .nav-tabs {

  display: flex;

  align-items: center;

  gap: 10px;

  margin: 40px 0;

  border: none;

  margin-top: 50px;

}

.tmp-apply-area .nav-tabs li button {

  line-height: 1;

  font-family: var(--font-primary);

  color: var(--color-heading-1);

  font-weight: 600;

  padding: 20px 35px;

  border-radius: 4px;

  background: var(--primary-100);

  border: none;

}

@media only screen and (max-width: 767px) {

  .tmp-apply-area .nav-tabs li button {

    padding: 10px 11px;

  }

}

.tmp-apply-area .nav-tabs li button.active {

  background: var(--color-primary-2);

  color: var(--color-white);

}



.apply-wrapper {

  position: relative;

  z-index: 1;

}

.apply-wrapper:hover .image-area img {

  transform: scale(105%);

}

.apply-wrapper:hover .content .title a {

  color: var(--color-primary-2);

}

.apply-wrapper:hover .content .text-btn::after {

  width: 100%;

}

.apply-wrapper .image-area {

  overflow: hidden;

  border-radius: 6px;

}

.apply-wrapper .image-area img {

  transform: scale(100%);

  transition: var(--transition);

}

.apply-wrapper .content {

  margin-top: 30px;

}

.apply-wrapper .content .title {

  font-size: 30px;

  line-height: 1.2;

}

@media only screen and (max-width: 576px) {

  .apply-wrapper .content .title {

    font-size: 24px;

  }

}

.apply-wrapper .content .title a {

  color: var(--color-heading-1);

  transition: var(--transition);

}

.apply-wrapper .content .title a:hover {

  color: var(--color-primary-2);

}

.apply-wrapper .content .desc {

  color: #717580;

  margin-bottom: 20px;

}

.apply-wrapper .content .text-btn {

  color: var(--color-heading-1);

  font-weight: 600;

  position: relative;

  z-index: 1;

  line-height: 1;

  padding-bottom: 7px;

}



.tmp-solar-energy-area {

  position: relative;

  z-index: 1;

}

.tmp-solar-energy-area .section-inner {

  margin-top: 60px;

}



.tmp-faq-area.career .section-title-area-3 p.desc {

  max-width: 60%;

  margin: auto;

  text-align: center;

}

@media only screen and (max-width: 767px) {

  .tmp-faq-area.career .section-title-area-3 p.desc {

    max-width: 100%;

  }

}

.tmp-faq-area.career .section-inner {

  margin-top: 60px;

}

.tmp-faq-area.career .section-inner .image-area {

  border-radius: 4px;

  display: block;

  position: relative;

  z-index: 1;

  overflow: hidden;

}

.tmp-faq-area.career .section-inner .image-area::before {

  position: absolute;

  content: "";

  top: -35%;

  left: -35%;

  height: 450px;

  width: 450px;

  border-radius: 50%;

  mix-blend-mode: multiply;

  border: 85px solid var(--color-primary);

}

.tmp-faq-area.career .section-inner .accordion-one .accordion-item {

  padding-bottom: 0;

  margin-bottom: 20px;

  border: none;

}

.tmp-faq-area.career .section-inner .accordion-one .accordion-item:last-child {

  margin-bottom: 0;

}

.tmp-faq-area.career .section-inner .accordion-one .accordion-item h2 {

  margin-bottom: 0;

}

.tmp-faq-area.career .section-inner .accordion-one .accordion-item h2 button {

  padding: 18px 30px 17px;

  border-radius: 33px;

  color: var(--color-heading-1);

  background: #f4f4f4;

}

@media only screen and (max-width: 576px) {

  .tmp-faq-area.career .section-inner .accordion-one .accordion-item h2 button {

    padding: 16px 15px 17px;

  }

}

.tmp-faq-area.career .section-inner .accordion-one .accordion-item .accordion-body {

  margin-left: 30px;

  padding-top: 20px;

}

@media only screen and (max-width: 576px) {

  .tmp-faq-area.career .section-inner .accordion-one .accordion-item .accordion-body {

    margin-left: 5px;

  }

}

.tmp-faq-area.career .section-inner .accordion-one .accordion-item .accordion-body p.desc {

  font-size: 16px;

}

.tmp-faq-area.career .section-inner .accordion-one .accordion-item .accordion-body p.desc:not(:last-child) {

  margin-bottom: 10px;

}

.tmp-faq-area.career .section-inner .accordion-one .accordion-item h2 button[aria-expanded=true] {

  color: var(--color-white);

  background: var(--primary-700);

}

.tmp-faq-area.career .section-inner .accordion-one .accordion-item h2 button[aria-expanded=true]::after {

  margin-top: 0;

}



.tmp-social-area ul {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 15px;

  margin-top: 60px;

}

.tmp-social-area ul li {

  font-size: 38px;

}

.tmp-social-area ul li a {

  width: 58px;

  height: 58px;

  color: var(--color-primary);

  display: flex;

  align-items: center;

  justify-content: center;

  background: var(--primary-100);

  border-radius: 50%;

  position: relative;

  z-index: 1;

}

.tmp-social-area ul li a::after {

  position: absolute;

  content: "";

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  z-index: -1;

  background: var(--color-primary);

  transform: scale(0.5);

  opacity: 0;

  transition: 0.3s;

  border-radius: 100%;

  border: 2px solid var(--color-primary);

}

.tmp-social-area ul li a i {

  font-size: 22px;

}

.tmp-social-area ul li a:hover i {

  color: var(--color-white);

}

.tmp-social-area ul li a:hover::after {

  transform: scale(1);

  opacity: 1;

}



.award-wrapper {

  text-align: center;

  background: var(--color-white);

  box-shadow: var(--shadow-1);

  border-radius: 6px;

  transition: 0.3s;

  padding: 15px;

  height: 100%;

}

.award-wrapper .icon {

  margin-bottom: 0;

  margin-bottom: 20px;

  transition: 0.3s;

}

.award-wrapper .icon img {

  width: 100%;

}

.award-wrapper p {

  margin-bottom: 15px;

}

.award-wrapper h6,

.award-wrapper h3,

.award-wrapper h2 {

  font-size: 20px;

  line-height: 1;

  margin-bottom: 0;

}

.award-wrapper:hover {

  transform: scale(1.02);

}



@media only screen and (max-width: 991px) {

  .thumbnail-breadcrumb-large img {

    width: 100%;

  }

}



@media only screen and (max-width: 991px) {

  .contact-in-application {

    height: 450px !important;

  }

}



.privacy-wrapper-area .title {

  font-size: 30px;

  line-height: 1.4;

}

@media only screen and (max-width: 576px) {

  .privacy-wrapper-area .title {

    font-size: 24px;

  }

}



.tmp-application-form-area {

  margin-top: 50px;

  display: flex;

  align-items: center;

  background: var(--color-white);

  gap: 70px;

  padding-right: 40px;

  box-shadow: var(--shadow-1);

  border-radius: 6px;

  overflow: hidden;

}

@media only screen and (max-width: 991px) {

  .tmp-application-form-area {

    padding: 20px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-application-form-area {

    padding: 20px;

  }

}

.tmp-application-form-area .application-form {

  flex-basis: 58%;

}

.tmp-application-form-area .application-form h5,

.tmp-application-form-area .application-form h4 {

  font-size: 20px;

}

.tmp-application-form-area .application-form .form-inner .single-wrapper input {

  background: var(--color-white);

  padding: 11px 15px;

  box-shadow: 0px 0px 30px 7px rgba(0, 0, 0, 0.04);

  border-radius: 4px;

  border: 2px solid transparent;

}

.tmp-application-form-area .application-form .form-inner .single-wrapper input:focus {

  border: 2px solid var(--color-primary);

}

.tmp-application-form-area .application-form .form-inner .single-wrapper input::placeholder {

  color: var(--color-body-2) !important;

}

.tmp-application-form-area .application-form .form-inner .single-wrapper input[type=file] {

  padding: 10px;

  cursor: pointer;

  background: #fff;

  border: 1px solid transparent;

  height: 54px;

}

.tmp-application-form-area .application-form .form-inner .single-wrapper input[type=file]:focus {

  border-color: var(--color-primary);

}

.tmp-application-form-area .application-form .form-inner .single-wrapper input::file-selector-button {

  width: 125px;

  height: 32px;

  margin-inline-end: 10px;

  color: var(--color-primary);

  background: #cee0e0;

  border: none;

  border-radius: 6px;

  cursor: pointer;

}

.tmp-application-form-area .application-form .form-inner .single-wrapper textarea {

  background: var(--color-white);

  padding: 11px 15px;

  box-shadow: 0px 0px 30px 7px rgba(0, 0, 0, 0.04);

  border-radius: 4px;

  height: 150px;

  border: 2px solid transparent;

}

.tmp-application-form-area .application-form .form-inner .single-wrapper textarea:focus {

  border: 2px solid var(--color-primary);

}

.tmp-application-form-area .application-form .form-inner .single-wrapper textarea::placeholder {

  color: var(--color-body-2) !important;

}

.tmp-application-form-area .application-form .form-inner .single-wrapper .attach {

  background: var(--color-white);

  box-shadow: 0px 0px 30px 7px rgba(0, 0, 0, 0.04);

  border-radius: 4px;

  height: 53px;

  position: relative;

}

.tmp-application-form-area .application-form .form-inner .single-wrapper .attach .upload-btn {

  position: absolute;

  width: 100%;

  height: 100%;

  left: 0;

  top: 0;

  display: inline-flex;

  align-items: center;

  background-color: #fff;

  color: var(--color-body-2);

  border-radius: 4px;

  cursor: pointer;

  gap: 8px;

  font-size: 16px;

}

.tmp-application-form-area .application-form .form-inner .single-wrapper button.tmp-btn {

  max-width: 100%;

  width: 100%;

  border: 1px solid var(--color-primary-2);

  padding: 19px 33px;

}



.marquee.area-ten.inner {

  background: var(--color-white);

  box-shadow: var(--shadow-1);

  padding: 30px 0 !important;

}



.tmp-working-process-area3.bg_gradient-light {

  background: linear-gradient(2deg, rgb(246, 246, 246) 0%, rgb(255, 255, 255) 100%);

}



.tmp-about-area.safety .image-area {

  border-radius: 6px;

  overflow: hidden;

  position: relative;

  z-index: 1;

  max-width: max-content;

}

@media only screen and (max-width: 1199px) {

  .tmp-about-area.safety .image-area img {

    width: 100%;

  }

}

.tmp-about-area.safety .image-area .about-award-area {

  position: absolute;

  z-index: 1;

  padding: 35px 37px 33px 38px;

  background-repeat: no-repeat;

  background-size: cover;

  background-position: center;

  box-shadow: 0px 4px 21px rgba(0, 0, 0, 0.1);

  right: 0;

  bottom: 0;

  background: #FFFFFF;

  box-shadow: 0px 4px 21px rgba(0, 0, 0, 0.07);

  border-radius: 8px 0 0 0;

}

@media only screen and (max-width: 991px) {

  .tmp-about-area.safety .image-area .about-award-area {

    margin: 0;

    margin-bottom: 0;

  }

}

.tmp-about-area.safety .image-area .about-award-area::before {

  content: "";

  position: absolute;

  inset-inline-start: 0;

  top: -13px;

  width: 13px;

  height: 13px;

  background: url(../images/about/curve-right-top.svg);

  transform: rotate(-90deg);

  inset-inline-start: inherit;

  inset-inline-end: 0;

  -webkit-transform: rotate(180deg);

  -ms-transform: rotate(180deg);

  transform: rotate(180deg);

}

.tmp-about-area.safety .image-area .about-award-area::after {

  content: "";

  position: absolute;

  inset-inline-start: 0;

  top: -13px;

  width: 13px;

  height: 13px;

  background: url(../images/about/curve-left-bottom.svg);

  transform: rotate(-90deg);

  nset-inline-start: auto;

  top: auto;

  inset-inline-end: -13px;

  bottom: 0;

  -webkit-transform: rotate(180deg);

  -ms-transform: rotate(180deg);

  transform: rotate(180deg);

  inset-inline-start: -12px;

  inset-inline-end: inherit;

}

.tmp-about-area.safety .image-area .about-award-area .award-inner {

  text-align: center;

}

.tmp-about-area.safety .image-area .about-award-area .award-inner .star-rating-area {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 3px;

  background: var(--color-primary);

  padding: 6px 18px 9px;

  border-radius: 26px;

  margin-bottom: 15px;

}

.tmp-about-area.safety .image-area .about-award-area .award-inner .star-rating-area li {

  color: #FFC107;

  line-height: 1;

}

.tmp-about-area.safety .image-area .about-award-area .award-inner .year {

  color: var(--color-primary-2);

  font-family: var(--font-primary);

  font-weight: 600;

  font-size: 30px;

  line-height: 37px;

  display: block;

  margin-bottom: 10px;

}

.tmp-about-area.safety .image-area .about-award-area .award-inner .title {

  margin-bottom: 0;

}

.tmp-about-area.safety .image-area .about-award-area .hot {

  position: absolute;

  z-index: 1;

  top: -30px;

  left: -20px;

}

.tmp-about-area.safety .right-content-area .tmp-counter-area .counter-inner {

  padding: 0;

  margin-top: 0;

  justify-content: start;

  box-shadow: none;

  gap: 100px;

  margin-bottom: 50px;

}

@media only screen and (max-width: 1199px) {

  .tmp-about-area.safety .right-content-area .tmp-counter-area .counter-inner {

    gap: 40px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-about-area.safety .right-content-area .tmp-counter-area .counter-inner {

    gap: 30px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-about-area.safety .right-content-area .tmp-counter-area .counter-inner {

    gap: 20px;

  }

}



.tmp-timeline-area .section-inner {

  position: relative;

  z-index: 1;

}

.tmp-timeline-area .section-inner::after {

  content: "";

  position: absolute;

  background: rgba(135, 171, 66, 0.1);

  width: 100%;

  height: 1px;

  top: 75px;

  left: 0;

  z-index: -1;

}



@media only screen and (max-width: 767px) {

  .home-inner .marquee.area-ten {

    margin-top: 0;

  }

}



.tmp-office-branch-area .section-inner .section-title-area {

  display: flex;

  justify-content: space-between;

  align-items: center;

  margin-bottom: 30px;

}

.tmp-office-branch-area .section-inner .section-title-area .section-title {

  margin-bottom: 0;

}

.tmp-office-branch-area .section-inner .section-title-area .tmp-btn {

  display: flex;

  align-items: center;

  gap: 5px;

}



.tmp-map-area .contact-map {

  padding: 0;

}

.tmp-map-area .contact-map iframe {

  width: 100%;

  height: 600px !important;

  filter: grayscale(0);

}



.g-20, .gx-20 {

  --bs-gutter-y: 2rem;

}



.g-20, .gy-20 {

  --bs-gutter-y: 1.8rem;

}



.home-green .about-award-area .award-inner .star-rating-area {

  background: var(--primary-100);

  padding: 2px 6px 2px;

  border-radius: 3px;

}

.home-green .about-award-area .award-inner .star-rating-area i {

  font-size: 13px;

}



.privacy-wrapper-area ol {

  transition: 0.3s;

  margin-bottom: 40px;

  padding-left: 17px;

}

.privacy-wrapper-area ol:last-child {

  margin-bottom: 0;

}

.privacy-wrapper-area .button-wrapper {

  display: flex;

  align-items: center;

  gap: 15px;

  justify-content: start;

}



.about-bento-style-images {

  position: relative;

  display: flex;

  flex-wrap: wrap;

}

.about-bento-style-images .image-1 {

  left: -30px;

  position: relative;

}

@media only screen and (max-width: 991px) {

  .about-bento-style-images .image-1 {

    left: 0;

    width: 100%;

  }

  .about-bento-style-images .image-1 img {

    width: 100%;

  }

}

.about-bento-style-images .image-2 {

  position: absolute;

  right: -110px;

  top: 0;

}

@media only screen and (max-width: 1199px) {

  .about-bento-style-images .image-2 {

    display: none;

  }

}

.about-bento-style-images .image-3 {

  position: relative;

  left: 120px;

  top: -179px;

}

@media only screen and (max-width: 1199px) {

  .about-bento-style-images .image-3 {

    display: none;

  }

}

.about-bento-style-images.bento-left-style .image-1 {

  left: -80px;

}

@media only screen and (max-width: 1199px) {

  .about-bento-style-images.bento-left-style .image-1 {

    left: 0;

    width: 100%;

  }

  .about-bento-style-images.bento-left-style .image-1 img {

    width: 100%;

  }

}

.about-bento-style-images.bento-left-style .image-2 {

  right: 0;

}



.about-feature-wrapper {

  padding: 20px 25px;

  border-radius: 6px;

  display: flex;

  align-items: flex-start;

  gap: 25px;

  box-shadow: var(--shadow-1);

  margin-top: 35px;

  margin-right: 15%;

  transition: 0.3s;

}

@media only screen and (max-width: 1199px) {

  .about-feature-wrapper {

    margin-top: 10px;

  }

}

.about-feature-wrapper:hover .icon i {

  animation: bounceIn 0.8s ease;

}

@media only screen and (max-width: 767px) {

  .about-feature-wrapper {

    flex-wrap: wrap;

    margin-right: 0;

  }

}

.about-feature-wrapper .icon {

  background: var(--primary-100);

  box-shadow: var(--shadow-1);

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  height: 55px;

  min-width: 55px;

}

.about-feature-wrapper .icon i {

  color: var(--color-primary);

  font-size: 26px;

  line-height: 26px;

}

.about-feature-wrapper .content .title {

  margin-bottom: 15px;

  font-size: 24px;

  line-height: 1;

}

.about-feature-wrapper .content p.disc {

  margin-bottom: 0;

}



@media only screen and (max-width: 1199px) {

  .about-carpenter-area .section-title {

    font-size: 32px !important;

  }

}

@media only screen and (max-width: 991px) {

  .about-carpenter-area .section-title {

    font-size: 26px !important;

  }

}

@media only screen and (max-width: 1199px) {

  .about-carpenter-area .section-title br {

    display: none;

  }

}



.box-about-section-area {

  box-shadow: var(--shadow-1);

  background: var(--color-white);

  padding: 60px 80px 60px 80px;

  border-radius: 5px 5px 5px 5px;

}

@media only screen and (max-width: 1199px) {

  .box-about-section-area {

    padding: 0;

    border-radius: 0;

    box-shadow: none;

  }

}

@media only screen and (max-width: 767px) {

  .box-about-section-area {

    padding: 0;

    box-shadow: none;

  }

}

.box-about-section-area .content-counter {

  position: relative;

  padding-left: 30px;

  border-left: 3px solid var(--color-border);

  transition: 0.3s;

}

.box-about-section-area .content-counter:hover {

  border-color: var(--color-primary);

}

.box-about-section-area .content-counter .title {

  margin-bottom: 0;

}

.box-about-section-area .button-wrapper-flex {

  display: flex;

  align-items: center;

  gap: 25px;

  margin-top: 50px;

  flex-wrap: wrap;

}

.box-about-section-area .call-btn {

  display: flex;

  gap: 15px;

  margin-bottom: 0;

}

@media only screen and (max-width: 576px) {

  .box-about-section-area .call-btn {

    flex-wrap: wrap;

  }

}

.box-about-section-area .call-btn .icon {

  min-width: 60px;

  height: 60px;

  line-height: 55px;

  border-radius: 50%;

  border: 1px solid var(--color-border);

  display: block;

  text-align: center;

  transform: rotate(-45deg);

}

.box-about-section-area .call-btn .icon svg {

  max-width: 22px;

  height: auto;

}

.box-about-section-area .call-btn .text p {

  margin-bottom: 5px;

}

.box-about-section-area .call-btn .text a {

  font-family: var(--font-primary);

  color: var(--color-heading-1);

  font-weight: 600;

}



.appoinment-about {

  padding: 55px;

  background: var(--color-primary);

  border-radius: 6px;

}

@media only screen and (max-width: 1199px) {

  .appoinment-about {

    padding: 25px;

  }

}

.appoinment-about .title {

  color: var(--color-white);

  text-align: center;

}

.appoinment-about .single-input-wrapper {

  width: 100%;

  margin-bottom: 30px;

}

.appoinment-about .single-input-wrapper input {

  height: 45px;

  border: 1px solid rgba(255, 255, 255, 0.19);

  border-radius: 4px;

  color: var(--color-white);

  padding: 15px;

}

.appoinment-about .single-input-wrapper input::placeholder {

  color: #fff !important;

}

.appoinment-about .single-input-wrapper input:focus {

  border-color: var(--color-white);

}

.appoinment-about textarea {

  border: 1px solid rgba(255, 255, 255, 0.19);

  height: 150px;

  border-radius: 4px;

  padding: 15px;

}

.appoinment-about textarea::placeholder {

  color: #fff !important;

}

.appoinment-about textarea:focus {

  border-color: var(--color-white);

}

.appoinment-about .tmp-btn.btn-primary {

  background: var(--color-white);

  border: none;

  box-shadow: none;

}

.appoinment-about .tmp-btn.btn-primary * {

  color: var(--color-heading-1);

}

.appoinment-about .tmp-btn.btn-primary::after {

  background: var(--color-heading-1) !important;

}

.appoinment-about .tmp-btn.btn-primary:hover * {

  color: var(--color-white);

}



.about-card-new {

  padding: 35px 30px;

  background: var(--color-white);

  box-shadow: 0px 6px 34px rgba(215, 216, 222, 0.41);

  height: 100%;

  border-radius: 4px;

}

.about-card-new .content {

  margin-top: 190px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .about-card-new .content {

    margin-top: 120px;

  }

}

@media only screen and (max-width: 1199px) {

  .about-card-new .content {

    margin-top: 58px;

  }

}

.about-card-new p.desc {

  margin-bottom: 10px;

  font-size: 24px;

  color: var(--color-heading-1);

  font-weight: 500;

}

.about-card-new .title {

  font-size: 80px;

  font-weight: 700;

  margin-bottom: 0;

}

.about-card-new:hover .icon svg {

  animation: bounceIn 0.8s ease;

}



.hover-grascale img {

  filter: grayscale(0.5);

  transition: 0.3s;

}

.hover-grascale:hover img {

  filter: grayscale(0);

}



.award-area-about-wrapper {

  display: flex;

  align-items: center;

  gap: 30px;

  margin-top: 35px;

}

@media only screen and (max-width: 767px) {

  .award-area-about-wrapper {

    flex-wrap: wrap;

    gap: 20px;

  }

}

.award-area-about-wrapper .single-award {

  display: flex;

  align-items: center;

  gap: 20px;

}

.award-area-about-wrapper .single-award .icon {

  width: 78px;

  height: 78px;

  background: var(--color-white);

  box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.06);

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

}

.award-area-about-wrapper .single-award .icon i {

  font-size: 40px;

  color: var(--color-primary);

}

.award-area-about-wrapper .single-award .title {

  font-size: 22px;

  line-height: 1.4;

  font-weight: 500;

  margin: 0;

}



.about-style-three-content .feature {

  position: relative;

  margin-bottom: 25px;

  padding-right: 20px;

}

.about-style-three-content .feature strong {

  display: block;

  font-size: 24px;

  font-weight: 700;

  margin-bottom: 10px;

  color: var(--color-heading-1);

  position: relative;

  padding-left: 20px;

}

.about-style-three-content .feature strong::after {

  position: absolute;

  left: 0;

  top: 50%;

  transform: translateY(-50%);

  content: "";

  height: 10px;

  width: 10px;

  background: var(--color-primary);

  border-radius: 50%;

}

.about-style-three-content .content-box {

  position: relative;

  padding: 35px 35px;

  border-radius: 12px;

  background-color: var(--color-primary);

}

@media only screen and (max-width: 576px) {

  .about-style-three-content .content-box {

    padding: 20px 20px;

  }

}

.about-style-three-content .content-box .icon svg path {

  stroke: #ffffff;

  stroke-width: 2px;

}

.about-style-three-content .content-box .title {

  color: var(--color-white);

  font-size: 28px;

  margin-top: 40px;

}

.about-style-three-content .content-box .content-text {

  color: var(--color-white);

}



.thumbnail-image-about-three {

  border-radius: 10px;

  display: block;

  overflow: hidden;

}



.tmp-banner-one {

  position: relative;

  z-index: 1;

  overflow: hidden;

  background: linear-gradient(3deg, rgb(255, 255, 255) 0%, rgb(255, 238, 227) 100%);

}

.tmp-banner-one::after {

  position: absolute;

  content: "";

  z-index: -1;

  width: 100%;

  height: 100%;

  background: var(--color-white);

  top: 0;

  left: 0;

  opacity: 0.5;

  display: none;

}

@media only screen and (max-width: 1199px) {

  .tmp-banner-one::after {

    display: block;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-banner-one::after {

    opacity: 1;

  }

}

.tmp-banner-one .banner-shape-area .shape {

  position: absolute;

  z-index: -1;

  top: 0;

  right: 0;

  height: 100%;

}

.tmp-banner-one .banner-hero-image img {

  position: absolute;

  top: 0;

  right: 0;

  height: 100%;

  z-index: -1;

}

@media only screen and (max-width: 991px) {

  .tmp-banner-one .banner-hero-image img {

    object-fit: cover;

  }

}

.tmp-banner-one .banner-one-wrapper div.b_one-pre {

  letter-spacing: 0.5px;

  font-weight: 500;

  font-size: 16px;

  line-height: 1;

  font-family: var(--font-primary);

  color: var(--color-heading-1);

  display: block;

  background: var(--color-primary);

  max-width: max-content;

  padding: 17px 24px 17px 20px;

  box-shadow: var(--shadow-1);

  background: #fff;

  border-radius: 4px;

  position: relative;

  z-index: 1;

}

.tmp-banner-one .banner-one-wrapper div.b_one-pre::before {

  position: absolute;

  top: 50%;

  right: -19px;

  left: -19px;

  -webkit-transform: translateY(-50%);

  -moz-transform: translateY(-50%);

  transform: translateY(-50%);

  height: 45px;

  width: -moz-calc(100% + 38px);

  width: calc(100% + 38px);

  background: rgba(255, 255, 255, 0.5);

  -webkit-box-shadow: 0 0 29px rgba(209, 211, 237, 0.3882352941);

  box-shadow: 0 0 29px rgba(209, 211, 237, 0.3882352941);

  z-index: -1;

  content: "";

  -webkit-clip-path: polygon(100% 0, 97% 50%, 100% 100%, 0 100%, 3% 50%, 0 0);

  clip-path: polygon(100% 0, 97% 50%, 100% 100%, 0 100%, 3% 50%, 0 0);

}

.tmp-banner-one .banner-one-wrapper .title-banner {

  margin-top: 20px;

  font-weight: 600;

  font-size: 55px;

  line-height: 72px;

  color: var(--color-black);

  margin-bottom: 20px;

  transition-delay: 1s;

}

@media only screen and (max-width: 1199px) {

  .tmp-banner-one .banner-one-wrapper .title-banner {

    font-size: 49px;

    line-height: 70px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-banner-one .banner-one-wrapper .title-banner {

    font-size: 42px;

    line-height: 56px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-banner-one .banner-one-wrapper .title-banner {

    font-size: 42px;

    line-height: 56px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-banner-one .banner-one-wrapper .title-banner {

    font-size: 30px;

    line-height: 45px;

  }

}

.tmp-banner-one .banner-one-wrapper .desc {

  max-width: 535px;

}

@media only screen and (max-width: 1199px) {

  .tmp-banner-one .banner-one-wrapper .desc {

    color: var(--color-heading-1);

  }

}

.tmp-banner-one .banner-one-wrapper .button-area-banner {

  display: flex;

  align-items: center;

  gap: 20px;

  transition-delay: 2s;

}

@media only screen and (max-width: 576px) {

  .tmp-banner-one .banner-one-wrapper .button-area-banner {

    flex-direction: column;

    justify-content: flex-start;

    align-items: flex-start;

  }

}

.tmp-banner-one .banner-one-wrapper .button-area-banner .tmp-btn {

  font-family: var(--font-primary);

  font-weight: 700;

  padding: 21px 33px;

}

.tmp-banner-one .banner-one-wrapper .call-area {

  display: flex;

  align-items: center;

}

.tmp-banner-one .banner-one-wrapper .call-area .icon {

  margin-right: 13px;

}

.tmp-banner-one .banner-one-wrapper .call-area .icon i {

  width: 52px;

  height: 52px;

  background: #fff;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  transform: rotate(-35deg);

  color: var(--color-primary);

  font-weight: 600;

}

.tmp-banner-one .banner-one-wrapper .call-area .detail span {

  display: block;

  text-transform: capitalize;

}

.tmp-banner-one .banner-one-wrapper .call-area .detail a.number {

  font-weight: 700;

  font-size: 24px;

  color: #fff;

  line-height: 37px;

  transition: 0.3s;

}

.tmp-banner-one .banner-one-wrapper .call-area .detail a.number:hover {

  color: var(--color-primary);

}



.banner-two-main-wrapper {

  position: relative;

  z-index: 1;

  height: 900px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .banner-two-main-wrapper {

    overflow: hidden;

  }

}

.banner-two-main-wrapper .banner-hero-image {

  position: absolute;

  z-index: -1;

  top: 0;

  right: 0;

}

@media (max-width: 991px) {

  .banner-two-main-wrapper .banner-hero-image img:nth-child(1) {

    display: none;

  }

}

@media (min-width: 992px) {

  .banner-two-main-wrapper .banner-hero-image img:nth-child(2) {

    display: none;

  }

}

.banner-two-main-wrapper::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  left: 0;

  top: 0;

  z-index: -2;

  background: #1F242E;

}

.banner-two-main-wrapper .watermark {

  position: absolute;

  z-index: 2;

  text-transform: uppercase;

  text-align: center;

  margin: auto;

  display: block;

  font-size: 200px;

  line-height: 1;

  font-weight: 600;

  font-family: var(--font-secondary);

}

@media only screen and (max-width: 576px) {

  .banner-two-main-wrapper .watermark {

    font-size: 48px !important;

  }

}

.banner-two-main-wrapper .watermark.one {

  top: 40px;

  left: 4%;

  -webkit-text-fill-color: transparent;

  -webkit-text-stroke-width: 2px;

  -webkit-text-stroke-color: rgba(255, 255, 255, 0.09);

}

.banner-two-main-wrapper .watermark.two {

  bottom: 0;

  right: 3%;

  -webkit-text-fill-color: transparent;

  -webkit-text-stroke-width: 2px;

  -webkit-text-stroke-color: rgba(255, 255, 255, 0.09);

}

@media only screen and (max-width: 576px) {

  .banner-two-main-wrapper .watermark.two {

    font-size: 50px;

  }

}

.banner-two-main-wrapper img.sun {

  position: absolute;

  z-index: -1;

  bottom: 40px;

  left: 40px;

  animation: rotateIt 20s linear infinite;

}

.banner-two-main-wrapper .banner-one-wrapper span.b_one-pre {

  letter-spacing: 0.1em;

  font-weight: 500;

  font-size: 16px;

  line-height: 1;

  font-family: var(--font-primary);

  color: var(--color-white);

  text-transform: uppercase;

  transition-delay: 0.5s;

  display: block;

  max-width: max-content;

  clip-path: polygon(0% 0%, 100% 0%, 95.241% 100%, 0% 100%, 0% 0%);

}

.banner-two-main-wrapper .banner-one-wrapper .title-banner {

  margin-top: 20px;

  font-weight: 600;

  font-size: 55px;

  line-height: 73px;

  color: var(--color-white);

  margin-bottom: 20px;

  transition-delay: 1s;

}

@media only screen and (max-width: 1199px) {

  .banner-two-main-wrapper .banner-one-wrapper .title-banner {

    font-size: 49px;

    line-height: 70px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .banner-two-main-wrapper .banner-one-wrapper .title-banner {

    font-size: 42px;

    line-height: 56px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-two-main-wrapper .banner-one-wrapper .title-banner {

    font-size: 42px;

    line-height: 56px;

  }

}

@media only screen and (max-width: 576px) {

  .banner-two-main-wrapper .banner-one-wrapper .title-banner {

    font-size: 30px;

    line-height: 45px;

  }

}

.banner-two-main-wrapper .banner-one-wrapper .desc {

  color: #E0E0E0;

}

.banner-two-main-wrapper .banner-one-wrapper .button-area-banner {

  display: flex;

  align-items: center;

  gap: 20px;

  transition-delay: 2s;

}

@media only screen and (max-width: 576px) {

  .banner-two-main-wrapper .banner-one-wrapper .button-area-banner {

    flex-direction: column;

    justify-content: flex-start;

    align-items: flex-start;

  }

}

.banner-two-main-wrapper .banner-one-wrapper .button-area-banner .tmp-btn {

  font-family: var(--font-primary);

  font-weight: 700;

  padding: 21px 33px;

}

.banner-two-main-wrapper .banner-one-wrapper .button-area-banner .text-btn {

  display: flex;

  align-items: center;

  gap: 20px;

  font-weight: 400;

}

.banner-two-main-wrapper .banner-one-wrapper .button-area-banner .text-btn .arrow {

  width: 60px;

  height: 60px;

  line-height: 65px;

  text-align: center;

  display: block;

  border-radius: 50%;

  color: var(--color-white);

  background: rgba(255, 255, 255, 0.2);

  position: relative;

  z-index: 1;

}

.banner-two-main-wrapper .banner-one-wrapper .button-area-banner .text-btn .arrow i {

  transform: rotate(-45deg);

  font-size: 20px;

}

.banner-two-main-wrapper .banner-one-wrapper .button-area-banner .text-btn .arrow::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  border-radius: 50%;

  top: 0;

  left: 0;

  background: rgba(255, 255, 255, 0.03);

  animation: pulse-border 4s linear infinite;

}

.banner-two-main-wrapper .banner-one-wrapper .button-area-banner .text-btn p {

  font-size: 20px;

  line-height: 24px;

  font-family: var(--font-primary);

  color: var(--color-white);

  font-weight: 600;

}



.tmp-banner-slider-area.banner-wind-energy.banner-nine .banner-five-main-wrapper.industry-banner-before::before {

  backdrop-filter: blur(0);

  background: rgba(92, 156, 234, 0.79);

}



.banner-five-main-wrapper {

  position: relative;

  z-index: 1;

  height: 860px;

}

.banner-five-main-wrapper.industry-bg-1 {

  background-image: url(../images/bg/industry-1.webp);

}

.banner-five-main-wrapper.industry-bg-2 {

  background-image: url(../images/bg/industry-2.webp);

}

.banner-five-main-wrapper.industry-bg-3 {

  background-image: url(../images/bg/hydro-1.webp);

}

.banner-five-main-wrapper.inverstor-1 {

  background-image: url(../images/bg/investor-1.webp);

}

.banner-five-main-wrapper.inverstor-2 {

  background-image: url(../images/bg/investor-2.webp);

}

.banner-five-main-wrapper.inverstor-3 {

  background-image: url(../images/bg/investor-3.webp);

}

.banner-five-main-wrapper::before {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  bottom: 0;

  right: 0;

  height: 100%;

  width: 100%;

  z-index: -1;

  background: linear-gradient(90deg, var(--color-primary) 1.59%, rgba(0, 0, 0, 0) 100%);

  mix-blend-mode: multiply;

}

.banner-five-main-wrapper .banner-hero-image {

  position: absolute;

  z-index: 1;

  top: 0;

  right: 0;

}

.banner-five-main-wrapper .warm {

  width: 342px;

  height: 342px;

  border-radius: 50%;

  background: #20282d;

  filter: blur(150px);

  position: absolute;

  top: 50%;

  transform: translateY(-50%);

  left: -200px;

  z-index: -1;

}

.banner-five-main-wrapper .banner-shape img {

  position: absolute;

  z-index: -1;

}

.banner-five-main-wrapper .banner-shape img:nth-child(1) {

  bottom: 0;

  left: 20px;

}

.banner-five-main-wrapper .banner-shape img:nth-child(2) {

  top: 27%;

  left: 6%;

}

.banner-five-main-wrapper::after {

  content: "";

  position: absolute;

  width: 50%;

  height: 100%;

  left: 0;

  top: 0;

  z-index: -2;

  background: linear-gradient(90.07deg, rgba(32, 40, 45, 0.54) 1.29%, rgba(255, 94, 20, 0) 99.95%);

}

.banner-five-main-wrapper img.sun {

  position: absolute;

  z-index: -1;

  top: 20px;

  bottom: unset;

  left: 11%;

  animation: rotateIt 15s linear infinite;

}

@media only screen and (max-width: 767px) {

  .banner-five-main-wrapper img.sun {

    display: none;

  }

}

@media only screen and (max-width: 576px) {

  .banner-five-main-wrapper img.sun {

    display: none;

  }

}

.banner-five-main-wrapper .banner-one-wrapper span.b_one-pre {

  letter-spacing: 0.1em;

  font-weight: 500;

  font-size: 16px;

  line-height: 1;

  font-family: var(--font-primary);

  color: var(--color-white);

  text-transform: uppercase;

  transition-delay: 0.5s;

  display: block;

  max-width: max-content;

  clip-path: polygon(0% 0%, 100% 0%, 95.241% 100%, 0% 100%, 0% 0%);

}

.banner-five-main-wrapper .banner-one-wrapper .title-banner {

  margin-top: 20px;

  font-weight: 600;

  font-size: 55px;

  line-height: 73px;

  color: var(--color-white);

  margin-bottom: 20px;

  transition-delay: 1s;

}

@media only screen and (max-width: 1199px) {

  .banner-five-main-wrapper .banner-one-wrapper .title-banner {

    font-size: 49px;

    line-height: 70px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .banner-five-main-wrapper .banner-one-wrapper .title-banner {

    font-size: 42px;

    line-height: 56px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-five-main-wrapper .banner-one-wrapper .title-banner {

    font-size: 42px;

    line-height: 56px;

  }

}

@media only screen and (max-width: 576px) {

  .banner-five-main-wrapper .banner-one-wrapper .title-banner {

    font-size: 30px;

    line-height: 45px;

  }

}

.banner-five-main-wrapper .banner-one-wrapper .desc {

  color: #E0E0E0;

}

.banner-five-main-wrapper .banner-one-wrapper .button-area-banner {

  display: flex;

  align-items: center;

  gap: 20px;

  transition-delay: 2s;

}

@media only screen and (max-width: 576px) {

  .banner-five-main-wrapper .banner-one-wrapper .button-area-banner {

    flex-direction: column;

    justify-content: flex-start;

    align-items: flex-start;

  }

}

.banner-five-main-wrapper .banner-one-wrapper .button-area-banner .tmp-btn {

  font-family: var(--font-primary);

  font-weight: 700;

  padding: 21px 33px;

}

.banner-five-main-wrapper .banner-one-wrapper .button-area-banner .text-btn {

  display: flex;

  align-items: center;

  gap: 20px;

}

.banner-five-main-wrapper .banner-one-wrapper .button-area-banner .text-btn .arrow {

  width: 60px;

  height: 60px;

  line-height: 65px;

  text-align: center;

  display: block;

  border-radius: 50%;

  color: var(--color-white);

  background: rgba(255, 255, 255, 0.2);

  position: relative;

  z-index: 1;

}

.banner-five-main-wrapper .banner-one-wrapper .button-area-banner .text-btn .arrow i {

  transform: rotate(-45deg);

  font-size: 20px;

}

.banner-five-main-wrapper .banner-one-wrapper .button-area-banner .text-btn .arrow::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  border-radius: 50%;

  top: 0;

  left: 0;

  background: rgba(255, 255, 255, 0.03);

  animation: pulse-border 4s linear infinite;

}

.banner-five-main-wrapper .banner-one-wrapper .button-area-banner .text-btn p {

  font-size: 20px;

  line-height: 24px;

  font-family: var(--font-primary);

  color: var(--color-white);

  font-weight: 600;

}



.tmp-banner-slider-area {

  position: relative;

  z-index: 10;

}

.tmp-banner-slider-area .banner-two-main-wrapper .banner-one-wrapper {

  opacity: 0;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-banner-slider-area .banner-two-main-wrapper .banner-one-wrapper.modify-3 {

    max-width: 85%;

  }

}

@media (max-width: 768px) {

  .tmp-banner-slider-area .banner-two-main-wrapper .banner-one-wrapper.modify-3 {

    padding-bottom: 120px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-banner-slider-area .banner-two-main-wrapper .banner-one-wrapper.modify-3 {

    padding-bottom: 80px !important;

  }

}

.tmp-banner-slider-area .banner-two-main-wrapper .banner-one-wrapper span.b_one-pre {

  clip-path: none;

  opacity: 0;

  transition-delay: 0.5s;

  display: block;

  animation: none;

}

.tmp-banner-slider-area .banner-two-main-wrapper .banner-one-wrapper .title-banner {

  opacity: 0;

  transition-delay: 0.8s;

  display: block;

  animation: none;

}

.tmp-banner-slider-area .banner-two-main-wrapper .banner-one-wrapper .desc {

  opacity: 0;

  transition-delay: 1.3s;

  display: block;

  animation: none;

}

.tmp-banner-slider-area .banner-two-main-wrapper .banner-one-wrapper .button-area-banner {

  opacity: 0;

  transition-delay: 1.8s;

  animation: none;

}

.tmp-banner-slider-area .banner-two-main-wrapper .banner-hero-image {

  opacity: 0;

  transition-delay: 0.5s;

  display: block;

  animation: none;

}

.tmp-banner-slider-area .banner-two-main-wrapper .watermark {

  opacity: 0;

  transition-delay: 0.5s;

  display: block;

  animation: none;

}

.tmp-banner-slider-area .pagination-area {

  position: absolute;

  top: 50%;

  right: 50px;

  transform: translateY(-50%);

  z-index: 1;

}

.tmp-banner-slider-area .pagination-area .swiper-wrapper {

  flex-direction: column;

  gap: 20px;

}

.tmp-banner-slider-area .pagination-area .swiper-wrapper .swiper-slide {

  width: 283px !important;

  opacity: 0.7;

  transition: var(--transition);

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-banner-slider-area .pagination-area .swiper-wrapper .swiper-slide {

    width: 100px !important;

  }

}

.tmp-banner-slider-area .pagination-area .swiper-wrapper .swiper-slide:hover {

  background: var(--color-white);

  opacity: 1;

  border-radius: 6px;

}

.tmp-banner-slider-area .pagination-area .swiper-wrapper .swiper-slide-thumb-active {

  opacity: 1;

}

.tmp-banner-slider-area .pagination-area .swiper-wrapper .banner-single-thumb {

  width: 100%;

  background: var(--color-white);

  padding: 30px;

  border-radius: 6px;

  display: flex;

  align-items: center;

  gap: 15px;

  cursor: pointer;

  transition: 0.3s;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-banner-slider-area .pagination-area .swiper-wrapper .banner-single-thumb {

    padding: 20px;

    justify-content: center;

  }

}

.tmp-banner-slider-area .pagination-area .swiper-wrapper .banner-single-thumb:hover {

  background: var(--color-white);

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-banner-slider-area .pagination-area .swiper-wrapper .banner-single-thumb .content {

    display: none;

  }

}

.tmp-banner-slider-area .pagination-area .swiper-wrapper .banner-single-thumb .content .title {

  font-size: 16px;

  line-height: 24px;

  font-family: var(--font-primary);

  font-weight: 600;

  color: var(--color-black);

  margin-bottom: 5px;

}

.tmp-banner-slider-area .pagination-area .swiper-wrapper .banner-single-thumb .content p {

  font-size: 12px;

  line-height: 18px;

  color: #717580;

}

.tmp-banner-slider-area .pagination-area2 {

  position: absolute;

  top: 50%;

  right: 0;

  transform: translateY(-50%);

  z-index: 1;

}

.tmp-banner-slider-area .pagination-area2 .swiper-wrapper {

  flex-direction: column;

  gap: 20px;

}

.tmp-banner-slider-area .pagination-area2 .swiper-wrapper .swiper-slide {

  width: 200px !important;

  transition: var(--transition);

  height: 125px;

}

.tmp-banner-slider-area .pagination-area2 .swiper-wrapper .swiper-slide-thumb-active .banner-single-thumb {

  border: 2px solid var(--color-primary-2);

}

.tmp-banner-slider-area .pagination-area2 .swiper-wrapper .banner-single-thumb {

  width: 100%;

  background: var(--color-white);

  padding: 20px;

  border-radius: 6px;

  display: flex;

  align-items: center;

  gap: 15px;

  cursor: pointer;

  border: 2px solid var(--color-white);

  height: 100%;

}

.tmp-banner-slider-area .pagination-area2 .swiper-wrapper .banner-single-thumb .icon img {

  max-width: 45px;

}

.tmp-banner-slider-area .pagination-area2 .swiper-wrapper .banner-single-thumb .content .title {

  font-size: 16px;

  line-height: 24px;

  font-family: var(--font-primary);

  font-weight: 600;

  color: var(--color-black);

  margin-bottom: 5px;

}

.tmp-banner-slider-area .pagination-area2 .swiper-wrapper .banner-single-thumb .content p {

  font-size: 12px;

  line-height: 18px;

  color: #717580;

}

.tmp-banner-slider-area.banner-five .swiper-pagination {

  position: absolute;

  left: 50%;

  transform: translateX(-50%);

  bottom: 50px;

  gap: 4px;

  display: flex;

  justify-content: center;

  align-items: center;

  max-width: max-content;

  padding: 10px 15px;

  background: #fff;

  border-radius: 33px;

}

@media only screen and (max-width: 991px) {

  .tmp-banner-slider-area.banner-five .swiper-pagination {

    bottom: 30px;

  }

}

@media only screen and (max-width: 479px) {

  .tmp-banner-slider-area.banner-five .swiper-pagination {

    bottom: 20px;

  }

}

.tmp-banner-slider-area.banner-five .swiper-pagination .swiper-pagination-bullet {

  background: #b8b8b8 !important;

  opacity: 1;

  width: 8px;

  height: 8px;

  transition: var(--transition);

}

.tmp-banner-slider-area.banner-five .swiper-pagination .swiper-pagination-bullet::after {

  display: none;

}

.tmp-banner-slider-area.banner-five .swiper-pagination .swiper-pagination-bullet-active {

  background: var(--color-primary) !important;

  width: 40px;

  border-radius: 30px;

}

.tmp-banner-slider-area.banner-five.thumb-controler .pagination-area2 .swiper-wrapper .swiper-slide {

  width: 290px !important;

  transition: var(--transition);

  height: 125px;

}

@media only screen and (max-width: 991px) {

  .tmp-banner-slider-area.banner-five.thumb-controler .pagination-area2 .swiper-wrapper .swiper-slide {

    height: auto;

    width: max-content !important;

  }

}

.tmp-banner-slider-area.banner-five.thumb-controler .pagination-area2 {

  right: 50px;

}

@media only screen and (max-width: 991px) {

  .tmp-banner-slider-area.banner-five.thumb-controler .pagination-area2 {

    right: 20px;

  }

}

.tmp-banner-slider-area.banner-five.thumb-controler .pagination-area2 .swiper-wrapper .banner-single-thumb .icon img {

  max-width: 55px;

}

@media only screen and (max-width: 991px) {

  .tmp-banner-slider-area.banner-five.thumb-controler .pagination-area2 .swiper-wrapper .banner-single-thumb .icon img {

    max-width: 40px;

  }

}

.tmp-banner-slider-area.banner-five.thumb-controler .pagination-area2 .swiper-wrapper .banner-single-thumb {

  gap: 20px;

}

@media only screen and (max-width: 991px) {

  .tmp-banner-slider-area.banner-five.thumb-controler .pagination-area2 .swiper-wrapper .banner-single-thumb {

    width: 90px;

    height: 90px;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

  }

}

@media only screen and (max-width: 991px) {

  .tmp-banner-slider-area.banner-five.thumb-controler .pagination-area2 .swiper-wrapper .banner-single-thumb .content {

    display: none;

  }

}

.tmp-banner-slider-area.business-banner-two.banner-nine .banner-five-main-wrapper .banner-three-wrapper .title-banner {

  font-size: 110px;

}

@media only screen and (max-width: 1199px) {

  .tmp-banner-slider-area.business-banner-two.banner-nine .banner-five-main-wrapper .banner-three-wrapper .title-banner {

    font-size: 80px;

    line-height: 1.4;

  }

}

@media only screen and (max-width: 991px) {

  .tmp-banner-slider-area.business-banner-two.banner-nine .banner-five-main-wrapper .banner-three-wrapper .title-banner {

    font-size: 52px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-banner-slider-area.business-banner-two.banner-nine .banner-five-main-wrapper .banner-three-wrapper .title-banner {

    font-size: 38px;

    line-height: 1.3;

  }

}

.tmp-banner-slider-area.banner-nine .banner-five-main-wrapper {

  height: 890px;

}

@media only screen and (max-width: 1199px) {

  .tmp-banner-slider-area.banner-nine .banner-five-main-wrapper {

    height: 800px;

  }

}

.tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-three-wrapper {

  opacity: 0;

}

.tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-three-wrapper .b_one-pre {

  opacity: 0;

  transition-delay: 0.5s;

  display: block;

  animation: none;

}

.tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-three-wrapper .title-banner {

  font-size: 70px;

  line-height: 1.3;

  opacity: 0;

  transition-delay: 0.8s;

  display: block;

  animation: none;

  margin-bottom: 20px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-three-wrapper .title-banner {

    font-size: 54px;

  }

}

@media only screen and (max-width: 991px) {

  .tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-three-wrapper .title-banner {

    font-size: 54px;

  }

}

.tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-three-wrapper .desc {

  opacity: 0;

  transition-delay: 1.3s;

  display: block;

  animation: none;

}

@media only screen and (max-width: 576px) {

  .tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-three-wrapper .desc {

    margin-bottom: 40px;

  }

}

.tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-three-wrapper .button-area-banner {

  opacity: 0;

  transition-delay: 0.7s;

  display: block;

  animation: none;

}

.tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-shape img {

  position: absolute;

  z-index: -1;

  top: 0;

}

@media only screen and (max-width: 1199px) {

  .tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-shape img {

    display: none !important;

  }

}

.tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-shape img:nth-child(1) {

  left: 0;

  bottom: 0;

  right: auto;

  top: 0;

  opacity: 0;

  transition-delay: 0.2s;

  display: block;

  animation: none;

  height: 100%;

}

.tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-shape img:nth-child(2) {

  right: 0;

  bottom: 0;

  top: 0;

  left: auto;

  opacity: 0;

  transition-delay: 0.2s;

  display: block;

  animation: none;

  height: 100%;

}

.tmp-banner-slider-area.banner-nine .pagination-area2 {

  top: unset;

  left: 0;

  transform: none;

  bottom: 0;

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper {

  flex-direction: row;

  gap: 25px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper {

    gap: 0;

  }

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide {

  margin-right: 0 !important;

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide.swiper-slide-thumb-active .banner-single-thumb {

  border: none;

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide.swiper-slide-thumb-active .banner-single-thumb .image-area::after {

  height: 0;

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide.swiper-slide-thumb-active .banner-single-thumb .image-area::before {

  height: 100%;

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide.swiper-slide-thumb-active .banner-single-thumb .image-area .content p, .tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide.swiper-slide-thumb-active .banner-single-thumb .image-area .content h3 {

  color: var(--color-white);

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide .banner-single-thumb {

  border-radius: 0;

  border: none;

  padding: 0;

  background: none;

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide .banner-single-thumb:hover {

  border: none;

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide .banner-single-thumb:hover .image-area::after {

  height: 0;

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide .banner-single-thumb:hover .image-area::before {

  height: 100%;

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide .banner-single-thumb:hover .image-area .content p, .tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide .banner-single-thumb:hover .image-area .content h3 {

  color: var(--color-white);

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide .banner-single-thumb:hover .image-area span {

  -webkit-text-stroke-width: 1px;

  -webkit-text-stroke-color: rgba(255, 255, 255, 0.2);

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide .banner-single-thumb .image-area {

  position: relative;

  z-index: 1;

  display: block;

  overflow: hidden;

  border-radius: 5px 5px 0 0;

  height: 100%;

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide .banner-single-thumb .image-area img {

  object-fit: cover;

  height: 100%;

  width: 100%;

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide .banner-single-thumb .image-area .content {

  position: absolute;

  z-index: 2;

  left: 30px;

  top: 50%;

  transform: translateY(-50%);

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide .banner-single-thumb .image-area .content p {

  margin-bottom: 10px;

  color: var(--color-heading-1);

  font-size: 14px;

  line-height: 1;

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide .banner-single-thumb .image-area .content h3 {

  margin-bottom: 0;

  color: var(--color-heading-1);

  font-size: 22px;

  line-height: 1;

  font-weight: 500;

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide .banner-single-thumb .image-area::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  background: var(--color-white);

  top: 0;

  left: 0;

  z-index: 1;

  transition: var(--transition);

}

.tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide .banner-single-thumb .image-area::before {

  content: "";

  position: absolute;

  width: 100%;

  height: 0%;

  background: rgba(8, 66, 70, 0.82);

  bottom: 0;

  left: 0;

  z-index: 1;

  transition: var(--transition);

}

.tmp-banner-slider-area.banner-nine .navigation-area {

  transition: 0.3s;

  opacity: 0;

}

.tmp-banner-slider-area.banner-nine .navigation-area .swiper-btn {

  width: 60px;

  height: 60px;

  line-height: 65px;

  border-radius: 50%;

  text-align: center;

  color: var(--color-white);

  font-size: 20px;

  background: rgba(255, 255, 255, 0.1098039216);

  transition: var(--transition);

  backdrop-filter: blur(7px);

}

.tmp-banner-slider-area.banner-nine .navigation-area .swiper-btn:hover {

  background: var(--color-primary-2);

  border: 1px solid var(--color-primary-2);

  transform: scale(1.2);

}

.tmp-banner-slider-area.banner-nine .navigation-area .swiper-btn::after {

  display: none;

}

.tmp-banner-slider-area.banner-nine .navigation-area .swiper-btn.swiper-button-prev {

  left: 4%;

}

.tmp-banner-slider-area.banner-nine .navigation-area .swiper-btn.swiper-button-next {

  right: 4%;

}

.tmp-banner-slider-area.banner-nine:hover .navigation-area {

  opacity: 1;

}



.custom-overfolow-btn {

  position: relative;

  width: 100%;

  height: 100%;

  left: 0;

  top: 0;

  overflow: hidden;

}

.custom-overfolow-btn i {

  position: absolute;

  top: 50%;

  left: 50%;

  overflow: hidden;

  margin-top: -8px;

  margin-left: -8px;

  z-index: 1;

  font-size: 16px;

}

.custom-overfolow-btn i.invers-icon-top {

  position: absolute;

  transition: transform 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86), -webkit-transform 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);

  transform: translateX(300%);

}

.custom-overfolow-btn .invers-icon {

  transition: transform 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86), -webkit-transform 0.4s cubic-bezier(0.785, 0.135, 0.15, 0.86);

}



.swiper-button-next .custom-overfolow-btn i.invers-icon-top,

.swiper-button-next2 .custom-overfolow-btn i.invers-icon-top,

.swiper-button-next3 .custom-overfolow-btn i.invers-icon-top,

.slide-next .custom-overfolow-btn i.invers-icon-top {

  transform: translateX(-300%);

}

.swiper-button-next:hover i.invers-icon,

.swiper-button-next2:hover i.invers-icon,

.swiper-button-next3:hover i.invers-icon,

.slide-next:hover i.invers-icon {

  transform: translateX(300%);

}

.swiper-button-next:hover i.invers-icon-top,

.swiper-button-next2:hover i.invers-icon-top,

.swiper-button-next3:hover i.invers-icon-top,

.slide-next:hover i.invers-icon-top {

  transform: translateX(0);

}



.swiper-button-prev:hover i.invers-icon,

.swiper-button-prev2:hover i.invers-icon,

.swiper-button-prev3:hover i.invers-icon,

.slide-prev:hover i.invers-icon {

  transform: translateX(-300%);

}

.swiper-button-prev:hover i.invers-icon-top,

.swiper-button-prev2:hover i.invers-icon-top,

.swiper-button-prev3:hover i.invers-icon-top,

.slide-prev:hover i.invers-icon-top {

  transform: translateX(0);

}



@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .about-one-right-wrapper {

    background-color: transparent !important;

  }

}

@media only screen and (max-width: 1199px) {

  .about-one-right-wrapper {

    padding: 30px;

  }

}

@media only screen and (max-width: 1199px) {

  .about-one-right-wrapper {

    background-color: transparent !important;

  }

}



.tmp-banner-main-area-swiper {

  position: relative;

}

.tmp-banner-main-area-swiper .swiper-pagination {

  position: absolute;

  bottom: 0;

  right: 0;

}

.tmp-banner-main-area-swiper .swiper-pagination {

  position: absolute;

  bottom: 0;

  right: 0;

  width: auto !important;

  left: auto !important;

  margin: 0;

}

@media only screen and (max-width: 576px) {

  .tmp-banner-main-area-swiper .swiper-pagination {

    display: none;

  }

}

.tmp-banner-main-area-swiper .swiper-pagination-bullet {

  padding: 40px 80px;

  border-radius: 0;

  width: auto;

  height: 30px;

  text-align: center;

  line-height: 4px;

  font-weight: 600;

  font-size: 14px;

  color: #000;

  opacity: 1;

  text-transform: uppercase;

  background: rgb(255, 255, 255);

  letter-spacing: 0.05em;

  margin: 0 !important;

}

@media only screen and (max-width: 1199px) {

  .tmp-banner-main-area-swiper .swiper-pagination-bullet {

    padding: 30px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-banner-main-area-swiper .swiper-pagination-bullet {

    padding: 20px 10px;

    font-size: 13px;

  }

}

.tmp-banner-main-area-swiper .swiper-pagination-bullet.swiper-pagination-bullet-active {

  position: relative;

}

.tmp-banner-main-area-swiper .swiper-pagination-bullet.swiper-pagination-bullet-active::after {

  position: absolute;

  left: 50%;

  bottom: 25px;

  content: "";

  height: 1px;

  background: #0C0A0A;

  width: 51%;

  transform: translateX(-50%);

}

@media only screen and (max-width: 1199px) {

  .tmp-banner-main-area-swiper .swiper-pagination-bullet.swiper-pagination-bullet-active::after {

    display: none;

  }

}

.tmp-banner-main-area-swiper .swiper-pagination-bullet-active {

  color: #000;

  background: #fff;

}

@media only screen and (max-width: 1199px) {

  .tmp-banner-main-area-swiper .swiper-pagination-bullet-active {

    color: var(--color-primary);

  }

}

.tmp-banner-main-area-swiper .swiper-slide.swiper-slide-active .banner-one-wrapper {

  opacity: 1;

}

.tmp-banner-main-area-swiper .swiper-slide.swiper-slide-active .banner-one-wrapper span.b_one-pre {

  animation: slideInUp3 1s linear;

  animation-delay: 0.5s;

  display: block;

  opacity: 1;

}

.tmp-banner-main-area-swiper .swiper-slide.swiper-slide-active .banner-one-wrapper .title-banner {

  animation: fadeInUp2 1s linear;

  animation-delay: 1s;

  opacity: 1;

}

.tmp-banner-main-area-swiper .swiper-slide.swiper-slide-active .banner-one-wrapper .button-area-banner {

  animation: fadeInUp2 1.5s linear;

  animation-delay: 2s;

  opacity: 1;

}

.tmp-banner-main-area-swiper.home-seven .banner-social-area {

  position: absolute;

  top: 50%;

  left: -80px;

  transform: translateY(50%);

  z-index: 2;

}

@media (max-width: 1700px) and (min-width: 1600px) {

  .tmp-banner-main-area-swiper.home-seven .banner-social-area {

    left: -120px;

  }

}

@media (max-width: 1400px) {

  .tmp-banner-main-area-swiper.home-seven .banner-social-area {

    left: -140px;

  }

}

@media (max-width: 1200px) {

  .tmp-banner-main-area-swiper.home-seven .banner-social-area {

    display: none;

  }

}

.tmp-banner-main-area-swiper.home-seven .banner-social-area .inner {

  display: flex;

  align-items: center;

  transform: rotate(-90deg);

}

.tmp-banner-main-area-swiper.home-seven .banner-social-area .inner .content {

  margin-bottom: 0;

  text-transform: uppercase;

  color: #FFFFFF;

  margin-left: 15px;

}

.tmp-banner-main-area-swiper.home-seven .banner-social-area .inner .content span {

  margin-right: 5px;

}

.tmp-banner-main-area-swiper.home-seven .banner-social-area .inner .divider {

  width: 100px;

  height: 1px;

  margin: auto 0;

  background: #FFFFFF;

  margin-left: 5px;

}

.tmp-banner-main-area-swiper.home-seven .banner-social-area .inner .social-wrapper {

  display: flex;

  padding: 0;

}

.tmp-banner-main-area-swiper.home-seven .banner-social-area .inner .social-wrapper li {

  list-style: none;

  margin: 0 15px;

}

.tmp-banner-main-area-swiper.home-seven .banner-social-area .inner .social-wrapper li i {

  color: #FFFFFF;

  transform: rotate(90deg);

}

.tmp-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .tmp-banner-one {

  padding: 160px 0 65px 0;

}

@media (max-width: 1600px) and (min-width: 1200px) {

  .tmp-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .tmp-banner-one .container {

    max-width: 1024px;

  }

}

.tmp-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .tmp-banner-one.bg_image--1 {

  background: url(../images/bg/bg-image-7.webp);

  background-size: cover;

}

.tmp-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .tmp-banner-one.bg_image--2 {

  background: url(../images/bg/bg-image-8.webp);

  background-size: cover;

}

.tmp-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .tmp-banner-one .banner-one-wrapper .b_one-pre {

  color: var(--color-primary);

  font-weight: 400;

  font-size: 24px;

  line-height: 37px;

  font-family: var(--font-primary);

}

@media (max-width: 991px) {

  .tmp-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .tmp-banner-one .banner-one-wrapper .b_one-pre {

    font-size: 16px;

    line-height: 1.2;

  }

}

.tmp-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .tmp-banner-one .banner-one-wrapper .desc {

  font-weight: 500;

  font-size: 18px;

  line-height: 30px;

  color: #FFFFFF;

  margin-bottom: 55px;

}

@media (max-width: 768px) {

  .tmp-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .tmp-banner-one .banner-one-wrapper .desc br {

    display: none;

  }

}

.tmp-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .tmp-banner-one .banner-one-wrapper .button-group-area {

  display: flex;

  align-items: center;

  gap: 30px;

}

@media (max-width: 576px) {

  .tmp-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .tmp-banner-one .banner-one-wrapper .button-group-area {

    display: block;

  }

}

.tmp-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .tmp-banner-one .banner-one-wrapper .button-group-area .tmp-btn {

  background: transparent;

  border: 1px solid #FFFFFF;

  display: flex;

  align-items: center;

  padding: 23px 30px;

}

@media (max-width: 576px) {

  .tmp-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .tmp-banner-one .banner-one-wrapper .button-group-area .tmp-btn {

    margin-bottom: 20px;

  }

}

.tmp-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .tmp-banner-one .banner-one-wrapper .button-group-area .tmp-btn.p-short {

  padding: 8px 8px 8px 25px;

}

.tmp-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .tmp-banner-one .banner-one-wrapper .button-group-area .tmp-btn i {

  height: 40px;

  width: 40px;

  display: flex;

  align-items: center;

  justify-content: center;

  background: #fff;

  color: var(--color-primary);

  margin-left: 20px;

}

.tmp-banner-main-area-swiper.home-seven .swiper-container-h2 .swiper-wrapper .tmp-banner-one .banner-one-wrapper .button-group-area .tmp-btn:hover {

  border: 1px solid var(--color-primary);

}

.tmp-banner-main-area-swiper.home-seven .swiper-pagination {

  position: absolute;

  bottom: 100px;

  right: 30px;

  left: auto !important;

  width: 300px !important;

  margin: 0;

  display: inline-flex;

  align-items: center;

  justify-content: center;

}

@media (max-width: 1200px) {

  .tmp-banner-main-area-swiper.home-seven .swiper-pagination {

    right: 50% !important;

    transform: translateX(50%);

    bottom: 40px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-banner-main-area-swiper.home-seven .swiper-pagination {

    display: none;

  }

}

.tmp-banner-main-area-swiper.home-seven .swiper-pagination-bullet {

  padding: 0;

  width: 55px;

  height: 55px;

  border-radius: 50%;

  text-align: center;

  line-height: 4px;

  font-weight: 600;

  font-size: 14px;

  border: 2px solid #FFFFFF;

  opacity: 1;

  text-transform: uppercase;

  background: none;

  letter-spacing: 0.05em;

  margin: 0 !important;

  position: relative;

  margin: 0 7px !important;

}

@media (max-width: 1200px) {

  .tmp-banner-main-area-swiper.home-seven .swiper-pagination-bullet {

    width: 40px;

    height: 40px;

    padding: 25px !important;

  }

}

.tmp-banner-main-area-swiper.home-seven .swiper-pagination-bullet::before {

  content: "02";

  position: absolute;

  font-weight: 700;

  font-size: 18px;

  line-height: 25px;

  color: #FFFFFF;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  z-index: 1;

}

.tmp-banner-main-area-swiper.home-seven .swiper-pagination-bullet:first-child::before {

  content: "01";

}

.tmp-banner-main-area-swiper.home-seven .swiper-pagination-bullet:last-child::before {

  content: "03";

}

@media only screen and (max-width: 1199px) {

  .tmp-banner-main-area-swiper.home-seven .swiper-pagination-bullet {

    padding: 30px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-banner-main-area-swiper.home-seven .swiper-pagination-bullet {

    padding: 20px 10px;

    font-size: 13px;

  }

}

.tmp-banner-main-area-swiper.home-seven .swiper-pagination-bullet.swiper-pagination-bullet-active {

  position: relative;

  width: 67px;

  height: 67px;

}

@media (max-width: 1200px) {

  .tmp-banner-main-area-swiper.home-seven .swiper-pagination-bullet.swiper-pagination-bullet-active {

    width: 50px;

    height: 50px;

  }

}

.tmp-banner-main-area-swiper.home-seven .swiper-pagination-bullet.swiper-pagination-bullet-active::after {

  display: none;

}

.tmp-banner-main-area-swiper.home-seven .swiper-pagination-bullet.swiper-pagination-bullet-active::before {

  color: var(--color-primary);

}

.tmp-banner-main-area-swiper.home-seven .swiper-pagination-bullet-active {

  color: #000;

  background: #fff;

}

@media only screen and (max-width: 1199px) {

  .tmp-banner-main-area-swiper.home-seven .swiper-pagination-bullet-active {

    color: var(--color-primary);

  }

}

.tmp-banner-main-area-swiper.home-seven .swiper-slide.swiper-slide-active .banner-one-wrapper {

  opacity: 1;

}

.tmp-banner-main-area-swiper.home-seven .swiper-slide.swiper-slide-active .banner-one-wrapper span.b_one-pre {

  animation: slideInUp3 1s linear;

  animation-delay: 0.5s;

  display: block;

  opacity: 1;

}

.tmp-banner-main-area-swiper.home-seven .swiper-slide.swiper-slide-active .banner-one-wrapper .title-banner {

  animation: fadeInUp2 1s linear;

  animation-delay: 1s;

  opacity: 1;

}

.tmp-banner-main-area-swiper.home-seven .swiper-slide.swiper-slide-active .banner-one-wrapper .button-area-banner {

  animation: fadeInUp2 1.5s linear;

  animation-delay: 2s;

  opacity: 1;

}



.tmp-banner-main-area-swiper .swiper-slide-active .banner-shape-area .shape-1 {

  top: 0;

  left: 0;

  animation: slideInLeft 0.8s linear;

}

.tmp-banner-main-area-swiper .swiper-slide-active .banner-shape-area .shape-2 {

  top: 0;

  left: 0;

  animation: slideInLeft 1s linear;

}



.tmp-banner-three-area {

  background: #151515;

  position: relative;

  z-index: 1;

  overflow: hidden;

}

.tmp-banner-three-area .tmp-to-bottom-start {

  position: absolute;

  bottom: -70px;

  left: 15px;

}

.tmp-banner-three-area .tmp-to-bottom-start::after {

  position: absolute;

  content: "";

  height: 7px;

  width: 2px;

  background: #fff;

  left: 47%;

  top: 30%;

  transform: translate(-50%, -30%);

  animation: jump-5 3s linear infinite;

}

.tmp-banner-three-area .banner-three-wrapper {

  position: relative;

}

.tmp-banner-three-area .banner-three-wrapper .title {

  font-weight: 700;

  font-size: 90px;

  line-height: 100px;

  text-transform: uppercase;

  color: #fff;

  letter-spacing: 0.08em;

  margin-top: 20px;

}

@media (max-width: 991px) {

  .tmp-banner-three-area .banner-three-wrapper .title {

    font-size: 72px;

    line-height: 90px;

  }

}

@media (max-width: 768px) {

  .tmp-banner-three-area .banner-three-wrapper .title {

    font-size: 54px;

    line-height: 74px;

  }

}

@media (max-width: 576px) {

  .tmp-banner-three-area .banner-three-wrapper .title {

    font-size: 42px;

    line-height: 60px;

  }

}

@media (max-width: 400px) {

  .tmp-banner-three-area .banner-three-wrapper .title {

    font-size: 34px;

    line-height: 48px;

  }

}

.tmp-banner-three-area .banner-three-wrapper .title span.strock {

  font-weight: 700;

  font-size: 90px;

  color: rgb(250, 250, 250);

  letter-spacing: 0.08em;

  line-height: 0;

  margin-top: 35px;

  position: relative;

  display: inline-block;

  font-weight: 700;

  z-index: 2;

  -webkit-text-stroke: 0.5px rgb(248, 248, 248);

  color: transparent;

  transition: all 0.4s;

  opacity: 1;

}

@media (max-width: 768px) {

  .tmp-banner-three-area .banner-three-wrapper .title span.strock {

    font-size: 54px;

  }

}

@media (max-width: 576px) {

  .tmp-banner-three-area .banner-three-wrapper .title span.strock {

    font-size: 42px;

  }

}

@media (max-width: 400px) {

  .tmp-banner-three-area .banner-three-wrapper .title span.strock {

    font-size: 34px;

  }

}

.tmp-banner-three-area .banner-three-wrapper span.pre-title {

  color: #FF6600;

  font-weight: 400;

  font-size: 28px;

  line-height: 43px;

  font-family: var(--font-primary);

}

@media (max-width: 576px) {

  .tmp-banner-three-area .banner-three-wrapper span.pre-title {

    font-size: 20px;

  }

}

.tmp-banner-three-area .banner-three-wrapper span.bottom {

  margin-top: 100px;

  display: block;

  font-weight: 400;

  font-size: 18px;

  line-height: 30px;

  text-transform: uppercase;

  color: #555555;

  font-family: var(--font-primary);

}

@media (max-width: 768px) {

  .tmp-banner-three-area .banner-three-wrapper span.bottom {

    margin-top: 50px;

    color: #f8f8f8;

  }

}

.tmp-banner-three-area .banner-three-wrapper span.bottom span {

  margin-top: 10px;

  display: block;

}

.tmp-banner-three-area .banner-image-area {

  position: absolute;

  top: 0;

  right: 0;

  z-index: -1;

  height: 100%;

}

@media (max-width: 1400px) {

  .tmp-banner-three-area .banner-image-area {

    right: -15%;

  }

}

@media (max-width: 1200px) {

  .tmp-banner-three-area .banner-image-area {

    right: -40%;

  }

}

@media (max-width: 991px) {

  .tmp-banner-three-area .banner-image-area {

    right: -80%;

  }

}

.tmp-banner-three-area .banner-image-area img {

  height: 100%;

  width: inherit;

}



.bg-primary {

  background: var(--color-primary) !important;

}



.tmp-banner-area-two {

  position: relative;

  max-width: 1920px;

  margin: auto;

}

.tmp-banner-area-two .banner-image-right {

  position: absolute;

  right: -1px;

  top: 50%;

  transform: translateY(-50%);

  clip-path: polygon(17% 0, 100% 0, 100% 100%, 18% 100%, 9% 77%);

  width: 1220px;

  height: 607px;

  background-color: #fff;

  background-image: url(../images/banner/03.webp);

}

@media (max-width: 1200px) {

  .tmp-banner-area-two .banner-image-right {

    width: 1000px;

    height: 560px;

  }

}

@media (max-width: 991px) {

  .tmp-banner-area-two .banner-image-right {

    top: unset;

    transform: translateY(0);

    bottom: -220px;

    width: 900px;

    height: 500px;

  }

}

@media (max-width: 768px) {

  .tmp-banner-area-two .banner-image-right {

    clip-path: none;

    position: unset;

    width: 100%;

    height: unset;

  }

}

.tmp-banner-area-two .banner-image-right .banner-content {

  margin-left: 300px;

  margin-top: 130px;

}

@media (max-width: 1200px) {

  .tmp-banner-area-two .banner-image-right .banner-content {

    margin-left: 250px;

    margin-top: 120px;

  }

}

@media (max-width: 991px) {

  .tmp-banner-area-two .banner-image-right .banner-content {

    margin-left: 200px;

    margin-top: 90px;

  }

}

@media (max-width: 768px) {

  .tmp-banner-area-two .banner-image-right .banner-content {

    margin-left: 50px;

    margin-right: 50px;

    margin-top: 0;

    padding-top: 80px;

  }

}

@media (max-width: 576px) {

  .tmp-banner-area-two .banner-image-right .banner-content {

    margin-left: 10px;

    margin-right: 10px;

  }

}

.tmp-banner-area-two .banner-image-right .banner-content span {

  color: #0C0A0A;

  font-family: var(--font-primary);

  font-weight: 600;

  font-size: 16px;

  line-height: 24px;

}

.tmp-banner-area-two .banner-image-right .banner-content .title {

  font-weight: 600;

  font-size: 60px;

  line-height: 70px;

  margin-bottom: 30px;

  margin-top: 20px;

}

@media (max-width: 768px) {

  .tmp-banner-area-two .banner-image-right .banner-content .title br {

    display: none;

  }

}

@media (max-width: 576px) {

  .tmp-banner-area-two .banner-image-right .banner-content .title {

    font-size: 50px;

    line-height: 60px;

    margin-bottom: 20px;

  }

}

@media (max-width: 450px) {

  .tmp-banner-area-two .banner-image-right .banner-content .title {

    font-size: 40px;

    line-height: 50px;

    margin-bottom: 20px;

  }

}

.tmp-banner-area-two .banner-image-right .banner-content .short-disc {

  font-weight: 400;

  font-size: 20px;

  line-height: 30px;

  margin-bottom: 45px;

}

@media only screen and (max-width: 1199px) {

  .tmp-banner-area-two .banner-image-right .banner-content .short-disc {

    font-size: 16px;

  }

}

@media (max-width: 576px) {

  .tmp-banner-area-two .banner-image-right .banner-content .short-disc {

    margin-bottom: 20px;

  }

}



.banner-three-wrapper {

  padding: 150px 0 125px 0;

}

@media only screen and (max-width: 1199px) {

  .banner-three-wrapper {

    padding: 150px 0 125px 0;

  }

}

.banner-three-wrapper span.b_one-pre {

  letter-spacing: 0.5px;

  font-weight: 600;

  font-size: 16px;

  line-height: 1;

  font-family: var(--font-secondary);

  color: var(--color-heading-1);

  text-transform: capitalize;

  transition-delay: 0.5s;

  display: block;

  max-width: max-content;

}

.banner-three-wrapper .title-banner {

  margin-top: 25px;

  font-weight: 700;

  font-size: 55px;

  line-height: 1.3;

  color: var(--color-black);

  margin-bottom: 20px;

  transition-delay: 1s;

}

@media only screen and (max-width: 1199px) {

  .banner-three-wrapper .title-banner {

    font-size: 49px;

    line-height: 70px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .banner-three-wrapper .title-banner {

    font-size: 42px;

    line-height: 56px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-three-wrapper .title-banner {

    font-size: 42px;

    line-height: 56px;

    margin-top: 15px;

  }

}

@media only screen and (max-width: 576px) {

  .banner-three-wrapper .title-banner {

    font-size: 30px;

    line-height: 45px;

  }

}

.banner-three-wrapper .desc {

  max-width: 680px;

  color: var(--color-heading-1);

  font-family: var(--font-primary);

}

.banner-three-wrapper .button-area-banner {

  display: flex;

  align-items: center;

  gap: 20px;

  transition-delay: 2s;

}

@media only screen and (max-width: 479px) {

  .banner-three-wrapper .button-area-banner {

    flex-direction: column;

    justify-content: flex-start;

    align-items: flex-start;

  }

}

.banner-three-wrapper .call-area {

  display: flex;

  align-items: center;

}

.banner-three-wrapper .call-area .icon {

  margin-right: 13px;

}

.banner-three-wrapper .call-area .icon i {

  width: 52px;

  height: 52px;

  background: #fff;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  transform: rotate(-35deg);

  color: var(--color-primary);

  font-weight: 600;

}

.banner-three-wrapper .call-area .detail span {

  display: block;

  text-transform: capitalize;

}

.banner-three-wrapper .call-area .detail a.number {

  font-weight: 700;

  font-size: 24px;

  color: #fff;

  line-height: 37px;

  transition: 0.3s;

}

.banner-three-wrapper .call-area .detail a.number:hover {

  color: var(--color-primary);

}

.banner-three-wrapper .author-rating-area {

  display: flex;

  align-items: center;

  gap: 20px;

  margin-top: 40px;

}

@media only screen and (max-width: 576px) {

  .banner-three-wrapper .author-rating-area {

    margin-bottom: 30px;

  }

}

.banner-three-wrapper .author-rating-area .author ul {

  display: flex;

  align-items: center;

}

.banner-three-wrapper .author-rating-area .author ul li {

  cursor: pointer;

  transition: 0.3s;

}

.banner-three-wrapper .author-rating-area .author ul li:not(:first-child) {

  margin-left: -20px;

}

.banner-three-wrapper .author-rating-area .author ul li:hover {

  transform: translateY(-5px);

  z-index: 100;

}

.banner-three-wrapper .author-rating-area .author ul li:hover a {

  z-index: 100;

}

.banner-three-wrapper .author-rating-area .star-rating ul {

  display: flex;

  align-items: center;

  gap: 3px;

}

.banner-three-wrapper .author-rating-area .star-rating ul li {

  color: #FFC107;

}

.banner-three-wrapper .author-rating-area .star-rating p {

  font-family: var(--font-secondary);

  color: var(--color-heading-1);

  font-weight: 500;

}



.tmp-banner-slider-area2 {

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 576px) {

  .tmp-banner-slider-area2 {

    padding-top: 80px;

  }

}

.tmp-banner-slider-area2::after {

  content: "";

  position: absolute;

  height: 100%;

  width: 100%;

  max-width: 526px;

  right: 0;

  top: 0;

  z-index: -1;

  background: var(--color-primary-2);

}

.tmp-banner-slider-area2 .banner-hero {

  position: absolute;

  right: 0;

  bottom: 60px;

}

.tmp-banner-slider-area2 .banner-hero img {

  border-radius: 4px;

}

.tmp-banner-slider-area2 .banner-hero .floating-content {

  position: absolute;

  display: flex;

  align-items: center;

  gap: 15px;

  background: #FFFFFF;

  box-shadow: 0px 5px 10px 5px rgba(0, 0, 0, 0.04);

  border-radius: 4px;

  bottom: 20%;

  left: -30%;

  padding: 30px;

}

.tmp-banner-slider-area2 .banner-hero .floating-content .icon {

  width: 60px;

  height: 60px;

  line-height: 60px;

  border-radius: 50%;

  display: block;

  text-align: center;

  background: var(--primary-100);

}

.tmp-banner-slider-area2 .banner-hero .floating-content .icon svg {

  max-width: 25px;

}

.tmp-banner-slider-area2 .banner-hero .floating-content .text h2 {

  font-weight: 600;

  margin-bottom: 0;

  font-size: 20px;

  line-height: 1.2;

}

.tmp-banner-slider-area2 .banner-hero .floating-content .text span a {

  transition: var(--transition);

  color: var(--color-primary-2);

}

.tmp-banner-slider-area2 .banner-shape img {

  position: absolute;

  z-index: 1;

}

.tmp-banner-slider-area2 .banner-shape img:nth-child(1) {

  bottom: 0;

  left: 50px;

}

.tmp-banner-slider-area2 .banner-shape img:nth-child(2) {

  top: 20%;

  left: 48%;

  transform: translateX(-48%);

}

.tmp-banner-slider-area2 .banner-slider-button {

  position: absolute;

  z-index: 1;

  top: 50%;

  right: 30px;

  transform: translateY(-50%);

  display: flex;

  align-items: center;

  flex-direction: column;

  gap: 20px;

}

.tmp-banner-slider-area2 .banner-slider-button .swiper-btn {

  color: var(--color-white);

  display: flex;

  align-items: center;

  gap: 5px;

}

.tmp-banner-slider-area2 .banner-slider-button .swiper-btn span {

  width: 60px;

  height: 60px;

  line-height: 60px;

  background: rgba(255, 255, 255, 0.2);

  display: block;

  border-radius: 50%;

  text-align: center;

}

.tmp-banner-slider-area2 .banner-slider-button .swiper-btn i {

  font-size: 18px;

}

.tmp-banner-slider-area2.banner-right-bento .banner-three-wrapper p.desc {

  max-width: 80%;

}

@media only screen and (max-width: 576px) {

  .tmp-banner-slider-area2.banner-right-bento .banner-three-wrapper p.desc {

    max-width: 100%;

    line-height: 1.5;

  }

}



.tmp-banner-slider-area3 {

  padding: 210px 0 120px;

  background: var(--primary-100);

}

@media only screen and (max-width: 767px) {

  .tmp-banner-slider-area3 {

    padding: 140px 0 60px 0 !important;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-banner-slider-area3 {

    padding: 110px 0 60px 0 !important;

  }

}

.tmp-banner-slider-area3 .slider-inner {

  position: relative;

  z-index: 1;

}

.tmp-banner-slider-area3 .slider-inner .swiper {

  border-radius: 10px;

}

.tmp-banner-slider-area3 .slider-inner .swiper-pagination {

  bottom: 70px;

  left: 59%;

  transform: translateX(-60%);

  width: max-content;

}

@media only screen and (max-width: 767px) {

  .tmp-banner-slider-area3 .slider-inner .swiper-pagination {

    bottom: 25px;

  }

}

.tmp-banner-slider-area3 .slider-inner .swiper-pagination .swiper-pagination-bullet {

  background: var(--color-white);

  width: 10px;

  height: 10px;

  position: relative;

  z-index: 1;

  opacity: 1;

}

.tmp-banner-slider-area3 .slider-inner .swiper-pagination .swiper-pagination-bullet::after {

  content: "";

  position: absolute;

  width: 16px;

  height: 16px;

  border-radius: 50%;

  border: 1px solid var(--color-white);

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  opacity: 0;

}

.tmp-banner-slider-area3 .slider-inner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active::after {

  opacity: 1;

}



.mySwiper-banner-shop {

  position: relative;

  z-index: 1;

}

.mySwiper-banner-shop .invers-banner-curved {

  position: absolute;

  width: 15%;

  height: 5%;

  background-color: #fff;

  border-radius: 0 0 12px 12px;

  left: 50%;

  transform: translateX(-50%) scaleY(-1);

  height: 50px;

  z-index: 1;

  bottom: 30px;

}

@media only screen and (max-width: 576px) {

  .mySwiper-banner-shop .invers-banner-curved {

    display: none;

  }

}

.mySwiper-banner-shop .invers-banner-curved::before {

  content: "";

  position: absolute;

  height: 50px;

  width: 30px;

  background: 0 0;

  border-radius: 50%;

  box-shadow: 15px -15px 0 0 var(--color-white);

  top: 0;

  right: 100%;

}

.mySwiper-banner-shop .invers-banner-curved::after {

  content: "";

  position: absolute;

  height: 50px;

  width: 30px;

  background: 0 0;

  border-radius: 50%;

  box-shadow: 15px -15px 0 0 var(--color-white);

  top: 0;

  left: 100%;

  box-shadow: -15px -15px 0 0 var(--color-white);

}

.mySwiper-banner-shop .swiper-navigation .swiper-btn {

  transform: translateY(-50%);

  font-size: 18px;

  background: #FFFFFF;

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

  width: 60px;

  height: 60px;

  line-height: 62px;

  display: block;

  text-align: center;

  border-radius: 50%;

  transition: 0.3s;

  top: 50%;

  color: var(--color-heading-1);

}

@media only screen and (max-width: 576px) {

  .mySwiper-banner-shop .swiper-navigation .swiper-btn {

    display: none;

  }

}

.mySwiper-banner-shop .swiper-navigation .swiper-btn i {

  color: var(--color-primary);

}

.mySwiper-banner-shop .swiper-navigation .swiper-btn::after {

  display: none;

}

.mySwiper-banner-shop .swiper-navigation .swiper-btn.swiper-button-prev {

  left: 2.5%;

  opacity: 0;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .mySwiper-banner-shop .swiper-navigation .swiper-btn.swiper-button-prev {

    left: 2%;

    opacity: 1;

  }

}

@media only screen and (max-width: 1199px) {

  .mySwiper-banner-shop .swiper-navigation .swiper-btn.swiper-button-prev {

    left: 30px;

    opacity: 1;

  }

}

@media only screen and (max-width: 767px) {

  .mySwiper-banner-shop .swiper-navigation .swiper-btn.swiper-button-prev {

    left: auto;

    right: 20%;

    top: auto;

    bottom: 30px;

  }

}

.mySwiper-banner-shop .swiper-navigation .swiper-btn.swiper-button-next {

  right: 2.5%;

  opacity: 0;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .mySwiper-banner-shop .swiper-navigation .swiper-btn.swiper-button-next {

    right: 2%;

    opacity: 1;

  }

}

@media only screen and (max-width: 1199px) {

  .mySwiper-banner-shop .swiper-navigation .swiper-btn.swiper-button-next {

    right: 30px;

    opacity: 1;

  }

}

@media only screen and (max-width: 767px) {

  .mySwiper-banner-shop .swiper-navigation .swiper-btn.swiper-button-next {

    left: auto;

    right: 8%;

    top: auto;

    bottom: 30px;

  }

}

.mySwiper-banner-shop .swiper-navigation .swiper-btn:hover {

  background: var(--color-primary);

  transform: translateY(-50%) scale(1.15);

}

.mySwiper-banner-shop .swiper-navigation .swiper-btn:hover i {

  color: #fff;

}

.mySwiper-banner-shop .swiper-pagination-banner-shop {

  position: absolute;

  left: 50%;

  transform: translateX(-50%);

  bottom: 40px;

  top: auto;

  max-width: max-content;

  z-index: 100;

}

.mySwiper-banner-shop .swiper-pagination-banner-shop .swiper-pagination-bullet {

  background: var(--color-border);

  opacity: 1;

  width: 8px;

  height: 8px;

  transition: var(--transition);

}

.mySwiper-banner-shop .swiper-pagination-banner-shop .swiper-pagination-bullet-active {

  background: var(--color-primary-2);

  width: 40px;

  border-radius: 30px;

}

.mySwiper-banner-shop:hover .swiper-navigation .swiper-button-prev {

  left: 2%;

  opacity: 1;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .mySwiper-banner-shop:hover .swiper-navigation .swiper-button-prev {

    left: 2%;

    opacity: 1;

  }

}

@media only screen and (max-width: 1199px) {

  .mySwiper-banner-shop:hover .swiper-navigation .swiper-button-prev {

    left: 30px;

  }

}

@media only screen and (max-width: 767px) {

  .mySwiper-banner-shop:hover .swiper-navigation .swiper-button-prev {

    left: auto;

    right: 20%;

    top: auto;

    bottom: 30px;

  }

}

.mySwiper-banner-shop:hover .swiper-navigation .swiper-button-next {

  right: 2%;

  opacity: 1;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .mySwiper-banner-shop:hover .swiper-navigation .swiper-button-next {

    right: 2%;

    opacity: 1;

  }

}

@media only screen and (max-width: 1199px) {

  .mySwiper-banner-shop:hover .swiper-navigation .swiper-button-next {

    right: 30px;

  }

}

@media only screen and (max-width: 767px) {

  .mySwiper-banner-shop:hover .swiper-navigation .swiper-button-next {

    left: auto;

    right: 7%;

    top: auto;

    bottom: 30px;

  }

}



.mySwiper-banner-shop .tmp-banner-main-area {

  background-position: center;

  background-size: cover;

  background-repeat: no-repeat;

}

.mySwiper-banner-shop .tmp-banner-main-area.image-one {

  background-image: url(../images/banner/shop/01.webp);

}

.mySwiper-banner-shop .tmp-banner-main-area.image-two {

  background-image: url(../images/banner/shop/02.webp);

}

.mySwiper-banner-shop .tmp-banner-main-area .banner-six-wrapper {

  padding-top: 120px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .mySwiper-banner-shop .tmp-banner-main-area .banner-six-wrapper {

    padding-left: 20px;

  }

}

@media only screen and (max-width: 576px) {

  .mySwiper-banner-shop .tmp-banner-main-area .banner-six-wrapper {

    padding-top: 60px;

  }

}

.mySwiper-banner-shop .tmp-banner-main-area .banner-six-wrapper .sub-title {

  transition-delay: 0.3s;

  opacity: 0;

  animation: none;

  font-weight: 500;

}

.mySwiper-banner-shop .tmp-banner-main-area .banner-six-wrapper .title-banner {

  transition-delay: 0.5s;

  opacity: 0;

  animation: none;

  font-size: 70px;

  line-height: 1.3;

  margin-bottom: 30px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .mySwiper-banner-shop .tmp-banner-main-area .banner-six-wrapper .title-banner {

    font-size: 44px;

  }

}

@media only screen and (max-width: 1199px) {

  .mySwiper-banner-shop .tmp-banner-main-area .banner-six-wrapper .title-banner {

    font-size: 44px;

  }

}

@media only screen and (max-width: 576px) {

  .mySwiper-banner-shop .tmp-banner-main-area .banner-six-wrapper .title-banner {

    font-size: 36px;

  }

}

.mySwiper-banner-shop .tmp-banner-main-area .banner-six-wrapper .offer-text {

  transition-delay: 0.6s;

  opacity: 0;

  animation: none;

  font-size: 18px;

  line-height: 1.3;

  margin-bottom: 30px;

  display: flex;

  align-items: center;

  gap: 12px;

  font-weight: 500;

  color: var(--color-heading-1);

}

.mySwiper-banner-shop .tmp-banner-main-area .banner-six-wrapper .offer-text .banner-price {

  font-size: 30px;

  color: var(--color-primary);

  font-weight: 700;

}

.mySwiper-banner-shop .tmp-banner-main-area .banner-six-wrapper .offer-text .offer-banner {

  background: #ff75a0;

  color: var(--color-white);

  border-radius: 30px;

  text-transform: uppercase;

  font-weight: 600;

  white-space: nowrap;

  padding: 4px 8px;

  font-size: 12px;

}

.mySwiper-banner-shop .tmp-banner-main-area .banner-six-wrapper .button-area-banner {

  transition-delay: 0.7s;

  opacity: 0;

  animation: none;

}

.mySwiper-banner-shop .swiper-slide.swiper-slide-active .tmp-banner-main-area .banner-six-wrapper .sub-title {

  animation: fadeInDownslideshow 0.8s;

  animation-delay: 0.3s;

  display: block;

  opacity: 1;

}

.mySwiper-banner-shop .swiper-slide.swiper-slide-active .tmp-banner-main-area .banner-six-wrapper .title-banner {

  animation: fadeInDownslideshow 0.8s;

  animation-delay: 0.5s;

  opacity: 1;

}

.mySwiper-banner-shop .swiper-slide.swiper-slide-active .tmp-banner-main-area .banner-six-wrapper .offer-text {

  animation: fadeInDownslideshow 0.8s;

  animation-delay: 0.6s;

  opacity: 1;

}

.mySwiper-banner-shop .swiper-slide.swiper-slide-active .tmp-banner-main-area .banner-six-wrapper .button-area-banner {

  animation: fadeInDownslideshow 0.8s;

  animation-delay: 0.7s;

  opacity: 1;

}



@-webkit-keyframes fadeInDownslideshow {

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, -40px, 0);

    transform: translate3d(0, -40px, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes fadeInDownslideshow {

  from {

    opacity: 0;

    -webkit-transform: translate3d(0, -40px, 0);

    transform: translate3d(0, -40px, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

.banner-four-main-wrapper {

  height: 777px;

  position: relative;

  z-index: 1;

}

.banner-four-main-wrapper::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  z-index: -1;

  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 1.54%, rgba(255, 94, 20, 0.14) 61.88%, rgba(255, 94, 20, 0.81) 100%);

}

.banner-four-main-wrapper .banner-four-content {

  height: 100%;

  display: flex;

  flex-direction: column;

  justify-content: end;

  padding: 0 0 72px 60px;

  max-width: 600px;

}

@media only screen and (max-width: 991px) {

  .banner-four-main-wrapper .banner-four-content {

    justify-content: center;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .banner-four-main-wrapper .banner-four-content {

    max-width: 510px;

    padding: 0 0 0px 60px;

  }

}

.banner-four-main-wrapper .banner-four-content span.b_one-pre {

  letter-spacing: 0.1em;

  font-weight: 600;

  font-size: 16px;

  line-height: 1;

  font-family: var(--font-primary);

  color: var(--color-white);

  text-transform: uppercase;

  transition-delay: 0.5s;

  display: block;

  max-width: max-content;

}

.banner-four-main-wrapper .banner-four-content .title-banner {

  margin-top: 20px;

  font-weight: 600;

  font-size: 55px;

  line-height: 1.2;

  color: var(--color-white);

  margin-bottom: 20px;

  transition-delay: 1s;

}

@media only screen and (max-width: 1199px) {

  .banner-four-main-wrapper .banner-four-content .title-banner {

    font-size: 49px;

    line-height: 70px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .banner-four-main-wrapper .banner-four-content .title-banner {

    font-size: 38px;

    line-height: 50px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-four-main-wrapper .banner-four-content .title-banner {

    font-size: 42px;

    line-height: 50px;

  }

}

@media only screen and (max-width: 576px) {

  .banner-four-main-wrapper .banner-four-content .title-banner {

    font-size: 30px;

    line-height: 45px;

  }

}

.banner-four-main-wrapper .banner-four-content .desc {

  color: var(--color-white);

}

.banner-four-main-wrapper .banner-four-content .button-area-banner {

  display: flex;

  align-items: center;

  gap: 20px;

  transition-delay: 2s;

}

@media only screen and (max-width: 576px) {

  .banner-four-main-wrapper .banner-four-content .button-area-banner {

    flex-direction: column;

    justify-content: flex-start;

    align-items: flex-start;

  }

}

.banner-four-main-wrapper .banner-four-content .button-area-banner .tmp-btn {

  font-family: var(--font-primary);

  font-weight: 700;

  padding: 21px 33px;

  background: var(--color-white);

  color: var(--color-primary-2);

}

.banner-four-main-wrapper .banner-four-content .button-area-banner .tmp-btn:hover {

  color: #fff;

}

.banner-four-main-wrapper .banner-four-content .button-area-banner .tmp-btn::after {

  background: var(--color-heading-1);

}



@media only screen and (max-width: 1199px) {

  .banner-two-wrapper {

    padding-left: 30px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-two-wrapper {

    padding-left: 15px;

  }

}

.banner-two-wrapper .sub-title {

  display: flex;

  align-items: center;

  gap: 15px;

  color: var(--color-heading-1);

  font-size: 18px;

}

.banner-two-wrapper .sub-title span.tag {

  letter-spacing: 0.1em;

  font-weight: 500;

  font-size: 16px;

  line-height: 1;

  font-family: var(--font-primary);

  color: var(--color-white);

  text-transform: uppercase;

  transition-delay: 0.5s;

  display: block;

  background: var(--color-primary-2);

  max-width: max-content;

  padding: 6px 12px 5px;

  border-radius: 4px;

}

.banner-two-wrapper div.b_one-pre {

  letter-spacing: 0.5px;

  font-weight: 500;

  font-size: 16px;

  line-height: 1;

  font-family: var(--font-primary);

  color: var(--color-heading-1);

  display: block;

  background: var(--color-primary);

  max-width: max-content;

  padding: 17px 24px 17px 20px;

  box-shadow: var(--shadow-1);

  background: #fff;

  border-radius: 4px;

  position: relative;

  z-index: 1;

}

.banner-two-wrapper div.b_one-pre::before {

  position: absolute;

  top: 50%;

  right: -19px;

  left: -19px;

  -webkit-transform: translateY(-50%);

  -moz-transform: translateY(-50%);

  transform: translateY(-50%);

  height: 45px;

  width: -moz-calc(100% + 38px);

  width: calc(100% + 38px);

  background: rgba(255, 255, 255, 0.5);

  -webkit-box-shadow: 0 0 29px rgba(209, 211, 237, 0.3882352941);

  box-shadow: 0 0 29px rgba(209, 211, 237, 0.3882352941);

  z-index: -1;

  content: "";

  -webkit-clip-path: polygon(100% 0, 97% 50%, 100% 100%, 0 100%, 3% 50%, 0 0);

  clip-path: polygon(100% 0, 97% 50%, 100% 100%, 0 100%, 3% 50%, 0 0);

}

@media only screen and (max-width: 1199px) {

  .banner-two-wrapper p.desc {

    max-width: 80%;

  }

  .banner-two-wrapper p.desc br {

    display: none;

  }

}

@media only screen and (max-width: 576px) {

  .banner-two-wrapper p.desc {

    max-width: 100%;

  }

}

.banner-two-wrapper .title-banner {

  margin-top: 20px;

  font-weight: 600;

  font-size: 64px;

  line-height: 85px;

  color: var(--color-black);

  margin-bottom: 20px;

  transition-delay: 1s;

}

@media only screen and (max-width: 1199px) {

  .banner-two-wrapper .title-banner {

    font-size: 49px;

    line-height: 70px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .banner-two-wrapper .title-banner {

    font-size: 42px;

    line-height: 56px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-two-wrapper .title-banner {

    font-size: 42px;

    line-height: 56px;

  }

}

@media only screen and (max-width: 576px) {

  .banner-two-wrapper .title-banner {

    font-size: 30px;

    line-height: 45px;

  }

}

.banner-two-wrapper .button-area-banner {

  display: flex;

  align-items: center;

  gap: 20px;

  transition-delay: 2s;

}

@media only screen and (max-width: 576px) {

  .banner-two-wrapper .button-area-banner {

    flex-direction: column;

    justify-content: flex-start;

    align-items: flex-start;

  }

}

.banner-two-wrapper .button-area-banner .tmp-btn {

  font-family: var(--font-primary);

  font-weight: 700;

  padding: 21px 33px;

}

.banner-two-wrapper .call-area {

  display: flex;

  align-items: center;

}

.banner-two-wrapper .call-area .icon {

  margin-right: 13px;

}

.banner-two-wrapper .call-area .icon i {

  width: 52px;

  height: 52px;

  background: #fff;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  transform: rotate(-35deg);

  color: var(--color-primary);

  font-weight: 600;

}

.banner-two-wrapper .call-area .detail span {

  display: block;

  text-transform: capitalize;

}

.banner-two-wrapper .call-area .detail a.number {

  font-weight: 700;

  font-size: 24px;

  color: #fff;

  line-height: 37px;

  transition: 0.3s;

}

.banner-two-wrapper .call-area .detail a.number:hover {

  color: var(--color-primary);

}



@media only screen and (max-width: 767px) {

  .section-title-area-4 {

    flex-wrap: wrap;

  }

}



.tmp-banner-main-area.area-6 {

  margin: 30px 30px;

  border-radius: 20px;

}

.tmp-banner-main-area.area-6 .section-inner {

  padding-top: 10px;

  border-radius: 5px;

  position: relative;

  overflow: hidden;

  z-index: 1;

  height: 650px;

}

@media only screen and (max-width: 991px) {

  .tmp-banner-main-area.area-6 .section-inner {

    height: 550px;

  }

}

.tmp-banner-main-area.area-6 .section-inner .right-side-image {

  position: relative;

  z-index: 2;

}

@media only screen and (max-width: 991px) {

  .tmp-banner-main-area.area-6 .section-inner .right-side-image {

    display: none;

  }

}

.tmp-banner-main-area.area-6 .section-inner .right-side-image img.main {

  max-width: 358px;

  margin-left: 60px;

}

@media only screen and (max-width: 991px) {

  .tmp-banner-main-area.area-6 .section-inner .right-side-image img.main {

    display: none;

  }

}

.tmp-banner-main-area.area-6 .section-inner .right-side-image img:nth-child(2) {

  position: absolute;

  bottom: 0;

  left: -36%;

  z-index: -1;

}

.tmp-banner-main-area.area-6 .section-inner .right-side-image img:nth-child(3) {

  position: absolute;

  bottom: 0;

  left: 46%;

  z-index: -2;

}

.tmp-banner-main-area.area-6 .section-inner .bg-shape {

  position: absolute;

  left: 0;

  bottom: 0;

  z-index: -1;

  top: 0;

  right: 0;

  height: 100%;

  width: 100%;

}

@media only screen and (max-width: 991px) {

  .tmp-banner-main-area.area-6 .section-inner .bg-shape {

    object-fit: cover;

  }

}



.banner-six-wrapper .sub-title {

  color: var(--color-primary-2);

  margin: 15px 0 17px;

}

.banner-six-wrapper .title-banner {

  font-size: 54px;

  line-height: 66px;

}

.banner-six-wrapper .button-area-banner .tmp-btn {

  display: flex;

  align-items: center;

  gap: 12px;

}



.banner-seven-main-wrapper {

  position: relative;

  z-index: 1;

  height: 854px;

  display: flex;

  align-items: center;

}

@media only screen and (max-width: 1199px) {

  .banner-seven-main-wrapper {

    height: 776px;

  }

}

@media only screen and (max-width: 991px) {

  .banner-seven-main-wrapper {

    height: 620px;

    display: flex;

    align-items: center;

  }

}

@media only screen and (max-width: 576px) {

  .banner-seven-main-wrapper {

    height: 500px;

  }

}

.banner-seven-main-wrapper .banner-hero-image {

  position: absolute;

  z-index: -3;

  top: 0;

  right: 0;

}

.banner-seven-main-wrapper .banner-shape img {

  position: absolute;

  z-index: 1;

}

.banner-seven-main-wrapper .banner-shape img:nth-child(1) {

  bottom: 0;

  left: 20px;

}

.banner-seven-main-wrapper .banner-shape img:nth-child(2) {

  top: 27%;

  left: 6%;

}

.banner-seven-main-wrapper .banner-three-wrapper {

  background: rgba(0, 0, 0, 0.16);

  padding: 70px 180px 50px 80px !important;

  border-radius: 6px;

  border-right: 4px solid #fff;

  backdrop-filter: blur(10px);

  overflow: hidden;

  position: relative;

}

@media only screen and (max-width: 1199px) {

  .banner-seven-main-wrapper .banner-three-wrapper {

    padding: 50px 30px 50px 30px !important;

  }

}

@media only screen and (max-width: 991px) {

  .banner-seven-main-wrapper .banner-three-wrapper {

    border: none;

  }

}

@media only screen and (max-width: 767px) {

  .banner-seven-main-wrapper .banner-three-wrapper {

    padding: 0 !important;

    background: transparent;

    backdrop-filter: none;

  }

  .banner-seven-main-wrapper .banner-three-wrapper::after {

    display: none;

  }

}

.banner-seven-main-wrapper .banner-three-wrapper .title-banner {

  margin-top: 20px;

  font-weight: 600;

  font-size: 60px;

  line-height: 73px;

  color: var(--color-white);

  margin-bottom: 20px;

  transition-delay: 1s;

  margin-top: 0;

}

@media only screen and (max-width: 991px) {

  .banner-seven-main-wrapper .banner-three-wrapper .title-banner {

    margin-top: 0;

  }

}

.banner-seven-main-wrapper .banner-three-wrapper .desc {

  color: #E0E0E0;

  max-width: 583px;

}

.banner-seven-main-wrapper .banner-three-wrapper .button-area-banner {

  display: flex;

  align-items: center;

  gap: 20px;

  transition-delay: 2s;

}

@media only screen and (max-width: 576px) {

  .banner-seven-main-wrapper .banner-three-wrapper .button-area-banner {

    flex-direction: column;

    justify-content: flex-start;

    align-items: flex-start;

  }

}

.banner-seven-main-wrapper .banner-three-wrapper .button-area-banner .tmp-btn {

  font-family: var(--font-primary);

  font-weight: 700;

  padding: 21px 33px;

}

.banner-seven-main-wrapper .banner-three-wrapper .button-area-banner .tmp-btn::after {

  background: var(--color-white);

}

.banner-seven-main-wrapper .banner-three-wrapper .button-area-banner .tmp-btn:hover {

  color: var(--color-primary-2);

}

.banner-seven-main-wrapper .banner-three-wrapper .button-area-banner .text-btn {

  display: flex;

  align-items: center;

  gap: 20px;

  font-size: 18px;

}

.banner-seven-main-wrapper .banner-three-wrapper .button-area-banner .text-btn .arrow {

  width: 60px;

  height: 60px;

  line-height: 65px;

  text-align: center;

  display: block;

  border-radius: 50%;

  color: var(--color-white);

  background: rgba(255, 255, 255, 0.2);

  position: relative;

  z-index: 1;

}

.banner-seven-main-wrapper .banner-three-wrapper .button-area-banner .text-btn .arrow i {

  transform: rotate(-45deg);

  font-size: 20px;

}

.banner-seven-main-wrapper .banner-three-wrapper .button-area-banner .text-btn .arrow::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  border-radius: 50%;

  top: 0;

  left: 0;

  background: rgba(255, 255, 255, 0.03);

  animation: pulse-border 4s linear infinite;

}

.banner-seven-main-wrapper .banner-three-wrapper .button-area-banner .text-btn p {

  font-size: 20px;

  line-height: 24px;

  font-family: var(--font-primary);

  color: var(--color-white);

  font-weight: 600;

}

.banner-seven-main-wrapper .banner-three-wrapper .button-area-banner .call-btn i {

  color: var(--color-white);

  transition: 0.9s;

}

.banner-seven-main-wrapper .banner-three-wrapper .button-area-banner .call-btn span {

  color: var(--color-white);

}

.banner-seven-main-wrapper .banner-three-wrapper .button-area-banner .call-btn:hover i {

  transform: rotateY(-360deg);

}

.banner-seven-main-wrapper .banner-shape {

  content: "";

  position: absolute;

  top: 35%;

  left: 0;

  transform: translateY(-35%);

  z-index: -1;

  background: var(--color-heading-1);

  width: 65%;

  height: 71%;

  border-radius: 0 30px 30px 0;

}

.banner-seven-main-wrapper .social-area {

  display: flex;

  align-items: center;

  gap: 5px;

  position: absolute;

  z-index: 1;

  bottom: 32%;

  right: -70px;

  transform: rotate(-90deg);

}

@media only screen and (max-width: 991px) {

  .banner-seven-main-wrapper .social-area {

    display: none;

  }

}

.banner-seven-main-wrapper .social-area .line {

  width: 112px;

  height: 2px;

  background: var(--color-white);

}

.banner-seven-main-wrapper .social-area li a {

  color: var(--color-white);

  position: relative;

  height: 40px;

  width: 40px;

  display: flex;

  align-items: center;

  justify-content: center;

  z-index: 1;

}

.banner-seven-main-wrapper .social-area li a::after {

  position: absolute;

  content: "";

  z-index: -1;

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%) scale(0.2);

  opacity: 0;

  width: 100%;

  height: 100%;

  background: var(--color-primary);

  transition: 0.3s;

  border-radius: 50%;

}

.banner-seven-main-wrapper .social-area li a:hover::after {

  transform: translate(-50%, -50%) scale(1);

  opacity: 1;

}



.tmp-banner-area.banner-ten {

  position: relative;

  z-index: 1;

  background: #f5f5f5;

}

@media only screen and (max-width: 991px) {

  .tmp-banner-area.banner-ten {

    background: transparent;

  }

}

.tmp-banner-area.banner-ten .shape {

  position: absolute;

  left: 0;

  top: 0;

  width: 50%;

  height: 100%;

  background: #ffffff;

  z-index: -1;

}

.tmp-banner-area.banner-ten .sun {

  position: absolute;

  top: 20px;

  right: 50px;

}

.tmp-banner-area.banner-ten .circle-text-wrap {

  margin-top: 90px;

  position: absolute;

  left: 50%;

  top: 10%;

  transform: translate(-50%, -50%);

  inset-inline-end: auto;

  bottom: 0;

  background-color: #fff;

  width: 192px;

  height: 192px;

  backdrop-filter: blur(10px);

  border-radius: 50%;

  z-index: 5;

  overflow: hidden;

  box-shadow: var(--shadow-1);

}

@media only screen and (max-width: 991px) {

  .tmp-banner-area.banner-ten .circle-text-wrap {

    left: 74%;

    top: 42%;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-banner-area.banner-ten .circle-text-wrap {

    display: none;

  }

}

.tmp-banner-area.banner-ten .circle-text-wrap .circle-text {

  width: 158px;

  height: 163px;

  background-size: 100%;

  background-repeat: no-repeat;

  -webkit-animation: textrotate 20s infinite linear;

  animation: textrotate 20s infinite linear;

  position: absolute;

  inset-inline-start: 50%;

  top: 50%;

  transform: translate(-50%, -50%);

  z-index: 6;

}

.tmp-banner-area.banner-ten .circle-text-wrap .circle-icon {

  width: 200px;

  height: 200px;

  line-height: 1;

  display: -webkit-inline-box;

  display: -ms-inline-flexbox;

  display: inline-flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  -webkit-box-pack: center;

  -ms-flex-pack: center;

  justify-content: center;

}

.tmp-banner-area.banner-ten .circle-text-wrap .circle-icon i {

  color: var(--color-heading-1);

  font-size: 75px;

}



@-webkit-keyframes textrotate {

  0% {

    -webkit-transform: translate(-50%, -50%) rotate(0deg);

    transform: translate(-50%, -50%) rotate(0deg);

  }

  100% {

    -webkit-transform: translate(-50%, -50%) rotate(360deg);

    transform: translate(-50%, -50%) rotate(360deg);

  }

}

@keyframes textrotate {

  0% {

    -webkit-transform: translate(-50%, -50%) rotate(0deg);

    transform: translate(-50%, -50%) rotate(0deg);

  }

  100% {

    -webkit-transform: translate(-50%, -50%) rotate(360deg);

    transform: translate(-50%, -50%) rotate(360deg);

  }

}

.banner-ten-main-wrapper .banner-content-wapper {

  padding: 130px 0 160px 0;

  max-width: 548px;

}

@media only screen and (max-width: 1199px) {

  .banner-ten-main-wrapper .banner-content-wapper {

    padding: 100px 0 85px 0;

  }

}

@media only screen and (max-width: 991px) {

  .banner-ten-main-wrapper .banner-content-wapper {

    max-width: 100%;

    padding: 50px 0;

  }

}

.banner-ten-main-wrapper .banner-content-wapper .video-btn {

  display: flex;

  align-items: center;

  gap: 20px;

  margin-bottom: 60px;

  color: var(--color-heading-1);

  font-size: 20px;

  font-weight: 600;

  font-family: var(--font-primary);

}

.banner-ten-main-wrapper .banner-content-wapper .video-btn a {

  width: 45px;

  height: 45px;

  line-height: 41px;

  text-align: center;

  justify-content: center;

  display: flex;

  border-radius: 50%;

  color: var(--color-heading-1);

  background: rgba(211, 211, 211, 0.39);

  position: relative;

  z-index: 1;

  align-items: center;

}

.banner-ten-main-wrapper .banner-content-wapper .video-btn a i {

  font-size: 18px;

  color: var(--color-primary);

}

.banner-ten-main-wrapper .banner-content-wapper .video-btn a::after {

  content: "";

  position: absolute;

  width: 72px;

  height: 72px;

  border-radius: 50%;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  background: rgba(241, 241, 241, 0.25);

}

.banner-ten-main-wrapper .banner-content-wapper span.b_one-pre {

  letter-spacing: 0.1px;

  font-weight: 500;

  font-size: 16px;

  line-height: 1;

  font-family: var(--font-secondary);

  color: var(--color-body);

  transition-delay: 0.5s;

  display: block;

  max-width: max-content;

}

.banner-ten-main-wrapper .banner-content-wapper span.b_one-pre .subtitle-bg {

  background: var(--primary-100);

  color: var(--color-primary);

}

.banner-ten-main-wrapper .banner-content-wapper .title-banner {

  margin-top: 20px;

  font-weight: 600;

  font-size: 55px;

  line-height: 72px;

  color: var(--color-black);

  margin-bottom: 20px;

  transition-delay: 1s;

}

@media only screen and (max-width: 1199px) {

  .banner-ten-main-wrapper .banner-content-wapper .title-banner {

    font-size: 40px;

    line-height: 1.4;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .banner-ten-main-wrapper .banner-content-wapper .title-banner {

    font-size: 42px;

    line-height: 56px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-ten-main-wrapper .banner-content-wapper .title-banner {

    font-size: 42px;

    line-height: 56px;

  }

}

@media only screen and (max-width: 576px) {

  .banner-ten-main-wrapper .banner-content-wapper .title-banner {

    font-size: 30px;

    line-height: 45px;

  }

}

.banner-ten-main-wrapper .banner-content-wapper .desc {

  max-width: 472px;

  font-size: 18px;

  line-height: 30px;

}

.banner-ten-main-wrapper .banner-content-wapper .button-area-banner {

  display: flex;

  align-items: center;

  gap: 15px;

  transition-delay: 2s;

}

@media only screen and (max-width: 576px) {

  .banner-ten-main-wrapper .banner-content-wapper .button-area-banner {

    flex-direction: column;

    justify-content: flex-start;

    align-items: flex-start;

  }

}

.banner-ten-main-wrapper .banner-content-wapper .button-area-banner .tmp-button-overlay-with-text {

  gap: 10px;

}

.banner-ten-main-wrapper .banner-content-wapper .button-area-banner .text-btn {

  display: flex;

  align-items: center;

  gap: 20px;

  font-size: 16px;

  font-weight: 400;

}

.banner-ten-main-wrapper .banner-content-wapper .button-area-banner .text-btn .arrow {

  width: 46px;

  height: 46px;

  line-height: 52px;

  text-align: center;

  display: block;

  border-radius: 50%;

  color: var(--color-white);

  background: var(--color-primary);

  position: relative;

  z-index: 1;

}

.banner-ten-main-wrapper .banner-content-wapper .button-area-banner .text-btn .arrow i {

  transform: rotate(-45deg);

  font-size: 20px;

  color: var(--color-white);

}

.banner-ten-main-wrapper .banner-content-wapper .button-area-banner .text-btn .arrow::before {

  content: "";

  display: block;

  position: absolute;

  top: 0;

  right: 0;

  z-index: -1;

  bottom: 0;

  left: 0;

  -webkit-transition: 0.3s;

  transition: 0.3s;

  border-radius: 50%;

  border: 1.5px solid var(--color-primary);

  animation: rippleBorder_03 1.5s linear infinite;

}

.banner-ten-main-wrapper .banner-content-wapper .button-area-banner .text-btn .arrow::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  border-radius: 50%;

  top: 0;

  left: 0;

  background: rgba(0, 0, 0, 0.03);

  border: 1px solid var(--color-primary);

  animation: rippleBorder_03 3s linear infinite;

}

.banner-ten-main-wrapper .banner-content-wapper .button-area-banner .text-btn p {

  font-size: 20px;

  line-height: 24px;

  font-family: var(--font-primary);

  color: var(--color-heading-1);

  font-weight: 600;

}

.banner-ten-main-wrapper .banner-hero {

  position: relative;

  z-index: 1;

  height: 100%;

  width: 100%;

}

.banner-ten-main-wrapper .banner-hero img {

  position: absolute;

  bottom: 0;

  right: -190px;

  max-width: max-content;

}

@media only screen and (max-width: 1199px) {

  .banner-ten-main-wrapper .banner-hero img {

    right: -117px;

    max-width: 540px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-ten-main-wrapper .banner-hero img {

    right: auto;

  }

}

@media only screen and (max-width: 576px) {

  .banner-ten-main-wrapper .banner-hero img {

    max-width: 100%;

  }

}



.circle-1 {

  animation: rotateIt 130s linear infinite;

}



.marquee.area-ten {

  position: relative;

  z-index: 1;

  bottom: unset;

  padding: 50px 0;

}

@media only screen and (max-width: 991px) {

  .marquee.area-ten {

    margin-top: 80px;

  }

}

@media only screen and (max-width: 576px) {

  .marquee.area-ten {

    margin-top: 0 !important;

    padding-top: 0;

    padding-bottom: 0;

  }

}

.marquee.area-ten .float-img {

  position: absolute;

  bottom: 0;

  left: 0;

  z-index: 1;

  overflow: hidden;

  border-radius: 10px;

  max-width: 320px;

}

@media only screen and (max-width: 991px) {

  .marquee.area-ten .float-img {

    max-width: 270px;

  }

}

.marquee.area-ten .marquee__item {

  animation: marquee 340s linear infinite;

}

.marquee.area-ten .marquee__item .main--wrapper-tt h2 {

  font-size: 120px;

  opacity: 1;

  text-transform: uppercase;

  -webkit-text-stroke: 0;

  -webkit-text-fill-color: initial;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .marquee.area-ten .marquee__item .main--wrapper-tt h2 {

    font-size: 80px;

  }

}

@media only screen and (max-width: 991px) {

  .marquee.area-ten .marquee__item .main--wrapper-tt h2 {

    font-size: 90px;

  }

}

@media only screen and (max-width: 576px) {

  .marquee.area-ten .marquee__item .main--wrapper-tt h2 {

    font-size: 52px;

  }

}



@media only screen and (max-width: 1199px) {

  .pl_lg-10 {

    padding-left: 10px !important;

  }

}



.tmp-banner-slider-area.banner-five .banner-five-main-wrapper.banner-style-default .banner-three-wrapper .b_one-pre {

  text-transform: capitalize;

  font-size: 18px;

  letter-spacing: 0.5px;

  font-weight: 400;

}

@media only screen and (max-width: 1199px) {

  .tmp-banner-slider-area.banner-five .banner-five-main-wrapper.banner-style-default .banner-three-wrapper .b_one-pre {

    font-size: 18px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-banner-slider-area.banner-five .banner-five-main-wrapper.banner-style-default .banner-three-wrapper .b_one-pre {

    font-size: 16px;

  }

}

.tmp-banner-slider-area.banner-five .banner-five-main-wrapper.banner-style-default .banner-three-wrapper .title-banner {

  font-weight: 700;

  font-size: 70px;

  margin-top: 32px;

  line-height: 1.2;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-banner-slider-area.banner-five .banner-five-main-wrapper.banner-style-default .banner-three-wrapper .title-banner {

    font-size: 62px;

  }

}

@media only screen and (max-width: 1199px) {

  .tmp-banner-slider-area.banner-five .banner-five-main-wrapper.banner-style-default .banner-three-wrapper .title-banner {

    font-size: 44px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-banner-slider-area.banner-five .banner-five-main-wrapper.banner-style-default .banner-three-wrapper .title-banner {

    margin-top: 15px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-banner-slider-area.banner-five .banner-five-main-wrapper.banner-style-default .banner-three-wrapper .title-banner {

    margin-top: 15px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-banner-slider-area.banner-five .banner-five-main-wrapper.banner-style-default .banner-three-wrapper .title-banner {

    font-size: 32px;

    max-width: 97%;

  }

}

@media only screen and (max-width: 479px) {

  .tmp-banner-slider-area.banner-five .banner-five-main-wrapper.banner-style-default .banner-three-wrapper .title-banner {

    font-size: 28px;

  }

}

.tmp-banner-slider-area.banner-five .banner-five-main-wrapper.banner-style-default .banner-three-wrapper .desc {

  max-width: 550px;

  font-size: 16px;

  line-height: 28px;

}

@media only screen and (max-width: 991px) {

  .tmp-banner-slider-area.banner-five .banner-five-main-wrapper.banner-style-default .banner-three-wrapper .desc {

    max-width: 450px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-banner-slider-area.banner-five .banner-five-main-wrapper.banner-style-default .banner-three-wrapper .desc {

    max-width: 100%;

  }

}

.tmp-banner-slider-area.banner-five .banner-five-main-wrapper .banner-three-wrapper {

  opacity: 0;

}

.tmp-banner-slider-area.banner-five .banner-five-main-wrapper .banner-three-wrapper .b_one-pre {

  transition-delay: 0.1s;

  opacity: 0;

  animation: none;

}

.tmp-banner-slider-area.banner-five .banner-five-main-wrapper .banner-three-wrapper .title-banner {

  transition-delay: 0.3s;

  opacity: 0;

  animation: none;

}

.tmp-banner-slider-area.banner-five .banner-five-main-wrapper .banner-three-wrapper .desc {

  transition-delay: 0.5s;

  opacity: 0;

  animation: none;

}

.tmp-banner-slider-area.banner-five .banner-five-main-wrapper .banner-three-wrapper .button-area-banner {

  transition-delay: 0.7s;

  opacity: 0;

  animation: none;

}

.tmp-banner-slider-area.banner-five .banner-five-main-wrapper .banner-three-wrapper .author-rating-area {

  transition-delay: 0.9s;

  opacity: 0;

  animation: none;

}

.tmp-banner-slider-area.banner-five .banner-five-main-wrapper .banner-shape img:nth-child(1) {

  transition-delay: 0.2s;

  opacity: 0;

  animation: none;

}

@media only screen and (max-width: 576px) {

  .tmp-banner-slider-area.banner-five .banner-five-main-wrapper .banner-shape img:nth-child(1) {

    display: none;

  }

}

.tmp-banner-slider-area.banner-five .banner-five-main-wrapper .banner-shape img:nth-child(2) {

  transition-delay: 0.2s;

  opacity: 0;

  animation: none;

}



.banner-two-main-wrapper.banner-side-thumb-4 .banner-one-wrapper span.b_one-pre {

  transition-delay: 0.1s;

}

.banner-two-main-wrapper.banner-side-thumb-4 .banner-one-wrapper .title-banner {

  transition-delay: 0.3s;

}

.banner-two-main-wrapper.banner-side-thumb-4 .banner-one-wrapper .desc {

  transition-delay: 0.5s;

}

.banner-two-main-wrapper.banner-side-thumb-4 .banner-one-wrapper .desc {

  transition-delay: 0.7s;

}

.banner-two-main-wrapper.banner-side-thumb-4 .banner-one-wrapper .button-area-banner {

  transition-delay: 0.9s;

}

.banner-two-main-wrapper.banner-side-thumb-4 .banner-one-wrapper .button-area-banner .tmp-button-overlay-with-text .tmp-icon-overlay-link-btn::after {

  background-color: rgba(255, 255, 255, 0.0901960784);

}

.banner-two-main-wrapper.banner-side-thumb-4 .banner-one-wrapper .button-area-banner .tmp-button-overlay-with-text .tmp-icon-overlay-link-btn i {

  font-weight: 400;

}



.swiper-wrapper .swiper-slide.swiper-slide-active .banner-five-main-wrapper .banner-three-wrapper {

  opacity: 1;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .swiper-wrapper .swiper-slide.swiper-slide-active .banner-five-main-wrapper .banner-three-wrapper {

    max-width: 90%;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .swiper-wrapper .swiper-slide.swiper-slide-active .banner-five-main-wrapper .banner-three-wrapper.md-sm-controler {

    padding: 95px 0 160px !important;

  }

}

@media (max-width: 668px) {

  .swiper-wrapper .swiper-slide.swiper-slide-active .banner-five-main-wrapper .banner-three-wrapper.md-sm-controler {

    padding: 80px 0 !important;

  }

}

.swiper-wrapper .swiper-slide.swiper-slide-active .banner-five-main-wrapper .banner-three-wrapper .b_one-pre {

  animation: fadeInDownslideshow 0.8s;

  animation-delay: 0.1s;

  display: block;

  opacity: 1;

}

.swiper-wrapper .swiper-slide.swiper-slide-active .banner-five-main-wrapper .banner-three-wrapper .title-banner {

  animation: fadeInDownslideshow 0.8s;

  animation-delay: 0.3s;

  opacity: 1;

}

@media only screen and (max-width: 1199px) {

  .swiper-wrapper .swiper-slide.swiper-slide-active .banner-five-main-wrapper .banner-three-wrapper .title-banner br {

    display: none;

  }

}

.swiper-wrapper .swiper-slide.swiper-slide-active .banner-five-main-wrapper .banner-three-wrapper .desc {

  animation: fadeInDownslideshow 0.8s;

  animation-delay: 0.5s;

  opacity: 1;

}

.swiper-wrapper .swiper-slide.swiper-slide-active .banner-five-main-wrapper .banner-three-wrapper .button-area-banner {

  animation: fadeInDownslideshow 0.8s;

  animation-delay: 0.7s;

  opacity: 1;

}

.swiper-wrapper .swiper-slide.swiper-slide-active .banner-five-main-wrapper .banner-three-wrapper .author-rating-area {

  animation: fadeInDownslideshow 0.8s;

  animation-delay: 0.8s;

  opacity: 1;

}

.swiper-wrapper .swiper-slide.swiper-slide-active .banner-five-main-wrapper .banner-three-wrapper .social-share-wrapper-1 {

  animation: fadeInDownslideshow 0.8s;

  animation-delay: 0.8s;

  opacity: 1;

}

.swiper-wrapper .swiper-slide.swiper-slide-active .banner-five-main-wrapper .banner-shape img:nth-child(1) {

  animation: fadeInLeft 0.8s;

  animation-delay: 0.2s;

  opacity: 1;

  top: 0;

  bottom: 0;

}

@media only screen and (max-width: 767px) {

  .swiper-wrapper .swiper-slide.swiper-slide-active .banner-five-main-wrapper .banner-shape img:nth-child(1) {

    display: none;

  }

}

.swiper-wrapper .swiper-slide.swiper-slide-active .banner-five-main-wrapper .banner-shape img:nth-child(2) {

  animation: fadeInRight 0.8s;

  animation-delay: 0.2s;

  opacity: 1;

  bottom: 0;

  top: 0;

}

@media only screen and (max-width: 767px) {

  .swiper-wrapper .swiper-slide.swiper-slide-active .banner-five-main-wrapper .banner-shape img:nth-child(2) {

    display: none;

  }

}

.swiper-wrapper .swiper-slide.swiper-slide-active .banner-two-main-wrapper .banner-one-wrapper {

  opacity: 1;

}

.swiper-wrapper .swiper-slide.swiper-slide-active .banner-two-main-wrapper .banner-one-wrapper span.b_one-pre {

  animation: slideInUp3 0.8s;

  animation-delay: 0.1s;

  display: block;

  opacity: 1;

}

.swiper-wrapper .swiper-slide.swiper-slide-active .banner-two-main-wrapper .banner-one-wrapper .title-banner {

  animation: fadeInUp 0.8s;

  animation-delay: 0.3s;

  opacity: 1;

}

.swiper-wrapper .swiper-slide.swiper-slide-active .banner-two-main-wrapper .banner-one-wrapper .desc {

  animation: fadeInUp 0.8s;

  animation-delay: 0.5s;

  opacity: 1;

}

.swiper-wrapper .swiper-slide.swiper-slide-active .banner-two-main-wrapper .banner-one-wrapper .button-area-banner {

  animation: fadeInUp 0.8s;

  animation-delay: 0.7s;

  opacity: 1;

}

.swiper-wrapper .swiper-slide.swiper-slide-active .banner-two-main-wrapper .banner-hero-image {

  animation: fadeInRight 0.8s;

  animation-delay: 0.5s;

  opacity: 1;

}

.swiper-wrapper .swiper-slide.swiper-slide-active .banner-two-main-wrapper .watermark.one {

  animation: fadeInDown 0.8s;

  animation-delay: 0.5s;

  opacity: 1;

}

.swiper-wrapper .swiper-slide.swiper-slide-active .banner-two-main-wrapper .watermark.two {

  animation: fadeInUp 0.8s;

  animation-delay: 0.5s;

  opacity: 1;

}



.thumbBannerSlide2 .banner-four-main-wrapper .banner-four-content .b_one-pre {

  transition-delay: 0.1s;

  opacity: 0;

  animation: none;

}

.thumbBannerSlide2 .banner-four-main-wrapper .banner-four-content .title-banner {

  transition-delay: 0.3s;

  opacity: 0;

  animation: none;

}

.thumbBannerSlide2 .banner-four-main-wrapper .banner-four-content .desc {

  transition-delay: 0.5s;

  opacity: 0;

  animation: none;

}

.thumbBannerSlide2 .banner-four-main-wrapper .banner-four-content .button-area-banner {

  transition-delay: 0.7s;

  opacity: 0;

  animation: none;

}

.thumbBannerSlide2 .swiper-slide.swiper-slide-active .banner-four-main-wrapper .banner-four-content span.b_one-pre {

  animation: slideInUp 0.8s;

  animation-delay: 0.1s;

  display: block;

  opacity: 1;

}

.thumbBannerSlide2 .swiper-slide.swiper-slide-active .banner-four-main-wrapper .banner-four-content .title-banner {

  animation: slideInUp 0.8s;

  animation-delay: 0.3s;

  opacity: 1;

  display: block;

}

.thumbBannerSlide2 .swiper-slide.swiper-slide-active .banner-four-main-wrapper .banner-four-content .desc {

  animation: slideInUp 0.8s;

  animation-delay: 0.5s;

  opacity: 1;

  display: block;

}

.thumbBannerSlide2 .swiper-slide.swiper-slide-active .banner-four-main-wrapper .banner-four-content .button-area-banner {

  animation: slideInUp 0.8s;

  animation-delay: 0.7s;

  opacity: 1;

  display: block;

}



.tmp-banner-area.banner-five.with-image {

  background-image: url(../images/bg/03.webp);

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 767px) {

  .tmp-banner-area.banner-five.with-image::after {

    position: absolute;

    content: "";

    left: 0;

    width: 100%;

    top: 0;

    height: 100%;

    background: rgba(32, 40, 45, 0.32);

    z-index: -1;

  }

}



.final-banner-five-animation-text .banner-five-final-bg .banner-three-wrapper .b_one-pre {

  transition-delay: 0.1s;

  opacity: 0;

  animation: none;

}

.final-banner-five-animation-text .banner-five-final-bg .banner-three-wrapper .title-banner {

  transition-delay: 0.3s;

  opacity: 0;

  animation: none;

}

.final-banner-five-animation-text .banner-five-final-bg .banner-three-wrapper .desc {

  transition-delay: 0.5s;

  opacity: 0;

  animation: none;

}

.final-banner-five-animation-text .banner-five-final-bg .banner-three-wrapper .button-area-banner {

  transition-delay: 0.7s;

  opacity: 0;

  animation: none;

}

.final-banner-five-animation-text .banner-five-final-bg .banner-three-wrapper .author-rating-area {

  transition-delay: 0.9s;

  opacity: 0;

  animation: none;

}

.final-banner-five-animation-text .swiper-slide.swiper-slide-active .banner-five-final-bg .banner-three-wrapper span.b_one-pre {

  animation: fadeInUp 0.8s;

  animation-delay: 0.1s;

  opacity: 1;

}

.final-banner-five-animation-text .swiper-slide.swiper-slide-active .banner-five-final-bg .banner-three-wrapper .title-banner {

  animation: fadeInUp 0.8s;

  animation-delay: 0.3s;

  opacity: 1;

  display: block;

}

.final-banner-five-animation-text .swiper-slide.swiper-slide-active .banner-five-final-bg .banner-three-wrapper .desc {

  animation: fadeInUp 0.8s;

  animation-delay: 0.5s;

  opacity: 1;

  display: block;

}

.final-banner-five-animation-text .swiper-slide.swiper-slide-active .banner-five-final-bg .banner-three-wrapper .button-area-banner {

  animation: fadeInUp 0.8s;

  animation-delay: 0.7s;

  opacity: 1;

}

.final-banner-five-animation-text .swiper-slide.swiper-slide-active .banner-five-final-bg .banner-three-wrapper .author-rating-area {

  animation: fadeInUp 0.8s;

  animation-delay: 0.9s;

  opacity: 1;

}



.banner-five-final {

  position: relative;

}

.banner-five-final .banner-slider-button {

  top: 55%;

}

.banner-five-final .banner-slider-button .swiper-btn {

  width: 60px;

  height: 60px;

  line-height: 65px;

  border-radius: 50%;

  text-align: center;

  color: var(--color-white);

  font-size: 20px;

  border: 1px solid rgba(193, 193, 193, 0.1803921569);

  background: transparent;

  transition: var(--transition);

  background: rgba(254, 254, 254, 0.2);

  backdrop-filter: blur(10px);

  display: flex;

  align-items: center;

  justify-content: center;

}

.banner-five-final .banner-slider-button .swiper-btn:hover {

  background: var(--color-primary-2);

  border: 1px solid var(--color-primary-2);

  transform: scale(1.2);

}

.banner-five-final .banner-slider-button .swiper-btn::after {

  display: none;

}

.banner-five-final .banner-slider-button .swiper-btn.slide-prev {

  right: 4%;

}

.banner-five-final .banner-slider-button .swiper-btn.swiper-button-next {

  right: 4%;

}



.banner-five-final-bg {

  background: var(--color-white);

}



.banner-wind-energy .slider-img-eight {

  background-image: url(../images/bg/wind-1.webp);

}

.banner-wind-energy .slider-img-01 {

  background-image: url(../images/bg/wind-2.webp);

}

.banner-wind-energy .slider-img-02 {

  background-image: url(../images/bg/wind-3.webp);

}



.thumbBannerSlide-wind .banner-three-wrapper {

  text-align: center;

}

.thumbBannerSlide-wind .banner-three-wrapper .b_one-pre {

  margin: auto;

  padding: 5px 12px;

  border-radius: 2px;

  background: rgba(255, 255, 255, 0.1294117647);

  font-size: 18px;

  text-transform: uppercase;

  letter-spacing: 1px;

}

@media only screen and (max-width: 767px) {

  .thumbBannerSlide-wind .banner-three-wrapper .b_one-pre {

    font-size: 14px;

  }

}

.thumbBannerSlide-wind .banner-three-wrapper .title-banner {

  font-weight: 700;

  margin-top: 32px;

}

.thumbBannerSlide-wind .banner-three-wrapper p.desc {

  margin: auto;

}

.thumbBannerSlide-wind .banner-three-wrapper .button-area-banner {

  margin-top: 40px;

}

@media only screen and (max-width: 576px) {

  .thumbBannerSlide-wind .banner-three-wrapper .button-area-banner {

    margin-top: 30px;

  }

}

.thumbBannerSlide-wind .banner-three-wrapper .button-area-banner .tmp-btn {

  margin: auto;

}

.thumbBannerSlide-wind .banner-three-wrapper .social-share-wrapper-1 {

  margin: auto;

  opacity: 0;

  transition-delay: 0.9s;

  margin-top: 50px;

}

@media only screen and (max-width: 576px) {

  .thumbBannerSlide-wind .banner-three-wrapper .social-share-wrapper-1 {

    margin-top: 30px;

  }

}

.thumbBannerSlide-wind .banner-three-wrapper .social-share-wrapper-1 .social-stylle-one li a {

  border-color: rgba(255, 255, 255, 0.1294117647);

}

.thumbBannerSlide-wind .banner-three-wrapper .social-share-wrapper-1 .social-stylle-one li a i {

  color: var(--color-white);

}



.tmp-banner-slider-area.banner-wind-energy.banner-nine .navigation-area .swiper-btn {

  border: 1px solid transparent;

  background: rgba(255, 255, 255, 0.0784313725);

}

.tmp-banner-slider-area.banner-wind-energy.banner-nine .banner-five-main-wrapper {

  height: 595px;

  display: flex;

  align-items: center;

}

@media only screen and (max-width: 991px) {

  .tmp-banner-slider-area.banner-wind-energy.banner-nine .banner-five-main-wrapper {

    height: 345px;

  }

}

.tmp-banner-slider-area.banner-wind-energy.banner-nine .banner-five-main-wrapper .banner-three-wrapper {

  margin: auto;

}

.tmp-banner-slider-area.banner-wind-energy.banner-nine .banner-five-main-wrapper .banner-three-wrapper.md-sm-controler {

  padding: 0 60px !important;

}

@media only screen and (max-width: 1199px) {

  .tmp-banner-slider-area.banner-wind-energy.banner-nine .banner-five-main-wrapper .banner-three-wrapper.md-sm-controler {

    padding: 0 0 !important;

  }

}

@media only screen and (max-width: 1199px) {

  .tmp-banner-slider-area.banner-wind-energy.banner-nine .banner-five-main-wrapper .banner-three-wrapper.md-sm-controler .title-banner {

    font-size: 44px;

  }

}

@media only screen and (max-width: 991px) {

  .tmp-banner-slider-area.banner-wind-energy.banner-nine .banner-five-main-wrapper .banner-three-wrapper.md-sm-controler .title-banner {

    font-size: 40px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-banner-slider-area.banner-wind-energy.banner-nine .banner-five-main-wrapper .banner-three-wrapper.md-sm-controler .title-banner {

    font-size: 32px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-banner-slider-area.banner-wind-energy.banner-nine .banner-five-main-wrapper .banner-three-wrapper.md-sm-controler .b_one-pre {

    font-size: 14px;

  }

}

.tmp-banner-slider-area.banner-wind-energy.banner-nine .banner-five-main-wrapper::before {

  backdrop-filter: blur(5px);

  background: rgba(0, 0, 0, 0.1803921569);

}

.tmp-banner-slider-area.banner-wind-energy.banner-nine .banner-five-main-wrapper::after {

  display: none;

}

.tmp-banner-slider-area.banner-wind-energy.banner-nine .banner-three-wrapper {

  padding: 130px 0 130px;

}

.tmp-banner-slider-area.banner-wind-energy.banner-nine .banner-shape {

  display: none;

}



.invers-swiper-thumb-wind {

  position: absolute;

  left: 50%;

  transform: translateX(-50%);

  bottom: -40px;

}

.invers-swiper-thumb-wind .swiper-wrapper {

  justify-content: center;

}

.invers-swiper-thumb-wind .swiper-wrapper .swiper-slide {

  display: inline-block;

  line-height: 100%;

  height: 80px;

  width: 80px !important;

  border-radius: 100%;

  cursor: pointer;

  position: relative;

  overflow: hidden;

  padding: 4px;

  transition: 0.4s;

}

.invers-swiper-thumb-wind .swiper-wrapper .swiper-slide img {

  object-fit: cover;

  height: 100%;

  border-radius: 100%;

  width: 100%;

  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);

}

.invers-swiper-thumb-wind .swiper-wrapper .swiper-slide::before {

  content: "";

  z-index: -1;

  top: 0;

  left: 0;

  position: absolute;

  background: var(--color-white);

  width: 100%;

  height: 100%;

  transition: 0.4s;

}

.invers-swiper-thumb-wind .swiper-wrapper .swiper-slide.swiper-slide-thumb-active::before {

  background: linear-gradient(90deg, var(--color-primary), var(--color-primary));

}



.banner-badge-pre-title-1 {

  letter-spacing: 0.5px;

  font-weight: 500;

  font-size: 16px;

  line-height: 1;

  font-family: var(--font-primary);

  color: var(--color-heading-1);

  display: block;

  background: var(--color-primary);

  max-width: max-content;

  padding: 17px 24px 17px 20px;

  box-shadow: var(--shadow-1);

  background: #fff;

  border-radius: 4px;

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 576px) {

  .banner-badge-pre-title-1 {

    padding: 9px 24px 9px 20px;

  }

}

.banner-badge-pre-title-1::before {

  position: absolute;

  top: 50%;

  right: -19px;

  left: -19px;

  -webkit-transform: translateY(-50%);

  -moz-transform: translateY(-50%);

  transform: translateY(-50%);

  height: 45px;

  width: -moz-calc(100% + 38px);

  width: calc(100% + 38px);

  background: rgba(255, 255, 255, 0.5);

  -webkit-box-shadow: 0 0 29px rgba(209, 211, 237, 0.3882352941);

  box-shadow: 0 0 29px rgba(209, 211, 237, 0.3882352941);

  z-index: -1;

  content: "";

  -webkit-clip-path: polygon(100% 0, 97% 50%, 100% 100%, 0 100%, 3% 50%, 0 0);

  clip-path: polygon(100% 0, 97% 50%, 100% 100%, 0 100%, 3% 50%, 0 0);

}

@media only screen and (max-width: 576px) {

  .banner-badge-pre-title-1::before {

    display: none;

  }

}



.author-rating-area {

  display: flex;

  align-items: center;

  gap: 20px;

  margin-top: 40px;

}

.author-rating-area .author ul {

  display: flex;

  align-items: center;

}

.author-rating-area .author ul li {

  cursor: pointer;

  transition: 0.3s;

}

.author-rating-area .author ul li:not(:first-child) {

  margin-left: -20px;

}

.author-rating-area .author ul li:hover {

  transform: translateY(-5px);

  z-index: 100;

}

.author-rating-area .author ul li:hover a {

  z-index: 100;

}

.author-rating-area .star-rating ul {

  display: flex;

  align-items: center;

  gap: 3px;

}

.author-rating-area .star-rating ul li {

  color: #FFC107;

}

.author-rating-area .star-rating p {

  font-family: var(--font-secondary);

  color: var(--color-heading-1);

  font-weight: 400;

}



.banner-area-hydro-power-area {

  background-image: url(../images/bg/hydro-1.webp);

  height: 860px;

  padding-bottom: 30px;

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 1199px) {

  .banner-area-hydro-power-area {

    height: auto;

    padding-bottom: 60px;

  }

}

@media only screen and (max-width: 991px) {

  .banner-area-hydro-power-area {

    padding-bottom: 60px;

  }

}

.banner-area-hydro-power-area.in-geothermal-energy {

  height: 960px;

}

@media only screen and (max-width: 1199px) {

  .banner-area-hydro-power-area.in-geothermal-energy {

    height: auto;

    padding-bottom: 80px;

  }

}

.banner-area-hydro-power-area.in-geothermal-energy .hero-bg-video {

  position: absolute;

  top: 0;

  right: 0;

  left: 0;

  bottom: 0;

  width: 100%;

  height: 100%;

  z-index: -1;

}

.banner-area-hydro-power-area.in-geothermal-energy .hero-bg-video video {

  width: 100%;

  height: 100%;

  object-fit: cover;

}

.banner-area-hydro-power-area.in-geothermal-energy .invers-feature-wrapper {

  margin-top: 110px;

}

@media only screen and (max-width: 991px) {

  .banner-area-hydro-power-area.in-geothermal-energy .invers-feature-wrapper {

    margin-top: 70px;

  }

}

@media only screen and (max-width: 479px) {

  .banner-area-hydro-power-area.in-geothermal-energy .invers-feature-wrapper {

    margin-top: 60px;

  }

}

@media only screen and (max-width: 576px) {

  .banner-area-hydro-power-area.in-geothermal-energy .invers-feature-card-one {

    background: rgba(255, 255, 255, 0.1098039216);

    backdrop-filter: blur(15px);

  }

  .banner-area-hydro-power-area.in-geothermal-energy .invers-feature-card-one * {

    color: var(--color-white);

  }

}

.banner-area-hydro-power-area.in-bio-energy {

  height: 700px;

  display: flex;

  align-items: center;

  background-image: url(../images/bg/bg-image-12.webp);

}

@media only screen and (max-width: 576px) {

  .banner-area-hydro-power-area.in-bio-energy {

    height: 750px;

  }

}

@media only screen and (max-width: 479px) {

  .banner-area-hydro-power-area.in-bio-energy {

    height: 690px;

    padding-top: 0;

  }

}

.banner-area-hydro-power-area::after {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  bottom: 0;

  right: 0;

  height: 100%;

  width: 100%;

  background: rgba(0, 0, 0, 0.2196078431);

  z-index: -1;

  backdrop-filter: blur(2px);

}

.banner-area-hydro-power-area .inner .description {

  color: var(--color-white);

  font-weight: 400;

  font-size: 22px;

  line-height: 1.4;

}

@media only screen and (max-width: 576px) {

  .banner-area-hydro-power-area .inner .description {

    font-size: 18px;

  }

}

.banner-area-hydro-power-area .inner .description .bold {

  font-weight: 500;

}

.banner-area-hydro-power-area .inner .inner-bottom-wrapper {

  display: flex;

  align-items: center;

  gap: 30px;

}

@media only screen and (max-width: 1199px) {

  .banner-area-hydro-power-area .inner .inner-bottom-wrapper {

    flex-wrap: wrap;

  }

}

@media only screen and (max-width: 576px) {

  .banner-area-hydro-power-area .inner .inner-bottom-wrapper {

    flex-wrap: wrap;

  }

}

.banner-area-hydro-power-area .inner .inner-bottom-wrapper .author-rating-area {

  margin-top: 0;

}

.banner-area-hydro-power-area .invers-feature-wrapper {

  margin-top: 150px;

}

@media only screen and (max-width: 1199px) {

  .banner-area-hydro-power-area .invers-feature-wrapper {

    margin-top: 60px;

  }

}

@media only screen and (max-width: 991px) {

  .banner-area-hydro-power-area .invers-feature-wrapper {

    margin-top: 70px;

  }

}

@media only screen and (max-width: 576px) {

  .banner-area-hydro-power-area .invers-feature-wrapper {

    margin-top: 30px;

  }

}



@media only screen and (max-width: 576px) {

  br {


  }

}



.hydro-power-banner-content .title {

  color: var(--color-white);

  font-weight: 700;

  margin-top: 30px;

  margin-bottom: 0;

  font-size: 54px;

  line-height: 1.4;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .hydro-power-banner-content .title br {

    display: none;

  }

}

@media only screen and (max-width: 1199px) {

  .hydro-power-banner-content .title br {

    display: none;

  }

}

@media only screen and (max-width: 991px) {

  .hydro-power-banner-content .title {

    font-size: 50px;

  }

}

@media only screen and (max-width: 767px) {

  .hydro-power-banner-content .title {

    font-size: 38px;

  }

}

@media only screen and (max-width: 479px) {

  .hydro-power-banner-content .title {

    font-size: 32px;

  }

}



.left-right-sm-margin {

  margin: 0 25px;

}

@media only screen and (max-width: 767px) {

  .left-right-sm-margin {

    margin: 0;

  }

}



.banner-bg-with-bottom-card {

  background-image: url(../images/bg/bg-image-13.webp);

  height: 960px;

  padding-bottom: 30px;

  position: relative;

  z-index: 1;

  display: flex;

  align-items: center;

  justify-content: center;

  position: relative;

  margin: 15px 15px 0px;

  border-radius: 16px;

  overflow: hidden;

}

.banner-bg-with-bottom-card.image-banner-five {

  background-image: url(../images/bg/bg-image-14.webp);

}

@media only screen and (max-width: 576px) {

  .banner-bg-with-bottom-card {

    margin: 0;

    border-radius: 0;

  }

}

.banner-bg-with-bottom-card::after {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  bottom: 0;

  right: 0;

  height: 100%;

  width: 100%;

  background: rgba(0, 0, 0, 0.2980392157);

  z-index: -1;

}

@media only screen and (max-width: 991px) {

  .banner-bg-with-bottom-card {

    height: 770px;

  }

}

@media only screen and (max-width: 576px) {

  .banner-bg-with-bottom-card {

    height: 660px;

  }

}



.content-banner-center-minimal {

  margin-top: 100px;

}

@media only screen and (max-width: 991px) {

  .content-banner-center-minimal {

    margin-top: 50px;

  }

}

@media only screen and (max-width: 576px) {

  .content-banner-center-minimal {

    margin-top: 0;

  }

}

.content-banner-center-minimal .title {

  color: var(--color-white);

  margin-top: 30px;

  margin-bottom: 30px;

  font-weight: 700;

}

.content-banner-center-minimal .social-share-wrapper-1 {

  margin-top: 30px;

}

.content-banner-center-minimal .social-share-wrapper-1 .social-stylle-one li a {

  border-color: rgba(255, 255, 255, 0.1294117647);

}

.content-banner-center-minimal .social-share-wrapper-1 .social-stylle-one li a i {

  color: var(--color-white);

}

.content-banner-center-minimal .button-area-banner {

  display: flex;

  align-items: center;

  gap: 20px;

}

@media only screen and (max-width: 479px) {

  .content-banner-center-minimal .button-area-banner {

    gap: 15px;

    flex-wrap: wrap;

  }

}



.tmp-banner-slider-area2.banner-right-bento {

  padding: 250px 0 120px 0;

}

@media only screen and (max-width: 991px) {

  .tmp-banner-slider-area2.banner-right-bento {

    padding: 120px 0 20px 0;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-banner-slider-area2.banner-right-bento {

    padding: 120px 0 60px 0;

  }

}

.tmp-banner-slider-area2.banner-right-bento::after {

  display: none;

}

.tmp-banner-slider-area2.banner-right-bento .banner-three-wrapper {

  padding: 0;

}

@media only screen and (max-width: 767px) {

  .tmp-banner-slider-area2.banner-right-bento .banner-three-wrapper {

    padding: 60px 0 0 !important;

  }

}

.tmp-banner-slider-area2.banner-right-bento .banner-three-wrapper .b_one-pre {

  padding: 5px 15px;

  border-radius: 33px;

  background: #f1f1f1;

}

.tmp-banner-slider-area2.banner-right-bento .banner-three-wrapper p.desc {

  font-family: var(--font-secondary);

}

.tmp-banner-slider-area2.banner-right-bento .thumbnail-banner-right {

  position: relative;

  display: flex;

  justify-content: flex-end;

  align-items: center;

}

.tmp-banner-slider-area2.banner-right-bento .thumbnail-banner-right .floating-content {

  position: absolute;

  display: flex;

  align-items: center;

  gap: 15px;

  background: #FFFFFF;

  box-shadow: 0px 5px 10px 5px rgba(0, 0, 0, 0.04);

  border-radius: 4px;

  bottom: 0%;

  left: -8%;

  padding: 30px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-banner-slider-area2.banner-right-bento .thumbnail-banner-right .floating-content {

    left: 6%;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-banner-slider-area2.banner-right-bento .thumbnail-banner-right .floating-content {

    left: 2%;

    padding: 10px;

  }

}

.tmp-banner-slider-area2.banner-right-bento .thumbnail-banner-right .floating-content .icon {

  width: 60px;

  height: 60px;

  line-height: 60px;

  border-radius: 50%;

  display: block;

  text-align: center;

  background: var(--primary-100);

}

.tmp-banner-slider-area2.banner-right-bento .thumbnail-banner-right .floating-content .icon svg {

  max-width: 25px;

}

.tmp-banner-slider-area2.banner-right-bento .thumbnail-banner-right .floating-content .text h2 {

  font-weight: 600;

  margin-bottom: 5px;

  font-size: 20px;

  line-height: 1.2;

}

.tmp-banner-slider-area2.banner-right-bento .thumbnail-banner-right .floating-content .text span a {

  transition: var(--transition);

  color: var(--color-primary-2);

  font-weight: 500;

}



.banner-area-slider-classic {

  height: 920px;

  background-image: url(../images/bg/bg-image-14.webp);

  display: flex;

  align-items: center;

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 991px) {

  .banner-area-slider-classic {

    height: 710px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-area-slider-classic {

    height: 700px;

  }

}

@media only screen and (max-width: 576px) {

  .banner-area-slider-classic {

    height: 575px;

  }

}

.banner-area-slider-classic.image-two {

  background-image: url(../images/bg/bg-image-15.webp);

}

.banner-area-slider-classic::after {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  bottom: 0;

  right: 0;

  height: 100%;

  width: 100%;

  z-index: -1;

  background: linear-gradient(90deg, #FF5E14 1.59%, rgba(0, 0, 0, 0) 100%);

  mix-blend-mode: multiply;

}

.banner-area-slider-classic .banner-main-wrapper-one .pre-title p {

  color: var(--color-white);

  padding: 6px 15px;

  border-radius: 33px;

  background: rgba(241, 241, 241, 0.2235294118);

  max-width: max-content;

  margin-bottom: 20px;

}

.banner-area-slider-classic .banner-main-wrapper-one .title {

  color: var(--color-white);

  font-weight: 700;

  line-height: 1.2;

  font-size: 74px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .banner-area-slider-classic .banner-main-wrapper-one .title {

    font-size: 52px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-area-slider-classic .banner-main-wrapper-one .title {

    font-size: 54px;

  }

}

@media only screen and (max-width: 576px) {

  .banner-area-slider-classic .banner-main-wrapper-one .title {

    font-size: 34px;

  }

}

.banner-area-slider-classic .banner-main-wrapper-one p.disc {

  color: var(--color-white);

  max-width: 85%;

}

@media only screen and (max-width: 576px) {

  .banner-area-slider-classic .banner-main-wrapper-one p.disc {

    max-width: 100%;

  }

}



.mySwiper-slider-classic .swiper-btn {

  width: 60px;

  height: 60px;

  line-height: 65px;

  border-radius: 50%;

  text-align: center;

  color: var(--color-white);

  font-size: 20px;

  border: 1px solid rgba(255, 255, 255, 0.3019607843);

  background: rgba(255, 255, 255, 0.1098039216);

  transition: var(--transition);

  backdrop-filter: blur(7px);

  top: 58%;

}

@media only screen and (max-width: 767px) {

  .mySwiper-slider-classic .swiper-btn {

    opacity: 0;

  }

  .mySwiper-slider-classic .swiper-btn:hover {

    opacity: 1;

  }

}

.mySwiper-slider-classic .swiper-btn:hover {

  background: var(--color-primary-2);

  border: 1px solid var(--color-primary-2);

  transform: scale(1.2);

}

.mySwiper-slider-classic .swiper-btn::after {

  display: none;

}

.mySwiper-slider-classic .swiper-btn.swiper-button-prev {

  left: 4%;

}

.mySwiper-slider-classic .swiper-btn.swiper-button-next {

  right: 4%;

}



.banner-bg-inner-swiper {

  background-image: url(../images/bg/bg-image-14.webp);

  height: 920px;

  position: relative;

  z-index: 1;

  display: flex;

  align-items: center;

}

@media only screen and (max-width: 1199px) {

  .banner-bg-inner-swiper {

    height: 720px;

  }

}

@media only screen and (max-width: 991px) {

  .banner-bg-inner-swiper {

    height: auto;

  }

}

.banner-bg-inner-swiper.carpenter-bg-2 {

  background-image: url(../images/bg/bg-image-16.webp);

}

.banner-bg-inner-swiper::after {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  bottom: 0;

  right: 0;

  height: 100%;

  width: 100%;

  z-index: -1;

  background: var(--color-primary);

  mix-blend-mode: multiply;

  filter: blur(13px);

  backdrop-filter: blur(3px);

}

.banner-bg-inner-swiper .banner-carpenter-thumb img {

  border-radius: 6px;

  overflow: hidden;

}

.banner-bg-inner-swiper .content-banner-center-minimal {

  margin-top: 0;

}

.banner-bg-inner-swiper .content-banner-center-minimal .title {

  font-size: 52px;

  line-height: 1.3;

}

@media only screen and (max-width: 1199px) {

  .banner-bg-inner-swiper .content-banner-center-minimal .title {

    font-size: 32px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-bg-inner-swiper .content-banner-center-minimal .title {

    font-size: 32px;

  }

}

@media only screen and (max-width: 576px) {

  .banner-bg-inner-swiper .content-banner-center-minimal .title {

    font-size: 26px;

  }

}



.banner-with-bg-image-swiper .navigation-area {

  transition: 0.3s;

  opacity: 0;

}

.banner-with-bg-image-swiper .navigation-area .swiper-btn {

  width: 60px;

  height: 60px;

  line-height: 65px;

  border-radius: 50%;

  top: 56%;

  text-align: center;

  color: var(--color-white);

  font-size: 20px;

  border: 1px solid rgba(255, 255, 255, 0.3019607843);

  background: rgba(255, 255, 255, 0.1098039216);

  transition: var(--transition);

  backdrop-filter: blur(7px);

}

.banner-with-bg-image-swiper .navigation-area .swiper-btn:hover {

  background: var(--color-primary-2);

  border: 1px solid var(--color-primary-2);

  transform: scale(1.2);

}

.banner-with-bg-image-swiper .navigation-area .swiper-btn::after {

  display: none;

}

.banner-with-bg-image-swiper .navigation-area .swiper-btn.swiper-button-prev {

  left: 4%;

}

.banner-with-bg-image-swiper .navigation-area .swiper-btn.swiper-button-next {

  right: 4%;

}

.banner-with-bg-image-swiper:hover .navigation-area {

  opacity: 1;

}



.banner-two-margin-wrap {

  position: relative;

  z-index: 1;

  margin: 15px 15px 0 15px;

  border-radius: 16px;

  overflow: hidden;

}

@media only screen and (max-width: 576px) {

  .banner-two-margin-wrap {

    margin: 80px 15px 0 15px;

  }

}



.banner-left-image-right-content {

  padding: 160px 60px 60px 50px;

}

@media only screen and (max-width: 1199px) {

  .banner-left-image-right-content {

    padding: 120px 30px 30px 30px;

  }

}

@media only screen and (max-width: 991px) {

  .banner-left-image-right-content {

    padding: 80px 30px 60px 30px;

  }

}



.button-wrapper-flex {

  display: flex;

  align-items: center;

  gap: 20px;

}

@media only screen and (max-width: 576px) {

  .button-wrapper-flex {

    flex-wrap: wrap;

    gap: 15px;

  }

}



.banner-left-iamge-area {

  position: relative;

  z-index: 1;

  margin: 15px 15px 0 15px;

  border-radius: 16px;

}

.banner-left-iamge-area .thumbnail-banner-image {

  border-radius: 16px;

  display: block;

  overflow: hidden;

}

.banner-left-iamge-area .banner-left-image-right-content {

  background: var(--primary-50);

  height: 100%;

  border-radius: 16px;

  display: flex;

  align-items: center;

}

.banner-left-iamge-area .banner-left-image-right-content .inner {

  max-width: 95%;

}

.banner-left-iamge-area .banner-left-image-right-content .inner .pre-title {

  font-weight: 500;

  font-size: 18px;

  color: var(--color-heading-1);

  position: relative;

  padding-left: 25px;

}

.banner-left-iamge-area .banner-left-image-right-content .inner .pre-title::after {

  content: "";

  position: absolute;

  left: 4px;

  height: 10px;

  width: 10px;

  border-radius: 2px;

  top: 50%;

  transform: translateY(-50%);

  background: var(--color-primary);

}

.banner-left-iamge-area .banner-left-image-right-content .title {

  font-size: 74px;

  font-weight: 700;

  margin-bottom: 40px;

  margin-top: 10px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .banner-left-iamge-area .banner-left-image-right-content .title {

    font-size: 60px;

    line-height: 1.4;

  }

}

@media only screen and (max-width: 1499px) {

  .banner-left-iamge-area .banner-left-image-right-content .title {

    font-size: 52px;

    line-height: 1.4;

  }

}

@media only screen and (max-width: 1399px) {

  .banner-left-iamge-area .banner-left-image-right-content .title {

    font-size: 32px;

    line-height: 1.4;

    margin-bottom: 20px;

  }

}

@media only screen and (max-width: 576px) {

  .banner-left-iamge-area .banner-left-image-right-content .title {

    font-size: 28px;

  }

}

.banner-left-iamge-area .banner-left-image-right-content .title span {

  color: var(--color-primary);

}

.banner-left-iamge-area .banner-left-image-right-content p.desc {

  max-width: 85%;

  font-weight: 500;

  line-height: 1.6;

}

@media only screen and (max-width: 1399px) {

  .banner-left-iamge-area .banner-left-image-right-content p.desc {

    max-width: 100%;

  }

}



.call-btn {

  display: flex;

  align-items: center;

}

.call-btn i {

  font-weight: 500;

  font-size: 26px;

  color: var(--color-heading-1);

}

.call-btn span {

  font-size: 22px;

  margin-left: 10px;

  color: var(--color-primary);

}



.banner-paralax-slider {

  overflow: hidden;

  position: relative;

  z-index: 1;

  margin: 15px 15px 0 15px;

  border-radius: 16px;

}

@media only screen and (max-width: 576px) {

  .banner-paralax-slider {

    margin: 0;

    border-radius: 0;

  }

}

.banner-paralax-slider .banner-wrap {

  padding: 250px 80px 230px 80px;

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 767px) {

  .banner-paralax-slider .banner-wrap {

    padding: 162px 30px 230px 30px;

  }

}

@media only screen and (max-width: 576px) {

  .banner-paralax-slider .banner-wrap {

    padding: 115px 30px 192px 30px;

  }

}

.banner-paralax-slider .banner-wrap::after {

  position: absolute;

  content: "";

  left: 0;

  top: 0;

  height: 100%;

  width: 100%;

  background: rgb(26, 116, 123);

  z-index: -1;

  mix-blend-mode: multiply;

}

.banner-paralax-slider .banner-wrap .banner-image {

  position: absolute;

  z-index: -1;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

}

.banner-paralax-slider .banner-wrap .banner-image .banner-slider-paralax {

  height: 100%;

}

.banner-paralax-slider .banner-wrap .banner-image .parallax-bg {

  overflow: hidden;

  height: 100%;

}

.banner-paralax-slider .banner-wrap .banner-image img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}

.banner-paralax-slider .banner-content {

  max-width: 850px;

}

.banner-paralax-slider .banner-content .title {

  color: var(--color-white);

}

@media only screen and (max-width: 576px) {

  .banner-paralax-slider .banner-content .title {

    line-height: 1.4;

  }

}

.banner-paralax-slider .banner-content .text {

  color: var(--color-white);

  font-size: 18px;

  line-height: 36px;

  margin-top: 20px;

  max-width: 630px;

}

.banner-paralax-slider .banner-content .button-wrapper-flex .call-btn i {

  color: var(--color-white);

}

.banner-paralax-slider .banner-content .button-wrapper-flex .call-btn span {

  color: var(--color-white);

}

.banner-paralax-slider .banner-dot {

  display: flex;

  align-items: center;

  gap: 5px;

  position: absolute;

  left: unset !important;

  bottom: 80px !important;

  right: 80px !important;

  max-width: 425px;

}

@media only screen and (max-width: 767px) {

  .banner-paralax-slider .banner-dot {

    bottom: 30px !important;

    right: 30px !important;

    max-width: max-content;

  }

}

@media only screen and (max-width: 576px) {

  .banner-paralax-slider .banner-dot {

    right: 5px !important;

    gap: 0;

  }

}

.banner-paralax-slider .banner-dot .swiper-pagination-bullet {

  width: 130px;

  height: 130px;

  background-color: rgba(255, 255, 255, 0.067);

  backdrop-filter: blur(10px);

  padding: 10px 15px;

  cursor: pointer;

  overflow: hidden;

  border-radius: 0;

  transition: var(--transition);

  opacity: 1;

  border-radius: 6px;

}

@media only screen and (max-width: 576px) {

  .banner-paralax-slider .banner-dot .swiper-pagination-bullet {

    width: 110px;

    height: 110px;

  }

}

@media only screen and (max-width: 479px) {

  .banner-paralax-slider .banner-dot .swiper-pagination-bullet {

    width: 104px;

    padding: 7px 5px;

  }

}

.banner-paralax-slider .banner-dot .swiper-pagination-bullet .dot-content {

  display: flex;

  flex-direction: column;

  justify-content: space-between;

  height: 100%;

}

.banner-paralax-slider .banner-dot .swiper-pagination-bullet .dot-content span:first-child {

  text-align: right;

}

.banner-paralax-slider .banner-dot .swiper-pagination-bullet .dot-content span {

  font-size: 18px;

  font-weight: 600;

  color: var(--color-white);

}

@media only screen and (max-width: 479px) {

  .banner-paralax-slider .banner-dot .swiper-pagination-bullet .dot-content span {

    font-size: 16px;

    line-height: 1.4;

  }

}

.banner-paralax-slider .banner-dot .swiper-pagination-bullet-active {

  background-color: rgba(255, 255, 255, 0.4);

  backdrop-filter: blur(30px);

}



.banner-eleven-area-start {

  background-image: url(../images/banner/shape/01.svg);

  height: 950px;

}

@media only screen and (max-width: 576px) {

  .banner-eleven-area-start {

    height: auto;

  }

}



.banner-inner-content-marketing-agency {

  padding: 110px 0;

}

@media only screen and (max-width: 991px) {

  .banner-inner-content-marketing-agency {

    padding: 80px 0 150px 0;

  }

}

@media only screen and (max-width: 576px) {

  .banner-inner-content-marketing-agency {

    padding: 80px 0 80px 0;

  }

}

.banner-inner-content-marketing-agency .title {

  font-size: 120px;

  line-height: 1.3;

  font-weight: 700;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .banner-inner-content-marketing-agency .title {

    font-size: 90px;

  }

}

@media only screen and (max-width: 1199px) {

  .banner-inner-content-marketing-agency .title {

    font-size: 80px;

  }

}

@media only screen and (max-width: 991px) {

  .banner-inner-content-marketing-agency .title {

    font-size: 60px;

  }

}

@media only screen and (max-width: 576px) {

  .banner-inner-content-marketing-agency .title {

    font-size: 44px;

  }

}

@media only screen and (max-width: 479px) {

  .banner-inner-content-marketing-agency .title {

    font-size: 30px;

  }

}

.banner-inner-content-marketing-agency .banner-bottom-wrapper {

  display: flex;

  align-items: center;

  gap: 50px;

}

@media only screen and (max-width: 991px) {

  .banner-inner-content-marketing-agency .banner-bottom-wrapper {

    flex-wrap: wrap;

    gap: 25px;

  }

}

.banner-inner-content-marketing-agency .banner-bottom-wrapper .left-circle-area {

  position: relative;

}

.banner-inner-content-marketing-agency .banner-bottom-wrapper .left-circle-area .thumbnail {

  animation: rotateIt 8s linear infinite;

}

@media only screen and (max-width: 576px) {

  .banner-inner-content-marketing-agency .banner-bottom-wrapper .left-circle-area .thumbnail {

    max-width: 180px;

  }

}

.banner-inner-content-marketing-agency .banner-bottom-wrapper .left-circle-area .play {

  position: absolute;

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%);

}

.banner-inner-content-marketing-agency .banner-bottom-wrapper .right-content-area {

  max-width: 594px;

}

.banner-inner-content-marketing-agency .banner-bottom-wrapper .right-content-area p.desc {

  font-size: 20px;

  line-height: 1.5;

}

.banner-inner-content-marketing-agency .banner-bottom-wrapper .right-content-area .button-and-rating {

  margin-top: 20px;

  display: flex;

  align-items: center;

  gap: 20px;

}

@media only screen and (max-width: 576px) {

  .banner-inner-content-marketing-agency .banner-bottom-wrapper .right-content-area .button-and-rating {

    flex-wrap: wrap;

  }

}

.banner-inner-content-marketing-agency .banner-bottom-wrapper .right-content-area .button-and-rating .author-rating-area {

  margin-top: 0;

}

.banner-inner-content-marketing-agency .banner-bottom-wrapper .right-content-area .button-and-rating .author-rating-area .star-rating p {

  margin-bottom: 0;

  color: var(--color-heading-1);

  font-weight: 700;

}



.marketing-company-video-area {

  margin-top: -200px;

}

@media only screen and (max-width: 767px) {

  .marketing-company-video-area {

    margin-top: 0;

  }

}



.container-1518 {

  max-width: 1518px;

  margin: auto;

}



.large-video-thumbnail-marketing {

  height: 626px;

  width: 100%;

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 991px) {

  .large-video-thumbnail-marketing {

    height: 100%;

  }

}

@media only screen and (max-width: 576px) {

  .large-video-thumbnail-marketing {

    height: auto;

  }

}

.large-video-thumbnail-marketing .video-thumbnail {

  border-radius: 10px;

  display: block;

  overflow: hidden;

  height: 100%;

  width: 100%;

  min-height: 626px;

}

@media only screen and (max-width: 991px) {

  .large-video-thumbnail-marketing .video-thumbnail {

    min-height: 100%;

  }

}

.large-video-thumbnail-marketing .video-thumbnail video {

  width: 100%;

}

.large-video-thumbnail-marketing .fun-facts-marketing {

  padding: 33px 40px;

  border-radius: 10px;

  background: rgba(255, 255, 255, 0.0784313725);

  display: flex;

  align-items: center;

  gap: 10px;

  max-width: max-content;

  position: absolute;

  top: -130px;

  right: 99px;

  max-width: 516px;

  backdrop-filter: blur(20px);

  border: 2px solid rgba(255, 255, 255, 0.3215686275);

  box-shadow: 0px 1px 8px 4px rgba(0, 0, 0, 0.0784313725), 3px 3px 12px -6px rgba(0, 0, 0, 0);

}

@media only screen and (max-width: 991px) {

  .large-video-thumbnail-marketing .fun-facts-marketing {

    top: -55px;

    right: 35px;

  }

}

@media only screen and (max-width: 767px) {

  .large-video-thumbnail-marketing .fun-facts-marketing {

    top: -109px;

    right: 35px;

  }

}

@media only screen and (max-width: 576px) {

  .large-video-thumbnail-marketing .fun-facts-marketing {

    top: 0;

    right: 0;

    position: relative;

    width: 100%;

    margin: auto;

    margin-top: 20px;

  }

}

@media only screen and (max-width: 479px) {

  .large-video-thumbnail-marketing .fun-facts-marketing {

    flex-wrap: wrap;

    padding: 25px;

  }

}

.large-video-thumbnail-marketing .fun-facts-marketing .single {

  max-width: 50%;

}

@media only screen and (max-width: 479px) {

  .large-video-thumbnail-marketing .fun-facts-marketing .single {

    max-width: 100%;

  }

}

.large-video-thumbnail-marketing .fun-facts-marketing .single .number {

  font-size: 48px;

  margin-bottom: 10px;

  color: var(--color-primary);

  font-weight: 800;

}

.large-video-thumbnail-marketing .fun-facts-marketing .single .number span {

  color: var(--color-primary);

  font-weight: 800;

}

.large-video-thumbnail-marketing .fun-facts-marketing .single .title {

  font-size: 18px;

  margin-bottom: 10px;

  color: var(--color-heading-1);

}

.large-video-thumbnail-marketing .fun-facts-marketing .single p.desc {

  color: var(--color-heading-1);

  font-size: 14px;

}



.banner-twelve-area {

  background-image: url(../images/bg/banner-12-bg.webp);

  border-radius: 15px;

  margin: 15px 15px 0 15px;

  background-attachment: fixed;

}



.banner-twelve-content {

  padding-top: 120px;

}

@media only screen and (max-width: 1199px) {

  .banner-twelve-content {

    padding-top: 80px;

  }

}

.banner-twelve-content .title {

  color: var(--color-white);

  font-size: 120px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .banner-twelve-content .title {

    font-size: 90px;

  }

}

@media only screen and (max-width: 1199px) {

  .banner-twelve-content .title {

    font-size: 75px;

  }

}

@media only screen and (max-width: 991px) {

  .banner-twelve-content .title {

    font-size: 50px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-twelve-content .title {

    line-height: 1.3;

    font-size: 44px;

  }

}

.banner-twelve-content .banner-bottom-wrapper {

  display: flex;

  align-items: flex-start;

  gap: 50px;

  margin-top: 60px;

}

@media only screen and (max-width: 767px) {

  .banner-twelve-content .banner-bottom-wrapper {

    flex-wrap: wrap;

    gap: 25px;

  }

}

.banner-twelve-content .banner-bottom-wrapper .left-circle-area {

  position: relative;

}

.banner-twelve-content .banner-bottom-wrapper .left-circle-area .thumbnail {

  animation: rotateIt 8s linear infinite;

}

.banner-twelve-content .banner-bottom-wrapper .left-circle-area .play {

  position: absolute;

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%);

}

.banner-twelve-content .banner-bottom-wrapper .button-and-rating {

  margin-top: 20px;

  display: flex;

  align-items: center;

  gap: 20px;

}

@media only screen and (max-width: 991px) {

  .banner-twelve-content .banner-bottom-wrapper .button-and-rating {

    flex-wrap: wrap;

  }

}

.banner-twelve-content .banner-bottom-wrapper .button-and-rating .author-rating-area {

  margin-top: 0;

}

.banner-twelve-content .banner-bottom-wrapper .button-and-rating .author-rating-area .star-rating p.text {

  font-weight: 500;

  color: var(--color-white);

}

.banner-twelve-content .banner-bottom-wrapper .button-and-rating .tmp-btn.btn-primary {

  background: var(--color-white);

  color: var(--color-heading-1);

  border-radius: 6px;

}

.banner-twelve-content .banner-bottom-wrapper .button-and-rating .tmp-btn.btn-primary:hover {

  color: var(--color-white);

}

.banner-twelve-content .banner-bottom-wrapper .right-content-area .title {

  color: transparent;

  -webkit-text-stroke: 1px var(--color-white);

}

.banner-twelve-content .banner-bottom-wrapper .right-content-area .between-area {

  display: flex;

  align-items: center;

}

@media only screen and (max-width: 576px) {

  .banner-twelve-content .banner-bottom-wrapper .right-content-area .between-area {

    flex-wrap: wrap;

    gap: 25px;

  }

}

.banner-twelve-content .banner-bottom-wrapper .right-content-area .between-area .left-area {

  max-width: 516px;

}

.banner-twelve-content .banner-bottom-wrapper .right-content-area .between-area .left-area p.desc {

  font-size: 18px;

  line-height: 1.5;

  color: var(--color-white);

  font-weight: 400;

}

.banner-twelve-content .banner-bottom-wrapper .right-content-area .between-area .right-area {

  padding: 30px 60px;

  background: rgba(242, 242, 255, 0.1215686275);

  backdrop-filter: blur(5px);

  border: 1px solid rgba(255, 255, 255, 0.1137254902);

  border-radius: 6px;

  text-align: center;

}

.banner-twelve-content .banner-bottom-wrapper .right-content-area .between-area .right-area .number {

  font-size: 68px;

  margin-bottom: 0;

  color: var(--color-white);

}

@media only screen and (max-width: 1199px) {

  .banner-twelve-content .banner-bottom-wrapper .right-content-area .between-area .right-area .number {

    font-size: 40px;

  }

}

.banner-twelve-content .banner-bottom-wrapper .right-content-area .between-area .right-area p {

  margin-bottom: 0;

  font-size: 16px;

  color: var(--color-white);

}

.banner-twelve-content .social-style-box {

  margin-top: 60px;

}



.social-style-box span {

  color: var(--color-white);

  font-weight: 500;

  font-size: 18px;

  margin-bottom: 20px;

  display: block;

}

.social-style-box ul {

  padding: 0;

  margin: 0;

  display: flex;

  align-items: center;

  gap: 10px;

}

.social-style-box ul li {

  margin: 0;

}

.social-style-box ul li a {

  height: 45px;

  width: 45px;

  display: flex;

  align-items: center;

  justify-content: center;

  background: rgba(255, 255, 255, 0.05);

  border-radius: 10px;

  transition: 0.4s;

}

.social-style-box ul li a i {

  font-size: 16px;

  color: var(--color-white);

  transition: 0.4s;

}

.social-style-box ul li a:hover {

  background: var(--color-heading-1);

}

.social-style-box ul li a:hover i {

  color: var(--color-white);

}



.banner-thirteen-area {

  background-image: url(../images/bg/04.webp);

  border-radius: 15px;

  margin: 15px 15px 0 15px;

}



.container-1700 {

  max-width: 1700px;

  margin: auto;

}



.banner-thirteen-area .banner-left-iamge-area {

  height: 100%;

  border-radius: 16px;

}

@media only screen and (max-width: 576px) {

  .banner-thirteen-area .banner-left-iamge-area {

    margin: 0;

  }

}

.banner-thirteen-area .banner-left-iamge-area .banner-left-image-right-content {

  padding: 60px 60px 60px 50px;

  background: rgba(0, 0, 0, 0.3098039216);

  backdrop-filter: blur(5px);

}

@media only screen and (max-width: 576px) {

  .banner-thirteen-area .banner-left-iamge-area .banner-left-image-right-content {

    padding: 25px;

  }

}

.banner-thirteen-area .banner-left-iamge-area .banner-left-image-right-content .inner .pre-title {

  color: var(--color-white);

  padding-left: 30px;

}

.banner-thirteen-area .banner-left-iamge-area .banner-left-image-right-content .inner .pre-title::after {

  height: 15px;

  width: 15px;

}

.banner-thirteen-area .banner-left-iamge-area .banner-left-image-right-content .inner .title {

  color: var(--color-white);

  margin-bottom: 25px;

  line-height: 1.2;

}

.banner-thirteen-area .banner-left-iamge-area .banner-left-image-right-content .inner p.desc {

  color: var(--color-white);

  line-height: 1.8;

}

.banner-thirteen-area .banner-left-iamge-area .banner-left-image-right-content .inner .button-wrapper-flex .call-btn i {

  color: var(--color-white);

}



.light-border {

  position: relative;

}

.light-border::before {

  content: "";

  position: absolute;

  inset: 0;

  padding: 1px;

  border-radius: inherit;

  pointer-events: none;

  background: linear-gradient(102deg, rgba(255, 255, 255, 0) 30%, rgb(255, 255, 255) 42%, rgba(255, 255, 255, 0) 55%);

  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);

  -webkit-mask-composite: xor;

  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);

  mask-composite: exclude;

}



.thumbnail-image-video-banner-13 {

  max-width: max-content;

  height: 100%;

  object-fit: cover;

  display: block;

  overflow: hidden;

  border-radius: 15px;

}

.thumbnail-image-video-banner-13 .video-thumbnail {

  max-width: max-content;

  height: 100%;

  object-fit: cover;

}

.thumbnail-image-video-banner-13 .video-thumbnail video {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.tmp-brand-area .section-inner .brand-wrapper {

  transition: var(--transition);

}

.tmp-brand-area .section-inner .brand-wrapper:hover img {

  opacity: 1;

}

.tmp-brand-area .section-inner .brand-wrapper img {

  opacity: 1;

  transition: var(--transition);

  max-width: 146px;

  max-height: 37px;

}

@media only screen and (max-width: 767px) {

  .tmp-brand-area .section-inner .brand-wrapper img {

    max-width: 115px;

  }

}

.tmp-brand-area .section-inner .brand-wrapper .image-area a {

  display: flex;

  align-items: center;

  justify-content: center;

}

.tmp-brand-area.area-3 {

  padding: 70px 0 65px;

}

@media only screen and (max-width: 991px) {

  .tmp-brand-area.area-3 {

    padding: 40px 0 40px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-brand-area.area-3 {

    padding: 30px 0 30px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-brand-area.area-3 {

    padding: 30px 0 30px;

  }

}

.tmp-brand-area.area-3 img {

  opacity: 1 !important;

  filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(45deg) brightness(108%) contrast(102%);

}

.tmp-brand-area.area-5 {

  background: var(--primary-50);

}



.tmpBrandSlider .swiper-wrapper {

  display: flex;

  align-items: center;

}

.tmpBrandSlider .swiper-wrapper .brand-wrapper .image-area a:hover img {

  animation: bounceIn 0.8s ease;

}

.tmpBrandSlider.style-box {

  margin: -12px;

  padding: 12px;

}

.tmpBrandSlider.style-box .swiper-slide {

  height: 100%;

}

.tmpBrandSlider.style-box .brand-wrapper {

  height: 100%;

}

.tmpBrandSlider.style-box .brand-wrapper .image-area {

  height: 100%;

}

.tmpBrandSlider.style-box .brand-wrapper .image-area a {

  height: 80px;

  padding: 15px 20px;

  background: var(--color-white);

  box-shadow: 0px 4px 13px rgba(215, 216, 222, 0.41);

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 4px;

}

.tmpBrandSlider.style-box .brand-wrapper .image-area a img {

  max-width: 120px;

}



@keyframes bounceIn {

  0%, 20%, 40%, 60%, 80%, 100% {

    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

  }

  0% {

    opacity: 0;

    -webkit-transform: scale3d(0.3, 0.3, 0.3);

    transform: scale3d(0.3, 0.3, 0.3);

  }

  20% {

    -webkit-transform: scale3d(1.1, 1.1, 1.1);

    transform: scale3d(1.1, 1.1, 1.1);

  }

  40% {

    -webkit-transform: scale3d(0.9, 0.9, 0.9);

    transform: scale3d(0.9, 0.9, 0.9);

  }

  60% {

    opacity: 1;

    -webkit-transform: scale3d(1.03, 1.03, 1.03);

    transform: scale3d(1.03, 1.03, 1.03);

  }

  80% {

    -webkit-transform: scale3d(0.97, 0.97, 0.97);

    transform: scale3d(0.97, 0.97, 0.97);

  }

  100% {

    opacity: 1;

    -webkit-transform: scale3d(1, 1, 1);

    transform: scale3d(1, 1, 1);

  }

}

.tmpBrandSlider.small-brand .swiper-navigation .swiper-btn {

  transform: translateY(-50%) scale(1);

  height: 35px;

  width: 35px;

  top: 109%;

  line-height: 38px;

}

.tmpBrandSlider .swiper-navigation .swiper-btn {

  transform: translateY(-50%) scale(1);

  font-size: 18px;

  background: #FFFFFF;

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

  width: 40px;

  height: 40px;

  line-height: 44px;

  display: block;

  text-align: center;

  border-radius: 50%;

  transition: 0.3s;

  top: 73%;

  color: var(--color-heading-1);

}

.tmpBrandSlider .swiper-navigation .swiper-btn i {

  color: var(--color-primary);

}

.tmpBrandSlider .swiper-navigation .swiper-btn::after {

  display: none;

}

.tmpBrandSlider .swiper-navigation .swiper-btn.swiper-button-prev {

  left: 60px;

  opacity: 0;

}

@media only screen and (max-width: 1199px) {

  .tmpBrandSlider .swiper-navigation .swiper-btn.swiper-button-prev {

    left: 30px;

  }

}

.tmpBrandSlider .swiper-navigation .swiper-btn.swiper-button-next {

  right: 60px;

  opacity: 0;

}

@media only screen and (max-width: 1199px) {

  .tmpBrandSlider .swiper-navigation .swiper-btn.swiper-button-next {

    right: 30px;

  }

}

.tmpBrandSlider .swiper-navigation .swiper-btn:hover {

  background: var(--color-primary);

  transform: translateY(-50%) scale(1.05);

}

.tmpBrandSlider .swiper-navigation .swiper-btn:hover i {

  color: #fff;

}

.tmpBrandSlider:hover .swiper-navigation .swiper-button-prev {

  left: 30px;

  opacity: 1;

}

@media only screen and (max-width: 1199px) {

  .tmpBrandSlider:hover .swiper-navigation .swiper-button-prev {

    left: 30px;

  }

}

.tmpBrandSlider:hover .swiper-navigation .swiper-button-next {

  right: 30px;

  opacity: 1;

}

@media only screen and (max-width: 1199px) {

  .tmpBrandSlider:hover .swiper-navigation .swiper-button-next {

    right: 30px;

  }

}



.clients-wrapper {

  position: relative;

  z-index: 1;

  display: flex;

  box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.07);

  border-radius: 6px;

  overflow: hidden;

  transition: var(--transition);

}

.clients-wrapper:hover .text {

  background: var(--color-primary);

}

.clients-wrapper:hover .text h6,

.clients-wrapper:hover .text h3 {

  color: var(--color-white);

  font-size: 16px;

}

.clients-wrapper:hover .image .content {

  top: 0;

}

.clients-wrapper .text {

  writing-mode: sideways-lr;

  text-align: center;

  background: var(--color-white);

  padding: 0 10px;

  transition: var(--transition);

}

.clients-wrapper .text h6,

.clients-wrapper .text h3 {

  margin-bottom: 0;

  font-size: 16px;

  line-height: 1;

  transition: 0.3s;

}

.clients-wrapper .image {

  position: relative;

  z-index: 1;

}

.clients-wrapper .image .brand {

  position: absolute;

  z-index: 2;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

}

.clients-wrapper .image::after {

  content: "";

  position: absolute;

  z-index: 1;

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  background: rgba(0, 0, 0, 0.31);

}

.clients-wrapper .image .content {

  background: var(--color-white);

  height: 100%;

  display: flex;

  align-items: start;

  justify-content: center;

  flex-direction: column;

  padding: 0 35px;

  position: absolute;

  z-index: 3;

  top: -102%;

  left: 0;

  transition: var(--transition);

}

.clients-wrapper .image .content ul {

  display: flex;

  align-items: center;

  gap: 5px;

  margin-bottom: 10px;

}

.clients-wrapper .image .content ul li {

  margin: 0;

  color: #FF9500;

}

.clients-wrapper .image .content .desc {

  font-size: 18px;

  line-height: 1.4;

}

@media only screen and (max-width: 576px) {

  .clients-wrapper .image .content .desc {

    font-size: 16px;

    line-height: 1.4;

  }

}



.title-border-center-sm {

  text-align: center;

  padding: 5px 15px;

  border-radius: 33px;

  border: 1px dashed #c9d1d1;

  max-width: max-content;

  margin: auto;

}

.title-border-center-sm .title {

  margin-bottom: 0;

  font-size: 16px;

}

@media only screen and (max-width: 479px) {

  .title-border-center-sm .title {

    font-size: 14px;

    line-height: 1.5;

  }

}

.title-border-center-sm .title .counter {

  color: var(--color-primary);

}

.title-border-center-sm .title .color-light {

  color: #b1b1b1;

}



.brand-area-wrapper-modern {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 30px;

  flex-wrap: wrap;

}

@media only screen and (max-width: 576px) {

  .brand-area-wrapper-modern {

    gap: 10px;

  }

}

.brand-area-wrapper-modern > div {

  flex-basis: calc(20% - 24px);

}



.single-brand-modern {

  height: 120px;

  background: #fff;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 6px;

  box-shadow: var(--shadow-1);

  padding: 20px;

}

@media only screen and (max-width: 991px) {

  .single-brand-modern {

    height: 85px;

  }

}

@media only screen and (max-width: 576px) {

  .single-brand-modern {

    height: 80px;

  }

}

.single-brand-modern img {

  max-width: 140px;

}

@media only screen and (max-width: 576px) {

  .single-brand-modern img {

    max-width: 100px;

  }

}

.single-brand-modern:hover img {

  animation: bounceIn 1.2s ease;

}



.marquee-brand-swiper-area {

  overflow: hidden;

  border-bottom: 1px solid var(--border);

}

.marquee-brand-swiper-area .swiper-wrapper {

  -webkit-transition-timing-function: linear;

  transition-timing-function: linear;

  padding: 20px 0;

}

.marquee-brand-swiper-area .brand-marque-item {

  text-align: center;

  padding: 31px 0;

  background: var(--color-white);

  box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.06);

  height: 150px;

  margin: 0 15px;

  border-radius: 6px;

  display: block;

}

@media only screen and (max-width: 767px) {

  .marquee-brand-swiper-area .brand-marque-item {

    margin: 0 5px;

  }

}

@media only screen and (max-width: 576px) {

  .marquee-brand-swiper-area .brand-marque-item {

    height: 130px;

    padding: 16px 0;

  }

}



.brand-color.marquee-brand-swiper-area .brand-marque-item {

  display: flex;

  align-items: center;

  justify-content: center;

}

.brand-color.marquee-brand-swiper-area .brand-marque-item img {

  max-width: 150px;

}

@media only screen and (max-width: 576px) {

  .brand-color.marquee-brand-swiper-area .brand-marque-item img {

    max-width: 110px;

  }

}

@media only screen and (max-width: 767px) {

  .brand-color .marquee-brand-swiper-area .brand-marque-item {

    margin: 0 5px;

  }

}

@media only screen and (max-width: 576px) {

  .brand-color .marquee-brand-swiper-area .brand-marque-item {

    height: 90px;

  }

}



.social-wrapper-one ul {

  list-style: none;

  display: flex;

  align-items: center;

  padding-left: 0;

  margin: 0;

}

.social-wrapper-one li {

  margin-right: 10px;

  margin-top: 0;

  margin-bottom: 0;

}

.social-wrapper-one li a {

  width: 40px;

  height: 40px;

  display: block;

  background: #171717;

  border: 1px solid #222222;

  display: flex;

  align-items: center;

  justify-content: center;

  transition: 0.3s;

}

.social-wrapper-one li a i {

  font-weight: 400;

  font-size: 14px;

  line-height: 14px;

  color: #FFFFFF;

}



.tmp-social-wrapper-three ul {

  padding: 0;

  display: flex;

  align-items: center;

  gap: 10px;

  list-style: none;

  margin-top: 34px;

}

.tmp-social-wrapper-three ul li {

  margin: 0;

  padding: 0;

}

.tmp-social-wrapper-three ul li a i {

  height: 40px;

  width: 40px;

  border-radius: 50%;

  display: block;

  background: #22282C;

  color: #fff;

  display: flex;

  align-items: center;

  font-weight: 400;

  font-size: 14px;

  line-height: 14px;

  justify-content: center;

  transition: 0.3s;

}

.tmp-social-wrapper-three ul li a:hover i {

  background: var(--color-primary);

}



.social-share-wrapper-1 .short-title {

  display: block;

  font-size: 12px;

  padding-bottom: 14px;

  font-weight: 600;

  text-transform: uppercase;

  letter-spacing: 0.5px;

  margin-bottom: 6px;

  border-bottom: 1px dashed var(--color-border);

}

.social-share-wrapper-1 .social-stylle-one {

  display: flex;

  flex-wrap: wrap;

  padding: 0;

  margin: 0;

  list-style: none;

  justify-content: center;

  margin: -5px;

}

.social-share-wrapper-1 .social-stylle-one li {

  margin: 5px;

}

.social-share-wrapper-1 .social-stylle-one li a {

  width: 48px;

  background-color: transparent;

  height: 48px;

  line-height: 45px;

  text-align: center;

  display: inline-block;

  border-radius: 100%;

  transition: 0.3s;

  color: var(--color-body);

  z-index: 2;

  position: relative;

  line-height: 41px;

  background: transparent;

  border: 2px solid var(--color-border);

}

.social-share-wrapper-1 .social-stylle-one li a i {

  vertical-align: middle;

}

.social-share-wrapper-1 .social-stylle-one li a::after {

  position: absolute;

  content: "";

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  z-index: -1;

  background: var(--color-primary);

  transform: scale(0.5);

  opacity: 0;

  transition: 0.3s;

  border-radius: 100%;

  border: 2px solid var(--color-primary);

}

.social-share-wrapper-1 .social-stylle-one li a:hover {

  border-color: transparent !important;

}

.social-share-wrapper-1 .social-stylle-one li a:hover i {

  color: #fff;

}

.social-share-wrapper-1 .social-stylle-one li a:hover::after {

  transform: scale(1);

  opacity: 1;

}

.social-share-wrapper-1.style-footer .social-stylle-one li {

  margin: 3px;

}

.social-share-wrapper-1.style-footer .social-stylle-one li a {

  width: 38px;

  height: 38px;

  line-height: 38px;

  border: transparent;

  background: rgba(255, 255, 255, 0.0392156863);

  display: flex;

  align-items: center;

  justify-content: center;

}

.social-share-wrapper-1.style-footer .social-stylle-one li a i {

  color: var(--color-white);

}



.tmp-project-area .section-title-area {

  margin-bottom: 60px;

}

.tmp-project-area .section-title-area .pre-title,

.tmp-project-area .section-title-area .section-title {

  margin-left: auto;

  margin-right: auto;

  text-align: center;

}

.tmp-project-area.two .section-inner {

  padding: 0 55px;

}

@media only screen and (max-width: 1199px) {

  .tmp-project-area.two .section-inner {

    padding: 0 20px;

  }

}

.tmp-project-area.three {

  position: relative;

  z-index: 1;

}

.tmp-project-area.three .right .bottom-content {

  padding-left: 30px;

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 576px) {

  .tmp-project-area.three .right .bottom-content {

    padding-left: 0;

  }

}

.tmp-project-area.three .right .bottom-content .shape {

  position: absolute;

  left: 0;

  top: 0;

  z-index: -1;

}

@media only screen and (max-width: 576px) {

  .tmp-project-area.three .right .bottom-content .shape {

    display: none;

  }

}

.tmp-project-area.three .right .bottom-content .desc {

  margin-bottom: 22px;

}

.tmp-project-area.three .shape-area img {

  position: absolute;

  z-index: 1;

  z-index: -1;

}

.tmp-project-area.three .shape-area img:nth-child(1) {

  left: 0;

  top: 0;

}

.tmp-project-area.three .shape-area img:nth-child(2) {

  right: 0;

  bottom: 0;

}



.title-project-sticky {

  font-size: 30px;

  line-height: 1.2;

}



.project-wrapper {

  position: relative;

  z-index: 1;

  transition: all 0.4s;

  overflow: hidden;

  border-radius: 4px;

}

.project-wrapper:hover .image-area a img {

  transform: scale(1.05);

}

.project-wrapper:hover .content-area {

  left: 0;

}

.project-wrapper .image-area a {

  display: block;

  transition: var(--transition);

}

.project-wrapper .image-area a img {

  transition: var(--transition);

  transform: scale(1);

}

.project-wrapper .content-area {

  position: absolute;

  z-index: 1;

  bottom: 15px;

  left: -100%;

  background: var(--color-white);

  max-width: 370px;

  padding: 0 80px 30px 30px;

  transition: all 0.4s;

  border-radius: 0 4px 4px 0;

}

.project-wrapper .content-area .tag {

  background: var(--secondary-100);

  line-height: 1;

  padding: 9px 20px;

  color: var(--color-primary);

  max-width: max-content;

  border-radius: 0 0 5px 5px;

  font-family: var(--font-primary);

  font-weight: 500;

  margin-bottom: 15px;

}

.project-wrapper .content-area .title {

  font-size: 22px;

  font-weight: 600;

  line-height: 30px;

  margin-bottom: 10px;

}

.project-wrapper .content-area .title a {

  color: var(--color-black);

}

.project-wrapper .content-area .title:hover a {

  color: var(--color-primary);

}

.project-wrapper.inner .content-area .tag {

  background: var(--color-primary-2);

  border-radius: 0 0 10px 10px;

}



.project-single {

  border-radius: 6px;

  overflow: hidden;

  position: relative;

  z-index: 1;

  transition: var(--transition);

}

.project-single:hover .over-link {

  bottom: 0;

}

.project-single:hover .content {

  bottom: 30px;

  opacity: 1;

}

@media only screen and (max-width: 991px) {

  .project-single:hover .content {

    bottom: 20px;

  }

}

.project-single:hover .tmp-icon-overlay-link-btn {

  opacity: 1;

}

.project-single .over-link {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  bottom: -100%;

  left: 0;

  z-index: 1;

  background: linear-gradient(180deg, rgba(255, 112, 41, 0.1722) 0%, rgba(255, 112, 41, 0.82) 100%);

  transition: var(--transition);

}

.project-single .content {

  position: absolute;

  bottom: 0px;

  left: 30px;

  z-index: 2;

  transition: var(--transition);

  opacity: 0;

}

@media only screen and (max-width: 991px) {

  .project-single .content {

    bottom: 20px;

  }

}

.project-single .content p.tag {

  color: var(--color-white);

  padding: 6px 14px 6px;

  line-height: 1;

  border: 1px solid var(--color-white);

  max-width: max-content;

  border-radius: 4px;

  margin-bottom: 15px;

}

.project-single .content .title {

  margin-bottom: 0;

  max-width: 274px;

  font-size: 30px;

  line-height: 1.2;

}

@media only screen and (max-width: 991px) {

  .project-single .content .title {

    font-size: 22px;

  }

}

.project-single .content .title a {

  color: var(--color-white);

}

.project-single .tmp-icon-overlay-link-btn {

  position: absolute;

  z-index: 1;

  top: 30px;

  right: 30px;

  opacity: 0;

  transition: all 0.4s;

  border-radius: 8px;

  border: none;

}

.project-single .tmp-icon-overlay-link-btn i {

  color: var(--color-white);

}

.project-single .tmp-icon-overlay-link-btn::after {

  border-radius: 8px;

  background-color: var(--color-primary);

  border: none;

}

.project-single .tmp-icon-overlay-link-btn:hover {

  border: none;

}

.project-single .tmp-icon-overlay-link-btn:hover i.tmp-icon-bottom {

  color: var(--color-primary);

}

.project-single .tmp-icon-overlay-link-btn:hover::after {

  background-color: var(--color-white);

  border: none;

}

@media only screen and (max-width: 991px) {

  .project-single .over-link {

    bottom: 0;

  }

  .project-single .content {

    bottom: 30px;

    opacity: 1;

  }

}

@media only screen and (max-width: 991px) and (max-width: 991px) {

  .project-single .content {

    bottom: 20px;

  }

}

@media only screen and (max-width: 991px) {

  .project-single .tmp-icon-overlay-link-btn {

    opacity: 1;

  }

}



.swiper-slide-active .project-wrapper .content-area,

.swiper-slide-active .project-wrapper3 .content-area {

  left: 0;

}



.tmp-faq-area .section-title-area .pre-title,

.tmp-faq-area .section-title-area .section-title {

  margin-left: 0;

  text-align: left;

}

.tmp-faq-area .section-title-area .pre-title span,

.tmp-faq-area .section-title-area .section-title span {

  color: var(--color-primary);

}



.accordion-one .accordion-item {

  background: transparent;

  border: none;

  box-shadow: none;

  border-bottom: 1px solid rgba(217, 217, 217, 0.3882352941);

  margin-bottom: 20px;

  padding-bottom: 20px;

}

.accordion-one .accordion-item h2 {

  border: none;

  box-shadow: none;

  padding: 0;

  margin-bottom: 10px;

  background: transparent;

}

.accordion-one .accordion-item h2 button {

  font-weight: 600;

  font-size: 20px;

  line-height: 30px;

  color: #0C0A0A;

  border: none;

  background: transparent;

  padding: 0;

}

@media only screen and (max-width: 576px) {

  .accordion-one .accordion-item h2 button {

    font-size: 18px;

    line-height: 1.4;

    align-items: flex-start !important;

  }

}

.accordion-one .accordion-item h2 button::after {

  background-image: none;

  content: "\f078";

  font-family: "Font Awesome 5 Pro";

  height: unset;

  width: unset;

  font-size: 14px;

}

.accordion-one .accordion-item h2 button[aria-expanded=true] {

  padding: 0;

  background: transparent;

  border: none;

  box-shadow: none;

  color: var(--color-primary);

}

.accordion-one .accordion-item h2 button[aria-expanded=true]::after {

  background-image: none;

  content: "\f077";

  transform: none;

  font-family: "Font Awesome 5 Pro";

  margin-top: -17px;

}

@media only screen and (max-width: 576px) {

  .accordion-one .accordion-item h2 button[aria-expanded=true]::after {

    margin-top: 0px;

  }

}

.accordion-one .accordion-item h2 button:focus {

  box-shadow: none;

}

.accordion-one .accordion-item .accordion-body {

  padding: 0;

}

.accordion-one .accordion-item .accordion-body p.desc {

  font-weight: 400;

  font-size: 16px;

  line-height: 28px;

}

.accordion-one .accordion-item:last-child {

  border: none;

  margin-bottom: 0;

}



.project-bg {

  background: rgba(149, 149, 149, 0.1);

}



.project-wrapper2 {

  clip-path: polygon(0% 3.03%, 0% 3.03%, 0.025% 2.539%, 0.099% 2.072%, 0.217% 1.638%, 0.376% 1.241%, 0.571% 0.888%, 0.798% 0.585%, 1.053% 0.338%, 1.332% 0.154%, 1.632% 0.04%, 1.948% 0%, 85.62% 0%, 85.62% 0%, 85.763% 0.008%, 85.905% 0.032%, 86.044% 0.073%, 86.181% 0.128%, 86.315% 0.199%, 86.445% 0.285%, 86.571% 0.385%, 86.692% 0.499%, 86.808% 0.628%, 86.918% 0.77%, 99.349% 18.036%, 99.349% 18.036%, 99.468% 18.215%, 99.576% 18.409%, 99.672% 18.614%, 99.757% 18.831%, 99.83% 19.058%, 99.89% 19.293%, 99.938% 19.536%, 99.972% 19.785%, 99.993% 20.039%, 100% 20.296%, 100% 96.97%, 100% 96.97%, 99.975% 97.461%, 99.901% 97.928%, 99.783% 98.362%, 99.624% 98.759%, 99.429% 99.113%, 99.202% 99.415%, 98.947% 99.662%, 98.668% 99.846%, 98.368% 99.96%, 98.052% 100%, 1.948% 100%, 1.948% 100%, 1.632% 99.96%, 1.332% 99.846%, 1.053% 99.662%, 0.798% 99.415%, 0.571% 99.113%, 0.376% 98.759%, 0.217% 98.362%, 0.099% 97.928%, 0.025% 97.461%, 0% 96.97%, 0% 3.03%);

  position: relative;

  z-index: 1;

}

.project-wrapper2 .image-area a img {

  transition: 0.5s;

}

.project-wrapper2:hover::after {

  opacity: 1;

}

.project-wrapper2:hover .content {

  bottom: 30px;

}

.project-wrapper2:hover .content .title {

  margin-bottom: 25px;

}

.project-wrapper2:hover .image-area a img {

  transform: scale(1.15);

}

.project-wrapper2::before {

  content: "";

  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.37) 66.64%, rgba(0, 0, 0, 0.66) 100%);

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  z-index: 1;

  position: absolute;

  transition: var(--transition);

  opacity: 1;

  pointer-events: none;

}

.project-wrapper2::after {

  content: "";

  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 0.01%, #000000 100%);

  width: 100%;

  height: 100%;

  bottom: 0;

  opacity: 0;

  left: 0;

  z-index: 1;

  position: absolute;

  transition: var(--transition);

  pointer-events: none;

}

.project-wrapper2 .content {

  position: absolute;

  z-index: 2;

  width: 100%;

  max-width: max-content;

  left: 30px;

  bottom: -60px;

  text-align: start;

  transition: var(--transition);

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .project-wrapper2 .content {

    max-width: 92%;

  }

}

@media only screen and (max-width: 1199px) {

  .project-wrapper2 .content {

    width: 88%;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .project-wrapper2 .content {

    bottom: -65px;

  }

}

.project-wrapper2 .content .sub-title {

  color: #ffffff;

  font-weight: 400;

  font-family: var(--font-primary);

  margin-bottom: 10px;

  font-size: 14px;

  letter-spacing: 0.5px;

}

.project-wrapper2 .content .title {

  margin-bottom: 45px;

  transition: var(--transition);

  line-height: 1.2;

  font-size: 30px;

}

@media only screen and (max-width: 1199px) {

  .project-wrapper2 .content .title {

    line-height: 1.35;

  }

}

@media only screen and (max-width: 991px) {

  .project-wrapper2 .content .title {

    font-size: 24px;

  }

}

@media only screen and (max-width: 576px) {

  .project-wrapper2 .content .title {

    font-size: 22px;

  }

}

.project-wrapper2 .content .title a {

  color: var(--color-white);

  transition: var(--transition);

}

.project-wrapper2 .content .title a:hover {

  color: var(--color-primary);

}

.project-wrapper2 .content .desc {

  color: var(--color-white);

  font-size: 14px;

  line-height: 24px;

}



@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .pb_lp--0 {

    padding-bottom: 0 !important;

  }

}



@media only screen and (max-width: 1199px) {

  .pt_lg--0 {

    padding-top: 0 !important;

  }

}



.project-single2 {

  border-radius: 10px;

  overflow: hidden;

  position: relative;

  z-index: 1;

  transition: var(--transition);

}

.project-single2:hover .over-link {

  bottom: 0;

}

.project-single2:hover .tmp-icon-overlay-link-btn {

  opacity: 1;

}

.project-single2:hover .content {

  bottom: 30px;

  opacity: 1;

}

@media only screen and (max-width: 991px) {

  .project-single2:hover .content {

    left: 10px;

    bottom: 10px;

  }

}

.project-single2 .over-link {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  bottom: -100%;

  left: 0;

  z-index: 1;

  transition: var(--transition);

  background: linear-gradient(180deg, rgba(41, 241, 255, 0) 0%, var(--color-primary) 100%);

}

.project-single2 .tmp-icon-overlay-link-btn {

  position: absolute;

  top: 20px;

  right: 20px;

  opacity: 0;

  transition: var(--transition);

  border-radius: 50%;

}

@media only screen and (max-width: 1199px) {

  .project-single2 .tmp-icon-overlay-link-btn {

    top: 10px;

    right: 10px;

    min-height: 40px;

    min-width: 40px;

  }

  .project-single2 .tmp-icon-overlay-link-btn i {

    font-size: 18px;

  }

}

.project-single2 .tmp-icon-overlay-link-btn i {

  font-size: 24px;

  font-weight: 400;

}

.project-single2 .tmp-icon-overlay-link-btn::after {

  border-radius: 50%;

}

.project-single2 .content {

  position: absolute;

  bottom: 0px;

  left: 30px;

  z-index: 2;

  transition: var(--transition);

  opacity: 0;

}

.project-single2 .content p.tag {

  color: var(--color-white);

  padding: 7px 14px 7px;

  line-height: 1;

  border: 1px solid rgba(255, 255, 255, 0.1882352941);

  max-width: max-content;

  border-radius: 4px;

  margin-bottom: 15px;

}

.project-single2 .content .title {

  margin-bottom: 0;

  max-width: 274px;

  font-size: 30px;

  line-height: 1.3;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .project-single2 .content .title {

    font-size: 24px;

  }

}

@media only screen and (max-width: 991px) {

  .project-single2 .content .title {

    font-size: 22px;

  }

}

@media only screen and (max-width: 767px) {

  .project-single2 .content .title {

    font-size: 22px;

  }

}

.project-single2 .content .title a {

  color: var(--color-white);

}

@media only screen and (max-width: 991px) {

  .project-single2 .over-link {

    bottom: 0;

  }

  .project-single2 .tmp-icon-overlay-link-btn {

    opacity: 1;

  }

  .project-single2 .content {

    bottom: 30px;

    opacity: 1;

  }

}

@media only screen and (max-width: 991px) and (max-width: 991px) {

  .project-single2 .content {

    left: 25px;

    bottom: 25px;

  }

}



.single-wrapper {

  height: 100%;

}



.tmp-trending-area .section-inner .swiper-btn {

  transform: translateY(-50%);

  font-size: 22px;

  background: #FFFFFF;

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

  width: 60px;

  height: 60px;

  line-height: 62px;

  display: block;

  text-align: center;

  border-radius: 50%;

  transition: 0.3s;

  color: var(--color-heading-1);

}

@media only screen and (max-width: 576px) {

  .tmp-trending-area .section-inner .swiper-btn {

    font-size: 18px;

    width: 45px;

    height: 45px;

    line-height: 47px;

  }

}

.tmp-trending-area .section-inner .swiper-btn i {

  color: var(--color-primary);

}

.tmp-trending-area .section-inner .swiper-btn::after {

  display: none;

}

.tmp-trending-area .section-inner .swiper-btn.swiper-button-prev {

  left: -60px;

  opacity: 0;

}

@media only screen and (max-width: 1199px) {

  .tmp-trending-area .section-inner .swiper-btn.swiper-button-prev {

    left: 30px;

  }

}

@media only screen and (max-width: 991px) {

  .tmp-trending-area .section-inner .swiper-btn.swiper-button-prev {

    left: -30px;

    opacity: 1;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-trending-area .section-inner .swiper-btn.swiper-button-prev {

    left: 0;

  }

}

.tmp-trending-area .section-inner .swiper-btn.swiper-button-next {

  right: -60px;

  opacity: 0;

}

@media only screen and (max-width: 1199px) {

  .tmp-trending-area .section-inner .swiper-btn.swiper-button-next {

    right: -30px;

  }

}

@media only screen and (max-width: 991px) {

  .tmp-trending-area .section-inner .swiper-btn.swiper-button-next {

    right: -30px;

    opacity: 1;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-trending-area .section-inner .swiper-btn.swiper-button-next {

    right: 0;

  }

}

.tmp-trending-area .section-inner .swiper-btn:hover {

  background: var(--color-primary);

  transform: translateY(-50%) scale(1.15);

}

.tmp-trending-area .section-inner .swiper-btn:hover i {

  color: #fff;

}

.tmp-trending-area .section-inner:hover .swiper-btn.swiper-button-prev {

  left: -90px;

  opacity: 1;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-trending-area .section-inner:hover .swiper-btn.swiper-button-prev {

    left: -60px;

  }

}

@media only screen and (max-width: 1199px) {

  .tmp-trending-area .section-inner:hover .swiper-btn.swiper-button-prev {

    left: -30px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-trending-area .section-inner:hover .swiper-btn.swiper-button-prev {

    left: 0;

  }

}

.tmp-trending-area .section-inner:hover .swiper-btn.swiper-button-next {

  right: -90px;

  opacity: 1;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-trending-area .section-inner:hover .swiper-btn.swiper-button-next {

    right: -60px;

  }

}

@media only screen and (max-width: 1199px) {

  .tmp-trending-area .section-inner:hover .swiper-btn.swiper-button-next {

    right: -30px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-trending-area .section-inner:hover .swiper-btn.swiper-button-next {

    right: 0;

  }

}



.swiper-slide-active .project-wrapper3 .image-area a img {

  filter: grayscale(0);

}



.project-wrapper3 {

  position: relative;

  z-index: 1;

  transition: all 0.4s;

  overflow: hidden;

  border-radius: 4px;

}

.project-wrapper3::before {

  content: "";

  background: #0c1e21;

  position: absolute;

  width: 100%;

  height: 100%;

  bottom: 0;

  inset-inline-start: 0;

  opacity: 0.25;

  pointer-events: none;

  z-index: 1;

}

.project-wrapper3:hover .image-area a img {

  transform: scale(1.05);

  filter: grayscale(0);

}

.project-wrapper3:hover .content-area {

  left: 0;

}

.project-wrapper3 .image-area a {

  display: block;

  transition: var(--transition);

}

.project-wrapper3 .image-area a img {

  transition: var(--transition);

  transform: scale(1);

  filter: grayscale(1);

}

.project-wrapper3 .content-area {

  position: absolute;

  z-index: 1;

  bottom: 30px;

  left: -100%;

  background: var(--color-white);

  max-width: 370px;

  padding: 30px;

  transition: all 0.4s;

  border-radius: 0 6px 6px 0;

}

@media only screen and (max-width: 576px) {

  .project-wrapper3 .content-area {

    background: rgba(255, 255, 255, 0.4588235294);

    backdrop-filter: blur(7px);

  }

}

.project-wrapper3 .content-area .tag {

  background: var(--primary-100);

  font-size: 14px;

  padding: 0 14px;

  height: 30px;

  color: var(--color-primary);

  max-width: max-content;

  border-radius: 4px;

  font-family: var(--font-secondary);

  font-weight: 400;

  margin-bottom: 10px;

  display: flex;

  align-items: center;

  justify-content: center;

}

.project-wrapper3 .content-area .title {

  font-size: 22px;

  font-weight: 600;

  line-height: 30px;

  margin-bottom: 0;

}

.project-wrapper3 .content-area .title a {

  color: var(--color-black);

}

.project-wrapper3 .content-area .title a:hover {

  color: var(--color-primary);

}



.project-wrapper4 {

  display: flex;

  align-items: center;

  background: #FFF8F4;

  border-radius: 6px;

  overflow: hidden;

}

@media only screen and (max-width: 991px) {

  .project-wrapper4 {

    flex-direction: column;

    align-items: flex-start;

    gap: 0;

  }

}

.project-wrapper4 .content {

  padding: 65px 115px 65px 80px;

  flex-basis: 45%;

}

@media only screen and (max-width: 1199px) {

  .project-wrapper4 .content {

    padding: 30px;

  }

}

@media only screen and (max-width: 576px) {

  .project-wrapper4 .content {

    padding: 20px;

  }

}

.project-wrapper4 .content .title {

  font-size: 34px;

  line-height: 1;

}

@media only screen and (max-width: 1199px) {

  .project-wrapper4 .content .title {

    font-size: 26px;

  }

}

@media only screen and (max-width: 576px) {

  .project-wrapper4 .content .title {

    font-size: 26px;

  }

}

.project-wrapper4 .image-area {

  flex-basis: 55%;

}

.project-wrapper4.nc {

  background: rgba(255, 112, 41, 0.05);

}



.rts-project-details-area .single-wrapper {

  background: var(--color-white);

  padding: 40px 30px;

  border-radius: 6px;

  box-shadow: var(--shadow-1);

}

.rts-project-details-area .single-wrapper ul {

  display: flex;

  flex-direction: column;

  gap: 20px;

}

.rts-project-details-area .single-wrapper ul li {

  line-height: 1.3;

  padding: 0;

  font-size: 16px;

  transition: var(--transition);

  color: var(--color-primary);

  font-weight: 600;

}

.rts-project-details-area .single-wrapper ul li span {

  color: var(--color-body);

  font-weight: 400;

}

.rts-project-details-area .content-area .desc {

  max-width: 836px;

}

.rts-project-details-area .content-area .image-area {

  display: flex;

  gap: 30px;

}

@media only screen and (max-width: 576px) {

  .rts-project-details-area .content-area .image-area {

    flex-wrap: wrap;

  }

  .rts-project-details-area .content-area .image-area img {

    width: 100%;

  }

}

.rts-project-details-area .content-area .project-list {

  display: flex;

  align-items: center;

  max-width: 600px;

  flex-wrap: wrap;

  gap: 10px;

}

@media only screen and (max-width: 479px) {

  .rts-project-details-area .content-area .project-list {

    flex-direction: column;

  }

}

.rts-project-details-area .content-area .project-list li {

  width: 47%;

  padding-left: 20px;

  position: relative;

  z-index: 1;

  color: var(--color-heading-1);

  font-weight: 600;

}

@media only screen and (max-width: 479px) {

  .rts-project-details-area .content-area .project-list li {

    width: 100%;

  }

}

.rts-project-details-area .content-area .project-list li::after {

  content: "";

  position: absolute;

  width: 10px;

  height: 10px;

  border-radius: 50%;

  background: var(--color-primary);

  left: 0;

  top: 50%;

  transform: translateY(-50%);

}



.bg-none {

  background: none !important;

}



.tmp-project-area.inner .nav-tabs {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 20px;

  border: none;

}

.tmp-project-area.inner .nav-tabs li button {

  border: 1px solid var(--color-border);

  color: var(--color-heading-1);

  font-family: var(--font-primary);

  line-height: 1;

  padding: 16px 20px;

  border-radius: 6px;

  font-weight: 600;

  transition: var(--transition);

}

.tmp-project-area.inner .nav-tabs li button.active {

  background: var(--color-primary-2);

  border: 1px solid var(--color-primary-2);

  color: var(--color-white);

}



.tmpWorkingSlider {

  position: relative;

}

.tmpWorkingSlider .swiper-navigation .swiper-btn {

  color: var(--color-primary-2);

  display: flex;

  align-items: center;

  gap: 5px;

  position: unset;

  margin: 0;

  width: 60px;

  height: 60px;

  background: #fff;

  border-radius: 50%;

  transition: var(--transition);

  position: absolute;

  z-index: 10;

  transform: translateY(-50%);

  transition: 0.3s;

  opacity: 0;

}

.tmpWorkingSlider .swiper-navigation .swiper-btn i {

  transition: 0.3s;

}

.tmpWorkingSlider .swiper-navigation .swiper-btn:hover {

  background: var(--color-primary);

  transform: translateY(-50%) scale(1.1);

}

.tmpWorkingSlider .swiper-navigation .swiper-btn:hover i {

  color: #fff;

}

.tmpWorkingSlider .swiper-navigation .swiper-btn:hover span {

  background: var(--color-primary-2);

  color: var(--color-white);

}

.tmpWorkingSlider .swiper-navigation .swiper-btn::after, .tmpWorkingSlider .swiper-navigation .swiper-btn::before {

  display: none;

}

.tmpWorkingSlider .swiper-navigation .swiper-btn span {

  min-width: 60px;

  height: 60px;

  line-height: 60px;

  background: rgba(135, 171, 66, 0.2);

  display: block;

  border-radius: 50%;

  text-align: center;

  transition: var(--transition);

}

.tmpWorkingSlider .swiper-navigation .swiper-btn i {

  font-size: 18px;

}

.tmpWorkingSlider .swiper-navigation .swiper-btn.swiper-button-next {

  position: absolute;

  right: 120px;

  top: 50%;

  left: auto;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmpWorkingSlider .swiper-navigation .swiper-btn.swiper-button-next {

    right: 25px;

  }

}

@media only screen and (max-width: 1199px) {

  .tmpWorkingSlider .swiper-navigation .swiper-btn.swiper-button-next {

    right: 25px;

  }

}

.tmpWorkingSlider .swiper-navigation .swiper-btn.swiper-button-prev {

  position: absolute;

  left: 120px;

  top: 50%;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmpWorkingSlider .swiper-navigation .swiper-btn.swiper-button-prev {

    left: 25px;

  }

}

@media only screen and (max-width: 1199px) {

  .tmpWorkingSlider .swiper-navigation .swiper-btn.swiper-button-prev {

    left: 25px;

  }

}

.tmpWorkingSlider:hover .swiper-navigation .swiper-btn {

  opacity: 1;

}

.tmpWorkingSlider:hover .swiper-navigation .swiper-btn.swiper-button-next {

  right: 90px;

}

@media only screen and (max-width: 991px) {

  .tmpWorkingSlider:hover .swiper-navigation .swiper-btn.swiper-button-next {

    right: 30px;

  }

}

.tmpWorkingSlider:hover .swiper-navigation .swiper-btn.swiper-button-prev {

  left: 90px;

}

@media only screen and (max-width: 991px) {

  .tmpWorkingSlider:hover .swiper-navigation .swiper-btn.swiper-button-prev {

    left: 30px;

  }

}



.slider-fluid-relative {

  position: relative;

}

.slider-fluid-relative .slider-button {

  gap: 20px;

}

.slider-fluid-relative .slider-button .swiper-btn {

  color: var(--color-primary-2);

  display: flex;

  align-items: center;

  gap: 5px;

  position: unset;

  margin: 0;

  width: 60px;

  height: 60px;

  background: #fff;

  border-radius: 50%;

  transition: var(--transition);

  position: absolute;

  z-index: 10;

  transform: translateY(-50%);

  transition: 0.3s;

  opacity: 0;

}

.slider-fluid-relative .slider-button .swiper-btn i {

  transition: 0.3s;

}

.slider-fluid-relative .slider-button .swiper-btn:hover {

  background: var(--color-primary);

  transform: translateY(-50%) scale(1.1);

}

.slider-fluid-relative .slider-button .swiper-btn:hover i {

  color: #fff;

}

.slider-fluid-relative .slider-button .swiper-btn:hover span {

  background: var(--color-primary-2);

  color: var(--color-white);

}

.slider-fluid-relative .slider-button .swiper-btn::after, .slider-fluid-relative .slider-button .swiper-btn::before {

  display: none;

}

.slider-fluid-relative .slider-button .swiper-btn span {

  min-width: 60px;

  height: 60px;

  line-height: 60px;

  background: rgba(135, 171, 66, 0.2);

  display: block;

  border-radius: 50%;

  text-align: center;

  transition: var(--transition);

}

.slider-fluid-relative .slider-button .swiper-btn i {

  font-size: 18px;

}

.slider-fluid-relative .slider-button .swiper-btn.swiper-button-next {

  position: absolute;

  right: 90px;

  top: 50%;

  left: auto;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .slider-fluid-relative .slider-button .swiper-btn.swiper-button-next {

    right: 25px;

  }

}

@media only screen and (max-width: 1199px) {

  .slider-fluid-relative .slider-button .swiper-btn.swiper-button-next {

    right: 25px;

  }

}

.slider-fluid-relative .slider-button .swiper-btn.swiper-button-prev {

  position: absolute;

  left: 90px;

  top: 50%;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .slider-fluid-relative .slider-button .swiper-btn.swiper-button-prev {

    left: 25px;

  }

}

@media only screen and (max-width: 1199px) {

  .slider-fluid-relative .slider-button .swiper-btn.swiper-button-prev {

    left: 25px;

  }

}

.slider-fluid-relative:hover .swiper-button-next {

  right: 60px !important;

  opacity: 1;

}

.slider-fluid-relative:hover .swiper-button-prev {

  left: 60px !important;

  opacity: 1;

}

@media only screen and (max-width: 767px) {

  .slider-fluid-relative .slider-button .swiper-button-next {

    right: 30px !important;

  }

  .slider-fluid-relative .slider-button .swiper-button-prev {

    left: 30px !important;

  }

}



.rts-project-details-area .section-inner {

  background: var(--color-white);

  padding: 30px;

  box-shadow: var(--shadow-1);

  border-radius: 6px;

}

@media only screen and (max-width: 479px) {

  .rts-project-details-area .section-inner {

    padding: 20px;

  }

}



.g-40 {

  --bs-gutter-y: 40px;

  --bs-gutter-x: 40px;

}



.g-60 {

  --bs-gutter-y: 60px;

  --bs-gutter-x: 60px;

}

@media only screen and (max-width: 991px) {

  .g-60 {

    --bs-gutter-y: 40px;

    --bs-gutter-x: 40px;

  }

}

.g-60 .invers-portfolio-scale-over {

  min-height: 850px;

}



.invers-portfolio-scale-over {

  position: relative;

  min-height: 600px;

  width: 100%;

  padding-top: 35%;

}

.invers-portfolio-scale-over .thumbnail-inner {

  transition: transform 0.28s ease;

  z-index: 9;

  position: absolute;

  top: 0;

  left: 0;

  height: 100%;

  width: 100%;

  background-size: cover;

  background-position: center;

  overflow: hidden;

  border-radius: 5px;

  cursor: pointer;

}

.invers-portfolio-scale-over .thumbnail-inner::before {

  background-image: linear-gradient(rgba(0, 0, 0, 0) 10%, var(--color-primary) 100%);

  position: absolute;

  content: "";

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  z-index: 5;

  opacity: 0;

  transition: 0.3s;

}

.invers-portfolio-scale-over .thumbnail-inner .thumbnail {

  position: absolute;

  top: 0;

  left: 0;

  height: 100%;

  width: 100%;

  background-size: cover;

  background-position: center;

  border-radius: 5px;

  background-color: #0a0a0a;

  background-image: url(../images/project/77.webp);

  transform: scale(1.13) translateZ(0);

  backface-visibility: hidden;

  transition: transform 0.28s ease;

  z-index: 4;

}

.invers-portfolio-scale-over .thumbnail-inner .thumbnail::after {

  background-color: rgba(45, 45, 45, 0.35);

  position: absolute;

  top: 0;

  left: 0;

  height: 100%;

  width: 100%;

  content: " ";

  z-index: 1;

  display: block;

  border-radius: 5px;

  background-color: rgba(25, 25, 25, 0.37);

  transition: 0.3s;

}

.invers-portfolio-scale-over .thumbnail-inner .thumbnail.image-1 {

  background-image: url(../images/project/77.webp);

}

.invers-portfolio-scale-over .thumbnail-inner .thumbnail.image-2 {

  background-image: url(../images/project/78.webp);

}

.invers-portfolio-scale-over .thumbnail-inner .thumbnail.image-3 {

  background-image: url(../images/project/79.webp);

}

.invers-portfolio-scale-over .thumbnail-inner .thumbnail.image-4 {

  background-image: url(../images/project/80.webp);

}

.invers-portfolio-scale-over .thumbnail-inner .thumbnail.image-5 {

  background-image: url(../images/project/81.webp);

}

.invers-portfolio-scale-over .thumbnail-inner .thumbnail.image-6 {

  background-image: url(../images/project/82.webp);

}

.invers-portfolio-scale-over .thumbnail-inner .bg-blr-image .image-1 {

  background-image: url(../images/project/77.webp);

}

.invers-portfolio-scale-over .thumbnail-inner .bg-blr-image .image-2 {

  background-image: url(../images/project/78.webp);

}

.invers-portfolio-scale-over .thumbnail-inner .bg-blr-image .image-3 {

  background-image: url(../images/project/79.webp);

}

.invers-portfolio-scale-over .thumbnail-inner .bg-blr-image .image-4 {

  background-image: url(../images/project/80.webp);

}

.invers-portfolio-scale-over .thumbnail-inner .bg-blr-image .image-5 {

  background-image: url(../images/project/81.webp);

}

.invers-portfolio-scale-over .thumbnail-inner .bg-blr-image .image-6 {

  background-image: url(../images/project/82.webp);

}

.invers-portfolio-scale-over .content {

  position: absolute;

  bottom: 40px;

  left: 40px;

  right: 40px;

  max-width: 100% !important;

  z-index: 10;

  padding: 0;

}

@media only screen and (max-width: 767px) {

  .invers-portfolio-scale-over .content {

    left: 20px;

    bottom: 20px;

  }

}

.invers-portfolio-scale-over .content .inner p {

  font-size: 14px;

  margin-bottom: 10px;

  border: 1px solid var(--color-border);

  padding: 3px 12px;

  max-width: max-content;

  border-radius: 4px;

  color: var(--color-white);

}

.invers-portfolio-scale-over .content .inner .title {

  font-size: 24px;

  line-height: 36px;

  color: #ffffff;

  font-weight: 700;

}

@media only screen and (max-width: 576px) {

  .invers-portfolio-scale-over .content .inner .title {

    font-size: 20px;

    line-height: 1.3;

  }

}

.invers-portfolio-scale-over .content .inner .title:hover a {

  color: var(--color-white);

}

.invers-portfolio-scale-over .content .inner .portfolio-button {

  margin-top: 20px;

  transition: 0.7s;

}

.invers-portfolio-scale-over .content .inner .tmp-btn {

  height: 45px;

  border-width: 2px;

}

.invers-portfolio-scale-over:hover .thumbnail-inner {

  transform: scale(1.08) translateZ(0);

}

.invers-portfolio-scale-over:hover .thumbnail-inner::before {

  opacity: 0.85;

}

.invers-portfolio-scale-over:hover .thumbnail {

  transform: scale(1) translateZ(0);

}

.invers-portfolio-scale-over:hover .thumbnail::after {

  background-color: rgba(25, 25, 25, 0);

}

.invers-portfolio-scale-over:hover .bg-blr-image {

  opacity: 0;

  z-index: 9;

}



.project__wrp {

  position: relative;

  overflow: hidden;

}

.project__wrp .project__item {

  display: block;

  position: relative;

  height: 720px;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-align: end;

  -ms-flex-align: end;

  align-items: flex-end;

  -webkit-border-end: 1px solid rgba(255, 255, 255, 0.2);

  border-inline-end: 1px solid rgba(255, 255, 255, 0.2);

}

.project__wrp .project__item .content {

  padding: 60px;

  width: 100%;

  transition: var(--transition);

  transform: translateY(80px);

}

.project__wrp .project__item .content span {

  color: #fff;

  font-size: 100px;

  line-height: 120px;

  font-weight: 500;

  transition: var(--transition);

}

.project__wrp .project__item .content h3 {

  color: var(--color-white);

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .project__wrp .project__item .content h3 {

    font-size: 26px;

  }

}

@media only screen and (max-width: 1199px) {

  .project__wrp .project__item .content h3 {

    font-size: 22px;

  }

}

.project__wrp .project__item .content p {

  margin-top: 20px;

  color: var(--color-white);

  opacity: 0;

  visibility: hidden;

  transform: var(--transition);

}

.project__wrp .project__item:hover .content {

  transform: translate(0);

}



.project__slider-arrys {

  display: flex;

  align-items: center;

  gap: 5px;

  position: absolute;

  top: 50px;

  left: 50px;

  z-index: 9;

}

.project__slider-arrys button {

  opacity: 0;

  visibility: hidden;

  transform: translateY(-20px);

  width: 50px;

  height: 50px;

  line-height: 50px;

  text-align: center;

  border-radius: 50%;

  transition: var(--transition);

  border-radius: 12px;

  color: var(--black);

  background-color: var(--white);

  transition: var(--transition);

  font-size: 18px;

}

.project__slider-arrys button:last-child {

  transition: all 0.5s ease-in-out;

}



.project__image {

  position: absolute;

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

}

.project__image .tab-img {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  -o-object-fit: cover;

  object-fit: cover;

  -webkit-transform: scale(1.1, 1.1);

  -ms-transform: scale(1.1, 1.1);

  transform: scale(1.1, 1.1);

  opacity: 0;

  -webkit-transition: all 0.7s;

  -o-transition: all 0.7s;

  transition: all 0.7s;

}

.project__image .tab-img.active {

  -webkit-transform: scale(1);

  -ms-transform: scale(1);

  transform: scale(1);

  opacity: 1;

}



.after-gsap-sticky {

  position: relative;

  z-index: 10;

}



.project-flip-style {

  background: var(--color-white);

  box-shadow: var(--shadow-1);

  border-radius: 8px;

  overflow: hidden;

  margin-bottom: 30px;

}

.project-flip-style:last-child {

  margin-bottom: 0;

}

.project-flip-style .thumbnail {

  display: block;

  overflow: hidden;

}

.project-flip-style .thumbnail img {

  transition: 0.3s;

}

.project-flip-style .content {

  padding: 50px;

  display: flex;

  justify-content: end;

  flex-direction: column;

  height: 100%;

  position: relative;

}

@media only screen and (max-width: 576px) {

  .project-flip-style .content {

    padding: 30px 20px;

  }

}

.project-flip-style .content .icon {

  position: absolute;

  left: 50px;

  top: 50px;

}

@media only screen and (max-width: 991px) {

  .project-flip-style .content .icon {

    position: relative;

    left: 0;

    top: 0;

    margin-bottom: 20px;

  }

}

.project-flip-style .content .title {

  margin-bottom: 10px;

  font-size: 30px;

}

@media only screen and (max-width: 576px) {

  .project-flip-style .content .title {

    font-size: 20px;

  }

}

.project-flip-style .content .sub-title {

  font-weight: 500;

}

.project-flip-style:hover .thumbnail img {

  transform: scale(1.04);

}



.single-portfolio-style-flip {

  position: relative;

  overflow: hidden;

  border-radius: 8px;

  display: block;

  margin-bottom: 30px;

}

.single-portfolio-style-flip:last-child {

  margin-bottom: 0;

}

.single-portfolio-style-flip .content {

  position: absolute;

  left: 35px;

  bottom: 35px;

  max-width: calc(100% - 35px);

  background: rgba(0, 0, 0, 0.13);

  backdrop-filter: blur(35px);

  padding: 15px 25px;

  border-radius: 8px;

}

@media only screen and (max-width: 576px) {

  .single-portfolio-style-flip .content {

    left: 20px;

    bottom: 20px;

  }

}

.single-portfolio-style-flip .content .cat {

  font-size: 16px;

  color: var(--color-white);

}

.single-portfolio-style-flip .content .title {

  color: var(--color-white);

  margin-bottom: 0;

  font-size: 32px;

}

@media only screen and (max-width: 767px) {

  .single-portfolio-style-flip .content .title {

    font-size: 22px;

  }

}



.case-stydies-slider-card {

  position: relative;

  border-radius: 10px;

  display: block;

  overflow: hidden;

  z-index: 1;

}

.case-stydies-slider-card .thumbnail {

  display: block;

}

.case-stydies-slider-card .thumbnail img {

  transition: 0.4s;

}

.case-stydies-slider-card::after {

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  height: 90%;

  opacity: 1;

  visibility: visible;

  -webkit-transition: all 300ms ease;

  transition: all 300ms ease;

  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 19.36%, var(--color-primary) 71.26%, var(--color-primary) 100%);

  z-index: 0;

  content: "";

  pointer-events: none;

}

.case-stydies-slider-card:hover::after {

  height: 90%;

  opacity: 1;

  visibility: visible;

}

.case-stydies-slider-card:hover .thumbnail img {

  transform: scale(1.05);

}

.case-stydies-slider-card:hover .content {

  bottom: 30px;

  opacity: 1;

}

.case-stydies-slider-card .content {

  position: absolute;

  left: 30px;

  bottom: 30px;

  width: calc(100% - 60px);

  z-index: 3;

  bottom: 30px;

  opacity: 1;

  transition: 0.4s;

}

.case-stydies-slider-card .content .sub-title {

  color: var(--color-white);

  margin-bottom: 12px;

  display: block;

}

.case-stydies-slider-card .content .title {

  font-size: 28px;

  color: var(--color-white);

  line-height: 1.34;

}

@media only screen and (max-width: 576px) {

  .case-stydies-slider-card .content .title {

    font-size: 24px;

  }

}

.case-stydies-slider-card .content .title:hover a {

  color: var(--color-white);

}



.mySwiper-case-4 {

  padding-bottom: 60px;

}

.mySwiper-case-4 .swiper-pagination {

  margin: auto;

  max-width: max-content;

  margin-top: 25px;

  left: 50%;

  transform: translateX(-50%);

}

.mySwiper-case-4 .swiper-pagination .swiper-pagination-bullet {

  background: var(--color-border);

  opacity: 1;

  width: 8px;

  height: 8px;

  transition: var(--transition);

}

.mySwiper-case-4 .swiper-pagination .swiper-pagination-bullet-active {

  background: var(--color-primary-2);

  width: 40px;

  border-radius: 30px;

}



.fun-facts-bg {

  background-image: url(../images/fun-facts/01.webp);

  background-size: cover;

}



.tmp-fun-facts-area .elecate-left-title .title {

  color: #fff;

  margin-top: 15px;

}



.single-fun-facts-one {

  padding: 50px;

  background: #FF6600;

  height: 100%;

}

.single-fun-facts-one .inner .icon {

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 20px;

  border-radius: 50%;

  background: #fff;

  height: 80px;

  width: 80px;

  margin-bottom: 25px;

}

.single-fun-facts-one .inner .title {

  color: #fff;

  margin-bottom: 0px;

  font-weight: 700;

  font-size: 40px;

  line-height: 61px;

}

.single-fun-facts-one .inner .title span.plus {

  position: relative;

}

.single-fun-facts-one .inner .title span.plus::after {

  position: absolute;

  content: "+";

  font-family: "FontAwesome";

  right: -33px;

  top: 53%;

  font-size: 29px;

  font-weight: 900;

  transform: translateY(-50%);

}

.single-fun-facts-one .inner p {

  font-weight: 600;

  font-size: 16px;

  font-family: var(--font-primary);

  color: #fff;

  margin-bottom: 0;

}



.funfacts-three-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

  flex-wrap: wrap;

}



.section-bottom-seperator {

  position: relative;

  z-index: 2;

}

.section-bottom-seperator::after {

  position: absolute;

  left: 0;

  content: "";

  bottom: 0;

  height: 1px;

  width: 100%;

  background: #252525;

  z-index: 1;

}



.single-fun-facts-three {

  flex-basis: 19%;

}

@media (max-width: 1200px) {

  .single-fun-facts-three {

    flex-basis: 23%;

  }

}

@media (max-width: 991px) {

  .single-fun-facts-three {

    flex-basis: 48%;

    margin-bottom: 30px;

  }

}

@media (max-width: 575px) {

  .single-fun-facts-three {

    flex-basis: 100%;

    text-align: center;

  }

}

.single-fun-facts-three .header-area {

  display: flex;

  align-items: center;

  margin-bottom: 20px;

}

@media (max-width: 575px) {

  .single-fun-facts-three .header-area {

    justify-content: center;

  }

}

.single-fun-facts-three .header-area .logo img {

  width: 80px;

  height: 80px;

  padding: 20px;

  overflow: visible;

  background: #303030;

  border-radius: 50%;

}

.single-fun-facts-three .header-area .title {

  margin-bottom: 0;

  margin-left: 15px;

  color: #fff;

  font-weight: 600;

  font-size: 60px;

  line-height: 91px;

  position: relative;

}

.single-fun-facts-three .header-area .title::after {

  position: absolute;

  content: "";

  right: -30px;

  font-size: 46px;

  color: #fff;

}

.single-fun-facts-three .header-area .title.plus::after {

  content: "+";

}

.single-fun-facts-three .header-area .title.parcent::after {

  content: "%";

}

.single-fun-facts-three .header-area .title.million::after {

  content: "m";

  right: -40px;

}

.single-fun-facts-three p.disc {

  color: #6E777D;

}



.tmp-single-service-two {

  padding: 50px;

  border: 1px solid #E9E9E9;

  position: relative;

  display: block;

  overflow: hidden;

  z-index: 1;

  transition: 0.3s;

  height: 100%;

}

@media (max-width: 400px) {

  .tmp-single-service-two {

    padding: 30px 20px;

  }

}

.tmp-single-service-two::after {

  position: absolute;

  content: "";

  top: 0;

  left: 0;

  height: 250px;

  width: 250px;

  background: var(--color-primary);

  border-radius: 50%;

  filter: blur(50px);

  z-index: -1;

  top: -30%;

  left: -10%;

  transition: 0.3s;

  opacity: 0;

}

.tmp-single-service-two .title-main {

  font-size: 72px;

  padding-bottom: 26px;

  margin-bottom: 30px;

  border-bottom: 1px solid #E9E9E9;

  transition: 0.3s;

}

@media only screen and (max-width: 576px) {

  .tmp-single-service-two .title-main {

    font-size: 46px;

  }

}

.tmp-single-service-two .title-main .counter {

  position: relative;

}

.tmp-single-service-two .title-main .counter::after {

  position: absolute;

  right: -50px;

  content: "+";

  top: 50%;

  transform: translateY(-50%);

  color: #252525;

}

@media only screen and (max-width: 576px) {

  .tmp-single-service-two .title-main .counter::after {

    right: -34px;

  }

}

.tmp-single-service-two a .title {

  font-weight: 600;

  font-size: 30px;

  line-height: 46px;

  color: #0C0A0A;

  font-family: var(--font-primary);

  margin-bottom: 8px;

}

@media only screen and (max-width: 1199px) {

  .tmp-single-service-two a .title {

    font-size: 26px;

  }

}

.tmp-single-service-two:hover {

  border: 1px solid var(--color-primary);

}

.tmp-single-service-two:hover::after {

  opacity: 0.5;

}

.tmp-single-service-two:hover .title-main {

  border-color: var(--color-primary);

}



.title-mid-wrapper-home-two {

  text-align: center;

}

.title-mid-wrapper-home-two span.pre {

  font-weight: 400;

  font-size: 16px;

  line-height: 24px;

  color: #0C0A0A;

  font-family: var(--font-primary);

}

.title-mid-wrapper-home-two .title {

  font-weight: 600;

  font-size: 48px;

  line-height: 60px;

  color: #0C0A0A;

}

@media only screen and (max-width: 576px) {

  .title-mid-wrapper-home-two .title {

    font-size: 30px;

    line-height: 43px;

    margin-top: 12px;

  }

}



.tmp-single-offer {

  padding: 40px;

  border: 1px solid #E9E9E9;

  position: relative;

  display: block;

  overflow: hidden;

  z-index: 1;

  transition: 0.3s;

}

@media only screen and (max-width: 767px) {

  .tmp-single-offer {

    padding: 15px;

  }

}

.tmp-single-offer::after {

  position: absolute;

  content: "";

  left: -10%;

  top: -30%;

  height: 250px;

  width: 250px;

  filter: blur(50px);

  background: var(--color-primary);

  z-index: -1;

  opacity: 0;

  transition: 0.3s;

}

.tmp-single-offer a.thumbnail {

  overflow: hidden;

  display: block;

  max-height: max-content;

  margin-bottom: 30px;

}

.tmp-single-offer a.thumbnail:hover img {

  transform: scale(1.3);

}

.tmp-single-offer a.thumbnail img {

  transition: 1.3s;

  max-height: max-content;

  width: 100%;

}

.tmp-single-offer .content-wrapper .title {

  margin-bottom: 10px;

  transition: all 0.4s;

}

.tmp-single-offer .content-wrapper .title:hover {

  color: var(--color-primary);

}

.tmp-single-offer .content-wrapper .disc {

  margin-bottom: 20px;

}

.tmp-single-offer .content-wrapper .tmp-btn {

  border: 1px solid #E9E9E9;

  display: flex;

  align-items: center;

  font-weight: 600;

  font-size: 14px;

  line-height: 21px;

  padding: 15px 28px;

  color: #0C0A0A;

}

.tmp-single-offer .content-wrapper .tmp-btn:hover {

  background: var(--color-primary);

  border-color: var(--color-primary);

  color: #fff;

}

.tmp-single-offer .content-wrapper .tmp-btn i {

  margin-left: 5px;

}

.tmp-single-offer:hover {

  border-color: var(--color-primary);

}

.tmp-single-offer:hover::after {

  opacity: 0.6;

}



.bg_about-f {

  background: #F8F8F8;

}



.about-fun-facts-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 110px;

}

@media only screen and (max-width: 1199px) {

  .about-fun-facts-wrapper {

    flex-direction: column;

    gap: 30px;

    align-items: flex-start;

  }

}

.about-fun-facts-wrapper .single-funfacts-about .top .icon img {

  width: 80px;

  height: 80px;

  padding: 20px;

}



.single-funfacts-about .top {

  display: flex;

  align-items: center;

  gap: 20px;

  margin-bottom: 30px;

}

.single-funfacts-about .top .title {

  margin-bottom: 0;

  font-size: 60px;

  position: relative;

}

.single-funfacts-about .top .title::after {

  position: absolute;

  content: "";

  right: -37px;

  top: 50%;

  transform: translateY(-50%);

  color: #0C0A0A;

  font-size: 60px;

  font-weight: 600;

}

.single-funfacts-about .top .title.plus::after {

  content: "+";

}

.single-funfacts-about .top .title.percent::after {

  content: "%";

}

.single-funfacts-about .top .title.million::after {

  content: "m";

  right: -52px;

}

.single-funfacts-about p.disc {

  font-weight: 600;

  font-size: 16px;

  line-height: 24px;

  font-family: var(--font-primary);

}

.single-funfacts-about .icon {

  width: 80px;

  height: 80px;

  background: #FF6600;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

}



@media (max-width: 991px) {

  .funfacts-and-casestudy-wrapper.bg_image--5 {

    background-size: cover;

  }

}



.tmp-company-experties-area .latest-project-horizental-title-wrapper .button-area .tmp-btn {

  text-transform: capitalize;

  background: #1F1F1F;

  display: flex;

  align-items: center;

  padding: 7px 7px 10px 25px;

}

.tmp-company-experties-area .latest-project-horizental-title-wrapper .button-area .tmp-btn i {

  height: 40px;

  width: 40px;

  background: var(--color-primary);

  display: flex;

  align-items: center;

  justify-content: center;

  margin-left: 20px;

  transition: 0.3s;

}

.tmp-company-experties-area .latest-project-horizental-title-wrapper .button-area .tmp-btn:hover i {

  background: #fff;

  color: #0C0A0A;

}



.after-none::after {

  display: none;

}



.experties-area-inner {

  padding: 48px 0;

  border-top: 1px solid #242424;

  border-bottom: 1px solid #242424;

  margin-top: 50px;

  display: flex;

  align-items: center;

  justify-content: space-between;

}

@media only screen and (max-width: 1199px) {

  .experties-area-inner {

    flex-wrap: wrap;

    justify-content: center;

    gap: 30px;

  }

}

@media only screen and (max-width: 767px) {

  .experties-area-inner {

    flex-wrap: wrap;

    justify-content: flex-start;

    gap: 30px;

  }

}



.single-experties {

  display: flex;

  align-items: center;

  position: relative;

  max-width: max-content;

}

.single-experties::after {

  position: absolute;

  content: "";

  height: 213%;

  width: 1px;

  background: #242424;

  top: 50%;

  right: -70px;

  transform: translateY(-50%);

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .single-experties::after {

    right: -36px;

  }

}

@media only screen and (max-width: 1199px) {

  .single-experties::after {

    display: none;

  }

}

.single-experties .counter-inner {

  margin-left: 20px;

}

.single-experties .counter-inner .title {

  margin-bottom: 0;

  color: #fff;

}

.single-experties .counter-inner .title span.plus {

  position: relative;

}

.single-experties .counter-inner .title span.plus::after {

  position: absolute;

  right: -25px;

  top: 14px;

  content: "+";

  font-size: 36px;

  color: #fff;

}

@media only screen and (max-width: 576px) {

  .single-experties .counter-inner .title span.plus::after {

    right: -25px;

    top: 3px;

    font-size: 25px;

  }

}

@media (max-width: 991px) {

  .single-experties .counter-inner .title span.plus::after {

    top: 0;

  }

}

.single-experties .counter-inner span.sub {

  color: #656565;

  font-family: var(--font-primary);

  font-weight: 600;

  font-size: 16px;

  line-height: 24px;

}



.fun-facts-list-style {

  background-image: url(../images/fun-facts/02.webp);

  background-position: center;

  background-repeat: no-repeat;

  background-size: cover;

  position: relative;

  z-index: 1;

  padding: 60px;

  border-radius: 6px;

  overflow: hidden;

  transition: all 0.4s;

  height: 100%;

}

@media only screen and (max-width: 576px) {

  .fun-facts-list-style {

    padding: 30px;

  }

}

.fun-facts-list-style.two {

  background-image: url(../images/fun-facts/03.webp);

}

.fun-facts-list-style::after {

  position: absolute;

  z-index: -1;

  content: "";

  background: linear-gradient(90deg, var(--color-primary) 22.87%, rgba(18, 28, 39, 0) 91.19%);

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

}

.fun-facts-list-style .inner-content {

  max-width: 420px;

}

.fun-facts-list-style .inner-content .title {

  color: var(--color-white);

  margin-bottom: 10px;

}

.fun-facts-list-style .inner-content .title-1 {

  color: var(--color-white);

}

.fun-facts-list-style .inner-content .desc {

  color: var(--color-white);

}

.fun-facts-list-style:hover {

  transform: scale(1.01);

}



.blog-card-style-one {

  display: flex;

  align-items: center;

  background: #ffffff;

  border-radius: 10px;

  padding: 0 28px;

  gap: 30px;

  box-shadow: 0px 6px 34px rgba(215, 216, 222, 0.41);

  transition: 0.3s;

}

.blog-card-style-one:hover {

  transform: translateY(-5px) scale(1.02);

}

.blog-card-style-one .image-area {

  flex-basis: 50%;

  position: relative;

  z-index: 1;

  overflow: hidden;

  border-radius: 5px;

  top: 30px;

}

@media only screen and (max-width: 991px) {

  .blog-card-style-one .image-area {

    width: 100%;

  }

}

.blog-card-style-one .image-area a {

  display: block;

  width: 100%;

}

.blog-card-style-one .image-area span {

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  border-radius: 3px 0;

  line-height: 1;

  padding: 7px 18px;

  color: var(--color-white);

  font-family: var(--font-primary);

  font-weight: 600;

  background: var(--color-primary);

}

.blog-card-style-one .content-area {

  flex-basis: 50%;

}

.blog-card-style-one .content-area .text {

  padding-bottom: 20px;

  border-bottom: 1px dashed #e4e4e4;

  margin-bottom: 20px;

}

.blog-card-style-one .content-area .text .blog-meta {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-bottom: 17px;

}

.blog-card-style-one .content-area .text .blog-meta li {

  display: flex;

  gap: 5px;

}

.blog-card-style-one .content-area .text .blog-meta li svg {

  width: 14px;

}

.blog-card-style-one .content-area .text .blog-meta li p {

  font-size: 14px;

  line-height: 1.25;

}

.blog-card-style-one .content-area .text .blog-title {

  margin-bottom: 0;

  font-size: 20px;

  line-height: 1.4;

}



/* Rectangle 157 */

.blog-card-style-two {

  background: var(--color-white);

  box-shadow: 0px 0px 20px 1px rgba(0, 0, 0, 0.06);

  border-radius: 10px;

  position: relative;

  z-index: 1;

  overflow: hidden;

  transition: var(--transition);

  height: 100%;

}

.blog-card-style-two:hover {

  transform: scale(1.02) translateY(-5px);

}

.blog-card-style-two:hover .image-area img {

  transform: scale(105%);

}

.blog-card-style-two .image-area {

  position: relative;

  z-index: 1;

  overflow: hidden;

}

.blog-card-style-two .image-area::before {

  content: "";

  background: #0c1e21;

  position: absolute;

  width: 100%;

  height: 100%;

  bottom: 0;

  inset-inline-start: 0;

  opacity: 0.25;

  pointer-events: none;

  z-index: 1;

}

.blog-card-style-two .image-area img {

  transform: scale(100%);

  transition: var(--transition);

}

.blog-card-style-two .image-area span {

  position: absolute;

  z-index: 1;

  top: 20px;

  right: 30px;

  background: var(--color-white);

  padding: 9px 12px;

  line-height: 1;

  font-weight: 600;

  border-left: 3px solid var(--color-primary);

  border-radius: 5px;

  color: var(--color-primary);

}

.blog-card-style-two .blog-content-area-2 {

  padding: 20px 30px 30px;

}

@media only screen and (max-width: 991px) {

  .blog-card-style-two .blog-content-area-2 {

    padding: 30px;

  }

}

@media only screen and (max-width: 576px) {

  .blog-card-style-two .blog-content-area-2 {

    padding: 30px 11px;

  }

}

.blog-card-style-two.inner .blog-content-area-2 .text .blog-meta li i {

  color: var(--color-primary-2);

}

.blog-card-style-two.inner .blog-content-area-2 .text h6 a:hover {

  color: var(--color-primary-2);

}

.blog-card-style-two.inner .blog-content-area-2 .button-area .text-btn span {

  background: rgba(135, 171, 66, 0.1);

  color: var(--color-primary-2);

}

.blog-card-style-two.inner .blog-content-area-2 .button-area .text-btn:hover {

  color: var(--color-primary-2);

}



.blog-card-text {

  background: var(--color-white);

  box-shadow: 0px 4px 33px rgba(0, 0, 0, 0.07);

  border-radius: 6px;

  transition: 0.3s;

  transition-delay: 0s !important;

}

.blog-card-text.style-minimal {

  height: 100%;

}

.blog-card-text.style-minimal .blog-title {

  margin-top: 30px;

  margin-bottom: 35px;

  font-size: 26px;

  line-height: 1.4;

  font-weight: 700;

}

@media only screen and (max-width: 1199px) {

  .blog-card-text.style-minimal .blog-title {

    font-size: 18px;

    margin-bottom: 25px;

    margin-top: 20px;

  }

}

.blog-card-text:hover {

  transform: scale(1.02);

}

.blog-card-text:not(:last-child) {

  margin-bottom: 30px;

}



.blog-content-area-2 {

  padding: 41px 30px;

  transition: 0.3s;

}

@media only screen and (max-width: 767px) {

  .blog-content-area-2 {

    padding: 25px;

  }

}

@media only screen and (max-width: 576px) {

  .blog-content-area-2 {

    padding: 20px 11px;

  }

}

.blog-content-area-2 .text .blog-meta {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.blog-content-area-2 .text .blog-meta li {

  display: flex;

  align-items: center;

  gap: 10px;

  margin-bottom: 18px;

}

.blog-content-area-2 .text .blog-meta li i {

  color: var(--color-primary);

  opacity: 0.7;

}

.blog-content-area-2 .text .blog-meta li p {

  line-height: 1;

  font-weight: 500;

}

.blog-content-area-2 .text .blog-title {

  line-height: 1.4;

  font-size: 20px;

}

.blog-content-area-2 .button-area .text-btn {

  display: flex;

  align-items: center;

  gap: 10px;

  padding: 0;

  font-family: var(--font-primary);

  font-weight: 600;

  height: auto;

}

.blog-content-area-2 .button-area .text-btn span {

  display: block;

  width: 32px;

  height: 27px;

  line-height: 27px;

  border-radius: 4px;

  text-align: center;

  background: var(--secondary-100);

  color: var(--color-primary);

}

.blog-content-area-2 .button-area .text-btn span i {

  transform: rotate(-45deg);

}



.blog-card-style-three {

  overflow: hidden;

  background: var(--color-white);

  box-shadow: 0px 4px 25px 40px rgba(0, 0, 0, 0.03);

  border-radius: 6px;

  transition: 0.3s;

}

.blog-card-style-three:hover {

  transform: scale(1.01);

}

.blog-card-style-three .image-area a {

  display: block;

  overflow: hidden;

}

.blog-card-style-three .image-area a img {

  transition: 0.5s;

}

.blog-card-style-three:hover .image-area a img {

  transform: scale(1.02);

}

.blog-card-style-three.list {

  display: flex;

  gap: 20px;

  align-items: center;

  transition: 0.3s;

}

@media only screen and (max-width: 991px) {

  .blog-card-style-three.list {

    gap: 0;

  }

}

.blog-card-style-three.list .image-area {

  flex-basis: 36%;

}

.blog-card-style-three.list .blog-content-area-3 {

  padding: 22px 35px 22px 0;

  flex-basis: 74%;

}

@media only screen and (max-width: 991px) {

  .blog-card-style-three.list .blog-content-area-3 {

    padding: 22px 35px 22px 20px;

  }

}

.blog-card-style-three.list .blog-content-area-3 .blog-title {

  margin-bottom: 10px;

  font-size: 20px;

  line-height: 1.4;

}

.blog-card-style-three.list:not(:last-child) {

  margin-bottom: 30px;

}

.blog-card-style-three.list:hover {

  transform: scale(1.02);

}



.blog-content-area-3 {

  padding: 35px;

}

.blog-content-area-3 .blog-title {

  font-size: 24px;

  line-height: 1.4;

}

.blog-content-area-3 .text .blog-meta {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.blog-content-area-3 .text .blog-meta .left,

.blog-content-area-3 .text .blog-meta .right {

  display: flex;

  align-items: center;

  gap: 18px;

}

@media only screen and (max-width: 576px) {

  .blog-content-area-3 .text .blog-meta .left,

  .blog-content-area-3 .text .blog-meta .right {

    gap: 8px;

  }

}

@media only screen and (max-width: 479px) {

  .blog-content-area-3 .text .blog-meta .left,

  .blog-content-area-3 .text .blog-meta .right {

    flex-wrap: wrap;

  }

}

.blog-content-area-3 .text .blog-meta li {

  display: flex;

  align-items: center;

  gap: 6px;

  margin-bottom: 20px;

}

.blog-content-area-3 .text .blog-meta li i {

  opacity: 0.5;

  font-size: 14px;

}

.blog-content-area-3 .text .blog-meta li p {

  line-height: 1;

  font-size: 14px;

  font-weight: 500;

}

.blog-content-area-3 .text .blog-title a {

  color: var(--color-heading-1);

  transition: var(--transition);

}

.blog-content-area-3 .text .blog-title a:hover {

  color: var(--color-primary-2);

}

.blog-content-area-3 .button-area {

  margin-top: 14px;

}

.blog-content-area-3 .button-area .text-btn {

  display: flex;

  align-items: center;

  gap: 10px;

  padding: 0;

  font-family: var(--font-primary);

  font-weight: 600;

  color: var(--color-primary-2);

  display: flex;

  align-items: center;

  position: relative;

  z-index: 1;

  height: auto;

}

.blog-content-area-3 .button-area .text-btn::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 1px;

  background: var(--color-primary-2);

  bottom: -5px;

  left: 0;

  z-index: -1;

}

.blog-content-area-3 .button-area .text-btn i {

  transform: rotate(-45deg);

}

.blog-content-area-3 .button-area .btn-arrow {

  color: var(--color-primary);

}



.blog-card-style-five {

  display: flex;

  align-items: center;

  background: var(--color-white);

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

  border-radius: 10px;

  padding: 28px;

  gap: 30px;

  transition: 0.3s;

}

@media only screen and (max-width: 576px) {

  .blog-card-style-five {

    padding: 15px;

  }

}

.blog-card-style-five:hover {

  transform: scale(1.03);

}

.blog-card-style-five:hover .image-area a img {

  transform: scale(1.15);

}

.blog-card-style-five .image-area {

  flex-basis: 40%;

  position: relative;

  z-index: 1;

  overflow: hidden;

  border-radius: 5px;

}

@media only screen and (max-width: 767px) {

  .blog-card-style-five .image-area {

    flex-basis: 100%;

    width: 100%;

  }

}

.blog-card-style-five .image-area a {

  display: block;

}

.blog-card-style-five .image-area a img {

  transition: 0.5s;

}

@media only screen and (max-width: 767px) {

  .blog-card-style-five .image-area a img {

    width: 100%;

  }

}

.blog-card-style-five .image-area span {

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  border-radius: 5px 0;

  line-height: 1;

  padding: 10px 22px;

  color: var(--color-white);

  font-family: var(--font-primary);

  font-weight: 600;

  background: var(--color-primary);

}

.blog-card-style-five .content-area {

  flex-basis: 60%;

}

.blog-card-style-five .content-area .text {

  padding-bottom: 20px;

  border-bottom: 1px dashed #e4e4e4;

  margin-bottom: 20px;

}

.blog-card-style-five .content-area .text .blog-meta {

  display: flex;

  align-items: center;

  justify-content: start;

  margin-bottom: 17px;

  gap: 26px;

}

@media only screen and (max-width: 767px) {

  .blog-card-style-five .content-area .text .blog-meta {

    gap: 5px;

    align-items: flex-start;

    flex-wrap: wrap;

  }

}

@media only screen and (max-width: 576px) {

  .blog-card-style-five .content-area .text .blog-meta {

    flex-direction: row;

    gap: 25px;

  }

}

.blog-card-style-five .content-area .text .blog-meta li {

  display: flex;

  gap: 7px;

}

.blog-card-style-five .content-area .text .blog-meta li svg {

  width: 12px;

}

.blog-card-style-five .content-area .text .blog-meta li svg path {

  fill: var(--color-primary-2);

}

.blog-card-style-five .content-area .text .blog-meta li p {

  font-size: 14px;

  line-height: 1.25;

}

.blog-card-style-five .content-area .text .blog-title {

  margin-bottom: 0;

  font-size: 20px;

  line-height: 1.5;

}



.blog-card-style-nine {

  display: flex;

  align-items: center;

  background: var(--color-white);

  border-radius: 10px;

  padding: 0 28px;

  gap: 30px;

  box-shadow: 0px 6px 34px rgba(215, 216, 222, 0.41);

  transition: 0.3s;

}

@media only screen and (max-width: 1199px) {

  .blog-card-style-nine {

    gap: 15px;

    padding: 20px;

  }

}

.blog-card-style-nine:hover {

  transform: scale(1.01);

}

.blog-card-style-nine:hover .image-area img {

  transform: scale(1.15);

}

@media only screen and (max-width: 576px) {

  .blog-card-style-nine {

    padding: 20px;

    gap: 30px;

    flex-direction: column;

    align-items: flex-start;

    gap: 30px;

  }

}

.blog-card-style-nine .image-area {

  flex-basis: 50%;

  position: relative;

  z-index: 1;

  overflow: hidden;

  border-radius: 5px;

  top: 30px;

}

@media only screen and (max-width: 1199px) {

  .blog-card-style-nine .image-area {

    top: 0;

  }

}

@media only screen and (max-width: 576px) {

  .blog-card-style-nine .image-area {

    top: 0;

  }

}

.blog-card-style-nine .image-area a {

  display: block;

  overflow: hidden;

}

.blog-card-style-nine .image-area a img {

  transition: 0.4s;

}

@media only screen and (max-width: 576px) {

  .blog-card-style-nine .image-area a img {

    width: 100%;

  }

}

.blog-card-style-nine .content-area {

  flex-basis: 50%;

}

.blog-card-style-nine .content-area .text {

  padding-bottom: 20px;

  border-bottom: 1px dashed #e4e4e4;

  margin-bottom: 20px;

}

.blog-card-style-nine .content-area .text .blog-meta {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-bottom: 17px;

}

@media only screen and (max-width: 576px) {

  .blog-card-style-nine .content-area .text .blog-meta {

    justify-content: flex-start;

    gap: 15px;

  }

}

.blog-card-style-nine .content-area .text .blog-meta li {

  display: flex;

  gap: 5px;

}

.blog-card-style-nine .content-area .text .blog-meta li svg {

  width: 14px;

}

.blog-card-style-nine .content-area .text .blog-meta li p {

  font-size: 14px;

  line-height: 1.25;

}

@media only screen and (max-width: 1199px) {

  .blog-card-style-nine .content-area .text .blog-meta li p {

    font-size: 12px;

  }

}

@media only screen and (max-width: 991px) {

  .blog-card-style-nine .content-area .text .blog-meta li p {

    font-size: 14px;

  }

}

.blog-card-style-nine .content-area .text .blog-title {

  margin-bottom: 0;

  line-height: 1.5;

  font-size: 20px;

}

@media only screen and (max-width: 1199px) {

  .blog-card-style-nine .content-area .text .blog-title {

    line-height: 1.1;

  }

}

@media only screen and (max-width: 991px) {

  .blog-card-style-nine .content-area .text .blog-title {

    line-height: 1.4;

  }

}

.blog-card-style-nine .content-area .text .blog-title a {

  color: var(--color-heading-1);

  font-weight: 600;

  transition: 0.3s;

}

@media only screen and (max-width: 1199px) {

  .blog-card-style-nine .content-area .text .blog-title a {

    font-size: 18px;

  }

}

@media only screen and (max-width: 991px) {

  .blog-card-style-nine .content-area .text .blog-title a {

    font-size: 22px;

  }

}

.blog-card-style-nine .content-area .text .blog-title a:hover {

  color: var(--color-primary);

}



.blog-card-style-shop {

  display: flex;

  align-items: self-start;

  border-radius: 6px;

  padding: 28px;

  gap: 30px;

  flex-direction: column;

  background: var(--color-white);

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

  transition: 0.3s;

}

.blog-card-style-shop:hover {

  transform: translateY(-5px) scale(1.02);

}

.blog-card-style-shop:hover .image-area img {

  transform: scale(1.15);

}

.blog-card-style-shop .image-area {

  flex-basis: 40%;

  position: relative;

  z-index: 1;

  overflow: hidden;

  border-radius: 5px;

  display: block;

}

.blog-card-style-shop .image-area a {

  display: block;

  width: 100%;

}

.blog-card-style-shop .image-area a img {

  width: 100%;

}

.blog-card-style-shop .image-area img {

  transition: 0.5s;

}

.blog-card-style-shop .image-area span {

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  border-radius: 5px 0;

  line-height: 1;

  padding: 10px 22px;

  color: var(--color-white);

  font-family: var(--font-primary);

  font-weight: 600;

  background: var(--color-primary);

}

.blog-card-style-shop .content-area {

  flex-basis: 60%;

}

.blog-card-style-shop .content-area .text {

  margin-bottom: 30px;

}

.blog-card-style-shop .content-area .text .blog-meta {

  display: flex;

  align-items: center;

  justify-content: start;

  margin-bottom: 20px;

  gap: 26px;

}

.blog-card-style-shop .content-area .text .blog-meta li {

  display: flex;

  gap: 5px;

}

.blog-card-style-shop .content-area .text .blog-meta li svg {

  width: 14px;

  opacity: 0.6;

}

.blog-card-style-shop .content-area .text .blog-meta li svg path {

  fill: var(--color-primary-2);

}

.blog-card-style-shop .content-area .text .blog-meta li p {

  font-size: 14px;

  line-height: 1.25;

  font-weight: 500;

}

.blog-card-style-shop .content-area .text .blog-title {

  margin-bottom: 0;

  font-weight: 700;

  padding-top: 20px;

  border-top: 1px solid #efefef;

  line-height: 1.4;

  font-size: 24px;

}

@media only screen and (max-width: 767px) {

  .blog-card-style-shop .content-area .text .blog-title {

    font-size: 20px;

  }

}

@media only screen and (max-width: 576px) {

  .blog-card-style-shop .content-area .text .blog-title {

    font-size: 20px;

  }

}

.blog-card-style-shop .content-area .text .blog-title:hover a {

  color: var(--color-primary-2);

}

.blog-card-style-shop .content-area .button-area .tmp-btn::after {

  background: var(--color-primary-2);

}

.blog-card-style-shop.list {

  flex-direction: row;

  align-items: center;

  padding: 20px;

}

.blog-card-style-shop.list:first-child {

  margin-bottom: 20px;

}



.tmp-blog-area.area-3 .blog-title-area .button-area {

  position: relative;

  z-index: 1;

}

.tmp-blog-area.area-3 .blog-title-area .button-area::after {

  content: "";

  position: absolute;

  width: 100px;

  height: 100px;

  border-radius: 50%;

  background: #f4f4f4;

  top: 50%;

  transform: translateY(-50%);

  left: -50px;

  z-index: -1;

}

.tmp-blog-area.area-3 .blog-title-area .button-area a {

  font-size: 16px;

  font-weight: 600;

  color: var(--color-heading-1);

  padding: 0;

  font-family: var(--font-primary);

  display: flex;

  align-items: center;

  gap: 5px;

}



.blog-card-style-four {

  overflow: hidden;

}

.blog-card-style-four.list {

  padding: 20px;

  border-radius: 6px;

  display: flex;

  gap: 30px;

  background: var(--color-white);

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

  align-items: center;

  transition: 0.3s;

}

@media only screen and (max-width: 991px) {

  .blog-card-style-four.list {

    align-items: flex-start;

  }

}

.blog-card-style-four.list .image-area {

  display: block;

  overflow: hidden;

  border-radius: 6px;

  position: relative;

}

.blog-card-style-four.list .image-area a {

  display: block;

  overflow: hidden;

  border-radius: 6px;

  position: relative;

}

.blog-card-style-four.list .image-area a img {

  transition: 0.5s;

}

.blog-card-style-four.list .image-area .tag {

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  border-radius: 3px 0;

  line-height: 1;

  padding: 7px 18px;

  color: var(--color-white);

  font-family: var(--font-primary);

  font-weight: 600;

  background: var(--color-primary);

  z-index: 10;

}

.blog-card-style-four.list:hover {

  transform: scale(1.02);

}

.blog-card-style-four.list:hover .image-area a img {

  transform: scale(1.02);

}

.blog-card-style-four.list .blog-content-area-3 {

  max-width: 545px;

  padding: 0;

}

@media (max-width: 768px) {

  .blog-card-style-four.list .blog-content-area-3 {

    max-width: 97%;

  }

}

.blog-card-style-four.list .blog-content-area-3 .blog-title {

  margin-bottom: 15px;

  font-size: 23px;

  line-height: 32px;

}

.blog-card-style-four.list .blog-content-area-3 .text-btn {

  color: var(--color-body);

}

.blog-card-style-four.list .blog-content-area-3 .text-btn i {

  transform: rotate(-45deg);

  font-size: 14px;

}

.blog-card-style-four.list:not(:last-child) {

  margin-bottom: 30px;

}



.cg-0 {

  color: var(--color-primary-2) !important;

}



.bg-low {

  background: var(--primary-50) !important;

}



.tmp-blog-details-area .left-content-area {

  padding: 30px;

  box-shadow: var(--shadow-1);

  border-radius: 6px;

  background: var(--color-white);

}

@media only screen and (max-width: 767px) {

  .tmp-blog-details-area .left-content-area {

    padding: 20px;

  }

}

.tmp-blog-details-area .left-content-area .top-area {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.tmp-blog-details-area .left-content-area .top-area .blog-meta ul {

  display: flex;

  align-items: center;

  gap: 20px;

}

@media only screen and (max-width: 576px) {

  .tmp-blog-details-area .left-content-area .top-area .blog-meta ul {

    flex-wrap: wrap;

  }

}

.tmp-blog-details-area .left-content-area .top-area .blog-meta ul li {

  display: flex;

  align-items: center;

  gap: 7px;

  color: var(--color-body-2);

  font-weight: 500;

}

.tmp-blog-details-area .left-content-area .top-area .blog-meta ul li i {

  color: var(--color-primary-2);

  opacity: 0.6;

  font-size: 12px;

}

.tmp-blog-details-area .left-content-area .top-area .right {

  display: flex;

  align-items: center;

  gap: 10px;

}

.tmp-blog-details-area .left-content-area .top-area .right .tag {

  display: flex;

  align-items: center;

  gap: 10px;

  font-size: 16px;

  color: var(--color-heading-1);

  font-family: var(--font-primary);

  font-weight: 600;

  padding: 10px 20px;

  border-radius: 4px;

  background: var(--color-white);

  box-shadow: var(--shadow-1);

}

.tmp-blog-details-area .left-content-area .top-area .right .tag svg {

  opacity: 1;

  max-width: 18px;

  height: auto;

}

.tmp-blog-details-area .left-content-area .top-area .right .social {

  box-shadow: var(--shadow-1);

  background: var(--color-white);

  border-radius: 4px;

  padding: 11px 16px;

  display: block;

  font-weight: 600;

  color: var(--color-primary);

  transition: 0.3s;

}

.tmp-blog-details-area .left-content-area .top-area .right .social svg {

  max-width: 16px;

}

.tmp-blog-details-area .left-content-area .top-area .right .social path {

  transition: 0.3s;

}

.tmp-blog-details-area .left-content-area .top-area .right .social:hover {

  background: var(--color-primary);

}

.tmp-blog-details-area .left-content-area .top-area .right .social:hover path {

  fill: var(--color-white);

}

.tmp-blog-details-area .left-content-area .with-dot {

  line-height: 1;

  position: relative;

  z-index: 1;

  padding-left: 30px;

}

.tmp-blog-details-area .left-content-area .with-dot::after {

  content: "";

  position: absolute;

  z-index: 1;

  width: 20px;

  height: 20px;

  border-radius: 50%;

  background: var(--primary-100);

  left: 0;

  top: 50%;

  transform: translateY(-50%);

}

.tmp-blog-details-area .left-content-area .with-dot::before {

  content: "";

  position: absolute;

  width: 10px;

  height: 10px;

  border-radius: 50%;

  background: var(--color-primary);

  top: 50%;

  left: 5px;

  z-index: 2;

  transform: translateY(-50%);

}

.tmp-blog-details-area .left-content-area .quote-area {

  padding: 30px;

  border-radius: 6px;

  background: rgb(255, 255, 255);

  display: flex;

  gap: 23px;

  box-shadow: var(--shadow-1);

}

.tmp-blog-details-area .left-content-area .quote-area .quote-icon {

  min-width: 67px;

}

.tmp-blog-details-area .left-content-area .quote-area .quote-icon img {

  filter: grayscale(1);

  opacity: 0.2;

}

.tmp-blog-details-area .left-content-area .quote-area .text {

  max-width: 646px;

}

.tmp-blog-details-area .left-content-area .quote-area .text h4 {

  font-size: 28px;

  line-height: 36px;

  margin-bottom: 10px;

}

.tmp-blog-details-area .left-content-area .solution-area .desc {

  font-size: 19px;

  line-height: 30px;

  margin-bottom: 20px;

}

.tmp-blog-details-area .left-content-area .solution-area ul {

  display: flex;

  flex-direction: column;

  gap: 10px;

}

.tmp-blog-details-area .left-content-area .solution-area ul li {

  display: flex;

  align-items: center;

  gap: 10px;

}

.tmp-blog-details-area .left-content-area .tags-area {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.tmp-blog-details-area .left-content-area .tags-area .left {

  display: flex;

  align-items: center;

  gap: 20px;

}

.tmp-blog-details-area .left-content-area .tags-area .left h6 {

  line-height: 1;

  margin-bottom: 0;

}

.tmp-blog-details-area .left-content-area .tags-area .left ul {

  display: flex;

  align-items: center;

  gap: 10px;

}

.tmp-blog-details-area .left-content-area .tags-area .left ul li a {

  display: block;

  line-height: 1;

  font-size: 14px;

  border: 1px solid #e4e4e4;

  border-radius: 50px;

  padding: 9px 25px 8px;

  color: var(--color-body-2);

  transition: var(--transition);

}

.tmp-blog-details-area .left-content-area .tags-area .left ul li a:hover {

  color: var(--color-white);

  background: var(--color-primary-2);

  border: 1px solid var(--color-primary-2);

}

.tmp-blog-details-area .left-content-area .tags-area .right a {

  display: block;

  line-height: 1;

  font-size: 14px;

  border: 1px solid #e4e4e4;

  border-radius: 50px;

  padding: 9px 25px 8px;

  color: var(--color-body-2);

  transition: var(--transition);

}

.tmp-blog-details-area .left-content-area .tags-area .right a:hover {

  color: var(--color-white);

  background: var(--color-primary-2);

  border: 1px solid var(--color-primary-2);

}

.tmp-blog-details-area .left-content-area .tags-area .right a:hover svg path {

  fill: var(--color-white);

}

.tmp-blog-details-area .left-content-area .tags-area .right a svg path {

  fill: var(--color-primary-2);

  transition: var(--transition);

}

.tmp-blog-details-area .left-content-area .author-area {

  display: flex;

  align-items: center;

  background: #ffffff;

  box-shadow: var(--shadow-1);

  border-radius: 10px;

  gap: 28px;

  overflow: hidden;

}

.tmp-blog-details-area .left-content-area .author-area .content {

  max-width: 450px;

}

.tmp-blog-details-area .left-content-area .author-area .content .title {

  margin-bottom: 10px;

}

.tmp-blog-details-area .left-content-area .author-area .content .desc {

  margin-bottom: 20px;

  color: var(--color-body-2);

}

.tmp-blog-details-area .left-content-area .author-area .content .social {

  display: flex;

  align-items: center;

  gap: 5px;

}

.tmp-blog-details-area .left-content-area .author-area .content .social li a {

  width: 40px;

  height: 40px;

  line-height: 42px;

  text-align: center;

  display: block;

  color: var(--color-primary-2);

  background: transparent;

  border-radius: 50%;

  border: 1px solid var(--color-border);

  transition: var(--transition);

}

.tmp-blog-details-area .left-content-area .author-area .content .social li a:hover {

  color: var(--color-white);

  background: var(--color-primary-2);

  border: 1px solid var(--color-primary-2);

}

.tmp-blog-details-area .left-content-area .prev-next-post {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.tmp-blog-details-area .left-content-area .prev-next-post .post a {

  font-weight: 600;

  font-family: var(--font-primary);

  display: flex;

  gap: 7px;

}

.tmp-blog-details-area .left-content-area .prev-next-post .post a i {

  color: var(--color-primary-2);

  transform: rotate(-45deg);

  font-weight: 400;

  margin-top: 4px;

}

.tmp-blog-details-area .left-content-area .prev-next-post .post.next {

  text-align: end;

}

.tmp-blog-details-area .left-content-area .prev-next-post .post.next a {

  justify-content: end;

}

.tmp-blog-details-area .right-sidebar .single-wrapper {

  background: var(--color-white);

  box-shadow: var(--shadow-1);

  padding: 40px 30px;

  border-radius: 6px;

}

@media only screen and (max-width: 576px) {

  .tmp-blog-details-area .right-sidebar .single-wrapper {

    padding: 25px 20px;

  }

}

.tmp-blog-details-area .right-sidebar .single-wrapper h4 {

  font-size: 24px;

}

.tmp-blog-details-area .right-sidebar .single-wrapper ul {

  display: flex;

  flex-direction: column;

  gap: 10px;

}

.tmp-blog-details-area .right-sidebar .single-wrapper ul li a {

  display: flex;

  align-items: center;

  justify-content: space-between;

  line-height: 1;

  background: var(--color-white);

  border-radius: 4px;

  padding: 18px 20px;

  font-size: 16px;

  font-weight: 600;

  font-family: var(--font-primary);

  transition: var(--transition);

  color: var(--color-heading-1);

  box-shadow: var(--shadow-1);

}

.tmp-blog-details-area .right-sidebar .single-wrapper ul li a:hover {

  color: var(--color-primary-2);

  transform: scale(1.02);

}

.tmp-blog-details-area .right-sidebar .single-wrapper ul li a:hover span {

  color: var(--color-primary-2);

}

.tmp-blog-details-area .right-sidebar .single-wrapper ul li a:hover span i {

  opacity: 1;

}

.tmp-blog-details-area .right-sidebar .single-wrapper ul li a span {

  color: var(--color-heading-1);

  transition: var(--transition);

}

.tmp-blog-details-area .right-sidebar .single-wrapper ul li a span i {

  opacity: 0.3;

  color: var(--color-primary);

  transition: var(--transition);

}

.tmp-blog-details-area .right-sidebar .single-wrapper .content {

  display: flex;

  align-items: center;

  gap: 15px;

}

.tmp-blog-details-area .right-sidebar .single-wrapper .content .icon a {

  display: block;

  background: var(--color-white);

  color: var(--color-primary-2);

  font-size: 30px;

  width: 60px;

  height: 60px;

  line-height: 63px;

  border-radius: 50%;

  text-align: center;

}

.tmp-blog-details-area .right-sidebar .single-wrapper .content .text .title {

  font-size: 24px;

  line-height: 1;

  color: #717580;

  font-weight: 400;

  margin-bottom: 20px;

}

.tmp-blog-details-area .right-sidebar .single-wrapper .content .text a {

  color: var(--color-primary-2);

  font-weight: 600;

  font-family: var(--font-primary);

  font-size: 30px;

}

.tmp-blog-details-area .right-sidebar .single-wrapper .single-input-wrapper {

  position: relative;

  z-index: 1;

}

.tmp-blog-details-area .right-sidebar .single-wrapper .single-input-wrapper input {

  padding: 11px 20px;

  background: var(--color-white);

  border-radius: 4px;

  border: 1px solid var(--color-border);

}

.tmp-blog-details-area .right-sidebar .single-wrapper .single-input-wrapper input:focus {

  border: 1px solid var(--color-primary);

}

.tmp-blog-details-area .right-sidebar .single-wrapper .single-input-wrapper button {

  position: absolute;

  z-index: 1;

  top: 50%;

  transform: translateY(-50%);

  right: 20px;

  max-width: max-content;

  border: none;

  padding: 0;

}

.tmp-blog-details-area .right-sidebar .single-wrapper .blog-wrapper {

  display: flex;

  gap: 15px;

  margin-bottom: 20px;

}

.tmp-blog-details-area .right-sidebar .single-wrapper .blog-wrapper .blog-content {

  flex-basis: 65%;

}

.tmp-blog-details-area .right-sidebar .single-wrapper .blog-wrapper .blog-content p {

  margin-bottom: 5px;

  font-size: 14px;

}

.tmp-blog-details-area .right-sidebar .single-wrapper .blog-wrapper .blog-content p i {

  opacity: 0.7;

  color: var(--color-primary);

}

.tmp-blog-details-area .right-sidebar .single-wrapper .blog-wrapper .blog-content .h6 {

  font-size: 16px;

  line-height: 24px;

  margin-bottom: 0;

}

.tmp-blog-details-area .right-sidebar .single-wrapper .blog-wrapper .blog-content .h6 a {

  color: var(--color-heading-1);

}

.tmp-blog-details-area .right-sidebar .single-wrapper .blog-wrapper .blog-content .h6 a:hover {

  color: var(--color-primary-2);

}

.tmp-blog-details-area .right-sidebar .single-wrapper.tag-area ul {

  display: flex;

  align-items: center;

  flex-wrap: wrap;

  flex-direction: row;

}

.tmp-blog-details-area .right-sidebar .single-wrapper.tag-area ul li a {

  max-width: max-content;

  background: #ffffff;

  box-shadow: none;

  border: 1px solid var(--color-border);

  border-radius: 3px;

  padding: 8px 18px;

  font-size: 14px;

  font-family: var(--font-secondary);

  font-weight: 400;

}

.tmp-blog-details-area .right-sidebar .service-card {

  padding: 40px 0;

  background: rgba(135, 171, 66, 0.1);

  border-radius: 10px;

}

.tmp-blog-details-area .right-sidebar .service-card .logo {

  padding: 0 30px;

  margin-bottom: 20px;

  display: block;

}

.tmp-blog-details-area .right-sidebar .service-card .image-area {

  margin-bottom: 30px;

}

.tmp-blog-details-area .right-sidebar .service-card .content-area {

  padding: 0 30px;

}

.tmp-blog-details-area .right-sidebar .service-card .content-area h6 {

  margin-bottom: 10px;

}



.comment-area.fluid-comment {

  background: var(--color-white);

  box-shadow: var(--shadow-1);

  padding: 40px 30px;

  border-radius: 6px;

  margin-left: 110px;

  margin-right: 110px;

}

@media only screen and (max-width: 991px) {

  .comment-area.fluid-comment {

    margin-left: 0;

    margin-right: 0px;

    padding: 25px;

  }

}

.comment-area.fluid-comment .title-1 {

  display: flex;

  justify-content: center;

}

.comment-area.fluid-comment .comment-wrapper {

  justify-content: center;

}

.comment-area.fluid-comment .comment-wrapper .image img {

  border-radius: 10px;

  border: 3px solid var(--color-border);

  box-shadow: var(--shadow-1);

}

.comment-area.fluid-comment .comment-wrapper .content {

  max-width: 100%;

}

.comment-area .comment-wrapper {

  display: flex;

  gap: 30px;

  padding-bottom: 25px;

  margin-bottom: 25px;

  border-bottom: 1px dashed #E7E7E7;

}

@media only screen and (max-width: 576px) {

  .comment-area .comment-wrapper {

    flex-direction: column;

    gap: 15px;

  }

}

.comment-area .comment-wrapper:last-child {

  padding-bottom: 0;

  margin-bottom: 0;

  border: none;

}

.comment-area .comment-wrapper .content {

  max-width: 463px;

}

.comment-area .comment-wrapper .content .title {

  font-size: 16px;

  line-height: 1;

  margin-bottom: 10px;

}

.comment-area .comment-wrapper .content .title span {

  font-family: var(--font-secondary);

  font-weight: 400;

  color: var(--color-body);

  font-size: 12px;

  margin-left: 0;

  display: block;

  margin-top: 7px;

}

.comment-area .comment-wrapper .content .desc {

  margin-bottom: 10px;

  padding-right: 10%;

}

@media only screen and (max-width: 767px) {

  .comment-area .comment-wrapper .content .desc {

    padding-right: 0;

  }

}

.comment-area .comment-wrapper .content .tmp-btn {

  padding: 8px 9px;

  font-size: 14px;

  font-family: var(--font-primary);

  height: auto;

  display: flex;

  align-items: center;

  gap: 4px;

  border-radius: 2px;

}

.comment-area .comment-wrapper .content .tmp-btn i {

  font-size: 10px;

}

.comment-area .comment-wrapper.two {

  margin-left: 50px;

}

@media only screen and (max-width: 576px) {

  .comment-area .comment-wrapper.two {

    margin-left: 0;

  }

}



.comment-form-area {

  background: var(--color-white);

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

  border-radius: 6px;

  padding: 30px;

}

.comment-form-area.fluid-comment {

  padding: 40px 30px;

  border-radius: 6px;

  margin-left: 110px;

  margin-right: 110px;

}

@media only screen and (max-width: 991px) {

  .comment-form-area.fluid-comment {

    margin-left: 0;

    margin-right: 0;

  }

}

@media only screen and (max-width: 576px) {

  .comment-form-area.fluid-comment {

    padding: 25px;

  }

}

.comment-form-area .comment-form .single-wrapper input,

.comment-form-area .comment-form .single-wrapper textarea {

  border: 1px solid var(--color-border);

  padding: 13px 25px;

  border-radius: 6px;

}

.comment-form-area .comment-form .single-wrapper input:focus,

.comment-form-area .comment-form .single-wrapper textarea:focus {

  border: 1px solid var(--color-primary);

}

.comment-form-area .comment-form .single-wrapper textarea {

  min-height: 122px;

}

.comment-form-area .comment-form .single-wrapper button {

  border: none;

}



.sticky-top {

  z-index: 30 !important;

}



.container-blog-standard {

  max-width: 1085px;

  margin-left: auto;

  margin-right: auto;

}

@media only screen and (max-width: 1199px) {

  .container-blog-standard {

    max-width: 95%;

  }

}

@media only screen and (max-width: 576px) {

  .container-blog-standard {

    max-width: 100%;

  }

}



.blog-standard-bg-image {

  background-image: url(../images/bg/blog-breadcrumb.webp);

  padding-top: 120px;

  position: relative;

  z-index: 1;

}

.blog-standard-bg-image::after {

  position: absolute;

  left: 0;

  top: 0;

  height: 100%;

  width: 100%;

  content: "";

  background: var(--color-primary);

  mix-blend-mode: multiply;

  z-index: -1;

}



.bg-gradient-s-bd {

  padding-top: 120px;

  background: linear-gradient(0deg, #ffffff 0%, #E9F1FC 100%);

}

@media only screen and (max-width: 576px) {

  .bg-gradient-s-bd {

    padding-top: 75px;

  }

}



.breadcrumb-inner-standard {

  padding: 44px 140px 50px;

  background: #fff;

  border-radius: 6px 6px 0 0;

}

@media only screen and (max-width: 991px) {

  .breadcrumb-inner-standard {

    padding: 45px 70px;

  }

}

@media only screen and (max-width: 767px) {

  .breadcrumb-inner-standard {

    padding: 40px;

  }

}

@media only screen and (max-width: 576px) {

  .breadcrumb-inner-standard {

    padding: 30px 25px;

  }

}

@media only screen and (max-width: 479px) {

  .breadcrumb-inner-standard {

    padding: 30px 15px;

  }

}

.breadcrumb-inner-standard .breadcrumb-content-top .meta-list {

  display: flex;

  align-items: center;

  gap: 10px;

}

@media only screen and (max-width: 576px) {

  .breadcrumb-inner-standard .breadcrumb-content-top .meta-list {

    flex-wrap: wrap;

    flex-direction: column;

  }

}

.breadcrumb-inner-standard .breadcrumb-content-top .meta-list .list-item {

  display: flex;

  align-items: center;

  gap: 8px;

  padding: 10px;

}

@media only screen and (max-width: 576px) {

  .breadcrumb-inner-standard .breadcrumb-content-top .meta-list .list-item {

    padding: 0;

  }

}

.breadcrumb-inner-standard .breadcrumb-content-top .meta-list .list-item a {

  color: var(--color-heading-1);

}

.breadcrumb-inner-standard .breadcrumb-content-top .meta-list .list-item a strong {

  font-weight: 400;

}

.breadcrumb-inner-standard .breadcrumb-content-top .meta-list .list-item .author-thumbnail {

  max-width: 45px;

  border: 3px solid var(--color-border);

  box-shadow: var(--shadow-1);

  border-radius: 50%;

  overflow: hidden;

}

.breadcrumb-inner-standard h1.title {

  font-size: 42px;

  line-height: 1.19;

  font-weight: 700;

}

@media only screen and (max-width: 991px) {

  .breadcrumb-inner-standard h1.title {

    font-size: 36px;

  }

}

@media only screen and (max-width: 767px) {

  .breadcrumb-inner-standard h1.title br {

    display: none;

  }

}

@media only screen and (max-width: 576px) {

  .breadcrumb-inner-standard h1.title {

    font-size: 26px;

    line-height: 1.4;

  }

}



.thumbnail-quote-area-blog {

  padding: 40px 40px 40px 100px;

  position: relative;

  font-size: 24px;

  line-height: 1.4;

  background: transparent;

  border-radius: 0;

  font-weight: 500;

  z-index: 1;

  background-color: #efefef;

}

@media only screen and (max-width: 576px) {

  .thumbnail-quote-area-blog {

    padding: 25px;

  }

}

.thumbnail-quote-area-blog blockquote {

  margin: 0;

}

.thumbnail-quote-area-blog blockquote p {

  font-style: normal;

  font-size: 24px;

  line-height: 1.4;

  font-weight: 400;

  color: var(--color-heading-1);

}

.thumbnail-quote-area-blog blockquote::before {

  position: absolute;

  content: "";

  top: 40px;

  left: 30px;

  z-index: -1;

  background-image: url(../images/blog/details/quote.svg);

  background-repeat: no-repeat, repeat;

  width: 52px;

  height: 44px;

  transform: rotate(180deg);

  filter: grayscale(1);

}



.blog-details-standard-area-body .blog-details-body-content {

  box-shadow: 0px 6px 34px rgba(215, 216, 222, 0.41);

  background: var(--color-white);

}

.blog-details-standard-area-body .blog-details-body-content .preview-slider-image-wrapper .large-gallery-slider {

  border-radius: 0;

}

.blog-details-standard-area-body .blog-details-body-content figure {

  text-align: center;

  margin-top: 10px;

  font-size: 14px;

  letter-spacing: 0.5px;

  font-weight: 400;

}

.blog-details-standard-area-body .with-padding-content {

  padding: 30px 100px;

  background: var(--color-white);

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .blog-details-standard-area-body .with-padding-content {

    padding: 30px 50px;

  }

}

@media only screen and (max-width: 767px) {

  .blog-details-standard-area-body .with-padding-content {

    padding: 30px 20px;

  }

}

.blog-details-standard-area-body .with-padding-content p {

  margin-bottom: 25px;

}

.blog-details-standard-area-body .with-padding-content blockquote {

  padding: 40px 40px 40px 100px;

  position: relative;

  font-size: 24px;

  line-height: 1.4;

  background: transparent;

  border-radius: 5px;

  margin: 30px 0;

  font-weight: 500;

  color: var(--color-heading-1);

  z-index: 1;

  box-shadow: var(--shadow-1);

}

@media only screen and (max-width: 576px) {

  .blog-details-standard-area-body .with-padding-content blockquote {

    padding: 25px;

  }

}

.blog-details-standard-area-body .with-padding-content blockquote p {

  margin-bottom: 0;

  font-style: normal;

  font-size: 24px;

  line-height: 1.4;

  font-weight: 500;

  color: var(--color-heading-1);

}

@media only screen and (max-width: 576px) {

  .blog-details-standard-area-body .with-padding-content blockquote p {

    font-size: 18px;

  }

}

.blog-details-standard-area-body .with-padding-content blockquote cite {

  margin-top: 10px;

  font-size: 16px;

  color: var(--color-body);

}

.blog-details-standard-area-body .with-padding-content blockquote::before {

  position: absolute;

  content: "";

  top: 40px;

  left: 30px;

  z-index: -1;

  background-image: url(../images/blog/details/quote.svg);

  background-repeat: no-repeat, repeat;

  width: 52px;

  height: 44px;

  transform: rotate(180deg);

  filter: grayscale(1);

}

.blog-details-standard-area-body .with-padding-content .with-dot {

  line-height: 1;

  position: relative;

  z-index: 1;

}



.tag-wraper-details {

  margin: -5px;

  display: flex;

  flex-wrap: wrap;

  margin-bottom: 30px;

}

.tag-wraper-details a {

  border: 1px solid var(--color-border);

  font-size: 14px;

  color: var(--color-body);

  height: 30px;

  padding: 0 10px;

  margin: 5px;

  display: inline-block;

  line-height: 27px;

  border-radius: 4px;

}

.tag-wraper-details a:hover {

  background-color: var(--color-primary);

  color: #ffffff;

  border-color: var(--color-primary);

}



.social-share-details-block {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

@media only screen and (max-width: 576px) {

  .social-share-details-block {

    flex-wrap: wrap;

    gap: 15px;

    align-items: flex-start;

  }

}

.social-share-details-block .post-like a {

  display: flex;

  align-items: center;

}

.social-share-details-block .post-like a i {

  width: 40px;

  height: 40px;

  line-height: 34px;

  border: 2px solid var(--color-border);

  color: var(--color-body);

  border-radius: 100%;

  text-align: center;

  margin-right: 20px;

  transition: 0.3s;

  position: relative;

  z-index: 1;

}

.social-share-details-block .post-like a i::after {

  position: absolute;

  z-index: -1;

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%) scale(0.2);

  background: var(--color-primary);

  content: "";

  opacity: 0;

  height: 100%;

  width: 100%;

  transition: 0.3s;

  border-radius: 50%;

}

.social-share-details-block .post-like:hover a i {

  color: var(--color-white);

  border-color: transparent;

}

.social-share-details-block .post-like:hover a i::after {

  opacity: 1;

  transform: translate(-50%, -50%) scale(1);

}

.social-share-details-block .social-share-wrapper-1 .social-stylle-one li a {

  width: 40px;

  height: 40px;

  display: flex;

  align-items: center;

  justify-content: center;

}



.author-area-quote {

  display: flex;

  align-items: center;

  background: #ffffff;

  box-shadow: var(--shadow-1);

  border-radius: 6px;

  gap: 28px;

  overflow: hidden;

  transition: 0.3s;

}

@media only screen and (max-width: 767px) {

  .author-area-quote {

    flex-wrap: wrap;

    padding: 15px;

  }

  .author-area-quote .image {

    width: 100%;

  }

  .author-area-quote .image img {

    width: 100%;

  }

}

.author-area-quote:hover {

  transform: scale(1.02);

}

.author-area-quote .content {

  max-width: 450px;

}

.author-area-quote .content .title {

  margin-bottom: 10px;

}

.author-area-quote .content .desc {

  margin-bottom: 20px;

  color: var(--color-body-2);

}

.author-area-quote .content .social-share-wrapper-1 .social-stylle-one li a {

  height: 40px;

  width: 40px;

  display: flex;

  align-items: center;

  justify-content: center;

}

.author-area-quote .content .social {

  display: flex;

  align-items: center;

  gap: 5px;

}

.author-area-quote .content .social li a {

  width: 40px;

  height: 40px;

  line-height: 42px;

  text-align: center;

  display: block;

  color: var(--color-primary-2);

  background: transparent;

  border-radius: 50%;

  border: 1px solid var(--color-border);

  transition: var(--transition);

}

.author-area-quote .content .social li a:hover {

  color: var(--color-white);

  background: var(--color-primary-2);

  border: 1px solid var(--color-primary-2);

}



.blog-details-with-sidebar .comment-area .comment-wrapper .content {

  max-width: 100%;

}

.blog-details-with-sidebar .comment-form-area {

  padding: 0;

  margin: 0;

  box-shadow: none;

  border: none;

}

.blog-details-with-sidebar figure {

  text-align: center;

  margin-top: 10px;

  font-size: 14px;

  letter-spacing: 0.5px;

  font-weight: 400;

}



.social-share-modal .modal-header {

  border-bottom: none;

  padding: 0;

}

.social-share-modal .modal-header .btn-close {

  position: absolute;

  right: -16px;

  z-index: 99;

  background-color: var(--color-white);

  background: var(--color-white);

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

  height: 35px;

  width: 35px;

  border-radius: 50%;

  top: -16px;

  opacity: 1;

  z-index: 1;

}

.social-share-modal .modal-header .btn-close::after {

  position: absolute;

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%) scale(0.2);

  content: "";

  width: 100%;

  height: 100%;

  background: var(--color-primary);

  opacity: 0;

  z-index: -1;

  border-radius: 50%;

  transition: 0.3s;

}

.social-share-modal .modal-header .btn-close:hover::after {

  transform: translate(-50%, -50%) scale(1);

  opacity: 1;

}

.social-share-modal .modal-header .btn-close:hover i {

  color: #fff;

}

.social-share-modal .modal-header .btn-close i {

  font-size: 22px;

  color: var(--color-heading-1);

  transition: 0.3s;

}

.social-share-modal .social-share-wrapper-1 .social-stylle-one {

  justify-content: center !important;

}

.social-share-modal .modal-body {

  padding: 45px 30px;

}



.dark-overlay {

  position: relative;

  z-index: 1;

}

.dark-overlay::before {

  content: "";

  background: #0c1e21;

  position: absolute;

  width: 100%;

  height: 100%;

  bottom: 0;

  inset-inline-start: 0;

  opacity: 0.25;

  pointer-events: none;

  z-index: 1;

  transition: 0.3s;

}



.blog-image-style {

  position: relative;

  height: 100%;

  border-radius: 12px;

  overflow: hidden;

}

.blog-image-style::before {

  content: "";

  background: linear-gradient(0deg, rgb(12, 30, 33) 0%, rgba(12, 30, 33, 0) 100%);

  position: absolute;

  width: 100%;

  height: 100%;

  top: 0;

  inset-inline-start: 0;

  opacity: 1;

  z-index: 1;

  pointer-events: none;

}

.blog-image-style .thumbnail img {

  transition: 0.3s;

}

.blog-image-style .inner-content {

  position: absolute;

  inset-inline-start: 0;

  bottom: 0;

  width: 100%;

  height: auto;

  padding: 28px;

  z-index: 3;

  overflow: hidden;

  -webkit-transition: all 0.3s ease-in-out;

  transition: all 0.3s ease-in-out;

  background-color: transparent;

}

@media only screen and (max-width: 576px) {

  .blog-image-style .inner-content {

    padding: 15px;

  }

}

.blog-image-style .inner-content .blog-meta {

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  -ms-flex-wrap: wrap;

  flex-wrap: wrap;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  gap: 10px;

  margin-bottom: 18px;

}

.blog-image-style .inner-content .blog-meta span {

  color: #ffffff;

}

.blog-image-style .inner-content .blog-meta span.author-name a {

  color: var(--color-white);

}

.blog-image-style .inner-content .blog-meta span.author-name a:hover {

  color: var(--color-white);

}

.blog-image-style .inner-content .blog-meta .categories a {

  background-color: var(--color-primary);

  font-size: 16px;

  line-height: 1;

  color: #fff;

  font-weight: 500;

  padding: 4px 7px 4px 7px;

  display: -webkit-inline-box;

  display: -ms-inline-flexbox;

  display: inline-flex;

  overflow: hidden;

  border-radius: 4px;

  backdrop-filter: blur(15px);

}

.blog-image-style .inner-content .title {

  font-size: 24px;

  line-height: 1.4;

  color: var(--color-white);

  margin-bottom: 13px;

}

@media only screen and (max-width: 576px) {

  .blog-image-style .inner-content .title {

    font-size: 20px;

  }

}

.blog-image-style .inner-content .title:hover a {

  color: var(--color-white);

}

.blog-image-style .news-date {

  position: absolute;

  left: 30px;

  top: 30px;

  display: flex;

  align-items: center;

  gap: 10px;

  padding: 4px 15px;

  background: var(--color-primary);

  border-radius: 4px;

}

.blog-image-style .news-date span {

  font-weight: 500;

  color: var(--color-white);

}

.blog-image-style .news-date span.date {

  font-size: 18px;

}

.blog-image-style:hover .thumbnail img {

  transform: scale(1.04);

}



.blog-show-two-item-active .swiper-pagination-blog-two,

.blog-show-three-item-active .swiper-pagination-blog-two {

  margin: auto;

  max-width: max-content;

  margin-top: 25px;

}

.blog-show-two-item-active .swiper-pagination-blog-two .swiper-pagination-bullet,

.blog-show-three-item-active .swiper-pagination-blog-two .swiper-pagination-bullet {

  background: var(--color-border);

  opacity: 1;

  width: 8px;

  height: 8px;

  transition: var(--transition);

}

.blog-show-two-item-active .swiper-pagination-blog-two .swiper-pagination-bullet-active,

.blog-show-three-item-active .swiper-pagination-blog-two .swiper-pagination-bullet-active {

  background: var(--color-primary-2);

  width: 40px;

  border-radius: 30px;

}



.tmp-case-studies-area .section-title-area {

  margin-bottom: 60px;

}

@media only screen and (max-width: 991px) {

  .tmp-case-studies-area .section-title-area {

    margin-bottom: 40px;

  }

}

.tmp-case-studies-area .section-title-area .pre-title {

  margin-left: auto;

  margin-right: auto;

}

.tmp-case-studies-area .section-title-area .section-title {

  text-align: center;

}

.tmp-case-studies-area .section-inner {

  padding-bottom: 135px;

  position: relative;

  z-index: 1;

}

.tmp-case-studies-area .section-inner .image-area {

  border-radius: 15px;

  overflow: hidden;

  position: relative;

  z-index: 1;

}

.tmp-case-studies-area .section-inner .case-card-area {

  position: absolute;

  z-index: 1;

  bottom: 0;

  left: 50%;

  transform: translateX(-50%);

  background: var(--color-white);

  display: flex;

  box-shadow: 0px 4px 33px rgba(0, 0, 0, 0.07);

  border-radius: 10px;

  max-width: max-content;

  width: max-content;

  overflow: hidden;

}

.tmp-case-studies-area .section-inner .case-card-area .section-title-area {

  padding: 40px;

  margin-bottom: 0;

}

.tmp-case-studies-area .section-inner .case-card-area .section-title-area .pre-title {

  margin-left: 0;

  margin-right: auto;

}

.tmp-case-studies-area .section-inner .case-card-area .section-title-area .section-title {

  text-align: left;

  font-size: 30px;

  line-height: 1.4;

}

@media only screen and (max-width: 991px) {

  .tmp-case-studies-area .section-inner .case-card-area .section-title-area .section-title {

    font-size: 22px;

  }

}

.tmp-case-studies-area .section-inner .case-card-area .section-title-area .text-btn {

  font-weight: 400;

}

.tmp-case-studies-area.area-2 .image-area {

  border-radius: 6px;

}

.tmp-case-studies-area.area-2 .image-area .vedio-icone .popup-video {

  background: var(--color-primary-2);

}

.tmp-case-studies-area.area-2 .image-area .vedio-icone .popup-video::after {

  background: var(--primary-100);

}

.tmp-case-studies-area.area-2 .section-inner .case-card-area {

  border-radius: 5px;

}

.tmp-case-studies-area.area-2 .section-inner .case-card-area .content {

  display: flex;

  align-items: center;

}

.tmp-case-studies-area.area-2 .section-inner .case-card-area .pre-title {

  background: var(--primary-100);

  font-size: 14px;

  padding: 0 14px;

  height: 30px;

  color: var(--color-primary);

  max-width: max-content;

  border-radius: 4px;

  font-family: var(--font-secondary);

  font-weight: 400;

  margin-bottom: 10px;

  display: flex;

  align-items: center;

  justify-content: center;

}

.tmp-case-studies-area.area-2 .section-inner .case-card-area .case-btn-area .case-btn {

  color: var(--color-heading-1);

}



.float-right {

  position: relative;

  min-width: 115%;

  right: 0;

}

@media only screen and (max-width: 576px) {

  .float-right {

    min-width: 100%;

  }

}



.float-right2 {

  position: relative;

  min-width: 120%;

  right: 0;

}

@media only screen and (max-width: 576px) {

  .float-right2 {

    min-width: 100%;

  }

}



.cta-bg-1 {

  padding: 115px 0 245px;

  background: url(../images/cta/cta-bg.webp);

  background-size: cover;

  background-repeat: no-repeat;

  background-position: center center;

  margin: 0 60px;

  border-radius: 6px;

  height: 701px;

  position: relative;

}

@media only screen and (max-width: 576px) {

  .cta-bg-1 {

    height: 430px;

  }

}

.cta-bg-1.inner {

  border-bottom: 5px solid var(--color-primary-2);

}



.cta-wrapper {

  padding: 92px;

  border-radius: 6px 6px 0 0;

  transition: var(--transition);

  overflow: hidden;

  z-index: 1;

  position: absolute;

  bottom: 0;

}

.cta-wrapper.active::after {

  opacity: 0;

}

.cta-wrapper.active::before {

  opacity: 1;

}

.cta-wrapper.active .sub-title,

.cta-wrapper.active .title {

  color: var(--color-white);

}

.cta-wrapper.active .sub-title svg path,

.cta-wrapper.active .title svg path {

  fill: var(--color-white);

}

.cta-wrapper.active .tmp-btn {

  background: var(--color-white);

  color: var(--color-heading-1);

}

.cta-wrapper.active .tmp-btn:hover {

  color: var(--color-white);

}

.cta-wrapper::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  background: #fff;

  top: 0;

  left: 0;

  z-index: -1;

  opacity: 1;

  transition: var(--transition);

}

.cta-wrapper::before {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  background: rgba(255, 112, 41, 0.9);

  top: 0;

  left: 0;

  z-index: -1;

  opacity: 0;

  transition: var(--transition);

}

.cta-wrapper .sub-title {

  transition: var(--transition);

  font-weight: 600;

  font-size: 20px;

  line-height: 1.2;

}

.cta-wrapper .sub-title span {

  position: relative;

  top: 5px;

  left: 5px;

}

.cta-wrapper .title {

  max-width: 453px;

  font-size: 26px;

  line-height: 1.4;

  font-weight: 600;

  transition: var(--transition);

}

.cta-wrapper .tmp-btn {

  transition: var(--transition);

}

.cta-wrapper .cta-shape {

  position: absolute;

  bottom: 0;

  right: 0;

}

.cta-wrapper.two::before {

  background: rgba(135, 171, 66, 0.9);

}

.cta-wrapper.two .sub-title svg path {

  fill: var(--color-primary-2);

}



.cta-area-start-1 {

  background-image: url(../images/cta/07.webp);

  padding: 80px 0;

  position: relative;

  z-index: 1;

  overflow: hidden;

}

.cta-area-start-1::before {

  position: absolute;

  content: "";

  top: -35%;

  left: -35%;

  height: 450px;

  width: 450px;

  border-radius: 50%;

  mix-blend-mode: multiply;

  border: 85px solid var(--color-primary);

}

.cta-area-start-1::after {

  position: absolute;

  content: "";

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  background: rgba(0, 0, 0, 0.3647058824);

  z-index: -1;

}

.cta-area-start-1 .cta-fluid-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

@media only screen and (max-width: 576px) {

  .cta-area-start-1 .cta-fluid-wrapper {

    flex-wrap: wrap;

    gap: 15px;

  }

}

.cta-area-start-1 .cta-fluid-wrapper .title {

  margin-bottom: 0;

  color: var(--color-white);

  font-weight: 700;

  line-height: 1.25;

}

@media only screen and (max-width: 1199px) {

  .cta-area-start-1 .cta-fluid-wrapper .title br {

    display: none;

  }

}



.cta-style-marketing-1 {

  background: var(--color-primary);

  text-align: center;

  position: relative;

}

.cta-style-marketing-1 .curve-right {

  position: absolute;

  right: 0;

  top: 0;

  pointer-events: none;

}

@media only screen and (max-width: 576px) {

  .cta-style-marketing-1 .curve-right {

    display: none;

  }

}

.cta-style-marketing-1 .curve-left {

  position: absolute;

  left: 0;

  transform: scale(-1);

  bottom: 0;

  pointer-events: none;

}

@media only screen and (max-width: 576px) {

  .cta-style-marketing-1 .curve-left {

    display: none;

  }

}

.cta-style-marketing-1 .title {

  font-weight: 700;

  color: var(--color-white);

}

.cta-style-marketing-1 p.desc {

  max-width: 540px;

  margin: auto;

  color: var(--color-white);

}

.cta-style-marketing-1 .tmp-btn.btn-primary {

  background: var(--color-white);

  color: var(--color-heading-1);

  margin: auto;

  margin-top: 35px;

}

.cta-style-marketing-1 .tmp-btn.btn-primary:hover {

  color: var(--color-white);

}



.tmp-team-area .section-title-area {

  margin-bottom: 60px;

}

@media only screen and (max-width: 991px) {

  .tmp-team-area .section-title-area {

    margin-bottom: 40px;

  }

}

.tmp-team-area .section-title-area .pre-title {

  margin-left: auto;

  margin-right: auto;

}

.tmp-team-area .team-wrapper .image-area {

  transition: var(--transition);

  overflow: hidden;

  position: relative;

  z-index: 1;

  border-radius: 5px;

}

.tmp-team-area .team-wrapper .image-area .social-wrapper {

  position: absolute;

  z-index: 1;

  bottom: -10%;

  right: 30px;

  opacity: 0;

  transition: var(--transition);

}

.tmp-team-area .team-wrapper .image-area .social-wrapper ul {

  display: flex;

  flex-direction: column;

  gap: 10px;

}

.tmp-team-area .team-wrapper .image-area .social-wrapper ul li a {

  display: block;

  width: 40px;

  height: 40px;

  display: flex;

  align-items: center;

  justify-content: center;

  background: var(--color-white);

  border-radius: 50%;

  text-align: center;

  color: var(--color-heading-1);

  font-size: 16px;

  transition: var(--transition);

  position: relative;

  z-index: 1;

}

.tmp-team-area .team-wrapper .image-area .social-wrapper ul li a i {

  font-weight: 400;

}

.tmp-team-area .team-wrapper .image-area .social-wrapper ul li a::after {

  position: absolute;

  content: "";

  height: 100%;

  width: 100%;

  transform: translate(-50%, -50%) scale(0.2);

  opacity: 0;

  top: 50%;

  left: 50%;

  background: var(--color-primary);

  transition: 0.3s;

  z-index: -1;

  border-radius: 50%;

}

.tmp-team-area .team-wrapper .image-area .social-wrapper ul li a:hover {

  color: var(--color-white);

}

.tmp-team-area .team-wrapper .image-area .social-wrapper ul li a:hover::after {

  transform: translate(-50%, -50%) scale(1);

  opacity: 1;

}

.tmp-team-area .team-wrapper .image-area img {

  transform: scale(1);

  transition: var(--transition);

}

.tmp-team-area .team-wrapper .image-area:hover img {

  transform: scale(1.05);

}

.tmp-team-area .team-wrapper .content-area {

  margin-top: 20px;

}

.tmp-team-area .team-wrapper .content-area .title {

  font-size: 24px;

  font-weight: 600;

  margin-bottom: 0;

  margin-top: 0;

}

.tmp-team-area .team-wrapper:hover .image-area .social-wrapper {

  bottom: 30px;

  opacity: 1;

}

.tmp-team-area.team-inner .team-wrapper2 {

  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.1);

}



.shadow-1 {

  box-shadow: var(--shadow-1);

}



.tmp-team-area2 {

  background: #f6f6f6;

}



.tmp-team-area3,

.tmp-team-area2 {

  background: rgba(149, 149, 149, 0.1);

}

.tmp-team-area3 .section-inner,

.tmp-team-area2 .section-inner {

  position: relative;

  z-index: 1;

  padding-left: 15px;

  padding-right: 15px;

}

.tmp-team-area3 .section-inner .swiper-btn,

.tmp-team-area2 .section-inner .swiper-btn {

  position: absolute;

  top: 50%;

  transform: translateY(-50%);

  background: var(--color-white);

  width: 55px;

  height: 55px;

  line-height: 54px;

  text-align: center;

  border-radius: 50%;

  font-size: 18px;

  font-weight: 600;

  color: var(--color-heading-1);

  transition: var(--transition);

  z-index: 50;

  opacity: 0;

}

@media only screen and (max-width: 991px) {

  .tmp-team-area3 .section-inner .swiper-btn,

  .tmp-team-area2 .section-inner .swiper-btn {

    height: 60px;

    width: 60px;

    line-height: 60px;

  }

  .tmp-team-area3 .section-inner .swiper-btn i,

  .tmp-team-area2 .section-inner .swiper-btn i {

    font-size: 18px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-team-area3 .section-inner .swiper-btn,

  .tmp-team-area2 .section-inner .swiper-btn {

    opacity: 1;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-team-area3 .section-inner .swiper-btn,

  .tmp-team-area2 .section-inner .swiper-btn {

    height: 45px;

    width: 45px;

    line-height: 43px;

  }

  .tmp-team-area3 .section-inner .swiper-btn i,

  .tmp-team-area2 .section-inner .swiper-btn i {

    font-size: 16px;

  }

}

.tmp-team-area3 .section-inner .swiper-btn:hover,

.tmp-team-area2 .section-inner .swiper-btn:hover {

  background: var(--color-primary);

  color: var(--color-white);

  transform: translateY(-50%) scale(1.2);

}

.tmp-team-area3 .section-inner .swiper-button-prev3,

.tmp-team-area2 .section-inner .swiper-button-prev3 {

  left: 0px;

}

@media only screen and (max-width: 991px) {

  .tmp-team-area3 .section-inner .swiper-button-prev3,

  .tmp-team-area2 .section-inner .swiper-button-prev3 {

    left: -50px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-team-area3 .section-inner .swiper-button-prev3,

  .tmp-team-area2 .section-inner .swiper-button-prev3 {

    left: -10px;

  }

}

.tmp-team-area3 .section-inner .swiper-button-next3,

.tmp-team-area2 .section-inner .swiper-button-next3 {

  right: 0px;

}

@media only screen and (max-width: 991px) {

  .tmp-team-area3 .section-inner .swiper-button-next3,

  .tmp-team-area2 .section-inner .swiper-button-next3 {

    right: -50px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-team-area3 .section-inner .swiper-button-next3,

  .tmp-team-area2 .section-inner .swiper-button-next3 {

    right: -10px;

  }

}

.tmp-team-area3.ten .section-inner,

.tmp-team-area2.ten .section-inner {

  margin-left: 0;

  margin-right: 0;

}

.tmp-team-area3.ten .team-wrapper2,

.tmp-team-area2.ten .team-wrapper2 {

  background: #FFFFFF;

  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.1);

  border-radius: 6px;

  margin-bottom: 20px;

}

.tmp-team-area3:hover .section-inner .swiper-btn,

.tmp-team-area2:hover .section-inner .swiper-btn {

  opacity: 1;

}

.tmp-team-area3:hover .section-inner .swiper-button-prev3,

.tmp-team-area2:hover .section-inner .swiper-button-prev3 {

  left: -60px;

}

@media only screen and (max-width: 1199px) {

  .tmp-team-area3:hover .section-inner .swiper-button-prev3,

  .tmp-team-area2:hover .section-inner .swiper-button-prev3 {

    left: -15px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-team-area3:hover .section-inner .swiper-button-prev3,

  .tmp-team-area2:hover .section-inner .swiper-button-prev3 {

    left: -15px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-team-area3:hover .section-inner .swiper-button-prev3,

  .tmp-team-area2:hover .section-inner .swiper-button-prev3 {

    left: -10px;

  }

}

.tmp-team-area3:hover .section-inner .swiper-button-next3,

.tmp-team-area2:hover .section-inner .swiper-button-next3 {

  right: -60px;

}

@media only screen and (max-width: 1199px) {

  .tmp-team-area3:hover .section-inner .swiper-button-next3,

  .tmp-team-area2:hover .section-inner .swiper-button-next3 {

    right: -15px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-team-area3:hover .section-inner .swiper-button-next3,

  .tmp-team-area2:hover .section-inner .swiper-button-next3 {

    right: -15px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-team-area3:hover .section-inner .swiper-button-next3,

  .tmp-team-area2:hover .section-inner .swiper-button-next3 {

    right: -10px;

  }

}



.bg-primary-50 {

  background: var(--primary-50);

}

.bg-primary-50.tmp-team-area .shape-area img {

  filter: brightness(0) saturate(100%) invert(36%) sepia(7%) saturate(6843%) hue-rotate(140deg) brightness(94%) contrast(80%);

}



.team-wrapper2 {

  position: relative;

  z-index: 1;

  overflow: hidden;

  border-radius: 6px;

  transition: 0.3s;

  height: 100%;

}

.team-wrapper2:hover {

  transform: scale(1.03);

}

.team-wrapper2:hover .image-area::after {

  bottom: 0;

}

.team-wrapper2:hover .image-area .social-wrapper {

  opacity: 1;

  bottom: 20px;

}

.team-wrapper2 .image-area {

  position: relative;

  z-index: 1;

  overflow: hidden;

  transition: var(--transition);

}

.team-wrapper2 .image-area a {

  display: block;

}

.team-wrapper2 .image-area a img {

  width: 100%;

}

.team-wrapper2 .image-area::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  left: 0;

  bottom: -100%;

  transition: var(--transition);

  z-index: 1;

  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(5, 5, 5, 0) 47.81%, rgba(26, 116, 123, 0.3568627451) 58.9%, var(--color-primary) 100%);

}

.team-wrapper2 .image-area .social-wrapper {

  position: absolute;

  z-index: 2;

  left: 50%;

  transform: translateX(-50%);

  bottom: -30px;

  opacity: 0;

  transition: var(--transition);

}

.team-wrapper2 .image-area .social-wrapper ul {

  display: flex;

  align-items: center;

  gap: 5px;

}

.team-wrapper2 .image-area .social-wrapper ul li a {

  width: 40px;

  height: 40px;

  line-height: 41px;

  border-radius: 50%;

  background: var(--color-white);

  text-align: center;

  display: block;

  color: var(--color-heading-1);

  transition: var(--transition);

  position: relative;

  z-index: 1;

}

.team-wrapper2 .image-area .social-wrapper ul li a::after {

  position: absolute;

  content: "";

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%) scale(0.2);

  width: 100%;

  height: 100%;

  opacity: 0;

  background: var(--color-primary);

  border-radius: 50%;

  transition: 0.3s;

  z-index: -1;

}

.team-wrapper2 .image-area .social-wrapper ul li a:hover {

  color: var(--color-white);

}

.team-wrapper2 .image-area .social-wrapper ul li a:hover::after {

  transform: translate(-50%, -50%) scale(1.02);

  opacity: 1;

}

.team-wrapper2 .content-area {

  background: var(--color-white);

  padding: 20px 30px;

  height: 100%;

}

@media only screen and (max-width: 767px) {

  .team-wrapper2 .content-area {

    padding: 30px 20px !important;

  }

}

.team-wrapper2 .content-area .title {

  display: flex;

  align-items: center;

  justify-content: space-between;

  transition: var(--transition);

  margin-bottom: 0px;

  font-size: 20px;

  line-height: 1.3;

}

.team-wrapper2 .content-area .title:hover a {

  color: var(--color-primary-2);

}

.team-wrapper2 .content-area .title:hover .icon-btn {

  background: var(--color-primary-2);

  color: var(--color-white);

}

.team-wrapper2 .content-area .title .icon-btn {

  width: 40px;

  height: 40px;

  line-height: 44px;

  text-align: center;

  display: block;

  border-radius: 50%;

  background: rgba(135, 171, 66, 0.1);

  color: var(--color-primary-2);

  transition: var(--transition);

}

.team-wrapper2 .content-area .title .icon-btn i {

  transform: rotate(-45deg);

  font-size: 18px;

}

.team-wrapper2 .content-area .designation {

  margin-bottom: 3px;

}

.team-wrapper2 .content-area .email {

  display: flex;

  align-items: center;

  gap: 8px;

  transition: var(--transition);

}

.team-wrapper2 .content-area .email i {

  color: var(--color-white);

  height: 26px;

  min-width: 26px;

  display: flex;

  align-items: center;

  justify-content: center;

  background: var(--color-primary);

  border-radius: 50%;

  font-size: 13px;

}

.team-wrapper2 .content-area .email:hover {

  color: var(--color-primary-2);

}



.team-wrapper3 {

  position: relative;

  z-index: 1;

  overflow: hidden;

  border-radius: 6px;

  background: #E9F1FC;

}

.team-wrapper3:hover .image-area::after {

  bottom: 0;

}

.team-wrapper3:hover .image-area .content-area {

  opacity: 1;

  bottom: 30px;

}

.team-wrapper3 .image-area {

  position: relative;

  z-index: 1;

  overflow: hidden;

  transition: var(--transition);

}

.team-wrapper3 .image-area::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 50%;

  left: 0;

  bottom: -50%;

  transition: var(--transition);

  z-index: 1;

  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, var(--color-primary) 100%);

}

.team-wrapper3 .image-area .content-area {

  position: absolute;

  z-index: 2;

  left: 50%;

  width: 100%;

  max-width: max-content;

  transform: translateX(-50%);

  text-align: center;

  bottom: -30px;

  opacity: 0;

  transition: var(--transition);

}

.team-wrapper3 .image-area .content-area .text {

  margin-bottom: 15px;

}

.team-wrapper3 .image-area .content-area .text .title {

  margin-bottom: 10px;

  line-height: 1;

  font-size: 30px;

}

.team-wrapper3 .image-area .content-area .text .title a {

  color: var(--color-white);

  font-size: 26px;

}

.team-wrapper3 .image-area .content-area .text p {

  color: #C2C3C5;

}

.team-wrapper3 .image-area .social-wrapper {

  transition: var(--transition);

}

.team-wrapper3 .image-area .social-wrapper ul {

  display: flex;

  align-items: center;

  gap: 10px;

}

.team-wrapper3 .image-area .social-wrapper ul li a {

  width: 40px;

  height: 40px;

  line-height: 42px;

  border-radius: 50%;

  background: var(--color-white);

  text-align: center;

  display: block;

  color: var(--color-heading-1);

  transition: var(--transition);

  position: relative;

  z-index: 1;

}

.team-wrapper3 .image-area .social-wrapper ul li a::after {

  position: absolute;

  left: 50%;

  top: 50%;

  width: 100%;

  height: 100%;

  transform: translate(-50%, -50%) scale(0.2);

  transition: 0.3s;

  content: "";

  z-index: -1;

  border-radius: 50%;

  background: var(--color-primary);

  opacity: 0;

}

.team-wrapper3 .image-area .social-wrapper ul li a:hover {

  color: var(--color-white);

}

.team-wrapper3 .image-area .social-wrapper ul li a:hover::after {

  opacity: 1;

  transform: translate(-50%, -50%) scale(1);

}



.team-wrapper5 {

  background: var(--color-white);

  border-radius: 6px;

  box-shadow: 0px 4px 44px rgba(0, 0, 0, 0.07);

  transition: var(--transition);

  position: relative;

  z-index: 1;

  display: block;

  overflow: hidden;

}

.team-wrapper5:hover {

  transform: translateY(-2px) scale(1.02);

}

.team-wrapper5:hover .content-area .share {

  background: var(--color-primary-2);

  color: var(--color-white);

}

.team-wrapper5:hover .social-wrapper {

  opacity: 1;

  transform: translateY(0);

}

.team-wrapper5 .image-area {

  background: var(--color-primary);

  height: 349px;

  clip-path: polygon(1.266% 2.801%, 1.266% 2.801%, 1.291% 2.529%, 1.363% 2.27%, 1.478% 2.029%, 1.632% 1.809%, 1.822% 1.613%, 2.043% 1.445%, 2.292% 1.308%, 2.564% 1.206%, 2.857% 1.142%, 3.165% 1.12%, 96.835% 1.12%, 96.835% 1.12%, 97.143% 1.142%, 97.436% 1.206%, 97.708% 1.308%, 97.957% 1.445%, 98.178% 1.613%, 98.368% 1.809%, 98.522% 2.029%, 98.637% 2.27%, 98.709% 2.529%, 98.734% 2.801%, 98.734% 96.957%, 98.734% 96.957%, 98.705% 97.255%, 98.62% 97.534%, 98.485% 97.791%, 98.305% 98.022%, 98.085% 98.223%, 97.832% 98.388%, 97.549% 98.515%, 97.243% 98.6%, 96.919% 98.637%, 96.582% 98.623%, 2.911% 87.451%, 2.911% 87.451%, 2.636% 87.4%, 2.378% 87.316%, 2.14% 87.201%, 1.925% 87.059%, 1.735% 86.892%, 1.574% 86.703%, 1.443% 86.495%, 1.346% 86.271%, 1.286% 86.034%, 1.266% 85.785%, 1.266% 2.801%);

}

@media only screen and (max-width: 767px) {

  .team-wrapper5 .image-area {

    height: auto;

    clip-path: none;

  }

}

.team-wrapper5 .image-area a {

  display: block;

  height: 334px;

  clip-path: polygon(0% 1.796%, 0% 1.796%, 0.025% 1.505%, 0.099% 1.229%, 0.217% 0.971%, 0.376% 0.735%, 0.571% 0.526%, 0.798% 0.347%, 1.053% 0.201%, 1.332% 0.092%, 1.632% 0.024%, 1.948% 0%, 98.052% 0%, 98.052% 0%, 98.368% 0.024%, 98.668% 0.092%, 98.947% 0.201%, 99.202% 0.347%, 99.429% 0.526%, 99.624% 0.735%, 99.783% 0.971%, 99.901% 1.229%, 99.975% 1.505%, 100% 1.796%, 100% 97.935%, 100% 97.935%, 99.97% 98.254%, 99.882% 98.554%, 99.742% 98.829%, 99.557% 99.076%, 99.331% 99.291%, 99.069% 99.468%, 98.778% 99.603%, 98.463% 99.692%, 98.129% 99.731%, 97.782% 99.715%, 1.679% 87.342%, 1.679% 87.342%, 1.398% 87.286%, 1.135% 87.195%, 0.892% 87.072%, 0.672% 86.92%, 0.478% 86.742%, 0.314% 86.54%, 0.181% 86.319%, 0.082% 86.08%, 0.021% 85.827%, 0% 85.563%, 0% 1.796%);

}

@media only screen and (max-width: 767px) {

  .team-wrapper5 .image-area a {

    height: auto;

    clip-path: none;

  }

}

.team-wrapper5 .content-area {

  display: flex;

  justify-content: space-between;

  padding: 25px 30px;

  align-items: center;

}

.team-wrapper5 .content-area .left .title {

  margin-bottom: 5px;

  font-size: 20px;

  line-height: 1.4;

  color: var(--color-heading-1);

}

.team-wrapper5 .content-area .share {

  display: block;

  background: transparent;

  border: 1px solid var(--color-border);

  border-radius: 50%;

  min-width: 40px;

  height: 40px;

  line-height: 41px;

  color: var(--color-primary-2);

  text-align: center;

  font-size: 15px;

}

.team-wrapper5 .social-wrapper {

  position: absolute;

  z-index: 1;

  bottom: 31%;

  right: 30px;

  opacity: 0;

  transition: var(--transition);

  transform: translateY(100px);

}

@media only screen and (max-width: 767px) {

  .team-wrapper5 .social-wrapper {

    bottom: 18%;

    right: 18px;

  }

}

.team-wrapper5 .social-wrapper ul {

  display: flex;

  flex-direction: column;

  gap: 5px;

}

.team-wrapper5 .social-wrapper ul li a {

  display: block;

  width: 40px;

  height: 40px;

  line-height: 42px;

  background: var(--color-white);

  border-radius: 50%;

  text-align: center;

  color: var(--color-heading-1);

  font-size: 15px;

  position: relative;

  z-index: 1;

}

.team-wrapper5 .social-wrapper ul li a::after {

  position: absolute;

  content: "";

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  z-index: -1;

  background: var(--color-primary);

  transform: scale(0.5);

  opacity: 0;

  transition: 0.3s;

  border-radius: 100%;

  border: 2px solid var(--color-primary);

}

.team-wrapper5 .social-wrapper ul li a:hover i {

  color: var(--color-white);

}

.team-wrapper5 .social-wrapper ul li a:hover::after {

  transform: scale(1);

  opacity: 1;

}

.team-wrapper5.two {

  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.06);

}



.header-custom-container2 .hover-bg-light::after {

  background: rgba(253, 253, 253, 0.04);

}



.team-wrapper6 {

  background: var(--color-white);

  border-radius: 10px;

  transition: var(--transition);

  position: relative;

  z-index: 1;

  padding-bottom: 90px;

}

.team-wrapper6:hover .content-area .share {

  background: var(--color-primary-2);

  color: var(--color-white);

}

.team-wrapper6:hover .social-wrapper {

  opacity: 1;

  transform: translateY(0);

}

.team-wrapper6:hover::before {

  opacity: 0;

}

.team-wrapper6:hover::after {

  opacity: 1;

}

.team-wrapper6 .content-area {

  position: absolute;

  z-index: 1;

  width: 100%;

  bottom: 0;

  left: 0;

  clip-path: polygon(0% 5.53%, 0% 5.53%, 0.057% 4.527%, 0.22% 3.592%, 0.479% 2.741%, 0.821% 1.988%, 1.236% 1.349%, 1.712% 0.838%, 2.237% 0.468%, 2.801% 0.256%, 3.393% 0.216%, 4% 0.361%, 97.527% 37.673%, 97.527% 37.673%, 97.949% 37.892%, 98.342% 38.197%, 98.701% 38.581%, 99.025% 39.036%, 99.308% 39.554%, 99.547% 40.129%, 99.74% 40.752%, 99.882% 41.417%, 99.97% 42.116%, 100% 42.842%, 100% 94.245%, 100% 94.245%, 99.958% 95.107%, 99.835% 95.926%, 99.639% 96.689%, 99.376% 97.386%, 99.052% 98.006%, 98.675% 98.538%, 98.251% 98.97%, 97.787% 99.293%, 97.289% 99.494%, 96.764% 99.564%, 3.236% 99.564%, 3.236% 99.564%, 2.711% 99.494%, 2.213% 99.293%, 1.749% 98.97%, 1.325% 98.538%, 0.948% 98.006%, 0.624% 97.386%, 0.361% 96.689%, 0.165% 95.926%, 0.042% 95.107%, 0% 94.245%, 0% 5.53%);

}

.team-wrapper6 .content-area .inner {

  display: flex;

  justify-content: space-between;

  padding: 87px 30px 34px 30px;

  align-items: center;

  background: var(--color-white);

}

.team-wrapper6 .content-area .left .title {

  margin-bottom: 0;

  color: var(--color-heading-1);

  font-size: 20px;

}

.team-wrapper6 .content-area .left .title a:hover {

  color: var(--color-primary-2);

}

.team-wrapper6 .content-area .share {

  display: block;

  background: transparent;

  border: 1px solid var(--color-border);

  border-radius: 50%;

  width: 40px;

  height: 40px;

  line-height: 41px;

  color: var(--color-primary-2);

  text-align: center;

  font-size: 14px;

}

.team-wrapper6 .content-area::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  bottom: -5px;

  left: 0;

  clip-path: polygon(0% 5.53%, 0% 5.53%, 0.057% 4.527%, 0.22% 3.592%, 0.479% 2.741%, 0.821% 1.988%, 1.236% 1.349%, 1.712% 0.838%, 2.237% 0.468%, 2.801% 0.256%, 3.393% 0.216%, 4% 0.361%, 97.527% 37.673%, 97.527% 37.673%, 97.949% 37.892%, 98.342% 38.197%, 98.701% 38.581%, 99.025% 39.036%, 99.308% 39.554%, 99.547% 40.129%, 99.74% 40.752%, 99.882% 41.417%, 99.97% 42.116%, 100% 42.842%, 100% 94.245%, 100% 94.245%, 99.958% 95.107%, 99.835% 95.926%, 99.639% 96.689%, 99.376% 97.386%, 99.052% 98.006%, 98.675% 98.538%, 98.251% 98.97%, 97.787% 99.293%, 97.289% 99.494%, 96.764% 99.564%, 3.236% 99.564%, 3.236% 99.564%, 2.711% 99.494%, 2.213% 99.293%, 1.749% 98.97%, 1.325% 98.538%, 0.948% 98.006%, 0.624% 97.386%, 0.361% 96.689%, 0.165% 95.926%, 0.042% 95.107%, 0% 94.245%, 0% 5.53%);

  z-index: -1;

  background: var(--color-primary-2);

}

.team-wrapper6 .social-wrapper {

  position: absolute;

  z-index: 1;

  bottom: 25%;

  right: 30px;

  opacity: 0;

  transition: var(--transition);

  transform: translateY(100px);

}

.team-wrapper6 .social-wrapper ul {

  display: flex;

  flex-direction: column;

  gap: 10px;

}

.team-wrapper6 .social-wrapper ul li a {

  display: block;

  width: 40px;

  height: 40px;

  line-height: 42px;

  background: var(--color-white);

  border-radius: 50%;

  text-align: center;

  color: var(--color-heading-1);

  font-size: 14px;

  position: relative;

  z-index: 1;

  transition: 0.3s;

}

.team-wrapper6 .social-wrapper ul li a::after {

  position: absolute;

  content: "";

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%) scale(0.2);

  background: var(--color-primary);

  opacity: 0;

  height: 100%;

  width: 100%;

  z-index: -1;

  border-radius: 50%;

  transition: 0.3s;

}

.team-wrapper6 .social-wrapper ul li a:hover {

  color: var(--color-white);

}

.team-wrapper6 .social-wrapper ul li a:hover::after {

  transform: translate(-50%, -50%) scale(1);

  opacity: 1;

}

.team-wrapper6.two {

  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.06);

}

.team-wrapper6::before {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  background: var(--color-border);

  z-index: -1;

  left: 0;

  bottom: -5px;

  border-radius: 10px;

  transition: var(--transition);

  opacity: 1;

}

.team-wrapper6::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  background: var(--color-primary-2);

  z-index: -2;

  left: 0;

  bottom: -5px;

  border-radius: 10px;

  transition: var(--transition);

  opacity: 0;

}



.tmp-team-area {

  position: relative;

  z-index: 1;

}

.tmp-team-area .shape-area img {

  position: absolute;

  left: 0;

  top: 50%;

  transform: translateY(-50%);

  filter: brightness(0) saturate(100%) invert(40%) sepia(13%) saturate(2194%) hue-rotate(136deg) brightness(92%) contrast(95%);

}

.tmp-team-area.bg-body-2 {

  margin: 0 40px;

  border-radius: 5px;

}



.tmp-team-details-area .team-content-area {

  margin-left: 30px;

}

.tmp-team-details-area .team-content-area .designation {

  color: var(--color-heading-1);

  font-weight: 600;

  line-height: 1;

  font-size: 16px;

}

.tmp-team-details-area .team-content-area .desc {

  margin-bottom: 30px;

}

.tmp-team-details-area .team-content-area ul {

  display: flex;

  flex-direction: column;

  gap: 12px;

}

.tmp-team-details-area .team-content-area ul li {

  display: flex;

  align-items: center;

  line-height: 1;

  gap: 20px;

}

.tmp-team-details-area .team-content-area ul li .tag {

  max-width: 100px;

  width: 100%;

  color: #000000;

  font-weight: 600;

  margin-bottom: 0;

  font-family: var(--font-primary);

}

.tmp-team-details-area .team-content-area ul li a:hover {

  color: var(--color-primary-2);

}

.tmp-team-details-area .team-content-area .social-wrapper ul {

  flex-direction: row;

  gap: 5px;

  margin-top: 30px;

}

.tmp-team-details-area .team-content-area .social-wrapper ul li a {

  width: 40px;

  height: 40px;

  line-height: 40px;

  display: block;

  text-align: center;

  border-radius: 50%;

  border: 1px solid transparent;

  color: var(--color-primary-2);

  background: #f5f5f5;

  transition: var(--transition);

  position: relative;

  z-index: 1;

}

.tmp-team-details-area .team-content-area .social-wrapper ul li a::after {

  position: absolute;

  content: "";

  left: 50%;

  top: 50%;

  height: 100%;

  width: 100%;

  background: var(--color-primary);

  z-index: -1;

  opacity: 0;

  border-radius: 50%;

  transition: 0.3s;

  transform: translate(-50%, -50%) scale(0.2);

}

.tmp-team-details-area .team-content-area .social-wrapper ul li a:hover {

  color: var(--color-white);

}

.tmp-team-details-area .team-content-area .social-wrapper ul li a:hover::after {

  opacity: 1;

  transform: translate(-50%, -50%) scale(1);

}



.team-about-area {

  margin-top: 40px;

}

.team-about-area .title {

  font-size: 26px;

}

.team-about-area p {

  margin-bottom: 20px;

}



.team-bottom-area {

  margin-top: 40px;

}

.team-bottom-area .skill-area .title {

  font-size: 26px;

}

.team-bottom-area .skill-area .progress-bar-area {

  width: 100%;

  padding: 0;

  margin-top: 40px;

}

.team-bottom-area .skill-area .progress-bar-area .progress-container {

  width: 100%;

  border-radius: 23px;

  background: rgba(88, 19, 251, 0.2);

  margin: 10px 0;

}

.team-bottom-area .skill-area .progress-bar-area .progress-bar {

  width: 0;

  height: 6px;

  border-radius: 23px;

  background-color: var(--color-primary-2);

  text-align: center;

  line-height: 30px;

  color: white;

  transition: 0.6s ease;

}

.team-bottom-area .skill-area .progress-bar-area .progress-wrapper {

  position: relative;

  margin: 30px 0;

}

.team-bottom-area .skill-area .progress-bar-area .progress-wrapper .tag {

  color: #080D41;

  font-family: var(--title-font);

  font-size: 20px;

  font-weight: 500;

  line-height: 30px;

  text-transform: uppercase;

}

.team-bottom-area .skill-area .progress-bar-area .progress-label {

  position: absolute;

  right: 0;

  top: 0;

  font-family: var(--body-font);

  color: var(--color-primary-2);

  font-size: 20px;

  font-weight: 700;

  line-height: 30px;

  text-transform: capitalize;

}

.team-bottom-area .skill-area .single-progress {

  margin-bottom: 22px;

}

.team-bottom-area .skill-area .single-progress:last-child {

  margin-bottom: 0;

}

.team-bottom-area .skill-area .single-progress .top {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-bottom: 5px;

}

.team-bottom-area .skill-area .single-progress .top span {

  color: #000000;

  font-size: 16px;

  font-weight: 600;

  line-height: 30px;

  font-family: var(--font-primary);

}

.team-bottom-area .skill-area .single-progress .top span.digit {

  color: #000000;

  font-size: 16px;

  font-style: normal;

  font-weight: 600;

  line-height: 30px;

  text-transform: capitalize;

}

.team-bottom-area .skill-area .single-progress .progress {

  border-radius: 10px;

  background: var(--primary-100);

  height: 10px;

}

.team-bottom-area .skill-area .single-progress .progress .progress-bar {

  background-color: var(--color-primary-2);

  border-radius: 10px;

  height: 100%;

}

.team-bottom-area .award-area .title {

  font-size: 26px;

}

.team-bottom-area .award-area .awards {

  display: flex;

  align-items: flex-start;

  gap: 30px;

  flex-direction: row;

  flex-wrap: wrap;

}

@media only screen and (max-width: 576px) {

  .team-bottom-area .award-area .awards {

    gap: 20px;

    flex-wrap: wrap;

    justify-content: center;

  }

}

.team-bottom-area .award-area .awards li {

  text-align: center;

}

.team-bottom-area .award-area .awards li span {

  width: 100px;

  height: 100px;

  line-height: 100px;

  display: block;

  border-radius: 50%;

  text-align: center;

  background: var(--primary-50);

}

.team-bottom-area .award-area .awards li h6,

.team-bottom-area .award-area .awards li .title {

  font-size: 16px;

  line-height: 24px;

  font-weight: 600;

}



.mySwiper-team-large-2 {

  padding-bottom: 60px;

}

.mySwiper-team-large-2 .swiper-pagination {

  margin: auto;

  max-width: max-content;

  margin-top: 25px;

  left: 50%;

  transform: translateX(-50%);

}

.mySwiper-team-large-2 .swiper-pagination .swiper-pagination-bullet {

  background: var(--color-border);

  opacity: 1;

  width: 8px;

  height: 8px;

  transition: var(--transition);

}

.mySwiper-team-large-2 .swiper-pagination .swiper-pagination-bullet-active {

  background: var(--color-primary-2);

  width: 40px;

  border-radius: 30px;

}



.tmp-service-area {

  border-radius: 20px;

  background: #F6F6F6;

}

@media only screen and (max-width: 479px) {

  .tmp-service-area {

    border-radius: 0;

  }

}

.tmp-service-area.area-2 {

  background: rgba(255, 112, 41, 0.05);

}

.tmp-service-area.area-3 {

  background: #F6F6F6;

}

.tmp-service-area.area-3 .section-title-area-4 .right-side-text {

  max-width: 561px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-service-area.area-3 .section-title-area-4 .right-side-text {

    max-width: 100% !important;

  }

}

.tmp-service-area.area-3 .slider-inner {

  position: relative;

  z-index: 1;

}

.tmp-service-area.area-3 .slider-inner .slider-button {

  gap: 20px;

}

.tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn {

  color: var(--color-primary-2);

  display: flex;

  align-items: center;

  gap: 5px;

  position: unset;

  margin: 0;

  width: 60px;

  height: 60px;

  background: #fff;

  border-radius: 50%;

  transition: var(--transition);

  position: absolute;

  z-index: 10;

  transform: translateY(-50%);

  transition: 0.3s;

  opacity: 0;

}

.tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn i {

  transition: 0.3s;

}

.tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn:hover {

  background: var(--color-primary);

  transform: translateY(-50%) scale(1.1);

}

.tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn:hover i {

  color: #fff;

}

.tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn:hover span {

  background: var(--color-primary-2);

  color: var(--color-white);

}

.tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn::after, .tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn::before {

  display: none;

}

.tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn span {

  min-width: 60px;

  height: 60px;

  line-height: 60px;

  background: rgba(135, 171, 66, 0.2);

  display: block;

  border-radius: 50%;

  text-align: center;

  transition: var(--transition);

}

.tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn i {

  font-size: 18px;

}

.tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn.swiper-button-next {

  position: absolute;

  right: -60px;

  top: 50%;

  left: auto;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn.swiper-button-next {

    right: 25px;

  }

}

@media only screen and (max-width: 1199px) {

  .tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn.swiper-button-next {

    right: 25px;

  }

}

@media only screen and (max-width: 991px) {

  .tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn.swiper-button-next {

    right: -30px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn.swiper-button-next {

    right: 0;

    top: 45%;

  }

}

.tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn.swiper-button-prev {

  position: absolute;

  left: -60px;

  top: 50%;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn.swiper-button-prev {

    left: 25px;

  }

}

@media only screen and (max-width: 1199px) {

  .tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn.swiper-button-prev {

    left: 25px;

  }

}

@media only screen and (max-width: 991px) {

  .tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn.swiper-button-prev {

    left: -30px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-service-area.area-3 .slider-inner .slider-button .swiper-btn.swiper-button-prev {

    left: 0;

    top: 45%;

  }

}

.tmp-service-area.area-3 .slider-inner:hover .swiper-btn.swiper-button-next {

  right: -90px;

  opacity: 1;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-service-area.area-3 .slider-inner:hover .swiper-btn.swiper-button-next {

    right: -60px;

  }

}

@media only screen and (max-width: 1199px) {

  .tmp-service-area.area-3 .slider-inner:hover .swiper-btn.swiper-button-next {

    right: -30px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-service-area.area-3 .slider-inner:hover .swiper-btn.swiper-button-next {

    right: 0;

  }

}

.tmp-service-area.area-3 .slider-inner:hover .swiper-btn.swiper-button-prev {

  left: -90px;

  opacity: 1;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-service-area.area-3 .slider-inner:hover .swiper-btn.swiper-button-prev {

    left: -60px;

  }

}

@media only screen and (max-width: 1199px) {

  .tmp-service-area.area-3 .slider-inner:hover .swiper-btn.swiper-button-prev {

    left: -30px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-service-area.area-3 .slider-inner:hover .swiper-btn.swiper-button-prev {

    left: 0;

  }

}

.tmp-service-area.area-3 .float-right {

  position: relative;

  min-width: 120%;

  right: 0;

}

@media only screen and (max-width: 767px) {

  .tmp-service-area.area-3 .float-right {

    min-width: 100%;

  }

}

.tmp-service-area.area-4 {

  background: var(--primary-100);

  position: relative;

  z-index: 1;

}

.tmp-service-area.area-4 .shape {

  position: absolute;

  z-index: -1;

  top: 0;

  right: 0;

}

.tmp-service-area.area-5 {

  background: #f7f7f7;

  margin: 0 40px;

  border-radius: 10px;

  overflow: hidden;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-service-area.area-5 {

    margin: 0 0;

    border-radius: 0;

  }

}

@media only screen and (max-width: 1199px) {

  .tmp-service-area.area-5 {

    margin: 0 0;

  }

}

.tmp-service-area.area-5 .slider-inner {

  position: relative;

  z-index: 1;

}

.tmp-service-area.area-5 .slider-inner .swiper-pagination .swiper-pagination-bullet {

  background: var(--color-border);

  opacity: 1;

  width: 8px;

  height: 8px;

  transition: var(--transition);

}

.tmp-service-area.area-5 .slider-inner .swiper-pagination .swiper-pagination-bullet-active {

  background: var(--color-primary-2);

  width: 40px;

  border-radius: 30px;

}

.tmp-service-area.area-6 {

  position: relative;

  z-index: 11;

  background: none;

  border-radius: 0;

}

.tmp-service-area.area-7 {

  position: relative;

  z-index: 11;

  background: #f7fdff;

  border-radius: 4px;

  margin: 0 50px;

}

.tmp-service-area.area-8 {

  position: relative;

  z-index: 11;

  background: #f7fdff;

}

.tmp-service-area.service .service-wrapper {

  padding: 30px;

}

.tmp-service-area.service .service-wrapper:hover .icon {

  background: var(--color-white);

}

.tmp-service-area.service .service-wrapper .icon {

  background: transparent;

  height: auto;

  width: 72px;

  box-shadow: none;

}

.tmp-service-area.service .service-wrapper .icon img {

  max-width: 100%;

}

.tmp-service-area.service .service-wrapper::after {

  background: var(--color-primary-2);

}



.service-one-wrapper .section-title-area .desc {

  max-width: 430px;

}



.service-wrapper {

  background: var(--color-white);

  border-radius: 6px;

  padding: 30px 35px 30px 30px;

  box-shadow: var(--shadow-1);

  transition: var(--transition);

  position: relative;

  z-index: 1;

  overflow: hidden;

  height: 320px;

}

.service-wrapper:hover {

  transform: scale(1.02);

}

.service-wrapper:hover .icon img {

  animation: bounceIn 1.2s ease;

}

.service-wrapper .icon {

  width: 90px;

  height: 90px;

  line-height: 90px;

  border-radius: 50%;

  background: var(--secondary-100);

  text-align: center;

  display: block;

  transition: var(--transition);

  box-shadow: var(--shadow-1);

}

.service-wrapper .icon img {

  max-width: 40px;

}

.service-wrapper .heading-title {

  transition: var(--transition);

  margin-bottom: 10px;

  font-size: 20px;

  line-height: 1.2;

}

.service-wrapper .heading-title a {

  color: var(--color-heading-1);

  transition: var(--transition);

}

.service-wrapper .heading-title:hover a {

  color: var(--color-primary);

}

.service-wrapper .desc {

  transition: var(--transition);

  margin-bottom: 15px;

}

.service-wrapper .service-btn {

  transition: var(--transition);

}

.service-wrapper .content-wrapper {

  position: absolute;

  bottom: -10%;

  left: 30px;

  width: calc(100% - 60px);

  transition: 0.3s;

}

.service-wrapper .content-wrapper p.desc {

  opacity: 1;

}

.service-wrapper .content-wrapper .service-btn-area {

  opacity: 0;

}

.service-wrapper:hover .desc {

  height: auto;

  visibility: visible;

}

.service-wrapper:hover .content-wrapper {

  bottom: 30px;

}

.service-wrapper:hover .content-wrapper p.desc {

  opacity: 1;

}

.service-wrapper:hover .content-wrapper .service-btn-area {

  opacity: 1;

}



.service-wrapper-2 {

  padding: 0 33px 30px 0;

  position: relative;

  z-index: 1;

  transition: var(--transition);

}

.service-wrapper-2:hover .image-area img {

  transform: scale(105%);

}

.service-wrapper-2:hover .content-area {

  transform: scale(1.02);

}

.service-wrapper-2:hover .content-area a .icon {

  background: var(--color-primary);

}

.service-wrapper-2:hover .content-area a .icon i {

  color: var(--color-white);

}

.service-wrapper-2 .image-area {

  overflow: hidden;

  transition: var(--transition);

  border-radius: 6px;

}

.service-wrapper-2 .image-area img {

  transition: var(--transition);

  transform: scale(100%);

}

.service-wrapper-2 .content-area {

  max-width: 344px;

  width: 100%;

  position: absolute;

  z-index: 1;

  background: var(--color-white);

  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.05);

  border-radius: 6px;

  bottom: 0;

  right: 0;

  padding: 27px 30px 26px;

  overflow: hidden;

  transition: 0.3s;

}

.service-wrapper-2 .content-area .title {

  font-weight: 600;

  line-height: 1;

  margin-bottom: 10px;

  font-size: 20px;

  transition: var(--transition);

}

.service-wrapper-2 .content-area .title a {

  color: var(--color-heading-1);

  transition: var(--transition);

}

.service-wrapper-2 .content-area .read-more-btn {

  display: flex;

  align-items: center;

  gap: 10px;

  color: var(--color-heading-1);

  font-weight: 500;

  font-family: var(--font-primary);

  max-width: max-content;

  transition: var(--transition);

}

.service-wrapper-2 .content-area .read-more-btn .icon {

  width: 32px;

  height: 32px;

  background: var(--secondary-100);

  border-radius: 22px;

  display: flex;

  text-align: center;

  transition: var(--transition);

  align-items: center;

  justify-content: center;

}

.service-wrapper-2 .content-area .read-more-btn .icon i {

  color: var(--color-primary);

  transform: rotate(-45deg);

  transition: var(--transition);

}

.service-wrapper-2 .content-area .icon-tag {

  width: 60px;

  height: 60px;

  background: var(--secondary-100);

  top: 0;

  right: 0;

  position: absolute;

  z-index: 1;

  transition: var(--transition);

  border-radius: 0 0 0 87%;

}

.service-wrapper-2 .content-area .icon-tag img {

  max-width: 30px;

  margin: 0 auto;

  position: absolute;

  left: 57%;

  top: 40%;

  transform: translate(-50%, -50%);

  filter: brightness(0) saturate(100%) invert(59%) sepia(61%) saturate(3545%) hue-rotate(341deg) brightness(100%) contrast(103%);

}

.service-wrapper-2 .content-area .icon-tag::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  background: var(--color-white);

  top: 0;

  left: 0;

  z-index: -1;

  opacity: 0;

  transition: var(--transition);

}



.tmp-why-choose-us-area {

  position: relative;

  z-index: 1;

  background: linear-gradient(180deg, rgba(179, 179, 179, 0.09) 0%, rgba(246, 246, 246, 0.4) 100%);

}

.tmp-why-choose-us-area::after {

  content: "";

  position: absolute;

  width: 385px;

  height: 390px;

  background: var(--secondary-100);

  top: 0;

  left: 0;

  z-index: -1;

}

.tmp-why-choose-us-area .image-area img {

  border-radius: 4px;

}



.demo-orange .why-choose-us-content-area .service-list li i {

  background: var(--secondary-100);

}



.why-choose-us-content-area {

  margin-left: 30px;

}

.why-choose-us-content-area .service-list {

  padding: 0;

  margin: 0;

  margin-bottom: 20px;

}

.why-choose-us-content-area .service-list li {

  list-style: none;

  display: flex;

  align-items: center;

  gap: 5px;

  margin: 5px 0;

}

.why-choose-us-content-area .service-list li i {

  width: 18px;

  height: 18px;

  line-height: 20px;

  display: block;

  text-align: center;

  border-radius: 50%;

  color: var(--color-primary);

  font-size: 12px;

  background: rgba(255, 112, 41, 0.15);

}

.why-choose-us-content-area .service-title {

  font-size: 22px;

  line-height: 1.4;

  font-weight: 500;

  margin-bottom: 0;

}

.why-choose-us-content-area .service-contact-area {

  background: var(--color-white);

  padding: 20px 100px 20px 30px;

  max-width: max-content;

  margin-bottom: 30px;

  margin-top: 20px;

}

.why-choose-us-content-area .service-contact-area .title {

  font-size: 18px;

  font-weight: 400;

  margin-bottom: 0;

  font-family: var(--font-secondary);

  color: var(--color-body);

}

.why-choose-us-content-area .service-contact-area .title span {

  color: var(--color-primary);

}

.why-choose-us-content-area .service-contact-area a {

  font-size: 26px;

  line-height: 55px;

  font-weight: 600;

  color: var(--color-heading-1);

  font-family: var(--font-primary);

  display: flex;

  align-items: center;

  gap: 10px;

  margin-top: 15px;

}

.why-choose-us-content-area .service-contact-area a i {

  transform: rotate(90deg);

  height: 45px;

  width: 45px;

  background: var(--secondary-100);

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 20px;

  color: var(--color-primary);

  font-weight: 400;

}

.why-choose-us-content-area .service-contact-area a span {

  line-height: 1;

}

.why-choose-us-content-area .service-btn-area .tmp-btn {

  padding: 25px 33px;

  font-family: var(--font-primary);

}



.tmp-why-choose-us-area2 {

  background: rgba(255, 112, 41, 0.05);

}

.tmp-why-choose-us-area2.inner {

  background: #F6F6F6;

  position: relative;

  z-index: 1;

}

.tmp-why-choose-us-area2.inner img.bg-shape {

  position: absolute;

  z-index: -1;

  top: 0;

  left: 50%;

  transform: translateX(-50%);

  filter: blur(75px);

}

.tmp-why-choose-us-area2.inner .why-choose-wrapper-list li::after {

  background-size: cover;

  background-position: center;

  background-repeat: no-repeat;

}

.tmp-why-choose-us-area2.inner .mid-image-area ul li .counter-area {

  background: var(--color-primary-2);

}



.why-choose-wrapper-list {

  display: flex;

  flex-direction: column;

  gap: 12px;

}

@media only screen and (max-width: 991px) {

  .why-choose-wrapper-list {

    margin-top: 15px;

  }

}

.why-choose-wrapper-list li {

  display: flex;

  gap: 20px;

  padding: 36px 30px 35px;

  background: #FFFFFF;

  box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.06);

  border-radius: 6px;

  position: relative;

  z-index: 1;

  overflow: hidden;

  transition: var(--transition);

  transition-delay: 0s !important;

}

.why-choose-wrapper-list li:hover {

  transform: scale(1.02);

}

.why-choose-wrapper-list li:hover::after {

  opacity: 1;

}

.why-choose-wrapper-list li:hover .icon img {

  animation: bounceIn 1.2s ease;

}

.why-choose-wrapper-list li .icon {

  min-width: 90px;

  max-width: 90px;

  height: 90px;

  border-radius: 50%;

  background: #ffffff;

  display: flex;

  align-items: center;

  justify-content: center;

  box-shadow: var(--shadow-1);

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .why-choose-wrapper-list li .icon {

    min-width: 50px;

    height: 50px;

  }

}

.why-choose-wrapper-list li .icon img {

  max-width: 50px;

  transition: var(--transition);

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .why-choose-wrapper-list li .icon img {

    max-width: 25px;

  }

}

.why-choose-wrapper-list li .text h3 {

  margin-bottom: 7px;

  font-size: 20px;

  line-height: 1.4;

}



.demo-orange .why-choose-wrapper-list li .icon {

  background: var(--secondary-100);

}

.demo-orange .why-choose-wrapper-list li .icon img {

  filter: brightness(0) saturate(100%) invert(49%) sepia(59%) saturate(1333%) hue-rotate(341deg) brightness(101%) contrast(104%);

}



.mid-image-area ul {

  display: flex;

  flex-wrap: wrap;

  gap: 11px;

  justify-content: space-between;

}

.mid-image-area ul li {

  flex-basis: 100%;

  overflow: hidden;

  border-radius: 6px;

}

.mid-image-area ul li img {

  width: 100%;

  height: 100%;

}

.mid-image-area ul li .counter-area {

  background: var(--color-primary);

  height: 100%;

  padding: 33px 20px;

}

.mid-image-area ul li .counter-area .icon {

  width: 57px;

  height: 57px;

  margin: auto;

  margin-bottom: 20px;

}

.mid-image-area ul li .counter-area .counter-wrapper {

  text-align: center;

}

.mid-image-area ul li .counter-area .counter-wrapper .title-main {

  color: var(--color-white);

  font-weight: 600;

  margin-bottom: 0;

}

.mid-image-area ul li .counter-area .counter-wrapper .disc {

  color: var(--color-white);

  font-size: 20px;

  font-weight: 600;

  font-family: var(--font-primary);

}



.tmpServiceSlider .service-wrapper-3 {

  transition: var(--transition);

  border-radius: 6px;

  overflow: hidden;

  display: block;

}

.tmpServiceSlider .service-wrapper-3 .image-area a img {

  width: 100%;

}

@media only screen and (max-width: 991px) {

  .tmpServiceSlider .service-wrapper-3 .image-area .content {

    bottom: 25px;

    flex-direction: column;

    align-items: flex-start !important;

  }

}

@media only screen and (max-width: 767px) {

  .tmpServiceSlider .service-wrapper-3 .image-area a img {

    transform: scale(1.12);

  }

}

@media only screen and (max-width: 767px) and (max-width: 767px) {

  .tmpServiceSlider .service-wrapper-3 .image-area a img {

    width: 100%;

  }

}

@media only screen and (max-width: 767px) {

  .tmpServiceSlider .service-wrapper-3 .image-area .content {

    bottom: 40px !important;

    opacity: 1 !important;

  }

}

@media only screen and (max-width: 767px) and (max-width: 576px) {

  .tmpServiceSlider .service-wrapper-3 .image-area .content {

    bottom: 10px !important;

  }

}

@media only screen and (max-width: 767px) {

  .tmpServiceSlider .service-wrapper-3 .image-area::after {

    bottom: 0 !important;

    opacity: 1 !important;

  }

}

.tmpServiceSlider .service-wrapper-3:hover .image-area a img {

  transform: scale(1.12);

}

@media only screen and (max-width: 767px) {

  .tmpServiceSlider .service-wrapper-3:hover .image-area a img {

    width: 100%;

  }

}

.tmpServiceSlider .service-wrapper-3:hover .image-area .content {

  bottom: 40px;

  opacity: 1;

}

@media only screen and (max-width: 1199px) {

  .tmpServiceSlider .service-wrapper-3:hover .image-area .content {

    bottom: 20px;

  }

}

.tmpServiceSlider .service-wrapper-3:hover .image-area::after {

  bottom: 0;

  opacity: 1;

}

.tmpServiceSlider .service-wrapper-3 .top-content {

  background: var(--color-white);

}

.tmpServiceSlider .service-wrapper-3 .top-content h3 {

  margin-bottom: 0;

  line-height: 1;

  padding: 15px 0 14px;

  font-size: 30px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmpServiceSlider .service-wrapper-3 .top-content h3 {

    font-size: 22px;

  }

}

@media only screen and (max-width: 1199px) {

  .tmpServiceSlider .service-wrapper-3 .top-content h3 {

    font-size: 20px;

  }

}

.tmpServiceSlider .service-wrapper-3 .image-area {

  position: relative;

  z-index: 1;

  display: block;

  overflow: hidden;

}

.tmpServiceSlider .service-wrapper-3 .image-area a {

  display: block;

}

.tmpServiceSlider .service-wrapper-3 .image-area a img {

  transition: 0.4s;

}

.tmpServiceSlider .service-wrapper-3 .image-area .content {

  position: absolute;

  bottom: 0;

  left: 50%;

  transform: translateX(-50%);

  width: 85%;

  z-index: 2;

  opacity: 0;

  transition: var(--transition);

}

.tmpServiceSlider .service-wrapper-3 .image-area .content .title {

  font-size: 32px;

  color: var(--color-white);

}

.tmpServiceSlider .service-wrapper-3 .image-area .content .bottom {

  gap: 15px;

  display: flex;

  align-items: center;

}

.tmpServiceSlider .service-wrapper-3 .image-area .content .bottom .tmp-icon-overlay-link-btn:hover::after {

  background: var(--color-primary);

  border: 2px solid var(--color-primary);

  color: var(--color-white);

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmpServiceSlider .service-wrapper-3 .image-area .content {

    gap: 15px;

  }

}

@media only screen and (max-width: 576px) {

  .tmpServiceSlider .service-wrapper-3 .image-area .content {

    left: 51%;

    transform: translateX(-50%);

    gap: 24px;

    width: 92%;

    flex-direction: column;

    align-items: flex-start;

  }

}

.tmpServiceSlider .service-wrapper-3 .image-area .content .icon-btn {

  min-width: 70px;

  height: 70px;

  line-height: 75px;

  border-radius: 50%;

  display: block;

  text-align: center;

  color: var(--color-primary);

  background: var(--color-white);

  font-size: 27px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmpServiceSlider .service-wrapper-3 .image-area .content .icon-btn {

    min-width: 55px;

    height: 55px;

    line-height: 60px;

  }

}

@media only screen and (max-width: 767px) {

  .tmpServiceSlider .service-wrapper-3 .image-area .content .icon-btn {

    min-width: 59px;

    height: 59px;

    line-height: 64px;

  }

}

.tmpServiceSlider .service-wrapper-3 .image-area .content .icon-btn i {

  transform: rotate(-45deg);

}

.tmpServiceSlider .service-wrapper-3 .image-area .content .desc {

  color: var(--color-white);

  max-width: 345px;

}

@media only screen and (max-width: 576px) {

  .tmpServiceSlider .service-wrapper-3 .image-area .content .desc {

    max-width: 100%;

  }

}

.tmpServiceSlider .service-wrapper-3 .image-area::after {

  position: absolute;

  content: "";

  width: 100%;

  height: 100%;

  bottom: -100%;

  left: 0;

  z-index: 1;

  transition: var(--transition);

  opacity: 0;

  pointer-events: none;

  background: linear-gradient(180.06deg, rgba(0, 0, 0, 0) 0.05%, rgba(13, 13, 13, 0.25) 48.5%, var(--color-primary) 99.95%);

}



.service-list-wrapper {

  padding: 45px 35px 45px;

  background: var(--primary-100);

  text-align: center;

  border-radius: 4px;

  transition: 0.3s;

}

.service-list-wrapper:hover {

  transform: translateY(-5px) scale(1.02);

}

@media only screen and (max-width: 1199px) {

  .service-list-wrapper .title {

    font-size: 22px;

  }

}

.service-list-wrapper .title a {

  transition: var(--transition);

}

.service-list-wrapper .title a:hover {

  color: var(--color-primary-2);

}

.service-list-wrapper .tmp-btn {

  margin: auto;

}



.why-choose-wrapper-list2 {

  display: flex;

  flex-direction: column;

  gap: 50px;

}

.why-choose-wrapper-list2 li {

  display: flex;

  gap: 20px;

  background: #FFFFFF;

  border-radius: 6px;

  position: relative;

  z-index: 1;

  overflow: hidden;

  transition: var(--transition);

}

.why-choose-wrapper-list2 li:hover .icon img {

  animation: bounceIn 1.2s ease;

}

.why-choose-wrapper-list2 li .icon {

  min-width: 65px;

}

.why-choose-wrapper-list2 li .icon img {

  transition: var(--transition);

  max-width: 58px;

}

.why-choose-wrapper-list2 li .text h3 {

  margin-bottom: 10px;

  font-size: 20px;

  line-height: 1.2;

}



.tmp-why-choose-us-area3 .right-side-content {

  position: relative;

  z-index: 1;

}

.tmp-why-choose-us-area3 .right-side-content .content {

  background: var(--color-primary-2);

  border-radius: 10px;

  padding: 30px;

  max-width: 275px;

  position: absolute;

  z-index: 1;

  left: -100px;

  bottom: 60px;

}

@media only screen and (max-width: 991px) {

  .tmp-why-choose-us-area3 .right-side-content .content {

    bottom: 23px;

  }

}

.tmp-why-choose-us-area3 .right-side-content .content h2, .tmp-why-choose-us-area3 .right-side-content .content h6, .tmp-why-choose-us-area3 .right-side-content .content p {

  color: var(--color-white);

}

.tmp-why-choose-us-area3 .right-side-content .content h2 {

  font-size: 60px;

  line-height: 1;

  margin-bottom: 10px;

}

.tmp-why-choose-us-area3 .right-side-content .content h3 {

  margin-bottom: 10px;

  font-size: 20px;

  line-height: 1.2;

  color: var(--color-white);

}

.tmp-why-choose-us-area3 .right-side-content .content p {

  font-size: 12px;

  line-height: 18px;

}



.service-wrapper3 {

  clip-path: polygon(0% 3.03%, 0% 3.03%, 0.025% 2.539%, 0.099% 2.072%, 0.217% 1.638%, 0.376% 1.241%, 0.571% 0.888%, 0.798% 0.585%, 1.053% 0.338%, 1.332% 0.154%, 1.632% 0.04%, 1.948% 0%, 85.62% 0%, 85.62% 0%, 85.763% 0.008%, 85.905% 0.032%, 86.044% 0.073%, 86.181% 0.128%, 86.315% 0.199%, 86.445% 0.285%, 86.571% 0.385%, 86.692% 0.499%, 86.808% 0.628%, 86.918% 0.77%, 99.349% 18.036%, 99.349% 18.036%, 99.468% 18.215%, 99.576% 18.409%, 99.672% 18.614%, 99.757% 18.831%, 99.83% 19.058%, 99.89% 19.293%, 99.938% 19.536%, 99.972% 19.785%, 99.993% 20.039%, 100% 20.296%, 100% 96.97%, 100% 96.97%, 99.975% 97.461%, 99.901% 97.928%, 99.783% 98.362%, 99.624% 98.759%, 99.429% 99.113%, 99.202% 99.415%, 98.947% 99.662%, 98.668% 99.846%, 98.368% 99.96%, 98.052% 100%, 1.948% 100%, 1.948% 100%, 1.632% 99.96%, 1.332% 99.846%, 1.053% 99.662%, 0.798% 99.415%, 0.571% 99.113%, 0.376% 98.759%, 0.217% 98.362%, 0.099% 97.928%, 0.025% 97.461%, 0% 96.97%, 0% 3.03%);

  position: relative;

  z-index: 1;

}

.service-wrapper3:hover::before {

  opacity: 0;

}

.service-wrapper3:hover::after {

  opacity: 1;

  bottom: 0;

}

.service-wrapper3:hover .content {

  bottom: 12px;

}

.service-wrapper3:hover .content .title {

  margin-bottom: 8px;

}

.service-wrapper3::before {

  content: "";

  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 47.81%, rgba(0, 0, 0, 0.37) 58.9%, #000000 100%);

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  z-index: 1;

  position: absolute;

  transition: var(--transition);

  opacity: 1;

}

.service-wrapper3::after {

  content: "";

  width: 100%;

  height: 100%;

  bottom: -100%;

  opacity: 0;

  left: 0;

  z-index: 1;

  position: absolute;

  transition: var(--transition);

  background: linear-gradient(180deg, rgba(255, 94, 20, 0) 0%, rgba(255, 94, 20, 0.15) 47.81%, rgba(255, 94, 20, 0.45) 58.9%, rgba(255, 94, 20, 0.8) 100%);

}

.service-wrapper3 .content {

  position: absolute;

  z-index: 2;

  left: 50%;

  width: 100%;

  max-width: max-content;

  transform: translateX(-50%);

  bottom: -23px;

  text-align: center;

  transition: var(--transition);

}

.service-wrapper3 .content .title {

  margin-bottom: 15px;

  transition: var(--transition);

  line-height: 1;

  font-size: 20px;

}

.service-wrapper3 .content .title a {

  color: var(--color-white);

  transition: var(--transition);

}

.service-wrapper3 .content .service-btn {

  color: var(--color-white);

  font-family: var(--font-primary);

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 7px;

}



.service-wrapper4 {

  display: flex;

  align-items: center;

  background: var(--color-white);

  border-radius: 6px;

  overflow: hidden;

}

.service-wrapper4 .content {

  padding: 30px 20px 30px 40px;

  flex-basis: 53%;

}

.service-wrapper4 .content .sub-title {

  color: var(--color-primary-2);

  line-height: 1;

  font-size: 14px;

  background: var(--primary-100);

  border-radius: 2px;

  max-width: max-content;

  padding: 10px 18px 8px;

  margin-bottom: 20px;

}

.service-wrapper4 .content .title {

  font-size: 34px;

  line-height: 1;

}

@media only screen and (max-width: 576px) {

  .service-wrapper4 .content .title {

    font-size: 22px;

  }

}

.service-wrapper4 .image-area {

  flex-basis: 47%;

  display: block;

  overflow: hidden;

}

.service-wrapper4 .image-area img {

  transition: all 0.3s;

}

.service-wrapper4:hover .image-area img {

  transform: scale(1.05);

}



.service-wrapper-mini {

  display: flex;

  align-items: center;

  gap: 12px;

  border-radius: 3px;

  flex-direction: column;

}

.service-wrapper-mini .image {

  border-radius: 50%;

  overflow: hidden;

  width: 150px;

  height: 150px;

}

.service-wrapper-mini .image img {

  transition: 0.3s;

  width: 150px;

}

.service-wrapper-mini .text {

  margin-bottom: 0;

  font-size: 16px;

  line-height: 1;

  color: var(--color-heading-1);

}

.service-wrapper-mini:hover .image img {

  transform: scale(1.1);

}



.tmpServiceSlider3 .swiper-navigation .swiper-btn {

  transform: translateY(-50%);

  font-size: 18px;

  background: #FFFFFF;

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

  width: 40px;

  height: 40px;

  line-height: 44px;

  display: block;

  text-align: center;

  border-radius: 50%;

  transition: 0.3s;

  top: 55%;

  color: var(--color-heading-1);

}

.tmpServiceSlider3 .swiper-navigation .swiper-btn i {

  color: var(--color-primary);

}

.tmpServiceSlider3 .swiper-navigation .swiper-btn::after {

  display: none;

}

.tmpServiceSlider3 .swiper-navigation .swiper-btn.swiper-button-prev {

  left: 60px;

  opacity: 0;

}

@media only screen and (max-width: 1199px) {

  .tmpServiceSlider3 .swiper-navigation .swiper-btn.swiper-button-prev {

    left: 30px;

  }

}

.tmpServiceSlider3 .swiper-navigation .swiper-btn.swiper-button-next {

  right: 60px;

  opacity: 0;

}

@media only screen and (max-width: 1199px) {

  .tmpServiceSlider3 .swiper-navigation .swiper-btn.swiper-button-next {

    right: 30px;

  }

}

.tmpServiceSlider3 .swiper-navigation .swiper-btn:hover {

  background: var(--color-primary);

  transform: translateY(-50%) scale(1.15);

}

.tmpServiceSlider3 .swiper-navigation .swiper-btn:hover i {

  color: #fff;

}

.tmpServiceSlider3:hover .swiper-navigation .swiper-button-prev {

  left: 30px;

  opacity: 1;

}

@media only screen and (max-width: 1199px) {

  .tmpServiceSlider3:hover .swiper-navigation .swiper-button-prev {

    left: 30px;

  }

}

.tmpServiceSlider3:hover .swiper-navigation .swiper-button-next {

  right: 30px;

  opacity: 1;

}

@media only screen and (max-width: 1199px) {

  .tmpServiceSlider3:hover .swiper-navigation .swiper-button-next {

    right: 30px;

  }

}



.service-wrapper5 {

  position: relative;

  z-index: 1;

  overflow: hidden;

  border-radius: 4px;

  transition: var(--transition);

  margin-top: -110px;

  box-shadow: var(--shadow-1);

}

.service-wrapper5 .image-area img {

  transition: 0.3s;

}

.service-wrapper5:hover .image-area img {

  transform: scale(1.05);

}

.service-wrapper5:hover .content-area {

  bottom: 0 !important;

}

.service-wrapper5:hover .content-area p, .service-wrapper5:hover .content-area a {

  opacity: 1;

}

.service-wrapper5 .content-area {

  padding: 20px 20px 20px 20px;

  background: var(--color-white);

  transition: var(--transition);

  position: absolute;

  width: 100%;

  bottom: -35%;

  left: 0;

  z-index: 1;

}

@media (max-width: 768px) {

  .service-wrapper5 .content-area {

    bottom: -30% !important;

  }

}

@media only screen and (max-width: 767px) {

  .service-wrapper5 .content-area {

    bottom: -30% !important;

  }

}

@media only screen and (max-width: 576px) {

  .service-wrapper5 .content-area {

    bottom: 0 !important;

  }

  .service-wrapper5 .content-area p {

    opacity: 1 !important;

  }

  .service-wrapper5 .content-area a {

    opacity: 1 !important;

  }

}

.service-wrapper5 .content-area .title {

  margin-bottom: 5px;

  font-size: 20px;

  line-height: 1.2;

}

.service-wrapper5 .content-area p {

  font-size: 14px;

  line-height: 24px;

  margin-bottom: 10px;

  opacity: 0;

  transition: var(--transition);

}

.service-wrapper5 .content-area a {

  color: var(--color-primary-2);

  display: flex;

  align-items: center;

  max-width: max-content;

  gap: 5px;

  line-height: 1;

  padding-bottom: 2px;

  opacity: 0;

  transition: var(--transition);

}

.service-wrapper5 .content-area a i {

  transform: rotate(-45deg);

}



.border-radius-0 {

  border-radius: 0 !important;

}



.z-0 {

  z-index: 0 !important;

}



.service-wrapper6 {

  display: flex;

  align-items: center;

  gap: 15px;

  padding: 26px 30px;

  border-radius: 3px;

  box-shadow: 0px 6px 34px rgba(215, 216, 222, 0.41);

  transition: 0.3s;

  height: 100%;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .service-wrapper6 {

    flex-direction: column;

    gap: 20px;

  }

}

.service-wrapper6 .icon img {

  opacity: 0.6;

  transition: 0.3s;

}

.service-wrapper6 .icon svg {

  max-width: 48px;

  height: 48px;

}

.service-wrapper6:hover {

  transform: scale(1.04);

}

.service-wrapper6:hover .icon img {

  opacity: 1;

}

.service-wrapper6 h4 {

  margin-bottom: -5px;

  font-size: 20px;

}

.service-wrapper6 .content p.desc {

  margin-top: 7px;

  font-weight: 500;

}



.service-wrapper7 {

  background: var(--color-white);

  border-radius: 8px;

  box-shadow: 0px 6px 34px rgba(215, 216, 222, 0.41);

  padding: 30px;

  position: relative;

  overflow: hidden;

  z-index: 1;

  transition: 0.3s;

  height: 100%;

}

@media only screen and (max-width: 1199px) {

  .service-wrapper7 {

    padding: 30px 20px;

  }

}

@media only screen and (max-width: 576px) {

  .service-wrapper7 {

    padding: 20px !important;

  }

}

.service-wrapper7 .icon {

  margin-bottom: 120px;

  height: 86px;

}

@media only screen and (max-width: 991px) {

  .service-wrapper7 .icon {

    height: 70px;

    margin-bottom: 50px;

  }

}

.service-wrapper7 .icon img {

  max-width: 55px;

}

.service-wrapper7 .title {

  font-size: 28px;

  line-height: 1.4;

  margin-bottom: 10px;

  transition: 0.3s;

}

.service-wrapper7 .desc {

  color: var(--color-body-2);

  font-size: 16px;

  margin-bottom: 0;

  line-height: 1.5;

}

.service-wrapper7 .tag {

  color: var(--color-primary-2);

  background: var(--primary-100);

  line-height: 1;

  padding: 10px 60px;

  top: 35px;

  right: -40px;

  transform: rotate(45deg);

  position: absolute;

  z-index: 1;

  font-size: 20px;

  font-weight: 500;

}

.service-wrapper7:hover {

  transform: scale(1.02);

}

.service-wrapper7:hover .title {

  color: var(--color-primary);

}

.service-wrapper-8 {

  padding: 0 33px 30px 0;

  position: relative;

  z-index: 1;

  transition: var(--transition);

}

.service-wrapper-8:hover .image-area img {

  transform: scale(105%);

}

.service-wrapper-8:hover .content-area .title:hover a {

  color: var(--color-primary);

}

.service-wrapper-8 .image-area {

  overflow: hidden;

  transition: var(--transition);

  border-radius: 6px;

}

.service-wrapper-8 .image-area img {

  transition: var(--transition);

  transform: scale(100%);

}

.service-wrapper-8 .content-area {

  max-width: 344px;

  width: 100%;

  position: absolute;

  z-index: 1;

  background: var(--color-white);

  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.05);

  border-radius: 6px;

  bottom: 0;

  right: 0;

  padding: 27px 30px 26px;

  overflow: hidden;

}

.service-wrapper-8 .content-area::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  z-index: -1;

  background: var(--color-primary-2);

  opacity: 0;

  transition: var(--transition);

}

.service-wrapper-8 .content-area .title {

  font-weight: 600;

  line-height: 1;

  font-size: 20px;

  margin-bottom: 10px;

  transition: var(--transition);

}

@media only screen and (max-width: 1199px) {

  .service-wrapper-8 .content-area .title {

    font-size: 16px;

  }

}

.service-wrapper-8 .content-area .title a {

  color: var(--color-heading-1);

  transition: var(--transition);

}

.service-wrapper-8 .content-area .read-more-btn {

  display: flex;

  align-items: center;

  gap: 10px;

  color: var(--color-body);

  font-weight: 400;

  font-family: var(--font-secondary);

  max-width: max-content;

  transition: var(--transition);

}

.service-wrapper-8 .content-area .read-more-btn .icon {

  width: 30px;

  height: 30px;

  background: var(--primary-100);

  border-radius: 100%;

  text-align: center;

  transition: var(--transition);

  display: flex;

  align-items: center;

  justify-content: center;

}

.service-wrapper-8 .content-area .read-more-btn .icon i {

  color: var(--color-primary-2);

  transform: rotate(-45deg);

  transition: var(--transition);

  font-size: 14px;

}

.service-wrapper-8 .content-area .icon-tag {

  width: 60px;

  height: 60px;

  background: var(--primary-100);

  top: 0;

  right: 0;

  position: absolute;

  z-index: 1;

  transition: var(--transition);

  border-radius: 0 0 0 87%;

}

.service-wrapper-8 .content-area .icon-tag img {

  max-width: 30px;

  margin: 0 auto;

  position: absolute;

  left: 57%;

  top: 40%;

  transform: translate(-50%, -50%);

}

.service-wrapper-8 .content-area .icon-tag::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  background: var(--color-white);

  top: 0;

  left: 0;

  z-index: -1;

  opacity: 0;

  transition: var(--transition);

}



@media only screen and (max-width: 991px) {

  .tmp-award-area p.desc br {

    display: none;

  }

}



.over_link {

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

}



.service-wrapper-9 {

  border-radius: 6px;

  background: transparent;

  overflow: hidden;

  transition: var(--transition);

  position: relative;

  z-index: 1;

  background: var(--color-white);

  box-shadow: var(--shadow-1);

  padding: 30px;

  gap: 30px;

}

@media only screen and (max-width: 1199px) {

  .service-wrapper-9 {

    gap: 20px;

    flex-direction: column;

    align-items: flex-start !important;

  }

}

@media only screen and (max-width: 991px) {

  .service-wrapper-9 {

    padding: 25px;

  }

}

@media only screen and (max-width: 576px) {

  .service-wrapper-9 {

    gap: 20px;

  }

}

@media only screen and (max-width: 576px) {

  .service-wrapper-9.mobile-image-first {

    flex-direction: column-reverse;

  }

}

.service-wrapper-9::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  background: #A6C173;

  opacity: 0;

  transition: var(--transition);

  z-index: -1;

}

.service-wrapper-9:hover {

  transform: scale(1.02);

}

.service-wrapper-9:hover .shape {

  opacity: 0;

}

.service-wrapper-9:hover .content-area .icon img {

  animation: bounceIn 1.2s ease;

}

.service-wrapper-9:hover .image-area img {

  transform: scale(1.02);

}

.service-wrapper-9 .content-area {

  max-width: 278px;

}

@media only screen and (max-width: 991px) {

  .service-wrapper-9 .content-area {

    margin: 0;

    max-width: 100%;

  }

}

@media only screen and (max-width: 767px) {

  .service-wrapper-9 .content-area {

    margin: 0 0 0 20px;

  }

}

@media only screen and (max-width: 576px) {

  .service-wrapper-9 .content-area {

    margin: 0;

  }

}

.service-wrapper-9 .content-area .icon {

  background: var(--color-primary-2);

  width: 90px;

  height: 90px;

  display: flex;

  align-items: center;

  justify-content: center;

  line-height: 90px;

  border-radius: 50%;

  margin-bottom: 30px;

  transition: var(--transition);

}

@media only screen and (max-width: 767px) {

  .service-wrapper-9 .content-area .icon {

    margin-bottom: 10px;

  }

}

.service-wrapper-9 .content-area .icon img {

  max-width: 50px;

}

.service-wrapper-9 .content-area .heading-title {

  margin-bottom: 10px;

  font-size: 20px;

  line-height: 1.2;

}

.service-wrapper-9 .content-area .heading-title a {

  transition: var(--transition);

}

.service-wrapper-9 .content-area .desc {

  transition: var(--transition);

}

.service-wrapper-9 .image-area {

  border-radius: 5px;

  overflow: hidden;

  display: block;

}

@media only screen and (max-width: 1199px) {

  .service-wrapper-9 .image-area {

    width: 100%;

  }

}

.service-wrapper-9 .image-area img {

  transition: var(--transition);

}

@media only screen and (max-width: 1199px) {

  .service-wrapper-9 .image-area img {

    width: 100%;

  }

}



.home-green .service-wrapper-9 .content-area .icon {

  background: var(--primary-50);

}



.tmp-service-details-area {

  position: relative;

  z-index: 1;

}

.tmp-service-details-area .left-sidebar .single-wrapper {

  background: rgb(255, 255, 255);

  padding: 30px;

  border-radius: 5px;

  box-shadow: var(--shadow-1);

}

.tmp-service-details-area .left-sidebar .single-wrapper .title {

  font-size: 24px;

  line-height: 1.2;

}

.tmp-service-details-area .left-sidebar .single-wrapper .title-main {

  font-size: 24px;

  line-height: 1.2;

}

.tmp-service-details-area .left-sidebar .single-wrapper ul {

  display: flex;

  flex-direction: column;

  gap: 10px;

}

.tmp-service-details-area .left-sidebar .single-wrapper ul li a {

  display: flex;

  align-items: center;

  justify-content: space-between;

  line-height: 1;

  background: var(--color-white);

  border-radius: 4px;

  padding: 12px 20px;

  font-size: 16px;

  font-weight: 600;

  font-family: var(--font-primary);

  transition: var(--transition);

  box-shadow: var(--shadow-1);

}

.tmp-service-details-area .left-sidebar .single-wrapper ul li a:hover {

  background: var(--color-primary-2);

  color: var(--color-white);

}

.tmp-service-details-area .left-sidebar .single-wrapper ul li a:hover span {

  background: rgba(255, 255, 255, 0.2);

}

.tmp-service-details-area .left-sidebar .single-wrapper ul li a:hover span i {

  color: var(--color-white);

  transform: rotate(0);

}

.tmp-service-details-area .left-sidebar .single-wrapper ul li a span {

  width: 34px;

  line-height: 34px;

  height: 34px;

  display: block;

  text-align: center;

  border-radius: 2px;

  background: rgba(205, 205, 205, 0.2);

  color: var(--color-body);

  transition: var(--transition);

}

.tmp-service-details-area .left-sidebar .single-wrapper ul li a span i {

  transform: rotate(-45deg);

  transition: var(--transition);

}

.tmp-service-details-area .left-sidebar .single-wrapper .content {

  display: flex;

  align-items: center;

  gap: 15px;

}

.tmp-service-details-area .left-sidebar .single-wrapper .content .icon a {

  display: block;

  background: var(--color-white);

  color: var(--color-primary-2);

  font-size: 24px;

  width: 66px;

  height: 66px;

  line-height: 68px;

  border-radius: 50%;

  text-align: center;

  box-shadow: var(--shadow-1);

}

.tmp-service-details-area .left-sidebar .single-wrapper .content .text .title {

  font-size: 24px;

  line-height: 1;

  color: #717580;

  font-weight: 400;

  margin-bottom: 12px;

}

.tmp-service-details-area .left-sidebar .single-wrapper .content .text a {

  color: var(--color-primary-2);

  font-weight: 600;

  font-family: var(--font-primary);

  font-size: 24px;

}

.tmp-service-details-area .left-sidebar .service-card {

  padding: 30px 0;

  background: var(--color-white);

  border-radius: 10px;

  box-shadow: var(--shadow-1);

}

.tmp-service-details-area .left-sidebar .service-card .logo {

  padding: 0 30px;

  margin-bottom: 20px;

  display: block;

}

.tmp-service-details-area .left-sidebar .service-card .image-area {

  margin-bottom: 30px;

}

.tmp-service-details-area .left-sidebar .service-card .content-area {

  padding: 0 30px;

}

.tmp-service-details-area .left-sidebar .service-card .content-area h6,

.tmp-service-details-area .left-sidebar .service-card .content-area .title {

  margin-bottom: 10px;

  font-size: 20px;

  line-height: 1.2;

}

.tmp-service-details-area .left-sidebar .single-input-wrapper {

  position: relative;

  z-index: 1;

}

.tmp-service-details-area .left-sidebar .single-input-wrapper input {

  padding: 8px 20px;

  background: var(--color-white);

  border-radius: 33px;

  border: 2px solid var(--color-border);

}

.tmp-service-details-area .left-sidebar .single-input-wrapper input:focus {

  border: 2px solid var(--color-primary);

}

.tmp-service-details-area .left-sidebar .single-input-wrapper button {

  position: absolute;

  z-index: 1;

  top: 50%;

  transform: translateY(-50%);

  right: 20px;

  max-width: max-content;

  border: none;

  padding: 0;

  font-weight: 400;

}

@media only screen and (max-width: 576px) {

  .tmp-service-details-area .right-content-area {

    padding: 15px;

  }

}

.tmp-service-details-area .right-content-area.with-radious {

  border-radius: 10px;

}

.tmp-service-details-area .right-content-area h3.title {

  margin-bottom: 10px;

}

.tmp-service-details-area .right-content-area ul {

  display: flex;

  justify-content: space-between;

}

@media only screen and (max-width: 767px) {

  .tmp-service-details-area .right-content-area ul {

    flex-wrap: wrap;

    gap: 20px;

  }

}

.tmp-service-details-area .right-content-area ul li {

  max-width: 350px;

}

.tmp-service-details-area .right-content-area ul li .title {

  font-size: 24px;

}

.tmp-service-details-area .right-content-area .image-area {

  position: relative;

  z-index: 1;

}

.tmp-service-details-area .right-content-area .image-area .inner-card {

  max-width: 357px;

  width: 100%;

  border-radius: 4px;

  overflow: hidden;

  position: absolute;

  right: 30px;

  bottom: 30px;

}

@media only screen and (max-width: 767px) {

  .tmp-service-details-area .right-content-area .image-area .inner-card {

    position: relative;

    bottom: 0;

    left: 0;

    max-width: 100%;

  }

}

.tmp-service-details-area .right-content-area .image-area .inner-card .content {

  background: var(--color-white);

  padding: 30px;

}

@media only screen and (max-width: 767px) {

  .tmp-service-details-area .right-content-area .image-area .inner-card .content {

    background: #f7f7f7;

  }

}

.tmp-service-details-area .right-content-area .image-area .inner-card .button-area {

  display: flex;

  align-items: center;

  gap: 10px;

  color: var(--color-white);

  font-family: var(--font-primary);

  width: 100%;

  background: var(--color-heading-1);

  justify-content: center;

  padding: 17px 0;

  line-height: 1;

  font-weight: 600;

  font-size: 14px;

}

.tmp-service-details-area .right-content-area .tmp-service-area {

  background: none;

}

.tmp-service-details-area .right-content-area .tmp-service-area .slider-inner {

  background: rgba(135, 171, 66, 0.1);

  padding: 42px 0 42px 30px;

}

.tmp-service-details-area.shop .left-sidebar .single-wrapper ul li a {

  display: flex;

  align-items: center;

  justify-content: space-between;

  background: var(--color-white);

  color: var(--color-heading-1);

  border-radius: 4px;

  padding: 10px 20px;

  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.06);

  font-weight: 600;

  transition: var(--transition);

}

.tmp-service-details-area.shop .left-sidebar .single-wrapper ul li:hover a {

  background: var(--color-primary);

  color: var(--color-white);

  transform: scale(1.01);

}

.tmp-service-details-area.shop .left-sidebar .single-wrapper ul li:hover a i {

  transform: rotate(0);

}

.tmp-service-details-area.shop .left-sidebar .single-wrapper ul li span {

  background: var(--color-primary);

  height: 34px;

  width: 34px;

  line-height: 34px;

  padding: 0;

  border-radius: 2px;

  text-align: center;

  display: block;

  color: var(--color-white);

  transition: var(--transition);

}

.tmp-service-details-area.shop .left-sidebar .single-wrapper ul li span i {

  transform: rotate(-45deg);

  transition: var(--transition);

}



.faq-content-area.inner.with-box-shadow .accordion-item {

  box-shadow: var(--shadow-1);

  border: none;

  background: var(--color-white);

}

.faq-content-area.inner.with-box-shadow .accordion-item:last-child {

  margin-bottom: 0;

}

.faq-content-area.inner .accordion-item {

  border: 1px solid #E4E4E4;

  border-radius: 6px;

  padding: 17px 17px 20px 20px;

}

.faq-content-area.inner .accordion-item h2 {

  margin-bottom: 0;

}

.faq-content-area.inner .accordion-item .accordion-button {

  display: flex;

  align-items: center;

  gap: 10px;

  transition: 0.3s;

}

.faq-content-area.inner .accordion-item .accordion-button[aria-expanded=true] {

  padding-bottom: 17px;

  border-bottom: 1px dashed #c9d1d1;

}

.faq-content-area.inner .accordion-item .accordion-button img {

  max-width: 34px;

}

.faq-content-area.inner .accordion-item .accordion-body {

  padding-top: 15px;

  margin-top: 0;

}

.faq-content-area.inner .accordion-item .accordion-body p.desc {

  font-size: 16px;

}

.faq-content-area.inner .accordion-one .accordion-item h2 button[aria-expanded=true] {

  color: var(--color-primary-2);

}

.faq-content-area.inner .accordion-one .accordion-item h2 button[aria-expanded=true]::after {

  margin-top: 0;

}



.faq-box-fill {

  position: relative;

  height: 100%;

}

.faq-box-fill .box-area {

  background: #ecf0f0;

  position: absolute;

  bottom: 0;

  right: 0;

  left: auto;

  inset-inline-start: 0;

  max-width: 241px;

  width: 100%;

  padding: 15px 15px 0 0;

  border-start-end-radius: 12px;

  max-width: 239px;

  bottom: 0;

  inset-inline-end: 0;

  inset-inline-start: inherit;

  padding: 15px 0 0 15px;

  border-start-start-radius: 12px;

  border-start-end-radius: 0;

}

.faq-box-fill .box-area::before, .faq-box-fill .box-area::after {

  content: "";

  position: absolute;

  inset-inline-start: 0;

  top: -13px;

  width: 13px;

  height: 13px;

  background: url("data:image/svg+xml,%3Csvg viewBox='0 0 11 11' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 1.54972e-06L0 0L2.38419e-07 11C1.65973e-07 4.92487 4.92487 1.62217e-06 11 1.54972e-06Z' fill='%23ecf0f0'/%3E%3C/svg%3E");

  transform: rotate(-90deg);

}

.faq-box-fill .box-area::before {

  inset-inline-start: inherit;

  inset-inline-end: 0;

  -webkit-transform: rotate(180deg);

  -ms-transform: rotate(180deg);

  transform: rotate(180deg);

}

.faq-box-fill .box-area::after {

  nset-inline-start: auto;

  top: auto;

  inset-inline-end: -13px;

  bottom: 0;

}

.faq-box-fill .box-area::after {

  -webkit-transform: rotate(180deg);

  -ms-transform: rotate(180deg);

  transform: rotate(180deg);

  inset-inline-start: -12px;

  inset-inline-end: inherit;

}

.faq-box-fill .box-area .call-box {

  background-color: var(--color-primary);

  border-radius: 10px;

  padding: 25px 20px 30px;

}

.faq-box-fill .box-area .call-box .title {

  color: var(--color-white);

  font-weight: 500;

  max-width: 145px;

  margin-bottom: 29px;

  font-size: 24px;

}

.faq-box-fill .box-area .call-box .call-icon {

  display: -webkit-inline-box;

  display: -ms-inline-flexbox;

  display: inline-flex;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  -webkit-box-pack: center;

  -ms-flex-pack: center;

  justify-content: center;

  background-color: var(--color-white);

  color: var(--color-white);

  font-size: 20px;

  height: 52px;

  width: 52px;

  border-radius: 50%;

  margin-bottom: 9px;

}

.faq-box-fill .box-area .call-box .call-icon i {

  color: var(--color-primary);

  font-weight: 600;

}

.faq-box-fill .box-area .call-box a.number {

  color: var(--color-white);

  font-size: 20px;

  font-weight: 700;

  display: -webkit-inline-box;

  display: -ms-inline-flexbox;

  display: inline-flex;

  line-height: 1;

}

.faq-box-fill .box-area .call-box a.number span {

  position: relative;

}

.faq-box-fill .box-area .call-box a.number span::after {

  content: "";

  position: absolute;

  bottom: -2px;

  inset-inline-end: 0;

  width: 100%;

  height: 1px;

  background-color: currentColor;

}



.faq-left-fill-style {

  height: 100%;

  box-shadow: var(--shadow-1);

  background: var(--color-white);

  padding: 50px 35px;

}

@media only screen and (max-width: 991px) {

  .faq-left-fill-style {

    height: 550px;

  }

}

.faq-left-fill-style .title {

  margin-bottom: 40px;

}

.faq-left-fill-style .icon {

  position: absolute;

  left: 35px;

  bottom: 40px;

}

@media only screen and (max-width: 576px) {

  .faq-left-fill-style .icon {

    display: none;

  }

}

.faq-left-fill-style .icon svg {

  width: 140px;

  height: 140px;

  transition: 0.8s;

}

.faq-left-fill-style .icon svg path {

  fill: var(--color-primary);

}

.faq-left-fill-style:hover .icon svg {

  transform: rotateY(360deg);

}



.tmp-solar-solution-area .accordion-one .accordion-item .accordion-body p.desc {

  font-size: 16px;

  max-width: 478px;

}

.tmp-solar-solution-area .accordion-one .accordion-item h2 button[aria-expanded=true] {

  color: var(--color-primary-2);

}



.solution-wrapper {

  padding: 35px 40px 27px 30px;

  border-radius: 6px;

  transition: var(--transition);

  height: 100%;

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

}

@media only screen and (max-width: 1199px) {

  .solution-wrapper {

    padding: 20px 15px;

  }

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .solution-wrapper.in-bio-energy h3 {

    font-size: 30px;

  }

}

@media only screen and (max-width: 1199px) {

  .solution-wrapper.in-bio-energy h3 {

    font-size: 30px;

  }

}

.solution-wrapper:hover {

  transform: translateY(-5px) scale(1.02);

  box-shadow: var(--shadow-1);

}

.solution-wrapper .content {

  padding-bottom: 20px;

  margin-bottom: 20px;

  border-bottom: 1px solid var(--color-border);

}

.solution-wrapper .content h3 {

  line-height: 1.2;

  margin-bottom: 15px;

  font-size: 20px;

}

.solution-wrapper .content .desc {

  font-size: 16px;

  line-height: 1.4;

}

.solution-wrapper h3 {

  font-size: 40px;

  line-height: 1;

  margin-bottom: 0;

  display: flex;

  align-items: center;

}



.bg-body-2 {

  background: var(--primary-50);

}



.radious-0 {

  border-radius: 0;

}



.content-quick-contact-service .title {

  font-size: 26px;

}

.content-quick-contact-service form .single-quick-action {

  position: relative;

  margin-bottom: 20px;

}

.content-quick-contact-service form .single-quick-action i {

  position: absolute;

  top: 14px;

  left: 12px;

}

.content-quick-contact-service form .single-quick-action:last-child {

  margin-bottom: 0;

}

.content-quick-contact-service form .single-quick-action input,

.content-quick-contact-service form .single-quick-action textarea {

  border: 1px solid #ddd;

  border-radius: 4px;

  padding: 5px 33px;

}

.content-quick-contact-service form .single-quick-action input::placeholder,

.content-quick-contact-service form .single-quick-action textarea::placeholder {

  color: rgba(113, 117, 128, 0.4980392157) !important;

}

.content-quick-contact-service form .single-quick-action input:focus,

.content-quick-contact-service form .single-quick-action textarea:focus {

  border-color: var(--color-primary);

}

.content-quick-contact-service form .single-quick-action input {

  height: 45px;

}

.content-quick-contact-service form .single-quick-action textarea {

  height: 115px;

  padding: 7px 33px;

}

.content-quick-contact-service form button {

  border: none;

}



.invers-feature-card-one {

  background: var(--color-white);

  border-radius: 10px;

  padding: 30px 25px;

  position: relative;

  height: 100%;

  z-index: 2;

  transition: 0.3s;

}

.invers-feature-card-one .icon {

  width: 65px;

  height: 65px;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

  background: var(--color-primary);

  box-shadow: var(--shadow-1);

  flex: 0 0 auto;

}

.invers-feature-card-one .icon img {

  filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(28%) hue-rotate(74deg) brightness(108%) contrast(107%);

  max-width: 35px;

}

.invers-feature-card-one .card-title {

  margin-bottom: 0;

  font-size: 20px;

  line-height: 1.5;

}

.invers-feature-card-one .description {

  margin-top: 20px;

  margin-bottom: 0;

}

.invers-feature-card-one:hover {

  transform: scale(1.02);

}

.invers-feature-card-one:hover .icon img {

  animation: bounceIn 1.3s ease;

}



.margin-top-feature-ev-charging.margin-top-feature-ev-charging {

  margin-top: -140px;

}



.margin-top-feature-bio-energy {

  margin-top: -90px;

}

.margin-top-feature-bio-energy .invers-feature-card-one {

  box-shadow: var(--shadow-1);

}

.margin-top-feature-bio-energy .invers-feature-card-one .with-flex-column {

  flex-direction: column;

  align-items: flex-start;

}

.margin-top-feature-bio-energy .invers-feature-card-one .with-flex-column .icon {

  border-radius: 5px;

}

.margin-top-feature-bio-energy .invers-feature-card-one .with-flex-column .card-title {

  margin-top: 90px !important;

}



.col-lg-3 .service-with-thumbnail {

  padding: 20px;

}



.service-with-thumbnail {

  padding: 30px;

  border-radius: 8px;

  background: var(--color-white);

  transition: 0.3s;

  height: 100%;

}

@media only screen and (max-width: 767px) {

  .service-with-thumbnail {

    padding: 15px;

  }

}

.service-with-thumbnail:hover {

  transform: scale(1.02);

}

.service-with-thumbnail:hover .thumbnail::after {

  opacity: 1;

}

.service-with-thumbnail:hover .thumbnail .tmp-btn {

  opacity: 1;

  transform: translate(-50%, -50%);

}

.service-with-thumbnail .thumbnail {

  display: block;

  overflow: hidden;

  border-radius: 6px;

  position: relative;

}

.service-with-thumbnail .thumbnail::after {

  position: absolute;

  content: "";

  background: linear-gradient(0deg, rgba(33, 37, 41, 0.7490196078) 0%, rgba(0, 0, 0, 0) 100%);

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  transition: 0.3s;

  opacity: 0;

  border-radius: 8px;

}

.service-with-thumbnail .thumbnail .tmp-btn {

  position: absolute;

  top: 50%;

  left: 50%;

  opacity: 0;

  transform: translate(-50%, -20%);

}

.service-with-thumbnail .content {

  margin-top: 30px;

    text-align: center;

}

.service-with-thumbnail .content a {

}

.service-with-thumbnail .content a .title {

  font-size: 23px;

  line-height: 1.3;

  margin-bottom: 0;

  font-weight: 700;

  transition: 0.3s;

}

@media only screen and (max-width: 767px) {

  .service-with-thumbnail .content a .title {

    font-size: 20px;

  }

}

.service-with-thumbnail .content a:hover .title {

  color: var(--color-primary);

}

.service-with-thumbnail .content p.disc {

  margin-top: 20px;

}

@media only screen and (max-width: 991px) {

  .service-with-thumbnail .content p.disc {

    margin-top: 8px;

  }

}

@media only screen and (max-width: 576px) {

  .service-with-thumbnail .content p.disc {

    margin-top: 8px;

  }

}



.single-feature-area-modern {

  border-radius: 6px;

  padding: 50px 28px 45px;

  box-shadow: var(--shadow-1);

  transition: 0.3s;

  height: 100%;

  position: relative;

}

.single-feature-area-modern:hover {

  transform: scale(1.05);

}

.single-feature-area-modern:hover svg {

  animation: bounceIn 1.3s ease;

}

.single-feature-area-modern .invers-feature-icon {

  margin-bottom: 70px;

  max-width: 88px;

  height: 88px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .single-feature-area-modern .invers-feature-icon {

    margin-bottom: 50px;

  }

}

.single-feature-area-modern .title {

  margin-bottom: 15px;

  font-size: 24px;

  line-height: 1.2;

}

.single-feature-area-modern p.desc {

  margin-bottom: 0;

}



.service-mini-style {

  padding: 30px 40px;

  position: relative;

  z-index: 1;

  background: var(--color-white);

  box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.06);

  border-radius: 4px;

  transition: all 0.3s;

  height: 100%;

}

@media only screen and (max-width: 1199px) {

  .service-mini-style {

    padding: 20px 15px;

  }

}

.service-mini-style .item-head {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-bottom: 50px;

}

.service-mini-style .item-head .icon {

  display: inline-block;

  transition: 0.9s;

}

.service-mini-style .item-head .icon svg {

  max-width: 60px;

  height: 60px;

}

.service-mini-style .title {

  font-size: 22px;

  font-weight: 500;

  line-height: 30px;

  margin-bottom: 0;

}

.service-mini-style .tmp-icon-overlay-link-btn::after {

  background-color: rgba(188, 191, 192, 0.2588235294);

}

.service-mini-style .tmp-icon-overlay-link-btn:hover:after {

  background-color: var(--color-primary);

}

.service-mini-style:hover {

  transform: scale(1.02) translateY(-3px);

}



.tmp-testimonials-area .client-content .section-title-area .section-title {

  font-weight: 600;

}

.tmp-testimonials-area .client-content .reveiw-area {

  display: flex;

  align-items: center;

  gap: 20px;

}

@media only screen and (max-width: 576px) {

  .tmp-testimonials-area .client-content .reveiw-area {

    flex-wrap: wrap;

    align-items: flex-start;

  }

}

.tmp-testimonials-area .client-content .reveiw-area .counter-area {

  padding: 15px 80px 15px 20px;

  background: rgba(255, 112, 41, 0.1);

  border-radius: 5px;

}

.tmp-testimonials-area .client-content .reveiw-area .counter-area .title {

  font-size: 26px;

  line-height: 38px;

  font-weight: 600;

  color: var(--color-primary);

  margin-bottom: 0;

  font-family: var(--font-secondary);

}

.tmp-testimonials-area .client-content .reveiw-area .counter-area .star-rating {

  padding: 0;

  margin: 0;

  display: flex;

  align-items: center;

  gap: 3px;

}

.tmp-testimonials-area .client-content .reveiw-area .counter-area .star-rating li {

  color: var(--color-primary);

  list-style: none;

  padding: 0;

  margin: 0;

}

.tmp-testimonials-area .client-content .reveiw-area .desc {

  color: var(--color-heading-1);

  font-family: var(--font-primary);

  font-weight: 600;

  padding-left: 20px;

  border-left: 3px solid rgba(228, 228, 228, 0.4588235294);

}

.tmp-testimonials-area.area-4 .section-inner {

  margin: 60px 100px 0;

}



.tmp-testimonials-area2 {

  background: var(--primary-50);

}



.testimonial-slider-area {

  margin-left: 40px;

}



.testimonial-wrapper {

  background: var(--color-white);

  padding: 40px 20px 20px 30px;

  border-left: 4px solid #E4E4E4;

  box-shadow: 0px 5px 10px 5px rgba(158, 158, 158, 0.05);

  position: relative;

  z-index: 1;

}

.testimonial-wrapper .top-content {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-bottom: 40px;

}

.testimonial-wrapper .top-content .title-area .title {

  margin-bottom: 5px;

  font-size: 20px;

  line-height: 1.2;

}

.testimonial-wrapper .top-content .star-rating {

  padding: 0;

  margin: 0;

  display: flex;

  align-items: center;

  gap: 3px;

}

.testimonial-wrapper .top-content .star-rating li {

  margin: 0;

  list-style: none;

  color: #FFC107;

}

.testimonial-wrapper .bottom-content {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 30px;

}

.testimonial-wrapper .bottom-content .desc {

  margin-bottom: 0;

  flex-basis: 70%;

}

.testimonial-wrapper .bottom-content .author-image {

  border-radius: 50%;

  overflow: hidden;

  border: 4px solid #E4E4E4;

  min-width: 120px;

  height: 120px;

}

.testimonial-wrapper .bottom-content .author-image img {

  width: 100%;

}

.testimonial-wrapper .qoute-icon {

  position: absolute;

  z-index: -1;

  top: 50%;

  left: 30px;

  opacity: 0.7;

  transform: translateY(-50%) rotate(180deg);

}



.demo-orange .swiper-slide-active .testimonial-wrapper {

  border-left: 4px solid var(--secondary-100);

}

.demo-orange .testimonial-wrapper2 {

  background: var(--secondary-100);

}



.swiper-slide-active .testimonial-wrapper {

  border-left: 4px solid var(--color-primary);

}

.swiper-slide-active .testimonial-wrapper2 {

  border-radius: 6px 0 0 6px;

  background: var(--color-white);

}

@media only screen and (max-width: 991px) {

  .swiper-slide-active .testimonial-wrapper2 {

    border-radius: 6px;

  }

}

.swiper-slide-active .testimonial-wrapper2::after {

  opacity: 0;

}

.swiper-slide-active .testimonial-wrapper2 .author-area .image {

}

.swiper-slide-active .testimonial-wrapper2 .author-area .author-content .title {

  color: var(--color-heading-1);

}

.swiper-slide-active .testimonial-wrapper2 .author-area .author-content .designation {

  color: var(--color-body);

}

.swiper-slide-active .testimonial-wrapper2 .desc {

  color: var(--color-body);

}

.swiper-slide-active .testimonial-wrapper2 .star-rating {

  background: rgba(255, 112, 41, 0.06);

}

.swiper-slide-active .testimonial-wrapper2.v2 {

  background: #FFFFFF;

}

@media only screen and (max-width: 991px) {

  .swiper-slide-active .testimonial-wrapper2.v2 {

    border-right: 1px solid var(--color-border);

  }

}



.testimonial-wrapper2 {

  padding: 40px 50px;

  border-radius: 0 6px 6px 0;

  position: relative;

  z-index: 1;

  overflow: hidden;

  background: var(--color-white);

}

@media only screen and (max-width: 991px) {

  .testimonial-wrapper2 {

    padding: 30px !important;

  }

}

.testimonial-wrapper2 .author-area {

  display: flex;

  align-items: center;

  gap: 15px;

  margin-bottom: 2px;

}

.testimonial-wrapper2 .author-area .image {

  width: 60px;

  height: 60px;

  line-height: 60px;

  border-radius: 500px;

  background: var(--color-white);

  overflow: hidden;

  display: block;

  text-align: center;

}

.testimonial-wrapper2 .author-area .image img {

  width: 100%;

}

.testimonial-wrapper2 .author-area .author-content .title {

  margin-bottom: 0px;

  color: var(--color-heading-1);

  font-size: 24px;

  line-height: 1.2;

}

@media only screen and (max-width: 576px) {

  .testimonial-wrapper2 .author-area .author-content .title {

    font-size: 20px;

  }

}

.testimonial-wrapper2 .author-area .author-content .designation {

  margin-bottom: 0;

  color: var(--color-body);

}

.testimonial-wrapper2 .desc {

  margin-bottom: 20px;

  color: var(--color-body);

}

.testimonial-wrapper2 .star-rating {

  display: flex;

  align-items: center;

  gap: 3px;

  padding: 4px 13px;

  border-radius: 4px;

  max-width: max-content;

  background: rgba(246, 246, 246, 0.06);

}

.testimonial-wrapper2 .star-rating li {

  color: #FFC107;

}

.testimonial-wrapper2.v2 {

  border: 1px solid var(--color-border);

}

.testimonial-wrapper2.v2::after {

  background: var(--color-primary-2);

}

.testimonial-wrapper2.v2 .star-rating {

  display: flex;

  align-items: center;

  gap: 3px;

  padding: 0px 8px;

  background: var(--color-white);

  border-radius: 3px;

  max-width: max-content;

}

.testimonial-wrapper2.v2 .star-rating li {

  color: #FFC107;

}

.testimonial-wrapper2.v2 .star-rating li i {

  font-size: 14px;

}



.tmpTestimonialSlider2 {

  position: relative;

  z-index: 1;

}

.tmpTestimonialSlider2 .swiper-navigation-area {

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  z-index: 1;

  max-width: max-content;

  height: 100px;

  display: flex;

  flex-direction: column;

  gap: 5px;

}

@media only screen and (max-width: 991px) {

  .tmpTestimonialSlider2 .swiper-navigation-area {

    height: 100px;

  }

}

.tmpTestimonialSlider2 .swiper-navigation-area .swiper-btn {

  position: absolute;

  width: 48px;

  padding: 0;

  margin: 0;

  height: 48px;

  line-height: 48px;

  text-align: center;

  display: block;

  background: #FFFFFF;

  box-shadow: 0px 2.46154px 12.3077px rgba(0, 0, 0, 0.04);

  border-radius: 6px;

  color: var(--color-heading-1);

  z-index: 1;

  transition: 0.3s;

}

.tmpTestimonialSlider2 .swiper-navigation-area .swiper-btn::after {

  display: block;

}

.tmpTestimonialSlider2 .swiper-navigation-area .swiper-btn.swiper-button-next {

  top: 64%;

  left: -23px;

}

.tmpTestimonialSlider2 .swiper-navigation-area .swiper-btn.swiper-button-prev {

  top: 0%;

  left: -23px;

}

.tmpTestimonialSlider2 .swiper-navigation-area .swiper-btn::after {

  position: absolute;

  content: "";

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%) scale(0.2);

  opacity: 0;

  background: var(--color-primary);

  z-index: -1;

  height: 100%;

  width: 100%;

  border-radius: 6px;

  transition: 0.3s;

}

.tmpTestimonialSlider2 .swiper-navigation-area .swiper-btn:hover i {

  color: var(--color-white);

}

.tmpTestimonialSlider2 .swiper-navigation-area .swiper-btn:hover::after {

  transform: translate(-50%, -50%) scale(1);

  opacity: 1;

}



.tmpTestimonialSlider3 {

  padding: 20px 15px;

  margin: -20px -15px;

}



.testimonial-wrapper3 {

  background: #ffffff;

  position: relative;

  z-index: 1;

  padding: 60px 30px 30px 30px;

  border-radius: 6px;

  box-shadow: var(--shadow-1);

}

@media (min-width: 1920px) {

  .testimonial-wrapper3 {

    padding: 60px 30px 50px 30px;

  }

}

.testimonial-wrapper3 .star-rating-area {

  display: flex;

  align-items: center;

  gap: 15px;

  margin-bottom: 40px;

}

@media only screen and (max-width: 576px) {

  .testimonial-wrapper3 .star-rating-area {

    margin-bottom: 34px !important;

  }

}

.testimonial-wrapper3 .star-rating-area h3 {

  font-weight: 500;

  margin-bottom: 0;

  line-height: 1;

  font-size: 22px;

}

.testimonial-wrapper3 .star-rating-area ul {

  display: flex;

  align-items: center;

  gap: 4px;

}

.testimonial-wrapper3 .star-rating-area ul li {

  color: #FF9A50;

  font-size: 14px;

}

@media only screen and (max-width: 576px) {

  .testimonial-wrapper3 .star-rating-area ul li {

    font-size: 14px;

  }

}

.testimonial-wrapper3 .bottom-text .desc {

  margin-bottom: 30px;

  font-size: 16px;

  font-weight: 400;

  line-height: 1.5;

}

.testimonial-wrapper3 .bottom-text .author-area {

  display: flex;

  align-items: center;

  gap: 12px;

}

.testimonial-wrapper3 .bottom-text .author-area .image {

  border-radius: 5px;

  overflow: hidden;

}

.testimonial-wrapper3 .bottom-text .author-area .image img {

  max-width: 45px;

  border-radius: 50%;

  object-fit: cover;

  border: 2px solid var(--color-border);

}

.testimonial-wrapper3 .bottom-text .author-area .name-designation h3 {

  margin-bottom: 5px;

  line-height: 1;

  font-size: 16px;

}

.testimonial-wrapper3 .bottom-text .author-area .name-designation p {

  line-height: 1;

}

.testimonial-wrapper3 .quote {

  position: absolute;

  z-index: -1;

  top: 39px;

  right: 69px;

}

.testimonial-wrapper3 .quote img {

  opacity: 0.5;

}



.tmp-testimonials-area3 {

  background: var(--primary-50);

  border-radius: 6px;

  margin: 0 60px;

}

.tmp-testimonials-area3 .testimonial-slider-inner {

  padding: 30px;

  background: var(--color-white);

  border-radius: 6px;

}

@media only screen and (max-width: 576px) {

  .tmp-testimonials-area3 .testimonial-slider-inner {

    padding: 15px;

  }

}

.tmp-testimonials-area3 .testimonial-slider-inner.inner {

  background: #FFFFFF;

  box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.07);

}

.tmp-testimonials-area3 .home-ten {

  position: relative;

  z-index: 1;

}

.tmp-testimonials-area3 .home-ten .pagination-area {

  position: absolute;

  bottom: -35px;

  left: 0;

  width: 90px;

  height: 10px;

}

@media only screen and (max-width: 1199px) {

  .tmp-testimonials-area3 .home-ten .pagination-area {

    bottom: -20px;

  }

}

.tmp-testimonials-area3 .home-ten .pagination-area .swiper-pagination-bullet {

  width: 10px;

  height: 8px;

  background: #E4E4E4;

  transition: var(--transition);

  opacity: 1;

}

.tmp-testimonials-area3 .home-ten .pagination-area .swiper-pagination-bullet.swiper-pagination-bullet-active {

  background: var(--color-primary-2);

  width: 40px;

  border-radius: 33px;

}

.tmp-testimonials-area3 .home-ten .swiper-navigation-area .swiper-btn {

  width: 46px;

  height: 46px;

  line-height: 46px;

  background: var(--color-white);

  border-radius: 50%;

  color: var(--color-heading-1);

  text-align: center;

  display: block;

  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.04);

  z-index: 1;

}

.tmp-testimonials-area3 .home-ten .swiper-navigation-area .swiper-btn::before {

  position: absolute;

  content: "";

  left: 50%;

  top: 50%;

  height: 100%;

  width: 100%;

  background: var(--color-primary);

  transform: translate(-50%, -50%) scale(0.2);

  z-index: -1;

  border-radius: 50%;

  transition: 0.3s;

  opacity: 0;

}

.tmp-testimonials-area3 .home-ten .swiper-navigation-area .swiper-btn:hover i {

  color: var(--color-white);

}

.tmp-testimonials-area3 .home-ten .swiper-navigation-area .swiper-btn:hover::before {

  opacity: 1;

  transform: translate(-50%, -50%) scale(1);

}

.tmp-testimonials-area3 .home-ten .swiper-navigation-area .swiper-btn::after {

  display: none;

}

.tmp-testimonials-area3 .home-ten .swiper-navigation-area .swiper-btn.swiper-button-prev {

  left: -20px;

}

@media only screen and (max-width: 479px) {

  .tmp-testimonials-area3 .home-ten .swiper-navigation-area .swiper-btn.swiper-button-prev {

    left: -10px;

  }

}

.tmp-testimonials-area3 .home-ten .swiper-navigation-area .swiper-btn.swiper-button-next {

  right: -20px;

}

@media only screen and (max-width: 479px) {

  .tmp-testimonials-area3 .home-ten .swiper-navigation-area .swiper-btn.swiper-button-next {

    right: -10px;

  }

}



.tmp-testimonials-area4 {

  background: rgb(244, 244, 244);

  padding-bottom: 180px;

}

@media only screen and (max-width: 576px) {

  .tmp-testimonials-area4 {

    padding-bottom: 150px;

  }

}

.tmp-testimonials-area4 .testimonial-slider-inner {

  padding: 30px;

  background: var(--color-white);

  border-radius: 10px;

}

.tmp-testimonials-area4 .testimonial-slider-inner2 {

  position: relative;

  z-index: 1;

}

.tmp-testimonials-area4 .testimonial-slider-inner2 .swiper-navigation {

  width: 140px;

  height: 60px;

  display: flex;

  align-items: center;

  position: absolute;

  gap: 15px;

  right: 50px;

  bottom: 7px;

  z-index: 1;

}

@media only screen and (max-width: 1199px) {

  .tmp-testimonials-area4 .testimonial-slider-inner2 .swiper-navigation {

    right: 0;

    bottom: -16px;

  }

}

@media only screen and (max-width: 991px) {

  .tmp-testimonials-area4 .testimonial-slider-inner2 .swiper-navigation {

    right: 0;

    bottom: 14px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-testimonials-area4 .testimonial-slider-inner2 .swiper-navigation {

    right: 0;

  }

}

.tmp-testimonials-area4 .testimonial-slider-inner2 .swiper-navigation .swiper-btn {

  width: 45px;

  height: 46px;

  line-height: 48px;

  border-radius: 50%;

  background: var(--color-white);

  text-align: center;

  display: block;

  transition: 0.3s;

}

.tmp-testimonials-area4 .testimonial-slider-inner2 .swiper-navigation .swiper-btn i {

  font-size: 15px;

  color: var(--color-heading-1);

  transition: 0.3s;

}

.tmp-testimonials-area4 .testimonial-slider-inner2 .swiper-navigation .swiper-btn:hover {

  scale: 1.2;

  background: var(--color-primary);

}

.tmp-testimonials-area4 .testimonial-slider-inner2 .swiper-navigation .swiper-btn:hover i {

  color: var(--color-white);

}



.feedback-wrapper .sub-title {

  color: var(--color-heading-1);

  font-weight: 600;

  font-family: var(--font-primary);

  display: flex;

  align-items: end;

  gap: 15px;

  margin-bottom: 20px;

}

.feedback-wrapper .title {

  font-size: 34px;

  line-height: 43px;

  margin-bottom: 15px;

}

@media only screen and (max-width: 576px) {

  .feedback-wrapper .title {

    font-size: 28px;

    line-height: 36px;

  }

}

.feedback-wrapper .desc {

  max-width: 347px;

  color: var(--color-body-2);

  margin-bottom: 15px;

}

.feedback-wrapper .bottom-service {

  padding-top: 25px;

  border-top: 1px solid var(--color-border);

}

.feedback-wrapper .bottom-service p {

  font-size: 18px;

  line-height: 1.5;

  color: var(--color-heading-1);

  display: flex;

  align-items: end;

  gap: 15px;

}

@media only screen and (max-width: 1199px) {

  .feedback-wrapper .bottom-service p {

    flex-wrap: wrap;

  }

}

.feedback-wrapper .bottom-service p span {

  color: var(--color-primary-2);

  font-size: 50px;

  font-family: var(--font-primary);

  line-height: 45px;

  font-weight: 800;

}



.testimonial-wrapper4 {

  display: flex;

  align-items: center;

  gap: 35px;

}

.testimonial-wrapper4 .image-area {

  flex-basis: 39%;

  border-radius: 4px;

  overflow: hidden;

}

.testimonial-wrapper4 .content-area {

  flex-basis: 61%;

}

.testimonial-wrapper4 .content-area .star-rating {

  display: flex;

  align-items: center;

  gap: 3px;

  padding: 2px 8px;

  background: #f9f9f9;

  border-radius: 4px;

  max-width: max-content;

  margin-bottom: 20px;

}

.testimonial-wrapper4 .content-area .star-rating li {

  color: #FFC107;

  font-size: 14px;

  font-weight: 600;

}

.testimonial-wrapper4 .content-area .star-rating li i {

  font-weight: 600;

}

.testimonial-wrapper4 .content-area p.desc {

  margin-bottom: 30px;

}

.testimonial-wrapper4 .content-area .author-area .title {

  margin-bottom: 5px;

  font-size: 24px;

}



.testimonial-wrapper5 {

  display: flex;

  align-items: center;

  gap: 30px;

}

@media only screen and (max-width: 767px) {

  .testimonial-wrapper5 {

    gap: 20px;

    flex-direction: column;

    align-items: flex-start;

  }

}

@media only screen and (max-width: 576px) {

  .testimonial-wrapper5 {

    gap: 25px;

    flex-direction: column;

    align-items: flex-start;

  }

}

.testimonial-wrapper5 .image-area {

  flex-basis: 38%;

  background: var(--color-white);

  padding: 10px;

  border-radius: 5px;

}

.testimonial-wrapper5 .image-area img {

  width: 100%;

}

.testimonial-wrapper5 .content-area {

  flex-basis: 62%;

}

.testimonial-wrapper5 .content-area .desc {

  margin-bottom: 15px;

}

.testimonial-wrapper5 .content-area h3 {

  margin-bottom: 1px;

  font-size: 20px;

}

.testimonial-wrapper5 .content-area .designation {

  margin-bottom: 15px;

}

.testimonial-wrapper5 .content-area ul {

  display: flex;

  align-items: center;

  gap: 4px;

  background: #ffcb50;

  padding: 5px 7px;

  border-radius: 3px;

  max-width: max-content;

}

.testimonial-wrapper5 .content-area ul li {

  color: var(--color-white);

  line-height: 1;

}

.testimonial-wrapper5 .content-area ul li i {

  font-size: 14px;

}



.common-swiper-inside {

  position: relative;

}

.common-swiper-inside .navigation-area .swiper-btn {

  color: var(--color-primary-2);

  display: flex;

  align-items: center;

  gap: 5px;

  position: unset;

  margin: 0;

  width: 60px;

  height: 60px;

  background: #fff;

  border-radius: 50%;

  transition: var(--transition);

  position: absolute;

  z-index: 10;

  transform: translateY(-50%);

  transition: 0.3s;

  opacity: 0;

}

.common-swiper-inside .navigation-area .swiper-btn i {

  transition: 0.3s;

}

.common-swiper-inside .navigation-area .swiper-btn:hover {

  background: var(--color-primary);

  transform: translateY(-50%) scale(1.1);

}

.common-swiper-inside .navigation-area .swiper-btn:hover i {

  color: #fff;

}

.common-swiper-inside .navigation-area .swiper-btn:hover span {

  background: var(--color-primary-2);

  color: var(--color-white);

}

.common-swiper-inside .navigation-area .swiper-btn::after, .common-swiper-inside .navigation-area .swiper-btn::before {

  display: none;

}

.common-swiper-inside .navigation-area .swiper-btn span {

  min-width: 60px;

  height: 60px;

  line-height: 60px;

  background: rgba(135, 171, 66, 0.2);

  display: block;

  border-radius: 50%;

  text-align: center;

  transition: var(--transition);

}

.common-swiper-inside .navigation-area .swiper-btn i {

  font-size: 18px;

}

.common-swiper-inside .navigation-area .swiper-btn.swiper-button-next {

  position: absolute;

  right: 120px;

  top: 50%;

  left: auto;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .common-swiper-inside .navigation-area .swiper-btn.swiper-button-next {

    right: 25px;

  }

}

@media only screen and (max-width: 1199px) {

  .common-swiper-inside .navigation-area .swiper-btn.swiper-button-next {

    right: 25px;

  }

}

.common-swiper-inside .navigation-area .swiper-btn.swiper-button-prev {

  position: absolute;

  left: 120px;

  top: 50%;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .common-swiper-inside .navigation-area .swiper-btn.swiper-button-prev {

    left: 25px;

  }

}

@media only screen and (max-width: 1199px) {

  .common-swiper-inside .navigation-area .swiper-btn.swiper-button-prev {

    left: 25px;

  }

}

.common-swiper-inside:hover .navigation-area .swiper-btn {

  opacity: 1;

}

.common-swiper-inside:hover .navigation-area .swiper-btn.swiper-button-next {

  right: 90px;

}

@media only screen and (max-width: 576px) {

  .common-swiper-inside:hover .navigation-area .swiper-btn.swiper-button-next {

    right: 30px;

  }

}

.common-swiper-inside:hover .navigation-area .swiper-btn.swiper-button-prev {

  left: 90px;

}

@media only screen and (max-width: 576px) {

  .common-swiper-inside:hover .navigation-area .swiper-btn.swiper-button-prev {

    left: 30px;

  }

}



.testimonials-scroll-animation-wrapper {

  position: relative;

  z-index: 1;

}

.testimonials-scroll-animation-wrapper::before {

  top: 0;

  left: 0;

}

.testimonials-scroll-animation-wrapper::after {

  top: 0;

  right: 0;

  -webkit-transform: rotate(180deg);

  -moz-transform: rotate(180deg);

  transform: rotate(180deg);

}

.testimonials-scroll-animation-wrapper::before, .testimonials-scroll-animation-wrapper::after {

  position: absolute;

  height: 100%;

  width: 100px;

  background: -webkit-gradient(linear, left top, right top, from(#fff), to(hsla(0, 0%, 100%, 0)));

  background: -webkit-linear-gradient(left, #fff, hsla(0, 0%, 100%, 0));

  background: -moz-linear-gradient(left, #fff 0, hsla(0, 0%, 100%, 0) 100%);

  background: linear-gradient(90deg, #fff 0, hsla(0, 0%, 100%, 0));

  z-index: 2;

  content: "";

}

@media only screen and (max-width: 576px) {

  .testimonials-scroll-animation-wrapper::before, .testimonials-scroll-animation-wrapper::after {

    display: none;

  }

}



.testimonials-scroll-animation-wrapper .single-col-20 {

  width: 500px;

  padding: 0 15px;

}

@media only screen and (max-width: 767px) {

  .testimonials-scroll-animation-wrapper .single-col-20 {

    width: 310px;

    padding: 0 10px;

  }

}



@keyframes scroll {

  0% {

    -webkit-transform: translateX(0);

    -moz-transform: translateX(0);

    transform: translateX(0);

  }

  to {

    -webkit-transform: translateX(-webkit-calc(-250px * 7));

    -moz-transform: translateX(-moz-calc(-250px * 7));

    transform: translateX(-1750px);

  }

}

@keyframes scrollLeft {

  0% {

    -webkit-transform: translateX(-webkit-calc(-250px * 7));

    -moz-transform: translateX(-moz-calc(-250px * 7));

    transform: translateX(-1750px);

  }

  to {

    -webkit-transform: translateX(0);

    -moz-transform: translateX(0);

    transform: translateX(0);

  }

}

.scroll-right-left {

  -webkit-animation: scroll 80s linear infinite;

  -moz-animation: scroll 80s linear infinite;

  animation: scroll 80s linear infinite;

  -webkit-animation-fill-mode: forwards;

  -moz-animation-fill-mode: forwards;

  animation-fill-mode: forwards;

}



.scroll-left-right {

  -webkit-animation: scrollLeft 80s linear infinite;

  -moz-animation: scrollLeft 80s linear infinite;

  animation: scrollLeft 80s linear infinite;

  -webkit-animation-fill-mode: forwards;

  -moz-animation-fill-mode: forwards;

  animation-fill-mode: forwards;

}



.scroll-animation {

  display: flex;

  width: -webkit-calc((420px* 16) +(30px* 16));

  width: -moz-calc((420px* 16) +(30px* 16));

  width: 7200px;

  position: relative;

}



.single-testimonials-wrapper-marque {

  position: relative;

  padding: 50px 40px;

  z-index: 2;

  background: var(--color-white);

  border-radius: 6px;

  box-shadow: var(--shadow-1);

}

@media only screen and (max-width: 767px) {

  .single-testimonials-wrapper-marque {

    padding: 22px;

  }

}

.single-testimonials-wrapper-marque::before {

  position: absolute;

  content: "";

  right: 40px;

  top: 40px;

  z-index: -1;

  background-image: url(../images/testimonials/quote4.svg);

  background-repeat: no-repeat, repeat;

  width: 52px;

  height: 44px;

  filter: brightness(0) saturate(100%) invert(31%) sepia(83%) saturate(378%) hue-rotate(136deg) brightness(104%) contrast(95%);

}

.single-testimonials-wrapper-marque .inner .clint-info-wrapper {

  display: flex;

  align-items: center;

  margin-bottom: 20px;

}

@media only screen and (max-width: 767px) {

  .single-testimonials-wrapper-marque .inner .clint-info-wrapper {

    flex-direction: column;

    align-items: flex-start;

  }

}

.single-testimonials-wrapper-marque .inner .clint-info-wrapper .thumb {

  position: relative;

  z-index: 1;

  display: inline-block;

  height: auto;

  padding: 3px;

  background: var(--color-white);

  border-radius: 100%;

  overflow: hidden;

  max-width: 70px;

  border: 2px solid var(--color-border);

}

.single-testimonials-wrapper-marque .inner .clint-info-wrapper .client-info {

  padding-left: 25px;

}

@media only screen and (max-width: 767px) {

  .single-testimonials-wrapper-marque .inner .clint-info-wrapper .client-info {

    padding-left: 0;

    padding-top: 15px;

  }

}

.single-testimonials-wrapper-marque .inner .clint-info-wrapper .client-info .title {

  margin-bottom: 5px;

  font-size: 24px;

  line-height: 1.2;

}

.single-testimonials-wrapper-marque .inner .description .desc {

  margin-bottom: 20px;

}

.single-testimonials-wrapper-marque .inner .description .rating a i {

  color: #FF8F3C;

}



.container-1800 {

  max-width: 1800px;

  margin: auto;

}



.testimonial-slider-fluid {

  border-right: 1px solid var(--color-border);

}



.testimonial-item-fluid {

  padding-right: 30px;

  border-right: 1px solid var(--color-border);

}

.testimonial-item-fluid .icon {

  width: 60px;

  height: 60px;

  line-height: 60px;

  text-align: center;

  border-radius: 50%;

  transition: var(--transition);

  background-color: var(--color-heading-1);

  margin-bottom: 30px;

}

.testimonial-item-fluid .info {

  margin-top: 70px;

}

.testimonial-item-fluid .info h2 {

  margin-bottom: 7px;

  font-size: 24px;

  line-height: 35px;

  font-weight: 500;

}



.testimonial-fluid-review {

  position: relative;

  z-index: 1;

  text-align: center;

}

.testimonial-fluid-review .review-title {

  line-height: 16px;

  margin-top: 10px;

  font-size: 18px;

  font-weight: 500;

}

.testimonial-fluid-review h2 {

  font-size: 48px;

  font-weight: 500;

  line-height: 58px;

  margin: 10px 0;

}

.testimonial-fluid-review .star i {

  color: #ffab01;

}

.testimonial-fluid-review h3 {

  line-height: 1.4;

  margin-top: 10px;

  font-size: 18px;

}

.testimonial-fluid-review .swiper-navigation {

  display: flex;

  align-items: center;

  gap: 15px;

  justify-content: center;

}

.testimonial-fluid-review .swiper-navigation .swiper-btn {

  height: 45px;

  width: 45px;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

  box-shadow: var(--shadow-1);

  transition: 0.3s;

}

.testimonial-fluid-review .swiper-navigation .swiper-btn:hover {

  background: var(--color-primary);

}

.testimonial-fluid-review .swiper-navigation .swiper-btn:hover i {

  color: var(--color-white);

}

.testimonial-fluid-review .swiper-navigation .swiper-btn i {

  color: var(--color-heading-1);

}

.testimonial-fluid-review .swiper-navigation .swiper-btn:hover {

  transform: scale(1.1);

}



.padding-testimonials-style-fluid {

  padding: 60px 0 60px 60px;

  box-shadow: var(--shadow-1);

  border-radius: 8px;

}

@media only screen and (max-width: 991px) {

  .padding-testimonials-style-fluid {

    padding: 40px;

  }

}



.thumbnail-fluid-testimonials {

  padding: 0 35px 0 35px;

  box-shadow: var(--shadow-1);

  border-radius: 8px;

  height: 100%;

}

@media only screen and (max-width: 1199px) {

  .thumbnail-fluid-testimonials img {

    width: 100%;

  }

}



.single-swiper-item-testimonials {

  text-align: center;

  max-width: 65%;

  margin: auto;

}

@media only screen and (max-width: 991px) {

  .single-swiper-item-testimonials {

    max-width: 100%;

  }

}

.single-swiper-item-testimonials .stars-area {

  display: flex;

  align-items: center;

  gap: 7px;

  justify-content: center;

  margin-bottom: 30px;

}

.single-swiper-item-testimonials .stars-area i {

  color: #f9cc3a;

  font-size: 22px;

}

.single-swiper-item-testimonials p {

  font-size: 20px;

  line-height: 2;

}

.single-swiper-item-testimonials .information .name {

  font-size: 20px;

  margin-bottom: 10px;

}

.single-swiper-item-testimonials .information span {

  font-size: 16px;

}



.swiper-free-mode > .swiper-wrapper {

  transition-timing-function: ease-out;

  margin: 0 auto;

}



.testimonial-three--slider .swiper-btn {

  color: var(--color-primary-2);

  display: flex;

  align-items: center;

  gap: 5px;

  position: unset;

  margin: 0;

  width: 60px;

  height: 60px;

  background: #fff;

  border-radius: 50%;

  transition: var(--transition);

  position: absolute;

  z-index: 10;

  transform: translateY(-50%);

  transition: 0.3s;

  opacity: 0;

  box-shadow: var(--shadow-1);

}

.testimonial-three--slider .swiper-btn::after {

  display: none;

}

.testimonial-three--slider .swiper-btn.swiper-button-prev {

  position: absolute;

  left: 120px;

  top: 50%;

}

@media only screen and (max-width: 576px) {

  .testimonial-three--slider .swiper-btn.swiper-button-prev {

    left: 30px;

  }

}

.testimonial-three--slider .swiper-btn.swiper-button-next {

  position: absolute;

  right: 120px;

  top: 50%;

  left: auto;

}

@media only screen and (max-width: 576px) {

  .testimonial-three--slider .swiper-btn.swiper-button-next {

    right: 30px;

  }

}

.testimonial-three--slider:hover .swiper-navigation .swiper-btn {

  opacity: 1;

}

.testimonial-three--slider:hover .swiper-navigation .swiper-btn.swiper-button-next {

  right: 90px;

}

@media only screen and (max-width: 576px) {

  .testimonial-three--slider:hover .swiper-navigation .swiper-btn.swiper-button-next {

    right: 20px;

  }

}

.testimonial-three--slider:hover .swiper-navigation .swiper-btn.swiper-button-prev {

  left: 90px;

}

@media only screen and (max-width: 576px) {

  .testimonial-three--slider:hover .swiper-navigation .swiper-btn.swiper-button-prev {

    left: 20px;

  }

}



.testimonial-three--slider-thumb {

  max-width: 300px;

  margin: 0 auto;

  margin-top: 30px;

  padding: 10px;

}

.testimonial-three--slider-thumb .testimonial-three__image {

  width: 80px;

  cursor: pointer;

}

.testimonial-three--slider-thumb .testimonial-three__image img {

  transition: 0.4s;

}

.testimonial-three--slider-thumb .swiper-slide-thumb-active img {

  transform: scale(1.1);

}



.tmp-working-process-area .section-title-area {

  margin-bottom: 60px;

}

.tmp-working-process-area .section-title-area .pre-title,

.tmp-working-process-area .section-title-area .section-title {

  margin-left: auto;

  margin-right: auto;

  text-align: center;

}

.tmp-working-process-area .section-bottom-video-area {

  position: relative;

  z-index: 1;

  height: 650px;

  background: url(../images/working-process/15.webp);

  background-repeat: no-repeat;

  background-position: center center;

  background-size: cover;

  border-radius: 6px;

}

.tmp-working-process-area .section-bottom-video-area .video-btn {

  display: flex;

  align-items: center;

  gap: 20px;

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

}

.tmp-working-process-area .section-bottom-video-area .video-btn a {

  width: 110px;

  height: 110px;

  line-height: 130px;

  text-align: center;

  display: block;

  border-radius: 50%;

  color: var(--color-primary-2);

  background: var(--color-white);

  position: relative;

  z-index: 1;

}

.tmp-working-process-area .section-bottom-video-area .video-btn a i {

  font-size: 35px;

}

.tmp-working-process-area .section-bottom-video-area .video-btn a::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  border-radius: 50%;

  top: 0;

  left: 0;

  background: rgba(255, 255, 255, 0.08);

  animation: pulse-border 4s linear infinite;

}

.tmp-working-process-area .section-bottom-video-area.bg-2 {

  background: url(../images/working-process/26.webp);

  background-repeat: no-repeat;

  background-position: center center;

  background-size: cover;

  filter: grayscale(0.3);

  transition: 0.3s;

}

.tmp-working-process-area .section-bottom-video-area.bg-2:hover {

  filter: grayscale(0);

}



.tmp-working-process-area3 {

  background: #f6f6f6;

}



.working-process-content-area .heading-title {

  font-size: 30px;

  font-weight: 600;

}

.working-process-content-area .desc {

  max-width: 345px;

}



.working-process-image {

  position: relative;

  z-index: 1;

  text-align: right;

}

@media only screen and (max-width: 991px) {

  .working-process-image {

    text-align: left;

    margin-bottom: 60px !important;

  }

}

.working-process-image img {

  border-radius: 15px;

}

@media only screen and (max-width: 991px) {

  .working-process-image img {

    width: 100%;

  }

}

.working-process-image .floating-img {

  position: absolute;

  z-index: 1;

  left: 120px;

  bottom: 20px;

  max-width: 270px;

  border-radius: 6px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .working-process-image .floating-img {

    bottom: 0;

    left: 100px;

  }

}

@media only screen and (max-width: 1199px) {

  .working-process-image .floating-img {

    bottom: 0 !important;

  }

}

@media only screen and (max-width: 991px) {

  .working-process-image .floating-img {

    display: none;

  }

}



.working-process-wrapper {

  background: var(--color-white);

  border-radius: 10px;

  padding: 40px 25px;

  box-shadow: 0px 6px 34px rgba(215, 216, 222, 0.41);

  transition: var(--transition);

  position: relative;

  z-index: 1;

  overflow: hidden;

  height: 100%;

}

.working-process-wrapper:hover {

  transform: translateY(-5px) scale(1.02);

}

.working-process-wrapper:hover .icon img {

  animation: bounceIn 0.6s ease;

}

.working-process-wrapper .number {

  position: absolute;

  top: 10px;

  right: 15px;

  font-size: 75px;

  line-height: 1;

  font-weight: 600;

  color: transparent;

  -webkit-text-stroke-width: 1px;

  -webkit-text-stroke-color: rgba(31, 36, 46, 0.11);

}

.working-process-wrapper .icon {

  display: block;

  margin-bottom: 25px;

  transition: var(--transition);

}

.working-process-wrapper .icon img {

  max-width: 50px;

}

.working-process-wrapper .heading-title {

  transition: var(--transition);

  font-size: 20px;

  line-height: 1.3;

}

.working-process-wrapper .desc {

  margin-bottom: 0;

}



.tmp-working-process-area2 {

  margin: 0 60px;

}

.tmp-working-process-area2 .section-inner {

  position: relative;

  z-index: 1;

}

.tmp-working-process-area2 .section-inner::after {

  content: "";

  position: absolute;

  z-index: -1;

  width: 100%;

  height: 1px;

  background: #E4E4E4;

  top: 199px;

  left: 0;

}

.tmp-working-process-area2.inner {

  margin: 0;

  background: #f6f6f6;

}

.tmp-working-process-area2.inner .wrapper-inner .image-area .tag {

  background: var(--color-primary-2);

}



.working-process-wrapper2 {

  position: relative;

  z-index: 1;

  height: 100%;

}

.working-process-wrapper2 .wrapper-inner {

  max-width: 308px;

  height: 100%;

  background: var(--color-white);

  box-shadow: 0px 4px 33px rgba(0, 0, 0, 0.07);

  border-radius: 6px;

  overflow: hidden;

  transition: var(--transition);

}

.working-process-wrapper2 .wrapper-inner.mid {

  margin: auto;

}

.working-process-wrapper2 .wrapper-inner.right {

  margin-left: auto;

}

.working-process-wrapper2 .wrapper-inner:hover {

  transform: scale(1.02);

}

.working-process-wrapper2 .wrapper-inner:hover .image-area img {

  transform: scale(105%);

}

.working-process-wrapper2 .wrapper-inner .image-area {

  position: relative;

  z-index: 1;

  max-height: 170px;

  overflow: hidden;

}

.working-process-wrapper2 .wrapper-inner .image-area .tag {

  background: var(--color-primary);

  color: var(--color-white);

  line-height: 1;

  font-size: 16px;

  font-weight: 600;

  font-family: var(--font-primary);

  padding: 10px 13px;

  position: absolute;

  z-index: 1;

  left: 0;

  bottom: 0;

  border-radius: 0 3px 0 0;

}

.working-process-wrapper2 .wrapper-inner .image-area img {

  transform: scale(100%);

  transition: var(--transition);

}

.working-process-wrapper2 .wrapper-inner .content-area {

  padding: 20px 30px 30px;

}

.working-process-wrapper2 .wrapper-inner .content-area .title {

  margin-bottom: 10px;

  line-height: 1.2;

  font-size: 20px;

}

.working-process-wrapper2 .icon {

  position: absolute;

  top: 145px;

  right: -15px;

}

.working-process-wrapper2 .icon.second {

  right: -70px;

}



.working-process-wrapper3 a {

  display: flex;

  align-items: center;

  gap: 40px;

  padding: 50px 120px;

  border-radius: 0;

  position: relative;

  transition: var(--transition);

}

@media only screen and (max-width: 991px) {

  .working-process-wrapper3 a {

    padding: 25px 15px !important;

    gap: 20px;

  }

}

.working-process-wrapper3 a:hover::after {

  opacity: 1;

}

.working-process-wrapper3 a:hover .left-area .number,

.working-process-wrapper3 a:hover .left-area .title {

  color: var(--color-white);

}

.working-process-wrapper3 a:hover .left-area .title svg {

  opacity: 1;

}

.working-process-wrapper3 a:hover .left-area .title svg path {

  fill: var(--color-white);

}

.working-process-wrapper3 a:hover .mid-area .desc {

  color: var(--color-white);

}

.working-process-wrapper3 a:hover .image-area {

  transform: translateY(-50%) scale(1);

}

.working-process-wrapper3 a::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  border-radius: 0;

  background: var(--color-primary-2);

  opacity: 0;

  transition: var(--transition);

  z-index: -1;

}

.working-process-wrapper3 a .left-area {

  display: flex;

  align-items: center;

  flex-basis: 33%;

  gap: 60px;

}

@media only screen and (max-width: 479px) {

  .working-process-wrapper3 a .left-area {

    flex-wrap: wrap;

  }

}

.working-process-wrapper3 a .left-area .number {

  font-size: 34px;

  line-height: 1;

  margin-bottom: 0;

}

.working-process-wrapper3 a .left-area .title {

  gap: 20px;

  line-height: 1;

  display: flex;

  align-items: center;

  margin-bottom: 0;

  font-size: 30px;

}

.working-process-wrapper3 a .left-area .title svg {

  opacity: 0.2;

}

.working-process-wrapper3 a .mid-area {

  max-width: 415px;

}

.working-process-wrapper3 a .image-area {

  position: absolute;

  z-index: 2;

  right: 120px;

  top: 50%;

  transform: translateY(-50%) scale(0);

  transition: var(--transition);

  width: 375px;

  height: 425px;

}

@media only screen and (max-width: 767px) {

  .working-process-wrapper3 a .image-area {

    right: 30px;

    top: 41%;

    transform: translateY(-50%) scale(0);

    width: 250px;

    height: 249px;

  }

}

.working-process-wrapper3 a .image-area .tmp-icon-overlay-link-btn {

  position: absolute;

  z-index: 1;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

}

.working-process-wrapper3:not(:last-child) {

  border-bottom: 1px solid var(--color-border);

}



.working-process-wrapper4 {

  position: relative;

  z-index: 1;

}

.working-process-wrapper4 .image-area {

  text-align: end;

  padding-bottom: 40px;

}

.working-process-wrapper4 .number {

  position: absolute;

  font-family: var(--font-primary);

  font-weight: 800;

  font-size: 48px;

  line-height: 59px;

  text-align: center;

  left: 0;

  top: -9px;

  opacity: 0.06;

}

.working-process-wrapper4 .content-area {

  background: #FFFFFF;

  border-radius: 6px;

  padding: 20px;

  position: absolute;

  z-index: 1;

  bottom: 0;

  left: 0;

  width: 80%;

  box-shadow: var(--shadow-1);

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .working-process-wrapper4 .content-area {

    height: 127px;

  }

}

@media only screen and (max-width: 767px) {

  .working-process-wrapper4 .content-area {

    padding: 10px;

  }

}

.working-process-wrapper4 .content-area .title {

  margin-bottom: 10px;

  line-height: 1;

  font-size: 20px;

  color: var(--color-primary);

  padding-left: 20px;

  position: relative;

}

.working-process-wrapper4 .content-area .title::after {

  position: absolute;

  content: "";

  left: 0;

  top: 50%;

  height: 10px;

  width: 10px;

  background: var(--color-primary);

  border-radius: 50%;

  transform: translateY(-50%);

}

.working-process-wrapper4 .content-area .desc {

  max-width: 100%;

  font-weight: 500;

  font-size: 16px;

  line-height: 1.4;

}

@media only screen and (max-width: 767px) {

  .working-process-wrapper4 .content-area .desc {

    font-size: 14px;

  }

}



.working-process-counter-area .counter-inner {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.working-process-counter-area .counter-inner .content .title {

  color: var(--color-primary-2);

  margin-bottom: 15px;

  line-height: 1;

}

.working-process-counter-area .counter-inner .content p {

  font-size: 20px;

  color: var(--color-heading-1);

  font-family: var(--font-primary);

  line-height: 1;

  font-weight: 600;

}



.working-process-wrapper5 {

  clip-path: polygon(0% 3.03%, 0% 3.03%, 0.025% 2.539%, 0.099% 2.072%, 0.217% 1.638%, 0.376% 1.241%, 0.571% 0.888%, 0.798% 0.585%, 1.053% 0.338%, 1.332% 0.154%, 1.632% 0.04%, 1.948% 0%, 85.62% 0%, 85.62% 0%, 85.763% 0.008%, 85.905% 0.032%, 86.044% 0.073%, 86.181% 0.128%, 86.315% 0.199%, 86.445% 0.285%, 86.571% 0.385%, 86.692% 0.499%, 86.808% 0.628%, 86.918% 0.77%, 99.349% 18.036%, 99.349% 18.036%, 99.468% 18.215%, 99.576% 18.409%, 99.672% 18.614%, 99.757% 18.831%, 99.83% 19.058%, 99.89% 19.293%, 99.938% 19.536%, 99.972% 19.785%, 99.993% 20.039%, 100% 20.296%, 100% 96.97%, 100% 96.97%, 99.975% 97.461%, 99.901% 97.928%, 99.783% 98.362%, 99.624% 98.759%, 99.429% 99.113%, 99.202% 99.415%, 98.947% 99.662%, 98.668% 99.846%, 98.368% 99.96%, 98.052% 100%, 1.948% 100%, 1.948% 100%, 1.632% 99.96%, 1.332% 99.846%, 1.053% 99.662%, 0.798% 99.415%, 0.571% 99.113%, 0.376% 98.759%, 0.217% 98.362%, 0.099% 97.928%, 0.025% 97.461%, 0% 96.97%, 0% 3.03%);

  position: relative;

  z-index: 1;

}

.working-process-wrapper5:hover::before {

  opacity: 0;

}

.working-process-wrapper5:hover::after {

  opacity: 1;

  bottom: 0;

}

.working-process-wrapper5:hover .content {

  bottom: 25px !important;

}

@media only screen and (max-width: 1199px) {

  .working-process-wrapper5:hover .content {

    bottom: 15px !important;

  }

}

.working-process-wrapper5:hover .content .title {

  margin-bottom: 10px;

}

.working-process-wrapper5:hover .content .number {

  display: none;

}

.working-process-wrapper5:hover .content .desc {

  opacity: 1;

}

.working-process-wrapper5:hover .image-area a {

  display: block;

}

.working-process-wrapper5:hover .image-area a img {

  transform: scale(1.15);

}

.working-process-wrapper5 .image-area a {

  display: block;

}

.working-process-wrapper5 .image-area a img {

  transition: 0.4s;

}

.working-process-wrapper5::before {

  content: "";

  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 47.81%, rgba(0, 0, 0, 0.37) 58.9%, #000000 100%);

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  z-index: 1;

  position: absolute;

  transition: var(--transition);

  opacity: 1;

}

.working-process-wrapper5::after {

  content: "";

  background: linear-gradient(180deg, rgba(255, 94, 20, 0) 0%, rgba(255, 94, 20, 0.15) 47.81%, rgba(255, 94, 20, 0.45) 58.9%, #FF5E14 100%);

  width: 100%;

  height: 100%;

  bottom: -100%;

  opacity: 0;

  left: 0;

  z-index: 1;

  position: absolute;

  transition: var(--transition);

}

.working-process-wrapper5 .content {

  position: absolute;

  z-index: 2;

  width: 100%;

  max-width: 233px;

  left: 30px;

  bottom: -27%;

  text-align: start;

  transition: var(--transition);

}

@media only screen and (max-width: 1199px) {

  .working-process-wrapper5 .content {

    width: 93%;

    bottom: -43% !important;

  }

}

@media only screen and (max-width: 991px) {

  .working-process-wrapper5 .content {

    bottom: -26% !important;

    width: 92%;

    left: 20px !important;

  }

}

@media only screen and (max-width: 767px) {

  .working-process-wrapper5 .content {

    width: 92%;

    bottom: -18% !important;

  }

}

@media only screen and (max-width: 576px) {

  .working-process-wrapper5 .content {

    max-width: 100%;

  }

}

@media only screen and (max-width: 479px) {

  .working-process-wrapper5 .content {

    bottom: -27% !important;

  }

}

.working-process-wrapper5 .content .number {

  font-family: var(--font-primary);

  font-weight: 600;

  font-size: 48px;

  line-height: 35px;

  background: transparent;

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

  -webkit-text-stroke: 1px var(--color-white);

  opacity: 0.2;

  margin-bottom: 15px;

}

.working-process-wrapper5 .content .title {

  margin-bottom: 15px;

  transition: var(--transition);

  line-height: 1;

  font-size: 20px;

}

.working-process-wrapper5 .content .title a {

  color: var(--color-white);

  transition: var(--transition);

}

.working-process-wrapper5 .content .desc {

  color: var(--color-white);

  font-size: 16px;

  line-height: 24px;

  opacity: 0;

}

@media only screen and (max-width: 1199px) {

  .working-process-wrapper5 .content .desc {

    opacity: 1;

  }

}

@media only screen and (max-width: 576px) {

  .working-process-wrapper5::before {

    opacity: 0;

  }

  .working-process-wrapper5::after {

    opacity: 1;

    bottom: 0;

  }

  .working-process-wrapper5 .content {

    bottom: 25px !important;

  }

}

@media only screen and (max-width: 576px) and (max-width: 1199px) {

  .working-process-wrapper5 .content {

    bottom: 15px !important;

  }

}

@media only screen and (max-width: 576px) {

  .working-process-wrapper5 .content .title {

    margin-bottom: 10px;

  }

  .working-process-wrapper5 .content .number {

    display: none;

  }

  .working-process-wrapper5 .image-area a {

    display: block;

  }

  .working-process-wrapper5 .image-area a img {

    transform: scale(1.15);

  }

}



.working-process-wrapper6 .content {

  text-align: start;

  transition: var(--transition);

  max-width: 342px;

}

.working-process-wrapper6 .content .number {

  font-family: var(--font-primary);

  font-weight: 800;

  font-size: 150px;

  line-height: 1;

  margin-bottom: -40px;

  background: linear-gradient(180deg, rgba(0, 0, 0, 0.044) 32.25%, rgba(255, 255, 255, 0) 86%);

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

  background-clip: text;

  text-fill-color: transparent;

  opacity: 0.8;

}

.working-process-wrapper6 .content .title {

  margin-bottom: 15px;

  transition: var(--transition);

  line-height: 1;

  font-size: 30px;

}

.working-process-wrapper6 .content .title a {

  color: var(--color-heading-1);

  transition: var(--transition);

}



.working-process-wrapper7 {

  overflow: hidden;

  position: relative;

  z-index: 1;

  display: block;

}

.working-process-wrapper7::before {

  content: "";

  background: #0c1e21;

  position: absolute;

  width: 100%;

  height: 100%;

  bottom: 0;

  inset-inline-start: 0;

  opacity: 0.25;

  pointer-events: none;

  z-index: 1;

  transition: 0.3s;

}

.working-process-wrapper7 .image-area img {

  transition: 0.4s;

  filter: grayscale(0.5);

}

.working-process-wrapper7 .image-area .tmp-icon-overlay-link-btn {

  position: absolute;

  top: 40px;

  right: 40px;

  opacity: 0;

}

.working-process-wrapper7 .content {

  position: absolute;

  z-index: 1;

  left: -90%;

  bottom: 30px;

  background: var(--color-white);

  padding: 30px;

  border-radius: 4px;

  max-width: 420px;

  width: 100%;

  transition: all 0.5s;

}

@media only screen and (max-width: 479px) {

  .working-process-wrapper7 .content {

    padding: 16px;

    left: 15px;

    bottom: 15px;

  }

}

.working-process-wrapper7 .content p {

  border-radius: 4px;

  padding: 0 10px;

  font-size: 14px;

  color: var(--color-white);

  max-width: max-content;

  margin-bottom: 15px;

  height: 29px;

  display: flex;

  align-items: center;

  font-weight: 400;

  background: var(--color-primary);

}

.working-process-wrapper7 .content .title {

  font-size: 28px;

  line-height: 1;

  font-weight: 600;

}

@media only screen and (max-width: 991px) {

  .working-process-wrapper7 .content .title {

    font-size: 22px;

    line-height: 1.3;

    font-weight: 600;

  }

}

@media only screen and (max-width: 576px) {

  .working-process-wrapper7 .content .title {

    font-size: 18px;

  }

}

.working-process-wrapper7 .content .title a {

  color: var(--color-heading-1);

}

.working-process-wrapper7:hover .image-area img {

  transform: scale(1.15);

  filter: grayscale(0);

}

.working-process-wrapper7:hover .image-area .tmp-icon-overlay-link-btn {

  opacity: 1;

}

.working-process-wrapper7:hover .content {

  left: 30px;

}



.swiper-slide-active .working-process-wrapper7::before {

  opacity: 0;

}

.swiper-slide-active .working-process-wrapper7 .image-area img {

  filter: grayscale(0);

}

.swiper-slide-active .working-process-wrapper7 .image-area .arrow-btn {

  opacity: 1;

}

.swiper-slide-active .working-process-wrapper7 .content {

  left: 30px;

}



.working-process-wrapper8 {

  padding: 30px;

  border-radius: 6px;

  position: relative;

  z-index: 1;

  transition: 0.3s;

  background: var(--color-white);

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

  height: 100%;

}

.working-process-wrapper8:hover {

  transform: translateY(-5px) scale(1.02);

}

.working-process-wrapper8:hover .icon img {

  animation: bounceIn 0.8s ease;

}

.working-process-wrapper8 span {

  color: #f7f7f7;

  font-size: 100px;

  line-height: 1;

  font-weight: 600;

  position: absolute;

  top: 10px;

  right: 17px;

  z-index: 3;

  opacity: 0.5;

}

.working-process-wrapper8 .icon {

  margin-bottom: 25px;

}

.working-process-wrapper8 .icon img {

  max-width: 50px;

}

.working-process-wrapper8 .content h5,

.working-process-wrapper8 .content h3 {

  font-size: 20px;

  line-height: 1;

  margin-bottom: 15px;

}



.working-process-image-wrapper {

  position: relative;

  z-index: 1;

  text-align: end;

  height: 100%;

  right: -100px;

}

.working-process-image-wrapper.right-0-default {

  right: 0;

}

@media only screen and (max-width: 1199px) {

  .working-process-image-wrapper.right-0 {

    max-width: 100%;

    right: 0;

  }

}

@media only screen and (max-width: 1199px) {

  .working-process-image-wrapper.right-0 img {

    width: 100%;

  }

}

.working-process-image-wrapper img:nth-child(2) {

  position: absolute;

  bottom: 0;

  left: -60px;

  z-index: 1;

  max-width: 270px;

  border-radius: 6px;

}

@media only screen and (max-width: 1199px) {

  .working-process-image-wrapper img:nth-child(2) {

    display: none;

  }

}



.work-process-area-wrapper {

  display: flex;

  justify-content: space-between;

  gap: 50px;

  position: relative;

  z-index: 1;

  margin-top: 50px;

}

@media only screen and (max-width: 1199px) {

  .work-process-area-wrapper {

    flex-wrap: wrap;

    justify-content: center;

    gap: 30px;

  }

}

.work-process-area-wrapper .process-line {

  position: absolute;

  top: 53px;

  left: 58%;

  transform: translateX(-50%);

  z-index: -1;

  width: 100%;

}

@media only screen and (max-width: 1199px) {

  .work-process-area-wrapper .process-line {

    display: none;

  }

}

.work-process-area-wrapper .single-process-item {

  width: 260px;

  text-align: center;

}

@media only screen and (max-width: 767px) {

  .work-process-area-wrapper .single-process-item {

    width: 237px;

  }

}

.work-process-area-wrapper .single-process-item.have-margin {

  margin-top: -50px;

}

@media only screen and (max-width: 1199px) {

  .work-process-area-wrapper .single-process-item.have-margin {

    margin-top: 0;

  }

}

.work-process-area-wrapper .single-process-item .thumbnail {

  width: 190px;

  height: 190px;

  line-height: 190px;

  text-align: center;

  border-radius: 50%;

  transition: var(--transition);

  margin: 0 auto;

  position: relative;

  z-index: 1;

}

.work-process-area-wrapper .single-process-item .thumbnail img {

  border-radius: 100%;

}

.work-process-area-wrapper .single-process-item .thumbnail .number {

  position: absolute;

  top: 0;

  left: 0;

  display: block;

  width: 50px;

  height: 50px;

  line-height: 50px;

  text-align: center;

  border-radius: 50%;

  transition: 0.5s;

  font-size: 24px;

  font-weight: 500;

  color: var(--color-white);

  background-color: var(--color-primary);

}

.work-process-area-wrapper .single-process-item .inner-content .title {

  font-size: 24px;

  margin-top: 30px;

  margin-bottom: 10px;

}

.work-process-area-wrapper .single-process-item:hover .number {

  animation: bounceIn 1s forwards;

  animation-delay: 0.5s;

  top: 0;

  left: calc(100% - 50px);

}



.pricing-wrapper {

  background: var(--color-white);

  border-radius: 6px;

  box-shadow: 0px 5px 20px 5px rgba(0, 0, 0, 0.06);

  padding: 40px 35px;

  position: relative;

  z-index: 1;

  overflow: hidden;

}

@media only screen and (max-width: 576px) {

  .pricing-wrapper {

    padding: 25px 15px;

  }

}

.pricing-wrapper .icon {

  margin-bottom: 20px;

}

.pricing-wrapper .title {

  line-height: 1;

  margin-bottom: 15px;

  font-size: 30px;

}

.pricing-wrapper .desc {

  color: #717580;

  margin-bottom: 15px;

}

.pricing-wrapper .price-period {

  font-size: 50px;

  line-height: 1;

  font-weight: 600;

  color: var(--color-heading-1);

}

.pricing-wrapper .price-period span {

  font-size: 16px;

  line-height: 1;

  font-family: var(--font-secondary);

}

.pricing-wrapper .feature-title {

  margin-top: 25px;

  margin-bottom: 15px;

  font-weight: 600;

  font-size: 20px;

}

.pricing-wrapper .pricing-feature {

  display: flex;

  flex-direction: column;

  gap: 12px;

  margin-bottom: 32px;

}

.pricing-wrapper .pricing-feature li {

  display: flex;

  align-items: center;

  gap: 6px;

  color: #717580;

}

.pricing-wrapper .pricing-feature li .check {

  width: 20px;

  height: 20px;

  line-height: 20px;

  text-align: center;

  display: block;

  border-radius: 50%;

  background: rgba(255, 112, 41, 0.15);

  color: var(--color-primary);

}

.pricing-wrapper .pricing-feature li .check i {

  font-size: 12px;

}

.pricing-wrapper .tmp-btn {

  max-width: 100%;

  text-align: center;

  border: 1px solid #E4E4E4;

  background: transparent;

  transition: var(--transition);

  color: var(--color-heading-1);

  font-weight: 500;

  font-size: 20px;

  padding: 19px 33px;

  line-height: 1;

}

.pricing-wrapper .tmp-btn:hover {

  color: var(--color-white);

}

.pricing-wrapper .tmp-btn::after {

  background: var(--color-heading-1);

}

.pricing-wrapper .popular-tag {

  background: var(--color-primary);

  color: var(--color-white);

  text-align: center;

  position: absolute;

  z-index: -1;

  height: 45px;

  top: 30px;

  right: -75px;

  width: 260px;

  transform: rotate(45deg);

  line-height: 45px;

}

.pricing-wrapper.mid .tmp-btn {

  background: var(--color-primary);

  color: var(--color-white);

}



.tmp-pricing-area.area-2 {

  position: relative;

  z-index: 1;

}

@media only screen and (max-width: 1199px) {

  .tmp-pricing-area.area-2 .pricing-hero img {

    width: 100%;

  }

}

.tmp-pricing-area.area-2 .pricing-inner {

  margin-left: 60px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-pricing-area.area-2 .pricing-inner {

    margin-left: 30px;

  }

}

@media only screen and (max-width: 1199px) {

  .tmp-pricing-area.area-2 .pricing-inner {

    margin-left: 0;

    margin-top: 40px;

    padding: 0 15px;

  }

}



.pricing-wrapper2 {

  position: relative;

  z-index: 1;

  overflow: hidden;

  border-radius: 4px !important;

  background: rgba(149, 149, 149, 0.1);

  padding: 25px 30px;

  border: none;

  border-left: 3px solid var(--color-primary);

}

@media only screen and (max-width: 479px) {

  .pricing-wrapper2 {

    padding: 15px 15px;

  }

}

.pricing-wrapper2:not(:last-child) {

  margin-bottom: 30px;

}

.pricing-wrapper2 .accordion-header button {

  background: none;

  padding: 0;

  border-radius: 0;

  border: none;

  box-shadow: none;

  color: var(--color-heading-1);

  font-size: 20px;

  line-height: 1.2;

  font-weight: 600;

  justify-content: space-between;

  transform: none;

}

.pricing-wrapper2 .accordion-header button[aria-expanded=true]::after {

  content: "\f077";

  background: var(--color-primary);

  color: var(--color-white);

  transform: none;

}

.pricing-wrapper2 .accordion-header button::after {

  background: var(--primary-200);

  width: 30px;

  height: 30px;

  border-radius: 50%;

  line-height: 30px;

  color: var(--color-primary);

  font-size: 14px;

  text-align: center;

  content: "\f078";

  font-family: "Font Awesome 6 Pro";

  margin: 0;

  font-weight: 400;

}

.pricing-wrapper2 .accordion-body {

  padding: 0;

  padding-top: 15px;

}

.pricing-wrapper2 .accordion-body .desc {

  max-width: 400px;

  margin-bottom: 20px;

}

.pricing-wrapper2 .accordion-body .price-bottom {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

@media only screen and (max-width: 576px) {

  .pricing-wrapper2 .accordion-body .price-bottom {

    flex-wrap: wrap;

    gap: 15px;

  }

}

.pricing-wrapper2 .accordion-body .price-bottom h2 {

  margin-bottom: 0;

  font-size: 30px;

  line-height: 1;

}

.pricing-wrapper2 .accordion-body .price-bottom h2 span {

  font-size: 18px;

  color: var(--color-body);

  font-weight: 400;

}

.pricing-wrapper2 .accordion-body .price-bottom .border-btn {

  border: 1px solid var(--color-border);

  font-size: 20px;

  font-weight: 600;

  font-family: var(--font-primary);

  color: var(--color-heading-1);

}



.tmp-pricing-area.area-3 {

  background: #F6F6F6;

  position: relative;

  z-index: 1;

}

.tmp-pricing-area.area-3 .shape-area img {

  position: absolute;

  top: 0;

  left: 0;

  z-index: -1;

  animation: rotateIt 15s linear infinite;

}

@media only screen and (max-width: 767px) {

  .tmp-pricing-area.area-3 .shape-area img {

    max-width: 180px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-pricing-area.area-3 .shape-area img {

    max-width: 120px;

  }

}



.col-xl-3 .pricing-wrapper3 .pricing-header .left .price {

  font-size: 26px;

}

.col-xl-3 .pricing-wrapper3 .pricing-header .icon {

  height: 60px;

  width: 60px;

}

.col-xl-3 .pricing-wrapper3 .pricing-header .icon img {

  max-width: 30px;

}

.col-xl-3 .pricing-wrapper3 .pricing-body {

  padding: 30px 10px 0;

}

.col-xl-3 .pricing-wrapper3 .pricing-button-area {

  padding: 30px 10px 0;

}



.pricing-wrapper3 {

  padding: 14px 14px 25px 14px;

  background: #FFFFFF;

  box-shadow: var(--shadow-1);

  border-radius: 6px;

}

.pricing-wrapper3.shadow-large {

  box-shadow: 0px 4px 53px rgba(0, 0, 0, 0.07);

}

.pricing-wrapper3 .pricing-header {

  background: var(--color-heading-1);

  border-radius: 6px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 40px 20px;

}

.pricing-wrapper3 .pricing-header .left .plan {

  color: var(--color-white);

  font-family: var(--font-secondary);

  font-weight: 400;

  font-size: 18px;

  margin-bottom: 15px;

}

.pricing-wrapper3 .pricing-header .left h3 {

  color: var(--color-white);

  font-size: 34px;

  line-height: 1;

  margin-bottom: 0;

}

.pricing-wrapper3 .pricing-header .left h3 span {

  font-size: 16px;

  font-family: var(--font-secondary);

  color: rgba(255, 255, 255, 0.7);

  font-weight: 400;

}

.pricing-wrapper3 .pricing-header .icon {

  width: 80px;

  height: 80px;

  background: rgba(255, 255, 255, 0.1294117647);

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

}

.pricing-wrapper3 .pricing-header .icon svg {

  max-width: 40px;

}

.pricing-wrapper3 .pricing-header .icon svg path {

  fill: transparent;

  stroke: var(--color-white);

  stroke-width: 1.5px;

}

.pricing-wrapper3 .pricing-header .icon img {

  max-width: 40px;

  filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7428%) hue-rotate(83deg) brightness(98%) contrast(106%);

}

.pricing-wrapper3 .pricing-body {

  padding: 30px 15px 0;

}

.pricing-wrapper3 .pricing-body h6,

.pricing-wrapper3 .pricing-body h4 {

  font-size: 16px;

  line-height: 1;

  font-weight: 600;

}

.pricing-wrapper3 .pricing-body ul {

  display: flex;

  flex-direction: column;

  gap: 13px;

}

.pricing-wrapper3 .pricing-body ul li {

  line-height: 1;

  display: flex;

  align-items: center;

  gap: 7px;

  font-size: 16px;

  color: var(--color-body);

}

.pricing-wrapper3 .pricing-body ul li span {

  width: 20px;

  height: 20px;

  display: block;

  text-align: center;

  line-height: 22px;

  background: var(--primary-100);

  border-radius: 50%;

  color: var(--color-primary-2);

  font-size: 10px;

}

.pricing-wrapper3 .pricing-button-area {

  padding: 30px 20px 0;

}

.pricing-wrapper3.mid .pricing-header {

  background: var(--color-primary-2);

}

.pricing-wrapper3.mid .pricing-button-area .tmp-btn {

  background: var(--color-primary);

  color: var(--color-white);

}

.pricing-wrapper3.mid .pricing-button-area .tmp-btn:hover {

  background: transparent;

}

.pricing-wrapper3:hover .pricing-header .icon img {

  animation: bounceIn 0.8s ease;

}

.pricing-wrapper3:hover .pricing-header .icon svg {

  stroke-width: 2px;

}



.container-fluid-pp {

  max-width: 1920px;

  margin: auto;

}



.tmp-pricing-style-tab .section-inner ul.nav {

  padding: 0;

  margin: 0;

  border: none;

  justify-content: center;

  gap: 0;

  border: none;

  max-width: 400px;

  background-color: var(--color-white);

  justify-content: space-between;

  margin: 0 auto;

  margin-bottom: 50px;

  max-width: max-content;

  border-radius: 50px;

  box-shadow: var(--shadow-1);

}

.tmp-pricing-style-tab .section-inner ul.nav li {

  margin: 0;

  padding: 0;

}

.tmp-pricing-style-tab .section-inner ul.nav li button {

  padding: 15px 45px;

  border-radius: 33px;

  border: none;

  color: var(--color-heading-1);

  font-weight: 500;

}

@media only screen and (max-width: 576px) {

  .tmp-pricing-style-tab .section-inner ul.nav li button {

    padding: 13px 32px;

  }

}

.tmp-pricing-style-tab .section-inner ul.nav li button.active {

  background: var(--color-primary);

  color: var(--color-white);

}



.company-history-area-2 {

  /**

  * Timeline styling

  */

  /**

   * Basic styling

   */

}

.company-history-area-2 .timeline {

  position: relative;

  margin: 0;

  padding: 0;

  list-style: none;

}

.company-history-area-2 .timeline:before {

  content: "";

  position: absolute;

  top: -3em;

  left: 2em;

  width: 0.25em;

  height: calc(100% + 6em);

  background: var(--color-primary);

  border-radius: 4px;

}

@media screen and (min-width: 45em) {

  .company-history-area-2 .timeline:before {

    left: 50%;

    transform: translateX(-50%);

  }

}

.company-history-area-2 .timeline__entry {

  position: relative;

  margin-bottom: 4em;

  color: #fff;

}

.company-history-area-2 .timeline__entry:after {

  content: "";

  display: table;

  clear: both;

}

.company-history-area-2 .timeline__id {

  position: absolute;

  top: 1em;

  left: 2em;

  padding: 0.5em 20px;

  background: rgba(255, 255, 255, 0.4117647059);

  transform: translateX(-50%);

  border: 2px solid rgba(26, 116, 123, 0.1607843137);

  backdrop-filter: blur(6px);

  border-radius: 33px;

  color: var(--color-primary);

  font-weight: 700;

}

@media screen and (min-width: 45em) {

  .company-history-area-2 .timeline__id {

    left: 50%;

    transform: translateX(-50%);

  }

}

.company-history-area-2 .timeline__content {

  position: relative;

  display: block;

  margin-left: 6em;

  padding: 25px;

  background: #ffffff;

  box-shadow: var(--shadow-1);

  border-radius: 6px;

}

@media screen and (min-width: 45em) {

  .company-history-area-2 .timeline__content {

    margin-left: 0;

    width: calc(50% - 4em);

  }

}

.company-history-area-2 .timeline__content:before {

  content: "";

  position: absolute;

  display: block;

  top: 1.3em;

  left: -1em;

  border-top: 14px solid transparent;

  border-bottom: 14px solid transparent;

  border-right: 1em solid var(--color-primary);

}

@media screen and (min-width: 45em) {

  .company-history-area-2 .timeline__content:before {

    left: auto;

    right: -1em;

    border-left: 1em solid var(--color-primary);

    border-right: none;

  }

}

.company-history-area-2 .timeline__content .image-area-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-top: 30px;

  gap: 20px;

}

.company-history-area-2 .timeline__content .image-area-wrapper .single {

  border-radius: 8px;

  overflow: hidden;

}

@media screen and (min-width: 45em) {

  .company-history-area-2 .timeline__content--flipped {

    float: right;

  }

  .company-history-area-2 .timeline__content--flipped:before {

    left: -1em;

    right: auto;

    border-left: none;

    border-right: 1em solid var(--color-primary);

  }

}

.company-history-area-2 .timeline__heading {

  margin-bottom: 20px;

  font-size: 26px;

  line-height: 1.4;

}

@media only screen and (max-width: 767px) {

  .company-history-area-2 .timeline__heading {

    font-size: 22px;

    line-height: 1.3;

  }

}

.company-history-area-2 .timeline__text:last-child {

  margin-bottom: 0;

}

.company-history-area-2 * {

  box-sizing: inherit;

  margin: 0;

  padding: 0;

}

.company-history-area-2 html {

  box-sizing: border-box;

}

.company-history-area-2 body {

  line-height: 1.4;

  background-color: #151515;

}

.company-history-area-2 .container {

  width: 85%;

  max-width: 1200px;

  margin: 0 auto;

}

.company-history-area-2 .section-title {

  padding-bottom: 120px;

  text-align: center;

  color: var(--color-heading-1);

  max-width: 95%;

  margin: auto;

  font-size: 36px;

  line-height: 1.4;

}

@media only screen and (max-width: 767px) {

  .company-history-area-2 .section-title {

    font-size: 28px;

    line-height: 1.3;

    max-width: 100%;

  }

}

@media only screen and (max-width: 576px) {

  .company-history-area-2 .section-title {

    font-size: 20px;

    line-height: 1.3;

  }

}

.company-history-area-2 .section-title span {

  color: var(--color-primary);

}



.tmp-form-area {

  background: var(--color-white);

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

  border-radius: 10px;

  padding: 50px;

}

@media only screen and (max-width: 1199px) {

  .tmp-form-area {

    padding: 30px;

  }

}

.tmp-form-area .form-title {

  font-size: 30px;

  line-height: 1.2;

}

@media only screen and (max-width: 479px) {

  .tmp-form-area .form-title {

    font-size: 20px;

  }

}

.tmp-form-area .single-wrapper {

  margin-bottom: 30px;

  position: relative;

  z-index: 1;

}

.tmp-form-area .single-wrapper input {

  padding: 7px 0 12px;

  border-bottom: 1px solid #f5f5f5;

  color: var(--color-heading-1);

}

.tmp-form-area .single-wrapper input:focus {

  border-color: var(--color-primary);

}

.tmp-form-area .single-wrapper input::placeholder {

  line-height: 1 !important;

}

.tmp-form-area .single-wrapper textarea {

  min-height: 120px;

  border-bottom: 1px solid #f5f5f5;

  padding: 0;

}

.tmp-form-area .single-wrapper textarea:focus {

  border-color: var(--color-primary);

}

.tmp-form-area .single-wrapper i {

  position: absolute;

  right: 10px;

  top: 13px;

}

.tmp-form-area .single-wrapper button {

  display: block;

  max-width: 100%;

  border: none;

  padding: 25px 33px;

}

@media only screen and (max-width: 576px) {

  .tmp-form-area .single-wrapper button {

    display: flex;

  }

}

.tmp-form-area .single-wrapper.message {

  margin-bottom: 20px;

}



.check-box-flex-wrapper {

  display: flex;

  align-items: center;

  gap: 30px;

}

@media only screen and (max-width: 767px) {

  .check-box-flex-wrapper {

    flex-wrap: wrap;

  }

}

@media only screen and (max-width: 576px) {

  .check-box-flex-wrapper {

    gap: 10px;

  }

}

.check-box-flex-wrapper .check-box label {

  margin: 0 !important;

}

.check-box-flex-wrapper .check-box input {

  max-width: max-content;

  height: auto;

}



.tmp-get-in-touch-area .section-inner {

  position: relative;

  z-index: 1;

  background: #FFFFFF;

  box-shadow: 0px 4px 53px rgba(0, 0, 0, 0.07);

  border-radius: 6px;

  overflow: hidden;

  transition: 0.3s;

}

.tmp-get-in-touch-area .section-inner:hover .icon a i {

  animation: bounceIn 0.8s ease;

}

.tmp-get-in-touch-area .section-inner .left-image {

  position: absolute;

  top: 0;

  left: 0;

  z-index: -1;

}

.tmp-get-in-touch-area .section-inner .content {

  display: flex;

  align-items: center;

  justify-content: center;

  padding: 37px 50px 37px;

  gap: 31px;

  margin-left: 85px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-get-in-touch-area .section-inner .content {

    margin-left: 222px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-get-in-touch-area .section-inner .content {

    padding: 30px;

  }

}

.tmp-get-in-touch-area .section-inner .icon a {

  display: block;

  width: 125px;

  height: 125px;

  line-height: 130px;

  border-radius: 50%;

  text-align: center;

  background: var(--color-primary);

  color: var(--color-white);

  font-size: 40px;

}

.tmp-get-in-touch-area .section-inner .text {

  max-width: 543px;

}

.tmp-get-in-touch-area .section-inner .text .title {

  font-weight: 600;

  margin-bottom: 12px;

  font-size: 24px;

  line-height: 1.4;

}

.tmp-get-in-touch-area .section-inner .text a.phone {

  font-size: 24px;

  line-height: 1.25;

  color: var(--color-primary);

  font-weight: 600;

  font-family: var(--font-primary);

}

.tmp-get-in-touch-area .section-inner .text .desc {

  margin-top: 10px;

  color: #717580;

}

.tmp-get-in-touch-area .section-inner .shape {

  position: absolute;

  top: 0;

  right: 0;

  z-index: -1;

}

@media only screen and (max-width: 991px) {

  .tmp-get-in-touch-area .section-inner .shape {

    display: none;

  }

}

.tmp-get-in-touch-area.area-2 .section-inner .icon a {

  display: block;

  width: 90px;

  height: 90px;

  line-height: 95px;

  border-radius: 50%;

  text-align: center;

  background: var(--color-primary-2);

  color: var(--color-white);

  font-size: 30px;

}

.tmp-get-in-touch-area.area-2 .section-inner .text a {

  color: var(--color-primary-2);

}

.tmp-get-in-touch-area.area-3 .section-inner {

  background: transparent;

  box-shadow: none;

}

.tmp-get-in-touch-area.area-3 .get-in-touch-wrapper {

  text-align: center;

  border-radius: 4px;

  background: #b9d8ff;

  height: 100%;

  padding: 30px 27px;

  box-shadow: var(--shadow-1);

  transition: var(--transition);

}

.tmp-get-in-touch-area.area-3 .get-in-touch-wrapper:hover {

  transform: scale(1.02);

}

.tmp-get-in-touch-area.area-3 .get-in-touch-wrapper:hover .icons i {

  animation: bounceIn 0.8s ease;

}

.tmp-get-in-touch-area.area-3 .get-in-touch-wrapper .icon {

  margin-bottom: 15px;

  display: block;

}

.tmp-get-in-touch-area.area-3 .get-in-touch-wrapper .icons {

  height: 70px;

  width: 70px;

  border-radius: 50%;

  margin: auto;

  margin-bottom: 20px;

  box-shadow: var(--shadow-1);

  display: flex;

  align-items: center;

  justify-content: center;

}

.tmp-get-in-touch-area.area-3 .get-in-touch-wrapper .icons i {

  font-size: 36px;

  color: var(--color-primary);

}

.tmp-get-in-touch-area.area-3 .get-in-touch-wrapper .title {

  margin-bottom: 15px;

  color: #000000;

  font-size: 20px;

  line-height: 1.2;

}

.tmp-get-in-touch-area.area-3 .get-in-touch-wrapper p {

  margin-bottom: 0;

}

.tmp-get-in-touch-area.area-3 .get-in-touch-wrapper p:last-child {

  margin-top: 3px;

}

.tmp-get-in-touch-area.area-3 .get-in-touch-wrapper p a {

  font-size: 18px;

}

.tmp-get-in-touch-area.area-3 .get-in-touch-wrapper p a:hover {

  color: var(--color-primary-2);

}



.tmp-contact-area .left-side-content {

  background: var(--color-white);

  box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.06);

  border-radius: 6px;

  padding: 30px;

  height: 100%;

}

@media only screen and (max-width: 479px) {

  .tmp-contact-area .left-side-content {

    padding: 20px;

  }

}

.tmp-contact-area .left-side-content .image-area {

  margin-bottom: 30px;

}

.tmp-contact-area .left-side-content .content {

  max-width: 537px;

  margin-bottom: 30px;

}

.tmp-contact-area .left-side-content .content .title {

  margin-bottom: 10px;

  line-height: 1;

  font-size: 30px;

}

.tmp-contact-area .left-side-content .social-bottom-area {

  display: flex;

  align-items: center;

  gap: 70px;

}

@media only screen and (max-width: 1199px) {

  .tmp-contact-area .left-side-content .social-bottom-area {

    gap: 10px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-contact-area .left-side-content .social-bottom-area {

    flex-wrap: wrap;

    gap: 20px !important;

  }

}

.tmp-contact-area .left-side-content .social-bottom-area .phone h4 {

  font-size: 20px;

}

.tmp-contact-area .left-side-content .social-bottom-area h5 {

  font-size: 16px;

  line-height: 1;

  margin-bottom: 20px;

  color: var(--color-body);

  font-weight: 400;

  font-family: var(--font-secondary);

}

.tmp-contact-area .left-side-content .social-bottom-area .phone a {

  font-size: 22px;

  line-height: 1;

  font-weight: 600;

  font-family: var(--font-primary);

  color: var(--color-heading-1);

  transition: var(--transition);

}

.tmp-contact-area .left-side-content .social-bottom-area .phone a:hover {

  color: var(--color-primary-2);

}

.tmp-contact-area .left-side-content .social-bottom-area .social-icon-wrapper h4 {

  position: relative;

  z-index: 1;

  max-width: max-content;

  margin-bottom: 5px;

  color: var(--color-body);

  font-weight: 400;

  font-family: var(--font-secondary);

  font-size: 20px;

}

.tmp-contact-area .left-side-content .social-bottom-area .social-icon-wrapper h4::after {

  content: "";

  position: absolute;

  width: 56px;

  height: 1px;

  background: var(--primary-400);

  right: -70px;

  top: 50%;

  transform: translateY(-50%);

  z-index: -1;

}

.tmp-contact-area .left-side-content .social-bottom-area .social-icon-wrapper .social-share-wrapper-1 .social-stylle-one li a {

  background: #f1f1f1;

}

.tmp-contact-area .left-side-content .social-bottom-area .social-icon-wrapper .social-share-wrapper-1 .social-stylle-one li a i {

  color: var(--color-heading-1);

}

.tmp-contact-area .left-side-content .social-bottom-area .social-icon-wrapper .social-share-wrapper-1 .social-stylle-one li a:hover i {

  color: var(--color-white);

}

.tmp-contact-area .contact-form-area {

  background: var(--color-white);

  box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.06);

  border-radius: 6px;

  padding: 30px;

  height: 100%;

}

@media only screen and (max-width: 576px) {

  .tmp-contact-area .contact-form-area {

    padding: 25px;

  }

}

.tmp-contact-area .contact-form-area form .title {

  margin-bottom: 20px;

  font-size: 30px;

  line-height: 1.2;

}

.tmp-contact-area .contact-form-area form .single-wrapper:not(:last-child) {

  margin-bottom: 15px;

}

.tmp-contact-area .contact-form-area form label {

  margin-bottom: 10px;

  color: var(--color-body);

  font-weight: 500;

}

.tmp-contact-area .contact-form-area form label i {

  margin-right: 2px;

  font-size: 14px;

  color: var(--color-primary);

}

.tmp-contact-area .contact-form-area form input, .tmp-contact-area .contact-form-area form textarea {

  border-radius: 6px;

  border: 2px solid var(--color-border);

  padding: 10px 15px;

  color: var(--color-heading-1);

}

.tmp-contact-area .contact-form-area form input:focus, .tmp-contact-area .contact-form-area form textarea:focus {

  border: 2px solid var(--color-primary-2);

}

.tmp-contact-area .contact-form-area form textarea {

  min-height: 130px;

}

.tmp-contact-area .contact-form-area form button {

  width: 100%;

  max-width: 100%;

  text-align: center;

  border: none;

  box-shadow: none;

}



.banner-contact-form {

  box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.06);

  position: absolute;

  right: 0;

  bottom: 0;

  padding: 20px 0 0 20px;

  background: var(--primary-100);

  border-top-left-radius: 10px;

  z-index: 1;

}

@media (max-width: 768px) {

  .banner-contact-form {

    position: relative;

    box-shadow: none;

    background: transparent;

    padding: 20px 0 0 0;

  }

  .banner-contact-form form {

    width: 100%;

  }

}

@media only screen and (max-width: 767px) {

  .banner-contact-form {

    position: relative;

    box-shadow: none;

    background: transparent;

    padding: 20px 0 0 0;

  }

}

.banner-contact-form form {

  border-radius: 10px;

  padding: 41px 31px 54px;

  background: var(--color-heading-1);

  width: 460px;

  position: relative;

  z-index: 1;

}

@media (max-width: 768px) {

  .banner-contact-form form {

    width: 100% !important;

  }

}

.banner-contact-form form .title {

  margin-bottom: 15px;

  color: var(--color-white);

  line-height: 1.2;

  font-size: 30px;

}

.banner-contact-form form .desc {

  color: var(--color-white);

}

.banner-contact-form form .single-wrapper:not(:last-child) {

  margin-bottom: 25px;

}

.banner-contact-form form label {

  margin-bottom: 5px;

}

.banner-contact-form form input, .banner-contact-form form textarea {

  border-radius: 0;

  border-bottom: 1px solid rgba(228, 228, 228, 0.1);

  padding: 0;

  padding-bottom: 15px;

  color: var(--color-white);

}

.banner-contact-form form input:focus, .banner-contact-form form textarea:focus {

  border-bottom: 1px solid var(--color-primary-2);

}

.banner-contact-form form input::placeholder, .banner-contact-form form textarea::placeholder {

  color: rgba(255, 255, 255, 0.8) !important;

}

.banner-contact-form form textarea {

  min-height: 80px;

}

.banner-contact-form form button {

  width: 100%;

  max-width: max-content;

  text-align: center;

  border: none;

  box-shadow: none;

  background: var(--color-white) !important;

  color: var(--color-primary-2) !important;

}

.banner-contact-form form button:hover {

  color: var(--color-white) !important;

}

.banner-contact-form form button::after {

  background: var(--color-primary-2) !important;

}

.banner-contact-form .top-right {

  height: 60px;

  width: 60px;

  background: transparent;

  border-bottom-right-radius: 20px;

  position: absolute;

  right: 0;

  top: -60px;

  box-shadow: 30px 0 0 0 var(--primary-100);

  overflow: hidden;

}

.banner-contact-form .bottom-left {

  height: 60px;

  width: 60px;

  background: transparent;

  border-bottom-right-radius: 20px;

  position: absolute;

  left: -60px;

  bottom: 0;

  box-shadow: 30px 0 0 0 var(--primary-100);

  overflow: hidden;

}



.contact-map {

  height: 100%;

  background: var(--color-white);

  box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.06);

  padding: 30px;

  border-radius: 10px;

  position: relative;

  z-index: 1;

}

.contact-map .height-map {

  height: 650px;

}

@media only screen and (max-width: 576px) {

  .contact-map {

    padding: 20px;

  }

}

.contact-map .location {

  position: absolute;

  z-index: 1;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

}

.contact-map iframe {

  height: 100%;

  border-radius: 10px;

}



.tmp-top-contact-area {

  padding-bottom: 60px;

}

.tmp-top-contact-area .section-inner {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

@media only screen and (max-width: 1199px) {

  .tmp-top-contact-area .section-inner {

    flex-wrap: wrap;

  }

}

.tmp-top-contact-area .section-inner .desc {

  max-width: 585px;

  padding-left: 20px;

  position: relative;

  z-index: 1;

}

.tmp-top-contact-area .section-inner .desc::after {

  content: "";

  position: absolute;

  z-index: 1;

  width: 5px;

  height: 100%;

  left: 0;

  top: 0;

  background: var(--color-primary-2);

}



.tmp-contact-area.contact {

  background: rgba(149, 149, 149, 0.1);

}

.tmp-contact-area.contact .contact-form .top {

  background-color: #ffffff;

  padding: 30px 25px;

  border-radius: 6px;

  box-shadow: var(--shadow-1);

}

form .title {

  font-size: 30px;

  line-height: 1.2;

}
.contact-form-style-default.tmp-dynamic-form{
	background-color: #fff;
	padding: 10px 20px;
}
.wpforms-field-container h4{
	font-size: 35px !important;
    padding: 0 !important;
    margin: 0 !important;
}
.tmp-contact-area.contact .social-share-wrapper-1.style-footer .social-stylle-one li a {

  background: var(--primary-50);

}

.tmp-contact-area.contact .social-share-wrapper-1.style-footer .social-stylle-one li a:hover i {

  color: var(--color-white);

}

.tmp-contact-area.contact .social-share-wrapper-1.style-footer .social-stylle-one li a i {

  color: var(--color-primary);

}

.tmp-contact-area.contact .contact-box h2 {

  margin-bottom: 25px;

  color: #222;

}

.tmp-contact-area.contact label {

  display: block;

  margin: 20px 0 8px;

  font-weight: 500;

  color: #333;

}

.tmp-contact-area.contact label i {

  margin-right: 5px;

}

.tmp-contact-area.contact input[type=text],

.tmp-contact-area.contact input[type=email],

.tmp-contact-area.contact textarea {

  width: 100%;

  padding: 12px;

  border: 1px solid #ddd;

  border-radius: 6px;

  font-size: 14px;

  box-sizing: border-box;

  transition: border-color 0.3s ease;

}

.tmp-contact-area.contact input:focus,

.tmp-contact-area.contact textarea:focus {

  border-color: var(--color-primary);

  outline: none;

}

.tmp-contact-area.contact .help-section {

  margin: 25px 0 20px;

}

.tmp-contact-area.contact .help-section p {

  margin-bottom: 10px;

  font-weight: 400;

  color: #333;

}

.tmp-contact-area.contact .help-section label {

  display: inline-block;

  margin-right: 20px;

  font-weight: 400;

  color: var(--color-body);

  font-family: var(--font-secondary);

  position: relative;

  z-index: 1;

  padding-left: 22px;

}

.tmp-contact-area.contact button {

  width: 100%;

  max-width: 100%;

  border: none;

}

.tmp-contact-area.contact .right-content-area {

  background: var(--color-white);

  border-radius: 6px;

  padding: 30px 25px;

  box-shadow: var(--shadow-1);

}

.tmp-contact-area.contact .right-content-area .title-small-contact {

  font-size: 20px;

  line-height: 1.2;

}

.tmp-contact-area.contact .right-content-area .image-area {

  overflow: hidden;

  border-radius: 6px;

  margin-bottom: 30px;

}

.tmp-contact-area.contact .right-content-area .get-in-touch-area h3,

.tmp-contact-area.contact .right-content-area .get-in-touch-area h6 {

  font-size: 20px;

  line-height: 1.2;

}

.tmp-contact-area.contact .right-content-area .get-in-touch-area .title-follow {

  font-size: 20px;

  line-height: 1.2;

}



.tmp-error-area .section-inner .tmp-btn {

  margin: auto;

}

.tmp-error-area .image-area img {

  margin: auto;

}



.contact-map.contact-two iframe {

  height: 550px;

}



.tmp-coming-soon-area {

  padding: 95px 0;

  background: url(../images/contact/coming-soon-bg.webp);

  background-position: center;

  background-repeat: no-repeat;

  background-size: cover;

  position: relative;

  z-index: 1;

  overflow: hidden;

  background-attachment: fixed;

  margin: 15px 15px 0 15px;

  border-radius: 16px;

}

.tmp-coming-soon-area::after {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  height: 100%;

  width: 100%;

  background: var(--color-primary);

  mix-blend-mode: multiply;

  z-index: -1;

}

.tmp-coming-soon-area .section-inner {

  background: rgba(7, 7, 7, 0.1411764706);

  text-align: center;

  max-width: 716px;

  margin: auto;

  border-radius: 6px;

  padding: 90px 100px;

  margin-top: 120px;

  backdrop-filter: blur(20px);

}

.tmp-coming-soon-area .section-inner * {

  color: var(--color-white);

}

@media only screen and (max-width: 767px) {

  .tmp-coming-soon-area .section-inner {

    padding: 45px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-coming-soon-area .section-inner {

    padding: 30px;

  }

}

.tmp-coming-soon-area .section-inner .title {

  margin-bottom: 30px;

}

.tmp-coming-soon-area .section-inner .countdown .countDown {

  position: unset;

  transform: unset;

  justify-content: center;

  gap: 25px;

}

@media only screen and (max-width: 767px) {

  .tmp-coming-soon-area .section-inner .countdown .countDown {

    flex-wrap: wrap;

  }

}

.tmp-coming-soon-area .section-inner .countdown .countDown .container {

  background: none;

  display: flex;

  gap: 8px;

  padding: 0 !important;

  align-items: end;

}

.tmp-coming-soon-area .section-inner .countdown .countDown .container .a div {

  font-size: 34px;

  line-height: 1;

  font-weight: 600;

  font-family: var(--font-primary);

}

.tmp-coming-soon-area .section-inner .countdown .countDown .container::after {

  color: var(--color-body);

  font-size: 14px;

  right: 0;

  position: relative;

  bottom: 0;

  top: unset;

  line-height: 1;

  bottom: 3px;

}

.tmp-coming-soon-area .section-inner .countdown .countDown .container::after {

  color: var(--color-white) !important;

}

.tmp-coming-soon-area .section-inner .countdown .countDown .container:first-child::after {

  content: "Days";

}

.tmp-coming-soon-area .section-inner .countdown .countDown .container:nth-child(2)::after {

  content: "Hours";

}

.tmp-coming-soon-area .section-inner .countdown .countDown .container:nth-child(3)::after {

  content: "Minutes";

}

.tmp-coming-soon-area .section-inner .countdown .countDown .container:nth-child(4)::after {

  content: "Seconds";

}

.tmp-coming-soon-area .section-inner p.desc {

  margin-top: 30px;

}



.contact-form-style-default .double-input-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 20px;

}

@media only screen and (max-width: 576px) {

  .contact-form-style-default .double-input-wrapper {

    flex-wrap: wrap;

    gap: 0;

  }

}

.contact-form-style-default .double-input-wrapper .single-input {

  flex-basis: 50%;

}

@media only screen and (max-width: 576px) {

  .contact-form-style-default .double-input-wrapper .single-input {

    flex-basis: 100%;

  }

}

.contact-form-style-default label {

  font-weight: 500 !important;

  color: #333 !important;

}

.contact-form-style-default label i {

  color: var(--primary-700);

}

.contact-form-style-default input::placeholder {

  color: #c2c2c2 !important;

}

.contact-form-style-default textarea::placeholder {

  color: #c2c2c2 !important;

}



.login-registration-area-wrapper {

  padding: 60px;

  box-shadow: var(--shadow-1);

  background: var(--shadow-1);

  height: 100%;

}

@media only screen and (max-width: 576px) {

  .login-registration-area-wrapper {

    padding: 20px;

  }

}

.login-registration-area-wrapper .title {

  font-size: 30px;

  line-height: 1.3;

}

.login-registration-area-wrapper .single-input {

  margin-bottom: 30px;

}

.login-registration-area-wrapper .single-input:last-child {

  margin-bottom: 0;

}

.login-registration-area-wrapper input {

  height: 50px;

  border: 1px solid var(--color-border);

  border-radius: 4px;

}

.login-registration-area-wrapper input[type=checkbox] {

  max-width: max-content;

}

.login-registration-area-wrapper button {

  border: none;

}



.another-way-to-registration .registradion-top-text {

  display: flex;

  align-items: center;

  justify-content: center;

  margin-top: 30px;

  margin-bottom: 30px;

  position: relative;

}

.another-way-to-registration .registradion-top-text span {

  font-weight: 500;

}

.another-way-to-registration .registradion-top-text::before {

  position: absolute;

  content: "";

  right: 0%;

  width: 35%;

  height: 1px;

  background: #E7E7E7;

}

.another-way-to-registration .registradion-top-text::after {

  position: absolute;

  content: "";

  left: 0;

  width: 35%;

  height: 1px;

  background: #E7E7E7;

}

.another-way-to-registration .login-with-brand {

  display: flex;

  align-items: center;

  gap: 10px;

}

.another-way-to-registration .login-with-brand > a {

  flex-basis: 49%;

  display: flex;

  justify-content: center;

  align-items: center;

  height: 50px;

  border-radius: 6px;

  border: 1px solid var(--color-border);

  transition: 0.3s;

}

.another-way-to-registration .login-with-brand > a:hover {

  box-shadow: var(--shadow-1);

}

.another-way-to-registration p {

  margin: 0;

  display: flex;

  justify-content: center;

  margin-top: 30px;

  font-size: 16px;

}

.another-way-to-registration p a {

  color: #2C3C28;

  font-weight: 600;

  margin-left: 10px;

}



.contact-brand-wrapper {

  transform: translateY(-90px);

  border-radius: 6px 6px 0 0;

  display: block;

  overflow: hidden;

}

@media only screen and (max-width: 767px) {

  .contact-brand-wrapper {

    transform: translateY(-60px);

  }

}

.contact-brand-wrapper .thumbnail-contact-brand {

  display: block;

  border-radius: 6px 0 0 6px;

  position: relative;

  z-index: 3;

  overflow: hidden;

  height: 100%;

}

.contact-brand-wrapper .thumbnail-contact-brand::before {

  position: absolute;

  content: "";

  top: -35%;

  left: -35%;

  height: 450px;

  width: 450px;

  border-radius: 50%;

  mix-blend-mode: multiply;

  border: 85px solid var(--color-primary);

  z-index: 1;

}

.contact-brand-wrapper .thumbnail-contact-brand .content-area {

  position: absolute;

  left: 35px;

  bottom: 35px;

  max-width: calc(100% - 65px);

  padding: 20px 30px;

  border-radius: 8px;

  background: rgba(255, 255, 255, 0.1960784314);

  backdrop-filter: blur(10px);

  z-index: 2;

}

@media only screen and (max-width: 576px) {

  .contact-brand-wrapper .thumbnail-contact-brand .content-area {

    padding: 15px 20px;

  }

}

.contact-brand-wrapper .thumbnail-contact-brand .content-area .title {

  color: var(--color-white);

  font-size: 28px;

  margin-bottom: 0;

}

@media only screen and (max-width: 576px) {

  .contact-brand-wrapper .thumbnail-contact-brand .content-area .title {

    font-size: 20px;

    line-height: 1.3;

  }

}

.contact-brand-wrapper .thumbnail-contact-brand img {

  transition: 0.6s;

  height: 100%;

  object-fit: cover;

}

@media only screen and (max-width: 991px) {

  .contact-brand-wrapper .thumbnail-contact-brand img {

    width: 100%;

  }

}

.contact-brand-wrapper:hover .thumbnail-contact-brand img {

  transform: scale(1.02);

}



.contact-brand-right-content-form-area {

  background: #f5f5f5;

  height: 100%;

  padding: 65px 50px;

  border-radius: 0 6px 6px 0;

}

@media only screen and (max-width: 991px) {

  .contact-brand-right-content-form-area {

    border-radius: 0 0 6px 6px;

  }

}

@media only screen and (max-width: 767px) {

  .contact-brand-right-content-form-area {

    padding: 20px;

  }

}

.contact-brand-right-content-form-area .section-title-area-4 {

  margin-bottom: 40px;

}

.contact-brand-right-content-form-area .section-title-area-4 .sub-title {

  margin-bottom: 10px;

}

.contact-brand-right-content-form-area form input {

  height: 55px;

  width: 100%;

  border: 2px solid var(--color-border);

  margin-bottom: 25px;

  border-radius: 8px;

}

.contact-brand-right-content-form-area form textarea {

  border: 2px solid var(--color-border);

  margin-bottom: 30px;

  border-radius: 8px;

  height: 150px;

  padding: 10px 16px;

}

.contact-brand-right-content-form-area form textarea:focus {

  border: 2px solid var(--color-primary);

}

.contact-brand-right-content-form-area form button {

  border: none;

}



.contact-with-brand-area .marquee-brand-swiper-area .swiper-wrapper {

  padding: 0;

}

.contact-with-brand-area .invers-marqueeSwiper--slider {

  position: relative;

}

.contact-with-brand-area .invers-marqueeSwiper--slider::after {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  height: 100%;

  width: 220px;

  background: linear-gradient(90deg, rgb(31, 36, 46) 0%, rgba(31, 36, 46, 0.56), rgba(31, 36, 46, 0) 100%);

  z-index: 5;

  pointer-events: none;

}

.contact-with-brand-area .invers-marqueeSwiper--slider::before {

  content: "";

  position: absolute;

  right: 0;

  top: 0;

  height: 100%;

  width: 220px;

  background: linear-gradient(-90deg, rgb(31, 36, 46) 0%, rgba(31, 36, 46, 0.56), rgba(31, 36, 46, 0) 100%);

  z-index: 5;

  pointer-events: none;

}

.contact-with-brand-area .marquee-brand-swiper-area .brand-marque-item {

  padding: 0;

  height: auto;

  background: transparent;

  box-shadow: none;

  height: 80px;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 100px;

  padding: 20px;

  transition: 0.3s;

  filter: brightness(0) saturate(100%) invert(100%) sepia(9%) saturate(0%) hue-rotate(74deg) brightness(106%) contrast(110%);

}

.contact-with-brand-area .marquee-brand-swiper-area .brand-marque-item img {

  max-width: 100px;

}

.contact-with-brand-area .marquee-brand-swiper-area .brand-marque-item:hover {

  filter: brightness(0) saturate(100%) invert(38%) sepia(14%) saturate(2117%) hue-rotate(136deg) brightness(93%) contrast(90%);

}

.contact-with-brand-area .marquee-brand-swiper-area .brand-marque-item:hover img {

  animation: bounceIn 1.7s ease;

}



.map-contact {

  height: 100%;

}

@media only screen and (max-width: 991px) {

  .map-contact {

    height: 550px;

  }

}



.map-marker-container {

  position: absolute;

  margin-top: 10px;

  transform: translate3d(-50%, -100%, 0px);

}



.marker-container {

  position: relative;

  top: 25px;

  left: 10px;

  width: 46px;

  height: 46px;

  z-index: 1;

  cursor: pointer;

  perspective: 1000px;

  border-radius: 50%;

}



.marker-card .face {

  position: absolute;

  width: 26px;

  height: 26px;

  -webkit-backface-visibility: hidden;

  backface-visibility: hidden;

  text-align: center;

  color: #fff;

  z-index: 100;

  background: var(--color-primary);

  border: 2px solid #fff;

  border-radius: 50%;

  box-sizing: content-box;

  background-clip: content-box;

  line-height: 46px;

  font-size: 24px;

}



.marker-card .face::before,

.marker-card .face::after {

  position: absolute;

  content: "";

  top: 0;

  bottom: 0;

  right: 0;

  left: 0;

  border-radius: 9999px;

  -webkit-animation: ripple 2s infinite;

  animation: ripple 2s infinite;

}



@keyframes ripple {

  0% {

    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.5);

  }

  50% {

    box-shadow: 0 0 0 20px rgba(255, 255, 255, 0);

  }

  100% {

    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);

  }

}

.marker-card .face::before {

  content: "";

  position: absolute;

  -webkit-animation-delay: 0.6s;

  animation-delay: 0.6s;

}



.marker-card .face::after {

  content: "";

  position: absolute;

  -webkit-animation-delay: 0.2s;

  animation-delay: 0.2s;

}



#singleListingMap .marker-container {

  cursor: default;

}



#singleListingMap .marker-container {

  cursor: default;

}



.marker-card {

  width: 100%;

  height: 100%;

  transform-style: preserve-3d;

  position: absolute;

  z-index: 1;

}



.contact-map-item .inner-box {

  position: relative;

  background: #ffffff;

  width: fit-content;

  border-radius: 10px;

  overflow: hidden;

}

.contact-map-item .inner-box .image-box {

  display: block;

  overflow: hidden;

}

.contact-map-item .inner-box img {

  transition: 0.5s;

}

.contact-map-item .inner-box:hover img {

  transform: scale(1.1);

}



.contact-map-item .infoBox-close {

  position: absolute;

  right: 8px;

  top: 8px;

  width: 24px;

  height: 24px;

  line-height: 24px;

  font-size: 12px;

  border-radius: 50%;

  z-index: 9;

  text-align: center;

  cursor: pointer;

  transition: all 300ms ease;

  background: #ffffff;

}



.contact-map-item .content {

  padding: 20px;

}



.contact-map-item .content .title {

  margin-bottom: 6px;

  font-weight: 600;

  font-size: 16px;

  line-height: 21.86px;

  color: #1c1c1e;

  font-family: "Manrope", sans-serif;

}



.contact-map-item .content .list-info li {

  display: flex;

  align-items: center;

  gap: 8px;

  font-size: 14px;

  line-height: 19.6px;

  color: #5c6368;

  font-family: "Manrope", sans-serif;

}



.contact-map-item .content .list-info li .icon {

  font-size: 16px;

  color: #a3abb0;

}



.contact-map-item .content .list-info li:not(:last-child) {

  margin-bottom: 6px;

}



.top-map {

  height: 800px;

}

@media only screen and (max-width: 991px) {

  .top-map {

    height: 400px;

  }

}



#map .infoBox {

  margin-left: 160px;

  margin-bottom: -140px;

}



.map-listing-item {

  position: relative;

}

.map-listing-item .content .location {

  display: none !important;

}

.map-listing-item .inner-box {

  position: relative;

  border-radius: 16px;

  background: #ffffff;

  width: fit-content;

  box-shadow: 0px 10px 25px 0px rgba(54, 95, 104, 0.1019607843);

  display: flex;

  align-items: center;

  padding: 16px;

  padding-right: 40px;

  gap: 16px;

  min-width: 560px;

  gap: 30px;

  padding-right: 16px;

}

.map-listing-item .infoBox-close {

  position: absolute;

  right: 8px;

  top: 8px;

  width: 24px;

  height: 24px;

  line-height: 24px;

  font-size: 12px;

  border-radius: 50px;

  z-index: 9;

  text-align: center;

  cursor: pointer;

  transition: all 300ms ease;

  background: #ffffff;

  box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.06);

}

.map-listing-item .inner-box .image-box {

  width: 200px;

  height: 200px;

}

.map-listing-item .inner-box .image-box img {

  display: block;

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: all 500ms ease;

}

.map-listing-item .content {

  position: relative;

  flex-grow: 1;

}

.map-listing-item .content .title {

  margin-bottom: 20px !important;

}

.map-listing-item .content .location {

  color: #5c6368;

  font-size: 14px;

  line-height: 19.6px;

  display: flex;

  align-items: center;

  gap: 4px;

  font-family: "Manrope", sans-serif;

}

.map-listing-item .content .location .icon {

  font-size: 16px;

  color: #a3abb0;

}

.map-listing-item .content .location .text {

  -webkit-line-clamp: 1;

  -webkit-box-orient: vertical;

  display: -webkit-box;

  overflow: hidden;

}

.map-listing-item .content .title {

  font-size: 18px;

  line-height: 25.2px;

  text-transform: capitalize;

  margin-top: 4px;

  font-weight: 600;

  margin-top: 8px;

  font-family: "Manrope", sans-serif;

}

.map-listing-item .content .list-info {

  margin-top: 8px;

  display: flex;

  gap: 6px;

  flex-direction: column;

  align-items: flex-start;

}

.map-listing-item .content .list-info li {

  display: flex;

  align-items: center;

  gap: 4px;

  font-size: 14px;

  line-height: 19.6px;

  font-family: "Manrope", sans-serif;

}

.map-listing-item .content .list-info li .icon {

  font-size: 16px;

  color: #a3abb0;

}

.map-listing-item .content .list-info li .text-variant-1 {

  color: #5c6368;

}

.map-listing-item .inner-box .box-bottom {

  display: flex;

  justify-content: space-between;

  align-items: center;

  margin-top: 16px;

  padding-top: 16px;

  border-top: 1px solid #e4e4e4;

}

.map-listing-item .inner-box .box-bottom .box-bottom .avt-box {

  display: flex;

  align-items: center;

  gap: 8px;

  font-size: 14px;

  line-height: 19.6px;

  font-family: "Manrope", sans-serif;

}

.map-listing-item .inner-box .box-bottom .avt-box img {

  width: 34px;

  height: 34px;

  border-radius: 50%;

}

.map-listing-item .inner-box .box-bottom .price {

  font-size: 18px;

  line-height: 25.2px;

  font-weight: 600;

}



.tmp-counter-area {

  max-width: 1620px;

  margin: auto;

}

.tmp-counter-area .counter-inner {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 40px 114px;

  background: var(--color-white);

  box-shadow: 0px 9px 10.8px rgba(187, 173, 173, 0.07);

  border-radius: 6px;

  margin-top: -100px;

  position: relative;

  z-index: 1;

}

.tmp-counter-area .counter-inner .content {

  padding: 25px 30px;

  position: relative;

  z-index: 1;

}

.tmp-counter-area .counter-inner .content:hover::after {

  border-left: 2px solid var(--color-primary);

}

.tmp-counter-area .counter-inner .content::after {

  content: "";

  position: absolute;

  width: 117px;

  height: 100%;

  top: 0;

  left: 0;

  background: #FAFAFA;

  border-left: 2px solid #E4E4E4;

  z-index: -1;

  transition: var(--transition);

}

@media only screen and (max-width: 991px) {

  .tmp-counter-area .counter-inner .content::after {

    width: 100%;

  }

}

.tmp-counter-area .counter-inner .content .title {

  font-size: 70px;

  font-weight: 700;

  margin-bottom: -5px;

  display: flex;

  align-items: center;

  color: var(--color-primary);

}

@media only screen and (max-width: 1199px) {

  .tmp-counter-area .counter-inner .content .title {

    font-size: 50px;

  }

}

@media only screen and (max-width: 991px) {

  .tmp-counter-area .counter-inner .content .title {

    font-size: 60px;

  }

}

.tmp-counter-area .counter-inner .content p {

  font-weight: 500;

}

.tmp-counter-area.area-2 {

  max-width: 1684px;

  position: relative;

  z-index: 1;

}

.tmp-counter-area.area-2 .counter-inner {

  position: absolute;

  bottom: 0;

  left: 50%;

  transform: translateX(-50%);

  max-width: 1420px;

  width: 100%;

  padding: 0 50px;

  background: none;

  gap: 30px;

}

.tmp-counter-area.area-2 .counter-inner::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 179px;

  background: var(--color-white);

  border-radius: 8px 8px 0 0;

  bottom: -15px;

  left: 0;

}

.tmp-counter-area.area-2 .counter-inner .content {

  box-shadow: 0px 4px 21px rgba(0, 0, 0, 0.1);

  border-radius: 6px;

  flex-basis: 25%;

  text-align: center;

  padding: 37px 72px 52px 54px;

  position: relative;

  z-index: 10;

  background: var(--color-white);

  overflow: hidden;

}

.tmp-counter-area.area-2 .counter-inner .content::after {

  content: "";

  position: absolute;

  width: 150px;

  height: 150px;

  right: -150px;

  top: -150px;

  left: auto;

  background: var(--color-primary);

  z-index: 0;

  border-radius: 50%;

  border: none;

}

@media only screen and (max-width: 479px) {

  .tmp-counter-area.area-2 .counter-inner .content {

    flex-basis: 100% !important;

  }

}

.tmp-counter-area.area-2 .counter-inner .content:hover .icon img {

  animation: bounceIn 0.8s ease;

}

.tmp-counter-area.area-2 .counter-inner .content:hover::after {

  right: -75px;

  top: -75px;

}

.tmp-counter-area.area-2 .counter-inner .content .icon {

  margin-bottom: 5px;

  height: 82px;

}

.tmp-counter-area.area-2 .counter-inner .content .icon img {

  max-width: 65px;

}

.tmp-counter-area.area-2 .counter-inner .content .title {

  font-family: var(--font-secondary);

  font-size: 45px;

  justify-content: center;

  margin-bottom: 15px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-counter-area.area-2 .counter-inner .content .title {

    font-size: 38px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-counter-area.area-2 .counter-inner .content .title {

    font-size: 34px;

  }

}

.tmp-counter-area.area-2 .counter-inner .content .title span {

  font-family: var(--font-primary);

}

.tmp-counter-area.area-2 .counter-inner .content p {

  font-size: 20px;

  line-height: 24px;

  color: var(--color-heading-1);

  font-weight: 600;

  font-family: var(--font-primary);

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-counter-area.area-2 .counter-inner .content p {

    font-size: 16px;

  }

}

.tmp-counter-area.area-2 .counter-inner .content.green {

  background-size: cover;

  background-position: center;

  background-repeat: no-repeat;

  box-shadow: 0px 4px 21px rgba(0, 0, 0, 0.1);

}

.tmp-counter-area.area-2 .counter-inner .content.green .title {

  -webkit-text-stroke: 1px var(--color-primary-2);

}

.tmp-counter-area.area-2 .counter-inner .content.green:hover .icon img {

  animation: bounceIn 0.8s ease;

}

.tmp-counter-area.area-3 {

  padding-bottom: 120px;

}

@media only screen and (max-width: 991px) {

  .tmp-counter-area.area-3 {

    padding-bottom: 60px;

  }

}

.tmp-counter-area.area-3 .counter-inner {

  background: #F9F9F9;

  border-bottom: 3px solid var(--color-primary-2);

}

.tmp-counter-area.area-3 .counter-inner .content::after {

  background: var(--color-white);

  border: none;

}

.tmp-counter-area.inner {

  max-width: 100%;

  margin: 0 40px;

  background: var(--primary-50);

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-counter-area.inner {

    margin: 0 10px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-counter-area.inner {

    margin: 0 5px;

  }

}

.tmp-counter-area.inner .counter-inner {

  margin-top: 0;

  background: none;

  padding: 40px 0;

}

.tmp-counter-area.inner .counter-inner .content::after {

  border: none !important;

  background: var(--color-white);

}

.tmp-counter-area.inner .counter-inner .content .title {

  margin-bottom: 5px;

}

.tmp-counter-area.inner .counter-inner .content p {

  font-family: var(--font-primary);

  font-size: 20px;

  line-height: 1;

  color: var(--color-heading-1);

  font-weight: 600;

}

.tmp-counter-area.inner-2 p.desc {

  max-width: 961px;

  text-align: center;

  margin: auto;

  margin-bottom: 60px;

}



.countdown .countDown {

  display: flex;

  align-items: center;

  gap: 15px;

  position: absolute;

  bottom: 20px;

  left: 50%;

  transform: translateX(-50%);

  z-index: 10;

}

.countdown .countDown .container {

  position: relative;

  width: auto;

  color: var(--color-white);

  background: var(--color-primary);

  padding: 8px 25px 8px 10px !important;

  margin: 0;

  border-radius: 3px;

}

.countdown .countDown .container .a {

  font-weight: 500;

  color: var(--color-white);

}

.countdown .countDown .container .a div {

  height: unset;

  line-height: 1;

  font-size: 16px;

}

.countdown .countDown .container:first-child::after {

  content: "D";

}

.countdown .countDown .container:nth-child(2)::after {

  content: "H";

}

.countdown .countDown .container:nth-child(3)::after {

  content: "M";

}

.countdown .countDown .container:nth-child(4)::after {

  content: "S";

}

.countdown .countDown .container::after {

  position: absolute;

  color: var(--color-white);

  right: 10px;

  top: 0;

  bottom: 0;

  display: flex;

  align-items: center;

  justify-content: center;

  line-height: normal;

}



.ui-state-default {

  text-decoration: none !important;

}



.calendar {

  padding: 8px;

  background: #ffffff;

  border-radius: 4px;

  font-size: 18px;

  border: 1px solid #333333;

  box-shadow: 0px 20px 40px rgba(59, 60, 56, 0.05);

}



.ui-datepicker {

  background: #ffffff;

  border-radius: 0;

  box-shadow: 0px 6px 41px -13px rgba(191, 138, 0, 0.75);

  -webkit-box-shadow: 0px 6px 41px -13px rgba(191, 138, 0, 0.75);

  -moz-box-shadow: 0px 6px 41px -13px rgba(191, 138, 0, 0.75);

}



.ui-datepicker-header {

  height: 50px;

  line-height: 50px;

  color: #ffffff;

  background: var(--color-primary);

  margin-bottom: 10px;

}



.ui-datepicker-prev,

.ui-datepicker-next {

  width: 20px;

  height: 20px;

  text-indent: 9999px;

  border-radius: 100%;

  cursor: pointer;

  overflow: hidden;

  margin-top: 12px;

}



.ui-datepicker-prev {

  float: left;

  margin-left: 12px;

}



.ui-datepicker-prev:after {

  transform: rotate(45deg);

  margin: -43px 0px 0px 8px;

}



.ui-datepicker-next {

  float: right;

  margin-right: 12px;

}



.ui-datepicker-next:after {

  transform: rotate(-135deg);

  margin: -43px 0px 0px 6px;

}



.ui-datepicker-prev:after,

.ui-datepicker-next:after {

  content: "";

  position: absolute;

  display: block;

  width: 8px;

  height: 8px;

  border-left: 2px solid #ffffff;

  border-bottom: 2px solid #ffffff;

}



.ui-datepicker-prev:hover,

.ui-datepicker-next:hover,

.ui-datepicker-prev:hover:after,

.ui-datepicker-next:hover:after {

  border-color: #333333;

}



.ui-datepicker-title {

  text-align: center;

  font-size: 20px;

}



.ui-datepicker-calendar {

  width: 100%;

  text-align: center;

}



.ui-datepicker-calendar thead tr th span {

  display: block;

  width: 40px;

  color: var(--color-primary);

  margin-bottom: 5px;

  font-size: 15px;

}



.ui-state-default {

  display: block;

  text-decoration: none;

  color: #333333;

  line-height: 40px;

  font-size: 16px;

  line-height: 27px;

  padding: 0 5px;

}



.ui-state-default:hover {

  color: #ffffff;

  background: var(--color-primary);

  border-radius: 0;

  transition: all 0.25s cubic-bezier(0.7, -0.12, 0.2, 1.12);

  text-decoration: none;

}



.ui-state-highlight {

  color: #ffffff;

  background-color: var(--color-primary);

  border-radius: 0;

}



.ui-state-active {

  color: #ffffff;

  background-color: var(--color-primary);

  border-radius: 0;

}



.ui-datepicker-unselectable .ui-state-default {

  color: #eee;

  border: 2px solid transparent;

}



.icon-2 {

  margin-left: -30px;

  margin-top: -26px;

  position: relative;

  color: var(--color-primary);

  font-size: 20px;

}



.tmp-elevate-pagination ul {

  padding: 0;

  margin: 0;

  display: flex;

  align-items: center;

  list-style: none;

}

.tmp-elevate-pagination ul li {

  margin: 0;

  margin-right: 10px;

}

.tmp-elevate-pagination ul li button {

  width: 50px;

  height: 50px;

  background: transparent;

  font-weight: 600;

  font-size: 16px;

  line-height: 24px;

  color: #000;

  border: 1px solid #E9E9E9;

  transition: 0.3s;

}

.tmp-elevate-pagination ul li button.active {

  background: var(--color-primary);

  color: #fff;

}

.tmp-elevate-pagination ul li button:hover {

  background: var(--color-primary);

  color: #fff;

}



.pagination-controler {

  position: relative;

}

.pagination-controler .swiper-pagination {

  position: absolute;

  left: 50%;

  transform: translateX(-50%);

  gap: 4px;

  display: flex;

  justify-content: center;

  align-items: center;

}

.pagination-controler .swiper-pagination.dot-transparent {

  bottom: 50px;

}

@media only screen and (max-width: 767px) {

  .pagination-controler .swiper-pagination.dot-transparent {

    bottom: 30px;

  }

}

.pagination-controler .swiper-pagination.dot-color-white .swiper-pagination-bullet {

  background: var(--color-white);

}

@media only screen and (max-width: 991px) {

  .pagination-controler .swiper-pagination {

    bottom: 30px;

  }

}

@media only screen and (max-width: 479px) {

  .pagination-controler .swiper-pagination {

    bottom: 20px;

  }

}

.pagination-controler .swiper-pagination .swiper-pagination-bullet {

  background: var(--color-heading-1);

  opacity: 0.4;

  position: relative;

  z-index: 1;

  width: 6px;

  height: 6px;

}

.pagination-controler .swiper-pagination .swiper-pagination-bullet::after {

  content: "";

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  width: 6px;

  height: 6px;

  background: transparent;

  border: 1px solid var(--color-primary);

  border-radius: 50%;

  opacity: 0;

  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);

}

.pagination-controler .swiper-pagination .swiper-pagination-bullet-active {

  opacity: 1;

  background: transparent !important;

}

.pagination-controler .swiper-pagination .swiper-pagination-bullet-active::after {

  opacity: 1;

  transform: translate(-50%, -50%) scale(2);

}



@media only screen and (max-width: 991px) {

  .company-histry-video-area .rounded-player-2 {

    display: none;

  }

}



.product-wrapper {

  position: relative;

  z-index: 1;

  background: #FFFFFF;

  border: 1px solid #efefef;

  border-radius: 15px;

  overflow: hidden;

  transition: var(--transition);

}

.product-wrapper:hover {

  box-shadow: 0 13px 48px 0 rgba(215, 216, 222, 0.44);

  border: 1px solid transparent;

}

.product-wrapper:hover .image-area .popup-area {

  transform: translate(-56%, -78%);

  opacity: 1;

}

.product-wrapper:hover .image-area img {

  transform: scale3d(1.05, 1.05, 1.05) translateZ(0);

}

.product-wrapper:hover .image-area img.hover-img {

  opacity: 1;

  visibility: visible;

}

.product-wrapper.in-wishlist .content {

  padding: 20px;

}

.product-wrapper .image-area {

  min-height: 308px;

  line-height: 308px;

  background: var(--color-white);

  position: relative;

  z-index: 1;

  text-align: center;

  display: block;

  overflow: hidden;

}

.product-wrapper .image-area img.default-img {

  transition: all 1.5s cubic-bezier(0, 0, 0.05, 1);

}

.product-wrapper .image-area img.hover-img {

  position: absolute;

  left: 0;

  top: 0;

  z-index: 2;

  opacity: 0;

  visibility: hidden;

  transition: 0.25s opacity, 0.25s visibility, transform 1.5s cubic-bezier(0, 0, 0.2, 1);

}

.product-wrapper .image-area .tag {

  padding: 4px 8px;

  font-size: 12px;

  color: var(--color-white);

  background: var(--color-success);

  line-height: 1;

  position: absolute;

  top: 16px;

  left: 16px;

  font-weight: 500;

  border-radius: 3px;

  z-index: 10;

}

.product-wrapper .image-area .tag.hot {

  color: #fff;

  background: #E53E3E;

}

.product-wrapper .image-area .tag.discount {

  color: #fff;

  background: #ff75a0;

}

.product-wrapper .image-area .popup-area {

  display: flex;

  align-items: center;

  gap: 15px;

  justify-content: center;

  position: absolute;

  top: 58%;

  left: 50%;

  transform: translate(-56%, -50%);

  opacity: 0;

  transition: var(--transition);

  z-index: 10;

}

.product-wrapper .image-area .popup-area a {

  height: auto;

  line-height: 1;

  height: 45px;

  width: 45px;

  display: flex;

  align-items: center;

  justify-content: center;

  background: #fff;

  border-radius: 50%;

}

.product-wrapper .image-area .popup-area a i {

  color: var(--color-body);

}

.product-wrapper .content {

  padding: 30px 30px 25px;

}

.product-wrapper .content .title {

  margin-bottom: 16px;

  font-size: 16px;

  line-height: 1.2;

}

.product-wrapper .content .title a {

  transition: var(--transition);

}

.product-wrapper .content .title a:hover {

  color: var(--color-primary-2);

}

.product-wrapper .content .price {

  font-size: 20px;

  font-weight: 700;

  color: var(--color-primary);

  font-family: var(--font-secondary);

  display: flex;

  align-items: center;

  gap: 6px;

  line-height: 1;

  margin-bottom: 10px;

}

.product-wrapper .content .price span {

  color: #A9A9A9;

  font-size: 14px;

  font-weight: 500;

  text-decoration: line-through;

}

.product-wrapper .content .star-rating {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-bottom: 22px;

}

.product-wrapper .content .star-rating ul {

  display: flex;

  align-items: center;

  gap: 3px;

}

.product-wrapper .content .star-rating ul li {

  color: #FFC107;

  font-size: 14px;

}

.product-wrapper .content .star-rating ul li span {

  color: #E4E4E4;

}

.product-wrapper .content .star-rating ul li span.number {

  color: var(--color-heading-1);

  margin-left: 3px;

  font-weight: 400;

}

.product-wrapper .content .star-rating p {

  font-weight: 500;

}

.product-wrapper .content .button-area .cart-btn {

  max-width: 100%;

  width: 100%;

  color: var(--color-primary-2);

  display: flex;

  align-items: center;

  gap: 5px;

  justify-content: center;

  font-weight: 600;

  font-family: var(--font-primary);

}

.product-wrapper .content .button-area .cart-btn i {

  padding-left: 6px;

  display: inline-block;

  top: -1px;

  position: relative;

  font-size: 13px;

  font-weight: 500;

}

.product-wrapper .content .button-area .cart-btn::after {

  background: var(--color-primary-2);

}

.product-wrapper .content .button-area .cart-btn:hover {

  color: var(--color-white);

}



.product-wrapper-mini {

  position: relative;

  z-index: 1;

  border-radius: 4px;

  overflow: hidden;

  transition: var(--transition);

}

.product-wrapper-mini .image-area img {

  width: 100%;

}

.product-wrapper-mini:hover .text {

  bottom: 20px;

}

.product-wrapper-mini:hover .text .shop-btn {

  opacity: 1;

}

.product-wrapper-mini:hover::before {

  opacity: 1;

}

.product-wrapper-mini:hover::after {

  opacity: 0;

}

.product-wrapper-mini::before {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  z-index: 1;

  top: 0;

  left: 0;

  background: linear-gradient(180deg, rgba(135, 171, 66, 0) 30.75%, var(--color-primary) 100%);

  opacity: 0;

  transition: var(--transition);

}

.product-wrapper-mini::after {

  content: "";

  position: absolute;

  width: 100%;

  height: 100%;

  z-index: 1;

  background: linear-gradient(180deg, rgba(31, 31, 37, 0) 42.5%, var(--color-primary) 100%);

  top: 0;

  left: 0;

  opacity: 1;

  transition: var(--transition);

}

.product-wrapper-mini .text {

  position: absolute;

  bottom: 0;

  left: 50%;

  transform: translateX(-50%);

  z-index: 2;

  max-width: max-content;

  width: 100%;

  text-align: center;

  transition: var(--transition);

}

.product-wrapper-mini .text h3 {

  font-size: 22px;

  line-height: 1;

  font-weight: 600;

  color: var(--color-white);

  margin-bottom: 10px;

}

.product-wrapper-mini .text h3 a {

  color: var(--color-white);

}

.product-wrapper-mini .text .shop-btn {

  color: var(--color-white);

  display: flex;

  align-items: center;

  line-height: 1;

  gap: 5px;

  justify-content: center;

  opacity: 0;

  transition: var(--transition);

}



.tmp-product-area-2 .slider-inner {

  padding-bottom: 20px;

}

.tmp-product-area-2 .slider-inner .product-pagination {

  width: 100%;

  height: 4px;

  background: #EFEFEF;

  bottom: 0;

  top: unset;

}

.tmp-product-area-2 .slider-inner .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {

  background: var(--color-primary-2);

  bottom: 0;

  top: unset;

}



.shop .right-content-area {

  margin-left: 50px !important;

}

.shop .right-content-area .shop-filter-area {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.shop .right-content-area p {

  color: var(--color-body-2);

  margin-bottom: 0;

}

.shop .right-content-area .invers-modern-select .select {

  width: 300px;

  font-size: 16px;

  color: var(--color-body-2);

  border-radius: 30px;

  cursor: pointer;

}

.shop .popular-product .product-area {

  display: flex;

  flex-direction: column;

  gap: 15px;

}

.shop .popular-product .product-area .small-product-wrapper {

  display: flex;

  gap: 15px;

  align-items: center;

}

.shop .popular-product .product-area .small-product-wrapper .content {

  flex-direction: column;

  align-items: flex-start;

  gap: 3px;

}

.shop .popular-product .product-area .small-product-wrapper .content h6,

.shop .popular-product .product-area .small-product-wrapper .content .title {

  font-size: 20px;

  line-height: 1.2;

  margin-bottom: 0;

}

.shop .popular-product .product-area .small-product-wrapper .content h6 a,

.shop .popular-product .product-area .small-product-wrapper .content .title a {

  color: var(--color-heading-1);

}

.shop .popular-product .product-area .small-product-wrapper .content h6 a:hover,

.shop .popular-product .product-area .small-product-wrapper .content .title a:hover {

  color: var(--color-primary);

}



.slider-wrap {

  position: relative;

  height: 12px;

  margin-bottom: 20px;

}



.slider-wrap input[type=range] {

  -webkit-appearance: none;

  position: absolute;

  width: 100%;

  height: 8px;

  background: var(--primary-50);

  pointer-events: none;

  padding: 0;

  border: none;

}



.slider-wrap input[type=range]::-webkit-slider-thumb {

  -webkit-appearance: none;

  width: 18px;

  height: 18px;

  border-radius: 50%;

  background: var(--color-white);

  border: 2px solid var(--color-primary);

  cursor: pointer;

  pointer-events: all;

  position: relative;

  z-index: 2;

}



.slider-track {

  position: absolute;

  height: 4px;

  background: var(--color-primary);

  border-radius: 5px;

  top: 50%;

  transform: translateY(-50%);

  z-index: 1;

  top: 4px;

}



.bottom-row {

  display: flex;

  justify-content: space-between;

  align-items: center;

}



.filter-btn {

  padding: 4px 20px;

  background: var(--color-primary);

  color: var(--color-white);

  font-size: 16px;

  border-radius: 30px;

  cursor: pointer;

  transition: 0.3s ease;

  max-width: max-content;

}



.filter-btn:hover {

  background: var(--color-primary);

  color: white;

}



.price-label {

  font-size: 16px;

  color: var(--color-primary);

  font-weight: 600;

}



.ms-single-product__content {

  margin-left: 50px;

}

.ms-single-product__content.in-modal {

  margin-left: 0;

}

.ms-single-product__content.in-modal .ms-single-product_title {

  font-size: 34px;

}

.ms-single-product__content.in-modal .product_meta {

  margin-top: 20px;

  margin-bottom: 40px;

}

.ms-single-product__content .sub-title {

  display: flex;

  align-items: center;

  gap: 8px;

  font-size: 20px;

  line-height: 1;

  font-family: var(--font-primary);

  margin-bottom: 25px;

}

.ms-single-product__content .sub-title a {

  position: relative;

  z-index: 1;

  padding-right: 14px;

}

.ms-single-product__content .sub-title a::after {

  content: "";

  position: absolute;

  width: 6px;

  height: 6px;

  border-radius: 50%;

  background: #405FF2;

  top: 50%;

  right: 0;

  transform: translateY(-50%);

}

.ms-single-product__content .ms-woocommerce-product-rating {

  display: flex;

  align-items: center;

  gap: 15px;

  margin-bottom: 10px;

}

.ms-single-product__content .ms-woocommerce-product-rating ul {

  display: flex;

  align-items: center;

  gap: 8px;

}

.ms-single-product__content .ms-woocommerce-product-rating ul li {

  color: #FFC107;

  line-height: 1;

}

.ms-single-product__content .ms-woocommerce-product-rating .woocommerce-review-link {

  font-size: 14px;

  font-family: var(--font-primary);

  color: var(--color-body);

  font-weight: 600;

}

.ms-single-product__content .ms-single-product_title {

  color: var(--color-heading-1);

  font-size: 38px;

  margin-bottom: 0;

}

@media only screen and (max-width: 576px) {

  .ms-single-product__content .ms-single-product_title {

    font-size: 32px;

  }

}

.ms-single-product__content .woocommerce-Price-amount {

  margin: 15px 0;

}

.ms-single-product__content .woocommerce-Price-amount bdi {

  color: var(--color-primary);

  font-size: 24px;

  line-height: 44px;

  font-weight: 700;

  font-family: var(--font-primary);

}

.ms-single-product__content .woocommerce-Price-amount bdi span.off {

  text-decoration: line-through;

  opacity: 0.4;

  margin-left: 7px;

  font-size: 20px;

  color: var(--color-body);

}

.ms-single-product__content .quantity-area {

  display: flex;

  align-items: center;

  gap: 20px;

  margin-top: 28px;

}

@media only screen and (max-width: 767px) {

  .ms-single-product__content .quantity-area {

    gap: 15px;

  }

}

.ms-single-product__content .quantity-area .cart-edit {

  margin-right: 0;

}

.ms-single-product__content .quantity-area .quantity-edit {

  max-width: 120px;

  display: flex;

  align-items: center;

  border-radius: 0;

  padding: 0;

  border: 2px solid var(--color-border);

  border-radius: 4px;

}

.ms-single-product__content .quantity-area .quantity-edit .button-area {

  display: flex;

  height: 43px;

  align-items: center;

}

.ms-single-product__content .quantity-area .quantity-edit button {

  padding: 0;

  border: none;

  border-right: 2px solid var(--color-border);

  border-radius: 0;

  min-width: 30px;

  height: 100%;

  color: var(--color-heading-1);

}

.ms-single-product__content .quantity-area .quantity-edit button i {

  color: var(--color-heading-1);

}

.ms-single-product__content .quantity-area .quantity-edit button:nth-child(2) {

  border: none;

}

.ms-single-product__content .quantity-area .quantity-edit button.plus {

  border-right: none;

  border-left: 2px solid var(--color-border);

}

.ms-single-product__content .quantity-area .quantity-edit input {

  border: none;

  padding: 0;

  max-width: max-content;

  text-align: center;

  line-height: 1;

  color: var(--color-heading-1);

  font-weight: 600;

}

.ms-single-product__content .quantity-area .wishlist-btn {

  border: 2px solid var(--color-border);

  text-align: center;

  display: block;

  padding: 14px 15px;

  color: var(--color-heading-1);

  height: auto;

  height: 45px;

  display: flex;

  align-items: center;

  justify-content: center;

}

.ms-single-product__content .quantity-area .wishlist-btn:hover i {

  color: #fff;

}

.ms-single-product__content .product_meta {

  margin-top: 40px;

}

.ms-single-product__content .product_meta ul {

  display: flex;

  flex-direction: column;

  gap: 20px;

  max-width: max-content;

  width: 100%;

}

.ms-single-product__content .product_meta ul li {

  font-size: 16px;

  line-height: 1;

  font-family: var(--font-secondary);

  color: var(--color-heading-1);

  font-weight: 600;

  display: flex;

  align-items: center;

  gap: 5px;

}

.ms-single-product__content .product_meta ul li span {

  font-weight: 400;

  color: var(--color-body);

  font-size: 16px;

  margin-left: 5px;

}



.tmp-shop-single-area .tab-area {

  padding: 25px 30px;

  border-radius: 8px;

  background: #fff;

  box-shadow: var(--shadow-1);

}

.tmp-shop-single-area .tab-content > .tab-pane {

  display: none !important;

  position: unset;

  visibility: hidden;

}

.tmp-shop-single-area .tab-content > .tab-pane.active {

  display: block !important;

  visibility: visible;

}

.tmp-shop-single-area .tab-content > .tab-pane .ms-section-title h3 {

  font-size: 24px;

  line-height: 1;

  margin-bottom: 35px;

}

.tmp-shop-single-area .tab-content > .tab-pane .ms-section-title ul {

  display: flex;

  flex-direction: column;

  gap: 15px;

}

.tmp-shop-single-area .tab-content > .tab-pane .ms-section-title ul li {

  display: flex;

  align-items: center;

  gap: 12px;

  font-size: 16px;

}

.tmp-shop-single-area .tab-content > .tab-pane .ms-section-title ul li i {

  color: var(--color-primary-2);

  font-size: 20px;

  opacity: 0.5;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews {

  display: flex;

  gap: 30px;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw {

  width: 50%;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw h2 {

  font-size: 24px;

  margin-bottom: 40px;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-form {

  width: 50%;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-form h2 {

  font-size: 24px;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-box {

  position: relative;

  z-index: 1;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-box .author {

  display: flex;

  align-items: center;

  gap: 20px;

  margin-bottom: 20px;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-box .author .content h6,

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-box .author .content .title {

  margin-bottom: 10px;

  font-size: 18px;

  line-height: 1;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-box .author .content p {

  margin-bottom: 0;

  font-size: 14px;

  line-height: 1;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-box p {

  margin-bottom: 15px;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-box ul {

  display: flex;

  align-items: center;

  gap: 6px;

  position: absolute;

  top: 0;

  right: 0;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-box ul li {

  color: var(--color-primary-2);

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-form {

  background: var(--color-gray);

  border-radius: 10px;

  padding: 30px;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-form form {

  padding: 0;

  display: flex;

  flex-direction: column;

  gap: 20px;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-form form .single-wrapper {

  display: flex;

  align-items: center;

  gap: 20px;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-form form .single-wrapper input {

  border: 2px solid rgba(85, 85, 85, 0.15);

  border-radius: 4px;

  background: var(--color-white);

  padding: 9px 10px;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-form form .single-wrapper input:focus {

  border-color: var(--color-primary);

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-form form textarea {

  border: 2px solid rgba(85, 85, 85, 0.15);

  border-radius: 4px;

  background: var(--color-white);

  padding: 9px 10px;

  min-height: 100px;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-form form textarea:focus {

  border-color: var(--color-primary);

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-form form .rating {

  display: flex;

  align-items: center;

  gap: 10px;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-form form .rating h5,

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-form form .rating .rating-title {

  font-size: 18px;

  line-height: 1;

  font-family: var(--font-secondary);

  margin: 3px 0;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-form form .rating ul {

  display: flex;

  align-items: center;

  gap: 6px;

}

.tmp-shop-single-area .tab-content > .tab-pane .woocommerce-Reviews .reveiw-form form .rating ul li {

  color: var(--color-primary-2);

}

.tmp-shop-single-area .tab-content .tab-pane:first-child {

  font-size: 18px;

  line-height: 28px;

}

.tmp-shop-single-area .tab-content .tab-pane.description p {

  margin-bottom: 20px;

  max-width: 950px;

}

.tmp-shop-single-area .tab-content .tab-pane.description ul {

  display: flex;

  align-items: center;

  max-width: 511px;

  flex-wrap: wrap;

  justify-content: space-between;

  margin-bottom: 20px;

}

.tmp-shop-single-area .tab-content .tab-pane.description ul li {

  position: relative;

  z-index: 1;

  padding-left: 25px;

}

.tmp-shop-single-area .tab-content .tab-pane.description ul li::before {

  content: "";

  position: absolute;

  width: 10px;

  height: 10px;

  border-radius: 50%;

  background-color: var(--color-primary-2);

  top: 50%;

  left: 0;

  transform: translateY(-50%);

  z-index: -1;

}

.tmp-shop-single-area .tab-content .tab-pane .tmp-btn {

  border: none;

  border-radius: 33px !important;

}

.tmp-shop-single-area .nav-tabs {

  justify-content: center;

  gap: 17px;

  margin-bottom: 50px;

  border: none;

}

.tmp-shop-single-area .nav-tabs .nav-link {

  border-radius: 33px;

  color: var(--color-heading-1);

  font-family: var(--font-primary);

  font-size: 16px;

  line-height: 1;

  font-weight: 600;

  padding: 13px 20px;

  border: 2px solid var(--color-border);

  background: transparent;

}

.tmp-shop-single-area .nav-tabs .nav-link.active {

  color: var(--color-white);

  border: 2px solid var(--color-primary-2);

  background: var(--color-primary-2);

}



.shop-slider-area2 {

  position: relative;

  z-index: 1;

  padding-bottom: 160px;

}

@media only screen and (max-width: 576px) {

  .shop-slider-area2 {

    padding-bottom: 130px;

  }

}

.shop-slider-area2 .image {

  height: 530px;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  background: #E9F1FC;

  border-radius: 10px;

}

.shop-slider-area2 .slider-pagination-area .swiper-pagination {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 20px;

}

.shop-slider-area2 .slider-pagination-area .swiper-pagination-bullet {

  background: url(../images/shop/18-sm.webp);

  background-position: center;

  background-size: cover;

  background-repeat: no-repeat;

  width: 164px;

  height: 130px;

  border-radius: 0;

  opacity: 1;

  margin: 0;

}

@media only screen and (max-width: 991px) {

  .shop-slider-area2 .slider-pagination-area .swiper-pagination-bullet {

    width: 100%;

    height: 130px;

  }

}

@media only screen and (max-width: 767px) {

  .shop-slider-area2 .slider-pagination-area .swiper-pagination-bullet {

    height: 100px;

  }

}

.shop-slider-area2 .slider-pagination-area .swiper-pagination-bullet:nth-child(2) {

  background: url(../images/shop/19-sm.webp);

  background-position: center;

  background-size: cover;

  background-repeat: no-repeat;

}

.shop-slider-area2 .slider-pagination-area .swiper-pagination-bullet:nth-child(3) {

  background: url(../images/shop/20-sm.webp);

  background-position: center;

  background-size: cover;

  background-repeat: no-repeat;

}



.tmp-cart-area .cart-top-area {

  padding: 40px 50px;

  box-shadow: var(--shadow-1);

  background: var(--color-white);

  border-radius: 6px;

}

@media only screen and (max-width: 576px) {

  .tmp-cart-area .cart-top-area {

    padding: 25px;

  }

}

.tmp-cart-area .cart-top-area .text {

  font-size: 14px;

  margin-bottom: 10px;

  font-weight: 500;

}

.tmp-cart-area .cart-top-area .text span {

  color: var(--color-primary);

  font-weight: 700;

}

.tmp-cart-area .cart-top-area .progress-area {

  width: 100%;

  height: 6px;

  background: #F3F4F6;

  border-radius: 6px;

  position: relative;

  z-index: 1;

}

.tmp-cart-area .cart-top-area .progress-area::after {

  content: "";

  position: absolute;

  z-index: 1;

  top: 0;

  left: 0;

  height: 100%;

  width: 80%;

  background: var(--color-primary-2);

  border-radius: 6px;

}

.tmp-cart-area .cart-table {

  box-shadow: var(--shadow-1);

  background: var(--color-white);

  border-radius: 6px;

}

.tmp-cart-area table {

  margin-bottom: 0;

}

@media only screen and (max-width: 991px) {

  .tmp-cart-area table {

    min-width: 990px;

  }

}

.tmp-cart-area table thead tr {

  border-bottom: 1px solid #efefef;

}

.tmp-cart-area table thead tr th {

  padding: 22px 30px;

  text-align: center;

  color: var(--color-heading-1);

  font-size: 18px;

  font-weight: 500;

  text-transform: none;

}

.tmp-cart-area table tbody tr {

  position: relative;

  z-index: 1;

  border-bottom: 1px solid #efefef;

}

.tmp-cart-area table tbody tr td {

  border: none;

  text-align: center;

  padding: 22px 30px;

}

.tmp-cart-area table tbody tr td .quantity-edits {

  max-width: 82px;

  margin: auto;

  display: flex;

  align-items: center;

  border-radius: 3px;

  padding: 0;

  border: 1px solid var(--color-border);

}

.tmp-cart-area table tbody tr td .quantity-edits .button-area {

  border-left: 1px solid var(--color-border);

  display: flex;

  flex-direction: column;

}

.tmp-cart-area table tbody tr td .quantity-edits button {

  background: var(--color-white);

  padding: 0;

  border: none;

  border-radius: 0;

  min-width: 30px;

  height: 25px;

  color: var(--color-heading-1);

  border-width: 0 0 1px 0;

  border-style: solid;

  border-color: var(--color-border);

  transition: 0.3s;

}

.tmp-cart-area table tbody tr td .quantity-edits button:hover {

  background: var(--color-primary);

}

.tmp-cart-area table tbody tr td .quantity-edits button:hover i {

  color: var(--color-white);

}

.tmp-cart-area table tbody tr td .quantity-edits button i {

  color: var(--color-heading-1);

  font-size: 13px;

  transition: 0.3s;

}

.tmp-cart-area table tbody tr td .quantity-edits button:nth-child(2) {

  border: none;

}

.tmp-cart-area table tbody tr td .quantity-edits input {

  border: none;

  padding: 0;

  max-width: max-content;

  text-align: center;

  line-height: 1;

  color: var(--color-heading-1);

  font-weight: 600;

}

.tmp-cart-area table tbody tr td:last-child {

  position: absolute;

  z-index: 1;

  right: 7px;

  top: 7px;

  padding: 0;

}

.tmp-cart-area table tbody tr td .product-info {

  display: flex;

  align-items: center;

  gap: 20px;

  padding-left: 0;

}

.tmp-cart-area table tbody tr td .product-info .image-area {

  min-width: 65px;

  height: 65px;

  line-height: 65px;

  border-radius: 6px;

  text-align: center;

  display: block;

  background: #E9F1FC;

}

.tmp-cart-area table tbody tr td .product-info .text {

  text-align: start;

}

.tmp-cart-area table tbody tr td .product-info .text p {

  font-family: var(--font-primary);

  color: var(--color-heading-1);

  font-size: 16px;

  line-height: 1;

  font-weight: 600;

  margin-bottom: 10px;

}

.tmp-cart-area table tbody tr td .product-info .text span {

  font-family: var(--font-primary);

  font-weight: 500;

  color: #74787C;

  font-size: 14px;

  line-height: 1;

  display: block;

}

.tmp-cart-area table tbody tr td span.price {

  color: var(--color-heading-1);

  font-weight: 600;

  font-family: var(--font-primary);

  line-height: 1;

  display: block;

}

.tmp-cart-area table tbody tr td .remove-btn {

  width: 25px;

  height: 25px;

  background: var(--color-primary-2);

  color: var(--color-white);

  padding: 0;

  border: 0;

  border-radius: 50%;

  font-weight: 400;

  text-align: center;

  display: flex;

  align-items: center;

  justify-content: center;

}

.tmp-cart-area table tbody tr td .cart-btn {

  text-decoration: none;

  padding: 13px 15px;

  margin: auto;

}

.tmp-cart-area .cart-footer {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 30px;

}

@media only screen and (max-width: 576px) {

  .tmp-cart-area .cart-footer {

    gap: 20px;

  }

}

.tmp-cart-area .cart-footer form {

  display: flex;

  align-items: center;

  gap: 10px;

  max-width: 456px;

  width: 100%;

}

@media only screen and (max-width: 1199px) {

  .tmp-cart-area .cart-footer form {

    max-width: 410px;

  }

}

@media only screen and (max-width: 576px) {

  .tmp-cart-area .cart-footer form {

    flex-direction: column;

    align-items: flex-start;

  }

}

.tmp-cart-area .cart-footer form input {

  background: #F3F4F6;

  padding: 9px 25px;

  border-radius: 33px;

  border: 2px solid transparent;

}

@media only screen and (max-width: 576px) {

  .tmp-cart-area .cart-footer form input {

    width: 320px;

  }

}

.tmp-cart-area .cart-footer form input:focus {

  border: 2px solid var(--color-primary);

}

.tmp-cart-area .cart-footer form button {

  border: none;

  border-radius: 33px;

  padding: 20px 25px;

  height: auto;

}

.tmp-cart-area .cart-footer .clear-all {

  border-radius: 33px;

  max-width: max-content;

  border: 1px solid #efefef;

  line-height: 1;

  padding: 15px 25px;

  font-family: var(--font-primary);

  color: var(--color-heading-1);

  font-weight: 700;

}

.tmp-cart-area .cart-total-area {

  background: var(--color-white);

  box-shadow: var(--shadow-1);

  border-radius: 6px;

}

.tmp-cart-area .cart-total-area .cart-total {

  padding: 26px 30px;

  border-bottom: 1px solid #efefef;

}

.tmp-cart-area .cart-total-area .cart-total .title {

  font-size: 16px;

  line-height: 1;

  margin-bottom: 0;

}

.tmp-cart-area .cart-total-area .cart-total p {

  margin-bottom: 0;

  font-size: 14px;

  font-weight: 500;

  line-height: 1;

}

.tmp-cart-area .cart-total-area .cart-total:last-child {

  border: none;

}

.tmp-cart-area .cart-total-area .cart-total.shipping-area {

  display: flex;

  justify-content: space-between;

}

@media only screen and (max-width: 1199px) {

  .tmp-cart-area .cart-total-area .cart-total.shipping-area {

    flex-direction: column;

    gap: 10px;

  }

}

.tmp-cart-area .cart-total-area .cart-total.shipping-area .right {

  max-width: 196px;

  width: 100%;

}

.tmp-cart-area .cart-total-area .cart-total.shipping-area .right p {

  margin-top: 20px;

  font-weight: 400;

  line-height: 1.3;

}

.tmp-cart-area .cart-total-area .cart-total.shipping-area .right a {

  display: block;

  margin-top: 15px;

  color: #2C3C28;

}

.tmp-cart-area .cart-total-area .cart-total.shipping-area .custom-options {

  display: flex;

  flex-direction: column;

  gap: 16px;

}

.tmp-cart-area .cart-total-area .cart-total.shipping-area .custom-options .option {

  position: relative;

  padding-left: 28px;

  cursor: pointer;

  font-size: 14px;

  line-height: 1;

  color: #2C3C28;

  display: flex;

  align-items: center;

}

.tmp-cart-area .cart-total-area .cart-total.shipping-area .custom-options .option input {

  position: absolute;

  opacity: 0;

  cursor: pointer;

}

.tmp-cart-area .cart-total-area .cart-total.shipping-area .custom-options .option .checkmark {

  position: absolute;

  left: 0;

  top: 0;

  height: 14px;

  width: 14px;

  background-color: white;

  border: 1px solid #2C3C28;

  border-radius: 50%;

}

.tmp-cart-area .cart-total-area .cart-total.shipping-area .custom-options .option .checkmark::after {

  content: "";

  position: absolute;

  display: none;

  top: 2px;

  left: 2px;

  width: 8px;

  height: 8px;

  border-radius: 50%;

  background: var(--color-primary);

}

.tmp-cart-area .cart-total-area .cart-total.shipping-area .custom-options .option input:checked ~ .checkmark {

  border-color: var(--color-primary);

}

.tmp-cart-area .cart-total-area .cart-total.shipping-area .custom-options .option input:checked ~ .checkmark::after {

  display: block;

}

.tmp-cart-area .cart-total-area .button-area {

  padding: 0 30px 30px;

}

.tmp-cart-area .cart-total-area .button-area .tmp-btn {

  max-width: 100%;

  text-align: center;

}



.coupon-toggle {

  margin-bottom: 30px;

}

.coupon-toggle .accordion .card {

  border: unset;

  border-radius: 33px;

  border: 1px solid #E9E9E9;

}



.coupon-toggle .accordion .card .card-header {

  border: none;

  margin: 0;

  border-radius: 3px;

  padding: 15px 20px;

  background: none;

}



.coupon-toggle .accordion .card .card-header .card-title {

  margin: 0;

}



.coupon-toggle .accordion .card .card-header .card-title span i {

  margin-right: 10px;

}



.coupon-toggle .accordion .card .card-header .card-title button {

  background: unset;

  width: unset;

  border: none;

  color: var(--color-primary);

  transition: all 0.3s ease;

  outline: none;

  cursor: pointer;

}



.coupon-toggle .accordion .card .card-header .card-title button:hover {

  color: var(--color-primary);

}



.coupon-toggle .accordion .card .card-body {

  padding: 0 20px 30px 20px;

  margin-top: 0;

  text-align: left;

}

.coupon-toggle .accordion .card .card-body p {

  margin-bottom: 20px;

}

.coupon-toggle .accordion .card .card-body button {

  padding: 17px 32px;

  border: none;

}



.coupon-toggle .accordion .card .card-body .coupon-code-input {

  width: 47%;

  float: left;

  margin-right: 10px;

  border-radius: 4px;

}



.coupon-toggle .accordion .card .card-body .coupon-code-input input {

  width: 100%;

  height: 50px;

  outline: none;

  padding: 10px 18px;

  color: #454545;

  background: #f7f7f7;

  border: 2px solid #f1f1f1;

  border-radius: 33px;

}



.full-grid {

  margin-top: 25px;

}

.full-grid .login-area {

  background: var(--color-primary);

  padding: 20px 30px;

  margin-bottom: 30px;

  border-radius: 33px;

}

.full-grid .login-area span {

  color: var(--color-white);

}

.full-grid .login-area span a {

  color: var(--color-white);

}



.full-grid .form-content-box {

  margin-bottom: 50px;

}



.full-grid .form-content-box .form-group {

  margin-bottom: 35px;

}

.full-grid .form-content-box .form-group button {

  border: none;

}



.full-grid .form-content-box .form-group label {

  line-height: 2;

  display: block;

  margin-bottom: 5px;

  font-weight: 600;

}



.full-grid .form-content-box .form-group select {

  color: #666666;

  padding-left: 8px;

  padding-right: 20px;

  overflow: hidden;

  text-overflow: ellipsis;

  white-space: nowrap;

  background: transparent;

  border: 1px solid #E8E8E8;

  border-radius: 0;

  height: 45px;

  line-height: 45px;

  cursor: pointer;

  width: 100%;

  outline: none;

  border-radius: 33px;

}



.full-grid .form-content-box .form-group textarea {

  height: 4em;

  line-height: 1.5;

  display: block;

  box-shadow: none;

  width: 100%;

  padding: 10px 18px;

  background: transparent;

  border: 1px solid #E8E8E8;

  margin: 0;

  outline: none;

  border-radius: 33px;

}



.full-grid .form-content-box .form-group .form-control-mod {

  height: 50px;

  padding: 10px 18px;

  background: transparent;

  width: 100%;

  margin: 0;

  outline: none;

  line-height: normal;

  border-radius: unset;

  border: 1px solid #E8E8E8;

  border-radius: 33px;

}



.full-grid .form-content-box .form-group .form-control-mod.margin-bottom {

  margin-bottom: 35px !important;

}



.full-grid .ordered-product table {

  width: 100%;

}



.full-grid .ordered-product table tr th {

  border: 1px solid #ccc;

  padding: 9px 12px;

}



.full-grid .ordered-product table tr td {

  border: 1px solid #ccc;

  padding: 6px 12px;

}



.full-grid .payment-method .top-area {

  border-bottom: 1px solid #d3ced2;

}



.full-grid .payment-method .top-area .payment-co {

  margin-bottom: 20px;

}



.full-grid .payment-method .top-area .payment-co span {

  font-weight: 600;

  margin-right: 10px;

}



.full-grid .payment-method .top-area .p-msg {

  position: relative;

  box-sizing: border-box;

  width: 100%;

  padding: 1em;

  margin: 1em 0 2em;

  font-size: 0.92em;

  border-radius: 2px;

  line-height: 1.5;

  background-color: #f9f9f9;

}



.full-grid .payment-method .top-area .p-msg:before {

  content: "";

  display: block;

  border: 1em solid #f9f9f9;

  border-right-color: transparent;

  border-left-color: transparent;

  border-top-color: transparent;

  position: absolute;

  top: -0.75em;

  left: 0;

  margin: -1em 0 0 2em;

}



.order-wrapper .cart-total {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 25px 0;

  border-bottom: 1px solid #efefef;

}

.order-wrapper .cart-total:first-child {

  padding-top: 0;

}

.order-wrapper .cart-total p {

  margin-bottom: 0;

  font-family: var(--font-primary);

  font-weight: 500;

}

.order-wrapper .cart-total p.price {

  color: var(--color-heading-1);

  font-weight: 600;

}

.order-wrapper .cart-total p.price span {

  color: #74787C;

  font-weight: 500;

}

.order-wrapper .cart-total p.cb {

  color: var(--color-heading-1);

  font-weight: 600;

}

.order-wrapper .cart-total .product-info {

  display: flex;

  align-items: center;

  gap: 15px;

}

.order-wrapper .cart-total .product-info .image-area {

  min-width: 80px;

  height: 80px;

  line-height: 80px;

  border: 1px solid #efefef;

  border-radius: 6px;

  text-align: center;

  display: block;

}

.order-wrapper .cart-total .product-info .text {

  text-align: start;

  max-width: 208px;

}

.order-wrapper .cart-total .product-info .text h6,

.order-wrapper .cart-total .product-info .text .title {

  margin-bottom: 0;

  font-size: 16px;

  line-height: 1.3;

}

.order-wrapper .transfer-area .option {

  position: relative;

  padding-left: 28px;

  cursor: pointer;

  font-size: 14px;

  line-height: 1;

  color: #2C3C28;

  display: flex;

  align-items: center;

  margin-bottom: 12px;

}

.order-wrapper .transfer-area .option input {

  position: absolute;

  opacity: 0;

  cursor: pointer;

}

.order-wrapper .transfer-area .option .checkmark {

  position: absolute;

  left: 0;

  top: 0;

  height: 14px;

  width: 14px;

  background-color: white;

  border: 1px solid #2C3C28;

  border-radius: 50%;

}

.order-wrapper .transfer-area .option .checkmark::after {

  content: "";

  position: absolute;

  display: none;

  top: 2px;

  left: 2px;

  width: 8px;

  height: 8px;

  border-radius: 50%;

  background: var(--color-primary);

}

.order-wrapper .transfer-area .option input:checked ~ .checkmark {

  border-color: var(--color-primary);

}

.order-wrapper .transfer-area .option input:checked ~ .checkmark::after {

  display: block;

}

.order-wrapper .transfer-area .desc {

  margin-bottom: 20px;

  font-size: 14px;

  font-weight: 400;

  margin-top: 0;

}

.order-wrapper .transfer-area .desc.last {

  margin-bottom: 5px;

}

.order-wrapper .transfer-area .tmp-btn {

  max-width: 100%;

  text-align: center;

  border: none;

}

.order-wrapper .transfer-area .terms-conditions {

  margin-bottom: 20px;

}

.order-wrapper .transfer-area .terms-conditions input[type=checkbox],

.order-wrapper .transfer-area .terms-conditions input[type=radio] {

  opacity: 1;

  position: relative;

  height: auto !important;

  max-width: 18px;

  width: max-content;

  accent-color: var(--color-primary);

  width: 18px;

  height: 18px;

}

.order-wrapper .transfer-area .terms-conditions input[type=checkbox] ~ label,

.order-wrapper .transfer-area .terms-conditions input[type=radio] ~ label {

  position: relative;

  font-size: 12px;

  line-height: 17px;

  color: var(--color-body);

  font-weight: 400;

  padding-left: 25px;

  cursor: pointer;

}

.order-wrapper .transfer-area .terms-conditions input[type=checkbox] ~ label::before,

.order-wrapper .transfer-area .terms-conditions input[type=radio] ~ label::before {

  content: " ";

  position: absolute;

  top: 1 px;

  left: 0;

  width: 15px;

  height: 15px;

  background-color: var(--color-white);

  border-radius: 2px;

  transition: all 0.3s;

  border-radius: 2px;

}

.order-wrapper .transfer-area .terms-conditions input[type=checkbox] ~ label::after,

.order-wrapper .transfer-area .terms-conditions input[type=radio] ~ label::after {

  content: " ";

  position: absolute;

  top: 16%;

  left: 2px;

  width: 10px;

  height: 6px;

  background-color: transparent;

  border-bottom: 2px solid #ffffff;

  border-left: 2px solid #ffffff;

  border-radius: 2px;

  transform: rotate(-45deg);

  opacity: 0;

  transition: all 0.3s;

}

.order-wrapper .transfer-area .terms-conditions input[type=checkbox]:checked ~ label::after,

.order-wrapper .transfer-area .terms-conditions input[type=radio]:checked ~ label::after {

  opacity: 1;

}



.tmp-shop-card-1 {

  background: transparent;

  border-radius: 0;

  box-shadow: none;

  margin-top: 0;

  position: relative;

  transition: 0.3s;

  text-align: center;

  transition: 0.3s;

  height: 100%;

}

.tmp-shop-card-1:hover {

  transform: scale(1.02);

}

.tmp-shop-card-1 .inner {

  padding: 30px;

  background: var(--color-white);

  border-radius: 6px;

  box-shadow: 0px 6px 34px rgba(215, 216, 222, 0.41);

  height: 100%;

}

@media only screen and (max-width: 767px) {

  .tmp-shop-card-1 .inner {

    padding: 20px;

  }

}

.tmp-shop-card-1 .inner .content {

  padding: 20px 0 0 0;

  text-align: center;

}

.tmp-shop-card-1 .inner .content .tmp-review {

  display: flex;

  align-items: center;

  flex-wrap: wrap;

  justify-content: center;

}

@media only screen and (max-width: 1199px) {

  .tmp-shop-card-1 .inner .content .tmp-review {

    gap: 10px;

  }

}

.tmp-shop-card-1 .inner .content .tmp-review .rating {

  display: flex;

  align-items: center;

  margin-right: 6px;

  gap: 2px;

}

.tmp-shop-card-1 .inner .content .tmp-review .rating i {

  font-size: 12px;

  color: #FF9747;

  transition: 0.3s;

}

.tmp-shop-card-1 .inner .content .tmp-review .rating-count {

  display: inline-block;

  font-size: 14px;

  font-weight: 400;

}

.tmp-shop-card-1 .inner .content .tmp-price {

  display: flex;

  align-items: center;

  justify-content: center;

}

@media only screen and (max-width: 1199px) {

  .tmp-shop-card-1 .inner .content .tmp-price {

    flex-wrap: wrap;

    gap: 5px;

  }

}

.tmp-shop-card-1 .inner .content .tmp-price .current-price {

  font-size: 24px;

  font-weight: 700;

  color: var(--color-primary);

}

.tmp-shop-card-1 .inner .content .tmp-price .off-price {

  font-size: 20px;

  font-weight: 400;

  text-decoration: line-through;

  opacity: 0.4;

  margin-left: 7px;

}

.tmp-shop-card-1 .inner .content .tmp-price .availablity {

  font-size: 14px;

  font-weight: 500;

  margin-left: 11px;

  display: flex;

  align-items: center;

  gap: 7px;

}

.tmp-shop-card-1 .inner .content .tmp-price .availablity i {

  color: var(--color-primary);

  height: 21px;

  width: 21px;

  background: var(--primary-100);

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 11px;

  position: relative;

  top: -1px;

}

.tmp-shop-card-1 .inner .content .addto-cart-btn {

  margin: auto;

  max-width: max-content;

}

.tmp-shop-card-1 .inner .content .title {

  font-size: 22px;

  line-height: 1.4;

  font-weight: 700;

  margin-bottom: 6px;

}

.tmp-shop-card-1 .inner .content .team-form {

  display: block;

  font-size: 14px;

  margin-bottom: 12px;

  letter-spacing: 0.6px;

}

.tmp-shop-card-1 .inner .thumbnail {

  top: 0;

  position: static;

  left: inherit;

  transform: none;

  min-width: 100%;

  min-height: inherit;

  max-height: inherit;

  margin: 0 auto;

  border-radius: 6px;

  border: 0 none;

  display: block;

  position: relative;

}

.tmp-shop-card-1 .inner .thumbnail img {

  border-radius: 6px;

}

.tmp-shop-card-1 .inner .thumbnail .action-buttons {

  display: flex;

  align-items: center;

  flex-direction: column;

  border-radius: 4px;

  position: absolute;

  top: 20px;

  right: -10px;

  transition: 0.3s;

  opacity: 0;

}

.tmp-shop-card-1 .inner .thumbnail .action-buttons .action {

  height: 45px;

  width: 45px;

  display: flex;

  align-items: center;

  justify-content: center;

  background: var(--color-white);

  border-bottom: 1px solid var(--color-border);

  cursor: pointer;

  transition: 0.3s;

}

.tmp-shop-card-1 .inner .thumbnail .action-buttons .action i {

  transition: 0.3s;

}

.tmp-shop-card-1 .inner .thumbnail .action-buttons .action:hover {

  background: var(--color-primary);

  border-color: var(--color-primary);

}

.tmp-shop-card-1 .inner .thumbnail .action-buttons .action:hover i {

  color: #fff !important;

}

.tmp-shop-card-1 .inner .thumbnail .action-buttons .action:first-child {

  border-radius: 3px 3px 0 0;

}

.tmp-shop-card-1 .inner .thumbnail .action-buttons .action:last-child {

  border: none;

  border-radius: 0 0 3px 3px;

}

.tmp-shop-card-1:hover .inner .thumbnail .action-buttons {

  right: 20px;

  opacity: 1;

}



.demo-orange .tmp-shop-card-1 .inner .content .tmp-price .availablity i {

  background: var(--secondary-100);

}



.checkout-padding-shadow {

  background: var(--color-white);

  padding: 30px;

  box-shadow: var(--shadow-1);

  margin-top: 0;

  margin-bottom: 0;

  border: none;

}

.checkout-padding-shadow .billing-fields .title {

  font-size: 28px;

  line-height: 1.2;

}

.checkout-padding-shadow .title-order {

  font-size: 28px;

  line-height: 1.3;

}



.cart-bottom-card-box {

  box-shadow: var(--shadow-1);

  background: var(--color-white);

  padding: 30px;

  border-radius: 6px;

}

@media only screen and (max-width: 767px) {

  .cart-bottom-card-box {

    padding: 20px;

  }

}

.cart-bottom-card-box.summery {

  padding: 60px 45px;

}

@media only screen and (max-width: 767px) {

  .cart-bottom-card-box.summery {

    padding: 20px;

  }

}

.cart-bottom-card-box .title-main {

  padding-bottom: 10px;

  border-bottom: 1px dashed var(--color-border);

  margin-bottom: 30px;

  font-size: 30px;

  line-height: 1.2;

}

.cart-bottom-card-box input {

  height: 45px;

  border: 2px solid var(--color-border);

  border-radius: 33px;

}

.cart-bottom-card-box .summery p {

  font-size: 16px;

  font-weight: 500;

  line-height: 23px;

  color: var(--color-body);

  margin: 0;

  padding: 12px 0;

}

.cart-bottom-card-box .summery p span {

  float: right;

}

.cart-bottom-card-box .summery p + p {

  border-top: 1px dashed var(--color-border);

}

.cart-bottom-card-box .summery h2 {

  border-top: 2px solid var(--color-border);

  padding-top: 14px;

  font-size: 18px;

  line-height: 23px;

  font-weight: 700;

  color: var(--color-heading-1);

  margin: 0;

  margin-top: 20px;

}

.cart-bottom-card-box .summery h2 span {

  float: right;

}



.invers-modern-select .select {

  position: relative;

  width: 100%;

  z-index: 5;

}

.invers-modern-select .select .selectBtn {

  box-sizing: border-box;

  border-radius: 33px;

  width: 100%;

  cursor: pointer;

  position: relative;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;

  background: #fff;

  height: 45px;

  border: 2px solid var(--color-border);

  display: flex;

  align-items: center;

  padding: 0 15px;

}

.invers-modern-select .select .selectBtn:after {

  content: "";

  position: absolute;

  top: 50%;

  right: 15px;

  width: 6px;

  height: 6px;

  -webkit-transform: translateY(-50%) rotate(45deg);

  transform: translateY(-50%) rotate(45deg);

  border-right: 2px solid #666;

  border-bottom: 2px solid #666;

  transition: 0.2s ease;

}

.invers-modern-select .select .selectBtn.toggle {

  border-radius: 3px 3px 0 0;

}

.invers-modern-select .select .selectBtn.toggle:after {

  -webkit-transform: translateY(-50%) rotate(-135deg);

  transform: translateY(-50%) rotate(-135deg);

}

.invers-modern-select .select .selectDropdown {

  position: absolute;

  top: 100%;

  width: 100%;

  border-radius: 0 0 3px 3px;

  overflow: hidden;

  border-top: 1px solid #eee;

  z-index: 5;

  background: #fff;

  -webkit-transform: scale(1, 0);

  transform: scale(1, 0);

  -webkit-transform-origin: top center;

  transform-origin: top center;

  visibility: hidden;

  transition: 0.2s ease;

  box-shadow: var(--shadow-1);

}

.invers-modern-select .select .selectDropdown .option {

  padding: 10px;

  box-sizing: border-box;

  cursor: pointer;

}

.invers-modern-select .select .selectDropdown .option:hover {

  background: #f8f8f8;

}

.invers-modern-select .select .selectDropdown.toggle {

  visibility: visible;

  -webkit-transform: scale(1, 1);

  transform: scale(1, 1);

}



.modal.quickview {

  scrollbar-width: none;

}



.quick-view-dialogue.modal-dialog {

  max-width: 1000px;

  margin: 110px auto;

}

.quick-view-dialogue.modal-dialog .modal-content {

  padding: 15px;

  background: var(--color-white);

}

.quick-view-dialogue.modal-dialog .btn-close {

  position: absolute;

  right: -16px;

  z-index: 99;

  background-color: var(--color-white);

  background: var(--color-white);

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

  height: 35px;

  width: 35px;

  border-radius: 50%;

  top: -16px;

  opacity: 1;

  z-index: 1;

}

.quick-view-dialogue.modal-dialog .btn-close::after {

  position: absolute;

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%) scale(0.2);

  content: "";

  width: 100%;

  height: 100%;

  background: var(--color-primary);

  opacity: 0;

  z-index: -1;

  border-radius: 50%;

  transition: 0.3s;

}

.quick-view-dialogue.modal-dialog .btn-close:hover::after {

  transform: translate(-50%, -50%) scale(1);

  opacity: 1;

}

.quick-view-dialogue.modal-dialog .btn-close:hover i {

  color: #fff;

}

.quick-view-dialogue.modal-dialog .btn-close i {

  font-size: 22px;

  color: var(--color-heading-1);

  transition: 0.3s;

}

.quick-view-dialogue.modal-dialog .modal-header {

  border: none;

  padding: 0;

}

.quick-view-dialogue.modal-dialog .modal-body {

  padding: 0;

}

.quick-view-dialogue.modal-dialog .modal-body .modal-gallery {

  margin-top: 10px;

}

.quick-view-dialogue.modal-dialog .modal-body .modal-gallery .swiper-slide {

  border-radius: 4px;

  overflow: hidden;

}

.quick-view-dialogue.modal-dialog .modal-body .modal-gallery .swiper-slide img {

  cursor: pointer;

}



.modal-gallery-big {

  border-radius: 6px;

  overflow: hidden;

}



.progress-wrap {

  position: fixed;

  right: 30px;

  bottom: 44px;

  height: 40px;

  width: 40px;

  cursor: pointer;

  display: block;

  border-radius: 50px;

  z-index: 999;

  opacity: 1;

  visibility: hidden;

  transform: translateY(15px);

  box-shadow: 0px 8px 16px rgba(3, 4, 28, 0.162);

}



.progress-wrap.active-progress {

  opacity: 1;

  visibility: visible;

  transform: translateY(0);

}



.progress-wrap::after {

  position: absolute;

  font-family: var(--font-awesome);

  content: "\f077";

  text-align: center;

  line-height: 40px;

  font-size: 18px;

  color: var(--color-primary);

  left: 0;

  top: 0;

  height: 40px;

  width: 40px;

  cursor: pointer;

  display: flex;

  align-items: center;

  justify-content: center;

  z-index: 1;

  border: 1px solid var(--color-primary);

  border: none !important;

  box-shadow: none;

  border-radius: 50% !important;

  border-radius: 5px;

}



.progress-wrap:hover::after {

  opacity: 1;

  content: "\f077";

}



.progress-wrap::before {

  position: absolute;

  font-family: var(--font-awesome);

  content: "\f077";

  text-align: center;

  line-height: 46px;

  font-size: 24px;

  opacity: 0;

  background: var(--color-primary);

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

  left: 0;

  top: 0;

  height: 46px;

  width: 46px;

  cursor: pointer;

  display: block;

  z-index: 2;

}



.progress-wrap:hover::before {

  opacity: 0;

}



.progress-wrap svg path {

  fill: #ffffff;

}



.progress-wrap svg {

  color: var(--color-primary);

  border-radius: 50%;

  background: transparent;

}



.progress-wrap svg.progress-circle path {

  stroke: var(--color-primary);

  stroke-width: 4px;

  box-sizing: border-box;

}



.home-blue .progress-wrap svg.progress-circle path {

  stroke: var(--color-primary);

}

.home-blue .progress-wrap::after {

  border-color: var(--color-primary);

  box-shadow: 0px 3px 20px 6px rgba(7, 66, 233, 0.3215686275);

  color: var(--color-primary);

}



.great-quality-skill-four {

  padding: 130px 180px;

  background: #fff;

}

@media only screen and (max-width: 1199px) {

  .great-quality-skill-four {

    padding: 40px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .great-quality-skill-four {

    padding: 40px;

  }

}

@media only screen and (max-width: 767px) {

  .great-quality-skill-four {

    padding: 20px;

  }

}



.infor-exp-content p.disc {

  width: 90%;

}



.tmp-skill-area.four img {

  width: 100%;

}



.video-section-content {

  display: flex;

  flex-direction: column;

  justify-content: space-between;

  padding: 80px;

  height: 100%;

  background: var(--color-heading-1);

}

@media only screen and (max-width: 991px) {

  .video-section-content {

    padding: 30px;

    gap: 20px;

  }

}

@media only screen and (max-width: 767px) {

  .video-section-content {

    padding: 25px;

  }

}

.video-section-content .icon {

  padding: 25px;

  border-radius: 50%;

  max-width: max-content;

  background: rgba(255, 255, 255, 0.031372549);

}

.video-section-content .content .title {

  color: var(--color-white);

}

.video-section-content .content p.desc {

  color: #adadad;

}

.video-section-content:hover .icon svg {

  animation: bounceIn 1.3s ease;

}



.invers-video-thumbnail {

  height: 100%;

}

.invers-video-thumbnail video {

  width: 100%;

  object-fit: cover;

  min-height: 600px;

  height: 100%;

}

@media only screen and (max-width: 767px) {

  .invers-video-thumbnail video {

    min-height: 372px;

  }

}



.radious-left-bottom {

  border-radius: 8px 0 0 8px;

}

@media only screen and (max-width: 991px) {

  .radious-left-bottom {

    border-radius: 8px 8px 0 0;

  }

}



.radious-right-bottom {

  border-radius: 0 8px 8px 0;

  display: block;

  overflow: hidden;

}

@media only screen and (max-width: 991px) {

  .radious-right-bottom {

    border-radius: 0 0 8px 8px;

  }

}



.fooetr-bg-3 {

  background-image: url(../images/footer/02.webp);

  background-size: cover;

  background-position: center;

}



.footer-one {

  background: #001b46;

  position: relative;

  z-index: 10;

}

.footer-one .footer-top-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

@media (max-width: 991px) {

  .footer-one .footer-top-wrapper {

    display: block;

  }

}

.footer-one .footer-top-wrapper a {

  padding: 24px 30px;

  background: #171717;

  border: 1px solid #222222;

  box-shadow: 0px 4px 35px #121212;

}

@media (max-width: 1400px) and (min-width: 1200px) {

  .footer-one .footer-top-wrapper a {

    width: 20%;

    padding: 22px 30px;

  }

}

@media (max-width: 1199px) and (min-width: 991px) {

  .footer-one .footer-top-wrapper a {

    width: 20%;

    padding: 18px 30px;

  }

}

@media (max-width: 991px) {

  .footer-one .footer-top-wrapper a {

    padding: 24px 30px 30px 30px;

  }

}

.footer-one .footer-top-wrapper .title {

  color: #FFFFFF;

  font-weight: 700;

  font-size: 29px;

  line-height: 40px;

  font-family: var(--font-primary);

  text-transform: uppercase;

  margin-bottom: 0;

}

@media (max-width: 1400px) and (min-width: 1200px) {

  .footer-one .footer-top-wrapper .title {

    font-size: 22px;

    line-height: 32px;

  }

}

@media (max-width: 1199px) and (min-width: 991px) {

  .footer-one .footer-top-wrapper .title {

    font-size: 20px;

  }

}

@media (max-width: 991px) {

  .footer-one .footer-top-wrapper .title {

    margin: 60px 0 30px 0;

  }

}

.footer-one .footer-top-wrapper .subscribe-area {

  display: flex;

  align-items: center;

  position: relative;

}

@media (max-width: 576px) {

  .footer-one .footer-top-wrapper .subscribe-area {

    display: block;

  }

}

.footer-one .footer-top-wrapper .subscribe-area form {

  position: relative;

}

.footer-one .footer-top-wrapper .subscribe-area button {

  position: absolute;

  right: 0;

  top: 0;

  height: 100%;

}

.footer-one .footer-top-wrapper .subscribe-area input {

  background: #1A1A1A;

  border: 1px solid #222222;

  height: 60px;

  width: 537px;

  padding-right: 180px;

  font-size: 16px;

  color: #fff;

}

@media (max-width: 1400px) and (min-width: 1200px) {

  .footer-one .footer-top-wrapper .subscribe-area input {

    width: 450px;

  }

}

@media (max-width: 1199px) and (min-width: 991px) {

  .footer-one .footer-top-wrapper .subscribe-area input {

    width: 390px;

    height: 50px;

  }

}

@media (max-width: 576px) {

  .footer-one .footer-top-wrapper .subscribe-area input {

    width: 100%;

  }

}

@media (max-width: 450px) {

  .footer-one .footer-top-wrapper .subscribe-area input {

    height: 50px;

  }

}

@media (max-width: 1400px) and (min-width: 1200px) {

  .footer-one .footer-top-wrapper .subscribe-area .tmp-btn {

    padding: 20px 25px;

  }

}

@media (max-width: 450px) {

  .footer-one .footer-top-wrapper .subscribe-area .tmp-btn {

    padding: 20px;

  }

}



.main-footer-one-area {

  display: flex;

  align-items: flex-start;

  flex-wrap: wrap;

  border-top: 1px solid #222222;

  --color-body: #cdcdcd;

}

@media (max-width: 1200px) {

  .main-footer-one-area {

    gap: 30px;

    flex-wrap: wrap;

  }

}

.main-footer-one-area .body.one {

  max-width: 279px;

}

.main-footer-one-area .body.one p.desc {

  margin-bottom: 23px;

}

.main-footer-one-area .body.one .social-wrapper-one ul {

  gap: 20px;

}

.main-footer-one-area .body.one .social-wrapper-one ul li {

  margin-right: 0;

}

.main-footer-one-area .body.one .social-wrapper-one ul li a {

  border: none;

  width: unset;

  height: unset;

  background: none;

}

.main-footer-one-area .single-footer-inner {

  width: 24%;

}

.main-footer-one-area .single-footer-inner .footer-title {

  font-weight: 700;

  font-size: 20px;

  line-height: 1;

  color: #fff;

  position: relative;

  margin-bottom: 27px;

}

@media only screen and (max-width: 767px) {

  .main-footer-one-area .single-footer-inner .footer-title {

    margin-bottom: 10px;

  }

}

.main-footer-one-area .single-footer-inner .use-full-link-wrapper .single {

  display: block;

  margin: 10px 0;

  transition: 0.3s;

  color: rgb(255, 255, 255);

  max-width: max-content;

  position: relative;

}

.main-footer-one-area .single-footer-inner .use-full-link-wrapper .single.with-bullet {

  position: relative;

  padding-left: 18px;

}

.main-footer-one-area .single-footer-inner .use-full-link-wrapper .single.with-bullet::before {

  content: "";

  position: absolute;

  left: 0;

  top: 50%;

  transform: translateY(-50%);

  height: 10px;

  width: 10px;

  background: var(--color-primary);

  border-radius: 50%;

}

.main-footer-one-area .single-footer-inner .use-full-link-wrapper .single:hover {

  color: var(--color-primary) !important;

}

.main-footer-one-area .single-footer-inner .use-full-link-wrapper .single i {

  font-weight: 900;

  margin-right: 15px;

}

.main-footer-one-area .single-footer-inner .use-full-link-wrapper .single a {

  font-weight: 400;

  font-size: 16px;

  line-height: 42px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .main-footer-one-area .single-footer-inner {

    width: 18%;

  }

}

.main-footer-one-area .single-footer-inner.company {

  width: 18%;

}

.main-footer-one-area .single-footer-inner.service {

  width: 17%;

}

.main-footer-one-area .single-footer-inner.contact {

  width: 19%;

}

.main-footer-one-area .single-footer-inner.newsletter {

  width: 22%;

}

@media only screen and (max-width: 767px) {

  .main-footer-one-area .single-footer-inner.newsletter {

    width: 100% !important;

  }

}

.main-footer-one-area .single-footer-inner.popular-post {

  width: 35%;

}

@media only screen and (max-width: 576px) {

  .main-footer-one-area .single-footer-inner.popular-post {

    width: 100% !important;

  }

}

.main-footer-one-area .single-footer-inner.popular-post .post-inner {

  display: flex;

  flex-wrap: wrap;

  gap: 20px;

}

.main-footer-one-area .single-footer-inner.popular-post .post-wrapper {

  overflow: hidden;

  border-radius: 4px;

  position: relative;

  z-index: 1;

  max-width: 195px;

}

@media only screen and (max-width: 576px) {

  .main-footer-one-area .single-footer-inner.popular-post .post-wrapper {

    max-width: 45% !important;

  }

}

.main-footer-one-area .single-footer-inner.popular-post .post-wrapper:hover .content {

  opacity: 1;

}

.main-footer-one-area .single-footer-inner.popular-post .post-wrapper .content {

  position: absolute;

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  background: rgba(255, 112, 41, 0.85);

  padding: 19px;

  opacity: 0;

  transition: all 0.4s;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .main-footer-one-area .single-footer-inner.popular-post .post-wrapper .content {

    padding: 10px;

  }

}

.main-footer-one-area .single-footer-inner.popular-post .post-wrapper .content h4 {

  font-size: 14px;

  line-height: 20px;

  margin-bottom: 10px;

}

.main-footer-one-area .single-footer-inner.popular-post .post-wrapper .content h4 a {

  color: var(--color-white);

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .main-footer-one-area .single-footer-inner.popular-post .post-wrapper .content h4 a {

    font-size: 12px;

  }

}

@media only screen and (max-width: 1199px) {

  .main-footer-one-area .single-footer-inner.popular-post .post-wrapper .content h4 a {

    font-size: 12px;

  }

}

.main-footer-one-area .single-footer-inner.popular-post .post-wrapper .content .arrow-btn {

  background: var(--color-white);

  width: 35px;

  height: 35px;

  line-height: 40px;

  border-radius: 50%;

  text-align: center;

  display: block;

  color: var(--color-heading-1);

  font-size: 14px;

}

@media only screen and (max-width: 1199px) {

  .main-footer-one-area .single-footer-inner.popular-post .post-wrapper .content .arrow-btn {

    display: none;

  }

}

.main-footer-one-area .single-footer-inner.popular-post .post-wrapper .content .arrow-btn i {

  transform: rotate(-45deg);

}

.main-footer-one-area .contactus-link-wrapper .single {

  margin-bottom: 12px;

}

.main-footer-one-area .contactus-link-wrapper .single .phone {

  color: rgb(255, 255, 255);

  display: flex;

  align-items: center;

  gap: 5px;

}

.main-footer-one-area .contactus-link-wrapper .single .phone a:hover {

  color: var(--color-primary) !important;

}

.main-footer-one-area .contactus-link-wrapper .single .phone p {

  margin-bottom: 0;

  color: var(--color-body);

}

.main-footer-one-area .contactus-link-wrapper .single .text {

  margin-bottom: 2px;

}

.main-footer-one-area .popular-post-wrapper .single-popular-post {

  display: flex;

  align-items: center;

  margin-bottom: 16px;

}

.main-footer-one-area .popular-post-wrapper .single-popular-post .thumbnail {

  overflow: hidden;

  display: block;

}

.main-footer-one-area .popular-post-wrapper .single-popular-post .thumbnail:hover img {

  transform: scale(1.2);

}

.main-footer-one-area .popular-post-wrapper .single-popular-post .thumbnail img {

  transition: 0.3s;

}

.main-footer-one-area .popular-post-wrapper .single-popular-post .logo {

  display: flex;

  align-items: center;

}

.main-footer-one-area .popular-post-wrapper .single-popular-post .logo i {

  margin-right: 8px;

}

.main-footer-one-area .popular-post-wrapper .single-popular-post .tilte-area .title {

  font-weight: 600;

  font-size: 18px;

  line-height: 27px;

  color: #fff;

  margin-bottom: 8px;

  margin-top: 5px;

  transition: 0.3s;

}

.main-footer-one-area .popular-post-wrapper .single-popular-post .tilte-area:hover .title {

  color: var(--color-primary);

}

.main-footer-one-area .popular-post-wrapper .single-popular-post .thumbnail {

  margin-right: 20px;

}

.main-footer-one-area .newsletter-area .desc {

  font-size: 16px;

}

.main-footer-one-area .newsletter-area .form .single-input-wrapper {

  position: relative;

  z-index: 1;

}

.main-footer-one-area .newsletter-area .form .single-input-wrapper input {

  border: 2px solid rgba(228, 228, 228, 0.1);

  border-radius: 33px;

  padding: 10px 20px;

  color: #fff;

}

.main-footer-one-area .newsletter-area .form .single-input-wrapper input::placeholder {

  color: rgba(255, 255, 255, 0.7);

}

.main-footer-one-area .newsletter-area .form .single-input-wrapper input:focus {

  border: 2px solid var(--color-primary) !important;

}

.main-footer-one-area .newsletter-area .form .single-input-wrapper button {

  width: 34px;

  min-width: 34px;

  height: 34px;

  line-height: 30px;

  position: absolute;

  text-align: center;

  color: var(--color-primary);

  border: none;

  border-radius: 50%;

  font-size: 14px;

  display: block;

  right: 7px;

  top: 50%;

  transform: translateY(-50%);

  z-index: 1;

  padding: 0 9px;

}

.main-footer-one-area .newsletter-area .form .single-input-wrapper button i {

  color: #fff;

}

.main-footer-one-area .newsletter-area .form .single-input-wrapper button:hover {

  background: var(--color-primary);

}

.main-footer-one-area .newsletter-area .form .single-input-wrapper button:hover i {

  color: #fff;

}

.main-footer-one-area .footer-post-area {

  display: flex;

  flex-wrap: wrap;

  gap: 20px;

}

.main-footer-one-area .footer-post-area .footer-post-wrapper {

  position: relative;

  z-index: 1;

  border-radius: 4px;

  overflow: hidden;

  transition: var(--transition);

}

.main-footer-one-area .footer-post-area .footer-post-wrapper:hover .content {

  opacity: 1;

}

.main-footer-one-area .footer-post-area .footer-post-wrapper .content {

  position: absolute;

  width: 100%;

  height: 100%;

  background: rgba(255, 112, 41, 0.85);

  top: 0;

  left: 0;

  z-index: 1;

  padding: 20px;

  opacity: 0;

  transition: var(--transition);

}

.main-footer-one-area .footer-post-area .footer-post-wrapper .content h6 {

  font-size: 14px;

  line-height: 20px;

  margin-bottom: 10px;

}

.main-footer-one-area .footer-post-area .footer-post-wrapper .content h6 a {

  color: var(--color-white);

}

.main-footer-one-area .footer-post-area .footer-post-wrapper .content .tmp-btn {

  padding: 0;

  background: var(--color-white);

  border-radius: 50%;

  text-align: center;

  min-width: 35px;

  height: 35px;

  line-height: 35px;

  display: block;

  color: var(--color-heading-1);

}

.main-footer-one-area .footer-post-area .footer-post-wrapper .content .tmp-btn i {

  transform: rotate(-45deg);

}

.main-footer-one-area.two .single-footer-inner .footer-title {

  position: relative;

  z-index: 1;

  padding-bottom: 10px;

}

.main-footer-one-area.two .single-footer-inner .footer-title::before {

  content: "";

  position: absolute;

  z-index: 1;

  bottom: 0;

  left: 0;

  height: 2px;

  width: 10px;

  background: var(--color-primary);

  border-radius: 1px;

}

.main-footer-one-area.two .single-footer-inner .footer-title::after {

  content: "";

  position: absolute;

  z-index: 1;

  bottom: 0;

  left: 17px;

  height: 2px;

  width: 50px;

  background: var(--color-primary);

  border-radius: 1px;

}

.main-footer-one-area.two .contactus-link-wrapper .single .text {

  margin-bottom: 4px;

}

.main-footer-one-area.two .contactus-link-wrapper .single .phone p {

  color: var(--color-white);

}

.main-footer-one-area.two .newsletter-area .form .single-input-wrapper input {

  border-radius: 3px;

}

.main-footer-one-area.three .footer-title {

  position: relative;

  z-index: 1;

  padding-bottom: 10px;

}

.main-footer-one-area.three .footer-title img {

  position: absolute;

  z-index: 1;

  left: 0;

  bottom: 0;

}

.main-footer-one-area.four .footer-title {

  position: relative;

  z-index: 1;

  padding-bottom: 10px;

}

.main-footer-one-area.four .footer-title img {

  position: absolute;

  z-index: 1;

  left: 0;

  bottom: 0;

}

.main-footer-one-area.four .contactus-link-wrapper .single {

  margin-bottom: 20px;

}

.main-footer-one-area.four .contactus-link-wrapper .single .text {

  margin-bottom: 5px;

}

.main-footer-one-area.four .contactus-link-wrapper .single .phone p, .main-footer-one-area.four .contactus-link-wrapper .single .phone a {

  color: var(--color-white);

}

.main-footer-one-area.five {

  flex-direction: column;

  gap: 30px;

  align-items: center;

}

.main-footer-one-area.five .title {

  color: var(--color-white);

  font-size: 34px;

  line-height: 1.4;

  text-align: center;

  max-width: 600px;

  font-weight: 500;

  margin-bottom: 0;

}

.main-footer-one-area.five form {

  display: flex;

  gap: 6px;

  max-width: 500px;

  margin: auto;

  width: 100%;

}

.main-footer-one-area.five form .input-wrapper {

  flex-basis: 72%;

  position: relative;

  z-index: 1;

}

.main-footer-one-area.five form .input-wrapper i {

  position: absolute;

  left: 15px;

  top: 50%;

  transform: translateY(-50%);

}

.main-footer-one-area.five form input {

  border: 1px solid rgba(255, 255, 255, 0.24);

  border-radius: 4px;

  padding: 0 20px 0 35px;

  color: var(--color-white);

  width: 100%;

  height: 50px;

  display: flex;

  align-items: center;

}

.main-footer-one-area.five form input:focus {

  border: 1px solid var(--color-primary-2);

}

.main-footer-one-area.five form input::placeholder {

  color: var(--color-body) !important;

}

.main-footer-one-area.five form button {

  border: none;

  font-family: var(--font-primary);

  font-weight: 600;

  min-width: unset;

  flex-basis: 38%;

}

.main-footer-one-area.five form button:hover {

  color: var(--color-heading-1);

}

.main-footer-one-area.five form button::after {

  background: var(--color-white);

}

.main-footer-one-area.five .footer-nav {

  display: flex;

  align-items: center;

  justify-items: center;

  gap: 40px;

  margin-top: 25px;

}

.main-footer-one-area.five .footer-nav li a {

  color: rgba(255, 255, 255, 0.7);

  font-family: var(--font-primary);

  font-weight: 600;

  transition: var(--transition);

}

.main-footer-one-area.five .footer-nav li a:hover {

  color: var(--color-primary-2);

}

.main-footer-one-area.six .footer-title {

  position: relative;

  z-index: 1;

  padding-bottom: 10px;

}

.main-footer-one-area.six .footer-title img {

  position: absolute;

  z-index: 1;

  left: 0;

  bottom: 0;

}

.main-footer-one-area.six .single-footer-inner.company {

  width: 11%;

}

.main-footer-one-area.six .single-footer-inner.contact {

  width: 18%;

}

.main-footer-one-area.six .single-footer-inner.service {

  width: 16%;

}

.main-footer-one-area.six .single-footer-inner.newsletter {

  width: 25%;

}

.main-footer-one-area.six .single-footer-inner.newsletter .body.five {

  max-width: 290px;

}

@media only screen and (max-width: 767px) {

  .main-footer-one-area.six .single-footer-inner.newsletter .body.five {

    max-width: 100%;

  }

}

.main-footer-one-area.six .single-footer-inner.newsletter .form .single-input-wrapper button {

  color: var(--color-white);

}

.main-footer-one-area.six .single-footer-inner.logo-area {

  width: 30%;

  padding: 30px;

  border-radius: 6px;

  background: rgba(255, 255, 255, 0.02);

  border: 1px solid rgba(228, 228, 228, 0.05);

}

.main-footer-one-area.six .single-footer-inner.logo-area .body.one p.desc {

  margin-bottom: 30px;

}



.footer-cta-area {

  padding: 65px 50px 70px 50px;

  border-radius: 8px;

  position: relative;

  z-index: 1;

  overflow: hidden;

  margin-top: -320px;

  background-image: url(../images/footer/03.webp);

  background-repeat: no-repeat;

  background-position: center;

  background-size: cover;

}

@media only screen and (max-width: 991px) {

  .footer-cta-area {

    padding: 45px 35px 45px !important;

  }

}

@media only screen and (max-width: 576px) {

  .footer-cta-area {

    margin: -15px;

    margin-top: -320px;

  }

}

.footer-cta-area.cta-one {

  background: var(--color-primary);

  background-size: cover;

  background-position: center;

  background-repeat: no-repeat;

}

.footer-cta-area.cta-two {

  background-color: var(--color-primary-2);

  background-size: cover;

  background-position: center;

  background-repeat: no-repeat;

}

.footer-cta-area .cta-area-inner {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.footer-cta-area .cta-area-inner .cta-title {

  font-size: 44px;

  line-height: 1.4;

  color: var(--color-white);

  font-weight: 700;

  margin-bottom: 0;

}

@media only screen and (max-width: 767px) {

  .footer-cta-area .cta-area-inner .cta-title {

    font-size: 26px;

  }

}

.footer-cta-area .cta-image-area {

  position: absolute;

  z-index: -1;

  bottom: -10px;

  right: 25%;

}

@media (max-width: 768px) {

  .footer-cta-area .cta-image-area {

    display: none;

  }

}

.footer-cta-area .cta-image-area img:nth-child(2) {

  position: absolute;

  bottom: 0;

  left: -1%;

  z-index: -1;

}

.footer-cta-area .cta-image-area img:nth-child(3) {

  position: absolute;

  bottom: -18px;

  left: -12%;

  z-index: -1;

}

.footer-cta-area .cta-image-area img:nth-child(4) {

  position: absolute;

  bottom: 0;

  right: -24%;

  z-index: -1;

}

.footer-cta-area .shape-area img {

  position: absolute;

  z-index: -1;

}

.footer-cta-area .shape-area img:nth-child(1) {

  top: 50%;

  transform: translateY(-50%);

  left: -60px;

}

.footer-cta-area .shape-area img:nth-child(2) {

  bottom: -45%;

  right: -90px;

}



.copyright-area-one {

  padding: 7px 0;

    background-color: #011432;

  text-align: center;

  border-top: 1px solid rgba(228, 228, 228, 0.06);

  --color-body: #7e7e7e;

}

.copyright-area-one p {

  margin-bottom: 0;

  font-weight: 400;

  font-size: 16px;

  line-height: 24px;

  color: var(--color-body);

}

.copyright-area-one p a {

  color: var(--color-primary);

}

.copyright-area-one .copyright-links {

  display: flex;

  align-items: center;

  justify-content: end;

}

.copyright-area-one .copyright-links li {

  padding: 0 10px;

  position: relative;

  z-index: 1;

}

.copyright-area-one .copyright-links li::after {

  content: "";

  position: absolute;

  z-index: 1;

  right: 0;

  top: 50%;

  transform: translateY(-50%);

  width: 1px;

  height: 21px;

  background: rgba(43, 48, 57, 0.3098039216);

}

.copyright-area-one .copyright-links li:last-child {

  padding-right: 0;

}

.copyright-area-one .copyright-links li:last-child::after {

  display: none;

}

.copyright-area-one .copyright-links li a {

  color: rgba(255, 255, 255, 0.7);

  transition: var(--transition);

  font-size: 16px;

  font-weight: 400;

}

.copyright-area-one .copyright-links li a:hover {

  color: var(--color-primary);

}



.copyright-area-one.cg p a {

  color: rgba(255, 255, 255, 0.7);

}

.copyright-area-one.cg .copyright-links li a:hover {

  color: var(--color-primary-2);

}



.copyright-area-three {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 30px 0;

  border-top: 1px solid #222222;

}

@media (max-width: 768px) {

  .copyright-area-three {

    display: block;

    text-align: center;

  }

}

@media (max-width: 768px) {

  .copyright-area-three .menu-area-copyright {

    margin-bottom: 10px;

  }

}

.copyright-area-three .menu-area-copyright ul {

  padding: 0;

  margin: 0;

  display: flex;

  align-items: center;

  list-style: none;

}

@media (max-width: 768px) {

  .copyright-area-three .menu-area-copyright ul {

    justify-content: center;

  }

}

.copyright-area-three .menu-area-copyright ul li {

  margin-right: 15px;

  margin-top: 0;

  margin-bottom: 0;

  margin-right: 20px;

  padding: 0;

  color: #fff;

}

@media (max-width: 500px) {

  .copyright-area-three .menu-area-copyright ul li {

    margin-right: 10px;

  }

}

.copyright-area-three .menu-area-copyright ul li a {

  transition: 0.3s;

  text-transform: uppercase;

  font-family: var(--font-primary);

}

.copyright-area-three .condition ul {

  padding: 0;

  margin: 0;

  display: flex;

  align-items: center;

  list-style: none;

}

@media (max-width: 768px) {

  .copyright-area-three .condition ul {

    justify-content: center;

  }

}

.copyright-area-three .condition ul li {

  margin-left: 20px;

  margin-top: 0;

  margin-bottom: 0;

  color: white;

}

@media (max-width: 768px) {

  .copyright-area-three .condition ul li {

    margin-left: 0;

    margin-right: 20px;

  }

}

.copyright-area-three .condition ul li a {

  transition: 0.3s;

  font-weight: 400;

  font-size: 14px;

  line-height: 21px;

  font-family: var(--font-primary);

}

@media (max-width: 768px) {

  .copyright-area-three .condition ul li a {

    font-size: 16px;

  }

}



.p--120 {

  padding: 120px;

}



.left-footer-wrapper-3 {

  border-right: 1px solid #262626;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .left-footer-wrapper-3 {

    border: none;

  }

}

@media only screen and (max-width: 767px) {

  .left-footer-wrapper-3 {

    border: none;

  }

}

@media only screen and (max-width: 576px) {

  .left-footer-wrapper-3 {

    padding-top: 80px;

  }

}

.left-footer-wrapper-3 .title {

  font-weight: 400;

  font-size: 48px;

  line-height: 58px;

  color: #fff;

  margin-bottom: 50px;

}

@media (max-width: 450px) {

  .left-footer-wrapper-3 .title {

    font-size: 30px;

    line-height: 40px;

  }

}

.left-footer-wrapper-3 .button-group-footer {

  display: flex;

  align-items: center;

  gap: 20px;

}

@media (max-width: 400px) {

  .left-footer-wrapper-3 .tmp-btn {

    padding: 20px;

  }

}



.right-footer-wrapper-3 {

  display: flex;

  align-items: flex-start;

  flex-wrap: wrap;

  gap: 50px;

}

.right-footer-wrapper-3 .single-information .title {

  color: white;

  font-weight: 600;

}

.right-footer-wrapper-3 .single-information a {

  font-weight: 600;

  font-size: 16px;

  line-height: 26px;

  color: #fff;

  transition: 0.3s;

  font-family: var(--font-primary);

}

.right-footer-wrapper-3 .single-information a:hover {

  color: var(--color-primary);

}

.right-footer-wrapper-3 .single-information a.mail {

  display: block;

  color: #7E7E7E;

  font-weight: 600;

  font-size: 16px;

  line-height: 24px;

  margin-bottom: 13px;

  transition: 0.3s;

}

.right-footer-wrapper-3 .single-information a.mail:hover {

  color: var(--color-primary);

}

.right-footer-wrapper-3 .single-information a.number {

  font-weight: 600;

  font-size: 24px;

  line-height: 37px;

  color: #FFFFFF;

}

.right-footer-wrapper-3 .single-information a.number:hover {

  color: var(--color-primary);

}

@media (max-width: 1400px) and (min-width: 991px) {

  .right-footer-wrapper-3 .single-information a.number {

    font-size: 18px;

  }

}

@media (max-width: 576px) {

  .right-footer-wrapper-3 .single-information a.number {

    font-size: 18px;

  }

}



.tmp-footer-two {

  background: #171717;

}



.menu-row-wrapper {

  border-bottom: 1px solid #252222;

  border-top: 1px solid #252222;

}



.copyright-footer-two {

  text-align: center;

  padding: 38px 0;

}

.copyright-footer-two p.disc {

  color: #696969;

  margin-bottom: 0;

}



.main-footer-wrapper-two {

  display: flex;

  align-items: flex-start;

  justify-content: space-between;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .main-footer-wrapper-two {

    flex-direction: column;

    gap: 20px;

  }

}

@media only screen and (max-width: 767px) {

  .main-footer-wrapper-two {

    flex-direction: column;

    gap: 20px;

  }

}

.main-footer-wrapper-two .single-footer-wized-two.logo-area {

  flex-basis: 25%;

}

.main-footer-wrapper-two .single-footer-wized-two.logo-area a.logo img {

  max-width: 150px;

}

.main-footer-wrapper-two .single-footer-wized-two.pages {

  flex-basis: 20%;

}

.main-footer-wrapper-two .single-footer-wized-two.user-number {

  flex-basis: 25%;

}

.main-footer-wrapper-two .single-footer-wized-two.newsletter {

  flex-basis: 30%;

}

.main-footer-wrapper-two .footer-header-two.pages .title {

  color: #FFFFFF;

  font-weight: 700;

  font-size: 18px;

  line-height: 27px;

  text-transform: uppercase;

}

.main-footer-wrapper-two .footer-header-two.pages .pages ul {

  padding-left: 0;

  margin: 0;

  list-style: none;

}

.main-footer-wrapper-two .footer-header-two.pages .pages ul li {

  margin: 0;

  margin-bottom: 10px;

}



.single-footer-wized-two.logo-area a img {

  margin-bottom: 30px;

}

.single-footer-wized-two.logo-area .disc-f {

  font-weight: 400;

  font-size: 16px;

  line-height: 24px;

  width: 90%;

  color: #77787A;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .single-footer-wized-two.logo-area .disc-f {

    width: 51%;

  }

}

@media only screen and (max-width: 767px) {

  .single-footer-wized-two.logo-area .disc-f {

    width: 61%;

  }

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .single-footer-wized-two.logo-area .disc-f {

    width: 80%;

  }

}

@media only screen and (max-width: 576px) {

  .single-footer-wized-two.logo-area .disc-f {

    width: 74%;

  }

}

.single-footer-wized-two.pages .title {

  font-weight: 700;

  font-size: 18px;

  line-height: 27px;

  color: #FFFFFF;

}

.single-footer-wized-two.pages ul li a {

  display: flex;

  align-items: center;

  transition: 0.3s;

  color: #77787A;

}

.single-footer-wized-two.pages ul li a i {

  margin-right: 10px;

  font-weight: 900;

  transition: 0.3s;

  color: #77787A;

}

.single-footer-wized-two.pages ul li a:hover {

  color: var(--color-primary);

}

.single-footer-wized-two.pages ul li a:hover i {

  color: var(--color-primary);

}

.single-footer-wized-two.user-number .user-number-wrapper {

  width: 90%;

  margin: auto;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .single-footer-wized-two.user-number .user-number-wrapper {

    margin-left: 0;

  }

}

@media only screen and (max-width: 767px) {

  .single-footer-wized-two.user-number .user-number-wrapper {

    margin-left: 0;

  }

}

.single-footer-wized-two.user-number .single-number {

  margin-bottom: 22px;

}

.single-footer-wized-two.user-number .single-number .title {

  font-weight: 700;

  font-size: 13px;

  line-height: 14px;

  text-transform: uppercase;

  color: #fff;

  font-family: var(--font-secondary);

  margin-bottom: 15px;

}

.single-footer-wized-two.user-number .single-number .number {

  display: flex;

  align-items: flex-start;

  gap: 10px;

}

.single-footer-wized-two.user-number .single-number .number a {

  transition: 0.3s;

}

.single-footer-wized-two.user-number .single-number .number i {

  background: var(--color-primary);

  width: 25px !important;

  height: 25px;

  display: flex;

  align-items: center;

  justify-content: center;

  color: #fff;

  width: max-content;

  font-size: 13px;

  line-height: 21px;

  padding: 12px;

}

.single-footer-wized-two.user-number .single-number .number a.mt-dec {

  margin-top: -6px;

}

.single-footer-wized-two.newsletter .footer-header-two {

  width: 90%;

  margin: auto;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .single-footer-wized-two.newsletter .footer-header-two {

    margin-left: 0;

  }

}

@media only screen and (max-width: 767px) {

  .single-footer-wized-two.newsletter .footer-header-two {

    margin-left: 0;

  }

}

.single-footer-wized-two.newsletter .title {

  color: #FFFFFF;

  font-weight: 700;

  font-size: 18px;

  line-height: 27px;

  text-transform: uppercase;

}

.single-footer-wized-two.newsletter form input {

  background: #171717;

  border: 1px solid #2F3336;

  height: 50px;

  margin-bottom: 15px;

}

.single-footer-wized-two.newsletter form button {

  width: 100%;

  max-width: 100%;

}



.menu-wrapper-footer-row {

  display: flex;

  align-items: center;

  justify-content: space-between;

  flex-wrap: wrap;

}

@media (max-width: 991px) {

  .menu-wrapper-footer-row {

    display: none;

  }

}

.menu-wrapper-footer-row .single-menu:first-child a {

  border-left: 1px solid #252222;

  min-width: max-content;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .menu-wrapper-footer-row .single-menu:first-child a {

    border: none;

  }

}

@media only screen and (max-width: 767px) {

  .menu-wrapper-footer-row .single-menu:first-child a {

    border: none;

  }

}

.menu-wrapper-footer-row .single-menu a {

  padding: 24px 68px 24px 46px;

  display: block;

  border-right: 1px solid #252222;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .menu-wrapper-footer-row .single-menu a {

    padding: 24px 55px 24px 46px;

  }

}

@media only screen and (max-width: 1199px) {

  .menu-wrapper-footer-row .single-menu a {

    padding: 18px 47px 18px 6px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .menu-wrapper-footer-row .single-menu a {

    border: none;

  }

}

@media only screen and (max-width: 767px) {

  .menu-wrapper-footer-row .single-menu a {

    border: none;

  }

}



.tmp-footer-area-start.fooetr-bg-3 a.tmp-btn {

  font-size: 14px;

  font-weight: 600;

}



#anywhere-home.bgshow {

  opacity: 100%;

  visibility: visible;

  pointer-events: visible;

  z-index: 99;

  top: 0;

  background: rgba(0, 0, 0, 0.8);

  backdrop-filter: blur(15px);

  background: rgba(0, 0, 0, 0.8);

  backdrop-filter: blur(15px);

}



#anywhere-home {

  cursor: url(../images/banner/shape/close.png), auto;

  background: #0e1013;

  position: fixed;

  width: 100%;

  height: 100%;

  opacity: 0;

  visibility: hidden;

  transition: opacity 500ms ease-in-out;

  pointer-events: none;

  z-index: 50;

}



.search-input-area {

  transition: all 500ms ease;

  visibility: hidden;

  transform: translateY(-100%);

  opacity: 0;

  position: fixed;

  top: 0;

  left: 0;

  width: 100%;

  padding: 57px 0;

  background: white;

  box-shadow: 1px 1px 50px rgba(0, 0, 0, 0.46);

  z-index: 9999;

  display: flex;

  justify-content: center;

  align-items: center;

}

@media only screen and (max-width: 576px) {

  .search-input-area {

    padding: 15px 0;

  }

}



.search-input-area.show {

  visibility: visible;

  transform: inherit;

  opacity: 1;

}



.search-input-area .search-close-icon {

  cursor: pointer;

  position: absolute;

  right: 38px;

  top: 22px;

}

@media only screen and (max-width: 576px) {

  .search-input-area .search-close-icon {

    right: 14px;

    top: 9px;

  }

}



.search-input-area .search-close-icon i {

  position: relative;

  z-index: 1;

  color: var(--color-primary);

  transition: 0.3s;

  font-size: 18px;

}

.search-input-area .search-close-icon i:hover {

  color: #ffffff;

}

.search-input-area .search-close-icon i:hover::after {

  background: var(--color-primary);

}

.search-input-area .search-close-icon i::after {

  position: absolute;

  height: 45px;

  width: 45px;

  content: "";

  border-radius: 5px;

  background: #fff8f3;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  z-index: -1;

  transition: 0.3s;

}

@media only screen and (max-width: 576px) {

  .search-input-area .search-close-icon i::after {

    height: 31px;

    width: 28px;

  }

}



.search-input-area .search-input-inner {

  display: flex;

  align-items: center;

  position: relative;

}

.search-input-area .search-input-inner .input-div {

  width: 80%;

  display: flex;

  align-items: center;

  margin: auto;

}

.search-input-area .search-input-inner .input-div input {

  background: #F7F7F7;

  border-radius: 5px;

  height: 55px;

}

.search-input-area .search-input-inner .input-div button {

  max-width: max-content;

  padding: 19px;

  background: var(--color-primary);

  display: flex;

  color: #fff;

  align-items: center;

  justify-content: center;

  display: block;

  margin-left: -9px;

  border-radius: 0 5px 5px 0;

}



.footer-8 .single-footer-wized-two.logo-area .title {

  color: #FFFFFF;

  font-weight: 700;

  font-size: 18px;

  line-height: 27px;

  text-transform: uppercase;

}

.footer-8 .single-fill-footer.info {

  display: flex;

  align-items: center;

}

.footer-8 .single-fill-footer.info .icon i {

  height: 50px;

  width: 50px;

  background: #2B2B2B;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

}

.footer-8 .single-fill-footer.info .info {

  margin-left: 15px;

}

.footer-8 .single-fill-footer.info .info span {

  display: block;

}

.footer-8 .single-fill-footer.info .info a {

  font-size: 20px;

  line-height: 24px;

  color: #fff;

}

.footer-8 .single-fill-footer.info .info a:hover {

  color: var(--color-primary);

}

.footer-8 .main-ftop-wrapper .single-fill-footer {

  border: 1px solid #26282F;

  padding: 30px 20px;

  height: 100%;

}



.footer-four .main-footer-one-area {

  border-top: none;

}

.footer-four .social-wrapper-one li a {

  background: var(--color-white);

}

.footer-four .main-footer-one-area .single-footer-inner .footer-title,

.footer-four .social-wrapper-one li a i {

  color: var(--color-heading-1);

}

.footer-four .main-footer-one-area .single-footer-inner .use-full-link-wrapper .single,

.footer-four .main-footer-one-area .contactus-link-wrapper .single p,

.footer-four .main-footer-one-area .contactus-link-wrapper .single a,

.footer-four .main-footer-one-area .newsletter-area .desc,

.footer-four .main-footer-one-area .body.one p.desc,

.footer-four .copyright-area-one p,

.footer-four .copyright-area-one .copyright-links li a {

  color: #717580;

}

.footer-four .copyright-area-one {

  border-top: 1px solid var(--color-border);

}

.footer-four .copyright-area-one p a {

  color: var(--color-primary-2);

}

.footer-four .main-footer-one-area .newsletter-area .form .single-input-wrapper input {

  border: 1px solid var(--color-border);

  border-radius: 4px;

}

.footer-four .main-footer-one-area .newsletter-area .form .single-input-wrapper input:focus {

  border-color: var(--color-primary);

}

.footer-four .main-footer-one-area .newsletter-area .form .single-input-wrapper button {

  color: var(--color-white);

  background: var(--color-primary-2);

  border-radius: 4px;

  padding: 0;

  height: 30px;

  min-width: 60px;

  text-align: center;

  line-height: 32px;

}



.footer-five .main-footer-one-area .newsletter-area .form .single-input-wrapper button,

.footer-five .copyright-area-one p a,

.footer-five .copyright-area-one .copyright-links li a:hover {

  color: rgba(255, 255, 255, 0.7);

}

.footer-five .main-footer-one-area .single-footer-inner .footer-title {

  position: relative;

  z-index: 1;

  max-width: max-content;

  padding-bottom: 10px;

}

.footer-five .main-footer-one-area .single-footer-inner .footer-title::after {

  position: absolute;

  content: "";

  z-index: 1;

  bottom: 0;

  left: 0;

  width: 100%;

  height: 2px;

}



.home-five .footer-one {

  margin-top: 0 !important;

  padding-top: 0 !important;

}

.home-five .footer-cta-area {

  display: none;

}



.main-footer-one-area .social-wrapper-1.hover-bg-white li a::after {

  background: var(--color-primary);

  border-color: var(--color-primary);

}

.main-footer-one-area .social-wrapper-1.hover-bg-white li a:hover i {

  color: var(--color-white);

}



.nav-area ul {

  display: flex;

  align-items: center;

  gap: 22px;

  padding: 0;

  margin: 0;

  list-style: none;

}

@media only screen and (min-width: 1200px) and (max-width: 1400px) {

  .nav-area ul {

    gap: 15px;

  }

}

@media screen and (max-width: 1200px) {

  .nav-area ul {

    gap: 15px;

  }

}

.nav-area ul li {

  margin: 0;

  padding: 0;

}

.nav-area ul li a {

  color: var(--color-body);

  font-weight: 600 !important;

}



.has-dropdown.mega-menu > a {

  position: relative;

}



header.header-seven.inner.sticky {

  box-shadow: 0px 7px 18px rgba(24, 16, 16, 0.0509803922);

}



header.header-seven.inner .header-mid-one-wrapper .nav-area .tmp-mega-menu {

  left: 0;

  right: 0;

  margin: auto;

  width: 70%;

}

@media only screen and (min-width: 1600px) and (max-width: 1919px) {

  header.header-seven.inner .header-mid-one-wrapper .nav-area .tmp-mega-menu {

    width: 85%;

  }

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  header.header-seven.inner .header-mid-one-wrapper .nav-area .tmp-mega-menu {

    width: 95%;

  }

}

header.header-seven.inner .header-mid-one-wrapper .nav-area .tmp-mega-menu.width-small-mega {

  left: 0;

  right: auto;

  margin: 0;

  width: max-content;

}

header.header-seven.inner .header-mid-one-wrapper .nav-area .tmp-mega-menu.width-small-mega.mega-card-view {

  left: 0;

  right: 0;

  margin: auto;

  width: 900px;

}



.has-dropdown.mega-menu > a::after {

  position: absolute;

  content: "\f078";

  right: -16px;

  top: 58%;

  transform: translateY(-50%);

  font-weight: 400;

  color: #1C2539;

  font-family: "FontAwesome";

  font-weight: 300;

  font-size: 12px;

  transition: all 0.5s;

}



.has-dropdown.project-a-after > a::after {

  position: absolute;

  content: "\f078";

  right: -1px;

  top: 50%;

  transform: translateY(-50%);

  font-weight: 400;

  color: #1C2539;

  font-family: "FontAwesome";

  font-weight: 300;

  font-size: 14px;

  transition: all 0.5s;

}



.blink-live {

  padding-left: 18px;

  position: relative;

}

.blink-live::after {

  position: absolute;

  content: "";

  left: 0;

  top: 22%;

  transform: translateY(-50%);

  height: 9px;

  width: 9px;

  border-radius: 50%;

  background: var(--color-danger);

  animation: blink 1s linear infinite;

}



@keyframes blink {

  0%, 100% {

    background-color: var(--color-danger);

  }

  50% {

    background-color: #ffffff;

  }

}

.nav-area ul li.main-nav {

  padding: 29px 19px 29px 0;

}



header.header-three .main-nav > a {

  color: var(--color-white) !important;

}



header.header-three .main-nav.menu-item-open > a {

  color: var(--color-primary) !important;

}



header.header-three .has-dropdown.mega-menu > a::after,

header.header-three .has-dropdown.project-a-after > a::after {

  color: var(--color-white);

}



header .main-nav > a {

  color: #1C2539 !important;

}



header.header-three .nav-area ul li.main-nav:hover > a,

header.header-three .has-dropdown.mega-menu:hover > a::after,

header.header-three .has-dropdown.project-a-after:hover > a::after,

header.header-four .nav-area ul li.main-nav:hover > a,

header.header-four .has-dropdown.mega-menu:hover > a::after,

header.header-four .has-dropdown.project-a-after:hover > a::after,

header.header-six .nav-area ul li.main-nav:hover > a,

header.header-six .has-dropdown.mega-menu:hover > a::after,

header.header-six .has-dropdown.project-a-after:hover > a::after,

header.header-seven .nav-area ul li.main-nav:hover > a,

header.header-seven .has-dropdown.mega-menu:hover > a::after,

header.header-seven .has-dropdown.project-a-after:hover > a::after {

  color: var(--color-primary-2) !important;

}



header.header-seven .header-mid-one-wrapper .nav-area {

  margin-left: 0px;

}

@media only screen and (max-width: 1199px) {

  header.header-seven .header-mid-one-wrapper .nav-area {

    display: none;

  }

}



.mega-menu-item.with-list li a {

  position: relative;

}

.mega-menu-item.with-list li a span {

  padding: 3px 9px;

  border-radius: 33px;

  background: var(--color-sky);

  color: #fff;

  line-height: 1;

  font-size: 14px;

  transition: 0.3s;

  animation: invZoomInOutAnim 0.5s linear infinite;

}



li.has-dropdown {

  position: relative;

}

li.has-dropdown .submenu {

  min-width: 230px;

  height: auto;

  position: absolute;

  top: 100%;

  left: 0;

  z-index: 90;

  opacity: 0;

  visibility: hidden;

  text-align: left;

  transition: 0.3s;

  border-radius: 0 0 6px 6px;

  background-color: #fff;

  border-left: 0;

  border-bottom: 0;

  border-right: 0;

  display: inline-block;

  box-shadow: 0 36px 35px rgba(0, 0, 0, 0.08);

  padding: 5px 0px;

  transform-origin: 0 0;

  transform: scaleY(0);

}

li.has-dropdown .submenu li {

  margin-right: 0;

  padding: 0;

}

li.has-dropdown .submenu li a {

    padding: 6px 16px !important;

    font-size: 16px;

    transition: all 0.3s;

    border-radius: 4px;

    display: block;

    padding: 12px 45px 12px 15px;

    border-radius: 5px;

    background: #FFFFFF;

    color: var(--color-heading-1);

    transition: all 0.3s;

    text-align: left;

    font-size: 15px;

    font-weight: 500 !important;

    text-transform: capitalize;

}

li.has-dropdown .submenu li a:hover {

  border: none !important;

  gap: 12px;

  border-radius: 0 !important;

  color: #ffffff;
    background: rgb(92 156 234);

}

li.has-dropdown .submenu li.has-third-lev {

  position: relative;

}

li.has-dropdown .submenu li.has-third-lev > a {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

li.has-dropdown .submenu li.has-third-lev > a i {

  font-size: 10px;

}

li.has-dropdown .submenu li.has-third-lev .submenu {

  position: absolute;

  right: 0;

  top: 15px !important;

  left: 100%;

  opacity: 0 !important;

  transition: 0.3s !important;

}

li.has-dropdown .submenu li.has-third-lev:hover .submenu {

  top: 0px !important;

  opacity: 1 !important;

  border-radius: 6px;

}

li.has-dropdown:hover .submenu {

  opacity: 1;

  visibility: visible;

  top: 100%;

  transform: translateY(0);

  transform: scaleY(1);

}



.has-dropdown.mega-menu::after {

  display: none;

}



.tmp-btn.btn-primary.border.bg-transparent {

  color: var(--color-primary);

  border: 1px solid var(--color-primary) !important;

}

.tmp-btn.btn-primary.border.bg-transparent img {

  filter: brightness(0) saturate(100%) invert(46%) sepia(55%) saturate(5974%) hue-rotate(228deg) brightness(98%) contrast(103%);

}

.tmp-btn.btn-primary.border.bg-transparent:hover {

  background: var(--color-primary) !important;

  color: #fff;

}

.tmp-btn.btn-primary.border.bg-transparent:hover img {

  filter: brightness(0) saturate(100%) invert(100%) sepia(10%) saturate(7500%) hue-rotate(241deg) brightness(114%) contrast(108%);

}



header .nav-area ul li.main-nav:hover > a {

  color: var(--color-primary) !important;

}

header .nav-area ul li.main-nav:hover::after {

  color: var(--color-primary) !important;

}



.has-dropdown.mega-menu:hover .tmp-mega-menu {

  transform: scaleY(1);

  top: 100%;

  visibility: visible;

  opacity: 1;

  clip: rect(0px, 100vw, 200vh, -30px);

  transition: clip 0.6s linear, opacity 0.4s linear;

}

.has-dropdown.mega-menu.active .tmp-mega-menu {

  transform: scaleY(1);

  top: 100%;

  visibility: visible;

  opacity: 1;

  clip: rect(0px, 100vw, 200vh, -30px);

  transition: clip 0.6s linear, opacity 0.4s linear;

}



.tmp-mega-menu {

  position: absolute;

  width: 100%;

  top: 100%;

  left: 0;

  z-index: 90;

  opacity: 0;

  visibility: hidden;

  text-align: left;

  transition: all 0.5s;

  border-radius: 0 0 5px 5px !important;

  background-color: #ffffff;

  padding: 0 0;

  visibility: hidden;

  clip: rect(0px, 200vw, 0, 0px);

  opacity: 0;

  transition: opacity 0.4s linear, clip 0.6s linear, visibility 0s 0.4s;

}

.tmp-mega-menu .mega-top-banner-pages {

  background-image: url(../images/banner/menu-page.webp), radial-gradient(100% 100% at 100% 0%, #484C7A 0%, var(--color-primary) 100%);

  background-size: contain;

  background-position: right 30%;

  margin-top: 19px !important;

  margin: -15px;

  width: auto;

  background-repeat: no-repeat;

  display: flex;

  align-items: center;

  padding: 25px;

  position: relative;

  background-size: cover;

  border-radius: 0 0 6px 6px;

  transition: 0.3s;

}

.tmp-mega-menu .mega-top-banner-pages:hover {

  background-position: center center;

}

.tmp-mega-menu .mega-top-banner-pages .content .title {

  margin-bottom: 5px;

  font-size: 24px;

}

.tmp-mega-menu .mega-top-banner-pages * {

  color: #fff;

}

.tmp-mega-menu.width-small-mega {

  width: 600px;

  margin: 0 auto;

  padding: 0;

}

.tmp-mega-menu.width-small-mega.mega-card-view {

  width: 900px;

  left: 0;

  right: 0;

  z-index: 1;

}

.tmp-mega-menu.width-small-mega.mega-card-view.service-width {

  width: 1220px !important;

}

@media only screen and (max-width: 1399px) {

  .tmp-mega-menu.width-small-mega.mega-card-view.service-width {

    width: 1150px !important;

  }

}

.tmp-mega-menu.width-small-mega.mega-card-view.service-width .service-menu-card {

  display: flex;

  align-items: center;

  gap: 25px;

}

.tmp-mega-menu.width-small-mega.mega-card-view.service-width .service-menu-card .icon-nav {

  height: 75px;

  min-width: 75px;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  background: #E9F1FC;

  transition: 0.3s;

  position: relative;

  z-index: 1;

}

.tmp-mega-menu.width-small-mega.mega-card-view.service-width .service-menu-card .icon-nav::after {

  position: absolute;

  content: "";

  left: 50%;

  top: 50%;

  height: 100%;

  width: 100%;

  border-radius: 50%;

  z-index: -1;

  transform: translate(-50%, -50%) scale(0.2);

  background: var(--color-primary);

  transition: 0.3s;

  opacity: 0;

}

.tmp-mega-menu.width-small-mega.mega-card-view.service-width .service-menu-card .icon-nav img {

  background: transparent;

  max-width: 40px;

  padding: 0;

  margin: 0;

}

.tmp-mega-menu.width-small-mega.mega-card-view.service-width .service-menu-card .icon-nav svg {

  background: transparent;

  max-width: 40px;

  padding: 0;

  margin: 0;

}

.tmp-mega-menu.width-small-mega.mega-card-view.service-width .service-menu-card .icon-nav svg path {

  fill: var(--color-primary);

  transition: 0.3s;

}

.tmp-mega-menu.width-small-mega.mega-card-view.service-width .service-menu-card .content .title {

  margin-bottom: 7px;

  font-size: 20px;

}

.tmp-mega-menu.width-small-mega.mega-card-view.service-width .service-menu-card .content p.desc {

  font-weight: 400;

}

.tmp-mega-menu.width-small-mega.mega-card-view.service-width li {

  margin-bottom: 15px;

}

.tmp-mega-menu.width-small-mega.mega-card-view.service-width li:last-child {

  margin-bottom: 0;

}

.tmp-mega-menu.width-small-mega.mega-card-view.service-width li a {

  border: none !important;

  border-radius: 6px !important;

  background: rgb(250, 252, 255) !important;

  color: var(--color-primary);

  padding: 12px 12px !important;

}

.tmp-mega-menu.width-small-mega.mega-card-view.service-width li:hover a {

  border: none !important;

  border-radius: 6px !important;

  background: rgb(250, 252, 255);

  color: var(--color-primary);

}

.tmp-mega-menu.width-small-mega.mega-card-view.service-width li:hover a .service-menu-card .icon-nav::after {

  transform: translate(-50%, -50%) scale(1);

  opacity: 1;

}

.tmp-mega-menu.width-small-mega.mega-card-view.service-width li:hover a .service-menu-card .icon-nav img {

  filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7475%) hue-rotate(250deg) brightness(99%) contrast(98%);

  animation: bounceIn 1.3s ease;

}

.tmp-mega-menu.width-small-mega.mega-card-view.service-width li:hover a .service-menu-card .icon-nav svg path {

  fill: var(--color-white);

}

.tmp-mega-menu.width-small-mega .tmp-short-title {

  font-size: 16px;

  padding-bottom: 14px;

  font-weight: 700;

  text-transform: capitalize;

  letter-spacing: 0.5px;

  margin-bottom: 6px;

  line-height: 1;

  padding-left: 12px;

  color: var(--color-heading-1);

  position: relative;

}

.tmp-mega-menu.width-small-mega .tmp-short-title::after {

  position: absolute;

  left: 12px;

  content: "";

  height: 2px;

  width: 50px;

  background: var(--color-primary);

  bottom: 3px;

}

.tmp-mega-menu.width-small-mega .mega-menu-item {

  gap: 0;

}

.tmp-mega-menu.width-small-mega .mega-menu-item.overflow-y-visiblity {

  max-height: 320px;

  overflow-y: auto;

}

.tmp-mega-menu.width-small-mega .mega-menu-item.overflow-y-visiblity::-webkit-scrollbar {

  width: 8px;

}

.tmp-mega-menu.width-small-mega .mega-menu-item.overflow-y-visiblity::-webkit-scrollbar-track {

  background: #f0f0f0;

  border-radius: 3px;

}

.tmp-mega-menu.width-small-mega .mega-menu-item.overflow-y-visiblity::-webkit-scrollbar-thumb {

  background-color: var(--color-primary);

  border-radius: 3px;

  border: 2px solid #f0f0f0;

}

.tmp-mega-menu.width-small-mega .mega-menu-item.overflow-y-visiblity::-webkit-scrollbar-thumb:hover {

  background-color: var(--color-primary);

}

.tmp-mega-menu.width-small-mega .mega-menu-item li a {

  padding: 8px 12px !important;

  border: none;

  font-size: 14px;

  transition: 0.3s;

}

.tmp-mega-menu.width-small-mega .mega-menu-item li a.active {

  border: none !important;

  gap: 12px;

  border-radius: 0 !important;

  background: rgba(0, 0, 0, 0.04);

  color: var(--color-primary);

}

.tmp-mega-menu.width-small-mega .mega-menu-item li:hover a {

  border: none !important;

  border-radius: 0 !important;

  background: rgba(0, 0, 0, 0.04);

  color: var(--color-primary);

}

.tmp-mega-menu.width-small-mega .service-thumbnail-area {

  display: block;

  border-radius: 6px;

  overflow: hidden;

  position: relative;

  z-index: 1;

}

.tmp-mega-menu.width-small-mega .service-thumbnail-area::after {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  height: 100%;

  width: 100%;

  background: var(--color-primary);

  mix-blend-mode: multiply;

  z-index: 2;

}

.tmp-mega-menu.width-small-mega .service-thumbnail-area .content-area-service-thumb {

  position: absolute;

  left: 30px;

  bottom: 30px;

  z-index: 3;

}

.tmp-mega-menu.width-small-mega .service-thumbnail-area .content-area-service-thumb .title {

  color: var(--color-white);

  font-size: 32px;

}

.tmp-mega-menu.width-small-mega .service-thumbnail-area .content-area-service-thumb a.call-btn {

  color: var(--color-white);

}

.tmp-mega-menu.width-small-mega .service-thumbnail-area .content-area-service-thumb a.call-btn i {

  color: var(--color-white);

  height: 45px;

  width: 45px;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  background: rgba(255, 255, 255, 0.2274509804);

  backdrop-filter: blur(20px);

  font-size: 20px;

}

.tmp-mega-menu.width-small-mega .service-thumbnail-area .content-area-service-thumb a.call-btn span {

  color: var(--color-white);

}

.tmp-mega-menu.width-small-mega .nav-quick-access {

  display: flex;

  flex-wrap: wrap;

  background: #f5f5f5;

  margin: -25px;

  margin-top: 20px;

  padding: 16px 25px;

  justify-content: space-between;

  gap: 0;

}

.tmp-mega-menu.width-small-mega .nav-quick-access li {

  margin-top: 0;

  margin-bottom: 0;

  position: relative;

  flex-basis: calc(50% - 15px);

  padding: 5px;

}

.tmp-mega-menu.width-small-mega .nav-quick-access li a {

  padding-left: 0;

  font-size: 15px;

  display: flex;

  align-items: center;

  gap: 10px;

}

.tmp-mega-menu.width-small-mega .wrapper {

  max-height: 600px;

  overflow-y: scroll !important;

  scrollbar-width: none;

  overflow: hidden;

  padding: 20px 20px;

}

.tmp-mega-menu.with-add {

  padding: 0;

  overflow: hidden;

  border-radius: 0 0 10px 10px;

}

.tmp-mega-menu.with-add .menu-add-top-area {

  padding: 30px 0 25px 0;

  border-bottom: 1px solid #E1E1FF;

  margin-left: 50px;

}

.tmp-mega-menu.with-add .menu-add-top-area .title {

  margin-bottom: 0;

  font-size: 24px;

  color: var(--color-primary);

}

.tmp-mega-menu.with-add .menu-right-add {

  display: flex;

  justify-content: flex-end;

  align-items: end;

  max-width: max-content;

  margin-left: auto;

  position: relative;

  border-radius: 0 0 7px 0;

  overflow: hidden;

}

.tmp-mega-menu.with-add .menu-right-add .absolute-image img {

  position: absolute;

  right: 0;

  bottom: 0;

  width: 100%;

}

.tmp-mega-menu.with-add .menu-right-add .absolute-image .inner-content {

  position: absolute;

  left: 23px;

  bottom: 23px;

}

.tmp-mega-menu.with-add .menu-right-add .absolute-image .inner-content .title {

  color: #fff;

  font-size: 24px;

}

.tmp-mega-menu.with-add .menu-right-add .absolute-image .inner-content .tmp-btn {

  background: #fff;

  color: var(--color-primary);

}

.tmp-mega-menu.with-add .mega-menu-item li a {

  display: flex;

  align-items: center;

  gap: 5px;

  width: 100%;

}

.tmp-mega-menu.with-add .mega-menu-item li a img {

  max-width: 30px;

  height: auto;

  padding: 0;

  background: transparent;

  transition: 0.3s;

  margin-right: 5px;

}

.tmp-mega-menu.with-add .mega-menu-item li a:hover img {

  filter: brightness(0) saturate(100%) invert(97%) sepia(3%) saturate(0%) hue-rotate(288deg) brightness(103%) contrast(100%);

}

.tmp-mega-menu.with-add .mega-menu-item li a.active img {

  filter: brightness(0) saturate(100%) invert(97%) sepia(3%) saturate(0%) hue-rotate(288deg) brightness(103%) contrast(100%);

}

.tmp-mega-menu.with-home-demos {

  background-color: var(--color-heading-1);

}

.tmp-mega-menu.with-home-demos .demos-area-drop-down {

  position: relative;

  z-index: 1;

  overflow: hidden;

  box-shadow: none;

  background: #273041;

  border-radius: 0 0 6px 6px;

}

.tmp-mega-menu.with-home-demos .demos-area-drop-down .wrapper {

  position: relative;

  z-index: 1;

  overflow: hidden;

  box-shadow: 0px 6px 34px rgba(215, 216, 222, 0.41);

}

.tmp-mega-menu.with-home-demos .demos-area-drop-down .mega-menu-item {

  height: 100%;

  padding: 22px 10px;

  background: var(--color-heading-1);

  flex-wrap: wrap;

  max-height: 620px;

  gap: 19px;

  overflow: hidden;

  overflow-y: scroll !important;

  scrollbar-width: none;

  flex-direction: row;

  display: flex;

  align-items: flex-start;

  justify-content: center;

  row-gap: 36px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-mega-menu.with-home-demos .demos-area-drop-down .mega-menu-item {

    gap: 15px;

  }

}

.tmp-mega-menu.with-home-demos .demos-area-drop-down .mega-menu-item li {

  flex-basis: 18.8%;

  border-radius: 2px;

  display: block;

  transition: 0.3s;

  border: none;

  text-align: center;

  position: relative;

}

.tmp-mega-menu.with-home-demos .demos-area-drop-down .mega-menu-item li:hover {

  transform: translateY(-10px);

}

.tmp-mega-menu.with-home-demos .demos-area-drop-down .mega-menu-item li:hover a {

  border: none;

}

.tmp-mega-menu.with-home-demos .demos-area-drop-down .mega-menu-item li a {

  border: none;

  padding: 0 !important;

}

.tmp-mega-menu.with-home-demos .demos-area-drop-down .mega-menu-item li a img {

  padding: 5px;

  max-width: 100%;

  border-radius: 10px;

  background: transparent;

  box-shadow: 0 4.666px 17.498px 2.916px rgba(0, 0, 0, 0.05);

}

.tmp-mega-menu.with-home-demos .demos-area-drop-down .mega-menu-item li a:last-child {

  color: var(--color-white);

  padding: 10px;

  padding-bottom: 0;

  position: absolute;

  bottom: -30px;

  width: 100%;

  margin: 0 auto;

  text-align: center;

  z-index: 1;

  transition: 0.4s;

  justify-content: center;

  letter-spacing: 0px;

  font-size: 14px;

}

.tmp-mega-menu.with-home-demos .demos-area-drop-down .mega-menu-item li a:last-child .btn-icon {

  margin-left: 6px;

  margin-top: 2px;

}

.tmp-mega-menu.with-home-demos .demos-area-drop-down .mega-menu-item li a:last-child .btn-icon i {

  transform: rotate(-45deg);

}

.tmp-mega-menu.with-home-demos .demos-area-drop-down .load-demo-btn-wrap .load-demo-btn {

  padding: 4px 10px;

  background: rgba(255, 255, 255, 0.0784313725);

  border-radius: 2px;

  max-width: max-content;

  margin: auto;

  line-height: 1;

}

.tmp-mega-menu.with-home-demos .demos-area-drop-down .load-demo-btn-wrap span {

  font-size: 14px;

  color: var(--color-white);

  line-height: 1;

}

.tmp-mega-menu.with-home-demos .demos-area-drop-down .load-demo-btn-wrap span svg {

  margin-left: 7px;

  height: 12px;

  width: 12px;

}

.tmp-mega-menu .wrapper {

  box-shadow: 0px 6px 34px rgba(215, 216, 222, 0.41);

}

.tmp-mega-menu .wrapper.inner-page {

  padding: 35px 0 25px 0;

}

.tmp-mega-menu .wrapper.inner-page .inversweb-short-title {

  font-size: 16px;

  padding-bottom: 14px;

  font-weight: 700;

  text-transform: capitalize;

  letter-spacing: 0.5px;

  margin-bottom: 6px;

  line-height: 1;

  padding-left: 12px;

  color: var(--color-heading-1);

  position: relative;

}

.tmp-mega-menu .wrapper.inner-page .inversweb-short-title::after {

  position: absolute;

  left: 12px;

  content: "";

  height: 2px;

  width: 50px;

  border-radius: 2px;

  background: var(--color-primary);

  bottom: 3px;

}



.mega-menu-item {

  padding: 0;

  margin: 0;

  flex-direction: column;

  display: flex;

  align-items: flex-start !important;

}

.mega-menu-item li {

  margin-bottom: 19px;

  margin-top: 0;

  margin-right: 0;

  margin-left: 0;

  width: 100%;

}

.mega-menu-item li:hover a {

  border: 1px solid #E6E5FF;

  border-radius: 4px;

}

.mega-menu-item li a {

  display: flex !important;

  align-items: center;

  padding: 6px 12px !important;

  border: 1px solid transparent;

  width: 100%;

}

.mega-menu-item li a img {

  margin-right: 16px;

  padding: 10px;

  max-width: max-content;

  background: #F0F0FF;

  border-radius: 4px;

}

.mega-menu-item li a .info p {

  margin-bottom: 2px;

  font-weight: 500;

  font-size: 16px;

  line-height: 26px;

  color: #083A5E;

}

.mega-menu-item li a .info span {

  font-weight: 400;

  font-size: 14px;

  line-height: 24px;

  color: #497696;

}



.has-dropdown.mega-menu {

  position: static !important;

}

.has-dropdown.mega-menu.position-relative {

  position: relative !important;

}



.container-full-header .tmp-mega-menu {

  transform: translateX(-50%) scaleY(0);

  left: 50%;

  max-width: 80%;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .container-full-header .tmp-mega-menu {

    max-width: 90%;

  }

}

.container-full-header .has-dropdown.mega-menu:hover .tmp-mega-menu {

  transform: translateX(-50%) scaleY(1);

}



.has-dropdown.mega-menu:hover > a::after,

.has-dropdown.project-a-after:hover > a::after {

  content: "\f077";

  color: var(--color-primary);

}



.appoinment-area-main.contact-page {

  border-radius: 10px;

  background: #F9F8FF;

  border: 1px solid #DDD8F9;

  background-image: none;

}

.appoinment-area-main.contact-page input,

.appoinment-area-main.contact-page textarea,

.appoinment-area-main.contact-page .custom-select {

  color: var(--color-primary) !important;

  border-color: var(--color-primary) !important;

}

.appoinment-area-main.contact-page input span,

.appoinment-area-main.contact-page textarea span,

.appoinment-area-main.contact-page .custom-select span {

  color: var(--color-primary) !important;

}

.appoinment-area-main.contact-page .tmp-btn {

  background: var(--color-primary);

  color: #fff;

}



header.header-three .tmp-mega-menu.service-mega-menu-style {

  width: 75%;

}



.tmp-mega-menu.service-mega-menu-style {

  padding: 30px 30px 0 30px;

  z-index: 1000;

}

.tmp-mega-menu.service-mega-menu-style li {

  margin-bottom: 20px;

}

.tmp-mega-menu.service-mega-menu-style li a {

  border: none;

  width: 100%;

  padding: 18px 25px !important;

  border-radius: 5px;

  background: #f9f9f9;

  display: block;

  transition: 0.3s;

}

.tmp-mega-menu.service-mega-menu-style li a.free-consultation {

  background: var(--color-primary);

}

.tmp-mega-menu.service-mega-menu-style li a.free-consultation .title {

  color: #fff !important;

}

.tmp-mega-menu.service-mega-menu-style li a.free-consultation p.details {

  color: #fff !important;

}

.tmp-mega-menu.service-mega-menu-style li a.free-consultation:hover {

  background: var(--color-primary);

}

.tmp-mega-menu.service-mega-menu-style li a .single-service-menu {

  display: flex;

  align-items: flex-start;

}

.tmp-mega-menu.service-mega-menu-style li a .single-service-menu .icon {

  border-radius: 4px;

  display: flex;

  align-items: center;

  justify-content: center;

  margin-right: 15px;

}

.tmp-mega-menu.service-mega-menu-style li a .single-service-menu .icon img {

  background: none;

  padding: 0;

  max-width: 40px;

  margin: auto;

}

.tmp-mega-menu.service-mega-menu-style li a .single-service-menu .title {

  color: var(--color-heading-1);

  margin-bottom: 11px;

  font-size: 22px;

  line-height: 1.3;

}

.tmp-mega-menu.service-mega-menu-style li a .single-service-menu p.details {

  max-width: 100%;

  font-size: 14px;

  color: var(--color-body);

}

.tmp-mega-menu.service-mega-menu-style li:hover a {

  border: none;

  background: rgba(32, 40, 45, 0.0784313725);

}

.tmp-mega-menu.service-mega-menu-style .menu-thumb {

  height: auto;

}

.tmp-mega-menu.service-mega-menu-style .menu-thumb img {

  height: auto;

  object-fit: cover;

}



header .menu-item-open > a {

  color: var(--color-primary) !important;

}

header .menu-item-open > a::after {

  content: "\f077" !important;

  color: var(--color-primary) !important;

}



.menu-item-open::after {

  color: var(--color-primary) !important;

}



.mega-menu-item.with-list {

  gap: 0;

}

.mega-menu-item.with-list li a {

  border: none !important;

  display: flex;

  align-items: center;

  gap: 8px;

  padding: 12px 12px !important;

  transition: 0.3s;

  line-height: 1;

}

.mega-menu-item.with-list li a i {

  font-size: 12px;

}

.mega-menu-item.with-list li a.active {

  border: none !important;

  border-radius: 0 !important;

  background: rgba(0, 0, 0, 0.04);

  color: var(--color-primary);

}

.mega-menu-item.with-list li:hover a {

  border: none !important;

  border-radius: 0 !important;

  background: rgba(0, 0, 0, 0.04);

  color: var(--color-primary);

}



.sub-dropdown.down {

  position: relative !important;

  display: block !important;

}

.sub-dropdown.down::after {

  position: absolute;

  right: 12px;

  top: 50%;

  transform: translateY(-50%);

  content: "\f054";

  font-family: var(--font-3);

}

.sub-dropdown.down .submenu.third-lvl.base {

  opacity: 0 !important;

  visibility: hidden;

  min-width: 225px !important;

  left: 100% !important;

  top: -25px !important;

  margin: 0;

  border-radius: 0 !important;

  border-radius: 10px !important;

  transition: 0.3s;

  display: block !important;

}

.sub-dropdown.down:hover::after {

  color: var(--color-primary);

}

.sub-dropdown.down:hover .submenu.third-lvl.base {

  opacity: 1 !important;

  top: 0 !important;

  right: 0 !important;

  visibility: visible;

  margin-left: 0 !important;

  min-width: 225px !important;

}



li.has-dropdown .submenu li a.active {

  border: none !important;

  gap: 12px;

  border-radius: 0 !important;

  background: rgba(0, 0, 0, 0.04);

  color: var(--color-primary);

}



.tmp-mega-menu.service-mega-menu-style li a.active {

  background: #fff3f3;

}



.tmp-mega-menu.service-mega-menu-style li a.active.free-consultation {

  background: var(--color-primary);

}



header.header-two .menu-item-open > a {

  color: var(--color-primary) !important;

}



.mega-menu-head-wrapper {

  margin: 0;

  margin-bottom: 10px !important;

  margin-left: 10px !important;

  padding-bottom: 10px !important;

  border-bottom: 1px solid var(--color-primary);

}

.mega-menu-head-wrapper p {

  font-weight: 700;

  color: var(--color-title);

  font-size: 17px;

  display: flex;

  align-items: center;

}

.mega-menu-head-wrapper p i {

  font-size: 24px;

  margin-right: 8px;

  color: var(--color-primary);

  font-weight: 600;

}



.header-three .mega-menu-head-wrapper,

.header-four .mega-menu-head-wrapper,

.header-five .mega-menu-head-wrapper,

.header-six .mega-menu-head-wrapper,

.header-seven .mega-menu-head-wrapper {

  border-bottom: 1px solid var(--color-primary-2);

}

.header-three .mega-menu-head-wrapper p i,

.header-four .mega-menu-head-wrapper p i,

.header-five .mega-menu-head-wrapper p i,

.header-six .mega-menu-head-wrapper p i,

.header-seven .mega-menu-head-wrapper p i {

  color: var(--color-primary-2);

}

.header-three .tmp-mega-menu.service-mega-menu-style li a.free-consultation,

.header-four .tmp-mega-menu.service-mega-menu-style li a.free-consultation,

.header-five .tmp-mega-menu.service-mega-menu-style li a.free-consultation,

.header-six .tmp-mega-menu.service-mega-menu-style li a.free-consultation,

.header-seven .tmp-mega-menu.service-mega-menu-style li a.free-consultation {

  background: var(--color-primary-2) !important;

}



ul.mega-menu-item.parent-nav {

  gap: 0 !important;

}



.header-transparent.header--sticky .nav-area ul li.main-nav:hover > a {

  transition: 0.3s;

  color: #fff !important;

}



.header-three .nav-area ul li.main-nav {

  padding: 17px 20px 17px 0;

  cursor: pointer;

}



.invers-badge-card {

  background-color: transparent;

  background: transparent;

  padding: 4px 10px;

  border-radius: 100px;

  color: var(--color-white);

  font-size: 12px;

  line-height: 1;

  font-weight: 600;

  display: inline-block;

  position: relative;

  z-index: 2;

  margin-left: 7px;

  letter-spacing: 0.5px;

  box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;

  animation: invZoomInOutAnim 0.5s linear infinite;

  animation-direction: alternate;

  animation-timing-function: ease-in-out;

  transition: all 0.3s ease-in-out 0s;

}

.invers-badge-card::before {

  background: var(--color-primary);

  content: "";

  width: 100%;

  height: 100%;

  left: 0;

  top: 0;

  position: absolute;

  z-index: -1;

  border-radius: 100px;

  opacity: 1;

  background-size: 400% 100%;

}

.invers-badge-card.hot::before {

  background: var(--color-danger);

}



.nav-category-item {

  position: relative;

  z-index: 1;

  padding: 25px 20px;

}

.nav-category-item.main-feature {

  padding: 25px 20px;

}

.nav-category-item.main-feature * {

  color: #fff;

}

.nav-category-item .image img {

  position: absolute;

  z-index: -1;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  border-radius: 4px;

}

.nav-category-item a {

  display: flex;

  align-items: center;

}

.nav-category-item a span {

  font-size: 14px;

  font-weight: 600;

}

.nav-category-item a i {

  font-size: 12px;

  color: var(--color-body);

  padding-left: 4px;

  transition: 0.4s;

}

.nav-category-item a.feature-a-nav {

  flex-direction: column;

  align-items: flex-start;

}

.nav-category-item a .inner .title-nav span {

  font-size: 14px;

  font-weight: 600;

}

.nav-category-item a .inner .title-nav i {

  font-size: 12px;

  color: var(--color-body);

  padding-left: 4px;

  transition: 0.4s;

}

.nav-category-item:hover a i {

  padding-left: 10px;

}



@keyframes invZoomInOutAnim {

  0% {

    transform: scale(1);

  }

  100% {

    transform: scale(0.9);

  }

}

@media (max-width: 1900px) {

  .banner-two-main-wrapper .banner-hero-image {

    right: -10%;

  }

}

@media (max-width: 1740px) {

  .tmp-banner-slider-area2 .banner-slider-button {

    right: 5%;

  }

  .tmp-service-area.area-3 .slider-inner .slider-button {

    left: 5%;

  }

}

@media (max-width: 1600px) {

  .service-wrapper {

    padding: 30px 25px;

  }

  .service-wrapper .heading-title {

    font-size: 18px;

  }

  .banner-two-main-wrapper .banner-hero-image {

    width: 75%;

  }

  .banner-two-main-wrapper {

    height: auto;

  }

  .tmp-banner-slider-area .banner-one-wrapper {

    padding-bottom: 180px;

  }

  .banner-two-main-wrapper .watermark {

    font-size: 175px;

  }

  .working-process-wrapper3 a .left-area {

    flex-basis: 40%;

  }

  .about-image-area2 .floating-img,

  .about-image-area2 .floating-shape {

    right: -10%;

  }

  .working-process-image-wrapper {

    max-width: 85%;

  }

}

@media (max-width: 1600px) and (min-width: 1200px) {

  .tmp-service-area .section-title-area .Section-title {

    font-size: 42px;

  }

}

@media (max-width: 1500px) {

  .about-image-area .floating-area img {

    width: 90%;

  }

  .about-image-area .about-card {

    gap: 40px;

  }

}

@media (max-width: 1440px) {

  .main-footer-one-area .single-footer-inner.popular-post {

    width: 30%;

  }

  .main-footer-one-area .single-footer-inner.popular-post .post-wrapper {

    max-width: 160px;

  }

}

@media (max-width: 1400px) {

  .banner-two-main-wrapper .banner-one-wrapper .title-banner {

    font-size: 48px;

    line-height: 66px;

  }

  .tmp-banner-slider-area .banner-one-wrapper {

    padding-top: 180px !important;

  }

  .banner-two-main-wrapper .watermark {

    font-size: 150px;

  }

  .cta-wrapper {

    padding: 70px 50px;

  }

  .working-process-wrapper2 .icon {

    right: -25px;

  }

  .header-three .header-top {

    padding-right: 40px;

  }

  .banner-three-wrapper .title-banner {

    font-size: 48px;

    line-height: 65px;

  }

  .tmp-banner-slider-area2 .banner-hero {

    right: -80px;

  }

  .tmp-banner-slider-area2 .banner-shape img:nth-child(1) {

    bottom: -130px;

  }

  .working-process-wrapper3 a .left-area {

    flex-basis: 47%;

  }

  .tmp-banner-slider-area3 .slider-inner .swiper-pagination {

    left: 50%;

    transform: translateX(-50%);

  }

  .tmp-banner-main-area.area-5 .banner-two-wrapper .title-banner {

    font-size: 54px;

    line-height: 1.3;

  }

  .tmp-banner-main-area.area-5 .right-side-image .float-img.one {

    top: 0px;

  }

  .tmp-banner-main-area.area-5 .right-side-image .float-img.two {

    left: -40px;

  }

  .tmp-banner-main-area.area-5 .right-side-image .float-img.three {

    right: -30px;

  }

  .banner-six-wrapper .title-banner {

    font-size: 50px;

    line-height: 60px;

  }

  .pricing-wrapper3 .pricing-header .left h3 {

    font-size: 30px;

  }

  .pricing-wrapper3 .pricing-header .icon {

    width: 80px;

  }

  .header-mid-one-wrapper .header-right {

    flex-basis: 30%;

  }

  header.header-four .header-mid-one-wrapper .header-right {

    gap: 20px;

  }

  .main-footer-one-area .single-footer-inner.company {

    width: 14%;

  }

  .main-footer-one-area .single-footer-inner.newsletter {

    width: 20%;

  }

  .main-footer-one-area .single-footer-inner.popular-post {

    width: 32%;

  }

  .testimonial-wrapper2 {

    padding: 40px 60px;

  }

}

@media (max-width: 1400px) and (min-width: 1200px) {

  .service-wrapper {

    padding: 30px 10px 30px 20px;

  }

  .service-wrapper .heading-title {

    font-size: 16px;

  }

  .working-process-wrapper .desc {

    font-size: 14px;

  }

  .working-process-wrapper .heading-title {

    font-size: 16px;

  }

  .working-process-wrapper .number {

    font-size: 64px;

  }

  .working-process-image {

    width: 600px;

    margin-left: auto;

    margin-right: 0;

  }

  .why-choose-us-content-area .section-title-area .section-title {

    font-size: 46px;

  }

  .blog-card-style-one {

    gap: 20px;

    padding: 20px;

  }

  .mid-image-area ul li {

    flex-basis: 47.6%;

  }

  .mid-image-area ul li .counter-area .counter-wrapper .disc {

    font-size: 16px;

  }

  .why-choose-wrapper-list li .text p {

    font-size: 14px;

  }

  .why-choose-wrapper-list li {

    padding: 27px 20px;

  }

  .project-single .content .title {

    font-size: 22px;

  }

  .project-single:hover .content {

    bottom: 10px;

  }

  .header-three .header-top .logo-area {

    max-width: 275px;

  }

  .why-choose-wrapper-list2 li .text h4 {

    font-size: 28px;

  }

  .section-title-area-4 .section-title {

    font-size: 44px;

  }

  .working-process-wrapper5 .content {

    bottom: -35%;

  }

  .working-process-wrapper5:hover .content {

    bottom: 15px;

  }

  header.header-five .header-mid-one-wrapper .header-right,

  header.header-seven .header-mid-one-wrapper .header-right {

    flex-basis: 30%;

  }

  .about-wrapper {

    padding: 40px 50px;

  }

  .product-wrapper .content {

    padding: 30px 25px 25px;

  }

  .product-wrapper .content h6 {

    font-size: 18px;

  }

  .countdown .countDown {

    gap: 8px;

  }

  .blog-card-style-shop .content-area .text h5 {

    font-size: 22px;

  }

  .banner-seven-main-wrapper .banner-three-wrapper .title-banner {

    font-size: 46px;

    line-height: 60px;

  }

  .about-award-area .award-inner .title {

    font-size: 16px;

  }

  .team-wrapper5 .image-area {

    height: 295px;

  }

  .tmp-about-area.area-4 .left-side-content .section-title-area-4 .section-title {

    font-size: 40px;

  }

  .about-image-area .floating-area {

    left: 40px;

  }

  .about-image-area .floating-area img {

    width: 70%;

  }

  .team-wrapper6 .social-wrapper {

    bottom: 30%;

  }

  .tmp-job-area .image-area .circle-content-area {

    width: 285px;

    height: 285px;

  }

  .tmp-job-area .image-area .circle-content-area h5 {

    font-size: 18px;

  }

  .branch-wrapper .image-area {

    flex-basis: 40%;

  }

  .branch-wrapper .content {

    flex-basis: 60%;

  }

}

@media (max-width: 1440px) and (min-width: 1200px) {

  .single-tab-content-one {

    padding: 35px;

  }

  .tmp-service-area .section-title-area .Section-title {

    font-size: 36px;

  }

  .tmp-testimonials-area .client-content .section-title-area .section-title {

    font-size: 42px;

  }

  .tmp-about-area4 .right-side-content .about-feature-list-area .image {

    max-width: 200px;

  }

  .main-footer-one-area {

    gap: 17px;

  }

  .main-footer-one-area.six .single-footer-inner.logo-area {

    width: 28%;

  }

  .main-footer-one-area.six .single-footer-inner.newsletter {

    width: 23%;

  }

  .main-footer-one-area.six .single-footer-inner.service {

    width: 15%;

  }

  .main-footer-one-area.six .single-footer-inner.company {

    width: 10%;

  }

  .service-wrapper6 {

    padding: 20px 25px;

  }

  .service-wrapper6 h6 {

    font-size: 16px;

  }

}

@media (max-width: 1200px) {

  .dot-btn {

    display: none !important;

  }

  .banner-three-wrapper .title-banner {

    font-size: 42px;

    line-height: 1.4;

  }

  .tmp-counter-area .counter-inner {

    padding: 40px 90px;

  }

  .tmp-about-area .about-one-wrapper {

    margin-top: 50px;

  }

  .tmp-service-area .service-wrapper-area {

    margin-top: 50px;

  }

  .working-process-image {

    margin-bottom: 120px;

  }

  .working-process-image .floating-img {

    bottom: -80px;

    left: 0;

  }

  .blog-card-style-one {

    margin-bottom: 30px;

  }

  .footer-cta-area {

    padding: 65px 40px 70px;

  }

  .main-footer-one-area .single-footer-inner.company {

    width: 13%;

  }

  .main-footer-one-area .single-footer-inner.service {

    width: 18%;

  }

  .main-footer-one-area .single-footer-inner.contact {

    width: 28%;

  }

  .main-footer-one-area .single-footer-inner,

  .main-footer-one-area .single-footer-inner.newsletter {

    width: 30%;

  }

  .header-mid-one-wrapper .logo-area,

  header.header-four .header-mid-one-wrapper .logo-area {

    flex-basis: 25%;

  }

  .tmp-counter-area.area-2 .counter-inner .content {

    padding: 30px 24px 30px 25px;

  }

  .about-image-area2 {

    margin-bottom: 30px;

  }

  .about-image-area2 .floating-img {

    right: 0;

    bottom: 0;

  }

  .mid-image-area ul {

    margin-bottom: 15px;

  }

  .mid-image-area ul li {

    flex-basis: 23.6%;

  }

  .cta-wrapper {

    padding: 50px 40px;

  }

  .working-process-wrapper2 .icon {

    display: none;

  }

  .header-three .header-top .contact-area {

    display: none;

  }

  .tmp-banner-slider-area2 .banner-hero {

    right: -200px;

  }

  .tmp-banner-slider-area2::after {

    max-width: 400px;

  }

  .tmp-banner-slider-area2 .banner-hero .floating-content {

    left: -15%;

  }

  .section-title-area-4 .section-title {

    line-height: 1.3;

    font-size: 36px;

  }

  .tmp-service-area.area-3 .section-title-area-4 .right-side-text {

    max-width: 500px;

  }

  .service-list-area .service-list-wrapper .title {

    font-size: 26px;

  }

  .working-process-wrapper3 a {

    padding: 40px;

  }

  .banner-contact-form form .desc br {

    display: none;

  }

  .tmp-about-area4 .right-side-content {

    margin-left: 10px;

  }

  .tmp-tab-two-start ul.nav li button .arrow {

    right: -20px;

    bottom: -40px;

  }

  .testimonial-wrapper3 .star-rating-area {

    margin-bottom: 80px;

  }

  .testimonial-wrapper3 .bottom-text .desc {

    margin-bottom: 20px;

  }

  .main-footer-one-area.six .single-footer-inner.service,

  .main-footer-one-area.six .single-footer-inner.company,

  .main-footer-one-area.six .single-footer-inner.contact {

    width: 30%;

  }

  .main-footer-one-area.six .single-footer-inner.newsletter {

    width: 40%;

  }

  .main-footer-one-area.six .single-footer-inner.logo-area {

    width: 50%;

  }

  header.header-five .header-top,

  header.header-seven .header-top,

  header.header-five .header-mid-one-wrapper,

  header.header-seven .header-mid-one-wrapper {

    padding: 0 15px;

  }

  header.header-seven.inner .header-mid-one-wrapper {

    padding: 0 20px;

    display: flex;

  }

  header.header-seven .header-mid-one-wrapper .header-right {

    flex-basis: 30%;

  }

  header.header-seven .header-mid-one-wrapper .left .menu {

    margin-left: 30px;

  }

  header.header-seven .cart-search-area {

    gap: 20px;

  }

  header.header-seven .header-mid-one-wrapper .header-right {

    gap: 20px;

  }

  header.header-six .header-top-wrapper {

    justify-content: center;

  }

  header.header-six .header-top-wrapper .left {

    justify-content: center;

    padding-right: 0;

  }

  header.header-six .header-mid-area .left .search-area form {

    width: 500px;

  }

  header.header-six .header-mid-one-wrapper .header-right {

    gap: 20px;

    flex-basis: 50%;

  }

  .tmp-banner-main-area.area-6 .section-inner {

    padding-left: 30px;

  }

  .banner-six-wrapper {

    padding: 60px 0;

  }

  .header-mid-one-wrapper .header-right,

  header.header-three .header-mid-one-wrapper .header-right {

    flex-basis: 35%;

    gap: 20px;

  }

  .header-three .header-main {

    margin-left: 0;

    padding-left: 20px;

  }

  header.header-four .header-mid-one-wrapper .nav-area {

    display: none;

  }

  header.header-four .header-mid-one-wrapper .header-right {

    flex-basis: 50%;

  }

  .testimonial-slider-area {

    margin-top: 50px;

    margin-left: 0;

  }

  .tmp-testimonials-area .client-content .reveiw-area {

    justify-content: start;

    gap: 25px;

  }

  .blog-card-style-one .content-area .text .blog-meta {

    gap: 30px;

    justify-content: start;

  }

  header.header-seven .header-mid-one-wrapper .nav-area {

    margin-left: 25px;

  }

  .main-footer-one-area .single-footer-inner.popular-post .post-wrapper {

    max-width: 140px;

  }

  .tmp-banner-area.banner-ten .shape {

    width: 58%;

  }

  .tmp-job-area .image-area {

    max-width: 100%;

    margin-bottom: 40px;

  }

  .tmp-job-area .image-area img {

    width: 100%;

    object-fit: cover;

    height: 100%;

  }

  .tmp-bread-crumb-area .breadcrumb-inner .watermark {

    font-size: 100px;

    top: 12%;

  }

  .team-wrapper5 .image-area a img {

    height: 100%;

    object-fit: cover;

    width: 100%;

  }

  .tmp-service-details-area .right-content-area {

    margin-left: 0;

  }

  .application-details-area .wrapper h4 {

    font-size: 24px;

  }

  .tmp-service-details-area .left-sidebar .single-wrapper h4 {

    font-size: 24px;

  }

  .shop .popular-product .product-area .small-product-wrapper .content h6 {

    font-size: 16px;

  }

  .tmp-blog-details-area .left-content-area .author-area .content {

    flex-basis: 45%;

  }

  .tmp-top-contact-area .section-inner .desc {

    max-width: 100%;

  }

}

@media (max-width: 1200px) and (min-width: 992px) {

  .tmp-faq-area .section-title-area .section-title {

    font-size: 36px;

  }

  .tmp-testimonials-area .client-content .section-title-area .section-title {

    font-size: 36px;

  }

  .tmp-testimonials-area .client-content .reveiw-area .counter-area {

    padding: 20px 40px 20px 20px;

  }

  .tmp-testimonials-area .client-content .reveiw-area .desc {

    font-size: 14px;

  }

  .why-choose-us-content-area .section-title-area .section-title {

    font-size: 36px;

  }

  .why-choose-us-content-area .service-title,

  .why-choose-us-content-area .service-contact-area .title {

    font-size: 22px;

    line-height: 32px;

  }

  .why-choose-us-content-area .service-contact-area a {

    font-size: 24px;

  }

  .tmp-counter-area.area-2 .counter-inner .content p {

    font-size: 16px;

    line-height: 22px;

  }

  .banner-two-main-wrapper .banner-hero-image {

    height: 100%;

  }

  .banner-two-main-wrapper .banner-hero-image img {

    height: 100%;

  }

  .service-wrapper-2 .content-area {

    padding: 27px 20px 26px;

  }

  .service-wrapper-2 .content-area .title {

    font-size: 18px;

  }

  .tmp-get-in-touch-area .section-inner .left-image {

    left: -115px;

  }

  .tmp-get-in-touch-area .section-inner .content {

    margin-left: 0;

    gap: 140px;

  }

  .cta-wrapper .title {

    font-size: 24px;

  }

  .working-process-wrapper2 .wrapper-inner .content-area .title {

    font-size: 18px;

  }

  .working-process-wrapper2 .wrapper-inner .content-area {

    padding: 20px 25px 30px;

  }

  .why-choose-wrapper-list2 li .text h4 {

    font-size: 22px;

  }

  .team-wrapper2 .content-area {

    padding: 25px 20px;

  }

  .team-wrapper2 .content-area .title {

    font-size: 16px;

  }

  .banner-contact-form form {

    width: 375px;

  }

  .banner-four-main-wrapper .banner-four-content .desc {

    max-width: 450px;

  }

  .tmp-about-area4 .right-side-content .about-feature-list-area {

    gap: 15px;

  }

  .tmp-about-area4 .right-side-content .about-feature-list-area .image {

    max-width: 200px;

  }

  .working-process-wrapper5 .content {

    bottom: -45%;

    left: 15px;

  }

  .working-process-wrapper5:hover .content {

    bottom: 5px;

  }

  .testimonial-wrapper3 .bottom-text .desc {

    font-size: 16px;

  }

  .blog-card-style-five {

    gap: 15px;

  }

  .blog-card-style-five .content-area .text .blog-meta {

    gap: 12px;

  }

  .blog-card-style-five .content-area .text .blog-title {

    font-size: 18px;

  }

  .tmp-banner-main-area.area-5 .banner-two-wrapper .title-banner {

    font-size: 38px;

    line-height: 1.3;

  }

  .tmp-banner-main-area.area-5 .banner-two-wrapper p br {

    display: none;

  }

  .about-wrapper {

    padding: 40px 30px;

  }

  .about-wrapper .icon {

    min-width: 80px;

  }

  .service-wrapper4 .content .title {

    font-size: 28px;

  }

  .service-wrapper4 .content {

    padding: 65px 35px;

  }

  .feedback-wrapper .title {

    font-size: 30px;

  }

  .banner-six-wrapper .title-banner {

    font-size: 38px;

    line-height: 48px;

  }

  .tmp-banner-main-area.area-6 .section-inner .right-side-image {

    bottom: 0;

  }

  .blog-card-style-shop .content-area .text .blog-meta {

    gap: 15px;

  }

  .banner-seven-main-wrapper .banner-three-wrapper .title-banner {

    font-size: 42px;

    line-height: 55px;

  }

  .banner-seven-main-wrapper .banner-hero-image {

    height: 100%;

  }

  .banner-seven-main-wrapper .banner-hero-image img {

    height: 81%;

  }

  .service-wrapper5 .content-area .title {

    font-size: 18px;

  }

  .service-wrapper5 .content-area {

    bottom: -62%;

  }

  .header-mid-one-wrapper .header-right .cart-search-area {

    gap: 14px;

  }

  .header-mid-one-wrapper .header-right .single-component .tmp-btn {

    padding: 15px 25px 14px;

  }

  .header-mid-one-wrapper .header-right, header.header-three .header-mid-one-wrapper .header-right {

    gap: 14px;

    flex-basis: 60%;

  }

  .nav-area ul li a {

    font-size: 14px;

  }

  .header-mid-one-wrapper .logo-area::after {

    clip-path: polygon(92% 0, 101% 0, 80% 100%, 71% 100%);

  }

  .blog-card-style-one .image-area {

    flex-basis: 33%;

  }

  header.header-six .header-mid-one-wrapper .header-right {

    gap: 10px;

  }

  header.header-six .header-main-2 .header-right .tag:last-child {

    padding: 20px 20px 18px;

    gap: 10px;

  }

  .tmp-about-area.area-4 .left-side-content .section-title-area-4 .section-title {

    font-size: 34px;

  }

  .service-wrapper7 {

    padding: 40px 25px;

  }

  .service-wrapper7 .title {

    font-size: 18px;

  }

  .tmp-counter-area.inner .counter-inner .content p {

    font-size: 18px;

  }

  .project-single2 .content {

    left: 20px;

  }

  .project-single2:hover .content {

    bottom: 10px;

  }

  .project-single2 .content .title {

    font-size: 16px;

  }

  .blog-content-area-3 .text .blog-meta .left, .blog-content-area-3 .text .blog-meta .right {

    gap: 10px;

  }

  .timeline-wrapper .wrapper-bottom .content {

    padding: 0 15px 30px 15px;

  }

  .timeline-wrapper .wrapper-bottom .content .title {

    font-size: 21px;

  }

  .tmp-service-details-area .left-sidebar .service-card .content-area {

    padding: 0 20px;

  }

  .tmp-service-details-area .left-sidebar .single-wrapper ul li a {

    padding: 18px 15px;

    font-size: 14px;

  }

  .tmp-service-details-area .left-sidebar .single-wrapper .content .text a {

    font-size: 22px;

  }

}

@media (max-width: 991px) {

  header.header-one .header-top-wrapper {

    justify-content: center;

  }

  header.header-one .header-top-wrapper .left {

    padding-right: 0;

  }

  .tmp-service-area .service-wrapper-area {

    margin-top: 15px;

  }

  .tmp-about-area .about-one-wrapper {

    margin-top: 0px;

  }

  header.header-one .header-top-wrapper .left .single-component:last-child {

   

  }

    header.header-seven .header-top-wrapper .right{

        display: none;

    }

  header.header-one .header-top-wrapper .left .single-component:nth-child(2)::after {

    display: none;

  }

  .header-mid-one-wrapper .logo-area,

  .header-mid-one-wrapper .logo-area,

  header.header-four .header-mid-one-wrapper .logo-area {

    flex-basis: 30%;

  }

  .tmp-banner-one .banner-shape-area .shape {

    right: 50px;

  }

  .tmp-counter-area .counter-inner {

    flex-wrap: wrap;

    gap: 30px;

  }

  .tmp-counter-area .counter-inner .content {

    width: 47%;

  }

  .about-image-area .floating-area img {

    width: 85%;

  }

  .about-image-area .about-card .card-top .title {

    font-size: 64px;

  }

  .about-image-area {

    width: 100%;

  }

  .tmp-banner-one .banner-one-wrapper .button-area-banner .tmp-btn.btn-border {

    border: 1px solid var(--color-heading-1);

  }

  .offset-1 {

    margin-left: 0 !important;

  }

  .tmp-case-studies-area .section-inner .case-card-area {

    position: unset;

    transform: none;

    margin-top: 30px;

    width: 100%;

  }

  .tmp-case-studies-area .section-inner {

    padding-bottom: 50px;

  }

  .why-choose-us-content-area {

    margin-left: 0;

    margin-top: 50px;

  }

  .footer-cta-area .cta-area-inner {

    flex-direction: column;

    align-items: start;

    gap: 15px;

  }

  .footer-cta-area .cta-image-area {

    right: 2%;

  }

  .main-footer-one-area .single-footer-inner {

    width: 41%;

  }

  .main-footer-one-area .single-footer-inner.service,

  .main-footer-one-area .single-footer-inner.company {

    width: 25%;

  }

  .main-footer-one-area .single-footer-inner.contact {

    width: 40%;

  }

  .main-footer-one-area .single-footer-inner.newsletter {

    width: 53%;

  }

  .header-mid-one-wrapper .logo-area::before {

    right: 5px;

  }

  header.header-four .header-mid-one-wrapper .logo-area::after,

  .header-mid-one-wrapper .logo-area::after {

    clip-path: polygon(92% 0, 100% 0, 80% 100%, 72% 100%);

  }

  .banner-two-main-wrapper .banner-hero-image {

    position: unset;

    width: 100%;

  }

  .tmp-counter-area.area-2 .counter-inner {

    position: unset;

    transform: none;

    margin-top: 30px;

  }

  .tmp-counter-area.area-2 .counter-inner .content {

    flex-basis: 46%;

  }

  .banner-two-main-wrapper .banner-one-wrapper .desc {

    max-width: 500px;

  }

  .tmp-banner-slider-area .banner-one-wrapper {

    padding-top: 70px !important;

  }

  .tmp-banner-slider-area .pagination-area {

    bottom: 140px;

    top: unset;

    right: 0;

    transform: unset;

  }

  .banner-two-main-wrapper .watermark {

    font-size: 70px;

  }

  .banner-two-main-wrapper .watermark.two {

    right: 0;

  }

  .section-title-area-2 .left-side-content .section-title {

    line-height: 46px;

  }

  .section-title-area-2 .right-side-button .rts-text-btn span {

    width: 60px;

    height: 60px;

    line-height: 75px;

  }

  .section-title-area-2 .right-side-button .rts-text-btn p {

    font-size: 24px;

    line-height: 1;

  }

  .about-award-area {

    margin: 0 10px;

    margin-bottom: 30px;

  }

  .about-feature-area {

    margin: 0;

    gap: 50px;

  }

  .about-award-area .award-inner .star-rating-area {

    max-width: max-content;

    margin: auto;

    margin-bottom: 15px;

  }

  .about-image-area2 {

    display: flex;

    gap: 20px;

    flex-direction: column;

  }

  .about-image-area2 img {

    width: 100%;

  }

  .about-image-area2 .floating-img {

    position: unset;

  }

  .about-image-area2 .floating-shape {

    display: none;

  }

  .mid-image-area ul {

    margin-bottom: 0;

  }

  .mid-image-area ul li .counter-area .counter-wrapper .disc {

    font-size: 15px;

  }

  .section-title-area-3 .section-title {

    line-height: 46px;

  }

  .tmp-get-in-touch-area .section-inner .left-image {

    position: unset;

  }

  .tmp-get-in-touch-area .section-inner .left-image img {

    width: 100%;

  }

  .tmp-get-in-touch-area .section-inner .content {

    margin-left: 0;

  }

  .tmp-get-in-touch-area .section-inner .shape {

    top: unset;

    bottom: 0;

  }

  .cta-wrapper.second {

    transform: none;

    display: none;

  }

  .cta-bg-1 {

    padding: 115px 0;

  }

  .working-process-wrapper2 .wrapper-inner {

    margin: 0;

    max-width: 100%;

  }

  .tmp-working-process-area2 .section-inner::after {

    display: none;

  }

  .tmpTestimonialSlider2 .swiper-navigation-area {

    top: 50%;

    right: 41px;

    transform: translateY(-50%);

    left: unset;

    flex-direction: row;

  }

  .header-custom-container2 {

    padding-left: 0;

    padding-right: 0;

  }

  .header-three .header-main {

    border-radius: 0;

    margin-top: 0;

  }

  .tmp-banner-slider-area2 .banner-hero {

    position: relative;

    right: unset;

    top: unset;

    bottom: unset;

  }

  .tmp-banner-slider-area2 .banner-hero img {

    width: 100%;

  }

  .tmp-banner-slider-area2 .banner-hero .floating-content {

    left: 50%;

    transform: translateX(-50%);

  }

  .banner-three-wrapper {

    padding: 60px 0 80px !important;

  }

  .tmp-banner-slider-area2 .banner-shape {

    display: none;

  }

  .tmp-banner-slider-area2::after {

    display: none;

  }

  .order-change {

    order: -1;

  }

  .about-image-area3 {

    margin-bottom: 50px;

  }

  .tmp-service-area.area-3 .section-title-area-4 {

    flex-direction: column;

    align-items: self-start !important;

  }

  .working-process-wrapper3 a {

    flex-direction: column;

    align-items: self-start;

  }

  .working-process-wrapper3 a .mid-area {

    max-width: 100%;

  }

  .tmp-why-choose-us-area3 .right-side-content {

    margin-bottom: 50px;

  }

  .tmp-gallery-area .section-inner {

    flex-wrap: wrap;

    justify-content: center;

    padding: 0 15px;

  }

  .tmp-gallery-area .section-inner .gallery-wrapper {

    width: 46%;

  }

  .tmp-banner-slider-area3 {

    padding: 140px 0 120px;

  }

  .tmp-about-area4 .right-side-content {

    margin-top: 50px;

    margin-left: 0;

  }

  .tmp-tab-two-start ul.nav li button .arrow {

    display: none;

  }

  .header-three .header-main .header-mid-one-wrapper .header-right .single-component .tmp-btn {

    padding: 19px 34px 18px;

    border-radius: 4px;

  }

  .banner-five-main-wrapper .banner-shape img:nth-child(1) {

    left: 0;

    bottom: -45px;

  }

  .tmp-banner-slider-area .pagination-area2 {

    right: -30px;

  }

  .tmp-banner-slider-area .pagination-area2 .swiper-wrapper .banner-single-thumb {

    width: 90%;

    padding: 25px 15px;

  }

  header.header-seven .header-mid-one-wrapper .logo-area {

    flex-basis: 100%;

  }

  header.header-seven .header-mid-one-wrapper .header-right {

    flex-basis: 70%;

  }

  .tmp-banner-main-area.area-5 .right-side-image {

    text-align: center;

  }

  .tmp-banner-main-area.area-5 .right-side-image .float-img.two {

    left: 20px;

  }

  .tmp-banner-main-area.area-5 .right-side-image .float-img.three {

    right: 20px;

  }

  .tmp-banner-main-area.area-5 {

    padding: 0 20px;

  }

  .float-right,

  .float-right2 {

    min-width: 100%;

  }

  header.header-six .header-top-wrapper .left {

    gap: 30px;

  }

  header.header-six .header-top-wrapper .left .desc {

    font-size: 14px;

  }

  header.header-six .header-top-wrapper .left .countDown .container {

    font-size: 14px;

  }

  header.header-six .header-mid-area .left .search-area {

    display: none;

  }

  header.header-six .header-main-2 {

    display: none;

  }

  .tmp-banner-main-area.area-6 .section-inner .right-side-image img:nth-child(2) {

    left: -10%;

  }

  .banner-seven-main-wrapper .banner-hero-image {

    position: unset;

  }

  .banner-seven-main-wrapper .banner-shape {

    height: 100%;

    width: 100%;

    clip-path: none;

  }

  .tmp-banner-slider-area.banner-nine .banner-five-main-wrapper {

    height: 620px;

  }

  .tmp-service-area.area-6 {

    padding-top: 60px;

  }

  .service-wrapper5 {

    margin-top: 0;

  }

  .banner-seven-main-wrapper .social-area {

    bottom: 25%;

  }

  .service-wrapper5 .content-area {

    bottom: -30%;

  }

  .tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide {

    width: 250px !important;

  }

  .tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide .banner-single-thumb {

    width: 100%;

  }

  .header-mid-one-wrapper .header-right {

    flex-basis: 50%;

  }

  header.header-three .header-mid-one-wrapper .nav-area {

    display: none;

  }

  header.header-three .header-mid-one-wrapper .header-right {

    flex-basis: 60%;

  }

  .banner-five-main-wrapper img.sun {

    opacity: 0.5;

  }

  .nav-area {

    display: none;

  }

  .blog-content-area-3 .text .blog-meta li p {

    font-size: 14px;

  }

  .blog-card-style-four.list .image-area {

    flex-basis: 40%;

  }

  .blog-card-style-four.list .blog-content-area-3 {

    flex-basis: 60%;

  }

  .blog-card-style-four.list .blog-content-area-3 .blog-title {

    font-size: 20px;

    line-height: 30px;

    margin-bottom: 10px;

  }

  .blog-card-style-four.list .blog-content-area-3 .text .blog-meta li {

    margin-bottom: 12px;

  }

  .tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-shape img {

    display: none !important;

  }

  .service-wrapper7 {

    padding: 25px;

  }

  .working-process-wrapper7 .content {

    left: -101%;

    max-width: 320px;

  }

  .working-process-wrapper7 .image-area .arrow-btn {

    display: none;

  }

  header.header-seven .header-mid-one-wrapper .header-right {

    flex-basis: 75%;

  }

  .main-footer-one-area .single-footer-inner.popular-post {

    width: 45%;

  }

  .tmp-counter-area .counter-inner {

    justify-content: center;

  }

  .mid-image-area ul li img {

    object-fit: cover;

  }

  .tmp-why-choose-us-area3 .right-side-content .content {

    left: 20px;

  }

  .banner-five-main-wrapper {

    height: auto;

  }

  header.header-six .header-mid-area .right a.search-btn {

    display: flex;

  }

  .banner-ten-main-wrapper .banner-hero img {

    position: relative;

  }

  .tmp-banner-area.banner-ten .shape {

    width: 75%;

  }

  .working-process-content-area {

    margin-bottom: 0;

  }

  .tmp-career-area .section-inner .content-area {

    padding: 60px 0;

  }

  .tmp-career-area .section-inner .video-btn {

    right: 10%;

  }

  .tmp-job-area .image-area .circle-content-area h5 {

    font-size: 16px;

  }

  .tmp-job-area .image-area .circle-content-area .tmp-btn {

    padding: 12px 24px;

  }

  .tmp-faq-area.career .section-inner .image-area img {

    width: 100%;

  }

  .tmp-career-details-area .career-content-area .content-area ul {

    margin-bottom: 30px;

  }

  .tmp-career-details-area .career-content-area .content-area.two {

    padding-left: 0;

    margin-top: 30px;

  }

  .tmp-application-form-area {

    flex-direction: column;

    padding: 20px;

    gap: 50px;

  }

  .tmp-application-form-area .image-area img {

    width: 100%;

  }

  .tmp-team-details-area .team-content-area {

    margin-left: 0;

  }

  .branch-wrapper2 {

    padding: 30px;

    gap: 20px;

  }

  .branch-wrapper2 .content {

    flex-basis: 60%;

    padding: 0;

  }

  .branch-wrapper2 .content .desc br {

    display: none;

  }

  .branch-wrapper2 .image-area {

    flex-basis: 40%;

  }

  .tmp-map-area .contact-map iframe {

    height: 700px !important;

  }

  .shop .right-content-area {

    margin-left: 0 !important;

  }

  .ms-single-product__content {

    margin-left: 0;

  }

  .tmp-shop-single-area .tab-area {

    padding: 50px;

  }

  .tmp-blog-details-area .left-content-area {

    margin-right: 0;

    margin-bottom: 50px;

  }

  .tmp-top-contact-area .section-inner {

    flex-direction: column;

    align-items: flex-start;

  }

  .tmp-contact-area.contact .right-content-area {

    margin-left: 0;

  }

}

@media (max-width: 991px) and (min-width: 768px) {

  .banner-contact-form form {

    width: 275px;

  }

  .banner-four-main-wrapper .banner-four-content .desc {

    max-width: 450px;

  }

  .project-wrapper .content-area {

    max-width: 340px;

    padding: 0 60px 30px 30px;

  }

}

@media (width: 768px) {

  .tmp-banner-slider-area.banner-nine .banner-five-main-wrapper {

    height: 528px !important;

  }

}

@media (max-width: 768px) {

  .tmp-banner-slider-area.banner-nine .banner-five-main-wrapper {

    height: auto;

  }

  .tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-three-wrapper .title-banner {

    font-size: 40px;

  }

  .marquee.area-ten {

    margin-top: 35px;

  }

  .branch-wrapper2 {

    padding: 20px;

  }

  .header-mid-one-wrapper .logo-area,

  header.header-four .header-mid-one-wrapper .logo-area {

    padding: 20px 0;

    flex-basis: 44%;

  }

  .tmp-banner-one .banner-one-wrapper {

    padding-top: 0px !important;

  }

  .container-3,

  .container-2,

  .container {

    padding-left: 15px !important;

    padding-right: 15px !important;

  }

  .tmp-counter-area .counter-inner {

    padding: 40px;

  }

  .about-image-area .about-card .card-bottom {

    padding: 30px;

  }

  .about-image-area .floating-area {

    display: none;

  }

  .tmp-about-area {

    padding-bottom: 60px !important;

  }

  .working-process-image .floating-img {

    display: none;

  }

  .working-process-image {

    margin-bottom: 60px;

  }

  .tmp-case-studies-area .section-inner .case-card-area {

    flex-direction: column;

    max-width: 100%;

  }

  .tmp-case-studies-area .section-inner .case-card-area .image {

    order: -1;

  }

  .tmp-case-studies-area .section-inner .case-card-area .image img {

    width: 100%;

  }

  .tmp-case-studies-area .section-inner .case-card-area .section-title-area {

    padding: 30px 20px;

  }

  .tmp-case-studies-area .section-inner .case-card-area .section-title-area .pre-title {

    font-size: 14px;

  }

  .vedio-icone .popup-video {

    width: 90px;

    height: 90px;

    line-height: 110px;

  }

  .blog-card-style-one {

    flex-direction: column;

    align-items: start;

    gap: 30px;

    margin-bottom: 0;

    padding: 20px;

  }

  .blog-card-style-one .image-area {

    flex-basis: 100%;

    top: unset;

  }

  .blog-card-style-one .image-area img {

    width: 100%;

  }

  .blog-card-style-one .content-area .text .blog-meta {

    justify-content: flex-start;

    gap: 15px;

  }

  .footer-cta-area .cta-image-area {

    right: unset;

    position: relative;

    top: 0;

    margin-bottom: 20px;

  }

  .main-footer-one-area .single-footer-inner {

    width: 45%;

  }

  .main-footer-one-area .single-footer-inner.service,

  .main-footer-one-area .single-footer-inner.company {

    width: 45%;

  }

  .main-footer-one-area .single-footer-inner.newsletter {

    width: 70%;

  }

  .footer-one {

    padding-left: 15px;

    padding-right: 15px;

  }

  .copyright-area-one .wrapper {

    text-align: center !important;

  }

  .copyright-area-one .copyright-links {

    justify-content: center;

    flex-wrap: wrap;

  }

  .header-mid-one-wrapper .logo-area::after {

    clip-path: polygon(92% 0, 100% 0, 77% 100%, 69% 100%);

  }

  .tmp-banner-slider-area .pagination-area {

    display: none;

  }

  .banner-two-main-wrapper .watermark {

    display: none;

  }

  .tmp-counter-area.area-2 .counter-inner .content p {

    font-size: 18px;

  }

  .section-title-area-2 {

    flex-direction: column;

    align-items: start;

  }

  .tmp-counter-area.area-2 .counter-inner {

    padding: 0 15px;

    gap: 15px;

  }

  .about-feature-area {

    gap: 30px;

  }

  .tmp-about-area.area-2 .marquee {

    position: unset;

  }

  .marquee .marquee__item .main--wrapper-tt {

    padding-bottom: 0;

  }

  .mid-image-area ul li {

    flex-basis: 100%;

  }

  .tmp-project-area.two .section-inner {

    padding: 0 15px;

  }

  .section-title-area-3 .section-title {

    line-height: 1.4;

  }

  .tmp-get-in-touch-area .section-inner .content {

    gap: 20px;

    align-items: self-start;

  }

  .tmp-get-in-touch-area .section-inner .icon a {

    height: 80px;

    width: 80px;

    line-height: 85px;

    font-size: 24px;

  }

  .cta-wrapper .title {

    font-size: 28px;

  }

  .cta-bg-1 {

    padding: 60px 0;

  }

  .tmpTestimonialSlider2 .swiper-navigation-area {

    right: 30px;

  }

  .header-three .header-main .header-mid-one-wrapper .header-right .single-component .tmp-btn {

    display: none;

  }

  .tmp-banner-slider-area2 .banner-hero .floating-content {

    display: none;

  }

  .tmp-banner-slider-area2 .banner-slider-button {

    top: 30%;

    transform: translateY(-30%);

  }

  .working-process-wrapper3 a .left-area {

    gap: 30px;

  }

  .working-process-counter-area .counter-inner {

    flex-wrap: wrap;

    gap: 20px;

  }

  .working-process-counter-area .counter-inner .content {

    width: 46%;

  }

  .blog-card-style-three.list {

    flex-direction: column;

    align-items: self-start;

  }

  .blog-card-style-three.list .image-area {

    width: 100%;

  }

  .blog-card-style-three.list .image-area img {

    width: 100%;

  }

  .blog-card-style-three.list .blog-content-area-3 {

    padding-left: 35px;

  }

  .banner-four-main-wrapper {

    height: auto;

    padding: 60px 0 80px;

  }

  .banner-four-main-wrapper .banner-four-content {

    padding: 0 25px;

  }

  .tmp-about-area4 .right-side-content .about-feature-list-area {

    flex-direction: column;

  }

  .tmp-about-area4 .right-side-content .about-feature-list-area .image {

    order: -1;

  }

  .tmp-testimonials-area.area-4 .section-inner {

    margin: 40px 15px 0;

  }

  .main-footer-one-area.five .footer-nav {

    flex-wrap: wrap;

    justify-content: center;

    gap: 15px;

  }

  .tmp-banner-slider-area .pagination-area2 {

    display: none;

  }

  .main-footer-one-area.six .single-footer-inner.service,

  .main-footer-one-area.six .single-footer-inner.company,

  .main-footer-one-area.six .single-footer-inner.contact,

  .main-footer-one-area.six .single-footer-inner.newsletter {

    width: 45%;

  }

  .main-footer-one-area.six .single-footer-inner.logo-area {

    width: 100%;

    order: -1;

  }

  .main-footer-one-area {

    gap: 35px;

  }

  .tmp-banner-main-area.area-5 .banner-two-wrapper .title-banner {

    font-size: 46px;

  }

  .about-wrapper {

    padding: 40px 50px;

  }

  .tmp-service-area.area-5 {

    margin: 0;

  }

  .section-title-area-4 .section-title {

    font-size: 32px;

  }

  .service-wrapper4 {

    flex-direction: column;

  }

  .service-wrapper4 .image-area {

    order: -1;

  }

  .service-wrapper4 .image-area img {

    width: 100%;

  }

  .single-wrapper.bottom {

    flex-direction: column;

  }

  .single-wrapper.bottom img {

    width: 100%;

  }

  .testimonial-wrapper4 {

    flex-direction: column;

    align-items: start;

  }

  header.header-six .header-top {

    display: none;

  }

  .banner-six-wrapper .title-banner {

    font-size: 40px;

    line-height: 1.4;

  }

  .banner-seven-main-wrapper .banner-three-wrapper .title-banner {

    font-size: 46px;

    line-height: 60px;

  }

  .banner-seven-main-wrapper .social-area {

    right: -125px;

  }

  .service-wrapper5 .content-area {

    bottom: -15%;

  }

  .tmp-banner-slider-area.banner-nine .banner-three-wrapper {

    padding: 80px 0 !important;

  }

  .tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-shape img:nth-child(1) {

    top: 0;

    bottom: unset;

  }

  .header-mid-one-wrapper .header-right .single-component a.tmp-btn,

  header.header-four .header-mid-one-wrapper.wrapper-two .header-right .single-component .tmp-btn,

  header.header-seven .header-mid-one-wrapper .header-right .single-component a.tmp-btn {

    display: none;

  }

  .tmp-bread-crumb-area .breadcrumb-inner .watermark {

    font-size: 120px;

    top: 30px;

  }

  .tmp-counter-area.inner .counter-inner .content p {

    font-size: 18px;

  }

  header.header-seven .header-mid-one-wrapper .header-right .single-component .menu-area,

  header.header-four .header-mid-one-wrapper .header-right .single-component .menu-area,

  .header-mid-one-wrapper .header-right .single-component .menu-area {

    margin-left: 0;

  }

  .blog-card-style-four.list {

    flex-direction: column;

  }

  .tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-three-wrapper .title-banner {

    font-size: 50px;

  }

  .tmp-banner-slider-area.banner-nine .navigation-area .swiper-btn {

    width: 50px;

    height: 50px;

  }

  .tmp-banner-slider-area.banner-nine .navigation-area .swiper-btn.swiper-button-prev {

    left: 1%;

  }

  .tmp-banner-slider-area.banner-nine .navigation-area .swiper-btn.swiper-button-next {

    right: 1%;

  }

  .tmp-counter-area .counter-inner .content {

    width: 46%;

    padding: 25px;

  }

  .main-footer-one-area .single-footer-inner.popular-post {

    width: 48%;

  }

  .main-footer-one-area .single-footer-inner.popular-post .post-wrapper {

    max-width: 180px;

  }

  .mid-image-area ul li .counter-area .counter-wrapper .title-main {

    font-size: 54px;

  }

  .mid-image-area ul li .counter-area .counter-wrapper .disc {

    font-size: 18px;

  }

  .tmp-working-process-area .section-bottom-video-area .video-btn a {

    width: 90px;

    height: 90px;

    line-height: 105px;

  }

  .tmp-working-process-area .section-bottom-video-area .video-btn a i {

    font-size: 30px;

  }

  .testimonial-wrapper4 .image-area {

    width: 100%;

  }

  .testimonial-wrapper4 .image-area img {

    width: 100%;

  }

  .tmp-banner-area.banner-ten .shape {

    width: 90%;

  }

  .working-process-image-wrapper img:nth-child(2) {

    display: none;

  }

  .working-process-image-wrapper {

    right: unset;

    text-align: start;

    max-width: 100%;

  }

  .working-process-image-wrapper img {

    width: 100%;

  }

  .team-wrapper2 .content-area {

    padding: 30px 15px;

  }

  .tmp-bread-crumb-area .breadcrumb-inner .title {

    font-size: 48px;

  }

  .team-wrapper5 .content-area .left h6 {

    font-size: 18px;

  }

  .branch-wrapper .image-area {

    width: 100%;

  }

  .branch-wrapper .image-area img {

    width: 100%;

  }

  .branch-wrapper2 {

    flex-direction: column;

    align-items: flex-start;

  }

  .branch-wrapper2 .image-area {

    order: -1;

  }

  .tmp-map-area .contact-map iframe {

    height: 500px !important;

  }

  .home-inner .pagination-area ul li {

    width: 35px;

    height: 35px;

    line-height: 37px;

    font-size: 16px;

  }

  .tmp-shop-single-area .tab-area {

    padding: 40px 30px;

  }

  .tmp-blog-details-area .left-content-area .tags-area .left {

    align-items: self-start;

  }

  .tmp-blog-details-area .left-content-area .tags-area {

    align-items: self-start;

  }

  .tmp-blog-details-area .left-content-area .tags-area .left ul {

    flex-wrap: wrap;

    align-items: self-start;

  }

  .tmp-blog-details-area .left-content-area .tags-area .left h6 {

    min-width: max-content;

  }

  .tmp-blog-details-area .left-content-area .tags-area .right a {

    min-width: max-content;

  }

  .tmp-blog-details-area .left-content-area .quote-area .text h4 {

    font-size: 20px;

    line-height: 30px;

  }

  .tmp-blog-details-area .left-content-area .top-area {

    flex-direction: column;

    align-items: flex-start;

    gap: 30px;

  }

  .tmp-blog-details-area .left-content-area .author-area {

    flex-direction: column;

    align-items: flex-start;

    gap: 30px;

    padding: 30px;

  }

}

@media (max-width: 768px) and (min-width: 576px) {

  .service-wrapper6 {

    padding: 20px 18px;

  }

  .service-wrapper6 h6 {

    font-size: 16px;

  }

  .product-wrapper .content {

    padding: 30px 15px 25px;

  }

  .product-wrapper .content .title {

    font-size: 18px;

  }

  .team-wrapper5 .content-area {

    padding: 25px 20px;

  }

}

@media (max-width: 576px) {

  .tmp-service-area .service-wrapper-area {

    margin-top: 15px;

  }

  header.header-one .header-top {

  }

  .header-mid-one-wrapper {

    padding: 0 10px;

  }

  .header-mid-one-wrapper .logo-area::after {

    display: none;

  }

  .tmp-banner-one .banner-hero-image img {

    clip-path: none;

    object-fit: cover;

  }

  .tmp-counter-area .counter-inner {

    gap: 15px;

  }

  .tmp-counter-area .counter-inner {

    padding: 40px 15px;

  }

  .tmp-counter-area .counter-inner .content {

    width: 47%;

  }

  .tmp-counter-area .counter-inner .content .title {

    font-size: 40px;

    margin-bottom: 8px;

  }

  .tmp-counter-area .counter-inner .content p {

    font-size: 13px;

  }

  .tmp-tab-one-start ul.nav {

    flex-wrap: wrap;

  }

  .about-image-area {

    flex-direction: column;

    padding-bottom: 45px;

  }

  .about-image-area img.image-one,

  .about-image-area img.image-two {

    width: 100%;

    max-width: 100%;

  }

  .tmp-tab-one-start ul.nav {

    gap: 20px;

  }

  .about-btn-area {

    margin-top: 40px !important;

  }

  .tmp-form-area {

    padding: 25px;

  }

  .testimonial-wrapper .bottom-content {

    flex-direction: column;

    align-items: flex-start;

  }

  .tmp-blog-area .blog-title-area {

    flex-direction: column;

    align-items: start !important;

    gap: 15px;

  }

  .footer-cta-area .cta-area-inner .cta-title {

    font-size: 28px;

  }

  .main-footer-one-area .single-footer-inner {

    width: 100%;

  }

  .main-footer-one-area .single-footer-inner.service,

  .main-footer-one-area .single-footer-inner.company {

    width: 100%;

  }

  .main-footer-one-area .single-footer-inner.newsletter {

    width: 100%;

  }

  .main-footer-one-area .single-footer-inner.contact {

    width: 100%;

  }

  .footer-cta-area {

    padding: 35px 25px 35px;

  }

  .banner-two-main-wrapper .banner-one-wrapper .title-banner {

    font-size: 42px;

    line-height: 58px;

  }

  .banner-two-main-wrapper img.sun {

    display: none;

  }

  .tmp-banner-slider-area .banner-one-wrapper {

    padding-bottom: 80px;

  }

  .section-title-area-2 .left-side-content .sub-title {

    font-size: 16px;

    line-height: 22px;

  }

  .banner-two-main-wrapper .banner-hero-image {

    display: none;

  }

  .header-mid-one-wrapper .logo-area,

  header.header-four .header-mid-one-wrapper .logo-area {

    flex-basis: 60%;

  }

  .about-feature-area {

    flex-direction: column;

  }

  .marquee .marquee__item .main--wrapper-tt h2 {

    font-size: 54px;

  }

  .section-title-area-3 .section-title {

    line-height: 36px;

  }

  .tmp-get-in-touch-area .section-inner .icon {

    display: none;

  }

  .cta-wrapper .sub-title {

    font-size: 16px;

  }

  .cta-wrapper .title {

    font-size: 20px;

  }

  .tmp-btn {

    padding: 12px 20px;

    height: 50px;

  }

  .cta-bg-1,

  .tmp-working-process-area2 {

    margin: 0;

  }

  .section-title-area-2 .right-side-button .rts-text-btn span {

    width: 50px;

    height: 50px;

    line-height: 55px;

  }

  .section-title-area-2 .right-side-button .rts-text-btn span i {

    font-size: 20px;

  }

  .section-title-area-3 .sub-title {

    font-size: 14px;

    line-height: 20px;

  }

  .tmpTestimonialSlider2 .swiper-navigation-area {

    bottom: 40px;

    top: unset;

  }

  .testimonial-wrapper2 {

    padding: 30px;

  }

  .header-three .header-main {

    padding: 0 20px;

  }

  .banner-three-wrapper .desc,

  .banner-three-wrapper span.b_one-pre {

    font-size: 16px;

    line-height: 1.4;

  }

  .banner-three-wrapper .title-banner {

    font-size: 34px;

    line-height: 1.4;

  }

  .banner-three-wrapper {

    padding: 60px 0;

  }

  .about-image-area3 .main-image img {

    width: 100%;

  }

  .about-image-area3 .floating-img,

  .about-image-area3 .about-award-area {

    display: none;

  }

  .section-title-area-4 .sub-title {

    font-size: 16px;

  }

  .section-title-area-4 .section-title {

    font-size: 30px;

  }

  .tmp-service-area.area-3 {

    padding-top: 60px !important;

  }

  .working-process-wrapper3 a {

    padding: 30px 20px;

  }

  .why-choose-wrapper-list2 li {

    flex-direction: column;

  }

  .tmp-contact-area .left-side-content .social-bottom-area {

    gap: 40px;

  }

  .tmp-contact-area .left-side-content .content {

    margin-bottom: 40px;

  }

  .blog-card-style-three.list .blog-content-area-3 {

    padding: 20px;

  }

  .blog-content-area-3 {

    padding: 20px;

  }

  .blog-content-area-3 .text .blog-meta {

    flex-wrap: wrap;

  }

  .tmp-gallery-area .section-inner .gallery-wrapper {

    width: 100%;

  }

  .footer-four .main-footer-one-area {

    padding-top: 40px !important;

  }

  .tmp-banner-slider-area3 .slider-inner .swiper-pagination {

    bottom: 30px;

  }

  .working-process-wrapper5 .content {

    bottom: -68px;

    left: 25px;

  }

  .tmp-working-process-area .section-bottom-video-area {

    height: 400px;

  }

  .testimonial-wrapper3 {

    padding: 25px;

  }

  .testimonial-wrapper3 .bottom-text .desc {

    font-size: 16px;

  }

  .tmp-team-area3 .section-inner {

    margin-right: 1px;

    margin-left: 1px;

  }

  .main-footer-one-area.five form {

    flex-direction: column;

    align-items: center;

  }

  .main-footer-one-area.five .title {

    font-size: 28px;

    line-height: 34px;

  }

  .main-footer-one-area.five {

    padding: 60px 0 !important;

  }

  .banner-five-main-wrapper {

    height: auto;

  }

  .banner-five-main-wrapper .banner-three-wrapper {

    padding-bottom: 100px;

  }

  .banner-five-main-wrapper::after {

    display: none;

  }

  .banner-five-main-wrapper .warm {

    opacity: 0.5;

  }

  .blog-card-style-five {

    flex-direction: column;

    align-items: self-start;

    gap: 20px;

  }

  .blog-card-style-five .image-area img {

    width: 100%;

  }

  .main-footer-one-area.six .single-footer-inner.company {

    width: 36%;

  }

  .main-footer-one-area.six .single-footer-inner.service {

    width: 55%;

  }

  .main-footer-one-area.six .single-footer-inner.contact,

  .main-footer-one-area.six .single-footer-inner.newsletter {

    width: 100%;

  }

  .ptb--100 {

    padding: 60px 0 !important;

  }

  header.header-seven .header-mid-one-wrapper {

    padding: 0 20px;

  }

  .tmp-banner-main-area.area-5 .banner-two-wrapper .title-banner {

    font-size: 36px;

  }

  .tmp-banner-main-area.area-5 .banner-two-wrapper p br {

    display: none;

  }

  .tmp-banner-main-area.area-5 .shape-area img.sun {

    width: 80px;

  }

  .tmp-banner-main-area.area-5 .right-side-image .float-img.one {

    top: 50%;

    transform: translate(-50%, -50%);

  }

  .tmp-banner-main-area.area-5 .right-side-image .float-img.two,

  .tmp-banner-main-area.area-5 .right-side-image .float-img.three {

    display: none;

  }

  .about-wrapper {

    flex-direction: column;

    align-items: flex-start;

  }

  .tmp-about-area5 .section-inner .floating-img img {

    display: none;

  }

  .service-wrapper4 .content {

    padding: 30px 30px;

  }

  .tmp-service-area.area-5 .slider-inner {

    padding-bottom: 60px !important;

  }

  .gap-5 {

    gap: 2rem !important;

  }

  header.header-six .header-mid-area .right a.wishlist {

    display: none;

  }

  .banner-six-wrapper .title-banner {

    font-size: 36px;

    line-height: 46px;

  }

  .tmp-banner-main-area.area-6 .section-inner {

    padding-left: 20px;

  }

  .banner-six-wrapper {

    padding: 40px 0;

  }

  .blog-card-style-shop.list {

    flex-direction: column;

    align-items: start;

  }

  .blog-card-style-shop {

    padding: 20px;

  }

  .blog-card-style-shop .image-area {

    width: 100%;

  }

  .blog-card-style-shop .image-area img {

    width: 100%;

  }

  .blog-card-style-shop .content-area .text .blog-meta {

    flex-wrap: wrap;

    gap: 15px;

  }

  .banner-seven-main-wrapper .social-area {

    display: none;

  }

  .banner-seven-main-wrapper .banner-three-wrapper .title-banner {

    font-size: 38px;

    line-height: 43px;

  }

  .tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-shape img:nth-child(2) {

    display: none;

  }

  .service-wrapper-9 {

    flex-direction: column;

    align-items: flex-start !important;

  }

  .service-wrapper-9 .image-area {

    width: 100%;

  }

  .service-wrapper-9 .image-area img {

    width: 100%;

  }

  .tmp-banner-slider-area.banner-nine .navigation-area .swiper-btn {

    display: none;

  }

  .tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-three-wrapper .title-banner {

    font-size: 42px;

  }

  .banner-two-main-wrapper .watermark {

    font-size: 80px;

  }

  .tmp-team-area.bg-body-2 {

    margin: 0;

  }

  .tmp-banner-area.banner-ten .shape {

    width: 100%;

  }

  .marquee.area-ten .float-img {

    display: none;

  }

  .working-process-wrapper4 {

    max-width: 100%;

  }

  .tmp-career-area .section-inner .video-btn {

    bottom: 0;

    top: unset;

  }

  .tmp-bread-crumb-area .breadcrumb-inner .watermark {

    font-size: 72px;

  }

  .tmp-counter-area.inner .counter-inner .content {

    padding: 25px 15px;

  }

  .tmp-counter-area.inner .counter-inner .content p {

    font-size: 13px;

  }

  .tmp-office-branch-area .section-inner .section-title-area {

    flex-direction: column;

    align-items: center;

    gap: 20px;

  }

}

@media (max-width: 450px) {

  .tmp-service-area .service-wrapper-area {

    margin-top: 25px;

  }

  .marquee.area-ten {

    margin-top: 0 !important;

  }

  .about-image-area .about-card {

    position: unset;

    order: -1;

    width: 100%;

  }

  .tmp-form-area form .desc {

    font-size: 13px;

  }

  .tmp-case-studies-area .section-inner .case-card-area .section-title-area .section-title {

    font-size: 22px;

  }

  .why-choose-us-content-area .service-title {

    font-size: 18px;

    line-height: 28px;

  }

  .why-choose-us-content-area .service-contact-area .title {

    font-size: 20px;

  }

  .why-choose-us-content-area .service-contact-area a {

    font-size: 22px;

  }

  .footer-cta-area .cta-area-inner .cta-title {

    font-size: 20px;

    line-height: 30px;

  }

  .banner-two-main-wrapper .banner-one-wrapper .title-banner {

    font-size: 32px;

    line-height: 48px;

  }

  .section-title-area-2 .left-side-content .section-title {

    line-height: 34px;

  }

  .why-choose-wrapper-list li {

    flex-direction: column;

  }

  .service-wrapper-2 {

    padding-right: 0;

  }

  .tmp-get-in-touch-area .section-inner .content {

    padding: 30px 20px;

  }

  .tmp-get-in-touch-area .section-inner .text a.phone {

    font-size: 24px;

  }

  .cta-wrapper {

    padding: 30px 20px;

  }

  .tmpTestimonialSlider2 .swiper-navigation-area {

    display: none;

  }

  .banner-three-wrapper .title-banner {

    font-size: 26px;

  }

  .section-title-area-4 .section-title {

    font-size: 26px;

  }

}

@media only screen and (max-width: 450px) and (max-width: 767px) {

  .section-title-area-4 .section-title br {

    display: none;

  }

}

@media (max-width: 450px) {

  .section-title-area-4 .sub-title {

    font-size: 16px;

      margin: auto;

  }

  .tmp-about-area.area-3 .left-side-content .about-feature-list .single span {

    font-size: 14px;

  }

  .working-process-wrapper3 a {

    gap: 20px;

  }

  .working-process-wrapper3 a .left-area .title {

    gap: 10px;

  }

  .working-process-wrapper3 a .left-area {

    gap: 20px;

  }

  .working-process-wrapper3 a .left-area .number {

    font-size: 20px;

  }

  .working-process-counter-area .counter-inner .content {

    width: 100%;

    text-align: center;

  }

  .tmp-why-choose-us-area3 .right-side-content .content {

    display: none;

  }

  .tmp-contact-area .left-side-content .social-bottom-area {

    flex-direction: column;

    gap: 20px;

    align-items: self-start;

  }

  .tmp-tab-two-start ul.nav li button {

    font-size: 18px;

  }

  .working-process-wrapper5 .content {

    bottom: -30%;

  }

  .main-footer-one-area.five .title {

    font-size: 22px;

    line-height: 32px;

  }

  header.header-seven .cart-search-area {

    display: none;

  }

  .banner-two-wrapper .sub-title span.tag {

    font-size: 14px;

  }

  .tmp-banner-main-area.area-5 .banner-two-wrapper .title-banner {

    font-size: 28px;

  }

  .about-wrapper {

    padding: 30px;

  }

  .about-wrapper .content .title {

    font-size: 18px;

  }

  .section-title-area-4 {

    flex-direction: column;

    align-items: self-start !important;

    gap: 20px;

    text-align: center;

      margin-top: 0px;

  }

  .banner-six-wrapper .title-banner {

    font-size: 28px;

    line-height: 38px;

  }

  .banner-six-wrapper .sub-title {

    font-size: 13px;

  }

  .banner-seven-main-wrapper .banner-three-wrapper .title-banner {

    font-size: 30px;

    line-height: 40px;

  }

  .service-wrapper5 .content-area {

    bottom: 0;

  }

  .service-wrapper5 .content-area p,

  .service-wrapper5 .content-area a {

    opacity: 1;

  }

  .tmp-banner-slider-area.banner-nine .banner-five-main-wrapper .banner-three-wrapper .title-banner {

    font-size: 32px;

  }

  .tmp-counter-area .counter-inner .content p {

    font-size: 14px;

    line-height: 1.4;

  }

  .tmp-counter-area .counter-inner .content {

    padding: 25px 0 25px 15px;

  }

  .tmp-counter-area.inner .counter-inner .content .title {

    font-size: 48px;

  }

  .tmp-bread-crumb-area .breadcrumb-inner .watermark {

    font-size: 42px;

  }

  .tmp-bread-crumb-area .breadcrumb-inner .title {

    font-size: 32px;

  }

  .contact-map {

    padding: 20px 15px;

  }

  .tmp-service-details-area .left-sidebar .single-wrapper {

    padding: 30px 20px;

  }

  .tmp-blog-details-area .left-content-area .top-area .blog-meta ul {

    gap: 12px;

  }

  .tmp-blog-details-area .left-content-area .top-area .blog-meta ul li {

    font-size: 14px;

  }

  .tmp-blog-details-area .left-content-area .quote-area {

    flex-direction: column;

  }

}

@media (max-width: 769px) {

  .tmp-about-area4 .right-side-content .about-feature-list-area {

    flex-direction: row;

  }

}

@media (max-width: 768px) {

  .tmp-about-area4 .right-side-content .about-feature-list-area {

    flex-direction: column;

  }

}

@media only screen and (max-width: 767px) {

  .pb_sm--0 {

    padding-bottom: 0 !important;

  }

}

.gallery-style-1.g-4 .gallery-single, .gallery-style-1.g-5 .gallery-single {

  border-radius: 10px;

  display: block;

  overflow: hidden;

}

.gallery-style-1 .gallery-single {

  position: relative;

  cursor: url(../images/gallery/cursor.svg), auto;

}

.gallery-style-1 .gallery-single:hover .item-overlay {

  opacity: 0;

  visibility: visible;

}

.gallery-style-1 .gallery-single .image-gallery {

  display: block;

  overflow: hidden;

  border-radius: 4px;

  height: 100%;

  width: 100%;

}

.gallery-style-1 .gallery-single .image-gallery.no-radious {

  border-radius: 0;

}

.gallery-style-1 .gallery-single img {

  transition: 0.3s;

  transform: scale(1);

  height: 100%;

}

.gallery-style-1 .gallery-single:hover img {

  transform: scale(1.0111);

}

.gallery-style-1 .gallery-single:hover .item-overlay span {

  transform: translate(-50%, -50%) scale(1);

  transition-delay: 0.1s;

}

.gallery-style-1 .gallery-single .item-overlay {

  position: absolute;

  top: 0px;

  background: rgba(134, 171, 66, 0.21);

  border-radius: 6px;

  width: 100%;

  height: 100%;

  opacity: 0;

  left: 0;

  visibility: hidden;

  overflow: hidden;

  -webkit-transition: 0.3s ease-in;

  -o-transition: 0.3s ease-in;

  transition: 0.3s ease-in;

}

.gallery-style-1 .gallery-single .item-overlay span {

  color: white;

  width: 60px;

  height: 60px;

  line-height: 64px;

  display: block;

  border-radius: 50%;

  text-align: center;

  background: var(--color-primary-2);

  font-size: 23px;

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%) scale(0.8);

  transition: 0.3s ease-in;

  transition-delay: 0.1s;

}

.gallery-style-1.gallery-as-instagram .gallery-single {

  border-radius: 10px;

  display: block;

  overflow: hidden;

}



.preview-slider-image-wrapper .large-gallery-slider {

  display: block;

  border-radius: 6px;

}

.preview-slider-image-wrapper .large-gallery-slider .single-priview-image {

  position: relative;

}

.preview-slider-image-wrapper .swiper-button-next,

.preview-slider-image-wrapper .swiper-button-prev {

  height: 55px;

  width: 55px;

  border-radius: 50%;

  background: var(--color-white);

  display: flex;

  align-items: center;

  justify-content: center;

  transition: 0.3s;

  opacity: 0;

}

.preview-slider-image-wrapper .swiper-button-next i,

.preview-slider-image-wrapper .swiper-button-prev i {

  color: var(--color-heading-1);

  font-size: 18px;

}

.preview-slider-image-wrapper .swiper-button-next::after,

.preview-slider-image-wrapper .swiper-button-prev::after {

  display: none;

}

.preview-slider-image-wrapper .swiper-button-next:hover,

.preview-slider-image-wrapper .swiper-button-prev:hover {

  background: var(--color-primary);

  color: var(--color-white);

  transform: scale(1.2);

}

.preview-slider-image-wrapper .swiper-button-next:hover i,

.preview-slider-image-wrapper .swiper-button-prev:hover i {

  color: var(--color-white);

}

.preview-slider-image-wrapper .swiper-button-next {

  right: 60px;

}

.preview-slider-image-wrapper .swiper-button-prev {

  left: 60px;

}

.preview-slider-image-wrapper:hover .swiper-button-next,

.preview-slider-image-wrapper:hover .swiper-button-prev {

  opacity: 1;

}

.preview-slider-image-wrapper:hover .swiper-button-next {

  right: 30px;

}

.preview-slider-image-wrapper:hover .swiper-button-prev {

  left: 30px;

}



.mfp-wrap {

  top: 0 !important;

  left: 0;

  width: 100%;

  height: 100% !important;

  z-index: 1043;

  position: fixed !important;

  outline: none !important;

  -webkit-backface-visibility: hidden;

}



.mfp-container, .mfp-bg {

  opacity: 0;

  -webkit-backface-visibility: hidden;

  -webkit-transition: all 0.3s ease-out;

  -moz-transition: all 0.3s ease-out;

  -o-transition: all 0.3s ease-out;

  transition: all 0.3s ease-out;

}



.mfp-ready .mfp-container {

  opacity: 1;

}



.mfp-bg {

  background: rgba(0, 0, 0, 0.8);

  opacity: 1;

  backdrop-filter: blur(15px);

}



.mfp-zoom-out-cur .mfp-image-holder .mfp-close {

  top: 16px;

  right: -24px;

  font-size: 30px;

  font-weight: 400;

  transition: 0.4s;

  opacity: 1;

  width: 50px;

  height: 50px;

  background: #192335;

  text-align: center;

  border-radius: 100%;

  display: flex;

  justify-content: center;

  align-items: center;

  padding: 0;

  color: var(--color-white);

}



.mfp-iframe-holder .mfp-close, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {

  top: -60px;

  right: -50px;

  font-size: 30px;

  font-weight: 400;

  transition: 0.4s;

  opacity: 1;

  width: 50px;

  height: 50px;

  background: rgba(25, 35, 53, 0.3137254902);

  text-align: center;

  border-radius: 100%;

  display: flex;

  justify-content: center;

  align-items: center;

  padding: 0;

  color: var(--color-white);

}



.mfp-with-zoom .mfp-image-holder .mfp-close {

  top: 14px;

  right: -26px;

  background: #2a2d33;

}

@media only screen and (max-width: 767px) {

  .mfp-with-zoom .mfp-image-holder .mfp-close {

    top: 56px;

    right: 20px;

  }

}

@media only screen and (max-width: 576px) {

  .mfp-with-zoom .mfp-image-holder .mfp-close {

    top: 47px;

    right: 9px;

  }

}



.mfp-iframe-scaler iframe {

  border-radius: 10px;

}



.demo-orange .gallery-style-1 .gallery-single .item-overlay {

  background: rgba(255, 112, 41, 0.19);

}



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

 tool tip 

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

.profile-share {

  display: flex;

  align-items: center;

  flex-wrap: wrap;

}

.profile-share a {

  position: relative;

  z-index: 1;

  transition: 0.3s;

}

.profile-share a:nth-child(2) {

  margin-left: -12px;

}

.profile-share a:nth-child(3) {

  margin-left: -12px;

}

.profile-share a img {

  max-width: 60px;

  border-radius: 50%;

  border: 3px solid var(--color-border);

  transition: 0.3s;

  box-shadow: var(--shadow-1);

}

.profile-share a.more-author-text {

  color: var(--color-body);

  display: inline-block;

  padding-left: 7px;

}

.profile-share a.more-author-text:hover {

  transform: none;

  color: var(--color-heading-1);

}

.profile-share a:hover {

  z-index: 2;

  transform: translateY(-3px) scale(1.1);

}

.profile-share .more-author-text {

  margin: 10px;

  margin-left: 20px;

  position: relative;

  z-index: 10;

}

.profile-share .more-author-text .total-join-students {

  margin-bottom: 4px;

  font-size: 18px;

  font-weight: 600;

  letter-spacing: -0.5px;

}

.profile-share .more-author-text .subtitle {

  font-size: 16px;

  letter-spacing: -0.5px;

  margin-bottom: 0;

}



.avatar {

  position: relative;

}

.avatar.left::before {

  right: 124%;

  top: 8%;

  left: auto;

  transform: translateX(0) translateY(0) scale(0);

}

.avatar.left::after {

  border-left-color: var(--color-heading-1);

  top: 50%;

  left: -8%;

  border-top-color: transparent;

}

.avatar.left:hover::before {

  transform: translateX(0) translateY(0) scale(1);

}

.avatar::after, .avatar::before {

  --scale: 0;

  --arrow-size: 8px;

  position: absolute;

  top: -5px;

  left: 50%;

  transform: translateX(-50%) translateY(var(--translate-y, 0)) scale(var(--scale));

  transition: 150ms transform;

  transform-origin: bottom center;

}

.avatar::before {

  --translate-y: calc(-100% - var(--arrow-size));

  content: attr(data-tooltip);

  color: var(--color-white);

  padding: 5px 8px;

  background: var(--color-heading-1);

  width: max-content;

  border-radius: 5px;

  text-align: center;

  font-size: 12px;

  margin: 1px;

  z-index: 5;

}

.avatar::after {

  --translate-y: calc(-1 * var(--arrow-size));

  content: "";

  border: var(--arrow-size) solid transparent;

  border-top-color: var(--color-heading-1);

}

.avatar:hover::before, .avatar:hover::after {

  --scale: 1;

}



.tmp-avatars {

  min-width: 70px;

  max-width: 70px;

}

.tmp-avatars.size-lg {

  min-width: 120px;

  max-width: 120px;

  width: 120px;

  height: 120px;

}

.tmp-avatars.size-sm {

  min-width: 52px;

  max-width: 52px;

}

.tmp-avatars img {

  border-radius: 100%;

  width: 100%;

  background: var(--border-color);

  padding: 4px;

  border: 2px solid var(--color-border);

  object-fit: cover;

}



.inversweb-category-menu-wrapper {

  height: 50px;

  display: flex;

  align-items: center;

  position: relative;

}

.inversweb-category-menu-wrapper:hover .category-dropdown-menu {

  top: 100%;

  visibility: visible;

  opacity: 1;

  clip: rect(0px, 100vw, 200vh, -30px);

  transition: clip 0.9s ease-in-out, opacity 0.4s ease-in-out;

}

.inversweb-category-menu-wrapper .tmp-category-btn {

  display: flex;

  align-items: center;

  cursor: pointer;

  color: var(--color-heading-1);

  font-size: 16px;

  font-weight: 500;

  background: rgba(0, 0, 0, 0.04);

  padding: 12px 20px;

  border-radius: 33px;

}

.inversweb-category-menu-wrapper .tmp-category-btn .category-text {

  display: inline-block;

  padding-left: 6px;

  font-size: 16px;

  line-height: 1.2;

}

.inversweb-category-menu-wrapper .tmp-offcanvas-trigger {

  margin-top: 2px;

}

.inversweb-category-menu-wrapper .category-dropdown-menu {

  min-width: 240px;

  height: auto;

  z-index: 90;

  text-align: left;

  padding: 0;

  border-radius: 0 0 10px 10px;

  background-color: var(--color-white);

  box-shadow: var(--shadow-1);

  display: flex;

  flex-direction: column;

  position: absolute;

  top: 100%;

  left: 0;

  visibility: hidden;

  clip: rect(0px, 200vw, 0, 0px);

  opacity: 0;

  transition: opacity 0.5s ease-in-out, clip 0.9s ease-in-out, visibility 0s 0.5s;

  transform: translateZ(0);

}

.inversweb-category-menu-wrapper .category-dropdown-menu .category-menu-item {

  display: flex;

  padding: 20px;

}

.inversweb-category-menu-wrapper .category-dropdown-menu .category-menu-item .tmp-vertical-nav {

  min-width: 230px;

  width: auto;

  border-right: 1px solid rgba(230, 227, 241, 0.3098039216);

  padding-right: 20px;

}

.inversweb-category-menu-wrapper .category-dropdown-menu .category-menu-item .tmp-vertical-nav-list-wrapper {

  margin: 0;

  list-style: none;

  padding: 0;

}

.inversweb-category-menu-wrapper .category-dropdown-menu .category-menu-item .tmp-vertical-nav-list-wrapper li {

  margin-top: 0;

  margin-bottom: 0;

  position: relative;

  z-index: 1;

}

.inversweb-category-menu-wrapper .category-dropdown-menu .category-menu-item .tmp-vertical-nav-list-wrapper li.active a {

  color: var(--color-primary);

  background: rgba(0, 0, 0, 0.04);

}

.inversweb-category-menu-wrapper .category-dropdown-menu .category-menu-item .tmp-vertical-nav-list-wrapper li a {

  font-weight: 500;

  padding: 11px 20px;

  font-size: 14px;

  display: block;

  color: var(--color-body);

  margin: 0;

  border-radius: 3px;

  line-height: 1;

}

.inversweb-category-menu-wrapper .category-dropdown-menu .category-menu-item .tmp-vertical-nav-list-wrapper li a.left-center {

  position: absolute;

  left: 0px;

  top: 50%;

  transform: translateY(-50%);

  color: #fff;

}

.inversweb-category-menu-wrapper .category-dropdown-menu .category-menu-item .tmp-vertical-nav-list-wrapper li.single-category {

  border-radius: 3px;

  display: block;

  overflow: hidden;

  margin-top: 10px;

}

.inversweb-category-menu-wrapper .category-dropdown-menu .category-menu-item .tmp-vertical-nav-list-wrapper li.single-category:first-child {

  margin-top: 0;

}

.inversweb-category-menu-wrapper .category-dropdown-menu .category-menu-item .tmp-vertical-nav-list-wrapper li.single-category::before {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  background: var(--color-primary);

  z-index: 0;

  mix-blend-mode: multiply;

}

.inversweb-category-menu-wrapper .category-dropdown-menu .category-menu-item .tmp-vertical-nav-list-wrapper li.single-category.with-image {

  height: 28px;

}

.inversweb-category-menu-wrapper .category-dropdown-menu .tmp-vertical-nav-content {

  padding-left: 20px;

  height: 100%;

  width: auto;

  min-width: 320px;

}

.inversweb-category-menu-wrapper .tmp-vertical-inner {

  display: none;

}



.header-info {

  padding: 0 10px;

}

@media only screen and (max-width: 991px) {

  .header-info .tmp-dropdown-menu {

    display: flex !important;

  }

}

.header-info .tmp-dropdown-menu .has-child-menu {

  display: flex;

  align-items: center;

  cursor: pointer;

  position: relative;

}

.header-info .tmp-dropdown-menu .has-child-menu > a span {

  font-weight: 400;

}

.header-info .tmp-dropdown-menu .has-child-menu > a i {

  font-size: 14px;

}

.header-info .tmp-dropdown-menu .has-child-menu a .left-image {

  width: 20px;

  height: auto;

  margin-right: 5px;

}

.header-info .tmp-dropdown-menu .has-child-menu a span {

  display: inline-block;

  color: #fff;

  font-size: 14px;

}

.header-info .tmp-dropdown-menu .has-child-menu a .right-icon {

  display: inline-block;

  font-size: 12px;

  color: #fff;

}

.header-info .tmp-dropdown-menu .has-child-menu:hover .sub-menu {

  top: 100%;

  visibility: visible;

  opacity: 1;

  clip: rect(0px, 100vw, 200vh, -30px);

  transition: clip 0.6s linear, opacity 0.4s linear;

}

.header-info .tmp-dropdown-menu .has-child-menu:hover .sub-menu.hover-reverse {

  left: auto;

  right: 0;

}

.header-info .tmp-dropdown-menu .has-child-menu:hover > a .right-icon {

  transform: rotate(180deg);

  margin-top: 2px;

}

.header-info .tmp-dropdown-menu .sub-menu {

  border-top: 1px solid rgba(230, 227, 241, 0.3098039216);

  background: #fff;

  box-shadow: var(--shadow-1);

  min-width: 170px;

  padding: 12px 0 !important;

  margin: 0;

  list-style-type: none;

  z-index: 10;

  text-align: start;

  border-radius: 6px;

  right: 0;

  flex-direction: column;

  position: absolute;

  top: 100%;

  left: 0;

  visibility: hidden;

  clip: rect(0px, 200vw, 0, 0px);

  opacity: 0;

  transition: opacity 0.4s linear, clip 0.6s linear, visibility 0s 0.4s;

  transform: translateZ(0);

  gap: 0 !important;

}

.header-info .tmp-dropdown-menu .sub-menu.hover-reverse {

  left: auto;

  right: 0;

  min-width: 100px;

}

.header-info .tmp-dropdown-menu .sub-menu li {

  margin: 0;

  list-style: none;

  display: block;

  width: 100%;

}

.header-info .tmp-dropdown-menu .sub-menu li a {

  margin: 2px 10px;

  padding: 4px 12px;

  background: var(--color-white);

  border-radius: 6px;

  display: flex;

  align-items: center;

  font-size: 15px;

  font-weight: 400;

  color: var(--color-heading-1);

}

.header-info .tmp-dropdown-menu .sub-menu li a .menu-item {

  color: var(--color-heading-1);

}

.header-info .tmp-dropdown-menu .sub-menu li a:hover {

  color: var(--color-primary);

  background: rgba(0, 0, 0, 0.04);

}



.account-area-wrapper {

  position: relative;

  display: flex;

  padding: 20px 10px;

}

.account-area-wrapper > a {

  color: var(--color-heading-1);

}

.account-area-wrapper > a span {

  font-weight: 500;

}

.account-area-wrapper .account-dropdown-wrapper {

  position: absolute;

  left: 0;

  top: 100%;

  z-index: 99;

  width: 200px;

  background-color: #fff;

  box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.05);

  padding: 20px 10px 20px;

  opacity: 0;

  visibility: hidden;

  border-radius: 0 0 6px 6px;

  clip: rect(0px, 200vw, 0, 0px);

  transform: translateZ(0);

  transition: opacity 0.5s ease-in-out, clip 0.9s ease-in-out, visibility 0s 0.5s;

}

.account-area-wrapper .account-dropdown-wrapper ul {

  list-style: none;

  padding: 0;

  margin: 0;

}

.account-area-wrapper .account-dropdown-wrapper ul li a {

  padding: 8px 12px;

  border-radius: 3px;

  display: flex;

  align-items: center;

  gap: 10px;

  transition: 0.3s;

}

.account-area-wrapper .account-dropdown-wrapper ul li a:hover {

  background: rgba(0, 0, 0, 0.04);

}

.account-area-wrapper .account-dropdown-wrapper ul li .profile-wrapper {

  display: flex;

  align-items: center;

  gap: 15px;

}

.account-area-wrapper .account-dropdown-wrapper ul li .profile-wrapper .admin-image img {

  width: 52px;

  min-width: 52px;

  height: 52px;

  border-radius: 100%;

  border: 2px solid var(--color-primary);

  box-shadow: var(--shadow-1);

  padding: 3px;

}

.account-area-wrapper .account-dropdown-wrapper ul li .profile-wrapper .admin-info .name {

  font-size: 18px;

  margin-bottom: 5px;

  font-weight: 500;

  color: var(--color-heading-1);

}

.account-area-wrapper .account-dropdown-wrapper ul li .profile-wrapper .admin-info a {

  padding: 0;

  color: var(--color-primary);

  line-height: 1;

}

.account-area-wrapper .account-dropdown-wrapper ul li .profile-wrapper .admin-info a:hover {

  background: transparent;

}

.account-area-wrapper:hover .account-dropdown-wrapper {

  opacity: 1;

  visibility: visible;

  top: 100%;

  clip: rect(0px, 100vw, 200vh, -30px);

  transition: clip 0.9s ease-in-out, opacity 0.4s ease-in-out;

}



.why-choose-ful-width-area .why-choose-us-img-area {

  position: relative;

  background: url(../images/why-choose-us/08.webp) no-repeat center center;

  background-size: cover !important;

  padding: 100px 15px;

  height: 100%;

  min-height: 350px;

  border-radius: 6px;

  filter: grayscale(0.5);

  transition: 0.3s;

}

@media only screen and (max-width: 1199px) {

  .why-choose-ful-width-area .why-choose-us-img-area {

    min-height: 495px;

  }

}

@media only screen and (max-width: 991px) {

  .why-choose-ful-width-area .why-choose-us-img-area {

    min-height: 420px;

  }

}

.why-choose-ful-width-area .why-choose-us-img-area.in-about {

  background: url(../images/why-choose-us/09.webp) no-repeat center center;

}

.why-choose-ful-width-area .why-choose-us-img-area.in-hydro-power {

  background: url(../images/why-choose-us/11.webp) no-repeat center center;

}

.why-choose-ful-width-area .why-choose-us-img-area.in-interior {

  background: url(../images/why-choose-us/12.webp) no-repeat center center;

}

.why-choose-ful-width-area .why-choose-us-img-area:hover {

  filter: grayscale(0);

}

.why-choose-ful-width-area.safety-area .why-choose-us-img-area {

  border-radius: 6px;

  background-size: cover;

}

.why-choose-ful-width-area.safety-area .why-choose-us-img-area.in-safety {

  background: url(../images/why-choose-us/10.webp) no-repeat center center;

}

@media only screen and (max-width: 1199px) {

  .why-choose-ful-width-area.safety-area .why-choose-us-img-area.in-safety {

    margin-top: 30px;

    height: auto;

  }

}



.why-choose-us-fluid-right-content {

  padding: 100px 100px 100px 70px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .why-choose-us-fluid-right-content {

    padding: 50px 70px;

  }

}

@media only screen and (max-width: 1199px) {

  .why-choose-us-fluid-right-content {

    padding: 0px 0 25px 15px;

  }

}

@media only screen and (max-width: 767px) {

  .why-choose-us-fluid-right-content {

    padding: 0 0 0 10px;

  }

}

.why-choose-us-fluid-right-content .section-title {

  margin-bottom: 10px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .why-choose-us-fluid-right-content .section-title {

    font-size: 36px;

    line-height: 1.3;

  }

}

.why-choose-us-fluid-right-content .why-choose-feature-wrapper .single-feature {

  display: flex;

  align-items: flex-start;

  gap: 20px;

  margin-bottom: 30px;

}

@media only screen and (max-width: 479px) {

  .why-choose-us-fluid-right-content .why-choose-feature-wrapper .single-feature {

    flex-direction: column;

    align-items: center;

    gap: 15px;

  }

}

.why-choose-us-fluid-right-content .why-choose-feature-wrapper .single-feature:hover .icon i {

  animation: bounceIn 0.8s ease;

}

.why-choose-us-fluid-right-content .why-choose-feature-wrapper .single-feature:last-child {

  margin-bottom: 0;

}

.why-choose-us-fluid-right-content .why-choose-feature-wrapper .single-feature .icon {

  min-width: 70px;

  height: 70px;

  border-radius: 50%;

  background: var(--primary-50);

  display: flex;

  align-items: center;

  justify-content: center;

}

.why-choose-us-fluid-right-content .why-choose-feature-wrapper .single-feature .icon i {

  font-size: 30px;

  color: var(--color-primary);

}

.why-choose-us-fluid-right-content .why-choose-feature-wrapper .single-feature .content {

  width: calc(100% - 180px);

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .why-choose-us-fluid-right-content .why-choose-feature-wrapper .single-feature .content {

    width: 100%;

  }

}

@media only screen and (max-width: 1199px) {

  .why-choose-us-fluid-right-content .why-choose-feature-wrapper .single-feature .content {

    width: 100%;

      text-align: center;

  }

    .working-process-wrapper8{

        text-align: center;

    }

}

@media only screen and (max-width: 1199px) {

  .why-choose-us-fluid-right-content .why-choose-feature-wrapper .single-feature .content p.desc {

    max-width: 85%;

  }

}

@media only screen and (max-width: 767px) {

  .why-choose-us-fluid-right-content .why-choose-feature-wrapper .single-feature .content p.desc {

    max-width: 100%;

  }

}

.why-choose-us-fluid-right-content .why-choose-feature-wrapper .single-feature .content .title {

  margin-bottom: 7px;

  font-size: 24px;

  line-height: 1.4;

}



.tmp-why-choose-item-wrapper .single-item-wrapper {

  display: flex;

  align-items: center;

  gap: 20px;

  margin-bottom: 30px;

}

@media only screen and (max-width: 479px) {

  .tmp-why-choose-item-wrapper .single-item-wrapper {

    align-items: flex-start;

    gap: 15px;

    flex-wrap: wrap;

  }

}

.tmp-why-choose-item-wrapper .single-item-wrapper:hover .icon svg {

  animation: bounceIn 0.8s ease;

}

.tmp-why-choose-item-wrapper .single-item-wrapper:last-child {

  margin-bottom: 0;

}

.tmp-why-choose-item-wrapper .single-item-wrapper .icon {

  height: 80px;

  width: 80px;

  border-radius: 50%;

  background: var(--primary-100);

  display: flex;

  align-items: center;

  justify-content: center;

}

@media only screen and (max-width: 576px) {

  .tmp-why-choose-item-wrapper .single-item-wrapper .icon {

    height: 65px;

    min-width: 65px;

    width: 65px;

  }

}

@media only screen and (max-width: 479px) {

  .tmp-why-choose-item-wrapper .single-item-wrapper .icon {

    height: 65px;

    min-width: 65px;

  }

}

.tmp-why-choose-item-wrapper .single-item-wrapper .icon svg {

  max-width: 40px;

}

@media only screen and (max-width: 479px) {

  .tmp-why-choose-item-wrapper .single-item-wrapper .icon svg {

    max-width: 30px;

  }

}

.tmp-why-choose-item-wrapper .single-item-wrapper .icon svg path {

  fill: var(--color-primary);

}

.tmp-why-choose-item-wrapper .single-item-wrapper .chy-chsse-single-content .title {

  margin-bottom: 5px;

  font-size: 20px;

  line-height: 1.3;

}



.button-area-why-choose {

  display: flex;

  align-items: center;

  gap: 25px;

  margin-top: 40px;

}

@media only screen and (max-width: 767px) {

  .button-area-why-choose {

    flex-wrap: wrap;

  }

}

.button-area-why-choose .text-btn {

  display: flex;

  align-items: center;

  gap: 10px;

  font-weight: 600;

  color: var(--color-heading-1);

  transition: 0.3s;

}

.button-area-why-choose .text-btn:hover {

  color: var(--color-primary);

}



.filter-button-1 {

  padding: 0 25px;

  font-size: 18px;

  height: 50px;

  line-height: 48px;

  max-width: max-content;

  margin-left: auto;

  border: none;

  display: flex;

  align-items: center;

  gap: 5px;

}

.filter-button-1 i {

  font-weight: 400;

}

.filter-button-1.open i {

  font-weight: 400;

  font-size: 16px;

}

.filter-button-1.open i::before {

  content: "\e17b";

}



.filter-shorting-list-wrapper {

  display: flex;

  align-items: center;

  gap: 30px;

}

@media only screen and (max-width: 576px) {

  .filter-shorting-list-wrapper {

    width: 100%;

    flex-wrap: wrap;

    gap: 15px;

  }

}

@media only screen and (max-width: 576px) {

  .filter-shorting-list-wrapper .tmp-search-filter {

    width: 100%;

  }

}

.filter-shorting-list-wrapper .tmp-search-filter .tmp-search {

  position: relative;

}

@media only screen and (max-width: 576px) {

  .filter-shorting-list-wrapper .tmp-search-filter .tmp-search {

    width: 100%;

  }

}

.filter-shorting-list-wrapper .tmp-search-filter .tmp-search input {

  height: 50px;

  border-radius: 33px;

  width: 450px;

  border: 1px solid var(--color-border);

}

@media only screen and (max-width: 767px) {

  .filter-shorting-list-wrapper .tmp-search-filter .tmp-search input {

    width: 320px;

  }

}

@media only screen and (max-width: 576px) {

  .filter-shorting-list-wrapper .tmp-search-filter .tmp-search input {

    width: 100%;

  }

}

.filter-shorting-list-wrapper .tmp-search-filter .tmp-search input:focus {

  border-color: var(--color-primary);

}

.filter-shorting-list-wrapper .tmp-search-filter .tmp-search button {

  position: absolute;

  right: 8px;

  border: none;

  padding: 12px 12px;

  top: 50%;

  transform: translateY(-50%);

  height: auto;

}



.default-exp-expand {

  display: none;

}



.tmp-filter-widget-wrapper {

  box-shadow: var(--shadow-1);

  padding: 30px;

  border-radius: 6px;

  background: #fff;

  border: none;

  outline: none;

  cursor: pointer;

  position: relative;

  color: var(--color-heading-1);

}

.tmp-filter-widget-wrapper .tmp-single-widget {

  background: var(--color-white);

  padding-top: 30px;

}

.tmp-filter-widget-wrapper .tmp-single-widget .inner .tmp-widget-title {

  font-size: 12px;

  padding-bottom: 15px;

  border-bottom: 2px solid var(--color-border);

  margin-bottom: 15px;

  color: var(--color-heading-1);

  text-transform: uppercase;

  letter-spacing: 0.5px;

  opacity: 0.8;

}

.tmp-filter-widget-wrapper .tmp-single-widget .inner .tmp-check-group {

  position: relative;

  margin-top: 12px;

  margin-bottom: 12px;

}

.tmp-filter-widget-wrapper .tmp-single-widget .inner .tmp-check-group label {

  position: relative;

  font-size: 15px;

  line-height: 1.1;

  display: flex;

  justify-content: space-between;

}

.tmp-filter-widget-wrapper .tmp-single-widget .inner .tmp-check-group label span.tmp-lable-count {

  background: #f7f7f7;

  padding: 5px 7px;

  font-size: 12px;

  display: flex;

  height: 22px;

  align-items: center;

  border-radius: 4px;

}

.tmp-filter-widget-wrapper .tmp-single-widget .inner .tmp-check-group label::before {

  content: " ";

  position: absolute;

  top: 0;

  left: 0;

  width: 14px;

  height: 14px;

  background-color: #fff;

  border: 2px solid var(--color-border);

  border-radius: 2px;

  transition: all 0.3s;

}

.tmp-filter-widget-wrapper .tmp-single-widget .inner .tmp-check-group label::after {

  content: " ";

  position: absolute;

  top: 3px;

  left: 2px;

  width: 10px;

  height: 5px;

  background-color: transparent;

  border-bottom: 2px solid #fff;

  border-left: 2px solid #fff;

  border-radius: 2px;

  transform: rotate(-45deg);

  opacity: 1;

  transition: all 0.3s;

}

.tmp-filter-widget-wrapper .tmp-single-widget .inner .tmp-check-group input[type=checkbox]:checked ~ label::before, .tmp-filter-widget-wrapper .tmp-single-widget .inner .tmp-check-group input[type=radio]:checked ~ label::before {

  background-color: var(--color-primary);

  border-color: var(--color-primary);

}

.tmp-filter-widget-wrapper .tmp-single-widget .rating {

  display: flex;

  align-items: center;

  margin-top: -3px;

  gap: 2px;

}

.tmp-filter-widget-wrapper .tmp-single-widget .rating i {

  font-size: 13px;

  color: #FF9747;

  transition: 0.3s;

}

.tmp-filter-widget-wrapper .tmp-single-widget:first-child {

  padding-top: 0;

}

.tmp-filter-widget-wrapper .has-show-more .has-show-more-inner-content {

  max-height: 120px;

  overflow: hidden;

}

.tmp-filter-widget-wrapper .tmp-show-more-btn {

  font-size: 14px;

  font-weight: 700;

  color: var(--color-primary);

  display: block;

  margin-top: 5px;

  position: relative;

  padding: 3px 0;

  cursor: pointer;

}

.tmp-filter-widget-wrapper .has-show-more.active .has-show-more-inner-content {

  max-height: inherit !important;

}

.tmp-filter-widget-wrapper .tmp-show-more-btn::before {

  background: linear-gradient(rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%);

  position: absolute;

  content: "";

  left: 0;

  bottom: 100%;

  width: 100%;

  height: 80px;

}

.tmp-filter-widget-wrapper .tmp-show-more-btn::after {

  content: "\f078";

  position: absolute;

  font-family: "fontawesome";

  right: 0;

  top: 50%;

  transform: translateY(-50%);

}

.tmp-filter-widget-wrapper .tmp-show-more-btn.active::before {

  display: none;

}

.tmp-filter-widget-wrapper .tmp-show-more-btn.active::after {

  content: "\f077";

}



.single-events-wrapper {

  overflow: hidden;

  box-shadow: 0px 6px 34px rgba(215, 216, 222, 0.41);

  padding: 20px;

  border-radius: 6px;

  background: var(--color-white);

  position: relative;

  height: 100%;

  display: flex;

  align-items: center;

  gap: 25px;

  transition: 0.4s;

}

@media only screen and (max-width: 1199px) {

  .single-events-wrapper {

    padding: 20px;

  }

}

@media only screen and (max-width: 767px) {

  .single-events-wrapper {

    padding: 18px;

  }

}

@media only screen and (max-width: 576px) {

  .single-events-wrapper {

    flex-direction: column;

    align-items: flex-start;

    gap: 15px;

  }

}

.single-events-wrapper .thumbnail {

  max-width: 231px;

  display: block;

  overflow: hidden;

  border-radius: 4px;

}

@media only screen and (max-width: 576px) {

  .single-events-wrapper .thumbnail {

    max-width: 100%;

  }

}

.single-events-wrapper .thumbnail img {

  transition: 0.3s;

}

@media only screen and (max-width: 576px) {

  .single-events-wrapper .thumbnail img {

    width: 100%;

  }

}

@media only screen and (max-width: 767px) {

  .single-events-wrapper .inner-content {

    padding-top: 10px;

  }

}

.single-events-wrapper .inner-content .top-area {

  display: flex;

  align-items: center;

  gap: 30px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .single-events-wrapper .inner-content .top-area {

    gap: 10px;

  }

}

@media only screen and (max-width: 1199px) {

  .single-events-wrapper .inner-content .top-area {

    align-items: flex-start;

    gap: 5px;

    flex-wrap: wrap;

  }

}

@media only screen and (max-width: 767px) {

  .single-events-wrapper .inner-content .top-area {

    flex-direction: column;

  }

}

@media only screen and (max-width: 576px) {

  .single-events-wrapper .inner-content .top-area {

    flex-direction: row;

    gap: 15px;

  }

}

.single-events-wrapper .inner-content .top-area .single {

  display: flex;

  align-items: center;

  gap: 10px;

}

.single-events-wrapper .inner-content .top-area .single p {

  margin: 0;

  font-size: 14px;

  line-height: 1;

}

.single-events-wrapper .inner-content .title {

  font-size: 20px;

  line-height: 1.4;

  margin-bottom: 15px;

  margin-top: 10px;

  transition: 0.3s;

}

@media only screen and (max-width: 1199px) {

  .single-events-wrapper .inner-content .title {

    font-size: 20px;

  }

}

.single-events-wrapper .inner-content .title:hover {

  color: var(--color-primary);

}

.single-events-wrapper:hover {

  transform: scale(1.02);

}

.single-events-wrapper:hover .thumbnail img {

  transform: scale(1.1);

}



@media only screen and (max-width: 767px) {

  .event-title-area {

    flex-direction: column;

    gap: 15px;

    align-items: flex-start !important;

  }

}



.single-events-area-grid {

  padding: 30px;

  border-radius: 6px;

  overflow: hidden;

  box-shadow: 0px 4px 13px rgba(215, 216, 222, 0.41);

  background: var(--color-white);

  transition: 0.3s;

  height: 100%;

}

@media only screen and (max-width: 767px) {

  .single-events-area-grid {

    padding: 20px;

  }

}

.single-events-area-grid .thumbnail {

  display: block;

  overflow: hidden;

  margin-bottom: 30px;

  border-radius: 6px;

}

.single-events-area-grid .thumbnail img {

  transition: 0.5s;

  width: 100%;

}

.single-events-area-grid .inner-content .top-area {

  display: flex;

  align-items: center;

  gap: 20px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .single-events-area-grid .inner-content .top-area {

    gap: 10px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .single-events-area-grid .inner-content .top-area {

    gap: 7px;

  }

}

.single-events-area-grid .inner-content .top-area .single {

  display: flex;

  align-items: center;

  gap: 5px;

}

.single-events-area-grid .inner-content .top-area .single i {

  font-size: 14px;

}

.single-events-area-grid .inner-content .top-area .single p {

  margin: 0;

  font-size: 14px;

  line-height: 1;

}

.single-events-area-grid .inner-content .title {

  font-size: 20px;

  line-height: 1.3;

  margin-bottom: 15px;

  margin-top: 10px;

  transition: 0.3s;

}

@media only screen and (max-width: 1199px) {

  .single-events-area-grid .inner-content .title {

    font-size: 16px;

  }

}

@media only screen and (max-width: 767px) {

  .single-events-area-grid .inner-content .title {

    font-size: 20px;

  }

}

.single-events-area-grid .inner-content .title:hover {

  color: var(--color-primary);

}

.single-events-area-grid:hover {

  transform: scale(1.02);

}

.single-events-area-grid:hover .thumbnail img {

  transform: scale(1.1);

}



.mySwiper-events-grid {

  margin: -15px;

  padding: 15px;

}



.mt-dec-100-ed {

  margin-top: -100px;

}

@media only screen and (max-width: 767px) {

  .mt-dec-100-ed {

    margin-top: 0;

    padding-top: 60px;

  }

}



.events-details-wrapper-start {

  border: 1px solid var(--color-border);

  background: var(--color-white);

  border-radius: 8px;

  overflow: hidden;

  padding-bottom: 30px;

}

.events-details-wrapper-start .thumbnail-events-details {

  position: relative;

}

.events-details-wrapper-start .action-area-events {

  padding: 25px;

  background: var(--color-white);

  margin: 0 30px;

  margin-top: -70px;

  z-index: 10;

  position: relative;

  border-radius: 6px;

  box-shadow: var(--shadow-1);

  display: flex;

  align-items: center;

  justify-content: space-between;

}

@media only screen and (max-width: 767px) {

  .events-details-wrapper-start .action-area-events {

    flex-wrap: wrap;

    margin-top: 30px;

  }

}

@media only screen and (max-width: 576px) {

  .events-details-wrapper-start .action-area-events {

    margin: 0;

    margin-top: 0;

  }

}

.events-details-wrapper-start .action-area-events .small-meta-details {

  flex-basis: 33%;

}

.events-details-wrapper-start .action-area-events .small-meta-details .top {

  display: flex;

  align-items: center;

  gap: 10px;

}

@media only screen and (max-width: 576px) {

  .events-details-wrapper-start .action-area-events .small-meta-details .top {

    flex-direction: column;

    align-items: flex-start;

  }

}

.events-details-wrapper-start .action-area-events .small-meta-details .top .icon {

  height: 40px;

  width: 40px;

  border-radius: 50%;

  background: var(--primary-100);

  display: flex;

  align-items: center;

  justify-content: center;

}

.events-details-wrapper-start .action-area-events .small-meta-details .top .icon i {

  color: var(--color-primary);

}

.events-details-wrapper-start .action-area-events .small-meta-details .top p.disc {

  font-size: 22px;

  font-weight: 500;

  color: var(--color-heading-1);

  margin: 0;

}

.events-details-wrapper-start .action-area-events .small-meta-details .main {

  font-size: 16px;

  margin-bottom: 0;

  margin-top: 5px;

  padding-left: 50px;

  display: flex;

  align-items: center;

  gap: 10px;

}

@media only screen and (max-width: 576px) {

  .events-details-wrapper-start .action-area-events .small-meta-details .main {

    padding-left: 0;

    font-size: 14px;

  }

}

.events-details-wrapper-start .action-area-events .small-meta-details .main .current {

  font-weight: 600;

  font-size: 24px;

  color: var(--color-heading-1);

}

.events-details-wrapper-start .action-area-events .small-meta-details .main .off {

  font-size: 18px;

  text-decoration: line-through;

  font-weight: 500;

  opacity: 0.4;

}

.events-details-wrapper-start .action-area-events .events-info-wrapper {

  display: flex;

  align-items: flex-start;

  gap: 20px;

  flex-basis: 80%;

}

@media only screen and (max-width: 1199px) {

  .events-details-wrapper-start .action-area-events .events-info-wrapper {

    flex-wrap: wrap;

  }

}

@media only screen and (max-width: 767px) {

  .events-details-wrapper-start .action-area-events .events-info-wrapper {

    flex-basis: 100%;

  }

}

.events-details-wrapper-start .action-area-events .events-info-wrapper .small-meta-details {

  flex-basis: 33%;

}

@media only screen and (max-width: 1199px) {

  .events-details-wrapper-start .action-area-events .events-info-wrapper .small-meta-details {

    flex-basis: 48%;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .events-details-wrapper-start .action-area-events .events-info-wrapper .small-meta-details {

    flex-basis: 80%;

  }

}

@media only screen and (max-width: 767px) {

  .events-details-wrapper-start .action-area-events .events-info-wrapper .small-meta-details {

    flex-basis: 100%;

  }

}

.events-details-wrapper-start .action-area-events .action-button-area {

  display: flex;

  justify-content: flex-end;

  align-items: center;

}

@media only screen and (max-width: 767px) {

  .events-details-wrapper-start .action-area-events .action-button-area {

    margin-top: 30px;

  }

}

.events-details-wrapper-start .action-area-events .action-button-area .tmp-btn {

  display: flex;

  align-items: center;

  gap: 10px;

}

.events-details-wrapper-start .action-area-events .action-button-area .tmp-btn i {

  font-size: 16px;

  top: -1px;

  font-weight: 400;

}



.events-faqs-area .accordion-one .accordion-item h2 {

  margin-bottom: 0;

}

.events-faqs-area .accordion-one .accordion-item .accordion-body p.desc {

  padding-right: 15%;

}

@media only screen and (max-width: 767px) {

  .events-faqs-area .accordion-one .accordion-item .accordion-body p.desc {

    padding-right: 0;

  }

}



.bg-box-shadow {

  box-shadow: var(--shadow-1);

  background: var(--color-white);

  padding: 30px;

  margin: 0 30px;

  margin-top: 30px;

  border-radius: 6px;

}

@media only screen and (max-width: 576px) {

  .bg-box-shadow {

    padding: 12px;

  }

}

@media only screen and (max-width: 479px) {

  .bg-box-shadow {

    margin: 0;

    margin-top: 30px;

  }

}



.invers-compare-table {

  margin: 0;

}

.invers-compare-table tbody tr {

  border-width: 0;

  display: flex;

}

.invers-compare-table tbody .invers-product-feature-name {

  color: var(--color-primary);

  font-family: var(--font-primary);

  font-size: var(--font-size-b1);

  line-height: var(--line-height-b1);

  font-weight: 700;

  margin-bottom: 0;

}

.invers-compare-table tbody tr td {

  border-width: 0 0 1px 0;

  flex: 0 0 20%;

  padding: 12px 5px;

  min-width: 254px;

}

.invers-compare-table .invers-compare-values {

  min-width: 224px;

}

.invers-compare-table .invers-compare-values span.compare-icon {

  margin-bottom: 30px;

  display: block;

  opacity: 0.2;

}

.invers-compare-table .invers-compare-values * {

  text-decoration: none;

}

.invers-compare-table .invers-compare-values .invers-product-item-category {

  color: var(--color-primary);

  font-family: var(--font-primary);

  font-size: 14px;

  line-height: 1.4;

  font-weight: 500;

  margin-bottom: 4px;

}

.invers-compare-table .invers-compare-values .invers-product-item-title {

  font-size: 16px;

  line-height: 1.3;

}

.invers-compare-table .invers-compare-values .invers-card-rating {

  display: flex;

  gap: 8px;

}

.invers-compare-table .invers-compare-values .tmp-btn.btn-sm {

  padding: 0 14px;

  font-size: 16px;

  height: 37px;

  line-height: 37px;

  font-size: 14px;

}

.invers-compare-table .invers-compare-values .tmp-btn.btn-sm i {

  font-size: 14px;

}

.invers-compare-table .invers-product-price {

  color: var(--color-heading-1);

  font-family: var(--font-primary);

  font-size: 20px;

  line-height: 1.4;

  font-weight: 600;

}

.invers-compare-table .invers-compare-item-wrapper {

  position: relative;

}

.invers-compare-table .invers-compare-item-wrapper .invers-product-remove-btn {

  display: flex;

  align-items: center;

  justify-content: center;

  height: 32px;

  width: 32px;

  background: #F3F3F3;

  color: var(--color-heading-1);

  border: none;

  border-radius: 50%;

  font-size: 14px;

  position: absolute;

  right: 12px;

  top: 12px;

  z-index: 1;

  transition: var(--transition);

}

.invers-compare-table .invers-compare-item-wrapper .invers-product-item-img {

  border-radius: 6px;

  display: block;

  overflow: hidden;

  margin-bottom: 10px;

}



.invers-scrollable-content {

  overflow: auto;

}



.invers-rating-icon-list {

  margin: 0;

  padding: 0;

  list-style: none;

  display: flex;

  align-items: center;

  gap: 4px;

  line-height: 0.9;

}

.invers-rating-icon-list li {

  margin: 0;

}

.invers-rating-icon-list li i {

  color: #FCC418;

}



.our-newsletter-area-start {

  position: relative;

  background-color: #f7f7f7 !important;

  z-index: 1;

}

.our-newsletter-area-start::after {

  content: "";

  display: block;

  position: absolute;

  right: 0;

  height: 100%;

  width: 100%;

  background: url(../images/subscribe/dots.png) repeat center/auto;

  top: 0;

  z-index: -1;

  opacity: 0.8;

  filter: brightness(0) saturate(100%) invert(71%) sepia(90%) saturate(5552%) hue-rotate(350deg) brightness(100%) contrast(103%);

}

.our-newsletter-area-start .section-title-area-3 {

  text-align: center;

}

.our-newsletter-area-start .section-title-area-3 p.desc {

  max-width: 65%;

  margin: auto;

}

@media only screen and (max-width: 576px) {

  .our-newsletter-area-start .section-title-area-3 p.desc {

    max-width: 95%;

  }

}

.our-newsletter-area-start .news-letter-modern-wrapper {

  max-width: 50%;

  margin: auto;

  display: flex;

  align-items: center;

  gap: 10px;

}

@media only screen and (max-width: 991px) {

  .our-newsletter-area-start .news-letter-modern-wrapper {

    max-width: 95%;

  }

}

@media only screen and (max-width: 576px) {

  .our-newsletter-area-start .news-letter-modern-wrapper {

    flex-direction: column;

  }

}

.our-newsletter-area-start .news-letter-modern-wrapper input {

  height: 61px;

  background: #fff;

  border-radius: 50px;

  border: 2px solid transparent;

}

.our-newsletter-area-start .news-letter-modern-wrapper input:focus {

  border: 2px solid var(--color-primary);

}

.our-newsletter-area-start .news-letter-modern-wrapper button {

  border: none;

}



.single-career-card {

  background: var(--color-white);

  box-shadow: var(--shadow-1);

  border-radius: 6px;

  padding: 30px;

  transition: 0.3s;

  height: 100%;

  position: relative;

  z-index: 1;

}

.single-career-card .icon {

  margin-bottom: 60px;

}

@media only screen and (max-width: 1199px) {

  .single-career-card .icon {

    margin-bottom: 15px;

  }

}

.single-career-card:hover {

  transform: scale(1.02);

}

.single-career-card:hover .icon img {

  animation: bounceIn 1.3s ease;

}

.single-career-card .designation span {

  font-size: 16px;

  margin-bottom: 15px;

  font-weight: 600;

  display: block;

}

.single-career-card .title {

  font-size: 26px;

  margin-bottom: 20px;

  line-height: 1.3;

}

@media only screen and (max-width: 1199px) {

  .single-career-card .title {

    font-size: 20px;

  }

}

.single-career-card .meta {

  display: flex;

  align-items: center;

  gap: 25px;

  margin-bottom: 30px;

}

.single-career-card .meta span {

  display: block;

  position: relative;

  font-weight: 500;

}

.single-career-card .meta span::after {

  position: absolute;

  content: "";

  right: -12px;

  height: 20px;

  width: 1px;

  top: 50%;

  transform: translateY(-50%);

  background: #c5c5c5;

}

.single-career-card .meta span:last-child::after {

  display: none;

}

.single-career-card .footer-jobs {

  display: flex;

  justify-content: space-between;

  align-items: center;

}

.single-career-card .footer-jobs .selary {

  margin: 0;

  font-weight: 500;

  color: var(--color-heading-1);

}



.tmp-career-details-left {

  padding: 30px 45px;

  box-shadow: var(--shadow-1);

  border-radius: 8px;

}

@media only screen and (max-width: 576px) {

  .tmp-career-details-left {

    padding: 20px 15px;

  }

}

.tmp-career-details-left .tmp-details-title {

  font-size: 30px;

  line-height: 1.2;

}



.tmp-career-details-left .tmp-details-list ul li {

  padding: 8px 0;

  border-top: 1px dashed #eeeeee;

  border-bottom: 1px dashed #eeeeee;

  padding-left: 20px;

  position: relative;

}

.tmp-career-details-left .tmp-details-list ul li::after {

  position: absolute;

  content: "";

  left: 0;

  top: 50%;

  transform: translateY(-50%);

  height: 8px;

  width: 8px;

  background: var(--color-primary);

  border-radius: 50%;

}

.tmp-career-details-left .tmp-details-list ul li span {

  display: flex;

  align-items: center;

  gap: 15px;

}



.tmp-career-details-right .tmp-details-list ul li {

  margin-bottom: 15px;

}

.tmp-career-details-right .tmp-details-list ul li span svg {

  margin-right: 15px;

}

@media only screen and (max-width: 576px) {

  .tmp-career-details-right .tmp-details-list ul li span svg {

    margin-right: 5px;

  }

}

.tmp-career-details-right a {

  border: none;

  margin: 55px auto 0 0 !important;

}



.new-address-modal-wrapper .modal-header {

  padding: 0;

  margin: 0;

  border: none;

}

.new-address-modal-wrapper .modal-header button {

  box-shadow: none;

  border: none;

}

.new-address-modal-wrapper .modal-header .btn-close {

  position: absolute;

  right: -16px;

  z-index: 99;

  background-color: var(--color-white);

  background: var(--color-white);

  box-shadow: 0px 5px 22px rgba(0, 0, 0, 0.06);

  height: 35px;

  width: 35px;

  border-radius: 50%;

  top: -16px;

  opacity: 1;

  z-index: 1;

}

@media only screen and (max-width: 991px) {

  .new-address-modal-wrapper .modal-header .btn-close {

    right: 25px;

    top: 20px;

  }

}

.new-address-modal-wrapper .modal-header .btn-close::after {

  position: absolute;

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%) scale(0.2);

  content: "";

  width: 100%;

  height: 100%;

  background: var(--color-primary);

  opacity: 0;

  z-index: -1;

  border-radius: 50%;

  transition: 0.3s;

}

.new-address-modal-wrapper .modal-header .btn-close:hover::after {

  transform: translate(-50%, -50%) scale(1);

  opacity: 1;

}

.new-address-modal-wrapper .modal-header .btn-close:hover i {

  color: #fff;

}

.new-address-modal-wrapper .modal-header .btn-close i {

  font-size: 22px;

  color: var(--color-heading-1);

  transition: 0.3s;

}

.new-address-modal-wrapper .modal-body {

  border-radius: 10px;

}



.modal.new-address-modal-wrapper {

  scrollbar-width: none;

}



.modal-dialog.new-address-modal {

  max-width: 1000px;

  margin: 110px auto;

}

.modal-dialog.new-address-modal .modal-content {

  border-radius: 10px;

}

.modal-dialog.new-address-modal .quick-address-modal-body {

  padding: 30px;

}

@media only screen and (max-width: 767px) {

  .modal-dialog.new-address-modal .quick-address-modal-body {

    padding: 10px;

  }

}



.primary-dark {

  --color-primary: #20282D;

  --color-primary-2: #20282D;

  --primary-50: #d2d4d5;

  --primary-100: #bcbfc0;

  --primary-200: #CCF9FE;

  --primary-300: #a6a9ab;

  --primary-400: #909496;

  --primary-500: #63696c;

  --primary-600: #4d5357;

  --primary-700: #20282D;

  --primary-900: #1d2429;

}

.primary-dark .tmp-icon-overlay-link-btn::after {

  background-color: #f1f1f1;

}

.primary-dark .tmpServiceSlider .service-wrapper-3 .image-area::after {

  background: linear-gradient(180.06deg, rgba(28, 9, 1, 0) 0.05%, rgba(32, 40, 45, 0.2549019608) 48.5%, var(--color-primary) 99.95%);

}

.primary-dark .working-process-wrapper5::after {

  background: linear-gradient(180deg, rgba(32, 40, 45, 0) 0%, rgba(32, 40, 45, 0.1215686275) 47.81%, rgba(32, 40, 45, 0.2549019608) 58.9%, var(--color-primary) 100%);

}

.primary-dark .team-wrapper2 .content-area .tmp-icon-overlay-link-btn::after {

  background-color: #e9e9e9;

}

.primary-dark .team-wrapper2 .content-area .tmp-icon-overlay-link-btn:hover::after {

  background-color: var(--color-primary);

}

.primary-dark .team-wrapper2 .image-area::after {

  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(5, 5, 5, 0.0901960784) 47.81%, rgba(5, 5, 5, 0.2078431373) 58.9%, var(--color-primary) 100%);

}

.primary-dark .tmp-mega-menu.width-small-mega .service-thumbnail-area::after {

  background: var(--primary-100);

}

.primary-dark .main-footer-one-area .single-footer-inner .use-full-link-wrapper .single:hover,

.primary-dark .main-footer-one-area .contactus-link-wrapper .single .phone a:hover {

  color: var(--color-white) !important;

}

.primary-dark .main-footer-one-area.six .footer-title img {

  filter: brightness(0) saturate(100%) invert(100%) sepia(100%) saturate(0%) hue-rotate(268deg) brightness(109%) contrast(101%);

}

.primary-dark .pricing-wrapper3 .pricing-body ul li span {

  background: #f1f1f1;

}

.primary-dark .tmp-banner-area .hover-moving-primary:hover {

  color: var(--color-white) !important;

}

.primary-dark .main-footer-one-area .newsletter-area .form .single-input-wrapper input:focus {

  border: 1px solid rgb(255, 255, 255);

}

.primary-dark .copyright-area-one.cg p a:hover,

.primary-dark .copyright-area-one.cg .copyright-links li a:hover {

  color: rgb(255, 255, 255) !important;

}



.primary-blue {

  --color-primary: #0075ff;

  --color-primary-2: #0075ff;

  --primary-50: #e6f1ff;

  --primary-100: #cce3ff;

  --primary-200: #b3d6ff;

  --primary-300: #99c8ff;

  --primary-400: #80baff;

  --primary-500: #4d9eff;

  --primary-600: #3391ff;

  --primary-700: #0075ff;

  --primary-900: #0069e6;

}

.primary-blue .tmp-mega-menu.width-small-mega .service-thumbnail-area::after {

  background: rgba(0, 41, 87, 0.431372549);

}

.primary-blue .service-with-thumbnail .thumbnail::after {

  background: linear-gradient(0deg, rgba(0, 117, 255, 0.81) 0%, rgba(0, 0, 0, 0) 100%);

}

.primary-blue .pricing-wrapper .pricing-feature li .check {

  background: var(--primary-50);

  color: var(--color-primary);

}

.primary-blue .tmp-banner-slider-area2.banner-right-bento .thumbnail-banner-right .floating-content .icon {

  background: var(--primary-50);

  display: flex;

  align-items: center;

  justify-content: center;

}

.primary-blue .tmp-banner-slider-area2.banner-right-bento .thumbnail-banner-right .floating-content .icon svg path {

  fill: var(--color-primary);

}

.primary-blue .working-process-wrapper7 .content p {

  background: var(--primary-50);

}

.primary-blue .section-title-area .pre-title {

  background: var(--primary-50);

}

.primary-blue .team-wrapper2 .image-area::after {

  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(5, 5, 5, 0) 47.81%, rgba(13, 110, 253, 0.1215686275) 58.9%, var(--color-primary) 100%);

}



.primary-pink {

  --color-primary: #f9004d;

  --color-primary-2: #f9004d;

  --primary-50: #fff3f7;

  --primary-100: #feccdb;

  --primary-200: #fdb3ca;

  --primary-300: #fd99b8;

  --primary-400: #fb6694;

  --primary-500: #fa3371;

  --primary-600: #fa1a5f;

  --primary-700: #f9004d;

  --primary-900: #e00045;

}

.primary-pink .tmp-about-area4 .right-side-content .button-area .call-btn .icon svg path {

  fill: var(--color-primary);

}

.primary-pink .tmp-mega-menu.width-small-mega .service-thumbnail-area::after {

  background: rgba(0, 41, 87, 0.431372549);

}

.primary-pink header.header-seven .header-top {

  background: var(--color-heading-1);

}

.primary-pink .tmp-mega-menu.width-small-mega.mega-card-view.service-width .service-menu-card .icon-nav {

  background: #fcecf1;

}

.primary-pink .tmp-mega-menu.width-small-mega.mega-card-view.service-width li a {

  background: rgb(255, 249, 249) !important;

}

.primary-pink .pricing-wrapper3 .pricing-body ul li span {

  background: var(--primary-50);

}

.primary-pink .tmp-contact-area.contact .social-share-wrapper-1.style-footer .social-stylle-one li a {

  background: var(--primary-50);

}



.primary-deep-blue {

  --color-primary: #1E3A8A;

  --color-primary-2: #1E3A8A;

  --primary-50: #f9faff;

  --primary-100: #e9ebf3;

  --primary-200: #d2d8e8;

  --primary-300: #bcc4dc;

  --primary-400: #a5b0d0;

  --primary-500: #8f9dc5;

  --primary-600: #7889b9;

  --primary-700: #1E3A8A;

  --primary-900: #1b347c;

}

.primary-deep-blue .tmp-service-area {

  border-radius: 20px;

  background: transparent;

}

.primary-deep-blue .tmp-service-area.service .service-wrapper .icon img {

  filter: brightness(0) saturate(100%) invert(19%) sepia(36%) saturate(3229%) hue-rotate(202deg) brightness(101%) contrast(89%);

}

.primary-deep-blue .bg-project2 {

  background: var(--primary-50);

}

.primary-deep-blue .project-flip-style .content .icon svg path {

  fill: var(--color-primary);

}

.primary-deep-blue .tmp-mega-menu.width-small-mega .service-thumbnail-area::after {

  opacity: 0.5;

}

.primary-deep-blue .header-center-short.header-seven.with-shadow-nad-top-dark .header-top .header-top-wrapper {

  padding: 10px 40px;

}

.primary-deep-blue .header-center-short.header-seven.with-shadow-nad-top-dark .header-mid-one-wrapper {

  box-shadow: none;

}



.site-preloader {

  position: fixed;

  inset: 0;

  z-index: 99999;

  background: #ffffff;

  padding: 50px 0;

  transition: opacity 0.45s ease, visibility 0.45s ease;

}

.site-preloader.is-hidden {

  opacity: 0;

  visibility: hidden;

  pointer-events: none;

}

.site-preloader .preloader-wrap {

  max-width: 1330px;

  margin: 0 auto;

}

@media only screen and (max-width: 1199px) {

  .site-preloader .preloader-wrap {

    max-width: 980px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .site-preloader .preloader-wrap {

    max-width: 750px;

  }

}

@media only screen and (max-width: 767px) {

  .site-preloader .preloader-wrap {

    max-width: 650px;

  }

}

.site-preloader .skeleton-header {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 20px;

  margin-bottom: 30px;

}

.site-preloader .skeleton-nav {

  display: flex;

  gap: 14px;

}

.site-preloader .skeleton-hero {

  display: grid;

  grid-template-columns: 1.1fr 0.9fr;

  gap: 32px;

  align-items: center;

  margin-bottom: 32px;

}

.site-preloader .skeleton-grid {

  display: grid;

  grid-template-columns: repeat(4, 1fr);

  gap: 22px;

}

.site-preloader .skeleton-card {

  padding: 16px;

  border-radius: 18px;

  background: #ffffff;

  box-shadow: var(--shadow-1);

}

.site-preloader .inw-line,

.site-preloader .inw-box {

  position: relative;

  overflow: hidden;

  background: #eceff5;

}

.site-preloader .inw-line::after,

.site-preloader .inw-box::after {

  content: "";

  position: absolute;

  inset: 0;

  transform: translateX(-100%);

  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.8), transparent);

  animation: skeleton-loading 1.25s infinite;

}

.site-preloader .inw-line {

  height: 14px;

  border-radius: 999px;

  margin-bottom: 14px;

}

.site-preloader .inw-box {

  border-radius: 18px;

}

.site-preloader .logo-line {

  width: 170px;

  height: 28px;

}

.site-preloader .nav-line {

  width: 82px;

  height: 13px;

}

.site-preloader .hero-title {

  width: 82%;

  height: 38px;

}

.site-preloader .hero-title-sm {

  width: 58%;

  height: 38px;

}

.site-preloader .hero-text {

  width: 92%;

}

.site-preloader .hero-text-sm {

  width: 68%;

}

.site-preloader .hero-btn {

  width: 145px;

  height: 46px;

  border-radius: 999px;

  margin-top: 20px;

}

.site-preloader .hero-img {

  width: 100%;

  height: 360px;

}

.site-preloader .card-img {

  width: 100%;

  height: 170px;

  margin-bottom: 16px;

}

.site-preloader .card-title {

  width: 78%;

  height: 18px;

}

.site-preloader .card-text {

  width: 92%;

}

.site-preloader .card-price {

  width: 45%;

  height: 18px;

  margin-top: 18px;

}

@media (max-width: 900px) {

  .site-preloader .skeleton-hero {

    grid-template-columns: 1fr;

  }

  .site-preloader .skeleton-grid {

    grid-template-columns: repeat(2, 1fr);

  }

}

@media (max-width: 576px) {

  .site-preloader {

    padding: 18px;

  }

  .site-preloader .skeleton-nav {

    display: none;

  }

  .site-preloader .skeleton-grid {

    grid-template-columns: 1fr;

  }

}



@keyframes skeleton-loading {

  100% {

    transform: translateX(100%);

  }

}

/* Chrome, Edge, Safari */

::-webkit-scrollbar {

  width: 10px;

}



::-webkit-scrollbar-track {

  background: #f1f1f1;

  border-radius: 10px;

}



::-webkit-scrollbar-thumb {

  background: linear-gradient(180deg, var(--color-primary), #011425);

  border-radius: 10px;

  border: 2px solid #f1f1f1;

}



::-webkit-scrollbar-thumb:hover {

  background: linear-gradient(180deg, #011425, var(--color-primary));

}



/* Firefox */

html {

  scrollbar-width: thin;

  scrollbar-color: var(--color-primary) #f1f1f1;

}



/*dashboard*/

.user-infor-left-sidebar-dashboard {

  background: var(--color-white);

  box-shadow: var(--shadow-1);

  padding: 15px;

  margin-top: -130px;

  border-radius: 6px;

  position: relative;

  z-index: 10;

}

.user-infor-left-sidebar-dashboard .author-profile {

  text-align: center;

}

.user-infor-left-sidebar-dashboard .author-profile .author-profile-img {

  margin-top: 53px;

  width: 121px;

  height: 121px;

  border-radius: 50%;

  margin: auto;

  overflow: hidden;

  border: 5px solid #e0e0e0;

}

.user-infor-left-sidebar-dashboard .author-profile .name {

  margin-top: 20px;

  font-size: 24px;

  line-height: 1.3;

}

.user-infor-left-sidebar-dashboard .dashboard-menu-area .dashboard-mainmenu ul {

  padding: 0;

  margin: 0;

}

.user-infor-left-sidebar-dashboard .dashboard-menu-area .dashboard-mainmenu ul li {

  margin: 5px 0;

  padding: 0;

}

.user-infor-left-sidebar-dashboard .dashboard-menu-area .dashboard-mainmenu ul li a {

  display: flex;

  align-items: center;

  gap: 10px;

  padding: 10px 20px;

  background: #f9f9f9;

  border-radius: 4px;

  transition: 0.3s;

  font-weight: 600;

  font-family: var(--font-primary);

}

.user-infor-left-sidebar-dashboard .dashboard-menu-area .dashboard-mainmenu ul li a:hover {

  background: var(--color-primary);

  color: #fff;

}

.user-infor-left-sidebar-dashboard .dashboard-menu-area .dashboard-mainmenu ul li a.active {

  background: var(--color-primary);

  color: #fff;

}



.box-dashboard {

  padding: 30px;

  border-radius: 6px;

  box-shadow: var(--shadow-1);

}



.box-dashboard-dashboard {

  padding: 30px;

  border-radius: 6px;

  box-shadow: var(--shadow-1);

  margin-bottom: 20px;

}

@media only screen and (max-width: 576px) {

  .box-dashboard-dashboard {

    padding: 15px;

    flex-wrap: wrap;

    gap: 10px;

  }

}

.box-dashboard-dashboard:last-child {

  margin-bottom: 0;

}



.single-card-dashboard.account-info .title {

  margin-bottom: 0;

  font-size: 24px;

  line-height: 1.3;

}

@media only screen and (max-width: 576px) {

  .single-card-dashboard.account-info .title {

    font-size: 18px;

  }

}

.single-card-dashboard.account-info .title.with-border-bottom {

  margin-bottom: 24px;

  font-size: 20px;

  padding-bottom: 20px;

  border-bottom: 2px solid rgba(230, 227, 241, 0.3098039216);

}



.dash-board-content-area-wrappper .single-card-dashboard .single-contact-information .profile-info {

  font-size: 18px;

  line-height: 1.6;

}

.dash-board-content-area-wrappper .single-card-dashboard .title-top-primary {

  display: flex;

  align-items: center;

  gap: 10px;

}

.dash-board-content-area-wrappper .single-card-dashboard .title-top-primary i {

  color: var(--color-primary);

  height: 45px;

  width: 45px;

  border-radius: 50%;

  background: var(--primary-100);

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 18px;

}



.edit-profile-picture-area .upload-wrapper {

  display: flex;

  align-items: center;

  gap: 20px;

  background: #fff;

}

@media only screen and (max-width: 576px) {

  .edit-profile-picture-area .upload-wrapper {

    flex-wrap: wrap;

  }

}

.edit-profile-picture-area .image-preview {

  width: 120px;

  height: 120px;

  border-radius: 50%;

  border: 5px solid #e0e0e0;

  display: flex;

  justify-content: center;

  align-items: center;

  overflow: hidden;

  background: #fafafa;

  position: relative;

}

.edit-profile-picture-area .image-preview img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}

.edit-profile-picture-area .upload-btn {

  background: #007bff;

  color: #fff;

  border: none;

  padding: 10px 18px;

  border-radius: 8px;

  cursor: pointer;

  font-size: 14px;

  transition: 0.3s ease;

}

.edit-profile-picture-area .upload-btn:hover {

  background: #0056b3;

}

.edit-profile-picture-area input[type=file] {

  display: none;

}



.fs-36 {

  font-size: 36px;

  line-height: 1.3;

}



.fs-24 {

  font-size: 24px;

  line-height: 1.3;

}



.fs-20 {

  font-size: 20px;

  line-height: 1.3;

}



.edit-account-information {

  margin-top: 30px;

}

.edit-account-information .address-type-title {

  font-size: 20px;

  line-height: 1.2;

}

.edit-account-information .input-wrapper {

  display: flex;

  align-items: center;

  gap: 30px;

  margin-bottom: 30px;

}

@media only screen and (max-width: 767px) {

  .edit-account-information .input-wrapper {

    flex-wrap: wrap;

  }

}

.edit-account-information .input-wrapper .single-input {

  width: 100%;

}

.edit-account-information .input-wrapper .single-input label {

  margin-bottom: 10px;

  color: var(--color-heading-1);

}

.edit-account-information .input-wrapper input {

  height: 45px;

  border: 1px solid var(--color-border);

  border-radius: 33px;

}

.edit-account-information .input-wrapper input:focus {

  border: 1px solid var(--color-primary);

}

.edit-account-information .input-wrapper select {

  height: 45px;

  background: var(--color-white);

  border: 1px solid var(--color-border);

  color: var(--color-body);

  text-align: left;

  font-size: 16px;

  padding: 7px 12px;

}

.edit-account-information .input-wrapper select:focus {

  box-shadow: none;

}

.edit-account-information button {

  border: none;

}



.invers-table {

  border: 0 none;

}

.invers-table thead tr th {

  background: var(--primary-100);

  padding: 10px 20px;

  color: var(--color-heading-1);

}

.invers-table tbody tr td {

  border: 0 none;

  padding: 10px 20px;

}

.invers-table tbody tr th {

  padding: 10px 20px;

  font-weight: 400;

}

.invers-table tbody tr:nth-child(even) th,

.invers-table tbody tr:nth-child(even) td {

  background: rgba(207, 207, 207, 0.24);

}



.table {

  color: var(--color-body);

}

.table.invers-table thead tr th {

  text-transform: capitalize;

}



.single-address-booking-wrapper {

  padding: 15px;

  border: 1px solid #e5e5e5;

  border-radius: 3px;

  transition: 0.3s;

}

.single-address-booking-wrapper:hover {

  box-shadow: var(--shadow-1);

  border: 1px solid rgba(229, 229, 229, 0);

  background: var(--color-white);

}

.single-address-booking-wrapper .header-booking {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.single-address-booking-wrapper .header-booking .name {

  display: flex;

  align-items: center;

  gap: 10px;

}

.single-address-booking-wrapper .header-booking .name i {

  height: 45px;

  width: 45px;

  border-radius: 50%;

  background: var(--primary-100);

  color: var(--color-primary);

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 22px;

}

.single-address-booking-wrapper .header-booking .name p {

  margin-bottom: 0;

  font-weight: 500;

  color: var(--color-heading-1);

}

.single-address-booking-wrapper .header-booking a {

  color: var(--color-primary);

  text-decoration: underline;

}

.single-address-booking-wrapper .body {

  margin-top: 20px;

}

.single-address-booking-wrapper .body .address {

  padding: 10px;

  background: #f5f5f5;

  box-shadow: 0 1px 0 hsla(0, 0%, 62%, 0.25);

}

.single-address-booking-wrapper .body .number {

  display: flex;

  align-items: center;

  gap: 10px;

  background: #f3ebeb;

  padding: 10px;

  color: #e91e63;

}

.single-address-booking-wrapper .body .number .icon {

  display: flex;

  align-items: center;

  justify-content: center;

}

.single-address-booking-wrapper .body .number .icon i {

  color: var(--color-primary);

  font-size: 20px;

}

.single-address-booking-wrapper .footer .category {

  max-width: max-content;

  display: inline-block;

  margin-top: 4px;

  margin-right: 4px;

  font-size: 12px;

  border-radius: 2px;

  padding: 2px 4px;

  color: #000;

  background-color: #f5f5f5;

  line-height: 1;

}

.single-footer-inner .logo img{

    width:120px;

}

.single-footer-inner .body p{

    color: #fff;

    margin-bottom: 20px;

}

.single-footer-inner.company h3{

    color: #5c9cea;

    font-size: 22px;

}

.contact_info-bar{

    gap: 10px;

    margin-bottom: 15px;

}

.contact_info-bar .contact_info{

    color: #fff;

    gap:5px;

    font-size: 16px;

}

.contact_info-bar .contact_info i{

    margin-right: 4px;

    color: #5c9cea;

}

.dash-board-content-area-wrappper .product-wrapper .image-area {

  background: transparent;

}



.invers-badge-minimal {

  background: #F6F6F6;

  padding: 5px 7px;

  font-size: 12px;

  display: flex;

  height: 22px;

  align-items: center;

  border-radius: 6px;

  justify-content: center;

  width: max-content;

}

.invers-badge-minimal.success {

  background: rgba(62, 183, 94, 0.062745098);

  color: var(--color-success);

}

.invers-badge-minimal.primary {

  background: var(--primary-200);

  color: var(--color-primary);

}

.invers-badge-minimal.color-warning {

  background: rgba(255, 143, 60, 0.062745098);

  color: #FF8F3C;

}

.invers-badge-minimal.color-danger {

  background: rgba(255, 0, 3, 0.062745098);

  color: #FF0003;

}



[dir=rtl] .inv-text-anim {

  direction: rtl;

  unicode-bidi: isolate;

}

[dir=rtl] .section-title-area-4 .sub-title::after {

  right: auto;

  left: -50px;

  background: linear-gradient(270deg, var(--color-primary), rgba(33, 38, 45, 0)) !important;

}

[dir=rtl] header.header-seven .header-mid-one-wrapper .nav-area {

  margin-left: 0;

  margin-right: 100px;

}

[dir=rtl] .tmp-btn.hover-icon-reverse .icon-reverse-wrapper i {

  padding-left: 8px;

  transform: scaleX(-1);

}

[dir=rtl] .tmp-btn.hover-icon-reverse:hover .icon-reverse-wrapper .btn-text {

  transition-delay: 0.1s;

  transform: translateX(-23px);

}

[dir=rtl] .service-wrapper7 .tag {

  left: -55px;

  right: auto;

  transform: rotate(312deg);

}

[dir=rtl] .swiper {

  direction: initial;

}

[dir=rtl] .swiper .swiper-wrapper {

  direction: ltr;

}

[dir=rtl] .swiper .swiper-wrapper .swiper-slide {

  direction: rtl;

}

[dir=rtl] .working-process-wrapper7 .content {

  direction: rtl;

  transition: 0.3s;

  right: -30px;

  left: auto;

  opacity: 0;

}

[dir=rtl] .working-process-wrapper7:hover .content {

  left: auto;

  right: 30px;

  opacity: 1;

}

[dir=rtl] .swiper-slide-active .working-process-wrapper7 .content {

  left: auto;

  right: 30px;

  opacity: 1;

}

[dir=rtl] .tmp-testimonials-area4 .testimonial-slider-inner2 .swiper-navigation {

  direction: ltr;

}

[dir=rtl] .testimonial-wrapper5 {

  direction: rtl;

}

[dir=rtl] .tmp-testimonials-area4 .testimonial-slider-inner2 .swiper-navigation {

  left: 50px;

  right: auto;

}

[dir=rtl] .footer-cta-area.cta-two {

  background-color: #292f3a;

}

[dir=rtl] .tmp-counter-area .counter-inner .content .title {

  direction: ltr;

}

[dir=rtl] .tmp-pricing-area.area-2 .pricing-inner {

  margin-left: 0;

  margin-right: 60px;

}

@media only screen and (max-width: 991px) {

  [dir=rtl] .tmp-pricing-area.area-2 .pricing-inner {

    margin-right: 20px;

  }

}

@media only screen and (max-width: 576px) {

  [dir=rtl] .tmp-pricing-area.area-2 .pricing-inner {

    margin-right: 0;

  }

}

[dir=rtl] .progress-wrap {

  right: auto;

  left: 30px;

}

[dir=rtl] .side-bar {

  left: -100%;

  right: auto;

  border-radius: 0 10px 10px 0;

}

[dir=rtl] .side-bar.show {

  left: 0;

  overflow-y: auto;

}

@media (min-width: 992px) {

  [dir=rtl] .text-lg-start {

    text-align: right !important;

  }

}

[dir=rtl] .hover-moving-primary::after {

  left: auto;

  right: 0;

  transform-origin: bottom left;

}

[dir=rtl] .hover-moving-primary:hover::after {

  transform-origin: bottom right;

  transform: scaleX(1);

}

[dir=rtl] .main-footer-one-area .newsletter-area .form .single-input-wrapper button {

  left: 7px;

  right: auto;

  top: 50%;

}

[dir=rtl] .tmp-contact-area .contact-form-area form label i {

  margin-left: 2px;

  margin-right: 0;

}

[dir=rtl] .tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper {

  direction: rtl;

}

[dir=rtl] .tmp-banner-slider-area.banner-nine .pagination-area2 .swiper-wrapper .swiper-slide .banner-single-thumb .image-area .content {

  right: 30px;

  left: auto;

  direction: rtl;

}

[dir=rtl] .about-card-new .title {

  direction: ltr;

  text-align: right;

}

[dir=rtl] .offcanvas-search .form-search .btn-submit1 {

  right: auto;

  left: 8px;

}

[dir=rtl] .side-bar .inner-main-wrapper-desk.style-one-sidebar .header-bottom-qhick-action p.disc {

  padding-left: 18%;

  padding-right: 0;

}

[dir=rtl] .tmp-mega-menu.with-home-demos .demos-area-drop-down .mega-menu-item {

  direction: ltr;

}

[dir=rtl] .tmp-mega-menu .wrapper.inner-page .inversweb-short-title {

  text-align: right;

  padding-right: 8px;

}

[dir=rtl] .tmp-mega-menu .wrapper.inner-page .inversweb-short-title::after {

  left: auto;

  right: 8px;

}

[dir=rtl] li.has-dropdown .submenu li a {

  text-align: right;

}

[dir=rtl] li.has-dropdown .submenu li.has-third-lev .submenu {

  left: auto;

  right: 100%;

}

[dir=rtl] li.has-dropdown .submenu li.has-third-lev > a i {

  transform: scaleX(-1);

}

[dir=rtl] .tmp-mega-menu.width-small-mega .service-thumbnail-area .content-area-service-thumb .title {

  text-align: right;

}

[dir=rtl] .tmp-mega-menu.width-small-mega .service-thumbnail-area .content-area-service-thumb {

  left: auto;

  right: 30px;

}

[dir=rtl] .tmp-mega-menu.width-small-mega .service-thumbnail-area .content-area-service-thumb a.call-btn span {

  margin-left: 0;

  margin-right: 10px;

}

[dir=rtl] .tmp-mega-menu.width-small-mega.mega-card-view.service-width .service-menu-card .content {

  text-align: right;

}

[dir=rtl] .tmp-mega-menu.width-small-mega .tmp-short-title {

  text-align: right;

  padding-right: 8px;

}

[dir=rtl] .tmp-mega-menu.width-small-mega .tmp-short-title::after {

  right: 8px;

  left: auto;

}

[dir=rtl] .has-dropdown.mega-menu > a::after {

  right: auto;

  left: -16px;

}

[dir=rtl] .nav-area ul li.main-nav {

  padding: 29px 0 29px 20px;

}

[dir=rtl] .has-dropdown.project-a-after > a::after {

  left: -1px;

  right: auto;

}

[dir=rtl] .mobile-menu nav ul li.has-droupdown > a::after {

  left: 0;

  right: auto;

}

[dir=rtl] .banner-five-main-wrapper::before {

  background: linear-gradient(270deg, var(--color-primary) 1.59%, rgba(0, 0, 0, 0) 100%);

}

[dir=rtl] .banner-five-main-wrapper::after {

  right: 0;

  left: auto;

  background: linear-gradient(269deg, rgba(32, 40, 45, 0.54) 1.29%, rgba(255, 94, 20, 0) 99.95%);

}

@media only screen and (max-width: 576px) {

  [dir=rtl] .why-choose-feature-wrapper {

    padding: 0 15px;

  }

}
.labour_codes{
    background-color: #001b46;
    border-radius: 159px;
    text-align: center;
    padding: 40px 50px;
    margin-bottom: 60px;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}
.labour_codes h2{
    color: #fff;
    font-weight: 600;
        font-size: 37px;
        line-height: 33px;
}
.labour_codes h2 span{
        font-size: 25px;
    font-weight: 400;
}
.labour_codes h2 span strong{
    text-transform: uppercase;    
    
}
.labour_codes p{
    color: #fff;
    font-weight: 700;
    font-size: 27px;
    line-height: 37px;
}
@media only screen and (max-width: 1199px) {

    .contact_info-bar li{

        text-align: left;

    }

    .contact_info-bar {

        gap: 10px;

        width: 291px;

        margin: 0 auto;

        margin-bottom: 15px;

    }

    .contact_info a{

        display: flex;

        /* top: 2px; */

        align-items: baseline;

        gap: 10px;

    }

    .contact_info-bar .contact_info i{

        width: 12px;

    }
    .labour_codes {
        background-color: #001b46;
        border-radius: 37px;
        text-align: center;
        padding: 25px 20px;
        margin-bottom: 60px;
        box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
    }
    .labour_codes h2 {
               font-size: 36px;
        margin-bottom: 27px;
        line-height: 30px;
    }
    .labour_codes p {
        color: #fff;
        font-weight: 500;
        font-size: 20px;
        line-height: 29px;
    }
}

/*# sourceMappingURL=../maps/style.css.map */