/** @format */
html {
  scroll-behavior: smooth;
}
body{
  position: relative;
}
#home p,
#contact p,
footer p {
  color: #f9f9f9;
}
.header{
  margin-bottom: 0;
}
.top-header{
  display: none;
}
#home p{
margin: 1rem 10rem;
  font-size: 3.5rem;
  filter: drop-shadow(-5px 2px 2px black);
}
.btn {
  border: none;
  border-radius: 4px;
  transition: all 0.4s ease-in-out;
}

.btn:focus {
  background: #e44c65;
  border-color: transparent;
}

.btn-success {
  background: #e44c65;
  font-weight: 300;
  letter-spacing: 2px;
  padding: 14px 32px;
  margin-top: 26px;
}

.btn-success:hover {
  background: #222;
}

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

*:before,
*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
section{
  padding-bottom: unset;
  padding-top: unset;
  margin-bottom: 1rem;
}
.section-title{
  background: linear-gradient(90deg, transparent 0%, rgb(189 190 192) 50%, transparent 100%);
  padding: 10px 0px;
  margin: 0px 10px;
  border-radius: 20px 20px 0px 0px;
  margin-top: 5px;
}

.section-header {
  text-transform: uppercase;
  margin-bottom: 0;
}
.text-header {
  color: green !important;
  font: 700 4em / 1 "Oswald", sans-serif;
  letter-spacing: 0;
  padding: 0.25em 0 0.325em;
  display: block;
  margin: 0 auto;
  text-shadow: -14px -12px 20px rgba(255, 255, 255, 0.5);
  background: url(https://i.ibb.co/RDTnNrT/animated-text-fill.png) repeat-y;
  -webkit-background-clip: text;
  background-clip: text;
  /*-webkit-text-fill-color: #c9adad66;*/
  /*-webkit-animation: aitf 80s linear infinite;*/
  /*-webkit-transform: translate3d(0, 0, 0);*/
  /*-webkit-backface-visibility: hidden;*/
  /*filter: hue-rotate(93deg);*/
}

@-webkit-keyframes aitf {
  0% {
    background-position: 0% 50%;
  }
  100% {
    background-position: 100% 50%;
  }
}

#about .section-title h1 {
  margin-bottom: 0px;
  padding-bottom: 0px;
}
.section-title h1{
  text-transform: unset;
}
.btn-join{
  text-align: center;
  text-transform: capitalize;
  padding:10px;
  text-decoration: none;
  border-radius: 20px;
  background: #58B848;
  color: #fff;
  filter: drop-shadow(2px 4px 6px black);
  margin: 1rem 0;
}
.btn-join:hover {
  color: black;
  filter: drop-shadow(1px 5px 5px black);
}
ul{
  padding-left: unset;
}
.mobile-cart{
  display: none;
}
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  display: none;
  justify-content: center;
  align-items: center;
  background-color: rgba(0, 0, 0, 0.5);
}
.header_modal{
  position: relative;
  background: #58b848a6;
  padding: 2px;
  text-align: center;
  color: white;
}
.header_modal h3{
  filter: drop-shadow(2px 4px 6px black);
}
.btn-secondary{
  font-size: 12px;
  background: #5f84a5;
}
.btn-secondary:hover {
  color: #fff;
  background-color: #67915f;
  border-color: #54b941;
}
.show>.btn-secondary.dropdown-toggle {
  color: #fff;
  background-color: #67915f;
  border-color: #54b941;
}
.dropdown-menu{
  font-size: 12px;
  transform: translate3d(0px, -122px, 0px) !important;
}
.pagination-teajack{
  position: absolute;
  bottom: 0;
}
.pagination-sm li{
  margin: 0 20px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  background: #5f84a5;
  color: white;
  border-radius: 50%;
  cursor: pointer;
}
.container_section{
  display: flex;
  height: 600px;
}
.header_modal h2{
  color: white;
}
.modal_video{
  padding: 2.5rem;
  display: none;
  align-items: center;
  justify-content: center;
  width: 50%;
  position: absolute;
  top: 0%;
  left: 50%;
  transform: translateX(-50%);
  z-index: 20;
  background: #000000c2;
}
.modal_products {
  position: absolute;
  border-radius: 20px;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  width: 90%;
  /*background: url("https://newshadrinks.com/videos/newshaDrinks/Landing-Page/double-bubble-outline.png");*/
  background: url("https://newshadrinks.com//Newshadrinks/img/subtle_grunge.webp");
}
.modal_products ul{
  padding: 1rem 25px;
}
#highlight_list li::marker {
  color: #1ac61a;
}
#Challenge_list li::marker {
  color:#60666c;
}
.modale_details h4{
  background: #58b848;
  color: #ffffff;
  text-align: center;
  padding: 5px;
  font-size: 1.25rem !important;
}
.modal_products ul li{
  display: list-item;
  list-style-position: outside;
}
.close_wrapper{
  position: absolute;
  z-index: 10;
  position: absolute;
  top: 50%;
  left: 5px;
  transform: translateY(-50%);
}
.close_button{
  margin: 0.5rem;
  cursor: pointer;
  fill: #ffffff;
}

