@charset "UTF-8";
@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&family=Saira+Extra+Condensed:wght@400;500;600;700;800&display=swap);

:root{
 --primary: #ff3e41;
 --secondary: #222;
 --dark-secondary: #000;
 --dark-navy-blue: #060315;
 --charcoal-black: #222;
 --light-grey: #f7f7f7;
 --mid-light-grey: #e6e6e6;
 --light-dove-grey: #d9e3e5;
 --mid-dark-grey: #505050;
 --white: #fff;
 --black: #000;
 --blue: #00f;
 --dark-blue: #6ba4da;
}



a, a:focus, a:hover {
 text-decoration: none
}
body, p {
 color: rgba(24, 21, 44, .9)
}
.popup-video, .scrollUp {
 border-radius: 50%;
 color: var( --white)
}
.chose-box, .clear {
 clear: both
}
.blog-single .more-btn:hover, .theme_btn.style-3:hover {
 text-decoration: underline
}
.footer__widget ul, .fot-list, .fot-list li, .list-style-none li, .list-style-none li a {
 list-style-type: none
}
@font-face {
 font-family: gloss_and_bloomregular;
 src: url("../common/fonts/gloss_and_bloom.woff2") format("woff2"), url("../common/fonts/gloss_and_bloom.woff") format("woff");
 font-weight: 400;
 font-style: normal
}
body {
 font-family: Poppins, sans-serif;
 font-size: 16px;
 line-height: 28px;
 font-weight: 400;
 font-style: normal
}
.h2, .h3, .h4, .h5, .h6, h2, h3, h4, h5, h6 {
 font-weight: 700
}
.nav-search:hover, a, button, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
 color: inherit
}
.f-left {
 float: left
}
.f-right {
 float: right
}
.button, .comic-blogs-wrapper .comic-blogs-thumb img, .right-btn .theme_btn_border img, .team-wrapper .team-thumb img, a {
 -webkit-transition: .3s;
 -moz-transition: .3s;
 -ms-transition: .3s;
 -o-transition: .3s;
 transition: .3s
}
.button:focus, a:focus {
 text-decoration: none;
 outline: 0
}
a:focus, a:hover {
 color: #00f
}
a, button, button:focus, input:focus, textarea, textarea:focus {
 outline: 0
}
.uppercase {
 text-transform: uppercase
}
.capitalize {
 text-transform: capitalize
}
h1, h2, h3, h4, h5, h6 {
 font-family: "Saira Extra Condensed", sans-serif;
 color: var( --dark-navy-blue);
 line-height: 1.1;
 margin-top: 0;
 font-style: normal;
 font-weight: 700;
 text-transform: normal
}
.sect-title, .section-title h6, .theme_btn, p {
 font-family: Poppins, sans-serif
}
.h1, h1 {
 font-size: 40px
}
.h2, h2 {
 font-size: 36px
}
.h3, h3 {
 font-size: 28px
}
.counter-box h2 b, .h4, h4 {
 font-size: 22px
}
.h5, h5 {
 font-size: 18px
}
.h6, h6, p {
 font-size: 16px
}
.sect-title, label, p {
 font-weight: 400
}
.list-style-none {
 margin: 0;
 padding: 0
}
p {
 line-height: 30px;
 margin-bottom: 0
}
hr {
 border-bottom: 1px solid var( --light-dove-grey);
 border-top: 0;
 margin: 30px 0;
 padding: 0
}
label {
 cursor: pointer;
 font-size: 14px
}
::-moz-selection {
 background: var( --black);
 color: var( --white);
 text-shadow: none
}
::selection {
 background: var( --black);
 color: var( --white);
 text-shadow: none
}
.after-none::after, .before-none::before, .faq-que-list .accordion-item .accordion-button::after, .navbar-nav .nav-item .nav-link::after, .side-mobile-menu {
 display: none
}
::-moz-placeholder {
 color: var( --black);
 font-size: 14px;
 opacity: 1
}
::placeholder {
 color: var( --black);
 font-size: 14px;
 opacity: 1
}
.best-img-box, .call-to-action, .left-line, .main-slider, .pos-rel, .search-area, .shipping-img-box, .subscribe-form {
 position: relative
}
.page-title-blog-details .page-shape, .pos-abl, .slider-shape3 {
 position: absolute
}
.comic-blogs-wrapper .comic-blogs-thumb, .comic-progress-bar, .fix, .on-side, .shape-style, .single-case__thumb, .team-wrapper, .team-wrapper .team-thumb {
 overflow: hidden
}
.grey-bg {
 background: color-mix(in srgb, var(--primary), transparent 90%)
}
.grey-bg-soft {
 background: color-mix(in srgb, var(--primary), transparent 90%)
}
.grey-bg-soft2 {
 background: color-mix(in srgb, var(--primary), transparent 90%)
}
.grey-bg-soft3 {
 background: color-mix(in srgb, var(--primary), transparent 90%)
}
.sky-blue-bg {
 background-color: color-mix(in srgb, var(--secondary), transparent 70%)
}
.sky-blue-bg-2 {
 background-color: color-mix(in srgb, var(--secondary), transparent 70%)
}
.sky-blue-bg-soft {
 background-color: color-mix(in srgb, var(--secondary), transparent 70%)
}
.white-bg {
 background: var( --white)
}
.black-bg {
 background: var( --black)
}
.heding-bg {
 background: var( --dark-navy-blue)
}
.open-mobile-menu a.active, .open-mobile-menu a:hover, .theme-bg {
 background: var( --primary)
}
.primary-bg {
 background: var( --charcoal-black)
}
.header-2-icon, .offset-widget .info-widget p, .scrollUp i, .team-content p, .white-color {
 color: var( --white)
}
.black-color {
 color: var( --black)
}
.blog-single .blog-title a:hover, .blog-single .meta-links:hover, .blogs-content .blog-title a:hover, .c-services a:hover, .case-title:hover a, .fot-list li a:hover, .gf_btn.active, .navbar-nav .nav-item .nav-link:hover, .page-title-wrapper .page-title span, .post-left:hover h4, .post-right:hover h4, .side-mobile-menu ul li a[aria-expanded=true], .theme-color, .widget_categories ul li:hover a, .widget_categories ul li:hover span {
 color: var( --primary)
}
.theme-color2 {
 color: var( --secondary)
}
.primary-color {
 color: var( --charcoal-black)
}
.main-slider3 .slider-video .popup-video, .theme-bg-color, [data-overlay=dark]::before {
 background-color: var( --primary)
}
.theme-bg-color2 {
 background-color: var( --secondary) !important
}
.left-line::before {
 content: "";
 background: var( --white);
 position: absolute;
 left: 0;
 top: 10px;
 width: 50px;
 height: 2px;
 z-index: 1
}
.about-img-wrapper, .best-img-box .best-img, .chose-wrapper, .management-title, .page-title-area, .page-title-wrapper, .section-title, .shipment-content-img {
 position: relative;
 z-index: 2
}
.bg-shape::before, .section-title2 h2 .bs-2::before {
 position: absolute;
 width: 100%;
 z-index: -1;
 left: 0;
 content: ''
}
.bg-shape, .popup-video {
 display: inline-block;
 position: relative;
 z-index: 1
}
.section-title h6 {
 color: var( --primary);
 font-size: 25px;
 font-weight: 500
}
.section-title h2 {
 font-size: 45px;
 line-height: 1
}
.sect-title {
 font-size: 20px;
 line-height: 1.6
}
.bg-shape::before {
 background-image: url(../images/a7/text-bg.svg);
 height: 25px;
 display: inline-block;
 bottom: 6px
}
.semi-title {
 font-size: 26px
}
.section-title2 h2 .bs-2::before {
 background-image: url(../images/a7/red-line-2.svg);
 background-repeat: no-repeat;
 display: inline-block;
 height: 100%;
 right: 0;
 top: 11px
}
.section-title2 p {
 font-size: 20px;
 line-height: 32px
}
.popup-video {
 background: var( --secondary);
 line-height: 65px;
 width: 65px;
 height: 65px;
 text-align: center;
 -webkit-transition: .4s ease-out;
 -moz-transition: .4s ease-out;
 -ms-transition: .4s ease-out;
 -o-transition: .4s ease-out;
 transition: .4s ease-out;
 animation: 5s linear infinite pulseBig
}
.preloader, .preloader span {
 position: absolute;
 display: inline-block;
 width: 50px;
 height: 50px
}
.popup-video:hover {
 color: var( --white);
 background: var( --primary)
}
.dark #preloader {
 background-color: var( --charcoal-black)
}
#preloader {
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 background-color: var( --light-grey);
 z-index: 999999
}
.preloader {
 padding: 0;
 text-align: left;
 box-sizing: border-box;
 top: 50%;
 left: 50%;
 margin-left: -25px;
 margin-top: -25px
}
.preloader span {
 border-radius: 100%;
 background: var( --primary);
 -webkit-animation: 1.3s linear infinite preloader;
 animation: 1.3s linear infinite preloader
}
.preloader span:last-child {
 animation-delay: -.8s;
 -webkit-animation-delay: -.8s
}
@keyframes preloader {
 0% {
  transform: scale(0, 0);
  opacity: .5
 }
 100% {
  transform: scale(1, 1);
  opacity: 0
 }
}
@-webkit-keyframes preloader {
 0% {
  -webkit-transform: scale(0, 0);
  opacity: .5
 }
 100% {
  -webkit-transform: scale(1, 1);
  opacity: 0
 }
}

.whatsapp-icon {
 background-color: #25D366;
 transition: background-color 0.3s, transform 0.2s;
 position: fixed;
 width: 60px;
 height: 60px;
 bottom: 120px; /* Adjust this if your scroll-to-top button is nearby */
 right: 20px;
 background-color: #25D366;
 color: #fff;
 border: none;
 padding: 0;
 border-radius: 50%;
 font-size: 1.2em; /* Increase size if needed */
 cursor: pointer;
 box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2);
 z-index: 1001;
 display: flex;
 align-items: center;
 justify-content: center;
}


.whatsapp-icon:hover {
 background-color: #25D366;
 transform: scale(1.05);
}

@media screen and (max-width: 600px) {
  .whatsapp-icon {
    width: 50px !important;
    height: 50px !important;
    bottom: 100px !important; /* Make sure there's space above scrollUp */
    right: 30px !important;
    font-size: 1.1em !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
  }

  .scrollUp {
    width: 50px !important;
    height: 50px !important;
    bottom: 30px !important; /* slightly above the screen edge */
    right: 30px !important;
    font-size: 1.1em !important;
  }
}

.scrollUp {
 background-color: var( --primary);
 position: fixed;
 width: 60px;
 height: 60px;
 bottom: 40px; /* Adjust this if your scroll-to-top button is nearby */
 right: 20px;
 color: #fff;
 border: none;
 padding: 0;
 border-radius: 50%;
 font-size: 1.2em; /* Increase size if needed */
 cursor: pointer;
 z-index: 1001;
 display: flex;
 align-items: center;
 justify-content: center;
}

.authors-designation, .btn-hover-style, .chose-img-wrapper, .copic-faq, .onestop-management, .overlay-soft, .q-style1, .slider-style-3, .testimonial-style, .widget_search .search-form {
 position: relative;
 z-index: 1
}
.overlay-soft::after {
 content: '';
 position: absolute;
 background: rgba(0, 0, 0, .2);
 height: 100%;
 width: 100%;
 left: 0;
 top: 0;
 z-index: -1
}
.search-btn, .search-wrap input.form-control, .search-wrap input.form-control:focus, [data-overlay=light]::before {
 background-color: var( --white)
}
[data-overlay] {
 position: relative;
 background-size: cover;
 background-repeat: no-repeat;
 background-position: center center
}
[data-overlay]::before {
 position: absolute;
 left: 0;
 top: 0;
 right: 0;
 bottom: 0;
 content: ""
}
[data-opacity="1"]::before {
 opacity: .1
}
[data-opacity="2"]::before {
 opacity: .2
}
[data-opacity="3"]::before {
 opacity: .3
}
[data-opacity="4"]::before {
 opacity: .4
}
[data-opacity="5"]::before {
 opacity: .5
}
[data-opacity="6"]::before {
 opacity: .6
}
[data-opacity="7"]::before {
 opacity: .7
}
[data-opacity="8"]::before {
 opacity: .8
}
[data-opacity="9"]::before {
 opacity: .9
}
#theme-menu-one {
 padding-left: 85px;
 padding-right: 85px
}
.main-header-area {
 position: absolute;
 width: 100%;
 top: 0;
 left: 0;
 z-index: 999
}

