/*===============================================
Template Name: printmax - Financ & Business Consluting HTML5 Template
Author:  https://www.templatemonster.com/authors/dreamit/
Description: Description
Version: 1.0.0
Text Domain: printmax
Tags: consulting, finance, corporate, business, consultant, multipurpose, technology, it-solution, software, agency, company, portfolio, bangking, insurance, digital-agency, digital-marketing.
================================================*/

/*TABLE OF CONTENTS*/
/*=====================
01. printmax Header Area Css
02. Sater Css Hero Area
03. Sater Css Section Title
04. Sater Css Collection Area
05. Sater Css Feature Area
06. Sater Css Service Area
07. Sater Css Countdown Area
08. Sater Css Product Area
09. Sater Css Countdown Area
10. Sater Css Populer Product Area
11. Sater Css Testimonial Area
12. Sater Css Brand Area
13. Sater Css Blog  Area14. Sater Css Footer  Area
15. Sater Css Package  Area
16. Sater Css Portfolio  Area
17. Sater Css Resouce Apps  Area

<======= Start Inner Page ========>

18. Start printmax Inner page Breadcumb Area
19. Sater Css Team   Area
20. Sater Css Portfolio Details  Area
21. Sater Css Service Details  Area
22. Sater Css Checkout  Area
23. Sater Css Cart  Area
24. Sater Css Contact  Area
25. Sater Css Shop  Area
26. Sater Css Shop Two  Area
27. Sater Css Shop Details  Area
28. Sater Css Sidbar Cart Area
29. Sater Css Saidber List Area
30. Sater Css Sidbar product Area
31. All Animation CSS
=======================*/

/*---=====================================================
   <!--printmax Header Area Css-->
=========================================================---*/

/* Default  */
@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@200;300;400;500;600;700;800&amp;display=swap");
@import url("https://fonts.googleapis.com/css2?family=Overpass:wght@100;200;300;400;500;600;700;800;900&amp;display=swap");
@import url("https://db.onlinewebfonts.com/c/41ef03052040400ec0acd500990fdc97?family=URW+Imperial+W01+Regular");

