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

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&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');
@import url('https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700;1,900&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Dosis:wght@200..800&family=Jost:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Aoboshi+One&display=swap');

* {

    margin: 0px;

    padding: 0px;

    border: none;

    outline: none;

    font-size: 100%;

}


ol {
    padding-left: 0px !important;
}


/*** 



====================================================================

		Root Code

====================================================================



 ***/





/* Theme Color */

:root {

    /* #4800ff in decimal RGB */

    --secondary: rgb(49, 0, 174);

    /* #ff0000 in decimal RGB */

    --main-color: #016b7a;

    /* #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-Montserrat: 'Montserrat', sans-serif; */
    /* --font-family-Merriweather:'Merriweather', serif; */
    --font-family-DM: "DM Sans", sans-serif !important;
    --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-DM) !important;
    overflow-x: hidden;

}



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;
    font-family: "Jost", sans-serif !important;

}








/* 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: rgb(23 172 248) !important;
    opacity: 1 !important;
    overflow: hidden;
    display: flex !important;
    align-items: center;
    justify-content: center;
}



.btn-style-one:before {

    position: absolute;

    content: '';



    width: 93%;

    height: 93%;

    z-index: 1;

    opacity: 1;

    background-color: transparent;
    border: 1.5px dashed #fff;
    animation: rotatecircle 13s linear infinite;
    -webkit-transition: all 0.4s;

    -moz-transition: all 0.4s;

    -o-transition: all 0.4s;

    transition: all 0.4s;

    border-radius: 44px;

}


@keyframes rotatecircle {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}


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

}





#mserice {

    margin-bottom: 6%;

}



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

}




.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

====================================================================



***/





.marketing-name-target {
    text-align: center;
    padding: 42px;
    border: 1px solid #dbd3d3;
    border-style: dashed;

}


.top-header {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    padding: 6px 40px;
}



.top-header .left-header-area {

    width: calc(60% - 0px);

    display: flex;

    justify-content: flex-start;

}



.top-header .left-header-area {

    width: calc(60% - 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(40% - 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: 45px;

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

    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;

    margin-top: 20px;

}



.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: 50px;

}



.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: -44px;

}

.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 .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: 55px;

}

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

		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: 23%;

    top: 35%;

    /* 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: 73%;
    top: 75px;

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

    height: 25px;

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

    position: absolute;

    /* top: 54%; */

    /* right: 20px !important; */

    right: 50px;
    width: 40px;

    height: 40px;

    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; */
    /* margin-top:-10px; */
    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: 360px;

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

}



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

}

.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 .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: 0px;

}



.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);
    font-size: 15px;
    line-height: 25px;
}

@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: 100% 70%;

    /* background-position: center center; */

    background-repeat: no-repeat;

    text-align: center;

    overflow: hidden;

    margin-bottom: 22px;


}



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

}

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

    .page-title {

        position: relative;

        padding: 130px 0 153px;

        background-size: cover;

        /* background-position: center center; */

        background-repeat: no-repeat;

        text-align: center;

        overflow: hidden;


    }

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

    text-align: center;

    font-size: 25px
}

.sec-title .subtitle {

    color: #028AA2;

    font-weight: 600;

    text-align: center;
    font-size: 15px
}

.sec-title.light h2,

.sec-title.light .subtitle {

    color: var(--white);

}

.sec-titlep-center .float-text {

    right: 0;

    margin: 0 auto;

}



/*** 



====================================================================

			About Section

====================================================================



***/



.about-section {

    position: relative;

    background-repeat: no-repeat;

    background-position: top center;

    background-size: 61%;

    padding: 60px 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: 570px;

    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: #363636;

    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;

    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 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/hoverimg.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: #028AA2;

    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%;
    height: 250px;

}

.project-block-two .overlay-box {

    position: absolute;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

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

    background-image: url(../images/hoverimg.png);

    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: #028AA2;

}

.progress-levels .progress-box .bar {

    position: absolute;

    left: 0px;

    top: -8px;

    height: 6px;

    width: 0px;

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

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

    background-color: var(--secondary);

}



.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: 43px;

    margin-top: 38px;

}

.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: 62px;

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

    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 {
    padding: 15px 15px 0;
    position: relative;

}



.news-block .image-box .image {

    position: relative;

    margin-bottom: 12px;



}



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


    text-align: center;

    margin-bottom: 15px;

}

.inner-box {
    position: relative;
}

.news-block .caption-box h4 {

    position: relative;

    display: block;

    font-weight: 700;

    margin: 0px 0 30px;

    color: var(--black);

}



.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.style-three .caption-box h4 {

    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.news-block.style-three .caption-box p {

    /* display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis; */
}

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

    -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: 16px;
    border: 1px solid #00000040;


}

.bloge_details_area .news-block.style-three .image-box .image img {
    /* height: 40vh;
    object-fit: scale-down; */
}

.news-block.style-three .overlay-box {

    background: var(--black) padding-box content-box;

    border-radius: 15px 15px 0 0;

    padding: 0;

}

.bloge_details_area {
    padding: 50px 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 14px 30px 20px;

    margin-bottom: 0;

}

.news-block.style-three .caption-box .category {
    display: flex;
    flex-wrap: wrap;
    position: absolute;
    top: -338px;
    right: 29px;
    /* left: 37px; */
    border: 1px dashed #3100ae;
    width: fit-content;
    padding: 0px 22px;
    border-radius: 50px;


}

ul.category>li {
    line-height: 22px;
}

ul.category>li>a {
    font-size: 10px !important;
}

.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: 0px;

}

.news-block.style-three .caption-box p {
    font-size: 14px;
    color: black;
    opacity: 1;
}

.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: 50px 55px;

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

}

@media only screen and (min-width: 320px) and (max-width: 768px) {
    .clients-section.style-three .sponsors-outer {

        padding: 0 0px;

        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: 15px 20px 15px 10px;

    background-color: var(--white);

    font-weight: 400;

    height: 60px;

    border: 1px solid rgba(var(--black-opicity), 0.1);

    -webkit-transition: all 0.3s ease;

    -moz-transition: all 0.3s ease;

    -ms-transition: all 0.3s ease;

    -o-transition: all 0.3s ease;

    transition: all 0.3s ease;

    border-radius: 0px;
    border-bottom: 1px solid black;
    border-left: 0px solid black;
    border-top: 0px solid black;
    border-right: 0px solid black;

}

.contact-form .form-group input:focus,

.contact-form .form-group select:focus,

.contact-form .form-group textarea:focus {

    border-color: #17acf8d9;

    /* box-shadow: 0 0 24px rgba(var(--black-opicity),0.1); */

}



.contact-form .form-group textarea {

    height: 100px;

    resize: none;

    border-radius: 0px;

}



.contact-form .form-group button {

    padding: 15px 50px;

    line-height: 20px;

    text-transform: uppercase;

}



.contact-form .form-group label.error {

    color: var(--main-color);

}

.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: #333;

}



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

}



.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: 0px 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 {
    margin-top: -90px;

    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;



}



.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: 9px 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: 14px 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: 450px;

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

}



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

}

.lower-content figure img {
    width: 100%;
}

.lower-content figure img .shop-item .inner-box .lower-content h3 {

    position: relative;

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

    font-weight: 400;

    color: var(--darkgrey);

    margin-bottom: 9px;

    text-transform: capitalize;

    font-size: 15px;

}

.related_blog_area .lower-content figure img {
    border-radius: 20px;
    border: solid 1px #028AA2;
}

.newbox-view {
    border: solid 1px #028AA2;
    border-radius: 30px !important;
    transition: all ease 0.5s;
}


.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-size: 14px;

    font-weight: 600;

    /* 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); */
    background-color: #028AA2;
    color: white;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 3px;
    padding-bottom: 3px;
    border-radius: 5px;

}


.shop-item .inner-box .lower-content .view-dtls-btn {

    position: relative;

    color: var(--darkgrey);
    font-size: 14px;

    font-weight: 600;

    /* 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); */
    background-color: black;
    color: white;
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 3px;
    padding-bottom: 3px;
    border-radius: 5px;

}


.shop-item .inner-box .lower-content .add-cart .fa {

    margin-right: 5px;

}



.shop-item .inner-box .lower-content .add-cart:hover {

    color: black;

}

.shop-item .inner-box .lower-content .view-dtls-btn:hover {

    color: #028AA2;

}

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

    display: flex;

    margin: auto;



}



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

}








/*====================== 24 march ======================*/

@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&display=swap');


.faq {
    /*padding: 20px ;*/
    width: 100%;
    /* min-width:450px;*/
    margin: auto;
    position: relative;
    /* font-family:'Comfortaa', cursive; */
    height: auto;
}

.faq-container {
    width: 100%;
    height: 100%;

    /* font-family:'Comfortaa', cursive; */
}

.faq-label {
    cursor: pointer;
    width: 100%;
    padding: 10px 25px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* font-family:'Comfortaa', cursive; */

    border-radius: 19px;
    background: #d0edf0;
    box-shadow: 5px 5px 10px #b7d1d3,
        -5px -5px 10px #e9ffff;
}

.faq-label-text {
    color: #365A5E;
    /* 
font-family:'Comfortaa', cursive; */
}

.faq-label-icon {
    padding: 2px 3px;
    background: #d0edf0;
    border-radius: 6px;
    display: flex;
    justify-content: center;
    align-items: center;

    /* font-family:'Comfortaa', cursive; */
}

.material-icons {
    color: #365A5E;
    transition: 0.3s ease;
    font-family: 'Comfortaa', cursive;
}

.faq-answer {
    transition: 0.3s ease;
    margin-top: 15px;
    height: 0;
    border-radius: 6px;
    color: rgba(127, 121, 121, 1);
    overflow: hidden;

}

.faq-answer-content {
    padding: 10px 0 10px 15px;
    /* font-family:'Comfortaa', cursive; */


}

.active {

    background: #FFFFFF;
    /* border: 1px solid #C7C4C4; */

    /* font-family:'Comfortaa', cursive; */
    height: auto;
    margin-bottom: 25px;

}

.rotate {
    transform: rotate(180deg);
    /* font-family:'Comfortaa', cursive; */
}

.global-label {
    color: #365A5E;
    width: 100%;
    height: 35px;
    border-bottom: solid 2px #C4C1C1;
    margin-bottom: 35px;
    /* font-family:'Comfortaa', cursive; */
}

.global-label-text {
    font-size: 18px;
    font-weight: 700;
    /* font-family:'Comfortaa', cursive; */
    color: #365A5E;
}

.score {
    display: none;
    color: #00ff2a;
    /* font-family:'Comfortaa', cursive; */
    padding: 15px;
    width: 45px;
    height: 25px;
    margin: 45px auto;
    text-align: center;
    padding: 5px;
    justify-content: center;
    align-items: center;
    border-radius: 5px;
    background: white;
}

.about-me {
    border-radius: 5px;
    width: 300px;
    /* font-family:'Comfortaa', cursive; */
    margin: auto;
    color: white;
    text-align: center;
    background: #ffff;
    padding: 7px 18px;
}



.sidebar-page-container .auto-container {
    max-width: 100%;
}

.sponsors-carousel .active {
    border: 0px !important;
}

.sponsors-carousel figure {
    border: 1px solid #C7C4C4;
    height: 150px;
    width: 150px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px;
}

@media only screen and (max-width: 767.98px) {
    .over_page {
        overflow: hidden;
    }

    .sponsors-carousel figure {
        border: 1px solid #C7C4C4;
        height: 138px;
        width: 138px;
        border-radius: 50%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 5px;
    }
}

.sidenav {
    height: 100%;
    width: 160px;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #111;
    overflow-x: hidden;
    padding-top: 20px;
}



/*----------------------Home Slider---------------------------*/

#news-slider {
    margin-top: 80px;
}

.post-slide {
    background: #fff;
    margin: 20px 15px 20px;
    border-radius: 15px;
    padding-top: 1px;
    box-shadow: 0px 14px 22px -9px #bbcbd8;
}

.post-slide .post-img {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    margin: -12px 15px 8px 15px;
    margin-left: -10px;
}

.post-slide .post-img img {
    width: 100%;
    height: auto;
    transform: scale(1, 1);
    transition: transform 0.2s linear;
}

.post-slide:hover .post-img img {
    transform: scale(1.1, 1.1);
}

.post-slide .over-layer {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    background: linear-gradient(-45deg, rgba(6, 190, 244, 0.75) 0%, rgba(45, 112, 253, 0.6) 100%);
    transition: all 0.50s linear;
}

.post-slide:hover .over-layer {
    opacity: 1;
    text-decoration: none;
}

.post-slide .over-layer i {
    position: relative;
    top: 45%;
    text-align: center;
    display: block;
    color: #fff;
    font-size: 25px;
}

.post-slide .post-content {
    background: #fff;
    padding: 2px 20px 40px;
    border-radius: 15px;
}

.post-slide .post-title a {
    font-size: 15px;
    font-weight: bold;
    color: #333;
    display: inline-block;
    text-transform: uppercase;
    transition: all 0.3s ease 0s;
}

.post-slide .post-title a:hover {
    text-decoration: none;
    color: #3498db;
}

.post-slide .post-description {
    line-height: 24px;
    color: #808080;
    margin-bottom: 25px;
}

.post-slide .post-date {
    color: #a9a9a9;
    font-size: 14px;
}

.post-slide .post-date i {
    font-size: 20px;
    margin-right: 8px;
    color: #CFDACE;
}

.post-slide .read-more {
    padding: 7px 20px;
    float: right;
    font-size: 12px;
    background: #2196F3;
    color: #ffffff;
    box-shadow: 0px 10px 20px -10px #1376c5;
    border-radius: 25px;
    text-transform: uppercase;
}

.post-slide .read-more:hover {
    background: #3498db;
    text-decoration: none;
    color: #fff;
}

.owl-controls .owl-buttons {
    text-align: center;
    margin-top: 20px;
}

.owl-controls .owl-buttons .owl-prev {
    background: #fff;
    position: absolute;
    top: -13%;
    left: 15px;
    padding: 0 18px 0 15px;
    border-radius: 50px;
    box-shadow: 3px 14px 25px -10px #92b4d0;
    transition: background 0.5s ease 0s;
}

.owl-controls .owl-buttons .owl-next {
    background: #fff;
    position: absolute;
    top: -13%;
    right: 15px;
    padding: 0 15px 0 18px;
    border-radius: 50px;
    box-shadow: -3px 14px 25px -10px #92b4d0;
    transition: background 0.5s ease 0s;
}