.hamburger-menu, .open-mobile-menu {
 display: inline-block
}
.hamburger-menu>a {
 display: inline-block;
 font-size: 25px;
 color: var( --primary)
}
.offset-sidebar {
 display: block;
 margin-top: 30px
}
.navbar-nav .nav-item:last-child .nav-link {
 margin-right: 0
}
.navbar-nav .nav-item.active, .navbar-nav .nav-item.active .nav-link, .social_share a, .social_share a:hover {
 color: var( --dark-navy-blue)
}
.navbar-nav .nav-item .nav-link {
 color: var( --dark-navy-blue);
 font-size: 18px;
 font-weight: 500;
 line-height: 1;
 display: inline-block;
 position: relative;
 margin: 0 50px 0 0;
 padding: 30px 0
}
.navbar-nav .nav-item .nav-link::before {
 content: '';
 position: absolute;
 background-color: var( --primary);
 width: 0;
 height: 2px;
 left: 0;
 right: auto;
 top: 66%;
 z-index: 1;
 -webkit-transition: .3s;
 -moz-transition: .3s;
 -ms-transition: .3s;
 -o-transition: .3s;
 transition: .3s
}
.navbar-nav .nav-item .nav-link:hover::before {
 width: 100%;
 right: 0
}
.navbar-nav .nav-item .nav-link i {
 font-size: 10px
}
.navbar-nav .nav-item:hover>.nav-link {
 color: var( --primary)
}
.navbar .dropdown-menu {
 border: 0;
 position: absolute;
 z-index: 5;
 background-color: var( --white);
 border-radius: 0;
 display: block;
 right: 0;
 left: 0;
 padding: 8px 0;
 top: 100%;
 visibility: hidden;
 transform: scaleY(0);
 opacity: 0;
 min-width: 220px;
 box-shadow: 0 30px 70px 0 rgba(0, 0, 0, .05);
 margin: 0;
 transform-origin: 0 0;
 -webkit-transition: .3s ease-in-out;
 -moz-transition: .3s ease-in-out;
 -ms-transition: .3s ease-in-out;
 -o-transition: .3s ease-in-out;
 transition: .3s ease-in-out
}
.navbar .dropdown-menu .dropdown-item {
 color: var( --mid-dark-grey);
 font-size: 18px;
 padding: 9px 25px;
 display: block;
 transition: .3s ease-in-out
}
.navbar .dropdown-menu .dropdown-item:hover {
 transform: translatex(5px);
 color: var( --primary);
 background-color: transparent;
 -webkit-transform: translatex(5px);
 -moz-transform: translatex(5px);
 -ms-transform: translatex(5px);
 -o-transform: translatex(5px)
}
.navbar .dropdown:hover .dropdown-menu {
 opacity: 1;
 visibility: visible;
 transform: scale(1)
}
.navbar .navbar-nav .nav-item.active>.nav-link {
 color: var( --primary) !important;
 position: relative
}
.navbar .navbar-nav .nav-item.active>.nav-link::before {
 content: '';
 position: absolute;
 background-color: var( --primary);
 width: 100%;
 height: 2px;
 left: 0;
 right: auto;
 top: 66%;
 z-index: 1;
 -webkit-transition: .3s;
 -moz-transition: .3s;
 -ms-transition: .3s;
 -o-transition: .3s;
 transition: .3s
}
.sticky-menu {
 width: 100%;
 background: var( --white);
 top: 0;
 animation: .3s ease-in-out fadeInDown;
 -webkit-transition: .4s;
 -moz-transition: .4s;
 -ms-transition: .4s;
 -o-transition: .4s;
 transition: .4s;
 box-shadow: 0 0 10px 3px rgba(0, 0, 0, .05);
 padding-top: 0;
 padding-bottom: 0
}
.sticky-menu .logo {
 transform: translateY(2px)
}
.sticky-menu .hamburger-menu {
 top: 17px
}
.sticky-menu .navbar-nav .nav-item .nav-link {
 color: var( --mid-dark-grey)
}
.right-btn .theme_btn_border {
 padding: 13px 35px 11px 30px;
 margin-left: 27px
}
.fot_sub_btn img, .right-btn .theme_btn_border:hover img {
 filter: brightness(1) invert(1);
 -webkit-filter: brightness(1) invert(1)
}
.search-btn {
 width: 61px;
 height: 61px;
 display: inline-block;
 border-radius: 50%;
 text-align: center;
 line-height: 61px
}
.search-area .input-group {
 width: 230px;
 position: absolute;
 left: -220px;
 top: 105%;
 z-index: 1;
 opacity: 0;
 visibility: hidden;
 -webkit-transition: .3s;
 -moz-transition: .3s;
 -ms-transition: .3s;
 -o-transition: .3s;
 transition: .3s
}
.search-area .input-group input {
 border: 1px solid var( --dark-navy-blue);
 border-radius: 3px !important;
 width: 100%;
 display: inline-block;
 height: 45px;
 padding: 0 20px;
 position: relative
}
.search-area .input-group .input-group-text {
 border: 0;
 background-color: transparent;
 position: absolute;
 right: 10px;
 top: 50%;
 padding: 0;
 z-index: 2;
 transform: translateY(-50%)
}
.search-area:hover .input-group {
 opacity: 1;
 visibility: visible;
 left: -180px
}
.call-to {
 margin-left: 25px
}
.call-to img {
 margin-right: 10px;
 transform: translateY(5px)
}
.call-text span {
 color: var( --dark-navy-blue);
 font-size: 15px;
 text-transform: uppercase
}
.call-text .number {
 font-size: 24px;
 font-weight: 500
}
.menu-style-2 .navbar-nav .nav-item .nav-link {
 margin: 0 42px 0 0
}
#hideshow-sticky-menu {
 position: fixed;
 width: 100%;
 display: block;
 top: 0;
 transition: top .3s;
 background-color: var( --light-grey);
 z-index: 99999
}
#theme-menu-three {
 background-color: var( --light-grey);
 padding-left: 98px;
 padding-right: 98px
}
.menu-style-3 .navbar-nav .nav-item .nav-link, .menu-style-4 .navbar-nav .nav-item .nav-link {
 margin: 0 45px 0 0
}
.menu-style-3 .navbar {
 padding-left: 55px
}
@media only screen and (min-width:1601px) and (max-width:1800px) {
 #theme-menu-one {
  padding-left: 0;
  padding-right: 0
 }
 #theme-menu-three {
  padding-left: 15px;
  padding-right: 15px
 }
 .menu-style-3 .navbar-nav .nav-item .nav-link {
  margin-right: 32px
 }
 .menu-style-3 .navbar {
  padding-left: 0
 }
}
@media only screen and (min-width:1200px) and (max-width:1600px) {
 .section-title2 h2 {
  font-size: 45px !important
 }
 .section-title2 h2 .bs-2::before {
  display: none
 }
 #theme-menu-one {
  padding-left: 0;
  padding-right: 0
 }
 .right-btn .theme_btn_border {
  padding: 13px 15px 11px;
  margin-left: 10px
 }
 #theme-menu-three {
  padding-left: 15px;
  padding-right: 15px
 }
 .menu-style-3 .navbar-nav .nav-item .nav-link {
  margin-right: 20px
 }
 .menu-style-3 .navbar {
  padding-left: 0
 }
}
.menu-style-3 .navbar .dropdown:hover .dropdown-menu {
 top: 126%;
 opacity: 1;
 visibility: visible;
 transform: scale(1)
}
.page-title-wrapper .styled-text {
 margin-bottom: 32px
}
.page-title-wrapper .page-title {
 color: var( --dark-navy-blue);
 font-size: 90px;
 font-weight: 700;
 line-height: .95;
 z-index: 1
}
@media only screen and (min-width:992px) and (max-width:1200px) {
 .section-title h2 {
  font-size: 45px !important
 }
 .section-title2 h2 .bs-2::before {
  display: none
 }
 #theme-menu-one, #theme-menu-three {
  padding-left: 15px;
  padding-right: 15px
 }

 .navbar-nav .nav-item .nav-link {
  margin: 0 30px 0 0
 }
 .menu-style-2 .navbar-nav .nav-item .nav-link {
  margin-right: 34px
 }
 .menu-style-3 .navbar-nav .nav-item .nav-link {
  margin-right: 25px
 }
 .page-title-wrapper .page-title {
  font-size: 45px
 }
}
@media only screen and (min-width:768px) and (max-width:991px) {
 .section-title h2 {
  font-size: 35px !important
 }
 .offset-sidebar, .section-title2 h2 .bs-2::before {
  display: none
 }
 .section-title2 p {
  font-size: 16px;
  line-height: 28px
 }
 #theme-menu-one, #theme-menu-three {
  padding-left: 15px;
  padding-right: 15px
 }

 .side-mobile-menu {
  display: block
 }
 .sticky-menu .hamburger-menu {
  top: 35px
 }
 .page-title-wrapper .page-title {
  font-size: 42px
 }
}
@media (max-width:767px) {
 .section-title h2 {
  font-size: 26px !important
 }
 .bg-shape::before {
  bottom: 0
 }
 .offset-sidebar, .section-title2 h2 .bs-2::before {
  display: none
 }
 .scrollUp {
  width: 40px;
  height: 40px;
  line-height: 40px;
  right: 20px;
  font-size: 16px
 }
 #theme-menu-one {
  padding-left: 0;
  padding-right: 0
 }

 .side-mobile-menu {
  display: block
 }
 #theme-menu-three {
  padding-left: 15px;
  padding-right: 15px
 }
 .page-title-wrapper .page-title {
  font-size: 26px
 }
}
.about-box-shape, .about-shape, .about-shape3, .air-shape, .best-shape, .blog-shape, .case-shape, .case-single-shape, .chose-shape, .contact-shape, .copic-faq .faq-shape, .cta-shape, .fot-shape, .logistics-shape, .manage-shape, .offer-shape, .page-shape, .page-shape-02, .profit-shape, .service-shape, .service-shape-v2, .service-shape2, .shipping-shape, .slide-img, .slider-shape, .slider-shape2, .team-shape, .team-shape2, .test-shape, .transport, .value-shape, .work-shape, .work-shape-h3 {
 position: absolute;
 z-index: 1
}
.page-shape.shape_01 {
 left: 4.2%;
 top: 187px
}
.page-shape.shape_04 {
 left: 16.61%;
 top: 168px;
 animation: 5s linear infinite rotation
}
.page-shape.shape_05 {
 left: 20.93%;
 top: 57.3%;
 animation: 5s linear infinite rotation
}
.page-shape.shape_06 {
 right: 17.76%;
 top: 234px
}
.page-shape.shape_07 {
 left: -15px;
 bottom: 33px
}
.page-shape.shape_08 {
 right: 80px;
 bottom: 23px
}
.page-shape.shape_09 {
 right: 11.66%;
 bottom: 27px;
 animation: 5s linear infinite float-bob-y
}
.page-title-area2 .page-shape.shape_05 {
 left: 11.5%;
 top: 59.3%;
 animation: 5s linear infinite rotation
}
.page-title-area2 .page-shape.shape_06 {
 right: 30%;
 top: 255px
}
.page-title-area2 .page-title-img-wrapper .breadcrumb-img {
 margin-top: -30px;
 margin-right: -225px;
 animation: 5s linear infinite float-bob-y
}
.page-title-3 .page-shape.shape_05 {
 left: 12%;
 top: 58%
}
.page-title-3 .page-shape.shape_06 {
 right: 12.5%;
 top: 343px
}
.page-title-3 .page-shape.shape_08 {
 right: 136px;
 bottom: -226px;
 animation: 2s linear infinite float-bob-y;
 -webkit-animation: 2s linear infinite float-bob-y
}
.page-title-3 .page-shape.shape_09 {
 right: 5px;
 bottom: -67px
}
.page-title-blog-details .page-title-wrapper .page-title {
 font-size: 75px;
 line-height: 1.1
}
.page-title-blog-details .page-title-wrapper .blog-author-img {
 border-radius: 50%;
 margin-bottom: 16px
}
.page-title-blog-details .meta-links {
 color: var( --mid-dark-grey);
 display: inline-block
}
.page-title-blog-details .page-shape.shape_04 {
 left: 11%;
 top: 43%;
 animation: 5s linear infinite rotation;
 -webkit-animation: 5s linear infinite rotation
}
.page-title-blog-details .page-shape.shape_05 {
 left: 189px;
 top: 77% !important;
 animation: 5s linear infinite rotation
}
.page-title-blog-details .page-shape.shape_06 {
 right: 9.76%;
 top: 234px
}
.page-title-blog-details .page-shape.blog-shape-3 {
 transform: rotate(8deg);
 -webkit-transform: rotate(8deg);
 -moz-transform: rotate(1deg);
 -ms-transform: rotate(8deg);
 -o-transform: rotate(8deg);
 left: -33px;
 top: 46%
}
.page-title-blog-details .page-shape.blog-shape-4 {
 right: 9% !important;
 top: 41% !important;
 z-index: -1
}
.page-shape.blog-shape-1 {
 left: 4.2%;
 top: 187px;
 height: 69%
}
.page-shape.blog-shape-2 {
 height: 69%
}
.page-shape.service-2-shape {
 left: 0;
 top: 187px
}
.page-shape.service-2-shape2 {
 left: 15%;
 top: 168px;
 animation: 5s linear infinite rotation
}
.page-shape.contact-shape-1 {
 left: 4.2%;
 top: 190px;
 height: 73%
}
.slide-bar {
 position: fixed;
 overflow-y: auto;
 top: 0;
 right: -370px;
 width: 350px;
 padding: 25px 30px;
 height: 100%;
 display: block;
 background-color: var( --dark-navy-blue);
 z-index: 99999;
 -webkit-transition: .6s cubic-bezier(.785, .135, .15, .86);
 -moz-transition: .6s cubic-bezier(.785, .135, .15, .86);
 transition: .6s cubic-bezier(.785, .135, .15, .86);
 box-shadow: -5px 0 20px -5px rgba(0, 0, 0, .5)
}
.body-overlay, .theme_btn_border {
 -webkit-transition: .3s;
 -moz-transition: .3s;
 -ms-transition: .3s;
 -o-transition: .3s
}
@media only screen and (min-width:576px) and (max-width:767px) {
 .side-mobile-menu {
  display: block
 }
 .offset-sidebar {
  display: none
 }
 .page-title-wrapper .page-title {
  font-size: 36px
 }
 .slide-bar {
  width: 350px
 }
}
.slide-bar.show {
 right: 0
}
.open-mobile-menu a {
 display: block;
 width: 50px;
 height: 50px;
 background: var( --charcoal-black);
 text-align: center;
 line-height: 50px;
 font-size: 20px;
 margin-left: 20px;
 color: var( --white)
}
.close-mobile-menu a {
 color: var( --white);
 position: relative;
 z-index: 2;
 font-size: 16px;
 top: -10px;
 left: 0
}
.close-mobile-menu a:hover {
 color: var( --primary)
}
.body-overlay {
 background-color: rgba(0, 0, 0, .5);
 height: 100%;
 width: 100%;
 position: fixed;
 top: 0;
 z-index: 1010;
 left: 0;
 opacity: 0;
 display: none;
 transition: .3s
}
.body-overlay.active {
 opacity: 1;
 display: block
}
.side-mobile-menu ul {
 list-style: none;
 margin: 0;
 padding: 0
}
.side-mobile-menu ul li a {
 padding: 13px 0;
 display: block;
 border-bottom: 1px solid rgba(0, 0, 0, .05);
 font-size: 16px;
 color: var( --white);
 font-weight: 700;
 text-transform: uppercase;
 position: relative
}
.side-mobile-menu ul li a:hover {
 color: var( --primary);
 padding-left: 5px
}
.side-mobile-menu ul li a[aria-expanded=true]:before, .side-mobile-menu ul li ul li:hover>a:before {
 background: var( --primary);
 border-color: var( --primary)
}
.side-mobile-menu ul li ul {
 padding-left: 0;
 list-style: none
}
.side-mobile-menu ul li ul li {
 padding-left: 15px
}
.side-mobile-menu ul li ul li:hover>a {
 color: var( --primary);
 padding-left: 20px
}
.side-mobile-menu ul li ul li a {
 position: relative;
 padding-left: 15px;
 text-transform: capitalize;
 font-size: 16px
}
.side-mobile-menu ul li ul li a:before {
 content: "";
 width: 8px;
 height: 8px;
 position: absolute;
 left: 0;
 top: 50%;
 transform: translateY(-50%);
 border: 2px solid var( --white);
 border-radius: 50%
}
.side-mobile-menu ul li ul li a[aria-expanded=true] {
 padding-left: 20px
}
.side-mobile-menu ul li.has-dropdown>a:after {
 position: absolute;
 content: "";
 width: 8px;
 height: 8px;
 border-width: 2px 0 0 2px;
 border-style: solid;
 border-color: initial;
 right: 16px;
 top: 50%;
 -webkit-transform: rotate(-45deg) translateY(-50%);
 transform: rotate(-45deg) translateY(-50%);
 -webkit-transform-origin: top;
 transform-origin: top;
 transition: .3s ease-out
}
.side-mobile-menu ul li.has-dropdown a[aria-expanded=true]:after {
 -webkit-transform: rotate(-135deg) translateY(-50%);
 transform: rotate(-135deg) translateY(-50%)
}
.offset-widget.offset-logo {
 border-bottom: 1px solid #eeecec;
 padding-bottom: 20px
}
.offset-widget .info-widget .offset-title {
 font-size: 20px;
 font-weight: 800;
 color: var( --white)
}
.offset-widget .info-widget.info-widget2 p {
 margin-bottom: 15px
}
.offset-widget .info-widget.info-widget2 p i {
 margin-right: 7px;
 color: var( --white)
}
.nav-search.search-trigger.header-2-icon {
 color: var( --white);
 display: inline-block
}
.nav-search {
 position: relative;
 display: block;
 color: inherit
}
.search-wrap {
 width: 100%;
 height: 100%;
 overflow: hidden;
 display: none;
 position: fixed;
 top: 0;
 left: 0;
 z-index: 121;
 background: rgba(0, 0, 0, .9)
}
.c-services a, .c-services__icon, .slider-video, .theme_btn {
 display: inline-block
}
.search-wrap .search-inner {
 position: relative;
 width: 100%;
 height: 100%
}
.search-wrap .search-cell {
 position: absolute;
 top: 50%;
 width: 100%;
 transform: translateY(-50%)
}
.search-wrap .search-field-holder {
 width: 50%;
 margin: auto;
 position: relative;
 animation: .3s slideInUp
}
.search-wrap .main-search-input {
 width: 100%;
 height: 70px;
 border: 0;
 padding: 0 50px;
 text-transform: uppercase;
 background: 0 0;
 font-size: 25px;
 color: var( --white);
 border-bottom: 2px solid var( --mid-dark-grey);
 text-align: center;
 letter-spacing: 2px
}
@keyframes slideInUp {
 from {
  -webkit-transform: translate3d(0, 100%, 0);
  transform: translate3d(0, 100%, 0)
 }
 to {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0)
 }
}
@-webkit-keyframes slideInUp {
 from {
  -webkit-transform: translate3d(0, 100%, 0);
  transform: translate3d(0, 100%, 0)
 }
 to {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0)
 }
}
input.main-search-input::-webkit-input-placeholder {
 color: var( --white);
 font-size: 25px
}
input.main-search-input:-moz-placeholder {
 color: var( --white);
 opacity: 1;
 font-size: 25px
}
input.main-search-input::-moz-placeholder {
 color: var( --white);
 opacity: 1;
 font-size: 25px
}
input.main-search-input:-ms-input-placeholder {
 color: var( --white);
 font-size: 25px
}
.search-close {
 position: absolute;
 top: 50px;
 right: 50px;
 font-size: 30px;
 color: var( --white);
 cursor: pointer
}
@-webkit-keyframes jump {
 0%, 100% {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0)
 }
 40% {
  -webkit-transform: translate3d(0, 50%, 0);
  transform: translate3d(0, 50%, 0)
 }
}
@keyframes jump {
 0%, 100% {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0)
 }
 40% {
  -webkit-transform: translate3d(0, 50%, 0);
  transform: translate3d(0, 50%, 0)
 }
}
@-webkit-keyframes rotated {
 0% {
  -webkit-transform: rotateY(0);
  transform: rotateY(0)
 }
 100% {
  -webkit-transform: rotateY(360deg);
  transform: rotateY(360deg)
 }
}
@keyframes rotated {
 0% {
  -webkit-transform: rotateY(0);
  transform: rotateY(0)
 }
 100% {
  -webkit-transform: rotateY(360deg);
  transform: rotateY(360deg)
 }
}
@-webkit-keyframes rotatedHalf {
 0%, 100% {
  -webkit-transform: rotate(0);
  transform: rotate(0)
 }
 50% {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg)
 }
}
@keyframes rotatedHalf {
 0%, 100% {
  -webkit-transform: rotate(0);
  transform: rotate(0)
 }
 50% {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg)
 }
}
@-webkit-keyframes rotatedHalfTwo {
 0% {
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg)
 }
 100% {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg)
 }
}
@keyframes rotatedHalfTwo {
 0% {
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg)
 }
 100% {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg)
 }
}
@-webkit-keyframes scale-upOne {
 0% {
  -webkit-transform: scale(1);
  transform: scale(1)
 }
 100% {
  -webkit-transform: scale(.2);
  transform: scale(.2)
 }
}
@keyframes scale-upOne {
 0% {
  -webkit-transform: scale(1);
  transform: scale(1)
 }
 100% {
  -webkit-transform: scale(.2);
  transform: scale(.2)
 }
}
@-webkit-keyframes scale-right {
 0%, 100% {
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%)
 }
 50% {
  -webkit-transform: translateX(50%);
  transform: translateX(50%)
 }
}
@keyframes scale-right {
 0%, 100% {
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%)
 }
 50% {
  -webkit-transform: translateX(50%);
  transform: translateX(50%)
 }
}
@-webkit-keyframes fade-in {
 0% {
  opacity: .5
 }
 40% {
  opacity: 1
 }
 100% {
  opacity: .7
 }
}
@keyframes fade-in {
 0% {
  opacity: .5
 }
 40% {
  opacity: 1
 }
 100% {
  opacity: .7
 }
}
@keyframes hvr-ripple-out {
 0% {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 1
 }
 100% {
  top: -6px;
  right: -6px;
  bottom: -6px;
  left: -6px;
  opacity: 0
 }
}
@keyframes hvr-ripple-out-two {
 0% {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 1
 }
 100% {
  top: -12px;
  right: -12px;
  bottom: -12px;
  left: -12px;
  opacity: 0
 }
}
@-webkit-keyframes scale-up-one {
 0%, 100% {
  -webkit-transform: scale(1);
  transform: scale(1)
 }
 40% {
  -webkit-transform: scale(.5);
  transform: scale(.5)
 }
}
@keyframes scale-up-one {
 0%, 100% {
  -webkit-transform: scale(1);
  transform: scale(1)
 }
 40% {
  -webkit-transform: scale(.5);
  transform: scale(.5)
 }
}
@-webkit-keyframes scale-up-one-1 {
 0%, 100% {
  -webkit-transform: scale(1);
  transform: scale(1)
 }
 40% {
  -webkit-transform: scale(.8);
  transform: scale(.8)
 }
}
@keyframes scale-up-one-1 {
 0%, 100% {
  -webkit-transform: scale(1);
  transform: scale(1)
 }
 40% {
  -webkit-transform: scale(.8);
  transform: scale(.8)
 }
}
@-webkit-keyframes scale-up-two {
 0% {
  -webkit-transform: scale(.9);
  transform: scale(.9)
 }
 40% {
  -webkit-transform: scale(.8);
  transform: scale(.8)
 }
 100% {
  -webkit-transform: scale(.5);
  transform: scale(.5)
 }
}
@keyframes scale-up-two {
 0% {
  -webkit-transform: scale(.9);
  transform: scale(.9)
 }
 40% {
  -webkit-transform: scale(.8);
  transform: scale(.8)
 }
 100% {
  -webkit-transform: scale(.5);
  transform: scale(.5)
 }
}
@-webkit-keyframes scale-up-three {
 0%, 100% {
  -webkit-transform: scale(.7);
  transform: scale(.7)
 }
 40% {
  -webkit-transform: scale(.4);
  transform: scale(.4)
 }
}
@keyframes scale-up-three {
 0%, 100% {
  -webkit-transform: scale(.7);
  transform: scale(.7)
 }
 40% {
  -webkit-transform: scale(.4);
  transform: scale(.4)
 }
}
@-webkit-keyframes scale-up-four {
 0% {
  -webkit-transform: scale(.6);
  transform: scale(.6)
 }
 40% {
  -webkit-transform: scale(.7);
  transform: scale(.7)
 }
 100% {
  -webkit-transform: scale(.9);
  transform: scale(.9)
 }
}
@keyframes scale-up-four {
 0% {
  -webkit-transform: scale(.6);
  transform: scale(.6)
 }
 40% {
  -webkit-transform: scale(.7);
  transform: scale(.7)
 }
 100% {
  -webkit-transform: scale(.9);
  transform: scale(.9)
 }
}
@-webkit-keyframes scale-up-five {
 0% {
  -webkit-transform: scale(1);
  transform: scale(1)
 }
 40% {
  -webkit-transform: scale(.4);
  transform: scale(.4)
 }
 100% {
  -webkit-transform: scale(.9);
  transform: scale(.9)
 }
}
@keyframes scale-up-five {
 0% {
  -webkit-transform: scale(1);
  transform: scale(1)
 }
 40% {
  -webkit-transform: scale(.5);
  transform: scale(.5)
 }
 100% {
  -webkit-transform: scale(.9);
  transform: scale(.9)
 }
}
@keyframes animationFramesOne {
 0%, 100% {
  transform: translate(0, 0) rotate(0)
 }
 20% {
  transform: translate(73px, -1px) rotate(36deg)
 }
 40% {
  transform: translate(141px, 72px) rotate(72deg)
 }
 60% {
  transform: translate(83px, 122px) rotate(108deg)
 }
 80% {
  transform: translate(-40px, 72px) rotate(144deg)
 }
}
@-webkit-keyframes animationFramesOne {
 0%, 100% {
  -webkit-transform: translate(0, 0) rotate(0)
 }
 20% {
  -webkit-transform: translate(73px, -1px) rotate(36deg)
 }
 40% {
  -webkit-transform: translate(141px, 72px) rotate(72deg)
 }
 60% {
  -webkit-transform: translate(83px, 122px) rotate(108deg)
 }
 80% {
  -webkit-transform: translate(-40px, 72px) rotate(144deg)
 }
}
@keyframes animationFramesTwo {
 0%, 100% {
  transform: translate(0, 0) rotate(0) scale(1)
 }
 20% {
  transform: translate(73px, -1px) rotate(36deg) scale(.9)
 }
 40% {
  transform: translate(141px, 72px) rotate(72deg) scale(1)
 }
 60% {
  transform: translate(83px, 122px) rotate(108deg) scale(1.2)
 }
 80% {
  transform: translate(-40px, 72px) rotate(144deg) scale(1.1)
 }
}
@-webkit-keyframes animationFramesTwo {
 0%, 100% {
  -webkit-transform: translate(0, 0) rotate(0) scale(1)
 }
 20% {
  -webkit-transform: translate(73px, -1px) rotate(36deg) scale(.9)
 }
 40% {
  -webkit-transform: translate(141px, 72px) rotate(72deg) scale(1)
 }
 60% {
  -webkit-transform: translate(83px, 122px) rotate(108deg) scale(1.2)
 }
 80% {
  -webkit-transform: translate(-40px, 72px) rotate(144deg) scale(1.1)
 }
}
@keyframes animationFramesThree {
 0% {
  transform: translate(165px, -179px)
 }
 100% {
  transform: translate(-346px, 617px)
 }
}
@-webkit-keyframes animationFramesThree {
 0% {
  -webkit-transform: translate(165px, -179px)
 }
 100% {
  -webkit-transform: translate(-346px, 617px)
 }
}
@keyframes animationFramesFour {
 0% {
  transform: translate(-200px, 151px) rotate(0)
 }
 100% {
  transform: translate(251px, -200px) rotate(180deg)
 }
}
@-webkit-keyframes animationFramesFour {
 0% {
  -webkit-transform: translate(-200px, 151px) rotate(0)
 }
 100% {
  -webkit-transform: translate(251px, -200px) rotate(180deg)
 }
}
@keyframes animationFramesFive {
 0% {
  transform: translate(61px, -99px) rotate(0)
 }
 21% {
  transform: translate(4px, -190px) rotate(38deg)
 }
 41% {
  transform: translate(-139px, -200px) rotate(74deg)
 }
 60% {
  transform: translate(-263px, -164px) rotate(108deg)
 }
 80% {
  transform: translate(-195px, -49px) rotate(144deg)
 }
 100% {
  transform: translate(-1px, 0) rotate(180deg)
 }
}
@-webkit-keyframes animationFramesFive {
 0% {
  -webkit-transform: translate(61px, -99px) rotate(0)
 }
 21% {
  -webkit-transform: translate(54px, -90px) rotate(38deg)
 }
 41% {
  -webkit-transform: translate(-139px, -200px) rotate(74deg)
 }
 60% {
  -webkit-transform: translate(-263px, -164px) rotate(108deg)
 }
 80% {
  -webkit-transform: translate(-195px, -49px) rotate(144deg)
 }
 100% {
  -webkit-transform: translate(-1px, 0) rotate(180deg)
 }
}
@keyframes gradientBG {
 0%, 100% {
  background-position: 0 0
 }
 50% {
  background-position: 300% 0
 }
}
@-webkit-keyframes gradientBG {
 0%, 100% {
  background-position: 0 0
 }
 50% {
  background-position: 120% 0
 }
}
@keyframes imageBgAnim {
 0%, 100% {
  background-position: 0 0
 }
 50% {
  background-position: 120% 0
 }
}
@keyframes moveRound {
 0%, 100% {
  background-color: #eee3ff;
  left: -24px;
  top: 0
 }
 25% {
  background-color: #feddfc;
  left: 100px;
  top: 0
 }
 50% {
  background-color: #efe4ff;
  left: 100px;
  top: 100px
 }
 75% {
  background-color: #e2fcf4;
  left: -24px;
  top: 200px
 }
}
@-webkit-keyframes moveRound {
 0%, 100% {
  background-color: #eee3ff;
  left: -24px;
  top: 0
 }
 25% {
  background-color: #feddfc;
  left: 100px;
  top: 0
 }
 50% {
  background-color: #efe4ff;
  left: 100px;
  top: 200px
 }
 75% {
  background-color: #e2fcf4;
  left: -24px;
  top: 100px
 }
}
@keyframes moveShap {
 0%, 100% {
  left: 0;
  top: 0
 }
 25% {
  left: 100px;
  top: 0
 }
 50% {
  left: 100px;
  top: 100px
 }
 75% {
  left: 0;
  top: 200px
 }
}
@keyframes moveShap2 {
 0%, 100% {
  right: 0;
  top: 0
 }
 25% {
  right: 100px;
  top: 0
 }
 50% {
  right: 100px;
  top: 100px
 }
 75% {
  right: 0;
  top: 200px
 }
}
@-webkit-keyframes heartbeat {
 to {
  -webkit-transform: scale(1.2);
  transform: scale(1.2)
 }
}
@keyframes heartbeat {
 to {
  -webkit-transform: scale(1.2);
  transform: scale(1.2)
 }
}
@keyframes rotation {
 to {
  transform: rotate(360deg)
 }
}
@keyframes pulseBig {
 0% {
  box-shadow: 0 0 0 0 var( --white)
 }
 50% {
  box-shadow: 0 0 0 30px rgba(1, 93, 199, 0)
 }
 100% {
  box-shadow: 0 0 0 0 rgba(1, 93, 199, 0)
 }
}
@keyframes pulseBig2 {
 0% {
  box-shadow: 0 0 0 0 var( --secondary)
 }
 50% {
  box-shadow: 0 0 0 20px rgba(1, 93, 199, 0)
 }
 100% {
  box-shadow: 0 0 0 0 rgba(1, 93, 199, 0)
 }
}
@keyframes pulseBig3 {
 0% {
  box-shadow: 0 0 0 0 var( --primary)
 }
 50% {
  box-shadow: 0 0 0 10px rgba(1, 93, 199, 0)
 }
 100% {
  box-shadow: 0 0 0 0 rgba(1, 93, 199, 0)
 }
}
@keyframes pulseBig4 {
 0% {
  box-shadow: 0 0 0 0 #fc9ba4
 }
 50% {
  box-shadow: 0 0 0 10px rgba(1, 93, 199, 0)
 }
 100% {
  box-shadow: 0 0 0 0 rgba(1, 93, 199, 0)
 }
}
.scaleUp1 {
 -webkit-animation-name: scaleUp1;
 animation-name: scaleUp1;
 -webkit-animation-duration: 3s;
 animation-duration: 3s;
 -webkit-animation-iteration-count: infinite;
 animation-iteration-count: infinite;
 -webkit-animation-timing-function: linear;
 animation-timing-function: linear
}
@-webkit-keyframes scaleUp1 {
 0%, 100%, 40% {
  -webkit-transform: translateY(1);
  transform: translateY(1)
 }
 20%, 80% {
  -webkit-transform: translateY(-15px);
  transform: translateY(-15px)
 }
}
@keyframes scaleUp1 {
 0%, 100%, 40% {
  -webkit-transform: translateY(1);
  transform: translateY(1)
 }
 20%, 80% {
  -webkit-transform: translateY(-15px);
  transform: translateY(-15px)
 }
}
@keyframes rail-line {
 0% {
  transform: translate(-150px)
 }
 100% {
  transform: translate(150px);
  background: var( --primary)
 }
}
@-moz-keyframes rail-line {
 0% {
  transform: translate(-150px)
 }
 100% {
  transform: translate(150px);
  background: var( --primary)
 }
}
@-webkit-keyframes rail-line {
 0% {
  transform: translate(-50px)
 }
 100% {
  transform: translate(50px);
  background: var( --primary)
 }
}
@keyframes type {
 0% {
  width: 0
 }
 100% {
  width: 100%
 }
}
@-webkit-keyframes type {
 0% {
  width: 0
 }
 100% {
  width: 100%
 }
}
@keyframes runs {
 0% {
  transform: translateY(0) rotate(90deg)
 }
 50% {
  transform: translateY(300px) rotate(90deg)
 }
 100% {
  transform: translateY(-300px) rotate(180deg)
 }
}
@-webkit-keyframes runs {
 0% {
  transform: translateY(0) rotate(90deg)
 }
 50% {
  transform: translateY(300px) rotate(90deg)
 }
 100% {
  transform: translateY(-300px) rotate(180deg)
 }
}
@-moz-keyframes runs {
 0% {
  transform: translateY(0) rotate(90deg)
 }
 50% {
  transform: translateY(300px) rotate(90deg)
 }
 100% {
  transform: translateY(-300px) rotate(180deg)
 }
}
@-o-keyframes runs {
 0% {
  transform: translateY(0) rotate(90deg)
 }
 50% {
  transform: translateY(300px) rotate(90deg)
 }
 100% {
  transform: translateY(-300px) rotate(180deg)
 }
}
@keyframes zoomIncolor {
 0% {
  transform: scale(.8)
 }
 50% {
  transform: scale(1);
  background: var( --primary);
  opacity: .5
 }
 100% {
  transform: scale(1.3);
  background: var( --primary);
  opacity: .8
 }
}
@-webkit-keyframes zoomIncolor {
 0% {
  transform: scale(.8)
 }
 50% {
  transform: scale(1);
  background: var( --primary);
  opacity: .5
 }
 100% {
  transform: scale(1.3);
  background: var( --primary);
  opacity: .8
 }
}
@-moz-keyframes zoomIncolor {
 0% {
  transform: scale(.8)
 }
 50% {
  transform: scale(1);
  background: var( --primary);
  opacity: .5
 }
 100% {
  transform: scale(1.3);
  background: var( --primary);
  opacity: .8
 }
}
@keyframes squareMove {
 0%, 100% {
  transform: translateX(0) rotate(0)
 }
 33% {
  transform: translateY(-100px) rotate(180deg)
 }
 66% {
  transform: translateX(200px) rotate(-90deg)
 }
}
@-webkit-keyframes squareMove {
 0%, 100% {
  transform: translateX(0)
 }
 33% {
  transform: translateY(-100px)
 }
 66% {
  transform: translateX(200px)
 }
}
@-moz-keyframes squareMove {
 0%, 100% {
  transform: translateX(0)
 }
 33% {
  transform: translateY(-100px)
 }
 66% {
  transform: translateX(200px)
 }
}
.theme_btn {
 overflow: hidden;
 color: var( --white);
 background: var( --primary);
 font-size: 18px;
 font-weight: 500;
 line-height: 1;
 padding: 22px 45px;
 position: relative;
 z-index: 1;
 cursor: pointer;
 transition: .4s ease-in-out;
 text-transform: uppercase
}
.slider-video h2, .styled-text {
 font-family: gloss_and_bloomregular
}
.theme_btn:hover {
 color: var( --white);
 background: var( --secondary)
}
.theme_btn.style-3:hover {
 transform: translateY(-3px);
 -webkit-transform: translateY(-3px);
 -moz-transform: translateY(-3px);
 -ms-transform: translateY(-3px);
 -o-transform: translateY(-3px)
}
.theme_btn2 {
 padding: 22px 48px
}
.theme_btn_border {
 background: 0 0;
 border: 1px solid var( --dark-navy-blue);
 color: var( --dark-navy-blue);
 border-radius: 3px;
 padding: 10px ​35px !important;
 transition: .3s
}
.theme_btn_border.active, .theme_btn_border:hover {
 color: var( --white);
 background-color: var( --dark-navy-blue);
 border-color: var( --dark-navy-blue)
}
.border_btn_red, .theme_btn_border.style-2b {
 color: var( --primary);
 border-color: var( --primary)
}
.theme_btn_border.active:hover {
 background: 0 0;
 border: 2px solid var( --black);
 color: var( --black)
}
.theme_btn_border.style-2b {
 padding: 20px 32px
}
.theme_btn_border.style-2b:hover {
 color: var( --white);
 background-color: var( --primary)
}
.border_btn_red.active, .border_btn_red:hover, .tag_cloud .tag:hover {
 color: var( --white);
 background-color: var( --primary);
 border-color: var( --primary)
}
.black-btn {
 background-color: var( --dark-navy-blue);
 padding: 20px 33px;
 text-transform: initial
}
.black-btn:hover, .comic-progress-bar .progress .bar-2, .main-slider3 .slider-video .popup-video:hover, .single-case:hover .plus-icon, .team-wrapper .social-links a:last-child {
 background-color: var( --secondary)
}
.form-btn {
 border: 0
}
.blog-more .theme_btn_border {
 padding: 21px 30px
}
.btn-hover-style::before {
 content: '';
 position: absolute;
 right: 0;
 top: 0;
 width: 25px;
 height: 100%;
 background-color: #ff696b;
 z-index: -1;
 -webkit-transition: .3s;
 -moz-transition: .3s;
 -ms-transition: .3s;
 -o-transition: .3s;
 transition: .3s
}
.btn-hover-style:hover::before {
 width: 100%;
 background-color: var( --secondary)
}
.intro-custom-container {
 max-width: 1485px;
 margin: 0 auto
}
.services-custom-container {
 max-width: 1605px;
 margin: 0 auto
}
.services-custom-container-2 {
 max-width: 1420px;
 margin: 0 auto
}
.testimonial-custom-container {
 max-width: 1250px;
 margin: 0 auto
}
.page-title-custom-container {
 max-width: 1580px;
 margin: 0 auto
}
.slider-shape.shape_01 {
 bottom: 85px;
 left: 0;
 z-index: 2
}
.slider-shape.shape_02 {
 right: 44%;
 bottom: 112px
}
.slider-shape.shape_03 {
 right: 20.67%;
 bottom: 0
}
.slider-shape.shape_04 {
 left: 13.54%;
 top: 207px
}
.slider-shape.shape_05 {
 left: 160px;
 top: 58%
}
.slider-shape.shape_06 {
 top: 305px;
 right: 32.55%
}
.slider-shape.shape_07 {
 right: 94px;
 bottom: 100px
}
.slider-shape.shape_08 {
 right: 4.68%;
 top: 227px
}
.transport.img-one {
 right: 9.5%;
 top: -93px
}
.transport.img-two {
 right: 24%;
 bottom: 0
}
.transport.img-three {
 right: 14.5%;
 bottom: 125px;
 animation: 4s linear infinite float-bob-y
}
.transport.img-four {
 right: 60px;
 bottom: 0
}
.slider-video {
 text-align: center;
 position: absolute;
 right: 11%;
 bottom: -120px;
 z-index: 2
}
.slider-video .popup-video {
 margin-bottom: 30px
}
.slider-video h2 {
 font-size: 36px;
 font-weight: 400
}
.styled-text {
 font-size: 24px;
 font-weight: 400;
 margin-bottom: 45px
}
.main-title {
 font-size: 120px;
 line-height: 1.01
}
.slider__content {
 position: relative;
 z-index: 5
}
.slider__content h5 {
 font-size: 20px;
 font-weight: 400;
 font-family: Poppins, sans-serif;
 line-height: 1.8;
 margin-bottom: 55px;
 padding-right: 100px
}
.main-slider2 {
 padding-top: 95px;
 position: relative;
 z-index: 2
}
.main-slider2 .slider-video {
 right: 5%;
 bottom: -160px
}
.main-slider2 .slider-video span {
 color: var( --dark-navy-blue);
 font-size: 20px;
 margin-right: 20px
}
.main-slider2 .slider-video .popup-video {
 width: 75px;
 height: 75px;
 line-height: 75px;
 animation: 5s linear infinite pulseBig2;
 -webkit-animation: 5s linear infinite pulseBig2
}
.main-slider2 .slider-video .popup-video:hover {
 background-color: var(--dark-secondary);
}
#slider-two {
 background-color: color-mix(in srgb, var(--secondary), transparent 70%)
}
.slider-shape2.shape_01 {
 top: 26%;
 left: 9%;
 animation: 10s linear infinite animationFramesTwo;
 -webkit-animation: 10s linear infinite animationFramesTwo
}
.slider-shape2.shape_02 {
 left: 3.5%;
 top: 48%;
 animation: 5s linear infinite float-bob-y;
 -webkit-animation: 5s linear infinite float-bob-y
}
.slider-shape2.shape_03 {
 right: 22%;
 bottom: 0
}
.slider-shape2.shape_04 {
 left: 20%;
 top: 28%
}
.slider-shape2.shape_05 {
 left: 6%;
 bottom: 13%;
 animation: 5s infinite alternate rotation;
 -webkit-animation: 5s infinite alternate rotation
}
.slider-shape2.shape_07 {
 right: 22%;
 bottom: 2%
}
.slider-shape2.shape_06 {
 right: 11%;
 top: 27%;
 width: 52px;
 height: 52px;
 transform: rotate(41deg);
 z-index: 3
}
.slider-shape2.shape_08 {
 right: 11.7%;
 bottom: 0
}
.slide-img.img-one {
 top: 13%;
 right: 25%;
 z-index: 2;
 animation: 4s linear infinite float-bob-y
}
.slide-img.img-two {
 right: 6%;
 top: 34%;
 z-index: 4
}
.slide-img.img-three {
 right: 4.5%;
 top: -2%;
 z-index: 1
}
.bs-2::before {
 background-image: url(../images/a7/red-line-1.svg);
 height: 100%;
 left: 0;
 top: 31px;
 background-repeat: no-repeat
}
.slider-style-3::before {
 content: '';
 position: absolute;
 background: url(../images/a7/home3-slider-shape1.png) no-repeat;
 left: 0;
 top: 17%;
 bottom: 0;
 width: 198px;
 height: 100%;
 z-index: 1
}
.main-slider3 .img-one {
 top: -9%;
 right: 4%;
 z-index: 2;
 animation: 5s linear infinite float-bob-y
}
@media only screen and (min-width:1601px) and (max-width:1800px) {
 .page-title-area2 .page-title-img-wrapper .breadcrumb-img {
  margin-right: 0;
  max-width: 100%
 }
 .slide-img.img-two {
  right: 2%
 }
 .main-slider3 .img-one {
  right: 0
 }
}
@media only screen and (min-width:1200px) and (max-width:1600px) {
 .page-title-area2 .page-title-img-wrapper .breadcrumb-img {
  margin-right: 0;
  max-width: 100%
 }
 .transport.img-two {
  max-width: 18%
 }
 .transport.img-three {
  max-width: 7%
 }
 .transport.img-four {
  max-width: 13%
 }
 .main-title {
  font-size: 72px
 }
 .slide-img.img-one {
  top: 13%;
  right: 17%;
  width: 3%
 }
 .slide-img.img-two {
  width: 22%
 }
 .slide-img.img-three {
  right: 1.5%;
  top: -5%
 }
 .bs-2::before, .slider-style-3::before {
  display: none
 }
 .main-slider3 .img-one {
  width: 29%
 }
}
.main-slider3 .slider-video {
 right: 100px;
 bottom: -197px
}
.main-slider3 .slider__content h3 {
 padding-left: 10px;
 padding-right: 10px
}
.main-slider3 .slider__content h3.bg-shape::before {
 height: 100%;
 top: 1px
}
.slider-shape3.shape_01 {
 left: 0;
 right: 0;
 text-align: center;
 margin: 0 auto;
 top: 22%
}
.slider-shape3.shape_02 {
 left: 11%;
 top: 20%
}
.slider-shape3.shape_03 {
 right: 50.78%;
 bottom: 3%
}
.chose-shape.cshape-4, .slider-shape3.shape_04 {
 right: 0;
 bottom: 0
}
.round-background {
 border-radius: 0 0 68% 68%;
 position: relative;
 z-index: 1
}
.service-shape.service-1 {
 left: 13.22%;
 top: 28%;
 animation: 7s linear infinite rotation
}
.service-shape.service-2 {
 right: 15.41%;
 top: 18%;
 animation: 4s linear infinite rotateIn
}
.c-services {
 border-radius: 5px;
 padding: 50px 50px 57px;
 -webkit-transition: .5s;
 -moz-transition: .5s;
 -ms-transition: .5s;
 -o-transition: .5s;
 transition: .5s
}
.c-service2, .c-services__icon {
 -webkit-transition: .3s;
 -moz-transition: .3s;
 -ms-transition: .3s;
 -o-transition: .3s
}
.c-services__icon {
 width: 124px;
 height: 124px;
 background: rgba(206, 239, 255, 0);
 border: 1px solid transparent;
 border-radius: 50%;
 text-align: center;
 line-height: 124px;
 margin: 0 auto 35px;
 position: relative;
 transition: .3s
}
.c-services__icon img {
 width: 78px;
 height: 78px
}
.c-services .service-title {
 font-size: 30px;
 font-weight: 600
}
.c-services p {
 color: rgba(24, 21, 44, .8);
 font-size: 18px
}
.c-services a {
 color: var( --black);
 font-size: 16px;
 font-weight: 500;
 opacity: 0;
 visibility: hidden;
 transform: translateY(-20px);
 -webkit-transition: .5s;
 -moz-transition: .5s;
 -ms-transition: .5s;
 -o-transition: .5s;
 transition: .5s
}
.c-services a img {
 margin-left: 6px;
 width: 20px;
 height: 10px
}
.c-services.active, .c-services:hover {
 border-radius: 5px;
 background: var( --white);
 box-shadow: 0 0 26px rgba(215, 212, 212, .35);
 transform: translateY(-25px)
}
.c-services.active .c-services__icon, .c-services:hover .c-services__icon {
 border-color: color-mix(in srgb, var(--primary), transparent 90%)
}
.c-services.active a, .c-services:hover a {
 opacity: 1;
 visibility: visible;
 transform: translateY(0)
}
.feature-active.owl-carousel .owl-item img {
 display: inline-block !important;
 width: unset !important
}
.manage-shape.manage-1 {
 left: 120px;
 top: 27%;
 animation: 4s infinite alternate-reverse float-bob-y
}
.manage-shape.manage-2 {
 left: 237px;
 bottom: 120px;
 animation: 5s linear infinite rotation
}
.manage-shape.manage-3 {
 right: 0;
 z-index: -1;
 top: 0;
 animation: 4s infinite alternate float-bob-y
}
.management-title h2 {
 margin-bottom: 35px;
 padding-right: 120px
}
@media only screen and (min-width:992px) and (max-width:1200px) {
 .page-shape.shape_06 {
  right: 14%;
  top: 36%
 }
 .page-shape.shape_07, .page-shape.shape_09 {
  width: 16%
 }
 .page-title-area2 .page-title-img-wrapper .breadcrumb-img {
  margin-right: 0;
  max-width: 100%
 }
 .transport.img-one {
  max-width: 33%
 }
 .transport.img-two {
  max-width: 18%
 }
 .transport.img-three {
  max-width: 7%
 }
 .transport.img-four {
  max-width: 13%
 }
 .main-title {
  font-size: 62px
 }
 .slide-img.img-one {
  top: 13%;
  right: 17%;
  width: 3%
 }
 .slide-img.img-two {
  width: 22%
 }
 .bs-2::before, .slider-style-3::before {
  display: none
 }
 .main-slider3 .img-one {
  width: 35%
 }
 .main-slider3 .slider-video {
  bottom: -140px
 }
 .c-services {
  padding: 50px 20px 57px
 }
 .management-title, .management-title h2 {
  padding-right: 0
 }
 .services-wrapper .section-title, .trusted-area {
  padding-left: 0
 }
}
.row-count-content {
 display: grid;
 grid-template-columns: repeat(1, 1fr)
}
@media only screen and (min-width:768px) and (max-width:991px) {
 .page-title-area2 .page-title-img-wrapper .breadcrumb-img {
  margin-right: 0;
  max-width: 100%
 }
 .transport.img-one {
  max-width: 20%
 }
 .main-title {
  font-size: 48px
 }
 .bs-2::before, .slider-style-3::before {
  display: none
 }
 .main-slider3 .img-one {
  top: 0;
  right: 4%;
  width: 42%
 }
 .main-slider3 .slider-video {
  display: none !important
 }
 .round-background {
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0
 }
 .c-services {
  padding: 50px 20px 57px
 }
 .management-title {
  padding-right: 0;
  margin-bottom: 30px
 }
 .management-title h2 {
  padding-right: 0
 }
 .trusted-area {
  padding-left: 0
 }
 .row-count-content {
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 32px
 }
}
@media (max-width:767px) {
 .page-title-area2 .page-title-img-wrapper .breadcrumb-img {
  margin-right: 0;
  margin-top: 50px;
  max-width: 100%
 }
 .page-title-3 .page-title-wrapper .fs-20 {
  font-size: 16px;
  line-height: 1.3
 }
 .slide-bar {
  width: 310px;
  padding: 25px 20px
 }
 .transport.img-one {
  max-width: 40%
 }
 .slider-video {
  right: 0;
  bottom: -167px;
  z-index: 2;
  left: 0;
  margin: 0 auto
 }
 .styled-text {
  font-size: 20px
 }
 .main-title {
  font-size: 36px
 }
 .slider__content h5 {
  padding-right: 0;
  font-size: 16px;
  line-height: 1.6;
  margin-bottom: 40px
 }
 .main-slider-1 .slider-video {
  right: auto;
  left: 15px
 }
 .main-slider-1 .slider-video h2 {
  font-size: 30px
 }
 .bs-2::before, .main-slider3 .img-one, .slider-style-3::before {
  display: none
 }
 .main-slider3 .slider-video {
  display: none !important
 }
 .round-background {
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0
 }
 .c-services {
  padding: 40px 15px 57px 5px
 }
 .c-services .service-title {
  font-size: 26px
 }
 .management-title {
  padding-right: 0;
  margin-bottom: 30px
 }
 .management-title h2 {
  padding-right: 0
 }
 .trusted-area {
  padding-left: 15px
 }
 .row-count-content {
  grid-template-columns: repeat(1, 1fr)
 }
 .cb-3 {
  margin-top: 0
 }
}
.shipment-time, .single-box-list2, .text-list-box {
 grid-template-columns: repeat(2, 1fr)
}
.counter-box {
 padding: 35px 28px 25px;
 margin-bottom: 30px
}
.counter-box h2 {
 font-size: 50px;
 margin-bottom: 15px
}
.counter-box h3 {
 font-weight: 600;
 margin-bottom: 14px
}
.cb-1 {
 background-color: color-mix(in srgb, var(--primary), transparent 90%)
}
.cb-3 {
 background-color: color-mix(in srgb, var(--secondary), transparent 70%)
}
.c-service2, .c-services-box:hover {
 background: var( --white);
 box-shadow: 0 0 26px rgba(215, 212, 212, .35)
}
.profit-shape.pashape-1 {
 right: 16%;
 bottom: 16%
}
.profit-shape.pashape-2 {
 animation: 5s linear infinite float-bob-y;
 right: 9%;
 bottom: 9%
}
.profit-shape.pashape-3 {
 right: 4%;
 bottom: 7%
}
.profit-shape.pashape-4 {
 right: 0;
 bottom: 24%
}
.services-selers-img {
 position: absolute;
 left: 0;
 top: 0;
 z-index: 2;
 width: 48%;
 height: 685px
}
.services-selers-img .pashape-5 {
 position: absolute;
 right: -22px;
 bottom: -12px;
 z-index: -1;
 animation: 5s linear infinite rotation
}
.services-selers-img .pashape-6 {
 position: absolute;
 right: -66px;
 bottom: -30px;
 z-index: -1;
 animation: 3s linear infinite float-bob-y
}
.service-shape2.service-1 {
 right: 5%;
 top: 34%;
 z-index: -1
}
.c-service2 {
 padding: 50px 35px 0;
 transition: .3s
}
.c-service2 .c-services__icon {
 width: 78px;
 height: 78px;
 border: 0;
 position: relative;
 z-index: 1
}
.c-service2 .c-services__icon::before {
 content: '';
 position: absolute;
 background-color: var( --light-grey);
 width: 90px;
 height: 90px;
 border-radius: 50%;
 left: -5px;
 top: 15px;
 z-index: -1;
 -webkit-transition: .3s;
 -moz-transition: .3s;
 -ms-transition: .3s;
 -o-transition: .3s;
 transition: .3s
}
.c-service2.active {
 border-color: var( --dark-navy-blue);
 padding-bottom: 57px
}
.c-service2:hover .c-services__icon {
 border: 0
}
.c-service2:hover .c-services__icon::before {
 transform: scale(1.3)
}
.c-services-box {
 padding-bottom: 28px;
 border: 2px solid transparent;
 -webkit-transition: .2s;
 -moz-transition: .2s;
 -ms-transition: .2s;
 -o-transition: .2s;
 transition: .2s;
 margin-bottom: 30px
}
.plus-icon, .single-case__thumb img {
 -webkit-transition: .3s;
 -moz-transition: .3s;
 -ms-transition: .3s;
 -o-transition: .3s
}
.c-services-box:hover {
 border-color: var( --dark-navy-blue)
}
.c-services-box:hover .c-service2 {
 box-shadow: none
}
.service-shape-v2.service-1 {
 right: 9.89%;
 top: 42%;
 animation: 5s linear infinite float-bob-y
}
.service-shape-v2.service-2 {
 right: 92px;
 top: -98px;
 z-index: 2
}
.value-shape.vshape-1 {
 top: 12%;
 right: 8.75%;
 animation: 4s linear infinite float-bob-y;
 -webkit-animation: 4s linear infinite float-bob-y
}
.value-shape.vshape-2 {
 top: 24%;
 left: 6.19%;
 animation: 3s linear infinite float-bob-y;
 -webkit-animation: 3s linear infinite float-bob-y
}
.value-added-content {
 padding-right: 60px;
 padding-left: 28px
}
.text-list, .value-added-content .section-title {
 padding-right: 100px
}
@media only screen and (min-width:768px) and (max-width:991px) {
 .counter-box {
  padding: 35px 15px 25px
 }
 .cb-3 {
  margin-top: 0
 }
 .services-wrapper .section-title {
  padding-left: 0
 }
 .services-selers-img {
  position: relative;
  width: 100%;
  height: 500px;
  margin-bottom: 150px
 }
 .value-added-content {
  padding-right: 0;
  padding-left: 0
 }
 .shipment-time-content, .value-added-content .section-title {
  padding-right: 0
 }
}
.added-list li {
 color: rgba(24, 21, 44, .9);
 font-size: 16px;
 padding-left: 22px;
 margin-bottom: 9px;
 position: relative;
 z-index: 1
}
.added-list li::before {
 content: '\f00c';
 position: absolute;
 font-family: "Font Awesome 5 pro";
 font-size: 16px;
 left: 0;
 top: 0;
 z-index: 1
}
.text-list-box {
 display: grid;
 grid-gap: 0px
}
@media (max-width:767px) {
 .services-wrapper .section-title {
  padding-left: 0
 }
 .services-selers-img {
  position: relative;
  width: 100%;
  height: auto;
  margin-bottom: 100px
 }
 .value-added-content {
  padding-right: 0;
  padding-left: 0
 }
 .value-added-content .section-title {
  padding-right: 0
 }
 .text-list-box {
  display: block
 }
}
.shipment-time {
 display: grid;
 grid-gap: 30px
}
@media (max-width:767px) {
 .shipment-time {
  display: block
 }
}
.shipment-time .box-one {
 background-color: color-mix(in srgb, var(--primary), transparent 90%);
 border-radius: 5px;
 padding: 35px 30px 40px 32px
}
.shipment-time .box-2, .single-work__icon {
 background-color: color-mix(in srgb, var(--secondary), transparent 70%)
}
.shipment-time .box-one .box-title {
 font-size: 50px
}
.shape-style::after, .shape-style::before {
 width: 503px;
 height: 212px;
 background: color-mix(in srgb, var(--primary), transparent 90%);
 z-index: 1;
 content: '';
 position: absolute
}
.air-shape.shape_01 {
 left: 120px;
 top: 22%;
 animation: 5s linear infinite rotation
}
.air-shape.shape_02 {
 right: -16px;
 top: -20px;
 transform: rotate(40deg)
}
.shape-style::before {
 left: 160px;
 top: 137px
}
.shape-style::after {
 right: 15.83%;
 top: 14%
}
.chose-img-wrapper .big-img {
 margin-left: -188px
}
.chose-shape.cshape-1 {
 top: 38px;
 left: -57%
}
.chose-shape.cshape-2 {
 right: -107px;
 bottom: -155px;
 z-index: -1
}
.chose-shape.cshape-3 {
 right: 14.42%;
 top: 29%;
 animation: 4s linear infinite float-bob-y;
 z-index: 2
}
.chose-shape.cshape-5 {
 left: -54px;
 bottom: 0
}
.chose-box {
 padding: 0;
 overflow: hidden
}
.chose-box p {
 margin-top: 18px;
}
.single-box-list {
 padding: 0 45px 0 0;
 float: left
}
.single-box-list li:nth-child(2) {
 border-top: 1px solid var( --light-dove-grey);
 border-bottom: 1px solid var( --light-dove-grey)
}
.single-box h4 {
 font-size: 26px;
 margin-bottom: 0
}
.comic-progress-bar .p-title {
 font-size: 20px;
 font-family: Poppins, sans-serif;
 font-weight: 400;
 margin-bottom: 18px
}
.comic-progress-bar .progress {
 height: 19px;
 background-color: transparent;
 border-radius: 0;
 border: 1px solid var( --mid-light-grey);
 overflow: visible;
 width: 100%
}
.comic-progress-bar .progress .progress-bar {
 color: rgba(24, 21, 44, .9);
 font-size: 16px;
 font-family: Poppins, sans-serif;
 font-weight: 400;
 background-color: var( --primary);
 width: 90%;
 height: 9px;
 margin-top: 4px;
 margin-left: 6px;
 overflow: visible
}
.comic-progress-bar .progress .progress-bar span {
 text-align: right;
 margin-top: -75px
}
.comic-progress-bar .progress .bar-3 {
 background-color: var( --primary)
}
.logistics-shape.shape_01 {
 left: 126px;
 top: 401px;
 animation: 10s linear infinite animationFramesTwo;
 -webkit-animation: 10s linear infinite animationFramesTwo
}
.best-img-box .counter-box {
 position: absolute;
 bottom: 0;
 z-index: 3;
 background-color: var( --white);
 text-align: start;
 width: 240px;
 height: 198px;
 border-radius: 5px;
 box-shadow: 0 15px 38px rgba(197, 198, 208, .35)
}
.best-img-box .cb-1a {
 top: 190px;
 left: 118px
}
.best-img-box .cb-2 {
 right: -60px;
 left: auto;
 bottom: 0
}
.best-shape.best-1 {
 top: -29px;
 left: 48px
}
.best-shape.best-2 {
 right: -40px;
 top: -33px
}
.work-shape.pshape-1 {
 right: 11%;
 top: 26%;
 animation: 5s linear infinite float-bob-y
}
.work-shape.pshape-2 {
 left: 7.5%;
 top: 28%;
 animation: 5s linear infinite float-bob-y
}
.work-shape.pshape-3 {
 left: 12.39%;
 bottom: 12%;
 animation: 3s linear infinite scale-up-one
}
.work-shape.pshape-4 {
 right: 8%;
 bottom: 16%;
 animation: 5s infinite alternate-reverse rotation
}
.logistics-box, .work-shape-h3.pshape-1 {
 animation: 5s linear infinite float-bob-y
}
.single-work {
 text-align: center;
 position: relative;
 z-index: 1
}
.single-work__icon {
 display: inline-block;
 width: 120px;
 height: 120px;
 border-radius: 50%;
 line-height: 120px;
 position: relative;
 z-index: 2
}
.plus-icon, .pr-manager {
 width: 62px;
 height: 62px;
 border-radius: 50%
}
.single-work .semi-title {
 color: var( --charcoal-black)
}
.sw-2::before {
 content: '';
 position: absolute;
 background: url(../images/a7/dot-line.svg) no-repeat;
 width: 100%;
 height: 81px;
 left: -151px;
 top: -67px;
 z-index: -1;
 transform: rotate(5deg)
}
.sw-2 .single-work__icon {
 background-color: color-mix(in srgb, var(--primary), transparent 90%)
}
.sw-3::after, .sw-3::before {
 background: url(../images/a7/dot-line.svg) no-repeat;
 width: 100%;
 height: 81px;
 z-index: -1;
 content: '';
 position: absolute
}
.sw-3::before {
 left: -151px;
 top: -68px;
 transform: rotate(6deg)
}
.sw-3::after {
 right: -151px;
 top: -58px
}
.gf_btn, .plus-icon, .single-case__content .plus-icon {
 display: inline-block
}
.sw-3 .single-work__icon {
 background-color: color-mix(in srgb, var(--primary), transparent 90%)
}
.sw-4 .single-work__icon {
 background-color: color-mix(in srgb, var(--secondary), transparent 70%)
}
.section-title2 h2 .w-round-shape::before {
 background-image: url(../images/a7/red-line-4.svg) no-repeat !important
}
.work-shape-h3.pshape-1 {
 right: 6%;
 top: 25%
}
.work-shape.case-1a {
 left: 5%;
 top: 18%
}
.case-studies, .footer-area {
 z-index: 2
}
.case-shape.cashape-1 {
 left: 5.1%;
 top: 23%;
 animation: 10s linear infinite animationFramesTwo
}
.case-shape.cashape-2 {
 left: 7.5%;
 bottom: 8%;
 animation: 4s linear infinite float-bob-y;
 z-index: -1
}
.case-shape.cashape-3 {
 right: 0;
 bottom: 1%;
 z-index: -1;
 animation: 5s linear infinite float-bob-y
}
.case-shape.cashape-4 {
 right: 7%;
 bottom: 9%;
 animation: 10s linear infinite rotation
}
.section-title .theme-bg-color2 {
 padding: 21px 33px
}
.plus-icon {
 background: var( --dark-navy-blue);
 text-align: center;
 line-height: 62px;
 position: absolute;
 z-index: 1;
 left: 0;
 right: 0;
 margin: 0 auto;
 bottom: -31px;
 transition: .3s
}
.plus-icon img {
 display: inline-block !important;
 max-width: 100% !important;
 width: 25px;
 height: 26px
}
.plus-icon:hover img {
 width: 25px !important;
 height: 26px;
 transform: rotate(90deg)
}
.case-title {
 font-size: 36px
}
.case-feedback {
 padding-left: 115px
}
.case-feedback p {
 font-size: 20px;
 line-height: 1.8
}
.authors-designation h5 {
 font-size: 20px;
 font-weight: 500;
 font-family: Poppins, sans-serif
}
.authors-designation h6 {
 color: var( --charcoal-black);
 font-weight: 400;
 font-family: Poppins, sans-serif
}
.blog-quote p, .gf_btn {
 font-family: "Saira Extra Condensed", sans-serif
}
.authors-designation .signature {
 position: absolute;
 z-index: 1;
 left: 53%;
 top: -10px
}
.single-case__thumb img {
 display: block;
 transition: .3s
}
.single-case__content, .team-content {
 -webkit-transition: .3s;
 -moz-transition: .3s;
 -ms-transition: .3s;
 -o-transition: .3s
}
.single-case__content {
 position: relative;
 background-color: var( --white);
 padding: 70px 50px 70px 37px;
 transition: .3s
}
.gf_btn, .project-manager .section-title {
 font-size: 24px
}
.single-case__content .plus-icon img {
 display: inline-block;
 max-width: 100%
}
.comic-blogs-wrapper:hover .comic-blogs-thumb img, .single-case:hover .single-case__thumb img, .team-wrapper:hover .team-thumb img {
 transform: scale(1.1)
}
.single-case:hover .single-case__content {
 box-shadow: 0 35px 25px rgba(219, 223, 224, .35)
}
.case-style-2 {
 padding-right: 175px;
 padding-left: 175px
}
.case-style-2 .single-case .single-case__content {
 padding: 70px 40px 70px 37px
}
@media only screen and (min-width:1601px) and (max-width:1800px) {
 .case-style-2 {
  padding-left: 15px;
  padding-right: 15px
 }
 .case-style-2 .single-case .single-case__content {
  padding: 70px 15px
 }
}
@media only screen and (min-width:1601px) and (max-width:1900px) {
 .services-selers-img {
  top: 95px
 }
 .case-style-2 .single-case .single-case__content .case-title {
  font-size: 28px
 }
}
.case-shape.c2ashape-1 {
 left: 180px;
 top: 232px;
 animation: 10s linear infinite animationFramesTwo
}
.case-shape.c2ashape-2 {
 right: 10%;
 top: 15%;
 animation: 5s infinite alternate-reverse rotation
}
.case-shape.c2ashape-3 {
 right: 70px;
 top: 69%;
 animation: 5s infinite alternate-reverse float-bob-y
}
.offer-bg {
 background-color: color-mix(in srgb, var(--primary), transparent 90%);
 padding: 35px 40px 10px 55px;
 position: relative
}
.offer-bg .more_case {
 padding: 22px 30px
}
.offer-shape.offer-one {
 left: 15px;
 top: 25px;
 animation: 5s linear infinite rotation
}
.offer-shape.offer-two {
 right: 14%;
 top: 20px
}
.offer-shape.offer-three {
 right: 28%;
 bottom: 20px;
 animation: 4s linear infinite rotation;
 -webkit-animation: 4s linear infinite rotation
}
.case-shape.case-one-a {
 left: 143px;
 top: 64%
}
.case-shape.case-one-b {
 right: 0;
 z-index: -1;
 top: 26%
}
.case-mesonry {
 border: 1px solid transparent;
 background-color: var( --white);
 box-shadow: 0 0 49px 0 rgba(200, 198, 198, .35)
}
.case-mesonry .plus-icon {
 left: 40px;
 top: -34px;
 margin: 0;
 background-color: var( --white);
 border: 1px solid #f0f0f0
}
.case-mesonry .plus-icon img {
 filter: brightness(0) invert(0)
}
.case-mesonry .single-case__content {
 padding: 60px 50px 11px 37px;
 border: 1px solid transparent;
 border-top: 0
}
@media only screen and (min-width:1200px) and (max-width:1600px) {
 .services-selers-img {
  top: 210px
 }
 .service-shape-v2.service-2 {
  top: -178px
 }
 .single-box-list {
  padding-right: 10px
 }
 .best-img-box .cb-2 {
  right: 0;
  bottom: -40px
 }
 .work-shape.pshape-2 {
  display: none
 }
 .case-feedback {
  padding-left: 0
 }
 .single-case__content {
  padding: 70px 30px
 }
 .case-style-2 {
  padding-left: 15px;
  padding-right: 15px
 }
 .case-style-2 .single-case .single-case__content {
  padding: 30px 15px
 }
 .case-style-2 .single-case .single-case__content .case-title {
  font-size: 28px
 }
 .case-mesonry .single-case__content {
  padding: 60px 15px 11px
 }
}
.case-mesonry:hover {
 box-shadow: 15.556px 15.556px 35px 0 rgba(192, 192, 192, .35)
}
.case-mesonry:hover .plus-icon {
 background-color: var( --primary);
 border-color: var( --primary)
}
.case-mesonry:hover .plus-icon img {
 filter: brightness(0) invert(1)
}
.case-mesonry:hover .single-case__content {
 border-color: var( --dark-navy-blue);
 border-top: 0
}
.case-mesonry:hover .case-title a {
 color: var( --dark-navy-blue);
 text-decoration: underline
}
.gf_btn {
 border: 0;
 background: 0 0;
 color: var( --dark-navy-blue);
 font-weight: 500;
 line-height: 1;
 margin: 5px 10px;
 padding: 0
}
.case-single-content, .text-list li {
 padding-left: 30px
}
.case-shape.case-two-a {
 left: 142px;
 top: 79.5%;
 animation: 5s linear infinite float-bob-y
}
.case-shape.case-two-b {
 right: -98px;
 top: 51%;
 z-index: -1
}
.case-single-content .assistant-accesories {
 grid-template-columns: repeat(3, 1fr);
 grid-gap: 60px
}
@media only screen and (min-width:992px) and (max-width:1200px) {
 .services-selers-img {
  top: 200px
 }
 .value-added-content {
  padding-right: 0;
  padding-left: 0
 }
 .chose-wrapper .section-title, .shipment-time-content, .value-added-content .section-title {
  padding-right: 0
 }
 .added-list li {
  font-size: 14px
 }
 .case-feedback, .case-single-content, .shipment-content-img {
  padding-left: 0
 }
 .shape-style::after, .shape-style::before, .sw-2::before, .sw-3::after, .sw-3::before, .work-shape.pshape-2 {
  display: none
 }
 .why-chose-us-bg .chose-wrapper {
  background-color: transparent
 }
 .chose-img-wrapper .big-img {
  max-width: 100%;
  height: auto;
  margin-left: 0;
  margin-top: 130px
 }
 .chose-wrapper {
  padding-right: 15px;
  padding-left: 15px
 }
 .single-box-list {
  padding-right: 10px
 }
 .single-box h4 {
  font-size: 18px
 }
 .best-img-box .best-img {
  width: 100%
 }
 .single-case__content {
  padding: 40px 15px 70px 20px
 }
 .single-case__content .case-title {
  font-size: 28px
 }
 .case-style-2 {
  padding-left: 15px;
  padding-right: 15px
 }
 .case-style-2 .single-case .single-case__content {
  padding: 30px 15px
 }
 .case-mesonry .single-case__content {
  padding: 60px 15px 11px
 }
 .case-single-content .assistant-accesories {
  grid-gap: 15px
 }
}
@media only screen and (min-width:768px) and (max-width:991px) {
 .case-feedback, .case-single-content, .shipment-content-img {
  padding-left: 0
 }
 .shape-style::after, .shape-style::before, .sw-2::before, .sw-3::after, .sw-3::before, .work-shape.pshape-2 {
  display: none
 }
 .why-chose-us-bg {
  padding-bottom: 0
 }
 .why-chose-us-bg .chose-wrapper {
  background-color: transparent;
  padding-top: 60px
 }
 .chose-img-wrapper .big-img {
  max-width: 100%;
  margin-left: 0
 }
 .chose-wrapper {
  padding-right: 15px;
  padding-left: 15px
 }
 .chose-wrapper .section-title {
  padding-right: 0
 }
 .why-chose-wrapper .section-title2 {
  margin-bottom: 25px
 }
 .comic-progress-bar {
  margin-bottom: 15px
 }
 .best-img-box .best-img {
  width: 100%
 }
 .single-work .semi-title {
  font-size: 18px
 }
 .case-title {
  font-size: 22px
 }
 .single-case__content {
  padding: 40px 15px 70px 20px
 }
 .case-style-2 {
  padding-left: 15px;
  padding-right: 15px
 }
 .case-style-2 .single-case .single-case__content {
  padding: 30px 15px
 }
 .case-mesonry .single-case__content {
  padding: 60px 15px 11px
 }
 .case-single-content .assistant-accesories {
  grid-gap: 15px
 }
}
@media (max-width:767px) {
 .shipment-time .box-one .box-title {
  font-size: 26px
 }
 .chose-wrapper .section-title, .shipment-time-content {
  padding-right: 0
 }
 .case-feedback, .case-single-content, .shipment-content-img {
  padding-left: 0
 }
 .shape-style::after, .shape-style::before, .sw-2::before, .sw-3::after, .sw-3::before, .work-shape.pshape-2 {
  display: none
 }
 .why-chose-us-bg {
  padding-bottom: 0
 }
 .why-chose-us-bg .chose-wrapper {
  background-color: transparent;
  padding-top: 60px
 }
 .chose-img-wrapper .big-img {
  max-width: 100%;
  margin-left: 0
 }
 .chose-wrapper {
  padding-right: 0;
  padding-left: 0
 }
 .chose-box p {
  width: 100%;
 }
 .single-box-list {
  padding: 0;
  margin: 0;
  list-style: none;
  width: 100%;
  float: none
 }
 .best-img-box .best-img {
  width: 100%
 }
 .best-img-box .cb-1a {
  left: 0;
  right: 0;
  text-align: center;
  margin: 0 auto
 }
 .case-title {
  font-size: 22px
 }
 .single-case__content {
  padding: 40px 15px 70px
 }
 .offer-bg .propose-offer h2, .single-case__content .case-title {
  font-size: 26px
 }
 .case-style-2 {
  padding-left: 0;
  padding-right: 0
 }
 .case-style-2 .single-case .single-case__content {
  padding: 30px 15px
 }
 .offer-bg {
  padding: 35px 15px 10px
 }
 .case-mesonry .single-case__content {
  padding: 60px 15px 11px
 }
 .case-single-content .assistant-accesories {
  display: block;
  grid-gap: 15px
 }
}
.case-single-content .assistant-accesories .box-one {
 padding: 35px 22px 40px 25px
}
.case-single-content .assistant-accesories .box-3 {
 background-color: color-mix(in srgb, var(--secondary), transparent 70%)
}
.case-single-title {
 font-size: 65px
}
@media only screen and (min-width:992px) and (max-width:1200px) {
 .case-single-content .assistant-accesories .box-one {
  padding: 35px 15px 40px
 }
 .case-single-title {
  font-size: 46px
 }
}
@media only screen and (min-width:768px) and (max-width:991px) {
 .case-single-title {
  font-size: 36px
 }
}
.project-manager .social-links a:nth-child(2) {
 background-color: var( --secondary)
}
.project-manager .social-links a:last-child {
 background-color: var( --secondary)
}
.project-manager .social-links a:hover {
 background-color: var( --dark-navy-blue)
}
.shipping-shape.sshape-3-case-2 {
 right: 6%;
 top: 10px;
 animation: 5s linear infinite rotation
}
.pr-manager {
 -webkit-border-radius: 50%;
 -moz-border-radius: 50%;
 -ms-border-radius: 50%;
 -o-border-radius: 50%
}
@media (max-width:767px) {
 .case-single-content .assistant-accesories .box-one {
  padding: 35px 10px 40px
 }
 .case-single-content .assistant-accesories .box-one h3 {
  font-size: 22px
 }
 .case-single-title {
  font-size: 26px
 }
 .pr-manager {
  margin-bottom: 15px
 }
}
.case-single-shape.cshape-1 {
 right: 0;
 z-index: -1;
 top: 37.5%;
 animation: 3s linear infinite float-bob-y;
 -webkit-animation: 3s linear infinite float-bob-y
}
.test-shape.tshape-1, .test-shape.tshape-2, .test-shape.tshape-3, .test-shape.tshape-4 {
 animation: 5s linear infinite float-bob-y
}
.testimonial-wrapper {
 padding: 65px 30px 45px
}
.testimonial-active.owl-carousel .owl-item img, .testimonial-wrapper2 img {
 display: inline-block !important;
 max-width: 100% !important
}
.author-img1 {
 width: 81px;
 height: 81px;
 border-radius: 50%;
 float: left;
 margin-right: 10px;
 display: inline-block
}
.authors-name {
 margin-top: 12px
}
.authors-name .sect-title {
 color: var( --dark-navy-blue);
 font-weight: 600;
 margin-bottom: 0
}
.test-shape.tshape-1 {
 top: 23%;
 left: 7.5%
}
.test-shape.tshape-2 {
 top: 30%;
 left: 7.7%
}
.test-shape.tshape-3 {
 right: 7.5%;
 top: 18%
}
.test-shape.tshape-4 {
 bottom: 9%;
 right: 7.5%;
 width: 52px;
 height: 52px;
 transform: rotate(78deg)
}
.nav-style-1 .owl-dots {
 position: absolute;
 z-index: 11;
 left: 0;
 right: 0;
 text-align: center;
 bottom: -80px
}
.nav-style-1 .owl-dots .owl-dot {
 background-color: var( --light-grey) !important;
 width: 18px;
 height: 5px;
 border-radius: 2.5px;
 display: inline-block;
 margin: 0 5px
}
.bg-primary, .nav-style-1 .owl-dots .owl-dot.active {
 background-color: var( --primary) !important
}
.testimonial-style::before {
 content: '';
 position: absolute;
 background-color: var( --light-grey);
 left: 376px;
 top: 140px;
 width: 363px;
 height: 440px;
 z-index: 1
}
.footer__widget, .testimonial-wrapper2 {
 position: relative;
 z-index: 3
}
.testimonial-wrapper2 .author-img {
 width: 81px;
 height: 81px
}
.testimonial-wrapper2 .testimonial-text {
 font-size: 32px;
 line-height: 1.4
}
.copic-team-wrapper .section-title {
 padding-right: 40px;
 padding-left: 40px
}
.social-links a {
 color: var( --white);
 font-size: 16px;
 background-color: var( --primary);
 width: 48px;
 height: 48px;
 border-radius: 50%;
 display: inline-block;
 line-height: 48px;
 text-align: center;
 margin: 0 3px
}
.team-content {
 background: linear-gradient(rgba(4, 27, 32, 0) 0, #0d0d0d 100%);
 background: -webkit-linear-gradient(rgba(4, 27, 32, 0) 0, #0d0d0d 100%);
 background: -moz-linear-gradient(rgba(4, 27, 32, 0) 0, #0d0d0d 100%);
 background: -o-linear-gradient(rgba(4, 27, 32, 0) 0, #0d0d0d 100%);
 position: absolute;
 left: 0;
 right: 0;
 text-align: center;
 bottom: -110%;
 padding: 25px 0;
 z-index: 1;
 transition: .3s
}
.team-content .sect-title {
 color: var( --white);
 font-weight: 500;
 margin-bottom: 0
}
.team-wrapper .social-links a:hover {
 color: var( --primary);
 background-color: var( --white)
}
.team-wrapper:hover .team-content {
 bottom: 0
}
.team-shape.tmshape-1 {
 left: 6%;
 bottom: 18%;
 animation: 3s infinite alternate rotation
}
.team-shape.tmshape-2, .team-shape.tmshape-3a {
 animation: 5s infinite alternate-reverse float-bob-y
}
.team-shape.tmshape-2 {
 right: 6%;
 bottom: 7.5%;
 z-index: -1
}
.team-shape.tmshape-3a {
 left: 146px;
 top: 200px
}
.copic-team-wrapper .bs-2::before {
 background-image: url(../images/a7/red-line-5.svg);
 left: 8px;
 top: 17px
}
.team-shape2.tmshape-1 {
 left: 108px;
 top: 39%;
 animation: 7s infinite alternate float-bob-y
}
.team-shape2.tmshape-2 {
 right: 130px;
 top: 113px;
 animation: 3s infinite alternate float-bob-y;
 z-index: -1
}
.blog-shape.bshape-1 {
 right: 6%;
 top: 5%;
 animation: 7s linear infinite rotation
}
.blog-shape.bshape-2 {
 left: 5.7%;
 top: 1%;
 animation: 5s linear infinite float-bob-y
}
.blog-shape.bshape-3 {
 bottom: 16%;
 left: 5.7%;
 animation: 7s linear infinite float-bob-y
}
.meta-btn {
 color: var( --white);
 background-color: var( --primary);
 border-radius: 3px;
 display: inline-block;
 line-height: 1;
 padding: 7px 12px
}
.blog-title {
 font-weight: 600;
 line-height: 1.4
}
.blogs-content {
 padding: 30px 20px 20px;
 -webkit-transition: .3s;
 -moz-transition: .3s;
 -ms-transition: .3s;
 -o-transition: .3s;
 transition: .3s
}
.comic-blogs-wrapper:hover .blogs-content {
 background: var( --white);
 box-shadow: 0 9px 24px rgba(213, 213, 213, .35)
}
.blog-gd-shape.bshape-3 {
 top: 45%;
 left: 10.3%;
 animation: 7s linear infinite float-bob-y
}
.page-shape-02.shape_08 {
 right: 80px;
 bottom: -40px
}
.blog-list-content {
 padding-right: 35px
}
.blog-single .blog-title {
 font-size: 43px;
 line-height: 1.3;
 font-weight: 700
}
.blog-single .more-btn {
 color: var( --dark-navy-blue);
 font-weight: 500
}
.blog-single .blog-single-content {
 padding-right: 50px
}
@media only screen and (min-width:992px) and (max-width:1200px) {
 .testimonial-wrapper {
  padding: 65px 20px 45px
 }
 .testimonial-style::before {
  left: 0;
  top: 80px
 }
 .blog-list-content, .blog-single .blog-single-content {
  padding-right: 0
 }
 .blog-single .blog-title {
  font-size: 36px
 }
}
.page-title-blog-single .page-shape.shape_05 {
 left: 10%;
 top: 80%
}
.page-title-blog-single .page-shape.shape_06 {
 right: 10.76%;
 top: 234px
}
.page-title-blog-single .page-shape.shape_09 {
 right: 8%;
 top: 34%
}
.page-title-blog-single .page-title-wrapper .blog-author-img {
 border-radius: 50%;
 -webkit-border-radius: 50%;
 -moz-border-radius: 50%;
 -ms-border-radius: 50%;
 -o-border-radius: 50%;
 margin-bottom: 15px
}
.page-title-blog-single .page-title-wrapper .page-title {
 font-size: 75px;
 line-height: 1.08;
 margin-bottom: 23px
}
@media only screen and (min-width:768px) and (max-width:991px) {
 .testimonial-wrapper {
  padding: 65px 15px 45px
 }
 .test-shape.tshape-2 {
  display: none !important
 }
 .testimonial-style::before {
  left: 0;
  top: 60px
 }
 .blog-list-content, .blog-single .blog-single-content {
  padding-right: 0
 }
 .blog-single .blog-title {
  font-size: 26px
 }
 .page-title-blog-single .page-title-wrapper .page-title {
  font-size: 42px
 }
}
@media (max-width:767px) {
 .testimonial-wrapper {
  padding: 65px 15px 45px
 }
 .test-shape.tshape-2 {
  display: none !important
 }
 .team-shape.tmshape-3a, .testimonial-style::before {
  display: none
 }
 .testimonial-wrapper2 .testimonial-text {
  font-size: 18px
 }
 .copic-team-wrapper .section-title {
  padding-left: 0;
  padding-right: 0
 }
 .blog-single .blog-title, .blog-title, .page-title-blog-single .page-title-wrapper .page-title {
  font-size: 26px
 }
 .blogs-content {
  padding: 30px 15px 20px
 }
 .blog-list-content, .blog-single .blog-single-content {
  padding-right: 0
 }
}
.blog-single-box {
 border: 1px solid var( --dark-navy-blue);
 background-color: color-mix(in srgb, var(--secondary), transparent 70%);
 padding: 50px 80px 50px 40px
}
.blog-single-box .blog-single-content {
 padding-right: 0
}
.page-navigation .page-item:first-child .page-link {
 border-top-left-radius: 0;
 border-bottom-left-radius: 0
}
.page-navigation .page-item:last-child .page-link:hover img {
 filter: brightness(1) invert(1)
}
.page-navigation .page-link {
 color: var( --dark-navy-blue);
 font-size: 18px;
 background-color: transparent;
 width: 54px;
 height: 60px;
 line-height: 60px;
 text-align: center;
 margin: 0 7px;
 padding: 0
}
.page-navigation .page-link:focus, .page-navigation .page-link:hover {
 z-index: 2;
 color: var( --white);
 background-color: var( --primary);
 border-color: var( --primary);
 outline: 0;
 box-shadow: none
}
.blog-quote p {
 color: var( --dark-navy-blue);
 font-size: 30px;
 line-height: 1.3
}
.share-links {
 border-width: 1px 0;
 border-color: var( --light-dove-grey);
 border-style: solid;
 padding-top: 30px
}
.tag_cloud .tag {
 color: var( --dark-navy-blue);
 font-size: 15px;
 border: 1px solid var( --dark-navy-blue);
 line-height: 1;
 padding: 9px 12px;
 display: inline-block;
 margin-right: 2px
}
.social_share span {
 color: var( --white);
 font-size: 25px;
 line-height: 54px;
 width: 54px;
 height: 54px;
 display: inline-block;
 border-radius: 50%;
 background-color: var( --primary);
 text-align: center;
 margin-left: 12px
}
.nav-heding {
 font-size: 24px;
 font-weight: 500;
 line-height: 1.2
}
.post-left, .post-right {
 line-height: 1.3;
 cursor: pointer;
 margin-bottom: 30px
}
.post-left {
 padding-right: 140px;
 text-align: start
}
.post-right {
 padding-left: 100px;
 text-align: end
}
.shipping-shape.sshape-1 {
 left: 12.5%;
 top: 32%;
 animation: 15s linear infinite animationFramesTwo
}
.bi-cycle .img-four, .bi-cycle .img-three {
 animation: 5s linear infinite rotation;
 position: absolute
}
.shipping-shape.sshape-2 {
 right: -55px;
 bottom: 120px;
 width: 385px;
 height: 185px;
 transform: rotateY(-180deg)
}
.shipping-img-box .img-one {
 position: absolute;
 left: 14%;
 top: -6%
}
.bi-cycle {
 max-width: 345px;
 width: 100%;
 min-height: 365px;
 left: 14.5%;
 right: 0;
 margin: 0 auto;
 top: 35px;
 z-index: 3
}
.bi-cycle .img-three {
 left: -1.2%;
 bottom: 3%
}
.bi-cycle .img-four {
 right: 10%;
 bottom: 2.3%;
 z-index: -1
}
.about-shape.ashape-1, .about-shape.ashape-4, .faq-shape.sshape-2 {
 animation: 4s linear infinite float-bob-y
}
.bi-cycle .img-five {
 position: absolute;
 bottom: 2%;
 left: 0
}
.fw-bold {
 font-weight: 700
}
.fw-semibold {
 font-weight: 600
}
.fw-medium {
 font-weight: 500
}
.fw-normal {
 font-weight: 400
}
.fw-light {
 font-weight: 300
}
.fs-12, .fs-14, .fs-16, .fs-20 {
 font-size: 20px
}
.single-box-list2 {
 display: grid;
 grid-gap: 20px;
 border-bottom: 1px solid var( --light-dove-grey);
 padding-bottom: 24px
}
.about-shape.ashape-1 {
 right: 11%;
 top: 13%;
 z-index: 2
}
.about-shape.ashape-2 {
 bottom: 0;
 left: -20px
}
.about-shape.ashape-3 {
 bottom: 0;
 right: -20px;
 transform: rotateY(-90deg)
}
.about-shape.ashape-4 {
 right: 5%;
 top: 68%
}
.about-img-wrapper .about-one {
 margin-left: -270px;
 margin-top: -50px
}
.about-img-wrapper .about-two {
 position: absolute;
 bottom: -27%;
 right: 16%
}
.about-box-shape.about-three {
 right: 83%;
 bottom: -34%;
 transform: rotate(-83deg);
 z-index: -1
}
.about-box-shape.about-four {
 left: -35%;
 top: -15%
}
.about-box-shape.about-five {
 left: -60px;
 bottom: -55px;
 z-index: -1
}
.about-box-shape.about-six {
 right: 37px;
 bottom: -195px;
 z-index: -1
}
.about-box-shape.about-seven {
 right: 39px;
 bottom: 75px;
 z-index: -1
}
.about-shape3.ashape-3 {
 bottom: 0;
 right: 10.31%;
 transform: rotateY(186deg);
 z-index: 2
}
.copic-faq .faq-shape.faq-one {
 left: 186px;
 top: 68%
}
.copic-faq .faq-shape.faq-two {
 right: 86px;
 top: 82px
}
.text-list li {
 margin-bottom: 15px;
 position: relative;
 z-index: 1
}
.text-list li::before {
 content: '\f00c';
 position: absolute;
 font-family: "Font awesome 5 Pro";
 font-size: 16px;
 left: 0;
 top: 0;
 z-index: 1
}
.faq-que-list .accordion-item {
 margin-bottom: 30px;
 border: 0
}
.faq-que-list .accordion-item:first-of-type .accordion-button {
 border-top-left-radius: 0;
 border-top-right-radius: 0
}
.faq-que-list .accordion-item .accordion-button {
 color: var( --white);
 font-family: Poppins, sans-serif;
 font-size: 18px;
 font-weight: 500;
 line-height: 1;
 border: 0;
 background-color: var( --primary);
 border-radius: 0;
 padding: 24px;
 position: relative
}
.info-box .contact-title, .quotes-title, .widget.widget_add_banner .add-title {
 font-size: 30px
}
.faq-que-list .accordion-item .accordion-button::before {
 content: '\f068';
 position: absolute;
 font-family: "Font awesome 5 Pro";
 font-size: 16px;
 right: 25px;
 top: 50%;
 transform: translateY(-50%);
 z-index: 1
}
.faq-que-list .accordion-item .accordion-button:focus {
 z-index: 3;
 border-color: transparent;
 outline: 0;
 box-shadow: none
}
.faq-que-list .accordion-item .collapsed {
 color: var( --dark-navy-blue);
 background-color: color-mix(in srgb, var(--primary), transparent 90%)
}
.faq-que-list .accordion-item .collapsed::before {
 content: '\f067'
}
.faq-que-list .accordion-item .accordion-body {
 padding: 25px 24px 5px
}
.faq-area-2 .faq-que-list .accordion-item .accordion-button {
 color: var( --dark-navy-blue);
 background-color: var( --white);
 border: 1px solid var( --dark-navy-blue);
 padding-left: 52px;
 font-family: Poppins, sans-serif
}
.faq-area-2 .faq-que-list .accordion-item .accordion-button::before {
 left: 22px
}
.faq-area-2 .faq-que-list .accordion-item .collapsed {
 border: 1px solid transparent
}
.faq-shape.sshape-2 {
 position: absolute;
 right: 6%;
 top: 14%;
 -webkit-animation: 4s linear infinite float-bob-y
}
.cta-border {
 border: 2px solid var( --dark-navy-blue);
 padding: 25px 70px 0;
 position: relative;
 z-index: 2
}
.cta-shape.cta-one {
 left: 211px;
 top: 95px;
 z-index: -2
}
.cta-shape.cta-two {
 right: 115px;
 top: 150px
}
.cta-title h2 {
 font-size: 48px;
 line-height: 1.2;
 margin-bottom: 38px
}
@media only screen and (min-width:992px) and (max-width:1200px) {
 .about-wrapper, .blog-details-content, .post-left {
  padding-right: 0
 }
 .post-right {
  padding-left: 0
 }
 .about-shape3.ashape-3 {
  right: 0
 }
 .faq-img-box img {
  width: 100%
 }
 .cta-shape.cta-one {
  top: 40px
 }
 .cta-title h2 {
  font-size: 36px
 }
}
.contact-shape.contact-one {
 left: 98px;
 bottom: 198px;
 animation: 3s linear infinite rotation
}
.contact-wrapper {
 background-repeat: no-repeat;
 background-size: contain;
 background-position: bottom center
}
.contact-form-1 input, .contact-form-1 textarea {
 border: 0;
 padding: 0 0 18px;
 border-bottom: 1px solid var( --dark-navy-blue);
 background-color: transparent;
 width: 100%;
 font-size: 16px;
 text-transform: uppercase;
 position: relative;
 resize: none
}
.contact-form-1 textarea {
 height: 120px;
 display: block;
 width: 100%
}
.comment-form .form-group label {
 color: var( --dark-navy-blue);
 font-size: 16px;
 display: block;
 margin-bottom: 12px
}
.comment-form .form-group input, .comment-form .form-group textarea {
 color: rgba(24, 21, 44, .5);
 text-transform: capitalize;
 background-color: var( --light-grey);
 border: 0
}
.comment-form .form-group input {
 font-size: 15px;
 height: 55px;
 line-height: 52px;
 padding: 0 0 0 12px
}
.comment-form .form-group textarea {
 font-size: 15px;
 height: 190px;
 padding: 22px 0 0 12px;
 resize: none
}
.comment-form .form-check .form-check-input {
 margin-top: 4px;
 margin-right: 13px
}
.contact-shape.contact-two {
 right: 96px;
 bottom: 62px;
 animation: 4s linear infinite float-bob-y
}
.cta-shape.cta-service1 {
 left: 211px;
 top: 0;
 z-index: -2
}
.cta-shape.cta-service2 {
 top: 25px
}
.widget_search .search-form::before {
 content: '\f002';
 position: absolute;
 font-size: 18px;
 font-family: "Font Awesome 5 Pro";
 left: 19px;
 top: 50%;
 z-index: 1;
 transform: translateY(-50%)
}
.widget_search input {
 color: var( --mid-dark-grey);
 font-size: 15px;
 line-height: 1;
 background-color: transparent;
 border: 1px solid #ddd;
 border-radius: 0;
 width: 100%;
 height: 58px;
 padding-left: 49px
}
.widget_categories ul li {
 color: var( --dark-navy-blue);
 font-size: 22px;
 font-weight: 500;
 font-family: "Saira Extra Condensed", sans-serif;
 position: relative;
 border-bottom: 1px solid #ddd;
 padding: 14px 0
}
.widget_categories ul li:first-child {
 border-top: 1px solid #ddd
}
.widget_categories ul li span {
 position: absolute;
 top: right;
 right: 0
}
.widget.widget_add_banner .wideget_cta_content {
 padding: 30px 30px 40px;
 overflow: hidden;
 position: relative;
 z-index: 2
}
.widget.widget_add_banner .wideget_cta_content::before {
 content: "";
 position: absolute;
 width: 116px;
 height: 116px;
 background-color: var( --secondary);
 border-radius: 50%;
 left: -83px;
 top: -69px;
 z-index: -1
}
.widget.widget_add_banner .wideget_cta_content::after {
 content: "";
 position: absolute;
 width: 116px;
 height: 116px;
 background-color: var( --secondary);
 border-radius: 50%;
 right: -83px;
 bottom: -69px;
 z-index: -1
}
.widget.widget_add_banner .number {
 font-size: 32px;
 font-family: "Saira Extra Condensed", sans-serif
}
.quote-info-wrapper {
 background-color: var( --white);
 box-shadow: 0 0 30px 0 rgba(229, 230, 232, .72);
 padding: 60px 5px 60px 25px
}
.footer__widget .social-links a:nth-child(2), .fot_sub_btn {
 background-color: var( --secondary)
}
.quote-info-wrapper p {
 color: var( --dark-navy-blue);
 font-size: 16px;
 text-transform: uppercase;
 font-family: Poppins, sans-serif;
 margin-bottom: 10px;
 display: inline-block
}
.quote-info-wrapper .nice-select {
 width: 92%;
 background-color: var( --light-grey);
 border-radius: 0;
 -webkit-border-radius: 0;
 -moz-border-radius: 0;
 -ms-border-radius: 0;
 -o-border-radius: 0;
 border: 1px solid transparent;
 height: 65px;
 line-height: 65px
}
.quote-info-wrapper .nice-select .list {
 width: 100%
}
.quote-info-wrapper .nice-select.open {
 background-color: transparent;
 border-color: var( --dark-navy-blue)
}
.quote-info-wrapper .align-bottom-content {
 transform: translateY(59px);
 -webkit-transform: translateY(59px);
 -moz-transform: translateY(59px);
 -ms-transform: translateY(59px);
 -o-transform: translateY(59px)
}
@media only screen and (min-width:768px) and (max-width:991px) {
 .about-wrapper, .blog-details-content, .post-left, .text-list {
  padding-right: 0
 }
 .post-right {
  padding-left: 0
 }
 .shipping-img-box .img-one {
  top: 0
 }
 .single-box-list2 {
  grid-template-columns: repeat(2, 1fr)
 }
 .about-img-wrapper .about-one {
  width: 100%;
  margin-left: 0;
  margin-top: 0;
  margin-bottom: 30px
 }
 .faq-que-list .accordion-item .accordion-body {
  padding: 15px 0 5px
 }
 .faq-que-list .accordion-item .accordion-body p {
  line-height: 1.5
 }
 .cta-border {
  padding: 25px 15px 0
 }
 .cta-shape.cta-one {
  width: 30%;
  top: 60px
 }
 .cta-title h2 {
  font-size: 32px
 }
 .quote-info-wrapper .align-bottom-content {
  transform: translateY(0);
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0)
 }
}
.from-place {
 display: grid;
 grid-template-columns: repeat(2, 1fr)
}
@media (max-width:767px) {
 .blog-single-box {
  padding: 50px 15px
 }
 .page-navigation .page-link {
  font-size: 14px;
  width: 40px;
  height: 40px;
  line-height: 42px;
  margin: 0 2px
 }
 .about-wrapper, .blog-details-content, .post-left, .text-list {
  padding-right: 0
 }
 .post-right {
  text-align: start;
  padding-left: 15px
 }
 .bi-cycle {
  left: 8.5%
 }
 .bi-cycle .img-three {
  left: -9.2%
 }
 .bi-cycle .img-four {
  right: 2%
 }
 .single-box-list2 {
  grid-template-columns: repeat(1, 1fr)
 }
 .about-img-wrapper .about-one {
  width: 100%;
  margin-left: 0;
  margin-top: 0;
  margin-bottom: 30px
 }
 .faq-area-2 .faq-que-list .accordion-item .accordion-button {
  font-size: 16px;
  padding-left: 45px;
  padding-right: 10px
 }
 .faq-img-box img {
  width: 100%
 }
 .cta-border {
  padding: 25px 15px 0
 }
 .cta-title h2, .quotes-title {
  font-size: 26px
 }
 .quote-info-wrapper {
  padding: 35px ​5px 10px 25px
 }
 .quote-info-wrapper .nice-select {
  margin-bottom: 15px
 }
 .from-place {
  display: block
 }
}
@media only screen and (min-width:576px) and (max-width:767px) {
 .row-count-content {
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 32px
 }
 .c-service2 {
  padding: 50px 10px 0
 }
 .c-service2 p {
  font-size: 16px
 }
 .case-single-content .assistant-accesories, .from-place, .shipment-time, .text-list-box {
  display: grid
 }
 .pr-manager {
  margin-bottom: 0
 }
 .page-title-blog-single .page-title-wrapper .page-title {
  font-size: 36px
 }
}
.quotes-title {
 margin-bottom: 25px
}
.q-style1 input {
 width: 100%;
 border: 0;
 background-color: var( --light-grey);
 height: 65px;
 padding-left: 16px;
 font-size: 15px;
 color: rgba(24, 21, 44, .6)
}
.q-style1 input::-webkit-inner-spin-button, .q-style1 input::-webkit-outer-spin-button {
 -webkit-appearance: none;
 margin: 0
}
.q-style1 .qut-btn {
 border: 0;
 background: 0;
 padding: 0;
 font-size: 11px;
 position: absolute;
 z-index: 2;
 top: 0
}
.q-style1 .quantity-plus.qut-btn {
 right: 24px;
 top: 10px
}
.q-style1 .quantity-minus.qut-btn {
 right: 24px;
 top: auto;
 bottom: 10px
}
.fot-shape.f-shape1 {
 left: 0;
 bottom: 6px;
 z-index: -1
}
.fot-shape.f-shape2 {
 right: 12%;
 top: 16%;
 animation: 5s infinite alternate rotation;
 -webkit-animation: 5s infinite alternate rotation
}
.fot-shape.f-shape3 {
 left: 11%;
 bottom: 30%;
 opacity: .5;
 animation: 5s linear infinite rotation
}
.fot-shape.f-shape4 {
 right: 3%;
 bottom: 10%;
 width: 58px;
 height: 58px;
 transform: rotate(-96deg)
}
.footer__widget .widget-title {
 font-size: 28px;
 font-weight: 600
}
.footer__widget .addres-details {
 color: var( --dark-navy-blue);
 font-size: 17px;
 display: inline-block
}
.footer__widget .social-links a, .fot_sub_btn .right-arrow {
 color: var( --white)
}
.footer__widget .social-links a:nth-child(3) {
 background-color: var(--secondary)
}
.footer__widget .social-links a:hover {
 background-color: var( --primary)
}
.fot-list {
 margin: 0;
 padding: 0
}
.fot-list li a {
 font-size: 17px;
 color: rgba(0, 1, 8, .9);
 display: inline-block;
 margin-bottom: 10px
}
.subscribe-form input {
 color: rgba(6, 3, 21, .5);
 width: 100%;
 background: var( --white);
 font-size: 16px;
 font-family: Poppins, sans-serif;
 font-weight: 400;
 height: 65px;
 display: inline-block;
 border: 0;
 padding-left: 50px
}
.fot_sub_btn {
 border: 0;
 padding: 18px 16px;
 position: absolute;
 right: 0;
 top: 0;
 z-index: 1;
 border-radius: 4px 0 0 4px
}
.copyright p {
 color: rgba(0, 1, 8, .9)
}
.copy-right-area .fot-list li {
 display: inline-block;
 margin-left: 23px
}
.borders-grey {
 border-bottom: 1px solid var( --light-dove-grey)
}
.form-check {
 margin-bottom: 13px
}
.form-check .form-check-input {
 width: 17px;
 height: 16px;
 margin-top: 6px;
 vertical-align: center;
 background-color: none !important;
 border: 1px solid rgba(0, 0, 0, .25);
 border-radius: 0
}
.form-check .form-check-input:focus {
 border-color: 0 !important;
 outline: 0;
 box-shadow: none !important
}
.form-check label.form-check-label {
 font-size: 16px
}
.foter-layout-2 .subscribe-form input {
 background-color: var( --light-grey)
}
.btn-primary {
 color: var( --white);
 background-color: var( --primary) !important;
 border-color: var( --primary) !important
}

/* FIXES */
.img-icon{
 width: 100px !important;
 height: 100px !important;
}

.footer-area{
 background: color-mix(in srgb, var(--secondary), transparent 70%) !important;
}
.logo, .footer-logo{
 width: 200px !important;
 height: 200px !important;
}
main{
 background: color-mix(in srgb, var(--primary), transparent 90%);
 margin-top: 0;
}

/* STYLES FOR THE MISSING SECTIONS */
/* About Us Section Styling */
.section {
 margin: 40px 0;
 padding: 30px;
 background-color: #f4f7f9;
 border-radius: 12px;
 box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
}

.section-title {
 font-size: 2.2rem;
 color: var( --secondary);
 text-align: center;
 margin-bottom: 20px;
 position: relative;
}

.section-title::after {
 content: '';
 display: block;
 height: 3px;
 width: 60px;
 background-color: var( --primary);
 margin: 10px auto 0;
 border-radius: 5px;
}

.mission-container, .story-container {
 display: flex;
 align-items: center;
 justify-content: space-between;
 flex-wrap: wrap;
}

.mission-img, .story-img {
 flex: 1;
 margin: 10px;
}

.mission-img img, .story-img img {
 max-width: 100%;
 border-radius: 10px;
 box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.mission-content, .story-content {
 flex: 2;
 margin: 10px;
 padding: 20px;
 background-color: #ffffff;
 border-radius: 10px;
 box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.mission-content h3, .story-content h3 {
 font-size: 1.8rem;
 color: #333;
}

.mission-content p, .story-content p {
 font-size: 1.1rem;
 line-height: 1.6;
 color: #555;
}

.about-team-section {
 text-align: center;
}

.about-team-section .section-content {
 margin-bottom: 20px;
 font-size: 1.1rem;
 color: #666;
}


.about-team-container {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
}

.about-team-content{
 display: grid; 
 grid-template-columns: repeat(3, 1fr); 
 gap: 20px;
 margin: 20px 0
}

.about-team {
 background: #ffffff;
 border-radius: 10px;
 padding: 15px;
 margin: 10px;
 box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
 width: 100%;
 max-width: 350px;
 text-align: center;
 transition: transform 0.3s;
}

.about-team img {
 border-radius: 50%;
 width: 100px;
 height: 100px;
 object-fit: cover;
 margin-bottom: 10px;
}

.about-team h3 {
 font-size: 1.2rem;
 color: var( --secondary);
 margin: 5px 0;
}

.about-team p {
 font-size: 1rem;
 color: #777;
}

.about-team:hover {
 transform: scale(1.05);
}

@media (max-width: 768px) {
 .mission-container, .story-container {
  flex-direction: column;
 }
 .about-team-content {
  grid-template-columns: repeat(2, 1fr); 
 }

 .mission-img, .story-img {
  margin: 0 auto 20px;
 }

 .about-team {
  width: 80%; 
 }
}

@media (max-width: 480px) {
 .about-team-content {
  grid-template-columns: 1fr;
 }
}


/* CASE STUDIES */
.case-studies {
 background-color: transparent;
 padding: 180px 20px 50px 20px;
 font-family: Arial, sans-serif;
 margin-top: 0px;
}

.case-container {
 max-width: 1200px;
 margin: 0 auto;
 text-align: center;
}

.case-container h1 {
 font-size: 3em;
 color: var( --secondary) !important;
 margin-bottom: 20px;
 font-weight: 600;
}

.case-intro {
 font-size: 1.2em;
 color: #666;
 margin-bottom: 50px;
 max-width: 800px;
 margin-left: auto;
 margin-right: auto;
}

.case-study {
 display: grid;
 grid-template-columns: 1fr 1.5fr;
 gap: 20px;
 background: #ffffff;
 border-radius: 15px;
 overflow: hidden;
 margin-bottom: 40px;
 transition: box-shadow 0.3s, transform 0.3s;
 box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1);
}

.case-study:hover {
 transform: translateY(-8px);
 box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.case-study-image img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 border-right: 5px solid var( --primary);
}

.case-study-content {
 padding: 30px;
 text-align: left;
}

.case-study-content h2 {
 font-size: 2em;
 color: var( --primary);
 margin-bottom: 15px;
 font-weight: 500;
}

.case-study-content p {
 font-size: 1em;
 color: #555;
 line-height: 1.8;
 margin: 12px 0;
}

.case-study-content strong {
 color: #333;
 font-weight: 500;
}

/* Highlight style for each section */
.case-study-content p::before {
 content: '• ';
 color: var( --primary);
 font-size: 1.2em;
 font-weight: bold;
}

@media (max-width: 992px) {
 .case-study {
  grid-template-columns: 1fr;
 }
}

@media (max-width: 768px) {
 .case-container h1 {
  font-size: 2.5em;
 }
 .case-intro {
  font-size: 1.1em;
  padding: 0 20px;
 }
}

@media (max-width: 576px) {
 .case-container h1 {
  font-size: 2em;
 }
 .case-intro {
  font-size: 1em;
 }
}




/* FAQ Section Styling */
.faq-section {
 background-color: transparent;
 padding: 180px 20px 100px 20px;
 text-align: center;

}

.faq-title {
 font-size: 2.5rem;
 color: var( --primary);
 font-weight: bold;
 margin-bottom: 1rem;
}

.faq-subtitle {
 font-size: 1.25rem;
 color: #333;
 margin-bottom: 2rem;
}

.faq-container {
 max-width: 800px;
 margin: 0 auto;
 border-radius: 8px;
}

.faq-item {
 margin-bottom: 1.5rem;
 border: 1px solid #ddd;
 border-radius: 5px;
 overflow: hidden;
 transition: all 0.3s ease;
}

.faq-item:hover {
 box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.faq-question {
 width: 100%;
 background: #f7f7f7;
 color: #000;
 padding: 1rem;
 text-align: left;
 font-weight: 600;
 font-size: 1.2rem;
 display: flex;
 justify-content: space-between;
 align-items: center;
 cursor: pointer;
 border: none;
 transition: background-color 0.3s;
}

.faq-question:hover {
 background: color-mix(in srgb, var(--primary), transparent 70%);
}

.toggle-icon {
 font-size: 1.5rem;
}

.faq-answer {
 display: none;
 padding: 1rem;
 background: #fff;
 border-top: 1px solid #ddd;
 position: relative;
}

.faq-answer img {
 float: left;
 margin-right: 1rem;
 border-radius: 5px;
 width: 100%;
 max-width: 300px;
 height: 180px;
 border: 2px solid var( --secondary);
}

.faq-answer p {
 color: #333;
 font-size: 1rem;
 line-height: 1.6;
 overflow: hidden;
}

.faq-item.active .faq-answer {
 display: block;
}



/* Partner Section Styling */
.heading {
 background: linear-gradient(135deg, var( --primary), var( --secondary));
 color: #fff;
 padding: 2rem 1.5rem;
 text-align: center;
 margin-top: 130px;
}

.heading-title {
 font-size: 2.5rem;
 font-weight: bold;
 margin-bottom: 0.5rem;
 color: #fff;
}

.heading-subtitle {
 font-size: 1.2rem;
 max-width: 800px;
 margin: 0 auto;
 color: #fff;
}

.partners-section {
 padding: 3rem 1.5rem;
 background-color: transparent;
 text-align: center;

}

.section-title {
 font-size: 2.25rem;
 color: var( --primary);
 font-weight: bold;
 margin-bottom: 1rem;
}

.section-description {
 font-size: 1.1rem;
 color: #333;
 max-width: 700px;
 margin: 0 auto 2rem;
}

/* Partner Card Styling */
.partners-container {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
 gap: 2rem;
 max-width: 1200px;
 margin: 0 auto;
}

.partner-card {
 background: #fff;
 border: 1px solid #ddd;
 border-radius: 8px;
 padding: 1.5rem;
 transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.partner-card:hover {
 transform: translateY(-5px);
 box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.partner-logo {
 width: 100%;
 height: auto;
 max-height: 150px;
 object-fit: contain;
 margin-bottom: 1rem;
 border-bottom: 2px solid var( --secondary);
 padding-bottom: 1rem;
}

.partner-info h2 {
 font-size: 1.5rem;
 color: var( --primary);
 margin: 0.5rem 0;
}

.partner-info p {
 font-size: 1rem;
 color: #333;
 margin-bottom: 1rem;
 line-height: 1.6;
}

.partner-link {
 display: inline-block;
 color: var( --secondary);
 font-weight: bold;
 text-decoration: none;
 transition: color 0.3s ease;
}

.partner-link:hover {
 color: var( --primary);
}



/* Tutorial Section Styling */
.tutorial-section {
 background: linear-gradient(to bottom, #f7f8fc, #e9ecf5);
 padding: 180px 30px 100px 30px;
 font-family: Arial, sans-serif;
 margin-top: 0px;
}

.tutorial-header {
 text-align: center;
 margin-bottom: 3rem;
}

.tutorial-title {
 font-size: 3rem;
 color: var( --primary);
 font-weight: 700;
 margin-bottom: 0.5rem;
}

.tutorial-subtitle {
 font-size: 1.2rem;
 color: #333;
 max-width: 800px;
 margin: 0 auto;
 line-height: 1.6;
}

/* Grid Layout */
.tutorial-grid {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
 gap: 2rem;
 max-width: 1200px;
 margin: 0 auto;
}

/* Card Styling */
.tutorial-card {
 background: #fff;
 border-radius: 12px;
 overflow: hidden;
 box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
 transition: transform 0.4s ease, box-shadow 0.4s ease;
}

.tutorial-card:hover {
 transform: translateY(-10px);
 box-shadow: 0px 6px 30px rgba(0, 0, 0, 0.15);
}

.tutorial-image {
 width: 100%;
 height: 180px;
 object-fit: cover;
}

.tutorial-content {
 padding: 1.5rem;
}

.tutorial-content h2 {
 font-size: 1.5rem;
 color: var( --primary);
 margin: 0.5rem 0;
}

.tutorial-content p {
 color: #555;
 font-size: 1rem;
 line-height: 1.6;
}

.tutorial-link {
 display: inline-block;
 background-color: var( --secondary);
 color: #fff;
 padding: 0.6rem 1.2rem;
 border-radius: 5px;
 text-decoration: none;
 font-weight: 600;
 margin-top: 1rem;
 transition: background-color 0.3s ease;
}

.tutorial-link:hover {
 background-color: var( --primary);
 color: #fff;
}


/* Cookies Styling */
.cookie-container {
 width: 90%;
 max-width: 1000px;
 margin: 0 auto;
 padding: 80px 30px 50px 30px;
}
.cookie-container h1{
 text-align: center;
 padding: 10px 0;
 color: var( --primary);
}
.header {
 background-color: var( --primary); 
 color: #ffffff;
 text-align: center;
 padding: 5rem 0;
 margin-top: 130px;
}

.header-title {
 font-size: 2.5rem;
 font-weight: bold;
}

.header-subtitle {
 font-size: 1.1rem;
 color: #fff;
 margin-top: 0.5rem;
}

.cookie-policy-section {
 padding: 4rem 0;
}

.policy-intro {
 margin-bottom: 2rem;
 text-align: center;
}

.policy-image {
 width: 100%;
 max-width: 300px;
 margin: 1rem auto;
 display: block;
 border-radius: 8px;
}

.policy-section {
 margin-bottom: 2rem;
}

.policy-section h2 {
 font-size: 1.8rem;
 color: var( --primary); 
 margin-bottom: 0.5rem;
}

.cookie-type {
 margin-bottom: 1.5rem;
}

.cookie-type h3 {
 font-size: 1.4rem;
 color: var( --primary); 
}

.policy-section ul {
 list-style-type: none;
 padding-left: 0;
}

.policy-section ul li {
 margin-bottom: 0.5rem;
}

.policy-section ul li a {
 color: var( --secondary); 
 text-decoration: none;
 border-bottom: 1px solid transparent;
 transition: border-color 0.3s;
}
.policy-section p a{
 color: var(--secondary);
 text-decoration: none;
 border-bottom: 1px solid transparent;
 transition: border-color 0.3s;

}

.policy-section ul li a:hover {
 border-color: var( --secondary); 
}

.policy-section p a:hover{
 border-color: var(--secondary);
}
/* Cookie Banner Styling */
.cookie-banner {
 display: none;
 position: fixed;
 bottom: 0;
 left: 0;
 right: 0;
 background-color: var( --primary); 
 color: #ffffff;
 padding: 1rem;
 text-align: center;
 z-index: 999;
}

.cookie-banner p {
 display: inline;
}

.cookie-banner .btn {
 background-color: #ffffff;
 color: var( --primary); 
 border: none;
 padding: 0.5rem 1rem;
 margin-left: 1rem;
 cursor: pointer;
 border-radius: 4px;
}

/* Cookie Preferences Popup Styling */
.cookie-preferences {
 display: flex;
 align-items: center;
 justify-content: center;
 margin-top: 50px;
 display: none;
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 background-color: rgba(0, 0, 0, 0.5);
 display: none;
 z-index: 999;
}

.preferences-content {
 background-color: #ffffff;
 padding: 2rem;
 border-radius: 8px;
 width: 90%;
 max-width: 500px;
 text-align: left;
}

.preferences-content h2 {
 color: var( --primary); 
}

.preferences-content label {
 display: block;
 margin: 1rem 0;
}

.preferences-content .btn {
 margin-top: 1rem;
 padding: 0.5rem 1rem;
 border: none;
 cursor: pointer;
 border-radius: 4px;
}

.save-btn {
 background-color: var(--primary); 
 color: #ffffff;
}

.cancel-btn {
 background-color: var( --secondary);
 color: #ffffff;
}


/* Logout Page Styles */
.logout-main {
 display: flex;
 justify-content: center;
 align-items: center;
 min-height: 100vh;  
 background-color: transparent; 
 padding: 2rem;
}

.logout-container {
 background-color: #ffffff; 
 border-radius: 8px;
 box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
 padding: 3rem;
 margin-top: 70px;
 text-align: center;
 width: 90%;
 max-width: 500px; 
}

.logout-container h1 {
 font-size: 2.5rem; 
 color: var( --primary); 
 margin-bottom: 1rem; 
}

.logout-container p {
 font-size: 1.2rem; 
 color: #333; 
 margin-bottom: 2rem; 
}

.logout-img-wrap img {
 width: 100%; 
 max-width: 100px; 
 border-radius: 8px; 
 margin-bottom: 2rem; 
}

.btn-container {
 display: flex;
 justify-content: space-around; 
}

.btn {
 background-color: var( --primary); 
 color: #ffffff; 
 padding: 0.75rem 1.5rem;
 border-radius: 4px; 
 text-decoration: none;
 font-weight: bold; 
 transition: background-color 0.3s;
}

.btn:hover {
 background-color: #f9f9f9; 
 color: var(--primary);
}

.btn-secondary {
 background-color: var( --secondary);  
}

.btn-secondary:hover {
 background-color: var(--dark-secondary); 
}


/* Privacy Policy Page Styles */
.privacy-header h1,
.privacy-header p{
 color: #fff;
}

.privacy-container {
 max-width: 800px; 
 margin: 2rem auto; 
 padding: 1rem;
 background-color: #ffffff; 
 border-radius: 8px; 
 box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); 
}

.privacy-section {
 margin-bottom: 2rem; 
}

.privacy-section h2 {
 font-size: 1.8rem; 
 color: var( --secondary); 
 margin-bottom: 1rem; 
}

.privacy-section p {
 line-height: 1.6; 
 color: #333; 
}

.privacy-section ul {
 list-style-type: disc; 
 padding-left: 20px; 
}

.privacy-section ul li {
 margin-bottom: 0.5rem; 
}

.privacy-section a {
 color: var( --primary); 
 text-decoration: none; 
 transition: color 0.3s; 
}

.privacy-section a:hover {
 color: var(--primary); 
 text-decoration: underline;
}

.privacy-image-container {
 text-align: center; 
 margin: 1.5rem 0; 
}

.privacy-image-container img {
 width: 100%; 
 max-width: 400px; 
 height: 250px;
 border-radius: 8px; 
}


/* Terms and Conditions Page Styles */
.main-terms {
 background-color: transparent; 
 padding: 150px 0 50px; 
 margin-top: 0px;
}

.terms-container {
 max-width: 800px; 
 margin: 1rem auto;
 padding: 2rem;
 background-color: #ffffff; 
 border-radius: 8px; 
 box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); 
}

.main-terms h1 {
 color: var( --secondary); 
 text-align: center; 
}

.main-terms h2 {
 font-size: 1.8rem; 
 color: var( --primary); 
 margin-bottom: 1rem; 
}

.main-terms p {
 line-height: 1.6; 
 color: #333; 
}

.terms-section {
 margin-bottom: 2rem; 
}
.terms-image-wrap{
 text-align: center;
}

.terms-section img {
 width: 100%; 
 max-width: 600px; 
 max-height: 300px;
 border-radius: 8px; 
 margin: 1rem 0; 
}

.terms-section a {
 color: var( --secondary); 
 text-decoration: none; 
 transition: color 0.3s; 
}

.terms-section a:hover {
 color: var(--dark-secondary); 
}

.btn-container {
 text-align: center; 
 margin-top: 2rem; 
}

.btn {
 background-color: var( --secondary); 
 color: #ffffff; 
 padding: 0.5rem 1.5rem; 
 border-radius: 4px; 
 text-decoration: none; 
 transition: background-color 0.3s; 
}

.btn:hover {
 color: #fff;
 background-color: var(--dark-secondary); 
}





/* Fixes */
.slider__content {
 display: flex;
 flex-direction: row;
 align-items: flex-start;
 gap: 20px;
}

.slider__content .slider-text {
 flex: 2 !important;
}

.slider__content .slider-image {
 flex: 1;
 padding-left: 200px;
 padding-top: 100px;
 width: 100%;
 max-width: 200px;
}

@media (max-width: 768px) {
 .slider__content {
  flex-direction: column;
  gap: 20px;
 }
 .slider__content .slider-image{
  max-width: 150px;
  padding-top: 0px;
  padding-right: 0px;
 }
}
.logo-img,
.footer-log{
 width: 100%;
}
.nav-logo,
.footer-logo{
 width: 100%;
 max-height: 100px;
 max-width: 100px;
}
.footer-logo{
 max-height: 200px;
 max-width: 200px
}

@media (max-width: 768px) {
 .nav-logo,
 .footer-logo{
  width: 100%;
  max-height: 70px;
  max-width: 70px;
 }
 .footer-logo{
  max-height: 150px;
  max-width: 150px
 }
}

.single-box {
 width: 100%;
 display: flex;
 flex-direction: row;
 align-items: start;
 gap: 15px;
}

.box-heading {
 display: flex;
 align-items: center;
 gap: 10px; 
 flex: 1;
 padding-top: 30px;
 margin-top: 0px;
}

.box-content {
 flex: 2;
 padding-top: 0px;
 margin-top: 0px;
}

@media (max-width: 768px) {
 .single-box {
  flex-direction: column;
  align-items: flex-start;
 }
}

.truck{
 width: 100%;
 max-width: 200px;
 max-height: 200px;
 margin-left: 100px;
}