#gallery,
#contact {
  text-align: center;
}


.advantage{
  background: linear-gradient(180deg, rgba(219, 219, 219, 1) 0%, rgba(219, 219, 219, 1) 35%, rgba(249, 249, 249, 1) 50%, rgb(224 224 224) 80%, rgb(224 224 224) 100%);
  border-radius: 10px;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  filter: drop-shadow(2px 4px 6px black)
}

.overlay {
  background: #304352;
  opacity: 0.9;
  position: absolute;
  width: 100%;
  height: 100vh;
  top: 0;
  left: 0;
  right: 0;
}
.swiper-button-next, .swiper-button-prev{
  justify-content: center;
  align-items: center;
  background: white;
  width: 35px !important;
  height: 35px !important;
  border-radius: 50%;
  z-index: 1000!important;
  top: var(--swiper-navigation-top-offset,62%)!important;
}
.swiper-button-next:after, .swiper-button-prev:after {
  font-size: inherit !important;
  color: #58B848 !important;
  font-weight: bolder;
}
.swiper-button-prev {
  left: var(--swiper-navigation-sides-offset, 3px) !important;
  right: auto;
}
.swiper-button-next{
  right: var(--swiper-navigation-sides-offset, 3px) !important;
  left: auto;
}
.container_content {
  position: relative;
  width: 100%;
}

#home {
  padding: 0;
  position: relative;
  overflow: hidden;
}
.swiper-slide-baner{
  width: 100% !important;
}
.swiper-slide-baner video{
  object-fit: cover;
  width: 100%;
  height: 100%;
}
.text-box{
  position: absolute;
  top:15%;
  left: 50%;
  z-index: 10;
}
#text-blend{
  font-size: 5rem;
}
.text-box p {
  color:#4ed75b !important;
  font-weight: 700;
}
.video_tag{
  display: flex;
  align-items: center;
  cursor:pointer;
  position: absolute;
  padding: 1rem 2rem;
  background:#00000059;
  border-radius: 3rem;
  top: 80%;
  left: 5%
}
.login_tag{
  position: absolute;
  padding: 4rem 4rem;
  background: #f8efef7d;
  border-radius: 20px;
  top: 50%;
  right: 10%;
  transform: translateY(-50%);
}
.btn__login{
  padding: 0.5rem 2rem;
  background: #55B24E;
  color: white;
  border-radius: 20px;
  margin-top: 2rem;
  outline: none;
  border: none;
  text-transform: uppercase;
  font-weight: bold;
  filter: drop-shadow(2px 4px 6px black);
}
.content__login{
  display: flex;
  flex-direction: column;
  align-items: center;
}
.content__login h2{
  color: #55b24e !important;
  font-size: 24px;
  font-weight: 700;
}
.content__login p{
  margin-bottom: unset;
}
.input_login{
  padding: 10px 40px;
  border-radius: 20px;
  filter: drop-shadow(2px 4px 6px black);
  border: none;
  outline: none;
  font-size: 12px;
  margin-top: 2rem;
}

#home h1 {
  color: #ffffff;
}

#home .col-md-8 {
  padding-left: 62px;
}