.owl-controls .owl-buttons .owl-prev:after,
.owl-controls .owl-buttons .owl-next:after {
    content: "\f104";
    font-family: FontAwesome;
    color: #333;
    font-size: 30px;
}

.owl-controls .owl-buttons .owl-next:after {
    content: "\f105";
}

@media only screen and (max-width:1280px) {
    .post-slide .post-content {
        padding: 0px 15px 25px 15px;
    }
}

.blg-srch-icn {
    position: absolute;
    right: 25px;
    cursor: pointer;
    margin-top: -33px;
}

.contact-page-section .contact-info .info-block {
    margin-bottom: 0px;
}

.create-attr-bgvw {
    background-image: url(/public/front_website/images/background/11.png);
    /* background-size: cover; */
}

@media only screen and (min-width:1024px) {
    .now-esy-box-vw {
        /* margin-top:-130px; */
    }
}

.service-block .service-box-front .lower-content h3 a,
.service-block .service-box-back .lower-content h3 {
    font-size: 18px
}

.service-block .service-box-front .lower-content p,
.service-block .service-box-back .lower-content p {
    font-size: 14px
}

.blg-dtl-main-vw h3 {
    font-size: 18px !important;
    text-align: start !important;
    margin-top: 10px !important;
    color: black;
}

.blg-dtl-main-vw h4 {
    font-size: 22px !important;
    text-align: start !important;
    margin-top: 10px !important;
    color: black;
}

.blg-dtl-main-vw h2 {
    font-size: 24px !important;
    text-align: start !important;
    margin-top: 10px !important;
    color: black;
}

.blg-dtl-main-vw h1 {
    font-size: 26px !important;
    text-align: start !important;
    margin-top: 10px !important;
    color: black;
}

.blg-dtl-main-vw ul li {
    list-style: disc !important;
    margin-top: 5px !important;
    margin-bottom: 5px !important;
    margin-left: 20px !important;
    color: black;
}

.blg-dtl-main-vw ol li {
    list-style: number !important;
    margin-top: 5px !important;
    margin-bottom: 5px !important;
    margin-left: 20px !important;
    color: black;
}

.blg-dtl-main-vw p {
    color: black;
}


.filter-option {
    padding: 30px 0 0;
    margin-bottom: 30px;
    text-align: center;
    /* width:100%; */
    padding: 10px;
    display: flex !important;
    justify-content: center;
}

.filter-option li {
    list-style: none;
    padding: 15px;
}

.filter-option li+li {
    margin-left: -5px;
}

.filter-option li a {
    font-size: 16px;
    font-weight: 600;
    color: #000;
    text-decoration: none;
    text-align: center;
    background: transparent;
    padding: 15px 0;
    /* border-right: 1px solid #e5e5e6;
        border-bottom: 2px solid #a9a9ab;  */
}

.filter-option li a.active {
    /* background: #028AA2; */
    color: #028AA2;
    /* border-color: #028AA2; */
}

.filter-option li:last-of-type a {
    border-right: none;
}

.filter-option li a:hover {
    color: #028AA2;
}

.item-slider li {
    margin: 0 15px;
}

.item-slider li img {
    width: 100%;


}

.item-slider-main-1 li {
    margin: 0 15px;
}

/* .item-slider-main-1 li img {
          width: 100%; } */

.slider-controls {
    margin-top: 30px;
    text-align: center;
}

.slider-controls span {
    display: inline-block;
    font-size: 20px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    background: rgba(23, 172, 248, 1);
    border: 1px solid rgba(23, 172, 248, 1);
    color: #fff;
    cursor: pointer;
    margin: 0 5px;
    transition: all 0.3s linear;
    border-radius: 50%;
}

.slider-controls span:hover {
    background: #000;
    color: #ffffff;
    border-color: #000;
}




.slick-slider {
    position: relative;
    display: block;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent
}

.slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0
}

.slick-list:focus {
    outline: none
}

.slick-list.dragging {
    cursor: hand
}

.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block
}

.slick-track:before,
.slick-track:after {
    display: table;
    content: ''
}

.slick-track:after {
    clear: both
}

.slick-loading .slick-track {
    visibility: hidden
}

.slick-slide {
    display: none;
    float: left;
    height: 100%;
    min-height: 1px
}

.slick-slide.dragging img {
    pointer-events: none
}

.slick-initialized .slick-slide {
    display: block
}

.slick-loading .slick-slide {
    visibility: hidden
}

.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent
}

.img-fill {
    width: 100%;
    display: block;
    overflow: hidden;
    position: relative;
    text-align: center
}

.img-fill img {
    height: 100%;
    min-width: 100%;
    position: relative;
    display: inline-block;
    max-width: none
}


.SlickCarousel {
    margin: 0 -7.5px;
    margin-top: 10px;
}

.slick-slide img {

    margin: auto;
}


@media only screen and (max-width:767.99px) {
    .filter-option {
        padding: 20px 0 0;
        margin-bottom: 10px;

    }

    .filter-option li a {
        font-size: 14px;
        font-weight: 600;

    }

    .filter-option li {
        padding: 10px;
    }

    .cmplt-prjt-mob-vw {
        display: flex;
        overflow-x: scroll;
    }

    .blg-dtl-main-vw h3 {
        font-size: 16px !important;

    }

    .blg-dtl-main-vw h4 {
        font-size: 20px !important;

    }

    .blg-dtl-main-vw h2 {
        font-size: 22px !important;

    }

    .blg-dtl-main-vw h1 {
        font-size: 24px !important;

    }

    .blg-dtl-main-vw img {
        height: auto !important;
    }

    .banner-section .content-column .content-inner h1 {
        font-size: 20px;
    }

    .banner-section .content-column .content-inner p {
        font-size: 16px;
        text-align: justify;
        margin-bottom: 0px;

    }

    .banner-section.style-three .image-column .image-box {
        margin-top: 15px;
    }

    .progress-sec {
        padding: 0px;
    }

    .experince-sec {
        padding: 30px 0;
    }

    .experince-sec .image-column .image-box .review-box {
        width: auto;
    }

    .testimonial-section {
        padding: 0px;
    }

    .testimonial-block {
        padding-bottom: 0px;
    }

    .news-section-three {
        padding: 20px 0px !important;
    }

    .sec-title .subtitle {
        margin-top: 20px;
    }

    .sponsors-carousel figure {
        height: 120px;
        width: 120px;
    }

    .main-row-view {
        flex-direction: column-reverse;
    }

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

    .about-section {
        padding: 20px 0px !important;
    }

    .page-title {
        padding: 0px 0 100px;
    }

    .about-section .content-column .content-box p {
        margin-bottom: 0px;
        text-align: justify;
    }

    .active.fade-bottom {
        animation: fade-bottom 0.50s ease-in;
    }

    .active {
        margin-bottom: 5px
    }

    .sec-title h2 {
        font-size: 21px !important;
    }

    .about-para-fnt {
        text-align: justify;
    }

    .faq-section .accordion-column .inner-column {
        padding-top: 0px;
    }

    .sec-title .subtitle {
        margin-top: 0px;
    }

    .contact-page-section .form-column .inner-column {
        padding: 0px;
    }

    /* .contact-page-section .contact-form {
    margin-bottom:0px
} */
    .contact-page-section .contact-form {
        margin-bottom: 0px !important;
    }

    .contact-page-section {
        padding-bottom: 40px;

    }

    .contact-page-section .contact-info {

        position: relative;

        padding: 20px 0 0;

    }

    .get-started-sec {
        padding: 10px;
    }

    .header-style-three .header-lower {
        padding: 20px 11px;
    }

    .pattern-layer-tweleve {
        top: 53%;
    }

    .banner-section .content-column .content-inner h1 {
        margin: -55px 0 15px;
    }

    .pattern-layer-eleven {
        top: 10%;
    }

    .service-block .service-box-front .lower-content h3 a {
        font-size: 18px
    }

    .sec-title h2 {

        font-size: 20px
    }

    .sec-title .subtitle {
        font-size: 13px
    }

    .project-block-two .image-box .image img {

        height: 350px;

    }

    .serve-dk-slider {
        display: none;
    }

}

@media only screen and (min-width:768px) {
    .serve-mob-slider {
        display: none;
    }
}



.single-dtl-page-box {
    background-color: #ffffff;
    padding: 30px;

}

.single-main-dtlvw {
    border: solid 1px #028AA2;
    padding: 25px;
    border-radius: 5px;
}

.single-main-dtlvw h1 {
    font-size: 25px;
    font-weight: 600;
    margin-top: 30px;
}

.single-main-dtlvw h2 {
    font-size: 23px;
    font-weight: 600;
    margin-top: 30px;
}

.single-main-dtlvw h3 {
    font-size: 20px;
    font-weight: 600;
    margin-top: 30px;
}

.single-main-dtlvw h4 {
    font-size: 19px;
    font-weight: 600;
    margin-top: 30px;
}

.single-main-dtlvw h5 {
    font-size: 18px;
    font-weight: 600;
    margin-top: 30px;
}

.single-main-dtlvw h6 {
    font-size: 17px;
    font-weight: 600;
    margin-top: 30px;
}

.single-main-dtlvw p {
    font-size: 15px;
    font-weight: 500;
    text-align: justify;
    margin-top: 20px;
    padding: 10px;
}
.single-main-dtlvw table{
    width: 100% !important;
}

.single-main-dtlvw ul li {
    font-size: 15px;
    font-weight: 500;
    list-style: disc !important;
    text-align: justify;
    margin-top: 10px;
    margin-left: 22px;
}

.single-main-dtlvw ol li {
    font-size: 15px;
    font-weight: 500;
    list-style: lower-roman !important;
    text-align: justify;
    margin-top: 10px;
}

.connect-team-btn {
    font-size: 15px;
    font-weight: 500;
    background-color: #028AA2;
    color: white;
    border: solid 1px #028AA2;
    padding-left: 25px;
    padding-right: 25px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: 5px;
    margin-top: 15px;
}

.connect-team-btn:hover {
    background-color: black;
    color: white;
    border: solid 1px black;
}

.single-serv-box {
    background-color: #ffffff;
    border-radius: 5px;
    padding: 10px;
    box-shadow: 2px 2px 30px 2px rgb(238, 238, 238);
    border: solid 1px #028AA2;
}

.sgl-topline {
    border: dotted 0.50px rgb(163, 163, 163);
    margin-top: 10px;
}

.sgl-serve-link {
    margin-top: 10px;
    font-size: 14px;
    font-weight: 500;
}

.sgl-serve-link:hover {
    color: #028AA2
}

.slick-slide {
    margin: 10px 10px;
}

.add-cart-pro-dtl-btn {
    background-color: #028AA2;
    border-radius: 7px;
    border: solid 1px #028AA2;
    color: white !important;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 7px;
    padding-bottom: 7px;
}

.buyvw-pro-dtl-btn {
    background-color: #000000;
    border-radius: 7px;
    border: solid 1px #000000;
    color: white !important;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 7px;
    padding-bottom: 7px;
}

.testimonial-card-box {
    background-color: white;
    box-shadow: 2px 2px 30px 5px rgb(236, 236, 236);
    border-radius: 5px;
    padding: 10px;
    text-align: center;
    border: solid 1px rgb(211, 211, 211);
}

.test-user-imgvw {
    width: 100%;
    max-width: 60px;
    height: 60px;
    border-radius: 50%;
    border: solid 1px #028AA2;
    padding: 5px;
}

.test-user-title {
    font-size: 17px;
    font-weight: 600;
    letter-spacing: 0.75px;
    margin-top: 20px;
    color: black;
}

.test-user-subtitle {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.75px;
    color: #028AA2;
}

.test-user-content {
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.75px;
    margin-top: 20px;
}

.project-scl-icnbx {
    background-color: white;
    box-shadow: 2px 2px 30px 4px rgb(241, 241, 241);
    cursor: pointer;
}

.project-scl-icnbx:hover {
    background-color: #eef8fd
}

.pro-scl-icns {
    width: 50px;
    height: 50px;
    background-color: transparent;
    padding: 4px;
    border: solid 1px white;
    border-radius: 100%;
}

.pro-scl-icns:hover {
    background-color: rgb(255, 255, 255);
    padding: 5px;
    border: solid 1px rgb(209, 209, 209);
}

.header-icn-vw {
    font-size: 32px !important;
    color: black;
}

.header-icn-vw:hover {
    color: #028AA2;
}

.main-hdg-prdct-page {
    border: solid 1px #818181;
    border-radius: 1px 50px 1px 50px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 5px;
    padding-right: 5px;
    /* border-right:none;
border-left:none; */
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 20px;
    background-color: white;
    box-shadow: 10px 7px 5px #dbd9d9;
    width: auto;

}



@media only screen and (max-width:767.99px) {
    .single-dtl-page-box {
        padding: 0px;
        margin-top: -100px;

    }

    .add-cart-pro-dtl-btn {
        padding-left: 8px;
        padding-right: 8px;
        padding-top: 7px;
        padding-bottom: 7px;
    }

    .single-main-dtlvw {
        /* margin-top:-45px; */
        padding: 15px;
        padding-left: 20px;
    }

    .main-hdg-prdct-page {
        box-shadow: 0px 0px 0px transparent;
        border-radius: 1px 25px 1px 25px;
    }

    .row-view-dirtn {
        /* flex-direction: column-reverse; */
        row-gap: 15px;
    }

    .single-main-dtlvw h1 {
        font-size: 18px;
    }

    .single-main-dtlvw h2 {
        font-size: 17px;
    }

    .single-main-dtlvw h3 {
        font-size: 17px;
    }

    .single-main-dtlvw h4 {
        font-size: 16px;
    }

    .single-main-dtlvw h5 {
        font-size: 16px;
    }

    .single-main-dtlvw h6 {
        font-size: 15px;
    }

    .single-main-dtlvw p {
        font-size: 14px;
    }

    .single-main-dtlvw ul li {
        font-size: 14px;
    }

    .single-main-dtlvw ol li {
        font-size: 14px;

    }


}

.newbox-view {
    background-color: white;
    color: black;
    border: solid 1px #028AA2;
    padding: 18px 17px 30px;
    border-radius: 6px;
    box-shadow: 2px 2px 30px 5px #f0f1fa;
    cursor: pointer;
    height: 100%;
}

