* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

::-webkit-selection { 
    background: rgba(254, 205, 56,.6);
    color: #000; 
}
::-ms-selection { 
    background: rgba(254, 205, 56,.6);
    color: #000; 
}
::-moz-selection { 
    background: rgba(254, 205, 56,.6);
    color: #000; 
}
::selection { 
    background: rgba(254, 205, 56,.6);
    color: #000; 
}

body {
    /* font-family: 'Montserrat', sans-serif; */
    /* font-family: 'Raleway', sans-serif; */
    font-family: 'Open Sans', sans-serif;
    font-size: 18px;
    color: rgb(33, 33, 33);
    line-height: 1.5;
    margin: 0;
    padding: 0;
}

ol,ul,li {
    list-style-type: none;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6, p,
ol,ul,li {
    margin: 0;
    padding: 0;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    line-height: 1.35;
}

a,
a:hover,
a:focus {
    text-decoration: none;
    outline: 0;
}
.form-control:focus {
    outline: 0;
}

.container {
    max-width: 1550px;
}
/* ========== Comman CSS ========== */
.heading h2 {
    font-weight: 400;
}
.font-weight-semibold {
    font-weight: 500!important;
}
.cursor-pointer {
    cursor: pointer;
}
.mx-100 {
    max-width: 100px;
}
.mx-150 {
    max-width: 150px;
}
.mx-220 {
    max-width: 220px;
}
.mx-250 {
    max-width: 250px;
}
.mx-300 {
    max-width: 300px;
}
.mx-400 {
    max-width: 400px;
}
.mx-500 {
    max-width: 500px;
}
.mx-600 {
    max-width: 600px;
}
.mx-700 {
    max-width: 700px;
}
.mx-800 {
    max-width: 800px;
}
.mx-1000 {
    max-width: 1000px;
}
.container-md {
    max-width: 1200px;
}
.container-lg {
    max-width: 1400px;
}
.bg-no-repeat {
    background-repeat: no-repeat!important;
}
.border-darkYellow {
    border-color:#f3b835!important;
}
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
    background: #000;
}
.z-index-9 {
    position: relative;
    z-index: 9;
}
.object-fit-cover {
    object-fit: cover;
}
label {
    color: #727272;
    font-weight: 500;
    font-size: 14px;
}
.grey-gradient {
    background: #232526;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to left, #414345, #232526);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to left, #414345, #232526); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.yellow-gradient-border:before {
    content: '';
    left: 15px;
    right: 15px;
    top: 0;
    height: 1px;
    position: absolute;
    background: -webkit-linear-gradient(to right, #ffffff, #e4ad31, #ffffff);
    background: linear-gradient(to right, #ffffff, #e4ad31, #ffffff);
}
footer .yellow-gradient-border:before {
    background: -webkit-linear-gradient(to right, #000000, #e4ad31, #000000);
    background: linear-gradient(to right, #000000, #e4ad31, #000000);
}
.index-banner {
    padding-bottom: 40px;
    z-index: 1;
}
.hover-link:after {
    content: '';
    position: absolute;
    bottom: -5px;
    background: rgb(228, 173, 49);
    height: 2px;
    margin: auto;
    width: 0;
    left: 50%;
    right: 50%;
}
.hover-link:hover:after {
    width: 100%;
    left: 0;
    right: 0;
}
.bullets {
    display: inline-block;
    height: 30px;
    min-width: 30px;
    background: rgba(243, 184, 53,.1);
    position: relative;
}
.bullets.sm {
    height: 14px;
    min-width: 14px;
}
.bullets.md {
    height: 50px;
    min-width: 50px;
}
.bullets:before {
    content: '';
    position: absolute;
    height: 8px;
    width: 8px;
    background: #f3b835;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.bullets.md:before {
    height: 16px;
    width: 16px;
}
.bullets,
.menu-icon,
.bullets:before,
.social-links>li> a:after {
    -webkit-border-radius: 100%;
    border-radius: 100%;
}
.list-decimal > li {
    list-style-type: decimal;
}
.list-lower-alpha > li {
    list-style-type: lower-alpha;
}
.word-break {
    word-break: break-all;
}
/* ========== End Comman CSS ========== */

/* ========== Background Color CSS ========== */
.bg-black {
    background-color: #000000!important;
}
.bg-sm-grey {
    background-color: #f5f5f5!important;
}
.bg-yellow {
    background-color: #fecd38!important;
}
/* ========== End Background Color CSS ========== */

/* ========== Color CSS ========== */
.text-black {
    color: #000!important;
}
.text-yellow {
    color: #fecd38!important;
}
.text-darkYellow {
    color: #e4b214!important;
}
.contact-us-wrapper .contact-number *,
.text-darkGrey {
    color: #9e9e9e!important;
}
.text-fadeBlack {
    color: #2b2b2b!important;
}
footer .contact-number * {
    color: #ffffff!important;
}
/* ========== End Color CSS ========== */

/* ========== Comman Button CSS ========== */
.btn {
    border:0;
    padding: .375rem 1.25rem;
    outline: 0!important;
    font-weight: 500;
}
.btn-group-lg>.btn, .btn-lg {
    font-size: 1.15rem;
}
button,
.form-control,
.form-control:focus {
    outline: 0!important;
    box-shadow: none;
}
.form-control:focus {
    border-color: #000;
}
.global-radius,
.btn-hvr-shutter:before,
.btn-app-link {
    -webkit-border-radius: 50px;
    -ms-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px
}
.radius-12,
.border-animation:before,
.bottom-border-up:after,
.view-description.fancybox-content {
    -webkit-border-radius: 12px;
    -ms-border-radius: 12px;
    -moz-border-radius: 12px;
    border-radius: 12px;
}
.btn-hvr-shutter {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    position: relative;
    -webkit-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s;
}
.btn-hvr-shutter:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: -1px;
    bottom: -1px;
    left: -1px;
    right: -1px;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-transition-property: transform;
    transition-property: transform;
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}
.btn-hvr-shutter:hover:before,
.btn-hvr-shutter:focus:before, 
.btn-hvr-shutter:active:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}

/* Yellow Button */
.btn-yellow {
    background-color: #fecd38;
    color: #000000;
}
.btn-yellow.btn-hvr-shutter {
    background-color: #fecd38;
}
.btn-yellow.btn-hvr-shutter:before {
    background-color: #000000;
}
.btn-yellow:hover,
.btn-yellow:active,
.btn-yellow:focus {
    color: #fecd38;
}
/* End Yellow Button */

/* black Button */
.btn-black {
    background-color: #000000;
    color: #ffffff!important;
}
.btn-black.btn-hvr-shutter {
    background-color: #000000;
}
.btn-black.btn-hvr-shutter:before {
    background-color: #fecd38;
}
.btn-black:hover,
.btn-black:active,
.btn-black:focus {
    color: #000000!important;
}
/* End black Button */

/* black Button */
.btn-white {
    background-color: #ffffff;
    color: #000000;
}
.btn-white.btn-hvr-shutter {
    background-color: #ffffff;
}
.btn-white.btn-hvr-shutter:before {
    background-color: #fecd38;
}
.btn-white:hover,
.btn-white:active,
.btn-white:focus {
    color: #000000;
}
/* End black Button */

/* ========== End Comman Button CSS ========== */

/* ========== Form Realted Comman CSS ========== */
.resize-none {
    resize: none;
}
.mh-150 {
    min-height: 150px;
}

/* Custom Checkbox */
.custom-checkbox input[type="checkbox"] {
    opacity: 0;
    visibility: hidden;
    cursor: pointer;
}
.custom-checkbox .checkmark .check:before {
    content: '';
    height: 22px;
    width: 22px;
    border: 1px solid #8b837f;
    display: inline-block;
    -webkit-border-radius:3px;
    -ms-border-radius:3px;
    -moz-border-radius:3px;
    border-radius:3px;
}
.custom-checkbox.white .checkmark .check:before {
    border: 1px solid #fff;
}
.custom-checkbox.white .checkmark{
    color:#fff;
}
.checkmark {
    cursor: pointer;
}
.checkmark > span {
    display: inline-block;
    line-height: 16px;
}
.custom-checkbox input:checked ~ .checkmark .check:after {
    content: '';
    height: 8px;
    width: 15px;
    display: inline-block;
    border: 2px solid #000000;
    transform: rotate(-45deg);
    position: absolute;
    left: 4px;
    top: 6px;
    border-width: 0px 0px 3px 3px;
}
.custom-checkbox .check {
    position: relative;
    height: 22px;
}
.custom-checkbox input:checked ~ .checkmark .check:before {
    background: #fcd048;
    border-color: #fcd048;
}
/* End Custom Checkbox */

/* ========== End Form Realted Comman CSS ========== */

/* ========== CSS for Fullpage Modal ========== */
.fancybox-content {
    padding: 0;
}
/* ========== End CSS for Fullpage Modal ========== */

/* ========== CSS for Header section ========== */
.navbar {
    z-index: 10;
}
.navbar-nav .nav-item {
    padding-left: 8px;
    padding-right: 8px;
    margin: 0 5px;
}
.navbar-brand {
    max-width: 100px;
}
.navbar-brand img {
    width: 100%;
}
.navbar-nav .nav-link {
    display: inline-block;
    color: #000;
    font-weight: 500;
    padding: .35rem 1rem;
    position: relative;
}
.fixed-header .navbar-nav .nav-link {
    color: #000;
}
.navbar-nav .active > .nav-link,
.navbar-nav .nav-link:hover {
    color: #e4b214;
}
.navbar-nav .active > .nav-link span, 
.navbar-nav .nav-link:hover span {
    font-weight: 500;
}

#navBar .navbar-nav > .nav-item > .nav-link span {
    padding: 4px 14px 3px;
    display: inline-block;
    border-radius: 24px;
}
.hs-has-sub-menu:after {
    content: '';
    height: 8px;
    width: 8px;
    border: 2px solid black;
    display: inline-block;
    border-top: 0;
    border-left: 0;
    position: absolute;
    top: 12px;
    right: 2px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
}
.u-header__sub-menu-nav-link {
    font-weight: 400!important;
    font-size: 14px;
}
.u-header__mega-menu-col .list-unstyled li:not(:first-child) {
    margin-top: 10px;
}
nav .fa-angle-down {
    color: #000;
}
.menu-icon {
    display: inline-block;
    height: 36px;
    width: 36px;
    box-shadow: 0px 6px 10px 1px rgba(0,0,0,.15);
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 15px;
    background-size: 20px;
    background-color: #3d3d3d;
}
.menu-icon.sm {
    height: 36px;
    width: 36px;
    background-size: 20px;
}
.for-business {
    background-image: url(../images/icons/business.png);
}
.for-professionals {
    background-image: url(../images/icons/professional.png);
}
.for-client {
    background-image: url(../images/icons/clinet.png);
}
.for-sport {
    background-image: url(../images/icons/sport.png);
}
.for-spa {
    background-image: url(../images/icons/spa.png);
}
.for-clients {
    background-image: url(../images/icons/clients.png);
}
.site-header .btn {
    margin: 0 5px;
}
/* ========== End CSS for Header section  ========== */

/* ========== CSS for Hamburger Menu ========== */
.navbar-toggler-icon {
    width: 32px;
    height: 21px;
    position: relative;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    cursor: pointer;
}
.navbar-toggler-icon span {
    display: block;
    position: absolute;
    height: 2px;
    width: 100%;
    background: #000;
    border-radius: 9px;
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .2s ease-in-out;
    -moz-transition: .2s ease-in-out;
    -o-transition: .2s ease-in-out;
    transition: .2s ease-in-out;
}
.navbar-toggler-icon span:nth-child(1) {
    top: 0px;
}
.navbar-toggler-icon span:nth-child(2),
.navbar-toggler-icon span:nth-child(3) {
    top: 9px;
}
.navbar-toggler-icon span:nth-child(4) {
    top: 18px;
}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon span:nth-child(2) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon span:nth-child(1), 
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon span:nth-child(4) {
    top: 9px;
    opacity: 0;
}
/* ========== End CSS for Hamburger Menu ========== */

/* ========== CSS for Index Banner Slider ========== */
.overlay-black:before {
    content: '';
    background-color: rgba(0,0,0,.75);
    z-index: 1;
}
/* .about-banner.overlay-black:before {
    background-color: rgba(0,0,0,.85);
} */
.overlay-black:before,
.index-banner-img {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}
.features-advertisement {
    background-color: rgba(0,0,0,.85);
}
.index-banner-img {
    background-repeat: no-repeat;
    background-position: center top;
}
#banner-slider .item {
    max-height: 900px;
}
.banner-content {
    z-index: 9;
    /* max-width: 800px; */
}
.banner-content h1 {
    font-size: 54px;
    color: #000;
    line-height: 48px;
    font-weight: 800;
}
.banner-content p {
    font-size: 18px;
    /* font-weight: 300; */
}
.testimonial-user-name p {
    font-size: 18px;
}
#testimonial-slider .owl-dots .owl-dot.active span, 
#testimonial-slider .owl-dots .owl-dot:hover span {
    background-color:#e4ac00;
    transform: scale(1.4);
}
.testimonial-quote {
    font-size: 20px;
    position: absolute;
    color: #e4ac00;
    bottom: 0;
    right: 0;
    height: 44px;
    width: 44px;
    background: white;
    text-align: center;
    line-height: 44px;
    -webkit-box-shadow: 0px 1px 21px 3px rgba(0,0,0,.25 );
    box-shadow: 0px 1px 21px 3px rgba(0,0,0,.25 );
}
.testimonial-img {
    width: 120px;
    height: 120px;
}
.testimonial-img img {
    height: 100%;
}
.designation-text {
    font-size: 14px;
    line-height: 18px;
    display: inline-block;
    min-height: 36px
}
.textimonial-youtube .fa-youtube {
    font-size: 36px;
    color: red;
}
.testimonial-section .textimonial-youtube {
    position: absolute;
    right: 20px;
    top: 20px;
}
.play-btn {
    height: 40px;
    width: 40px;
    margin-left: 30px;
    cursor: pointer;
    z-index: 20;
    color: #fecd38!important;
    font-size: 30px;
    position: relative;
}
.play-btn > span {
    height: 40px;
    width: 40px;
    background: #636363;
    margin: auto;
}
.play-btn i {
    position: absolute;
    top: 5px;
    left: 16px;
}
.play-btn:hover span {
    background-color: #fff;
}
.play-btn:hover {
    color: #636363!important;
}