#about {
  background: url("https://newshadrinks.com//Newshadrinks/img/subtle_grunge.webp");
}
.slide-image{
  display: flex;
  justify-content: center;
  align-items: center;
}
.icon-hover{
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1rem;
  border-radius: 50%;
}
.icon-hover img{
  cursor: pointer;
  width: 80%;
  border-radius: 50%;
  max-width: 200px;

  filter: hue-rotate(315deg) drop-shadow(2px 4px 6px black);
}
.button_details {
  position: absolute;
  top: 50%;
  left: 50%;
  background:#113203db;
  border-radius: 50%;
  border: none;
  outline: none;
  color: white;
  font-weight: 600;
  width: 150px;
  height: 150px;
  padding: 5px;
  opacity: 0;
  transform:translate(-50%, -50%) scale(0);
  -webkit-transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transition: all 600ms cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.icon-hover:hover .button_details{
    opacity: 1;
    transform:translate(-50%, -50%) scale(1);
}

#gallery .gallery-thumb {
  background-color: #ffffff;
  box-shadow: 0px 1px 2px 0px rgba(90, 91, 95, 0.15);
  cursor: pointer;
  display: block;
  margin-bottom: 25px;
  position: relative;
  top: 0px;
  transition: all 0.4s ease-in-out;
}

#gallery .gallery-thumb:hover {
  box-shadow: 0px 16px 22px 0px rgba(90, 91, 95, 0.3);
  top: -5px;
}

#gallery .gallery-thumb img {
  border-top-right-radius: 2px;
  border-bottom-left-radius: 2px;
  width: 100%;
}

#contact {
  background-image: url(https://newshadrinks.com/videos/newshaDrinks/Landing-Page/baner_bottom-new-6.png);
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  height: 50vh;
}

#contact .form-control {
  background: transparent;
  box-shadow: none;
  border: 1px solid #f9f9f9;
  color: #ccc;
  font-size: 20px;
  margin-top: 10px;
  margin-bottom: 14px;
  transition: all 0.4s ease-in-out;
}

#contact .form-control:focus {
  border-color: #e44c65;
  color: #ffffff;
}

#contact input {
  height: 55px;
}

#contact input[type="submit"] {
  background: #e44c65;
  border: none;
  color: #ffffff;
  font-weight: 400;
  letter-spacing: 1px;
}

#contact input[type="submit"]:hover {
  background: #222;
  color: #ffffff;
}

@media (max-width: 980px) {
  #about .team-thumb {
    margin-top: 55px;
  }
  #home p{
    margin: 1rem;
  }
}

@media (max-width: 767px) {
  #about .about-thumb {
    padding: 32px;
    margin-bottom: 32px;
    text-align: center;
  }
  .text-header {
    font: 700 2em / 1 "Oswald", sans-serif;
  }
  .swiper-slide-baner video{
    height: unset;
  }
  .text-box{
    top: 0;
    left: 50%;
  }
  #text-blend {
    font-size: 2rem;
  }
  .text-box p{
    margin: 1rem 2rem !important;
    font-size: 1.5rem !important;
  }
  .icon-hover img {
    width: 50%;
  }
  .swiper-slide-baner{
    height: unset;
  }
  .swiper-slide-baner{
    height: 100%;
  }
  #about .col-md-3 img {
    position: relative;
    top: 0;
    left: 0;
  }
  .modale_details{
    min-height: 300px;
  }
}

@media (max-width: 650px) {
  h1 {
    font-size: 1.6rem;
  }

  p {
    font-size: 18px;
  }

  img {
    width: 100%;
  }
}
.three-box{
  position: absolute;
  border-radius: 20px;
  -webkit-box-shadow: inset 0px 0px 15px 5px rgba(0,0,0,0.51);
  box-shadow: inset 0px 0px 15px 5px rgba(0,0,0,0.51);
  padding: 0;
  overflow: hidden;
  top: 0;
  left: 0;
  width: 100%;
}
#video-box{
  background: #e5e5e5;
  /*height: 340px;*/
}
.backDrop{
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #000000c2;
  opacity: 0;
  transition: all 0.5s;
}
.backDrop a{
  transform: scale(0);
  transition: all 0.5s;
}
.hover-container:hover{
  .backDrop{
    opacity: 1
  }
  .backDrop a{
    transform: scale(1);
  }
}
.backDrop a{
  font-size: 24px;
  border: 1px solid white;
  color: white;
  padding: 2rem;
  cursor: pointer;
}
#gallery .container .row{
--bs-gutter-x: 0;
margin: 1rem 0;
}
#gallery .container .swiper-baner{
filter: drop-shadow(2px 4px 6px black);
height: 400px;
border-radius: 20px;
overflow: hidden;
}
.swiper-package{
  border-radius: 20px;
  filter: drop-shadow(2px 4px 6px black);
}
.swiper-slide-catalog figure {
margin: 0;
position: relative;
height: 100%;
}