.newbox-view:hover {
    /* ;
        color:white; */
    background-color: #ebfdff;
    transform: scale(1.02);
    box-shadow: 0px -1.5px rgba(0, 128, 128, 0.268) !important;
}

.pro-smcode-fnt {
    font-size: 14px;
    font-weight: 500;
    border: solid 1px grey;
    border-radius: 1px 25px 1px 1px;
    padding: 3px;

}

.pro-sm-main-heading {
    font-size: 18px !important;
    font-weight: 600 !important;
    /* margin-top:15px; */
}

.pro-dtl-main-vw {
    font-size: 14px !important;
    font-weight: 600 !important;
}


.float {
    position: fixed;
    left: 5px;
    width: 60px;
    height: 60px;
    bottom: 40px;
    /* right:40px; */
    background-color: #e7e7e7;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 3px #999;
    z-index: 100;
    border: solid 1px rgb(61, 61, 61);
}

.my-float {
    margin-top: 16px;
}

.bounce {
    animation: bounce 2s infinite;
}

@keyframes bounce {

    0%,
    25%,
    50%,
    75%,
    100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-20px);
    }

    60% {
        transform: translateY(-12px);
    }
}

.g-review-fixed {
    width: 142px;
    position: fixed;
    top: 198px;
    left: -44px;
    z-index: 3000;
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    display: none;

}

.g-review-fixed img {
    width: 100%
}


.zoom img {
    transition-duration: 4s;
    margin: 0 auto;
    display: block;
    border-radius: 7px;
    background-color: rgb(255, 255, 255);
    padding: 5px;
    box-shadow: 2px 2px 15px 3px rgb(231, 231, 231);
}

.zoom img:hover {
    transform: scale(1.05);
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    z-index: 0;
}

.our-team-fnt h4 {
    font-size: 19px;
    font-weight: 600;
    margin-top: 20px;
    color: black;
    text-align: center;
}

.our-team-fnt p {
    font-size: 14.5px;
    font-weight: 500;
    /* margin-top:15px; */
    color: rgb(48, 48, 48);
    text-align: center;
}

.content-overviw {
    position: relative;

}

.content-overviw .content-overlay {
    background: rgba(0, 0, 0, 0.7);
    position: absolute;

    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    opacity: 0;
    -webkit-transition: all 0.4s ease-in-out 0s;
    -moz-transition: all 0.4s ease-in-out 0s;
    transition: all 0.4s ease-in-out 0s;
}

.content-overviw:hover .content-overlay {
    opacity: 1;
}

.content-image {
    width: 100%;
}

.content-details {
    position: absolute;
    text-align: center;
    padding-left: 1em;
    padding-right: 1em;
    width: 100%;
    top: 50%;
    left: 50%;
    opacity: 0;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: all 0.3s ease-in-out 0s;
    -moz-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

.content-overviw:hover .content-details {
    top: 50%;
    left: 50%;
    opacity: 1;
}


.content-details p {
    color: #fff;
    font-size: 13px;
}

.fadeIn-left {
    left: 20%;
}

.fadeIn-top {
    top: 20%;
}

.it-product-cardvw {
    background-color: rgb(41, 41, 41);
    padding: 10px;
    border-radius: 7px;
    border: solid 1px rgb(177, 177, 177);
    box-shadow: 2px 2px 10px 3px rgb(230, 230, 230);
    color: rgb(240, 240, 240);
    cursor: pointer;
}

.it-prod-web {
    width: 100%;
    height: 150px;
    margin-top: 15px;
    border-radius: 7px
}

.it-prod-title-fnt {
    font-size: 19px;
    font-weight: 600;
    text-align: center;
    margin-left: 5px;

    margin-top: 20px;
    margin-bottom: 18px;
}

.link-arrow-icn {
    width: 40px;
    background-color: #cacaca;
    padding: 5px;
    border-radius: 3px;
    cursor: pointer;
}

.it-product-cardvw:hover {
    background-color: rgb(236, 236, 236);
    color: black
}

.slick-slide img {
    margin: 0px !important;
    display: inline-block !important;
}

.it-product-main-box {
    background-color: white;
    padding: 10px;
    border-radius: 7px;
    border: solid 1px rgb(177, 177, 177);
    box-shadow: 2px 2px 10px 3px rgb(230, 230, 230);

}

.it-pro-disply-vws {
    display: flex;
    flex-wrap: wrap;
}

.it-pro-tabvws {
    background-color: white;
    border-radius: 35px;
    border: solid 1px rgb(59, 59, 59);
    padding: 10px;
    display: flex;
}

.it-pro-tab-img {
    width: 45px;
    height: 45px;
}

.pro-web-dvlp-icn {
    width: 80px;
    height: 80px;
    background-color: rgb(226, 226, 226);
    padding: 7px;
    border-radius: 50%;
}

.it-serv-bgdply {
    background-color: rgba(223, 245, 255, 1);
    padding: 40px;

}

.serv-devlp-box {
    background-color: rgb(93, 85, 136);
    padding: 2.4em 2.2em;
    box-shadow: 0 3px 30px rgba(0, 0, 0, .03);
    transition: background-color .3s ease-out, box-shadow .3s ease-out;
    will-change: background-color, box-shadow;
    cursor: pointer;
}

.serv-main-title {
    color: #E7CFB1;
    font-size: 16px;
    font-weight: 600;
    margin-top: 23px;
}

.serv-mainpara {
    font-size: 14px;
    font-weight: 400;
    color: white
}

.serv-devlp-box:hover {
    background-color: #E5813E;
}

.icon-dvlp-size {
    width: 50px;
    height: 50px;
}

.serv-box-icnvws {
    background-color: rgb(230, 230, 230);
    padding: 5px;
    border-radius: 20px;
    width: 60px;
    height: 60px;
}

.blog-card-boxvws {
    background-color: white;
    border-radius: 7px;
    box-shadow: 2px 2px 10px 3px rgb(235, 235, 235);
    border: solid 1px #FEDB5C;
    /* display:flex !important; */
    cursor: pointer;
    border-radius: 35px 0px 35px 0px
}

.blg-card-dtlsvws {
    /* margin-left:15px */
    padding: 15px;
}

.blg-post-date {
    font-size: 13px;
    font-weight: 400;
    color: rgb(61, 61, 61);
}

.blog-post-titlevw {
    font-size: 16px;
    font-weight: 600;
    color: black;
    margin-top: 13px;
}

.blog-post-paradtls {
    font-size: 14.5px;
    font-weight: 500;
    color: rgb(54, 54, 54);
    margin-top: 13px;
}

.blg-post-mainbtn {
    background-color: #FEDB5C;
    color: black;
    padding-left: 25px;
    padding-right: 25px;
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: 25px;
    border: solid 1px #FEDB5C;
    margin-top: 25px;
    margin-bottom: 25px;
}

.blog-post-imgvw {
    height: 100%;
    width: 100%;
    /* max-height:250px; */
    /* max-width:400px; */
    border-radius: 35px 0px 0px 0px;
    /* margin-top:30px; */
    object-fit: contain;
}

.blg-post-mainbtn:hover {
    background-color: #EE212B;
    border: solid 1px #EE212B;
    color: white;
}

.contact-card-box {
    background-color: white;
    border-radius: 10px;
    box-shadow: 2px 2px 15px 3px rgb(236, 236, 236);
    padding: 35px;
    display: flex;

}

.cnt-box-iconvws {
    background-image: linear-gradient(135deg, #0045FF 0%, #BD29F2 100%);
    width: 70px;
    height: 70px;
    padding: 5px;
    border-radius: 10px;
    box-shadow: 2px 2px 10px 3px rgb(235, 235, 235);
    text-align: center;
}

.cnt-box-iconvws img {
    width: 55px;
    height: 55px
}

.cont-info-cardbox {
    margin-top: 70px
}

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

    .blg-card-dtlsvws {
        padding: 7px;
    }

    .blg-post-date {
        font-size: 12px;
        font-weight: 400;
    }

    .blog-post-titlevw {
        font-size: 15px;
        font-weight: 500;

    }

    .blog-post-paradtls {
        font-size: 13.5px;
        font-weight: 400;
        text-align: justify;
    }

    .cont-flex-dply {
        flex-direction: column-reverse;
    }

    .it-serv-bgdply {
        padding: 10px;

    }
}


@keyframes scroll {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(calc(-60px * 10));
    }
}

.slider {
    /* height: 100px; */
    margin: auto;
    overflow: hidden;
    position: relative;
    width: auto;
}

.slider .slide-track {
    animation: scroll 40s linear infinite;
    display: flex;
    width: calc(200px * 14);
}

.slider .slide {
    /* height: 100px; */
    width: 200px;
}


.it-product-bgrund-vw {
    background-image: url('../images/background/itproject-bg.png');
    background-attachment: fixed;
    overflow: hidden;
    background-size: inherit;
    background-position: inherit;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    padding: 50px 0;
}

.it-prdct-card-box {
    padding: 2.235em;
    z-index: 2;
    border: 1px solid rgba(255, 255, 255, 0.1);
    background-color: #fff;
    cursor: pointer;
    /* box-shadow: 2px 2px 10px 1px rgb(235 247 253); */
    color: black !important;
    border-radius: 10px;
    border: 1px solid rgb(23 172 248);
}

.prdct-title-sz {
    margin-top: 30px;
    font-size: 17px;
    font-weight: 650;
    letter-spacing: 0.75px;
    color: #000000;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.slick-initialized .slick-slide>a:last-child>h6>i {
    color: #17acf8 !important;
}