/* ========== End CSS for Index Banner Slider ========== */

/* ========== CSS for Application Download Link Section ========== */
.btn-app-link {
    background-position: left 12px center;
    background-repeat: no-repeat;
    height: 40px;
    width: 142px;
    display: inline-block;
    background-size: 26px;
    background-color: #fecd38;
    color: #000;
    padding: 5px 20px 5px 46px;
    text-align: left;
    font-size: 10px;
    -webkit-box-shadow: 2px 4px 20px 4px rgba(0,0,0,.15);
    -ms-box-shadow: 2px 4px 20px 4px rgba(0,0,0,.15);
    -moz-box-shadow: 2px 4px 20px 4px rgba(0,0,0,.15);
    box-shadow: 2px 4px 20px 4px rgba(0,0,0,.15);
}
.btn-app-link:hover {
    background-color: #fecd38;
    color: #000;
    -webkit-box-shadow:2px 8px 30px 5px rgba(0,0,0,.15);
    -ms-box-shadow:2px 8px 30px 5px rgba(0,0,0,.15);
    -moz-box-shadow:2px 8px 30px 5px rgba(0,0,0,.15);
    box-shadow:2px 8px 30px 5px rgba(0,0,0,.15);
    -webkit-transform:translateY(-3px);
    -ms-transform:translateY(-3px);
    -moz-transform:translateY(-3px);
    transform:translateY(-3px);
}
.btn-app-link .store-name {
    font-size: 14px;
    font-weight: 500;
    display: block;
    margin-top: -4px;
}
.apple {
    background-image: url(../images/apple.png);
}
.android {    
    background-image: url(../images/android.png);
}
.web {
    background-image: url(../images/web.png);
}
.app-links {
    background-image: url(../images/phone-bg.png);
    background-position: right center;
    background-size: cover;
}
.app-links.overlay-black:before {
    background-color: rgba(0,0,0,.85);
}
.app-platform a {
    height: 74px;
    width: 74px;
    display: inline-block;
    background-size: 38px;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #fff;
    -webkit-border-radius: 12px;
    border-radius: 12px;
    -webkit-box-shadow: 0px 8px 17px 7px rgba(0,0,0,.35);
    box-shadow: 0px 8px 17px 7px rgba(0,0,0,.35);
    transition: all .3s ease-in-out;
}
.app-platform a:hover {
    transform: scale(1.15);
    background-color: #fecd38;
}
.monitor {
    position: absolute;
    max-width: 18%;
    top: 24%;
    right: 29%;
}
.tab {
    position: absolute;
    max-width: 15%;
    top: 52%;
    left: 24.5%;
}
.mobile {
    position: absolute;
    max-width: 11%;
    top: 65%;
    left: 6.5%;
}
/* ========== CSS for Application Download Link Section ========== */

