@font-face {
     font-family: 'FontAwesome';
     src: url('../fonts/fontawesome-webfonte0a5.html?v=4.3.0');
     src: url('../fonts/fontawesome-webfontd41d.html?#iefix&v=4.3.0') format('embedded-opentype'), url('../fonts/fontawesome-webfonte0a5-2.html?v=4.3.0') format('woff2'), url('../fonts/fontawesome-webfonte0a5-3.html?v=4.3.0') format('woff'), url('../fonts/fontawesome-webfonte0a5-4.html?v=4.3.0') format('truetype'), url('../fonts/fontawesome-webfonte0a5-5.html?v=4.3.0#fontawesomeregular') format('svg');
     font-weight: normal;
     font-style: normal;
     font-display: swap;
 }

 * {
     margin: 0;
     padding: 0;
 }

 ::-webkit-scrollbar {
     -webkit-appearance: none;
     width: 4px;
     height: 6px;
 }

 ::-webkit-scrollbar-thumb {
     border-radius: 4px;
     background: linear-gradient(to right, #ff5066, #fc9d44);
     -webkit-box-shadow: 0 0 1px rgba(250, 132, 29, 0.51);
 }

 ::-moz-scrollbar-track {
     -moz-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.3);
     background: linear-gradient(to right, #ff5066, #fc9d44);
 }

 ::-moz-scrollbar {
     width: 4px;
     background: linear-gradient(to right, #ff5066, #fc9d44);
 }

 ::-moz-scrollbar-thumb {
     border-radius: 4px;
     background: linear-gradient(to right, #ff5066, #fc9d44);
     -webkit-box-shadow: 0 0 1px rgba(250, 132, 29, 0.51);
 }

 body {
     font-family: "Montserrat", sans-serif;
     overflow-x: hidden !important;
     font-size: 0.9rem;
     line-height: 24px;
     color: #000000;
 }

 .main {
     width: 100%;
     overflow-x: hidden !important;
 }

 a,
 a:hover,
 a:focus {
     text-decoration: none;
     outline: none;
 }

 input,
 input:focus,
 input:hover,
 button,
 button:hover,
 button:focus {
     outline: none;
 }

 img {
     width: auto;
     max-width: 100%;
 }

 p {
     font-size: 0.9rem;
     line-height: 24px;
     color: #000000;
     font-weight: normal;
     margin-bottom: 12px;
 }

 .h1-title {
     font-size: 45px;
     line-height: 55px;
     color: #010f2e;
     font-weight: bold;
     font-family: "Montserrat", sans-serif;
     margin-bottom: 17px;
 }

 .h1-title .typer {
     display: inline-block;
     background: linear-gradient(to right, #f56915, #f0a80e);
     -webkit-background-clip: text;
     -webkit-text-fill-color: transparent;
 }

 .sub-title {
     display: block;
     font-size: 22px;
     line-height: 25px;
     color: #f56915;
     font-weight: bold;
     font-family: "Montserrat", sans-serif;
     text-transform: uppercase;
     position: relative;
     margin-bottom: 8px;
 }

 .h2-title {
     font-size: 45px;
     line-height: 55px;
     font-weight: bold;
     color: #010f2e;
     font-family: "Montserrat", sans-serif;
     margin-bottom: 28px;
     position: relative;
 }

 .h3-title {
     font-size: 1.4rem;
     line-height: 35px;
     color: #010f2e;
     font-weight: bold;
     font-family: "Montserrat", sans-serif;
     ;
 }

 .h4-title {
     font-size: 40px;
     line-height: 50px;
     color: #010f2e;
     font-weight: bold;
     font-family: "Montserrat", sans-serif;
     margin-bottom: 0;
 }

 .login-btn {
     background: linear-gradient(to right, #000000, #9e9e9e) !important;
 }

 .login-btn:hover {
     color: #ffffff;
     background: linear-gradient(to right, #9e9e9e, #000000) !important;
 }

 .login-btn:before {
     color: #ffffff;
     background: linear-gradient(to right, #9e9e9e, #000000) !important;
 }

 .sec-btn {
     height: 46px;
     display: inline-block;
     font-size: 15px;
     line-height: 30px;
     color: #ffffff;
     font-weight: 500;
     padding: 9px 32px;
     background: linear-gradient(to right, #f56915, #f0a80e);
     border-radius: 40px;
     overflow: hidden;
     position: relative;
     border: none;
     outline: none;
     transition: 0.5s;
 }

 .sec-btn:hover {
     color: #ffffff;
     box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.5);
 }

 .sec-btn:before {
     content: '';
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%) scale(0);
     width: 110%;
     height: 110%;
     background: linear-gradient(to left, #f88010, #f88010);
     border-radius: 40px;
     opacity: 0;
     transition: 0.5s;
     z-index: 0;
 }

 .sec-btn:hover:before {
     transform: translate(-50%, -50%) scale(1);
     opacity: 1;
 }

 .sec-btn span {
     position: relative;
     z-index: 1;
 }

 .sec-btn span i {
     margin-left: 10px;
 }

 .play-video {
     display: inline-block;
     font-size: 15px;
     line-height: 24px;
     color: #000000;
     font-weight: 500;
     text-transform: uppercase;
     transition: 0.3s;
 }

 .play-video:hover {
     color: #f88010;
 }

 .play-video .icon {
     display: inline-flex;
     justify-content: center;
     align-items: center;
     vertical-align: middle;
     width: 46px;
     height: 46px;
     background: #000000;
     border-radius: 50%;
     font-size: 20px;
     color: #ffffff;
     padding-left: 3px;
     margin-right: 15px;
     position: relative;
     overflow: hidden;
     transition: 0.3s;
 }

 .play-video:hover .icon {
     background: linear-gradient(to right, #f56915, #f0a80e);
     color: #ffffff;
     box-shadow: 0px 10px 30px 0px rgb(120, 89, 252, 0.5);
 }

 .play-video:hover .icon i {
     z-index: 9;
 }

 .play-video .icon:before {
     content: '';
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%) scale(0);
     width: 110%;
     height: 110%;
     background: linear-gradient(to right, #f56915, #f0a80e);
     border-radius: 40px;
     opacity: 0;
     transition: 0.5s;
     z-index: 0;
 }

 .play-video:hover .icon:before {
     transform: translate(-50%, -50%) scale(1);
     opacity: 1;
 }

 .slick-list {
     padding: 0 !important;
 }

 .slick-slide {
     outline: none;
 }

 .slick-dots li.slick-active button:before,
 .slick-dots li button:before,
 .slick-dots li button:hover:before,
 .slick-dots li button:focus:before {
     display: none;
 }

 .slick-dots {
     bottom: -50px;
     font-size: 0;
     line-height: 1;
 }

 .slick-dots li {
     width: auto;
     height: auto;
     margin: 0 6px;
 }

 .slick-dots li button {
     width: 8px;
     height: 8px;
     background: #b7b7b7;
     border-radius: 50%;
     transition: 0.3s;
 }

 .slick-dots li button:hover,
 .slick-dots li.slick-active button {
     background: #f56915;
 }

 .slick-arrow {
     position: absolute;
     top: 50%;
     left: 10px;
     transform: translate(0, -50%);
     width: 60px;
     height: 60px;
     background: linear-gradient(to right, #7859fc, #a756f9, #a756f9, #7859fc);
     background-size: 200% 100%;
     background-position: left center;
     padding: 0;
     border-radius: 4%;
     border: none;
     outline: none !important;
     color: #ffffff;
     font-size: 35px;
     transition: 0.3s;
     z-index: 1;
 }

 .slick-arrow.next-arrow {
     left: auto;
     right: 10px;
 }

 .slick-arrow:hover {
     color: #ffffff;
     background-position: right center;
 }

 .slick-arrow i {
     position: relative;
     z-index: 1;
 }

 .black-shadow {
     position: fixed;
     top: 0;
     left: 0;
     width: 100vw;
     height: 100vh;
     background: #000000;
     opacity: 0.75;
     z-index: 90;
     display: none;
 }

 .back-img {
     background-size: cover;
     background-position: center;
     background-repeat: no-repeat;
 }

 .form-box {
     display: block;
     position: relative;
     font-size: 0;
     line-height: 1;
     margin-bottom: 20px;
 }

 .form-box.submit-btn {
     margin-top: 10px;
 }

 .form-input {
     width: 100%;
     height: 60px;
     background: #ffffff;
     font-size: 15px;
     line-height: 24px;
     color: #777777;
     border: none;
     outline: none;
     padding: 12px 30px;
     border: 1px solid #b7b7b7;
     border-radius: 4px;
     box-shadow: none;
 }

 textarea.form-input {
     height: 106px;
     resize: none;
     padding: 18px 30px;
     margin-bottom: 0;
 }

 .form-input::placeholder {
     color: #5f656a;
 }

 .form-box label {
     padding-bottom: 10px;
     position: relative;
     margin-bottom: 0;
     font-size: 14px;
     color: #25303f;
     font-weight: bold;
 }

 .form-checkbox {
     position: absolute;
     top: 4px;
     left: 0;
     width: 15px;
     height: 15px;
     opacity: 0;
     z-index: 2;
 }

 .form-box label span:before {
     content: '';
     position: absolute;
     top: 4px;
     left: 0;
     width: 15px;
     height: 15px;
     background: transparent;
     border: 1px solid #804cf9;
     z-index: 0;
 }

 .form-box label span:after {
     content: "\f00c";
     position: absolute;
     top: 0px;
     left: 1px;
     font-family: 'FontAwesome';
     color: #804cf9;
     font-size: 13px;
     opacity: 0;
     z-index: 1;
 }

 .form-box label input:checked+span:after {
     opacity: 1;
 }

 select {
     -moz-appearance: none;
     -webkit-appearance: none;
 }

 select::-ms-expand {
     display: none;
 }

 .form-element {
     position: relative;
 }

 .form-element i {
     position: absolute;
     top: 15px;
     right: 25px;
     pointer-events: none;
     font-size: 20px;
     color: #5f656a;
 }

 select.form-input {
     padding-right: 40px !important;
 }

 .for-des {
     display: inline-block !important;
 }

 .for-mob {
     display: none !important;
 }

 .toggle-button {
     position: fixed;
     top: 0;
     right: 0;
     width: 70px;
     height: 70px;
     background: linear-gradient(to right, #000000, #9e9e9e);
     text-align: center;
     border: none;
     outline: none;
     display: none;
     z-index: 110;
 }

 .toggle-button span {
     width: 30px;
     height: 3px;
     background: #ffffff;
     display: block;
     margin: 0 auto 6px auto;
     position: relative;
     top: 0;
     opacity: 1;
     transition: 0.3s;
 }

 .toggle-button span:last-child {
     margin-bottom: 0;
 }

 .toggle-menu .toggle-button {
     background: transparent;
 }

 .toggle-menu .toggle-button span {
     background: linear-gradient(to right, #000000, #9e9e9e);
 }

 .toggle-menu .toggle-button span:nth-child(1) {
     transform: rotate(45deg);
     position: relative;
     top: 9px;
 }

 .toggle-menu .toggle-button span:nth-child(2) {
     opacity: 0;
 }

 .toggle-menu .toggle-button span:nth-child(3) {
     transform: rotate(-45deg);
     position: relative;
     top: -9px;
 }

 .main-banner.inner-banner {
     padding: 120px 0 0 0;
     background-size: 1920px;
     background-position: bottom center;
 }

 .main-banner.inner-banner .banner-content {
     text-align: center;
     padding: 0;
 }

 .main-banner.inner-banner .banner-content .h1-title {
     margin-bottom: 26px;
 }

 .breadcrumb-box {
     text-align: center;
 }

 .breadcrumb-box ul {
     font-size: 0;
     line-height: 1;
     list-style: none;
 }

 .breadcrumb-box ul li {
     font-size: 0.9rem;
     line-height: 28px;
     color: #ffffff;
     display: inline-block;
     padding-left: 24px;
     margin-left: 14px;
     position: relative;
     text-transform: uppercase;
     font-weight: 500;
 }

 .breadcrumb-box ul li:first-child {
     padding-left: 0;
     margin-left: 0;
 }

 .breadcrumb-box ul li:before {
     content: '';
     position: absolute;
     top: 50%;
     left: 0;
     transform: translate(0, -50%);
     width: 10px;
     height: 10px;
     background: #ffffff;
     border-radius: 50%;
 }

 .breadcrumb-box ul li:first-child:before {
     display: none;
 }

 .breadcrumb-box ul li a {
     font-size: 0.9rem;
     line-height: 28px;
     color: #ffffff;
     text-transform: uppercase;
     font-weight: 500;
     transition: 0.3s;
 }

 .breadcrumb-box ul li a:hover {
     color: #010f2e;
 }

 .loader-box {
     position: fixed;
     top: 0;
     left: 0;
     width: 100vw;
     height: 100vh;
     background: #fff0ee;
     z-index: 999;
 }

 .loader-design {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
 }

 .gegga {
     width: 0;
 }

 .loader-design svg {
     position: absolute;
     top: 0;
     left: 0;
     transform: translate(-50%, -50%);
 }

 .snurra {
     filter: url(#gegga);
 }

 .stopp1 {
     stop-color: #ff5066;
 }

 .stopp2 {
     stop-color: #fc9d44;
 }

 .halvan {
     animation: Snurra1 10s infinite linear;
     stroke-dasharray: 180 800;
     fill: none;
     stroke: url(#gradient);
     stroke-width: 23;
     stroke-linecap: round;
 }

 .strecken {
     animation: Snurra1 3s infinite linear;
     stroke-dasharray: 26 54;
     fill: none;
     stroke: url(#gradient);
     stroke-width: 23;
     stroke-linecap: round;
 }

 .skugga {
     filter: blur(5px);
     opacity: 0.3;
     position: absolute;
     transform: translate(3px, 3px);
 }

 @keyframes Snurra1 {
     0% {
         stroke-dashoffset: 0;
     }

     100% {
         stroke-dashoffset: -403px;
     }
 }

 .site-header {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     background: gray;
     padding: 23px 0;
     transition: 0.3s;
     z-index: 100;
 }

 .home .site-header {
     padding: 5px 0;
     background: gray;
 }

 .header-box {
     width: 100%;
     display: flex;
     justify-content: space-between;
     align-items: center;
 }

 .site-branding {
     display: inline-block;
 }

 .site-branding a {
     display: inline-block;
     width: 204px;
 }

 .header-menu {
     display: inline-block;
     text-align: center;
 }

 .main-navigation ul {
     font-size: 0;
     line-height: 1;
     list-style: none;
     margin: 0;
     padding: 0;
 }

 .main-navigation ul li {
     font-size: 0.9rem;
     line-height: 26px;
     display: inline-block;
     position: relative;
     margin: 0 20px;
 }

 .main-navigation ul li:first-child {
     margin-left: 0;
 }

 .main-navigation ul li:last-child {
     margin-right: 0;
 }

 .main-navigation ul li a {
     display: inline-block;
     font-size: 0.9rem;
     line-height: 26px;
     color: #010f2e;
     font-weight: 600;
     font-family: "Montserrat", sans-serif;
     transition: 0.3s;
     padding: 15px 0;
 }

 .main-navigation ul li.sub-items:hover>a,
 .main-navigation ul li a:hover,
 .main-navigation ul li.active>a {
     color: #f88010;
 }

 .main-navigation ul li.sub-items>a {
     padding-right: 15px;
     position: relative;
 }

 .main-navigation ul li.sub-items>a:before {
     content: "\f107";
     position: absolute;
     top: 50%;
     right: 0;
     transform: translate(0, -50%);
     font-family: 'FontAwesome';
     color: #010f2e;
     font-size: 0.9rem;
     transition: 0.3s;
 }

 .main-navigation ul li.sub-items:hover>a:before,
 .main-navigation ul li a:hover:before,
 .main-navigation ul li.active>a:before {
     color: #f56915;
 }

 .main-navigation ul li.sub-items:hover>a:before,
 .main-navigation ul li a:hover:before {
     transform: translate(0, -50%) rotate(-180deg);
 }

 .main-navigation ul li ul.sub-menu {
     position: absolute;
     top: 100%;
     left: -15px;
     width: 200px;
     height: auto;
     background: #ffffff;
     border-radius: 10px;
     box-shadow: 1px 1px 60px rgba(0, 0, 0, 0.1);
     display: none;
     transition: 0.3s;
     z-index: 150;
     padding: 10px 0;
 }

 .main-navigation ul li ul.sub-menu::before {
     border-bottom-color: #f6f9fc;
     left: 30px;
     content: "";
     height: 0;
     width: 0;
     position: absolute;
     pointer-events: none;
     border: 9px solid transparent;
     border-bottom: 9px solid #fff;
     top: -18px;
 }

 .main-navigation ul li:hover ul.sub-menu {
     display: block;
     animation: swip_up 0.3s linear 1;
 }

 @keyframes swip_up {
     from {
         transform: translate(0, 20px);
         opacity: 0;
     }

     to {
         transform: translate(0, 0);
         opacity: 1;
     }
 }

 .main-navigation ul li ul.sub-menu li {
     display: block;
     text-align: left;
     margin: 0;
     border-bottom: 1px solid #ebebeb;
 }

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

 .main-navigation ul li ul.sub-menu li a {
     display: block;
     padding: 5px 15px;
 }

 .header-search {
     display: inline-block;
     text-align: right;
     font-size: 0;
     line-height: 1;
 }

 .search-box {
     display: inline-block;
     position: relative;
     vertical-align: middle;
 }

 .search-icon a {
     display: inline-block;
     font-size: 20px;
     color: #777777;
     transition: 0.3s;
 }

 .search-icon a:hover {
     color: #a756f9;
 }

 .search-input {
     position: absolute;
     top: calc(100% + 10px);
     right: -10px;
     width: 300px;
     display: none;
 }

 .search-input .form-input {
     height: 60px;
     padding: 12px 55px 12px 20px;
     border-radius: 40px;
     box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.08);
 }

 .search-input .sec-btn {
     position: absolute;
     top: 5px;
     right: 5px;
     width: 50px;
     height: 50px;
     border-radius: 50%;
     padding: 0;
     margin-left: 0 !important;
 }

 .search-input .black-shadow {
     background: transparent;
 }

 .search-input .search-input-box {
     position: relative;
     z-index: 100;
 }

 .search-input .sec-btn i {
     margin: 0;
 }

 .header-search .sec-btn {
     vertical-align: middle;
     margin-left: 20px;
 }

 .site-header.sticky-header,
 .home .site-header.sticky-header {
     background: gray;
     padding: 10px 0;
     box-shadow: 0 0 20px rgb(0 0 0 / 10%);
     transition: 0.3s;
 }

 .main-banner {
     position: relative;
     padding: 0px 0 36px 0;
 }

 .banner-content p {
     font-size: 0.9rem;
     line-height: 28px;
     margin-bottom: 32px;
 }

 .banner-btn {
     font-size: 0;
     line-height: 1;
 }

 .banner-btn a {
     vertical-align: middle;
 }

 .banner-btn a.sec-btn {
     margin-right: 30px;
 }

 .banner-img {
     position: relative;
     padding-left: 45px;
 }

 .banner-img:before {
     content: '';
     position: absolute;
     top: 0;
     left: -20px;
     width: 965px;
     height: 790px;
     background-image: url(../images/banner-img-shape.png);
     background-size: 100%;
     background-position: bottom left;
     background-repeat: no-repeat;
     z-index: 0;
 }

 .banner-img img {
     max-width: unset;
     width: 620px;
     position: relative;
     z-index: 0;
     padding-top: 10%;
 }

 .about-shape1 {
     position: absolute;
     top: 152px;
     left: 0;
     width: 200px;
     z-index: 1;
 }

 .about-shape2 {
     position: absolute;
     bottom: 117px;
     left: 144px;
     width: 200px;
     z-index: 1;
 }

 .about-shape3 {
     position: absolute;
     top: 80px;
     right: -150px;
     width: 221px;
     z-index: 1;
 }

 .about-shape4 {
     position: absolute;
     bottom: 200px;
     right: -170px;
     width: 225px;
     z-index: 1;
 }

 .about-shape1 img,
 .about-shape2 img,
 .about-shape3 img,
 .about-shape4 img {
     width: auto;
     max-width: 100%;
 }

 .about-shape1 img {
     -webkit-animation: movedelement 5s linear infinite;
     animation: movedelement 5s linear infinite;
 }

 .about-shape2 img {
     -webkit-animation: movedelement2 10s linear infinite;
     animation: movedelement2 10s linear infinite;
 }

 .about-shape3 img {
     -webkit-animation: movedelement3 8s linear infinite;
     animation: movedelement3 8s linear infinite;
 }

 .about-shape4 img {
     -webkit-animation: movedelement4 5s linear infinite;
     animation: movedelement4 5s linear infinite;
 }

 @keyframes movedelement {
     0% {
         -webkit-transform: translate(0);
         transform: translate(0);
     }

     25% {
         -webkit-transform: translate(10px, 10px);
         transform: translate(10px, 10px);
     }

     50% {
         -webkit-transform: translate(5px, 5px);
         transform: translate(5px, 5px);
     }

     75% {
         -webkit-transform: translate(10px, -5px);
         transform: translate(10px, -5px);
     }

     to {
         -webkit-transform: translate(0);
         transform: translate(0);
     }
 }

 @keyframes movedelement2 {
     0% {
         -webkit-transform: translate(0);
         transform: translate(0);
     }

     25% {
         -webkit-transform: translate(-10px, -10px);
         transform: translate(-10px, -10px);
     }

     50% {
         -webkit-transform: translate(-5px, -5px);
         transform: translate(-5px, -5px);
     }

     75% {
         -webkit-transform: translate(-10px, 5px);
         transform: translate(-10px, 5px);
     }

     to {
         -webkit-transform: translate(0);
         transform: translate(0);
     }
 }

 @keyframes movedelement3 {
     0% {
         -webkit-transform: translate(0);
         transform: translate(0);
     }

     25% {
         -webkit-transform: translate(15px, 15px);
         transform: translate(15px, 15px);
     }

     50% {
         -webkit-transform: translate(8px, 8px);
         transform: translate(8px, 8px);
     }

     75% {
         -webkit-transform: translate(15px, -8px);
         transform: translate(15px, -8px);
     }

     to {
         -webkit-transform: translate(0);
         transform: translate(0);
     }
 }

 @keyframes movedelement4 {
     0% {
         -webkit-transform: translate(0);
         transform: translate(0);
     }

     25% {
         -webkit-transform: translate(-15px, -15px);
         transform: translate(-15px, -15px);
     }

     50% {
         -webkit-transform: translate(-8px, -8px);
         transform: translate(-8px, -8px);
     }

     75% {
         -webkit-transform: translate(-15px, 8px);
         transform: translate(-15px, 8px);
     }

     to {
         -webkit-transform: translate(0);
         transform: translate(0);
     }
 }

 .main-about-us {
     position: relative;
     ;
 }

 .main-about-img {
     position: relative;
     padding-top: 60px;
     padding-right: 60px;
 }

 .main-about-img:before {
     content: '';
     position: absolute;
     top: 0;
     right: 0;
     width: 170px;
     height: 170px;
     background: linear-gradient(to right, #ebebeb, rgba(254, 131, 17, 0.18));
     border-radius: 4px;
     z-index: 0;
     -webkit-animation: move2 3s infinite;
     animation: move2 3s infinite;
 }

 @keyframes move2 {
     0% {
         -webkit-transform: rotate(1deg) translate(2px, 2px);
         transform: rotate(1deg) translate(2px, 2px);
     }

     50% {
         -webkit-transform: rotate(-1deg) translate(-2px, -2px);
         transform: rotate(-1deg) translate(-2px, -2px);
     }

     100% {
         -webkit-transform: rotate(1deg) translate(2px, 2px);
         transform: rotate(1deg) translate(2px, 2px);
     }
 }

 .about-img-box {
     width: 680px;
     height: 515px;
     border-radius: 4px;
     overflow: hidden;
     float: right;
     position: relative;
     box-shadow: 1px 1px 60px rgba(0, 0, 0, 0.15);
     z-index: 1;
 }

 .about-img {
     width: 100%;
     height: 100%;
     border-radius: 4px;
     overflow: hidden;
     position: relative;
 }

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

 .img_hover:before {
     content: "";
     position: absolute;
     top: 50%;
     left: 50%;
     display: block;
     width: 0;
     height: 0;
     background: rgba(255, 255, 255, 0.2);
     border-radius: 100%;
     -webkit-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     opacity: 0;
     z-index: 2;
 }

 .img_hover:hover:before {
     -webkit-animation: img_hover 0.75s;
     animation: img_hover 0.75s;
 }

 @-webkit-keyframes img_hover {
     0% {
         opacity: 1;
     }

     40% {
         opacity: 1;
     }

     100% {
         width: 200%;
         height: 200%;
         opacity: 0;
     }
 }

 @keyframes img_hover {
     0% {
         opacity: 1;
     }

     40% {
         opacity: 1;
     }

     100% {
         width: 200%;
         height: 200%;
         opacity: 0;
     }
 }

 .about-content {
     font-size: 0;
     line-height: 1;
 }

 .about-content .h3-title {
     color: #a756f9;
 }

 .about-text {
     margin-bottom: 23px;
 }

 .main-services {
     position: relative;
     padding-top: 25px;
 }

 .services-content p {
     margin-bottom: 17px;
 }

 .services-content ul {
     font-size: 0;
     line-height: 1;
     list-style: none;
     margin-bottom: 33px;
 }

 .services-content ul li {
     position: relative;
     font-size: 15px;
     line-height: 24px;
     color: #010f2e;
     padding-left: 50px;
     margin-bottom: 17px;
 }

 .services-content ul li:last-child {
     margin-bottom: 0;
 }

 .services-content ul li .icon {
     position: absolute;
     top: 50%;
     left: 0;
     transform: translate(0, -50%);
     width: 35px;
     height: 35px;
     background: linear-gradient(to right, #705fed, #c6beff);
     display: inline-flex;
     justify-content: center;
     align-items: center;
     text-align: center;
     color: #ffffff;
     border-radius: 50%;
 }

 .services-content ul li:nth-child(1) .icon {
     background: linear-gradient(to right, #705fed, #c6beff);
 }

 .services-content ul li:nth-child(2) .icon {
     background: linear-gradient(to right, #f57b00, #ffb66c);
 }

 .services-content ul li:nth-child(3) .icon {
     background: linear-gradient(to right, #31ca7b, #83ffbf);
 }

 .service-box {
     width: 100%;
     background: #ffffff;
     position: relative;
     padding: 35px 15px;
     text-align: center;
     border-radius: 20px;
     box-shadow: 1px 1px 60px rgba(0, 0, 0, 0.08);
     overflow: hidden;
     margin-bottom: 30px;
     ;
 }

 .service-box:hover {
     transform: scale(1.05);
     animation-name: fadeup-animation;
     transition: 0.5s;
     box-shadow: 1px 1px 60px rgba(121, 89, 252, 0.5);
     background: linear-gradient(to right, #f56915, #f0a80e);
 }

 .service-box:hover p,
 .service-box:hover h3 {
     color: #ffffff;
 }

 .service-box:hover .service-icon {
     background: #ffffff;
 }

 .service-box.idea-research-service,
 .service-box.seo-service {
     margin-bottom: 0;
 }

 .service-box-text {
     position: relative;
     z-index: 1;
 }

 .service-icon {
     width: 80px;
     height: 80px;
     background: #f5ecfd;
     display: flex;
     justify-content: center;
     align-items: center;
     border-radius: 50%;
     margin: 0 auto 20px auto;
     transition: 0.3s;
 }

 .service-img img {
     width: 72px;
     margin-bottom: 15px;
 }

 .service-box:hover .service-icon {
     animation: bounceIn 1s linear infinite alternate;
     animation-duration: 2s;
 }

 .service-box.idea-research-service .service-icon {
     background: #dcfcef;
 }

 .service-box.seo-service .service-icon {
     background: #faf8e1;
 }

 .service-box.development-service .service-icon {
     background: #ffd2db;
 }

 .service-box.time-data-service .service-icon {
     background: #ffeddd;
 }

 .service-box.analysis-service .service-icon {
     background: #ccd7ff;
 }

 .service-box.penalty-service .service-icon {
     background: #ffcbdc;
 }

 .service-box.support-service .service-icon {
     background: #d2f7ff;
 }

 .service-box-text .h3-title {
     transition: 0.5s;
 }

 .service-box-text p {
     margin-bottom: 0;
     transition: 0.3s;
 }

 .main-whatch-us {
     position: relative;
     padding-top: 115px;
     z-index: 1;
 }

 .whatch-title {
     text-align: center;
 }

 .whatch-video-box {
     width: 100%;
     height: 445px;
     position: relative;
     border-radius: 4px;
     box-shadow: 2px 2px 60px rgba(0, 0, 0, 0.1);
     overflow: hidden;
 }

 .whatch-video-img {
     width: 100%;
     height: 100%;
     border-radius: 4px;
     position: relative;
     z-index: 0;
 }

 .video-play-icon {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     width: 80px;
     height: 80px;
     background: linear-gradient(to right, #7859fc, #a756f9, #a756f9, #7859fc);
     background-size: 200% 100%;
     background-position: left center;
     border-radius: 50%;
     display: inline-flex;
     justify-content: center;
     align-items: center;
     font-size: 20px;
     color: #ffffff;
     padding-left: 5px;
     transition: 0.3s;
     z-index: 1;
 }

 .video-play-icon:hover {
     color: #ffffff;
     background-position: right center;
 }

 .video-play-icon:before {
     content: '';
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     width: 100%;
     height: 100%;
     background: transparent;
     border-radius: 50%;
     pointer-events: none;
     animation: waveBtn 2.5s infinite;
     z-index: -1;
 }

 @keyframes waveBtn {
     0% {
         box-shadow: 0 0 0 0 rgba(120, 89, 252, 1);
     }

     50% {
         box-shadow: 0 0 0 40px transparent;
     }

     100% {
         box-shadow: 0 0 0 0 transparent;
     }
 }

 .video-play-icon:after {
     content: '';
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     width: 142px;
     height: 142px;
     background: transparent;
     border: 2px solid #7959fc;
     border-radius: 50%;
     opacity: 0.5;
     pointer-events: none;
     z-index: -1;
 }

 .main-counter {
     position: relative;
     padding-top: 50px;
     background: linear-gradient(to bottom, #f5f2ff, transparent);
     z-index: 0;
 }

 .counter-box {
     padding: 0 35px;
 }

 .counter-bar {
     width: 100%;
     height: 10px;
     border-radius: 5px;
     position: relative;
     overflow: visible;
 }

 .counter-bar:before {
     content: '';
     position: absolute;
     top: 50%;
     left: 0;
     transform: translate(0, -50%);
     width: 100%;
     height: 10px;
     background: #ebebeb;
     border-radius: 5px;
 }

 .counter-bar-inner {
     position: absolute;
     top: 50%;
     left: 0;
     transform: translate(0, -50%);
     width: 0;
     height: 10px;
     border-radius: 5px;
     overflow: visible !important;
 }

 .counter-bar-inner:before {
     content: '';
     position: absolute;
     top: 50%;
     left: 0;
     transform: translate(0, -50%);
     width: 100%;
     height: 10px;
     background: linear-gradient(to right, #fa6823, #fb854d);
     box-shadow: -6px 6px 30px rgb(250 105 35 / 50%);
     border-radius: 5px;
 }

 .counter-box.project-done .counter-bar-inner:before {
     background: linear-gradient(to right, #2c4edb, #5470e2);
     box-shadow: -6px 6px 30px rgb(94 101 205 / 50%);
 }

 .counter-box.cup-coffee .counter-bar-inner:before {
     background: linear-gradient(to right, #1fa5a9, #4ab7ba);
     box-shadow: -6px 6px 30px rgb(31 165 169 / 50%);
 }

 .counter-box.skills-services .counter-bar-inner:before {
     background: linear-gradient(to right, #2c3ba2, #5561b4);
     box-shadow: -6px 6px 30px rgb(44 59 163 / 50%);
 }

 .counter-box p {
     margin-bottom: 17px;
 }

 .main-pricing {
     position: relative;
     padding: 115px 0;
 }

 .pricing-title {
     position: relative;
     text-align: center;
     margin-bottom: 37px;
 }

 .pricing-box {
     position: relative;
     background: #ffffff;
     padding: 33px 85px 40px 85px;
     box-shadow: 1px 1px 60px rgba(0, 0, 0, 0.08);
     border-radius: 20px;
     text-align: center;
     overflow: hidden;
     font-size: 0;
     line-height: 1;
     transition: 0.5s;
 }

 .pricing-box:hover {
     transform: scale(1.05);
     box-shadow: 1px 1px 60px rgba(121, 89, 252, 0.50);
 }

 .pricing-box:before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: linear-gradient(to top, #7859fc, #a756f9);
     border-radius: 20px;
     opacity: 0;
     transition: 0.5s;
     z-index: 0;
 }

 .pricing-box:hover:before {
     opacity: 1;
 }

 .pricing-text {
     position: relative;
     z-index: 1;
 }

 .pricing-text .h3-title {
     transition: 0.5s;
 }

 .pricing-text p {
     transition: 0.5s;
 }

 .pricing-text ul {
     margin-top: 25px;
     border-top: 1px solid #b7b7b7;
     padding-top: 30px;
     padding-left: 20px;
     list-style: none;
     text-align: left;
     margin-bottom: 24px;
 }

 .pricing-text ul li {
     font-size: 18px;
     line-height: 26px;
     color: #5e5e5e;
     position: relative;
     padding-left: 40px;
     margin-bottom: 20px;
     transition: 0.5s;
 }

 .pricing-text ul li:last-child {
     margin-bottom: 0;
 }

 .pricing-text ul li:before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 26px;
     height: 26px;
     background-image: url('../images/check-icon.html');
     background-size: 100%;
     background-position: center;
     background-repeat: no-repeat;
     transition: 0.5s;
 }

 .pricing-box:hover .pricing-text ul li:before {
     filter: brightness(10);
 }

 .pricing-rate p {
     font-size: 18px;
     line-height: 28px;
     color: #010f2e;
     font-weight: 600;
     font-family: "Montserrat", sans-serif;
     margin-bottom: 23px;
 }

 .pricing-rate p span {
     font-size: 50px;
     line-height: 60px;
     color: #a756f9;
     font-weight: bold;
     transition: 0.5s;
 }

 .pricing-box:hover .pricing-text .h3-title,
 .pricing-box:hover .pricing-text p,
 .pricing-box:hover .pricing-text ul li,
 .pricing-box:hover .pricing-rate p,
 .pricing-box:hover .pricing-rate p span {
     color: #ffffff;
 }

 .pricing-text .sec-btn {
     background: transparent;
     border: 1px solid #7959fc;
     color: #7959fc;
 }

 .pricing-text .sec-btn:before {
     display: none;
 }

 .pricing-box:hover .pricing-text .sec-btn {
     background: #ffffff;
     color: #7959fc;
     border-color: #ffffff;
 }

 .pricing-box:hover .pricing-text .sec-btn:hover {
     background: transparent;
     color: #ffffff;
 }

 .main-projects {
     position: relative;
 }

 .project-title {
     position: relative;
     text-align: center;
     margin-bottom: 37px;
 }

 .project-box {
     width: 100%;
     height: 450px;
     border-radius: 4px;
     position: relative;
     overflow: hidden;
 }

 .project-box.even {
     height: 500px;
 }

 .project-img {
     position: relative;
     width: 100%;
     height: 100%;
     border-radius: 4px;
     z-index: 0;
 }

 .project-img:before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: linear-gradient(to top, #7859fc, #a756f9);
     opacity: 0;
     transform: scale(0);
     transition: 0.5s;
 }

 .project-box:hover .project-img:before {
     transform: scale(1);
     opacity: 0.6;
 }

 .project-text {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     width: 100%;
     text-align: center;
     z-index: 1;
 }

 .project-text .h3-title {
     color: #ffffff;
     position: relative;
     top: -30px;
     opacity: 0;
     pointer-events: none;
     margin-bottom: 0;
     transition: 0.5s;
 }

 .project-box:hover .project-text .h3-title {
     pointer-events: unset;
     position: relative;
     top: 0;
     opacity: 1;
     transition-delay: 0.5s;
 }

 .project-text p {
     color: #ffffff;
     position: relative;
     top: -30px;
     opacity: 0;
     pointer-events: none;
     margin-bottom: 17px;
     transition: 0.5s;
 }

 .project-box:hover .project-text p {
     pointer-events: unset;
     position: relative;
     top: 0;
     opacity: 1;
     transition-delay: 0.6s;
 }

 .project-text a {
     display: inline-flex;
     justify-content: center;
     align-items: center;
     width: 60px;
     height: 60px;
     background: #ffffff;
     border-radius: 50%;
     color: #a756f9;
     font-size: 20px;
     transform: scale(0);
     transition: 0.5s;
 }

 .project-box:hover .project-text a {
     transform: scale(1);
     transition-delay: 0.7s;
 }

 .project-slider .slick-list {
     overflow: visible;
 }

 .main-team {
     position: relative;
     padding-top: 45px;
 }

 .main-team .sec-shape .shape1 {
     top: 170px;
     left: 122px;
 }

 .main-team .sec-shape .shape2 {
     bottom: 50px;
     left: 219px;
 }

 .main-team .sec-shape .shape3 {
     top: 255px;
     right: 225px;
 }

 .main-team .sec-shape .shape4 {
     bottom: 46px;
     right: 166px;
 }

 .team-box {
     position: relative;
     margin-bottom: 25px;
 }

 .team-img-box {
     width: 100%;
     height: 370px;
     border-radius: 4px;
     overflow: hidden;
     position: relative;
 }

 .team-img {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     border-radius: 4px;
     transition: 0.5s;
     z-index: 0;
 }

 .team-box:hover .team-img {
     transform: scale(1.1) rotate(3deg);
 }

 .team-social {
     position: absolute;
     top: 0;
     right: -100%;
     width: 100%;
     height: 100%;
     background-image: linear-gradient(to right, rgba(255, 0235, 59, 0.7), rgba(228, 148, 16, 0.7));
     display: flex;
     justify-content: center;
     align-items: center;
     text-align: center;
     transition: 0.5s;
     z-index: 1;
 }

 .team-box:hover .team-social {
     right: 0;
     opacity: 1;
 }

 .team-social-link {
     font-size: 0;
     line-height: 1;
 }

 .team-social-box {
     font-size: 0.9rem;
     line-height: 20px;
     color: #ffffff;
     transition: 0.3s;
     display: inline-block;
     margin: 12px 0;
     padding: 15px;
 }

 .team-social-box a:hover {
     color: #010f2e;
 }

 .team-text-box {
     display: block;
     width: calc(100% - 50px);
     background: #ffffff;
     border-radius: 20px;
     box-shadow: 1px 1px 60px rgba(0, 0, 0, 0.1);
     margin: -60px auto 0 auto;
     position: relative;
     padding: 26px 10px 23px 10px;
     text-align: center;
     z-index: 1;
 }

 .team-text-box p {
     color: #f88010;
     text-transform: uppercase;
     margin-bottom: 0;
 }

 .team-text-box .h3-title {
     margin-bottom: 0;
 }

 .team-slider .slick-list {
     padding-bottom: 40px !important;
 }

 .team-slider .slick-dots {
     text-align: center;
     bottom: -20px;
 }

 .main-team-sider {
     padding-bottom: 20px;
 }

 .main-testimonial {
     position: relative;
     padding-top: 70px;
     margin-bottom: 66px;
 }

 .main-testimonial .container {
     position: relative;
     z-index: 1;
 }

 .testimonial-title {
     position: relative;
     text-align: center;
     margin-bottom: 37px;
 }

 .main-testimonial-box {
     position: relative;
     margin-top: 25px;
     padding-bottom: 50px;
 }

 .main-testimonial-box:before {
     content: '';
     position: absolute;
     top: 40px;
     right: 40px;
     width: 172px;
     height: 122px;
     background-image: url('../images/quote2.png');
     background-size: 100%;
     background-position: center;
     background-repeat: no-repeat;
     pointer-events: none;
     z-index: 1;
 }

 .quote {
     position: absolute;
     top: -25px;
     left: 50%;
     transform: translate(-50%);
     width: 72px;
     display: inline-block;
     z-index: 1;
 }

 .main-testimonial-slider {
     width: 100%;
     border-radius: 20px;
     box-shadow: 1px 1px 80px rgba(0, 0, 0, 0.08);
     position: relative;
     padding: 34px 40px 34px 40px;
     position: relative;
     z-index: 0;
 }

 .testimonial-slider {
     position: relative;
     margin-bottom: 0 !important;
     z-index: 1;
 }

 .testimonial-text p {
     font-size: 18px;
     line-height: 28px;
     margin-bottom: 15px;
 }

 .review-by {
     position: relative;
     padding-top: 14px;
     padding-left: 5px;
     display: flex;
     align-items: center;
     margin-bottom: 20px;
 }

 .review-by-img {
     width: 100px;
     height: 100px;
     border-radius: 50%;
     position: relative;
     display: inline-block;
 }

 .review-by-text {
     display: inline-block;
     width: calc(100% - 100px);
     padding-left: 25px;
 }

 .review-by .h3-title {
     margin-bottom: 1px;
 }

 .review-by p {
     margin-bottom: 0;
     text-transform: uppercase;
     color: #f88010;
 }

 .testimonial-slider .slick-dots {
     bottom: -84px;
 }

 .testimonial-animate {
     position: absolute;
     top: 0;
     left: 50%;
     transform: translate(-50%);
     width: 1920px;
     height: 100%;
     z-index: 0;
 }

 .testimonial-img {
     position: absolute;
     width: 80px;
     height: 80px;
     border-radius: 50%;
 }

 .testimonial-img.testimonial-img1 {
     bottom: 212px;
     left: 90px;
     -webkit-animation: movedelement 5s linear infinite;
     animation: movedelement 5s linear infinite;
 }

 .testimonial-img.testimonial-img2 {
     bottom: 0;
     left: 57px;
     -webkit-animation: movedelement3 8s linear infinite;
     animation: movedelement3 8s linear infinite;
 }

 .testimonial-img.testimonial-img3 {
     bottom: 113px;
     left: 286px;
     -webkit-animation: movedelement2 10s linear infinite;
     animation: movedelement2 10s linear infinite;
 }

 .testimonial-img.testimonial-img4 {
     bottom: 213px;
     left: 571px;
     -webkit-animation: movedelement4 5s linear infinite;
     animation: movedelement4 5s linear infinite;
 }

 .testimonial-img.testimonial-img5 {
     bottom: 0;
     left: 485px;
     -webkit-animation: movedelement 7s linear infinite;
     animation: movedelement 7s linear infinite;
 }

 .testimonial-img.testimonial-img6 {
     bottom: 213px;
     right: 571px;
     -webkit-animation: movedelement3 6s linear infinite;
     animation: movedelement3 6s linear infinite;
 }

 .testimonial-img.testimonial-img7 {
     bottom: 0;
     right: 485px;
     -webkit-animation: movedelement2 8s linear infinite;
     animation: movedelement2 8s linear infinite;
 }

 .testimonial-img.testimonial-img8 {
     bottom: 113px;
     right: 286px;
     -webkit-animation: movedelement4 6s linear infinite;
     animation: movedelement4 6s linear infinite;
 }

 .testimonial-img.testimonial-img9 {
     bottom: 212px;
     right: 90px;
     -webkit-animation: movedelement 10s linear infinite;
     animation: movedelement 10s linear infinite;
 }

 .testimonial-img.testimonial-img10 {
     bottom: 0;
     right: 57px;
     -webkit-animation: movedelement2 5s linear infinite;
     animation: movedelement2 5s linear infinite;
 }

 .main-our-blog {
     position: relative;
     padding-top: 115px;
 }

 .our-blog-title {
     position: relative;
     text-align: center;
     margin-bottom: 37px;
 }

 .blog-box {
     width: 100%;
     position: relative;
 }

 .blog-img {
     width: 100%;
     height: 400px;
     border-radius: 4px;
     position: relative;
     z-index: 0;
 }

 .blog-date {
     padding: 10px;
 }

 .blog-date a {
     display: inline-block;
     background: linear-gradient(to right, #7859fc, #a756f9, #a756f9, #7859fc);
     background-size: 200% 100%;
     background-position: left center;
     padding: 5px 20px;
     font-size: 15px;
     line-height: 24px;
     color: #ffffff;
     border-radius: 4px;
     transition: 0.3s;
 }

 .blog-date a:hover {
     background-position: right center;
     color: #ffffff;
 }

 .blog-date a i {
     margin-right: 10px;
     vertical-align: text-top;
 }

 .blog-text {
     position: relative;
     background: #ffffff;
     width: calc(100% - 60px);
     display: block;
     margin: auto;
     box-shadow: 1px 1px 60px rgba(0, 0, 0, 0.08);
     margin-top: -78px;
     border-radius: 4px;
     padding: 23px 30px 25px 30px;
     z-index: 1;
 }

 .blog-text a {
     color: #a756f9;
     font-weight: bold;
     text-decoration: underline;
     transition: 0.3s;
 }

 .blog-text .h3-title a {
     display: inline-block;
     color: #010f2e;
     transition: 0.3s;
     text-transform: unset;
     text-decoration: unset !important;
 }

 .blog-text .h3-title a:hover {
     color: #a756f9;
 }

 .blog-text a:hover {
     color: #7859fc;
 }

 .blog-text a i {
     margin-left: 10px;
     font-size: 20px;
     vertical-align: text-bottom;
 }

 .blog-list .view-all {
     margin-top: 40px;
 }

 .main-contact {
     position: relative;
     padding: 120px 0 100px 0;
 }

 .contact-form .row {
     margin-right: -10px;
     margin-left: -10px;
 }

 .contact-form .sec-btn {
     margin-top: 10px;
 }

 .contact-link p {
     font-weight: 500;
     margin-bottom: 0;
 }

 .contact-link a {
     font-size: 50px;
     line-height: 60px;
     color: #a756f9;
     font-family: "Montserrat", sans-serif;
     font-weight: bold;
     transition: 0.3s;
 }

 .contact-link a:hover {
     color: #7859fc;
 }

 .main-partners {
     position: relative;
     padding: 60px 0;
     border-top: 1px solid #cccccc;
 }

 .partners-box {
     width: 100%;
     text-align: center;
 }

 .partners-box img {
     width: auto;
     filter: grayscale(1);
     transition: 0.3s;
 }

 .partners-box img:hover {
     filter: grayscale(0);
 }

 .main-get-started {
     position: relative;
     margin-bottom: -62px;
     z-index: 1;
 }

 .get-started-box {
     width: 100%;
     height: 122px;
     background: linear-gradient(to right, #f56915, #f0a80e);
     border-radius: 20px;
     box-shadow: 1px 1px 60px rgba(0, 0, 0, 0.1);
     display: flex;
     justify-content: space-between;
     align-items: center;
     padding: 10px 70px;
 }

 .get-started-box:before,
 .get-started-box:after,
 .get-started-box .circle-shape:before,
 .get-started-box .circle-shape:after,
 .get-started-box .circle-shape span:before,
 .get-started-box .circle-shape span:after {
     content: '';
     position: absolute;
     top: 17px;
     left: 79px;
     width: 24px;
     height: 24px;
     background: transparent;
     border: 5px solid #ffffff;
     border-radius: 50%;
     opacity: 0.1;
     pointer-events: none;
     animation: movedelement 5s linear infinite;
     z-index: 0;
 }

 .get-started-box:after {
     top: auto;
     bottom: 26px;
     left: 260px;
     animation: movedelement 7s linear infinite;
 }

 .get-started-box .circle-shape {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     border-radius: 20px;
     pointer-events: none;
     z-index: 0;
 }

 .get-started-box .circle-shape:before {
     top: 29px;
     left: 391px;
     animation: movedelement 10s linear infinite;
 }

 .get-started-box .circle-shape:after {
     top: 69px;
     left: auto;
     right: 464px;
     animation: movedelement 8s linear infinite;
 }

 .get-started-box .circle-shape span:before {
     top: 29px;
     left: auto;
     right: 43px;
     animation: movedelement 3s linear infinite;
 }

 .get-started-box .circle-shape span:after {
     top: auto;
     bottom: 38px;
     left: auto;
     right: 282px;
     animation: movedelement 5s linear infinite;
 }

 @keyframes movedelement {
     0% {
         -webkit-transform: translate(0);
         transform: translate(0);
         opacity: 0.3;
     }

     25% {
         -webkit-transform: translate(10px, 10px);
         transform: translate(10px, 10px);
         opacity: 0;
     }

     50% {
         -webkit-transform: translate(5px, 5px);
         transform: translate(5px, 5px);
         opacity: 0.2;
     }

     75% {
         -webkit-transform: translate(10px, -5px);
         transform: translate(10px, -5px);
         opacity: 0.7;
     }

     to {
         -webkit-transform: translate(0);
         transform: translate(0);
         opacity: 0.1;
     }
 }

 .get-started-text .h4-title {
     font-size: 40px;
     line-height: 50px;
     color: #ffffff;
     margin-bottom: 11px;
 }

 .get-started-text p {
     font-size: 18px;
     line-height: 28px;
     color: #ffffff;
     margin-bottom: 0;
 }

 .get-started-box .sec-btn {
     color: #f88010;
     background: #ffffff;
 }

 .get-started-box .sec-btn:hover {
     color: #ffffff;
 }

 .get-started-box .sec-btn:before {
     background: #010f2e;
 }

 .sec-shape {
     position: absolute;
     top: 0;
     left: 50%;
     transform: translate(-50%);
     width: 1920px;
     height: 100%;
     z-index: 0;
 }

 .shape {
     position: absolute;
     pointer-events: none;
 }

 .shape img {
     width: 100%;
 }

 .site-footer {
     position: relative;
     padding: 110px 0 30px 0;
     background: #000000;
     z-index: 0;
     margin-top: 25px;
 }

 .site-footer .sec-shape .shape1 {
     top: 195px;
     left: -5px;
 }

 .site-footer .sec-shape .shape2 {
     top: 146px;
     right: 216px;
 }

 .site-footer .sec-shape .shape3 {
     bottom: 122px;
     right: 150px;
 }

 .footer-logo a {
     display: inline-block;
     width: 204px;
     margin-bottom: 30px;
 }

 .footer-contact-box {
     min-height: 40px;
     margin-bottom: 18px;
 }

 .footer-contact-box:last-child {
     margin-bottom: 0;
 }

 .footer-contact-link {
     display: inline-block;
     padding-left: 51px;
     position: relative;
 }

 .footer-contact-link .icon {
     position: absolute;
     top: 50%;
     left: 0;
     transform: translate(0, -50%);
     display: inline-flex;
     justify-content: center;
     align-items: center;
     text-align: center;
     width: 40px;
     height: 40px;
     background: linear-gradient(to right, #f56915, #f0a80e);
     border-radius: 50%;
     color: #ffffff;
     font-size: 20px;
 }

 .footer-contact-link a {
     display: block;
     color: #FFFFFF;
     font-size: 15px;
     line-height: 20px;
     transition: 0.3s;
 }

 .footer-contact-link a:hover {
     color: #f88010;
 }

 .social-icon {
     font-size: 0;
     line-height: 1;
     margin-top: 48px;
 }

 .social-icon a {
     width: 41px;
     height: 41px;
     background: rgba(255, 255, 255, 0.2);
     display: inline-flex;
     justify-content: center;
     align-items: center;
     font-size: 0.9rem;
     color: #f88010;
     border-radius: 50%;
     margin-right: 14px;
     position: relative;
     transition: 0.3s;
 }

 .social-icon a:last-child {
     margin-right: 0;
 }

 .social-icon a:hover {
     color: #ffffff;
 }

 .social-icon a:hover i {
     z-index: 9;
 }

 .social-icon a:before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: linear-gradient(to right, #ffeb3b, #ff5722);
     border-radius: 50%;
     opacity: 0;
     transition: 0.3s;
 }

 .social-icon a:hover:before {
     opacity: 1;
 }

 .h3-title.footer-title {
     position: relative;
     padding-bottom: 2px;
     margin-bottom: 26px;
     color: #ffffff;
 }

 .h3-title.footer-title:before {
     content: '';
     position: absolute;
     bottom: 0px;
     left: 0;
     width: 70px;
     height: 1px;
     background: linear-gradient(to right, #ffeb3b, #ff5722);
 }

 .our-links,
 .our-services {
     padding-left: 60px;
 }

 .our-links ul,
 .our-services ul {
     padding: 0;
     margin: 0;
     list-style: none;
     font-size: 0;
     line-height: 1;
     column-count: 2;
 }

 .our-services ul {
     column-count: unset;
 }

 .our-links ul li,
 .our-services ul li {
     display: block;
     font-size: 15px;
     line-height: 25px;
     margin-bottom: 6px;
 }

 .our-links ul li:last-child,
 .our-services ul li:last-child {
     margin-bottom: 0;
 }

 .our-links ul li a,
 .our-services ul li a {
     font-size: 15px;
     line-height: 25px;
     color: #eeeeee;
     transition: 0.3s;
 }

 .our-links ul li a:hover,
 .our-services ul li a:hover {
     color: #f88010;
 }

 .free-consultation {
     text-align: center;
     padding-top: 48px;
 }

 .free-consultation .icon {
     display: inline-block;
     margin-bottom: 6px;
 }

 .free-consultation p {
     margin-bottom: 5px;
 }

 .free-consultation .h3-title {
     margin-bottom: 0;
 }

 .free-consultation .h3-title a {
     color: #ffffff;
     text-decoration: underline;
     transition: 0.3s;
 }

 .free-consultation .h3-title a:hover {
     color: #f88010;
 }

 .footer-last {
     background: #333333;
     padding: 15px 0;
 }

 .copy-right p {
     color: #eeeeee;
     margin-bottom: 0;
 }

 .copy-right p a {
     color: #eeeeee;
     transition: 0.3s;
 }

 .copy-right p a:hover {
     color: #f88010;
 }

 .footer-last-link {
     text-align: right;
 }

 .footer-last-link ul {
     margin: 0;
     padding: 0;
     list-style: none;
     font-size: 0;
     line-height: 1;
 }

 .footer-last-link ul li {
     display: inline-block;
     font-size: 15px;
     line-height: 25px;
     padding-left: 20px;
     position: relative;
     margin-left: 33px;
 }

 .footer-last-link ul li:before {
     content: '';
     position: absolute;
     top: 50%;
     transform: translate(0, -50%);
     left: 0;
     width: 8px;
     height: 8px;
     background: #f88010;
     border-radius: 50%;
 }

 .footer-last-link ul li:first-child {
     margin-left: 0;
 }

 .footer-last-link ul li a {
     font-size: 15px;
     color: #eeeeee;
     transition: 0.3s;
 }

 .footer-last-link ul li a:hover {
     color: #f88010;
 }

 .scroll-top {
     position: fixed;
     bottom: 10px;
     right: 10px;
     width: 50px;
     height: 50px;
     background: linear-gradient(to right, #f56915, #f0a80e);
     font-size: 30px;
     color: #ffffff;
     border-radius: 10px;
     box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
     transition: 0.3s;
     z-index: 50;
     display: none;
 }

 .scroll-top:hover {
     box-shadow: 2px 2px 40px rgb(120 89 252 / 50%);
     color: #ffffff;
 }

 .scroll-top i {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     line-height: 10px;
 }

 .scroll-top:hover i {
     animation: swipe 0.6s linear infinite alternate;
 }

 @keyframes swipe {
     from {
         margin-top: -3px;
     }

     to {
         margin-top: 3px;
     }
 }

 .bubbles_wrap {
     position: fixed;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     z-index: 990;
     overflow: hidden;
     pointer-events: none;
 }

 @-webkit-keyframes animateBubble {
     0% {
         margin-top: 20%;
     }

     to {
         margin-top: -30%;
     }
 }

 @-moz-keyframes animateBubble {
     0% {
         margin-top: 20%;
     }

     to {
         margin-top: -30%;
     }
 }

 @keyframes animateBubble {
     0% {
         margin-top: 20%;
     }

     to {
         margin-top: -30%;
     }
 }

 @-webkit-keyframes sideWays {
     0% {
         margin-left: 0;
     }

     to {
         margin-left: 25px;
     }
 }

 @-moz-keyframes sideWays {
     0% {
         margin-left: 0;
     }

     to {
         margin-left: 25px;
     }
 }

 @keyframes sideWays {
     0% {
         margin-left: 0;
     }

     to {
         margin-left: 25px;
     }
 }

 .x1 {
     -webkit-animation: animateBubble 15s linear infinite, sideWays 2s ease-in-out infinite alternate;
     animation: animateBubble 15s linear infinite, sideWays 2s ease-in-out infinite alternate;
     left: 6%;
     top: 45%;
     background: #7859fc;
 }

 .x2 {
     -webkit-animation: animateBubble 10s linear infinite, sideWays 4s ease-in-out infinite alternate;
     animation: animateBubble 10s linear infinite, sideWays 4s ease-in-out infinite alternate;
     left: 5%;
     top: 80%;
     background: #a756f9;
 }

 .x3 {
     -webkit-animation: animateBubble 18s linear infinite, sideWays 2s ease-in-out infinite alternate;
     animation: animateBubble 18s linear infinite, sideWays 2s ease-in-out infinite alternate;
     left: 10%;
     top: 40%;
     background: #7859fc;
 }

 .x4 {
     -webkit-animation: animateBubble 12s linear infinite, sideWays 3s ease-in-out infinite alternate;
     animation: animateBubble 12s linear infinite, sideWays 3s ease-in-out infinite alternate;
     left: 20%;
     top: 0;
     background: #a756f9;
 }

 .x5 {
     -webkit-animation: animateBubble 19s linear infinite, sideWays 4s ease-in-out infinite alternate;
     animation: animateBubble 19s linear infinite, sideWays 4s ease-in-out infinite alternate;
     left: 30%;
     top: 50%;
     background: #7859fc;
 }

 .x6 {
     -webkit-animation: animateBubble 11s linear infinite, sideWays 2s ease-in-out infinite alternate;
     animation: animateBubble 11s linear infinite, sideWays 2s ease-in-out infinite alternate;
     left: 50%;
     top: 0;
     background: #a756f9;
 }

 .x7 {
     -webkit-animation: animateBubble 10s linear infinite, sideWays 2s ease-in-out infinite alternate;
     animation: animateBubble 10s linear infinite, sideWays 2s ease-in-out infinite alternate;
     left: 65%;
     top: 70%;
     background: #7859fc;
 }

 .x8 {
     -webkit-animation: animateBubble 12s linear infinite, sideWays 3s ease-in-out infinite alternate;
     animation: animateBubble 12s linear infinite, sideWays 3s ease-in-out infinite alternate;
     left: 80%;
     top: 10%;
     background: #a756f9;
 }

 .x9 {
     -webkit-animation: animateBubble 19s linear infinite, sideWays 4s ease-in-out infinite alternate;
     animation: animateBubble 19s linear infinite, sideWays 4s ease-in-out infinite alternate;
     left: 90%;
     top: 50%;
     background: #7859fc;
 }

 .x10 {
     -webkit-animation: animateBubble 16s linear infinite, sideWays 2s ease-in-out infinite alternate;
     animation: animateBubble 16s linear infinite, sideWays 2s ease-in-out infinite alternate;
     left: 80%;
     top: 80%;
     background: #a756f9;
 }

 .bubble {
     position: absolute;
     border-radius: 50%;
     box-shadow: none;
     width: 5px;
     height: 5px;
 }

 .about-text ul {
     font-size: 0;
     line-height: 1;
     list-style: none;
     margin-top: 17px;
     margin-bottom: 33px;
 }

 .about-text ul li {
     position: relative;
     font-size: 15px;
     color: #010f2e;
     margin-bottom: 17px;
 }

 .about-text ul li:last-child {
     margin-bottom: 0;
 }

 .about-text ul li .icon {
     position: absolute;
     top: 50%;
     left: 0;
     transform: translate(0, -50%);
     width: 35px;
     height: 35px;
     background: linear-gradient(to right, #705fed, #c6beff);
     display: inline-flex;
     justify-content: center;
     align-items: center;
     text-align: center;
     color: #ffffff;
     border-radius: 50%;
 }

 .about-text ul li:nth-child(odd) .icon {
     background: linear-gradient(to right, #705fed, #c6beff);
 }

 .about-text ul li:nth-child(even) .icon {
     background: linear-gradient(to right, #f57b00, #ffb66c);
 }

 .main-who-we-are {
     position: relative;
     padding-top: 120px;
 }

 .who-we-are-content {
     padding-top: 25px;
 }

 .who-we-are-list {
     margin-top: 30px;
 }

 .who-we-are-list-box {
     display: flex;
     align-items: center;
     margin-bottom: 26px;
 }

 .who-we-are-list-box:last-child {
     margin-bottom: 0;
 }

 .who-we-are-list-icon {
     width: 80px;
     height: 80px;
     background: #ffffff;
     border-radius: 50%;
     display: inline-flex;
     justify-content: center;
     align-items: center;
     box-shadow: 1px 1px 60px rgba(0, 0, 0, 0.1);
 }

 .who-we-are-list-icon img {
     width: auto;
     height: auto;
 }

 .who-we-are-list-text {
     display: inline-block;
     width: calc(100% - 80px);
     padding-left: 20px;
 }

 .who-we-are-list-text .h3-title {
     margin-bottom: 5px;
 }

 .who-we-are-list-text p {
     margin-bottom: 0;
 }

 .who-we-are-img img {
     max-width: unset;
     width: 616px;
 }

 .main-services.page-services-list {
     padding-top: 120px;
 }

 .page-services-list .services-list {
     margin-bottom: -30px;
 }

 .page-services-list .service-box {
     padding: 35px 27px;
     margin-bottom: 30px;
 }

 .main-best {
     position: relative;
     padding-top: 120px;
 }

 .best-list {
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     margin-right: -15px;
     margin-left: -15px;
     margin-top: 33px;
 }

 .best-list-box {
     width: 50%;
     display: inline-block;
     padding: 0 15px;
 }

 .best-list-icon {
     margin-bottom: 23px;
 }

 .best-list-icon img {
     width: auto;
     height: 57px;
 }

 .best-list-text .h3-title {
     margin-bottom: 5px;
 }

 .best-list-text p {
     margin-bottom: 0;
     padding-right: 30px;
 }

 .best-img-box {
     position: relative;
 }

 .best-img-box:before {
     content: '';
     position: absolute;
     bottom: 0;
     left: 0;
     width: 100%;
     height: calc(100% - 200px);
     background: linear-gradient(to top, #7859fc, #a756f9);
     border-radius: 20px;
     z-index: 0;
 }

 .best-img-box img {
     width: 522px;
     display: block;
     margin: auto;
     position: relative;
     z-index: 1;
 }

 .main-team.page-team {
     padding-top: 120px;
 }

 .main-team.page-team .main-team-list {
     margin-bottom: -33px;
 }

 .main-team.page-team .team-box {
     margin-bottom: 33px;
 }

 .main-pricing.page-pricing {
     padding: 120px 0 0 0;
 }

 .main-contact.page-contact {
     padding: 115px 0 112px 0;
 }

 .contact-page-link {
     display: flex;
     flex-wrap: wrap;
     margin-top: 36px;
 }

 .contact-page-link-box {
     width: 50%;
     display: inline-flex;
     margin-bottom: 20px;
 }

 .contact-page-link-box.location {
     width: 65%;
 }

 .contact-page-link-box:last-child {
     margin-bottom: 0;
 }

 .contact-page-link-icon {
     width: 65px;
     height: 65px;
     background: #ffffff;
     border-radius: 4px;
     box-shadow: 2px 2px 60px rgba(0, 0, 0, 0.1);
     display: inline-flex;
     justify-content: center;
     align-items: center;
 }

 .contact-page-link-icon img {
     width: auto;
     height: auto;
 }

 .contact-page-link-text {
     display: inline-block;
     width: calc(100% - 65px);
     padding-left: 20px;
 }

 .contact-page-link-text .h3-title {
     margin-bottom: 0px;
 }

 .contact-page-link-text p {
     margin-bottom: 5px;
 }

 .contact-page-link-text a {
     display: inline-block;
     line-height: 28px;
     color: #777777;
     font-weight: 500;
     transition: 0.3s;
 }

 .contact-page-link-text a:hover {
     color: #f88010;
 }

 .contact-map {
     width: 100%;
     height: 600px;
     position: relative;
 }

 .contact-map iframe {
     width: 100%;
     height: 100%;
 }

 .main-portfolio-tabbing {
     position: relative;
     padding: 115px 0 120px 0;
 }

 .portfolio-tabbing ul {
     margin: 0;
     padding: 0;
     list-style: none;
     display: flex;
     align-items: center;
     justify-content: space-between;
 }

 .portfolio-tabbing ul.clearfix:after {
     display: none !important;
 }

 .portfolio-tabbing ul li .filter {
     display: inline-block;
     font-weight: 500;
     transition: 0.3s;
     cursor: pointer;
 }

 .portfolio-tabbing ul li .filter:hover,
 .portfolio-tabbing ul li .filter.active {
     color: #7859fc;
     text-decoration: underline;
 }

 .portfolio-list-box {
     margin-bottom: -30px;
 }

 .portfoliolist {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: start;
     -ms-flex-pack: start;
     justify-content: flex-start;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     position: relative;
     margin-left: -15px;
     margin-right: -15px;
     padding-top: 50px;
 }

 .portfolio {
     width: 100%;
     -webkit-box-flex: 0;
     -ms-flex: 0 0 50%;
     flex: 0 0 50%;
     max-width: 50%;
     position: relative;
     padding: 0 15px;
     display: none;
 }

 .portfolio-wrapper {
     width: 100%;
     height: 470px;
     position: relative;
     border-radius: 4px;
     margin-bottom: 30px;
     overflow: hidden;
     transition: 0.5s;
 }

 .portfolio-wrapper:hover {
     box-shadow: 2px 2px 60px rgba(0, 0, 0, 0.2);
 }

 .portfolio-wrapper:before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: linear-gradient(to top, #7859fc, #a756f9);
     opacity: 0;
     transform: scale(0);
     transition: 0.5s;
     z-index: 1;
 }

 .portfolio-wrapper:hover:before {
     transform: scale(1);
     opacity: 0.6;
 }

 .portfolio-wrapper .portfolio-img {
     width: 100%;
     height: 100%;
     position: absolute;
     top: 50%;
     left: 50%;
     -webkit-transform: translate(-50%, -50%);
     transform: translate(-50%, -50%);
     background-size: cover;
     background-position: center;
     -webkit-transition: 0.5s;
     transition: 0.5s;
     z-index: 0;
 }

 .portfolio-wrapper-text {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     width: 100%;
     text-align: center;
     z-index: 2;
 }

 .portfolio-wrapper-text .h3-title {
     color: #ffffff;
     position: relative;
     top: -30px;
     opacity: 0;
     pointer-events: none;
     margin-bottom: 0;
     transition: 0.5s;
 }

 .portfolio-wrapper:hover .portfolio-wrapper-text .h3-title {
     pointer-events: unset;
     position: relative;
     top: 0;
     opacity: 1;
     transition-delay: 0.5s;
 }

 .portfolio-wrapper-text p {
     color: #ffffff;
     position: relative;
     top: -30px;
     opacity: 0;
     pointer-events: none;
     margin-bottom: 17px;
     transition: 0.5s;
 }

 .portfolio-wrapper:hover .portfolio-wrapper-text p {
     pointer-events: unset;
     position: relative;
     top: 0;
     opacity: 1;
     transition-delay: 0.6s;
 }

 .portfolio-wrapper-text a {
     display: inline-flex;
     justify-content: center;
     align-items: center;
     width: 60px;
     height: 60px;
     background: #ffffff;
     border-radius: 50%;
     color: #a756f9;
     font-size: 20px;
     transform: scale(0);
     transition: 0.5s;
 }

 .portfolio-wrapper:hover .portfolio-wrapper-text a {
     transform: scale(1);
     transition-delay: 0.7s;
 }

 .main-portfolio-details {
     position: relative;
     padding: 113px 0 120px 0;
     overflow: visible;
 }

 .portfolio-detail-info-box p {
     margin-bottom: 0px;
 }

 .portfolio-detail-info-box {
     margin-bottom: 16px;
 }

 .portfolio-detail-info .social-icon a {
     background: rgb(167, 86, 249, 0.2);
     color: #a756f9;
 }

 .portfolio-detail-info .social-icon {
     text-align: left;
     margin-top: 25px;
 }

 .portfolio-detail-info .social-icon a:hover {
     color: #ffffff;
 }

 .main-portfolio-details-img {
     margin-top: 50px;
 }

 .portfolio-detail-img {
     width: 100%;
     height: 500px;
     border-radius: 4px;
     margin-bottom: 30px;
 }

 .portfolio-detail-img:last-child {
     margin-bottom: 0;
 }

 .main-faq-content {
     position: relative;
     ;
 }

 .faq-content-box {
     position: relative;
     z-index: 5;
 }

 .faq-content-box .sub-title {
     margin-bottom: 10px;
 }

 .faq-accordion {
     margin-top: 22px;
 }

 .faq-accordion .card {
     background: #ffffff;
     box-shadow: 2px 2px 60px rgba(0, 0, 0, 0.08);
     border: none;
     border-radius: 4px !important;
     overflow: hidden;
     margin-bottom: 10px;
 }

 .faq-accordion .card:last-child {
     margin-bottom: 0;
 }

 .faq-accordion .card-header {
     padding: 0;
     background: transparent;
     border: none;
     border-radius: 4px;
     margin-bottom: 0 !important;
 }

 .faq-accordion .card-header .h3-title {
     height: 50px;
     display: flex;
     align-items: center;
     font-size: 14px;
     line-height: 24px;
     margin-bottom: 0;
     padding: 5px 70px 5px 30px;
     position: relative;
     background: #ffffff;
     color: #ffffff;
     border-radius: 4px;
     cursor: pointer;
     transition: 0.3s;
 }

 .faq-accordion .card-header .h3-title.collapsed {
     color: #010f2e;
 }

 .faq-accordion .card-header .h3-title:before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: linear-gradient(to right, #ff5066, #fc9d44);
     border-radius: 4px;
     opacity: 1;
     transition: 0.3s;
     z-index: 0;
 }

 .faq-accordion .card-header .h3-title.collapsed:before {
     opacity: 0;
 }

 .faq-accordion .card-header .h3-title>span {
     position: relative;
     z-index: 1;
 }

 .faq-accordion .card-header .h3-title .icon {
     position: absolute;
     top: 5px;
     right: 5px;
     width: 40px;
     height: 40px;
     background: #ffffff;
     border-radius: 4px;
     display: flex;
     justify-content: center;
     align-items: center;
     font-size: 1.4rem;
 }

 .faq-accordion .card-header .h3-title .icon:before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: linear-gradient(to right, #ff5066, #fc9d44);
     border-radius: 4px;
     opacity: 0;
     transition: 0.3s;
     z-index: 0;
 }

 .faq-accordion .card-header .h3-title.collapsed .icon:before {
     opacity: 1;
 }

 .faq-accordion .card-header .h3-title .icon i {
     position: relative;
     color: #ff5066;
     transform: rotate(-90deg);
     transition: 0.3s;
     z-index: 1;
 }

 .faq-accordion .card-header .h3-title.collapsed .icon i {
     color: #ffffff;
     transform: rotate(0deg);
 }

 .faq-accordion .card-body {
     padding: 15px;
 }

 .faq-accordion .card-body p {
     font-size: 0.8rem;
 }

 .faq-accordion .card-body p:last-child {
     margin-bottom: 0;
 }

 .faq-img-box img {
     position: relative;
     left: -43px;
     max-width: unset;
     width: 720px;
     height: auto;
 }

 .main-faq-content.even {
     padding-top: 56px;
     padding-bottom: 120px;
 }

 .main-faq-content.even:before {
     display: none;
 }

 .main-faq-content.even .faq-img-box img {
     float: right;
     position: relative;
     left: auto;
     right: -40px;
     width: 865px;
 }

 .main-testimonial.page-faq-testimonial {
     padding-bottom: 5px;
 }

 .faq-accordion .sub-accordian .card {
     background: #f9f9f9;
     box-shadow: none !important;
     border: none;
     border-radius: 4px !important;
     overflow: hidden;
     margin-bottom: 10px;
 }

 .faq-accordion .sub-accordian .mb-0>a {
     display: block;
     position: relative;
     font-size: 14px;
     font-weight: bold;
     color: #000;
 }

 .faq-accordion .sub-accordian .mb-0>a:after {
     content: "\f104";
     font-family: 'FontAwesome';
     position: absolute;
     right: 0;
 }

 .faq-accordion .sub-accordian .mb-0>a[aria-expanded="true"]:after {
     content: "\f104";
     transform: rotate(-90deg);
 }

 .faq-accordion .sub-accordian .card-header {
     padding: 10px 15px;
 }

 .main-blog-content {
     position: relative;
     padding: 120px 0;
 }

 .main-blog-content .blog-box {
     margin-bottom: 30px;
 }

 .main-blog-content .blog-text .h3-title a {
     color: #010f2e;
     text-decoration: unset !important;
     transition: 0.3s;
 }

 .main-blog-content .blog-text .h3-title a:hover {
     color: #7859fc;
 }

 .blog-text.no-img {
     margin-top: 0;
     width: 100%;
     padding-top: 30px;
 }

 .blog-text .blog-date {
     padding: 0;
     margin-bottom: 22px;
     position: relative;
 }

 .blog-text .blog-date a {
     color: #ffffff;
     text-decoration: unset !important;
     font-weight: normal;
 }

 .blog-text .blog-date a i {
     font-size: 15px;
     vertical-align: text-top;
     margin-left: 0;
 }

 .blog-img .blog-date {
     position: relative;
     z-index: 1;
 }

 .blog-post-slider {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     border-radius: 4px;
     z-index: 0;
 }

 .blog-img-slide,
 .blog-post-slider .slick-list,
 .blog-post-slider .slick-track,
 .blog-post-slider .slick-slide {
     width: 100%;
     height: 100%;
     border-radius: 4px;
 }

 .blog-pagination {
     display: block;
     text-align: center;
     margin-top: 40px;
 }

 .pagination-arrow {
     color: #7859fc;
     font-size: 35px;
     display: inline-block;
     margin: 0 18px;
     vertical-align: middle;
     transition: 0.3s;
 }

 .pagination-arrow:hover {
     color: #a756f9;
 }

 .blog-pagination ul {
     margin: 0;
     padding: 0;
     list-style: none;
     display: inline-block;
     vertical-align: middle;
     font-size: 0;
 }

 .blog-pagination ul li {
     display: inline-flex;
     justify-content: center;
     align-items: center;
     width: 45px;
     height: 45px;
     background: transparent;
     border: 1px solid #777777;
     border-radius: 4px;
     color: #777777;
     font-size: 20px;
     margin: 0 7px;
     cursor: pointer;
     transition: 0.3s;
 }

 .blog-pagination ul li:hover {
     background: #7859fc;
     border-color: #7859fc;
     color: #ffffff;
 }

 .blog-pagination ul li.active,
 .blog-pagination ul li.active:hover {
     background: #d7d7d7;
     border-color: #d7d7d7;
     color: #777777;
     cursor: default;
 }

 .blog-sidebar {
     position: relative;
 }

 .blog-search-from {
     margin-bottom: 63px;
 }

 .sidebar-title {
     font-size: 30px;
     line-height: 35px;
     color: #010f2e;
     font-weight: bold;
     font-family: "Montserrat", sans-serif;
     margin-bottom: 30px;
     position: relative;
     padding-bottom: 4px;
 }

 .sidebar-title:before {
     content: '';
     position: absolute;
     bottom: 0;
     left: 0;
     width: 70px;
     height: 3px;
     background: linear-gradient(to right, #f56915, #f0a80e);
 }

 .blog-search-from input {
     width: 100%;
     height: 60px;
     border: none;
     outline: none;
     background: #ffffff;
     border-radius: 4px;
     box-shadow: 1px 1px 60px rgba(0, 0, 0, 0.1);
     color: #777777;
     font-size: 0.9rem;
     padding: 10px 60px 10px 30px;
 }

 .blog-search-from .sec-btn {
     width: 50px;
     height: 50px;
     padding: 0;
     position: absolute;
     top: 5px;
     right: 5px;
     border-radius: 4px;
 }

 .blog-search-from .sec-btn:before {
     border-radius: 4px;
 }

 .blog-search-from .sec-btn span i {
     margin: 0;
 }

 .recent-post {
     margin-bottom: 63px;
 }

 .recent-post-box {
     display: flex;
     flex-wrap: wrap;
     align-items: center;
     margin-bottom: 20px;
 }

 .recent-post-img {
     width: 110px;
     height: 110px;
     display: inline-block;
     border-radius: 4px;
 }

 .recent-post-text {
     width: calc(100% - 110px);
     display: inline-block;
     padding-left: 20px;
 }

 .recent-post-text h6 {
     font-size: 18px;
     line-height: 24px;
     color: #010f2e;
     font-weight: bold;
     font-family: "Montserrat", sans-serif;
     margin-bottom: 8px;
 }

 .recent-post-text h6 a {
     display: inline-block;
     color: #010f2e;
     transition: 0.3s;
 }

 .recent-post-text h6 a:hover {
     color: #7959fc;
 }

 .recent-post-text p {
     color: #7959fc;
     margin-bottom: 0;
 }

 .recent-post-text p i {
     margin-right: 5px;
 }

 .categories {
     margin-bottom: 70px;
 }

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

 .categories ul li {
     display: block;
     position: relative;
     margin-bottom: 10px;
 }

 .categories ul li a {
     display: flex;
     align-items: center;
     position: relative;
     height: 45px;
     background: transparent;
     border-radius: 4px;
     color: #777777;
     padding: 5px 45px 5px 25px;
     transition: 0.3s;
 }

 .categories ul li a:hover {
     color: #7959fc;
     background: #ffffff;
     box-shadow: 1px 1px 60px rgba(0, 0, 0, 0.1);
 }

 .categories ul li a .categories-text {
     position: relative;
     padding-left: 15px;
     display: inline-block;
 }

 .categories ul li a .categories-text:before {
     content: "\f105";
     position: absolute;
     top: 50%;
     left: 0;
     transform: translate(0, -50%);
     font-family: 'FontAwesome';
     font-size: 15px;
     line-height: 8px;
 }

 .categories ul li a span:last-child {
     position: absolute;
     top: 5px;
     right: 5px;
     width: 35px;
     height: 35px;
     display: inline-flex;
     justify-content: center;
     align-items: center;
     background: #e1e1e1;
     border-radius: 4px;
     color: #777777;
     transition: 0.3s;
 }

 .categories ul li a:hover span:last-child {
     background: linear-gradient(to right, #7859fc, #a756f9);
     color: #ffffff;
 }

 .advertising {
     margin-bottom: 63px;
 }

 .advertising-box {
     width: 100%;
     height: 370px;
     border-radius: 4px;
     display: flex;
     justify-content: center;
     align-items: center;
 }

 .advertising-text {
     width: calc(100% - 100px);
     height: 165px;
     display: flex;
     justify-content: center;
     align-items: center;
     position: relative;
 }

 .advertising-text:before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: linear-gradient(to right, #7859fc, #a756f9);
     border-radius: 4px;
     opacity: 0.8;
     z-index: 0;
 }

 .advertising-text .sidebar-title {
     color: #ffffff;
     padding-bottom: 0;
     margin-bottom: 0;
     position: relative;
     z-index: 1;
 }

 .advertising-text .sidebar-title:before {
     display: none;
 }

 .tag {
     margin-bottom: 50px;
 }

 .tag ul {
     margin: 0;
     padding: 0;
     list-style: none;
     font-size: 0;
 }

 .tag ul li {
     display: inline-block;
 }

 .tag ul li a {
     display: inline-block;
     padding: 5px 25px;
     background: transparent;
     border: 1px solid #777777;
     border-radius: 4px;
     font-size: 15px;
     line-height: 20px;
     color: #777777;
     text-align: center;
     margin-bottom: 15px;
     margin-right: 15px;
     transition: 0.3s;
 }

 .tag ul li a:hover {
     background: #a756f9;
     border-color: #a756f9;
     color: #ffffff;
 }

 .gallery-boxes {
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     margin-right: -10px;
     margin-left: -10px;
 }

 .gallery-img-box {
     width: 33.3333%;
     padding: 0 10px;
 }

 .gallery-img {
     width: 100%;
     height: 110px;
     border-radius: 4px;
     margin-bottom: 20px;
 }

 .page-blog-post .blog-img-box .blog-img {
     height: 400px;
     margin-bottom: 22px;
 }

 .blog-date .by-admin {
     margin-left: 20px;
 }

 .post-comment-box {
     padding: 15px 40px 15px 20px;
     position: relative;
     background: #ffffff;
     box-shadow: 2px 2px 60px rgba(0, 0, 0, 0.1);
     border-radius: 4px;
     overflow: hidden;
     margin: 22px 0;
 }

 .post-comment-box:before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 4px;
     height: 100%;
     background: linear-gradient(to top, #7859fc, #a756f9);
 }

 .post-comment-box .h3-title {
     font-style: italic;
     margin-bottom: 0;
 }

 .post-comment-box img {
     width: 42px;
     height: 38px;
     float: right;
     margin-top: -20px;
     margin-right: -20px;
     margin-bottom: -38px;
 }

 .blog-post-img {
     display: flex;
     align-items: center;
     margin-left: -15px;
     margin-right: -15px;
     margin-top: 23px;
     margin-bottom: 23px;
 }

 .post-img-box {
     width: 50%;
     padding: 0 15px;
 }

 .post-img {
     width: 100%;
     height: 370px;
     border-radius: 4px;
     display: inline-block;
     position: relative;
 }

 .blog-post-text-list {
     list-style: none;
     margin-bottom: 23px;
 }

 .blog-post-text-list li {
     min-height: 35px;
     position: relative;
     padding-left: 50px;
     color: #010f2e;
     margin-bottom: 17px;
 }

 .blog-post-text-list li:before {
     content: "\f00c";
     position: absolute;
     top: 50%;
     left: 0;
     transform: translate(0, -50%);
     width: 35px;
     height: 35px;
     background: linear-gradient(to right, #7859fc, #a756f9);
     border-radius: 50%;
     font-size: 15px;
     color: #ffffff;
     font-family: 'FontAwesome';
     display: flex;
     justify-content: center;
     align-items: center;
 }

 .blog-post-text-list li:nth-child(1):before {
     background: linear-gradient(to right, #705fed, #c6beff);
 }

 .blog-post-text-list li:nth-child(2):before {
     background: linear-gradient(to right, #f57b00, #ffb66c);
 }

 .blog-post-text-list li:nth-child(3):before {
     background: linear-gradient(to right, #31ca7b, #83ffbf);
 }

 .blog-post-text-list li:nth-child(4):before {
     background: linear-gradient(to right, #ff5066, #ff7a8b);
 }

 .blog-post-footer {
     border-top: 1px dashed #777777;
     padding-top: 20px;
     display: flex;
     align-items: center;
     justify-content: space-between;
 }

 .blog-post-footer .tag {
     margin-bottom: -15px;
 }

 .blog-post-footer .tag p {
     display: inline-block;
     color: #010f2e;
     vertical-align: middle;
     margin-right: 10px;
     margin-bottom: 15px;
 }

 .blog-post-footer .tag p i {
     margin-right: 5px;
     transform: rotateY(180deg);
 }

 .blog-post-footer .tag ul {
     display: inline-block;
     vertical-align: middle;
 }

 .social-icon {
     font-size: 0;
     line-height: 1;
 }

 .blog-post-social a {
     width: 41px;
     height: 41px;
     background: #ffffff;
     display: inline-flex;
     justify-content: center;
     align-items: center;
     font-size: 0.9rem;
     color: #7859fc;
     border-radius: 50%;
     margin-left: 14px;
     position: relative;
     transition: 0.3s;
 }

 .blog-post-social a:first-child {
     margin-left: 0;
 }

 .blog-post-social a:last-child {
     margin-right: 0;
 }

 .blog-post-social a:hover {
     color: #ffffff;
 }

 .blog-post-social a:before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: linear-gradient(to right, #7859fc, #a756f9);
     border-radius: 50%;
     opacity: 0.3;
     transition: 0.3s;
 }

 .blog-post-social a:hover:before {
     opacity: 1;
 }

 .related-blog {
     margin-top: 113px;
 }

 .related-blog .sub-title {
     margin-bottom: 11px;
 }

 .details-post-comment {
     margin-top: 108px;
 }

 .details-post-comment .sub-title {
     margin-bottom: 10px;
 }

 .detail-comment-box {
     width: 100%;
     height: 170px;
     background: #ffffff;
     box-shadow: 2px 2px 60px rgba(0, 0, 0, 0.1);
     border-radius: 4px;
     padding: 5px;
     display: flex;
     align-items: center;
     margin-bottom: 20px;
 }

 .detail-comment-box:last-child {
     margin-bottom: 0;
 }

 .detail-comment-box.even {
     width: calc(100% - 50px);
     display: flex;
     margin-left: auto;
 }

 .detail-comment-img {
     width: 160px;
     height: 160px;
     display: inline-block;
 }

 .detail-comment-text {
     display: inline-block;
     width: calc(100% - 160px);
     padding: 0 30px 0 20px;
 }

 .detail-comment-title {
     font-size: 20px;
     line-height: 30px;
     font-weight: bold;
     color: #010f2e;
     font-family: "Montserrat", sans-serif;
     margin-bottom: 10px;
 }

 .detail-comment-text a {
     color: #7859fc;
     font-weight: 500;
     text-transform: uppercase;
     transition: 0.3s;
 }

 .detail-comment-text a:hover {
     color: #a756f9;
 }

 .detail-comment-text a i {
     margin-right: 5px;
 }

 .leave-review {
     margin-top: 113px;
 }

 .leave-review .sub-title {
     margin-bottom: 11px;
 }

 .leave-review-form {
     margin-bottom: -20px;
 }

 .leave-review-form .row {
     margin-right: -10px;
     margin-left: -10px;
 }

 .leave-review-form .row .col-lg-6,
 .leave-review-form .row .col-lg-12 {
     padding: 0 10px;
 }

 .leave-review-form textarea.form-input {
     height: 120px;
 }

 @media screen and (min-width: 1280px) {
     .container {
         max-width: 1200px;
     }
 }

 @media screen and (max-width: 1279px) {
     .h1-title {
         font-size: 65px;
         line-height: 75px;
     }

     .banner-img {
         padding-left: 0;
     }

     .banner-img img {
         width: 550px;
     }

     .about-shape1 {
         width: 180px;
     }

     .about-shape2 {
         width: 250px;
     }

     .about-shape3 {
         width: 200px;
         right: -100px;
     }

     .about-shape4 {
         width: 180px;
         right: -50px;
     }

     .about-img-box,
     .faq-img-box {
         width: 530px;
     }

     .h2-title {
         font-size: 60px;
         line-height: 70px;
     }

     .service-box {
         padding: 35px 20px;
     }

     .counter-box {
         padding: 0 25px;
     }

     .pricing-box {
         padding: 33px 70px 40px 70px;
     }

     .page-services-list .service-box {
         padding: 35px 18px;
     }

     .faq-accordion .card-header .h3-title {
         padding: 5px 55px 5px 20px;
     }

     .main-faq-img {
         padding-bottom: 30px;
         padding-left: 30px;
     }

     .post-comment-box {
         padding: 33px 30px 32px 20px;
     }

     .post-comment-box img {
         margin-right: -10px;
     }

     .page-blog-post .blog-img-box .blog-img {
         height: 370px;
     }
 }

 @media screen and (max-width: 1199px) {
     .site-branding a {
         width: 190px;
     }

     .header-search .sec-btn {
         margin-left: 15px;
     }

     .main-navigation ul li {
         margin: 0 14px;
     }

     .h1-title {
         font-size: 60px;
     }

     .about-shape1 {
         width: 150px;
     }

     .about-shape2 {
         width: 200px;
     }

     .about-shape3 {
         width: 170px;
         right: -130px;
     }

     .about-shape4 {
         width: 150px;
         right: -120px;
     }

     .main-about-img {
         padding-top: 30px;
         padding-right: 30px;
     }

     .main-about-img:before {
         width: 140px;
         height: 140px;
     }

     .h1-title .typer {
         display: block;
         height: 75px;
     }

     .h2-title {
         font-size: 54px;
         line-height: 64px;
     }

     .h3-title {
         font-size: 22px;
         line-height: 32px;
     }

     .service-box {
         padding: 35px 15px;
     }

     .counter-box {
         padding: 0 10px;
     }

     .pricing-box {
         padding: 33px 30px 40px 30px;
     }

     .team-img-box,
     .blog-img {
         height: 350px;
     }

     .blog-text {
         width: calc(100% - 40px);
         padding: 23px 20px 25px 20px;
     }

     .newsletter {
         padding: 113px 0 120px 0;
     }

     .newsletter .h2-title {
         font-size: 40px;
         line-height: 50px;
     }

     .who-we-are-img img {
         width: 575px;
     }

     .best-img-box img {
         width: 420px;
     }

     .best-img-box:before {
         height: calc(100% - 160px);
     }

     .best-list-text p {
         padding-right: 0;
     }

     .main-contact.page-contact {
         padding: 115px 0 100px 0;
     }

     .contact-page-link-box {
         width: 30%;
         margin-bottom: 0;
     }

     .contact-page-link-box.location {
         width: 40%;
     }

     .contact-page-link {
         margin-bottom: 60px;
     }

     .contact-map {
         height: 550px;
     }

     .faq-accordion {
         padding: 0;
     }

     .recent-post-img {
         width: 80px;
         height: 80px;
     }

     .recent-post-text {
         width: calc(100% - 80px);
         padding-left: 15px;
     }

     .advertising-box {
         height: 320px;
     }

     .detail-comment-img {
         width: 120px;
     }

     .detail-comment-text {
         width: calc(100% - 120px);
         padding: 0 15px 0 20px;
     }
 }

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

     .for-des,
     .header-search,
     .testimonial-animate {
         display: none !important;
     }

     .for-mob {
         display: inline-block !important;
     }

     .site-header,
     .site-header.sticky-header {
         background: #ffffff;
         height: 70px;
         padding: 0;
         box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
     }

     .site-header .container {
         max-width: 100%;
         padding: 0 30px;
     }

     .toggle-button {
         display: block;
     }

     .site-branding {
         position: fixed;
         top: 0;
         left: 30px;
         width: 200px;
         height: 70px;
         display: flex;
         align-items: center;
     }

     .site-branding a {
         width: 100%;
     }

     .main-navigation ul {
         position: fixed;
         top: 0;
         right: -400px;
         width: 320px;
         height: 100vh;
         max-height: 100vh;
         overflow: auto;
         background: #ffffff;
         text-align: center;
         padding: 100px 0 30px;
         box-shadow: -30px 0 30px rgba(0, 0, 0, 0.1);
         transition: 0.5s;
         opacity: 0;
         z-index: 100;
     }

     .main-navigation.toggle-menu ul {
         right: 0;
         opacity: 1;
         z-index: 100;
     }

     .main-navigation>ul::-webkit-scrollbar-thumb {
         width: 0;
         background: transparent;
     }

     .main-navigation>ul::-webkit-scrollbar {
         width: 0;
     }

     .main-navigation>ul::-webkit-scrollbar-track {
         width: 0;
         background: transparent;
     }

     .main-navigation ul li {
         display: block;
         margin: -50px 0 10px 0;
         padding: 0 30px;
         padding-bottom: 10px;
         opacity: 0;
         transition: 0.5s;
     }

     .main-navigation.toggle-menu ul li {
         margin-top: 0;
         opacity: 1;
         transition: 0.5s;
         transition-delay: 0.4s;
     }

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

     .main-navigation ul li:last-child a {
         display: inline-block;
         margin: 0 auto;
     }

     .main-navigation ul li a {
         font-size: 18px;
         line-height: 28px;
     }

     .main-navigation ul li ul.sub-menu,
     .main-navigation ul li:hover ul.sub-menu {
         position: relative;
         top: 0;
         left: 0;
         width: 100%;
         background: transparent;
         box-shadow: none;
         border-radius: 0;
         display: block;
         animation: none;
         padding: 0;
         margin-top: 10px;
         transition: 0s;
         display: none;
     }

     .main-navigation ul li ul.sub-menu li {
         text-align: center;
         border: none;
         padding: 0;
         margin-bottom: 10px;
     }

     .main-navigation ul li ul.sub-menu li:last-child {
         margin-bottom: 0;
     }

     .main-navigation ul li ul.sub-menu li a {
         padding: 0;
         font-size: 15px;
         line-height: 24px;
     }

     .main-navigation ul li.sub-items:hover>a:before,
     .main-navigation ul li a:hover:before {
         transform: translate(0, -50%) rotate(0deg);
     }

     .main-navigation ul li.sub-items.active-sub-menu>a:before {
         transform: translate(0, -50%) rotate(-180deg);
     }

     .main-banner {
         padding: 180px 0 80px 0;
     }

     .banner-content {
         text-align: center;
         padding: 0 30px;
     }

     .h1-title .typer {
         display: inline-block;
         height: auto;
     }

     .banner-img {
         padding-top: 60px;
         width: 500px;
         display: block;
         margin: auto;
     }

     .banner-img img {
         width: 100%;
     }

     .about-shape3 {
         right: -50px;
     }

     .about-shape4 {
         bottom: 130px;
         right: -50px;
     }

     .main-about-us {
         padding-top: 80px;
     }

     .main-about-img {
         padding-top: 0;
         padding-right: 0;
     }

     .main-about-img:before {
         display: none;
     }

     .about-img-box,
     .faq-img-box {
         width: 100%;
         height: 450px;
         float: none;
     }

     .about-content {
         padding-top: 40px;
     }

     .main-services,
     .main-whatch-us,
     .main-team,
     .main-testimonial,
     .main-our-blog {
         padding-top: 75px;
     }

     .services-content ul {
         margin-bottom: 40px;
     }

     .services-list {
         font-size: 0;
         line-height: 1;
         text-align: center;
     }

     .service-box {
         padding: 35px 30px;
     }

     .service-box.idea-research-service,
     .service-box.seo-service {
         margin-bottom: 30px;
     }

     .services-list .sec-btn {
         margin-top: 10px;
     }

     .whatch-video-box {
         height: 400px;
     }

     .main-counter {
         margin-top: -200px;
         padding-top: 269px;
     }

     .counter-box {
         margin-bottom: 30px;
     }

     .main-counter-list {
         margin-bottom: -30px;
     }

     .main-pricing {
         padding: 75px 0;
     }

     .pricing-list {
         padding-bottom: 20px;
     }

     .pricing-slider .slick-list {
         overflow: visible;
     }

     .pricing-slider .slick-slide {
         opacity: 0;
         transition: 0.3s;
     }

     .pricing-slider .slick-slide.slick-active {
         opacity: 1;
         transition: 0.3s;
     }

     .pricing-box {
         padding: 33px 40px 40px 40px;
     }

     .project-box,
     .portfolio-wrapper {
         height: 400px;
     }

     .project-box.even {
         height: 450px;
     }

     .team-box,
     .blog-box {
         width: 400px;
         max-width: 100%;
         margin: 0 auto 40px auto;
     }

     .view-all,
     .blog-list .view-all {
         margin-top: 0;
     }

     .blog-text {
         width: calc(100% - 60px);
         padding: 23px 30px 25px 30px;
     }

     .main-contact {
         padding: 75px 0 60px 0;
     }

     .contact-text {
         margin-bottom: 40px;
     }

     .newsletter {
         padding: 73px 0 80px 0;
     }

     .footer-logo {
         text-align: center;
         margin-bottom: 30px;
     }

     .footer-menu,
     .copy-right {
         text-align: center;
     }

     .footer-menu ul {
         display: -ms-flexbox;
         display: flex;
         -ms-flex-wrap: wrap;
         flex-wrap: wrap;
         margin-right: -15px;
         margin-left: -15px;
         justify-content: center;
     }

     .footer-menu ul li {
         display: inline-block;
         margin: 0 15px 15px 15px;
     }

     .footer-bottom {
         margin-top: 15px;
         padding: 30px 0;
     }

     .social-icon {
         text-align: center;
         margin-bottom: 20px;
     }

     .main-banner.inner-banner {
         padding: 159px 0 76px 0;
     }

     .main-who-we-are,
     .main-services.page-services-list,
     .main-best,
     .main-team.page-team {
         padding-top: 80px;
     }

     .who-we-are-img img {
         width: 500px;
         max-width: 100%;
         display: block;
         margin: auto;
     }

     .who-we-are-content,
     .best-content,
     .faq-content-box {
         padding-top: 40px;
     }

     .page-services-list .service-box {
         padding: 35px 30px;
     }

     .best-img-box {
         padding: 0 30px;
     }

     .main-team.page-team .team-box {
         margin-bottom: 0;
     }

     .main-team.page-team .main-team-list {
         margin-bottom: 0;
         padding-bottom: 50px;
     }

     .main-team.page-team .main-team-list .team-page-slider {
         margin-bottom: 0;
     }

     .main-pricing.page-pricing {
         padding: 80px 0 0 0;
     }

     .main-contact.page-contact {
         padding: 75px 0 60px 0;
     }

     .contact-page-link-box,
     .contact-page-link-box.location {
         width: 33.3333%;
         display: block;
         text-align: center;
     }

     .contact-page-link-icon {
         display: flex;
         margin: 0 auto 15px auto;
     }

     .contact-page-link-text {
         width: 100%;
         padding-left: 0;
     }

     .contact-page-link-text a {
         font-size: 0.9rem;
         line-height: 24px;
     }

     .main-contact.page-contact .contact-text {
         text-align: center;
     }

     .main-contact.page-contact .contact-text .h2-title {
         padding: 0 30px;
     }

     .main-contact.page-contact .contact-form .sec-btn {
         display: block;
         margin: 10px auto 0 auto;
     }

     .contact-map {
         height: 450px;
     }

     .main-portfolio-tabbing {
         padding: 75px 0 80px 0;
     }

     .portfoliolist {
         padding-top: 40px;
     }

     .main-faq-content {
         padding-top: 75px;
     }

     .faq-accordion .card-header .h3-title {
         padding: 5px 60px 5px 30px;
     }

     .main-faq-img {
         padding-bottom: 0;
         padding-left: 0;
     }

     .main-faq-img:before {
         display: none;
     }

     .faq-accordion {
         margin-top: 30px;
     }

     .main-faq-content.faq-content2 {
         padding-top: 80px;
     }

     .main-blog-content {
         padding: 80px 0;
     }

     .blog-sidebar {
         margin-top: 75px;
     }

     .recent-post-img {
         width: 100px;
         height: 100px;
     }

     .recent-post-text {
         width: calc(100% - 100px);
         padding-left: 20px;
     }

     .gallery {
         margin-bottom: -20px;
     }

     .related-blog,
     .leave-review {
         margin-top: 73px;
     }

     .details-post-comment {
         margin-top: 68px;
     }

     .detail-comment-img {
         width: 160px;
     }

     .detail-comment-text {
         width: calc(100% - 160px);
     }

     .detail-comment-box.even {
         width: 100%;
     }

     .main-portfolio-details {
         padding: 73px 0 80px 0;
     }

     .portfolio-detail-info {
         margin-top: 40px;
     }

     .portfolio-detail-img {
         height: 400px;
     }
 }

 @media screen and (max-width: 767px) {
     .site-branding {
         width: 180px;
     }

     .main-banner {
         padding: 150px 0 60px 0;
     }

     .banner-content {
         padding: 0;
     }

     .h1-title {
         font-size: 45px;
         line-height: 55px;
         margin-bottom: 15px;
     }

     .banner-content p {
         margin-bottom: 30px;
     }

     .banner-btn a.sec-btn {
         display: block;
         width: 200px;
         margin: 0 auto 30px auto;
     }

     .main-about-us {
         padding-top: 60px;
     }

     .about-img-box,
     .faq-img-box {
         height: 320px;
     }

     .sub-title {
         font-size: 18px;
         margin-bottom: 5px;
     }

     .h2-title {
         font-size: 45px;
         line-height: 55px;
         margin-bottom: 20px;
     }

     .main-services,
     .main-whatch-us,
     .main-team,
     .main-testimonial,
     .main-our-blog {
         padding-top: 55px;
     }

     .whatch-video-box {
         height: 320px;
     }

     .video-play-icon {
         width: 60px;
         height: 60px;
     }

     .video-play-icon:after {
         width: 120px;
         height: 120px;
     }

     .main-counter {
         margin-top: -160px;
         padding-top: 210px;
     }

     .h4-title,
     .newsletter .h2-title {
         font-size: 35px;
         line-height: 45px;
     }

     .main-pricing {
         padding: 55px 0;
     }

     .pricing-title,
     .whatch-title,
     .project-title,
     .team-title,
     .testimonial-title,
     .our-blog-title {
         margin-bottom: 30px;
     }

     .pricing-box {
         padding: 33px 70px 40px 70px;
     }

     .project-box,
     .project-box.even,
     .portfolio-wrapper {
         height: 320px;
     }

     .main-testimonial-slider {
         padding: 60px 30px 34px 30px;
     }

     .team-img-box,
     .blog-img {
         height: 320px;
     }

     .main-contact {
         padding: 55px 0 40px 0;
     }

     .contact-link a {
         font-size: 40px;
         line-height: 30px;
     }

     .contact-link p {
         margin-bottom: 10px;
     }

     .main-partners {
         padding: 40px 0;
     }

     .newsletter {
         padding: 53px 0 60px 0;
     }

     .newsletter-form input {
         width: 100%;
         text-align: center;
         margin-right: 0;
         margin-bottom: 30px;
     }

     .main-banner.inner-banner {
         padding: 139px 0 56px 0;
     }

     .breadcrumb-box ul li,
     .breadcrumb-box ul li a {
         font-size: 0.9rem;
         line-height: 26px;
     }

     .main-who-we-are,
     .main-services.page-services-list,
     .main-best,
     .main-team.page-team {
         padding-top: 60px;
     }

     .who-we-are-img img {
         width: 400px;
     }

     .best-img-box img {
         width: 320px;
     }

     .best-img-box:before {
         height: 72%;
     }

     .main-pricing.page-pricing {
         padding: 60px 0 0 0;
     }

     .contact-map {
         height: 320px;
     }

     .main-contact.page-contact {
         padding: 55px 0 40px 0;
     }

     .contact-page-link-box,
     .contact-page-link-box.location {
         width: 100%;
         margin-bottom: 30px;
     }

     .contact-page-link-box.location {
         margin-bottom: 0;
     }

     .portfolio {
         -ms-flex: 0 0 100%;
         flex: 0 0 100%;
         max-width: 100%;
     }

     .main-portfolio-tabbing {
         padding: 55px 0 60px 0px;
     }

     .main-faq-content {
         padding-top: 55px;
     }

     .main-faq-content.faq-content2 {
         padding-top: 60px;
     }

     .main-blog-content {
         padding: 60px 0;
     }

     .categories {
         margin-bottom: 50px;
     }

     .blog-pagination {
         margin-top: 50px;
     }

     .blog-sidebar {
         margin-top: 55px;
     }

     .blog-search-from,
     .recent-post,
     .advertising {
         margin-bottom: 43px;
     }

     .tag {
         margin-bottom: 30px;
     }

     .blog-search-from input {
         padding: 10px 60px 10px 20px;
     }

     .post-comment-box .h3-title {
         font-size: 20px;
         line-height: 30px;
     }

     .post-img {
         height: 320px;
     }

     .blog-post-footer {
         display: block;
     }

     .blog-post-footer .tag {
         margin-bottom: 5px;
     }

     .related-blog,
     .leave-review {
         margin-top: 53px;
     }

     .related-blog .blog-box {
         margin-bottom: 40px;
     }

     .details-post-comment {
         margin-top: 8px;
     }

     .detail-comment-box,
     .detail-comment-box.even {
         display: block;
         height: auto;
         text-align: center;
         padding: 30px;
     }

     .detail-comment-img {
         width: 100px;
         height: 100px;
     }

     .detail-comment-text {
         width: 100%;
         padding: 0;
         margin-top: 7px;
     }

     .blog-post-img {
         display: block;
         margin: 23px 0;
     }

     .post-img-box:last-child {
         margin-bottom: 0;
     }

     .post-img-box {
         width: 100%;
         padding: 0;
         margin-bottom: 30px;
     }

     .blog-post-slider .slick-arrow {
         width: 45px;
         height: 45px;
         font-size: 30px;
     }

     .main-portfolio-details {
         padding: 53px 0 60px 0;
     }

     .portfolio-detail-img {
         height: 320px;
     }
 }

 @media screen and (max-width: 575px) {
     .loader-design {
         transform: translate(-50%, -50%) scale(0.6);
     }

     .container {
         padding: 0 30px;
     }

     .h1-title {
         font-size: 50px;
         line-height: 60px;
     }

     .h1-title .typer {
         display: block;
         height: 60px;
     }

     .h2-title {
         font-size: 40px;
         line-height: 50px;
     }

     .banner-img {
         padding-top: 40px;
         width: 316px;
     }

     .about-shape1 {
         width: 100px;
         top: 130px;
     }

     .about-shape2 {
         width: 150px;
         bottom: 30px;
         left: -20px;
     }

     .about-shape3 {
         right: -30px;
         width: 120px;
     }

     .about-shape4 {
         bottom: 70px;
         right: -20px;
         width: 100px;
     }

     .who-we-are-list-box {
         display: block;
         text-align: center;
     }

     .who-we-are-list-icon {
         margin-bottom: 15px;
     }

     .who-we-are-list-text {
         width: 100%;
         padding-left: 0;
     }

     .best-list-box {
         width: 100%;
         margin-bottom: 30px;
     }

     .best-list-box:last-child {
         margin-bottom: 0;
     }

     .main-contact.page-contact .contact-text .h2-title {
         padding: 0 15px;
     }

     .portfolio-tabbing ul {
         display: block;
         text-align: center;
         white-space: nowrap;
         overflow-x: auto;
         position: relative;
         left: -30px;
         width: calc(100% + 60px);
         padding: 0 30px;
     }

     .portfolio-tabbing ul li {
         display: inline-block;
         margin-right: 30px;
     }

     .faq-accordion .card-header .h3-title {
         padding: 5px 60px 5px 20px;
         font-size: 0.9rem;
         line-height: 22px;
     }

     .pagination-arrow {
         font-size: 28px;
         margin: 0 10px;
     }

     .blog-pagination ul li {
         width: 35px;
         height: 35px;
         font-size: 0.9rem;
         margin: 0 5px;
     }

     .tag ul li a {
         padding: 5px 20px;
     }

     .blog-date .by-admin {
         margin-left: 0;
         display: block;
         margin-top: 15px;
         width: max-content;
     }
 }

 @media screen and (max-width: 400px) {
     .h1-title {
         font-size: 44px;
         line-height: 54px;
     }

     .h1-title .typer {
         height: 54px;
     }

     .h2-title {
         font-size: 35px;
         line-height: 45px;
     }

     .h4-title,
     .newsletter .h2-title,
     .contact-link a {
         font-size: 30px;
         line-height: 40px;
     }

     .pricing-box {
         padding: 33px 30px 40px 30px;
     }

     .main-testimonial-slider {
         padding: 60px 20px 34px 20px;
     }

     .blog-text {
         width: calc(100% - 50px);
         padding: 23px 20px 25px 20px;
     }

     .main-contact.page-contact .contact-text .h2-title {
         padding: 0;
     }
 }

 @media screen and (max-width: 375px) {
     .container {
         padding: 0 15px;
     }

     .site-branding {
         width: 150px;
         left: 15px;
     }

     .main-navigation ul {
         right: -300px;
         width: 280px;
     }

     .h1-title {
         font-size: 40px;
         line-height: 50px;
     }

     .h2-title {
         font-size: 32px;
         line-height: 42px;
     }

     .banner-content p {
         font-size: 0.9rem;
         line-height: 26px;
     }

     .banner-img {
         width: 290px;
     }

     .about-img-box,
     .whatch-video-box,
     .project-box,
     .project-box.even,
     .team-img-box,
     .blog-img,
     .portfolio-wrapper,
     .faq-img-box {
         height: 280px;
     }

     .sub-title {
         font-size: 0.9rem;
     }

     .main-testimonial-slider {
         padding: 60px 15px 34px 15px;
     }

     .blog-text {
         width: calc(100% - 40px);
     }

     .form-input {
         padding: 12px 20px;
     }

     textarea.form-input {
         padding: 18px 20px;
     }

     .scroll-top {
         width: 35px;
         height: 35px;
         font-size: 1.4rem;
     }

     .h4-title,
     .newsletter .h2-title,
     .contact-link a {
         font-size: 28px;
         line-height: 38px;
     }

     .newsletter-form input {
         padding: 0 20px;
     }

     .faq-accordion .card-header .h3-title {
         padding: 5px 45px 5px 15px;
     }

     .faq-accordion .card-header .h3-title .icon {
         width: 35px;
     }

     .recent-post-text {
         padding-left: 15px;
     }

     .categories ul li a {
         padding: 5px 45px 5px 15px;
     }

     .advertising-box {
         height: 280px;
     }

     .advertising-text {
         width: calc(100% - 60px);
         height: 140px;
     }

     .tag ul li a {
         padding: 5px 15px;
     }

     .gallery-img-box {
         width: 50%;
     }

     .recent-post-text h6 {
         font-size: 0.9rem;
     }

     .post-comment-box {
         padding: 21px 15px 20px 20px;
     }

     .post-comment-box .h3-title {
         font-size: 18px;
         line-height: 28px;
     }

     .post-comment-box img {
         width: 30px;
         height: 27px;
         margin-right: 0;
     }

     .post-img {
         height: 280px;
     }

     .detail-comment-box,
     .detail-comment-box.even {
         padding: 30px 15px;
     }

     .portfolio-detail-img {
         height: 280px;
     }
 }

 .lg-actions .lg-next,
 .lg-actions .lg-prev,
 .lg-sub-html,
 .lg-toolbar {
     background-color: rgba(30, 30, 30, .6);
 }

 .lg-outer .lg-toogle-thumb,
 .lg-outer .lg-thumb-outer,
 .lg-outer .lg-img-wrap,
 .lg-outer .lg-item {
     background-color: transparent;
 }

 .lg-thumb-outer.lg-grab,
 .lg-toogle-thumb.lg-icon {
     background-color: rgba(30, 30, 30, .6);
 }

 .lg-backdrop {
     background-color: rgba(30, 30, 30, 0.9);
 }

 .lg-outer .lg-toogle-thumb,
 .lg-actions .lg-next,
 .lg-actions .lg-prev,
 .lg-toolbar .lg-icon,
 #lg-counter {
     color: #fff;
 }

 .lg-outer .lg-thumb-item.active,
 .lg-outer .lg-thumb-item:hover {
     border-color: #a756f9;
 }

 .lightimg {
     cursor: pointer;
 }

 .dzSubscribeMsg {
     margin-bottom: 10px;
     width: 100% !important;
 }

 .dzSubscribeMsg p {
     width: 100% !important;
 }

 .theme-btn {
     background-color: #ffffff;
     border-radius: 40px;
     bottom: 10px;
     color: #ffffff;
     display: table;
     height: 50px;
     left: 10px;
     min-width: 50px;
     position: fixed;
     text-align: center;
     z-index: 9999;
 }

 .theme-btn i {
     font-size: 22px;
     line-height: 50px;
 }

 .theme-btn.bt-support-now {
     background: #1ebbf0;
     background: -moz-linear-gradient(to right, #7859fc, #a756f9);
     background: -webkit-linear-gradient(to right, #7859fc, #a756f9);
     background: linear-gradient(to right, #7859fc, #a756f9);
     background-size: 400% 100%;
     bottom: 70px;
 }

 .theme-btn.bt-buy-now {
     background: #1fdf61;
     background: -moz-linear-gradient(top, #A3D179 0%, #6e9c31 100%);
     background: -webkit-linear-gradient(top, #A3D179 0%, #6e9c31 100%);
     background: linear-gradient(to bottom, #A3D179 0%, #6e9c31 100%);
     filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1fdf61', endColorstr='#88BA46', GradientType=0);
     ;
 }

 .theme-btn:hover {
     color: #fff;
     padding: 0 20px;
 }

 .theme-btn span {
     display: table-cell;
     vertical-align: middle;
     font-size: 0.9rem;
     letter-spacing: -15px;
     opacity: 0;
     line-height: 50px;
     transition: all 0.5s;
     -webkit-transition: all 0.5s;
     -moz-transition: all 0.5s;
     text-transform: uppercase;
 }

 .theme-btn:hover span {
     opacity: 1;
     letter-spacing: 1px;
     padding-left: 10px;
 }

 .at-expanding-share-button[data-position="bottom-left"] {
     bottom: 130px !important;
 }

 .contact-bg {
     background-color: #ffffff;
     background-image: linear-gradient(#f9f9f9, #ffffff);
 }

 .contact-page-content {
     position: relative;
     padding: 93px 0 60px 0;
 }

 .contact-page-content:before {
     content: '';
     position: absolute;
     top: 118px;
     left: -10px;
     transform: rotateX(180deg);
     width: 603px;
     height: 628px;
     background-image: url(../images/about-shape.png);
     background-size: 100% 100%;
     background-position: top right;
     background-repeat: no-repeat;
     pointer-events: none;
     z-index: 0;
 }

 .contact-page-img img {
     float: right;
     position: relative;
     right: -20px;
     width: 645px;
     max-width: unset;
     height: auto;
 }

 .contact-page-form .contact-form .sec-btn {
     width: auto;
 }

 .contact-page-link {
     padding-top: 46px;
 }

 .contact-link-box {
     position: relative;
     width: 100%;
     padding: 35px 25px;
     text-align: center;
     background: #ffffff;
     border-radius: 4px;
     box-shadow: 1px 1px 60px rgba(0, 0, 0, 0.08);
     overflow: hidden;
 }

 .contact-link-box:before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     bottom: auto;
     width: 100%;
     height: 0;
     background: linear-gradient(to right, #ff5066, #fc9d44);
     border-radius: 4px;
     transition: 0.5s;
     z-index: 0;
 }

 .contact-link-box:hover:before {
     height: 100%;
     top: auto;
     bottom: 0;
 }

 .contact-link-text {
     position: relative;
     z-index: 1;
 }

 .contact-link-icon {
     display: inline-flex;
     justify-content: center;
     align-items: center;
     width: 80px;
     height: 80px;
     background: #ffffff;
     border: 2px solid #ffc3cb;
     border-radius: 4px;
     margin-bottom: 25px;
     transition: 0.3s;
 }

 .contact-link-box:hover .contact-link-icon {
     border-color: #ffffff;
     animation: zoomin2 0.8s linear infinite alternate;
 }

 @keyframes zoomin2 {
     from {
         transform: scale(1);
     }

     to {
         transform: scale(0.9);
     }
 }

 .contact-link-icon img {
     width: auto;
 }

 .contact-link-text .h3-title {
     transition: 0.3s;
 }

 .contact-link-text p {
     margin-bottom: 0;
     transition: 0.3s;
 }

 .contact-link-text p a {
     display: inline-block;
     color: #777777;
     transition: 0.3s;
 }

 .contact-link-text p a span {
     display: block;
 }

 .contact-link-box:hover .contact-link-text .h3-title,
 .contact-link-box:hover .contact-link-text p,
 .contact-link-box:hover .contact-link-text p a {
     color: #ffffff;
 }

 .contact-link-box:hover .contact-link-text p a:hover {
     color: #010f2e;
 }

 .contact-map {
     width: 100%;
     height: 600px;
     position: relative;
     margin-bottom: -80px;
     z-index: 0;
 }

 .contact-map iframe {
     width: 100%;
     height: 100%;
 }

 .main-partners.page-contact-partners {
     position: relative;
     padding: 135px 0 80px 0;
     z-index: 1;
 }

 .selectdiv {
     min-width: 220px;
 }

 .selectdiv:after {
     content: '\f078';
     font: normal normal normal 17px/1 FontAwesome;
     color: #f47114;
     right: 11px;
     top: 6px;
     height: 59px;
     padding: 20px 0px 0px 8px;
     border-left: 1px solid #f47114;
     position: absolute;
     pointer-events: none;
 }

 select::-ms-expand {
     display: none;
 }

 .selectdiv select {
     -webkit-appearance: none;
     -moz-appearance: none;
     appearance: none;
     display: block;
     width: 100%;
     font-size: 1.3rem;
     font-weight: bold;
     background: #f9f9f9;
     margin: 5px 0px;
     padding: 0px 24px;
     line-height: 1.75;
     color: #333;
     background-image: none;
     border: 1px solid #f47114;
     -ms-word-break: normal;
     word-break: normal;
 }

 .development-container {
     display: none !important;
 }

 .DZ-theme-btn {
     background-color: #fff;
     border-radius: 40px;
     bottom: 10px;
     color: #fff;
     display: table;
     height: 50px;
     left: 10px;
     min-width: 50px;
     position: fixed;
     text-align: center;
     z-index: 99999;
 }

 .DZ-theme-btn.DZ-bt-support-now {
     background: #1ebbf0;
     background: -moz-linear-gradient(45deg, #1ebbf0 8%, #39dfaa 100%);
     background: -webkit-linear-gradient(45deg, #1ebbf0 8%, #39dfaa 100%);
     background: linear-gradient(45deg, #1ebbf0 8%, #39dfaa 100%);
     bottom: 70px;
 }

 .DZ-theme-btn.DZ-bt-buy-now {
     background: #1fdf61;
     background: -moz-linear-gradient(top, #a3d179 0, #88ba46 100%);
     background: -webkit-linear-gradient(top, #a3d179 0, #88ba46 100%);
     background: linear-gradient(to bottom, #a3d179 0, #88ba46 100%);
 }

 .DZ-theme-btn.DZ-bt-buy-now {
     background: #1fdf61;
     background: -moz-linear-gradient(top, #a3d179 0, #88ba46 100%);
     background: -webkit-linear-gradient(top, #a3d179 0, #88ba46 100%);
     background: linear-gradient(to bottom, #a3d179 0, #88ba46 100%);
 }

 .DZ-theme-btn:hover {
     color: #fff;
     padding: 0 20px;
 }

 .DZ-theme-btn span {
     display: table-cell;
     vertical-align: middle;
     font-size: 0.9rem;
     letter-spacing: -15px;
     opacity: 0;
     line-height: 50px;
     -webkit-transition: all 1s;
     -ms-transition: all 1s;
     transition: all 1s;
     text-transform: uppercase;
 }

 .DZ-theme-btn:hover span {
     opacity: 1;
     letter-spacing: 1px;
     padding-left: 10px;
 }

 .DZ-theme-btn i {
     fill: #fff;
     width: 26px;
     height: 26px;
     font-size: 1.8rem;
     line-height: 28px;
     padding-top: 12px;
 }

 .disclosure-txt {
     font-size: 15px;
 }

 .banner-content h2:before {
     content: '';
     position: absolute;
     bottom: 10px;
     left: 47%;
     width: 74px;
     height: 4px;
     background: linear-gradient(to right, #f56915, #f0a80e);
 }

 .sub-point {
     margin: -8px 0 15px 31px;
 }

 .fw-bold {
     font-weight: bold;
 }

 .h2-title-inner {
     font-size: 2.2rem;
     line-height: 76px;
     font-weight: bold;
     color: #010f2e;
     font-family: "Montserrat", sans-serif;
     margin-bottom: 0;
     position: relative;
 }

 .padding-top10 {
     padding-top: 10%;
 }

 .center-title {
     text-align: center;
     margin-bottom: 37px;
 }

 .form-control {
     outline: none;
     font-size: 0.8rem;
 }

 #tab-menus .tab-pane {
     background-color: #f9f9f9;
 }

 #tab-menus .nav-tabs .nav-link {
     font-weight: bold;
     color: #000000;
 }

 #tab-menus .nav-tabs .nav-item.show .nav-link,
 #tab-menus .nav-tabs .nav-link.active {
     color: #ff8312;
     background-color: #f9f9f9;
     border-color: #dee2e6 #dee2e6 #fff;
 }

 button.btn-circle {
     position: absolute;
     top: 8px;
     right: 4px;
     z-index: 1;
     width: 2.5rem;
     height: 2.5rem;
     padding: 0;
     background-color: #f4f5fa;
     text-shadow: none;
     border-radius: 50%;
     -webkit-box-shadow: var(--samaH-box-shadow-sm);
     box-shadow: var(--samaH-box-shadow-sm);
     opacity: 0.5;
 }

 .thank-you-pop {
     width: 100%;
     padding: 20px;
     text-align: center;
 }

 .thank-you-pop img {
     width: 76px;
     height: auto;
     margin: 0 auto;
     display: block;
     margin-bottom: 25px;
 }

 .thank-you-pop h1 {
     font-size: 42px;
     margin-bottom: 25px;
     color: #5C5C5C;
 }

 .thank-you-pop p {
     font-size: 20px;
     margin-bottom: 27px;
     color: #5C5C5C;
 }

 .thank-you-pop h3.cupon-pop {
     font-size: 18px;
     margin-bottom: 40px;
     color: #222;
     display: inline-block;
     text-align: center;
     padding: 10px 20px;
     border: 2px dashed #222;
     clear: both;
     font-weight: normal;
 }

 .thank-you-pop h3.cupon-pop span {
     color: #03A9F4;
 }

 .thank-you-pop a {
     display: inline-block;
     margin: 0 auto;
     padding: 9px 20px;
     color: #fff;
     text-transform: uppercase;
     font-size: 14px;
     background-color: #8BC34A;
     border-radius: 17px;
 }

 .thank-you-pop a i {
     margin-right: 5px;
     color: #fff;
 }

 #ignismyModal .modal-header {
     border: 0px;
 }

 .svg-box {
     display: inline-block;
     position: relative;
     width: 150px;
 }

 .green-stroke {
     stroke: #7CB342;
 }

 .red-stroke {
     stroke: #FF6245;
 }

 .yellow-stroke {
     stroke: #FFC107;
 }

 .circular circle.path {
     stroke-dasharray: 330;
     stroke-dashoffset: 0;
     stroke-linecap: round;
     opacity: 0.4;
     animation: 0.7s draw-circle ease-out;
 }

 .checkmark {
     stroke-width: 6.25;
     stroke-linecap: round;
     position: absolute;
     top: 56px;
     left: 49px;
     width: 52px;
     height: 40px;
 }

 .checkmark path {
     animation: 1s draw-check ease-out;
 }

 @keyframes draw-circle {
     0% {
         stroke-dasharray: 0, 330;
         stroke-dashoffset: 0;
         opacity: 1;
     }

     80% {
         stroke-dasharray: 330, 330;
         stroke-dashoffset: 0;
         opacity: 1;
     }

     100% {
         opacity: 0.4;
     }
 }

 @keyframes draw-check {
     0% {
         stroke-dasharray: 49, 80;
         stroke-dashoffset: 48;
         opacity: 0;
     }

     50% {
         stroke-dasharray: 49, 80;
         stroke-dashoffset: 48;
         opacity: 1;
     }

     100% {
         stroke-dasharray: 130, 80;
         stroke-dashoffset: 48;
     }
 }

 .cross {
     stroke-width: 6.25;
     stroke-linecap: round;
     position: absolute;
     top: 54px;
     left: 54px;
     width: 40px;
     height: 40px;
 }

 .cross .first-line {
     animation: 0.7s draw-first-line ease-out;
 }

 .cross .second-line {
     animation: 0.7s draw-second-line ease-out;
 }

 @keyframes draw-first-line {
     0% {
         stroke-dasharray: 0, 56;
         stroke-dashoffset: 0;
     }

     50% {
         stroke-dasharray: 0, 56;
         stroke-dashoffset: 0;
     }

     100% {
         stroke-dasharray: 56, 330;
         stroke-dashoffset: 0;
     }
 }

 @keyframes draw-second-line {
     0% {
         stroke-dasharray: 0, 55;
         stroke-dashoffset: 1;
     }

     50% {
         stroke-dasharray: 0, 55;
         stroke-dashoffset: 1;
     }

     100% {
         stroke-dasharray: 55, 0;
         stroke-dashoffset: 70;
     }
 }

 .alert-sign {
     stroke-width: 6.25;
     stroke-linecap: round;
     position: absolute;
     top: 40px;
     left: 68px;
     width: 15px;
     height: 70px;
     animation: 0.5s alert-sign-bounce cubic-bezier(0.175, 0.885, 0.32, 1.275);
 }

 .alert-sign .dot {
     stroke: none;
     fill: #FFC107;
 }

 @keyframes alert-sign-bounce {
     0% {
         transform: scale(0);
         opacity: 0;
     }

     50% {
         transform: scale(0);
         opacity: 1;
     }

     100% {
         transform: scale(1);
     }
 }

 .merchant-dashboard-div img {
     box-shadow: 1px 1px 60px rgb(0 0 0 / 8%);
 }

 .main-our-services.page-our-services {
     padding: 120px 0 0px 0;
 }

 .main-pricing.page-services-pricing {
     padding-top: 113px;
 }

 .main-pricing.page-services-pricing:before {
     content: '';
     position: absolute;
     top: 120px;
     left: -30px;
     width: 857px;
     height: 1333px;
     background-image: url(../images/about-shape.png);
     background-size: 100%;
     background-position: top right;
     background-repeat: no-repeat;
     transform: rotate(180deg) rotateY(180deg);
     pointer-events: none;
     z-index: 0;
 }

 .main-portfolio.page-services-portfolio:before {
     display: none;
 }

 .main-testimonial.page-services-testimonial {
     padding: 90px 0 5px 0;
 }

 .main-testimonial.page-services-testimonial:before {
     top: 90px;
     right: -40px;
     width: 603px;
     height: 653px;
     background-size: 100% 100%;
 }

 .main-our-services {
     position: relative;
     padding-top: 111px;
     z-index: 1;
 }

 .our-services-title {
     position: relative;
     text-align: center;
 }

 .our-services-title .sub-title {
     margin-bottom: 12px;
 }

 .our-services-title .h2-title {
     margin-bottom: 36px;
 }

 .our-service-box {
     position: relative;
     width: 100%;
     padding: 35px 25px;
     text-align: center;
     background: #ffffff;
     border-radius: 4px;
     box-shadow: 1px 1px 60px rgba(0, 0, 0, 0.08);
     overflow: hidden;
     margin-bottom: 30px;
 }

 .our-service-box:before {
     content: '';
     position: absolute;
     top: 0;
     left: 0;
     bottom: auto;
     width: 100%;
     height: 0;
     background: linear-gradient(to right, #f56915, #f0a80e);
     border-radius: 4px;
     transition: 0.5s;
     z-index: 0;
 }

 .our-service-box:hover:before {
     height: 100%;
     top: auto;
     bottom: 0;
 }

 .our-service-text {
     position: relative;
     z-index: 1;
 }

 .our-service-icon {
     display: inline-flex;
     justify-content: center;
     align-items: center;
     width: 80px;
     height: 80px;
     background: #ffffff;
     border: 2px solid #ffc3cb;
     border-radius: 4px;
     margin-bottom: 25px;
     transition: 0.3s;
 }

 .our-service-box:hover .our-service-icon {
     border-color: #ffffff;
     animation: zoomin 0.8s linear infinite alternate;
 }

 @keyframes zoomin {
     from {
         transform: scale(1);
     }

     to {
         transform: scale(0.9);
     }
 }

 .our-service-icon img {
     width: auto;
 }

 .our-service-text .h3-title {
     transition: 0.3s;
 }

 .our-service-text p {
     margin-bottom: 0;
     transition: 0.3s;
 }

 .our-service-box:hover .our-service-text .h3-title,
 .our-service-box:hover .our-service-text p {
     color: #ffffff;
 }

 .check-list li {
     background-image: url(../images/check-purple.svg);
     background-position: 0 6px;
     background-repeat: no-repeat;
     background-size: 12px;
     margin-bottom: 8px;
     padding-left: 20px;
 }

 .contact-us-content {
     width: 100%;
     background: #ffffff;
     position: relative;
     padding: 25px 25px;
     border-radius: 4px;
     box-shadow: 1px 1px 40px rgb(0 0 0 / 8%);
 }

 .myDiv {
     display: none;
 }

 select.form-control {
     -webkit-appearance: menulist !important;
     -moz-appearance: menulist !important;
     -ms-appearance: menulist !important;
     -o-appearance: menulist !important;
     appearance: menulist !important;
 }

 .VerifyEmail {
     display: none;
 }

 .PaymentStatus {
     display: none;
 }

 .TransactionDetails {
     display: none;
 }

 .RaiseConcern {
     display: none;
 }

 .box {
     display: none;
 }

 .logo-width {
     height: 40px;
 }

 .badge-soft-success {
     color: #00864e;
     background-color: #ccf6e4;
 }

 .badge-soft-success-green {
     color: white;
     background-color: #00864e;
 }

 .badge-soft-danger-fail {
     color: white;
     background-color: #e02749;
 }

 .badge-soft-danger {
     color: #932338;
     background-color: #fad7dd;
 }

 .badge-soft-warning {
     color: #c19100;
     background-color: #fbeab6;
 }

 .badge-soft-warning-progress {
     color: white;
     background-color: #c19100;
 }

 .badge-soft-warning:hover {
     color: #ffffff;
     background-color: #c19100;
     border-color: #d39e00;
 }

 .table {
     font-size: 90%;
 }

 button[aria-expanded=true] .fa-chevron-right {
     display: none;
 }

 button[aria-expanded=false] .fa-chevron-down {
     display: none;
 }

 .text-3 {
     font-size: 1rem !important;
 }

 .text-4 {
     font-size: 1.125rem !important;
 }

 .text-8 {
     font-size: 2rem !important;
 }

 .text-17 {
     font-size: 4.5rem !important;
 }

 .fw-500 {
     font-weight: 500 !important;
 }

 .fw-normal {
     font-weight: 400 !important;
 }

 .px-3 {
     padding-right: 1rem !important;
     padding-left: 1rem !important;
 }

 .modal-close-btn {
     position: absolute;
     top: 15px;
     right: 13px;
     z-index: 1;
 }

 button.btn-circle {
     width: 2.5rem;
     height: 2.5rem;
     padding: 0;
     background-color: #f4f5fa;
     text-shadow: none;
     border-radius: 50%;
     -webkit-box-shadow: var(--samaH-box-shadow-sm);
     box-shadow: var(--samaH-box-shadow-sm);
     opacity: 0.5;
     top: -8px;
     right: 0;
 }

 button.btn-circle:hover,
 button.btn-circle:focus {
     opacity: 1 !important;
     background-color: #d8e2ef;
 }

 .transactionlisttbl {
     max-height: 374px;
     overflow: auto;
 }

 .tracking-detail {
     padding: 3rem 0;
 }

 #tracking {
     margin-bottom: 1rem;
     max-height: 395px;
     overflow: auto;
 }

 [class*=tracking-status-] p {
     margin: 0;
     font-size: 1.1rem;
     color: #fff;
     text-transform: uppercase;
     text-align: center;
 }

 [class*=tracking-status-] {
     padding: 1.6rem 0;
 }

 .tracking-status-intransit {
     background-color: #65aee0;
 }

 .tracking-status-outfordelivery {
     background-color: #f5a551;
 }

 .tracking-status-deliveryoffice {
     background-color: #f7dc6f;
 }

 .tracking-status-delivered {
     background-color: #4cbb87;
 }

 .tracking-status-attemptfail {
     background-color: #b789c7;
 }

 .tracking-status-error,
 .tracking-status-exception {
     background-color: #d26759;
 }

 .tracking-status-expired {
     background-color: #616e7d;
 }

 .tracking-status-pending {
     background-color: #ccc;
 }

 .tracking-status-inforeceived {
     background-color: #214977;
 }

 .tracking-item {
     border-left: 3px solid #787878;
     position: relative;
     padding: .0rem .5rem .5rem .5rem;
     font-size: .9rem;
     margin-left: .5rem;
     min-height: 5rem;
 }

 .tracking-item:last-child {
     padding-bottom: 1rem;
 }

 .tracking-item .tracking-date {
     margin-bottom: .5rem;
 }

 .tracking-item .tracking-date small {
     color: #888;
     font-size: 85%;
     padding-left: .4rem;
     font-weight: normal;
 }

 .tracking-item .tracking-content {
     padding: .5rem .8rem;
     background-color: #f4f4f4;
     border-radius: .5rem;
 }

 .tracking-item .tracking-content span {
     display: block;
     color: #888;
     font-size: 85%;
     line-height: normal;
 }

 .tracking-item .tracking-icon {
     line-height: 1rem;
     position: absolute;
     left: -.6rem;
     width: 1rem;
     height: 1rem;
     text-align: center;
     border-radius: 50%;
     font-size: 1.1rem;
     background-color: #fff;
     color: #fff;
 }

 .tracking-item .tracking-icon.status-sponsored {
     background-color: #f68;
 }

 .tracking-item .tracking-icon.status-delivered {
     background-color: #4cbb87;
 }

 .tracking-item .tracking-icon.status-outfordelivery {
     background-color: #f5a551;
 }

 .tracking-item .tracking-icon.status-deliveryoffice {
     background-color: #f7dc6f;
 }

 .tracking-item .tracking-icon.status-attemptfail {
     background-color: #b789c7;
 }

 .tracking-item .tracking-icon.status-exception {
     background-color: #d26759;
 }

 .tracking-item .tracking-icon.status-inforeceived {
     background-color: #214977;
 }

 .tracking-item .tracking-icon.status-intransit {
     color: #fc9d44;
     border: 1px solid #e5e5e5;
     font-size: .6rem;
 }

 .bottomleft {
     position: absolute;
     bottom: 0;
     left: 90%;
     font-size: 18px;
 }

 .word-break {
     word-break: break-word;
 }

 .text-decoration {
     text-decoration: underline;
     font-size: 12px;
 }

 button[disabled]:hover {
     box-shadow: none;
     cursor: not-allowed;
 }

 .custom-file {
     width: 92%;
 }

 .certificats {}

 .certificats a img {
     width: 80px;
     margin-left: 15px;
 }