.prdct-para-sz-fnt {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.75px;
    margin-top: 20px;
    line-height: 28px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.it-prdct-card-box:hover {
    background-color: #fff;
    color: #000 !important;
}

.prdct-para-sz-fnt:hover {

    color: black !important;
}

.prd-box-img-styl img {
    background-color: #f3f3f3;
    width: 70px;
    height: 70px;
    padding: 5px;
    border-radius: 3px;
    border: 1px solid #000;

}

.project-background-bgvw {
    /* background-image: url('../images/background/project-vwbg.png');
    background-attachment: fixed;
    overflow: hidden;
    background-size: inherit;
    background-position: inherit;
    background-repeat: no-repeat;
    background-size:100% 100%;
    padding:50px 0; */
    background-color: rgba(236, 236, 236, 1);
    padding: 20px
}

/* .project-web-fltr{
    background-color: white;
    border:solid 1px rgb(223, 223, 223);
    box-shadow:2px 2px 10px 4px rgb(231, 231, 231);
    color:black;
    text-align:start;
    cursor:pointer;

    box-shadow:2px 2px 10px 3px rgb(189, 189, 189)
} */
.pro-web-parafnt {
    padding: 15px;
}

.pro-web-parafnt p {
    font-size: 14.5px;
    font-weight: 500;
    letter-spacing: 0.75px;
    color: black !important;
    margin-top: 7px;
}

.pro-web-parafnt h6 {
    font-size: 17px;
    font-weight: 600;
    letter-spacing: 0.75px;
    line-height: 28px;
    text-align: justify;
    margin-top: 10px
}

.project-fltr-imgbox img {
    width: 100%;
    /* height:300px */
    border-radius: 10px;

}

.nws-letter-inputbox {
    width: 100%;
    padding: 10px;
    font-size: 12px;
    font-weight: 500;
    color: rgb(78, 78, 78);
    margin-top: 16px;
}

.nws-letter-iconsz {
    width: 100%;
    background-color: #014f97;
    color: white;
    padding-left: 25px;
    padding-right: 25px;
    padding-top: 6px;
    padding-bottom: 6px;
    border: solid 1px #014f97;
    margin-top: 10px;
}

.banner-area-bkgrnd {
    position: relative;
    overflow: hidden;
    /* height:100vh; */
}

.banner-area-bkgrnd .bg {
    position: absolute;
    left: 0;
    /* top: 90px; */
    height: 100%;
    width: 100%;
    max-width: 600px;
    background-size: cover;
    background-position: center left;
    /* background-repeat: no-repeat; */

}

.banner-area-bkgrnd.content-mainvw-bg.circle-shape-vw::after {
    position: absolute;
    right: 0;
    top: 0;
    content: "";
    height: 100%;
    width: 50%;
    /* background: url(../front_website/images/background/11.png); */
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    opacity: 1;
}

.banner-area-bkgrnd.content-mainvw-bg .contentvw {
    padding: 50px 50px;
    background: #ffffff;
    margin-top: 50px;
    margin-bottom: 50px;
    box-shadow: 2px 2px 10px 1px rgb(223, 223, 223);
    margin-left: -50px
}

.banner-area-bkgrnd .contentvw {
    z-index: 1000;
    position: relative;
}

/* -----------------------------------Single Service------------------------------------------------- */

.service-banner-size {
    width: 100%;
    /* height:520px */
}

.link-tabs-vws-box {
    background-color: #17acf8;
    /* padding-left:25px;
    padding-right:25px; */
    padding-top: 20px;
    padding-bottom: 20px;
    margin-top: -26px;
    border-top: solid 1px #17acf8;
    border-bottom: solid 1px #17acf8;
    position: sticky;
    top: 90px;
    z-index: 1000;
}

.page-linksvws-tab {
    /* overflow-x: scroll; */
    display: flex;
}

.page-tablinks {
    font-size: 17px;
    font-weight: 500;
    color: white;
    margin-left: 30px;
    cursor: pointer;
}

.serv-page-dtlsvw {
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.75px;
    text-align: justify;
}

.bg-contain-tabbox {
    /* background-color: #17acf8; */
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 25px;
    margin-top: 10px;

}

.serv-dtls-tabmain-box {
    background-color: #fff;
    padding: 20px 20px;
    border-radius: 15px;
    border: 2px solid #1aaef8d5;
}

.srv-dtls-headingtb {
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.75px;
    color: rgb(0 0 0);
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.srv-dtlstb-paravw {
    font-size: 15px;
    font-weight: 500;
    letter-spacing: 0.75px;
    color: rgb(65 61 61);
    margin-top: 3px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.serv-dtls-tabmain-box img {
    width: 100%;
    height: 268px;
    object-fit: cover;
    border-radius: 10px;
    border: 1px solid #17acf8;
}

.all-categry-bgvw {
    background-color: rgb(23 172 248);
    padding: 15px;
    border-radius: 15px;
}

.why-chse-heading {
    font-size: 30px;
    font-weight: 600;
    color: black;
}

.why_choise_img {
    height: 480px;
}

.why_choose_progress .progress-bar {

    background-color: #17acf8 !important;
    border-radius: 20px;
}

.why_choose_progress .progress {
    border-radius: 20px !important;

}

.cursor {
    background-color: transparent !important;
}

.cursor-follower {
    background-color: transparent !important;

}

#tab5-box {
    background: #4bb9f11c;
    margin-top: 38px !important;
    padding: 15px 0 38px 0 !important;
}

.chse-btm-line {
    border-bottom: solid 2px #028AA2;
    width: 130px;
    margin-top: 8px;
}

.all-categry-bgvw>h4 {
    color: #fff;
}

.all-categry-bgvw a {
    color: #fffffffa;
    font-weight: 500;
    font-size: 16px;
    font-family: var(--font-family-DM) !important;
}

#faq__accordian-main-wrapper {
    cursor: pointer;
    border: solid 1px rgba(0, 0, 0, 0.36);
    padding: 25px;
    border-radius: 30px;
    /* margin-top:100px; */
}

.faq__accordion-wrapper {
    border-bottom: solid 1px rgba(82, 82, 82, 0.75);
}

.faq__accordian-heading {
    /* background-color: #eeeeee; */
    padding: 10px 30px 10px 10px;
    display: block;
    margin-top: 10px;
    margin-bottom: 10px;
    position: relative;
    font-size: 18px;
    font-weight: 700;
    /* text-decoration: navajowhite; */
    color: #000000;
}

.faq__accordian-heading::before {
    content: "\2B9F";
    color: rgba(69, 80, 129, 1);
    /* font-family: fontawesome; */
    position: absolute;
    right: 20px;
    top: 50%;
    -webkit-transition: 0.3s linear all;
    -moz-transition: 0.3s linear all;
    -ms-transition: 0.3s linear all;
    -o-transition: 0.3s linear all;
    transition: 0.3s linear all;
    -webkit-transform: translateY(-50%) rotate(0deg);
    -moz-transform: translateY(-50%) rotate(0deg);
    -ms-transform: translateY(-50%) rotate(0deg);
    -o-transform: translateY(-50%) rotate(0deg);
    transform: translateY(-50%) rotate(0deg);
}

.faq__accordian-heading.active {
    background-color: #fff;
    color: rgba(0, 0, 0, 1);
}

.faq__accordian-heading.active::before {
    -webkit-transition: 0.3s linear all;
    -moz-transition: 0.3s linear all;
    -ms-transition: 0.3s linear all;
    -o-transition: 0.3s linear all;
    transition: 0.3s linear all;
    -webkit-transform: translateY(-50%) rotate(360deg);
    -moz-transform: translateY(-50%) rotate(360deg);
    -ms-transform: translateY(-50%) rotate(360deg);
    -o-transform: translateY(-50%) rotate(360deg);
    transform: translateY(-50%) rotate(360deg);
}

.faq__accordian-heading.active::before {
    color: rgba(69, 80, 129, 1);
}

.faq__accordion-content {
    display: none;
    padding: 10px 20px;

}


.accordion-item {
    border: none !important;
}

.accordion button {
    position: relative;
    display: block;
    text-align: left;
    width: 100%;
    padding: 10px;
    color: #525252;
    font-size: 17px;
    font-weight: 500;
    border: none !important;
    background: none;
    outline: none;
}

.accordion button:hover,
.accordion button:focus {
    cursor: pointer;
    color: #027081;
}

.accordion button:hover::after,
.accordion button:focus::after {
    cursor: pointer;
    color: #027081;
    border: 1px solid #027081;
}

.accordion button .accordion-title {
    padding: 10px;
}

.accordion button .icon {
    display: inline-block;
    position: absolute;
    top: 18px;
    right: 10px;
    width: 22px;
    height: 22px;
    border: 1px solid;
    border-radius: 22px;
}

.accordion button .icon::before {
    display: block;
    position: absolute;
    content: '';
    top: 9px;
    left: 5px;
    width: 10px;
    height: 2px;
    background: currentColor;
}

.accordion button .icon::after {
    display: block;
    position: absolute;
    content: '';
    top: 5px;
    left: 9px;
    width: 2px;
    height: 10px;
    background: currentColor;
}

.accordion button {
    background-color: #f1f1f1;
    color: rgb(39, 39, 39);
}

.accordion button[aria-expanded='true'] {
    background-color: #027081;
    color: white;
}

.accordion button[aria-expanded='true'] .icon::after {
    width: 0;
}

.accordion button[aria-expanded='true']+.accordion-content {
    opacity: 1;
    max-height: 9em;
    transition: all 200ms linear;
    will-change: opacity, max-height;
}

.accordion .accordion-content {
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transition: opacity 200ms linear, max-height 200ms linear;
    will-change: opacity, max-height;
}

.accordion .accordion-content p {
    font-size: 1rem;
    font-weight: 500;
    margin: 2em 0;
}




@media only screen and (max-width:767.99px) {
    .banner-area-bkgrnd .bg {
        height: 100%;
        width: 100%;
        max-width: auto;
    }

    .banner-area-bkgrnd.content-mainvw-bg .contentvw {
        padding: 20px 20px;
        margin-left: 0px
    }

    .service-banner-size {
        width: 100%;
        /* height:200px */
    }

    .link-tabs-vws-box {
        margin-top: -5px;
    }

    .page-linksvws-tab {
        overflow-x: scroll;
        /* display: flex; */
    }

    .page-tablinks {
        margin-left: 10px;

    }

    .faq-row-clmns {
        flex-direction: column-reverse;
    }

    .main-faq-imagevws {
        display: none;
    }

    .accordion button .icon {
        display: none;
    }

    .project-background-bgvw {
        padding: 5px
    }
}


.home-page-itprdct {
    border: solid 1px rgba(77, 77, 77, 0.2);
    border-radius: 9px;
    display: flex;
    padding: 15px;
    cursor: pointer;
    background-color: #fff;
}

.hm-page-it-icons {
    width: 100%;
    max-width: 50px;
    height: 50px;
    margin-top: 20px;
}

.hm-page-it-dtls-para {
    margin-left: 20px;
}

.hm-page-it-dtls-para h3 {
    font-size: 18px;
    font-weight: 600;
    color: black;
    text-transform: uppercase;
    margin-top: 10px;
}

.hm-page-it-dtls-para p {
    font-size: 13px;
    font-weight: 400;
    color: rgba(154, 143, 143, 0.87);
    margin-top: -5px;
}

.hm-page-it-dtls-para a p {
    font-size: 14px;
    font-weight: 500;
    margin-top: -8px;
    color: rgba(19, 160, 229, 1);
    text-decoration: underline;
}

.hm-pageit-dtls-btnsvw {
    color: #fff !important;
    background-color: rgba(23, 172, 248, 1);
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 8px;
    padding-bottom: 8px;
    border: none;
    border-radius: 25px;
    font-size: 14px;
    font-weight: 500;
}

.hm-page-titledescpvws-fnt p {
    font-size: 12px;
    font-weight: 500;
    color: rgba(1, 9, 21, 0.6);
    text-transform: uppercase;
}

.hm-page-titledescpvws-fnt p span {
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 3px;
    padding-bottom: 3px;
    background-color: rgba(23, 172, 248, 1);
    border-radius: 25px;
    color: #fff;

}

.hm-page-titledescpvws-fnt h3 {
    font-size: 18px;
    font-weight: 700;
    color: rgba(0, 0, 0, 0.65);
    text-transform: uppercase;
    margin-top: 0px;
    letter-spacing: 0.75px;
}

.hm-page-titledescpvws-fnt {
    margin-top: -17px
}

.serv-arrow-viewbtn {
    background-color: #fff;
    color: black;
    border: solid 2px rgba(23, 172, 248, 1);
    font-size: 14px;
    font-weight: 600;
    border-radius: 25px;
    padding-left: 33px;
    padding-right: 33px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-top: 24px;
    box-shadow: 2px 2px 10px 2px rgb(196, 231, 248)
}

.serv-main-top-space-1 {
    margin-top: 40px;
    padding-left: 8px;
    padding-right: 8px
}

.serv-main-top-space-2 {
    margin-top: -30px;
    padding-left: 8px;
    padding-right: 8px
}

.serv-main-top-space-3 {
    margin-top: 70px;
    padding-left: 8px;
    padding-right: 8px
}

.serv-main-top-space-4 {
    margin-top: 18px;
    padding-left: 8px;
    padding-right: 8px
}

.home-page-banner-sizevws {
    background-image: url('/public/front_website/images/mainbannerimage.png');
    background-repeat: no-repeat;
    background-size: cover;
    padding: 40px 40px 0px;

    background-position: -140px;
}

.banner-main-title-fntsz {
    font-size: 30px;
    font-weight: 600;
    color: #000
}

.banner-form-inputbox {
    border: solid 1px rgba(218, 219, 221, 1);
    color: rgba(134, 142, 150, 1);
    padding: 12px;
    font-size: 15px;
    font-weight: 500;
    width: 65%;
    border-radius: 5px;
    position: relative;
}

.banner-form-send-btnsvw {
    position: absolute;
    background-color: rgba(0, 0, 0, 1);
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 8px;
    padding-bottom: 8px;
    border-radius: 5px;
    border: solid 1px rgba(0, 0, 0, 1);
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    right: 36.5%;
    margin-top: -52px
}

.banner-small-icons {
    display: none;
}

.second-serv-main-bgvw {
    background-image: url('/public/front_website/images/projectbgvw.png');
    background-repeat: no-repeat;
    /* position: relative;
    left:0px; */
    /* margin-left:-155px; */
}

.serv-check-paradtlsvws {
    color: rgba(18, 36, 40, 1);
    font-size: 16px;
    font-weight: 700;
    margin-top: 16px;
}

.second-servview-morebtn {
    background-color: rgba(77, 191, 250, 1);
    border: solid 1px rgba(23, 172, 248, 1);
    color: rgba(255, 255, 255, 1);
    padding-left: 35px;
    padding-right: 35px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 25px;
    margin-top: 40px;
    font-size: 13.5px;
    font-weight: 500;
    width: 100%;
    max-width: 170px;
    box-shadow: 2px 2px 10px 3px rgb(189, 227, 247);
}

.second-digital-service-1 {
    position: relative;
    background-color: rgba(217, 217, 217, 1);
    border-radius: 50%;
    /* padding:50px; */
    text-align: center;
    width: 100%;
    max-width: 230px;
    height: 230px;
    padding: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    /* width:150px;
    height:150px */


}

.second-digital-service-1::before {
    content: '';
    position: absolute;
    /* left: 0;
    top: 0; */
    width: 88%;
    height: 88%;
    border-radius: 100%;
    border: dashed 2px rgba(0, 0, 0, 0.7);
}

.second-digital-service-2 {
    background-color: rgba(23, 172, 248, 1);
    border-radius: 0px 160px 160px 0px;
    padding: 20px;
    width: 100%;
    max-width: 230px;
    height: 230px;
    text-align: center;
}

.inner-second-digital-servbox {
    border: solid 0px rgba(0, 0, 0, 0.7);
    border-radius: 50%;
    width: 200px;
    height: 200px;
    padding: 20px;
    border-style: dashed
}

.second-digital-service-1 h5 {
    font-size: 30px;
    font-weight: 600;
    color: #000;
    margin-top: 45px;

}

.second-digital-service-2 h5 {
    font-size: 30px;
    font-weight: 600;
    color: #000;
    margin-top: 58px
}

.get-intouch-line {
    border-top: solid 2px rgba(19, 160, 229, 1);
    width: 45px;
    margin-left: 7px;
    margin-top: 14px
}

.contact-container {
    padding: 45px
}

.home-page-contact-form {
    background-color: rgba(89, 177, 240, 1);
    border: dashed 2px rgba(255, 255, 255, 1);
    padding: 30px;
    border-radius: 9px;
}


.frm-input-contgetvws {
    width: 100%;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: solid 1px rgba(0, 0, 0, 0.15);
    padding: 5px;
    background: transparent;
    font-size: 16px;
    color: rgba(0, 0, 0);
    font-weight: 500;

}

.submit-query-cont-btns {
    background-color: rgba(255, 255, 255, 1);
    padding-left: 25px;
    padding-right: 25px;
    padding-top: 6px;
    padding-bottom: 6px;
    color: rgba(0, 0, 0, 1);
    border-radius: 7px;
    font-size: 15px;
    font-weight: 500;
    text-align: center;
}

.frm-input-contvw-checkbox {
    border: solid 1px rgba(0, 0, 0, 0.5);

}

.checkbox-legal-dtls {
    font-size: 14.3px;
    color: rgba(0, 0, 0, 1);
    font-weight: 500;
}

.get-in-tch-contact-mainvws {
    margin-top: 100px
}

.main-image-overlay-img {
    position: relative;
}

.overlay-dtls-title {
    position: absolute;
    top: 0;
    background: rgb(0, 0, 0);
    background: rgba(0, 0, 0, 0.55);
    /* Black see-through */
    color: #f1f1f1;
    width: 100%;
    transition: .5s ease;
    opacity: 1;
    color: white;
    padding: 20px;
    text-align: center;
    height: 100%;
    display: flex;
    border-radius: 45px;
    align-items: center;
    justify-content: center;
}

.need-support-dtlsvws {
    /* margin-top:165px */
}

/* .main-image-overlay-img img{
    height:350px
} */
.need-support-dtlsvws h5 {
    font-size: 25px;
    font-weight: 700;
}

.need-support-dtlsvws p {
    font-size: 13px;
    font-weight: 300;
    color: rgba(255, 231, 231, 1)
}

.faq-choose-column-box {
    margin-top: 100px;
}

.testimonial-slide {
    padding: 40px 20px;
    margin-top: 40px;
}

.testimonial_box-top {
    background-color: rgba(255, 255, 255, 1);
    padding: 25px;
    border-radius: 33px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-align: center;
    box-shadow: 5px 5px 20px rgba(152, 193, 217, 0.493);
    border: solid 1px rgba(97, 97, 97, 0.31);

}

.testimonial_box-text {
    margin-top: 30px
}

.testimonial_box-text h3 {
    font-size: 17px;
    font-weight: 700;
    color: rgb(0, 0, 0);
    text-align: center;
}

.testimonial_box-text p {
    color: rgba(2, 2, 2, 1);
    font-size: 14.3px;
    text-align: center;
}

.testimonial_box-img {
    position: absolute;
    top: -40px
}

.slick-dots li.slick-active button:before {
    opacity: 1 !important;
    color: black !important;
    background-color: #000;
    border-radius: 50%;


}

.slick-dots li button {
    width: 15px !important;
    height: 15px !important
}

.slick-dots li button:before {
    font-size: 5px !important;
    color: rgba(255, 255, 255, 1) !important;
    opacity: 1 !important;
    background-color: rgba(255, 255, 255, 1);
    border-radius: 50%;
    width: 15px !important;
    height: 15px !important
}

.slick-dots li {
    margin: 3px !important;
    box-shadow: 2px 2px 10px 3px rgb(190, 190, 190);
    border-radius: 50%;
    width: 15px !important;
    height: 15px !important;
}


.slick-prev:before {
    content: '\2B60' !important;
    background-color: rgba(3, 5, 6, 1) !important;
    padding-left: 7px !important;
    padding-right: 7px !important;
    padding-top: 1px !important;
    padding-bottom: 3px !important;
    border-radius: 15px !important;
}

.slick-next:before {
    content: '\2B62' !important;
    background-color: rgba(3, 5, 6, 1) !important;
    padding-left: 7px !important;
    padding-right: 7px !important;
    padding-top: 1px !important;
    padding-bottom: 3px !important;
    border-radius: 15px !important;

}

.slick-prev:before,
.slick-next:before {
    opacity: 1 !important;
    font-size: 20px !important;
}

.item-slider-main-1 {
    border: solid 1px rgba(0, 0, 0, 0.42);
    border-radius: 30px;
    padding: 20px
}

.blog-home-page-boxvws {
    border: solid 1px rgba(0, 0, 0, 0.42);
    border-radius: 30px;
    padding: 20px;
    background-color: #fff;
}

.home-blog-vwmore-btns {
    background-color: rgba(0, 0, 0, 1);
    color: #fff;
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 7px;
    padding-bottom: 7px;
    border-radius: 25px;
    border: solid 1px rgba(0, 0, 0, 1);
    box-shadow: 2px 2px 10px 2px rgb(145, 145, 145);
    font-size: 15px;
    font-weight: 500;
}

.blog-main-trend-box .first-date {
    font-size: 14px;
    font-weight: 500;
    margin-top: 15px;
    text-transform: uppercase;
    text-align: start;
}

.blog-main-trend-box .main-titlesz {
    font-size: 21px;
    font-weight: 700;
    margin-top: 10px;
    color: rgba(0, 0, 0, 1);
    text-align: start;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.blog-main-trend-box .main-paradtlsvws {
    font-size: 16px;
    font-weight: 500;
    margin-top: 10px;
    color: rgba(2, 2, 2, 1);
    text-align: start;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}



.project_area .item-slider li img {
    /* width: 448PX; */
    /* height: 448PX; */
    /* object-fit: cover; */
}

@media only screen and (max-width:1023.99px) {
    .slick-next:before {
        margin-left: -49px;

    }

    .slick-prev:before {
        margin-left: 20px;
    }

    .testimonial_box-text {
        margin-top: 25px
    }

    .faq-choose-column-box {
        margin-top: 30px;
    }

    .faq__accordian-heading {
        font-size: 16.5px;
    }

    #faq__accordian-main-wrapper {
        padding: 6px;
        border-radius: 10px;

    }

    .need-support-dtlsvws {
        /* margin-top:140px */
    }

    .get-in-tch-contact-mainvws {
        margin-top: 30px
    }

    .contact-container {
        padding: 10px
    }

    .second-serv-main-bgvw {
        margin-left: 0px;
    }

    .second-digital-service-1 {
        max-width: 180px;
        height: 180px;
        padding: 10px
    }

    .second-digital-service-2 {
        max-width: 180px;
        height: 180px;
        padding: 15px;
    }

    .inner-second-digital-servbox {
        width: 160px;
        height: 160px;
        padding: 15px;
    }

    .second-digital-service-1 h5 {
        margin-top: 16px;
    }

    .second-digital-service-2 h5 {
        margin-top: 30px
    }

    .get-intouch-line {
        margin-top: 34px
    }

    .main-call-locate-dtlsvws {
        margin-top: -22px
    }

    .home-page-contact-form {
        padding: 10px;
    }
}

@media only screen and (max-width:767.99px) {
    .home-page-itprdct {
        padding: 5px;
    }

    .hm-page-it-dtls-para h3 {
        font-size: 16px;
        font-weight: 500;
    }

    .hm-page-it-dtls-para {
        margin-left: 10px;
    }

    .main-column-mobvw {
        padding-left: 3px;
        padding-right: 3px
    }

    .hm-page-titledescpvws-fnt p {
        margin-top: 20px
    }

    .serv-main-top-space-1 {
        margin-top: 15px;
        padding-left: 8px;
        padding-right: 8px
    }

    .serv-main-top-space-2 {
        margin-top: 15px;
        padding-left: 8px;
        padding-right: 8px
    }

    .serv-main-top-space-3 {
        margin-top: 15px;
        padding-left: 8px;
        padding-right: 8px
    }

    .serv-main-top-space-4 {
        margin-top: 15px;
        padding-left: 8px;
        padding-right: 8px
    }

    .home-page-banner-sizevws {
        padding: 5px
    }

    .banner-main-title-fntsz {
        font-size: 22px;
        font-weight: 600;
    }

    .banner-form-inputbox {
        width: 100%;
    }

    .banner-form-send-btnsvw {
        right: 20px;
    }

    .main-flex-dirtn {
        flex-direction: column-reverse;
    }

    .banner-small-icons {
        display: block;
    }

    .blog_main_area {
        padding: 100px 0 !important;
    }
}









/* vijay css  */

.project_box>.image {
    position: relative;
    border-radius: 10px;
    overflow: hidden;
}

.project_box>.image>img {
    max-width: 100%;
    max-height: 250px;
    width: 100%;
    object-fit: cover;
}

.project_box>.image::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    /* background-color: #0000005c; */
}