/* ========== CSS for Footer Section ========== */
footer .container {
    z-index: 2;
}
.footer-logo {
    max-width: 90px;
}
.subscription-form .form-control {
    height: 42px;
    padding: 10px 120px 10px 30px;
}
.subscription-form .btn {
    right: 0;
    top: 0;
    padding: .563rem 2rem;
    position: absolute;
    font-size: 16px;
}
.copyright-content-block:before,
.line-after:before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    height: 1px;
    background: #e4ad31;
}
.copyright-content-block:before {
    top:0;
}
.line-after.left-align:before {
    margin: 0!important;
}
.line-after:before {
    bottom: 0;
    height: 3px;
    width: 30px;
}
.social-links>li:not(:first-child) {
    padding-left: 25px;
}
.social-links>li> a {
    height: 35px;
    width: 35px;
    display: inline-block;
    text-align: center;
    font-size: 24px;
    position: relative;
}
.social-links>li {
    margin: 4px 8px;
}
.social-links>li> a:after {
    content: '';
    position: absolute;
    height: 32px;
    width: 32px;
    border: 2px solid #fecd38;
    left: -4px;
    top: -5px;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    -moz-transform: scale(0);
    transform: scale(0);
    -webkit-transition: transform .3s ease-in-out;
    -ms-transition: transform .3s ease-in-out;
    -moz-transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
}
.social-links>li> a:hover:after {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -moz-transform: scale(1);
    transform: scale(1);
}
.footer-links-list a {
    color: #fff;
    margin: 5px 0;
    display: inline-block;
}
.footer-links-list a:hover {
    letter-spacing: 1.5px;
}
.footer-links-list a:hover,
.social-links>li> a:hover i  {
    color: #fecd38;
}
.language-selection + .select2-container {
    min-width: 110px;
}
.language-selection + .select2-container--default .select2-selection--single {
    border: 0;
    background-color: #000000;
    outline: 0;
    -webkit-border-radius: 0;
    -ms-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}