.swiper-slide-catalog figure img {
width: 100%;
height: 100%;
display: block;
position: relative;
}

.swiper-slide-catalog figcaption {
position: absolute;
top: 0;
left: 0;
padding:0 22px;
background: #212426;
color: #148e13;
padding: 20px;
}

.swiper-slide-catalog figcaption h1 {
font-size: 1.6rem;
text-transform: capitalize;
line-height: 2.2rem;
margin: 0;
padding-bottom: 12px;
color: #58B848;
}

.swiper-slide-catalog figcaption small {
font-size: 16px;
letter-spacing: 1px;
color: white;
  margin-bottom: 55px;
}

.swiper-slide-catalog figcaption a {
text-align: center;
text-transform: capitalize;
padding: 12px;
border-radius: 2px;
display: inline-block;
background: #58B848;
color: #fff;
}
.swiper-slide-catalog figure > div {
height: 100%;
overflow: hidden;
}

.swiper-slide-catalog figure img {
-webkit-transition: -webkit-transform 0.4s;
-moz-transition: -moz-transform 0.4s;
transition: transform 0.4s;
}
.swiper-slide-catalog figcaption {
height: 100%;
width: 35%;
opacity: 0;
-webkit-backface-visibility: hidden;
-moz-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform-origin: 0 0;
-moz-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: rotateY(-90deg);
-moz-transform: rotateY(-90deg);
transform: rotateY(-90deg);
-webkit-transition: -webkit-transform 0.4s, opacity 0.1s 0.3s;
-moz-transition: -moz-transform 0.4s, opacity 0.1s 0.3s;
transition: transform 0.4s, opacity 0.1s 0.3s;
}

.swiper-slide-catalog figcaption a {
position: absolute;
width: 70%;
border-radius: 20px;
text-decoration: none;
bottom: 30px;
right: 50%;
transform: translateX(50%);
font-weight: 700;
  box-shadow: inset 0px 0px 8px 1px rgb(24 22 22 / 75%);
}
.slide-hover{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  width: 100%;
  height: 100%;
  background: #f9f9f97d;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transition:all 0.5s;
}
.slide-hover a{
  background: #3ba345;
  width: 70px;
  height: 70px;
  color: white;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  scale: 0;
  transition:all 0.5s;
}
.slider-under {
    position: relative;
    height: 400px;
    background: #cdd7d426;
    display: flex;
    justify-content: end;
    border-radius: 20px;
    overflow: hidden;
    filter: drop-shadow(2px 4px 6px black);
    padding: 0 1rem;
}
.slider-under video{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.slider-tags, .video-blends{
  margin-top: 1rem;
  border-radius: 20px;
  overflow: hidden;
  filter: drop-shadow(2px 4px 6px black);
}
.video-blends {
  background: linear-gradient(180deg, rgb(229 229 229) 0%, rgb(233 233 233) 35%, rgba(249, 249, 249, 1) 50%, rgb(224 224 224) 100%);
}
  .slider-tags-right{
  background: linear-gradient(180deg, rgba(219, 219, 219, 1) 0%, rgba(219, 219, 219, 1) 35%, rgba(249, 249, 249, 1) 50%, rgb(224 224 224) 80%, rgb(224 224 224) 100%);
}
#video-tags {
  width: 100%;
}
#swiper-packaging {
  max-width: 400px;
}
.swiper-packaging-img .swiper-wrapper .swiper-slide-active:hover{
  .slide-hover{
    opacity: 1;
  }
  .slide-hover a{
    scale: 1;
  }
}
@media (min-width: 756px) {
  .swiper-boxes .swiper-wrapper .swiper-slide{
    margin-right: 0!important;
  }
  .swiper-boxes .swiper-wrapper{
    gap: 5px;
  }
}

@media (max-width: 980px) {
.swiper-slide-catalog figcaption h1 {
  font-size: 1rem;
  line-height: 1.6rem;
}
.swiper-slide-catalog figcaption {
  padding: 28px 18px;
}
}

@media screen and (max-width: 31.5em) {
/*.grid {*/
  /*  padding: 10px 10px 100px 10px;*/
  /*}*/
  .grid li {
    width: 100%;
    min-width: 300px;
  }
}
.owl-theme .owl-controls {
  margin-top: 10px;
  text-align: center;
}