.project_box {
    position: relative;
    cursor: pointer;
    border: 2px solid #1aadf8;
    border-radius: 12px;
    overflow: hidden;
    padding: 15px;
    height: 100%;
}

.project_box>.content {
    padding: 15px 0;
}

.project_box>.content>h4 {
    font-size: 22px;
    color: black;
    font-weight: 700;
    margin: 8px 0;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.project_box>.content>ul {
    padding-left: 0px;
    display: flex;
    justify-content: space-between;
}

.project_box>.content>ul>li {
    list-style: none;
    font-size: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: bold;
    color: #000;
}

.project_box>.content>ul>li>span {
    font-size: 16px;
    font-weight: 600;
    color: black;
}

.project_box>.content>.amount {
    color: black;
    font-weight: 600;
}

.project_box>.content>.amount>span {
    color: black;
    font-weight: 600;
    /* font-size: 18px; */
}

.project_box>.content>.buttons>a {
    padding: 5px 15px;
    border-radius: 20px;
    background-color: #1aadf8;
    font-size: 14px;
    color: white;
}

.project_box>.content>.buttons {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 15px;
}

.project_box>.content>.buttons>a:first-child {
    background-color: transparent;
    border: 2px solid #1aadf8;
    color: #1aadf8;
}

.project_box>.image>span {
    position: absolute;
    bottom: 19px;
    z-index: 22;
    right: 13px;
    border-radius: 50px;
    background: #1aadf8;
    padding: 2px 15px;
    font-size: 15px;
    color: white;
    display: none;
}

.blog_main_area {
  position: relative;
  overflow: hidden;
  z-index: 1;
  height: 100%;
}

.blog_main_area::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url('/public/front_website/images/blog_bg.svg') center/cover no-repeat;
  transition: transform 2s ease, filter 2s ease;
  z-index: -1;
}

/* Hover effect — zoom the background image */
.blog_main_area:hover::before {
  transform: scale(1.1); /* zoom-in */
  filter: brightness(1.1) saturate(1.2); /* thoda color enhance */
}
.blog_main_inner{
    padding: 110px 0px;
}
.blog_main_inner>h4 {
    font-size: 55px;
    font-family: "Aoboshi One", serif;
    color: black;
}

.blog_main_inner>h1 {
    font-size: 55px;
    font-family: "Aoboshi One", serif;
    color: black;
}

.blog_main_inner>p {
    color: black;
    margin-top: 5px;
}


.blog_main_area::after {
    content: '';
    position: absolute;
    left: 41%;
    top: 42px;
    width: 293px;
    height: 293px;
    background-color: #17acf8d9;
    filter: blur(146px);
}

.z-11 {
    position: relative;
    z-index: 11;
}


.sidebar-widget {
    padding: 25px 20px;
    background-color: #DAF2FE;
    height: 100%;
    border-radius: 12px;
}

.sidebar-title>h5 {
    color: black !important;
}

.cat-list li a {
    border-bottom: 0;
    font-size: 14px;
}

.cat-list {
    border: none !important;
    background-color: #fff;
    padding: 15px 0;
}

.cat-list li a i {
    padding: 7px 7px 5px;
    background-color: #daf2fe;
    border-radius: 100%;
    color: black;
    line-height: normal;
    font-size: 13px;
}

.cat-list li:hover>a {
    background-color: transparent;
}

.page-item>a {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-item>span {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.page-item {
    margin: 0 8px;
    border-radius: 100%;
}

.page-item>a {
    border-radius: 100%;
    line-height: normal;
    border: 1px dashed #0000ff;
}

.page-item.active>span {
    border-radius: 100%;
    line-height: normal;
    border: 1px dashed #0000ff;

}

.page-item:first-child .page-link {
    border-radius: 100% !important;
    line-height: normal;
    height: 38px;
    width: 37px;
    color: transparent !important;
    position: relative;
    background-color: #0d6efd;
}


.page-item:first-child .page-link::before {
    content: "\f284";
    /* content: "\f285"; */
    position: absolute;
    display: inline-block;
    font-family: bootstrap-icons !important;
    font-style: normal;
    font-weight: 600 !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    vertical-align: -.125em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #fff;
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    left: 0;
    top: 0;

}

.page-item:last-child .page-link {
    border-radius: 100% !important;
    line-height: normal;
    height: 38px;
    width: 37px;
    color: transparent !important;
    background-color: #0d6efd;

    position: relative;
}

.page-item:last-child .page-link:focus {
    background-color: #0000ff !important;
}

.page-item:first-child .page-link:focus {
    background-color: #0000ff !important;
}

.page-item:last-child .page-link::before {
    /* content: "\f284"; */
    content: "\f285";
    position: absolute;
    display: inline-block;
    font-family: bootstrap-icons !important;
    font-style: normal;
    font-weight: 600 !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    vertical-align: -.125em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #fff;
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    left: 0;
    top: 0;

}

.page-link:focus {
    background-color: transparent !important;
}

.page-link:hover {
    border-color: #0d6efd;
}

.page-item.disabled {
    opacity: 0.8;
}

.we_area_inner1>h4 {
    letter-spacing: 0.75px;
    text-transform: uppercase;
    font-size: 25px;
    font-weight: 700;
    color: #000;
}

.we_area_inner1>p {
    font-size: 14px;
    line-height: 30px;
    font-weight: 400;
    color: var(--grey);
    margin: 0;
    font-family: "Jost", sans-serif !important;
}

.we_arr_area {
    padding: 50px 0;
}

.container_new {
    padding: 0 25px 0 0;
}

.we_area_inner1>ul {
    display: inline-grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 15px;
    width: 100%;
}

.we_area_inner1>ul>li {
    color: black;
    margin: 5px 0;
    display: flex;
    align-items: center;
    gap: 8px;
    align-items: center;
}

.we_area_inner1>a {
    padding: 8px 30px;
    margin-top: 20px;
    border-radius: 50px;
    color: #fff;
    text-decoration: none;
    background-color: #4DBFFA;
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    transition: all ease 0.5s;
}

.we_area_inner1>a:hover {
    box-shadow: 2px 2px 10px 2px #17adf864;
    transition: all ease 0.5s;

}

.we_arr_area {
    position: relative;
}

.we_arr_area::before {
    content: '';
    background: url(../images/round_shap.png);
    position: absolute;
    right: -152px;
    top: 90px;
    width: 500px;
    height: 500px;
}

.req-cont-boxvw {
    background: url(../images/background_quote.png);
    border: none !important;
    padding: 50px 50px !important;
}

.abt-call-btns {
    background-color: white !important;
}

.abt-call-btns>a {
    color: black !important;

}

.contact_area {
    padding: 50px 0;
}

.contact_area>.container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 80px;
}

.contact_inner>span {
    color: black;
    font-size: 14px;
    position: relative;
    display: flex;
    align-items: center;
    width: fit-content;
}


.contact_inner>span::before {
    position: absolute;
    content: '';
    width: 40px;
    height: 2px;
    background-color: #13A0E5;
    right: -50%;
}

.contact_inner>h4 {
    color: black;
    font-size: 33px;
    font-weight: bold;
    max-width: 80%;
}

.contact_inner>ul>li {
    display: flex;
    gap: 10px;
    align-items: start;
    margin-bottom: 12px;
}

.contact_inner>ul>li>span {
    background-color: black;
    padding: 15px;
    border-radius: 100%;
    height: 50px;
    width: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
}

.contact_inner>ul {
    display: inline-grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 15px;
    width: 100%;
    margin-top: 32px;
}

.login_area_inner>img {
    width: 100% !important;
}

.login_area_inner1 {
    padding: 11px 20px;
    background-color: #17acf873;
    border-radius: 20px;
}

.sign-button {
    background-color: #000000 !important;
    color: white;
    border: solid 2px #000000 !important;
    border-radius: 8px;

}

.sign-button:hover {
    color: white !important;
}

.login_area {
    padding-top: 30px;
}

.login_area_inner1>.box-bg {
    background-color: transparent;
    width: 100%;
    box-shadow: none;
}

.quotation {
    padding: 50px 0;
}

.quotation_headding_1 {
    color: black;
    font-size: 25px;
}

/* .proposal_btn > a {
    color: #fff !important;
    background: linear-gradient(90deg, rgba(23,172,248,1) 0%, rgba(0,200,255,1) 100%);
    padding: 11px 30px;
    border: none;
    border-radius: 70px;
    font-size: 14px;
    font-weight: 500;
    display: flex;
    margin-top: 14px;
    position: relative;
    overflow: hidden;
    transition: all 0.4s ease;
} */
.cta-01 {
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 25px;
    height: 50px;
    min-width: 140px;
    font-family: "Montserrat", sans-serif;
    font-weight: 600;
    font-size: 12px;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    border-radius: 70px; /* Rounded like modern button */
    border: none;
    cursor: pointer;

    /* Gradient background using #69cafb */
      background: linear-gradient(90deg, #69cafb 0%, #064077 100%);    
     Color: white;
    transition: all 0.3s ease-out;
    z-index: 1;
}

/* Pseudo-elements for hover overlay */
.cta-01::before,
.cta-01::after {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-radius: 50%;
    z-index: 0; /* behind text */
    transition: all 0.5s ease;
}

.cta-01::after {
    background-color: rgba(255, 255, 255, 0.3); /* light shimmer overlay */
}

.cta-01::before {
    background: rgba(105, 202, 251, 0.5); /* semi-transparent version of main color */
}

/* Text inside button */
.cta-01 span {
    position: relative;
    z-index: 2; /* above pseudo-elements */
    transition: all 0.3s ease-out;
    color: #fff;
}

/* Hover animation */
.cta-01:hover span {
    color: #fff; /* keep text visible or you can use darker shade */
}

.cta-01:hover::after,
.cta-01:hover::before {
    width: 200px;
    height: 200px;
    border-radius: 50%;
}

.cta-01:hover::after {
    transition: all 0.7s ease-in;
}

.cta-01:hover::before {
    transition: all 0.5s ease-in;
}

/* Optional: slight scale pop on hover */
.cta-01:hover {
    transform: scale(1.05);
}



.main_service_area {
    position: relative;
    padding: 150px 0;
    position: relative;
    margin-bottom: 15px;
    border-bottom: 2px dashed #69cafb;
}

/* .caption-box>h4{
    display: none !important;
} */

.main_sa_innner>h1 {
    font-size: 40px;
    color: black;
    text-transform: uppercase;
    font-weight: 700;
}

.main_sa_innner>.select_box_v {
    width: fit-content;
    background-color: #17adf836;
    margin: auto;
    padding: 10px;
    border-radius: 7px;
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 15px;

}

.main_sa_innner>.select_box_v>select {
    min-width: 450px;
    padding: 12px;
    background-color: white;
    border-radius: 7px;
}

.main_sa_innner>.select_box_v>input {
    min-width: 450px;
    padding: 12px;
    background-color: white;
    border-radius: 7px;
    line-height: normal;
}

.main_sa_innner>.select_box_v>button {
    padding: 12px 38px;
    border-radius: 7px;
    background: #17acf8;
    color: white;
    font-weight: 600;
    line-height: normal;

}

.main_service_area::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 50%;
    background: url(../images/sub_left.svg);
    background-repeat: no-repeat;
    background-position: left;
}

.main_service_area::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    width: 50%;
    background: url(../images/sub_right.svg);
    background-repeat: no-repeat;
    background-position: right;
}