.language-selection + .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #fff;
    padding-left: 0;
}
/* ========== CSS for Footer Section ========== */

/* ========== CSS for Request for Demo Modal ========== */
.modal-logo,
.modal-logo a {
    max-width: 100px;
}
.modal-logo img {
    width: 100%;
    height: 100%;
}
.demo-form > form {
    z-index: 9;
    background-color: rgba(0,0,0,.4);
}
.request-demo-form.overlay-black:before {
    background-color: rgba(0,0,0,.8);
}
.request-demo-form {
    background-image: url(../images/request-demo-bg.jpg);
    background-position: right top;
    background-size: cover;
}
.demo-modal .bg-shape-wave {
    background-image: url(../images/bg-shape.png);
    background-position: right top;
    border: 8px solid #1a1a1a;
    border-bottom: 0;
}

/* ========== End CSS for Request for Demo Modal ========== */

/* ========== CSS Inner page Banner ========== */
.heading,
.hover-link,
.about-us-wrapper .testimonial-section {
    position: relative;
}
.inner-page-banner {
    height: 44vh;
    background-color: #696868;
    overflow: hidden;
}
.inner-banner-block {
    margin-top: -55px;
}
.border-effect:after {
    content: '';
    position: absolute;
    bottom: 0;
    -webkit-background: linear-gradient(to right, #ffdc6f, #000, #ffdc6f);
    background: linear-gradient(to right, #ffdc6f, #000, #ffdc6f);
    height: 1px;
    width: 0;
    margin: auto;
}
.wavesshape {
    bottom: -2px;
    left: 0;
    position: absolute;
    right: 0;
    top: auto;
    width: 100%;
}
.wavesshape.shape {
    bottom: -80px;
    height: auto;
}
/* ========== End CSS Inner page Banner ========== */

/* ========== CSS Contact Us Page ========== */
.map-container{
    position: relative;
    width: 100%;
}
.map-container > * {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0;
    padding: 0;
    height: 100%;
    width: 100%;
}
/* ========== End CSS Contact Us Page ========== */
  
/* ========== CSS for FAQ's Page ========== */
.question-list .card-body p {
    line-height: 25px;
    color: #000;
    font-weight: 300;
    font-size: 18px;
}
.accordion-button {
    text-decoration: none!important;
    font-weight: 500;
    color: #464545;
}
.accordion-button:hover,
.accordion-button[aria-expanded="true"] {
    color: #f3b835;
}
.accordion-button i {
    position: absolute;
    right: 0;
    top: 17px;
    font-size: 22px;
}
.accordion-button[aria-expanded="true"] i {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
}
/* ========== End CSS for FAQ's Page ========== */

/* ========== CSS for Back To Top Button ========== */
.back-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    height: 36px;
    width: 36px;
    font-size: 22px;
    z-index: 100;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}
.back-to-top.shown {
    opacity: 1;
    visibility: visible;
    cursor: pointer;
    pointer-events: all;
}
/* ========== End CSS for Back To Top Button ========== */


/* ========== CSS for About Us Page ========== */
.about-descripton p {
    font-size: 18px;
    line-height: 30px;
}
.client-list {
    max-width: 1100px;
}
.client-logo {
    border: 1px solid #e4e4e4;
    width: 100%;
    -webkit-box-shadow: 0px 0px 5px 1px rgba(0,0,0,.05);
    box-shadow: 0px 0px 5px 1px rgba(0,0,0,.05);
}
.client-logo:after {
    content: '';
    left: 8px;
    right: 8px;
    bottom: 8px;
    top: 8px;
    border: 1px solid #000;
    position: absolute;
    transform: scale(.9);
    opacity: 0;
}
.client-logo:hover {
    -webkit-box-shadow: 0px 0px 7px 1px rgba(0,0,0,.05);
    box-shadow: 0px 0px 7px 1px rgba(0,0,0,.05);
    transform: translateY(-2px);
}
.client-logo:hover:after {
    transform: scale(1);
    opacity: 1;
}
.client-logo:hover,
.client-logo:hover:after {
    border: 1px solid #cc9a04;
}
.row-reverse-content > .row + .row {
    padding-top: 80px;
}
.row-reverse-content.lg > .row {
    padding-top: 50px;
    padding-bottom: 50px;
}
#how-it-work .card .thumbnail,
#how-it-work .card .thumbnail img,
.blog-list .card .thumbnail,
.blog-list .card .thumbnail img {
    border-radius: 12px 12px 0 0;
}
#how-it-work .card-text {
    min-height: 145px;
    font-weight: 300;
}
#how-it-work .card:hover img,
.blog-list .card:hover img {
    -webkit-transform: scale(1.25);
    -ms-transform: scale(1.25);
    -moz-transform: scale(1.25);
    transform: scale(1.25);
}
#how-it-work .overlay-black:before,
.blog-list .overlay-black:before {
    background-color: rgba(0,0,0,.35);
}
#client-list-slider .owl-item img {
    width: auto;
    margin-left: auto;
    margin-right: auto;
}
.client-logo:hover img {
    -webkit-transform: scale(.95);
    -ms-transform: scale(.95);
    -moz-transform: scale(.95);
    transform: scale(.95);
}