@font-face {
  font-family: 'Overpass';
  font-style: normal;
  font-weight: 100;
  src: url(https://fonts.gstatic.com/s/overpass/v19/qFdH35WCmI96Ajtm81GoU9vyww.woff2) format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}



.printmax-header-area {
  position: relative;
  margin-bottom: -100px;
  border-bottom: 1px solid #1a1a1a1f;
  padding: 16px 78px 16px 60px;
  z-index: 2;
  background: linear-gradient(45deg, #009eab, #027c7a);
}

a.logo_two {
  display: none;
}

.sticky a.logo_two {
  display: block;
}

.sticky a.active_logo {
  display: none;
}

.header-menu {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.printmax-header-area ul {
  display: inline-block;
  margin-left: 112px;
}

.header-menu ul li {
  display: inline-block;
  margin: 0 18px 0;
  position: relative;
  z-index: 1;
}

.header-menu ul li a {
  display: inline-block;
  padding: 20px 0 20px;
  font-size: 18px;
  color: #fff;
  font-weight: 500;
  font-family: "Overpass";
  position: relative;
}

.header-menu>ul>li>a:before {
  position: absolute;
  content: "";
  top: 29px;
  left: -12px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: #0d223f;
  opacity: 0;
  transition: 0.5s;
}

.header-menu>ul>li>a:hover:before {
  opacity: 1;
}

.sticky .header-menu>ul>li>a:before {
  background: #fff;
}

.header-menu ul li span {
  font-size: 15px;
  color: #fff;
  margin-left: 5px;
  position: relative;
  top: -1px;
  display: inline-block;
  transform: rotate(88deg);
}

/*** Sub Menu Style ***/
.header-menu ul .sub_menu {
  position: absolute;
  left: 0;
  top: 130%;
  width: 225px;
  text-align: left;
  background: #fff;
  margin: 0;
  z-index: 1;
  -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
  box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
  transition: 0.5s;
  visibility: hidden;
  border-top: 2px solid #0d223f;
  opacity: 0;
}

.header-menu ul li:hover>.sub_menu {
  visibility: visible;
  top: 100%;
  opacity: 1;
}

.header-menu ul .sub_menu li {
  position: relative;
  margin: 0;
  display: block;
}

.header-menu ul .sub_menu li a {
  display: block;
  padding: 12px 25px;
  margin: 0;
  line-height: 1.3;
  letter-spacing: normal;
  transition: 0.5s;
  visibility: inherit !important;
  color: #1a1a1a !important;
  font-size: 16px;
  font-weight: 500;
  position: relative;
  z-index: 1;
}

.header-menu ul .sub_menu li:hover>a {
  color: #0d223f !important;
  margin-left: 10px;
}

.header-menu ul .sub_menu li a:before {
  position: absolute;
  content: "";
  left: 12px;
  top: 18px;
  height: 8px;
  width: 8px;
  background: #0d223f;
  z-index: -1;
  border-radius: 50%;
  opacity: 0;
  transition: 0.5s;
}

.header-menu ul .sub_menu li a:hover:before {
  opacity: 1;
}

.sticky .header-menu ul .sub_menu li a:hover:before {
  left: 8px;
}

.sticky .header-menu ul .sub_menu li a:hover {
  margin-left: 15px;
}

/* sub menu style two */
.printmax-header-area.style_two .header-menu ul .sub_menu li a {
  display: block;
  padding: 12px 20px;
}

.sticky .sub_menu li a {
  padding: 12px 20px !important;
}

/* header right */

.header_right {
  display: flex;
  align-items: center;
}

.header_right .nav-btn.navSidebar-button {
  margin-top: -8px;
}

button.cart_btn.headers-button {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  position: relative;
  z-index: 1;
  background: #fff;
  line-height: 40px;
  transition: 0.5s;
  outline: 0;
  border: 1px solid rgba(26, 26, 26, 0.2);
  margin-right: 11px;
}

button.cart_btn.headers-button:hover {
  background: #0d223f;
}

button.cart_btn.headers-button i {
  font-size: 20px;
  color: #1a1a1a;
  transition: 0.5s;
}

button.cart_btn.headers-button:hover i {
  color: #fff;
}

small.cart_counter {
  position: absolute;
  top: -3px;
  width: 16px;
  height: 16px;
  border-radius: 10px;
  background-color: #1a1a1a;
  line-height: 16px;
  font-size: 11px;
  color: #ffffff;
  font-weight: 500;
  font-family: "Overpass";
  right: -6px;
}

.sticky button.cart_btn.headers-button {}

.header-button {
  display: inline-block;
  margin: 0 15px 0;
}

.header-button a {
  display: inline-block;
  border-radius: 8px;
  font-size: 16px;
  color: #ffffff;
  font-weight: 500;
}

.header-button a i {
  transform: rotate(0deg) !important;
}

/* header button */

/* sticky */
.sticky {
  left: 0;
  margin: auto;
  position: fixed !important;
  /* top: 0; */
  top: -10px;
  width: 100%;
  -webkit-box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.1);
  box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.1);
  /* background: #0d223f !important; */
  background: linear-gradient(45deg, #009eab, #027c7a);
  transition: 0.5s;
  z-index: 9;
}

.sticky .header-menu ul li a {
  color: #fff;
}

.sticky .header-menu ul li a i {
  color: #fff;
}

.printmax-header-area.style_two .header-menu ul .sub_menu li a:before {
  left: 6px;
}

.sticky .header-button a {
  border: 1px solid #ffff !important;
}

/* cart sidebar - start */
/* =============================== */
.sidebar-menu-wrapper {
  display: block;
}

.cart_sidebar {
  top: 0;
  width: 400px;
  right: -400px;
  height: 100vh;
  z-index: 9999;
  position: fixed;
  padding: 50px 20px;
  overflow-y: scroll;
  background-color: #ffffff;
  transition: 0.6s cubic-bezier(1, 0, 0, 1);
}

.cart_sidebar .mCustomScrollBox {
  overflow: visible !important;
}

.cart_sidebar.active {
  right: 0px;
}

.cart_sidebar .close_btn {
  top: 15px;
  right: 20px;
  line-height: 1;
  font-size: 24px;
  position: absolute;
}

.cart_sidebar .close_btn:hover {
  color: #0d223f;
}

.cart_sidebar .heading_title {
  line-height: 1;
  font-size: 18px;
  margin-bottom: 20px;
  padding-bottom: 15px;
  border-bottom: 1px solid #f6f6f6;
}

.cart_sidebar .heading_title span {
  color: #0d223f;
}

.cart_sidebar .total_price {
  display: flex;
  font-size: 16px;
  font-weight: 500;
  margin-top: 20px;
  padding: 10px 0px;
  margin-bottom: 15px;
  align-items: center;
  color: #131313;
  border-top: 1px solid #f6f6f6;
  border-bottom: 1px solid #f6f6f6;
  justify-content: space-between;
}

.cart_sidebar .total_price span:last-child {
  color: #0d223f;
}

.cart_sidebar .btns_group {
  margin: -5px;
}

.cart_sidebar .btns_group li {
  width: 48%;
  padding: 5px;
  display: inline-block;
}

.cart_sidebar .btn {
  display: block;
  font-size: 12px;
  padding: 17px 20px;
}

ul.btns_group.ul_li {
  margin-top: 16px;
}

ul.btns_group.ul_li a {
  position: relative;
  z-index: 1;
  transition: 0.5s;
  background: #fff;
  box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.15);
  border: 1px solid #0d223f;
}

ul.btns_group a:before {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: scale(0);
  transition: 0.5s;
  z-index: -1;
  border-radius: 4px;
}

ul.btns_group li:last-child a:hover {
  color: #fff;
}

ul.btns_group li:first-child a {
  background: #0d223f;
  color: #fff;
}

ul.btns_group li:first-child a:hover {
  color: #062e61;
}

ul.btns_group li:first-child a:before {
  background: #fff;
}

ul.btns_group li:last-child a:before {
  background: #0d223f;
}

ul.btns_group li:first-child a:hover:before,
ul.btns_group li:last-child a:hover:before {
  transform: scale(1);
}

.cart_sidebar .btn.btn_border {
  padding: 15px 20px;
}

.cart_sidebar::-webkit-scrollbar {
  width: 0px;
}

.cart_sidebar_overlay {
  left: 100%;
  top: 0;
  position: fixed;
  z-index: 101;
  height: 100%;
  opacity: 0;
  width: 100%;
  visibility: hidden;
  -webkit-transition: all 0.4s ease-in 0.4s;
  -o-transition: all 0.4s ease-in 0.4s;
  transition: all 0.4s ease-in 0.4s;
  background: #0d223f;
}

.cart_sidebar_overlay.active {
  opacity: 0.5;
  visibility: visible;
  -webkit-transition: all 0.4s ease-out 0s;
  -o-transition: all 0.4s ease-out 0s;
  transition: all 0.4s ease-out 0s;
  left: 0;
}

.cart_item {
  display: flex;
  position: relative;
  align-items: center;
  padding-right: 25px;
  transition: 0.5s;
}

.cart_item.remove {
  display: none;
}

.cart_item:not(:last-child) {
  margin-bottom: 20px;
}

.cart_item .item_image {
  display: block;
  min-width: 70px;
  overflow: hidden;
  border-radius: 3px;
  position: relative;
  margin-right: 10px;
}

.cart_item .item_image img {
  width: 100px;
  height: 100px;
}

.cart_item .item_title {
  font-weight: 500;
  margin-bottom: 10px;
  font-size: 14px;
  margin-top: 0;
}

.cart_item .item_price {
  line-height: 1;
  display: block;
  font-weight: 600;
  color: #0d223f;
}

.cart_item button.remove_btn {
  border: 0;
  outline: 0;
  background: #0d223f;
  color: #fff;
  padding: 1px 12px;
  margin-top: 7px;
}

.cart_item .remove_btn:hover {
  color: #ffffff;
  background-color: #131313;
}

/*===========================================
<-- Sater Css Hero Area -->
==============================================*/

section.hero_area {
  /* background: url(../images/home_one/banner.jpg); */
  background: url(../website_images/banner_1.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  /* height: 900px; */
  height: 800px;
  position: relative;
  z-index: 1;
}

.hero_content {
  margin-top: 75px;
}

.hero_content h4 {
  font-size: 18px;
  text-transform: uppercase;
  color: #0d223f;
  font-weight: 500;
  margin-bottom: 22px;
}

.hero_content h1 {
  /* font-size: 63px; */
  font-size: 58px;
  line-height: 76px;
  text-transform: uppercase;
  color: #1a1a1a;
  font-weight: 700;
}

/* hero btn */
.slider_button {
  display: flex;
  align-items: center;
  margin-top: 35px;
}

.banner_btn a {
  background: #1a1a1a !important;
  padding: 14px 45px !important;
  border-radius: 28px !important;
}

.banner_btn a:hover {
  color: #fff !important;
}

.banner_btn span {
  background-color: #0d223f !important;
  border-radius: 28px !important;
}

.slider_info {
  margin-left: 30px;
}

.slider_info a {
  display: inline-block;
  margin-left: 10px;
  font-size: 18px;
  color: #1a1a1a;
  font-weight: 500;
}

.slider_info span {
  color: #fff;
}

/* hero thumb */

.hero-thumb {
  position: relative;
  z-index: 1;
  margin-left: 128px;
  margin-top: 77px;
}

.hero_container_shape {
  position: absolute;
  bottom: 6%;
  left: -32%;
}

.hero_container_shape2 {
  position: absolute;
  top: 0%;
  right: 4%;
  z-index: -1;
}

.hero_container_shape3 {
  position: absolute;
  bottom: 45%;
  left: -14%;
  z-index: -1;
}

.hero_container_shape4 {
  position: absolute;
  bottom: 4%;
  right: -16%;
  z-index: -1;
}

/* hero counter  */
.banner_counter {
  position: absolute;
  background: #fff;
  width: 229px;
  border-radius: 10px;
  filter: drop-shadow(0px 30px 50px rgba(151, 160, 157, 0.3));
  background-color: #ffffff;
  text-align: center;
  padding: 35px 44px 28px;
  top: 36%;
  right: -17%;
}

.banner_counter-_number {
  display: inline-block;
  width: 100px;
  height: 100px;
  border-radius: 50%;
}

.about_counter {
  background: #d7e6e8;
  text-align: center;
  padding: 40px 20px;
  border-radius: 15px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.about_img img {
  width: 100%;
  height: 100%;
  min-height: 250px;
  object-fit: cover;
  border-radius: 15px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

/* Ensure no overlapping in the thumb row */
.about_thumb .row {
  margin-left: -10px;
  margin-right: -10px;
  display: flex;
  align-items: stretch;
}

.about_thumb .row [class*="col-"] {
  padding-left: 10px;
  padding-right: 10px;
}

/* about Shape */
.about_shap {
  position: relative;
}

.banner_counter-_number:before {
  position: absolute;
  content: "";
  width: 82px;
  height: 82px;
  border-radius: 50%;
  background-color: #1a1a1a;
  left: 0;
  right: 0;
  margin: auto;
  z-index: -1;
  top: 8px;
}

.banner_counter-_number h1 {
  font-size: 26px;
  text-transform: uppercase;
  color: #ffffff;
  font-weight: 700;
  display: inline-block;
}

.banner_counter-_number span {
  font-size: 26px;
  text-transform: uppercase;
  color: #ffffff;
  font-weight: 700;
}

.counter_text {
  position: relative;
  margin-left: 20px;
}

.counter_text p {
  font-size: 15px;
  line-height: 22px;
  text-transform: uppercase;
  color: #1a1a1a;
  font-weight: 500;
  font-family: "Overpass";
}

.counter_text p i {
  position: absolute;
  font-weight: 700;
  font-size: 20px;
  transform: rotate(-54deg);
  left: -20px;
}

/* hero contaner social */
.hero_container {
  position: absolute;
  top: 11%;
  transform: translateY(50%);
  left: 4%;
}

.hero_cotaner_social {
  position: relative;
  z-index: 1;
}

.hero_cotaner_social:before {
  position: absolute;
  left: 6px;
  content: "";
  bottom: -63px;
  background: url(../images/home_one/arrwo.png);
  height: 98%;
  width: 40px;
  background-repeat: no-repeat;
  z-index: -1;
}

.hero_follow h3 {
  transform: rotate(90deg);
  margin-bottom: 215px;
  position: relative;
  left: -25px;
  font-size: 16px;
  color: #1a1a1a;
  font-weight: 500;
  text-transform: uppercase;
}

.hero_social a {
  display: block;
  width: 46px;
  height: 46px;
  border-radius: 23px;
  background-color: #ffffff;
  border: 1px solid rgba(19, 20, 20, 0.1);
  line-height: 46px;
  text-align: center;
  font-size: 14px;
  color: #1a1a1a;
  margin-bottom: 14px;
}

.hero_social a:hover {
  background-color: #0d223f;
  border: 1px solid #0d223f;
  color: #ffff;
}

.hero_rotate {
  position: absolute;
  left: 0;
  right: 13%;
  margin: auto;
  text-align: center;
  top: 18%;
}

/*===========================================
<-- Sater Printmax Button Css Css  -->
==============================================*/
.printmax_btn a {
  position: relative;
  z-index: 1;
  overflow: hidden;
  text-align: center;
  border-radius: 25px;
  display: inline-block;
  /* background: #3dc595; */
  background: linear-gradient(45deg, #009eab, #027c7a);
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border: none;
  padding: 11px 33px;
  font-size: 16px;
  color: #ffffff;
  font-weight: 500;
  font-family: "Overpass";
  border: 1px solid #fff;
}

.printmax_btn span {
  position: absolute;
  z-index: -1;
  width: 0;
  height: 0;
  display: block;
  border-radius: 30px;
  background-color: #1a1a1a;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: width 0.5s ease-in-out, height 0.5s ease-in-out;
  transition: width 0.5s ease-in-out, height 0.5s ease-in-out;
}

.printmax_btn a:hover,
.printmax_btn a:focus {
  /* color: #0d223f; */
  color: #fff;
}

.printmax_btn a:hover span,
.printmax_btn a:focus span {
  width: 200%;
  height: 500px;
}

.printmax_btn a i {
  font-size: 14px;
  font-weight: 600;
  transform: rotate(-45deg);
  display: inline-block;
  margin-left: 8px;
}

/*===========================================
<-- Sater Printmax Feature Area Css  -->
==============================================*/

section.feature_area {
  /* padding: 100px 0 20px; */
  padding: 60px 0 40px;
}

.feature_title h2 {
  font-size: 30px;
  line-height: 38px;
  color: #1a1a1a;
  font-weight: 700;
  position: relative;
}

.feature_title h2:before {
  position: absolute;
  content: "";
  left: -37px;
  top: -22px;
  width: 100px;
  height: 100px;
  border-radius: 46px;
  /* background-color: #eafdff; */
  background: linear-gradient(180deg, #2a4e10, #1b3b0c);
  z-index: -1;
}

.feature_item {
  border-radius: 10px;
  background: linear-gradient(180deg, #2a4e10, #1b3b0c);
  display: flex;
  align-items: center;
  padding: 35px 0 35px 30px;
  position: relative;
  z-index: 1;
  transition: 0.5s;
  margin-bottom: 30px;
}

.feature_item:hover .feature_icon i {
  background-color: #f8b097;
  color: #1a1a1a;
}

.feature_item:before {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  transform: scale(0);
  background: #f7f1ee;
  color: #1a1a1a;
  height: 80%;
  width: 80%;
  border-radius: 10px;
  transition: 0.5s;
  content: "";
  z-index: -1;
}

.feature_item:hover:before {
  transform: scale(1);
  height: 100%;
  width: 100%;
}

.feature_icon i {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: linear-gradient(180deg, #2a4e10, #1b3b0c);
  display: inline-block;
  text-align: center;
  line-height: 40px;
  font-size: 31px;
  color: #fff;
  margin-right: 20px;
  transition: 0.5s;
}

.feature_content h3 {
  font-size: 18px;
  color: #fff;
  font-weight: 600;
  margin: 0;
}

/*===========================================
<-- Sater Printmax Collection Area Css  -->
==============================================*/

section.collection_area {
  padding: 70px 0 90px;
}

.collection_single_item {
  background: #edf5f6;
  padding: 52px 50px 62px;
  position: relative;
  border-radius: 20px;
  z-index: 1;
  overflow: hidden;
  margin-bottom: 30px;
}

.collection_single_item.second {
  background: #f7f1ee;
}

.collection_single_item.second:hover:before {
  background: #edf5f6;
}

.collection_single_item:after {
  position: absolute;
  content: "";
  right: -16px;
  top: 11px;
  height: 70%;
  width: 44%;
  background: url(../images/home_one/collection_shpe.png);
  background-repeat: no-repeat;
  z-index: -1;
  -webkit-animation: dance 2s alternate infinite;
  animation: dance 2s alternate infinite;
}

@keyframes dance {
  0% {
    -webkit-transform: scale(0.5);
  }

  100% {
    -webkit-transform: scale(1.2);
  }
}

.collection_single_item:before {
  position: absolute;
  content: "";
  left: 50%;
  top: 0;
  height: 100%;
  width: 0%;
  background: #f7f1ee;
  transition: 0.5s;
  z-index: -1;
  border-radius: 20px;
}

.collection_single_item:hover:before {
  width: 100%;
  left: 0;
}

.collection_content {
  padding: 0 178px 0 0;
}

.collection_content h3 {
  font-size: 32px;
  line-height: 42px;
  color: #1a1a1a;
  font-weight: 700;
  margin-bottom: 15px;
}

.collection_btn {
  margin-top: 38px;
}

.collection_btn a {
  padding: 12px 36px;
}

.collection_single_item.second .collection_btn a {
  background: #fff;
  color: #1a1a1a;
}

.collection_single_item.second .collection_btn a:hover {
  color: #ffff;
}

.collection_single_item.second .printmax_btn span {
  background: #0d223f;
}

.collection_thumb {
  position: absolute;
  right: 10%;
  bottom: 0%;
}

.collection_single_item.second .collection_thumb {
  position: absolute;
  right: 1%;
  bottom: 3%;
}

.collection_btn span {
  background: #fff;
}

.collection_shap {
  position: absolute;
  right: -25%;
  bottom: -48%;
  z-index: -1;
}

/*===========================================
<-- Sater Printmax About Area Css  -->
==============================================*/

section.about_area {
  background: url(../images/home_one/about_bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  padding: 60px 0 60px;
  position: relative;
}

.about_thumb {
  position: relative;
  z-index: 1;
}

.about_thumb_inner {
  margin-bottom: 20px;
  padding: 0 10px;
}

.about_thumb_inner img {
  width: 100%;
  border-radius: 15px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

.about_counter {
  background: #d7e6e8;
  text-align: center;
  padding: 34px 26px 34px;
  border-radius: 15px;
  padding: 40px 20px;
  border-radius: 15px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
  margin-bottom: 20px;
}

.about_counter-_number {
  display: inline-block;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  border: 1px solid rgba(26, 26, 26, 0.1);
  line-height: 120px;
  margin-bottom: 20px;
  position: relative;
  z-index: 1;
}

.about_img img {
  width: 100%;
  height: auto;
  border-radius: 15px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

/* Ensure no overlapping in the thumb row */
.about_thumb .row {
  display: flex;
  align-items: stretch;
  margin-left: -10px;
  margin-right: -10px;
}

.about_thumb .col-lg-6 {
  padding-left: 10px;
  padding-right: 10px;
}

.about_counter-_number:before {
  position: absolute;
  content: "";
  width: 94px;
  height: 94px;
  border-radius: 50%;
  background-color: #1a1a1a;
  left: 0;
  right: 0;
  margin: auto;
  z-index: -1;
  top: 11px;
}

.about_counter p {
  font-size: 18px;
  text-transform: uppercase;
  color: #131414;
  font-weight: 500;
}

.about_counter-_number h1 {
  font-size: 26px;
  text-transform: uppercase;
  color: #ffffff;
  font-weight: 700;
  display: inline-block;
}

.about_counter-_number span {
  font-size: 26px;
  text-transform: uppercase;
  color: #ffffff;
  font-weight: 700;
}

/* about Shape */
.about_shap {
  position: absolute;
  top: -6%;
  left: -11%;
  z-index: -1;
}

.about_shap1 {
  position: absolute;
  left: -5%;
  bottom: 25%;
}

.about_shap2 {
  position: absolute;
  right: 0;
  left: 0%;
  margin: auto;
  text-align: center;
  top: 37%;
  z-index: -1;
}

/* about content */

.about_content p {
  margin: 10px 0 10px;
  width: 100%;
}

.about_list ul li {
  font-size: 18px;
  color: #1a1a1a;
  font-weight: 500;
  margin-bottom: 13px;
}

.about_list ul li img {
  margin-right: 10px;
}

.about_btn {
  /* margin-top: 45px; */
  margin-top: 15px;
}

.about_btn a {
  display: inline-block;
  padding: 10px 25px;
  background: linear-gradient(45deg, #009eab, #027c7a);
  border-radius: 20px;
}

.about_btn a:hover {
  color: #fff;
}

.about_btn span {
  background: #0d223f;
}

.about_shaps {
  position: absolute;
  right: 20%;
  bottom: 18%;
}

/*===========================================
<-- Sater Printmax Collection Area Style Two  Css  -->
==============================================*/

section.collection_area.style_two {
  padding: 105px 0 120px;
}

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

.collection_img img {
  width: 100%;
}

.collection_img:before {
  position: absolute;
  content: "";
  left: 0;
  bottom: 0;
  width: 100%;
  height: 0%;
  background-image: linear-gradient(0deg,
      rgb(25 25 25 / 75%) 0%,
      rgb(25 25 25 / 69%) 6%,
      rgba(25, 25, 25, 0) 70%,
      rgba(25, 25, 25, 0) 100%);
  border-radius: 20px;
  transition: 0.5s;
}

.collection_img:hover:before {
  height: 100%;
}

.collection_img:hover .collection_contents {
  bottom: 6%;
  opacity: 1;
}

.collection_contents {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  text-align: center;
  opacity: 0;
  transition: 0.5s;
}

.collection_icon_btn a {
  display: inline-block;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #0d223f;
  text-align: center;
  line-height: 50px;
  color: #fff;
  font-size: 25px;
  position: relative;
  z-index: 1;
  overflow: hidden;
  margin-bottom: 5px;
}

.collection_icon_btn a:hover {
  color: #fff;
}

.collection_icon_btn a:before {
  position: absolute;
  content: "";
  left: 0;
  width: 0%;
  height: 100%;
  top: 0;
  background: #1a1a1a;
  transition: 0.5s;
  border-radius: 50%;
  z-index: -1;
}

.collection_icon_btn a:hover:before {
  width: 100%;
}

.collection_contents h3 a {
  font-size: 34px;
  color: #ffffff;
  font-weight: 600;
  font-family: "Overpass";
  display: inline-block;
}

.collection_contents h3 a:hover {
  color: #0d223f;
}

.collection_contents p {
  font-size: 20px;
  color: #ffffff;
  font-weight: 500;
  font-family: "Overpass";
  margin-top: 10px;
}

/* collection content second */

.collection_single_box.upper {
  margin-bottom: 30px;
}

.collection_img:hover .collection_contents.second {
  bottom: 10%;
}

.collection_contents.second h3 a {
  font-size: 22px;
  color: #ffffff;
  font-weight: 600;
}

.collection_contents.style_third h3 a {
  font-size: 28px;
}

.collection_img:hover .collection_contents.style_third {
  bottom: 10%;
}

/*===========================================
<-- Sater Css Section Title  -->
==============================================*/
.section_title.text-center {
  /* margin-bottom: 60px; */
  margin-bottom: 40px;
}

.section_title h4 {
  margin-bottom: 14px;
  font-size: 18px;
  color: #009eab;
  font-weight: 500;
}

.section_title h1 {
  /* font-size: 46px;
  line-height: 56px; */
  font-size: 40px;
  line-height: 45px;
  color: #000;
  /* font-weight: 700; */
  font-weight: 650;
  letter-spacing: -3px;
}

.section_title.style_left {
  padding-left: 208px;
  margin-bottom: 65px;
}

/*===========================================
<-- Sater Printmax Countdown Area  Css  -->
==============================================*/

section.countdown_area {
  background: url(../images/home_one/countdown_bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  padding: 88px 0 2px;
}

.countdown_thumbs {
  margin-left: -150px;
  margin-top: -67px;
}

.countdown_thumb {
  margin-left: -41px;
  top: -39px;
  position: relative;
}

.Countdown_content {
  position: relative;
}

.Countdown_content h2 {
  font-size: 60px;
  color: #1a1a1a;
  font-weight: 700;
}

/* Start Count Down css*/
.countdown_item {
  border-radius: 40px;
  background-color: #ffffff;
  border: 2px solid rgba(3, 24, 18, 0.1);
  display: inline-block;
  padding: 21px 25px 21px;
  margin: 30px 0 40px;
}

#clockdiv div>span {
  display: inline-block;
  font-size: 38px;
  color: #1a1a1a;
  font-weight: 600;
  font-family: "Overpass";
}

.countdown_number {
  display: inline-block;
}

.countdown_number strong {
  font-size: 38px;
  color: #1a1a1a;
  font-weight: 600;
  font-family: "Overpass";
  margin: 0 20px;
}

.countdown_shape {
  position: absolute;
  top: -36%;
  right: 0;
  left: 0;
}

.countdown_btn a {
  background: #1a1a1a;
  padding: 14px 45px;
  border-radius: 28px;
}

/*===========================================
<-- Sater Printmax Product Section  Css  -->
==============================================*/

section.product-section {
  padding: 105px 70px 97px;
}

.product-box-thumb {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
}

.product-icon {
  position: absolute;
  top: 0;
  right: 0;
  transition: 0.5s;
  visibility: hidden;
  opacity: 0;
}

.product_single_item.active .product-icon,
.product_single_item:hover .product-icon {
  top: 30px;
  visibility: visible;
  opacity: 1;
  right: 30px;
}

.product-icon ul li {
  display: block;
  margin: 10px 0;
}

.product-icon button {
  font-size: 16px;
  color: #1a1a1a;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background-color: #ffffff;
  line-height: 42px;
  position: relative;
  z-index: 1;
  transition: 0.5s;
  border: none;
}

.product-icon button::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #f7b098;
  border-radius: 50%;
  transform: scale(0);
  z-index: -1;
  transition: 0.5s;
}

.product-icon button:hover::after {
  transform: scale(1);
  filter: hue-rotate(360deg);
}

.product_contnet {
  text-align: center;
  margin: 30px 0 0;
}

.product_contnet h6 {
  font-size: 24px;
  color: #1a1a1a;
  font-weight: 600;
  font-family: "Overpass";
  margin: 0 0 6px;
}

.product_contnet p {
  font-size: 16px;
  color: #0d223f;
  font-weight: 500;
  font-family: "Overpass";
}

.product_list .owl-nav {
  position: absolute;
  top: -26%;
  right: 12%;
  display: flex;
}

.product_list .owl-prev i {
  width: 60px;
  height: 60px;
  border-radius: 30px;
  background-color: #ffffff;
  border: 1px solid #1a1a1a;
  line-height: 60px;
  text-align: center;
  font-weight: 600;
  display: inline-block;
  color: #1a1a1a;
  position: relative;
  z-index: 1;
  transition: 0.5s;
  margin-right: 15px;
}

.product_list .owl-next i {
  width: 60px;
  height: 60px;
  border-radius: 30px;
  background-color: #ffffff;
  border: 1px solid #1a1a1a;
  line-height: 60px;
  text-align: center;
  font-weight: 600;
  display: inline-block;
  color: #1a1a1a;
  position: relative;
  z-index: 1;
  transition: 0.5s;
}

.product_list .owl-prev i:hover,
.owl-next i:hover {
  background: #0d223f;
  border: 1px solid #0d223f;
}

/*===========================================
<-- Sater Css Printmax Feature Area Style Two -->
==============================================*/

section.feature_area.style_two {
  background: #edf5f6;
  padding: 105px 0 107px;
  position: relative;
  z-index: 1;
}

.feature_item.style_two {
  background: #fff;
  display: block;
  padding: 40px 0 26px 30px;
  transition: 0.5s;
}

.feature_item.style_two:hover {
  filter: drop-shadow(0px 10px 27px rgba(177, 177, 177, 0.3));
}

.feature_item.style_two:before {
  display: none;
}

.feature_item.style_two .feature_icon {
  float: left;
  margin-right: 25px;
}

.feature_item.style_two .feature_content {
  overflow: hidden;
}

.feature_item.style_two .feature_content h3 {
  font-size: 22px;
  color: #1a1a1a;
  font-weight: 600;
  margin: 0 0 10px;
}

.feature_shape {
  position: absolute;
  top: 15%;
  right: 11%;
}

.feature_shape2 {
  position: absolute;
  left: 5%;
  top: 19%;
  z-index: -1;
}

/*===========================================
<-- Sater Css Printmax Marqee Area -->
==============================================*/

.marquee_area {
  position: relative;
  background: #1a1a1a;
}

.marquee_bg {
  background: linear-gradient(45deg, #009eab, #027c7a);
  /* padding: 35px 0 36px; */
  padding: 25px 0 25px;
  /* transform: rotate(-1deg); */
}

.marquee {
  position: relative;
  --duration: 40s;
  --gap: 0px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  gap: 0;
}

.marquee-block {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  gap: 0px;
  min-width: 100%;
  -webkit-animation: scroll 30s linear infinite;
  animation: scroll 30s linear infinite;
}

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

  100% {
    -webkit-transform: translateX(calc(-100% - var(--gap)));
    transform: translateX(calc(-100% - var(--gap)));
  }
}

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

  100% {
    -webkit-transform: translateX(calc(-100% - var(--gap)));
    transform: translateX(calc(-100% - var(--gap)));
  }
}

.marquee-block h3 {
  /* margin: 0 40px 0 0; */
  margin: 0 30px 0 0;
  /* font-size: 30px; */
  font-size: 25px;
  color: #ffffff;
  font-weight: 600;
  padding-left: 0;
  display: flex;
  align-items: center;
}

.marquee-block span {
  /* margin-right: 40px; */
  margin-right: 25px;
}

/*===========================================
<-- Sater Css Printmax Popular product Area -->
==============================================*/

section.popular_product {
  padding: 130px 0 120px;
}

.popular_thumb {
  position: relative;
}

.popular_product_btn {
  position: absolute;
  bottom: 40px;
  left: 8%;
  right: 0;
  margin: auto;
  text-align: center;
}

.popular_btn {
  display: inline-block;
}

.popular_btn_arrow {
  display: inline-block;
}

.popular_btn a {
  background: #ffff;
  border: 1px solid #1a1a1a;
  padding: 15px 145px;
  font-size: 17px;
  color: #1a1a1a;
  font-weight: 500;
  font-family: "Cabin";
  border-radius: 30px;
}

.popular_btn_arrow a {
  border-radius: 50%;
  padding: 0;
  display: inline-block;
  width: 60px;
  height: 60px;
  background-color: #1a1a1a;
  line-height: 60px;
  text-align: center;
}

.popular_btn_arrow a:hover {
  color: #fff;
}

.popular_btn_arrow span {
  background: #0d223f;
}

.popular_btn_arrow a i {
  font-size: 14px;
  font-weight: 600;
  transform: rotate(0deg);
  display: inline-block;
  margin-left: 0;
  color: #fff !important;
}

.popular_product_card {
  border: 1px solid rgba(26, 26, 26, 0.15);
  padding: 20px 20px 20px;
  border-radius: 10px;
}

.popular_product_card_inner {
  display: flex;
  align-items: center;
}

.popular_content {
  margin-left: 40px;
}

.popular_content p {
  margin: 7px 0 10px;
}

.popular_content h3 {
  font-size: 24px;
  color: #1a1a1a;
  font-weight: 600;
}

.popular_content span.dolar {
  font-size: 16px;
  color: #0d223f;
  font-weight: 500;
}

.star_icon i {
  font-size: 14px;
  color: #ff7d2e;
  margin: 12px 1px 35px;
}

.card_all_btn {
  display: flex;
  align-items: center;
}

.card_btn a {
  border-radius: 5px;
  font-size: 15px;
  color: #1a1a1a;
  font-weight: 500;
  background: #edf5f6;
  padding: 8px 23px;
}

.card_icon button {
  font-size: 16px;
  color: #1a1a1a;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background-color: #edf5f6;
  position: relative;
  z-index: 1;
  transition: 0.5s;
  border: none;
  line-height: 42px;
  top: -4px;
  margin-left: 10px;
}

.card_icon button::after {
  position: absolute;
  content: "";
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #f7b098;
  border-radius: 50%;
  transform: scale(0);
  z-index: -1;
  transition: 0.5s;
}

.card_icon button:hover::after {
  transform: scale(1);
  filter: hue-rotate(360deg);
}

/* owlCarousel */
.card_list .owl-nav {
  position: absolute;
  bottom: -22%;
  left: 12px;
  display: flex;
}

.card_list .owl-prev i {
  width: 50px;
  height: 50px;
  border-radius: 10px;
  background-color: #ffffff;
  border: 1px solid rgba(26, 26, 26, 0.15);
  line-height: 50px;
  text-align: center;
  font-weight: 600;
  display: inline-block;
  color: #1a1a1a;
  position: relative;
  z-index: 1;
  transition: 0.5s;
  margin-right: 15px;
}

.card_list .owl-next i {
  width: 50px;
  height: 50px;
  border-radius: 10px;
  background-color: #ffffff;
  border: 1px solid rgba(26, 26, 26, 0.15);
  line-height: 50px;
  text-align: center;
  font-weight: 600;
  display: inline-block;
  color: #1a1a1a;
  position: relative;
  z-index: 1;
  transition: 0.5s;
  margin-right: 15px;
}

.card_list .owl-prev i:hover,
.owl-next i:hover {
  background: #0d223f;
  border: 1px solid #0d223f;
}

section.testimonial_area {
  background: #f7f1ee;
  padding: 40px 0 40px;
  position: relative;
  z-index: 1;
}

.testimonial-content {
  background: #fff;
  text-align: center;
  padding: 30px 25px 25px;
  position: relative;
  border-radius: 10px;
}

.testimonial-content:before {
  content: "";
  position: absolute;
  right: 41%;
  top: 100%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  border-top: 20px solid #fff;
  border-left: 20px solid transparent;
  border-right: 20px solid transparent;
  transition: 0.5s;
}

.testimonial-content p {
  font-size: 20px;
  line-height: 34px;
  color: #5d5f62;
  font-weight: 400;
  font-family: "Cabin";
  margin-bottom: 19px;
  margin-top: 20px;
}

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

.testi-star i {
  font-size: 15px;
  color: #ff7d2e;
  margin-right: 3px;
}

.tesit-auothor {
  text-align: center;
  margin-top: 40px;
}

.testi-author-thumb {
  text-align: center;
  display: inline-block;
}

.testi_bio h4 {
  font-size: 22px;
  color: #1a1a1a;
  font-weight: 600;
}

.testi_bio h5 {
  font-size: 17px;
  color: #5d5f62;
  font-weight: 400;
  font-family: "Cabin";
}

.testi_rating {
  border-top: 1px solid rgba(6, 50, 50, 0.10196078431372549);
  padding-top: 10px;
  position: relative;
}

.testi_rating_content {
  display: flex;
  align-items: center;
}

.rating-_number h1 {
  font-size: 58px;
  color: #0d223f;
  font-weight: 700;
  position: relative;
  margin-right: 52px;
}

.rating-_number h1:before {
  position: absolute;
  content: "";
  right: -25px;
  top: 12px;
  width: 1px;
  height: 44px;
  background-color: rgba(3, 24, 18, 0.2);
}

.rating-star i {
  font-size: 15px;
  color: #ff7d2e;
  margin-right: 5px;
}

h5.title_two {
  font-size: 17px;
  color: #5d5f62;
  font-weight: 400;
  margin-top: 7px;
}

.testi_shape {
  position: absolute;
  right: -24%;
  left: 0;
  text-align: center;
  bottom: 22%;
  z-index: -1;
}

section.testimonial_area .owl-carousel .owl-item img {
  display: block;
  width: inherit;
}

/* owlCarousel */
.testimonial .owl-nav {
  position: absolute;
  top: -75px;
  right: 0;
  display: flex;
  gap: 10px;
  z-index: 1000;
  pointer-events: auto;
}

.testimonial .owl-next i {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #ffffff;
  border: 1px solid rgba(1, 150, 160, 0.15);
  line-height: 50px;
  text-align: center;
  font-weight: 600;
  display: inline-block;
  color: #0196a0;
  position: relative;
  z-index: 1;
  transition: all 0.4s;
}

.testimonial .owl-prev i {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: #ffffff;
  border: 1px solid rgba(1, 150, 160, 0.15);
  line-height: 50px;
  text-align: center;
  font-weight: 600;
  display: inline-block;
  color: #0196a0;
  position: relative;
  z-index: 1;
  transition: all 0.4s;
}

.testimonial .owl-prev i:hover,
.testimonial .owl-next i:hover {
  background: #0196a0;
  border: 1px solid #0196a0;
  color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 10px 20px rgba(1, 150, 160, 0.2);
}

/*===========================================
<-- Sater Css Brand Area -->
==============================================*/
section.brand_area {
  padding: 120px 0 53px;
}

.brand_container {
  border: 1px solid #1a1a1a;
  margin: 0;
}

.single_brnd_item {
  text-align: center;
  padding: 70px 0 70px;
  border-right: 1px solid #1a1a1a;
}

section.brand_area .owl-carousel .owl-item img {
  display: inline-block !important;
  width: inherit;
}

section.brand_area.style_two {
  background: #edf5f6;
  padding: 40px 0 120px;
}

section.brand_area.inner_page {
  padding: 120px 0 120px;
}

/*===========================================
<-- Sater Css Blog Area -->
==============================================*/

section.blog_area {
  padding: 50px 0 65px;
}

.single-blog-box {
  margin-bottom: 30px;
  position: relative;
  overflow: hidden;
}

.single-blog-thumb {
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.single-blog-thumb:before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.5);
  content: "";
  -webkit-transition: all 0.1s;
  transition: all 0.6s;
  z-index: 2;
  -webkit-transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, -45deg) translate3d(0, -150%, 0);
  transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, -45deg) translate3d(0, -150%, 0);
}

.single-blog-box:hover .single-blog-thumb::before {
  -webkit-transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, -45deg) translate3d(0, 150%, 0);
  transform: scale3d(1.9, 1.4, 1) rotate3d(0, 0, 1, -45deg) translate3d(0, 150%, 0);
}

.blog-content {
  margin: 28px 72px 0 0;
}

.blog-title h3 a {
  display: inline-block;
  font-size: 24px;
  line-height: 34px;
  color: #1a1a1a;
  font-weight: 600;
  transition: 0.5s;
}

.blog-title h3 a:hover {
  color: #0d223f;
}

.meta-blog p {
  font-size: 16px;
  color: #5d5f62;
  font-weight: 400;
  border-top: 1px solid rgba(26, 26, 26, 0.10196078431372549);
  margin-top: 16px;
  padding-top: 18px;
  position: relative;
  padding-left: 18px;
}

.meta-blog p:before {
  position: absolute;
  content: "";
  left: 0;
  top: 27px;
  width: 8px;
  height: 8px;
  border-radius: 4px;
  background-color: #0d223f;
}

/* Start Blog Area Style Two  */
section.blog_area.style_two {
  background: #edf5f6;
  padding: 105px 0 27px;
}

/*===========================================
<-- Sater Css Footer Area -->
==============================================*/

.footer_area {
  /* background: url(../images/home_one/footer_bg.jpg); */
  background: linear-gradient(45deg, #009eab, #027c7a);
  /* padding: 120px 0 30px; */
  padding: 40px 0 15px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

p.footer_desc {
  font-weight: 400;
  /* margin: 29px 0 27px; */
  margin: 20px 0 27px;
  /* width: 81%; */
  width: 95%;
  text-align: justify;
  line-height: 1.8;
  color: #fff;
}

.footer_info p {
  font-size: 16px;
  color: #1a1a1a;
  font-weight: 500;
  margin-bottom: 0;
}

.footer_info p i {
  margin-right: 8px;
  position: relative;
  top: 2px;
  font-size: 14px;
  color: #0d223f;
}

.footer_info h6 {
  font-size: 24px;
  color: #1a1a1a;
  font-weight: 600;
}

.footer-widget-title h4 {
  margin-bottom: 34px;
  font-size: 26px;
  color: #fff;
  font-weight: 600;
}

.footer-widget-menu ul li a {
  display: inline-block;
  margin-bottom: 14px;
  font-size: 17px;
  font-weight: 500;
  font-family: "Cabin";
  /* margin-left: -15px; */
  margin-left: 5px;
  color: #fff;
}

.footer-widget-menu ul li a:hover {
  margin-left: 0;
  /* color: #40c596; */
  color: #000;
}

.footer-widget-menu ul li a i {
  font-size: 12px;
  opacity: 0;
  transition: 0.5s;
}

.footer-widget-menu ul li a:hover i {
  opacity: 1;
}

.subscribe_form {
  position: relative;
}

p.subscribe_text {
  width: 87%;
  margin-bottom: 23px;
}

.subscribe_form input {
  background: #fff;
  width: 100%;
  outline: 0;
  color: #1a1a1a !important;
  height: 60px;
  background-color: #ffffff;
  border: 1px solid rgba(26, 26, 26, 0.1);
  border-radius: 0 30px 30px 0;
  padding: 0 24px;
}

.subscribe_form input::placeholder {
  font-size: 17px;
  color: #1a1a1a;
  font-weight: 500;
}

.subscribe_form input:focus {
  outline: 0;
  background: transparent;
  box-shadow: none;
}

button.btn i {
  border-radius: 18px;
  font-size: 18px;
  color: #0d223f;
  position: absolute;
  top: 15px;
  font-weight: 600;
  right: 38px;
}

button.btn i:hover {
  color: #1a1a1a;
}

.footer_social_icon {
  margin-top: 5px;
}

.footer_social_icon a {
  width: 40px;
  height: 40px;
  border-radius: 20px;
  background-color: #ffffff;
  border: 1px solid rgba(26, 26, 26, 0.1);
  display: inline-block;
  text-align: center;
  line-height: 40px;
  font-size: 15px;
  margin-right: 4px;
  position: relative;
  overflow: hidden;
  z-index: 1;
}

.footer_social_icon a:hover {
  color: #fff;
}

.footer_social_icon a:before {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 0%;
  background: #0d223f;
  transition: 0.5s;
  content: "";
  z-index: -1;
}

.footer_social_icon a:hover:before {
  width: 100%;
}

/* footer bottom */

.row.add-border {
  position: relative;
  /* padding-top: 22px; */
  padding-top: 15px;
  /* margin-top: 110px; */
  /* margin-top: 20px; */
  background: #132854;
  padding-bottom: 10px;
}

.row.add-border:before {
  position: absolute;
  top: 0;
  left: 12px;
  height: 1px;
  width: 98%;
  background: rgb(87 54 54 / 15%);
  content: "";
}

.footer-bottom-content-copy p {
  text-align: center;
  margin: 0;
  font-size: 17px;
  color: #fff;
  font-weight: 400;
}

.payments {
  text-align: right;
}

/* ================================================ */
/* Start Css Home Two */
/* ================================================ */

section.topber_area {
  background: #0d223f;
  position: relative;
  z-index: 1;
  padding: 12px 8px 12px 29px;
}

section.topber_area:after {
  position: absolute;
  top: 0;
  left: -2%;
  height: 100%;
  width: 28%;
  background: #031812;
  content: "";
  z-index: -1;
  transform: skew(-40deg);
}

section.topber_area:before {
  position: absolute;
  top: 0;
  right: -2%;
  height: 100%;
  width: 28%;
  background: #031812;
  content: "";
  z-index: -1;
  transform: skew(40deg);
}

.header-address-info {
  text-align: right;
}

.header-address-info p {
  margin: 0;
}

.header-address-info span {
  font-size: 16px;
  color: #ffffff;
  font-weight: 400;
  font-family: "Cabin";
  margin-right: 40px;
}

.header-address-info p i {
  margin-right: 8px;
  font-size: 15px;
  color: #0d223f;
}

.top_print_text p {
  font-size: 16px;
  color: #ffffff;
  margin: 0;
  text-align: center;
}

.topber_right_social {
  display: flex;
  align-items: center;
}

h4.topber_follow {
  font-size: 15px;
  color: #ffffff;
  font-weight: 400;
  font-family: "Cabin";
  margin: 0;
}

.topber_right_social ul li {
  display: inline-block;
  margin-left: 20px;
}

.topber_right_social ul li a {
  display: inline-block;
  color: #fff;
  font-size: 15px;
}

.topber_right_social ul li a:hover {
  color: #0d223f;
}

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

.printmax-header-area.style_two {
  margin-bottom: 0;
  padding: 16px 50px 16px 10px;
  border-bottom: 0;
}

.printmax-header-area.style_two ul {
  display: inline-block;
  margin-left: 0;
}

.printmax-header-area.style_two .header-logo {
  text-align: center;
}

.header_right.style_two {
  justify-content: right;
}

.search-containers {
  display: inline-block;
  position: relative;
  margin-right: 25px;
}

.search-containers input {
  padding: 0 29px;
  width: 100%;
  color: black;
  height: 48px;
  border-radius: 24px;
  background-color: #ffffff;
  border: 1px solid rgba(3, 24, 18, 0.1);
  outline: 0;
}

.search-containers input::placeholder {
  color: #5d5f62;
  font-weight: 400;
  font-family: "Cabin";
}

.search-containers button {
  position: absolute;
  top: 24%;
  color: #5d5f62;
  right: 10%;
  outline: 0;
  border: 0;
  background: transparent;
  font-size: 15px;
}

.header_right.style_two button.cart_btn.headers-button {
  background: #f8f4ee;
  border: 0;
}

.header_right.style_two button.cart_btn.headers-button:hover {
  background: #0d223f;
}

.header_right.style_two small.cart_counter {
  background: #0d223f;
  transition: 0.5s;
}

.header_right.style_two button.cart_btn.headers-button:hover small.cart_counter {
  background: #031812;
}

.header_right.style_two .nav-btn.navSidebar-button {
  margin-top: -5px;
}

.header_right.style_two .nav-btn.navSidebar-button span {
  background-color: #f7f1ee;
}

/* ================================================ */
/* Start Css Hero Area Style Two */
/* ================================================ */

section.hero_area.style_two {
  background: url(../images/home-two/banner.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  height: 750px;
}

.hero_content.style_two {
  margin-top: 0;
}

.hero_content.style_two h4 {
  margin-bottom: 16px;
  font-size: 18px;
  text-transform: uppercase;
  font-weight: 500;
  font-family: "Cabin";
}

.hero_content.style_two h1 {
  font-size: 60px;
  line-height: 74px;
  text-transform: unset;
}

.hero_content.style_two .slider_button {
  justify-content: center;
  margin-top: 44px;
}

.hero_content.style_two .banner_btn a {
  background: #1a1a1a !important;
  padding: 15px 39px !important;
  border-radius: 28px !important;
  font-size: 18px !important;
  font-family: "Cabin" !important;
}

.hero_content.style_two .popular_btn_arrow a {
  background-color: #0d223f;
}

.hero_content.style_two .popular_btn_arrow a i {
  color: #fff;
}

.hero_content.style_two .popular_btn_arrow span {
  background-color: #000000;
}

/* hreo left werapper */

.hero_left_wrapper {
  position: absolute;
  left: 11%;
  top: 50%;
  transform: translateY(-50%);
}

.hero_left_img {
  position: relative;
  z-index: 1;
}

.img_two {
  position: absolute;
  top: -14%;
  left: -43%;
  z-index: -1;
  -webkit-animation-name: rotateme;
  animation-name: rotateme;
  -webkit-animation-duration: 20s;
  animation-duration: 20s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  background-position: center center;
}

@keyframes rotateme {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.hero_left_wrapper_shape {
  position: absolute;
  right: 0%;
  top: -14%;
}

.hero_left_wrapper_shape2 {
  position: absolute;
  left: -52%;
  bottom: 39%;
  transform: translateY(10px);
}

.hero_left_wrapper_shape3 {
  position: absolute;
  bottom: 19%;
  right: -5%;
}

/* hreo Right werapper */

.hero_right_wrapper {
  position: absolute;
  right: 8%;
  top: 45%;
  transform: translateY(-50%);
}

.img_wrapper_two {
  position: absolute;
  top: 13%;
  right: -12%;
  z-index: -1;
  -webkit-animation-name: rotateme;
  animation-name: rotateme;
  -webkit-animation-duration: 20s;
  animation-duration: 20s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  background-position: center center;
}

@keyframes rotateme {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.hero_right_wrapper_shape {
  position: absolute;
  left: -29%;
  bottom: -4%;
}

.hero_right_wrapper_shape2 {
  position: absolute;
  top: 17%;
  left: -16%;
}

/* hero shape */

.hero_wrappe_shpa {
  position: absolute;
  left: 0;
  right: 0;
  text-align: center;
  bottom: 15%;
}

/* ================================================ */
/* Start Css Feature Area Style Three */
/* ================================================ */
section.feature_area.style_three {
  padding: 60px 0 69097 0px;
}

.feature_item.style_three {
  display: block;
  overflow: hidden;
  padding: 45px 11px 32px 40px;
}

.style_three .feature_content h3 {
  font-size: 28px;
  color: #1a1a1a;
  font-weight: 600;
  margin: 0 0 13px;
}

.feature_btn a {
  height: 45px;
  width: 45px;
  line-height: 45px;
  background: #0d223f;
  display: inline-block;
  text-align: center;
  font-size: 16px;
  color: #fff;
  font-weight: 700;
  border-radius: 50%;
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.feature_btn a:before {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  width: 0;
  height: 100%;
  background: #f8b097;
  transition: 0.5s;
  z-index: -1;
}

.feature_btn a:hover:before {
  width: 100%;
}

.feature_btn {
  margin-top: 108px;
}

.feature_img {
  position: absolute;
  bottom: -45%;
  right: -12%;
  z-index: -1;
}

.feature_img.second {
  bottom: -30%;
  right: 6%;
}

.feature_img.third {
  bottom: -24%;
  right: -8%;
}

/* ================================================ */
/* Start Css About Area Style Two */
/* ================================================ */

section.about_area.style_two {
  background: transparent;
  padding: 0 0 120px;
}

section.about_area.style_two .style_two .about_thumb {
  margin-left: -15px;
}

.about_shapse {
  position: absolute;
  top: 10%;
  left: 0;
  right: 0;
  margin: auto;
  text-align: center;
}

.about_shaps1 {
  position: absolute;
  right: 10%;
  bottom: 3%;
}

.about_shaps2 {
  position: absolute;
  top: 9%;
  left: 9%;
}

.about_shaps3 {
  position: absolute;
  right: 11%;
  top: 14%;
}

.about_shaps4 {
  position: absolute;
  bottom: 20%;
  left: 8%;
  transform: rotate(17deg);
}

section.about_area.style_two .section_title h1 {
  font-size: 40px;
}

section.about_area.style_two .about_content {
  background: url(../images/home-two/abt_img.png);
  padding: 57px 0 62px 60px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  border-radius: 20px;
}

.about_btn_list {
  display: flex;
  align-items: center;
}

.about_btn_list .about_btn {
  margin-top: 0;
}

.style_two .about_list ul li {
  font-size: 16px;
  color: #1a1a1a;
  font-weight: 400;
  font-family: "Overpass";
  background: #fff;
  display: inline-block;
  padding: 10px 30px;
  border-radius: 23px;
  margin-right: 10px;
  margin-bottom: 20px;
}

.style_two .about_list ul li i {
  color: #0d223f;
  margin-right: 15px;
}

.popular_btn_arrow.style_two a {
  width: 56px;
  height: 56px;
  background-color: #0d223f;
  line-height: 56px;
}

.popular_btn_arrow.style_two span {
  background: #000;
}

/* Marque Area Style Two */

.marquee_area.style_two {
  position: relative;
  background: transparent;
}

.style_two .marquee_bg {
  transform: rotate(0deg);
  padding: 40px 0 40px;
}

.style_three .marquee_bg {
  transform: rotate(0deg);
  background: #f8b097;
  padding: 40px 0 40px;
}

.style_three .marquee-block h3 {
  color: #031812;
}

/* ================================================ */
/* Start Css service Area */
/* ================================================ */

section.service_area {
  padding: 105px 0 120px 291px;
}

.service_single_item {
  background: #f7f1ee;
  padding: 50px 35px 42px;
  border-radius: 20px;
  position: relative;
  z-index: 1;
}

.service_single_item:before {
  position: absolute;
  content: "";
  left: 50%;
  top: 0;
  height: 100%;
  width: 0;
  background: url(../images/home-two/service_img1.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  transition: 0.5s;
  z-index: -1;
  border-radius: 20px;
}

.service_single_item:hover:before {
  width: 100%;
  left: 0;
}

.service_content h3 {
  font-size: 26px;
  color: #fff;
  font-weight: 600;
  margin: 35px 0 28px;
}

.service_button {
  display: flex;
  align-items: center;
}

.service_btn a {
  padding: 13px 110px 13px 35px;
  background: #fff;
  color: #031812;
}

.service_btn a:hover {
  color: #fff;
}

.service_btn span {
  background: #0d223f;
}

.service_button .popular_btn_arrow a {
  width: 54px;
  height: 54px;
  background-color: #fff;
  line-height: 52px;
}

.service_button .popular_btn_arrow a i {
  color: #000 !important;
}

.popular_btn_arrow a:hover i {
  color: #ffff;
}

section.service_area .owl-carousel .owl-item img {
  display: block;
  width: inherit;
}

.service_list .owl-nav {
  position: absolute;
  top: -31%;
  right: 26%;
  display: flex;
}

.service_list .owl-prev i {
  width: 60px;
  height: 60px;
  border-radius: 30px;
  background-color: #edf5f6;
  line-height: 60px;
  text-align: center;
  font-weight: 600;
  display: inline-block;
  color: #1a1a1a;
  transition: 0.5s;
  margin-right: 15px;
}

.service_list .owl-next i {
  width: 60px;
  height: 60px;
  border-radius: 30px;
  background-color: #edf5f6;
  line-height: 60px;
  text-align: center;
  font-weight: 600;
  display: inline-block;
  color: #1a1a1a;
  transition: 0.5s;
}

.service_list .owl-prev i:hover {
  background: #0d223f;
}

.service_list .owl-next i:hover {
  background: #0d223f;
  border: none;
}

/* ================================================ */
/* Start Css Printing Area */
/* ================================================ */

section.printing_area {
  /* background: #edf5f6; */
  background: #fff;
  /* padding: 120px 0 120px; */
  padding: 60px 0 70px;
}

.printing_thumb {
  position: relative;
  margin-left: -83px;
}

.printing_shape {
  position: absolute;
  left: 0%;
  bottom: 3%;
}

.printing_content p {
  /* margin: 20px 0 28px; */
  margin: 12px 0 18px;
  /* width: 84%; */
  width: 100%;
  color: #444;
  text-align: justify;
  line-height: 2;
}

.printing_icon_box {
  display: flex;
  align-items: center;
  padding: 0 40px 0 0;
}

.printing_icon {
  width: 60px;
  height: 60px;
  border-radius: 10px;
  background-color: #0d223f;
  line-height: 60px;
  text-align: center;
  flex-shrink: 0;
  margin-right: 20px;
}

.printing_icon_box.style_two .printing_icon {
  background-color: #f8b097;
}

.printing_content h3 {
  font-size: 18px;
  color: #1a1a1a;
  font-weight: 500;
  margin: 0;
}

.printing_list.printing_werpper {
  border-top: 1px solid #5d5f6257;
  padding-top: 22px;
  margin-top: 30px;
}

.printing_list ul li {
  font-size: 18px;
  color: #1a1a1a;
  font-weight: 500;
  margin-bottom: 13px;
}

.printing_list ul li img {
  margin-right: 10px;
}

.printing-thumb {
  position: relative;
}

.print_counter {
  position: absolute;
  top: 8%;
  right: 19%;
}

.print_counter-_number {
  background: #ffff;
  padding: 45px 58px;
  border-radius: 50%;
  text-align: center;
  position: relative;
  z-index: 1;
  width: 199px;
}

.print_counter-_number:before {
  position: absolute;
  content: "";
  left: 0;
  right: 0;
  top: 11%;
  width: 157px;
  height: 157px;
  border-radius: 78px;
  background-color: #dcebed;
  z-index: -1;
  margin: auto;
  text-align: center;
}

.print_counter-_number p {
  color: #031812;
  font-weight: 500;
}

.print_counter-_number h1 {
  font-size: 46px;
  color: #0d223f;
  font-weight: 700;
  font-family: "Cabin";
  display: inline-block;
}

.print_counter-_number span {
  font-size: 46px;
  color: #0d223f;
  font-weight: 700;
}

/* ================================================= */
/* Start Printmax Package Area  */
/* ================================================= */

section.package_area {
  padding: 120px 0 120px;
}

.package_shape {
  position: absolute;
  top: 20%;
  left: 11%;
}

.package_shaps1 {
  position: absolute;
  top: 9%;
  left: 17%;
}

.package_shaps2 {
  position: absolute;
  bottom: 36%;
  left: 9%;
}

.printing_btn {
  left: -8%;
  margin: auto;
  right: 0;
  display: flex;
  align-items: center;
  position: absolute;
  bottom: 8%;
  text-align: center;
  justify-content: center;
}

.printing_btn .service_btn a {
  padding: 15px 138px;
  background: #fff;
  color: #031812;
  border: 1px solid black;
  border-radius: 30px;
}

.printing_btn .popular_btn_arrow a i {
  color: #fff;
}

.package_content {
  text-align: center;
  margin-top: 26px;
}

.package_content h3 {
  font-size: 20px;
  color: #031812;
  font-weight: 500;
  margin-bottom: 8px;
  cursor: pointer;
}

.package_content p {
  font-size: 18px;
}

.Package_list .owl-dots {
  position: relative;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
  bottom: -16%;
}

.Package_list .owl-dot {
  width: 12px;
  height: 12px;
  border-radius: 6px;
  background-color: rgba(243, 51, 80, 0);
  border: 1px solid rgba(3, 24, 18, 0.3);
  margin-right: 10px;
  display: inline-block;
}

.Package_list .owl-dot.active {
  background: #0d223f;
  border: 1px solid #0d223f;
}

/* Start Printmax Testimonai Area Style Two  */

section.testimonial_area.style_three {
  padding: 120px 0 120px !important;
}

.testi_ratings {
  text-align: right;
}

/* ================================================= */
/* Start Printmax Product Area  Style Twp  */
/* ================================================= */

section.product-section.style_two {
  /* padding: 105px 0 80px; */
  padding: 65px 0 40px;
}

.product_single_item.style_two {
  margin-bottom: 30px;
}

.style_two .product-box-thumb img {
  width: 100%;
  transition: 0.5s;
}

.product_single_item.style_two:hover .product-box-thumb img {
  transform: scale(1.1);
}

p.product_hot {
  font-size: 12px;
  color: #031812;
  font-weight: 500;
  font-family: "Overpass";
  width: 55px;
  height: 26px;
  border-radius: 4px;
  background-color: #f8b097;
  text-align: center;
  position: absolute;
  top: 5%;
  left: 5%;
}

span.pruduct_discount {
  font-size: 12px;
  color: #ffffff;
  font-weight: 500;
  font-family: "Overpass";
  border-radius: 4px;
  background-color: #0d223f;
  position: absolute;
  display: inline-block;
  top: 15%;
  left: 5%;
  width: 55px;
  height: 26px;
  text-align: center;
}

.style_two .product_contnet {
  text-align: left;
  margin: 25px 0 0;
}

.product_rating i {
  color: #ffb018;
  font-size: 14px;
  margin-right: 4px;
}

.style_two .product_contnet h6 {
  font-size: 22px;
  font-weight: 650;
  margin: 11px 0 13px;
  cursor: pointer;
  text-align: center;
}

/* ================================================= */
/* Start Printmax Download Area  */
/* ================================================= */

section.download_app_area {
  background: url(../images/home-two/app_bg.png);
  background-position: center center;
  background-repeat: no-repeat;
  padding: 42px 0 0;
  background-size: cover;
}

.app_content {
  position: relative;
}

.apps_shape {
  position: absolute;
  right: 18%;
  bottom: -2%;
}

.app_content h2 {
  font-size: 46px;
  line-height: 56px;
  color: #031812;
  font-weight: 700;
}

ul.app_btn li {
  display: inline-block;
  margin-right: 13px;
  margin-top: 38px;
}

.app_thumb {
  position: relative;
  z-index: 1;
  margin-bottom: -37px;
}

img.app_rotate {
  position: absolute;
  top: 9%;
  z-index: -1;
  left: 4%;
}

/* =============================== */
/* cart sidebar - start */
/* =============================== */

.sidebar-product-wrapper {
  display: block;
}

.product_sidebar {
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
  position: fixed;
  padding: 50px 20px;
  background-color: transparent;
  transition: 0.6s cubic-bezier(1, 0, 0, 1);
  transform: scale(0);
}

.product_sidebar .mCustomScrollBox {
  overflow: visible !important;
}

.product_sidebar.active {
  transform: scale(1);
}

.product_sidebar .close_btn {
  top: 15px;
  right: 20px;
  line-height: 1;
  font-size: 24px;
  position: absolute;
}

.product_sidebar .close_btns:hover {
  color: #0d223f;
}

.product_inner {
  background: #f7f1ee;
  padding: 50px 50px 50px;
  border-radius: 20px;
}

.product-size {
  margin-bottom: 30px;
  display: flex;
  align-items: center;
  margin-top: 31px;
}

span.sub-title {
  margin-right: 50px;
  font-size: 20px;
  color: #1a1a1a;
  font-weight: 500;
}

.product-size ul li {
  margin: 0 2px;
  display: inline-block;
}

.product-size ul li a {
  height: 40px;
  width: 40px;
  border: 1px solid #23262a;
  display: block;
  line-height: 40px;
  text-align: center;
  font-weight: 500;
  color: #1a1a1a;
}

.product-size ul li a:hover {
  background: green;
  border-color: black;
  color: #fff;
}

.product-color {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
}

.product-color .nice-select {
  border: 1px solid #23262a;
  border-radius: 0;
  height: 40px;
  line-height: 39px;
}

.product-color .nice-select .list {
  display: inline-grid;
}

.product-quantity {
  display: flex;
  align-items: center;
  margin-bottom: 30px;
}

select.select_option {
  outline: 0;
  border: 1px solid black;
  padding: 10px 20px;
  background: transparent;
  color: #5d5f62;
}

/*=====================================
<-- Printmax pop up Css -->
=======================================*/

.confirm-box {
  background: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
}

.message-box {
  background: #fff;
  text-align: center;
  font-family: "Outfit", sans-serif;
  font-size: 22px;
  line-height: 1.5;
  padding: 20px;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
  color: #062e5f;
  font-weight: 500;
}

.button-box {
  margin-top: 30px;
}

.yes-button,
.no-button {
  padding: 8px 20px;
  font-size: 16px;
  margin: 0 20px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
  color: #fff;
  transition: 0.5s;
}

.yes-button:hover,
.no-button:hover {
  filter: hue-rotate(360deg);
}

.yes-button {
  background: #ff7a1f;
}

.no-button {
  background: #062e5f;
}

/* ============================================= */
/* Start Home Three */
/* ============================================= */

section.hero_area.style_three {
  background: url(../images/home-three/banner.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  height: 900px;
  position: relative;
}

.hero_content.style_three {
  margin-top: 102px;
}

.hero_content.style_three h4 {
  font-size: 18px;
  color: #1a1a1a;
  font-weight: 500;
  font-family: "Overpass";
  text-transform: capitalize;
}

.hero_content.style_three h1 {
  font-size: 64px;
  text-transform: capitalize;
}

.hero_right {
  margin-top: 80px;
}

.hero-thumbs img {
  width: 100%;
}

.banner_icon_box {
  display: flex;
  align-items: center;
  background: url(../images/home-three/banner_icon_bg.png);
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 52px 30px 52px;
  margin-top: 25px;
  border-radius: 20px;
}

.banner_icon {
  width: 76px;
  height: 76px;
  border-radius: 38px;
  background-color: #ffffff;
  flex-shrink: 0;
  line-height: 76px;
  text-align: center;
  margin-right: 20px;
}

.banner_icon img {
  width: initial;
}

h3.banner_title {
  font-size: 22px;
  line-height: 28px;
  color: #1a1a1a;
  font-weight: 600;
  margin: 0;
}

.video-icon a {
  width: 56px;
  height: 56px;
  border-radius: 28px;
  background-color: #f8b097;
  display: inline-block;
  text-align: center;
  line-height: 56px;
  font-size: 22px;
  margin: 0 10px 0 20px;
}

.video-icon span {
  font-size: 18px;
  color: #1a1a1a;
  font-weight: 500;
  font-family: "Overpass";
}

.hero_container.style_two {
  left: initial;
  right: 2%;
}

/* ============================================= */
/* Start Printmax About Area Style Three */
/* ============================================= */

section.about_area.style_three {
  background: #edf5f6;
  z-index: 1;
}

section.about_area.style_three .about_counter {
  background: #f8b097;
}

.about_shaps.two {
  right: 5%;
  bottom: 8%;
  z-index: -1;
}

.printing_icon_box.style_three .printing_icon {
  background: #fff;
}

.about_btn.style_three a {
  background: #0d223f;
}

.about_btn.style_three span {
  background: #1a1a1a;
}

/* ============================================= */
/* Start Printmax Service Area Style Three */
/* ============================================= */
section.service_areas {
  /* padding: 105px 0 90px; */
  padding: 35px 0 40px;
}

.service_single_item.style_two {
  /* padding: 40px 40px 32px; */
  padding: 30px 30px 25px;
  background: linear-gradient(45deg, #009eab, #027c7a);
  overflow: hidden;
  margin-bottom: 20px;
}

.service_single_item.style_two:before {
  display: none;
}

.service_single_item.style_two:after {
  position: absolute;
  content: "";
  right: 0;
  top: -21%;
  height: 100%;
  width: 48%;
  background: url(../images/home-three/line-shape.png);
  background-repeat: no-repeat;
  transition: 0.5s;
  z-index: -1;
  opacity: 0;
}

.service_single_item.style_two:hover:after {
  top: 0;
  opacity: 1;
}

.service_single_item.style_two .service_icon {
  transform: rotate(361deg);
  display: inline-block;
  transition: 0.5s;
}

.service_single_item.style_two:hover .service_icon {
  transform: rotate(0deg);
}

.service_single_item.style_two .service_content h3 {
  font-size: 24px;
  /* margin: 30px 0 50px; */
  margin: 15px 0 20px;
  line-height: 34px;
  position: relative;
  z-index: 1;
}

.service_single_item.style_two .service_content h3:before {
  position: absolute;
  content: "";
  left: 0;
  height: 1px;
  width: 100%;
  background: #5d5f6229;
  z-index: -1;
  bottom: -22px;
}

.service_single_item.style_two .service_content h3::after {
  position: absolute;
  content: "";
  left: 0;
  height: 1px;
  width: 25%;
  background: #fff;
  z-index: -1;
  bottom: -3px;
  transition: 0.5s;
}

.service_single_item.style_two:hover .service_content h3::after {
  width: 100%;
}

.style_two .service_btn a {
  padding: 0;
  background: #fff;
  color: #031812;
  width: 42px;
  height: 42px;
  border-radius: 21px;
  background-color: #ffffff;
  border: 1px solid rgba(26, 26, 26, 0.1);
  line-height: 42px;
  text-align: center;
  overflow: hidden;
}

.service_single_item.style_two:hover .service_btn a {
  width: 128px;
}

.service_single_item.style_two .service_btn a:hover {
  color: #fff;
}

.service_single_item.style_two .printmax_btn a i {
  transform: rotate(-45deg);
  display: inline-block;
  margin-left: 0;
}

.service_single_item.style_two:hover .printmax_btn a i {
  transform: rotate(0deg);
  display: inline-block;
  margin-right: 10px;
}

.service_single_item.lust_item .printmax_btn a i {
  margin-left: 10px;
}

.service_single_item.lust_item:hover .printmax_btn a i {
  margin-right: 0;
}

.service_single_item.lust_item {
  background: #f7f1ee;
  padding: 44px 83px 33px 40px;
}

.service_single_item.lust_item:after {
  display: none;
}

.service_single_item.lust_item .service_icon {
  float: left;
  margin-top: 10px;
  margin-right: 15px;
}

.service_single_item.lust_item .service_content {
  overflow: hidden;
}

.service_single_item.lust_item .service_content p {
  font-size: 18px;
  color: #1a1a1a;
}

.service_btns {
  margin-top: 101px;
}

.service_single_item.lust_item .service_btns a {
  background: #f7f1ee;
  padding: 11px 42px;
  color: #1a1a1a;
  border: 1px solid #1a1a1a;
}

.service_single_item.lust_item .service_btns a:hover {
  color: #fff;
  border: 1px solid #1a1a1a;
}

.lust_item .printmax_btn a i {
  margin-left: 10px;
  transform: rotate(-50deg) !important;
}

.lust_item:hover .printmax_btn a i {
  margin-right: 0;
  transform: rotate(0deg);
}

.service_shape {
  position: absolute;
  bottom: -46%;
  right: -22%;
}

.video-icon.style_two {
  position: relative;
  z-index: 1;
  display: inline-block;
  margin-top: 58px;
}

.video-icon.style_two:before {
  position: absolute;
  content: "";
  left: 0;
  top: -25%;
  height: 110px;
  width: 100%;
  background: url(../images/home-three/vedio_shape.png);
  z-index: -1;
  background-repeat: no-repeat;
}

.video-icon.style_two a {
  width: 80px;
  height: 80px;
  line-height: 80px;
  border-radius: 50%;
  background: #fff;
  font-size: 35px;
  color: #0d223f;
}

/* ============================================= */
/* Start Printmax Portfolio Area */
/* ============================================= */

section.portfolio_area {
  padding: 105px 0 186px;
}

.section_right_btn {
  text-align: right;
}

.section_right_btn a {
  background: #edf5f6;
  color: #1a1a1a;
  padding: 14px 40px;
  border-radius: 28px;
}

.port_container {
  padding: 0 72px 0;
}

.portfolio_single_item {
  position: relative;
  overflow: hidden;
  transition: 0.5s;
}

.portfolio_thumb img {
  transition: 0.5s;
}

.portfolio_single_item:hover .portfolio_thumb img {
  transform: scale(1.1);
}

.portfolio_content {
  background-color: #ffffff;
  border: 1px solid rgba(26, 26, 26, 0.1);
  border-top: 0;
  position: relative;
  padding: 23px 40px 30px;
}

.portfolio_content h3 {
  margin: 0;
}

.portfolio_content h3 a {
  font-size: 24px;
  color: #1a1a1a;
  font-weight: 600;
  display: inline-block;
}

.portfoli_btn a {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background-color: #ffffff;
  border: 1px solid rgba(26, 26, 26, 0.1);
  display: inline-block;
  text-align: center;
  line-height: 42px;
  font-size: 16px;
  font-weight: 600;
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.portfoli_btn a:hover {
  color: #fff;
}

.portfoli_btn a:before {
  position: absolute;
  left: 50%;
  top: 0;
  content: "";
  width: 0;
  height: 100%;
  background: #0d223f;
  z-index: -1;
  transition: 0.5s;
  border-radius: 50%;
}

.portfoli_btn a:hover:before {
  width: 100%;
  left: 0;
}

.portfoli_btn {
  position: absolute;
  right: 40px;
  bottom: 24%;
}

.portfolio_list .owl-dots {
  position: relative;
  right: 0;
  left: 0;
  margin: auto;
  text-align: center;
  bottom: -14%;
}

.portfolio_list .owl-dot {
  width: 12px;
  height: 12px;
  border-radius: 6px;
  background-color: rgba(243, 51, 80, 0);
  border: 1px solid rgba(3, 24, 18, 0.3);
  margin-right: 10px;
  display: inline-block;
}

.portfolio_list .owl-dot.active {
  background: #0d223f;
  border: 1px solid #0d223f;
}

/* ============================================= */
/* Start Printmax Resouce Area */
/* ============================================= */

section.resouce_area {
  background: #edf5f6;
  padding: 120px 0 60px;
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.resource_right {
  position: relative;
  z-index: 1;
  left: -76px;
}

.resource_shape {
  position: absolute;
  top: -1%;
  left: -10%;
  z-index: -1;
}

.resource_shape2 {
  position: absolute;
  top: 3%;
  left: 0;
}

.resource_thumb {
  position: relative;
  z-index: 1;
}

.resource_img {
  margin-left: -30px;
  margin-top: 30px;
}

.resouce_btn a {
  padding: 14px 46px;
  border-radius: 28px;
  margin-top: 10px;
}

.resouce_warpper_shape {
  position: absolute;
  right: 0%;
  top: -27%;
  z-index: -1;
}

.resouce_warpper_shapes {
  position: absolute;
  bottom: 27%;
  right: 18%;
  z-index: -1;
}

/* ============================================= */
/* Start Printmax Testimonial Area Style Two */
/* ============================================= */

section.testimonial_area.style_two {
  padding: 105px 0 115px;
  overflow: hidden;
}

/* === testimonial item style two === */
.testi_warpper_left {
  margin-top: -67px;
}

.testimonial_item.style_two {
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  padding: 20px 20px 20px;
  margin-left: 115px;
  position: relative;
}

.testi_sps {
  position: absolute;
  bottom: 13%;
  right: 9%;
}

.testimonial_item.style_two .testi-author-thumb {
  flex-shrink: 0;
}

.testimonial_item.style_two .testimonal-content {
  padding: 0 0 0 40px;
}

.testimonial_item.style_two .testimonal-content p {
  font-size: 18px;
  line-height: 28px;
  color: #5d5f62;
}

.testimonial_item.style_two .tesit-auothor .bio h4.name {
  margin: 0;
  font-size: 22px;
  color: #031812;
  font-weight: 600;
}

.testimonial_item.style_two .tesit-auothor .bio h5.designation {
  font-size: 17px;
  color: #5d5f62;
  font-weight: 400;
  font-family: "Cabin";
}

.testimonial_item.style_two .testi-star i {
  font-size: 15px;
  color: #ffb608;
  margin: 7px 4px 0 0;
}

.testimonial_item.style_two .tesit-auothor {
  margin-top: 25px;
  text-align: left;
}

.testimonial_item.style_two .testi_icon {
  text-align: center;
  display: inline-block;
  margin-bottom: 16px;
}

.testi_shapes {
  position: absolute;
  right: 0%;
  top: -36%;
}

.testi_list2 .owl-nav {
  position: absolute;
  bottom: 0%;
  left: -52%;
  display: flex;
}

.testi_list2 .owl-prev i {
  width: 50px;
  height: 50px;
  border-radius: 30px;
  background-color: #ffffff;
  border: aliceblue;
  line-height: 50px;
  text-align: center;
  font-weight: 600;
  display: inline-block;
  color: #1a1a1a;
  position: relative;
  z-index: 1;
  transition: 0.5s;
  margin-right: 15px;
  border: 1px solid rgba(26, 26, 26, 0.1);
}

.testi_list2 .owl-next i {
  width: 50px;
  height: 50px;
  border-radius: 30px;
  background-color: #ffffff;
  border: aliceblue;
  line-height: 50px;
  text-align: center;
  font-weight: 600;
  display: inline-block;
  color: #1a1a1a;
  position: relative;
  z-index: 1;
  transition: 0.5s;
  border: 1px solid rgba(26, 26, 26, 0.1);
}

.testi_list2 .owl-prev i:hover,
.owl-next i:hover {
  background: #0d223f;
}

/* ============================================= */
/* Start Printmax Galary */
/* ============================================= */

.galary_img {
  position: relative;
  z-index: 1;
}

.galary_img img {
  width: 100%;
}

.galary_social {
  position: absolute;
  top: 69%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  margin: auto;
  text-align: center;
  opacity: 0;
  transition: 0.5s;
}

.galary_img:hover .galary_social {
  top: 50%;
  opacity: 1;
}

.galary_social a {
  display: inline-block;
  width: 80px;
  height: 80px;
  border-radius: 40px;
  background-color: #ffffff;
  font-size: 20px;
  line-height: 80px;
  color: #0d223f;
}

section.blog_area.style_three {
  padding: 105px 0 65px;
}

.breadcumb-area {
  padding: 182px 0 202px;
  position: relative;
  background: url(../website_images/about-banner.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.breadcumb-content {
  text-align: center;
}

.breadcumb-title h4 {
  padding-bottom: 20px;
  font-size: 48px;
  color: #fff;
  font-weight: 600;
  position: relative;
  z-index: 1;
  display: inline-block;
}

.breadcumb-content ul li {
  text-transform: uppercase;
  display: inline-block;
  font-size: 16px;
  color: #fff;
  font-weight: 400;
  margin-right: 6px;
}

.breadcumb-content ul li a {
  text-transform: uppercase;
  padding-right: 30px;
  position: relative;
  z-index: 1;
  font-size: 16px;
  color: #fff;
  font-weight: 500;
}

.breadcumb-content ul li a:hover {
  color: #0d223f;
}

.breadcumb-content ul li a:hover i {
  color: #0d223f;
}

.breadcumb-content ul li a:before {
  position: absolute;
  content: "";
  right: 8px;
  top: 3px;
  background: #fff;
  width: 2px;
  height: 12px;
  transition: 0.5s;
  transform: rotate(17deg);
}

/*======= Shop Section ========= */

.shops-section {
  padding: 115px 0 60px;
}

.shops-section {
  padding: 115px 0 60px;
}

.single-products-box2 {
  display: flex;
  margin-bottom: 35px;
  align-items: center;
}

.single-products-box2 .products-thumb img {
  width: inherit;
  transition: 0.5s;
  border-radius: 4px;
  margin-right: 30px;
}

.single-products-box2 .product-content2 {
  text-align: left;
}

.single-products-box2 .product-title h2 {
  font-size: 24px;
  line-height: 15px;
}

.single-products-box2 .product-price p {
  margin-bottom: 5px;
}

p.description {
  padding: 12px 0 4px;
}

.product-thumb-icon2 a {
  font-size: 14px;
  width: 34px;
  height: 34px;
  line-height: 34px;
  text-align: center;
  border-radius: 30px;
  background-color: #1a1a1a;
  color: #ffff;
  transition: 0.5s;
  margin-right: 6px;
  position: relative;
  z-index: 1;
  display: inline-block;
}

.product-thumb-icon2 a:after {
  position: absolute;
  content: "";
  z-index: -1;
  left: 0;
  right: 0;
  top: 0;
  height: 100%;
  width: 100%;
  border-radius: 50%;
  background: #0d223f;
  transform: scale(0);
  transition: 0.5s;
}

.product-thumb-icon2 a:hover:after {
  transform: scale(1);
}

/* cart sidebar - start */
/* =============================== */
.sidebar-menu-wrapper {
  display: block;
}

.cart_sidebar {
  top: 0;
  width: 400px;
  right: -400px;
  height: 100vh;
  z-index: 9999;
  position: fixed;
  padding: 50px 20px;
  overflow-y: scroll;
  background-color: #ffffff;
  transition: 0.6s cubic-bezier(1, 0, 0, 1);
}

.cart_sidebar .mCustomScrollBox {
  overflow: visible !important;
}

.cart_sidebar.active {
  right: 0px;
}

.cart_sidebar .close_btn {
  top: 15px;
  right: 20px;
  line-height: 1;
  font-size: 24px;
  position: absolute;
}

.cart_sidebar .close_btn:hover {
  color: #0d223f;
}

.cart_sidebar .heading_title {
  line-height: 1;
  font-size: 18px;
  margin-bottom: 20px;
  padding-bottom: 15px;
  border-bottom: 1px solid #f6f6f6;
}

.cart_sidebar .heading_title span {
  color: #0d223f;
}

.cart_sidebar .total_price {
  display: flex;
  font-size: 16px;
  font-weight: 500;
  margin-top: 20px;
  padding: 10px 0px;
  margin-bottom: 15px;
  align-items: center;
  color: #131313;
  border-top: 1px solid #f6f6f6;
  border-bottom: 1px solid #f6f6f6;
  justify-content: space-between;
}

.cart_sidebar .total_price span:last-child {
  color: #0d223f;
}

.cart_sidebar .btns_group {
  margin: -5px;
}

.cart_sidebar .btns_group li {
  width: 48%;
  padding: 5px;
  display: inline-block;
}

.cart_sidebar .btn {
  display: block;
  font-size: 12px;
  padding: 17px 20px;
}

.shop-section {
  padding: 100px 0 100px;
}

/* Shop Form*/

.form_box {
  padding: 11px 0 0;
}

p.form-text {
  display: inline-block;
  font-size: 16px;
  font-weight: 300;
  padding-right: 12px;
}

.form_box select {
  width: 30%;
  height: 38px;
  padding-left: 15px;
  background: #fff;
  border-radius: 4px;
  font-size: 16px;
  color: #1a1a1a;
  border: 1px solid rgba(6, 36, 98, 0.4);
  transition: 0.5s;
}

.upper.widget_search {
  margin-bottom: 40px;
  background: inherit;
  text-align: right;
}

.widget_search form {
  position: relative;
}

.upper.widget_search input {
  height: 60px;
  width: 100%;
  color: #1a1a1a;
  background: #0d223f99;
  border: 0;
  border-radius: 4px 0px 0px 4px;
  padding: 0 20px 0;
}

button.icons {
  border: 0;
  font-size: 18px;
  color: #fff;
  padding: 1px 15px;
  position: absolute;
  right: 0;
  top: 0;
  height: 60px;
  width: 60px;
  background: #0d223f;
  border-radius: 0 4px 4px 0;
}

/*Shop Left*/

.categories-title h4 {
  font-size: 22px;
  font-weight: 600;
  border-bottom: 2px solid rgba(6, 36, 97, 0.10196078431372549);
  padding: 0px 0 25px;
  margin: 0 0 30px;
  position: relative;
  color: #1d263a;
  padding-left: 20px;
}

.categories-title h4:before {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  height: 29px;
  width: 3px;
  background: #0d223f;
}

.widget-check-box {
  padding: 40px 35px 18px;
  background: #fff;
  box-shadow: 0px 10px 50px rgba(231, 231, 231, 0.5);
  border-radius: 4px;
  margin-bottom: 30px;
}

/* Create a custom checkbox */

.checkmark {
  position: absolute;
  top: 3px;
  left: 0;
  height: 22px;
  width: 22px;
  border-radius: 2px;
  border: 1px solid rgba(6, 36, 98, 0.1);
  background-color: rgba(7, 72, 131, 0);
}

.widget-check {
  display: block;
  position: relative;
  padding-left: 40px;
  margin-bottom: 20px;
  cursor: pointer;
  font-size: 16px;
  font-family: "Overpass";
  user-select: none;
  color: #1a1a1a;
}

.widget-check input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

label.widget-check span {
  display: inline;
  float: right;
}

.widget-check:hover input~.checkmark {
  background-color: #ccc;
}

.widget-check input:checked~.checkmark {
  background-color: #0d223f;
}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.widget-check input:checked~.checkmark:after {
  display: block;
}

.widget-check .checkmark:after {
  left: 7px;
  top: 2px;
  width: 7px;
  height: 12px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
}

/*Price Range
===========================*/

.range-wrapper-box {
  padding: 40px 35px 40px;
  background: #fff;
  box-shadow: 0px 10px 50px rgb(231 231 231 / 50%);
  border-radius: 4px;
  margin-bottom: 30px;
}

.slider-labels {
  margin-top: 35px;
}

.text-right.caption {
  display: inline-block;
}

.caption {
  display: inline-block;
}

.caption strong {
  width: 74px;
  height: 34px;
  line-height: 35px;
  background: #0d223f;
  display: inline-block;
  text-align: center;
  font-size: 14px;
  font-family: "Overpass";
  color: #fff;
  border-radius: 3px;
  margin-right: 10px;
}

span#slider-range-value1,
span#slider-range-value2 {
  font-size: 16px;
  font-family: "Overpass";
  font-weight: 400;
  color: #1a1a1a;
}

.noUi-target,
.noUi-target * {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -ms-touch-action: none;
  touch-action: none;
  -ms-user-select: none;
  -moz-user-select: none;
  user-select: none;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.noUi-target {
  position: relative;
  direction: ltr;
}

.noUi-base {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 1;
  /* Fix 401 */
}

.noUi-origin {
  position: absolute;
  right: 0;
  top: 0;
  left: 0;
  bottom: 0;
}

.noUi-handle {
  position: relative;
  z-index: 1;
}

.noUi-stacking .noUi-handle {
  z-index: 10;
}

.noUi-state-tap .noUi-origin {
  -webkit-transition: left 0.3s, top 0.3s;
  transition: left 0.3s, top 0.3s;
}

.noUi-state-drag * {
  cursor: inherit !important;
}

/* Painting and performance;
 */

.noUi-base,
.noUi-handle {
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

/* Slider size and handle placement;
 */

.noUi-horizontal {
  height: 5px;
}

.noUi-horizontal .noUi-handle {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  left: -7px;
  top: -6px;
  background-color: #0d223f;
}

.noUi-background {
  background: #ececec;
}

.noUi-connect {
  background: #0d223f;
  -webkit-transition: background 450ms;
  transition: background 450ms;
}

.noUi-origin {
  border-radius: 2px;
}

.noUi-target {
  border-radius: 2px;
}

.noUi-target.noUi-connect {}

/* Handles and cursors;
 */

.noUi-draggable {
  cursor: w-resize;
}

.noUi-vertical .noUi-draggable {
  cursor: n-resize;
}

.noUi-handle {
  cursor: default;
  -webkit-box-sizing: content-box !important;
  -moz-box-sizing: content-box !important;
  box-sizing: content-box !important;
}

.noUi-handle:active {
  border: 8px solid rgba(237, 28, 37, 0.38);
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  left: -14px;
  top: -14px;
}

/* Disabled state;
 */

[disabled].noUi-connect,
[disabled] .noUi-connect {
  background: #b8b8b8;
}

[disabled].noUi-origin,
[disabled] .noUi-handle {
  cursor: not-allowed;
}

/*Product 
======================*/

.product-categories-box {
  padding: 30px 30px 20px;
  background: #fff;
  box-shadow: 0px 10px 50px rgba(231, 231, 231, 0.5);
  border-radius: 4px;
  margin-bottom: 30px;
}

.products-collection {
  margin-bottom: 20px;
}

.product-thumb {
  float: left;
  padding-right: 17px;
}

.products-title h6 {
  font-size: 16px;
  font-weight: 500;
  line-height: 21px;
}

.product-price span {
  font-size: 15px;
  font-weight: 400;
  color: #0d223f;
}

.product-icon-list ul {
  line-height: 20px;
}

.product-icon-list ul li {
  list-style: none;
  display: inline-block;
  color: #0d223f;
  letter-spacing: 4px;
  font-size: 14px;
}

/*Shop Right 
======================*/

.row.products {
  padding-left: 80px;
}

.single-products-box {
  text-align: center;
  margin-bottom: 30px;
}

.products-thumb {
  position: relative;
  z-index: 1;
}

.products-thumb:before {
  position: absolute;
  content: "";
  left: 0;
  bottom: 0;
  width: 100%;
  height: 0;
  background: #78a97e47;
  opacity: 0.8;
  transition: 0.5s;
  border-radius: 4px 4px 0 0;
}

.products-thumb img {
  width: 100%;
  transition: 0.5s;
  border-radius: 4px 4px 0 0;
}

.product-sale {
  position: absolute;
  top: 20px;
  left: 20px;
}

.product-sale span {
  padding: 4px 20px;
  font-size: 14px;
  font-weight: 400;
  font-family: "Overpass";
  line-height: 24px;
  background: #0d223f;
  color: #fff;
  border-radius: 4px;
  display: inline-block;
}

.product-thumb-icon a {
  font-size: 20px;
  width: 46px;
  height: 46px;
  line-height: 47px;
  border-radius: 50%;
  text-align: center;
  background: #fff;
  color: #0d0e14;
  transition: 0.7s;
  display: inline-block;
  position: relative;
  bottom: 40%;
  z-index: 1;
  overflow: hidden;
}

.product-thumb-icon a:before {
  position: absolute;
  content: "";
  z-index: -1;
  right: 0;
  height: 100%;
  width: 0;
  border-radius: 50%;
  background: #0d223f;
  transition: 0.6s;
}

.product-thumb-icon a:nth-child(1) {
  position: absolute;
  left: 0;
  opacity: 0;
}

.product-thumb-icon a:nth-child(2) {
  position: absolute;
  right: 0;
  opacity: 0;
}

.product-content {
  padding: 23px 0 6px;
  border: 1px solid rgba(6, 36, 98, 0.1);
  border-top: 0;
  border-radius: 0 0 4px 4px;
}

ul.product-rating li {
  list-style: none;
  display: inline-block;
  color: #0d223f;
  letter-spacing: 0.3em;
  font-size: 14px;
}

.product-title h2 {
  font-size: 18px;
  font-weight: 600;
  color: #1a1a1a;
  line-height: 17px;
}

.product-price p {
  font-size: 15px;
  font-family: "Overpass";
  padding: 14px 0 0px;
  color: #0d223f;
}

.product-price p span {
  color: #616161;
  text-decoration: line-through;
  margin-left: 5px;
}

.product-thumb-icon a:hover {
  color: #fff;
}

.product-thumb-icon a:hover:before {
  left: 0;
  width: 100%;
}

.single-products-box:hover .products-thumb:before {
  height: 100%;
  top: 0;
}

.single-products-box:hover .product-thumb-icon a:nth-child(1) {
  opacity: 1;
  left: 92px;
}

.single-products-box:hover .product-thumb-icon a:nth-child(2) {
  opacity: 1;
  right: 92px;
}

/*pagination
==================*/

.pagination-menu {
  padding-top: 30px;
}

.pagination-menu ul {
  display: inline-block;
}

.pagination-menu ul li {
  display: inline-block;
  list-style: none;
  margin-right: 8px;
}

.pagination-menu ul li a {
  width: 46px;
  height: 46px;
  line-height: 46px;
  text-align: center;
  border-radius: 50%;
  background: #f5f5f5;
  display: inline-block;
  color: #1a1a1a;
  font-size: 20px;
  position: relative;
  z-index: 1;
  transition: 0.5s;
}

.pagination-menu ul li a:before {
  position: absolute;
  content: "";
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: #0d223f;
  border-radius: 50%;
  transform: scale(0);
  transition: 0.5s;
  z-index: -1;
}

.pagination-menu ul li a:hover:before {
  transform: scale(1);
}

.pagination-menu ul li a:hover {
  color: #fff;
}

/*================================
 <--Start Gardenic  Cart Section  Css-->
=================================*/
.cart-section {
  padding: 100px 0 100px;
}

.cart-empty p {
  padding: 18px 25px;
  position: relative;
  background-color: #fbfaf6;
  border-bottom: 2px solid #0d223f;
  display: inline-block;
  width: 100%;
  color: #0d223f;
}

.cart-empty p i {
  color: #0d223f;
  padding-right: 10px;
}

.Advisor-button a {
  font-size: 15px;
  padding: 15px 30px;
  background: #0a480f;
  color: #fff;
  font-weight: 500;
  display: inline-block;
  position: relative;
  z-index: 1;
  transition: 0.5s;
}

.Advisor-button a:before {
  position: absolute;
  content: "";
  z-index: -1;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background: #0d223f;
  transform: scale(0);
  transition: 0.5s;
}

.Advisor-button a i {
  font-size: 18px;
  position: relative;
  top: 3px;
  padding-left: 3px;
  color: #0d223f;
  transition: 0.5s;
}

.Advisor-button a:hover::before {
  transform: scale(1);
}

.Advisor-button a:hover i {
  color: #fff;
}

/*
<!-- ============================================================== -->
<!--  Shop Details  Css -->
<!-- ============================================================== -->*/

.shop-detials {
  padding: 120px 0 90px;
}

.style-three.tab {
  position: relative;
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
  border: 1px solid rgba(6, 36, 98, 0.1);
  padding: 15px 44px 15px;
  border-radius: 10px;
  margin-right: 15px;
}

.style-three .tabs li a {
  background: inherit;
  color: #fff;
  font-weight: 600;
  display: inline-block;
  outline: none;
  padding: 5px;
  transition: all 0.5s ease-in-out;
  margin-right: 20px;
  border-radius: 5px;
}

.style-three .tabs li.current:before {
  background: transparent;
}

.style-three li.current a {
  border: 1px solid #0d223f;
}

/*Shop dtls Right
============================*/

.shop-dtls-info {
  padding-left: 30px;
}

.category-title h2 {
  font-size: 31px;
  font-weight: 700;
  line-height: 26px;
  padding: 0px 0 23px;
}

.category-icon-list ul li {
  list-style: none;
  display: inline-block;
  color: #0d223f;
  letter-spacing: 0.4em;
  font-size: 16px;
}

li.category-text {
  letter-spacing: 0 !important;
  color: #67686c !important;
  padding-left: 6px;
}

.category-price h1 {
  font-weight: 500;
  font-size: 18px;
  line-height: 26px;
  color: #0d223f;
  padding: 6px 0 19px;
}

.category-price span {
  color: #616161;
  padding-left: 14px;
  text-decoration: line-through;
}

.category-color p {
  line-height: 26px;
  font-weight: 500;
  font-size: 16px;
  padding: 18px 0 6px;
}

.category-color span {
  color: #67686c;
  padding-left: 20px;
  position: relative;
}

.category-color span:before {
  position: absolute;
  content: ":";
  left: 4px;
  top: -3px;
}

/* --- Quantity button 
================================*/

.category-count-button {
  display: inline-flex;
  padding: 8px 0 30px;
}

.quantity-with_btn {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  vertical-align: middle;
}

.quantity .cart-plus-minus {
  position: relative;
  width: 170px;
  text-align: left;
  height: 54px;
  overflow: hidden;
  border-radius: 5px;
}

.quantity .cart-plus-minus>.ctnbutton {
  cursor: pointer;
  position: absolute;
  text-align: center;
  font-size: 20px;
  font-weight: 600;
  width: 38px;
  -webkit-box-align: center;
  align-items: center;
  vertical-align: middle;
  color: #fff;
  -webkit-transition: 0.5s;
  background: #0d223f;
}

.quantity .cart-plus-minus>.cart-plus-minus-box {
  border: 0;
  height: 54px;
  text-align: center;
  width: 170px;
  font-size: 16px;
  font-weight: 600;
  color: #1a1a1a;
  background-color: #fff !important;
  background: linear-gradient(90deg, #0d223f 50%, transparent 0) repeat-x,
    linear-gradient(90deg, #0d223f 50%, transparent 0) repeat-x,
    linear-gradient(0deg, #0d223f 50%, transparent 0) repeat-y,
    linear-gradient(0deg, #0d223f 50%, transparent 0) repeat-y;
  background-size: 6px 2px, 6px 2px, 2px 6px, 2px 7px;
  background-position: 0 0, 0 100%, 0 0, 100% 0;
  -webkit-animation: linearGradientMove 0.3s infinite linear;
  animation: linearGradientMove 0.3s infinite linear;
}

.quantity .cart-plus-minus>.ctnbutton.dec {
  top: 50%;
  left: 0%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  display: -webkit-box;
  display: flex;
  -webkit-justify-content: center;
  height: 100%;
  border-radius: 0 30px 30px 0;
}

.quantity .cart-plus-minus>.ctnbutton.inc {
  top: 50%;
  right: 0%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  height: 100%;
  border-radius: 30px 0 0 30px;
}

/*categories button
=========================*/

.category-button {
  display: inline-block;
  padding-left: 20px;
}

.category-button a {
  padding: 13px 25px;
  font-size: 15px;
  font-weight: 500;
  background: #0d223f;
  border-radius: 4px;
  color: #fff;
  display: inline-block;
  position: relative;
  z-index: 1;
}

.category-button a:before {
  position: absolute;
  z-index: -1;
  content: "";
  top: 0;
  right: 0;
  height: 100%;
  width: 0;
  background: #1a1a1a;
  border-radius: 4px;
  transition: 0.5s;
}

.category-button a i {
  padding-left: 10px;
  font-size: 16px;
}

.category-button a:hover:before {
  left: 0;
  width: 100%;
}

/*Tab Items
=======================*/

.tab {
  position: relative;
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
  background: #fff;
  padding: 30px 0 30px 30px;
}

.tabs {
  display: table;
  position: relative;
  overflow: hidden;
  margin-bottom: 4px;
  width: 100%;
}

.tabs li {
  line-height: 38px;
  margin-bottom: 30px;
  position: relative;
  display: inline-block;
}

.tabs li a {
  display: inline-block;
  outline: none;
  padding: 10px 30px;
  transition: all 0.5s ease-in-out;
  margin-right: 30px;
  font-size: 20px;
  line-height: 28px;
  font-weight: 700;
  font-family: "Nunito";
  border: 1px dashed #0d223f;
  color: #1b1b1b;
}

.tabs_item {
  display: none;
  /* padding: 30px 0; */
}

.tabs_item img {
  width: 100%;
}

.tabs_item:first-child {
  display: block;
}

.tab-thumb {
  right: -80px;
  position: relative;
}

li.current a {
  background: #0197a1;
  color: #fff;
}

li.current a span {
  color: #fff;
}

.tabs_item .Gardenic-section-title p {
  padding: 17px 0 5px;
}

.tabs_item .Gardenic-section-title h4 {
  margin-top: 0;
}

.tabs_item .Gardenic-button a {
  margin-top: 30px;
}

.tab-thumb:hover:before {
  transform: scale(1);
}

/* table
================*/

table.category-table {
  padding: 2px 0 0;
  display: inline-block;
  margin-top: 30px;
}

table.category-table td.table-title {
  font-size: 16px;
  color: #1a1a1a;
  font-weight: 500;
}

table.category-table tr td {
  padding-right: 25px;
  padding-bottom: 12px;
}

table.category-table td.table-title {
  font-size: 16px;
  color: #0d0e14;
  font-weight: 500;
}

table.category-table td.table-text {
  color: #616161;
  position: relative;
  z-index: 1;
  font-size: 16px;
  font-weight: 400;
  font-family: "Overpass";
}

table.category-table td.table-text:before {
  position: absolute;
  content: ":";
  left: -15px;
  top: 0;
  font-size: 20px;
  color: #0d0e14;
}

/*shop tab style
=====================*/

/*post comment box
===================*/

.post-comment-thumb {
  float: left;
  margin-right: 20px;
}

.post-content {
  overflow: hidden;
}

/*comment icon list*/

ul.comment-icon-list li {
  list-style: none;
  display: inline-block;
  color: #0d223f;
  letter-spacing: 0.2em;
  font-size: 14px;
}

/*post title*/

h4.post-title {
  font-size: 17px;
  font-weight: 500;
  line-height: 26px;
  margin-top: 0;
  padding: 2px 0 9px;
}

h4.post-title span {
  padding-left: 31px;
  font-size: 15px;
  color: #616161;
  font-weight: 400;
  position: relative;
}

.post-title span:before {
  position: absolute;
  content: "";
  left: 6px;
  top: 9px;
  height: 1px;
  width: 15px;
  background: #0d0e14;
}

/*right reply*/

span.rights-reply {
  font-weight: 500;
  cursor: pointer;
}

.posts-reply span i {
  display: inline-block;
  margin-right: 5px;
}

/*sidebar title*/

.product-details-respond {
  padding: 35px 0 0;
}

.sidebar-title h2 {
  font-size: 18px;
  font-weight: 500;
  line-height: 26px;
}

/*sidebar desc*/

.sidebar-description p {
  font-size: 15px;
  margin: 6px 0 25px;
}

/*sidebar rating list*/

p.sidebar-text {
  display: inline-block;
}

.sidebar-rating-list ul {
  display: inline-block;
  padding-left: 15px;
}

.sidebar-rating-list ul li {
  list-style: none;
  display: inline-block;
  color: #0d223f;
  letter-spacing: 0.4em;
  font-size: 15px;
}

/*from box*/

.contact-form-box2 {
  padding: 25px 0 0;
}

p.form_text {
  color: #000;
  margin-bottom: 10px;
  padding: 10px 0 0;
}

h6.form-title {
  font-size: 15px;
  font-weight: 500;
  padding: 0 0 13px;
  margin: 0;
}

.contact-form-box2 .form-box input {
  height: 54px;
  background-color: #fff;
  border: 1px solid rgba(13, 14, 20, 0.1);
  transition: 0.5s;
  padding: 0px 25px;
  display: block;
  width: 100%;
  color: #616161;
  margin-bottom: 30px;
  border-radius: 4px;
}

.contact-form-box2 .from-box input::placeholder {
  color: #616161;
  opacity: 0.6;
}

.contact-form-box2 .form-box textarea {
  height: 155px;
  background-color: #fff;
  border: 1px solid rgba(13, 14, 20, 0.1);
  transition: 0.5s;
  padding: 15px 25px;
  display: block;
  width: 100%;
  border-radius: 4px;
}

.contact-form-box2 .from-box textarea::placeholder {
  color: #616161;
  opacity: 0.6;
}

.product-item-title h2 {
  font-size: 30px;
  font-weight: 700;
  line-height: 42px;
  padding: 20px 0 30px;
}

/*contact form button*/

.style-Two.contact-form button {
  padding: 11px 53px;
  color: #fff;
  display: inline-block;
  margin-top: 40px;
  border-radius: 5px;
  position: relative;
  z-index: 1;
  border: 2px solid transparent;
  background: #0d223f;
  transition: 0.5s;
  font-weight: 500;
}

.style-Two.contact-form button i {
  padding-left: 6px;
  position: relative;
  top: 2px;
}

.style-Two.contact-form button:before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  left: 0;
  bottom: 0;
  background: #fff;
  z-index: -1;
  transition: 0.5s;
  transform: scale(0, 1);
  opacity: 0;
}

.style-Two.contact-form button:hover:before {
  transform: scale(1);
  opacity: 1;
}

.style-Two.contact-form button:hover {
  color: #1a1a1a;
}

/*--==============================================->
  <!--Start Service Details css-->
 ==================================================-*/
section.service_details {
  background: #edf5f6;
  padding: 120px 0 92px;
}

.service_details_img img {
  border-radius: 30px;
  margin-bottom: 50px;
  width: 100%;
}

.service_details_content {
  padding: 0 63px 0 0;
}

.service_details_content h2 {
  font-size: 42px;
  color: #063232;
  font-weight: 600;
}

p.details_decs1 {
  margin: 18px 23px 25px 0;
}

p.details_decs2 {
  margin: 0 17px 25px 0;
}

.service_details_item {
  padding: 30px 25px 20px;
  margin-bottom: 30px;
  background: #fff;
  border-radius: 10px;
  display: flex;
  align-items: center;
}

.service_detls_icon {
  float: left;
  margin-right: 20px;
}

.service_dtls_content h3 {
  font-size: 20px;
  color: #002c2a;
  font-weight: 500;
  margin-bottom: 15px;
}

/* sidebar box */
.sidebar_box {
  background: #fff;
  padding: 45px 50px 50px;
  border-radius: 20px;
}

h2.sidebar_title {
  font-size: 26px;
  color: #063232;
  font-weight: 500;
  margin-bottom: 12px;
}

.sidebar_box p {
  margin-bottom: 12px;
}

.sidebar-list ul li {
  font-size: 16px;
  line-height: 38px;
  color: #063232;
  font-weight: 400;
}

.sidebar-list ul li i {
  color: #0c6e6d;
  font-size: 15px;
  margin-right: 15px;
}

.consalt_btn.sidebar_style {
  text-align: left;
}

/* =================================
   Start Inner Page Faq Area
==================================== */
section.faq_area {
  background: #fff;
  padding: 105px 0 100px;
}

.tab_container {
  margin: 0 219px 0;
}

/*accordion*/
.accordion li {
  list-style: none;
  padding: 2px 0px 15px;
}

.accordion li a {
  position: relative;
  width: 100%;
  display: block;
  cursor: pointer;
  background: #f4f8f9;
  border: 0;
  padding: 25px 40px 25px;
  border-radius: 5px;
  z-index: 1;
  font-size: 22px;
  line-height: 24px;
  font-weight: 500;
  display: flex;
  justify-content: space-between;
  color: #1a1a1a !important;
}

.accordion li a:before {
  position: absolute;
  content: "";
  left: 4%;
  bottom: 0;
  height: 2px;
  width: 0%;
  background-color: rgba(12, 110, 109, 0.10196078431372549);
  transition: 0.5s;
}

.accordion li a.active:before {
  width: 91%;
}

.accordion li p {
  display: none;
  font-size: 16px;
  color: #6b7a7a;
  padding: 24px 42px 33px 40px;
  margin: 0;
  filter: drop-shadow(0px 10px 40px rgba(12, 110, 109, 0.1)) !important;
  background: #fff;
}

a.active {
  color: #063232 !important;
  background: #fff !important;
  filter: drop-shadow(0px 10px 100px rgba(12, 110, 109, 0.1)) !important;
}

.accordion li a span {
  position: relative;
  z-index: 1;
}

.accordion li a i {
  font-size: 15px;
  color: #063232;
  transform: rotate(0deg);
}

.accordion li a.active i {
  transform: rotate(90deg);
}

.accordion li.ctive {
  background: #0c6e6d !important;
}

/* ==== Start Porfolio  Details Csss ====*/

section.portfolio_details {
  padding: 120px 0 120px;
}

.port_dtls_thumb img {
  width: 100%;
}

.porfolio_dtls_container {
  overflow: hidden;
  -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
  padding: 65px 50px 50px;
  width: 100%;
}

.portfolio_info {
  padding-left: 50px;
}

.portfolio_info h2 {
  font-size: 25px;
  padding-bottom: 17px;
}

.portfolio-details-box li strong {
  margin-right: 5px;
}

.pr-title {
  padding: 24px 0 18px;
}

.port_dtl_social span {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 10px;
  display: block;
}

.port_dtl_social a {
  display: inline-block;
  width: 35px;
  height: 35px;
  background: #0d223f;
  color: #fff;
  border-radius: 5px;
  font-size: 18px;
  text-align: center;
  margin-right: 2px;
  line-height: 35px;
  margin-left: 10px;
}

.port_dtl_social a:hover {
  color: #1e1e1e;
}

.portfolio_details .col-md-6 {
  float: left;
}

.portfolio_info ul {
  list-style: none;
}

.portfolio_info h3 {
  margin: 0 0 21px;
}

.portfolio_info ul li {
  padding: 12px 0;
  margin-bottom: 0px;
  border-bottom: 1px solid#F9F4EE;
}

.port_dtl_social {
  margin-top: 20px;
}

.pr-title h2 {}

.portfolio_info h2 {
  font-size: 25px;
  padding-bottom: 17px;
}

.portfolio-details-box li strong {
  margin-right: 5px;
}

.pr-title {
  padding: 24px 0 18px;
}

.port_dtl_social span {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 10px;
  display: block;
}

.port_dtl_social a {
  display: inline-block;
  width: 35px;
  height: 35px;
  background: #0d223f;
  color: #fff;
  border-radius: 5px;
  font-size: 18px;
  text-align: center;
  margin-right: 2px;
  line-height: 35px;
  margin-left: 10px;
}

.port_dtl_social a:hover {
  color: #1e1e1e;
}

.portfolio_details .col-md-6 {
  float: left;
}

.portfolio_info ul {
  list-style: none;
}

.portfolio_info h3 {
  margin: 0 0 21px;
}

.portfolio_info ul li {
  padding: 12px 0;
  margin-bottom: 0px;
  border-bottom: 1px solid#F9F4EE;
}

.port_dtl_social {
  margin-top: 20px;
}

.pr-title h2 {
  font-size: 25px;
}

/* === Start 3D Graphic Showcase Area ==== */

.graphics_showcase_3d {
  padding: 60px 0 60px;
  background: #ffffff;
  position: relative;
  overflow: hidden;
}

/* Technical Grid Background Effect */
.graphics_showcase_3d::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image:
    linear-gradient(rgba(243, 86, 34, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(243, 86, 34, 0.03) 1px, transparent 1px);
  background-size: 50px 50px;
  pointer-events: none;
}

.graphic_section_title {
  margin-bottom: 70px;
}

.glow_text {
  color: #00969f;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 20px;
  margin-bottom: 60px;
  display: block;
}

.glass_text {
  font-size: 48px;
  font-weight: 800;
  color: #0d223f;
  position: relative;
  display: inline-block;
}

@keyframes fadeInUp_graphic {
  from {
    opacity: 0;
    transform: translateY(40px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.graphics_showcase_3d {
  padding: 100px 0;
  background: #fdfdfd;
}

.graphic_section_title {
  margin-bottom: 60px;
}

.graphic_section_title h4.glow_text {
  font-size: 42px;
  font-weight: 800;
  color: #0d223f;
  letter-spacing: -1px;
  position: relative;
  display: inline-block;
  padding-bottom: 15px;
}

.graphic_section_title h4.glow_text::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 4px;
  background: #00817e;
  border-radius: 2px;
}

.graphic_card_3d {
  opacity: 0;
  animation: fadeInUp_graphic 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

/* Staggered animation delays for the 4-column grid */
.col-lg-3:nth-child(1) .graphic_card_3d {
  animation-delay: 0.1s;
}

.col-lg-3:nth-child(2) .graphic_card_3d {
  animation-delay: 0.2s;
}

.col-lg-3:nth-child(3) .graphic_card_3d {
  animation-delay: 0.3s;
}

.col-lg-3:nth-child(4) .graphic_card_3d {
  animation-delay: 0.4s;
}

.col-lg-3:nth-child(5) .graphic_card_3d {
  animation-delay: 0.5s;
}

.col-lg-3:nth-child(6) .graphic_card_3d {
  animation-delay: 0.6s;
}

.col-lg-3:nth-child(7) .graphic_card_3d {
  animation-delay: 0.7s;
}

.col-lg-3:nth-child(8) .graphic_card_3d {
  animation-delay: 0.8s;
}

.graphic_card_3d {
  background: #ffffff;
  border: 2px solid #eef2f6;
  border-radius: 24px;
  padding: 15px;
  /* Slightly reduced padding to avoid compression */
  margin-bottom: 30px;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  perspective: 1500px;
  transform-style: preserve-3d;
  height: calc(100% - 30px);
  display: flex;
  flex-direction: column;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
  overflow: hidden;
  position: relative;
}

.graphic_card_3d:hover {
  transform: translateY(-20px) rotateX(8deg) rotateY(-5deg);
  border: 3px solid rgb(1 150 160);
  box-shadow: 0 10px 20px rgb(0 150 160 / 26%);
  background: #ffffff;
}

.graphic_thub_3d {
  position: relative;
  height: 300px;
  border-radius: 15px;
  overflow: hidden;
  background: #f8f9fa;
  transform: translateZ(30px);
  transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
}

.graphic_thub_3d img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1);
}

.graphic_overlay_3d {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to top, rgba(13, 34, 63, 0.4), transparent);
  opacity: 0;
  transition: 0.5s;
}

.graphic_card_3d:hover .graphic_thub_3d {
  transform: translateZ(80px) translateY(-10px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
}

.graphic_card_3d:hover .graphic_thub_3d img {
  transform: scale(1.2);
}

.graphic_card_3d:hover .graphic_overlay_3d {
  opacity: 1;
}

.graphic_content_3d {
  padding: 25px 10px 10px;
  text-align: center;
  transform: translateZ(50px);
  transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
}

.graphic_content_3d h3 {
  font-size: 24px;
  font-weight: 700;
  color: #0d223f;
  margin-bottom: 8px;
}

.graphic_content_3d p {
  font-size: 15px;
  color: #666;
  margin-bottom: 25px;
  font-weight: 500;
}

.pr-title h2 {
  font-size: 25px;
}

/* === Start 3D Graphic Showcase Area ==== */

.graphics_showcase_3d {
  padding: 60px 0 60px;
  background: #ffffff;
  position: relative;
  overflow: hidden;
}

/* Technical Grid Background Effect */
.graphics_showcase_3d::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image:
    linear-gradient(rgba(243, 86, 34, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(243, 86, 34, 0.03) 1px, transparent 1px);
  background-size: 50px 50px;
  pointer-events: none;
}

.graphic_section_title {
  margin-bottom: 70px;
}

.glow_text {
  color: #00969f;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 20px;
  margin-bottom: 60px;
  display: block;
}

.glass_text {
  font-size: 48px;
  font-weight: 800;
  color: #0d223f;
  position: relative;
  display: inline-block;
}

@keyframes fadeInUp_graphic {
  from {
    opacity: 0;
    transform: translateY(40px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.graphics_showcase_3d {
  padding: 60px 0;
  background: #fdfdfd;
}

.graphic_section_title {
  margin-bottom: 0px;
}

.graphic_section_title h4.glow_text {
  font-size: 29px;
  font-weight: 800;
  color: #0d223f;
  letter-spacing: -1px;
  position: relative;
  display: inline-block;
  padding-bottom: 15px;
}

.graphic_section_title h4.glow_text::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 80px;
  height: 4px;
  background: #00817e;
  border-radius: 2px;
}

.graphic_card_3d {
  opacity: 0;
  animation: fadeInUp_graphic 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}

/* Staggered animation delays for the 4-column grid */
.col-lg-3:nth-child(1) .graphic_card_3d {
  animation-delay: 0.1s;
}

.col-lg-3:nth-child(2) .graphic_card_3d {
  animation-delay: 0.2s;
}

.col-lg-3:nth-child(3) .graphic_card_3d {
  animation-delay: 0.3s;
}

.col-lg-3:nth-child(4) .graphic_card_3d {
  animation-delay: 0.4s;
}

.col-lg-3:nth-child(5) .graphic_card_3d {
  animation-delay: 0.5s;
}

.col-lg-3:nth-child(6) .graphic_card_3d {
  animation-delay: 0.6s;
}

.col-lg-3:nth-child(7) .graphic_card_3d {
  animation-delay: 0.7s;
}

.col-lg-3:nth-child(8) .graphic_card_3d {
  animation-delay: 0.8s;
}

.graphic_card_3d {
  background: #ffffff;
  border: 2px solid #eef2f6;
  border-radius: 24px;
  padding: 15px;
  /* Slightly reduced padding to avoid compression */
  margin-bottom: 30px;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  perspective: 1500px;
  transform-style: preserve-3d;
  height: calc(100% - 30px);
  display: flex;
  flex-direction: column;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.03);
  overflow: hidden;
  position: relative;
}

.graphic_card_3d:hover {
  transform: translateY(-20px) rotateX(8deg) rotateY(-5deg);
  border: 3px solid rgb(1 150 160);
  box-shadow: 0 10px 20px rgb(0 150 160 / 26%);
  background: #ffffff;
}

.graphic_thub_3d {
  position: relative;
  height: 300px;
  border-radius: 15px;
  overflow: hidden;
  background: #f8f9fa;
  transform: translateZ(30px);
  transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
}

.graphic_thub_3d img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1);
}

.graphic_overlay_3d {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to top, rgba(13, 34, 63, 0.4), transparent);
  opacity: 0;
  transition: 0.5s;
}

.graphic_card_3d:hover .graphic_thub_3d {
  transform: translateZ(80px) translateY(-10px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
}

.graphic_card_3d:hover .graphic_thub_3d img {
  transform: scale(1.2);
}

.graphic_card_3d:hover .graphic_overlay_3d {
  opacity: 1;
}

.graphic_content_3d {
  padding: 25px 10px 10px;
  text-align: center;
  transform: translateZ(50px);
  transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
}

.graphic_content_3d h3 {
  font-size: 24px;
  font-weight: 700;
  color: #0d223f;
  margin-bottom: 8px;
}

.graphic_content_3d p {
  font-size: 15px;
  color: #666;
  margin-bottom: 25px;
  font-weight: 500;
}

.graphic_action_3d {
  transform: translateZ(60px);
}

.graphic_btn_3d {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(135deg, #00817e 0%, #0096a0 100%);
  color: #ffffff !important;
  padding: 12px 30px;
  border-radius: 50px;
  font-weight: 700;
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 1px;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  box-shadow: 0 10px 20px rgb(0 150 160 / 26%);
  text-decoration: none;
  position: relative;
  /* Added for loading line */
  overflow: hidden;
  /* Added for loading line */
}

.graphic_btn_3d span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  font-size: 12px;
  transition: transform 0.4s;
}

.graphic_btn_3d:hover {
  transform: scale(1.05);
  box-shadow: 0 15px 30px rgba(0, 150, 160, 0.4);
  background: linear-gradient(135deg, #0096a0 0%, #00817e 100%);
  color: #fff !important;
}

.graphic_btn_3d:hover span {
  transform: translateX(5px);
}

/* High-End 3D Particle Effect Placeholder (Pure CSS) */
.graphic_card_3d::after {
  content: "";
  position: absolute;
  width: 100px;
  height: 100px;
  background: radial-gradient(circle, rgba(243, 86, 34, 0.2) 0%, transparent 70%);
  top: -20px;
  right: -20px;
  border-radius: 50%;
  z-index: -1;
  filter: blur(20px);
  transition: all 0.8s;
}

.graphic_card_3d:hover::after {
  width: 200px;
  height: 200px;
  top: -50px;
  right: -50px;
  background: radial-gradient(circle, rgba(243, 86, 34, 0.4) 0%, transparent 70%);
}



/*================================
 <--Gardenic   Blgo Details  Area Css-->
==================================*/
.blog-detials-area {
  padding: 120px 0 120px;
}

.blog-grid-area {
  padding: 120px 0 90px;
}

.blog-details-main {
  background: #fff;
  padding: 30px;
  box-shadow: 0px 0px 70px rgba(0, 0, 0, 0.05);
}

.blog-details-meta {
  background: #0d223f;
  padding: 16px 30px;
}

.blog-details-meta span {
  margin-right: 30px;
  color: #fff;
}

.blog-details-meta span i {
  color: #fff;
  padding-right: 5px;
}

.blog-details-content {
  padding: 20px 0 18px;
}

.blog-details-content h2 {
  font-size: 30px;
  margin-bottom: 15px;
}

.blog-details-thumb img {
  width: 100%;
}

.blog-details-des {
  padding: 30px 0 10px;
}

.blog-details-blockquote {
  background: #edf5f6;
  padding: 40px 38px 26px;
  position: relative;
  margin-bottom: 10px;
}

.blog-details-blockquote blockquote {
  font-size: 18px;
}

.blog-details-video-thumb {
  margin-top: 30px;
  position: relative;
}

.blog-details-video-thumb img {
  width: 100%;
}

.blog-details-video-thumb-inner img {
  width: 100%;
}

.blog-details-content h3 {
  font-size: 24px;
  margin-bottom: 15px;
}

.blog-details-content-list p i {
  font-size: 14px;
  height: 32px;
  width: 32px;
  border: 1px solid #ddd;
  text-align: center;
  line-height: 31px;
  border-radius: 100%;
  margin-right: 15px;
  color: #0d223f;
}

.blog-detials-area .blog-content {
  padding: 20px 30px 38px;
}

.blog-details-button a {
  display: inline-block;
  border: 2px solid #0d223f;
  padding: 3px 20px;
  position: relative;
  z-index: 1;
  color: #fff;
  border-radius: 3px;
  margin-bottom: 10px;
}

.blog-details-button a:before {
  position: absolute;
  content: "";
  left: -2px;
  top: -1px;
  height: 104%;
  width: 104%;
  background: #0d223f;
  z-index: -1;
  border-radius: 3px;
  transition: 0.5s;
}

.blog-details-button a.active {
  background: transparent;
  transition: 0.5s;
  margin-left: 10px;
  color: #0d223f;
}

.blog-details-button a.active:before {
  background: transparent;
}

.blog-details-button a.active:hover:before {
  background: #0d223f;
}

.blog-details-button a.active:hover {
  color: #fff;
  border-color: #0d223f;
}

.blog-details-social {
  text-align: right;
}

.blog-details-social a {
  display: inline-block;
  border: 2px solid #0d223f;
  height: 40px;
  width: 40px;
  line-height: 38px;
  text-align: center;
  border-radius: 100%;
  font-size: 14px;
  transition: 0.5s;
  margin-left: 5px;
  color: #0d223f;
}

.blog-details-social a:hover {
  background: #0d223f;
  border-color: #0d223f;
  color: #fff;
}

/* Blog Details Author */

.blog-details-author {
  border-top: 2px solid rgba(255, 255, 255, 0.2);
  padding-top: 40px;
  margin-top: 32px;
}

.blog-details-author-inner {
  background: #0d223f;
  padding: 30px 30px 19px;
}

.blog-details-author-thumb {
  float: left;
  margin-right: 30px;
}

.blog-details-author-content h2 {
  font-size: 22px;
  margin-top: 0;
  margin-bottom: 12px;
  color: #ffff;
}

.blog-details-author-content p {
  color: #ffffffbd;
}

/* Comment CSS */

.blog-details-comment {
  margin-bottom: 10px;
  position: relative;
}

.blog-details-comment-thumb {
  float: left;
  margin-right: 30px;
}

.blog-details-comment-content {
  overflow: hidden;
}

.blog-details-comment-content h2 {
  font-size: 18px;
  margin-top: 0;
}

.blog-details-comment-content span {
  font-size: 14px;
  margin-bottom: 6px;
  display: block;
}

.blog-details-comment-reply {
  position: absolute;
  right: 25px;
}

.blog-details-comment-reply a {
  background: #0d223f;
  padding: 3px 20px;
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  border-radius: 2px;
  display: inline-block;
}

.blog-details-comment.reply {
  margin-left: 70px;
  padding-top: 35px;
  border-top: 2px solid rgba(255, 255, 255, 0.2);
}

/* Blog Details Contact */

.blog-details-contact {
  border-top: 2px solid rgba(255, 255, 255, 0.2);
  margin: 12px 10px 10px;
  padding-top: 8px;
}

/*input-box*/
.input-box input {
  width: 100%;
  height: 50px;
  border: 1px solid #0202021a;
  margin-bottom: 30px;
  padding: 0 20px;
  outline: 0;
  border-radius: 3px;
}

.input-box textarea {
  width: 100%;
  height: 207px;
  outline: 0;
  border: 1px solid #0202021a;
  padding: 22px 20px 0;
  border-radius: 3px;
}

/*input button*/
.input-button {
  margin-top: 27px;
}

.input-button button {
  display: inline-block;
  padding: 13px 39px;
  outline: 0;
  border: 0;
  text-transform: uppercase;
  color: #fff;
  letter-spacing: 1px;
  font-weight: 500;
  background: #0d223f;
  border: 1px solid #0d223f;
  transition: 0.5s;
}

.input-button button:hover {
  border: 1px solid #0d223f;
  color: #0d223f;
  background: none;
}

.input-button button i {
  margin-left: 10px;
}

.widget_search {
  padding: 30px 30px 30px;
  border-radius: 4px;
  margin-bottom: 30px;
  box-shadow: 0px 0px 70px rgb(0 0 0 / 5%);
  background: #edf5f6;
  border: 1px solid #e2e5e7;
}

.widget_search form {
  position: relative;
}

.widget_search input {
  border-radius: 4px;
  padding-left: 20px;
  height: 60px;
  width: 100%;
  position: relative;
  color: #fff;
  border: 0;
  outline: 0;
  background: rgb(32 88 38 / 50%);
}

.widget_search input::placeholder {
  color: #fff;
}

button.icons {
  border: 0;
  font-size: 18px;
  color: #fff;
  padding: 1px 15px;
  position: absolute;
  right: 0;
  top: 0;
  height: 60px;
  width: 60px;
  background: #0d223f;
  border-radius: 0 4px 4px 0;
}

/*widget categories box*/

.widget-categories-box {
  padding: 42px 40px 25px;
  border-radius: 5px;
  margin-bottom: 30px;
  box-shadow: 0px 0px 70px rgb(0 0 0 / 5%);
  border: 1px solid #e2e5e7;
  background: #edf5f6;
}

/*categories menu*/

.widget-categories-menu ul {
  display: block;
}

.widget-categories-menu ul li {
  display: block;
  list-style: none;
  margin-bottom: 15px;
  background: transparent;
  padding: 16px 20px 16px;
  border-radius: 4px;
  transition: 0.5s;
  border: 2px solid #eaeaea;
  position: relative;
  z-index: 1;
}

.widget-categories-menu ul li:hover {
  border: 2px solid #0d223f;
}

.widget-categories-menu ul li:before {
  position: absolute;
  content: "";
  left: 0;
  top: 0;
  height: 100%;
  width: 0;
  background: #0d223f;
  transition: 0.5s;
  z-index: -1;
}

.widget-categories-menu ul li:hover:before {
  width: 100%;
}

.widget-categories-menu ul li a {
  display: block;
  color: #0d223f;
  transition: 0.5s;
}

.widget-categories-menu ul li a span {
  display: inline-block;
  float: right;
  background: #0d223f;
  height: 22px;
  width: 22px;
  font-size: 12px;
  text-align: center;
  margin-top: 6px;
  color: #fff;
  line-height: 22px;
  transition: 0.5s;
}

.widget-categories-menu ul li:hover a span {
  background: #fff;
  color: #0e1317;
}

.widget-categories-menu ul li:hover a {
  color: #fff;
}

.pdf-button a {
  display: block;
  background: #0d223f;
  padding: 15px 30px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 10px;
}

.pdf-button a i {
  float: right;
  font-size: 20px;
  margin-top: 2px;
}

/* Sidber Recent Post */

.sidber-widget-recent-post {
  margin-bottom: 20px;
  overflow: hidden;
  display: flex;
  align-items: center;
  border-bottom: 1px solid #eaeaea;
  padding-bottom: 22px;
}

.recent-widget-content a {
  color: #1b1b1b !important;
  display: inline-block;
  font-size: 15px;
  font-weight: 500;
  display: block;
  line-height: 26px;
  transition: 0.5s;
  margin-bottom: 7px;
}

.recent-widget-thumb {
  float: left;
  margin-right: 25px;
}

.sidber-widget-recent-post .recent-widget-content a {
  color: #0d223f;
  font-size: 18px;
}

/* Sidber Achivement CSS */

.widget-achivement ul li {
  list-style: none;
  margin-bottom: 6px;
}

.widget-achivement ul li a i {
  font-size: 17px;
  margin-right: 3px;
}

.widget-achivement ul li a {
  font-weight: 600;
  transition: 0.5s;
  color: #1b1b1b;
}

.widget-achivement ul li a span {
  float: right;
}

.widget-achivement ul li a:hover {
  color: #0d223f;
}

/* Sidber Widget Gallery CSS */

.widget-gallery {
  overflow: hidden;
}

.widget-gallery-thumb {
  float: left;
  margin-right: 10px;
  margin-bottom: 10px;
}

/* Sidber Widget Tags CSS */

.widget-tags a {
  display: inline-block;
  border: 2px solid #eaeaea;
  padding: 3px 20px;
  margin: 4px 3px;
  border-radius: 2px;
  color: #1b1b1b;
  font-weight: 500;
  position: relative;
  transition: 0.5s;
  z-index: 1;
}

.widget-tags a:before {
  position: absolute;
  content: "";
  left: -2px;
  top: 0px;
  height: 102%;
  width: 0%;
  background: #0d223f;
  z-index: -1;
  border-radius: 3px;
  transition: 0.5s;
}

.widget-tags a:hover {
  color: #fff;
  border-color: #0d223f;
}

.widget-tags a:hover:before {
  width: 102%;
}

/* =================================
   Start Printmax Page Conatct Area
==================================== */
section.contact_area.inner_section {
  /* padding: 118px 0 120px; */
  padding: 85px 0 90px;
}

.cotact_info_item {
  text-align: center;
  background-color: #ffffff;
  padding: 40px 30px;
  border-radius: 15px;
  transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  border: 2px solid rgba(1, 150, 160, 0.1);
  margin-bottom: 30px;
  height: calc(100% - 30px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.03);
}

.cotact_info_item:hover {
  transform: translateY(-10px);
  border-color: #0196a0;
  box-shadow: 0 15px 35px rgba(1, 150, 160, 0.15);
}

.icontact_warpper_icon i {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  background: rgba(1, 150, 160, 0.05);
  border-radius: 50%;
  font-size: 32px;
  color: #0196a0;
  margin-bottom: 10px;
  transition: all 0.4s;
}

.cotact_info_item:hover .icontact_warpper_icon i {
  background: #0196a0;
  color: #ffffff;
}

.contact_warpper_content h3 {
  font-size: 22px;
  margin: 24px 0 10px;
}

.contact_warpper {
  background: #f8fbfc;
  padding: 60px;
  border-radius: 30px;
  border: 1px solid rgba(1, 150, 160, 0.08);
}

.form-box input {
  border-radius: 12px !important;
  transition: 0.4s;
  background: #fcfcfc !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  color: #1e1e1e;
  outline: 0;
  width: 100%;
  height: 60px;
  position: relative;
  margin-bottom: 20px;
  padding: 0 25px;
}

.form-box.message textarea {
  color: #232323;
  transition: 0.5s;
  background: #fcfcfc !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  outline: 0;
  width: 100%;
  height: 150px;
  position: relative;
  padding: 15px 25px;
  border-radius: 12px;
}

.contact-form button {
  display: inline-block;
  border-radius: 50px;
  text-align: center;
  font-size: 16px;
  text-transform: uppercase;
  color: #ffffff;
  background: #0196a0;
  font-weight: 700;
  letter-spacing: 1px;
  border: none;
  padding: 16px 50px;
  margin-top: 10px;
  transition: all 0.4s;
  cursor: pointer;
  box-shadow: 0 10px 20px rgba(1, 150, 160, 0.2);
}

.contact-form button:hover {
  background-color: #000;
}

/*<!-- ============================================================== -->
 <!-- Start Printmax Cart Area -->
<!-- ============================================================== -->*/

.cart-section {
  padding: 112px 0 90px;
  background-color: #fff;
}

img.cart-thumb {
  border-radius: 10px;
  margin: 10px 0 10px;
}

h2.cart-title.mb-4 {
  font-size: 40px;
  font-weight: 600;
}

button.remove-btn:hover i {
  color: #0d223f;
}

/* Cart Product Mobile */
.cart-product-mobile {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 20px;
  margin-bottom: 20px;
}

.cart-product-mobile-thumb {
  position: relative;
  -webkit-box-flex: 1;
  -ms-flex: 1 0 135px;
  flex: 1 0 135px;
  max-width: 135px;
  border: 1px solid #e5e5e5;
}

.col-auto button {
  outline: 0;
  position: relative;
  z-index: 1;
  overflow: hidden;
  text-align: center;
  border-radius: 25px;
  display: inline-block;
  background: #0d223f;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border: none;
  padding: 11px 33px;
  font-size: 16px;
  color: #ffffff;
  font-weight: 500;
  font-family: "Overpass";
  transition: 0.5s;
}

.col-auto button:hover {
  background: #1a1a1a;
  color: #fff;
}

/* Cart Totals */
.cart-totals {
  max-width: 800px;
  padding: 33px;
  background-color: #f8f9fa;
  margin: 30px auto;
  border-radius: 20px;
}

.table> :not(caption)>*>* {
  padding: 0.5rem 0.5rem;
  background-color: #f8f9fa;
  border-bottom-width: var(--bs-border-width);
}

.cart-totals .title {
  margin-bottom: 15px;
}

.cart-totals .table {
  margin-bottom: 20px;
}

.cart-totals .table th:first-child,
.cart-totals .table td:first-child {
  padding-left: 0;
}

.cart-totals .table th:last-child,
.cart-totals .table td:last-child {
  padding-right: 0;
}

button.show-alert {
  outline: 0;
  text-align: center;
  border-radius: 25px;
  display: inline-block;
  background: #0d223f !important;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border: none;
  padding: 11px 33px;
  font-size: 16px;
  color: #ffffff;
  transition: 0.5s;
}

button.show-alert.btn:hover {
  background: #1a1a1a !important;
  color: #fff;
}

/* Start Printmax Shp-product Checuot Css */

.shop-product-section {
  padding: 100px 0 90px;
}

h4.check_title {
  font-size: 30px;
  font-weight: 600;
}

input.form-field {
  font-size: 14px;
  width: 100%;
  height: 54px;
  padding: 10px 24px;
  border: 1px solid #e5e5e5;
  background-color: #fff;
  outline: 0;
}

label.lebel_name {
  color: #1a1a1a;
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 10px;
  margin-top: 20px;
}

label.form-check-label {
  color: #000000d6;
}

/* check box */
.checkout-box {
  background: #f8f9fa;
  padding: 25px 40px 22px;
  margin-bottom: 30px;
  border-radius: 10px;
}

.form-check-input:checked {
  background-color: #0d223f;
  border-color: #0d223f;
}

h4.check_title.two {
  margin-bottom: 25px;
}

button.btn.two {
  outline: 0;
  text-align: center;
  border-radius: 25px;
  display: inline-block;
  background: #0d223f !important;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  border: none;
  padding: 11px 33px;
  font-size: 16px;
  color: #ffffff;
  transition: 0.5s;
  margin-bottom: 20px;
}

button.btn.two:hover {
  color: #fff;
  background: #000 !important;
}

/* ================ All Animation CSS ===================*/

.rotate {
  -webkit-animation-name: rotateme;
  animation-name: rotateme;
  -webkit-animation-duration: 20s;
  animation-duration: 20s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  background-position: center center;
}

@keyframes rotateme {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.rotates {
  -webkit-animation-name: rotateme;
  animation-name: rotateme;
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  background-position: center center;
}

@keyframes rotateme {
  from {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.bounce-animate {
  animation-name: float-bob;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -moz-animation-name: float-bob;
  -moz-animation-duration: 2s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: float-bob;
  -ms-animation-duration: 2s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: float-bob;
  -o-animation-duration: 2s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear;
}

.bounce-animate2 {
  animation-name: float-bob2;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -moz-animation-name: float-bob2;
  -moz-animation-duration: 3s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: float-bob2;
  -ms-animation-duration: 3s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: float-bob2;
  -o-animation-duration: 3s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear;
}

.bounce-animate3 {
  animation-name: float-bob3;
  animation-duration: 3s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -moz-animation-name: float-bob3;
  -moz-animation-duration: 3s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: float-bob3;
  -ms-animation-duration: 3s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: float-bob3;
  -o-animation-duration: 3s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear;
}

.bounce-animate4 {
  animation-name: float-bob4;
  animation-duration: 5s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -moz-animation-name: float-bob4;
  -moz-animation-duration: 5s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: float-bob4;
  -ms-animation-duration: 5s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: float-bob4;
  -o-animation-duration: 5s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear;
}

.bounce-animate5 {
  animation-name: float-bob5;
  animation-duration: 6s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -moz-animation-name: float-bob5;
  -moz-animation-duration: 6s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: float-bob5;
  -ms-animation-duration: 6s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: float-bob5;
  -o-animation-duration: 6s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear;
}

.bounce-animate-slow {
  animation-name: float-bob5;
  animation-duration: 15s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -moz-animation-name: float-bob5;
  -moz-animation-duration: 15s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: float-bob5;
  -ms-animation-duration: 15s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: float-bob5;
  -o-animation-duration: 15s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear;
}

.bounce-animate-3 {
  animation-name: float-bob6;
  animation-duration: 6s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
  -moz-animation-name: float-bob6;
  -moz-animation-duration: 6s;
  -moz-animation-iteration-count: infinite;
  -moz-animation-timing-function: linear;
  -ms-animation-name: float-bob6;
  -ms-animation-duration: 6s;
  -ms-animation-iteration-count: infinite;
  -ms-animation-timing-function: linear;
  -o-animation-name: float-bob6;
  -o-animation-duration: 6s;
  -o-animation-iteration-count: infinite;
  -o-animation-timing-function: linear;
}

@keyframes float-bob {
  0% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }

  50% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }

  100% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
}

@keyframes float-bob2 {
  0% {
    -webkit-transform: translateY(-60px);
    transform: translateY(-60px);
  }

  50% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }

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

@keyframes float-bob3 {
  0% {
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
  }

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

  100% {
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
  }
}

@keyframes float-bob4 {
  0% {
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
  }

  50% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }

  100% {
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
  }
}

@keyframes float-bob5 {
  0% {
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
  }

  50% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
  }

  100% {
    -webkit-transform: translateY(-50px);
    transform: translateY(-50px);
  }
}

@keyframes float-bob6 {
  0% {
    -webkit-transform: translateY(-40px);
    transform: translateY(-40px);
  }

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

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

@keyframes movebounce {
  0% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }

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

  100% {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}

@keyframes moveleftbounce {
  0% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }

  50% {
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
}

/*--==============================================->
  <!-- Consen Animation Dance -->
 ==================================================-*/
.dance3 {
  -webkit-animation: dance3 8s alternate infinite;
  animation: dance3 8s alternate infinite;
}

@keyframes dance3 {
  0% {
    -webkit-transform: scale(0.5);
  }

  100% {
    -webkit-transform: scale(1);
  }
}

.dance {
  -webkit-animation: dance 2s alternate infinite;
  animation: dance 2s alternate infinite;
}

@keyframes dance {
  0% {
    -webkit-transform: scale(0.5);
  }

  100% {
    -webkit-transform: scale(1.2);
  }
}

.dance2 {
  -webkit-animation: dance2 4s alternate infinite;
  animation: dance2 4s alternate infinite;
}

@keyframes dance2 {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
  }

  50% {
    -webkit-transform: translate3d(25px, -25px, 0);
  }

  100% {
    -webkit-transform: translate3d(0, -25px, 25px);
  }
}

.watermark-animate {
  -webkit-animation: watermark-animate 8s infinite;
  animation: watermark-animate 8s infinite;
  animation-direction: alternate-reverse;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
}

@keyframes watermark-animate {
  0% {
    left: 0;
  }

  100% {
    left: 100%;
  }
}

/*=====================================
<-- Constre Search Box Css -->
=======================================*/
/*nav button*/
.search-box-btn.search-box-outer {
  display: inline-block;
}

.nav-btn.navSidebar-button {
  display: inline-block;
  position: relative;
  cursor: pointer;
  float: left;
  margin-top: 20px;
}

.nav-btn.navSidebar-button span {
  width: 50px;
  height: 50px;
  border-radius: 25px;
  /* background-color: #f8b097; */
  background-color: linear-gradient(180deg, #2a4e10, #1b3b0c);
  display: inline-block;
  line-height: 50px;
  text-align: center;
  font-size: 24px;
  /* color: #1a1a1a; */
  color: #fff;
  border: 2px solid #fff;
}

.nav-btn.navSidebar-button a i {
  font-size: 17px;
  display: inline-block;
  color: #232323;
  position: relative;
  z-index: 1;
  transition: 0.5s;
  cursor: pointer;
  margin-right: 5px;
}

.nav-btn.navSidebar-button a i:hover {
  color: #fff;
}

.xs-sidebar-group .xs-overlay {
  left: 100%;
  top: 0;
  position: fixed;
  z-index: 101;
  height: 100%;
  opacity: 0;
  width: 100%;
  visibility: hidden;
  -webkit-transition: all 0.4s ease-in 0.8s;
  -o-transition: all 0.4s ease-in 0.8s;
  transition: all 0.4s ease-in 0.8s;
}

.xs-sidebar-group .widget-heading {
  position: absolute;
  top: 23px;
  right: 0;
  padding: 25px;
}

.xs-sidebar-widget {
  position: fixed;
  right: -100%;
  top: 0;
  bottom: 0;
  width: 100%;
  max-width: 360px;
  z-index: 999999;
  overflow: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  /* background-color: #272727; */
  background: linear-gradient(45deg, #009eab, #027c7a);
  -webkit-transition: all 0.5s cubic-bezier(0.9, 0.03, 0, 0.96) 0.6s;
  -o-transition: all 0.5s cubic-bezier(0.9, 0.03, 0, 0.96) 0.6s;
  transition: all 0.5s cubic-bezier(0.9, 0.03, 0, 0.96) 0.6s;
  visibility: hidden;
  opacity: 0;
}

.xs-sidebar-group.isActive .xs-overlay {
  opacity: 0.7;
  visibility: visible;
  -webkit-transition: all 0.8s ease-out 0s;
  -o-transition: all 0.8s ease-out 0s;
  transition: all 0.8s ease-out 0s;
  left: 0;
}

.xs-sidebar-group.isActive .xs-sidebar-widget {
  opacity: 1;
  visibility: visible;
  right: 0;
  -webkit-transition: all 0.7s cubic-bezier(0.9, 0.03, 0, 0.96) 0.4s;
  -o-transition: all 0.7s cubic-bezier(0.9, 0.03, 0, 0.96) 0.4s;
  transition: all 0.7s cubic-bezier(0.9, 0.03, 0, 0.96) 0.4s;
}

.sidebar-textwidget {
  padding: 40px 32px;
}

.close-side-widget i {
  /* color: #006666; */
  color: #fff;
  font-size: 28px;
  display: block;
}

.sidebar-widget-container {
  position: relative;
  top: 150px;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.3s ease-in 0.3s;
  -o-transition: all 0.3s ease-in 0.3s;
  transition: all 0.3s ease-in 0.3s;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.xs-sidebar-group.isActive .sidebar-widget-container {
  top: 0px;
  opacity: 1;
  visibility: visible;
  -webkit-transition: all 1s ease-out 1.2s;
  -o-transition: all 1s ease-out 1.2s;
  transition: all 1s ease-out 1.2s;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.xs-overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  opacity: 0.5;
  z-index: 0;
}

.xs-bg-black {
  /* background-color: #006666; */
  background: linear-gradient(45deg, #009eab, #027c7a);
}

.xs-sidebar-widget.style_two {
  background: #fff;
  left: 0;
}

/*html css*/
.nav-btn.navSidebar-button a {
  color: #1a1a1a;
}

.sidebar-info-contents .widget-search {
  padding: 0 0 15px;
}

.sidebar-info-contents .widget {
  display: block;
}

.sidebar-info-contents h3.widget-title {
  font-size: 25px;
  padding: 8px 0 20px;
  margin-bottom: 10px;
  border-bottom: 1px solid #e9e9e9;
  font-style: italic;
}

.sidebar-info-contents h3.widget-title {
  font-size: 25px;
  padding: 15px 0 15px;
}

.widget form {
  position: relative;
}

.widget input {
  border-radius: 4px;
  padding-left: 20px;
  height: 56px;
  width: 100%;
  color: #fff;
  border: 1px solid #e9e9e9;
}

button.icon {
  border: 0;
  font-size: 18px;
  color: #fff;
  padding: 1px 15px;
  position: absolute;
  right: 0;
  top: 0;
  height: 56px;
  width: 60px;
  background: #0d223f;
  border-radius: 0 4px 4px 0;
}

ul.list-style-one li {
  display: block;
  list-style: none;
  color: #fff;
  padding: 16px 0 0;
  overflow: hidden;
}

ul.list-style-one li span {
  font-size: 16px;
  font-weight: 600;
  color: #1a1a1a;
  float: right;
  display: inline-block;
  padding: 0 5px;
}

ul.list-style-one li a {
  transition: 0.5s;
  /* color: #1a1a1a; */
  color: #fff;
}

ul.list-style-one li a i {
  background: #0d223f;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  display: inline-block;
  border-radius: 30px;
  color: #fff;
  margin-right: 5px;
}

a.white-bg i {
  background: #e9e9e9 !important;
}

a.yellow-bg i {
  background: #eeee22 !important;
}

a.green-bg i {
  background: #9bc45c !important;
}

/*Tag
=======*/

.sidebar-tag-menu {
  padding: 12px 0 0;
}

.sidebar-tag-menu ul li {
  display: inline-block;
  list-style: none;
  margin-right: 6px;
  color: #1a1a1a;
  padding: 0 0 12px;
}

/*social icon*/

ul.social-icon {
  padding: 20px 0 0;
}

ul.social-icon li {
  display: inline-block;
  list-style: none;
  margin: 0 10px 0 0;
}

ul.social-icon li a {
  display: inline-block;
  width: 35px;
  height: 35px;
  line-height: 36px;
  text-align: center;
  background: #fff;
  color: #1a1a1a;
  transition: 0.5s;
  font-size: 18px;
  border-radius: 3px;
}

ul.social-icon li a:hover {
  background: #0d223f;
  color: #fff;
}

ul.list-style-one li a:hover span {
  background: #0d223f;
  border-radius: 30px;
  color: #fff;
}

ul.list-style-one li a:hover {
  color: #0d223f;
}

/*Tab style
======================*/

.shops-section .tab {
  position: relative;
  overflow: hidden;
  -webkit-font-smoothing: subpixel-antialiased;
  text-align: right;
  padding: 5px 0 0;
}

.shops-section .tabs {
  display: inline;
}

.shops-section .tabs li.current:before {
  position: inherit;
}

.shops-section .tabs li a {
  font-size: 35px;
  width: 52px;
  height: 52px;
  line-height: 52px;
  text-align: center;
  color: #fff;
  background: #0b3510 !important;
  display: inline-block;
  margin-right: 0;
  margin-left: 10px;
  padding: 0;
}

.shops-section li.current a {
  color: #fff !important;
  background: #0d223f !important;
}

/*widget
==============*/

.widget {
  display: inline-block;
}

.widget select {
  padding: 15px 13px;
  width: 85%;
  display: inline-block;
  position: relative;
  top: -6px;
  color: #6a6e49;
}

/*html css*/
.nav-logo {
  margin: 0 0 0px;
}

.content-thumb-box {
  margin-bottom: 20px;
}

.content-thumb-box img {
  width: 100%;
  border-radius: 10px;
}

.content-box h2 {
  color: #fff;
  font-size: 26px;
  font-weight: 600;
}

.content-box p {
  display: inline-block;
  color: #fff;
  padding: 15px 0 0;
}

a.theme-btn.btn-style-two span {
  color: #fff;
  font-size: 20px;
}

a.theme-btn.btn-style-two i {
  color: #0d223f;
}

.contact-info h2 {
  color: #fff;
  font-size: 26px;
  margin-bottom: 15px;
  font-weight: 600;
}

ul.list-style-one li {
  display: block;
  list-style: none;
  color: #fff;
  padding: 16px 0 0;
  overflow: hidden;
}

ul.list-style-one li i {
  margin-right: 10px;
}

ul.list-style-one li span {
  font-size: 20px;
  font-weight: 600;
  color: #0d223f;
  margin: 0 10px 0 0px;
}

ul.social-box {
  margin: 30px 0 0;
}

ul.social-box li {
  display: inline-block;
  list-style: none;
  margin: 0 6px 0 0;
}

ul.social-box li a {
  display: inline-block;
  width: 35px;
  height: 35px;
  line-height: 36px;
  text-align: center;
  background: #fff;
  /* color: #006666; */
  color: #0d223f;
  transition: 0.5s;
  font-size: 18px;
  border-radius: 3px;
}

ul.social-box li a:hover {
  /* background: #006666; */
  background: #0d223f;
  color: #fff;
}

/*** 
====================================================================
    Search Popup
====================================================================
***/
.search-popup {
  position: fixed;
  left: 0;
  top: 0;
  height: 100vh;
  width: 100%;
  z-index: 99999;
  margin-top: -540px;
  transform: translateY(-100%);
  background-color: rgba(0, 0, 0, 0.9);
  -webkit-transition: all 500ms cubic-bezier(0.86, 0, 0.07, 1);
  -moz-transition: all 500ms cubic-bezier(0.86, 0, 0.07, 1);
  -o-transition: all 500ms cubic-bezier(0.86, 0, 0.07, 1);
  transition: all 1500ms cubic-bezier(0.86, 0, 0.07, 1);
  /* easeInOutQuint */
  -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -moz-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  -o-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
  transition-timing-function: cubic-bezier(0.86,
      0,
      0.07,
      1);
  /* easeInOutQuint */
}

.search-popup {
  width: 100%;
}

.search-active .search-popup {
  transform: translateY(0%);
  margin-top: 0;
}

.search-popup .close-search {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  margin-top: -200px;
  border-radius: 50%;
  text-align: center;
  background-color: #0d223f;
  width: 70px;
  cursor: pointer;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  border-bottom: 3px solid #fff;
  border-top: 3px solid #fff;
  border-right: 3px solid #1a1a1a;
  border-left: 3px solid #1a1a1a;
  -webkit-transition: all 500ms ease;
  height: 70px;
  line-height: 70px;
  text-align: center;
}

.search-active .search-popup .close-search {
  visibility: visible;
  opacity: 1;
  top: 50%;
  -webkit-transition-delay: 1500ms;
  -moz-transition-delay: 1500ms;
  -ms-transition-delay: 1500ms;
  -o-transition-delay: 1500ms;
  transition-delay: 1500ms;
}

.search-popup form {
  position: absolute;
  max-width: 700px;
  top: 50%;
  left: 15px;
  right: 15px;
  margin: -35px auto 0;
  transform: scaleX(0);
  transform-origin: center;
  background-color: #111111;
  -webkit-transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  -ms-transition: all 300ms ease;
  -o-transition: all 300ms ease;
  transition: all 300ms ease;
}

.search-active .search-popup form {
  transform: scaleX(1);
  -webkit-transition-delay: 1200ms;
  -moz-transition-delay: 1200ms;
  -ms-transition-delay: 1200ms;
  -o-transition-delay: 1200ms;
  transition-delay: 1200ms;
}

.search-popup .form-group {
  position: relative;
  margin: 0px;

  overflow: hidden;
}

.search-popup .form-group input[type="text"],
.search-popup .form-group input[type="search"] {
  position: relative;
  display: block;
  font-size: 18px;
  line-height: 50px;
  color: #000000;
  height: 70px;
  width: 100%;
  padding: 10px 30px;
  background-color: #ffffff;
  -webkit-transition: all 500ms ease;
  -moz-transition: all 500ms ease;
  -ms-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  transition: all 500ms ease;
  font-weight: 500;
  text-transform: capitalize;
}

.search-popup .form-group input[type="submit"],
.search-popup .form-group button {
  position: absolute;
  right: 30px;
  top: 0px;
  height: 70px;
  line-height: 70px;
  background: transparent;
  text-align: center;
  font-size: 24px;
  color: #0d223f;
  padding: 0;
  cursor: pointer;
  -webkit-transition: all 500ms ease;
  border: none;
}

.search-popup .form-group input[type="submit"]:hover,
.search-popup .form-group button:hover {
  color: #000000;
}

.search-popup input::placeholder,
.search-popup textarea::placeholder {
  color: #000000;
}

.search-popup .close-search.style-two {
  position: absolute;
  right: 25px;
  left: auto;
  color: #ffffff;
  width: auto;
  height: auto;
  top: 25px;
  margin: 0px;
  border: none;
  background: none !important;
  box-shadow: none !important;
  -webkit-transition: all 500ms ease;
  -moz-transition: all 500ms ease;
  -ms-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  transition: all 500ms ease;
}

.search-box-btn {
  display: inline-block;
  padding-left: 22px;
}

.search-box-btn i {
  display: inline-block;
  color: #fff;
  line-height: 30px;
  text-align: center;
  font-size: 18px;
  cursor: pointer;
  transition: 0.5s;
}

.upp.search-box-btn i {
  color: #9e9fa1;
}

.search-box-btn.search-box-outer span i {
  font-size: 20px;
  display: inline-block;
  color: #fff;
  padding-left: 17px;
  position: relative;
  z-index: 1;
}

.upp.search-box-btn.search-box-outer span i {
  color: #9e9fa1;
}

.search-box-btn.search-box-outer span i:after {
  position: absolute;
  content: "0";
  right: -10px;
  top: -4px;
  width: 16px;
  height: 16px;
  line-height: 16px;
  text-align: center;
  background: #0d223f;
  color: #fff;
  border-radius: 50%;
  display: inline-block;
  font-size: 12px;
}

.flaticon-multiply:before {
  content: inherit;
}

button.close-search i {
  font-size: 25px;
  color: #fff;
  display: inline-block;
}

/*===========================
<-- Loader Css -->
=============================*/
/* PRELOADER CSS */
.loading-screen {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: default;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: #0d223f;
  z-index: 1000;
}

.loading-screen .bar {
  position: absolute;
  height: 100%;
  width: 50%;
  background-color: #f4f1ee;
}

.loading-screen .top-bar {
  top: 0;
  left: 0;
  right: auto;
  bottom: auto;
}

.loading-screen .down-bar {
  bottom: 0;
  top: auto;
  right: 0;
  left: auto;
}

.loading-screen .animation-preloader {
  z-index: 1000;
}

.loading-screen .animation-preloader .spinner {
  -webkit-animation: spinner 1s infinite linear;
  animation: spinner 1s infinite linear;
  border-radius: 50%;
  border: 4px solid #e2dfdd;
  border-top-color: #1a1a1a;
  width: 150px;
  height: 150px;
  margin: 0 auto 3.5em auto;
}

.loading-screen .animation-preloader .txt-loading {
  font: bold 5em "", sans-serif;
  text-align: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.loading-screen .animation-preloader .txt-loading .letters-loading {
  color: #e2dfdd;
  position: relative;
}

.loading-screen .animation-preloader .txt-loading .letters-loading:before {
  -webkit-animation: letters-loading 4s infinite;
  animation: letters-loading 4s infinite;
  color: #010103;
  content: attr(data-text-preloader);
  left: 0;
  opacity: 0;
  position: absolute;
  top: -3px;
  -webkit-transform: rotateY(-90deg);
  transform: rotateY(-90deg);
}

.loading-screen .animation-preloader .txt-loading .letters-loading:nth-child(2):before {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}

.loading-screen .animation-preloader .txt-loading .letters-loading:nth-child(3):before {
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
}

.loading-screen .animation-preloader .txt-loading .letters-loading:nth-child(4):before {
  -webkit-animation-delay: 0.6s;
  animation-delay: 0.6s;
}

.loading-screen .animation-preloader .txt-loading .letters-loading:nth-child(5):before {
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
}

.loading-screen .animation-preloader .txt-loading .letters-loading:nth-child(6):before {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}

.loading-screen .animation-preloader .txt-loading .letters-loading:nth-child(7):before {
  -webkit-animation-delay: 1.2s;
  animation-delay: 1.2s;
}

.loading-screen .animation-preloader .txt-loading .letters-loading:nth-child(8):before {
  -webkit-animation-delay: 1.4s;
  animation-delay: 1.4s;
}

@-webkit-keyframes spinner {
  to {
    -webkit-transform: rotateZ(360deg);
    transform: rotateZ(360deg);
  }
}

@keyframes spinner {
  to {
    -webkit-transform: rotateZ(360deg);
    transform: rotateZ(360deg);
  }
}

@-webkit-keyframes letters-loading {

  0%,
  75%,
  100% {
    opacity: 0;
    -webkit-transform: rotateY(-90deg);
    transform: rotateY(-90deg);
  }

  25%,
  50% {
    opacity: 1;
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
  }
}

@keyframes letters-loading {

  0%,
  75%,
  100% {
    opacity: 0;
    -webkit-transform: rotateY(-90deg);
    transform: rotateY(-90deg);
  }

  25%,
  50% {
    opacity: 1;
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
  }
}

@media screen and (max-width: 767px) {
  .loading-screen .animation-preloader .spinner {
    height: 8em;
    width: 8em;
  }

  .loading-screen .animation-preloader .txt-loading {
    font: bold 3.5em "Inter", sans-serif;
  }
}

@media screen and (max-width: 500px) {
  .loading-screen .animation-preloader .spinner {
    height: 7em;
    width: 7em;
  }

  .loading-screen .animation-preloader .txt-loading {
    font: bold 2em "Inter", sans-serif;
  }
}

/* taps */
.product-thumb2 {
  padding: 15px 6px 0;
}

.product-thumb2 .item img {
  height: 100px;
  width: 100%;
  object-fit: cover;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.3s ease;
  border: 2px solid transparent;
}

.product-thumb2 .item:hover img {
  border-color: #009eab;
  opacity: 0.8;
  transform: scale(1.05);
  border-radius: 4px;
  /* Maintain the same rounding as non-hover */
}

.product-thumb2 .item.active img {
  border-color: #0d223f;
}

/*Owl Carousel*/

.product-thumb2 .owl-nav {
  text-align: center;
  margin-top: 0;
  position: relative;
  z-index: 1;
}

.product-thumb2 .owl-prev,
.product-thumb2 .owl-next {
  border: 1px solid #fff;
}

.product-thumb2 .owl-prev i,
.product-thumb2 .owl-next i {
  color: #fff;
}

.product-thumb2 .owl-prev {
  margin-left: 10px;
  position: absolute;
  left: 15px;
  top: -94px;
}

.product-thumb2 .owl-next {
  margin-left: 10px;
  position: absolute;
  right: 15px;
  top: -94px;
}

/*owl carousel*/

.product-thumb2 .owl-nav {
  text-align: center;
  margin-top: 30px;
}

.product-thumb2 .owl-prev,
.product-thumb2 .owl-next {
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  border-radius: 15px;
  display: inline-block;
  border: 1px solid #0d223f;
  transition: 0.5s;
}

.product-thumb2 .owl-prev i,
.product-thumb2 .owl-next i {
  color: #0d223f;
  font-size: 15px;
  transition: 0.5s;
}

.product-thumb2 .owl-next {
  margin-left: 10px;
}

.product-thumb2 .owl-prev:hover i,
.product-thumb2 .owl-next:hover i {
  color: #fff;
}


.typewriter::after {
  content: "|";
  animation: blink 1s infinite;
}

@keyframes blink {

  0%,
  50%,
  100% {
    opacity: 1;
  }

  25%,
  75% {
    opacity: 0;
  }
}


.why-choose-us-paragraph {
  color: #fff;
}

.products_button {
  text-align: center;
}

/* about page section — premium 3D magnetic tilt effect */
@keyframes card_glow_pulse {

  0%,
  100% {
    box-shadow: 0 15px 40px rgba(0, 129, 126, 0.15);
  }

  50% {
    box-shadow: 0 25px 60px rgba(0, 129, 126, 0.45);
  }
}

.feature_item.style_three {
  position: relative;
  z-index: 1;
  background: #edf7f6;
  border: 3px solid #00817e;
  padding: 40px 30px;
  border-radius: 15px;
  text-align: center;
  min-height: 320px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.08);
  transform-style: preserve-3d;
  transition: transform 0.1s ease, box-shadow 0.4s ease;
  cursor: pointer;
  will-change: transform;
  overflow: hidden;
  /* Ensures hover effects stay inside the box */
}

.feature_item.style_three::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%),
      rgba(0, 129, 126, 0.2) 0%,
      rgba(0, 129, 126, 0.05) 40%,
      transparent 70%);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: -1;
  pointer-events: none;
}

.feature_item.style_three::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(135deg,
      rgba(255, 255, 255, 0.15) 0%,
      transparent 50%,
      rgba(0, 129, 126, 0.08) 100%);
  opacity: 0;
  z-index: -1;
  transition: opacity 0.3s ease;
  pointer-events: none;
}

.feature_item.style_three.is-hovered {
  border-color: #000;
  animation: card_glow_pulse 2s ease-in-out infinite;
}

.feature_item.style_three.is-hovered::before,
.feature_item.style_three.is-hovered::after {
  opacity: 1;
}

.feature_item.style_three .feature_content {
  position: relative;
  z-index: 2;
}

.feature_content h3 {
  font-size: 26px;
  margin-bottom: 15px;
  transition: all 0.4s;
  color: #333;
}

.feature_content p {
  font-size: 16px;
  text-align: justify;
  line-height: 1.6;
  transition: all 0.4s;
  color: #000;
}

.feature_area.style_three .feature_item.style_three:hover h3,
.feature_area.style_three .feature_item.style_three:hover p {
  color: #000;
}

/* Background Assignments */
.sports-tshirt::before {
  background-image: url('../images/custom/tshirt_showcase.png');
}

.sports-pants::before {
  background-image: url('../images/custom/pants_showcase.png');
}

.sports-team::before {
  background-image: url('../images/custom/jerseys_showcase.png');
}

.team_social {
  display: flex;
  justify-content: center;
  margin-top: 20px;
}

.view-info-btn {
  display: inline-block !important;
  /* background: #0b2c5f !important; */
  color: #fff !important;
  padding: 12px 25px !important;
  border-radius: 6px;
  text-decoration: none !important;
  font-size: 15px;
  font-weight: 600;
  transition: all 0.3s ease;
}

.view-info-btn:hover {
  background: #17448f !important;
  transform: translateY(-2px);
}

/* ── Track-Suits Product Layout Fix ─────────────────────────── */

/* Container to clip the zoom effect and maintain rounded corners */
.product-slider .item {
  border-radius: 48px;
  overflow: hidden;
  background: transparent;
}

.product-slider .item img {
  width: 100%;
  height: 550px;
  /* object-fit: contain; */
  object-position: center;
  background: transparent;
  border: none;
  border-radius: 48px;
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.product-slider .item:hover img {
  transform: scale(1.1);
  /* Slightly more zoom */
  filter: drop-shadow(0 20px 30px rgba(0, 0, 0, 0.1));
}

/* Equal left/right column alignment — no overflow, no overlap */
.shop-detials .row.align-items-center {
  align-items: flex-start !important;
}

.shop-detials .col-lg-5,
.shop-detials .col-lg-7 {
  padding-left: 15px;
  padding-right: 15px;
}

/* Remove excessive left-padding from right info panel */
.shop-dtls-info {
  padding-left: 20px;
}

/* Reduce overall section vertical padding */
.shop-detials {
  /* padding: 70px 0 60px; */
  padding: 70px 0 40px;
}

/* --- Gallery Styles --- */
.gallery_area {
  padding: 100px 0;
}

.gallery_item {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
  transition: all 0.3s ease;
  border: 1px solid #eee;
}

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

.gallery_thumb img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.gallery_item:hover .gallery_thumb img {
  transform: scale(1.1);
}

.gallery_item:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 30px rgba(0, 158, 171, 0.15);
  border-color: #009eab;
}

/* --- Magic Shimmer Effect for Gallery --- */
.gallery_item::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 50%;
  height: 100%;
  background: linear-gradient(to right,
      transparent,
      rgba(255, 255, 255, 0.4),
      transparent);
  transform: skewX(-25deg);
  transition: 0.8s;
  z-index: 2;
}

.gallery_item:hover::before {
  left: 150%;
}

.gallery_item:hover .gallery_thumb img {
  transform: scale(1.15) rotate(1deg);
  /* Slight rotation for magic feel */
  filter: brightness(1.1);
}

/* Venobox Customizations */
.vbox-overlay {
  background: rgba(0, 0, 0, 0.95) !important;
  backdrop-filter: blur(10px);
}

.vbox-title {
  color: #009eab !important;
  font-weight: 600 !important;
  font-family: 'Overpass', sans-serif;
  font-size: 24px !important;
}

/* --- Premium Animation Section --- */
.creative_showcase {
  background: #0d223f;
  padding: 120px 0;
  position: relative;
  overflow: hidden;
}

.creative_showcase .section_title h1 {
  color: #fff;
}

.creative_showcase .section_title h4 {
  color: #009eab;
}

/* perspective card */
.perspective_card {
  position: relative;
  width: 100%;
  height: 400px;
  perspective: 1000px;
  margin-bottom: 30px;
}

.card_inner {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.8s cubic-bezier(0.2, 1, 0.3, 1);
  transform-style: preserve-3d;
  cursor: pointer;
}

.perspective_card:hover .card_inner {
  transform: rotateY(10deg) rotateX(5deg);
}

.card_thumb {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4);
}

.card_thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s;
}

.perspective_card:hover .card_thumb img {
  transform: scale(1.1);
}

.card_overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 30px;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.8));
  color: #fff;
  transform: translateZ(50px);
  /* 3D pop effect */
  opacity: 0;
  transition: 0.5s;
}

.perspective_card:hover .card_overlay {
  opacity: 1;
}

/* Floating Elements */
.floating_element {
  position: absolute;
  width: 100px;
  height: 100px;
  background: rgba(0, 158, 171, 0.1);
  border-radius: 50%;
  z-index: 0;
  pointer-events: none;
}

.element_1 {
  top: 10%;
  left: 5%;
  animation: float 15s infinite ease-in-out;
}

.element_2 {
  bottom: 15%;
  right: 10%;
  animation: float 12s infinite ease-in-out reverse;
  width: 150px;
  height: 150px;
}

.element_3 {
  top: 40%;
  right: 5%;
  animation: float 18s infinite ease-in-out;
  width: 80px;
  height: 80px;
}

@keyframes float {

  0%,
  100% {
    transform: translate(0, 0) rotate(0deg);
  }

  33% {
    transform: translate(30px, -50px) rotate(10deg);
  }

  66% {
    transform: translate(-20px, 20px) rotate(-10deg);
  }
}

/* Entrance Animations */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.8s ease-out;
}

.reveal.active {
  opacity: 1 !important;
  transform: translateY(0) !important;
}

/* Mobile responsive fixes for Banner */
@media (max-width: 767px) {
  .breadcumb-area {
    padding: 100px 0 100px !important;
  }

  .breadcumb-title h4 {
    font-size: 32px !important;
  }
}

/* --- Creative About Section Redesign --- */
.about_thumb_creative {
  position: relative;
  padding-right: 50px;
  padding-bottom: 50px;
  z-index: 1;
  margin-top: 30px;
}

.main_img_wrapper {
  position: relative;
  z-index: 2;
  overflow: hidden;
  border-radius: 30px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1);
}

.main_img_wrapper img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 0.8s ease;
}

.about_thumb_creative:hover .main_img_wrapper img {
  transform: scale(1.05);
}

.floating_card_counter {
  position: absolute;
  bottom: 50px;
  right: 0;
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(10px);
  padding: 20px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  gap: 20px;
  box-shadow: 0 15px 40px rgba(0, 158, 171, 0.2);
  z-index: 3;
  border: 1px solid rgba(255, 255, 255, 0.3);
  animation: float_about 4s ease-in-out infinite;
}

@keyframes float_about {

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

  50% {
    transform: translateY(-10px);
  }
}

.floating_icon {
  width: 60px;
  height: 60px;
  background: linear-gradient(45deg, #009eab, #027c7a);
  border-radius: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 28px;
}

.floating_text h3 {
  font-size: 32px;
  color: #0d223f;
  font-weight: 800;
  margin-bottom: 5px;
  margin-top: 0;
}

.floating_text p {
  font-size: 14px;
  line-height: 1.4;
  color: #555;
  margin: 0 !important;
  font-weight: 500;
  width: 100% !important;
}

.circle_shape {
  position: absolute;
  top: -40px;
  left: -40px;
  width: 150px;
  height: 150px;
  background: #edf7f6;
  border-radius: 50%;
  z-index: -1;
}

.dots_shape {
  position: absolute;
  top: 20%;
  right: -20px;
  width: 100px;
  height: 100px;
  background-image: radial-gradient(#009eab 2px, transparent 2px);
  background-size: 15px 15px;
  z-index: -1;
  opacity: 0.3;
}


/* Responsive Fix for Creative About Section */
@media (max-width: 767px) {
  .about_thumb_creative {
    padding-right: 0;
    padding-bottom: 80px;
    margin-bottom: 40px;
  }

  .floating_card_counter {
    right: 15%;
    transform: translateX(50%);
    bottom: -20px;
    width: 80%;
    justify-content: center;
  }

  .main_img_wrapper {
    border-radius: 20px;
  }

  .circle_shape,
  .dots_shape {
    display: none;
  }
}


/* Continuous Neat Animations for About Section */
@keyframes breathe_img {

  0%,
  100% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.03);
  }
}

.main_img_wrapper img {
  animation: breathe_img 8s ease-in-out infinite;
}

@keyframes slow_rotate {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

.circle_shape {
  animation: pulse_circle 5s ease-in-out infinite;
  opacity: 0.6;
}

@keyframes pulse_circle {

  0%,
  100% {
    transform: scale(1);
    opacity: 0.4;
  }

  50% {
    transform: scale(1.2);
    opacity: 0.7;
  }
}

@keyframes dots_move {

  0%,
  100% {
    transform: translate(0, 0);
  }

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

.dots_shape {
  animation: dots_move 6s ease-in-out infinite;
}

.floating_card_counter {
  animation: float_about 4s ease-in-out infinite, glow_card 3s ease-in-out infinite;
}

@keyframes glow_card {

  0%,
  100% {
    box-shadow: 0 15px 40px rgba(0, 158, 171, 0.2);
  }

  50% {
    box-shadow: 0 15px 50px rgba(0, 158, 171, 0.4);
  }
}



/* Clean Classical About Image */
.main_img_wrapper {
  position: relative;
  z-index: 2;
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 20px 40px rgba(13, 34, 63, 0.1);
}


/* Adjusted Height for Creative About Image */
.main_img_wrapper {
  max-height: 480px;
  width: 100%;
}

.main_img_wrapper img {
  height: 480px !important;
  object-fit: cover;
  object-position: top;
  /* Keeps the shirts in view */
}

@media (max-width: 991px) {

  .main_img_wrapper,
  .main_img_wrapper img {
    height: 350px !important;
    max-height: 350px;
  }
}


/* Final Fix for About Image - Full Display without Cutting */
.main_img_wrapper {
  max-height: none !important;
  height: auto !important;
}

.main_img_wrapper img {
  height: auto !important;
  width: 100%;
  /* object-fit: contain !important; */
  /* Ensures no part of the image is cut */
  background: #fff;
  /* Adds a clean background if aspect ratio differs */
}

@media (max-width: 991px) {
  .main_img_wrapper img {
    height: auto !important;
  }
}


/* --- Classic About Section Features --- */
.about_list_classic {
  margin: 35px 0;
}

.classic_feature {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  margin-bottom: 20px;
  padding: 15px;
  border-radius: 15px;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  background: rgba(255, 255, 255, 0.3);
  border: 1px solid transparent;
}

.classic_feature:hover {
  background: #fff;
  border-color: rgba(0, 158, 171, 0.2);
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.05);
  transform: translateX(15px);
}

.feature_icon_box {
  min-width: 55px;
  height: 55px;
  background: #00969f;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  /* box-shadow: 0 8px 15px rgba(210, 21, 30, 0.2); */
}

.feature_text h5 {
  font-size: 19px;
  color: #0d223f;
  margin-bottom: 6px;
  font-weight: 700;
}

.feature_text p {
  font-size: 14.5px;
  color: #555;
  margin: 0 !important;
  line-height: 1.5;
}

.about_btn_classic {
  margin-top: 40px;
}

.classic_btn {
  display: inline-flex;
  align-items: center;
  gap: 15px;
  padding: 18px 40px;
  background: #0d223f;
  color: #fff;
  border-radius: 50px;
  font-weight: 700;
  transition: all 0.3s ease;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  font-size: 14px;
}

.classic_btn:hover {
  background: #d2151e;
  color: #fff;
  transform: translateY(-5px);
  box-shadow: 0 15px 30px rgba(210, 21, 30, 0.4);
}

.classic_btn span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  font-size: 12px;
}

/* === Start Modern Luxury Bento Product Layout ==== */

.shop-detials {
  /* padding: 50px 0; */
  background: #ffffff;
  position: relative;
}

.shop-detials .container {
  max-width: 1200px;
}

/* Bento Grid Alignment */
.product_bento_grid {
  display: grid;
  grid-template-columns: 1fr 0.8fr;
  /* Adjusted for better content balance */
  gap: 80px;
  align-items: start;
  max-width: 1300px;
  margin: 0 auto;
}

/* Left Column: 3D Showcase Refinement */
.product_visual_side {
  position: sticky;
  top: 140px;
  padding-bottom: 50px;
}

.apparel_showcase_3d {
  position: relative;
  width: 100%;
  padding: 20px;
  background: rgba(255, 255, 255, 0.4);
  /* backdrop-filter: blur(10px); */
  border-radius: 40px;
  border: 1px solid rgba(255, 255, 255, 0.8);
  box-shadow: 0 40px 100px rgba(0, 0, 0, 0.03);
}

/* Visibility Fallback */
.owl-carousel {
  display: block !important;
  opacity: 1 !important;
}

/* Custom Slider Navigation */
.owl-nav {
  position: absolute;
  top: 50%;
  width: 100%;
  transform: translateY(-50%);
  display: flex;
  justify-content: space-between;
  padding: 0 10px;
  pointer-events: none;
  z-index: 10;
}

.owl-nav button {
  width: 45px;
  height: 45px;
  background: #ffffff !important;
  color: #0d223f !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1) !important;
  pointer-events: auto;
  transition: all 0.3s !important;
  font-size: 18px !important;
}

.owl-nav button:hover {
  background: #f35622 !important;
  color: #fff !important;
  transform: scale(1.1);
}

.main_display_3d {
  position: relative;
  width: 100%;
  height: 500px;
  /* Fixed display height for alignment */
  background: #ffffff !important;
  border: 1px solid #eee !important;
  border-radius: 40px !important;
  padding: 30px !important;
  box-shadow: 0 30px 60px rgba(0, 0, 0, 0.03) !important;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
  overflow: hidden;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Stage effect under the product */
.main_display_3d::after {
  content: '';
  position: absolute;
  bottom: 40px;
  left: 10%;
  right: 10%;
  height: 20px;
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.1) 0%, transparent 80%);
  filter: blur(10px);
  z-index: 0;
}

.main_display_3d .item {
  height: 440px;
  display: flex;
  align-items: center;
  justify-content: center;
  perspective: 1000px;
}

.main_display_3d .item img {
  max-height: 100%;
  width: auto !important;
  object-fit: contain;
  transition: transform 0.1s ease-out;
  z-index: 1;
  filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.1));
}

.thumb_display_3d {
  margin-top: 30px;
  background: #ffffff !important;
  border: 1px solid #f0f0f0 !important;
  border-radius: 20px !important;
  padding: 15px !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.02) !important;
}

.thumb_display_3d .item {
  height: 100px;
  background: #f9f9f9;
  border-radius: 15px;
  padding: 10px;
  border: 2px solid transparent;
  transition: all 0.3s ease;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.thumb_display_3d .item img {
  height: 100%;
  width: auto !important;
  object-fit: contain;
}

.thumb_display_3d .owl-item.current .item {
  border-color: #f35622;
  background: #ffffff;
  transform: translateY(-5px);
  box-shadow: 0 10px 20px rgba(243, 86, 34, 0.1);
}

/* Right Column: Content Alignment */
.product_info_side {
  padding-top: 20px;
}

.vsw_tag {
  display: inline-block;
  padding: 6px 16px;
  background: rgba(243, 86, 34, 0.08);
  color: #f35622;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
  border-radius: 50px;
  margin-bottom: 25px;
}

.category-title h2 {
  font-size: 56px;
  font-weight: 900;
  color: #0d223f;
  line-height: 1.1;
  /* margin-bottom: 20px; */
  letter-spacing: -2px;
}

.category-icon-list {
  margin-bottom: 30px;
  border-bottom: 1px solid #f0f0f0;
  padding-bottom: 20px;
}

.category-icon-list ul {
  display: flex;
  align-items: center;
  gap: 5px;
}

.category-icon-list li i {
  color: #ffb400;
  font-size: 16px;
}

.category-text {
  margin-left: 10px;
  font-size: 14px;
  color: #888;
  font-weight: 500;
}

.category-description p {
  font-size: 18px;
  line-height: 1.8;
  color: #555;
  margin-bottom: 20px;
  text-align: justify;
}

/* Specs Bento Cards */
.product_specs_grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 15px;
  margin-bottom: 40px;
}

.spec_card {
  background: #f9f9f9;
  padding: 20px;
  border-radius: 15px;
  border: 1px solid #f0f0f0;
  transition: all 0.3s ease;
}

.spec_card:hover {
  background: #ffffff;
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.05);
  transform: translateY(-5px);
}

.spec_label {
  font-size: 11px;
  text-transform: uppercase;
  color: #999;
  font-weight: 700;
  letter-spacing: 1px;
  display: block;
  margin-bottom: 5px;
}

.spec_value {
  font-size: 15px;
  color: #0d223f;
  font-weight: 700;
}

/* High-End Action Section */
.product_actions_v2 {
  display: flex;
  align-items: center;
  gap: 20px;
  margin-top: 50px;
}

.vsw_primary_btn {
  flex-grow: 1;
  background: #0d223f;
  color: #ffffff !important;
  height: 65px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 15px;
  font-weight: 700;
  font-size: 16px;
  text-transform: uppercase;
  letter-spacing: 1px;
  transition: all 0.4s;
  box-shadow: 0 20px 40px rgba(13, 34, 63, 0.2);
}

.vsw_primary_btn:hover {
  background: #f35622;
  transform: translateY(-5px);
  box-shadow: 0 20px 40px rgba(243, 86, 34, 0.3);
}

.vsw_quantity {
  width: 120px;
  height: 65px;
  background: #f0f0f0;
  border-radius: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Tab Section Alignment */
/* --- REFINED PRODUCT TABS SECTION --- */
/* --- LIQUID NEON PREMIUM TABS SECTION --- */
.appoinment-tab {
  margin-top: 30px;
  position: relative;
  padding: 20px;
  border-radius: 20px;
  background: #ffffff;
  overflow: hidden;
  box-shadow: 0 15px 40px rgba(0, 0, 0, 0.04);
  transition: all 0.4s ease;
  margin-bottom: 40px;
}

/* Fluid Animated Border - Thicker Version */
.appoinment-tab::before {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: conic-gradient(
    transparent, 
    #018588, 
    transparent 20%, 
    #0097a1, 
    transparent 50%, 
    #018588
  );
  animation: liquid-rotate 6s linear infinite;
  z-index: 0;
}

@keyframes liquid-rotate {
  100% { transform: rotate(360deg); }
}

/* Inner Container to Mask Border - Thick Line */
.appoinment-tab::after {
  content: "";
  position: absolute;
  inset: 3px; /* Increased from 1px to 6px for a thick visible line */
  background: #fff;
  border-radius: 15px;
  z-index: 1;
}

/* Subtle Aurora Background */
.tab_content {
  position: relative;
  z-index: 2;
  margin-top: 25px; /* Tighter gap */
}

.tabs {
  display: flex;
  gap: 15px;
  margin-bottom: 0px; /* Removed margin to use tab_content margin for precision */
  padding-left: 0;
  list-style: none;
  position: relative;
  z-index: 3;
}

.tabs li a {
  font-size: 14px;
  font-weight: 700;
  color: #666;
  padding: 12px 30px;
  border-radius: 50px;
  display: block;
  transition: all 0.3s ease;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.tabs li.current a {
  color: #fff !important;
  background: #018588;
  box-shadow: 0 8px 20px rgba(1, 133, 136, 0.2);
}

.tabs li a:hover:not(.current a) {
  background: rgba(1, 133, 136, 0.05);
  color: #018588;
}

/* Smooth Liquid Fade Transition */
.tabs_item {
  animation: liquidFade 0.6s ease-out;
}

@keyframes liquidFade {
  0% {
    opacity: 0;
    transform: scale(0.98) translateY(10px);
  }
  100% {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

.appoinment-tab:hover {
  transform: scale(1.01);
  box-shadow: 0 40px 80px rgba(1, 133, 136, 0.1);
}



/* Post Comment & Description Styling */
.post-comment-description p {
  font-size: 16px;
  line-height: 1.8;
  color: #555;
  margin-bottom: 20px;
  text-align: justify;
}

/* Luxury Tech Table Styling */
.tab-items-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 20px;
}

.tab-items-table td {
  padding: 18px 0;
  border-bottom: 1px solid #f0f7f7;
  vertical-align: middle;
}

.tab-items-table tr:last-child td {
  border-bottom: none;
}

.tab-items-table td.table-title {
  width: 25%;
  font-weight: 700;
  color: #0d223f;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 1.5px;
}

.tab-items-table td.table-text {
  color: #666;
  font-weight: 500;
  font-size: 15px;
}

.tab-items-table .bi-star-fill, 
.tab-items-table .bi-star-half {
  color: #ffb400;
  margin-left: 2px;
}

/* --- Product Gallery Full Width with Navigation --- */
.apparel_showcase_3d {
  width: 100%;
  position: relative;
}

.main_display_3d_full {
  width: 100%;
  background: #ffffff;
  border-radius: 40px;
  /* Premium Large Thick Border Design */
  border: 12px solid #f8fcfc; 
  box-shadow: 
    0 0 0 1px rgba(1, 133, 136, 0.2), 
    0 30px 60px rgba(1, 133, 136, 0.06);
  position: relative;
  height: 550px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px;
  transition: all 0.4s ease;
}

.main_display_3d_full:hover {
  transform: translateY(-5px);
  box-shadow: 
    0 0 0 1px rgba(1, 133, 136, 0.5), 
    0 40px 80px rgba(1, 133, 136, 0.1);
}

.main_img_glass_card {
  width: 100%;
  height: 520px; /* Fixed height for neat alignment */
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  border-radius: 40px;
  /* Premium Thick Frame Design */
  border: 15px solid #f8fcfc;
  outline: 1px solid rgba(1, 133, 136, 0.15);
  box-shadow: 
    0 20px 50px rgba(0, 0, 0, 0.05),
    0 0 100px rgba(1, 133, 136, 0.02) inset;
  padding: 40px;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  position: relative;
  overflow: hidden;
}

.main_img_glass_card:hover {
  transform: translateY(-8px) scale(1.02);
  border-color: #f0f7f7;
  outline-color: rgba(1, 133, 136, 0.4);
  box-shadow: 
    0 40px 80px rgba(1, 133, 136, 0.1),
    0 0 0 1px rgba(1, 133, 136, 0.2);
}

.main_img_glass_card img {
  max-height: 100%;
  width: auto !important;
  object-fit: contain;
  filter: drop-shadow(0 30px 50px rgba(0,0,0,0.12));
  transition: transform 0.6s cubic-bezier(0.23, 1, 0.32, 1);
}

.main_img_glass_card:hover img {
  transform: scale(1.05) rotate(-2deg);
}

@keyframes pulse_arrow_mark {
  0% {
    box-shadow: 0 0 0 0 rgba(13, 34, 63, 0.4);
  }

  70% {
    box-shadow: 0 0 0 15px rgba(13, 34, 63, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(13, 34, 63, 0);
  }
}

.product-slider-nav.owl-carousel .owl-nav {
  position: absolute;
  top: 50%;
  width: calc(100% + 30px);
  left: -15px;
  display: flex;
  justify-content: space-between;
  transform: translateY(-50%);
  pointer-events: none;
  z-index: 1000;
  padding: 0;
}

.product-slider-nav.owl-carousel .owl-nav .owl-prev,
.product-slider-nav.owl-carousel .owl-nav .owl-next {
  width: 35px;
  height: 35px;
  background: #0d223f !important;
  color: #ffffff !important;
  border-radius: 50% !important;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1) !important;
  pointer-events: auto !important;
  transition: all 0.3s ease !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  font-size: 16px !important;
  border: 2px solid transparent !important;
  cursor: pointer !important;
  z-index: 1001 !important;
  animation: pulse_arrow_mark 2s infinite cubic-bezier(0.66, 0, 0, 1);
}

.product-slider-nav.owl-carousel .owl-nav .owl-prev:hover,
.product-slider-nav.owl-carousel .owl-nav .owl-next:hover {
  background: #028485 !important;
  color: #ffffff !important;
  transform: scale(1.1);
  box-shadow: 0 8px 25px rgba(243, 86, 34, 0.3) !important;
  animation: none;
}

.product-slider-nav.owl-carousel .owl-nav .owl-prev span,
.product-slider-nav.owl-carousel .owl-nav .owl-next span,
.product-slider-nav.owl-carousel .owl-nav .owl-prev i,
.product-slider-nav.owl-carousel .owl-nav .owl-next i {
  display: flex !important;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

/* Mobile Responsive Slider Navigation */
@media (max-width: 767px) {
  .product-slider-nav.owl-carousel .owl-nav {
    width: 100%;
    left: 0;
    padding: 0 15px;
  }
}

.main_img_glass_card {
  width: 100%;
  height: 500px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
  /* Clips the image when it zooms */
  cursor: pointer;
}



.main_img_glass_card img {
  max-height: 100%;
  max-width: 100%;
  object-fit: contain;
  /* Changed from fill to maintain aspect ratio */
  transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.main_img_glass_card:hover img {
  transform: scale(1.15);
  /* Zooms the image inside the card */
}


/* Mobile Responsive */
@media (max-width: 767px) {
  .showcase_3d_inner {
    flex-direction: column-reverse;
  }

  .thumb_display_3d {
    width: 100%;
    flex-direction: row;
    overflow-x: auto;
    height: auto;
  }

  .thumb_magic_item {
    min-width: 80px;
  }
}

/* Header Alignment Fixes for Laptops and Tablets */
@media (min-width: 992px) and (max-width: 1366px) {
  .printmax-header-area {
    padding: 16px 20px !important;
  }

  .printmax-header-area ul {
    margin-left: 20px !important;
  }

  .header-menu ul li {
    margin: 0 8px 0 !important;
  }

  .header-menu ul li a {
    font-size: 15px !important;
  }

  .header-logo span {
    font-size: 15px !important;
    white-space: nowrap;
  }

  .header-button {
    margin: 0 8px 0 !important;
  }

  .header-button a {
    font-size: 14px !important;
    padding: 10px 20px !important;
  }

  .sidebar-btn {
    margin-left: 5px;
  }
}

/* Ensure Logo text never wraps */
.header-logo span,
.mobile-logo span {
  white-space: nowrap;
  vertical-align: middle;
}

.header-logo img {
  vertical-align: middle;
}

/* Product Details Heading Alignment */
.shop-detials .shop-dtls-info {
  padding-top: 50px;
}

@media (max-width: 991px) {
  .shop-detials .shop-dtls-info {
    padding-top: 20px;
  }
}

.product-slider-nav.owl-carousel .owl-nav {
  pointer-events: none !important;
}

.product-slider-nav.owl-carousel .owl-nav button {
  pointer-events: auto !important;
}

/* --- IN-BUTTON LOADING EFFECT --- */
.graphic_btn_3d.is-loading {
  pointer-events: none;
  background: #00817e !important;
  color: #fff !important;
  box-shadow: none;
  transform: scale(0.98);
}

.graphic_btn_3d .btn-loader-line {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 4px;
  background: #fff;
  width: 0%;
  transition: width 0.1s linear;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
}

.graphic_btn_3d .btn-loader-text {
  font-weight: 900;
  margin-left: 10px;
  color: #fff;
}

/* --- RESPONSIVE MEDIA QUERIES FOR TABS --- */
@media (max-width: 991px) {
  .appoinment-tab {
    padding: 30px;
  }
}

@media (max-width: 767px) {
  .appoinment-tab {
    padding: 25px 20px;
    margin-top: 20px;
    border-radius: 15px;
  }

  .tabs {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    background: transparent;
    padding: 0;
    width: 100%;
  }

  .tabs li {
    width: auto;
  }

  .tabs li a {
    padding: 10px 20px;
    font-size: 11px;
    text-align: center;
    letter-spacing: 0.5px;
  }

  .tab_content {
    margin-top: 20px;
  }

  .post-comment-description p {
    font-size: 14px;
    text-align: left;
    line-height: 1.6;
  }

  .tab-items-table td.table-title {
    width: 40%;
    font-size: 10px;
    padding: 12px 0;
  }
  
  .tab-items-table td.table-text {
    font-size: 12px;
    padding: 12px 0;
  }
}

/* --- RESPONSIVE MEDIA QUERIES FOR IMAGE SHOWCASE --- */
@media (max-width: 991px) {
  .main_img_glass_card {
    height: 450px;
    padding: 30px;
  }
}

@media (max-width: 767px) {
  .main_img_glass_card {
    height: 380px; /* Compact height for mobile */
    padding: 20px;
    border-radius: 25px;
    border-width: 8px; /* Thinner border for small screens */
    margin-bottom: 30px;
  }

  .product-slider-nav.owl-carousel .owl-nav {
    width: 100%;
    left: 0;
    padding: 0 5px;
  }

  .product-slider-nav.owl-carousel .owl-nav .owl-prev, 
  .product-slider-nav.owl-carousel .owl-nav .owl-next {
    width: 30px;
    height: 30px;
    font-size: 14px;
  }
}

/* --- PREMIUM LIGHT BENTO CONTACT REDESIGN --- */
.contact_area.inner_section {
  padding: 80px 0;
  background: #ffffff; /* Clean White Base */
  position: relative;
  overflow: hidden;
}

/* Bright Aurora Glow Backgrounds */
.contact_area.inner_section::before,
.contact_area.inner_section::after {
  content: "";
  position: absolute;
  width: 700px;
  height: 700px;
  border-radius: 50%;
  filter: blur(140px);
  z-index: 0;
  opacity: 0.12; /* Softer for light theme */
  animation: aurora-move 20s infinite alternate;
}

.contact_area.inner_section::before {
  background: #018588;
  top: -150px;
  left: -150px;
}

.contact_area.inner_section::after {
  background: #00e5ee; /* Brighter Aqua */
  bottom: -150px;
  right: -150px;
  animation-delay: -10s;
}

.contact_bento_grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: minmax(110px, auto);
  gap: 12px;
  position: relative;
  z-index: 1;
}

.bento_item {
  background: #ffffff;
  border: 2px solid #00959f;
  border-radius: 35px;
  padding: 20px;
  transition: all 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  display: flex;
  flex-direction: column;
  justify-content: center;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.02);
  color: #555;
  position: relative; /* For corner shapes */
}

/* Corner Shapes Animation */
.bento_item::before,
.bento_item::after,
.cyber_form_container::before,
.cyber_form_container::after {
  content: "";
  position: absolute;
  width: 40px;
  height: 40px;
  border: 4px solid transparent;
  transition: all 0.5s ease;
  pointer-events: none;
  z-index: 2;
}

/* Top-Left Bracket */
.bento_item::before,
.cyber_form_container::before {
  top: 15px;
  left: 15px;
  border-top-color: rgba(1, 133, 136, 0.3);
  border-left-color: rgba(1, 133, 136, 0.3);
  border-radius: 15px 0 0 0;
  animation: corner-pulse 3s infinite alternate;
}

/* Bottom-Right Bracket */
.bento_item::after,
.cyber_form_container::after {
  bottom: 15px;
  right: 15px;
  border-bottom-color: rgba(1, 133, 136, 0.3);
  border-right-color: rgba(1, 133, 136, 0.3);
  border-radius: 0 0 15px 0;
  animation: corner-pulse 3s infinite alternate-reverse;
}

@keyframes corner-pulse {
  0% { transform: scale(1); opacity: 0.5; }
  100% { transform: scale(1.15); opacity: 1; }
}

.bento_item:hover::before,
.cyber_form_container:hover::before {
  top: 5px;
  left: 5px;
  border-top-color: #018588;
  border-left-color: #018588;
  width: 60px;
  height: 60px;
}

.bento_item:hover::after,
.cyber_form_container:hover::after {
  bottom: 5px;
  right: 5px;
  border-bottom-color: #018588;
  border-right-color: #018588;
  width: 60px;
  height: 60px;
}

.bento_item:hover {
  background: #ffffff;
  border-color: rgba(1, 133, 136, 0.3);
  transform: translateY(-12px);
  box-shadow: 0 30px 70px rgba(1, 133, 136, 0.1);
}

.bento_item.large {
  grid-column: span 2;
  grid-row: span 2;
}

.bento_item.wide {
  grid-column: span 2;
}

.bento_icon {
  width: 55px;
  height: 55px;
  background: #f8fcfc;
  color: #018588;
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  margin-bottom: 15px;
  box-shadow: 0 10px 25px rgba(1, 133, 136, 0.05);
  transition: all 0.4s ease;
}

.bento_item:hover .bento_icon {
  background: #018588;
  color: #fff;
  transform: rotate(10deg) scale(1.1);
  box-shadow: 0 15px 35px rgba(1, 133, 136, 0.2);
}

.bento_item h3 {
  font-size: 20px;
  font-weight: 800;
  margin-bottom: 8px;
  color: #0d223f;
}

.bento_item p {
  font-size: 16px;
  color: #666;
  line-height: 1.7;
  margin: 0;
}

.bento_item h4.text-white {
  color: #0d223f !important; /* Fix for light theme */
  font-weight: 500;
}

/* --- LIGHT CYBER CONTACT FORM --- */
.cyber_form_container {
  margin-top: 40px;
  background: #ffffff;
  border-radius: 40px;
  /* border: 1px solid #f0f0f0; */
  border: 1px solid #018e92db;
  padding: 30px;
  position: relative;
  z-index: 1;
  box-shadow: 0 40px 100px rgba(0, 0, 0, 0.03);
}

.cyber_form_container h1 {
  color: #0d223f;
  font-size: 42px;
  font-weight: 800;
  margin-bottom: 35px;
  text-align: center;
  letter-spacing: -1px;
}

.cyber_input_group {
  margin-bottom: 25px;
}

.cyber_input {
  width: 100%;
  background: #fbfdfd !important;
  /* border: 1px solid #edf2f2 !important; */
  border: 1px solid #018e9240 !important;
  border-radius: 18px !important;
  padding: 20px 28px !important;
  color: #333 !important;
  font-size: 15px;
  transition: all 0.3s ease;
}

.cyber_input:focus {
  background: #ffffff !important;
  border-color: #018588 !important;
  box-shadow: 0 15px 35px rgba(1, 133, 136, 0.06);
  outline: none;
}

.cyber_btn {
  width: 100%;
  background: linear-gradient(135deg, #018588, #00b4bd) !important;
  color: #fff !important;
  padding: 22px !important;
  border-radius: 50px !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  letter-spacing: 2px;
  border: none !important;
  transition: all 0.4s ease !important;
  cursor: pointer;
  box-shadow: 0 15px 40px rgba(1, 133, 136, 0.25) !important;
}

.cyber_btn:hover {
  transform: translateY(-6px);
  box-shadow: 0 25px 55px rgba(1, 133, 136, 0.35) !important;
}

@media (max-width: 991px) {
  .contact_bento_grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 767px) {
  .contact_bento_grid {
    grid-template-columns: 1fr;
  }
  .bento_item.large, .bento_item.wide {
    grid-column: span 1;
    grid-row: span 1;
  }
  .cyber_form_container {
    padding: 40px 25px;
  }
  .cyber_form_container h1 {
    font-size: 34px;
  }
}

/* --- FOOTER GALLERY GRID --- */
.footer-gallery-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-top: 15px;
}

.footer-gallery-grid a {
  display: block;
  overflow: hidden;
  border-radius: 8px;
  aspect-ratio: 1;
}

.footer-gallery-grid img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.footer-gallery-grid a:hover img {
  transform: scale(1.15);
}

@media (max-width: 991px) {
  .footer-gallery-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (max-width: 767px) {
  .footer-gallery-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}


/* Static Icon Code Starts  */


/* sticky icon css code start here */
.sticky-icon {
  z-index: 1;
  position: fixed;
  /* top: 20%; */
  top: 55%;
  right: 0%;
  width: 220px;
  display: flex;
  flex-direction: column;
}

.sticky-icon .whatsapp {
  transform: translate(160px, 0px);
  border-radius: 50px 0px 0px 50px;
  text-align: left;
  margin: 2px;
  text-decoration: none;
  padding: 10px;
  font-size: 17px;
  transition: all 0.8s;
}

.sticky-icon .whatsapp:hover {
  color: #FFF;
  transform: translate(0px, 0px);
}

.sticky-icon .whatsapp:hover i {
  transform: rotate(360deg);
}

.whatsapp {
  background-color: green;
  color: #FFF;
}

.sticky-icon .whatsapp i {
  background-color: #FFF;
  height: 40px;
  width: 40px;
  color: #000;
  text-align: center;
  line-height: 40px;
  border-radius: 50%;
  margin-right: 20px;
  transition: all 0.5s;
}

.sticky-icon .whatsapp i.fa-whatsapp {
  background-color: #FFF;
  color: green;
}

/* Static Icon Code Ends */