.content-overviw>img {
    /* width: 250px;
    height: 220px; */
    /* object-fit: cover; */
}

/* .slick-initialized .slick-slide {
    display: block;
    border: solid 1px rgba(0, 0, 0, 0.42);
    border-radius: 30px;
    padding: 20px;
    background-color: #fff;
} */
/* vijay Responcive code start  */
@media screen and (max-width: 992px) {

    .contact_area>.container {

        padding: 0 20px;
    }

    .main_sa_innner>.select_box_v>select {

        min-width: 250px;
    }

    .main_sa_innner>.select_box_v>input {

        min-width: 250px;
    }
}

@media screen and (max-width: 550px) {
    .container_new {
        padding: 0 25px 0 25px;
    }

    .we_area_inner1>ul {
        grid-template-columns: repeat(1, 1fr);
    }

    .contact_inner>ul {
        grid-template-columns: repeat(1, 1fr);
    }

    .main_sa_innner>h1 {
        font-size: 20px;
    }

    .main_service_area::before {
        width: 100%;
    }

    .main_service_area::after {
        display: none;
    }

    .main_sa_innner>.select_box_v>select {

        min-width: 150px;
    }

    .main_sa_innner>.select_box_v>input {

        min-width: 150px;
    }

    .main_sa_innner>.select_box_v>button {
        padding: 12px 25px;
        font-size: 14px;
    }

    .project_box>.content>.buttons>a {
        padding: 1px 9px;
        border-radius: 20px;
        background-color: #1aadf8;
        font-size: 10px;
        color: white;
    }
}

.contact-call-title {
    font-size: 15px;
    font-weight: 500;
    color: #000;
    text-align: center
}

.contact-call-subtitle {
    font-size: 14px;
    font-weight: 500;
    color: #000;
    text-align: center;
    margin-top: 10px
}



/* suctom service page  */
.custom-service {
    padding: 60px 0px;

}

.custom-service .row {
    row-gap: 30px;
}

.c-service-card {
    background-color: #17acf8;
    position: relative;
    border-radius: 30px;
    transition: all .3s ease;
}

.c-service-card .c-service-card-img-bx {
    position: relative;
}


.c-service-card .c-service-card-img-bx img {
    width: 100%;
    height: 270px;
    object-fit: cover;
    border-radius: 30px 0 0 0;
    position: relative;
    background-image: url(../images/web-design-concept-with-drawings.jpg);
    mask-image: url(../images/web-kit.png);
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
}

.c-service-card .c-service-card-img-bx a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


.c-service-card .c-service-card-icon {
    position: absolute;
    top: 62%;
    transform: translateY(-60%);
    background: #fff;
    width: 94px;
    height: 94px;
    border-radius: 0 50px 50px 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    right: 12%;
    box-shadow: 0 15px 20px rgba(7, 60, 0, .15);
}

.c-service-card .c-service-card-icon img {
    border: none;
    border-radius: 0;
    box-shadow: none;
    height: auto;
    max-width: 100%;
}

.c-service-card-content {
    margin-top: -5px;
}

.c-service-card-content h6 {
    padding-left: 30px;
    max-width: 275px;
    margin-bottom: 0;
    padding-bottom: 20px;
    padding-top: 20px;

}

.c-service-card-content h6 a {
    color: #FFFFFF;
    font-family: "Plus Jakarta Sans", Sans-serif;
    font-size: 24px;
    font-weight: 600;
    line-height: 1.5;
}

.c-service-card:hover {
    background: #0672a1;
    scale: 1.1;
}

.c-service-card .pxl-post--inner {
    background: var(--secondary-color);
    position: relative;
    border-radius: 30px;
    transition: all .3s ease;
}


/* news letter section   */
.newsletter-banner {
    padding: 50px 0px;
}

.call-action-banner {
    background-color: #096fa6;
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* background: url('../images/call-action.jpg') no-repeat center center; 
    background-size: cover; */
    position: relative;
    padding: 30px 40px;
    border-radius: 15px;
    color: #fff;
    overflow: hidden;
}

/* Overlay to make text readable */
/* .call-action-banner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5); 
    border-radius: 15px;
    z-index: 1;
  }
   */
/* Content above overlay */
.newsletter-left,
.newsletter-right {
    position: relative;
    z-index: 2;
}

.newsletter-left {
    max-width: 55%;
}

.newsletter-left h2 {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 10px;
}

.newsletter-left p {
    font-size: 16px;
    opacity: 0.9;
    color: #fff;
}

.newsletter-right .newsletter-form {
    display: flex;
    gap: 10px;
}

.newsletter-form {
    display: flex;
    align-items: center;
    gap: 10px;
}

.input-box {
    position: relative;
    width: 250px;
}

.input-box i {
    position: absolute;
    top: 50%;
    left: 18px;
    transform: translateY(-50%);
    color: #000;
    font-size: 16px;
}

.input-box input {
    width: 100%;
    padding: 12px 15px 12px 40px;
    /* left padding icon ke liye space */
    border-radius: 30px;
    border: none;
    outline: none;
    background: #f5f5f5;
}

.newsletter-form button {
    background: #7cc7ec;
    color: #fff;
    border: none;
    padding: 12px 25px;
    border-radius: 30px;
    font-weight: 600;
    cursor: pointer;
    transition: 0.3s;
}

.newsletter-form button:hover {
    background: #7cc7eccb;
}

/* Responsive */
@media (max-width: 768px) {
    .newsletter-banner {
        flex-direction: column;
        text-align: center;
        gap: 20px;
    }

    .newsletter-left {
        max-width: 100%;
    }

    .newsletter-form {
        flex-direction: column;
    }

    .newsletter-form input,
    .newsletter-form button {
        width: 100%;
    }
}



/* service detail page new design css  */


.service-detail-main {
    padding: 60px 20px;

}

.d-main-content {
    margin: 30px 0px;
}

.d-main-content p {
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.75px;
    text-align: justify;
}

.detail-left {
    position: relative;
}

/* sticky sidebar box */
/* .categroy-box {
    position: sticky;
    top: 100px; 
  } */

/* optional: make it scroll if content too long */
.categroy-box::-webkit-scrollbar {
    width: 6px;
}

.categroy-box::-webkit-scrollbar-thumb {
    background: #17acf8;
    border-radius: 10px;
}

.cate-item {
    position: relative;
    border-radius: 100px;
    border: 1px solid #17acf8;
    display: flex;
    align-items: center;
    gap: 18px;
    margin-bottom: 8px;
    overflow: hidden;
    margin-top: 18px;
}

/* full clickable link */
.cate-item a {
    position: absolute;
    inset: 0;
    z-index: 5;
}

/* main flex content */
.pxl-item--icon {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    z-index: 2;
    /* content stays above background */
    transition: color 0.3s linear;
    padding: 10px;
}

/* background layer */
.pxl-item--icon::before {
    content: '';
    position: absolute;
    width: 0;
    height: 100%;
    top: 0;
    left: 0;
    border-radius: inherit;
    background-color: #17acf8;
    z-index: 1;
    /* stays below icons */
    transition: all 0.3s linear;
}

/* hover effect */
.cate-item:hover .pxl-item--icon::before {
    width: 100%;
}

/* hover text + icon color */
.cate-item:hover .pxl-item--label,
.cate-item:hover i {
    color: #fff;
}

/* icon box */
.d-icon-box {
    width: 40px;
    height: 40px;
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 3;
    /* above layer */
}

.d-icon-box img {
    width: 25px;
    height: 25px;
    position: relative;
    z-index: 3;
    /* above layer */
}

/* arrow icon */
.pxl-icon--arrow {
    position: relative;
    z-index: 3;
    /* above layer */
}

.pxl-item--label {
    position: relative;
    z-index: 3;
    color: #333;
    margin: 0;
}


.cate-item h6 {
    /* margin-right: 60px; */
    font-size: 16px;
    font-weight: bold;
    margin-left: -70px;
}

.cate-item i {
    font-size: 16px;
    font-weight: bold;
    margin-left: -40px;
}


.right-list-content {}

.right-list-content h3 {
    position: relative;
    font-size: 22px;
    margin-bottom: 14px;
    color: #333;
    padding-bottom: 10px;
    margin-top: 10px;
}

.right-list-content h3::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 50px;
    /* line length */
    height: 3px;
    /* line thickness */
    background-color: #17acf8;
    border-radius: 2px;
}

.right-list-content p {
    font-size: 15px;
    color: #666;
    margin-bottom: 20px;
}

.right-list-content ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.right-list-content ul li {
    list-style: circle;
    position: relative;
    padding-left: 0px;
    margin-bottom: 12px;
    font-size: 15px;
    color: #333;
    margin-left: 30px;
}

.right-list-content ul li i {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    color: #17acf8;
}



.card-image.card-image img {
    width: 100%;
    display: block;
}

.card-image.card-image {
    margin-bottom: -100px;
}


.card-image img {
    width: 100%;
    display: block;
}

.cleaning-card {
    width: 85%;
    margin: 40px auto;
    position: relative;
    font-family: sans-serif;
}

/* Top Image */
.card-image img {
    width: 100%;
    display: block;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

/* Bottom Curved PNG */
.card-overlay {
    background: url(https://www.ahitechno.com/storage/images/mark-pn.png) no-repeat top center;
    background-size: cover;
    position: relative;
    top: -83px;
    padding: 200px 20px 20px;
    text-align: center;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    box-sizing: border-box;
}

/* Content */
.card-content h3 {
    margin: 0;
    font-size: 25px;
    color: #fff;
    margin-bottom: 8px;
    font-weight: bold;
}

.card-content p {
    font-size: 16px;
    color: #fff;
    margin-bottom: 15px;
}

.card-content a {
    color: #fff;
}

.whatsapp-btn {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    background: #17acf8;
    color: #fff;
    padding: 10px 15px;
    border-radius: 10px;
    font-weight: 600;
    width: fit-content;
    margin: 0 auto;
    transition: all 0.3s ease;
}

.whatsapp-btn img {
    width: 20px;
    height: 20px;
}

.whatsapp-btn:hover {
    background: #7cc7ec;
    transform: translateY(-2px);
}



.search-box {
    position: relative;
    width: 100%;
    max-width: 350px;
    background: #fff;
    border-radius: 50px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    overflow: hidden;
    transition: all 0.3s ease;
    border: 2px solid #7cc7ec;
}

.search-box input {
    flex: 1;
    border: none;
    outline: none;
    padding: 12px 18px;
    font-size: 16px;
    border-radius: 50px 0 0 50px;
    color: #333;
}

.search-box button {
    background: #7cc7ec;
    border: none;
    padding: 12px 20px;
    color: white;
    cursor: pointer;
    border-radius: 0 50px 50px 0;
    transition: background 0.3s ease, transform 0.2s ease;
}

.search-box button:hover {
    background: #66b5dc;
    transform: scale(1.05);
}

.search-box input::placeholder {
    color: #aaa;
}

.why-faq-section {
    background: #f8fbfd;
    padding: 60px 25px;
}

.section-title {
    font-size: 28px;
    font-weight: 700;
    color: #0d3c61;
    margin-bottom: 20px;
    position: relative;
}

.section-title::after {
    content: "";
    display: block;
    width: 60px;
    height: 3px;
    background: #7cc7ec;
    margin-top: 8px;
    border-radius: 2px;
}

.why-box p {
    color: #555;
    line-height: 1.7;
    margin-bottom: 20px;
}

.why-list {
    list-style: none;
    padding: 0;
}

.why-list li {
    margin-bottom: 10px;
    font-size: 16px;
    color: #333;
}

.why-list i {
    color: #7cc7ec;
    margin-right: 8px;
}

/* FAQ Section */
.faq-box .accordion-button {
    background: #fff;
    color: #0d3c61;
    font-weight: 600;
    border: none;
    box-shadow: none;
}

.faq-box .accordion-button:focus {
    box-shadow: none;
}

.faq-box .accordion-button:not(.collapsed) {
    color: #fff;
    background-color: #7cc7ec;
}

.faq-box .accordion-body {
    background: #fff;
    color: #555;
    line-height: 1.7;
}

.accordion-item {
    border: none;
    margin-bottom: 10px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}



.project_box .c-heart {
    position: absolute;
    padding: 2px 10px;
    border-radius: 20px;
    background-color: #1aadf8;
    font-size: 14px;
    color: white;
    top: 16px;
    right: 20px;
}



.p-c-icon img {
    width: 18px;
    height: 18px;
}


.cus-cart {
    padding: 10px 10px;
    border: 1px solid #028aa2;
    border-radius: 5px;
}

.contact-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding: 8px 15px;
    background: #fff;
    border: 1px solid #028aa2;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    font-weight: 600;
    transition: transform 0.3s;
}

.contact-box span {
    font-size: 16px;
    color: #333;
}

.contact-icons {
    display: flex;
    gap: 12px;
}

.contact-icons .icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    background: #028AA2;
    color: #fff;
    border-radius: 50%;
    font-size: 15px;
    transition: all 0.3s ease;
}

