:root {
--heading-color: #0a165e;
--body-color: #585b6f;
--accent-color: #2b4dff;
--white-color: #ffffff;
--light-color1: #e3e3ec;
--light-color2: #ced0df;
--dark-bg: #040d43;
--dark-bg2: #1e2656;
--dark-bg3: #0a165e;
--white-bg: #ffffff;
--accent-bg: #2b4dff;
--light-bg1: #f5f6f7;
--light-bg2: #e2e3ec;
--light-bg3: #eef1ff;
}
@media only screen and (min-width: 1350px) {
.elementor-section.elementor-section-boxed > .elementor-container {
max-width: 1296px;
}
}
@media only screen and (min-width: 1350px) {
.e-con {
--container-max-width: 1296px;
}
}
@media only screen and (max-width: 1024px) and (min-width: 768px) {
.elementor-section.elementor-section-boxed > .elementor-container {
max-width: 900px !important;
}
.e-con {
--container-max-width: 900px !important;
}
} .header-logo {
max-width: 270px;
padding: 15px 0;
}
.main-menu a {
color: #0a165e;
font-weight: 500;
position: relative;
font-size: 16px;
display: block;
letter-spacing: -0.01em;
}
.main-menu > ul > li {
margin: 0 14px;
}
.main-menu ul {
margin: 0;
padding: 0;
}
.main-menu ul li {
list-style-type: none;
display: inline-block;
position: relative;
}
.main-menu ul li.menu-item-has-children > a:after {
content: '\ea4d';
position: relative;
margin-left: 2px;
top: 2px;
font-size: 20px;
display: inline-block;
font-family: 'remixicon';
transition: all 0.4s ease-in-out;
}
.main-menu ul li:hover.menu-item-has-children > a:after {
transform: rotate(-180deg);
}
.main-menu ul li:last-child {
margin-right: 0;
}
.main-menu ul li:first-child {
margin-left: 0;
}
.main-menu ul li:hover > ul.sub-menu {
visibility: visible;
opacity: 1;
margin-top: 0;
z-index: 9;
}
.main-menu ul.sub-menu {
position: absolute;
text-align: left;
top: 100%;
left: 0;
background-color: #ffffff;
visibility: hidden;
min-width: 240px;
width: max-content;
padding: 7px;
left: -14px;
margin-top: 50px;
opacity: 0;
z-index: -1;
box-shadow: -2px 2px 70px -25px rgba(0, 0, 0, 0.3);
transform-origin: top center;
transition: margin-top 0.4s ease-in-out 0s, visibility 0.4s ease-in-out 0s, opacity 0.4s ease-in-out 0s, z-index 0s;
}
.main-menu ul.sub-menu li a {
font-size: 16px;
line-height: 30px;
display: inline-block;
position: relative;
font-weight: 400;
text-transform: capitalize;
}
.main-menu ul.sub-menu li a::before {
content: '';
position: absolute;
bottom: -3px;
left: auto;
right: 0;
height: 2px;
width: 0;
background-color: #0a165e;
transition: all 0.3s ease;
}
.main-menu ul.sub-menu li a:hover::before {
left: 0;
right: auto;
width: 100%;
}
.main-menu ul.sub-menu li.menu-item-has-children a.no-border {
display: block;
}
.main-menu ul.sub-menu li.menu-item-has-children a.no-border::before {
content: none;
}
.main-menu ul.sub-menu li.menu-item-has-children > a.no-border:after {
position: absolute;
right: 0;
content: '\ea6d';
}
.main-menu ul.sub-menu li.menu-item-has-children:hover a::after {
transform: rotate(-90deg) !important;
}
.main-menu ul.sub-menu li ul.sub-menu {
transition: all 0.4s;
margin-left: 0px !important;
transform: translateY(30px);
}
.main-menu ul.sub-menu li:hover ul.sub-menu {
transform: translateY(0px);
}
.main-menu .main-menu ul.sub-menu > a .sub-menu-item.menu-item-has-children::before {
content: '';
position: absolute;
bottom: -3px;
left: auto;
right: 0;
height: 0 !important;
width: 0;
background-color: #0a165e;
transition: all 0.3s ease;
}
.main-menu ul.sub-menu {
padding: 12px 0;
left: -27px;
}
.main-menu ul.sub-menu li {
display: block;
margin: 0 0;
padding: 4px 10px 4px 20px;
}
.main-menu ul.sub-menu li ul.sub-menu {
left: 100%;
right: auto;
top: 0;
margin: 0 0;
margin-left: 20px;
}
.main-menu ul.sub-menu li ul.sub-menu li ul {
left: 100%;
right: auto;
}
ul.sub-menu li a {
color: #0a165e !important;
}
.menu-style1 > ul > li > a {
padding: 30px 0;
} .mirror-menu-wrapper {
position: fixed; 
top: 0;
left: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.6);
z-index: 999999;
width: 100%;
height: 100%;
transition: all ease 0.8s;
opacity: 0;
visibility: hidden;
}
.mirror-menu-wrapper .mobile-logo {
display: block;
text-align: left;
max-width: 120px;
background-color: #ffffff;
}
.mirror-menu-wrapper .mirror-menu-toggle {
width: 55px;
height: 55px;
line-height: 55px;
font-size: 18px;
z-index: 1;
color: #fff;
display: flex;
border-radius: 0;
align-items: center;
justify-content: center;
background-color: transparent;
border-left: 1px solid rgba(0, 0, 0, 0.1);
}
.mirror-menu-wrapper .mirror-menu-toggle i {
color: #000;
}
.mirror-menu-wrapper .mirror-menu-area {
width: 100%;
max-width: 310px;
background-color: #ffffff;
height: 100%;
position: relative;
left: -110%;
opacity: 0;
visibility: hidden;
transition: all ease 1s;
z-index: 1;
}
.mirror-menu-wrapper.mirror-body-visible {
opacity: 1;
visibility: visible;
}
.mirror-menu-wrapper.mirror-body-visible .mirror-menu-area {
left: 0;
opacity: 1;
visibility: visible;
}
.mirror-mobile-menu {
overflow-y: scroll;
max-height: calc(100vh - 200px);
text-align: left;
}
.mirror-mobile-menu::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 2px rgba(232, 6, 60, 0.2);
background-color: #000;
}
.mirror-mobile-menu::-webkit-scrollbar {
width: 2px;
background-color: #000;
}
.mirror-mobile-menu::-webkit-scrollbar-thumb {
background-color: #0a165e;
}
.mirror-mobile-menu ul {
margin: 0;
padding: 0 0;
}
.mirror-mobile-menu ul li {
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
list-style-type: none;
}
.mirror-mobile-menu ul li li:first-child {
border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.mirror-mobile-menu ul li a {
display: block;
position: relative;
padding: 15px;
line-height: 1;
font-size: 16px;
text-transform: capitalize;
color: #000 !important;
font-weight: 500;
}
.mirror-mobile-menu ul li.mirror-active > a {
color: #2b4dff;
}
.mirror-mobile-menu ul li.mirror-active > a:before {
transform: rotate(90deg);
}
.mirror-mobile-menu ul li ul li {
padding-left: 10px;
}
.mirror-mobile-menu ul .mirror-item-has-children > a .mirror-mean-expand {
position: absolute;
right: 0;
top: 3px;
font-weight: 400;
font-size: 16px;
width: 60%;
height: 40px;
padding: 0 15px;
line-height: 40px;
display: flex;
align-items: center;
justify-content: flex-end;
text-align: center;
background-color: #ffffff;
color: #000;
transition: all ease 0.4s;
}
.mirror-mobile-menu ul .mirror-item-has-children > a .mirror-mean-expand:before {
content: '\ea6d';
display: inline-block;
transition: all ease 0.3s;
font-family: 'remixicon' !important;
font-size: 20px;
}
.mirror-mobile-menu ul .mirror-item-has-children.mirror-active > a .mirror-mean-expand:before {
transform: rotate(-90deg);
}
.mirror-mobile-menu > ul > li:first-child {
border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.mirror-menu-toggle {
width: 50px;
height: 50px;
padding: 0;
font-size: 24px;
border: none;
background-color: #2b4dff;
color: #0a165e;
display: inline-block;
border-radius: 6px;
}
.mirror-menu-toggle i {
font-size: 24px;
color: #ffffff;
}
.mirror-menu-mobile-top {
display: flex;
align-items: center;
justify-content: space-between;
padding-left: 15px;
}
@media (max-width: 400px) {
.mirror-menu-wrapper .mirror-menu-area {
width: 100%;
}
}
.mirror-mobile-menu-btn {
display: flex;
justify-content: center;
flex-wrap: wrap;
gap: 15px;
padding: 0 15px;
padding-top: 50px;
}
a.mirror-default-btn {
font-size: 16px;
line-height: 1;
padding: 18px 21px;
border-radius: 6px;
font-weight: 600;
font-family: Sora, sans-serif;
width: fit-content;
white-space: nowrap;
text-overflow: ellipsis;
display: inline-flex;
align-items: center;
text-align: center;
-o-transition: all 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
color: #ffffff !important;
background-color: #2b4dff;
z-index: 0;
overflow: hidden;
position: relative;
letter-spacing: -0.01em;
text-transform: capitalize;
transform-style: preserve-3d;
}
.mirror-menu-toggle {
display: none;
}
@media (max-width: 1024px) {
.main-menu {
display: none;
}
.mirror-menu-toggle {
display: block;
}
}  [data-anime],
[data-anime] .e-con {
transition: 0s !important;
} .cta-custom {
background-size: 100% 100% !important;
position: relative;
}
.cta-custom::after {
content: '';
right: 0;
bottom: 0;
width: 0;
height: 0;
opacity: 1;
border-radius: 0;
position: absolute;
}
.cta-custom::before {
content: '';
left: 0;
top: 0;
width: 0;
height: 0;
opacity: 1;
border-radius: 0;
position: absolute;
}
@media (max-width: 1399px) {
.cta-custom {
padding: 80px;
}
}
@media (max-width: 1024px) {
.cta-custom {
background-color: var(--accent-bg);
}
.cta-custom::after {
border-bottom: 60px solid #fff;
border-left: 60px solid transparent;
}
.cta-custom::before {
border-top: 60px solid #fff;
border-right: 60px solid transparent;
}
} .animated {
transition: all 0.5s ease;
}
[data-animation-in] {
opacity: 0;
-webkit-animation-duration: 1.5s;
animation-duration: 1.5s;
transition: opacity 0.5s ease 0.3s;
}
@-webkit-keyframes zoomInImage {
from {
transform: scale3d(1, 1, 1);
}
to {
transform: scale3d(1.1, 1.1, 1.1);
}
}
@keyframes zoomInImage {
from {
transform: scale3d(1, 1, 1);
}
to {
transform: scale3d(1.1, 1.1, 1.1);
}
}
.zoomInImage {
-webkit-animation-name: zoomInImage;
animation-name: zoomInImage;
transform: scale3d(1.1, 1.1, 1.1);
} .optech-social-icon-box ul li a {
position: relative;
overflow: hidden;
}
.socail-show,
.socail-hide {
position: absolute;
transition: transform 0.2s;
display: flex;
}
.socail-hide {
transform: translateY(35px);
}
.optech-social-icon-box ul li a:hover .socail-hide {
transform: translateY(0px);
}
.optech-social-icon-box ul li a:hover .socail-show {
transform: translateY(-35px);
}@keyframes bounce {
20%,
53%,
80%,
from,
to {
animation-timing-function: cubic-bezier(.215, .61, .355, 1);
transform: translate3d(0, 0, 0)
}
40%,
43% {
animation-timing-function: cubic-bezier(.755, .050, .855, .060);
transform: translate3d(0, -30px, 0)
}
70% {
animation-timing-function: cubic-bezier(.755, .050, .855, .060);
transform: translate3d(0, -15px, 0)
}
90% {
transform: translate3d(0, -4px, 0)
}
}
.bounce {
animation-name: bounce;
transform-origin: center bottom
}
@keyframes flash {
50%,
from,
to {
opacity: 1
}
25%,
75% {
opacity: 0
}
}
.flash {
animation-name: flash
}
@keyframes pulse {
from,
to {
transform: scale3d(1, 1, 1)
}
50% {
transform: scale3d(1.05, 1.05, 1.05)
}
}
.pulse {
animation-name: pulse
}
@keyframes rubberBand {
from,
to {
transform: scale3d(1, 1, 1)
}
30% {
transform: scale3d(1.25, .75, 1)
}
40% {
transform: scale3d(.75, 1.25, 1)
}
50% {
transform: scale3d(1.15, .85, 1)
}
65% {
transform: scale3d(.95, 1.05, 1)
}
75% {
transform: scale3d(1.05, .95, 1)
}
}
.rubberBand {
animation-name: rubberBand
}
@keyframes shake {
from,
to {
transform: translate3d(0, 0, 0)
}
10%,
30%,
50%,
70%,
90% {
transform: translate3d(-10px, 0, 0)
}
20%,
40%,
60%,
80% {
transform: translate3d(10px, 0, 0)
}
}
.shake {
animation-name: shake
}
@keyframes headShake {
0% {
transform: translateX(0)
}
6.5% {
transform: translateX(-6px) rotateY(-9deg)
}
18.5% {
transform: translateX(5px) rotateY(7deg)
}
31.5% {
transform: translateX(-3px) rotateY(-5deg)
}
43.5% {
transform: translateX(2px) rotateY(3deg)
}
50% {
transform: translateX(0)
}
}
.headShake {
animation-timing-function: ease-in-out;
animation-name: headShake
}
@keyframes swing {
20% {
transform: rotate3d(0, 0, 1, 15deg)
}
40% {
transform: rotate3d(0, 0, 1, -10deg)
}
60% {
transform: rotate3d(0, 0, 1, 5deg)
}
80% {
transform: rotate3d(0, 0, 1, -5deg)
}
to {
transform: rotate3d(0, 0, 1, 0deg)
}
}
.swing {
transform-origin: top center;
animation-name: swing
}
@keyframes tada {
from,
to {
transform: scale3d(1, 1, 1)
}
10%,
20% {
transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)
}
30%,
50%,
70%,
90% {
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
}
40%,
60%,
80% {
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
}
}
.tada {
animation-name: tada
}
@keyframes wobble {
from,
to {
transform: none
}
15% {
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg)
}
30% {
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg)
}
45% {
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg)
}
60% {
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg)
}
75% {
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg)
}
}
.wobble {
animation-name: wobble
}
@keyframes jello {
11.1%,
from,
to {
transform: none
}
22.2% {
transform: skewX(-12.5deg) skewY(-12.5deg)
}
33.3% {
transform: skewX(6.25deg) skewY(6.25deg)
}
44.4% {
transform: skewX(-3.125deg) skewY(-3.125deg)
}
55.5% {
transform: skewX(1.5625deg) skewY(1.5625deg)
}
66.6% {
transform: skewX(-.78125deg) skewY(-.78125deg)
}
77.7% {
transform: skewX(.390625deg) skewY(.390625deg)
}
88.8% {
transform: skewX(-.1953125deg) skewY(-.1953125deg)
}
}
.jello {
animation-name: jello;
transform-origin: center
}
@keyframes bounceIn {
20%,
40%,
60%,
80%,
from,
to {
animation-timing-function: cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity: 0;
transform: scale3d(.3, .3, .3)
}
20% {
transform: scale3d(1.1, 1.1, 1.1)
}
40% {
transform: scale3d(.9, .9, .9)
}
60% {
opacity: 1;
transform: scale3d(1.03, 1.03, 1.03)
}
80% {
transform: scale3d(.97, .97, .97)
}
to {
opacity: 1;
transform: scale3d(1, 1, 1)
}
}
.bounceIn {
animation-name: bounceIn
}
@keyframes bounceInDown {
60%,
75%,
90%,
from,
to {
animation-timing-function: cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity: 0;
transform: translate3d(0, -3000px, 0)
}
60% {
opacity: 1;
transform: translate3d(0, 25px, 0)
}
75% {
transform: translate3d(0, -10px, 0)
}
90% {
transform: translate3d(0, 5px, 0)
}
to {
transform: none
}
}
.bounceInDown {
animation-name: bounceInDown
}
@keyframes bounceInLeft {
60%,
75%,
90%,
from,
to {
animation-timing-function: cubic-bezier(.215, .61, .355, 1)
}
0% {
opacity: 0;
transform: translate3d(-3000px, 0, 0)
}
60% {
opacity: 1;
transform: translate3d(25px, 0, 0)
}
75% {
transform: translate3d(-10px, 0, 0)
}
90% {
transform: translate3d(5px, 0, 0)
}
to {
transform: none
}
}
.bounceInLeft {
animation-name: bounceInLeft
}
@keyframes bounceInRight {
60%,
75%,
90%,
from,
to {
animation-timing-function: cubic-bezier(.215, .61, .355, 1)
}
from {
opacity: 0;
transform: translate3d(3000px, 0, 0)
}
60% {
opacity: 1;
transform: translate3d(-25px, 0, 0)
}
75% {
transform: translate3d(10px, 0, 0)
}
90% {
transform: translate3d(-5px, 0, 0)
}
to {
transform: none
}
}
.bounceInRight {
animation-name: bounceInRight
}
@keyframes bounceInUp {
60%,
75%,
90%,
from,
to {
animation-timing-function: cubic-bezier(.215, .61, .355, 1)
}
from {
opacity: 0;
transform: translate3d(0, 3000px, 0)
}
60% {
opacity: 1;
transform: translate3d(0, -20px, 0)
}
75% {
transform: translate3d(0, 10px, 0)
}
90% {
transform: translate3d(0, -5px, 0)
}
to {
transform: translate3d(0, 0, 0)
}
}
.bounceInUp {
animation-name: bounceInUp
}
@keyframes fadeIn {
from {
opacity: 0
}
to {
opacity: 1
}
}
.fadeIn {
animation-name: fadeIn
}
@keyframes fadeInDown {
from {
opacity: 0;
transform: translate3d(0, -30%, 0)
}
to {
opacity: 1;
transform: none
}
}
.fadeInDown {
animation-name: fadeInDown
}
@keyframes fadeInLeft {
from {
opacity: 0;
transform: translate3d(-30%, 0, 0)
}
to {
opacity: 1;
transform: none
}
}
.fadeInLeft {
animation-name: fadeInLeft
}
@keyframes fadeInRight {
from {
opacity: 0;
transform: translate3d(30%, 0, 0)
}
to {
opacity: 1;
transform: none
}
}
.fadeInRight {
animation-name: fadeInRight
}
@keyframes fadeInUp {
from {
opacity: 0;
transform: translate3d(0, 30%, 0)
}
to {
opacity: 1;
transform: none
}
}
.fadeInUp {
animation-name: fadeInUp
}
@keyframes lightSpeedIn {
from {
transform: translate3d(30%, 0, 0) skewX(-30deg);
opacity: 0
}
60% {
transform: skewX(20deg);
opacity: 1
}
80% {
transform: skewX(-5deg);
opacity: 1
}
to {
transform: none;
opacity: 1
}
}
.lightSpeedIn {
animation-name: lightSpeedIn;
animation-timing-function: ease-out
}
@keyframes rotateIn {
from {
transform-origin: center;
transform: rotate3d(0, 0, 1, -200deg);
opacity: 0
}
to {
transform-origin: center;
transform: none;
opacity: 1
}
}
.rotateIn {
animation-name: rotateIn
}
@keyframes rotateInDownLeft {
from {
transform-origin: left bottom;
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0
}
to {
transform-origin: left bottom;
transform: none;
opacity: 1
}
}
.rotateInDownLeft {
animation-name: rotateInDownLeft
}
@keyframes rotateInDownRight {
from {
transform-origin: right bottom;
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0
}
to {
transform-origin: right bottom;
transform: none;
opacity: 1
}
}
.rotateInDownRight {
animation-name: rotateInDownRight
}
@keyframes rotateInUpLeft {
from {
transform-origin: left bottom;
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0
}
to {
transform-origin: left bottom;
transform: none;
opacity: 1
}
}
.rotateInUpLeft {
animation-name: rotateInUpLeft
}
@keyframes rotateInUpRight {
from {
transform-origin: right bottom;
transform: rotate3d(0, 0, 1, -90deg);
opacity: 0
}
to {
transform-origin: right bottom;
transform: none;
opacity: 1
}
}
.rotateInUpRight {
animation-name: rotateInUpRight
}
@keyframes rollIn {
from {
opacity: 0;
transform: translate3d(-30%, 0, 0) rotate3d(0, 0, 1, -120deg)
}
to {
opacity: 1;
transform: none
}
}
.rollIn {
animation-name: rollIn
}
@keyframes zoomIn {
from {
opacity: 0;
transform: scale3d(.3, .3, .3)
}
50% {
opacity: 1
}
}
.zoomIn {
animation-name: zoomIn
}
@keyframes zoomInDown {
from {
opacity: 0;
transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
animation-timing-function: cubic-bezier(.55, .055, .675, .19)
}
60% {
opacity: 1;
transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
animation-timing-function: cubic-bezier(.175, .885, .32, 1)
}
}
.zoomInDown {
animation-name: zoomInDown
}
@keyframes zoomInLeft {
from {
opacity: 0;
transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
animation-timing-function: cubic-bezier(.55, .055, .675, .19)
}
60% {
opacity: 1;
transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
animation-timing-function: cubic-bezier(.175, .885, .32, 1)
}
}
.zoomInLeft {
animation-name: zoomInLeft
}
@keyframes zoomInRight {
from {
opacity: 0;
transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
animation-timing-function: cubic-bezier(.55, .055, .675, .19)
}
60% {
opacity: 1;
transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
animation-timing-function: cubic-bezier(.175, .885, .32, 1)
}
}
.zoomInRight {
animation-name: zoomInRight
}
@keyframes zoomInUp {
from {
opacity: 0;
transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
animation-timing-function: cubic-bezier(.55, .055, .675, .19)
}
60% {
opacity: 1;
transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
animation-timing-function: cubic-bezier(.175, .885, .32, 1)
}
}
.zoomInUp {
animation-name: zoomInUp
}
@keyframes slideInDown {
from {
transform: translate3d(0, -30%, 0);
visibility: visible
}
to {
transform: translate3d(0, 0, 0)
}
}
.slideInDown {
animation-name: slideInDown
}
@keyframes slideInLeft {
from {
transform: translate3d(-30%, 0, 0);
visibility: visible
}
to {
transform: translate3d(0, 0, 0)
}
}
.slideInLeft {
animation-name: slideInLeft
}
@keyframes slideInRight {
from {
transform: translate3d(30%, 0, 0);
visibility: visible
}
to {
transform: translate3d(0, 0, 0)
}
}
.slideInRight {
animation-name: slideInRight
}
@keyframes slideInUp {
from {
transform: translate3d(0, 30%, 0);
visibility: visible
}
to {
transform: translate3d(0, 0, 0)
}
}
.slideInUp {
animation-name: slideInUp
}
.elementor-animation-grow {
transition-duration: .3s;
transition-property: transform
}
.elementor-animation-grow:active,
.elementor-animation-grow:focus,
.elementor-animation-grow:hover {
transform: scale(1.1)
}
.elementor-animation-shrink {
transition-duration: .3s;
transition-property: transform
}
.elementor-animation-shrink:active,
.elementor-animation-shrink:focus,
.elementor-animation-shrink:hover {
transform: scale(0.9)
}
@keyframes elementor-animation-pulse {
25% {
transform: scale(1.1)
}
75% {
transform: scale(0.9)
}
}
.elementor-animation-pulse:active,
.elementor-animation-pulse:focus,
.elementor-animation-pulse:hover {
animation-name: elementor-animation-pulse;
animation-duration: 1s;
animation-timing-function: linear;
animation-iteration-count: infinite
}
@keyframes elementor-animation-pulse-grow {
to {
transform: scale(1.1)
}
}
.elementor-animation-pulse-grow:active,
.elementor-animation-pulse-grow:focus,
.elementor-animation-pulse-grow:hover {
animation-name: elementor-animation-pulse-grow;
animation-duration: .3s;
animation-timing-function: linear;
animation-iteration-count: infinite;
animation-direction: alternate
}
@keyframes elementor-animation-pulse-shrink {
to {
transform: scale(0.9)
}
}
.elementor-animation-pulse-shrink:active,
.elementor-animation-pulse-shrink:focus,
.elementor-animation-pulse-shrink:hover {
animation-name: elementor-animation-pulse-shrink;
animation-duration: .3s;
animation-timing-function: linear;
animation-iteration-count: infinite;
animation-direction: alternate
}
@keyframes elementor-animation-push {
50% {
transform: scale(0.8)
}
30% {
transform: scale(1)
}
}
.elementor-animation-push:active,
.elementor-animation-push:focus,
.elementor-animation-push:hover {
animation-name: elementor-animation-push;
animation-duration: .3s;
animation-timing-function: linear;
animation-iteration-count: 1
}
@keyframes elementor-animation-pop {
50% {
transform: scale(1.2)
}
}
.elementor-animation-pop:active,
.elementor-animation-pop:focus,
.elementor-animation-pop:hover {
animation-name: elementor-animation-pop;
animation-duration: .3s;
animation-timing-function: linear;
animation-iteration-count: 1
}
.elementor-animation-bounce-in {
transition-duration: .5s
}
.elementor-animation-bounce-in:active,
.elementor-animation-bounce-in:focus,
.elementor-animation-bounce-in:hover {
transform: scale(1.2);
transition-timing-function: cubic-bezier(0.47, 2.02, .31, -.36)
}
.elementor-animation-bounce-out {
transition-duration: .5s
}
.elementor-animation-bounce-out:active,
.elementor-animation-bounce-out:focus,
.elementor-animation-bounce-out:hover {
transform: scale(0.8);
transition-timing-function: cubic-bezier(0.47, 2.02, .31, -.36)
}
.elementor-animation-rotate {
transition-duration: .3s;
transition-property: transform
}
.elementor-animation-rotate:active,
.elementor-animation-rotate:focus,
.elementor-animation-rotate:hover {
transform: rotate(4deg)
}
.elementor-animation-grow-rotate {
transition-duration: .3s;
transition-property: transform
}
.elementor-animation-grow-rotate:active,
.elementor-animation-grow-rotate:focus,
.elementor-animation-grow-rotate:hover {
transform: scale(1.1) rotate(4deg)
}
.elementor-animation-float {
transition-duration: .3s;
transition-property: transform;
transition-timing-function: ease-out
}
.elementor-animation-float:active,
.elementor-animation-float:focus,
.elementor-animation-float:hover {
transform: translateY(-8px)
}
.elementor-animation-sink {
transition-duration: .3s;
transition-property: transform;
transition-timing-function: ease-out
}
.elementor-animation-sink:active,
.elementor-animation-sink:focus,
.elementor-animation-sink:hover {
transform: translateY(8px)
}
@keyframes elementor-animation-bob {
0% {
transform: translateY(-8px)
}
50% {
transform: translateY(-4px)
}
30% {
transform: translateY(-8px)
}
}
@keyframes elementor-animation-bob-float {
30% {
transform: translateY(-8px)
}
}
.elementor-animation-bob:active,
.elementor-animation-bob:focus,
.elementor-animation-bob:hover {
animation-name: elementor-animation-bob-float, elementor-animation-bob;
animation-duration: .3s, 1.5s;
animation-delay: 0s, .3s;
animation-timing-function: ease-out, ease-in-out;
animation-iteration-count: 1, infinite;
animation-fill-mode: forwards;
animation-direction: normal, alternate
}
@keyframes elementor-animation-hang {
0% {
transform: translateY(8px)
}
50% {
transform: translateY(4px)
}
30% {
transform: translateY(8px)
}
}
@keyframes elementor-animation-hang-sink {
30% {
transform: translateY(8px)
}
}
.elementor-animation-hang:active,
.elementor-animation-hang:focus,
.elementor-animation-hang:hover {
animation-name: elementor-animation-hang-sink, elementor-animation-hang;
animation-duration: .3s, 1.5s;
animation-delay: 0s, .3s;
animation-timing-function: ease-out, ease-in-out;
animation-iteration-count: 1, infinite;
animation-fill-mode: forwards;
animation-direction: normal, alternate
}
.elementor-animation-skew {
transition-duration: .3s;
transition-property: transform
}
.elementor-animation-skew:active,
.elementor-animation-skew:focus,
.elementor-animation-skew:hover {
transform: skew(-10deg)
}
.elementor-animation-skew-forward {
transition-duration: .3s;
transition-property: transform;
transform-origin: 0 30%
}
.elementor-animation-skew-forward:active,
.elementor-animation-skew-forward:focus,
.elementor-animation-skew-forward:hover {
transform: skew(-10deg)
}
.elementor-animation-skew-backward {
transition-duration: .3s;
transition-property: transform;
transform-origin: 0 30%
}
.elementor-animation-skew-backward:active,
.elementor-animation-skew-backward:focus,
.elementor-animation-skew-backward:hover {
transform: skew(10deg)
}
@keyframes elementor-animation-wobble-vertical {
16.65% {
transform: translateY(8px)
}
33.3% {
transform: translateY(-6px)
}
49.95% {
transform: translateY(4px)
}
66.6% {
transform: translateY(-2px)
}
83.25% {
transform: translateY(1px)
}
30% {
transform: translateY(0)
}
}
.elementor-animation-wobble-vertical:active,
.elementor-animation-wobble-vertical:focus,
.elementor-animation-wobble-vertical:hover {
animation-name: elementor-animation-wobble-vertical;
animation-duration: 1s;
animation-timing-function: ease-in-out;
animation-iteration-count: 1
}
@keyframes elementor-animation-wobble-horizontal {
16.65% {
transform: translateX(8px)
}
33.3% {
transform: translateX(-6px)
}
49.95% {
transform: translateX(4px)
}
66.6% {
transform: translateX(-2px)
}
83.25% {
transform: translateX(1px)
}
30% {
transform: translateX(0)
}
}
.elementor-animation-wobble-horizontal:active,
.elementor-animation-wobble-horizontal:focus,
.elementor-animation-wobble-horizontal:hover {
animation-name: elementor-animation-wobble-horizontal;
animation-duration: 1s;
animation-timing-function: ease-in-out;
animation-iteration-count: 1
}
@keyframes elementor-animation-wobble-to-bottom-right {
16.65% {
transform: translate(8px, 8px)
}
33.3% {
transform: translate(-6px, -6px)
}
49.95% {
transform: translate(4px, 4px)
}
66.6% {
transform: translate(-2px, -2px)
}
83.25% {
transform: translate(1px, 1px)
}
30% {
transform: translate(0, 0)
}
}
.elementor-animation-wobble-to-bottom-right:active,
.elementor-animation-wobble-to-bottom-right:focus,
.elementor-animation-wobble-to-bottom-right:hover {
animation-name: elementor-animation-wobble-to-bottom-right;
animation-duration: 1s;
animation-timing-function: ease-in-out;
animation-iteration-count: 1
}
@keyframes elementor-animation-wobble-to-top-right {
16.65% {
transform: translate(8px, -8px)
}
33.3% {
transform: translate(-6px, 6px)
}
49.95% {
transform: translate(4px, -4px)
}
66.6% {
transform: translate(-2px, 2px)
}
83.25% {
transform: translate(1px, -1px)
}
30% {
transform: translate(0, 0)
}
}
.elementor-animation-wobble-to-top-right:active,
.elementor-animation-wobble-to-top-right:focus,
.elementor-animation-wobble-to-top-right:hover {
animation-name: elementor-animation-wobble-to-top-right;
animation-duration: 1s;
animation-timing-function: ease-in-out;
animation-iteration-count: 1
}
@keyframes elementor-animation-wobble-top {
16.65% {
transform: skew(-12deg)
}
33.3% {
transform: skew(10deg)
}
49.95% {
transform: skew(-6deg)
}
66.6% {
transform: skew(4deg)
}
83.25% {
transform: skew(-2deg)
}
30% {
transform: skew(0)
}
}
.elementor-animation-wobble-top {
transform-origin: 0 30%
}
.elementor-animation-wobble-top:active,
.elementor-animation-wobble-top:focus,
.elementor-animation-wobble-top:hover {
animation-name: elementor-animation-wobble-top;
animation-duration: 1s;
animation-timing-function: ease-in-out;
animation-iteration-count: 1
}
@keyframes elementor-animation-wobble-bottom {
16.65% {
transform: skew(-12deg)
}
33.3% {
transform: skew(10deg)
}
49.95% {
transform: skew(-6deg)
}
66.6% {
transform: skew(4deg)
}
83.25% {
transform: skew(-2deg)
}
30% {
transform: skew(0)
}
}
.elementor-animation-wobble-bottom {
transform-origin: 30% 0
}
.elementor-animation-wobble-bottom:active,
.elementor-animation-wobble-bottom:focus,
.elementor-animation-wobble-bottom:hover {
animation-name: elementor-animation-wobble-bottom;
animation-duration: 1s;
animation-timing-function: ease-in-out;
animation-iteration-count: 1
}
@keyframes elementor-animation-wobble-skew {
16.65% {
transform: skew(-12deg)
}
33.3% {
transform: skew(10deg)
}
49.95% {
transform: skew(-6deg)
}
66.6% {
transform: skew(4deg)
}
83.25% {
transform: skew(-2deg)
}
30% {
transform: skew(0)
}
}
.elementor-animation-wobble-skew:active,
.elementor-animation-wobble-skew:focus,
.elementor-animation-wobble-skew:hover {
animation-name: elementor-animation-wobble-skew;
animation-duration: 1s;
animation-timing-function: ease-in-out;
animation-iteration-count: 1
}
@keyframes elementor-animation-buzz {
50% {
transform: translateX(3px) rotate(2deg)
}
30% {
transform: translateX(-3px) rotate(-2deg)
}
}
.elementor-animation-buzz:active,
.elementor-animation-buzz:focus,
.elementor-animation-buzz:hover {
animation-name: elementor-animation-buzz;
animation-duration: .15s;
animation-timing-function: linear;
animation-iteration-count: infinite
}
@keyframes elementor-animation-buzz-out {
10% {
transform: translateX(3px) rotate(2deg)
}
20% {
transform: translateX(-3px) rotate(-2deg)
}
30% {
transform: translateX(3px) rotate(2deg)
}
40% {
transform: translateX(-3px) rotate(-2deg)
}
50% {
transform: translateX(2px) rotate(1deg)
}
60% {
transform: translateX(-2px) rotate(-1deg)
}
70% {
transform: translateX(2px) rotate(1deg)
}
80% {
transform: translateX(-2px) rotate(-1deg)
}
90% {
transform: translateX(1px) rotate(0)
}
30% {
transform: translateX(-1px) rotate(0)
}
}
.elementor-animation-buzz-out:active,
.elementor-animation-buzz-out:focus,
.elementor-animation-buzz-out:hover {
animation-name: elementor-animation-buzz-out;
animation-duration: .75s;
animation-timing-function: linear;
animation-iteration-count: 1
}ul {
margin:0;
padding:0;
list-style:none;
}
.breadcumb-wrapper {
padding: 155px 0 160px;
} .mas-sticky-header {
box-sizing: border-box; 
} .mas-sticky-yes,
.mas-sticky-yes.e-con,
.mas-sticky-header {
z-index:999;
margin: 0 auto;
box-sizing: border-box;
top: 0px;
transition: all 0.4s ease-in-out;
}
.e-con.mas-sticky-header:not(.elementor-sticky) {
position: fixed;
width: 100%;
margin: 0 auto;
transition: all 0.4s ease-in-out;
}
.headerup {
-ms-transform: translateY(-110vh) !important;
-o-transition: transform 0.4s ease-in-out !important;
-webkit-transform: translateY(-110vh) !important;
-webkit-transition: transform 0.4s ease-in-out !important;
-webkit-transition: -webkit-transform 0.4s ease-in-out !important;
transform: translateY(-110vh) !important;
transition: transform 0.4s ease-in-out !important;
} @media screen and (min-width: 768px) {
.admin-bar .mas-sticky-header:not(.elementor-sticky) {
top: 32px !important;
}
.mas-sticky-header:not(.elementor-sticky) {
top: 0px !important;
}
} .page--content ul>li:after, .blog-content ul>li:after, .comment-content ul>li::after {
position: absolute;
content: "\f111";
font-family: "Font Awesome 5 Free";
font-weight: 900;
top: 0;
left: 0;
color: var(--heading-color);
font-size: 8px;
}
@media (max-width: 991px) {
.breadcumb-wrapper {
padding: 100px 0 100px;
}
}
@media (max-width: 767px) {
.breadcumb-wrapper {
padding: 80px 0 80px;
}
}.optech-hero-slider-item::before {
content: '';
left: 0;
top: 0;
z-index: -1;
width: 100%;
height: 100%;
position: absolute;
background-size: cover;
background: rgb(10, 22, 94);
background: linear-gradient(0deg, rgba(10, 22, 94, 0.85) 60%, rgba(43, 77, 255, 0.85) 100%);
} .optech-header-search-section {
left: 0;
}
.search-overlay {
left: 0;
} .optech-footer-menu.dark-color ul li a {
display: inline-block;
} .optech-post-navigation2 {
display: inline;
padding-top: 0;
border-top: 0;
}
.optech-post-navigation2 .p-nav-previous,
.optech-post-navigation2 .p-nav-next {
align-items: center;
}
.optech-post-navigation2 .nav-links {
display: flex;
align-items: center;
padding-top: 40px;
justify-content: space-between;
border-top: 1px solid var(--light-color1);
}
.optech-post-data p {
font-weight: 400;
margin-bottom: 8px;
color: var(--body-color);
}
@media (max-width: 767px) {
.optech-post-navigation2 .nav-links {
flex-wrap: wrap;
gap: 24px;
}
.optech-post-navigation2 .nav-links .nav-next {
width: 100%;
}
.optech-post-navigation2 .p-nav-next {
justify-content: end;
width: 100%;
}
}