@charset "UTF-8";
/*-----------------------------------------------------------------------------------

    Template Name: Flone - Minimal eCommerce HTML Template
    Version: 2.0.5

-----------------------------------------------------------------------------------

    CSS INDEX
    ===================

    1. Template default CSS
    2. Header style
    3. Slider style
    4. Support style
    5. Section title style
    6. Product style
    7. Blog style
    8. Footer style
    9. Banner style
    10. Suscribe style
    11. About style
    12. instagram style
    13. Testimonial style
    14. Brand logo style
    15. Timer style
    16. Breadcrumb style
    17. Sidebar style
    18. Shop page
    19. Product details page
    20. Cart page
    21. Checkout page
    22. contact Page
    23. Blog Details Page
    24. login register Page
    25. My account Page
    26. 404 Page

-----------------------------------------------------------------------------------*/
/*----------------------------------------*/
/*  1. Template default CSS
/*----------------------------------------*/
/*-- Google Font --*/
@import url("https://fonts.googleapis.com/css?family=Cormorant+Garamond:300,400,500,600,700|Poppins:300,400,500,600,700,800,900|Oswald:300,400,500,600,700,800,900|Josefin+Sans:wght@300;400;500;600;700|Abril+Fatface|Great+Vibe|Lobster&display=swap");
/*-- Common Style --*/
@media only screen and (min-width: 1200px) {
  .container {
    max-width: 1200px;
  }
}
*,
*::after,
*::before {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html,
body {
  height: 100%;
}

body {
  background-color: #ffffff;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  font-family: "Poppins", sans-serif;
  color: #000;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #000000;
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  margin-top: 0;
}

p {
  font-size: 14px;
  font-weight: 400;
  line-height: 24px;
  color: #333;
  margin-bottom: 15px;
  font-family: "Poppins", sans-serif;
}

h1 {
  font-size: 36px;
  line-height: 42px;
}

h2 {
  font-size: 30px;
  line-height: 36px;
}

h3 {
  font-size: 24px;
  line-height: 30px;
}

h4 {
  font-size: 18px;
  line-height: 24px;
}

h5 {
  font-size: 14px;
  line-height: 18px;
}

h6 {
  font-size: 12px;
  line-height: 14px;
}

p:last-child {
  margin-bottom: 0;
}

a,
button {
  color: inherit;
  line-height: inherit;
  text-decoration: none;
  cursor: pointer;
  color: #000;
}

a,
button,
img,
input,
span {
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

*:focus {
  outline: none !important;
}

a:focus {
  color: inherit;
  outline: none;
  text-decoration: none;
}

a:hover {
  text-decoration: none;
}

button,
input[type=submit] {
  cursor: pointer;
}

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

/*-- 
    - Common Classes
-----------------------------------------*/
.fix {
  overflow: hidden;
}

.hidden {
  display: none;
}

.clear {
  clear: both;
}

.section {
  float: left;
  width: 100%;
}

.capitalize {
  text-transform: capitalize;
}

.uppercase {
  text-transform: uppercase;
}

.bg-img {
  background-position: center center;
  background-size: cover;
}

.border-bottom-1 {
  border-bottom: 1px solid #d5d5d5;
}

a:hover {
  color: #000000;
}

/*************************
  Basic margin padding
*************************/
.m-0 {
  margin-top: 0;
  margin-right: 0;
  margin-bottom: 0;
  margin-left: 0;
}

.p-0 {
  padding-top: 0;
  padding-right: 0;
  padding-bottom: 0;
  padding-left: 0;
}

/*************************
         Margin top
*************************/
.mt-0 {
  margin-top: 0;
}

.mt-10 {
  margin-top: 10px;
}

.mt-12 {
  margin-top: 12px;
}

.mt-15 {
  margin-top: 15px;
}

.mt-20 {
  margin-top: 20px;
}

.mt-25 {
  margin-top: 25px;
}

.mt-30 {
  margin-top: 30px;
}

.mt-35 {
  margin-top: 35px;
}

.mt-40 {
  margin-top: 40px;
}

.mt-45 {
  margin-top: 45px;
}

.mt-50 {
  margin-top: 50px;
}

.mt-55 {
  margin-top: 55px;
}

.mt-60 {
  margin-top: 60px;
}

.mt-70 {
  margin-top: 70px;
}

.mt-80 {
  margin-top: 80px;
}
@media only screen and (max-width: 767px) {
  .mt-80 {
    margin-top: 60px;
  }
}

.mt-90 {
  margin-top: 90px;
}

.mt-100 {
  margin-top: 100px;
}

.mt-110 {
  margin-top: 110px;
}

.mt-120 {
  margin-top: 120px;
}

.mt-130 {
  margin-top: 130px;
}

.mt-140 {
  margin-top: 140px;
}

.mt-150 {
  margin-top: 150px;
}

.mt-195 {
  margin-top: 195px;
}

.mt-200 {
  margin-top: 200px;
}

/*************************
      Margin right
*************************/
.mr-0 {
  margin-right: 0px;
}

.mr-10 {
  margin-right: 10px;
}

.mr-12 {
  margin-right: 12px;
}

.mr-15 {
  margin-right: 15px;
}

.mr-20 {
  margin-right: 20px;
}

.mr-30 {
  margin-right: 30px;
}

.mr-35 {
  margin-right: 35px;
}

.mr-40 {
  margin-right: 40px;
}

.mr-50 {
  margin-right: 50px;
}

.mr-60 {
  margin-right: 60px;
}

.mr-70 {
  margin-right: 70px;
}

.mr-80 {
  margin-right: 80px;
}

.mr-90 {
  margin-right: 90px;
}

.mr-100 {
  margin-right: 100px;
}

.mr-110 {
  margin-right: 110px;
}

.mr-120 {
  margin-right: 120px;
}

.mr-130 {
  margin-right: 130px;
}

.mr-140 {
  margin-right: 140px;
}

.mr-150 {
  margin-right: 150px;
}

/*************************
      Margin bottom
*************************/
.mb-0 {
  margin-bottom: 0;
}

.mb-10 {
  margin-bottom: 10px;
}

.mb-12 {
  margin-bottom: 12px;
}

.mb-15 {
  margin-bottom: 15px;
}

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

.mb-25 {
  margin-bottom: 25px;
}

.mb-30 {
  margin-bottom: 30px;
}

.mb-35 {
  margin-bottom: 35px;
}

.mb-40 {
  margin-bottom: 40px;
}

.mb-45 {
  margin-bottom: 45px;
}

.mb-50 {
  margin-bottom: 50px;
}

.mb-55 {
  margin-bottom: 55px;
}

.mb-60 {
  margin-bottom: 60px;
}

.mb-65 {
  margin-bottom: 65px;
}

.mb-70 {
  margin-bottom: 70px;
}

.mb-75 {
  margin-bottom: 75px;
}

.mb-80 {
  margin-bottom: 80px;
}
@media only screen and (max-width: 767px) {
  .mb-80 {
    margin-bottom: 60px;
  }
}

.mb-90 {
  margin-bottom: 90px;
}

.mb-95 {
  margin-bottom: 95px;
}

.mb-100 {
  margin-bottom: 100px;
}
@media only screen and (max-width: 767px) {
  .mb-100 {
    margin-bottom: 50px;
  }
}

.mb-110 {
  margin-bottom: 110px;
}

.mb-120 {
  margin-bottom: 120px;
}

.mb-130 {
  margin-bottom: 130px;
}

.mb-140 {
  margin-bottom: 140px;
}

.mb-150 {
  margin-bottom: 150px;
}

/*************************
        Margin left
*************************/
.ml-0 {
  margin-left: 0;
}

.ml-10 {
  margin-left: 10px;
}

.ml-12 {
  margin-left: 12px;
}

.ml-15 {
  margin-left: 15px;
}

.ml-20 {
  margin-left: 20px;
}

.ml-30 {
  margin-left: 30px;
}

.ml-40 {
  margin-left: 40px;
}

.ml-50 {
  margin-left: 50px;
}

.ml-55 {
  margin-left: 55px;
}

.ml-60 {
  margin-left: 60px;
}

.ml-70 {
  margin-left: 70px;
}

.ml-75 {
  margin-left: 75px;
}

.ml-80 {
  margin-left: 80px;
}

.ml-90 {
  margin-left: 90px;
}

.ml-95 {
  margin-left: 95px;
}

.ml-100 {
  margin-left: 100px;
}

.ml-110 {
  margin-left: 110px;
}

.ml-120 {
  margin-left: 120px;
}

.ml-130 {
  margin-left: 130px;
}

.ml-140 {
  margin-left: 140px;
}

.ml-145 {
  margin-left: 145px;
}

.ml-150 {
  margin-left: 150px;
}

.ml-ntv5 {
  margin-left: -5px;
}

/*************************
        Padding top
*************************/
.pt-0 {
  padding-top: 0;
}

.pt-10 {
  padding-top: 10px;
}

.pt-15 {
  padding-top: 15px;
}

.pt-20 {
  padding-top: 20px;
}

.pt-25 {
  padding-top: 25px;
}

.pt-30 {
  padding-top: 30px;
}

.pt-35 {
  padding-top: 35px;
}

.pt-40 {
  padding-top: 40px;
}

.pt-45 {
  padding-top: 45px;
}

.pt-50 {
  padding-top: 50px;
}

.pt-55 {
  padding-top: 55px;
}

.pt-60 {
  padding-top: 60px;
}

.pt-70 {
  padding-top: 70px;
}
@media only screen and (max-width: 767px) {
  .pt-70 {
    padding-top: 60px;
  }
}

.pt-75 {
  padding-top: 75px;
}

.pt-80 {
  padding-top: 80px;
}
@media only screen and (max-width: 767px) {
  .pt-80 {
    padding-top: 60px;
  }
}

.pt-95 {
  padding-top: 95px;
}
@media only screen and (max-width: 767px) {
  .pt-95 {
    padding-top: 55px;
  }
}

.pt-90 {
  padding-top: 90px;
}
@media only screen and (max-width: 767px) {
  .pt-90 {
    padding-top: 50px;
  }
}

.pt-100 {
  padding-top: 100px;
}
@media only screen and (max-width: 767px) {
  .pt-100 {
    padding-top: 60px;
  }
}

.pt-105 {
  padding-top: 105px;
}

.pt-110 {
  padding-top: 110px;
}
@media only screen and (max-width: 767px) {
  .pt-110 {
    padding-top: 40px;
  }
}

.pt-115 {
  padding-top: 115px;
}
@media only screen and (max-width: 767px) {
  .pt-115 {
    padding-top: 60px;
  }
}

.pt-120 {
  padding-top: 120px;
}
@media only screen and (max-width: 767px) {
  .pt-120 {
    padding-top: 50px;
  }
}

.pt-125 {
  padding-top: 125px;
}
@media only screen and (max-width: 767px) {
  .pt-125 {
    padding-top: 55px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pt-125 {
    padding-top: 75px;
  }
}

.pt-128 {
  padding-top: 128px;
}

.pt-130 {
  padding-top: 130px;
}
@media only screen and (max-width: 767px) {
  .pt-130 {
    padding-top: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pt-130 {
    padding-top: 80px;
  }
}

.pt-135 {
  padding-top: 135px;
}

.pt-140 {
  padding-top: 140px;
}

.pt-150 {
  padding-top: 150px;
}

.pt-155 {
  padding-top: 155px;
}

.pt-170 {
  padding-top: 170px;
}

.pt-180 {
  padding-top: 180px;
}
@media only screen and (max-width: 767px) {
  .pt-180 {
    padding-top: 60px;
  }
}

.pt-205 {
  padding-top: 205px;
}

.pt-230 {
  padding-top: 230px;
}

.pt-270 {
  padding-top: 270px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pt-270 {
    padding-top: 170px;
  }
}
@media only screen and (max-width: 767px) {
  .pt-270 {
    padding-top: 100px;
  }
}

.pt-240 {
  padding-top: 240px;
}

.pt-365 {
  padding-top: 365px;
}

.pt-370 {
  padding-top: 370px;
}

.pt-380 {
  padding-top: 380px;
}

/*************************
        Padding right
*************************/
.pr-0 {
  padding-right: 0;
}

.pr-10 {
  padding-right: 10px;
}

.pr-15 {
  padding-right: 15px;
}

.pr-20 {
  padding-right: 20px;
}

.pr-30 {
  padding-right: 30px;
}

.pr-40 {
  padding-right: 40px;
}

.pr-50 {
  padding-right: 50px;
}

.pr-60 {
  padding-right: 60px;
}

.pr-70 {
  padding-right: 70px;
}

.pr-80 {
  padding-right: 80px;
}

.pr-90 {
  padding-right: 90px;
}

.pr-100 {
  padding-right: 100px;
}

.pr-110 {
  padding-right: 110px;
}

.pr-120 {
  padding-right: 120px;
}

.pr-130 {
  padding-right: 130px;
}

.pr-140 {
  padding-right: 140px;
}

.pr-155 {
  padding-right: 155px;
}

.pr-270 {
  padding-right: 270px;
}

/*************************
        Padding bottom
*************************/
.pb-0 {
  padding-bottom: 0;
}

.pb-10 {
  padding-bottom: 10px;
}

.pb-15 {
  padding-bottom: 15px;
}

.pb-20 {
  padding-bottom: 20px;
}

.pb-25 {
  padding-bottom: 25px;
}

.pb-30 {
  padding-bottom: 30px;
}

.pb-35 {
  padding-bottom: 35px;
}

.pb-40 {
  padding-bottom: 40px;
}

.pb-50 {
  padding-bottom: 50px;
}

.pb-55 {
  padding-bottom: 55px;
}
@media only screen and (max-width: 767px) {
  .pb-55 {
    padding-bottom: 15px;
  }
}

.pb-60 {
  padding-bottom: 60px;
}
@media only screen and (max-width: 767px) {
  .pb-60 {
    padding-bottom: 20px;
  }
}

.pb-65 {
  padding-bottom: 65px;
}

.pb-70 {
  padding-bottom: 70px;
}
@media only screen and (max-width: 767px) {
  .pb-70 {
    padding-bottom: 30px;
  }
}

.pb-80 {
  padding-bottom: 80px;
}
@media only screen and (max-width: 767px) {
  .pb-80 {
    padding-bottom: 40px;
  }
}

.pb-85 {
  padding-bottom: 85px;
}

.pb-90 {
  padding-bottom: 90px;
}
@media only screen and (max-width: 767px) {
  .pb-90 {
    padding-bottom: 50px;
  }
}

.pb-95 {
  padding-bottom: 95px;
}
@media only screen and (max-width: 767px) {
  .pb-95 {
    padding-bottom: 55px;
  }
}

.pb-100 {
  padding-bottom: 100px;
}
@media only screen and (max-width: 767px) {
  .pb-100 {
    padding-bottom: 30px;
  }
}

.pb-105 {
  padding-bottom: 105px;
}

.pb-110 {
  padding-bottom: 110px;
}

.pb-115 {
  padding-bottom: 115px;
}
@media only screen and (max-width: 767px) {
  .pb-115 {
    padding-bottom: 60px;
  }
}

.pb-120 {
  padding-bottom: 120px;
}
@media only screen and (max-width: 767px) {
  .pb-120 {
    padding-bottom: 50px;
  }
}

.pb-125 {
  padding-bottom: 125px;
}

.pb-130 {
  padding-bottom: 130px;
}
@media only screen and (max-width: 767px) {
  .pb-130 {
    padding-bottom: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pb-130 {
    padding-bottom: 80px;
  }
}

.pb-140 {
  padding-bottom: 140px;
}
@media only screen and (max-width: 767px) {
  .pb-140 {
    padding-bottom: 60px;
  }
}

.pb-145 {
  padding-bottom: 145px;
}

.pb-150 {
  padding-bottom: 150px;
}

.pb-170 {
  padding-bottom: 170px;
}

.pb-180 {
  padding-bottom: 180px;
}

.pb-280 {
  padding-bottom: 280px;
}

.pb-210 {
  padding-bottom: 210px;
}

.pb-285 {
  padding-bottom: 285px;
}

.pb-270 {
  padding-bottom: 270px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .pb-270 {
    padding-bottom: 170px;
  }
}
@media only screen and (max-width: 767px) {
  .pb-270 {
    padding-bottom: 100px;
  }
}

.pb-290 {
  padding-bottom: 290px;
}

/*************************
        Padding left
*************************/
.pl-0 {
  padding-left: 0;
}

.pl-10 {
  padding-left: 10px;
}

.pl-15 {
  padding-left: 15px;
}

.pl-20 {
  padding-left: 20px;
}

.pl-30 {
  padding-left: 30px;
}

.pl-40 {
  padding-left: 40px;
}

.pl-50 {
  padding-left: 50px;
}

.pl-60 {
  padding-left: 60px;
}

.pl-70 {
  padding-left: 70px;
}

.pl-80 {
  padding-left: 80px;
}

.pl-90 {
  padding-left: 90px;
}

.pl-100 {
  padding-left: 100px;
}

.pl-110 {
  padding-left: 110px;
}

.pl-120 {
  padding-left: 120px;
}

.pl-130 {
  padding-left: 130px;
}

.pl-140 {
  padding-left: 140px;
}

.pl-150 {
  padding-left: 150px;
}

.pl-155 {
  padding-left: 155px;
}

.pl-190 {
  padding-left: 190px;
}

/***************************
    Page section padding 
****************************/
.ptb-0 {
  padding: 0;
}

.ptb-10 {
  padding: 10px 0;
}

.ptb-20 {
  padding: 20px 0;
}

.ptb-30 {
  padding: 30px 0;
}

.ptb-35 {
  padding: 35px 0;
}

.ptb-32 {
  padding: 32px 0;
}

.ptb-40 {
  padding: 40px 0;
}

.ptb-50 {
  padding: 50px 0;
}

.ptb-60 {
  padding: 60px 0;
}

.ptb-70 {
  padding: 70px 0;
}

.ptb-80 {
  padding: 80px 0;
}

.ptb-90 {
  padding: 90px 0;
}

.ptb-100 {
  padding: 100px 0;
}

.ptb-110 {
  padding: 110px 0;
}

.ptb-120 {
  padding: 120px 0;
}

.ptb-130 {
  padding: 130px 0;
}

.ptb-140 {
  padding: 140px 0;
}

.ptb-150 {
  padding: 150px 0;
}

.ptb-160 {
  padding: 160px 0;
}

.ptb-170 {
  padding: 170px 0;
}

.ptb-177 {
  padding: 177px 0;
}

.ptb-180 {
  padding: 180px 0;
}

.ptb-190 {
  padding: 190px 0;
}

.ptb-200 {
  padding: 200px 0;
}

.ptb-210 {
  padding: 210px 0;
}

.ptb-220 {
  padding: 220px 0;
}

.ptb-290 {
  padding: 290px 0;
}

.ptb-310 {
  padding: 310px 0;
}

/***************************
    Page section margin 
****************************/
.mtb-0 {
  margin: 0;
}

.mtb-10 {
  margin: 10px 0;
}

.mtb-15 {
  margin: 15px 0;
}

.mtb-20 {
  margin: 20px 0;
}

.mtb-30 {
  margin: 30px 0;
}

.mtb-40 {
  margin: 40px 0;
}

.mtb-50 {
  margin: 50px 0;
}

.mtb-60 {
  margin: 60px 0;
}

.mtb-70 {
  margin: 70px 0;
}

.mtb-80 {
  margin: 80px 0;
}

.mtb-90 {
  margin: 90px 0;
}

.mtb-100 {
  margin: 100px 0;
}

.mtb-110 {
  margin: 110px 0;
}

.mtb-120 {
  margin: 120px 0;
}

.mtb-130 {
  margin: 130px 0;
}

.mtb-140 {
  margin: 140px 0;
}

.mtb-150 {
  margin: 150px 0;
}

.mtb-290 {
  margin: 290px 0;
}

/*-- 
    - Input Placeholder
-----------------------------------------*/
input:-moz-placeholder,
textarea:-moz-placeholder {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

input::-moz-placeholder,
textarea::-moz-placeholder {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

input {
  background: #eceff8;
  border: 2px solid #eceff8;
  height: 45px;
  -webkit-box-shadow: none;
          box-shadow: none;
  padding-left: 10px;
  font-size: 14px;
  color: #333;
  width: 100%;
}

select {
  width: 100%;
  background: transparent;
  border: 0px solid #eceff8;
  -webkit-box-shadow: none;
          box-shadow: none;
  font-size: 14px;
  color: #333;
}

option {
  background: #fff;
  border: 0px solid #626262;
  padding-left: 10px;
  font-size: 14px;
}

input:focus {
  background: transparent;
}

textarea {
  resize: vertical;
  background: #eceff8;
  border: 2px solid #eceff8;
  padding: 10px;
  width: 100%;
  font-size: 14px;
}

textarea:focus {
  background: transparent;
  border: 2px solid #4FC1F0;
  outline: none;
}

.input-group.divcenter.input-group .form-control {
  padding-left: 0px;
}

.custom-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .custom-row {
    margin-right: -15px;
    margin-left: -15px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .custom-row {
    margin-right: -15px;
    margin-left: -15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .custom-row {
    margin-right: -15px;
    margin-left: -15px;
  }
}
@media only screen and (max-width: 767px) {
  .custom-row {
    margin-right: -15px;
    margin-left: -15px;
  }
}

.custom-row-2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-right: -5px;
  margin-left: -5px;
}
.custom-row-2 div[class^=col-] {
  padding-left: 5px;
  padding-right: 5px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .custom-row-2 div[class^=col-] {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media only screen and (max-width: 767px) {
  .custom-row-2 div[class^=col-] {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .custom-row-2 {
    margin-right: -5px;
    margin-left: -5px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .custom-row-2 {
    margin-right: -5px;
    margin-left: -5px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .custom-row-2 {
    margin-right: -15px;
    margin-left: -15px;
  }
}
@media only screen and (max-width: 767px) {
  .custom-row-2 {
    margin-right: -15px;
    margin-left: -15px;
  }
}

.custom-row-3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-right: -13.6px;
  margin-left: -13.6px;
}
.custom-row-3 div[class^=col-] {
  padding-left: 13.6px;
  padding-right: 13.6px;
}
@media only screen and (max-width: 767px) {
  .custom-row-3 div[class^=col-] {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .custom-row-3 {
    margin-right: -13.6px;
    margin-left: -13.6px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .custom-row-3 {
    margin-right: -13.6px;
    margin-left: -13.6px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .custom-row-3 {
    margin-right: -13.6px;
    margin-left: -13.6px;
  }
}
@media only screen and (max-width: 767px) {
  .custom-row-3 {
    margin-right: -15px;
    margin-left: -15px;
  }
}

.custom-col-5 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 20%;
          flex: 0 0 20%;
  max-width: 20%;
  padding-right: 15px;
  padding-left: 15px;
  position: relative;
  width: 100%;
  min-height: 1px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .custom-col-5 {
    padding-right: 15px;
    padding-left: 15px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .custom-col-5 {
    padding-right: 15px;
    padding-left: 15px;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 33.333%;
            flex: 0 0 33.333%;
    max-width: 33.333%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .custom-col-5 {
    padding-right: 15px;
    padding-left: 15px;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%;
  }
}
@media only screen and (max-width: 767px) {
  .custom-col-5 {
    padding-right: 15px;
    padding-left: 15px;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .custom-col-5 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%;
  }
}

.mobile-menu-area {
  display: none;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .mobile-menu-area {
    display: block;
  }
}
@media only screen and (max-width: 767px) {
  .mobile-menu-area {
    display: block;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .mobile-menu-area {
    display: block;
  }
}
.mobile-menu-area.white-mobile-menu a.meanmenu-reveal {
  color: #fff;
  border: 1px solid #fff;
}
.mobile-menu-area.white-mobile-menu a.meanmenu-reveal span {
  background-color: #fff;
}

.stick .mobile-menu-area.white-mobile-menu a.meanmenu-reveal {
  color: #333;
  border: 1px solid #333;
}
.stick .mobile-menu-area.white-mobile-menu a.meanmenu-reveal span {
  background-color: #333;
}

.mean-container a.meanmenu-reveal {
  top: -30px;
}

#mobile-menu-active {
  display: none;
}

.mobile-menu .mean-nav ul.menu-overflow {
  height: 215px;
  margin-top: 10;
  overflow-y: auto;
}

.mobile-menu.mean-container .mean-nav ul {
  margin: 14px 0 0;
}

/*-- 
    Scroll Up 
-----------------------------------------*/
#scrollUp {
  width: 50px;
  height: 50px;
  background-color: #000000;
  color: #fff;
  right: 20px;
  bottom: 60px;
  text-align: center;
  overflow: hidden;
  border-radius: 50px;
  z-index: 9811 !important;
}
@media only screen and (max-width: 767px) {
  #scrollUp {
    width: 40px;
    height: 40px;
  }
}
#scrollUp i {
  display: block;
  line-height: 50px;
  font-size: 22px;
}
@media only screen and (max-width: 767px) {
  #scrollUp i {
    line-height: 40px;
    font-size: 16px;
  }
}
#scrollUp:hover i {
  -webkit-animation-name: fadeInUp;
          animation-name: fadeInUp;
  -webkit-animation-duration: 1s;
          animation-duration: 1s;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

.height-100 {
  height: 100vh;
}

/*--
    - Background Color
------------------------------------------*/
.bg-purple {
  background-color: #f0e0ff;
}

.bg-purple-2 {
  background-color: #cea1f8;
}

.bg-gray {
  background-color: #f6f6f8;
}

.bg-gray-2 {
  background-color: #f6f6f6;
}

.bg-gray-3 {
  background-color: #f7f7f7;
}

.bg-gray-4 {
  background-color: #f1f1f1;
}

.bg-gray-5 {
  background-color: #f9f9f9;
}

.bg-gray-6 {
  background-color: #e9e6e9;
}

.bg-black {
  background-color: #000000;
}

.bg-black-2 {
  background-color: #1b1b1b;
}

.bg-black-3 {
  background-color: #202022;
}

.bg-glaucous {
  background-color: #daedff;
}

.bg-aqua {
  background-color: #dbfffb;
}

.bg-white {
  background-color: #fff;
}

.bg-punch {
  background-color: #ff8e8d;
}

.bg-pink {
  background-color: #d70056;
}

.bg-skyblue {
  background-color: #99d5da;
}

.default-overlay {
  position: relative;
}
.default-overlay:before {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  content: "";
  right: 0;
  bottom: 0;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .res-white-overly-md {
    position: relative;
  }
  .res-white-overly-md:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: "";
    background-color: #fff;
    opacity: 0.4;
    z-index: 9;
  }
}
@media only screen and (max-width: 767px) {
  .res-white-overly-xs {
    position: relative;
  }
  .res-white-overly-xs:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: "";
    background-color: #fff;
    opacity: 0.4;
    z-index: 2;
  }

  .res-black-overly-xs {
    position: relative;
  }
  .res-black-overly-xs:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: "";
    background-color: #000;
    opacity: 0.4;
    z-index: 9;
  }
}
.btn-hover a {
  position: relative;
  -webkit-transition: all 0.5s ease-in-out 0s;
  -o-transition: all 0.5s ease-in-out 0s;
  transition: all 0.5s ease-in-out 0s;
  border:1px solid #ccc !important;
}
.btn-disabled {
	background-color:#c4c3c3 !important;
}
.btn-hover a:hover {
  border: 1px solid #000000;
  color: #fff;
}
.btn-hover a::before, .btn-hover a::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-transition: all 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
  -o-transition: all 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: all 0.5s cubic-bezier(0.645, 0.045, 0.355, 1);
  z-index: -1;
}
.btn-hover a::after {
  width: 0;
  left: auto;
  right: 0;
  background: #000000;
}
.btn-hover a:hover::after {
  width: 100%;
  left: 0;
  right: auto;
}
.btn-hover.slider-btn-round a::before, .btn-hover.slider-btn-round a::after, .btn-hover.discover-more-btn a::before, .btn-hover.discover-more-btn a::after, .btn-hover.btn-only-round a::before, .btn-hover.btn-only-round a::after, .btn-hover.banner-cake-btn-1 a::before, .btn-hover.banner-cake-btn-1 a::after, .btn-hover.valentine-btn a::before, .btn-hover.valentine-btn a::after {
  border-radius: 50px;
}
.btn-hover.slider-btn-round-white a:hover {
  border: 1px solid #000000;
}
.btn-hover.discover-more-btn a:hover, .btn-hover.banner-cake-btn-1 a:hover {
  border: none;
}

a.default-btn {
  font-size: 16px;
  color: #010101;
  display: inline-block;
  border: 1px solid #333;
  text-transform: uppercase;
  line-height: 1;
  padding: 19px 50px 21px;
}

/* slider img bounce */
@-webkit-keyframes bounce-img {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  50% {
    opacity: 1;
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}
@keyframes bounce-img {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
  50% {
    opacity: 1;
    -webkit-transform: translateY(20px);
            transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}
@-webkit-keyframes snow {
  0% {
    background-position: 0 0, 0 0, 0 0;
  }
  100% {
    background-position: 500px 1000px, 400px 400px, 300px 300px;
  }
}
@keyframes snow {
  0% {
    background-position: 0 0, 0 0, 0 0;
  }
  100% {
    background-position: 500px 1000px, 400px 400px, 300px 300px;
  }
}
.effect-snow {
  background-image: url("../img/bg/snow1.png");
  -webkit-animation: snow 20s linear infinite;
          animation: snow 20s linear infinite;
}

.body-effect {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 0;
  background-color: rgba(0, 0, 0, 0);
}

.padding-10-row-col .row {
  margin-right: -5px;
  margin-left: -5px;
}
.padding-10-row-col .row div[class^=col-] {
  padding-left: 5px;
  padding-right: 5px;
}

.padding-20-row-col .row {
  margin-right: -10px;
  margin-left: -10px;
}
.padding-20-row-col .row div[class^=col-] {
  padding-left: 10px;
  padding-right: 10px;
}

.hm21-section-padding .container-fluid {
  padding-right: 10px;
  padding-left: 10px;
}

/*----- 2. Header style ----*/
.header-area {
  position: relative;
}

.sticky-bar.stick {
  -webkit-animation: 700ms ease-in-out 0s normal none 1 running fadeInDown;
          animation: 700ms ease-in-out 0s normal none 1 running fadeInDown;
  background-color: #fff;
  border-bottom: 0 solid #4a90e2;
  -webkit-box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.06);
          box-shadow: 0 0 25px 0 rgba(0, 0, 0, 0.06);
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999;
  left: 0;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.header-padding-1 .container-fluid {
  padding: 0 80px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .header-padding-1 .container-fluid {
    padding: 0 15px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-padding-1 .container-fluid {
    padding: 0 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-padding-1 .container-fluid {
    padding: 0 40px;
  }
}
@media only screen and (max-width: 767px) {
  .header-padding-1 .container-fluid {
    padding: 0 15px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-res-padding {
    padding: 20px 0 15px;
  }
}
@media only screen and (max-width: 767px) {
  .header-res-padding {
    padding: 20px 0 15px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-ptb-hm5 {
    padding: 40px 0 15px;
  }

  .stick.header-ptb-hm5 {
    padding: 20px 0 15px;
  }
}
.logo {
  margin-top: 32px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .logo {
    margin-top: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .logo {
    margin-top: 0px;
  }
}
.logo.logo-hm5 {
  margin-top: 41px;
}
.logo.logo-hm5 a.sticky-block {
  display: none;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .logo.logo-hm5 {
    margin-top: 0px;
    text-align: left !important;
  }
}
@media only screen and (max-width: 767px) {
  .logo.logo-hm5 {
    margin-top: 0px;
    text-align: left !important;
  }
}

.stick .logo-hm5 a.sticky-block {
  display: block;
}
.stick .logo-hm5 a.sticky-none {
  display: none;
}

.main-menu nav ul {
  display: block;
  text-align: center;
  margin-top: -5px;
}
.main-menu nav ul li {
  display: inline-block;
  padding: 0 15px;
  position: relative;
}
.main-menu nav ul li ul.submenu {
  background: #fff none repeat scroll 0 0;
  -webkit-box-shadow: 0 0 7px 0.5px rgba(0, 0, 0, 0.15);
          box-shadow: 0 0 7px 0.5px rgba(0, 0, 0, 0.15);
  display: block;
  left: 0;
  padding: 20px 0px 22px;
  position: absolute;
  top: 100%;
  -webkit-transform: rotateX(90deg);
          transform: rotateX(90deg);
  -webkit-transform-origin: center top 0;
      -ms-transform-origin: center top 0;
          transform-origin: center top 0;
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  visibility: hidden;
  width: 190px;
  z-index: 999;
}
.main-menu nav ul li ul.submenu li {
  display: block;
  padding: 0 20px;
  margin-left: 0px;
}
.main-menu nav ul li ul.submenu li a {
  color: #333;
  display: block;
  font-size: 13px;
  font-weight: 400;
  line-height: 32px;
  text-align: left;
  text-transform: capitalize;
  padding-top: 0px;
}
.main-menu nav ul li ul.submenu li a:hover {
  color: #000000;
}
.main-menu nav ul li ul.submenu li a::before {
  background: #000000 none repeat scroll 0 0;
  border-radius: 50%;
  content: "";
  height: 7px;
  left: 15px;
  opacity: 0;
  position: absolute;
  top: 13px;
  -webkit-transition: all 0.3s ease-in-out 0s;
  -o-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
  width: 7px;
  z-index: 999;
}
.main-menu nav ul li ul.submenu li:hover a::before {
  opacity: 1;
}
.main-menu nav ul li ul.submenu li:hover a {
  padding-left: 12px;
}
.main-menu nav ul li ul.mega-menu {
  background-color: #fff;
  display: block;
  left: 0;
  padding: 40px 40px 0px 40px;
  position: absolute;
  text-align: left;
  top: 100%;
  -webkit-transform: rotateX(90deg);
          transform: rotateX(90deg);
  -webkit-transform-origin: center top 0;
      -ms-transform-origin: center top 0;
          transform-origin: center top 0;
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  visibility: hidden;
  width: 770px;
  z-index: 999;
  -webkit-box-shadow: 0 1px 7px -2px rgba(0, 0, 0, 0.3);
          box-shadow: 0 1px 7px -2px rgba(0, 0, 0, 0.3);
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .main-menu nav ul li ul.mega-menu {
    left: -75px;
    width: 750px;
    padding: 40px 30px 0px 30px;
  }
}
.main-menu nav ul li ul.mega-menu > li {
  display: inline-block;
  float: left;
  margin-left: 0;
  padding: 0;
  width: 33.33%;
}
.main-menu nav ul li ul.mega-menu > li ul li.mega-menu-title {
  float: inherit;
  width: 100%;
}
.main-menu nav ul li ul.mega-menu > li ul li.mega-menu-title a {
  color: #242424;
  margin: 0 0 10px;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 500;
}
.main-menu nav ul li ul.mega-menu > li ul li.mega-menu-title a::before {
  display: none;
}
.main-menu nav ul li ul.mega-menu > li ul li.mega-menu-title:hover a {
  padding-left: 0px;
}
.main-menu nav ul li ul.mega-menu > li ul li {
  display: block;
  float: inherit;
  padding: 0px;
}
.main-menu nav ul li ul.mega-menu > li ul li a {
  color: #333;
  display: block;
  font-size: 13px;
  font-weight: 400;
  line-height: 32px;
  text-align: left;
  text-transform: capitalize;
  padding-top: 0px;
  position: relative;
}
.main-menu nav ul li ul.mega-menu > li ul li a:hover {
  color: #000000;
}
.main-menu nav ul li ul.mega-menu > li ul li a::before {
  background: #000000 none repeat scroll 0 0;
  border-radius: 50%;
  content: "";
  height: 7px;
  left: 0px;
  opacity: 0;
  position: absolute;
  top: 13px;
  -webkit-transition: all 0.3s ease-in-out 0s;
  -o-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
  width: 7px;
  z-index: 999;
}
.main-menu nav ul li ul.mega-menu > li ul li.mega-menu-img:hover a {
  padding-left: 0px;
}
.main-menu nav ul li ul.mega-menu > li ul li.mega-menu-img a::before {
  display: none;
}
.main-menu nav ul li ul.mega-menu > li ul li:hover a::before {
  opacity: 1;
}
.main-menu nav ul li ul.mega-menu > li ul li:hover a {
  padding-left: 12px;
}
.main-menu nav ul li ul.mega-menu.mega-menu-padding {
  padding: 40px 40px 36px 40px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .main-menu nav ul li ul.mega-menu.mega-menu-padding {
    left: 0px;
    padding: 40px 30px 36px 30px;
  }
}
.main-menu nav ul li:hover > ul.submenu {
  -webkit-transform: rotateX(0deg);
          transform: rotateX(0deg);
  visibility: visible;
}
.main-menu nav ul li:hover > ul.mega-menu {
  -webkit-transform: rotateX(0deg);
          transform: rotateX(0deg);
  visibility: visible;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .main-menu nav ul li {
    padding: 0 7px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .main-menu nav ul li {
    padding: 0 10px;
  }
}
.main-menu nav ul li > a {
  font-size: 15px;
  color: #555252;
  font-weight: 500;
  letter-spacing: 0.8px;
  display: inline-block;
  line-height: 94px;
}
.main-menu nav ul li > a i {
  font-size: 15px;
  margin-left: 1px;
  position: relative;
  top: 0px;
}
.main-menu nav ul li:hover a {
  color: #000000;
}
.main-menu.menu-white nav ul {
  text-align: left;
}
.main-menu.menu-white nav ul li {
  padding: 0 30px 0 0;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .main-menu.menu-white nav ul li {
    padding: 0 22px 0 0;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .main-menu.menu-white nav ul li {
    padding: 0 14px 0 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .main-menu.menu-white nav ul li {
    padding: 0 14px 0 0;
  }
}
.main-menu.menu-white nav ul li > a {
  color: #ffffff;
  line-height: 112px;
}

.stick .main-menu.menu-white nav ul li a {
  color: #555252;
}
.stick .main-menu.menu-white nav ul li a:hover {
  color: #000000;
}

.stick .main-menu nav ul li a {
  line-height: 75px;
}

.stick .logo,
.stick .header-right-wrap {
  margin-top: 22px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .stick .logo,
.stick .header-right-wrap {
    margin-top: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .stick .logo,
.stick .header-right-wrap {
    margin-top: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .stick .logo,
.stick .header-right-wrap {
    margin-top: 0px;
  }
}

.stick .header-right-wrap .same-style.cart-wrap .shopping-cart-content,
.stick .header-right-wrap .same-style .account-dropdown {
  top: 160%;
}
@media only screen and (max-width: 767px) {
  .stick .header-right-wrap .same-style.cart-wrap .shopping-cart-content,
.stick .header-right-wrap .same-style .account-dropdown {
    top: 100%;
    margin-top: 14px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .stick .header-right-wrap .same-style.cart-wrap .shopping-cart-content,
.stick .header-right-wrap .same-style .account-dropdown {
    top: 100%;
    margin-top: 14px;
  }
}

.header-right-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-top: 32px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-right-wrap {
    margin-top: 0px;
    margin-right: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .header-right-wrap {
    margin-top: 2px;
    margin-right: 50px;
  }
}
.header-right-wrap .same-style {
  margin-left: 14px;
  position: relative;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-right-wrap .same-style {
    margin-left: 10px;
  }
}
@media only screen and (max-width: 767px) {
  .header-right-wrap .same-style {
    margin-left: 5px;
  }
}
.header-right-wrap .same-style > a {
  color: #000;
  font-size: 23px;
}
.header-right-wrap .same-style:first-child {
  margin-left: 0px;
}
.header-right-wrap .same-style:hover > a {
  color: #000000;
}
.header-right-wrap .same-style .account-dropdown {
  background: #fff none repeat scroll 0 0;
  -webkit-box-shadow: 0 1px 7px -2px rgba(0, 0, 0, 0.3);
          box-shadow: 0 1px 7px -2px rgba(0, 0, 0, 0.3);
  left: 0;
  padding: 8px 12px 10px;
  position: absolute;
  text-align: left;
  top: 190%;
  width: 125px;
  z-index: 220;
  display: none;
}
@media only screen and (max-width: 767px) {
  .header-right-wrap .same-style .account-dropdown {
    top: 100%;
    margin-top: 14px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-right-wrap .same-style .account-dropdown {
    top: 100%;
    margin-top: 14px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-right-wrap .same-style .account-dropdown {
    left: -40px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .header-right-wrap .same-style .account-dropdown {
    left: -34px;
  }
}
.header-right-wrap .same-style .account-dropdown ul li a {
  display: block;
  font-size: 13px;
  line-height: 30px;
  padding: 0;
  text-transform: capitalize;
  color: #000;
}
.header-right-wrap .same-style .account-dropdown ul li a:hover {
  padding-left: 5px;
  color: #000000;
}
.header-right-wrap .same-style.account-satting > a {
  font-size: 24px;
}
.header-right-wrap.header-cart-actions {
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px 12px;
}
.header-right-wrap.header-cart-actions .same-style {
  margin-left: 0;
}
.header-right-wrap.header-cart-actions .header-action-link > a {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  color: #000;
  font-size: 13px !important;
  font-weight: 700;
  line-height: 1.15;
  text-decoration: none;
  white-space: nowrap;
}
.header-right-wrap.header-cart-actions .header-action-link label {
  margin: 0;
  cursor: pointer;
}
.header-right-wrap.header-cart-actions .header-action-link:hover > a {
  color: #000000;
}
@media only screen and (max-width: 767px) {
  .header-right-wrap.header-cart-actions {
    gap: 5px 7px;
    margin-right: 0;
  }
  .header-right-wrap.header-cart-actions .header-action-link > a {
    font-size: 11px !important;
  }
}
.header-right-wrap .same-style.cart-wrap {
  margin-left: 12px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-right-wrap .same-style.cart-wrap {
    margin-left: 8px;
  }
}
@media only screen and (max-width: 767px) {
  .header-right-wrap .same-style.cart-wrap {
    margin-left: 3px;
  }
}
.header-right-wrap .same-style.cart-wrap button {
  background: transparent;
  border: none;
  padding: 0;
  color: #000;
  font-size: 24px;
  position: relative;
}
.header-right-wrap .same-style.cart-wrap button span.count-style {
  position: absolute;
  top: -9px;
  right: -14px;
  background-color: #000;
  color: #fff;
  display: inline-block;
  width: 21px;
  height: 21px;
  border-radius: 100%;
  line-height: 21px;
  font-size: 12px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .header-right-wrap .same-style.cart-wrap button span.count-style {
    right: -5px;
  }
}
.header-right-wrap .same-style.cart-wrap:hover > button {
  color: #000000;
}
.header-right-wrap .same-style.cart-wrap .shopping-cart-content {
  background: #fff none repeat scroll 0 0;
  border: 1px solid #ebebeb;
  border-radius: 5px;
  opacity: 0;
  visibility: hidden;
  padding: 31px 35px 10px;
  position: absolute;
  right: 0;
  top: 190%;
  width: 340px;
  z-index: 9999;
  -webkit-transform: rotateX(90deg);
          transform: rotateX(90deg);
  -webkit-transform-origin: center top 0;
      -ms-transform-origin: center top 0;
          transform-origin: center top 0;
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
}
.header-right-wrap .same-style.cart-wrap .shopping-cart-content.cart-visible {
  opacity: 1;
  visibility: visible;
  -webkit-transform: rotateX(0deg);
          transform: rotateX(0deg);
}
@media only screen and (max-width: 767px) {
  .header-right-wrap .same-style.cart-wrap .shopping-cart-content {
    width: 295px;
    right: -52px;
    padding: 31px 15px 10px;
    overflow-y: auto;
    height: 300px;
    top: 100%;
    margin-top: 14px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-right-wrap .same-style.cart-wrap .shopping-cart-content {
    overflow-y: auto;
    height: 300px;
    margin-top: 18px;
    top: 100%;
    margin-top: 14px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-right-wrap .same-style.cart-wrap .shopping-cart-content {
    overflow-y: auto;
    height: 400px;
  }
}
.header-right-wrap .same-style.cart-wrap .shopping-cart-content ul li {
  border-bottom: 1px solid #ebebeb;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-bottom: 20px;
  padding-bottom: 15px;
}
.header-right-wrap .same-style.cart-wrap .shopping-cart-content ul li .shopping-cart-img {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 82px;
          flex: 0 0 82px;
  margin-right: 15px;
}
.header-right-wrap .same-style.cart-wrap .shopping-cart-content ul li .shopping-cart-title h4 {
  font-size: 15px;
  line-height: 16px;
  margin: 0;
}
.header-right-wrap .same-style.cart-wrap .shopping-cart-content ul li .shopping-cart-title h4 a {
  color: #000;
}
.header-right-wrap .same-style.cart-wrap .shopping-cart-content ul li .shopping-cart-title h4 a:hover {
  color: #000000;
}
.header-right-wrap .same-style.cart-wrap .shopping-cart-content ul li .shopping-cart-title h6 {
  font-size: 13px;
  margin: 5px 0 8px;
}
.header-right-wrap .same-style.cart-wrap .shopping-cart-content ul li .shopping-cart-title span {
  font-size: 14px;
}
.header-right-wrap .same-style.cart-wrap .shopping-cart-content ul li .shopping-cart-delete {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 100;
      -ms-flex-positive: 100;
          flex-grow: 100;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.header-right-wrap .same-style.cart-wrap .shopping-cart-content ul li .shopping-cart-delete a {
  font-size: 16px;
  color: #000000;
}
.header-right-wrap .same-style.cart-wrap .shopping-cart-content ul li .shopping-cart-delete a:hover {
  color: #333;
}
.header-right-wrap .same-style.cart-wrap .shopping-cart-content .shopping-cart-total h4 {
  font-size: 14px;
  margin-bottom: 17px;
}
.header-right-wrap .same-style.cart-wrap .shopping-cart-content .shopping-cart-total h4 span {
  float: right;
}
.header-right-wrap .same-style.cart-wrap .shopping-cart-content .shopping-cart-btn {
  margin-top: 23px;
}
.header-right-wrap .same-style.cart-wrap .shopping-cart-content .shopping-cart-btn a {
  margin-bottom: 20px;
  padding: 16px 40px 17px;
  font-weight: 500;
  font-size: 14px;
  display: block;
}
.header-right-wrap.header-right-wrap-white {
  margin-top: 40px;
}
.header-right-wrap.header-right-wrap-white .same-style > a {
  color: #fff;
}
.header-right-wrap.header-right-wrap-white .same-style.cart-wrap > button {
  color: #fff;
}
.header-right-wrap.header-right-wrap-white .same-style.cart-wrap > button span.count-style {
  background-color: #fff;
  color: #000;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-right-wrap.header-right-wrap-white {
    margin-top: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .header-right-wrap.header-right-wrap-white {
    margin-top: 3px;
  }
}
.header-right-wrap .same-style.header-search .search-content {
  background: #ffffff none repeat scroll 0 0;
  -webkit-box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.1);
          box-shadow: 0 1px 1px 1px rgba(0, 0, 0, 0.1);
  min-width: 300px;
  padding: 15px;
  position: absolute;
  right: 0;
  top: 193%;
  z-index: 99;
  display: none;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-right-wrap .same-style.header-search .search-content {
    top: 154%;
  }
}
@media only screen and (max-width: 767px) {
  .header-right-wrap .same-style.header-search .search-content {
    right: -105px;
    top: 154%;
    min-width: 260px;
  }
}
.header-right-wrap .same-style.header-search .search-content form {
  position: relative;
}
.header-right-wrap .same-style.header-search .search-content form input {
  border: 1px solid #d3d3d3;
  outline: medium none;
  padding: 5px 72px 5px 15px;
  -webkit-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
  width: 100%;
  color: #000;
  background: transparent;
}
.header-right-wrap .same-style.header-search .search-content form .button-search {
  background: #000000;
  border-color: #ce9634;
  color: #ffffff;
  position: absolute;
  right: 0;
  text-transform: uppercase;
  top: 0;
  border: none;
  height: 100%;
  padding: 5px 20px 2px;
  font-size: 20px;
  line-height: 1;
  -webkit-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
}
.header-right-wrap .same-style.header-search .search-content form .button-search:hover {
  background-color: #000;
}

.stick .same-style.header-search .search-content {
  top: 160%;
}

.stick .header-right-wrap.header-right-wrap-white {
  margin-top: 22px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .stick .header-right-wrap.header-right-wrap-white {
    margin-top: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .stick .header-right-wrap.header-right-wrap-white {
    margin-top: 0px;
  }
}
.stick .header-right-wrap.header-right-wrap-white .same-style > a {
  color: #000;
}
.stick .header-right-wrap.header-right-wrap-white .same-style > a:hover {
  color: #000000;
}
.stick .header-right-wrap.header-right-wrap-white .same-style.cart-wrap > button {
  color: #000;
}
.stick .header-right-wrap.header-right-wrap-white .same-style.cart-wrap > button:hover {
  color: #000000;
}
.stick .header-right-wrap.header-right-wrap-white .same-style.cart-wrap > button span.count-style {
  background-color: #000;
  color: #fff;
}

/* header 3 */
.header-padding-2 .container-fluid {
  padding: 0 70px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .header-padding-2 .container-fluid {
    padding: 0 15px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-padding-2 .container-fluid {
    padding: 0 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-padding-2 .container-fluid {
    padding: 0 40px;
  }
}
@media only screen and (max-width: 767px) {
  .header-padding-2 .container-fluid {
    padding: 0 15px;
  }
}

.header-top-area {
  border-bottom: 1px solid #d5d4d4;
}
.header-top-area .header-top-wap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media only screen and (max-width: 767px) {
  .header-top-area .header-top-wap {
    display: block;
    padding-bottom: 15px;
    margin-top: 8px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .header-top-area .header-top-wap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 0px;
    margin-top: 0px;
  }
}
.header-top-area.border-none {
  border: none;
}

.header-offer p {
  color: #555252;
  letter-spacing: 0.8px;
  margin: 0;
}
.header-offer p span {
  color: #ff1c1c;
}
@media only screen and (max-width: 767px) {
  .header-offer p {
    text-align: center;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .header-offer p {
    text-align: right;
  }
}
.header-offer.header-offer-white p {
  color: #fff;
}
.header-offer.header-offer-white p span {
  color: #000000;
}

.language-currency-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media only screen and (max-width: 767px) {
  .language-currency-wrap {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
.language-currency-wrap .same-language-currency {
  position: relative;
  margin-right: 54px;
}
@media only screen and (max-width: 767px) {
  .language-currency-wrap .same-language-currency {
    margin-right: 15px;
  }
}
.language-currency-wrap .same-language-currency:before {
  position: absolute;
  content: "";
  height: 15px;
  width: 1px;
  background-color: #d5d4d4;
  right: -27px;
  top: 47%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media only screen and (max-width: 767px) {
  .language-currency-wrap .same-language-currency:before {
    right: -10px;
  }
}
.language-currency-wrap .same-language-currency:last-child:before {
  display: none;
}
.language-currency-wrap .same-language-currency:last-child {
  margin-right: 0;
}
.language-currency-wrap .same-language-currency a {
  letter-spacing: 0.8px;
  color: #555252;
  line-height: 54px;
  display: inline-block;
  margin-top: -3px;
}
@media only screen and (max-width: 767px) {
  .language-currency-wrap .same-language-currency a {
    line-height: 35px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .language-currency-wrap .same-language-currency a {
    line-height: 54px;
  }
}
.language-currency-wrap .same-language-currency a i {
  font-size: 16px;
  color: #555252;
  position: relative;
  top: 2px;
}
.language-currency-wrap .same-language-currency .lang-car-dropdown {
  background: #fff none repeat scroll 0 0;
  -webkit-box-shadow: 0 1px 7px -2px rgba(0, 0, 0, 0.3);
          box-shadow: 0 1px 7px -2px rgba(0, 0, 0, 0.3);
  left: 0;
  padding: 8px 12px 10px;
  position: absolute;
  text-align: left;
  top: 100%;
  width: 125px;
  z-index: 220;
  display: none;
}
.language-currency-wrap .same-language-currency .lang-car-dropdown ul li a {
  line-height: 27px;
  font-size: 13px;
}
.language-currency-wrap .same-language-currency .lang-car-dropdown ul li a:hover {
  color: #000000;
}
.language-currency-wrap .same-language-currency p {
  letter-spacing: 0.8px;
  color: #555252;
  line-height: 1;
  margin-top: -1px;
}
.language-currency-wrap .same-language-currency:hover > a {
  color: #000000;
}
.language-currency-wrap .same-language-currency.same-lc-white a {
  color: #fff;
}
.language-currency-wrap .same-language-currency.same-lc-white a i {
  color: #fff;
}
.language-currency-wrap .same-language-currency.same-lc-white .lang-car-dropdown ul li a {
  color: #555252;
}
.language-currency-wrap .same-language-currency.same-lc-white .lang-car-dropdown ul li a:hover {
  color: #000000;
}
.language-currency-wrap .same-language-currency.same-lc-white p {
  color: #fff;
}

/* home 4 */
.home-sidebar-left {
  height: 100%;
  position: fixed;
  top: 0;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  width: 375px;
  z-index: 7;
  padding: 72px 0 40px 0px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .home-sidebar-left {
    width: 300px;
    padding: 50px 0 30px 0px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .home-sidebar-left {
    width: 300px;
    padding: 50px 0 30px 0px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .home-sidebar-left {
    width: 280px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .home-sidebar-left {
    width: 250px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .home-sidebar-left {
    display: none;
  }
}
@media only screen and (max-width: 767px) {
  .home-sidebar-left {
    display: none;
  }
}
.home-sidebar-left .logo {
  margin-top: 0;
  padding: 0px 0 0px 108px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .home-sidebar-left .logo {
    padding: 0px 0 0px 50px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .home-sidebar-left .logo {
    padding: 0px 0 0px 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .home-sidebar-left .logo {
    padding: 0px 0 0px 15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .home-sidebar-left .logo {
    padding: 0px 0 0px 30px;
  }
}
.home-sidebar-left .header-right-wrap {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  margin-top: 46px;
  margin-bottom: 67px;
  padding: 0px 0 0px 108px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .home-sidebar-left .header-right-wrap {
    padding: 0px 0 0px 50px;
    margin-top: 26px;
    margin-bottom: 27px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .home-sidebar-left .header-right-wrap {
    padding: 0px 0 0px 30px;
    margin-top: 26px;
    margin-bottom: 27px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .home-sidebar-left .header-right-wrap {
    padding: 0px 0 0px 15px;
    margin-top: 30px;
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .home-sidebar-left .header-right-wrap {
    padding: 0px 0 0px 30px;
    margin-top: 30px;
    margin-bottom: 30px;
  }
}
.home-sidebar-left .header-right-wrap .same-style.cart-wrap .shopping-cart-content {
  right: auto;
  left: 0;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .home-sidebar-left .header-right-wrap .same-style.cart-wrap .shopping-cart-content {
    overflow-y: auto;
    height: 400px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .home-sidebar-left .header-right-wrap .same-style.cart-wrap .shopping-cart-content {
    overflow-y: auto;
    height: 300px;
  }
}
.home-sidebar-left .header-right-wrap .same-style.header-search .search-content {
  left: 0;
  right: auto;
}
.home-sidebar-left .sidebar-copyright {
  padding: 120px 63px 50px 63px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .home-sidebar-left .sidebar-copyright {
    padding: 40px 63px 50px 63px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .home-sidebar-left .sidebar-copyright {
    padding: 40px 63px 50px 63px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .home-sidebar-left .sidebar-copyright {
    padding: 40px 15px 50px 15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .home-sidebar-left .sidebar-copyright {
    padding: 50px 15px 50px 30px;
  }
}
.home-sidebar-left .sidebar-copyright p {
  letter-spacing: 0.9px;
  color: #313131;
  margin: 0;
  text-align: center;
}

.home-sidebar-right {
  border-left: 1px solid #efefef;
  margin-left: 375px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .home-sidebar-right {
    margin-left: 300px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .home-sidebar-right {
    margin-left: 280px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .home-sidebar-right {
    margin-left: 250px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .home-sidebar-right {
    margin-left: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .home-sidebar-right {
    margin-left: 0px;
  }
}

.sidebar-menu {
  padding: 0px 0 0px 108px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .sidebar-menu {
    padding: 0px 0 0px 50px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .sidebar-menu {
    padding: 0px 0 0px 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sidebar-menu {
    padding: 0px 0 0px 15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sidebar-menu {
    padding: 0px 0 0px 30px;
  }
}
.sidebar-menu nav ul li {
  padding-bottom: 33px;
  position: relative;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .sidebar-menu nav ul li {
    padding-bottom: 20px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .sidebar-menu nav ul li {
    padding-bottom: 15px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sidebar-menu nav ul li {
    padding-bottom: 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sidebar-menu nav ul li {
    padding-bottom: 12px;
  }
}
.sidebar-menu nav ul li:last-child {
  padding-bottom: 0;
}
.sidebar-menu nav ul li ul.submenu {
  background: #fff none repeat scroll 0 0;
  -webkit-box-shadow: 0 0 7px 0.5px rgba(0, 0, 0, 0.15);
          box-shadow: 0 0 7px 0.5px rgba(0, 0, 0, 0.15);
  display: block;
  left: 100%;
  padding: 20px 0px 22px;
  position: absolute;
  top: 0;
  -webkit-transform: rotateX(90deg);
          transform: rotateX(90deg);
  -webkit-transform-origin: center top 0;
      -ms-transform-origin: center top 0;
          transform-origin: center top 0;
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  visibility: hidden;
  width: 190px;
  z-index: 999;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sidebar-menu nav ul li ul.submenu {
    overflow-y: auto;
    max-height: 250px;
  }
}
.sidebar-menu nav ul li ul.submenu li {
  display: block;
  padding: 0 20px;
  margin-left: 0px;
}
.sidebar-menu nav ul li ul.submenu li a {
  color: #333;
  display: block;
  font-size: 13px;
  font-weight: 400;
  line-height: 32px;
  text-align: left;
  text-transform: capitalize;
  padding-top: 0px;
}
.sidebar-menu nav ul li ul.submenu li a:hover {
  color: #000000;
}
.sidebar-menu nav ul li ul.submenu li a::before {
  background: #000000 none repeat scroll 0 0;
  border-radius: 50%;
  content: "";
  height: 7px;
  left: 15px;
  opacity: 0;
  position: absolute;
  top: 13px;
  -webkit-transition: all 0.3s ease-in-out 0s;
  -o-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
  width: 7px;
  z-index: 999;
}
.sidebar-menu nav ul li ul.submenu li:hover a::before {
  opacity: 1;
}
.sidebar-menu nav ul li ul.submenu li:hover a {
  padding-left: 12px;
}
.sidebar-menu nav ul li:hover > ul.submenu {
  -webkit-transform: rotateX(0deg);
          transform: rotateX(0deg);
  visibility: visible;
}
.sidebar-menu nav ul li ul.mega-menu {
  background-color: #fff;
  display: block;
  left: 100%;
  padding: 40px 40px 0px 40px;
  position: absolute;
  text-align: left;
  top: 0;
  -webkit-transform: rotateX(90deg);
          transform: rotateX(90deg);
  -webkit-transform-origin: center top 0;
      -ms-transform-origin: center top 0;
          transform-origin: center top 0;
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  visibility: hidden;
  width: 750px;
  z-index: 999;
  -webkit-box-shadow: 0 1px 7px -2px rgba(0, 0, 0, 0.3);
          box-shadow: 0 1px 7px -2px rgba(0, 0, 0, 0.3);
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .sidebar-menu nav ul li ul.mega-menu {
    top: -50px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .sidebar-menu nav ul li ul.mega-menu {
    top: -50px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sidebar-menu nav ul li ul.mega-menu {
    top: -80px;
    width: 720px;
  }
}
.sidebar-menu nav ul li ul.mega-menu > li {
  display: inline-block;
  float: left;
  margin-left: 0;
  padding: 0;
  width: 33.33%;
}
.sidebar-menu nav ul li ul.mega-menu > li ul li.mega-menu-title {
  float: inherit;
  width: 100%;
}
.sidebar-menu nav ul li ul.mega-menu > li ul li.mega-menu-title a {
  color: #242424;
  margin: 0 0 10px;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 500;
}
.sidebar-menu nav ul li ul.mega-menu > li ul li.mega-menu-title a::before {
  display: none;
}
.sidebar-menu nav ul li ul.mega-menu > li ul li.mega-menu-title:hover a {
  padding-left: 0px;
}
.sidebar-menu nav ul li ul.mega-menu > li ul li {
  display: block;
  float: inherit;
  padding: 0px;
}
.sidebar-menu nav ul li ul.mega-menu > li ul li a {
  color: #333;
  display: block;
  font-size: 13px;
  font-weight: 400;
  line-height: 32px;
  text-align: left;
  text-transform: capitalize;
  padding-top: 0px;
}
.sidebar-menu nav ul li ul.mega-menu > li ul li a:hover {
  color: #000000;
}
.sidebar-menu nav ul li ul.mega-menu > li ul li a::before {
  background: #000000 none repeat scroll 0 0;
  border-radius: 50%;
  content: "";
  height: 7px;
  left: 0px;
  opacity: 0;
  position: absolute;
  top: 13px;
  -webkit-transition: all 0.3s ease-in-out 0s;
  -o-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
  width: 7px;
  z-index: 999;
}
.sidebar-menu nav ul li ul.mega-menu > li ul li.mega-menu-img:hover a {
  padding-left: 0px;
}
.sidebar-menu nav ul li ul.mega-menu > li ul li.mega-menu-img a::before {
  display: none;
}
.sidebar-menu nav ul li ul.mega-menu > li ul li:hover a::before {
  opacity: 1;
}
.sidebar-menu nav ul li ul.mega-menu > li ul li:hover a {
  padding-left: 12px;
}
.sidebar-menu nav ul li ul.mega-menu.mega-menu-padding {
  padding: 40px 40px 36px 40px;
}
.sidebar-menu nav ul li:hover > ul.mega-menu {
  -webkit-transform: rotateX(0deg);
          transform: rotateX(0deg);
  visibility: visible;
}
.sidebar-menu nav ul li a {
  color: #000000;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.8px;
  text-transform: capitalize;
  display: block;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .sidebar-menu nav ul li a {
    font-size: 16px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sidebar-menu nav ul li a {
    font-size: 16px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sidebar-menu nav ul li a {
    font-size: 16px;
  }
}
.sidebar-menu nav ul li a span {
  float: right;
  padding-right: 20px;
}
.sidebar-menu nav ul li:hover a {
  color: #000000;
}

.header-hm4-none {
  display: none;
}
@media only screen and (max-width: 767px) {
  .header-hm4-none {
    display: block;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-hm4-none {
    display: block;
  }
}

/* home 5 */
.wrapper {
  margin: 20px 20px;
}
@media only screen and (max-width: 767px) {
  .wrapper {
    margin: 0px 0px;
  }
}

.transparent-bar {
  left: 0;
  right: 0;
  top: 0;

  width: 100%;
  z-index: 999;
}

.header-padding-3 .container-fluid {
  padding: 0 80px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .header-padding-3 .container-fluid {
    padding: 0 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .header-padding-3 .container-fluid {
    padding: 0 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-padding-3 .container-fluid {
    padding: 0 40px;
  }
}
@media only screen and (max-width: 767px) {
  .header-padding-3 .container-fluid {
    padding: 0 15px;
  }
}

/* home 7 */
.clickable-menu {
  margin-top: 35px;
}
.clickable-menu a {
  color: #fff;
  font-size: 30px;
  line-height: 1;
  display: inline-block;
}
.clickable-menu a:hover {
  color: #000000;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .clickable-menu {
    margin-top: -3px;
  }
}
@media only screen and (max-width: 767px) {
  .clickable-menu {
    margin-top: -3px;
  }
}

.clickable-mainmenu {
  background: white none repeat scroll 0 0;
  color: #353535;
  height: 100vh;
  overflow-y: auto;
  padding: 130px 35px 40px;
  position: fixed;
  left: 0;
  top: 0;
  -webkit-transform: translateX(-110%);
      -ms-transform: translateX(-110%);
          transform: translateX(-110%);
  -webkit-transition: -webkit-transform 0.5s ease-in-out 0s;
  transition: -webkit-transform 0.5s ease-in-out 0s;
  -o-transition: transform 0.5s ease-in-out 0s;
  transition: transform 0.5s ease-in-out 0s;
  transition: transform 0.5s ease-in-out 0s, -webkit-transform 0.5s ease-in-out 0s;
  width: 300px;
  z-index: 9999;
}
.clickable-mainmenu.inside {
  -webkit-transform: translateX(0px);
      -ms-transform: translateX(0px);
          transform: translateX(0px);
  z-index: 9999;
}
@media only screen and (max-width: 767px) {
  .clickable-mainmenu {
    padding: 100px 35px 40px;
  }
}
.clickable-mainmenu .clickable-mainmenu-icon button {
  background: transparent none repeat scroll 0 0;
  border: medium none;
  color: #000;
  cursor: pointer;
  font-size: 50px;
  padding: 0;
  position: absolute;
  left: 20px;
  top: 20px;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.clickable-mainmenu .clickable-mainmenu-icon button:hover {
  color: #000000;
}
.clickable-mainmenu .side-logo {
  margin-bottom: 50px;
}
@media only screen and (max-width: 767px) {
  .clickable-mainmenu .side-logo {
    margin-bottom: 40px;
  }
}
.clickable-mainmenu .clickable-menu-style {
  background: transparent;
}
.clickable-mainmenu .clickable-menu-style ul li a {
  color: #000;
  font-size: 16px;
  text-transform: capitalize;
  padding: 0 0 20px;
}
.clickable-mainmenu .clickable-menu-style ul li a:hover {
  background: transparent;
  color: #000000;
}
.clickable-mainmenu .side-social {
  margin-top: 50px;
}
.clickable-mainmenu .side-social ul li {
  display: inline-block;
  margin: 0 30px 0 0;
  position: relative;
}
.clickable-mainmenu .side-social ul li:last-child {
  margin-right: 0;
}
.clickable-mainmenu .side-social ul li:before {
  position: absolute;
  right: -20px;
  top: 50%;
  background: #999;
  height: 1px;
  width: 10px;
  content: "";
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}
.clickable-mainmenu .side-social ul li:last-child:before {
  display: none;
}
.clickable-mainmenu .side-social ul li a {
  font-size: 18px;
}
.clickable-mainmenu .side-social ul li a.facebook {
  color: #3b5999;
}
.clickable-mainmenu .side-social ul li a.facebook:hover {
  color: #333;
}
.clickable-mainmenu .side-social ul li a.dribbble {
  color: #ea4c89;
}
.clickable-mainmenu .side-social ul li a.dribbble:hover {
  color: #333;
}
.clickable-mainmenu .side-social ul li a.pinterest {
  color: #bd081c;
}
.clickable-mainmenu .side-social ul li a.pinterest:hover {
  color: #333;
}
.clickable-mainmenu .side-social ul li a.twitter {
  color: #55acee;
}
.clickable-mainmenu .side-social ul li a.twitter:hover {
  color: #333;
}
.clickable-mainmenu .side-social ul li a.linkedin {
  color: #0077B5;
}
.clickable-mainmenu .side-social ul li a.linkedin:hover {
  color: #333;
}

.header-hm-7.stick .clickable-menu {
  margin-top: 19px;
}
.header-hm-7.stick .clickable-menu a {
  color: #282828;
}
.header-hm-7.stick .clickable-menu a:hover {
  color: #000000;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-hm-7.stick .clickable-menu {
    margin-top: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .header-hm-7.stick .clickable-menu {
    margin-top: 0px;
  }
}
.header-hm-7.stick .logo {
  margin-top: 22px;
  margin-bottom: 18px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-hm-7.stick .logo {
    margin-top: 2px;
    margin-bottom: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .header-hm-7.stick .logo {
    margin-top: 2px;
    margin-bottom: 0px;
  }
}
.header-hm-7.stick .header-right-wrap {
  margin-top: 22px;
  margin-bottom: 18px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-hm-7.stick .header-right-wrap {
    margin-top: 2px;
    margin-bottom: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .header-hm-7.stick .header-right-wrap {
    margin-top: 2px;
    margin-bottom: 0px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-hm-7 .header-right-wrap {
    margin-right: 0;
  }
}
@media only screen and (max-width: 767px) {
  .header-hm-7 .header-right-wrap {
    margin-right: 0;
  }
}
@media only screen and (max-width: 767px) {
  .header-hm-7 .header-right-wrap .same-style.cart-wrap .shopping-cart-content {
    right: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .header-hm-7 .header-right-wrap .same-style.header-search .search-content {
    right: -80px;
  }
}

/* home 8 */
.header-hm8 .header-right-wrap {
  margin-top: 6px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-hm8 .header-right-wrap {
    margin-right: 0;
  }
}
@media only screen and (max-width: 767px) {
  .header-hm8 .header-right-wrap {
    margin-right: 0;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
.header-hm8 .header-right-wrap .same-style.cart-wrap .shopping-cart-content {
  top: 125%;
  margin-top: 0;
}
@media only screen and (max-width: 767px) {
  .header-hm8 .header-right-wrap .same-style.cart-wrap .shopping-cart-content {
    right: -99px;
  }
}
.header-hm8 .header-right-wrap .same-style .account-dropdown {
  top: 125%;
  margin-top: 0;
  left: -32px;
}
.header-hm8 .header-right-wrap .same-style.header-search .search-content {
  top: 125%;
}
@media only screen and (max-width: 767px) {
  .header-hm8 .header-right-wrap .same-style.header-search .search-content {
    right: -150px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .header-hm8 .header-right-wrap .same-style.header-search .search-content {
    right: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-hm8 .header-res-padding {
    padding: 20px 0 20px;
  }
  .header-hm8 .mean-container a.meanmenu-reveal {
    top: -26px;
  }
}
@media only screen and (max-width: 767px) {
  .header-hm8 .header-res-padding {
    padding: 20px 0 20px;
  }
  .header-hm8 .mean-container a.meanmenu-reveal {
    top: -26px;
  }
}

.header-hm8 .stick .logo {
  display: none;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-hm8 .stick .logo {
    display: block;
  }
}
@media only screen and (max-width: 767px) {
  .header-hm8 .stick .logo {
    display: block;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-hm8 .logo {
    text-align: left !important;
  }
}
@media only screen and (max-width: 767px) {
  .header-hm8 .logo {
    text-align: left !important;
  }
}

.header-hm8 .main-menu {
  padding-bottom: 8px;
}
.header-hm8 .main-menu nav ul li > a {
  line-height: 60px;
}

/* home 9 */
.header-hm9 .main-menu nav ul li a {
  line-height: 72px;
}
.header-hm9 .header-top-area {
  padding: 22px 0;
  border-bottom: 1px solid #cecece;
}
.header-hm9 .header-top-area.header-top-border17 {
  border-bottom: 1px solid #9f9f9f;
}
.header-hm9 .header-right-wrap {
  margin-top: 13px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-hm9 .header-right-wrap {
    margin-right: 0;
  }
}
@media only screen and (max-width: 767px) {
  .header-hm9 .header-right-wrap {
    margin-right: 0;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
@media only screen and (max-width: 767px) {
  .header-hm9 .header-right-wrap .same-style.cart-wrap .shopping-cart-content {
    right: -97px;
  }
}
.header-hm9 .logo-hm9 {
  margin-top: 12px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .header-hm9 .mean-container a.meanmenu-reveal {
    top: -26px;
  }
  .header-hm9 .header-res-padding {
    padding: 20px 0 20px;
  }
}
@media only screen and (max-width: 767px) {
  .header-hm9 .mean-container a.meanmenu-reveal {
    top: -26px;
  }
  .header-hm9 .header-res-padding {
    padding: 20px 0 20px;
  }
}

.mean-container a.meanmenu-reveal {
  color: #333;
  border: 1px solid #333;
  width: 18px;
  height: 18px;
  line-height: 18px;
  padding: 3px 5px 2px;
  overflow: hidden;
  -webkit-transition: all 0s ease 0s;
  -o-transition: all 0s ease 0s;
  transition: all 0s ease 0s;
}
.mean-container a.meanmenu-reveal span {
  background: #333;
  position: relative;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  display: block;
  height: 2px;
  margin-top: 7px;
}
.mean-container a.meanmenu-reveal span:before, .mean-container a.meanmenu-reveal span:after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  background: #333;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  z-index: 9;
}
.mean-container a.meanmenu-reveal span:before {
  top: -5px;
}
.mean-container a.meanmenu-reveal span:after {
  bottom: -5px;
}

.mean-container .mean-bar {
  padding: 0;
  min-height: 0;
  background: transparent;
  z-index: 99;
}
.mean-container .mean-nav {
  margin-top: 0px;
  background: transparent;
}
.mean-container .mean-nav ul li {
  border-top: 1px solid #ddd;
  background: #f8f8f8 none repeat scroll 0 0;
}
.mean-container .mean-nav ul li a {
  padding: 10px 5%;
  color: #333;
  border: none;
  font-size: 13px;
  font-weight: 500;
}
.mean-container .mean-nav ul li ul li a {
  text-transform: capitalize;
  background: #f8f8f8 none repeat scroll 0 0;
}
.mean-container .mean-nav ul li:hover > a {
  color: #000000;
}
.mean-container .mean-nav ul li:hover > a.mean-expand {
  background-color: transparent;
}

.white-mobile-menu .mean-container a.meanmenu-reveal span:before, .white-mobile-menu .mean-container a.meanmenu-reveal span:after {
  background: #fff;
}

.stick .white-mobile-menu .mean-container a.meanmenu-reveal span:before, .stick .white-mobile-menu .mean-container a.meanmenu-reveal span:after {
  background: #333;
}

/* header hm10 */
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .header-in-container .header-top-wap {
    display: block;
    margin-bottom: 15px;
    margin-top: 8px;
  }
  .header-in-container .header-top-wap .language-currency-wrap {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .header-in-container .header-top-wap .header-offer p {
    text-align: center;
  }
}
@media only screen and (max-width: 767px) {
  .header-hm9 .header-right-wrap .same-style.header-search .search-content {
    right: -142px;
  }
}
/*----- 3. Slider style  ------*/
.slider-height-1 {
  height: 750px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-height-1 {
    height: 650px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-height-1 {
    height: 520px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height-1 {
    height: 450px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-1 {
    height: auto;
    padding: 50px 0 0;
  }
  .slider-height-1.slider-height-res15 {
    padding: 0px 0 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-height-1 {
    padding: 38px 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-1.slider-height-res {
    height: 400px;
    position: relative;
  }
  .slider-height-1.slider-height-res:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: "";
    background-color: #fff;
    opacity: 0.5;
  }
}

.single-slider {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.single-slider .slider-content {
  padding: 183px 0 0;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .single-slider .slider-content {
    padding: 80px 0 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-slider .slider-content {
    padding: 45px 0 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-slider .slider-content {
    padding: 0px 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .single-slider .slider-content {
    padding: 0px 0 40px;
    text-align: center;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-slider .slider-content {
    padding: 0px 0 0px;
    text-align: left;
  }
}
.single-slider .slider-content h3 {
  font-size: 24px;
  font-weight: 500;
  margin: 0;
}
.single-slider .slider-content h1 {
  line-height: 97px;
  font-size: 72px;
  color: #010101;
  margin: 6px 0 37px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-slider .slider-content h1 {
    line-height: 65px;
    font-size: 52px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-slider .slider-content h1 {
    line-height: 52px;
    font-size: 40px;
    margin: 6px 0 20px;
  }
}
@media only screen and (max-width: 767px) {
  .single-slider .slider-content h1 {
    line-height: 48px;
    font-size: 33px;
    margin: 6px 0 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-slider .slider-content h1 {
    font-size: 30px;
    margin: 6px 0 10px;
  }
}
.single-slider .slider-content .slider-btn a {
  font-size: 16px;
  color: #010101;
  display: inline-block;
  border: 1px solid #333;
  text-transform: uppercase;
  line-height: 1;
  padding: 19px 50px 21px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-slider .slider-content .slider-btn a {
    padding: 15px 35px 17px;
  }
}
@media only screen and (max-width: 767px) {
  .single-slider .slider-content .slider-btn a {
    padding: 15px 35px 17px;
  }
}
.single-slider .slider-content .slider-btn a:hover {
  border: 1px solid #000000;
  color: #fff;
}
.single-slider .slider-content.slider-content-10 {
  padding-top: 0;
}
@media only screen and (max-width: 767px) {
  .single-slider .slider-content.slider-content-10 {
    text-align: center;
    display: block;
    width: 100%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-slider .slider-content.slider-content-10 {
    text-align: left;
  }
}
.single-slider .slider-single-img {
  margin: 0 -80px 0 -80px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .single-slider .slider-single-img {
    margin: 0 0px 0 0px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-slider .slider-single-img {
    margin: 0 0px 0 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-slider .slider-single-img {
    margin: 0 0px 0 0px;
  }
}
@media only screen and (max-width: 767px) {
  .single-slider .slider-single-img {
    margin: 0 0px 0 0px;
  }
}
.single-slider.single-slider-10 {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.owl-item .slider-content * {
  -webkit-animation-duration: 1.3s;
  animation-duration: 1.3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.owl-item.active .slider-animated-1 h3 {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.owl-item.active .slider-animated-1 h1 {
  -webkit-animation-delay: 1.3s;
  animation-delay: 1.3s;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.owl-item.active .slider-animated-1 h5 {
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.owl-item.active .slider-animated-1 p {
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.owl-item.active .slider-animated-1 a {
  -webkit-animation-delay: 1.6s;
  animation-delay: 1.6s;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.owl-item.active .slider-animated-1 .content-img img {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.owl-item.active .slider-animated-1.slider-single-img img {
  -webkit-animation-delay: 1.6s;
  animation-delay: 1.6s;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.owl-item.active .slider-animated-1.single-slider-img4 img {
  -webkit-animation-delay: 1.6s;
  animation-delay: 1.6s;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.owl-item.active .slider-animated-1.slider-singleimg-hm9 img {
  -webkit-animation-delay: 1.6s;
  animation-delay: 1.6s;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.owl-item.active .slider-animated-1.slider-singleimg-hm11 img {
  -webkit-animation-delay: 1.6s;
  animation-delay: 1.6s;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.owl-item.active .slider-animated-1.slider-singleimg-medical img {
  -webkit-animation-delay: 1.6s;
          animation-delay: 1.6s;
  -webkit-animation-name: fadeInUp;
          animation-name: fadeInUp;
}
.owl-item.active .slider-animated-2 h3 {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}
.owl-item.active .slider-animated-2 h1 {
  -webkit-animation-delay: 1.3s;
  animation-delay: 1.3s;
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}
.owl-item.active .slider-animated-2 a {
  -webkit-animation-delay: 1.6s;
  animation-delay: 1.6s;
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}
.owl-item.active .slider-animated-2.slider-singleimg-hm10 img {
  -webkit-animation-delay: 1.6s;
  animation-delay: 1.6s;
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

.nav-style-1.owl-carousel .owl-nav button {
  color: #999;
  display: inline-block;
  font-size: 40px;
  left: 80px;
  opacity: 0;
  visibility: hidden;
  position: absolute;
  text-align: center;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .nav-style-1.owl-carousel .owl-nav button {
    left: 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .nav-style-1.owl-carousel .owl-nav button {
    left: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .nav-style-1.owl-carousel .owl-nav button {
    left: 15px;
    font-size: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .nav-style-1.owl-carousel .owl-nav button {
    left: 15px;
    font-size: 30px;
  }
}
.nav-style-1.owl-carousel .owl-nav button:hover {
  color: #000000;
}
.nav-style-1.owl-carousel .owl-nav button.owl-next {
  left: auto;
  right: 80px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .nav-style-1.owl-carousel .owl-nav button.owl-next {
    right: 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .nav-style-1.owl-carousel .owl-nav button.owl-next {
    right: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .nav-style-1.owl-carousel .owl-nav button.owl-next {
    right: 15px;
  }
}
@media only screen and (max-width: 767px) {
  .nav-style-1.owl-carousel .owl-nav button.owl-next {
    right: 15px;
  }
}
.nav-style-1.owl-carousel.nav-testi-style .owl-nav button {
  font-size: 50px;
  left: -155px;
  color: #8d8c8c;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .nav-style-1.owl-carousel.nav-testi-style .owl-nav button {
    left: -80px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .nav-style-1.owl-carousel.nav-testi-style .owl-nav button {
    left: -80px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .nav-style-1.owl-carousel.nav-testi-style .owl-nav button {
    left: -30px;
  }
}
@media only screen and (max-width: 767px) {
  .nav-style-1.owl-carousel.nav-testi-style .owl-nav button {
    display: none;
  }
}
.nav-style-1.owl-carousel.nav-testi-style .owl-nav button:hover {
  color: #3d6882;
}
.nav-style-1.owl-carousel.nav-testi-style .owl-nav button.owl-next {
  right: -155px;
  left: auto;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .nav-style-1.owl-carousel.nav-testi-style .owl-nav button.owl-next {
    right: -80px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .nav-style-1.owl-carousel.nav-testi-style .owl-nav button.owl-next {
    right: -80px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .nav-style-1.owl-carousel.nav-testi-style .owl-nav button.owl-next {
    right: -30px;
  }
}
.nav-style-1.owl-carousel.nav-testi-style.nav-testi-mrg .owl-nav button {
  left: -80px;
  color: #fff;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .nav-style-1.owl-carousel.nav-testi-style.nav-testi-mrg .owl-nav button {
    left: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .nav-style-1.owl-carousel.nav-testi-style.nav-testi-mrg .owl-nav button {
    display: none;
  }
}
.nav-style-1.owl-carousel.nav-testi-style.nav-testi-mrg .owl-nav button.owl-next {
  right: -80px;
  left: auto;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .nav-style-1.owl-carousel.nav-testi-style.nav-testi-mrg .owl-nav button.owl-next {
    right: 0px;
    left: auto;
  }
}
@media only screen and (max-width: 767px) {
  .nav-style-1.owl-carousel.nav-testi-style.nav-testi-mrg .owl-nav button.owl-next {
    display: none;
  }
}

.slider-area:hover .nav-style-1.owl-carousel > .owl-nav button {
  opacity: 1;
  visibility: visible;
}
.slider-area.ml-10 {
  margin-left: 0;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-area.ml-70 {
    margin-left: 15px;
  }
  .slider-area.mr-70 {
    margin-right: 15px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-area.ml-70 {
    margin-left: 30px;
  }
  .slider-area.mr-70 {
    margin-right: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-area.ml-70 {
    margin-left: 40px;
  }
  .slider-area.mr-70 {
    margin-right: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-area.ml-70 {
    margin-left: 15px;
  }
  .slider-area.mr-70 {
    margin-right: 15px;
  }
}

/* slider style-2 */
.slider-content-2 {
  margin-top: -6px;
}
@media only screen and (max-width: 767px) {
  .slider-content-2 {
    text-align: center;
  }
}
.slider-content-2 h3 {
  color: #000000;
  font-size: 24px;
  font-weight: 500;
  position: relative;
  margin-left: 135px;
  margin-bottom: 0;
}
@media only screen and (max-width: 767px) {
  .slider-content-2 h3 {
    margin-left: 0px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-content-2 h3 {
    margin-left: 60px;
  }
}
.slider-content-2 h3::before {
  position: absolute;
  left: -135px;
  top: 14px;
  content: "";
  width: 120px;
  height: 2px;
  background-color: #000000;
}
@media only screen and (max-width: 767px) {
  .slider-content-2 h3::before {
    display: none;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-content-2 h3::before {
    display: block;
    left: 80px;
    width: 60px;
  }
}
.slider-content-2 h1 {
  font-size: 72px;
  line-height: 97px;
  color: #010101;
  margin: 6px 0 37px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-content-2 h1 {
    font-size: 60px;
    line-height: 80px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-2 h1 {
    font-size: 56px;
    line-height: 70px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-2 h1 {
    font-size: 45px;
    line-height: 60px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-2 h1 {
    font-size: 35px;
    line-height: 45px;
  }
}
.slider-content-2 .slider-btn a {
  font-size: 16px;
  color: #010101;
  display: inline-block;
  border: 1px solid #333;
  text-transform: uppercase;
  line-height: 1;
  padding: 19px 50px 21px;
  background-color: #eeeff1;
}
@media only screen and (max-width: 767px) {
  .slider-content-2 .slider-btn a {
    padding: 14px 30px 16px;
  }
}
.slider-content-2 .slider-btn a:hover {
  border: 1px solid #000000;
  color: #fff;
}
.slider-content-2.slider-content-fruits h3 {
  color: #6eab49;
}
.slider-content-2.slider-content-fruits h3::before {
  background-color: #6eab49;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-content-2.slider-content-fruits h3::before {
    left: 45px;
  }
}
.slider-content-2.slider-content-fruits h1 {
  font-size: 71px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-content-2.slider-content-fruits h1 {
    font-size: 55px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-2.slider-content-fruits h1 {
    font-size: 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-2.slider-content-fruits h1 {
    font-size: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-2.slider-content-fruits h1 {
    font-size: 30px;
    margin: 6px 0 20px;
  }
}
.slider-content-2.slider-content-fruits .slider-btn a {
  font-size: 16px;
  color: #fff;
  border: 1px solid #6eab49;
  background-color: #6eab49;
}
.slider-content-2.slider-content-fruits .slider-btn a:hover {
  border: 1px solid #000000;
  color: #fff;
}
.slider-content-2.slider-content-organic h3 {
  color: #ab87cd;
  letter-spacing: 0.8px;
}
.slider-content-2.slider-content-organic h3::before {
  background-color: #000000;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-content-2.slider-content-organic h3::before {
    left: 45px;
  }
}
.slider-content-2.slider-content-organic h1 {
  font-size: 72px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-content-2.slider-content-organic h1 {
    font-size: 55px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-2.slider-content-organic h1 {
    font-size: 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-2.slider-content-organic h1 {
    font-size: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-2.slider-content-organic h1 {
    font-size: 30px;
    margin: 6px 0 20px;
  }
}
.slider-content-2.slider-content-organic .slider-btn a {
  font-size: 16px;
  color: #fff;
  border: 1px solid #ab87cd;
  background-color: #ab87cd;
}
.slider-content-2.slider-content-organic .slider-btn a:hover {
  border: 1px solid #000000;
  color: #fff;
}
.slider-content-2.slider-content-flower h3 {
  color: #c61a32;
  letter-spacing: 0.8px;
}
.slider-content-2.slider-content-flower h3::before {
  background-color: #c61a32;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-content-2.slider-content-flower h3::before {
    left: 45px;
  }
}
.slider-content-2.slider-content-flower h1 {
  font-size: 66px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-content-2.slider-content-flower h1 {
    font-size: 55px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-2.slider-content-flower h1 {
    font-size: 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-2.slider-content-flower h1 {
    font-size: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-2.slider-content-flower h1 {
    font-size: 30px;
    margin: 6px 0 20px;
  }
}
.slider-content-2.slider-content-flower .slider-btn a {
  font-size: 16px;
  color: #fff;
  border: 1px solid #c61a32;
  background-color: #c61a32;
}
.slider-content-2.slider-content-flower .slider-btn a:hover {
  border: 1px solid #000000;
  color: #fff;
}

@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .single-slider-2 {
    background-position: 50%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-slider-2 {
    background-position: 42%;
  }
}
@media only screen and (max-width: 767px) {
  .single-slider-2 {
    background-position: 30%;
  }
  .single-slider-2.valentine-slider-bg {
    background-color: 75%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-slider-2 {
    background-position: 22%;
  }
}

/* home 3 */
.slider-height-2 {
  height: 800px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-height-2 {
    height: 570px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-height-2 {
    height: 500px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height-2 {
    height: 500px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-2 {
    height: 400px;
  }
}
.slider-height-2.slider-content-center {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.slider-content-3 h3 {
  font-size: 24px;
  font-weight: 500;
  margin: 0;
  position: relative;
  display: inline-block;
}
.slider-content-3 h3::before {
  position: absolute;
  left: -110px;
  top: 16px;
  content: "";
  width: 80px;
  height: 2px;
  background-color: #000000;
}
.slider-content-3 h3::after {
  position: absolute;
  right: -110px;
  top: 16px;
  content: "";
  width: 80px;
  height: 2px;
  background-color: #000000;
}
.slider-content-3 h1 {
  font-size: 72px;
  line-height: 56px;
  margin: 28px 0 23px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-3 h1 {
    font-size: 52px;
    line-height: 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-3 h1 {
    font-size: 52px;
    line-height: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-3 h1 {
    font-size: 35px;
    line-height: 30px;
    margin: 18px 0 13px;
  }
}
.slider-content-3 p {
  font-size: 18px;
  color: #010101;
  margin: 0 0 44px;
}
.slider-content-3 .slider-btn a {
  font-size: 16px;
  color: #010101;
  display: inline-block;
  border: 1px solid #333;
  text-transform: uppercase;
  line-height: 1;
  padding: 19px 50px 21px;
}
.slider-content-3 .slider-btn a:hover {
  border: 1px solid #000000;
  color: #fff;
}
.slider-content-3.slider-content-3-white h3 {
  color: #fff;
}
.slider-content-3.slider-content-3-white h3::before {
  background-color: #fff;
}
.slider-content-3.slider-content-3-white h3::after {
  background-color: #fff;
}
.slider-content-3.slider-content-3-white h1 {
  color: #fff;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .slider-content-3.slider-content-3-white h1 {
    font-size: 55px;
    line-height: 45px;
    margin: 20px 0 23px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-content-3.slider-content-3-white h1 {
    font-size: 55px;
    line-height: 45px;
    margin: 20px 0 23px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-3.slider-content-3-white h1 {
    font-size: 47px;
    margin: 20px 0 18px;
  }
}
.slider-content-3.slider-content-3-white p {
  color: #fff;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .slider-content-3.slider-content-3-white p {
    margin-bottom: 20px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-content-3.slider-content-3-white p {
    margin-bottom: 20px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-3.slider-content-3-white p {
    margin-bottom: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-3.slider-content-3-white p {
    margin-bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-3.slider-content-3-white p {
    margin-bottom: 20px;
  }
}
.slider-content-3.slider-content-3-white .slider-btn a {
  border: 1px solid transparent;
  background-color: #e6e6e6;
  padding: 17px 41px 16px;
  z-index: 9;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-content-3.slider-content-3-white .slider-btn a {
    padding: 12px 30px 11px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-3.slider-content-3-white .slider-btn a {
    padding: 12px 30px 11px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-3.slider-content-3-white .slider-btn a {
    padding: 12px 30px 11px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-3.slider-content-3-white .slider-btn a {
    padding: 12px 30px 11px;
  }
}
.slider-content-3.slider-content-3-white .slider-btn a:hover {
  border: 1px solid #000000;
}
.slider-content-3.slider-content-4 {
  margin-left: 112px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .slider-content-3.slider-content-4 {
    margin-left: 30px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-content-3.slider-content-4 {
    margin-left: 0px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-3.slider-content-4 {
    margin-left: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-3.slider-content-4 {
    margin-left: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-3.slider-content-4 {
    margin-left: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-3.slider-content-4 h1 {
    font-size: 34px;
    line-height: 35px;
    margin: 15px 0 15px;
  }
}
.slider-content-3.slider-content-4 h3:before {
  display: none;
}
.slider-content-3.slider-content-4 h3:after {
  display: none;
}

/* slider hm4 */
.slider-height-3 {
  height: 710px;
}
.slider-height-3 .container {
  margin-right: inherit;
  margin-left: inherit;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-height-3 {
    height: 570px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-height-3 {
    height: 500px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height-3 {
    height: 500px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-3 {
    height: 400px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-3.slider-height-res-hm4 {
    height: 680px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-height-3.slider-height-res-hm4 {
    height: 400px;
  }
}

.single-slider-img4 {
  position: relative;
  margin: 0 -77px 0 50px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .single-slider-img4 {
    margin: 0 0px 0 0px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-slider-img4 {
    margin: 0 0px 0 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-slider-img4 {
    margin: 0 0px 0 0px;
  }
}
@media only screen and (max-width: 767px) {
  .single-slider-img4 {
    margin: 30px 0 0;
  }
}
.single-slider-img4 .single-price-wrap {
  position: absolute;
  top: 0;
  right: -24px;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-name: bounce-img;
          animation-name: bounce-img;
  -webkit-animation-duration: 2.9s;
          animation-duration: 2.9s;
  width: 130px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .single-slider-img4 .single-price-wrap {
    right: 0px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-slider-img4 .single-price-wrap {
    right: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-slider-img4 .single-price-wrap {
    right: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .single-slider-img4 .single-price-wrap {
    right: 0px;
  }
}
.single-slider-img4 .single-price-wrap img {
  width: 100%;
}
.single-slider-img4 .single-price-wrap .single-price {
  position: absolute;
  top: 0;
  left: 50%;
  margin-top: 26px;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
  text-align: center;
}
.single-slider-img4 .single-price-wrap .single-price span {
  display: block;
  line-height: 1;
  font-size: 24px;
  color: #915342;
  font-weight: 600;
}
.single-slider-img4 .single-price-wrap .single-price span.dollar {
  margin-top: 2px;
}

/* slider 5 */
.slider-height-4 {
  height: 750px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .slider-height-4 {
    height: 600px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-height-4 {
    height: 600px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-height-4 {
    height: 550px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height-4 {
    height: 530px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-4 {
    height: 500px;
  }
}

.slider-content-5 {
  padding-top: 66px;
}
.slider-content-5 h3 {
  font-weight: 500;
  letter-spacing: 0.5px;
  font-size: 30px;
  margin: 0;
  color: #fff;
}
.slider-content-5 h1 {
  font-weight: 500;
  font-size: 72px;
  margin: 27px 0 22px;
  letter-spacing: 0.5px;
  color: #fff;
  line-height: 56px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-5 h1 {
    font-size: 58px;
    margin: 17px 0 20px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-5 h1 {
    font-size: 45px;
    margin: 15px 0 15px;
    line-height: 38px;
  }
}
.slider-content-5 p {
  font-size: 18px;
  color: #fff;
  margin: 0 0 45px;
}

.slider-btn-5 a {
  font-size: 16px;
  color: #010101;
  background-color: #fff;
  display: inline-block;
  line-height: 1;
  padding: 17px 40px 18px;
  -webkit-transition: all 0.3s ease-in-out 0s;
  -o-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}
.slider-btn-5 a:hover {
  border: none;
  color: #fff;
}

.nav-style-2.owl-carousel > .owl-nav button {
  color: #000;
  display: inline-block;
  font-size: 60px;
  left: 0px;
  opacity: 0;
  visibility: hidden;
  position: absolute;
  text-align: center;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  width: 65px;
  height: 84px;
  line-height: 94px;
  background-color: #fff;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .nav-style-2.owl-carousel > .owl-nav button {
    width: 45px;
    height: 64px;
    line-height: 74px;
    font-size: 45px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .nav-style-2.owl-carousel > .owl-nav button {
    width: 45px;
    height: 64px;
    line-height: 74px;
    font-size: 45px;
  }
}
@media only screen and (max-width: 767px) {
  .nav-style-2.owl-carousel > .owl-nav button {
    width: 35px;
    height: 50px;
    line-height: 54px;
    font-size: 30px;
  }
}
.nav-style-2.owl-carousel > .owl-nav button:hover {
  color: #fff;
  background-color: #000000;
}
.nav-style-2.owl-carousel > .owl-nav button.owl-next {
  left: auto;
  right: 0px;
}

.slider-area:hover .nav-style-2.owl-carousel > .owl-nav button {
  opacity: 1;
  visibility: visible;
}
.slider-area.ml-10 {
  margin-left: 0;
}

/* slider 6 hm7 */
.slider-height-5 {
  height: 850px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .slider-height-5 {
    height: 600px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-height-5 {
    height: 600px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-height-5 {
    height: 550px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height-5 {
    height: 530px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-5 {
    height: 500px;
  }
}

.slider-content-6 h1 {
  font-weight: 500;
  font-size: 60px;
  letter-spacing: 8px;
  color: #fff;
  margin: 0px;
  line-height: 48px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-6 h1 {
    font-size: 45px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-6 h1 {
    font-size: 45px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-6 h1 {
    font-size: 30px;
    line-height: 38px;
  }
}
.slider-content-6 p {
  margin: 32px 0 35px;
  font-size: 18px;
  color: #ffffff;
  letter-spacing: 1px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-6 p {
    margin: 22px 0 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-6 p {
    margin: 22px 0 30px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-6 p {
    margin: 18px 0 25px;
  }
}

.nav-style-3.owl-carousel > .owl-nav {
  position: absolute;
  right: 0;
  bottom: 0;
}
.nav-style-3.owl-carousel > .owl-nav button {
  color: #000;
  display: inline-block;
  font-size: 60px;
  left: 0px;
  text-align: center;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  width: 65px;
  height: 84px;
  line-height: 94px;
  background-color: #fff;
}
@media only screen and (max-width: 767px) {
  .nav-style-3.owl-carousel > .owl-nav button {
    width: 50px;
    height: 60px;
    font-size: 45px;
    line-height: 67px;
  }
}
.nav-style-3.owl-carousel > .owl-nav button:hover {
  background-color: #000000;
  color: #fff;
}

/* slider hm8 */
.slider-height-6 {
  height: 543px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-height-6 {
    height: 500px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height-6 {
    height: 400px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-6 {
    height: 400px;
  }
}

.slider-hm8 .slider-content-5 {
  padding-top: 0px;
}
.slider-hm8 p {
  margin: 0 0 0px;
}

.owl-dot-style .owl-dots {
  bottom: 26px;
  left: 0px;
  position: absolute;
  right: 0;
  text-align: center;
}
.owl-dot-style .owl-dots .owl-dot {
  background: #fff none repeat scroll 0 0;
  border-radius: 100%;
  display: inline-block;
  height: 14px;
  margin: 0 8px;
  width: 14px;
  position: relative;
}
.owl-dot-style .owl-dots .owl-dot:before {
  position: absolute;
  content: "";
  left: -3px;
  right: -3px;
  top: -3px;
  bottom: -3px;
  border: 1px solid transparent;
  border-radius: 100%;
}
.owl-dot-style .owl-dots .owl-dot.active:before {
  border: 1px solid #fff;
}

/* slider hm9 */
.slider-height-7 {
  height: 950px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-height-7 {
    height: 800px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height-7 {
    height: 600px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-7 {
    height: auto;
    padding: 230px 0 100px;
  }
}

.slider-h9-mrg {
  margin-top: -35px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-h9-mrg {
    margin-top: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-h9-mrg {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-h9-mrg {
    margin-top: 0px;
  }
}

@media only screen and (max-width: 767px) {
  .slider-content-7 {
    text-align: center;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-content-7 {
    text-align: left;
  }
}
.slider-content-7 h3 {
  font-size: 16px;
  font-weight: 500;
  color: #313131;
  margin: 0;
  letter-spacing: 0.3px;
  line-height: 1;
}
.slider-content-7 h1 {
  font-size: 48px;
  font-weight: 500;
  color: #313131;
  margin: 17px 0 37px;
  line-height: 65px;
  letter-spacing: 1px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-7 h1 {
    font-size: 42px;
    line-height: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-7 h1 {
    font-size: 32px;
    margin: 6px 0 22px;
    line-height: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-7 h1 {
    font-size: 22px;
    margin: 6px 0 22px;
    line-height: 38px;
  }
}
.slider-content-7 .slider-btn-9 a {
  font-size: 16px;
  color: #010101;
  display: inline-block;
  border: 1px solid #333;
  text-transform: uppercase;
  line-height: 1;
  padding: 19px 50px 19px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-7 .slider-btn-9 a {
    padding: 14px 30px 14px;
    font-size: 15px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-7 .slider-btn-9 a {
    padding: 15px 30px 15px;
    font-size: 15px;
  }
}
.slider-content-7 .slider-btn-9 a:hover {
  color: #fff;
  border: 1px solid #000000;
}
.slider-content-7.slider-content-mrg-hm17 {
  margin-top: 127px;
}
@media only screen and (max-width: 767px) {
  .slider-content-7.slider-content-mrg-hm17 {
    margin-top: 0px;
  }
}

@media only screen and (max-width: 767px) {
  .slider-singleimg-hm9 {
    margin-top: 30px;
  }
  .slider-singleimg-hm9.ml-100 {
    margin-left: 20px;
  }
  .slider-singleimg-hm9.mr-100 {
    margin-right: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-singleimg-hm9 {
    margin-top: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-singleimg-hm9.ml-100 {
    margin-left: 40px;
  }
  .slider-singleimg-hm9.mr-100 {
    margin-right: 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-singleimg-hm9.ml-100 {
    margin-left: 70px;
  }
  .slider-singleimg-hm9.mr-100 {
    margin-right: 70px;
  }
}

/* slider hm10 */
.slider-height-8 {
  height: 700px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-height-8 {
    height: 650px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-height-8 {
    height: 520px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height-8 {
    height: 450px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-8 {
    height: auto;
    padding: 60px 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-singleimg-hm10.ml-40 {
    margin-left: 0;
  }
  .slider-singleimg-hm10.mr-40 {
    margin-right: 0;
  }
}
@media only screen and (max-width: 767px) {
  .slider-singleimg-hm10.ml-40 {
    margin-left: 0;
  }
  .slider-singleimg-hm10.mr-40 {
    margin-right: 0;
  }
}

/* home 11 */
.slider-height-9 {
  height: 780px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-height-9 {
    height: 700px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-height-9 {
    height: 630px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height-9 {
    height: 500px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-9 {
    height: auto;
    padding: 230px 0 70px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-height-9 {
    padding: 230px 0 70px;
  }
}

.slider-content-11 h3 {
  font-size: 24px;
  font-weight: 500;
  margin: 0;
  letter-spacing: 1px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-11 h3 {
    font-size: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-11 h3 {
    font-size: 20px;
  }
}
.slider-content-11 h1 {
  font-size: 72px;
  margin: 0;
  line-height: 97px;
  color: #010101;
  margin: 15px 0 38px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-11 h1 {
    margin: 5px 0 27px;
    font-size: 52px;
    line-height: 65px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-11 h1 {
    margin: 3px 0 20px;
    font-size: 45px;
    line-height: 55px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-11 h1 {
    margin: 3px 0 20px;
    font-size: 40px;
    line-height: 50px;
  }
}
.slider-content-11 .slider-btn-11 a {
  font-size: 16px;
  color: #010101;
  display: inline-block;
  border: 1px solid #333;
  text-transform: uppercase;
  line-height: 1;
  padding: 19px 50px 19px;
}
.slider-content-11 .slider-btn-11 a:hover {
  border: 1px solid #000000;
  color: #fff;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-11 .slider-btn-11 a {
    padding: 15px 35px 15px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-11 .slider-btn-11 a {
    padding: 12px 30px 12px;
    font-size: 14px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-11 {
    text-align: center;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-11.fullpage-content {
    text-align: center;
    width: 100%;
  }
  .slider-content-11.fullpage-content h3 {
    font-size: 16px;
    letter-spacing: 0;
  }
  .slider-content-11.fullpage-content h1 {
    font-size: 30px;
    line-height: 40px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-content-11.fullpage-content h3 {
    font-size: 17px;
    letter-spacing: 0;
  }
  .slider-content-11.fullpage-content h1 {
    font-size: 35px;
  }
}

.slider-singleimg-hm11 {
  margin: 0 22px 0 28px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-singleimg-hm11 {
    margin: 0 50px 0 60px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-singleimg-hm11 {
    margin: 30px 0px 0 0px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-singleimg-hm11 {
    margin: 0px 0px 0 0px;
  }
}

.slider-h11-mrg {
  margin-bottom: -140px;
}
@media only screen and (max-width: 767px) {
  .slider-h11-mrg {
    margin-bottom: 0px;
  }
}

/* home 12 */
#section2 .fp-tableCell, #section4 .fp-tableCell {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#section1 .fp-tableCell, #section3 .fp-tableCell {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}

#section5 .fp-tableCell {
  height: auto !important;
}

#section5 {
  height: auto !important;
}

#fp-nav {
  top: 55%;
}
#fp-nav ul li {
  margin: 7px 7px 10px;
}
#fp-nav ul li a span {
  background: #000;
}
#fp-nav.right {
  right: 64px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  #fp-nav.right {
    right: 10px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  #fp-nav.right {
    right: 25px;
  }
}

.fullpage-slider-mrg {
  margin-top: -34px;
}
@media only screen and (max-width: 767px) {
  .fullpage-slider-mrg {
    margin-top: 0;
    margin-bottom: 30px;
  }
}

.fullpage-slider-mrg-2 {
  margin-bottom: -88px;
}
@media only screen and (max-width: 767px) {
  .fullpage-slider-mrg-2 {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .fullpage-slider-mrg-2 {
    margin-bottom: -50px;
  }
}

.slider-section.active .slider-animated-1 h3 {
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.slider-section.active .slider-animated-1 h1 {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.slider-section.active .slider-animated-1 a {
  -webkit-animation-delay: 1.3s;
  animation-delay: 1.3s;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
.slider-section.active .slider-animated-1 img {
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@media only screen and (max-width: 767px) {
  .slider12-img-2 {
    margin-top: 30px;
    margin-bottom: 30px;
  }
}
.slider12-img-2 img {
  width: 100%;
}

.slider12-img-1 {
  margin: 0 4px 0 6px;
}
.slider12-img-1 img {
  width: 100%;
}

@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .slider12-img-1 {
    text-align: center;
  }
  .slider12-img-1 img {
    width: 350px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider12-img-1 {
    text-align: center;
  }
  .slider12-img-1 img {
    width: 350px;
  }

  .slider12-img-2 {
    text-align: center;
  }
  .slider12-img-2 img {
    width: 420px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider12-img-1 {
    text-align: center;
  }
  .slider12-img-1 img {
    width: 330px;
  }
}
@media only screen and (max-width: 767px) {
  .fullpage-wrapper {
    padding-top: 130px;
  }
}
@media only screen and (max-width: 767px) and (min-width: 576px) and (max-width: 767px) {
  .fullpage-wrapper {
    padding-top: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .fullpage-slider-wrap-mrg {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .fullpage-slider-wrap-mrg {
    margin-bottom: 0px;
  }
}
/* home 13 */
.slider-content-13 h5 {
  letter-spacing: 1px;
  font-size: 24px;
  font-weight: 500;
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .slider-content-13 h5 {
    font-size: 22px;
  }
}
.slider-content-13 h1 {
  font-size: 120px;
  font-weight: 600;
  line-height: 120px;
  margin: 34px 0 55px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-13 h1 {
    font-size: 90px;
    line-height: 90px;
    margin: 24px 0 35px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-13 h1 {
    font-size: 80px;
    line-height: 90px;
    margin: 20px 0 30px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-13 h1 {
    font-size: 40px;
    line-height: 50px;
    margin: 15px 0 20px;
  }
}
.slider-content-13 .slider-btn a {
  font-size: 16px;
  color: #010101;
  display: inline-block;
  border: 1px solid #333;
  text-transform: uppercase;
  line-height: 1;
  padding: 19px 50px 19px;
}
.slider-content-13 .slider-btn a:hover {
  color: #fff;
  border: 1px solid #000000;
}

@media only screen and (max-width: 767px) {
  .hm-13-slider {
    background-position: 72%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .hm-13-slider {
    background-position: 55%;
  }
}
.slider-single-img-14 {
  padding-bottom: 72px;
  margin: 0 23px;
  position: relative;
  z-index: 9;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-single-img-14 {
    padding-bottom: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-single-img-14 {
    padding-bottom: 44px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-single-img-14 {
    padding-bottom: 0px;
    margin: 0 0px;
    text-align: center;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-single-img-14 {
    padding-bottom: 38px;
    text-align: inherit;
  }
}
.slider-single-img-14 img {
  width: 100%;
}

.slider-height-14 {
  height: 850px;
  padding: 89px 0 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-height-14 {
    height: 715px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height-14 {
    height: 525px;
    padding: 70px 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-14 {
    height: auto;
    padding: 120px 0 0;
  }
}

.slider-content-14 {
  margin: -90px 0 0;
}
@media only screen and (max-width: 767px) {
  .slider-content-14 {
    margin: 0px 0 30px;
    text-align: center;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-content-14 {
    margin: 0px 0 30px;
    text-align: left;
  }
}
.slider-content-14 h3 {
  color: #fff;
  font-weight: 500;
  font-size: 24px;
  margin: 0 0 0 150px;
  position: relative;
  letter-spacing: 0.8px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-14 h3 {
    font-size: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-14 h3 {
    font-size: 20px;
    margin: 0 0 0 100px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-content-14 h3 {
    margin: 0 0 0 60px;
  }
}
.slider-content-14 h3::before {
  position: absolute;
  left: -135px;
  top: 14px;
  content: "";
  width: 120px;
  height: 2px;
  background-color: #fff;
}
@media only screen and (max-width: 767px) {
  .slider-content-14 h3::before {
    left: -100px;
    width: 80px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-14 h3::before {
    left: -60px;
    width: 50px;
  }
}
.slider-content-14 h1 {
  color: #fff;
  font-size: 72px;
  line-height: 97px;
  margin: 14px 0 38px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-14 h1 {
    font-size: 55px;
    line-height: 75px;
    margin: 10px 0 25px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-14 h1 {
    font-size: 42px;
    line-height: 60px;
    margin: 10px 0 25px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-14 h1 {
    font-size: 33px;
    line-height: 50px;
    margin: 5px 0 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-content-14 h1 {
    font-size: 30px;
    line-height: 40px;
  }
}
.slider-content-14 .slider-btn a {
  font-size: 16px;
  color: #010101;
  display: inline-block;
  text-transform: uppercase;
  line-height: 1;
  padding: 20px 50px 19px;
  border: none;
  background-color: #eeeff1;
  -webkit-transition: all 0.4s ease-in-out 0s;
  -o-transition: all 0.4s ease-in-out 0s;
  transition: all 0.4s ease-in-out 0s;
  z-index: 1;
}
@media only screen and (max-width: 767px) {
  .slider-content-14 .slider-btn a {
    padding: 16px 30px 15px;
    font-size: 15px;
  }
}
.slider-content-14 .slider-btn a:hover {
  color: #fff;
}

.slider-content-15 h1 {
  color: #fff;
  font-size: 90px;
  font-family: "Abril Fatface", cursive;
  line-height: 115px;
  letter-spacing: 1px;
  margin: 0;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-content-15 h1 {
    font-size: 75px;
    line-height: 100px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-15 h1 {
    font-size: 70px;
    line-height: 85px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-15 h1 {
    font-size: 60px;
    line-height: 85px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-15 h1 {
    font-size: 38px;
    line-height: 55px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-content-15 h1 {
    font-size: 42px;
    line-height: 65px;
  }
}
.slider-content-15.slider15-mrg-nrg h1 {
  margin-top: -26px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-15.slider15-mrg-nrg h1 {
    margin-top: -18px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-15.slider15-mrg-nrg h1 {
    margin-top: -20px;
  }
}

.slider-height-18 {
  height: 460px;
}
@media only screen and (max-width: 767px) {
  .slider-height-18 {
    background-position: 85%;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-18.slider-overly-res {
    height: 400px;
    position: relative;
  }
  .slider-height-18.slider-overly-res:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: "";
    background-color: #fff;
    opacity: 0.5;
  }
}

.slider-banner-area {
  margin-top: 163px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-banner-area {
    margin-top: 162px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-banner-area {
    margin-top: 186px;
  }
}

.slider-content-19 {
  position: relative;
  z-index: 9;
}
.slider-content-19 h3 {
  font-size: 18px;
  color: #010101;
  margin: 0;
  line-height: 1;
  text-transform: uppercase;
}
.slider-content-19 h1 {
  font-size: 70px;
  color: #010101;
  margin: 0px 0 40px;
  line-height: 90px;
  font-weight: 300;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-content-19 h1 {
    font-size: 50px;
    margin: 10px 0 20px;
    line-height: 60px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-19 h1 {
    font-size: 43px;
    margin: 10px 0 20px;
    line-height: 55px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-19 h1 {
    font-size: 40px;
    margin: 10px 0 20px;
    line-height: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-19 h1 {
    font-size: 32px;
    margin: 8px 0 30px;
    line-height: 38px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-content-19 h1 {
    font-size: 30px;
    margin: 12px 0 30px;
    line-height: 46px;
  }
}
.slider-content-19.slider-content-19-white h3 {
  color: #fff;
}
.slider-content-19.slider-content-19-white h1 {
  color: #fff;
}
@media only screen and (max-width: 767px) {
  .slider-content-19 {
    text-align: center;
  }
}

.slider-btn-round a {
  display: inline-block;
  font-size: 16px;
  color: #010101;
  border: 1px solid #000000;
  border-radius: 50px;
  line-height: 1;
  padding: 16px 40px;
}
@media only screen and (max-width: 767px) {
  .slider-btn-round a {
    padding: 12px 30px;
    font-size: 14px;
  }
}
.slider-btn-round.slider-btn-round-white a {
  color: #fff;
  border: 1px solid #fff;
}

.slider-content-20 {
  position: relative;
  z-index: 9;
}
.slider-content-20 h3 {
  color: #73848e;
  font-size: 50px;
  font-family: "Great Vibes", cursive;
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .slider-content-20 h3 {
    font-size: 40px;
  }
}
.slider-content-20 h1 {
  color: #010101;
  font-size: 72px;
  margin: 45px 0 25px;
  line-height: 58px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-20 h1 {
    font-size: 58px;
    margin: 30px 0 20px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-20 h1 {
    font-size: 35px;
    margin: 20px 0 10px;
    line-height: 50px;
  }
}
.slider-content-20 p {
  color: #73848e;
  font-size: 16px;
  font-weight: 500;
  margin: 0px 0 53px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-20 p {
    margin: 0px 0 33px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-20 p {
    margin: 0px 0 23px;
  }
}
.slider-content-20.slider-content-20-white h1 {
  color: #fff;
}

.slider-height-20 {
  height: 750px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-height-20 {
    height: 650px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-height-20 {
    height: 520px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height-20 {
    height: 450px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-20 {
    height: 480px;
    background-position: 70%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-height-20 {
    background-position: 63%;
  }
}

.slider-height-22 {
  height: 770px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-height-22 {
    height: 650px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-height-22 {
    height: 520px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height-22 {
    height: 450px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-22 {
    height: 480px;
    background-position: 70%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-height-22 {
    background-position: 63%;
  }
}

.slider-content-22 {
  position: relative;
  z-index: 9;
}
.slider-content-22 h3 {
  letter-spacing: 0.8px;
  font-size: 24px;
  font-weight: 500;
}
.slider-content-22 h1 {
  line-height: 97px;
  font-size: 72px;
  margin: 0px 0 37px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-22 h1 {
    line-height: 70px;
    font-size: 60px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-22 h1 {
    line-height: 60px;
    font-size: 47px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-22 h1 {
    line-height: 45px;
    font-size: 35px;
    margin: 0px 0 20px;
  }
}
.slider-content-22.slider-content-22-white h3 {
  color: #fff;
}
.slider-content-22.slider-content-22-white h1 {
  color: #fff;
}

.slider-height-24 {
  height: 800px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-height-24 {
    height: 570px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-height-24 {
    height: 500px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height-24 {
    height: 500px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-24 {
    height: auto;
    padding: 50px 0;
  }
}
.slider-height-24.slider-content-center {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.slider-height-25 {
  height: 770px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .slider-height-25 {
    height: 570px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-height-25 {
    height: 500px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-height-25 {
    height: 500px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-height-25 {
    height: auto;
    padding: 50px 0;
  }
}
.slider-height-25.slider-content-center {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.slider-btn-12 a {
  display: inline-block;
  background-color: #e90042;
  border: 1px solid #e90042;
  color: #fff;
  text-transform: uppercase;
  line-height: 1;
  font-size: 16px;
  padding: 17px 47px 19px;
  z-index: 1;
}
@media only screen and (max-width: 767px) {
  .slider-btn-12 a {
    padding: 13px 30px 15px;
  }
}
.slider-btn-12 a:hover {
  border: 1px solid #000000;
}

.slider-content-32 {
  position: relative;
  z-index: 9;
}
.slider-content-32 .content-img img {
  width: auto;
}
.slider-content-32 h1 {
  font-size: 70px;
  line-height: 90px;
  color: #010101;
  font-family: "Lobster", cursive;
  margin: 12px 0 50px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-32 h1 {
    font-size: 60px;
    line-height: 80px;
    margin: 12px 0 35px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-32 h1 {
    font-size: 50px;
    line-height: 65px;
    margin: 12px 0 35px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-32 h1 {
    font-size: 40px;
    line-height: 47px;
    margin: 12px 0 30px;
  }
}

.valentine-btn a {
  display: inline-block;
  font-size: 16px;
  color: #fff;
  border: 1px solid #d70056;
  background-color: #d70056;
  border-radius: 50px;
  line-height: 1;
  padding: 16px 40px;
}
@media only screen and (max-width: 767px) {
  .valentine-btn a {
    padding: 12px 30px;
    font-size: 14px;
  }
}

.slider-content-medical {
  margin-top: -85px;
}
@media only screen and (max-width: 767px) {
  .slider-content-medical {
    margin-top: 0px;
    margin-bottom: 30px;
    text-align: center;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .slider-content-medical {
    text-align: left;
  }
}
.slider-content-medical h3 {
  font-size: 18px;
  color: #fff;
  font-family: "Josefin Sans", sans-serif;
  margin: 0;
  line-height: 1;
  font-weight: 600;
}
.slider-content-medical h1 {
  font-size: 72px;
  color: #fff;
  font-family: "Josefin Sans", sans-serif;
  line-height: 82px;
  letter-spacing: -0.2px;
  font-weight: bold;
  margin: 24px 0 39px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .slider-content-medical h1 {
    font-size: 52px;
    line-height: 62px;
    margin: 20px 0 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .slider-content-medical h1 {
    font-size: 42px;
    line-height: 52px;
    margin: 18px 0 24px;
  }
}
@media only screen and (max-width: 767px) {
  .slider-content-medical h1 {
    font-size: 32px;
    line-height: 42px;
    margin: 10px 0 20px;
  }
}

.slider-btn-medical a {
  font-size: 16px;
  font-weight: bold;
  color: #000;
  line-height: 1;
  display: inline-block;
  font-family: "Josefin Sans", sans-serif;
  border: 1px solid transparent;
  background-color: #fff;
  padding: 18px 40px 16px;
}
@media only screen and (max-width: 767px) {
  .slider-btn-medical a {
    font-size: 16px;
    padding: 14px 30px 12px;
  }
}

.single-slider-medical {
  padding-top: 85px;
}
@media only screen and (max-width: 767px) {
  .single-slider-medical {
    padding-top: 60px;
  }
}

.owl-dot-none .owl-dots {
  display: none;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .res-mrg-md-mb {
    margin-bottom: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .res-mrg-md-mb {
    margin-bottom: 30px;
  }

  .slider-singleimg-pets {
    margin-top: 30px;
  }
}
/*-------- 4. Support style  -------*/
.support-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.support-wrap .support-icon {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50px;
          flex: 0 0 50px;
  margin-right: 20px;
}
.support-wrap .support-icon img {
  width: 100%;
}
.support-wrap .support-content h5 {
  font-size: 18px;
  margin: 0 0 5px;
}
.support-wrap .support-content p {
  color: #666;
  margin: 0;
}
.support-wrap.support-2 {
  margin-left: 22px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .support-wrap.support-2 {
    margin-left: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .support-wrap.support-2 {
    margin-left: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .support-wrap.support-2 {
    margin-left: 0px;
  }
}
.support-wrap.support-2 .support-icon {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 41px;
          flex: 0 0 41px;
}
.support-wrap.support-3 {
  margin-left: 9px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .support-wrap.support-3 {
    margin-left: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .support-wrap.support-3 {
    margin-left: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .support-wrap.support-3 {
    margin-left: 0px;
  }
}
.support-wrap.support-3 .support-icon {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 41px;
          flex: 0 0 41px;
}
.support-wrap.support-4 {
  margin-left: 23px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .support-wrap.support-4 {
    margin-left: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .support-wrap.support-4 {
    margin-left: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .support-wrap.support-4 {
    margin-left: 0px;
  }
}
.support-wrap.support-4 .support-icon {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 35px;
          flex: 0 0 35px;
}
.support-wrap:hover .support-icon img {
  -webkit-animation: 500ms ease-in-out 0s normal none 1 running tada;
          animation: 500ms ease-in-out 0s normal none 1 running tada;
}

/* support hm3 */
.support-wrap-2 .support-content-2 h5 {
  font-size: 18px;
  color: #494949;
  margin: 15px 0 15px;
  line-height: 24px;
}
.support-wrap-2 .support-content-2 p {
  font-size: 14px;
  color: #6a6a6a;
  margin: 0 auto;
  width: 80%;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .support-wrap-2 .support-content-2 p {
    width: 100%;
  }
}
.support-wrap-2:hover .support-content-2 img {
  -webkit-animation: 500ms ease-in-out 0s normal none 1 running tada;
          animation: 500ms ease-in-out 0s normal none 1 running tada;
}
.support-wrap-2.support-shape {
  position: relative;
}
.support-wrap-2.support-shape:before {
  position: absolute;
  right: -14px;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  background-color: #d5d4d4;
  height: 61px;
  width: 1px;
  content: "";
}
.support-wrap-2.support-shape-2 {
  border: 4px solid #fff;
}
.support-wrap-2.support-shape-3 {
  border: 4px solid #f6f6f6;
}
.support-wrap-2.support-padding-2 {
  padding: 36px 10px 30px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .support-wrap-2.support-padding-2 {
    padding: 36px 5px 30px;
  }
}
@media only screen and (max-width: 767px) {
  .support-wrap-2.support-padding-2 {
    padding: 36px 6px 30px;
  }
}

.support-bg-color-1 {
  background-color: #ccfbe9;
}

.support-bg-color-2 {
  background-color: #f2fbcc;
}

.support-bg-color-3 {
  background-color: #ddfbcc;
}

.support-bg-color-black {
  background-color: #303030;
}

.support-wrap-3 {
  position: relative;
  padding: 30px 10px 24px;
  overflow: hidden;
}
.support-wrap-3 .support-icon-2 {
  position: absolute;
  right: 0;
  bottom: 0;
}
.support-wrap-3 .support-content-3 p {
  color: #000000;
  margin: 4px 0 0;
  font-size: 16px;
  text-transform: uppercase;
}
@media only screen and (max-width: 767px) {
  .support-wrap-3 .support-content-3 p {
    font-size: 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .support-wrap-3 .support-content-3 p {
    font-size: 14px;
  }
}
.support-wrap-3 .support-content-3.support-content-3-white p {
  color: #fff;
}
.support-wrap-3:hover .support-icon-2 img {
  -webkit-animation: 500ms ease-in-out 0s normal none 1 running tada;
          animation: 500ms ease-in-out 0s normal none 1 running tada;
}

.support-wrap-4-border {
  border: 1px solid #eeeeee;
  padding: 50px 0 20px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .support-wrap-4-border {
    padding: 50px 10px 20px;
  }
}

.support-wrap-4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .support-wrap-4 {
    display: block;
    text-align: center;
  }
}
@media only screen and (max-width: 767px) {
  .support-wrap-4 {
    display: block;
    text-align: center;
  }
}
.support-wrap-4 .support-icon-4 {
  margin-right: 32px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .support-wrap-4 .support-icon-4 {
    margin-right: 0px;
    margin-bottom: 15px;
  }
}
@media only screen and (max-width: 767px) {
  .support-wrap-4 .support-icon-4 {
    margin-right: 0px;
    margin-bottom: 15px;
  }
}
.support-wrap-4 .support-icon-4 img {
  width: auto;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.support-wrap-4 .support-content-4 h5 {
  font-size: 20px;
  font-weight: 500;
  color: #212121;
  margin: 0 0 6px;
  letter-spacing: 0.4px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .support-wrap-4 .support-content-4 h5 {
    font-size: 18px;
  }
}
@media only screen and (max-width: 767px) {
  .support-wrap-4 .support-content-4 h5 {
    font-size: 18px;
  }
}
.support-wrap-4 .support-content-4 p {
  font-weight: 300;
  color: #080808;
  margin: 0 0 0px;
  letter-spacing: 0.6px;
}
.support-wrap-4:hover .support-icon-4 img {
  -webkit-animation: 500ms ease-in-out 0s normal none 1 running tada;
          animation: 500ms ease-in-out 0s normal none 1 running tada;
}

@media only screen and (max-width: 767px) {
  .support-area.pt-80 {
    padding-top: 30px;
  }

  .suppoer-area.pb-60 {
    padding-bottom: 50px;
  }
  .suppoer-area.pb-100 {
    padding-bottom: 50px;
  }
}
/*------- 5. Section title style  -------*/
@media only screen and (max-width: 767px) {
  .section-title.mb-50 {
    margin-bottom: 30px;
  }
}
.section-title h2 {
  font-size: 30px;
  font-weight: 600;
  margin: 0 0 0;
  position: relative;
  display: inline-block;
}
@media only screen and (max-width: 767px) {
  .section-title h2 {
    font-size: 24px;
    line-height: 30px;
  }
  .section-title h2.mb-50 {
    margin-bottom: 30px;
  }
}
.section-title h2::before {
  position: absolute;
  content: "";
  left: -100px;
  background-color: #000;
  width: 80px;
  height: 2px;
  top: 17px;
}
@media only screen and (max-width: 767px) {
  .section-title h2::before {
    left: -40px;
    width: 30px;
  }
}
.section-title h2::after {
  position: absolute;
  content: "";
  right: -100px;
  background-color: #000;
  width: 80px;
  height: 2px;
  top: 17px;
}
@media only screen and (max-width: 767px) {
  .section-title h2::after {
    right: -40px;
    width: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .section-title.mb-55 {
    margin-bottom: 30px;
  }
}

.section-title-2 h2 {
  font-size: 30px;
  color: #000000;
  font-weight: 600;
  margin: 0 0 15px;
  padding: 0 0 15px;
  position: relative;
  display: inline-block;
}
.section-title-2 h2:before {
  position: absolute;
  content: "";
  left: 0;
  right: 0;
  margin: 0 auto;
  bottom: 0;
  width: 80px;
  height: 2px;
  background-color: #000000;
}
.section-title-2 p {
  color: #333;
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .section-title-2.mb-60 {
    margin-bottom: 30px;
  }
}

.section-title-3 h4 {
  font-weight: 500;
  color: #000000;
  font-size: 24px;
}
@media only screen and (max-width: 767px) {
  .section-title-3.mb-40 {
    margin-bottom: 20px;
  }
}

.section-border {
  margin-right: 94px;
  overflow: hidden;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .section-border {
    margin-right: 0px;
  }
}
.section-border::before {
  background-color: #d2d2d2;
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  top: 11px;
  -webkit-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
  width: 100%;
  z-index: 1;
}
@media only screen and (max-width: 767px) {
  .section-border::before {
    display: none;
  }
}

.section-title-4 {
  position: relative;
  z-index: 99;
}
.section-title-4 h3 {
  font-weight: 600;
  color: #242424;
  font-size: 20px;
  letter-spacing: -0.25px;
  margin: 0;
  line-height: 1;
  padding-right: 45px;
}
@media only screen and (max-width: 767px) {
  .section-title-4 h3 {
    padding-right: 0px;
  }
}

.section-title-5 h2 {
  color: #010101;
  font-size: 48px;
  margin: 0;
  line-height: 38px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-title-5 h2 {
    font-size: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .section-title-5 h2 {
    font-size: 30px;
    line-height: 27px;
  }
}
.section-title-5 h2.white {
  color: #fff;
}
@media only screen and (max-width: 767px) {
  .section-title-5.mb-60 {
    margin-bottom: 30px;
  }
}

.section-title-6 h2 {
  color: #000;
  font-size: 36px;
  margin: 0;
  font-weight: 600;
}
@media only screen and (max-width: 767px) {
  .section-title-6 h2 {
    font-size: 26px;
  }
}
.section-title-6 p {
  color: #808080;
  font-size: 16px;
  margin: 14px 0 0;
}
.section-title-6 span {
  font-size: 16px;
  color: #808080;
  letter-spacing: 1px;
  margin: 20px 0 0;
  display: block;
}
@media only screen and (max-width: 767px) {
  .section-title-6 span {
    margin: 10px 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .section-title-6.mb-50, .section-title-6.mb-45 {
    margin-bottom: 30px;
  }
  .section-title-6.pb-30 {
    padding-bottom: 10px;
  }
}

.section-title-7 h2 {
  font-size: 36px;
  color: #010101;
  font-weight: 500;
  margin: 0;
  line-height: 29px;
}
@media only screen and (max-width: 767px) {
  .section-title-7 h2 {
    font-size: 30px;
  }
}
.section-title-7 p {
  color: #646464;
  line-height: 24px;
  font-weight: 500;
  margin: 23px auto 0;
  width: 47%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-title-7 p {
    width: 56%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-title-7 p {
    width: 75%;
  }
}
@media only screen and (max-width: 767px) {
  .section-title-7 p {
    width: 100%;
    margin: 15px auto 0;
  }
}
@media only screen and (max-width: 767px) {
  .section-title-7.mb-30 {
    margin-bottom: 20px;
  }
  .section-title-7.mb-60 {
    margin-bottom: 30px;
  }
  .section-title-7.mb-55 {
    margin-bottom: 25px;
  }
}

/*------- 6. Product style  --------*/
.product-area {
  position: relative;
}
@media only screen and (max-width: 767px) {
  .product-area.product-mb-xs {
    padding-bottom: 60px;
  }
  .product-area.pb-65 {
    padding-bottom: 30px;
  }
}

.product-tab-list {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media only screen and (max-width: 767px) {
  .product-tab-list.pt-30, .product-tab-list.pt-55 {
    padding: 10px 0 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-tab-list.pt-35, .product-tab-list.pt-60 {
    padding: 20px 0 30px;
  }
}
@media only screen and (max-width: 767px) {
  .product-tab-list.pt-35, .product-tab-list.pt-60 {
    padding: 10px 0 10px;
  }
  .product-tab-list.pb-50 {
    padding-bottom: 30px;
  }
  .product-tab-list.mb-45 {
    margin-bottom: 20px;
  }
}
.product-tab-list a {
  margin: 0 11px;
}
@media only screen and (max-width: 767px) {
  .product-tab-list a {
    margin: 0 11px 5px;
  }
}
.product-tab-list a h4 {
  font-weight: 500;
  font-size: 18px;
  color: #555;
  margin: 0;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.product-tab-list a h4:hover {
  color: #000;
}
.product-tab-list a.active h4 {
  color: #000;
}
.product-tab-list.product-tab-fruits a h4 {
  color: #000000;
  border-bottom: 2px solid transparent;
}
.product-tab-list.product-tab-fruits a h4:hover {
  color: #6eab49;
}
.product-tab-list.product-tab-fruits a.active h4 {
  color: #6eab49;
  border-bottom: 2px solid #6eab49;
}
.product-tab-list.product-tab-cake a h4 {
  color: #000000;
  border-bottom: 2px solid transparent;
}
.product-tab-list.product-tab-cake a h4:hover {
  color: #000000;
}
.product-tab-list.product-tab-cake a.active h4 {
  color: #000000;
  border-bottom: 2px solid #000000;
}
.product-tab-list.product-tab-pink a h4 {
  color: #000000;
  border-bottom: 2px solid transparent;
}
.product-tab-list.product-tab-pink a h4:hover {
  color: #e90042;
}
.product-tab-list.product-tab-pink a.active h4 {
  color: #e90042;
  border-bottom: 2px solid #e90042;
}
.product-tab-list.product-tab-pink2 a h4 {
  color: #000000;
  border-bottom: 2px solid transparent;
}
.product-tab-list.product-tab-pink2 a h4:hover {
  color: #000000;
}
.product-tab-list.product-tab-pink2 a.active h4 {
  color: #000000;
  border-bottom: 2px solid 000000e90042;
}
.product-tab-list.product-tab-fashion a {
  margin: 0 23px;
}
@media only screen and (max-width: 767px) {
  .product-tab-list.product-tab-fashion a {
    margin: 0 15px 5px;
  }
}
.product-tab-list.product-tab-fashion a h4 {
  color: #808080;
  font-size: 16px;
}
.product-tab-list.product-tab-fashion a h4:hover {
  color: #000000;
}
.product-tab-list.product-tab-fashion a.active h4 {
  color: #000000;
}
.product-tab-list.product-tab-white a h4 {
  color: #fff;
}

.product-wrap {
  position: relative;
}
.product-wrap .product-img {
  position: relative;
  overflow: hidden;
}
.product-wrap .product-img img {
  width: 100%;
  height: auto !important;
}
.product-wrap .product-img span {
  position: absolute;
  top: 12px;
  right: 12px;
  font-size: 13px;
  color: #fff;
  display: inline-block;
  line-height: 1;
  padding: 3px 11px;
  border-radius: 3px;
  font-weight: 500;
}
.product-wrap .product-img span.pink {
  background-color: 000000;
}
.product-wrap .product-img span.purple {
  background-color: #000000;
}
.product-wrap .product-img .hover-img {
  position: absolute;
  top: 0;
  left: 50%;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translate(-50%, 20px);
      -ms-transform: translate(-50%, 20px);
          transform: translate(-50%, 20px);
  -webkit-transition-duration: 0.7s;
       -o-transition-duration: 0.7s;
          transition-duration: 0.7s;
}
.product-wrap .product-img .product-action {
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 100%;
  z-index: 9;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.product-wrap .product-img .product-action > div {
  opacity: 0;
  visibility: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  height: 48px;
  -webkit-transform: translateY(20px);
      -ms-transform: translateY(20px);
          transform: translateY(20px);
  background-color: #000000;
  -webkit-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.product-wrap .product-img .product-action > div:hover {
  background-color: #000;
}
.product-wrap .product-img .product-action .pro-wishlist {
  width: 48px;
  border-right: 1px solid rgba(255, 255, 255, 0.2);
}
.product-wrap .product-img .product-action .pro-cart {
  font-size: 14px;
  width: calc(100% - 48px - 48px);
  -webkit-transition-delay: 0.1s;
       -o-transition-delay: 0.1s;
          transition-delay: 0.1s;
}
.product-wrap .product-img .product-action .pro-quickview {
  width: 48px;
  border-left: 1px solid rgba(255, 255, 255, 0.2);
  margin: 0;
  -webkit-transition-delay: 0.2s;
       -o-transition-delay: 0.2s;
          transition-delay: 0.2s;
}
.product-wrap .product-img .product-action .pro-same-action a {
  color: #fff;
  font-size: 16px;
  height: 48px;
  line-height: 48px;
  display: block;
  width: 100%;
  text-align: center;
  text-transform: capitalize;
}
.product-wrap .product-img .product-action .pro-same-action.pro-wishlist a, .product-wrap .product-img .product-action .pro-same-action.pro-quickview a {
  margin-top: 2px;
}
.product-wrap .product-content {
  margin: 20px 0 0;
}
.product-wrap .product-content h3 {
  font-size: 16px;
  margin: 0;
}
.product-wrap .product-content .product-rating {
  margin: 3px 0 3px;
}
.product-wrap .product-content .product-rating i {
  font-size: 17px;
  color: #5f5d5d;
  margin: 0 3px;
}
.product-wrap .product-content .product-rating i.yellow {
  color: #ffa900;
}
.product-wrap .product-content .product-price span {
  font-size: 15px;
  color: #000;
  font-weight: 500;
  margin: 0 9px;
  position: relative;
}
.product-wrap .product-content .product-price span::before {
  position: absolute;
  content: "";
  right: -13px;
  top: 10px;
  width: 7px;
  height: 2px;
  background-color: #000;
}
.product-wrap .product-content .product-price span:last-child:before {
  display: none;
}
.product-wrap .product-content .product-price span.old {
  color: #8e8e8e;
  text-decoration: line-through;
}
.product-wrap:hover .hover-img {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translate(-50%, 0);
      -ms-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
}
.product-wrap:hover .product-action > div {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}

.modal-dialog {
  margin: 8% auto;
  max-width: 960px;
  width: 960px;
  padding: 35px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .modal-dialog {
    width: 720px;
    max-width: 720px;
  }
}
@media only screen and (max-width: 767px) {
  .modal-dialog {
    width: 100%;
    max-width: 100%;
    padding: 35px 0;
  }
}
.modal-dialog .modal-header .close {
  color: #333;
  cursor: pointer;
  opacity: 1;
}
.modal-dialog .modal-header .close:hover {
  color: #000000;
}
.modal-dialog .modal-body {
  padding: 35px 15px;
}
.modal-dialog .quickview-big-img img {
  width: 100%;
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .product-details-content.ml-70 {
    margin-left: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-details-content.ml-70 {
    margin-left: 0;
  }
}
@media only screen and (max-width: 767px) {
  .product-details-content.ml-70 {
    margin-left: 0;
    margin-top: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .product-details-content.quickview-content {
    margin-top: 30px;
  }
}
.product-details-content h2 {
  color: #010101;
  font-size: 24px;
  margin: 0 0 0px;
  line-height: 1;
}
.product-details-content .product-details-price {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 15px 0 26px;
}
.product-details-content .product-details-price span {
  font-size: 24px;
  color: #fe5252;
}
.product-details-content .product-details-price span.old {
  color: #333;
  font-size: 18px;
  text-decoration: line-through;
  margin-left: 20px;
}
.product-details-content .pro-details-rating-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0 0 17px;
}
.product-details-content .pro-details-rating-wrap .pro-details-rating {
  position: relative;
  margin-right: 39px;
}
.product-details-content .pro-details-rating-wrap .pro-details-rating:before {
  position: absolute;
  right: -19px;
  top: 4px;
  content: "";
  height: 15px;
  width: 2px;
  background-color: #d1d1d1;
}
.product-details-content .pro-details-rating-wrap .pro-details-rating i {
  color: #5f5d5d;
  font-size: 17px;
  margin-right: 5px;
}
.product-details-content .pro-details-rating-wrap .pro-details-rating i.yellow {
  color: #ffa900;
}
.product-details-content .pro-details-rating-wrap span a {
  font-size: 15px;
  color: #000000;
}
.product-details-content .pro-details-rating-wrap span a:hover {
  color: #000;
}
.product-details-content p {
  font-size: 15px;
  line-height: 28px;
  color: #333;
  margin: 0;
}
.product-details-content .pro-details-list {
  margin: 20px 0 34px;
  border-bottom: 1px solid #e5e5e5;
  padding: 0 0 37px;
}
.product-details-content .pro-details-list ul li {
  color: #333;
  margin: 0 0 5px;
}
.product-details-content .pro-details-list ul li:last-child {
  margin: 0;
}
.product-details-content .pro-details-size-color {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (max-width: 767px) {
  .product-details-content .pro-details-size-color {
    display: block;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .product-details-content .pro-details-size-color {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
.product-details-content .pro-details-size-color .pro-details-color-wrap {
  margin-right: 20px;
  overflow: hidden;
}
@media only screen and (max-width: 767px) {
  .product-details-content .pro-details-size-color .pro-details-color-wrap {
    margin-bottom: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .product-details-content .pro-details-size-color .pro-details-color-wrap {
    margin-bottom: 0px;
  }
}
.product-details-content .pro-details-size-color .pro-details-color-wrap span {
  display: block;
  font-weight: 500;
  margin: 0 0 15px;
  font-size: 15px;
}
.product-details-content .pro-details-size-color .pro-details-color-wrap .pro-details-color-content ul li {
  border-radius: 50px;
  cursor: pointer;
  display: block;
  float: left;
  height: 14px;
  margin-right: 15px;
  position: relative;
  -webkit-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
  width: 14px;
}
.product-details-content .pro-details-size-color .pro-details-color-wrap .pro-details-color-content ul li:last-child {
  margin-right: 0px;
}
.product-details-content .pro-details-size-color .pro-details-color-wrap .pro-details-color-content ul li.blue {
  background-color: #4798f3;
  border: 1px solid #4798f3;
}
.product-details-content .pro-details-size-color .pro-details-color-wrap .pro-details-color-content ul li.maroon {
  background-color: #736751;
  border: 1px solid #736751;
}
.product-details-content .pro-details-size-color .pro-details-color-wrap .pro-details-color-content ul li.gray {
  background-color: #c0c0c0;
  border: 1px solid #c0c0c0;
}
.product-details-content .pro-details-size-color .pro-details-color-wrap .pro-details-color-content ul li.green {
  background-color: #139c57;
  border: 1px solid #139c57;
}
.product-details-content .pro-details-size-color .pro-details-color-wrap .pro-details-color-content ul li.yellow {
  background-color: #e28b37;
  border: 1px solid #e28b37;
}
.product-details-content .pro-details-size-color .pro-details-size span {
  display: block;
  font-weight: 500;
  margin: 0 0 10px;
  font-size: 15px;
}
.product-details-content .pro-details-size-color .pro-details-size .pro-details-size-content ul li {
  display: inline-block;
  list-style: outside none none;
  margin: 0 2px 0 0;
}
.product-details-content .pro-details-size-color .pro-details-size .pro-details-size-content ul li a {
  background-color: #f1f2f6;
  color: #000;
  display: inline-block;
  font-size: 12px;
  line-height: 1;
  padding: 6px 9px 7px;
  text-transform: uppercase;
}
.product-details-content .pro-details-size-color .pro-details-size .pro-details-size-content ul li a:hover {
  background-color: #000000;
  color: #fff;
}
.product-details-content .pro-details-quality {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 40px;
  margin-bottom: 34px;
}
.product-details-content .pro-details-quality .cart-plus-minus {
  border: 1px solid #e8e8e8;
  display: inline-block;
  height: 60px;
  overflow: hidden;
  padding: 0;
  position: relative;
  width: 80px;
}
.product-details-content .pro-details-quality .cart-plus-minus .qtybutton {
  color: #8f8f8f;
  cursor: pointer;
  float: inherit;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  margin: 0;
  position: absolute;
  text-align: center;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  width: 24px;
}
.product-details-content .pro-details-quality .cart-plus-minus .dec.qtybutton {
  height: 60px;
  left: 0;
  padding-top: 20px;
  top: 0;
}
.product-details-content .pro-details-quality .cart-plus-minus .inc.qtybutton {
  height: 60px;
  padding-top: 20px;
  right: 0;
  top: 0;
}
.product-details-content .pro-details-quality .cart-plus-minus input.cart-plus-minus-box {
  background: transparent none repeat scroll 0 0;
  border: medium none;
  color: #8f8f8f;
  float: left;
  font-size: 14px;
  height: 60px;
  margin: 0;
  padding: 0;
  text-align: center;
  width: 80px;
}
.product-details-content .pro-details-quality .pro-details-cart {
  margin: 0 25px 0 10px;
}
@media only screen and (max-width: 767px) {
  .product-details-content .pro-details-quality .pro-details-cart {
    margin: 0 10px 0 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-details-content .pro-details-quality .pro-details-cart {
    margin: 0 17px 0 10px;
  }
}
.product-details-content .pro-details-quality .pro-details-cart a {
  color: #fff;
  font-weight: bold;
  text-transform: uppercase;
  background-color: #343538;
  display: inline-block;
  line-height: 1;
  padding: 23px 38px 23px;
  z-index: 99;
}
@media only screen and (max-width: 767px) {
  .product-details-content .pro-details-quality .pro-details-cart a {
    padding: 23px 12px 23px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-details-content .pro-details-quality .pro-details-cart a {
    padding: 22px 22px 22px;
  }
}
.product-details-content .pro-details-quality .pro-details-cart a:hover {
  border: none;
}
.product-details-content .pro-details-quality .pro-details-wishlist a {
  font-size: 18px;
  color: #000;
}
.product-details-content .pro-details-quality .pro-details-wishlist a:hover {
  color: #000000;
}
.product-details-content .pro-details-quality .pro-details-compare a {
  font-size: 18px;
  color: #000;
  margin-left: 25px;
}
@media only screen and (max-width: 767px) {
  .product-details-content .pro-details-quality .pro-details-compare a {
    margin-left: 10px;
  }
}
.product-details-content .pro-details-quality .pro-details-compare a:hover {
  color: #000000;
}
.product-details-content .pro-details-meta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0 0 10px;
}
.product-details-content .pro-details-meta span {
  font-size: 15px;
  color: #676767;
  margin-right: 5px;
}
.product-details-content .pro-details-meta ul li {
  display: inline-block;
  margin: 0 3px 0 0;
}
.product-details-content .pro-details-meta ul li a {
  color: #676767;
  font-size: 15px;
}
@media only screen and (max-width: 767px) {
  .product-details-content .pro-details-meta ul li a {
    font-size: 14px;
  }
}
.product-details-content .pro-details-meta ul li a:hover {
  color: #000000;
}
.product-details-content .pro-details-social {
  margin: 24px 0 0;
}
.product-details-content .pro-details-social ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.product-details-content .pro-details-social ul li {
  margin-right: 40px;
}
.product-details-content .pro-details-social ul li:last-child {
  margin-right: 0px;
}
.product-details-content .pro-details-social ul li a {
  font-size: 16px;
  color: #343538;
}
.product-details-content .pro-details-social ul li a:hover {
  color: #000000;
}
@media only screen and (max-width: 767px) {
  .product-details-content.pro-details-slider-content.mt-50 {
    margin-top: 30px;
  }
}
.product-details-content.pro-details-slider-content .product-details-price {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.product-details-content.pro-details-slider-content p {
  width: 59%;
  margin: 0 auto;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .product-details-content.pro-details-slider-content p {
    width: 80%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-details-content.pro-details-slider-content p {
    width: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .product-details-content.pro-details-slider-content p {
    width: 100%;
  }
}
.product-details-content.pro-details-slider-content .pro-details-rating-wrap {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.product-details-content.pro-details-slider-content .pro-details-size-color {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  text-align: left;
}
@media only screen and (max-width: 767px) {
  .product-details-content.pro-details-slider-content .pro-details-size-color {
    text-align: center;
  }
  .product-details-content.pro-details-slider-content .pro-details-size-color .pro-details-color-content {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
.product-details-content.pro-details-slider-content .pro-details-quality {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.product-details-content.pro-details-slider-content .pro-details-meta {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.product-details-content.pro-details-slider-content .pro-details-social ul {
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.quickview-wrap .nav-style-1.owl-carousel > .owl-nav button {
  font-size: 20px;
  color: #333;
  left: 0px;
}
.quickview-wrap .nav-style-1.owl-carousel > .owl-nav button:hover {
  color: #000000;
}
.quickview-wrap .nav-style-1.owl-carousel > .owl-nav button.owl-next {
  right: 0px;
  left: auto;
}
.quickview-wrap:hover .nav-style-1.owl-carousel > .owl-nav button {
  opacity: 1;
  visibility: visible;
}

/*  prodduct 2     */
.tab-filter-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media only screen and (max-width: 767px) {
  .tab-filter-wrap {
    display: block;
  }
  .tab-filter-wrap.mb-60 {
    margin-bottom: 30px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .tab-filter-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .tab-filter-wrap.mb-60 {
    margin-bottom: 30px;
  }
}

@media only screen and (max-width: 767px) {
  .product-tab-list-2 {
    margin: 0 0 10px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .product-tab-list-2 {
    margin: 0 0 0px;
  }
}
.product-tab-list-2 a {
  display: inline-block;
  margin-right: 23px;
}
@media only screen and (max-width: 767px) {
  .product-tab-list-2 a {
    margin: 0 23px 10px 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .product-tab-list-2 a {
    margin: 0 23px 0px 0;
  }
}
.product-tab-list-2 a:last-child {
  margin-right: 0;
}
.product-tab-list-2 a h4 {
  color: #555;
  font-size: 18px;
  font-weight: 500;
  margin: 0;
  border-bottom: 2px solid transparent;
  padding-bottom: 5px;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.product-tab-list-2 a h4:hover {
  color: #000000;
}
.product-tab-list-2 a.active h4 {
  color: #000000;
  border-bottom: 2px solid #000000;
}

.filter-active {
  position: relative;
}
.filter-active a {
  font-weight: 500;
  font-size: 18px;
  color: #010101;
}
.filter-active a:hover {
  color: #000000;
}
.filter-active a i {
  font-size: 14px;
}

.product-filter-wrapper {
  background-color: #fff;
  -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
  margin-bottom: 60px;
  padding: 45px 45px 7px;
  display: none;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-filter-wrapper {
    padding: 35px 25px 7px;
  }
}
@media only screen and (max-width: 767px) {
  .product-filter-wrapper {
    padding: 35px 25px 7px;
  }
}
.product-filter-wrapper .product-filter h5 {
  color: #000;
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 25px;
  padding-bottom: 7px;
  position: relative;
  text-transform: capitalize;
}
.product-filter-wrapper .product-filter h5::before {
  background-color: #000;
  bottom: 0;
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  width: 20px;
}
.product-filter-wrapper .product-filter ul.sort-by li {
  margin-bottom: 3px;
}
.product-filter-wrapper .product-filter ul.sort-by li:last-child {
  margin-bottom: 0;
}
.product-filter-wrapper .product-filter ul.color-filter li {
  margin-bottom: 6px;
}
.product-filter-wrapper .product-filter ul.color-filter li:last-child {
  margin-bottom: 0px;
}
.product-filter-wrapper .product-filter ul.color-filter li input {
  width: 20px;
  height: 20px;
  display: inline-block;
  float: left;
  margin: 3px 8px 0 0;
}
.product-filter-wrapper .product-filter ul.color-filter li a {
  text-transform: capitalize;
}
.product-filter-wrapper .product-filter .product-tags ul li {
  margin-bottom: 4px;
}
.product-filter-wrapper .product-filter .product-tags ul li a {
  text-transform: capitalize;
}

.price-filter .price-slider-amount input {
  background: transparent;
  padding: 0;
  border: none;
  font-size: 16px;
  font-weight: 500;
}
.price-filter #slider-range {
  background: #dbdbdb none repeat scroll 0 0;
  border: medium none;
  border-radius: 50px;
  height: 5px;
  margin-bottom: 12px;
  margin-left: auto;
}
.price-filter #slider-range span {
  -webkit-transition: all 0s ease 0s;
  -o-transition: all 0s ease 0s;
  transition: all 0s ease 0s;
}
.price-filter #slider-range .ui-slider-range {
  position: absolute;
  display: block;
  border: 0;
  background: 000000 none repeat scroll 0 0;
  border: none;
  -webkit-transition: all 0s ease 0s;
  -o-transition: all 0s ease 0s;
  transition: all 0s ease 0s;
}
.price-filter #slider-range .ui-slider-handle {
  background: #fff none repeat scroll 0 0;
  border: medium none;
  border-radius: 50%;
  height: 15px;
  margin-left: 0;
  width: 15px;
  border: 4px solid 000000;
}

.tab-content.jump .tab-pane {
  display: block;
  height: 0;
  opacity: 0;
  overflow: hidden;
}
.tab-content.jump .tab-pane.active {
  display: block;
  height: auto;
  opacity: 1;
  overflow: visible;
}

.product-wrap-2 {
  position: relative;
  overflow: hidden;
}
.product-wrap-2 .product-img {
  position: relative;
}
.product-wrap-2 .product-img img {
  width: 100%;
}
.product-wrap-2 .product-img span {
  font-size: 14px;
  font-weight: 500;
  position: absolute;
  top: 20px;
  right: 20px;
}
.product-wrap-2 .product-img span.pink {
  color: 000000;
}
.product-wrap-2 .product-img span.red {
  color: #ff3d2a;
}
.product-wrap-2 .product-img span.purple {
  color: #000000;
}
.product-wrap-2 .product-img .default-img {
  -webkit-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
}
.product-wrap-2 .product-img .hover-img {
  position: absolute;
  top: 0px;
  visibility: hidden;
  left: 0px;
  width: 100%;
  opacity: 0;
  -webkit-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  -webkit-transform: translateX(100%);
      -ms-transform: translateX(100%);
          transform: translateX(100%);
}
.product-wrap-2 .product-img .product-action-2 {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
}
.product-wrap-2 .product-img .product-action-2 a {
  display: inline-block;
  line-height: 1;
  width: 42px;
  height: 42px;
  line-height: 42px;
  font-size: 16px;
  background-color: #000;
  color: #fff;
  text-align: center;
  border-radius: 50px;
  margin: 0 3px;
  -webkit-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  -webkit-transform: scaleX(0);
      -ms-transform: scaleX(0);
          transform: scaleX(0);
}
.product-wrap-2 .product-img .product-action-2 a:hover {
  background-color: 000000;
}
.product-wrap-2 .product-img .product-action-2.product-action-2-red a {
  background-color: #df262b;
}
.product-wrap-2 .product-img .product-action-2.product-action-2-red a:hover {
  background-color: #000000;
}
.product-wrap-2 .product-content-2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 20px 0 0;
}
.product-wrap-2 .product-content-2 .title-price-wrap-2 h3 {
  margin: 0 0 6px;
  line-height: 1;
}
.product-wrap-2 .product-content-2 .title-price-wrap-2 h3 a {
  font-size: 16px;
  color: #000000;
}
.product-wrap-2 .product-content-2 .title-price-wrap-2 h3 a:hover {
  color: #000000;
}
.product-wrap-2 .product-content-2 .title-price-wrap-2 .price-2 span {
  font-size: 15px;
  color: #000000;
  margin-right: 17px;
  position: relative;
}
.product-wrap-2 .product-content-2 .title-price-wrap-2 .price-2 span.old {
  color: 000000;
  text-decoration: line-through;
}
.product-wrap-2 .product-content-2 .title-price-wrap-2 .price-2 span.old.red {
  color: #ff3d2a;
}
.product-wrap-2 .product-content-2 .title-price-wrap-2 .price-2 span::before {
  position: absolute;
  content: "";
  right: -13px;
  top: 10px;
  width: 6px;
  height: 2px;
  background-color: #a5a5a5;
}
.product-wrap-2 .product-content-2 .title-price-wrap-2 .price-2 span:last-child:before {
  display: none;
}
.product-wrap-2 .product-content-2 .title-price-wrap-2.title-price-wrap-2-white h3 a {
  color: #fff;
}
.product-wrap-2 .product-content-2 .title-price-wrap-2.title-price-wrap-2-white h3 a:hover {
  color: #000000;
}
.product-wrap-2 .product-content-2 .title-price-wrap-2.title-price-wrap-2-white .price-2 span {
  color: #fff;
}
.product-wrap-2 .product-content-2 .title-price-wrap-2.title-price-wrap-2-white .price-2 span.old {
  color: 000000;
  text-decoration: line-through;
}
.product-wrap-2 .product-content-2 .pro-wishlist-2 a {
  font-size: 16px;
  color: #929292;
  margin: 4px 0 0 10px;
  display: inline-block;
}
.product-wrap-2 .product-content-2 .pro-wishlist-2 a:hover {
  color: #000000;
}
.product-wrap-2:hover .hover-img {
  visibility: visible;
  opacity: 1;
  -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
          transform: translateX(0);
}
.product-wrap-2:hover .default-img {
  -webkit-transform: translateX(-100%);
      -ms-transform: translateX(-100%);
          transform: translateX(-100%);
  visibility: hidden;
}
.product-wrap-2:hover .product-action-2 a {
  -webkit-transform: scaleX(1);
      -ms-transform: scaleX(1);
          transform: scaleX(1);
}
.product-wrap-2.pro-glaucous-color .product-img span.glaucous {
  color: #3d6882;
}
.product-wrap-2.pro-glaucous-color .product-img .product-action-2 a {
  background-color: #3d6882;
}

.product-wrap-2.pro-glaucous-color .product-img .product-action-2 a:hover {
  background-color: #fff;
  color: #000;
}
.product-wrap-2.pro-glaucous-color .product-content-2 .pro-wishlist-2 a:hover {
  color: #3d6882;
}
.product-wrap-2.pro-glaucous-color .product-content-2 .title-price-wrap-2 h3 a:hover {
  color: #3d6882;
}
.product-wrap-2.pro-glaucous-color .product-content-2 .title-price-wrap-2 .price-2 span.old {
  color: #3d6882;
}
.product-wrap-2.pro-puce-color .product-img span.puce {
  color: #de3e3e;
}
.product-wrap-2.pro-puce-color .product-img .product-action-2 a {
  background-color: #de3e3e;
}
.product-wrap-2.pro-puce-color .product-img .product-action-2 a:hover {
  background-color: #fff;
  color: #000;
}
.product-wrap-2.pro-puce-color .product-content-2 .pro-wishlist-2 a:hover {
  color: #de3e3e;
}
.product-wrap-2.pro-puce-color .product-content-2 .title-price-wrap-2 h3 a:hover {
  color: #de3e3e;
}
.product-wrap-2.pro-puce-color .product-content-2 .title-price-wrap-2 .price-2 span.old {
  color: #de3e3e;
}

/* product hm3 */
.section-padding-1 .container-fluid {
  padding: 0 70px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .section-padding-1 .container-fluid {
    padding: 0 15px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .section-padding-1 .container-fluid {
    padding: 0 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .section-padding-1 .container-fluid {
    padding: 0 40px;
  }
}
@media only screen and (max-width: 767px) {
  .section-padding-1 .container-fluid {
    padding: 0 15px;
  }
}

/* product hm4 */
.hm4-section-padding .container-fluid {
  padding: 0 70px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .hm4-section-padding .container-fluid {
    padding: 0 60px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .hm4-section-padding .container-fluid {
    padding: 0 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .hm4-section-padding .container-fluid {
    padding: 0 15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hm4-section-padding .container-fluid {
    padding: 0 30px;
  }
}
@media only screen and (max-width: 767px) {
  .hm4-section-padding .container-fluid {
    padding: 0 15px;
  }
}

.toggle-item-active,
.toggle-item-active2,
.toggle-item-active3,
.toggle-item-active4,
.toggle-item-active5,
.toggle-item-active6 {
  display: none;
}

.view-more {
  display: block;
  text-align: center;
  width: 100%;
}
.view-more a {
  color: #555;
  font-weight: 500;
  display: inline-block;
  border-bottom: 1px solid #cccccc;
  line-height: 1;
  padding-bottom: 2px;
  text-align: center;
}
.view-more a:hover {
  color: #000000;
  border-bottom: 1px solid #000000;
}
@media only screen and (max-width: 767px) {
  .view-more.mt-20 {
    margin-top: 0;
  }
}

/* product hm5 */
.hm5-section-padding .container-fluid {
  padding-right: 0px;
  padding-left: 0px;
}
@media only screen and (max-width: 767px) {
  .hm5-section-padding .container-fluid {
    padding-right: 15px;
    padding-left: 15px;
  }
}
.hm5-section-padding .row {
  margin-right: -10px;
  margin-left: -10px;
}
@media only screen and (max-width: 767px) {
  .hm5-section-padding .row {
    margin-right: -15px;
    margin-left: -15px;
  }
}
.hm5-section-padding div[class^=col-] {
  padding-left: 10px;
  padding-right: 10px;
}
@media only screen and (max-width: 767px) {
  .hm5-section-padding div[class^=col-] {
    padding-left: 15px;
    padding-right: 15px;
  }
}

.product-wrap-3 {
  position: relative;
}
.product-wrap-3 .product-img {
  position: relative;
}
.product-wrap-3 .product-img a img {
  width: 100%;
}
.product-wrap-3 .product-img > span {
  position: absolute;
  top: 12px;
  right: 12px;
  font-size: 13px;
  color: #fff;
  display: inline-block;
  line-height: 1;
  padding: 3px 11px;
  border-radius: 3px;
  font-weight: 500;
  z-index: 99;
}
.product-wrap-3 .product-img > span.pink {
  background-color: 000000;
}
.product-wrap-3 .product-img > span.purple {
  background-color: #000000;
}
.product-wrap-3 .product-content-3-wrap {
  background: rgba(255, 255, 255, 0.9) none repeat scroll 0 0;
  opacity: 0;
  visibility: hidden;
  position: absolute;
  width: 90%;
  height: 90%;
  left: 5%;
  right: 5%;
  bottom: 5%;
  top: 5%;
  -webkit-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
  z-index: 8;
  -webkit-transform: scale(0.85);
      -ms-transform: scale(0.85);
          transform: scale(0.85);
}
.product-wrap-3 .product-content-3-wrap .product-content-3 {
  left: 50%;
  position: absolute;
  text-align: center;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 100%;
  -webkit-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
}
.product-wrap-3 .product-content-3-wrap .product-content-3 .product-title h3 {
  font-size: 18px;
  margin: 0;
  line-height: 1;
}
.product-wrap-3 .product-content-3-wrap .product-content-3 .price-3 {
  margin: 10px 0 20px;
}
.product-wrap-3 .product-content-3-wrap .product-content-3 .price-3 span {
  font-size: 16px;
  color: #000;
  font-weight: 500;
  margin: 0 9px;
  position: relative;
}
.product-wrap-3 .product-content-3-wrap .product-content-3 .price-3 span::before {
  position: absolute;
  content: "";
  right: -13px;
  top: 10px;
  width: 7px;
  height: 2px;
  background-color: #000;
}
.product-wrap-3 .product-content-3-wrap .product-content-3 .price-3 span:last-child::before {
  display: none;
}
.product-wrap-3 .product-content-3-wrap .product-content-3 .price-3 span.old {
  color: #8e8e8e;
  text-decoration: line-through;
}
.product-wrap-3 .product-content-3-wrap .product-content-3 .product-action-3 a {
  display: inline-block;
  line-height: 1;
  width: 42px;
  height: 42px;
  line-height: 42px;
  font-size: 16px;
  background-color: #000000;
  color: #fff;
  text-align: center;
  border-radius: 50px;
  margin: 0 3px;
  -webkit-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
.product-wrap-3 .product-content-3-wrap .product-content-3 .product-action-3 a:hover {
  background-color: 000000;
}
.product-wrap-3:hover .product-content-3-wrap {
  opacity: 1;
  visibility: visible;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}

/* product hm6 */
.hm6-section-padding .container-fluid {
  padding-right: 70px;
  padding-left: 70px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .hm6-section-padding .container-fluid {
    padding-right: 15px;
    padding-left: 15px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .hm6-section-padding .container-fluid {
    padding-right: 30px;
    padding-left: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hm6-section-padding .container-fluid {
    padding-right: 40px;
    padding-left: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .hm6-section-padding .container-fluid {
    padding-right: 15px;
    padding-left: 15px;
  }
}
.hm6-section-padding .row {
  margin-right: -10px;
  margin-left: -10px;
}
@media only screen and (max-width: 767px) {
  .hm6-section-padding .row {
    margin-right: -15px;
    margin-left: -15px;
  }
}
.hm6-section-padding div[class^=col-] {
  padding-left: 10px;
  padding-right: 10px;
}
@media only screen and (max-width: 767px) {
  .hm6-section-padding div[class^=col-] {
    padding-left: 15px;
    padding-right: 15px;
  }
}

.product-wrap-4 {
  position: relative;
  overflow: hidden;
}
.product-wrap-4 a img {
  width: 100%;
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}
.product-wrap-4 .position-1 {
  position: absolute;
  left: 0;
  right: 0;
  text-align: center;
  bottom: 75px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .product-wrap-4 .position-1 {
    bottom: 40px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .product-wrap-4 .position-1 {
    bottom: 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .product-wrap-4 .position-1 {
    bottom: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-wrap-4 .position-1 {
    bottom: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .product-wrap-4 .position-1 {
    bottom: 30px;
  }
}
.product-wrap-4 .position-2 {
  position: absolute;
  left: 60px;
  bottom: 55px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .product-wrap-4 .position-2 {
    bottom: 40px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .product-wrap-4 .position-2 {
    bottom: 40px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .product-wrap-4 .position-2 {
    bottom: 30px;
    left: 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-wrap-4 .position-2 {
    bottom: 30px;
    left: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .product-wrap-4 .position-2 {
    bottom: 30px;
    left: 20px;
  }
}
.product-wrap-4 .position-3 {
  position: absolute;
  top: 51px;
  left: 0;
  right: 0;
  text-align: center;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .product-wrap-4 .position-3 {
    top: 32px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .product-wrap-4 .position-3 {
    top: 32px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .product-wrap-4 .position-3 {
    top: 22px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-wrap-4 .position-3 {
    top: 22px;
  }
}
@media only screen and (max-width: 767px) {
  .product-wrap-4 .position-3 {
    top: 22px;
  }
}
.product-wrap-4 .product-content-4 h4 {
  font-size: 30px;
  margin: 0 0 12px;
  line-height: 38px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .product-wrap-4 .product-content-4 h4 {
    font-size: 25px;
    line-height: 30px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .product-wrap-4 .product-content-4 h4 {
    font-size: 25px;
    line-height: 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .product-wrap-4 .product-content-4 h4 {
    font-size: 22px;
    line-height: 27px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-wrap-4 .product-content-4 h4 {
    font-size: 20px;
    line-height: 23px;
  }
}
@media only screen and (max-width: 767px) {
  .product-wrap-4 .product-content-4 h4 {
    font-size: 20px;
    line-height: 23px;
  }
}
.product-wrap-4 .product-content-4 .price-4 span {
  font-size: 18px;
  color: #000000;
  position: relative;
  margin: 0 24px 0 0;
}
.product-wrap-4 .product-content-4 .price-4 span:before {
  position: absolute;
  content: "";
  right: -17px;
  top: 12px;
  width: 7px;
  height: 2px;
  background-color: #6b6264;
}
.product-wrap-4 .product-content-4 .price-4 span:last-child:before {
  display: none;
}
.product-wrap-4 .product-content-4 .price-4 span.old {
  color: 000000;
  text-decoration: line-through;
}
.product-wrap-4 .product-content-4 .price-4.price-4-center span {
  margin: 0 12px;
}
.product-wrap-4:hover a img {
  -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
          transform: scale(1.1);
}

.width-50-percent {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
  max-width: 50%;
}

.width-30-percent {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 30%;
          flex: 0 0 30%;
  max-width: 30%;
}

/* product home 8*/
.collection-product .collection-img {
  overflow: hidden;
}
.collection-product .collection-img a img {
  width: 100%;
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}
.collection-product .collection-content {
  margin: 23px 0 0;
}
.collection-product .collection-content span {
  font-weight: 500;
}
.collection-product .collection-content h4 {
  margin: 1px 0 0;
}
.collection-product .collection-content h4 a {
  font-size: 16px;
  color: #000000;
  font-weight: 500;
}
.collection-product .collection-content h4 a:hover {
  color: #000000;
}
.collection-product .collection-content .collection-btn {
  margin: 32px 0 0;
}
.collection-product .collection-content .collection-btn a {
  display: inline-block;
  line-height: 1;
  color: #010101;
  border: 1px solid #000;
  border-radius: 50px;
  padding: 10px 22px;
  z-index: 2;
}
.collection-product .collection-content .collection-btn a:hover {
  color: #fff;
  border: 1px solid #000000;
}
.collection-product:hover a img {
  -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
          transform: scale(1.1);
}

.product-wrap-5 {
  position: relative;
}
.product-wrap-5 .product-img {
  position: relative;
}
.product-wrap-5 .product-img a img {
  width: 100%;
}
.product-wrap-5 .product-img span {
  position: absolute;
  top: 12px;
  right: 12px;
  font-size: 13px;
  color: #fff;
  display: inline-block;
  line-height: 1;
  padding: 3px 11px;
  border-radius: 3px;
  font-weight: 500;
}
.product-wrap-5 .product-img span.purple {
  background-color: #000000;
}
.product-wrap-5 .product-img span.pink {
  background-color: 000000;
}
.product-wrap-5 .product-action-4 {
  background: none repeat scroll 0 0 #000000;
  bottom: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  left: 0;
  opacity: 1;
  padding: 10px;
  position: absolute;
  text-align: center;
  -webkit-transform: scaleY(0);
      -ms-transform: scaleY(0);
          transform: scaleY(0);
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  width: 100%;
  z-index: 99;
}
.product-wrap-5 .product-action-4 .pro-same-action {
  margin: 0 2px;
}
.product-wrap-5 .product-action-4 .pro-same-action a {
  display: inline-block;
  line-height: 1;
  width: 35px;
  height: 35px;
  line-height: 36px;
  font-size: 16px;
  background-color: #fff;
  color: #000;
  text-align: center;
  border-radius: 50px;
  margin: 0 3px;
}
.product-wrap-5 .product-action-4 .pro-same-action a:hover {
  background-color: 000000;
  color: #fff;
}
.product-wrap-5 .product-content-5 {
  margin-top: 28px;
}
.product-wrap-5 .product-content-5 h3 {
  font-size: 16px;
  margin: 0 0 5px;
  line-height: 17px;
}
.product-wrap-5 .product-content-5 h3 a {
  color: #000;
}
.product-wrap-5 .product-content-5 h3 a:hover {
  color: #000000;
}
.product-wrap-5 .product-content-5 .price-5 span {
  font-size: 15px;
  color: #000000;
  margin: 0 8px;
  position: relative;
}
.product-wrap-5 .product-content-5 .price-5 span:before {
  position: absolute;
  content: "";
  right: -13px;
  top: 10px;
  width: 6px;
  height: 2px;
  background-color: #a5a5a5;
}
.product-wrap-5 .product-content-5 .price-5 span:last-child:before {
  display: none;
}
.product-wrap-5 .product-content-5 .price-5 span.old {
  color: 000000;
  text-decoration: line-through;
}
.product-wrap-5:hover .product-action-4 {
  opacity: 1;
  -webkit-transform: scaleY(1);
      -ms-transform: scaleY(1);
          transform: scaleY(1);
}

/* product home 9*/
.collection-wrap-2 {
  margin-top: -175px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .collection-wrap-2 {
    margin-top: -97px;
  }
}
@media only screen and (max-width: 767px) {
  .collection-wrap-2 {
    margin-top: -80px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .collection-wrap-2 {
    margin-top: -70px;
  }
}

.collection-product-2 {
  position: relative;
  overflow: hidden;
}
.collection-product-2 a img {
  width: 100%;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
}
.collection-product-2 .collection-content-2 {
  position: absolute;
  left: 0;
  right: 0;
  text-align: center;
  bottom: 30px;
}
.collection-product-2 .collection-content-2 span {
  font-size: 14px;
  font-weight: 500;
}
.collection-product-2 .collection-content-2 h4 {
  font-size: 16px;
  font-weight: 500;
  margin: 5px 0 0;
  line-height: 21px;
}
.collection-product-2:hover a img {
  -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
          transform: scale(1.1);
}

/* product hm9 */
.hm9-section-padding .container-fluid {
  padding-right: 70px;
  padding-left: 70px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .hm9-section-padding .container-fluid {
    padding-right: 15px;
    padding-left: 15px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .hm9-section-padding .container-fluid {
    padding-right: 30px;
    padding-left: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hm9-section-padding .container-fluid {
    padding-right: 40px;
    padding-left: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .hm9-section-padding .container-fluid {
    padding-right: 15px;
    padding-left: 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .hm9-section-padding .container-fluid {
    padding-right: 30px;
    padding-left: 30px;
  }
}
.hm9-section-padding .custom-row-4 {
  margin-right: -10px;
  margin-left: -10px;
}
@media only screen and (max-width: 767px) {
  .hm9-section-padding .custom-row-4 {
    margin-right: -15px;
    margin-left: -15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .hm9-section-padding .custom-row-4 {
    margin-right: -10px;
    margin-left: -10px;
  }
}
.hm9-section-padding div[class^=custom2-] {
  padding-left: 10px;
  padding-right: 10px;
}
@media only screen and (max-width: 767px) {
  .hm9-section-padding div[class^=custom2-] {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .hm9-section-padding div[class^=custom2-] {
    padding-left: 10px;
    padding-right: 10px;
  }
}

.custom-row-4 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.custom2-col-5 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 20%;
          flex: 0 0 20%;
  max-width: 20%;
  position: relative;
  width: 100%;
  min-height: 1px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .custom2-col-5 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
            flex: 0 0 25%;
    max-width: 25%;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .custom2-col-5 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 33.333%;
            flex: 0 0 33.333%;
    max-width: 33.333%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .custom2-col-5 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%;
  }
}
@media only screen and (max-width: 767px) {
  .custom2-col-5 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .custom2-col-5 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%;
  }
}

/*------- home 14 ----------*/
.product-top-bar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media only screen and (max-width: 767px) {
  .product-top-bar {
    display: block;
    -webkit-box-pack: inherit;
        -ms-flex-pack: inherit;
            justify-content: inherit;
    text-align: center;
  }
  .product-top-bar.mb-50 {
    margin-bottom: 20px;
  }
}

.product-tab-list-3 {
  margin: 4px 0 0;
  position: relative;
  z-index: 99;
}
@media only screen and (max-width: 767px) {
  .product-tab-list-3 {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin: 15px 0 0;
  }
}
.product-tab-list-3 a {
  margin-left: 24px;
}
.product-tab-list-3 a.active h4 {
  color: #242424;
}
.product-tab-list-3 a:first-child {
  margin-left: 45px;
}
@media only screen and (max-width: 767px) {
  .product-tab-list-3 a:first-child {
    margin-left: 0px;
  }
}
.product-tab-list-3 a h4 {
  font-size: 14px;
  color: #878787;
  margin: 0;
  line-height: 1;
}

.product-tab-list-4 {
  margin: 4px 0 0;
  position: relative;
  z-index: 99;
}
@media only screen and (max-width: 767px) {
  .product-tab-list-4 {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin: 15px 0 0;
  }
}
.product-tab-list-4 a {
  margin-left: 47px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-tab-list-4 a {
    margin-left: 15px;
  }
}
@media only screen and (max-width: 767px) {
  .product-tab-list-4 a {
    margin-left: 14px;
    margin-bottom: 10px;
  }
}
.product-tab-list-4 a.active h4 {
  color: #242424;
}
.product-tab-list-4 a:first-child {
  margin-left: 0px;
}
.product-tab-list-4 a h4 {
  font-size: 16px;
  color: #808080;
  margin: 0;
  line-height: 1;
}

.product-slider-active.owl-carousel .owl-nav {
  position: absolute;
  right: 0;
  top: -85px;
}
@media only screen and (max-width: 767px) {
  .product-slider-active.owl-carousel .owl-nav {
    right: 0;
    left: 0;
    top: -45px;
    text-align: center;
  }
}
.product-slider-active.owl-carousel .owl-nav button {
  display: inline-block;
  width: 35px;
  height: 35px;
  font-size: 18px;
  line-height: 31px;
  text-align: center;
  border-radius: 5px;
  color: #c6c6c6;
  border: 1px solid #d2d2d2;
  background-color: #f9f9f9;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
@media only screen and (max-width: 767px) {
  .product-slider-active.owl-carousel .owl-nav button {
    width: 25px;
    height: 25px;
    font-size: 15px;
    line-height: 23px;
  }
}
.product-slider-active.owl-carousel .owl-nav button:hover {
  color: #fff;
  border: 1px solid #ff3d2a;
  background-color: #ff3d2a;
}
.product-slider-active.owl-carousel .owl-nav button.owl-next {
  margin-left: 3px;
}

.pro-view-more {
  margin-top: 30px;
}
@media only screen and (max-width: 767px) {
  .pro-view-more {
    margin-top: 0px;
  }
}
.pro-view-more a {
  display: inline-block;
  font-size: 16px;
  color: #828282;
  text-transform: uppercase;
  line-height: 1;
  padding: 20px 35px 19px;
  border: 1px solid #d2d2d2;
}
.pro-view-more a i {
  margin-right: 10px;
}
.pro-view-more a:hover {
  background-color: #df262b;
  color: #fff;
  border: 1px solid #df262b;
}
.pro-view-more.view-more-radious a {
  border-radius: 50px;
}

.bg-png-1 {
  position: absolute;
  top: 0;
  left: 78px;
}
@media only screen and (max-width: 767px) {
  .bg-png-1 {
    display: none;
  }
}

.funfact-area {
  position: relative;
}

.bg-png-2 {
  position: absolute;
  top: 0;
  right: 550px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .bg-png-2 {
    right: 300px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .bg-png-2 {
    right: 250px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .bg-png-2 {
    right: 150px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .bg-png-2 {
    right: 120px;
  }
}
@media only screen and (max-width: 767px) {
  .bg-png-2 {
    display: none;
  }
}

.discover-more-btn a {
  display: inline-block;
  font-size: 16px;
  color: #fff;
  text-transform: uppercase;
  background-color: #c61a32;
  border-radius: 50px;
  line-height: 1;
  z-index: 2;
  padding: 17px 35px;
}

.product-tab-list-5 {
  width: 100%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.product-tab-list-5 a {
  font-size: 16px;
  color: #000000;
  display: inline-block;
  line-height: 1;
  margin: 0 20px;
  padding: 0 0 7px;
  border-bottom: 2px solid transparent;
}
@media only screen and (max-width: 767px) {
  .product-tab-list-5 a {
    font-size: 16px;
    margin: 0 6px;
  }
}
.product-tab-list-5 a.active {
  color: #59a3e1;
  border-bottom: 2px solid #59a3e1;
}
@media only screen and (max-width: 767px) {
  .product-tab-list-5.mb-60 {
    margin-bottom: 25px;
  }
}

.nav-style-5.owl-carousel .owl-nav button {
  color: #fff;
  display: inline-block;
  font-size: 17px;
  left: -65px;
  opacity: 0;
  visibility: hidden;
  position: absolute;
  text-align: center;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
  width: 27px;
  height: 40px;
  line-height: 40px;
  background-color: #000000;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .nav-style-5.owl-carousel .owl-nav button {
    left: 0px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .nav-style-5.owl-carousel .owl-nav button {
    left: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .nav-style-5.owl-carousel .owl-nav button {
    left: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .nav-style-5.owl-carousel .owl-nav button {
    left: 0px;
  }
}
.nav-style-5.owl-carousel .owl-nav button.owl-next {
  left: auto;
  right: -65px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .nav-style-5.owl-carousel .owl-nav button.owl-next {
    right: 0px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .nav-style-5.owl-carousel .owl-nav button.owl-next {
    right: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .nav-style-5.owl-carousel .owl-nav button.owl-next {
    right: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .nav-style-5.owl-carousel .owl-nav button.owl-next {
    right: 0px;
  }
}
.nav-style-5.owl-carousel .owl-nav button:hover {
  background-color: #59a3e1;
}
.nav-style-5.owl-carousel:hover .owl-nav button {
  opacity: 1;
  visibility: visible;
}

@media only screen and (max-width: 767px) {
  .collections-area.pb-100 {
    padding-bottom: 60px;
  }
}
.blog-wrap .blog-img {
  position: relative;
  overflow: hidden;
}
.blog-wrap .blog-img img {
  width: 100%;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
}
.blog-wrap .blog-img span {
  position: absolute;
  top: 10px;
  left: 10px;
  display: block;
  line-height: 1;
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  padding: 2px 10px 5px;
}
.blog-wrap .blog-img span.pink {
  background-color: 000000;
}
.blog-wrap .blog-img span.purple {
  background-color: #000000;
}
.blog-wrap .blog-img span.red {
  background-color: #c61a32;
  left: auto;
  right: 10px;
  border-radius: 3px;
}
.blog-wrap .blog-content-wrap {
  text-align: center;
}
.blog-wrap .blog-content-wrap .blog-content {
  display: inline-block;
  background-color: #fff;
  padding: 14px 44px;
  margin: -64px 0 0;
  z-index: 99;
  position: relative;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog-wrap .blog-content-wrap .blog-content {
    padding: 14px 30px;
    margin: -50px 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .blog-wrap .blog-content-wrap .blog-content {
    padding: 14px 30px;
    margin: -50px 0 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .blog-wrap .blog-content-wrap .blog-content {
    padding: 14px 15px;
  }
}
.blog-wrap .blog-content-wrap .blog-content h3 {
  font-size: 20px;
  font-weight: 500;
  line-height: 30px;
  margin: 0 0 5px;
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .blog-wrap .blog-content-wrap .blog-content h3 {
    font-size: 18px;
    line-height: 27px;
  }
}
.blog-wrap .blog-content-wrap .blog-content span {
  color: #666;
  font-style: italic;
}
.blog-wrap .blog-content-wrap .blog-content span a {
  color: #666;
}
.blog-wrap .blog-content-wrap .blog-content span a:hover {
  color: #000000;
}
.blog-wrap .blog-content-3 {
  background-color: #f6f3f3;
  padding: 25px 42px 27px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog-wrap .blog-content-3 {
    padding: 25px 15px 27px;
  }
}
@media only screen and (max-width: 767px) {
  .blog-wrap .blog-content-3 {
    padding: 25px 15px 27px;
  }
}
.blog-wrap .blog-content-3 h3 {
  font-size: 20px;
  font-weight: 500;
  margin: 0 0 7px;
  line-height: 30px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog-wrap .blog-content-3 h3 {
    font-size: 18px;
  }
}
@media only screen and (max-width: 767px) {
  .blog-wrap .blog-content-3 h3 {
    font-size: 18px;
  }
}
.blog-wrap .blog-content-3 h3 a {
  color: #000000;
}
.blog-wrap .blog-content-3 h3 a:hover {
  color: #000000;
}
.blog-wrap .blog-content-3 span {
  color: #000000;
  font-style: italic;
}
.blog-wrap .blog-content-3 span a {
  color: #b0afaf;
}
.blog-wrap .blog-content-3 span a:hover {
  color: #000000;
}
.blog-wrap:hover .blog-img img {
  -webkit-transform: scale(1.2);
      -ms-transform: scale(1.2);
          transform: scale(1.2);
}

/* blog page */
.blog-wrap-2 {
  -webkit-box-shadow: 0 3px 5px rgba(85, 85, 85, 0.2);
          box-shadow: 0 3px 5px rgba(85, 85, 85, 0.2);
}
.blog-wrap-2 .blog-img-2 {
  overflow: hidden;
  position: relative;
}
.blog-wrap-2 .blog-img-2 a img {
  width: 100%;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
}
.blog-wrap-2 .blog-img-2 .video-icon {
  left: 0;
  position: absolute;
  right: 0;
  text-align: center;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}
.blog-wrap-2 .blog-img-2 .video-icon a {
  background-color: #ff0000;
  border-radius: 50px;
  color: #fff;
  display: inline-block;
  font-size: 25px;
  height: 60px;
  line-height: 61px;
  width: 60px;
}
.blog-wrap-2 .blog-img-2 .video-icon a:hover {
  background-color: #000000;
}
.blog-wrap-2 .blog-content-2 {
  padding: 25px 30px 34px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog-wrap-2 .blog-content-2 {
    padding: 25px 20px 34px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-wrap-2 .blog-content-2 {
    padding: 25px 20px 34px;
  }
}
@media only screen and (max-width: 767px) {
  .blog-wrap-2 .blog-content-2 {
    padding: 20px 15px 29px;
  }
}
.blog-wrap-2 .blog-content-2 .blog-meta-2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.blog-wrap-2 .blog-content-2 .blog-meta-2 ul li {
  color: #333;
  display: inline-block;
  font-size: 14px;
  letter-spacing: 1px;
  list-style: outside none none;
  margin: 0 17px 0 0;
  position: relative;
  text-transform: uppercase;
  display: inline-block;
  line-height: 1;
}
.blog-wrap-2 .blog-content-2 .blog-meta-2 ul li::before {
  background-color: #555;
  content: "";
  height: 2px;
  position: absolute;
  right: -13px;
  top: 6px;
  -webkit-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
  width: 5px;
}
.blog-wrap-2 .blog-content-2 .blog-meta-2 ul li:last-child::before {
  display: none;
}
.blog-wrap-2 .blog-content-2 .blog-meta-2 ul li a {
  color: #555;
}
.blog-wrap-2 .blog-content-2 .blog-meta-2 ul li a:hover {
  color: #000000;
}
.blog-wrap-2 .blog-content-2 h4 {
  font-size: 22px;
  font-weight: 500;
  margin: 10px 0 20px;
  color: #333;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog-wrap-2 .blog-content-2 h4 {
    font-size: 19px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-wrap-2 .blog-content-2 h4 {
    font-size: 19px;
  }
}
@media only screen and (max-width: 767px) {
  .blog-wrap-2 .blog-content-2 h4 {
    font-size: 17px;
    margin: 10px 0 12px;
  }
}
.blog-wrap-2 .blog-content-2 h4 a {
  color: #333;
}
.blog-wrap-2 .blog-content-2 h4 a:hover {
  color: #000000;
}
.blog-wrap-2 .blog-content-2 p {
  margin: 0;
  color: #666;
}
.blog-wrap-2 .blog-content-2 .blog-share-comment {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 22px 0 0;
}
@media only screen and (max-width: 767px) {
  .blog-wrap-2 .blog-content-2 .blog-share-comment {
    margin: 14px 0 0;
  }
}
.blog-wrap-2 .blog-content-2 .blog-share-comment .blog-btn-2 a {
  color: #333;
  display: inline-block;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.2px;
  margin-top: 4px;
  text-transform: capitalize;
}
.blog-wrap-2 .blog-content-2 .blog-share-comment .blog-btn-2 a:hover {
  color: #000000;
}
.blog-wrap-2 .blog-content-2 .blog-share-comment .blog-share span {
  color: #333;
  display: inline-block;
  float: left;
  font-size: 15px;
  margin-right: 12px;
  margin-top: 3px;
  text-transform: capitalize;
}
.blog-wrap-2 .blog-content-2 .blog-share-comment .blog-share .share-social {
  display: inline-block;
  float: left;
}
@media only screen and (max-width: 767px) {
  .blog-wrap-2 .blog-content-2 .blog-share-comment .blog-share .share-social {
    margin-top: 4px;
  }
}
.blog-wrap-2 .blog-content-2 .blog-share-comment .blog-share .share-social ul li {
  display: inline-block;
  margin-right: 5px;
}
.blog-wrap-2 .blog-content-2 .blog-share-comment .blog-share .share-social ul li:last-child {
  margin-right: 0;
}
.blog-wrap-2 .blog-content-2 .blog-share-comment .blog-share .share-social ul li a {
  border-radius: 50px;
  color: #fff;
  display: inline-block;
  font-size: 14px;
  height: 30px;
  line-height: 28px;
  text-align: center;
  width: 30px;
}
@media only screen and (max-width: 767px) {
  .blog-wrap-2 .blog-content-2 .blog-share-comment .blog-share .share-social ul li a {
    font-size: 12px;
    height: 25px;
    line-height: 23px;
    width: 25px;
  }
}
.blog-wrap-2 .blog-content-2 .blog-share-comment .blog-share .share-social ul li a.facebook {
  background-color: #3b5998;
  border: 1px solid #3b5998;
}
.blog-wrap-2 .blog-content-2 .blog-share-comment .blog-share .share-social ul li a.facebook:hover {
  background-color: transparent;
  color: #3b5998;
}
.blog-wrap-2 .blog-content-2 .blog-share-comment .blog-share .share-social ul li a.twitter {
  background-color: #55acee;
  border: 1px solid #55acee;
}
.blog-wrap-2 .blog-content-2 .blog-share-comment .blog-share .share-social ul li a.twitter:hover {
  background-color: transparent;
  color: #55acee;
}
.blog-wrap-2 .blog-content-2 .blog-share-comment .blog-share .share-social ul li a.instagram {
  background-color: #c32aa3;
  border: 1px solid #c32aa3;
}
.blog-wrap-2 .blog-content-2 .blog-share-comment .blog-share .share-social ul li a.instagram:hover {
  background-color: transparent;
  color: #c32aa3;
}
.blog-wrap-2:hover .blog-img-2 img {
  -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
          transform: scale(1.1);
}

.nav-style-4.owl-carousel .owl-nav button {
  color: #fff;
  display: inline-block;
  font-size: 20px;
  left: 0px;
  opacity: 0;
  visibility: hidden;
  position: absolute;
  text-align: center;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  height: 35px;
  width: 35px;
  line-height: 35px;
  background-color: #000000;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .nav-style-4.owl-carousel .owl-nav button {
    font-size: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .nav-style-4.owl-carousel .owl-nav button {
    font-size: 30px;
  }
}
.nav-style-4.owl-carousel .owl-nav button:hover {
  color: #fff;
  background-color: #333;
}
.nav-style-4.owl-carousel .owl-nav button.owl-next {
  left: auto;
  right: 0px;
}

.blog-wrap-2:hover .nav-style-4.owl-carousel .owl-nav button {
  opacity: 1;
  visibility: visible;
}

/*-------- 7. Blog style  ----------*/
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .Blog-area .ml-20 {
    margin-left: 0;
  }
  .Blog-area .mr-20 {
    margin-right: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .Blog-area .ml-20 {
    margin-left: 0;
  }
  .Blog-area .mr-20 {
    margin-right: 0;
  }
}
@media only screen and (max-width: 767px) {
  .Blog-area .ml-20 {
    margin-left: 0;
  }
  .Blog-area .mr-20 {
    margin-right: 0;
  }
  .Blog-area .pro-pagination-style.mt-20 {
    margin-top: 0;
  }
}

@media only screen and (max-width: 767px) {
  .Blog-area.pb-100 {
    padding-bottom: 45px;
  }
}
.Blog-area.blog-no-sidebar .blog-content-2 h4 {
  font-size: 20px;
}
@media only screen and (max-width: 767px) {
  .Blog-area.blog-no-sidebar .blog-content-2 h4 {
    font-size: 17px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .Blog-area.blog-no-sidebar .blog-content-2 h4 {
    font-size: 20px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .Blog-area.blog-no-sidebar .blog-content-2 .blog-share-comment .blog-share .share-social {
    margin-top: 4px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .Blog-area.blog-no-sidebar .blog-content-2 .blog-share-comment .blog-share .share-social ul li {
    margin-right: 3px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .Blog-area.blog-no-sidebar .blog-content-2 .blog-share-comment .blog-share .share-social ul li a {
    font-size: 12px;
    height: 25px;
    line-height: 23px;
    width: 25px;
  }
}

/*-------- 8. Footer style  -----*/
.copyright .footer-logo {
  margin-bottom: 12px;
  margin-top: 41px;
}
@media only screen and (max-width: 767px) {
  .copyright .footer-logo {
    margin-top: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .copyright .footer-logo {
    margin-top: 0px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .copyright .footer-logo {
    margin-top: 28px;
  }
}
.copyright p {
  color: #313131;
  letter-spacing: 0.9px;
}
.copyright p a {
  color: #313131;
}
.copyright p a:hover {
  color: #000000;
}
.copyright.copyright-white p {
  color: #fff;
}
.copyright.copyright-white p a {
  color: #fff;
}
.copyright.copyright-white p a:hover {
  color: #000000;
}

.footer-widget .footer-title h3 {
  font-size: 16px;
  font-weight: 500;
  color: #313131;
  margin: 0 0 16px;
  line-height: 1;
}
.footer-widget .footer-list ul li {
  margin: 0 0 11px;
}
.footer-widget .footer-list ul li:last-child {
  margin: 0 0 0px;
}
.footer-widget .footer-list ul li a {
  color: #5d5d5d;
  letter-spacing: 0.3px;
}
.footer-widget .footer-list ul li a:hover {
  color: #000000;
}
.footer-widget.footer-widget-white .footer-title h3 {
  color: #fff;
}
.footer-widget.footer-widget-white .footer-list ul li a {
  color: #e6e6e6;
}
.footer-widget.footer-widget-white .footer-list ul li a:hover {
  color: #000000;
}
.footer-widget .subscribe-style p {
  color: #7a7a7a;
  margin: 0 0 20px;
}
.footer-widget .subscribe-style .subscribe-form form input {
  background: transparent;
  font-size: 13px;
  color: #333;
  border: none;
  border-bottom: 2px solid #ebebeb;
  padding: 2px 10px 2px 0;
}
.footer-widget .subscribe-style .subscribe-form form .mc-news {
  display: none;
}
.footer-widget .subscribe-style .subscribe-form form .clear input {
  width: auto;
  height: auto;
  color: #313131;
  font-size: 14px;
  padding: 0 0 1px;
  line-height: 1;
  border-bottom: 2px solid #9b9b9c;
  text-transform: uppercase;
  margin: 13px 0 0;
}
.footer-widget .subscribe-style .subscribe-form form .clear input:hover {
  color: #000000;
  border-bottom: 2px solid #000000;
}
.footer-widget .subscribe-style.subscribe-style-white p {
  color: #e6e6e6;
}
.footer-widget .subscribe-style.subscribe-style-white .subscribe-form form input {
  color: #a4a4a4;
  border-bottom: 2px solid #ebebeb;
}
.footer-widget .subscribe-style.subscribe-style-white .subscribe-form form .clear input {
  color: #fff;
  border-bottom: 2px solid #b5b5b6;
}
.footer-widget .subscribe-style.subscribe-style-white .subscribe-form form .clear input:hover {
  color: #000000;
  border-bottom: 2px solid #000000;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .footer-widget.ml-95 {
    margin-left: 20px;
  }
  .footer-widget.ml-145 {
    margin-left: 50px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .footer-widget.ml-95 {
    margin-left: 0px;
  }
  .footer-widget.ml-145 {
    margin-left: 20px;
  }
  .footer-widget.ml-30 {
    margin-left: 0px;
  }
  .footer-widget.ml-ntv5 {
    margin-left: -50px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-widget.ml-95 {
    margin-left: 0px;
  }
  .footer-widget.ml-145 {
    margin-left: 0px;
  }
  .footer-widget.ml-30 {
    margin-left: 0px;
  }
  .footer-widget.ml-ntv5 {
    margin-left: 0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-widget.ml-95 {
    margin-left: 0px;
  }
  .footer-widget.ml-145 {
    margin-left: 0px;
  }
  .footer-widget.ml-30 {
    margin-left: 0px;
  }
  .footer-widget.ml-ntv5 {
    margin-left: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .footer-widget.ml-95 {
    margin-left: 0px;
  }
  .footer-widget.ml-145 {
    margin-left: 0px;
  }
  .footer-widget.ml-30 {
    margin-left: 0px;
  }
  .footer-widget.ml-ntv5 {
    margin-left: 0px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-widget.ml-30, .footer-widget.ml-50, .footer-widget.ml-75 {
    margin-left: 0;
  }
}
@media only screen and (max-width: 767px) {
  .footer-widget.ml-30, .footer-widget.ml-50, .footer-widget.ml-75 {
    margin-left: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-widget.ml-30, .footer-widget.ml-50, .footer-widget.ml-75 {
    margin-left: 0px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-widget.ml-70 {
    margin-left: -130px;
  }
}
@media only screen and (max-width: 767px) {
  .footer-widget.ml-70 {
    margin-left: 0px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .footer-widget.ml-70 {
    margin-left: -90px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-widget.ml-70 {
    margin-left: 0px;
  }
}

/* home 4 */
.hm4-footer-padding .container-fluid {
  padding: 0 60px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .hm4-footer-padding .container-fluid {
    padding: 0 60px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .hm4-footer-padding .container-fluid {
    padding: 0 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .hm4-footer-padding .container-fluid {
    padding: 0 15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .hm4-footer-padding .container-fluid {
    padding: 0 30px;
  }
}
@media only screen and (max-width: 767px) {
  .hm4-footer-padding .container-fluid {
    padding: 0 15px;
  }
}

.footer-area {
  position: relative;
}
.footer-area.ml-10 {
  margin-left: 0;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .footer-area.ml-70 {
    margin-left: 15px;
  }
  .footer-area.mr-70 {
    margin-right: 15px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .footer-area.ml-70 {
    margin-left: 30px;
  }
  .footer-area.mr-70 {
    margin-right: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-area.ml-70 {
    margin-left: 40px;
  }
  .footer-area.mr-70 {
    margin-right: 40px;
  }
  .footer-area.mb-70 {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .footer-area.ml-70 {
    margin-left: 15px;
  }
  .footer-area.mr-70 {
    margin-right: 15px;
  }
  .footer-area.mb-70 {
    margin-bottom: 15px;
  }
}

/* home 5 */
.footer-top {
  position: relative;
  z-index: 9;
}
.footer-top p {
  color: #fffefe;
  line-height: 28px;
  margin: 31px auto 33px;
  width: 55%;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .footer-top p {
    width: 85%;
  }
}
@media only screen and (max-width: 767px) {
  .footer-top p {
    width: 100%;
  }
}
.footer-top .footer-social ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.footer-top .footer-social ul li {
  margin: 0 23px;
  position: relative;
  line-height: 1;
}
.footer-top .footer-social ul li:before {
  position: absolute;
  content: "";
  right: -30px;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  background-color: #7c7b7b;
  width: 16px;
  height: 2px;
}
.footer-top .footer-social ul li:last-child:before {
  display: none;
}
.footer-top .footer-social ul li a {
  color: #e5e5e5;
  font-size: 16px;
}
.footer-top .footer-social ul li a:hover {
  color: #000000;
}
.footer-top .footer-social.footer-social-white ul li:before {
  background-color: #fff;
}
@media only screen and (max-width: 767px) {
  .footer-top.pb-60 {
    padding-bottom: 60px;
  }
}

.footer-bottom {
  position: relative;
  z-index: 9;
}

.copyright-2 {
  padding-top: 20px;
  margin-top: 60px;
  border-top: 1px solid #2b2b2b;
}
.copyright-2 p {
  color: #fff;
  line-height: 1;
}
.copyright-2 p a {
  color: #fff;
}
.copyright-2 p a:hover {
  color: #000000;
}
.copyright-2.copyright-white-border {
  border-top: 1px solid #cccccc;
}
.copyright-2.copyright-gray p {
  color: #848484;
}
.copyright-2.copyright-gray p a {
  color: #848484;
  letter-spacing: 0.9px;
}
.copyright-2.copyright-gray p a:hover {
  color: #000000;
}

.footer-white .footer-top p {
  color: #000;
}
.footer-white .footer-top .footer-social ul li a {
  color: #000;
}
.footer-white .footer-top .footer-social ul li a:hover {
  color: #000000;
}
.footer-white .copyright-2 {
  padding-top: 20px;
  padding-bottom: 23px;
  margin-top: 0px;
  border-top: none;
}

.footer-border {
  border-top: 1px solid #e2e2e2;
}

/*----- 9. Banner style  -------*/
.single-banner {
  position: relative;
  overflow: hidden;
}
.single-banner a img {
  width: 100%;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
}
.single-banner:hover img {
  -webkit-transform: scale(1.2);
      -ms-transform: scale(1.2);
          transform: scale(1.2);
}
.single-banner .banner-content {
  position: absolute;
  content: "";
  left: 36px;
  top: 40px;
  z-index: 5;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content {
    left: 20px;
    top: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content {
    left: 15px;
    top: 10px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content {
    left: 15px;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
  }
}
.single-banner .banner-content h3 {
  font-size: 36px;
  color: #915342;
  font-weight: 600;
  margin: 0;
  font-family: "Cormorant Garamond";
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content h3 {
    font-size: 27px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content h3 {
    font-size: 30px;
  }
}
.single-banner .banner-content h4 {
  font-size: 18px;
  color: #010101;
  margin: 3px 0 58px;
  font-weight: 600;
  font-family: "Cormorant Garamond";
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content h4 {
    margin: 3px 0 25px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content h4 {
    margin: 3px 0 15px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content h4 {
    margin: 3px 0 8px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content h4 {
    margin: 3px 0 20px;
  }
}
.single-banner .banner-content h4 span {
  color: #935644;
  font-size: 20px;
  margin: 0 0px 0 2px;
  display: inline-block;
  line-height: 1;
  position: relative;
  top: 2px;
}
.single-banner .banner-content a {
  width: 28px;
  height: 28px;
  border-radius: 100%;
  border: 2px solid #97584a;
  color: #97584a;
  font-size: 14px;
  display: inline-block;
  text-align: center;
}
.single-banner .banner-content a.kids-btn-red {
  color: #ff3d2a;
  border: 2px solid #ff3d2a;
}
.single-banner .banner-content a.kids-btn-red:hover {
  color: #000000;
  border: 2px solid #000000;
}
.single-banner .banner-content a i {
  line-height: 25px;
}
.single-banner .banner-content a:hover {
  color: #000000;
  border: 2px solid #000000;
}
.single-banner .banner-content.banner-pink a {
  border: 2px solid #000000;
  color: #000000;
}
.single-banner .banner-content.banner-pink a:hover {
  color: #000000;
  border: 2px solid #000000;
}
.single-banner .banner-content.banner-content1-modify-position1 {
  left: auto;
  right: 60px;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  text-align: right;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content.banner-content1-modify-position1 {
    right: 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content.banner-content1-modify-position1 {
    right: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content.banner-content1-modify-position1 {
    right: 30px;
  }
}
.single-banner .banner-content.banner-content1-modify h3 {
  color: #1c1c1c;
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content.banner-content1-modify h3 {
    font-size: 25px;
  }
}
.single-banner .banner-content.banner-content1-modify h4 {
  margin: 12px 0 68px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .single-banner .banner-content.banner-content1-modify h4 {
    margin: 12px 0 38px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content.banner-content1-modify h4 {
    margin: 12px 0 28px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content.banner-content1-modify h4 {
    margin: 2px 0 12px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content.banner-content1-modify h4 {
    margin: 2px 0 6px;
  }
}
.single-banner .banner-content.banner-content1-modify a {
  border: 2px solid #c61a32;
  color: #c61a32;
}
.single-banner .banner-content.banner-content1-modify a.purple {
  color: #ab87cd;
  border: 2px solid #ab87cd;
}
.single-banner .banner-content.banner-content1-modify a.cake-btn-pink {
  color: #000000;
  border: 2px solid #000000;
}
.single-banner .banner-content.banner-content1-modify a.cake-btn-pink:hover {
  color: #000000;
  border: 2px solid #000000;
}
.single-banner .banner-content.banner-content1-modify a:hover {
  color: #000000;
  border: 2px solid #000000;
}
.single-banner .banner-content.banner-content1-modify-position2 {
  left: 60px;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content.banner-content1-modify-position2 {
    left: 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content.banner-content1-modify-position2 {
    left: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content.banner-content1-modify-position2 {
    left: 30px;
  }
}
.single-banner .banner-content.banner-content1-modify-position3 {
  left: 50px;
  top: 50px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .single-banner .banner-content.banner-content1-modify-position3 {
    left: 30px;
    top: 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content.banner-content1-modify-position3 {
    left: 20px;
    top: 20px;
  }
  .single-banner .banner-content.banner-content1-modify-position3 h3 {
    font-size: 27px;
  }
  .single-banner .banner-content.banner-content1-modify-position3 h4 {
    margin: 5px 0 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content.banner-content1-modify-position3 {
    left: 15px;
    top: 10px;
  }
  .single-banner .banner-content.banner-content1-modify-position3 h3 {
    font-size: 25px;
  }
  .single-banner .banner-content.banner-content1-modify-position3 h4 {
    margin: 5px 0 10px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content.banner-content1-modify-position3 {
    left: 30px;
    top: 50%;
    -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
            transform: translateY(-50%);
  }
}
.single-banner.banner-green-color .banner-content h3 {
  color: #617d05;
}
.single-banner.banner-green-color .banner-content h4 {
  color: #010101;
}
.single-banner.banner-green-color .banner-content h4 span {
  color: #617d05;
}
.single-banner.banner-green-color .banner-content a {
  border: 2px solid #617d05;
  color: #617d05;
}
.single-banner.banner-green-color .banner-content a:hover {
  color: #aabb72;
  border: 2px solid #aabb72;
}
.single-banner.banner-red-color .banner-content h3 {
  color: #df262b;
}
.single-banner.banner-red-color .banner-content h4 {
  color: #010101;
}
.single-banner.banner-red-color .banner-content h4 span {
  color: #df262b;
}
.single-banner.banner-red-color .banner-content a {
  border: 2px solid #df262b;
  color: #df262b;
}
.single-banner.banner-red-color .banner-content a:hover {
  color: #dc6266;
  border: 2px solid #dc6266;
}
.single-banner.banner-shape {
  border: 4px solid #fff;
}
.single-banner .banner-position-hm15-1 {
  position: absolute;
  right: 40px;
  top: 45px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .single-banner .banner-position-hm15-1 {
    top: 25px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-position-hm15-1 {
    top: 20px;
    right: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-position-hm15-1 {
    top: 20px;
    right: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-position-hm15-1 {
    top: 15px;
    right: 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-banner .banner-position-hm15-1 {
    top: 30px;
    right: 30px;
  }
}
.single-banner .banner-position-hm15-2 {
  position: absolute;
  left: 40px;
  top: 45px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .single-banner .banner-position-hm15-2 {
    top: 25px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-position-hm15-2 {
    top: 20px;
    left: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-position-hm15-2 {
    top: 20px;
    left: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-position-hm15-2 {
    top: 15px;
    left: 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-banner .banner-position-hm15-2 {
    top: 30px;
    left: 30px;
  }
}
.single-banner .banner-position-hm17-1 {
  position: absolute;
  right: 105px;
  bottom: 50px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-position-hm17-1 {
    right: 20px;
    bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-position-hm17-1 {
    right: 20px;
    bottom: 20px;
  }
}
.single-banner .banner-content-3 h3 {
  font-weight: bold;
  font-size: 30px;
  margin: 0;
  line-height: 1;
  color: #111111;
  text-transform: uppercase;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .single-banner .banner-content-3 h3 {
    font-size: 25px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content-3 h3 {
    font-size: 25px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-3 h3 {
    font-size: 22px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-3 h3 {
    font-size: 20px;
  }
}
.single-banner .banner-content-3 p {
  font-size: 18px;
  margin: 11px 0 20px;
  color: #010101;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .single-banner .banner-content-3 p {
    margin: 5px 0 12px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content-3 p {
    margin: 5px 0 12px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-3 p {
    margin: 5px 0 10px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-3 p {
    margin: 5px 0 10px;
  }
}
.single-banner .banner-content-3 p span {
  color: #6eab49;
}
.single-banner .banner-content-3 > a {
  width: 28px;
  height: 28px;
  border-radius: 100%;
  border: 2px solid #6eab49;
  color: #6eab49;
  font-size: 14px;
  display: inline-block;
  text-align: center;
}
.single-banner .banner-content-3 > a:hover {
  border: 2px solid #000000;
  color: #000000;
}
.single-banner .banner-content-3.pink-banner p {
  color: #010101;
}
.single-banner .banner-content-3.pink-banner p span {
  color: #000000;
}
.single-banner .banner-content-3.pink-banner > a {
  border: 2px solid #000000;
  color: #000000;
}
.single-banner .banner-content-3.pink-banner > a:hover {
  border: 2px solid #000000;
  color: #000000;
}
.single-banner .banner-content-4 span {
  font-size: 18px;
  color: #6eab49;
}
.single-banner .banner-content-4 h2 {
  font-size: 55px;
  color: #f3993f;
  font-weight: bold;
  text-transform: uppercase;
  line-height: 1;
  margin: 15px 0 15px;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .single-banner .banner-content-4 h2 {
    font-size: 40px;
    margin: 7px 0 10px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content-4 h2 {
    font-size: 35px;
    margin: 7px 0 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-4 h2 {
    font-size: 45px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-4 h2 {
    font-size: 30px;
    margin: 7px 0 10px;
  }
}
.single-banner .banner-content-4 h5 {
  font-size: 24px;
  color: #000000;
  line-height: 1;
  margin: 0 0 36px;
  letter-spacing: 4.3px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content-4 h5 {
    font-size: 20px;
    margin: 0 0 20px;
    letter-spacing: 2.3px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-4 h5 {
    font-size: 22px;
    letter-spacing: 3.3px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-4 h5 {
    font-size: 20px;
    margin: 0 0 20px;
    letter-spacing: 2.3px;
  }
}
.single-banner .banner-content-4 > a {
  font-size: 14px;
  color: #fff;
  display: inline-block;
  text-transform: uppercase;
  line-height: 1;
  padding: 13px 33px 13px;
  background-color: #6eab49;
}
.single-banner .banner-content-4 > a:hover {
  background-color: #000000;
}
.single-banner .banner-content-4.pink-banner span {
  color: #000000;
}
.single-banner .banner-content-4.pink-banner h2 {
  color: #000000;
}
.single-banner .banner-content-4.pink-banner > a {
  background-color: #000000;
}
.single-banner .banner-content-4.pink-banner > a:hover {
  background-color: #000000;
}
.single-banner .banner-content-5 {
  position: absolute;
  left: 36px;
  top: 32px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content-5 {
    left: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-5 {
    left: 15px;
    top: 15px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-5 {
    left: 15px;
    top: 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-banner .banner-content-5 {
    left: 50px;
    top: 50px;
  }
}
.single-banner .banner-content-5 span {
  font-size: 24px;
  color: #e90042;
  display: block;
  line-height: 1;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-5 span {
    font-size: 20px;
  }
}
.single-banner .banner-content-5 h3 {
  font-family: "Cormorant Garamond";
  font-size: 36px;
  margin: 9px 0 62px;
  font-weight: 600;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content-5 h3 {
    margin: 9px 0 25px;
    font-size: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-5 h3 {
    margin: 2px 0 12px;
    font-size: 25px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-5 h3 {
    margin: 9px 0 25px;
    font-size: 30px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-banner .banner-content-5 h3 {
    font-size: 36px;
    margin: 9px 0 40px;
  }
}
.single-banner .banner-content-5 a {
  width: 28px;
  height: 28px;
  border-radius: 100%;
  border: 2px solid #e90042;
  color: #e90042;
  font-size: 14px;
  display: inline-block;
  text-align: center;
}
.single-banner .banner-content-5 a:hover {
  border: 2px solid #000000;
  color: #000000;
}
.single-banner .banner-content-5.banner-content-5-white h3 {
  color: #fff;
}
.single-banner .banner-content-6 {
  position: absolute;
  left: 30px;
  bottom: 30px;
}
.single-banner .banner-content-6 a {
  font-size: 14px;
  color: #fff;
  display: inline-block;
  text-transform: uppercase;
  line-height: 1;
  padding: 13px 33px 13px;
  background-color: #e90042;
}
.single-banner .banner-content-6 a:hover {
  background-color: #000000;
}
.single-banner .banner-content-7 {
  position: absolute;
  left: 45px;
  bottom: 30px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-7 {
    left: 20px;
    bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-7 {
    left: 20px;
    bottom: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-banner .banner-content-7 {
    left: 40px;
    bottom: 40px;
  }
}
.single-banner .banner-content-7 span {
  font-size: 24px;
  font-weight: 600;
  color: #e90042;
  display: block;
  line-height: 1;
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-7 span {
    font-size: 20px;
  }
}
.single-banner .banner-content-7 h2 {
  font-size: 72px;
  font-weight: 700;
  color: #c3c1c0;
  margin: 9px 0 33px;
  line-height: 1;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content-7 h2 {
    font-size: 55px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-7 h2 {
    font-size: 40px;
    margin: 9px 0 20px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-7 h2 {
    font-size: 35px;
    margin: 9px 0 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-banner .banner-content-7 h2 {
    font-size: 42px;
    margin: 9px 0 35px;
  }
}
.single-banner .banner-content-7 > a {
  width: 28px;
  height: 28px;
  border-radius: 100%;
  border: 2px solid #e90042;
  color: #e90042;
  font-size: 14px;
  display: inline-block;
  text-align: center;
}
.single-banner .banner-content-7 > a:hover {
  border: 2px solid #000000;
  color: #000000;
}
.single-banner .banner-content-8 {
  position: absolute;
  left: 45px;
  bottom: 40px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-8 {
    left: 20px;
    bottom: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-8 {
    left: 20px;
    bottom: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-banner .banner-content-8 {
    left: 30px;
    bottom: 30px;
  }
}
.single-banner .banner-content-8 span {
  font-size: 24px;
  color: #e90042;
  display: block;
  line-height: 1;
  text-transform: uppercase;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-8 span {
    font-size: 17px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-8 span {
    font-size: 17px;
  }
}
.single-banner .banner-content-8 h2 {
  font-size: 64px;
  color: #000000;
  margin: 10px 0 4px;
  line-height: 50px;
  text-transform: uppercase;
  font-family: "Abril Fatface", cursive;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content-8 h2 {
    font-size: 55px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-8 h2 {
    font-size: 38px;
    line-height: 30px;
    margin: 5px 0 4px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-8 h2 {
    font-size: 32px;
    line-height: 30px;
    margin: 5px 0 4px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-banner .banner-content-8 h2 {
    margin: 15px 0 5px;
  }
}
.single-banner .banner-content-8 p {
  font-size: 20px;
  color: #000000;
  margin: 0px 0 48px;
  line-height: 1;
  text-transform: uppercase;
  font-family: "Abril Fatface", cursive;
  letter-spacing: 6px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-8 p {
    letter-spacing: 5px;
    font-size: 20px;
    margin: 0px 0 27px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-8 p {
    letter-spacing: 5px;
    font-size: 17px;
    margin: 0px 0 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-banner .banner-content-8 p {
    margin: 0px 0 35px;
  }
}
.single-banner .banner-content-8 > a {
  width: 28px;
  height: 28px;
  border-radius: 100%;
  border: 2px solid #e90042;
  color: #e90042;
  font-size: 14px;
  display: inline-block;
  text-align: center;
}
.single-banner .banner-content-8 > a:hover {
  border: 2px solid #000000;
  color: #000000;
}
.single-banner .banner-content-26-position1 {
  position: absolute;
  top: 60px;
  left: 60px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-26-position1 {
    top: 30px;
    left: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-26-position1 {
    top: 20px;
    left: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-banner .banner-content-26-position1 {
    top: 30px;
    left: 30px;
  }
}
.single-banner .banner-content-26-position2 {
  position: absolute;
  top: 50px;
  left: 43px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-26-position2 {
    top: 30px;
    left: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-26-position2 {
    top: 20px;
    left: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-banner .banner-content-26-position2 {
    top: 30px;
    left: 30px;
  }
}
.single-banner .banner-content-26-position3 {
  position: absolute;
  bottom: 50px;
  left: 53%;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-26-position3 {
    bottom: 30px;
    left: 45%;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-26-position3 {
    bottom: 20px;
    left: 38%;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-banner .banner-content-26-position3 {
    bottom: 30px;
    left: 60%;
  }
}
.single-banner .banner-content-26 span {
  font-size: 18px;
  color: #000000;
  display: block;
}
.single-banner .banner-content-26 h1 {
  font-size: 55px;
  color: #000000;
  font-weight: bold;
  margin: 23px 0 21px;
  text-transform: uppercase;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-26 h1 {
    font-size: 42px;
    margin: 15px 0 15px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-26 h1 {
    font-size: 42px;
    margin: 15px 0 15px;
  }
}
.single-banner .banner-content-26 p {
  font-size: 24px;
  letter-spacing: 1.8px;
  color: #fff;
  margin: 0 0 37px;
}
.single-banner .banner-content-26 .banner-cake-btn-1 a {
  display: inline-block;
  color: #ffffff;
  background-color: #000000;
  line-height: 1;
  border-radius: 50px;
  padding: 12px 33px;
  z-index: 9;
}
.single-banner .banner-content-26-2 h1 {
  font-size: 30px;
  font-weight: bold;
  text-transform: uppercase;
  color: #111111;
  line-height: 27px;
  margin: 0;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-26-2 h1 {
    font-size: 25px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-26-2 h1 {
    font-size: 20px;
  }
}
.single-banner .banner-content-26-2 h3 {
  font-size: 18px;
  color: #010101;
  margin: 10px 0 17px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner .banner-content-26-2 h3 {
    margin: 3px 0 15px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-26-2 h3 {
    margin: 3px 0 10px;
  }
}
.single-banner .banner-content-26-2 h3 span {
  color: #000000;
}
.single-banner .banner-content-26-2 .banner-cake-btn-2 a {
  width: 28px;
  height: 28px;
  border-radius: 100%;
  border: 2px solid #000000;
  color: #000000;
  font-size: 14px;
  display: inline-block;
  text-align: center;
}
.single-banner .banner-content-26-2 .banner-cake-btn-2 a:hover {
  border: 2px solid #000000;
  color: #000000;
}
.single-banner .banner-content-33 {
  position: absolute;
  left: 50px;
  top: 50px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .single-banner .banner-content-33 {
    left: 30px;
    top: 30px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .single-banner .banner-content-33 {
    left: 30px;
    top: 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content-33 {
    left: 20px;
    top: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-33 {
    left: 20px;
    top: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-banner .banner-content-33 {
    left: 30px;
    top: 50px;
  }
}
.single-banner .banner-content-33 h3 {
  font-size: 18px;
  font-weight: 600;
  margin: 0;
  line-height: 1;
}
.single-banner .banner-content-33 h2 {
  font-size: 36px;
  font-weight: bold;
  color: #3a3a3a;
  line-height: 46px;
  margin: 20px 0 0px;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .single-banner .banner-content-33 h2 {
    font-size: 27px;
    line-height: 35px;
    margin: 10px 0 0px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .single-banner .banner-content-33 h2 {
    font-size: 27px;
    line-height: 35px;
    margin: 10px 0 0px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content-33 h2 {
    font-size: 20px;
    line-height: 25px;
    margin: 6px 0 0px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-33 h2 {
    font-size: 20px;
    line-height: 25px;
    margin: 6px 0 0px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-banner .banner-content-33 h2 {
    font-size: 28px;
    line-height: 35px;
    margin: 10px 0 0px;
  }
}
.single-banner .banner-33-offer {
  position: absolute;
  left: 0;
  bottom: 0;
}
.single-banner .banner-33-offer h2 {
  color: #98bac7;
  margin: 0;
  font-size: 60px;
  line-height: 46px;
  font-weight: bold;
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .single-banner .banner-33-offer h2 {
    font-size: 48px;
    line-height: 37px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .single-banner .banner-33-offer h2 {
    font-size: 48px;
    line-height: 37px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-33-offer h2 {
    font-size: 37px;
    line-height: 28px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-33-offer h2 {
    font-size: 37px;
    line-height: 28px;
  }
}
.single-banner .banner-content-33-2-position1 {
  position: absolute;
  right: 50px;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-33-2-position1 {
    right: 20px;
  }
}
.single-banner .banner-content-33-2-position2 {
  position: absolute;
  right: 0px;
  left: 0;
  text-align: center;
  top: 6%;
}
.single-banner .banner-content-33-2-position3 {
  position: absolute;
  left: 50px;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-33-2-position3 {
    left: 20px;
  }
}
.single-banner .banner-content-33-2 h4 {
  font-size: 18px;
  color: #fff;
  font-weight: 600;
  line-height: 1;
  margin: 0;
}
.single-banner .banner-content-33-2 h2 {
  font-size: 36px;
  color: #fff;
  font-weight: bold;
  line-height: 50px;
  margin: 13px 0 14px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner .banner-content-33-2 h2 {
    font-size: 27px;
    line-height: 35px;
    margin: 10px 0 14px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner .banner-content-33-2 h2 {
    font-size: 27px;
    line-height: 33px;
    margin: 10px 0 10px;
  }
}
.single-banner .banner-content-33-2 a {
  display: inline-block;
  font-size: 18px;
  font-weight: 600;
  color: #fff;
  line-height: 1;
  letter-spacing: 0.4px;
  padding: 0 0 7px;
  border-bottom: 2px solid #fff;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.single-banner .banner-content-33-2 a:hover {
  color: #000;
  border-bottom: 2px solid #000;
}
@media only screen and (max-width: 767px) {
  .single-banner.mr-15 {
    margin-right: 0;
  }
  .single-banner.ml-15 {
    margin-left: 0;
  }
}

/* banner hm4 */
.banner-area-2 .container-fluid {
  padding-right: 10px;
  padding-left: 10px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-area-2 .container-fluid {
    padding-right: 30px;
    padding-left: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .banner-area-2 .container-fluid {
    padding-right: 15px;
    padding-left: 15px;
  }
}
@media only screen and (max-width: 767px) {
  .banner-area-2.pb-85 {
    padding-bottom: 42px;
  }
}
@media only screen and (min-width: 1366px) and (max-width: 1600px) {
  .banner-area-2.banner-area-2 .single-banner .banner-content {
    top: 15px;
    left: 15px;
  }
  .banner-area-2.banner-area-2 .single-banner .banner-content h3 {
    font-size: 25px;
  }
  .banner-area-2.banner-area-2 .single-banner .banner-content h4 {
    margin: 3px 0 10px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .banner-area-2.banner-area-2 .single-banner .banner-content {
    top: 15px;
    left: 15px;
  }
  .banner-area-2.banner-area-2 .single-banner .banner-content h3 {
    font-size: 25px;
  }
  .banner-area-2.banner-area-2 .single-banner .banner-content h4 {
    margin: 3px 0 10px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-area-2.banner-area-2 .single-banner .banner-content {
    top: 25px;
  }
  .banner-area-2.banner-area-2 .single-banner .banner-content h3 {
    font-size: 30px;
  }
  .banner-area-2.banner-area-2 .single-banner .banner-content h4 {
    margin: 3px 0 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .banner-area-2.banner-area-2.pt-10 {
    padding-top: 30px;
  }
}

/* banner hm9 */
.single-banner-2 {
  position: relative;
  overflow: hidden;
}
.single-banner-2 a img {
  width: 100%;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
}
.single-banner-2 .banner-content-2 {
  position: absolute;
  left: 40px;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}
@media only screen and (max-width: 767px) {
  .single-banner-2 .banner-content-2 {
    left: 20px;
  }
}
.single-banner-2 .banner-content-2 h3 {
  font-size: 48px;
  color: #915342;
  margin: 0;
  font-family: "Cormorant Garamond";
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner-2 .banner-content-2 h3 {
    font-size: 35px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner-2 .banner-content-2 h3 {
    font-size: 33px;
  }
}
.single-banner-2 .banner-content-2 h4 {
  font-size: 24px;
  color: #010101;
  font-weight: 500;
  font-family: "Cormorant Garamond";
  margin: 22px 0 94px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-banner-2 .banner-content-2 h4 {
    margin: 22px 0 34px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-banner-2 .banner-content-2 h4 {
    margin: 15px 0 25px;
  }
}
@media only screen and (max-width: 767px) {
  .single-banner-2 .banner-content-2 h4 {
    margin: 10px 0 20px;
  }
}
.single-banner-2 .banner-content-2 h4 span {
  color: #935644;
}
.single-banner-2 .banner-content-2 a {
  width: 28px;
  height: 28px;
  border-radius: 100%;
  border: 2px solid #97584a;
  color: #97584a;
  font-size: 14px;
  display: inline-block;
  text-align: center;
}
.single-banner-2 .banner-content-2 a:hover {
  color: #000;
  border: 2px solid #000;
}
.single-banner-2 .banner-content-2.jewellery-banner h3 {
  font-weight: 600;
}
.single-banner-2 .banner-content-2.banner-content-2-black h3 {
  color: #fff;
}
.single-banner-2 .banner-content-2.banner-content-2-black h4 {
  color: #fff;
}
.single-banner-2 .banner-content-2.banner-content-2-black h4 span {
  color: #af163b;
}
.single-banner-2 .banner-content-2.banner-content-2-black a {
  border: 2px solid #af163b;
  color: #af163b;
}
.single-banner-2 .banner-content-2.banner-content-2-black a:hover {
  color: #fff;
  border: 2px solid #fff;
}
.single-banner-2:hover a img {
  -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
          transform: scale(1.1);
}

.col-width-banner33-1 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 37%;
          flex: 0 0 37%;
  max-width: 37%;
  position: relative;
  width: 100%;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .col-width-banner33-1 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .col-width-banner33-1 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
}

.col-width-banner33-2 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 26%;
          flex: 0 0 26%;
  max-width: 0 0 26%;
  position: relative;
  width: 100%;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .col-width-banner33-2 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
}
@media only screen and (max-width: 767px) {
  .col-width-banner33-2 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
}

.medical-contact-area {
  padding: 52px 0 60px;
}

.medical-contact-text h3 {
  color: #FFFFFF;
  font-family: "Lobster", cursive;
  font-size: 29px;
  font-style: italic;
  margin: 0 0 11px;
}
@media only screen and (max-width: 767px) {
  .medical-contact-text h3 {
    margin: 0 0 7px;
  }
}
.medical-contact-text h2 {
  font-size: 30px;
  font-weight: 600;
  color: #fff;
  margin: 0;
  line-height: 1;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .medical-contact-text h2 {
    font-size: 27px;
  }
}
@media only screen and (max-width: 767px) {
  .medical-contact-text h2 {
    font-size: 27px;
  }
}
@media only screen and (max-width: 767px) {
  .medical-contact-text {
    text-align: center;
  }
}

.medical-contact-number-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
@media only screen and (max-width: 767px) {
  .medical-contact-number-wrap {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
.medical-contact-number-wrap .medical-contact-img {
  margin-right: 20px;
}
.medical-contact-number-wrap .medical-contact-number h2 {
  margin: 0;
  font-size: 30px;
  color: #fff;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .medical-contact-number-wrap .medical-contact-number h2 {
    font-size: 26px;
  }
}
@media only screen and (max-width: 767px) {
  .medical-contact-number-wrap .medical-contact-number h2 {
    font-size: 26px;
  }
}

@media only screen and (max-width: 767px) {
  .banner-area.pt-80 {
    padding-top: 60px;
  }

  .banner-area.pb-85 {
    padding-bottom: 35px;
  }

  .save-money-area .pt-100 {
    padding-top: 50px;
  }
  .save-money-area .pb-100 {
    padding-bottom: 50px;
  }

  .medical-shape-img {
    text-align: center;
    margin: 30px 0 20px;
  }
}
.save-money-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0 0 0 50px;
}
@media only screen and (max-width: 767px) {
  .save-money-content {
    display: block;
    margin: 0 20px 0 20px;
    text-align: center;
  }
}
.save-money-content h2 {
  font-size: 36px;
  color: #010101;
  font-weight: bold;
  margin: 0 50px 0 0;
  line-height: 48px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .save-money-content h2 {
    font-size: 30px;
    margin: 0 30px 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .save-money-content h2 {
    font-size: 20px;
    margin: 0 0px 20px 0;
    line-height: 30px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .save-money-content h2 {
    font-size: 25px;
    margin: 0 0px 20px 0;
    line-height: 30px;
  }
}
.save-money-content .save-money-btn a {
  display: inline-block;
  font-size: 16px;
  color: #fff;
  background-color: #000000;
  line-height: 1;
  padding: 13px 40px 15px;
}
.save-money-content .save-money-btn a:hover {
  background-color: #000000;
}

/*------ 10. Suscribe style  ------*/
.subscribe-style-2 h2 {
  font-size: 48px;
  color: #010101;
  margin: 0 0 23px;
}
@media only screen and (max-width: 767px) {
  .subscribe-style-2 h2 {
    font-size: 30px;
    margin: 0 0 12px;
  }
}
.subscribe-style-2 p {
  font-size: 16px;
  color: #696969;
  margin: 0 0 23px;
}
.subscribe-style-2 .subscribe-form-2 form input {
  background: transparent;
  border: none;
  height: 45px;
  padding: 2px 50px 2px 0;
  font-size: 14px;
  color: #333;
  border-bottom: 2px solid #e2e2e2;
}
.subscribe-style-2 .subscribe-form-2 form .mc-news {
  display: none;
}
.subscribe-style-2 .subscribe-form-2 form .mc-form {
  position: relative;
}
.subscribe-style-2 .subscribe-form-2 form .clear-2 {
  background: rgba(0, 0, 0, 0) url("../../assets/img/icon-img/suscribe.png") no-repeat scroll right 0 center;
  bottom: 0px;
  display: inline-block;
  position: absolute;
  right: 0px;
}
.subscribe-style-2 .subscribe-form-2 form .clear-2 input {
  border: medium none;
  padding: 0;
  text-indent: -99999px;
  width: 37px;
}

@media only screen and (max-width: 767px) {
  .subscribe-area-3.pb-100 {
    padding-bottom: 60px;
  }
}

.subscribe-style-3 h2 {
  font-size: 48px;
  color: #010101;
  margin: 0 0 23px;
}
@media only screen and (max-width: 767px) {
  .subscribe-style-3 h2 {
    font-size: 35px;
    margin: 0 0 12px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .subscribe-style-3 h2 {
    font-size: 40px;
  }
}
.subscribe-style-3 p {
  font-size: 16px;
  color: #696969;
  margin: 0;
  line-height: 1;
}
.subscribe-style-3 .subscribe-form-3 input {
  background: transparent;
  border: none;
  border-bottom: 2px solid #e2e2e2;
  text-align: center;
  color: #333;
  height: 46px;
}
.subscribe-style-3 .subscribe-form-3 .mc-news {
  display: none;
}
.subscribe-style-3 .subscribe-form-3 .clear-3 {
  margin-top: 40px;
}
.subscribe-style-3 .subscribe-form-3 .clear-3 input {
  width: auto;
  height: auto;
  color: #fff;
  background-color: #070508;
  line-height: 1;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 17px 55px;
  border-radius: 5px;
  border: none;
}
.subscribe-style-3 .subscribe-form-3 .clear-3 input:hover {
  background-color: #000000;
}
.subscribe-style-3 .subscribe-form-3 .clear-3.red-subscribe input {
  background-color: #df262b;
}
.subscribe-style-3 .subscribe-form-3 .clear-3.red-subscribe input:hover {
  background-color: #000000;
}
.subscribe-style-3 .subscribe-form-3 .clear-3.red-subscribe-2 input {
  background-color: #ff3d2a;
}
.subscribe-style-3 .subscribe-form-3 .clear-3.red-subscribe-2 input:hover {
  background-color: #000000;
}
.subscribe-style-3 .subscribe-form-3 .clear-3.green-subscribe input {
  background-color: #6eab49;
}
.subscribe-style-3 .subscribe-form-3 .clear-3.green-subscribe input:hover {
  background-color: #000000;
}
.subscribe-style-3 .subscribe-form-3 .clear-3.red-2-subscribe input {
  background-color: #e90042;
}
.subscribe-style-3 .subscribe-form-3 .clear-3.red-2-subscribe input:hover {
  background-color: #000000;
}
.subscribe-style-3 .subscribe-form-3 .clear-3.red-3-subscribe input {
  background-color: #c61a32;
}
.subscribe-style-3 .subscribe-form-3 .clear-3.red-3-subscribe input:hover {
  background-color: #000000;
}
.subscribe-style-3 .subscribe-form-3 .clear-3.subscribe-radious input {
  border-radius: 50px;
}
.subscribe-style-3 .subscribe-form-3 .clear-3.pink-subscribe input {
  background-color: #000000;
}
.subscribe-style-3 .subscribe-form-3 .clear-3.pink-subscribe input:hover {
  background-color: #000000;
}
.subscribe-style-3.subscribe-style-3-white h2 {
  color: #fff;
}
.subscribe-style-3.subscribe-style-3-white p {
  color: #fff;
}
.subscribe-style-3.subscribe-style-3-white .subscribe-form-3 input {
  border-bottom: 2px solid #e2e2e2;
  color: #cacaca;
}
.subscribe-style-3.subscribe-style-3-white .subscribe-form-3 .mc-news {
  display: none;
}
.subscribe-style-3.subscribe-style-3-white .subscribe-form-3 .clear-3 {
  margin-top: 40px;
}
.subscribe-style-3.subscribe-style-3-white .subscribe-form-3 .clear-3 input {
  color: #fff;
  border: none;
}
.subscribe-style-3.subscribe-style-3-white .subscribe-form-3 .clear-3 input:hover {
  background-color: #000000;
}
.subscribe-style-3.subscribe-style-3-white .subscribe-form-3 .clear-3.red-2-subscribe input {
  background-color: #e90042;
}
.subscribe-style-3.subscribe-style-3-white .subscribe-form-3 .clear-3.red-2-subscribe input:hover {
  background-color: #000000;
}

/*------- 11. About style ------ */
.welcome-content h5 {
  font-weight: 500;
  font-size: 16px;
  color: #666;
  margin: 0;
  letter-spacing: 0.3px;
}
.welcome-content h1 {
  font-size: 30px;
  font-weight: 500;
  letter-spacing: 0.3px;
  margin: 8px 0 30px;
  color: #433f3f;
  position: relative;
  display: inline-block;
  padding: 0 0 23px;
  line-height: 1;
}
.welcome-content h1:before {
  position: absolute;
  background-color: #070508;
  height: 3px;
  width: 70px;
  content: "";
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0 auto;
}
.welcome-content p {
  font-size: 16px;
  color: #4b4b4b;
  line-height: 30px;
  width: 66%;
  margin: 0 auto;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .welcome-content p {
    width: 80%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .welcome-content p {
    width: 95%;
  }
}
@media only screen and (max-width: 767px) {
  .welcome-content p {
    width: 100%;
    font-size: 15px;
  }
}

/* about page */
.single-count .count-icon i {
  font-size: 50px;
  line-height: 1;
  display: inline-block;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-count .count-icon i {
    font-size: 45px;
  }
}
@media only screen and (max-width: 767px) {
  .single-count .count-icon i {
    font-size: 45px;
  }
}
.single-count h2 {
  color: #000000;
  font-size: 40px;
  font-weight: bold;
  margin: 25px 0 12px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .single-count h2 {
    margin: 10px 0 8px;
    font-size: 35px;
  }
}
@media only screen and (max-width: 767px) {
  .single-count h2 {
    margin: 6px 0 8px;
    font-size: 35px;
  }
}
.single-count span {
  color: #333;
  font-size: 20px;
  text-transform: capitalize;
  font-weight: 500;
}

.team-wrapper {
  background-color: #f7f7f7;
}
.team-wrapper .team-img {
  position: relative;
}
.team-wrapper .team-img a img {
  width: 100%;
}
.team-wrapper .team-img .team-action {
  background: #fff none repeat scroll 0 0;
  left: 0;
  opacity: 0;
  padding: 10px;
  position: absolute;
  right: 0;
  text-align: center;
  top: 70%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  -webkit-transition: all 0.6s ease 0s;
  -o-transition: all 0.6s ease 0s;
  transition: all 0.6s ease 0s;
  width: 100%;
  z-index: 5;
}
.team-wrapper .team-img .team-action a {
  border-radius: 50px;
  color: #fff;
  display: inline-block;
  font-size: 14px;
  height: 30px;
  line-height: 28px;
  text-align: center;
  width: 30px;
  margin: 0 3px;
}
.team-wrapper .team-img .team-action a.facebook {
  border: 1px solid #3b5998;
  background-color: #3b5998;
}
.team-wrapper .team-img .team-action a.facebook:hover {
  background-color: transparent;
  color: #3b5998;
}
.team-wrapper .team-img .team-action a.twitter {
  border: 1px solid #55acee;
  background-color: #55acee;
}
.team-wrapper .team-img .team-action a.twitter:hover {
  background-color: transparent;
  color: #55acee;
}
.team-wrapper .team-img .team-action a.instagram {
  border: 1px solid #c32aa3;
  background-color: #c32aa3;
}
.team-wrapper .team-img .team-action a.instagram:hover {
  background-color: transparent;
  color: #c32aa3;
}
.team-wrapper .team-content {
  padding: 20px 10px 23px;
}
.team-wrapper .team-content h4 {
  font-size: 18px;
  font-weight: 500;
  margin: 0 0 3px;
  text-transform: capitalize;
}
.team-wrapper .team-content span {
  font-size: 15px;
  font-style: italic;
}
.team-wrapper:hover .team-action {
  top: 50%;
  opacity: 1;
}

.single-mission h3 {
  font-size: 25px;
  font-weight: 500;
  margin: 0 0 20px;
  text-transform: capitalize;
  line-height: 22px;
  color: #333;
}
@media only screen and (max-width: 767px) {
  .single-mission h3 {
    margin: 0 0 10px;
  }
}
.single-mission p {
  margin: 0;
}

@media only screen and (max-width: 767px) {
  .about-brand-logo.pb-100 {
    padding-bottom: 60px;
  }
}

/*----- 12. instagram style  -----*/
.single-instagram {
  overflow: hidden;
}
.single-instagram a img {
  width: 100%;
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}
.single-instagram:hover a img {
  -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
          transform: scale(1.1);
}

.shop-instagram-title {
  padding: 165px 20px 168px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .shop-instagram-title {
    padding: 100px 50px 100px;
  }
}
@media only screen and (max-width: 767px) {
  .shop-instagram-title {
    padding: 50px 10px 50px;
  }
}
.shop-instagram-title h2 {
  color: #010101;
  font-size: 72px;
  line-height: 57px;
  margin: 0 0 25px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .shop-instagram-title h2 {
    font-size: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .shop-instagram-title h2 {
    font-size: 30px;
    line-height: 36px;
    margin: 0 0 15px;
  }
}
.shop-instagram-title p {
  color: #010101;
  font-size: 18px;
  margin: 0 0 0px;
}
@media only screen and (max-width: 767px) {
  .shop-instagram-title p {
    font-size: 16px;
  }
}

.single-instagram-2 {
  position: relative;
}
.single-instagram-2:before {
  position: absolute;
  left: 0;
  top: 0;
  content: "";
  width: 100%;
  height: 100%;
  background-color: #000;
  opacity: 0;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  pointer-events: none;
}
.single-instagram-2 a {
  display: block;
}
.single-instagram-2 a img {
  width: 100%;
}
.single-instagram-2 .instagram-2-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
      -ms-transform: translateY(-50%) translateX(-50%);
          transform: translateY(-50%) translateX(-50%);
  z-index: 9;
}
.single-instagram-2 .instagram-2-icon a {
  display: inline-block;
  color: #fff;
  font-size: 30px;
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  -webkit-transform: scale(0);
      -ms-transform: scale(0);
          transform: scale(0);
}
.single-instagram-2 .instagram-2-icon a:hover {
  color: #e4405f;
}
.single-instagram-2:hover:before {
  opacity: 0.5;
}
.single-instagram-2:hover .instagram-2-icon a {
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}

/*----- 13. Testimonial style  ------*/
.single-testimonial p {
  line-height: 32px;
  color: #575757;
  font-size: 16px;
  font-weight: 500;
  margin: 32px 0 0px;
  font-style: italic;
}
@media only screen and (max-width: 767px) {
  .single-testimonial p {
    font-size: 15px;
  }
}
.single-testimonial .client-info {
  margin: 20px 0 0;
}
.single-testimonial .client-info i {
  font-size: 26px;
  color: #666666;
}
.single-testimonial .client-info h5 {
  font-size: 14px;
  color: #010101;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  margin: 22px 0 3px;
}
.single-testimonial .client-info span {
  font-size: 14px;
  color: #010101;
  letter-spacing: 1.5px;
}

.testimonial-active.owl-carousel .owl-item img {
  display: inline-block;
  width: auto;
}

.testimonial-area:hover .nav-style-1.owl-carousel > .owl-nav button {
  opacity: 1;
  visibility: visible;
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .testimonial-area.ml-70 {
    margin-left: 15px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .testimonial-area.ml-70 {
    margin-left: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-area.ml-70 {
    margin-left: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .testimonial-area.ml-70 {
    margin-left: 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .testimonial-area.ml-70 {
    margin-left: 30px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .testimonial-area.mr-70 {
    margin-right: 15px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .testimonial-area.mr-70 {
    margin-right: 30px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-area.mr-70 {
    margin-right: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .testimonial-area.mr-70 {
    margin-right: 15px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .testimonial-area.mr-70 {
    margin-right: 30px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .testimonial-area.mt-195 {
    margin-top: 125px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-area.mt-195 {
    margin-top: 0px;
    padding-top: 35px;
  }
}
@media only screen and (max-width: 767px) {
  .testimonial-area.mt-195 {
    margin-top: 0px;
    padding-top: 40px;
  }
}

.testimonial-img-2 {
  margin-top: -197px;
  overflow: hidden;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .testimonial-img-2 {
    margin-top: -130px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .testimonial-img-2 {
    margin-top: 0px;
  }
}
@media only screen and (max-width: 767px) {
  .testimonial-img-2 {
    margin-top: 30px;
  }
}
.testimonial-img-2 img {
  width: 100%;
}

.single-testimonial-2 p {
  color: #fff;
  margin: 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 32px;
  font-style: italic;
}
.single-testimonial-2 .client-info {
  margin: 18px 0 0;
}
.single-testimonial-2 .client-info i {
  color: #fff;
  font-size: 26px;
}
.single-testimonial-2 .client-info h5 {
  font-size: 14px;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  margin: 20px 0 6px;
  color: #fff;
  line-height: 1;
}
.single-testimonial-2 .client-info span {
  font-size: 14px;
  text-transform: capitalize;
  letter-spacing: 1.5px;
  margin: 0;
  color: #fff;
  line-height: 1;
}
.single-testimonial-2.testi-paragraph-mrg p {
  margin: 32px 0 0;
}

.testimonial-active-2 .owl-dots {
  text-align: center;
  margin: 15px 0 0;
}
.testimonial-active-2 .owl-dots .owl-dot {
  display: inline-block;
  margin: 0 5px;
}
.testimonial-active-2 .owl-dots .owl-dot span {
  width: 8px;
  height: 8px;
  border-radius: 100%;
  background-color: #fff;
  border: 2px solid transparent;
  display: inline-block;
}
.testimonial-active-2 .owl-dots .owl-dot.active span {
  background-color: transparent;
  border: 2px solid #fff;
}

/*------- 14. Brand logo style  -------*/
.brand-logo-active.owl-carousel .owl-item img, .brand-logo-active-2.owl-carousel .owl-item img {
  display: inline-block;
  width: auto;
}
.brand-logo-active .single-brand-logo, .brand-logo-active .single-brand-logo2, .brand-logo-active-2 .single-brand-logo, .brand-logo-active-2 .single-brand-logo2 {
  text-align: center;
}
.brand-logo-active .single-brand-logo img, .brand-logo-active .single-brand-logo2 img, .brand-logo-active-2 .single-brand-logo img, .brand-logo-active-2 .single-brand-logo2 img {
  -webkit-filter: grayscale(100%);
          filter: grayscale(100%);
  -webkit-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
}
.brand-logo-active .single-brand-logo:hover img, .brand-logo-active .single-brand-logo2:hover img, .brand-logo-active-2 .single-brand-logo:hover img, .brand-logo-active-2 .single-brand-logo2:hover img {
  -webkit-filter: grayscale(0%);
          filter: grayscale(0%);
}

.brand-logo-wrap {
  padding: 100px 90px;
}
@media only screen and (max-width: 767px) {
  .brand-logo-wrap {
    padding: 50px 20px;
  }
}

/*------ 15. Timer style  -----*/
.funfact-area.bg-img {
  position: relative;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .funfact-area.bg-img {
    background-position: 15%;
  }
  .funfact-area.bg-img:before {
    content: "";
    background-color: #fff;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    opacity: 0.7;
  }
}
@media only screen and (max-width: 767px) {
  .funfact-area.bg-img {
    background-position: 15%;
  }
  .funfact-area.bg-img:before {
    content: "";
    background-color: #fff;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    opacity: 0.7;
  }
}

.funfact-content {
  position: relative;
  z-index: 9;
}
.funfact-content h2 {
  font-size: 48px;
  color: #010101;
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .funfact-content h2 {
    font-size: 32px;
  }
}
.funfact-content .timer {
  text-align: center;
  margin: 65px 0 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .funfact-content .timer {
    margin: 44px 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .funfact-content .timer {
    margin: 24px 0 0;
  }
}
.funfact-content .timer span {
  display: inline-block;
  font-size: 48px;
  color: #555;
  font-weight: 300;
  margin: 0 32px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .funfact-content .timer span {
    margin: 0 15px;
    font-size: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .funfact-content .timer span {
    margin: 0 5px;
    font-size: 22px;
  }
}
.funfact-content .timer span p {
  font-size: 18px;
  font-weight: 500;
  color: #555;
  text-transform: uppercase;
  margin: 34px 0 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .funfact-content .timer span p {
    margin: 24px 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .funfact-content .timer span p {
    margin: 12px 0 0;
    font-size: 14px;
  }
}
.funfact-content .funfact-btn {
  margin-top: 43px;
}
@media only screen and (max-width: 767px) {
  .funfact-content .funfact-btn {
    margin-top: 23px;
  }
}
.funfact-content .funfact-btn a {
  display: inline-block;
  background-color: #000;
  color: #fff;
  line-height: 1;
  padding: 16px 56px;
  border: 1px solid transparent;
  z-index: 1;
}
.funfact-content .funfact-btn a:hover {
  border: 1px solid #000000;
}
.funfact-content .funfact-btn.btn-only-round a {
  border-radius: 50px;
}
.funfact-content .funfact-btn.btn-only-round a:hover {
  border: 1px solid #000000;
}
.funfact-content .funfact-btn.funfact-btn-red a {
  background-color: #df262b;
}
.funfact-content .funfact-btn.funfact-btn-red a:hover {
  border: 1px solid #000000;
}
.funfact-content .funfact-btn.funfact-btn-red-2 a {
  background-color: #c61a32;
}
.funfact-content .funfact-btn.funfact-btn-red-2 a:hover {
  border: 1px solid #000000;
}
.funfact-content .funfact-btn.funfact-btn-red-3 a {
  background-color: #ff3d2a;
}
.funfact-content .funfact-btn.funfact-btn-red-3 a:hover {
  border: 1px solid #000000;
}
.funfact-content .funfact-btn.funfact-btn-green a {
  background-color: #6eab49;
}
.funfact-content .funfact-btn.funfact-btn-green a:hover {
  border: 1px solid #000000;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .funfact-content.mt-90 {
    margin-top: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .funfact-content.funfact-res h2 {
    font-size: 35px;
  }
  .funfact-content.funfact-res .timer {
    margin: 30px 0 0;
  }
  .funfact-content.funfact-res .timer span {
    font-size: 30px;
    margin: 0 9px;
  }
  .funfact-content.funfact-res .timer span p {
    font-size: 15px;
    margin: 14px 0 0;
  }
  .funfact-content.mt-90 {
    margin-top: 0;
  }
}
@media only screen and (max-width: 767px) {
  .funfact-content.mt-90 {
    margin-top: 30px;
  }
}

.gift-img {
  margin: 0 10px;
}
.gift-img a {
  display: block;
}
.gift-img a img {
  width: 100%;
}

.fruits-deal-img {
  margin: 0 90px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .fruits-deal-img {
    margin: 0px 50px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .fruits-deal-img {
    margin: 0px 0px 0;
  }
}
@media only screen and (max-width: 767px) {
  .fruits-deal-img {
    margin: 30px 0px 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .fruits-deal-img {
    margin: 30px 30px 0;
  }
}
.fruits-deal-img a {
  display: block;
}
.fruits-deal-img a img {
  width: 100%;
}

.deal-area {
  overflow: hidden;
}

.fashion-deal-img a img, .common-deal-img a img {
  width: 100%;
}
@media only screen and (max-width: 767px) {
  .fashion-deal-img, .common-deal-img {
    margin-bottom: 20px;
  }
}

.dealy-style-2 {
  margin: 49px 0 43px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .dealy-style-2 {
    margin: 40px 0 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .dealy-style-2 {
    margin: 30px 0 35px;
  }
}
@media only screen and (max-width: 767px) {
  .dealy-style-2 {
    margin: 20px 0 5px;
  }
}
.dealy-style-2 span {
  display: inline-block;
  font-size: 48px;
  font-weight: 300;
  color: #fff;
  margin: 0 34px 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .dealy-style-2 span {
    margin: 0 25px 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .dealy-style-2 span {
    margin: 0 20px 0;
    font-size: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .dealy-style-2 span {
    margin: 0 20px 20px;
    font-size: 30px;
  }
}
.dealy-style-2 span p {
  font-size: 18px;
  font-weight: 500;
  margin: 33px 0 0;
  color: #fff;
  text-transform: uppercase;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .dealy-style-2 span p {
    margin: 20px 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .dealy-style-2 span p {
    margin: 10px 0 0;
  }
}

.black-friday-deal-content h2 {
  color: #fff;
  font-size: 60px;
  line-height: 48px;
  margin: 0 0 67px;
  font-family: "Abril Fatface", cursive;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .black-friday-deal-content h2 {
    font-size: 50px;
    margin: 0 0 50px;
  }
}
@media only screen and (max-width: 767px) {
  .black-friday-deal-content h2 {
    margin: 0 0 27px;
    font-size: 30px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .black-friday-deal-content h2 {
    margin: 0 0 35px;
    font-size: 40px;
  }
}

@media only screen and (max-width: 767px) {
  .deal-area.pb-100 {
    padding-bottom: 60px;
  }

  .funfact-valentine.pb-100 {
    padding-bottom: 60px;
  }
}
/*------ 16. Breadcrumb style  --------*/
.breadcrumb-content ul li {
  display: inline-block;
  font-size: 15px;
  font-weight: 500;
  color: #5b5858;
  margin-right: 18px;
  text-transform: uppercase;
  position: relative;
}
.breadcrumb-content ul li::before {
  position: absolute;
  width: 18px;
  height: 1px;
  background-color: #5b5858;
  content: "";
  right: -21px;
  top: 12px;
  z-index: 99;
  -webkit-transform: rotate(115deg);
      -ms-transform: rotate(115deg);
          transform: rotate(115deg);
}
.breadcrumb-content ul li:last-child::before {
  display: none;
}
.breadcrumb-content ul li a {
  color: #5b5858;
}
.breadcrumb-content ul li a:hover {
  color: #000000;
}

/*---- 17. Sidebar style  ------*/
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sidebar-style.mr-30 {
    margin-right: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sidebar-style {
    margin-top: 30px;
  }
  .sidebar-style.mr-30 {
    margin-right: 0;
  }
}
@media only screen and (max-width: 767px) {
  .sidebar-style {
    margin-top: 30px;
  }
  .sidebar-style.mr-30 {
    margin-right: 0;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sidebar-style.ml-30 {
    margin-left: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .sidebar-style {
    margin-top: 30px;
  }
  .sidebar-style.ml-30 {
    margin-left: 0;
  }
}
@media only screen and (max-width: 767px) {
  .sidebar-style {
    margin-top: 30px;
  }
  .sidebar-style.ml-30 {
    margin-left: 0;
  }
}

.sidebar-widget h4.pro-sidebar-title {
  font-size: 16px;
  font-weight: 500;
  color: #333;
  margin: 0;
}
.sidebar-widget .sidebar-widget-list ul li {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  padding: 0px 0 15px;
}
.sidebar-widget .sidebar-widget-list ul li:last-child {
  padding: 0px 0 0px;
}
.sidebar-widget .sidebar-widget-list ul li .sidebar-widget-list-left {
  position: relative;
}
.sidebar-widget .sidebar-widget-list ul li .sidebar-widget-list-left input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  z-index: 999;
  width: auto;
}
.sidebar-widget .sidebar-widget-list ul li .sidebar-widget-list-left input:checked ~ .checkmark {
  background-color: 000000;
  border: 2px solid 000000;
}
.sidebar-widget .sidebar-widget-list ul li .sidebar-widget-list-left input:checked ~ .checkmark::after {
  display: block;
}
.sidebar-widget .sidebar-widget-list ul li .sidebar-widget-list-left .checkmark {
  position: absolute;
  top: 5px;
  left: 0;
  height: 15px;
  width: 15px;
  background-color: #fff;
  border: 2px solid #888888;
  border-radius: 3px;
}
.sidebar-widget .sidebar-widget-list ul li .sidebar-widget-list-left .checkmark::after {
  content: "";
  position: absolute;
  display: none;
}
.sidebar-widget .sidebar-widget-list ul li .sidebar-widget-list-left .checkmark::after {
  left: 3px;
  top: 0px;
  width: 5px;
  height: 8px;
  border: solid white;
  border-top-width: medium;
  border-right-width: medium;
  border-bottom-width: medium;
  border-left-width: medium;
  border-width: 0 2px 2px 0;
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}
.sidebar-widget .sidebar-widget-list ul li a {
  margin-left: 30px;
  display: block;
}
.sidebar-widget .sidebar-widget-list ul li a span {
  color: #9a9a9a;
  font-weight: 500;
  background-color: #eeeeee;
  width: 30px;
  height: 20px;
  display: inline-block;
  text-align: center;
  line-height: 20px;
  border-radius: 50px;
  float: right;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.sidebar-widget .sidebar-widget-list ul li a:hover span {
  color: #fff;
  background-color: #000000;
}
.sidebar-widget .sidebar-widget-tag ul li {
  display: inline-block;
  margin: 0 10px 15px 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sidebar-widget .sidebar-widget-tag ul li {
    margin: 0 5px 15px 0;
  }
}
.sidebar-widget .sidebar-widget-tag ul li a {
  color: #424242;
  display: inline-block;
  background-color: #f6f6f6;
  padding: 9px 17px 12px;
  line-height: 1;
  border-radius: 50px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .sidebar-widget .sidebar-widget-tag ul li a {
    padding: 9px 13px 12px;
  }
}
.sidebar-widget .sidebar-widget-tag ul li a:hover {
  background-color: #000000;
  color: #fff;
}

.pro-sidebar-search .pro-sidebar-search-form {
  position: relative;
}
.pro-sidebar-search .pro-sidebar-search-form input {
  background: transparent none repeat scroll 0 0;
  border: 1px solid #e6e6e6;
  color: #000;
  font-size: 14px;
  height: 43px;
  padding: 2px 55px 2px 18px;
}
.pro-sidebar-search .pro-sidebar-search-form button {
  background: transparent none repeat scroll 0 0;
  border-color: #a1a5aa;
  -o-border-image: none;
     border-image: none;
  border-style: none none none solid;
  border-width: medium medium medium 1px;
  padding: 0 15px;
  position: absolute;
  right: 0;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
  cursor: pointer;
  color: #000;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  font-size: 20px;
}
.pro-sidebar-search .pro-sidebar-search-form button:hover {
  color: #000000;
}

.single-sidebar-blog {
  border-bottom: 1px solid #dee0e4;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 0 0 20px;
  padding: 0 0 20px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.single-sidebar-blog:last-child {
  border-bottom: none;
}
.single-sidebar-blog .sidebar-blog-img {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 70px;
          flex: 0 0 70px;
  margin: 0 20px 0 0;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .single-sidebar-blog .sidebar-blog-img {
    margin: 0 8px 0 0;
  }
}
.single-sidebar-blog .sidebar-blog-img img {
  width: 100%;
}
.single-sidebar-blog .sidebar-blog-content span {
  color: #333;
  display: block;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-weight: 400;
  line-height: 1;
}
.single-sidebar-blog .sidebar-blog-content h4 {
  font-size: 14px;
  margin: 5px 0 0;
}

/*---- 18. Shop page  -------*/
.shop-top-bar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media only screen and (max-width: 767px) {
  .shop-top-bar {
    display: block;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .shop-top-bar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
.shop-top-bar .select-shoing-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (max-width: 767px) {
  .shop-top-bar .select-shoing-wrap {
    display: block;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .shop-top-bar .select-shoing-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
.shop-top-bar .select-shoing-wrap .shop-select {
  margin-right: 50px;
}
.shop-top-bar .select-shoing-wrap .shop-select select {
  font-size: 14px;
  color: #606060;
  -moz-appearance: none;
  -webkit-appearance: none;
  min-width: 143px;
  background: rgba(0, 0, 0, 0) url("../../assets/img/icon-img/select.png") no-repeat scroll right 0px center;
}
.shop-top-bar .select-shoing-wrap p {
  color: #606060;
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .shop-top-bar .select-shoing-wrap p {
    margin: 5px 0 10px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .shop-top-bar .select-shoing-wrap p {
    margin: 0px;
  }
}
.shop-top-bar .shop-tab a {
  color: #606060;
  font-size: 18px;
  margin-left: 20px;
}
.shop-top-bar .shop-tab a:first-child {
  margin-left: 0;
}
.shop-top-bar .shop-tab a.active {
  color: 000000;
}

.shop-list-wrap .product-wrap:hover .hover-img {
  opacity: inherit;
  visibility: inherit;
  -webkit-transform: none;
      -ms-transform: none;
          transform: none;
}
@media only screen and (max-width: 767px) {
  .shop-list-wrap .shop-list-content {
    margin-top: 20px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .shop-list-wrap .shop-list-content {
    margin-top: 0px;
  }
}
.shop-list-wrap .shop-list-content h3 {
  font-size: 24px;
  color: #010101;
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .shop-list-wrap .shop-list-content h3 {
    font-size: 20px;
    line-height: 20px;
  }
}
.shop-list-wrap .shop-list-content h3 a {
  color: #010101;
}
.shop-list-wrap .shop-list-content h3 a:hover {
  color: #000000;
}
.shop-list-wrap .shop-list-content .product-list-price {
  margin: 13px 0 22px;
}
@media only screen and (max-width: 767px) {
  .shop-list-wrap .shop-list-content .product-list-price {
    margin: 13px 0 13px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .shop-list-wrap .shop-list-content .product-list-price {
    margin: 13px 0 19px;
  }
}
.shop-list-wrap .shop-list-content .product-list-price span {
  color: #fe5252;
  font-size: 24px;
  display: inline-block;
  line-height: 1;
}
.shop-list-wrap .shop-list-content .product-list-price span.old {
  text-decoration: line-through;
  font-size: 18px;
  color: #cfcfcf;
  margin-left: 15px;
}
.shop-list-wrap .shop-list-content .rating-review {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.shop-list-wrap .shop-list-content .rating-review .product-list-rating i {
  font-size: 17px;
  color: #5f5d5d;
  margin: 0 3px 0;
}
.shop-list-wrap .shop-list-content .rating-review .product-list-rating i.yellow {
  color: #ffa900;
}
.shop-list-wrap .shop-list-content .rating-review a {
  margin-left: 40px;
  position: relative;
  font-size: 15px;
  color: #ffcf75;
  line-height: 1;
}
.shop-list-wrap .shop-list-content .rating-review a:before {
  position: absolute;
  content: "";
  left: -21px;
  top: 0;
  background-color: #d1d1d1;
  width: 1px;
  height: 15px;
}
.shop-list-wrap .shop-list-content p {
  margin: 15px 0 40px;
  line-height: 28px;
  font-size: 15px;
  color: #8f8f8f;
}
@media only screen and (max-width: 767px) {
  .shop-list-wrap .shop-list-content p {
    margin: 12px 0 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .shop-list-wrap .shop-list-content p {
    margin: 12px 0 20px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .shop-list-wrap .shop-list-content p {
    margin: 15px 0 20px;
  }
}
.shop-list-wrap .shop-list-content .shop-list-btn a {
  font-size: 14px;
  color: #343538;
  font-weight: 500;
  text-transform: uppercase;
  display: inline-block;
  line-height: 1;
  background-color: #343538;
  color: #fff;
  padding: 14px 32px 15px;
  border: 1px solid transparent;
  z-index: 1;
}
@media only screen and (max-width: 767px) {
  .shop-list-wrap .shop-list-content .shop-list-btn a {
    padding: 10px 20px 11px;
    font-size: 13px;
  }
}
.shop-list-wrap .shop-list-content .shop-list-btn a:hover {
  border: 1px solid #000000;
}
.shop-list-wrap:hover .product-wrap .hover-img {
  opacity: 1;
  visibility: visible;
  -webkit-transform: translate(-50%, 0);
      -ms-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
}

@media only screen and (max-width: 767px) {
  .pro-pagination-style.mt-30 {
    margin-top: 10px;
  }
}
.pro-pagination-style ul li {
  display: inline-block;
  margin: 0 4px;
}
.pro-pagination-style ul li a {
  display: inline-block;
  width: 43px;
  height: 43px;
  text-align: center;
  line-height: 43px;
  font-size: 16px;
  border-radius: 100%;
  color: #000000;
  -webkit-box-shadow: 0 0px 12px 0.8px rgba(0, 0, 0, 0.1);
          box-shadow: 0 0px 12px 0.8px rgba(0, 0, 0, 0.1);
}
.pro-pagination-style ul li a:hover {
  background-color: #000000;
  color: #fff;
}
.pro-pagination-style ul li a.active {
  background-color: #000000;
  color: #fff;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.pro-pagination-style ul li a.active:hover {
  background-color: #333;
}
.pro-pagination-style ul li a.prev,
.pro-pagination-style ul li a.next {
  background-color: #f6f6f6;
  color: #000000;
  font-size: 17px;
  -webkit-box-shadow: none;
          box-shadow: none;
}
.pro-pagination-style ul li a.prev:hover,
.pro-pagination-style ul li a.next:hover {
  background-color: #000000;
  color: #fff;
}

@media only screen and (max-width: 767px) {
  .shop-area.pb-100 {
    padding-bottom: 45px;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1365px) {
  .list2-col-style .shop-list-wrap .shop-list-content h3 {
    font-size: 20px;
    line-height: 20px;
  }
  .list2-col-style .shop-list-wrap .shop-list-content .product-list-price {
    margin: 13px 0 10px;
  }
  .list2-col-style .shop-list-wrap .shop-list-content p {
    margin: 6px 0 20px;
  }
  .list2-col-style .shop-list-wrap .shop-list-content .shop-list-btn a {
    padding: 10px 24px 11px;
    font-size: 13px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .list2-col-style .shop-list-wrap .shop-list-content h3 {
    font-size: 20px;
    line-height: 20px;
  }
  .list2-col-style .shop-list-wrap .shop-list-content .product-list-price {
    margin: 13px 0 10px;
  }
  .list2-col-style .shop-list-wrap .shop-list-content p {
    margin: 6px 0 20px;
  }
  .list2-col-style .shop-list-wrap .shop-list-content .shop-list-btn a {
    padding: 10px 20px 11px;
    font-size: 13px;
  }
}

.grid-sizer {
  width: 25%;
}

/*----- 19. Product details page  ---*/
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .product-details-img.mr-20 {
    margin-right: 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-details-img.mr-20 {
    margin-right: 0;
  }
}
@media only screen and (max-width: 767px) {
  .product-details-img.mr-20 {
    margin-right: 0;
  }
}
.product-details-img .large-img-style {
  position: relative;
}
.product-details-img .large-img-style img {
  width: 100%;
}
.product-details-img .large-img-style span {
  position: absolute;
  top: 30px;
  left: 30px;
  font-size: 13px;
  color: #fff;
  display: inline-block;
  line-height: 1;
  padding: 3px 11px;
  border-radius: 3px;
  font-weight: 500;
  background-color: 000000;
}
.product-details-img .large-img-style .img-popup-wrap {
  position: absolute;
  right: 30px;
  top: 30px;
  font-size: 30px;
  color: #000000;
}
.product-details-img .large-img-style .img-popup-wrap:hover {
  color: #000000;
}
.product-details-img .shop-details-tab {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-top: -72px;
  z-index: 9;
  position: relative;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-details-img .shop-details-tab {
    margin-top: -50px;
  }
}
@media only screen and (max-width: 767px) {
  .product-details-img .shop-details-tab {
    margin-top: -45px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .product-details-img .shop-details-tab {
    margin-top: -60px;
  }
}
.product-details-img .shop-details-tab a.shop-details-overly {
  position: relative;
}
.product-details-img .shop-details-tab a.shop-details-overly img {
  width: 144px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-details-img .shop-details-tab a.shop-details-overly img {
    width: 90px;
  }
}
@media only screen and (max-width: 767px) {
  .product-details-img .shop-details-tab a.shop-details-overly img {
    width: 85px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .product-details-img .shop-details-tab a.shop-details-overly img {
    width: 110px;
  }
}
.product-details-img .shop-details-tab a.shop-details-overly.active:before {
  opacity: 0.6;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  background-color: #fff;
  content: "";
}

.description-review-topbar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-bottom: 1px solid #d7d7d7;
}
.description-review-topbar a {
  background-color: transparent;
  border-bottom: 3px solid transparent;
  font-size: 24px;
  font-weight: 500;
  line-height: 1;
  margin: 0 15px 0;
  padding: 0px 0px 13px;
  color: #666;
}
.description-review-topbar a.active {
  color: #000000;
}
@media only screen and (max-width: 767px) {
  .description-review-topbar a {
    margin: 0 4px 15px;
    font-size: 15px;
    padding: 0px 0px 8px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .description-review-topbar a {
    margin: 0 8px 0px 0;
    font-size: 18px;
    padding: 0px 5px 0px;
  }
}
.description-review-topbar a.active {
  border-bottom: 2px solid #000000;
  background-color: transparent;
}

.description-review-bottom {
  padding: 33px 0 0;
}
.description-review-bottom .product-description-wrapper p {
  margin: 0 0 8px;
  font-size: 15px;
  line-height: 28px;
  color: #333;
  width: 84%;
}
@media only screen and (max-width: 767px) {
  .description-review-bottom .product-description-wrapper p {
    width: 100%;
  }
}
.description-review-bottom .product-description-wrapper p:last-child {
  margin: 0 0 0px;
}
.description-review-bottom .product-anotherinfo-wrapper ul li {
  color: #333;
  font-size: 14px;
  list-style: outside none none;
  margin: 0 0 13px;
}
.description-review-bottom .product-anotherinfo-wrapper ul li span {
  color: #000;
  display: inline-block;
  font-weight: 500;
  margin: 0 26px 0 0;
  min-width: 85px;
}

.single-review {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0 0 50px;
}
@media only screen and (max-width: 767px) {
  .single-review {
    display: block;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-review {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
}
.single-review .review-img {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 90px;
          flex: 0 0 90px;
  margin: 0 15px 0 0;
}
@media only screen and (max-width: 767px) {
  .single-review .review-img {
    margin: 0 0px 20px 0;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .single-review .review-img {
    margin: 0 15px 0px 0;
  }
}
.single-review .review-top-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 0 0 10px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.single-review .review-top-wrap .review-left {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.single-review .review-top-wrap .review-left .review-name {
  margin-right: 25px;
}
.single-review .review-top-wrap .review-left .review-name h4 {
  font-size: 16px;
  margin: 0;
  line-height: 1;
  font-weight: 500;
}
.single-review .review-top-wrap .review-left .review-rating {
  line-height: 1;
}
.single-review .review-top-wrap .review-left .review-rating i {
  font-size: 12px;
  margin-right: 1px;
  color: #ffa900;
}
.single-review .review-top-wrap .review-btn a {
  font-weight: 500;
  line-height: 1;
}
.single-review .review-bottom p {
  margin: 0;
  width: 93%;
}

.single-review.child-review {
  margin-left: 70px;
  margin-bottom: 0;
}
@media only screen and (max-width: 767px) {
  .single-review.child-review {
    margin-left: 0px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .ratting-form-wrapper.pl-50 {
    padding-left: 0;
    margin-top: 50px;
  }
}
@media only screen and (max-width: 767px) {
  .ratting-form-wrapper.pl-50 {
    padding-left: 0;
    margin-top: 50px;
  }
}
.ratting-form-wrapper h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
}
.ratting-form-wrapper .ratting-form form .star-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 6px 0 20px;
}
.ratting-form-wrapper .ratting-form form .star-box span {
  margin: 0 15px 0 0;
}
.ratting-form-wrapper .ratting-form form .star-box .ratting-star {
  font-size: 12px;
  color: #ffa900;
  margin: 2px 0 0;
}
.ratting-form-wrapper .ratting-form form .rating-form-style input,
.ratting-form-wrapper .ratting-form form .rating-form-style textarea {
  padding: 2px 10px 2px 20px;
  background: transparent;
  border: 1px solid #e6e6e6;
  color: #333;
}
.ratting-form-wrapper .ratting-form form .rating-form-style textarea {
  height: 180px;
  padding: 20px 10px 2px 20px;
  margin-bottom: 20px;
}
.ratting-form-wrapper .ratting-form form .form-submit input {
  width: auto;
  padding: 12px 50px;
  font-weight: 500;
  text-transform: uppercase;
  height: auto;
  background-color: #000000;
  color: #fff;
  border: 1px solid #000000;
}
.ratting-form-wrapper .ratting-form form .form-submit input:hover {
  background-color: #333;
  border: 1px solid #333;
}

/* product details 2 */
.product-dec-slider-2 {
  display: inline-block;
  float: left;
  padding: 0;
  width: 20%;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .product-dec-slider-2 {
    width: 19%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-dec-slider-2 {
    margin-bottom: 40px;
  }
}
@media only screen and (max-width: 767px) {
  .product-dec-slider-2 {
    margin-bottom: 30px;
    width: 30%;
  }
}
.product-dec-slider-2 .product-dec-icon {
  color: #666;
  cursor: pointer;
  display: inline-block;
  font-size: 25px;
  left: 50%;
  line-height: 1;
  padding: 0 10px;
  position: absolute;
  -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
  z-index: 99;
  opacity: 0;
  visibility: hidden;
}
.product-dec-slider-2 .product-dec-icon.product-dec-prev {
  top: -25px;
}
.product-dec-slider-2 .product-dec-icon.product-dec-next {
  bottom: -14px;
}
.product-dec-slider-2.slick-vertical .slick-slide {
  display: block;
  height: auto;
  margin: 2px 0 10px;
  text-align: center;
}
.product-dec-slider-2.slick-vertical .slick-slide img {
  display: inline-block;
  width: 100%;
}
.product-dec-slider-2:hover .product-dec-icon {
  opacity: 1;
  visibility: visible;
}

.zoompro-wrap.zoompro-2 {
  display: inline-block;
  position: relative;
  width: 80%;
  float: left;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .zoompro-wrap.zoompro-2 {
    width: 79%;
  }
}
@media only screen and (max-width: 767px) {
  .zoompro-wrap.zoompro-2 {
    margin-bottom: 30px;
    width: 70%;
  }
}
.zoompro-wrap .zoompro-span {
  position: relative;
}
.zoompro-wrap .zoompro-span span {
  position: absolute;
  top: 30px;
  left: 30px;
  font-size: 13px;
  color: #fff;
  display: inline-block;
  line-height: 1;
  padding: 3px 11px;
  border-radius: 3px;
  font-weight: 500;
  background-color: 000000;
  z-index: 99;
}
.zoompro-wrap .zoompro-span .product-video {
  text-align: center;
  position: absolute;
  bottom: 30px;
  left: 30px;
  z-index: 99;
}
.zoompro-wrap .zoompro-span .product-video a {
  background-color: 000000;
  border-radius: 3px;
  color: #fff;
  display: inline-block;
  padding: 5px 15px 5px;
}
@media only screen and (max-width: 767px) {
  .zoompro-wrap .zoompro-span .product-video a {
    padding: 3px 10px 3px;
  }
}
.zoompro-wrap .zoompro-span img {
  width: 100%;
}

.dec-img-wrap {
  position: relative;
}
.dec-img-wrap img {
  width: 100%;
}
.dec-img-wrap span {
  position: absolute;
  top: 30px;
  left: 30px;
  font-size: 13px;
  color: #fff;
  display: inline-block;
  line-height: 1;
  padding: 3px 11px;
  border-radius: 3px;
  font-weight: 500;
  background-color: 000000;
  z-index: 99;
}

@media only screen and (max-width: 767px) {
  .sidebar-active .product-details-content {
    margin-top: 0;
  }
}
.sidebar-active.col-lg-6 {
  padding-left: 15px;
  padding-right: 15px;
}
.sidebar-active.col-lg-6.is-affixed {
  padding-left: 0px;
  padding-right: 0px;
}
.sidebar-active.col-lg-6.is-affixed .inner-wrapper-sticky {
  padding-left: 15px;
  padding-right: 15px;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .product-details-gallery.mr-20 {
    margin-right: 0;
  }
}
@media only screen and (max-width: 767px) {
  .product-details-gallery.mr-20 {
    margin-right: 0;
  }
}

/* affiliate */
.pro-details-affiliate {
  margin: 30px 0;
}
.pro-details-affiliate a {
  color: #fff;
  display: inline-block;
  font-weight: 500;
  background-color: #000;
  line-height: 1;
  padding: 13px 30px 16px;
  z-index: 9;
  border: 1px solid transparent;
}

/* product-details-slider */
.product-details-slider-active.nav-style-1.owl-carousel .owl-nav button {
  color: #333;
  font-size: 20px;
  left: 20px;
}
.product-details-slider-active.nav-style-1.owl-carousel .owl-nav button:hover {
  color: #000000;
}
.product-details-slider-active.nav-style-1.owl-carousel .owl-nav button.owl-next {
  left: auto;
  right: 20px;
}
.product-details-slider-active:hover.nav-style-1.owl-carousel > .owl-nav button {
  opacity: 1;
  visibility: visible;
}

/*----- 20. Cart page  -----*/
@media only screen and (max-width: 767px) {
  .cart-main-area.pb-100 {
    padding-bottom: 60px;
  }
}

h3.cart-page-title {
  font-size: 20px;
  font-weight: 500;
  margin: 0 0 15px;
}

.cart-table-content table {
  border: 1px solid #ebebeb;
}
.cart-table-content table thead > tr {
  background-color: #f9f9f9;
  border: 1px solid #ebebeb;
}
.cart-table-content table thead > tr th {
  border-top: medium none;
  color: #333;
  font-size: 14px;
  font-weight: 500;
  padding: 21px 45px 22px;
  text-align: center;
  text-transform: uppercase;
  vertical-align: middle;
  white-space: nowrap;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .cart-table-content table thead > tr th {
    padding: 21px 35px 22px;
  }
}
@media only screen and (max-width: 767px) {
  .cart-table-content table thead > tr th {
    padding: 21px 20px 22px;
  }
}
.cart-table-content table tbody > tr {
  border-bottom: 1px solid #ebebeb;
}
.cart-table-content table tbody > tr td.product-thumbnail {
  width: 150px;
}
.cart-table-content table tbody > tr td.product-name {
  width: 435px;
}
.cart-table-content table tbody > tr td.product-name a {
  color: #333;
  font-size: 15px;
  font-weight: 500;
}
.cart-table-content table tbody > tr td.product-name a:hover {
  color: #000000;
}
.cart-table-content table tbody > tr td.product-price-cart {
  width: 435px;
}
.cart-table-content table tbody > tr td.product-price-cart span {
  font-weight: 500;
  color: #333;
}
.cart-table-content table tbody > tr td.product-subtotal {
  font-weight: 500;
  color: #333;
}
.cart-table-content table tbody > tr td.product-quantity {
  width: 435px;
}
.cart-table-content table tbody > tr td.product-quantity .cart-plus-minus {
  display: inline-block;
  height: 40px;
  padding: 0;
  position: relative;
  width: 110px;
}
.cart-table-content table tbody > tr td.product-quantity .cart-plus-minus .qtybutton {
  color: #333;
  cursor: pointer;
  float: inherit;
  font-size: 16px;
  margin: 0;
  position: absolute;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
  width: 20px;
  text-align: center;
}
.cart-table-content table tbody > tr td.product-quantity .cart-plus-minus .dec.qtybutton {
  border-right: 1px solid #e5e5e5;
  height: 40px;
  left: 0;
  padding-top: 8px;
  top: 0;
}
.cart-table-content table tbody > tr td.product-quantity .cart-plus-minus .inc.qtybutton {
  border-left: 1px solid #e5e5e5;
  height: 40px;
  padding-top: 9px;
  right: 0;
  top: 0;
}
.cart-table-content table tbody > tr td.product-quantity .cart-plus-minus input.cart-plus-minus-box {
  color: #333;
  float: left;
  font-size: 14px;
  height: 40px;
  margin: 0;
  width: 110px;
  background: transparent none repeat scroll 0 0;
  border: 1px solid #e1e1e1;
  padding: 0;
  text-align: center;
}
.cart-table-content table tbody > tr td.product-remove {
  width: 100px;
}
.cart-table-content table tbody > tr td.product-remove a {
  color: #666;
  font-size: 17px;
  margin: 0 13px;
}
.cart-table-content table tbody > tr td.product-remove a:hover {
  color: #000000;
}
.cart-table-content table tbody > tr td.product-wishlist-cart > a {
  background-color: #000000;
  border-radius: 50px;
  color: #fff;
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  padding: 7px 12px;
  text-transform: uppercase;
}
.cart-table-content table tbody > tr td.product-wishlist-cart > a:hover {
  background-color: #333;
}
.cart-table-content table tbody > tr td {
  color: #333;
  font-size: 15px;
  padding: 30px 0;
  text-align: center;
}

.cart-shiping-update-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 30px 0px 55px;
}
@media only screen and (max-width: 767px) {
  .cart-shiping-update-wrapper {
    display: block;
    padding: 30px 0px 15px;
  }
}
.cart-shiping-update-wrapper .cart-shiping-update > a,
.cart-shiping-update-wrapper .cart-clear > button,
.cart-shiping-update-wrapper .cart-clear > a {
  background-color: #f2f2f2;
  border-radius: 50px;
  color: #363f4d;
  display: inline-block;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  padding: 18px 63px 17px;
  text-transform: uppercase;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cart-shiping-update-wrapper .cart-shiping-update > a,
.cart-shiping-update-wrapper .cart-clear > button,
.cart-shiping-update-wrapper .cart-clear > a {
    padding: 18px 25px 17px;
    font-size: 13px;
  }
}
@media only screen and (max-width: 767px) {
  .cart-shiping-update-wrapper .cart-shiping-update > a,
.cart-shiping-update-wrapper .cart-clear > button,
.cart-shiping-update-wrapper .cart-clear > a {
    padding: 18px 40px 17px;
    margin: 0 0 15px;
  }
}
.cart-shiping-update-wrapper .cart-shiping-update > a:hover,
.cart-shiping-update-wrapper .cart-clear > button:hover,
.cart-shiping-update-wrapper .cart-clear > a:hover {
  background-color: #000000;
  color: #fff;
}
.cart-shiping-update-wrapper .cart-clear > button {
  border: medium none;
  cursor: pointer;
  margin-right: 27px;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .cart-shiping-update-wrapper .cart-clear > button {
    margin-right: 15px;
  }
}

.cart-tax,
.discount-code-wrapper {
  background-color: #f9f9f9;
  border: 1px solid #ebebeb;
  border-radius: 5px;
  padding: 45px 30px 50px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .cart-tax,
.discount-code-wrapper {
    padding: 45px 18px 50px;
  }
}
@media only screen and (max-width: 767px) {
  .cart-tax,
.discount-code-wrapper {
    padding: 45px 18px 50px;
  }
}
.cart-tax .title-wrap,
.discount-code-wrapper .title-wrap {
  position: relative;
}
.cart-tax .title-wrap::before,
.discount-code-wrapper .title-wrap::before {
  background-color: #e3e1e1;
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  top: 10px;
  -webkit-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
  width: 100%;
  z-index: 1;
}
.cart-tax .title-wrap h4.cart-bottom-title,
.discount-code-wrapper .title-wrap h4.cart-bottom-title {
  display: inline-block;
  font-size: 18px;
  font-weight: 500;
  margin: 0;
  padding-right: 18px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .cart-tax .title-wrap h4.cart-bottom-title,
.discount-code-wrapper .title-wrap h4.cart-bottom-title {
    font-size: 16px;
  }
}
.cart-tax .title-wrap .section-bg-gray,
.discount-code-wrapper .title-wrap .section-bg-gray {
  background-color: #f8f9f9;
  position: relative;
  z-index: 99;
}
.cart-tax .tax-wrapper,
.discount-code-wrapper .tax-wrapper {
  margin-top: 22px;
}
.cart-tax .tax-wrapper p,
.discount-code-wrapper .tax-wrapper p {
  margin: 0;
}
.cart-tax .tax-wrapper .tax-select-wrapper,
.discount-code-wrapper .tax-wrapper .tax-select-wrapper {
  margin: 5px 0 0;
}
.cart-tax .tax-wrapper .tax-select-wrapper .tax-select,
.discount-code-wrapper .tax-wrapper .tax-select-wrapper .tax-select {
  margin: 0 0 26px;
}
.cart-tax .tax-wrapper .tax-select-wrapper .tax-select label,
.discount-code-wrapper .tax-wrapper .tax-select-wrapper .tax-select label {
  color: #242424;
  font-size: 14px;
  margin: 0 0 5px;
}
.cart-tax .tax-wrapper .tax-select-wrapper .tax-select select,
.discount-code-wrapper .tax-wrapper .tax-select-wrapper .tax-select select {
  -moz-appearance: none;
  -webkit-appearance: none;
  background: #fff url("../../assets/img/icon-img/cart.png") no-repeat scroll right 18px center;
  border: 1px solid #ebebeb;
  -webkit-box-shadow: none;
          box-shadow: none;
  color: #242424;
  font-size: 12px;
  height: 40px;
  padding: 0 50px 0 15px;
  width: 100%;
  cursor: pointer;
}
.cart-tax .tax-wrapper .tax-select-wrapper .tax-select input,
.discount-code-wrapper .tax-wrapper .tax-select-wrapper .tax-select input {
  background: #fff none repeat scroll 0 0;
  border: 1px solid #ebebeb;
  height: 40px;
}
.cart-tax .tax-wrapper .tax-select-wrapper button.cart-btn-2,
.discount-code-wrapper .tax-wrapper .tax-select-wrapper button.cart-btn-2 {
  background-color: #000000;
  border: medium none;
  border-radius: 50px;
  color: #fff;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  padding: 13px 42px 12px;
  text-transform: uppercase;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.cart-tax .tax-wrapper .tax-select-wrapper button.cart-btn-2:hover,
.discount-code-wrapper .tax-wrapper .tax-select-wrapper button.cart-btn-2:hover {
  background-color: #333;
}
.cart-tax .discount-code,
.discount-code-wrapper .discount-code {
  margin: 21px 0 0;
}
.cart-tax .discount-code p,
.discount-code-wrapper .discount-code p {
  margin: 0 0 15px;
}
.cart-tax .discount-code form input,
.discount-code-wrapper .discount-code form input {
  background: #fff;
  border: 1px solid #ebebeb;
  height: 40px;
  margin-bottom: 30px;
  padding-left: 10px;
}
.cart-tax .discount-code form button.cart-btn-2,
.discount-code-wrapper .discount-code form button.cart-btn-2 {
  background-color: #000000;
  border: medium none;
  border-radius: 50px;
  color: #fff;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  padding: 13px 42px 12px;
  text-transform: uppercase;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.cart-tax .discount-code form button.cart-btn-2:hover,
.discount-code-wrapper .discount-code form button.cart-btn-2:hover {
  background-color: #333;
}

.grand-totall {
  background-color: #f9f9f9;
  border: 1px solid #ebebeb;
  border-radius: 5px;
  padding: 45px 30px 50px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .grand-totall {
    padding: 45px 18px 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .grand-totall {
    margin-top: 30px;
  }
}
.grand-totall .title-wrap {
  position: relative;
}
.grand-totall .title-wrap::before {
  background-color: #e3e1e1;
  content: "";
  height: 1px;
  left: 0;
  position: absolute;
  top: 10px;
  -webkit-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
  width: 100%;
  z-index: 1;
}
.grand-totall .title-wrap h4.cart-bottom-title {
  display: inline-block;
  font-size: 18px;
  font-weight: 500;
  margin: 0;
  padding-right: 18px;
}
.grand-totall .title-wrap .section-bg-gary-cart {
  background-color: #f9f9f9;
  position: relative;
  z-index: 9;
}
.grand-totall h5 {
  font-size: 14px;
  margin: 36px 0 27px;
}
.grand-totall h5 span {
  float: right;
  font-size: 18px;
  font-weight: 500;
}
.grand-totall .total-shipping {
  border-bottom: 1px solid #ebebeb;
  border-top: 1px solid #ebebeb;
  margin: 0 0 27px;
  padding: 28px 0;
}
.grand-totall .total-shipping h5 {
  font-size: 14px;
  margin: 0;
}
.grand-totall .total-shipping ul {
  padding: 19px 0 0 0px;
}
.grand-totall .total-shipping ul li {
  color: #242424;
  list-style: outside none none;
  margin: 0 0 6px;
}
.grand-totall .total-shipping ul li:last-child {
  margin: 0 0 0px;
}
.grand-totall .total-shipping ul li input {
  background: #e9e9e9 none repeat scroll 0 0;
  border: 1px solid #d7d7d7;
  border-radius: 5px !important;
  color: #626262;
  cursor: pointer;
  height: 13px;
  margin-right: 10px;
  padding: 0;
  position: relative;
  top: 2px;
  width: 13px;
}
.grand-totall .total-shipping ul li span {
  float: right;
}
.grand-totall h4.grand-totall-title {
  color: #000000;
  font-size: 20px;
  font-weight: 500;
  margin: 0 0 25px;
}
.grand-totall h4.grand-totall-title span {
  float: right;
}
.grand-totall a {
  background-color: #000000;
  border-radius: 50px;
  color: #fff;
  display: block;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  padding: 18px 10px 17px;
  text-align: center;
  text-transform: uppercase;
}
.grand-totall a:hover {
  background-color: #333;
}
.tableEventos .btnVolver {
  background-color: #000000;
  border-radius: 50px;
  color: #fff;
 
  font-size: 11px;
  font-weight: 500;
  line-height: 1;
  padding: 8px 6px 8px 8px;
  text-align: center;
  text-transform: uppercase;
  text-decoration:none !important;
  margin-top:30px !important;
}
.tableEventos .btnVolver:hover {
  background-color: #333;
}



@media only screen and (max-width: 767px) {
  .discount-code-wrapper {
    margin: 30px 0;
  }
}

/*------- 21. Checkout page  -----------*/
.billing-info-wrap h3 {
  font-size: 20px;
  color: #000;
  margin: 0 0 20px;
  font-weight: 500;
}
.billing-info-wrap .billing-info label,
.billing-info-wrap .billing-select label {
  color: #000;
  margin: 0 0 7px;
}
.billing-info-wrap .billing-info input,
.billing-info-wrap .billing-select input {
  background: transparent none repeat scroll 0 0;
  border: 1px solid #e6e6e6;
  color: #333;
  font-size: 14px;
  padding-left: 20px;
  padding-right: 10px;
}
.billing-info-wrap .billing-info input.billing-address,
.billing-info-wrap .billing-select input.billing-address {
  margin-bottom: 10px;
}
.billing-info-wrap .billing-select select {
  -moz-appearance: none;
  -webkit-appearance: none;
  border: 1px solid #e6e6e6;
  color: #333;
  font-size: 14px;
  height: 45px;
  padding: 2px 20px;
  background: rgba(0, 0, 0, 0) url("../../assets/img/icon-img/select.png") no-repeat scroll right 18px center;
  cursor: pointer;
}
.billing-info-wrap .checkout-account {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.billing-info-wrap .checkout-account input {
  border: 1px solid #9fa0a2;
  display: inline-block;
  float: left;
  height: 10px;
  width: 10px;
}
.billing-info-wrap .checkout-account span {
  color: #333;
  font-weight: 400;
  margin: 0 0 0 12px;
}
.billing-info-wrap .checkout-account-toggle input {
  background: transparent none repeat scroll 0 0;
  border: 1px solid #e6e6e6;
  color: #333;
  font-size: 14px;
  padding-left: 20px;
  padding-right: 10px;
  margin: 0 0 20px;
}
.billing-info-wrap .checkout-account-toggle button.checkout-btn {
  background-color: #000000;
  border: medium none;
  color: #fff;
  cursor: pointer;
  font-weight: 500;
  padding: 10px 30px;
  text-transform: uppercase;
  border-radius: 50px;
  z-index: 9;
}
.billing-info-wrap .checkout-account-toggle button.checkout-btn:hover {
  background-color: #333;
}
.billing-info-wrap .additional-info-wrap h4 {
  font-size: 16px;
  font-weight: 500;
}
.billing-info-wrap .additional-info-wrap .additional-info label {
  color: #333;
  font-size: 14px;
  margin: 0 0 7px;
}
.billing-info-wrap .additional-info-wrap .additional-info textarea {
  background: transparent none repeat scroll 0 0;
  border: 1px solid #e6e6e6;
  color: #333;
  font-size: 14px;
  height: 138px;
  padding: 17px 20px;
}
.billing-info-wrap .different-address {
  display: none;
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .your-order-area {
    margin-top: 30px;
  }
}
@media only screen and (max-width: 767px) {
  .your-order-area {
    margin-top: 30px;
  }
}
.your-order-area h3 {
  font-size: 20px;
  font-weight: 500;
  margin: 0 0 20px;
  color: #000;
}
.your-order-area .your-order-wrap {
  padding: 38px 45px 44px;
  background: #f6f6f6;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .your-order-area .your-order-wrap {
    padding: 30px 20px 36px;
  }
}
@media only screen and (max-width: 767px) {
  .your-order-area .your-order-wrap {
    padding: 30px 20px 36px;
  }
}
.your-order-area .your-order-wrap .your-order-product-info .your-order-top ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.your-order-area .your-order-wrap .your-order-product-info .your-order-top ul li {
  font-size: 16px;
  font-weight: 500;
  list-style: outside none none;
}
.your-order-area .your-order-wrap .your-order-product-info .your-order-middle {
  border-bottom: 1px solid #dee0e4;
  border-top: 1px solid #dee0e4;
  margin: 29px 0;
  padding: 19px 0 18px;
}
.your-order-area .your-order-wrap .your-order-product-info .your-order-middle ul li {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 0 0 10px;
}
.your-order-area .your-order-wrap .your-order-product-info .your-order-bottom ul {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.your-order-area .your-order-wrap .your-order-product-info .your-order-bottom ul li {
  font-size: 14px;
  font-weight: 400;
  list-style: none;
}
.your-order-area .your-order-wrap .your-order-product-info .your-order-bottom ul li.your-order-shipping {
  font-size: 16px;
  color: #212121;
  font-weight: 400;
}
.your-order-area .your-order-wrap .your-order-product-info .your-order-total {
  border-bottom: 1px solid #dee0e4;
  border-top: 1px solid #dee0e4;
  margin: 18px 0 33px;
  padding: 17px 0 19px;
}
.your-order-area .your-order-wrap .your-order-product-info .your-order-total ul {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.your-order-area .your-order-wrap .your-order-product-info .your-order-total ul li.order-total {
  font-weight: 500;
  color: #212121;
  font-size: 18px;
}
.your-order-area .your-order-wrap .your-order-product-info .your-order-total ul li {
  font-weight: 500;
  color: #000000;
  font-size: 16px;
  list-style: outside none none;
}
.your-order-area .payment-accordion {
  margin: 0 0 16px;
}
.your-order-area .payment-accordion:last-child {
  margin: 0 0 0px;
}
.your-order-area .payment-accordion h4 {
  color: #212121;
  font-size: 16px;
  margin: 0;
}
.your-order-area .payment-accordion h4 a {
  color: #212121;
  position: relative;
  display: block;
}
.your-order-area .payment-accordion h4 a:hover {
  color: #000000;
}
.your-order-area .payment-accordion .panel-body {
  padding: 5px 0 0 0px;
}
.your-order-area .payment-accordion .panel-body p {
  padding: 0 0 0 10px;
  font-size: 14px;
  color: #333;
}
.your-order-area .Place-order > a {
  background-color: #000000;
  color: #fff;
  display: block;
  font-weight: 500;
  letter-spacing: 1px;
  line-height: 1;
  padding: 18px 20px;
  text-align: center;
  text-transform: uppercase;
  border-radius: 50px;
  z-index: 9;
}
.your-order-area .Place-order > a:hover {
  background-color: #333;
}

@media only screen and (max-width: 767px) {
  .checkout-area.pb-100 {
    padding-bottom: 60px;
  }
}

/*------ 22. contact Page  ------*/
.contact-map #map {
  height: 560px;
}
@media only screen and (max-width: 767px) {
  .contact-map #map {
    height: 400px;
  }
}

.contact-info-wrap {
  background-color: #f3f3f3;
  padding: 120px 70px 116px 90px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-info-wrap {
    padding: 120px 20px 116px 40px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-info-wrap {
    padding: 120px 20px 116px 30px;
  }
}
@media only screen and (max-width: 767px) {
  .contact-info-wrap {
    padding: 50px 20px 45px 30px;
    margin-bottom: 30px;
    margin-top: 20px;
  }
}
.contact-info-wrap .single-contact-info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 40px;
}
.contact-info-wrap .single-contact-info .contact-icon {
  margin-right: 20px;
}
.contact-info-wrap .single-contact-info .contact-icon i {
  font-size: 20px;
  color: #252525;
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  border: 1px solid #252525;
  text-align: center;
  border-radius: 100%;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.contact-info-wrap .single-contact-info .contact-info-dec p {
  line-height: 1;
  color: #404040;
  margin: 0 0 9px;
}
.contact-info-wrap .single-contact-info .contact-info-dec p a {
  color: #404040;
}
.contact-info-wrap .single-contact-info .contact-info-dec p a:hover {
  color: #000000;
}
.contact-info-wrap .single-contact-info .contact-info-dec p:last-child {
  margin: 0;
}
.contact-info-wrap .single-contact-info:hover .contact-icon i {
  background-color: #252525;
  color: #fff;
}

.contact-social {
  margin-top: 58px;
}
.contact-social h3 {
  font-weight: 500;
  color: #4d4d4d;
  font-size: 24px;
  margin: 0 0 17px;
  line-height: 1;
}
.contact-social ul li {
  margin: 0 10px;
  display: inline-block;
}
.contact-social ul li a {
  font-size: 16px;
  color: #4d4d4d;
}
.contact-social ul li a:hover {
  color: #000000;
}

.contact-form {
  background-color: #f3f3f3;
  padding: 50px 110px 50px 110px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .contact-form {
    padding: 50px 50px 50px 50px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .contact-form {
    padding: 50px 30px 50px 30px;
  }
}
@media only screen and (max-width: 767px) {
  .contact-form {
    padding: 50px 30px 50px 30px;
  }
}
.contact-form .contact-title h2 {
  font-size: 24px;
  font-weight: 500;
  color: #464646;
  line-height: 1;
  margin-bottom: 36px;
}
.contact-form .contact-form-style input, .contact-form .contact-form-style textarea {
  background: transparent;
  border: 1px solid #c1c1c1;
  height: 40px;
  padding: 2px 14px;
  margin-bottom: 30px;
  color: #000;
}
.contact-form .contact-form-style textarea {
  padding: 20px 14px;
  margin-bottom: 0px;
  height: 175px;
}
.contact-form .contact-form-style button {
  border: none;
  background-color: #404040;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
  line-height: 1;
  padding: 15px 52px;
  margin-top: 38px;
}
.contact-form .contact-form-style button:hover {
  background-color: #000000;
}
.contact-form p {
  color: #333;
}
.contact-form p.success {
  margin-top: 10px;
}

.contact-form-style .row div[class^=col-] {
  padding-left: 15px;
  padding-right: 15px;
}

@media only screen and (max-width: 767px) {
  .contact-area.pb-100 {
    padding-bottom: 60px;
  }
}

/*------ 23. Blog Details Page  -------*/
.blog-details-top .blog-details-img {
  position: relative;
}
.blog-details-top .blog-details-img img {
  width: 100%;
}
.blog-details-top .blog-details-img .video-icon {
  left: 0;
  position: absolute;
  right: 0;
  text-align: center;
  top: 50%;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}
.blog-details-top .blog-details-img .video-icon a {
  background-color: #ff0000;
  border-radius: 50px;
  color: #fff;
  display: inline-block;
  font-size: 25px;
  height: 60px;
  line-height: 61px;
  width: 60px;
}
.blog-details-top .blog-details-img .video-icon a:hover {
  background-color: #000000;
}
.blog-details-top .blog-details-content {
  margin-top: 30px;
}
.blog-details-top .blog-details-content .blog-meta-2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.blog-details-top .blog-details-content .blog-meta-2 ul li {
  color: #333;
  display: inline-block;
  font-size: 14px;
  letter-spacing: 1px;
  list-style: outside none none;
  margin: 0 17px 0 0;
  position: relative;
  text-transform: uppercase;
  display: inline-block;
  line-height: 1;
}
.blog-details-top .blog-details-content .blog-meta-2 ul li::before {
  background-color: #555;
  content: "";
  height: 2px;
  position: absolute;
  right: -13px;
  top: 6px;
  -webkit-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
  width: 5px;
}
.blog-details-top .blog-details-content .blog-meta-2 ul li:last-child::before {
  display: none;
}
.blog-details-top .blog-details-content .blog-meta-2 ul li a {
  color: #333;
}
.blog-details-top .blog-details-content .blog-meta-2 ul li a:hover {
  color: #000000;
}
.blog-details-top .blog-details-content h3 {
  font-size: 24px;
  font-weight: 500;
  margin: 8px 0 20px;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog-details-top .blog-details-content h3 {
    font-size: 22px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-details-top .blog-details-content h3 {
    font-size: 22px;
  }
}
@media only screen and (max-width: 767px) {
  .blog-details-top .blog-details-content h3 {
    font-size: 18px;
  }
}
.blog-details-top .blog-details-content p {
  margin: 0;
  line-height: 26px;
}
.blog-details-top .blog-details-content blockquote {
  color: #333;
  font-size: 18px;
  margin: 25px 0 26px;
  line-height: 34px;
  font-weight: 500;
  font-style: italic;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .blog-details-top .blog-details-content blockquote {
    font-size: 17px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .blog-details-top .blog-details-content blockquote {
    font-size: 17px;
  }
}
@media only screen and (max-width: 767px) {
  .blog-details-top .blog-details-content blockquote {
    font-size: 16px;
    line-height: 30px;
  }
}

.dec-img-wrapper {
  margin-top: 50px;
}
@media only screen and (max-width: 767px) {
  .dec-img-wrapper {
    margin-top: 30px;
  }
}
.dec-img-wrapper .dec-img img {
  width: 100%;
}
@media only screen and (max-width: 767px) {
  .dec-img-wrapper .dec-img.mb-50 {
    margin-bottom: 30px;
  }
}

.tag-share {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 30px 0 30px;
}
@media only screen and (max-width: 767px) {
  .tag-share {
    display: block;
    margin: 20px 0 25px;
  }
}
@media only screen and (max-width: 767px) {
  .tag-share .dec-tag {
    margin-bottom: 10px;
  }
}
.tag-share .dec-tag ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.tag-share .dec-tag ul li {
  margin-right: 10px;
  position: relative;
}
.tag-share .dec-tag ul li a {
  text-transform: capitalize;
  font-size: 15px;
}
.tag-share .blog-share {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.tag-share .blog-share span {
  font-size: 15px;
  text-transform: capitalize;
}
.tag-share .blog-share ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.tag-share .blog-share ul li {
  margin-left: 10px;
}
.tag-share .blog-share ul li a {
  font-size: 16px;
}

.next-previous-post {
  border-bottom: 1px solid #f1f1f1;
  border-top: 1px solid #f1f1f1;
  padding: 18px 0 17px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.next-previous-post a {
  font-size: 15px;
  text-transform: capitalize;
}

@media only screen and (max-width: 767px) {
  .blog-comment-wrapper.mt-55 {
    margin-top: 25px;
  }
}
.blog-comment-wrapper .blog-dec-title {
  font-size: 20px;
  font-weight: 600;
  margin: 0;
  text-transform: uppercase;
}
@media only screen and (max-width: 767px) {
  .blog-comment-wrapper .blog-dec-title {
    font-size: 18px;
  }
}
.blog-comment-wrapper .single-comment-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
@media only screen and (max-width: 767px) {
  .blog-comment-wrapper .single-comment-wrapper {
    display: block;
  }
  .blog-comment-wrapper .single-comment-wrapper.mt-35 {
    margin-top: 20px;
  }
  .blog-comment-wrapper .single-comment-wrapper.mt-50 {
    margin-top: 30px;
  }
}
.blog-comment-wrapper .single-comment-wrapper .blog-comment-img {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 120px;
          flex: 0 0 120px;
  margin-right: 28px;
}
@media only screen and (max-width: 767px) {
  .blog-comment-wrapper .single-comment-wrapper .blog-comment-img {
    margin-right: 28px;
    margin-bottom: 20px;
  }
}
.blog-comment-wrapper .single-comment-wrapper .blog-comment-img img {
  width: 100%;
}
@media only screen and (max-width: 767px) {
  .blog-comment-wrapper .single-comment-wrapper .blog-comment-img img {
    width: auto;
  }
}
.blog-comment-wrapper .single-comment-wrapper .blog-comment-content h4 {
  font-size: 16px;
  font-weight: 500;
  margin: 0;
  line-height: 1;
}
.blog-comment-wrapper .single-comment-wrapper .blog-comment-content span {
  display: block;
  font-size: 15px;
  margin: 6px 0 8px;
}
.blog-comment-wrapper .single-comment-wrapper .blog-comment-content p {
  font-size: 14px;
  margin-bottom: 10px;
}
.blog-comment-wrapper .single-comment-wrapper .blog-comment-content .blog-details-btn a {
  font-size: 14px;
  font-weight: 500;
  text-transform: capitalize;
}
@media only screen and (max-width: 767px) {
  .blog-comment-wrapper .single-comment-wrapper.ml-120 {
    margin-left: 0;
  }
}

@media only screen and (max-width: 767px) {
  .blog-reply-wrapper.mt-50 {
    margin-top: 30px;
  }
}
.blog-reply-wrapper .blog-dec-title {
  font-size: 20px;
  font-weight: 600;
  margin: 0;
  text-transform: uppercase;
}
@media only screen and (max-width: 767px) {
  .blog-reply-wrapper .blog-dec-title {
    font-size: 18px;
  }
}
.blog-reply-wrapper .blog-form {
  margin-top: 35px;
}
@media only screen and (max-width: 767px) {
  .blog-reply-wrapper .blog-form {
    margin-top: 20px;
  }
}
.blog-reply-wrapper .blog-form .leave-form input {
  background: transparent none repeat scroll 0 0;
  border: 1px solid #eaeaea;
  -webkit-box-shadow: none;
          box-shadow: none;
  color: #333;
  height: 45px;
  margin-bottom: 30px;
  padding-left: 20px;
}
.blog-reply-wrapper .blog-form .text-leave textarea {
  background: transparent none repeat scroll 0 0;
  border: 1px solid #eaeaea;
  -webkit-box-shadow: none;
          box-shadow: none;
  color: #333;
  height: 250px;
  padding-top: 20px;
  margin-bottom: 20px;
  padding-left: 20px;
}
.blog-reply-wrapper .blog-form .text-leave input {
  background-color: #000000;
  border: medium none;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-weight: 500;
  height: inherit;
  letter-spacing: 1px;
  margin-top: 10px;
  padding: 14px 30px 13px;
  width: inherit;
}
.blog-reply-wrapper .blog-form .text-leave input:hover {
  background-color: #333;
}

.nav-style-4.owl-carousel:hover .owl-nav button {
  opacity: 1;
  visibility: visible;
}

/*------ 24. login register Page  --------*/
.login-register-wrapper .login-register-tab-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 40px;
}
.login-register-wrapper .login-register-tab-list a {
  position: relative;
}
.login-register-wrapper .login-register-tab-list a::before {
  background-color: #454545;
  bottom: 5px;
  content: "";
  height: 18px;
  margin: 0 auto;
  position: absolute;
  right: -2px;
  -webkit-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
  width: 1px;
}
.login-register-wrapper .login-register-tab-list a h4 {
  font-size: 25px;
  font-weight: 700;
  margin: 0 20px;
  text-transform: capitalize;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.login-register-wrapper .login-register-tab-list a:last-child::before {
  display: none;
}
.login-register-wrapper .login-register-tab-list a.active h4 {
  color: #000000;
}
.login-register-wrapper .login-form-container {
  background: transparent none repeat scroll 0 0;
  -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
          box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
  padding: 80px;
  text-align: left;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .login-register-wrapper .login-form-container {
    padding: 80px 50px;
  }
}
@media only screen and (max-width: 767px) {
  .login-register-wrapper .login-form-container {
    padding: 40px 15px;
  }
}
.login-register-wrapper .login-form-container .login-register-form form input {
  background-color: transparent;
  border: 1px solid #ebebeb;
  color: #333;
  font-size: 14px;
  height: 45px;
  margin-bottom: 30px;
  padding: 0 15px;
}
.login-register-wrapper .login-form-container .login-register-form form input[type=checkbox] {
  height: 15px;
  margin: 0;
  position: relative;
  top: 1px;
  width: 17px;
}
.login-register-wrapper .login-form-container .login-register-form form .button-box .login-toggle-btn {
  padding: 10px 0 19px;
}
.login-register-wrapper .login-form-container .login-register-form form .button-box .login-toggle-btn label {
  color: #242424;
  font-size: 15px;
  font-weight: 400;
}
@media only screen and (max-width: 767px) {
  .login-register-wrapper .login-form-container .login-register-form form .button-box .login-toggle-btn label {
    font-size: 14px;
  }
}
.login-register-wrapper .login-form-container .login-register-form form .button-box .login-toggle-btn a {
  color: #242424;
  float: right;
  font-size: 15px;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
@media only screen and (max-width: 767px) {
  .login-register-wrapper .login-form-container .login-register-form form .button-box .login-toggle-btn a {
    font-size: 14px;
  }
}
.login-register-wrapper .login-form-container .login-register-form form .button-box .login-toggle-btn a:hover {
  color: #000000;
}
.login-register-wrapper .login-form-container .login-register-form form .button-box button {
  background-color: #f2f2f2;
  border: medium none;
  color: #333;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  padding: 11px 30px;
  text-transform: uppercase;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.login-register-wrapper .login-form-container .login-register-form form .button-box button:hover {
  background-color: #000000;
  color: #fff;
}

@media only screen and (max-width: 767px) {
  .login-register-area.pb-100 {
    padding-bottom: 60px;
  }
}

/*------ 25. My account Page  ------*/
.single-my-account {
  margin-bottom: 20px;
  border: 1px solid #ebebeb;
}
.single-my-account h3.panel-title {
  background-color: #f9f9f9;
  border-bottom: 1px solid #ebebeb;
  color: #000;
  font-size: 15px;
  font-weight: 500;
  margin: 0;
  position: relative;
  text-transform: uppercase;
}
@media only screen and (max-width: 767px) {
  .single-my-account h3.panel-title {
    line-height: 22px;
    font-size: 14px;
  }
}
.single-my-account h3.panel-title span {
  color: #242424;
  font-size: 15px;
  left: 20px;
  position: absolute;
  top: 16px;
}
.single-my-account h3.panel-title a {
  color: #242424;
  display: block;
  padding: 16px 55px;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .single-my-account h3.panel-title a {
    padding: 16px 30px 16px 40px;
  }
}
.single-my-account h3.panel-title a:hover {
  color: #000000;
}
.single-my-account h3.panel-title a::before {
  color: #000;
  content: "";
  display: inline-block;
  font-family: "FontAwesome";
  font-size: 16px;
  position: absolute;
  right: 10px;
  top: 19px;
}
.single-my-account h3.panel-title a:hover::before {
  color: #000000;
}
.single-my-account .myaccount-info-wrapper {
  padding: 30px 20px;
  background-color: #fff;
}
.single-my-account .myaccount-info-wrapper .account-info-wrapper {
  border-bottom: 1px solid #eaeaea;
  margin-bottom: 28px;
  padding-bottom: 30px;
}
.single-my-account .myaccount-info-wrapper .account-info-wrapper h4 {
  font-size: 15px;
  margin: 0;
  text-transform: uppercase;
}
.single-my-account .myaccount-info-wrapper .account-info-wrapper h5 {
  font-size: 16px;
  letter-spacing: 0.2px;
  margin-top: 7px;
}
.single-my-account .myaccount-info-wrapper .billing-info {
  margin-bottom: 20px;
}
.single-my-account .myaccount-info-wrapper .billing-info label {
  color: #000;
  font-size: 14px;
  text-transform: capitalize;
}
.single-my-account .myaccount-info-wrapper .billing-info input {
  background: transparent none repeat scroll 0 0;
  border: 1px solid #ebebeb;
  color: #000;
  height: 40px;
  padding: 0 15px;
}
.single-my-account .myaccount-info-wrapper .billing-back-btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin-top: 26px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.single-my-account .myaccount-info-wrapper .billing-back-btn .billing-back a {
  color: #000;
  display: inline-block;
  font-size: 14px;
  font-weight: 500;
  text-transform: uppercase;
}
.single-my-account .myaccount-info-wrapper .billing-back-btn .billing-back a:hover {
  color: #000000;
}
.single-my-account .myaccount-info-wrapper .billing-back-btn .billing-back a i {
  font-size: 16px;
  color: #000000;
}
.single-my-account .myaccount-info-wrapper .billing-back-btn .billing-btn button {
  background-color: #f2f2f2;
  border: medium none;
  color: #000;
  display: inline-block;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
  padding: 16px 35px 17px;
  text-transform: uppercase;
  cursor: pointer;
  -webkit-transition: all 0.3s ease 0s;
  -o-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.single-my-account .myaccount-info-wrapper .billing-back-btn .billing-btn button:hover {
  background: #000000;
  color: #fff;
}
.single-my-account .myaccount-info-wrapper .entries-wrapper {
  border: 1px solid #eaeaea;
  position: relative;
}
@media only screen and (max-width: 767px) {
  .single-my-account .myaccount-info-wrapper .entries-wrapper {
    padding: 30px 10px;
  }
  .single-my-account .myaccount-info-wrapper .entries-wrapper::before {
    display: none;
  }
}
.single-my-account .myaccount-info-wrapper .entries-wrapper::before {
  position: absolute;
  content: "";
  height: 100%;
  width: 1px;
  left: 50%;
  top: 0;
  background-color: #eaeaea;
}
.single-my-account .myaccount-info-wrapper .entries-wrapper .entries-info {
  padding: 30px 20px;
}
@media only screen and (max-width: 767px) {
  .single-my-account .myaccount-info-wrapper .entries-wrapper .entries-info {
    padding: 0 10px 30px;
  }
}
.single-my-account .myaccount-info-wrapper .entries-wrapper .entries-info p {
  color: #000;
  font-size: 15px;
  margin: 0;
  text-transform: capitalize;
}
.single-my-account .myaccount-info-wrapper .entries-wrapper .entries-edit-delete a {
  background-color: #000;
  color: #fff;
  display: inline-block;
  line-height: 1;
  margin: 0 2px;
  padding: 12px 15px;
  text-transform: uppercase;
  font-weight: 500;
}
.single-my-account .myaccount-info-wrapper .entries-wrapper .entries-edit-delete a:hover {
  background-color: #000000;
}
.single-my-account .myaccount-info-wrapper .entries-wrapper .entries-edit-delete a.edit {
  background-color: #df5c39;
}
.single-my-account .myaccount-info-wrapper .entries-wrapper .entries-edit-delete a.edit:hover {
  background-color: #000000;
}

.error h1 {
  font-size: 17rem;
  font-weight: bold;
  letter-spacing: 1rem;
  line-height: 1.1;
  margin-bottom: 30px;
  color: #000000;
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .error h1 {
    font-size: 15rem;
    margin-bottom: 4px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .error h1 {
    font-size: 12rem;
  }
}
@media only screen and (max-width: 767px) {
  .error h1 {
    font-size: 7rem;
    line-height: 88px;
  }
}
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .error h1 {
    font-size: 9rem;
    line-height: 100px;
  }
}
.error h2 {
  font-size: 25px;
  font-weight: 600;
}

.error-btn {
  position: relative;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  color: #fff;
  font-size: 16px;
  min-width: 184px;
  min-height: 55px;
  line-height: 55px;
  margin-bottom: 6px;
  padding: 0 10px;
  border: none;
  border-radius: 0;
  background-color: #000000;
  display: inline-block;
}
.error-btn:after {
  position: absolute;
  content: "";
  left: 0;
  bottom: -6px;
  height: 3px;
  width: 100%;
  background-color: #000000;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}
.error-btn:hover {
  background-color: #111111;
  color: #fff;
}
.error-btn:hover:after {
  background-color: #111111;
}

.searchform {
  position: relative;
}
.searchform input {
  border: 1px solid #eeeeee;
  height: 45px;
  width: 100%;
  padding-left: 15px;
  padding-right: 80px;
  background-color: transparent;
}
.searchform button {
  border: none;
  background-color: #000000;
  width: 70px;
  color: #fff;
  cursor: pointer;
  position: absolute;
  right: 0;
  top: 0;
  height: 100%;
}
.searchform button:hover {
  background-color: #000;
}
@media only screen and (max-width: 767px) {
  .searchform.mb-50 {
    margin-bottom: 20px;
  }
}








.product-action-2 a .fa {
	
	  margin-top:10px !important;
}

.error {
	border-bottom:2px solid red !important;
}

.emailActive{
	transform:translateY(-6px);
	font-size:12px;
	cursor:pointer;
	
}












.cardWrap1 {
  width: 27em;
  color: #fff;
  font-family: sans-serif;
  margin: 0 auto !important;
  cursor:pointer;
  position:relative !important;
  margin-bottom:20px !important;
}

.card1 {
  background: linear-gradient(to bottom, #000000 0%, #000000 26%, #dbdcdd 26%, #dbdcdd 100%);
  height: 220px;
  float: left;
 position:relative !important;
  padding: 1em;
 padding-left: 0.5em;
    padding-right: 0.5em;
}
.cardLong{
	height:240px !important;
}
.cardLeft1 {
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
  width: 16em;
}

.cardRight1 {
  width: 9.5em;
  border-left: 0.18em dashed #fff;
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}
.cardRight1:before, .cardRight1:after {
  content: "";
  position: absolute;
  display: block;
  width: 0.9em;
  height: 0.9em;
  background: #fff;
  border-radius: 50%;
  left: -0.5em;
}
.cardRight1:before {
  top: -0.4em;
}
.cardRight1:after {
  bottom: -0.4em;
}

.h1 {
  font-size: 1.4em;
  margin-top: 0;
  color:white;
}
.h1 span {
  font-weight: normal;
  
}

.title1, .name1, .seat, .time, .time1 {
  text-transform: uppercase;
  font-weight: normal;
}
.title1 .h2, .name1 h2, .seat .h2, .time .h2 , .time1 .h2 {
  font-size: 0.9em;
  color: #525252;
  margin: 0;
}
.title1 span, .name1 span, .seat span, .time span {
  font-size: 0.7em;
  color: #a2aeae;
}

.title1 {
  margin: 2em 0 0 0;
}

.name1, .seat {
  margin: 0.7em 0 0 0;
}

.time {
  margin: 0.7em 0 0 1em;
}

.time1 {
  margin: 0.7em 0 0 0;
}


.seat, .time, .time1 {
  float: left;
}

.eye {
  position: relative;
  width: 2em;
  height: 1.5em;
  background: #fff;
  margin: 0 auto;
  border-radius: 1em/0.6em;
  z-index: 1;
}
.eye:before, .eye:after {
  content: "";
  display: block;
  position: absolute;
  border-radius: 50%;
}
.eye:before {
  width: 1em;
  height: 1em;
  background: #000000;
  z-index: 2;
  left: 8px;
  top: 4px;
}
.eye:after {
  width: 0.5em;
  height: 0.5em;
  background: #fff;
  z-index: 3;
  left: 12px;
  top: 8px;
}

.number {
  text-align: center;
  text-transform: uppercase;
}
.number .h3 {
  color: #000000;
  margin: 0.9em 0 0 0;
  font-size: 2.0em;
}
.number span {
  display: block;
  color: #a2aeae;
}


.footerTicker{
	position:absolute;
	bottom:1px;
	left:13px;
	
}
.footerTicker > p {
	font-size: 0.8em;
	color: #000;
}

.qr {
	position:relative !important;
	
	width:100% !important;
	margin-top:10px !important;
}
.qr > img{
	height:40px;
	margin-left:50% !important;
	transform:translateX(-50%) !important;
}
@media  (max-width: 600px) {
	.cardLeft1{
		max-width:61% !important;
	}
	.cardRight1 {
		width:130px !important;
	}
	
	.cardWrap1 {
		width: 100%;
		margin-left:0px !important;
		
}
	.tableTipo{
		display:none !important;
	}
	
	#imgModal{
		display:none;
	}
	.titleH2 {
		margin-top:10px
		font-size:18px !important;
	}
	html, body {
 overflow-x: hidden;
    width: 100%;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
}

body {
  font-size: 16px;
}
input[type="text"] {
  font-size: inherit;
}

.card1 {
  background: linear-gradient(to bottom, #000000 0%, #000000 26%, #dbdcdd 26%, #dbdcdd 100%);
  height: 240px !important;
  float: left;
 position:relative !important;
  padding: 1em;
 
}
/*Altura tarjetas abonos*/	
.cardLong{
	height:280px !important;
}
/*Fin Altura tarjetas abonos*/	


.header-area {
	display:none !important;
}
}



option:disabled {
  color: #f69999;
 
}

.tarifaDisabled {
	opacity:0.3;
}
.tarifaDisabled .default-img {
	width:60px !important;
	margin-left:50% !important;
	transform:translateX(-50%);
}

.reservaDisabled{
	opacity:0.5;
}

/*CCS JB*/

/*boton "entrar"*/
.pro-details-cart.btn-hover {
    width: 100%!important;
    padding-left: 15px!important;
}
.pro-details-cart.btn-hover>a#btnLogin {
    background: #000000!important;
    color: white!important;
    border: 1px solid #000000!important;
}
.pro-details-cart.btn-hover>a#btnLogin1 {
    background: #000000!important;
    color: white!important;
    border: 1px solid #000000!important;
}
.btnPrimary {
	 background: #000000!important;
    color: white!important;
    border: 1px solid #000000!important;
}

.pro-details-cart.btn-hover>a#btnEnviar {
    background: #000000!important;
    color: white!important;
    border: 1px solid #000000!important;
}
.pro-details-cart.btn-hover>a#btnRegistrar {
    background: #000000!important;
    color: white!important;
    border: 1px solid #000000!important;
}
/*fin boton "entrar"*/

/*text "Restablecer mi contraseña" margen*/
.col-lg-12 .col-md-12 >.row {
    margin-left: 0px!important;
}
/*Fin text "Restablecer mi contraseña" margen*/

/*Cabecera comun*/

/*.jbheader{display:none;}*/ /*AQUI OCULTO CABECERA EN ORDENADOR*/

/*oculto el solo moviles @media  (max-width: 600px) { */

/* TO-DO: Todos los colores de aquí están hardcodeados en vez de venir del servidor */

/* =========================================================
   HEADER · ESTRUCTURA GENERAL
   ========================================================= */

.header-area1.header-hm9.transparent-bar {
    position: sticky !important;
    top: 0 !important;
    z-index: 9999 !important;
    width: 100% !important;
    margin-bottom: 24px !important;

    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    overflow: visible !important;
}

.header-area1.clearfix {
    border: none !important;
}

.header-area1 .container {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 28px !important;
    padding-right: 28px !important;
    overflow: visible !important;
}

/* Oculta el hueco antiguo que dejaba el theme debajo del header */
header + .col-md-12 {
    display: none !important;
}


/* =========================================================
   HEADER · FRANJA SUPERIOR MORADA
   ========================================================= */

.jbheader {
    display: flex !important;
    align-items: center !important;
    min-height: 74px;
    padding: 0 28px !important;
    position: relative !important;
    z-index: 10000 !important;

    background: linear-gradient(135deg, #000000 0%, #000000 52%, #2e2e2e 100%) !important;
    border: none !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.22);
}

p.jbheadertxt {
    margin: 0 !important;
    color: #ffffff !important;
    text-align: left !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.08);

    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    letter-spacing: -0.02em;
}


/* =========================================================
   HEADER · FRANJA BLANCA INFERIOR
   ========================================================= */

.header-hm9 .header-top-area {
    display: flex;
    align-items: center;
    position: relative !important;
    z-index: 10000 !important;
    overflow: visible !important;

    margin-top: 0 !important;
    padding: 14px 18px !important;
    border: 1px solid rgba(108, 122, 194, 0.10) !important;
    border-top: none !important;
    border-radius: 0 0 20px 20px;
    box-shadow: 0 12px 26px rgba(27, 39, 94, 0.08);

    background: rgba(255, 255, 255, 0.96) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.header-top-border17 {
    border: none !important;
}


/* =========================================================
   HEADER · LAYOUT INTERNO
   ========================================================= */

.header-hm9 .header-top-area .row {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    min-height: 56px;
    margin: 0 !important;
    gap: 8px !important;
}

.header-hm9 .header-top-area .row > .col-lg-10,
.header-hm9 .header-top-area .row > .col-md-10,
.header-hm9 .header-top-area .row > .col-10,
.header-hm9 .header-top-area .row > .col-lg-2,
.header-hm9 .header-top-area .row > .col-md-2,
.header-hm9 .header-top-area .row > .col-2,
.header-hm9 .header-top-area .row > .header-main-column,
.header-hm9 .header-top-area .row > .header-actions-column {
    display: flex !important;
    align-items: center !important;
    min-height: 56px;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

/* Zona izquierda */
.header-hm9 .header-top-area .col-lg-10,
.header-hm9 .header-top-area .col-md-10,
.header-hm9 .header-top-area .col-10,
.header-hm9 .header-top-area .header-main-column {
    flex: 1 1 auto !important;
    max-width: none !important;
    min-width: 0 !important;
    justify-content: flex-start !important;
    padding-right: 0 !important;
}

/* Zona derecha */
.header-hm9 .header-top-area .col-lg-2,
.header-hm9 .header-top-area .col-md-2,
.header-hm9 .header-top-area .col-2,
.header-hm9 .header-top-area .header-actions-column {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    margin-left: auto !important;
    justify-content: flex-end !important;
    padding-left: 0 !important;
    padding-right: 2px !important;
}


/* =========================================================
   HEADER · WRAPPERS INTERNOS
   ========================================================= */

.header-right-wrap {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 56px;
    margin: 0 !important;
    padding: 0 !important;
    gap: 12px;
}

.header-main-column > .header-right-wrap {
    width: 100% !important;
    min-width: 0 !important;
}

.header-main-column .same-style.account-satting {
    width: 100% !important;
    min-width: 0 !important;
}

.header-main-column .same-style.account-satting > a {
    width: 100% !important;
    min-width: 0 !important;
    justify-content: flex-start !important;
}

.header-main-column .same-style.account-satting > a .emailActive,
.header-main-column .same-style.account-satting > a label.emailActive {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.header-actions-column .header-right-wrap.header-cart-actions {
    flex-wrap: nowrap !important;
    gap: 6px !important;
}

.header-actions-column .header-right-wrap.header-cart-actions .same-style.account-satting {
    flex: 0 0 auto !important;
    min-height: 46px !important;
    width: auto !important;
    margin: 0 !important;
}

.header-actions-column .header-right-wrap.header-cart-actions .same-style.account-satting > a {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 12px !important;
}

.header-actions-column .header-right-wrap.header-cart-actions .header-action-link label {
    color: #1f2a56 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

.col-lg-2 .header-right-wrap,
.col-md-2 .header-right-wrap,
.col-2 .header-right-wrap,
.header-actions-column .header-right-wrap {
    width: auto !important;
    justify-content: flex-end !important;
}


/* =========================================================
   HEADER · BOTONES PRINCIPALES
   ========================================================= */

.same-style.account-satting {
    display: flex !important;
    align-items: center !important;
    position: relative;
    width: auto;
    min-height: 56px;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
}

.same-style.account-satting > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;

    height: 46px !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;

    line-height: 1 !important;
    vertical-align: middle !important;
    text-decoration: none !important;

    border-radius: 14px;
    border: 1px solid #e4e9f7;
    background: #f6f8ff;
    color: #1f2a56 !important;
    box-shadow: 0 2px 6px rgba(27, 39, 94, 0.03);
    transition: all 0.25s ease;
}

.same-style.account-satting > a:hover {
    background: #eef2ff;
    border-color: #cfd8fb;
    transform: translateY(-1px);
    box-shadow: 0 8px 16px rgba(63, 71, 168, 0.10);
}


/* =========================================================
   HEADER · BOTÓN CARRITO
   ========================================================= */

.col-lg-2 .same-style.account-satting,
.col-md-2 .same-style.account-satting,
.col-2 .same-style.account-satting,
.header-actions-column .same-style.account-satting {
    width: 100% !important;
    justify-content: flex-end !important;
    margin-left: auto !important;
}

.col-lg-2 .same-style.account-satting > a,
.col-md-2 .same-style.account-satting > a,
.col-2 .same-style.account-satting > a,
.header-actions-column .same-style.account-satting > a {
    width: 46px !important;
    min-width: 46px !important;
    padding: 0 !important;
    margin-left: auto !important;
    margin-right: 4px !important;
}


/* =========================================================
   HEADER · ICONOS Y TEXTO DEL USUARIO
   ========================================================= */

.same-style.account-satting > a i,
.pe-7s-menu,
.pe-7s-cart,
.pe-7s-home {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 22px !important;
    height: 22px !important;
    margin: 0 !important;
    padding: 0 !important;

    font-size: 22px !important;
    line-height: 1 !important;
    color: #000000 !important;
    vertical-align: middle !important;

    position: static !important;
    transform: none !important;
}

.pe-7s-menu:before,
.pe-7s-cart:before,
.pe-7s-home:before {
    display: block;
    line-height: 1 !important;
}

.same-style.account-satting > a .emailActive,
.same-style.account-satting > a label.emailActive {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    height: 22px !important;
    margin: 0 !important;
    padding: 0 !important;
    position: static !important;
    vertical-align: middle !important;

    color: #243056 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1 !important;
}

.same-style.account-satting > a label,
.same-style.account-satting > a span {
    margin: 0 !important;
    line-height: 1.2 !important;
    vertical-align: middle !important;
}

.same-style.account-satting > a label {
    font-size: 14px !important;
    font-weight: 600 !important;
    white-space: nowrap;
}

.same-style.account-satting > a .emailActive:empty {
    display: none !important;
}

.same-style.account-satting > a * {
    transform: none !important;
}


/* =========================================================
   HEADER · DROPDOWN DE USUARIO
   ========================================================= */

.account-dropdown {
    position: absolute !important;
    top: calc(100% + 4px) !important;
    left: 0;
    z-index: 9999;

    min-width: 250px;
    padding: 6px 0 !important;
    overflow: hidden;

    background: #ffffff !important;
    border: 1px solid rgba(95, 110, 180, 0.14);
    border-radius: 16px !important;
    box-shadow: 0 22px 48px rgba(19, 30, 79, 0.14);
}

.account-dropdown ul {
    margin: 0 !important;
    padding: 4px !important;
    list-style: none !important;
}

.account-dropdown ul li {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;

    color: #223056;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px;
    line-height: 1.25 !important;
}

/* Bloque de bienvenida */
.account-dropdown ul li:first-child {
    padding: 10px 12px 6px 12px !important;
    color: #5b678b !important;

    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.35 !important;
}

.account-dropdown ul li:first-child b {
    color: #202b52 !important;

    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

/* Separador */
.account-dropdown ul li hr {
    margin: 6px 8px !important;
    border: none;
    border-top: 1px solid #edf1f7;
}

/* Enlaces */
.account-dropdown ul li a {
    display: block;
    margin: 1px 4px !important;
    padding: 9px 12px !important;
    border-radius: 10px !important;

    color: #25315b !important;
    text-decoration: none !important;
    transition: all 0.2s ease;

    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 500;
    line-height: 1.25 !important;
}

.account-dropdown ul li a:hover {
    background: #f3f6ff;
    color: #4453c7 !important;
    transform: translateX(2px);
}


/* =========================================================
   BOTONES SUPERIORES DE ACCESO (ARC-botones)
   ========================================================= */

.ARC-botones {
    display: inline-block;
    float: left;
    width: calc(33.333% - 10px);
    margin: 0 5px 20px 5px;
    vertical-align: top;
    position: relative;
    z-index: 20;
}

.ARC-botones:nth-of-type(3n+1) {
    clear: left;
}

.ARC-botones .btn {
    display: flex !important;
    align-items: center;
    justify-content: center;

    width: 100% !important;
    min-height: 44px;

    border-radius: 12px;
    font-weight: 700;

    position: relative;
    z-index: 30;
    pointer-events: auto !important;
}

/* Evita que pseudo-elementos o capas tapen el click */
.ARC-botones::before,
.ARC-botones::after,
.ARC-botones .btn::before,
.ARC-botones .btn::after {
    pointer-events: none !important;
}


/* =========================================================
   RESALTADO DE TEXTO
   ========================================================= */

.resaltarLista {
    background-color: rgba(190, 245, 200, 0.25);
}

.resaltarLista:hover {
    text-decoration: none !important;
}


/* =========================================================
   ACORDEONES · CONTENEDOR GENERAL
   ========================================================= */

.panel-default.single-my-account {
    margin-bottom: 14px !important;
    overflow: hidden;

    background: #ffffff;
    border: 1px solid #e9edf5 !important;
    border-radius: 16px !important;
    box-shadow: 0 6px 18px rgba(33, 45, 94, 0.04);
}

/* Cabecera */
.panel-default.single-my-account .panel-heading,
.panel-default.single-my-account .panel-title {
    background: #ffffff !important;
}

.panel-default.single-my-account .panel-title a {
    display: block;
    padding: 18px 22px !important;

    color: #25315b !important;
    text-decoration: none !important;
    letter-spacing: 0.01em;

    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}


/* =========================================================
   ACORDEONES · CUERPO INTERNO
   ========================================================= */

.panel-default.single-my-account .panel-body {
    padding: 22px !important;

    background: #fbfcff !important;
    border-top: 1px solid #eef2f8 !important;
}

/* Filas internas */
.panel-default.single-my-account .panel-body .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Columnas internas */
.panel-default.single-my-account .panel-body [class*="col-"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Bloques de contenido interno */
.panel-default.single-my-account .billing-info-wrap,
.panel-default.single-my-account .billing-info {
    margin-top: 12px;
    padding: 18px !important;

    background: #ffffff;
    border: 1px solid #e8edf7;
    border-radius: 14px;
    box-shadow: 0 2px 8px rgba(30, 41, 88, 0.03);
}

/* Títulos internos */
.panel-default.single-my-account .panel-body h2,
.panel-default.single-my-account .panel-body h3,
.panel-default.single-my-account .panel-body h4 {
    margin-top: 0 !important;
    margin-bottom: 14px !important;

    color: #1f2a56 !important;

    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

/* Texto general del cuerpo */
.panel-default.single-my-account .panel-body,
.panel-default.single-my-account .panel-body p,
.panel-default.single-my-account .panel-body span,
.panel-default.single-my-account .panel-body label {
    color: #4a5678;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    line-height: 1.5 !important;
}

/* Botones dentro del contenido desplegado */
.panel-default.single-my-account .panel-body .btn,
.panel-default.single-my-account .panel-body .btn-danger {
    min-height: 46px;
    padding: 0 18px !important;
    border-radius: 12px !important;
    box-shadow: 0 8px 18px rgba(225, 59, 75, 0.14);

    font-weight: 700 !important;
    letter-spacing: 0.01em;
}

/* Separadores */
.panel-default.single-my-account .panel-body hr {
    margin: 16px 0 !important;
    border: none;
    border-top: 1px solid #edf1f7;
}

/* Ajuste para textos inline centrados */
.panel-default.single-my-account .panel-body [style*="text-align:center"] {
    padding-left: 8px;
    padding-right: 8px;
}

/* Botón específico "Comprar eventos" */
.btnComprarEventos {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 46px !important;
    padding: 0 18px !important;
    line-height: 1 !important;
}


/* =========================================================
   RESPONSIVE · TABLET Y MÓVIL
   ========================================================= */

@media (max-width: 991px) {
    .jbheader {
        min-height: 66px;
        padding: 0 18px !important;
    }

    p.jbheadertxt {
        font-size: 18px !important;
    }

    .header-area1 .container {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .header-hm9 .header-top-area {
        padding: 12px !important;
        border-radius: 0 0 16px 16px;
    }

    .same-style.account-satting > a {
        min-height: 42px !important;
        height: 42px !important;
        padding: 0 12px !important;
        border-radius: 12px;
    }

    .same-style.account-satting > a .emailActive {
        max-width: 180px;
        font-size: 13px !important;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .account-dropdown {
        min-width: 220px;
    }
}

@media (max-width: 600px) {
    /* Header */
    .header-area1.header-hm9.transparent-bar {
        margin-bottom: 10px !important;
    }

    .jbheader {
        min-height: 62px;
        padding: 0 14px !important;
    }

    p.jbheadertxt {
        font-size: 17px !important;
    }

    .header-area1 .container {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .header-hm9 .header-top-area {
        padding: 10px !important;
    }

    /* Botón usuario del header */
    .same-style.account-satting > a {
        gap: 8px !important;
        padding: 0 10px !important;
    }

    .same-style.account-satting > a i,
    .pe-7s-menu,
    .pe-7s-cart,
    .pe-7s-home {
        font-size: 20px !important;
    }

    .same-style.account-satting > a .emailActive {
        max-width: 120px;
        font-size: 12px !important;
    }

    /* Permite que el botón del usuario crezca según el correo */
    .header-hm9 .header-top-area .col-10,
    .header-hm9 .header-top-area .header-main-column {
        min-width: 0 !important;
    }

    .header-hm9 .header-top-area .col-10 .header-right-wrap,
    .header-hm9 .header-top-area .header-main-column .header-right-wrap {
        width: auto !important;
        min-width: 0 !important;
    }

    .header-hm9 .header-top-area .col-10 .same-style.account-satting,
    .header-hm9 .header-top-area .header-main-column .same-style.account-satting {
        min-width: 0 !important;
        max-width: calc(100vw - 102px) !important;
    }

    .header-hm9 .header-top-area .col-10 .same-style.account-satting > a,
    .header-hm9 .header-top-area .header-main-column .same-style.account-satting > a {
        width: 100% !important;
        max-width: 100% !important;
        justify-content: flex-start !important;
        padding: 0 12px !important;
    }

    .header-hm9 .header-top-area .col-10 .same-style.account-satting > a .emailActive,
    .header-hm9 .header-top-area .col-10 .same-style.account-satting > a label.emailActive,
    .header-hm9 .header-top-area .header-main-column .same-style.account-satting > a .emailActive,
    .header-hm9 .header-top-area .header-main-column .same-style.account-satting > a label.emailActive {
        max-width: 120px !important;
        width: auto !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        flex: 0 1 auto !important;
    }

    .header-hm9 .header-top-area .header-actions-column {
        flex: 0 0 auto !important;
        padding-left: 4px !important;
    }

    .header-actions-column .header-right-wrap.header-cart-actions {
        gap: 5px !important;
    }

    .header-actions-column .header-right-wrap.header-cart-actions .same-style.account-satting > a {
        width: 36px !important;
        min-width: 36px !important;
        height: 36px !important;
        min-height: 36px !important;
        border-radius: 11px !important;
    }

    /* Dropdown */
    .account-dropdown {
        left: 0 !important;
        right: auto !important;
        min-width: 210px;
    }

    /* ARC botones */
    .ARC-botones {
        float: none;
        display: block;
        width: 100%;
        margin: 6px 0 12px 0;
    }

    .ARC-botones:nth-of-type(3n+1) {
        clear: none;
    }

    /* Acordeones */
    .panel-default.single-my-account .panel-title a {
        padding: 16px 18px !important;
        font-size: 13px !important;
    }

    .panel-default.single-my-account .panel-body {
        padding: 16px !important;
    }

    .panel-default.single-my-account .billing-info-wrap,
    .panel-default.single-my-account .billing-info {
        padding: 14px !important;
        border-radius: 12px;
    }
}

/* ===== DASHBOARD GRID ===== */
.dashboard-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    align-items: start;
}

/* Cards normales */
.dashboard-grid > .dashboard-card {
    width: 100%;
}

/* Cards grandes */
.dashboard-grid > .dashboard-card.dashboard-card-lg {
    grid-column: 1 / -1;
}

/* Móvil */
@media (max-width: 768px) {
    .dashboard-grid {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   FUTURAS ACTIVIDADES · FIX VISUAL DEFINITIVO
   ========================================================= */

/* Card exterior */
.product-wrap {
    padding: 14px !important;
    border: 1px solid #e7ecf5 !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 8px 22px rgba(31, 42, 86, 0.05) !important;
    overflow: hidden;
}

/* Caja interior */
.product-img {
    padding: 18px !important;
    border: 1px solid #eef2f8 !important;
    border-radius: 16px !important;
    background: #fcfdff !important;
    margin-bottom: 0 !important;
}

/* Badge superior: deja de ser una bolita ilegible */
.personaUso {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    max-width: 100%;
    min-height: 40px;
    margin: 0 0 18px 0 !important;
    padding: 8px 14px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, rgba(46, 46, 46, 0.20) 0%, rgba(0, 0, 0, 0.12) 100%) !important;
    color: #000000 !important;
    box-shadow: none !important;

    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;

    white-space: normal !important;
    text-align: left !important;
}

/* Nombre de la actividad / título principal */
.product-content h2,
.product-content h3,
.product-wrap h2,
.product-wrap h3 {
    margin-top: 0 !important;
    margin-bottom: 12px !important;
    color: #1d2b63 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
}

.product-content h2,
.product-wrap h2 {
    font-size: 17px !important;
}

.product-content h3,
.product-wrap h3 {
    font-size: 15px !important;
}

/* Títulos clicables */
.product-content h2 a,
.product-content h3 a,
.product-wrap h2 a,
.product-wrap h3 a {
    color: #1d2b63 !important;
    text-decoration: none !important;
}

/* Línea separadora sutil */
.product-wrap hr,
.product-img hr {
    margin: 14px 0 !important;
    border: none;
    border-top: 1px solid #edf1f7;
}

/* Subtítulo "ABRIR ACCESOS" */
.product-wrap h4,
.product-content h4 {
    margin: 12px 0 12px 0 !important;
    color: #27366d !important;
    text-align: center !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

/* Botones amarillos: centrado real del texto */
.btnAbrirPuerta,
.btnAbrirPista {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    min-height: 44px !important;
    margin: 0 0 10px 0 !important;
    padding: 10px 14px !important;

    border: none !important;
    border-radius: 12px !important;
    background: linear-gradient(180deg, #ffd54a 0%, #ffc107 100%) !important;
    color: #3b2d00 !important;
    text-decoration: none !important;
    text-align: center !important;
    box-shadow: 0 6px 16px rgba(255, 193, 7, 0.18) !important;

    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;

    white-space: normal !important;

    /* anulamos cosas heredadas problemáticas */
    margin-left: 0 !important;
    transform: none !important;
    left: auto !important;
}

/* Si dentro hay iconos o spans, centrarlos también */
.btnAbrirPuerta *,
.btnAbrirPista * {
    line-height: 1.2 !important;
    vertical-align: middle !important;
}

/* Fechas al pie */
.product-img h5[style*="text-align:center"],
.product-wrap h5[style*="text-align:center"] {
    margin: 12px 0 0 0 !important;
    color: #69779a !important;
    text-align: center !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
}

/* Precio si aparece */
.product-price span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
    border-radius: 999px;
    background: #ecfdf3;
    color: #157347 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

/* Bloque de contenido inferior limpio */
.product-content {
    padding: 0 !important;
}

/* Móvil */
@media (max-width: 600px) {
    .product-wrap {
        padding: 10px !important;
        border-radius: 14px !important;
    }

    .product-img {
        padding: 14px !important;
        border-radius: 14px !important;
    }

    .personaUso {
        min-height: 36px;
        padding: 7px 12px !important;
        font-size: 12px !important;
    }

    .product-content h2,
    .product-wrap h2 {
        font-size: 16px !important;
    }

    .product-content h3,
    .product-wrap h3 {
        font-size: 14px !important;
    }

    .btnAbrirPuerta,
    .btnAbrirPista {
        min-height: 42px !important;
        padding: 9px 12px !important;
        font-size: 12px !important;
    }
}

/* =========================================================
   FUTURAS ACTIVIDADES · FIX VISUAL DEFINITIVO
   ========================================================= */

/* Card exterior */
.product-wrap {
    padding: 14px !important;
    border: 1px solid #e7ecf5 !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 8px 22px rgba(31, 42, 86, 0.05) !important;
    overflow: hidden;
}

/* Caja interior */
.product-img {
    padding: 18px !important;
    border: 1px solid #eef2f8 !important;
    border-radius: 16px !important;
    background: #fcfdff !important;
    margin-bottom: 0 !important;
}

.personaUso {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    width: 100% !important;

    margin: 0 0 16px 0 !important;
    padding: 10px 14px !important;

    border-radius: 10px !important;

    background: rgba(0, 0, 0, 0.08) !important;
    border: 1px solid rgba(0, 0, 0, 0.25) !important;
    color: #000000 !important;

    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;

    line-height: 1.2 !important; 
    min-height: 38px; 

    text-align: left !important;
    white-space: normal !important;
}

/* Nombre de la actividad / título principal */
.product-content h2,
.product-content h3,
.product-wrap h2,
.product-wrap h3 {
    margin-top: 0 !important;
    margin-bottom: 12px !important;
    color: #1d2b63 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
}

.product-content h2,
.product-wrap h2 {
    font-size: 17px !important;
}

.product-content h3,
.product-wrap h3 {
    font-size: 15px !important;
}

/* Títulos clicables */
.product-content h2 a,
.product-content h3 a,
.product-wrap h2 a,
.product-wrap h3 a {
    color: #1d2b63 !important;
    text-decoration: none !important;
}

/* Línea separadora sutil */
.product-wrap hr,
.product-img hr {
    margin: 14px 0 !important;
    border: none;
    border-top: 1px solid #edf1f7;
}

/* Subtítulo "ABRIR ACCESOS" */
.product-wrap h4,
.product-content h4 {
    margin: 12px 0 12px 0 !important;
    color: #27366d !important;
    text-align: center !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.btnAbrirPuerta,
.btnAbrirPista {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 100% !important;
    min-height: 44px !important;
    margin: 0 0 10px 0 !important;
    padding: 10px 14px !important;

    border-radius: 12px !important;

    background: rgba(0, 0, 0, 0.08) !important;
    border: 1px solid rgba(0, 0, 0, 0.25) !important;
    color: #000000 !important;

    text-decoration: none !important;
    text-align: center !important;

    box-shadow: none !important;

    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;

    white-space: normal !important;

    margin-left: 0 !important;
    transform: none !important;

    transition: all 0.2s ease;
}

/* Hover suave */
.btnAbrirPuerta:hover,
.btnAbrirPista:hover {
    background: rgba(0, 0, 0, 0.15) !important;
    border-color: rgba(0, 0, 0, 0.35) !important;
    color: #000000 !important;
}

/* Fechas al pie */
.product-img h5[style*="text-align:center"],
.product-wrap h5[style*="text-align:center"] {
    margin: 12px 0 0 0 !important;
    color: #69779a !important;
    text-align: center !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
}

/* Precio si aparece */
.product-price span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
    border-radius: 999px;
    background: #ecfdf3;
    color: #157347 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

/* Bloque de contenido inferior limpio */
.product-content {
    padding: 0 !important;
}

/* Móvil */
@media (max-width: 600px) {
    .product-wrap {
        padding: 10px !important;
        border-radius: 14px !important;
    }

    .product-img {
        padding: 14px !important;
        border-radius: 14px !important;
    }

    .personaUso {
        min-height: 36px;
        padding: 7px 12px !important;
        font-size: 12px !important;
    }

    .product-content h2,
    .product-wrap h2 {
        font-size: 16px !important;
    }

    .product-content h3,
    .product-wrap h3 {
        font-size: 14px !important;
    }

    .btnAbrirPuerta,
    .btnAbrirPista {
        min-height: 42px !important;
        padding: 9px 12px !important;
        font-size: 12px !important;
    }
}

/* =========================================================
   TABLA "VER TUS ACCESOS" · REDISEÑO MODERNO
   ========================================================= */

/* Contenedor general del bloque DataTables */
#log_sessions_wrapper,
.dataTables_wrapper {
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
}

/* Caja exterior de la tabla */
#log_sessions_wrapper {
    padding: 14px !important;
    border: 1px solid #e7ecf5 !important;
    border-radius: 16px !important;
    background: #ffffff !important;
    box-shadow: 0 6px 18px rgba(31, 42, 86, 0.05) !important;
}

/* Parte superior: buscador */
#log_sessions_wrapper .dataTables_filter {
    margin-bottom: 14px !important;
    text-align: left !important;
}

#log_sessions_wrapper .dataTables_filter label {
    display: flex !important;
    align-items: center !important;
    gap: 10px;
    color: #4a5678 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
}

#log_sessions_wrapper .dataTables_filter input {
    min-height: 40px;
    padding: 8px 12px !important;
    border: 1px solid #dbe3f0 !important;
    border-radius: 12px !important;
    background: #fbfcff !important;
    box-shadow: none !important;
    color: #1f2a56 !important;
    font-size: 13px !important;
    outline: none !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

#log_sessions_wrapper .dataTables_filter input:focus {
    border-color: #2e2e2e !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.08) !important;
}

/* Scroll de la tabla */
#log_sessions_wrapper .dataTables_scroll {
    border: 1px solid #edf1f7 !important;
    border-radius: 14px !important;
    overflow: hidden !important;
    background: #ffffff !important;
}

#log_sessions_wrapper .dataTables_scrollHead {
    border-bottom: 1px solid #e8edf6 !important;
    background: linear-gradient(180deg, #fbfcff 0%, #f5f8fe 100%) !important;
}

#log_sessions_wrapper .dataTables_scrollBody {
    background: #ffffff !important;
}

/* Tabla base */
#log_sessions,
#log_sessions.dataTable {
    width: 100% !important;
    margin: 0 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    color: #243056 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
}

/* Cabecera */
#log_sessions thead th,
#log_sessions.dataTable thead th {
    padding: 14px 12px !important;
    border: none !important;
    border-bottom: 1px solid #e8edf6 !important;
    background: transparent !important;
    color: #243056 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-transform: none !important;
    white-space: nowrap;
}

/* Filas */
#log_sessions tbody tr,
#log_sessions.dataTable tbody tr {
    transition: background 0.18s ease;
}

#log_sessions tbody tr:nth-child(even),
#log_sessions.dataTable tbody tr:nth-child(even) {
    background: #fafcff !important;
}

#log_sessions tbody tr:hover,
#log_sessions.dataTable tbody tr:hover {
    background: #f3f7ff !important;
}

/* Celdas */
#log_sessions tbody td,
#log_sessions.dataTable tbody td {
    padding: 14px 12px !important;
    border: none !important;
    border-bottom: 1px solid #eef2f8 !important;
    color: #435070 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.45 !important;
    vertical-align: middle !important;
}

/* Última fila sin borde fuerte */
#log_sessions tbody tr:last-child td,
#log_sessions.dataTable tbody tr:last-child td {
    border-bottom: none !important;
}

/* Primera columna algo más destacada */
#log_sessions tbody td:first-child,
#log_sessions.dataTable tbody td:first-child {
    color: #243056 !important;
    font-weight: 600 !important;
}

/* Columna tipo, si existe */
#log_sessions .tableTipo,
#log_sessions_wrapper .tableTipo {
    color: #000000 !important;
    font-weight: 700 !important;
}

/* Info / paginación de DataTables si aparecen */
#log_sessions_wrapper .dataTables_info,
#log_sessions_wrapper .dataTables_paginate {
    margin-top: 12px !important;
    color: #667390 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}

/* Botones de paginación */
#log_sessions_wrapper .paginate_button {
    min-width: 34px;
    margin-left: 6px !important;
    padding: 7px 10px !important;
    border: 1px solid #dbe3f0 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #33406d !important;
    box-shadow: none !important;
}

#log_sessions_wrapper .paginate_button.current,
#log_sessions_wrapper .paginate_button:hover {
    background: rgba(0, 0, 0, 0.08) !important;
    border-color: rgba(0, 0, 0, 0.24) !important;
    color: #000000 !important;
}

/* Móvil */
@media (max-width: 600px) {
    #log_sessions_wrapper {
        padding: 10px !important;
        border-radius: 14px !important;
    }

    #log_sessions_wrapper .dataTables_filter {
        margin-bottom: 10px !important;
    }

    #log_sessions_wrapper .dataTables_filter label {
        flex-direction: column;
        align-items: stretch !important;
        gap: 6px;
        font-size: 12px !important;
    }

    #log_sessions_wrapper .dataTables_filter input {
        width: 100% !important;
        min-height: 38px;
        font-size: 12px !important;
    }

    #log_sessions thead th,
    #log_sessions.dataTable thead th,
    #log_sessions tbody td,
    #log_sessions.dataTable tbody td {
        padding: 11px 10px !important;
        font-size: 12px !important;
    }
}

/* =========================================================
   BLOQUE "MIS AMIGOS" · REDISEÑO MODERNO
   ========================================================= */

/* Contenedor principal del panel abierto */
#my-amigos-1 .panel-body,
#mis-amigos .panel-body,
.panel-body .conocidos-container {
    background: #fbfcff !important;
}

/* Caja interior donde están input, botón y tabla */
.conocidos-container {
    padding: 16px !important;
    border: 1px solid #e7ecf5 !important;
    border-radius: 16px !important;
    background: #ffffff !important;
    box-shadow: 0 6px 18px rgba(31, 42, 86, 0.05) !important;
}

/* Fila superior input + botón */
.conocidos-container > div[style*="display:flex"] {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-bottom: 14px !important;
}

/* Input de email */
#emailInvitar,
.conocidos-container input[type="text"],
.conocidos-container input[type="email"] {
    flex: 1 1 auto !important;
    min-height: 44px !important;
    padding: 10px 14px !important;
    border: 1px solid #dbe3f0 !important;
    border-radius: 12px !important;
    background: #fbfcff !important;
    color: #1f2a56 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    box-shadow: none !important;
    outline: none !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

#emailInvitar:focus,
.conocidos-container input[type="text"]:focus,
.conocidos-container input[type="email"]:focus {
    border-color: #2e2e2e !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.08) !important;
}

/* Botón invitar */
.btnInvitar,
.conocidos-container .btnInvitar,
.conocidos-container button.btn-danger,
.conocidos-container .btn.btn-danger.inline {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 44px !important;
    padding: 0 18px !important;
    border: none !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #000000 0%, #2e2e2e 100%) !important;
    color: #ffffff !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.22) !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

.btnInvitar:hover,
.conocidos-container .btnInvitar:hover,
.conocidos-container button.btn-danger:hover,
.conocidos-container .btn.btn-danger.inline:hover {
    transform: translateY(-1px);
    filter: brightness(1.02);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.28) !important;
}

/* Tabla/listado de amigos */
.conocidos-container table,
.conocidos-container .table {
    width: 100% !important;
    margin: 0 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    overflow: hidden;
    border: 1px solid #edf1f7 !important;
    border-radius: 14px !important;
    background: #ffffff !important;
}

/* Cabecera */
.conocidos-container table thead th,
.conocidos-container .table thead th {
    padding: 12px 10px !important;
    border: none !important;
    border-bottom: 1px solid #e8edf6 !important;
    background: linear-gradient(180deg, #fbfcff 0%, #f4f7fd 100%) !important;
    color: #243056 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-align: left !important;
}

/* Filas */
.conocidos-container table tbody tr,
.conocidos-container .table tbody tr {
    background: #ffffff !important;
    transition: background 0.18s ease;
}

.conocidos-container table tbody tr:nth-child(even),
.conocidos-container .table tbody tr:nth-child(even) {
    background: #fafcff !important;
}

.conocidos-container table tbody tr:hover,
.conocidos-container .table tbody tr:hover {
    background: #f5f8ff !important;
}

/* Celdas */
.conocidos-container table tbody td,
.conocidos-container .table tbody td {
    padding: 12px 10px !important;
    border: none !important;
    border-bottom: 1px solid #eef2f8 !important;
    color: #435070 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    vertical-align: middle !important;
}

/* Primera columna algo más destacada */
.conocidos-container table tbody td:first-child,
.conocidos-container .table tbody td:first-child {
    color: #243056 !important;
    font-weight: 600 !important;
}

/* Última fila sin borde duro */
.conocidos-container table tbody tr:last-child td,
.conocidos-container .table tbody tr:last-child td {
    border-bottom: none !important;
}

/* Si no hay tabla real y solo hay filas renderizadas en divs */
.conocidos-container .row + .row {
    margin-top: 8px !important;
}

/* Responsive móvil */
@media (max-width: 600px) {
    .conocidos-container {
        padding: 12px !important;
        border-radius: 14px !important;
    }

    .conocidos-container > div[style*="display:flex"] {
        flex-direction: row !important;
        align-items: stretch !important;
        gap: 8px !important;
    }

    #emailInvitar,
    .conocidos-container input[type="text"],
    .conocidos-container input[type="email"] {
        min-height: 42px !important;
        padding: 10px 12px !important;
        font-size: 13px !important;
    }

    .btnInvitar,
    .conocidos-container .btnInvitar,
    .conocidos-container button.btn-danger,
    .conocidos-container .btn.btn-danger.inline {
        min-height: 42px !important;
        padding: 0 14px !important;
        font-size: 13px !important;
        white-space: nowrap;
    }

    .conocidos-container table thead th,
    .conocidos-container .table thead th,
    .conocidos-container table tbody td,
    .conocidos-container .table tbody td {
        padding: 10px 8px !important;
        font-size: 12px !important;
    }
}

/* =========================================================
   MIS AMIGOS · CENTRADO GENERAL
   ========================================================= */

/* Centrar todo el contenido de la tarjeta */
.conocidos-container {
    text-align: center !important;
}

/* Fila input + botón → centrada */
.conocidos-container > div[style*="display:flex"] {
    justify-content: center !important;
}

/* Ajuste del input */
#emailInvitar {
    max-width: 220px;
    text-align: left !important; /* el texto dentro sigue siendo natural */
}

/* Botón invitar centrado */
.btnInvitar {
    margin: 0 !important;
}

/* Tabla centrada */
.conocidos-container table {
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Cabecera centrada */
.conocidos-container thead th {
    text-align: center !important;
}

/* Celdas centradas */
.conocidos-container tbody td {
    text-align: center !important;
}

/* Opcional: nombres un poco más destacados */
.conocidos-container tbody td:nth-child(2) {
    font-weight: 600;
    color: #243056;
}

.conocidos-container > div[style*="display:flex"] {
    justify-content: flex-start !important;
}

/* Asegura alineación limpia */
#emailInvitar {
    margin-left: 0 !important;
}

/* Opcional: separa un poco el botón */
.btnInvitar {
    margin-left: 8px !important;
}

.btnComprarEventos {
  margin-top: 20px;
}

/* =========================================================
   BONOS / BONOS CADUCADOS · REDISEÑO VISUAL
   ========================================================= */

/* Grid de tarjetas dentro de bonos */
#my-account-2 .row > [class*="col-"] {
    margin-bottom: 18px !important;
}

/* Card exterior */
#my-account-2 .product-wrap {
    position: relative;
    overflow: hidden;
    min-height: 100%;
    padding: 14px !important;
    border: 1px solid #e7ecf5 !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 8px 24px rgba(31, 42, 86, 0.05) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

#my-account-2 .product-wrap:hover {
    transform: translateY(-2px);
    border-color: #dbe4f5 !important;
    box-shadow: 0 14px 30px rgba(31, 42, 86, 0.10) !important;
}

/* Parte superior visual */
#my-account-2 .product-img {
    padding: 14px !important;
    border: 1px solid #edf1f7 !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, #fbfcff 0%, #f7f9fd 100%) !important;
    margin-bottom: 14px !important;
    min-height: 250px;
    position: relative;
}

/* Etiqueta superior tipo Abono */
#my-account-2 .resaltarLista,
#my-account-2 .product-wrap p[style*="position:absolute"] {
    border-radius: 999px !important;
    padding: 6px 10px !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

/* Título persona / nombre superior */
#my-account-2 .product-img h2[style*="text-align:center"],
#my-account-2 .product-img h2 {
    margin: 8px 0 6px 0 !important;
    color: #243056 !important;
    text-align: center !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
}

/* Texto secundario bajo el título */
#my-account-2 .personaUso {
    display: block !important;
    width: 100% !important;
    min-height: auto !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    color: #5f6b8a !important;
    text-align: center !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
}

/* Fechas y mensajes pequeños */
#my-account-2 .product-img small,
#my-account-2 .product-img small[style],
#my-account-2 .product-img span,
#my-account-2 .product-img p {
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    line-height: 1.4 !important;
}

/* Icono central (prohibido / QR / etc.) */
#my-account-2 .product-img img.default-img,
#my-account-2 .product-img .fa-ban,
#my-account-2 .product-img i.fa {
    display: block;
    margin: 18px auto 0 auto !important;
}

/* Si hay QR o icono, tamaño contenido */
#my-account-2 .product-img img.default-img {
    max-width: 300px;
    width: 100%;
    height: auto !important;
    padding: 6px;
    border-radius: 12px;
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(31, 42, 86, 0.06);
}

/* Precio */
#my-account-2 .product-price {
    margin: 8px 0 10px 0 !important;
    text-align: center !important;
}

#my-account-2 .product-price span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 6px 12px;
    border-radius: 999px;
    background: #ecfdf3;
    color: #157347 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    box-shadow: inset 0 0 0 1px rgba(21, 115, 71, 0.08);
}

/* Bloque de contenido inferior */
#my-account-2 .product-content {
    padding: 0 !important;
    text-align: center !important;
}

#my-account-2 .product-content h2,
#my-account-2 .product-content h3 {
    margin-top: 0 !important;
    margin-bottom: 8px !important;
    color: #1f2a56 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    line-height: 1.25 !important;
}

#my-account-2 .product-content h2 {
    font-size: 15px !important;
    font-weight: 800 !important;
}

#my-account-2 .product-content h3 {
    font-size: 13px !important;
    font-weight: 600 !important;
}

#my-account-2 .product-content h2 a,
#my-account-2 .product-content h3 a {
    color: #1f2a56 !important;
    text-decoration: none !important;
}

/* Input tarjeta si aparece */
#my-account-2 .ntarjeta.form-control {
    min-height: 42px;
    margin-top: 10px;
    border: 1px solid #dde5f2 !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    box-shadow: none !important;
}

/* Botones de acciones */
#my-account-2 .btn.btn-success,
#my-account-2 .btn.btn-secondary,
#my-account-2 .btnRenovar,
#my-account-2 .btnRenovarAll {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 46px !important;
    margin-top: 12px !important;
    padding: 10px 16px !important;
    border: none !important;
    border-radius: 14px !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-align: center !important;
    box-shadow: 0 8px 18px rgba(60, 160, 90, 0.15) !important;
}

/* Verde más suave y moderno */
#my-account-2 .btn.btn-success,
#my-account-2 .btnRenovar,
#my-account-2 .btnRenovarAll {
    background: #b9dfc0 !important;
    color: #ffffff !important;
}

/* Estados deshabilitados / antiguos */
#my-account-2 .tarifaDisabled,
#my-account-2 .reservaDisabled {
    opacity: 0.72;
    filter: grayscale(0.08);
}

/* Separadores y títulos de sección */
#my-account-2 hr {
    border: none;
    border-top: 1px solid #edf1f7;
    margin: 18px 0 !important;
}

#my-account-2 .col-md-12 > h3,
#my-account-2 h3[style*="text-align:center"] {
    color: #1f2a56 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.01em;
}

/* Responsive móvil */
@media (max-width: 600px) {
    #my-account-2 .product-wrap {
        padding: 12px !important;
        border-radius: 16px !important;
    }

    #my-account-2 .product-img {
        min-height: 220px;
        padding: 12px !important;
        border-radius: 12px !important;
    }

    #my-account-2 .product-img h2,
    #my-account-2 .product-content h2 {
        font-size: 14px !important;
    }

    #my-account-2 .product-content h3,
    #my-account-2 .personaUso {
        font-size: 12px !important;
    }

    #my-account-2 .btn.btn-success,
    #my-account-2 .btn.btn-secondary,
    #my-account-2 .btnRenovar,
    #my-account-2 .btnRenovarAll {
        min-height: 42px !important;
        font-size: 13px !important;
        border-radius: 12px !important;
    }
}

/* =========================================================
   TUS COMPRAS PRODUCTOS · FIX MÓVIL
   ========================================================= */

@media (max-width: 600px) {
    /* El contenedor del panel no debe cortar raro */
    #my-account-2 .panel-body,
    #my-account-2 .billing-info-wrap,
    #my-account-2 .row,
    #my-account-2 .col-md-12 {
        min-width: 0 !important;
    }

    /* Wrapper de la tabla */
    #tus_productos {
        width: 100% !important;
        min-width: 520px !important; /* permite mantener columnas legibles */
        margin: 0 !important;
        border-collapse: separate !important;
        border-spacing: 0 !important;
        table-layout: auto !important;
    }

    /* Hacemos que el padre permita scroll horizontal elegante */
    #tus_productos {
        display: table !important;
    }

    #tus_productos {
        overflow: visible !important;
    }

    /* Si la tabla está dentro de un div col-md-12 o wrapper directo */
    #my-account-2 .col-md-12:has(> #tus_productos),
    #my-account-2 .panel-body div:has(> #tus_productos) {
        width: 100% !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 4px;
    }

    /* Scrollbar más discreta */
    #my-account-2 .col-md-12:has(> #tus_productos)::-webkit-scrollbar,
    #my-account-2 .panel-body div:has(> #tus_productos)::-webkit-scrollbar {
        height: 6px;
    }

    #my-account-2 .col-md-12:has(> #tus_productos)::-webkit-scrollbar-thumb,
    #my-account-2 .panel-body div:has(> #tus_productos)::-webkit-scrollbar-thumb {
        background: rgba(0, 0, 0, 0.22);
        border-radius: 999px;
    }

    /* Cabecera */
    #tus_productos thead th {
        white-space: nowrap !important;
        padding: 10px 10px !important;
        font-size: 12px !important;
        line-height: 1.2 !important;
    }

    /* Celdas */
    #tus_productos tbody td {
        white-space: nowrap !important;
        padding: 10px 10px !important;
        font-size: 12px !important;
        line-height: 1.35 !important;
        vertical-align: middle !important;
    }

    /* Ajuste fino por columnas */
    #tus_productos th:nth-child(1),
    #tus_productos td:nth-child(1) {
        min-width: 90px;
    }

    #tus_productos th:nth-child(2),
    #tus_productos td:nth-child(2) {
        min-width: 130px;
    }

    #tus_productos th:nth-child(3),
    #tus_productos td:nth-child(3) {
        min-width: 90px;
    }

    #tus_productos th:nth-child(4),
    #tus_productos td:nth-child(4) {
        min-width: 80px;
    }
}

@media (max-width: 600px) {
    /* contenedores intermedios */
    #my-account-22 .panel-body,
    #my-account-22 .billing-info-wrap,
    #my-account-22 .row,
    #my-account-22 .col-md-12,
    #my-account-22 .row.col-md-12 {
        min-width: 0 !important;
        width: 100% !important;
        overflow: visible !important;
    }

    /* la tabla se convierte en bloque con scroll propio */
    #tus_productos {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap !important;
        border-collapse: separate !important;
        border-spacing: 0 !important;
        table-layout: auto !important;
    }

    /* thead / tbody siguen comportándose como tabla */
    #tus_productos thead,
    #tus_productos tbody,
    #tus_productos tr {
        display: table !important;
        width: 100% !important;
        table-layout: fixed !important;
    }

    /* ancho mínimo real del contenido */
    #tus_productos thead,
    #tus_productos tbody {
        min-width: 520px !important;
    }

    /* celdas compactas */
    #tus_productos th,
    #tus_productos td {
        padding: 10px 8px !important;
        font-size: 12px !important;
        line-height: 1.3 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    /* anchos orientativos por columna */
    #tus_productos th:nth-child(1),
    #tus_productos td:nth-child(1) {
        width: 90px !important;
    }

    #tus_productos th:nth-child(2),
    #tus_productos td:nth-child(2) {
        width: 140px !important;
    }

    #tus_productos th:nth-child(3),
    #tus_productos td:nth-child(3) {
        width: 90px !important;
    }

    #tus_productos th:nth-child(4),
    #tus_productos td:nth-child(4) {
        width: 80px !important;
    }

    /* scrollbar discreta */
    #tus_productos::-webkit-scrollbar {
        height: 6px;
    }

    #tus_productos::-webkit-scrollbar-thumb {
        background: rgba(0, 0, 0, 0.22);
        border-radius: 999px;
    }
}

/* =========================================================
   TUS RESERVAS · REDISEÑO MODERNO
   ========================================================= */

/* Card exterior de cada reserva */
#my-account-3 .product-wrap,
#my-reservas .product-wrap,
.panel-body .product-wrap {
    position: relative;
    overflow: hidden;
    padding: 16px !important;
    border: 1px solid #e7ecf5 !important;
    border-radius: 20px !important;
    background: #ffffff !important;
    box-shadow: 0 8px 24px rgba(31, 42, 86, 0.05) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

#my-account-3 .product-wrap:hover,
#my-reservas .product-wrap:hover,
.panel-body .product-wrap:hover {
    transform: translateY(-2px);
    border-color: #dde5f3 !important;
    box-shadow: 0 16px 34px rgba(31, 42, 86, 0.10) !important;
}

/* Caja interior */
#my-account-3 .product-img,
#my-reservas .product-img {
    padding: 18px !important;
    border: 1px solid #edf1f7 !important;
    border-radius: 16px !important;
    background: linear-gradient(180deg, #fbfcff 0%, #f7f9fd 100%) !important;
    margin-bottom: 0 !important;
    min-height: 210px;
    position: relative;
}

/* Etiqueta superior azul (tipo reserva/perfil) */
#my-account-3 .product-img > p[style*="position:absolute"],
#my-reservas .product-img > p[style*="position:absolute"] {
    top: 0 !important;
    left: 0 !important;
    right: auto !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    border-radius: 0 0 12px 0 !important;
    background: linear-gradient(135deg, #000000 0%, #2e2e2e 100%) !important;
    color: #ffffff !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.18);
}

/* Botón/label cancelar */
#my-account-3 .cancelarReserva,
#my-reservas .cancelarReserva {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    border-radius: 0 0 0 12px !important;
    background: #ff4d4f !important;
    color: #ffffff !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    cursor: pointer;
    box-shadow: 0 6px 14px rgba(255, 77, 79, 0.16);
    transition: filter 0.18s ease, transform 0.18s ease;
}

#my-account-3 .cancelarReserva:hover,
#my-reservas .cancelarReserva:hover {
    filter: brightness(0.98);
    transform: translateY(1px);
}

/* Título del nombre */
#my-account-3 .product-img h2,
#my-reservas .product-img h2 {
    margin: 10px 0 14px 0 !important;
    padding-top: 6px;
    color: #1f2a56 !important;
    text-align: center !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.01em;
}

/* Texto secundario / personaUso */
#my-account-3 .personaUso,
#my-reservas .personaUso {
    display: block !important;
    margin: 0 0 14px 0 !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    color: #667390 !important;
    text-align: center !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
}

/* Bloque central pista + fecha */
#my-account-3 .product-img h3,
#my-account-3 .product-img h4,
#my-reservas .product-img h3,
#my-reservas .product-img h4 {
    color: #243056 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
}

/* Caja de pista / reserva */
#my-account-3 .product-img > h4,
#my-reservas .product-img > h4 {
    display: block;
    margin: 0 0 16px 0 !important;
    padding: 14px 16px !important;
    border: 1px solid rgba(0, 0, 0, 0.18) !important;
    border-radius: 14px !important;
    background: rgba(0, 0, 0, 0.05) !important;
    color: #283a74 !important;
    text-align: left !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    cursor: pointer;
}

/* Lista de participantes oculta / desplegable */
#my-account-3 .product-img ul,
#my-reservas .product-img ul {
    margin: 8px 0 0 0 !important;
    padding: 10px 14px 10px 28px !important;
    border-radius: 12px;
    background: #f8faff;
    border: 1px solid #e7edf8;
    color: #52607f;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
}

/* Separador */
#my-account-3 .product-img hr,
#my-reservas .product-img hr {
    margin: 14px 0 !important;
    border: none;
    border-top: 1px solid #edf1f7;
}

/* CTA de abajo: Enviar QR / Participantes */
#my-account-3 .showReserva,
#my-reservas .showReserva,
#my-account-3 .product-img h4[style*="cursor:pointer"],
#my-reservas .product-img h4[style*="cursor:pointer"] {
    transition: background 0.18s ease, border-color 0.18s ease, color 0.18s ease;
}

#my-account-3 .product-img h4[style*="cursor:pointer"]:last-of-type,
#my-reservas .product-img h4[style*="cursor:pointer"]:last-of-type {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    margin: 14px 0 0 0 !important;
    padding: 12px 16px !important;
    border-radius: 14px !important;
    border: 1px solid rgba(0, 0, 0, 0.22) !important;
    background: rgba(0, 0, 0, 0.06) !important;
    color: #000000 !important;
    text-align: center !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    letter-spacing: 0.01em;
}

#my-account-3 .product-img h4[style*="cursor:pointer"]:last-of-type:hover,
#my-reservas .product-img h4[style*="cursor:pointer"]:last-of-type:hover {
    background: rgba(0, 0, 0, 0.10) !important;
    border-color: rgba(0, 0, 0, 0.32) !important;
    color: #000000 !important;
}

/* La columna/card no se quede minúscula en desktop */
#my-account-3 .row > [class*="col-"],
#my-reservas .row > [class*="col-"] {
    margin-bottom: 18px !important;
}

/* Móvil */
@media (max-width: 600px) {
    #my-account-3 .product-wrap,
    #my-reservas .product-wrap {
        padding: 12px !important;
        border-radius: 16px !important;
    }

    #my-account-3 .product-img,
    #my-reservas .product-img {
        min-height: auto;
        padding: 14px !important;
        border-radius: 14px !important;
    }

    #my-account-3 .product-img h2,
    #my-reservas .product-img h2 {
        font-size: 16px !important;
        margin-bottom: 12px !important;
    }

    #my-account-3 .personaUso,
    #my-reservas .personaUso {
        font-size: 12px !important;
    }

    #my-account-3 .product-img > h4,
    #my-reservas .product-img > h4,
    #my-account-3 .product-img h4[style*="cursor:pointer"]:last-of-type,
    #my-reservas .product-img h4[style*="cursor:pointer"]:last-of-type {
        font-size: 13px !important;
        padding: 12px 14px !important;
        border-radius: 12px !important;
    }

    #my-account-3 .cancelarReserva,
    #my-reservas .cancelarReserva {
        font-size: 11px !important;
        padding: 7px 10px !important;
    }
}

/* CONTENEDOR DE RESERVAS */
#my-account-3 .row,
#my-reservas .row {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    gap: 16px;
}

/* COLUMNA (evita que se quede estrecha) */
#my-account-3 .row > [class*="col-"],
#my-reservas .row > [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
}

/* CUANDO HAYA VARIAS → 2 COLUMNAS EN DESKTOP */
@media (min-width: 768px) {
    #my-account-3 .row > [class*="col-"],
    #my-reservas .row > [class*="col-"] {
        flex: 1 1 calc(50% - 8px) !important;
        max-width: calc(50% - 8px) !important;
    }
}

/* OPCIONAL: 3 COLUMNAS EN PANTALLAS GRANDES */
@media (min-width: 1200px) {
    #my-account-3 .row > [class*="col-"],
    #my-reservas .row > [class*="col-"] {
        flex: 1 1 calc(33.33% - 10px) !important;
        max-width: calc(33.33% - 10px) !important;
    }
}

/* LA CARD OCUPA TODO */
#my-account-3 .product-wrap,
#my-reservas .product-wrap {
    width: 100% !important;
}

/* ELIMINA CENTRADOS RAROS */
#my-account-3 .product-img,
#my-reservas .product-img {
    margin: 0 !important;
}

/* CONTENEDOR PRINCIPAL (quita efecto “caja dentro de caja”) */
#my-account-3 .panel-body,
#my-reservas .panel-body {
    display: block !important;
    padding: 20px !important;
}

#my-account-3 > .panel-body > .billing-info-wrap > .row,
#my-reservas > .panel-body > .billing-info-wrap > .row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    align-items: start !important;
}

/* Desktop: 2 columnas si hay varias */
@media (min-width: 992px) {
    #my-account-3 > .panel-body > .billing-info-wrap > .row,
    #my-reservas > .panel-body > .billing-info-wrap > .row {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* 2) SOLO las columnas directas del grid principal */
#my-account-3 > .panel-body > .billing-info-wrap > .row > [class*="col-"],
#my-reservas > .panel-body > .billing-info-wrap > .row > [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-bottom: 0 !important;
}

/* 3) Reset MUY IMPORTANTE para columnas internas dentro de cada card */
#my-account-3 .product-wrap [class*="col-"],
#my-account-3 .product-img [class*="col-"],
#my-account-3 .product-content [class*="col-"],
#my-reservas .product-wrap [class*="col-"],
#my-reservas .product-img [class*="col-"],
#my-reservas .product-content [class*="col-"] {
    width: auto !important;
    max-width: none !important;
    flex: initial !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* 4) La card ocupa todo el ancho disponible */
#my-account-3 .product-wrap,
#my-reservas .product-wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}

/* 5) La caja interior también ocupa todo */
#my-account-3 .product-img,
#my-reservas .product-img {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    min-height: auto !important;
}

/* 6) El título y contenido no se comprimen */
#my-account-3 .product-img h2,
#my-account-3 .product-img h3,
#my-account-3 .product-img h4,
#my-account-3 .product-content,
#my-reservas .product-img h2,
#my-reservas .product-img h3,
#my-reservas .product-img h4,
#my-reservas .product-content {
    white-space: normal !important;
    overflow: visible !important;
}

/* 7) Botón cancelar bien colocado */
#my-account-3 .cancelarReserva,
#my-reservas .cancelarReserva {
    right: 0 !important;
    left: auto !important;
}

/* 8) CTA inferior ocupa ancho razonable y no rompe */
#my-account-3 .product-img h4[style*="cursor:pointer"]:last-of-type,
#my-reservas .product-img h4[style*="cursor:pointer"]:last-of-type {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* =========================================================
   TUS RESERVAS · FIX SOLO DESKTOP
   ========================================================= */
@media (min-width: 768px) {
    /* La fila INTERNA que contiene las cards de reservas */
    #my-account-3 .panel-body > .billing-info-wrap > .row > .col-md-12 > .row,
    #my-reservas .panel-body > .billing-info-wrap > .row > .col-md-12 > .row {
        display: grid !important;
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
        gap: 20px !important;
        align-items: start !important;
        width: 100% !important;
        margin: 0 !important;
    }

    /* Las columnas bootstrap de esa fila ya no mandan */
    #my-account-3 .panel-body > .billing-info-wrap > .row > .col-md-12 > .row > [class*="col-"],
    #my-reservas .panel-body > .billing-info-wrap > .row > .col-md-12 > .row > [class*="col-"] {
        width: auto !important;
        max-width: none !important;
        flex: 0 0 auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Cada card ocupa su celda completa */
    #my-account-3 .product-wrap,
    #my-reservas .product-wrap {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    #my-account-3 .product-img,
    #my-reservas .product-img {
        width: 100% !important;
        max-width: 100% !important;
        min-height: 260px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    /* El CTA inferior no debe encoger la card */
    #my-account-3 .product-img h4[style*="cursor:pointer"]:last-of-type,
    #my-reservas .product-img h4[style*="cursor:pointer"]:last-of-type {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* El contenedor superior del panel no debe centrar raro */
    #my-account-3 .panel-body > .billing-info-wrap > .row > .col-md-12,
    #my-reservas .panel-body > .billing-info-wrap > .row > .col-md-12 {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* =========================================================
   TUS RESERVAS · GRID 2 x N EN ESCRITORIO
   ========================================================= */

/* Móvil y tablet: 1 columna */
#my-account-3 .panel-body > .billing-info-wrap > .row > .col-md-12 > .row {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    width: 100% !important;
    margin: 0 !important;
    align-items: start !important;
}

/* PC: máximo 2 columnas */
@media (min-width: 992px) {
    #my-account-3 .panel-body > .billing-info-wrap > .row > .col-md-12 > .row {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

/* Cada item de reserva ocupa su celda */
#my-account-3 .panel-body > .billing-info-wrap > .row > .col-md-12 > .row > [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* La card ocupa todo el ancho de la celda */
#my-account-3 .product-wrap,
#my-account-3 .product-img {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Evita alturas raras */
#my-account-3 .product-img {
    min-height: 250px !important;
}

/* =========================================================
   TUS RESERVAS · 2 COLUMNAS PERO MÁS ANCHAS
   ========================================================= */

@media (min-width: 992px) {
    /* La rejilla sigue siendo de 2 columnas */
    #my-account-3 .panel-body > .billing-info-wrap > .row > .col-md-12 > .row,
    #my-reservas .panel-body > .billing-info-wrap > .row > .col-md-12 > .row {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(340px, 1fr)) !important;
        gap: 20px !important;
        align-items: stretch !important;
        justify-content: stretch !important;
        width: 100% !important;
        margin: 0 !important;
    }

    /* Cada item ocupa toda su celda */
    #my-account-3 .panel-body > .billing-info-wrap > .row > .col-md-12 > .row > [class*="col-"],
    #my-reservas .panel-body > .billing-info-wrap > .row > .col-md-12 > .row > [class*="col-"] {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        flex: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* La card exterior llena la celda */
    #my-account-3 .product-wrap,
    #my-reservas .product-wrap {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    /* La card interior también llena todo */
    #my-account-3 .product-img,
    #my-reservas .product-img {
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-between !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        min-height: 260px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    /* El CTA ocupa ancho útil y no se queda mini */
    #my-account-3 .product-img h4[style*="cursor:pointer"]:last-of-type,
    #my-reservas .product-img h4[style*="cursor:pointer"]:last-of-type {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }
}

/* =========================================================
   BONO RESERVAS / VINCULAR USUARIO · REDISEÑO MODERNO
   ========================================================= */

/* Card exterior */
#my-account-2 .product-wrap {
    position: relative;
    overflow: hidden;
    padding: 16px !important;
    border: 1px solid #e7ecf5 !important;
    border-radius: 20px !important;
    background: #ffffff !important;
    box-shadow: 0 10px 28px rgba(31, 42, 86, 0.06) !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

#my-account-2 .product-wrap:hover {
    transform: translateY(-2px);
    border-color: #dbe4f5 !important;
    box-shadow: 0 16px 34px rgba(31, 42, 86, 0.10) !important;
}

/* Caja interior */
#my-account-2 .product-img {
    padding: 18px !important;
    border: 1px solid #edf1f7 !important;
    border-radius: 18px !important;
    background: linear-gradient(180deg, #fbfcff 0%, #f7f9fd 100%) !important;
    min-height: auto !important;
    margin-bottom: 0 !important;
}

/* Etiqueta superior izquierda */
#my-account-2 .product-wrap > p[style*="position:absolute"] {
    top: 14px !important;
    left: 14px !important;
    margin: 0 !important;
    padding: 8px 12px !important;
    border-radius: 999px !important;
    background: rgba(0, 0, 0, 0.10) !important;
    color: #000000 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-shadow: none !important;
}

/* Si hay badge rojo flotante antiguo, suavizarlo */
#my-account-2 .product-wrap > p[style*="background-color:red"] {
    background: #ff5a5f !important;
    color: #ffffff !important;
    border-radius: 12px !important;
}

/* Título superior */
#my-account-2 .product-img h2 {
    margin: 4px 0 8px 0 !important;
    color: #1f2a56 !important;
    text-align: center !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 17px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
}

/* personaUso / subtítulos */
#my-account-2 .personaUso {
    display: block !important;
    margin: 0 0 8px 0 !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    color: #64708f !important;
    text-align: center !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
}

/* Precio / badge verde */
#my-account-2 .product-price {
    margin: 6px 0 12px 0 !important;
    text-align: center !important;
}

#my-account-2 .product-price span,
#my-account-2 h2 + .product-price span,
#my-account-2 .product-img span[style*="green"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 6px 12px;
    border-radius: 999px;
    background: #ecfdf3 !important;
    color: #157347 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    box-shadow: inset 0 0 0 1px rgba(21,115,71,0.08);
}

/* Caja central gris → convertir en bloque principal elegante */
#my-account-2 .product-img h4,
#my-account-2 .product-img h4[style],
#my-account-2 .product-img div[style*="background-color:#ccc"],
#my-account-2 .product-img div[style*="background: #ccc"],
#my-account-2 .product-img div[style*="background:#ccc"] {
    display: block;
    margin: 14px 0 16px 0 !important;
    padding: 18px 16px !important;
    border: 1px solid rgba(0, 0, 0, 0.16) !important;
    border-radius: 16px !important;
    background: rgba(0, 0, 0, 0.06) !important;
    color: #243056 !important;
    text-align: center !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    box-shadow: none !important;
}

/* Título dentro del bloque gris */
#my-account-2 .product-img h4 strong,
#my-account-2 .product-img h4 b,
#my-account-2 .product-img div[style*="background-color:#ccc"] strong,
#my-account-2 .product-img div[style*="background-color:#ccc"] b {
    display: block;
    margin-bottom: 6px;
    font-size: 15px;
    font-weight: 800;
    color: #1f2a56;
}

/* Inputs */
#my-account-2 input[type="text"],
#my-account-2 input[type="email"],
#my-account-2 .form-control {
    min-height: 44px !important;
    padding: 10px 14px !important;
    border: 1px solid #dbe3f0 !important;
    border-radius: 12px !important;
    background: #fbfcff !important;
    color: #1f2a56 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    box-shadow: none !important;
    outline: none !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

#my-account-2 input[type="text"]:focus,
#my-account-2 input[type="email"]:focus,
#my-account-2 .form-control:focus {
    border-color: #2e2e2e !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.08) !important;
}

/* Botón principal rojo */
#my-account-2 .btn.btn-danger,
#my-account-2 .btn-danger,
#my-account-2 button.btn-danger {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 48px !important;
    margin-top: 12px !important;
    padding: 10px 16px !important;
    border: none !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, #ff4d4f 0%, #e13347 100%) !important;
    color: #ffffff !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-align: center !important;
    box-shadow: 0 10px 22px rgba(225, 51, 71, 0.18) !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

#my-account-2 .btn.btn-danger:hover,
#my-account-2 .btn-danger:hover,
#my-account-2 button.btn-danger:hover {
    transform: translateY(-1px);
    filter: brightness(1.02);
    box-shadow: 0 14px 28px rgba(225, 51, 71, 0.24) !important;
}

/* Zona de iconos inferiores */
#my-account-2 .product-content.text-center:last-of-type,
#my-account-2 .product-img + .product-content,
#my-account-2 .fa-user,
#my-account-2 .fa-print,
#my-account-2 .fa-envelope,
#my-account-2 .fa-file {
    text-align: center !important;
}

/* Links/iconos sueltos abajo */
#my-account-2 a > i.fa,
#my-account-2 .product-content a > i.fa {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    margin: 10px 6px 0 6px !important;
    border-radius: 12px;
    background: #f4f7ff;
    color: #000000 !important;
    box-shadow: inset 0 0 0 1px #e2e8f8;
    transition: transform 0.18s ease, background 0.18s ease, color 0.18s ease;
}

#my-account-2 a > i.fa:hover,
#my-account-2 .product-content a > i.fa:hover {
    transform: translateY(-1px);
    background: rgba(0, 0, 0, 0.10);
    color: #000000 !important;
}

/* Quitar sensación de tarjeta encajada */
#my-account-2 .col-xl-4,
#my-account-2 .col-md-6,
#my-account-2 .col-lg-6,
#my-account-2 .col-sm-6 {
    margin-bottom: 18px !important;
}

/* Responsive móvil */
@media (max-width: 600px) {
    #my-account-2 .product-wrap {
        padding: 12px !important;
        border-radius: 16px !important;
    }

    #my-account-2 .product-img {
        padding: 14px !important;
        border-radius: 14px !important;
    }

    #my-account-2 .product-img h2 {
        font-size: 16px !important;
    }

    #my-account-2 .personaUso {
        font-size: 12px !important;
    }

    #my-account-2 .btn.btn-danger,
    #my-account-2 .btn-danger,
    #my-account-2 button.btn-danger {
        min-height: 44px !important;
        font-size: 14px !important;
        border-radius: 12px !important;
    }
}

/* Mi monedero: movimientos en formato tarjeta para movil */
@media (max-width: 600px) {
    #my-monedero-8 .panel-body {
        padding: 14px !important;
        overflow: visible !important;
    }

    #my-monedero-8 .panel-body > .row {
        display: block !important;
    }

    #my-monedero-8 .panel-body > .row > [class*="col-"] {
        width: 100% !important;
        max-width: 100% !important;
        float: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    #my-monedero-8 h3 {
        margin-top: 12px !important;
        font-size: 20px !important;
    }

    #movimientos_monedero,
    #movimientos_monedero thead,
    #movimientos_monedero tbody,
    #movimientos_monedero tr,
    #movimientos_monedero th,
    #movimientos_monedero td {
        display: block !important;
        width: 100% !important;
    }

    #movimientos_monedero {
        margin: 0 !important;
        border-collapse: separate !important;
        border-spacing: 0 10px !important;
        background: transparent !important;
    }

    #movimientos_monedero thead {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        overflow: hidden !important;
        clip: rect(0, 0, 0, 0) !important;
        white-space: nowrap !important;
    }

    #movimientos_monedero tbody tr {
        margin-bottom: 10px !important;
        padding: 12px 14px !important;
        border: 1px solid #e5eaf4 !important;
        border-radius: 14px !important;
        background: #ffffff !important;
        box-shadow: 0 4px 14px rgba(30, 41, 88, 0.05) !important;
    }

    #movimientos_monedero tbody tr:nth-child(odd),
    #movimientos_monedero.table-striped > tbody > tr:nth-of-type(odd) {
        background: #ffffff !important;
    }

    #movimientos_monedero tbody td {
        display: grid !important;
        grid-template-columns: 92px minmax(0, 1fr);
        gap: 10px;
        align-items: start;
        padding: 6px 0 !important;
        border: 0 !important;
        color: #263454 !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
        text-align: right !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
    }

    #movimientos_monedero tbody td::before {
        color: #6b7690;
        font-size: 11px;
        font-weight: 800;
        letter-spacing: 0.04em;
        text-align: left;
        text-transform: uppercase;
        content: "";
    }

    #movimientos_monedero tbody td:nth-child(1)::before {
        content: "Fecha";
    }

    #movimientos_monedero tbody td:nth-child(2)::before {
        content: "Descripcion";
    }

    #movimientos_monedero tbody td:nth-child(3)::before {
        content: "Importe";
    }

    #movimientos_monedero tbody td:nth-child(4)::before {
        content: "Total";
    }

    #movimientos_monedero tbody td:nth-child(2) {
        text-align: left !important;
    }

    #movimientos_monedero tbody td:nth-child(3),
    #movimientos_monedero tbody td:nth-child(4) {
        font-weight: 800 !important;
    }
}

/* Checkout / carrito moderno */
.checkout-area {
    background: #f5f7fb !important;
    padding-top: 32px !important;
}

.checkout-area > .container {
    width: min(1180px, calc(100% - 32px)) !important;
    max-width: 1180px !important;
}

.checkout-area > .container > .row {
    justify-content: center;
}

.checkout-area > .container > .row > [class*="col-"]:has(.your-order-area) {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 980px !important;
}

.checkout-area .billing-info-wrap:has(.your-order-area) {
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

.checkout-area .your-order-area {
    width: 100%;
    max-width: 980px;
    margin: 0 auto !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
}

.checkout-area .your-order-area h3 {
    margin: 0 0 18px !important;
    color: #17213d !important;
    font-size: 26px !important;
    font-weight: 850 !important;
    line-height: 1.15 !important;
    letter-spacing: 0 !important;
}

.checkout-area .your-order-wrap {
    position: relative;
    overflow: hidden;
    padding: 34px 38px 36px !important;
    border: 1px solid rgba(105, 119, 155, 0.16);
    border-radius: 22px;
    background: #ffffff !important;
    box-shadow: 0 20px 50px rgba(34, 47, 90, 0.10);
}

.checkout-area .your-order-wrap::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 5px;
    background: linear-gradient(90deg, #000000, #000000, #2e2e2e);
}

.checkout-area .your-order-product-info {
    position: relative;
    z-index: 1;
}

.checkout-area .your-order-top ul,
.checkout-area .your-order-middle ul li,
.checkout-area .your-order-bottom ul,
.checkout-area .your-order-total ul {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto 34px;
    gap: 16px;
    align-items: center;
}

.checkout-area .your-order-top ul {
    margin: 0 !important;
    padding: 0 0 14px !important;
    border-bottom: 1px solid #e7ecf5;
}

.checkout-area .your-order-top ul li {
    width: auto !important;
    color: #141b31 !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.checkout-area .your-order-top ul li:nth-child(2) {
    text-align: right;
}

.checkout-area .your-order-middle {
    margin: 0 !important;
    padding: 12px 0 !important;
    border: 0 !important;
}

.checkout-area .your-order-middle ul {
    margin: 0 !important;
}

.checkout-area .your-order-middle ul li {
    min-height: 58px;
    margin: 0 !important;
    padding: 12px 0 !important;
    border-bottom: 1px solid #edf1f7;
}

.checkout-area .your-order-middle ul li:last-child {
    border-bottom: 0;
}

.checkout-area .your-order-middle .order-middle-left {
    width: auto !important;
    min-width: 0;
    color: #263454 !important;
    font-size: 15px !important;
    font-weight: 750 !important;
    line-height: 1.35 !important;
    overflow-wrap: anywhere;
}

.checkout-area .your-order-middle .order-middle-left small,
.checkout-area .your-order-middle p small {
    color: #6a748c !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
}

.checkout-area .your-order-middle p {
    margin: -4px 48px 10px 0 !important;
    color: #6a748c !important;
    line-height: 1.35 !important;
}

.checkout-area .your-order-middle .order-price,
.checkout-area .your-order-middle .uprice {
    justify-self: end;
    min-width: 76px;
    padding: 6px 10px;
    border-radius: 999px;
    background: #eefaf4;
    color: #157347 !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    line-height: 1 !important;
    text-align: center;
}

.checkout-area .your-order-middle .btnDelete {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background: #fff1f2;
    color: #d7374a !important;
    transition: transform 0.18s ease, background 0.18s ease, color 0.18s ease;
}

.checkout-area .your-order-middle .btnDelete:hover {
    transform: translateY(-1px);
    background: #e63b50;
    color: #ffffff !important;
}

.checkout-area .your-order-total {
    margin: 18px 0 28px !important;
    padding: 18px 20px !important;
    border: 1px solid #dfe7f2 !important;
    border-radius: 18px;
    background: #f8fbff;
}

.checkout-area .your-order-total ul {
    grid-template-columns: minmax(0, 1fr) auto !important;
}

.checkout-area .your-order-total ul li.order-total,
.checkout-area .your-order-total ul li.order-total1 {
    color: #17213d !important;
    font-size: 18px !important;
    font-weight: 850 !important;
}

.checkout-area .your-order-total ul li:last-child {
    color: #000000 !important;
    font-size: 20px !important;
    font-weight: 900 !important;
}

.checkout-area .payment-method {
    margin-top: 18px;
    padding: 18px;
    border: 1px solid #e4eaf4;
    border-radius: 18px;
    background: linear-gradient(180deg, #ffffff 0%, #f9fbff 100%);
}

.checkout-area .payment-accordion {
    margin: 0 !important;
}

.checkout-area .payment-accordion .panel {
    margin: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.checkout-area .payment-accordion h4,
.checkout-area .payment-accordion h4.panel-title {
    margin: 0 !important;
    color: #17213d !important;
    font-size: 16px !important;
    font-weight: 850 !important;
    line-height: 1.35 !important;
}

.checkout-area .payment-accordion h4 a {
    display: inline-flex !important;
    align-items: center;
    gap: 10px;
    color: #17213d !important;
}

.checkout-area .payment-accordion h4 a::before {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: #18a77b;
    box-shadow: 0 0 0 5px rgba(24, 167, 123, 0.12);
}

.checkout-area .payment-accordion .panel-body {
    padding: 8px 0 0 20px !important;
}

.checkout-area .payment-accordion .panel-body p {
    max-width: 540px;
    margin: 0 !important;
    padding: 0 !important;
    color: #596579 !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

.checkout-area .payment-accordion img[src*="tpv"] {
    width: 130px !important;
    max-width: 100%;
    margin-top: 16px;
    padding: 8px;
    border: 1px solid #edf1f7;
    border-radius: 14px;
    background: #ffffff;
}

.checkout-area .Place-order {
    width: 100%;
    max-width: 980px;
    margin: 18px auto 0 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
}

.checkout-area .Place-order .billing-info {
    margin: 0 0 14px !important;
}

.checkout-area .Place-order label,
.checkout-area .billing-info label {
    display: block;
    margin: 0 0 8px !important;
    color: #17213d !important;
    font-size: 13px !important;
    font-weight: 800 !important;
}

.checkout-area #tipoPago {
    width: 100% !important;
    height: 48px;
    padding: 0 44px 0 14px !important;
    border: 1px solid #d6deec !important;
    border-radius: 14px !important;
    background-color: #ffffff !important;
    color: #27324d !important;
    font-size: 14px !important;
    font-weight: 650 !important;
    box-shadow: 0 8px 20px rgba(34, 47, 90, 0.05);
    outline: none !important;
}

.checkout-area #tipoPago:focus {
    border-color: #2e2e2e !important;
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.10) !important;
}

.checkout-area .Place-order > a,
.checkout-area .Place-order a#finalizarCompra {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    min-height: 54px;
    padding: 0 22px !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, #000000 0%, #000000 52%, #2e2e2e 100%) !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    letter-spacing: 0.08em !important;
    line-height: 1 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.24);
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

.checkout-area .Place-order > a:hover,
.checkout-area .Place-order a#finalizarCompra:hover {
    transform: translateY(-1px);
    filter: brightness(1.03);
    box-shadow: 0 20px 42px rgba(0, 0, 0, 0.30);
}

.checkout-area .Place-order > a.btn-disabled,
.checkout-area .Place-order a#finalizarCompra.btn-disabled {
    pointer-events: none;
    background: #c7ccd6 !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

.checkout-area #msgError1,
.checkout-area #msgError,
.checkout-area #msgInfo {
    max-width: 980px;
    margin: 10px auto 0 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
}

.checkout-area h2[style*="text-align:center"] {
    max-width: 980px;
    margin: 28px auto 12px !important;
    color: #17213d !important;
    font-size: 18px !important;
    font-weight: 850 !important;
    letter-spacing: 0.03em;
}

.checkout-area .btnASeguir {
    width: 100% !important;
    min-height: 46px;
    border-radius: 14px !important;
    background: #ffffff !important;
    color: #000000 !important;
    border: 1px solid #dfe6f2 !important;
    box-shadow: 0 10px 22px rgba(34, 47, 90, 0.06);
}

@media (max-width: 767px) {
    .checkout-area {
        padding-top: 16px !important;
        padding-bottom: 56px !important;
    }

    .checkout-area > .container {
        width: min(100% - 20px, 520px) !important;
        max-width: 520px !important;
    }

    .checkout-area .your-order-area h3 {
        margin-left: 2px !important;
        font-size: 22px !important;
    }

    .checkout-area .your-order-wrap {
        padding: 24px 18px 22px !important;
        border-radius: 18px;
        box-shadow: 0 14px 34px rgba(34, 47, 90, 0.10);
    }

    .checkout-area .your-order-top ul {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .checkout-area .your-order-top ul li:nth-child(3) {
        display: none;
    }

    .checkout-area .your-order-middle ul li {
        grid-template-columns: minmax(0, 1fr) auto 34px;
        gap: 10px;
        padding: 14px 0 !important;
    }

    .checkout-area .your-order-middle .order-middle-left {
        font-size: 14px !important;
    }

    .checkout-area .your-order-middle .order-price,
    .checkout-area .your-order-middle .uprice {
        min-width: 60px;
        padding: 6px 8px;
        font-size: 13px !important;
    }

    .checkout-area .your-order-middle p {
        margin-right: 0 !important;
        padding-right: 44px;
    }

    .checkout-area .your-order-total {
        margin-top: 12px !important;
        padding: 16px !important;
        border-radius: 16px;
    }

    .checkout-area .your-order-total ul li.order-total,
    .checkout-area .your-order-total ul li.order-total1 {
        font-size: 17px !important;
    }

    .checkout-area .your-order-total ul li:last-child {
        font-size: 19px !important;
    }

    .checkout-area .payment-method {
        padding: 16px;
        border-radius: 16px;
    }

    .checkout-area .payment-accordion img[src*="tpv"] {
        width: 132px !important;
    }

    .checkout-area #tipoPago {
        height: 46px;
        border-radius: 13px !important;
    }

    .checkout-area .Place-order > a,
    .checkout-area .Place-order a#finalizarCompra {
        min-height: 52px;
        border-radius: 15px !important;
    }
}

/* Eventos: listado moderno */
body.listEventos {
    background: #f5f7fb !important;
}

body.listEventos .shop-areapb-100 {
    padding: 34px 0 72px !important;
    background: #f5f7fb !important;
}

body.listEventos .shop-areapb-100 > .container-fluid {
    width: min(1240px, calc(100% - 36px)) !important;
    max-width: 1240px !important;
    margin: 0 auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.listEventos .shop-areapb-100 > .container-fluid > .row {
    gap: 28px;
    align-items: flex-start;
}

body.listEventos .shop-areapb-100 > .container-fluid > .row > .col-lg-9 {
    flex: 1 1 0 !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.listEventos .shop-areapb-100 > .container-fluid > .row > .col-lg-3 {
    flex: 0 0 310px !important;
    max-width: 310px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.listEventos .shop-bottom-area {
    margin-top: 0 !important;
}

body.listEventos .eventFilters {
    width: auto !important;
    margin: 0 !important;
    padding: 22px !important;
    border: 1px solid #e3e9f4 !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    box-shadow: 0 18px 44px rgba(34, 47, 90, 0.09) !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
}

body.listEventos .eventFilters * {
    min-width: 0;
}

body.listEventos .eventFilters .sidebar-widget {
    margin: 0 !important;
}

body.listEventos .eventFilters h4.pro-sidebar-title {
    display: block !important;
    margin: 0 0 10px !important;
    color: #17213d !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    letter-spacing: 0.03em !important;
    line-height: 1.25 !important;
    text-transform: uppercase;
}

body.listEventos .eventFilters .pro-sidebar-search {
    margin: 0 0 20px !important;
}

body.listEventos .pro-sidebar-search .pro-sidebar-search-form {
    display: flex !important;
    align-items: center;
    height: 48px !important;
    overflow: hidden;
    border: 1px solid #dbe3f0 !important;
    border-radius: 14px !important;
    background: #fbfcff !important;
    box-shadow: 0 8px 20px rgba(34, 47, 90, 0.04);
}

body.listEventos .pro-sidebar-search .pro-sidebar-search-form input,
body.listEventos .eventFilters input,
body.listEventos .eventFilters select {
    width: 100% !important;
    height: 48px !important;
    margin: 0 !important;
    padding: 0 14px !important;
    border: 1px solid #dbe3f0 !important;
    border-radius: 14px !important;
    background: #fbfcff !important;
    color: #263454 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 650 !important;
    outline: none !important;
    box-shadow: none !important;
}

body.listEventos .pro-sidebar-search .pro-sidebar-search-form input {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
}

body.listEventos .eventFilters input:focus,
body.listEventos .eventFilters select:focus,
body.listEventos .pro-sidebar-search .pro-sidebar-search-form:focus-within {
    border-color: #2e2e2e !important;
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.10) !important;
}

body.listEventos .pro-sidebar-search .pro-sidebar-search-form button,
body.listEventos .btnBuscar {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 48px;
    width: 48px !important;
    height: 48px !important;
    margin: 0 !important;
    border: 0 !important;
    border-left: 1px solid #e3e9f4 !important;
    border-radius: 0 !important;
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 22px !important;
    line-height: 1 !important;
}

body.listEventos .filtroFechas {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
    float: none !important;
    overflow: hidden;
}

body.listEventos .filtroFechas .col-md-6 {
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
}

body.listEventos .filterTipo {
    grid-column: 1 / -1;
    margin-top: 2px;
}

body.listEventos .price-slider-_fecha,
body.listEventos .price-slider-_tipo {
    width: 100% !important;
    max-width: 100% !important;
}

body.listEventos .price-slider-_tipo select {
    min-width: 100% !important;
}

body.listEventos #shop-2 > h3 {
    margin: 42px 0 !important;
    color: #63708a !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 18px !important;
    font-weight: 800 !important;
}

body.listEventos .shop-list-wrap {
    position: relative;
    overflow: hidden;
    margin-bottom: 22px !important;
    padding: 18px !important;
    border: 1px solid #e3e9f4 !important;
    border-radius: 24px !important;
    background: #ffffff !important;
    box-shadow: 0 18px 46px rgba(34, 47, 90, 0.08) !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

body.listEventos .shop-list-wrap:hover {
    transform: translateY(-2px);
    border-color: rgba(0, 0, 0, 0.25) !important;
    box-shadow: 0 24px 60px rgba(34, 47, 90, 0.13) !important;
}

body.listEventos .shop-list-wrap > .row {
    display: grid !important;
    grid-template-columns: minmax(220px, 330px) minmax(0, 1fr);
    gap: 28px;
    align-items: center;
    margin: 0 !important;
}

body.listEventos .shop-list-wrap > .row > [class*="col-"] {
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
}

body.listEventos .shop-list-wrap .product-wrap {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 18px !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.listEventos .shop-list-wrap .product-img {
    position: relative;
    overflow: hidden;
    width: 100%;
    aspect-ratio: 4 / 5;
    padding: 0 !important;
    border: 1px solid #e6ecf6 !important;
    border-radius: 18px !important;
    background: #eef2f8 !important;
}

body.listEventos .shop-list-wrap .product-img a {
    display: block;
    width: 100%;
    height: 100%;
}

body.listEventos .shop-list-wrap .product-img img {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    object-fit: cover;
    object-position: center;
    transition: transform 0.22s ease;
}

body.listEventos .shop-list-wrap:hover .product-img img {
    transform: scale(1.025);
}

body.listEventos .shop-list-wrap .product-img > span {
    position: absolute;
    top: 14px;
    right: 14px;
    display: inline-flex !important;
    align-items: center;
    min-height: 28px;
    max-width: calc(100% - 28px);
    padding: 5px 10px !important;
    border-radius: 999px !important;
    background: #17213d !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    letter-spacing: 0.04em;
    line-height: 1 !important;
    text-transform: uppercase;
    box-shadow: 0 10px 24px rgba(23, 33, 61, 0.20);
}

body.listEventos .shop-list-content {
    padding: 2px 6px 2px 0 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
}

body.listEventos .shop-list-content h3 {
    margin: 0 0 12px !important;
    color: #111827 !important;
    font-size: clamp(24px, 3vw, 34px) !important;
    font-weight: 850 !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
}

body.listEventos .shop-list-content .product-list-price {
    margin: 0 0 14px !important;
}

body.listEventos .shop-list-content .product-list-price span {
    display: inline-flex;
    align-items: center;
    color: #111827 !important;
    font-size: 28px !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
}

body.listEventos .shop-list-content .rating-review {
    display: inline-flex !important;
    align-items: center;
    width: auto !important;
    margin: 0 0 16px !important;
    padding: 7px 11px;
    border: 1px solid #e4eaf4;
    border-radius: 999px;
    background: #f8fbff;
    color: #33415f !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    line-height: 1.2 !important;
}

body.listEventos .shop-list-content p {
    max-width: 640px;
    margin: 0 0 18px !important;
    color: #667085 !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
}

body.listEventos .shop-list-content .tagEvent,
body.listEventos .shop-list-content .tagEvent1 {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 0 !important;
    width: auto !important;
    min-height: 30px;
    margin: 0 6px 8px 0 !important;
    padding: 6px 10px !important;
    border: 1px solid #dfe6f2 !important;
    border-radius: 999px !important;
    background: #f3f6fb !important;
    color: #33415f !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-align: center !important;
}

body.listEventos .shop-list-content .tagEvent:nth-of-type(3n) {
    background: #eefaf4 !important;
    color: #157347 !important;
    border-color: #cfeede !important;
}

body.listEventos .shop-list-content .btnComprar {
    margin-top: 10px !important;
}

body.listEventos .shop-list-content .btnComprar > a,
body.listEventos .shop-list-btn a {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 150px;
    min-height: 48px;
    padding: 0 22px !important;
    border: 0 !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, #000000 0%, #000000 52%, #2e2e2e 100%) !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0.06em;
    line-height: 1 !important;
    text-transform: uppercase;
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.22);
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}

body.listEventos .shop-list-content .btnComprar > a:hover,
body.listEventos .shop-list-btn a:hover {
    transform: translateY(-1px);
    filter: brightness(1.03);
    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.30);
}

@media (min-width: 992px) {
    body.listEventos .eventFilters {
        position: sticky !important;
        top: 112px;
    }
}

@media (max-width: 991px) {
    body.listEventos .shop-areapb-100 {
        padding-top: 18px !important;
    }

    body.listEventos .shop-areapb-100 > .container-fluid {
        width: min(100% - 22px, 680px) !important;
    }

    body.listEventos .shop-areapb-100 > .container-fluid > .row {
        display: flex !important;
        flex-direction: column !important;
        gap: 16px;
    }

    body.listEventos .shop-areapb-100 > .container-fluid > .row > .col-lg-3,
    body.listEventos .shop-areapb-100 > .container-fluid > .row > .col-lg-9 {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    body.listEventos .eventFilters {
        position: static !important;
        padding: 16px !important;
        border-radius: 18px !important;
    }

    body.listEventos .eventFilters h4.pro-sidebar-title {
        display: block !important;
        margin-bottom: 8px !important;
        font-size: 12px !important;
    }

    body.listEventos .eventFilters #_fecha1,
    body.listEventos .eventFilters .firstDate {
        display: block !important;
    }

    body.listEventos .filtroFechas {
        grid-template-columns: 1fr !important;
        gap: 10px;
    }

    body.listEventos .filtroFechas .col-md-6 {
        width: 100% !important;
    }

    body.listEventos .pro-sidebar-search .pro-sidebar-search-form,
    body.listEventos .eventFilters input,
    body.listEventos .eventFilters select {
        height: 46px !important;
    }

    body.listEventos .shop-list-wrap {
        padding: 12px !important;
        border-radius: 20px !important;
    }

    body.listEventos .shop-list-wrap > .row {
        grid-template-columns: 1fr !important;
        gap: 16px;
    }

    body.listEventos .shop-list-wrap .product-img {
        aspect-ratio: 4 / 5;
        border-radius: 16px !important;
    }

    body.listEventos .shop-list-content {
        padding: 0 2px 4px !important;
    }

    body.listEventos .shop-list-content h3 {
        font-size: 24px !important;
    }

    body.listEventos .shop-list-content .product-list-price span {
        font-size: 26px !important;
    }

    body.listEventos .shop-list-content p {
        font-size: 14px !important;
    }

    body.listEventos .shop-list-content .btnComprar > a,
    body.listEventos .shop-list-btn a {
        width: 100% !important;
    }
}

/* Comprar bonos / entradas: tickets modernos */
#products {
    width: min(1240px, calc(100% - 36px));
    margin: 42px auto 80px;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
}

#products .product-area {
    padding: 0 !important;
    background: #f5f7fb !important;
}

#products .product-area > .container {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#products .tab-content,
#products .tab-pane,
#products .row[class*="item-wrapper"] {
    width: 100% !important;
}

#products .selectionProduct {
    display: grid !important;
    grid-template-columns: minmax(300px, 420px) minmax(0, 1fr);
    gap: 34px;
    align-items: start;
    width: 100% !important;
    max-width: 1120px;
    margin: 0 auto 34px !important;
    padding: 22px !important;
    border: 1px solid #e3e9f4;
    border-radius: 24px;
    background: #ffffff;
    box-shadow: 0 18px 46px rgba(34, 47, 90, 0.08);
}

#products .selectionProduct > .col-md-6,
#products .selectionProduct > .col-md-12 {
    width: 100% !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#products .selectionProduct > .col-md-12 {
    display: none !important;
}

#products .cardWrap1 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 132px;
    width: 100% !important;
    max-width: 420px;
    min-height: 246px;
    margin: 0 !important;
    overflow: hidden;
    border: 1px solid #dfe6f2;
    border-radius: 22px;
    background: #ffffff;
    color: #17213d !important;
    box-shadow: 0 16px 38px rgba(34, 47, 90, 0.10);
    cursor: default;
}

#products .card1 {
    float: none !important;
    width: auto !important;
    height: auto !important;
    min-height: 246px;
    padding: 16px !important;
    background: #ffffff !important;
}

#products .cardLong {
    height: auto !important;
}

#products .cardLeft1 {
    display: flex !important;
    flex-direction: column;
    justify-content: flex-start;
    gap: 14px;
    border-radius: 0 !important;
}

#products .cardRight1 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 14px;
    border-left: 1px dashed #cbd5e1 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, #f8fbff 0%, #eefaf4 100%) !important;
}

#products .cardRight1::before,
#products .cardRight1::after {
    left: -8px !important;
    width: 16px !important;
    height: 16px !important;
    background: #ffffff !important;
    border: 1px solid #dfe6f2;
}

#products .cardRight1::before {
    top: -8px !important;
}

#products .cardRight1::after {
    bottom: -8px !important;
}

#products .cardLeft1 > .h1 {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 48px !important;
    margin: 0 !important;
    padding: 9px 12px !important;
    border-radius: 14px;
    background: linear-gradient(135deg, #000000 0%, #2e2e2e 100%);
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    line-height: 1.15 !important;
    letter-spacing: 0.01em;
    overflow: hidden;
}

#products .cardLeft1 > .h1 span {
    display: -webkit-box;
    width: 100%;
    max-height: 30px;
    overflow: hidden;
    color: #ffffff !important;
    font-weight: 850 !important;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    text-overflow: ellipsis;
}

#products .title1,
#products .name1,
#products .seat,
#products .time,
#products .time1 {
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    text-transform: none !important;
}

#products .title1 .h2,
#products .name1 .h2,
#products .name1 h2,
#products .seat .h2,
#products .time .h2,
#products .time1 .h2 {
    margin: 0 0 3px !important;
    color: #263454 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    overflow-wrap: anywhere;
}

#products .title1 .h2,
#products .name1 .h2,
#products .name1 h2 {
    display: -webkit-box;
    max-height: 36px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

#products .seat .h2 {
    display: -webkit-box;
    max-height: 38px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

#products .title1 span,
#products .name1 span,
#products .seat span,
#products .time span,
#products .time1 span,
#products .number span {
    color: #7a879d !important;
    font-size: 10px !important;
    font-weight: 850 !important;
    letter-spacing: 0.05em;
    line-height: 1 !important;
    text-transform: uppercase;
}

#products .eye {
    width: 42px !important;
    height: 42px !important;
    flex: 0 0 42px;
    margin: 0 !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    box-shadow: inset 0 0 0 1px #dfe6f2;
}

#products .eye::before {
    width: 18px !important;
    height: 18px !important;
    left: 12px !important;
    top: 12px !important;
    border-radius: 999px !important;
    background: #000000 !important;
}

#products .eye::after {
    width: 7px !important;
    height: 7px !important;
    left: 17px !important;
    top: 17px !important;
    background: #ffffff !important;
}

#products .number {
    width: 100%;
    padding: 0 10px;
    text-align: center !important;
}

#products .number .h3 {
    margin: 0 0 7px !important;
    color: #000000 !important;
    font-size: 28px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    white-space: nowrap;
}

#products .btnVerProducto {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 420px !important;
    min-height: 48px !important;
    margin: 14px 0 0 !important;
    padding: 0 18px !important;
    transform: none !important;
    border: 0 !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, #000000 0%, #000000 52%, #2e2e2e 100%) !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0.06em;
    line-height: 1 !important;
    text-align: center !important;
    text-transform: uppercase;
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.22);
}

#products .btnVerProducto p {
    margin: 0 !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

#products .selectionProduct > .col-md-6:nth-of-type(2) {
    align-self: center;
    padding: 22px !important;
    border: 1px solid #e4eaf4;
    border-radius: 20px;
    background: #f8fbff;
}

#products .selectionProduct .billing-info {
    margin-bottom: 18px !important;
}

#products .selectionProduct .billing-info label {
    display: block;
    margin: 0 0 8px !important;
    color: #17213d !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    letter-spacing: 0.01em;
}

#products .selectionProduct .form-control,
#products .selectionProduct input[type="date"],
#products .selectionProduct input[type="number"],
#products .selectionProduct input[type="text"] {
    width: 100% !important;
    height: 48px !important;
    margin: 0 !important;
    padding: 0 14px !important;
    border: 1px solid #d6deec !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    color: #263454 !important;
    font-size: 14px !important;
    font-weight: 650 !important;
    box-shadow: 0 8px 20px rgba(34, 47, 90, 0.04) !important;
    outline: none !important;
}

#products .selectionProduct .form-control:focus,
#products .selectionProduct input:focus {
    border-color: #2e2e2e !important;
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.10) !important;
}

#products .selectionProduct .shop-list-content {
    padding: 18px !important;
    border: 1px solid #e4eaf4;
    border-radius: 18px;
    background: #ffffff;
}

#products .selectionProduct .shop-list-content h3,
#products .selectionProduct h4 {
    margin: 0 0 12px !important;
    color: #17213d !important;
    font-size: 18px !important;
    font-weight: 850 !important;
}

#products .selectionProduct .shop-list-content p,
#products .selectionProduct > .col-md-6:nth-of-type(2) p {
    color: #5f6b82 !important;
    font-size: 14px !important;
    line-height: 1.55 !important;
}

@media (max-width: 900px) {
    #products {
        width: min(100% - 20px, 560px);
        margin-top: 24px;
    }

    #products .selectionProduct {
        grid-template-columns: 1fr !important;
        gap: 16px;
        padding: 12px !important;
        border-radius: 20px;
    }

    #products .cardWrap1 {
        max-width: none;
        grid-template-columns: minmax(0, 1fr) 108px;
        min-height: 230px;
    }

    #products .card1 {
        min-height: 230px;
        padding: 14px !important;
    }

    #products .cardLeft1 {
        max-width: none !important;
    }

    #products .cardRight1 {
        width: auto !important;
    }

    #products .cardLeft1 > .h1 {
        min-height: 44px !important;
        font-size: 12px !important;
    }

    #products .title1 .h2,
    #products .name1 .h2,
    #products .name1 h2,
    #products .seat .h2 {
        font-size: 13px !important;
    }

    #products .number .h3 {
        font-size: 24px !important;
    }

    #products .btnVerProducto {
        max-width: none !important;
    }

    #products .selectionProduct > .col-md-6:nth-of-type(2) {
        padding: 16px !important;
        border-radius: 18px;
    }
}

/* Ajuste fino alineacion tickets compra */
#products .cardLeft1 {
    padding-left: 18px !important;
    padding-right: 18px !important;
}

#products .cardLeft1 > .h1 {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

#products .title1,
#products .name1,
#products .seat {
    width: 100% !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    text-align: left !important;
}

#products .title1 .h2,
#products .name1 .h2,
#products .name1 h2,
#products .seat .h2,
#products .title1 span,
#products .name1 span,
#products .seat span {
    text-align: left !important;
}

#products .cardRight1 {
    display: grid !important;
    grid-template-rows: 44px auto;
    place-items: center !important;
    justify-items: center !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
}

#products .cardRight1 .eye {
    justify-self: center !important;
}

#products .cardRight1 .number {
    display: flex !important;
    flex-direction: column;
    align-items: center !important;
    justify-content: center !important;
    justify-self: center !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    text-align: center !important;
}

#products .cardRight1 .number .h3 {
    display: block !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: center !important;
}

#products .cardRight1 .number span {
    width: 100% !important;
    text-align: center !important;
}

@media (max-width: 900px) {
    #products .cardLeft1 {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    #products .title1,
    #products .name1,
    #products .seat {
        padding-left: 4px !important;
        padding-right: 4px !important;
    }

    #products .cardRight1 {
        padding-left: 8px !important;
        padding-right: 8px !important;
    }
}

/* ===============================
   CENTRAR PRECIO CORRECTAMENTE
   =============================== */

#products .cardRight1 .number {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

/* El número en sí (€7.50) */
#products .cardRight1 .number h3,
#products .cardRight1 .number .h3 {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 !important;
}

/* Texto "PRECIO" debajo */
#products .cardRight1 .number span {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin-top: 4px !important;
}

/* Por si hay offsets raros heredados */
#products .cardRight1 {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Eliminar posibles desplazamientos invisibles */
#products .cardRight1 .number::before,
#products .cardRight1 .number::after {
    display: none !important;
    content: none !important;
}

body.listEventos .shop-areapb-100 > .container-fluid > .row {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

body.listEventos .shop-areapb-100 > .container-fluid > .row > .col-lg-3,
body.listEventos .shop-areapb-100 > .container-fluid > .row > .col-lg-9 {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.listEventos .eventFiltersDropdown {
    position: relative !important;
    z-index: 30 !important;
    width: 100% !important;
    margin: 0 0 2px !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
}

body.listEventos .eventFiltersColumnDropdown,
body.listActividades .eventFiltersColumnDropdown {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
}

body.listEventos .eventFiltersCollapse > .eventFiltersColumn,
body.listActividades .eventFiltersCollapse > .eventFiltersColumn {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
}

body.listEventos .eventFiltersDropdown > summary,
body.listEventos .eventFiltersDropdown > .eventFiltersToggle,
body.listEventos .eventFiltersDropdownJs > .eventFiltersToggle {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 46px !important;
    padding: 0 46px 0 18px !important;
    border: 1px solid #dbe3f0 !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    color: #17213d !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0.04em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    box-shadow: 0 12px 30px rgba(34, 47, 90, 0.08) !important;
    cursor: pointer !important;
    list-style: none !important;
    user-select: none !important;
}

body.listEventos .eventFiltersDropdownJs > .eventFiltersToggle {
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
}

body.listEventos .eventFiltersDropdown > summary::-webkit-details-marker {
    display: none !important;
}

body.listEventos .eventFiltersDropdown > summary::after,
body.listEventos .eventFiltersDropdown > .eventFiltersToggle::after,
body.listEventos .eventFiltersDropdownJs > .eventFiltersToggle::after {
    content: "" !important;
    position: absolute !important;
    right: 15px !important;
    top: 50% !important;
    width: 9px !important;
    height: 9px !important;
    border-right: 2px solid #000000 !important;
    border-bottom: 2px solid #000000 !important;
    transform: translateY(-65%) rotate(45deg) !important;
    transition: transform 0.18s ease !important;
}

body.listEventos .eventFiltersDropdown[open] > summary::after,
body.listEventos .eventFiltersDropdown > .eventFiltersToggle[aria-expanded="true"]::after,
body.listEventos .eventFiltersDropdownJs.open > .eventFiltersToggle::after {
    transform: translateY(-35%) rotate(225deg) !important;
}

body.listEventos .eventFiltersDropdown .eventFiltersCollapse.collapse:not(.show) .eventFilters {
    display: none !important;
}

body.listEventos .eventFiltersDropdown[open] .eventFilters,
body.listEventos .eventFiltersDropdown .eventFiltersCollapse.show .eventFilters,
body.listEventos .eventFiltersDropdown.open .eventFilters {
    display: block !important;
}

body.listEventos .eventFiltersDropdown .eventFilters {
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: min(70vh, 540px) !important;
    margin: 10px 0 0 !important;
    overflow: auto !important;
}

body.listEventos .eventFiltersDropdown .eventFilters .sidebar-widget {
    display: grid !important;
    grid-template-columns: minmax(220px, 1.2fr) minmax(260px, 1.8fr) !important;
    column-gap: 18px !important;
    align-items: start !important;
}

body.listEventos .eventFiltersDropdown .eventFilters .pro-sidebar-search {
    margin-bottom: 0 !important;
}

body.listEventos .eventFiltersDropdown .eventFilters .pro-sidebar-title:first-child,
body.listEventos .eventFiltersDropdown .eventFilters .pro-sidebar-title:first-child + .pro-sidebar-search {
    grid-column: 1 !important;
}

body.listEventos .eventFiltersDropdown .eventFilters .pro-sidebar-title:nth-of-type(2),
body.listEventos .eventFiltersDropdown .eventFilters .filtroFechas {
    grid-column: 2 !important;
}

body.listEventos .eventFiltersDropdown .eventFilters .filtroFechas {
    margin-bottom: 0 !important;
}

body.listEventos .shop-list-content .tagEvent,
body.listEventos .shop-list-content .tagEvent1 {
    vertical-align: middle !important;
    white-space: nowrap !important;
}

body.listEventos .shop-list-content .tagEvent + br,
body.listEventos .shop-list-content .tagEvent1 + br {
    display: none !important;
}

@media (max-width: 767px) {
    body.listEventos .eventFiltersDropdown > summary,
    body.listEventos .eventFiltersDropdown > .eventFiltersToggle,
    body.listEventos .eventFiltersDropdownJs > .eventFiltersToggle {
        width: 100% !important;
    }

    body.listEventos .eventFiltersDropdown .eventFilters {
        width: 100% !important;
    }

    body.listEventos .eventFiltersDropdown .eventFilters .sidebar-widget {
        display: block !important;
    }

    body.listEventos .eventFiltersDropdown .eventFilters .pro-sidebar-search {
        margin-bottom: 16px !important;
    }
}

body.listActividades .shop-areapb-100 > .container-fluid > .row {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
}

body.listActividades .shop-areapb-100 > .container-fluid > .row > .col-lg-3,
body.listActividades .shop-areapb-100 > .container-fluid > .row > .col-lg-9 {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.listActividades .eventFiltersDropdown {
    position: relative !important;
    z-index: 30 !important;
    width: 100% !important;
    margin: 0 0 2px !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
}

body.listActividades .eventFiltersDropdown > summary,
body.listActividades .eventFiltersDropdown > .eventFiltersToggle,
body.listActividades .eventFiltersDropdownJs > .eventFiltersToggle {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 46px !important;
    padding: 0 46px 0 18px !important;
    border: 1px solid #dbe3f0 !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    color: #17213d !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0.04em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    box-shadow: 0 12px 30px rgba(34, 47, 90, 0.08) !important;
    cursor: pointer !important;
    list-style: none !important;
    user-select: none !important;
}

body.listActividades .eventFiltersDropdown > summary::-webkit-details-marker {
    display: none !important;
}

body.listActividades .eventFiltersDropdown > summary::after,
body.listActividades .eventFiltersDropdown > .eventFiltersToggle::after,
body.listActividades .eventFiltersDropdownJs > .eventFiltersToggle::after {
    content: "" !important;
    position: absolute !important;
    right: 15px !important;
    top: 50% !important;
    width: 9px !important;
    height: 9px !important;
    border-right: 2px solid #000000 !important;
    border-bottom: 2px solid #000000 !important;
    transform: translateY(-65%) rotate(45deg) !important;
    transition: transform 0.18s ease !important;
}

body.listActividades .eventFiltersDropdown[open] > summary::after,
body.listActividades .eventFiltersDropdown.open > .eventFiltersToggle::after,
body.listActividades .eventFiltersDropdown > .eventFiltersToggle[aria-expanded="true"]::after,
body.listActividades .eventFiltersDropdownJs.open > .eventFiltersToggle::after {
    transform: translateY(-35%) rotate(225deg) !important;
}

body.listActividades .eventFiltersDropdown .eventFiltersCollapse.collapse:not(.show) .eventFilters {
    display: none !important;
}

body.listActividades .eventFiltersDropdown[open] .eventFilters,
body.listActividades .eventFiltersDropdown .eventFiltersCollapse.show .eventFilters,
body.listActividades .eventFiltersDropdown.open .eventFilters {
    display: block !important;
}

body.listActividades .eventFiltersDropdown .eventFilters {
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: min(70vh, 540px) !important;
    margin: 10px 0 0 !important;
    padding: 18px !important;
    overflow: auto !important;
    border: 1px solid #e3e9f4 !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 18px 44px rgba(34, 47, 90, 0.12) !important;
}

body.listActividades .eventFiltersDropdown .eventFilters .sidebar-widget {
    display: grid !important;
    grid-template-columns: minmax(220px, 1.2fr) minmax(260px, 1.8fr) !important;
    column-gap: 18px !important;
    align-items: start !important;
}

body.listActividades .eventFiltersDropdown .eventFilters .btn-primary {
    grid-column: 1 / -1 !important;
    margin-bottom: 14px !important;
}

body.listActividades .eventFiltersDropdown .eventFilters hr {
    display: none !important;
}

body.listActividades .eventFiltersDropdown .eventFilters .pro-sidebar-search {
    margin-bottom: 0 !important;
}

body.listActividades .eventFiltersDropdown .eventFilters .pro-sidebar-title:first-child,
body.listActividades .eventFiltersDropdown .eventFilters .pro-sidebar-title:first-child + .pro-sidebar-search {
    grid-column: 1 !important;
}

body.listActividades .eventFiltersDropdown .eventFilters .pro-sidebar-title:nth-of-type(2),
body.listActividades .eventFiltersDropdown .eventFilters .filtroFechas {
    grid-column: 2 !important;
}

body.listActividades .eventFiltersDropdown .eventFilters h4.pro-sidebar-title {
    display: block !important;
    margin: 0 0 8px !important;
    color: #17213d !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    letter-spacing: 0.03em !important;
    line-height: 1.25 !important;
    text-transform: uppercase !important;
}

body.listActividades .eventFiltersDropdown .eventFilters .filtroFechas {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

body.listActividades .eventFiltersDropdown .eventFilters .filtroFechas .col-md-6,
body.listActividades .eventFiltersDropdown .eventFilters .filterTipo {
    width: auto !important;
    max-width: none !important;
    padding: 0 !important;
}

body.listActividades .eventFiltersDropdown .eventFilters .filterTipo {
    grid-column: 1 / -1 !important;
}

body.listActividades .eventFiltersDropdown .eventFilters input,
body.listActividades .eventFiltersDropdown .eventFilters select,
body.listActividades .eventFiltersDropdown .pro-sidebar-search-form {
    height: 46px !important;
    border-radius: 14px !important;
}

body.listActividades .eventFiltersDropdown .eventFilters #_fecha1,
body.listActividades .eventFiltersDropdown .eventFilters .firstDate {
    display: block !important;
}

body.listActividades .eventFiltersDropdown .eventFilters .btnBuscar {
    margin-top: 0 !important;
}

body.listActividades .eventFiltersDropdown .eventFilters form {
    margin-bottom: 0 !important;
}

@media (max-width: 767px) {
    body.listActividades .eventFiltersDropdown > summary,
    body.listActividades .eventFiltersDropdown > .eventFiltersToggle,
    body.listActividades .eventFiltersDropdownJs > .eventFiltersToggle {
        width: 100% !important;
    }

    body.listActividades .eventFiltersDropdown .eventFilters {
        width: 100% !important;
    }

    body.listActividades .eventFiltersDropdown .eventFilters .sidebar-widget {
        display: block !important;
    }

    body.listActividades .eventFiltersDropdown .eventFilters .pro-sidebar-search {
        margin-bottom: 16px !important;
    }

    body.listActividades .eventFiltersDropdown .eventFilters .filtroFechas {
        grid-template-columns: 1fr !important;
    }
}

@media (min-width: 992px) {
    body.listActividades .shop-areapb-100 > .container-fluid > .row {
        display: flex !important;
        flex-direction: column !important;
        gap: 16px !important;
    }

    body.listActividades .shop-areapb-100 > .container-fluid > .row > .col-lg-9 {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    body.listActividades .shop-areapb-100 > .container-fluid > .row > .col-lg-3 {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    body.listActividades .eventFiltersDropdown {
        position: relative !important;
        z-index: auto !important;
        width: 100% !important;
        margin: 0 0 2px !important;
    }

    body.listActividades .eventFiltersToggle {
        display: flex !important;
    }
}

@media (max-width: 991px) {
    body.listActividades .shop-areapb-100 > .container-fluid > .row {
        display: flex !important;
        flex-direction: column !important;
        gap: 16px !important;
    }

    body.listActividades .shop-areapb-100 > .container-fluid > .row > .col-lg-3,
    body.listActividades .shop-areapb-100 > .container-fluid > .row > .col-lg-9 {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    body.listActividades .eventFiltersToggle {
        display: inline-flex !important;
    }

    body.listActividades .eventFiltersDropdown .eventFiltersCollapse.collapse:not(.show) .eventFilters {
        display: none !important;
    }

    body.listActividades .eventFiltersDropdown .eventFiltersCollapse.show .eventFilters {
        display: block !important;
    }
}



/* Eventos: collapse del bloque completo de filtros */
body.listEventos .eventos-filter-collapse {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 16px !important;
    padding: 0 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
}

body.listEventos .eventos-filter-toggle {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 54px !important;
    padding: 0 58px 0 22px !important;
    border: 1px solid #dbe3f0 !important;
    border-radius: 16px !important;
    background: #ffffff !important;
    color: #17213d !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0.04em !important;
    line-height: 1.15 !important;
    text-transform: uppercase !important;
    box-shadow: 0 14px 34px rgba(34, 47, 90, 0.10) !important;
    cursor: pointer !important;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease !important;
}

body.listEventos .eventos-filter-toggle:hover,
body.listEventos .eventos-filter-toggle[aria-expanded="true"] {
    border-color: rgba(0, 0, 0, 0.28) !important;
    box-shadow: 0 18px 42px rgba(34, 47, 90, 0.14) !important;
}

body.listEventos .eventos-filter-toggle::after {
    content: "" !important;
    position: absolute !important;
    right: 22px !important;
    top: 50% !important;
    width: 10px !important;
    height: 10px !important;
    border-right: 2px solid #000000 !important;
    border-bottom: 2px solid #000000 !important;
    transform: translateY(-65%) rotate(45deg) !important;
    transition: transform 0.2s ease !important;
}

body.listEventos .eventos-filter-toggle[aria-expanded="true"]::after {
    transform: translateY(-35%) rotate(225deg) !important;
}

body.listEventos .eventos-filter-panel {
    width: 100% !important;
}

body.listEventos .eventos-filter-panel > .eventos-filter-column {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.listEventos .eventos-filter-panel .eventFilters {
    position: static !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 12px 0 0 !important;
}

body.listEventos .eventos-filter-panel:not(.show) .eventFilters {
    display: none !important;
}

body.listEventos .eventos-filter-panel.show .eventFilters,
body.listEventos .eventos-filter-panel.collapsing .eventFilters {
    display: block !important;
}

@media (max-width: 767px) {
    body.listEventos .eventos-filter-toggle {
        min-height: 50px !important;
        padding-left: 16px !important;
        padding-right: 48px !important;
        font-size: 12px !important;
    }
}

/* =========================================================
   EVENTOS.PHP · COLLAPSE FILTRO MODERNO
   ========================================================= */

/* Contenedor general del bloque filtro */
.eventos-filter-collapse {
    width: 100% !important;
    margin: 0 0 18px 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}

/* Botón que abre/cierra el filtro */
.eventos-filter-toggle {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 48px !important;

    margin: 0 0 12px 0 !important;
    padding: 12px 16px !important;

    border: 1px solid #dbe3f0 !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    color: #1f2a56 !important;

    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-align: center !important;

    box-shadow: 0 6px 18px rgba(31, 42, 86, 0.05) !important;
    transition: all 0.2s ease;
}

.eventos-filter-toggle:hover,
.eventos-filter-toggle:focus {
    background: #f8faff !important;
    border-color: #bfcdf3 !important;
    box-shadow: 0 10px 22px rgba(31, 42, 86, 0.08) !important;
    outline: none !important;
}

/* Panel desplegable */
.eventos-filter-panel,
#eventosFilterCollapse {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Cuando el panel contiene una card o caja interior */
.eventos-filter-panel > *,
#eventosFilterCollapse > * {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
}

/* Si dentro hay una caja blanca principal */
.eventos-filter-panel .eventos-filter-box,
#eventosFilterCollapse .eventos-filter-box,
.eventos-filter-panel .billing-info-wrap,
#eventosFilterCollapse .billing-info-wrap,
.eventos-filter-panel .card,
#eventosFilterCollapse .card {
    width: 100% !important;
    padding: 18px !important;
    border: 1px solid #e7ecf5 !important;
    border-radius: 20px !important;
    background: #ffffff !important;
    box-shadow: 0 10px 26px rgba(31, 42, 86, 0.05) !important;
    box-sizing: border-box !important;
}

/* Evita desplazamientos raros heredados de rows */
.eventos-filter-panel .row,
#eventosFilterCollapse .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Evita columnas con paddings raros dentro del filtro */
.eventos-filter-panel [class*="col-"],
#eventosFilterCollapse [class*="col-"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
}

/* Inputs del filtro */
.eventos-filter-panel input,
.eventos-filter-panel select,
.eventos-filter-panel textarea,
#eventosFilterCollapse input,
#eventosFilterCollapse select,
#eventosFilterCollapse textarea {
    width: 100% !important;
    min-height: 44px !important;
    margin: 0 !important;
    padding: 10px 14px !important;

    border: 1px solid #dbe3f0 !important;
    border-radius: 12px !important;
    background: #fbfcff !important;
    color: #1f2a56 !important;

    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.2 !important;

    box-shadow: none !important;
    box-sizing: border-box !important;
}

.eventos-filter-panel input:focus,
.eventos-filter-panel select:focus,
.eventos-filter-panel textarea:focus,
#eventosFilterCollapse input:focus,
#eventosFilterCollapse select:focus,
#eventosFilterCollapse textarea:focus {
    border-color: #2e2e2e !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.08) !important;
    outline: none !important;
}

/* Labels */
.eventos-filter-panel label,
#eventosFilterCollapse label {
    display: block !important;
    margin: 0 0 8px 0 !important;
    color: #243056 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

/* Separación vertical entre bloques */
.eventos-filter-panel .form-group,
#eventosFilterCollapse .form-group,
.eventos-filter-panel .campo-filtro,
#eventosFilterCollapse .campo-filtro {
    margin-bottom: 14px !important;
}

/* Si el collapse usa animación bootstrap, que no descuadre */
.collapse.eventos-filter-panel,
#eventosFilterCollapse.collapse {
    transition: height 0.25s ease !important;
}

/* Móvil */
@media (max-width: 600px) {
    .eventos-filter-toggle {
        min-height: 44px !important;
        padding: 10px 14px !important;
        border-radius: 12px !important;
        font-size: 13px !important;
    }

    .eventos-filter-panel .eventos-filter-box,
    #eventosFilterCollapse .eventos-filter-box,
    .eventos-filter-panel .billing-info-wrap,
    #eventosFilterCollapse .billing-info-wrap,
    .eventos-filter-panel .card,
    #eventosFilterCollapse .card {
        padding: 14px !important;
        border-radius: 16px !important;
    }

    .eventos-filter-panel input,
    .eventos-filter-panel select,
    .eventos-filter-panel textarea,
    #eventosFilterCollapse input,
    #eventosFilterCollapse select,
    #eventosFilterCollapse textarea {
        min-height: 42px !important;
        font-size: 13px !important;
    }
}

/* Separación entre campos del filtro */
.eventos-filter-panel .form-group,
#eventosFilterCollapse .form-group,
.eventos-filter-panel > div,
#eventosFilterCollapse > div {
    margin-bottom: 16px !important;
}

/* Separación específica entre BUSCAR y FECHA (por si no hay form-group) */
.eventos-filter-panel label,
#eventosFilterCollapse label {
    margin-top: 12px !important;
}

/* Quitar margen al primero para que no quede raro arriba */
.eventos-filter-panel label:first-of-type,
#eventosFilterCollapse label:first-of-type {
    margin-top: 0 !important;
}



/* RESERVA CALENDARIO MODERNO */
body.reserva-page {
    background: #f4f7fb !important;
    color: #111827 !important;
}

body.reserva-page > .col-md-12.title {
    width: min(1180px, calc(100% - 28px)) !important;
    float: none !important;
    margin: 28px auto 18px !important;
    padding: 0 !important;
}

body.reserva-page > .col-md-12.title > .row {
    margin: 0 !important;
}

body.reserva-page .billing-info.mb-20 {
    width: min(620px, 100%) !important;
    margin: 0 auto 18px !important;
    padding: 18px !important;
    border: 1px solid rgba(15, 23, 42, 0.08) !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 18px 50px rgba(15, 23, 42, 0.08) !important;
}

body.reserva-page #q_ubicacion {
    width: 100% !important;
    min-height: 54px !important;
    padding: 0 48px 0 18px !important;
    border: 1px solid #dbe3ef !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    color: #172033 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.06) !important;
    outline: none !important;
}

body.reserva-page #q_ubicacion:focus {
    border-color: #000000 !important;
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.12), 0 8px 24px rgba(15, 23, 42, 0.06) !important;
}

body.reserva-page #titleCalendarView {
    margin: 4px auto 8px !important;
    color: #0f172a !important;
    font-size: 28px !important;
    font-weight: 800 !important;
    letter-spacing: 0 !important;
    line-height: 1.15 !important;
}

body.reserva-page #divNuevaReserva {
    position: static !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    display: none;
    width: min(1180px, calc(100% - 28px)) !important;
    margin: 0 auto 14px !important;
    text-align: right !important;
}

body.reserva-page #divNuevaReserva .btn {
    min-height: 44px !important;
    margin: 0 0 8px 8px !important;
    padding: 12px 18px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: #0f172a !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-transform: none !important;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.18) !important;
}

body.reserva-page #divNuevaReserva #btnReservar {
    background: #000000 !important;
}

body.reserva-page #calendar {
    width: min(1180px, calc(100% - 28px)) !important;
    max-width: none !important;
    margin: 0 auto 36px !important;
    padding: 18px !important;
    overflow: hidden !important;
    border: 1px solid rgba(15, 23, 42, 0.08) !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    box-shadow: 0 22px 70px rgba(15, 23, 42, 0.10) !important;
}

body.reserva-page .fc {
    color: #0f172a !important;
    font-family: inherit !important;
}

body.reserva-page .fc-toolbar.fc-header-toolbar {
    display: grid !important;
    grid-template-columns: auto minmax(220px, 1fr) auto !important;
    gap: 12px !important;
    align-items: center !important;
    margin: 0 0 18px !important;
}

body.reserva-page .fc-left,
body.reserva-page .fc-center,
body.reserva-page .fc-right {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
}

body.reserva-page .fc-center {
    justify-content: center !important;
}

body.reserva-page .fc-right {
    justify-content: flex-end !important;
    flex-wrap: wrap !important;
}

body.reserva-page .fc-center h2 {
    margin: 0 !important;
    color: #0f172a !important;
    font-size: 24px !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    line-height: 1.15 !important;
    text-transform: none !important;
}

body.reserva-page .fc-button {
    min-height: 38px !important;
    padding: 0 14px !important;
    border: 1px solid #d9e2ef !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    color: #172033 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 38px !important;
    text-shadow: none !important;
    box-shadow: none !important;
    opacity: 1 !important;
}

body.reserva-page .fc-prev-button,
body.reserva-page .fc-next-button {
    width: 42px !important;
    padding: 0 !important;
    font-size: 19px !important;
}

body.reserva-page .fc-button:hover,
body.reserva-page .fc-button:focus {
    border-color: #000000 !important;
    background: rgba(0, 0, 0, 0.08) !important;
    color: #0f172a !important;
}

body.reserva-page .fc-button.fc-button-active,
body.reserva-page .fc-button:active {
    border-color: #000000 !important;
    background: #000000 !important;
    color: #ffffff !important;
}

body.reserva-page .fc-view-container {
    overflow: hidden !important;
    border: 1px solid #edf1f7 !important;
    border-radius: 18px !important;
    background: #ffffff !important;
}

body.reserva-page .fc table {
    font-size: 13px !important;
}

body.reserva-page .fc-head-container,
body.reserva-page .fc-widget-header,
body.reserva-page .fc-widget-content,
body.reserva-page .fc-time-grid .fc-slats td {
    border-color: #edf1f7 !important;
}

body.reserva-page .fc-day-header {
    padding: 12px 6px !important;
    background: #f8fafc !important;
    color: #334155 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    text-transform: lowercase !important;
}

body.reserva-page .fc-day-header:first-letter {
    text-transform: uppercase !important;
}

body.reserva-page .fc-axis {
    width: 56px !important;
    padding: 0 8px !important;
    color: #64748b !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

body.reserva-page .fc-time-grid .fc-slats td {
    height: 38px !important;
}

body.reserva-page .fc-time-grid .fc-now-indicator-line {
    border-color: #ef4444 !important;
    border-width: 2px !important;
}

body.reserva-page .fc-time-grid .fc-now-indicator-arrow {
    border-left-color: #ef4444 !important;
    border-right-color: #ef4444 !important;
}

body.reserva-page .fc-today {
    background: #fff9db !important;
}

body.reserva-page .fc-event,
body.reserva-page .fc-event-dot {
    border: 1px solid rgba(15, 23, 42, 0.10) !important;
    border-radius: 10px !important;
    background: #ecfeff !important;
    color: #0f172a !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.10) !important;
}

body.reserva-page .fc-event {
    padding: 4px 6px !important;
    cursor: pointer !important;
}

body.reserva-page .fc-title,
body.reserva-page .fc-time {
    color: #0f172a !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    white-space: normal !important;
}

body.reserva-page .fc-time {
    display: block !important;
    margin-bottom: 2px !important;
    color: #475569 !important;
}

body.reserva-page .fc-event.perfil,
body.reserva-page .perfil {
    background: #fef3c7 !important;
}

body.reserva-page .fc-event.reserva,
body.reserva-page .reserva {
    background: #bbf7d0 !important;
}

body.reserva-page .fc-event.reserva1,
body.reserva-page .reserva1 {
    background: #fed7aa !important;
}

body.reserva-page .fc-event.actividad,
body.reserva-page .actividad {
    background: #bfdbfe !important;
}

body.reserva-page .fc-list-view {
    border: 0 !important;
}

body.reserva-page .fc-list-heading td {
    background: #f8fafc !important;
    color: #0f172a !important;
    font-weight: 900 !important;
}

body.reserva-page .fc-list-item {
    cursor: pointer !important;
}

body.reserva-page .fc-list-item:hover td {
    background: #f8fafc !important;
}

body.reserva-page #modalReserva .modal-dialog,
body.reserva-page #modalCancelarReserva .modal-dialog {
    width: min(760px, calc(100% - 24px)) !important;
    min-width: 0 !important;
    max-width: min(760px, calc(100% - 24px)) !important;
    margin: 24px auto !important;
}

body.reserva-page #modalReserva .modal-content,
body.reserva-page #modalCancelarReserva .modal-content,
body.reserva-page #modalBono .modal-content {
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    box-shadow: 0 28px 90px rgba(15, 23, 42, 0.24) !important;
}

body.reserva-page #modalReserva .modal-header,
body.reserva-page #modalCancelarReserva .modal-header,
body.reserva-page #modalBono .modal-header {
    min-height: 58px !important;
    padding: 14px 18px !important;
    border: 0 !important;
    background: #f8fafc !important;
}

body.reserva-page #modalReserva .close,
body.reserva-page #modalCancelarReserva .close,
body.reserva-page #modalBono .close {
    width: 40px !important;
    height: 40px !important;
    border-radius: 999px !important;
    background: #ffffff !important;
    color: #0f172a !important;
    font-size: 24px !important;
    line-height: 40px !important;
    opacity: 1 !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08) !important;
}

body.reserva-page #modalReserva .modal-body {
    padding: 18px !important;
    background: #f6f8fb !important;
}

body.reserva-page #modalReserva .modal-body .title,
body.reserva-page #modalReserva .modal-body .row,
body.reserva-page #modalReserva .modal-body [class*="col-"] {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.reserva-page #modalReserva .modal-body .row > .col-lg-12.col-md-12:not(#div2) {
    display: none !important;
}

body.reserva-page #div2 .billing-info {
    width: min(440px, 100%) !important;
    margin-bottom: 16px !important;
}

body.reserva-page #div2 h4 {
    margin: 0 0 10px !important;
    color: #334155 !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase !important;
}

body.reserva-page #div2 h4 u {
    text-decoration: none !important;
}

body.reserva-page .datepickerUI,
body.reserva-page #q_fecha {
    width: 100% !important;
    min-height: 52px !important;
    padding: 0 16px !important;
    border: 1px solid #dbe3ef !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    color: #0f172a !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    line-height: 52px !important;
    box-shadow: inset 0 1px 0 rgba(15, 23, 42, 0.03) !important;
}

body.reserva-page .tableReserva {
    width: min(560px, 100%) !important;
    margin: 0 auto !important;
    transform: none !important;
}

body.reserva-page .tableReserva table,
body.reserva-page .tableReserva thead,
body.reserva-page .tableReserva tbody {
    display: block !important;
    width: 100% !important;
}

body.reserva-page .tableReserva thead {
    display: none !important;
}

body.reserva-page .tableReserva tr {
    display: grid !important;
    grid-template-columns: minmax(118px, 1fr) minmax(124px, 0.9fr) minmax(128px, 1fr) !important;
    gap: 12px !important;
    align-items: center !important;
    margin-bottom: 12px !important;
    padding: 14px !important;
    border: 1px solid #e5edf7 !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06) !important;
}

body.reserva-page .tableReserva td {
    display: flex !important;
    align-items: center !important;
    padding: 0 !important;
    border: 0 !important;
    color: #172033 !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
}

body.reserva-page .tableReserva td:empty {
    display: none !important;
}

body.reserva-page .tableReserva td:first-child {
    min-height: 44px !important;
    padding-left: 12px !important;
    border-left: 4px solid #000000 !important;
    border-radius: 6px !important;
    color: #111827 !important;
    font-size: 18px !important;
    letter-spacing: 0 !important;
}

body.reserva-page .tableReserva .form-control,
body.reserva-page .tableReserva select {
    width: 100% !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 38px 0 14px !important;
    border: 1px solid #dbe3ef !important;
    border-radius: 12px !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    font-size: 14px !important;
    font-weight: 800 !important;
}

body.reserva-page .tableReserva .btn,
body.reserva-page .btnVerProducto {
    width: 100% !important;
    min-height: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: #16a34a !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    text-transform: none !important;
    box-shadow: 0 12px 24px rgba(22, 163, 74, 0.20) !important;
}

body.reserva-page .tableReserva .btn:hover,
body.reserva-page .btnVerProducto:hover {
    background: #15803d !important;
    transform: translateY(-1px) !important;
}

body.reserva-page .tableReserva .btn-danger {
    background: #e5e7eb !important;
    color: #6b7280 !important;
    box-shadow: none !important;
    cursor: not-allowed !important;
}

body.reserva-page #ui-datepicker-div {
    z-index: 10000 !important;
    width: min(360px, calc(100vw - 24px)) !important;
    padding: 12px !important;
    border: 0 !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.26) !important;
}

body.reserva-page .ui-datepicker .ui-datepicker-header {
    border: 0 !important;
    border-radius: 14px !important;
    background: #0f172a !important;
    color: #ffffff !important;
}

body.reserva-page .ui-datepicker .ui-datepicker-title {
    color: #ffffff !important;
    font-weight: 900 !important;
}

body.reserva-page .ui-datepicker th {
    color: #64748b !important;
    font-size: 11px !important;
    font-weight: 900 !important;
}

body.reserva-page .ui-datepicker td a,
body.reserva-page .ui-datepicker td span {
    min-height: 34px !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: #f8fafc !important;
    color: #172033 !important;
    text-align: center !important;
    font-weight: 800 !important;
}

body.reserva-page .ui-datepicker td a.ui-state-active,
body.reserva-page .ui-datepicker td a:hover {
    background: #000000 !important;
    color: #ffffff !important;
}

body.reserva-page .ui-datepicker .ui-datepicker-prev,
body.reserva-page .ui-datepicker .ui-datepicker-next {
    top: 7px !important;
    width: 32px !important;
    height: 32px !important;
    border-radius: 999px !important;
    cursor: pointer !important;
}

@media (max-width: 900px) {
    body.reserva-page > .col-md-12.title {
        width: calc(100% - 20px) !important;
        margin-top: 18px !important;
    }

    body.reserva-page .billing-info.mb-20 {
        padding: 14px !important;
        border-radius: 16px !important;
    }

    body.reserva-page #titleCalendarView {
        font-size: 22px !important;
    }

    body.reserva-page #calendar {
        width: calc(100% - 16px) !important;
        padding: 10px !important;
        border-radius: 18px !important;
    }

    body.reserva-page .fc-toolbar.fc-header-toolbar {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    body.reserva-page .fc-left,
    body.reserva-page .fc-center,
    body.reserva-page .fc-right {
        justify-content: center !important;
        flex-wrap: wrap !important;
        width: 100% !important;
    }

    body.reserva-page .fc-center {
        order: -1 !important;
    }

    body.reserva-page .fc-center h2 {
        font-size: 18px !important;
    }

    body.reserva-page .fc-button {
        min-height: 40px !important;
        padding: 0 12px !important;
        font-size: 12px !important;
        line-height: 40px !important;
    }

    body.reserva-page .fc-right .fc-button {
        flex: 1 1 auto !important;
    }

    body.reserva-page .fc-time-grid .fc-slats td {
        height: 44px !important;
    }

    body.reserva-page .fc-day-header {
        padding: 10px 4px !important;
        font-size: 11px !important;
    }

    body.reserva-page .fc-axis {
        width: 46px !important;
        font-size: 11px !important;
    }

    body.reserva-page #divNuevaReserva {
        width: calc(100% - 16px) !important;
        text-align: center !important;
    }

    body.reserva-page #divNuevaReserva .btn {
        width: calc(50% - 8px) !important;
        margin: 0 4px 8px !important;
    }
}

@media (max-width: 560px) {
    body.reserva-page #q_ubicacion {
        min-height: 50px !important;
        font-size: 15px !important;
    }

    body.reserva-page .fc-right {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.reserva-page .fc-right .fc-button {
        width: 100% !important;
        margin: 0 !important;
    }

    body.reserva-page .fc-view-container {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    body.reserva-page .fc-timeGridDay-view .fc-scroller,
    body.reserva-page .fc-timeGridWeek-view .fc-scroller {
        overflow: visible !important;
        height: auto !important;
    }

    body.reserva-page .fc-timeGridWeek-view .fc-view,
    body.reserva-page .fc-timeGridWeek-view table {
        min-width: 720px !important;
    }

    body.reserva-page .fc-title,
    body.reserva-page .fc-time {
        font-size: 11px !important;
    }

    body.reserva-page #modalReserva .modal-dialog,
    body.reserva-page #modalCancelarReserva .modal-dialog {
        width: calc(100% - 14px) !important;
        max-width: calc(100% - 14px) !important;
        margin: 8px auto !important;
    }

    body.reserva-page #modalReserva .modal-content,
    body.reserva-page #modalCancelarReserva .modal-content,
    body.reserva-page #modalBono .modal-content {
        border-radius: 18px !important;
    }

    body.reserva-page #modalReserva .modal-body {
        padding: 12px !important;
    }

    body.reserva-page .tableReserva tr {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        padding: 14px !important;
        margin-bottom: 12px !important;
        border-radius: 18px !important;
    }

    body.reserva-page .tableReserva td:first-child {
        font-size: 18px !important;
        min-height: 32px !important;
        padding-left: 10px !important;
    }

    body.reserva-page .tableReserva .btn,
    body.reserva-page .btnVerProducto {
        min-height: 48px !important;
        height: 48px !important;
        font-size: 14px !important;
    }

    body.reserva-page .tableReserva .form-control,
    body.reserva-page .tableReserva select {
        min-height: 44px !important;
        height: 44px !important;
    }

    body.reserva-page #divNuevaReserva .btn {
        width: 100% !important;
        margin: 0 0 8px !important;
    }
}

/* =====================================================
   CALENDARIO MODERNO SaaS · FULL REDISEÑO
   ===================================================== */

/* CONTENEDOR GENERAL */
#calendar {
    max-width: 1200px;
    margin: 0 auto !important;
    padding: 20px;
}

/* CABECERA SUPERIOR */
.fc-toolbar {
    display: flex !important;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;

    gap: 12px;
    margin-bottom: 20px;

    padding: 18px 22px;
    border-radius: 18px;
    background: #ffffff;
    border: 1px solid #e6ecf5;
    box-shadow: 0 10px 25px rgba(20, 33, 61, 0.06);
}

/* TITULO */
#titleCalendarView,
.fc-toolbar h2 {
    width: 100%;
    text-align: center;

    font-size: 20px !important;
    font-weight: 700;
    color: #14213d;
    margin: 0;
}

/* SUBTITULO (fecha) */
.fc-toolbar .fc-center {
    width: 100%;
    text-align: center;
    font-weight: 500;
    color: #6b7a99;
}

/* BOTONES GENERALES */
.fc button,
.fc-button {
    border-radius: 10px !important;
    border: 1px solid #dce3f0 !important;

    background: #ffffff !important;
    color: #243056 !important;

    height: 40px;
    padding: 0 14px;

    font-size: 13px;
    font-weight: 600;

    transition: all 0.2s ease;
}

/* HOVER BOTONES */
.fc button:hover {
    background: #f5f8ff !important;
    border-color: #cfd8ea !important;
}

/* BOTONES ACTIVOS (A S M) */
.fc-button-active,
.fc button.active {
    background: linear-gradient(135deg, #000000 0%, #2e2e2e 100%) !important;
    color: #fff !important;
    border: none !important;
}

/* GRID GENERAL */
.fc-time-grid,
.fc-view-container {
    background: #ffffff;
    border-radius: 20px;
    border: 1px solid #e6ecf5;
    overflow: hidden;

    box-shadow: 0 10px 30px rgba(20, 33, 61, 0.05);
}

/* CABECERA DIAS */
.fc th {
    background: #f8fafc !important;
    font-weight: 600;
    font-size: 13px;
    color: #334155;

    border: none !important;
    padding: 10px 0;
}

/* FILAS HORAS */
.fc td {
    border-color: #eef2f8 !important;
}

/* COLUMNA HORAS */
.fc-time {
    font-size: 12px;
    color: #94a3b8;
}

/* EVENTOS (RESERVAS) */
.fc-event {
    border-radius: 10px !important;
    border: none !important;

    padding: 6px 8px !important;

    font-size: 12px;
    font-weight: 500;

    box-shadow: 0 4px 10px rgba(0,0,0,0.08);
}

/* EVENTOS VERDES */
.fc-event[style*="rgb(144, 238, 144)"],
.fc-event.green {
    background: linear-gradient(135deg, #22c55e, #4ade80) !important;
    color: #fff !important;
}

/* EVENTOS AMARILLOS */
.fc-event[style*="rgb(255, 255, 153)"],
.fc-event.yellow {
    background: linear-gradient(135deg, #facc15, #fde047) !important;
    color: #1f2937 !important;
}

/* TEXTO EVENTO */
.fc-event .fc-title {
    font-weight: 600;
}

/* HOVER EVENTO */
.fc-event:hover {
    transform: scale(1.02);
    box-shadow: 0 6px 14px rgba(0,0,0,0.12);
}

/* SCROLL SUAVE */
.fc-scroller {
    overflow-y: auto !important;
}

/* CONTROLES IZQUIERDA (<< >> H) */
.fc-left {
    display: flex;
    gap: 8px;
}

/* CONTROLES DERECHA (A S M) */
.fc-right {
    display: flex;
    gap: 6px;
}

/* RESPONSIVE */
@media (max-width: 768px) {

    #calendar {
        padding: 10px;
    }

    .fc-toolbar {
        flex-direction: column;
        align-items: stretch;
    }

    .fc-left,
    .fc-right {
        justify-content: center;
    }

    .fc th {
        font-size: 11px;
    }

    .fc-event {
        font-size: 11px;
        padding: 4px;
    }
}

/* =====================================================
   CALENDARIO SaaS PRO · RESERVAS
   ===================================================== */

/* -------------------------
   CONTENEDOR GENERAL
-------------------------- */
#calendar {
    max-width: 1320px;
    margin: 0 auto !important;
    padding: 16px 18px 28px !important;
    box-sizing: border-box !important;
}

.fc,
.fc-view-container,
.fc-view,
.fc-view>table {
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
}

/* -------------------------
   CABECERA SUPERIOR PRO
-------------------------- */
.fc-toolbar.fc-header-toolbar {
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    align-items: center !important;
    gap: 16px !important;

    margin: 0 0 18px 0 !important;
    padding: 18px 20px !important;

    background: rgba(255,255,255,0.96) !important;
    border: 1px solid #e7edf7 !important;
    border-radius: 22px !important;
    box-shadow: 0 14px 34px rgba(20, 33, 61, 0.07) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* grupos */
.fc-left,
.fc-center,
.fc-right {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    float: none !important;
    margin: 0 !important;
}

.fc-center {
    justify-content: center !important;
    flex-wrap: wrap;
}

/* título principal */
#titleCalendarView,
.fc-toolbar h2 {
    margin: 0 !important;
    color: #14213d !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    letter-spacing: -0.02em;
    text-align: center !important;
}

/* subtítulo de rango */
.fc-center {
    color: #64748b !important;
    font-size: 13px !important;
    font-weight: 600 !important;
}

/* -------------------------
   BOTONES PRO
-------------------------- */
.fc button,
.fc-button,
.fc-state-default {
    appearance: none !important;
    border: 1px solid #d8e1ef !important;
    background: #ffffff !important;
    color: #243056 !important;

    height: 42px !important;
    min-width: 42px !important;
    padding: 0 14px !important;
    margin: 0 !important;

    border-radius: 12px !important;
    box-shadow: 0 4px 10px rgba(20, 33, 61, 0.04) !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-transform: none !important;

    transition: all 0.18s ease !important;
}

.fc button:hover,
.fc-button:hover {
    background: #f8fbff !important;
    border-color: #c7d4ea !important;
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(20, 33, 61, 0.08) !important;
}

.fc button:focus,
.fc-button:focus {
    outline: none !important;
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.10) !important;
}

/* activo */
.fc-button-active,
.fc button.active,
.fc-state-active {
    background: linear-gradient(135deg, #000000 0%, #2e2e2e 100%) !important;
    color: #ffffff !important;
    border-color: transparent !important;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.20) !important;
}

/* prev / next */
.fc-prev-button,
.fc-next-button {
    padding-left: 12px !important;
    padding-right: 12px !important;
}

/* hoy */
.fc-today-button {
    font-weight: 800 !important;
}

/* -------------------------
   CAJA DEL CALENDARIO
-------------------------- */
.fc-view-container {
    background: #ffffff !important;
    border: 1px solid #e7edf7 !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    box-shadow: 0 16px 38px rgba(20, 33, 61, 0.06) !important;
}

/* tabla general */
.fc table {
    border-collapse: separate !important;
    border-spacing: 0 !important;
}

.fc-view.fc-timeGridWeek-view,
.fc-view.fc-timeGrid-view,
.fc-view.fc-basicWeek-view {
    background: #ffffff !important;
}

/* -------------------------
   CABECERA DE DÍAS
-------------------------- */
.fc-head-container,
.fc-head,
.fc-head table {
    background: #f8fafc !important;
}

.fc th {
    padding: 12px 8px !important;
    background: #f8fafc !important;
    color: #334155 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    border-color: #e9eff7 !important;
}

/* hoy en cabecera */
.fc-day-header.fc-today {
    background: linear-gradient(180deg, #eef4ff 0%, #f8fbff 100%) !important;
    color: #243056 !important;
}

/* -------------------------
   COLUMNAS / CELDAS
-------------------------- */
.fc-time-grid-container,
.fc-scroller,
.fc-time-grid {
    background: #ffffff !important;
}

.fc td,
.fc th {
    border-color: #edf2f8 !important;
}

.fc-axis {
    width: 56px !important;
    color: #7b879f !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    background: #fbfcfe !important;
}

.fc-time {
    color: #8a95ab !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

.fc-slats td {
    height: 36px !important;
    border-color: #f1f5fa !important;
}

.fc-minor td {
    border-style: dotted !important;
}

/* hoy columna */
.fc-day.fc-today {
    background: rgba(0, 0, 0, 0.035) !important;
}

/* línea actual si existe */
.fc-now-indicator {
    border-color: #ef4444 !important;
}

/* -------------------------
   EVENTOS PRO
-------------------------- */
.fc-event,
.fc-time-grid-event,
.fc-v-event {
    border: none !important;
    border-radius: 12px !important;
    padding: 6px 8px !important;
    box-shadow: 0 8px 18px rgba(20, 33, 61, 0.10) !important;
    overflow: hidden !important;
    transition: transform 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease !important;
}

/* hover */
.fc-event:hover,
.fc-time-grid-event:hover,
.fc-v-event:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(20, 33, 61, 0.16) !important;
    filter: brightness(1.01);
}

/* reserva verde */
.fc-event[style*="rgb(144, 238, 144)"],
.fc-event[style*="lightgreen"],
.fc-event[style*="#90ee90"] {
    background: linear-gradient(135deg, #22c55e 0%, #4ade80 100%) !important;
    color: #ffffff !important;
}

/* curso / amarillo */
.fc-event[style*="rgb(255, 255, 153)"],
.fc-event[style*="#ffff99"],
.fc-event[style*="khaki"] {
    background: linear-gradient(135deg, #fde68a 0%, #facc15 100%) !important;
    color: #1f2937 !important;
}

/* azul si apareciera */
.fc-event[style*="rgb(147, 197, 253)"],
.fc-event[style*="#93c5fd"] {
    background: linear-gradient(135deg, #60a5fa 0%, #38bdf8 100%) !important;
    color: #ffffff !important;
}

.fc-event .fc-time {
    display: block !important;
    margin-bottom: 3px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    opacity: 0.95;
}

.fc-event .fc-title {
    display: block !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    white-space: normal !important;
}

/* -------------------------
   SCROLL MÁS LIMPIO
-------------------------- */
.fc-scroller {
    overflow: auto !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.25) transparent;
}

.fc-scroller::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.fc-scroller::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.22);
    border-radius: 999px;
}

.fc-scroller::-webkit-scrollbar-track {
    background: transparent;
}

/* -------------------------
   TÍTULOS EXTERNOS
-------------------------- */
#titleCalendarView {
    display: block !important;
    margin-bottom: 6px !important;
}

#titleCalendarView + * {
    text-align: center !important;
}

/* texto Paddle / ubicación */
body #titleCalendarView,
body h2#titleCalendarView {
    text-align: center !important;
}

body .title,
body .col-md-12.title {
    text-align: center !important;
}

/* -------------------------
   RESPONSIVE TABLET
-------------------------- */
@media (max-width: 991px) {
    #calendar {
        padding: 10px 10px 22px !important;
    }

    .fc-toolbar.fc-header-toolbar {
        grid-template-columns: 1fr !important;
        justify-items: center;
        padding: 16px !important;
        gap: 12px !important;
        border-radius: 18px !important;
    }

    .fc-left,
    .fc-center,
    .fc-right {
        justify-content: center !important;
        flex-wrap: wrap;
        width: 100%;
    }

    .fc-toolbar h2,
    #titleCalendarView {
        font-size: 17px !important;
    }

    .fc th {
        font-size: 12px !important;
        padding: 10px 4px !important;
    }

    .fc-axis {
        width: 48px !important;
        font-size: 11px !important;
    }

    .fc-event .fc-title {
        font-size: 11px !important;
    }
}

/* -------------------------
   RESPONSIVE MÓVIL PRO
-------------------------- */
@media (max-width: 600px) {
    #calendar {
        padding: 8px 0 18px !important;
    }

    .fc-toolbar.fc-header-toolbar {
        position: sticky;
        top: 76px;
        z-index: 20;
        margin: 0 10px 14px 10px !important;
        padding: 14px !important;
        border-radius: 16px !important;
        gap: 10px !important;
    }

    .fc-toolbar h2,
    #titleCalendarView {
        font-size: 16px !important;
        line-height: 1.2 !important;
    }

    .fc button,
    .fc-button,
    .fc-state-default {
        height: 38px !important;
        min-width: 38px !important;
        padding: 0 12px !important;
        border-radius: 10px !important;
        font-size: 12px !important;
    }

    .fc th {
        font-size: 11px !important;
        padding: 8px 2px !important;
    }

    .fc-axis {
        width: 40px !important;
        font-size: 10px !important;
    }

    .fc-slats td {
        height: 34px !important;
    }

    .fc-event,
    .fc-time-grid-event,
    .fc-v-event {
        border-radius: 10px !important;
        padding: 4px 5px !important;
    }

    .fc-event .fc-time {
        font-size: 10px !important;
        margin-bottom: 2px !important;
    }

    .fc-event .fc-title {
        font-size: 10px !important;
        line-height: 1.15 !important;
    }

    .fc-view-container {
        border-radius: 18px !important;
    }
}

/* -------------------------
   EXTRA: EFECTO MÁS SAAS
-------------------------- */
.fc-view-container::before {
    content: "";
    display: block;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(0, 0, 0, 0.18), transparent);
}

/* =========================================
   LOGIN AISLADO (NO AFECTA AL RESTO)
========================================= */

.login-page .billing-info-wrap {
    padding: 28px;
    border-radius: 20px;
    border: 1px solid #e6ebf5;
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(20, 33, 61, 0.08);
}

/* título */
.login-page .billing-info-wrap h3 {
    font-size: 28px;
    font-weight: 800;
    color: #14213d;
    margin-bottom: 20px;
}

/* inputs */
.login-page .billing-info input {
    height: 50px;
    border-radius: 12px;
    border: 1px solid #dbe3f0;
    background: #f8fbff;
    padding: 0 14px;
}

/* botón ACCEDER */
.login-page #btnLogin {
    background: linear-gradient(135deg, #000000 0%, #000000 52%, #2e2e2e 100%);
    border-radius: 14px;
    height: 50px;
    font-weight: 700;
    color: #fff;
    border: none;
}

/* botón CREAR CUENTA */
.login-page a.btnstyle2[href*="registrar"] {
    background: rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.18);
    color: #000000;
    border-radius: 14px;
    height: 50px;
}

/* botón RECUPERAR */
.login-page a.btnstyle2[href*="recuperar"] {
    background: #fff;
    border: 1px solid #e5e7eb;
    color: #64748b;
    border-radius: 14px;
    height: 50px;
}

/* recordar usuario */
.login-page .text-left.mt-3.mb-3 {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* =====================================================
   LOGIN MODERNO SaaS · AISLADO EN .login-page
   ===================================================== */

.login-page {
    display: flex;
    justify-content: center;
}

/* contenedor */
.login-page .billing-info-wrap {
    width: 100%;
    max-width: 520px;
    padding: 32px;
    border-radius: 24px;
    border: 1px solid #e6ebf5;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcff 100%);
    box-shadow: 0 20px 45px rgba(18, 31, 70, 0.08);
    position: relative;
    overflow: hidden;
}

/* línea superior pro */
.login-page .billing-info-wrap::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, #000000, #000000, #2e2e2e);
}

/* título */
.login-page .billing-info-wrap h3 {
    font-family: "Inter", sans-serif;
    font-size: 30px;
    font-weight: 800;
    color: #14213d;
    margin-bottom: 26px;
    letter-spacing: -0.02em;
}

/* layout limpio */
.login-page .billing-info-wrap .row {
    display: block;
}

/* labels */
.login-page .billing-info label {
    display: block;
    font-size: 13px;
    font-weight: 700;
    color: #243056;
    margin-bottom: 6px;
}

/* inputs */
.login-page .billing-info input {
    width: 100%;
    height: 52px;
    border-radius: 14px;
    border: 1px solid #dbe3f0;
    background: #f8fbff;
    padding: 0 16px;
    font-size: 15px;
    font-weight: 600;
    color: #14213d;
    transition: all 0.2s ease;
}

.login-page .billing-info input:focus {
    background: #fff;
    border-color: #2e2e2e;
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.08);
    outline: none;
}

/* recordar usuario */
.login-page .text-left.mt-3.mb-3 {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 10px 0 20px;
}

/* switch moderno */
.login-page label.css-switch-remember input {
    appearance: none;
    width: 44px;
    height: 24px;
    background: #d8dfeb;
    border-radius: 999px;
    position: relative;
    cursor: pointer;
    transition: 0.2s;
}

.login-page label.css-switch-remember input::before {
    content: "";
    position: absolute;
    width: 18px;
    height: 18px;
    background: white;
    border-radius: 50%;
    top: 3px;
    left: 3px;
    transition: 0.2s;
}

.login-page label.css-switch-remember input:checked {
    background: linear-gradient(135deg, #000000 0%, #2e2e2e 100%);
}

.login-page label.css-switch-remember input:checked::before {
    transform: translateX(20px);
}

/* botones base */
.login-page #btnLogin,
.login-page .btnstyle2 {
    width: 100%;
    height: 52px;
    border-radius: 14px;
    font-size: 16px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    margin-bottom: 12px;
}

/* botón ACCEDER */
.login-page #btnLogin {
    background: linear-gradient(135deg, #000000 0%, #000000 52%, #2e2e2e 100%);
    color: #fff;
    border: none;
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.25);
}

.login-page #btnLogin:hover {
    transform: translateY(-1px);
    box-shadow: 0 18px 30px rgba(0, 0, 0, 0.30);
}

/* botón crear cuenta */
.login-page a.btnstyle2[href*="registrar"] {
    background: rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.18);
    color: #000000;
}

.login-page a.btnstyle2[href*="registrar"]:hover {
    background: rgba(0, 0, 0, 0.14);
}

/* botón recuperar */
.login-page a.btnstyle2[href*="recuperar"] {
    background: #fff;
    border: 1px solid #e5e7eb;
    color: #64748b;
}

.login-page a.btnstyle2[href*="recuperar"]:hover {
    background: #f9fafb;
}

/* error */
.login-page #msgErrorLogin {
    color: #e11d48;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 12px;
}

/* =====================================================
   LOGIN · VISTA ESCRITORIO REAL
   SOLO DENTRO DE .login-page
   ===================================================== */

.login-page {
    width: 100%;
    min-height: calc(100vh - 180px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px 60px;
    box-sizing: border-box;
}

/* Panel exterior escritorio */
.login-page .billing-info-wrap {
    width: 100%;
    max-width: 980px !important;
    min-height: 560px;
    margin: 0 auto;
    padding: 36px !important;
    display: grid;
    grid-template-columns: 1.05fr 0.95fr;
    gap: 36px;
    align-items: center;
}

/* Columna izquierda decorativa / branding */
.login-page .billing-info-wrap::after {
    content: "Accede a tu área privada";
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    border-radius: 22px;
    background:
        radial-gradient(circle at top right, rgba(46, 46, 46, 0.22), transparent 35%),
        radial-gradient(circle at bottom left, rgba(0, 0, 0, 0.20), transparent 35%),
        linear-gradient(135deg, rgba(46, 46, 46, 0.20) 0%, rgba(0, 0, 0, 0.12) 100%);
    border: 1px solid #e4ebf8;
    color: #243056;
    font-family: "Inter", sans-serif;
    font-size: 34px;
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -0.03em;
    text-align: left;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.7);
}

/* El contenido real del formulario */
.login-page .billing-info-wrap > * {
    position: relative;
    z-index: 2;
}

/* Forzamos que el contenido principal quede a la derecha */
.login-page .billing-info-wrap > .row,
.login-page .billing-info-wrap > div,
.login-page .billing-info-wrap > form {
    grid-column: 2;
}

/* Ajuste del título */
.login-page .billing-info-wrap h3 {
    font-size: 42px !important;
    margin-bottom: 28px !important;
    max-width: 360px;
}

/* Inputs más amplios en escritorio */
.login-page .billing-info input {
    min-height: 56px !important;
    font-size: 16px !important;
    border-radius: 16px !important;
}

/* Botones más premium en escritorio */
.login-page #btnLogin,
.login-page .btnstyle2 {
    min-height: 56px !important;
    font-size: 18px !important;
    border-radius: 16px !important;
}

/* Recordar usuario con más aire */
.login-page .text-left.mt-3.mb-3 {
    margin: 14px 0 22px !important;
}

/* Si la pantalla es más grande todavía */
@media (min-width: 1400px) {
    .login-page .billing-info-wrap {
        max-width: 1080px !important;
        gap: 46px;
    }

    .login-page .billing-info-wrap::after {
        font-size: 40px;
        padding: 48px;
    }
}

/* Tablet */
@media (max-width: 991px) {
    .login-page {
        min-height: auto;
        padding: 24px 16px 40px;
    }

    .login-page .billing-info-wrap {
        max-width: 760px !important;
        min-height: auto;
        display: block;
        padding: 26px !important;
    }

    .login-page .billing-info-wrap::after {
        display: none;
    }

    .login-page .billing-info-wrap > .row,
    .login-page .billing-info-wrap > div,
    .login-page .billing-info-wrap > form {
        grid-column: auto;
    }

    .login-page .billing-info-wrap h3 {
        font-size: 30px !important;
        max-width: none;
    }
}

/* Móvil */
@media (max-width: 600px) {
    .login-page {
        padding: 18px 12px 28px;
    }

    .login-page .billing-info-wrap {
        max-width: 100% !important;
        padding: 22px 18px !important;
        min-height: auto;
    }

    .login-page .billing-info-wrap h3 {
        font-size: 26px !important;
        margin-bottom: 22px !important;
    }

    .login-page .billing-info input {
        min-height: 48px !important;
        font-size: 14px !important;
    }

    .login-page #btnLogin,
    .login-page .btnstyle2 {
        min-height: 48px !important;
        font-size: 16px !important;
    }
}

/* =====================================================
   LOGIN · FIX DESKTOP LIMPIO
   SOLO DENTRO DE .login-page
   ===================================================== */

.login-page {
    width: 100%;
    min-height: calc(100vh - 180px);
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 36px 20px 56px;
    box-sizing: border-box;
}

/* tarjeta principal */
.login-page .billing-info-wrap {
    width: 100%;
    max-width: 760px !important;
    min-height: auto !important;
    margin: 0 auto !important;
    padding: 36px !important;

    display: block !important;
    border-radius: 28px !important;
    border: 1px solid #e7edf7 !important;
    background: linear-gradient(180deg, #ffffff 0%, #fbfcff 100%) !important;
    box-shadow: 0 20px 45px rgba(18, 31, 70, 0.08) !important;
    position: relative;
    overflow: hidden;
}

/* eliminamos el bloque raro decorativo */
.login-page .billing-info-wrap::after {
    display: none !important;
    content: none !important;
}

/* contenido interno normal */
.login-page .billing-info-wrap > .row {
    display: block !important;
    margin: 0 !important;
}

.login-page .billing-info-wrap > .row > .col-lg-6,
.login-page .billing-info-wrap > .row > .col-md-6,
.login-page .billing-info-wrap > .row > .col-lg-12,
.login-page .billing-info-wrap > .row > .col-md-12 {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* título */
.login-page .billing-info-wrap h3 {
    max-width: 520px;
    margin: 0 0 28px 0 !important;
    font-size: 42px !important;
    line-height: 1.02 !important;
    letter-spacing: -0.04em;
    color: #14213d !important;
    font-family: "Inter", sans-serif !important;
    font-weight: 800 !important;
    text-align: left !important;
}

/* formulario con ancho agradable en desktop */
.login-page .billing-info-wrap .billing-info,
.login-page .billing-info-wrap .text-left.mt-3.mb-3,
.login-page .billing-info-wrap .pro-details-cart,
.login-page .billing-info-wrap .btnstyle2,
.login-page .billing-info-wrap #msgErrorLogin,
.login-page .billing-info-wrap hr {
    max-width: 460px;
}

/* inputs */
.login-page .billing-info input,
.login-page .billing-info input[type="text"],
.login-page .billing-info input[type="email"],
.login-page .billing-info input[type="password"] {
    width: 100% !important;
    min-height: 56px !important;
    font-size: 16px !important;
    border-radius: 16px !important;
}

/* recordar usuario */
.login-page .text-left.mt-3.mb-3 {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 14px 0 22px !important;
}

/* botones */
.login-page #btnLogin,
.login-page .btnstyle2,
.login-page a.btnstyle2 {
    width: 100% !important;
    max-width: 460px !important;
    min-height: 56px !important;
    border-radius: 16px !important;
    font-size: 18px !important;
}

/* línea inferior */
.login-page .billing-info-wrap hr {
    margin-top: 16px !important;
}

/* desktop grande: un poco más de aire */
@media (min-width: 1200px) {
    .login-page .billing-info-wrap {
        max-width: 820px !important;
        padding: 42px !important;
    }

    .login-page .billing-info-wrap h3 {
        font-size: 48px !important;
    }
}

/* tablet */
@media (max-width: 991px) {
    .login-page {
        min-height: auto;
        padding: 24px 16px 40px;
    }

    .login-page .billing-info-wrap {
        max-width: 760px !important;
        padding: 26px !important;
    }

    .login-page .billing-info-wrap h3 {
        max-width: none;
        font-size: 30px !important;
        margin-bottom: 22px !important;
    }

    .login-page .billing-info-wrap .billing-info,
    .login-page .billing-info-wrap .text-left.mt-3.mb-3,
    .login-page .billing-info-wrap .pro-details-cart,
    .login-page .billing-info-wrap .btnstyle2,
    .login-page .billing-info-wrap #msgErrorLogin,
    .login-page .billing-info-wrap hr,
    .login-page #btnLogin,
    .login-page .btnstyle2,
    .login-page a.btnstyle2 {
        max-width: 100%;
    }
}

/* móvil */
@media (max-width: 600px) {
    .login-page {
        padding: 18px 12px 28px;
    }

    .login-page .billing-info-wrap {
        max-width: 100% !important;
        padding: 22px 18px !important;
        border-radius: 22px !important;
    }

    .login-page .billing-info-wrap h3 {
        font-size: 26px !important;
        line-height: 1.05 !important;
    }

    .login-page .billing-info input,
    .login-page .billing-info input[type="text"],
    .login-page .billing-info input[type="email"],
    .login-page .billing-info input[type="password"] {
        min-height: 48px !important;
        font-size: 14px !important;
    }

    .login-page #btnLogin,
    .login-page .btnstyle2,
    .login-page a.btnstyle2 {
        min-height: 48px !important;
        font-size: 16px !important;
    }
}

div.printArea img.default-img {
    width: 500x !important;
    height: auto !important;
}

/* =========================================================
   MODAL RESERVA · REDISEÑO MODERNO
   ========================================================= */

/* Fondo del modal */
#modalReserva {
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

#modalReserva.modal {
    background: rgba(15, 23, 42, 0.28);
}

/* Caja principal */
#modalReserva .modal-dialog {
    width: 100% !important;
    max-width: 760px !important;
    margin: 24px auto !important;
}

#modalReserva .modal-content {
    border: 1px solid #e7edf7 !important;
    border-radius: 24px !important;
    overflow: hidden;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
    box-shadow: 0 24px 60px rgba(20, 33, 61, 0.18) !important;
}

/* Cabecera */
#modalReserva .modal-header {
    border-bottom: 1px solid #edf2f8 !important;
    padding: 18px 22px !important;
    background: #ffffff !important;
}

#modalReserva .modal-header .close,
#modalReserva .modal-header button.close {
    opacity: 1 !important;
    color: #1f2a56 !important;
    font-size: 28px !important;
    font-weight: 700 !important;
    text-shadow: none !important;
    background: #f5f8ff !important;
    border: 1px solid #dfe7f5 !important;
    border-radius: 12px !important;
    width: 42px;
    height: 42px;
    line-height: 36px !important;
    padding: 0 !important;
    transition: all 0.18s ease;
}

#modalReserva .modal-header .close:hover,
#modalReserva .modal-header button.close:hover {
    background: #eef4ff !important;
    transform: scale(1.03);
}

/* Cuerpo */
#modalReserva .modal-body {
    padding: 18px !important;
    background: #f6f9fc !important;
}

/* Título superior */
#modalReserva .title,
#modalReserva .col-md-12.title {
    text-align: center !important;
    margin-bottom: 16px !important;
}

#modalReserva .title h2,
#modalReserva .title h3,
#modalReserva .title h4,
#modalReserva .col-md-12.title h2,
#modalReserva .col-md-12.title h3,
#modalReserva .col-md-12.title h4 {
    margin: 0 !important;
    color: #16213e !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 28px !important;
    font-weight: 800 !important;
    line-height: 1.08 !important;
    letter-spacing: -0.03em;
}

/* Fecha seleccionada */
#modalReserva .title .fechaReserva,
#modalReserva .title .fecha,
#modalReserva .title p,
#modalReserva .col-md-12.title p {
    margin-top: 8px !important;
    color: #64748b !important;
    font-size: 15px !important;
    font-weight: 600 !important;
}

/* Tabla contenedora */
#modalReserva .tableReserva {
    width: 100% !important;
    margin: 0 !important;
}

#modalReserva .tableReserva .table {
    width: 100% !important;
    margin: 0 !important;
    border-collapse: separate !important;
    border-spacing: 0 14px !important;
    background: transparent !important;
}

/* Ocultamos cabeceras si estorban */
#modalReserva .tableReserva .table thead {
    display: none !important;
}

/* Cada fila como card */
#modalReserva .tableReserva .table tbody tr {
    display: grid !important;
    grid-template-columns: 1fr 180px 160px !important;
    align-items: center !important;
    gap: 14px !important;

    margin: 0 !important;
    background: #ffffff !important;
    border: 1px solid #e7edf7 !important;
    border-radius: 22px !important;
    box-shadow: 0 10px 24px rgba(20, 33, 61, 0.06) !important;
    overflow: hidden;
}

/* Celdas */
#modalReserva .tableReserva .table tbody tr td {
    display: block !important;
    border: none !important;
    background: transparent !important;
    padding: 16px 18px !important;
    color: #172033 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    vertical-align: middle !important;
}

/* Primera celda = hora */
#modalReserva .tableReserva .table tbody tr td:first-child {
    position: relative;
    padding-left: 20px !important;
    color: #16213e !important;
    font-size: 17px !important;
    font-weight: 800 !important;
}

#modalReserva .tableReserva .table tbody tr td:first-child::before {
    content: "";
    position: absolute;
    left: 10px;
    top: 16px;
    bottom: 16px;
    width: 4px;
    border-radius: 999px;
    background: linear-gradient(180deg, #4f46e5 0%, #06b6d4 100%);
}

/* Select */
#modalReserva .tableReserva select,
#modalReserva .tableReserva .form-control,
#modalReserva .tableReserva .custom-select {
    width: 100% !important;
    min-height: 46px !important;
    padding: 0 14px !important;
    border: 1px solid #dbe3f0 !important;
    border-radius: 14px !important;
    background: #f8fbff !important;
    color: #1f2a56 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    box-shadow: none !important;
    outline: none !important;
    transition: all 0.18s ease;
}

#modalReserva .tableReserva select:focus,
#modalReserva .tableReserva .form-control:focus,
#modalReserva .tableReserva .custom-select:focus {
    background: #ffffff !important;
    border-color: #9aa9ff !important;
    box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.08) !important;
}

/* Botón Reservar */
#modalReserva .tableReserva .btn,
#modalReserva .tableReserva .btn-success,
#modalReserva .tableReserva .btn-danger,
#modalReserva .tableReserva button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 48px !important;
    padding: 12px 18px !important;
    border: none !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, #16a34a 0%, #22c55e 100%) !important;
    color: #ffffff !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    text-align: center !important;
    box-shadow: 0 12px 24px rgba(34, 197, 94, 0.20) !important;
    transition: all 0.18s ease !important;
}

#modalReserva .tableReserva .btn:hover,
#modalReserva .tableReserva .btn-success:hover,
#modalReserva .tableReserva .btn-danger:hover,
#modalReserva .tableReserva button:hover {
    transform: translateY(-1px);
    filter: brightness(1.02);
    box-shadow: 0 16px 28px rgba(34, 197, 94, 0.26) !important;
}

/* Texto auxiliar / vacíos */
#modalReserva .tableReserva .table tbody tr td:empty {
    display: none !important;
}

/* Scroll más fino si hay muchas horas */
#modalReserva .modal-body {
    max-height: 80vh;
    overflow-y: auto !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(99,102,241,0.22) transparent;
}

#modalReserva .modal-body::-webkit-scrollbar {
    width: 8px;
}

#modalReserva .modal-body::-webkit-scrollbar-thumb {
    background: rgba(99,102,241,0.22);
    border-radius: 999px;
}

/* =========================
   RESPONSIVE
========================= */
@media (max-width: 767px) {
    #modalReserva .modal-dialog {
        max-width: calc(100% - 18px) !important;
        margin: 10px auto !important;
    }

    #modalReserva .modal-content {
        border-radius: 20px !important;
    }

    #modalReserva .modal-body {
        padding: 12px !important;
    }

    #modalReserva .title h2,
    #modalReserva .title h3,
    #modalReserva .title h4,
    #modalReserva .col-md-12.title h2,
    #modalReserva .col-md-12.title h3,
    #modalReserva .col-md-12.title h4 {
        font-size: 24px !important;
    }

    #modalReserva .tableReserva .table {
        border-spacing: 0 12px !important;
    }

    #modalReserva .tableReserva .table tbody tr {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        padding: 0 !important;
    }

    #modalReserva .tableReserva .table tbody tr td {
        padding: 0 14px 0 14px !important;
    }

    #modalReserva .tableReserva .table tbody tr td:first-child {
        padding: 16px 14px 0 18px !important;
        font-size: 18px !important;
    }

    #modalReserva .tableReserva .table tbody tr td:first-child::before {
        top: 16px;
        bottom: 0;
    }

    #modalReserva .tableReserva .table tbody tr td:nth-child(2),
    #modalReserva .tableReserva .table tbody tr td:nth-child(3) {
        padding-bottom: 14px !important;
    }

    #modalReserva .tableReserva .btn,
    #modalReserva .tableReserva .btn-success,
    #modalReserva .tableReserva .btn-danger,
    #modalReserva .tableReserva button {
        min-height: 46px !important;
        font-size: 15px !important;
        border-radius: 13px !important;
    }
}

.event-field-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    margin-bottom: 14px !important;
}

.event-field-row label {
    margin: 0 !important;
    line-height: 1.25 !important;
}

.event-field-row .form-control {
    min-width: 0;
    width: 100% !important;
}

@media only screen and (max-width: 420px) {
    .event-field-row {
        grid-template-columns: minmax(0, 46%) minmax(0, 54%);
        gap: 8px;
    }
}

/* Contenedor del campo */
#products .billing-info {
    display: grid;
    grid-template-columns: 1fr 2fr;
    align-items: center;
    gap: 10px;
}

/* Label */
#products .billing-info label {
    margin-bottom: 0;
    font-weight: 500;
}

/* Input */
#products .billing-info .form-control {
    width: 100%;
}

#products .billing-info {
    margin-bottom: 1px !important;
}

/* =========================================================
   MODAL BONO / PRODUCTO · REDISEÑO MODERNO
   ========================================================= */

/* Overlay del modal */
#modalBono.modal {
    background: rgba(15, 23, 42, 0.42);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

/* Diálogo */
#modalBono .modal-dialog {
    width: calc(100% - 24px) !important;
    max-width: 980px !important;
    margin: 24px auto !important;
    padding: 0 !important;
}

/* Contenido */
#modalBono .modal-content {
    border: 1px solid #e7edf7 !important;
    border-radius: 26px !important;
    overflow: hidden !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
    box-shadow: 0 24px 60px rgba(20, 33, 61, 0.18) !important;
}

/* Cabecera */
#modalBono .modal-header {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    min-height: 64px;
    padding: 14px 18px !important;
    border-bottom: 1px solid #edf2f8 !important;
    background: rgba(255,255,255,0.88) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* Botón cerrar */
#modalBono .modal-header .close,
#modalBono .modal-header button.close {
    opacity: 1 !important;
    color: #1f2a56 !important;
    font-size: 30px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-shadow: none !important;
    background: #f5f8ff !important;
    border: 1px solid #dfe7f5 !important;
    border-radius: 12px !important;
    width: 42px;
    height: 42px;
    padding: 0 !important;
    margin: 0 !important;
    transition: all 0.18s ease;
}

#modalBono .modal-header .close:hover,
#modalBono .modal-header button.close:hover {
    background: #eef4ff !important;
    transform: scale(1.04);
}

/* Body */
#modalBono .modal-body {
    padding: 24px !important;
    background: transparent !important;
}

/* Fila principal */
#modalBono .modal-body > .row {
    display: grid !important;
    grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
    gap: 26px !important;
    align-items: start !important;
    margin: 0 !important;
}

/* Columnas bootstrap */
#modalBono .modal-body > .row > [class*="col-"] {
    width: auto !important;
    max-width: none !important;
    flex: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* =========================
   COLUMNA IMAGEN
========================= */
#modalBono .quickview-big-img,
#modalBono .tab-content.quickview-big-img {
    position: relative;
    padding: 18px !important;
    border: 1px solid #e7edf7 !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.8);
}

#modalBono #pro-1,
#modalBono .tab-pane {
    margin: 0 !important;
}

#modalBono #imgModal,
#modalBono .quickview-big-img img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    display: block;
    border-radius: 18px !important;
    object-fit: cover;
    box-shadow: 0 12px 30px rgba(20, 33, 61, 0.12);
}

/* =========================
   COLUMNA INFO
========================= */
#modalBono .product-details-content,
#modalBono .quickview-content {
    padding: 6px 2px 2px 2px !important;
}

/* Nombre producto */
#modalBono #modalNombre,
#modalBono .product-details-content h2 {
    margin: 0 0 12px 0 !important;
    color: #14213d !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 34px !important;
    font-weight: 800 !important;
    line-height: 1.05 !important;
    letter-spacing: -0.03em;
}

/* Precio */
#modalBono .product-details-price {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    margin: 0 0 16px 0 !important;
    padding: 10px 16px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #eef2ff 0%, #f0f9ff 100%) !important;
    border: 1px solid #dbe5ff !important;
    box-shadow: 0 8px 20px rgba(79, 70, 229, 0.08);
}

#modalBono #modalPrice,
#modalBono .product-details-price span {
    color: #3144b5 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 28px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

/* Descripción */
#modalBono #modalDescription,
#modalBono .product-details-content p {
    margin: 0 0 16px 0 !important;
    color: #5a6785 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    line-height: 1.6 !important;
}

/* Caja de características */
#modalBono .pro-details-list {
    margin-top: 6px !important;
    padding: 18px 18px 16px 18px !important;
    border: 1px solid #e7edf7 !important;
    border-radius: 20px !important;
    background: rgba(255,255,255,0.78) !important;
    box-shadow: 0 10px 24px rgba(20, 33, 61, 0.05) !important;
}

/* Lista */
#modalBono #modalCaracteristicas,
#modalBono .pro-details-list ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

#modalBono #modalCaracteristicas li,
#modalBono .pro-details-list li {
    position: relative;
    margin: 0 0 10px 0 !important;
    padding: 0 0 0 18px !important;
    color: #334155 !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
}

#modalBono #modalCaracteristicas li:last-child,
#modalBono .pro-details-list li:last-child {
    margin-bottom: 0 !important;
}

#modalBono #modalCaracteristicas li::before,
#modalBono .pro-details-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.55em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: linear-gradient(135deg, #4f46e5 0%, #06b6d4 100%);
    transform: translateY(-50%);
}

/* Bloque extra si existe */
#modalBono .pro-details-quality {
    margin-top: 16px !important;
}

/* =========================
   BOTONES / CTA SI APARECEN
========================= */
#modalBono .btn,
#modalBono button,
#modalBono a.btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 48px !important;
    padding: 12px 18px !important;
    border-radius: 14px !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1.1 !important;
    text-decoration: none !important;
    transition: all 0.18s ease !important;
}

/* =========================
   RESPONSIVE
========================= */
@media (max-width: 991px) {
    #modalBono .modal-dialog {
        max-width: calc(100% - 18px) !important;
        margin: 12px auto !important;
    }

    #modalBono .modal-body {
        padding: 18px !important;
    }

    #modalBono .modal-body > .row {
        grid-template-columns: 1fr !important;
        gap: 18px !important;
    }

    #modalBono #modalNombre,
    #modalBono .product-details-content h2 {
        font-size: 28px !important;
    }

    #modalBono #modalPrice,
    #modalBono .product-details-price span {
        font-size: 24px !important;
    }
}

@media (max-width: 600px) {
    #modalBono .modal-dialog {
        width: calc(100% - 12px) !important;
        margin: 10px auto !important;
    }

    #modalBono .modal-content {
        border-radius: 20px !important;
    }

    #modalBono .modal-header {
        min-height: 56px;
        padding: 10px 12px !important;
    }

    #modalBono .modal-body {
        padding: 14px !important;
    }

    #modalBono .quickview-big-img,
    #modalBono .tab-content.quickview-big-img,
    #modalBono .pro-details-list {
        border-radius: 16px !important;
    }

    #modalBono #modalNombre,
    #modalBono .product-details-content h2 {
        font-size: 24px !important;
        line-height: 1.08 !important;
    }

    #modalBono #modalPrice,
    #modalBono .product-details-price span {
        font-size: 22px !important;
    }

    #modalBono #modalDescription,
    #modalBono .product-details-content p {
        font-size: 14px !important;
    }

    #modalBono #modalCaracteristicas li,
    #modalBono .pro-details-list li {
        font-size: 13px !important;
    }
}

/* =========================================================
   AJUSTE TAMAÑO MODAL (NO FULLSCREEN)
   ========================================================= */

/* Reducimos tamaño general */
#modalBono .modal-dialog {
    max-width: 760px !important;   /* antes 980px */
    width: calc(100% - 40px) !important;
    margin: 60px auto !important;  /* separa del header */
}

/* Limitar altura para que no ocupe toda la pantalla */
#modalBono .modal-content {
    max-height: calc(100vh - 120px) !important;
    display: flex;
    flex-direction: column;
}

/* Body con scroll interno */
#modalBono .modal-body {
    overflow-y: auto !important;
    max-height: calc(100vh - 180px) !important;
}

/* Header siempre visible */
#modalBono .modal-header {
    position: sticky;
    top: 0;
    z-index: 10;
}

/* Ajuste en móvil */
@media (max-width: 768px) {
    #modalBono .modal-dialog {
        max-width: 100% !important;
        width: calc(100% - 16px) !important;
        margin: 20px auto !important;
    }

    #modalBono .modal-content {
        max-height: calc(100vh - 40px) !important;
    }

    #modalBono .modal-body {
        max-height: calc(100vh - 100px) !important;
    }
}

#modalBono .modal-dialog {
    max-width: 520px !important;   /* MUCHO más pequeño */
    width: calc(100% - 40px) !important;
    margin: 80px auto !important;  /* más separación del header */
}

/* Altura controlada */
#modalBono .modal-content {
    max-height: calc(100vh - 160px) !important;
    display: flex;
    flex-direction: column;
}

/* Scroll interno */
#modalBono .modal-body {
    overflow-y: auto !important;
    max-height: calc(100vh - 220px) !important;
}

/* Header fijo */
#modalBono .modal-header {
    position: sticky;
    top: 0;
    z-index: 10;
}

/* En móvil que siga siendo usable */
@media (max-width: 768px) {
    #modalBono .modal-dialog {
        max-width: 100% !important;
        width: calc(100% - 16px) !important;
        margin: 20px auto !important;
    }
}

/* =========================================================
   BAJAR MODAL PARA QUE NO CHOQUE CON HEADER
   ========================================================= */

#modalBono .modal-dialog {
    margin-top: 140px !important;   /* AJUSTA AQUÍ si quieres más abajo */
}

/* Extra seguridad si el header es fijo */
body.modal-open #modalBono {
    padding-top: 40px !important;
}

/* =========================================================
   MODAL PEQUEÑO + BAJADO (VERSIÓN FINAL)
   ========================================================= */

#modalBono .modal-dialog {
    max-width: 440px !important;   /* MÁS pequeño */
    width: calc(100% - 40px) !important;
    margin: 160px auto 40px auto !important; /* más abajo */
}

/* Contenido más compacto */
#modalBono .modal-content {
    max-height: calc(100vh - 220px) !important;
    border-radius: 22px !important;
}

/* Scroll interno */
#modalBono .modal-body {
    max-height: calc(100vh - 260px) !important;
    overflow-y: auto !important;
    padding: 20px !important;
}

/* Header fijo */
#modalBono .modal-header {
    position: sticky;
    top: 0;
    z-index: 10;
}

/* Ajustes visuales para que todo encaje mejor en tamaño pequeño */
#modalBono #modalNombre {
    font-size: 24px !important;
}

#modalBono #modalPrice {
    font-size: 20px !important;
}

#modalBono .pro-details-list {
    padding: 14px !important;
}

/* Móvil */
@media (max-width: 768px) {
    #modalBono .modal-dialog {
        max-width: 100% !important;
        width: calc(100% - 16px) !important;
        margin: 90px auto 20px auto !important;
    }
}

/* =========================================================
   MODAL BONO · PEQUEÑO Y MÁS ABAJO
   ========================================================= */

#modalBono {
    padding-top: 120px !important;
}

#modalBono .modal-dialog {
    max-width: 440px !important;
    width: calc(100% - 40px) !important;
    margin: 0 auto 40px auto !important;
}

#modalBono .modal-content {
    max-height: calc(100vh - 180px) !important;
}

#modalBono .modal-body {
    max-height: calc(100vh - 230px) !important;
    overflow-y: auto !important;
}

/* móvil */
@media (max-width: 768px) {
    #modalBono {
        padding-top: 120px !important;
    }

    #modalBono .modal-dialog {
        width: calc(100% - 16px) !important;
        max-width: 440px !important;
        margin: 0 auto 16px auto !important;
    }

    #modalBono .modal-content {
        max-height: calc(100vh - 110px) !important;
    }

    #modalBono .modal-body {
        max-height: calc(100vh - 160px) !important;
    }
}

/* Modal bono centrado vertical */
#modalBono {
    padding: 16px !important;
}

#modalBono.in,
#modalBono.show {
    display: flex !important;
    align-items: center;
    justify-content: center;
}

#modalBono .modal-dialog {
    max-width: 440px !important;
    width: min(440px, calc(100vw - 32px)) !important;
    margin: 0 auto !important;
}

#modalBono .modal-content {
    max-height: calc(100vh - 32px) !important;
}

#modalBono .modal-header {
    min-height: 46px !important;
    padding: 6px 10px !important;
}

#modalBono .modal-header .close,
#modalBono .modal-header button.close {
    width: 34px !important;
    height: 34px !important;
    font-size: 24px !important;
    border-radius: 9px !important;
}

#modalBono .modal-body {
    max-height: calc(100vh - 104px) !important;
    padding: 8px 18px 18px !important;
    overflow-y: auto !important;
}

#modalBono .product-details-content,
#modalBono .quickview-content {
    padding-top: 0 !important;
}

@media (max-width: 768px) {
    #modalBono {
        padding: 10px !important;
    }

    #modalBono .modal-dialog {
        width: calc(100vw - 20px) !important;
        max-width: 440px !important;
    }

    #modalBono .modal-content {
        max-height: calc(100vh - 20px) !important;
    }

    #modalBono .modal-header {
        min-height: 42px !important;
        padding: 5px 8px !important;
    }

    #modalBono .modal-body {
        max-height: calc(100vh - 92px) !important;
        padding: 6px 14px 14px !important;
    }
}

/* Checkout compra bono moderno */
.checkout-area {
    background: #f3f6fb !important;
    padding: 28px 0 54px !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
}

.checkout-area > .container {
    width: min(430px, calc(100% - 18px)) !important;
    max-width: 430px !important;
    padding: 0 !important;
}

.checkout-area > .container > .row {
    display: block !important;
    margin: 0 !important;
}

.checkout-area > .container > .row > [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
}

.checkout-area .billing-info-wrap {
    overflow: hidden;
    padding: 0 0 18px !important;
    border: 1px solid #dfe7f3;
    border-radius: 18px;
    background: #ffffff !important;
    box-shadow: 0 18px 42px rgba(25, 36, 73, 0.08);
}

.checkout-area .billing-info-wrap > h3 {
    margin: 0 !important;
    padding: 18px 20px 12px !important;
    color: #17213d !important;
    font-size: 18px !important;
    font-weight: 850 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

.checkout-area .billing-info-wrap > .row,
.checkout-area .billing-info-wrap > section.row,
.checkout-area .billing-info-wrap > div.row {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.checkout-area .billing-info-wrap [class*="col-"] {
    padding-left: 14px !important;
    padding-right: 14px !important;
}

.checkout-area .billing-info-wrap > section.row,
.checkout-area .billing-info-wrap > .row:not(:first-child) {
    width: 100% !important;
}

.checkout-area .cardWrap1 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 112px;
    width: 100% !important;
    max-width: 358px !important;
    min-height: 216px !important;
    margin: 4px auto 18px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    transform: none !important;
    overflow: hidden;
    border: 1px solid #dfe7f3;
    border-radius: 18px;
    background: #ffffff;
    color: #17213d !important;
    box-shadow: 0 14px 32px rgba(25, 36, 73, 0.10);
}

.checkout-area .card1 {
    float: none !important;
    width: auto !important;
    height: auto !important;
    min-height: 216px !important;
    padding: 14px !important;
    background: #ffffff !important;
}

.checkout-area .cardLeft1 {
    display: flex !important;
    flex-direction: column;
    gap: 12px;
    border-radius: 0 !important;
}

.checkout-area .cardRight1 {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    border-left: 1px dashed #cbd5e1 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, #f8fbff 0%, #eefaf4 100%) !important;
}

.checkout-area .cardRight1::before,
.checkout-area .cardRight1::after {
    left: -8px !important;
    width: 16px !important;
    height: 16px !important;
    background: #ffffff !important;
    border: 1px solid #dfe7f3;
}

.checkout-area .cardRight1::before {
    top: -8px !important;
}

.checkout-area .cardRight1::after {
    bottom: -8px !important;
}

.checkout-area .cardLeft1 > .h1 {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 8px 11px !important;
    border-radius: 11px;
    background: linear-gradient(135deg, #000000 0%, #2e2e2e 100%);
    color: #ffffff !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    line-height: 1.15 !important;
    overflow: hidden;
}

.checkout-area .cardLeft1 > .h1 span {
    display: -webkit-box;
    width: 100%;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.checkout-area .title1,
.checkout-area .name1,
.checkout-area .seat {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 4px !important;
    text-align: left !important;
}

.checkout-area .title1 .h2,
.checkout-area .name1 .h2,
.checkout-area .name1 h2,
.checkout-area .seat .h2 {
    margin: 0 0 4px !important;
    color: #17213d !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    line-height: 1.2 !important;
}

.checkout-area .title1 span,
.checkout-area .name1 span,
.checkout-area .seat span,
.checkout-area .number span {
    color: #7b879d !important;
    font-size: 10px !important;
    font-weight: 850 !important;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.checkout-area .eye {
    width: 34px !important;
    height: 34px !important;
    margin: 0 auto !important;
    border: 1px solid #dfe7f3;
    border-radius: 12px !important;
    background: #ffffff !important;
}

.checkout-area .eye::before {
    width: 14px !important;
    height: 14px !important;
    left: 9px !important;
    top: 9px !important;
    background: #000000 !important;
}

.checkout-area .eye::after {
    width: 5px !important;
    height: 5px !important;
    left: 14px !important;
    top: 14px !important;
}

.checkout-area .number .h3 {
    margin: 0 !important;
    color: #11175f !important;
    font-size: 25px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

.checkout-area .qr {
    display: none !important;
}

.checkout-area .billing-info {
    margin: 0 0 12px !important;
}

.checkout-area .billing-info label,
.checkout-area .billing-info p {
    margin: 0 0 7px !important;
    color: #17213d !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    line-height: 1.3 !important;
}

.checkout-area .billing-info input,
.checkout-area .billing-info select,
.checkout-area .billing-info textarea,
.checkout-area .form-control {
    width: 100% !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 0 13px !important;
    border: 1px solid #d8e1ef !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #263454 !important;
    font-size: 14px !important;
    font-weight: 650 !important;
    box-shadow: 0 6px 16px rgba(25, 36, 73, 0.04) !important;
    outline: none !important;
}

.checkout-area .billing-info input:focus,
.checkout-area .billing-info select:focus,
.checkout-area .form-control:focus {
    border-color: #000000 !important;
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.10) !important;
}

.checkout-area .first {
    margin: 4px 14px 14px !important;
    padding: 14px !important;
    border: 1px solid #bdebd0;
    border-radius: 16px;
    background: #e9fff0 !important;
}

.checkout-area .first .billing-info {
    margin-bottom: 0 !important;
}

.checkout-area .event-field-row {
    display: grid !important;
    grid-template-columns: minmax(112px, 35%) minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    margin-bottom: 12px !important;
}

.checkout-area .event-field-row label {
    margin: 0 !important;
}

.checkout-area .your-order-area {
    padding: 0 14px !important;
}

.checkout-area .Place-order {
    margin: 8px 0 0 !important;
    padding: 16px !important;
    border: 1px solid #dfe7f3;
    border-radius: 18px;
    background: #f8fbff !important;
}

.checkout-area .Place-order label.checkbox-inline {
    display: grid !important;
    grid-template-columns: 22px minmax(0, 1fr) !ismportant;
    width: 100% !important;
    gap: 8px;
    align-items: start;
    margin: 0 0 12px !important;
    color: #33405f !important;
    font-size: 12px !important;
    font-weight: 650 !important;
    line-height: 1.35 !important;
    white-space: normal !important;
}

.checkout-area .Place-order label.checkbox-inline input {
    grid-column: 1;
    width: 18px !important;
    height: 18px !important;
    margin: 1px 0 0 !important;
}

.checkout-area .Place-order small {
    grid-column: 2;
    display: block !important;
    width: 100% !important;
    color: #6d7891 !important;
    font-size: 11px !important;
    line-height: 1.35 !important;
    white-space: normal !important;
}

.checkout-area .btnAddCarrito,
.checkout-area #addToCart,
.checkout-area .btnASeguir {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 100% !important;
    min-height: 46px !important;
    margin: 14px 0 0 !important;
    padding: 0 18px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #000000 0%, #2e2e2e 100%) !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0.04em;
    text-align: center !important;
    text-transform: uppercase;
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.22) !important;
}

.checkout-area #msgError,
.checkout-area #msgInfo {
    margin: 8px 14px 0 !important;
    font-size: 12px !important;
    font-weight: 750 !important;
    line-height: 1.35 !important;
}

.checkout-area hr {
    margin: 16px 14px !important;
    border-top: 1px solid #e5ebf4 !important;
}

@media (max-width: 420px) {
    .checkout-area {
        padding-top: 18px !important;
    }

    .checkout-area > .container {
        width: min(100% - 12px, 430px) !important;
    }

    .checkout-area .billing-info-wrap {
        border-radius: 15px;
    }

    .checkout-area .cardWrap1 {
        grid-template-columns: minmax(0, 1fr) 102px;
        max-width: 346px !important;
        min-height: 204px !important;
    }

    .checkout-area .card1 {
        min-height: 204px !important;
        padding: 12px !important;
    }

    .checkout-area .cardLeft1 > .h1 {
        font-size: 11px !important;
    }

    .checkout-area .number .h3 {
        font-size: 23px !important;
    }

    .checkout-area .event-field-row {
        grid-template-columns: minmax(0, 36%) minmax(0, 1fr);
        gap: 9px;
    }
}

.checkout-area .cardWrap1[style] {
    margin-left: 50% !important;
    margin-right: 0 !important;
    transform: translateX(-50%) !important;
}

.checkout-area .Place-order label.checkbox-inline {
    column-gap: 10px !important;
}

.checkout-area .Place-order label.checkbox-inline > input {
    grid-row: 1 / span 2;
}

.checkout-area .Place-order label.checkbox-inline > small {
    margin-top: -2px;
}

.checkout-area .billing-info-wrap > section.row {
    max-width: calc(100% - 28px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.checkout-area .billing-info-wrap > section.row > [class*="col-"] {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.checkout-area .first {
    width: calc(100% - 28px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.checkout-area .Place-order label.checkbox-inline {
    display: block !important;
    position: relative;
    min-height: 22px;
    padding-left: 32px !important;
}

.checkout-area .Place-order label.checkbox-inline input {
    position: absolute !important;
    left: 0;
    top: 0;
}

.checkout-area .Place-order label.checkbox-inline small {
    display: inline !important;
    width: auto !important;
    margin-left: 4px;
}

.checkout-area .cardWrap1,
.checkout-area .billing-info-wrap > section.row,
.checkout-area .your-order-area {
    width: min(100%, 350px) !important;
    max-width: 350px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.checkout-area .cardWrap1[style] {
    margin-left: auto !important;
    margin-right: auto !important;
    transform: none !important;
}

.checkout-area .billing-info-wrap > section.row {
    display: block !important;
}

.checkout-area .billing-info-wrap > section.row > [class*="col-"],
.checkout-area .billing-info-wrap > section.row .first {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.checkout-area .your-order-area {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Estado de compra moderno */
.purchase-status-page {
    width: min(920px, calc(100% - 24px));
    margin: 28px auto 70px;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
}

.purchase-status-card {
    position: relative;
    overflow: hidden;
    margin: 0 auto 22px;
    padding: 28px 24px;
    border: 1px solid #dfe7f3;
    border-radius: 20px;
    background: #ffffff;
    text-align: center;
    box-shadow: 0 18px 42px rgba(25, 36, 73, 0.08);
}

.purchase-status-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 5px;
    background: linear-gradient(90deg, #000000, #000000, #2e2e2e);
}

.purchase-status-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    margin: 0 0 14px;
    border-radius: 18px;
    font-size: 28px;
}

.purchase-status-success .purchase-status-icon {
    background: #e9fff0;
    color: #128144;
}

.purchase-status-error .purchase-status-icon {
    background: #fff0f0;
    color: #bd1f2d;
}

.purchase-status-card h2 {
    margin: 0 0 8px !important;
    color: #17213d !important;
    font-size: 25px !important;
    font-weight: 900 !important;
    line-height: 1.15 !important;
    letter-spacing: 0 !important;
}

.purchase-status-card p {
    max-width: 560px;
    margin: 0 auto !important;
    color: #5f6b82 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
}

.purchase-status-page .btnVolver,
.purchase-status-page .btnSaveQR,
.purchase-status-page .btnPrint {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    width: auto !important;
    min-width: 190px;
    margin: 18px auto 0 !important;
    padding: 0 18px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #000000 0%, #2e2e2e 100%) !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.20) !important;
}

.purchase-status-page #QRS {
    width: min(100%, 760px) !important;
    margin: 0 auto 28px !important;
    transform: none !important;
    display: grid;
    gap: 16px;
    justify-items: center;
}

.purchase-status-page .purchase-print-actions {
    width: min(100%, 360px);
    display: flex;
    justify-content: center;
    margin: 8px auto 0;
    padding-top: 8px;
}

.purchase-status-page .contentTicket {
    width: min(100%, 360px) !important;
    margin: 0 auto !important;
    padding: 0 !important;
    transform: none !important;
}

.purchase-status-page .contentTicket .ticket,
.purchase-status-page .containerEntradas {
    border: 1px solid #dfe7f3 !important;
    border-radius: 18px !important;
    background: #ffffff !important;
    box-shadow: 0 16px 38px rgba(25, 36, 73, 0.08) !important;
}

.purchase-status-page .contentTicket .ticket {
    padding: 18px !important;
}

.purchase-status-page .contentTicket h1,
.purchase-status-page .containerEntradas h1 {
    margin: 0 0 12px !important;
    padding: 0 0 10px !important;
    border-bottom: 1px dashed #cbd5e1 !important;
    color: #17213d !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
}

.purchase-status-page .contentTicket p,
.purchase-status-page .containerEntradas p {
    color: #4f5d78 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
}

.purchase-status-page .qr-code img {
    max-width: min(100%, 260px) !important;
    height: auto !important;
    border-radius: 14px;
}

.purchase-status-page .containerEntradas {
    width: min(100%, 760px) !important;
    margin: 18px auto !important;
    padding: 20px !important;
    gap: 18px;
}

.purchase-status-page .ticket-details {
    width: auto !important;
    min-width: 0;
    margin-right: 0 !important;
}

.purchase-status-page .share-icon {
    display: inline-flex;
    margin-top: 10px;
    color: #000000 !important;
    font-weight: 800;
}

@media (max-width: 640px) {
    .purchase-status-page {
        width: min(100% - 14px, 430px);
        margin-top: 18px;
    }

    .purchase-status-card {
        padding: 24px 18px;
        border-radius: 16px;
    }

    .purchase-status-card h2 {
        font-size: 22px !important;
    }

.purchase-status-page .containerEntradas {
        display: block !important;
        padding: 16px !important;
    }
}

/* Selector de asientos movil */
body.listEventos {
    background: #f3f6fb !important;
}

body.listEventos .shop-area {
    padding: 18px 0 96px !important;
}

body.listEventos .shop-area > .container {
    width: min(1180px, calc(100% - 18px)) !important;
    max-width: 1180px !important;
    padding: 0 !important;
}

body.listEventos .plannerDIV {
    min-height: calc(100vh - 210px);
    overflow: auto !important;
    padding: 18px !important;
    border: 1px solid #dfe7f3;
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 18px 42px rgba(25, 36, 73, 0.08);
    -webkit-overflow-scrolling: touch;
}

body.listEventos .planner {
    transform-origin: top center !important;
    min-width: 980px;
    min-height: 760px;
    margin: 0 auto !important;
}

body.listEventos .plannerTop,
body.listEventos .plannerTopRight {
    position: fixed !important;
    z-index: 20020 !important;
    display: flex !important;
    align-items: center;
    gap: 8px;
    margin: 0 !important;
    padding: 8px;
    border: 1px solid #dfe7f3;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 12px 28px rgba(25, 36, 73, 0.14);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

body.listEventos .plannerTop {
    top: 154px;
    right: 18px;
    bottom: auto;
    left: auto;
    flex-direction: column;
    transform: none;
    padding: 7px;
}

body.listEventos .plannerTopRight {
    left: 50%;
    right: auto !important;
    bottom: 18px;
    top: auto !important;
    transform: translateX(-50%);
    width: min(420px, calc(100% - 20px));
    justify-content: center;
}

body.listEventos .btnZoom {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    min-width: 48px;
    margin: 0 !important;
    padding: 0 16px !important;
    border: 0 !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #000000 0%, #2e2e2e 100%) !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.18);
}

body.listEventos .btnBack {
    background: #eef3fb !important;
    color: #17213d !important;
    box-shadow: none !important;
}

body.listEventos .btnSeguir {
    flex: 1;
    min-width: 160px;
}

body.listEventos .plannerBottom {
    position: fixed !important;
    left: 50%;
    bottom: 146px;
    z-index: 20019 !important;
    width: min(420px, calc(100% - 20px));
    transform: translateX(-50%);
    padding: 10px 12px;
    border: 1px solid #dfe7f3;
    border-radius: 14px;
    background: #17213d;
    color: #ffffff;
    box-shadow: 0 12px 28px rgba(25, 36, 73, 0.18);
}

body.listEventos .plannerBottom:empty {
    display: none;
}

body.listEventos .plannerBottom p {
    margin: 0 !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
}

body.listEventos .zonas .seat {
    min-width: 22px !important;
    min-height: 22px !important;
    border-radius: 11px !important;
    outline: 1px solid rgba(255, 255, 255, 0.7);
    outline-offset: -1px;
    box-shadow: 0 2px 5px rgba(15, 23, 42, 0.18);
}

body.listEventos .zonas table {
    border-collapse: collapse !important;
    border-spacing: 0 !important;
}

body.listEventos .zonas table td {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

body.listEventos .zonas table td.selected {
    outline: 3px solid #17213d !important;
    outline-offset: 2px;
}

body.listEventos #modalConfirmarAsiento .modal-dialog,
body.listEventos #modalConfirmarNumZona .modal-dialog {
    width: min(420px, calc(100% - 24px)) !important;
    margin: 12vh auto !important;
    padding: 0 !important;
}

body.listEventos #modalConfirmarAsiento .modal-content,
body.listEventos #modalConfirmarNumZona .modal-content {
    border: 1px solid #dfe7f3 !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 42px rgba(25, 36, 73, 0.18) !important;
}

@media (max-width: 900px) {
    body.listEventos .shop-area {
        padding-top: 10px !important;
        padding-bottom: 190px !important;
    }

    body.listEventos .plannerDIV {
        width: 100% !important;
        min-height: calc(100vh - 250px);
        max-height: calc(100vh - 230px);
        padding: 12px !important;
        border-radius: 16px;
    }

    body.listEventos .planner {
        min-width: 1040px;
        min-height: 820px;
        margin-left: -180px !important;
        margin-right: 0 !important;
        transform-origin: top left !important;
    }

    body.listEventos .zonas .seat {
        min-width: 22px !important;
        min-height: 22px !important;
    }

    body.listEventos .zonas .seat i {
        font-size: 11px !important;
    }

    body.listEventos .plannerTop {
        top: 174px;
        right: 14px;
        bottom: auto;
    }

    body.listEventos .plannerTopRight {
        bottom: 18px;
    }

    body.listEventos .plannerBottom {
        bottom: 146px;
    }
}

/* Comprar: formulario compacto antes del boton */
#products .purchase-options-panel {
    width: 100% !important;
    max-width: 420px !important;
    margin: 14px 0 0 !important;
    padding: 14px !important;
    border: 1px solid #e4eaf4 !important;
    border-radius: 18px !important;
    background: #f8fbff !important;
}

#products .purchase-options-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    gap: 10px !important;
    margin-bottom: 10px !important;
}

#products .purchase-options-grid:last-child {
    margin-bottom: 0 !important;
}

#products .purchase-option-field {
    display: block !important;
    margin: 0 !important;
}

#products .purchase-option-field label {
    display: block !important;
    margin: 0 0 5px !important;
    color: #5f6b82 !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
}

#products .purchase-option-field .form-control,
#products .purchase-option-field input[type="date"],
#products .purchase-option-field input[type="number"],
#products .purchase-option-field input[type="text"] {
    height: 44px !important;
    min-height: 44px !important;
    border-radius: 12px !important;
    font-size: 13px !important;
}

#products .purchase-option-field--comment {
    margin-top: 2px !important;
}

#products .purchase-option-field--comment label {
    color: #17213d !important;
    font-size: 12px !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

#products .selectionProduct:not(:has(> .col-md-6:nth-of-type(2))) {
    grid-template-columns: minmax(0, 430px) !important;
    justify-content: center !important;
}

#products .purchase-options-panel + .btnVerProducto {
    margin-top: 12px !important;
}

@media (max-width: 420px) {
    #products .purchase-options-panel {
        padding: 12px !important;
    }

    #products .purchase-options-grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 92px) !important;
        gap: 8px !important;
    }
}

/* Garita: venta entrada dia con ticket moderno */
#entrada-dia .panel-body > .row.col-xl-12,
#entrada-dia .panel-body > .row.col-md-12,
#entrada-dia .panel-body > .row.col-lg-12 {
    display: grid !important;
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    gap: 18px !important;
    width: 100% !important;
    margin: 0 auto !important;
}

#entrada-dia .panel-body > .row.col-xl-12 > .row.col-md-12 {
    display: grid !important;
    grid-template-columns: minmax(0, 430px) !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 470px !important;
    margin: 0 auto !important;
    padding: 12px !important;
    border: 1px solid #e3e9f4 !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    box-shadow: 0 16px 40px rgba(34, 47, 90, 0.08) !important;
}

#entrada-dia .panel-body > .row.col-xl-12 > .row.col-md-12 > .col-md-6,
#entrada-dia .panel-body > .row.col-xl-12 > .row.col-md-12 > .col-md-12 {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

#entrada-dia .btnVerProducto11.cardWrap1 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 80px !important;
    width: 100% !important;
    max-width: 430px !important;
    min-height: 214px !important;
    margin: 0 auto 14px !important;
    overflow: hidden !important;
    border: 1px solid #dfe6f2 !important;
    border-radius: 22px !important;
    background: #ffffff !important;
    color: #17213d !important;
    box-shadow: 0 14px 32px rgba(34, 47, 90, 0.10) !important;
}

#entrada-dia .btnVerProducto11 .card1 {
    float: none !important;
    width: auto !important;
    height: auto !important;
    min-height: 214px !important;
    padding: 12px !important;
    background: #ffffff !important;
}

#entrada-dia .btnVerProducto11 .cardLeft1 {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 9px !important;
    border-radius: 0 !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
}

#entrada-dia .btnVerProducto11 .cardRight1 {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    border-left: 1px dashed #cbd5e1 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, #f8fbff 0%, #eefaf4 100%) !important;
}

#entrada-dia .btnVerProducto11 .cardRight1::before,
#entrada-dia .btnVerProducto11 .cardRight1::after {
    left: -8px !important;
    width: 16px !important;
    height: 16px !important;
    background: #ffffff !important;
    border: 1px solid #dfe6f2 !important;
}

#entrada-dia .btnVerProducto11 .cardRight1::before {
    top: -8px !important;
}

#entrada-dia .btnVerProducto11 .cardRight1::after {
    bottom: -8px !important;
}

#entrada-dia .btnVerProducto11 .cardLeft1 > .h1 {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 38px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    border-radius: 12px !important;
    background: linear-gradient(135deg, #000000 0%, #2e2e2e 100%) !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    line-height: 1.15 !important;
    letter-spacing: 0 !important;
    overflow: hidden !important;
}

#entrada-dia .btnVerProducto11 .cardLeft1 > .h1 span {
    display: -webkit-box !important;
    width: 100% !important;
    max-height: 28px !important;
    overflow: hidden !important;
    color: #ffffff !important;
    overflow-wrap: anywhere !important;
    text-overflow: clip !important;
    white-space: normal !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#entrada-dia .btnVerProducto11 .title1,
#entrada-dia .btnVerProducto11 .name1,
#entrada-dia .btnVerProducto11 .seat {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    text-align: left !important;
    text-transform: none !important;
}

#entrada-dia .btnVerProducto11 .title1 .h2,
#entrada-dia .btnVerProducto11 .name1 .h2,
#entrada-dia .btnVerProducto11 .seat .h2,
#entrada-dia .btnVerProducto11 .title1 h2,
#entrada-dia .btnVerProducto11 .name1 h2,
#entrada-dia .btnVerProducto11 .seat h2 {
    display: -webkit-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 0 3px !important;
    color: #263454 !important;
    font-size: 12px !important;
    font-weight: 850 !important;
    line-height: 1.25 !important;
    overflow: hidden !important;
    overflow-wrap: anywhere !important;
    text-overflow: clip !important;
    white-space: normal !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
}

#entrada-dia .btnVerProducto11 .title1 span,
#entrada-dia .btnVerProducto11 .name1 span,
#entrada-dia .btnVerProducto11 .seat span,
#entrada-dia .btnVerProducto11 .number > .price-label {
    color: #7a879d !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    letter-spacing: 0.05em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
}

#entrada-dia .btnVerProducto11 .title1 span,
#entrada-dia .btnVerProducto11 .name1 span,
#entrada-dia .btnVerProducto11 .seat span {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
}

#entrada-dia .btnVerProducto11 .eye {
    width: 38px !important;
    height: 38px !important;
    margin: 0 !important;
    border-radius: 13px !important;
    background: #ffffff !important;
    box-shadow: inset 0 0 0 1px #dfe6f2 !important;
}

#entrada-dia .btnVerProducto11 .eye::before {
    width: 16px !important;
    height: 16px !important;
    left: 11px !important;
    top: 11px !important;
    border-radius: 999px !important;
    background: #000000 !important;
}

#entrada-dia .btnVerProducto11 .eye::after {
    width: 6px !important;
    height: 6px !important;
    left: 16px !important;
    top: 16px !important;
    background: #ffffff !important;
}

#entrada-dia .btnVerProducto11 .number {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 4px !important;
    margin: 0 !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}

#entrada-dia .btnVerProducto11 .number .h3 {
    display: inline-flex !important;
    width: auto !important;
    max-width: 100% !important;
    align-items: baseline !important;
    justify-content: center !important;
    gap: 3px !important;
    margin: 0 auto 7px !important;
    padding: 0 !important;
    color: #000000 !important;
    font-size: 22px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: 0 !important;
    white-space: nowrap !important;
    text-align: center !important;
    transform: none !important;
    align-self: center !important;
}

#entrada-dia .btnVerProducto11 .number .h3 .price-symbol,
#entrada-dia .btnVerProducto11 .number .h3 .price-value {
    display: inline-block !important;
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    color: inherit !important;
    font: inherit !important;
    line-height: inherit !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    align-self: auto !important;
}

#entrada-dia .btnVerProducto11 .number > .price-label,
#entrada-dia .btnVerProducto11 .number > span {
    align-self: stretch !important;
}

#entrada-dia .garita-date-field,
#entrada-dia .garita-qty-field {
    width: 50% !important;
    max-width: 50% !important;
    float: left !important;
    padding: 0 !important;
}

#entrada-dia .garita-date-field {
    padding-right: 5px !important;
}

#entrada-dia .garita-qty-field {
    padding-left: 5px !important;
}

#entrada-dia .garita-comment-field {
    clear: both !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 16px 0 0 !important;
}

#entrada-dia .panel-body > .row.col-xl-12 > .row.col-md-12 > .col-md-6:nth-of-type(2) {
    padding: 12px !important;
    border: 1px solid #e4eaf4 !important;
    border-radius: 18px !important;
    background: #f8fbff !important;
}

#entrada-dia .billing-info {
    display: block !important;
    margin: 0 0 10px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

#entrada-dia .billing-info label {
    display: block !important;
    margin: 0 0 6px !important;
    color: #17213d !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    line-height: 1.15 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
}

#entrada-dia .billing-info .form-control,
#entrada-dia .ntarjeta.form-control {
    width: 100% !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 13px !important;
    border: 1px solid #d6deec !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    color: #263454 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    box-shadow: 0 8px 20px rgba(34, 47, 90, 0.04) !important;
}

#entrada-dia .btnVerProducto.btn-primary {
    width: 100% !important;
    min-height: 48px !important;
    margin-top: 12px !important;
    border: 0 !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, #000000 0%, #000000 52%, #2e2e2e 100%) !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0.05em !important;
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.22) !important;
}

@media (max-width: 420px) {
    #entrada-dia .panel-body {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    #entrada-dia .panel-body > .row.col-xl-12 > .row.col-md-12 {
        width: min(100%, 318px) !important;
        max-width: 318px !important;
        padding: 10px !important;
        border-radius: 20px !important;
    }

    #entrada-dia .btnVerProducto11.cardWrap1 {
        grid-template-columns: minmax(0, 1fr) 72px !important;
        min-height: 202px !important;
        border-radius: 20px !important;
    }

    #entrada-dia .btnVerProducto11 .card1 {
        min-height: 202px !important;
        padding: 10px !important;
    }

    #entrada-dia .btnVerProducto11 .cardLeft1 {
        gap: 8px !important;
    }

    #entrada-dia .btnVerProducto11 .cardLeft1 > .h1 {
        min-height: 36px !important;
        padding: 7px 9px !important;
        font-size: 10px !important;
    }

    #entrada-dia .btnVerProducto11 .title1 .h2,
    #entrada-dia .btnVerProducto11 .name1 .h2,
    #entrada-dia .btnVerProducto11 .seat .h2 {
        font-size: 11px !important;
        line-height: 1.2 !important;
    }

    #entrada-dia .btnVerProducto11 .number .h3 {
        font-size: 20px !important;
    }

    #entrada-dia .btnVerProducto11 .number > .price-label {
        font-size: 9px !important;
    }

    #entrada-dia .panel-body > .row.col-xl-12 > .row.col-md-12 > .col-md-6:nth-of-type(2) {
        padding: 10px !important;
    }

    #entrada-dia .billing-info .form-control,
    #entrada-dia .ntarjeta.form-control {
        height: 40px !important;
        min-height: 40px !important;
    }

    #entrada-dia .garita-date-field {
        padding-right: 4px !important;
    }

    #entrada-dia .garita-qty-field {
        padding-left: 4px !important;
    }

    #entrada-dia .garita-comment-field {
        padding-top: 14px !important;
    }
}

/* Login moderno aislado del checkout */
.login-page {
    width: 100% !important;
    min-height: calc(100vh - 190px) !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    padding: 34px 14px 56px !important;
    background:
        linear-gradient(180deg, #f7f9fd 0%, #ffffff 76%),
        radial-gradient(circle at 50% 0%, rgba(0, 0, 0, 0.08), transparent 42%) !important;
    box-sizing: border-box !important;
}

.login-page .checkout-area {
    width: 100% !important;
    max-width: 520px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    background: transparent !important;
}

.login-page .checkout-area > .container,
.login-page .checkout-area > .container > .row,
.login-page .checkout-area > .container > .row > [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
}

.login-page .billing-info-wrap {
    width: 100% !important;
    max-width: 100% !important;
    min-height: auto !important;
    margin: 0 auto !important;
    padding: 28px 18px !important;
    display: block !important;
    overflow: hidden !important;
    border: 1px solid #e2e9f4 !important;
    border-radius: 22px !important;
    background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%) !important;
    box-shadow: 0 20px 48px rgba(18, 31, 70, 0.12) !important;
    position: relative !important;
}

.login-page .billing-info-wrap::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 5px !important;
    background: linear-gradient(90deg, #000000, #000000, #2e2e2e) !important;
}

.login-page .billing-info-wrap::after {
    display: none !important;
    content: none !important;
}

.login-page .billing-info-wrap h3 {
    margin: 0 0 22px !important;
    max-width: none !important;
    color: #121a35 !important;
    font-size: 26px !important;
    font-weight: 900 !important;
    line-height: 1.08 !important;
    letter-spacing: 0 !important;
    text-align: left !important;
}

.login-page .billing-info-wrap > .row {
    display: block !important;
    margin: 0 !important;
}

.login-page .billing-info-wrap > .row > [class*="col-"],
.login-page .billing-info-wrap .pro-details-cart {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    float: none !important;
}

.login-page .billing-info,
.login-page .billing-info.mb-20 {
    width: 100% !important;
    max-width: 100% !important;
    margin-bottom: 14px !important;
}

.login-page .billing-info label {
    display: block !important;
    margin: 0 0 7px !important;
    color: #1f2a44 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
}

.login-page .billing-info input,
.login-page .billing-info input[type="email"],
.login-page .billing-info input[type="password"] {
    width: 100% !important;
    min-height: 52px !important;
    padding: 0 15px !important;
    border: 1px solid #dce5f2 !important;
    border-radius: 14px !important;
    background: #f6f9fe !important;
    color: #121a35 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

.login-page .billing-info input:focus {
    border-color: rgba(0, 0, 0, 0.55) !important;
    background: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.1) !important;
    outline: 0 !important;
}

.login-page #msgErrorLogin {
    min-height: 18px !important;
    margin: 0 0 8px !important;
    color: #dc2626 !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

.login-page .text-left.mt-3.mb-3 {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 6px 0 20px !important;
}

.login-page .switch-remember {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin: 0 !important;
    color: #1f2a44 !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

.login-page .switch-remember .slider {
    flex: 0 0 38px !important;
    width: 38px !important;
    height: 22px !important;
    margin: 0 !important;
    background: #d4dce9 !important;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.1) !important;
}

.login-page .switch-remember .slider::before {
    width: 18px !important;
    height: 18px !important;
    top: 2px !important;
    left: 2px !important;
}

.login-page .switch-remember input:checked + .slider {
    background: linear-gradient(135deg, #000000 0%, #2e2e2e 100%) !important;
}

.login-page .switch-remember input:checked + .slider::before {
    transform: translateX(16px) !important;
}

.login-page #btnLogin,
.login-page .btnstyle2,
.login-page .btnStyle2,
.login-page a.btnstyle2,
.login-page a.btnStyle2 {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 52px !important;
    margin: 0 0 12px !important;
    padding: 0 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 14px !important;
    border: 1px solid transparent !important;
    font-size: 15px !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
    text-align: center !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

.login-page #btnLogin {
    background: linear-gradient(135deg, #000000 0%, #000000 52%, #2e2e2e 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 14px 26px rgba(0, 0, 0, 0.24) !important;
}

.login-page a[href*="registrar"].btnstyle2 {
    background: rgba(0, 0, 0, 0.08) !important;
    border-color: rgba(0, 0, 0, 0.22) !important;
    color: #000000 !important;
}

.login-page a[href*="recuperar"].btnStyle2,
.login-page a[href*="recuperar"].btnstyle2 {
    background: #ffffff !important;
    border-color: #dfe7f2 !important;
    color: #17213d !important;
}

.login-page .billing-info-wrap hr {
    width: 100% !important;
    max-width: 100% !important;
    margin: 16px 0 0 !important;
    border-top: 1px solid #e8edf5 !important;
}

@media (min-width: 768px) {
    .login-page {
        align-items: center !important;
        padding: 48px 24px 70px !important;
    }

    .login-page .checkout-area {
        max-width: 600px !important;
    }

    .login-page .billing-info-wrap {
        padding: 38px !important;
        border-radius: 26px !important;
    }

    .login-page .billing-info-wrap h3 {
        font-size: 34px !important;
    }
}

@media (max-width: 420px) {
    .login-page {
        padding: 28px 14px 48px !important;
    }

    .login-page .billing-info-wrap {
        padding: 24px 16px !important;
    }

    .login-page .billing-info-wrap h3 {
        font-size: 24px !important;
    }
}

/* =========================================
   ESTILO SOLO PARA EVENTOS
   NO TOCA EL HEADER NI SUS DROPDOWNS
   ========================================= */

/* Fondo solo en la página de eventos */
body.listEventos {
  background: #f5f6fb !important;
}

/* No tocar header ni footer */
body.listEventos .header-area,
body.listEventos .header-area *,
body.listEventos header,
body.listEventos header *,
body.listEventos .footer-area,
body.listEventos .footer-area * {
  box-sizing: border-box !important;
}

/* Contenedor principal de contenido */
body.listEventos .shop-area,
body.listEventos .product-area {
  background: transparent !important;
  padding-top: 10px !important;
  padding-bottom: 30px !important;
}

/* Tarjetas/listado */
body.listEventos .product-wrap,
body.listEventos .single-product,
body.listEventos .product-cart-wrap,
body.listEventos .product-wrapper {
  background: #ffffff !important;
  border: 1px solid #e8edf5 !important;
  border-radius: 24px !important;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06) !important;
  overflow: hidden !important;
}

/* Imagen cartel */
body.listEventos .product-img,
body.listEventos .product-image,
body.listEventos .product-wrap img,
body.listEventos .single-product img {
  border-radius: 18px !important;
}

/* Zona de texto */
body.listEventos .product-content,
body.listEventos .product-details-content,
body.listEventos .product-details-content.ml-70 {
  background: #ffffff !important;
  border: 1px solid #e8edf5 !important;
  border-radius: 24px !important;
  box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06) !important;
  padding: 20px !important;
  margin-top: 12px !important;
}

/* Título */
body.listEventos .product-content h3,
body.listEventos .product-content h4,
body.listEventos .product-details-content h2 {
  color: #111827 !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  margin-bottom: 10px !important;
}

/* Meta info */
body.listEventos .product-details-price,
body.listEventos .product-details-rating-wrap {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  background: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 999px !important;
  padding: 8px 14px !important;
  margin: 0 8px 10px 0 !important;
  color: #475569 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

/* Textos */
body.listEventos .product-content p,
body.listEventos .product-details-content p {
  color: #4b5563 !important;
  line-height: 1.6 !important;
}

/* Selector de horario */
body.listEventos #divHorarios {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin: 12px 0 18px 0 !important;
}

body.listEventos #divHorarios label,
body.listEventos #divHorarios button,
body.listEventos #divHorarios .btn,
body.listEventos #divHorarios span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 84px !important;
  padding: 10px 16px !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  border: 1px solid #d8e1ee !important;
  color: #1f2937 !important;
  font-weight: 600 !important;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05) !important;
}

body.listEventos #divHorarios label.active,
body.listEventos #divHorarios label.selected,
body.listEventos #divHorarios .active,
body.listEventos #divHorarios .selected,
body.listEventos #divHorarios input[type="radio"]:checked + label {
  background: #243c96 !important;
  border-color: #243c96 !important;
  color: #ffffff !important;
}

/* Botón comprar SOLO dentro del módulo de eventos */
body.listEventos .product-details-content .pro-details-affiliate a,
body.listEventos .product-details-content a#btnComprarEvento,
body.listEventos .product-details-content .btn-comprar,
body.listEventos .product-details-content .btn.btn-primary {
  display: inline-flex !important;
  width: 100% !important;
  justify-content: center !important;
  align-items: center !important;
  min-height: 54px !important;
  border-radius: 16px !important;
  background: #111827 !important;
  color: #ffffff !important;
  text-decoration: none !important;
  font-weight: 700 !important;
  border: none !important;
  box-shadow: 0 12px 24px rgba(15, 23, 42, 0.18) !important;
}

body.listEventos .product-details-content .pro-details-affiliate a:hover,
body.listEventos .product-details-content a#btnComprarEvento:hover,
body.listEventos .product-details-content .btn-comprar:hover,
body.listEventos .product-details-content .btn.btn-primary:hover {
  background: #1f2937 !important;
  color: #ffffff !important;
}

/* Volver eventos SOLO en contenido */
body.listEventos .product-details-content .btnVolver,
body.listEventos .product-details-content a[href*="eventos.php"] {
  display: inline-flex !important;
  align-items: center !important;
  padding: 10px 14px !important;
  margin-top: 16px !important;
  border-radius: 14px !important;
  background: #ffffff !important;
  border: 1px solid #dbe3ef !important;
  color: #334155 !important;
  text-decoration: none !important;
  font-weight: 600 !important;
  width: auto !important;
  min-height: auto !important;
  box-shadow: none !important;
}

/* Ocultar bloque social solo dentro de detalle */
body.listEventos .product-details-content .pro-details-social {
  display: none !important;
}

/* Móvil */
@media (max-width: 600px) {
  body.listEventos .product-content,
  body.listEventos .product-details-content,
  body.listEventos .product-details-content.ml-70 {
    border-radius: 20px !important;
    padding: 16px !important;
  }

  body.listEventos .product-details-content h2 {
    font-size: 30px !important;
  }
}

/**/ 

body.reserva-page.modal-open .modal-backdrop {
	z-index: 20040 !important;
}

body.reserva-page #modalReserva,
body.reserva-page #modalCancelarReserva,
body.reserva-page #modalBono {
	z-index: 20050 !important;
}

body.reserva-page #modalReserva .modal-content,
body.reserva-page #modalCancelarReserva .modal-content,
body.reserva-page #modalBono .modal-content {
	position: relative !important;
	z-index: 20051 !important;
}

body.reserva-page #modalReserva .modal-header,
body.reserva-page #modalCancelarReserva .modal-header,
body.reserva-page #modalBono .modal-header {
	position: relative !important;
	z-index: 20052 !important;
}

body.reserva-page #modalReserva .close,
body.reserva-page #modalCancelarReserva .close,
body.reserva-page #modalBono .close {
	position: relative !important;
	z-index: 20053 !important;
}

.header-hm9 .header-top-area {
	flex-direction: column !important;
	align-items: stretch !important;
}

.header-hm9 .header-top-area > .row:not(.header-shortcuts-row) {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	flex-wrap: nowrap !important;
	width: 100% !important;
}

.header-hm9 .header-top-area .header-actions-column {
	margin-left: auto !important;
}

.header-hm9 .header-top-area .header-actions-column .header-cart-actions {
	justify-content: flex-end !important;
	width: auto !important;
	margin-left: auto !important;
}

.header-hm9 .header-top-area .header-main-column {
	flex: 1 1 auto !important;
	width: auto !important;
	min-width: 0 !important;
	max-width: none !important;
}

.header-hm9 .header-top-area .header-main-column .same-style.account-satting,
.header-hm9 .header-top-area .header-main-column .same-style.account-satting > a {
	width: auto !important;
	max-width: none !important;
}

.header-hm9 .header-top-area .header-main-column .same-style.account-satting > a .emailActive,
.header-hm9 .header-top-area .header-main-column .same-style.account-satting > a label.emailActive {
	max-width: none !important;
	width: auto !important;
	overflow: visible !important;
	text-overflow: clip !important;
	white-space: nowrap !important;
	flex: 0 0 auto !important;
}

.header-hm9 .header-top-area .header-shortcuts-row {
	display: flex !important;
	flex: 0 0 100% !important;
	flex-wrap: nowrap !important;
	width: 100% !important;
	min-height: auto !important;
	margin-top: 8px !important;
	gap: 0 !important;
}

.header-hm9 .header-top-area .header-shortcuts-column {
	display: block !important;
	flex: 0 0 100% !important;
	width: 100% !important;
	max-width: 100% !important;
	min-height: auto !important;
	padding: 0 !important;
}

.header-shortcuts {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	flex-wrap: wrap !important;
	width: 100% !important;
	gap: 8px !important;
}

.header-shortcut-link {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	min-height: 34px !important;
	padding: 0 14px !important;
	border: 1px solid rgba(0, 0, 0, 0.22) !important;
	border-radius: 12px !important;
	background: #ffffff !important;
	color: #243056 !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	text-decoration: none !important;
	box-shadow: 0 5px 14px rgba(15, 23, 42, 0.06) !important;
}

.header-shortcut-link:hover {
	border-color: rgba(0, 0, 0, 0.42) !important;
	background: rgba(0, 0, 0, 0.08) !important;
	color: #000000 !important;
	transform: translateY(-1px);
}

@media (max-width: 600px) {
	.header-hm9 .header-top-area .header-shortcuts-row {
		margin-top: 6px !important;
	}

	.header-shortcuts {
		justify-content: center !important;
		gap: 6px !important;
	}

	.header-shortcut-link {
		flex: 1 1 auto !important;
		min-width: 92px !important;
		padding: 0 10px !important;
		font-size: 12px !important;
	}
}

@media (max-width: 600px) {
	.header-hm9 .header-top-area > .row:not(.header-shortcuts-row) {
		gap: 8px !important;
	}

	.header-hm9 .header-top-area .header-main-column {
		flex: 1 1 calc(100% - 52px) !important;
		max-width: calc(100% - 52px) !important;
	}

	.header-hm9 .header-top-area .header-actions-column {
		flex: 0 0 44px !important;
		width: 44px !important;
		max-width: 44px !important;
		padding-left: 0 !important;
	}

	.header-hm9 .header-top-area .header-main-column .same-style.account-satting,
	.header-hm9 .header-top-area .header-main-column .same-style.account-satting > a {
		width: 100% !important;
		max-width: 100% !important;
	}

	.header-hm9 .header-top-area .header-main-column .same-style.account-satting > a .emailActive,
	.header-hm9 .header-top-area .header-main-column .same-style.account-satting > a label.emailActive {
		max-width: none !important;
		overflow: visible !important;
		text-overflow: clip !important;
		font-size: 11px !important;
	}
}

.default-img{
	margin-top:20px;
}

@media  (min-width: 1200px) {
	.container{
		width:90% !important; 
		max-width:90% !important;
	}
}
.container{
	width:90% !important;
	max-width:90% !important;
}
.successInput {
	border-bottom:2px solid green !important;
}
.warningInput {
	border-bottom:2px solid orange !important;
}

.btnPuerta{
	margin-left:50%;
	transform:translateX(-50%);
}

@media only screen and (max-width: 767px) {
	.hiddenMobile {
		display:none !important;
		
	}
	.showReservasInfo{
		margin-top:50px;
	}
}

.tableReserva {
		margin-left:50%;transform:translateX(-50%)
	}
	
@media only screen and (max-width: 900px) {
	.container {
		padding-left:0px !important;
		padding-right:0px !important;
	}
	.btnVerProducto {
		margin-top:10px;
		width:97% !important;
	}
	.emailActive {
		display:flex !important;
	}
	.tableReserva {
		margin-left:0%;transform:translateX(0%)
	}
	
}


.encender {
	background-color:#32f669 !important;
	border:1px solid #32f669;
	color:white;
}
.cerrar {
	background-color:#f63232 !important;
	color:white;
	border:1px solid #f63232;
}

.btn-hover .btnstyle2 {
	border:1px solid #ccc !important;
	background-color:white !important;
	color:#000 !important;
}
.btn-hover .btnstyle3 {
	border:0px solid #ccc !important;
	background-color:white !important;
	color:#000 !important;
}

.first {
	border-radius:20px;
	padding:15px !important;
	background-color:#d4ffdc !important;
	border:1px solid #ccc;
}
.footercaducados {
	position:fixed;
	bottom:0px !important;
	width:100%;
	background-color:red;
	color:white;
	padding:10px;
	text-align:center;
	z-index:9999;
}

.container {
	
	
}
.listEventos .container {
	padding-bottom:20px !important;
}

.gt_float_wrapper {
	position:absolute !important;
}


.btnComprarEventos {
	margin-bottom:20px;
	margin-left:50%;
	transform:translateX(-50%);
}
.price-slider-_tipo select {
	border:1px solid #e6e6e6;
	height:45px;
}
input {
	background:#fff !important;
	border:1px solid #e6e6e6;
}
.product-list-price  span {
	font-weight:bold;
	color:black !important;
}
 .product-details-price span {
	font-weight:bold;
	color:black !important;
}
.shop-list-wrap .shop-list-content p {
    margin: 15px 0 20px;
}
.shop-list-content .tagEvent {
	Background-color:#888;
	color:white;
	padding:0px;
	 display: inline-block;
	border-radius:5px;
	font-size:14px;
	margin-bottom:4px;
	min-width:80px !important;
	width:auto !important;
	text-align:center;
}
.shop-list-content .tagEvent1 {
	Background-color:#888;
	color:white;
	padding:0px;
	 display: inline-block;
	border-radius:5px;
	font-size:14px;
	margin-bottom:4px;
	min-width:80px !important;
	padding-left:6px;
	padding-right:6px;
	width:auto !important;
	text-align:center;
}
#divHorarios .horario {
	Background-color:#bbb;
	color:white;
	padding:0px;
	 display: inline-block;
	border-radius:5px;
	font-size:16px;
	margin-bottom:4px;
	min-width:80px !important;
	width:80px !important;
	text-align:center;
	cursor:pointer;
}
#divHorarios .horario.active {
	Background-color:#000;
}

.shop-area .btnVolver {
	text-decoration:underline;
}

.fbold {
	font-weight:bold;
}
@media only screen and (min-width: 900px)  {
	.showQRInstalaciones {
		margin-left:50%;
		transform:translateX(-50%);
		
	}
	.eventFilters {
		position:fixed;
		width:20% !important;
	}
	
	#divZooms {
		display:none;
	}
	
	
	
}



@media only screen and (max-width: 900px)  {
	.btnComprarEventos {
		min-width:100% !important;
	}
	.listEventos .container {
		padding-bottom:0px !important;
	}
	.shop-list-content .btnComprar > a {
		width:100% !important;
		text-align:center;
		
	}
	.plannerDIV {
		overflow:scroll;
		
	}
	#divZooms {
		display:inline;
		position:fixed;
		z-index:999 !important;
	}
	.plannerBottom p {
		font-size:10px;
		padding:4px !important;
	}
	
	.eventFilters h4 {
		display:none;
	}
	.eventFilters .col-md-6 {
		width:100% !important;
	}
	
	#_fecha1 {
		display:none;
	}
	.btnBuscar {
		margin-top:-12px;
	}
	.eventFilters  .mb-20 {
		margin-bottom:0px !important;
	}
	.eventFilters .mt-25 {
		margin-top:0px !important;
	}
	form {
		margin-bottom:0px !important;
	}
	.sidebar-style {
		margin-top:0px !important;
	}
	
	.firstDate {
		display:none !important;
	}
	.filtroFechas {
		width:100% !important;
		position:relative !important;
		float:left !important;
		display:flex;
		padding:0px !important;
	}
	.filtroFechas .col-md-6 {
		width:50% !important;
	}
	
	.eventFilters #_texto {
		margin-top:-20px
	}
	
	.grand-totall{
		padding-left:7px !important;
		padding-right:7px !important;
		padding-top:10px !important;
		padding-bottom:0px !important;
		border:0px solid #ebebeb !important;
		margin-top:10px;
	}
	.titleTotal {
		display:none !important;
	}

}
.grand-totall{
	border:0px solid #ebebeb !important;
}
.titleTotal {
		display:none !important;
	}
	
.filtroFechas {
	width:100% !important;
	position:relative !important;
	float:left !important;
	display:inline-flex;
	flex-wrap:wrap;
	padding:0px !important;
}
.filtroFechas .col-md-6 {
	padding-left:0px !important;
	margin-bottom:12px;
	width:50% !important;
	
}
.filterTipo  {
	width:100% !important;
	position:relative !important;
	float:left !important;
	padding:0px !important;
	display:block !important;

	
}
.filterTipo.col-md-6 {
	
}

/* Eventos: overrides finales para que el collapse no herede el sidebar antiguo */
body.listEventos .shop-areapb-100 > .container-fluid > .row > .eventos-filter-collapse {
    display: block !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
}

body.listEventos .eventos-filter-toggle {
    appearance: none !important;
    -webkit-appearance: none !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-height: 54px !important;
    margin: 0 !important;
    padding: 0 58px 0 22px !important;
    border: 1px solid #dbe3f0 !important;
    border-radius: 16px !important;
    background: #ffffff !important;
    color: #17213d !important;
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    letter-spacing: 0.04em !important;
    line-height: 1.15 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    box-shadow: 0 14px 34px rgba(34, 47, 90, 0.10) !important;
    cursor: pointer !important;
}

body.listEventos .eventos-filter-toggle::after {
    content: "" !important;
    position: absolute !important;
    right: 22px !important;
    top: 50% !important;
    width: 10px !important;
    height: 10px !important;
    border-right: 2px solid #25328a !important;
    border-bottom: 2px solid #25328a !important;
    transform: translateY(-65%) rotate(45deg) !important;
    transition: transform 0.2s ease !important;
}

body.listEventos .eventos-filter-toggle[aria-expanded="true"]::after {
    transform: translateY(-35%) rotate(225deg) !important;
}

body.listEventos #eventosFilterCollapse,
body.listEventos #eventosFilterCollapse.show,
body.listEventos #eventosFilterCollapse.collapsing {
    width: 100% !important;
    max-width: 100% !important;
}

body.listEventos #eventosFilterCollapse > .eventos-filter-column,
body.listEventos #eventosFilterCollapse > .col-lg-3.eventos-filter-column {
    display: block !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.listEventos #eventosFilterCollapse .eventFilters {
    position: static !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 12px 0 0 !important;
    padding: 22px !important;
    float: none !important;
}

body.listEventos #eventosFilterCollapse .eventFilters h4,
body.listEventos #eventosFilterCollapse .eventFilters h4.pro-sidebar-title {
    display: block !important;
}

body.listEventos #eventosFilterCollapse .eventFilters #_fecha1,
body.listEventos #eventosFilterCollapse .eventFilters .firstDate {
    display: block !important;
}

body.listEventos #eventosFilterCollapse .eventFilters .pro-sidebar-search,
body.listEventos #eventosFilterCollapse .eventFilters .mt-25,
body.listEventos #eventosFilterCollapse .eventFilters .mb-20,
body.listEventos #eventosFilterCollapse .eventFilters form {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

body.listEventos #eventosFilterCollapse .eventFilters #_texto,
body.listEventos #eventosFilterCollapse .eventFilters .btnBuscar {
    margin-top: 0 !important;
}

body.listEventos #eventosFilterCollapse .filtroFechas {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

body.listEventos #eventosFilterCollapse .filtroFechas .col-md-6,
body.listEventos #eventosFilterCollapse .filterTipo,
body.listEventos #eventosFilterCollapse .filterTipo.col-md-6 {
    width: auto !important;
    max-width: none !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    float: none !important;
}

body.listEventos #eventosFilterCollapse .filterTipo {
    grid-column: 1 / -1 !important;
}

body.listEventos #eventosFilterCollapse .sidebar-widget {
    width: 100% !important;
}

@media only screen and (max-width: 767px) {
    body.listEventos .shop-areapb-100 > .container-fluid > .row > .eventos-filter-collapse {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    body.listEventos .eventos-filter-toggle {
        min-height: 50px !important;
        padding-left: 16px !important;
        padding-right: 48px !important;
        border-radius: 14px !important;
        font-size: 12px !important;
    }

    body.listEventos #eventosFilterCollapse .eventFilters {
        padding: 16px !important;
        border-radius: 18px !important;
    }

    body.listEventos #eventosFilterCollapse .filtroFechas {
        grid-template-columns: 1fr !important;
    }
}

.plannerBottom {
	position:fixed;
	bottom:0px;
	height:50px;
	width:100%;
	Background-color:black;
	
}
.plannerBottom p {
	color:white;
	padding:10px;
}
.plannerTop {
	position:fixed;
	top:5px;
	left:20px;
	
}

body.listEventos .plannerTop {
	top: 174px !important;
	right: 14px !important;
	bottom: auto !important;
	left: auto !important;
	flex-direction: column !important;
	transform: none !important;
}

.plannerTopRight {
	position:fixed !important;
	top:5px;
	right:20px;
}

.zonas  .seat i{
	font-size:12px !important;
	margin-left:50% !important;
	transform:translateX(-50%);
	margin-top:2px;
}

.zonas .seat.ocupado {
	border:0px solid #fff !important;
	opacity:0.3;
}
.btn-primary{
	background: #000000 !important;
}

.tableAsistencias table tbody tr.active {
	background-color:#befab1 !important;
}

.reserva-picker {
    max-width: 1120px;
    margin: 18px auto 34px;
    text-align: left;
}

.reserva-picker-panel {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.08);
    padding: 22px;
}

.reserva-picker-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    border-bottom: 1px solid #eef0f3;
    padding-bottom: 16px;
    margin-bottom: 18px;
}

.reserva-picker-kicker {
    display: block;
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.reserva-picker-head h2 {
    margin: 0;
    font-size: 24px !important;
    line-height: 1.2;
    color: #111827;
}

.reserva-picker-back,
.reserva-date-shortcut,
.reserva-slot-buy {
    border: 0;
    border-radius: 6px;
    min-height: 42px;
    padding: 10px 14px;
    font-weight: 700;
    cursor: pointer;
}

.reserva-picker-back {
    background: #f1f5f9;
    color: #334155;
}

.reserva-picker-controls {
    display: grid;
    grid-template-columns: minmax(220px, 320px) 1fr;
    gap: 10px 16px;
    align-items: end;
    margin-bottom: 18px;
}

.reserva-picker-controls label {
    grid-column: 1;
    color: #374151;
    font-weight: 700;
    margin: 0;
}

#reservaDateNative {
    grid-column: 1;
    height: 48px;
    border-radius: 6px;
    border: 1px solid #cbd5e1;
    font-size: 17px;
    padding: 8px 12px;
}

.reserva-picker-shortcuts {
    grid-column: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.reserva-date-shortcut {
    background: #e0f2fe;
    color: #075985;
}

.reserva-slots-status {
    color: #475569;
    font-weight: 700;
    margin-bottom: 12px;
}

.reserva-slots {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

.reserva-slot-card {
    display: grid;
    grid-template-columns: minmax(92px, 1fr) 172px;
    gap: 10px;
    align-items: center;
    border: 1px solid #e2e8f0;
    border-left-width: 4px;
    border-radius: 7px;
    padding: 9px 10px;
    background: #ffffff;
    min-height: 58px;
}

.reserva-slot-card.is-free {
    border-left-color: #16a34a;
}

.reserva-slot-card.is-busy {
    border-left-color: #ef4444;
    background: #f8fafc;
    opacity: 0.82;
}

.reserva-slot-main {
    min-width: 0;
}

.reserva-slot-time {
    color: #0f172a;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.1;
    white-space: nowrap;
}

.reserva-slot-state {
    color: #64748b;
    font-size: 11px;
    font-weight: 700;
    margin-top: 2px;
}

.reserva-slot-actions {
    display: grid;
    grid-template-columns: 68px 96px;
    gap: 6px;
    align-items: center;
    justify-content: end;
}

.reserva-slot-actions label,
.reserva-slot-duration-help {
    display: none;
}

.reserva-slot-duration {
    grid-column: 1;
    min-height: 36px;
    height: 36px;
    border-radius: 6px;
    padding: 5px 8px;
    font-size: 14px;
}

.reserva-slot-buy {
    grid-column: 2;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    background: #16a34a !important;
    color: #ffffff !important;
    width: 96px;
    min-height: 36px;
    padding: 7px 10px;
    text-align: center;
    line-height: 1;
    white-space: nowrap;
    overflow: hidden;
}

.reserva-slot-badge {
    grid-column: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #fee2e2;
    color: #991b1b;
    border-radius: 6px;
    padding: 8px 10px;
    min-width: 96px;
    min-height: 36px;
    font-weight: 800;
    text-align: center;
    line-height: 1;
    white-space: nowrap;
}

@media only screen and (max-width: 767px) {
    .reserva-picker {
        margin: 8px auto 24px;
        padding: 0 8px;
    }

    .reserva-picker-panel {
        padding: 14px;
        border-radius: 8px;
        box-shadow: none;
    }

    .reserva-picker-head {
        display: grid;
        gap: 12px;
    }

    .reserva-picker-head h2 {
        font-size: 20px !important;
    }

    .reserva-picker-controls {
        grid-template-columns: 1fr;
    }

    .reserva-picker-controls label,
    #reservaDateNative,
    .reserva-picker-shortcuts {
        grid-column: 1;
    }

    .reserva-date-shortcut {
        flex: 1 1 30%;
    }

    .reserva-slot-card {
        grid-template-columns: minmax(104px, 1fr) 168px;
        padding: 8px 10px;
    }

    .reserva-slot-actions {
        grid-template-columns: 64px 98px;
        gap: 5px;
    }

    .reserva-slot-buy {
        min-height: 36px;
        width: 98px;
        padding-left: 7px;
        padding-right: 7px;
    }

    .reserva-slot-duration {
        padding-left: 6px;
        padding-right: 6px;
    }

    .reserva-slot-time {
        font-size: 16px;
    }
}

/* =====================================================
   CALENDARIO SaaS PRO · RESERVAS
   ===================================================== */

/* -------------------------
   CONTENEDOR GENERAL
-------------------------- */
#calendar {
    max-width: 1320px;
    margin: 0 auto !important;
    padding: 16px 18px 28px !important;
    box-sizing: border-box !important;
}

.fc,
.fc-view-container,
.fc-view,
.fc-view>table {
    font-family: "Inter", "Segoe UI", Arial, sans-serif !important;
}

/* -------------------------
   CABECERA SUPERIOR PRO
-------------------------- */
.fc-toolbar.fc-header-toolbar {
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    align-items: center !important;
    gap: 16px !important;

    margin: 0 0 18px 0 !important;
    padding: 18px 20px !important;

    background: rgba(255,255,255,0.96) !important;
    border: 1px solid #e7edf7 !important;
    border-radius: 22px !important;
    box-shadow: 0 14px 34px rgba(20, 33, 61, 0.07) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* grupos */
.fc-left,
.fc-center,
.fc-right {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    float: none !important;
    margin: 0 !important;
}

.fc-center {
    justify-content: center !important;
    flex-wrap: wrap;
}

/* título principal */
#titleCalendarView,
.fc-toolbar h2 {
    margin: 0 !important;
    color: #14213d !important;
    font-size: 18px !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    letter-spacing: -0.02em;
    text-align: center !important;
}

/* subtítulo de rango */
.fc-center {
    color: #64748b !important;
    font-size: 13px !important;
    font-weight: 600 !important;
}

/* -------------------------
   BOTONES PRO
-------------------------- */
.fc button,
.fc-button,
.fc-state-default {
    appearance: none !important;
    border: 1px solid #d8e1ef !important;
    background: #ffffff !important;
    color: #243056 !important;

    height: 42px !important;
    min-width: 42px !important;
    padding: 0 14px !important;
    margin: 0 !important;

    border-radius: 12px !important;
    box-shadow: 0 4px 10px rgba(20, 33, 61, 0.04) !important;

    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-transform: none !important;

    transition: all 0.18s ease !important;
}

.fc button:hover,
.fc-button:hover {
    background: #f8fbff !important;
    border-color: #c7d4ea !important;
    transform: translateY(-1px);
    box-shadow: 0 8px 18px rgba(20, 33, 61, 0.08) !important;
}

.fc button:focus,
.fc-button:focus {
    outline: none !important;
    box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.10) !important;
}

/* activo */
.fc-button-active,
.fc button.active,
.fc-state-active {
    background: linear-gradient(135deg, #4f46e5 0%, #06b6d4 100%) !important;
    color: #ffffff !important;
    border-color: transparent !important;
    box-shadow: 0 10px 22px rgba(79, 70, 229, 0.20) !important;
}

/* prev / next */
.fc-prev-button,
.fc-next-button {
    padding-left: 12px !important;
    padding-right: 12px !important;
}

/* hoy */
.fc-today-button {
    font-weight: 800 !important;
}

/* -------------------------
   CAJA DEL CALENDARIO
-------------------------- */
.fc-view-container {
    background: #ffffff !important;
    border: 1px solid #e7edf7 !important;
    border-radius: 24px !important;
    overflow: hidden !important;
    box-shadow: 0 16px 38px rgba(20, 33, 61, 0.06) !important;
}

/* tabla general */
.fc table {
    border-collapse: separate !important;
    border-spacing: 0 !important;
}

.fc-view.fc-timeGridWeek-view,
.fc-view.fc-timeGrid-view,
.fc-view.fc-basicWeek-view {
    background: #ffffff !important;
}

/* -------------------------
   CABECERA DE DÍAS
-------------------------- */
.fc-head-container,
.fc-head,
.fc-head table {
    background: #f8fafc !important;
}

.fc th {
    padding: 12px 8px !important;
    background: #f8fafc !important;
    color: #334155 !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    border-color: #e9eff7 !important;
}

/* hoy en cabecera */
.fc-day-header.fc-today {
    background: linear-gradient(180deg, #eef4ff 0%, #f8fbff 100%) !important;
    color: #243056 !important;
}

/* -------------------------
   COLUMNAS / CELDAS
-------------------------- */
.fc-time-grid-container,
.fc-scroller,
.fc-time-grid {
    background: #ffffff !important;
}

.fc td,
.fc th {
    border-color: #edf2f8 !important;
}

.fc-axis {
    width: 56px !important;
    color: #7b879f !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    background: #fbfcfe !important;
}

.fc-time {
    color: #8a95ab !important;
    font-size: 12px !important;
    font-weight: 700 !important;
}

.fc-slats td {
    height: 36px !important;
    border-color: #f1f5fa !important;
}

.fc-minor td {
    border-style: dotted !important;
}

/* hoy columna */
.fc-day.fc-today {
    background: rgba(79, 70, 229, 0.035) !important;
}

/* línea actual si existe */
.fc-now-indicator {
    border-color: #ef4444 !important;
}

/* -------------------------
   EVENTOS PRO
-------------------------- */
.fc-event,
.fc-time-grid-event,
.fc-v-event {
    border: none !important;
    border-radius: 12px !important;
    padding: 6px 8px !important;
    box-shadow: 0 8px 18px rgba(20, 33, 61, 0.10) !important;
    overflow: hidden !important;
    transition: transform 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease !important;
}

/* hover */
.fc-event:hover,
.fc-time-grid-event:hover,
.fc-v-event:hover {
    transform: translateY(-1px);
    box-shadow: 0 12px 24px rgba(20, 33, 61, 0.16) !important;
    filter: brightness(1.01);
}

/* reserva verde */
.fc-event[style*="rgb(144, 238, 144)"],
.fc-event[style*="lightgreen"],
.fc-event[style*="#90ee90"] {
    background: linear-gradient(135deg, #22c55e 0%, #4ade80 100%) !important;
    color: #ffffff !important;
}

/* curso / amarillo */
.fc-event[style*="rgb(255, 255, 153)"],
.fc-event[style*="#ffff99"],
.fc-event[style*="khaki"] {
    background: linear-gradient(135deg, #fde68a 0%, #facc15 100%) !important;
    color: #1f2937 !important;
}

/* azul si apareciera */
.fc-event[style*="rgb(147, 197, 253)"],
.fc-event[style*="#93c5fd"] {
    background: linear-gradient(135deg, #60a5fa 0%, #38bdf8 100%) !important;
    color: #ffffff !important;
}

.fc-event .fc-time {
    display: block !important;
    margin-bottom: 3px !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    opacity: 0.95;
}

.fc-event .fc-title {
    display: block !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    white-space: normal !important;
}

/* -------------------------
   SCROLL MÁS LIMPIO
-------------------------- */
.fc-scroller {
    overflow: auto !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(99, 102, 241, 0.25) transparent;
}

.fc-scroller::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.fc-scroller::-webkit-scrollbar-thumb {
    background: rgba(99, 102, 241, 0.22);
    border-radius: 999px;
}

.fc-scroller::-webkit-scrollbar-track {
    background: transparent;
}

/* -------------------------
   TÍTULOS EXTERNOS
-------------------------- */
#titleCalendarView {
    display: block !important;
    margin-bottom: 6px !important;
}

#titleCalendarView + * {
    text-align: center !important;
}

/* texto Paddle / ubicación */
body #titleCalendarView,
body h2#titleCalendarView {
    text-align: center !important;
}

body .title,
body .col-md-12.title {
    text-align: center !important;
}

/* -------------------------
   RESPONSIVE TABLET
-------------------------- */
@media (max-width: 991px) {
    #calendar {
        padding: 10px 10px 22px !important;
    }

    .fc-toolbar.fc-header-toolbar {
        grid-template-columns: 1fr !important;
        justify-items: center;
        padding: 16px !important;
        gap: 12px !important;
        border-radius: 18px !important;
    }

    .fc-left,
    .fc-center,
    .fc-right {
        justify-content: center !important;
        flex-wrap: wrap;
        width: 100%;
    }

    .fc-toolbar h2,
    #titleCalendarView {
        font-size: 17px !important;
    }

    .fc th {
        font-size: 12px !important;
        padding: 10px 4px !important;
    }

    .fc-axis {
        width: 48px !important;
        font-size: 11px !important;
    }

    .fc-event .fc-title {
        font-size: 11px !important;
    }
}

/* -------------------------
   RESPONSIVE MÓVIL PRO
-------------------------- */
@media (max-width: 600px) {
    #calendar {
        padding: 8px 0 18px !important;
    }

    .fc-toolbar.fc-header-toolbar {
        position: sticky;
        top: 76px;
        z-index: 20;
        margin: 0 10px 14px 10px !important;
        padding: 14px !important;
        border-radius: 16px !important;
        gap: 10px !important;
    }

    .fc-toolbar h2,
    #titleCalendarView {
        font-size: 16px !important;
        line-height: 1.2 !important;
    }

    .fc button,
    .fc-button,
    .fc-state-default {
        height: 38px !important;
        min-width: 38px !important;
        padding: 0 12px !important;
        border-radius: 10px !important;
        font-size: 12px !important;
    }

    .fc th {
        font-size: 11px !important;
        padding: 8px 2px !important;
    }

    .fc-axis {
        width: 40px !important;
        font-size: 10px !important;
    }

    .fc-slats td {
        height: 34px !important;
    }

    .fc-event,
    .fc-time-grid-event,
    .fc-v-event {
        border-radius: 10px !important;
        padding: 4px 5px !important;
    }

    .fc-event .fc-time {
        font-size: 10px !important;
        margin-bottom: 2px !important;
    }

    .fc-event .fc-title {
        font-size: 10px !important;
        line-height: 1.15 !important;
    }

    .fc-view-container {
        border-radius: 18px !important;
    }
}

/* -------------------------
   EXTRA: EFECTO MÁS SAAS
-------------------------- */
.fc-view-container::before {
    content: "";
    display: block;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(79, 70, 229, 0.18), transparent);
}