.contact-icons .icon:hover {
    background: #fff;
    color: #17acf8;
    border: 2px solid #17acf8;
    transform: scale(1.2);
}





/* new contact css  */
.new-contact {
    padding: 60px 0px;
}

.contact-card {
    border: 1px solid #065f91;
    padding: 25px 20px;
    border-radius: 10px;
    text-align: center;
    transition: all 0.4s ease;
    height: 100%;
}

.contact-card .c-card-icon {
    background-color: #065f91;
    width: 60px;
    height: 60px;
    text-align: center;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0px auto;
}

.contact-card h4 {
    font-size: 28px;
    color: #065f91;
    font-weight: bold;
    margin-top: 14px;
}

.contact-card p {
    font-size: 16px;
    font-weight: 500;
    color: #5c5e5e;
}

.contact-card .c-card-icon img {
    width: 30px;
    height: 30px;
}

.contact-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 10px 25px rgba(23, 172, 248, 0.3);
    border-color: #17acf8;
}

.new-contact {
    background: #fff;
    font-family: 'Poppins', sans-serif;
}

.new-contact .highlight {
    color: #17acf8;
}

.new-contact .contact-form .form-control,
.new-contact .contact-form .form-select {
    border: 1px solid #065f91;
    border-radius: 30px;
    padding: 12px 20px;
    font-size: 15px;
    transition: all 0.3s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.new-contact .contact-form .form-control:focus,
.new-contact .contact-form .form-select:focus {
    border-color: #17acf8;
    box-shadow: 0 0 8px rgba(23, 172, 248, 0.3);
    outline: none;
}

.new-contact .contact-form textarea {
    border-radius: 20px;
}

.new-contact .btn-submit {
    background: #065f91;
    color: #fff;
    font-weight: 600;
    border-radius: 30px;
    padding: 12px 30px;
    border: none;
    transition: 0.3s ease;
}

.new-contact .btn-submit:hover {
    background: #17acf8;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(23, 172, 248, 0.3);
}

.new-contact-second {
    padding-top: 60px;

}

.new-contact-second h6 {
    color: #065f91;
}

@media (max-width: 768px) {
    .new-contact h2 {
        font-size: 30px;
    }

    .new-contact {
        padding: 25px 0px;
    }

    .new-contact .f-row {
        gap: 20px;
    }

    .new-contact-second {
        padding-top: 30px;
        text-align: center;
    }

}




/* blog page custom css  */

.blog-social-box {
    background-color: #fff;
    margin-top: 14px;
    border-radius: 10px;
    padding: 10px;
}


.blog-social-box .b-social-icon {
    display: flex;
    justify-content: space-evenly;
    text-align: center;

}

.blog-social-box .b-social-icon a {
    width: 40px;
    height: 40px;
    background-color: #daf2fe;
    border-radius: 50%;
}

.blog-social-box .b-social-icon a i {
    font-size: 22px;
    /* text-align: center; */
    line-height: 40px;
    color: #17acf8;
}

.b-recent-post {
    width: 100%;
    max-width: 400px;
    background: #fff;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    font-family: "Poppins", sans-serif;
    margin-top: 14px;
}

.b-recent-post h4 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 8px;
    color: #333;
    position: relative;
}

.b-recent-post .underline {
    width: 60px;
    height: 3px;
    background: #17acf8;
    margin-bottom: 20px;
    border-radius: 3px;
}

.post-item {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
    transition: all 0.3s ease;
}

.post-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

.post-item img {
    width: 70px;
    height: 70px;
    border-radius: 10px;
    object-fit: cover;
    margin-right: 15px;
}

.post-content h5 {
    font-size: 15px;
    margin: 0;
    color: #222;
}

.post-content h5:hover {
    color: #007bff;
    cursor: pointer;
}

.post-content .date {
    display: block;
    font-size: 12px;
    color: #888;
    margin-top: 4px;
}

/* blog detail custom css    */

/* .b-d-s-button{
    padding: 20px 20px !important;
} */



.project_box {
    position: relative;
    overflow: hidden;
}

/* Invisible overlay link for the whole card */
.project_box .overlay-link {
    position: absolute;
    inset: 0;
    /* shorthand for top:0; right:0; bottom:0; left:0 */
    z-index: 1;
    background: transparent;
}

/* Ensure buttons and heart icon are ABOVE overlay */
.project_box .buttons a,
.project_box .c-heart {
    position: relative;
    z-index: 5;
}

/* Optional: hover effect for nice feel */
.project_box:hover {
    transform: translateY(-4px);
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.project_box .buttons a:hover {
    color: #fff;
    background: #007bff;
    border-radius: 6px;
}

.c-heart {
    position: absolute !important;
    top: 10px;
    right: 10px;
    z-index: 5;
    font-size: 20px;
    color: #ff3b3b;
    cursor: pointer;
}


.p-get-Quo {
    padding: 0;
}

.p-get-Quo .get-btn {
    background-color: #ffffff;
    border-radius: 5px;
    padding: 10px;
    box-shadow: 2px 2px 30px 2px rgb(238, 238, 238);
    border: solid 1px #028AA2;
    background-color: #028AA2;
    text-align: center;
}

.p-get-Quo .get-btn a {
    color: #fff;
}


/* thank you page css  */


.thanks-sec {
    padding: 50px 0px;
    background-color: #028aa2;
}


.thanks-content {
    background-color: #fff;
    border-radius: 12px;
    padding: 40px 30px;
    text-align: center;

}

.thanks-content img {
    width: 100px;
    height: 100px;
}

.thanks-content h2 {
    font-size: 50px;
    font-weight: bold;
    color: #000;
    margin-top: 20px;
}

.thanks-content p {
    font-size: 20px;
    font-weight: bold;
    color: #3b3a3acf;
    width: 50%;
    margin: 20px auto;
}

.thank-btns {
    display: flex;
    justify-content: center;
    text-align: center;
    align-items: center;
    gap: 20px;
}

.thank-btns a {
    background-color: #17acf8;
    padding: 10px 16px;
    color: #fff;
    font-size: 16px;
    border-radius: 5px;
    transition: all 0.8s;
}

.thank-btns a:hover {
    background-color: #028aa2;

}

@media (max-width: 768px) {
    .thanks-sec {
        padding: 25px 0px;
    }

    .thanks-content {
        padding: 20px 20px;
    }

    .thanks-content p {
        font-size: 17px;
        width: 100%;
        margin: 15px auto;
    }

    .thank-btns a {
        padding: 5px 8px;
        font-size: 14px;
    }

    .thanks-content h2 {
        font-size: 38px;
        margin-top: 15px;
    }

    .contact-container {
        padding: 25px;
    }

    .footer-bottom-box {
        padding: 10px;
    }

    .search-box input {


        padding: 0px 10px;
        font-size: 16px;
        border-radius: 50px 0 0 50px;
        color: #333;
    }

    .call-action-banner {
        padding: 20px 14px;
        flex-direction: column;
    }

    .newsletter-banner {
        padding: 20px 0px;
    }

    .why-faq-section {
        background: #f8fbfd;
        padding: 18px 0px;
    }

    .custom-service {
        padding: 25px 0px;
    }

    .newsletter-left h2 {
        font-size: 24px;
        font-weight: 500;
        margin-bottom: 3px;
    }

    .newsletter-left p {
        font-size: 15px;
        line-height: 20px;
        margin-bottom: 20px;
    }

    .cleaning-card {
        margin: 0px auto;
        margin-top: 20px;
        margin-bottom: -70px;
    }

    .service-detail-main {
        padding: 20px 0px;
    }

}



.blog-content ul li {

    list-style-type: circle;
    margin-left: 20px;

}

.blog-content ul li::marker {
    color: #000;
    font-size: 18px;
    margin-left: 10px;
}


.detail-left h4 {
    font-size: 22px;
    color: #000;
    background-color: aliceblue;
    padding: 8px;
    font-weight: 500;
    border-radius: 20px;
}


.name-badge {
    padding: 40PX 0PX;
    background-color: #0679a7;
}

.name-badge ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 25px;
}

.name-badge ul li {
    background-color: #fff;
    padding: 5px;
    color: #000;
    border-radius: 4px;
    transition: transform 220ms ease, box-shadow 220ms ease;
    /* will-change: transform; */
    transform-origin: center center;
}

.name-badge ul li a {
    color: #000;
    font-size: 16px;
}

.name-badge ul li:hover {
    transform: scale(1.05);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .12);

}

.name-badge ul li:focus-within,
.name-badge ul li:focus {
    transform: scale(1.05);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
    outline: none;
}

.name-badge-title h2 {
    text-align: center;
    font-size: 34px;
    color: #fff;
    font-weight: 500;
}

.name-badge-title p {
    text-align: center;
    font-size: 18px;
    color: #fff;
    margin-bottom: 20px;
}

@media (max-width: 768px) {
    .name-badge ul {
        gap: 10px;
    }

    .name-badge ul li a {
        font-size: 14px;
    }

    .name-badge ul li {
        padding: 3px;

    }

    .name-badge-title p {
        font-size: 15px;
        margin-bottom: 13px;
        line-height: 20px;
    }

    .name-badge-title h2 {
        font-size: 28px;
    }

    .main_sa_innner>.select_box_v {

        flex-direction: column;
    }
}



.hm-it-product-custom {
    align-items: center !important;
    cursor: pointer;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}
/* Hover effect */
.hm-it-product-custom:hover {
    transform: translateY(-5px); /* slight lift */
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08); /* subtle shadow */
    border-color: rgba(77, 77, 77, 0.3); /* slightly darker border */
}

.hm-it-product-custom img {
    width: 180px !important;
    height: auto !important;
    max-width: 200px !important;
    margin-top: 0 !important;
}




/* new wrapper area css  */


#custom-newsletter {
   padding: 50px 20px;
}

#custom-newsletter h2 {
    font-weight: 600;
    font-size: 28px;
    margin-bottom: 10px;
}
.news-info-card {
  border: 1px solid #d0d7e2;
  border-radius: 10px;
  overflow: hidden;
  background: linear-gradient(135deg, #f9fbff, #17acf873);
  transition: 0.3s;
  text-align: center;
}
.news-info-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.1);
}
.news-info-card img {
  width: 80%;
  height: auto;

}
.news-info-card p {
      color: #333;
    font-size: 18px;
    text-align: center;
}

/* #custom-newsletter .newsletter-slider a img:hover {
    transform: scale(1.05);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
} */




/* Card background */
#special-product-box .inner-box {
    background-color: #17acf8;
    /* Sky Blue */
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1);
    padding: 15px;
}

/* Top Product Code p tag */
#special-product-box .top-code {
    background-color: #fff;
    /* White bg */
    color: #00aaff;
    /* Sky blue text */
    font-weight: 600;
    border-radius: 6px;
    margin-bottom: 15px;
    padding: 6px 0;
}

/* Heading h3 text */
#special-product-box h3 {
    color: #fff;
    /* White text */
    margin-bottom: 15px;
}

/* Main content text */
#special-product-box .lower-content,
#special-product-box .lower-content .pro-dtl-main-vw span {
    color: #fff;
    /* White text */
}

#special-product-box .lower-content,
#special-product-box .lower-content .pro-dtl-main-vw p {
    color: #fff;
    /* White text */
}

/* Buttons styling */
#special-product-box .add-cart,
#special-product-box .view-dtls-btn {
    background-color: #fff;
    color: #00aaff;
    padding: 8px 15px;
    border-radius: 6px;
    font-weight: 500;
    text-decoration: none;
    transition: 0.3s;
}

/* Buttons hover effect */
#special-product-box .add-cart:hover,
#special-product-box .view-dtls-btn:hover {
    background-color: #000;
    color: #fff;
}

.lower-content>p {
    color: white !important;
}


/* hire devloper page css  */
#hire-developers {
    position: relative;
    background: url('https://images.unsplash.com/photo-1556761175-5973dc0f32e7') center/cover no-repeat;
    padding: 60px 0;
    color: #fff;
    overflow: hidden;
}

#hire-developers::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.65);
    z-index: 0;
}

#hire-developers .container {
    position: relative;
    z-index: 1;
}

#hire-developers .hire-content h2 {
    font-size: 2.5rem;
    line-height: 1.3;
}

#hire-developers .hire-content ul li {
    margin-bottom: 10px;
    font-size: 1rem;
}

#hire-developers .hire-form {
    backdrop-filter: blur(4px);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

#hire-developers .form-control {
    border-radius: 0.5rem;
}

#hire-developers .btn-primary {
    background-color: #17acf8;
    border: none;
    border-radius: 0.5rem;
    transition: 0.3s ease;
}

#hire-developers .btn-primary:hover {
    background-color: #0056b3;
}


/* dedicated developers area css  */


