/*----Default Css----*/

@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

:root {

  --color-page: #010A10;

  --color-primary: #139bfd;

  --color-primary-alt: #13fdfd;

  --color-primary-2nd: #FF494A;

  --color-primary-3rd: #FDC448;

  --color-primary-4th: #0071ff;

  --color-secondary: #010a10;

  --color-white:#ffffff;

  --color-gray: #bebebe;

  --color-gray-2: #06131b;

  --color-subtitle: #f9004d;

  --stroke-dark-100: #081722;

  --background-color-1: #24243557;

  --background-color-2: #13131d;

  --background-color-3: #151521;

  --background-color-4: #242435;

  --background-color-5: #EDF5FF;

  --color-card-wrapper: #010a10;

  --color-card: #06131b;

  --gradient-box: linear-gradient(to right, var(--color-primary), #FF014F);

  --gradient-one: linear-gradient(to right bottom, #E42032, #1273EB);

  --gradient-two: linear-gradient(to right, #ED145B, #4A11EB);

  --gradient-three: linear-gradient(to right, #03041c, #0612b3);

  --text-gradient-one:linear-gradient(to right, #E42032, #4A11EB);

  --stroke-gr: linear-gradient(317deg, #13fdfd 0%, rgba(19, 215, 253, 0.2) 38.23%, rgba(19, 191, 253, 0.2) 62.96%, #139bfd 100%);

  --stroke-gradient-2: radial-gradient(92.46% 222.14% at 15.65% -7.58%, rgba(127, 226, 251, 0.20) 0%, rgba(127, 226, 251, 0.02) 100%);

  --icon-gradient: linear-gradient(315deg, #13fdfd 0%, #139bfd 100%);

  --gradient-none: linear-gradient(red 0 0);

  --full: linear-gradient(red 0 0);

  --shadow-1: 0 2px 22px #13fdfd7d;

  --theme-gradient: linear-gradient(312deg, #13fdfd 0%, #139bfd 100%);

  --color-heading:#ffffff;

  --color-body: #d6d6d6;

  --color-dark:#1d1d1d;

  --color-text-1:#DEDEDE;

  --color-light-heading: #181c32;

  --color-light-body: #65676b;

  --color-border-white: #00000024;

  --color-midgray: #878787;

  --color-light: #E4E6EA;

  --color-lighter: #CED0D4;

  --color-lightest: #F0F2F5;

  --color-border: #0c1f2e;

  --color-border-2: #ffffff80;

  --color-border-3: #ffffff0f;

  --color-white: #ffffff;

  --color-white-75: rgba(255, 255, 255, 0.75);

  --color-success: #3EB75E;

  --color-danger: #FF0003;

  --color-warning: #FF8F3C;

  --color-info: #1BA2DB;

  --color-facebook: #3B5997;

  --color-twitter: #000000;

  --color-youtube: #ED4141;

  --color-linkedin: #3C599F;

  --color-whatsapp: #09c141;

  --color-instagram: linear-gradient(to top right, #405de6, #5851db, #833ab4, #c13584, #e1306c, #fd1d1d);

  --color-vimeo: #00ADEF;

  --color-twitch: #6441A3;

  --color-discord: #7289da;

  --font-primary: "Montserrat", serif;

  --font-secondary: "Open Sans", sans-serif;;

  --font-three: "fontawesome";

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

  --border-width: 2px;

  --radius: 4px;

  --transition: all 0.4s ease-in-out;

  --font-size-b1: 16px;

  --font-size-b2: 18px;

  --font-size-b3: 22px;

  --line-height-b1: 1.75;

  --line-height-b2: 1.6;

  --line-height-b3: 1.7;

  --h1: 60px;

  --h2: 36px;

  --h3: 27px;

  --h4: 24px;

  --h5: 20px;

  --h6: 18px;

    

}



* {

  box-sizing: border-box;

}



html {

  margin: 0;

  padding: 0;

  font-size: 10px;

  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: var(--font-primary);

  color: var(--color-body);

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

  position: relative;

  overflow-x: hidden;

  background: var(--color-page);

}



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: var(--font-secondary);

  line-height: 1.4074;

  color: var(--color-heading);

}



h1,

.h1 {

  font-size: var(--h1);

  line-height: 1.19;

  font-weight: 700;

}



h2,

.h2 {

  font-size: var(--h2);

  line-height: 1.23;

}



h3,

.h3 {

  font-size: var(--h3);

  line-height: 1.5;

}



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

}



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: 16px;

  }

}

h1,

.h1,

h2,

.h2,

h3,

.h3 {

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

}



h4,

.h4,

h5,

.h5 {

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

}



h6,

.h6 {

  font-weight: var(--s-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 30px;

}

@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-heading);

}

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: "Poppins", 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;

}



.row {

  --bs-gutter-x: 3rem;

  --bs-gutter-y: 3rem;

}



* {

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

}



a:hover,

a:focus,

a:active {

  text-decoration: none;

  outline: none;

}



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;

}

.bg-white{

    background-color: #fff;

}

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

    Section Separation 

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

.slick-dotted.slick-slider {

  margin-bottom: 0;

}



.mb_dec--25 {

  margin-bottom: -25px;

}



.mb_dec--30 {

  margin-bottom: -30px;

}



.m--0 {

  margin: 0;

}



.mr--20 {

  margin-right: 20px;

}



.mr--50 {

  margin-right: 50px;

}



.mb--10 {

  margin-bottom: 10px;

}



.tmp-section-gap {

  padding: 120px 0;

}

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

  .tmp-section-gap {

    padding: 80px 0;

  }

}

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

  .tmp-section-gap {

    padding: 60px 0;

  }

}



.tmp-section-gapBottom {

  padding-bottom: 140px;

}

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

  .tmp-section-gapBottom {

    padding-bottom: 80px;

  }

}

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

  .tmp-section-gapBottom {

    padding-bottom: 60px;

  }

}



.tmp-section-gapTop {

  padding-top: 140px;

}

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

  .tmp-section-gapTop {

    padding-top: 80px;

  }

}

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

  .tmp-section-gapTop {

    padding-top: 60px;

  }

}



.pl--0 {

  padding-left: 0 !important;

}



.pr--0 {

  padding-right: 0 !important;

}



.pt--0 {

  padding-top: 0 !important;

}



.pb--0 {

  padding-bottom: 0 !important;

}



.mr--0 {

  margin-right: 0 !important;

}



.ml--0 {

  margin-left: 0 !important;

}



.mt--0 {

  margin-top: 0 !important;

}



.mb--0 {

  margin-bottom: 0 !important;

}



.mt--30 {

  margin-top: 30px;

}



.mt--15 {

  margin-top: 15px;

}



.mb--30 {

  margin-bottom: 30px;

}



.ptb--5 {

  padding: 5px 0 !important;

}



.plr--5 {

  padding: 0 5px !important;

}



.pt--5 {

  padding-top: 5px !important;

}



.pb--5 {

  padding-bottom: 5px !important;

}



.pl--5 {

  padding-left: 5px !important;

}



.pr--5 {

  padding-right: 5px !important;

}



.mt--5 {

  margin-top: 5px !important;

}



.mb--5 {

  margin-bottom: 5px !important;

}



.mr--5 {

  margin-right: 5px !important;

}



.ml--5 {

  margin-left: 5px !important;

}



.ptb--10 {

  padding: 10px 0 !important;

}



.plr--10 {

  padding: 0 10px !important;

}



.pt--10 {

  padding-top: 10px !important;

}



.pb--10 {

  padding-bottom: 10px !important;

}



.pl--10 {

  padding-left: 10px !important;

}



.pr--10 {

  padding-right: 10px !important;

}



.mt--10 {

  margin-top: 10px !important;

}



.mb--10 {

  margin-bottom: 10px !important;

}



.mr--10 {

  margin-right: 10px !important;

}



.ml--10 {

  margin-left: 10px !important;

}



.ptb--15 {

  padding: 15px 0 !important;

}



.plr--15 {

  padding: 0 15px !important;

}



.pt--15 {

  padding-top: 15px !important;

}



.pb--15 {

  padding-bottom: 15px !important;

}



.pl--15 {

  padding-left: 15px !important;

}



.pr--15 {

  padding-right: 15px !important;

}



.mt--15 {

  margin-top: 15px !important;

}



.mb--15 {

  margin-bottom: 15px !important;

}



.mr--15 {

  margin-right: 15px !important;

}



.ml--15 {

  margin-left: 15px !important;

}



.ptb--20 {

  padding: 20px 0 !important;

}



.plr--20 {

  padding: 0 20px !important;

}



.pt--20 {

  padding-top: 20px !important;

}



.pb--20 {

  padding-bottom: 20px !important;

}



.pl--20 {

  padding-left: 20px !important;

}



.pr--20 {

  padding-right: 20px !important;

}



.mt--20 {

  margin-top: 20px !important;

}



.mb--20 {

  margin-bottom: 20px !important;

}



.mr--20 {

  margin-right: 20px !important;

}



.ml--20 {

  margin-left: 20px !important;

}



.ptb--25 {

  padding: 25px 0 !important;

}



.plr--25 {

  padding: 0 25px !important;

}



.pt--25 {

  padding-top: 25px !important;

}



.pb--25 {

  padding-bottom: 25px !important;

}



.pl--25 {

  padding-left: 25px !important;

}



.pr--25 {

  padding-right: 25px !important;

}



.mt--25 {

  margin-top: 25px !important;

}



.mb--25 {

  margin-bottom: 25px !important;

}



.mr--25 {

  margin-right: 25px !important;

}



.ml--25 {

  margin-left: 25px !important;

}



.ptb--30 {

  padding: 30px 0 !important;

}



.plr--30 {

  padding: 0 30px !important;

}



.pt--30 {

  padding-top: 30px !important;

}



.pb--30 {

  padding-bottom: 30px !important;

}



.pl--30 {

  padding-left: 30px !important;

}



.pr--30 {

  padding-right: 30px !important;

}



.mt--30 {

  margin-top: 30px !important;

}



.mb--30 {

  margin-bottom: 30px !important;

}



.mr--30 {

  margin-right: 30px !important;

}



.ml--30 {

  margin-left: 30px !important;

}



.ptb--35 {

  padding: 35px 0 !important;

}



.plr--35 {

  padding: 0 35px !important;

}



.pt--35 {

  padding-top: 35px !important;

}



.pb--35 {

  padding-bottom: 35px !important;

}



.pl--35 {

  padding-left: 35px !important;

}



.pr--35 {

  padding-right: 35px !important;

}



.mt--35 {

  margin-top: 35px !important;

}



.mb--35 {

  margin-bottom: 35px !important;

}



.mr--35 {

  margin-right: 35px !important;

}



.ml--35 {

  margin-left: 35px !important;

}



.ptb--40 {

  padding: 40px 0 !important;

}



.plr--40 {

  padding: 0 40px !important;

}



.pt--40 {

  padding-top: 40px !important;

}



.pb--40 {

  padding-bottom: 40px !important;

}



.pl--40 {

  padding-left: 40px !important;

}



.pr--40 {

  padding-right: 40px !important;

}



.mt--40 {

  margin-top: 40px !important;

}



.mb--40 {

  margin-bottom: 40px !important;

}



.mr--40 {

  margin-right: 40px !important;

}



.ml--40 {

  margin-left: 40px !important;

}



.ptb--45 {

  padding: 45px 0 !important;

}



.plr--45 {

  padding: 0 45px !important;

}



.pt--45 {

  padding-top: 45px !important;

}



.pb--45 {

  padding-bottom: 45px !important;

}



.pl--45 {

  padding-left: 45px !important;

}



.pr--45 {

  padding-right: 45px !important;

}



.mt--45 {

  margin-top: 45px !important;

}



.mb--45 {

  margin-bottom: 45px !important;

}



.mr--45 {

  margin-right: 45px !important;

}



.ml--45 {

  margin-left: 45px !important;

}



.ptb--50 {

  padding: 50px 0 !important;

}



.plr--50 {

  padding: 0 50px !important;

}



.pt--50 {

  padding-top: 50px !important;

}



.pb--50 {

  padding-bottom: 50px !important;

}



.pl--50 {

  padding-left: 50px !important;

}



.pr--50 {

  padding-right: 50px !important;

}



.mt--50 {

  margin-top: 50px !important;

}



.mb--50 {

  margin-bottom: 50px !important;

}



.mr--50 {

  margin-right: 50px !important;

}



.ml--50 {

  margin-left: 50px !important;

}



.ptb--55 {

  padding: 55px 0 !important;

}



.plr--55 {

  padding: 0 55px !important;

}



.pt--55 {

  padding-top: 55px !important;

}



.pb--55 {

  padding-bottom: 55px !important;

}



.pl--55 {

  padding-left: 55px !important;

}



.pr--55 {

  padding-right: 55px !important;

}



.mt--55 {

  margin-top: 55px !important;

}



.mb--55 {

  margin-bottom: 55px !important;

}



.mr--55 {

  margin-right: 55px !important;

}



.ml--55 {

  margin-left: 55px !important;

}



.ptb--60 {

  padding: 60px 0 !important;

}



.plr--60 {

  padding: 0 60px !important;

}



.pt--60 {

  padding-top: 60px !important;

}



.pb--60 {

  padding-bottom: 60px !important;

}



.pl--60 {

  padding-left: 60px !important;

}



.pr--60 {

  padding-right: 60px !important;

}



.mt--60 {

  margin-top: 60px !important;

}



.mb--60 {

  margin-bottom: 60px !important;

}



.mr--60 {

  margin-right: 60px !important;

}



.ml--60 {

  margin-left: 60px !important;

}



.ptb--65 {

  padding: 65px 0 !important;

}



.plr--65 {

  padding: 0 65px !important;

}



.pt--65 {

  padding-top: 65px !important;

}



.pb--65 {

  padding-bottom: 65px !important;

}



.pl--65 {

  padding-left: 65px !important;

}



.pr--65 {

  padding-right: 65px !important;

}



.mt--65 {

  margin-top: 65px !important;

}



.mb--65 {

  margin-bottom: 65px !important;

}



.mr--65 {

  margin-right: 65px !important;

}



.ml--65 {

  margin-left: 65px !important;

}



.ptb--70 {

  padding: 70px 0 !important;

}



.plr--70 {

  padding: 0 70px !important;

}



.pt--70 {

  padding-top: 70px !important;

}



.pb--70 {

  padding-bottom: 70px !important;

}



.pl--70 {

  padding-left: 70px !important;

}



.pr--70 {

  padding-right: 70px !important;

}



.mt--70 {

  margin-top: 70px !important;

}



.mb--70 {

  margin-bottom: 70px !important;

}



.mr--70 {

  margin-right: 70px !important;

}



.ml--70 {

  margin-left: 70px !important;

}



.ptb--75 {

  padding: 75px 0 !important;

}



.plr--75 {

  padding: 0 75px !important;

}



.pt--75 {

  padding-top: 75px !important;

}



.pb--75 {

  padding-bottom: 75px !important;

}



.pl--75 {

  padding-left: 75px !important;

}



.pr--75 {

  padding-right: 75px !important;

}



.mt--75 {

  margin-top: 75px !important;

}



.mb--75 {

  margin-bottom: 75px !important;

}



.mr--75 {

  margin-right: 75px !important;

}



.ml--75 {

  margin-left: 75px !important;

}



.ptb--80 {

  padding: 80px 0 !important;

}



.plr--80 {

  padding: 0 80px !important;

}



.pt--80 {

  padding-top: 80px !important;

}



.pb--80 {

  padding-bottom: 80px !important;

}



.pl--80 {

  padding-left: 80px !important;

}



.pr--80 {

  padding-right: 80px !important;

}



.mt--80 {

  margin-top: 80px !important;

}



.mb--80 {

  margin-bottom: 80px !important;

}



.mr--80 {

  margin-right: 80px !important;

}



.ml--80 {

  margin-left: 80px !important;

}



.ptb--85 {

  padding: 85px 0 !important;

}



.plr--85 {

  padding: 0 85px !important;

}



.pt--85 {

  padding-top: 85px !important;

}



.pb--85 {

  padding-bottom: 85px !important;

}



.pl--85 {

  padding-left: 85px !important;

}



.pr--85 {

  padding-right: 85px !important;

}



.mt--85 {

  margin-top: 85px !important;

}



.mb--85 {

  margin-bottom: 85px !important;

}



.mr--85 {

  margin-right: 85px !important;

}



.ml--85 {

  margin-left: 85px !important;

}



.ptb--90 {

  padding: 90px 0 !important;

}



.plr--90 {

  padding: 0 90px !important;

}



.pt--90 {

  padding-top: 90px !important;

}



.pb--90 {

  padding-bottom: 90px !important;

}



.pl--90 {

  padding-left: 90px !important;

}



.pr--90 {

  padding-right: 90px !important;

}



.mt--90 {

  margin-top: 90px !important;

}



.mb--90 {

  margin-bottom: 90px !important;

}



.mr--90 {

  margin-right: 90px !important;

}



.ml--90 {

  margin-left: 90px !important;

}



.ptb--95 {

  padding: 95px 0 !important;

}



.plr--95 {

  padding: 0 95px !important;

}



.pt--95 {

  padding-top: 95px !important;

}



.pb--95 {

  padding-bottom: 95px !important;

}



.pl--95 {

  padding-left: 95px !important;

}



.pr--95 {

  padding-right: 95px !important;

}



.mt--95 {

  margin-top: 95px !important;

}



.mb--95 {

  margin-bottom: 95px !important;

}



.mr--95 {

  margin-right: 95px !important;

}



.ml--95 {

  margin-left: 95px !important;

}



.ptb--100 {

  padding: 100px 0 !important;

}



.plr--100 {

  padding: 0 100px !important;

}



.pt--100 {

  padding-top: 100px !important;

}



.pb--100 {

  padding-bottom: 100px !important;

}



.pl--100 {

  padding-left: 100px !important;

}



.pr--100 {

  padding-right: 100px !important;

}



.mt--100 {

  margin-top: 100px !important;

}



.mb--100 {

  margin-bottom: 100px !important;

}



.mr--100 {

  margin-right: 100px !important;

}



.ml--100 {

  margin-left: 100px !important;

}



.ptb--105 {

  padding: 105px 0 !important;

}



.plr--105 {

  padding: 0 105px !important;

}



.pt--105 {

  padding-top: 105px !important;

}



.pb--105 {

  padding-bottom: 105px !important;

}



.pl--105 {

  padding-left: 105px !important;

}



.pr--105 {

  padding-right: 105px !important;

}



.mt--105 {

  margin-top: 105px !important;

}



.mb--105 {

  margin-bottom: 105px !important;

}



.mr--105 {

  margin-right: 105px !important;

}



.ml--105 {

  margin-left: 105px !important;

}



.ptb--110 {

  padding: 110px 0 !important;

}



.plr--110 {

  padding: 0 110px !important;

}



.pt--110 {

  padding-top: 110px !important;

}



.pb--110 {

  padding-bottom: 110px !important;

}



.pl--110 {

  padding-left: 110px !important;

}



.pr--110 {

  padding-right: 110px !important;

}



.mt--110 {

  margin-top: 110px !important;

}



.mb--110 {

  margin-bottom: 110px !important;

}



.mr--110 {

  margin-right: 110px !important;

}



.ml--110 {

  margin-left: 110px !important;

}



.ptb--115 {

  padding: 115px 0 !important;

}



.plr--115 {

  padding: 0 115px !important;

}



.pt--115 {

  padding-top: 115px !important;

}



.pb--115 {

  padding-bottom: 115px !important;

}



.pl--115 {

  padding-left: 115px !important;

}



.pr--115 {

  padding-right: 115px !important;

}



.mt--115 {

  margin-top: 115px !important;

}



.mb--115 {

  margin-bottom: 115px !important;

}



.mr--115 {

  margin-right: 115px !important;

}



.ml--115 {

  margin-left: 115px !important;

}



.ptb--120 {

  padding: 120px 0 !important;

}



.plr--120 {

  padding: 0 120px !important;

}



.pt--120 {

  padding-top: 120px !important;

}



.pb--120 {

  padding-bottom: 120px !important;

}



.pl--120 {

  padding-left: 120px !important;

}



.pr--120 {

  padding-right: 120px !important;

}



.mt--120 {

  margin-top: 120px !important;

}



.mb--120 {

  margin-bottom: 120px !important;

}



.mr--120 {

  margin-right: 120px !important;

}



.ml--120 {

  margin-left: 120px !important;

}



.ptb--125 {

  padding: 125px 0 !important;

}



.plr--125 {

  padding: 0 125px !important;

}



.pt--125 {

  padding-top: 125px !important;

}



.pb--125 {

  padding-bottom: 125px !important;

}



.pl--125 {

  padding-left: 125px !important;

}



.pr--125 {

  padding-right: 125px !important;

}



.mt--125 {

  margin-top: 125px !important;

}



.mb--125 {

  margin-bottom: 125px !important;

}



.mr--125 {

  margin-right: 125px !important;

}



.ml--125 {

  margin-left: 125px !important;

}



.ptb--130 {

  padding: 130px 0 !important;

}



.plr--130 {

  padding: 0 130px !important;

}



.pt--130 {

  padding-top: 130px !important;

}



.pb--130 {

  padding-bottom: 130px !important;

}



.pl--130 {

  padding-left: 130px !important;

}



.pr--130 {

  padding-right: 130px !important;

}



.mt--130 {

  margin-top: 130px !important;

}



.mb--130 {

  margin-bottom: 130px !important;

}



.mr--130 {

  margin-right: 130px !important;

}



.ml--130 {

  margin-left: 130px !important;

}



.ptb--135 {

  padding: 135px 0 !important;

}



.plr--135 {

  padding: 0 135px !important;

}



.pt--135 {

  padding-top: 135px !important;

}



.pb--135 {

  padding-bottom: 135px !important;

}



.pl--135 {

  padding-left: 135px !important;

}



.pr--135 {

  padding-right: 135px !important;

}



.mt--135 {

  margin-top: 135px !important;

}



.mb--135 {

  margin-bottom: 135px !important;

}



.mr--135 {

  margin-right: 135px !important;

}



.ml--135 {

  margin-left: 135px !important;

}



.ptb--140 {

  padding: 140px 0 !important;

}



.plr--140 {

  padding: 0 140px !important;

}



.pt--140 {

  padding-top: 140px !important;

}



.pb--140 {

  padding-bottom: 140px !important;

}



.pl--140 {

  padding-left: 140px !important;

}



.pr--140 {

  padding-right: 140px !important;

}



.mt--140 {

  margin-top: 140px !important;

}



.mb--140 {

  margin-bottom: 140px !important;

}



.mr--140 {

  margin-right: 140px !important;

}



.ml--140 {

  margin-left: 140px !important;

}



.ptb--145 {

  padding: 145px 0 !important;

}



.plr--145 {

  padding: 0 145px !important;

}



.pt--145 {

  padding-top: 145px !important;

}



.pb--145 {

  padding-bottom: 145px !important;

}



.pl--145 {

  padding-left: 145px !important;

}



.pr--145 {

  padding-right: 145px !important;

}



.mt--145 {

  margin-top: 145px !important;

}



.mb--145 {

  margin-bottom: 145px !important;

}



.mr--145 {

  margin-right: 145px !important;

}



.ml--145 {

  margin-left: 145px !important;

}



.ptb--150 {

  padding: 150px 0 !important;

}



.plr--150 {

  padding: 0 150px !important;

}



.pt--150 {

  padding-top: 150px !important;

}



.pb--150 {

  padding-bottom: 150px !important;

}



.pl--150 {

  padding-left: 150px !important;

}



.pr--150 {

  padding-right: 150px !important;

}



.mt--150 {

  margin-top: 150px !important;

}



.mb--150 {

  margin-bottom: 150px !important;

}



.mr--150 {

  margin-right: 150px !important;

}



.ml--150 {

  margin-left: 150px !important;

}



.ptb--155 {

  padding: 155px 0 !important;

}



.plr--155 {

  padding: 0 155px !important;

}



.pt--155 {

  padding-top: 155px !important;

}



.pb--155 {

  padding-bottom: 155px !important;

}



.pl--155 {

  padding-left: 155px !important;

}



.pr--155 {

  padding-right: 155px !important;

}



.mt--155 {

  margin-top: 155px !important;

}



.mb--155 {

  margin-bottom: 155px !important;

}



.mr--155 {

  margin-right: 155px !important;

}



.ml--155 {

  margin-left: 155px !important;

}



.ptb--160 {

  padding: 160px 0 !important;

}



.plr--160 {

  padding: 0 160px !important;

}



.pt--160 {

  padding-top: 160px !important;

}



.pb--160 {

  padding-bottom: 160px !important;

}



.pl--160 {

  padding-left: 160px !important;

}



.pr--160 {

  padding-right: 160px !important;

}



.mt--160 {

  margin-top: 160px !important;

}



.mb--160 {

  margin-bottom: 160px !important;

}



.mr--160 {

  margin-right: 160px !important;

}



.ml--160 {

  margin-left: 160px !important;

}



.ptb--165 {

  padding: 165px 0 !important;

}



.plr--165 {

  padding: 0 165px !important;

}



.pt--165 {

  padding-top: 165px !important;

}



.pb--165 {

  padding-bottom: 165px !important;

}



.pl--165 {

  padding-left: 165px !important;

}



.pr--165 {

  padding-right: 165px !important;

}



.mt--165 {

  margin-top: 165px !important;

}



.mb--165 {

  margin-bottom: 165px !important;

}



.mr--165 {

  margin-right: 165px !important;

}



.ml--165 {

  margin-left: 165px !important;

}



.ptb--170 {

  padding: 170px 0 !important;

}



.plr--170 {

  padding: 0 170px !important;

}



.pt--170 {

  padding-top: 170px !important;

}



.pb--170 {

  padding-bottom: 170px !important;

}



.pl--170 {

  padding-left: 170px !important;

}



.pr--170 {

  padding-right: 170px !important;

}



.mt--170 {

  margin-top: 170px !important;

}



.mb--170 {

  margin-bottom: 170px !important;

}



.mr--170 {

  margin-right: 170px !important;

}



.ml--170 {

  margin-left: 170px !important;

}



.ptb--175 {

  padding: 175px 0 !important;

}



.plr--175 {

  padding: 0 175px !important;

}



.pt--175 {

  padding-top: 175px !important;

}



.pb--175 {

  padding-bottom: 175px !important;

}



.pl--175 {

  padding-left: 175px !important;

}



.pr--175 {

  padding-right: 175px !important;

}



.mt--175 {

  margin-top: 175px !important;

}



.mb--175 {

  margin-bottom: 175px !important;

}



.mr--175 {

  margin-right: 175px !important;

}



.ml--175 {

  margin-left: 175px !important;

}



.ptb--180 {

  padding: 180px 0 !important;

}



.plr--180 {

  padding: 0 180px !important;

}



.pt--180 {

  padding-top: 180px !important;

}



.pb--180 {

  padding-bottom: 180px !important;

}



.pl--180 {

  padding-left: 180px !important;

}



.pr--180 {

  padding-right: 180px !important;

}



.mt--180 {

  margin-top: 180px !important;

}



.mb--180 {

  margin-bottom: 180px !important;

}



.mr--180 {

  margin-right: 180px !important;

}



.ml--180 {

  margin-left: 180px !important;

}



.ptb--185 {

  padding: 185px 0 !important;

}



.plr--185 {

  padding: 0 185px !important;

}



.pt--185 {

  padding-top: 185px !important;

}



.pb--185 {

  padding-bottom: 185px !important;

}



.pl--185 {

  padding-left: 185px !important;

}



.pr--185 {

  padding-right: 185px !important;

}



.mt--185 {

  margin-top: 185px !important;

}



.mb--185 {

  margin-bottom: 185px !important;

}



.mr--185 {

  margin-right: 185px !important;

}



.ml--185 {

  margin-left: 185px !important;

}



.ptb--190 {

  padding: 190px 0 !important;

}



.plr--190 {

  padding: 0 190px !important;

}



.pt--190 {

  padding-top: 190px !important;

}



.pb--190 {

  padding-bottom: 190px !important;

}



.pl--190 {

  padding-left: 190px !important;

}



.pr--190 {

  padding-right: 190px !important;

}



.mt--190 {

  margin-top: 190px !important;

}



.mb--190 {

  margin-bottom: 190px !important;

}



.mr--190 {

  margin-right: 190px !important;

}



.ml--190 {

  margin-left: 190px !important;

}



.ptb--195 {

  padding: 195px 0 !important;

}



.plr--195 {

  padding: 0 195px !important;

}



.pt--195 {

  padding-top: 195px !important;

}



.pb--195 {

  padding-bottom: 195px !important;

}



.pl--195 {

  padding-left: 195px !important;

}



.pr--195 {

  padding-right: 195px !important;

}



.mt--195 {

  margin-top: 195px !important;

}



.mb--195 {

  margin-bottom: 195px !important;

}



.mr--195 {

  margin-right: 195px !important;

}



.ml--195 {

  margin-left: 195px !important;

}



.ptb--200 {

  padding: 200px 0 !important;

}



.plr--200 {

  padding: 0 200px !important;

}



.pt--200 {

  padding-top: 200px !important;

}



.pb--200 {

  padding-bottom: 200px !important;

}



.pl--200 {

  padding-left: 200px !important;

}



.pr--200 {

  padding-right: 200px !important;

}



.mt--200 {

  margin-top: 200px !important;

}



.mb--200 {

  margin-bottom: 200px !important;

}



.mr--200 {

  margin-right: 200px !important;

}



.ml--200 {

  margin-left: 200px !important;

}



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

  .ptb_lp--5 {

    padding: 5px 0;

  }

  .plr_lp--5 {

    padding: 0 5px;

  }

  .pt_lp--5 {

    padding-top: 5px;

  }

  .pb_lp--5 {

    padding-bottom: 5px;

  }

  .pl_lp--5 {

    padding-left: 5px;

  }

  .pr_lp--5 {

    padding-right: 5px;

  }

  .mt_lp--5 {

    margin-top: 5px;

  }

  .mb_lp--5 {

    margin-bottom: 5px;

  }

  .ptb_lp--10 {

    padding: 10px 0;

  }

  .plr_lp--10 {

    padding: 0 10px;

  }

  .pt_lp--10 {

    padding-top: 10px;

  }

  .pb_lp--10 {

    padding-bottom: 10px;

  }

  .pl_lp--10 {

    padding-left: 10px;

  }

  .pr_lp--10 {

    padding-right: 10px;

  }

  .mt_lp--10 {

    margin-top: 10px;

  }

  .mb_lp--10 {

    margin-bottom: 10px;

  }

  .ptb_lp--15 {

    padding: 15px 0;

  }

  .plr_lp--15 {

    padding: 0 15px;

  }

  .pt_lp--15 {

    padding-top: 15px;

  }

  .pb_lp--15 {

    padding-bottom: 15px;

  }

  .pl_lp--15 {

    padding-left: 15px;

  }

  .pr_lp--15 {

    padding-right: 15px;

  }

  .mt_lp--15 {

    margin-top: 15px;

  }

  .mb_lp--15 {

    margin-bottom: 15px;

  }

  .ptb_lp--20 {

    padding: 20px 0;

  }

  .plr_lp--20 {

    padding: 0 20px;

  }

  .pt_lp--20 {

    padding-top: 20px;

  }

  .pb_lp--20 {

    padding-bottom: 20px;

  }

  .pl_lp--20 {

    padding-left: 20px;

  }

  .pr_lp--20 {

    padding-right: 20px;

  }

  .mt_lp--20 {

    margin-top: 20px;

  }

  .mb_lp--20 {

    margin-bottom: 20px;

  }

  .ptb_lp--25 {

    padding: 25px 0;

  }

  .plr_lp--25 {

    padding: 0 25px;

  }

  .pt_lp--25 {

    padding-top: 25px;

  }

  .pb_lp--25 {

    padding-bottom: 25px;

  }

  .pl_lp--25 {

    padding-left: 25px;

  }

  .pr_lp--25 {

    padding-right: 25px;

  }

  .mt_lp--25 {

    margin-top: 25px;

  }

  .mb_lp--25 {

    margin-bottom: 25px;

  }

  .ptb_lp--30 {

    padding: 30px 0;

  }

  .plr_lp--30 {

    padding: 0 30px;

  }

  .pt_lp--30 {

    padding-top: 30px;

  }

  .pb_lp--30 {

    padding-bottom: 30px;

  }

  .pl_lp--30 {

    padding-left: 30px;

  }

  .pr_lp--30 {

    padding-right: 30px;

  }

  .mt_lp--30 {

    margin-top: 30px;

  }

  .mb_lp--30 {

    margin-bottom: 30px;

  }

  .ptb_lp--35 {

    padding: 35px 0;

  }

  .plr_lp--35 {

    padding: 0 35px;

  }

  .pt_lp--35 {

    padding-top: 35px;

  }

  .pb_lp--35 {

    padding-bottom: 35px;

  }

  .pl_lp--35 {

    padding-left: 35px;

  }

  .pr_lp--35 {

    padding-right: 35px;

  }

  .mt_lp--35 {

    margin-top: 35px;

  }

  .mb_lp--35 {

    margin-bottom: 35px;

  }

  .ptb_lp--40 {

    padding: 40px 0;

  }

  .plr_lp--40 {

    padding: 0 40px;

  }

  .pt_lp--40 {

    padding-top: 40px;

  }

  .pb_lp--40 {

    padding-bottom: 40px;

  }

  .pl_lp--40 {

    padding-left: 40px;

  }

  .pr_lp--40 {

    padding-right: 40px;

  }

  .mt_lp--40 {

    margin-top: 40px;

  }

  .mb_lp--40 {

    margin-bottom: 40px;

  }

  .ptb_lp--45 {

    padding: 45px 0;

  }

  .plr_lp--45 {

    padding: 0 45px;

  }

  .pt_lp--45 {

    padding-top: 45px;

  }

  .pb_lp--45 {

    padding-bottom: 45px;

  }

  .pl_lp--45 {

    padding-left: 45px;

  }

  .pr_lp--45 {

    padding-right: 45px;

  }

  .mt_lp--45 {

    margin-top: 45px;

  }

  .mb_lp--45 {

    margin-bottom: 45px;

  }

  .ptb_lp--50 {

    padding: 50px 0;

  }

  .plr_lp--50 {

    padding: 0 50px;

  }

  .pt_lp--50 {

    padding-top: 50px;

  }

  .pb_lp--50 {

    padding-bottom: 50px;

  }

  .pl_lp--50 {

    padding-left: 50px;

  }

  .pr_lp--50 {

    padding-right: 50px;

  }

  .mt_lp--50 {

    margin-top: 50px;

  }

  .mb_lp--50 {

    margin-bottom: 50px;

  }

  .ptb_lp--55 {

    padding: 55px 0;

  }

  .plr_lp--55 {

    padding: 0 55px;

  }

  .pt_lp--55 {

    padding-top: 55px;

  }

  .pb_lp--55 {

    padding-bottom: 55px;

  }

  .pl_lp--55 {

    padding-left: 55px;

  }

  .pr_lp--55 {

    padding-right: 55px;

  }

  .mt_lp--55 {

    margin-top: 55px;

  }

  .mb_lp--55 {

    margin-bottom: 55px;

  }

  .ptb_lp--60 {

    padding: 60px 0;

  }

  .plr_lp--60 {

    padding: 0 60px;

  }

  .pt_lp--60 {

    padding-top: 60px;

  }

  .pb_lp--60 {

    padding-bottom: 60px;

  }

  .pl_lp--60 {

    padding-left: 60px;

  }

  .pr_lp--60 {

    padding-right: 60px;

  }

  .mt_lp--60 {

    margin-top: 60px;

  }

  .mb_lp--60 {

    margin-bottom: 60px;

  }

  .ptb_lp--65 {

    padding: 65px 0;

  }

  .plr_lp--65 {

    padding: 0 65px;

  }

  .pt_lp--65 {

    padding-top: 65px;

  }

  .pb_lp--65 {

    padding-bottom: 65px;

  }

  .pl_lp--65 {

    padding-left: 65px;

  }

  .pr_lp--65 {

    padding-right: 65px;

  }

  .mt_lp--65 {

    margin-top: 65px;

  }

  .mb_lp--65 {

    margin-bottom: 65px;

  }

  .ptb_lp--70 {

    padding: 70px 0;

  }

  .plr_lp--70 {

    padding: 0 70px;

  }

  .pt_lp--70 {

    padding-top: 70px;

  }

  .pb_lp--70 {

    padding-bottom: 70px;

  }

  .pl_lp--70 {

    padding-left: 70px;

  }

  .pr_lp--70 {

    padding-right: 70px;

  }

  .mt_lp--70 {

    margin-top: 70px;

  }

  .mb_lp--70 {

    margin-bottom: 70px;

  }

  .ptb_lp--75 {

    padding: 75px 0;

  }

  .plr_lp--75 {

    padding: 0 75px;

  }

  .pt_lp--75 {

    padding-top: 75px;

  }

  .pb_lp--75 {

    padding-bottom: 75px;

  }

  .pl_lp--75 {

    padding-left: 75px;

  }

  .pr_lp--75 {

    padding-right: 75px;

  }

  .mt_lp--75 {

    margin-top: 75px;

  }

  .mb_lp--75 {

    margin-bottom: 75px;

  }

  .ptb_lp--80 {

    padding: 80px 0;

  }

  .plr_lp--80 {

    padding: 0 80px;

  }

  .pt_lp--80 {

    padding-top: 80px;

  }

  .pb_lp--80 {

    padding-bottom: 80px;

  }

  .pl_lp--80 {

    padding-left: 80px;

  }

  .pr_lp--80 {

    padding-right: 80px;

  }

  .mt_lp--80 {

    margin-top: 80px;

  }

  .mb_lp--80 {

    margin-bottom: 80px;

  }

  .ptb_lp--85 {

    padding: 85px 0;

  }

  .plr_lp--85 {

    padding: 0 85px;

  }

  .pt_lp--85 {

    padding-top: 85px;

  }

  .pb_lp--85 {

    padding-bottom: 85px;

  }

  .pl_lp--85 {

    padding-left: 85px;

  }

  .pr_lp--85 {

    padding-right: 85px;

  }

  .mt_lp--85 {

    margin-top: 85px;

  }

  .mb_lp--85 {

    margin-bottom: 85px;

  }

  .ptb_lp--90 {

    padding: 90px 0;

  }

  .plr_lp--90 {

    padding: 0 90px;

  }

  .pt_lp--90 {

    padding-top: 90px;

  }

  .pb_lp--90 {

    padding-bottom: 90px;

  }

  .pl_lp--90 {

    padding-left: 90px;

  }

  .pr_lp--90 {

    padding-right: 90px;

  }

  .mt_lp--90 {

    margin-top: 90px;

  }

  .mb_lp--90 {

    margin-bottom: 90px;

  }

  .ptb_lp--95 {

    padding: 95px 0;

  }

  .plr_lp--95 {

    padding: 0 95px;

  }

  .pt_lp--95 {

    padding-top: 95px;

  }

  .pb_lp--95 {

    padding-bottom: 95px;

  }

  .pl_lp--95 {

    padding-left: 95px;

  }

  .pr_lp--95 {

    padding-right: 95px;

  }

  .mt_lp--95 {

    margin-top: 95px;

  }

  .mb_lp--95 {

    margin-bottom: 95px;

  }

  .ptb_lp--100 {

    padding: 100px 0;

  }

  .plr_lp--100 {

    padding: 0 100px;

  }

  .pt_lp--100 {

    padding-top: 100px;

  }

  .pb_lp--100 {

    padding-bottom: 100px;

  }

  .pl_lp--100 {

    padding-left: 100px;

  }

  .pr_lp--100 {

    padding-right: 100px;

  }

  .mt_lp--100 {

    margin-top: 100px;

  }

  .mb_lp--100 {

    margin-bottom: 100px;

  }

}

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

  .ptb_lg--5 {

    padding: 5px 0 !important;

  }

  .plr_lg--5 {

    padding: 0 5px !important;

  }

  .pt_lg--5 {

    padding-top: 5px !important;

  }

  .pb_lg--5 {

    padding-bottom: 5px !important;

  }

  .pl_lg--5 {

    padding-left: 5px !important;

  }

  .pr_lg--5 {

    padding-right: 5px !important;

  }

  .mt_lg--5 {

    margin-top: 5px !important;

  }

  .mb_lg--5 {

    margin-bottom: 5px !important;

  }

  .ml_lg--5 {

    margin-left: 5px !important;

  }

  .ptb_lg--10 {

    padding: 10px 0 !important;

  }

  .plr_lg--10 {

    padding: 0 10px !important;

  }

  .pt_lg--10 {

    padding-top: 10px !important;

  }

  .pb_lg--10 {

    padding-bottom: 10px !important;

  }

  .pl_lg--10 {

    padding-left: 10px !important;

  }

  .pr_lg--10 {

    padding-right: 10px !important;

  }

  .mt_lg--10 {

    margin-top: 10px !important;

  }

  .mb_lg--10 {

    margin-bottom: 10px !important;

  }

  .ml_lg--10 {

    margin-left: 10px !important;

  }

  .ptb_lg--15 {

    padding: 15px 0 !important;

  }

  .plr_lg--15 {

    padding: 0 15px !important;

  }

  .pt_lg--15 {

    padding-top: 15px !important;

  }

  .pb_lg--15 {

    padding-bottom: 15px !important;

  }

  .pl_lg--15 {

    padding-left: 15px !important;

  }

  .pr_lg--15 {

    padding-right: 15px !important;

  }

  .mt_lg--15 {

    margin-top: 15px !important;

  }

  .mb_lg--15 {

    margin-bottom: 15px !important;

  }

  .ml_lg--15 {

    margin-left: 15px !important;

  }

  .ptb_lg--20 {

    padding: 20px 0 !important;

  }

  .plr_lg--20 {

    padding: 0 20px !important;

  }

  .pt_lg--20 {

    padding-top: 20px !important;

  }

  .pb_lg--20 {

    padding-bottom: 20px !important;

  }

  .pl_lg--20 {

    padding-left: 20px !important;

  }

  .pr_lg--20 {

    padding-right: 20px !important;

  }

  .mt_lg--20 {

    margin-top: 20px !important;

  }

  .mb_lg--20 {

    margin-bottom: 20px !important;

  }

  .ml_lg--20 {

    margin-left: 20px !important;

  }

  .ptb_lg--25 {

    padding: 25px 0 !important;

  }

  .plr_lg--25 {

    padding: 0 25px !important;

  }

  .pt_lg--25 {

    padding-top: 25px !important;

  }

  .pb_lg--25 {

    padding-bottom: 25px !important;

  }

  .pl_lg--25 {

    padding-left: 25px !important;

  }

  .pr_lg--25 {

    padding-right: 25px !important;

  }

  .mt_lg--25 {

    margin-top: 25px !important;

  }

  .mb_lg--25 {

    margin-bottom: 25px !important;

  }

  .ml_lg--25 {

    margin-left: 25px !important;

  }

  .ptb_lg--30 {

    padding: 30px 0 !important;

  }

  .plr_lg--30 {

    padding: 0 30px !important;

  }

  .pt_lg--30 {

    padding-top: 30px !important;

  }

  .pb_lg--30 {

    padding-bottom: 30px !important;

  }

  .pl_lg--30 {

    padding-left: 30px !important;

  }

  .pr_lg--30 {

    padding-right: 30px !important;

  }

  .mt_lg--30 {

    margin-top: 30px !important;

  }

  .mb_lg--30 {

    margin-bottom: 30px !important;

  }

  .ml_lg--30 {

    margin-left: 30px !important;

  }

  .ptb_lg--35 {

    padding: 35px 0 !important;

  }

  .plr_lg--35 {

    padding: 0 35px !important;

  }

  .pt_lg--35 {

    padding-top: 35px !important;

  }

  .pb_lg--35 {

    padding-bottom: 35px !important;

  }

  .pl_lg--35 {

    padding-left: 35px !important;

  }

  .pr_lg--35 {

    padding-right: 35px !important;

  }

  .mt_lg--35 {

    margin-top: 35px !important;

  }

  .mb_lg--35 {

    margin-bottom: 35px !important;

  }

  .ml_lg--35 {

    margin-left: 35px !important;

  }

  .ptb_lg--40 {

    padding: 40px 0 !important;

  }

  .plr_lg--40 {

    padding: 0 40px !important;

  }

  .pt_lg--40 {

    padding-top: 40px !important;

  }

  .pb_lg--40 {

    padding-bottom: 40px !important;

  }

  .pl_lg--40 {

    padding-left: 40px !important;

  }

  .pr_lg--40 {

    padding-right: 40px !important;

  }

  .mt_lg--40 {

    margin-top: 40px !important;

  }

  .mb_lg--40 {

    margin-bottom: 40px !important;

  }

  .ml_lg--40 {

    margin-left: 40px !important;

  }

  .ptb_lg--45 {

    padding: 45px 0 !important;

  }

  .plr_lg--45 {

    padding: 0 45px !important;

  }

  .pt_lg--45 {

    padding-top: 45px !important;

  }

  .pb_lg--45 {

    padding-bottom: 45px !important;

  }

  .pl_lg--45 {

    padding-left: 45px !important;

  }

  .pr_lg--45 {

    padding-right: 45px !important;

  }

  .mt_lg--45 {

    margin-top: 45px !important;

  }

  .mb_lg--45 {

    margin-bottom: 45px !important;

  }

  .ml_lg--45 {

    margin-left: 45px !important;

  }

  .ptb_lg--50 {

    padding: 50px 0 !important;

  }

  .plr_lg--50 {

    padding: 0 50px !important;

  }

  .pt_lg--50 {

    padding-top: 50px !important;

  }

  .pb_lg--50 {

    padding-bottom: 50px !important;

  }

  .pl_lg--50 {

    padding-left: 50px !important;

  }

  .pr_lg--50 {

    padding-right: 50px !important;

  }

  .mt_lg--50 {

    margin-top: 50px !important;

  }

  .mb_lg--50 {

    margin-bottom: 50px !important;

  }

  .ml_lg--50 {

    margin-left: 50px !important;

  }

  .ptb_lg--55 {

    padding: 55px 0 !important;

  }

  .plr_lg--55 {

    padding: 0 55px !important;

  }

  .pt_lg--55 {

    padding-top: 55px !important;

  }

  .pb_lg--55 {

    padding-bottom: 55px !important;

  }

  .pl_lg--55 {

    padding-left: 55px !important;

  }

  .pr_lg--55 {

    padding-right: 55px !important;

  }

  .mt_lg--55 {

    margin-top: 55px !important;

  }

  .mb_lg--55 {

    margin-bottom: 55px !important;

  }

  .ml_lg--55 {

    margin-left: 55px !important;

  }

  .ptb_lg--60 {

    padding: 60px 0 !important;

  }

  .plr_lg--60 {

    padding: 0 60px !important;

  }

  .pt_lg--60 {

    padding-top: 60px !important;

  }

  .pb_lg--60 {

    padding-bottom: 60px !important;

  }

  .pl_lg--60 {

    padding-left: 60px !important;

  }

  .pr_lg--60 {

    padding-right: 60px !important;

  }

  .mt_lg--60 {

    margin-top: 60px !important;

  }

  .mb_lg--60 {

    margin-bottom: 60px !important;

  }

  .ml_lg--60 {

    margin-left: 60px !important;

  }

  .ptb_lg--65 {

    padding: 65px 0 !important;

  }

  .plr_lg--65 {

    padding: 0 65px !important;

  }

  .pt_lg--65 {

    padding-top: 65px !important;

  }

  .pb_lg--65 {

    padding-bottom: 65px !important;

  }

  .pl_lg--65 {

    padding-left: 65px !important;

  }

  .pr_lg--65 {

    padding-right: 65px !important;

  }

  .mt_lg--65 {

    margin-top: 65px !important;

  }

  .mb_lg--65 {

    margin-bottom: 65px !important;

  }

  .ml_lg--65 {

    margin-left: 65px !important;

  }

  .ptb_lg--70 {

    padding: 70px 0 !important;

  }

  .plr_lg--70 {

    padding: 0 70px !important;

  }

  .pt_lg--70 {

    padding-top: 70px !important;

  }

  .pb_lg--70 {

    padding-bottom: 70px !important;

  }

  .pl_lg--70 {

    padding-left: 70px !important;

  }

  .pr_lg--70 {

    padding-right: 70px !important;

  }

  .mt_lg--70 {

    margin-top: 70px !important;

  }

  .mb_lg--70 {

    margin-bottom: 70px !important;

  }

  .ml_lg--70 {

    margin-left: 70px !important;

  }

  .ptb_lg--75 {

    padding: 75px 0 !important;

  }

  .plr_lg--75 {

    padding: 0 75px !important;

  }

  .pt_lg--75 {

    padding-top: 75px !important;

  }

  .pb_lg--75 {

    padding-bottom: 75px !important;

  }

  .pl_lg--75 {

    padding-left: 75px !important;

  }

  .pr_lg--75 {

    padding-right: 75px !important;

  }

  .mt_lg--75 {

    margin-top: 75px !important;

  }

  .mb_lg--75 {

    margin-bottom: 75px !important;

  }

  .ml_lg--75 {

    margin-left: 75px !important;

  }

  .ptb_lg--80 {

    padding: 80px 0 !important;

  }

  .plr_lg--80 {

    padding: 0 80px !important;

  }

  .pt_lg--80 {

    padding-top: 80px !important;

  }

  .pb_lg--80 {

    padding-bottom: 80px !important;

  }

  .pl_lg--80 {

    padding-left: 80px !important;

  }

  .pr_lg--80 {

    padding-right: 80px !important;

  }

  .mt_lg--80 {

    margin-top: 80px !important;

  }

  .mb_lg--80 {

    margin-bottom: 80px !important;

  }

  .ml_lg--80 {

    margin-left: 80px !important;

  }

  .ptb_lg--85 {

    padding: 85px 0 !important;

  }

  .plr_lg--85 {

    padding: 0 85px !important;

  }

  .pt_lg--85 {

    padding-top: 85px !important;

  }

  .pb_lg--85 {

    padding-bottom: 85px !important;

  }

  .pl_lg--85 {

    padding-left: 85px !important;

  }

  .pr_lg--85 {

    padding-right: 85px !important;

  }

  .mt_lg--85 {

    margin-top: 85px !important;

  }

  .mb_lg--85 {

    margin-bottom: 85px !important;

  }

  .ml_lg--85 {

    margin-left: 85px !important;

  }

  .ptb_lg--90 {

    padding: 90px 0 !important;

  }

  .plr_lg--90 {

    padding: 0 90px !important;

  }

  .pt_lg--90 {

    padding-top: 90px !important;

  }

  .pb_lg--90 {

    padding-bottom: 90px !important;

  }

  .pl_lg--90 {

    padding-left: 90px !important;

  }

  .pr_lg--90 {

    padding-right: 90px !important;

  }

  .mt_lg--90 {

    margin-top: 90px !important;

  }

  .mb_lg--90 {

    margin-bottom: 90px !important;

  }

  .ml_lg--90 {

    margin-left: 90px !important;

  }

  .ptb_lg--95 {

    padding: 95px 0 !important;

  }

  .plr_lg--95 {

    padding: 0 95px !important;

  }

  .pt_lg--95 {

    padding-top: 95px !important;

  }

  .pb_lg--95 {

    padding-bottom: 95px !important;

  }

  .pl_lg--95 {

    padding-left: 95px !important;

  }

  .pr_lg--95 {

    padding-right: 95px !important;

  }

  .mt_lg--95 {

    margin-top: 95px !important;

  }

  .mb_lg--95 {

    margin-bottom: 95px !important;

  }

  .ml_lg--95 {

    margin-left: 95px !important;

  }

  .ptb_lg--100 {

    padding: 100px 0 !important;

  }

  .plr_lg--100 {

    padding: 0 100px !important;

  }

  .pt_lg--100 {

    padding-top: 100px !important;

  }

  .pb_lg--100 {

    padding-bottom: 100px !important;

  }

  .pl_lg--100 {

    padding-left: 100px !important;

  }

  .pr_lg--100 {

    padding-right: 100px !important;

  }

  .mt_lg--100 {

    margin-top: 100px !important;

  }

  .mb_lg--100 {

    margin-bottom: 100px !important;

  }

  .ml_lg--100 {

    margin-left: 100px !important;

  }

}

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

  .ptb_md--0 {

    padding: 0 !important;

  }

  .pl_md--0 {

    padding-left: 0 !important;

  }

  .pr_md--0 {

    padding-right: 0 !important;

  }

  .pt_md--0 {

    padding-top: 0 !important;

  }

  .pb_md--0 {

    padding-bottom: 0 !important;

  }

  .mr_md--0 {

    margin-right: 0 !important;

  }

  .ml_md--0 {

    margin-left: 0 !important;

  }

  .mt_md--0 {

    margin-top: 0 !important;

  }

  .mb_md--0 {

    margin-bottom: 0 !important;

  }

  .ptb_md--250 {

    padding: 250px 0 !important;

  }

  .ptb_md--5 {

    padding: 5px 0 !important;

  }

  .plr_md--5 {

    padding: 0 5px !important;

  }

  .pt_md--5 {

    padding-top: 5px !important;

  }

  .pb_md--5 {

    padding-bottom: 5px !important;

  }

  .pl_md--5 {

    padding-left: 5px !important;

  }

  .pr_md--5 {

    padding-right: 5px !important;

  }

  .mt_md--5 {

    margin-top: 5px !important;

  }

  .mb_md--5 {

    margin-bottom: 5px !important;

  }

  .ptb_md--10 {

    padding: 10px 0 !important;

  }

  .plr_md--10 {

    padding: 0 10px !important;

  }

  .pt_md--10 {

    padding-top: 10px !important;

  }

  .pb_md--10 {

    padding-bottom: 10px !important;

  }

  .pl_md--10 {

    padding-left: 10px !important;

  }

  .pr_md--10 {

    padding-right: 10px !important;

  }

  .mt_md--10 {

    margin-top: 10px !important;

  }

  .mb_md--10 {

    margin-bottom: 10px !important;

  }

  .ptb_md--15 {

    padding: 15px 0 !important;

  }

  .plr_md--15 {

    padding: 0 15px !important;

  }

  .pt_md--15 {

    padding-top: 15px !important;

  }

  .pb_md--15 {

    padding-bottom: 15px !important;

  }

  .pl_md--15 {

    padding-left: 15px !important;

  }

  .pr_md--15 {

    padding-right: 15px !important;

  }

  .mt_md--15 {

    margin-top: 15px !important;

  }

  .mb_md--15 {

    margin-bottom: 15px !important;

  }

  .ptb_md--20 {

    padding: 20px 0 !important;

  }

  .plr_md--20 {

    padding: 0 20px !important;

  }

  .pt_md--20 {

    padding-top: 20px !important;

  }

  .pb_md--20 {

    padding-bottom: 20px !important;

  }

  .pl_md--20 {

    padding-left: 20px !important;

  }

  .pr_md--20 {

    padding-right: 20px !important;

  }

  .mt_md--20 {

    margin-top: 20px !important;

  }

  .mb_md--20 {

    margin-bottom: 20px !important;

  }

  .ptb_md--25 {

    padding: 25px 0 !important;

  }

  .plr_md--25 {

    padding: 0 25px !important;

  }

  .pt_md--25 {

    padding-top: 25px !important;

  }

  .pb_md--25 {

    padding-bottom: 25px !important;

  }

  .pl_md--25 {

    padding-left: 25px !important;

  }

  .pr_md--25 {

    padding-right: 25px !important;

  }

  .mt_md--25 {

    margin-top: 25px !important;

  }

  .mb_md--25 {

    margin-bottom: 25px !important;

  }

  .ptb_md--30 {

    padding: 30px 0 !important;

  }

  .plr_md--30 {

    padding: 0 30px !important;

  }

  .pt_md--30 {

    padding-top: 30px !important;

  }

  .pb_md--30 {

    padding-bottom: 30px !important;

  }

  .pl_md--30 {

    padding-left: 30px !important;

  }

  .pr_md--30 {

    padding-right: 30px !important;

  }

  .mt_md--30 {

    margin-top: 30px !important;

  }

  .mb_md--30 {

    margin-bottom: 30px !important;

  }

  .ptb_md--35 {

    padding: 35px 0 !important;

  }

  .plr_md--35 {

    padding: 0 35px !important;

  }

  .pt_md--35 {

    padding-top: 35px !important;

  }

  .pb_md--35 {

    padding-bottom: 35px !important;

  }

  .pl_md--35 {

    padding-left: 35px !important;

  }

  .pr_md--35 {

    padding-right: 35px !important;

  }

  .mt_md--35 {

    margin-top: 35px !important;

  }

  .mb_md--35 {

    margin-bottom: 35px !important;

  }

  .ptb_md--40 {

    padding: 40px 0 !important;

  }

  .plr_md--40 {

    padding: 0 40px !important;

  }

  .pt_md--40 {

    padding-top: 40px !important;

  }

  .pb_md--40 {

    padding-bottom: 40px !important;

  }

  .pl_md--40 {

    padding-left: 40px !important;

  }

  .pr_md--40 {

    padding-right: 40px !important;

  }

  .mt_md--40 {

    margin-top: 40px !important;

  }

  .mb_md--40 {

    margin-bottom: 40px !important;

  }

  .ptb_md--45 {

    padding: 45px 0 !important;

  }

  .plr_md--45 {

    padding: 0 45px !important;

  }

  .pt_md--45 {

    padding-top: 45px !important;

  }

  .pb_md--45 {

    padding-bottom: 45px !important;

  }

  .pl_md--45 {

    padding-left: 45px !important;

  }

  .pr_md--45 {

    padding-right: 45px !important;

  }

  .mt_md--45 {

    margin-top: 45px !important;

  }

  .mb_md--45 {

    margin-bottom: 45px !important;

  }

  .ptb_md--50 {

    padding: 50px 0 !important;

  }

  .plr_md--50 {

    padding: 0 50px !important;

  }

  .pt_md--50 {

    padding-top: 50px !important;

  }

  .pb_md--50 {

    padding-bottom: 50px !important;

  }

  .pl_md--50 {

    padding-left: 50px !important;

  }

  .pr_md--50 {

    padding-right: 50px !important;

  }

  .mt_md--50 {

    margin-top: 50px !important;

  }

  .mb_md--50 {

    margin-bottom: 50px !important;

  }

  .ptb_md--55 {

    padding: 55px 0 !important;

  }

  .plr_md--55 {

    padding: 0 55px !important;

  }

  .pt_md--55 {

    padding-top: 55px !important;

  }

  .pb_md--55 {

    padding-bottom: 55px !important;

  }

  .pl_md--55 {

    padding-left: 55px !important;

  }

  .pr_md--55 {

    padding-right: 55px !important;

  }

  .mt_md--55 {

    margin-top: 55px !important;

  }

  .mb_md--55 {

    margin-bottom: 55px !important;

  }

  .ptb_md--60 {

    padding: 60px 0 !important;

  }

  .plr_md--60 {

    padding: 0 60px !important;

  }

  .pt_md--60 {

    padding-top: 60px !important;

  }

  .pb_md--60 {

    padding-bottom: 60px !important;

  }

  .pl_md--60 {

    padding-left: 60px !important;

  }

  .pr_md--60 {

    padding-right: 60px !important;

  }

  .mt_md--60 {

    margin-top: 60px !important;

  }

  .mb_md--60 {

    margin-bottom: 60px !important;

  }

  .ptb_md--65 {

    padding: 65px 0 !important;

  }

  .plr_md--65 {

    padding: 0 65px !important;

  }

  .pt_md--65 {

    padding-top: 65px !important;

  }

  .pb_md--65 {

    padding-bottom: 65px !important;

  }

  .pl_md--65 {

    padding-left: 65px !important;

  }

  .pr_md--65 {

    padding-right: 65px !important;

  }

  .mt_md--65 {

    margin-top: 65px !important;

  }

  .mb_md--65 {

    margin-bottom: 65px !important;

  }

  .ptb_md--70 {

    padding: 70px 0 !important;

  }

  .plr_md--70 {

    padding: 0 70px !important;

  }

  .pt_md--70 {

    padding-top: 70px !important;

  }

  .pb_md--70 {

    padding-bottom: 70px !important;

  }

  .pl_md--70 {

    padding-left: 70px !important;

  }

  .pr_md--70 {

    padding-right: 70px !important;

  }

  .mt_md--70 {

    margin-top: 70px !important;

  }

  .mb_md--70 {

    margin-bottom: 70px !important;

  }

  .ptb_md--75 {

    padding: 75px 0 !important;

  }

  .plr_md--75 {

    padding: 0 75px !important;

  }

  .pt_md--75 {

    padding-top: 75px !important;

  }

  .pb_md--75 {

    padding-bottom: 75px !important;

  }

  .pl_md--75 {

    padding-left: 75px !important;

  }

  .pr_md--75 {

    padding-right: 75px !important;

  }

  .mt_md--75 {

    margin-top: 75px !important;

  }

  .mb_md--75 {

    margin-bottom: 75px !important;

  }

  .ptb_md--80 {

    padding: 80px 0 !important;

  }

  .plr_md--80 {

    padding: 0 80px !important;

  }

  .pt_md--80 {

    padding-top: 80px !important;

  }

  .pb_md--80 {

    padding-bottom: 80px !important;

  }

  .pl_md--80 {

    padding-left: 80px !important;

  }

  .pr_md--80 {

    padding-right: 80px !important;

  }

  .mt_md--80 {

    margin-top: 80px !important;

  }

  .mb_md--80 {

    margin-bottom: 80px !important;

  }

  .ptb_md--85 {

    padding: 85px 0 !important;

  }

  .plr_md--85 {

    padding: 0 85px !important;

  }

  .pt_md--85 {

    padding-top: 85px !important;

  }

  .pb_md--85 {

    padding-bottom: 85px !important;

  }

  .pl_md--85 {

    padding-left: 85px !important;

  }

  .pr_md--85 {

    padding-right: 85px !important;

  }

  .mt_md--85 {

    margin-top: 85px !important;

  }

  .mb_md--85 {

    margin-bottom: 85px !important;

  }

  .ptb_md--90 {

    padding: 90px 0 !important;

  }

  .plr_md--90 {

    padding: 0 90px !important;

  }

  .pt_md--90 {

    padding-top: 90px !important;

  }

  .pb_md--90 {

    padding-bottom: 90px !important;

  }

  .pl_md--90 {

    padding-left: 90px !important;

  }

  .pr_md--90 {

    padding-right: 90px !important;

  }

  .mt_md--90 {

    margin-top: 90px !important;

  }

  .mb_md--90 {

    margin-bottom: 90px !important;

  }

  .ptb_md--95 {

    padding: 95px 0 !important;

  }

  .plr_md--95 {

    padding: 0 95px !important;

  }

  .pt_md--95 {

    padding-top: 95px !important;

  }

  .pb_md--95 {

    padding-bottom: 95px !important;

  }

  .pl_md--95 {

    padding-left: 95px !important;

  }

  .pr_md--95 {

    padding-right: 95px !important;

  }

  .mt_md--95 {

    margin-top: 95px !important;

  }

  .mb_md--95 {

    margin-bottom: 95px !important;

  }

  .ptb_md--100 {

    padding: 100px 0 !important;

  }

  .plr_md--100 {

    padding: 0 100px !important;

  }

  .pt_md--100 {

    padding-top: 100px !important;

  }

  .pb_md--100 {

    padding-bottom: 100px !important;

  }

  .pl_md--100 {

    padding-left: 100px !important;

  }

  .pr_md--100 {

    padding-right: 100px !important;

  }

  .mt_md--100 {

    margin-top: 100px !important;

  }

  .mb_md--100 {

    margin-bottom: 100px !important;

  }

}

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

  .ptb_sm--250 {

    padding: 250px 0 !important;

  }

  .ptb_sm--0 {

    padding: 0 !important;

  }

  .pl_sm--0 {

    padding-left: 0 !important;

  }

  .pr_sm--0 {

    padding-right: 0 !important;

  }

  .pt_sm--0 {

    padding-top: 0 !important;

  }

  .pb_sm--0 {

    padding-bottom: 0 !important;

  }

  .mr_sm--0 {

    margin-right: 0 !important;

  }

  .ml_sm--0 {

    margin-left: 0 !important;

  }

  .mt_sm--0 {

    margin-top: 0 !important;

  }

  .mb_sm--0 {

    margin-bottom: 0 !important;

  }

  .pt_sm--150 {

    padding-top: 150px !important;

  }

  .pb_sm--110 {

    padding-bottom: 110px !important;

  }

  .ptb_sm--5 {

    padding: 5px 0 !important;

  }

  .plr_sm--5 {

    padding: 0 5px !important;

  }

  .pt_sm--5 {

    padding-top: 5px !important;

  }

  .pb_sm--5 {

    padding-bottom: 5px !important;

  }

  .pl_sm--5 {

    padding-left: 5px !important;

  }

  .pr_sm--5 {

    padding-right: 5px !important;

  }

  .mt_sm--5 {

    margin-top: 5px !important;

  }

  .ml_sm--5 {

    margin-left: 5px !important;

  }

  .mr_sm--5 {

    margin-right: 5px !important;

  }

  .mb_sm--5 {

    margin-bottom: 5px !important;

  }

  .ptb_sm--10 {

    padding: 10px 0 !important;

  }

  .plr_sm--10 {

    padding: 0 10px !important;

  }

  .pt_sm--10 {

    padding-top: 10px !important;

  }

  .pb_sm--10 {

    padding-bottom: 10px !important;

  }

  .pl_sm--10 {

    padding-left: 10px !important;

  }

  .pr_sm--10 {

    padding-right: 10px !important;

  }

  .mt_sm--10 {

    margin-top: 10px !important;

  }

  .ml_sm--10 {

    margin-left: 10px !important;

  }

  .mr_sm--10 {

    margin-right: 10px !important;

  }

  .mb_sm--10 {

    margin-bottom: 10px !important;

  }

  .ptb_sm--15 {

    padding: 15px 0 !important;

  }

  .plr_sm--15 {

    padding: 0 15px !important;

  }

  .pt_sm--15 {

    padding-top: 15px !important;

  }

  .pb_sm--15 {

    padding-bottom: 15px !important;

  }

  .pl_sm--15 {

    padding-left: 15px !important;

  }

  .pr_sm--15 {

    padding-right: 15px !important;

  }

  .mt_sm--15 {

    margin-top: 15px !important;

  }

  .ml_sm--15 {

    margin-left: 15px !important;

  }

  .mr_sm--15 {

    margin-right: 15px !important;

  }

  .mb_sm--15 {

    margin-bottom: 15px !important;

  }

  .ptb_sm--20 {

    padding: 20px 0 !important;

  }

  .plr_sm--20 {

    padding: 0 20px !important;

  }

  .pt_sm--20 {

    padding-top: 20px !important;

  }

  .pb_sm--20 {

    padding-bottom: 20px !important;

  }

  .pl_sm--20 {

    padding-left: 20px !important;

  }

  .pr_sm--20 {

    padding-right: 20px !important;

  }

  .mt_sm--20 {

    margin-top: 20px !important;

  }

  .ml_sm--20 {

    margin-left: 20px !important;

  }

  .mr_sm--20 {

    margin-right: 20px !important;

  }

  .mb_sm--20 {

    margin-bottom: 20px !important;

  }

  .ptb_sm--25 {

    padding: 25px 0 !important;

  }

  .plr_sm--25 {

    padding: 0 25px !important;

  }

  .pt_sm--25 {

    padding-top: 25px !important;

  }

  .pb_sm--25 {

    padding-bottom: 25px !important;

  }

  .pl_sm--25 {

    padding-left: 25px !important;

  }

  .pr_sm--25 {

    padding-right: 25px !important;

  }

  .mt_sm--25 {

    margin-top: 25px !important;

  }

  .ml_sm--25 {

    margin-left: 25px !important;

  }

  .mr_sm--25 {

    margin-right: 25px !important;

  }

  .mb_sm--25 {

    margin-bottom: 25px !important;

  }

  .ptb_sm--30 {

    padding: 30px 0 !important;

  }

  .plr_sm--30 {

    padding: 0 30px !important;

  }

  .pt_sm--30 {

    padding-top: 30px !important;

  }

  .pb_sm--30 {

    padding-bottom: 30px !important;

  }

  .pl_sm--30 {

    padding-left: 30px !important;

  }

  .pr_sm--30 {

    padding-right: 30px !important;

  }

  .mt_sm--30 {

    margin-top: 30px !important;

  }

  .ml_sm--30 {

    margin-left: 30px !important;

  }

  .mr_sm--30 {

    margin-right: 30px !important;

  }

  .mb_sm--30 {

    margin-bottom: 30px !important;

  }

  .ptb_sm--35 {

    padding: 35px 0 !important;

  }

  .plr_sm--35 {

    padding: 0 35px !important;

  }

  .pt_sm--35 {

    padding-top: 35px !important;

  }

  .pb_sm--35 {

    padding-bottom: 35px !important;

  }

  .pl_sm--35 {

    padding-left: 35px !important;

  }

  .pr_sm--35 {

    padding-right: 35px !important;

  }

  .mt_sm--35 {

    margin-top: 35px !important;

  }

  .ml_sm--35 {

    margin-left: 35px !important;

  }

  .mr_sm--35 {

    margin-right: 35px !important;

  }

  .mb_sm--35 {

    margin-bottom: 35px !important;

  }

  .ptb_sm--40 {

    padding: 40px 0 !important;

  }

  .plr_sm--40 {

    padding: 0 40px !important;

  }

  .pt_sm--40 {

    padding-top: 40px !important;

  }

  .pb_sm--40 {

    padding-bottom: 40px !important;

  }

  .pl_sm--40 {

    padding-left: 40px !important;

  }

  .pr_sm--40 {

    padding-right: 40px !important;

  }

  .mt_sm--40 {

    margin-top: 40px !important;

  }

  .ml_sm--40 {

    margin-left: 40px !important;

  }

  .mr_sm--40 {

    margin-right: 40px !important;

  }

  .mb_sm--40 {

    margin-bottom: 40px !important;

  }

  .ptb_sm--45 {

    padding: 45px 0 !important;

  }

  .plr_sm--45 {

    padding: 0 45px !important;

  }

  .pt_sm--45 {

    padding-top: 45px !important;

  }

  .pb_sm--45 {

    padding-bottom: 45px !important;

  }

  .pl_sm--45 {

    padding-left: 45px !important;

  }

  .pr_sm--45 {

    padding-right: 45px !important;

  }

  .mt_sm--45 {

    margin-top: 45px !important;

  }

  .ml_sm--45 {

    margin-left: 45px !important;

  }

  .mr_sm--45 {

    margin-right: 45px !important;

  }

  .mb_sm--45 {

    margin-bottom: 45px !important;

  }

  .ptb_sm--50 {

    padding: 50px 0 !important;

  }

  .plr_sm--50 {

    padding: 0 50px !important;

  }

  .pt_sm--50 {

    padding-top: 50px !important;

  }

  .pb_sm--50 {

    padding-bottom: 50px !important;

  }

  .pl_sm--50 {

    padding-left: 50px !important;

  }

  .pr_sm--50 {

    padding-right: 50px !important;

  }

  .mt_sm--50 {

    margin-top: 50px !important;

  }

  .ml_sm--50 {

    margin-left: 50px !important;

  }

  .mr_sm--50 {

    margin-right: 50px !important;

  }

  .mb_sm--50 {

    margin-bottom: 50px !important;

  }

  .ptb_sm--55 {

    padding: 55px 0 !important;

  }

  .plr_sm--55 {

    padding: 0 55px !important;

  }

  .pt_sm--55 {

    padding-top: 55px !important;

  }

  .pb_sm--55 {

    padding-bottom: 55px !important;

  }

  .pl_sm--55 {

    padding-left: 55px !important;

  }

  .pr_sm--55 {

    padding-right: 55px !important;

  }

  .mt_sm--55 {

    margin-top: 55px !important;

  }

  .ml_sm--55 {

    margin-left: 55px !important;

  }

  .mr_sm--55 {

    margin-right: 55px !important;

  }

  .mb_sm--55 {

    margin-bottom: 55px !important;

  }

  .ptb_sm--60 {

    padding: 60px 0 !important;

  }

  .plr_sm--60 {

    padding: 0 60px !important;

  }

  .pt_sm--60 {

    padding-top: 60px !important;

  }

  .pb_sm--60 {

    padding-bottom: 60px !important;

  }

  .pl_sm--60 {

    padding-left: 60px !important;

  }

  .pr_sm--60 {

    padding-right: 60px !important;

  }

  .mt_sm--60 {

    margin-top: 60px !important;

  }

  .ml_sm--60 {

    margin-left: 60px !important;

  }

  .mr_sm--60 {

    margin-right: 60px !important;

  }

  .mb_sm--60 {

    margin-bottom: 60px !important;

  }

  .ptb_sm--65 {

    padding: 65px 0 !important;

  }

  .plr_sm--65 {

    padding: 0 65px !important;

  }

  .pt_sm--65 {

    padding-top: 65px !important;

  }

  .pb_sm--65 {

    padding-bottom: 65px !important;

  }

  .pl_sm--65 {

    padding-left: 65px !important;

  }

  .pr_sm--65 {

    padding-right: 65px !important;

  }

  .mt_sm--65 {

    margin-top: 65px !important;

  }

  .ml_sm--65 {

    margin-left: 65px !important;

  }

  .mr_sm--65 {

    margin-right: 65px !important;

  }

  .mb_sm--65 {

    margin-bottom: 65px !important;

  }

  .ptb_sm--70 {

    padding: 70px 0 !important;

  }

  .plr_sm--70 {

    padding: 0 70px !important;

  }

  .pt_sm--70 {

    padding-top: 70px !important;

  }

  .pb_sm--70 {

    padding-bottom: 70px !important;

  }

  .pl_sm--70 {

    padding-left: 70px !important;

  }

  .pr_sm--70 {

    padding-right: 70px !important;

  }

  .mt_sm--70 {

    margin-top: 70px !important;

  }

  .ml_sm--70 {

    margin-left: 70px !important;

  }

  .mr_sm--70 {

    margin-right: 70px !important;

  }

  .mb_sm--70 {

    margin-bottom: 70px !important;

  }

  .ptb_sm--75 {

    padding: 75px 0 !important;

  }

  .plr_sm--75 {

    padding: 0 75px !important;

  }

  .pt_sm--75 {

    padding-top: 75px !important;

  }

  .pb_sm--75 {

    padding-bottom: 75px !important;

  }

  .pl_sm--75 {

    padding-left: 75px !important;

  }

  .pr_sm--75 {

    padding-right: 75px !important;

  }

  .mt_sm--75 {

    margin-top: 75px !important;

  }

  .ml_sm--75 {

    margin-left: 75px !important;

  }

  .mr_sm--75 {

    margin-right: 75px !important;

  }

  .mb_sm--75 {

    margin-bottom: 75px !important;

  }

  .ptb_sm--80 {

    padding: 80px 0 !important;

  }

  .plr_sm--80 {

    padding: 0 80px !important;

  }

  .pt_sm--80 {

    padding-top: 80px !important;

  }

  .pb_sm--80 {

    padding-bottom: 80px !important;

  }

  .pl_sm--80 {

    padding-left: 80px !important;

  }

  .pr_sm--80 {

    padding-right: 80px !important;

  }

  .mt_sm--80 {

    margin-top: 80px !important;

  }

  .ml_sm--80 {

    margin-left: 80px !important;

  }

  .mr_sm--80 {

    margin-right: 80px !important;

  }

  .mb_sm--80 {

    margin-bottom: 80px !important;

  }

  .ptb_sm--85 {

    padding: 85px 0 !important;

  }

  .plr_sm--85 {

    padding: 0 85px !important;

  }

  .pt_sm--85 {

    padding-top: 85px !important;

  }

  .pb_sm--85 {

    padding-bottom: 85px !important;

  }

  .pl_sm--85 {

    padding-left: 85px !important;

  }

  .pr_sm--85 {

    padding-right: 85px !important;

  }

  .mt_sm--85 {

    margin-top: 85px !important;

  }

  .ml_sm--85 {

    margin-left: 85px !important;

  }

  .mr_sm--85 {

    margin-right: 85px !important;

  }

  .mb_sm--85 {

    margin-bottom: 85px !important;

  }

  .ptb_sm--90 {

    padding: 90px 0 !important;

  }

  .plr_sm--90 {

    padding: 0 90px !important;

  }

  .pt_sm--90 {

    padding-top: 90px !important;

  }

  .pb_sm--90 {

    padding-bottom: 90px !important;

  }

  .pl_sm--90 {

    padding-left: 90px !important;

  }

  .pr_sm--90 {

    padding-right: 90px !important;

  }

  .mt_sm--90 {

    margin-top: 90px !important;

  }

  .ml_sm--90 {

    margin-left: 90px !important;

  }

  .mr_sm--90 {

    margin-right: 90px !important;

  }

  .mb_sm--90 {

    margin-bottom: 90px !important;

  }

  .ptb_sm--95 {

    padding: 95px 0 !important;

  }

  .plr_sm--95 {

    padding: 0 95px !important;

  }

  .pt_sm--95 {

    padding-top: 95px !important;

  }

  .pb_sm--95 {

    padding-bottom: 95px !important;

  }

  .pl_sm--95 {

    padding-left: 95px !important;

  }

  .pr_sm--95 {

    padding-right: 95px !important;

  }

  .mt_sm--95 {

    margin-top: 95px !important;

  }

  .ml_sm--95 {

    margin-left: 95px !important;

  }

  .mr_sm--95 {

    margin-right: 95px !important;

  }

  .mb_sm--95 {

    margin-bottom: 95px !important;

  }

  .ptb_sm--100 {

    padding: 100px 0 !important;

  }

  .plr_sm--100 {

    padding: 0 100px !important;

  }

  .pt_sm--100 {

    padding-top: 100px !important;

  }

  .pb_sm--100 {

    padding-bottom: 100px !important;

  }

  .pl_sm--100 {

    padding-left: 100px !important;

  }

  .pr_sm--100 {

    padding-right: 100px !important;

  }

  .mt_sm--100 {

    margin-top: 100px !important;

  }

  .ml_sm--100 {

    margin-left: 100px !important;

  }

  .mr_sm--100 {

    margin-right: 100px !important;

  }

  .mb_sm--100 {

    margin-bottom: 100px !important;

  }

  .pl_sm--0 {

    padding-left: 0;

  }

  .pr_sm--0 {

    padding-right: 0;

  }

  .pt_sm--0 {

    padding-top: 0;

  }

  .pb_sm--0 {

    padding-bottom: 0;

  }

  .mr_sm--0 {

    margin-right: 0;

  }

  .ml_sm--0 {

    margin-left: 0;

  }

  .mt_sm--0 {

    margin-top: 0;

  }

  .mb_sm--0 {

    margin-bottom: 0;

  }

}

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

  .ptb_mobile--5 {

    padding: 5px 0 !important;

  }

  .plr_mobile--5 {

    padding: 0 5px !important;

  }

  .pt_mobile--5 {

    padding-top: 5px !important;

  }

  .pb_mobile--5 {

    padding-bottom: 5px !important;

  }

  .pl_mobile--5 {

    padding-left: 5px !important;

  }

  .pr_mobile--5 {

    padding-right: 5px !important;

  }

  .mt_mobile--5 {

    margin-top: 5px !important;

  }

  .mb_mobile--5 {

    margin-bottom: 5px !important;

  }

  .ptb_mobile--10 {

    padding: 10px 0 !important;

  }

  .plr_mobile--10 {

    padding: 0 10px !important;

  }

  .pt_mobile--10 {

    padding-top: 10px !important;

  }

  .pb_mobile--10 {

    padding-bottom: 10px !important;

  }

  .pl_mobile--10 {

    padding-left: 10px !important;

  }

  .pr_mobile--10 {

    padding-right: 10px !important;

  }

  .mt_mobile--10 {

    margin-top: 10px !important;

  }

  .mb_mobile--10 {

    margin-bottom: 10px !important;

  }

  .ptb_mobile--15 {

    padding: 15px 0 !important;

  }

  .plr_mobile--15 {

    padding: 0 15px !important;

  }

  .pt_mobile--15 {

    padding-top: 15px !important;

  }

  .pb_mobile--15 {

    padding-bottom: 15px !important;

  }

  .pl_mobile--15 {

    padding-left: 15px !important;

  }

  .pr_mobile--15 {

    padding-right: 15px !important;

  }

  .mt_mobile--15 {

    margin-top: 15px !important;

  }

  .mb_mobile--15 {

    margin-bottom: 15px !important;

  }

  .ptb_mobile--20 {

    padding: 20px 0 !important;

  }

  .plr_mobile--20 {

    padding: 0 20px !important;

  }

  .pt_mobile--20 {

    padding-top: 20px !important;

  }

  .pb_mobile--20 {

    padding-bottom: 20px !important;

  }

  .pl_mobile--20 {

    padding-left: 20px !important;

  }

  .pr_mobile--20 {

    padding-right: 20px !important;

  }

  .mt_mobile--20 {

    margin-top: 20px !important;

  }

  .mb_mobile--20 {

    margin-bottom: 20px !important;

  }

  .ptb_mobile--25 {

    padding: 25px 0 !important;

  }

  .plr_mobile--25 {

    padding: 0 25px !important;

  }

  .pt_mobile--25 {

    padding-top: 25px !important;

  }

  .pb_mobile--25 {

    padding-bottom: 25px !important;

  }

  .pl_mobile--25 {

    padding-left: 25px !important;

  }

  .pr_mobile--25 {

    padding-right: 25px !important;

  }

  .mt_mobile--25 {

    margin-top: 25px !important;

  }

  .mb_mobile--25 {

    margin-bottom: 25px !important;

  }

  .ptb_mobile--30 {

    padding: 30px 0 !important;

  }

  .plr_mobile--30 {

    padding: 0 30px !important;

  }

  .pt_mobile--30 {

    padding-top: 30px !important;

  }

  .pb_mobile--30 {

    padding-bottom: 30px !important;

  }

  .pl_mobile--30 {

    padding-left: 30px !important;

  }

  .pr_mobile--30 {

    padding-right: 30px !important;

  }

  .mt_mobile--30 {

    margin-top: 30px !important;

  }

  .mb_mobile--30 {

    margin-bottom: 30px !important;

  }

  .ptb_mobile--35 {

    padding: 35px 0 !important;

  }

  .plr_mobile--35 {

    padding: 0 35px !important;

  }

  .pt_mobile--35 {

    padding-top: 35px !important;

  }

  .pb_mobile--35 {

    padding-bottom: 35px !important;

  }

  .pl_mobile--35 {

    padding-left: 35px !important;

  }

  .pr_mobile--35 {

    padding-right: 35px !important;

  }

  .mt_mobile--35 {

    margin-top: 35px !important;

  }

  .mb_mobile--35 {

    margin-bottom: 35px !important;

  }

  .ptb_mobile--40 {

    padding: 40px 0 !important;

  }

  .plr_mobile--40 {

    padding: 0 40px !important;

  }

  .pt_mobile--40 {

    padding-top: 40px !important;

  }

  .pb_mobile--40 {

    padding-bottom: 40px !important;

  }

  .pl_mobile--40 {

    padding-left: 40px !important;

  }

  .pr_mobile--40 {

    padding-right: 40px !important;

  }

  .mt_mobile--40 {

    margin-top: 40px !important;

  }

  .mb_mobile--40 {

    margin-bottom: 40px !important;

  }

  .ptb_mobile--45 {

    padding: 45px 0 !important;

  }

  .plr_mobile--45 {

    padding: 0 45px !important;

  }

  .pt_mobile--45 {

    padding-top: 45px !important;

  }

  .pb_mobile--45 {

    padding-bottom: 45px !important;

  }

  .pl_mobile--45 {

    padding-left: 45px !important;

  }

  .pr_mobile--45 {

    padding-right: 45px !important;

  }

  .mt_mobile--45 {

    margin-top: 45px !important;

  }

  .mb_mobile--45 {

    margin-bottom: 45px !important;

  }

  .ptb_mobile--50 {

    padding: 50px 0 !important;

  }

  .plr_mobile--50 {

    padding: 0 50px !important;

  }

  .pt_mobile--50 {

    padding-top: 50px !important;

  }

  .pb_mobile--50 {

    padding-bottom: 50px !important;

  }

  .pl_mobile--50 {

    padding-left: 50px !important;

  }

  .pr_mobile--50 {

    padding-right: 50px !important;

  }

  .mt_mobile--50 {

    margin-top: 50px !important;

  }

  .mb_mobile--50 {

    margin-bottom: 50px !important;

  }

  .ptb_mobile--55 {

    padding: 55px 0 !important;

  }

  .plr_mobile--55 {

    padding: 0 55px !important;

  }

  .pt_mobile--55 {

    padding-top: 55px !important;

  }

  .pb_mobile--55 {

    padding-bottom: 55px !important;

  }

  .pl_mobile--55 {

    padding-left: 55px !important;

  }

  .pr_mobile--55 {

    padding-right: 55px !important;

  }

  .mt_mobile--55 {

    margin-top: 55px !important;

  }

  .mb_mobile--55 {

    margin-bottom: 55px !important;

  }

  .ptb_mobile--60 {

    padding: 60px 0 !important;

  }

  .plr_mobile--60 {

    padding: 0 60px !important;

  }

  .pt_mobile--60 {

    padding-top: 60px !important;

  }

  .pb_mobile--60 {

    padding-bottom: 60px !important;

  }

  .pl_mobile--60 {

    padding-left: 60px !important;

  }

  .pr_mobile--60 {

    padding-right: 60px !important;

  }

  .mt_mobile--60 {

    margin-top: 60px !important;

  }

  .mb_mobile--60 {

    margin-bottom: 60px !important;

  }

  .ptb_mobile--65 {

    padding: 65px 0 !important;

  }

  .plr_mobile--65 {

    padding: 0 65px !important;

  }

  .pt_mobile--65 {

    padding-top: 65px !important;

  }

  .pb_mobile--65 {

    padding-bottom: 65px !important;

  }

  .pl_mobile--65 {

    padding-left: 65px !important;

  }

  .pr_mobile--65 {

    padding-right: 65px !important;

  }

  .mt_mobile--65 {

    margin-top: 65px !important;

  }

  .mb_mobile--65 {

    margin-bottom: 65px !important;

  }

  .ptb_mobile--70 {

    padding: 70px 0 !important;

  }

  .plr_mobile--70 {

    padding: 0 70px !important;

  }

  .pt_mobile--70 {

    padding-top: 70px !important;

  }

  .pb_mobile--70 {

    padding-bottom: 70px !important;

  }

  .pl_mobile--70 {

    padding-left: 70px !important;

  }

  .pr_mobile--70 {

    padding-right: 70px !important;

  }

  .mt_mobile--70 {

    margin-top: 70px !important;

  }

  .mb_mobile--70 {

    margin-bottom: 70px !important;

  }

  .ptb_mobile--75 {

    padding: 75px 0 !important;

  }

  .plr_mobile--75 {

    padding: 0 75px !important;

  }

  .pt_mobile--75 {

    padding-top: 75px !important;

  }

  .pb_mobile--75 {

    padding-bottom: 75px !important;

  }

  .pl_mobile--75 {

    padding-left: 75px !important;

  }

  .pr_mobile--75 {

    padding-right: 75px !important;

  }

  .mt_mobile--75 {

    margin-top: 75px !important;

  }

  .mb_mobile--75 {

    margin-bottom: 75px !important;

  }

  .ptb_mobile--80 {

    padding: 80px 0 !important;

  }

  .plr_mobile--80 {

    padding: 0 80px !important;

  }

  .pt_mobile--80 {

    padding-top: 80px !important;

  }

  .pb_mobile--80 {

    padding-bottom: 80px !important;

  }

  .pl_mobile--80 {

    padding-left: 80px !important;

  }

  .pr_mobile--80 {

    padding-right: 80px !important;

  }

  .mt_mobile--80 {

    margin-top: 80px !important;

  }

  .mb_mobile--80 {

    margin-bottom: 80px !important;

  }

  .ptb_mobile--85 {

    padding: 85px 0 !important;

  }

  .plr_mobile--85 {

    padding: 0 85px !important;

  }

  .pt_mobile--85 {

    padding-top: 85px !important;

  }

  .pb_mobile--85 {

    padding-bottom: 85px !important;

  }

  .pl_mobile--85 {

    padding-left: 85px !important;

  }

  .pr_mobile--85 {

    padding-right: 85px !important;

  }

  .mt_mobile--85 {

    margin-top: 85px !important;

  }

  .mb_mobile--85 {

    margin-bottom: 85px !important;

  }

  .ptb_mobile--90 {

    padding: 90px 0 !important;

  }

  .plr_mobile--90 {

    padding: 0 90px !important;

  }

  .pt_mobile--90 {

    padding-top: 90px !important;

  }

  .pb_mobile--90 {

    padding-bottom: 90px !important;

  }

  .pl_mobile--90 {

    padding-left: 90px !important;

  }

  .pr_mobile--90 {

    padding-right: 90px !important;

  }

  .mt_mobile--90 {

    margin-top: 90px !important;

  }

  .mb_mobile--90 {

    margin-bottom: 90px !important;

  }

  .ptb_mobile--95 {

    padding: 95px 0 !important;

  }

  .plr_mobile--95 {

    padding: 0 95px !important;

  }

  .pt_mobile--95 {

    padding-top: 95px !important;

  }

  .pb_mobile--95 {

    padding-bottom: 95px !important;

  }

  .pl_mobile--95 {

    padding-left: 95px !important;

  }

  .pr_mobile--95 {

    padding-right: 95px !important;

  }

  .mt_mobile--95 {

    margin-top: 95px !important;

  }

  .mb_mobile--95 {

    margin-bottom: 95px !important;

  }

  .ptb_mobile--100 {

    padding: 100px 0 !important;

  }

  .plr_mobile--100 {

    padding: 0 100px !important;

  }

  .pt_mobile--100 {

    padding-top: 100px !important;

  }

  .pb_mobile--100 {

    padding-bottom: 100px !important;

  }

  .pl_mobile--100 {

    padding-left: 100px !important;

  }

  .pr_mobile--100 {

    padding-right: 100px !important;

  }

  .mt_mobile--100 {

    margin-top: 100px !important;

  }

  .mb_mobile--100 {

    margin-bottom: 100px !important;

  }

}

.slick-gutter-5 {

  margin-left: -5px;

  margin-right: -5px;

}

.slick-gutter-5 .slick-slide {

  padding-left: 5px;

  padding-right: 5px;

}



.slick-gutter-10 {

  margin-left: -10px;

  margin-right: -10px;

}

.slick-gutter-10 .slick-slide {

  padding-left: 10px;

  padding-right: 10px;

}



.slick-gutter-15 {

  margin-left: -15px;

  margin-right: -15px;

}

.slick-gutter-15 .slick-slide {

  padding-left: 15px;

  padding-right: 15px;

}



.slick-gutter-20 {

  margin-left: -20px;

  margin-right: -20px;

}

.slick-gutter-20 .slick-slide {

  padding-left: 20px;

  padding-right: 20px;

}



.slick-gutter-25 {

  margin-left: -25px;

  margin-right: -25px;

}

.slick-gutter-25 .slick-slide {

  padding-left: 25px;

  padding-right: 25px;

}



.slick-gutter-30 {

  margin-left: -30px;

  margin-right: -30px;

}

.slick-gutter-30 .slick-slide {

  padding-left: 30px;

  padding-right: 30px;

}



.slick-gutter-35 {

  margin-left: -35px;

  margin-right: -35px;

}

.slick-gutter-35 .slick-slide {

  padding-left: 35px;

  padding-right: 35px;

}



.slick-gutter-40 {

  margin-left: -40px;

  margin-right: -40px;

}

.slick-gutter-40 .slick-slide {

  padding-left: 40px;

  padding-right: 40px;

}



.slick-gutter-45 {

  margin-left: -45px;

  margin-right: -45px;

}

.slick-gutter-45 .slick-slide {

  padding-left: 45px;

  padding-right: 45px;

}



.slick-gutter-50 {

  margin-left: -50px;

  margin-right: -50px;

}

.slick-gutter-50 .slick-slide {

  padding-left: 50px;

  padding-right: 50px;

}



.slick-gutter-55 {

  margin-left: -55px;

  margin-right: -55px;

}

.slick-gutter-55 .slick-slide {

  padding-left: 55px;

  padding-right: 55px;

}



.slick-gutter-60 {

  margin-left: -60px;

  margin-right: -60px;

}

.slick-gutter-60 .slick-slide {

  padding-left: 60px;

  padding-right: 60px;

}



.slick-gutter-65 {

  margin-left: -65px;

  margin-right: -65px;

}

.slick-gutter-65 .slick-slide {

  padding-left: 65px;

  padding-right: 65px;

}



.slick-gutter-70 {

  margin-left: -70px;

  margin-right: -70px;

}

.slick-gutter-70 .slick-slide {

  padding-left: 70px;

  padding-right: 70px;

}



.slick-gutter-75 {

  margin-left: -75px;

  margin-right: -75px;

}

.slick-gutter-75 .slick-slide {

  padding-left: 75px;

  padding-right: 75px;

}



.slick-gutter-80 {

  margin-left: -80px;

  margin-right: -80px;

}

.slick-gutter-80 .slick-slide {

  padding-left: 80px;

  padding-right: 80px;

}



.slick-gutter-85 {

  margin-left: -85px;

  margin-right: -85px;

}

.slick-gutter-85 .slick-slide {

  padding-left: 85px;

  padding-right: 85px;

}



.slick-gutter-90 {

  margin-left: -90px;

  margin-right: -90px;

}

.slick-gutter-90 .slick-slide {

  padding-left: 90px;

  padding-right: 90px;

}



.slick-gutter-95 {

  margin-left: -95px;

  margin-right: -95px;

}

.slick-gutter-95 .slick-slide {

  padding-left: 95px;

  padding-right: 95px;

}



.slick-gutter-100 {

  margin-left: -100px;

  margin-right: -100px;

}

.slick-gutter-100 .slick-slide {

  padding-left: 100px;

  padding-right: 100px;

}



.mt-dec-30 {

  margin-top: -30px !important;

}



.mt_dec--30 {

  margin-top: -30px !important;

}



.mt-dec-100 {

  margin-top: -100px !important;

}



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

  .small-margin-pricing {

    margin-bottom: 25px !important;

  }

}



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

  .contact-input {

    margin-bottom: 35px;

  }

}



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

  .mb_dec--35 {

    margin-bottom: -50px;

  }

}



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

  .mb_dec--35 {

    margin-bottom: -75px;

  }

}

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

  .mb_dec--35 {

    margin-bottom: 0;

  }

}



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

  .mt-contact-sm {

    margin-top: 30px !important;

  }

}



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

  .testimonial-pb {

    padding-bottom: 35px;

  }

}



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

  .contact-input {

    padding-bottom: 30px;

  }

}

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

  .contact-input {

    padding-bottom: 30px;

  }

}



.pb_xl--130 {

  padding-bottom: 130px;

}

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

  .pb_xl--130 {

    padding-bottom: 110px;

  }

}



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

  .mt_experience {

    margin-top: -10px;

  }

}



.mt_dec--120 {

  margin-top: -120px;

}



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

  .plr_md--0 {

    padding-left: 0 !important;

    padding-right: 0 !important;

  }

}



.padding-contorler-am-slide {

  padding-left: 246px;

}

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

  .padding-contorler-am-slide {

    padding-left: 100px;

  }

}

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

  .padding-contorler-am-slide {

    padding-left: 100px;

  }

}

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

  .padding-contorler-am-slide {

    padding-left: 50px;

  }

}

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

  .padding-contorler-am-slide {

    padding-left: 15px;

  }

}



.padding-contorler-am-slide-11 {

  padding-left: 246px;

}

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

  .padding-contorler-am-slide-11 {

    padding-left: 100px;

  }

}

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

  .padding-contorler-am-slide-11 {

    padding-left: 0;

  }

}



.padding-contorler-am-slide-right {

  padding-right: 200px;

}

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

  .padding-contorler-am-slide-right {

    padding-right: 30px;

  }

}

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

  .padding-contorler-am-slide-right {

    padding-right: 30px;

    padding-top: 50px;

  }

}

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

  .padding-contorler-am-slide-right {

    padding-right: 30px;

    padding-top: 50px;

  }

}



/* ========= 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: 12px;

  line-height: 17px;

  color: var(--color-body);

  font-weight: 400;

  padding-left: 25px;

  cursor: pointer;

}

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

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

  content: " ";

  position: absolute;

  top: 1px;

  left: 0;

  width: 15px;

  height: 15px;

  background-color: transparent;

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

  border-radius: 2px;

  transition: all 0.3s;

  border-radius: 2px;

}

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

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

  content: " ";

  position: absolute;

  top: 16%;

  left: 2px;

  width: 10px;

  height: 6px;

  background-color: transparent;

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

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

  border-radius: 2px;

  transform: rotate(-45deg);

  opacity: 0;

  transition: all 0.3s;

}

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: 5px;

  height: 60px;

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

  transition: var(--transition);

  padding: 0 20px;

  background-color: #EFF0F6;

  transition: var(--transition);

}

.form-group input:focus {

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

  box-shadow: none;

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

}

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

}

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-heading);

  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

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

/* 

font-family: 'Red Hat Display', sans-serif;

*/

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

}



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

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

    padding-right: 15px;

    padding-left: 15px;

  }

}

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

    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--1 {

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

}



.bg_image--2 {

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

}



.bg_image--3 {

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

}



.bg_image--4 {

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

}



.bg_image--5 {

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

}



.bg_image--6 {

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

}



.bg_image--7 {

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

}



.bg_image--8 {

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

}



.bg_image--9 {

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

}



.bg_image--10 {

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

}



.bg_image--11 {

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

}



.bg_image--12 {

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

}



.bg_image--13 {

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

}



.bg_image--14 {

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

}



.bg_image--15 {

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

}



.bg_image--16 {

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

}



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

}



/* 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);

}



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

    Contact Form 

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

.form-message {

  margin-bottom: 0;

  text-align: center;

}

.form-message.error {

  margin-top: 20px;

  color: #f80707;

}

.form-message.success {

  margin-top: 20px;

  color: #0d8d2d;

}



.bg-color-primary {

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

}



.bg-color-secondary {

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

}



.bg-color-white {

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

}



.border-secondary {

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

}



.transform-rotate-318 {

  transform: rotate(318deg);

}



.radius-circle {

  border-radius: 50%;

}



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

    Header Sticky 

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

@media (prefers-reduced-motion: no-preference) {

  :root {

    scroll-behavior: auto;

  }

}

.background--1 {

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

}



.background--2 {

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

}



.background--3 {

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

}



.bg-color--4 {

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

}



textarea:focus {

  border-radius: 5px;

  box-shadow: none !important;

}



.attachment {

  background-attachment: fixed;

}



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

  .row-reverce-sm {

    flex-direction: column-reverse;

  }

}



a.over-link {

  position: absolute;

  height: 100%;

  width: 100%;

  top: 0;

  left: 0;

}



.tooltip {

  position: relative;

  display: inline-block;

}



.tooltip .tooltiptext {

  visibility: hidden;

  width: 140px;

  background-color: #555;

  color: #fff;

  text-align: center;

  border-radius: 6px;

  padding: 5px;

  position: absolute;

  z-index: 1;

  bottom: 150%;

  left: 50%;

  margin-left: -75px;

  opacity: 0;

  transition: opacity 0.3s;

}



.tooltip .tooltiptext::after {

  content: "";

  position: absolute;

  top: 100%;

  left: 50%;

  margin-left: -5px;

  border-width: 5px;

  border-style: solid;

  border-color: #555 transparent transparent transparent;

}



.tooltip:hover .tooltiptext {

  visibility: visible;

  opacity: 1;

}



.btn.rounded {

  border-radius: 33px !important;

}



.social-share-style-1 ul {

  margin: 0;

  padding: 0;

  list-style: none;

}

.social-share-style-1 ul li {

  margin-right: 10px;

}

.social-share-style-1 ul li a {

  padding: 15px;

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

}



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

  .col-5 {

    -webkit-box-flex: 0;

    -webkit-flex: 0 0 auto;

    -ms-flex: 0 0 auto;

    flex: 0 0 auto;

    width: 20%;

  }

}



.btn.add-community {

  padding: 20px 13px;

  border-radius: 6px;

  align-items: center;

  display: flex;

  justify-content: center;

}

.btn.add-community i {

  margin-left: 10px;

}



p {

  color: var(--color-body);

}



a {

  transition: var(--transition);

}

a:hover {

  color: var(--color-primary);

}



.bg-color--3 {

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

}



.bg-color--2 {

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

}



.bg-color--1 {

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

}



.g-6,

.gx-6 {

  --bs-gutter-x: 6rem;

}



.color-body {

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

}



.color-white {

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

}



.nice-select {

  margin-right: 0;

  border: none;

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

  padding-left: 10px;

}

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

  .nice-select {

    margin-bottom: 0;

  }

}

.nice-select .option {

  margin: 0;

  color: var(--color-heading);

  font-weight: 700;

  transition: var(--transition);

  line-height: inherit;

  min-height: 0;

  font-size: 22px;

  padding: 8px 20px;

}

.nice-select .option.selected {

  font-weight: 700;

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

}

.nice-select .option.focus {

  background: transparent !important;

  outline: none;

  box-shadow: none;

}

.nice-select .option:hover {

  color: var(--color-primary);

  background: transparent;

}

.nice-select .option + .option {

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

}

.nice-select.open .list {

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

}

.nice-select .current {

  color: var(--color-heading);

}

.nice-select::after {

  border-bottom: 2px solid #fff;

  border-right: 2px solid #fff;

  margin-top: -5px;

}

.nice-select .list {

  background: transparent;

  box-shadow: none;

  min-width: 200px;

  z-index: 9;

}



.nice-selector-wrapper .nice-select:last-child {

  margin-right: 0;

}



.color-primary {

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

}



.color-red {

  color: red !important;

}



.color-blue {

  color: blue !important;

}



.color-green {

  color: green !important;

}



.color-yellow {

  color: yellow !important;

}



.color-pink {

  color: pink !important;

}



.color-purple {

  color: purple !important;

}



.color-maroon {

  color: maroon !important;

}



nav.pagination-wrapper {

  display: flex;

  justify-content: center;

}

nav.pagination-wrapper .pagination {

  margin-top: 60px;

  margin-bottom: 0;

  transition: var(--transition);

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

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

  border-radius: 6px;

}

nav.pagination-wrapper .pagination li {

  margin: 0;

}

nav.pagination-wrapper .pagination li a {

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

  border: none;

  color: var(--color-heading);

  padding: 12px 20px;

  margin: 6px;

  border-radius: 6px !important;

}

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

  nav.pagination-wrapper .pagination li a {

    padding: 12px 14px;

  }

}

nav.pagination-wrapper .pagination li a:hover, nav.pagination-wrapper .pagination li a.active {

  background: var(--color-primary);

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

}

nav.pagination-wrapper .pagination li a:focus {

  background: var(--color-primary);

  border: none;

  box-shadow: none;

}



.grid-metro-item-20 {

  width: 25%;

  padding: 0 15px;

  margin-top: 30px;

}



.grid-metro5 {

  margin: 0 -15px;

}



.up-plus {

  position: relative;

}

.up-plus::after {

  position: absolute;

  content: "\e9b1";

  font-family: "feather" !important;

  top: -9px;

  color: var(--color-primary);

}



.shortby-default {

  display: flex;

  align-items: center;

  justify-content: flex-end;

}

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

  .shortby-default {

    justify-content: flex-start;

  }

}

.shortby-default .filter-leble {

  padding-right: 20px;

  display: inline-block;

}

.shortby-default .nice-select {

  width: auto;

  padding-left: 20px;

  padding-right: 40px;

  min-width: 150px;

  display: flex;

  align-items: center;

}

.shortby-default .nice-select::after {

  right: 22px;

  height: 8px;

  width: 8px;

  opacity: 0.5;

}

.shortby-default .nice-select .list {

  min-width: 100%;

  max-height: 300px;

  overflow-y: auto;

}

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

  .shortby-default .nice-select .list {

    left: auto;

    right: 0;

  }

}

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

  .shortby-default .nice-select .list {

    left: auto;

    right: 0;

  }

}

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

  .shortby-default .nice-select .list {

    left: auto;

    right: 0;

  }

}



.theme-color {

  color: var(--color-primary);

}



ul {

  padding: 0;

  margin: 0;

}

ul li {

  list-style: none;

}



p.description {

  font-size: 16px;

  line-height: 28px;

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

}



.tmp-link-animation a {

  position: relative;

  display: inline-block;

}

.tmp-link-animation a::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;

}

.tmp-link-animation a:hover::after {

  transform-origin: bottom left;

  transform: scaleX(1);

}



.tmp-hover-link .link {

  position: relative;

  display: inline;

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

  background-image: -webkit-linear-gradient(left, currentColor 0%, currentColor 100%);

  background-image: -o-linear-gradient(left, currentColor 0%, currentColor 100%);

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

  background-size: 0px 2px;

  background-position: 0px 95%;

  -webkit-transition: background-size 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;

  -o-transition: background-size 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;

  transition: background-size 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;

  padding: 0.1% 0px;

  background-repeat: no-repeat;

  transition: 0.3s;

}

.tmp-hover-link:hover .link {

  background-size: 100% 2px;

  color: inherit;

}



.image-box-hover img {

  transition: var(--transition);

}

.image-box-hover:hover img {

  transform: scale(1.03);

}



.tmp-round-action-btn {

  width: 40px;

  height: 40px;

  line-height: 41px;

  text-align: center;

  border-radius: 100%;

  position: relative;

  z-index: 1;

  background: transparent;

  padding: 0;

  border: 0 none;

  display: block;

  color: #ffffff;

  font-size: 18px;

}

.tmp-round-action-btn::after {

  background: var(--color-primary);

  position: absolute;

  content: "";

  width: 100%;

  height: 100%;

  left: 0;

  top: 0;

  transition: 0.4s;

  opacity: 0;

  transform: scale(0.8);

  border-radius: 100%;

  z-index: -1;

}

.tmp-round-action-btn:hover::after {

  opacity: 1;

  transform: scale(1);

}



.container-fluid-13 {

  max-width: 1903px;

  padding: 0 50px;

  margin: auto;

}

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

  .container-fluid-13 {

    padding: 0 20px;

  }

}

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

  .container-fluid-13 {

    padding: 0 15px;

  }

}



.personal-demo-left-fixed .tmp-btn {

  height: 45px;

  display: flex;

  align-items: center;

  justify-content: center;

}



.tilt-container {

  perspective: 700px;

  width: 100%;

  height: 100%;

  display: grid;

  place-items: center;

}



.tilt-card {

  width: 100%;

  height: 100%;

  background-image: url("../images/banner/instructor.png");

  background-size: cover;

  background-position: center;

  border-radius: 10px;

  cursor: pointer;

}



.background-overlay {

  position: absolute;

  width: 100%;

  height: 100%;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  pointer-events: none;

}

.background-overlay.active {

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

  backdrop-filter: blur(10px);

  z-index: 99;

}



.page-with-left-header-body .scrollToTop {

  left: 300px;

}

.page-with-left-header-body .ready-chatting-option label {

  left: 300px;

}

.page-with-left-header-body .ready-chatting-option .wrapper {

  left: 380px;

}

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

  .page-with-left-header-body .scrollToTop {

    left: 20px;

  }

  .page-with-left-header-body .ready-chatting-option label {

    left: 20px;

  }

  .page-with-left-header-body .ready-chatting-option .wrapper {

    left: 20px;

  }

}



.rolling-text {

  display: inline-block;

  overflow: hidden;

  line-height: 30px;

  height: 21px;

}

.rolling-text .block {

  min-width: max-content;

}



.rolling-text.butn {

  padding: 0 35px;

}



.rolling-text:hover .letter,

.rolling-text.play .letter {

  -webkit-transform: translateY(-100%);

  -ms-transform: translateY(-100%);

  transform: translateY(-100%);

}



.rolling-text .letter {

  display: inline-block;

  -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.76, 0, 0.24, 1);

  transition: -webkit-transform 0.5s cubic-bezier(0.76, 0, 0.24, 1);

  -o-transition: transform 0.5s cubic-bezier(0.76, 0, 0.24, 1);

  transition: transform 0.5s cubic-bezier(0.76, 0, 0.24, 1);

  transition: transform 0.5s cubic-bezier(0.76, 0, 0.24, 1), -webkit-transform 0.5s cubic-bezier(0.76, 0, 0.24, 1);

}



.letter:nth-child(1) {

  -webkit-transition-delay: 0s;

  -o-transition-delay: 0s;

  transition-delay: 0s;

}



.letter:nth-child(2) {

  -webkit-transition-delay: 0.015s;

  -o-transition-delay: 0.015s;

  transition-delay: 0.015s;

}



.letter:nth-child(3) {

  -webkit-transition-delay: 0.03s;

  -o-transition-delay: 0.03s;

  transition-delay: 0.03s;

}



.letter:nth-child(4) {

  -webkit-transition-delay: 0.045s;

  -o-transition-delay: 0.045s;

  transition-delay: 0.045s;

}



.letter:nth-child(5) {

  -webkit-transition-delay: 0.06s;

  -o-transition-delay: 0.06s;

  transition-delay: 0.06s;

}



.letter:nth-child(6) {

  -webkit-transition-delay: 0.075s;

  -o-transition-delay: 0.075s;

  transition-delay: 0.075s;

}



.letter:nth-child(7) {

  -webkit-transition-delay: 0.09s;

  -o-transition-delay: 0.09s;

  transition-delay: 0.09s;

}



.letter:nth-child(8) {

  -webkit-transition-delay: 0.105s;

  -o-transition-delay: 0.105s;

  transition-delay: 0.105s;

}



.letter:nth-child(9) {

  -webkit-transition-delay: 0.12s;

  -o-transition-delay: 0.12s;

  transition-delay: 0.12s;

}



.letter:nth-child(10) {

  -webkit-transition-delay: 0.135s;

  -o-transition-delay: 0.135s;

  transition-delay: 0.135s;

}



.letter:nth-child(11) {

  -webkit-transition-delay: 0.15s;

  -o-transition-delay: 0.15s;

  transition-delay: 0.15s;

}



.letter:nth-child(12) {

  -webkit-transition-delay: 0.165s;

  -o-transition-delay: 0.165s;

  transition-delay: 0.165s;

}



.letter:nth-child(13) {

  -webkit-transition-delay: 0.18s;

  -o-transition-delay: 0.18s;

  transition-delay: 0.18s;

}



.letter:nth-child(14) {

  -webkit-transition-delay: 0.195s;

  -o-transition-delay: 0.195s;

  transition-delay: 0.195s;

}



.letter:nth-child(15) {

  -webkit-transition-delay: 0.21s;

  -o-transition-delay: 0.21s;

  transition-delay: 0.21s;

}



.letter:nth-child(16) {

  -webkit-transition-delay: 0.225s;

  -o-transition-delay: 0.225s;

  transition-delay: 0.225s;

}



.letter:nth-child(17) {

  -webkit-transition-delay: 0.24s;

  -o-transition-delay: 0.24s;

  transition-delay: 0.24s;

}



.letter:nth-child(18) {

  -webkit-transition-delay: 0.255s;

  -o-transition-delay: 0.255s;

  transition-delay: 0.255s;

}



.letter:nth-child(19) {

  -webkit-transition-delay: 0.27s;

  -o-transition-delay: 0.27s;

  transition-delay: 0.27s;

}



.letter:nth-child(20) {

  -webkit-transition-delay: 0.285s;

  -o-transition-delay: 0.285s;

  transition-delay: 0.285s;

}



.letter:nth-child(21) {

  -webkit-transition-delay: 0.3s;

  -o-transition-delay: 0.3s;

  transition-delay: 0.3s;

}



/*!

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;

}



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

}



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

@-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);

  }

}

.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(-50%, 0, 0);

    transform: translate3d(-50%, 0, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes fadeInLeft {

  from {

    opacity: 0;

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

    transform: translate3d(-50%, 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(50%, 0, 0);

    transform: translate3d(50%, 0, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes fadeInRight {

  from {

    opacity: 0;

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

    transform: translate3d(50%, 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, 50%, 0);

    transform: translate3d(0, 50%, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes fadeInUp {

  from {

    opacity: 0;

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

    transform: translate3d(0, 50%, 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;

  }

}

@keyframes rotateIn-2 {

  from {

    -webkit-transform-origin: center;

    transform-origin: center;

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

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

  }

  to {

    -webkit-transform-origin: center;

    transform-origin: center;

    -webkit-transform: none;

    transform: none;

  }

}

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

  }

}

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

  }

}

.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 fadeInUp2 {

  from {

    opacity: 0;

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

    transform: translate3d(0, 40%, 0);

  }

  to {

    opacity: 1;

    -webkit-transform: none;

    transform: none;

  }

}

@keyframes fadeOutUp {

  from {

    opacity: 1;

  }

  to {

    opacity: 0;

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

    transform: translate3d(0, -100%, 0);

  }

}

@keyframes moveright {

  0% {

    -webkit-clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);

    clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);

  }

  to {

    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);

    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);

  }

}

@keyframes moveLeft {

  0% {

    -webkit-clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);

    clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);

  }

  to {

    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);

    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);

  }

}

.move-right {

  animation: moveright 1s linear;

}



.move-left {

  animation: moveLeft 1s linear;

}



/* @import'default/text-animation'; */

/**

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

}



/*----Headers Style----*/

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

    Header Styles  

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

.logo img {

  max-width: 120px;

}

.logo img.logo-white {

  display: none;

}



.header-one {

  padding: 10px 0;

}

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

  .header-one {

    padding: 15px 0;

  }

}

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

  .header-one {

    padding: 15px 0;

  }

}

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

  .header-one {

    padding: 15px 0;

  }

}

.header-one .header-content {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.header-one .header-content .logo {

  display: block;

}

.header-one .header-content .logo img {

  max-width: max-content;

}

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

  .header-one .header-content .logo img {

    max-width: 135px;

  }

}

.header-one .actions-area .social-link {

  display: none;

}

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

  .header-one .actions-area .social-link {

    display: flex;

  }

}

.header-one .actions-area svg {

  cursor: pointer;

}

.header-one .tmp-header-right {

  display: flex;

  align-items: center;

  gap: 25px;

}

.header-one.header--transparent {

  position: absolute;

  width: 100%;

  z-index: 100;

}



.header--sticky.sticky {

  position: fixed !important;

  top: 0;

  display: block;

  backdrop-filter: blur(9px);

  width: 100%;

  box-shadow: 0px 7px 18px rgba(24, 16, 16, 0.0509803922);

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

  z-index: 999;

  margin: auto;

  display: flex;

  align-items: center;

  left: 50%;

  transform: translateX(-50%);

  border-radius: 0;

}

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

  .header--sticky.sticky {

    padding: 15px 30px;

  }

}

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

  .header--sticky.sticky {

    padding: 10px 30px;

  }

}

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

  .header--sticky.sticky {

    padding: 10px 10px;

  }

}

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

  .header--sticky.sticky {

    padding: 10px 10px;

  }

}



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

    Humbergur Styles  

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

.tmp-menu-bars {

  width: 40px;

  height: 40px;

  border-radius: 100%;

  border: 0 none;

  color: #ffffff;

  font-size: 21px;

  display: flex;

  align-items: center;

  justify-content: center;

  transition: var(--transition);

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

  z-index: 1;

  position: relative;

}

.tmp-menu-bars i {

  font-size: 18px;

}

.tmp-menu-bars::after {

  content: " ";

  position: absolute;

  width: 105%;

  height: 105%;

  border-radius: 100px;

  background: var(--color-primary);

  opacity: 1;

  transform: scale(1);

  transition: all 0.4s;

  z-index: -1;

}

.tmp-menu-bars:hover {

  background: transparent;

  color: var(--color-primary);

}

.tmp-menu-bars:hover i::before {

  content: "\f0c9";

}

.tmp-menu-bars:hover::after {

  opacity: 0;

  transform: scale(0);

}



.hamberger-menu {

  display: flex;

  justify-content: flex-end;

  border: 0 none;

  padding: 0;

}

.hamberger-menu i {

  font-size: 32px;

  color: var(--color-primary);

}

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

  .hamberger-menu i {

    font-size: 26px;

  }

}



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

    Only Responsive Header  

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

.tmp-responsive-header-style {

    position: absolute;

    top: 0;

    z-index: 99;

    width: auto;

    right: 0;

    padding: 7px 30px;

    background-color: #fff;

    left: 0;

}



.index-seven .header-style-2.header-left .logo-area {

  max-width: 350px;

}



.header-full-width {

  border-bottom: 1px solid rgba(255, 255, 255, 0.0705882353);

}

.header-full-width .header-fluid-main-wrapper {

  display: flex;

  align-items: center;

  justify-content: space-between;

}

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

  .header-full-width .header-fluid-main-wrapper {

    padding: 13px 0;

  }

}

.header-full-width .header-fluid-main-wrapper .left-area {

  display: flex;

  align-items: center;

  gap: 25px;

}

.header-full-width .header-fluid-main-wrapper .right-area {

  display: flex;

  align-items: center;

  gap: 14px;

}

.header-full-width .header-fluid-main-wrapper .right-area .tmp-menu-bars {

  width: 45px;

  height: 45px;

}

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

  .header-full-width .header-fluid-main-wrapper .right-area .tmp-btn {

    display: none;

  }

}

.header-full-width .tmp-mainmenu-nav .tmp-mainmenu > li {

  position: relative;

  margin: 27px 4px;

}



header.header-full-width.header--sticky.sticky {

  display: block;

}



.demo-model .header-one.header--transparent {

  display: none;

}

.demo-model .header-one.header--transparent.sticky {

  display: block !important;

}

.demo-model .tmp-banner-one-area.style-2 {

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

}

.demo-model .banner-model-15 {

  text-align: center;

  max-width: 80%;

  margin: auto;

}

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

  .demo-model .banner-model-15 {

    max-width: 100%;

  }

}

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

  .demo-model .banner-model-15 {

    max-width: 100%;

  }

}

.demo-model .banner-model-15 .title {

  font-size: 120px !important;

  margin-top: 0;

  margin-bottom: 0;

  text-transform: uppercase;

}

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

  .demo-model .banner-model-15 .title {

    font-size: 100px !important;

  }

}

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

  .demo-model .banner-model-15 .title {

    font-size: 80px !important;

  }

}

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

  .demo-model .banner-model-15 .title {

    font-size: 44px !important;

  }

}

.demo-model .banner-model-15 p.disc {

  font-size: 22px;

  text-transform: uppercase;

  color: #fff;

}



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

    Main Menu Style  

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

.tmp-mainmenu-nav .tmp-mainmenu {

  display: flex;

  align-items: center;

  padding: 0;

  margin: 0;

}

.tmp-mainmenu-nav .tmp-mainmenu > li > a {

  color: var(--color-heading);

  font-weight: 700;

}

.tmp-mainmenu-nav .tmp-mainmenu > li > a:hover {

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

}

.tmp-mainmenu-nav .tmp-mainmenu > li a:hover {

  color: var(--color-primary);

}

.tmp-mainmenu-nav .tmp-mainmenu > li {

  position: relative;

  margin: 10px 4px;

}

.tmp-mainmenu-nav .tmp-mainmenu > li > a {

  padding: 4px 12px !important;

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

  position: relative;

  display: inline-block;

}

.tmp-mainmenu-nav .tmp-mainmenu > li > a::after {

  content: "";

  position: absolute;

  top: 50%;

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

  left: 0;

  background: var(--color-primary);

  width: 100%;

  height: 100%;

  border-radius: 4px;

  opacity: 0;

  visibility: hidden;

  transition: var(--transition);

  z-index: -1;

}

.tmp-mainmenu-nav .tmp-mainmenu > li > a i {

  transition: var(--transition);

  font-size: 10px;

  margin-left: 3px;

}

.tmp-mainmenu-nav .tmp-mainmenu > li > a.active {

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

}

.tmp-mainmenu-nav .tmp-mainmenu > li > a.active::after {

  opacity: 0.1;

  visibility: visible;

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

}

.tmp-mainmenu-nav .tmp-mainmenu > li:hover > a, .tmp-mainmenu-nav .tmp-mainmenu > li.current > a {

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

}

.tmp-mainmenu-nav .tmp-mainmenu > li:hover > a::after, .tmp-mainmenu-nav .tmp-mainmenu > li.current > a::after {

  opacity: 0.1;

  visibility: visible;

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

}

.tmp-mainmenu-nav .tmp-mainmenu > li:hover > a i, .tmp-mainmenu-nav .tmp-mainmenu > li.current > a i {

  transform: rotate(180deg);

}

.tmp-mainmenu-nav .tmp-mainmenu > li.has-dropdown {

  margin-right: 5px;

  margin-top: 0;

  margin-bottom: 0;

  padding: 11px 0;

}

.tmp-mainmenu-nav .tmp-mainmenu > li.has-dropdown .submenu {

  padding: 10px;

  min-width: 230px;

  height: auto;

  position: absolute;

  top: 100%;

  left: 0;

  z-index: 90;

  opacity: 0;

  visibility: hidden;

  text-align: left;

  transition: 0.5s;

  transform: scaleY(0);

  border-radius: 10px;

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

  display: inline-block;

  box-shadow: -3px 0px 20px 4px rgba(100, 95, 95, 0.08);

  transform-origin: 0 0;

  margin-top: 0;

}

.tmp-mainmenu-nav .tmp-mainmenu > li.has-dropdown .submenu li a {

  color: var(--color-heading);

  font-weight: 600;

}

.tmp-mainmenu-nav .tmp-mainmenu > li.has-dropdown:hover .submenu {

  opacity: 1;

  visibility: visible;

  top: 100%;

  transform: scaleY(1);

  overflow: inherit;

}

.tmp-mainmenu-nav .tmp-mainmenu > li.menu-item-open > a {

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

}

.tmp-mainmenu-nav .tmp-mainmenu > li.menu-item-open > a::after {

  opacity: 0.1;

  visibility: visible;

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

}

.tmp-mainmenu-nav .tmp-mainmenu .has-dropdown .submenu {

  padding: 0;

  border: none !important;

  overflow: hidden;

}

.tmp-mainmenu-nav .tmp-mainmenu .has-dropdown .submenu li {

  position: relative;

  display: block;

  cursor: pointer;

  margin-bottom: 0;

  margin-top: 0;

}

.tmp-mainmenu-nav .tmp-mainmenu .has-dropdown .submenu li::after {

  position: absolute;

  content: "\f105";

  font-family: "fontawesome";

  font-size: 14px;

  top: 50%;

  transform: translateY(-50%);

  right: 20px;

  opacity: 0;

  transition: 0.2s;

  color: var(--color-primary);

}

.tmp-mainmenu-nav .tmp-mainmenu .has-dropdown .submenu li a {

  display: block;

  position: relative;

  transition: var(--transition);

  padding: 3px;

}

.tmp-mainmenu-nav .tmp-mainmenu .has-dropdown .submenu li a::before {

  content: "";

  position: absolute;

  top: 50%;

  transform: translateY(-50%);

  left: 0;

  background: var(--color-primary);

  width: 100%;

  height: 28px;

  border-radius: 4px;

  opacity: 0;

  visibility: hidden;

  transition: var(--transition);

  z-index: -1;

}

.tmp-mainmenu-nav .tmp-mainmenu .has-dropdown .submenu li a:hover::before, .tmp-mainmenu-nav .tmp-mainmenu .has-dropdown .submenu li a.active::before {

  opacity: 0.1;

  visibility: visible;

  transform: translateY(-50%);

}

.tmp-mainmenu-nav .tmp-mainmenu .has-dropdown .submenu li > a.active {

  padding-left: 15px;

}

.tmp-mainmenu-nav .tmp-mainmenu .has-dropdown .submenu li:hover > a {

  color: var(--color-primary);

  padding-left: 15px;

}

.tmp-mainmenu-nav .tmp-mainmenu .has-dropdown .submenu li:hover::after {

  right: 15px;

  opacity: 1;

}

.tmp-mainmenu-nav .tmp-mainmenu .has-dropdown .submenu li.menu-item::after {

  display: none;

}



.header-left-sticky {

  position: fixed;

  left: 0px;

  overflow-y: auto;

  overflow-x: hidden;

  height: 100vh;

  min-height: 100vh;

  top: 0px;

  width: 336px;

  z-index: 2;

  transform: translateX(0px);

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

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

  transition: all 0.3s ease-in-out 0s;

}

.header-left-sticky .inner-wrapper {

  position: relative;

  overflow: hidden;

  width: 100%;

  height: 100%;

  padding: 50px 40px 40px;

}

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

  .header-left-sticky .inner-wrapper {

    padding: 20px 40px 20px;

  }

}

.header-left-sticky .inner-wrapper::after {

  content: " ";

  position: absolute;

  right: -450px;

  bottom: -500px;

  min-width: 474px;

  min-height: 474px;

  border-radius: 100px;

  filter: blur(227px);

  z-index: 1;

  background: var(--color-primary);

}

.header-left-sticky .logo-area a img {

    border-radius: 100%;

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

    height: 254px;

    object-fit: cover;

    width: 100%;

    object-position: top;

}

.header-left-sticky .mainmenu-nav .primary-menu {

  display: block;

  margin-top: 50px;

  width: 100%;

  border-radius: 10px;

  margin: 0;

  padding: 30px 0 0 10px;

}

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

  .header-left-sticky .mainmenu-nav .primary-menu {

    padding: 15px 0 0 10px;

  }

}

.header-left-sticky .mainmenu-nav .primary-menu li {

  margin: 0;

}

.header-left-sticky .mainmenu-nav .primary-menu li a {

  display: flex;

  align-items: center;

  border: none;

  font-size: 18px;

  color: var(--color-body);

  border-radius: 10px;

  width: 100%;

  margin-left: 0;

  margin: 8px 0;

  font-size: 16px;

  transition: var(--transition);

  font-weight: 600;

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

  position: relative;

}

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

  .header-left-sticky .mainmenu-nav .primary-menu li a {

    margin: 5px 0;

    padding: 4px 10px;

  }

}

.header-left-sticky .mainmenu-nav .primary-menu li a::after {

  content: "";

  position: absolute;

  top: 50%;

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

  left: 0;

  background: var(--color-primary);

  width: 100%;

  height: 100%;

  border-radius: 4px;

  opacity: 0;

  visibility: hidden;

  transition: var(--transition);

  z-index: -1;

}

.header-left-sticky .mainmenu-nav .primary-menu li a:hover {

  color: var(--color-primary);

}

.header-left-sticky .mainmenu-nav .primary-menu li a.active {

  color: var(--color-primary);

}

.header-left-sticky .mainmenu-nav .primary-menu li a svg {

  height: 18px;

  width: 18px;

  margin-right: 8px;

  color: var(--color-primary);

  top: -1px;

  position: relative;

  opacity: 0.6;

}

.header-left-sticky .mainmenu-nav .primary-menu li.current a {

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

}

.header-left-sticky .mainmenu-nav .primary-menu li.current a::after {

  opacity: 0.1;

  visibility: visible;

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

}



.page-with-left-header {

  margin-left: 290px;

}

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

  .page-with-left-header {

    margin-left: 320px;

  }

}



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

  .page-with-left-header {

    margin-left: 0;

    overflow-x: hidden;

  }

}

.tmp-popup-mobile-menu .social-share-style-1,

.tmp-header-area .social-share-style-1 {

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

  padding-top: 40px;

  margin-top: 40px !important;

}

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

  .tmp-popup-mobile-menu .social-share-style-1,

  .tmp-header-area .social-share-style-1 {

    padding-top: 15px;

    margin-top: 15px !important;

  }

}

.tmp-popup-mobile-menu .social-share-style-1 .title,

.tmp-header-area .social-share-style-1 .title {

  font-size: 16px;

  color: var(--color-body);

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

  display: block;

  margin-bottom: 10px;

  font-weight: 500;

}



.social-wrapper .subtitle {

  color: var(--color-heading);

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

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

  display: block;

  text-transform: uppercase;

  margin-bottom: 15px;

  font-weight: 500;

  letter-spacing: 0.5px;

}



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

    Mobile Menu Styles  

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

.tmp-popup-mobile-menu {

  z-index: 9999;

  position: fixed;

  content: "";

  width: 100%;

  height: 100%;

  position: fixed;

  top: 0;

  bottom: 0;

  left: 0;

  right: 0;

  background-color: rgba(0, 0, 0, 0.8);

  visibility: hidden;

  opacity: 0;

  transition: opacity 0.5s ease-out;

}

.tmp-popup-mobile-menu .inner {

  width: 320px;

  z-index: 999;

  position: absolute;

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

  height: 100%;

  height: 100vh;

  display: flex;

  flex-direction: column;

  opacity: 0;

  left: -150px;

  transition: all 0.5s ease-out;

  padding: 15px 20px;

}

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

  .tmp-popup-mobile-menu .inner {

    width: 310px;

    padding: 16px 30px;

  }

}

.tmp-popup-mobile-menu .header-top {

  display: flex;

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

  align-items: center;

  justify-content: space-between;

  padding: 15px 0;

}

.tmp-popup-mobile-menu .header-top .logo a img {

     max-height: 100px;
    width: 100px;
    object-fit: cover;
    border-radius: 50%;
    object-position: top;

}

.tmp-popup-mobile-menu .header-top .close-menu .close-button {

  background: var(--color-secondary);

  border: 0 none;

  color: var(--color-white);

  width: 40px;

  height: 40px;

  font-size: 21px;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 100%;

}

.tmp-popup-mobile-menu .header-top p.discription {

  font-size: 15px;

  line-height: 26px;

  margin-top: 19px;

  color: var(--color-body);

  padding-right: 0;

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

}

.tmp-popup-mobile-menu .tmp-mainmenu {

  list-style: none;

  padding: 0;

  margin: 0;

  margin-top: 0;

}

.tmp-popup-mobile-menu .tmp-mainmenu li {

  display: block;

  margin: 0;

  padding: 8px 0;

}

.tmp-popup-mobile-menu .tmp-mainmenu li a {

  color: var(--color-body);

  position: relative;

  transition: var(--transition);

  font-size: 14px;

  font-weight: 400;

  text-transform: uppercase;

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

  margin: 0;

  display: block;

  font-weight: 500;

  background: transparent;

}

.tmp-popup-mobile-menu .tmp-mainmenu li a i {

  position: absolute;

  top: 50%;

  transform: translateY(-50%);

  right: 0;

  font-size: 15px;

}

.tmp-popup-mobile-menu .tmp-mainmenu li a.open i::before {

  content: "\f106";

  font-weight: 400;

}

.tmp-popup-mobile-menu .tmp-mainmenu li + li {

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

}

.tmp-popup-mobile-menu .tmp-mainmenu .has-dropdown .submenu {

  padding: 0;

  max-width: 100%;

  list-style: none;

  padding-left: 16px;

  display: none;

}

.tmp-popup-mobile-menu .tmp-mainmenu .has-dropdown .submenu li a {

  font-size: 14px;

  color: var(--color-body);

  font-weight: 500;

}

.tmp-popup-mobile-menu .tmp-mainmenu .has-dropdown .submenu li a.open {

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

}

.tmp-popup-mobile-menu.active {

  visibility: visible;

  opacity: 1;

}

.tmp-popup-mobile-menu.active .inner {

  opacity: 1;

  left: 0;

  overflow-y: auto;

}



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

    Offcanvas Menu Style  

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

.tmp-sidebar-area {

  width: 400px;

  position: fixed;

  right: 0;

  top: 0;

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

  z-index: 99999;

  height: 100%;

  transform: translate3d(100%, 0, 0);

  overflow: hidden;

  overscroll-behavior: contain;

  transition: transform 0.85s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.6s step-end;

}

.tmp-sidebar-area .inner {

  position: relative;

  overflow: hidden;

  height: 100%;

  overflow-y: auto;

}

.tmp-sidebar-area .inner .top-area {

  padding: 16px 20px;

  background: #151515;

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.tmp-sidebar-area .inner .image-area-feature img {

  border-radius: 0;

}

.tmp-sidebar-area .inner .content-wrapper {

  padding: 30px;

}

.tmp-sidebar-area .inner .content-wrapper .title {

  color: var(--color-heading);

  line-height: 1.4;

}

.tmp-sidebar-area .inner .content-wrapper .disc {

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

  color: var(--color-gray);

  font-size: 16px;

  font-weight: 400;

}

.tmp-sidebar-area.tmp_side_bar_open {

  transform: translate3d(0, 0, 0);

  transition: transform 0.85s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.6s step-start;

}

.tmp-sidebar-area .short-contact-area .single-contact {

  margin-bottom: 20px;

  display: flex;

  align-items: center;

  gap: 20px;

}

.tmp-sidebar-area .short-contact-area .single-contact i {

  height: 45px;

  width: 45px;

  background: transparent;

  display: flex;

  align-items: center;

  color: var(--color-heading);

  justify-content: center;

  font-size: 18px;

  border-radius: 5px;

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

}

.tmp-sidebar-area .short-contact-area .single-contact .information span {

  display: block;

  color: var(--color-primary);

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

  text-transform: uppercase;

  font-size: 15px;

  margin-bottom: 0;

  font-weight: 600;

}

.tmp-sidebar-area .short-contact-area .single-contact .information .number {

  color: var(--color-heading);

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

}



.overlay_close_side_menu {

  display: block;

  width: 100vw;

  height: 100vh;

  position: fixed;

  top: 0;

  left: 0;

  z-index: 1091;

  opacity: 0;

  visibility: hidden;

  transition: opacity 0.3s, visibility 0.3s;

  cursor: url(../images/icons/cursor-x.webp), pointer;

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

  backdrop-filter: blur(15px);

}



.sidemenu-active .overlay_close_side_menu {

  opacity: 1;

  visibility: visible;

}



/*----Elements Style // @import'elements/button'; ----*/

/* Zoom in image on scroll */

.animate--zoom-in {

  --zoom-in-ratio: 1;

}



.animate--zoom-in > img,

.animate--zoom-in > svg {

  transition: scale var(--duration-short) linear;

  scale: var(--zoom-in-ratio);

}



:root {

  --duration-announcement-bar: 250ms;

  --duration-medium: 300ms;

  --duration-long: 500ms;

  --duration-extra-long: 600ms;

  --duration-extra-longer: 750ms;

  --duration-extended: 3s;

  --animation-slide-in: slideIn var(--duration-extra-long) ease forwards;

  --animation-fade-in: fadeInUp var(--duration-extra-long) ease forwards;

  --animation-zoom-in: zoomIn var(--duration-extra-longer) ease forwards;

  --animation-zoom-out: zoomOut var(--duration-extra-longer) ease forwards;

}



/* Animations */

@media (prefers-reduced-motion: no-preference) {

  .animate--ambient > img,

  .animate--ambient > svg {

    animation: animateAmbient 30s linear infinite;

  }

  @keyframes animateAmbient {

    0% {

      transform: rotate(0deg) translateX(1em) rotate(0deg) scale(1.2);

    }

    100% {

      transform: rotate(360deg) translateX(1em) rotate(-360deg) scale(1.2);

    }

  }

  .tmp-scroll-trigger:is(.tmp-zoom-in, .zoom_out, .tmp-fade-in, .slide_in) {

    opacity: 0.01;

  }

  .tmp-scroll-trigger:not(.tmp-scroll-trigger--offscreen).tmp-zoom-in {

    animation: var(--animation-zoom-in);

    animation-delay: calc(var(--animation-order) * 75ms);

  }

  .tmp-scroll-trigger:not(.tmp-scroll-trigger--offscreen).zoom_out {

    animation: var(--animation-zoom-out);

    animation-delay: calc(var(--animation-order) * 75ms);

  }

  .tmp-scroll-trigger:not(.tmp-scroll-trigger--offscreen).tmp-fade-in {

    animation: var(--animation-fade-in);

    animation-delay: calc(var(--animation-order) * 75ms);

  }

  .tmp-scroll-trigger:not(.tmp-scroll-trigger--offscreen).slide_in {

    animation: var(--animation-slide-in);

    animation-delay: calc(var(--animation-order) * 75ms);

  }

  .tmp-scroll-trigger.tmp-scroll-trigger--design-mode.tmp-fade-in,

  .tmp-scroll-trigger.tmp-scroll-trigger--design-mode.slide_in,

  .tmp-scroll-trigger.tmp-scroll-trigger--design-mode .slider,

  .tmp-scroll-trigger:not(.tmp-scroll-trigger--offscreen).tmp-scroll-trigger--cancel {

    opacity: 1;

    animation: none;

    transition: none;

  }

  .tmp-scroll-trigger[animation-end] {

    opacity: 1;

    animation: none !important;

    transition: none;

  }

  /* .collection-tab__tab-content

      .tmp-scroll-trigger:not(.tmp-scroll-trigger--offscreen).tmp-zoom-in {

      animation-delay: calc(0.5s + var(--animation-order) * 75ms);

    } */

  .tmp-scroll-trigger.tmp-scroll-trigger--design-mode.slide_in {

    transform: translateY(0);

  }

  @keyframes slideIn {

    from {

      transform: translateY(1rem);

      opacity: 0.01;

    }

    to {

      transform: translateY(0);

      opacity: 1;

    }

  }

  @keyframes zoomIn {

    from {

      opacity: 0;

      transform: scale(1.05);

    }

    to {

      opacity: 1;

      transform: scale(1);

    }

  }

  @keyframes zoomOut {

    from {

      opacity: 0;

      transform: scale(1);

    }

    to {

      opacity: 1;

      transform: scale(1.05);

    }

  }

}

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

  .tmp-scroll-trigger:not(.tmp-scroll-trigger--offscreen) .slider--tablet {

    animation: var(--animation-slide-in);

  }

}

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

  .tmp-scroll-trigger:not(.tmp-scroll-trigger--offscreen) .slider--desktop {

    animation: var(--animation-slide-in);

  }

}

.tmp-scroll-trigger.tmp-scroll-trigger--design-mode.tmp-fade-in,

.tmp-scroll-trigger.tmp-scroll-trigger--design-mode.slide_in,

.tmp-scroll-trigger.tmp-scroll-trigger--design-mode .slider,

.tmp-scroll-trigger:not(.tmp-scroll-trigger--offscreen).tmp-scroll-trigger--cancel {

  opacity: 1;

  animation: none;

  transition: none;

}



.tmp-scroll-trigger.tmp-scroll-trigger--design-mode.slide_in {

  transform: translateY(0);

}



@keyframes slideIn {

  from {

    transform: translateY(2rem);

    opacity: 0.01;

  }

  to {

    transform: translateY(0);

    opacity: 1;

  }

}

@keyframes fadeIn {

  from {

    opacity: 0.01;

  }

  to {

    opacity: 1;

  }

}

.animation-order-0 {

  --animation-order: 0;

}



.animation-order-1 {

  --animation-order: 1;

}



.animation-order-2 {

  --animation-order: 2;

}



.animation-order-3 {

  --animation-order: 3;

}



.animation-order-4 {

  --animation-order: 4;

}



.animation-order-5 {

  --animation-order: 5;

}



.animation-order-6 {

  --animation-order: 6;

}



.animation-order-7 {

  --animation-order: 7;

}



.animation-order-8 {

  --animation-order: 8;

}



.animation-order-9 {

  --animation-order: 9;

}



.animation-order-10 {

  --animation-order: 10;

}



.animation-order-11 {

  --animation-order: 11;

}



.animation-order-12 {

  --animation-order: 12;

}



.animation-order-13 {

  --animation-order: 13;

}



.animation-order-14 {

  --animation-order: 14;

}



.animation-order-15 {

  --animation-order: 15;

}



.animation-order-16 {

  --animation-order: 16;

}



.animation-order-17 {

  --animation-order: 17;

}



.animation-order-18 {

  --animation-order: 18;

}



.animation-order-19 {

  --animation-order: 19;

}



.animation-order-20 {

  --animation-order: 20;

}



.animation-order-21 {

  --animation-order: 21;

}



.animation-order-22 {

  --animation-order: 22;

}



.animation-order-23 {

  --animation-order: 23;

}



.animation-order-24 {

  --animation-order: 24;

}



.animation-order-25 {

  --animation-order: 25;

}



.animation-order-26 {

  --animation-order: 26;

}



.animation-order-27 {

  --animation-order: 27;

}



.animation-order-28 {

  --animation-order: 28;

}



.animation-order-29 {

  --animation-order: 29;

}



.animation-order-30 {

  --animation-order: 30;

}



.animation-order-31 {

  --animation-order: 31;

}



.animation-order-32 {

  --animation-order: 32;

}



.animation-order-33 {

  --animation-order: 33;

}



.animation-order-34 {

  --animation-order: 34;

}



.animation-order-35 {

  --animation-order: 35;

}



.animation-order-36 {

  --animation-order: 36;

}



.animation-order-37 {

  --animation-order: 37;

}



.animation-order-38 {

  --animation-order: 38;

}



.animation-order-39 {

  --animation-order: 39;

}



.animation-order-40 {

  --animation-order: 40;

}



.animation-order-41 {

  --animation-order: 41;

}



.animation-order-42 {

  --animation-order: 42;

}



.animation-order-43 {

  --animation-order: 43;

}



.animation-order-44 {

  --animation-order: 44;

}



.animation-order-45 {

  --animation-order: 45;

}



.animation-order-46 {

  --animation-order: 46;

}



.animation-order-47 {

  --animation-order: 47;

}



.animation-order-48 {

  --animation-order: 48;

}



.animation-order-49 {

  --animation-order: 49;

}



.animation-order-50 {

  --animation-order: 50;

}



.animation-round-wrap {

  position: absolute;

  left: -2px;

  top: -2px;

  height: calc(100% + 4px);

  width: calc(100% + 4px);

  padding: 2px;

  border-radius: 16px;

  overflow: hidden;

}

.animation-round-wrap .round-animation-1 {

  position: absolute;

  width: 180px;

  height: 180px;

  inset: 0;

  transform: rotate(45deg);

  animation: 8s linear infinite border-round-circle-1;

  offset-path: rect(0% auto 100% auto);

  background: linear-gradient(90deg, rgba(45, 13, 255, 0) 0%, rgb(58, 230, 242) 43%, rgba(45, 13, 255, 0) 100%);

}



/* Animation */

@keyframes border-round-circle-1 {

  0% {

    offset-distance: 0%;

  }

  100% {

    offset-distance: 100%;

  }

}

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

  RPP Banner One Area

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

.tmp-gradient-main {

  position: relative;

  z-index: 1;

}

.tmp-gradient-main .tmp-gradient-wrapper {

  filter: blur(115px);

  position: absolute;

  left: 72%;

  top: 50%;

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

  opacity: 0.8;

  z-index: -1;

}



.banner-right-thumbnail-area.v2 .banner-right-thumb-left-content .title {

  font-size: 90px;

}

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

  .banner-right-thumbnail-area.v2 .banner-right-thumb-left-content .title {

    font-size: 65px;

  }

}

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

  .banner-right-thumbnail-area.v2 .banner-right-thumb-left-content .title {

    font-size: 65px;

  }

}

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

  .banner-right-thumbnail-area.v2 .banner-right-thumb-left-content .title {

    font-size: 45px;

  }

}

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

  .banner-right-thumbnail-area.v2 .banner-right-thumb-left-content .title {

    font-size: 40px;

  }

}



.bg_image {

  background-repeat: no-repeat;

  background-size: cover;

  background-position: center center;

}



.tmp-banner-one-area {

  padding-top: 26px;

  background-image: url("../images/banner/banner-background-one.jpg");

  background-position: center;

  background-size: cover;

  background-repeat: no-repeat;

  padding-top: 120px;

}

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

  .tmp-banner-one-area {

    padding-bottom: 100px;

  }

}

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

  .tmp-banner-one-area {

    padding-bottom: 100px;

  }

}

.tmp-banner-one-area.add-pattern {

  background-image: none;

  position: relative;

  z-index: 1;

}

.tmp-banner-one-area.add-pattern::before {

  content: "";

  position: absolute;

  top: 0;

  bottom: 0;

  left: 0;

  right: 0;

  mix-blend-mode: overlay;

  background-image: linear-gradient(var(--color-white), transparent 1px), linear-gradient(to right, var(--color-white), transparent 1px);

  background-size: 100% 100px, 100px 100%;

  opacity: 0.08;

  width: 100%;

  height: 100%;

  z-index: -1;

  background-attachment: fixed;

}

.tmp-banner-one-area.style-2 {

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

  min-height: 950px;

  display: flex;

  align-items: center;

  overflow: hidden;

}

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

  .tmp-banner-one-area.style-2 {

    min-height: auto;

    padding: 100px 0;

    padding-top: 150px;

  }

}

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

  .tmp-banner-one-area.style-2 {

    min-height: auto;

    padding: 150px 0;

    padding-top: 150px;

  }

}

.tmp-banner-one-area.style-2 .inner .title {

  font-size: 64px;

  line-height: 1.2;

}

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

  .tmp-banner-one-area.style-2 .inner .title {

    font-size: 60px;

  }

}

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

  .tmp-banner-one-area.style-2 .inner .title {

    font-size: 58px;

  }

}

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

  .tmp-banner-one-area.style-2 .inner .title {

    font-size: 52px;

  }

}

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

  .tmp-banner-one-area.style-2 .inner .title {

    font-size: 34px;

  }

}

.tmp-banner-one-area.style-3, .tmp-banner-one-area.style-4 {

  min-height: 850px;

  display: flex;

  align-items: center;

  justify-content: center;

  padding-top: 0;

  background-image: url(../images/banner/banner-background-02.jpg);

}

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

  .tmp-banner-one-area.style-3, .tmp-banner-one-area.style-4 {

    height: auto;

    padding-top: 100px;

    padding-bottom: 70px;

    min-height: auto;

  }

}

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

  .tmp-banner-one-area.style-3, .tmp-banner-one-area.style-4 {

    padding-bottom: 10px;

  }

}

.tmp-banner-one-area.style-3 .thumbnail-author, .tmp-banner-one-area.style-4 .thumbnail-author {

  position: relative;

  z-index: 1;

  max-width: max-content;

  margin: auto;

  margin-bottom: 20px;

}

.tmp-banner-one-area.style-3 .thumbnail-author .loader-bg-pattern-wrapper, .tmp-banner-one-area.style-4 .thumbnail-author .loader-bg-pattern-wrapper {

  top: 50%;

}

.tmp-banner-one-area.style-3 .thumbnail-author .loader-bg-pattern-wrapper .loader-bg-pattern, .tmp-banner-one-area.style-4 .thumbnail-author .loader-bg-pattern-wrapper .loader-bg-pattern {

  --size: 380px;

  --duration: 4s;

  --logo-color: grey;

  --background: linear-gradient( 0deg, rgba(50, 50, 50, 0.2) 0%, rgba(100, 100, 100, 0.2) 100% );

  height: var(--size);

  aspect-ratio: 1;

  position: relative;

}

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

  .tmp-banner-one-area.style-3 .thumbnail-author .loader-bg-pattern-wrapper .loader-bg-pattern, .tmp-banner-one-area.style-4 .thumbnail-author .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size: 260px;

  }

}

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

  .tmp-banner-one-area.style-3 .thumbnail-author .loader-bg-pattern-wrapper .loader-bg-pattern, .tmp-banner-one-area.style-4 .thumbnail-author .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size: 230px;

  }

}

.tmp-banner-one-area.style-3 .thumbnail-author img, .tmp-banner-one-area.style-4 .thumbnail-author img {

  border-radius: 100%;

  border: 25px solid #141414;

  width: 350px;

  height: 350px;

  object-fit: cover;

  min-width: 350px;

}

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

  .tmp-banner-one-area.style-3 .thumbnail-author img, .tmp-banner-one-area.style-4 .thumbnail-author img {

    width: 250px;

    height: 250px;

    min-width: 250px;

  }

}

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

  .tmp-banner-one-area.style-3 .inner .title, .tmp-banner-one-area.style-4 .inner .title {

    font-size: 40px;

  }

}

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

  .tmp-banner-one-area.style-3 .inner .title, .tmp-banner-one-area.style-4 .inner .title {

    font-size: 34px;

  }

}

.tmp-banner-one-area.style-4 {

  min-height: 900px;

  background-image: url(../images/banner/banner-background-04.jpg);

  position: relative;

  background-image: none;

}

.tmp-banner-one-area.style-4 .galaxy {

  height: 100%;

  width: 100%;

  background-image: linear-gradient(to right, #19191b 1px, transparent 1px), linear-gradient(to bottom, #19191b 1px, transparent 1px);

  background-size: 13rem 13rem;

  background-position: center center;

  position: absolute;

  z-index: -1;

  filter: blur(0);

}

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

  .tmp-banner-one-area.style-4 {

    height: auto;

    padding-top: 100px;

    padding-bottom: 70px;

    min-height: auto;

  }

}



.loader-bg-pattern-wrapper {

  position: absolute;

  left: 50%;

  z-index: -1;

  top: 34.1%;

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

}

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

  .loader-bg-pattern-wrapper {

    top: 35.1%;

  }

}

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

  .loader-bg-pattern-wrapper {

    top: 28.8%;

  }

}

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

  .loader-bg-pattern-wrapper {

    top: 38.1%;

  }

}

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

  .loader-bg-pattern-wrapper {

    top: 36%;

  }

}

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

  .loader-bg-pattern-wrapper {

    top: 36%;

  }

}

.loader-bg-pattern-wrapper .loader-bg-pattern {

  --size: 450px;

  --duration: 4s;

  --logo-color: grey;

  --background: linear-gradient(

    0deg,

    rgba(50, 50, 50, 0.2) 0%,

    rgba(100, 100, 100, 0.2) 100%

  );

  height: var(--size);

  aspect-ratio: 1;

  position: relative;

}

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

  .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:420px;

  }

}

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

  .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:400px;

  }

}

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

  .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:320px;

  }

}

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

  .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:220px ;

  }

}

.loader-bg-pattern-wrapper .loader-bg-pattern .box {

  position: absolute;

  background: rgba(100, 100, 100, 0.15);

  background: var(--background);

  border-radius: 50%;

  border-top: 1px solid rgb(100, 100, 100);

  box-shadow: rgba(0, 0, 0, 0.3) 0px 10px 10px 0px;

  backdrop-filter: blur(5px);

  animation: ripple var(--duration) infinite ease-in-out;

}

.loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(1) {

  inset: 40%;

  z-index: 99;

}

.loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(2) {

  inset: 30%;

  z-index: 98;

  border-color: rgba(100, 100, 100, 0.8);

  animation-delay: 0.2s;

}

.loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(3) {

  inset: 20%;

  z-index: 97;

  border-color: rgba(100, 100, 100, 0.6);

  animation-delay: 0.4s;

}

.loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(4) {

  inset: 10%;

  z-index: 96;

  border-color: rgba(100, 100, 100, 0.4);

  animation-delay: 0.6s;

}

.loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(5) {

  inset: 0%;

  z-index: 95;

  border-color: rgba(100, 100, 100, 0.2);

  animation-delay: 0.8s;

}

.loader-bg-pattern-wrapper .loader-bg-pattern .logo {

  position: absolute;

  inset: 0;

  display: grid;

  place-content: center;

  padding: 30%;

}

.loader-bg-pattern-wrapper .loader-bg-pattern .logo svg {

  fill: var(--logo-color);

  width: 100%;

  animation: color-change var(--duration) infinite ease-in-out;

}

@keyframes ripple {

  0% {

    transform: scale(1);

    box-shadow: rgba(0, 0, 0, 0.3) 0px 10px 10px 0px;

  }

  50% {

    transform: scale(1.3);

    box-shadow: rgba(0, 0, 0, 0.3) 0px 30px 20px 0px;

  }

  100% {

    transform: scale(1);

    box-shadow: rgba(0, 0, 0, 0.3) 0px 10px 10px 0px;

  }

}

@keyframes color-change {

  0% {

    fill: var(--logo-color);

  }

  50% {

    fill: white;

  }

  100% {

    fill: var(--logo-color);

  }

}



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

  RPP Banner Two Area

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

.rpp-banner-two-area {

  padding-top: 106px;

  position: relative;

  z-index: 1;

  overflow: hidden;

}

.rpp-banner-two-area::after, .rpp-banner-two-area::before {

  content: " ";

  opacity: 0.3;

  background: var(--color-primary);

  position: absolute;

  width: 611px;

  height: 611px;

  border-radius: 100px;

  filter: blur(300px);

  z-index: -1;

}

.rpp-banner-two-area::before {

  top: -73px;

  left: -292px;

}

.rpp-banner-two-area::after {

  top: -73px;

  right: -292px;

}

.rpp-banner-two-area .banner-shape-two {

  position: absolute;

  top: 0;

  opacity: 0.5;

  left: 0;

  z-index: -1;

}



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

  RPP Banner Four Area

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

.rpp-banner-four-area {

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

  overflow: hidden;

}



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

  Banner One Main Wrapper

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

.tmp-white-version.index-ten .banner-one-main-wrapper .inner .title {

  margin-top: 0 !important;

}



.index-11 .banner-one-main-wrapper .inner .title {

  margin-top: 0 !important;

}



.banner-one-main-wrapper .inner .sub-title {

  color: var(--color-heading);

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

  font-size: 20px;

  font-weight: 400;

  line-height: 38px;

  text-transform: uppercase;

  margin-bottom: 15px;

  display: inline-flex;

}

.banner-one-main-wrapper .inner .title {

  color: var(--color-heading);

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

  font-size: 62px;

  line-height: 1.3;

  font-weight: 700;

  margin-bottom: 0;

  position: relative;

  z-index: 2;

  margin-top: 10px;

}

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

  .banner-one-main-wrapper .inner .title {

    font-size: 54px;

  }

}

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

  .banner-one-main-wrapper .inner .title {

    font-size: 54px;

  }

}

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

  .banner-one-main-wrapper .inner .title {

    font-size: 54px;

  }

}

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

  .banner-one-main-wrapper .inner .title {

    font-size: 32px;

  }

}

.banner-one-main-wrapper .inner .title span {

  color: var(--color-primary);

}

.banner-one-main-wrapper .inner .disc {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 31px;

  margin-bottom: 0;

  margin-top: 22px;

}

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

  .banner-one-main-wrapper .inner .disc {

    margin-top: 9px;

    font-size: 16px;

    font-weight: 400;

    line-height: 28px;

  }

}

.banner-one-main-wrapper .inner .button-area-banner-one {

  margin-top: 39px;

  position: relative;

  z-index: 2;

}

.banner-one-main-wrapper .banner-right-content {

  position: relative;

  z-index: 1;

  display: flex;

  justify-content: end;

}

@media (min-width: 1450px) {

  .banner-one-main-wrapper .banner-right-content {

    right: -80px;

  }

}

.banner-one-main-wrapper .banner-right-content img {

  max-width: 600px;

  height: auto;

  object-fit: contain;

  margin-right: 70px;

}

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

  .banner-one-main-wrapper .banner-right-content img {

    margin-right: 0;

  }

}

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

  .banner-one-main-wrapper .banner-right-content img {

    margin-right: 0;

  }

}

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

  .banner-one-main-wrapper .banner-right-content img {

    margin: auto;

  }

}

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

  .banner-one-main-wrapper .banner-right-content img {

    margin: auto;

  }

}

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

  .banner-one-main-wrapper .banner-right-content img {

    max-width: 260px;

  }

}

.banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

  color: var(--color-heading);

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

  font-size: 48px;

  line-height: 1.2;

  font-weight: 700;

  position: absolute;

  margin-bottom: 0;

  top: 25%;

  z-index: -1;

  display: flex;

  align-items: center;

  justify-content: center;

  width: 100%;

}

@media (min-width: 300px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

    font-size: 50px;

  }

}

@media (min-width: 500px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

    font-size: 60px;

  }

}

@media (min-width: 600px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

    font-size: 60px;

  }

}

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

  .banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

    font-size: 60px;

  }

}

@media (min-width: 1200px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

    font-size: 70px;

  }

}

@media (min-width: 1500px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

    font-size: 73px;

  }

}

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

  .banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

    font-size: 48px;

  }

}

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

  .banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

    font-size: 46px;

  }

}

.banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

  position: absolute;

  bottom: 190px;

  left: 0px;

  font-size: 48px;

  line-height: 1.2;

  -webkit-text-stroke: 1px var(--color-heading);

  color: transparent;

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

  font-weight: 700;

  margin-bottom: 0;

  display: flex;

  align-items: center;

  justify-content: center;

  width: 100%;

}

@media (min-width: 300px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 50px;

    bottom: 30px;

  }

}

@media (min-width: 500px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 50px;

    bottom: 30px;

  }

}

@media (min-width: 500px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 60px;

    bottom: 100px;

  }

}

@media (min-width: 600px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 60px;

  }

}

@media (min-width: 1200px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 60px;

  }

}

@media (min-width: 1500px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 73px;

  }

}

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

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 60px;

  }

}

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

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 48px;

  }

}

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

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 46px;

  }

}



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

  Banner Two Main Wrapper

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

.banner-two-main-wrapper {

  padding-bottom: 94px;

}

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

  .banner-two-main-wrapper {

    padding-bottom: 0;

  }

}

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

  .banner-two-main-wrapper {

    padding-bottom: 0;

  }

}

.banner-two-main-wrapper .inner .sub-title {

  color: var(--color-primary);

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

  font-size: 18px;

  font-weight: 700;

  line-height: 27px;

  letter-spacing: 4px;

  text-transform: uppercase;

  margin-bottom: 7px;

  display: inline-flex;

}

.banner-two-main-wrapper .inner .title {

  color: var(--color-heading);

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

  font-size: 42px;

  line-height: 38px;

  font-weight: 700;

  margin-bottom: 0;

  line-height: 1.3;

}

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

  .banner-two-main-wrapper .inner .title {

    font-size: 42px;

  }

}

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

  .banner-two-main-wrapper .inner .title {

    font-size: 32px;

  }

}

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

  .banner-two-main-wrapper .inner .title {

    font-size: 28px;

  }

}

.banner-two-main-wrapper .inner .title span {

  color: var(--color-primary);

}

.banner-two-main-wrapper .inner .disc {

  color: var(--color-gray);

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

  font-size: 20px;

  font-weight: 400;

  line-height: 34px;

  margin-bottom: 0;

  margin-top: 16px;

}

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

  .banner-two-main-wrapper .inner .disc {

    font-size: 18px;

    line-height: 30px;

  }

}

.banner-two-main-wrapper .inner .disc span {

  color: var(--color-primary);

}

.banner-two-main-wrapper .inner .button-area-banner-two {

  margin-top: 39px;

}

.banner-two-main-wrapper .banner-right-content .main-img {

  position: relative;

  z-index: 0;

  display: flex;

  justify-content: center;

}

.banner-two-main-wrapper .banner-right-content .main-img::after {

  content: " ";

  position: absolute;

  bottom: 0;

  left: 0;

  background: linear-gradient(180deg, rgba(6, 6, 6, 0) 46.14%, #010c13 100%);

  width: 100%;

  height: 580.327px;

  z-index: 0;

}

.banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-1 {

  color: var(--color-heading);

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

  font-size: 60px;

  font-weight: 700;

  line-height: 70px;

  position: absolute;

  top: 265px;

  z-index: -1;

}

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

  .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-1 {

    display: none;

  }

}

@media (min-width: 576px) {

  .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-1 {

    font-size: 60px;

    line-height: 110px;

  }

}

@media (min-width: 992px) {

  .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-1 {

    font-size: 90px;

    line-height: 105px;

  }

}

@media (min-width: 1200px) {

  .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-1 {

    font-size: 94px;

    line-height: 120px;

  }

}

.banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-2 {

  -webkit-text-stroke: 1px var(--color-heading);

  color: transparent;

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

  font-size: 60px;

  line-height: 70px;

  font-weight: 700;

  position: absolute;

  bottom: 110px;

  z-index: 1;

  margin-bottom: 0;

}

@media (min-width: 400px) {

  .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-2 {

    font-size: 75px;

    line-height: 85px;

  }

}

@media (min-width: 576px) {

  .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-2 {

    font-size: 60px;

    line-height: 110px;

  }

}

@media (min-width: 992px) {

  .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-2 {

    font-size: 66px;

    line-height: 105px;

  }

}

@media (min-width: 1200px) {

  .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-2 {

    font-size: 94px;

    line-height: 120px;

  }

}

.banner-two-main-wrapper .banner-right-content .main-img .logo-under-img-wrap {

  position: absolute;

  width: 100px;

  left: 0;

  bottom: 0;

  z-index: 2;

}

@media (min-width: 992px) {

  .banner-two-main-wrapper .banner-right-content .main-img .logo-under-img-wrap {

    width: 200px;

    left: -110px;

    bottom: -74px;

  }

}

.banner-two-main-wrapper .banner-right-content .main-img .logo-under-img-wrap .logo-under-img {

  position: relative;

  left: 0;

  bottom: 0;

  transition: 0.3s;

  animation: rotateIn-2 20s linear infinite;

}

.banner-two-main-wrapper .banner-right-content .main-img .logo-under-img-wrap .logo-under-img-2 {

  position: absolute;

  left: 50%;

  top: 50%;

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

}

.banner-two-main-wrapper .banner-right-content .main-img .benner-two-bg-red-img {

  position: absolute;

  bottom: 0;

  z-index: -1;

}



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

  Banner Four Main Wrapper, Banner Six Main Wrapper

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

.banner-four-main-wrapper .inner .sub-title,

.banner-six-main-wrapper .inner .sub-title {

  color: var(--color-primary);

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

  font-size: 32px;

  font-style: normal;

  font-weight: 700;

  line-height: 130%;

  text-transform: capitalize;

  margin-bottom: 10px;

}

.banner-four-main-wrapper .inner .title,

.banner-six-main-wrapper .inner .title {

  color: var(--color-heading);

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

  font-weight: 700;

  margin-bottom: 20px;

  font-size: 48px;

  line-height: 58px;

}

@media (min-width: 668px) {

  .banner-four-main-wrapper .inner .title,

  .banner-six-main-wrapper .inner .title {

    font-size: 110px;

    line-height: 100%;

  }

}

@media (min-width: 992px) and (max-width: 1200px) {

  .banner-four-main-wrapper .inner .title,

  .banner-six-main-wrapper .inner .title {

    font-size: 90px;

    line-height: 100px;

  }

}

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

  .banner-four-main-wrapper .inner .title,

  .banner-six-main-wrapper .inner .title {

    font-size: 50px;

    margin-bottom: 9px;

  }

}

.banner-four-main-wrapper .inner .description,

.banner-six-main-wrapper .inner .description {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-bottom: 50px;

}

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

  .banner-four-main-wrapper .inner .description,

  .banner-six-main-wrapper .inner .description {

    margin-bottom: 20px;

  }

}

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

  .banner-four-main-wrapper .inner .description,

  .banner-six-main-wrapper .inner .description {

    margin-bottom: 20px;

  }

}



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

  Banner Four Main Wrapper

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

.banner-four-main-wrapper {

  position: relative;

  z-index: 1;

  padding: 80px 0;

}

@media (min-width: 992px) {

  .banner-four-main-wrapper {

    padding: 220px 0 199px 0;

  }

}

.banner-four-main-wrapper .row {

  justify-content: space-between;

}

@media (min-width: 1400px) {

  .banner-four-main-wrapper .banner-right-content {

    padding: 0 57px;

  }

}

.banner-four-main-wrapper .banner-right-content .find-me-on {

  margin-top: 33px;

}

.banner-four-main-wrapper .banner-right-content .year-expariance-wrap {

  display: flex;

  align-items: center;

  gap: 20px;

}

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

  .banner-four-main-wrapper .banner-right-content .year-expariance-wrap {

    gap: 10px;

  }

}

.banner-four-main-wrapper .banner-right-content .year-expariance-wrap .title {

  color: var(--color-heading);

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

  font-size: 68px;

  font-weight: 700;

  line-height: 78px;

  margin-bottom: 0;

}

.banner-four-main-wrapper .banner-right-content .year-expariance-wrap .para {

  color: var(--color-heading);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

@media (min-width: 992px) {

  .banner-four-main-wrapper .bg-benner-img-four {

    position: absolute;

    right: 0;

    bottom: 0;

    z-index: -1;

  }

}

.banner-four-main-wrapper .banner-four-right-bg-img {

  position: absolute;

  right: 0;

  top: 0;

  z-index: -2;

}



.rpp-banner-four-area {

  position: relative;

  overflow: hidden;

  z-index: 1;

}

.rpp-banner-four-area .banner-four-left-bg-img {

  position: absolute;

  left: 0;

  top: 0;

  z-index: -1;

}



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

  Banner Five Main Wrapper

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

.banner-five-main-wrapper {

  padding-top: 174px;

}

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

  .banner-five-main-wrapper {

    padding-top: 100px;

    padding-bottom: 80px;

  }

}

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

  .banner-five-main-wrapper {

    padding-top: 100px;

    padding-bottom: 80px;

  }

}

.banner-five-main-wrapper .inner .title {

  color: var(--color-heading);

  text-align: center;

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

  font-weight: 700;

  font-size: 38px;

  line-height: 48px;

  margin-bottom: 0;

  position: relative;

  z-index: 2;

}

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

  .banner-five-main-wrapper .inner .title {

    font-size: 49px;

    line-height: 1.2;

  }

}

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

  .banner-five-main-wrapper .inner .title {

    font-size: 52px;

    line-height: 1.2;

  }

}

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

  .banner-five-main-wrapper .inner .title {

    font-size: 40px;

    line-height: 56px;

  }

}

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

  .banner-five-main-wrapper .inner .title {

    font-size: 26px;

    line-height: 38px;

  }

}

.banner-five-main-wrapper .bg-benner-img-five {

  position: relative;

  z-index: 1;

  display: flex;

  justify-content: center;

}

.banner-five-main-wrapper .bg-benner-img-five::before {

  content: " ";

  position: absolute;

  width: 100%;

  height: 300px;

  bottom: 0;

  z-index: -1;

  background: linear-gradient(180deg, #FF494A 0%, rgba(255, 73, 74, 0) 100%);

  border-radius: 291.5px 291.5px 0px 0px;

}

@media (min-width: 400px) {

  .banner-five-main-wrapper .bg-benner-img-five::before {

    height: 482px;

  }

}

.banner-five-main-wrapper .bg-benner-img-five img {

  width: 76%;

  margin: auto;

}

.banner-five-main-wrapper .banner-left-content .banner-counter ul {

  display: flex;

  gap: 10px;

  flex-wrap: wrap;

}

@media (min-width: 992px) {

  .banner-five-main-wrapper .banner-left-content .banner-counter ul {

    display: inherit;

  }

}

.banner-five-main-wrapper .banner-left-content .banner-counter ul li {

  margin: 0;

}

@media (min-width: 992px) {

  .banner-five-main-wrapper .banner-left-content .banner-counter ul li {

    margin-bottom: 76px;

  }

}

.banner-five-main-wrapper .banner-left-content .banner-counter ul li:last-child {

  margin-bottom: 0;

}

.banner-five-main-wrapper .banner-left-content .banner-counter ul li .banner-counter-card .title {

  color: var(--color-heading);

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

  font-size: 26px;

  line-height: 36px;

  font-weight: 700;

  text-transform: capitalize;

  margin-bottom: 4px;

}

@media (min-width: 576px) {

  .banner-five-main-wrapper .banner-left-content .banner-counter ul li .banner-counter-card .title {

    font-size: 48px;

    line-height: 60px;

  }

}

.banner-five-main-wrapper .banner-left-content .banner-counter ul li .banner-counter-card .para {

  color: var(--color-gray);

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

  font-weight: 400;

  font-size: 13px;

  line-height: 23px;

}

@media (min-width: 576px) {

  .banner-five-main-wrapper .banner-left-content .banner-counter ul li .banner-counter-card .para {

    font-size: 16px;

    line-height: 30px;

  }

}

.banner-five-main-wrapper .banner-right-content .banner-contact-info .contact-info {

  margin-bottom: 20px;

  background: transparent;

  justify-content: flex-end;

  align-items: flex-end;

  padding: 0;

}

@media (min-width: 1400px) {

  .banner-five-main-wrapper .banner-right-content .banner-contact-info .contact-info {

    margin-bottom: 90px;

  }

}

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

  .banner-five-main-wrapper .banner-right-content .banner-contact-info .contact-info {

    justify-content: flex-start;

    align-items: flex-start;

  }

}

.banner-five-main-wrapper .banner-right-content .banner-contact-info .contact-info:last-child {

  margin-bottom: 0;

}

.banner-five-main-wrapper .banner-right-content .banner-contact-info .contact-info .title {

  color: var(--color-heading);

  text-align: right;

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

  font-size: 24px;

  font-weight: 700;

  line-height: 30px;

  margin-bottom: 13px;

}

.banner-five-main-wrapper .banner-right-content .banner-contact-info .contact-info .para {

  color: var(--color-gray);

  text-align: right;

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-bottom: 8px;

}

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

  .banner-five-main-wrapper .banner-right-content .banner-contact-info .contact-info .para {

    text-align: left;

  }

}

.banner-five-main-wrapper .banner-right-content .banner-contact-info .contact-info .para:last-child {

  margin-bottom: 0;

}



.rpp-banner-five-area {

  position: relative;

  overflow: hidden;

  z-index: 1;

  background-color: #0F0F0F;

}

.rpp-banner-five-area .banner-shape-img-bg {

  position: absolute;

  bottom: 0;

  left: 0;

  z-index: -1;

  width: 100%;

  top: 0;

  right: 0;

}



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

  Banner Six Main Wrapper

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

.rpp-banner-six-area {

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

  position: relative;

  z-index: 1;

  overflow: hidden;

}

.rpp-banner-six-area .bg-left-shape {

  position: absolute;

  left: 0;

  top: 0;

  z-index: -1;

}



.banner-six-main-wrapper {

  padding: 80px 0;

}

@media (min-width: 992px) {

  .banner-six-main-wrapper {

    padding-top: 233px;

    padding-bottom: 136px;

  }

}



.bg-benner-img-six {

  display: flex;

  justify-content: center;

  align-items: center;

  position: relative;

}

.bg-benner-img-six img {

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

  border-radius: 100%;

}

.bg-benner-img-six::after {

  content: url("../images/banner/banner-six-shape.png");

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%) rotate(0deg);

  animation: banner-cycle-animation 50s linear infinite;

  display: none;

}

@media (min-width: 1400px) {

  .bg-benner-img-six::after {

    display: block;

  }

}

@keyframes banner-cycle-animation {

  from {

    transform: translate(-50%, -50%) rotate(0deg);

  }

  to {

    transform: translate(-50%, -50%) rotate(360deg);

  }

}



.rpp-banner-five-area .banner-shape-img-bg img {

  height: 100%;

  width: 100%;

}



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

  Find Me On

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

.find-me-on {

  margin-top: 60px;

}

.find-me-on .find-me-on-title {

  color: var(--color-heading);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-bottom: 10px;

}



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

  Text Para Doc Wrap

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

.text-para-doc-wrap {

  position: relative;

}

.text-para-doc-wrap .text-para-documents {

  color: var(--color-heading);

  text-align: center;

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

  font-weight: 700;

}

@media (min-width: 576px) {

  .text-para-doc-wrap .text-para-documents {

    font-size: 40px;

    line-height: 1.45;

  }

}

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

  .text-para-doc-wrap .text-para-documents {

    font-size: 40px;

  }

}

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

  .text-para-doc-wrap .text-para-documents {

    font-size: 25px;

    line-height: 1.5;

  }

}

.text-para-doc-wrap .text-para-documents span {

  color: var(--color-primary);

}

.text-para-doc-wrap .right-bg-text-para {

  position: absolute;

  right: -150px;

  top: 0;

  display: none;

  pointer-events: none;

}

@media (min-width: 1200px) {

  .text-para-doc-wrap .right-bg-text-para {

    display: block;

  }

}

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

  .text-para-doc-wrap .right-bg-text-para {

    right: 0;

  }

}

.text-para-doc-wrap .left-bg-text-para {

  position: absolute;

  left: -150px;

  top: 0;

  display: none;

  pointer-events: none;

}

@media (min-width: 1200px) {

  .text-para-doc-wrap .left-bg-text-para {

    display: block;

  }

}

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

  .text-para-doc-wrap .left-bg-text-para {

    left: 0;

  }

}



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

  Banner Three Main Wrapper

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

.banner-three-main-wrapper {

  position: relative;

  padding: 80px 0;

  display: flex;

  flex-direction: column-reverse;

}

@media (min-width: 992px) {

  .banner-three-main-wrapper {

    padding-top: 250px;

    padding-bottom: 250px;

  }

}

@media (min-width: 1200px) {

  .banner-three-main-wrapper {

    padding-top: 300px;

    padding-bottom: 358px;

  }

}

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

  .banner-three-main-wrapper {

    padding-bottom: 0;

  }

}

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

  .banner-three-main-wrapper {

    padding-bottom: 0;

  }

}

.banner-three-main-wrapper .row {

  justify-content: space-between;

}

.banner-three-main-wrapper .banner-right-content {

  position: relative;

  z-index: 2;

}

.banner-three-main-wrapper .banner-right-content .about-me .title {

  color: var(--color-heading);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

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

  .banner-three-main-wrapper .banner-right-content .about-me .title {

    margin-bottom: 4px;

  }

}

.banner-three-main-wrapper .banner-right-content .about-me .para {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

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

  .banner-three-main-wrapper .banner-right-content .about-me .para {

    width: 68%;

  }

}

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

  .banner-three-main-wrapper .banner-right-content .about-me .para {

    width: 80%;

  }

}

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

  .banner-three-main-wrapper .banner-right-content .about-me .para {

    width: 100%;

  }

}

.banner-three-main-wrapper .banner-right-content .about-me .para span {

  color: var(--color-primary);

}

.banner-three-main-wrapper .banner-right-content .find-me-on {

  margin-top: 11px;

}

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

  .banner-three-main-wrapper .inner {

    padding-top: 40px;

  }

}

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

  .banner-three-main-wrapper .inner {

    padding-top: 30px;

  }

}

.banner-three-main-wrapper .inner .sub-title {

  color: var(--color-heading);

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

  font-size: 28px;

  font-weight: 700;

  line-height: 38px;

  text-transform: uppercase;

}

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

  .banner-three-main-wrapper .inner .sub-title {

    font-size: 20px;

  }

}

.banner-three-main-wrapper .inner .title {

  color: var(--color-heading);

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

  font-weight: 700;

  font-size: 38px;

  line-height: 48px;

}

@media (min-width: 1268px) {

  .banner-three-main-wrapper .inner .title {

    font-size: 90px;

    line-height: 115%;

  }

}

@media (min-width: 992px) and (max-width: 1120px) {

  .banner-three-main-wrapper .inner .title {

    font-size: 64px;

    line-height: 1.2;

  }

}

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

  .banner-three-main-wrapper .inner .title {

    font-size: 65px;

    line-height: 115%;

    margin-bottom: 12px;

  }

}

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

  .banner-three-main-wrapper .inner .title {

    margin-bottom: 10px;

  }

}

.banner-three-main-wrapper .bg-benner-img-three {

  width: 100%;

  position: relative;

}

.banner-three-main-wrapper .bg-benner-img-three img {

  width: 100%;

}

@media (min-width: 992px) {

  .banner-three-main-wrapper .bg-benner-img-three::before {

    content: " ";

    position: absolute;

    left: -100px;

    bottom: -50px;

    width: 939px;

    height: 800px;

    background: linear-gradient(180deg, rgba(7, 7, 7, 0) 13.58%, #080808 92.06%);

    filter: blur(50px);

    z-index: 1;

  }

}

@media (min-width: 992px) {

  .banner-three-main-wrapper .bg-benner-img-three {

    position: absolute;

    top: 50%;

    left: 50%;

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

    z-index: 0;

    width: inherit;

  }

}

.banner-three-main-wrapper .texts-one {

  position: absolute;

  bottom: 5%;

  left: 10%;

  -webkit-text-stroke: 1.25px var(--color-gray);

  color: transparent;

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

  font-size: 212.855px;

  font-weight: 700;

  line-height: 115%;

  z-index: -1;

}

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

  .banner-three-main-wrapper .texts-one {

    bottom: 20%;

    font-size: 100px;

  }

}

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

  .banner-three-main-wrapper .texts-one {

    bottom: 50%;

    font-size: 100px;

    z-index: 2;

  }

}

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

  .banner-three-main-wrapper .texts-one {

    bottom: 50%;

    font-size: 80px;

    z-index: 2;

    display: none;

  }

}

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

  .banner-three-main-wrapper .texts-one {

    bottom: 45%;

    font-size: 70px;

    z-index: 2;

  }

}

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

  .banner-three-main-wrapper .texts-one {

    display: none;

  }

}

.banner-three-main-wrapper .texts-two {

  position: absolute;

  bottom: 0;

  left: 20%;

  -webkit-text-stroke: 1.25px #FF494A;

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

  font-size: 150px;

  font-weight: 700;

  line-height: 115%;

  color: transparent;

}

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

  .banner-three-main-wrapper .texts-two {

    bottom: 5%;

    font-size: 100px;

  }

}

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

  .banner-three-main-wrapper .texts-two {

    bottom: 40%;

    font-size: 100px;

    z-index: 2;

  }

}

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

  .banner-three-main-wrapper .texts-two {

    bottom: 45%;

    font-size: 80px;

    z-index: 2;

  }

}

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

  .banner-three-main-wrapper .texts-two {

    bottom: 45%;

    font-size: 70px;

    z-index: 2;

  }

}

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

  .banner-three-main-wrapper .texts-two {

    display: none;

  }

}



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

  Up Down Animation Start

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

.up-down {

  -webkit-animation: up-down 1s infinite alternate;

  animation: up-down 1s infinite alternate;

}



@-webkit-keyframes up-down {

  0% {

    transform: translateY(0);

  }

  100% {

    transform: translateY(-10px);

  }

}

@keyframes up-down {

  0% {

    transform: translateY(0);

  }

  100% {

    transform: translateY(-10px);

  }

}

.up-down-2 {

  -webkit-animation: up-down-2 0.9s infinite alternate;

  animation: up-down-2 0.9s infinite alternate;

}



@-webkit-keyframes up-down-2 {

  0% {

    transform: translateY(-10px);

  }

  100% {

    transform: translateY(0);

  }

}

@keyframes up-dow-2 {

  0% {

    transform: translateY(-10px);

  }

  100% {

    transform: translateY(0);

  }

}

.cd-headline.rotate-1 b {

  opacity: 0;

  -webkit-transform-origin: 50% 100%;

  -moz-transform-origin: 50% 100%;

  -ms-transform-origin: 50% 100%;

  -o-transform-origin: 50% 100%;

  transform-origin: 50% 100%;

  -webkit-transform: rotateX(180deg);

  -moz-transform: rotateX(180deg);

  -ms-transform: rotateX(180deg);

  -o-transform: rotateX(180deg);

  transform: rotateX(180deg);

}



.cd-headline.rotate-1 b.is-visible {

  opacity: 1;

  -webkit-transform: rotateX(0deg);

  -moz-transform: rotateX(0deg);

  -ms-transform: rotateX(0deg);

  -o-transform: rotateX(0deg);

  transform: rotateX(0deg);

  -webkit-animation: cd-rotate-1-in 1.2s;

  -moz-animation: cd-rotate-1-in 1.2s;

  animation: cd-rotate-1-in 1.2s;

}



.cd-headline.rotate-1 b.is-hidden {

  -webkit-transform: rotateX(180deg);

  -moz-transform: rotateX(180deg);

  -ms-transform: rotateX(180deg);

  -o-transform: rotateX(180deg);

  transform: rotateX(180deg);

  -webkit-animation: cd-rotate-1-out 1.2s;

  -moz-animation: cd-rotate-1-out 1.2s;

  animation: cd-rotate-1-out 1.2s;

}



@-webkit-keyframes cd-rotate-1-in {

  0% {

    -webkit-transform: rotateX(180deg);

    opacity: 0;

  }

  35% {

    -webkit-transform: rotateX(120deg);

    opacity: 0;

  }

  65% {

    opacity: 0;

  }

  100% {

    -webkit-transform: rotateX(360deg);

    opacity: 1;

  }

}

@keyframes cd-rotate-1-in {

  0% {

    -webkit-transform: rotateX(180deg);

    -moz-transform: rotateX(180deg);

    -ms-transform: rotateX(180deg);

    -o-transform: rotateX(180deg);

    transform: rotateX(180deg);

    opacity: 0;

  }

  35% {

    -webkit-transform: rotateX(120deg);

    -moz-transform: rotateX(120deg);

    -ms-transform: rotateX(120deg);

    -o-transform: rotateX(120deg);

    transform: rotateX(120deg);

    opacity: 0;

  }

  65% {

    opacity: 0;

  }

  100% {

    -webkit-transform: rotateX(360deg);

    -moz-transform: rotateX(360deg);

    -ms-transform: rotateX(360deg);

    -o-transform: rotateX(360deg);

    transform: rotateX(360deg);

    opacity: 1;

  }

}

@-webkit-keyframes cd-rotate-1-out {

  0% {

    -webkit-transform: rotateX(0deg);

    opacity: 1;

  }

  35% {

    -webkit-transform: rotateX(-40deg) scaleY(1.1);

    opacity: 1;

  }

  65% {

    opacity: 0;

  }

  100% {

    -webkit-transform: rotateX(180deg);

    opacity: 0;

  }

}

@-moz-keyframes cd-rotate-1-out {

  0% {

    -moz-transform: rotateX(0deg);

    opacity: 1;

  }

  35% {

    -webkit-transform: rotateX(-40deg) scaleY(1.1);

    opacity: 1;

  }

  65% {

    opacity: 0;

  }

  100% {

    -moz-transform: rotateX(180deg);

    opacity: 0;

  }

}

@keyframes cd-rotate-1-out {

  0% {

    -webkit-transform: rotateX(0deg);

    -moz-transform: rotateX(0deg);

    -ms-transform: rotateX(0deg);

    -o-transform: rotateX(0deg);

    transform: rotateX(0deg);

    opacity: 1;

  }

  35% {

    transform: rotateX(-40deg) scaleY(1.1);

    opacity: 1;

  }

  65% {

    opacity: 0;

  }

  100% {

    -webkit-transform: rotateX(180deg);

    -moz-transform: rotateX(180deg);

    -ms-transform: rotateX(180deg);

    -o-transform: rotateX(180deg);

    transform: rotateX(180deg);

    opacity: 0;

  }

}

.tmp-contact-about-inner .download-icon.tmp-btn i {

  top: 0px;

  font-size: 16px;

}



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

  .index-nine .tab-content-overlay-to-top {

    margin-top: 0;

  }

}



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

  .index-ten .tab-content-overlay-to-top {

    margin-top: 0;

  }

}

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

  .index-ten .tmp-contact-about-inner .thumbnail img {

    max-width: 300px;

  }

}

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

  .index-ten .tmp-contact-about-inner .thumbnail img {

    max-width: 280px;

  }

}



.tmp-white-version .loader-bg-pattern-wrapper {

  z-index: 0;

}

.tmp-white-version .loader-bg-pattern-wrapper {

  position: absolute;

  left: 50%;

  z-index: 0;

  top: 34.1%;

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

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern {

  --size: 450px;

  --duration: 4s;

  --logo-color: rgb(214, 214, 214);

  --background: linear-gradient(

  0deg,

  rgba(209, 209, 209, 0.2) 0%,

  rgba(206, 206, 206, 0.2) 100%

  );

  height: var(--size);

  aspect-ratio: 1;

  position: relative;

}

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

  .tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:420px;

  }

}

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

  .tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:400px;

  }

}

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

  .tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:320px;

  }

}

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

  .tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:220px ;

  }

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern .box {

  position: absolute;

  background: rgba(182, 182, 182, 0.15);

  background: var(--background);

  border-radius: 50%;

  border-top: 1px solid rgb(206, 206, 206);

  box-shadow: rgba(160, 160, 160, 0.123) 0px 10px 10px 0px;

  backdrop-filter: blur(5px);

  animation: ripple-2 var(--duration) infinite ease-in-out;

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(1) {

  inset: 40%;

  z-index: 99;

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(2) {

  inset: 30%;

  z-index: 98;

  border-color: rgba(100, 100, 100, 0.8);

  animation-delay: 0.2s;

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(3) {

  inset: 20%;

  z-index: 97;

  border-color: rgba(100, 100, 100, 0.6);

  animation-delay: 0.4s;

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(4) {

  inset: 10%;

  z-index: 96;

  border-color: rgba(203, 203, 203, 0.4);

  animation-delay: 0.6s;

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(5) {

  inset: 0%;

  z-index: 95;

  border-color: rgba(100, 100, 100, 0.2);

  animation-delay: 0.8s;

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern .logo {

  position: absolute;

  inset: 0;

  display: grid;

  place-content: center;

  padding: 30%;

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern .logo svg {

  fill: var(--logo-color);

  width: 100%;

  animation: color-change var(--duration) infinite ease-in-out;

}

@keyframes ripple-2 {

  0% {

    transform: scale(1);

    box-shadow: rgba(124, 124, 124, 0.3) 0px 10px 10px 0px;

  }

  50% {

    transform: scale(1.3);

    box-shadow: rgba(124, 124, 124, 0.3) 0px 30px 20px 0px;

  }

  100% {

    transform: scale(1);

    box-shadow: rgba(128, 128, 128, 0.3) 0px 10px 10px 0px;

  }

}

@keyframes color-change {

  0% {

    fill: var(--logo-color);

  }

  50% {

    fill: white;

  }

  100% {

    fill: var(--logo-color);

  }

}



.banner-twelve-area {

  position: relative;

  z-index: 1;

  background-image: none !important;

  background: linear-gradient(90deg, rgb(6, 6, 6) 0%, rgba(0, 0, 0, 0) 100%) !important;

}

.banner-twelve-area #particles-js {

  position: absolute;

  height: 100%;

  width: 100%;

  z-index: -1;

  top: 0;

  left: 0;

  pointer-events: none;

}



.tmp-white-version.home-12 .banner-twelve-area {

  background: linear-gradient(359deg, rgb(255, 255, 255) 0%, rgba(0, 0, 0, 0) 100%) !important;

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper {

  position: absolute;

  left: 50%;

  z-index: -1;

  top: 34.1%;

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

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern {

  --size: 450px;

  --duration: 4s;

  --logo-color: rgb(214, 214, 214);

  --background: linear-gradient(

  0deg,

  rgba(223, 223, 223, 0.2) 0%,

  rgba(226, 226, 226, 0.2) 100%

  );

  height: var(--size);

  aspect-ratio: 1;

  position: relative;

}

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

  .tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:420px;

  }

}

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

  .tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:400px;

  }

}

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

  .tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:320px;

  }

}

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

  .tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:220px ;

  }

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern .box {

  position: absolute;

  background: rgba(223, 223, 223, 0.15);

  background: rgba(247, 247, 247, 0.3411764706);

  border-radius: 50%;

  border-top: 1px solid rgb(206, 206, 206);

  box-shadow: rgba(216, 216, 216, 0.123) 0px 10px 10px 0px;

  backdrop-filter: blur(5px);

  animation: ripple-2 var(--duration) infinite ease-in-out;

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(1) {

  inset: 40%;

  z-index: 99;

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(2) {

  inset: 30%;

  z-index: 98;

  border-color: rgba(100, 100, 100, 0.8);

  animation-delay: 0.2s;

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(3) {

  inset: 20%;

  z-index: 97;

  border-color: rgba(100, 100, 100, 0.6);

  animation-delay: 0.4s;

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(4) {

  inset: 10%;

  z-index: 96;

  border-color: rgba(203, 203, 203, 0.4);

  animation-delay: 0.6s;

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(5) {

  inset: 0%;

  z-index: 95;

  border-color: rgba(192, 192, 192, 0.2);

  animation-delay: 0.8s;

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern .logo {

  position: absolute;

  inset: 0;

  display: grid;

  place-content: center;

  padding: 30%;

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern .logo svg {

  fill: var(--logo-color);

  width: 100%;

  animation: color-change var(--duration) infinite ease-in-out;

}

@keyframes ripple-2 {

  0% {

    transform: scale(1);

    box-shadow: rgba(185, 185, 185, 0.3) 0px 10px 10px 0px;

  }

  50% {

    transform: scale(1.3);

    box-shadow: rgba(185, 185, 185, 0.3) 0px 30px 20px 0px;

  }

  100% {

    transform: scale(1);

    box-shadow: rgba(185, 185, 185, 0.3) 0px 10px 10px 0px;

  }

}

@keyframes color-change {

  0% {

    fill: var(--logo-color);

  }

  50% {

    fill: white;

  }

  100% {

    fill: var(--logo-color);

  }

}

.tmp-white-version.home-12 .header-left-sticky {

  background: #fff;

}

.tmp-white-version.home-12 .header-left-sticky .inner-wrapper::after {

  display: none;

}

.tmp-white-version.home-12 .tmp-right-demo .demo-button .text {

  color: var(--color-primary);

}



.tmp-white-version.index-ten .tmp-contact-about-inner::after {

  display: none;

}



@media only screen and (min-width: 1600px) and (max-width: 1919px) {

  .index-seven .tmp-banner-one-area {

    background-image: none !important;

  }

}

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

  .index-seven .tmp-banner-one-area {

    background-image: none !important;

  }

}

.index-seven .tmp-banner-one-area {

  position: relative;

}

.index-seven .tmp-banner-one-area #particles-js {

  position: absolute;

  height: 100%;

  width: 100%;

  z-index: 0;

  top: 0;

  left: 0;

  pointer-events: none;

}



.tmp-breadcrumb-image {

  position: relative;

  z-index: -1;

}

.tmp-breadcrumb-image #particles-js {

  position: absolute;

  height: 100%;

  width: 100%;

  z-index: 0;

  top: 0;

  left: 0;

  pointer-events: none;

}



.tmp-banner-one-area.style-4 {

  position: relative;

  z-index: 1;

}

.tmp-banner-one-area.style-4 #particles-js {

  position: absolute;

  height: 100%;

  width: 100%;

  z-index: -1;

  top: 0;

  left: 0;

  pointer-events: none;

}



.profile-image-1-personal-left-fixed {

  position: sticky;

  top: 110px;

  left: 80px;

  bottom: 80px;

  overflow: hidden;

}

.profile-image-1-personal-left-fixed .inner-content {

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

  z-index: 1;

  background: #010d16;

  position: relative;

  padding: 30px;

  position: relative;

  overflow: hidden;

  z-index: 1;

  border-radius: 15px;

}

.profile-image-1-personal-left-fixed img {

  width: 100%;

}

.profile-image-1-personal-left-fixed .social-default {

  display: flex;

  flex-wrap: wrap;

  padding: 0;

  margin: 0;

  list-style: none;

  justify-content: center;

  margin: -8px;

  position: absolute;

  left: 60px;

  top: 60px;

}

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

  .profile-image-1-personal-left-fixed .social-default {

    left: 45px;

    top: 45px;

  }

}

.profile-image-1-personal-left-fixed .social-default li {

  margin: 8px;

}

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

  .profile-image-1-personal-left-fixed .social-default li {

    margin: 4px;

  }

}

.profile-image-1-personal-left-fixed .social-default li a {

  width: 48px;

  background-color: #232324;

  height: 48px;

  line-height: 43px;

  text-align: center;

  display: inline-block;

  border-radius: 100%;

  transition: 0.3s;

  color: #fff;

  z-index: 2;

  position: relative;

  display: flex;

  align-items: center;

  justify-content: center;

}

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

  .profile-image-1-personal-left-fixed .social-default li a {

    width: 35px;

    height: 35px;

  }

}

.profile-image-1-personal-left-fixed .social-default li a::after {

  position: absolute;

  content: "";

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  z-index: -1;

  background: var(--icon-gradient);

  transform: scale(0.5);

  opacity: 0;

  transition: 0.3s;

  border-radius: 100%;

}

.profile-image-1-personal-left-fixed .social-default li a:hover::after {

  transform: scale(1);

  opacity: 1;

}

.profile-image-1-personal-left-fixed .title {

  position: absolute;

  left: 60px;

  bottom: 50px;

  font-size: 44px;

  z-index: 5;

  line-height: 1.4;

  font-weight: 400;

}

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

  .profile-image-1-personal-left-fixed .title {

    font-size: 32px;

  }

}

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

  .profile-image-1-personal-left-fixed .title {

    font-size: 22px;

  }

}

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

  .profile-image-1-personal-left-fixed .title {

    left: 45px;

    bottom: 45px;

  }

}

.profile-image-1-personal-left-fixed .title .header-caption {

  color: var(--color-primary);

}



.banner-twelve-area.with-bg-image {

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

  background-position: center !important;

  background-size: cover !important;

  background-repeat: no-repeat !important;

  min-height: 100vh;

}

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

  .banner-twelve-area.with-bg-image {

    min-height: 600px;

  }

}

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

  .banner-twelve-area.with-bg-image {

    min-height: 520px;

  }

}

.banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .title {

  font-size: 84px;

}

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

  .banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .title {

    font-size: 60px;

  }

}

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

  .banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .title {

    font-size: 54px;

  }

}

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

  .banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .title {

    font-size: 44px;

  }

}

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

  .banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .title {

    font-size: 32px;

  }

}

.banner-twelve-area.with-bg-image .social-share-style-1 {

  justify-content: center;

  display: flex;

  margin-top: 40px;

}

.banner-twelve-area.with-bg-image .social-share-style-1 a {

  background: #141414;

}



.model-style-banner {

  position: relative;

}

.model-style-banner .social-area-wrapper-varticle {

  position: absolute;

  left: 60px;

  top: 63%;

}

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

  .model-style-banner .social-area-wrapper-varticle {

    top: auto;

    bottom: 20px;

  }

}

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

  .model-style-banner .social-area-wrapper-varticle {

    top: auto;

    bottom: 20px;

  }

}

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

  .model-style-banner .social-area-wrapper-varticle {

    position: absolute;

    left: 50%;

    transform: translateX(-50%);

  }

}

.model-style-banner .social-area-wrapper-varticle::after {

  position: absolute;

  left: 50%;

  height: 85px;

  width: 2px;

  background: rgba(255, 255, 255, 0.062745098);

  content: "";

  transform: translateX(-50%);

  bottom: -100px;

}

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

  .model-style-banner .social-area-wrapper-varticle::after {

    display: none;

  }

}

.model-style-banner .social-area-wrapper-varticle ul {

  padding: 0;

  margin: 0;

  display: flex;

  align-items: center;

  flex-direction: column;

  gap: 15px;

}

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

  .model-style-banner .social-area-wrapper-varticle ul {

    flex-direction: row-reverse;

  }

}

.model-style-banner .social-area-wrapper-varticle ul li {

  margin: 0;

}

.model-style-banner .social-area-wrapper-varticle ul li a {

  width: 40px;

  height: 40px;

  background: rgba(255, 255, 255, 0.062745098);

  position: relative;

  color: #fff;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

}

.model-style-banner .social-area-wrapper-varticle ul li a::after {

  content: " ";

  position: absolute;

  width: 100%;

  height: 100%;

  border-radius: 100px;

  background: var(--color-primary);

  opacity: 0.06;

  transform: scale(0);

  transition: all 0.4s ease;

  z-index: -1;

}

.model-style-banner .social-area-wrapper-varticle ul li a:hover::after {

  opacity: 1;

  transform: scale(1);

}



.model-style-banner.with-instructor .hero-bg-video {

  position: absolute;

  top: 0;

  right: 0;

  left: 0;

  bottom: 0;

  width: 100%;

  height: 100%;

  z-index: -2;

}

.model-style-banner.with-instructor .hero-bg-video video {

  width: 100%;

  height: 100%;

  object-fit: cover;

}

.model-style-banner.with-instructor .banner-model-15 {

  text-align: center;

  max-width: 100%;

  margin: auto;

}

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

  .model-style-banner.with-instructor .banner-model-15 {

    max-width: 100%;

  }

}

.model-style-banner.with-instructor .banner-model-15 p.disc {

  font-size: 22px;

  text-transform: uppercase;

  color: #fff;

}

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

  .model-style-banner.with-instructor .banner-model-15 p.disc {

    font-size: 16px;

  }

}

.model-style-banner.with-instructor .banner-model-15 .title {

  font-size: 150px !important;

  margin-top: 0;

  margin-bottom: 0;

  text-transform: uppercase;

}

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

  .model-style-banner.with-instructor .banner-model-15 .title {

    font-size: 120px !important;

  }

}

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

  .model-style-banner.with-instructor .banner-model-15 .title {

    font-size: 100px !important;

  }

}

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

  .model-style-banner.with-instructor .banner-model-15 .title {

    font-size: 70px !important;

  }

}

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

  .model-style-banner.with-instructor .banner-model-15 .title {

    font-size: 54px !important;

  }

}

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

  .model-style-banner.with-instructor .banner-model-15 .title {

    font-size: 54px !important;

  }

}



.banner-right-thumb-left-content {

  padding-top: 0;

}

.banner-right-thumb-left-content .pre-title {

  font-size: 18px;

  text-transform: uppercase;

  display: block;

  margin-bottom: 18px;

  font-weight: 700;

  letter-spacing: 1px;

  color: var(--color-primary);

}

.banner-right-thumb-left-content .title {

  margin-bottom: 35px;

  font-size: 64px;

}

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

  .banner-right-thumb-left-content .title {

    margin-bottom: 14px;

    font-size: 44px;

  }

}

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

  .banner-right-thumb-left-content .title {

    margin-bottom: 14px;

    font-size: 32px;

  }

}

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

  .banner-right-thumb-left-content .title {

    font-size: 28px;

  }

}

.banner-right-thumb-left-content .title span {

  color: var(--color-primary);

}

.banner-right-thumb-left-content p.disc {

  margin-bottom: 25px;

  max-width: 78%;

}

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

  .banner-right-thumb-left-content p.disc {

    max-width: 100%;

  }

}

.banner-right-thumb-left-content .find-me-on {

  margin-top: 45px;

}



.banner-right-thumbnail-area .thumbnail-right-inner-main-image {

  padding: 25px;

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

  border-radius: 20px;

}

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

  .banner-right-thumbnail-area .thumbnail-right-inner-main-image {

    padding: 15px;

  }

}

.banner-right-thumbnail-area .thumbnail-right-inner-main-image img {

  position: relative;

  z-index: 50 !important;

}



.box-body {

  margin: 25px;

  background: #ee0979;

  background: -webkit-linear-gradient(to right, #ff6a00, #ee0979);

  background: var(--gradient-box) !important;

  position: relative;

}

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

  .box-body {

    margin: 10px;

  }

}

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

  .box-body {

    margin: 10px;

  }

}

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

  .box-body {

    margin: 10px;

  }

}

.box-body .main-wrapper-inner {

  background: var(--color-secondary);

}

.box-body .banner-right-thumbnail-area .thumbnail-right-inner-main-image {

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

}

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

  .box-body .banner-right-thumbnail-area .thumbnail-right-inner-main-image {

    padding: 15px;

  }

}



.box-body .header--sticky.sticky {

  top: 0;

  left: 25px;

  right: 25px;

  width: auto;

  transform: none;

}



.skill-social-wrapper {

  display: flex;

  align-items: center;

  gap: 120px;

}

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

  .skill-social-wrapper {

    flex-direction: column;

    gap: 30px;

    align-items: flex-start;

  }

  .skill-social-wrapper .find-me-on {

    margin-top: 0;

  }

  .skill-social-wrapper .find-me-on:first-child {

    margin-top: 0;

  }

}

.skill-social-wrapper .find-me-on-title {

  text-transform: uppercase;

}



.best-skill-social a {

  transition: 0.3s;

}

.best-skill-social a img {

  max-width: 35px;

  max-height: 23px;

}

.best-skill-social a::after {

  display: none;

}

.best-skill-social a:hover {

  transform: translateY(-3px);

}



.banner-area-one-main-demo {

  position: relative;

}

.banner-area-one-main-demo .separator-animated-border.border-top-footer {

  bottom: auto;

  top: 76px;

  width: 100%;

}



@keyframes skew-hi {

  0% {

    transform: rotate(0deg);

  }

  25% {

    transform: rotate(5deg);

  }

  50% {

    transform: rotate(0eg);

  }

  75% {

    transform: rotate(-5deg);

  }

  100% {

    transform: rotate(0deg);

  }

}

.banner-main-demo-inner-content {

  margin: auto;

  text-align: center;

}

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

  .banner-main-demo-inner-content {

    padding-top: 60px;

  }

}

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

  .banner-main-demo-inner-content {

    padding-top: 60px;

  }

}

.banner-main-demo-inner-content span.top-intro {

  display: block;

  font-size: 36px;

  font-weight: 500;

}

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

  .banner-main-demo-inner-content span.top-intro {

    font-size: 24px;

  }

}

.banner-main-demo-inner-content span.top-intro span {

  color: var(--color-primary);

  font-weight: 700;

}

.banner-main-demo-inner-content span.top-intro img {

  max-width: 45px;

  animation: skew-hi 1s linear infinite;

}

.banner-main-demo-inner-content .main-demo {

  position: relative;

  z-index: 1;

}

.banner-main-demo-inner-content .absolute-designation h2 {

  position: absolute;

  font-weight: 700;

}

.banner-main-demo-inner-content .absolute-designation .up {

  top: 65%;

  left: 50%;

  transform: translateX(-50%);

  font-size: 110px;

  z-index: 3;

}

@media only screen and (min-width: 1600px) and (max-width: 1919px) {

  .banner-main-demo-inner-content .absolute-designation .up {

    font-size: 94px;

  }

}

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

  .banner-main-demo-inner-content .absolute-designation .up {

    font-size: 77px;

  }

}

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

  .banner-main-demo-inner-content .absolute-designation .up {

    font-size: 70px;

    min-width: max-content;

  }

}

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

  .banner-main-demo-inner-content .absolute-designation .up {

    font-size: 44px;

  }

}

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

  .banner-main-demo-inner-content .absolute-designation .up {

    font-size: 36px;

  }

}

.banner-main-demo-inner-content .absolute-designation .down {

  z-index: -1;

  top: 36%;

  left: 50%;

  transform: translateX(-50%);

  font-size: 100px;

  -webkit-text-stroke-width: 1px;

  stroke-width: 1px;

  -webkit-text-stroke-color: #fff;

  stroke: #fff;

  -webkit-text-fill-color: transparent;

}

@media only screen and (min-width: 1600px) and (max-width: 1919px) {

  .banner-main-demo-inner-content .absolute-designation .down {

    font-size: 94px;

  }

}

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

  .banner-main-demo-inner-content .absolute-designation .down {

    font-size: 84px;

  }

}

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

  .banner-main-demo-inner-content .absolute-designation .down {

    font-size: 70px;

    min-width: max-content;

  }

}

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

  .banner-main-demo-inner-content .absolute-designation .down {

    font-size: 44px;

  }

}

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

  .banner-main-demo-inner-content .absolute-designation .down {

    font-size: 36px;

  }

}



.video-bg-body {

  position: relative;

}

.video-bg-body .hero-bg-video {

  position: fixed;

  top: 0;

  right: 0;

  left: 0;

  bottom: 0;

  width: 100%;

  height: 100%;

  z-index: -2;

}

.video-bg-body .hero-bg-video video {

  width: 100%;

  height: 100%;

  object-fit: cover;

}

.video-bg-body .hero-bg-video[data-black-overlay="5"]::before {

  z-index: 3;

}



.tmp-banner-circle img {

  z-index: 2;

  max-width: 100%;

}



.tmp-banner-circle .tmp-banner-circle-1 {

  position: absolute;

  top: 20%;

  left: 35%;

  -webkit-animation: services-triangle 5s linear infinite alternate;

  animation: services-triangle 5s linear infinite alternate;

}



.tmp-banner-circle .tmp-banner-circle-2 {

  position: absolute;

  left: 35%;

  top: 65%;

  -webkit-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

  -webkit-animation: services-triangle 6s linear infinite alternate;

  animation: services-triangle 6s linear infinite alternate;

}



.tmp-banner-circle .tmp-banner-circle-3 {

  position: absolute;

  top: 30%;

  right: 32%;

  -webkit-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

  -webkit-animation: services-triangle 7s linear infinite alternate;

  animation: services-triangle 7s linear infinite alternate;

}



.tmp-banner-circle .tmp-banner-circle-4 {

  position: absolute;

  right: 32%;

  bottom: 20%;

  -webkit-animation: services-triangle 8s linear infinite alternate;

  animation: services-triangle 8s linear infinite alternate;

}



@keyframes services-triangle {

  0% {

    -webkit-transform: rotate(0deg) translateX(-50px);

    -moz-transform: rotate(0deg) translateX(-50px);

    -ms-transform: rotate(0deg) translateX(-50px);

    transform: rotate(0deg) translateX(-50px);

  }

  100% {

    -webkit-transform: rotate(360deg) translateY(100px);

    -moz-transform: rotate(360deg) translateY(100px);

    -ms-transform: rotate(360deg) translateY(100px);

    transform: rotate(360deg) translateY(100px);

  }

}

.video-bg-image-bg-green {

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

  background-position: center;

  background-attachment: fixed;

}



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

  Header Top Inner

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

.header-top-inner {

  display: flex;

  justify-content: space-between;

  align-items: flex-end;

  gap: 20px;

  flex-wrap: wrap;

  padding-bottom: 60px;

}

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

  .header-top-inner {

    flex-direction: column;

    align-items: flex-start;

  }

}

.header-top-inner .section-head {

  padding-bottom: 0;

}



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

Section Head

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

.section-head {

  text-align: center;

}

.section-head .section-sm {

  display: inline-flex;

  max-width: 80%;

}

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

  .section-head .section-sm {

    max-width: 100%;

  }

}

@media (min-width: 1200px) {

  .section-head .section-sm {

    max-width: 50%;

  }

}

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

  .section-head .section-sm {

    max-width: 70%;

  }

}

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

  .section-head .section-sm {

    max-width: 90%;

  }

}

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

  .section-head .section-sm {

    max-width: 80%;

  }

}

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

  .section-head .section-sm {

    max-width: 100%;

  }

}

.section-head.pb-40 {

  padding-bottom: 40px;

}

.section-head.pb-0 {

  padding-bottom: 0;

}

.section-head.text-align-left {

  text-align: left;

}

.section-head.section-head-one-side {

  padding-bottom: 22px;

}

.section-head .section-sub-title {

  font-size: 16px;

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

  color: var(--color-primary);

  text-transform: uppercase;

  margin-bottom: 8px;

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

  display: flex;

  align-items: center;

  gap: 7px;

}

.section-head .section-sub-title.color-white {

  color: var(--color-heading);

}

.section-head .section-sub-title img {

  margin-right: 8px;

}

.section-head .section-sub-title span.subtitle {

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

}

.section-head .title {

  color: var(--color-heading);

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

  font-weight: 700;

  margin-bottom: 0;

}



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

  .section-head .title {

    font-size: 28px;

    line-height: 1.4;

      text-align: center;

  }

}

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

  .section-head .title {

    font-size: 22px;

      text-align: center;

  }

}

.section-head .title.color-white {

  color: var(--color-heading);

}

.section-head .description {

  margin-top: 10px;

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 26px;

}

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

  .section-head .description br {

    display: none;

  }

}



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

  Section Head Color White

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

.section-head.color-white {

  text-align: center;

  padding-bottom: 60px;

}

.section-head.color-white .section-sub-title {

  font-size: 16px;

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

  color: var(--color-primary);

  text-transform: uppercase;

}

.section-head.color-white .section-sub-title span.subtitle {

  margin-left: 8px;

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

}

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

  .section-head.color-white .title {

    font-size: 22px;

    line-height: 34px;

  }

}



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

  Section Head

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

.section-head.pb--30 {

  padding-bottom: 30px;

}

.section-head .pre-title {

  border-radius: 0.5rem;

  padding: 6px 14px;

  position: relative;

  overflow: hidden;

  display: flex;

  align-items: center;

  width: max-content;

  font-size: 14px;

  letter-spacing: 0.5px;

  color: var(--color-body);

  font-weight: 500;

}

.section-head .pre-title::before {

  content: "";

  position: absolute;

  inset: 0px;

  border-radius: inherit;

  border: 1px solid transparent;

  background-clip: border-box;

  pointer-events: none;

  background: var(--stroke-gradient-2) border-box;

  z-index: 1;

  -webkit-mask: var(--gradient-none) padding-box, var(--gradient-none);

  -webkit-mask-composite: xor;

  mask: var(--gradient-none) padding-box exclude, var(--gradient-none);

}

.section-head .subtitle {

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

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

    font-size: 29px;

    font-weight: 500;

    line-height: 41px;

    letter-spacing: 1px;

    text-transform: uppercase;

    color: #00d9ff;

}

.section-head .subtitle.color-gradiant {

  background: var(--text-gradient-one);

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

}



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

  Section Head

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

.section-head .section-sub-title.center-title {

  justify-content: center;

}



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

  Custom Title

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

.custom-title {

  color: var(--color-heading);

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

  font-size: 28px;

  font-weight: 700;

  line-height: 42px;

  text-transform: capitalize;

  position: relative;

}

.custom-title.mb-32 {

  margin-bottom: 32px;

}

.custom-title span {

  margin-left: 20px;

}

.custom-title span img {

  opacity: 0.3;

}



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

  Discription Area

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

.discription-area {

  max-width: 400px;

}

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

  .discription-area {

    max-width: 80%;

  }

}

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

  .discription-area {

    max-width: 100%;

  }

}

.discription-area .description {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

.discription-area .description span {

  color: var(--color-primary);

}



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

  Social Link

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

.social-link {

  display: flex;

  gap: 8px;

  flex-wrap: wrap;

}

.social-link a {

  width: 40px;

  height: 40px;

  color: var(--color-heading);

  display: inline-flex;

  position: relative;

  align-items: center;

  justify-content: center;

  transition: all 0.4s ease;

  z-index: 1;

  background: rgba(255, 255, 255, 0.062745098);

  border-radius: 100%;

  font-size: 18px;

}

.social-link a::after {

  content: " ";

  position: absolute;

  width: 100%;

  height: 100%;

  border-radius: 100px;

  background: var(--icon-gradient);

  opacity: 0.06;

  transform: scale(0);

  transition: all 0.4s ease;

  z-index: -1;

}

.social-link a:hover {

  color: #ffffff;

}

.social-link a:hover::after {

  opacity: 1;

  transform: scale(1);

}

.social-link.footer a {

  min-width: 40px;

  min-height: 40px;

}

.social-link.banner {

  gap: 10px;

}

.social-link.banner a {

  border-radius: 500px;

  background: rgba(43, 43, 43, 0.4588235294);

  min-width: 45px;

  min-height: 45px;

  color: var(--color-heading);

  transition: var(--transition);

  opacity: 1;

  backdrop-filter: blur(4px);

}

.social-link.banner a::after {

  content: " ";

  position: absolute;

  width: 100%;

  height: 100%;

  border-radius: 100px;

  background: var(--icon-gradient);

  opacity: 0.06;

  transform: scale(0);

  transition: all 0.4s ease;

  z-index: -1;

}

.social-link.banner a:hover {

  border-color: transparent;

  color: #ffffff;

}

.social-link.banner a:hover::after {

  opacity: 1;

  transform: scale(1);

}



.social-link-inner {

  display: flex;

  align-items: center;

  gap: 16px;

}

.social-link-inner a {

  transition: var(--transition);

}

.social-link-inner a i {

  color: var(--color-gray);

  transition: var(--transition);

}

.social-link-inner a:hover {

  color: var(--color-primary);

}

.social-link-inner a:hover i {

  color: var(--color-primary);

}



.tmp-btn-group {

  margin: -10px;

}

.tmp-btn-group .tmp-btn {

  margin: 10px;

}



.tmp-body-box-pattern {

  position: absolute;

  width: 100%;

  height: 100%;

  z-index: 1;

}

.tmp-body-box-pattern::before {

  content: "";

  position: absolute;

  top: 0;

  bottom: 0;

  left: 0;

  right: 0;

  mix-blend-mode: overlay;

  background-image: linear-gradient(var(--color-white), transparent 1px), linear-gradient(to right, var(--color-white), transparent 1px);

  background-size: 100% 100px, 100px 100%;

  opacity: 0.08;

  width: 100%;

  height: 100%;

  z-index: -1;

  background-attachment: fixed;

}



.right-corner-pattern {

  position: relative;

  overflow: hidden;

  z-index: 1;

}

.right-corner-pattern .right-corner-pattern-inner {

  position: relative;

  z-index: 2;

}

.right-corner-pattern::after {

  content: " ";

  position: absolute;

  right: -450px;

  bottom: -500px;

  min-width: 474px;

  min-height: 474px;

  border-radius: 100px;

  filter: blur(227px);

  z-index: 1;

  background: var(--color-primary);

}



.cv-card-version-2 {

  position: relative;

  z-index: 2;

  padding-top: 100px;

}

.cv-card-version-2 .tab-content-overlay-to-top,

.cv-card-version-2 .tab-wrapper-overlay-to-top {

  margin-top: 0;

}



.tmp-btn {

  padding: 0 30px;

  background: var(--color-primary);

  height: 60px;

  line-height: 60px;

  color: var(--color-white);

  font-size: 16px;

  letter-spacing: 0.5px;

  font-weight: 500;

  display: inline-block;

  position: relative;

  z-index: 1;

  transition: all 0.4s ease-in-out;

  border-radius: 6px;

  border: 0 none;

  outline: none;

  text-decoration: none;

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

  text-transform: capitalize;

}

.tmp-btn.btn-border {

  background: transparent;

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

  color: var(--color-body);

  line-height: 57px;

}

.tmp-btn.btn-border:hover {

  background: var(--color-primary);

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

  color: var(--color-white);

}

.tmp-btn.btn-border.color-white-off {

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

  color: var(--color-white-off);

}

.tmp-btn.btn-border.color-white-off:hover {

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

  color: var(--color-white);

}

.tmp-btn.btn-active {

  background: var(--color-primary);

  border: 2px solid transparent;

  color: var(--color-white);

}

.tmp-btn.btn-gradient {

  color: var(--color-white);

  background-size: 300% 100%;

  background-image: linear-gradient(to right, var(--color-primary), var(--color-secondary), var(--color-secondary), var(--color-primary));

}

.tmp-btn.btn-gradient.btn-gradient-2 {

  background-image: linear-gradient(to right, var(--color-pink), var(--color-violet), var(--color-violet), var(--color-pink));

}

.tmp-btn.btn-gradient.btn-gradient-3 {

  background-image: linear-gradient(to right, var(--color-secondary), var(--color-primary), var(--color-primary), var(--color-secondary));

}

.tmp-btn.btn-gradient:hover {

  background-color: inherit;

  background-position: 102% 0;

  transition: all 0.4s ease-in-out;

}

.tmp-btn.tmp-marquee-btn {

  overflow: hidden;

}

.tmp-btn.tmp-marquee-btn span {

  display: inline-flex;

  position: relative;

  z-index: 3;

  line-height: 1.2;

}

.tmp-btn.tmp-marquee-btn span::after {

  content: attr(data-text);

  position: absolute;

  white-space: nowrap;

  top: 50%;

  left: 100%;

  transform: translate(100%, -50%);

}

.tmp-btn.tmp-marquee-btn.marquee-text-y span::after {

  top: 100%;

  left: 50%;

  transform: translate(-50%, 100%);

}

.tmp-btn.tmp-marquee-btn.marquee-auto span {

  animation: btnTxtMarqueeX 2s linear infinite;

}

.tmp-btn.tmp-switch-btn {

  overflow: hidden;

}

.tmp-btn.tmp-switch-btn 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.tmp-switch-btn 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.tmp-switch-btn.tmp-switch-y span::after {

  left: 50%;

  transform: translate(-50%, 100%);

}

.tmp-btn.icon-hover .btn-text {

  transition-timing-function: cubic-bezier(0, 0.71, 0.4, 1);

  display: inline-block;

  transition: transform 0.5s;

  transform: translateX(7px);

}

.tmp-btn.icon-hover .btn-icon {

  margin-inline-start: -7px;

  display: inline-block;

}

.tmp-btn.icon-hover .btn-icon i {

  transition-timing-function: cubic-bezier(0, 0.71, 0.4, 1);

  display: inline-block;

  opacity: 0;

  transform: translateX(-7px);

  transition: opacity 0.25s, transform 0.5s;

  padding-left: 0;

}

.tmp-btn.icon-hover.icon-hover-left .btn-text {

  transform: translateX(-7px);

}

.tmp-btn.icon-hover.icon-hover-left .btn-icon {

  margin-inline-start: 0;

  margin-inline-end: -7px;

}

.tmp-btn.icon-hover.icon-hover-left .btn-icon i {

  transform: translateX(7px);

}

.tmp-btn.icon-hover.icon-hover-left:hover .btn-icon i {

  transform: translateX(-7px);

}

.tmp-btn.icon-hover.icon-hover-left:hover .btn-text {

  transform: translateX(7px);

}

.tmp-btn.hover-icon-reverse .icon-reverse-wrapper {

  display: flex;

  align-items: center;

  justify-content: center;

}

.tmp-btn.hover-icon-reverse .btn-text {

  transition: transform 0.6s 0.125s cubic-bezier(0.1, 0.75, 0.25, 1);

}

.tmp-btn.hover-icon-reverse .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 .btn-icon + .btn-icon {

  margin-inline-end: 0;

  margin-inline-start: 8px;

  display: inline-block;

  margin-inline-start: 0;

  margin-inline-end: 0;

  opacity: 0;

  transform: translateX(-10px);

  transition-delay: 0s;

  order: -2;

}

.tmp-btn.hover-icon-reverse .btn-icon + .btn-icon i {

  padding-left: 0;

  padding-right: 6px;

}

.tmp-btn.rounded-player {

  border-radius: 100%;

  width: 100px;

  height: 100px;

  padding: 0;

  line-height: 100px;

  display: inline-block;

  position: relative;

}

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

  .tmp-btn.rounded-player {

    width: 70px;

    height: 70px;

    line-height: 70px;

  }

}

.tmp-btn.rounded-player span {

  display: inline-block;

}

.tmp-btn.rounded-player span i {

  display: inline-block;

  position: absolute;

  left: 50%;

  top: 50%;

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

  font-size: 30px;

}

.tmp-btn.rounded-player.border {

  background-image: inherit;

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

  border-width: 2px !important;

}

.tmp-btn.rounded-player.border:hover {

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

  border-color: var(--color-secondary) !important;

}

.tmp-btn.rounded-player.sm-size {

  width: 70px;

  height: 70px;

  line-height: 70px;

}

.tmp-btn.rounded-player:focus {

  outline: none;

  color: var(--color-white);

}

.tmp-btn.rounded-player:hover {

  transform: scale(1.1);

  background: var(--color-primary);

}

.tmp-btn.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: relative;

  border-radius: 100%;

  background: var(--color-white);

  margin: 0 auto;

  display: inline-block;

  padding: 0;

}

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

  .tmp-btn.rounded-player-2 {

    width: 50px;

    height: 50px;

  }

}

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

  .tmp-btn.rounded-player-2 {

    width: 40px;

    height: 40px;

    line-height: 40px;

  }

}

.tmp-btn.rounded-player-2 .play-icon {

  position: absolute;

  display: block;

  top: 50%;

  left: 50%;

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

}

.tmp-btn.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);

}

.tmp-btn.rounded-player-2.btn-large {

  width: 60px;

  height: 60px;

  margin-left: 0;

  margin-top: 0;

}

.tmp-btn.rounded-player-2.sm-size {

  width: 70px;

  height: 70px;

  line-height: 70px;

}

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

  .tmp-btn.rounded-player-2.sm-size {

    width: 50px;

    height: 50px;

    line-height: 50px;

  }

}

.tmp-btn.rounded-player-2.btn-theme-color {

  background: var(--color-primary);

}

.tmp-btn.rounded-player-2.btn-theme-color::after {

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

}

.tmp-btn.rounded-player-2.btn-theme-color::before {

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

}

.tmp-btn.rounded-player-2.btn-theme-color .play-icon::before {

  border-left: 15px solid var(--color-white);

}

.tmp-btn.rounded-player-2.btn-theme-color:hover {

  color: inherit;

  background: var(--color-primary);

}

.tmp-btn.rounded-player-2:hover {

  color: inherit;

  background: var(--color-white);

}

.tmp-btn.with-animation::after, .tmp-btn.with-animation::before {

  content: "";

  display: block;

  position: absolute;

  top: 0;

  right: 0;

  z-index: -1;

  bottom: 0;

  left: 0;

  -webkit-transition: var(--transition);

  transition: var(--transition);

  border-radius: 50%;

  border: 1.5px solid var(--color-white);

}

.tmp-btn.with-animation::before {

  -webkit-animation: ripple 2s linear infinite;

  animation: ripple 2s linear infinite;

}

.tmp-btn.with-animation::after {

  -webkit-animation: ripple 2s linear 1s infinite;

  animation: ripple 2s linear 1s infinite;

}

.tmp-btn:hover {

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

  color: var(--color-white);

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

}

.tmp-btn:hover.icon-hover .btn-text {

  transform: translateX(-7px);

}

.tmp-btn:hover.icon-hover .btn-icon i {

  opacity: 1;

  transform: translateX(7px);

}

.tmp-btn:hover.hover-icon-reverse .btn-text {

  transition-delay: 0.1s;

}

.tmp-btn:hover.hover-icon-reverse .btn-icon {

  opacity: 0;

  transition-delay: 0s;

  transform: translateX(10px);

}

.tmp-btn:hover.hover-icon-reverse .btn-icon + .btn-icon {

  opacity: 1;

  transform: translateX(0);

  transition-delay: 0.225s;

}

.tmp-btn:hover.tmp-switch-btn span {

  transform: translateX(-200%);

}

.tmp-btn:hover.tmp-switch-btn span::after {

  opacity: 1;

  transform: translate(100%, -50%);

}

.tmp-btn:hover.tmp-switch-btn.tmp-switch-y span {

  transform: translateY(-200%);

}

.tmp-btn:hover.tmp-switch-btn.tmp-switch-y span::after {

  transform: translate(-50%, 150%);

}

.tmp-btn:hover.tmp-marquee-btn span {

  animation: btnTxtMarqueeX 2s linear infinite;

}

.tmp-btn:hover.tmp-marquee-btn.marquee-text-y span {

  animation: btnTxtMarqueeY 0.5s linear infinite;

}

.tmp-btn.btn-xs {

  padding: 0 14px;

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

  height: 30px;

  line-height: 29px;

  font-size: 14px;

}

.tmp-btn.btn-sm {

  padding: 0 22px;

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

  height: 45px;

  line-height: 43px;

  font-size: 14px;

}

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

  .tmp-btn.btn-sm {

    padding: 0 10px;

  }

}

.tmp-btn.btn-md {

  padding: 0 25px;

  height: 50px;

  line-height: 48px;

  font-size: 14px;

}

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

  .tmp-btn.btn-md {

    padding: 0 15px;

    line-height: 51px;

  }

}

.tmp-btn.btn-md.btn-border {

  line-height: 38px;

}

.tmp-btn.btn-lg {

  height: 70px;

  line-height: 70px;

  padding: 0 35px;

  font-size: 18px;

}

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

  .tmp-btn.btn-lg {

    padding: 0 17px;

  }

}

.tmp-btn.btn-xl {

  padding: 0 45px;

  font-size: 20px;

  height: 75px;

  line-height: 75px;

}

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

  .tmp-btn.btn-xl {

    padding: 0 20px;

    font-size: 16px;

    height: 55px;

    line-height: 55px;

  }

}

.tmp-btn.btn-xxl {

  padding: 0 60px;

  font-size: 22px;

  height: 100px;

  line-height: 100px;

}

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

  .tmp-btn.btn-xxl {

    padding: 0 20px;

    font-size: 18px;

    height: 70px;

    line-height: 70px;

  }

}

.tmp-btn i {

  padding-left: 6px;

  display: inline-block;

  top: 2px;

  position: relative;

  font-size: 17px;

}

.tmp-btn i.image-icon {

  top: inherit;

  transition: 0.4s;

}

.tmp-btn.btn-border-gradient {

  background: linear-gradient(90deg, #CFA2E8, #637FEA);

  border: none;

  outline: none;

  cursor: pointer;

  position: relative;

  z-index: 10;

  color: var(--color-heading);

  box-shadow: 0 10px 13px 0 rgba(209, 211, 237, 0.39);

  border-radius: 0;

}

.tmp-btn.btn-border-gradient::before {

  content: "";

  z-index: -1;

  top: 3px;

  left: 3px;

  position: absolute;

  background: #fff;

  width: calc(100% - 6px);

  height: calc(100% - 6px);

}

.tmp-btn.btn-border-gradient.radius-round {

  border-radius: 500px;

}

.tmp-btn.btn-border-gradient.radius-round::before {

  border-radius: 500px;

}

.tmp-btn.hover-transform-none:hover {

  transform: none;

}



.radius-round {

  border-radius: 500px !important;

}



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

    Portfolio Arrow Icon  

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

.tmp-arrow-icon-btn {

  height: 50px;

  width: 50px;

  border-radius: 10px;

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

  color: var(--color-white);

  font-size: 14px;

  line-height: 50px;

  text-align: center;

  background: transparent;

  display: inline-block;

  position: relative;

  overflow: hidden;

  min-width: 50px;

}

.tmp-arrow-icon-btn .btn-inner {

  position: relative;

  overflow: hidden;

  height: 100%;

  width: 100%;

}

.tmp-arrow-icon-btn i {

  position: absolute;

  top: 50%;

  left: 50%;

  overflow: hidden;

  margin-top: -9px;

  margin-left: -4px;

  z-index: 1;

  font-size: 18px;

  color: var(--color-heading);

}

.tmp-arrow-icon-btn i.tmp-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);

}

.tmp-arrow-icon-btn i.tmp-icon-bottom {

  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: translateY(300%) translateX(-475%);

}

.tmp-arrow-icon-btn:hover {

  background: var(--color-primary);

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

  color: var(--color-primary);

}

.tmp-arrow-icon-btn:hover i.tmp-icon {

  transform: translateY(-300%) translateX(475%);

}

.tmp-arrow-icon-btn:hover i.tmp-icon-bottom {

  transform: translateY(0) translateX(0) scale(1.1);

}

.tmp-arrow-icon-btn:hover {

  background: var(--color-primary);

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

  color: var(--color-white);

}



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

    Read More Btn  

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

.read-more-btn {

  color: var(--color-heading);

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

  font-size: 16px;

  font-weight: 700;

  line-height: 32px;

  letter-spacing: 1.28px;

  text-transform: uppercase;

}

.read-more-btn.v2:hover {

  color: var(--color-primary);

}



.service-item.current .read-more-btn:hover {

  color: var(--color-heading);

}



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

    Custom Button  

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

.custom-btn {

  width: 50px;

  height: 50px;

  border-radius: 10px;

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

  display: flex;

  justify-content: center;

  align-items: center;

}

.custom-btn.v2 {

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

}

.custom-btn.v2:hover {

  background: #fff;

}

.custom-btn.v3 {

  border: 1px solid #ffffff;

  background: #ffffff;

}

.custom-btn.v3 i {

  color: var(--color-primary);

}

.custom-btn.v3:hover {

  background: var(--color-primary);

}

.custom-btn.v3:hover i {

  color: #fff;

}

.custom-btn i {

  transition: all 0.4s ease;

}

.custom-btn:hover {

  background: var(--color-primary);

  color: var(--color-heading);

  border-color: transparent;

}

.custom-btn:hover i {

  transform: rotate(0deg);

}



.tmp-btn.tmp-modern-button {

  position: relative;

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

  transition-property: all;

  transition-duration: 0.3s;

  transition-timing-function: ease;

  overflow: hidden;

}

.tmp-btn.tmp-modern-button .btn-bg {

  z-index: -1;

  pointer-events: none;

  object-fit: cover;

  border-radius: inherit;

  width: 100%;

  height: 100%;

  transition-property: all;

  transition-duration: 0.3s;

  transition-timing-function: ease;

  position: absolute;

  inset: 0%;

}

.tmp-btn.tmp-modern-button .btn-bg-hover {

  z-index: -1;

  opacity: 0;

  pointer-events: none;

  object-fit: cover;

  border-radius: inherit;

  width: 100%;

  height: 100%;

  transition-property: all;

  transition-duration: 0.3s;

  transition-timing-function: ease;

  position: absolute;

  inset: 0%;

}

.tmp-btn.tmp-modern-button .btn-hack {

  pointer-events: none;

  justify-content: center;

  align-items: center;

  display: flex;

  content: "";

  position: absolute;

  z-index: 1;

  inset: 0px;

  border-radius: inherit;

  padding: 2px;

  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0) padding-box;

  -webkit-mask-composite: destination-out;

  mask-composite: exclude;

}

.tmp-btn.tmp-modern-button .btn-hack::after {

  content: "";

  position: absolute;

  width: 500%;

  height: 500%;

  background: conic-gradient(from 148deg, transparent 46%, #ffffff 50%, transparent 54%);

  z-index: 1;

  border-radius: inherit;

  animation: animate 4s linear infinite;

}

.tmp-btn.tmp-modern-button:hover {

  background: transparent;

}

.tmp-btn.tmp-modern-button:hover .btn-hack::after {

  background: conic-gradient(from 148deg, transparent 46%, #139bfd 50%, transparent 54%);

}

.tmp-btn.tmp-modern-button:hover .btn-bg-hover {

  opacity: 1;

}



@keyframes animate {

  0% {

    transform: rotate(0deg);

  }

  100% {

    transform: rotate(360deg);

  }

}

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

  Img Box

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

.img-box {

  position: relative;

  width: 100%;

  overflow: hidden;

  cursor: pointer;

}

.img-box img {

  width: 100%;

}


.img-box .img-primary {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  transition: 0.8s;

  background-size: cover;

  object-fit: cover;

  transform: translateX(50%) scaleX(2);

  opacity: 0;

  filter: blur(10px);

}

.img-box .img-primary {

  position: absolute;

  left: 0;

  top: 0;

  right: 0;

  bottom: 0;

  z-index: 1;

  transform: translateX(50%) scaleX(2);

  opacity: 0;

  filter: blur(10px);

}

.img-box .img-secondary {

  position: relative;

  display: block;

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: all 0.5s ease;

}

.img-box:hover .img-secondary {

  transform: translateX(-50%) scaleX(2);

  opacity: 0;

  filter: blur(10px);

}

.img-box:hover .img-primary {

  transform: translateX(0) scaleX(1);

  opacity: 1;

  filter: blur(0);

}

.img-box .blog-tags {

  position: absolute;

  top: 10px;

  left: 10px;

  display: inline-flex;

  padding: 5px 15px;

  justify-content: center;

  align-items: center;

  gap: 8px;

  z-index: 10;

  border-radius: 999px;

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

}

.img-box .blog-tags li {

  display: inline-flex;

  gap: 5px;

  color: var(--color-heading);

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

  font-size: 14px;

  font-weight: 400;

  line-height: 160%;

  margin: 0;

}

.img-box .blog-tags li i {

  font-size: 11px;

}



.latest-portfolio-card-style-two:hover .img-secondary {

  transform: translateX(-50%) scaleX(2);

  opacity: 0;

  filter: blur(10px);

}

.latest-portfolio-card-style-two:hover .img-primary {

  transform: translateX(0) scaleX(1);

  opacity: 1;

  filter: blur(0);

}



.latest-portfolio-card.v5:hover .img-secondary {

  transform: translateX(-50%) scaleX(2);

  opacity: 0;

  filter: blur(10px);

}

.latest-portfolio-card.v5:hover .img-primary {

  transform: translateX(0) scaleX(1);

  opacity: 1;

  filter: blur(0);

}



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

  Blog Card

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

.blog-card {

  border-radius: 20px;

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

  overflow: hidden;

  height: 100%;

}

.blog-card .blog-content-wrap {

  padding: 30px;

}

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

  .blog-card .blog-content-wrap {

    padding: 20px 20px;

  }

}

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

  .blog-card .blog-content-wrap {

    padding: 20px 20px;

  }

}

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

  .blog-card .blog-content-wrap {

    padding: 20px 20px;

  }

}

.blog-card .blog-content-wrap .blog-title {

  color: var(--color-heading);

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

  font-size: 24px;

  font-weight: 700;

  line-height: 30px;

  margin-bottom: 16px;

}

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

  .blog-card .blog-content-wrap .blog-title {

    margin-bottom: 12px;

  }

}

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

  .blog-card .blog-content-wrap .blog-title {

    margin-bottom: 12px;

  }

}

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

  .blog-card .blog-content-wrap .blog-title {

    margin-bottom: 12px;

  }

}

.blog-card .blog-content-wrap .blog-title.v2:hover a {

  color: var(--color-primary);

}

.blog-card .read-more-btn {

  color: var(--color-gray);

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

  font-size: 13px;

  font-weight: 400;

  line-height: 27px;

  display: inline-block;

  align-items: center;

  transition: var(--transition);

  letter-spacing: 0.5px;

}

.blog-card .read-more-btn span {

  display: inline-block;

  padding-left: 3px;

}

.blog-card .read-more-btn:hover {

  color: var(--color-primary);

}



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

  Blog Card Style Two

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

.blog-card-style-two {

  border-radius: 20px;

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

  overflow: hidden;

  height: 100%;

}

.blog-card-style-two .blog-card-img {

  position: relative;

}

.blog-card-style-two .blog-card-img span {

  position: absolute;

  top: 0;

  left: 0;

  color: var(--color-white);

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

  font-size: 18px;

  font-weight: 700;

  line-height: 27px;

  background: rgba(20, 20, 20, 0.8);

  padding: 5px 20px;

  border-radius: 0px 10px 10px 0px;

  z-index: 10;

}

.blog-card-style-two .blog-content-wrap {

  padding: 20px;

}

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

  .blog-card-style-two .blog-content-wrap {

    padding: 20px;

  }

}

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

  .blog-card-style-two .blog-content-wrap {

    padding: 20px;

  }

}

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

  .blog-card-style-two .blog-content-wrap {

    padding: 20px;

  }

}

.blog-card-style-two .blog-content-wrap .blog-tags ul {

  display: flex;

  align-items: center;

  gap: 15px;

}

.blog-card-style-two .blog-content-wrap .blog-tags ul li {

  margin: 0;

}

.blog-card-style-two .blog-content-wrap .blog-tags ul li a {

  color: var(--color-gray);

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

  font-size: 14px;

  font-weight: 400;

  line-height: 24px;

}

.blog-card-style-two .blog-content-wrap .blog-tags ul li a i {

  margin-right: 10px;

}

.blog-card-style-two .blog-content-wrap .blog-title {

  margin-top: 12px;

  margin-bottom: 30px;

  color: var(--color-heading);

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

  font-size: 20px;

  font-weight: 700;

  line-height: 30px;

}



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

  Blog Inner

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

.signle-side-bar {

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

  border-radius: 20px;

  margin-bottom: 30px;

  padding: 40px;

  /*== Search Area ==*/

  /*== Header ==*/

  /*== Recent Post Area ==*/

  /*== About Me Details ==*/

  /*== Tags Wrapper ==*/

  /*== Service List Area ==*/

  /*== Project Details Area ==*/

}

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

  .signle-side-bar {

    padding: 30px 20px;

  }

}

.signle-side-bar:last-child {

  margin-bottom: 0;

  margin-bottom: 0;

  position: sticky;

  top: 120px;

}

.signle-side-bar.search-area {

  padding: 40px;

  position: relative;

}

.signle-side-bar.search-area input {

  height: 60px;

  border-radius: 8px;

  padding-right: 60px;

}

.signle-side-bar.search-area button {

  position: absolute;

  right: 0;

  top: 50%;

  transform: translateY(-50%);

}

.signle-side-bar .search-area {

  display: flex;

  align-items: center;

}

.signle-side-bar .search-area input::placeholder {

  color: var(--color-heading);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

.signle-side-bar .search-area button {

  border: 0;

  width: auto;

  padding: 0;

}

.signle-side-bar .search-area i {

  min-width: 60px;

  min-height: 60px;

  display: flex;

  justify-content: center;

  align-items: center;

  border-radius: 8px;

  background: var(--color-primary);

  color: var(--color-white);

}

.signle-side-bar .header .title {

  color: var(--color-heading);

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

  font-size: 24px;

  font-weight: 700;

  line-height: 30px;

  position: relative;

  display: inline-flex;

  margin-bottom: 24px;

}

.signle-side-bar .header .title::after {

  position: absolute;

  right: -20px;

  top: 13px;

  content: " ";

  width: 5px;

  height: 5px;

  background: var(--color-primary);

  border-radius: 100px;

}

.signle-side-bar.recent-post-area .body .single-post {

  display: flex;

  justify-content: space-between;

  align-items: center;

  padding-bottom: 12px;

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

  margin-bottom: 12px;

  color: var(--color-gray);

}

.signle-side-bar.recent-post-area .body .single-post:hover {

  color: var(--color-primary);

}

.signle-side-bar.recent-post-area .body .single-post:hover span {

  color: var(--color-primary);

}

.signle-side-bar.recent-post-area .body .single-post:hover span .post-title {

  color: var(--color-primary);

}

.signle-side-bar.recent-post-area .body .single-post:last-child {

  margin-bottom: 0;

  padding-bottom: 0;

  border-bottom: none;

}

.signle-side-bar.recent-post-area .body .single-post .single-post-left {

  display: flex;

  align-items: center;

  gap: 10px;

}

.signle-side-bar.recent-post-area .body .single-post .single-post-left .post-title {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 26px;

  transition: all 0.4s ease;

}

.signle-side-bar.recent-post-area .body .single-post .single-post-left i {

  transition: all 0.4s ease;

}

.signle-side-bar.recent-post-area .body .single-post .single-post-left i:hover {

  color: var(--color-primary);

}

.signle-side-bar.recent-post-area .body .single-post .post-num {

  color: var(--color-gray);

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

  font-size: 14px;

  font-weight: 400;

  line-height: 160%;

  transition: all 0.4s ease;

}

.signle-side-bar.recent-post-area .body .single-post-card {

  display: flex;

  align-items: center;

  gap: 15px;

  padding-bottom: 20px;

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

  margin-bottom: 20px;

}

.signle-side-bar.recent-post-area .body .single-post-card:last-child {

  margin-bottom: 0;

  padding-bottom: 0;

  border-bottom: none;

}

.signle-side-bar.recent-post-area .body .single-post-card .single-post-card-img {

  min-width: 80px;

  min-height: 80px;

  width: 80px;

}

.signle-side-bar.recent-post-area .body .single-post-card .single-post-card-img img {

  border-radius: 8px;

  min-width: 80px;

  min-height: 80px;

  width: 80px;

}

.signle-side-bar.recent-post-area .body .single-post-card .single-post-right .single-post-top {

  display: flex;

  align-items: center;

  gap: 6px;

  margin-bottom: 8px;

}

.signle-side-bar.recent-post-area .body .single-post-card .single-post-right .single-post-top .post-title {

  color: var(--color-gray);

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

  font-size: 14px;

  font-weight: 400;

  line-height: 160%;

  transition: var(--transition);

}

.signle-side-bar.recent-post-area .body .single-post-card .single-post-right .single-post-top i {

  color: var(--color-primary);

  font-size: 12px;

}

.signle-side-bar.recent-post-area .body .single-post-card .single-post-right .post-title {

  color: var(--color-heading);

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

  font-size: 18px;

  font-weight: 700;

  line-height: 27px;

  margin-bottom: 0;

}

.signle-side-bar.recent-post-area .body .single-post-card .single-post-right .post-title:hover a {

  color: var(--color-primary);

}

.signle-side-bar .about-me-details .about-me-details-head {

  display: flex;

  margin-bottom: 30px;

  gap: 20px;

  align-items: center;

}

.signle-side-bar .about-me-details .about-me-details-head .about-me-img {

  width: 150px;

  height: auto;

}

.signle-side-bar .about-me-details .about-me-details-head .about-me-right-content .title {

  color: var(--color-heading);

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

  font-size: 22px;

  font-weight: 700;

  line-height: 27px;

  margin-bottom: 5px;

}

.signle-side-bar .about-me-details .about-me-details-head .about-me-right-content .para {

  color: var(--color-gray);

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

  font-size: 14px;

  font-weight: 400;

  line-height: 24px;

  margin-bottom: 11px;

}

.signle-side-bar .about-me-details .about-me-para {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

.signle-side-bar .tags-wrapper {

  display: flex;

  align-items: center;

  flex-wrap: wrap;

  gap: 10px;

}

.signle-side-bar .tags-wrapper .tag-link {

  color: var(--color-heading);

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

  font-size: 14px;

  font-weight: 400;

  padding: 0px 21px;

  border-radius: 100px;

  background: #060606;

  display: block;

  transition: 0.3s;

  height: 40px;

  line-height: 40px;

}

.signle-side-bar .tags-wrapper .tag-link:hover {

  background: var(--color-primary);

  transform: translateY(-4px);

}

.signle-side-bar.service-list-area .single-service {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding-bottom: 10px;

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

  margin-bottom: 10px;

}

.signle-side-bar.service-list-area .single-service:last-child {

  border-bottom: none;

  margin-bottom: 0;

}

.signle-side-bar.service-list-area .single-service .service-title {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-bottom: 0;

  transition: all 0.4s ease;

}

.signle-side-bar.service-list-area .single-service i {

  color: var(--color-gray);

}

.signle-side-bar.service-list-area .single-service:hover .service-title,

.signle-side-bar.service-list-area .single-service:hover .service-icon,

.signle-side-bar.service-list-area .single-service:hover i {

  color: var(--color-primary);

}

.signle-side-bar.project-details-area .project-details-info {

  margin-bottom: 15px;

  color: var(--color-heading);

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

  font-size: 18px;

  font-weight: 700;

  line-height: 27px;

}

.signle-side-bar.project-details-area .project-details-info:last-child {

  margin-bottom: 0;

}

.signle-side-bar.project-details-area .project-details-info span {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-left: 10px;

}



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

  Blog Classic Card

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

.blog-classic-card {

  border-radius: 20px;

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

  overflow: hidden;

  margin-bottom: 30px;

}

.blog-classic-card:last-child {

  margin-bottom: 0;

}

.blog-classic-card .img-box {

  min-height: 462px;

}

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

  .blog-classic-card .img-box {

    min-height: auto;

  }

}

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

  .blog-classic-card .img-box {

    min-height: auto;

  }

}

.blog-classic-card .img-box img {

  height: auto;

}

.blog-classic-card .blog-classic-content {

  padding: 30px 40px 40px 40px;

}

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

  .blog-classic-card .blog-classic-content {

    padding: 30px 20px;

  }

}

.blog-classic-card .blog-classic-content .title {

  color: var(--color-heading);

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

  font-size: 32px;

  font-weight: 700;

  line-height: 130%;

  text-transform: capitalize;

  margin-bottom: 20px;

}

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

  .blog-classic-card .blog-classic-content .title {

    margin-bottom: 10px;

  }

}

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

  .blog-classic-card .blog-classic-content .title {

    font-size: 22px;

  }

}

.blog-classic-card .blog-classic-content .title:hover a {

  color: var(--color-primary);

}

.blog-classic-card .blog-classic-content .para {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-bottom: 40px;

}

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

  .blog-classic-card .blog-classic-content .para {

    margin-bottom: 18px;

  }

}



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

  Blog Classic Tag

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

.blog-classic-tag {

  margin-bottom: 20px;

  display: flex;

  align-items: center;

  gap: 10px;

  flex-wrap: wrap;

}

@media (min-width: 576px) {

  .blog-classic-tag {

    gap: 30px;

  }

}

.blog-classic-tag .title {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 25px;

  margin-bottom: 0;

}

.blog-classic-tag ul {

  display: flex;

  align-items: center;

  gap: 5px;

  flex-wrap: wrap;

}

@media (min-width: 576px) {

  .blog-classic-tag ul {

    gap: 30px;

  }

}

.blog-classic-tag ul li {

  margin: 0;

}

.blog-classic-tag ul li .tag-wrap {

  display: flex;

  align-items: center;

  gap: 8px;

}

.blog-classic-tag ul li .tag-wrap .tag-title {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-bottom: 0;

}



.about-me-social-link {

  display: flex;

  gap: 10px;

  align-items: center;

}

.about-me-social-link a:hover {

  color: var(--color-primary);

}



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

  Tmp Pagination Button

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

.tmp-pagination-button {

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 10px;

}

.tmp-pagination-button .pagination-btn {

  width: 60px;

  height: 60px;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 500px;

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

  color: var(--color-heading);

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

  font-size: 24px;

  font-weight: 700;

  line-height: 30px;

  transition: all 0.4s ease;

}

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

  .tmp-pagination-button .pagination-btn {

    width: 45px;

    height: 45px;

  }

}

.tmp-pagination-button .pagination-btn:hover {

  color: var(--color-primary);

  background: var(--color-primary);

  color: #fff;

}

.tmp-pagination-button .pagination-btn.active {

  color: var(--color-primary);

  background: var(--color-primary);

  color: #fff;

}



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

  Blog Detail left Area

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

.blog-details-left-area .thumbnail-top img {

  width: 100%;

  border-radius: 10px;

}

.blog-details-left-area .blog-details-discription {

  padding: 30px 0;

}

.blog-details-left-area .blog-details-discription h3.title {

  color: var(--color-heading);

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

  font-size: 32px;

  font-weight: 700;

  line-height: 42px;

}

.blog-details-left-area .blog-details-discription p.disc {

  margin-bottom: 20px;

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

.blog-details-left-area .quote-area-blog-details {

  padding: 30px;

  border-radius: 20px;

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

  z-index: 1;

  position: relative;

}

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

  .blog-details-left-area .quote-area-blog-details {

    padding: 25px;

  }

}

.blog-details-left-area .quote-area-blog-details p.disc {

  color: var(--color-gray);

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

  font-size: 20px;

  font-weight: 400;

  line-height: 35px;

  margin-bottom: 19px;

}

.blog-details-left-area .quote-area-blog-details .author {

  position: relative;

  display: flex;

  justify-content: space-between;

  padding-left: 60px;

  color: var(--color-heading);

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

  font-size: 18px;

  font-weight: 700;

  line-height: 27px;

  margin-bottom: 0;

}

.blog-details-left-area .quote-area-blog-details .author::after {

  position: absolute;

  content: "";

  left: 0;

  top: 47%;

  height: 2px;

  width: 40px;

  background: var(--color-primary);

  z-index: 10;

}

.blog-details-left-area .quote-area-blog-details span {

  color: var(--color-primary);

  font-size: 160px;

  opacity: 0.09;

  position: absolute;

  right: 10px;

  line-height: 0;

  display: inline-block;

  bottom: -27px;

}

.blog-details-left-area .quote-area-blog-details span i {

  font-weight: 300;

}



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

  Our Portfolio Swiper

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

.our-portfolio-swiper {

  position: relative;

}

.our-portfolio-swiper .our-portfoli-swiper-card {

  display: flex;

  gap: 30px;

  flex-wrap: wrap;

}

@media (min-width: 769px) {

  .our-portfolio-swiper .our-portfoli-swiper-card {

    flex-wrap: nowrap;

  }

}

.our-portfolio-swiper .our-portfoli-swiper-card .card-right-content {

  width: 100%;

}

@media (min-width: 1200px) {

  .our-portfolio-swiper .our-portfoli-swiper-card .card-right-content {

    min-width: 300px;

  }

}

.our-portfolio-swiper .our-portfoli-swiper-card .card-right-content img {

  width: 100%;

  border-radius: 20px;

}



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

  Our Portfolio Swiper Btn Wrap

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

.our-portfolio-swiper-btn-wrap {

  display: flex;

  justify-content: space-between;

  margin-top: 40px;

}

.our-portfolio-swiper-btn-wrap .prev-btn,

.our-portfolio-swiper-btn-wrap .next-btn,

.our-portfolio-swiper-btn-wrap .tmp--next-prev-btn {

  display: flex;

  align-items: center;

  gap: 30px;

}

.our-portfolio-swiper-btn-wrap .prev-btn .btn-content .title,

.our-portfolio-swiper-btn-wrap .next-btn .btn-content .title,

.our-portfolio-swiper-btn-wrap .tmp--next-prev-btn .btn-content .title {

  color: var(--color-heading);

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

  font-size: 18px;

  font-weight: 700;

  line-height: 27px;

  margin-bottom: 0;

  gap: 5px;

  flex-wrap: wrap;

  display: none;

  transition: var(--transition);

}

.our-portfolio-swiper-btn-wrap .prev-btn .btn-content .title:hover,

.our-portfolio-swiper-btn-wrap .next-btn .btn-content .title:hover,

.our-portfolio-swiper-btn-wrap .tmp--next-prev-btn .btn-content .title:hover {

  color: var(--color-primary);

}

@media (min-width: 768px) {

  .our-portfolio-swiper-btn-wrap .prev-btn .btn-content .title,

  .our-portfolio-swiper-btn-wrap .next-btn .btn-content .title,

  .our-portfolio-swiper-btn-wrap .tmp--next-prev-btn .btn-content .title {

    display: flex;

  }

}

.our-portfolio-swiper-btn-wrap .prev-btn .btn-content .para,

.our-portfolio-swiper-btn-wrap .next-btn .btn-content .para,

.our-portfolio-swiper-btn-wrap .tmp--next-prev-btn .btn-content .para {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  display: none;

}

@media (min-width: 768px) {

  .our-portfolio-swiper-btn-wrap .prev-btn .btn-content .para,

  .our-portfolio-swiper-btn-wrap .next-btn .btn-content .para,

  .our-portfolio-swiper-btn-wrap .tmp--next-prev-btn .btn-content .para {

    display: flex;

  }

}

.our-portfolio-swiper-btn-wrap .swiper-btn-prev,

.our-portfolio-swiper-btn-wrap .swiper-btn-next,

.our-portfolio-swiper-btn-wrap .tmp-arrow-btn {

  width: 60px;

  height: 60px;

  display: flex;

  align-items: center;

  justify-content: center;

  color: var(--color-heading);

  background: transparent;

  border-radius: 100px;

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

  transition: var(--transition);

}

.our-portfolio-swiper-btn-wrap .swiper-btn-prev i,

.our-portfolio-swiper-btn-wrap .swiper-btn-next i,

.our-portfolio-swiper-btn-wrap .tmp-arrow-btn i {

  transition: var(--transition);

}

.our-portfolio-swiper-btn-wrap .swiper-btn-prev:hover,

.our-portfolio-swiper-btn-wrap .swiper-btn-next:hover,

.our-portfolio-swiper-btn-wrap .tmp-arrow-btn:hover {

  background: var(--color-primary);

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

}

.our-portfolio-swiper-btn-wrap .swiper-btn-prev:hover i,

.our-portfolio-swiper-btn-wrap .swiper-btn-next:hover i,

.our-portfolio-swiper-btn-wrap .tmp-arrow-btn:hover i {

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

}

.our-portfolio-swiper-btn-wrap .swiper-btn-prev button,

.our-portfolio-swiper-btn-wrap .swiper-btn-next button,

.our-portfolio-swiper-btn-wrap .tmp-arrow-btn button {

  border: 0 none;

  padding: 0;

}



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

  Blog Details Navigation

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

.blog-details-navigation {

  border-radius: 20px;

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

  padding: 30px 40px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-top: 40px;

  flex-wrap: wrap;

}

.blog-details-navigation .navigation-tags {

  display: flex;

  align-items: center;

  gap: 10px;

  flex-wrap: wrap;

}

@media (min-width: 768px) {

  .blog-details-navigation .navigation-tags {

    gap: 30px;

  }

}

.blog-details-navigation .navigation-tags .tag-title {

  color: var(--color-heading);

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

  font-size: 18px;

  font-weight: 700;

  line-height: 27px;

  margin-bottom: 0;

}

.blog-details-navigation .navigation-tags ul {

  display: flex;

  align-items: center;

  gap: 10px;

  flex-wrap: wrap;

}

@media (min-width: 768px) {

  .blog-details-navigation .navigation-tags ul {

    gap: 20px;

  }

}

.blog-details-navigation .navigation-tags ul li {

  margin: 0;

}

.blog-details-navigation .navigation-tags ul li .tag {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

@media (min-width: 576px) {

  .blog-details-navigation .social-link {

    margin-top: 0;

  }

}



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

  Comment Area Main Wrapper

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

.comment-area-main-wrapper .single-comment-audience {

  display: flex;

  align-items: center;

  gap: 28px;

  margin-bottom: 40px;

  flex-wrap: wrap;

  padding-bottom: 40px;

  border-bottom: 1px solid #202020;

}

.comment-area-main-wrapper .single-comment-audience:last-child {

  border-bottom: none;

}

@media (min-width: 768px) {

  .comment-area-main-wrapper .single-comment-audience {

    flex-wrap: inherit;

  }

}

.comment-area-main-wrapper .single-comment-audience .author-image {

  min-width: 95px;

  min-height: 95px;

  max-width: 150px;

  padding: 15px;

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

  border-radius: 50%;

}

.comment-area-main-wrapper .single-comment-audience .author-image.tmponhover::after {

  border-radius: 50%;

}

.comment-area-main-wrapper .right-area-commnet .top-area-comment {

  display: flex;

  gap: 15px;

  margin-bottom: 5px;

  flex-wrap: wrap;

}

@media (min-width: 768px) {

  .comment-area-main-wrapper .right-area-commnet .top-area-comment {

    gap: 30px;

  }

}

.comment-area-main-wrapper .right-area-commnet .top-area-comment .left {

  display: flex;

  gap: 15px;

  flex-wrap: wrap;

  align-items: center;

}

.comment-area-main-wrapper .right-area-commnet .top-area-comment .left .title {

  color: var(--color-heading);

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

  font-size: 22px;

  font-weight: 500;

  line-height: 27px;

  margin-bottom: 0;

}

.comment-area-main-wrapper .right-area-commnet .top-area-comment .left span {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

.comment-area-main-wrapper .right-area-commnet .disc {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

.comment-area-main-wrapper .right-area-commnet .reply-btn {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 700;

  line-height: 32px;

  letter-spacing: 1.28px;

  text-transform: uppercase;

}

.comment-area-main-wrapper .right-area-commnet .reply-btn:hover {

  color: var(--color-primary);

}



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

  Blog Details Form Wrapper

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

.blog-details-form-wrapper {

  padding: 30px;

  border-radius: 20px;

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

  box-shadow: 0px 0px 60px 0px rgba(0, 0, 0, 0.05);

}

@media (min-width: 768px) {

  .blog-details-form-wrapper {

    padding: 60px;

  }

}

.blog-details-form-wrapper .title {

  color: var(--color-heading);

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

  font-size: 32px;

  font-weight: 700;

  line-height: 130%;

  text-transform: capitalize;

  margin-bottom: 5px;

}

.blog-details-form-wrapper .subtitle {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-bottom: 40px;

  display: inline-block;

}

.blog-details-form-wrapper .blog-details-form label {

  color: var(--color-heading);

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

  font-size: 18px;

  font-weight: 700;

  line-height: 27px;

  margin-bottom: 8px;

}

.blog-details-form-wrapper .blog-details-form .single-input {

  margin-bottom: 18px;

}

.blog-details-form-wrapper .blog-details-form .single-input input {

  border-radius: 20px;

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

  padding: 17px 20px;

}

.blog-details-form-wrapper .blog-details-form .single-input input:focus {

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

}

.blog-details-form-wrapper .blog-details-form .single-input input::placeholder {

  color: var(--color-heading);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

.blog-details-form-wrapper .blog-details-form textarea {

  border-radius: 20px;

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

  padding: 17px 20px;

  min-height: 130px;

  resize: inherit;

  transition: var(--transition);

}

.blog-details-form-wrapper .blog-details-form textarea::placeholder {

  color: var(--color-heading);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

.blog-details-form-wrapper .blog-details-form textarea:focus {

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

}

.blog-details-form-wrapper .blog-details-form .comments-btn-wrap {

  margin-top: 30px;

}

.blog-details-form-wrapper .blog-details-form .comments-btn-wrap .comment-btn {

  padding: 9px 30px;

  display: inline-flex;

  justify-content: center;

  align-items: center;

  gap: 10px;

  width: 100%;

  border-radius: 100px;

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 700;

  letter-spacing: 1.28px;

  text-transform: uppercase;

  transition: all 0.4s ease;

  background: var(--color-primary);

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

  transition: var(--transition);

}

.blog-details-form-wrapper .blog-details-form .comments-btn-wrap .comment-btn:hover {

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

  background: transparent;

}



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

  .card-1-body .blog-card-style-two .blog-content-wrap {

    padding: 10px;

  }

}

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

  .card-1-body .custom-title {

    font-size: 18px;

  }

}

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

  .card-1-body .tab-content-overlay-to-top {

    margin-top: 0;

  }

}

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

  .card-1-body .tmp-contact-about-inner {

    flex-direction: column;

    gap: 35px;

  }

}



.client-testimonial-card-wrap {

  border-radius: 20px;

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

  position: relative;

  padding: 80px 40px 40px 40px;

}

@media (min-width: 576px) {

  .client-testimonial-card-wrap {

    padding: 100px 60px 60px 60px;

  }

}

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

  .client-testimonial-card-wrap {

    padding: 100px 30px 30px 30px;

  }

}

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

  .client-testimonial-card-wrap {

    padding: 100px 20px 20px 20px;

  }

}

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

  .client-testimonial-card-wrap {

    padding: 80px 20px 20px 20px;

  }

}

.client-testimonial-card-wrap .client-card-head {

  display: flex;

  justify-content: space-between;

  flex-wrap: wrap;

  gap: 10px;

}

.client-testimonial-card-wrap .client-card-head .client-info {

  display: flex;

  align-items: center;

  gap: 15px;

  flex-wrap: wrap;

}

.client-testimonial-card-wrap .client-card-head .client-info .client-img {

  border-radius: 100px;

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

  padding: 3px;

  width: 65px;

  height: 65px;

}

.client-testimonial-card-wrap .client-card-head .client-info .client-img img {

  border-radius: 100px;

}

.client-testimonial-card-wrap .client-card-head .client-info .client-details .client-title {

  color: var(--color-heading);

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

  font-size: 24px;

  font-weight: 700;

  line-height: 30px;

  margin-bottom: 0;

}

.client-testimonial-card-wrap .client-card-head .client-info .client-details .client-para {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-top: 5px;

}

.client-testimonial-card-wrap .client-para {

  margin-top: 30px;

  color: var(--color-body);

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

  font-weight: 500;

  margin-bottom: 0;

  width: 100%;

  line-height: 1.7;

  font-size: 18px;

}

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

  .client-testimonial-card-wrap .client-para {

    margin-top: 13px;

  }

}

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

  .client-testimonial-card-wrap .client-para {

    margin-top: 13px;

  }

}

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

  .client-testimonial-card-wrap .client-para {

    width: 81%;

    margin-top: 13px;

  }

}

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

  .client-testimonial-card-wrap .client-para {

    width: 100%;

  }

}

.client-testimonial-card-wrap .quat-logo {

  width: 80px;

  height: 80px;

  border-radius: 80px;

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

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

  position: absolute;

  top: -40px;

  left: 60px;

  display: flex;

  align-items: center;

  justify-content: center;

}

.client-testimonial-card-wrap .quat-logo img {

  filter: invert(1);

  max-height: 28px;

}



.testimonial-custom-title {

  text-align: center;

  -webkit-text-stroke: 1px #242424;

  color: transparent;

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

  font-weight: 700;

  text-transform: uppercase;

  font-size: 50px;

  line-height: 60px;

}

@media (min-width: 576px) {

  .testimonial-custom-title {

    font-size: 100px;

    line-height: 110px;

  }

}

@media (min-width: 1440px) {

  .testimonial-custom-title {

    font-size: 200px;

    line-height: 115%;

  }

}



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

  Tmp Star

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

.tmp-star ul {

  display: flex;

  align-items: center;

  gap: 8px;

}

.tmp-star ul li {

  margin: 0;

  color: var(--color-primary);

}



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

  Testimonial Swiper

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

.testimonial-swiper {

  padding-bottom: 182px;

}

@media (min-width: 350px) {

  .testimonial-swiper {

    padding-bottom: 110px;

  }

}

@media (min-width: 420px) {

  .testimonial-swiper {

    padding-bottom: 30px;

  }

}

@media (min-width: 450px) {

  .testimonial-swiper {

    padding-bottom: 0px;

  }

}

@media (min-width: 800px) {

  .testimonial-swiper {

    padding-bottom: 62px;

  }

}

@media (min-width: 860px) {

  .testimonial-swiper {

    padding-bottom: 30px;

  }

}

@media (min-width: 911px) {

  .testimonial-swiper {

    padding-bottom: 0px;

  }

}

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

  .testimonial-swiper {

    padding-bottom: 42px;

  }

}



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

  Client Testimonial Swiper

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

section.clients-testimonial-area {

  padding-bottom: 100px;

}



.client-testimonial-swiper {

  position: relative;

}

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

  .client-testimonial-swiper {

    padding: 0 20px;

  }

}

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

  .client-testimonial-swiper {

    padding: 0 20px;

  }

}

.client-testimonial-swiper::before {

  content: " ";

  background-image: url("../images/testimonial/left-bg-img.png");

  background-repeat: no-repeat;

}

.client-testimonial-swiper .swiper {

  padding-top: 40px;

  position: relative;

}

.client-testimonial-swiper .swiper::after, .client-testimonial-swiper .swiper::before {

  content: " ";

  position: absolute;

  width: 505px;

  height: 538px;

  z-index: 1;

  display: none;

}

@media (min-width: 1200px) {

  .client-testimonial-swiper .swiper::after, .client-testimonial-swiper .swiper::before {

    display: block;

  }

}

.client-testimonial-swiper .swiper::after {

  background: linear-gradient(90deg, #060606 0%, rgba(6, 6, 6, 0) 100%);

  left: 0;

  top: 0;

}

.client-testimonial-swiper .swiper::before {

  background: linear-gradient(90deg, #060606 0%, rgba(6, 6, 6, 0) 100%);

  right: 0;

  top: 0;

  z-index: 2;

  transform: rotate(180deg);

}



.tmp-swiper-pagination .swiper-pagination-bullet {

  width: 8px;

  height: 8px;

  display: inline-block;

  opacity: 1;

  border-radius: 100%;

  background: transparent;

  box-shadow: inset 0 0 0 5px var(--color-gray-2);

  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);

  margin: 0 8px !important;

}

.tmp-swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {

  background: transparent;

  box-shadow: inset 0 0 0 1px var(--color-primary);

  transform: scale(2);

  opacity: 1;

}

.tmp-swiper-pagination.tmp-swiper-pagination-01 .swiper-pagination-bullet {

  width: 12px;

  height: 12px;

  box-shadow: inset 0 0 0 7px #212629;

  transition: var(--transition);

}

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

  .tmp-swiper-pagination.tmp-swiper-pagination-01 .swiper-pagination-bullet {

    width: 8px;

    height: 8px;

  }

}

.tmp-swiper-pagination.tmp-swiper-pagination-01 .swiper-pagination-bullet:hover {

  box-shadow: inset 0 0 0 7px var(--color-primary);

}

.tmp-swiper-pagination.tmp-swiper-pagination-01 .swiper-pagination-bullet.swiper-pagination-bullet-active {

  box-shadow: inset 0 0 0 1px var(--color-primary);

}

.tmp-swiper-pagination.tmp-swiper-pagination-01 .swiper-pagination-bullet.swiper-pagination-bullet-active::before {

  content: "";

  position: absolute;

  height: 4px;

  width: 4px;

  background: var(--color-primary);

  border-radius: 100%;

  left: 50%;

  top: 50%;

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

}



.client-testimonial-swiper .tmp-swiper-pagination {

  position: absolute;

  bottom: -60px;

  left: 50%;

  width: max-content;

  transform: translateX(-50%);

}

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

  .client-testimonial-swiper .tmp-swiper-pagination {

    bottom: -50px;

  }

}

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

  .client-testimonial-swiper .tmp-swiper-pagination {

    bottom: -50px;

  }

}



.testimonial-inner-style-two {

  padding: 45px 44px;

  border-radius: 10px;

  position: relative;

  z-index: 1;

  height: 100%;

  border-radius: 20px;

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

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

  transition: var(--transition);

}

.testimonial-inner-style-two .testimonial-header {

  display: flex;

  align-items: center;

  margin-bottom: 25px;

}

.testimonial-inner-style-two .testimonial-header .thumbnail img {

  width: 50px;

  border-radius: 50%;

}

.testimonial-inner-style-two .testimonial-header .ts-header {

  font-size: 14px;

  margin: 0;

  margin-left: 10px;

  font-weight: 500;

}

.testimonial-inner-style-two .testimonial-header .ts-header .text-color-primary {

  color: var(--color-primary);

  font-weight: 600;

  font-size: 18px;

}

.testimonial-inner-style-two .testimonial-body p.discription {

  font-size: 16px;

  line-height: 28px;

  color: var(--color-lightn);

  margin-bottom: 22px;

  transition: var(--transition);

  margin: 0;

  font-weight: 400;

  text-align: left;

}

.testimonial-inner-style-two .testimonial-body p.discription span {

  text-decoration: underline;

  font-weight: 500;

  transition: var(--transition);

  cursor: pointer;

}



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

  RPP Banner One Area

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

.tmp-gradient-main {

  position: relative;

  z-index: 1;

}

.tmp-gradient-main .tmp-gradient-wrapper {

  filter: blur(115px);

  position: absolute;

  left: 72%;

  top: 50%;

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

  opacity: 0.8;

  z-index: -1;

}



.banner-right-thumbnail-area.v2 .banner-right-thumb-left-content .title {

  font-size: 90px;

}

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

  .banner-right-thumbnail-area.v2 .banner-right-thumb-left-content .title {

    font-size: 65px;

  }

}

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

  .banner-right-thumbnail-area.v2 .banner-right-thumb-left-content .title {

    font-size: 65px;

  }

}

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

  .banner-right-thumbnail-area.v2 .banner-right-thumb-left-content .title {

    font-size: 45px;

  }

}

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

  .banner-right-thumbnail-area.v2 .banner-right-thumb-left-content .title {

    font-size: 40px;

  }

}



.bg_image {

  background-repeat: no-repeat;

  background-size: cover;

  background-position: center center;

}



.tmp-banner-one-area {

  padding-top: 26px;

  background-image: url("../images/banner/banner-background-one.jpg");

  background-position: center;

  background-size: cover;

  background-repeat: no-repeat;

  padding-top: 120px;

}

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

  .tmp-banner-one-area {

    padding-bottom: 100px;

  }

}

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

  .tmp-banner-one-area {

    padding-bottom: 100px;

  }

}

.tmp-banner-one-area.add-pattern {

  background-image: none;

  position: relative;

  z-index: 1;

}

.tmp-banner-one-area.add-pattern::before {

  content: "";

  position: absolute;

  top: 0;

  bottom: 0;

  left: 0;

  right: 0;

  mix-blend-mode: overlay;

  background-image: linear-gradient(var(--color-white), transparent 1px), linear-gradient(to right, var(--color-white), transparent 1px);

  background-size: 100% 100px, 100px 100%;

  opacity: 0.08;

  width: 100%;

  height: 100%;

  z-index: -1;

  background-attachment: fixed;

}

.tmp-banner-one-area.style-2 {

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

  min-height: 950px;

  display: flex;

  align-items: center;

  overflow: hidden;

}

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

  .tmp-banner-one-area.style-2 {

    min-height: auto;

    padding: 100px 0;

    padding-top: 150px;

  }

}

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

  .tmp-banner-one-area.style-2 {

    min-height: auto;

    padding: 150px 0;

    padding-top: 150px;

  }

}

.tmp-banner-one-area.style-2 .inner .title {

  font-size: 64px;

  line-height: 1.2;

}

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

  .tmp-banner-one-area.style-2 .inner .title {

    font-size: 60px;

  }

}

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

  .tmp-banner-one-area.style-2 .inner .title {

    font-size: 58px;

  }

}

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

  .tmp-banner-one-area.style-2 .inner .title {

    font-size: 52px;

  }

}

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

  .tmp-banner-one-area.style-2 .inner .title {

    font-size: 34px;

  }

}

.tmp-banner-one-area.style-3, .tmp-banner-one-area.style-4 {

  min-height: 850px;

  display: flex;

  align-items: center;

  justify-content: center;

  padding-top: 0;

  background-image: url(../images/banner/banner-background-02.jpg);

}

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

  .tmp-banner-one-area.style-3, .tmp-banner-one-area.style-4 {

    height: auto;

    padding-top: 100px;

    padding-bottom: 70px;

    min-height: auto;

  }

}

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

  .tmp-banner-one-area.style-3, .tmp-banner-one-area.style-4 {

    padding-bottom: 10px;

  }

}

.tmp-banner-one-area.style-3 .thumbnail-author, .tmp-banner-one-area.style-4 .thumbnail-author {

  position: relative;

  z-index: 1;

  max-width: max-content;

  margin: auto;

  margin-bottom: 20px;

}

.tmp-banner-one-area.style-3 .thumbnail-author .loader-bg-pattern-wrapper, .tmp-banner-one-area.style-4 .thumbnail-author .loader-bg-pattern-wrapper {

  top: 50%;

}

.tmp-banner-one-area.style-3 .thumbnail-author .loader-bg-pattern-wrapper .loader-bg-pattern, .tmp-banner-one-area.style-4 .thumbnail-author .loader-bg-pattern-wrapper .loader-bg-pattern {

  --size: 380px;

  --duration: 4s;

  --logo-color: grey;

  --background: linear-gradient( 0deg, rgba(50, 50, 50, 0.2) 0%, rgba(100, 100, 100, 0.2) 100% );

  height: var(--size);

  aspect-ratio: 1;

  position: relative;

}

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

  .tmp-banner-one-area.style-3 .thumbnail-author .loader-bg-pattern-wrapper .loader-bg-pattern, .tmp-banner-one-area.style-4 .thumbnail-author .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size: 260px;

  }

}

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

  .tmp-banner-one-area.style-3 .thumbnail-author .loader-bg-pattern-wrapper .loader-bg-pattern, .tmp-banner-one-area.style-4 .thumbnail-author .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size: 230px;

  }

}

.tmp-banner-one-area.style-3 .thumbnail-author img, .tmp-banner-one-area.style-4 .thumbnail-author img {

  border-radius: 100%;

  border: 25px solid #141414;

  width: 350px;

  height: 350px;

  object-fit: cover;

  min-width: 350px;

}

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

  .tmp-banner-one-area.style-3 .thumbnail-author img, .tmp-banner-one-area.style-4 .thumbnail-author img {

    width: 250px;

    height: 250px;

    min-width: 250px;

  }

}

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

  .tmp-banner-one-area.style-3 .inner .title, .tmp-banner-one-area.style-4 .inner .title {

    font-size: 40px;

  }

}

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

  .tmp-banner-one-area.style-3 .inner .title, .tmp-banner-one-area.style-4 .inner .title {

    font-size: 34px;

  }

}

.tmp-banner-one-area.style-4 {

  min-height: 900px;

  background-image: url(../images/banner/banner-background-04.jpg);

  position: relative;

  background-image: none;

}

.tmp-banner-one-area.style-4 .galaxy {

  height: 100%;

  width: 100%;

  background-image: linear-gradient(to right, #19191b 1px, transparent 1px), linear-gradient(to bottom, #19191b 1px, transparent 1px);

  background-size: 13rem 13rem;

  background-position: center center;

  position: absolute;

  z-index: -1;

  filter: blur(0);

}

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

  .tmp-banner-one-area.style-4 {

    height: auto;

    padding-top: 100px;

    padding-bottom: 70px;

    min-height: auto;

  }

}



.loader-bg-pattern-wrapper {

  position: absolute;

  left: 50%;

  z-index: -1;

  top: 34.1%;

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

}

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

  .loader-bg-pattern-wrapper {

    top: 35.1%;

  }

}

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

  .loader-bg-pattern-wrapper {

    top: 28.8%;

  }

}

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

  .loader-bg-pattern-wrapper {

    top: 38.1%;

  }

}

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

  .loader-bg-pattern-wrapper {

    top: 36%;

  }

}

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

  .loader-bg-pattern-wrapper {

    top: 36%;

  }

}

.loader-bg-pattern-wrapper .loader-bg-pattern {

  --size: 450px;

  --duration: 4s;

  --logo-color: grey;

  --background: linear-gradient(

    0deg,

    rgba(50, 50, 50, 0.2) 0%,

    rgba(100, 100, 100, 0.2) 100%

  );

  height: var(--size);

  aspect-ratio: 1;

  position: relative;

}

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

  .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:420px;

  }

}

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

  .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:400px;

  }

}

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

  .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:320px;

  }

}

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

  .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:220px ;

  }

}

.loader-bg-pattern-wrapper .loader-bg-pattern .box {

  position: absolute;

  background: rgba(100, 100, 100, 0.15);

  background: var(--background);

  border-radius: 50%;

  border-top: 1px solid rgb(100, 100, 100);

  box-shadow: rgba(0, 0, 0, 0.3) 0px 10px 10px 0px;

  backdrop-filter: blur(5px);

  animation: ripple var(--duration) infinite ease-in-out;

}

.loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(1) {

  inset: 40%;

  z-index: 99;

}

.loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(2) {

  inset: 30%;

  z-index: 98;

  border-color: rgba(100, 100, 100, 0.8);

  animation-delay: 0.2s;

}

.loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(3) {

  inset: 20%;

  z-index: 97;

  border-color: rgba(100, 100, 100, 0.6);

  animation-delay: 0.4s;

}

.loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(4) {

  inset: 10%;

  z-index: 96;

  border-color: rgba(100, 100, 100, 0.4);

  animation-delay: 0.6s;

}

.loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(5) {

  inset: 0%;

  z-index: 95;

  border-color: rgba(100, 100, 100, 0.2);

  animation-delay: 0.8s;

}

.loader-bg-pattern-wrapper .loader-bg-pattern .logo {

  position: absolute;

  inset: 0;

  display: grid;

  place-content: center;

  padding: 30%;

}

.loader-bg-pattern-wrapper .loader-bg-pattern .logo svg {

  fill: var(--logo-color);

  width: 100%;

  animation: color-change var(--duration) infinite ease-in-out;

}

@keyframes ripple {

  0% {

    transform: scale(1);

    box-shadow: rgba(0, 0, 0, 0.3) 0px 10px 10px 0px;

  }

  50% {

    transform: scale(1.3);

    box-shadow: rgba(0, 0, 0, 0.3) 0px 30px 20px 0px;

  }

  100% {

    transform: scale(1);

    box-shadow: rgba(0, 0, 0, 0.3) 0px 10px 10px 0px;

  }

}

@keyframes color-change {

  0% {

    fill: var(--logo-color);

  }

  50% {

    fill: white;

  }

  100% {

    fill: var(--logo-color);

  }

}



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

  RPP Banner Two Area

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

.rpp-banner-two-area {

  padding-top: 106px;

  position: relative;

  z-index: 1;

  overflow: hidden;

}

.rpp-banner-two-area::after, .rpp-banner-two-area::before {

  content: " ";

  opacity: 0.3;

  background: var(--color-primary);

  position: absolute;

  width: 611px;

  height: 611px;

  border-radius: 100px;

  filter: blur(300px);

  z-index: -1;

}

.rpp-banner-two-area::before {

  top: -73px;

  left: -292px;

}

.rpp-banner-two-area::after {

  top: -73px;

  right: -292px;

}

.rpp-banner-two-area .banner-shape-two {

  position: absolute;

  top: 0;

  opacity: 0.5;

  left: 0;

  z-index: -1;

}



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

  RPP Banner Four Area

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

.rpp-banner-four-area {

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

  overflow: hidden;

}



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

  Banner One Main Wrapper

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

.tmp-white-version.index-ten .banner-one-main-wrapper .inner .title {

  margin-top: 0 !important;

}



.index-11 .banner-one-main-wrapper .inner .title {

  margin-top: 0 !important;

}



.banner-one-main-wrapper .inner .sub-title {

  color: var(--color-heading);

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

  font-size: 20px;

  font-weight: 400;

  line-height: 38px;

  text-transform: uppercase;

  margin-bottom: 15px;

  display: inline-flex;

}

.banner-one-main-wrapper .inner .title {

  color: var(--color-heading);

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

  font-size: 62px;

  line-height: 1.3;

  font-weight: 700;

  margin-bottom: 0;

  position: relative;

  z-index: 2;

  margin-top: 327px;

}

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

  .banner-one-main-wrapper .inner .title {

    font-size: 54px;

  }

}

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

  .banner-one-main-wrapper .inner .title {

    font-size: 54px;

  }

}

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

  .banner-one-main-wrapper .inner .title {

    font-size: 54px;

  }

}

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

  .banner-one-main-wrapper .inner .title {

    font-size: 32px;

  }

}

.banner-one-main-wrapper .inner .title span {

  color: var(--color-primary);

}

.banner-one-main-wrapper .inner .disc {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 31px;

  margin-bottom: 0;

  margin-top: 22px;

}

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

  .banner-one-main-wrapper .inner .disc {

    margin-top: 9px;

    font-size: 16px;

    font-weight: 400;

    line-height: 28px;

  }

}

.banner-one-main-wrapper .inner .button-area-banner-one {

  margin-top: 39px;

  position: relative;

  z-index: 2;

}

.banner-one-main-wrapper .banner-right-content {

  position: relative;

  z-index: 1;

  display: flex;

  justify-content: end;

}

@media (min-width: 1450px) {

  .banner-one-main-wrapper .banner-right-content {

    right: -80px;

  }

}

.banner-one-main-wrapper .banner-right-content img {

  max-width: 600px;

  height: auto;

  object-fit: contain;

  margin-right: 70px;

}

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

  .banner-one-main-wrapper .banner-right-content img {

    margin-right: 0;

  }

}

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

  .banner-one-main-wrapper .banner-right-content img {

    margin-right: 0;

  }

}

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

  .banner-one-main-wrapper .banner-right-content img {

    margin: auto;

  }

}

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

  .banner-one-main-wrapper .banner-right-content img {

    margin: auto;

  }

}

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

  .banner-one-main-wrapper .banner-right-content img {

    max-width: 260px;

  }

}

.banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

  color: var(--color-heading);

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

  font-size: 48px;

  line-height: 1.2;

  font-weight: 700;

  position: absolute;

  margin-bottom: 0;

  top: 25%;

  z-index: -1;

  display: flex;

  align-items: center;

  justify-content: center;

  width: 100%;

}

@media (min-width: 300px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

    font-size: 50px;

  }

}

@media (min-width: 500px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

    font-size: 60px;

  }

}

@media (min-width: 600px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

    font-size: 60px;

  }

}

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

  .banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

    font-size: 60px;

  }

}

@media (min-width: 1200px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

    font-size: 70px;

  }

}

@media (min-width: 1500px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

    font-size: 73px;

  }

}

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

  .banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

    font-size: 48px;

  }

}

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

  .banner-one-main-wrapper .banner-right-content .banner-big-text-1 {

    font-size: 46px;

  }

}

.banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

  position: absolute;

  bottom: 190px;

  left: 0px;

  font-size: 48px;

  line-height: 1.2;

  -webkit-text-stroke: 1px var(--color-heading);

  color: transparent;

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

  font-weight: 700;

  margin-bottom: 0;

  display: flex;

  align-items: center;

  justify-content: center;

  width: 100%;

}

@media (min-width: 300px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 50px;

    bottom: 30px;

  }

}

@media (min-width: 500px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 50px;

    bottom: 30px;

  }

}

@media (min-width: 500px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 60px;

    bottom: 100px;

  }

}

@media (min-width: 600px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 60px;

  }

}

@media (min-width: 1200px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 60px;

  }

}

@media (min-width: 1500px) {

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 73px;

  }

}

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

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 60px;

  }

}

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

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 48px;

  }

}

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

  .banner-one-main-wrapper .banner-right-content .banner-big-text-2 {

    font-size: 46px;

  }

}



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

  Banner Two Main Wrapper

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

.banner-two-main-wrapper {

  padding-bottom: 94px;

}

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

  .banner-two-main-wrapper {

    padding-bottom: 0;

  }

}

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

  .banner-two-main-wrapper {

    padding-bottom: 0;

  }

}

.banner-two-main-wrapper .inner .sub-title {

  color: var(--color-primary);

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

  font-size: 18px;

  font-weight: 700;

  line-height: 27px;

  letter-spacing: 4px;

  text-transform: uppercase;

  margin-bottom: 7px;

  display: inline-flex;

}

.banner-two-main-wrapper .inner .title {

  color: var(--color-heading);

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

  font-size: 42px;

  line-height: 38px;

  font-weight: 700;

  margin-bottom: 0;

  line-height: 1.3;

}

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

  .banner-two-main-wrapper .inner .title {

    font-size: 42px;

  }

}

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

  .banner-two-main-wrapper .inner .title {

    font-size: 32px;

  }

}

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

  .banner-two-main-wrapper .inner .title {

    font-size: 28px;

  }

}

.banner-two-main-wrapper .inner .title span {

  color: var(--color-primary);

}

.banner-two-main-wrapper .inner .disc {

  color: var(--color-gray);

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

  font-size: 20px;

  font-weight: 400;

  line-height: 34px;

  margin-bottom: 0;

  margin-top: 16px;

}

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

  .banner-two-main-wrapper .inner .disc {

    font-size: 18px;

    line-height: 30px;

  }

}

.banner-two-main-wrapper .inner .disc span {

  color: var(--color-primary);

}

.banner-two-main-wrapper .inner .button-area-banner-two {

  margin-top: 39px;

}

.banner-two-main-wrapper .banner-right-content .main-img {

  position: relative;

  z-index: 0;

  display: flex;

  justify-content: center;

}

.banner-two-main-wrapper .banner-right-content .main-img::after {

  content: " ";

  position: absolute;

  bottom: 0;

  left: 0;

  background: linear-gradient(180deg, rgba(6, 6, 6, 0) 46.14%, #010c13 100%);

  width: 100%;

  height: 580.327px;

  z-index: 0;

}

.banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-1 {

  color: var(--color-heading);

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

  font-size: 60px;

  font-weight: 700;

  line-height: 70px;

  position: absolute;

  top: 265px;

  z-index: -1;

}

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

  .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-1 {

    display: none;

  }

}

@media (min-width: 576px) {

  .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-1 {

    font-size: 60px;

    line-height: 110px;

  }

}

@media (min-width: 992px) {

  .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-1 {

    font-size: 90px;

    line-height: 105px;

  }

}

@media (min-width: 1200px) {

  .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-1 {

    font-size: 94px;

    line-height: 120px;

  }

}

.banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-2 {

  -webkit-text-stroke: 1px var(--color-heading);

  color: transparent;

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

  font-size: 60px;

  line-height: 70px;

  font-weight: 700;

  position: absolute;

  bottom: 110px;

  z-index: 1;

  margin-bottom: 0;

}

@media (min-width: 400px) {

  .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-2 {

    font-size: 75px;

    line-height: 85px;

  }

}

@media (min-width: 576px) {

  .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-2 {

    font-size: 60px;

    line-height: 110px;

  }

}

@media (min-width: 992px) {

  .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-2 {

    font-size: 66px;

    line-height: 105px;

  }

}

@media (min-width: 1200px) {

  .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-2 {

    font-size: 94px;

    line-height: 120px;

  }

}

.banner-two-main-wrapper .banner-right-content .main-img .logo-under-img-wrap {

  position: absolute;

  width: 100px;

  left: 0;

  bottom: 0;

  z-index: 2;

}

@media (min-width: 992px) {

  .banner-two-main-wrapper .banner-right-content .main-img .logo-under-img-wrap {

    width: 200px;

    left: -110px;

    bottom: -74px;

  }

}

.banner-two-main-wrapper .banner-right-content .main-img .logo-under-img-wrap .logo-under-img {

  position: relative;

  left: 0;

  bottom: 0;

  transition: 0.3s;

  animation: rotateIn-2 20s linear infinite;

}

.banner-two-main-wrapper .banner-right-content .main-img .logo-under-img-wrap .logo-under-img-2 {

  position: absolute;

  left: 50%;

  top: 50%;

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

}

.banner-two-main-wrapper .banner-right-content .main-img .benner-two-bg-red-img {

  position: absolute;

  bottom: 0;

  z-index: -1;

}



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

  Banner Four Main Wrapper, Banner Six Main Wrapper

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

.banner-four-main-wrapper .inner .sub-title,

.banner-six-main-wrapper .inner .sub-title {

  color: var(--color-primary);

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

  font-size: 32px;

  font-style: normal;

  font-weight: 700;

  line-height: 130%;

  text-transform: capitalize;

  margin-bottom: 10px;

}

.banner-four-main-wrapper .inner .title,

.banner-six-main-wrapper .inner .title {

  color: var(--color-heading);

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

  font-weight: 700;

  margin-bottom: 20px;

  font-size: 48px;

  line-height: 58px;

}

@media (min-width: 668px) {

  .banner-four-main-wrapper .inner .title,

  .banner-six-main-wrapper .inner .title {

    font-size: 110px;

    line-height: 100%;

  }

}

@media (min-width: 992px) and (max-width: 1200px) {

  .banner-four-main-wrapper .inner .title,

  .banner-six-main-wrapper .inner .title {

    font-size: 90px;

    line-height: 100px;

  }

}

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

  .banner-four-main-wrapper .inner .title,

  .banner-six-main-wrapper .inner .title {

    font-size: 50px;

    margin-bottom: 9px;

  }

}

.banner-four-main-wrapper .inner .description,

.banner-six-main-wrapper .inner .description {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-bottom: 50px;

}

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

  .banner-four-main-wrapper .inner .description,

  .banner-six-main-wrapper .inner .description {

    margin-bottom: 20px;

  }

}

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

  .banner-four-main-wrapper .inner .description,

  .banner-six-main-wrapper .inner .description {

    margin-bottom: 20px;

  }

}



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

  Banner Four Main Wrapper

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

.banner-four-main-wrapper {

  position: relative;

  z-index: 1;

  padding: 80px 0;

}

@media (min-width: 992px) {

  .banner-four-main-wrapper {

    padding: 220px 0 199px 0;

  }

}

.banner-four-main-wrapper .row {

  justify-content: space-between;

}

@media (min-width: 1400px) {

  .banner-four-main-wrapper .banner-right-content {

    padding: 0 57px;

  }

}

.banner-four-main-wrapper .banner-right-content .find-me-on {

  margin-top: 33px;

}

.banner-four-main-wrapper .banner-right-content .year-expariance-wrap {

  display: flex;

  align-items: center;

  gap: 20px;

}

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

  .banner-four-main-wrapper .banner-right-content .year-expariance-wrap {

    gap: 10px;

  }

}

.banner-four-main-wrapper .banner-right-content .year-expariance-wrap .title {

  color: var(--color-heading);

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

  font-size: 68px;

  font-weight: 700;

  line-height: 78px;

  margin-bottom: 0;

}

.banner-four-main-wrapper .banner-right-content .year-expariance-wrap .para {

  color: var(--color-heading);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

@media (min-width: 992px) {

  .banner-four-main-wrapper .bg-benner-img-four {

    position: absolute;

    right: 0;

    bottom: 0;

    z-index: -1;

  }

}

.banner-four-main-wrapper .banner-four-right-bg-img {

  position: absolute;

  right: 0;

  top: 0;

  z-index: -2;

}



.rpp-banner-four-area {

  position: relative;

  overflow: hidden;

  z-index: 1;

}

.rpp-banner-four-area .banner-four-left-bg-img {

  position: absolute;

  left: 0;

  top: 0;

  z-index: -1;

}



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

  Banner Five Main Wrapper

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

.banner-five-main-wrapper {

  padding-top: 174px;

}

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

  .banner-five-main-wrapper {

    padding-top: 100px;

    padding-bottom: 80px;

  }

}

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

  .banner-five-main-wrapper {

    padding-top: 100px;

    padding-bottom: 80px;

  }

}

.banner-five-main-wrapper .inner .title {

  color: var(--color-heading);

  text-align: center;

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

  font-weight: 700;

  font-size: 38px;

  line-height: 48px;

  margin-bottom: 0;

  position: relative;

  z-index: 2;

}

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

  .banner-five-main-wrapper .inner .title {

    font-size: 49px;

    line-height: 1.2;

  }

}

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

  .banner-five-main-wrapper .inner .title {

    font-size: 52px;

    line-height: 1.2;

  }

}

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

  .banner-five-main-wrapper .inner .title {

    font-size: 40px;

    line-height: 56px;

  }

}

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

  .banner-five-main-wrapper .inner .title {

    font-size: 26px;

    line-height: 38px;

  }

}

.banner-five-main-wrapper .bg-benner-img-five {

  position: relative;

  z-index: 1;

  display: flex;

  justify-content: center;

}

.banner-five-main-wrapper .bg-benner-img-five::before {

  content: " ";

  position: absolute;

  width: 100%;

  height: 300px;

  bottom: 0;

  z-index: -1;

  background: linear-gradient(180deg, #FF494A 0%, rgba(255, 73, 74, 0) 100%);

  border-radius: 291.5px 291.5px 0px 0px;

}

@media (min-width: 400px) {

  .banner-five-main-wrapper .bg-benner-img-five::before {

    height: 482px;

  }

}

.banner-five-main-wrapper .bg-benner-img-five img {

  width: 76%;

  margin: auto;

}

.banner-five-main-wrapper .banner-left-content .banner-counter ul {

  display: flex;

  gap: 10px;

  flex-wrap: wrap;

}

@media (min-width: 992px) {

  .banner-five-main-wrapper .banner-left-content .banner-counter ul {

    display: inherit;

  }

}

.banner-five-main-wrapper .banner-left-content .banner-counter ul li {

  margin: 0;

}

@media (min-width: 992px) {

  .banner-five-main-wrapper .banner-left-content .banner-counter ul li {

    margin-bottom: 76px;

  }

}

.banner-five-main-wrapper .banner-left-content .banner-counter ul li:last-child {

  margin-bottom: 0;

}

.banner-five-main-wrapper .banner-left-content .banner-counter ul li .banner-counter-card .title {

  color: var(--color-heading);

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

  font-size: 26px;

  line-height: 36px;

  font-weight: 700;

  text-transform: capitalize;

  margin-bottom: 4px;

}

@media (min-width: 576px) {

  .banner-five-main-wrapper .banner-left-content .banner-counter ul li .banner-counter-card .title {

    font-size: 48px;

    line-height: 60px;

  }

}

.banner-five-main-wrapper .banner-left-content .banner-counter ul li .banner-counter-card .para {

  color: var(--color-gray);

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

  font-weight: 400;

  font-size: 13px;

  line-height: 23px;

}

@media (min-width: 576px) {

  .banner-five-main-wrapper .banner-left-content .banner-counter ul li .banner-counter-card .para {

    font-size: 16px;

    line-height: 30px;

  }

}

.banner-five-main-wrapper .banner-right-content .banner-contact-info .contact-info {

  margin-bottom: 20px;

  background: transparent;

  justify-content: flex-end;

  align-items: flex-end;

  padding: 0;

}

@media (min-width: 1400px) {

  .banner-five-main-wrapper .banner-right-content .banner-contact-info .contact-info {

    margin-bottom: 90px;

  }

}

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

  .banner-five-main-wrapper .banner-right-content .banner-contact-info .contact-info {

    justify-content: flex-start;

    align-items: flex-start;

  }

}

.banner-five-main-wrapper .banner-right-content .banner-contact-info .contact-info:last-child {

  margin-bottom: 0;

}

.banner-five-main-wrapper .banner-right-content .banner-contact-info .contact-info .title {

  color: var(--color-heading);

  text-align: right;

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

  font-size: 24px;

  font-weight: 700;

  line-height: 30px;

  margin-bottom: 13px;

}

.banner-five-main-wrapper .banner-right-content .banner-contact-info .contact-info .para {

  color: var(--color-gray);

  text-align: right;

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-bottom: 8px;

}

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

  .banner-five-main-wrapper .banner-right-content .banner-contact-info .contact-info .para {

    text-align: left;

  }

}

.banner-five-main-wrapper .banner-right-content .banner-contact-info .contact-info .para:last-child {

  margin-bottom: 0;

}



.rpp-banner-five-area {

  position: relative;

  overflow: hidden;

  z-index: 1;

  background-color: #0F0F0F;

}

.rpp-banner-five-area .banner-shape-img-bg {

  position: absolute;

  bottom: 0;

  left: 0;

  z-index: -1;

  width: 100%;

  top: 0;

  right: 0;

}



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

  Banner Six Main Wrapper

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

.rpp-banner-six-area {

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

  position: relative;

  z-index: 1;

  overflow: hidden;

}

.rpp-banner-six-area .bg-left-shape {

  position: absolute;

  left: 0;

  top: 0;

  z-index: -1;

}



.banner-six-main-wrapper {

  padding: 80px 0;

}

@media (min-width: 992px) {

  .banner-six-main-wrapper {

    padding-top: 233px;

    padding-bottom: 136px;

  }

}



.bg-benner-img-six {

  display: flex;

  justify-content: center;

  align-items: center;

  position: relative;

}

.bg-benner-img-six img {

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

  border-radius: 100%;

}

.bg-benner-img-six::after {

  content: url("../images/banner/banner-six-shape.png");

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%) rotate(0deg);

  animation: banner-cycle-animation 50s linear infinite;

  display: none;

}

@media (min-width: 1400px) {

  .bg-benner-img-six::after {

    display: block;

  }

}

@keyframes banner-cycle-animation {

  from {

    transform: translate(-50%, -50%) rotate(0deg);

  }

  to {

    transform: translate(-50%, -50%) rotate(360deg);

  }

}



.rpp-banner-five-area .banner-shape-img-bg img {

  height: 100%;

  width: 100%;

}



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

  Find Me On

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

.find-me-on {

  margin-top: 60px;

}

.find-me-on .find-me-on-title {

  color: var(--color-heading);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-bottom: 10px;

}



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

  Text Para Doc Wrap

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

.text-para-doc-wrap {

  position: relative;

}

.text-para-doc-wrap .text-para-documents {

  color: var(--color-heading);

  text-align: center;

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

  font-weight: 700;

}

@media (min-width: 576px) {

  .text-para-doc-wrap .text-para-documents {

    font-size: 40px;

    line-height: 1.45;

  }

}

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

  .text-para-doc-wrap .text-para-documents {

    font-size: 40px;

  }

}

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

  .text-para-doc-wrap .text-para-documents {

    font-size: 25px;

    line-height: 1.5;

  }

}

.text-para-doc-wrap .text-para-documents span {

  color: var(--color-primary);

}

.text-para-doc-wrap .right-bg-text-para {

  position: absolute;

  right: -150px;

  top: 0;

  display: none;

  pointer-events: none;

}

@media (min-width: 1200px) {

  .text-para-doc-wrap .right-bg-text-para {

    display: block;

  }

}

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

  .text-para-doc-wrap .right-bg-text-para {

    right: 0;

  }

}

.text-para-doc-wrap .left-bg-text-para {

  position: absolute;

  left: -150px;

  top: 0;

  display: none;

  pointer-events: none;

}

@media (min-width: 1200px) {

  .text-para-doc-wrap .left-bg-text-para {

    display: block;

  }

}

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

  .text-para-doc-wrap .left-bg-text-para {

    left: 0;

  }

}



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

  Banner Three Main Wrapper

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

.banner-three-main-wrapper {

  position: relative;

  padding: 80px 0;

  display: flex;

  flex-direction: column-reverse;

}

@media (min-width: 992px) {

  .banner-three-main-wrapper {

    padding-top: 250px;

    padding-bottom: 250px;

  }

}

@media (min-width: 1200px) {

  .banner-three-main-wrapper {

    padding-top: 300px;

    padding-bottom: 358px;

  }

}

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

  .banner-three-main-wrapper {

    padding-bottom: 0;

  }

}

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

  .banner-three-main-wrapper {

    padding-bottom: 0;

  }

}

.banner-three-main-wrapper .row {

  justify-content: space-between;

}

.banner-three-main-wrapper .banner-right-content {

  position: relative;

  z-index: 2;

}

.banner-three-main-wrapper .banner-right-content .about-me .title {

  color: var(--color-heading);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

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

  .banner-three-main-wrapper .banner-right-content .about-me .title {

    margin-bottom: 4px;

  }

}

.banner-three-main-wrapper .banner-right-content .about-me .para {

  color: var(--color-gray);

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

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

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

  .banner-three-main-wrapper .banner-right-content .about-me .para {

    width: 68%;

  }

}

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

  .banner-three-main-wrapper .banner-right-content .about-me .para {

    width: 80%;

  }

}

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

  .banner-three-main-wrapper .banner-right-content .about-me .para {

    width: 100%;

  }

}

.banner-three-main-wrapper .banner-right-content .about-me .para span {

  color: var(--color-primary);

}

.banner-three-main-wrapper .banner-right-content .find-me-on {

  margin-top: 11px;

}

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

  .banner-three-main-wrapper .inner {

    padding-top: 40px;

  }

}

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

  .banner-three-main-wrapper .inner {

    padding-top: 30px;

  }

}

.banner-three-main-wrapper .inner .sub-title {

  color: var(--color-heading);

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

  font-size: 28px;

  font-weight: 700;

  line-height: 38px;

  text-transform: uppercase;

}

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

  .banner-three-main-wrapper .inner .sub-title {

    font-size: 20px;

  }

}

.banner-three-main-wrapper .inner .title {

  color: var(--color-heading);

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

  font-weight: 700;

  font-size: 38px;

  line-height: 48px;

}

@media (min-width: 1268px) {

  .banner-three-main-wrapper .inner .title {

    font-size: 90px;

    line-height: 115%;

  }

}

@media (min-width: 992px) and (max-width: 1120px) {

  .banner-three-main-wrapper .inner .title {

    font-size: 64px;

    line-height: 1.2;

  }

}

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

  .banner-three-main-wrapper .inner .title {

    font-size: 65px;

    line-height: 115%;

    margin-bottom: 12px;

  }

}

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

  .banner-three-main-wrapper .inner .title {

    margin-bottom: 10px;

  }

}

.banner-three-main-wrapper .bg-benner-img-three {

  width: 100%;

  position: relative;

}

.banner-three-main-wrapper .bg-benner-img-three img {

  width: 100%;

}

@media (min-width: 992px) {

  .banner-three-main-wrapper .bg-benner-img-three::before {

    content: " ";

    position: absolute;

    left: -100px;

    bottom: -50px;

    width: 939px;

    height: 800px;

    background: linear-gradient(180deg, rgba(7, 7, 7, 0) 13.58%, #080808 92.06%);

    filter: blur(50px);

    z-index: 1;

  }

}

@media (min-width: 992px) {

  .banner-three-main-wrapper .bg-benner-img-three {

    position: absolute;

    top: 50%;

    left: 50%;

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

    z-index: 0;

    width: inherit;

  }

}

.banner-three-main-wrapper .texts-one {

  position: absolute;

  bottom: 5%;

  left: 10%;

  -webkit-text-stroke: 1.25px var(--color-gray);

  color: transparent;

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

  font-size: 212.855px;

  font-weight: 700;

  line-height: 115%;

  z-index: -1;

}

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

  .banner-three-main-wrapper .texts-one {

    bottom: 20%;

    font-size: 100px;

  }

}

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

  .banner-three-main-wrapper .texts-one {

    bottom: 50%;

    font-size: 100px;

    z-index: 2;

  }

}

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

  .banner-three-main-wrapper .texts-one {

    bottom: 50%;

    font-size: 80px;

    z-index: 2;

    display: none;

  }

}

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

  .banner-three-main-wrapper .texts-one {

    bottom: 45%;

    font-size: 70px;

    z-index: 2;

  }

}

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

  .banner-three-main-wrapper .texts-one {

    display: none;

  }

}

.banner-three-main-wrapper .texts-two {

  position: absolute;

  bottom: 0;

  left: 20%;

  -webkit-text-stroke: 1.25px #FF494A;

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

  font-size: 150px;

  font-weight: 700;

  line-height: 115%;

  color: transparent;

}

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

  .banner-three-main-wrapper .texts-two {

    bottom: 5%;

    font-size: 100px;

  }

}

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

  .banner-three-main-wrapper .texts-two {

    bottom: 40%;

    font-size: 100px;

    z-index: 2;

  }

}

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

  .banner-three-main-wrapper .texts-two {

    bottom: 45%;

    font-size: 80px;

    z-index: 2;

  }

}

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

  .banner-three-main-wrapper .texts-two {

    bottom: 45%;

    font-size: 70px;

    z-index: 2;

  }

}

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

  .banner-three-main-wrapper .texts-two {

    display: none;

  }

}



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

  Up Down Animation Start

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

.up-down {

  -webkit-animation: up-down 1s infinite alternate;

  animation: up-down 1s infinite alternate;

}



@-webkit-keyframes up-down {

  0% {

    transform: translateY(0);

  }

  100% {

    transform: translateY(-10px);

  }

}

@keyframes up-down {

  0% {

    transform: translateY(0);

  }

  100% {

    transform: translateY(-10px);

  }

}

.up-down-2 {

  -webkit-animation: up-down-2 0.9s infinite alternate;

  animation: up-down-2 0.9s infinite alternate;

}



@-webkit-keyframes up-down-2 {

  0% {

    transform: translateY(-10px);

  }

  100% {

    transform: translateY(0);

  }

}

@keyframes up-dow-2 {

  0% {

    transform: translateY(-10px);

  }

  100% {

    transform: translateY(0);

  }

}

.cd-headline.rotate-1 b {

  opacity: 0;

  -webkit-transform-origin: 50% 100%;

  -moz-transform-origin: 50% 100%;

  -ms-transform-origin: 50% 100%;

  -o-transform-origin: 50% 100%;

  transform-origin: 50% 100%;

  -webkit-transform: rotateX(180deg);

  -moz-transform: rotateX(180deg);

  -ms-transform: rotateX(180deg);

  -o-transform: rotateX(180deg);

  transform: rotateX(180deg);

}



.cd-headline.rotate-1 b.is-visible {

  opacity: 1;

  -webkit-transform: rotateX(0deg);

  -moz-transform: rotateX(0deg);

  -ms-transform: rotateX(0deg);

  -o-transform: rotateX(0deg);

  transform: rotateX(0deg);

  -webkit-animation: cd-rotate-1-in 1.2s;

  -moz-animation: cd-rotate-1-in 1.2s;

  animation: cd-rotate-1-in 1.2s;

}



.cd-headline.rotate-1 b.is-hidden {

  -webkit-transform: rotateX(180deg);

  -moz-transform: rotateX(180deg);

  -ms-transform: rotateX(180deg);

  -o-transform: rotateX(180deg);

  transform: rotateX(180deg);

  -webkit-animation: cd-rotate-1-out 1.2s;

  -moz-animation: cd-rotate-1-out 1.2s;

  animation: cd-rotate-1-out 1.2s;

}



@-webkit-keyframes cd-rotate-1-in {

  0% {

    -webkit-transform: rotateX(180deg);

    opacity: 0;

  }

  35% {

    -webkit-transform: rotateX(120deg);

    opacity: 0;

  }

  65% {

    opacity: 0;

  }

  100% {

    -webkit-transform: rotateX(360deg);

    opacity: 1;

  }

}

@keyframes cd-rotate-1-in {

  0% {

    -webkit-transform: rotateX(180deg);

    -moz-transform: rotateX(180deg);

    -ms-transform: rotateX(180deg);

    -o-transform: rotateX(180deg);

    transform: rotateX(180deg);

    opacity: 0;

  }

  35% {

    -webkit-transform: rotateX(120deg);

    -moz-transform: rotateX(120deg);

    -ms-transform: rotateX(120deg);

    -o-transform: rotateX(120deg);

    transform: rotateX(120deg);

    opacity: 0;

  }

  65% {

    opacity: 0;

  }

  100% {

    -webkit-transform: rotateX(360deg);

    -moz-transform: rotateX(360deg);

    -ms-transform: rotateX(360deg);

    -o-transform: rotateX(360deg);

    transform: rotateX(360deg);

    opacity: 1;

  }

}

@-webkit-keyframes cd-rotate-1-out {

  0% {

    -webkit-transform: rotateX(0deg);

    opacity: 1;

  }

  35% {

    -webkit-transform: rotateX(-40deg) scaleY(1.1);

    opacity: 1;

  }

  65% {

    opacity: 0;

  }

  100% {

    -webkit-transform: rotateX(180deg);

    opacity: 0;

  }

}

@-moz-keyframes cd-rotate-1-out {

  0% {

    -moz-transform: rotateX(0deg);

    opacity: 1;

  }

  35% {

    -webkit-transform: rotateX(-40deg) scaleY(1.1);

    opacity: 1;

  }

  65% {

    opacity: 0;

  }

  100% {

    -moz-transform: rotateX(180deg);

    opacity: 0;

  }

}

@keyframes cd-rotate-1-out {

  0% {

    -webkit-transform: rotateX(0deg);

    -moz-transform: rotateX(0deg);

    -ms-transform: rotateX(0deg);

    -o-transform: rotateX(0deg);

    transform: rotateX(0deg);

    opacity: 1;

  }

  35% {

    transform: rotateX(-40deg) scaleY(1.1);

    opacity: 1;

  }

  65% {

    opacity: 0;

  }

  100% {

    -webkit-transform: rotateX(180deg);

    -moz-transform: rotateX(180deg);

    -ms-transform: rotateX(180deg);

    -o-transform: rotateX(180deg);

    transform: rotateX(180deg);

    opacity: 0;

  }

}

.tmp-contact-about-inner .download-icon.tmp-btn i {

  top: 0px;

  font-size: 16px;

}



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

  .index-nine .tab-content-overlay-to-top {

    margin-top: 0;

  }

}



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

  .index-ten .tab-content-overlay-to-top {

    margin-top: 0;

  }

}

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

  .index-ten .tmp-contact-about-inner .thumbnail img {

    max-width: 300px;

  }

}

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

  .index-ten .tmp-contact-about-inner .thumbnail img {

    max-width: 280px;

  }

}



.tmp-white-version .loader-bg-pattern-wrapper {

  z-index: 0;

}

.tmp-white-version .loader-bg-pattern-wrapper {

  position: absolute;

  left: 50%;

  z-index: 0;

  top: 34.1%;

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

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern {

  --size: 450px;

  --duration: 4s;

  --logo-color: rgb(214, 214, 214);

  --background: linear-gradient(

  0deg,

  rgba(209, 209, 209, 0.2) 0%,

  rgba(206, 206, 206, 0.2) 100%

  );

  height: var(--size);

  aspect-ratio: 1;

  position: relative;

}

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

  .tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:420px;

  }

}

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

  .tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:400px;

  }

}

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

  .tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:320px;

  }

}

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

  .tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:220px ;

  }

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern .box {

  position: absolute;

  background: rgba(182, 182, 182, 0.15);

  background: var(--background);

  border-radius: 50%;

  border-top: 1px solid rgb(206, 206, 206);

  box-shadow: rgba(160, 160, 160, 0.123) 0px 10px 10px 0px;

  backdrop-filter: blur(5px);

  animation: ripple-2 var(--duration) infinite ease-in-out;

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(1) {

  inset: 40%;

  z-index: 99;

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(2) {

  inset: 30%;

  z-index: 98;

  border-color: rgba(100, 100, 100, 0.8);

  animation-delay: 0.2s;

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(3) {

  inset: 20%;

  z-index: 97;

  border-color: rgba(100, 100, 100, 0.6);

  animation-delay: 0.4s;

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(4) {

  inset: 10%;

  z-index: 96;

  border-color: rgba(203, 203, 203, 0.4);

  animation-delay: 0.6s;

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(5) {

  inset: 0%;

  z-index: 95;

  border-color: rgba(100, 100, 100, 0.2);

  animation-delay: 0.8s;

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern .logo {

  position: absolute;

  inset: 0;

  display: grid;

  place-content: center;

  padding: 30%;

}

.tmp-white-version .loader-bg-pattern-wrapper .loader-bg-pattern .logo svg {

  fill: var(--logo-color);

  width: 100%;

  animation: color-change var(--duration) infinite ease-in-out;

}

@keyframes ripple-2 {

  0% {

    transform: scale(1);

    box-shadow: rgba(124, 124, 124, 0.3) 0px 10px 10px 0px;

  }

  50% {

    transform: scale(1.3);

    box-shadow: rgba(124, 124, 124, 0.3) 0px 30px 20px 0px;

  }

  100% {

    transform: scale(1);

    box-shadow: rgba(128, 128, 128, 0.3) 0px 10px 10px 0px;

  }

}

@keyframes color-change {

  0% {

    fill: var(--logo-color);

  }

  50% {

    fill: white;

  }

  100% {

    fill: var(--logo-color);

  }

}



.banner-twelve-area {

  position: relative;

  z-index: 1;

  background-image: none !important;

  background: linear-gradient(90deg, rgb(6, 6, 6) 0%, rgba(0, 0, 0, 0) 100%) !important;

}

.banner-twelve-area #particles-js {

  position: absolute;

  height: 100%;

  width: 100%;

  z-index: -1;

  top: 0;

  left: 0;

  pointer-events: none;

}



.tmp-white-version.home-12 .banner-twelve-area {

  background: linear-gradient(359deg, rgb(255, 255, 255) 0%, rgba(0, 0, 0, 0) 100%) !important;

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper {

  position: absolute;

  left: 50%;

  z-index: -1;

  top: 34.1%;

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

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern {

  --size: 450px;

  --duration: 4s;

  --logo-color: rgb(214, 214, 214);

  --background: linear-gradient(

  0deg,

  rgba(223, 223, 223, 0.2) 0%,

  rgba(226, 226, 226, 0.2) 100%

  );

  height: var(--size);

  aspect-ratio: 1;

  position: relative;

}

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

  .tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:420px;

  }

}

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

  .tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:400px;

  }

}

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

  .tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:320px;

  }

}

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

  .tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern {

    --size:220px ;

  }

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern .box {

  position: absolute;

  background: rgba(223, 223, 223, 0.15);

  background: rgba(247, 247, 247, 0.3411764706);

  border-radius: 50%;

  border-top: 1px solid rgb(206, 206, 206);

  box-shadow: rgba(216, 216, 216, 0.123) 0px 10px 10px 0px;

  backdrop-filter: blur(5px);

  animation: ripple-2 var(--duration) infinite ease-in-out;

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(1) {

  inset: 40%;

  z-index: 99;

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(2) {

  inset: 30%;

  z-index: 98;

  border-color: rgba(100, 100, 100, 0.8);

  animation-delay: 0.2s;

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(3) {

  inset: 20%;

  z-index: 97;

  border-color: rgba(100, 100, 100, 0.6);

  animation-delay: 0.4s;

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(4) {

  inset: 10%;

  z-index: 96;

  border-color: rgba(203, 203, 203, 0.4);

  animation-delay: 0.6s;

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern .box:nth-child(5) {

  inset: 0%;

  z-index: 95;

  border-color: rgba(192, 192, 192, 0.2);

  animation-delay: 0.8s;

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern .logo {

  position: absolute;

  inset: 0;

  display: grid;

  place-content: center;

  padding: 30%;

}

.tmp-white-version.home-12 .loader-bg-pattern-wrapper .loader-bg-pattern .logo svg {

  fill: var(--logo-color);

  width: 100%;

  animation: color-change var(--duration) infinite ease-in-out;

}

@keyframes ripple-2 {

  0% {

    transform: scale(1);

    box-shadow: rgba(185, 185, 185, 0.3) 0px 10px 10px 0px;

  }

  50% {

    transform: scale(1.3);

    box-shadow: rgba(185, 185, 185, 0.3) 0px 30px 20px 0px;

  }

  100% {

    transform: scale(1);

    box-shadow: rgba(185, 185, 185, 0.3) 0px 10px 10px 0px;

  }

}

@keyframes color-change {

  0% {

    fill: var(--logo-color);

  }

  50% {

    fill: white;

  }

  100% {

    fill: var(--logo-color);

  }

}

.tmp-white-version.home-12 .header-left-sticky {

  background: #fff;

}

.tmp-white-version.home-12 .header-left-sticky .inner-wrapper::after {

  display: none;

}

.tmp-white-version.home-12 .tmp-right-demo .demo-button .text {

  color: var(--color-primary);

}



.tmp-white-version.index-ten .tmp-contact-about-inner::after {

  display: none;

}



@media only screen and (min-width: 1600px) and (max-width: 1919px) {

  .index-seven .tmp-banner-one-area {

    background-image: none !important;

  }

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .index-seven .tmp-banner-one-area {

    background-image: none !important;

  }

}

.index-seven .tmp-banner-one-area {

  position: relative;

}

.index-seven .tmp-banner-one-area #particles-js {

  position: absolute;

  height: 100%;

  width: 100%;

  z-index: 0;

  top: 0;

  left: 0;

  pointer-events: none;

}



.tmp-breadcrumb-image {

  position: relative;

  z-index: -1;

}

.tmp-breadcrumb-image #particles-js {

  position: absolute;

  height: 100%;

  width: 100%;

  z-index: 0;

  top: 0;

  left: 0;

  pointer-events: none;

}



.tmp-banner-one-area.style-4 {

  position: relative;

  z-index: 1;

}

.tmp-banner-one-area.style-4 #particles-js {

  position: absolute;

  height: 100%;

  width: 100%;

  z-index: -1;

  top: 0;

  left: 0;

  pointer-events: none;

}



.profile-image-1-personal-left-fixed {

  position: sticky;

  top: 110px;

  left: 80px;

  bottom: 80px;

  overflow: hidden;

}

.profile-image-1-personal-left-fixed .inner-content {

  border: 2px solid var(--color-border);

  z-index: 1;

  background: #010d16;

  position: relative;

  padding: 30px;

  position: relative;

  overflow: hidden;

  z-index: 1;

  border-radius: 15px;

}

.profile-image-1-personal-left-fixed img {

  width: 100%;

}

.profile-image-1-personal-left-fixed .social-default {

  display: flex;

  flex-wrap: wrap;

  padding: 0;

  margin: 0;

  list-style: none;

  justify-content: center;

  margin: -8px;

  position: absolute;

  left: 60px;

  top: 60px;

}

@media only screen and (max-width: 575px) {

  .profile-image-1-personal-left-fixed .social-default {

    left: 45px;

    top: 45px;

  }

}

.profile-image-1-personal-left-fixed .social-default li {

  margin: 8px;

}

@media only screen and (max-width: 575px) {

  .profile-image-1-personal-left-fixed .social-default li {

    margin: 4px;

  }

}

.profile-image-1-personal-left-fixed .social-default li a {

  width: 48px;

  background-color: #232324;

  height: 48px;

  line-height: 43px;

  text-align: center;

  display: inline-block;

  border-radius: 100%;

  transition: 0.3s;

  color: #fff;

  z-index: 2;

  position: relative;

  display: flex;

  align-items: center;

  justify-content: center;

}

@media only screen and (max-width: 575px) {

  .profile-image-1-personal-left-fixed .social-default li a {

    width: 35px;

    height: 35px;

  }

}

.profile-image-1-personal-left-fixed .social-default li a::after {

  position: absolute;

  content: "";

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  z-index: -1;

  background: var(--icon-gradient);

  transform: scale(0.5);

  opacity: 0;

  transition: 0.3s;

  border-radius: 100%;

}

.profile-image-1-personal-left-fixed .social-default li a:hover::after {

  transform: scale(1);

  opacity: 1;

}

.profile-image-1-personal-left-fixed .title {

  position: absolute;

  left: 60px;

  bottom: 50px;

  font-size: 44px;

  z-index: 5;

  line-height: 1.4;

  font-weight: 400;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .profile-image-1-personal-left-fixed .title {

    font-size: 32px;

  }

}

@media only screen and (max-width: 767px) {

  .profile-image-1-personal-left-fixed .title {

    font-size: 22px;

  }

}

@media only screen and (max-width: 575px) {

  .profile-image-1-personal-left-fixed .title {

    left: 45px;

    bottom: 45px;

  }

}

.profile-image-1-personal-left-fixed .title .header-caption {

  color: var(--color-primary);

}



.banner-twelve-area.with-bg-image {

  background-image: url(../images/bg/01.webp) !important;

  background-position: center !important;

  background-size: cover !important;

  background-repeat: no-repeat !important;

  min-height: 100vh;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .banner-twelve-area.with-bg-image {

    min-height: 600px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-twelve-area.with-bg-image {

    min-height: 520px;

      padding-top: 0;

      margin-top: 80px;
        background-position: 72% !important;
  }

}

.banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .title {

  font-size: 78px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .title {

    font-size: 60px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .title {

    font-size: 54px;

  }

}

@media only screen and (max-width: 575px) {

  .banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .title {

    font-size: 44px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .title {

    font-size: 32px;

  }

}

.banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .sub-title {

    font-size: 30px;

    line-height: 37px;

    font-weight: 800;

    color: #00d9ff;
	    text-shadow: 2px 2px #000000;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .sub-title {

    font-size: 60px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .sub-title {

    font-size: 54px;

  }

}

@media only screen and (max-width: 575px) {

  .banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .sub-title {

    font-size: 44px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .sub-title {

    font-size: 20px;

    line-height: 25px;

  }

}

.banner-twelve-area.with-bg-image .social-share-style-1 {

  justify-content: center;

  display: flex;

  margin-top: 40px;

}

.banner-twelve-area.with-bg-image .social-share-style-1 a {

  background: #141414;

}



.model-style-banner {

  position: relative;

}

.model-style-banner .social-area-wrapper-varticle {

  position: absolute;

  left: 60px;

  top: 63%;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .model-style-banner .social-area-wrapper-varticle {

    top: auto;

    bottom: 20px;

  }

}

@media only screen and (max-width: 767px) {

  .model-style-banner .social-area-wrapper-varticle {

    top: auto;

    bottom: 20px;

  }

}

@media only screen and (max-width: 575px) {

  .model-style-banner .social-area-wrapper-varticle {

    position: absolute;

    left: 50%;

    transform: translateX(-50%);

  }

}

.model-style-banner .social-area-wrapper-varticle::after {

  position: absolute;

  left: 50%;

  height: 85px;

  width: 2px;

  background: rgba(255, 255, 255, 0.062745098);

  content: "";

  transform: translateX(-50%);

  bottom: -100px;

}

@media only screen and (max-width: 767px) {

  .model-style-banner .social-area-wrapper-varticle::after {

    display: none;

  }

}

.model-style-banner .social-area-wrapper-varticle ul {

  padding: 0;

  margin: 0;

  display: flex;

  align-items: center;

  flex-direction: column;

  gap: 15px;

}

@media only screen and (max-width: 767px) {

  .model-style-banner .social-area-wrapper-varticle ul {

    flex-direction: row-reverse;

  }

}

.model-style-banner .social-area-wrapper-varticle ul li {

  margin: 0;

}

.model-style-banner .social-area-wrapper-varticle ul li a {

  width: 40px;

  height: 40px;

  background: rgba(255, 255, 255, 0.062745098);

  position: relative;

  color: #fff;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 50%;

}

.model-style-banner .social-area-wrapper-varticle ul li a::after {

  content: " ";

  position: absolute;

  width: 100%;

  height: 100%;

  border-radius: 100px;

  background: var(--color-primary);

  opacity: 0.06;

  transform: scale(0);

  transition: all 0.4s ease;

  z-index: -1;

}

.model-style-banner .social-area-wrapper-varticle ul li a:hover::after {

  opacity: 1;

  transform: scale(1);

}



.model-style-banner.with-instructor .hero-bg-video {

  position: absolute;

  top: 0;

  right: 0;

  left: 0;

  bottom: 0;

  width: 100%;

  height: 100%;

  z-index: -2;

}

.model-style-banner.with-instructor .hero-bg-video video {

  width: 100%;

  height: 100%;

  object-fit: cover;

}

.model-style-banner.with-instructor .banner-model-15 {

  text-align: center;

  max-width: 100%;

  margin: auto;

}

@media only screen and (max-width: 767px) {

  .model-style-banner.with-instructor .banner-model-15 {

    max-width: 100%;

  }

}

.model-style-banner.with-instructor .banner-model-15 p.disc {

  font-size: 22px;

  text-transform: uppercase;

  color: #fff;

}

@media only screen and (max-width: 767px) {

  .model-style-banner.with-instructor .banner-model-15 p.disc {

    font-size: 16px;

  }

}

.model-style-banner.with-instructor .banner-model-15 .title {

  font-size: 150px !important;

  margin-top: 0;

  margin-bottom: 0;

  text-transform: uppercase;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .model-style-banner.with-instructor .banner-model-15 .title {

    font-size: 120px !important;

  }

}

@media only screen and (max-width: 1199px) {

  .model-style-banner.with-instructor .banner-model-15 .title {

    font-size: 100px !important;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .model-style-banner.with-instructor .banner-model-15 .title {

    font-size: 70px !important;

  }

}

@media only screen and (max-width: 767px) {

  .model-style-banner.with-instructor .banner-model-15 .title {

    font-size: 54px !important;

  }

}

@media only screen and (max-width: 575px) {

  .model-style-banner.with-instructor .banner-model-15 .title {

    font-size: 54px !important;

  }

}



.banner-right-thumb-left-content {

  padding-top: 0;

}

.banner-right-thumb-left-content .pre-title {

  font-size: 18px;

  text-transform: uppercase;

  display: block;

  margin-bottom: 18px;

  font-weight: 700;

  letter-spacing: 1px;

  color: var(--color-primary);

}

.banner-right-thumb-left-content .title {

  margin-bottom: 35px;

  font-size: 64px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .banner-right-thumb-left-content .title {

    margin-bottom: 14px;

    font-size: 44px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-right-thumb-left-content .title {

    margin-bottom: 14px;

    font-size: 32px;

  }

}

@media only screen and (max-width: 575px) {

  .banner-right-thumb-left-content .title {

    font-size: 28px;

  }

}

.banner-right-thumb-left-content .title span {

  color: var(--color-primary);

}

.banner-right-thumb-left-content p.disc {

  margin-bottom: 25px;

  max-width: 78%;

}

@media only screen and (max-width: 575px) {

  .banner-right-thumb-left-content p.disc {

    max-width: 100%;

  }

}

.banner-right-thumb-left-content .find-me-on {

  margin-top: 45px;

}



.banner-right-thumbnail-area .thumbnail-right-inner-main-image {

  padding: 25px;

  background: var(--color-gray-2);

  border-radius: 20px;

}

@media only screen and (max-width: 575px) {

  .banner-right-thumbnail-area .thumbnail-right-inner-main-image {

    padding: 15px;

  }

}

.banner-right-thumbnail-area .thumbnail-right-inner-main-image img {

  position: relative;

  z-index: 50 !important;

}



.box-body {

  margin: 25px;

  background: #ee0979;

  background: -webkit-linear-gradient(to right, #ff6a00, #ee0979);

  background: var(--gradient-box) !important;

  position: relative;

}

@media only screen and (max-width: 767px) {

  .box-body {

    margin: 10px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .box-body {

    margin: 10px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .box-body {

    margin: 10px;

  }

}

.box-body .main-wrapper-inner {

  background: var(--color-secondary);

}

.box-body .banner-right-thumbnail-area .thumbnail-right-inner-main-image {

  background: var(--color-gray-2);

}

@media only screen and (max-width: 575px) {

  .box-body .banner-right-thumbnail-area .thumbnail-right-inner-main-image {

    padding: 15px;

  }

}



.box-body .header--sticky.sticky {

  top: 0;

  left: 25px;

  right: 25px;

  width: auto;

  transform: none;

}



.skill-social-wrapper {

  display: flex;

  align-items: center;

  gap: 120px;

}

@media only screen and (max-width: 767px) {

  .skill-social-wrapper {

    flex-direction: column;

    gap: 30px;

    align-items: flex-start;

  }

  .skill-social-wrapper .find-me-on {

    margin-top: 0;

  }

  .skill-social-wrapper .find-me-on:first-child {

    margin-top: 0;

  }

}

.skill-social-wrapper .find-me-on-title {

  text-transform: uppercase;

}



.best-skill-social a {

  transition: 0.3s;

}

.best-skill-social a img {

  max-width: 35px;

  max-height: 23px;

}

.best-skill-social a::after {

  display: none;

}

.best-skill-social a:hover {

  transform: translateY(-3px);

}



.banner-area-one-main-demo {

  position: relative;

}

.banner-area-one-main-demo .separator-animated-border.border-top-footer {

  bottom: auto;

  top: 76px;

  width: 100%;

}



@keyframes skew-hi {

  0% {

    transform: rotate(0deg);

  }

  25% {

    transform: rotate(5deg);

  }

  50% {

    transform: rotate(0eg);

  }

  75% {

    transform: rotate(-5deg);

  }

  100% {

    transform: rotate(0deg);

  }

}

.banner-main-demo-inner-content {

  margin: auto;

  text-align: center;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .banner-main-demo-inner-content {

    padding-top: 60px;

  }

}

@media only screen and (max-width: 767px) {

  .banner-main-demo-inner-content {

    padding-top: 60px;

  }

}

.banner-main-demo-inner-content span.top-intro {

  display: block;

  font-size: 36px;

  font-weight: 500;

}

@media only screen and (max-width: 767px) {

  .banner-main-demo-inner-content span.top-intro {

    font-size: 24px;

  }

}

.banner-main-demo-inner-content span.top-intro span {

  color: var(--color-primary);

  font-weight: 700;

}

.banner-main-demo-inner-content span.top-intro img {

  max-width: 45px;

  animation: skew-hi 1s linear infinite;

}

.banner-main-demo-inner-content .main-demo {

  position: relative;

  z-index: 1;

}

.banner-main-demo-inner-content .absolute-designation h2 {

  position: absolute;

  font-weight: 700;

}

.banner-main-demo-inner-content .absolute-designation .up {

  top: 65%;

  left: 50%;

  transform: translateX(-50%);

  font-size: 110px;

  z-index: 3;

}

@media only screen and (min-width: 1600px) and (max-width: 1919px) {

  .banner-main-demo-inner-content .absolute-designation .up {

    font-size: 94px;

  }

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .banner-main-demo-inner-content .absolute-designation .up {

    font-size: 77px;

  }

}

@media only screen and (max-width: 1199px) {

  .banner-main-demo-inner-content .absolute-designation .up {

    font-size: 70px;

    min-width: max-content;

  }

}

@media only screen and (max-width: 767px) {

  .banner-main-demo-inner-content .absolute-designation .up {

    font-size: 44px;

  }

}

@media only screen and (max-width: 575px) {

  .banner-main-demo-inner-content .absolute-designation .up {

    font-size: 36px;

  }

}

.banner-main-demo-inner-content .absolute-designation .down {

  z-index: -1;

  top: 36%;

  left: 50%;

  transform: translateX(-50%);

  font-size: 100px;

  -webkit-text-stroke-width: 1px;

  stroke-width: 1px;

  -webkit-text-stroke-color: #fff;

  stroke: #fff;

  -webkit-text-fill-color: transparent;

}

@media only screen and (min-width: 1600px) and (max-width: 1919px) {

  .banner-main-demo-inner-content .absolute-designation .down {

    font-size: 94px;

  }

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .banner-main-demo-inner-content .absolute-designation .down {

    font-size: 84px;

  }

}

@media only screen and (max-width: 1199px) {

  .banner-main-demo-inner-content .absolute-designation .down {

    font-size: 70px;

    min-width: max-content;

  }

}

@media only screen and (max-width: 767px) {

  .banner-main-demo-inner-content .absolute-designation .down {

    font-size: 44px;

  }

}

@media only screen and (max-width: 575px) {

  .banner-main-demo-inner-content .absolute-designation .down {

    font-size: 36px;

  }

}



.video-bg-body {

  position: relative;

}

.video-bg-body .hero-bg-video {

  position: fixed;

  top: 0;

  right: 0;

  left: 0;

  bottom: 0;

  width: 100%;

  height: 100%;

  z-index: -2;

}

.video-bg-body .hero-bg-video video {

  width: 100%;

  height: 100%;

  object-fit: cover;

}

.video-bg-body .hero-bg-video[data-black-overlay="5"]::before {

  z-index: 3;

}



.tmp-banner-circle img {

  z-index: 2;

  max-width: 100%;

}



.tmp-banner-circle .tmp-banner-circle-1 {

  position: absolute;

  top: 20%;

  left: 35%;

  -webkit-animation: services-triangle 5s linear infinite alternate;

  animation: services-triangle 5s linear infinite alternate;

}



.tmp-banner-circle .tmp-banner-circle-2 {

  position: absolute;

  left: 35%;

  top: 65%;

  -webkit-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

  -webkit-animation: services-triangle 6s linear infinite alternate;

  animation: services-triangle 6s linear infinite alternate;

}



.tmp-banner-circle .tmp-banner-circle-3 {

  position: absolute;

  top: 30%;

  right: 32%;

  -webkit-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  transform: translateY(-50%);

  -webkit-animation: services-triangle 7s linear infinite alternate;

  animation: services-triangle 7s linear infinite alternate;

}



.tmp-banner-circle .tmp-banner-circle-4 {

  position: absolute;

  right: 32%;

  bottom: 20%;

  -webkit-animation: services-triangle 8s linear infinite alternate;

  animation: services-triangle 8s linear infinite alternate;

}



@keyframes services-triangle {

  0% {

    -webkit-transform: rotate(0deg) translateX(-50px);

    -moz-transform: rotate(0deg) translateX(-50px);

    -ms-transform: rotate(0deg) translateX(-50px);

    transform: rotate(0deg) translateX(-50px);

  }

  100% {

    -webkit-transform: rotate(360deg) translateY(100px);

    -moz-transform: rotate(360deg) translateY(100px);

    -ms-transform: rotate(360deg) translateY(100px);

    transform: rotate(360deg) translateY(100px);

  }

}

.video-bg-image-bg-green {

  background-image: url(../images/bg/05.webp);

  background-position: center;

  background-attachment: fixed;

}



/*===============================

  About Me Section Card

  ===============================*/

.testimonial-card {

  position: relative;

  z-index: 2;

  display: flex;

  padding-top: 40px;

}

.testimonial-card .card-content-wrap {

  z-index: 1;

  position: relative;

}

.testimonial-card .card-content-wrap .text-doc {

  color: var(--color-heading);

  font-family: var(--font-secondary);

  font-size: 26px;

  font-weight: 600;

  line-height: 42px;

  text-transform: capitalize;

  max-width: 420px;

  margin-bottom: 30px;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .testimonial-card .card-content-wrap .text-doc {

    font-size: 20px;

    font-weight: 700;

    line-height: 36px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .testimonial-card .card-content-wrap .text-doc {

    font-size: 20px;

    font-weight: 700;

    line-height: 36px;

    max-width: 393px;

    margin-bottom: 19px;

  }

}

@media only screen and (max-width: 767px) {

  .testimonial-card .card-content-wrap .text-doc {

    font-size: 20px;

    font-weight: 700;

    line-height: 34px;

  }

}

@media only screen and (max-width: 575px) {

  .testimonial-card .card-content-wrap .text-doc {

    font-size: 21px;

    font-weight: 600;

    line-height: 28px;

  }

}

.testimonial-card .card-content-wrap .card-title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 24px;

  font-weight: 700;

  line-height: 30px;

  margin-bottom: 8px;

}

@media only screen and (max-width: 767px) {

  .testimonial-card .card-content-wrap .card-title {

    font-size: 17px;

    font-weight: 700;

    line-height: 22px;

    margin-bottom: 2px;

  }

}

.testimonial-card .card-content-wrap .card-para {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-bottom: 0;

}

.testimonial-card .card-content-wrap .testimonital-icon {

  width: 110px;

  height: 93px;

  margin-top: 29px;

  opacity: 0.2;

}

@media only screen and (max-width: 767px) {

  .testimonial-card .card-content-wrap .testimonital-icon {

    width: 79px;

    height: 71px;

    margin-top: 10px;

  }

}

.testimonial-card .card-content-wrap .testimonital-icon img {

  width: 100%;

}

.testimonial-card .testimonial-card-img {

  display: flex;

  justify-content: end;

  position: absolute;

  right: 0;

  bottom: 15%;

  width: 60%;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .testimonial-card .testimonial-card-img {

    bottom: 7%;

    width: 64%;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .testimonial-card .testimonial-card-img {

    bottom: 7%;

    width: 39%;

  }

}

@media only screen and (max-width: 767px) {

  .testimonial-card .testimonial-card-img {

    bottom: 7%;

    width: 50%;

  }

}

.testimonial-card .testimonial-card-img img {

  object-fit: cover;

}

.testimonial-card.style-2 {

  background: var(--color-gray-2);

  border-radius: 20px;

  padding: 40px;

}

@media only screen and (max-width: 767px) {

  .testimonial-card.style-2 {

    padding: 30px 20px;

  }

}

.testimonial-card.style-2 .content .text-doc {

  line-height: 1.7;

  font-size: 18px;

  font-family: var(--font-secondary);

  color: var(--color-gray);

  font-weight: 400;

  margin-top: 43px;

  margin-bottom: 38px;

}

@media only screen and (max-width: 767px) {

  .testimonial-card.style-2 .content .text-doc {

    font-size: 16px;

    margin-bottom: 18px;

  }

}

.testimonial-card.style-2 .content .card-title {

  font-family: var(--font-primary);

  font-size: 18px;

  font-weight: 700;

  color: var(--color-heading);

  margin-bottom: 12px;

}

.testimonial-card.style-2 .content .card-para {

  font-family: var(--font-secondary);

  color: var(--color-gray);

  font-size: 14px;

}



.testimonial-wrapper {

  position: relative;

  z-index: 1;

}

.testimonial-wrapper .swiper-button-prev,

.testimonial-wrapper .swiper-button-next {

  position: absolute;

  width: 50px;

  height: 50px;

  border-radius: 10px;

  border: 1px solid var(--color-border);

  transition: all 0.4s ease;

}

.testimonial-wrapper .swiper-button-prev i,

.testimonial-wrapper .swiper-button-next i {

  color: var(--color-heading);

  font-size: 24px;

  font-weight: 300;

  transition: all 0.4s ease;

}

.testimonial-wrapper .swiper-button-prev:hover,

.testimonial-wrapper .swiper-button-next:hover {

  background: var(--color-primary);

}

.testimonial-wrapper .swiper-button-prev:hover i,

.testimonial-wrapper .swiper-button-next:hover i {

  color: #ffffff;

  transform: rotate(0deg);

}

.testimonial-wrapper .swiper-button-prev::after,

.testimonial-wrapper .swiper-button-next::after {

  display: none;

}

.testimonial-wrapper .swiper-button-prev {

  display: none;

}

@media (min-width: 1700px) {

  .testimonial-wrapper .swiper-button-prev {

    left: 150px;

    display: inline-flex;

  }

}

.testimonial-wrapper .swiper-button-prev i {

  transform: rotate(45deg);

}

.testimonial-wrapper .swiper-button-next {

  display: none;

}

@media (min-width: 1700px) {

  .testimonial-wrapper .swiper-button-next {

    right: 150px;

    display: inline-flex;

  }

}

.testimonial-wrapper .swiper-button-next i {

  transform: rotate(-45deg);

}



/*===============================

  Price Plan Card

  ===============================*/

.price-plan-card {

  border-radius: 20px;

  background: var(--color-gray-2);

  padding: 25px;

  position: relative;

  overflow: hidden;

}

@media (min-width: 576px) {

  .price-plan-card {

    padding: 40px;

  }

}

.price-plan-card.active.blur-style-one::before {

  background: var(--color-primary);

  opacity: 1;

}

.price-plan-card.v2 {

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

}

.price-plan-card.v2 .price-plan-card-icon {

  margin-bottom: 33px;

}

.price-plan-card.v2 .check-box {

  border-top: none;

  padding-bottom: 40px;

  border-bottom: 2px solid var(--color-border);

  margin-bottom: 40px;

  padding-top: 28px;

}

@media only screen and (max-width: 767px) {

  .price-plan-card.v2 .check-box {

    margin-bottom: 20px;

    padding-top: 16px;

  }

}

.price-plan-card .popular-tag {

  position: absolute;

  top: 0;

  right: 0;

}

.price-plan-card .price-sub-title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 18px;

  font-weight: 700;

  line-height: 27px;

}

.price-plan-card .main-price {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 48px;

  font-weight: 700;

  line-height: 60px;

  text-transform: capitalize;

  margin-bottom: 5px;

}

.price-plan-card .per-month {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 18px;

  font-weight: 700;

  line-height: 27px;

  margin-bottom: 28px;

}

@media only screen and (max-width: 767px) {

  .price-plan-card .per-month {

    margin-bottom: 14px;

  }

}



/*===============================

  Check Box

  ===============================*/

.check-box {

  border-top: 2px solid var(--color-border);

  padding-top: 43px;

  padding-bottom: 30px;

}

@media (min-width: 992px) {

  .check-box {

    padding-bottom: 40px;

  }

}

.check-box ul li {

  margin: 0 0 15px 0;

}

.check-box ul li:last-child {

  margin-bottom: 0;

}

.check-box .check-box-item {

  display: flex;

  align-items: center;

  gap: 10px;

}

.check-box .check-box-item .box-icon {

  color: var(--color-primary);

}

.check-box .check-box-item .box-para {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 24px;

}



.pricing-table-col-2 {

  border-radius: 6px;

  padding: 37px 40px 40px 40px;

  height: 100%;

  display: flex;

  flex-direction: column;

  justify-content: space-between;

  transition: 0.3s;

}

@media only screen and (max-width: 575px) {

  .pricing-table-col-2 {

    padding: 20px;

  }

}

.pricing-table-col-2 .pricing-table-header {

  border-bottom: 1px solid var(--color-border);

  padding-bottom: 20px;

  margin-bottom: 34px;

}

.pricing-table-col-2 .pricing-table-header h4 {

  font-size: 18px;

  text-transform: uppercase;

  font-weight: 300;

  color: var(--color-heading);

  margin: 0;

}

.pricing-table-col-2 .pricing-table-header .top p {

  font-size: 13px;

  line-height: 20px;

  color: var(--color-body);

  margin: 0;

}

.pricing-table-col-2 .pricing-table-header h3 {

  font-size: 48px;

  color: var(--color-primary);

  font-weight: 600;

  margin: 0;

}

.pricing-table-col-2 .pricing-table-header h3 span {

  font-size: 24px;

  color: var(--color-body);

}

.pricing-table-col-2 .feature-lists {

  margin-bottom: 80px;

  padding: 0;

  list-style: none;

}

.pricing-table-col-2 .feature-lists li {

  font-size: 14px;

  color: var(--color-body);

  line-height: 24px;

  font-weight: 300;

  margin-bottom: 10px;

  font-weight: 500;

}



.pricing-table-items .info {

  font-size: 14px;

  color: var(--color-heading);

  line-height: 24px;

  margin: 10px 0 0 0;

}

.pricing-table-items .info a {

  color: var(--color-primary);

  text-decoration: underline;

  line-height: 0;

  padding: 0;

  margin: 0;

  height: 0;

  margin-top: 33px;

}



/*===============================

  Get In Touch Wrapper

  ===============================*/

.get-in-touch-wrapper {

  border-radius: 20px;

  background: var(--color-gray-2);

  padding: 20px 30px;

}

@media (min-width: 576px) {

  .get-in-touch-wrapper {

    padding: 36px 43px;
  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .get-in-touch-wrapper {

    padding: 40px 40px;

  }

}

@media only screen and (max-width: 767px) {

  .get-in-touch-wrapper {

    padding: 30px 20px;

  }

}

@media only screen and (max-width: 575px) {

  .get-in-touch-wrapper {

    padding: 10px;

  }

}



/*===============================

  Counter Inner

  ===============================*/

.contact-inner .title-left {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 40px;

  line-height: 50px;

  font-weight: 700;

}

@media (min-width: 576px) {

  .contact-inner .title-left {

    font-size: 56px;

    line-height: 78px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .contact-inner .title-left {

    font-size: 50px;

    line-height: 1.23;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .contact-inner .title-left {

    font-size: 50px;

    line-height: 1.23;

  }

}

@media only screen and (max-width: 767px) {

  .contact-inner .title-left {

    font-size: 32px;

    line-height: 1.2;

  }

}



/*===============================

  Contact Form

  ===============================*/

.contact-form .contact-form-wrapper .form-group {

  margin-bottom: 0;

  border: none !important;

}

.contact-form .contact-form-wrapper .form-group input {

  background: transparent;

  height: inherit;

  padding: 15px 20px;

  font-size: 16px;

  color: var(--color-heading);

  font-weight: 600;

  border-radius: 10px;

  border: 2px solid var(--color-border);

}

.contact-form .contact-form-wrapper .form-group input:focus {

  border-color: var(--color-primary);

}

.contact-form .contact-form-wrapper .form-group input::placeholder {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

.contact-form .contact-form-wrapper .form-group textarea {

  background: transparent;

  font-size: 16px;

  color: var(--color-heading);

  font-weight: 600;

  border-radius: 10px;

  border: 2px solid var(--color-border);

}

.contact-form .contact-form-wrapper .form-group textarea::placeholder {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

.contact-form .contact-form-wrapper .form-group textarea:focus {

  border-color: var(--color-primary);

}

.contact-form .tpm-btn-primary {

  width: 100%;

}

.contact-form .tpm-btn-primary button {

  justify-content: center;

}

.contact-form .tpm-btn-primary span {

  justify-content: center;

}



/*===============================

  Contact Info

  ===============================*/

.contact-info {

  display: inline-flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  border-radius: 20px;

  padding: 50px 0;

  width: 100%;

  background: var(--color-border);

}

.contact-info .contact-icon {

  width: 70px;

  height: 70px;

  background: rgba(255, 73, 74, 0.2);

  border-radius: 100px;

  display: flex;

  align-items: center;

  justify-content: center;

  color: var(--color-primary);

  margin-bottom: 25px;

  font-size: 30px;

}

.contact-info .title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 32px;

  font-weight: 700;

  line-height: 130%;

  text-transform: capitalize;

  margin-bottom: 15px;

}

.contact-info .para {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 22px;

  text-align: center;

  margin-bottom: 5px;

}

.contact-info .para:last-child {

  margin-bottom: 0;

}



/*===============================

  Contact Get In Touch Wrap

  ===============================*/

.contact-get-in-touch-wrap .get-in-touch-wrapper .section-head {

    padding-right: 80px;

    padding-bottom: 30px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .contact-get-in-touch-wrap .get-in-touch-wrapper .section-head {

    padding-right: 0;

  }

}

@media only screen and (max-width: 767px) {

  .contact-get-in-touch-wrap .get-in-touch-wrapper .section-head {

    padding-right: 0;

  }

}



#form-messages.error {

  color: var(--color-danger);

}

#form-messages.success {

  color: var(--color-success);

}



.contact-area-left-portfolio-fixed .form-group {

  margin-bottom: 20px;

}

.contact-area-left-portfolio-fixed input,

.contact-area-left-portfolio-fixed textarea {

  border: 1px solid var(--color-border);

}

.contact-area-left-portfolio-fixed input {

  height: 70px;

  padding: 0 20px;

}

.contact-area-left-portfolio-fixed textarea {

  padding-top: 20px;

  padding-left: 20px;

  min-height: 193px;

  border-radius: var(--radius);

  resize: none;

  padding: 15px;

  font-size: 16px;

}



.tmp-contact-form.contact-form-style-1 {

  padding: 50px;

  position: relative;

  z-index: 1;

  background: var(--color-gray-2);

  border-radius: 20px;

  border: 2px solid var(--color-border);

  /* Form Group  */

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .tmp-contact-form.contact-form-style-1 {

    padding: 30px 35px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-contact-form.contact-form-style-1 {

    padding: 50px 20px;

    padding-left: 20px;

    max-width: inherit;

  }

}

.tmp-contact-form.contact-form-style-1 .form-group {

  position: relative;

  z-index: 2;

  margin-bottom: 30px;

}

.tmp-contact-form.contact-form-style-1 .form-group label {

  position: absolute;

  left: 0;

  width: 100%;

  top: 9px;

  color: var(--color-body);

  transition: 0.3s;

  z-index: -1;

  letter-spacing: 0.5px;

  font-size: 16px;

}

.tmp-contact-form.contact-form-style-1 .form-group input {

  border: 0;

  border-bottom: 2px solid var(--color-border);

  background-color: transparent;

  padding-bottom: 8px;

  padding-top: 8px;

  padding-left: 0;

  padding-right: 0;

  border-radius: 0;

}

.tmp-contact-form.contact-form-style-1 .form-group input[type=submit] {

  border: 2px solid var(--color-heading);

  background-color: transparent;

  color: var(--color-body);

  font-size: 16px;

  font-weight: 700;

  height: 46px;

  line-height: 44px;

  padding: 0;

  text-transform: capitalize;

  transition: 0.4s;

}

.tmp-contact-form.contact-form-style-1 .form-group input[type=submit]:hover {

  background: #000248;

  color: #ffffff;

}

.tmp-contact-form.contact-form-style-1 .form-group textarea {

  border: 0;

  min-height: 165px;

  padding-bottom: 8px;

  padding-top: 8px;

  border-bottom: 2px solid var(--color-border);

  background-color: transparent;

  resize: none;

  padding-left: 0;

}

.tmp-contact-form.contact-form-style-1 .form-group span.focus-border {

  position: absolute;

  bottom: 0;

  left: 0;

  width: 0;

  height: 2px;

  background-color: var(--color-primary);

  transition: 0.4s;

}

.tmp-contact-form.contact-form-style-1 .form-group.focused label {

  top: -10px;

  font-size: 12px;

  color: var(--color-primary);

  transition: 0.3s;

}

.tmp-contact-form.contact-form-style-1 .form-group.focused span.focus-border {

  width: 100%;

  transition: 0.4s;

}

.tmp-contact-form.contact-form-style-1 .personal-information span.text {

  font-size: 15px;

  line-height: 24px;

  display: inline-block;

  padding-right: 10px;

}

.tmp-contact-form.contact-form-style-1 .personal-information span i {

  font-size: 22px;

  font-weight: 400;

  color: var(--color-heading);

  line-height: 26px;

  padding-right: 4px;

}

.tmp-contact-form.contact-form-style-1 .personal-information span a {

  font-size: 22px;

  font-weight: 700;

  color: var(--color-heading);

  line-height: 26px;

  text-decoration: none;

  transition: 0.4s;

}

@media only screen and (max-width: 767px) {

  .tmp-contact-form.contact-form-style-1 .personal-information span a {

    font-size: 14px;

  }

}

.tmp-contact-form.contact-form-style-1 .personal-information span a:hover {

  color: var(--color-primary);

}



.contact-info-box {

  padding: 50px;

  position: relative;

  z-index: 1;

  background: var(--color-gray-2);

  border-radius: 20px;

  border: 2px solid var(--color-border);

  height: 100%;

  overflow: hidden;

}

.contact-info-box .tmp-light {

  opacity: 1;

}

.contact-info-box .inner {

  position: relative;

  z-index: 2;

}

.contact-info-box i {

  font-size: 340px;

  position: absolute;

  bottom: 30px;

  right: 30px;

  font-weight: 300;

  opacity: 0.05;

}



.theme-gradient {

  background: var(--theme-gradient);

  background-clip: text;

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

}



.center-light-wrapper {

  position: relative;

}

.center-light-wrapper .center-light {

  position: absolute;

  width: 300px;

  height: 300px;

  left: 50%;

  top: 50%;

  background: var(--color-primary);

  border-radius: 100%;

  transform: translate(-50%, -50%);

  filter: blur(100px);

}



.breadcrumb-bg {

  background-position: center;

  background-repeat: no-repeat;

  background-size: cover;

  background-image: url("../images/breadcrumb/breadcum-bg.png");

}



.breadcrumb-area {

  padding-top: 150px;

  padding-bottom: 70px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .breadcrumb-area {

    padding-top: 100px;

    padding-bottom: 48px;

  }

}

@media only screen and (max-width: 767px) {

  .breadcrumb-area {

    padding-top: 100px;

    padding-bottom: 48px;

  }

}



.breadcrumb-inner {

  margin: 0 auto;

}

.breadcrumb-inner .title {

  color: var(--color-heading);

  margin-bottom: 5px;

  font-size: 40px;

}

@media only screen and (max-width: 575px) {

  .breadcrumb-inner .title {

    font-size: 32px;

  }

}

.breadcrumb-inner .page-list {

  display: flex;

  align-items: center;

  justify-content: center;

}

.breadcrumb-inner .page-list li {

  color: var(--color-gray);

  font-family: var(--font-secondary);

}

.breadcrumb-inner .page-list li.icon {

  padding: 0 10px;

}

.breadcrumb-inner .page-list li.active {

  color: var(--color-primary);

}

.breadcrumb-inner:hover a {

  color: var(--color-primary);

}



.progress-wrap {

  position: fixed;

  right: 30px;

  bottom: 30px;

  height: 46px;

  width: 46px;

  cursor: pointer;

  display: block;

  border-radius: 50px;

  z-index: 10000;

  opacity: 1;

  visibility: hidden;

  transform: translateY(15px);

  -webkit-transition: all 200ms linear;

  transition: all 200ms linear;

}



.progress-wrap.active-progress {

  opacity: 1;

  visibility: visible;

  transform: translateY(0);

}



.progress-wrap::after {

  position: absolute;

  font-family: var(--font-three);

  content: "\f062";

  text-align: center;

  line-height: 46px;

  font-size: 16px;

  color: var(--color-primary);

  left: 0;

  top: 0;

  height: 46px;

  width: 46px;

  cursor: pointer;

  display: block;

  z-index: 1;

  -webkit-transition: all 200ms linear;

  transition: all 200ms linear;

  border: 0px solid var(--color-primary);

  box-shadow: none;

  border-radius: 50% !important;

  border-radius: 5px;

  font-weight: 300;

}



.progress-wrap:hover::after {

  opacity: 1;

  content: "\f062";

  border: 0px solid var(--color-primary);

  font-weight: 300;

}



.progress-wrap::before {

  position: absolute;

  font-family: var(--font-three);

  content: "\f062";

  text-align: center;

  line-height: 46px;

  font-size: 16px;

  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;

  -webkit-transition: all 200ms linear;

  transition: all 200ms linear;

  font-weight: 300;

}



.progress-wrap:hover::before {

  opacity: 0;

}



.progress-wrap svg path {

  fill: none;

}



.progress-wrap svg {

  color: var(--color-primary);

  border-radius: 50%;

  background: #fff;

}



.progress-wrap svg.progress-circle path {

  stroke: var(--color-primary);

  stroke-width: 0px;

  box-sizing: border-box;

  -webkit-transition: all 200ms linear;

  transition: all 200ms linear;

  padding: 2px;

}



.home-blue .progress-wrap svg.progress-circle path {

  stroke: var(--color-primary-2);

}

.home-blue .progress-wrap::after {

  border-color: var(--color-primary-2);

  box-shadow: 0px 3px 20px 6px rgba(7, 66, 233, 0.3215686275);

  color: var(--color-primary-2);

}



/*===============================

  Scroll To Top

  ===============================*/

.scrollToTop {

  display: none !important;

  height: 55px;

  width: 55px;

  position: fixed;

  bottom: 20px;

  left: 20px;

  background-color: #0f0f0f;

  border-radius: 50%;

  overflow: hidden;

  cursor: pointer;

  z-index: 999;

  transition: 0.5s ease all;

}

@media only screen and (max-width: 575px) {

  .scrollToTop {

    height: 40px;

    width: 40px;

  }

}



.scrollToTop.active-progress {

  display: block !important;

}



.scrollToTop:hover {

  transform: translateY(-15%);

}



.scrollToTop .arrowUp {

  position: absolute;

  left: 0;

  top: 0;

  z-index: 3;

  width: 100%;

  height: 100%;

  display: flex;

  align-items: center;

  justify-content: center;

  color: #ffffff;

  font-size: 24px;

}



.scrollToTop .arrowUp i {

  font-size: 19px;

}



.scrollToTop .water {

  position: absolute;

  left: 0;

  top: 0;

  z-index: 2;

  width: 100%;

  height: 100%;

  transform: translateY(100%);

  background-color: var(--color-primary);

  transition: all 0.3s;

}

.scrollToTop .water svg symbol path {

  fill: var(--color-primary) !important;

}



symbol path {

  fill: var(--color-primary) !important;

}



.scrollToTop .water_wave {

  width: 200%;

  position: absolute;

  bottom: 100%;

}



.scrollToTop .water_wave_back {

  right: 0;

  fill: var(--color-heading);

  animation: wave-back 1.4s infinite linear;

}



.scrollToTop .water_wave_front {

  left: 0;

  fill: rgba(122, 37, 158, 0.8784313725);

  margin-bottom: -1px;

  animation: wave-front 0.7s infinite linear;

}



@keyframes wave-front {

  100% {

    transform: translateX(-50%);

  }

}

@keyframes wave-back {

  100% {

    transform: translateX(50%);

  }

}

body.loaded {

  overflow: hidden !important;

  height: 100% !important;

}



.loader-wrap {

  position: fixed;

  z-index: 10;

  height: 100vh;

  width: 100%;

  left: 0;

  top: 0;

  display: -webkit-box;

  display: -ms-flexbox;

  display: flex;

  overflow: hidden;

  -webkit-box-align: center;

  -ms-flex-align: center;

  align-items: center;

  -webkit-box-pack: center;

  -ms-flex-pack: center;

  justify-content: center;

  background: transparent;

  z-index: 99999999999999;

}



.loader-wrap svg {

  position: absolute;

  top: 0;

  width: 100vw;

  height: 110vh;

  fill: #1a1a1a;

}



.loader-wrap .loader-wrap-heading .load-text {

  font-size: 20px;

  font-weight: 200;

  letter-spacing: 15px;

  text-transform: uppercase;

  z-index: 20;

}



.load-text span {

  -webkit-animation: loading 1s infinite alternate;

  animation: loading 1s infinite alternate;

  color: var(--color-heading);

}



.load-text span:nth-child(1) {

  -webkit-animation-delay: 0s;

  animation-delay: 0s;

}



.load-text span:nth-child(2) {

  -webkit-animation-delay: 0.1s;

  animation-delay: 0.1s;

}



.load-text span:nth-child(3) {

  -webkit-animation-delay: 0.2s;

  animation-delay: 0.2s;

}



.load-text span:nth-child(4) {

  -webkit-animation-delay: 0.3s;

  animation-delay: 0.3s;

}



.load-text span:nth-child(5) {

  -webkit-animation-delay: 0.4s;

  animation-delay: 0.4s;

}



.load-text span:nth-child(6) {

  -webkit-animation-delay: 0.5s;

  animation-delay: 0.5s;

}



.load-text span:nth-child(7) {

  -webkit-animation-delay: 0.6s;

  animation-delay: 0.6s;

}



@-webkit-keyframes loading {

  0% {

    opacity: 1;

  }

  100% {

    opacity: 0;

  }

}

@keyframes loading {

  0% {

    opacity: 1;

  }

  100% {

    opacity: 0;

  }

}

.year-of-expariance-wrapper {

  position: relative;

  overflow: hidden;

  background: var(--color-gray-2);

  border-radius: 20px;

  padding: 36px 52px 51px 52px;

}

.year-of-expariance-wrapper.bg-blur-style-one::after, .year-of-expariance-wrapper.bg-blur-style-two::after, .year-of-expariance-wrapper.bg-blur-style-three::after {

  content: " ";

  position: absolute;

  right: -250px;

  bottom: -367px;

  min-width: 474px;

  min-height: 474px;

  border-radius: 100px;

  filter: blur(227px);

  z-index: -1;

}

.year-of-expariance-wrapper.bg-blur-style-one::after {

  background: var(--color-primary);

}

@media (min-width: 1400px) {

  .year-of-expariance-wrapper {

    padding: 36px 52px 51px 52px;

  }

}

@media only screen and (max-width: 767px) {

  .year-of-expariance-wrapper {

    padding: 30px 20px;

  }

}

.year-of-expariance-wrapper .year-expariance-wrap {

  display: flex;

  align-items: center;

  flex-wrap: wrap;

  gap: 10px;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .year-of-expariance-wrapper .year-expariance-wrap {

    gap: 10px;

  }

}

@media only screen and (max-width: 575px) {

  .year-of-expariance-wrapper .year-expariance-wrap {

    display: block;

  }

}

.year-of-expariance-wrapper .year-expariance-wrap .year-number {

  color: var(--color-primary);

  font-family: var(--font-primary);

  font-size: 167px;

  line-height: 115%;

  font-weight: 700;

  margin-bottom: 0;

  flex-basis: 40%;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .year-of-expariance-wrapper .year-expariance-wrap .year-number {

    font-size: 100px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .year-of-expariance-wrapper .year-expariance-wrap .year-number {

    font-size: 100px;

  }

}

@media only screen and (max-width: 767px) {

  .year-of-expariance-wrapper .year-expariance-wrap .year-number {

    font-size: 100px;

    line-height: 1;

  }

}

.year-of-expariance-wrapper .year-expariance-wrap .year-title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 42px;

  font-weight: 700;

  line-height: 130%;

  text-transform: capitalize;

  margin-bottom: 0;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .year-of-expariance-wrapper .year-expariance-wrap .year-title {

    font-size: 37px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .year-of-expariance-wrapper .year-expariance-wrap .year-title {

    font-size: 37px;

  }

}

@media only screen and (max-width: 767px) {

  .year-of-expariance-wrapper .year-expariance-wrap .year-title {

    font-size: 32px;

  }

  .year-of-expariance-wrapper .year-expariance-wrap .year-title br {

    display: none;

  }

}

@media only screen and (max-width: 575px) {

  .year-of-expariance-wrapper .year-expariance-wrap .year-title {

    font-size: 26px;

  }

  .year-of-expariance-wrapper .year-expariance-wrap .year-title br {

    display: none;

  }

}

.year-of-expariance-wrapper .year-para {

  color: var(--color-heading);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 26px;

  margin-top: 12px;

}



.counter-card {

  padding: 34px 7px;

  border-radius: 20px;

  background: var(--color-gray-2);

  height: 100%;

  box-shadow: 4px 4px 0 0 rgba(20, 155, 252, 0.11);

}

.counter-card .counter-title {

  color: var(--color-heading);

  text-align: center;

  font-family: var(--font-primary);

  font-size: 48px;

  font-weight: 700;

  line-height: 60px;

  text-transform: capitalize;

  margin-bottom: 0;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .counter-card .counter-title {

    font-size: 40px;

  }

}

.counter-card .counter-para {

  color: var(--color-body);

  text-align: center;

  font-family: var(--font-secondary);

  font-size: 14px;

  font-weight: 400;

  line-height: 30px;

  margin-top: 0px;

}



/*===============================

  Education Experience Card

  ===============================*/

.education-experience-card {

  border-radius: 20px;

  background: var(--color-gray-2);

  padding: 50px 40px;

  transition: all 0.4s ease;

  position: relative;

  overflow: hidden;

  height: 100%;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .education-experience-card {

    padding: 20px;

  }

}

@media only screen and (max-width: 575px) {

  .education-experience-card {

    padding: 20px;

  }

}

@media only screen and (max-width: 767px) {

  .education-experience-card {

    padding: 30px 20px;

  }

}

.education-experience-card .edu-sub-title {

  color: var(--color-heading);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 26px;

  margin-bottom: 5px;

}

.education-experience-card .edu-title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 18px;

  font-weight: 700;

  line-height: 28px;

  margin-bottom: 0;

}

.education-experience-card .edu-para {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-top: 18px;

  margin-bottom: 0;

}

@media only screen and (max-width: 767px) {

    .education-experience-card .edu-para {

        margin-top: 30px;
        line-height: 27px;

    }

    #research .education-experience-card .edu-para {

        margin-top: 8px;

        max-width: 75%;

    }

}



/*===============================

  Experiences Wrapper

  ===============================*/

.experiences-wrapper {

  margin-top: 75px;

}

.experiences-wrapper.v2 .experiences-wrap-left-content {

  padding-left: 40px;

}

@media only screen and (max-width: 575px) {

  .experiences-wrapper.v2 .experiences-wrap-left-content {

    padding: 0 15px;

  }

}

.experiences-wrapper .experiences-wrap-left-content {

  padding: 0 40px;

}

@media (min-width: 1200px) {

  .experiences-wrapper .experiences-wrap-left-content {

    padding-right: 138px;

    padding-left: 0;

  }

}

@media only screen and (max-width: 575px) {

  .experiences-wrapper .experiences-wrap-left-content {

    padding: 0 15px;

  }

}

.experiences-wrapper .experiences-wrap-left-content .experience-content {

  margin-bottom: 50px;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .experiences-wrapper .experiences-wrap-left-content .experience-content {

    margin-bottom: 30px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .experiences-wrapper .experiences-wrap-left-content .experience-content {

    margin-bottom: 30px;

  }

}

@media only screen and (max-width: 767px) {

  .experiences-wrapper .experiences-wrap-left-content .experience-content {

    margin-bottom: 30px;

  }

}

.experiences-wrapper .experiences-wrap-left-content .experience-content:last-child {

  margin-bottom: 0;

}

.experiences-wrapper .experiences-wrap-left-content .experience-content .ex-subtitle {

  color: var(--color-primary);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 500;

  line-height: 28px;

  margin-bottom: 0;

}

.experiences-wrapper .experiences-wrap-left-content .experience-content .ex-name {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 24px;

  font-weight: 700;

  line-height: 30px;

  margin-bottom: 0;

  margin-top: 0px;

}

.experiences-wrapper .experiences-wrap-left-content .experience-content .ex-title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 18px;

  font-weight: 500;

  line-height: 27px;

  margin-bottom: 0;

  margin-top: 6px;

}

.experiences-wrapper .experiences-wrap-left-content .experience-content .ex-para {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-top: 16px;

}

.experiences-wrapper .experiences-wrap-right-content {

  overflow: hidden;

  padding: 25px;

  background: var(--color-gray-2);

  border-radius: 28px;

}

@media only screen and (max-width: 767px) {

  .experiences-wrapper .experiences-wrap-right-content {

    padding: 14px;

  }

}

.experiences-wrapper .experiences-wrap-right-content img {

  width: 100%;

  border-radius: 20px;

}



/*===============================

  Latest Portfolio Area

  ===============================*/

.custom-column-grid .row {

  --bs-gutter-x: 5rem;

  --bs-gutter-y: 4rem;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .custom-column-grid .row {

    --bs-gutter-x: 2rem;

    --bs-gutter-y: 2rem;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .custom-column-grid .row {

    --bs-gutter-x: 2rem;

    --bs-gutter-y: 2rem;

  }

}

@media only screen and (max-width: 767px) {

  .custom-column-grid .row {

    --bs-gutter-x: 15px;

    --bs-gutter-y: 30px;

  }

}



/*===============================

  Latest Portfolio Custom Title

  ===============================*/

.latest-portfolio-custom-title {

  text-align: center;

  -webkit-text-stroke: 1px #242424;

  color: transparent;

  font-family: var(--font-primary);

  text-transform: uppercase;

  margin-bottom: 34px;

  font-size: 40px;

  line-height: 50px;

  font-weight: 700;

}

@media (min-width: 576px) {

  .latest-portfolio-custom-title {

    font-size: 100px;

    line-height: 110px;

  }

}

@media (min-width: 1640px) {

  .latest-portfolio-custom-title {

    font-size: 165px;

    line-height: 115%;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .latest-portfolio-custom-title {

    font-size: 65px;

  }

}

@media only screen and (max-width: 767px) {

  .latest-portfolio-custom-title {

    font-size: 65px;

  }

}



/*===============================

  Latest Portfolio Card

  ===============================*/

.latest-portfolio-card .portfoli-card-img {

  border-radius: 20px;

  background: var(--color-gray-2);

  border: 2px solid var(--color-border);

  transition: var(--transition);

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .latest-portfolio-card .portfoli-card-img {

    padding: 10px;

  }

}

@media only screen and (max-width: 767px) {

  .latest-portfolio-card .portfoli-card-img {

    padding: 10px;

  }

}

@media only screen and (max-width: 575px) {

  .latest-portfolio-card .portfoli-card-img {

    padding: 5px;

  }

}

.latest-portfolio-card .portfoli-card-img a {

  display: block;

  transition: var(--transition);

}

.latest-portfolio-card .portfoli-card-img img {

  border-radius: 20px;

  width: 100%;
	    height: 300px;

  object-fit: cover;

  transition: var(--transition);

}

.latest-portfolio-card:hover .portfoli-card-img img {

  transform: scale(1.03);

}

.latest-portfolio-card.v5 .portfoli-card-img {

  padding: 0;

  overflow: hidden;

  position: relative;

}

.latest-portfolio-card.v5 .portfoli-card-img .img-link-icon {

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  width: 80px;

  height: 80px;

  border-radius: 100px;

  border: 2px solid var(--color-primary);

  font-size: 24px;

  font-weight: 900;

  opacity: 0;

  transition: all 0.4s ease;

  z-index: 10;

  background: var(--color-primary);

  display: flex;

  justify-content: center;

  align-items: center;

}

@media (min-width: 992px) {

  .latest-portfolio-card.v5 .portfoli-card-img .img-link-icon {

    width: 112px;

    height: 112px;

  }

}

.latest-portfolio-card.v5 .portfoli-card-img .img-link-icon i {

  transform: rotate(45deg);

  transition: all 0.4s ease;

  color: var(--color-white);

}

.latest-portfolio-card.v5 .portfoli-card-img .img-link-icon:hover {

  color: var(--color-heading);

}

.latest-portfolio-card.v5 .portfoli-card-img .img-link-icon:hover i {

  transform: rotate(90deg);

}

.latest-portfolio-card.v5 .portfoli-card-img:hover .img-link-icon {

  opacity: 1;

}

.latest-portfolio-card.v5 .portfolio-card-title:hover a {

  color: var(--color-primary);

}

.latest-portfolio-card .portfolio-card-content-wrap {

  display: flex;

  align-items: center;

  justify-content: space-between;

  margin-top: 33px;

  gap: 20px;

}

@media only screen and (max-width: 767px) {

  .latest-portfolio-card .portfolio-card-content-wrap {

    margin-top: 15px;

    display: block;

  }

}

.latest-portfolio-card .portfolio-card-content-wrap .portfolio-card-title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 16px;

  font-weight: 500;

  line-height: 26px;

  margin-bottom: 0;

  transition: var(--transition);

}

@media only screen and (max-width: 479px) {

  .latest-portfolio-card .portfolio-card-content-wrap .portfolio-card-title {

    font-size: 20px;

  }

}

.latest-portfolio-card .portfolio-card-content-wrap .portfolio-card-title:hover {

  color: var(--color-primary);

}

.latest-portfolio-card .portfolio-card-content-wrap .portfoli-card-para {

  color: #139bfd;

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 600;

  line-height: 30px;

  margin-top: 10px;
	    margin-bottom: 10px;

}

@media only screen and (max-width: 767px) {

  .latest-portfolio-card .portfolio-card-content-wrap .tmp-arrow-icon-btn {

    margin-top: 15px;

  }

}



/*===============================

  Latest Portfolio Area

  ===============================*/

.latest-portfolio-area .see-all-btn-wrap {

  display: flex;

  justify-content: center;

  align-items: center;

  margin-top: 60px;

}



/*===================================

  Latest Portfolio Card Style Two

  ===================================*/

.latest-portfolio-card-style-two {

  border-radius: 20px;

  background: var(--color-gray-2);

  padding: 20px;

  height: 100%;

}

@media (min-width: 576px) {

  .latest-portfolio-card-style-two {

    padding: 20px;

  }

}

@media only screen and (max-width: 575px) {

  .latest-portfolio-card-style-two {

    padding: 10px;

  }

}

.latest-portfolio-card-style-two .portfoli-card-img img {

  border-radius: 10px;

}

.latest-portfolio-card-style-two .portfolio-card-title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 32px;

  font-weight: 700;

  line-height: 42px;

  text-transform: capitalize;

  margin-top: 20px;

  margin-bottom: 13px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .latest-portfolio-card-style-two .portfolio-card-title {

    font-size: 24px;

    line-height: 1.4;

  }

}

@media only screen and (max-width: 767px) {

  .latest-portfolio-card-style-two .portfolio-card-title {

    font-size: 26px;

    line-height: 34px;

  }

}

.latest-portfolio-card-style-two .portfolio-card-content-wrap {

  display: flex;

  align-items: flex-end;

  justify-content: space-between;

  flex-wrap: wrap;

  gap: 10px;

  padding: 10px 0;

}



/*===============================

  Tags Items

  ===============================*/

.tag-items ul {

  display: flex;

  align-items: center;

  gap: 10px;

}

@media only screen and (max-width: 767px) {

  .tag-items ul {

    gap: 6px;

    flex-wrap: wrap;

  }

}

.tag-items ul li {

  margin: 0;

  margin-bottom: 6px;

}

.tag-items ul li a {

  border-radius: 500px;

  border: 2px solid var(--color-border);

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 14px;

  font-weight: 400;

  line-height: 24px;

  padding: 5px 15px;

  transition: var(--transition);

}

.tag-items ul li a:hover {

  background: var(--color-primary);

  border-color: var(--color-primary);

  color: #ffffff;

}



/*===================================

  Latest Portfolio Tabs Area

  ===================================*/

.latest-portfolio-tabs-area .nav-tabs {

  border-bottom: 1px solid none;

  border: none;

}

.latest-portfolio-tabs-area .nav {

  display: flex;

  justify-content: center;

  gap: 10px;

}

@media (min-width: 776px) {

  .latest-portfolio-tabs-area .nav {

    gap: 15px;

  }

}

.latest-portfolio-tabs-area .nav li {

  margin: 0;

}

.latest-portfolio-tabs-area .nav .nav-link {

  padding: 10px 25px;

  border-radius: 10px;

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 16px;

  font-weight: 600;

  line-height: 27px;

  background: var(--color-gray-2);

  border: none;

  letter-spacing: 0.5px;

  position: relative;

  overflow: hidden;

}

.latest-portfolio-tabs-area .nav .nav-link::after {

  position: absolute;

  content: "";

  width: 40px;

  height: 40px;

  background: var(--color-primary);

  left: 50%;

  bottom: -20px;

  transform: translateX(-50%);

  border-radius: 100%;

  filter: blur(15px);

  opacity: 0;

  transition: 0.4s;

}

.latest-portfolio-tabs-area .nav .nav-link.active {

  background: rgba(19, 155, 253, 0.062745098) !important;

  color: var(--color-primary);

  border: none;

}

.latest-portfolio-tabs-area .nav .nav-link.active::after {

  opacity: 0.5;

}

.latest-portfolio-tabs-area .tab-content {

  margin-top: 60px;

  position: relative;

  z-index: 1;

}

.latest-portfolio-tabs-area .tab-content.bg-blur-style-one::after, .latest-portfolio-tabs-area .tab-content.bg-blur-style-one::before, .latest-portfolio-tabs-area .tab-content.bg-blur-style-two::after, .latest-portfolio-tabs-area .tab-content.bg-blur-style-two::before, .latest-portfolio-tabs-area .tab-content.bg-blur-style-three::after, .latest-portfolio-tabs-area .tab-content.bg-blur-style-three::before {

  content: " ";

  position: absolute;

  width: 304px;

  height: 304px;

  opacity: 0.6;

  filter: blur(280px);

  z-index: -1;

}

.latest-portfolio-tabs-area .tab-content.bg-blur-style-one::after, .latest-portfolio-tabs-area .tab-content.bg-blur-style-two::after, .latest-portfolio-tabs-area .tab-content.bg-blur-style-three::after {

  left: 0;

  bottom: 172px;

}

.latest-portfolio-tabs-area .tab-content.bg-blur-style-one::before, .latest-portfolio-tabs-area .tab-content.bg-blur-style-two::before, .latest-portfolio-tabs-area .tab-content.bg-blur-style-three::before {

  right: 0;

  bottom: 65%;

}

.latest-portfolio-tabs-area .tab-content.bg-blur-style-one::after, .latest-portfolio-tabs-area .tab-content.bg-blur-style-one::before {

  background: var(--color-primary);

}

.latest-portfolio-tabs-area .tab-content img {

  border-radius: 20px;

  width: 100%;

  object-fit: cover;

}

.latest-portfolio-tabs-area .tab-content .tab-right-img-wrap .small-img:last-child {

  margin-top: 30px;

}



/*----------------------

    Tmp Portfolio  

-----------------------*/

.tmp-portfolio {

  position: relative;

  overflow: hidden;

  border-radius: 20px;

  z-index: 1;

}

.tmp-portfolio img {

  width: 100%;

}

.tmp-portfolio::after {

  content: " ";

  position: absolute;

  right: 0;

  top: 0;

  background: linear-gradient(var(--color-primary) 10%, #000);

  width: 100%;

  height: 100%;

  opacity: 0;

  transition: all 0.4s ease;

  z-index: 1;

}

.tmp-portfolio:hover::after {

  opacity: 0.85;

}

.tmp-portfolio:hover .portfolio-card-content-wrap {

  bottom: 30px;

  opacity: 1;

  pointer-events: inherit;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-portfolio:hover .portfolio-card-content-wrap {

    bottom: 15px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-portfolio:hover .portfolio-card-content-wrap {

    bottom: 15px;

  }

}

.tmp-portfolio .portfolio-card-content-wrap {

  position: absolute;

  bottom: 0;

  left: 30px;

  right: 30px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 15px;

  opacity: 0;

  overflow: hidden;

  pointer-events: none;

  transition: all 0.4s ease;

  z-index: 999;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-portfolio .portfolio-card-content-wrap {

    left: 15px;

    right: 15px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-portfolio .portfolio-card-content-wrap {

    left: 15px;

    right: 15px;

  }

}

.tmp-portfolio .portfolio-card-content-wrap .portfoli-card-para {

  margin-bottom: 10px;

  font-size: 16px;

  font-family: var(--font-secondary);

  color: var(--color-white);

}

.tmp-portfolio .portfolio-card-content-wrap .portfolio-card-title {

  font-size: 24px;

  margin-bottom: 0;

  color: var(--color-white);

  line-height: 1.3;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-portfolio .portfolio-card-content-wrap .portfolio-card-title {

    font-size: 18px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-portfolio .portfolio-card-content-wrap .portfolio-card-title {

    font-size: 18px;

  }

}

.tmp-portfolio .portfolio-card-content-wrap .portfolio-card-title:hover {

  color: #fff !important;

}

.tmp-portfolio .tmp-arrow-icon-btn i {

  color: var(--color-white);

}



.over_link {

  position: absolute;

  left: 0;

  top: 0;

  bottom: 0;

  right: 0;

  width: 100%;

  height: 100%;

  z-index: 5;

}



/*===============================

  My Skill Card Wrapper

  ===============================*/

.my-skill-card {

  display: flex;

  justify-content: center;

  align-items: center;

  flex-direction: column;

  padding: 43px 20px 32px 20px;

  border-radius: 6px;

  overflow: hidden;

  border-width: 2px;

}

@media (min-width: 992px) {

  .my-skill-card {

    justify-content: space-between;

    flex-direction: inherit;

  }

}

.my-skill-card .card-icon {

  color: var(--color-body);

  font-size: 34px;

  font-weight: 600;

  transition: all 0.4s ease;

  width: 70px;

  height: 70px;

  border-radius: 100%;

  display: flex;

  align-items: center;

  justify-content: center;

  position: relative;

  box-shadow: var(--shadow-1);

}

.my-skill-card .card-icon::before {

  content: "";

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  background: linear-gradient(1turn, var(--color-primary), var(--color-primary-alt));

  width: 100%;

  height: 100%;

  opacity: 1;

  transition: 0.5s, top 0s, left 0s;

  border-radius: 50%;

  z-index: -1;

}

.my-skill-card .card-icon::after {

  content: "";

  position: absolute;

  inset: 2px;

  background: var(--color-card);

  border-radius: 50%;

  z-index: -1;

}

.my-skill-card .card-icon img {

  max-height: 32px;

  filter: invert(1);

}

.my-skill-card .main-title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 32px;

  font-weight: 700;

  line-height: 42px;

  text-transform: capitalize;

  margin-bottom: 0;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .my-skill-card .main-title {

    font-size: 17px;

    line-height: 1.2;

  }

}

.my-skill-card .sub-title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 18px;

  font-weight: 400;

  line-height: 27px;

  text-align: center;

}

@media (min-width: 900px) {

  .my-skill-card .sub-title {

    text-align: start;

  }

}

.my-skill-card .card-para {

  max-width: 452px;

  margin-bottom: 0;

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  text-align: center;

  transition: all 0.4s ease;

}

@media (min-width: 900px) {

  .my-skill-card .card-para {

    text-align: start;

  }

}

.my-skill-card .read-more-btn:hover {

  color: var(--color-heading);

}



/*=========================

  My Skill Card Style Two

  =========================*/

.my-skill-area-style-two .my-skill-area-left-content-wrap {

  position: sticky;

  top: 100px;

}

@media (min-width: 576px) {

  .my-skill-area-style-two .my-skill-area-left-content-wrap {

    padding-right: 100px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .my-skill-area-style-two .my-skill-area-left-content-wrap {

    padding-right: 0;

  }

}

@media only screen and (max-width: 767px) {

  .my-skill-area-style-two .my-skill-area-left-content-wrap {

    padding-right: 0;

  }

}



/*===============================

  My Skill Card Style Two

  ===============================*/

.my-skill-card-style-two .my-skill-card {

  padding: 40px;

  position: relative;

  flex-direction: column;

  border-width: 2px;

}

@media (min-width: 900px) {

  .my-skill-card-style-two .my-skill-card {

    align-items: flex-start;

  }

}

@media only screen and (max-width: 767px) {

  .my-skill-card-style-two .my-skill-card {

    padding: 40px 15px;

  }

}

.my-skill-card-style-two .my-skill-card .card-title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 24px;

  font-weight: 700;

  line-height: 30px;

  margin-top: 19px;

  margin-bottom: 0;

}

.my-skill-card-style-two .my-skill-card .card-para {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 14px;

  font-weight: 400;

  line-height: 24px;

  margin-top: 21px;

}



.border--radious-20 {

  border-radius: 20px !important;

}



/*===============================

  About Me Section Card

===============================*/

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .personal-page-inner-wrapper {

    margin-top: 40px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .personal-page-inner-wrapper {

    margin-top: 40px;

  }

}

@media only screen and (max-width: 767px) {

  .personal-page-inner-wrapper {

    margin-top: 40px;

  }

}



.about-us-section-card .about-us-card {

  border-radius: 20px;

  background: var(--color-gray-2);

  padding: 25px;

  height: 100%;

}

.about-us-section-card .about-us-card .card-head .logo-img {

  width: 65px;

  height: 65px;

  background: var(--icon-gradient);

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 100px;

  min-width: 65px;

  box-shadow: var(--shadow-1);

  margin-bottom: 30px;

  margin-left: 0;

}

.about-us-section-card .about-us-card .card-head .logo-img i {

  font-size: 24px;

  color: var(--color-white);

}

.about-us-section-card .about-us-card .card-head .card-title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 28px;

  font-weight: 700;

  line-height: 1.3;

  margin-bottom: 30px;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .about-us-section-card .about-us-card .card-head .card-title {

    font-size: 20px;

    margin-bottom: 10px;

  }

}

.about-us-section-card .about-us-card .card-para {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 18px;

  font-weight: 400;

  line-height: 32px;

}

@media only screen and (max-width: 767px) {

  .about-us-section-card .about-us-card .card-para {

    font-size: 16px;

    line-height: 28px;

  }

}



/*===============================

  About Me Left Content Wrap

  ===============================*/

.about-us-left-content-wrap {

  position: relative;

  z-index: 1;

}

@media (min-width: 992px) and (max-width: 1200px) {

  .about-us-left-content-wrap {

    padding-left: 10px;

    padding-right: 10px;

  }

}

@media only screen and (max-width: 767px) {

  .about-us-left-content-wrap {

    padding: 0;

  }

}

.about-us-left-content-wrap.bg-vactor-one::after {

  content: " ";

  position: absolute;

  left: 0;

  top: 197px;

  background: linear-gradient(0deg, rgba(255, 1, 79, 0) 15.49%, var(--color-primary) 100%);

  filter: blur(50px);

  border-radius: 100%;

  width: 410px;

  height: 410px;

  z-index: -1;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .about-us-left-content-wrap.bg-vactor-one::after {

    width: 250px;

    height: 250px;

  }

}

@media only screen and (max-width: 767px) {

  .about-us-left-content-wrap.bg-vactor-one::after {

    width: 200px;

    height: 200px;

  }

}

.about-us-left-content-wrap.bg-vactor-two::after {

  content: " ";

  position: absolute;

  left: 0;

  top: 197px;

  background: linear-gradient(0deg, rgba(255, 1, 79, 0) 15.49%, #FDC448 100%);

  filter: blur(2px);

  border-radius: 100%;

  width: 410px;

  height: 410px;

  z-index: -1;

}

.about-us-left-content-wrap .years-of-experience-card {

  border-radius: 20px;

  border: 0.5px solid rgba(255, 255, 255, 0.05);

  background: var(--color-gray-2);

  box-shadow: 15px 26.023px 50px 0px rgba(253, 196, 72, 0.04);

  backdrop-filter: blur(35px);

  padding: 64px 80px;

  display: flex;

  justify-content: center;

  align-items: center;

  flex-direction: column;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .about-us-left-content-wrap .years-of-experience-card {

    padding: 40px 30px;

  }

}

@media only screen and (max-width: 767px) {

  .about-us-left-content-wrap .years-of-experience-card {

    padding: 40px 30px;

  }

}

.about-us-left-content-wrap .years-of-experience-card .counter-main {

  width: 150px;

  height: 150px;

  background: #060606;

  display: flex;

  justify-content: center;

  align-items: center;

  border-radius: 100px;

  margin-bottom: 0;

  min-width: 100px;

}

.about-us-left-content-wrap .years-of-experience-card .counter-main .card-title {

  color: var(--color-primary);

  font-family: var(--font-primary);

  font-size: 68px;

  font-weight: 700;

  line-height: 78px;

}

.about-us-left-content-wrap .years-of-experience-card .card-title {

  margin-bottom: 0.5rem;

  font-size: 80px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .about-us-left-content-wrap .years-of-experience-card .card-title {

    font-size: 60px;

  }

}

@media only screen and (max-width: 767px) {

  .about-us-left-content-wrap .years-of-experience-card .card-title {

    font-size: 60px;

  }

}

.about-us-left-content-wrap .years-of-experience-card .card-para {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 48px;

  font-weight: 700;

  line-height: 60px;

  text-transform: capitalize;

  text-align: center;

  margin-top: 20px;

}

@media only screen and (max-width: 767px) {

  .about-us-left-content-wrap .years-of-experience-card .card-para {

    font-size: 32px;

    line-height: 42px;

    margin-top: 10px;

  }

}

.about-us-left-content-wrap .design-card {

  display: flex;

  align-items: center;

  gap: 30px;

  border-radius: 20px;

  border: 0.5px solid rgba(255, 255, 255, 0.05);

  background: var(--color-gray-2);

  box-shadow: 15px 26.023px 50px 0px rgba(253, 196, 72, 0.04);

  backdrop-filter: blur(35px);

  padding: 30px;

  margin-top: 30px;

}

@media only screen and (max-width: 767px) {

  .about-us-left-content-wrap .design-card {

    gap: 15px;

    padding: 30px 15px;

  }

}

.about-us-left-content-wrap .design-card .design-card-img {

  width: 100px;

  height: 100px;

  border-radius: 100px;

  display: flex;

  align-items: center;

  justify-content: center;

  border: 2px solid var(--color-primary);

}

@media only screen and (max-width: 767px) {

  .about-us-left-content-wrap .design-card .design-card-img {

    width: 60px;

    height: 60px;

    min-width: 60px;

  }

}

.about-us-left-content-wrap .design-card .design-card-img i {

  color: var(--color-primary);

  font-size: 40px;

}

@media only screen and (max-width: 767px) {

  .about-us-left-content-wrap .design-card .design-card-img i {

    font-size: 26px;

  }

}

@media only screen and (max-width: 767px) {

  .about-us-left-content-wrap .design-card .design-card-img img {

    max-height: 30px;

  }

}

.about-us-left-content-wrap .design-card .card-info p {

  color: var(--color-heading);

}



.about-thumbnail-large-style-two {

  padding: 25px;

  background: var(--color-gray-2);

  border-radius: 15px;

}

@media only screen and (max-width: 575px) {

  .about-thumbnail-large-style-two {

    padding: 18px;

  }

}



/*===============================

  Tmp Custom Box Tag

  ===============================*/

.tpm-custom-box-bg {

  padding: 100px 15px;

  border-radius: 40px;

  background: var(--color-gray-2);

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tpm-custom-box-bg {

    padding: 100px 40px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tpm-custom-box-bg {

    padding: 60px 15px;

    margin: 60px 30px;

  }

}

@media only screen and (max-width: 767px) {

  .tpm-custom-box-bg {

    padding: 60px 15px;

    border-radius: 0;

  }

}



/*===============================

  My Expertise Area

  ===============================*/

.my-expertise-area .section-head {

  padding-bottom: 0;

}

.my-expertise-area .header-top-inner {

  padding-bottom: 60px;

}



/*===============================

  My Expertise Eontent Wrap

  ===============================*/

.my-expertise-content-wrap ul li {

  margin: 0;

  margin-bottom: 30px;

}

.my-expertise-content-wrap ul li:last-child {

  margin-bottom: 0;

}



/*===============================

  My Expertise Card wrap

  ===============================*/

.my-expertise-card-wrap {

  border-radius: 20px;

  border: 2px solid var(--color-border);

  display: flex;

  justify-content: center;

  align-items: center;

  flex-wrap: wrap;

  padding: 30px 30px;

}

@media (min-width: 576px) {

  .my-expertise-card-wrap {

    padding: 50px 60px;

    justify-content: space-between;

  }

}

@media (min-width: 576px) and (max-width: 720px) {

  .my-expertise-card-wrap {

    justify-content: center;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .my-expertise-card-wrap {

    gap: 25px;

  }

}

@media only screen and (max-width: 767px) {

  .my-expertise-card-wrap {

    padding: 30px 15px;

    gap: 25px;

    justify-content: flex-start;

  }

}

@media only screen and (max-width: 575px) {

  .my-expertise-card-wrap {

    flex-direction: column;

  }

}

.my-expertise-card-wrap .expertise-card-left {

  display: flex;

  align-items: center;

  gap: 26px;

  flex-wrap: wrap;

  justify-content: flex-start;

  flex-basis: 28%;

}

@media (min-width: 576px) {

  .my-expertise-card-wrap .expertise-card-left {

    justify-content: inherit;

    justify-content: flex-start;

    flex-basis: 28%;

  }

}

@media only screen and (max-width: 575px) {

  .my-expertise-card-wrap .expertise-card-left {

    justify-content: center;

  }

}

.my-expertise-card-wrap .expertise-card-left .expertise-card-logo {

  width: 80px;

  height: 80px;

  display: flex;

  justify-content: center;

  align-items: center;

  border-radius: 100px;

  background: var(--color-primary);

  border: 2px solid var(--color-border);

}

.my-expertise-card-wrap .expertise-card-left .expertise-card-logo img {

  max-height: 28px;

}

.my-expertise-card-wrap .expertise-card-left .title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 32px;

  font-weight: 700;

  line-height: 130%;

  text-transform: capitalize;

  margin-bottom: 0;

  text-align: center;

}

@media (min-width: 576px) {

  .my-expertise-card-wrap .expertise-card-left .title {

    text-align: inherit;

  }

}

.my-expertise-card-wrap .para {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  max-width: 452px;

  text-align: center;

  transition: all 0.4s ease;

}

@media (min-width: 576px) {

  .my-expertise-card-wrap .para {

    text-align: inherit;

  }

}



/* Service Card v1*/

.service-card-v1 {

  border-radius: 20px;

  padding: 40px 0 40px 0;

  transition: 0.4s;

  box-shadow: 4px 4px 0 0 rgba(20, 155, 252, 0.11);

  background: var(--color-gray-2);

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .service-card-v1 {

    padding: 30px 0 30px 0;

  }

}

@media only screen and (max-width: 767px) {

  .service-card-v1 {

    padding: 30px 0 30px 0;

  }

}

.service-card-v1.vc-primary-2nd {

  border: 1px solid var(--stroke-dark-100);

}

.service-card-v1.vc-primary-2nd .service-card-icon {

  color: var(--color-primary);

}

.service-card-v1 .service-card-icon {

  display: flex;

  align-items: center;

  justify-content: center;

  min-width: 55px;

  min-height: 55px;

  color: var(--color-primary);

  font-size: 50px;

  margin-bottom: 30px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .service-card-v1 .service-card-icon {

    margin-bottom: 16px;

  }

}

@media only screen and (max-width: 767px) {

  .service-card-v1 .service-card-icon {

    margin-bottom: 16px;

  }

}

.service-card-v1 .service-title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 24px;

  font-weight: 700;

  line-height: 34px;

  text-align: center;

  margin-bottom: 9px;

}

.service-card-v1 .service-para {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 26px;

  text-align: center;

}



/* Service Card v2*/

.service-card-v2 {

  border-radius: 20px;

  background: var(--color-gray-2);

  padding: 36px 40px 36px 40px;

  margin-bottom: 20px;

  display: block;

  position: relative;

  overflow: hidden;

}

@media only screen and (max-width: 767px) {

  .service-card-v2 {

    padding: 20px;

  }

}

@media only screen and (max-width: 575px) {

  .service-card-v2 {

    padding: 30px 15px;

  }

}

.service-card-v2 .service-card-num {

    color: var(--color-heading);

    font-family: var(--font-primary);

    font-size: 24px;

    font-weight: 700;

    line-height: 30px;

    margin-bottom: 0;

    height: 60px;

}

.service-card-v2 .service-card-num span {

  margin-right: 15px;

}

.service-card-v2 .service-para {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 26px;

  margin-top: 22px;

  margin-bottom: 0;

}

@media only screen and (max-width: 767px) {

  .service-card-v2 .service-para {

    margin-top: 7px;

  }

}



.service-card-user-image {

  display: flex;

  justify-content: center;

  padding: 25px;

  border-radius: 23px;

  border: none !important;

}

@media (min-width: 1200px) {

  .service-card-user-image {

    margin-left: 70px;

  }

}



.inner .ft-link li span {

  background: var(--color-primary) !important;

}

.inner .ft-link li span i {

  color: #fff;

}



.service-details-area-wrapper .service-thumnail-wrap {

  margin-bottom: 20px;

}

.service-details-area-wrapper .service-thumnail-wrap img {

  border-radius: 20px;

}

.service-details-area-wrapper .title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-weight: 700;

  font-size: 42px;

  line-height: 52px;

  margin-bottom: 20px;

}

@media (min-width: 576px) {

  .service-details-area-wrapper .title {

    font-size: 48px;

    line-height: 60px;

  }

}

@media only screen and (max-width: 767px) {

  .service-details-area-wrapper .title {

    font-size: 40px;

    line-height: 52px;

  }

}

.service-details-area-wrapper .doc-para {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-weight: 400;

  margin-bottom: 20px;

  font-size: 16px;

  line-height: 30px;

}

.service-details-area-wrapper .doc-para:last-child {

  margin-bottom: 0;

}

.service-details-area-wrapper .title-mini {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 24px;

  font-weight: 700;

  line-height: 30px;

  margin-bottom: 20px;

}



/*=========================

  Services Widget

  =========================*/

.services-widget {

  position: relative;

}

.services-widget.v1 .service-item .my-skill-card .card-para {

  color: white;

}

.services-widget.v1 .service-item.mleave .my-skill-card .card-para {

  color: var(--color-gray);

}

.services-widget.v1 .service-item.mleave .my-skill-card .card-icon {

  color: var(--color-primary);

}

.services-widget.v1 .active-bg {

  background: var(--color-primary);

}

.services-widget.v1 .mleave .my-skill-card .card-icon {

  border: 2px solid var(--color-border);

}

.services-widget.v1 .mleave .my-skill-card .card-icon i {

  color: var(--color-body);

}

.services-widget.v1 .my-skill-card .card-icon {

  border: 2px solid #fff;

}

.services-widget.v1 .my-skill-card .card-icon i {

  color: var(--color-heading);

}

.services-widget.v2 .service-item {

  margin-bottom: 20px;

}

.services-widget.v2 .service-item:last-child {

  margin-bottom: 0;

}

.services-widget.v2 .service-item .expertise-card-logo {

  background: transparent !important;

}

.services-widget.v2 .service-item .para {

  color: var(--color-heading);

}

.services-widget.v2 .service-item.mleave .expertise-card-logo {

  background: var(--color-primary) !important;

}

.services-widget.v2 .service-item.mleave .para {

  color: var(--color-gray);

}

.services-widget.v2 .active-bg {

  border-radius: 20px;

  background: rgba(19, 155, 253, 0.11);

  backdrop-filter: blur(35px);

}

.services-widget.v3 .service-item .my-skill-card .card-para {

  color: white;

}

.services-widget.v3 .service-item.mleave .my-skill-card .card-para {

  color: var(--color-gray);

}

.services-widget.v3 .service-item.mleave .my-skill-card .card-icon {

  color: var(--color-primary);

}

.services-widget.v3 .active-bg {

  background: var(--color-primary);

}

.services-widget.v4 .service-item {

  margin-bottom: 20px;

}

.services-widget.v4 .service-item:last-child {

  margin-bottom: 0;

}

.services-widget.v4 .service-item .expertise-card-logo {

  background: var(--color-secondary) !important;

}

.services-widget.v4 .service-item .para {

  color: var(--color-heading);

}

.services-widget.v4 .service-item.mleave .expertise-card-logo {

  background: var(--color-primary) !important;

}

.services-widget.v4 .service-item.mleave .para {

  color: var(--color-gray);

}

.services-widget.v4 .active-bg {

  border-radius: 20px;

  background: rgba(253, 196, 72, 0.0901960784);

  backdrop-filter: blur(10px);

}

.services-widget.v5 .service-item .my-skill-card .card-para {

  color: white;

}

.services-widget.v5 .service-item.mleave .my-skill-card .card-para {

  color: var(--color-gray);

}

.services-widget.v5 .service-item.mleave .my-skill-card .card-icon {

  color: var(--color-primary);

}

.services-widget.v5 .active-bg {

  background: var(--color-primary);

}

.services-widget.v6 .service-item {

  margin-bottom: 20px;

}

.services-widget.v6 .service-item:last-child {

  margin-bottom: 0;

}

.services-widget.v6 .service-item .expertise-card-logo {

  background: var(--color-secondary) !important;

}

.services-widget.v6 .service-item .para {

  color: var(--color-heading);

}

.services-widget.v6 .service-item.mleave .expertise-card-logo {

  background: var(--color-primary) !important;

}

.services-widget.v6 .service-item.mleave .para {

  color: var(--color-gray);

}

.services-widget.v6 .active-bg {

  border-radius: 20px;

  background: var(--color-primary);

}

.services-widget .service-item {

  position: relative;

  z-index: 2;

  gap: 20px;

  overflow: hidden;

}

.services-widget .service-item .service-link {

  border: none;

  padding: 0;

  margin: 0;

  background: transparent;

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  z-index: -1;

}

.services-widget .service-item .expertise-card-logo {

  transition: all 0.4s ease;

}

.services-widget .number {

  color: var(--color-primary);

  font-size: 20px;

  /* 	font-weight: var(--tj-fw-bold); */

  -webkit-transition: all 0.5s ease;

  -o-transition: all 0.5s ease;

  transition: all 0.5s ease;

}

.services-widget .active-bg {

  top: 0px;

  bottom: 0px;

  left: 0px;

  right: 0px;

  position: absolute;

  z-index: 0;

  -webkit-transition: all 0.5s ease;

  -o-transition: all 0.5s ease;

  transition: all 0.5s ease;

}



.service.service__style--1 {

  padding: 30px 20px;

  padding-bottom: 30px;

  transition: transform 0.65s cubic-bezier(0.05, 0.2, 0.1, 1), box-shadow 0.65s cubic-bezier(0.05, 0.2, 0.1, 1);

  position: relative;

  z-index: 2;

  height: 100%;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .service.service__style--1 {

    padding: 30px 28px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .service.service__style--1 {

    padding: 30px 25px;

  }

}

@media only screen and (max-width: 767px) {

  .service.service__style--1 {

    padding: 30px 14px;

  }

}

.service.service__style--1 .shape-service-1 {

  position: absolute;

  right: 15px;

  top: 15px;

  z-index: 1;

  max-width: 150px;

  margin: auto;

  opacity: 0;

}

.service.service__style--1 .icon {

  transition: 0.3s;

  font-size: 45px;

  font-weight: 400;

  margin-bottom: 23px;

  color: var(--color-primary);

  text-align: center;

  border-radius: 100%;

  display: flex;

  justify-content: center;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .service.service__style--1 .icon {

    margin-bottom: 11px;

  }

}

.service.service__style--1 .icon i {

  stroke-width: 1 !important;

  font-size: 60px;

}

.service.service__style--1 .icon svg {

  stroke-width: 2px !important;

  width: 45px;

  height: 45px;

}

.service.service__style--1 .icon img {

  max-height: 60px;

}

.service.service__style--1 .content .title {

  margin-bottom: 19px;

  transition: 0.3s;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .service.service__style--1 .content .title {

    margin-bottom: 8px;

  }

}

.service.service__style--1 .content .title a {

  color: inherit;

  transition: 0.3s;

}

.service.service__style--1 .content .title a:hover {

  color: var(--color-primary);

}

.service.service__style--1 .content p {

  transition: 0.3s;

}

.service.service__style--1 .content .discover-btn {

  text-align: center;

  display: flex;

  justify-content: center;

}

.service.service__style--1:hover {

  transform: translateY(-5px);

}

.service.service__style--1:hover .shape-service-1 {

  opacity: 0.3;

}

.service.service__style--1:hover .shape-service-1 img {

  animation: moveOut 0.4s linear;

}

.service.service__style--1.tmp-border-none {

  border: none;

}

.service.service__style--1.tmp-border {

  border: 2px solid var(--color-border);

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .service.service__style--1.text-left, .service.service__style--1.text-start {

    padding: 40px 30px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .service.service__style--1.text-left, .service.service__style--1.text-start {

    padding: 40px 30px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .service.service__style--1.text-left, .service.service__style--1.text-start {

    padding: 40px 30px;

  }

}

@media only screen and (max-width: 767px) {

  .service.service__style--1.text-left, .service.service__style--1.text-start {

    padding: 30px 20px;

  }

}

.service.service__style--1.text-left .icon, .service.service__style--1.text-start .icon {

  justify-content: left;

}

.service.service__style--1.text-left .content .discover-btn, .service.service__style--1.text-start .content .discover-btn {

  justify-content: flex-start;

}

.service.service__style--1.icon-circle-style {

  background-color: transparent;

  box-shadow: none;

  padding: 0px 35px;

  margin-top: 25px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .service.service__style--1.icon-circle-style {

    padding: 0px 10px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .service.service__style--1.icon-circle-style {

    padding: 0px 10px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .service.service__style--1.icon-circle-style {

    padding: 0px 10px;

  }

}

@media only screen and (max-width: 767px) {

  .service.service__style--1.icon-circle-style {

    padding: 0px 10px;

  }

}

.service.service__style--1.icon-circle-style .icon {

  font-size: 39px;

  color: var(--color-primary);

  display: flex;

  justify-content: center;

  width: 90px;

  height: 90px;

  margin: 0 auto;

  margin-bottom: 23px;

  background-color: var(--color-primary-darker);

  line-height: 90px;

  align-items: center;

}

.service.service__style--1.with-working-process {

  position: relative;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .service.service__style--1.with-working-process {

    padding: 20px 0;

  }

}

.service.service__style--1.with-working-process .icon {

  width: 180px;

  height: 180px;

  line-height: 180px;

  font-size: 60px;

  position: relative;

}

.service.service__style--1.with-working-process .line {

  position: absolute;

  top: 50%;

  transform: translateY(-50%);

  height: 1px;

  width: 100%;

  left: 100%;

  background-color: var(--color-border);

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .service.service__style--1.with-working-process .line {

    display: none;

  }

}

@media only screen and (max-width: 767px) {

  .service.service__style--1.with-working-process .line {

    display: none;

  }

}

.service.service__style--1.with-working-process:hover {

  transform: none;

}

.service.service__style--1.variation-2 {

  padding-bottom: 0;

  overflow: hidden;

  display: flex;

  flex-direction: column;

  justify-content: space-between;

}

.service.service__style--1.variation-3 {

  padding-bottom: 50px;

}

.service.service__style--1.service-bg-transparent {

  padding: 0;

}

.service.service__style--1.service-bg-transparent .icon {

  margin-bottom: 12px;

}

.service.service__style--1.service-bg-transparent .content .title {

  margin-bottom: 12px;

}



.skill-style-border-card {

  border-radius: 5px;

  padding: 30px 0 18px 0;

  margin-bottom: 0;

  transition: 0.3s;

  height: 100%;

  text-align: center;

}

.skill-style-border-card img {

  display: block;

  margin: auto auto 8px auto;

  max-width: 40px;

  max-height: 40px;

}

.skill-style-border-card .count-number {

  margin-bottom: 5px;

  font-size: 34px;

}



.our-supported-company-area {

  border-radius: 30px;

}

.our-supported-company-area .row {

  --bs-gutter-x: 0;

  --bs-gutter-y: 0;

  border-left: 2px solid var(--color-border);

  border-top: 2px solid var(--color-border);

}



.support-company-logo {

  border-right: 2px solid var(--color-border);

  padding: 40px 0;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  width: 100%;

  height: 100%;

  cursor: pointer;

  border-bottom: 2px solid var(--color-border);

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .support-company-logo {

    padding: 50px 0;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .support-company-logo {

    padding: 50px 0;

  }

}

@media only screen and (max-width: 767px) {

  .support-company-logo {

    padding: 24px 0;

  }

}

@media only screen and (max-width: 575px) {

  .support-company-logo {

    padding: 24px 0;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .support-company-logo img {

    max-height: 44px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .support-company-logo img {

    max-height: 44px;

  }

}

@media only screen and (max-width: 767px) {

  .support-company-logo img {

    max-height: 44px;

  }

}



.rts-progress-area .thumbnail {

  display: block;

  overflow: hidden;

  max-width: max-content;

}



.rts-progress-area .thumbnail img {

  transition: 0.3s;

}



.rts-progress-area .thumbnail:hover img {

  transform: scale(0.95);

}



.single-progress-area-h4 {

  margin-top: 30px;

}



.single-progress-area-h4:first-child {

  margin-top: 0;

}



.single-progress-area-h4 .page-wrapper {

  width: calc(100% - 100px);

  margin: 100px auto 200px;

}



.single-progress-area-h4 .progress {

  height: 5px;

  position: relative;

  margin-top: 14px;

  border-radius: 0;

}



.single-progress-area-h4 .progress .bg--primary {

  background: red;

  border-radius: 0;

}



.single-progress-area-h4 .progress .progress-bar {

  position: absolute;

  top: 0;

  left: 0;

  height: 100%;

}



.single-progress-area-h4 .progress .progress-top {

  display: flex;

  justify-content: space-between;

  align-items: center;

}



.single-progress-area-h4 .progress .progress-top p {

  font-weight: 500;

  font-size: 18px;

  line-height: 26px;

  color: #ffffff;

  letter-spacing: 0.03em;

  text-transform: capitalize;

  margin-bottom: 0;

}



.single-progress-area-h4 .progress .progress-top span.parcent {

  font-weight: 700;

  font-size: 16px;

  line-height: 19px;

  color: #ffffff;

}



/* circle progress */

svg.radial-progress {

  height: auto;

  max-width: 100px;

  border-radius: 50%;

  border: 1px solid rgba(219, 219, 219, 0.14);

  transform: rotate(-90deg);

  width: 100%;

  background-image: none;

  transition: 0.3s;

}



svg.radial-progress circle {

  fill: transparent;

  stroke: #fff;

}



svg.radial-progress circle.bar-static {

  stroke: rgb(186, 186, 186) !important;

  stroke-width: 2px;

  transition: 0.3s;

}



svg.radial-progress circle.bar--animated {

  stroke-dasharray: 219.9114857513;

  stroke: var(--color-heading);

  stroke-dashoffset: 219.9114857513;

  stroke-width: 3px;

  transition: 0.3s;

  stroke-linecap: round;

}



svg.radial-progress text {

  fill: #fafafa;

  font-size: 16px;

  font-weight: 700;

  text-anchor: middle;

  font-family: var(--font-primary);

  transition: 0.3s;

}



svg.radial-progress:hover circle.bar-static {

  stroke-width: 1px;

}



svg.radial-progress:hover circle.bar--animated {

  stroke-width: 4px;

}



section.svg-container svg.radial-progress:nth-child(even) {

  margin: 0 15px;

}



section.svg-container svg.radial-progress:nth-last-of-type(1) {

  background: linear-gradient(260deg, #ff0300, #ffc900);

}



section.svg-container svg.radial-progress:nth-last-of-type(0) {

  background-image: linear-gradient(60deg, #3d3393 0%, #2b76b9 37%, #2cacd1 65%, #35eb93 100%);

}



.devider {

  font-size: 50px;

  padding: 20px;

  min-height: 11vh;

  color: #fff;

  width: 100%;

  display: flex;

  align-items: center;

  justify-content: center;

  background: linear-gradient(-225deg, #FF057C 0%, #FF057C 40%, #321575 100%);

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

  font-weight: 600;

}



.devider:nth-last-of-type(2) {

  background-image: linear-gradient(260deg, #ff0300, #ffc900);

}



.single-progress-circle {

  display: flex;

  justify-content: center;

  position: relative;

}



.single-progress-circle .small-text {

  position: absolute;

  top: 55%;

  font-weight: 400;

  font-size: 18px;

  line-height: 24px;

  color: #1F1F21;

  font-family: var(--font-primary);

}



.resume-widget .resume-single {

  position: relative;

  padding: 20px 30px;

  margin-bottom: 30px;

  border-radius: 20px;

  background: var(--color-gray-2);

  z-index: 10;

  overflow: hidden;

}

.resume-widget .resume-single::after {

  transition: all 0.8s ease;

  content: " ";

  position: absolute;

  bottom: -313px;

  right: -407px;

  width: 474px;

  height: 474px;

  border-radius: 100%;

  filter: blur(227px);

  opacity: 0;

  pointer-events: none;

}

.resume-widget .resume-single:hover::after {

  background: var(--color-primary);

  opacity: 1;

}



.resume-section .section-title i {

  color: var(--color-primary);

  margin-right: 6px;

  opacity: 0.2;

}



.resume-widget .resume-single:hover:before {

  opacity: 1;

}



.resume-widget .resume-single .time {

  color: var(--color-primary);

  font-size: 20px;

  font-weight: 800;

  margin-bottom: 8px;

  gap: 12px;

  display: flex;

  align-items: center;

}



.resume-widget .resume-single .time i {

  opacity: 1;

  font-size: 14px;

  position: relative;

  top: 3px;

}

.resume-widget .resume-single .time i::after {

  display: none;

}

.resume-widget .resume-single .time i::before {

  top: -10px;

}



.resume-widget .resume-single .institute {

  color: var(--color-gray);

}



.resume-widget .resume-single:hover .time {

  color: var(--color-primary);

}



.resume-widget .resume-single .resume-title {

  font-size: 25px;

  text-transform: uppercase;

  margin-bottom: 8px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .resume-widget .resume-single .resume-title {

    font-size: 20px;

  }

}

@media only screen and (max-width: 767px) {

  .resume-widget .resume-single .resume-title {

    font-size: 20px;

  }

}



.resume-section .section-title i {

  font-family: "fontawesome";

}



.ready-chatting-option {

  max-width: max-content;

}

.ready-chatting-option.chat-visible label {

  bottom: 90px !important;

}

@media only screen and (max-width: 575px) {

  .ready-chatting-option.chat-visible label {

    bottom: 70px !important;

  }

}

.ready-chatting-option #click {

  display: none;

}

.ready-chatting-option label {

  bottom: 20px;

  height: 55px;

  width: 55px;

  background: var(--color-primary);

  text-align: center;

  line-height: 55px;

  border-radius: 50px;

  font-size: 30px;

  color: #fff;

  cursor: pointer;

  position: fixed !important;

  left: 20px;

  z-index: 1019;

  display: flex;

  justify-content: center;

  align-items: center;

  transition: 0.3s;

  z-index: 1000;

}

@media only screen and (max-width: 575px) {

  .ready-chatting-option label {

    height: 40px;

    width: 40px;

  }

}

.ready-chatting-option label::before {

  display: none;

}

.ready-chatting-option label::after {

  display: none;

}

.ready-chatting-option label i {

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  transition: all 0.4s ease;

  font-size: 22px;

  color: #fff;

}

.ready-chatting-option label i.fas {

  opacity: 0;

  pointer-events: none;

}

.ready-chatting-option #click:checked ~ label i.fas {

  opacity: 1;

  pointer-events: auto;

  transform: translate(-50%, -50%) rotate(180deg);

}

.ready-chatting-option #click:checked ~ label i.fab {

  opacity: 0;

  pointer-events: none;

  transform: translate(-50%, -50%) rotate(180deg);

}

.ready-chatting-option .wrapper {

  position: fixed;

  left: 90px;

  bottom: 30px;

  max-width: 400px;

  background: var(--color-gray-2);

  border-radius: 5px;

  box-shadow: 0px 15px 20px rgba(0, 0, 0, 0.1);

  opacity: 0;

  z-index: 1100;

  pointer-events: none;

  transition: all 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);

}

@media only screen and (max-width: 575px) {

  .ready-chatting-option .wrapper {

    max-width: 280px;

    left: 65px;

  }

}

@media only screen and (max-width: 479px) {

  .ready-chatting-option .wrapper {

    left: 15px;

    bottom: 90px;

  }

}

.ready-chatting-option #click:checked ~ .wrapper {

  opacity: 1;

  bottom: 85px;

  pointer-events: auto;

  box-shadow: 0px 0px 8px 0px rgba(255, 255, 255, 0.07);

}

@media only screen and (max-width: 479px) {

  .ready-chatting-option #click:checked ~ .wrapper {

    bottom: 112px;

  }

}

.ready-chatting-option .wrapper .head-text {

  line-height: 1.5;

  color: #fff;

  border-radius: 5px 5px 0 0;

  padding: 15px 20px;

  font-weight: 500;

  font-size: 20px;

  background: var(--color-primary);

}

.ready-chatting-option .wrapper .chat-box {

  padding: 20px;

  width: 100%;

}

@media only screen and (max-width: 575px) {

  .ready-chatting-option .wrapper .chat-box {

    padding: 10px;

  }

}

.ready-chatting-option .chat-box .desc-text {

  color: var(--color-body);

  text-align: center;

  line-height: 25px;

  font-size: 17px;

  font-weight: 500;

}

.ready-chatting-option .chat-box form {

  padding: 10px 15px;

  margin: 20px 0;

  border-radius: 5px;

  border: 2px solid var(--color-border);

}

.ready-chatting-option .chat-box form .field {

  height: 50px;

  width: 100%;

  margin-top: 20px;

}

.ready-chatting-option .chat-box form .field:last-child {

  margin-bottom: 15px;

}

.ready-chatting-option form .field input,

.ready-chatting-option form .field button,

.ready-chatting-option form .textarea textarea {

  width: 100%;

  height: 100%;

  padding-left: 20px;

  border: 2px solid var(--color-border);

  outline: none;

  border-radius: 5px;

  font-size: 16px;

  transition: all 0.3s ease;

  color: var(--color-body);

  font-family: var(--font-secondary);

}

.ready-chatting-option form .field input:focus,

.ready-chatting-option form .textarea textarea:focus {

  border-color: var(--color-primary);

}

.ready-chatting-option form .field input::placeholder,

.ready-chatting-option form .textarea textarea::placeholder {

  color: var(--color-body);

  transition: all 0.3s ease;

}

.ready-chatting-option form .field input:focus::placeholder,

.ready-chatting-option form .textarea textarea:focus::placeholder {

  color: var(--color-body);

}

.ready-chatting-option .chat-box form .textarea {

  height: 70px;

  width: 100%;

}

.ready-chatting-option .chat-box form .textarea textarea {

  height: 100%;

  border-radius: 5px;

  resize: none;

  padding: 15px 20px;

  font-size: 16px;

}

.ready-chatting-option .chat-box form .field button {

  border: none;

  outline: none;

  cursor: pointer;

  color: #fff;

  font-size: 18px;

  font-weight: 500;

  background: var(--color-primary);

  transition: all 0.3s ease;

}

.ready-chatting-option .chat-box form .field button:active {

  transform: scale(0.97);

}



/* Progress Area  */

.progress-charts {

  overflow: hidden;

}

.progress-charts + .progress-charts {

  margin-top: 30px;

}

.progress-charts h6.heading {

  margin-bottom: 15px;

  color: var(--color-heading);

  font-size: 14px;

  font-weight: 400;

  font-family: var(--font-secondary);

  letter-spacing: 1px;

}

.progress-charts h6.heading span.percent-label {

  color: var(--color-heading);

  font-size: 12px;

  text-transform: uppercase;

  opacity: 0.9;

  font-weight: 400;

  font-family: var(--font-secondary);

}

.progress-charts .progress {

  height: 13px;

  overflow: visible;

  font-size: 14px;

  border-radius: 10px;

  padding: 3px;

  background: #0e4363;

}

.progress-charts .progress .progress-bar {

  overflow: visible;

  position: relative;

  border-radius: 14px;

  background: linear-gradient(317deg, #139bfd 0%, #139bfd 38.23%, #13fdfd 62.96%, #13fdfd 100%) border-box;

}

.progress-charts .progress .progress-bar span.percent-label {

  position: absolute;

  right: 0;

  top: -37px;

  font-weight: 400;

  color: var(--color-heading);

  font-size: 14px;

  text-transform: uppercase;

  opacity: 0.9;

  font-family: var(--font-secondary);

}



/*-----------------------

    Progress Bar 

-----------------------*/

.single-progress + .single-progress {

  margin-top: 40px;

}



.single-progress {

  position: relative;

  overflow: hidden;

}

.single-progress .title {

  font-size: 16px;

  font-weight: 500;

  color: var(--color-body);

  letter-spacing: 0.5px;

  margin-bottom: 18px;

}



.progress {

  height: 30px;

  overflow: hidden;

  background-color: #0e4363;

  border-radius: 500px;

}

.progress .progress-bar {

  border-radius: 500px;

  width: 0;

  height: 100%;

  background: linear-gradient(317deg, #139bfd 0%, #139bfd 38.23%, #13fdfd 62.96%, #13fdfd 100%) border-box;

  transition: width 0.5s ease;

  overflow: visible;

}

.progress .progress-bar.bar-color-2 {

  background: rgb(251, 83, 67);

}

.progress .progress-bar.bar-color-3 {

  background: #E33FA1;

}

.progress .progress-bar.bar-color-4 {

  background: #6549D5;

}

.progress .progress-bar.bar-gradiand {

  background: radial-gradient(circle farthest-corner at 0% 0%, var(--color-pink) 25%, var(--color-secondary) 45%, var(--color-primary) 65%, var(--color-light-green) 85%);

}

.progress .progress-number {

  position: absolute;

  font-size: 14px;

  top: 0;

  line-height: 24px;

  right: 0;

  z-index: 1;

}



.progress-info {

  display: flex;

  justify-content: space-between;

  margin-bottom: 18px;

}

.progress-info .title {

  font-size: 18px;

  font-weight: 400;

  margin-bottom: 0;

  color: var(--color-body);

  letter-spacing: 0.5px;

}

.progress-info span.progress-number {

  font-size: 14px;

  color: var(--color-body);

}



.no-radius .progress {

  border-radius: 0;

}

.no-radius .progress .progress-bar {

  border-radius: 0;

}



.large-size .progress {

  height: 20px;

}



/*-----------------------------------

    Radial Progress 

-----------------------------------*/

.radial-progress-single {

  text-align: center;

}

.radial-progress-single .circle-info {

  padding-top: 20px;

  text-align: center;

}

.radial-progress-single .circle-info .title {

  font-size: 20px;

  font-weight: 400;

  margin-bottom: 4px;

}

.radial-progress-single .circle-info .subtitle {

  margin-bottom: 0;

  font-size: 14px;

  letter-spacing: 0.5px;

  color: var(--color-body);

}



.radial-progress {

  position: relative;

}

@media only screen and (max-width: 767px) {

  .radial-progress {

    display: inline-block;

  }

}

.radial-progress .circle-text {

  position: absolute;

  top: 50%;

  width: 100%;

  text-align: center;

  transform: translateY(-50%);

}

.radial-progress .circle-text span.count {

  font-size: 28px;

  line-height: 1;

  font-weight: 600;

  color: var(--color-body);

  position: relative;

}

.radial-progress .circle-text span.count::after {

  position: absolute;

  content: "%";

  left: 100%;

  color: var(--color-body);

}



/* -------------------------------- 



Primary style



-------------------------------- */

.cd-title {

  position: relative;

  text-align: center;

}



.cd-intro {

  width: 90%;

  max-width: 768px;

  text-align: center;

}



.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-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;

}



/* -------------------------------- 



  xrotate-1 



  -------------------------------- */

.cd-headline.rotate-1 .cd-words-wrapper {

  -webkit-perspective: 300px;

  -moz-perspective: 300px;

  perspective: 300px;

}



.cd-headline.rotate-1 b {

  opacity: 0;

  -webkit-transform-origin: 50% 100%;

  -moz-transform-origin: 50% 100%;

  -ms-transform-origin: 50% 100%;

  -o-transform-origin: 50% 100%;

  transform-origin: 50% 100%;

  -webkit-transform: rotateX(180deg);

  -moz-transform: rotateX(180deg);

  -ms-transform: rotateX(180deg);

  -o-transform: rotateX(180deg);

  transform: rotateX(180deg);

}



.cd-headline.rotate-1 b.is-visible {

  opacity: 1;

  -webkit-transform: rotateX(0deg);

  -moz-transform: rotateX(0deg);

  -ms-transform: rotateX(0deg);

  -o-transform: rotateX(0deg);

  transform: rotateX(0deg);

  -webkit-animation: cd-rotate-1-in 1.2s;

  -moz-animation: cd-rotate-1-in 1.2s;

  animation: cd-rotate-1-in 1.2s;

}



.cd-headline.rotate-1 b.is-hidden {

  -webkit-transform: rotateX(180deg);

  -moz-transform: rotateX(180deg);

  -ms-transform: rotateX(180deg);

  -o-transform: rotateX(180deg);

  transform: rotateX(180deg);

  -webkit-animation: cd-rotate-1-out 1.2s;

  -moz-animation: cd-rotate-1-out 1.2s;

  animation: cd-rotate-1-out 1.2s;

}



@-webkit-keyframes cd-rotate-1-in {

  0% {

    -webkit-transform: rotateX(180deg);

    opacity: 0;

  }

  35% {

    -webkit-transform: rotateX(120deg);

    opacity: 0;

  }

  65% {

    opacity: 0;

  }

  100% {

    -webkit-transform: rotateX(360deg);

    opacity: 1;

  }

}

@-moz-keyframes cd-rotate-1-in {

  0% {

    -moz-transform: rotateX(180deg);

    opacity: 0;

  }

  35% {

    -moz-transform: rotateX(120deg);

    opacity: 0;

  }

  65% {

    opacity: 0;

  }

  100% {

    -moz-transform: rotateX(360deg);

    opacity: 1;

  }

}

@keyframes cd-rotate-1-in {

  0% {

    -webkit-transform: rotateX(180deg);

    -moz-transform: rotateX(180deg);

    -ms-transform: rotateX(180deg);

    -o-transform: rotateX(180deg);

    transform: rotateX(180deg);

    opacity: 0;

  }

  35% {

    -webkit-transform: rotateX(120deg);

    -moz-transform: rotateX(120deg);

    -ms-transform: rotateX(120deg);

    -o-transform: rotateX(120deg);

    transform: rotateX(120deg);

    opacity: 0;

  }

  65% {

    opacity: 0;

  }

  100% {

    -webkit-transform: rotateX(360deg);

    -moz-transform: rotateX(360deg);

    -ms-transform: rotateX(360deg);

    -o-transform: rotateX(360deg);

    transform: rotateX(360deg);

    opacity: 1;

  }

}

@-webkit-keyframes cd-rotate-1-out {

  0% {

    -webkit-transform: rotateX(0deg);

    opacity: 1;

  }

  35% {

    -webkit-transform: rotateX(-40deg);

    opacity: 1;

  }

  65% {

    opacity: 0;

  }

  100% {

    -webkit-transform: rotateX(180deg);

    opacity: 0;

  }

}

@-moz-keyframes cd-rotate-1-out {

  0% {

    -moz-transform: rotateX(0deg);

    opacity: 1;

  }

  35% {

    -moz-transform: rotateX(-40deg);

    opacity: 1;

  }

  65% {

    opacity: 0;

  }

  100% {

    -moz-transform: rotateX(180deg);

    opacity: 0;

  }

}

@keyframes cd-rotate-1-out {

  0% {

    -webkit-transform: rotateX(0deg);

    -moz-transform: rotateX(0deg);

    -ms-transform: rotateX(0deg);

    -o-transform: rotateX(0deg);

    transform: rotateX(0deg);

    opacity: 1;

  }

  35% {

    -webkit-transform: rotateX(-40deg);

    -moz-transform: rotateX(-40deg);

    -ms-transform: rotateX(-40deg);

    -o-transform: rotateX(-40deg);

    transform: rotateX(-40deg);

    opacity: 1;

  }

  65% {

    opacity: 0;

  }

  100% {

    -webkit-transform: rotateX(180deg);

    -moz-transform: rotateX(180deg);

    -ms-transform: rotateX(180deg);

    -o-transform: rotateX(180deg);

    transform: rotateX(180deg);

    opacity: 0;

  }

}

/* -------------------------------- 



  xtype 



  -------------------------------- */

.cd-headline.type .cd-words-wrapper {

  vertical-align: top;

  overflow: hidden;

}



.cd-headline.type .cd-words-wrapper::after {

  /* vertical bar */

  content: "";

  position: absolute;

  right: 0;

  top: 50%;

  bottom: auto;

  -webkit-transform: translateY(-50%);

  -moz-transform: translateY(-50%);

  -ms-transform: translateY(-50%);

  -o-transform: translateY(-50%);

  transform: translateY(-50%);

  height: 90%;

  width: 1px;

  background-color: #aebcb9;

}



.cd-headline.type .cd-words-wrapper.waiting::after {

  -webkit-animation: cd-pulse 1s infinite;

  -moz-animation: cd-pulse 1s infinite;

  animation: cd-pulse 1s infinite;

}



.cd-headline.type .cd-words-wrapper.selected {

  background-color: #aebcb9;

}



.cd-headline.type .cd-words-wrapper.selected::after {

  visibility: hidden;

}



.cd-headline.type .cd-words-wrapper.selected b {

  color: #0d0d0d;

}



.cd-headline.type b {

  visibility: hidden;

}



.cd-headline.type b.is-visible {

  visibility: visible;

}



.cd-headline.type i {

  position: absolute;

  visibility: hidden;

}



.cd-headline.type i.in {

  position: relative;

  visibility: visible;

}



@-webkit-keyframes cd-pulse {

  0% {

    -webkit-transform: translateY(-50%) scale(1);

    opacity: 1;

  }

  40% {

    -webkit-transform: translateY(-50%) scale(0.9);

    opacity: 0;

  }

  100% {

    -webkit-transform: translateY(-50%) scale(0);

    opacity: 0;

  }

}

@-moz-keyframes cd-pulse {

  0% {

    -moz-transform: translateY(-50%) scale(1);

    opacity: 1;

  }

  40% {

    -moz-transform: translateY(-50%) scale(0.9);

    opacity: 0;

  }

  100% {

    -moz-transform: translateY(-50%) scale(0);

    opacity: 0;

  }

}

@keyframes cd-pulse {

  0% {

    -webkit-transform: translateY(-50%) scale(1);

    -moz-transform: translateY(-50%) scale(1);

    -ms-transform: translateY(-50%) scale(1);

    -o-transform: translateY(-50%) scale(1);

    transform: translateY(-50%) scale(1);

    opacity: 1;

  }

  40% {

    -webkit-transform: translateY(-50%) scale(0.9);

    -moz-transform: translateY(-50%) scale(0.9);

    -ms-transform: translateY(-50%) scale(0.9);

    -o-transform: translateY(-50%) scale(0.9);

    transform: translateY(-50%) scale(0.9);

    opacity: 0;

  }

  100% {

    -webkit-transform: translateY(-50%) scale(0);

    -moz-transform: translateY(-50%) scale(0);

    -ms-transform: translateY(-50%) scale(0);

    -o-transform: translateY(-50%) scale(0);

    transform: translateY(-50%) scale(0);

    opacity: 0;

  }

}

/* -------------------------------- 



  xrotate-2 



  -------------------------------- */

.cd-headline.rotate-2 .cd-words-wrapper {

  -webkit-perspective: 300px;

  -moz-perspective: 300px;

  perspective: 300px;

}



.cd-headline.rotate-2 i,

.cd-headline.rotate-2 em {

  display: inline-block;

  -webkit-backface-visibility: hidden;

  backface-visibility: hidden;

}



.cd-headline.rotate-2 b {

  opacity: 0;

}



.cd-headline.rotate-2 i {

  -webkit-transform-style: preserve-3d;

  -moz-transform-style: preserve-3d;

  -ms-transform-style: preserve-3d;

  -o-transform-style: preserve-3d;

  transform-style: preserve-3d;

  -webkit-transform: translateZ(-20px) rotateX(90deg);

  -moz-transform: translateZ(-20px) rotateX(90deg);

  -ms-transform: translateZ(-20px) rotateX(90deg);

  -o-transform: translateZ(-20px) rotateX(90deg);

  transform: translateZ(-20px) rotateX(90deg);

  opacity: 0;

}



.is-visible .cd-headline.rotate-2 i {

  opacity: 1;

}



.cd-headline.rotate-2 i.in {

  -webkit-animation: cd-rotate-2-in 0.4s forwards;

  -moz-animation: cd-rotate-2-in 0.4s forwards;

  animation: cd-rotate-2-in 0.4s forwards;

}



.cd-headline.rotate-2 i.out {

  -webkit-animation: cd-rotate-2-out 0.4s forwards;

  -moz-animation: cd-rotate-2-out 0.4s forwards;

  animation: cd-rotate-2-out 0.4s forwards;

}



.cd-headline.rotate-2 em {

  -webkit-transform: translateZ(20px);

  -moz-transform: translateZ(20px);

  -ms-transform: translateZ(20px);

  -o-transform: translateZ(20px);

  transform: translateZ(20px);

}



.no-csstransitions .cd-headline.rotate-2 i {

  -webkit-transform: rotateX(0deg);

  -moz-transform: rotateX(0deg);

  -ms-transform: rotateX(0deg);

  -o-transform: rotateX(0deg);

  transform: rotateX(0deg);

  opacity: 0;

}



.no-csstransitions .cd-headline.rotate-2 i em {

  -webkit-transform: scale(1);

  -moz-transform: scale(1);

  -ms-transform: scale(1);

  -o-transform: scale(1);

  transform: scale(1);

}



.no-csstransitions .cd-headline.rotate-2 .is-visible i {

  opacity: 1;

}



@-webkit-keyframes cd-rotate-2-in {

  0% {

    opacity: 0;

    -webkit-transform: translateZ(-20px) rotateX(90deg);

  }

  60% {

    opacity: 1;

    -webkit-transform: translateZ(-20px) rotateX(-10deg);

  }

  100% {

    opacity: 1;

    -webkit-transform: translateZ(-20px) rotateX(0deg);

  }

}

@-moz-keyframes cd-rotate-2-in {

  0% {

    opacity: 0;

    -moz-transform: translateZ(-20px) rotateX(90deg);

  }

  60% {

    opacity: 1;

    -moz-transform: translateZ(-20px) rotateX(-10deg);

  }

  100% {

    opacity: 1;

    -moz-transform: translateZ(-20px) rotateX(0deg);

  }

}

@keyframes cd-rotate-2-in {

  0% {

    opacity: 0;

    -webkit-transform: translateZ(-20px) rotateX(90deg);

    -moz-transform: translateZ(-20px) rotateX(90deg);

    -ms-transform: translateZ(-20px) rotateX(90deg);

    -o-transform: translateZ(-20px) rotateX(90deg);

    transform: translateZ(-20px) rotateX(90deg);

  }

  60% {

    opacity: 1;

    -webkit-transform: translateZ(-20px) rotateX(-10deg);

    -moz-transform: translateZ(-20px) rotateX(-10deg);

    -ms-transform: translateZ(-20px) rotateX(-10deg);

    -o-transform: translateZ(-20px) rotateX(-10deg);

    transform: translateZ(-20px) rotateX(-10deg);

  }

  100% {

    opacity: 1;

    -webkit-transform: translateZ(-20px) rotateX(0deg);

    -moz-transform: translateZ(-20px) rotateX(0deg);

    -ms-transform: translateZ(-20px) rotateX(0deg);

    -o-transform: translateZ(-20px) rotateX(0deg);

    transform: translateZ(-20px) rotateX(0deg);

  }

}

@-webkit-keyframes cd-rotate-2-out {

  0% {

    opacity: 1;

    -webkit-transform: translateZ(-20px) rotateX(0);

  }

  60% {

    opacity: 0;

    -webkit-transform: translateZ(-20px) rotateX(-100deg);

  }

  100% {

    opacity: 0;

    -webkit-transform: translateZ(-20px) rotateX(-90deg);

  }

}

@-moz-keyframes cd-rotate-2-out {

  0% {

    opacity: 1;

    -moz-transform: translateZ(-20px) rotateX(0);

  }

  60% {

    opacity: 0;

    -moz-transform: translateZ(-20px) rotateX(-100deg);

  }

  100% {

    opacity: 0;

    -moz-transform: translateZ(-20px) rotateX(-90deg);

  }

}

@keyframes cd-rotate-2-out {

  0% {

    opacity: 1;

    -webkit-transform: translateZ(-20px) rotateX(0);

    -moz-transform: translateZ(-20px) rotateX(0);

    -ms-transform: translateZ(-20px) rotateX(0);

    -o-transform: translateZ(-20px) rotateX(0);

    transform: translateZ(-20px) rotateX(0);

  }

  60% {

    opacity: 0;

    -webkit-transform: translateZ(-20px) rotateX(-100deg);

    -moz-transform: translateZ(-20px) rotateX(-100deg);

    -ms-transform: translateZ(-20px) rotateX(-100deg);

    -o-transform: translateZ(-20px) rotateX(-100deg);

    transform: translateZ(-20px) rotateX(-100deg);

  }

  100% {

    opacity: 0;

    -webkit-transform: translateZ(-20px) rotateX(-90deg);

    -moz-transform: translateZ(-20px) rotateX(-90deg);

    -ms-transform: translateZ(-20px) rotateX(-90deg);

    -o-transform: translateZ(-20px) rotateX(-90deg);

    transform: translateZ(-20px) rotateX(-90deg);

  }

}

/* -------------------------------- 



  xloading-bar 



  -------------------------------- */

.cd-headline.loading-bar span {

  display: inline-block;

  padding: 0.2em 0;

}



.cd-headline.loading-bar .cd-words-wrapper {

  overflow: hidden;

  vertical-align: top;

}



.cd-headline.loading-bar .cd-words-wrapper::after {

  /* loading bar */

  content: "";

  position: absolute;

  left: 0;

  bottom: 0;

  height: 2px;

  width: 0;

  background: var(--color-primary);

  z-index: 2;

  -webkit-transition: width 0.3s -0.1s;

  -moz-transition: width 0.3s -0.1s;

  transition: width 0.3s -0.1s;

}



.cd-headline.loading-bar .cd-words-wrapper.is-loading::after {

  width: 100%;

  -webkit-transition: width 3s;

  -moz-transition: width 3s;

  transition: width 3s;

}



.cd-headline.loading-bar b {

  top: 0.2em;

  opacity: 0;

  -webkit-transition: opacity 0.3s;

  -moz-transition: opacity 0.3s;

  transition: opacity 0.3s;

}



.cd-headline.loading-bar b.is-visible {

  opacity: 1;

  top: 0;

}



/* -------------------------------- 



  xslide 



  -------------------------------- */

.cd-headline.slide span {

  display: inline-block;

}



.cd-headline.slide .cd-words-wrapper {

  overflow: hidden;

  vertical-align: top;

}



.cd-headline.slide b {

  opacity: 0;

  top: 0.2em;

}



.cd-headline.slide b.is-visible {

  top: 0;

  opacity: 1;

  -webkit-animation: slide-in 0.6s;

  -moz-animation: slide-in 0.6s;

  animation: slide-in 0.6s;

}



.cd-headline.slide b.is-hidden {

  -webkit-animation: slide-out 0.6s;

  -moz-animation: slide-out 0.6s;

  animation: slide-out 0.6s;

}



@-webkit-keyframes slide-in {

  0% {

    opacity: 0;

    -webkit-transform: translateY(-100%);

  }

  60% {

    opacity: 1;

    -webkit-transform: translateY(20%);

  }

  100% {

    opacity: 1;

    -webkit-transform: translateY(0);

  }

}

@-moz-keyframes slide-in {

  0% {

    opacity: 0;

    -moz-transform: translateY(-100%);

  }

  60% {

    opacity: 1;

    -moz-transform: translateY(20%);

  }

  100% {

    opacity: 1;

    -moz-transform: translateY(0);

  }

}

@keyframes slide-in {

  0% {

    opacity: 0;

    -webkit-transform: translateY(-100%);

    -moz-transform: translateY(-100%);

    -ms-transform: translateY(-100%);

    -o-transform: translateY(-100%);

    transform: translateY(-100%);

  }

  60% {

    opacity: 1;

    -webkit-transform: translateY(20%);

    -moz-transform: translateY(20%);

    -ms-transform: translateY(20%);

    -o-transform: translateY(20%);

    transform: translateY(20%);

  }

  100% {

    opacity: 1;

    -webkit-transform: translateY(0);

    -moz-transform: translateY(0);

    -ms-transform: translateY(0);

    -o-transform: translateY(0);

    transform: translateY(0);

  }

}

@-webkit-keyframes slide-out {

  0% {

    opacity: 1;

    -webkit-transform: translateY(0);

  }

  60% {

    opacity: 0;

    -webkit-transform: translateY(120%);

  }

  100% {

    opacity: 0;

    -webkit-transform: translateY(100%);

  }

}

@-moz-keyframes slide-out {

  0% {

    opacity: 1;

    -moz-transform: translateY(0);

  }

  60% {

    opacity: 0;

    -moz-transform: translateY(120%);

  }

  100% {

    opacity: 0;

    -moz-transform: translateY(100%);

  }

}

@keyframes slide-out {

  0% {

    opacity: 1;

    -webkit-transform: translateY(0);

    -moz-transform: translateY(0);

    -ms-transform: translateY(0);

    -o-transform: translateY(0);

    transform: translateY(0);

  }

  60% {

    opacity: 0;

    -webkit-transform: translateY(120%);

    -moz-transform: translateY(120%);

    -ms-transform: translateY(120%);

    -o-transform: translateY(120%);

    transform: translateY(120%);

  }

  100% {

    opacity: 0;

    -webkit-transform: translateY(100%);

    -moz-transform: translateY(100%);

    -ms-transform: translateY(100%);

    -o-transform: translateY(100%);

    transform: translateY(100%);

  }

}

/* -------------------------------- 



  xclip 



  -------------------------------- */

.cd-headline.clip span {

  display: inline-block;

}



.cd-headline.clip .cd-words-wrapper {

  overflow: hidden;

  vertical-align: top;

}



.cd-headline.clip .cd-words-wrapper::after {

  /* line */

  content: "";

  position: absolute;

  top: 0;

  right: 0;

  width: 2px;

  height: 100%;

  background-color: #aebcb9;

}



.cd-headline.clip b {

  opacity: 0;

}



.cd-headline.clip b.is-visible {

  opacity: 1;

}



/* -------------------------------- 



  xzoom 



  -------------------------------- */

.cd-headline.zoom .cd-words-wrapper {

  -webkit-perspective: 300px;

  -moz-perspective: 300px;

  perspective: 300px;

}



.cd-headline.zoom b {

  opacity: 0;

}



.cd-headline.zoom b.is-visible {

  opacity: 1;

  -webkit-animation: zoom-in 0.8s;

  -moz-animation: zoom-in 0.8s;

  animation: zoom-in 0.8s;

}



.cd-headline.zoom b.is-hidden {

  -webkit-animation: zoom-out 0.8s;

  -moz-animation: zoom-out 0.8s;

  animation: zoom-out 0.8s;

}



@-webkit-keyframes zoom-in {

  0% {

    opacity: 0;

    -webkit-transform: translateZ(100px);

  }

  100% {

    opacity: 1;

    -webkit-transform: translateZ(0);

  }

}

@-moz-keyframes zoom-in {

  0% {

    opacity: 0;

    -moz-transform: translateZ(100px);

  }

  100% {

    opacity: 1;

    -moz-transform: translateZ(0);

  }

}

@keyframes zoom-in {

  0% {

    opacity: 0;

    -webkit-transform: translateZ(100px);

    -moz-transform: translateZ(100px);

    -ms-transform: translateZ(100px);

    -o-transform: translateZ(100px);

    transform: translateZ(100px);

  }

  100% {

    opacity: 1;

    -webkit-transform: translateZ(0);

    -moz-transform: translateZ(0);

    -ms-transform: translateZ(0);

    -o-transform: translateZ(0);

    transform: translateZ(0);

  }

}

@-webkit-keyframes zoom-out {

  0% {

    opacity: 1;

    -webkit-transform: translateZ(0);

  }

  100% {

    opacity: 0;

    -webkit-transform: translateZ(-100px);

  }

}

@-moz-keyframes zoom-out {

  0% {

    opacity: 1;

    -moz-transform: translateZ(0);

  }

  100% {

    opacity: 0;

    -moz-transform: translateZ(-100px);

  }

}

@keyframes zoom-out {

  0% {

    opacity: 1;

    -webkit-transform: translateZ(0);

    -moz-transform: translateZ(0);

    -ms-transform: translateZ(0);

    -o-transform: translateZ(0);

    transform: translateZ(0);

  }

  100% {

    opacity: 0;

    -webkit-transform: translateZ(-100px);

    -moz-transform: translateZ(-100px);

    -ms-transform: translateZ(-100px);

    -o-transform: translateZ(-100px);

    transform: translateZ(-100px);

  }

}

/* -------------------------------- 



  xrotate-3 



  -------------------------------- */

.cd-headline.rotate-3 .cd-words-wrapper {

  -webkit-perspective: 300px;

  -moz-perspective: 300px;

  perspective: 300px;

}



.cd-headline.rotate-3 b {

  opacity: 0;

}



.cd-headline.rotate-3 i {

  display: inline-block;

  -webkit-transform: rotateY(180deg);

  -moz-transform: rotateY(180deg);

  -ms-transform: rotateY(180deg);

  -o-transform: rotateY(180deg);

  transform: rotateY(180deg);

  -webkit-backface-visibility: hidden;

  backface-visibility: hidden;

}



.is-visible .cd-headline.rotate-3 i {

  -webkit-transform: rotateY(0deg);

  -moz-transform: rotateY(0deg);

  -ms-transform: rotateY(0deg);

  -o-transform: rotateY(0deg);

  transform: rotateY(0deg);

}



.cd-headline.rotate-3 i.in {

  -webkit-animation: cd-rotate-3-in 0.6s forwards;

  -moz-animation: cd-rotate-3-in 0.6s forwards;

  animation: cd-rotate-3-in 0.6s forwards;

}



.cd-headline.rotate-3 i.out {

  -webkit-animation: cd-rotate-3-out 0.6s forwards;

  -moz-animation: cd-rotate-3-out 0.6s forwards;

  animation: cd-rotate-3-out 0.6s forwards;

}



.no-csstransitions .cd-headline.rotate-3 i {

  -webkit-transform: rotateY(0deg);

  -moz-transform: rotateY(0deg);

  -ms-transform: rotateY(0deg);

  -o-transform: rotateY(0deg);

  transform: rotateY(0deg);

  opacity: 0;

}



.no-csstransitions .cd-headline.rotate-3 .is-visible i {

  opacity: 1;

}



@-webkit-keyframes cd-rotate-3-in {

  0% {

    -webkit-transform: rotateY(180deg);

  }

  100% {

    -webkit-transform: rotateY(0deg);

  }

}

@-moz-keyframes cd-rotate-3-in {

  0% {

    -moz-transform: rotateY(180deg);

  }

  100% {

    -moz-transform: rotateY(0deg);

  }

}

@keyframes cd-rotate-3-in {

  0% {

    -webkit-transform: rotateY(180deg);

    -moz-transform: rotateY(180deg);

    -ms-transform: rotateY(180deg);

    -o-transform: rotateY(180deg);

    transform: rotateY(180deg);

  }

  100% {

    -webkit-transform: rotateY(0deg);

    -moz-transform: rotateY(0deg);

    -ms-transform: rotateY(0deg);

    -o-transform: rotateY(0deg);

    transform: rotateY(0deg);

  }

}

@-webkit-keyframes cd-rotate-3-out {

  0% {

    -webkit-transform: rotateY(0);

  }

  100% {

    -webkit-transform: rotateY(-180deg);

  }

}

@-moz-keyframes cd-rotate-3-out {

  0% {

    -moz-transform: rotateY(0);

  }

  100% {

    -moz-transform: rotateY(-180deg);

  }

}

@keyframes cd-rotate-3-out {

  0% {

    -webkit-transform: rotateY(0);

    -moz-transform: rotateY(0);

    -ms-transform: rotateY(0);

    -o-transform: rotateY(0);

    transform: rotateY(0);

  }

  100% {

    -webkit-transform: rotateY(-180deg);

    -moz-transform: rotateY(-180deg);

    -ms-transform: rotateY(-180deg);

    -o-transform: rotateY(-180deg);

    transform: rotateY(-180deg);

  }

}

/* -------------------------------- 



  xscale 



  -------------------------------- */

.cd-headline.scale b {

  opacity: 0;

}



.cd-headline.scale i {

  display: inline-block;

  opacity: 0;

  -webkit-transform: scale(0);

  -moz-transform: scale(0);

  -ms-transform: scale(0);

  -o-transform: scale(0);

  transform: scale(0);

}



.is-visible .cd-headline.scale i {

  opacity: 1;

}



.cd-headline.scale i.in {

  -webkit-animation: scale-up 0.6s forwards;

  -moz-animation: scale-up 0.6s forwards;

  animation: scale-up 0.6s forwards;

}



.cd-headline.scale i.out {

  -webkit-animation: scale-down 0.6s forwards;

  -moz-animation: scale-down 0.6s forwards;

  animation: scale-down 0.6s forwards;

}



.no-csstransitions .cd-headline.scale i {

  -webkit-transform: scale(1);

  -moz-transform: scale(1);

  -ms-transform: scale(1);

  -o-transform: scale(1);

  transform: scale(1);

  opacity: 0;

}



.no-csstransitions .cd-headline.scale .is-visible i {

  opacity: 1;

}



@-webkit-keyframes scale-up {

  0% {

    -webkit-transform: scale(0);

    opacity: 0;

  }

  60% {

    -webkit-transform: scale(1.2);

    opacity: 1;

  }

  100% {

    -webkit-transform: scale(1);

    opacity: 1;

  }

}

@-moz-keyframes scale-up {

  0% {

    -moz-transform: scale(0);

    opacity: 0;

  }

  60% {

    -moz-transform: scale(1.2);

    opacity: 1;

  }

  100% {

    -moz-transform: scale(1);

    opacity: 1;

  }

}

@keyframes scale-up {

  0% {

    -webkit-transform: scale(0);

    -moz-transform: scale(0);

    -ms-transform: scale(0);

    -o-transform: scale(0);

    transform: scale(0);

    opacity: 0;

  }

  60% {

    -webkit-transform: scale(1.2);

    -moz-transform: scale(1.2);

    -ms-transform: scale(1.2);

    -o-transform: scale(1.2);

    transform: scale(1.2);

    opacity: 1;

  }

  100% {

    -webkit-transform: scale(1);

    -moz-transform: scale(1);

    -ms-transform: scale(1);

    -o-transform: scale(1);

    transform: scale(1);

    opacity: 1;

  }

}

@-webkit-keyframes scale-down {

  0% {

    -webkit-transform: scale(1);

    opacity: 1;

  }

  60% {

    -webkit-transform: scale(0);

    opacity: 0;

  }

}

@-moz-keyframes scale-down {

  0% {

    -moz-transform: scale(1);

    opacity: 1;

  }

  60% {

    -moz-transform: scale(0);

    opacity: 0;

  }

}

@keyframes scale-down {

  0% {

    -webkit-transform: scale(1);

    -moz-transform: scale(1);

    -ms-transform: scale(1);

    -o-transform: scale(1);

    transform: scale(1);

    opacity: 1;

  }

  60% {

    -webkit-transform: scale(0);

    -moz-transform: scale(0);

    -ms-transform: scale(0);

    -o-transform: scale(0);

    transform: scale(0);

    opacity: 0;

  }

}

/* -------------------------------- 



  xpush 



  -------------------------------- */

.cd-headline.push b {

  opacity: 0;

}



.cd-headline.push b.is-visible {

  opacity: 1;

  -webkit-animation: push-in 0.6s;

  -moz-animation: push-in 0.6s;

  animation: push-in 0.6s;

}



.cd-headline.push b.is-hidden {

  -webkit-animation: push-out 0.6s;

  -moz-animation: push-out 0.6s;

  animation: push-out 0.6s;

}



@-webkit-keyframes push-in {

  0% {

    opacity: 0;

    -webkit-transform: translateX(-100%);

  }

  60% {

    opacity: 1;

    -webkit-transform: translateX(10%);

  }

  100% {

    opacity: 1;

    -webkit-transform: translateX(0);

  }

}

@-moz-keyframes push-in {

  0% {

    opacity: 0;

    -moz-transform: translateX(-100%);

  }

  60% {

    opacity: 1;

    -moz-transform: translateX(10%);

  }

  100% {

    opacity: 1;

    -moz-transform: translateX(0);

  }

}

@keyframes push-in {

  0% {

    opacity: 0;

    -webkit-transform: translateX(-100%);

    -moz-transform: translateX(-100%);

    -ms-transform: translateX(-100%);

    -o-transform: translateX(-100%);

    transform: translateX(-100%);

  }

  60% {

    opacity: 1;

    -webkit-transform: translateX(10%);

    -moz-transform: translateX(10%);

    -ms-transform: translateX(10%);

    -o-transform: translateX(10%);

    transform: translateX(10%);

  }

  100% {

    opacity: 1;

    -webkit-transform: translateX(0);

    -moz-transform: translateX(0);

    -ms-transform: translateX(0);

    -o-transform: translateX(0);

    transform: translateX(0);

  }

}

@-webkit-keyframes push-out {

  0% {

    opacity: 1;

    -webkit-transform: translateX(0);

  }

  60% {

    opacity: 0;

    -webkit-transform: translateX(110%);

  }

  100% {

    opacity: 0;

    -webkit-transform: translateX(100%);

  }

}

@-moz-keyframes push-out {

  0% {

    opacity: 1;

    -moz-transform: translateX(0);

  }

  60% {

    opacity: 0;

    -moz-transform: translateX(110%);

  }

  100% {

    opacity: 0;

    -moz-transform: translateX(100%);

  }

}

@keyframes push-out {

  0% {

    opacity: 1;

    -webkit-transform: translateX(0);

    -moz-transform: translateX(0);

    -ms-transform: translateX(0);

    -o-transform: translateX(0);

    transform: translateX(0);

  }

  60% {

    opacity: 0;

    -webkit-transform: translateX(110%);

    -moz-transform: translateX(110%);

    -ms-transform: translateX(110%);

    -o-transform: translateX(110%);

    transform: translateX(110%);

  }

  100% {

    opacity: 0;

    -webkit-transform: translateX(100%);

    -moz-transform: translateX(100%);

    -ms-transform: translateX(100%);

    -o-transform: translateX(100%);

    transform: translateX(100%);

  }

}

.personal-portfolio-right-inner-wrapper {

  max-width: 80%;

  margin-right: auto;

}

.personal-portfolio-right-inner-wrapper p {

  font-weight: 400;

}

.personal-portfolio-right-inner-wrapper .section-header .subtitle {

  display: flex;

  align-items: center;

  font-weight: 500;

  color: var(--color-body);

  font-size: 16px;

  letter-spacing: 0.5px;

}

.personal-portfolio-right-inner-wrapper .section-header .subtitle i {

  margin-right: 10px;

}

.personal-portfolio-right-inner-wrapper .tmp-title-split {

  font-weight: 500;

}

@media only screen and (max-width: 575px) {

  .personal-portfolio-right-inner-wrapper .tmp-title-split {

    font-size: 22px;

  }

}

.personal-portfolio-right-inner-wrapper .tmp-title-split span {

  color: var(--color-primary);

}

.personal-portfolio-right-inner-wrapper .section-header h1 {

  font-weight: 400;

  line-height: 1.3;

  font-size: 48px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .personal-portfolio-right-inner-wrapper .section-header h1 {

    font-size: 42px;

  }

}

@media only screen and (max-width: 1199px) {

  .personal-portfolio-right-inner-wrapper .section-header h1 {

    font-size: 38px;

  }

}

@media only screen and (max-width: 767px) {

  .personal-portfolio-right-inner-wrapper .section-header h1 {

    font-size: 26px;

  }

}

.personal-portfolio-right-inner-wrapper .section-header h1 span {

  color: var(--color-primary);

}

.personal-portfolio-right-inner-wrapper .counter-style-2 {

  margin-top: 30px;

}

.personal-portfolio-right-inner-wrapper .counter-style-2 .title {

  margin-top: 20px;

  margin-bottom: 10px;

}

.personal-portfolio-right-inner-wrapper .counter-main-wrapper-card {

  background-color: transparent;

  border: none;

  border-radius: 4px;

  width: 100%;

  height: 170px;

  background-color: #010a10;

  margin-bottom: 0;

}

.personal-portfolio-right-inner-wrapper .counter-style-2.border-style.small-radious .count-number {

  background-color: transparent;

}

.personal-portfolio-right-inner-wrapper .counter-style-2 .description {

  padding: 0 0;

}

.personal-portfolio-right-inner-wrapper .counter-style-2 .count-number {

  background-color: transparent;

  border: none;

  border-radius: 4px;

  width: 100%;

  height: 170px;

  background-color: #1b1b1c;

  font-size: 44px;

  background-color: #1b1b1c;

  display: inline-block;

  min-width: 150px;

  height: 150px;

  border-radius: 100%;

  text-align: center;

  line-height: 160px;

  margin-bottom: 20px;

  padding: 0 20px;

  font-weight: 500;

  color: var(--color-heading);

  margin-bottom: 0;

}

.personal-portfolio-right-inner-wrapper .tmponhover::after {

  border-radius: 5px;

}

.personal-portfolio-right-inner-wrapper .contact-area-left-portfolio-fixed .thumbnail {

  height: 100%;

}

.personal-portfolio-right-inner-wrapper .contact-area-left-portfolio-fixed .thumbnail img {

  height: 100%;

  z-index: 10;

  position: relative;

}



@media only screen and (max-width: 767px) {

  .experience-style-list .experience-list {

    padding-left: 27px;

  }

}

@media only screen and (max-width: 479px) {

  .experience-style-list .experience-list {

    padding-left: 14px;

  }

}

.experience-style-list .experience-list .resume-single-list {

  position: relative;

  z-index: 2;

  margin-top: 50px;

  padding: 45px 40px;

  border-radius: 6px;

  background: var(--color-card);

  transition: var(--transition);

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .experience-style-list .experience-list .resume-single-list {

    padding: 30px 25px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .experience-style-list .experience-list .resume-single-list {

    padding: 30px;

  }

}

@media only screen and (max-width: 575px) {

  .experience-style-list .experience-list .resume-single-list {

    margin-top: 30px;

  }

}

@media only screen and (max-width: 479px) {

  .experience-style-list .experience-list .resume-single-list {

    padding: 20px;

  }

}

.experience-style-list .experience-list .resume-single-list .inner .heading {

  display: flex;

  align-items: center;

  justify-content: space-between;

  border-bottom: 1px solid var(--color-border);

  padding-bottom: 20px;

  margin-bottom: 20px;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .experience-style-list .experience-list .resume-single-list .inner .heading {

    display: block;

  }

}

@media only screen and (max-width: 767px) {

  .experience-style-list .experience-list .resume-single-list .inner .heading {

    display: block;

  }

}

.experience-style-list .experience-list .resume-single-list .inner .heading .title {

  margin-bottom: 15px;

}

.experience-style-list .experience-list .resume-single-list .inner .heading .title h4 {

  color: var(--color-lightn);

  font-family: var(--font-primary);

  font-size: 24px;

  line-height: 39px;

  margin-bottom: 7px;

  font-weight: 500;

  transition: var(--transition);

}

@media only screen and (max-width: 479px) {

  .experience-style-list .experience-list .resume-single-list .inner .heading .title h4 {

    font-size: 21px;

    line-height: 34px;

  }

}

.experience-style-list .experience-list .resume-single-list .inner .heading .title span {

  color: #7c838e;

  display: block;

  font-size: 14px;

}

.experience-style-list .experience-list .resume-single-list .inner .heading .date-of-time {

  display: inline-block;

}

.experience-style-list .experience-list .resume-single-list .inner .heading .date-of-time span {

  color: #fff;

  display: block;

  font-size: 14px;

  padding: 0 15px;

  height: 36px;

  line-height: 36px;

  border-radius: 6px;

  background: #1e2025;

  transition: var(--transition);

  font-weight: 500;

}

.experience-style-list .experience-list .resume-single-list .inner p {

  font-size: 18px;

  line-height: 28px;

  color: var(--color-body);

  transition: var(--transition);

}

.experience-style-list .experience-list .resume-single-list .inner.psudo-after-none::after {

  display: none;

}

.experience-style-list .experience-list .resume-single-list .inner.psudo-after-none::before {

  display: none;

}

.experience-style-list .experience-list .resume-single-list:hover .inner .heading .title h4 {

  color: var(--color-white);

}

.experience-style-list .experience-list .resume-single-list:hover .inner .heading .date-of-time span {

  background: var(--color-primary);

}

.experience-style-list .experience-list .resume-single-list:hover .inner .description {

  color: var(--color-lightn);

}

.experience-style-list .experience-list .resume-single-list:hover .inner::after {

  background: var(--color-primary);

}

.experience-style-list .experience-list .resume-single-list:hover::before {

  opacity: 1;

}



.bg-card {

  background: var(--color-card);

}



.personal-portfolio-right-inner-wrapper {

  max-width: 80%;

  margin-right: auto;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .personal-portfolio-right-inner-wrapper {

    max-width: 90%;

  }

}

@media only screen and (max-width: 1199px) {

  .personal-portfolio-right-inner-wrapper {

    max-width: 100%;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .personal-portfolio-right-inner-wrapper {

    max-width: 100%;

  }

}

@media only screen and (max-width: 767px) {

  .personal-portfolio-right-inner-wrapper {

    max-width: 100%;

  }

}



.tmp-portfolio-small {

  text-align: left;

  padding: 30px;

  position: relative;

  border-radius: 6px;

  position: relative;

  z-index: 1;

  height: 100%;

  transition: 0.5s all ease-in-out;

  display: inline-block;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-portfolio-small {

    padding: 30px;

  }

}

@media only screen and (max-width: 479px) {

  .tmp-portfolio-small {

    padding: 20px;

  }

}

.tmp-portfolio-small .inner .thumbnail a {

  display: block;

  overflow: hidden;

  border-radius: 10px;

}

.tmp-portfolio-small .inner .thumbnail a img {

  width: 100%;

  transition: var(--transition);

  height: auto;

  object-fit: cover;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-portfolio-small .inner .thumbnail a img {

    height: inherit;

  }

}

.tmp-portfolio-small .inner .thumbnail a video {

  border-radius: 10px;

  height: 100%;

  transition: var(--transition);

  object-fit: cover;

  width: 100%;

}

@media only screen and (max-width: 479px) {

  .tmp-portfolio-small .inner .thumbnail a {

    display: inline-flex;

  }

}

.tmp-portfolio-small .inner .content {

  padding-top: 18px;

}

.tmp-portfolio-small .inner .content .category-info {

  display: flex;

  justify-content: space-between;

  padding-bottom: 10px;

}

.tmp-portfolio-small .inner .content .category-info .category-list {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

}

.tmp-portfolio-small .inner .content .category-info .category-list a {

  color: var(--color-primary);

  font-weight: 500;

  font-family: var(--font-primary);

  font-size: 12px;

  letter-spacing: 1px;

  text-transform: uppercase;

  display: block;

}

.tmp-portfolio-small .inner .content .category-info .meta span {

  color: var(--color-lightn);

  font-weight: 500;

  font-family: var(--font-primary);

  font-size: 13px;

}

.tmp-portfolio-small .inner .content .category-info .meta span i {

  margin-right: 2px;

  font-size: 13px;

  transition: var(--transition);

}

.tmp-portfolio-small .inner .content .category-info .meta span a i {

  margin-right: 2px;

  font-size: 13px;

  transition: var(--transition);

}

.tmp-portfolio-small .inner .content .title {

  margin: 0;

}

.tmp-portfolio-small .inner .content .title a {

  transition: var(--transition);

  color: var(--color-lightn);

  font-weight: 600;

  font-size: 23px;

  line-height: 34px;

  display: inline-block;

}

@media only screen and (max-width: 479px) {

  .tmp-portfolio-small .inner .content .title a {

    font-size: 20px;

    line-height: 30px;

  }

}

.tmp-portfolio-small .inner .content .title a i {

  font-size: 0;

  position: relative;

  top: 10px;

  transition: var(--transition);

  opacity: 0;

}

.tmp-portfolio-small .inner .content .title:hover a {

  color: var(--color-primary);

}

.tmp-portfolio-small .inner .content .title:hover a i {

  color: var(--color-primary);

  top: 3px;

  opacity: 1;

  font-size: 23px;

}

.tmp-portfolio-small::before {

  content: "";

  position: absolute;

  transition: var(--transition);

  width: 100%;

  height: 100%;

  border-radius: 20px;

  top: 0;

  left: 0;

  background: linear-gradient(to right bottom, #212428, #16181c);

  opacity: 0;

  z-index: -1;

}

.tmp-portfolio-small:hover::before {

  opacity: 1;

}

.tmp-portfolio-small:hover .thumbnail a img {

  transform: scale(1.1);

}

.tmp-portfolio-small:hover video {

  transform: scale(1.1);

}



.tmp-portfolio-single-card {

  text-align: left;

  padding: 30px;

  position: relative;

  border-radius: 20px;

  background: var(--background-color-1);

  position: relative;

  z-index: 1;

  height: 100%;

  transition: 0.5s all ease-in-out;

  display: inline-block;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-portfolio-single-card {

    padding: 30px;

  }

}

@media only screen and (max-width: 479px) {

  .tmp-portfolio-single-card {

    padding: 20px;

  }

}

.tmp-portfolio-single-card .inner .thumbnail a {

  display: block;

  overflow: hidden;

  border-radius: 10px;

}

.tmp-portfolio-single-card .inner .thumbnail a img {

  width: 100%;

  transition: var(--transition);

  height: auto;

  object-fit: cover;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-portfolio-single-card .inner .thumbnail a img {

    height: inherit;

  }

}

.tmp-portfolio-single-card .inner .thumbnail a video {

  border-radius: 10px;

  height: 100%;

  transition: var(--transition);

  object-fit: cover;

  width: 100%;

}

@media only screen and (max-width: 479px) {

  .tmp-portfolio-single-card .inner .thumbnail a {

    display: inline-flex;

  }

}

.tmp-portfolio-single-card .inner .content {

  padding-top: 18px;

}

.tmp-portfolio-single-card .inner .content .category-info {

  display: flex;

  justify-content: space-between;

  padding-bottom: 10px;

}

.tmp-portfolio-single-card .inner .content .category-info .category-list {

  display: flex;

  flex-wrap: wrap;

  align-items: center;

}

.tmp-portfolio-single-card .inner .content .category-info .category-list a {

  color: var(--color-primary);

  font-weight: 500;

  font-family: var(--font-primary);

  font-size: 12px;

  letter-spacing: 1px;

  text-transform: uppercase;

  display: block;

}

.tmp-portfolio-single-card .inner .content .category-info .meta span {

  color: var(--color-lightn);

  font-weight: 500;

  font-family: var(--font-primary);

  font-size: 13px;

}

.tmp-portfolio-single-card .inner .content .category-info .meta span i {

  margin-right: 2px;

  font-size: 13px;

  transition: var(--transition);

}

.tmp-portfolio-single-card .inner .content .category-info .meta span a i {

  margin-right: 2px;

  font-size: 13px;

  transition: var(--transition);

}

.tmp-portfolio-single-card .inner .content .title {

  margin: 0;

}

.tmp-portfolio-single-card .inner .content .title a {

  transition: var(--transition);

  color: var(--color-lightn);

  font-weight: 600;

  font-size: 23px;

  line-height: 34px;

  display: inline-block;

}

@media only screen and (max-width: 479px) {

  .tmp-portfolio-single-card .inner .content .title a {

    font-size: 20px;

    line-height: 30px;

  }

}

.tmp-portfolio-single-card .inner .content .title a i {

  font-size: 0;

  position: relative;

  top: 10px;

  transition: var(--transition);

  opacity: 0;

}

.tmp-portfolio-single-card .inner .content .title:hover a {

  color: var(--color-primary);

}

.tmp-portfolio-single-card .inner .content .title:hover a i {

  color: var(--color-primary);

  top: 3px;

  opacity: 1;

  font-size: 23px;

}

.tmp-portfolio-single-card::before {

  content: "";

  position: absolute;

  transition: var(--transition);

  width: 100%;

  height: 100%;

  border-radius: 20px;

  top: 0;

  left: 0;

  background: linear-gradient(to right bottom, #212428, #16181c);

  opacity: 0;

  z-index: -1;

}

.tmp-portfolio-single-card:hover::before {

  opacity: 1;

}

.tmp-portfolio-single-card:hover .thumbnail a img {

  transform: scale(1.1);

}

.tmp-portfolio-single-card:hover video {

  transform: scale(1.1);

}



.button-group-pd {

  display: flex;

  align-items: center;

  gap: 20px;

}

.button-group-pd .tmp-btn i {

  top: 0;

}



.card-head.with-flex {

  display: flex;

  align-items: center;

  gap: 15px;

}



.tmp-light {

  position: absolute !important;

  content: "";

  width: 200px;

  height: 200px;

  background: var(--color-primary);

  border-radius: 100%;

  left: 50%;

  transform: translateX(-50%);

  filter: blur(70px);

  opacity: 0;

  transition: 0.5s;

}

.tmp-light.light-left {

  left: -100px;

  transform: inherit;

}

.tmp-light.light-top-left {

  left: -100px;

  transform: inherit;

  top: -100px;

}

.tmp-light.light-center-center {

  width: 400px;

  height: 50px;

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%);

}

.tmp-light.active {

  opacity: 1;

}



.tmponhover {

  position: relative;

  overflow: hidden;

  border: 1px solid var(--stroke-dark-100);

}

.tmponhover::before {

  content: "";

  position: absolute;

  inset: 0px;

  border-radius: inherit;

  border: 1px solid transparent;

  background-clip: border-box;

  -webkit-mask: var(--full) padding-box, var(--full);

  -webkit-mask-composite: xor;

  mask: var(--full) padding-box exclude, var(--full);

  pointer-events: none;

  background: var(--stroke-gr) border-box;

  z-index: 1;

  transition: 0.5s;

  transition: border-color 0.5s;

  opacity: 0;

  transition: opacity 0.5s ease;

  will-change: opacity;

}

.tmponhover::after {

  content: "";

  position: absolute;

  inset: 2px;

  background: var(--color-gray-2);

  border-radius: 20px;

}

.tmponhover > * {

  z-index: 2;

  position: relative;

}

.tmponhover:hover, .tmponhover.active {

  border-color: transparent;

}

.tmponhover:hover::before, .tmponhover.active::before {

  opacity: 1;

}

.tmponhover:hover .tmp-light, .tmponhover.active .tmp-light {

  opacity: 1;

}



@keyframes gradient {

  0% {

    background-position: 0% 50%;

  }

  50% {

    background-position: 100% 50%;

  }

  100% {

    background-position: 0% 50%;

  }

}

.tmp-light-hover .tmp-light {

  position: absolute;

  width: 938px;

  height: 938px;

  max-width: 100%;

  max-height: 100%;

  border-radius: 100%;

  background: -o-linear-gradient(315deg, var(--color-primary) 46.07%, rgba(53, 52, 124, 0) 91.91%);

  background: linear-gradient(135deg, var(--color-primary) 46.07%, rgba(53, 52, 124, 0) 91.91%);

  -webkit-filter: blur(150px);

  filter: blur(150px);

  top: 0;

  left: 0;

  transform: translate(-50%, -50%);

  pointer-events: none;

  opacity: 0;

  transition: 0.5s;

}

.tmp-light-hover:hover .tmp-light {

  opacity: 0.5;

}



/*------------------

Right Demo  

--------------------*/

.tmp-right-demo {

  width: 40px;

  position: fixed;

  z-index: 99;

  right: 0px;

  top: calc(60% - 55px);

}

.tmp-right-demo p {

  font-weight: 700;

  color: #fff;

}

.tmp-right-demo .demo-button {

  border-radius: 6px 0 0 6px;

  transition: var(--transition);

  position: relative;

  z-index: 2;

  font-size: 14px;

  border: 0 none;

  width: 100%;

  min-width: 100%;

  padding: 10px 0px 8px;

  font-weight: 400;

  letter-spacing: 1px;

  text-transform: uppercase;

  cursor: pointer;

}

.tmp-right-demo .demo-button::before {

  content: "";

  position: absolute;

  transition: var(--transition);

  width: 100%;

  height: 100%;

  border-radius: 2px 0 0 2px;

  top: 0;

  left: 0;

  background: var(--color-primary);

  opacity: 1;

  z-index: -1;

  background: linear-gradient(-45deg, #ee7752, #252525, #ff004b, #d52323);

  background-size: 400% 400%;

  animation: gradient 4s ease infinite;

  opacity: 1;

  backdrop-filter: blur(21px);

}

@keyframes gradient {

  0% {

    background-position: 25% 50%;

  }

  50% {

    background-position: 100% 50%;

  }

  100% {

    background-position: 25% 50%;

  }

}

.tmp-right-demo .demo-button .text {

  -webkit-writing-mode: vertical-rl;

  writing-mode: vertical-rl;

  text-orientation: upright;

  padding-left: 5px;

  padding-right: 5px;

  color: #ffffff;

  font-weight: 500;

  font-family: var(--font-secondary);

}



/*-------------------

 Popup Tab  

-----------------------*/

.popuptab-area {

  justify-content: center;

  margin: -20px -10px;

  margin-bottom: 30px;

  border: 0 none;

}

.popuptab-area li {

  margin: 20px 10px;

}

@media only screen and (max-width: 767px) {

  .popuptab-area li {

    margin: 10px 10px;

  }

}

.popuptab-area li a.nav-link {

  border-radius: 8px;

  background: var(--color-secondary);

  position: relative;

  z-index: 2;

  font-size: 14px;

  font-weight: 500;

  display: inline-block;

  padding: 15px 35px;

  list-style: none;

  text-decoration: none;

  color: #ffffff;

  outline: none;

  border: 2px solid rgba(255, 255, 255, 0.0784313725);

  font-family: var(--font-secondary);

  transition: var(--transition);

}

.popuptab-area li a.nav-link.active {

  border-color: var(--color-primary) !important;

  color: #ffffff !important;

  background: var(--color-primary) !important;

}

.popuptab-area li a.nav-link:hover, .popuptab-area li a.nav-link.active {

  border-color: transparent;

}



/*-----------------------

    Demo Modal Popup  

------------------------*/

.demo-modal-area {

  width: 100%;

  height: 100%;

  left: 0px;

  top: 0px;

  border: 0px;

  background-color: #060606;

  position: fixed;

  z-index: 999;

  overflow: auto;

  opacity: 0;

  visibility: hidden;

  transition: 0.5s;

  transform: translateX(100px);

}

.demo-modal-area .demo-close-btn {

  border: 0 none;

  position: fixed;

  right: 80px;

  top: 40px;

  width: 40px;

  display: inline-block;

  height: 40px;

  font-size: 22px;

  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);

  transition: var(--transition);

  z-index: 2;

  border-radius: 100px;

  background: #141414;

  color: var(--color-primary);

  min-width: 40px;

  line-height: 42px;

}

.demo-modal-area .demo-close-btn:hover {

  color: var(--color-primary);

}

.demo-modal-area .wrapper .tmp-modal-inner {

  margin: 70px auto;

  border-radius: 6px;

  padding: 50px;

  background: #141414;

  position: relative;

  max-width: 1170px;

  width: 90%;

  overflow: hidden;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .demo-modal-area .wrapper .tmp-modal-inner {

    padding: 40px 30px;

  }

}

@media only screen and (max-width: 767px) {

  .demo-modal-area .wrapper .tmp-modal-inner {

    padding: 30px 20px;

  }

}

.demo-modal-area .wrapper .tmp-modal-inner::after {

  content: " ";

  position: absolute;

  right: -450px;

  bottom: -500px;

  min-width: 474px;

  min-height: 474px;

  border-radius: 100px;

  filter: blur(227px);

  z-index: 1;

  background: var(--color-primary);

}

.demo-modal-area .wrapper .tmp-modal-inner::before {

  content: " ";

  position: absolute;

  left: -450px;

  top: -500px;

  min-width: 474px;

  min-height: 474px;

  border-radius: 100px;

  filter: blur(227px);

  z-index: 1;

  background: var(--color-primary);

}

.demo-modal-area .wrapper .tmp-modal-inner .demo-top .title {

  margin-bottom: 12px;

  color: #fff;

  font-size: 40px;

}

.demo-modal-area .wrapper .tmp-modal-inner .demo-top .subtitle {

  font-size: 16px;

  font-family: var(--font-secondary);

  width: 48%;

  margin: 0 auto;

  margin-bottom: 28px;

  margin-top: 22px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .demo-modal-area .wrapper .tmp-modal-inner .demo-top .subtitle {

    width: 100%;

  }

}

@media only screen and (max-width: 767px) {

  .demo-modal-area .wrapper .tmp-modal-inner .demo-top .subtitle {

    width: 100%;

  }

}

.demo-modal-area.open {

  opacity: 1;

  visibility: visible;

  transform: none;

}



.single-demo {

  position: relative;

  background-color: var(--color-secondary);

  z-index: 1;

  border-radius: 10px;

  transition: all var(--transition) linear;

}

.single-demo::before {

  position: absolute;

  content: "";

  top: -2px;

  left: -2px;

  transition: all var(--transition) linear;

  background: linear-gradient(180deg, var(--color-primary) 0%, var(--color-secondary) 100%);

  opacity: 0.2;

  width: calc(100% + 4px);

  height: calc(100% + 4px);

  z-index: -1;

  border-radius: 10px;

}

.single-demo.coming-soon {

  pointer-events: none;

}

.single-demo .inner {

  position: relative;

  z-index: 2;

  transition: var(--transition);

}

.single-demo .inner.badge-1 {

  position: relative;

  z-index: 1;

  overflow: hidden;

}

.single-demo .inner.badge-1::after {

  position: absolute;

  content: "Hot";

  padding: 3px 10px;

  border-radius: 5px;

  z-index: 2;

  font-size: 14px;

  top: 15px;

  right: 15px;

  background: linear-gradient(to right, #6a67ce, #fc636b) !important;

  color: #ffffff;

  transition: 0.3s;

}

.single-demo .inner.badge-2 {

  position: relative;

  z-index: 1;

  overflow: hidden;

}

.single-demo .inner.badge-2::after {

  position: absolute;

  content: "New";

  padding: 3px 10px;

  border-radius: 5px;

  z-index: 2;

  font-size: 14px;

  top: 15px;

  right: 15px;

  background: linear-gradient(to right, #6a67ce, #fc636b) !important;

  color: #ffffff;

  transition: 0.3s;

}

.single-demo .inner .thumbnail {

  border-radius: 6px 6px 0 0;

}

.single-demo .inner .thumbnail a {

  position: relative;

  display: block;

  z-index: 2;

}

.single-demo .inner .thumbnail a::after {

  position: absolute;

  content: "";

  background: rgba(0, 0, 0, 0.5);

  width: 100%;

  height: 100%;

  left: 0;

  top: 0;

  border-radius: 8px 8px 0 0;

  transition: 0.4s;

  opacity: 0;

}

.single-demo .inner .thumbnail a .overlay-content {

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  z-index: 2;

  margin-top: 10px;

  display: inline-block;

  transition: 0.4s;

}

.single-demo .inner .thumbnail a .overlay-content .overlay-text {

  display: inline-block;

  padding: 8px 15px;

  background: var(--color-primary);

  font-size: 14px;

  border-radius: 8px;

  opacity: 0;

  transition: 0.4s;

  color: #ffffff;

  font-family: var(--font-secondary);

}

.single-demo .inner .thumbnail img {

  border-radius: 6px 6px 0 0;

}

.single-demo .inner .title {

  margin-bottom: 0;

  padding-top: 16px;

  font-size: 18px;

  text-align: center;

  letter-spacing: 1px;

  border-top: 1px solid rgba(255, 255, 255, 0.04);

  margin-top: 0;

  font-weight: 500;

  padding-bottom: 16px;

  font-family: var(--font-secondary);

}

.single-demo .inner .title a {

  color: #ffffff;

  display: block;

  transition: 0.3s;

}

.single-demo .inner .title a:hover {

  color: var(--color-primary);

}

.single-demo:hover .inner .thumbnail a::after {

  opacity: 1;

}

.single-demo:hover .inner .thumbnail a .overlay-content {

  margin-top: 0;

}

.single-demo:hover .inner .thumbnail a .overlay-content .overlay-text {

  opacity: 1;

}

.single-demo:hover .badge-1:after {

  transform: scale(0.8);

  right: 0;

  top: 7px;

}

.single-demo:hover .badge-2:after {

  transform: scale(0.8);

  right: 0;

  top: 7px;

}

.single-demo:hover::before {

  transition: var(--transition);

  opacity: 1;

}



/*---------------------------------

    Right Demo Light Version  

----------------------------------*/

.demo-modal-area.active-light .wrapper .tmp-modal-inner {

  background: #EDEDED;

}



.demo-modal-area.active-light .single-demo {

  background: #ffffff;

}



.demo-modal-area.active-light .single-demo .inner .title a {

  color: #141414;

  transition: var(--transition);

}



.demo-modal-area.active-light .single-demo::before {

  background: linear-gradient(180deg, var(--color-primary) 0%, var(--color-white) 100%);

}



.demo-modal-area.active-light .demo-close-btn {

  background: var(--color-white);

}



.demo-modal-area .popuptab-area li a.nav-link {

  position: relative;

  z-index: 2;

}



.demo-modal-area.active-light .single-demo .inner .title {

  border-top: 1px solid transparent;

}



.demo-modal-area.active-light .wrapper .tmp-modal-inner .demo-top .title {

  color: #ffffff;

}



.demo-modal-area.active-light .wrapper .tmp-modal-inner .demo-top .subtitle {

  color: #6A7789;

}



.demo-modal-area.active-light .wrapper .tmp-modal-inner .demo-top .title {

  color: #141414;

}



.tmp-white-version .tmp-right-demo .demo-button .text {

  color: #141414;

}



.active-light .popuptab-area li a.nav-link {

  background: #ffffff;

  color: #141414;

}



.demo-modal-area.active-light {

  background-color: #e4e8ee;

}



body.tmp-white-version.index-8 .tmp-contact-about-inner .info-box {

  background: #f2f2f2;

}



.demo-button-wrapper {

  width: auto;

  white-space: nowrap;

  position: fixed;

  right: 0%;

  top: 25%;

  cursor: pointer;

  z-index: 1000;

  -webkit-transform: rotate(-90deg) translateY(-100%);

  -ms-transform: rotate(-90deg) translateY(-100%);

  transform: rotate(-90deg) translateY(-100%);

  -webkit-transform-origin: 100% 0 0;

  -ms-transform-origin: 100% 0 0;

  transform-origin: 100% 0 0;

  margin-right: -1px;

  display: flex;

}

.demo-button-wrapper .buy-theme {

  text-align: center;

  background-color: #48a133;

  position: relative;

  z-index: 1;

}

.demo-button-wrapper .buy-theme a {

  color: #fff;

  font-size: 11px;

  padding: 10px 15px;

  display: block;

  font-weight: 500;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .demo-button-wrapper .buy-theme a {

    padding: 7px;

  }

}

@media only screen and (max-width: 767px) {

  .demo-button-wrapper .buy-theme a {

    padding: 7px;

  }

}

.demo-button-wrapper .buy-theme .theme-wrapper {

  padding: 0;

  position: relative;

  top: 0;

  opacity: 1;

  transition-delay: 0.3s;

  line-height: 0;

}

.demo-button-wrapper .all-demo .demos {

  font-size: 11px;

  padding: 10px 15px;

  display: block;

  font-weight: 500;

  background-color: #1f242e;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .demo-button-wrapper .all-demo .demos {

    padding: 7px;

  }

}

@media only screen and (max-width: 767px) {

  .demo-button-wrapper .all-demo .demos {

    padding: 7px;

  }

}

.demo-button-wrapper .all-demo .theme-wrapper {

  padding: 0 9px;

  position: relative;

  top: 0;

  opacity: 1;

  transition-delay: 0.3s;

  line-height: 0;

}

.demo-button-wrapper .all-demo .theme-wrapper > div {

  display: inline-block;

  vertical-align: middle;

  color: #fff;

  font-size: 16px;

  text-transform: uppercase;

  line-height: 21px;

}



.demo-modal-area.open::-webkit-scrollbar {

  display: none;

}



.lines {

  position: fixed;

  top: 0;

  left: 0;

  right: 0;

  height: 100vh;

  margin: auto;

  width: 100vw;

  pointer-events: none;

}



.line {

  position: absolute;

  width: 1px;

  height: 100%;

  top: 0;

  left: 50%;

  background: rgba(255, 255, 255, 0.1);

  overflow: hidden;

}



.line::after {

  content: "";

  display: block;

  position: absolute;

  height: 15vh;

  width: 100%;

  top: -50%;

  left: 0;

  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, #fff 75%, #fff 100%);

  -webkit-animation: drop 7s linear infinite;

  animation: drop 7s linear infinite;

  -webkit-animation-fill-mode: forwards;

  animation-fill-mode: forwards;

  -webkit-animation-timing-function: cubic-bezier(0.4, 0.26, 0, 0.97);

  animation-timing-function: cubic-bezier(0.4, 0.26, 0, 0.97);

}



.line:nth-child(1) {

  margin-left: -40%;

}



.line:nth-child(1)::after {

  -webkit-animation-delay: 1.5s;

  animation-delay: 1.5s;

}



.line:nth-child(2) {

  margin-left: -8px;

}



.line:nth-child(3) {

  margin-left: 39%;

}



.line:nth-child(3)::after {

  -webkit-animation-delay: 2.5s;

  animation-delay: 2.5s;

}



@-webkit-keyframes drop {

  0% {

    top: -50%;

  }

  100% {

    top: 110%;

  }

}

@keyframes drop {

  0% {

    top: -50%;

  }

  100% {

    top: 110%;

  }

}

.separator-animated-border {

  position: absolute;

  bottom: 0;

  left: 50%;

  transform: translateX(-50%);

  right: 0;

  overflow: hidden;

  height: 1px;

  width: 75%;

  background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 0) 0%, rgba(72, 139, 255, 0.357) 50%, rgba(0, 0, 0, 0) 100%);

}

.separator-animated-border.animated-true::before {

  content: "";

  position: absolute;

  width: 7%;

  height: 100%;

  background: linear-gradient(90deg, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 0) 0%, var(--color-primary) 50%, rgba(0, 0, 0, 0) 100%);

  backdrop-filter: blur(20px);

  animation: separateline 4s ease-in-out infinite;

}

.separator-animated-border.border-top-footer {

  bottom: auto;

  top: 0;

  width: 100%;

}

.separator-animated-border.border-top-footer::before {

  animation: separateline 10s ease-in-out infinite;

}

@keyframes separateline {

  0% {

    left: 0;

  }

  100% {

    left: 110%;

  }

}



.tmp-intro-video-card-wrapper {

  position: fixed;

  z-index: 1008;

  right: 20px;

  bottom: 20px;

  width: 180px;

  height: 280px;

  transition: all 0.25s ease-in-out;

  border-radius: 8px;

  opacity: 1;

  background: var(--color-card);

  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.1);

  cursor: pointer;

}

@media only screen and (max-width: 575px) {

  .tmp-intro-video-card-wrapper {

    right: 20px;

    bottom: 20px;

  }

}

.tmp-intro-video-card-wrapper.position-left {

  right: auto;

  left: 20px;

}

.tmp-intro-video-card-wrapper.position-left .card-greeting {

  left: calc(100% - 32px);

  right: auto;

  border-radius: 20px 20px 20px 5px;

}

.tmp-intro-video-card-wrapper.position-left .tmp-iv-close-button {

  left: -10px;

  right: auto;

}

.tmp-intro-video-card-wrapper.position-left .play-button {

  left: 35px;

  right: auto;

}

.tmp-intro-video-card-wrapper.position-left .sound-button {

  left: 5px;

  right: auto;

}

.tmp-intro-video-card-wrapper.position-left.is-expanded .play-button {

  left: 50px;

  right: auto;

}

.tmp-intro-video-card-wrapper.position-left.is-expanded .sound-button {

  left: 10px;

  right: auto;

}



.tmp-video-controls {

  opacity: 0;

  transition: 0.3s;

}



.tmp-intro-video-card-wrapper:hover .tmp-video-controls {

  opacity: 1;

}



.tmp-video-inner {

  width: 100%;

  height: 100%;

  padding: 10px;

  position: relative;

}



.tmp-video-progress-container {

  position: relative;

  width: 100%;

  height: 100%;

}



.tmp-video-element {

  display: block;

  width: 100%;

  height: 100%;

  margin: 0 auto;

  border-radius: 4px;

  -o-object-fit: cover;

  object-fit: cover;

  background: rgba(255, 255, 255, 0.1);

}



.card-greeting {

  position: absolute;

  z-index: 1;

  top: 20px;

  left: auto;

  align-items: center;

  justify-content: center;

  min-width: 72px;

  width: max-content;

  min-height: 36px;

  -webkit-animation: bounce-fade 0.4s;

  animation: bounce-fade 0.4s;

  -webkit-animation-delay: 0.4s;

  animation-delay: 0.4s;

  border-radius: 20px 20px 5px;

  opacity: 1;

  background: var(--color-primary);

  box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.15);

  text-align: center;

  animation-fill-mode: forwards;

  display: flex;

  padding: 5px 10px;

  right: calc(100% - 32px);

}



.card-greeting p {

  color: #fff;

  line-height: 20px;

}



.is-expanded .card-greeting {

  display: none;

}



.play-button,

.sound-button,

.expand-icon {

  position: absolute;

  color: #fff;

  width: 30px;

  height: 30px;

  text-align: center;

  line-height: 32px;

  font-size: 16px;

  border-radius: 100px;

  transition: 0.3s;

  filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.2));

}



.play-button:hover,

.sound-button:hover,

.expand-icon:hover {

  background: rgba(0, 0, 0, 0.2);

}



.play-button {

  right: 35px;

  top: 5px;

}



.play-button.position-center {

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%);

}



.playing .play-button .feather-play:before {

  content: "\e9a4" !important;

}



.playing .play-button .fa-pause:before {

  content: "\f04b" !important;

}



.sound-button {

  right: 5px;

  top: 5px;

}



.sound-button.sound-muted .fa-volume:before {

  content: "\f6a9" !important;

}



.expand-icon {

  right: 5px;

  bottom: 5px;

}

.expand-icon i {

  font-size: 20px;

}



.expand-icon:hover {

  transform: scale(1.3);

}



.is-expanded .expand-icon {

  right: 10px;

  bottom: 10px;

}

.is-expanded .expand-icon .feather-maximize-2:before {

  content: "\e995" !important;

}



.tmp-intro-video-card-wrapper.is-expanded {

  width: 360px;

  height: 666px;

  right: 50%;

  bottom: 50%;

  transform: translate(50%, 50%);

}

@media only screen and (max-width: 575px) {

  .tmp-intro-video-card-wrapper.is-expanded {

    width: 300px;

    height: auto;

  }

}



.is-expanded .play-button,

.is-expanded .sound-button,

.is-expanded .expand-icon {

  width: 40px;

  height: 40px;

  line-height: 43px;

  font-size: 25px;

}



.is-expanded .play-button {

  top: 10px;

  right: 50px;

}



.is-expanded .sound-button {

  top: 10px;

  right: 10px;

}



.tmp-iv-close-button {

  position: absolute;

  right: -10px;

  top: -10px;

  background: linear-gradient(to right bottom, #212428, #16181c);

  display: inline-block;

  width: 30px;

  height: 30px;

  color: var(--color-primary);

  font-size: 16px;

  text-align: center;

  line-height: 32px;

  border-radius: 100%;

  opacity: 1;

  transition: 0.3s;

  transform: scale(0.8);

}



.tmp-iv-close-button i {

  font-weight: 900;

}



.tmp-intro-video-card-wrapper:hover .tmp-iv-close-button {

  opacity: 1;

}



.is-expanded .tmp-iv-close-button {

  opacity: 0;

  transform: scale(1);

}



.tmp-iv-top-wrapper {

  display: block;

  position: absolute;

  bottom: 0px;

  left: 0;

  right: 0;

  z-index: 50;

  pointer-events: none;

  display: none;

}



.tmp-iv-progress-bar {

  position: relative;

  overflow: hidden;

  width: 100%;

  height: 5px;

  margin-bottom: 0;

  cursor: pointer;

  background: rgba(0, 0, 0, 0);

  border-radius: 0 0 8px 8px;

}

.tmp-iv-progress-bar span {

  position: absolute;

  top: 0;

  left: 0;

  display: block;

  width: 0;

  height: 100%;

}

.tmp-iv-progress-bar .time-bar {

  z-index: 10;

  background: var(--color-primary);

}

.tmp-iv-progress-bar .buffer-bar {

  z-index: 5;

  background: var(--color-primary);

  opacity: 0.3;

}



body.white-version .tmp-intro-video-card-wrapper {

  background: #000;

}

body.white-version .tmp-video-element {

  background: rgba(0, 0, 0, 0.1);

}

body.white-version .card-greeting p {

  color: white;

}



.banner-area-one-main-demo .slider-bg-light {

  position: absolute;

  left: 25%;

  top: 0;

  min-width: 300px;

  z-index: -1;

}

@media only screen and (max-width: 767px) {

  .banner-area-one-main-demo .slider-bg-light {

    left: 10%;

    min-width: none;

  }

}

@media only screen and (max-width: 479px) {

  .banner-area-one-main-demo .slider-bg-light {

    left: 0%;

  }

}

@media screen and (min-width: 2500px) {

  .banner-area-one-main-demo .slider-bg-light {

    left: 45%;

    transform: translateX(-50%);

  }

}

.banner-area-one-main-demo .slider-bg-dot-shape {

  position: absolute;

  left: 35%;

  top: -28px;

  z-index: -1;

}



.blocksync-stars-area {

  height: 600px;

  overflow: hidden;

  width: 300px;

}

@media only screen and (max-width: 1199px) {

  .blocksync-stars-area {

    width: 100% !important;

    min-width: 150px;

  }

}



.blocksync-stars {

  width: 1px;

  height: 1px;

  background: transparent;

  box-shadow: 821px 1484px #FFF, 1400px 1584px #FFF, 1625px 1521px #FFF, 581px 1020px #FFF, 1306px 511px #FFF, 1315px 602px #FFF, 1279px 295px #FFF, 1366px 176px #FFF, 1655px 1433px #FFF, 477px 505px #FFF, 1034px 1068px #FFF, 597px 1508px #FFF, 1714px 1031px #FFF, 1357px 1903px #FFF, 1383px 799px #FFF, 1601px 1286px #FFF, 1665px 200px #FFF, 1562px 1050px #FFF, 925px 1495px #FFF, 1570px 1745px #FFF, 1298px 1701px #FFF, 903px 953px #FFF, 67px 959px #FFF, 593px 1079px #FFF, 1010px 1139px #FFF, 911px 1105px #FFF, 1642px 861px #FFF, 1777px 1587px #FFF, 1537px 590px #FFF, 437px 145px #FFF, 1210px 1436px #FFF, 1804px 1461px #FFF, 1021px 453px #FFF, 199px 995px #FFF, 1817px 1728px #FFF, 1798px 1229px #FFF, 191px 138px #FFF, 297px 83px #FFF, 1270px 1709px #FFF, 1150px 550px #FFF, 847px 1323px #FFF, 825px 1529px #FFF, 852px 1497px #FFF, 1916px 100px #FFF, 505px 340px #FFF, 1234px 793px #FFF, 1576px 1765px #FFF, 410px 540px #FFF, 901px 1335px #FFF, 459px 1178px #FFF, 629px 1571px #FFF, 1572px 1663px #FFF, 864px 855px #FFF, 133px 1555px #FFF, 1691px 575px #FFF, 964px 696px #FFF, 116px 760px #FFF, 1849px 242px #FFF, 1954px 1365px #FFF, 1677px 247px #FFF, 1349px 1739px #FFF, 140px 696px #FFF, 567px 292px #FFF, 421px 170px #FFF, 48px 1290px #FFF, 360px 390px #FFF, 373px 1357px #FFF, 743px 934px #FFF, 1983px 298px #FFF, 1535px 1599px #FFF, 1680px 1899px #FFF, 677px 645px #FFF, 521px 1750px #FFF, 747px 999px #FFF, 790px 25px #FFF, 1327px 1488px #FFF, 1007px 1432px #FFF, 273px 324px #FFF, 198px 32px #FFF, 1916px 1220px #FFF, 1016px 820px #FFF, 612px 1405px #FFF, 397px 58px #FFF, 1352px 1992px #FFF, 781px 450px #FFF, 550px 1080px #FFF, 150px 328px #FFF, 1534px 761px #FFF, 870px 1813px #FFF, 798px 906px #FFF, 1074px 351px #FFF, 1227px 1235px #FFF, 399px 241px #FFF, 286px 876px #FFF, 1153px 1640px #FFF, 499px 1075px #FFF, 1685px 1546px #FFF, 499px 1311px #FFF, 973px 1218px #FFF, 1074px 352px #FFF, 1142px 800px #FFF, 575px 77px #FFF, 491px 1981px #FFF, 1990px 1402px #FFF, 139px 1676px #FFF, 1063px 143px #FFF, 1788px 693px #FFF, 1554px 1906px #FFF, 690px 549px #FFF, 164px 210px #FFF, 819px 735px #FFF, 1728px 1130px #FFF, 1028px 1315px #FFF, 1929px 700px #FFF, 1539px 714px #FFF, 1229px 766px #FFF, 1444px 641px #FFF, 404px 1339px #FFF, 520px 49px #FFF, 1907px 1967px #FFF, 1567px 1786px #FFF, 65px 903px #FFF, 1194px 751px #FFF, 713px 1053px #FFF, 34px 1644px #FFF, 560px 998px #FFF, 1859px 1183px #FFF, 1562px 631px #FFF, 1956px 1419px #FFF, 1972px 93px #FFF, 66px 1932px #FFF, 1876px 1891px #FFF, 301px 1286px #FFF, 88px 1257px #FFF, 1173px 1962px #FFF, 317px 870px #FFF, 423px 1444px #FFF, 301px 1423px #FFF, 392px 451px #FFF, 389px 459px #FFF, 1524px 1093px #FFF, 413px 1123px #FFF, 994px 19px #FFF, 1446px 1184px #FFF, 942px 1303px #FFF, 1399px 1704px #FFF, 765px 88px #FFF, 436px 1318px #FFF, 804px 1704px #FFF, 1855px 370px #FFF, 77px 1106px #FFF, 503px 794px #FFF, 854px 1978px #FFF, 450px 526px #FFF, 689px 573px #FFF, 1805px 1115px #FFF, 827px 1189px #FFF, 1865px 1791px #FFF, 1165px 17px #FFF, 1910px 541px #FFF, 1497px 1675px #FFF, 1478px 1633px #FFF, 1584px 1827px #FFF, 816px 555px #FFF, 36px 1608px #FFF, 1419px 1242px #FFF, 1452px 1316px #FFF, 1211px 158px #FFF, 682px 1271px #FFF, 1902px 836px #FFF, 1924px 399px #FFF, 358px 1314px #FFF, 1349px 1903px #FFF, 1364px 1370px #FFF, 563px 1360px #FFF, 1423px 124px #FFF, 575px 1065px #FFF, 766px 1659px #FFF, 796px 1883px #FFF, 1363px 1622px #FFF, 1301px 932px #FFF, 884px 720px #FFF, 577px 129px #FFF, 675px 50px #FFF, 1868px 767px #FFF, 519px 905px #FFF, 734px 916px #FFF, 1490px 1104px #FFF, 1514px 619px #FFF, 612px 1433px #FFF, 1356px 873px #FFF, 1005px 202px #FFF, 917px 986px #FFF, 274px 1647px #FFF, 1549px 1904px #FFF, 1761px 1570px #FFF, 267px 166px #FFF, 1659px 1970px #FFF, 883px 1792px #FFF, 35px 524px #FFF, 1404px 1146px #FFF, 648px 682px #FFF, 495px 735px #FFF, 204px 288px #FFF, 235px 139px #FFF, 289px 489px #FFF, 159px 871px #FFF, 1347px 344px #FFF, 1928px 347px #FFF, 573px 1362px #FFF, 1760px 1778px #FFF, 660px 1894px #FFF, 631px 99px #FFF, 1766px 199px #FFF, 1486px 450px #FFF, 1665px 1821px #FFF, 1154px 698px #FFF, 703px 1386px #FFF, 1014px 849px #FFF, 758px 10px #FFF, 1240px 553px #FFF, 1573px 917px #FFF, 580px 1390px #FFF, 1436px 363px #FFF, 1707px 939px #FFF, 917px 1935px #FFF, 351px 1348px #FFF, 1868px 351px #FFF, 72px 44px #FFF, 1756px 809px #FFF, 820px 1267px #FFF, 937px 1399px #FFF, 1532px 1922px #FFF, 1984px 1898px #FFF, 1281px 184px #FFF, 1872px 1737px #FFF, 1271px 1254px #FFF, 1125px 1980px #FFF, 1278px 450px #FFF, 871px 1930px #FFF, 1950px 964px #FFF, 325px 1755px #FFF, 1960px 639px #FFF, 502px 307px #FFF, 1688px 1714px #FFF, 1642px 939px #FFF, 650px 1972px #FFF, 387px 616px #FFF, 330px 1899px #FFF, 1220px 913px #FFF, 1593px 1612px #FFF, 1668px 35px #FFF, 908px 1458px #FFF, 679px 1366px #FFF, 1232px 1528px #FFF, 1809px 690px #FFF, 1424px 23px #FFF, 972px 1460px #FFF, 116px 499px #FFF, 329px 953px #FFF, 338px 1920px #FFF, 104px 227px #FFF, 1710px 1919px #FFF, 1872px 11px #FFF, 1448px 1578px #FFF, 1447px 170px #FFF, 317px 758px #FFF, 1913px 1357px #FFF, 526px 795px #FFF, 86px 1202px #FFF, 1544px 1764px #FFF, 1348px 1282px #FFF, 943px 1119px #FFF, 1325px 246px #FFF, 1553px 1042px #FFF, 148px 800px #FFF, 1391px 1664px #FFF, 949px 310px #FFF, 997px 148px #FFF, 1302px 1057px #FFF, 139px 1161px #FFF, 1691px 1423px #FFF, 1173px 1136px #FFF, 469px 223px #FFF, 349px 1308px #FFF, 1464px 1604px #FFF, 521px 938px #FFF, 824px 569px #FFF, 1064px 1348px #FFF, 384px 1398px #FFF, 603px 1496px #FFF, 625px 213px #FFF, 979px 1756px #FFF, 1645px 1235px #FFF, 893px 1528px #FFF, 18px 735px #FFF, 1750px 704px #FFF, 1661px 497px #FFF, 1212px 14px #FFF, 1750px 1269px #FFF, 690px 542px #FFF, 1988px 1623px #FFF, 1045px 341px #FFF, 1339px 46px #FFF, 1641px 1355px #FFF, 434px 1296px #FFF, 865px 686px #FFF, 1000px 1852px #FFF, 548px 316px #FFF, 1545px 967px #FFF, 1283px 354px #FFF, 1539px 93px #FFF, 708px 1178px #FFF, 558px 1787px #FFF, 1012px 996px #FFF, 898px 1554px #FFF, 170px 1781px #FFF, 253px 1574px #FFF, 229px 1364px #FFF, 1558px 1368px #FFF, 581px 1082px #FFF, 871px 933px #FFF, 814px 171px #FFF, 910px 1687px #FFF, 1039px 780px #FFF, 834px 1862px #FFF, 1919px 582px #FFF, 669px 860px #FFF, 324px 1730px #FFF, 50px 1865px #FFF, 60px 1657px #FFF, 794px 1309px #FFF, 1146px 200px #FFF, 1716px 1884px #FFF, 141px 782px #FFF, 1282px 1526px #FFF, 551px 1474px #FFF, 1255px 372px #FFF, 508px 697px #FFF, 1761px 642px #FFF, 905px 796px #FFF, 688px 1207px #FFF, 525px 164px #FFF, 1700px 419px #FFF, 993px 1658px #FFF, 200px 50px #FFF, 794px 1300px #FFF, 1079px 1229px #FFF, 935px 661px #FFF, 555px 305px #FFF, 130px 279px #FFF, 1075px 1864px #FFF, 304px 900px #FFF, 532px 243px #FFF, 608px 856px #FFF, 1433px 1646px #FFF, 1323px 1632px #FFF, 345px 17px #FFF, 531px 1176px #FFF, 1480px 1597px #FFF, 1870px 447px #FFF, 1574px 1803px #FFF, 1334px 1418px #FFF, 1559px 1689px #FFF, 1593px 1733px #FFF, 1048px 1734px #FFF, 456px 475px #FFF, 186px 1266px #FFF, 182px 720px #FFF, 487px 1818px #FFF, 940px 1653px #FFF, 1340px 710px #FFF, 1322px 1030px #FFF, 1627px 194px #FFF, 719px 543px #FFF, 28px 1504px #FFF, 549px 1776px #FFF, 1177px 1747px #FFF, 797px 1788px #FFF, 231px 1492px #FFF, 1492px 357px #FFF, 81px 167px #FFF, 810px 654px #FFF, 636px 1229px #FFF, 201px 1171px #FFF, 566px 691px #FFF, 225px 1246px #FFF, 1574px 1930px #FFF, 301px 1724px #FFF, 1704px 715px #FFF, 668px 1684px #FFF, 474px 1845px #FFF, 1731px 1592px #FFF, 681px 156px #FFF, 1186px 1221px #FFF, 1491px 529px #FFF, 615px 1923px #FFF, 1235px 637px #FFF, 224px 863px #FFF, 854px 1985px #FFF, 1958px 1763px #FFF, 985px 1804px #FFF, 1212px 1190px #FFF, 525px 383px #FFF, 1662px 1923px #FFF, 1614px 1626px #FFF, 779px 406px #FFF, 1529px 169px #FFF, 1818px 322px #FFF, 1499px 1834px #FFF, 1471px 1532px #FFF, 614px 1941px #FFF, 405px 1178px #FFF, 1709px 1477px #FFF, 396px 1495px #FFF, 691px 603px #FFF, 1513px 375px #FFF, 101px 579px #FFF, 555px 1531px #FFF, 81px 1833px #FFF, 514px 1857px #FFF, 548px 1250px #FFF, 1430px 320px #FFF, 703px 771px #FFF, 725px 1510px #FFF, 390px 819px #FFF, 1508px 95px #FFF, 580px 1835px #FFF, 1456px 1078px #FFF, 1117px 1098px #FFF, 533px 905px #FFF, 9px 955px #FFF, 1207px 672px #FFF, 224px 191px #FFF, 1768px 1712px #FFF, 1792px 930px #FFF, 1943px 1517px #FFF, 1868px 460px #FFF, 1498px 1061px #FFF, 143px 444px #FFF, 1204px 1560px #FFF, 1178px 1944px #FFF, 837px 806px #FFF, 236px 1187px #FFF, 1397px 930px #FFF, 250px 739px #FFF, 1268px 899px #FFF, 1791px 1387px #FFF, 1855px 114px #FFF, 386px 1650px #FFF, 1440px 960px #FFF, 1164px 1292px #FFF, 1047px 1823px #FFF, 845px 1854px #FFF, 1864px 1658px #FFF, 1661px 17px #FFF, 1999px 1110px #FFF, 1120px 1054px #FFF, 317px 805px #FFF, 927px 1309px #FFF, 1540px 1687px #FFF, 897px 533px #FFF, 1615px 1747px #FFF, 824px 1056px #FFF, 1218px 1726px #FFF, 273px 1693px #FFF, 1758px 21px #FFF, 186px 1814px #FFF, 1129px 428px #FFF, 340px 1272px #FFF, 733px 937px #FFF, 690px 604px #FFF, 626px 691px #FFF, 1616px 1358px #FFF, 500px 1745px #FFF, 111px 458px #FFF, 1105px 353px #FFF, 1319px 717px #FFF, 1437px 1709px #FFF, 627px 217px #FFF, 1109px 1061px #FFF, 1812px 1141px #FFF, 1466px 840px #FFF, 431px 857px #FFF, 105px 941px #FFF, 1887px 1323px #FFF, 1893px 504px #FFF, 1438px 500px #FFF, 1652px 270px #FFF, 950px 586px #FFF, 1307px 697px #FFF, 23px 1035px #FFF, 1924px 1210px #FFF, 895px 1852px #FFF, 1671px 1180px #FFF, 1703px 472px #FFF, 217px 1072px #FFF, 1886px 167px #FFF, 1455px 90px #FFF, 59px 1206px #FFF, 330px 380px #FFF, 1954px 375px #FFF, 1218px 1781px #FFF, 1746px 1558px #FFF, 1853px 36px #FFF, 434px 838px #FFF, 1699px 1645px #FFF, 1579px 453px #FFF, 600px 806px #FFF, 1084px 952px #FFF, 340px 512px #FFF, 1557px 47px #FFF, 765px 876px #FFF, 1028px 1474px #FFF, 75px 936px #FFF, 1383px 1400px #FFF, 572px 1047px #FFF, 165px 813px #FFF, 1289px 934px #FFF, 1839px 783px #FFF, 963px 813px #FFF, 1758px 1396px #FFF, 1597px 278px #FFF, 1652px 382px #FFF, 1661px 144px #FFF, 1205px 370px #FFF, 29px 338px #FFF, 1416px 163px #FFF, 262px 1262px #FFF, 1257px 1701px #FFF, 421px 1050px #FFF, 1536px 651px #FFF, 1011px 88px #FFF, 1056px 1137px #FFF, 18px 1761px #FFF, 1572px 626px #FFF, 1275px 245px #FFF, 818px 1029px #FFF, 708px 1564px #FFF, 1489px 1577px #FFF, 1569px 1271px #FFF, 1674px 1492px #FFF, 53px 516px #FFF, 383px 294px #FFF, 1491px 1368px #FFF, 1050px 1426px #FFF, 1000px 1764px #FFF, 1450px 886px #FFF, 1054px 729px #FFF, 310px 148px #FFF, 1220px 533px #FFF, 1674px 163px #FFF, 100px 1112px #FFF, 316px 1154px #FFF, 1065px 1030px #FFF, 839px 261px #FFF, 1031px 1605px #FFF, 1477px 1696px #FFF, 1572px 848px #FFF, 997px 585px #FFF, 694px 792px #FFF, 1754px 1746px #FFF, 1842px 1783px #FFF, 1181px 1812px #FFF, 397px 658px #FFF, 528px 364px #FFF, 246px 1546px #FFF, 1132px 1238px #FFF, 788px 1402px #FFF, 565px 345px #FFF, 1486px 1647px #FFF, 1695px 1539px #FFF, 1128px 1962px #FFF, 900px 553px #FFF, 564px 657px #FFF, 1015px 648px #FFF, 1848px 1683px #FFF, 690px 1010px #FFF, 216px 473px #FFF, 1341px 1028px #FFF, 1011px 530px #FFF, 1445px 1623px #FFF, 1943px 1405px #FFF, 1827px 1732px #FFF, 288px 480px #FFF, 1853px 836px #FFF, 1658px 1212px #FFF, 53px 651px #FFF, 305px 94px #FFF, 1723px 1037px #FFF, 471px 1566px #FFF, 1367px 456px #FFF, 366px 580px #FFF, 1206px 632px #FFF, 1182px 329px #FFF, 1636px 1719px #FFF, 1930px 792px #FFF, 1398px 436px #FFF, 1642px 370px #FFF, 233px 1466px #FFF, 1265px 1553px #FFF, 290px 1818px #FFF, 336px 195px #FFF, 175px 65px #FFF, 301px 151px #FFF, 1007px 1475px #FFF, 549px 708px #FFF, 1873px 1671px #FFF, 1208px 1658px #FFF, 1924px 1511px #FFF, 1561px 1219px #FFF, 527px 765px #FFF, 166px 1664px #FFF, 595px 235px #FFF, 721px 1619px #FFF, 269px 1125px #FFF, 830px 1510px #FFF, 1308px 1084px #FFF, 768px 29px #FFF, 931px 157px #FFF, 1454px 1831px #FFF, 1724px 1155px #FFF, 811px 791px #FFF, 1644px 1997px #FFF, 1794px 1822px #FFF, 1430px 1379px #FFF, 118px 845px #FFF, 228px 70px #FFF, 1708px 882px #FFF, 850px 1779px #FFF, 1764px 1143px #FFF, 675px 1785px #FFF, 227px 253px #FFF, 1508px 991px #FFF, 804px 1312px #FFF, 1352px 452px #FFF, 1889px 86px #FFF, 962px 1059px #FFF, 1561px 1784px #FFF, 1836px 1006px #FFF, 972px 903px #FFF, 1826px 969px #FFF, 1557px 1026px #FFF, 1685px 1912px #FFF, 1055px 1540px #FFF, 1606px 1368px #FFF, 391px 1040px #FFF, 958px 193px #FFF, 1562px 1928px #FFF, 1829px 1767px #FFF, 1003px 1516px #FFF, 1470px 115px #FFF, 320px 1480px #FFF, 1663px 1766px #FFF, 338px 322px #FFF, 42px 761px #FFF, 1592px 1080px #FFF, 1806px 365px #FFF, 1002px 836px #FFF, 1942px 263px #FFF, 9px 282px #FFF, 1947px 915px #FFF, 943px 857px #FFF, 1433px 707px #FFF, 982px 506px #FFF, 1162px 20px #FFF, 1988px 1701px #FFF, 946px 356px #FFF, 1548px 1402px #FFF, 706px 1339px #FFF, 382px 833px #FFF, 1320px 541px #FFF, 1763px 2000px #FFF, 58px 579px #FFF, 328px 1766px #FFF, 904px 1584px #FFF, 1438px 708px #FFF, 728px 1604px #FFF, 261px 1702px #FFF, 1865px 1100px #FFF, 860px 321px #FFF, 1314px 1615px #FFF, 229px 1610px #FFF, 852px 1036px #FFF, 887px 1378px #FFF, 542px 581px #FFF, 459px 193px #FFF, 667px 331px #FFF, 482px 1309px #FFF, 13px 186px #FFF, 1817px 1625px #FFF, 722px 1011px #FFF, 1330px 1897px #FFF, 1109px 625px #FFF, 1517px 86px #FFF, 1967px 1748px #FFF, 1811px 1019px #FFF, 745px 85px #FFF, 1728px 1991px #FFF, 396px 235px #FFF;

  animation: animStar 50s linear infinite;

}

.blocksync-stars:after {

  content: " ";

  position: absolute;

  top: 2000px;

  width: 1px;

  height: 1px;

  background: transparent;

  box-shadow: 821px 1484px #FFF, 1400px 1584px #FFF, 1625px 1521px #FFF, 581px 1020px #FFF, 1306px 511px #FFF, 1315px 602px #FFF, 1279px 295px #FFF, 1366px 176px #FFF, 1655px 1433px #FFF, 477px 505px #FFF, 1034px 1068px #FFF, 597px 1508px #FFF, 1714px 1031px #FFF, 1357px 1903px #FFF, 1383px 799px #FFF, 1601px 1286px #FFF, 1665px 200px #FFF, 1562px 1050px #FFF, 925px 1495px #FFF, 1570px 1745px #FFF, 1298px 1701px #FFF, 903px 953px #FFF, 67px 959px #FFF, 593px 1079px #FFF, 1010px 1139px #FFF, 911px 1105px #FFF, 1642px 861px #FFF, 1777px 1587px #FFF, 1537px 590px #FFF, 437px 145px #FFF, 1210px 1436px #FFF, 1804px 1461px #FFF, 1021px 453px #FFF, 199px 995px #FFF, 1817px 1728px #FFF, 1798px 1229px #FFF, 191px 138px #FFF, 297px 83px #FFF, 1270px 1709px #FFF, 1150px 550px #FFF, 847px 1323px #FFF, 825px 1529px #FFF, 852px 1497px #FFF, 1916px 100px #FFF, 505px 340px #FFF, 1234px 793px #FFF, 1576px 1765px #FFF, 410px 540px #FFF, 901px 1335px #FFF, 459px 1178px #FFF, 629px 1571px #FFF, 1572px 1663px #FFF, 864px 855px #FFF, 133px 1555px #FFF, 1691px 575px #FFF, 964px 696px #FFF, 116px 760px #FFF, 1849px 242px #FFF, 1954px 1365px #FFF, 1677px 247px #FFF, 1349px 1739px #FFF, 140px 696px #FFF, 567px 292px #FFF, 421px 170px #FFF, 48px 1290px #FFF, 360px 390px #FFF, 373px 1357px #FFF, 743px 934px #FFF, 1983px 298px #FFF, 1535px 1599px #FFF, 1680px 1899px #FFF, 677px 645px #FFF, 521px 1750px #FFF, 747px 999px #FFF, 790px 25px #FFF, 1327px 1488px #FFF, 1007px 1432px #FFF, 273px 324px #FFF, 198px 32px #FFF, 1916px 1220px #FFF, 1016px 820px #FFF, 612px 1405px #FFF, 397px 58px #FFF, 1352px 1992px #FFF, 781px 450px #FFF, 550px 1080px #FFF, 150px 328px #FFF, 1534px 761px #FFF, 870px 1813px #FFF, 798px 906px #FFF, 1074px 351px #FFF, 1227px 1235px #FFF, 399px 241px #FFF, 286px 876px #FFF, 1153px 1640px #FFF, 499px 1075px #FFF, 1685px 1546px #FFF, 499px 1311px #FFF, 973px 1218px #FFF, 1074px 352px #FFF, 1142px 800px #FFF, 575px 77px #FFF, 491px 1981px #FFF, 1990px 1402px #FFF, 139px 1676px #FFF, 1063px 143px #FFF, 1788px 693px #FFF, 1554px 1906px #FFF, 690px 549px #FFF, 164px 210px #FFF, 819px 735px #FFF, 1728px 1130px #FFF, 1028px 1315px #FFF, 1929px 700px #FFF, 1539px 714px #FFF, 1229px 766px #FFF, 1444px 641px #FFF, 404px 1339px #FFF, 520px 49px #FFF, 1907px 1967px #FFF, 1567px 1786px #FFF, 65px 903px #FFF, 1194px 751px #FFF, 713px 1053px #FFF, 34px 1644px #FFF, 560px 998px #FFF, 1859px 1183px #FFF, 1562px 631px #FFF, 1956px 1419px #FFF, 1972px 93px #FFF, 66px 1932px #FFF, 1876px 1891px #FFF, 301px 1286px #FFF, 88px 1257px #FFF, 1173px 1962px #FFF, 317px 870px #FFF, 423px 1444px #FFF, 301px 1423px #FFF, 392px 451px #FFF, 389px 459px #FFF, 1524px 1093px #FFF, 413px 1123px #FFF, 994px 19px #FFF, 1446px 1184px #FFF, 942px 1303px #FFF, 1399px 1704px #FFF, 765px 88px #FFF, 436px 1318px #FFF, 804px 1704px #FFF, 1855px 370px #FFF, 77px 1106px #FFF, 503px 794px #FFF, 854px 1978px #FFF, 450px 526px #FFF, 689px 573px #FFF, 1805px 1115px #FFF, 827px 1189px #FFF, 1865px 1791px #FFF, 1165px 17px #FFF, 1910px 541px #FFF, 1497px 1675px #FFF, 1478px 1633px #FFF, 1584px 1827px #FFF, 816px 555px #FFF, 36px 1608px #FFF, 1419px 1242px #FFF, 1452px 1316px #FFF, 1211px 158px #FFF, 682px 1271px #FFF, 1902px 836px #FFF, 1924px 399px #FFF, 358px 1314px #FFF, 1349px 1903px #FFF, 1364px 1370px #FFF, 563px 1360px #FFF, 1423px 124px #FFF, 575px 1065px #FFF, 766px 1659px #FFF, 796px 1883px #FFF, 1363px 1622px #FFF, 1301px 932px #FFF, 884px 720px #FFF, 577px 129px #FFF, 675px 50px #FFF, 1868px 767px #FFF, 519px 905px #FFF, 734px 916px #FFF, 1490px 1104px #FFF, 1514px 619px #FFF, 612px 1433px #FFF, 1356px 873px #FFF, 1005px 202px #FFF, 917px 986px #FFF, 274px 1647px #FFF, 1549px 1904px #FFF, 1761px 1570px #FFF, 267px 166px #FFF, 1659px 1970px #FFF, 883px 1792px #FFF, 35px 524px #FFF, 1404px 1146px #FFF, 648px 682px #FFF, 495px 735px #FFF, 204px 288px #FFF, 235px 139px #FFF, 289px 489px #FFF, 159px 871px #FFF, 1347px 344px #FFF, 1928px 347px #FFF, 573px 1362px #FFF, 1760px 1778px #FFF, 660px 1894px #FFF, 631px 99px #FFF, 1766px 199px #FFF, 1486px 450px #FFF, 1665px 1821px #FFF, 1154px 698px #FFF, 703px 1386px #FFF, 1014px 849px #FFF, 758px 10px #FFF, 1240px 553px #FFF, 1573px 917px #FFF, 580px 1390px #FFF, 1436px 363px #FFF, 1707px 939px #FFF, 917px 1935px #FFF, 351px 1348px #FFF, 1868px 351px #FFF, 72px 44px #FFF, 1756px 809px #FFF, 820px 1267px #FFF, 937px 1399px #FFF, 1532px 1922px #FFF, 1984px 1898px #FFF, 1281px 184px #FFF, 1872px 1737px #FFF, 1271px 1254px #FFF, 1125px 1980px #FFF, 1278px 450px #FFF, 871px 1930px #FFF, 1950px 964px #FFF, 325px 1755px #FFF, 1960px 639px #FFF, 502px 307px #FFF, 1688px 1714px #FFF, 1642px 939px #FFF, 650px 1972px #FFF, 387px 616px #FFF, 330px 1899px #FFF, 1220px 913px #FFF, 1593px 1612px #FFF, 1668px 35px #FFF, 908px 1458px #FFF, 679px 1366px #FFF, 1232px 1528px #FFF, 1809px 690px #FFF, 1424px 23px #FFF, 972px 1460px #FFF, 116px 499px #FFF, 329px 953px #FFF, 338px 1920px #FFF, 104px 227px #FFF, 1710px 1919px #FFF, 1872px 11px #FFF, 1448px 1578px #FFF, 1447px 170px #FFF, 317px 758px #FFF, 1913px 1357px #FFF, 526px 795px #FFF, 86px 1202px #FFF, 1544px 1764px #FFF, 1348px 1282px #FFF, 943px 1119px #FFF, 1325px 246px #FFF, 1553px 1042px #FFF, 148px 800px #FFF, 1391px 1664px #FFF, 949px 310px #FFF, 997px 148px #FFF, 1302px 1057px #FFF, 139px 1161px #FFF, 1691px 1423px #FFF, 1173px 1136px #FFF, 469px 223px #FFF, 349px 1308px #FFF, 1464px 1604px #FFF, 521px 938px #FFF, 824px 569px #FFF, 1064px 1348px #FFF, 384px 1398px #FFF, 603px 1496px #FFF, 625px 213px #FFF, 979px 1756px #FFF, 1645px 1235px #FFF, 893px 1528px #FFF, 18px 735px #FFF, 1750px 704px #FFF, 1661px 497px #FFF, 1212px 14px #FFF, 1750px 1269px #FFF, 690px 542px #FFF, 1988px 1623px #FFF, 1045px 341px #FFF, 1339px 46px #FFF, 1641px 1355px #FFF, 434px 1296px #FFF, 865px 686px #FFF, 1000px 1852px #FFF, 548px 316px #FFF, 1545px 967px #FFF, 1283px 354px #FFF, 1539px 93px #FFF, 708px 1178px #FFF, 558px 1787px #FFF, 1012px 996px #FFF, 898px 1554px #FFF, 170px 1781px #FFF, 253px 1574px #FFF, 229px 1364px #FFF, 1558px 1368px #FFF, 581px 1082px #FFF, 871px 933px #FFF, 814px 171px #FFF, 910px 1687px #FFF, 1039px 780px #FFF, 834px 1862px #FFF, 1919px 582px #FFF, 669px 860px #FFF, 324px 1730px #FFF, 50px 1865px #FFF, 60px 1657px #FFF, 794px 1309px #FFF, 1146px 200px #FFF, 1716px 1884px #FFF, 141px 782px #FFF, 1282px 1526px #FFF, 551px 1474px #FFF, 1255px 372px #FFF, 508px 697px #FFF, 1761px 642px #FFF, 905px 796px #FFF, 688px 1207px #FFF, 525px 164px #FFF, 1700px 419px #FFF, 993px 1658px #FFF, 200px 50px #FFF, 794px 1300px #FFF, 1079px 1229px #FFF, 935px 661px #FFF, 555px 305px #FFF, 130px 279px #FFF, 1075px 1864px #FFF, 304px 900px #FFF, 532px 243px #FFF, 608px 856px #FFF, 1433px 1646px #FFF, 1323px 1632px #FFF, 345px 17px #FFF, 531px 1176px #FFF, 1480px 1597px #FFF, 1870px 447px #FFF, 1574px 1803px #FFF, 1334px 1418px #FFF, 1559px 1689px #FFF, 1593px 1733px #FFF, 1048px 1734px #FFF, 456px 475px #FFF, 186px 1266px #FFF, 182px 720px #FFF, 487px 1818px #FFF, 940px 1653px #FFF, 1340px 710px #FFF, 1322px 1030px #FFF, 1627px 194px #FFF, 719px 543px #FFF, 28px 1504px #FFF, 549px 1776px #FFF, 1177px 1747px #FFF, 797px 1788px #FFF, 231px 1492px #FFF, 1492px 357px #FFF, 81px 167px #FFF, 810px 654px #FFF, 636px 1229px #FFF, 201px 1171px #FFF, 566px 691px #FFF, 225px 1246px #FFF, 1574px 1930px #FFF, 301px 1724px #FFF, 1704px 715px #FFF, 668px 1684px #FFF, 474px 1845px #FFF, 1731px 1592px #FFF, 681px 156px #FFF, 1186px 1221px #FFF, 1491px 529px #FFF, 615px 1923px #FFF, 1235px 637px #FFF, 224px 863px #FFF, 854px 1985px #FFF, 1958px 1763px #FFF, 985px 1804px #FFF, 1212px 1190px #FFF, 525px 383px #FFF, 1662px 1923px #FFF, 1614px 1626px #FFF, 779px 406px #FFF, 1529px 169px #FFF, 1818px 322px #FFF, 1499px 1834px #FFF, 1471px 1532px #FFF, 614px 1941px #FFF, 405px 1178px #FFF, 1709px 1477px #FFF, 396px 1495px #FFF, 691px 603px #FFF, 1513px 375px #FFF, 101px 579px #FFF, 555px 1531px #FFF, 81px 1833px #FFF, 514px 1857px #FFF, 548px 1250px #FFF, 1430px 320px #FFF, 703px 771px #FFF, 725px 1510px #FFF, 390px 819px #FFF, 1508px 95px #FFF, 580px 1835px #FFF, 1456px 1078px #FFF, 1117px 1098px #FFF, 533px 905px #FFF, 9px 955px #FFF, 1207px 672px #FFF, 224px 191px #FFF, 1768px 1712px #FFF, 1792px 930px #FFF, 1943px 1517px #FFF, 1868px 460px #FFF, 1498px 1061px #FFF, 143px 444px #FFF, 1204px 1560px #FFF, 1178px 1944px #FFF, 837px 806px #FFF, 236px 1187px #FFF, 1397px 930px #FFF, 250px 739px #FFF, 1268px 899px #FFF, 1791px 1387px #FFF, 1855px 114px #FFF, 386px 1650px #FFF, 1440px 960px #FFF, 1164px 1292px #FFF, 1047px 1823px #FFF, 845px 1854px #FFF, 1864px 1658px #FFF, 1661px 17px #FFF, 1999px 1110px #FFF, 1120px 1054px #FFF, 317px 805px #FFF, 927px 1309px #FFF, 1540px 1687px #FFF, 897px 533px #FFF, 1615px 1747px #FFF, 824px 1056px #FFF, 1218px 1726px #FFF, 273px 1693px #FFF, 1758px 21px #FFF, 186px 1814px #FFF, 1129px 428px #FFF, 340px 1272px #FFF, 733px 937px #FFF, 690px 604px #FFF, 626px 691px #FFF, 1616px 1358px #FFF, 500px 1745px #FFF, 111px 458px #FFF, 1105px 353px #FFF, 1319px 717px #FFF, 1437px 1709px #FFF, 627px 217px #FFF, 1109px 1061px #FFF, 1812px 1141px #FFF, 1466px 840px #FFF, 431px 857px #FFF, 105px 941px #FFF, 1887px 1323px #FFF, 1893px 504px #FFF, 1438px 500px #FFF, 1652px 270px #FFF, 950px 586px #FFF, 1307px 697px #FFF, 23px 1035px #FFF, 1924px 1210px #FFF, 895px 1852px #FFF, 1671px 1180px #FFF, 1703px 472px #FFF, 217px 1072px #FFF, 1886px 167px #FFF, 1455px 90px #FFF, 59px 1206px #FFF, 330px 380px #FFF, 1954px 375px #FFF, 1218px 1781px #FFF, 1746px 1558px #FFF, 1853px 36px #FFF, 434px 838px #FFF, 1699px 1645px #FFF, 1579px 453px #FFF, 600px 806px #FFF, 1084px 952px #FFF, 340px 512px #FFF, 1557px 47px #FFF, 765px 876px #FFF, 1028px 1474px #FFF, 75px 936px #FFF, 1383px 1400px #FFF, 572px 1047px #FFF, 165px 813px #FFF, 1289px 934px #FFF, 1839px 783px #FFF, 963px 813px #FFF, 1758px 1396px #FFF, 1597px 278px #FFF, 1652px 382px #FFF, 1661px 144px #FFF, 1205px 370px #FFF, 29px 338px #FFF, 1416px 163px #FFF, 262px 1262px #FFF, 1257px 1701px #FFF, 421px 1050px #FFF, 1536px 651px #FFF, 1011px 88px #FFF, 1056px 1137px #FFF, 18px 1761px #FFF, 1572px 626px #FFF, 1275px 245px #FFF, 818px 1029px #FFF, 708px 1564px #FFF, 1489px 1577px #FFF, 1569px 1271px #FFF, 1674px 1492px #FFF, 53px 516px #FFF, 383px 294px #FFF, 1491px 1368px #FFF, 1050px 1426px #FFF, 1000px 1764px #FFF, 1450px 886px #FFF, 1054px 729px #FFF, 310px 148px #FFF, 1220px 533px #FFF, 1674px 163px #FFF, 100px 1112px #FFF, 316px 1154px #FFF, 1065px 1030px #FFF, 839px 261px #FFF, 1031px 1605px #FFF, 1477px 1696px #FFF, 1572px 848px #FFF, 997px 585px #FFF, 694px 792px #FFF, 1754px 1746px #FFF, 1842px 1783px #FFF, 1181px 1812px #FFF, 397px 658px #FFF, 528px 364px #FFF, 246px 1546px #FFF, 1132px 1238px #FFF, 788px 1402px #FFF, 565px 345px #FFF, 1486px 1647px #FFF, 1695px 1539px #FFF, 1128px 1962px #FFF, 900px 553px #FFF, 564px 657px #FFF, 1015px 648px #FFF, 1848px 1683px #FFF, 690px 1010px #FFF, 216px 473px #FFF, 1341px 1028px #FFF, 1011px 530px #FFF, 1445px 1623px #FFF, 1943px 1405px #FFF, 1827px 1732px #FFF, 288px 480px #FFF, 1853px 836px #FFF, 1658px 1212px #FFF, 53px 651px #FFF, 305px 94px #FFF, 1723px 1037px #FFF, 471px 1566px #FFF, 1367px 456px #FFF, 366px 580px #FFF, 1206px 632px #FFF, 1182px 329px #FFF, 1636px 1719px #FFF, 1930px 792px #FFF, 1398px 436px #FFF, 1642px 370px #FFF, 233px 1466px #FFF, 1265px 1553px #FFF, 290px 1818px #FFF, 336px 195px #FFF, 175px 65px #FFF, 301px 151px #FFF, 1007px 1475px #FFF, 549px 708px #FFF, 1873px 1671px #FFF, 1208px 1658px #FFF, 1924px 1511px #FFF, 1561px 1219px #FFF, 527px 765px #FFF, 166px 1664px #FFF, 595px 235px #FFF, 721px 1619px #FFF, 269px 1125px #FFF, 830px 1510px #FFF, 1308px 1084px #FFF, 768px 29px #FFF, 931px 157px #FFF, 1454px 1831px #FFF, 1724px 1155px #FFF, 811px 791px #FFF, 1644px 1997px #FFF, 1794px 1822px #FFF, 1430px 1379px #FFF, 118px 845px #FFF, 228px 70px #FFF, 1708px 882px #FFF, 850px 1779px #FFF, 1764px 1143px #FFF, 675px 1785px #FFF, 227px 253px #FFF, 1508px 991px #FFF, 804px 1312px #FFF, 1352px 452px #FFF, 1889px 86px #FFF, 962px 1059px #FFF, 1561px 1784px #FFF, 1836px 1006px #FFF, 972px 903px #FFF, 1826px 969px #FFF, 1557px 1026px #FFF, 1685px 1912px #FFF, 1055px 1540px #FFF, 1606px 1368px #FFF, 391px 1040px #FFF, 958px 193px #FFF, 1562px 1928px #FFF, 1829px 1767px #FFF, 1003px 1516px #FFF, 1470px 115px #FFF, 320px 1480px #FFF, 1663px 1766px #FFF, 338px 322px #FFF, 42px 761px #FFF, 1592px 1080px #FFF, 1806px 365px #FFF, 1002px 836px #FFF, 1942px 263px #FFF, 9px 282px #FFF, 1947px 915px #FFF, 943px 857px #FFF, 1433px 707px #FFF, 982px 506px #FFF, 1162px 20px #FFF, 1988px 1701px #FFF, 946px 356px #FFF, 1548px 1402px #FFF, 706px 1339px #FFF, 382px 833px #FFF, 1320px 541px #FFF, 1763px 2000px #FFF, 58px 579px #FFF, 328px 1766px #FFF, 904px 1584px #FFF, 1438px 708px #FFF, 728px 1604px #FFF, 261px 1702px #FFF, 1865px 1100px #FFF, 860px 321px #FFF, 1314px 1615px #FFF, 229px 1610px #FFF, 852px 1036px #FFF, 887px 1378px #FFF, 542px 581px #FFF, 459px 193px #FFF, 667px 331px #FFF, 482px 1309px #FFF, 13px 186px #FFF, 1817px 1625px #FFF, 722px 1011px #FFF, 1330px 1897px #FFF, 1109px 625px #FFF, 1517px 86px #FFF, 1967px 1748px #FFF, 1811px 1019px #FFF, 745px 85px #FFF, 1728px 1991px #FFF, 396px 235px #FFF;

}



.blocksync-stars2 {

  width: 2px;

  height: 2px;

  background: transparent;

  box-shadow: 271px 118px #FFF, 557px 601px #FFF, 1445px 681px #FFF, 1275px 944px #FFF, 514px 13px #FFF, 527px 1326px #FFF, 1290px 1920px #FFF, 631px 1967px #FFF, 1015px 1316px #FFF, 280px 1993px #FFF, 1693px 767px #FFF, 892px 1856px #FFF, 1315px 893px #FFF, 126px 1743px #FFF, 351px 609px #FFF, 1588px 1953px #FFF, 1914px 1529px #FFF, 236px 1607px #FFF, 251px 1881px #FFF, 218px 1538px #FFF, 1300px 430px #FFF, 1572px 1775px #FFF, 897px 475px #FFF, 1453px 916px #FFF, 1328px 1560px #FFF, 1952px 707px #FFF, 834px 129px #FFF, 656px 1734px #FFF, 292px 285px #FFF, 73px 488px #FFF, 1225px 501px #FFF, 1882px 466px #FFF, 1117px 422px #FFF, 1061px 726px #FFF, 1386px 196px #FFF, 725px 1802px #FFF, 1671px 936px #FFF, 1562px 1714px #FFF, 1220px 1147px #FFF, 1596px 1138px #FFF, 661px 1763px #FFF, 1150px 63px #FFF, 927px 647px #FFF, 269px 1404px #FFF, 702px 511px #FFF, 139px 1246px #FFF, 1465px 796px #FFF, 1646px 1799px #FFF, 1224px 359px #FFF, 1746px 816px #FFF, 1138px 420px #FFF, 923px 1097px #FFF, 2px 137px #FFF, 693px 675px #FFF, 1624px 841px #FFF, 1097px 1371px #FFF, 527px 251px #FFF, 1276px 239px #FFF, 152px 76px #FFF, 1310px 1371px #FFF, 870px 1857px #FFF, 395px 351px #FFF, 1197px 1925px #FFF, 229px 270px #FFF, 974px 654px #FFF, 260px 81px #FFF, 1217px 1411px #FFF, 1835px 214px #FFF, 790px 951px #FFF, 1299px 1999px #FFF, 1882px 1858px #FFF, 676px 647px #FFF, 1686px 1262px #FFF, 1492px 1820px #FFF, 1683px 402px #FFF, 422px 1913px #FFF, 219px 381px #FFF, 197px 1224px #FFF, 133px 1809px #FFF, 542px 1424px #FFF, 152px 1063px #FFF, 1398px 635px #FFF, 365px 1044px #FFF, 298px 1438px #FFF, 268px 336px #FFF, 895px 801px #FFF, 1726px 1794px #FFF, 171px 642px #FFF, 427px 1749px #FFF, 759px 1311px #FFF, 1850px 1565px #FFF, 727px 1718px #FFF, 1443px 489px #FFF, 1586px 2000px #FFF, 1623px 1009px #FFF, 944px 288px #FFF, 1963px 312px #FFF, 1808px 1785px #FFF, 1278px 1874px #FFF, 1279px 213px #FFF, 816px 1713px #FFF, 1176px 313px #FFF, 1179px 1139px #FFF, 315px 921px #FFF, 1286px 631px #FFF, 1379px 1777px #FFF, 844px 1180px #FFF, 1444px 1184px #FFF, 1039px 1723px #FFF, 1199px 838px #FFF, 107px 296px #FFF, 1108px 518px #FFF, 1632px 830px #FFF, 705px 896px #FFF, 1589px 1455px #FFF, 47px 1932px #FFF, 797px 1554px #FFF, 571px 1088px #FFF, 529px 1097px #FFF, 110px 1084px #FFF, 61px 551px #FFF, 1833px 1602px #FFF, 1383px 1813px #FFF, 1270px 1380px #FFF, 42px 1258px #FFF, 1362px 1022px #FFF, 916px 1460px #FFF, 38px 1102px #FFF, 975px 86px #FFF, 224px 563px #FFF, 235px 204px #FFF, 135px 1812px #FFF, 593px 1640px #FFF, 1650px 911px #FFF, 221px 1027px #FFF, 1909px 1577px #FFF, 411px 752px #FFF, 1715px 791px #FFF, 1039px 1329px #FFF, 1675px 1180px #FFF, 1836px 1344px #FFF, 947px 650px #FFF, 1158px 1341px #FFF, 798px 602px #FFF, 268px 883px #FFF, 1460px 1489px #FFF, 1000px 269px #FFF, 441px 1982px #FFF, 1111px 680px #FFF, 1421px 164px #FFF, 317px 709px #FFF, 178px 821px #FFF, 1587px 1315px #FFF, 1251px 860px #FFF, 1737px 289px #FFF, 186px 1847px #FFF, 1133px 717px #FFF, 1581px 1271px #FFF, 396px 547px #FFF, 138px 1190px #FFF, 1108px 148px #FFF, 1703px 425px #FFF, 636px 1271px #FFF, 198px 833px #FFF, 942px 1737px #FFF, 814px 1142px #FFF, 708px 807px #FFF, 651px 376px #FFF, 4px 311px #FFF, 546px 1806px #FFF, 1591px 574px #FFF, 221px 1378px #FFF, 858px 1602px #FFF, 1820px 766px #FFF, 1784px 597px #FFF, 190px 633px #FFF, 1227px 1128px #FFF, 1104px 1219px #FFF, 352px 556px #FFF, 402px 1397px #FFF, 1489px 1087px #FFF, 843px 201px #FFF, 1381px 666px #FFF, 1766px 367px #FFF, 771px 670px #FFF, 1495px 1140px #FFF, 836px 1471px #FFF, 471px 1937px #FFF, 1419px 819px #FFF, 1991px 602px #FFF, 282px 1110px #FFF, 1535px 1948px #FFF, 49px 542px #FFF, 596px 1574px #FFF, 1686px 663px #FFF, 1332px 1686px #FFF, 1822px 411px #FFF, 1534px 1889px #FFF, 1045px 1319px #FFF, 258px 700px #FFF;

  animation: animStar 100s linear infinite;

}

.blocksync-stars2:after {

  content: " ";

  position: absolute;

  top: 2000px;

  width: 2px;

  height: 2px;

  background: transparent;

  box-shadow: 271px 118px #FFF, 557px 601px #FFF, 1445px 681px #FFF, 1275px 944px #FFF, 514px 13px #FFF, 527px 1326px #FFF, 1290px 1920px #FFF, 631px 1967px #FFF, 1015px 1316px #FFF, 280px 1993px #FFF, 1693px 767px #FFF, 892px 1856px #FFF, 1315px 893px #FFF, 126px 1743px #FFF, 351px 609px #FFF, 1588px 1953px #FFF, 1914px 1529px #FFF, 236px 1607px #FFF, 251px 1881px #FFF, 218px 1538px #FFF, 1300px 430px #FFF, 1572px 1775px #FFF, 897px 475px #FFF, 1453px 916px #FFF, 1328px 1560px #FFF, 1952px 707px #FFF, 834px 129px #FFF, 656px 1734px #FFF, 292px 285px #FFF, 73px 488px #FFF, 1225px 501px #FFF, 1882px 466px #FFF, 1117px 422px #FFF, 1061px 726px #FFF, 1386px 196px #FFF, 725px 1802px #FFF, 1671px 936px #FFF, 1562px 1714px #FFF, 1220px 1147px #FFF, 1596px 1138px #FFF, 661px 1763px #FFF, 1150px 63px #FFF, 927px 647px #FFF, 269px 1404px #FFF, 702px 511px #FFF, 139px 1246px #FFF, 1465px 796px #FFF, 1646px 1799px #FFF, 1224px 359px #FFF, 1746px 816px #FFF, 1138px 420px #FFF, 923px 1097px #FFF, 2px 137px #FFF, 693px 675px #FFF, 1624px 841px #FFF, 1097px 1371px #FFF, 527px 251px #FFF, 1276px 239px #FFF, 152px 76px #FFF, 1310px 1371px #FFF, 870px 1857px #FFF, 395px 351px #FFF, 1197px 1925px #FFF, 229px 270px #FFF, 974px 654px #FFF, 260px 81px #FFF, 1217px 1411px #FFF, 1835px 214px #FFF, 790px 951px #FFF, 1299px 1999px #FFF, 1882px 1858px #FFF, 676px 647px #FFF, 1686px 1262px #FFF, 1492px 1820px #FFF, 1683px 402px #FFF, 422px 1913px #FFF, 219px 381px #FFF, 197px 1224px #FFF, 133px 1809px #FFF, 542px 1424px #FFF, 152px 1063px #FFF, 1398px 635px #FFF, 365px 1044px #FFF, 298px 1438px #FFF, 268px 336px #FFF, 895px 801px #FFF, 1726px 1794px #FFF, 171px 642px #FFF, 427px 1749px #FFF, 759px 1311px #FFF, 1850px 1565px #FFF, 727px 1718px #FFF, 1443px 489px #FFF, 1586px 2000px #FFF, 1623px 1009px #FFF, 944px 288px #FFF, 1963px 312px #FFF, 1808px 1785px #FFF, 1278px 1874px #FFF, 1279px 213px #FFF, 816px 1713px #FFF, 1176px 313px #FFF, 1179px 1139px #FFF, 315px 921px #FFF, 1286px 631px #FFF, 1379px 1777px #FFF, 844px 1180px #FFF, 1444px 1184px #FFF, 1039px 1723px #FFF, 1199px 838px #FFF, 107px 296px #FFF, 1108px 518px #FFF, 1632px 830px #FFF, 705px 896px #FFF, 1589px 1455px #FFF, 47px 1932px #FFF, 797px 1554px #FFF, 571px 1088px #FFF, 529px 1097px #FFF, 110px 1084px #FFF, 61px 551px #FFF, 1833px 1602px #FFF, 1383px 1813px #FFF, 1270px 1380px #FFF, 42px 1258px #FFF, 1362px 1022px #FFF, 916px 1460px #FFF, 38px 1102px #FFF, 975px 86px #FFF, 224px 563px #FFF, 235px 204px #FFF, 135px 1812px #FFF, 593px 1640px #FFF, 1650px 911px #FFF, 221px 1027px #FFF, 1909px 1577px #FFF, 411px 752px #FFF, 1715px 791px #FFF, 1039px 1329px #FFF, 1675px 1180px #FFF, 1836px 1344px #FFF, 947px 650px #FFF, 1158px 1341px #FFF, 798px 602px #FFF, 268px 883px #FFF, 1460px 1489px #FFF, 1000px 269px #FFF, 441px 1982px #FFF, 1111px 680px #FFF, 1421px 164px #FFF, 317px 709px #FFF, 178px 821px #FFF, 1587px 1315px #FFF, 1251px 860px #FFF, 1737px 289px #FFF, 186px 1847px #FFF, 1133px 717px #FFF, 1581px 1271px #FFF, 396px 547px #FFF, 138px 1190px #FFF, 1108px 148px #FFF, 1703px 425px #FFF, 636px 1271px #FFF, 198px 833px #FFF, 942px 1737px #FFF, 814px 1142px #FFF, 708px 807px #FFF, 651px 376px #FFF, 4px 311px #FFF, 546px 1806px #FFF, 1591px 574px #FFF, 221px 1378px #FFF, 858px 1602px #FFF, 1820px 766px #FFF, 1784px 597px #FFF, 190px 633px #FFF, 1227px 1128px #FFF, 1104px 1219px #FFF, 352px 556px #FFF, 402px 1397px #FFF, 1489px 1087px #FFF, 843px 201px #FFF, 1381px 666px #FFF, 1766px 367px #FFF, 771px 670px #FFF, 1495px 1140px #FFF, 836px 1471px #FFF, 471px 1937px #FFF, 1419px 819px #FFF, 1991px 602px #FFF, 282px 1110px #FFF, 1535px 1948px #FFF, 49px 542px #FFF, 596px 1574px #FFF, 1686px 663px #FFF, 1332px 1686px #FFF, 1822px 411px #FFF, 1534px 1889px #FFF, 1045px 1319px #FFF, 258px 700px #FFF;

}



.blocksync-stars3 {

  width: 3px;

  height: 3px;

  background: transparent;

  box-shadow: 1241px 318px #FFF, 1932px 2px #FFF, 1385px 846px #FFF, 814px 1772px #FFF, 1326px 1238px #FFF, 1537px 264px #FFF, 960px 283px #FFF, 1216px 1676px #FFF, 1916px 517px #FFF, 1478px 57px #FFF, 1538px 1177px #FFF, 1551px 1363px #FFF, 561px 513px #FFF, 468px 1877px #FFF, 1564px 1338px #FFF, 1742px 382px #FFF, 1954px 1408px #FFF, 527px 253px #FFF, 1432px 48px #FFF, 981px 1879px #FFF, 1739px 594px #FFF, 283px 429px #FFF, 1283px 1235px #FFF, 828px 86px #FFF, 1490px 357px #FFF, 1479px 1914px #FFF, 821px 1579px #FFF, 268px 1057px #FFF, 1475px 703px #FFF, 1336px 1472px #FFF, 1418px 363px #FFF, 1615px 1533px #FFF, 633px 705px #FFF, 1807px 1665px #FFF, 433px 1409px #FFF, 567px 1937px #FFF, 196px 980px #FFF, 1172px 1998px #FFF, 136px 957px #FFF, 1095px 1878px #FFF, 789px 174px #FFF, 1346px 230px #FFF, 896px 307px #FFF, 1388px 698px #FFF, 911px 143px #FFF, 1979px 1131px #FFF, 1318px 848px #FFF, 1311px 425px #FFF, 1177px 1181px #FFF, 211px 513px #FFF, 354px 1461px #FFF, 203px 687px #FFF, 575px 1003px #FFF, 300px 1266px #FFF, 1813px 489px #FFF, 1289px 539px #FFF, 959px 436px #FFF, 60px 250px #FFF, 944px 1827px #FFF, 1060px 808px #FFF, 709px 1277px #FFF, 354px 957px #FFF, 1843px 1037px #FFF, 743px 326px #FFF, 1666px 1307px #FFF, 1522px 1095px #FFF, 1269px 380px #FFF, 1507px 170px #FFF, 1506px 1678px #FFF, 1707px 351px #FFF, 701px 1098px #FFF, 1200px 1759px #FFF, 195px 1214px #FFF, 1289px 709px #FFF, 1159px 894px #FFF, 174px 859px #FFF, 656px 944px #FFF, 1610px 1237px #FFF, 1391px 862px #FFF, 1770px 965px #FFF, 420px 370px #FFF, 922px 1045px #FFF, 994px 1573px #FFF, 1117px 339px #FFF, 1118px 1602px #FFF, 1087px 1241px #FFF, 1598px 1133px #FFF, 825px 1946px #FFF, 41px 1389px #FFF, 1124px 1047px #FFF, 35px 751px #FFF, 1076px 1693px #FFF, 969px 732px #FFF, 428px 1507px #FFF, 1131px 1424px #FFF, 1878px 1540px #FFF, 761px 1625px #FFF, 700px 1981px #FFF, 1716px 1709px #FFF, 604px 1324px #FFF;

  animation: animStar 150s linear infinite;

}

.blocksync-stars3:after {

  content: " ";

  position: absolute;

  top: 2000px;

  width: 3px;

  height: 3px;

  background: transparent;

  box-shadow: 1241px 318px #FFF, 1932px 2px #FFF, 1385px 846px #FFF, 814px 1772px #FFF, 1326px 1238px #FFF, 1537px 264px #FFF, 960px 283px #FFF, 1216px 1676px #FFF, 1916px 517px #FFF, 1478px 57px #FFF, 1538px 1177px #FFF, 1551px 1363px #FFF, 561px 513px #FFF, 468px 1877px #FFF, 1564px 1338px #FFF, 1742px 382px #FFF, 1954px 1408px #FFF, 527px 253px #FFF, 1432px 48px #FFF, 981px 1879px #FFF, 1739px 594px #FFF, 283px 429px #FFF, 1283px 1235px #FFF, 828px 86px #FFF, 1490px 357px #FFF, 1479px 1914px #FFF, 821px 1579px #FFF, 268px 1057px #FFF, 1475px 703px #FFF, 1336px 1472px #FFF, 1418px 363px #FFF, 1615px 1533px #FFF, 633px 705px #FFF, 1807px 1665px #FFF, 433px 1409px #FFF, 567px 1937px #FFF, 196px 980px #FFF, 1172px 1998px #FFF, 136px 957px #FFF, 1095px 1878px #FFF, 789px 174px #FFF, 1346px 230px #FFF, 896px 307px #FFF, 1388px 698px #FFF, 911px 143px #FFF, 1979px 1131px #FFF, 1318px 848px #FFF, 1311px 425px #FFF, 1177px 1181px #FFF, 211px 513px #FFF, 354px 1461px #FFF, 203px 687px #FFF, 575px 1003px #FFF, 300px 1266px #FFF, 1813px 489px #FFF, 1289px 539px #FFF, 959px 436px #FFF, 60px 250px #FFF, 944px 1827px #FFF, 1060px 808px #FFF, 709px 1277px #FFF, 354px 957px #FFF, 1843px 1037px #FFF, 743px 326px #FFF, 1666px 1307px #FFF, 1522px 1095px #FFF, 1269px 380px #FFF, 1507px 170px #FFF, 1506px 1678px #FFF, 1707px 351px #FFF, 701px 1098px #FFF, 1200px 1759px #FFF, 195px 1214px #FFF, 1289px 709px #FFF, 1159px 894px #FFF, 174px 859px #FFF, 656px 944px #FFF, 1610px 1237px #FFF, 1391px 862px #FFF, 1770px 965px #FFF, 420px 370px #FFF, 922px 1045px #FFF, 994px 1573px #FFF, 1117px 339px #FFF, 1118px 1602px #FFF, 1087px 1241px #FFF, 1598px 1133px #FFF, 825px 1946px #FFF, 41px 1389px #FFF, 1124px 1047px #FFF, 35px 751px #FFF, 1076px 1693px #FFF, 969px 732px #FFF, 428px 1507px #FFF, 1131px 1424px #FFF, 1878px 1540px #FFF, 761px 1625px #FFF, 700px 1981px #FFF, 1716px 1709px #FFF, 604px 1324px #FFF;

}



@keyframes animStar {

  from {

    transform: translateY(0px);

  }

  to {

    transform: translateY(-2000px);

  }

}

.tmp-banner-one-area.add-pattern {

  position: relative;

}

.tmp-banner-one-area.add-pattern .slider-bg-light {

  position: absolute;

  right: 3%;

  top: 0;

  min-width: 300px;

  z-index: -1;

  transform: scaleX(-1);

}

@media only screen and (max-width: 767px) {

  .tmp-banner-one-area.add-pattern .slider-bg-light {

    right: 10%;

    min-width: none;

  }

}

@media only screen and (max-width: 479px) {

  .tmp-banner-one-area.add-pattern .slider-bg-light {

    right: 5%;

  }

}

@media screen and (min-width: 2500px) {

  .tmp-banner-one-area.add-pattern .slider-bg-light {

    right: 10%;

    transform: translateX(-50%);

  }

}

.tmp-banner-one-area.add-pattern .slider-bg-dot-shape {

  position: absolute;

  right: 10%;

  top: -28px;

  z-index: -1;

}



.rpp-banner-two-area {

  position: relative;

}

.rpp-banner-two-area .slider-bg-light {

  position: absolute;

  right: 3%;

  top: 0;

  min-width: 300px;

  z-index: -1;

  transform: scaleX(-1);

}

@media only screen and (max-width: 767px) {

  .rpp-banner-two-area .slider-bg-light {

    right: 10%;

    min-width: none;

  }

}

@media only screen and (max-width: 479px) {

  .rpp-banner-two-area .slider-bg-light {

    right: 5%;

  }

}

@media screen and (min-width: 2500px) {

  .rpp-banner-two-area .slider-bg-light {

    right: 10%;

    transform: translateX(-50%);

  }

}

.rpp-banner-two-area .slider-bg-dot-shape {

  position: absolute;

  right: 10%;

  top: -28px;

  z-index: -1;

}



.banner-with-stars-10 {

  position: relative;

  z-index: 1;

}

.banner-with-stars-10 .slider-bg-light {

  position: absolute;

  right: -7%;

  top: 0;

  min-width: 300px;

  z-index: -1;

  transform: scaleX(-1);

}

@media only screen and (max-width: 767px) {

  .banner-with-stars-10 .slider-bg-light {

    right: 0%;

    min-width: none;

  }

}

@media only screen and (max-width: 479px) {

  .banner-with-stars-10 .slider-bg-light {

    right: 0%;

  }

}

@media screen and (min-width: 2500px) {

  .banner-with-stars-10 .slider-bg-light {

    right: 0%;

    transform: translateX(-50%);

  }

}

.banner-with-stars-10 .slider-bg-dot-shape {

  position: absolute;

  right: 0%;

  top: -28px;

  z-index: -1;

}



.breadcrumb-top-stars-wrapper {

  position: relative;

}

.breadcrumb-top-stars-wrapper .slider-bg-light {

  position: absolute;

  right: 3%;

  top: 0;

  min-width: 300px;

  z-index: 10;

  transform: scaleX(-1);

  pointer-events: none;

}

@media only screen and (max-width: 767px) {

  .breadcrumb-top-stars-wrapper .slider-bg-light {

    right: 10%;

    min-width: none;

  }

}

@media only screen and (max-width: 479px) {

  .breadcrumb-top-stars-wrapper .slider-bg-light {

    right: 5%;

  }

}

@media screen and (min-width: 2500px) {

  .breadcrumb-top-stars-wrapper .slider-bg-light {

    right: 10%;

    transform: translateX(-50%);

  }

}

.breadcrumb-top-stars-wrapper .slider-bg-dot-shape {

  position: absolute;

  right: 10%;

  top: -28px;

  z-index: 10;

  pointer-events: none;

}



.footer-stars-animation-wrapper-footer {

  position: relative;

  z-index: 1;

  overflow: hidden;

}

.footer-stars-animation-wrapper-footer .slider-bg-light {

  position: absolute;

  right: 0%;

  top: 0;

  min-width: 300px;

  z-index: 1;

  transform: scaleX(-1);

  pointer-events: none;

}

@media only screen and (max-width: 767px) {

  .footer-stars-animation-wrapper-footer .slider-bg-light {

    right: 0%;

    min-width: none;

  }

}

@media only screen and (max-width: 479px) {

  .footer-stars-animation-wrapper-footer .slider-bg-light {

    right: 0%;

  }

}

@media screen and (min-width: 2500px) {

  .footer-stars-animation-wrapper-footer .slider-bg-light {

    right: 0%;

    transform: translateX(-50%);

  }

}

.footer-stars-animation-wrapper-footer .slider-bg-dot-shape {

  position: absolute;

  right: 10%;

  top: -28px;

  z-index: 1;

  pointer-events: none;

}



.footer-stars-animation-wrapper-footer-two {

  position: relative;

  z-index: 1;

  overflow: hidden;

}

.footer-stars-animation-wrapper-footer-two .slider-bg-light {

  position: absolute;

  left: 0%;

  top: 0;

  min-width: 300px;

  z-index: 1;

  pointer-events: none;

}

@media only screen and (max-width: 767px) {

  .footer-stars-animation-wrapper-footer-two .slider-bg-light {

    left: 0%;

    min-width: none;

  }

}

@media only screen and (max-width: 479px) {

  .footer-stars-animation-wrapper-footer-two .slider-bg-light {

    left: 0%;

  }

}

@media screen and (min-width: 2500px) {

  .footer-stars-animation-wrapper-footer-two .slider-bg-light {

    left: 0%;

    transform: translateX(-50%);

  }

}

.footer-stars-animation-wrapper-footer-two .slider-bg-dot-shape {

  position: absolute;

  left: 15%;

  top: -28px;

  z-index: 1;

  pointer-events: none;

}



/*----Bentogrid Demos Css ----*/

.header-area-bentogrid {

  width: 100%;

  z-index: 99;

  position: sticky;

  top: 0;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .header-area-bentogrid {

    position: fixed;

    bottom: 0;

    top: auto;

  }

}

@media only screen and (max-width: 767px) {

  .header-area-bentogrid {

    position: fixed;

    bottom: 0;

    top: auto;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .header-area-bentogrid .logo {

    display: none;

  }

}

@media only screen and (max-width: 767px) {

  .header-area-bentogrid .logo {

    display: none;

  }

}

@media only screen and (max-width: 1199px) {

  .header-area-bentogrid .header-right-info {

    display: none !important;

  }

}



.header-area-bentogrid .menu-container {

  background-color: var(--color-card);

  padding: 10px 10px 10px 24px;

  display: flex;

  width: 100%;

  align-items: center;

  gap: 15px;

  box-shadow: 0 1px 2px 0 rgba(26, 31, 44, 0.25);

  border-radius: 8px;

  border: 2px solid var(--color-border);

  z-index: 5;

}

@media only screen and (max-width: 575px) {

  .header-area-bentogrid .menu-container {

    padding: 5px 0px 5px 0px;

  }

}

.header-area-bentogrid .menu-container .tmp-light {

  z-index: 1 !important;

}



.header-area-bentogrid .container .navbar-main {

  display: inline-flex;

  gap: 12px;

  align-items: center;

}



.header-area-bentogrid .container .navbar-brand {

  display: inline-flex;

  gap: 12px;

  align-items: center;

}



.header-area-bentogrid .container .navbar-brand .logo-icon {

  fill: var(--black);

}



.header-area-bentogrid .container .navbar-brand span {

  font-size: 24px;

  font-weight: 600;

  line-height: 1em;

  color: var(--black);

}



.header-area-bentogrid .container .navbar-brand span.primary {

  color: var(--color-primary);

}



.header-area-bentogrid .navbar {

  padding: 0;

}



.header-area-bentogrid .navbar-expand-lg .navbar-info {

  display: block !important;

}



.header-area-bentogrid .navbar-expand-lg .navbar-info .nav-link {

  padding: 0;

}



.header-area-bentogrid .navbar-info {

  margin: -5px;

}



.header-area-bentogrid .navbar-info .nav-item {

  position: relative;

  display: inline-block;

  margin: 5px;

}



.header-area-bentogrid .navbar-info .nav-link {

  color: var(--color-heading);

  font-size: 16px;

  font-weight: 700;

  line-height: 120%;

  display: flex;

  align-items: center;

  padding: 10px 12px !important;

  border-radius: 8px;

  border: none;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .header-area-bentogrid .navbar-info .nav-link {

    padding: 5px 4px !important;

  }

}

@media only screen and (max-width: 767px) {

  .header-area-bentogrid .navbar-info .nav-link {

    padding: 5px 4px !important;

  }

}

.header-area-bentogrid .navbar-info .nav-link.active {

  color: #fff;

  background-color: var(--color-primary);

  border: none;

}



.header-area-bentogrid .navbar-info .nav-link .nav-icon {

  stroke: #fff;

  width: 17px;

  height: 17px;

  margin-right: 6px;

  transition: 0.3s;

  opacity: 1;

}



.header-area-bentogrid .navbar-info .nav-link.active .nav-icon {

  stroke: #fff;

}



.header-area-bentogrid .navbar-info .nav-item:hover .nav-link {

  background-color: var(--color-primary);

  border: none;

}

.header-area-bentogrid .navbar-info .nav-item:hover .nav-link[aria-selected=true] {

  background-color: var(--color-primary);

  border: none;

}



.header-area-bentogrid .navbar-info .nav-item:hover .nav-link .nav-icon {

  stroke: #fff;

}



.header-area-bentogrid .header-right-info .theme-control-btn {

  background-color: transparent;

  border: 0;

}



.header-area-bentogrid .header-right-info .theme-control-btn span {

  width: 40px;

  height: 40px;

  border-radius: 5px;

  background-color: transparent;

  display: flex;

  justify-content: center;

  align-items: center;

  transition: 0.3s;

}



#tmp-page-content-bento {

  padding: 24px 0 24px 0;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  #tmp-page-content-bento {

    padding: 24px 0 100px 0;

  }

}

@media only screen and (max-width: 767px) {

  #tmp-page-content-bento {

    padding: 24px 0 100px 0;

  }

}

@media only screen and (max-width: 575px) {

  #tmp-page-content-bento {

    padding: 24px 0 140px 0;

  }

}

#tmp-page-content-bento .personal-portfolio-right-inner-wrapper .section-header h1 {

  font-size: 46px;

}

#tmp-page-content-bento .no-radius .progress {

  border-radius: 4px;

  height: 10px;

}

#tmp-page-content-bento .experience-style-list .experience-list .resume-single-list {

  margin-top: 30px;

  position: sticky;

  top: 100px;

}

#tmp-page-content-bento .experience-list.animation-action-2 {

  height: 100%;

}



.btn-copy {

  position: relative;

  z-index: 1;

  overflow: visible !important;

}



.btn-copy::before {

  position: absolute;

  content: "Copied to clipboard";

  background-color: #363636;

  font-size: 12px;

  font-weight: 600;

  color: #fff;

  border-radius: 5px;

  padding: 4px 12px;

  line-height: 14px;

  white-space: nowrap;

  top: -28px;

  left: 50%;

  transform: translateX(-50%);

  display: none;

}



.btn-copy.active::before {

  display: block !important;

}



.tmp-profile-card {

  border: 0;

  background-color: #010d16;

  box-shadow: 0 1px 2px 0 rgba(26, 31, 44, 0.25);

  border-radius: 8px;

  height: 100%;

}

.tmp-profile-card.with-sticky {

  position: sticky;

  top: 100px;

  height: max-content !important;

}

.tmp-profile-card image {

  background-color: #010d16;

  border-radius: 8px;

  overflow: hidden;

}

.tmp-profile-card .text {

  margin-top: 9px;

}

.tmp-profile-card .text .card-title {

  font-size: 24px;

  font-weight: 600;

  line-height: 1.333em;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 24px;

}

.tmp-profile-card .text p {

  margin-top: 8px;

  font-size: 16px;

  font-weight: 400;

  line-height: 1.5em;

  margin-bottom: 20px;

}

.tmp-profile-card .text p span {

  color: var(--color-primary);

  font-weight: 600;

}

.tmp-profile-card .common-button-groups {

  margin-top: 24px;

  display: flex;

  align-items: center;

  gap: 10px;

}

@media only screen and (max-width: 575px) {

  .tmp-profile-card .common-button-groups {

    flex-direction: column;

  }

}

.tmp-profile-card .common-button-groups .tmp-btn .btn-text {

  margin-right: 5px;

}

.tmp-profile-card .common-button-groups .tmp-btn.btn-md {

  padding: 0 6px;

}



.tmp-card-body {

  padding: 24px;

}



.tmp-portfolio-single-card.in-bentogrid {

  padding: 25px;

  border-radius: 8px;

}

@media only screen and (max-width: 575px) {

  .tmp-portfolio-single-card.in-bentogrid {

    padding: 15px;

  }

}

.tmp-portfolio-single-card.in-bentogrid .inner {

  height: 100%;

}

.tmp-portfolio-single-card.in-bentogrid .inner .thumbnail {

  height: 100%;

}

.tmp-portfolio-single-card.in-bentogrid .inner .thumbnail a {

  height: 100%;

}

.tmp-portfolio-single-card.in-bentogrid .inner .thumbnail a img {

  height: 100%;

}



.mySwiper-bentogrid .swiper-button-next,

.mySwiper-bentogrid .swiper-button-prev {

  height: 45px;

  width: 45px;

  display: flex;

  align-items: center;

  justify-content: center;

  background: var(--color-primary);

  border-radius: 50%;

  opacity: 0;

  transition: 0.3s;

}

.mySwiper-bentogrid .swiper-button-next i,

.mySwiper-bentogrid .swiper-button-prev i {

  color: #fff;

}

.mySwiper-bentogrid .swiper-button-next::after,

.mySwiper-bentogrid .swiper-button-prev::after {

  display: none;

}

.mySwiper-bentogrid:hover .swiper-button-next,

.mySwiper-bentogrid:hover .swiper-button-prev {

  opacity: 1;

}



.text-marque-banner-top-brnto {

  display: flex;

  align-items: center;

  height: auto;

}

.text-marque-banner-top-brnto .tmp-slider-item-banner-text {

  border-radius: 8px;

  height: auto;

  display: flex;

  align-items: center;

  overflow: hidden;

  white-space: nowrap;

  padding: 10px 0;

}

.text-marque-banner-top-brnto .tmp-slider-item-banner-text .item {

  animation: scrolling 12s linear infinite;

}

.text-marque-banner-top-brnto .tmp-slider-item-banner-text .item p {

  font-size: 18px !important;

  font-weight: 500 !important;

  animation: marquee 10s linear infinite;

  margin-right: 10px;

}



@keyframes scrolling {

  0% {

    transform: translateX(35%);

  }

  to {

    transform: translateX(calc(-100% - 1.5rem));

  }

}

.profile-picture-area .info-box {

  background: var(--color-secondary);

  padding: 20px 30px;

  border-radius: 5px;

}

.profile-picture-area .info-box span {

  display: block;

  font-family: var(--font-secondary);

  color: var(--color-body);

}

.profile-picture-area .info-box span a {

  transition: var(--transition);

  position: relative;

  color: var(--color-body);

  font-weight: 400;

}

.profile-picture-area .info-box span a::before {

  content: "";

  position: absolute;

  width: 0%;

  background-color: var(--color-primary);

  height: 1px;

  left: 0;

  bottom: 2px;

  transition: var(--transition);

  z-index: 10;

}

.profile-picture-area .info-box span a:hover {

  color: var(--color-primary);

}

.profile-picture-area .info-box span a:hover::before {

  width: 100%;

}



.border-none {

  border: none !important;

}



#tmp-page-content-bento .tmponhover::after {

  border-radius: 8px !important;

}

#tmp-page-content-bento .profile-picture-area .info-box {

  background: #141c21;

  padding: 10px 20px;

}



.personal-portfolio-right-inner-wrapper.in-bentogrid {

  max-width: 100%;

}

.personal-portfolio-right-inner-wrapper.in-bentogrid .section-header .title {

  font-weight: 500;

  font-size: 30px;

  letter-spacing: 0px;

  line-height: 1.4;

}



.personal-portfolio-right-inner-wrapper.about-tab .tmponhover {

  border: none !important;

  border-radius: 8px;

}

.personal-portfolio-right-inner-wrapper.about-tab .pricing-table-col-2 .feature-lists {

  margin-bottom: 40px;

}



.personal-portfolio-right-inner-wrapper .tmp-contact-form.contact-form-style-1 {

  border-radius: 10px;

}



.with-bento-about-banner.tmp-profile-card {

  background-color: var(--color-card);

  padding: 35px;

}



.tmp-profile-card .work-experiance-card {

  overflow: hidden;

  height: 310px;

}

.tmp-profile-card .work-experiance-card .card-title {

  font-size: 24px;

  font-weight: 600;

  line-height: 1.333em;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 24px;

  margin-bottom: 12px;

}

.tmp-profile-card .work-experiance-card .work-experiance-main {

  max-height: 218px;

  overflow: hidden;

  display: flex;

  flex-direction: column;

  gap: 0;

}

.tmp-profile-card .work-experiance-card .work-experiance-main:hover .work-experiance-slider {

  animation-play-state: paused;

}

.tmp-profile-card .work-experiance-card .work-experiance-slider {

  animation: scrollY 10s linear infinite;

  padding: 0;

  margin: 0;

  margin-bottom: 10px;

}

.tmp-profile-card .work-experiance-card .work-experiance-slider li {

  display: flex !important;

  gap: 30px;

  padding: 10px 15px;

  background: #141c21;

  border-radius: 5px;

}

.tmp-profile-card .work-experiance-card .work-experiance-slider li:first-child {

  margin-top: 0;

}

.tmp-profile-card .work-experiance-card .work-experiance-slider li:last-child {

  margin-bottom: 0;

}

.tmp-profile-card .work-experiance-card .work-experiance-slider li .date {

  margin-right: 40px;

}

.tmp-profile-card .work-experiance-card .work-experiance-slider li .date p {

  font-size: 14px;

  font-weight: 500;

}

.tmp-profile-card .work-experiance-card .work-experiance-slider li .info {

  display: flex;

  align-items: flex-start;

  gap: 12px;

}

.tmp-profile-card .work-experiance-card .work-experiance-slider li .info .icon {

  border-radius: 8px;

  width: 32px;

  height: 32px;

  background-color: rgba(43, 43, 43, 0.3803921569);

  display: flex;

  justify-content: center;

  align-items: center;

}

.tmp-profile-card .work-experiance-card .work-experiance-slider li .info .icon img {

  width: 20px;

}

.tmp-profile-card .work-experiance-card .work-experiance-slider li .info .text {

  font-size: 16px;

  font-weight: 600;

  margin-top: 0;

  line-height: 1.5em;

}

.tmp-profile-card .work-experiance-card .work-experiance-slider li .info .text .title {

  font-size: 14px;

  margin-bottom: 5px;

}

.tmp-profile-card .work-experiance-card .work-experiance-slider li .info .text .subtitle {

  font-size: 13px;

  font-weight: 400;

  line-height: 1.2;

  margin: 0;

  color: var(--color-body);

}

.tmp-profile-card .expertise-card .card-title {

  font-size: 24px;

  font-weight: 600;

  line-height: 1.333em;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 24px;

}

.tmp-profile-card .expertise-card .expertise-item {

  text-align: center;

}

.tmp-profile-card .expertise-card .expertise-item .image {

  background-color: rgba(43, 43, 43, 0.3803921569);

  border-radius: 8px;

  padding: 17px 10px;

}

.tmp-profile-card .expertise-card .expertise-item .image img {

  width: 35px;

  height: 35px;

}

.tmp-profile-card .expertise-card .expertise-item .text .title {

  font-size: 16px;

  font-weight: 500;

  line-height: 1.5em;

  margin-top: 0;

}

.tmp-profile-card .expertise-card .row > * {

  margin-top: 1rem;

}

.tmp-profile-card .expertise-card .g-2 {

  --bs-gutter-y: .5rem !important;

  --bs-gutter-x: .5rem !important;

}

.tmp-profile-card .expertise-card .g-3 {

  --bs-gutter-y: 1rem !important;

  --bs-gutter-x: 1rem !important;

}

.tmp-profile-card.services-card .services-item {

  background-color: rgba(43, 43, 43, 0.3803921569);

  padding: 16px 16px 24px 16px;

  border-radius: 10px;

}

.tmp-profile-card.services-card .services-item .image {

  background-color: rgb(1, 14, 22);

  border-radius: 5px;

  padding: 25px 14px;

}

.tmp-profile-card.services-card .services-item .image img {

  max-width: 58px;

  margin: auto;

}

.tmp-profile-card.services-card .services-item .text .title {

  font-size: 18px !important;

  margin: 0;

}

.tmp-profile-card.services-card .card-title {

  font-size: 24px;

  font-weight: 600;

  line-height: 1.333em;

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 24px;

}



.list-unstyled {

  padding-left: 0;

  list-style: none;

}



.expertise-card {

  height: 310px;

}

@media only screen and (max-width: 767px) {

  .expertise-card {

    height: auto;

  }

}



@keyframes scrollY {

  0% {

    transform: translateY(0);

  }

  to {

    transform: translateY(calc(-100% - 1rem));

  }

}

.tmp-contact-form.contact-form-style-1.in-bentogrid {

  border: none;

  padding: 0;

}

.tmp-contact-form.contact-form-style-1.in-bentogrid form .form-group textarea {

  min-height: auto !important;

}



.height-auto {

  height: auto !important;

}



.personal-demo-left-fixed .tmponhover {

  border: transparent !important;

}

.personal-demo-left-fixed .experience-style-list .experience-list .resume-single-list {

  margin-top: 30px;

}



#tmp-page-content-bento .pricing-table-col-2 .tmp-btn.tmp-modern-button {

  display: flex;

  justify-content: center;

}



/*----Template Style----*/

.project-details-thumnail-wrap img {

  border-radius: 20px;

}



.project-details-area-wrapper .project-details-content-wrap .title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-weight: 700;

  font-size: 38px;

  line-height: 48px;

  text-transform: capitalize;

  margin-bottom: 20px;

}

@media (min-width: 768px) {

  .project-details-area-wrapper .project-details-content-wrap .title {

    font-size: 48px;

    line-height: 60px;

  }

}

.project-details-area-wrapper .project-details-content-wrap .mini-title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 24px;

  font-weight: 700;

  line-height: 30px;

}

.project-details-area-wrapper .project-details-content-wrap .docs {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-bottom: 20px;

}



.check-box-wrap {

  margin-bottom: 45px;

}

.check-box-wrap ul li {

  margin: 0;

  margin-bottom: 7px;

}

.check-box-wrap ul li:last-child {

  margin-bottom: 0;

}

.check-box-wrap ul li .check-box-item {

  display: flex;

  align-items: center;

  gap: 10px;

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 18px;

  font-weight: 700;

  line-height: 27px;

  margin-bottom: 0;

}

.check-box-wrap ul li .check-box-item span {

  color: var(--color-primary);

}

.check-box-wrap ul li .check-box-item span i {

  background: transparent;

  border-radius: 100px;

  font-weight: 400;

  margin-top: 6px;

}



.project-details-swiper-wrapper .project-details-swiper .project-details-img img {

  border-radius: 20px;

  width: 100%;

  object-fit: cover;

}

.project-details-swiper-wrapper .project-details-swiper-btn {

  margin-top: 50px;

  display: flex;

  justify-content: space-between;

}

.project-details-swiper-wrapper .project-details-swiper-btn .project-swiper-button-next,

.project-details-swiper-wrapper .project-details-swiper-btn .project-swiper-button-prev {

  display: flex;

  align-items: center;

  gap: 20px;

  color: var(--color-gray);

  font-family: var(--font-primary);

  font-size: 24px;

  font-weight: 400;

  line-height: 30px;

  transition: all 0.4s ease;

}

.project-details-swiper-wrapper .project-details-swiper-btn .project-swiper-button-next span,

.project-details-swiper-wrapper .project-details-swiper-btn .project-swiper-button-prev span {

  min-width: 40px;

  min-height: 40px;

  border: 2px solid var(--color-border);

  border-radius: 100px;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  color: var(--color-heading);

  transition: all 0.4s ease;

}

.project-details-swiper-wrapper .project-details-swiper-btn .project-swiper-button-next i,

.project-details-swiper-wrapper .project-details-swiper-btn .project-swiper-button-prev i {

  transition: all 0.4s ease;

  font-weight: 400;

  font-size: 14px;

}

.project-details-swiper-wrapper .project-details-swiper-btn .project-swiper-button-next:hover,

.project-details-swiper-wrapper .project-details-swiper-btn .project-swiper-button-prev:hover {

  color: var(--color-primary);

}

.project-details-swiper-wrapper .project-details-swiper-btn .project-swiper-button-next:hover span,

.project-details-swiper-wrapper .project-details-swiper-btn .project-swiper-button-prev:hover span {

  background: var(--color-primary);

  border: 2px solid var(--color-primary);

  color: var(--color-white);

}



/*---------------------

    Card Styles  

----------------------*/

.tmp-breadcrumb-image {

  height: 400px;

}

@media only screen and (max-width: 767px) {

  .tmp-breadcrumb-image {

    height: 250px;

  }

}

.tmp-breadcrumb-image .bg_image--2 {

  background-position: center center;

}



@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .cv-card-area {

    margin-top: -200px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .cv-card-area {

    margin-top: -200px;

  }

}

@media only screen and (max-width: 767px) {

  .cv-card-area {

    margin-top: -200px;

  }

}



.tab-content-overlay-to-top {

  margin-top: -320px;

  position: sticky;

  top: 20px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tab-content-overlay-to-top {

    margin-top: -200px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .tab-content-overlay-to-top {

    margin-top: 0px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tab-content-overlay-to-top {

    margin-top: 0px;

  }

}

@media only screen and (max-width: 767px) {

  .tab-content-overlay-to-top {

    margin-top: 0px;

  }

}



.tab-wrapper-overlay-to-top {

  margin-top: -55px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tab-wrapper-overlay-to-top {

    margin-top: 50px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .tab-wrapper-overlay-to-top {

    margin-top: 0px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tab-wrapper-overlay-to-top {

    margin-top: 0px;

  }

}

@media only screen and (max-width: 767px) {

  .tab-wrapper-overlay-to-top {

    margin-top: 0px;

  }

}



.sticky-top {

  z-index: 10 !important;

}



.sticky-top.tmp-sticky-top {

  padding: 0 !important;

  margin: 0 !important;

}



.tmp-contact-about-inner {

  padding: 30px;

  border-radius: 10px;

  border: 2px solid var(--color-border);

  background: #010d16;

  text-align: center;

  position: relative;

  overflow: hidden;

  z-index: 1;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-contact-about-inner {

    padding: 20px 15px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .tmp-contact-about-inner {

    display: flex;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-contact-about-inner {

    display: flex;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-contact-about-inner {

    display: flex;

    padding: 30px 15px;

  }

}

@media only screen and (max-width: 575px) {

  .tmp-contact-about-inner {

    display: block;

  }

}

.tmp-contact-about-inner .about-paradigm__line-wrap-1 {

  justify-content: flex-start;

  align-items: flex-start;

  display: flex;

  position: absolute;

  inset: 0% auto 0% 0%;

}

.tmp-contact-about-inner .about-paradigm__line-wrap-1 .about-paradigm__line-1 {

  width: auto;

  height: 8.13rem;

  position: relative;

  left: 0.1rem;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .tmp-contact-about-inner .content {

    text-align: left;

    padding-left: 30px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-contact-about-inner .content {

    text-align: left;

    padding-left: 30px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-contact-about-inner .content {

    text-align: left;

    padding-left: 30px;

  }

}

@media only screen and (max-width: 575px) {

  .tmp-contact-about-inner .content {

    padding-left: 0;

  }

}

.tmp-contact-about-inner .thumbnail {

  margin-bottom: 28px;

  overflow: hidden;

  border-radius: 10px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-contact-about-inner .thumbnail {

    margin-bottom: 10px;

  }

}

@media only screen and (max-width: 1199px) {

  .tmp-contact-about-inner .thumbnail {

    margin-bottom: 0;

  }

}

.tmp-contact-about-inner .thumbnail img {

  width: 100%;

  transition: var(--transition);

  max-width: 300px;

  border-radius: 10px;

}

@media only screen and (max-width: 1199px) {

  .tmp-contact-about-inner .thumbnail img {

    max-width: max-content;

    margin-bottom: 0;

  }

}

.tmp-contact-about-inner .title-area {

  margin-bottom: 15px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-contact-about-inner .title-area {

    margin-bottom: 5px;

  }

}

.tmp-contact-about-inner .title-area h4.title {

  font-size: 29px;

  line-height: 44px;

  color: var(--color-heading);

  margin-bottom: 9px;

}

@media only screen and (max-width: 479px) {

  .tmp-contact-about-inner .title-area h4.title {

    font-size: 20px;

  }

}

.tmp-contact-about-inner .active {

  display: block;

  position: relative;

  max-width: max-content;

  margin: auto;

}

.tmp-contact-about-inner .active::after {

  content: "";

  right: -13px;

  top: 12px;

  height: 6px;

  width: 6px;

  background: var(--color-success);

  position: absolute;

  border-radius: 50%;

}

.tmp-contact-about-inner .subtitle {

  font-family: var(--font-secondary);

  color: var(--color-body);

  font-weight: 600;

}

.tmp-contact-about-inner .info-box {

  background: var(--color-secondary);

  padding: 20px 30px;

  border-radius: 10px;

}

@media only screen and (max-width: 767px) {

  .tmp-contact-about-inner .info-box {

    padding: 15px;

  }

}

.tmp-contact-about-inner .description {

  margin-bottom: 25px;

}

@media only screen and (min-width: 1200px) and (max-width: 1599px) {

  .tmp-contact-about-inner .description {

    margin-bottom: 5px;

  }

}

.tmp-contact-about-inner .description p {

  font-size: 16px;

  font-weight: 400;

  color: var(--color-body);

  font-family: var(--font-secondary);

  line-height: 28px;

  display: inline-block;

  margin-bottom: 20px;

}

.tmp-contact-about-inner .description span {

  display: block;

  font-family: var(--font-secondary);

  color: var(--color-body);

}

@media only screen and (max-width: 767px) {

  .tmp-contact-about-inner .description span {

    font-size: 16px;

  }

}

.tmp-contact-about-inner .description span a {

  transition: var(--transition);

  position: relative;

  color: var(--color-body);

  font-weight: 400;

}

.tmp-contact-about-inner .description span a::before {

  content: "";

  position: absolute;

  width: 0%;

  background-color: var(--color-primary);

  height: 1px;

  left: 0;

  bottom: 2px;

  transition: var(--transition);

  z-index: 10;

}

.tmp-contact-about-inner .description span a:hover {

  color: var(--color-primary);

}

.tmp-contact-about-inner .description span a:hover::before {

  width: 100%;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .tmp-contact-about-inner .social-link {

    justify-content: flex-start !important;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-contact-about-inner .social-link {

    justify-content: flex-start !important;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-contact-about-inner .social-link {

    justify-content: flex-start !important;

  }

}

.tmp-contact-about-inner::after {

  content: " ";

  position: absolute;

  right: -450px;

  bottom: -500px;

  min-width: 474px;

  min-height: 474px;

  border-radius: 100px;

  filter: blur(227px);

  z-index: 1;

  background: var(--color-primary);

}



@media only screen and (max-width: 1199px) {

  body.index-8 .tmp-contact-about-inner .thumbnail img {

    max-width: 420px;

    margin-bottom: 0;

  }

}

@media only screen and (max-width: 778px) {

  body.index-8 .tmp-contact-about-inner .thumbnail img {

    max-width: 100%;

    margin-bottom: 0;

  }

}

@media only screen and (max-width: 767px) {

  body.index-8 .tmp-contact-about-inner {

    display: flex;

    padding: 15px;

  }

}



.tab-navigation-button {

  float: left;

  background-color: var(--color-card);

  border-radius: 10px;

  width: 100%;

  height: auto;

  flex-wrap: nowrap;

  margin-top: 0;

  padding: 10px;

  border: 2px solid var(--color-border);

  z-index: 1;

  position: relative;

  overflow: hidden;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .tab-navigation-button {

    padding: 10px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tab-navigation-button {

    display: flex;

    flex-direction: row !important;

    margin-bottom: 0;

    padding: 10px 15px;

    flex-wrap: wrap;

  }

}

@media only screen and (max-width: 767px) {

  .tab-navigation-button {

    display: flex;

    flex-direction: row !important;

    margin-bottom: 0;

    padding: 10px 15px;

    flex-wrap: wrap;

  }

}

.tab-navigation-button .nav-item {

  margin: 0;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tab-navigation-button .nav-item {

    margin: 5px;

  }

}

@media only screen and (max-width: 767px) {

  .tab-navigation-button .nav-item {

    margin: 5px;

  }

}

.tab-navigation-button .nav-item .nav-link {

  border: none;

  font-size: 18px;

  color: var(--color-body);

  height: 60px;

  border-radius: 10px;

  padding: 15px 20px;

  width: 100%;

  display: flex;

  margin: 0;

  align-items: center;

  transition: 0.3s;

  justify-content: center;

  font-family: var(--font-secondary);

  background: var(--color-gray-2);

  margin-bottom: 15px;

  position: relative;

  overflow: hidden;

  border: 1px solid var(--color-border-3);

}

.tab-navigation-button .nav-item .nav-link::before {

  content: "";

  position: absolute;

  inset: 0px;

  border-radius: inherit;

  border: 1px solid transparent;

  background-clip: border-box;

  -webkit-mask: var(--full) padding-box, var(--full);

  -webkit-mask-composite: xor;

  mask: var(--full) padding-box exclude, var(--full);

  pointer-events: none;

  background: var(--stroke-gr) border-box;

  z-index: 1;

  transition: 0.5s;

  transition: border-color 0.5s;

  opacity: 0;

  transition: opacity 0.5s ease;

  will-change: opacity;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .tab-navigation-button .nav-item .nav-link {

    height: auto;

    padding: 15px 20px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tab-navigation-button .nav-item .nav-link {

    height: auto;

    padding: 15px 20px;

    margin-bottom: 0;

  }

}

@media only screen and (max-width: 767px) {

  .tab-navigation-button .nav-item .nav-link {

    height: auto;

    padding: 5px 12px;

    margin-bottom: 0;

    font-size: 14px;

  }

}

.tab-navigation-button .nav-item .nav-link:hover::before, .tab-navigation-button .nav-item .nav-link:focus::before, .tab-navigation-button .nav-item .nav-link.active::before {

  opacity: 1;

}

.tab-navigation-button .nav-item:last-child .nav-link {

  margin-bottom: 0;

}

.tab-navigation-button.style-2 {

  float: none;

  width: 100%;

  margin: -5px;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .tab-navigation-button.style-2 {

    width: auto;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tab-navigation-button.style-2 {

    width: auto;

  }

}

@media only screen and (max-width: 767px) {

  .tab-navigation-button.style-2 {

    width: auto;

  }

}

.tab-navigation-button.style-2 .nav-item {

  margin: 5px;

}

.tab-navigation-button.style-2 .nav-item .nav-link {

  padding: 15px 38px;

  margin-bottom: 0;

}

@media only screen and (max-width: 767px) {

  .tab-navigation-button.style-2 .nav-item .nav-link {

    padding: 13px 22px;

    margin-bottom: 0;

  }

}

@media only screen and (max-width: 575px) {

  .tab-navigation-button.style-2 .nav-item .nav-link {

    padding: 5px;

  }

}



.tmp-all-tab-content {

  background: var(--color-card-wrapper);

  padding: 40px;

  border-radius: 10px;

  border: 2px solid var(--color-border);

}

.tmp-all-tab-content.card-bg-transparent {

  background: transparent;

  padding: 0;

  border-radius: 0;

  border: 0 none;

}

@media only screen and (max-width: 767px) {

  .tmp-all-tab-content {

    padding: 20px;

  }

}

@media only screen and (max-width: 575px) {

  .tmp-all-tab-content {

    padding: 5px;

  }

}

.section-head .title span{

    font-weight: 400;

}

.for-animation-inner {

  padding: 50px;

  background: var(--color-card);

  grid-row-gap: 2.78rem;

  border: 1px solid var(--stroke-dark-100);

  background-image: url(../images/bg/bg-footer.jpg);

  background-position: 50%;

  background-repeat: no-repeat;

  background-size: cover;

  border-radius: 15px;

  flex-flow: column;

  justify-content: center;

  align-items: center;

  width: 100%;

  padding: 2.28rem 2.22rem;

  position: relative;

  overflow: hidden;

}

@media only screen and (max-width: 575px) {

  .for-animation-inner {

    padding: 27px 26px;

  }

}

.for-animation-inner::before {

  content: "";

  position: absolute;

  inset: 0px;

  border-radius: inherit;

  border: 1px solid transparent;

  background-clip: border-box;

  -webkit-mask: var(--full) padding-box, var(--full);

  -webkit-mask-composite: xor;

  mask: var(--full) padding-box exclude, var(--full);

  pointer-events: none;

  background: linear-gradient(127deg, #7ee1fa 0%, rgba(126, 225, 250, 0) 15.02%, rgba(126, 225, 250, 0) 100%) border-box, linear-gradient(-53deg, #7ee1fa 0%, rgba(126, 225, 250, 0) 15.02%, rgba(126, 225, 250, 0) 100%) border-box;

  z-index: 1;

}

.for-animation-inner .cta__line-wrap-1 {

  justify-content: flex-start;

  align-items: flex-start;

  width: 95%;

  display: flex;

  position: absolute;

  inset: 0% 0% auto 50%;

  transform: translate(-50%);

}

.for-animation-inner .cta__line-wrap-2 {

  justify-content: flex-end;

  align-items: flex-start;

  width: 95%;

  display: flex;

  position: absolute;

  inset: auto 0% 0% 50%;

  transform: translate(-50%);

}



.modal-backdrop {

  background-color: transparent;

}



.modal.fade {

  transition: opacity 0.1s linear;

}



body.modal-open {

  padding-right: 0 !important;

  overflow: visible !important;

}



.box-wrapper.modal-open {

  padding-right: 25px !important;

}



.modal {

  /* Track */

  /* Handle */

  /* Handle on hover */

  z-index: 99999999;

  background: var(--color-page);

  padding: 60px 15px !important;

}

.modal::-webkit-scrollbar {

  width: 5px;

}

.modal::-webkit-scrollbar-track {

  background: #555;

}

.modal::-webkit-scrollbar-thumb {

  background: var(--color-primary);

}

.modal::-webkit-scrollbar-thumb:hover {

  background: #555;

}

.modal.modal-boxed-home {

  width: calc(100% - 50px) !important;

  left: 50%;

  transform: translateX(-50%);

}

.modal .modal-news {

  max-width: 1000px !important;

}

.modal .modal-dialog {

  width: 100%;

  max-width: 1230px;

}

.modal .modal-dialog .modal-content {

  padding: 30px;

  border-radius: 10px;

  overflow: hidden;

  z-index: 1;

  border: 2px solid var(--color-border);

  background: #010d16;

}

.modal .modal-dialog .modal-content::after {

  content: " ";

  position: absolute;

  right: -450px;

  bottom: -500px;

  min-width: 474px;

  min-height: 474px;

  border-radius: 100px;

  filter: blur(227px);

  z-index: 1;

  background: var(--color-primary);

}

@media only screen and (max-width: 767px) {

  .modal .modal-dialog .modal-content {

    padding: 30px;

  }

}

@media only screen and (max-width: 479px) {

  .modal .modal-dialog .modal-content {

    padding: 40px 15px 25px 15px;

  }

}

.modal .modal-dialog .modal-content .modal-header {

  padding: 0;

  border: none;

}

.modal .modal-dialog .modal-content .modal-header .close {

  padding: 1rem 1rem;

  margin: -1rem -1rem -1rem auto;

  display: inline-block;

  width: 0;

  right: 44px;

  position: absolute;

  top: 18px;

  opacity: 1;

  transition: var(--transition);

}

.modal .modal-dialog .modal-content .modal-header .close span {

  color: var(--color-white);

  position: relative;

  z-index: 1;

  transition: var(--transition);

}

.modal .modal-dialog .modal-content .modal-header .close span svg {

  width: 22px;

  height: auto;

  position: relative;

  top: -1px;

}

.modal .modal-dialog .modal-content .modal-header .close span::after {

  content: "";

  position: absolute;

  transition: var(--transition);

  width: 45px;

  height: 45px;

  border-radius: 50%;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  background: var(--background-color-1);

  opacity: 1;

  z-index: -1;

}

.modal .modal-dialog .modal-content .modal-header .close:hover span {

  color: var(--color-primary);

}

.modal .modal-dialog .modal-content .modal-body .text-content {

  padding-left: 2rem;

}

.modal .modal-dialog .modal-content .modal-body .text-content h3 {

  margin-bottom: 20px;

  font-size: 34px;

  font-weight: 700;

  color: var(--color-heading);

  line-height: 1.3;

}

.modal .modal-dialog .modal-content .modal-body .text-content h3 span {

  display: block;

  font-size: 16px;

  line-height: 30px;

  color: var(--color-body);

  font-weight: 500;

  margin-bottom: 5px;

}

.modal .modal-dialog .modal-content .modal-body .text-content p {

  font-size: 18px;

  line-height: 30px;

  color: var(--color-body);

  font-weight: 400;

  margin-bottom: 0;

  width: 93%;

}

.modal .modal-dialog .modal-content .modal-body .text-content p:nth-child(1) {

  margin-bottom: 30px;

}

@media screen and (max-width: 991px) {

  .modal .modal-dialog .modal-content .modal-body .text-content {

    margin-top: 30px;

    padding: 0;

  }

}

.modal .modal-dialog .modal-content .modal-body .text-content a svg {

  position: relative;

  margin-right: -13px;

  width: 19px;

}

.modal .featured-project-carousel .carousel-indicators {

  position: absolute;

  top: 83%;

}

.modal .featured-project-carousel .carousel-indicators li {

  width: 8px;

  height: 8px;

  border-radius: 50%;

  opacity: 1;

  -webkit-transition: all 0.5s;

  -o-transition: all 0.5s;

  transition: all 0.5s;

  cursor: pointer;

  margin-right: 3px;

  margin-left: 3px;

  text-indent: -999px;

  position: relative;

  flex: 0 1 auto;

  background-color: var(--color-body);

}

.modal .featured-project-carousel .carousel-indicators li.active {

  background-color: var(--color-primary);

  opacity: 1;

}

.modal .carousel {

  position: relative;

}

.modal .carousel .carousel-inner {

  border-radius: 10px;

  overflow: hidden;

  position: relative;

  width: 100%;

  margin-bottom: 0;

}

.modal .carousel .carousel-inner img {

  max-width: 100%;

  height: auto;

}



button.close {

  padding: 0;

  background-color: transparent;

  border: 0;

  -webkit-appearance: none;

}



.close {

  float: right;

  font-size: 1.5rem;

  font-weight: 700;

  line-height: 1;

  color: #000;

  text-shadow: 0 1px 0 #fff;

  opacity: 0.5;

}



ol.carousel-indicators {

  position: absolute !important;

  top: 0;

  z-index: 5;

}



div#featured-project-carousel {

  padding: 0;

}



.featured-project-carousel .carousel-control-prev-icon {

  background: url(../images/icons/short-arrow-left.html) center center no-repeat;

  width: 4rem;

  height: 4rem;

  display: inline-block;

}



.featured-project-carousel .carousel-control-next-icon {

  background: url(../images/icons/short-arrow-right.html) center center no-repeat;

  width: 4rem;

  height: 4rem;

  display: inline-block;

}



.modal-body .modal-feat-img {

  margin-left: auto;

  margin-right: auto;

  margin-bottom: 3.8rem;

  border-radius: 10px;

  vertical-align: middle;

}

.modal-body .img-fluid {

  width: 100%;

  height: auto;

}

.modal-body .comment-inner .title {

  font-size: 32px;

  font-weight: 600;

  color: var(--color-heading);

  margin-bottom: 16px;

}

.modal-body .comment-inner .rnform-group {

  margin-bottom: 20px;

}

.modal-body .comment-inner .rnform-group input {

  background-color: #191b1e;

  border-radius: 6px;

  height: 55px;

  transition: var(--transition);

  border: 2px solid #191b1e;

  padding: 0 15px;

  font-size: 14px;

  font-family: var(--font-primary);

  color: var(--color-heading);

  box-shadow: var(--inner-shadow);

  letter-spacing: 1px;

}

.modal-body .comment-inner .rnform-group input:focus {

  color: var(--color-light);

  border-color: var(--color-primary);

  box-shadow: none;

}

.modal-body .comment-inner .rnform-group textarea {

  min-height: 205px;

  background-color: #191b1e;

  border-radius: 6px;

  padding: 0;

  transition: var(--transition);

  border: 2px solid #191b1e;

  padding: 15px 15px;

  font-size: 14px;

  line-height: 18px;

  font-family: var(--font-secondary);

  color: var(--color-heading);

  box-shadow: var(--inner-shadow);

  letter-spacing: 1px;

  resize: none;

}

.modal-body .comment-inner .rnform-group textarea:focus {

  color: var(--color-light);

  border-color: var(--color-primary);

  box-shadow: none;

}

.modal-body .news-details .date {

  display: block;

  font-size: 14px;

  line-height: 24px;

  color: var(--color-heading);

  font-weight: 500;

  margin-bottom: 9px;

}

.modal-body .news-details .title {

  font-size: 32px;

  font-weight: 700;

  line-height: 1.2;

  color: var(--color-heading);

  margin-top: 20px;

  margin-bottom: 40px;

}

.modal-body .news-details p {

  font-size: 16px;

  line-height: 28px;

  color: var(--color-body);

  font-weight: 400;

}

.modal-body .news-details h4 {

  font-size: 30px;

  color: var(--color-heading);

}



.modal-backdrop.show {

  pointer-events: none;

  opacity: 0;

}



/*----Footer Style----*/

.footer-area {

  position: relative;

  z-index: 1;

  overflow: hidden;

}

.footer-area .footer-bg-img {

  position: absolute;

  left: 84px;

  top: 60px;

  z-index: -1;

}

.footer-area .footer-bg-img img {

  animation: sppeen-box 70s linear infinite;

}



@keyframes sppeen-box {

  0% {

    transform: rotate(0deg);

  }

  100% {

    transform: rotate(360deg);

  }

}

.footer-style-one-wrapper,

.footer-style-two-wrapper {

  background: var(--color-gray-2);

}



.footer-style-one .ft-title,

.footer-style-two .ft-title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 24px;

  font-weight: 700;

  line-height: 30px;

  margin-bottom: 40px;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .footer-style-one .ft-title,

  .footer-style-two .ft-title {

    font-size: 20px;

    margin-bottom: 28px;

  }

}



/*================================

   Footer Style One

  ================================*/

.footer-style-one .description {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-weight: 400;

  margin-top: 22px;

  font-size: 50px;

  line-height: 60px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .footer-style-one .description {

    margin-top: 16px;

    font-size: 38px;

    line-height: 43px;

  }

}

@media only screen and (max-width: 575px) {

  .footer-style-one .description {

    font-size: 40px;

    line-height: 45px;

  }

}

.footer-style-one .description span {

  font-weight: 700;

}



/*================================

   Footer Style two

  ================================*/

.footer-style-two .logo {

  margin-bottom: 30px;

}

.footer-style-two .description {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

  margin-bottom: 30px;

}

.footer-style-two .row {

  --bs-gutter-y: 0;

}

.footer-style-two .quick-link-wrap {

  margin-top: 20px;

}

@media (min-width: 576px) {

  .footer-style-two .quick-link-wrap {

    margin-left: 0;

    margin-top: 0;

  }

}

.footer-style-two .contact-wrap {

  margin-top: 20px;

}

@media (min-width: 576px) {

  .footer-style-two .contact-wrap {

    margin-left: 0;

    margin-top: 0;

  }

}



/*================================

   Newsletter Form 1

  ================================*/

.newsletter-form-1 {

  display: flex;

  align-items: center;

  padding-bottom: 19px;

  border-bottom: 2px solid var(--color-border);

  max-width: 330px;

}

.newsletter-form-1 input {

  padding: 0;

  color: #fff;

  padding-right: 20px;

  border: 0 none;

}

.newsletter-form-1 input::placeholder {

  color: #FFF;

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

.newsletter-form-1 button {

  max-width: max-content;

  margin-left: auto;

  border: none;

}

.newsletter-form-1 .form-icon {

  font-size: 16px;

  font-weight: 900;

  color: var(--color-heading);

  cursor: pointer;

}



/*================================

   Single Footer Wrapper

  ================================*/

@media (min-width: 768px) {

  .single-footer-wrapper.quick-link-wrap {

    margin-left: 80px;

  }

}

.single-footer-wrapper .social-link {

  margin-top: 30px;

}



/*================================

   FT Link

  ================================*/

.ft-link li {

  margin-top: 0;

  margin-bottom: 8px;

}

.ft-link li:last-child {

  margin-bottom: 0;

}

.ft-link.v2 li {

  margin-top: 0;

  margin-bottom: 22px;

  gap: 15px;

}

.ft-link.v2 li span {

  border: 1px solid var(--color-border);

  width: 50px;

  height: 50px;

  min-width: 50px;

}

.ft-link.v2 li:last-child {

  margin-bottom: 0;

}

.ft-link a {

  color: var(--color-heading);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

.ft-link li {

  display: flex;

  align-items: center;

  gap: 10px;

  color: var(--color-heading);

  font-family: var(--font-secondary);

}

.ft-link li span {

  min-width: 40px;

  min-height: 40px;

  display: flex;

  align-items: center;

  justify-content: center;

  border: 2px solid var(--color-border);

  border-radius: 100px;

  color: var(--color-heading);

  background: transparent;

}

.ft-link li .ft-link-wrap .link-title {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 14px;

  font-weight: 400;

  line-height: 160%;

  margin-bottom: 0;

}

.ft-link li a {

  color: var(--color-heading);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}



.contact-wrap .ft-link li {

  margin-bottom: 15px;

}



/*================================

   Copyright Area One

  ================================*/

.copyright-area-one {

  background: var(--color-gray-2);

  position: relative;

}

.copyright-area-one .main-wrapper {

  display: flex;

  justify-content: center;

  align-items: center;

  padding: 28px 0;

  flex-wrap: wrap;

}

@media (min-width: 576px) {

  .copyright-area-one .main-wrapper {

    gap: 20px;

  }

}

@media (min-width: 700px) {

  .copyright-area-one .main-wrapper {

    justify-content: space-between;

  }

}

.copyright-area-one .main-wrapper .copy-right-para {

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 14px;

  font-weight: 400;

  line-height: 30px;

  margin-bottom: 0;

  text-align: center;

}

.copyright-area-one .main-wrapper ul {

  display: flex;

  align-items: center;

  flex-wrap: wrap;

  justify-content: center;

}

@media (min-width: 350px) {

  .copyright-area-one .main-wrapper ul {

    justify-content: inherit;

    gap: 10px;

  }

}

@media (min-width: 768px) {

  .copyright-area-one .main-wrapper ul {

    gap: 15px;

  }

}

.copyright-area-one .main-wrapper ul li {

  margin: 0;

}

.copyright-area-one .main-wrapper ul li a {

  color: var(--color-heading);

  font-family: var(--font-secondary);

  font-size: 14px;

  font-weight: 400;

  line-height: 30px;

}

.copyright-area-one .main-wrapper ul li a:hover {

  color: var(--color-primary);

}



/*================================

   Newslatter

  ================================*/

.newslatter {

  border-radius: 20px;

  border: 1px solid rgba(159, 159, 159, 0.2);

  padding: 25px 25px 25px 25px;

  margin-top: 20px;

}

@media (min-width: 992px) {

  .newslatter {

    margin-top: 0;

    padding: 40px 40px 30px 40px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .newslatter {

    padding: 20px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .newslatter {

    padding: 20px;

  }

}

@media only screen and (max-width: 767px) {

  .newslatter {

    padding: 20px 10px;

  }

}

.newslatter .title {

  color: var(--color-heading);

  font-family: var(--font-primary);

  font-size: 24px;

  font-weight: 700;

  line-height: 30px;

  margin-bottom: 0;

}

.newslatter .para {

  margin: 7px 0 0 0;

  color: var(--color-gray);

  font-family: var(--font-secondary);

  font-size: 16px;

  font-weight: 400;

  line-height: 30px;

}

@media only screen and (max-width: 767px) {

  .newslatter .para {

    font-size: 14px;

    line-height: 23px;

  }

}

.newslatter .newsletter-form-1 {

  border-radius: 999px;

  border: 1px solid rgba(159, 159, 159, 0.2);

  padding: 5px 5px 5px 30px;

  margin-top: 20px;

}

.newslatter .newsletter-form-1 .form-icon {

  min-width: 52px;

  min-height: 52px;

  background: var(--color-primary);

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 100px;

}

.newslatter .newsletter-form-1 .form-icon:hover {

  background: var(--color-primary);

  color: #ffffff;

}



.footer-style-4 .description {

  font-size: 16px;

  color: var(--color-body);

  font-family: var(--font-secondary);

}



.tmp-footer-area-style-net .footer-style-3 .tmp-call-to-action.style-8 {

  background-image: none !important;

  background-repeat: no-repeat;

  background-size: cover;

  position: relative;

  padding: 100px 0;

  background: #1b1b1c;

}

@media only screen and (max-width: 575px) {

  .tmp-footer-area-style-net .footer-style-3 .tmp-call-to-action.style-8 {

    padding: 50px 0;

  }

}

.tmp-footer-area-style-net .bg_patern-1 {

  position: relative;

  z-index: 1;

  background-image: none !important;

  background-color: rgba(27, 27, 28, 0.5568627451) !important;

}

.tmp-footer-area-style-net .bg_patern-1::after {

  background-size: auto !important;

  background-repeat: repeat !important;

  content: "";

  width: 100%;

  height: 100%;

  position: absolute;

  left: 0;

  top: 0;

  background-image: url(../images/bg/patern.svg) !important;

  z-index: -1;

  opacity: 0.5;

}

.tmp-footer-area-style-net .inner * {

  font-weight: 400;

}

.tmp-footer-area-style-net .inner .title {

  font-size: 60px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .tmp-footer-area-style-net .inner .title {

    font-size: 48px;

  }

}

@media only screen and (max-width: 767px) {

  .tmp-footer-area-style-net .inner .title {

    font-size: 40px;

  }

}

@media only screen and (max-width: 575px) {

  .tmp-footer-area-style-net .inner .title {

    font-size: 26px;

  }

}



.copyright-style-net {

  padding: 20px 0;

  border-top: 1px solid rgba(157, 157, 255, 0.0509803922);

}

.copyright-style-net .tmp-menu {

  padding: 0;

  margin: 0 -10px;

  list-style: none;

  display: flex;

  flex-wrap: wrap;

  align-items: center;

  gap: 15px;

}

@media only screen and (min-width: 768px) and (max-width: 991px) {

  .copyright-style-net .tmp-menu {

    justify-content: center;

  }

}

@media only screen and (max-width: 767px) {

  .copyright-style-net .tmp-menu {

    justify-content: center;

  }

}

.copyright-style-net .tmp-menu li a {

  font-weight: 500;

}

.copyright-style-net .copyright-center ul {

  padding: 0;

  margin: 0;

  display: flex;

  align-items: center;

  gap: 10px;

}

.copyright-style-net .copyright-center ul li {

  margin: 0;

  padding: 0;

}

.copyright-style-net .copyright-center ul li a {

  height: 45px;

  width: 45px;

  display: flex;

  align-items: center;

  justify-content: center;

  background: #1b1b1c;

  border-radius: 50%;

}

.copyright-style-net .copyright-center ul li a i {

  color: #fff;

}



body.color-primary-2nd {

  --color-primary: var(--color-primary-2nd);

}

body.color-blue {

  --color-primary: #5237f9;

}

body.primary-yellow {

  --color-primary: #FFB400;

}

body.primary-yellow .bg_image--8 {

  background-image: url(../images/bg/04.webp);

}

body.color-pink {

  --color-primary: #EA4C89;

}

body.color-pink .bg_image--2 {

  background-image: url(../images/bg/bg-image-13.jpg);

}

body.color-primary-3rd {

  --color-primary: var(--color-primary-3rd);

  --color-primary-alt: var(--color-primary-3rd);

}

body.color-primary-3rd .services-widget.v2 .active-bg {

  background: rgba(255, 193, 7, 0.0784313725);

}

body.color-primary-4th {

  --color-primary: var(--color-primary-4th);

}

body.tmp-white-version {

  background-color: #ECF0F3;

  --color-heading: #141414;

  --color-gray: #5d6570;

  --color-body: #2a2d31;

  --color-gray-2: linear-gradient(145deg, #e2e8ec, #ffffff);

  --color-border: #dce1e4;

  --stroke-dark-100: #dce1e4;

  --stroke-gr: linear-gradient(317deg, #13fdfd 0%, rgba(19, 215, 253, 1) 50%, rgba(19, 191, 253, 1) 62.96%, #139bfd 100%);

  --shadow-white: 5px 5px 15px #D1D9E6, -5px -5px 15px #ffffff;

  --gradient-white: linear-gradient(145deg, #e2e8ec, #ffffff);

}

body.tmp-white-version.box-body .main-wrapper-inner {

  background: #ffffff;

}

body.tmp-white-version .newsletter-form-1 input {

  color: #141414;

}

body.tmp-white-version.demo-model .tmp-banner-one-area.style-2 {

  background-image: url(../images/bg/03.webp);

}

body.tmp-white-version .rpp-banner-five-area {

  background-color: #EDEDED;

}

body.tmp-white-version .model-style-banner.with-instructor .banner-model-15 .title {

  color: #fff;

}

body.tmp-white-version .tmp-banner-one-area.add-pattern::before,

body.tmp-white-version .tmp-body-box-pattern::before {

  background-image: linear-gradient(#554a4a, transparent 1px), linear-gradient(to right, #0c0a0a, transparent 1px);

}

body.tmp-white-version .services-widget.v1 .service-item .my-skill-card .card-para {

  color: var(--color-heading);

}

body.tmp-white-version .services-widget.v1 .service-item.mleave .my-skill-card .card-para {

  color: var(--color-gray);

}

body.tmp-white-version.demo-model .banner-model-15 .title {

  color: #fff;

}

body.tmp-white-version .newsletter-form-1 input::placeholder,

body.tmp-white-version .newsletter-form-1 textarea::placeholder,

body.tmp-white-version input::placeholder,

body.tmp-white-version textarea::placeholder {

  color: var(--color-gray);

}

body.tmp-white-version .custom-title span img {

  filter: brightness(0.5);

}

body.tmp-white-version .rpp-banner-two-area .banner-shape-two img {

  opacity: 0.1;

}

body.tmp-white-version .banner-two-main-wrapper .banner-right-content .main-img::after {

  display: none;

}

body.tmp-white-version .banner-two-main-wrapper .banner-right-content .main-img .logo-under-img-wrap .logo-under-img img {

  filter: invert(1);

}

body.tmp-white-version .right-bg-text-para,

body.tmp-white-version .left-bg-text-para {

  display: none;

}

body.tmp-white-version .banner-main-demo-inner-content .absolute-designation .down {

  -webkit-text-stroke-color: #b1b1b1;

}

body.tmp-white-version .client-testimonial-swiper .swiper::before {

  background: linear-gradient(90deg, rgba(244, 244, 244, 0.6901960784) 0%, rgba(235, 231, 231, 0.05) 100%);

}

body.tmp-white-version .client-testimonial-swiper .swiper::after {

  background: linear-gradient(90deg, rgba(244, 244, 244, 0.6901960784) 0%, rgba(235, 231, 231, 0.05) 100%);

}

body.tmp-white-version .client-testimonial-card-wrap .quat-logo img,

body.tmp-white-version .my-skill-card .card-icon img {

  filter: inherit;

}

body.tmp-white-version .banner-three-main-wrapper .bg-benner-img-three::before {

  background: linear-gradient(180deg, rgba(7, 7, 7, 0) 27.58%, #d3b0b0 80.06%);

}

body.tmp-white-version svg.radial-progress text {

  fill: #141414;

}

body.tmp-white-version .service-item.current .my-expertise-card-wrap .expertise-card-left .expertise-card-logo img {

  filter: brightness(1);

}

body.tmp-white-version .service-item .my-expertise-card-wrap .expertise-card-left .expertise-card-logo img {

  filter: brightness(0.5);

}

body.tmp-white-version #side-hide,

body.tmp-white-version .breadcrumb-area,

body.tmp-white-version .tmp-sidebar-area .inner .top-area {

  background: #EDEDED;

}

body.tmp-white-version #side-hide .top-area,

body.tmp-white-version .contact-info {

  background: #ffffff;

}

body.tmp-white-version .tmp-round-action-btn {

  background: rgba(10, 10, 10, 0.06);

  color: var(--color-heading);

}

body.tmp-white-version .tmp-round-action-btn:hover {

  color: var(--color-white);

}

body.tmp-white-version .tmp-arrow-icon-btn:hover i.tmp-icon-bottom {

  color: var(--color-white);

}

body.tmp-white-version .signle-side-bar .tags-wrapper .tag-link {

  background: rgba(10, 10, 10, 0.06);

}

body.tmp-white-version .signle-side-bar .tags-wrapper .tag-link:hover {

  color: var(--color-white);

  background: var(--color-primary) !important;

}

body.tmp-white-version .logo img.logo-white {

  display: block;

}

body.tmp-white-version .logo img.logo-dark {

  display: none;

}

body.tmp-white-version .tmp-all-tab-content {

  background: #ffffff;

  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);

}

body.tmp-white-version .tmp-all-tab-content.no-shadow {

  background: transparent;

  box-shadow: none;

}

body.tmp-white-version .tmp-contact-about-inner .info-box {

  background: var(--color-white);

}

body.tmp-white-version .tmp-banner-one-area.style-2 {

  background-image: url(../images/bg/bg-image-9.jpg);

}

body.tmp-white-version .bg_image--8 {

  background-image: url(../images/bg/bg-image-8.jpg);

}

body.tmp-white-version.primary-yellow .bg_image--8 {

  background-image: url(../images/bg/04.webp);

}

body.tmp-white-version .tmp-banner-one-area.style-4 {

  background-image: url(../images/bg/bg-image-11.jpg);

}

body.tmp-white-version .tmp-popup-mobile-menu .header-top .close-menu .close-button {

  background: rgba(10, 10, 10, 0.06);

  color: var(--color-heading);

}

body.tmp-white-version .newslatter .newsletter-form-1 .form-icon i {

  color: #fff;

}

body.tmp-white-version .banner-two-main-wrapper .banner-right-content .main-img .banner-big-text-2 {

  -webkit-text-stroke: 1px #fff;

}

body.tmp-white-version .tmp-contact-about-inner {

  border-width: 1px;

}

body.tmp-white-version.personal-demo-left-fixed .skill-style-border-card img {

  filter: brightness(0) saturate(100%);

}

body.tmp-white-version.personal-demo-left-fixed .pricing-table-col-2 .pricing-table-header h4,

body.tmp-white-version.personal-demo-left-fixed .pricing-table-col-2 .pricing-table-header .top p,

body.tmp-white-version.personal-demo-left-fixed .pricing-table-col-2 .feature-lists li,

body.tmp-white-version.personal-demo-left-fixed .pricing-table-col-2 .pricing-table-header h3 span,

body.tmp-white-version.personal-demo-left-fixed .pricing-table-items .info,

body.tmp-white-version.personal-demo-left-fixed .experience-style-list .experience-list .resume-single-list:hover .inner .heading .title h4 {

  color: var(--color-heading);

}

body.tmp-white-version.personal-demo-left-fixed .tmp-footer-area-style-net .bg_patern-1 {

  background-color: rgba(255, 255, 255, 0.56) !important;

}

body.tmp-white-version.personal-demo-left-fixed .tmp-footer-area-style-net .bg_patern-1::after {

  opacity: 0.1;

}

body.tmp-white-version.personal-demo-left-fixed .experience-style-list .experience-list .resume-single-list {

  background: #f4f4f4;

}

body.tmp-white-version.personal-demo-left-fixed .experience-style-list .experience-list .resume-single-list .inner::after {

  border: 5px solid #e4e4e4;

  background: var(--color-primary);

}

body.tmp-white-version.personal-demo-left-fixed .experience-style-list .experience-list .resume-single-list .inner .heading .date-of-time span {

  background: var(--color-primary);

}

body.tmp-white-version.personal-demo-left-fixed .experience-style-list .experience-list .resume-single-list .inner .heading .title span {

  color: #333333;

  font-weight: 500;

}

body.tmp-white-version.personal-demo-left-fixed .experience-style-list .experience-list .resume-single-list .inner::before {

  background: #e4e4e4;

}

body.tmp-white-version.personal-demo-left-fixed .experience-style-list .experience-list {

  border-left: 5px solid #e4e4e4;

}

body.tmp-white-version.personal-demo-left-fixed .progress {

  background-color: #e4e4e4;

}

body.tmp-white-version.personal-demo-left-fixed .personal-portfolio-right-inner-wrapper .counter-style-2.border-style.small-radious .count-number {

  color: #141414 !important;

}

body.tmp-white-version.personal-demo-left-fixed .personal-portfolio-right-inner-wrapper .counter-style-2.border-style.small-radious .count-number span {

  color: #141414 !important;

}

body.tmp-white-version.personal-demo-left-fixed .experience-style-list .experience-list .resume-single-list .inner .heading {

  border-bottom: 1px solid #e8e8e8;

}

body.tmp-white-version.personal-demo-left-fixed .profile-image-1-personal-left-fixed::after {

  background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgba(0, 0, 0, 0) 100%);

  z-index: 0;

}

body.tmp-white-version.personal-demo-left-fixed .profile-image-1-personal-left-fixed .social-default li a {

  background-color: #ffffff;

}

body.tmp-white-version.personal-demo-left-fixed .profile-image-1-personal-left-fixed .social-default li a i {

  color: var(--color-primary);

}

body.tmp-white-version.personal-demo-left-fixed .profile-image-1-personal-left-fixed .social-default li a:hover i {

  color: #fff;

}

body.tmp-white-version.personal-demo-left-fixed .copyright-style-net .copyright-center ul li a {

  background: var(--color-primary);

}

body.tmp-white-version .banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .title {

  color: #fff;

}

body.tmp-white-version .banner-twelve-area.with-bg-image .social-share-style-1 a {

  background: #fff;

  box-shadow: none;

}

body.tmp-white-version .banner-twelve-area.with-bg-image {

  background-image: url("../image/IMG_0104.jpg") !important;

}

body.tmp-white-version .header-left-sticky .inner-wrapper::after {

  background: transparent;

}

body.tmp-white-version .for-animation-inner {

  background-image: none;

}

body.tmp-white-version .tmp-btn.tmp-modern-button:hover {

  background: var(--icon-gradient);

}

body.tmp-white-version .tmp-btn.tmp-modern-button:hover .btn-bg-hover {

  opacity: 0;

}

body.tmp-white-version .tmp-btn.tmp-modern-button:hover .btn-bg {

  opacity: 0;

}

body.tmp-white-version .section-head .pre-title::before {

  background: radial-gradient(92.46% 222.14% at 15.65% -7.58%, rgb(127, 226, 251) 0%, rgb(127, 226, 251) 100%) border-box;

}

body.tmp-white-version .tmp-portfolio-single-card {

  background: var(--color-border);

}

body.tmp-white-version .tmp-btn.tmp-modern-button .btn-bg {

  display: none;

}

body.tmp-white-version .tmp-btn.tmp-modern-button {
	border: 2px solid var(--color-border);
	box-shadow: var(--shadow-white);
	background: var(--gradient-white);
	color: #000 !important;
	justify-content: center;
	margin: 0 auto;
	display: block;
	width: fit-content;
}

body.tmp-white-version .footer-stars-animation-wrapper-footer .slider-bg-light {

  display: none;

}

body.tmp-white-version .tmp-btn.tmp-modern-button:hover {

  border-color: var(--color-primary);

}

body.tmp-white-version .tmp-btn.tmp-modern-button .btn-hack::after {

  background: conic-gradient(from 148deg, transparent 46%, #333333 50%, transparent 54%);

}

body.tmp-white-version .profile-image-1-personal-left-fixed .title {

  color: #ffffff;

}

body.tmp-white-version .tmponhover::after {

  display: none;

}

body.tmp-white-version .tmponhover,

body.tmp-white-version .tmp-contact-about-inner,

body.tmp-white-version .tab-navigation-button,

body.tmp-white-version .for-animation-inner,

body.tmp-white-version .progress-charts .progress,

body.tmp-white-version .about-us-left-content-wrap .years-of-experience-card,

body.tmp-white-version .about-us-left-content-wrap .design-card,

body.tmp-white-version .social-link a,

body.tmp-white-version .tmp-intro-video-card-wrapper,

body.tmp-white-version .tmp-iv-close-button,

body.tmp-white-version .my-skill-card .card-icon::after,

body.tmp-white-version .service-card-v1,

body.tmp-white-version .client-testimonial-card-wrap,

body.tmp-white-version .tmp-profile-card.services-card .services-item,

body.tmp-white-version #tmp-page-content-bento .profile-picture-area .info-box,

body.tmp-white-version .tmp-profile-card .work-experiance-card .work-experiance-slider li,

body.tmp-white-version .tmp-profile-card .expertise-card .expertise-item .image,

body.tmp-white-version .experience-style-list .experience-list .resume-single-list,

body.tmp-white-version .modal .modal-dialog .modal-content,

body.tmp-white-version .modal .modal-dialog .modal-content .modal-header .close span::after,

body.tmp-white-version .tmp-popup-mobile-menu .inner {

  background: var(--gradient-white);

}

body.tmp-white-version .tmponhover,

body.tmp-white-version .tab-navigation-button .nav-item .nav-link,

body.tmp-white-version .tmp-contact-form.contact-form-style-1,

body.tmp-white-version .contact-info-box,

body.tmp-white-version .blog-card-style-two,

body.tmp-white-version .about-us-left-content-wrap .years-of-experience-card,

body.tmp-white-version .about-us-left-content-wrap .design-card,

body.tmp-white-version .social-link a,

body.tmp-white-version .tmp-intro-video-card-wrapper,

body.tmp-white-version .tmp-iv-close-button,

body.tmp-white-version .service-card-v1,

body.tmp-white-version .latest-portfolio-tabs-area .nav .nav-link,

body.tmp-white-version .client-testimonial-card-wrap,

body.tmp-white-version .tmp-profile-card.services-card .services-item,

body.tmp-white-version #tmp-page-content-bento .profile-picture-area .info-box,

body.tmp-white-version .tmp-profile-card .expertise-card .expertise-item .image,

body.tmp-white-version .experience-style-list .experience-list .resume-single-list,

body.tmp-white-version .modal .modal-dialog .modal-content,

body.tmp-white-version .modal .modal-dialog .modal-content .modal-header .close span::after {

  box-shadow: var(--shadow-white);

}

body.tmp-white-version .tmponhover,

body.tmp-white-version .tmp-contact-about-inner,

body.tmp-white-version .tab-navigation-button .nav-item .nav-link,

body.tmp-white-version .tmp-contact-form.contact-form-style-1,

body.tmp-white-version .contact-info-box,

body.tmp-white-version .service-card-v1,

body.tmp-white-version .client-testimonial-card-wrap {

  border: 0 none;

}

body.tmp-white-version .tmp-profile-card.services-card .services-item .image img {

  filter: brightness(0);

}

body.tmp-white-version .latest-portfolio-tabs-area .nav .nav-link.active {

  background: var(--color-primary) !important;

  color: #ffffff;

}

body.tmp-white-version .latest-portfolio-tabs-area .nav .nav-link::after {

  display: none;

}

body.tmp-white-version .tmp-swiper-pagination.tmp-swiper-pagination-01 .swiper-pagination-bullet {

  box-shadow: inset 0 0 0 7px #eef1f4;

}

body.tmp-white-version .tmp-swiper-pagination.tmp-swiper-pagination-01 .swiper-pagination-bullet.swiper-pagination-bullet-active {

  box-shadow: inset 0 0 0 1px var(--color-primary);

}

body.tmp-white-version .tmp-contact-form.contact-form-style-1.in-bentogrid {

  box-shadow: none;

}

body.tmp-white-version .tmp-profile-card.services-card .services-item .image {

  background: transparent;

}

body.tmp-white-version .skill-style-border-card img {

  filter: brightness(0);

}

body.tmp-white-version .modal {

  background: #ffffff;

}

body.tmp-white-version .modal .modal-dialog .modal-content .modal-header .close span svg,

body.tmp-white-version .modal .modal-dialog .modal-content .modal-header .close span {

  color: var(--color-heading);

}

body.tmp-white-version .progress {

  background-color: #f9f9f9;

}

body.tmp-white-version .tpm-custom-box-bg,

body.tmp-white-version .get-in-touch-wrapper,

body.tmp-white-version .experiences-wrapper .experiences-wrap-right-content {

  box-shadow: var(--shadow-white);

}

body.tmp-white-version .year-of-expariance-wrapper {

  box-shadow: var(--shadow-white);

}

body.tmp-white-version.index-ten .tmp-contact-about-inner {

  box-shadow: var(--shadow-white);

}

body.tmp-white-version .profile-image-1-personal-left-fixed .inner-content {

  background: #f4f4f4;

  box-shadow: var(--shadow-white);

  overflow: visible;

}

body.tmp-white-version .profile-image-1-personal-left-fixed {

  overflow: visible;

}

body.tmp-white-version .page-with-left-header .get-in-touch-wrapper {

  box-shadow: none;

}



.tmp-white-version .tmp-right-demo .demo-button::before {

  content: "";

  background: linear-gradient(-45deg, #ee7752, #ff004b, #ff004b, #d52323);

  background-size: 400% 400%;

  animation: gradient 4s ease infinite;

  opacity: 1;

  backdrop-filter: blur(21px);

}

.tmp-white-version .tmp-right-demo * {

  color: #fff !important;

}

.tmp-white-version.index-8 .tmp-contact-about-inner::after {

  display: none !important;

}

.tmp-white-version.video-bg-image-bg-green {

  background-image: url(../images/bg/06.webp);

}

.tmp-white-version .tmp-profile-card .work-experiance-card .work-experiance-slider li .info .icon {

  background-color: rgba(213, 213, 213, 0.38);

}

.tmp-white-version .experience-style-list .experience-list .resume-single-list:hover .inner .heading .title h4 {

  color: var(--color-heading);

}



.tmp-white-version .tmp-banner-one-area.style-3 .thumbnail-author img, .tmp-white-version .tmp-banner-one-area.style-4 .thumbnail-author img {

  border: 25px solid #ebebeb;

}



.index-ten .tmp-contact-about-inner {

  flex-direction: column;

}

@media only screen and (max-width: 767px) {

  .index-ten .tmp-contact-about-inner .thumbnail img {

    max-width: 100%;

    margin-bottom: 30px;

  }

}



.tmp-white-version .year-of-expariance-wrapper.bg-blur-style-one::after {

  display: none;

}

.tmp-white-version .tmponhover:hover .tmp-light, .tmp-white-version .tmponhover.active .tmp-light {

  opacity: 0;

}

.tmp-white-version .services-widget.v1 .my-skill-card .card-icon {

  border: 2px solid #fff;

}

.tmp-white-version .color-primary-2nd .services-widget.v1 .my-skill-card .card-icon i {

  color: var(--color-heading);

}

.tmp-white-version .about-us-left-content-wrap .design-card .design-card-img {

  border: 2px solid var(--color-primary);

}

.tmp-white-version .color-primary-2nd .services-widget.v2 .active-bg {

  background: var(--color-primary);

}

.tmp-white-version .color-primary-2nd .my-expertise-card-wrap .expertise-card-left .expertise-card-logo img {

  filter: brightness(0) saturate(100%) !important;

}

.tmp-white-version .my-expertise-card-wrap .expertise-card-left .expertise-card-logo {

  border: 2px solid #141414;

}

.tmp-white-version .rpp-banner-two-area::before {

  display: none;

}

.tmp-white-version .rpp-banner-two-area::after {

  display: none;

}

.tmp-white-version .banner-three-main-wrapper .bg-benner-img-three::before {

  display: none;

}

.tmp-white-version .services-widget.v4 .active-bg {

  background: rgb(253, 196, 72);

}

.tmp-white-version .tmp-banner-one-area.style-4 .galaxy {

  opacity: 0.07;

}



body.tmp-white-version.color-primary-3rd .services-widget.v2 .active-bg {

  background: rgb(255, 193, 7);

}



.demo-modal-area .wrapper .tmp-modal-inner .demo-top .subtitle {

  color: #c2c2c2 !important;

}



.active-light.demo-modal-area .wrapper .tmp-modal-inner .demo-top .subtitle {

  color: #3d3d3d !important;

}

.social-link a.facebook::after {

    background: var(--color-facebook);

}

.social-link a.twitter::after {

    background: var(--color-twitter);

}

.social-link a.youtube::after {

    background: var(--color-youtube);

}

.social-link a.linkedin::after {

    background: var(--color-linkedin);

}

.social-link a.whatsapp::after {

    background: var(--color-whatsapp);

}

.social-link a.instagram::after {

    background: var(--color-instagram);

}

.education-experience-card .card-icon{

    position: absolute;

    right: 20px;

    top: 17px;

}

@media only screen and (max-width: 767px) {

    .tmp-responsive-header-style .logo img {

        width: 96px;

        height: 96px;

        object-fit: cover;

        border-radius: 50%;

        object-position: top;

    }

    .service-card-v2 .service-card-num{

        height: auto;

    }

    .section-head .section-sub-title{

        justify-content: center;

    }

    .banner-one-main-wrapper .inner .title{

        margin-top: 304px;

    }
    .tmp-popup-mobile-menu .tmp-mainmenu svg{
        color: #04d5fb;
        margin-right: 15px;
    }
    .banner-twelve-area.with-bg-image .social-share-style-1{
        margin-top: 15px;
        margin-bottom: 15px
    }
}

@media only screen and (min-width: 1290px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl{
        max-width: 1000px;
    }
    .banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .title {
        font-size: 57px;
        margin-top: 227px;
    }
    .banner-twelve-area.with-bg-image .banner-one-main-wrapper .inner .sub-title {
        font-size: 22px;
        line-height: 37px;
    }
    .tmp-section-gapTop{
        padding-top: 80px
    }
    .tmp-section-gapBottom{
        padding-bottom: 80px
    }
    #research .education-experience-card .edu-para{
        max-width: 80%;
    }
}
@media only screen and (min-width: 1490px) {
    .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl{
        max-width: 990px;
    }
}