.about-us-wrapper .founder-speaks {
    background: rgba(0,0,0,.95);
    color: #fff;
}
.about-us-wrapper .founder-image:before {
    content: '';
    background: rgba(254, 205, 56,.5);
}
/* .about-banner {
    padding: 80px 0 160px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
} */
.about-text {
    margin-top: -100px;
    position: relative;
    padding-bottom: 80px;
}
.why-choose-section .container {
    max-width: 1200px;
}
/* ========== End CSS for About Us Page ========== */

/* ========== CSS for Owl Nav ========== */
.owl-nav-style .owl-nav button {
    background: #fecd38!important;
    height: 36px;
    width: 36px;
    border-radius: 100%!important;
    position: relative;
    -webkit-box-shadow: 0px 3px 9px 1px rgba(0,0,0, .25);
    box-shadow: 0px 3px 9px 1px rgba(0,0,0, .25);
}
.owl-nav-style.sm .owl-nav button {
    height: 28px;
    width: 28px;
}
.owl-side-nav .owl-nav {
    position: absolute;
    top: 50%;
    left: -10px;
    right: -10px;
    margin-top: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    transform: translateY(-50%);
}
.owl-side-nav .owl-nav button {
    position: absolute;
}
.owl-side-nav .owl-nav button.owl-prev {
    left: 0;
}
.owl-side-nav .owl-nav button.owl-next {
    right: 0;
}
.owl-nav-style .owl-nav [class*=owl-]:hover {
    background: none;
}
.owl-nav-style .owl-nav button span {
    font-size: 0;
}
.owl-nav-style .owl-nav button span:before {
    content: '';
    position: absolute;
    left: 14px;
    top: 12px;
    height: 12px;
    width: 12px;
    border: 3px solid #000;
    border-radius: 2px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
}
.owl-nav-style.sm .owl-nav button span:before {
    left: 11px;
    top: 10px;
    height: 9px;
    width: 9px;
}
.owl-nav-style .owl-nav button.owl-prev span:before {
    border-top: 0;
    border-right: 0;
}
.owl-nav-style .owl-nav button.owl-next span:before {
    border-bottom: 0;
    border-left: 0;
}
.owl-nav-style .owl-nav button.owl-next span:before {
    left: 10px;
}
.owl-nav-style.sm .owl-nav button.owl-next span:before {
    left: 8px;
}
/* ========== End CSS for Owl Nav ========== */