#dedicated-developers {
  padding: 60px 0;
  background-color: #fff;
}

#dedicated-developers .dev-img {
  max-width: 90%;
  border-radius: 10px;
  transition: transform 0.4s ease;
}

#dedicated-developers .dev-img:hover {
  transform: scale(1.03);
}

#dedicated-developers .dev-content h2 {
  color: #17acf8; 
  font-size: 1.9rem;
  line-height: 1.4;
}

#dedicated-developers .dev-content p {
  font-size: 1.05rem;
  color: #444;
  line-height: 1.7;
}


/* top developers  area css  */


#top-developers {
  padding: 60px 0;
  background: linear-gradient(314deg, #17acf875, #b4d5ebe6);
}

#top-developers h2 {
    font-size: 38px;
    color: #17acf8;
}

#top-developers p {
 color: #6d6565;
  font-size: 1.05rem;
  line-height: 1.7;
}

#top-developers .developer-card {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

#top-developers .developer-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
}

#top-developers .dev-icon {
  width: 60px;
  height: 60px;
  object-fit: contain;
}


/* remote developers area css  */


#remote-developer-benefits {
  padding: 90px 0;
  background-color: #fff;
}

#remote-developer-benefits h2 {
  font-size: 38px;
}

#remote-developer-benefits p {
  color: #444;
  font-size: 1.05rem;
  line-height: 1.7;
}

/* Gradient Cards */
#remote-developer-benefits .benefit-card {
  background: linear-gradient(135deg, #17acf8, #0062a3);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

#remote-developer-benefits .benefit-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
}

#remote-developer-benefits .benefit-icon {
  width: 60px;
  height: 60px;
  object-fit: contain;
}



/* developers tab area css  */


#developer-tabs {
  background-color: #17acf824;
  padding: 90px 0;
}
#developer-tabs .dev-tab-title h2{
    color: #17acf8;
}
#developer-tabs .tab-slider {
  display: flex;
  gap: 15px;
  overflow: hidden;
}
#developer-tabs .tab-btn {
    padding: 6px 10px;
    border-radius: 30px;
    white-space: nowrap;
    cursor: pointer;
    font-weight: 500;
    transition: all 0.3s 
ease;
}
#developer-tabs .tab-btn.active {
  background: linear-gradient(135deg, #17acf8, #0062a3);
  color: #fff;
  border-color: transparent;
}
#developer-tabs .tab-content {
  display: none;
}
#developer-tabs .tab-content.active {
  display: block;
  animation: fadeIn 0.6s ease;
}
@keyframes fadeIn {
  from {opacity: 0; transform: translateY(10px);}
  to {opacity: 1; transform: translateY(0);}
}


#developer-tabs .tab-slider {
    background-color: #fff;
    border: 1px solid #bba9a9;
    border-radius: 40px;
    padding: 0px 5px;
}

#developer-tabs .tab-content .row {
    padding: 25px;
    border-radius: 10px;
}
#developer-tabs .tab-content .row h3{
    margin-top: 50px;
    color: #17acf8;
}
#developer-tabs .tab-content .row img{
    max-width: 400px;
    height: auto;
}


#developer-tabs .tab-content .row a{
    display: inline-block;
    margin-top: 30px;
    background-color: #17acf8;
    color: #fff;
    padding: 8px 12px;
    border-radius: 10px;
      transition: all 0.3s ease;
}
#developer-tabs .tab-content .row a:hover{
  background-color: #064c80;
}


/* info faq section area css  */
#info-faq-section {
    background: #17acf8cf;
    padding: 60px 0;
}
#info-faq-section h2,
#info-faq-section p {
  color: #f0f0f0;
}
#info-faq-section .faq-list {
  margin-top: 20px;
}
#info-faq-section .faq-item {
  margin-bottom: 15px;
  border-radius: 8px;
  overflow: hidden;
  background: #162447;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
}
#info-faq-section .faq-question {
  width: 100%;
  text-align: left;
  padding: 15px 20px;
  border: none;
  outline: none;
  background: #162447;
  color: #f0f0f0;
  font-size: 1rem;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  transition: background 0.3s ease;
}
#info-faq-section .faq-question:hover {
  background: #1f4068;
}
#info-faq-section .faq-icon {
  font-weight: bold;
  transition: transform 0.3s ease;
}
#info-faq-section .faq-item.active .faq-icon {
  transform: rotate(45deg); /* + turns to x */
}
#info-faq-section .faq-answer-2 {
  max-height: 0;
  overflow: hidden;
  padding: 0 20px;
  background: #1b1b38;
  color: #dcdcdc;
  transition: max-height 0.4s ease, padding 0.3s ease;
}
#info-faq-section .faq-item.active .faq-answer-2 {
  padding: 15px 20px;
  max-height: 500px !important; /* enough to show content */
}
#info-faq-section .faq-image {
  max-width: 100%;
  border-radius: 12px;

}



/* testimonials section area css  */

#testimonials-section {
  position: relative;
  background: url('https://images.unsplash.com/photo-1498050108023-c5249f4df085?auto=format&fit=crop&w=1470&q=80') center/cover no-repeat fixed;
  padding: 80px 0;
  overflow: hidden;
}
#testimonials-section .overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(26, 26, 46, 0.7); /* dark overlay */
  z-index: 1;
}
#testimonials-section .container {
  position: relative;
  z-index: 2;
}
#testimonials-section h2 {
  color: #fff;
  margin-bottom: 40px;
}

#testimonials-section .head-bt-text {
    width: 70%;
    margin: auto;
}

/* Testimonial slider */
.testimonial-slider {
  display: flex;
  gap: 30px;
}

/* Testimonial card */
#testimonials-section .testimonial-card {
    background: #fff;
    color: #000;
    padding: 25px 20px;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}
#testimonials-section .testimonial-card .stars {
  color: #ffc107; /* gold stars */
  font-size: 1.1rem;
  margin-bottom: 15px;
}
.testimonial-card .testimonial-content {
  font-size: 0.95rem;
  margin-bottom: 20px;
}
#testimonials-section .testimonial-card .profile {
    display: flex;
    align-items: center;
    gap: 12px;
}
#testimonials-section .testimonial-card .profile-img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  margin-bottom: 8px;
  object-fit: cover;
  border: 2px solid #ffc107;
}
#testimonials-section .testimonial-card .profile-name {
  font-weight: 600;
  font-size: 0.95rem;
}

/* Slick slider overrides */
/* .slick-slide {
  display: flex !important;
  justify-content: center;
}
.slick-dots li button:before {
  color: #ffc107;
} */




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

.main-faq-sec {
    background-color: #def3fe;
    padding: 60px 0px;
}

.main-faq-sec .global-label h2 {
    font-size: 30px;
    text-align: center;
   
    font-weight: 500;
}



/* hire call to action area css  */
#hire-developer-section .cta-box {
    display: inline-block;
    padding: 40px 25px;
    border-radius: 12px;
   background: linear-gradient(135deg, #17acf8, #06588b);
    color: #fff;
    text-align: center;
    max-width: 900px;
    width: 100%;
}
#hire-developer-section .cta-box h2 {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 25px;

}
#hire-developer-section .cta-buttons .cta-btn {
    display: inline-block;
    margin: 5px 10px;
    padding: 10px 20px;
    border: 2px solid #fff;
    border-radius: 6px;
    color: #fff;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.3s ease;
}
#hire-developer-section .cta-buttons .cta-btn:hover {
    background: rgba(255,255,255,0.2);
}
#hire-developer-section .cta-buttons .cta-btn i {
    margin-right: 8px;
}



/* custom responsive css  */
/* Responsive */
@media (max-width: 991.98px) {
  #dedicated-developers {
    text-align: center;
  }
  #dedicated-developers .dev-content {
    margin-top: 30px;
  }
}


@media (max-width: 768px) {
    .hm-it-product-custom img {
        width: 100px !important;
        height: auto !important;
        max-width: 200px !important;
    }

         #hire-developers {
        padding: 30px 0;
        text-align: center;
    }
    #dedicated-developers {
    padding: 30px 0;
    background-color: #fff;
}

  #hire-developers .hire-form {
  margin-top: 30px;
  }
      #top-developers {
        padding: 30px 0;
    }

  #top-developers h2 {
    font-size: 1.7rem;
  }

  #remote-developer-benefits {
    padding: 30px 0;
  }
  #remote-developer-benefits h2 {
    font-size: 1.7rem;
  }

   #developer-tabs {
    padding: 30px 0;
  }
  #developer-tabs h2 {
    font-size: 1.7rem;
  }
  #developer-tabs .tab-content .row img {
    max-width: 100%;
    height: auto;
}
#developer-tabs .tab-content .row a {
    margin-bottom: 20px;
  }
  .main-faq-sec {
    background-color: #bcdded8f;
    padding: 30px 0px;
}

#developer-tabs .tab-btn {
    padding: 5px 5px;
    
}

#dedicated-developers .dev-content h2 {
   text-align: justify;
}
#dedicated-developers .dev-content p {
   text-align: justify;
}
}

/* service about contact  */

.service-about-contact h2{
    font-size: 38px;
    color: #000;
    font-weight: 500;
}

.service-about-contact h3{
    font-size: 35px;
    color: #000;
    font-weight: 500;
   margin-top: 15px;
}
.service-about-contact h5{
    font-size: 25px;
    color: #000;
    font-weight: 500;
   margin-top: 10px;
}


.slick-prev, .slick-next{
z-index: 99 !important;
}

/* ===============================
   QUOTATION FORM – FINAL CSS
   =============================== */

/* SECTION */
.qt-section {
  padding: 70px 15px;
  background: #f5f7fa;
}

.qt-container {
  max-width: 1100px;
  margin: auto;
}

/* CARD */
.qt-card {
  background: #fff;
  padding: 40px;
  border-radius: 16px;
  box-shadow: 0 20px 50px rgba(0,0,0,0.08);
}

/* TITLE */
.qt-title {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 30px;
  border-left: 5px solid #064279;
  color: #064279;
  padding-left: 15px;
}

/* GRID */
.qt-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 22px;
}

.qt-full {
  grid-column: 1 / -1;
}

/* LABEL */
.qt-field label {
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 6px;
  display: block;
  color: #111;
}

/* INPUTS */
.qt-field input,
.qt-field select,
.qt-field textarea {
  width: 100%;
  height: 46px;
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid #dcdcdc;
  font-size: 14px;
  background: #fff;
}

.qt-field textarea {
  height: auto;
  min-height: 110px;
  resize: vertical;
}

.qt-field input:focus,
.qt-field select:focus,
.qt-field textarea:focus {
  border-color: #000;
  outline: none;
  box-shadow: 0 0 0 2px rgba(0,0,0,0.08);
}

/* PHONE FIELD */
.qt-phone-wrap {
  display: flex;
  gap: 10px;
}

.qt-phone-wrap select {
  max-width: 90px;
}

/* BUTTON */
.qt-btn {
  width: 100%;
  background: #06497e;
  color: #fff;
  border: none;
  padding: 14px;
  font-size: 16px;
  border-radius: 12px;
  font-weight: 600;
  cursor: pointer;
}

.qt-btn:hover {
  background: #065e90;
}

/* ALERTS */
.qt-alert {
  padding: 12px 15px;
  border-radius: 10px;
  margin-bottom: 20px;
  font-size: 14px;
}

.qt-alert.success {
  background: #e7f7ee;
  color: #0f5132;
}

.qt-alert.error {
  background: #fdecea;
  color: #842029;
}

/* ===============================
   SAAS STYLE WRAPPER
   =============================== */

.quote-saas {
  padding: 90px 15px;
  background: linear-gradient(180deg, #065e90 0%, #17acf8 100%);
}

.quote-saas-box {
  background: #ffffff;
  margin: auto;
  padding: 48px;
  border-radius: 14px;
  border: 1px solid #e5e7eb;
  max-width: 1100px;
}

/* HEADING */
.quote-saas-box .quotation_headding_1 {
  font-size: 26px;
  font-weight: 600;
  color: #111827;
  margin-bottom: 32px;
}

/* LABELS */
.quote-saas-box label {
  font-size: 15px;
  font-weight: 600;
  color: #000;
  margin-bottom: 6px;
}

/* FORM CONTROLS */
.quote-saas-box .form-control,
.quote-saas-box select,
.quote-saas-box textarea {
  border-radius: 10px;
  border: 1px solid #d1d5db;
  padding: 12px 14px;
  font-size: 14px;
  background: #fff;
   height: auto !important;
}

.quote-saas-box .form-control:focus {
  border-color: #000;
  box-shadow: 0 0 0 2px rgba(0,0,0,0.08);
}

/* SUBMIT BUTTON */
.quote-saas-box .sign-button {
  background: #06497e;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  border-radius: 10px;
  padding: 14px;
  margin-top: 10px;
  border: none;
}

.quote-saas-box .sign-button:hover {
  background: #065e90;
}

/* ALERTS */
.quote-saas-box .alert {
  border-radius: 10px;
  font-size: 14px;
}

/* ===============================
   MOBILE FIX (IMPORTANT)
   =============================== */

@media (max-width: 768px) {

    .qt-section, .quote-saas {
        padding: 25px 0px;
    }

  .qt-card,
    .qt-card, .quote-saas-box {
        padding: 10px 8px;
        border-radius: 10px;
    }

  .qt-title,
  .quotation_headding_1 {
    font-size: 20px;
    margin-bottom: 20px;
  }

  .qt-grid {
    grid-template-columns: 1fr;
    gap: 4px;
  }
  .qt-grid {
    display: block;
}

  .qt-field input,
  .qt-field select,
  .qt-field textarea,
  .quote-saas-box .form-control {
    height: 44px;
    font-size: 14px;
    padding: 10px 12px;
  }

  .qt-field textarea {
    min-height: 90px;
  }

  .qt-phone-wrap select {
    max-width: 80px;
    padding: 8px;
  }

    .qt-btn, .quote-saas-box .sign-button {
        padding: 6px;
        font-size: 13px;
        border-radius: 10px;
    }

 
}


.custom-inputs{
    display: flex;
}
.custom-inputs select{
    padding: 0px 0px !important;
    width: 40% !important;
    outline: none !important;

}
.custom-inputs input{
    padding: 0 !important;
    color: #000 !important;
    outline: none !important;
}
.custom-inputs select:focus,
.custom-inputs input:focus{
   
    box-shadow: none !important;
}