.owl-theme .owl-controls .owl-buttons div {
  color: #fff;
  display: inline-block;
  zoom: 1;
  display: inline;
  margin: 5px;
  padding: 3px 10px;
  font-size: 12px;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  border-radius: 30px;
  border: 2px solid #999;
  filter: Alpha(Opacity=50);
  opacity: 0.5;
}

.owl-theme .owl-controls.clickable .owl-buttons div:hover {
  filter: Alpha(Opacity=100);
  opacity: 1;
  text-decoration: none;
}

.owl-theme .owl-controls .owl-page {
  display: inline-block;
  zoom: 1;
  display: inline;
}
.owl-theme .owl-controls .owl-page span {
  display: block;
  width: 16px;
  height: 6px;
  margin: 5px 7px;
  filter: Alpha(Opacity=50);
  opacity: 0.5;
  background: #304352;
  margin-top: 12px;
}

.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span {
  filter: Alpha(Opacity=100);
  opacity: 1;
}

.owl-theme .owl-controls .owl-page span.owl-numbers {
  height: auto;
  width: auto;
  color: #fff;
  padding: 2px 10px;
  font-size: 12px;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  border-radius: 30px;
}

.owl-carousel {
  display: flex;
  position: relative;
  width: 100%;
  -ms-touch-action: pan-y;
}
.owl-carousel .owl-wrapper {
  display: none;
  position: relative;
  -webkit-transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-wrapper-outer {
  overflow: hidden;
  position: relative;
  width: 100%;
}
.owl-carousel .owl-wrapper-outer.autoHeight {
  -webkit-transition: height 500ms ease-in-out;
  -moz-transition: height 500ms ease-in-out;
  -ms-transition: height 500ms ease-in-out;
  -o-transition: height 500ms ease-in-out;
  transition: height 500ms ease-in-out;
}

.owl-carousel .owl-item {
  float: left;
}
.owl-controls .owl-page,
.owl-controls .owl-buttons div {
  cursor: pointer;
}
.owl-controls {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.owl-carousel .owl-wrapper,
.owl-carousel .owl-item {
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
}
.container_imgModal{
  position: relative;
  display: flex;
  width: 100%;
  height: 100%;
  overflow: hidden;
  align-items: center;
  justify-content: center;
}
.modale_img{
  width: 50%;
  min-width: 500px;
  max-width: 500px;
  filter: drop-shadow(2px 4px 6px rgba(0,0,0,0.7));
}
.feature_wrraper{
  width: 50%;
  height: 100%;
  position: absolute;
  min-width: 500px;
  max-width: 500px;
  min-height: 500px;
  max-height: 500px
}
.spiner {
  position: absolute;
  top: 34%;
  width: 3rem;
  transform-origin: center;
  animation: rotate4 2s linear infinite;
}


.swiper-slide-catalog figcaption p {
  color: #098409;
  font-weight: bold;
  font-size: 22px;
}


circle {
  fill: none;
  stroke: hsl(214, 97%, 59%);
  stroke-width: 2;
  stroke-dasharray: 70, 100;
  stroke-dashoffset: 0;
  stroke-linecap: round;
  animation: dash4 1.5s ease-in-out infinite;
}
@keyframes rotate4 {
  100% {
    transform: rotate(360deg);
  }
}
.hide_spiner {
  display: none!important;
}
@media screen and (max-width: 756px) {

  .swiper-slide-catalog figcaption p {
    font-size: 17px;
  }

  .swiper-slide-catalog figcaption small{
    font-size: 14px;
  }

  .swiper-button-next, .swiper-button-prev{
      top: var(--swiper-navigation-top-offset, 70%) !important;
  }

  .swiper-slide-catalog figcaption {
    width:70%;

  }


    #video-box{
    /*height: 304.63px;*/
  }
  .login_tag{
    right: 50%;
    transform: translateX(50%);
    top: 10%;
  }
  .video_tag{
    left: 50%;
    transform: translateX(-50%);
  }
  .modal_products{
    width: 100%;
  }
  .container_section{
    flex-direction: column;
    overflow-y: scroll;
  }
  .modal_video{
    width: 100%;
  }
  #gallery .container .row {
    padding: 0 12px;
  }

  .swiper-package{
    height: 360px;
  }
  .swiper-boxes{
    margin-bottom: 1rem;
  }
}