/*** 

====================================================================
			Fonts
====================================================================

***/

@import url('https://fonts.googleapis.com/css2?family=Niramit:wght@200;300;400;500;600;700&display=swap');
@import url('fontawesome-all.css');
@import url('flaticon.css');
@import url('animate.css');
@import url('custom-animation.css');
@import url('owl.css');
@import url('jquery-ui.css');
@import url('jquery.fancybox.min.css');
@import url('jquery.bootstrap-touchspin.css');
@import url('jquery.mCustomScrollbar.min.css');
/*** 

====================================================================
		Reset
====================================================================

 ***/

* {
    margin: 0px;
    padding: 0px;
    border: none;
    outline: none;
    font-size: 100%;
}

/*** 

====================================================================
		Root Code
====================================================================

 ***/

/* Theme Color */

:root {
    /* #4800ff in decimal RGB */
    --secondary: rgb(49, 0, 174);
    /* #ff0000 in decimal RGB */
    --main-color: rgb(255, 0, 0);
    /* #ffffff in decimal RGB */
    --white: rgb(255, 255, 255);
    /* #555555 in decimal RGB */
    --grey: rgb(85, 85, 85);
    /* #959595 in decimal RGB */
    --lightgrey: rgb(149, 149, 149);
    /* #222222 in decimal RGB */
    --darkgrey: rgb(34, 34, 34);
    /* #000000 in decimal RGB */
    --black: rgb(0, 0, 0);
    /* #fdfdfc in decimal RGB */
    --light: rgb(253, 253, 252);
    /* #1f9fd4 in decimal RGB */
    --light-blue: rgb(31, 59, 212);
    /* #ffcc00 in decimal RGB */
    --yellow: rgb(255, 204, 0);
    /* #f5f5f5 in decimal RGB */
    --bg-grey: rgb(245, 245, 245);
    /* #4661c5 in decimal RGB */
    --facebook-color: rgb(70, 97, 197);
    /* #44b1e4 in decimal RGB */
    --twitter-color: rgb(68, 177, 228);
    /* #0029c2 in decimal RGB */
    --linkedin-color: rgb(0, 41, 194);
    /* #ad0001 in decimal RGB */
    --red: rgb(173, 0, 1);
    /* #033e00 in decimal RGB */
    --green: rgb(3, 62, 0);
    /* #0ec312 in decimal RGB */
    --light-green: rgb(14, 195, 18);
    /* #0043ff in decimal RGB */
    --sl-blue: rgb(0, 67, 255);
    /* #00118e in decimal RGB */
    --dl-blue: rgb(0, 17, 142);
    /* #3f003b in decimal RGB */
    --purple: rgb(63, 0, 59);
    /* #be00c5 in decimal RGB */
    --light-purple: rgb(190, 0, 197);
    --main-color-opicity: 255, 0, 0;
    --secondary-opicity: 49, 0, 174;
    --white-opicity: 255, 255, 255;
    --black-opicity: 0, 0, 0;
    /* Fonts */
    --font-family-Niramit: 'Niramit', sans-serif;
    --font-12: 12px;
    --font-14: 14px;
    --font-16: 16px;
    --font-18: 18px;
    --font-20: 20px;
    --font-22: 22px;
    --font-24: 24px;
    --font-30: 30px;
    --font-36: 36px;
    --font-40: 40px;
    --font-48: 48px;
    --font-55: 55px;
    --font-60: 60px;
}

/*** 

====================================================================
	Global Settings
====================================================================

***/

body {
    font-size: var(--font-16);
    color: var(--grey);
    line-height: 30px;
    font-weight: 400;
    background: var(--white);
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    font-family: var(--font-family-Niramit);
}

body::-webkit-scrollbar {
    width: 10px;
}

body::-webkit-scrollbar-track {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    background-color: var(--grey);
}

body::-webkit-scrollbar-thumb {
    background-color: var(--main-color);
}

html {
    scroll-behavior: smooth !important;
}

a {
    text-decoration: none;
    cursor: pointer;
    color: var(--main-color);
}

a:hover,
a:focus,
a:visited {
    text-decoration: none;
    outline: none;
    color: var(--secondary);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    position: relative;
    font-weight: normal;
    margin: 0px;
    background: none;
    line-height: 1.2em;
    font-family: var(--font-family-Niramit);
}

textarea {
    overflow: hidden;
    resize: none;
}

button {
    outline: none !important;
    cursor: pointer;
}

p,
.text {
    font-size: var(--font-16);
    line-height: 30px;
    font-weight: 400;
    /*color: var(--grey);*/
    margin: 0;
}

/* Typography */

h1 {
    font-size: var(--font-60);
}

h2 {
    font-size: var(--font-36);
}

h3 {
    font-size: var(--font-30);
}

h4 {
    font-size: var(--font-24);
}

h5 {
    font-size: var(--font-20);
}

h6 {
    font-size: var(--font-18);
}

::-webkit-input-placeholder {
    color: inherit;
}

::-moz-input-placeholder {
    color: inherit;
}

::-ms-input-placeholder {
    color: inherit;
}

.auto-container {
    position: static;
    max-width: 1200px;
    padding: 0px 15px;
    margin: 0 auto;
}

.page-wrapper {
    position: relative;
    margin: 0 auto;
    width: 100%;
    min-width: 300px;
    overflow: hidden;
    z-index: 99;
}

ul,
li {
    list-style: none;
    padding: 0px;
    margin: 0px;
}

img {
    display: inline-block;
    max-width: 100%;
    height: auto;
}

.theme-btn {
    cursor: pointer;
    display: inline-block;
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.centered {
    text-align: center !important;
}

/*Btn Style One*/

.btn-style-one {
    position: relative;
    display: inline-block;
    font-size: var(--font-16);
    line-height: 30px;
    color: var(--white);
    padding: 11px 35px;
    font-weight: 700;
    border-radius: 35px;
    text-transform: capitalize;
    background-color: var(--secondary);
    overflow: hidden;
}

.btn-style-one:before {
    position: absolute;
    content: '';
    left: 0;
    top: 0;
    width: 93%;
    height: 100%;
    z-index: 1;
    opacity: 1;
    background-color: var(--main-color);
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    border-radius: 44px;
}

.btn-style-one .txt {
    position: relative;
    z-index: 1;
    color: var(--white);
}

.btn-style-one:hover::before {
    left: -100%;
}

.btn-style-one:hover {
    color: var(--white);
}

/*Btn Style two*/

.btn-style-two {
    position: relative;
    display: inline-block;
    font-size: var(--font-16);
    line-height: 30px;
    color: var(--white);
    padding: 11px 35px;
    font-weight: 700;
    border-radius: 35px;
    background-color: var(--main-color);
    text-transform: capitalize;
    overflow: hidden;
}

.btn-style-two:before {
    position: absolute;
    content: '';
    left: 0;
    top: 0;
    width: 93%;
    height: 100%;
    z-index: 1;
    opacity: 1;
    background-color: var(--secondary);
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    border-radius: 44px;
}

.btn-style-two .txt {
    position: relative;
    z-index: 1;
    color: var(--white);
}

.btn-style-two:hover::before {
    left: -100%;
}

.btn-style-two:hover {
    color: var(--white);
}

/*=== List Style One ===*/

.list-style-one {
    position: relative;
}

.list-style-one li {
    position: relative;
    font-weight: 400;
    color: var(--white);
    padding-left: 35px;
    padding-bottom: 14px;
}

.list-style-one li .icon {
    position: absolute;
    left: 0;
}

/*=== List Style Two ===*/

.list-style-two {
    position: relative;
    display: block;
    margin-bottom: 30px;
}

.list-style-two li {
    position: relative;
    font-size: 14px;
    line-height: 20px;
    color: var(--darkgrey);
    font-weight: 500;
    padding-left: 35px;
    margin-bottom: 15px
}

.list-style-two li:before {
    position: absolute;
    left: 0;
    top: 0;
    font-size: 14px;
    line-height: 20px;
    color: var(--main-color);
    font-weight: 900;
    font-family: "FontAwesome";
    content: "\f061";
}

.theme_color {}

.pull-right {
    float: right;
}

.pull-left {
    float: left;
}

/*** 

====================================================================
	Prealoder
====================================================================

***/

.preloader {
    position: fixed;
    width: 100%;
    height: 100%;
    background: var(--white);
    z-index: 99999;
    left: 0%;
    top: 0;
}

.preloader__dot {
    background: var(--main-color);
    position: absolute;
    top: calc(50% - 0.5em);
    left: calc(50% - 0.25em);
    width: 0.5em;
    height: 0.5em;
    transform-origin: 50% 100%;
}

.preloader__dot:nth-child(1) {
    animation: dot1 8s linear infinite;
    transform: rotate(0deg) translateY(-5.5em);
}

.preloader__dot:nth-child(2) {
    animation: dot2 8s linear infinite;
    transform: rotate(30deg) translateY(-5.5em);
}

.preloader__dot:nth-child(3) {
    animation: dot3 8s linear infinite;
    transform: rotate(60deg) translateY(-5.5em);
}

.preloader__dot:nth-child(4) {
    animation: dot4 8s linear infinite;
    transform: rotate(90deg) translateY(-5.5em);
}

.preloader__dot:nth-child(5) {
    animation: dot5 8s linear infinite;
    transform: rotate(120deg) translateY(-5.5em);
}

.preloader__dot:nth-child(6) {
    animation: dot6 8s linear infinite;
    transform: rotate(150deg) translateY(-5.5em);
}

.preloader__dot:nth-child(7) {
    animation: dot7 8s linear infinite;
    transform: rotate(180deg) translateY(-5.5em);
}

.preloader__dot:nth-child(8) {
    animation: dot8 8s linear infinite;
    transform: rotate(210deg) translateY(-5.5em);
}

.preloader__dot:nth-child(9) {
    animation: dot9 8s linear infinite;
    transform: rotate(240deg) translateY(-5.5em);
}

.preloader__dot:nth-child(10) {
    animation: dot10 8s linear infinite;
    transform: rotate(270deg) translateY(-5.5em);
}

.preloader__dot:nth-child(11) {
    animation: dot11 8s linear infinite;
    transform: rotate(300deg) translateY(-5.5em);
}

.preloader__dot:nth-child(12) {
    animation: dot12 8s linear infinite;
    transform: rotate(330deg) translateY(-5.5em);
}

/*** 

====================================================================
	Scroll To Top style
====================================================================

***/

.scroll-to-top {
    position: fixed;
    bottom: 80px;
    right: 20px;
    width: 50px;
    height: 50px;
    color: var(--white);
    font-size: var(--font-20);
    line-height: 50px;
    text-align: center;
    background: var(--sl-blue);
    z-index: 100;
    cursor: pointer;
    display: none;
    border-radius: 50%;
    animation: bounce 1s infinite alternate;
    -webkit-animation: bounce 1s infinite alternate;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
    padding: 0;
}

.scroll-to-top:hover {
    background: var(--sl-blue);
}

.flaticon {
    font-family: "Flaticon";
    font-weight: 400;
}

/*** 

====================================================================
	Top Header
====================================================================

***/

.top-header {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    padding: 25px 0px 12px;
}

.top-header .left-header-area {
    width: calc(60% - 0px);
    display: flex;
    justify-content: flex-start;
}

.top-header .left-header-area {
    width: calc(70% - 0px);
}

.top-header .left-header-area .contact-area {
    display: flex;
    justify-content: space-between;
}

.top-header .left-header-area .contact-area li {
    color: var(--white);
}

.top-header .left-header-area .contact-area li span {
    color: var(--main-color);
}

.top-header .left-header-area .contact-area li a {
    color: var(--white);
}

.top-header .left-header-area .contact-area li {
    margin-right: 20px;
}

.top-header .left-header-area .contact-area li span {
    margin-right: 6px;
}

.top-header .right-header-area {
    width: calc(30% - 0px);
    display: flex;
    justify-content: flex-end;
}

.social-links {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: end;
    align-items: end;
}

.social-links li a {
    display: block;
    width: 35px;
    height: 35px;
    line-height: 35px;
    border: 1px solid var(--white);
    color: var(--white);
    border-radius: 50%;
    margin-left: 10px;
    text-align: center;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.social-links li a:hover {
    background-color: var(--white);
    color: var(--main-color);
}

/*** 

====================================================================
	Main Header style
====================================================================

***/

.main-header {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
    z-index: 9999;
}

.main-header .header-top {
    position: relative;
}

.main-header .top-left {
    position: relative;
    float: left;
}

.main-header .top-left .contact-list {
    position: relative;
    padding: 5px 0;
}

.main-header .top-left .contact-list li {
    position: relative;
    float: left;
    font-size: 14px;
    line-height: 30px;
    color: var(--darkgrey);
    font-weight: 400;
    margin-right: 25px;
}

.main-header .top-left .contact-list li:last-child {
    margin-right: 0;
}

.main-header .top-left .contact-list li i {
    float: left;
    font-size: var(--font-16);
    line-height: 30px;
    margin-right: 10px;
    color: var(--white);
}

.main-header .top-left .contact-list li a {
    color: var(--darkgrey);
    display: inline-block;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.main-header .top-left .contact-list li a:hover {
    color: var(--white);
}

.main-header .top-right {
    position: relative;
    float: right;
    padding: 5px 0;
}

.social-icon-four {
    position: relative;
}

.social-icon-four li {
    position: relative;
    float: left;
    margin-left: 20px;
}

.social-icon-four li:first-child {
    margin-left: 0;
}

.social-icon-four li a {
    position: relative;
    display: block;
    font-size: var(--font-16);
    line-height: 30px;
    color: var(--white);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.social-icon-four li a:hover {
    color: var(--darkgrey);
}

.main-header .main-box {
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.main-header .inner-container {
    position: relative;
    padding: 0 15px;
}

.main-header .logo-box {
    position: relative;
}

.main-header .logo-box .logo {
    position: relative;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.main-header .nav-outer {
    position: static;
    display: flex;
}

.header-style-three .nav-outer {
    justify-content: flex-end;
    width: 100%;
}

.navbar-toggler {
    border: 0 !important;
}

.main-menu {
    position: static;
}

.main-menu .navbar-header {
    display: none;
}

.main-menu .navbar-collapse {
    padding: 0px;
}

.main-menu .navigation {
    position: static;
    margin: 0px;
}

.main-menu .navigation>li {
    position: relative;
    float: left;
    margin-left: 35px;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.main-menu .navigation>li>a {
    position: relative;
    display: block;
    line-height: 30px;
    font-weight: 500;
    color: var(--darkgrey);
    padding: 35px 0;
    opacity: 1;
    text-align: center;
    text-transform: capitalize;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.main-menu .navigation>li>ul>li>ul>li:hover>a {
    background: var(--white);
}

.main-menu .navigation>li>ul>li>ul>li.dropdown>a:after {
    content: "\f105";
    position: absolute;
    right: 10px;
    top: 11px;
    width: 10px;
    height: 20px;
    display: block;
    line-height: 20px;
    font-size: 13px;
    font-weight: 900;
    text-align: center;
    z-index: 5;
    font-family: 'Font Awesome 5 Free';
}

.main-menu .navigation>li>ul>li>ul>li.dropdown:hover>a:after {
    color: var(--white);
}

.main-menu .navigation>li>ul {
    position: absolute;
    left: 0px;
    top: 110%;
    width: 200px;
    padding: 0px 0px;
    z-index: 100;
    -webkit-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    -o-transition: all 200ms linear;
    transition: all 200ms linear;
    opacity: 1;
    -webkit-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
    -ms-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
    -o-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
    box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
}

.main-menu .navigation>li>ul.from-right {
    left: auto;
    right: 0px;
}

.main-menu .navigation>li>ul>li {
    position: relative;
    width: 100%;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    background-color: var(--white);
    margin-bottom: 10px;
    -webkit-transition: all 0.5s linear;
    -moz-transition: all 0.5s linear;
    -ms-transition: all 0.5s linear;
    -o-transition: all 0.5s linear;
    transition: all 0.5s linear;
}

.main-menu .navigation>li:hover>ul>li {
    margin-bottom: 0;
}

.main-menu .navigation>li>ul>li:last-child {
    border-bottom: none;
}

.main-menu .navigation>li>ul>li>a,
.main-menu .navigation>li>ul>li>ul>li>a {
    position: relative;
    display: block;
    padding: 10px 20px;
    line-height: 24px;
    font-weight: 400;
    color: var(--black);
    text-align: left;
    font-size: var(--font-14);
    text-transform: capitalize;
    transition: all 2s ease;
    -moz-transition: all 2s ease;
    -webkit-transition: all 2s ease;
    -ms-transition: all 2s ease;
    -o-transition: all 2s ease;
}

.main-menu .navigation>li>ul>li>a:after,
.main-menu .navigation>li>ul>li>ul>li>a:after {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 0%;
    content: '.';
    color: transparent;
    background: var(--main-color);
    height: 1px;
    text-align: left;
    margin: 0;
    opacity: 0;
}

.main-menu .navigation>li>ul>li:hover>a,
.main-menu .navigation>li>ul>li>ul>li:hover>a {
    z-index: 1;
    color: var(--white);
}

.main-menu .navigation>li>ul>li:hover>a:after,
.main-menu .navigation>li>ul>li>ul>li:hover>a:after {
    z-index: -10;
    animation: fill 1s forwards;
    -webkit-animation: fill 1s forwards;
    -moz-animation: fill 1s forwards;
    opacity: 1;
}

/* Keyframes */

@-webkit-keyframes fill {
    0% {
        width: 0%;
        height: 1px;
    }
    50% {
        width: 100%;
        height: 1px;
    }
    100% {
        width: 100%;
        height: 100%;
        background: var(--main-color);
    }
}

.main-menu .navigation>li>ul>li.dropdown>a:before {
    content: "\f105";
    position: absolute;
    right: 15px;
    top: 11px;
    width: 10px;
    height: 20px;
    display: block;
    line-height: 20px;
    font-size: var(--font-16);
    color: var(--black);
    font-weight: 900;
    text-align: center;
    font-family: 'Font Awesome 5 Free';
    z-index: 5;
    transition: all 2s ease;
    -moz-transition: all 2s ease;
    -webkit-transition: all 2s ease;
    -ms-transition: all 2s ease;
    -o-transition: all 2s ease;
}

.main-menu .navigation>li>ul>li.dropdown:hover>a:before {
    color: var(--white);
}

.main-menu .navigation>li>ul>li>ul {
    position: absolute;
    left: 110%;
    top: 0%;
    width: 200px;
    padding: 0px 0px;
    z-index: 100;
    -webkit-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    -o-transition: all 200ms linear;
    transition: all 200ms linear;
    -webkit-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
    -ms-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
    -o-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
    box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
}

.main-menu .navigation>li>ul>li>ul>li {
    position: relative;
    width: 100%;
    background-color: var(--white);
    border-bottom: 1px solid rgba(var(--black-opicity), .10);
}

.main-menu .navigation>li>ul>li>ul>li:last-child {
    border-bottom: none;
}

.main-menu .navigation>li.dropdown:hover>ul {
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    transition: all 300ms linear;
    visibility: visible;
    opacity: 1;
    top: 100%;
}

.main-menu .navigation li>ul>li.dropdown:hover>ul {
    visibility: visible;
    opacity: 1;
    top: 0;
    left: 100%;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
}

.main-menu .navbar-collapse>ul li.dropdown .dropdown-btn {
    position: absolute;
    right: 10px;
    top: 8px;
    width: 34px;
    height: 30px;
    border: 1px solid var(--white);
    text-align: center;
    font-size: var(--font-16);
    line-height: 30px;
    color: var(--white);
    cursor: pointer;
    z-index: 5;
    display: none;
}

.main-header .outer-box {
    position: relative;
    display: flex;
}

.social-icon-one {
    position: relative;
}

.social-icon-one li {
    position: relative;
    float: left;
    margin-left: 22px;
}

.social-icon-one li a {
    position: relative;
    display: block;
    font-size: 13px;
    line-height: 30px;
    color: var(--darkgrey);
    font-weight: 400;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.social-icon-one li a:hover {
    color: var(--main-color);
}

.main-header .contact-info {
    position: relative;
}

.main-header .contact-info li {
    position: relative;
    float: left;
    margin-left: 35px;
    font-size: 14px;
    line-height: 30px;
    color: var(--darkgrey);
    font-weight: 400;
}

.main-header .contact-info li span {
    position: relative;
    float: left;
    font-size: 14px;
    line-height: 30px;
    font-weight: 400;
}

.main-header .contact-info li a {
    color: var(--darkgrey);
    transition: all 300ms ease;
}

.main-header .contact-info li a:hover {
    color: var(--main-color);
}

.main-header .cart-box {
    position: relative;
    background: none;
    display: inline-block;
    margin-right: 35px;
}

.main-header .cart-product {
    position: relative;
    margin-bottom: 18px;
    min-height: 90px;
}

.main-header .cart-product .inner {
    position: relative;
    padding-left: 90px;
    min-height: 70px;
}

.main-header .cart-product .inner .cross-icon {
    position: absolute;
    right: 0px;
    top: -2px;
    z-index: 1;
    font-size: var(--font-16);
    cursor: pointer;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
}

.main-header .cart-product .inner .image {
    position: absolute;
    width: 70px;
    height: 70px;
    left: 0px;
    top: 0px;
}

.main-header .cart-product .inner h3 {
    position: relative;
    font-weight: 700;
    color: var(--darkgrey);
    font-size: var(--font-16);
    margin: 0px;
    letter-spacing: 1px;
    text-transform: capitalize;
}

.main-header .cart-product .inner h3 a {
    color: var(--darkgrey);
    transition: all 300ms ease;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
}

.main-header .cart-product .inner .quantity-text {
    position: relative;
    font-weight: 300;
    font-size: 13px;
    margin-bottom: 0px;
}

.main-header .cart-product .inner .price {
    position: relative;
    font-weight: 700;
    font-size: var(--font-16);
    margin: 0px;
    color: var(--darkgrey);
}

.main-header .cart-box .cart-panel {
    left: auto !important;
    right: 0px !important;
    padding: 20px 20px;
    min-width: 300px;
    margin-top: 62px;
    z-index: -1;
    box-shadow: 0px 0px 25px rgb(0 0 0 / 15%);
    -webkit-transform: translate3d(0px, 0px, 0px) !important;
    transform: translate3d(0px, 0px, 0px) !important;
    z-index: 9;
}

.main-header .cart-box .cart-panel .btns-boxed {
    position: relative;
    text-align: center;
    margin-top: 20px;
}

.main-header .cart-box .cart-panel .btns-boxed li {
    position: relative;
    margin: 0px 5px;
    display: inline-block;
}

.main-header .cart-box .cart-panel .btns-boxed li a {
    position: relative;
    color: var(--white);
    font-weight: 500;
    font-size: 12px;
    padding: 10px 20px 8px;
    border-radius: 2px;
    display: inline-block;
    background-color: var(--main-color);
    border: 1px solid var(--main-color);
    border-radius: 35px;
    transition: all 300ms ease;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
}

.main-header .cart-box .cart-box-btn {
    background: none;
    color: var(--black);
    cursor: pointer;
    font-size: var(--font-24);
    transition: all 300ms ease;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
}

.main-header .cart-box .cart-box-btn:hover {
    color: var(--main-color);
}

.main-header .cart-box .total-cart {
    position: absolute;
    font-size: 12px;
    background-color: var(--main-color);
    width: 25px;
    height: 25px;
    display: block;
    line-height: 25px;
    border-radius: 50%;
    color: var(--white);
    top: -10px;
    right: -23px;
}

.main-header .cart-box .flaticon {
    font-size: 25px;
}

.main-header .main-menu .navigation>li {
    margin-left: 35px;
}

.main-header .main-menu .navigation>li>a {
    color: var(--black);
    position: relative;
    font-weight: 600;
}

.main-header .main-menu .navigation>li.dropdown>a:before {
    content: "\f107";
    position: absolute;
    right: -14px;
    top: 50%;
    width: 10px;
    height: 20px;
    display: block;
    line-height: 20px;
    font-size: var(--font-16);
    z-index: 5;
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    transform: translateY(-50%);
}

.main-header .main-menu .navigation>li:hover>a,
.main-header .main-menu .navigation>li.current>a {
    color: var(--main-color);
}

/*** 

====================================================================
	Hidden Sidebar style
====================================================================

***/

.sidebar-info-contents {
    position: relative;
}

.sidebar-info-contents .content-inner {
    position: relative;
}

.sidebar-info-contents .content-inner .logo {
    padding: 0px 0px 40px;
}

.sidebar-info-contents .content-inner .logo img {
    display: inline-block;
    max-width: 100%;
}

.sidebar-info-contents .content-inner .content-box {
    position: relative;
}

.sidebar-info-contents .content-inner .content-box h2 {
    position: relative;
    font-size: var(--font-20);
    color: var(--white);
    font-weight: 500;
    margin-bottom: 20px;
}

.sidebar-info-contents .content-inner .content-box p {
    position: relative;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.90);
    margin-bottom: 25px;
}

.sidebar-info-contents .content-inner .contact-info {
    position: relative;
    margin-top: 60px;
}

.sidebar-info-contents .content-inner .contact-info h2 {
    position: relative;
    font-size: var(--font-20);
    color: var(--white);
    font-weight: 500;
    margin-bottom: 20px;
}

.sidebar-info-contents .content-inner .social-box {
    position: relative;
    margin-top: 20px;
    margin-bottom: 30px;
}

.sidebar-info-contents .content-inner .social-box li {
    position: relative;
    display: inline-block;
    margin-right: 6px;
    transition: all 900ms ease;
    -moz-transition: all 900ms ease;
    -webkit-transition: all 900ms ease;
    -ms-transition: all 900ms ease;
    -o-transition: all 900ms ease;
}

.sidebar-info-contents .content-inner .social-box li a {
    position: relative;
    width: 36px;
    height: 36px;
    color: var(--darkgrey);
    z-index: 1;
    font-size: 13px;
    line-height: 36px;
    text-align: center;
    border-radius: 50%;
    display: inline-block;
    background-color: var(--white);
}

.close-side-widget,
.close-side-widget:hover {
    color: var(--white);
    font-size: var(--font-24);
}

.main-header .header-upper .outer-box .nav-btn {
    position: relative;
    float: left;
    font-size: 25px;
    color: var(--darkgrey);
    cursor: pointer;
    margin-top: 19px;
    margin-left: 25px;
}

.sticky-header .outer-box .nav-btn {
    position: relative;
    float: right;
    font-size: 28px;
    color: var(--black);
    cursor: pointer;
    margin-top: 9px;
    margin-left: 30px;
}

/*** 

====================================================================
	Mobile Menu
====================================================================

***/

.nav-outer .mobile-nav-toggler {
    position: absolute;
    font-size: 30px;
    line-height: 50px;
    cursor: pointer;
    color: var(--main-color);
    display: none;
    top: -74px;
    right: 0;
}

.header-style-three .nav-outer .mobile-nav-toggler {
    top: -65px;
}

.header-style-two .nav-outer .mobile-nav-toggler {
    top: -51px;
    right: 23px;
    color: var(--white);
}

.mobile-menu {
    position: fixed;
    left: 0;
    top: 0;
    width: 300px;
    padding-right: 30px;
    max-width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    z-index: 999999;
}

.mobile-menu .nav-logo {
    position: relative;
    padding: 20px 20px;
    text-align: left;
}

.mobile-menu .nav-logo img {
    max-width: 200px;
}

.mobile-menu-visible {
    overflow: hidden;
}

.mobile-menu-visible .mobile-menu {
    opacity: 1;
    visibility: visible;
}

.mobile-menu .menu-backdrop {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: rgba(var(--black-opicity), 0.9);
    -webkit-transform: translateX(-101%);
    -ms-transform: translateX(-101%);
    transform: translateX(-101%);
}

.mobile-menu-visible .mobile-menu .menu-backdrop {
    opacity: 1;
    visibility: visible;
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    -ms-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all 0.7s ease;
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
}

.mobile-menu .menu-box {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    max-height: 100%;
    overflow-y: auto;
    background: #ffffff;
    padding: 0px 0px;
    z-index: 5;
    opacity: 0;
    visibility: hidden;
    border-radius: 0px;
    -webkit-transform: translateX(-101%);
    -ms-transform: translateX(-101%);
    transform: translateX(-101%);
}

.mobile-menu-visible .mobile-menu .menu-box {
    opacity: 1;
    visibility: visible;
    -webkit-transition: all 0.7s ease 500ms;
    -moz-transition: all 0.7s ease 500ms;
    -ms-transition: all 0.7s ease 500ms;
    -o-transition: all 0.7s ease 500ms;
    transition: all 0.7s ease 500ms;
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
}

.mobile-menu .close-btn {
    position: absolute;
    right: 3px;
    top: 3px;
    line-height: 30px;
    width: 30px;
    text-align: center;
    font-size: 14px;
    color: #202020;
    cursor: pointer;
    z-index: 10;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    -webkit-transform: translateY(-50px);
    -ms-transform: translateY(-50px);
    transform: translateY(-50px);
}

.mobile-menu-visible .mobile-menu .close-btn {
    -webkit-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
}

.mobile-menu .close-btn:hover {
    opacity: 0.50;
}

.mobile-menu .navigation {
    position: relative;
    display: block;
    width: 100%;
    border-top: 1px solid rgba(var(--black-opicity), .10);
}

.mobile-menu .navigation li {
    position: relative;
    display: block;
    border-bottom: 1px solid rgba(var(--black-opicity), .10);
}

.mobile-menu .navigation li>ul>li:last-child {
    border-bottom: none;
}

.mobile-menu .navigation li>ul>li:first-child {
    border-top: 1px solid rgba(var(--black-opicity), .10);
}

.mobile-menu .navigation li>a {
    position: relative;
    display: block;
    padding: 10px 20px;
    color: var(--darkgrey);
    text-transform: capitalize;
}

.mobile-menu .navigation li:hover>a,
.mobile-menu .navigation li.current>a {
    color: var(--main-color);
}

.mobile-menu .navigation li.dropdown .dropdown-btn {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 50px;
    height: 50px;
    text-align: center;
    font-size: var(--font-16);
    line-height: 74px;
    cursor: pointer;
    z-index: 5;
    background-color: var(--secondary);
    color: var(--white);
    padding-left: 0;
}

.mobile-menu .navigation li>ul,
.mobile-menu .navigation li>ul>li>ul {
    display: none;
}

.mobile-menu .options-box {
    position: fixed;
    z-index: 6;
    bottom: 0;
    width: 100%;
    transition-delay: 2s;
    transition: all 0.5s ease-in-out;
}

.mobile-menu .options-box .social-box {
    padding: 15px;
    background-color: var(--secondary);
    width: 100%;
    position: relative;
}

.mobile-menu .options-box .social-box .social-icons {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    position: relative;
}

.mobile-menu .options-box .social-box .social-icons li a {
    color: var(--white);
}

.mobile-menu .navigation li.dropdown .dropdown-btn .fa-angle-down:before {
    content: "\f067";
}

.mobile-menu .navigation li.dropdown .dropdown-btn.open .fa-angle-down:before {
    content: "\f068";
}

.mobile-menu .navigation li.dropdown .dropdown-btn:after {
    content: "";
    width: 0;
    height: 0;
    border-top: 49px solid var(--white);
    border-right: 50px solid transparent;
    left: 0;
    position: absolute;
    z-index: 9;
}

/*===================================
		Header Style One
===================================*/

.header-style-one {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
}

.header-style-one .header-lower {
    position: relative;
    background-color: var(--white);
    margin: 0;
    padding: 0 40px;
    border-radius: 15px;
    height: 100px;
}

.header-style-one .header-lower:after {
    content: "";
    position: absolute;
    left: 14px;
    bottom: -14px;
    width: 100%;
    height: 100px;
    border-radius: 15px;
    z-index: -1;
}

.header-style-one .outer-box {
    margin-top: 35px;
    margin-left: 40px;
}

.header-style-one .search-box-outer .dropdown-menu {
    top: 20px !important;
}

/*search box btn*/

.main-header .search-box-outer {
    position: relative;
    margin: 0 25px 0 0;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.main-header .search-box-btn {
    position: relative;
    cursor: pointer;
    background: none;
    font-size: 25px;
    color: var(--black);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.main-header .search-box-btn:hover,
.header-style-one .search-box-btn:hover {
    color: var(--main-color);
}

.dropdown-toggle::after {
    display: none;
}

.main-header .search-box-outer .dropdown-menu {
    top: 37px !important;
    right: 0 !important;
    left: auto !important;
    transform: none !important;
    padding: 0px;
    width: 280px;
    border-radius: 0px;
}

html.modal-active,
body.modal-active {
    overflow: hidden;
}

#modal-container {
    position: fixed;
    display: table;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    transform: scale(0);
    z-index: 1;
}

#modal-container {
    position: fixed;
    display: table;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    transform: scale(0);
    z-index: 9999;
}

#modal-container.one {
    transform: scaleY(0.01) scaleX(0);
    animation: unfoldIn 1s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}

#modal-container.one .modal-background {
    display: table-cell;
    background: rgba(0, 0, 0, 0.8);
    text-align: center;
    vertical-align: middle;
}

#modal-container.one .modal-background .modal {
    position: relative;
    display: block;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    z-index: 1050;
    overflow: visible;
    outline: 0;
    transform: scale(0);
    animation: zoomIn 0.5s 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}

#modal-container.one.out {
    transform: scale(1);
    animation: unfoldOut 1s 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}

#modal-container.one.out .modal-background .modal {
    animation: zoomOut 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) forwards;
}

@keyframes unfoldIn {
    0% {
        transform: scaleY(0.005) scaleX(0);
    }
    50% {
        transform: scaleY(0.005) scaleX(1);
    }
    100% {
        transform: scaleY(1) scaleX(1);
    }
}

@keyframes unfoldOut {
    0% {
        transform: scaleY(1) scaleX(1);
    }
    50% {
        transform: scaleY(0.005) scaleX(1);
    }
    100% {
        transform: scaleY(0.005) scaleX(0);
    }
}

@keyframes zoomIn {
    0% {
        transform: scale(0);
    }
    100% {
        transform: scale(1);
    }
}

@keyframes zoomOut {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(0);
    }
}

#modal-container.one .modal-background .modal .form-container {
    max-width: 700px;
    top: 50%;
    left: 15px;
    right: 15px;
    transform-origin: center;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
    margin: 0 auto;
}

#modal-container.one .modal-background .modal .form-container h2 {
    color: var(--white);
    font-weight: 700;
    margin-bottom: 30px;
}

#modal-container.one .modal-background .modal .form-group {
    position: relative;
    margin: 0px;
}

#modal-container.one .modal-background .modal input[type="text"],
#modal-container.one .modal-background .modal input[type="search"],
#modal-container.one .modal-background .modal input[type="password"],
#modal-container.one .modal-background .modal select {
    display: block;
    width: 100%;
    line-height: 24px;
    padding: 7px 40px 7px 15px;
    height: 40px;
    font-size: 14px;
    border: 1px solid var(--bg-grey);
    background: var(--white);
}

#modal-container.one .modal-background .modal input:focus,
#modal-container.one .modal-background .modal select:focus {}

#modal-container.one .modal-background .modal .search-btn {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 40px;
    height: 40px;
    text-align: center;
    color: var(--grey);
    font-size: 12px;
    background: none;
    cursor: pointer;
}

#modal-container.one .modal-background .modal .close {
    position: absolute;
    top: -155%;
    right: 17%;
    font-size: 27px;
    color: var(--white);
    z-index: 9;
}

.header-style-one .outer-box .nav-toggler {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    position: relative;
    top: -5px;
    color: var(--white);
    background-color: var(--main-color);
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
}

.header-style-one .outer-box .nav-toggler:hover {
    background-color: var(--secondary);
}

.header-style-one .main-menu .navigation>li {
    margin-left: 30px;
}

/*===================================
		Header Style Two
===================================*/

.header-style-two {
    position: relative;
    left: 0;
    top: 0;
    width: 100%;
}

.header-style-two .header-lower {
    position: relative;
}

.header-style-two .header-lower .auto-container {
    position: relative;
    max-width: 1170px;
}

.header-style-two .header-lower .main-box {
    position: absolute;
    left: 0;
    top: 40px;
    width: 100%;
}

.header-style-two .header-lower .main-box .logo-box {
    margin-right: 35px;
}

.header-style-two .outer-box {
    padding: 21px 0 0;
    margin-left: 10px;
}

.header-style-two .outer-box .cart-box {
    margin-left: 15px;
    margin-right: 0;
}

.header-style-two .header-lower .main-box .nav-outer {
    background-color: var(--white);
    border-radius: 45px;
    position: relative;
}

.header-style-two .header-lower .main-box .nav-outer:after {
    content: "";
    position: absolute;
    left: -6px;
    bottom: -6px;
    width: 101%;
    height: 60px;
    background-color: var(--main-color);
    z-index: -1;
    border-radius: 45px;
}

.header-style-two .header-lower .main-box .nav-outer .navigation>li {
    margin-left: 40px;
}

.header-style-two .header-lower .main-box .nav-outer .navigation>li>a {
    padding: 20px 0;
}

.header-style-two .header-lower .main-box .nav-outer .navigation>li>a:after {
    content: "";
    position: absolute;
    left: -7px;
    top: 17px;
    width: 30px;
    height: 25px;
    background-image: url(../images/resource/menu-shape.png);
    background-repeat: no-repeat;
    background-size: contain;
    opacity: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.header-style-two .header-lower .main-box .nav-outer .navigation>li.current>a:after,
.header-style-two .header-lower .main-box .nav-outer .navigation>li:hover>a:after {
    opacity: 0.5;
}

.header-style-two .outer-box .btn-style-one {
    position: relative;
    display: inline-block;
    border-radius: 73px;
    margin-right: 15px;
}

.header-style-two .outer-box .nav-toggler {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: var(--white);
    margin-right: 20px;
    margin-left: 0;
    background-color: var(--secondary);
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    margin-top: -5px;
}

.header-style-two .outer-box .nav-toggler:hover {
    background-color: var(--main-color);
}

.header-style-two .search-box-outer .dropdown-menu {
    top: 37px !important;
}

.header-style-two .search-box-outer {
    float: right;
    margin-left: 40px;
}

.main-header .cart-btn {
    position: relative;
    float: left;
}

.main-header .cart-btn a {
    position: relative;
    display: inline-block;
    font-size: var(--font-20);
    line-height: 35px;
    color: var(--white);
}

.main-header .cart-btn .count {
    position: absolute;
    right: -11px;
    top: 0;
    height: 22px;
    width: 22px;
    line-height: 22px;
    color: var(--white);
    font-size: 12px;
    text-align: center;
    font-weight: 400;
    background-color: var(--main-color);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
}

/*===================================
		Header Style Three
===================================*/

.header-style-three .top-header {
    width: 100%;
    box-shadow: 10px 0 16px rgba(var(--black-opicity), 0.1);
    padding: 0 50px;
}

.header-style-three .top-header .left-header-area .contact-area li {
    color: var(--grey);
    padding: 5px 0;
}

.header-style-three .top-header .left-header-area .contact-area li a {
    color: var(--grey);
}

.header-style-three .social-links li a {
    color: var(--grey);
    border-left: 1px solid rgba(var(--black-opicity), 0.1);
    border-right: 1px solid rgba(var(--black-opicity), 0.1);
    border-radius: 0;
    margin-left: -1px;
    padding: 3px 0;
    height: auto;
    width: 40px;
    border-top: none;
    border-bottom: none;
}

.header-style-three .social-links li a:hover {
    background-color: var(--main-color);
    color: var(--white);
}

.header-style-three .header-lower {
    width: 100%;
    padding: 15px 50px;
}

.header-style-three .main-box {
    justify-content: space-between;
}

.header-style-three .outer-box .theme-btn {
    height: 50px;
    height: 50px;
    margin: -11px 25px 0;
}

.header-style-three .outer-box {
    margin-top: 34px;
    margin-left: 40px;
}

.header-style-three .outer-box .cart-box {
    height: auto;
    padding: 0;
}

.header-style-three .outer-box .cart-box .cart-box-btn {
    color: var(--secondary);
}

.header-style-three .outer-box .search-box-outer {
    margin-right: 35px;
}

.header-style-three .outer-box .nav-toggler {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: var(--white);
    position: relative;
    top: -3px;
    background-color: var(--secondary);
}

.pattern {
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
}

.pattern-layer-one {
    position: absolute;
    left: 5%;
    top: 7%;
    width: 33px;
    height: 33px;
    background-repeat: no-repeat;
    animation-name: rotateme;
    animation-duration: 24s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: rotateme;
    -webkit-animation-duration: 24s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotateme;
    -moz-animation-duration: 24s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: rotateme;
    -ms-animation-duration: 24s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: rotateme;
    -o-animation-duration: 24s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
}

}

.pattern-layer-two {
    position: absolute;
    left: 22%;
    width: 11px;
    height: 11px;
    background-repeat: no-repeat;
    animation-name: zoom-fade;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: zoom-fade;
    -webkit-animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: zoom-fade;
    -moz-animation-duration: 3s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: zoom-fade;
    -ms-animation-duration: 3s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: zoom-fade;
    -o-animation-duration: 3s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
}

.pattern-layer-three {
    top: 34%;
    left: 10%;
    width: 11px;
    height: 11px;
    position: absolute;
    background-repeat: no-repeat;
    animation-name: zoom-fade;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: zoom-fade;
    -webkit-animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: zoom-fade;
    -moz-animation-duration: 3s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: zoom-fade;
    -ms-animation-duration: 3s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: zoom-fade;
    -o-animation-duration: 3s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
}

.pattern-layer-four {
    position: absolute;
    top: 54%;
    left: 14%;
    width: 40px;
    height: 37px;
    background-repeat: no-repeat;
    animation-name: float-bob;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: float-bob;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: float-bob;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: float-bob;
    -ms-animation-duration: 2s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: float-bob;
    -o-animation-duration: 2s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
}

.pattern-layer-five {
    position: absolute;
    bottom: 0;
    width: 42px;
    height: 42px;
    background-repeat: no-repeat;
    animation-name: float-bob;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: float-bob;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: float-bob;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: float-bob;
    -ms-animation-duration: 2s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: float-bob;
    -o-animation-duration: 2s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
}

.pattern-layer-six {
    position: absolute;
    width: 47px;
    height: 40px;
    bottom: 0;
    left: 50%;
    background-repeat: no-repeat;
    animation-name: float-bob;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: float-bob;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: float-bob;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: float-bob;
    -ms-animation-duration: 2s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: float-bob;
    -o-animation-duration: 2s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
}

.pattern-layer-seven {
    position: absolute;
    width: 11px;
    height: 11px;
    bottom: 7%;
    left: 42%;
    background-repeat: no-repeat;
    animation-name: float-bob;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: float-bob;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: float-bob;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: float-bob;
    -ms-animation-duration: 2s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: float-bob;
    -o-animation-duration: 2s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
}

.pattern-layer-eight {
    position: absolute;
    width: 11px;
    height: 11px;
    left: 40%;
    top: 10%;
    background-repeat: no-repeat;
    animation-name: float-bob;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: float-bob;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: float-bob;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: float-bob;
    -ms-animation-duration: 2s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: float-bob;
    -o-animation-duration: 2s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
}

.pattern-layer-nine {
    position: absolute;
    width: 85px;
    height: 85px;
    top: 5%;
    left: 50%;
    background-repeat: no-repeat;
    animation-name: rotateme;
    animation-duration: 24s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: rotateme;
    -webkit-animation-duration: 24s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotateme;
    -moz-animation-duration: 24s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: rotateme;
    -ms-animation-duration: 24s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: rotateme;
    -o-animation-duration: 24s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
}

.pattern-layer-ten {
    position: absolute;
    right: 15%;
    top: 3%;
    width: 11px;
    height: 11px;
    background-repeat: no-repeat;
    animation-name: float-bob;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: float-bob;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: float-bob;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: float-bob;
    -ms-animation-duration: 2s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: float-bob;
    -o-animation-duration: 2s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
}

.pattern-layer-eleven {
    position: absolute;
    right: 5%;
    top: 5%;
    width: 105px;
    height: 100px;
    background-repeat: no-repeat;
    animation-name: float-bob;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: float-bob;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: float-bob;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: float-bob;
    -ms-animation-duration: 2s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: float-bob;
    -o-animation-duration: 2s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
}

.pattern-layer-tweleve {
    position: absolute;
    right: 2%;
    top: 42%;
    width: 105px;
    height: 100px;
    background-repeat: no-repeat;
    animation-name: float-bob;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: float-bob;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: float-bob;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: float-bob;
    -ms-animation-duration: 2s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: float-bob;
    -o-animation-duration: 2s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
}

/*** 

====================================================================
	Side Nav Bar
====================================================================

***/

.sidenav-bar {
    position: fixed;
    left: -350px;
    top: 0px;
    width: 350px;
    height: 100%;
    overflow-y: auto;
    z-index: 99999;
    transition: all 500ms ease;
}

.active-side-nav .sidenav-bar {
    left: 0;
}

.sidenav-bar .inner-box {
    position: relative;
    padding: 50px 30px;
}

.sidenav-bar:before {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background-image: url(../images/icons/icon-dots-dark.html);
    background-repeat: repeat;
    background-position: center;
    content: "";
}

.sidenav-bar .upper-box {
    position: relative;
    margin-bottom: 50px;
}

.sidenav-bar .upper-box .logo a {
    position: relative;
}

.sidenav-bar .cross-icon {
    position: absolute;
    right: 0;
    top: 15px;
    height: 40px;
    width: 40px;
    text-align: center;
    line-height: 40px;
    font-size: var(--font-18);
    color: var(--darkgrey);
    font-weight: 400;
    background-color: var(--white);
    cursor: pointer;
    transition: all 300ms ease;
}

.sidenav-bar .cross-icon:hover {
    background-color: var(--main-color);
    color: var(--white);
}

.sidenav-bar .side-nav {
    position: relative;
    margin-bottom: 50px;
}

.sidenav-bar .side-nav .navigatio {
    position: relative;
}

.sidenav-bar .side-nav .navigation>li,
.sidenav-bar .side-nav .navigation>li>ul>li {
    position: relative;
    display: block;
}

.sidenav-bar .side-nav .navigation>li>a {
    position: relative;
    display: block;
    line-height: 30px;
    padding: 10px 0px;
    color: var(--white);
    font-weight: 400;
    font-size: var(--font-16);
    text-transform: capitalize;
    transition: all 300ms ease;
}

.sidenav-bar .side-nav .navigation>li>ul>li>a,
.sidenav-bar .side-nav .navigation>li>ul>li>ul>li>a {
    position: relative;
    display: block;
    line-height: 20px;
    padding: 10px 20px;
    color: var(--white);
    font-weight: 400;
    font-size: var(--font-16);
    text-transform: capitalize;
    transition: all 300ms ease;
}

.sidenav-bar .side-nav .navigation>li>ul>li,
.sidenav-bar .side-nav .navigation>li>ul>li>ul>li {
    margin-bottom: 0px;
}

.sidenav-bar .side-nav .navigation>li>ul>li:last-child,
.sidenav-bar .side-nav .navigation>li>ul>li>ul>li:last-child {
    margin: 0px;
}

.sidenav-bar .side-nav .navigation>li:hover>a,
.sidenav-bar .side-nav .navigation>li>ul>li:hover>a,
.sidenav-bar .side-nav .navigation>li.current>a,
.sidenav-bar .side-nav .navigation>li>ul>li.current>a {
    color: var(--main-color);
}

.sidenav-bar .side-nav .navigation>li.dropdown>a {
    padding-right: 30px;
}

.sidenav-bar .side-nav .navigation>li.dropdown>a:before {
    font-family: 'FontAwesome';
    content: "\f105";
    position: absolute;
    right: 0px;
    top: 10px;
    line-height: 30px;
    display: block;
    font-size: var(--font-16);
    z-index: 5;
    font-weight: 300;
}

.sidenav-bar .side-nav .navigation>li.dropdown.active>a:before {
    content: "\f107";
}

.sidenav-bar .side-nav .navigation>li.dropdown>ul,
.sidenav-bar .side-nav .navigation>li.dropdown>ul>li.dropdown>ul {
    position: relative;
    display: block;
    left: 0%;
    top: 0px;
    width: 100%;
    z-index: 100;
    padding: 10px 0px;
}

.sidenav-bar .side-nav .navigation li.dropdown .dropdown-btn {
    position: absolute;
    right: 0px;
    top: 10px;
    width: 34px;
    height: 30px;
    border: 1px solid var(--bg-grey);
    text-align: center;
    font-size: var(--font-16);
    line-height: 28px;
    color: var(--white);
    cursor: pointer;
    z-index: 5;
    display: none;
}

.sidenav-bar .subscribe-form {
    position: relative;
}

.sidenav-bar .subscribe-form h5 {
    position: relative;
    display: block;
    font-size: var(--font-20);
    line-height: 1.2em;
    color: var(--white);
    font-weight: 400;
    margin-bottom: 25px;
}

.sidenav-bar .subscribe-form form {
    position: relative;
}

.sidenav-bar .subscribe-form input[type="text"],
.sidenav-bar .subscribe-form input[type="email"] {
    position: relative;
    display: block;
    width: 100%;
    line-height: 30px;
    font-weight: 400;
    padding: 10px 30px;
    background-color: var(--black);
    border-radius: 30px;
    transition: all 300ms ease;
}

.sidenav-bar .subscribe-form button,
.sidenav-bar .subscribe-form input[type="submit"] {
    position: relative;
    display: block;
    width: 100%;
    margin-top: 10px;
    height: 50px;
    font-size: var(--font-16);
    line-height: 30px;
    color: var(--black);
    font-weight: 600;
    padding: 10px 30px;
    text-transform: uppercase;
}

.sidenav-bar .subscribe-form button:hover,
.sidenav-bar .subscribe-form input[type="submit"]:hover {
    color: var(--white);
}

.form-back-drop {
    position: fixed;
    right: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: rgba(0, 0, 0, 0.70);
    visibility: hidden;
    z-index: 99999;
    transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
}

.active-side-nav .form-back-drop {
    opacity: 1;
    visibility: visible;
}

.mCSB_inside>.mCSB_container {
    margin-right: 0;
}

/***

====================================================================
	Hidden Sidebar style
====================================================================

***/

.hidden-bar {
    position: fixed;
    right: -500px;
    top: 0px;
    height: 100%;
    overflow-y: auto;
    z-index: 99999;
    opacity: 0;
    background-color: var(--secondary);
    max-width: 500px;
    visibility: hidden;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.active-side-nav .hidden-bar {
    right: 0px;
    opacity: 1;
    visibility: visible;
}

.hidden-bar .inner-box {
    position: relative;
    background-color: var(--secondary);
    padding: 55px 30px 50px;
}

.hidden-bar .inner-box .cross-icon {
    position: absolute;
    right: 30px;
    top: 30px;
    cursor: pointer;
    color: var(--white);
    font-size: var(--font-20);
}

.hidden-bar .inner-box h2 {
    position: relative;
    font-weight: 700;
    line-height: 1.2em;
    color: var(--white);
    margin-bottom: 20px;
}

.hidden-bar .inner-box p {
    color: var(--white);
    margin-bottom: 25px;
}

.hidden-bar .inner-box .logo {
    margin-top: -38px;
    margin-bottom: 30px;
}

.contact-info-box {
    position: relative;
    padding-top: 20px;
}

.contact-info-box .info-list {
    position: relative;
    padding-bottom: 18px;
    margin-bottom: 25px;
}

.contact-info-box .info-list li {
    position: relative;
    color: var(--white);
    font-size: var(--font-18);
    font-weight: 500;
    margin-bottom: 5px;
}

.contact-info-box .info-list:before {
    position: absolute;
    content: '';
    left: 0px;
    bottom: 0px;
    width: 50px;
    height: 1px;
    background-color: var(--white);
}

.contact-info-box .social-list {
    position: relative;
}

.contact-info-box .social-list li {
    position: relative;
    width: 50%;
    float: left;
    margin-bottom: 6px;
    display: inline-block;
}

.contact-info-box .social-list li a {
    position: relative;
    font-size: 15px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.50);
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.contact-info-box .social-list li a:hover {
    color: rgba(255, 255, 255, 0.80);
}

.mCSB_inside>.mCSB_container {
    margin-right: 0;
}

/*** 

====================================================================
				Sticky Header
====================================================================

***/

.sticky-header {
    position: fixed;
    visibility: hidden;
    opacity: 0;
    left: 0px;
    top: 0px;
    width: 100%;
    padding: 0px 0px;
    z-index: -1;
    background: var(--white);
    -webkit-box-shadow: 0 0 15px rgba(var(--black-opicity), .10);
    -moz-box-shadow: 0 0 15px rgba(var(--black-opicity), .10);
    -ms-box-shadow: 0 0 15px rgba(var(--black-opicity), .10);
    -o-box-shadow: 0 0 15px rgba(var(--black-opicity), .10);
    box-shadow: 0 0 15px rgba(var(--black-opicity), .10);
    -webkit-transition: top 300ms ease;
    -moz-transition: top 300ms ease;
    -ms-transition: top 300ms ease;
    -o-transition: top 300ms ease;
    transition: top 300ms ease;
}

.fixed-header .sticky-header {
    opacity: 1;
    z-index: 99;
    visibility: visible;
}

.fixed-header .sticky-header .main-box {
    display: block;
}

.fixed-header .sticky-header .main-box .logo-box {
    float: left;
    margin-top: 10px;
}

.fixed-header .sticky-header .main-box .nav-outer {
    float: right;
    width: auto;
}

.fixed-header .sticky-header .outer-box .nav-toggler {
    margin-top: -4px;
    margin-left: 35px;
}

.header-style-two .sticky-header .outer-box {
    margin-left: 40px;
    margin-top: 15px;
}

.header-style-two .sticky-header .outer-box .search-box-outer {
    margin-left: 0;
}

/************************ Mega Menu ***************************/

.main-menu .navigation>li.has-mega-menu {
    position: static;
}

.main-menu .navigation>li>.mega-menu {
    position: absolute;
    left: 0px;
    right: 0;
    margin: auto;
    width: 100%;
    max-width: 1170px;
    background: var(--white);
    padding: 45px 40px 30px 45px;
    top: 100%;
    z-index: 100;
    opacity: 0;
    -webkit-transform: scaleY(0);
    -moz-transform: scaleY(0);
    -ms-transform: scaleY(0);
    -o-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: top;
    -moz-transform-origin: top;
    -ms-transform-origin: top;
    -o-transform-origin: top;
    transform-origin: top;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    -webkit-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
    -ms-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
    -o-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
    box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.05), -2px 0px 5px 1px rgba(0, 0, 0, 0.05);
}

.main-menu .navigation>li:hover>.mega-menu {
    opacity: 1;
    visibility: visible;
    -webkit-transform: scaleY(1);
    -moz-transform: scaleY(1);
    -ms-transform: scaleY(1);
    -o-transform: scaleY(1);
    transform: scaleY(1);
}

.main-menu .navigation>li>.mega-menu .mega-menu-bar {
    position: relative;
}

.main-menu .navigation>li .mega-menu-bar h3 {
    position: relative;
    font-size: var(--font-18);
    font-weight: 500;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
}

.main-menu .navigation>li .mega-menu-bar>ul {
    position: relative;
}

.main-menu .navigation>li .mega-menu-bar .column>ul>li {
    position: relative;
    width: 100%;
    border-bottom: 1px solid var(--lightgrey);
    text-transform: capitalize;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
}

.main-menu .navigation>li .mega-menu-bar .column {
    position: relative;
    margin-bottom: 10px;
}

.main-menu .navigation>li .mega-menu-bar .column>ul>li:last-child {
    border: none;
}

.main-menu .navigation>li .mega-menu-bar .column>ul>li>a {
    position: relative;
    display: block;
    padding: 10px 20px;
    line-height: 24px;
    font-weight: 400;
    color: var(--black);
    text-align: left;
    font-size: var(--font-14);
    text-transform: capitalize;
    transition: all 2s ease;
    -moz-transition: all 2s ease;
    -webkit-transition: all 2s ease;
    -ms-transition: all 2s ease;
    -o-transition: all 2s ease;
}

.main-menu .navigation>li .mega-menu-bar .column>ul>li>a:after {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    width: 0%;
    content: '.';
    color: transparent;
    background: var(--main-color);
    height: 1px;
    text-align: left;
    margin: 0;
    opacity: 0;
}

.main-menu .navigation>li .mega-menu-bar .column>ul>li>a:hover {
    z-index: 1;
    color: var(--white);
}

.main-menu .navigation>li .mega-menu-bar .column>ul>li>a:hover:after {
    z-index: -10;
    animation: fill 1s forwards;
    -webkit-animation: fill 1s forwards;
    -moz-animation: fill 1s forwards;
    opacity: 1;
}

/*** 

====================================================================
		Banner Section
====================================================================

***/

.banner-section {
    position: relative;
    background-size: contain;
    background-repeat: no-repeat;
    padding-bottom: 225px;
}

canvas {
    display: block;
    vertical-align: bottom;
}

/* ---- particles.js container ---- */

#particles-js {
    position: absolute;
    width: 100%;
    height: auto;
}

.banner-section:before {
    content: "";
    position: absolute;
    left: -140px;
    top: 60px;
    width: 355px;
    height: 295px;
    background-image: url('../images/main-banner/2.png');
}

.banner-section:after {
    content: "";
    position: absolute;
    left: 140px;
    bottom: -99px;
    width: 365px;
    height: 300px;
    background-image: url(../images/main-banner/3.png);
}

.banner-section .content-column .content-inner {
    margin-top: 330px;
    /*margin-left: 37%;*/
}

.banner-section .slider-top {
    margin-top: -80px !important;
}

.banner-section .content-column .content-inner .video-link {
    position: relative;
}

.banner-section .content-column .content-inner .video-link a {
    width: 122px;
    display: block;
    height: 120px;
    font-size: 40px;
    background-image: linear-gradient(var(--main-color), var(--secondary));
    text-align: center;
    color: var(--white);
    line-height: 117px;
    border-radius: 50%;
    border: 4px solid var(--white);
    position: relative;
}

.banner-section .content-column .content-inner .video-link .ripple,
.banner-section .content-column .content-inner .video-link .ripple:before,
.banner-section .content-column .content-inner .video-link .ripple:after {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 122px;
    width: 122px;
    margin-left: .5px;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    -webkit-box-shadow: 0 0 0 0 rgb(255 255 255 / 40%);
    -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, .4);
    -ms-box-shadow: 0 0 0 0 rgba(255, 255, 255, .4);
    -o-box-shadow: 0 0 0 0 rgba(255, 255, 255, .4);
    box-shadow: 0 0 0 0 rgb(255 255 255 / 40%);
    -webkit-animation: ripple 3s infinite;
    -moz-animation: ripple 3s infinite;
    -ms-animation: ripple 3s infinite;
    -o-animation: ripple 3s infinite;
    animation: ripple 3s infinite;
}

.banner-section .content-column .content-inner .video-link .ripple:before {
    -webkit-animation-delay: .9s;
    -moz-animation-delay: .9s;
    -ms-animation-delay: .9s;
    -o-animation-delay: .9s;
    animation-delay: .9s;
    content: "";
    position: absolute;
}

.banner-section .content-column .content-inner .video-link .ripple:after {
    -webkit-animation-delay: .6s;
    -moz-animation-delay: .6s;
    -ms-animation-delay: .6s;
    -o-animation-delay: .6s;
    animation-delay: .6s;
    content: "";
    position: absolute;
}

@-webkit-keyframes ripple {
    70% {
        box-shadow: 0 0 0 70px rgba(255, 255, 255, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
}

@keyframes ripple {
    70% {
        box-shadow: 0 0 0 70px rgba(255, 255, 255, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
}

.banner-section .content-column .content-inner h1 {
    color: var(--white);
    font-weight: 700;
    margin: 31px 0 16px;
}

.banner-section .content-column .content-inner p {
    color: var(--white);
    margin-bottom: 30px;
    font-size: var(--font-18);
}

.banner-section .image-column .image-box {
    margin-top: 219px;
    animation-duration: 2s;
    animation-iteration-count: infinite
}

.banner-section .image-column .image-box img {
    animation: bounce 1s infinite alternate;
    -webkit-animation: bounce 1s infinite alternate;
}

@keyframes bounce {
    from {
        transform: translateY(0px);
    }
    to {
        transform: translateY(-15px);
    }
}

@-webkit-keyframes bounce {
    from {
        transform: translateY(0px);
    }
    to {
        transform: translateY(-15px);
    }
}

/*** 

====================================================================
		Banner Section Style Two
====================================================================

***/

.banner-section.style-two {
    overflow: hidden;
    background-size: cover;
}

.banner-section.style-two:before,
.banner-section.style-two:after {
    display: none;
}

.banner-section.style-two .image-column .image-box img.image-vector {
    position: absolute;
    right: 23%;
    animation: bounce 2s infinite alternate;
    -webkit-animation: bounce 2s infinite alternate;
}

.banner-section.style-two .image-column .image-box {
    margin-top: 140px;
    animation-duration: 3s;
    animation-iteration-count: infinite;
}

#stars {
    width: 1px;
    height: 1px;
    background: transparent;
    box-shadow: 719px 1067px var(--light-blue), 673px 1391px var(--light-blue), 1375px 924px var(--light-blue), 156px 614px var(--light-blue), 1981px 1215px var(--light-blue), 1709px 619px var(--light-blue), 853px 342px var(--light-blue), 26px 181px var(--light-blue), 185px 1901px var(--light-blue), 1570px 1434px var(--light-blue), 15px 444px var(--light-blue), 1959px 1377px var(--light-blue), 429px 166px var(--light-blue), 1223px 1837px var(--light-blue), 1341px 556px var(--light-blue), 1670px 1047px var(--light-blue), 1229px 175px var(--light-blue), 772px 1220px var(--light-blue), 1988px 742px var(--light-blue), 619px 502px var(--light-blue), 771px 947px var(--light-blue), 953px 77px var(--light-blue), 361px 977px var(--light-blue), 847px 874px var(--light-blue), 24px 1968px var(--light-blue), 1364px 649px var(--light-blue), 1294px 203px var(--light-blue), 171px 1511px var(--light-blue), 958px 338px var(--light-blue), 1479px 1423px var(--light-blue), 430px 1570px var(--light-blue), 344px 972px var(--light-blue), 1869px 850px var(--light-blue), 971px 1288px var(--light-blue), 1724px 1841px var(--light-blue), 357px 1201px var(--light-blue), 1988px 1758px var(--light-blue), 1749px 1021px var(--light-blue), 1777px 329px var(--light-blue), 1944px 1052px var(--light-blue), 1656px 665px var(--light-blue), 1136px 515px var(--light-blue), 595px 832px var(--light-blue), 521px 1798px var(--light-blue), 150px 1421px var(--light-blue), 1053px 1611px var(--light-blue), 1944px 927px var(--light-blue), 555px 370px var(--light-blue), 499px 1154px var(--light-blue), 1878px 679px var(--light-blue), 1142px 1011px var(--light-blue), 1233px 1288px var(--light-blue), 372px 911px var(--light-blue), 116px 1679px var(--light-blue), 431px 1496px var(--light-blue), 229px 1064px var(--light-blue), 667px 1323px var(--light-blue), 1370px 1794px var(--light-blue), 1041px 1943px var(--light-blue), 539px 192px var(--light-blue), 823px 1198px var(--light-blue), 159px 1955px var(--light-blue), 1532px 985px var(--light-blue), 964px 1443px var(--light-blue), 811px 287px var(--light-blue), 721px 924px var(--light-blue), 1018px 1046px var(--light-blue), 1569px 1422px var(--light-blue), 738px 1724px var(--light-blue), 905px 1591px var(--light-blue), 622px 978px var(--light-blue), 766px 657px var(--light-blue), 1633px 1690px var(--light-blue), 1885px 1249px var(--light-blue), 1966px 323px var(--light-blue), 1900px 1767px var(--light-blue), 660px 1763px var(--light-blue), 659px 1614px var(--light-blue), 668px 780px var(--light-blue), 1488px 1035px var(--light-blue), 358px 315px var(--light-blue), 1655px 374px var(--light-blue), 324px 86px var(--light-blue), 192px 636px var(--light-blue), 1498px 405px var(--light-blue), 1428px 1396px var(--light-blue), 193px 548px var(--light-blue), 663px 1491px var(--light-blue), 246px 1290px var(--light-blue), 300px 284px var(--light-blue), 794px 1830px var(--light-blue), 1423px 1574px var(--light-blue), 989px 380px var(--light-blue), 1092px 464px var(--light-blue), 443px 1778px var(--light-blue), 465px 129px var(--light-blue), 1227px 1914px var(--light-blue), 557px 1225px var(--light-blue), 865px 1220px var(--light-blue), 339px 1493px var(--light-blue), 1563px 1047px var(--light-blue), 1698px 1575px var(--light-blue), 1324px 450px var(--light-blue), 901px 300px var(--light-blue), 123px 1929px var(--light-blue), 722px 843px var(--light-blue), 223px 1469px var(--light-blue), 1639px 1029px var(--light-blue), 963px 1007px var(--light-blue), 1712px 673px var(--light-blue), 480px 265px var(--light-blue), 1781px 963px var(--light-blue), 759px 1460px var(--light-blue), 1622px 1829px var(--light-blue), 637px 1607px var(--light-blue), 724px 464px var(--light-blue), 85px 1990px var(--light-blue), 1063px 1503px var(--light-blue), 410px 1470px var(--light-blue), 810px 782px var(--light-blue), 1373px 1448px var(--light-blue), 1425px 1588px var(--light-blue), 551px 640px var(--light-blue), 1502px 1528px var(--light-blue), 1937px 1633px var(--light-blue), 33px 362px var(--light-blue), 1518px 1113px var(--light-blue), 1752px 50px var(--light-blue), 157px 755px var(--light-blue), 488px 1829px var(--light-blue), 858px 178px var(--light-blue), 113px 1674px var(--light-blue), 606px 1549px var(--light-blue), 380px 1173px var(--light-blue), 1008px 1995px var(--light-blue), 254px 445px var(--light-blue), 1610px 1965px var(--light-blue), 146px 1695px var(--light-blue), 1785px 931px var(--light-blue), 32px 1339px var(--light-blue), 1417px 624px var(--light-blue), 1273px 1792px var(--light-blue), 1968px 1598px var(--light-blue), 751px 1947px var(--light-blue), 638px 1525px var(--light-blue), 456px 178px var(--light-blue), 779px 478px var(--light-blue), 1763px 910px var(--light-blue), 1148px 424px var(--light-blue), 795px 397px var(--light-blue), 1849px 975px var(--light-blue), 598px 1764px var(--light-blue), 1642px 1393px var(--light-blue), 299px 312px var(--light-blue), 49px 506px var(--light-blue), 1345px 1348px var(--light-blue), 1830px 140px var(--light-blue), 1054px 976px var(--light-blue), 83px 288px var(--light-blue), 916px 850px var(--light-blue), 300px 1438px var(--light-blue), 878px 462px var(--light-blue), 1373px 211px var(--light-blue), 36px 1686px var(--light-blue), 1755px 1209px var(--light-blue), 1294px 1815px var(--light-blue), 883px 1441px var(--light-blue), 959px 1870px var(--light-blue), 206px 191px var(--light-blue), 1581px 1861px var(--light-blue), 669px 1871px var(--light-blue), 1792px 1856px var(--light-blue), 1532px 1985px var(--light-blue), 913px 328px var(--light-blue), 195px 146px var(--light-blue), 230px 985px var(--light-blue), 150px 581px var(--light-blue), 1222px 811px var(--light-blue), 1197px 1322px var(--light-blue), 1229px 1534px var(--light-blue), 93px 446px var(--light-blue), 343px 1164px var(--light-blue), 1679px 137px var(--light-blue), 53px 1631px var(--light-blue), 439px 1676px var(--light-blue), 1532px 1135px var(--light-blue), 1114px 983px var(--light-blue), 291px 601px var(--light-blue), 1196px 1719px var(--light-blue), 1593px 1372px var(--light-blue), 772px 588px var(--light-blue), 1130px 508px var(--light-blue), 1517px 1697px var(--light-blue), 39px 1669px var(--light-blue), 1376px 747px var(--light-blue), 1054px 1227px var(--light-blue), 960px 1925px var(--light-blue), 1358px 1148px var(--light-blue), 411px 1392px var(--light-blue), 1226px 84px var(--light-blue), 57px 1139px var(--light-blue), 960px 1358px var(--light-blue), 1798px 1575px var(--light-blue), 369px 1148px var(--light-blue), 484px 1822px var(--light-blue), 471px 855px var(--light-blue), 543px 1259px var(--light-blue), 86px 1353px var(--light-blue), 1646px 1171px var(--light-blue), 971px 1324px var(--light-blue), 126px 1326px var(--light-blue), 1138px 1700px var(--light-blue), 1185px 795px var(--light-blue), 1194px 466px var(--light-blue), 844px 75px var(--light-blue), 380px 444px var(--light-blue), 675px 1654px var(--light-blue), 1792px 1685px var(--light-blue), 402px 1813px var(--light-blue), 861px 564px var(--light-blue), 698px 1429px var(--light-blue), 1700px 1316px var(--light-blue), 1845px 239px var(--light-blue), 28px 96px var(--light-blue), 39px 1156px var(--light-blue), 325px 765px var(--light-blue), 1460px 1297px var(--light-blue), 501px 995px var(--light-blue), 38px 1085px var(--light-blue), 297px 57px var(--light-blue), 1733px 902px var(--light-blue), 506px 1001px var(--light-blue), 1753px 917px var(--light-blue), 1491px 1099px var(--light-blue), 385px 992px var(--light-blue), 401px 804px var(--light-blue), 1749px 1734px var(--light-blue), 305px 378px var(--light-blue), 727px 960px var(--light-blue), 241px 310px var(--light-blue), 990px 839px var(--light-blue), 1229px 1828px var(--light-blue), 1012px 232px var(--light-blue), 520px 440px var(--light-blue), 135px 1073px var(--light-blue), 1311px 1941px var(--light-blue), 1444px 1210px var(--light-blue), 1823px 1765px var(--light-blue), 452px 733px var(--light-blue), 507px 1047px var(--light-blue), 1219px 1662px var(--light-blue), 300px 263px var(--light-blue), 1027px 1714px var(--light-blue), 1794px 1085px var(--light-blue), 844px 1629px var(--light-blue), 1249px 1056px var(--light-blue), 831px 1363px var(--light-blue), 1276px 755px var(--light-blue), 1514px 1251px var(--light-blue), 1751px 1360px var(--light-blue), 631px 1664px var(--light-blue), 1053px 1085px var(--light-blue), 1302px 724px var(--light-blue), 107px 270px var(--light-blue), 1280px 1891px var(--light-blue), 1729px 210px var(--light-blue), 1838px 1434px var(--light-blue), 612px 322px var(--light-blue), 344px 1489px var(--light-blue), 1212px 648px var(--light-blue), 1092px 402px var(--light-blue), 692px 1627px var(--light-blue), 1979px 88px var(--light-blue), 377px 1986px var(--light-blue), 200px 816px var(--light-blue), 251px 1734px var(--light-blue), 1280px 789px var(--light-blue), 1137px 1468px var(--light-blue), 1424px 1977px var(--light-blue), 1264px 156px var(--light-blue), 389px 1371px var(--light-blue), 1839px 10px var(--light-blue), 701px 1320px var(--light-blue), 381px 462px var(--light-blue), 1117px 1228px var(--light-blue), 145px 1775px var(--light-blue), 1013px 423px var(--light-blue), 806px 1481px var(--light-blue), 1788px 1262px var(--light-blue), 778px 1351px var(--light-blue), 877px 1936px var(--light-blue), 1227px 1901px var(--light-blue), 1961px 589px var(--light-blue), 243px 678px var(--light-blue), 1068px 1824px var(--light-blue), 26px 1969px var(--light-blue), 1595px 1621px var(--light-blue), 364px 254px var(--light-blue), 1918px 99px var(--light-blue), 1636px 374px var(--light-blue), 1082px 1047px var(--light-blue), 857px 1289px var(--light-blue), 1453px 359px var(--light-blue), 675px 102px var(--light-blue), 1905px 1399px var(--light-blue), 1355px 802px var(--light-blue), 195px 380px var(--light-blue), 648px 1197px var(--light-blue), 570px 905px var(--light-blue), 1502px 738px var(--light-blue), 30px 1775px var(--light-blue), 1607px 705px var(--light-blue), 1934px 1485px var(--light-blue), 218px 208px var(--light-blue), 1245px 1567px var(--light-blue), 77px 1102px var(--light-blue), 335px 1181px var(--light-blue), 1421px 957px var(--light-blue), 1632px 1572px var(--light-blue), 1005px 1693px var(--light-blue), 1224px 1176px var(--light-blue), 1594px 1559px var(--light-blue), 264px 244px var(--light-blue), 562px 1823px var(--light-blue), 992px 275px var(--light-blue), 1174px 82px var(--light-blue), 613px 322px var(--light-blue), 52px 771px var(--light-blue), 1651px 923px var(--light-blue), 297px 1813px var(--light-blue), 1877px 877px var(--light-blue), 1812px 1096px var(--light-blue), 1699px 51px var(--light-blue), 1409px 246px var(--light-blue), 1895px 1521px var(--light-blue), 362px 112px var(--light-blue), 1718px 616px var(--light-blue), 716px 691px var(--light-blue), 222px 1556px var(--light-blue), 1433px 427px var(--light-blue), 1052px 1813px var(--light-blue), 710px 298px var(--light-blue), 364px 1287px var(--light-blue), 1318px 804px var(--light-blue), 1535px 960px var(--light-blue), 41px 1751px var(--light-blue), 1466px 1204px var(--light-blue), 1519px 195px var(--light-blue), 1264px 1626px var(--light-blue), 460px 366px var(--light-blue), 1334px 2px var(--light-blue), 1859px 284px var(--light-blue), 749px 1083px var(--light-blue), 1000px 1187px var(--light-blue), 158px 568px var(--light-blue), 892px 1222px var(--light-blue), 1185px 1952px var(--light-blue), 1509px 1137px var(--light-blue), 373px 1402px var(--light-blue), 1327px 370px var(--light-blue), 1180px 1637px var(--light-blue), 1816px 236px var(--light-blue), 836px 1036px var(--light-blue), 410px 1504px var(--light-blue), 1389px 1182px var(--light-blue), 1089px 1281px var(--light-blue), 1144px 1956px var(--light-blue), 581px 412px var(--light-blue), 1524px 685px var(--light-blue), 602px 379px var(--light-blue), 1896px 731px var(--light-blue), 509px 306px var(--light-blue), 982px 1127px var(--light-blue), 696px 552px var(--light-blue), 1227px 1977px var(--light-blue), 1114px 1154px var(--light-blue), 129px 425px var(--light-blue), 1464px 437px var(--light-blue), 1164px 1298px var(--light-blue), 349px 1899px var(--light-blue), 534px 207px var(--light-blue), 1741px 23px var(--light-blue), 1646px 477px var(--light-blue), 1289px 1132px var(--light-blue), 500px 1903px var(--light-blue), 843px 1790px var(--light-blue), 601px 1037px var(--light-blue), 1303px 1678px var(--light-blue), 878px 964px var(--light-blue), 1279px 713px var(--light-blue), 731px 1988px var(--light-blue), 1789px 466px var(--light-blue), 553px 67px var(--light-blue), 849px 908px var(--light-blue), 1459px 1716px var(--light-blue), 1011px 443px var(--light-blue), 932px 1391px var(--light-blue), 517px 332px var(--light-blue), 590px 73px var(--light-blue), 549px 169px var(--light-blue), 642px 475px var(--light-blue), 1002px 1218px var(--light-blue), 1134px 26px var(--light-blue), 1127px 1065px var(--light-blue), 1361px 1277px var(--light-blue), 1092px 535px var(--light-blue), 408px 1228px var(--light-blue), 1745px 1675px var(--light-blue), 1597px 73px var(--light-blue), 13px 1364px var(--light-blue), 1721px 986px var(--light-blue), 1418px 848px var(--light-blue), 1855px 114px var(--light-blue), 1356px 1729px var(--light-blue), 1218px 969px var(--light-blue), 638px 344px var(--light-blue), 319px 1863px var(--light-blue), 858px 704px var(--light-blue), 1226px 144px var(--light-blue), 1245px 617px var(--light-blue), 1686px 1263px var(--light-blue), 525px 1288px var(--light-blue), 1672px 1871px var(--light-blue), 1553px 522px var(--light-blue), 1065px 1159px var(--light-blue), 1824px 322px var(--light-blue), 1373px 372px var(--light-blue), 781px 399px var(--light-blue), 131px 1223px var(--light-blue), 1495px 332px var(--light-blue), 1621px 1996px var(--light-blue), 1321px 1685px var(--light-blue), 1175px 52px var(--light-blue), 689px 436px var(--light-blue), 1581px 1149px var(--light-blue), 1369px 1728px var(--light-blue), 181px 609px var(--light-blue), 626px 507px var(--light-blue), 1692px 1629px var(--light-blue), 925px 1522px var(--light-blue), 180px 47px var(--light-blue), 1325px 760px var(--light-blue), 474px 176px var(--light-blue), 1566px 300px var(--light-blue), 430px 462px var(--light-blue), 1509px 291px var(--light-blue), 1309px 670px var(--light-blue), 194px 227px var(--light-blue), 18px 320px var(--light-blue), 1111px 1106px var(--light-blue), 398px 1062px var(--light-blue), 690px 453px var(--light-blue), 1980px 531px var(--light-blue), 1147px 1506px var(--light-blue), 173px 1221px var(--light-blue), 339px 531px var(--light-blue), 1839px 1408px var(--light-blue), 1477px 95px var(--light-blue), 151px 1305px var(--light-blue), 1826px 101px var(--light-blue), 689px 454px var(--light-blue), 913px 1049px var(--light-blue), 947px 649px var(--light-blue), 827px 286px var(--light-blue), 1228px 977px var(--light-blue), 1278px 1282px var(--light-blue), 764px 826px var(--light-blue), 616px 1634px var(--light-blue), 1734px 871px var(--light-blue), 620px 452px var(--light-blue), 1255px 1250px var(--light-blue), 1600px 1496px var(--light-blue), 630px 1923px var(--light-blue), 1195px 512px var(--light-blue), 992px 461px var(--light-blue), 1427px 1344px var(--light-blue), 76px 901px var(--light-blue), 377px 615px var(--light-blue), 650px 1321px var(--light-blue), 1622px 346px var(--light-blue), 1214px 1920px var(--light-blue), 1804px 333px var(--light-blue), 1180px 1623px var(--light-blue), 237px 653px var(--light-blue), 889px 636px var(--light-blue), 332px 170px var(--light-blue), 587px 1244px var(--light-blue), 989px 1817px var(--light-blue), 984px 377px var(--light-blue), 294px 1682px var(--light-blue), 994px 350px var(--light-blue), 1738px 34px var(--light-blue), 804px 510px var(--light-blue), 1273px 1348px var(--light-blue), 223px 367px var(--light-blue), 1220px 1450px var(--light-blue), 1931px 576px var(--light-blue), 1197px 1682px var(--light-blue), 725px 616px var(--light-blue), 222px 1465px var(--light-blue), 997px 449px var(--light-blue), 1947px 1762px var(--light-blue), 1023px 290px var(--light-blue), 1977px 689px var(--light-blue), 1477px 807px var(--light-blue), 781px 1586px var(--light-blue), 1937px 1323px var(--light-blue), 1854px 832px var(--light-blue), 730px 521px var(--light-blue), 820px 1834px var(--light-blue), 1528px 370px var(--light-blue), 40px 748px var(--light-blue), 834px 1828px var(--light-blue), 1716px 1258px var(--light-blue), 1566px 1572px var(--light-blue), 822px 491px var(--light-blue), 845px 579px var(--light-blue), 767px 104px var(--light-blue), 389px 211px var(--light-blue), 1406px 2px var(--light-blue), 109px 838px var(--light-blue), 1401px 53px var(--light-blue), 1166px 1085px var(--light-blue), 252px 1030px var(--light-blue), 740px 697px var(--light-blue), 1323px 1454px var(--light-blue), 1621px 1508px var(--light-blue), 1857px 1208px var(--light-blue), 1827px 1744px var(--light-blue), 594px 770px var(--light-blue), 1127px 1795px var(--light-blue), 1599px 191px var(--light-blue), 1394px 908px var(--light-blue), 1913px 1179px var(--light-blue), 1055px 15px var(--light-blue), 990px 625px var(--light-blue), 1070px 353px var(--light-blue), 6px 141px var(--light-blue), 193px 943px var(--light-blue), 316px 1406px var(--light-blue), 677px 767px var(--light-blue), 1460px 1617px var(--light-blue), 196px 849px var(--light-blue), 292px 478px var(--light-blue), 1950px 910px var(--light-blue), 1181px 1067px var(--light-blue), 796px 580px var(--light-blue), 946px 864px var(--light-blue), 535px 1303px var(--light-blue), 1747px 1756px var(--light-blue), 1261px 945px var(--light-blue), 1px 681px var(--light-blue), 367px 548px var(--light-blue), 1470px 821px var(--light-blue), 889px 1702px var(--light-blue), 1068px 1107px var(--light-blue), 439px 1094px var(--light-blue), 576px 1550px var(--light-blue), 612px 1741px var(--light-blue), 732px 1205px var(--light-blue), 1487px 482px var(--light-blue), 1936px 470px var(--light-blue), 1409px 193px var(--light-blue), 120px 1804px var(--light-blue), 688px 1503px var(--light-blue), 652px 1813px var(--light-blue), 90px 158px var(--light-blue), 919px 113px var(--light-blue), 987px 1300px var(--light-blue), 363px 1929px var(--light-blue), 1387px 1089px var(--light-blue), 1068px 1072px var(--light-blue), 283px 900px var(--light-blue), 1435px 1494px var(--light-blue), 1878px 1049px var(--light-blue), 461px 1566px var(--light-blue), 919px 1228px var(--light-blue), 1263px 969px var(--light-blue), 1101px 1681px var(--light-blue), 1504px 1839px var(--light-blue), 358px 1770px var(--light-blue), 1329px 408px var(--light-blue), 571px 158px var(--light-blue), 1106px 549px var(--light-blue), 669px 680px var(--light-blue), 968px 659px var(--light-blue), 746px 1970px var(--light-blue), 1995px 1394px var(--light-blue), 86px 1407px var(--light-blue), 756px 654px var(--light-blue), 197px 11px var(--light-blue), 608px 38px var(--light-blue), 208px 518px var(--light-blue), 53px 1757px var(--light-blue), 1992px 799px var(--light-blue), 86px 1266px var(--light-blue), 1774px 717px var(--light-blue), 698px 399px var(--light-blue), 477px 26px var(--light-blue), 1117px 25px var(--light-blue), 1391px 50px var(--light-blue), 1205px 1245px var(--light-blue), 1261px 937px var(--light-blue), 1554px 884px var(--light-blue), 937px 992px var(--light-blue), 1416px 1178px var(--light-blue), 1912px 864px var(--light-blue), 598px 1240px var(--light-blue), 1420px 1510px var(--light-blue), 853px 892px var(--light-blue), 1288px 1630px var(--light-blue), 19px 695px var(--light-blue), 600px 1594px var(--light-blue), 183px 1242px var(--light-blue), 620px 59px var(--light-blue), 1854px 797px var(--light-blue), 1055px 1974px var(--light-blue), 1939px 364px var(--light-blue), 1934px 1624px var(--light-blue), 861px 901px var(--light-blue), 1372px 1611px var(--light-blue), 95px 39px var(--light-blue), 751px 1605px var(--light-blue), 1181px 45px var(--light-blue), 1350px 478px var(--light-blue), 747px 53px var(--light-blue), 916px 1125px var(--light-blue), 352px 218px var(--light-blue), 294px 1845px var(--light-blue), 1673px 1489px var(--light-blue), 1262px 67px var(--light-blue), 1758px 601px var(--light-blue), 1261px 1260px var(--light-blue), 1193px 766px var(--light-blue), 16px 429px var(--light-blue), 1479px 1955px var(--light-blue), 190px 547px var(--light-blue), 274px 1253px var(--light-blue), 963px 417px var(--light-blue), 703px 1127px var(--light-blue), 1342px 219px var(--light-blue), 426px 1677px var(--light-blue), 1535px 133px var(--light-blue), 615px 1917px var(--light-blue), 648px 1982px var(--light-blue), 1791px 1219px var(--light-blue), 1526px 1880px var(--light-blue), 1909px 473px var(--light-blue), 212px 1922px var(--light-blue), 1974px 1011px var(--light-blue), 1766px 94px var(--light-blue), 343px 1130px var(--light-blue), 1386px 1066px var(--light-blue), 1230px 824px var(--light-blue), 1282px 521px var(--light-blue), 510px 312px var(--light-blue), 1570px 1114px var(--light-blue), 1571px 1222px var(--light-blue), 848px 245px var(--light-blue), 1468px 1527px var(--light-blue), 58px 241px var(--light-blue), 1665px 197px var(--light-blue), 1816px 168px var(--light-blue), 489px 1614px var(--light-blue), 1561px 1823px var(--light-blue), 466px 1494px var(--light-blue), 607px 325px var(--light-blue), 849px 1399px var(--light-blue), 875px 1250px var(--light-blue), 1608px 1291px var(--light-blue), 182px 1052px var(--light-blue), 124px 1027px var(--light-blue), 961px 1045px var(--light-blue), 987px 1182px var(--light-blue), 552px 97px var(--light-blue), 86px 1371px var(--light-blue), 1979px 1226px var(--light-blue), 285px 948px var(--light-blue), 378px 897px var(--light-blue), 320px 1213px var(--light-blue), 1957px 311px var(--light-blue), 1982px 657px var(--light-blue), 530px 1815px var(--light-blue), 1321px 257px var(--light-blue), 1220px 1863px var(--light-blue), 1241px 1964px var(--light-blue), 5px 528px var(--light-blue), 882px 505px var(--light-blue), 1380px 446px var(--light-blue), 964px 818px var(--light-blue), 1896px 1102px var(--light-blue), 631px 1770px var(--light-blue), 61px 1614px var(--light-blue), 1254px 1088px var(--light-blue), 235px 536px var(--light-blue), 922px 498px var(--light-blue), 1610px 1807px var(--light-blue), 816px 1456px var(--light-blue), 1469px 507px var(--light-blue), 1342px 1609px var(--light-blue);
    animation: animStar 50s linear infinite;
}

#stars:after {
    content: " ";
    position: absolute;
    top: 2000px;
    width: 1px;
    height: 1px;
    background: transparent;
    box-shadow: 719px 1067px var(--light-blue), 673px 1391px var(--light-blue), 1375px 924px var(--light-blue), 156px 614px var(--light-blue), 1981px 1215px var(--light-blue), 1709px 619px var(--light-blue), 853px 342px var(--light-blue), 26px 181px var(--light-blue), 185px 1901px var(--light-blue), 1570px 1434px var(--light-blue), 15px 444px var(--light-blue), 1959px 1377px var(--light-blue), 429px 166px var(--light-blue), 1223px 1837px var(--light-blue), 1341px 556px var(--light-blue), 1670px 1047px var(--light-blue), 1229px 175px var(--light-blue), 772px 1220px var(--light-blue), 1988px 742px var(--light-blue), 619px 502px var(--light-blue), 771px 947px var(--light-blue), 953px 77px var(--light-blue), 361px 977px var(--light-blue), 847px 874px var(--light-blue), 24px 1968px var(--light-blue), 1364px 649px var(--light-blue), 1294px 203px var(--light-blue), 171px 1511px var(--light-blue), 958px 338px var(--light-blue), 1479px 1423px var(--light-blue), 430px 1570px var(--light-blue), 344px 972px var(--light-blue), 1869px 850px var(--light-blue), 971px 1288px var(--light-blue), 1724px 1841px var(--light-blue), 357px 1201px var(--light-blue), 1988px 1758px var(--light-blue), 1749px 1021px var(--light-blue), 1777px 329px var(--light-blue), 1944px 1052px var(--light-blue), 1656px 665px var(--light-blue), 1136px 515px var(--light-blue), 595px 832px var(--light-blue), 521px 1798px var(--light-blue), 150px 1421px var(--light-blue), 1053px 1611px var(--light-blue), 1944px 927px var(--light-blue), 555px 370px var(--light-blue), 499px 1154px var(--light-blue), 1878px 679px var(--light-blue), 1142px 1011px var(--light-blue), 1233px 1288px var(--light-blue), 372px 911px var(--light-blue), 116px 1679px var(--light-blue), 431px 1496px var(--light-blue), 229px 1064px var(--light-blue), 667px 1323px var(--light-blue), 1370px 1794px var(--light-blue), 1041px 1943px var(--light-blue), 539px 192px var(--light-blue), 823px 1198px var(--light-blue), 159px 1955px var(--light-blue), 1532px 985px var(--light-blue), 964px 1443px var(--light-blue), 811px 287px var(--light-blue), 721px 924px var(--light-blue), 1018px 1046px var(--light-blue), 1569px 1422px var(--light-blue), 738px 1724px var(--light-blue), 905px 1591px var(--light-blue), 622px 978px var(--light-blue), 766px 657px var(--light-blue), 1633px 1690px var(--light-blue), 1885px 1249px var(--light-blue), 1966px 323px var(--light-blue), 1900px 1767px var(--light-blue), 660px 1763px var(--light-blue), 659px 1614px var(--light-blue), 668px 780px var(--light-blue), 1488px 1035px var(--light-blue), 358px 315px var(--light-blue), 1655px 374px var(--light-blue), 324px 86px var(--light-blue), 192px 636px var(--light-blue), 1498px 405px var(--light-blue), 1428px 1396px var(--light-blue), 193px 548px var(--light-blue), 663px 1491px var(--light-blue), 246px 1290px var(--light-blue), 300px 284px var(--light-blue), 794px 1830px var(--light-blue), 1423px 1574px var(--light-blue), 989px 380px var(--light-blue), 1092px 464px var(--light-blue), 443px 1778px var(--light-blue), 465px 129px var(--light-blue), 1227px 1914px var(--light-blue), 557px 1225px var(--light-blue), 865px 1220px var(--light-blue), 339px 1493px var(--light-blue), 1563px 1047px var(--light-blue), 1698px 1575px var(--light-blue), 1324px 450px var(--light-blue), 901px 300px var(--light-blue), 123px 1929px var(--light-blue), 722px 843px var(--light-blue), 223px 1469px var(--light-blue), 1639px 1029px var(--light-blue), 963px 1007px var(--light-blue), 1712px 673px var(--light-blue), 480px 265px var(--light-blue), 1781px 963px var(--light-blue), 759px 1460px var(--light-blue), 1622px 1829px var(--light-blue), 637px 1607px var(--light-blue), 724px 464px var(--light-blue), 85px 1990px var(--light-blue), 1063px 1503px var(--light-blue), 410px 1470px var(--light-blue), 810px 782px var(--light-blue), 1373px 1448px var(--light-blue), 1425px 1588px var(--light-blue), 551px 640px var(--light-blue), 1502px 1528px var(--light-blue), 1937px 1633px var(--light-blue), 33px 362px var(--light-blue), 1518px 1113px var(--light-blue), 1752px 50px var(--light-blue), 157px 755px var(--light-blue), 488px 1829px var(--light-blue), 858px 178px var(--light-blue), 113px 1674px var(--light-blue), 606px 1549px var(--light-blue), 380px 1173px var(--light-blue), 1008px 1995px var(--light-blue), 254px 445px var(--light-blue), 1610px 1965px var(--light-blue), 146px 1695px var(--light-blue), 1785px 931px var(--light-blue), 32px 1339px var(--light-blue), 1417px 624px var(--light-blue), 1273px 1792px var(--light-blue), 1968px 1598px var(--light-blue), 751px 1947px var(--light-blue), 638px 1525px var(--light-blue), 456px 178px var(--light-blue), 779px 478px var(--light-blue), 1763px 910px var(--light-blue), 1148px 424px var(--light-blue), 795px 397px var(--light-blue), 1849px 975px var(--light-blue), 598px 1764px var(--light-blue), 1642px 1393px var(--light-blue), 299px 312px var(--light-blue), 49px 506px var(--light-blue), 1345px 1348px var(--light-blue), 1830px 140px var(--light-blue), 1054px 976px var(--light-blue), 83px 288px var(--light-blue), 916px 850px var(--light-blue), 300px 1438px var(--light-blue), 878px 462px var(--light-blue), 1373px 211px var(--light-blue), 36px 1686px var(--light-blue), 1755px 1209px var(--light-blue), 1294px 1815px var(--light-blue), 883px 1441px var(--light-blue), 959px 1870px var(--light-blue), 206px 191px var(--light-blue), 1581px 1861px var(--light-blue), 669px 1871px var(--light-blue), 1792px 1856px var(--light-blue), 1532px 1985px var(--light-blue), 913px 328px var(--light-blue), 195px 146px var(--light-blue), 230px 985px var(--light-blue), 150px 581px var(--light-blue), 1222px 811px var(--light-blue), 1197px 1322px var(--light-blue), 1229px 1534px var(--light-blue), 93px 446px var(--light-blue), 343px 1164px var(--light-blue), 1679px 137px var(--light-blue), 53px 1631px var(--light-blue), 439px 1676px var(--light-blue), 1532px 1135px var(--light-blue), 1114px 983px var(--light-blue), 291px 601px var(--light-blue), 1196px 1719px var(--light-blue), 1593px 1372px var(--light-blue), 772px 588px var(--light-blue), 1130px 508px var(--light-blue), 1517px 1697px var(--light-blue), 39px 1669px var(--light-blue), 1376px 747px var(--light-blue), 1054px 1227px var(--light-blue), 960px 1925px var(--light-blue), 1358px 1148px var(--light-blue), 411px 1392px var(--light-blue), 1226px 84px var(--light-blue), 57px 1139px var(--light-blue), 960px 1358px var(--light-blue), 1798px 1575px var(--light-blue), 369px 1148px var(--light-blue), 484px 1822px var(--light-blue), 471px 855px var(--light-blue), 543px 1259px var(--light-blue), 86px 1353px var(--light-blue), 1646px 1171px var(--light-blue), 971px 1324px var(--light-blue), 126px 1326px var(--light-blue), 1138px 1700px var(--light-blue), 1185px 795px var(--light-blue), 1194px 466px var(--light-blue), 844px 75px var(--light-blue), 380px 444px var(--light-blue), 675px 1654px var(--light-blue), 1792px 1685px var(--light-blue), 402px 1813px var(--light-blue), 861px 564px var(--light-blue), 698px 1429px var(--light-blue), 1700px 1316px var(--light-blue), 1845px 239px var(--light-blue), 28px 96px var(--light-blue), 39px 1156px var(--light-blue), 325px 765px var(--light-blue), 1460px 1297px var(--light-blue), 501px 995px var(--light-blue), 38px 1085px var(--light-blue), 297px 57px var(--light-blue), 1733px 902px var(--light-blue), 506px 1001px var(--light-blue), 1753px 917px var(--light-blue), 1491px 1099px var(--light-blue), 385px 992px var(--light-blue), 401px 804px var(--light-blue), 1749px 1734px var(--light-blue), 305px 378px var(--light-blue), 727px 960px var(--light-blue), 241px 310px var(--light-blue), 990px 839px var(--light-blue), 1229px 1828px var(--light-blue), 1012px 232px var(--light-blue), 520px 440px var(--light-blue), 135px 1073px var(--light-blue), 1311px 1941px var(--light-blue), 1444px 1210px var(--light-blue), 1823px 1765px var(--light-blue), 452px 733px var(--light-blue), 507px 1047px var(--light-blue), 1219px 1662px var(--light-blue), 300px 263px var(--light-blue), 1027px 1714px var(--light-blue), 1794px 1085px var(--light-blue), 844px 1629px var(--light-blue), 1249px 1056px var(--light-blue), 831px 1363px var(--light-blue), 1276px 755px var(--light-blue), 1514px 1251px var(--light-blue), 1751px 1360px var(--light-blue), 631px 1664px var(--light-blue), 1053px 1085px var(--light-blue), 1302px 724px var(--light-blue), 107px 270px var(--light-blue), 1280px 1891px var(--light-blue), 1729px 210px var(--light-blue), 1838px 1434px var(--light-blue), 612px 322px var(--light-blue), 344px 1489px var(--light-blue), 1212px 648px var(--light-blue), 1092px 402px var(--light-blue), 692px 1627px var(--light-blue), 1979px 88px var(--light-blue), 377px 1986px var(--light-blue), 200px 816px var(--light-blue), 251px 1734px var(--light-blue), 1280px 789px var(--light-blue), 1137px 1468px var(--light-blue), 1424px 1977px var(--light-blue), 1264px 156px var(--light-blue), 389px 1371px var(--light-blue), 1839px 10px var(--light-blue), 701px 1320px var(--light-blue), 381px 462px var(--light-blue), 1117px 1228px var(--light-blue), 145px 1775px var(--light-blue), 1013px 423px var(--light-blue), 806px 1481px var(--light-blue), 1788px 1262px var(--light-blue), 778px 1351px var(--light-blue), 877px 1936px var(--light-blue), 1227px 1901px var(--light-blue), 1961px 589px var(--light-blue), 243px 678px var(--light-blue), 1068px 1824px var(--light-blue), 26px 1969px var(--light-blue), 1595px 1621px var(--light-blue), 364px 254px var(--light-blue), 1918px 99px var(--light-blue), 1636px 374px var(--light-blue), 1082px 1047px var(--light-blue), 857px 1289px var(--light-blue), 1453px 359px var(--light-blue), 675px 102px var(--light-blue), 1905px 1399px var(--light-blue), 1355px 802px var(--light-blue), 195px 380px var(--light-blue), 648px 1197px var(--light-blue), 570px 905px var(--light-blue), 1502px 738px var(--light-blue), 30px 1775px var(--light-blue), 1607px 705px var(--light-blue), 1934px 1485px var(--light-blue), 218px 208px var(--light-blue), 1245px 1567px var(--light-blue), 77px 1102px var(--light-blue), 335px 1181px var(--light-blue), 1421px 957px var(--light-blue), 1632px 1572px var(--light-blue), 1005px 1693px var(--light-blue), 1224px 1176px var(--light-blue), 1594px 1559px var(--light-blue), 264px 244px var(--light-blue), 562px 1823px var(--light-blue), 992px 275px var(--light-blue), 1174px 82px var(--light-blue), 613px 322px var(--light-blue), 52px 771px var(--light-blue), 1651px 923px var(--light-blue), 297px 1813px var(--light-blue), 1877px 877px var(--light-blue), 1812px 1096px var(--light-blue), 1699px 51px var(--light-blue), 1409px 246px var(--light-blue), 1895px 1521px var(--light-blue), 362px 112px var(--light-blue), 1718px 616px var(--light-blue), 716px 691px var(--light-blue), 222px 1556px var(--light-blue), 1433px 427px var(--light-blue), 1052px 1813px var(--light-blue), 710px 298px var(--light-blue), 364px 1287px var(--light-blue), 1318px 804px var(--light-blue), 1535px 960px var(--light-blue), 41px 1751px var(--light-blue), 1466px 1204px var(--light-blue), 1519px 195px var(--light-blue), 1264px 1626px var(--light-blue), 460px 366px var(--light-blue), 1334px 2px var(--light-blue), 1859px 284px var(--light-blue), 749px 1083px var(--light-blue), 1000px 1187px var(--light-blue), 158px 568px var(--light-blue), 892px 1222px var(--light-blue), 1185px 1952px var(--light-blue), 1509px 1137px var(--light-blue), 373px 1402px var(--light-blue), 1327px 370px var(--light-blue), 1180px 1637px var(--light-blue), 1816px 236px var(--light-blue), 836px 1036px var(--light-blue), 410px 1504px var(--light-blue), 1389px 1182px var(--light-blue), 1089px 1281px var(--light-blue), 1144px 1956px var(--light-blue), 581px 412px var(--light-blue), 1524px 685px var(--light-blue), 602px 379px var(--light-blue), 1896px 731px var(--light-blue), 509px 306px var(--light-blue), 982px 1127px var(--light-blue), 696px 552px var(--light-blue), 1227px 1977px var(--light-blue), 1114px 1154px var(--light-blue), 129px 425px var(--light-blue), 1464px 437px var(--light-blue), 1164px 1298px var(--light-blue), 349px 1899px var(--light-blue), 534px 207px var(--light-blue), 1741px 23px var(--light-blue), 1646px 477px var(--light-blue), 1289px 1132px var(--light-blue), 500px 1903px var(--light-blue), 843px 1790px var(--light-blue), 601px 1037px var(--light-blue), 1303px 1678px var(--light-blue), 878px 964px var(--light-blue), 1279px 713px var(--light-blue), 731px 1988px var(--light-blue), 1789px 466px var(--light-blue), 553px 67px var(--light-blue), 849px 908px var(--light-blue), 1459px 1716px var(--light-blue), 1011px 443px var(--light-blue), 932px 1391px var(--light-blue), 517px 332px var(--light-blue), 590px 73px var(--light-blue), 549px 169px var(--light-blue), 642px 475px var(--light-blue), 1002px 1218px var(--light-blue), 1134px 26px var(--light-blue), 1127px 1065px var(--light-blue), 1361px 1277px var(--light-blue), 1092px 535px var(--light-blue), 408px 1228px var(--light-blue), 1745px 1675px var(--light-blue), 1597px 73px var(--light-blue), 13px 1364px var(--light-blue), 1721px 986px var(--light-blue), 1418px 848px var(--light-blue), 1855px 114px var(--light-blue), 1356px 1729px var(--light-blue), 1218px 969px var(--light-blue), 638px 344px var(--light-blue), 319px 1863px var(--light-blue), 858px 704px var(--light-blue), 1226px 144px var(--light-blue), 1245px 617px var(--light-blue), 1686px 1263px var(--light-blue), 525px 1288px var(--light-blue), 1672px 1871px var(--light-blue), 1553px 522px var(--light-blue), 1065px 1159px var(--light-blue), 1824px 322px var(--light-blue), 1373px 372px var(--light-blue), 781px 399px var(--light-blue), 131px 1223px var(--light-blue), 1495px 332px var(--light-blue), 1621px 1996px var(--light-blue), 1321px 1685px var(--light-blue), 1175px 52px var(--light-blue), 689px 436px var(--light-blue), 1581px 1149px var(--light-blue), 1369px 1728px var(--light-blue), 181px 609px var(--light-blue), 626px 507px var(--light-blue), 1692px 1629px var(--light-blue), 925px 1522px var(--light-blue), 180px 47px var(--light-blue), 1325px 760px var(--light-blue), 474px 176px var(--light-blue), 1566px 300px var(--light-blue), 430px 462px var(--light-blue), 1509px 291px var(--light-blue), 1309px 670px var(--light-blue), 194px 227px var(--light-blue), 18px 320px var(--light-blue), 1111px 1106px var(--light-blue), 398px 1062px var(--light-blue), 690px 453px var(--light-blue), 1980px 531px var(--light-blue), 1147px 1506px var(--light-blue), 173px 1221px var(--light-blue), 339px 531px var(--light-blue), 1839px 1408px var(--light-blue), 1477px 95px var(--light-blue), 151px 1305px var(--light-blue), 1826px 101px var(--light-blue), 689px 454px var(--light-blue), 913px 1049px var(--light-blue), 947px 649px var(--light-blue), 827px 286px var(--light-blue), 1228px 977px var(--light-blue), 1278px 1282px var(--light-blue), 764px 826px var(--light-blue), 616px 1634px var(--light-blue), 1734px 871px var(--light-blue), 620px 452px var(--light-blue), 1255px 1250px var(--light-blue), 1600px 1496px var(--light-blue), 630px 1923px var(--light-blue), 1195px 512px var(--light-blue), 992px 461px var(--light-blue), 1427px 1344px var(--light-blue), 76px 901px var(--light-blue), 377px 615px var(--light-blue), 650px 1321px var(--light-blue), 1622px 346px var(--light-blue), 1214px 1920px var(--light-blue), 1804px 333px var(--light-blue), 1180px 1623px var(--light-blue), 237px 653px var(--light-blue), 889px 636px var(--light-blue), 332px 170px var(--light-blue), 587px 1244px var(--light-blue), 989px 1817px var(--light-blue), 984px 377px var(--light-blue), 294px 1682px var(--light-blue), 994px 350px var(--light-blue), 1738px 34px var(--light-blue), 804px 510px var(--light-blue), 1273px 1348px var(--light-blue), 223px 367px var(--light-blue), 1220px 1450px var(--light-blue), 1931px 576px var(--light-blue), 1197px 1682px var(--light-blue), 725px 616px var(--light-blue), 222px 1465px var(--light-blue), 997px 449px var(--light-blue), 1947px 1762px var(--light-blue), 1023px 290px var(--light-blue), 1977px 689px var(--light-blue), 1477px 807px var(--light-blue), 781px 1586px var(--light-blue), 1937px 1323px var(--light-blue), 1854px 832px var(--light-blue), 730px 521px var(--light-blue), 820px 1834px var(--light-blue), 1528px 370px var(--light-blue), 40px 748px var(--light-blue), 834px 1828px var(--light-blue), 1716px 1258px var(--light-blue), 1566px 1572px var(--light-blue), 822px 491px var(--light-blue), 845px 579px var(--light-blue), 767px 104px var(--light-blue), 389px 211px var(--light-blue), 1406px 2px var(--light-blue), 109px 838px var(--light-blue), 1401px 53px var(--light-blue), 1166px 1085px var(--light-blue), 252px 1030px var(--light-blue), 740px 697px var(--light-blue), 1323px 1454px var(--light-blue), 1621px 1508px var(--light-blue), 1857px 1208px var(--light-blue), 1827px 1744px var(--light-blue), 594px 770px var(--light-blue), 1127px 1795px var(--light-blue), 1599px 191px var(--light-blue), 1394px 908px var(--light-blue), 1913px 1179px var(--light-blue), 1055px 15px var(--light-blue), 990px 625px var(--light-blue), 1070px 353px var(--light-blue), 6px 141px var(--light-blue), 193px 943px var(--light-blue), 316px 1406px var(--light-blue), 677px 767px var(--light-blue), 1460px 1617px var(--light-blue), 196px 849px var(--light-blue), 292px 478px var(--light-blue), 1950px 910px var(--light-blue), 1181px 1067px var(--light-blue), 796px 580px var(--light-blue), 946px 864px var(--light-blue), 535px 1303px var(--light-blue), 1747px 1756px var(--light-blue), 1261px 945px var(--light-blue), 1px 681px var(--light-blue), 367px 548px var(--light-blue), 1470px 821px var(--light-blue), 889px 1702px var(--light-blue), 1068px 1107px var(--light-blue), 439px 1094px var(--light-blue), 576px 1550px var(--light-blue), 612px 1741px var(--light-blue), 732px 1205px var(--light-blue), 1487px 482px var(--light-blue), 1936px 470px var(--light-blue), 1409px 193px var(--light-blue), 120px 1804px var(--light-blue), 688px 1503px var(--light-blue), 652px 1813px var(--light-blue), 90px 158px var(--light-blue), 919px 113px var(--light-blue), 987px 1300px var(--light-blue), 363px 1929px var(--light-blue), 1387px 1089px var(--light-blue), 1068px 1072px var(--light-blue), 283px 900px var(--light-blue), 1435px 1494px var(--light-blue), 1878px 1049px var(--light-blue), 461px 1566px var(--light-blue), 919px 1228px var(--light-blue), 1263px 969px var(--light-blue), 1101px 1681px var(--light-blue), 1504px 1839px var(--light-blue), 358px 1770px var(--light-blue), 1329px 408px var(--light-blue), 571px 158px var(--light-blue), 1106px 549px var(--light-blue), 669px 680px var(--light-blue), 968px 659px var(--light-blue), 746px 1970px var(--light-blue), 1995px 1394px var(--light-blue), 86px 1407px var(--light-blue), 756px 654px var(--light-blue), 197px 11px var(--light-blue), 608px 38px var(--light-blue), 208px 518px var(--light-blue), 53px 1757px var(--light-blue), 1992px 799px var(--light-blue), 86px 1266px var(--light-blue), 1774px 717px var(--light-blue), 698px 399px var(--light-blue), 477px 26px var(--light-blue), 1117px 25px var(--light-blue), 1391px 50px var(--light-blue), 1205px 1245px var(--light-blue), 1261px 937px var(--light-blue), 1554px 884px var(--light-blue), 937px 992px var(--light-blue), 1416px 1178px var(--light-blue), 1912px 864px var(--light-blue), 598px 1240px var(--light-blue), 1420px 1510px var(--light-blue), 853px 892px var(--light-blue), 1288px 1630px var(--light-blue), 19px 695px var(--light-blue), 600px 1594px var(--light-blue), 183px 1242px var(--light-blue), 620px 59px var(--light-blue), 1854px 797px var(--light-blue), 1055px 1974px var(--light-blue), 1939px 364px var(--light-blue), 1934px 1624px var(--light-blue), 861px 901px var(--light-blue), 1372px 1611px var(--light-blue), 95px 39px var(--light-blue), 751px 1605px var(--light-blue), 1181px 45px var(--light-blue), 1350px 478px var(--light-blue), 747px 53px var(--light-blue), 916px 1125px var(--light-blue), 352px 218px var(--light-blue), 294px 1845px var(--light-blue), 1673px 1489px var(--light-blue), 1262px 67px var(--light-blue), 1758px 601px var(--light-blue), 1261px 1260px var(--light-blue), 1193px 766px var(--light-blue), 16px 429px var(--light-blue), 1479px 1955px var(--light-blue), 190px 547px var(--light-blue), 274px 1253px var(--light-blue), 963px 417px var(--light-blue), 703px 1127px var(--light-blue), 1342px 219px var(--light-blue), 426px 1677px var(--light-blue), 1535px 133px var(--light-blue), 615px 1917px var(--light-blue), 648px 1982px var(--light-blue), 1791px 1219px var(--light-blue), 1526px 1880px var(--light-blue), 1909px 473px var(--light-blue), 212px 1922px var(--light-blue), 1974px 1011px var(--light-blue), 1766px 94px var(--light-blue), 343px 1130px var(--light-blue), 1386px 1066px var(--light-blue), 1230px 824px var(--light-blue), 1282px 521px var(--light-blue), 510px 312px var(--light-blue), 1570px 1114px var(--light-blue), 1571px 1222px var(--light-blue), 848px 245px var(--light-blue), 1468px 1527px var(--light-blue), 58px 241px var(--light-blue), 1665px 197px var(--light-blue), 1816px 168px var(--light-blue), 489px 1614px var(--light-blue), 1561px 1823px var(--light-blue), 466px 1494px var(--light-blue), 607px 325px var(--light-blue), 849px 1399px var(--light-blue), 875px 1250px var(--light-blue), 1608px 1291px var(--light-blue), 182px 1052px var(--light-blue), 124px 1027px var(--light-blue), 961px 1045px var(--light-blue), 987px 1182px var(--light-blue), 552px 97px var(--light-blue), 86px 1371px var(--light-blue), 1979px 1226px var(--light-blue), 285px 948px var(--light-blue), 378px 897px var(--light-blue), 320px 1213px var(--light-blue), 1957px 311px var(--light-blue), 1982px 657px var(--light-blue), 530px 1815px var(--light-blue), 1321px 257px var(--light-blue), 1220px 1863px var(--light-blue), 1241px 1964px var(--light-blue), 5px 528px var(--light-blue), 882px 505px var(--light-blue), 1380px 446px var(--light-blue), 964px 818px var(--light-blue), 1896px 1102px var(--light-blue), 631px 1770px var(--light-blue), 61px 1614px var(--light-blue), 1254px 1088px var(--light-blue), 235px 536px var(--light-blue), 922px 498px var(--light-blue), 1610px 1807px var(--light-blue), 816px 1456px var(--light-blue), 1469px 507px var(--light-blue), 1342px 1609px var(--light-blue);
}

#stars2 {
    width: 2px;
    height: 2px;
    background: transparent;
    box-shadow: 274px 976px var(--light-blue), 727px 957px var(--light-blue), 295px 1183px var(--light-blue), 1588px 1050px var(--light-blue), 599px 1279px var(--light-blue), 43px 1579px var(--light-blue), 1767px 932px var(--light-blue), 1480px 1382px var(--light-blue), 233px 1901px var(--light-blue), 918px 1294px var(--light-blue), 667px 881px var(--light-blue), 1402px 1714px var(--light-blue), 1563px 1471px var(--light-blue), 1085px 1289px var(--light-blue), 554px 1377px var(--light-blue), 343px 169px var(--light-blue), 77px 894px var(--light-blue), 527px 1661px var(--light-blue), 356px 269px var(--light-blue), 1124px 1658px var(--light-blue), 1562px 752px var(--light-blue), 386px 856px var(--light-blue), 282px 1951px var(--light-blue), 1491px 870px var(--light-blue), 1897px 580px var(--light-blue), 111px 1948px var(--light-blue), 1453px 812px var(--light-blue), 790px 1441px var(--light-blue), 1086px 1176px var(--light-blue), 57px 607px var(--light-blue), 18px 985px var(--light-blue), 1965px 1083px var(--light-blue), 1302px 1057px var(--light-blue), 1189px 699px var(--light-blue), 1206px 1014px var(--light-blue), 787px 1044px var(--light-blue), 140px 1843px var(--light-blue), 1703px 1927px var(--light-blue), 197px 937px var(--light-blue), 1664px 293px var(--light-blue), 1718px 1451px var(--light-blue), 196px 1227px var(--light-blue), 629px 877px var(--light-blue), 758px 725px var(--light-blue), 427px 105px var(--light-blue), 1493px 1524px var(--light-blue), 1204px 1283px var(--light-blue), 1988px 1807px var(--light-blue), 230px 1118px var(--light-blue), 455px 667px var(--light-blue), 1388px 814px var(--light-blue), 1844px 1908px var(--light-blue), 551px 266px var(--light-blue), 627px 1593px var(--light-blue), 312px 1319px var(--light-blue), 710px 1652px var(--light-blue), 963px 1092px var(--light-blue), 313px 1636px var(--light-blue), 713px 305px var(--light-blue), 1900px 418px var(--light-blue), 1983px 77px var(--light-blue), 857px 188px var(--light-blue), 555px 1455px var(--light-blue), 1121px 131px var(--light-blue), 1966px 936px var(--light-blue), 1407px 1827px var(--light-blue), 1560px 1974px var(--light-blue), 1476px 642px var(--light-blue), 1894px 960px var(--light-blue), 1749px 1716px var(--light-blue), 1310px 100px var(--light-blue), 1424px 714px var(--light-blue), 438px 992px var(--light-blue), 1450px 1784px var(--light-blue), 1073px 1026px var(--light-blue), 1050px 1396px var(--light-blue), 1492px 752px var(--light-blue), 1842px 357px var(--light-blue), 103px 1245px var(--light-blue), 170px 540px var(--light-blue), 1263px 868px var(--light-blue), 901px 1081px var(--light-blue), 727px 751px var(--light-blue), 1438px 906px var(--light-blue), 671px 933px var(--light-blue), 1164px 1767px var(--light-blue), 267px 794px var(--light-blue), 1766px 130px var(--light-blue), 908px 837px var(--light-blue), 1939px 1562px var(--light-blue), 468px 1305px var(--light-blue), 1521px 1834px var(--light-blue), 1418px 943px var(--light-blue), 1322px 166px var(--light-blue), 813px 848px var(--light-blue), 1624px 1572px var(--light-blue), 1498px 1269px var(--light-blue), 994px 160px var(--light-blue), 1107px 355px var(--light-blue), 89px 451px var(--light-blue), 604px 1809px var(--light-blue), 1465px 445px var(--light-blue), 1741px 1629px var(--light-blue), 1489px 468px var(--light-blue), 677px 1721px var(--light-blue), 1886px 431px var(--light-blue), 51px 958px var(--light-blue), 682px 604px var(--light-blue), 284px 1144px var(--light-blue), 1210px 598px var(--light-blue), 689px 734px var(--light-blue), 98px 1569px var(--light-blue), 1734px 721px var(--light-blue), 165px 12px var(--light-blue), 42px 136px var(--light-blue), 97px 718px var(--light-blue), 1911px 1357px var(--light-blue), 644px 51px var(--light-blue), 1024px 276px var(--light-blue), 547px 735px var(--light-blue), 1267px 951px var(--light-blue), 1025px 49px var(--light-blue), 1677px 898px var(--light-blue), 146px 52px var(--light-blue), 1639px 1881px var(--light-blue), 599px 1765px var(--light-blue), 1877px 9px var(--light-blue), 305px 382px var(--light-blue), 1411px 304px var(--light-blue), 693px 1885px var(--light-blue), 1104px 55px var(--light-blue), 1085px 1574px var(--light-blue), 169px 1740px var(--light-blue), 144px 245px var(--light-blue), 16px 1654px var(--light-blue), 1051px 348px var(--light-blue), 1941px 594px var(--light-blue), 1159px 360px var(--light-blue), 120px 1237px var(--light-blue), 1191px 874px var(--light-blue), 295px 338px var(--light-blue), 195px 131px var(--light-blue), 520px 1062px var(--light-blue), 147px 1998px var(--light-blue), 687px 588px var(--light-blue), 1327px 1173px var(--light-blue), 329px 848px var(--light-blue), 290px 727px var(--light-blue), 1763px 706px var(--light-blue), 739px 1435px var(--light-blue), 1311px 1652px var(--light-blue), 827px 711px var(--light-blue), 1233px 909px var(--light-blue), 682px 1208px var(--light-blue), 1138px 1503px var(--light-blue), 734px 774px var(--light-blue), 1039px 1621px var(--light-blue), 1389px 180px var(--light-blue), 1573px 1573px var(--light-blue), 52px 1704px var(--light-blue), 60px 548px var(--light-blue), 1619px 1524px var(--light-blue), 1919px 1868px var(--light-blue), 1288px 1057px var(--light-blue), 585px 1347px var(--light-blue), 1982px 1282px var(--light-blue), 663px 1164px var(--light-blue), 150px 23px var(--light-blue), 954px 580px var(--light-blue), 1220px 55px var(--light-blue), 107px 1914px var(--light-blue), 449px 366px var(--light-blue), 1032px 1712px var(--light-blue), 1065px 32px var(--light-blue), 722px 1213px var(--light-blue), 1887px 1910px var(--light-blue), 1313px 1578px var(--light-blue), 1940px 1411px var(--light-blue), 1880px 1938px var(--light-blue), 697px 981px var(--light-blue), 1245px 1808px var(--light-blue), 121px 1205px var(--light-blue), 637px 195px var(--light-blue), 1214px 192px var(--light-blue), 383px 903px var(--light-blue), 299px 228px var(--light-blue), 1696px 1469px var(--light-blue), 1426px 882px var(--light-blue), 1489px 1744px var(--light-blue), 1554px 1859px var(--light-blue), 81px 1686px var(--light-blue), 1214px 1021px var(--light-blue), 78px 201px var(--light-blue), 1471px 1066px var(--light-blue), 816px 1875px var(--light-blue), 346px 1516px var(--light-blue), 1557px 1229px var(--light-blue), 201px 1329px var(--light-blue), 1600px 1243px var(--light-blue), 1240px 205px var(--light-blue);
    animation: animStar 100s linear infinite;
}

#stars2:after {
    content: " ";
    position: absolute;
    top: 2000px;
    width: 2px;
    height: 2px;
    background: transparent;
    box-shadow: 274px 976px var(--light-blue), 727px 957px var(--light-blue), 295px 1183px var(--light-blue), 1588px 1050px var(--light-blue), 599px 1279px var(--light-blue), 43px 1579px var(--light-blue), 1767px 932px var(--light-blue), 1480px 1382px var(--light-blue), 233px 1901px var(--light-blue), 918px 1294px var(--light-blue), 667px 881px var(--light-blue), 1402px 1714px var(--light-blue), 1563px 1471px var(--light-blue), 1085px 1289px var(--light-blue), 554px 1377px var(--light-blue), 343px 169px var(--light-blue), 77px 894px var(--light-blue), 527px 1661px var(--light-blue), 356px 269px var(--light-blue), 1124px 1658px var(--light-blue), 1562px 752px var(--light-blue), 386px 856px var(--light-blue), 282px 1951px var(--light-blue), 1491px 870px var(--light-blue), 1897px 580px var(--light-blue), 111px 1948px var(--light-blue), 1453px 812px var(--light-blue), 790px 1441px var(--light-blue), 1086px 1176px var(--light-blue), 57px 607px var(--light-blue), 18px 985px var(--light-blue), 1965px 1083px var(--light-blue), 1302px 1057px var(--light-blue), 1189px 699px var(--light-blue), 1206px 1014px var(--light-blue), 787px 1044px var(--light-blue), 140px 1843px var(--light-blue), 1703px 1927px var(--light-blue), 197px 937px var(--light-blue), 1664px 293px var(--light-blue), 1718px 1451px var(--light-blue), 196px 1227px var(--light-blue), 629px 877px var(--light-blue), 758px 725px var(--light-blue), 427px 105px var(--light-blue), 1493px 1524px var(--light-blue), 1204px 1283px var(--light-blue), 1988px 1807px var(--light-blue), 230px 1118px var(--light-blue), 455px 667px var(--light-blue), 1388px 814px var(--light-blue), 1844px 1908px var(--light-blue), 551px 266px var(--light-blue), 627px 1593px var(--light-blue), 312px 1319px var(--light-blue), 710px 1652px var(--light-blue), 963px 1092px var(--light-blue), 313px 1636px var(--light-blue), 713px 305px var(--light-blue), 1900px 418px var(--light-blue), 1983px 77px var(--light-blue), 857px 188px var(--light-blue), 555px 1455px var(--light-blue), 1121px 131px var(--light-blue), 1966px 936px var(--light-blue), 1407px 1827px var(--light-blue), 1560px 1974px var(--light-blue), 1476px 642px var(--light-blue), 1894px 960px var(--light-blue), 1749px 1716px var(--light-blue), 1310px 100px var(--light-blue), 1424px 714px var(--light-blue), 438px 992px var(--light-blue), 1450px 1784px var(--light-blue), 1073px 1026px var(--light-blue), 1050px 1396px var(--light-blue), 1492px 752px var(--light-blue), 1842px 357px var(--light-blue), 103px 1245px var(--light-blue), 170px 540px var(--light-blue), 1263px 868px var(--light-blue), 901px 1081px var(--light-blue), 727px 751px var(--light-blue), 1438px 906px var(--light-blue), 671px 933px var(--light-blue), 1164px 1767px var(--light-blue), 267px 794px var(--light-blue), 1766px 130px var(--light-blue), 908px 837px var(--light-blue), 1939px 1562px var(--light-blue), 468px 1305px var(--light-blue), 1521px 1834px var(--light-blue), 1418px 943px var(--light-blue), 1322px 166px var(--light-blue), 813px 848px var(--light-blue), 1624px 1572px var(--light-blue), 1498px 1269px var(--light-blue), 994px 160px var(--light-blue), 1107px 355px var(--light-blue), 89px 451px var(--light-blue), 604px 1809px var(--light-blue), 1465px 445px var(--light-blue), 1741px 1629px var(--light-blue), 1489px 468px var(--light-blue), 677px 1721px var(--light-blue), 1886px 431px var(--light-blue), 51px 958px var(--light-blue), 682px 604px var(--light-blue), 284px 1144px var(--light-blue), 1210px 598px var(--light-blue), 689px 734px var(--light-blue), 98px 1569px var(--light-blue), 1734px 721px var(--light-blue), 165px 12px var(--light-blue), 42px 136px var(--light-blue), 97px 718px var(--light-blue), 1911px 1357px var(--light-blue), 644px 51px var(--light-blue), 1024px 276px var(--light-blue), 547px 735px var(--light-blue), 1267px 951px var(--light-blue), 1025px 49px var(--light-blue), 1677px 898px var(--light-blue), 146px 52px var(--light-blue), 1639px 1881px var(--light-blue), 599px 1765px var(--light-blue), 1877px 9px var(--light-blue), 305px 382px var(--light-blue), 1411px 304px var(--light-blue), 693px 1885px var(--light-blue), 1104px 55px var(--light-blue), 1085px 1574px var(--light-blue), 169px 1740px var(--light-blue), 144px 245px var(--light-blue), 16px 1654px var(--light-blue), 1051px 348px var(--light-blue), 1941px 594px var(--light-blue), 1159px 360px var(--light-blue), 120px 1237px var(--light-blue), 1191px 874px var(--light-blue), 295px 338px var(--light-blue), 195px 131px var(--light-blue), 520px 1062px var(--light-blue), 147px 1998px var(--light-blue), 687px 588px var(--light-blue), 1327px 1173px var(--light-blue), 329px 848px var(--light-blue), 290px 727px var(--light-blue), 1763px 706px var(--light-blue), 739px 1435px var(--light-blue), 1311px 1652px var(--light-blue), 827px 711px var(--light-blue), 1233px 909px var(--light-blue), 682px 1208px var(--light-blue), 1138px 1503px var(--light-blue), 734px 774px var(--light-blue), 1039px 1621px var(--light-blue), 1389px 180px var(--light-blue), 1573px 1573px var(--light-blue), 52px 1704px var(--light-blue), 60px 548px var(--light-blue), 1619px 1524px var(--light-blue), 1919px 1868px var(--light-blue), 1288px 1057px var(--light-blue), 585px 1347px var(--light-blue), 1982px 1282px var(--light-blue), 663px 1164px var(--light-blue), 150px 23px var(--light-blue), 954px 580px var(--light-blue), 1220px 55px var(--light-blue), 107px 1914px var(--light-blue), 449px 366px var(--light-blue), 1032px 1712px var(--light-blue), 1065px 32px var(--light-blue), 722px 1213px var(--light-blue), 1887px 1910px var(--light-blue), 1313px 1578px var(--light-blue), 1940px 1411px var(--light-blue), 1880px 1938px var(--light-blue), 697px 981px var(--light-blue), 1245px 1808px var(--light-blue), 121px 1205px var(--light-blue), 637px 195px var(--light-blue), 1214px 192px var(--light-blue), 383px 903px var(--light-blue), 299px 228px var(--light-blue), 1696px 1469px var(--light-blue), 1426px 882px var(--light-blue), 1489px 1744px var(--light-blue), 1554px 1859px var(--light-blue), 81px 1686px var(--light-blue), 1214px 1021px var(--light-blue), 78px 201px var(--light-blue), 1471px 1066px var(--light-blue), 816px 1875px var(--light-blue), 346px 1516px var(--light-blue), 1557px 1229px var(--light-blue), 201px 1329px var(--light-blue), 1600px 1243px var(--light-blue), 1240px 205px var(--light-blue);
}

#stars3 {
    width: 3px;
    height: 3px;
    background: transparent;
    box-shadow: 1678px 1023px var(--light-blue), 456px 1858px var(--light-blue), 1710px 1474px var(--light-blue), 883px 428px var(--light-blue), 885px 606px var(--light-blue), 825px 298px var(--light-blue), 1353px 1650px var(--light-blue), 153px 1699px var(--light-blue), 1150px 1213px var(--light-blue), 1726px 1795px var(--light-blue), 1977px 1771px var(--light-blue), 1890px 1014px var(--light-blue), 1908px 595px var(--light-blue), 1543px 603px var(--light-blue), 597px 253px var(--light-blue), 370px 960px var(--light-blue), 188px 1448px var(--light-blue), 1516px 1456px var(--light-blue), 1522px 1640px var(--light-blue), 1016px 252px var(--light-blue), 690px 1745px var(--light-blue), 1651px 1046px var(--light-blue), 237px 1396px var(--light-blue), 701px 1508px var(--light-blue), 1485px 1960px var(--light-blue), 659px 671px var(--light-blue), 2000px 1929px var(--light-blue), 707px 1336px var(--light-blue), 571px 825px var(--light-blue), 605px 1902px var(--light-blue), 397px 606px var(--light-blue), 1643px 298px var(--light-blue), 320px 628px var(--light-blue), 429px 1669px var(--light-blue), 533px 1695px var(--light-blue), 617px 116px var(--light-blue), 791px 1945px var(--light-blue), 978px 255px var(--light-blue), 1513px 1245px var(--light-blue), 1040px 327px var(--light-blue), 1462px 1933px var(--light-blue), 1211px 418px var(--light-blue), 1488px 1098px var(--light-blue), 1128px 1631px var(--light-blue), 1518px 1721px var(--light-blue), 1955px 662px var(--light-blue), 1241px 1236px var(--light-blue), 967px 1914px var(--light-blue), 609px 1370px var(--light-blue), 443px 1602px var(--light-blue), 1127px 1861px var(--light-blue), 1525px 1649px var(--light-blue), 518px 764px var(--light-blue), 380px 522px var(--light-blue), 821px 411px var(--light-blue), 1588px 1075px var(--light-blue), 1015px 1441px var(--light-blue), 71px 19px var(--light-blue), 1041px 368px var(--light-blue), 1207px 1879px var(--light-blue), 1179px 1469px var(--light-blue), 1553px 1204px var(--light-blue), 1790px 804px var(--light-blue), 1367px 1899px var(--light-blue), 432px 1961px var(--light-blue), 559px 1750px var(--light-blue), 440px 1092px var(--light-blue), 233px 1382px var(--light-blue), 1171px 1156px var(--light-blue), 1997px 198px var(--light-blue), 871px 507px var(--light-blue), 1940px 14px var(--light-blue), 593px 1985px var(--light-blue), 195px 1692px var(--light-blue), 1308px 1563px var(--light-blue), 427px 1200px var(--light-blue), 1628px 1250px var(--light-blue), 63px 1812px var(--light-blue), 1215px 264px var(--light-blue), 1065px 1798px var(--light-blue), 1090px 1970px var(--light-blue), 1721px 722px var(--light-blue), 206px 274px var(--light-blue), 930px 186px var(--light-blue), 1519px 268px var(--light-blue), 668px 1522px var(--light-blue), 1617px 1543px var(--light-blue), 1380px 507px var(--light-blue), 1767px 1474px var(--light-blue), 586px 1954px var(--light-blue), 911px 1323px var(--light-blue), 1319px 1517px var(--light-blue), 324px 35px var(--light-blue), 575px 352px var(--light-blue), 1937px 1663px var(--light-blue), 1499px 1746px var(--light-blue), 590px 372px var(--light-blue), 516px 1412px var(--light-blue), 1456px 439px var(--light-blue), 105px 1979px var(--light-blue);
    animation: animStar 150s linear infinite;
}

#stars3:after {
    content: " ";
    position: absolute;
    top: 2000px;
    width: 3px;
    height: 3px;
    background: transparent;
    box-shadow: 1678px 1023px var(--light-blue), 456px 1858px var(--light-blue), 1710px 1474px var(--light-blue), 883px 428px var(--light-blue), 885px 606px var(--light-blue), 825px 298px var(--light-blue), 1353px 1650px var(--light-blue), 153px 1699px var(--light-blue), 1150px 1213px var(--light-blue), 1726px 1795px var(--light-blue), 1977px 1771px var(--light-blue), 1890px 1014px var(--light-blue), 1908px 595px var(--light-blue), 1543px 603px var(--light-blue), 597px 253px var(--light-blue), 370px 960px var(--light-blue), 188px 1448px var(--light-blue), 1516px 1456px var(--light-blue), 1522px 1640px var(--light-blue), 1016px 252px var(--light-blue), 690px 1745px var(--light-blue), 1651px 1046px var(--light-blue), 237px 1396px var(--light-blue), 701px 1508px var(--light-blue), 1485px 1960px var(--light-blue), 659px 671px var(--light-blue), 2000px 1929px var(--light-blue), 707px 1336px var(--light-blue), 571px 825px var(--light-blue), 605px 1902px var(--light-blue), 397px 606px var(--light-blue), 1643px 298px var(--light-blue), 320px 628px var(--light-blue), 429px 1669px var(--light-blue), 533px 1695px var(--light-blue), 617px 116px var(--light-blue), 791px 1945px var(--light-blue), 978px 255px var(--light-blue), 1513px 1245px var(--light-blue), 1040px 327px var(--light-blue), 1462px 1933px var(--light-blue), 1211px 418px var(--light-blue), 1488px 1098px var(--light-blue), 1128px 1631px var(--light-blue), 1518px 1721px var(--light-blue), 1955px 662px var(--light-blue), 1241px 1236px var(--light-blue), 967px 1914px var(--light-blue), 609px 1370px var(--light-blue), 443px 1602px var(--light-blue), 1127px 1861px var(--light-blue), 1525px 1649px var(--light-blue), 518px 764px var(--light-blue), 380px 522px var(--light-blue), 821px 411px var(--light-blue), 1588px 1075px var(--light-blue), 1015px 1441px var(--light-blue), 71px 19px var(--light-blue), 1041px 368px var(--light-blue), 1207px 1879px var(--light-blue), 1179px 1469px var(--light-blue), 1553px 1204px var(--light-blue), 1790px 804px var(--light-blue), 1367px 1899px var(--light-blue), 432px 1961px var(--light-blue), 559px 1750px var(--light-blue), 440px 1092px var(--light-blue), 233px 1382px var(--light-blue), 1171px 1156px var(--light-blue), 1997px 198px var(--light-blue), 871px 507px var(--light-blue), 1940px 14px var(--light-blue), 593px 1985px var(--light-blue), 195px 1692px var(--light-blue), 1308px 1563px var(--light-blue), 427px 1200px var(--light-blue), 1628px 1250px var(--light-blue), 63px 1812px var(--light-blue), 1215px 264px var(--light-blue), 1065px 1798px var(--light-blue), 1090px 1970px var(--light-blue), 1721px 722px var(--light-blue), 206px 274px var(--light-blue), 930px 186px var(--light-blue), 1519px 268px var(--light-blue), 668px 1522px var(--light-blue), 1617px 1543px var(--light-blue), 1380px 507px var(--light-blue), 1767px 1474px var(--light-blue), 586px 1954px var(--light-blue), 911px 1323px var(--light-blue), 1319px 1517px var(--light-blue), 324px 35px var(--light-blue), 575px 352px var(--light-blue), 1937px 1663px var(--light-blue), 1499px 1746px var(--light-blue), 590px 372px var(--light-blue), 516px 1412px var(--light-blue), 1456px 439px var(--light-blue), 105px 1979px var(--light-blue);
}

@keyframes animStar {
    from {
        transform: translateY(0px);
    }
    to {
        transform: translateY(-2000px);
    }
}

.banner-section.style-two .social-links {
    display: block;
    position: absolute;
    top: 49%;
    transform: translateY(-100%);
    z-index: 9;
}

.banner-section.style-two .social-links li {
    margin-bottom: 23px;
}

/*** 

====================================================================
      Banner Section Style Three
====================================================================

***/

.banner-section.style-three {
    padding-bottom: 86px;
}

.banner-section.style-three::before,
.banner-section.style-three::after {
    display: none;
}

.banner-section.style-three .content-column .content-inner {
    margin-top: 200px;
}

.banner-section.style-three .content-column .content-inner h1 {
    color: var(--darkgrey);
    font-weight: 700;
}

.banner-section.style-three .image-column .image-box {
    position: relative;
    animation: none;
    margin-top: 71px;
}

.banner-section.style-three .image-column .image-box img {
    animation: none;
    -webkit-animation: none;
}

.banner-section.style-three .image-column .image-box:before {
    content: "";
    position: absolute;
    left: 119px;
    top: 25px;
    width: 570px;
    height: 660px;
    background-image: url(../images/main-banner/19.png);
    background-repeat: no-repeat;
}

.banner-section.style-three .image-column .image-box:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 620px;
    height: 605px;
    background-image: url('../images/main-banner/20.png');
    background-repeat: no-repeat;
    z-index: -1;
}

.banner-section.style-three .banner-image {
    top: 11% !important;
    left: 8% !important;
    animation-name: rotateme;
    animation-duration: 24s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: rotateme;
    -webkit-animation-duration: 24s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: rotateme;
    -moz-animation-duration: 24s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: rotateme;
    -ms-animation-duration: 24s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: rotateme;
    -o-animation-duration: 24s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
}

.banner-section.style-three .banner-image-2 {
    right: 14% !important;
    left: auto !important;
    top: 10% !important;
    animation-name: float-bob;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    -webkit-animation-name: float-bob;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: float-bob;
    -moz-animation-duration: 2s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -ms-animation-name: float-bob;
    -ms-animation-duration: 2s;
    -ms-animation-iteration-count: infinite;
    -ms-animation-timing-function: linear;
    -o-animation-name: float-bob;
    -o-animation-duration: 2s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
}

.banner-section.style-three .banner-image-3 {
    right: 12% !important;
    left: auto !important;
    bottom: 20% !important;
    top: auto !important;
    animation-name: snowRot;
    animation-duration: 10s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}

@keyframes animName {
    0% {
        transform: translateX(0);
    }
    30% {
        transform: translateX(100px);
    }
    100% {
        transform: translateX(0);
    }
}

.banner-section.style-three .banner-image-4 {
    top: auto !important;
    bottom: 9% !important;
    left: 5% !important;
    animation: animName 2s infinite;
}

.banner-section.style-three .content-column .content-inner p {
    color: var(--grey);
}

@keyframes snowRot {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.banner-section.style-three .content-column .content-inner .analysis-form {
    position: relative;
}

.banner-section.style-three .content-column .content-inner .analysis-form .form-group {
    position: relative;
}

.banner-section.style-three .content-column .content-inner .analysis-form .form-group input[type="url"] {
    position: relative;
    display: block;
    width: 100%;
    line-height: 19px;
    padding: 20px;
    background-color: var(--white);
    font-weight: 400;
    height: 60px;
    border: 1px solid rgba(var(--black-opicity), 0.1);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
    border-radius: 38px;
}

.banner-section.style-three .content-column .content-inner .analysis-form .form-group input[type="url"]:focus {
    border-color: transparent;
    box-shadow: 0 0 24px rgba(var(--black-opicity), 0.1);
}

.banner-section.style-three .content-column .content-inner .analysis-form .form-group button {
    position: absolute;
    right: 8px;
    top: 4px;
}

.banner-section.style-three .content-column .content-inner .info-box {
    position: relative;
    margin-top: 45px;
    display: flex;
    flex-wrap: wrap;
}

.banner-section.style-three .content-column .content-inner .info-box .icon-box {
    width: calc(14% - 0px);
}

.banner-section.style-three .content-column .content-inner .info-box .icon-box i {
    font-size: var(--font-60);
    color: var(--secondary);
}

.banner-section.style-three .content-column .content-inner .info-box p-box {
    position: relative;
}

.banner-section.style-three .content-column .content-inner .info-box p-box h4 {
    color: var(--black);
    font-weight: 700;
}

/*** 

====================================================================
			Banner Slider Section
====================================================================

***/

.banner-section.banner-slider {
    position: relative;
    background-size: cover !important;
    padding-bottom: 0;
    padding-bottom: 100px;
}

.banner-section.banner-slider:before,
.banner-section.banner-slider:after {
    display: none;
}

.banner-section.banner-slider .content-column {
    position: relative;
}

.banner-section.banner-slider .content-column .inner-column {
    position: relative;
    padding-left: 0;
    padding-top: 329px;
    padding-bottom: 160px;
}

.banner-section.banner-slider .content-column h1 {
    position: relative;
    color: var(--white);
    font-weight: 700;
    line-height: 1.3em;
    opacity: 0;
    transform: scaleY(0);
    transform-origin: top;
    -webkit-transition: all 1000ms ease;
    -moz-transition: all 100ms ease;
    -ms-transition: all 1000ms ease;
    -o-transition: all 1000ms ease;
    transition: all 1000ms ease;
}

.banner-section.banner-slider .active .content-column h1,
.banner-section.banner-slider .active .content-column p {
    opacity: 1;
    transform: scaleY(1);
    -webkit-transition-delay: 600ms;
    -moz-transition-delay: 600ms;
    -ms-transition-delay: 600ms;
    -o-transition-delay: 600ms;
    transition-delay: 600ms;
}

.banner-section.banner-slider .content-column p {
    position: relative;
    color: var(--white);
    font-size: var(--font-18);
    line-height: 1.9em;
    margin-bottom: 40px;
    font-weight: 400;
    position: relative;
    opacity: 0;
    transform: scaleY(0);
    transform-origin: top;
    -webkit-transition: all 1000ms ease;
    -moz-transition: all 100ms ease;
    -ms-transition: all 1000ms ease;
    -o-transition: all 1000ms ease;
    transition: all 1000ms ease;
}

.banner-section.banner-slider .content-column .btns-box {
    margin-top: 35px;
    opacity: 0;
    transform: scaleY(0);
    transform-origin: top;
    -webkit-transition: all 1000ms ease;
    -moz-transition: all 100ms ease;
    -ms-transition: all 1000ms ease;
    -o-transition: all 1000ms ease;
    transition: all 1000ms ease;
}

.banner-section.banner-slider .active .content-column .btns-box {
    opacity: 1;
    transform: scaleY(1);
    -webkit-transition-delay: 900ms;
    -moz-transition-delay: 900ms;
    -ms-transition-delay: 900ms;
    -o-transition-delay: 900ms;
    transition-delay: 900ms;
}

.banner-section.banner-slider .content-column .theme-btn {
    margin-right: 15px;
}

.banner-section.banner-slider .image-column {
    position: relative;
}

.banner-section.banner-slider .image-column .inner-column {
    position: relative;
    margin-right: -80px;
    overflow: hidden;
    padding-top: 276px;
}

.banner-section.banner-slider .image-column .image {
    position: relative;
    opacity: 0;
    transform: scaleX(0);
    transform-origin: top;
    -webkit-transition: all 1000ms ease;
    -moz-transition: all 100ms ease;
    -ms-transition: all 1000ms ease;
    -o-transition: all 1000ms ease;
    transition: all 1000ms ease;
}

.banner-section.banner-slider .active .image-column .image {
    opacity: 1;
    transform: scaleX(1);
}

.banner-section.banner-slider .content-column .video-link {
    position: relative;
    margin-bottom: 50px;
    opacity: 0;
    transform: scaleY(0);
    transform-origin: top;
    -webkit-transition: all 1000ms ease;
    -moz-transition: all 100ms ease;
    -ms-transition: all 1000ms ease;
    -o-transition: all 1000ms ease;
    transition: all 1000ms ease;
}

.banner-section.banner-slider .active .content-column .video-link {
    opacity: 1;
    transform: scaleY(1);
    -webkit-transition-delay: 900ms;
    -moz-transition-delay: 900ms;
    -ms-transition-delay: 900ms;
    -o-transition-delay: 900ms;
    transition-delay: 900ms;
}

.banner-section.banner-slider .content-column .video-link a {
    width: 122px;
    display: block;
    height: 120px;
    font-size: 40px;
    background-image: linear-gradient(var(--main-color), var(--secondary));
    text-align: center;
    color: var(--white);
    line-height: 117px;
    border-radius: 50%;
    border: 4px solid var(--white);
    position: relative;
}

.banner-section.banner-slider .content-column .video-link .ripple,
.banner-section.banner-slider .content-column .video-link .ripple:before,
.banner-section.banner-slider .content-column .video-link .ripple:after {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 122px;
    width: 122px;
    margin-left: .5px;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    -webkit-box-shadow: 0 0 0 0 rgb(255 255 255 / 40%);
    -moz-box-shadow: 0 0 0 0 rgba(255, 255, 255, .4);
    -ms-box-shadow: 0 0 0 0 rgba(255, 255, 255, .4);
    -o-box-shadow: 0 0 0 0 rgba(255, 255, 255, .4);
    box-shadow: 0 0 0 0 rgb(255 255 255 / 40%);
    -webkit-animation: ripple 3s infinite;
    -moz-animation: ripple 3s infinite;
    -ms-animation: ripple 3s infinite;
    -o-animation: ripple 3s infinite;
    animation: ripple 3s infinite;
}

.banner-section.banner-slider .content-column .video-link .ripple:before {
    -webkit-animation-delay: .9s;
    -moz-animation-delay: .9s;
    -ms-animation-delay: .9s;
    -o-animation-delay: .9s;
    animation-delay: .9s;
    content: "";
    position: absolute;
}

.banner-section.banner-slider .content-column .video-link .ripple:after {
    -webkit-animation-delay: .6s;
    -moz-animation-delay: .6s;
    -ms-animation-delay: .6s;
    -o-animation-delay: .6s;
    animation-delay: .6s;
    content: "";
    position: absolute;
}

@-webkit-keyframes ripple {
    70% {
        box-shadow: 0 0 0 70px rgba(255, 255, 255, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
}

.banner-section.banner-slider .owl-dots {
    position: absolute;
    right: 110px;
    top: 50%;
    display: none;
}

.banner-section.banner-slider .owl-dots .owl-dot {
    position: relative;
    width: 16px;
    height: 16px;
    margin-bottom: 10px;
    border-radius: 50px;
    background-color: var(--white);
    margin-bottom: 10px;
}

.banner-section.banner-slider .owl-dots .owl-dot:before {
    position: absolute;
    content: '';
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    opacity: 0;
    border-radius: 50px;
    border: 3px solid var(--main-color);
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.banner-section.banner-slider .owl-dots .owl-dot.active:before,
.banner-section.banner-slider .owl-dots .owl-dot:hover::before {
    opacity: 1;
}

.banner-section.banner-slider .owl-nav {
    position: absolute;
    left: 0px;
    top: 50%;
    z-index: 1;
    width: 100%;
    opacity: 0;
    margin-top: -10px;
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.banner-section.banner-slider:hover .owl-nav {
    opacity: 1;
}

.banner-section.banner-slider .owl-nav .owl-prev {
    position: absolute;
    left: 20px;
    width: 60px;
    height: 60px;
    color: var(--white);
    line-height: 56px;
    font-size: 24px;
    text-align: center;
    border-radius: 50px;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    border: 2px solid rgba(255, 255, 255, 0.60);
}

.banner-section.banner-slider .owl-nav .owl-next {
    position: absolute;
    right: 20px;
    color: var(--white);
    font-size: 24px;
    width: 60px;
    height: 60px;
    color: var(--white);
    line-height: 56px;
    border-radius: 50px;
    text-align: center;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    border: 2px solid rgba(255, 255, 255, 0.60);
}

.banner-section.banner-slider .owl-nav .owl-prev:hover,
.banner-section.banner-slider .owl-nav .owl-next:hover {
    color: var(--secondary);
    border-color: var(--white);
    background-color: var(--white);
}

/*** 

====================================================================
			Page Title
====================================================================

***/

.page-title {
    position: relative;
    padding: 253px 0 263px;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    text-align: center;
    overflow: hidden;
}

.page-title .inner-container {
    position: relative;
}

.page-title .title-box {
    position: relative;
}

.page-title h1 {
    position: relative;
    display: block;
    font-size: var(--font-48);
    color: var(--white);
    line-height: 50px;
    font-weight: 700;
    margin-bottom: 12px;
}

.page-title .title {
    position: relative;
    display: block;
    font-size: var(--font-24);
    line-height: 40px;
    color: var(--white);
    font-weight: 400;
}

.page-title .bread-crumb {
    position: relative;
    display: flex;
    justify-content: center;
}

.page-title .bread-crumb li {
    position: relative;
    font-size: var(--font-18);
    line-height: 30px;
    color: var(--main-color);
    font-weight: 700;
    text-transform: capitalize;
    cursor: default;
    padding-right: 10px;
    margin-right: 10px;
}

.page-title .bread-crumb li:before {
    position: absolute;
    right: -2px;
    font-size: var(--font-16);
    line-height: 30px;
    color: var(--white);
    content: "/";
}

.page-title .bread-crumb li:last-child:before {
    display: none;
}

.page-title .bread-crumb li a {
    color: var(--white);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.page-title .bread-crumb li a:hover {
    color: var(--main-color);
}

/*** 

====================================================================
	Section Title
====================================================================

***/

.sec-title {
    position: relative;
    margin-bottom: 30px;
}

.sec-title h2 {
    position: relative;
    display: block;
    color: var(--darkgrey);
    font-weight: 700;
    padding: 10px 0 20px;
}

.sec-title .subtitle {
    color: var(--secondary);
    font-weight: 600;
}

.sec-title.light h2,
.sec-title.light .subtitle {
    color: var(--white);
}

.sec-titlep-center .float-text {
    right: 0;
    margin: 0 auto;
}

.slider-title {
    color: #FFFFFF !important;
    font-size: 40px !important;
    font-weight: bold !important;
}

.slider-typed-text {
    font-size: 25px !important;
    color: #fbc106 !important;
    font-weight: bold;
}

.slider-subtitle {
    color: var(--secondary);
    font-size: 18px !important;
    font-weight: bold !important;
}

/*** 

====================================================================
			About Section
====================================================================

***/

.about-section {
    position: relative;
    background-repeat: no-repeat;
    background-position: top center;
    background-size: 61%;
    padding: 50px 0 50px;
}

.about-section .image-column .inner-column {
    position: relative;
    transform: rotateY(160deg) rotateX(0deg);
    -webkit-animation: suspend 5s ease-in-out infinite alternate;
    animation: suspend 8s ease-in-out infinite alternate;
}

.about-section .content-column {
    position: relative;
}

.about-section .content-column .inner-column {
    position: relative;
}

.about-section .content-column .content-box {
    position: relative;
}

.about-section .content-column .content-box p {
    margin-bottom: 30px;
}

@-webkit-keyframes suspend {
    0% {
        transform: rotateY(40deg) rotateX(0deg);
    }
    to {
        transform: rotateY(-160deg) rotateX(0deg);
    }
}

@keyframes suspend {
    0% {
        transform: rotateY(160deg) rotateX(0deg);
    }
    to {
        transform: rotateY(-160deg) rotateX(0deg);
    }
}

.about-section.alternate {
    margin: 49px 0 31px;
}

/*** 

====================================================================
			About Section Style Two
====================================================================

***/

.about-section.style-two {
    background-size: contain;
    background-position: top right;
    padding: 100px 0 20px;
    margin-bottom: 150px;
}

.about-section.style-two .content-column .content-box .sec-title {
    margin-bottom: 10px;
}

.about-section.style-two .content-column .content-box h5 {
    margin-bottom: 20px;
    font-weight: 700;
}

.about-section.style-two .image-column .inner-column {
    animation: bounce 1s infinite alternate;
    -webkit-animation: bounce 1s infinite alternate;
}

.about-section.style-two .image-column .inner-column .image-box {
    text-align: right;
    margin-right: -200px;
}

.about-section.style-two .content-column .content-box {
    position: relative;
}

.about-section .video-link {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}

.about-section .content-column .content-box .video-link a {
    width: 68px;
    display: block;
    height: 68px;
    font-size: var(--font-24);
    background-image: linear-gradient(var(--main-color), var(--secondary));
    text-align: center;
    color: var(--white);
    line-height: 60px;
    border-radius: 50%;
    border: 4px solid var(--white);
    position: relative;
}

.about-section .content-column .content-box .video-link .ripple,
.about-section .content-column .content-box .video-link .ripple:before,
.about-section .content-column .content-box .video-link .ripple:after {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 70px;
    width: 70px;
    margin-left: .5px;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
    -webkit-box-shadow: 0 0 0 0 rgba(var(--secondary-opicity), 0.8);
    -moz-box-shadow: 0 0 0 0 rgba(var(--secondary-opicity), 0.8);
    -ms-box-shadow: 0 0 0 0 rgba(var(--secondary-opicity), 0.8);
    -o-box-shadow: 0 0 0 0 rgba(var(--secondary-opicity), 0.8);
    box-shadow: 0 0 0 0 rgba(var(--secondary-opicity), 0.8);
    -webkit-animation: ripple 3s infinite;
    -moz-animation: ripple 3s infinite;
    -ms-animation: ripple 3s infinite;
    -o-animation: ripple 3s infinite;
    animation: ripple 3s infinite;
}

.about-section .content-column .content-box .video-link .ripple:before {
    -webkit-animation-delay: .9s;
    -moz-animation-delay: .9s;
    -ms-animation-delay: .9s;
    -o-animation-delay: .9s;
    animation-delay: .9s;
    content: "";
    position: absolute;
}

.about-section .content-column .content-box .video-link .ripple:after {
    -webkit-animation-delay: .6s;
    -moz-animation-delay: .6s;
    -ms-animation-delay: .6s;
    -o-animation-delay: .6s;
    animation-delay: .6s;
    content: "";
    position: absolute;
}

@-webkit-keyframes ripple {
    70% {
        box-shadow: 0 0 0 30px rgba(var(--secondary-opicity), 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(var(--secondary-opicity), 0);
    }
}

@keyframes ripple {
    70% {
        box-shadow: 0 0 0 30px rgba(var(--secondary-opicity), 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(var(--secondary-opicity), 0);
    }
}

.about-section .video-link .text-video {
    font-size: var(--font-30);
    color: var(--darkgrey);
    font-weight: 700;
}

.about-section .video-link figure {
    text-align: right;
}

.about-section .video-link figure img {
    width: 70%;
}

/*** 

====================================================================
			Services Section
====================================================================

***/

.services-section {
    position: relative;
    padding: 100px 0 100px;
}

.service-block {
    background-color: transparent;
    width: 100%;
    height: 400px;
    perspective: 1000px;
}

.service-block .inner-box {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.8s;
    transform-style: preserve-3d;
}

.service-block .service-box-back .image-box {
    position: relative;
}

.service-block:hover .inner-box,
.service-block.active .inner-box {
    transform: rotateY(180deg);
}

.service-block .service-box-front,
.service-block .service-box-back {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    padding: 50px;
    box-shadow: 0 0 57px rgba(34, 34, 34, 0.1);
    border-radius: 20px;
    overflow: hidden;
}

.service-block .service-box-front {
    background-color: var(--white);
    color: black;
}

.service-block .service-box-back {
    background-color: var(--secondary);
    color: var(--white);
    transform: rotateY(180deg);
}

.service-block.active {
    position: relative;
    z-index: 2;
}

.services-box {
    padding: 0;
}

.service-block .service-box-front .lower-content,
.service-block .service-box-back .lower-content {
    margin-top: 30px;
}

.service-block .service-box-front .lower-content h3,
.service-block .service-box-back .lower-content h3 {
    margin-bottom: 16px;
}

.service-block .service-box-front .lower-content h3 a {
    color: var(--black);
    font-weight: 700;
}

.service-block .service-box-back .lower-content h3 a {
    color: var(--white);
}

.service-block .service-box-front .lower-content p,
.service-block .service-box-back .lower-content p {
    margin-bottom: 30px;
}

.service-block .service-box-back .lower-content p {
    color: var(--white);
}

.service-box-wave {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.service-box-wave .waves {
    position: relative;
    width: 100%;
    height: 15vh;
    margin-bottom: -7px;
    min-height: 100px;
    max-height: 150px;
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
}

/* Animation */

.parallax>use {
    animation: move-forever 25s cubic-bezier(.55, .5, .45, .5) infinite;
}

.parallax>use:nth-child(1) {
    animation-delay: -2s;
    animation-duration: 7s;
}

.parallax>use:nth-child(2) {
    animation-delay: -3s;
    animation-duration: 10s;
}

.parallax>use:nth-child(3) {
    animation-delay: -4s;
    animation-duration: 13s;
}

.parallax>use:nth-child(4) {
    animation-delay: -5s;
    animation-duration: 20s;
}

@keyframes move-forever {
    0% {
        transform: translate3d(-90px, 0, 0);
    }
    100% {
        transform: translate3d(85px, 0, 0);
    }
}

/*** 

====================================================================
			Service Style Two
====================================================================

***/

.services-section.style-two {
    background-repeat: no-repeat;
    background-size: cover;
    /*padding:135px 0 214px;*/
    padding: 135px 0 20px;
    position: relative;
}

.services-section.altrenate {
    padding: 169px 0 149px;
    position: relative;
    z-index: 9;
    background-repeat: no-repeat;
    background-size: cover;
}

.services-section.altrenate .inner-container {
    max-width: 1580px;
    margin: 0 auto;
}

.services-section .owl-nav {
    display: block !important;
    position: absolute;
    top: 50%;
    left: -90px;
    width: 115.5%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    z-index: -1;
}

.services-section .owl-nav .owl-prev {
    float: left;
}

.services-section .owl-nav .owl-next {
    float: right;
}

.services-section .owl-nav .owl-prev,
.services-section .owl-nav .owl-next {
    border: 1px solid var(--white);
    padding: 40px 15px;
    color: var(--white);
    font-size: var(--font-30);
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
}

.services-section .owl-nav .owl-prev:hover,
.services-section .owl-nav .owl-next:hover {
    border-color: var(--main-color);
    color: var(--main-color);
}

/*** 

====================================================================
			Service Style two
====================================================================

***/

.service-block-two,
.service-block-three {
    position: relative;
    margin-bottom: 40px;
    z-index: 2;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.service-block-two .inner-box,
.service-block-three .inner-box {
    border: solid 1px var(--yellow);
    border-radius: 10px;
    position: relative;
    z-index: 1;
    padding: 30px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.service-block-two .inner-box {
    text-align: right;
}

.service-block-two .inner-box .icon-box,
.service-block-three .inner-box .icon-box {
    position: absolute;
    width: 95px;
    height: 95px;
    border-radius: 50%;
}

.service-block-two .inner-box .icon-box .icon,
.service-block-three .inner-box .icon-box .icon {
    font-size: 45px;
    color: var(--white);
    line-height: 94px;
}

.service-block-two .inner-box .icon-box .icon:after,
.service-block-three .inner-box .icon-box .icon:after {
    content: "";
    position: absolute;
    left: 7px;
    top: 7px;
    width: 80px;
    height: 80px;
    border: 1px solid var(--white);
    border-radius: 50%;
}

.service-block-two .inner-box .icon-box:before,
.service-block-three .inner-box .icon-box:before {
    content: "";
    position: absolute;
    left: -24px;
    top: -9px;
    width: 140px;
    height: 120px;
    background-image: url(../images/resource/service-shape.png);
    background-repeat: no-repeat;
    z-index: -1;
    opacity: 0.2;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.service-block-two:hover .inner-box .icon-box:before,
.service-block-three:hover .inner-box .icon-box:before {
    opacity: 1;
}

.service-block-two .inner-box .icon-box .icon {
    margin-right: 23px;
}

.service-block-three .inner-box .icon-box .icon {
    margin-left: 23px;
}

.service-block-two .inner-box .icon-box {
    right: -44px;
}

.service-block-three .inner-box .icon-box {
    left: -44px;
}

.red {
    background-image: linear-gradient(var(--red), var(--main-color));
}

.green {
    background-image: linear-gradient(var(--green), var(--light-green));
}

.light-blue {
    background-image: linear-gradient(var(--sl-blue), var(--light-blue));
}

.blue {
    background-image: linear-gradient(var(--dl-blue), var(--secondary));
}

.purple {
    background-image: linear-gradient(var(--purple), var(--light-purple));
}

.yellow {
    background-image: linear-gradient(var(--main-color), var(--yellow));
}

.service-block-two {
    margin: 0 27px 40px 80px;
}

.service-block-two:nth-child(2) {
    margin: 0 100px 40px 33px;
}

.service-block-two:nth-child(1) {
    margin: 0 133px 40px 0;
}

.service-block-three {
    margin: 0 80px 40px 27px;
}

.service-block-three:nth-child(2) {
    margin: 0 33px 40px 100px;
}

.service-block-three:nth-child(1) {
    margin: 0 0px 40px 133px;
}

.service-block-two .inner-box .text-box {
    padding-right: 50px;
}

.service-block-three .inner-box .text-box {
    padding-left: 50px;
}

.service-block-two .inner-box .text-box h4,
.service-block-three .inner-box .text-box h4 {
    font-weight: 600;
    margin-bottom: 11px;
}

.service-block-two .inner-box .text-box h4 a,
.service-block-two .inner-box .text-box .text,
.service-block-two .inner-box .text-box p,
.service-block-three .inner-box .text-box h4 a,
.service-block-three .inner-box .text-box p {
    color: var(--white);
}

.services-section .center-column .inner-column .image-box {
    animation: bounce 1s infinite alternate;
    -webkit-animation: bounce 1s infinite alternate;
}

/*** 

====================================================================
			Service Style four
====================================================================

***/

.service-block-four {
    position: relative;
    margin-bottom: 30px;
}

.service-block-four .front-box {
    position: relative;
}

.service-block-four .inner-box .front-box {
    width: 100%;
    height: 100%;
    padding: 67px 30px;
    background-color: var(--bg-grey);
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transform-origin: top;
    transform: translateY(0px) rotateX(0deg);
}

.service-block-four .inner-box:hover .front-box {
    transform: translateY(100%) rotateX(90deg);
}

.service-block-four .inner-box .back-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 2;
    padding: 45px 30px;
    transform-origin: bottom;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transform: translateY(-100px) rotateX(90deg);
}

.service-block-four .inner-box:hover .back-box {
    transform: translateY(0) rotateX(0deg);
}

.service-block-four .inner-box .front-box .icon-box,
.service-block-four .inner-box .back-box .icon-box {
    position: relative;
    margin-bottom: 23px;
}

.service-block-four .inner-box .front-box .icon-box i {
    font-size: var(--font-60);
    color: var(--main-color);
}

.service-block-four .inner-box .back-box .icon-box {
    position: relative;
}

.service-block-four .inner-box .back-box .icon-box i {
    width: 100px;
    height: 100px;
    margin-bottom: 23px;
    background-color: var(--light-blue);
    display: block;
    font-size: var(--font-48);
    line-height: 96px;
    border-radius: 50%;
    text-align: center;
    color: var(--white);
    box-shadow: 5px 5px 0 rgba(var(--black-opicity), 0.3);
}

.service-block-four .inner-box .front-box .lower-content,
.service-block-four .inner-box .back-box .lower-content {
    position: relative;
}

.service-block-four .inner-box .front-box .lower-content h4,
.service-block-four .inner-box .back-box .lower-content h4 {
    margin-bottom: 15px;
    padding-bottom: 15px;
    position: relative;
    font-weight: 700;
    line-height: 1.5em;
}

.service-block-four .inner-box .front-box .lower-content h4 a {
    color: var(--darkgrey);
}

.service-block-four .inner-box .back-box .lower-content h4 a,
.service-block-four .inner-box .back-box .lower-content p {
    color: var(--white);
}

.service-block-four .inner-box .front-box .lower-content h4:before,
.service-block-four .inner-box .back-box .lower-content h4:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 30%;
    height: 2px;
    background-color: var(--secondary);
}

.service-block-four .inner-box .back-box .lower-content h4:before {
    background-color: var(--white);
}

.service-block-four .inner-box {
    position: relative;
}

.service-block-four .inner-box .pattern-layer-one {
    width: 17px;
    height: 17px;
    background-size: 100%;
    left: 6%;
    top: 5%;
    z-index: 1;
}

.service-block-four .inner-box .pattern-layer-five {
    width: 20px;
    height: 20px;
    background-size: 100%;
    left: 58%;
    bottom: auto;
    top: 29%;
    z-index: 1;
}

.service-block-four .inner-box .pattern-layer-three {
    left: auto;
    right: 10%;
    z-index: 1;
    top: 68%;
}

.service-block-four .inner-box .pattern-layer-four {
    top: auto !important;
    bottom: 13px;
    width: 20px;
    height: 20px;
    background-size: 100%;
    left: 40%;
    z-index: 1;
}

/*** 

====================================================================
			Service Style Five
====================================================================

***/

.service-block-five {
    background-color: var(--white);
    height: auto;
    padding: 40px;
    border-radius: 20px;
    box-shadow: 0 0 40px rgba(0, 0, 0, 0.2);
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
}

.service-block-five .inner-box {
    transform-style: unset;
    transition: auto;
}

.service-block-five .lower-content {
    margin-top: 25px;
}

.service-block-five .lower-content h4 a {
    color: var(--black);
    font-weight: 700;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
}

.services-section .upper-box {
    margin-bottom: 30px;
}

.service-block-five:hover .inner-box {
    transform: rotateY(0deg);
    transition: transform 0;
}

.service-block-five:before {
    content: "";
    position: absolute;
    left: 100%;
    top: 100%;
    width: 100%;
    height: 100%;
    background-image: url('../images/services/hover-bg.png');
    border-radius: 20px;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
}

.service-block-five:hover:before {
    top: 0;
    left: 0;
}

.service-block-five:hover .lower-content h4 a {
    color: var(--white);
}

.service-block-five .lower-content p {
    margin-top: 20px;
}

.service-block-five:hover .lower-content p {
    color: var(--white);
}

/*** 

====================================================================
			Service Style Six
====================================================================

***/

.services-section.style-three {
    padding: 150px 0;
    background-repeat: no-repeat;
    background-size: cover;
}

.service-block-six {
    position: relative;
    margin-bottom: 30px;
    overflow: hidden;
}

.service-block-six .inner-box {
    display: flex;
    background-color: var(--white);
    padding: 50px 40px;
    border-radius: 23px;
    justify-content: center;
    align-items: center;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}

.service-block-six .inner-box:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 572px;
    height: 246px;
    background-image: url(../images/services/15.png);
    background-size: cover;
    opacity: 0;
    visibility: hidden;
    border-radius: 23px;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}

.service-block-six:hover .inner-box:before {
    left: -1px;
    top: -2px;
    opacity: 1;
    visibility: visible;
}

.service-block-six .inner-box .lower-content {
    padding-right: 15px;
    position: relative;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}

.service-block-six .inner-box .lower-content h4 {
    font-weight: 700;
    margin-bottom: 15px;
}

.service-block-six .inner-box .lower-content h4 a {
    color: var(--darkgrey);
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}

.service-block-six .inner-box .lower-content p {
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}

.service-block-six .inner-box .image-box {
    position: relative;
}

.service-block-six:hover .inner-box .lower-content h4 a,
.service-block-six:hover .inner-box .lower-content p {
    color: var(--white);
}

.services-section.style-four {
    position: relative;
    padding: 14px 0 70px;
}

/*** 

====================================================================
			Service Detail
====================================================================

***/

.service-detail {
    position: relative;
}

.service-detail .inner-box {
    position: relative;
    display: block;
}

.service-detail .image-box {
    position: relative;
    margin-bottom: 35px;
}

.service-detail .image-box .owl-nav {
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    margin-top: -20px;
}

.service-detail .image-box .owl-next,
.service-detail .image-box .owl-prev {
    position: absolute;
    left: 40px;
    top: 0;
    height: 40px;
    width: 40px;
    background-color: var(--darkgrey);
    color: var(--white);
    font-size: var(--font-18);
    line-height: 40px;
    text-align: center;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.service-detail .image-box .owl-next {
    left: auto;
    right: 40px;
}

.service-detail .image-box .owl-next:hover,
.service-detail .image-box .owl-prev:hover {
    background-color: var(--main-color);
}

.service-detail .inner-box .image {
    position: relative;
    margin-bottom: 0;
}

.service-detail .inner-box .image img {
    position: relative;
    width: 100%;
    display: block;
}

.service-detail .inner-box h2 {
    position: relative;
    font-size: var(--font-30);
    font-weight: 700;
    color: var(--darkgrey);
    line-height: 1.2em;
    margin-bottom: 25px;
}

.service-detail .inner-box p .two-column,
.service-detail .inner-box .two-column {
    margin-top: 40px;
    margin-bottom: 30px;
}

.service-detail .inner-box p {
    position: relative;
    line-height: 30px;
    margin-bottom: 30px;
}

.service-detail .inner-box p strong {
    position: relative;
    display: block;
    font-size: var(--font-18);
    line-height: 30px;
    color: var(--darkgrey);
    font-weight: 500;
    margin-bottom: 10px
}

.service-detail .inner-box p h4,
.service-detail .inner-box h4 {
    position: relative;
    font-weight: 700;
    color: var(--darkgrey);
    line-height: 1.2em;
    margin-bottom: 30px;
}

.service-detail .inner-box ul {
    position: relative;
    display: flex;
    flex-wrap: wrap;
}

.service-detail .inner-box ul li {
    position: relative;
    display: block;
    line-height: 26px;
    padding-left: 21px;
    margin-bottom: 10px;
    width: calc(100% / 2);
}

.service-detail .inner-box .single-list li {
    width: calc(100% / 1);
}

.service-detail .inner-box ul li:before {
    position: absolute;
    left: 0;
    top: 0;
    font-size: 14px;
    line-height: 26px;
    font-weight: 300;
    content: "\f101";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}

/*** 

====================================================================
  Get started Sec
====================================================================

***/

.get-started-sec {
    position: relative;
    padding: 211px 0 175px;
    margin-top: -75px;
    background-size: cover;
}

.get-started-sec .subtitle {
    color: var(--main-color);
    margin-bottom: 17px;
}

.get-started-sec h2 {
    font-size: var(--font-48);
    margin-bottom: 25px;
}

.get-started-sec.style-two {
    margin: 55px 0 0;
    padding: 200px 0 200px;
}

.get-started-sec.style-two h2 {
    margin-bottom: 10px;
}

.get-started-sec.style-two p {
    margin-bottom: 26px;
}

.get-started-sec.alternate h2 {
    margin-bottom: 0;
}

.get-started-sec.alternate {
    padding: 115px 0 100px;
}

.get-started-sec.alternate p {
    margin-bottom: 26px;
}

/*** 

====================================================================
  Get started Form
====================================================================

***/

.get-started-form {
    position: relative;
    text-align: center;
}

.get-started-form .form-area .form-group {
    position: relative;
}

.get-started-form .form-area .form-group input[type="text"] {
    position: relative;
    display: block;
    width: 100%;
    line-height: 19px;
    padding: 20px;
    background-color: var(--white);
    font-weight: 400;
    height: 60px;
    border: 1px solid rgba(var(--black-opicity), 0.1);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
    border-radius: 38px;
}

.get-started-form .form-area .form-group input[type="text"]:focus {
    border-color: transparent;
    box-shadow: 0 0 24px rgba(var(--black-opicity), 0.1);
}

.get-started-form .form-area .form-group button {
    position: absolute;
    right: 3px;
    top: 3px;
}

/*** 

====================================================================
	Experince Sec
====================================================================

***/

.experince-sec {
    position: relative;
    padding: 100px 0;
}

.experince-sec .image-column {
    position: relative;
}

.experince-sec .image-column .image-box {
    position: relative;
    margin-left: -180px;
}

.experince-sec .image-column .image-box:before {
    content: "";
    position: absolute;
    left: 29px;
    top: -16px;
    width: 100%;
    height: 595px;
    background-image: url(../images/resource/experince-1.png);
    background-size: 88%;
    z-index: -1;
    background-repeat: no-repeat;
}

.experince-sec .image-column .image-box .review-box {
    bottom: -29px;
    top: auto !important;
    right: 72px;
    left: auto !important;
    background-image: url(../images/resource/experince-3.png);
    background-size: 100%;
    width: 235px;
    height: 180px;
    background-repeat: no-repeat;
    padding-top: 68px;
    padding-left: 39px;
}

.experince-sec .image-column .image-box .review-box .review {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 5px;
    justify-content: center;
    align-items: center;
}

.experince-sec .image-column .image-box .review-box .review li {
    color: var(--white);
    margin-right: 5px;
    font-size: var(--font-12);
}

.experince-sec .image-column .image-box .review-box h6 {
    color: var(--white);
    font-weight: 600;
    text-align: center;
}

.experince-sec .content-column .inner-box .sec-title {
    margin-bottom: 15px;
}

.experince-sec .content-column .inner-box p {
    margin-bottom: 25px;
}

.experince-sec .box-cloummn .inner-box {
    position: relative;
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.experince-sec .box-cloummn .inner-box .audience-box {
    position: relative;
    box-shadow: 0 0 24px rgba(var(--black-opicity), 0.1);
    margin-bottom: 30px;
    background-color: var(--white);
    padding: 35px 30px;
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    overflow: hidden;
}

.experince-sec .box-cloummn .inner-box .audience-box:before {
    content: "";
    position: absolute;
    left: -100%;
    top: 0;
    width: 100%;
    height: 2px;
    background-color: var(--secondary);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.experince-sec .box-cloummn .inner-box .audience-box:hover:before {
    left: 0;
    opacity: 1;
    visibility: visible;
}

.experince-sec .box-cloummn .inner-box .audience-box h5 {
    font-weight: 700;
    margin-bottom: 13px;
    color: var(--darkgrey);
}

.experince-sec .box-cloummn .inner-box .audience-box .learnmore {
    margin-top: 15px;
    display: inline-block;
    font-style: italic;
    font-weight: 600;
}

/*** 
 * 

====================================================================
	Product Tabs Style
====================================================================

***/

.service-detail .prod-tabs {
    position: relative;
}

.tabs-box {
    position: relative;
}

.tabs-box .tab {
    display: none;
}

.tabs-box .tab.active-tab {
    display: block;
}

.service-detail .prod-tabs .tab-btns .tab-btn {
    position: relative;
    top: 1px;
    display: block;
    float: left;
    margin-right: 5px;
    font-size: var(--font-16);
    color: var(--darkgrey);
    text-transform: capitalize;
    font-weight: 400;
    line-height: 27px;
    cursor: pointer;
    border: 1px solid transparent;
    padding: 10px 25px;
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    font-family: var(--font-family-Niramit);
}

.service-detail .prod-tabs .tab-btns .tab-btn:hover:after,
.service-detail .prod-tabs .tab-btns .tab-btn.active-btn:after {
    position: absolute;
    content: '';
    left: 0px;
    bottom: -3px;
    width: 100%;
    height: 5px;
    background-color: var(--white);
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.service-detail .prod-tabs .tab-btns .tab-btn:hover,
.service-detail .prod-tabs .tab-btns .tab-btn.active-btn {
    color: var(--main-color);
    background: var(--white);
}

.service-detail .prod-tabs .tabs-content .tab .content p {
    position: relative;
    line-height: 30px;
    margin-bottom: 0px;
}

/*** 

====================================================================
			Invested Section
====================================================================

***/

.invested-sec {
    position: relative;
    padding: 80px 0 50px;
}

.invested-sec.altrenate {
    padding: 44px 0 17px;
}

.invested-sec .invseted-cloumn .invested-box {
    display: flex;
    flex-wrap: wrap;
    padding-left: 27px;
    margin-bottom: 30px;
    position: relative;
}

.invested-sec .invseted-cloumn .invested-box .icon-box {
    width: calc(30% - 0px);
    position: relative;
    padding: 39px;
    text-align: center;
    background-size: 100%;
    background-repeat: no-repeat;
}

.invested-sec .invseted-cloumn .invested-box .icon-box i {
    font-size: 80px;
    color: var(--white);
}

.invested-sec .invseted-cloumn .invested-box .icon-box .count {
    position: absolute;
    left: -28px;
    width: 40px;
    height: 40px;
    background-size: contain;
    line-height: 42px;
    color: var(--white);
    top: 15px;
}

.invested-sec .invseted-cloumn .invested-box .icon-box .count-1 {
    background-image: url('../images/services/11.png');
}

.invested-sec .invseted-cloumn .invested-box .icon-box .count-2 {
    background-image: url('../images/services/12.png');
}

.invested-sec .invseted-cloumn .invested-box .icon-box .count-3 {
    background-image: url('../images/services/13.png');
}

.invested-sec .invseted-cloumn .invested-box .text-box {
    width: calc(70% - 0px);
    padding: 14px 0px 0 25px;
    position: relative;
}

.invested-sec .invseted-cloumn .invested-box .text-box h4 {
    font-weight: 700;
    margin-bottom: 9px;
}

.invested-sec .invseted-cloumn .invested-box .text-box h4 a {
    color: var(--black);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.invested-sec .invseted-cloumn .invested-box .text-box p {
    margin-bottom: 10px;
    position: relative;
}

.invested-sec .invseted-cloumn .invested-box .text-box .readmore {
    position: relative;
    font-weight: 700;
}

.invested-sec .invseted-cloumn .invested-box .text-box .readmore:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 40%;
    height: 1px;
    background-color: var(--main-color);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.invested-sec .invseted-cloumn .invested-box:hover .text-box h4 a {
    color: var(--main-color);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.invested-sec .invseted-cloumn .invested-box:hover .text-box .readmore {
    color: var(--secondary);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.invested-sec .invseted-cloumn .invested-box:hover .text-box .readmore:before {
    background-color: var(--secondary);
    width: 100%;
}

/***

====================================================================
			Fun Fact Section
====================================================================

***/

.fun-fact-section {
    position: relative;
    z-index: 2;
}

.fun-fact-section .outer-box {
    position: relative;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 73px 0 24px;
}

.fact-counter {
    position: relative;
}

.fact-counter .counter-column {
    position: relative;
    margin-bottom: 40px;
}

.fact-counter .count-box {
    position: relative;
    line-height: 1em;
    color: var(--white);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.fact-counter .count-box .icon-box {
    width: calc(30% - 0px);
    display: flex;
    line-height: 60px;
}

.fact-counter .count-box .icon-box span {
    font-size: var(--font-60);
    color: var(--yellow);
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
}

.fact-counter .count-box:hover .icon-box span {
    transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
}

.fact-counter .count-box .text-box .count {
    position: relative;
    font-size: var(--font-30);
    line-height: 1em;
    color: var(--white);
    font-weight: 700;
}

.fact-counter .count-box .count-text {
    position: relative;
}

.fact-counter .count-box .text-box .count i {
    font-style: normal;
}

.fact-counter .count-box .counter-title {
    position: relative;
    display: block;
    font-size: var(--font-18);
    line-height: 1.2em;
    font-weight: 400;
    padding: 9px 0
}

/***

====================================================================
			Fun Fact And image
====================================================================

***/

.fun-fact-and-image {
    position: relative;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding: 136px 0 0;
}

.fun-fact-and-image:before {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    height: 775px;
    background-image: url(../images/background/18.png);
    background-repeat: no-repeat;
    background-position: top right;
    background-size: contain;
}

.projects-section .btn-box {
    margin-top: 50px;
}

.fun-fact-and-image .image-column .image-box .image {
    margin-top: -60px;
    position: relative;
}

.fun-fact-and-image .image-column .image-box .image:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 530px;
    height: 590px;
    background-repeat: no-repeat;
    background-size: 100%;
    background-image: url('../images/resource/fact-2.png');
    z-index: -1;
}

.counter-box {
    position: relative;
    display: flex;
    flex-wrap: wrap;
}

.counter-box .count-box {
    width: calc(89% / 2);
    background-color: var(--white);
    padding: 36px 40px 55px;
    text-align: center;
    margin: 0 15px 30px;
    border-radius: 20px;
    position: relative;
    box-shadow: 0 0 10px rgba(var(--black-opicity), 0.1);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.counter-box .count-box:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(../images/resource/fact-3.png);
    border-radius: 20px;
    visibility: hidden;
    opacity: 0;
    transform: scaleY(0);
    -webkit-transform: scaleY(0);
    -moz-transform: scaleY(0);
    -ms-transform: scaleY(0);
    -o-transform: scaleY(0);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.counter-box .count-box:hover:before {
    visibility: visible;
    opacity: 1;
    transform: scaleY(1);
    -webkit-transform: scaleY(1);
    -moz-transform: scaleY(1);
    -ms-transform: scaleY(1);
    -o-transform: scaleY(1);
}

.counter-box .count-box .count {
    font-size: var(--font-60);
    line-height: 1.5;
    color: var(--main-color);
    font-weight: 800;
    position: relative;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.counter-box .count-box .counter-title {
    color: var(--grey);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.counter-box .count-box .count i {
    font-style: normal;
}

.counter-box .count-box:hover .count,
.counter-box .count-box:hover .counter-title {
    color: var(--white);
}

.counter-box .count-box:first-child {
    top: -70px;
}

.counter-box .count-box:nth-child(3) {
    top: -70px;
    left: 0;
}

.counter-box .count-box:nth-child(4) {
    left: 0;
}

/***

====================================================================
			Projects Section
====================================================================

***/

.projects-section {
    position: relative;
    padding: 95px 0 0;
}

.projects-section .inner-container {
    position: relative;
}

.project-block {
    position: relative;
    margin-bottom: 30px;
}

.project-block .image-box {
    position: relative;
    overflow: hidden;
}

.project-block .image-box .image {
    position: relative;
}

.project-block .image-box .image img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 15px;
}

.project-block .image-box .overlay-box {
    position: absolute;
    left: 0;
    top: 0;
    height: 0%;
    width: 100%;
    background: var(--secondary) padding-box content-box;
    content: "";
    padding: 15px;
    opacity: 0;
    border-radius: 15px;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    transition: all 300ms linear;
}

.project-block:hover .overlay-box {
    height: 96%;
    opacity: 0.70;
}

.project-block .overlay-box a {
    position: absolute;
    left: 50%;
    top: 50%;
    height: 40px;
    width: 40px;
    margin-left: -20px;
    margin-top: -20px;
    text-align: center;
    font-size: var(--font-30);
    line-height: 40px;
    color: var(--white);
    font-weight: 400;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}

.project-block:hover .overlay-box a {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    transition: all 300ms linear;
    -webkit-transition-delay: 300ms;
    -moz-transition-delay: 300ms;
    -ms-transition-delay: 300ms;
    -o-transition-delay: 300ms;
    transition-delay: 300ms;
}

.project-block .overlay-box a i {
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.project-block .overlay-box a:hover i {
    color: var(--white);
}

.project-block .text-box {
    position: relative;
    background-color: var(--white);
    box-shadow: 0 0 30px var(--lightgrey);
    border-radius: 15px;
    padding: 25px 46px 25px 25px;
    margin: 0 25px;
    margin-top: -37px;
    overflow: hidden;
}

.project-block .text-box:after {
    content: "";
    position: absolute;
    right: -55px;
    top: -14px;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    background-color: var(--secondary);
}

.project-block .text-box:before {
    content: "";
    position: absolute;
    right: -55px;
    bottom: -14px;
    width: 110px;
    height: 110px;
    border-radius: 50%;
    background-color: var(--main-color);
}

.project-block .text-box .tag {
    color: var(--main-color);
    margin-bottom: 2px;
    display: block;
}

.project-block .text-box h3 {
    font-weight: 700;
}

.project-block .text-box h3 a {
    color: var(--black);
}

.projects-carousel {
    position: relative;
}

.projects-carousel .owl-nav {
    position: absolute;
    right: 15%;
    top: -130px;
    padding: 0 60px;
    margin: 0 auto;
    display: flex !important;
}

.projects-carousel .owl-next,
.projects-carousel .owl-prev {
    position: relative;
    display: block;
    font-size: var(--font-16);
    font-weight: 400;
    text-transform: uppercase;
    line-height: 50px;
    background-color: var(--main-color);
    z-index: 9;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
    width: 50px;
    height: 50px;
    color: var(--white);
    border-radius: 7px;
    text-align: center;
    margin-left: 20px;
}

.projects-carousel .owl-next:hover,
.projects-carousel .owl-prev:hover {
    background-color: var(--secondary);
}

/*=== Projects Section Alternate ===*/

.projects-section.alternate {
    position: relative;
    padding: 100px 0;
}

.mixitup-gallery .filters {
    margin-bottom: 50px;
    text-align: center;
}

.mixitup-gallery .filters .filter-tabs {
    position: relative;
    display: inline-block;
}

.mixitup-gallery .filters li {
    position: relative;
    float: left;
    font-size: var(--font-16);
    line-height: 30px;
    font-weight: 500;
    cursor: pointer;
    text-transform: capitalize;
    padding: 0 5px 0px;
    margin-right: 30px;
    margin-bottom: -2px;
    border-bottom: 2px solid transparent;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.filter-list .mix {
    display: none;
}

.projects-section.gallery-proj {
    padding: 50px 0 200px;
}

.mixitup-gallery .filters li:last-child {
    margin-right: 0;
}

.mixitup-gallery .filters li.active,
.mixitup-gallery .filters li:hover {
    border-bottom: 2px solid var(--main-color);
}

.project-block.mix {
    display: none;
    margin-bottom: 30px;
}

.projects-section.alternate .styled-pagination {
    margin-top: 50px;
}

/***

====================================================================
			Projects Style Two Section 
====================================================================

***/

.projects-section.style-two {
    padding: 44px 0 92px;
}

.projects-section .inner-container {
    padding: 0 2%;
}

.project-block-two {
    position: relative;
    margin-bottom: 30px;
}

.project-block-two .image-box {
    position: relative;
    overflow: hidden;
    -webkit-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;
}

.project-block-two .image-box figure {
    margin-bottom: 0;
}

.project-block-two .image-box .image img {
    border-radius: 15px;
    width: 100%;
}

.project-block-two .overlay-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--secondary);
    background-image: linear-gradient(var(--light-blue), var(--secondary));
    border-radius: 15px;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
    -webkit-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;
}

.project-block-two .overlay-box:before {
    content: "";
    position: absolute;
    left: -100%;
    top: 0;
    width: 71%;
    height: 285px;
    background-image: url('../images/gallery/5.png');
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;
    animation-delay: 2s;
    -webkit-animation-delay: 2s;
    -ms-animation-delay: 2s;
    -moz-animation-delay: 2s;
    -o-animation-delay: 2s;
    opacity: 0;
    visibility: hidden;
}

.project-block-two .overlay-box .category {
    position: absolute;
    top: 30px;
    left: 30px;
}

.project-block-two .overlay-box .category a {
    padding: 6px 27px;
}

.project-block-two .overlay-box .category h4 {
    font-weight: 600;
}

.project-block-two .overlay-box .detail-box {
    position: absolute;
    right: 40px;
    bottom: 40px;
    text-align: right;
}

.project-block-two .overlay-box .detail-box .upper-content {
    margin-bottom: 15px;
    position: relative;
}

.project-block-two .overlay-box .detail-box .upper-content a {
    background-color: var(--light-blue);
    display: inline-block;
    width: 38px;
    height: 38px;
    text-align: center;
    line-height: 38px;
    color: var(--white);
    border-radius: 50%;
    -webkit-transition: all .5s ease;
    -ms-transition: all .5s ease;
    -o-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;
}

.project-block-two .overlay-box .detail-box .upper-content a:hover {
    background-color: var(--main-color);
}

.project-block-two .overlay-box .detail-box h5 {
    font-weight: 700;
}

.project-block-two .overlay-box .detail-box h5 a {
    color: var(--white);
}

.project-block-two:hover .overlay-box {
    opacity: 1;
    visibility: visible;
    -webkit-transform: rotateY(0);
    -moz-transform: rotateY(0);
    -o-transform: rotateY(0);
    transform: rotateY(0);
}

.project-block-two:hover .overlay-box:before {
    animation-delay: 3s;
    -webkit-animation-delay: 3s;
    -ms-animation-delay: 3s;
    -moz-animation-delay: 3s;
    -o-animation-delay: 3s;
    opacity: 1;
    visibility: visible;
    left: 0;
}

/*** 

====================================================================
	Product Detail
====================================================================

***/

.project-details-section {
    position: relative;
    padding: 0px 0 250px;
}

.project-detail .upper-content {
    position: relative;
    padding-top: 50px;
}

.project-detail .upper-content .content-column {
    position: relative;
}

.project-detail .upper-content .content-column .inner-column .working-column {
    margin: 60px 0;
}

.project-detail .info-column .inner-column {
    background-color: var(--bg-grey);
    padding: 45px 35px;
}

.project-detail .upper-content h2 {
    position: relative;
    display: block;
    font-size: var(--font-30);
    line-height: 1.2em;
    color: var(--darkgrey);
    font-weight: 700;
    margin-bottom: 20px;
}

.project-detail .inner-column .word-box {
    width: 50px;
    height: 40px;
    display: inline-block;
    background-color: var(--white);
    color: var(--main-color);
    text-align: center;
    box-shadow: 0 0 16px rgba(var(--black-opicity), 0.1);
    line-height: 40px;
    font-size: var(--font-18);
    font-weight: 700;
    margin-right: 10px;
}

.project-detail .upper-content h3 {
    position: relative;
    display: block;
    font-size: var(--font-20);
    line-height: 1.2em;
    color: var(--darkgrey);
    font-weight: 700;
    margin-bottom: 27px;
}

.project-detail .upper-content h4 {
    position: relative;
    display: block;
    font-size: var(--font-24);
    line-height: 1.2em;
    color: var(--darkgrey);
    font-weight: 500;
    margin-bottom: 20px;
}

.project-detail .upper-content p {
    position: relative;
    display: block;
    margin-bottom: 30px;
}

.project-detail .upper-content .content-column blockquote {
    margin: 0 0 1rem;
    position: relative;
    padding: 20px 20px 20px 60px;
    color: var(--darkgrey);
    font-size: var(--font-24);
    font-weight: 700;
}

.project-detail .upper-content .content-column blockquote:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 4px;
    height: 100%;
    background-color: var(--main-color);
}

.project-detail .upper-content .content-column blockquote span {
    display: block;
    margin-top: 28px;
    font-size: var(--font-18);
    color: var(--secondary);
}

.project-detail .list-style-one {
    position: relative;
    margin-bottom: 30px;
}

.project-detail .list-style-one:after {
    display: table;
    clear: both;
    content: "";
}

.project-detail .info-column {
    position: relative;
    margin-bottom: 40px;
}

.project-detail .info-list {
    position: relative;
    display: block;
    margin-bottom: 30px;
}

.project-detail .info-list li {
    position: relative;
    line-height: 28px;
    font-weight: 400;
}

.project-detail .info-list li strong {
    position: relative;
    float: left;
    color: var(--darkgrey);
    font-weight: 700;
    width: 180px;
}

.project-detail .info-column .inner-column .published-block {
    position: relative;
    padding-bottom: 25px;
    margin-bottom: 25px;
    border-bottom: 1px solid rgba(var(--black-opicity), 0.2);
}

.project-detail .info-column .inner-column .published-block:last-child {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

.project-detail .info-column .inner-column .published-block h6 {
    margin-bottom: 10px;
    color: var(--darkgrey);
    font-weight: 700;
}

.project-detail .info-column .inner-column .published-block p {
    margin-bottom: 0;
}

.project-detail .info-column .inner-column .published-block .social-links {
    margin-top: 25px;
}

.project-detail .info-column .inner-column .published-block .social-links a {
    margin-left: 0;
    margin-right: 10px;
}

.project-detail .info-column .inner-column .published-block .social-links a.fb {
    background-color: var(--facebook-color);
}

.project-detail .info-column .inner-column .published-block .social-links a.twitter {
    background-color: var(--twitter-color);
}

.project-detail .info-column .inner-column .published-block .social-links a.linkedin {
    background-color: var(--linkedin-color);
}

.project-detail .info-column .inner-column .published-block .social-links a.gplus {
    background-color: var(--main-color);
}

/*** 

====================================================================
			Styled Pagination
====================================================================

***/

.styled-pagination {
    position: relative;
    display: block;
    width: 100%;
    margin-top: 50px;
}

.styled-pagination ul {
    position: relative;
    width: 100%;
    text-align: center;
}

.styled-pagination li {
    position: relative;
    display: inline-block;
    margin: 0 5px 8px;
}

.styled-pagination li a {
    position: relative;
    display: block;
    height: 40px;
    width: 40px;
    text-align: center;
    border-radius: 50%;
    line-height: 40px;
    font-weight: 400;
    background-color: var(--bg-grey);
    color: var(--darkgrey);
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    transition: all 300ms ease;
}

.styled-pagination li a:hover,
.styled-pagination li.active a {
    color: var(--white);
    background-color: var(--darkgrey);
}

.styled-pagination li.next-post a,
.styled-pagination li.prev-post a {
    background: var(--main-color);
    color: var(--white);
}

.styled-pagination li.next-post a:hover,
.styled-pagination li.prev-post a:hover {
    background: var(--secondary);
}

/*** 

====================================================================
			Team Section
====================================================================

***/

.team-section {
    position: relative;
    padding: 49px 0 20px;
    background-repeat: no-repeat;
    background-size: contain;
}

.team-section.alternate {
    padding: 75px 0 250px;
}

.team-bg {
    position: absolute;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    top: -57px;
    z-index: -1;
    background-size: contain;
}

.team-block {
    position: relative;
    margin-bottom: 30px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.team-block .inner-box {
    position: relative;
    padding: 41px 21px 0;
}

.team-block .image-box {
    position: relative;
    margin-bottom: 40px;
}

.team-block .inner-box .image {
    position: relative;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.team-block .inner-box .image:before {
    content: "";
    position: absolute;
    left: -25px;
    top: -38px;
    width: 280px;
    height: 410px;
    background-image: url(../images/team/5.png);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.team-block .inner-box .image img {
    width: auto;
    border-radius: 35px;
    -webkit-transform: skewY(-6deg);
    -o-transform: skewY(-6deg);
    -ms-transform: skewY(-6deg);
    /* IE 9 */
    transform: skewY(-6deg);
}

.team-block:hover .inner-box .image:before {
    -webkit-transform: skewY(6deg);
    -o-transform: skewY(6deg);
    -ms-transform: skewY(6deg);
    /* IE 9 */
    transform: skewY(6deg);
}

.team-block .inner-box .text-box {
    padding-left: 25px;
}

.team-block .inner-box .text-box h4 {
    font-weight: 700;
}

.team-block .inner-box .text-box h4 a {
    color: var(--darkgrey);
}

.team-block .inner-box .social-links {
    justify-content: center;
    align-items: center;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    opacity: 0;
    visibility: hidden;
}

.team-block .inner-box .social-links li {
    margin: 0px 0px;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.team-block .inner-box .social-links li a {
    background-color: var(--white);
    border-radius: 50%;
    color: var(--darkgrey);
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.team-block .inner-box .social-links li a:hover {
    color: var(--main-color);
}

.team-block:hover .inner-box .social-links {
    bottom: 120px;
    opacity: 1;
    visibility: visible;
}

.team-block:hover .inner-box .social-links li {
    margin: 0px 3px;
}

.team-carousel .owl-dots {
    display: flex !important;
    margin-top: 50px;
    text-align: center;
    align-items: center;
    justify-content: center;
}

.team-carousel .owl-dots .owl-dot {
    position: relative;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 10px;
    background-color: var(--lightgrey);
}

.team-carousel .owl-dots .owl-dot.active {
    width: 20px;
    height: 20px;
    background-color: var(--main-color);
}

.team-block-1 .inner-box .image:before {
    background-image: url(../images/team/6.png);
}

.team-block-2 .inner-box .image:before {
    background-image: url(../images/team/7.png);
}

.team-block-3 .inner-box .image:before {
    background-image: url(../images/team/8.png);
}

/*** 

====================================================================
		Team Detail
====================================================================

***/

.team-details-section {
    position: relative;
    padding: 100px 0 250px;
}

.team-detail-block {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top right;
    margin-bottom: 70px;
}

.team-detail-block .inner-box .image-box {
    margin-bottom: 0;
    margin-top: 0px;
}

.team-detail-block .inner-box {
    padding: 0;
    display: flex;
    flex-wrap: wrap;
}

.team-detail-block .inner-box .image-box {
    width: calc(35% - 0px);
    margin-top: 30px;
    margin-bottom: 0;
    padding-left: 39px;
}

.team-detail-block .inner-box .info-name {
    width: calc(65% - 0px);
    padding: 50px 50px 13px;
    margin-bottom: 25px;
}

.team-detail-block .inner-box .info-name .inner-box {
    display: block;
}

.team-detail-block .inner-box .info-name .inner-box .team-name {
    background-color: var(--darkgrey);
    display: flex;
    flex-wrap: wrap;
    width: 375px;
    border-radius: 15px;
    align-items: center;
    padding: 10px;
    margin-bottom: 25px;
}

.team-detail-block .inner-box .info-name .inner-box .team-name .icon-box {
    width: 90px;
    height: 90px;
    line-height: 90px;
    text-align: center;
    background-color: var(--bg-grey);
    border-radius: 15px;
    font-size: var(--font-36);
}

.team-block .inner-box .text-box h3 {
    color: var(--white);
    font-weight: 700;
}

.team-block .inner-box .text-box p {
    color: var(--bg-grey);
}

.team-detail-block .inner-box .info-name .inner-box .info-detail {
    position: relative;
    margin-bottom: 25px;
    clear: both;
}

.team-detail-block .inner-box .info-name .inner-box .info-detail li {
    width: 49%;
    display: inline-block;
    margin-bottom: 10px;
}

.team-detail-block .inner-box .info-name .inner-box .info-detail li i {
    margin-right: 14px;
}

.team-detail-block .inner-box .info-name .inner-box .info-detail li:last-child {
    width: 100%;
}

.team-detail-block .inner-box .info-name .inner-box .btn-style-two {
    display: inline-block;
    width: 37%;
}

.team-detail-block .inner-box .info-name .inner-box .social-links {
    position: relative;
    width: 55%;
    opacity: 1;
    visibility: visible;
    display: inline-block;
    left: 0;
    transform: translateX(0);
    top: -17px;
    margin-left: 23px;
}

.team-detail-block .inner-box .info-name .inner-box .social-links li {
    display: inline-block;
    margin: 0 !important;
}

.team-detail {
    position: relative;
}

.team-detail p {
    margin-bottom: 25px;
}

.team-detail .support-box {
    position: relative;
    margin-top: 50px;
}

.team-detail .support-box .support-block {
    position: relative;
}

.team-detail .support-box .support-block .inner-box {
    display: flex;
    flex-wrap: wrap;
    background-color: var(--secondary);
    padding: 25px;
    border-radius: 15px;
    align-items: center;
    margin-bottom: 30px;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.team-detail .support-box .support-block .inner-box .icon-box {
    width: calc(25% - 0px);
}

.team-detail .support-box .support-block .inner-box .icon-box i {
    color: var(--white);
    font-size: var(--font-60);
}

.team-detail .support-box .support-block .inner-box .text-box {
    width: calc(75% - 0px);
}

.team-detail .support-box .support-block .inner-box .text-box h4 {
    color: var(--white);
    font-weight: 700;
    margin-bottom: 15px;
}

.team-detail .support-box .support-block .inner-box .text-box p {
    margin: 0;
    color: var(--white);
}

.team-detail .support-box .support-block:hover .inner-box {
    background-color: var(--main-color);
}

/*** 

====================================================================
		Progress Section
====================================================================

***/

.progress-sec {
    position: relative;
    padding: 100px 0;
}

/*** Progress Levels Section ***/

.progress-levels {
    position: relative;
}

.normal-section .column .progress-levels {
    padding-left: 15px;
}

.progress-levels .progress-box {
    position: relative;
    margin-bottom: 30px;
    overflow: hidden;
}

.member-details .progress-levels .progress-box {
    margin-bottom: 40px;
}

.member-details .progress-levels .progress-box:last-child {
    margin-bottom: 0px;
}

.about-myself .progress-levels .progress-box:last-child {
    margin-bottom: 30px;
}

.progress-levels .progress-box .box-title {
    position: relative;
    text-transform: uppercase;
    margin-bottom: 15px;
    color: var(--darkgrey);
    font-weight: 700;
    font-size: var(--font-18);
}

.progress-levels .progress-box .bar-inner {
    position: relative;
    width: 100%;
    height: 3px;
    background-color: #0032A1;
}

.progress-levels .progress-box .bar {
    position: absolute;
    left: 0px;
    top: -13px;
    height: 5px;
    width: 0px;
    border-bottom: 10px solid #FF8A00;
    -webkit-transition: all 2000ms ease;
    -ms-transition: all 2000ms ease;
    -o-transition: all 2000ms ease;
    -moz-transition: all 2000ms ease;
    transition: all 2000ms ease;
}

.progress-levels .progress-box .bar .bar-innner {
    position: relative;
    left: 0px;
    top: 0;
    width: 100%;
    height: 5px;
    background-color: #0032A1;
}

.progress-levels .progress-box .bar .bar-fill {
    position: absolute;
    left: -100%;
    top: -8px;
    width: 0px;
    height: 6px;
    background-color: var(--main-color);
    transition: all 2000ms ease 300ms;
    -moz-transition: all 2000ms ease 300ms;
    -webkit-transition: all 2000ms ease 300ms;
    -ms-transition: all 2000ms ease 300ms;
    -o-transition: all 2000ms ease 300ms;
}

.progress-levels .progress-box.animated .bar .bar-fill {
    left: 0px;
}

.progress-levels .progress-box .progress-percentage {
    position: absolute;
    top: 0px;
    right: 0;
}

.progress-levels .progress-box .progress-percentage .counted {
    color: var(--darkgrey);
    font-weight: 700;
    font-size: var(--font-18);
}

.progress-sec .image-box figure {
    position: relative;
    z-index: 2;
}

.progress-sec .progress-bg {
    background-image: url(../images/resource/progress-bg.png);
    position: absolute;
    width: 100%;
    height: 870px;
    z-index: -1;
    top: 0;
    background-repeat: no-repeat;
    background-size: 44%;
    right: 0;
    background-position: top right;
}

.progress-sec .image-box {
    margin-right: -259px;
    margin-left: 230px;
    margin-top: -20px !important;
}

.progress-sec .image-box .animated-img-1 {
    background-image: url(../images/resource/progress-2.png);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    background-repeat: no-repeat;
    background-size: contain;
    right: -278px;
    animation: zoom-in-zoom-out 3s ease infinite;
}

.progress-sec .image-box .animated-img-2 {
    background-image: url(../images/resource/progress-3.png);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 40px;
    background-repeat: no-repeat;
    background-size: 55%;
    right: -423px;
    -webkit-animation: ease infinite alternate, nudge 10s linear infinite alternate;
    animation: ease infinite alternate, nudge 10s linear infinite alternate;
}

.progress-sec .image-box .animated-img-3 {
    background-image: url(../images/resource/progress-4.png);
    position: absolute;
    width: 100%;
    height: 100%;
    top: 63px;
    background-repeat: no-repeat;
    background-size: 14%;
    right: -197px;
    animation: bounce 1s infinite alternate;
    -webkit-animation: bounce 1s infinite alternate;
}

@keyframes zoom-in-zoom-out {
    0% {
        transform: scale(1, 1);
    }
    50% {
        transform: scale(1.1, 1.1);
    }
    100% {
        transform: scale(1, 1);
    }
}

@-webkit-keyframes nudge {
    0%,
    100% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(150px, 0);
    }
    80% {
        transform: translate(-150px, 0);
    }
}

@keyframes nudge {
    0%,
    100% {
        transform: translate(0, 0);
    }
    50% {
        transform: translate(150px, 0);
    }
    80% {
        transform: translate(-150px, 0);
    }
}

/*** 

====================================================================
		Testimonial Section
====================================================================

***/

.testimonial-section {
    position: relative;
    padding: 78px 0 36px;
}

.testimonial-section .outer-container {
    position: relative;
}

.testimonial-section .image-column .image-box {
    animation-duration: 2s;
    animation-iteration-count: infinite
}

.testimonial-section .image-column .image-box img {
    animation: bounce 1s infinite alternate;
    -webkit-animation: bounce 1s infinite alternate;
}

.testimonial-section .testimonial-column .inner-column {
    position: static;
    width: 100%;
}

.testimonial-carousel {
    position: relative;
}

.testimonial-block {
    position: relative;
    padding-left: 30px;
    padding-bottom: 40px;
}

.testimonial-block .inner-box .text:before {
    content: "";
    position: absolute;
    left: -31px;
    top: 0;
    width: 575px;
    height: 340px;
    background-image: url(../images/resource/testimonial-bg.png);
    z-index: -1;
}

.testimonial-block .image-box {
    position: relative;
}

.testimonial-block .image-box .image {
    position: relative;
}

.testimonial-block .text {
    position: relative;
    display: block;
    font-size: var(--font-18);
    line-height: 36px;
    color: var(--grey);
    font-weight: 400;
    margin-bottom: -20px;
    padding-top: 60px;
    padding: 51px 25px 0;
}

.testimonial-block .info-box {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.testimonial-block .info-box .thumb {
    width: 100px;
    height: 120px;
    background-color: var(--main-color);
    padding: 17px 0 0 0;
    border-radius: 106px;
    overflow: hidden;
    text-align: center;
}

.testimonial-block .info-box .thumb img {
    width: auto;
    margin: 0 auto;
}

.testimonial-block .info-box .text-box {
    width: calc(33% - 0px);
    margin-left: 30px;
    margin-top: 34px;
}

.testimonial-block .info-box .text-box .name {
    position: relative;
    display: block;
    line-height: 1.2em;
    font-weight: 700;
    color: var(--secondary);
}

.testimonial-block .info-box .designation {
    position: relative;
    display: block;
}

.testimonial-block .icon-quote {
    position: absolute;
    bottom: 0;
    background-image: url('../images/resource/quote-bg.png');
    width: 135px;
    height: 135px;
    background-repeat: no-repeat;
}

.testimonial-block .icon-quote i {
    text-align: center;
    width: 100%;
    font-size: 75px;
    color: var(--white);
    transform: rotate(180deg);
    display: block;
    line-height: 115px;
    padding-left: 23px;
    padding-bottom: 8px;
}

.testimonial-section .owl-nav {
    display: none;
}

/*** 

====================================================================
		Testmonial Style Two
====================================================================

***/

.testimonial-section.style-two {
    padding: 51px 0 0;
}

.testimonial-column .testimonial-inner {
    position: relative;
    background-size: 100%;
    background-repeat: no-repeat;
}

.testimonial-block-two {
    position: relative;
}

.testimonial-block-two .inner-box {
    position: relative;
    text-align: center;
}

.testimonial-block-two .inner-box .thumb {
    margin: 0 0 15px;
    text-align: center;
    width: 100%;
    position: relative;
}

.testimonial-block-two .inner-box .thumb img {
    width: 110px;
    height: 110px;
    border-radius: 50%;
    margin: 0 auto;
}

.testimonial-block-two .inner-box .info-box {
    margin-top: 20px;
}

.testimonial-block-two .inner-box .info-box .name {
    color: var(--secondary);
    font-weight: 700;
}

.testimonial-section.style-two .testimonial-column .testimonial-carousel {
    max-width: 580px;
    text-align: center;
    padding: 95px 0 159px 143px;
}

.testimonial-section.style-two .title-column .sec-title {
    margin-top: 120px;
}

.testimonial-column .testimonial-inner .thumb-box .thumb-1 {
    position: absolute;
    top: 81px;
    left: 59px;
}

.testimonial-column .testimonial-inner .thumb-box .thumb-1 img {
    width: 110px;
    height: 110px;
    border-radius: 50%;
}

.testimonial-column .testimonial-inner .thumb-box .thumb-2 {
    position: absolute;
    bottom: 86px;
    left: 59px;
}

.testimonial-column .testimonial-inner .thumb-box .thumb-2 img {
    width: 135px;
    height: 135px;
    border-radius: 50%;
}

.testimonial-column .testimonial-inner .thumb-box .thumb-4 {
    position: absolute;
    right: 179px;
    top: 54px;
}

.testimonial-column .testimonial-inner .thumb-box .thumb-4 img {
    width: 135px;
    height: 135px;
    border-radius: 50%;
}

.testimonial-column .testimonial-inner .thumb-box .thumb-3 {
    position: absolute;
    bottom: 56px;
    right: 175px;
}

.testimonial-column .testimonial-inner .thumb-box .thumb-3 img {
    width: 170px;
    height: 170px;
    border-radius: 50%;
}

.testimonial-section.style-two .owl-nav {
    position: absolute;
    left: -55%;
    bottom: 26%;
    display: flex;
    flex-wrap: wrap;
}

.testimonial-section.style-two .owl-nav .owl-prev,
.testimonial-section.style-two .owl-nav .owl-next {
    width: 40px;
    height: 40px;
    background-color: var(--white);
    color: var(--main-color);
    border-radius: 50%;
    box-shadow: 7px 0 18px rgba(var(--black-opicity), 0.1);
    margin: 0 10px;
    transition: all 0.3s ease-in-out;
    text-align: center;
    line-height: 40px;
}

.testimonial-section.style-two .owl-nav .owl-prev:hover,
.testimonial-section.style-two .owl-nav .owl-next:hover {
    color: var(--secondary);
}

/*** 

====================================================================
		Products Section
====================================================================

***/

.products-section {
    position: relative;
    padding: 100px 0 80px;
}

.products-section .sec-title {
    margin-bottom: 0;
}

.products-section .title-column {
    position: relative;
    margin-bottom: 40px;
}

.products-section .title-column .inner-column {
    position: relative;
    padding-top: 55px;
}

.products-section .title-column h4 {
    position: relative;
    display: block;
    font-size: var(--font-18);
    line-height: 30px;
    color: var(--darkgrey);
    font-weight: 500;
    margin-bottom: 26px;
}

.products-section .title-column p {
    position: relative;
    display: block;
    font-size: 14px;
    line-height: 30px;
    font-weight: 400;
    margin-bottom: 30px;
}

.products-section .title-column .btn-box a {
    padding: 15px 38px;
    line-height: 20px;
}

.products-section .products-column {
    padding: 0;
}

.products-carousel {
    position: relative;
}

.products-carousel .product-block {
    padding: 15px;
    padding-top: 65px;
    transition: all 400ms ease;
}

.products-carousel .center .product-block {
    padding-top: 15px;
}

.products-carousel .center .product-block .inner-box {
    -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0 0 15px rgba(0, 0, 0, 0.05);
    -ms-box-shadow: 0 0 15px rgba(0, 0, 0, 0.05);
    -o-box-shadow: 0 0 15px rgba(0, 0, 0, 0.05);
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.05);
}

.product-block {
    position: relative;
}

.product-block .inner-box {
    position: relative;
    transition: all 400ms ease;
}

.product-block .info-box {
    position: relative;
    padding: 25px 28px;
    text-align: right;
}

.product-block .info-box .name {
    position: relative;
    display: block;
    font-size: var(--font-18);
    line-height: 30px;
    color: var(--darkgrey);
}

.product-block .info-box .price {
    position: relative;
    display: block;
    font-size: 14px;
    line-height: 24px;
}

.products-carousel .owl-nav {
    position: absolute;
    left: -32%;
    bottom: 15px;
}

.products-carousel .owl-next,
.products-carousel .owl-prev {
    position: relative;
    display: inline-block;
    padding-left: 25px;
    font-size: 14px;
    font-weight: 400;
    text-transform: uppercase;
    line-height: 30px;
    padding-top: 6px;
    background-color: var(--white);
    z-index: 9;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.products-carousel .owl-next:hover,
.products-carousel .owl-prev:hover {
    color: var(--main-color);
}

.products-carousel .owl-next:before,
.products-carousel .owl-prev:before {
    position: absolute;
    left: 0;
    top: 0;
    height: 40px;
    width: 60px;
    border-right: 0;
    content: "";
    z-index: -1;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.products-carousel .owl-next:hover:before,
.products-carousel .owl-prev:hover:before {
    border-color: var(--main-color);
}

.products-carousel .owl-next:before {
    left: auto;
    right: -25px;
    border-left: 0;
}

.products-carousel .owl-next span {
    margin-left: 5px;
}

.products-carousel .owl-prev span {
    margin-right: 5px;
}

/***

====================================================================
		Video Section
====================================================================

***/

.video-section {
    position: relative;
}

.video-section .outer-box {
    position: relative;
    max-width: 1720px;
    margin: 0 auto;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    padding: 100px 0;
}

.video-section .outer-box:before {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background-color: var(--darkgrey);
    opacity: 0.90;
    content: "";
}

.video-section .content-column {
    position: relative;
    order: 12;
}

.video-section .content-column .inner-column {
    position: relative;
    padding: 35px 35px 0px 40px;
}

.video-section .content-column .sec-title {
    margin-bottom: 22px;
}

.video-section .content-column .title {
    position: relative;
    display: block;
    font-size: var(--font-18);
    line-height: 25px;
    color: var(--main-color);
    font-weight: 400;
    margin-bottom: 30px;
}

.video-section .content-column p {
    position: relative;
    display: block;
    font-size: 14px;
    line-height: 28px;
    color: var(--white);
    font-weight: 400;
}

.video-section .video-column .inner-column {
    position: relative;
    padding-left: 50px;
}

.video-section .video-column .video-box {
    position: relative;
}

.video-section .video-column .video-box .image {
    position: relative;
    margin-bottom: 0;
}

.video-section .video-column .video-box .image img {
    display: block;
    width: 100%;
    height: auto;
}

.video-section .video-column .video-box .link {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    text-align: center;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.video-section .video-column .video-box .link:hover {
    background-color: rgba(0, 0, 0, 0.50);
}

.video-section .video-column .video-box .link .icon {
    position: absolute;
    left: 50%;
    top: 50%;
    height: 60px;
    width: 60px;
    padding-left: 4px;
    font-size: var(--font-18);
    color: var(--main-color);
    border-radius: 50%;
    text-align: center;
    line-height: 60px;
    margin-top: -30px;
    margin-left: -30px;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.video-section .video-column .video-box .link:hover .icon {
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
}

/*== Video Section Style Two ==*/

.video-section.style-two .outer-box {
    padding-bottom: 155px;
}

.video-section.style-two .outer-box:before {
    display: none;
}

.video-section .video-column .video-box:before {
    position: absolute;
    left: -50px;
    height: 320px;
    width: 520px;
    bottom: -55px;
    background-image: url(../images/icons/icon-lines.html);
    background-repeat: no-repeat;
    background-position: center;
    content: "";
}

/*** 

====================================================================
			FAQ Section
====================================================================

***/

.faq-section {
    position: relative;
    padding: 76px 0;
    background-repeat: no-repeat;
}

.faq-section:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 820px;
    height: 1015px;
    background-image: url('../images/background/12.png');
}

.faq-section.alternate:before {
    display: none;
}

.faq-section.alternate {
    padding: 49px 0 0;
}

.faq-section .image-column {
    position: relative;
    margin-bottom: 50px;
}

.faq-section .image-column .inner-column {
    position: relative;
}

.faq-section .image-column .image-box {
    position: relative;
}

.faq-section .image-column .image {
    position: relative;
    margin-bottom: 0;
    margin-left: -270px;
    text-align: center;
}

.faq-section .title-column .image img {
    display: inline-block;
    max-width: 100%;
    height: auto;
}

.faq-section .accordion-column {
    position: relative;
}

.faq-section .accordion-column .inner-column {
    position: relative;
    padding-top: 45px;
}

.faq-section .accordion-column .sec-title {
    margin-bottom: 35px;
}

.faq-section .accordion-box {
    position: relative;
}

.accordion-box .block {
    position: relative;
    border: 1px solid rgba(var(--black-opicity), 0.1);
    border-radius: 8px;
    margin-bottom: 15px;
}

.accordion-box .block .acc-btn {
    position: relative;
    font-weight: 700;
    cursor: pointer;
    color: var(--darkgrey);
    background-color: var(--white);
    font-size: var(--font-20);
    padding: 15px 25px 15px;
    padding-right: 50px;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}

.accordion-box .block .acc-btn.active {
    color: var(--main-color);
    margin-bottom: 0px;
    padding-bottom: 0;
}

.accordion-box .active-block .acc-content .content {
    padding-top: 3px;
}

.accordion-box .block .icon {
    position: absolute;
    right: 15px;
    top: 15px;
    height: 30px;
    width: 30px;
    font-size: var(--font-18);
    line-height: 30px;
    color: var(--secondary);
    text-align: center;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
}

.accordion-box .block .acc-btn.active .icon:before {
    position: absolute;
    left: 0;
    top: 0;
    height: 30px;
    width: 30px;
    line-height: 30px;
    opacity: 1;
    z-index: 1;
    color: var(--secondary);
    font-size: var(--font-18);
    content: "\f358";
    font-family: "Font Awesome 5 Free";
    text-align: center;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
}

.accordion-box .block .acc-content {
    position: relative;
    display: none;
    background-color: var(--white);
}

.accordion-box .block .content {
    position: relative;
    padding: 20px 25px;
    margin-bottom: 0;
}

.accordion-box .block .acc-content.current {
    display: block;
}

.accordion-box .block .content p {
    display: block;
}

/***

====================================================================
  Pricing Section
====================================================================

***/

.pricing-section {
    position: relative;
    padding-bottom: 32px;
}

.pricing-section.alternate {
    position: relative;
    padding: 100px 0 250px;
}

.pricing-section:before {
    content: "";
    position: absolute;
    right: 0;
    top: -178px;
    width: 540px;
    height: 1015px;
    background-image: url(../images/background/13.png);
    background-repeat: no-repeat;
    background-size: contain;
}

.pricing-section .patern-layer {
    position: absolute;
    left: 0px;
    top: -160px;
    width: 100%;
    height: 1291px;
}

.pricing-section .sec-title {
    margin-bottom: 30px;
}

.pricing-tabs .tabs-content .tab {
    position: relative;
    display: none;
}

.pricing-tabs .tabs-content .tab.active-tab {
    display: block;
}

.pricing-tabs {
    position: relative;
}

.pricing-tabs .title-column {
    position: relative;
    text-align: center;
    margin-bottom: 50px;
}

.pricing-tabs .tab-buttons {
    position: relative;
    overflow: hidden;
    padding: 3px;
    text-align: center;
    border-radius: 50px;
    display: inline-block;
    background-color: rgba(var(--black-opicity), 0.1);
}

.pricing-tabs .tab-buttons .tab-btn {
    position: relative;
    color: var(--black);
    font-weight: 700;
    float: left;
    cursor: pointer;
    padding: 11px 45px;
    border-radius: 50px;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    transition: all 300ms ease;
}

.pricing-tabs .tab-buttons .tab-btn:hover,
.pricing-tabs .tab-buttons .tab-btn.active-btn {
    color: var(--white);
    background-color: var(--main-color);
}

.price-block {
    position: relative;
    margin-bottom: 30px;
    -webkit-transition: all 600ms ease;
    -moz-transition: all 600ms ease;
    -ms-transition: all 600ms ease;
    -o-transition: all 600ms ease;
    transition: all 600ms ease;
}

.price-block .inner-box {
    position: relative;
    background-color: var(--white);
    box-shadow: 0px 0px 8px rgb(0 0 0 / 10%);
    border-radius: 24px;
    background-image: url('../images/resource/price-bg.png');
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: contain;
    -webkit-transition: all 600ms ease;
    -moz-transition: all 600ms ease;
    -ms-transition: all 600ms ease;
    -o-transition: all 600ms ease;
    transition: all 600ms ease;
}

.price-block:hover .inner-box,
.price-block .inner-box.active {
    transform: scale(1.05);
}

.price-block .inner-box .packge-plan {
    position: relative;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top right;
    padding: 46px 42px 76px 56px;
    text-align: right;
}

.price-block .inner-box h6 {
    position: relative;
    color: var(--white);
    font-weight: 600;
    margin-bottom: 10px;
    -webkit-transition: all 600ms ease;
    -moz-transition: all 600ms ease;
    -ms-transition: all 600ms ease;
    -o-transition: all 600ms ease;
    transition: all 600ms ease;
}

.price-block .inner-box .icon-box {
    position: relative;
}

.price-block .inner-box .icon-box .icon {
    position: relative;
}

.price-block .inner-box .price {
    position: relative;
    color: var(--white);
    font-size: var(--font-48);
    font-weight: 700;
    line-height: 1.3em;
    margin-top: 5px;
    -webkit-transition: all 600ms ease;
    -moz-transition: all 600ms ease;
    -ms-transition: all 600ms ease;
    -o-transition: all 600ms ease;
    transition: all 600ms ease;
}

.price-block .inner-box .plan-text {
    color: var(--white);
    font-size: var(--font-18);
    font-weight: 700;
}

.price-block .inner-box .list-packges-area {
    padding: 10px 40px 30px;
}

.price-block .inner-box .price-list {
    position: relative;
    margin-bottom: 40px;
}

.price-block .inner-box .price-list li {
    position: relative;
    margin-bottom: 8px;
    padding-left: 35px;
    color: var(--lightgrey);
    -webkit-transition: all 600ms ease;
    -moz-transition: all 600ms ease;
    -ms-transition: all 600ms ease;
    -o-transition: all 600ms ease;
    transition: all 600ms ease;
}

.price-block .inner-box .price-list li:before {
    content: "\f192";
    position: absolute;
    left: 0;
    top: 0;
    font-size: var(--font-16);
    color: var(--lightgrey);
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
}

.price-block .inner-box .price-list li.active {
    color: var(--grey);
}

.price-block .inner-box .price-list li.active:before {
    color: var(--secondary);
}

.price-block .inner-box .price-list li:last-child {
    margin-bottom: 0px;
}

.price-block .inner-box .buy-btn {
    position: relative;
    -webkit-transition: all 600ms ease;
    -moz-transition: all 600ms ease;
    -ms-transition: all 600ms ease;
    -o-transition: all 600ms ease;
    transition: all 600ms ease;
}

.price-block:hover .inner-box .buy-btn:before,
.price-block .inner-box.active .buy-btn:before {
    left: -100%;
}

.pricing-tabs .bottom-column {
    margin-top: 70px;
    text-align: center;
}

/*** 

====================================================================
				News Section
====================================================================

***/

.news-section {
    position: relative;
    padding: 119px 0 47px;
    background-repeat: no-repeat;
    background-size: cover;
}

.news-block {
    position: relative;
    margin: 15px 8px 30px;
    z-index: 1;
}

.news-block .inner-box {
    position: relative;
    padding: 20px;
    border-radius: 15px;
    background-color: var(--white);
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.21);
    -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.21);
    -ms-box-shadow: 0 0 10px rgba(0, 0, 0, 0.21);
    -o-box-shadow: 0 0 10px rgba(0, 0, 0, 0.21);
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.21);
}

.news-block .image-box {
    position: relative;
}

.news-block .image-box .image {
    position: relative;
    margin-bottom: 20px;
}

.news-block .image-box .image img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 15px;
}

.news-block .image-box .overlay-box {
    position: absolute;
    left: 0;
    top: 0;
    height: 0%;
    width: 100%;
    background: var(--main-color) padding-box content-box;
    content: "";
    padding: 15px;
    opacity: 0;
    border-radius: 15px;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    transition: all 300ms linear;
}

.news-block .inner-box:hover .overlay-box {
    height: 100%;
    opacity: 0.70;
}

.news-block .overlay-box a {
    position: absolute;
    left: 50%;
    top: 50%;
    height: 40px;
    width: 40px;
    margin-left: -20px;
    margin-top: -20px;
    text-align: center;
    font-size: var(--font-30);
    line-height: 40px;
    color: var(--white);
    font-weight: 400;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}

.news-block .inner-box:hover .overlay-box a {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    transition: all 300ms linear;
    -webkit-transition-delay: 300ms;
    -moz-transition-delay: 300ms;
    -ms-transition-delay: 300ms;
    -o-transition-delay: 300ms;
    transition-delay: 300ms;
}

.news-block .overlay-box a i {
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.news-block .overlay-box a:hover i {
    color: var(--white);
}

.news-block .caption-box {
    position: relative;
    text-align: center;
    margin-bottom: 15px;
}

.news-block .caption-box h4 {
    position: relative;
    display: block;
    font-weight: 700;
    margin: 20px 0 30px;
    color: var(--black);
    font-size: 20px;
}

.news-block .caption-box h4 a {
    display: block;
    color: var(--black);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.news-block .inner-box:hover .caption-box h4 a {
    color: var(--secondary);
}

.news-block .caption-box .info {
    position: relative;
    display: block;
}

.news-block .caption-box .info li {
    position: relative;
    display: inline-block;
    font-size: 14px;
    line-height: 24px;
    font-weight: 400;
    margin-right: 10px;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.news-block .caption-box .info li i {
    margin-right: 10px;
}

.news-block .inner-box:hover .caption-box .info li {
    color: var(--darkgrey);
}

.news-block .caption-box .info li a {
    color: var(--main-color);
}

.news-block .caption-box .readmore {
    display: inline-block;
    font-weight: 700;
    border-bottom: 1px solid var(--main-color);
    color: var(--main-color);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.news-block .caption-box p {
    margin-bottom: 18px;
}

.news-block .inner-box:hover .readmore {
    color: var(--secondary);
    border-bottom: 1px solid var(--secondary);
}

.news-carousel .owl-nav {
    display: none;
}

.news-carousel .owl-dots {
    display: flex !important;
    margin-top: 50px;
    text-align: center;
    align-items: center;
    justify-content: center;
}

.news-carousel .owl-dots .owl-dot {
    position: relative;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    margin-right: 10px;
    background-color: var(--lightgrey);
}

.news-carousel .owl-dots .owl-dot.active {
    width: 20px;
    height: 20px;
    background-color: var(--main-color);
}

/***

====================================================================
		News Section Two
====================================================================

***/

.news-section-two {
    position: relative;
    padding: 170px 0 150px;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: -1;
}

/*News Block Two*/

.news-block.style-two .inner-box {
    padding: 0;
}

.news-block.style-two .inner-box .image-box .image img {
    border-radius: 15px 15px 0 0;
}

.news-block.style-two .caption-box {
    text-align: left;
    padding: 30px;
}

.news-block.style-two .caption-box h4 {
    margin: 12px 0;
}

.news-block.style-two .image-box .image {
    margin-bottom: 0;
}

.news-block.style-two .caption-box .category {
    display: flex;
    flex-wrap: wrap;
}

.news-block.style-two .caption-box .category li:not(:last-child) {
    position: relative;
    margin-right: 6px;
}

.news-block.style-two .caption-box .category li a:after {
    content: ",";
}

.news-block.style-two .caption-box .category li:last-child a:after {
    display: none;
}

/*** 

====================================================================
		News Section style Three
====================================================================

***/

.news-section-three {
    padding: 89px 0 11px;
    position: relative;
}

.news-section-three.alternate {
    padding: 100px 0 250px;
}

.news-block.style-three {
    margin: 0 0 30px;
}

.news-block.style-three .inner-box {
    padding: 0;
    border: 1px solid rgba(var(--black-opicity), 0.1);
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    transition: all 0.3s ease-in-out;
}

.news-block.style-three:hover .inner-box {
    -webkit-box-shadow: 0 0 10px rgb(var(--black-opicity), 0.21);
    -moz-box-shadow: 0 0 10px rgb(var(--black-opicity), 0.21);
    -ms-box-shadow: 0 0 10px rgb(var(--black-opicity), 0.21);
    -o-box-shadow: 0 0 10px rgb(var(--black-opicity), 0.21);
    box-shadow: 0 0 10px rgb(var(--black-opicity), 0.21);
}

.news-block.style-three .image-box .image img {
    border-radius: 15px 15px 0 0;
}

.news-block.style-three .overlay-box {
    background: var(--black) padding-box content-box;
    border-radius: 15px 15px 0 0;
    padding: 0;
}

.news-block.style-three .overlay-box .share-button {
    right: 20px;
    left: auto;
    top: auto;
    bottom: 15px;
    font-size: var(--font-16);
    width: auto;
    height: auto;
    border: none;
    position: absolute;
    cursor: pointer;
    z-index: 9;
    color: var(--white);
}

.news-block.style-three .overlay-box .social-links {
    position: absolute;
    bottom: 10px;
    right: 0;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
}

.news-block.style-three .overlay-box .social-links.show-social {
    right: 40px;
    opacity: 1;
    visibility: visible;
}

.news-block.style-three .overlay-box .social-links li a {
    width: auto;
    height: auto;
    border: none;
    font-size: var(--font-16);
    position: relative;
    left: auto;
    top: auto;
    margin: 0 10px;
    text-align: right;
    color: var(--white);
    border-radius: 0;
}

.news-block.style-three .overlay-box .social-links li a:hover {
    background: none;
    color: var(--white);
}

.news-block.style-three .caption-box {
    text-align: left;
    padding: 0 30px 30px;
    margin-bottom: 0;
}

.news-block.style-three .caption-box .category {
    display: flex;
    flex-wrap: wrap;
}

.blog-classic .news-block.style-three .caption-box .category {
    float: left;
    margin-right: 25px;
}

.news-block.style-three .caption-box .category li:not(:last-child) {
    position: relative;
    margin-right: 6px;
}

.news-block.style-three .caption-box .category li a {
    font-weight: 600;
    color: var(--secondary);
}

.news-block.style-three .caption-box .category li a:after {
    content: ",";
}

.news-block.style-three .caption-box .category li:last-child a:after {
    display: none;
}

.news-block.style-three .caption-box h4 {
    margin-bottom: 25px;
}

.blog-modren .news-block .inner-box {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.blog-modren .news-block .inner-box .image-box {
    width: calc(45% - 0px);
}

.blog-modren .news-block .inner-box .caption-box {
    width: calc(55% - 0px);
    padding: 20px 30px 20px;
}

.blog-modren .news-block .inner-box .image-box img {
    border-radius: 15px 0 0 15px;
}

.blog-modren .news-block .inner-box .caption-box h4 {
    margin-bottom: 10px;
}

.blog-modren .news-block .inner-box .caption-box .theme-btn {
    padding: 8px 25px;
}

.blog-modren .news-block .inner-box .image-box .image {
    margin-bottom: 0;
}

/*** 

====================================================================
		Blog Section
====================================================================

***/

.blog-section {
    position: relative;
    padding: 100px 0;
}

.blog-section .styled-pagination {
    margin-top: 20px;
}

.blog-classic .news-block-two .caption-box .inner {
    padding: 30px 35px 30px;
    z-index: 99;
}

.blog-classic .news-block-two .caption-box h3 {
    font-size: var(--font-24);
    margin-bottom: 15px;
}

.blog-classic .news-block-two .caption-box p {
    margin-top: 15px;
}

.news-block-two .single-item-carousel {
    position: relative;
}

.news-block-two .image-box .owl-nav {
    position: absolute;
    left: 0;
    width: 100%;
    top: 50%;
    margin-top: -60px;
}

.news-block-two .image-box .owl-nav .owl-next,
.news-block-two .image-box .owl-nav .owl-prev {
    position: absolute;
    left: 0;
    top: 0;
    width: 30px;
    height: 120px;
    text-align: center;
    line-height: 120px;
    font-size: 22px;
    color: var(--black);
    font-weight: 400;
    background-color: rgba(255, 255, 255, .70);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.news-block-two .image-box .owl-nav .owl-next {
    left: auto;
    right: 0;
}

.news-block-two .image-box .owl-nav .owl-next:hover,
.news-block-two .image-box .owl-nav .owl-prev:hover {
    background-color: rgba(0, 0, 0, .70);
    color: var(--white);
}

.news-block-two .blockquote h2 {
    position: relative;
    display: block;
    font-size: 50px;
    line-height: 1.2em;
    color: var(--darkgrey);
    font-weight: 400;
    letter-spacing: -0.04em;
}

.news-block-two .blockquote h2 span {
    color: var(--main-color);
    text-transform: uppercase;
}

.news-block-two .blockquote .author {
    position: absolute;
    right: 0px;
    bottom: 70px;
    line-height: 25px;
    color: var(--white);
    font-size: 14px;
    background-color: var(--darkgrey);
    padding: 0 15px;
}

.news-block-two .image-box .link {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    text-align: center;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.news-block-two .image-box .link:hover {
    background-color: rgba(0, 0, 0, 0.50);
}

.news-block-two .image-box .link .icon {
    position: absolute;
    left: 50%;
    top: 50%;
    height: 60px;
    width: 60px;
    background-color: rgba(0, 0, 0, 0.65);
    padding-left: 4px;
    font-size: var(--font-18);
    color: var(--white);
    border: 1px solid var(--white);
    border-radius: 50%;
    text-align: center;
    line-height: 60px;
    margin-top: -30px;
    margin-left: -30px;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.news-block-two .image-box .link:hover .icon {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
}

/*** 

====================================================================
		Blog Detail
====================================================================

***/

.blog-detail .news-block.style-three .caption-box .info {
    margin-bottom: 15px;
}

.blog-detail .news-block.style-three .caption-box h3 {
    font-size: var(--font-24);
    margin-bottom: 15px;
}

.blog-detail .news-block.style-three .caption-box p {
    position: relative;
    font-size: 14px;
    line-height: 30px;
    font-weight: 400;
    margin-bottom: 30px;
}

.blog-detail .news-block.style-three .caption-box blockquote {
    margin: 0 0 1rem;
    position: relative;
    padding: 20px 20px 20px 40px;
    color: var(--darkgrey);
    font-size: var(--font-18);
    font-weight: 700;
}

.blog-detail .news-block.style-three .caption-box blockquote:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 4px;
    height: 100%;
    background-color: var(--main-color);
}

.blog-detail .tag-share {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

.blog-detail .tag-share .tags {
    width: calc(50% - 0px);
    display: flex;
}

.blog-detail .tag-share .tags .title {
    position: relative;
    color: var(--darkgrey);
    font-weight: 700;
    padding: 0;
    margin-right: 10px;
    margin-bottom: 10px;
    font-size: var(--font-20);
}

.blog-detail .tag-share .tags ul li {
    position: relative;
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
}

.blog-detail .tag-share .tags ul li:before {
    content: ",";
    position: absolute;
    right: -4px;
    color: var(--darkgrey);
}

.blog-detail .tag-share .tags ul li:last-child:before {
    display: none;
}

.blog-detail .tag-share .tags ul li a {
    position: relative;
    display: block;
    color: var(--darkgrey);
    font-weight: 700;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.blog-detail .tag-share .tags ul li a:hover {
    color: var(--secondary);
}

.blog-detail .tag-share .share-option {
    position: relative;
    display: flex;
    width: calc(50% - 0px);
    justify-content: flex-end;
}

.blog-detail .tag-share .share-option .title {
    position: relative;
    color: var(--darkgrey);
    font-weight: 700;
    margin-right: 10px;
    margin-bottom: 10px;
    font-size: var(--font-20);
}

.authors-box {
    position: relative;
    margin: 50px 0px 50px 74px;
}

.authors-box .author-inner {
    display: flex;
    flex-wrap: wrap;
    border: 1px solid rgba(var(--black-opicity), 0.1);
    border-radius: 25px;
    align-items: center;
}

.authors-box .author-inner .thumb {
    position: absolute;
    left: -75px;
}

.authors-box .author-inner .thumb img {
    width: 220px;
    height: 220px;
    border-radius: 50%;
}

.authors-box .author-inner .text-box {
    width: calc(100% - 0px);
    padding: 30px 30px 30px 170px;
    position: relative;
}

.authors-box .author-inner .text-box .name {
    color: var(--darkgrey);
    font-weight: 700;
    margin-bottom: 16px;
}

.authors-box .author-inner .text-box p {
    margin-bottom: 16px;
}

.social-icon {
    position: relative;
}

.social-icon li {
    position: relative;
    float: left;
    margin-right: 6px;
    margin-bottom: 10px;
}

.social-icon li a {
    position: relative;
    display: block;
    color: var(--grey);
    font-weight: 500;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
    width: 30px;
    height: 30px;
    text-align: center;
    border: 1px solid rgba(var(--black-opicity), 0.1);
    border-radius: 50%;
}

.social-icon li a:hover {
    background-color: var(--secondary);
    border-color: var(--secondary);
    color: var(--white);
}

.blog-detail h3 {
    margin-bottom: 30px;
    font-weight: 700;
    color: var(--darkgrey);
}

.releted-post .news-block {
    margin: 0 0 30px;
}

/***

====================================================================
		Clients Section
====================================================================

***/

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

.clients-section .sponsors-outer {
    position: relative;
    padding: 40px 40px 30px 40px;
    -webkit-box-shadow: 0 0 21px rgb(0 0 0 / 30%);
    -moz-box-shadow: 0 0 21px rgba(0, 0, 0, 0.30);
    -ms-box-shadow: 0 0 21px rgba(0, 0, 0, 0.30);
    -o-box-shadow: 0 0 21px rgba(0, 0, 0, 0.30);
    box-shadow: 0 0 21px rgb(0 0 0 / 30%);
    border-radius: 20px;
    background-color: var(--white);
}

.clients-section .sponsors-outer:before {
    content: "";
    position: absolute;
    left: -162px;
    top: -121px;
    width: 280px;
    height: 265px;
    background-image: url(../images/resource/shape.png);
    z-index: -1;
}

.clients-section .slide-item {
    position: relative;
    padding: 0;
}

.clients-section .image-box {
    position: relative;
    margin: 0;
    text-align: center;
}

.clients-section .image-box img {
    display: inline-block;
    max-width: 100%;
    width: auto;
    height: auto;
}

.clients-section .sponsors-carousel .owl-dots,
.clients-section .sponsors-carousel .owl-nav {
    display: none;
}

.clients-section.style-two {
    background-color: var(--white);
    padding: 45px 0 120px;
    background-repeat: no-repeat;
    background-position: bottom center;
}

.clients-section.style-two .sponsors-outer:before {
    display: none;
}

.clients-section.style-two .sponsors-outer {
    padding: 0 100px;
    box-shadow: none;
    background-color: transparent;
}

.clients-section.style-two .slide-item {
    position: relative;
    padding: 0 0px;
}

.clients-section.style-three {
    background-color: var(--white);
    padding: 150px 0 70px;
    background-repeat: no-repeat;
    background-position: top center;
}

.clients-section.style-three .sponsors-outer:before {
    display: none;
}

.clients-section.style-three .sponsors-outer {
    padding: 0 100px;
    box-shadow: none;
    background-color: transparent;
}

.clients-section.style-three .slide-item {
    position: relative;
    padding: 0 0;
}

/***

==================================================================
		Contact Section
==================================================================

***/

.contact-section {
    position: relative;
}

.contact-section.altrenate {
    padding: 77px 0 250px;
}

.contact-section:before {
    content: "";
    position: absolute;
    left: 0;
    top: -57px;
    width: 100%;
    height: 775px;
    background-image: url(../images/background/19.png);
    background-repeat: no-repeat;
    background-position: top left;
    background-size: contain;
}

.contact-section .contact-form {
    position: relative;
}

.contact-form .form-group {
    position: relative;
    margin-bottom: 30px;
}

.contact-form .form-group input[type="text"],
.contact-form .form-group input[type="email"],
.contact-form .form-group input[type="url"],
.contact-form .form-group textarea,
.contact-form .form-group select {
    position: relative;
    display: block;
    width: 100%;
    line-height: 19px;
    padding: 20px;
    background-color: var(--white);
    font-weight: 400;
    height: 60px;
    border: 1px solid rgba(var(--black-opicity), 0.1);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
    border-radius: 38px;
}

.contact-form .form-group input:focus,
.contact-form .form-group select:focus,
.contact-form .form-group textarea:focus {
    border-color: transparent;
    box-shadow: 0 0 24px rgba(var(--black-opicity), 0.1);
}

.contact-form .form-group textarea {
    height: 160px;
    resize: none;
    border-radius: 20px;
}

.contact-form .form-group button {
    padding: 15px 50px;
    line-height: 20px;
    text-transform: uppercase;
}

.contact-form .form-group label.error {
    color: var(--main-color);
}

#InquiryForm2 label.error {
    color: var(--main-color) !important;
}

.contact-section .image-column .image-box .image {
    position: relative;
}

.contact-section .image-column .image-box .image:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 530px;
    height: 590px;
    background-repeat: no-repeat;
    background-size: 100%;
    background-image: url('../images/resource/contact-2.png');
    z-index: -1;
}

/*** 

====================================================================
  Newsletter Section
====================================================================

***/

.newsletter-section {
    position: relative;
}

.newsletter-section.margin-bottom {
    margin-bottom: -150px;
    z-index: 2;
}

.newsletter-section .inner-container {
    position: relative;
    padding: 55px 60px 40px;
    border-radius: 10px;
    background-repeat: no-repeat;
}

.newsletter-section .inner-container .inner-column h2 {
    color: var(--white);
    font-weight: 700;
    margin-bottom: 36px;
}

.newsletter-section .title-column {
    position: relative;
}

.emailed-form .form-group {
    position: relative;
    margin: 0 auto;
    width: 100%;
    margin-bottom: 20px;
    display: flex;
    background-color: var(--white);
    border: 1px solid rgba(var(--black-opicity), 0.1);
    padding: 1px 25px;
    border-radius: 39px;
}

.emailed-form .form-group:before {
    content: "";
    position: absolute;
    left: 48%;
    top: 10px;
    width: 1px;
    height: 66%;
    background-color: var(--lightgrey);
    z-index: 999;
}

.emailed-form .form-group input[type="text"],
.emailed-form .form-group input[type="tel"],
.emailed-form .form-group input[type="email"],
.emailed-form .form-group input[type="url"],
.emailed-form .form-group textarea {
    position: relative;
    display: block;
    width: 100%;
    line-height: 19px;
    padding: 20px;
    background-color: var(--white);
    font-weight: 400;
    height: 60px;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
    border-radius: 38px;
}

.emailed-form .form-group input[type="submit"],
.emailed-form button {
    position: absolute;
    right: 5px;
    top: 5px;
    letter-spacing: 1px;
    text-transform: capitalize;
    overflow: hidden;
}

/***

==================================================================
		Main Footer
==================================================================

***/

.main-footer {
    position: relative;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.main-footer .widgets-section {
    position: relative;
    padding: 148px 0 41px;
    margin-top: -100px;
}

.main-footer.alternate .widgets-section {
    margin-top: 0;
    padding-top: 95px;
}

.main-footer .footer-column {
    position: relative;
}

.main-footer .footer-widget {
    position: relative;
    margin-bottom: 40px;
}

.main-footer .footer-column .widget-content p {
    color: var(--white);
}

.main-footer .footer-column .widget-title {
    position: relative;
    font-weight: 700;
    color: var(--white);
    line-height: 30px;
    /*padding-left: 0;*/
    margin-bottom: 23px;
}

.main-footer .about-widget {
    position: relative;
    padding-right: 20px;
}

.main-footer .footer-logo {
    position: relative;
    margin-bottom: 15px;
}

.main-footer .footer-logo figure {
    margin: 0;
    margin-top: -20px;
}

.main-footer .footer-logo img {
    display: block;
    max-width: 100%;
}

.main-footer .about-widget p {
    position: relative;
    line-height: 30px;
    color: var(--white);
    font-weight: 400;
}

/*Recent Posts*/

.recent-posts {
    position: relative;
}

.recent-posts .post {
    position: relative;
    min-height: 70px;
    padding-left: 105px;
    margin-bottom: 30px;
}

.recent-posts .post .thumb {
    position: absolute;
    left: 0;
    top: 0;
    height: 70px;
    width: 80px;
    overflow: hidden;
}

.recent-posts .post .thumb a {
    display: block;
}

.recent-posts .post .thumb img {
    display: block;
    width: 100%;
    height: auto;
}

.recent-posts .post h4 {
    position: relative;
    font-size: var(--font-18);
    line-height: 24px;
    font-weight: 400;
    margin-bottom: 3px;
}

.recent-posts .post h4 a {
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.recent-posts .post h4 a:hover {
    color: var(--main-color);
}

.recent-posts .post .info {
    position: relative;
    display: block;
}

.recent-posts .post .info li {
    position: relative;
    display: inline-block;
    font-size: 12px;
    line-height: 20px;
    font-weight: 400;
    padding-right: 3px;
    margin-right: 3px;
}

.recent-posts .post .info li:before {
    position: absolute;
    right: -4px;
    top: 0;
    font-size: 12px;
    line-height: 20px;
    font-weight: 400;
    content: "/";
}

.recent-posts .post .info li:last-child:before {
    display: none;
}

/*=== links Widget ===*/

.main-footer .links-widget {
    position: relative;
}

.main-footer .links-widget .widget-content {
    display: flex;
    flex-wrap: wrap;
}

.main-footer .links-widget .widget-content .list {
    width: calc(50% - 0px);
}

.main-footer .links-widget .list li {
    position: relative;
    display: block;
    padding-left: 30px;
    margin-bottom: 16px;
}

.main-footer .links-widget .list li:before {
    position: absolute;
    left: 0;
    top: 0;
    height: 20px;
    font-size: 14px;
    line-height: 20px;
    color: var(--white);
    font-weight: 900;
    content: "\f101";
    font-family: "Font Awesome 5 Free";
}

.main-footer .links-widget .list li a {
    position: relative;
    display: block;
    line-height: 20px;
    font-weight: 400;
    color: var(--white);
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}

.main-footer .links-widget .list li:hover:before,
.main-footer .links-widget .list li a:hover {
    color: var(--main-color);
}

.main-footer .gallery-widget {
    position: relative;
}

.main-footer .gallery-widget .outer {
    position: relative;
    margin: 0px -7px 0;
}

.main-footer .gallery-widget .outer .image {
    position: relative;
    float: left;
    width: 33.3333%;
    padding: 0px 7px;
    margin-bottom: 14px;
}

.main-footer .gallery-widget .image img {
    display: block;
    width: 100%;
}

.main-footer .gallery-widget .image a {
    position: relative;
    display: block;
}

.main-footer .gallery-widget .image a:before {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background: var(--main-color) padding-box content-box;
    padding: 5px;
    opacity: .80;
    content: "";
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.main-footer .gallery-widget .image a:hover:before {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.main-footer .gallery-widget .image a:after {
    position: absolute;
    height: 20px;
    width: 20px;
    left: 50%;
    top: 50%;
    margin-left: -10px;
    margin-top: -10px;
    content: "\f0b2";
    text-align: center;
    line-height: 20px;
    font-size: 14px;
    color: var(--black);
    font-family: "Font Awesome 5 Free";
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
    font-weight: 900;
}

.main-footer .gallery-widget .image a:hover:after {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

/*=== Footer Bottom ===*/

.main-footer .footer-bottom {
    position: relative;
}

.main-footer .footer-bottom .inner-container {
    position: relative;
    border-top: 1px solid rgba(var(--white-opicity), 0.5);
}

.main-footer .footer-bottom .copyright-text {
    position: relative;
    float: left;
    padding: 20px 0;
}

.main-footer .footer-bottom .copyright-text p {
    position: relative;
    color: var(--white);
}

.main-footer .footer-bottom .copyright-text a {
    color: var(--white);
    font-weight: 700;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.main-footer .footer-bottom .copyright-text a:hover {
    text-decoration: underline;
}

.main-footer .footer-bottom .social-links {
    position: relative;
    float: right;
    padding: 20px 0;
}

.copyright-text p a {
    text-decoration: none !important;
    font-weight: normal !important;
}

.copyright-text p a:hover {
    text-decoration: none !important;
    color: #FF8A00 !important;
}

.social-icon-two {
    position: relative;
    display: flex;
}

.social-icon-two li {
    position: relative;
}

.social-icon-two li a {
    position: relative;
    display: block;
    color: var(--white);
    font-weight: 400;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
    line-height: 32px;
    width: 35px;
    height: 35px;
    border: 1px solid var(--white);
    border-radius: 50%;
    margin-left: 10px;
    text-align: center;
}

.social-icon-two li a:hover {
    color: var(--white);
    background-color: var(--main-color);
    border-color: var(--main-color);
}

/***

==================================================================
      Footer Style Two
==================================================================

***/

.main-footer.style-two {
    position: relative;
}

.main-footer.style-two:after {
    content: "";
    position: absolute;
    left: 0;
    top: -367px;
    z-index: -1;
    width: 100%;
    height: 700px;
    background-image: url('../images/background/15.png');
    background-repeat: no-repeat;
    background-size: contain;
}

.main-footer.style-two .links-widget .list li:hover:before,
.main-footer.style-two .links-widget .list li a:hover {
    color: var(--secondary);
}

.main-footer.style-two .widgets-section {
    padding: 260px 0 60px;
    margin-top: 0;
}

/***

==================================================================
			Main Footer Style Three
==================================================================

***/

.main-footer.style-three {
    background-position: top center;
}

.main-footer.style-three .widgets-section {
    margin: 0;
    padding: 125px 0 60px;
}

.widgets-section .newslatter-column .inner-column {
    margin-bottom: 60px;
    padding-bottom: 60px;
    border-bottom: 1px solid rgba(var(--white-opicity), 0.5);
}

.widgets-section .newslatter-form {
    position: relative;
    margin-top: 31px;
}

.widgets-section .newslatter-form form .form-group {
    position: relative;
}

.widgets-section .newslatter-form form .form-group input[type="text"] {
    position: relative;
    display: block;
    width: 100%;
    line-height: 19px;
    padding: 20px;
    background-color: var(--white);
    font-weight: 400;
    height: 60px;
    border: 1px solid rgba(var(--black-opicity), 0.1);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
    border-radius: 38px;
}

.widgets-section .newslatter-form form .form-group input[type="text"]:focus {
    border-color: transparent;
    box-shadow: 0 0 24px rgba(var(--black-opicity), 0.1);
}

.widgets-section .newslatter-form form .form-group button {
    position: absolute;
    right: 5px;
    top: 4px;
}

.contact-box-footer {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    margin-top: 30px;
}

.contact-box-footer .content-block {
    display: flex;
    width: calc(100% / 2);
}

.contact-box-footer .content-block .icon-box {
    width: calc(30% - 0px);
}

.contact-box-footer .content-block .icon-box i {
    color: var(--white);
    font-size: var(--font-60);
}

.contact-box-footer .content-block .text-box {
    width: calc(70% - 0px);
}

.contact-box-footer .content-block .text-box p,
.contact-box-footer .content-block .text-box a {
    color: var(--white);
}

.widget-content .social-icon-two {
    margin-top: 25px;
}

.widget-content .social-icon-two li a {
    margin-left: 0;
    margin-right: 10px;
}

.widget-content .social-icon-two li a:hover {
    background-color: var(--white);
    border-color: var(--white);
    color: var(--secondary);
}

.main-footer .links-widget .widget-content .list.style-two {
    width: calc(100% - 0px);
}

.main-footer .links-widget .widget-content .list.style-two li::before,
.main-footer.style-three .links-widget .list li:before {
    content: "\f141";
}

.main-footer .footer-widget .recent-block {
    margin-bottom: 20px;
}

.main-footer .footer-widget .recent-block h6 {
    font-weight: 700;
    margin-bottom: 13px;
}

.main-footer .footer-widget .recent-block a {
    color: var(--white);
}

.main-footer .footer-widget .recent-block .info {
    display: flex;
    flex-wrap: wrap;
}

.main-footer .footer-widget .recent-block .info li {
    color: var(--white);
    margin-right: 14px;
}

.main-footer .footer-widget .recent-block .info li:last-child {
    margin-right: 0;
}

.main-footer.style-three .footer-bottom {
    padding-bottom: 25px;
}

.main-footer.style-three .footer-bottom .inner-container {
    border: none;
}

.main-footer.style-three .footer-bottom .inner-container .copyright-text {
    background-color: var(--white);
    border-radius: 51px;
    padding: 12px 37px;
    text-align: left;
    position: relative;
    float: none;
    z-index: 1;
    width: 50%;
    margin: 0 auto;
}

.main-footer.style-three .footer-bottom .inner-container .copyright-text p {
    color: var(--darkgrey);
}

.main-footer.style-three .footer-bottom .inner-container .copyright-text p a {
    color: var(--main-color);
}

/***

==================================================================
			Sidebar Page Container
==================================================================

***/

.sidebar-page-container {
    position: relative;
    overflow: hidden;
    padding: 44px 0 250px;
}

.sidebar-page-container .sidebar-side,
.sidebar-page-container .content-side {
    position: relative;
    margin-bottom: 50px;
}

.sidebar-widget {
    position: relative;
    margin-bottom: 55px;
}

.sidebar-side .sidebar-widget:last-child {
    margin-bottom: 0;
}

.sidebar-page-container .sidebar-title {
    position: relative;
    margin-bottom: 25px;
}

.sidebar-page-container .sidebar-title h3 {
    position: relative;
    display: inline-block;
    font-size: var(--font-24);
    line-height: 1.2em;
    color: var(--darkgrey);
    font-weight: 700;
    text-transform: capitalize;
}

/*Search Box Widget*/

.sidebar .search-box {
    position: relative;
}

.sidebar .search-box .form-group {
    position: relative;
    margin: 0px;
}

.sidebar .search-box .form-group input[type="text"],
.sidebar .search-box .form-group input[type="search"] {
    position: relative;
    display: block;
    font-size: 14px;
    color: var(--grey);
    line-height: 28px;
    padding: 15px 25px;
    height: 60px;
    width: 100%;
    border: 1px solid rgba(var(--black-opicity), 0.1);
    background-color: var(--white);
    border-radius: 60px;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
}

.sidebar .search-box .form-group input:focus {
    border-color: var(--main-color);
}

.sidebar .search-box .form-group input[type="submit"],
.sidebar .search-box .form-group button {
    position: absolute;
    right: 0;
    top: 0;
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    display: block;
    font-size: var(--font-18);
    background-color: var(--secondary);
    color: var(--white);
    font-weight: normal;
    border-radius: 0 30px 30px 0;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.sidebar .search-box .form-group input[type="submit"]:hover,
.sidebar .search-box .form-group button:hover {
    background-color: var(--main-color);
    color: var(--white);
}

/*=== Categories ===*/

.cat-list {
    position: relative;
    border: 1px solid rgba(var(--black-opicity), 0.1);
    border-radius: 10px;
}

.cat-list li {
    position: relative;
    margin-left: -1px border-left: 7px solid transparent;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.cat-list li a {
    position: relative;
    line-height: 20px;
    padding: 20px 30px;
    display: block;
    border-bottom: 1px solid rgba(var(--black-opicity), 0.1);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
    color: var(--grey);
}

.cat-list li a i {
    margin-right: 15px;
}

.cat-list li a span {
    float: right;
    font-size: var(--font-16);
    line-height: 20px;
}

.cat-list li:last-child a {
    border-bottom: 0;
}

.cat-list li.active a,
.cat-list li:hover a {
    color: var(--secondary);
    background-color: var(--bg-grey);
}

.cat-list li.active a span,
.cat-list li:hover a span {
    color: var(--secondary);
}

/*=== Latest News ===*/

.latest-news .post {
    position: relative;
    padding-left: 120px;
    margin-bottom: 40px;
    min-height: 90px;
}

.latest-news .post-thumb {
    position: absolute;
    left: 0;
    top: 0;
    height: 90px;
    width: 90px;
    margin-bottom: 20px;
}

.latest-news .post-thumb img {
    position: relative;
    display: block;
    width: 100%;
    border-radius: 10px;
}

.latest-news .post h3 {
    position: relative;
    font-size: var(--font-18);
    line-height: 30px;
    color: var(--darkgrey);
    font-weight: 700;
    margin-bottom: 10px;
}

.latest-news .post h3 a {
    color: var(--darkgrey);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.latest-news .post:hover h3 a {
    color: var(--secondary);
}

.latest-news .post .post-info {
    position: relative;
    font-weight: 400;
}

/*=== Instagram widget ===*/

.instagram-widget .widget-content {
    display: flex;
    flex-wrap: wrap;
}

.instagram-widget .post-thumb {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    margin: 0px 15px 18px 0;
    width: calc(87% / 3);
}

.instagram-widget .post-thumb img {
    width: 100%;
}

.instagram-widget .post-thumb .overlay-box {
    position: absolute;
    content: '';
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    display: block;
    color: var(--white);
    opacity: 0;
    text-align: center;
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    background-color: rgba(var(--secondary-opicity), 0.70);
}

.instagram-widget .post-thumb:hover .overlay-box {
    opacity: 1;
}

.instagram-widget .post-thumb .overlay-box .fa {
    top: 50%;
    position: relative;
    margin-top: -12px;
    display: block;
}

/*=== Tags ===*/

.tag-list {
    position: relative;
    display: block;
}

.tag-list li {
    position: relative;
    float: left;
    margin-bottom: 13px;
    margin-right: 10px;
}

.tag-list li a {
    position: relative;
    display: block;
    padding: 10px 25px;
    font-weight: 400;
    text-align: center;
    border-radius: 50px;
    color: var(--grey);
    border: 1px solid rgba(var(--black-opicity), 0.1);
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.tag-list li a:hover {
    background-color: var(--secondary);
    color: var(--white);
}

/*** 

====================================================================
		Comment Area
====================================================================

 ***/

.group-title {
    position: relative;
    margin-bottom: 45px;
}

.group-title h2 {
    position: relative;
    display: block;
    font-size: var(--font-30);
    line-height: 1.2em;
    color: var(--darkgrey);
    font-weight: 500;
}

.comments-area {
    position: relative;
    margin-bottom: 70px;
}

.comments-area .comment-box {
    position: relative;
    margin-bottom: 56px;
}

.comments-area .comment-box.reply-comment {
    margin-right: 100px;
}

.comments-area .comment-box.reply-comment.reply {
    margin-right: 200px;
}

.comments-area .comment-box:last-child {
    margin-bottom: 0;
}

.comments-area .comment {
    position: relative;
    min-height: 80px;
    padding-top: 10px;
    padding-right: 200px;
}

.comments-area .comment-box .author-thumb {
    position: absolute;
    right: 0px;
    top: 0px;
    height: 120px;
    width: 120px;
    overflow: hidden;
    border-radius: 15px;
}

.comments-area.style-two .author-thumb {
    width: 80px;
    height: 80px;
}

.comments-area .comment-box .author-thumb img {
    width: 100%;
    display: block;
}

.comments-area .comment-info {
    position: relative;
    display: block;
}

.comments-area .comment-box .name {
    position: relative;
    float: left;
    font-size: var(--font-18);
    line-height: 1.2em;
    font-weight: 700;
    color: var(--secondary);
    margin-bottom: 7px;
    margin-right: 25px;
}

.comments-area .comment-box .date {
    position: relative;
    display: block;
    font-size: var(--font-14);
    line-height: 24px;
    font-weight: 400;
}

.comments-area .comment-box p {
    display: block;
    width: 100%;
    clear: both;
    font-weight: 400;
}

.comments-area .comment-box .rating {
    position: relative;
    display: block;
    font-size: var(--font-14);
    color: var(--secondary);
    line-height: 20px;
}

.comments-area .comment-box .reply-btn {
    position: absolute;
    right: 143px;
    top: 8px;
    font-size: 15px;
    line-height: 25px;
    color: var(--main-color);
    font-weight: 500;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.comments-area .comment-box .reply-btn:hover {
    color: var(--darkgrey);
}

/*** 

====================================================================
		Comment Form
====================================================================

 ***/

.comment-form {
    position: relative;
}

.comment-form .group-title {
    margin-bottom: 30px;
}

.comment-form .form-group {
    position: relative;
    margin-bottom: 20px;
}

.comment-form .form-group:last-child {
    margin-bottom: 0;
}

.comment-form .form-group input[type="text"],
.comment-form .form-group input[type="email"],
.comment-form .form-group input[type="url"],
.comment-form .form-group textarea,
.comment-form .form-group select {
    position: relative;
    display: block;
    height: 50px;
    width: 100%;
    line-height: 20px;
    font-weight: 400;
    padding: 10px 22px;
    border-radius: 35px;
    background-color: var(--white);
    border: 1px solid rgba(var(--black-opicity), 0.1);
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    transition: all 300ms ease;
}

.comment-form .form-group input:focus,
.comment-form .form-group select:focus,
.comment-form .form-group textarea:focus {
    border-color: var(--main-color);
}

.comment-form .form-group textarea {
    height: 120px;
    resize: none;
    border-radius: 20px;
}

/*** 

====================================================================
		Contact Page Section
====================================================================

***/

.contact-page-section {
    position: relative;
    padding-bottom: 250px;
}

.contact-page-section .form-column {
    position: relative;
}

.contact-page-section .form-column .inner-column {
    position: relative;
    padding: 46px 0 0;
}

.contact-page-section .sec-title {
    margin-bottom: 30px;
}

.contact-page-section .contact-form {
    margin-bottom: 50px;
}

.contact-page-section .contact-info {
    position: relative;
    padding: 100px 0 0;
}

.contact-page-section .contact-info .info-block .inner .icon-box {
    width: calc(20% - 0px);
}

.contact-page-section .contact-info .info-block .inner .text-box {
    width: calc(80% - 0px);
    padding-left: 15px;
}

.contact-page-section .contact-info .info-block {
    position: relative;
    display: block;
    margin-bottom: 40px;
}

.contact-page-section .contact-info .info-block .inner {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.contact-page-section .contact-info .info-block h4 {
    position: relative;
    display: block;
    line-height: 1.2em;
    font-weight: 700;
    margin-bottom: 10px;
    color: var(--darkgrey);
}

.contact-page-section .contact-info .info-block .inner .icon-box i {
    font-size: var(--font-60);
    color: var(--secondary);
}

.contact-page-section .contact-info .info-block p {
    position: relative;
    display: block;
}

.contact-page-section .contact-info .info-block p a {
    color: var(--grey);
    display: inline-block;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.contact-page-section .contact-info .info-block p a:hover {
    color: var(--main-color);
}

/*== Map Column ===*/

.contact-page-section .map-column .inner-column {
    position: relative;
    height: 800px;
    width: 100%;
}

.contact-page-section .map-column .map-outer {
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: var(--darkgrey);
}

.contact-page-section .map-column .map-canvas {
    position: absolute;
    height: 100%;
    width: 100%;
}

/*** 

====================================================================
	Services Sidebar
====================================================================

***/

.services-sidebar {
    position: relative;
}

.services-sidebar .sidebar-widget {
    margin-bottom: 50px;
}

.services-sidebar .sidebar-title {
    position: relative;
    display: block;
    font-size: var(--font-24);
    line-height: 1.2em;
    color: var(--darkgrey);
    font-weight: 500;
    margin-bottom: 30px;
}

/*Blog Category*/

.blog-cat {
    position: relative;
    border-radius: 10px;
    border: 1px solid rgba(var(--black-opicity), 0.1);
}

.blog-cat li {
    position: relative;
}

.blog-cat li a {
    position: relative;
    font-weight: 700;
    line-height: 30px;
    color: var(--darkgrey);
    display: block;
    border-bottom: 1px solid rgba(var(--black-opicity), 0.1);
    border-left: 5px solid transparent;
    padding: 20px 40px 19px;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    font-family: var(--font-family-Niramit);
    border-radius: 10px;
}

.blog-cat li:last-child a {
    border-bottom: none;
}

.blog-cat li a:before {
    position: absolute;
    right: 33px;
    top: 20px;
    color: var(--darkgrey);
    font-size: var(--font-18);
    line-height: 30px;
    content: "\f101";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
}

.blog-cat li.active a,
.blog-cat li a:hover {
    color: var(--white);
    background-color: var(--secondary);
    border-left: 5px solid var(--main-color);
}

.blog-cat li a:hover:before,
.blog-cat li.active a:before {
    color: var(--white);
}

/*Brochure Box*/

.brochure-box {
    position: relative;
    padding: 13px 25px;
    background-color: var(--main-color);
    margin-bottom: 15px;
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    border-radius: 35px;
}

.brochure-box:hover {
    background-color: var(--secondary);
}

.brochure-box .inner {
    position: relative;
}

.brochure-box .overlay-link {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    display: block;
}

.brochure-box .inner .icon {
    position: absolute;
    right: 0px;
    top: 0px;
    color: var(--white);
    font-size: var(--font-16);
    line-height: 30px;
    font-weight: 900;
    transition: all 300ms ease;
}

.brochure-box .inner p {
    position: relative;
    font-size: var(--font-16);
    font-weight: 400;
    line-height: 30px;
    color: var(--darkgrey);
    font-family: var(--font-family-Niramit);
    transition: all 300ms ease;
}

.brochure-box:hover {
    border-color: var(--secondary);
    background-color: var(--secondary);
}

.brochure-box:hover .inner .icon,
.brochure-box:hover .inner p {
    color: var(--white);
}

/*Help Box*/

.help-box {
    position: relative;
    background-color: var(--bg-grey);
    margin-bottom: 50px;
}

.help-box .inner {
    position: relative;
    padding: 45px 45px;
}

.help-box .inner .title {
    position: relative;
    display: block;
    font-size: 14px;
    line-height: 24px;
    font-weight: 400;
    margin-bottom: 20px;
}

.help-box .inner h2 {
    position: relative;
    font-size: var(--font-24);
    font-weight: 700;
    line-height: 1.2em;
    color: var(--darkgrey);
    text-transform: uppercase;
    margin-bottom: 30px;
}

.help-box .inner .theme-btn {
    background-color: transparent;
    border: 1px solid var(--white);
    padding: 10px 35px;
    line-height: 20px;
    color: var(--white);
}

.help-box .inner .list-style-one li {
    color: var(--darkgrey);
}

.brochure-box .inner p {
    color: var(--white);
}

/*** 

====================================================================
	Contact Info Section
====================================================================

***/

.contact-info-section {
    position: relative;
    padding: 50px 0px 160px;
}

.contact-info-section.alternate {
    padding: 50px 0px 74px;
}

.contact-info-section .inner-container {
    position: relative;
    z-index: 1;
    background-repeat: no-repeat;
    background-size: 100%;
    padding: 65px 60px 65px;
    display: flex;
    flex-wrap: wrap;
}

.contact-info-section .inner-container .text-box {
    width: calc(70% - 0px);
}

.contact-info-section .inner-container .text-box h2 {
    font-weight: 700;
}

.contact-info-section .inner-container .text-box h2,
.contact-info-section .inner-container .text-box p {
    color: var(--white);
}

.contact-info-section .inner-container .contect-box {
    width: calc(30% - 0px);
    text-align: right;
    margin-top: 15px;
}

/*** 

====================================================================
			Coming Soon
====================================================================

***/

.coming-soon {
    position: fixed;
    width: 100%;
    height: 100%;
    display: block;
    overflow-y: auto;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.coming-soon .background {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 1;
}

.coming-soon .overlay {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 2;
}

.coming-soon .content {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    display: flex;
    z-index: 99;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.coming-soon .content .content-inner {
    position: relative;
    padding: 100px 15px;
}

.coming-soon .content .content-inner .logo {
    position: relative;
    margin-bottom: 30px;
}

.coming-soon .content .content-inner h2 {
    position: relative;
    color: var(--white);
    font-weight: 600;
    line-height: 1.2em;
    margin-bottom: 30px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.coming-soon .content .emailed-form .form-group::before {
    display: none;
}

.coming-soon .content .emailed-form .form-group input[type="email"] {
    padding: 20px;
}

.coming-soon .content .content-inner p {
    position: relative;
    color: var(--white);
    font-size: var(--font-20);
    font-weight: 400;
    line-height: 1.6em;
    margin-top: 0px;
    margin-bottom: 60px;
}

.time-counter {
    position: relative;
}

.time-counter .time-countdown {
    position: relative;
}

.time-counter .time-countdown .counter-column {
    position: relative;
    margin: 0px 15px 0px;
    width: 200px;
    height: 200px;
    text-align: center;
    display: inline-block;
    color: var(--main-color);
    font-size: var(--font-20);
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 60px;
    background-color: rgba(var(--secondary-opicity), 0.5);
}

.time-counter .time-countdown .counter-column .count {
    position: relative;
    display: block;
    font-size: 80px;
    line-height: 40px;
    padding: 60px 0px 30px;
    color: var(--white);
    letter-spacing: 1px;
    font-weight: 700;
}

.coming-soon .emailed-form .form-group {
    position: relative;
    display: block;
    max-width: 770px;
    margin: 0 auto;
    width: 100%;
    margin-bottom: 20px;
}

.coming-soon .emailed-form .form-group input[type="text"],
.coming-soon .emailed-form .form-group input[type="tel"],
.coming-soon .emailed-form .form-group input[type="email"],
.coming-soon .emailed-form .form-group textarea {
    position: relative;
    display: block;
    width: 100%;
    line-height: 20px;
    height: 60px;
    font-size: var(--font-18);
    color: var(--darkgrey);
    overflow: hidden;
    padding: 20px 50px 20px 50px;
    background: var(--white);
    border-radius: 50px;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    transition: all 300ms ease;
}

.coming-soon .emailed-form .form-group input[type="submit"],
.coming-soon .emailed-form button {
    position: absolute;
    right: 0px;
    top: 0px;
    width: 195px;
    height: 62px;
    line-height: 40px;
    padding: 10px 50px;
    font-size: var(--font-18);
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    border-radius: 0px 50px 50px 0px;
}

.coming-soon .emailed-form .form-group input[type="submit"],
.coming-soon .emailed-form button::before {
    border-radius: 0px 50px 50px 0px;
}

/*Sidebar Range slider */

.range-slider-one {
    position: relative;
    min-height: 48px;
    padding-top: 10px;
    overflow: hidden;
    margin-top: -20px;
}

.range-slider-one .title {
    position: relative;
    float: left;
    color: var(--black);
    font-size: var(--font-16);
    font-weight: 400;
    margin-top: 8px;
}

.range-slider-one .title:before {
    position: absolute;
    content: '$';
    right: -14px;
    top: 0px;
    font-size: var(--font-16);
    font-weight: 300;
}

.range-slider-one .input {
    float: right;
    left: 8px;
    max-width: 75px;
    padding-left: 8px;
    margin-top: 8px;
    position: relative;
}

.range-slider-one .input input {
    background: none;
    font-size: var(--font-16);
    font-weight: 300;
    width: auto;
    text-align: left;
}

.range-slider-one .ui-widget.ui-widget-content {
    height: 3px;
    border: none;
    margin-bottom: 35px;
    background: var(--grey);
}

.range-slider-one .ui-slider .ui-slider-range {
    top: 0px;
    height: 3px;
    background: var(--darkgrey);
}

.range-slider-one .ui-state-default,
.range-slider-one .ui-widget-content .ui-state-default {
    top: -6px;
    width: 15px;
    height: 15px;
    background: var(--main-color);
    cursor: pointer;
    border-color: var(--main-color);
    border-radius: 50%;
}

/*Sidebar Realated Posts */

.sidebar .related-posts .post {
    position: relative;
    padding: 0px 0px;
    padding-left: 90px;
    margin-bottom: 20px;
}

.sidebar .related-posts .post:last-child {
    margin-bottom: 0px;
    border: 0px;
    min-height: inherit;
}

.sidebar .related-posts .post .post-thumb {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 70px;
}

.sidebar .related-posts .post .post-thumb img {
    display: block;
    width: 100%;
}

.sidebar .related-posts .post h4 {
    top: -2px;
    font-size: var(--font-18);
    font-weight: 700;
    line-height: 1.2em;
    text-transform: capitalize;
}

.sidebar .related-posts .post h4 a {
    color: var(--darkgrey);
    transition: all 300ms ease;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
}

.sidebar .related-posts .post a,
.sidebar .related-posts .post a:hover {
    color: var(--main-color);
}

.sidebar .related-posts .post .price {
    font-size: var(--font-14);
    letter-spacing: 1px;
    font-weight: 400;
}

.sidebar .related-posts .post .rating {
    margin-bottom: 1px;
    line-height: 1em;
}

.sidebar .related-posts .post .rating .fa {
    position: relative;
    display: inline-block;
    font-size: var(--font-14);
    line-height: 26px;
    color: var(--secondary);
}

.our-shop .styled-pagination {
    margin-top: 40px;
}

/*Shop Item*/

.shop-item {
    position: relative;
    margin-bottom: 60px;
}

.shop-item .inner-box {
    position: relative;
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.shop-item .inner-box:hover .image .overlay-box {
    opacity: 1;
    left: 0;
    top: 0;
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
}

.shop-item .inner-box .image {
    position: relative;
    z-index: 11;
    text-align: center;
    overflow: hidden;
}

.shop-item .inner-box .image .overlay-box {
    position: absolute;
    content: '';
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    background-color: rgba(var(--black-opicity), 0.7);
    text-align: center;
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.shop-item .inner-box .image .overlay-box .cart-option {
    position: relative;
    top: 50%;
    margin-top: -25px;
}

.shop-item .inner-box .image .overlay-box .cart-option li {
    position: relative;
    margin: 0px 3px;
    color: var(--main-color);
    display: inline-block;
}

.shop-item .inner-box .image .overlay-box .cart-option li a {
    position: relative;
    width: 64px;
    height: 64px;
    color: var(--white);
    font-size: var(--font-18);
    display: block;
    line-height: 64px;
    text-align: center;
    border-radius: 50%;
    background-color: var(--main-color);
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

/*.shop-item .inner-box .image .overlay-box .cart-option li a .fa{
	display:block;
	font-size:var(--font-20);
	margin-bottom:8px;
}*/

.shop-item .inner-box .image .overlay-box .cart-option li a:hover {
    color: var(--white);
}

.shop-item .inner-box .image img {
    width: 100%;
    display: inline-block;
}

.shop-item .inner-box .lower-content {
    position: relative;
    z-index: 11;
    padding: 20px 0px 0px;
}

.shop-item .inner-box .lower-content h3 {
    position: relative;
    font-size: var(--font-20);
    font-weight: 700;
    color: var(--darkgrey);
    margin-bottom: 9px;
    text-transform: capitalize;
}

.shop-item .inner-box .lower-content h3 a {
    color: var(--darkgrey);
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
}

.shop-item .inner-box .lower-content h3 a:hover {
    color: var(--main-color);
}

.shop-item .inner-box .lower-content .add-cart {
    position: relative;
    color: var(--darkgrey);
    font-weight: 700;
    font-size: var(--font-16);
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    font-family: var(--font-family-Niramit);
}

.shop-item .inner-box .lower-content .add-cart .fa {
    margin-right: 5px;
}

.shop-item .inner-box .lower-content .add-cart:hover {
    color: var(--main-color);
}

.shop-item .inner-box .lower-content .price {
    position: relative;
    color: var(--secondary);
    font-size: var(--font-16);
    font-weight: 700;
    margin-bottom: 10px;
}

.shop-item .inner-box .lower-content .price .discount {
    position: relative;
    color: var(--darkgrey);
    margin-right: 8px;
    text-decoration: line-through;
}

.shop-item .inner-box .lower-content .rating .fa {
    position: relative;
    display: inline-block;
    font-size: var(--font-14);
    color: var(--secondary);
}

.product-details .basic-details {
    position: relative;
    margin-bottom: 50px;
}

.product-details .image-column,
.product-details .info-column {
    margin-bottom: 20px;
}

.product-details .image-column .image-box img {
    position: relative;
    display: block;
    width: 100%;
}

.product-details .basic-details .details-header {
    position: relative;
    margin-bottom: 16px;
}

.product-details .basic-details .details-header h4 {
    font-size: var(--font-24);
    font-weight: 700;
    margin: 5px 0px 20px;
    line-height: 1.4em;
    color: var(--darkgrey);
}

.product-details .basic-details .details-header h4 a {}

.product-details .basic-details .details-header .rating {
    font-size: var(--font-18);
    color: var(--main-color);
    margin-bottom: 15px;
    display: inline-block;
}

.product-details .basic-details .details-header .reviews {
    position: relative;
    display: inline-block;
    color: var(--darkgrey);
    font-weight: 400;
    margin-left: 15px;
}

.product-details .basic-details .details-header .rating .fa {
    display: inline-block;
    color: var(--secondary);
    font-size: var(--font-14);
}

.product-details .basic-details .details-header .rating .txt {
    font-size: 14px;
    padding-left: 10px;
}

.product-details .basic-details .details-header .item-price {
    font-size: 22px;
    font-weight: 700;
    color: var(--secondary);
    line-height: 24px;
}

.product-details .basic-details .prod-info {
    margin-bottom: 15px;
    line-height: 1.6em;
    font-size: 13px;
}

.product-details .basic-details .prod-info strong {
    font-weight: 700;
}

.product-details .basic-details p {
    margin-bottom: 25px;
    font-size: var(--font-16);
    font-weight: 400;
    line-height: 1.8em;
}

.product-details .basic-details .item-quantity .field-label {
    float: left;
    font-weight: 700;
    font-size: 14px;
    line-height: 32px;
    display: inline-block;
    padding-right: 20px;
}

.product-details .basic-details .quantity-spinner,
.cart-section input.quantity-spinner {
    line-height: 24px;
    border: 1px solid rgba(var(--black-opicity), 0.1);
    padding: 10px 15px !important;
    height: 46px !important;
    box-shadow: none !important;
    border-radius: 45px;
}

.cart-section .bootstrap-touchspin .input-group-btn-vertical {
    position: absolute;
    right: 20px;
    top: 0;
    z-index: 99;
}

.product-details .basic-details .bootstrap-touchspin .input-group-btn-vertical>.btn,
.cart-section .bootstrap-touchspin .input-group-btn-vertical>.btn {
    padding: 11px 10px;
}

.product-details .bootstrap-touchspin .input-group-btn-vertical i,
.cart-section .bootstrap-touchspin .input-group-btn-vertical i {
    top: 6px;
}

.product-details .basic-details .item-quantity {
    position: relative;
    float: left;
    width: 85px;
    margin-bottom: 25px;
    margin-right: 25px;
}

.product-details .basic-details .item-quantity .field-label {
    float: left;
    font-weight: 700;
    font-size: 14px;
    line-height: 32px;
    display: inline-block;
    padding-right: 20px;
}

.product-details .basic-details .quantity-spinner,
.cart-table input.quantity-spinner {
    font-size: var(--font-18);
    line-height: 24px;
    padding: 10px 15px !important;
    height: 50px !important;
    box-shadow: none !important;
    width: 100%;
}

.product-details .basic-details .bootstrap-touchspin .input-group-btn-vertical>.btn,
.cart-table .bootstrap-touchspin .input-group-btn-vertical>.btn {
    padding: 12px 10px;
    border-radius: 0px;
}

.product-details .bootstrap-touchspin .input-group-btn-vertical i,
.cart-table .bootstrap-touchspin .input-group-btn-vertical i {
    top: 8px;
}

.product-details .basic-details .add-to-cart {
    padding: 11px 30px;
    font-weight: 600;
    font-size: var(--font-16);
    border-radius: 50px;
    text-transform: uppercase;
    margin-left: 20px;
}

/*** 

====================================================================
	Product Tabs Style
====================================================================

***/

.shop-single .product-details .prod-tabs {
    position: relative;
}

.shop-single .product-details .prod-tabs .tab-btns {
    position: relative;
    z-index: 1;
    margin-bottom: 50px;
}

.shop-single .product-details .prod-tabs .tab-btns .tab-btn {
    position: relative;
    top: 1px;
    display: block;
    float: left;
    margin-right: 10px;
    font-size: var(--font-16);
    background-color: var(--bg-grey);
    color: var(--black);
    text-transform: uppercase;
    font-weight: 600;
    line-height: 24px;
    cursor: pointer;
    border-radius: 50px;
    padding: 18px 43px 18px;
    transition: all 500ms ease
}

.shop-single .product-details .prod-tabs .tab-btns .tab-btn:hover,
.shop-single .product-details .prod-tabs .tab-btns .tab-btn.active-btn {
    color: var(--white);
    background: var(--main-color);
}

.shop-single .product-details .prod-tabs .tabs-content {
    position: relative;
}

.shop-single .product-details .prod-tabs .tabs-content .tab {
    position: relative;
    display: none;
    border-top: 0px;
}

.shop-single .product-details .prod-tabs .tabs-content .tab.active-tab {
    display: block;
}

.shop-single .product-details .prod-tabs .tabs-content .tab .content {
    position: relative;
}

.shop-single .product-details .prod-tabs .tabs-content .tab .content p {
    position: relative;
    font-size: var(--font-16);
    line-height: 1.7em;
    margin-bottom: 25px;
}

.shop-single .product-details .prod-tabs .tabs-content .tab .content p:last-child {
    margin-bottom: 0px;
}

.prod-tabs .tabs-content .tab .title {
    position: relative;
    color: var(--darkgrey);
    font-size: var(--font-24);
    font-weight: 600;
    margin-bottom: 30px
}

/*Comment Form*/

.shop-comment-form {
    position: relative;
    margin-top: 50px;
}

.shop-comment-form h2 {
    position: relative;
    color: var(--darkgrey);
    font-size: var(--font-24);
    font-weight: 700;
    margin-bottom: 10px;
}

.shop-comment-form .mail-text {
    position: relative;
    font-size: var(--font-16);
    margin-bottom: 15px;
}

.shop-comment-form .group-title {
    margin-bottom: 20px;
}

.shop-comment-form .rating-box {
    position: relative;
    margin-bottom: 20px;
}

.shop-comment-form .rating-box p {
    position: relative;
    font-size: var(--font-16);
    margin-bottom: 15px;
}

.shop-comment-form .rating-box .rating {
    position: relative;
    margin-right: 10px;
    display: inline-block;
}

.shop-comment-form .rating-box .rating .fa {
    position: relative;
    margin-right: 5px;
    display: inline-block;
    font-size: var(--font-14);
    color: var(--secondary);
}

.shop-comment-form .rating-box .rating a {
    position: relative;
    font-size: 14px;
    display: inline-block;
}

.shop-comment-form .rating-box .rating a:hover {
    color: var(--main-color);
}

.shop-comment-form .form-group {
    position: relative;
    margin-bottom: 20px;
}

.shop-comment-form .form-group label {
    position: relative;
    font-size: var(--font-16);
    font-weight: 400;
}

.shop-comment-form .form-group:last-child {
    margin-bottom: 0px;
}

.shop-comment-form .form-group input[type="text"],
.shop-comment-form .form-group input[type="password"],
.shop-comment-form .form-group input[type="tel"],
.shop-comment-form .form-group input[type="email"],
.shop-comment-form .form-group select {
    position: relative;
    display: block;
    width: 100%;
    line-height: 28px;
    padding: 10px 15px;
    height: 50px;
    border: 1px solid rgba(var(--black-opicity), 0.1);
    font-weight: 300;
    border-radius: 45px;
    background: var(--white);
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    transition: all 300ms ease;
}

.shop-comment-form .form-group input[type="text"]:focus,
.shop-comment-form .form-group input[type="password"]:focus,
.shop-comment-form .form-group input[type="tel"]:focus,
.shop-comment-form .form-group input[type="email"]:focus,
.shop-comment-form .form-group select:focus,
.shop-comment-form .form-group textarea:focus {
    border-color: var(--main-color);
}

.shop-comment-form .form-group textarea {
    position: relative;
    display: block;
    width: 100%;
    line-height: 26px;
    padding: 10px 15px;
    height: 120px;
    font-weight: 300;
    border-radius: 25px;
    background: var(--white);
    border: 1px solid rgba(var(--black-opicity), 0.1);
    resize: none;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    transition: all 300ms ease;
}

.shop-comment-form button {
    position: relative;
    font-weight: 600;
    font-size: var(--font-16);
    padding: 10px 32px;
    margin-top: 10px;
    text-transform: uppercase;
}

.shop-comment-form input:focus,
.shop-comment-form select:focus,
.shop-comment-form textarea:focus {}

/*** 

====================================================================
	Cart Section style
====================================================================

***/

.cart-section {
    position: relative;
    padding: 49px 0px 250px;
}

.cart-outer {
    position: relative;
}

.checkout-page .cart-outer {
    margin-bottom: 40px;
}

.cart-outer .table-outer {
    position: relative;
    width: 100%;
    overflow-x: auto;
}

.cart-outer .cart-table {
    width: 100%;
    min-width: 900px;
    border: 1px solid rgba(var(--black-opicity), 0.1);
}

.cart-table .cart-header {
    position: relative;
    width: 100%;
    text-transform: uppercase;
    font-size: 13px;
    background: var(--secondary);
    color: var(--white);
}

.cart-table thead tr th {
    line-height: 24px;
    padding: 15px 25px;
    font-weight: 700;
    font-size: var(--font-16);
    letter-spacing: 1px;
    text-align: center;
    text-transform: uppercase;
    border-right: 1px solid var(--white);
    font-family: var(--font-family-Niramit);
}

.cart-table thead tr th .fa {
    font-size: var(--font-18);
}

.cart-table tbody tr td {
    line-height: 24px;
    padding: 30px 25px 30px;
    border: 1px solid rgba(var(--black-opicity), 0.1);
}

.cart-table tbody tr .qty {
    width: 200px;
}

.cart-table tbody tr .qty .item-quantity {
    max-width: 100px;
    margin: 0 auto;
}

.cart-table tbody tr .qty .quantity-spinner {
    background: var(--white);
}

.cart-table tbody tr .prod-column .column-box {
    position: relative;
    min-height: 110px;
}

.cart-table tbody tr .prod-column .column-box .prod-thumb {
    position: relative;
    width: 140px;
    margin: 0 auto;
    text-align: center;
}

.cart-table tbody tr .prod-column .column-box .prod-thumb img {
    display: inline-block;
    max-width: 100%;
}

.cart-table tbody tr .prod-column .column-box h4 {
    font-size: 14px;
    font-weight: 400;
    line-height: 90px;
}

.cart-table tbody tr .prod-column .author {
    font-size: 13px;
    margin-bottom: 0px;
}

.cart-table tbody tr .sub-total {
    font-weight: 400;
    color: var(--darkgrey);
    font-size: var(--font-16);
}

.cart-table tbody tr .sub-total.price {}

.cart-table tbody tr .remove-btn {
    position: relative;
    font-size: 14px;
    color: var(--main-color);
    line-height: 30px;
    font-weight: 500;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    transition: all 500ms ease;
}

.cart-table tbody tr .remove-btn .fa {
    position: relative;
    font-size: var(--font-18);
    line-height: 30px;
}

.cart-table tbody tr .remove-btn:hover {}

.cart-table tbody tr {}

.cart-table tbody tr td {
    vertical-align: middle;
    font-size: 17px;
    text-align: center;
}

.cart-table tbody tr td.prod-column {
    padding-left: 48px;
}

.cart-table tbody tr td.total {
    font-size: var(--font-18);
}

.cart-table tbody tr td:last-child {
    text-align: center;
}

.cart-table tbody tr td .prod-title {
    position: relative;
    font-size: var(--font-16);
    color: var(--darkgrey);
    font-weight: 400;
    font-family: var(--font-family-Niramit);
}

.cart-table tbody tr td .quantity-spinner {
    padding: 5px 0px 5px 20px;
    line-height: 24px;
    height: 34px;
    display: block;
    width: 100%;
    position: relative;
}

.cart-table tbody .available-info {
    position: relative;
    padding-left: 50px;
}

.cart-table tbody .available-info .icon {
    position: absolute;
    left: 0px;
    top: 5px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: var(--font-18);
    color: var(--white);
    border-radius: 50%;
}

.cart-section .cart-options {
    position: relative;
    padding: 40px 0px 10px;
    margin-bottom: 30px;
    border-top: 0px;
}

.cart-section .apply-coupon {
    position: relative;
}

.cart-section .cart-options .cart-btn {
    padding: 13px 36px;
    line-height: 24px;
    font-size: 15px;
    color: var(--white);
    font-weight: 700;
    border-radius: 50px;
    text-transform: capitalize;
    background-color: var(--main-color) -webkit-transition:all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    transition: all 500ms ease;
}

.cart-section .cart-options .cart-btn:hover {
    background-color: var(--darkgrey);
}

.cart-section .apply-coupon .form-group {
    position: relative;
    float: left;
    margin-right: 30px;
}

.cart-section .apply-coupon .form-group input[type="text"] {
    display: block;
    line-height: 28px;
    padding: 10px 25px;
    width: 225px;
    height: 50px;
    background: var(--white);
    border-radius: 50px;
    border: 1px solid rgba(var(--black-opicity), 0.1);
}

.cart-section .cart-options .btn-style-one {
    top: -7px;
    padding-left: 32px;
    padding-right: 32px;
}

.cart-section .totals-table {
    position: relative;
    margin-bottom: 20px;
    border: 1px solid rgba(var(--black-opicity), 0.1);
}

.cart-section .totals-table li {
    line-height: 24px;
    padding: 18px 30px;
    border-top: 1px solid rgba(var(--black-opicity), 0.1);
}

.cart-section .totals-table li:first-child {
    border-top: none;
}

.cart-section .totals-table li h3 {
    position: relative;
    font-weight: 700;
    font-size: var(--font-18);
    font-family: var(--font-family-Niramit);
}

.cart-section .totals-table li:last-child {
    border-bottom: none;
    padding: 40px 20px 50px;
}

.cart-section .totals-table .col {
    position: relative;
    display: block;
    float: left;
    line-height: 24px;
    width: 50%;
    color: var(--darkgrey);
    font-size: var(--font-16);
    font-weight: 700;
    text-transform: capitalize;
    font-family: var(--font-family-Niramit);
}

.cart-section .totals-table li .col:last-child {
    text-align: right;
}

.cart-section .totals-table .total .price {
    color: var(--main-color);
    font-weight: 400;
}

.shipping-block {
    position: relative;
    margin-bottom: 60px;
    border: 1px solid rgba(var(--black-opicity), 0.1);
}

.shipping-block .inner-box {
    position: relative;
    padding: 20px 25px 10px;
}

.shipping-block .inner-box h3 {
    position: relative;
    font-size: var(--font-24);
    font-weight: 700;
    margin-bottom: 4px;
    text-transform: capitalize;
}

.shipping-block .inner-box h4 {
    position: relative;
    color: var(--darkgrey);
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 22px;
    text-transform: capitalize;
}

.shipping-form {
    position: relative;
}

.shipping-form .row {
    position: relative;
    margin: 0px -10px;
}

.shipping-form .form-group {
    position: relative;
    margin-bottom: 20px;
    padding: 0px 10px;
}

.shipping-form .form-group input[type="text"],
.shipping-form .form-group input[type="password"],
.shipping-form .form-group input[type="tel"],
.shipping-form .form-group input[type="email"] {
    position: relative;
    display: block;
    width: 100%;
    line-height: 23px;
    padding: 10px 20px;
    height: 45px;
    border-radius: 45px;
    border: 1px solid rgba(var(--black-opicity), 0.1);
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    transition: all 300ms ease;
}

.shipping-form .form-group input[type="text"]:focus,
.shipping-form .form-group input[type="password"]:focus,
.shipping-form .form-group input[type="tel"]:focus,
.shipping-form .form-group input[type="email"]:focus,
.shipping-form .form-group select:focus,
.shipping-form .form-group textarea:focus {
    border-color: var(--main-color);
}

/*====================================================================
				CheckOut Section
====================================================================*/

.checkout-page {
    position: relative;
    padding: 50px 0px 250px;
}

.checkout-page .default-links {
    position: relative;
    margin-bottom: 50px;
}

.checkout-page .default-links li {
    line-height: 25px;
    padding: 25px 25px;
    font-size: var(--font-16);
    font-weight: 500;
    background-color: var(--bg-grey);
    margin-bottom: 40px;
}

.checkout-page .default-links li .fa {
    position: relative;
    font-size: var(--font-24);
    line-height: 25px;
    color: var(--secondary);
    margin-right: 20px;
}

.checkout-page .default-links li a {
    font-size: var(--font-16);
    display: inline-block;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.checkout-page .default-links li a:hover {
    color: var(--main-color);
}

.checkout-page .sec-title {
    margin-bottom: 20px;
}

.checkout-page .sec-title h3 {
    font-size: var(--font-30);
    line-height: 1.2em;
    color: var(--darkgrey);
    font-weight: 500;
}

.checkout-form {
    position: relative;
    margin-bottom: 50px;
}

.checkout-form .column {
    position: relative;
}

.checkout-form .form-group {
    position: relative;
    margin-bottom: 15px;
}

.checkout-form .form-group .field-label {
    display: block;
    line-height: 24px;
    text-transform: capitalize;
    color: var(--darkgrey);
    font-size: 15px;
    font-weight: 500;
    margin-bottom: 10px;
}

.checkout-form .form-group .field-label span {
    position: relative;
    font-size: var(--font-16);
    color: var(--darkgrey);
    display: block;
    font-weight: 600;
}

.checkout-form .form-group .field-label sup {
    top: -1px;
    font-size: 15px;
    color: var(--main-color);
}

.checkout-form .form-group p {
    position: relative;
    font-size: 14px;
    line-height: 24px;
}

.checkout-form input[type="text"],
.checkout-form input[type="email"],
.checkout-form input[type="password"],
.checkout-form input[type="tel"],
.checkout-form input[type="number"],
.checkout-form input[type="url"],
.checkout-form select,
.checkout-form textarea {
    position: relative;
    display: block;
    width: 100%;
    background: var(--white);
    font-size: var(--font-16);
    line-height: 26px;
    padding: 12px 22px;
    height: 50px;
    border-radius: 25px;
    border: 1px solid rgba(var(--black-opicity), 0.1);
    transition: all 300ms ease;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
}

.checkout-form select {
    cursor: pointer;
    -webkit-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    -moz-appearance: none;
    background: var(--white) url(../images/icons/icon-select.html) right center no-repeat;
}

.checkout-form textarea {
    resize: none;
    height: 60px !important;
    padding-left: 30px;
}

.checkout-form input:focus,
.checkout-form select:focus,
.checkout-form textarea:focus {}

.checkout-page .check-box {
    line-height: 24px;
    font-size: 14px;
    font-weight: normal;
    padding-top: 5px;
}

.checkout-page .check-box label {
    position: relative;
    top: -1px;
    font-weight: normal;
    padding: 0px;
    font-size: var(--font-16);
    cursor: pointer;
}

.checkout-page .lower-content {
    margin-top: 30px;
}

.checkout-page .lower-content .order-column {
    margin-bottom: 40px;
}

.checkout-page .lower-content .column h2 {
    position: relative;
    color: var(--darkgrey);
    font-size: var(--font-24);
    margin-bottom: 30px;
    padding-bottom: 12px;
}

.checkout-page .lower-content .column h2:after {
    position: absolute;
    content: '';
    left: 0px;
    bottom: 0px;
    width: 40px;
    height: 2px;
}

/*Coupon Box*/

.coupon-box {
    position: relative;
    padding: 25px 25px;
    margin-bottom: 25px;
}

.coupon-form {
    position: relative;
}

.coupon-form .form-group {
    position: relative;
    margin-bottom: 0px;
}

.coupon-form .form-group input[type="text"] {
    position: relative;
    display: block;
    width: 100%;
    line-height: 28px;
    padding: 10px 20px;
    height: 44px;
    font-size: 14px;
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    transition: all 300ms ease;
}

.coupon-form .form-group input[type="text"]:focus {}

.coupon-form button {
    margin-top: 0px;
    font-size: var(--font-16);
    font-weight: 700;
    border-radius: 0px;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    -ms-border-radius: 0px;
    -o-border-radius: 0px;
    padding: 8px 26px;
    text-transform: capitalize;
}

.order-box {
    position: relative;
    margin-bottom: 50px;
}

.order-box .sec-title {
    margin-bottom: 25px;
}

.order-box .sec-title h2 {
    font-size: 28px;
    padding-bottom: 0;
}

.order-box .sec-title h2:before {
    display: none;
}

.order-box .title-box {
    position: relative;
    padding: 15px 30px;
    font-weight: 500;
    color: var(--white);
    background-color: var(--darkgrey);
}

.order-box .title-box .col {
    position: relative;
    width: 50%;
    float: left;
    color: var(--white);
    font-size: var(--font-16);
    line-height: 25px;
}

.order-box ul {
    position: relative;
    border: 1px solid rgba(var(--black-opicity), 0.1);
}

.order-box ul li {
    position: relative;
    padding: 25px 30px;
    font-size: var(--font-16);
    font-weight: 500;
    border-bottom: 1px solid rgba(var(--black-opicity), 0.1);
    line-height: 30px;
}

.order-box ul li strong {
    color: var(--darkgrey);
    font-weight: 500;
    font-size: var(--font-16);
}

.order-box ul li span {
    width: 50%;
    float: right;
    color: var(--secondary);
    font-size: var(--font-16);
}

.order-box ul li span.free {}

.order-box ul li:last-child {
    border-bottom: 0;
}

.payment-box {
    position: relative;
    margin-bottom: 50px;
    background-color: var(--bg-grey);
}

.payment-box .upper-box {
    position: relative;
    padding: 15px 35px;
    border-bottom: 1px solid rgba(var(--black-opicity)0.2);
}

.payment-options {
    position: relative;
    margin-top: 20px;
    margin-bottom: 20px;
}

.payment-box .payment-options li {
    position: relative;
    margin-bottom: 15px;
}

.payment-box .payment-options li .radio-option {
    position: relative;
}

.payment-box .payment-options li .radio-option label {
    position: relative;
    display: block;
    padding-left: 30px;
    font-weight: 500;
    text-transform: capitalize;
    color: var(--darkgrey);
    cursor: pointer;
    font-size: var(--font-16);
}

.payment-box .payment-options li .radio-option label strong {
    font-weight: 400;
}

.payment-box .payment-options li .radio-option input[type="radio"] {
    position: absolute;
    left: 0px;
    top: 3px;
}

.payment-box .payment-options li .radio-option label .small-text {
    position: relative;
    display: none;
    letter-spacing: 0px;
    text-transform: none;
    font-weight: normal;
    font-size: 14px;
    color: var(--white);
    line-height: 1.8em;
    padding: 15px 20px;
    margin-top: 20px;
    background-color: var(--secondary);
}

.payment-box .payment-options li .radio-option input:checked+label .small-text {
    display: block;
}

.payment-box .payment-options li .radio-option label .small-text:before {
    position: absolute;
    content: '';
    left: 30px;
    top: -8px;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 8px solid var(--secondary);
}

.payment-box .payment-options li .radio-option label img {
    position: relative;
    display: block;
    max-width: 100%;
    padding-left: 30px;
    margin-top: 20px;
}

.payment-box .payment-options li .radio-option .what-paypall {
    position: relative;
    display: block;
    font-size: var(--font-16);
    font-weight: 700;
    margin-left: 120px;
    margin-top: 10px;
}

.payment-box .lower-box {
    position: relative;
    background-color: var(--bg-grey);
    padding: 30px 35px;
    border-top: 1px solid rgba(var(--black-opicity), 0.2);
}

.payment-box .lower-box .theme-btn {
    padding: 13px 32px;
    font-weight: 400;
    margin-right: 0;
}

/*** 

====================================================================
	Login Section
====================================================================

***/

.login-section {
    position: relative;
    padding: 42px 0px 250px;
}

.login-form.register-form {
    padding-bottom: 47px;
}

.login-section h2 {
    position: relative;
    color: var(--darkgrey);
    font-size: var(--font-30);
    font-weight: 500;
    line-height: 1.2em;
    margin-bottom: 25px;
}

.login-form {
    position: relative;
    margin-bottom: 40px;
    padding: 30px 40px 25px;
    box-shadow: 0 0 15px rgba(var(--black-opicity), 0.1);
    border-radius: 15px;
    background-color: var(--white);
}

.login-form .form-group {
    position: relative;
    margin-bottom: 16px;
}

.login-form .form-group.check-box {
    margin-bottom: 0px;
}

.login-form .form-group:nth-child(2) {
    margin-bottom: 25px;
}

.login-section.style-two .login-form .form-group:nth-child(2) {
    margin-bottom: 15px;
}

.login-form .form-group label {
    position: relative;
    top: -1px;
    font-weight: 400;
    font-size: 14px;
    margin-bottom: 12px;
}

.login-form .form-group.no-margin {
    margin-bottom: 0px;
}

.login-form .form-group input[type="text"],
.login-form .form-group input[type="password"],
.login-form .form-group input[type="tel"],
.login-form .form-group input[type="email"] {
    position: relative;
    display: block;
    width: 100%;
    line-height: 28px;
    padding: 10px 20px;
    height: 50px;
    border-radius: 45px;
    border: 1px solid rgba(var(--black-opicity), 0.1);
    -webkit-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    transition: all 300ms ease;
}

.login-form .form-group input[type="text"]:focus,
.login-form .form-group input[type="password"]:focus,
.login-form .form-group input[type="tel"]:focus,
.login-form .form-group input[type="email"]:focus,
.login-form .form-group select:focus,
.login-form .form-group textarea:focus {
    border-color: var(--main-color);
}

.login-form button {
    top: 0px;
    margin-top: 0px;
    font-size: var(--font-16);
    font-weight: 700;
    padding: 10px 36px;
    line-height: 25px;
    color: var(--white);
    text-transform: uppercase;
}

.login-form .psw {
    position: relative;
    font-size: var(--font-16);
}

.login-form .psw:hover {
    text-decoration: underline;
}

/*** 

====================================================================
	Error Section
====================================================================

***/

.error-section {
    position: relative;
    text-align: center;
    padding: 170px 0px 170px;
}

.error-section .error-title {
    position: relative;
    color: var(--darkgrey);
    font-size: 200px;
    font-weight: 700;
    line-height: 1em;
}

.error-section .error-title span {
    color: var(--main-color);
}

.error-section h4 {
    font-size: 40px;
    font-weight: 500;
    text-transform: capitalize;
}

.error-section p {
    font-size: var(--font-24);
    margin-top: 18px;
    margin-bottom: 45px;
}

/***

==================================================================
		Right To Left Style
==================================================================

***/

.rtl {
    direction: rtl;
    text-align: right;
}

.rtl .banner-section .content-column .content-inner {
    margin-right: 37%;
    margin-left: 0;
}

.rtl .sec-title.text-left {
    text-align: right !important;
}

.rtl .header-style-three.fixed-header .outer-box .cart-box {
    margin-right: 0;
    margin-left: 35px;
}

.rtl .header-style-three .outer-box .search-box-outer {
    margin-left: 35px;
}

.rtl .progress-sec .image-box .progress-bg {
    left: -150px;
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    right: auto;
}

.rtl .progress-sec .content-column.offset-lg-2,
.rtl .get-started-form .offset-lg-2 {
    margin-right: 16.666667%;
    margin-left: 0;
}

.rtl .projects-carousel .owl-nav {
    right: auto;
    left: 13%;
}

.rtl .header-style-one .outer-box .nav-toggler {
    margin-right: 20px;
}

.rtl .project-block .text-box:before,
.rtl .project-block .text-box:after {
    right: auto;
    left: -55px;
}

.rtl .group-title h2,
.rtl .styled-pagination,
.rtl .owl-carousel {
    direction: ltr !important;
}

.rtl .blog-detail .tags ul li,
.rtl .blog-detail .tags .title,
.rtl .project-detail .info-list li strong,
.rtl .service-detail .prod-tabs .tab-btns .tab-btn,
.rtl .header-style-four .main-menu,
.rtl .header-style-three .main-menu,
.rtl .projects-section-two .upper-box .sec-title,
.rtl .main-footer .footer-bottom .copyright-text,
.rtl .testimonial-section .testimonial-column,
.rtl .main-header .top-left,
.rtl .main-menu .navigation>li,
.rtl .header-style-one .main-menu,
.rtl .header-style-five .nav-outer,
.rtl .banner-section .bottom-box .contact-info,
.rtl .main-header .contact-info li span,
.rtl .main-header .logo-box,
.rtl .pull-left {
    float: right;
}

.rtl .pull-right {
    float: left;
}

.rtl .cat-list li a span,
.rtl .header-style-four .header-top .top-right,
.rtl .header-style-four .outer-box,
.rtl .header-style-three .nav-outer,
.rtl .main-header .top-right,
.rtl .header-style-four .nav-outer,
.rtl .projects-section-two .upper-box .link-box,
.rtl .main-footer .footer-bottom .social-links,
.rtl .main-header .nav-outer,
.rtl .header-style-five .outer-box,
.rtl .header-style-one .outer-box {
    float: left;
    margin-right: 43px;
}

.rtl .comments-area .comment-box .author-thumb,
.rtl .blog-detail .news-block-two .caption-box blockquote .icon,
.rtl .latest-news .post-thumb,
.rtl .feature-block h3:before,
.rtl .active-side-nav .sidenav-bar,
.rtl .banner-carousel-two .content-box .count,
.rtl .list-style-one li:before,
.rtl .news-block-four .image-box,
.rtl .main-footer .links-widget .list li:before,
.rtl .active-side-nav .hidden-bar,
.rtl .contact-info-box .info-list:before,
.rtl .main-footer .footer-column .widget-title:before,
.rtl .recent-posts .post .thumb,
.rtl .service-detail .inner-box ul li:before,
.rtl .fact-counter .count-box:before,
.rtl .about-section .image-column .image-box .alphabet-img,
.rtl .about-section .content-column .content-box .title h2:before,
.rtl .main-menu .navigation>li>ul {
    left: auto;
    right: 0;
}

.rtl .comments-area .comment-box .reply-btn,
.rtl .news-block-two .blockquote .author,
.rtl .sidenav-bar .cross-icon,
.rtl .offer-section .form-column .upper-box .discount,
.rtl .banner-section-two .slide-item .content-box:before,
.rtl .banner-carousel-three .owl-nav,
.rtl .testimonial-block .image-box,
.rtl .team-block .image-box .social-links,
.rtl .brochure-box .inner .icon {
    right: auto;
    left: 0;
}

.rtl .banner-section.banner-slider .content-column {
    order: 2;
}

.rtl .banner-section.banner-slider .image-column {
    order: 1;
}

.rtl .banner-section.banner-slider .content-column .video-link {
    display: flex;
    justify-content: flex-end;
}

.rtl .testimonial-section .title-column .inner-column,
.rtl .team-block .inner-box .designation,
.rtl .projects-carousel .owl-nav,
.rtl .about-section .image-column .image-box .image {
    text-align: left;
}

.rtl .header-style-three .logo-box:before {
    margin-left: -230px;
    right: auto;
    left: 100%;
    transform: skew(-40deg);
}

.rtl .sidenav-bar .side-nav .navigation>li.dropdown>a {
    padding-right: 0;
    padding-left: 30px;
}

.rtl .header-style-one .outer-box {
    margin-left: 0;
    margin-right: 45px;
}

.rtl .fixed-header .sticky-header .logo {
    float: right !important;
}

.rtl .fixed-header .sticky-header .pull-right {
    float: left !important;
}

.rtl .sidenav-bar .side-nav .navigation>li.dropdown>a:before {
    right: auto;
    left: 0;
    content: "\f104";
}

.rtl .banner-section .bottom-box .contact-info li span {
    float: right;
    margin-left: 10px;
}

.rtl .sidenav-bar .side-nav .navigation>li.active>a:before {
    content: "\f107";
}

.rtl .mCSB_inside>.mCSB_container {
    margin-right: 0;
    margin-left: 0 !important;
}

.rtl .social-icon-one li {
    margin-left: 0;
    margin-right: 22px;
}

.rtl .main-menu .navigation>li {
    margin-right: 45px;
    margin-left: 0 !important;
}

.rtl .header-style-two .header-lower .main-box .nav-outer .navigation>li {
    margin-right: 38px;
}

.rtl .main-menu .navigation>li>ul>li>ul {
    right: 110%;
    left: auto;
}

.rtl .header-style-two .outer-box .btn-style-one {
    margin-left: 15px;
    margin-right: 0;
}

.rtl .main-menu .navigation>li>ul>li:hover>ul {
    right: 100%;
}

.rtl .main-menu .navigation>li .mega-menu-bar .column>ul>li>a,
.rtl .main-menu .navigation>li>ul>li>ul>li>a,
.rtl .main-menu .navigation>li>ul>li>a {
    text-align: right !important;
}

.rtl .main-menu .navigation>li .mega-menu-bar .column>ul>li>a,
.rtl .main-menu .navigation>li>ul>li>ul>li>a,
.rtl .main-menu .navigation>li>ul>li>a {
    border-left: 0;
    border-right: 4px solid transparent;
}

.rtl .main-menu .navigation>li .mega-menu-bar .column>ul>li>a:hover,
.rtl .main-menu .navigation>li>ul>li>ul>li:hover>a,
.rtl .main-menu .navigation>li>ul>li:hover>a {
    border-left: 0;
    border-right: 4px solid var(--main-color);
}

.rtl .main-menu .navigation>li>ul>li.dropdown>a:after {
    left: 10px;
    right: auto;
    content: "\f104";
}

.rtl .sticky-header .main-menu .navigation>li {
    margin-left: 0 !important;
}

.rtl .about-section .image-column .title-box h2 {
    text-align: center;
}

.rtl .fact-counter .count-box {
    padding-right: 20px;
    padding-left: 0;
}

.rtl .header-style-two .outer-box {
    margin-left: 15px;
    margin-right: 30px;
}

.rtl .header-style-two .main-menu {
    float: right;
}

.rtl .header-style-two .search-box-outer {
    float: left;
    margin-right: 0;
    margin-left: 0;
}

.rtl .main-header .search-box-outer .dropdown-menu {
    right: auto !important;
    left: 0 !important;
}

.rtl .main-header .cart-btn {
    float: right;
}

.rtl .fact-counter .count-box .count {
    margin-left: 15px;
    margin-right: 0;
}

.rtl .project-block .overlay-box h4 {
    right: auto;
    left: 30px;
}

.rtl .project-block .overlay-box .tag {
    left: auto;
    right: 30px;
}

.rtl .banner-carousel .owl-nav {
    right: auto;
    left: 30%;
}

.rtl .banner-section:before {
    right: auto;
    left: 0;
    transform: scaleX(-1);
}

.rtl .team-block .inner-box {
    padding-right: 0;
    padding-left: 50px;
}

.rtl .team-block .inner-box:hover .image-box .social-links li {
    right: auto;
    left: -50px;
}

.rtl .team-block .image-box .name {
    right: auto;
    left: -40px;
}

.rtl .testimonial-block {
    padding-right: 0;
}

.rtl .testimonial-block .inner-box {
    padding-right: 0;
    text-align: left;
}

.rtl .testimonial-block:before {
    right: auto;
    left: 0px;
}

.rtl .main-footer .footer-column .widget-title {
    padding-left: 0;
    padding-right: 25px;
}

.rtl .recent-posts .post {
    padding-left: 0;
    padding-right: 105px;
}

.rtl .main-footer .links-widget .list li {
    padding-left: 0;
    padding-right: 30px;
}

.rtl .main-footer .footer-bottom .inner-container:before {
    right: auto;
    left: 100%;
}

.rtl .main-footer .footer-bottom .copyright-text:before {
    left: auto;
    right: 100%;
    border-right: 0;
    border-bottom: 0;
    border-left: 40px solid transparent;
    border-bottom: 70px solid var(--main-color);
}

.rtl .main-footer .footer-bottom .copyright-text {
    padding-right: 0;
    padding-left: 40px;
}

.rtl .offer-section .form-column .upper-box {
    padding-right: 0;
    padding-left: 200px;
}

.rtl .products-carousel .owl-nav {
    left: auto;
    right: -32%;
}

.rtl .header-style-three .outer-box {
    margin-left: 0;
    margin-right: 80px;
    float: left;
}

.rtl .hidden-bar .inner-box .cross-icon {
    right: auto;
    left: 30px;
}

.rtl .banner-carousel-two .content-box .inner-box {
    padding-left: 0;
    padding-right: 30px;
    float: left;
}

.rtl .banner-carousel-two .content-box .inner-box:before {
    left: auto;
    right: 100%;
}

.rtl .banner-section-three .bottom-box .outer-box:before {
    margin-left: 0;
    margin-right: -300px;
    left: auto;
    right: 100%;
    transform: skew(-40deg);
}

.rtl .banner-carousel-two .owl-nav {
    text-align: left;
}

.rtl .banner-section-three .social-links {
    float: right;
}

.rtl .carousel-outer .thumbs-carousel .owl-nav {
    bottom: auto;
    top: -525%;
}

.rtl .testimonial-carousel-two {
    padding-left: 0;
    padding-right: 100px;
}

.rtl .testimonial-carousel-two .owl-nav {
    left: auto;
    right: -135px;
}

.rtl .accordion-box .block .acc-btn {
    padding-right: 25px;
    padding-left: 50px;
}

.rtl .accordion-box .block .icon {
    right: auto;
    left: 15px;
}

.rtl .main-header .contact-info li:first-child {
    margin-left: 0;
}

.rtl .news-block-two .caption-box .info li:first-child,
.rtl .service-detail .prod-tabs .tab-btns .tab-btn:first-child,
.rtl .news-block-four .content-box .info li:first-child {
    margin-right: 0;
}

.rtl .news-block-four .inner-box {
    padding-left: 0;
    padding-right: 300px;
}

.rtl .news-section-two .column .inner-column {
    padding-right: 0;
    padding-left: 25px;
}

.rtl .header-style-four .search-box-btn {
    margin-left: 0;
    margin-right: 55px;
}

.rtl .sidebar .search-box .form-group input[type="submit"],
.rtl .sidebar .search-box .form-group button,
.rtl .coming-soon .emailed-form .form-group input[type="submit"],
.rtl .coming-soon .emailed-form button {
    right: auto;
    left: 0;
    border-radius: 50px 0px 0px 50px;
}

.rtl .coming-soon .emailed-form .form-group input[type="submit"],
.rtl .coming-soon .emailed-form button::before {
    border-radius: 50px 0px 0px 50px;
}

.rtl .main-menu .navigation>li>ul>li.dropdown>a:before {
    right: auto;
    left: 15px;
}

.rtl .specialize-section-two.alternate .carousel-outer .thumbs-carousel .owl-nav {
    left: 96%;
    top: 368%;
}

.rtl .blog-cat li a:before {
    right: auto;
    left: 33px;
    content: "\f104";
}

.rtl .blog-cat li a {
    border-left: 0;
    border-right: 5px solid transparent;
}

.rtl .blog-cat li.active a,
.rtl .blog-cat li a:hover {
    border-left: 0;
    border-right: 5px solid var(--darkgrey);
}

.rtl .service-detail .inner-box ul li,
.rtl .brochure-box .inner {
    padding-left: 0;
    padding-right: 40px;
}

.rtl .mixitup-gallery .filters li {
    float: right;
    margin-right: 0;
    margin-left: 30px;
}

.rtl .mixitup-gallery .filters li:last-child {
    margin-left: 0;
}

.rtl .project-detail .project-tabs .tab-btns {
    float: right;
    margin-left: 30px;
    margin-right: 0;
}

.rtl .list-style-one li {
    padding-left: 0;
    padding-right: 35px;
}

.rtl .list-style-one li .icon {
    left: auto;
    right: 0;
}

.rtl .main-header .main-menu .navigation>li.dropdown>a::before {
    right: auto;
    left: -14px;
}

.rtl .main-header .main-menu .navigation>li.dropdown>a::after {
    right: -7px;
    left: auto;
}

.rtl .text-left {
    text-align: left !important;
}

.rtl .news-block-two .blockquote .icon {
    left: auto;
    right: 70px;
}

.rtl .cat-list li {
    border-left: 0;
    border-right: 7px solid transparent;
}

.rtl .cat-list li.active,
.rtl .cat-list li:hover {
    border-left: 0;
    border-right: 7px solid var(--main-color);
}

.rtl .latest-news .post {
    padding-left: 0;
    padding-right: 130px;
}

.rtl .tag-list li {
    float: right;
    margin-left: 10px;
    margin-right: 0;
}

.rtl .blog-detail .news-block-two .caption-box blockquote {
    padding-left: 0;
    padding-right: 40px;
}

.rtl .progress-sec .image-box .animated-img-1 {
    right: auto;
    left: -142%;
}

.rtl .progress-sec .image-box .animated-img-2 {
    left: -90%;
    right: auto;
}

.rtl .progress-sec .image-box .animated-img-3 {
    left: -50%;
    right: auto;
}

.rtl .progress-levels .progress-box .progress-percentage {
    left: 0;
    right: auto;
}

.rtl .progress-levels .progress-box .bar {
    left: auto;
    right: 0;
}

.rtl .social-icon-colored li {
    float: right;
    margin-left: 6px;
    margin-right: 0;
}

.rtl .social-icon-colored li a i {
    margin-right: 0;
    margin-left: 10px;
}

.rtl .comments-area .comment {
    padding-left: 0;
    padding-right: 150px;
}

.rtl .blog-detail.style-two .comments-area .comment {
    padding-left: 0;
    padding-right: 110px;
}

.rtl .comments-area .comment-box.reply-comment {
    margin-left: 0;
    margin-right: 100px;
}

.rtl .comments-area .comment-box.reply-comment.reply {
    margin-left: 0;
    margin-right: 200px;
}

.rtl .blog-detail.style-two .news-block-two .caption-box blockquote {
    padding-left: 0;
    padding-right: 25px;
}

.rtl .contact-info-section .inner-container .contect-box {
    text-align: left;
}

.rtl .shop-single .product-details .prod-tabs .tab-btns .tab-btn {
    float: right;
    margin-right: 0;
    margin-left: 10px;
}

.rtl .product-details .basic-details .item-quantity {
    float: right;
    margin-right: 0;
    margin-left: 25px;
}

.rtl .product-details .basic-details .add-to-cart {
    margin-left: 0;
    margin-right: 20px;
}

.rtl .checkout-page .default-links li .fa {
    margin-right: 0;
    margin-left: 20px;
}

.rtl .payment-box .payment-options li .radio-option label {
    padding-left: 0;
    padding-right: 30px;
}

.rtl .payment-box .payment-options li .radio-option input[type="radio"] {
    left: auto;
    right: 0;
}

.rtl .payment-box .payment-options li .radio-option label .small-text:before {
    left: auto;
    right: 30px;
}

.rtl .shop-item .inner-box .lower-content .add-cart .fa {
    margin-right: 0;
    margin-left: 5px;
}

.rtl .banner-section .slide-item:before {
    left: auto;
    right: -15%;
    -webkit-transform: skew(15deg);
    -moz-transform: skew(15deg);
    -ms-transform: skew(15deg);
    -o-transform: skew(15deg);
    transform: skew(15deg);
}

.rtl .main-header .contact-info li span {
    margin-right: 0;
    margin-left: 20px;
}

.rtl .invested-sec .invseted-cloumn .invested-box .icon-box .count {
    left: auto;
    right: -28px;
}

.rtl .about-section.style-two .image-column .inner-column .image-box {
    text-align: left;
    margin-left: -200px;
    margin-right: 0;
}

.rtl .service-block-three .inner-box .icon-box .icon {
    margin-right: 23px;
    margin-left: 0;
}

.rtl .faq-section .image-column .image {
    margin-left: 0;
    margin-right: -270px;
}

.rtl .news-block.style-two .caption-box {
    text-align: right;
}

.rtl .news-block.style-two .caption-box .category {
    justify-content: flex-end;
}

.rtl .emailed-form .form-group:before {
    left: auto;
    right: 48%;
}

.rtl .emailed-form .form-group input[type="submit"],
.rtl .emailed-form button,
.rtl .widgets-section .newslatter-form form .form-group button,
.rtl .banner-section.style-three .content-column .content-inner .analysis-form .form-group button {
    right: auto;
    left: 5px;
}

.rtl .service-block-four .inner-box .front-box .lower-content h4:before,
.rtl .service-block-four .inner-box .back-box .lower-content h4:before {
    left: auto;
    right: 0;
}

.rtl .get-started-form .offset-lg-3 {
    margin-left: 0;
    margin-right: 25%;
}

.rtl .get-started-form .form-area .form-group button {
    right: auto;
    left: 3px;
}

.rtl .pattern-layer-tweleve {
    right: auto;
    left: 2%;
}

.rtl .experince-sec .image-column .image-box {
    margin-left: 0;
    margin-right: -180px;
}

.rtl .counter-box .count-box:nth-child(3) {
    left: auto;
    right: 44px;
}

.rtl .counter-box .count-box:nth-child(4) {
    left: auto;
    right: 45px;
}

.rtl .project-block-two .overlay-box .category {
    left: auto;
    right: 30px;
}

.rtl .project-block-two .overlay-box .detail-box {
    right: auto;
    left: 25px;
    bottom: 25px;
}

.rtl .testimonial-section.style-two .owl-nav {
    left: auto;
    right: -36%;
}

.rtl .testimonial-section.style-two .testimonial-column .testimonial-carousel {
    padding: 95px 239px 159px 162px;
    max-width: 100%;
}

.rtl .news-block.style-three .caption-box,
.rtl .main-footer.style-three .footer-bottom .inner-container .copyright-text,
.rtl .range-slider-one .input input {
    text-align: right;
}

.rtl .team-details-section .offset-lg-1 {
    margin-right: 8.333333%;
    margin-left: 0;
}

.rtl .banner-section.style-three .banner-image {
    left: auto !important;
    right: 8% !important;
}

.rtl .banner-section.style-three .banner-image-2 {
    right: auto !important;
    left: 14% !important;
}

.rtl .banner-section.style-three .banner-image-3 {
    right: auto !important;
    left: 12% !important;
}

.rtl .banner-section.style-three .banner-image-4 {
    left: auto !important;
    right: 5% !important;
}

.rtl .page-title .bread-crumb li:before {
    right: auto;
    left: -15px;
}

.rtl .progress-sec {
    z-index: 9;
}

.rtl .clients-section .sponsors-outer:before {
    left: auto;
    right: -162px;
}

.rtl .cat-list li a i {
    margin-left: 15px;
    margin-right: 0;
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}

.rtl .comments-area .comment-box .name {
    float: right;
    margin-left: 25px;
}

.rtl .fixed-header .sticky-header .main-box .logo-box {
    float: right;
}

.rtl .project-block-two .overlay-box .category {
    right: 20px;
}

.rtl .news-block.style-three .overlay-box .share-button {
    right: auto;
    left: 20px;
}

.rtl .news-block.style-three .overlay-box .social-links {
    right: auto;
    left: 0;
}

.rtl .news-block.style-three .overlay-box .social-links.show-social {
    right: auto;
    left: 40px;
}

.rtl .progress-sec .progress-bg {
    background-position: top left;
    transform: rotate(180deg);
    right: auto;
    left: -62%;
}

.rtl .progress-sec .image-box {
    margin-right: 43px;
    margin-left: -377px;
    margin-top: 64px;
}

/*** 

====================================================================
	Box Layout
====================================================================

***/

.box-layout .page-wrapper {
    max-width: 1300px;
    margin: 0 auto;
    border: 15px solid var(--white);
    overflow: hidden;
    background-color: var(--white);
}

.box-layout {
    background-image: url(../images/background/23.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
    background-size: cover;
}

.box-layout .banner-section.banner-slider {
    padding-bottom: 140px;
    background-position: top right;
}

.box-layout .progress-sec .progress-bg {
    top: -160px;
    background-size: 49%;
    right: 0;
    background-position: bottom right;
}

.box-layout .progress-sec .image-box {
    margin-right: -64px;
    margin-left: 0;
    margin-top: 123px;
}

.box-layout .projects-carousel .owl-nav {
    right: 0;
}

.box-layout .progress-sec .image-box .animated-img-1 {
    top: 127px;
}

.box-layout .progress-sec .image-box .animated-img-2 {
    right: -121px;
    top: 158px;
}

.box-layout .coming-soon .background {
    position: absolute;
}

.box-layout .rtl .banner-section {
    background-size: 105%;
}

.box-layout .rtl .banner-section .content-column .content-inner {
    margin-right: 11%;
}

.box-layout .rtl .banner-section.style-two .image-column .image-box img.image-vector {
    right: -8%;
}

.box-layout .rtl .banner-section .content-column .content-inner {
    margin-top: 258px;
}

.box-layout .rtl .banner-section .image-column .image-box {
    margin-top: 136px;
}

.box-layout .rtl .banner-section.style-two {
    background-size: 128%;
}

.box-layout .rtl .about-section.style-two .image-column .inner-column .image-box {
    margin-left: -36px;
}

.box-layout .rtl .service-block-three:nth-child(1) {
    margin: 0 0px 40px 66px;
}

.box-layout .rtl .service-block-three:nth-child(2) {
    margin: 0 -22px 40px 62px;
}

.box-layout .rtl .service-block-three {
    margin: 0 -31px 40px 59px;
}

.box-layout .rtl .service-block-two:nth-child(1) {
    margin: 0 59px 40px 0;
}

.box-layout .rtl .service-block-two:nth-child(2) {
    margin: 0 57px 40px -23px;
}

.box-layout .rtl .service-block-two {
    margin: 0 65px 40px -73px;
}

.box-layout .rtl .progress-sec .image-box img {
    padding: 225px 39px 0;
}

.box-layout .project-block .text-box h3 {
    font-size: var(--font-22)
}

.box-layout .sticky-header {
    max-width: 1270px;
    left: 0;
    right: 0;
    margin: 0 auto;
}

.box-layout .rtl .faq-section .image-column .image {
    margin-left: 0;
    margin-right: -33px;
}

.box-layout .rtl .pricing-section:before {
    top: 0;
    background-size: 79%;
    right: -115px;
}

.box-layout .project-block .text-box:after,
.box-layout .project-block .text-box:before {
    width: 80px;
    height: 80px;
}

.box-layout .project-block .text-box {
    padding: 15px;
    margin: 0 15px;
}

.box-layout .header-style-one .inner-container {
    padding: 0 30px;
}

.box-layout .banner-section {
    padding-left: 0;
    background-size: 109%;
}

.box-layout .banner-section .image-column .image-box {
    margin-top: 261px;
}

.box-layout .header-style-three .outer-box .search-box-outer {
    margin: 0 20px;
}

.box-layout .header-style-three .outer-box .theme-btn {
    margin: -11px 15px 0;
}

.box-layout .header-style-three .outer-box {
    margin-left: 20px;
}

.box-layout .main-header .main-menu .navigation>li {
    margin-left: 55px;
}

.box-layout .header-style-one .outer-box .contact-info {
    padding-left: 0;
    margin-left: 35px;
    display: none;
}

.box-layout .banner-section.style-three .content-column .content-inner {
    margin-top: 180px;
}

.box-layout .banner-section.style-three .image-column .image-box {
    margin-top: 59px;
}

.box-layout .header-style-one {
    top: 15px;
}

.box-layout .experince-sec .image-column .image-box {
    position: relative;
    margin-left: -47px;
}

.box-layout .experince-sec .image-column .image-box .review-box {
    bottom: -96px;
}

.box-layout .project-block-two .overlay-box .category {
    top: 20px;
    left: 20px;
}

.box-layout .project-block-two .overlay-box .detail-box {
    right: 20px;
    bottom: 20px;
}

.box-layout .header-style-six.fixed-header .outer-container,
.box-layout .header-style-one.fixed-header {
    top: 0;
}

.box-layout .banner-section-six,
.box-layout .banner-section-three {
    padding: 0;
}

.box-layout .banner-carousel-two .owl-nav {
    right: 45px;
}

.box-layout .header-style-three .inner-container {
    padding: 0 15px;
}

.box-layout .coming-soon {
    position: relative;
}

.box-layout .coming-soon .content {
    position: relative;
}

.box-layout .header-style-five .inner-container {
    padding: 0 30px;
}

.box-layout .banner-section-six .contact-info,
.box-layout .banner-section-six .social-links,
.box-layout .header-style-five .outer-box .contact-info {
    padding-left: 0;
    margin-left: 35px;
    display: none;
}

.box-layout .rtl .header-style-three .outer-box .search-box-outer {
    margin-right: 15px;
}

.box-layout .rtl .header-style-three .outer-box .theme-btn {
    margin: -11px 15px 0;
}

.box-layout .rtl .header-style-three .outer-box {
    margin-left: 0;
    margin-right: 30px;
    float: left;
}

.box-layout .header-style-three .header-lower {
    width: 100%;
    padding: 15px 20px;
}

.box-layout .rtl .main-menu .navigation>li {
    margin-right: 40px;
}

.box-layout .rtl .fixed-header .sticky-header .outer-box .nav-toggler {
    margin-right: 35px;
}

.box-layout .banner-section.style-three .image-column .image-box:before,
.box-layout .banner-section.style-three .image-column .image-box:after {
    background-size: 76%;
}

.box-layout .rtl .experince-sec .image-column .image-box {
    margin-right: -51px;
}

.box-layout .experince-sec .image-column .image-box:before {
    background-size: 82%;
}

.box-layout .project-block-two .overlay-box .detail-box h5 {
    font-size: var(--font-14);
}

.box-layout .project-block-two .overlay-box .category a {
    padding: 6px 15px;
    font-size: var(--font-14);
}

.box-layout .contact-section:before {
    background-size: 41%;
    top: 58px;
}

.box-layout .banner-section.style-two .content-column .content-inner {
    margin-top: 226px;
    margin-left: 13%;
}

.box-layout .banner-section.style-two .image-column .image-box img.image-vector {
    right: 3%;
}

.box-layout .about-section.style-two .image-column .inner-column .image-box {
    text-align: right;
    margin-right: 0;
}

.box-layout .service-block-two:nth-child(1) {
    margin: 0 73px 40px 0;
}

.box-layout .service-block-two:nth-child(2) {
    margin: 0 38px 40px 0;
}

.box-layout .service-block-two {
    margin: 0 -29px 40px 0;
}

.box-layout .service-block-three:nth-child(1) {
    margin: 0 0px 40px 72px;
}

.box-layout .service-block-three:nth-child(2) {
    margin: 0 0 40px 40px;
}

.box-layout .service-block-three {
    margin: 0 0 40px -26px;
}

.box-layout .faq-section .image-column .image {
    margin-left: -14px;
}

.box-layout .faq-section:before {
    background-size: 75%;
    background-repeat: no-repeat;
}

.box-layout .pricing-section:before {
    right: -97px;
    background-repeat: no-repeat;
    background-size: 83%;
}

.box-layout .banner-section .content-column .content-inner {
    margin-top: 305px;
    margin-left: 6%;
}

.clients-section.style-three {
    padding: 194px 0 70px;
}

.MT10 {
    margin-top: 10px !important;
}

.MT20 {
    margin-top: 20px !important;
}

.MT30 {
    margin-top: 30px !important;
}

.SystemMessage {
    background-color: var(--main-color);
    border: 1px solid var(--main-color);
    color: #FFFFFF;
    border-radius: 35px;
    padding: 10px 20px;
    margin-bottom: 20px;
}

label.error {
    color: #FFFFFF !important;
}

a.WhstaAppFloat {
    position: fixed;
    width: 50px;
    height: 50px;
    bottom: 18px;
    right: 18px;
    background-color: #25d366;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    font-size: 35px;
    z-index: 100;
}

a.WhstaAppFloat i {
    padding-top: 8px;
}

a.ContactFloat {
    position: fixed;
    width: 50px;
    height: 50px;
    bottom: 18px;
    right: 18px;
    background-color: #FF8A00;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    font-size: 25px;
    z-index: 100;
    bottom: 35%;
}

a.ContactFloat i {
    padding-top: 11px;
}

a.ContactFloat2 {
    position: fixed;
    right: -55px;
    background-color: #FF8A00;
    color: #FFF;
    border-radius: 10px;
    text-align: center;
    font-size: 20px;
    z-index: 100;
    bottom: 55%;
    padding: 10px 20px;
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
}

a.CallNowFloat {
    position: fixed;
    width: 50px;
    height: 50px;
    bottom: 18px;
    right: 18px;
    background-color: #FF8A00;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    font-size: 25px;
    z-index: 100;
    bottom: 90px;
}

a.CallNowFloat i {
    padding-top: 10px;
}

marquee img {
    height: 75px !important;
    margin-right: 20px !important;
}

a.link1 {
    color: #FFFFFF !important;
}

a.link1:hover {
    color: #ff0000 !important;
}

/*Btn Style nav*/

.btn-style-nav {
    position: relative;
    display: inline-block;
    font-size: var(--font-16);
    color: var(--white) !important;
    font-weight: 700;
    border-radius: 35px;
    text-transform: capitalize;
    background-color: var(--secondary);
    overflow: hidden;
}

.btn-style-nav:before {
    position: absolute;
    content: '';
    left: 0;
    top: 0;
    width: 93%;
    height: 100%;
    z-index: 1;
    opacity: 1;
    background-color: var(--main-color);
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
    border-radius: 44px;
    color: #FFFFFF !important;
}

.btn-style-nav .txt {
    position: relative;
    z-index: 1;
    color: var(--white) !important;
}

.btn-style-nav:hover::before {
    left: -100%;
}

.btn-style-nav:hover {
    color: var(--white);
}

a.btn-style-nav {
    position: relative;
    display: block;
    font-weight: 500;
    color: var(--white) !important;
    padding: 5px 10px !important;
    opacity: 1;
    margin-top: 30px;
    text-align: center;
    text-transform: capitalize;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.footer-title-bg {
    color: var(--white);
    padding: 10px 35px;
    font-weight: 700;
    border-radius: 35px;
    text-transform: capitalize;
    background-color: #ff6600;
    overflow: hidden;
    text-align: center !important;
}