/* ========== CSS for Partner Page ========== */
.modern-box {
    text-align: center;
    max-width: 370px;
    min-height: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 40px 20px;
    background: #fff;
    -webkit-box-shadow: 0 0 12px -2px rgba(0,0,0,.15);
    box-shadow: 0 0 12px -2px rgba(0,0,0,.15);
}
.blog-list .card-title,
#how-it-work .card-title,
.modern-box .subheading h3 {
    color: rgb(0, 0, 0);
    -webkit-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.blog-list .card:hover .card-title,
#how-it-work .card:hover .card-title,
.modern-box:hover .subheading h3 {
    color: #e4ad31;
}
.modern-box:hover {
    -webkit-box-shadow: 1px 1px 15px 2px rgba(0,0,0,.15);
    box-shadow: 1px 1px 15px 2px rgba(0,0,0,.15);
}
.modern-box:hover .modern-box-icon { 
    -webkit-transform: translateY(-5px);
    -ms-transform: translateY(-5px);
    -moz-transform: translateY(-5px);
    transform: translateY(-5px);
}
.service-list .subheading.line-after:before {
    bottom: 12px;
    max-width: 50px;
}
/* ========== End CSS for Partner Page ========== */


/* ========== CSS for Our Services Section ========== */
.modern-boxes .modern-box {
    -webkit-box-shadow: -10px 10px 15px 0px rgba(0,0,0,.15);
    box-shadow: -10px 10px 15px 0px rgba(0,0,0,.15);
}
.transform-Y {
    -webkit-transform: rotateY(15deg);
    -ms-transform: rotateY(15deg);
    -moz-transform: rotateY(15deg);
    transform: rotateY(15deg);
}
.transform-Y:hover {
    -webkit-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    transform: rotateY(0deg);
}
/* ========== End CSS for Our Services Section ========== */

/* ========== CSS for Features Page ========== */
.joga-advertisement {
    position: relative;
    padding-bottom: 41%;
    background-repeat: no-repeat;
    background-size: 100%;
    background-image: url(../images/joga-add.png)
}
.feature-right > div:not(:first-child),
.feature-left > div:not(:first-child) {
    margin-top: 20px;
}
.feature-box {
    height: 100%;
    background: #ffeebe;
    -webkit-box-shadow: 0 .3rem 1rem rgba(0,0,0,.15);
    box-shadow: 0 .3rem 1rem rgba(0,0,0,.15);
}

.feature-box:hover {
    -webkit-box-shadow: 0 .6rem 1rem rgba(0,0,0,.25);
    box-shadow: 0 .6rem 1rem rgba(0,0,0,.25);
}
.feature-box > .subheading {
    padding-left: 40px;
    padding-top: 4px;
    background-position: top left;
}
.feature-box > .subheading,
.view-description .ok-check {
    background-image: url(../images/correct.svg);
    background-size: 30px;
    background-repeat: no-repeat;
}
.view-description .ok-check {
    height: 40px;
    width: 40px;
}
.feature-box:hover {
    -webkit-transform: scale(1.03);
    -moz-transform: scale(1.03);
    -ms-transform: scale(1.03);
    transform: scale(1.03);
}
.bottom-border-up:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    border: 4px solid #e4ad31;
    border-top: 0;
    border-left: 0;
    border-right: 0;
    z-index: -1;
}
.feature-center .logo {
    position: absolute;
    left: 47%;
    top: 43%;
    max-width: 11%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    transform: translateX(-50%);
}
.feature-center.business-features .logo {
    top: 38%;
}
.service-areas:after,
.service-areas:before,
.app-detail-slider:before,
.app-detail-slider::after {
    content: '';
    background-repeat: no-repeat;
    height: 100%;
    position: absolute;
    width: 100%;
    top: 0;
    bottom: 0;
    z-index: 1;
}
.service-areas:before,
.app-detail-slider:before {
    background-image: url(../images/edge-large-curve-left.png);
    background-position: left bottom;
}
.service-areas:before {
    background-position: left top;
}
.service-areas:after,
.app-detail-slider:after {
    background-image: url(../images/edge-large-curve-right.png);
    background-position: right top;
}
.service-areas:after {
    background-position: right bottom;
}
.mobile-device {
    position: relative;
    width: 100%;
    padding-bottom: 140.477897%;
}
.laptop-device {
    position: relative;
    width: 100%;
    padding-bottom: 93.477897%;
}
.device {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    -webkit-background-size: 100% 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}
.iphone {
    background-image: url(../images/iphone6.png);
}
.mackbook { 
    background-image: url(../images/clubscreen/macbook.png);
}
.app-slides {
    overflow: hidden;
    position: absolute;
    top: 18.5%;
    bottom: 18.5%;
    left: 25.5%;
    right: 25.5%;
}
.laptop-device .app-slides {
    top: -3%;
    bottom: 0%;
    left: 11.5%;
    right: 11.5%;
}
.app-slider,
.app-slider div {
    height: 100%;
}
.app-slider .owl-nav {
    height: auto;
}
.app-slider .app-screensshots {
    padding-bottom: 10%;
    max-width: 100%;
    width: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.index-banner .tumbnails-img {
    max-width: 750px;
}
.device-background {
    width: calc(100% - 35%);
    height: calc(100% - 55%);
    display: block;
    background: #f9d05a;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
/* ========== End CSS for Features Page ========== */

/* ========== CSS for Founder Speaks Section ========== */
.textimonal-image span {
    -webkit-box-shadow: 6px 8px 20px 6px rgba(0,0,0,.25);
    box-shadow: 6px 8px 20px 6px rgba(0,0,0,.25);
}
.textimonal-image img {
    height: 100%;
    width: 100%;
}
.textimonal-image .textimonial-youtube{
    position: absolute;
    right: 10px;
    top: 10px;
}
.textimonal-image:before {
    content: '';
    background: rgba(48, 48, 48,.5);
    position: absolute;
    z-index: -1;
    left: 0;
    right: 5%;
    bottom: -5%;
    top: 0;
    -webkit-border-radius: 60px;
    border-radius: 60px;
    -webkit-transform: rotate(15deg);
    -ms-transform: rotate(15deg);
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
}
.textimonal-speaks .row-reverse-content .yellow-gradient-border:before {
    top:20px;
}
.textimonal-comment .fa-quote-left {
    font-size: 56px;
    color: #e4b231;
    opacity: .3;
    position: absolute;
    top: 0;
    left: 0;
}
.textimonal-comment {
    max-width: 860px;
}
.testimonials-comment p {
    font-size: 20px;
    font-weight: 600;
}
.testimonials-profile span {
    line-height: 20px;
    font-weight: 300;
}
.section-shape svg {
    -webkit-transform: scale(2);
    -ms-transform: scale(2);
    -moz-transform: scale(2);
    transform: scale(2);
}
.shape-top {
    top: 0;
    left: 0;
    right: 0;
    -webkit-transform: rotateX(180deg);
    -ms-transform: rotateX(180deg);
    -moz-transform: rotateX(180deg);
    transform: rotateX(180deg);
}
/* .founder-picture,
.founder-picture img {
    position: relative;
    -webkit-border-radius: 12px;
    border-radius: 12px;
}
.founder-picture {
    padding-bottom: 36.145%;
    width: 36.145%;
    background-size: cover;
    background-repeat: no-repeat;
    -webkit-box-shadow: -12px -12px 0px -2px rgba(228, 173, 49,.85);
    box-shadow: -12px -12px 0px -2px rgba(228, 173, 49,.85);
}
.founder-picture + .founder-picture {
    margin-top: 60px;
    margin-left: -20px;
    -webkit-box-shadow: 12px 12px 0px -2px rgba(228, 173, 49,.85);
    box-shadow: 12px 12px 0px -2px rgba(228, 173, 49,.85);
} */

/* ========== End CSS for Founder Speaks Section ========== */

/* ========== CSS for What we Do Section ========== */
.do-block {
    height: 100%;
    -webkit-box-shadow: 0 5px 16px 2px rgba(0,0,0,.15);
    box-shadow: 0 5px 16px 2px rgba(0,0,0,.15);
}
.do-block:hover {
    -webkit-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    -moz-transform: translateY(-10px);
    transform: translateY(-10px);
    -webkit-box-shadow: 0 7px 20px 5px rgba(0,0,0,.15);
    box-shadow: 0 7px 20px 5px rgba(0,0,0,.15);
}
.bg-patch:before {
    content: '';
    height: 40%;
    width: 40%;
    background: #e4ad31;
    position: absolute;
    top: -20%;
    left: -20%;
    z-index: 0;
    -webkit-border-radius: 32px;
    -ms-border-radius: 32px;
    -moz-border-radius: 32px;
    border-radius: 32px;
    -webkit-transform: rotate(35deg);
    -ms-transform: rotate(35deg);
    -moz-transform: rotate(35deg);
    transform: rotate(35deg);
}
/* ========== CSS for What we Do Section ========== */

/* ==========CSS for Preloader ========== */
.loader {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 100%;
    top: 0;
    background-color: rgba(0,0,0,.99);
    z-index: 999;
    height: 100vh;
    width: 100vw;
}
.loader-text {
    font-size: 44px;
    color: #f3b835;
    font-weight: 500;
}
.loader-border {
    border-radius: 16px;
    background: #000;
    padding: 5px;
    border: 3px solid #f9b726;
}
.loder-img {
    background: #fff;
    padding: 20px 0px;
    border-radius: 11px;
    text-align: center;
}
.loder-img img {
    max-width: 75%;
    margin: 0 auto;
}
.loader-wrapper {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
/* ========== End CSS for Preloader ========== */

/* ========== CSS for Solutions Details Page ========== */

.img-block {
    position: relative;
    width: 77.945%;
    padding-bottom: 82.392%;
    background-position: center top;
    background-size: 100%;
    background-repeat: no-repeat;
    -webkit-border-radius: 24px;
    border-radius: 24px;
    margin-top: 1rem;
    margin-bottom: 1rem;
    margin-left: 0.7rem;
    -webkit-transition: box-shadow .4s ease-in-out;
    transition: box-shadow .4s ease-in-out;
    -webkit-box-shadow: 0px 10px 22px 0px rgba(0, 0, 0, 0.25);
    box-shadow: 0px 10px 22px 0px rgba(0, 0, 0, 0.25);
}
.img-block:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 70%;
    -webkit-border-radius: 0 0 24px 24px;
    border-radius: 0 0 24px 24px;
    background-image: linear-gradient(rgba(0, 0, 0,.0), rgba(0, 0, 0,.8));
}
.img-block .solution-mobile {
    -webkit-box-shadow: 1px 5px 10px rgba(0,0,0,.06);
    box-shadow: 1px 5px 10px rgba(0,0,0,.06);
    -webkit-border-radius: 24px;
    border-radius: 24px;
    width: 40%;
    position: absolute;
    bottom: 0;
    right: 0;
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
    -webkit-transition: box-shadow .4s ease-in-out;
    transition: box-shadow .4s ease-in-out;
    z-index: 1;
}
.img-block .solution-mobile span {
    display: block;
    width: 100%;
    padding-bottom: 200%;
    border-radius: 3px;
    background-position: top;
    background-size: 100%;
    background-repeat: no-repeat;
}
.solution-1 {
    background-image: url(../images/solution-1.jpg);
}
.solution-1 .solution-mobile span {
    background-image: url(../images/solution-mobile-1.png);
}
.solution-2 {
    background-image: url(../images/solution-2.jpg);
}
.solution-2 .solution-mobile span {
    background-image: url(../images/solution-mobile-2.png);
}
.view-more {
    color: #ffc105;
    font-weight: 700;
}
.view-more:hover {
    color: #000;
}
.view-description.fancybox-content {
    min-height: 36vh;
    max-width: 700px;
    padding: 50px;
    box-shadow: 0px 0px 15px 2px rgba(0,0,0,.25);
}
.view-description.bottom-border-up:after {
    z-index: 1;
    border-bottom: 8px solid #e4ad31;
}
.view-description.bg-patch:before {
    top: -25%;
    left: -28%;
}
/* ========== End CSS for Solutions Details Page ========== */


/* ========== CSS for Customize Fancybox ========== */
.fancybox-close-small {
    opacity: 1px;
}
.fancybox-slide--html .fancybox-close-small {
    padding: 5px;
    top: 5px;
    right: 5px;
}
.fancybox-button svg {
    background: #000;
    -webkit-border-radius: 100%;
    border-radius: 100%;
    color: #fff;
}
.banner-laptop {
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(../images/banner-1.png);
    padding-bottom: 60%;
    background-size: 90%;
}
.fancybox-button:hover {
    color: #000;
}
/* ========== End CSS for Customize Fancybox ========== */

/* ========== CSS for Privacy Policy and Terms and Condition page ========== */
.static-content-wrapper {
    -webkit-box-shadow: 0px 5px 30px 0px rgba(0,0,0,.15);
    box-shadow: 0px 5px 30px 0px rgba(0,0,0,.15);
}
.static-content-wrapper a {
    font-weight: 600;
    color: #040458;
    line-height: 22px;
    padding-top: 5px;
}
.static-content-wrapper a:hover {
    color: #efb915;
}
/* ========== End CSS for Privacy Policy and Terms and Condition page ========== */

/* ========== CSS for Re-devlopment sections ========== */
.fancybox-can-swipe .fancybox-content {
    cursor: default!important;
}
.index-banner .feature-center.business-features .logo {
    top: 28%;
    max-width: 10%;
}
.index-banner .tumbnails-img .app-platform {
    position: absolute;
    top: 38%;
    left: 47%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    transform: translateX(-50%);
}
.banner-mob {
    position: absolute;
    top: 26.5%;
    max-width: 18%;
    left: 11%;
}
.index-banner .tumbnails-img .app-platform a {
    box-shadow: none;
    -webkit-box-shadow: none;
    background-color: transparent;
    height: 46px;
    width: 46px;
    background-size: 32px;
}
.fancybox-slide p {
    word-break: break-word;
}
.fancybox-active {
    overflow: hidden;
}
.banner-mobile {
    -webkit-box-shadow: 1px 5px 10px rgba(0,0,0,.06);
    box-shadow: 1px 5px 10px rgba(0,0,0,.06);
    -webkit-border-radius: 24px;
    border-radius: 24px;
    width: 18%;
    position: absolute;
    bottom: 5%;
    left: 1%;
    -webkit-transform: translateX(50%);
    transform: translateX(50%);
    -webkit-transition: box-shadow .4s ease-in-out;
    transition: box-shadow .4s ease-in-out;
    z-index: 1;
}
.banner-mobile span {
    display: block;
    width: 100%;
    padding-bottom: 200%;
    border-radius: 3px;
    background-position: top;
    background-size: 100%;
    background-repeat: no-repeat;
    background-image: url(../images/banner-mobile.png);
}
.texture-bg:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-image: url(../images/texture-bg.png),linear-gradient(35deg,#696868 0,#adabab 100%);
    background-size: cover;
    background-position: center top;
}
.banner-svg {
    position: absolute;
    width: 100%;
    left: 0px;
    z-index: 0;
    pointer-events: none;
}
.banner-svg svg {
    width: 100%;
    height: auto;
    display: block;
}
/* ========== End CSS for Re-devlopment sections ========== */

/* ========== CSS for home page featurs section ========== */

.features-section .icon-box {
    padding: 30px;
    position: relative;
    overflow: hidden;
    margin: 15px 0;
    background: #fff;
    box-shadow: 0 10px 29px 0 rgba(68, 88, 144, 0.1);
    transition: all 0.3s ease-in-out;
    border-radius: 12px;
    text-align: center;
    border-bottom: 3px solid #fff;
}
.features-section .icon-box-cyan .icon i {
    color: #3fcdc7;
}
.features-section .icon i {
    font-size: 48px;
    line-height: 1;
    margin-bottom: 15px;
}
.features-section .title {
    font-weight: 700;
    margin-bottom: 15px;
    font-size: 18px;
}
.description {
    font-size: 16px;
    line-height: 26px;
    margin-bottom: 0;
}
.features-section .icon-box-blue:hover {
    border-color: #2282ff;
}
.features-section .icon-box-blue .icon i {
    color: #2282ff;
}
.features-section .icon-box-pink:hover {
    border-color: #ff689b;
}
.features-section .icon-box-pink .icon i {
    color: #ff689b;
}
.features-section .icon-box-cyan:hover {
    border-color: #3fcdc7;
}
.features-section .icon-box-cyan .icon i {
    color: #3fcdc7;
}
.features-section .icon-box-green:hover {
    border-color: #41cf2e;
}
.features-section .icon-box-green .icon i {
    color: #41cf2e;
}
.features-section .icon-box:hover {
    transform: translateY(-5px);
}
.inner-pages-img-banner {
    height: 60vh;
    min-width: 300px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
/* ========== End CSS for home page featurs section ========== */