*{
   margin: 0;
   padding: 0;
    font-family: 'Poppins', sans-serif;
}


html{
    scroll-behavior:smooth;
    overflow-x: hidden;
}

body {
  user-scalable:no;
    overflow-x: hidden;
}

.header{
    min-height: 100vh;
    width: 100%;
    background-position: center;
    background-size: cover;
    position: relative;  
}





.wrapper {
  position: absolute;
  width: 100%;
    z-index: -1;
}

.gradient {
  background-image: linear-gradient(rgba(4,9,30,0.7),rgba(4,9,30,0.7));
  width: 100%;
  height: calc(100vh - 80px);
  min-height: 100vh;
  object-fit: cover;
  position: relative;
  z-index: 0;

}


.wrapper:after {
  content  : "";
  position : absolute;
  z-index  : 0;
  bottom   : 0;
  left     : 0;
  pointer-events   : none;
  background-image : linear-gradient(to bottom, 
                    rgba(20,20,20, 0), 
                    rgba(20,20,20, 1) 90%);
  width    : 100%;
  height   : 2em;
}

body{
    background: #141414;
       
}
body {
    animation: fadeInAnimation ease 1s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards;
}
@keyframes fadeInAnimation {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
        }

.lp nav{
    display:flex;
    justify-content:space-between;
    align-items:center;
    z-index: 3;
    padding: 0% 6%;

}
.oth nav{
    display:flex;
    justify-content:space-between;
    align-items:center;
    z-index: 5;
        border-bottom: 1.5px solid #333333;
    background:  transparent;
    padding: 0% 6%;
}


h16{
    
    font-size: 22px;
    font-weight: 700;
}

.cart a{
    font-size: 16px;
    margin-top: 15px;
    font-weight: 400;
    color: white;
    background: black;
    box-shadow: 0 0 10px black; 
}

nav img{
    width: 150px;
    position: relative;

}

.oth nav img{
    width: 115px;
    position: relative;
    padding: 2px 9px 2px 0px;
    
}

.oth{
    min-height: 90vh !important;
}

.nav-links{
    flex: 1;
    text-align: right;
    
    
}

.nav-links ul li{
    list-style: none;
    display: inline-block;
    padding: 8px  12px;
    position: relative;
    
}
.nav-links ul li a{
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    
}
.nav-links ul li::after{
    content: '';
    width: 0%;
    height: 2px;
    background: goldenrod;
    display: block;
    margin: auto;
    transition:0.5s;

}

.nav-links ul li:hover::after{
    width: 100%;
    
}
.text-box-1{
    width: 90%;
    color:white;
    position: absolute;
    top: 50%;
    left: 57%;
    transform: translate(-50%,-50%);
    text-align: left;
    font-size: 45px;
    animation: fadeIn 2s;
    -webkit-animation: fadeIn ease 2s;
    -moz-animation: fadeIn ease 2s;
    -o-animation: fadeIn ease 2s;
    -ms-animation: fadeIn ease 2s;
}
@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-moz-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-webkit-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-o-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@-ms-keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

.text-box-2{
    
    width: 90%;
    color: white;
    position: absolute;
        bottom: 5%;
    margin-bottom: 3%;
    left: 50%;
    transform: translate(-50%,-50%); text-align: center;    
}
.ca3-scroll-down-arrow{
    position: absolute;
    top: 50%;
    
}
.hero-btn{
    display: inline-block;
    text-decoration: none;
    color: gainsboro;
    border: 1.5px solid #fff;
    padding: 8px 18px;
    font-size: 13px;
    background:  transparent;
    position: relative;
    cursor: pointer;
    border-radius: 4px;

}
.hero-btn{
    transition: 0.5s ease;
    
}
.hero-btn:hover{
    border: 1.5px solid goldenrod;
    color: goldenrod;
    border: 1.5px solid goldenrod;
    
}



.#Products{
    
    transition-delay: 0.5s;
}


nav .fa-minus{
    display: none;
}
nav .fa-bars{
    display: none;
}

.fa-bag-shopping{
    color: white;
    font-size: 15px;
}





/*-----shop-----*/

.Products{
    min-height: 65vh;
    width: 80%;
    margin: auto;
    text-align: center;
    padding-top: 100px;
    margin-bottom: 10%;
    
}
h2{
    font-size: 36px;
    font-weight: 600;
    color: white;
        
}
p{
   color: #C0C0C0;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    padding: 10px;   
}


h3{
    font-size: 20px;
    font-weight: 700;
    padding: 18px 0 13px 0;
    line-height: 5px;
}
.card{
    background: #fff;
    box-shadow: 0 0 15px rgba(255, 255, 255, 0.2);
    max-width: 270px;
    text-align: center;
    font-family: arial;
    border-radius: 6px;
}
.card{
    transition: box-shadow 0.3s ease;
}
.card:hover{
    box-shadow: 0 0 25px rgba(255, 255, 255, 0.25); 
}

.price{
  color: grey;
  font-size: 16px;
    line-height: 0;
    padding: 15px;
}

.product-price{

}

.card button {
  border: none;
  outline: 0;
  padding: 10px;
  color: white;
  background-color: #000;
  text-align: center;
  cursor: pointer;
  width: 100%;
  font-size: 18px;
  border-radius:6px;
  transition: 0.3s ease;
}

.card button:hover {
  opacity: 0.8;
  transition: 0.3s ease;
}
.card img{
	border-radius:6px 6px 0 0;
    box-shadow: 0 7px 8px rgba(0, 0, 0, 0.15);
}
h4{
    font-size: 20px;
    font-weight: 700;
    padding: 20px;
    line-height: 5px;
}


h5{
    font-size: 20px;
    font-weight: 700;
    padding: 20px;
    line-height: 5px;
}

.card{
    display: inline-block;
    margin: 15px;

}

h6{
    font-size: 16.5px;
    font-weight: 400;
    padding: 25px;
    line-height: 10px;
    color: gray;
    text-align: left;
}

 
.page-end{
    min-height: 20vh;
    width: 100%;
    background-color: black;
    background-position: center;
    background-size: cover;
    position: relative;
    text-align: left;
    padding-top: 25px; 
    
}
h7{
    color: darkgray;
    font-weight: 600;
}
.END{
    text-align:center;
}
    .footer-inner ul li{
    display: inline-table;
    

}
    .footer-inner ul li a{
    color: #fff;
    text-decoration: none;
    font-size: 14px;
}
.test{
    padding: 9px;
}
.test b{
    display: block;
}


.test li:not(:last-child){
    border-right: 1px solid gray;
    padding-right: 10px;
    padding-left: 8px;

    
}


.shop{
    min-height: 20vh;
    width: 100%%;
    margin: auto;
    text-align: center;
    padding-top: 2%;   
    margin-bottom: 10vh;

}
.products-1{
    width: 75%;
    margin: auto;
    text-align: center; 
}

h8{
    font-size: 35px;
    font-weight: 600;
    color: goldenrod;
    text-align: center;
}
.shop-text{
    border-bottom: 1.5px solid #333333;
    padding-bottom: 1.8%;
    width: 100;
    background: transparent;
  
}





h9{
    font-size: 36px;
    font-weight: 600;
    color: goldenrod;
    text-align: center;
      
}



.about{
    min-height: 110vh;
    width: 80%;
    margin: auto;
    text-align: center;

}
.about-top{
    width: 80%;
    min-height: 90vh;
    display: flex;
    align-items: center;
    vertical-align: middle;


}


.top-text{
    text-align: left;
    width: 45%;
    margin-right: 3%;
    display: inline-block;
}

.about-top i{
    padding: 7px;
    border-radius: 30px;
    background-color: #333333;
color: white;
    font-size: 20px;
    transition: 0.5s ease;
    margin-left: 10x;
}
.about-top i:hover{
color: #949494;
transition: 0.5s ease;

}



.about-bottom{

    min-height: 10vh;
    margin-bottom: 10vh;
    background-color: #333333;
    border-radius: 30px;
    padding: 0  10vh 15vh 10vh ;
}

.about-bottom p{

    font-size: 13px;
}

.bottom-marker{
    margin-bottom: 15vh;
    height: 5vh;
}

.about-bottom img{
    width: 105px;
    display: ;
    position: relative;
}





.contact{
    min-height: 112vh;
    width: 80%;
    margin: auto;
    padding-top: 30px;
    text-align: center;
}

h10{
    font-size: 36px;
    font-weight: 600;
    color: white;
}


.contact-text{
    padding-bottom: 30px;
}
.hero{
    display: flex;
    align-items: center;
    justify-content: center; 
    padding-top: 10px;
    padding-bottom: 10px;
    width: 50%;
    left: 25%;
    position: absolute;
}



input, textarea{
    padding: 10px;
    margin: 10px;
    outline: 0;
    color: black;
    background: #252525;
    font-size: 15px;
    width: 80%;
    transition: 0.3s ease;
    border-radius: 10px;
    border: 0px !important;
    
}

input:hover, textarea:hover{
    background: #343434;
    transition: 0.3s ease;
    
}

input:focus, textarea:focus{
    background:#353535;
    
}

input::placeholder, textarea::placeholder  {
    font-size: 14px; 
    color: #c0c0c0;
    padding-left: 6px;
    transition: 0.2s ease;
}

:focus::placeholder{ 
    color: #949494 !important;
    transition: 0.2s ease;
    

}
.submit{
    width: 83.5%;
    padding: 10px;
    transition: 0.4s ease;
    padding-left: 5%;
    padding-right: 5%;
    
}

.submit{
    color: #141414 !important;
    background-color: #c0c0c0;
}

.submit:hover{
    color: #141414 !important;
    background-color: #fff;
}

input:focus~label,input:valid~label,textarea:focus~label,textarea:valid~label{
    top: -35px;
    font-size: 14px;
}

h3,h4,h5{
    box-decoration-break: clone;
    text-decoration: none;
    color: black;
}
.fuck{
    text-decoration: none;
}


.product-page{
     min-height: 100px !important;
    margin: 0;
    padding-top: 110px;


    
}

.product{
            display: inline-block;
    float:left;
}


.oben{

    
}
.oben{

}

.line{
  content: "";
  background: #333333;
  bottom: 0;
  left: 0;
  height: 2px;
  width: 21.5%;
  margin-bottom: 25px;
}

.unten{

}


.h11{
    
    padding-bottom: 10px;
}

h11{
    font-weight: 500;
    font-size: 24px;
    color: #fff;

}

h12{
    font-weight: 400;
    font-size: 18px;
    color: aliceblue;

}

.desc{
    font-size: 12px;
    color: white;
   
}


.h13{
    padding-top: 30px;
    padding-bottom: 45px;

}

.sell{
    position: relative;
    top: -6px;
    border-radius: 4px !important;
    color: #000 !important;
    border: 1.5px solid #fff !important;
    background:  #fff !important;
    animation: none !important;
    font-weight: 600 !important;
    font-size: 13px;
}
.preset-pack-img{
    
    width: 100%;
    
}



.img{
    width: 75vh;
    padding: 20px;
}

.product .img{
    display: flex;
    justify-content: center;
    align-content: center;

    
}

.dots{
    z-index: 4;
    text-align: center;
}
.dots i{
    font-size: 12px;
    color: white;
    position: relative;
    top: -36px;

}

.arrowright{
        z-index: 4;
    position: relative;
    top: -14.5rem;
}

.fa-chevron-right{
      font-size: 22px;
    color: white;
    float: right;
    padding: 7px;
  
}
.text{

}





.nav-fix{
    position: fixed;
    width: 100%;
    background: #141414;
    z-index: 5;
    transition: 0.3s;
}




h14{
    font-size: 12px;
    color: gray;
}




    .space-sct{
        height: 75px;
}



.checkout{
    
    width: 22%;
    position: fixed;
    right: 0;
    z-index: 12;
    margin-top: 11%;
    
    
    
}

.popup{
    padding: 5px;
        border-radius: 8px 0 0 8px !important;
    padding-left: 20px !important;
    box-shadow: 0 0 8px black;
}
.popup p{
    padding-top: 1px !important;
    padding-left: 6px !important;
    padding-bottom: 5px;
    font-size: 12px;
}

.success .popup{
    border-left: 8px solid darkolivegreen;
    color: white;
    background: black;
    
}

.cancel .popup{
    border-left: 8px solid red;
    color: white;
    background: black;
    
}






h17{
    
    padding-top: 5px !important;
    padding-left: 5px;
    font-weight: 600;
    font-size: 20px;
}
 
button{
    padding: 10px 0;
    color: black;
    outline: none;
    background: transparent;
    border: 1px solid black;
    width: 100%;
    cursor: pointer;
    
}

.sell:hover{
    border: 1.5px solid #0091ea !important;
    background: #0091ea !important;
    color: black;
}

.sell:active {
  background: #0065d1 !important;
}

.sell:focus {
        background: #0091ea !important;
        border: 1.5px solid #0091ea !important;
}

.button__text {
  transition: all 0.2s;
}

.button--loading .button__text {
  visibility: hidden;
  opacity: 0;
}

.button--loading::after {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border: 4px solid transparent;
  border-top-color: #ffffff;
  border-radius: 50%;
  animation: button-loading-spinner 1s ease infinite;
}

@keyframes button-loading-spinner {
  from {
    transform: rotate(0turn);
  }

  to {
    transform: rotate(1turn);
  }
}


 

.button-seals{
    text-align: center;
    justify-content: inline-block;
    
}

.trust-seals{
    padding-top: 8px;717
    
}
.trust-seals img{
    padding-left: 4px;
}



.#more-info{
    
    transition-delay: 0.5s;
}

.#bottom-marker{
    
    transition-delay: 0.5s;
}

.scroll-btn{
    padding:8px 6px 6px 6px;
    color: gainsboro;
    background-color: transparent;
    border-radius: 30px;
    right: 1%;
    transform: translate(-50%,-50%); text-align: center; 
    position: absolute;
    bottom: 0%;
    box-shadow: 0 0 10px #000;
    z-index: 4;
    
}

html body [data-ca3_iconfont="ETmodules"]::before {
    font-family: "ETmodules";
}
[data-ca3_icon]::before {
    font-weight: normal;
    content: attr(data-ca3_icon);
}

.ca3-scroll-down-arrow {
	background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2hldnJvbl90aGluX2Rvd24iIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMjAgMjAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDIwIDIwIiBmaWxsPSJ3aGl0ZSIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBhdGggZD0iTTE3LjQxOCw2LjEwOWMwLjI3Mi0wLjI2OCwwLjcwOS0wLjI2OCwwLjk3OSwwYzAuMjcsMC4yNjgsMC4yNzEsMC43MDEsMCwwLjk2OWwtNy45MDgsNy44M2MtMC4yNywwLjI2OC0wLjcwNywwLjI2OC0wLjk3OSwwbC03LjkwOC03LjgzYy0wLjI3LTAuMjY4LTAuMjctMC43MDEsMC0wLjk2OWMwLjI3MS0wLjI2OCwwLjcwOS0wLjI2OCwwLjk3OSwwTDEwLDEzLjI1TDE3LjQxOCw2LjEwOXoiLz48L3N2Zz4=);
	background-size: contain;
	background-repeat: no-repeat;
}

.ca3-scroll-down-link {
  cursor:pointer;
	height: 21px;
	width: 28px;
	margin: 35px 0 0 -12px;
	line-height: 60px;
	position: absolute;
	left: 50%;
	bottom: 0px;
	color: #FFF;
	text-align: center;
	font-size: 70px;
	z-index: 100;
	text-decoration: none;
	text-shadow: 0px 0px 3px rgba(0, 0, 0, 0.4);

	-webkit-animation: ca3_fade_move_down 1.6s ease-in-out infinite;
	-moz-animation:    ca3_fade_move_down 1.6s ease-in-out infinite;
	animation:         ca3_fade_move_down 1.6s ease-in-out infinite;
}


/*animated scroll arrow animation*/
@-webkit-keyframes ca3_fade_move_down {
  0%   { -webkit-transform:translate(0,-20px); opacity: 0;  }
  50%  { opacity: 1;  }
  100% { -webkit-transform:translate(0,20px); opacity: 0; }
}
@-moz-keyframes ca3_fade_move_down {
  0%   { -moz-transform:translate(0,-20px); opacity: 0;  }
  50%  { opacity: 1;  }
  100% { -moz-transform:translate(0,20px); opacity: 0; }
}
@keyframes ca3_fade_move_down {
  0%   { transform:translate(0,-20px); opacity: 0;  }
  50%  { opacity: 1;  }
  100% { transform:translate(0,20px); opacity: 0; }
}

.player {
    position: relative;
    top: 0;
    object-fit: cover;
    border: 5px solid rgba(0,0,0,0.2);
    box-shadow: 0 0 20px rgba(0,0,0,0.2);
    font-size: 0;
    overflow: hidden;
    width: 100%;
  }
  
  /* This css is only applied when fullscreen is active. */
  .player:fullscreen {
    max-width: none;
    width: 100%;
  }
  
  .player:-webkit-full-screen {
    max-width: none;
    width: 100%;
  }

  
  .player__video {
    width: 100%;
  }
  
  .player__button {
    background: none;
    border: 0;
    line-height: 1;
    color: white;
    text-align: center;
    outline: 0;
    padding: 0;
    cursor: pointer;
    max-width: 50px;
  }
 
  .player__button i{ 
        transition: 0.2s ease;
  }
  
  .player__button i:hover {
    color: gainsboro;
    transition: 0.2s ease;
  }
  
  .player__slider {
    width: 10px;
    height: 30px;
  }
  
  .player__controls {
    display: flex;
    position: absolute;
    bottom: 0;
    width: 100%;
    transform: translateY(100%) translateY(-5px);
    transition: all .3s;
    flex-wrap: wrap;
    background: rgba(0,0,0,0.1);
    display:flex;
      justify-content:space-between;
      align-items:center;
    padding-bottom: 3px;
    
  }
  
  .player:hover .player__controls {
    transform: translateY(0);
  }
  
  .player:hover .progress {
    height: 9px;
  }

  
  .player__controls > * {
    flex: 1;
        z-index: 10;
  }
  button{
    
  }
  
  .progress {
    flex: 10;
    position: relative;
    display: flex;
    flex-basis: 100%;
    height: 5px;
    transition: height 0.3s;
    background: rgba(0,0,0,0.8);
    cursor: ew-resize;
    margin-bottom: 3px;
    box-shadow: 0px 5px 15px #000;
  }
  
  .progress__filled {
    width: 50%;
    background: #fff;
    flex: 0;
    flex-basis: 50%;
  }
  

  .player2 {
    position: relative;
    top: 0;
    object-fit: cover;
    border: 5px solid rgba(0,0,0,0.2);
    box-shadow: 0 0 20px rgba(0,0,0,0.2);
    font-size: 0;
    overflow: hidden;
    width: 100%;
  }
  
  /* This css is only applied when fullscreen is active. */
  .player2:fullscreen {
    max-width: none;
    width: 100%;
  }
  
  .player2:-webkit-full-screen {
    max-width: none;
    width: 100%;
  }

  
  .player__video2 {
    width: 100%;
  }
  
  .player__button2 {
    background: none;
    border: 0;
    line-height: 1;
    color: white;
    text-align: center;
    outline: 0;
    padding: 0;
    cursor: pointer;
    max-width: 50px;
  }
 
  .player__button2 i{ 
        transition: 0.2s ease;
  }
  
  .player__button2 i:hover {
    color: gainsboro;
    transition: 0.2s ease;
  }
  
  .player__slider2 {
    width: 10px;
    height: 30px;
  }
  
  .player__controls2 {
    display: flex;
    position: absolute;
    bottom: 0;
    width: 100%;
    transform: translateY(100%) translateY(-5px);
    transition: all .3s;
    flex-wrap: wrap;
    background: rgba(0,0,0,0.1);
    display:flex;
      justify-content:space-between;
      align-items:center;
    padding-bottom: 3px;
    
  }
  
  .player2:hover .player__controls2 {
    transform: translateY(0);
  }
  
  .player2:hover .progress2 {
    height: 9px;
  }

  
  .player__controls2 > * {
    flex: 1;
        z-index: 10;
  }
  
  .progress2 {
    flex: 10;
    position: relative;
    display: flex;
    flex-basis: 100%;
    height: 5px;
    transition: height 0.3s;
    background: rgba(0,0,0,0.8);
    cursor: ew-resize;
    margin-bottom: 3px;
    box-shadow: 0px 5px 15px #000;
  }
  
  .progress__filled2 {
    width: 50%;
    background: #fff;
    flex: 0;
    flex-basis: 50%;
  }
  
  

  footer{
    height: 30vh;
    background-color: #000;
    position: relative;
    z-index: 2;
  }


  .top-footer{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;

  }
  .top-footer img{
    width: 105px;
    display: ;
    position: relative;
    top: 10px;
  }


  .container-footer{
    display: block;
    text-align: center;

  }

  .slogan{
    font-weight: 600;
    font-size: 16px;
    padding-bottom: 5px !important;
    display: none;
  }


  .bottom-footer{
    bottom: 0;
    position: absolute;
    width: 95%;
    margin-left: 2.5%;
  }

  .bottom-footer p{
    font-size: 12.5px;
    color: #777575

  }
  .footer-nav a{
    text-decoration: none;
    color: #777575;
    font-size: 14px;

  }
  .footer-nav a:hover{

    color: rgb(190, 190, 190);


  }



  .footer-nav li{
    display: inline-block;
    padding: 0 10px 0 10px;

  }
  .footer-nav li:not(:last-child){
    
    border-right: 1px solid #343434;
  }

  .stripe{
    display: inline-table;
    top: 5.5px;
    position: relative;

  }

  .important p{
    display: inline-table;
    padding-bottom: 5px;
  }

  .important{
    position: relative;
    bottom: 5px;
  }
.footer-container-2{

    padding: 0 10px 10px 10px;
    margin-top: 5px;
    position: absolute;
    
}
.footer-nav{

    display: flex;
    justify-content: center;
}
.footer-container-3{
    padding-top: 5px;
    display: flex;
    justify-content: space-between;
    position: relative;


    
    }

    .footer-socials ul li{
    display: inline-table;
    }

    .fa-brands{
        font-size: 20px;
         color: #5b5a5a;
         padding: 5px;
         
     }

     .top-info{
        background-color: #fff;
        text-align: center;
        display: none;
    
    }
    
    .info-text{
        color: #000;
        font-size: 12px;
        padding: 4px !important;
        font-weight: 500;
        display: none;
    }
    
    .info-text a{
        color: #1a0dab !important;
    }

    .top-sale{
        

    }
    .sale{

        font-size: 16px;
        font-weight: 600;
        color: rgb(255, 255, 255);
        background-color: goldenrod;
        padding: 4px 6px 4px 6px;
        border-radius: 30px;
        box-shadow: 0 0 10px rgba(0, 0, 0, 0.482);
        width:30%;
        top: 10px;
        left: 64%;
        position: absolute;
    }

    .filltext{
    width: 80%;
    margin-left: 10%;
    margin-right: 10%;
    margin-top: 5%;
    
    
    }
    .subtext{
        display: inline-block;
        width: 49%;
    
        
        
    }

    .subtext p{

        padding: 0 !important;
        
        
    }
    .subheading{
        display: inline-block;
        width: 49%;
        margin-right: 2%;
        font-weight: 500;
        font-size: 40px;
        color: #FFF;
        
        
    }
    .subhero-btn{
        color: #000;
        border: 1.5px solid #FFF;
        padding: 6px 15px 6px 15px;
        border-radius: 4px;
        margin-top: 12px;
        font-size: 16px;
        transition: 0.5s ease;
        background-color: #fff;
        cursor: pointer;
        position: absolute;
        text-align: center;
    }

    .tp-above .subhero-btn{
        color: #000;
        border: 1.5px solid #FFF;
        padding: 6px 15px 6px 15px;
        border-radius: 4px;
        margin-top: 12px;
        font-size: 16px;
        transition: 0.5s ease;
        background-color: #fff;
        cursor: pointer;
        position: relative !important;
    }

    .shopping-cta .subhero-btn{

        width: auto !important;
        position: relative !important;
        top: 45px;
    }
    .subhero-btn{
        text-decoration: none;
        color: #000;
        text-align: center;
    }

    .top-hero-btn a{
        text-decoration: none;
    }

    .subhero-btn:hover{
  
        color: rgb(0, 0, 0);
        border: 1.5px solid goldenrod;
        padding: 6px 15px 6px 15px;
        border-radius: 4px;
        font-size: 18px;
        transition: 0.5s ease;
        background-color: goldenrod;
    }
    .gallery{
        width: 80%;
        margin-left: auto;
        margin-right: auto;
    }
    
    .gallery img{
        width: 100%;
    }
    .exp{
        width: 100%;
        margin-top: 10%;
        background-color: #000;
    }

    .transition-pack{
        width: 100%;
        position: relative;
  text-align: center;

    }

    .tp-background{
        width: 100%;
    }
    .transition-pack video{
        width: 100%;
        opacity: 0.3;
        z-index: -1;
    }
    .tp-above{
        position:absolute;
        text-align: center;
        top: 50%;
        left: 70%;
    
    }

    h21{
        font-size: 32px;
        font-weight: 700;
        color: #FFF;
    }

    .shopping-cta{
        height: 30vh;
        width: 100%;
        color: white;
        margin-top: 20vh;
text-align: center;
display: flex;
justify-content: center;
    }
    .top-hero-btn {
        position: relative;
    }

    h22{
        position: absolute;
        font-weight: 500;
        font-size: 30px;
    }



    .products-sect{
        width: 80%;
        margin-left: auto;
        margin-right: auto;
    }

    .transitions-sect,.bundle-sect{

        margin-top: 10%;
    }

    .product-item{
        display: inline-block;
        width: 49%;
        margin-right: 2%;
        font-weight: 500;
        font-size: 40px;
        color: #FFF;
    
    }

    .product-subtext h23{
        font-size: 20px !important;
    }


    .product-subtext{
        display: inline-block;
        width: 49%;

        top:50%;
        height: 100%;
    

    
        
        
    }

    .product-subtext p{

        padding: 0 !important;
        
        
    }

    .product-subtext-2{
  
    }
    .transitions-sect,.luts-sect,.bundle-sect{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    h23{
        color: white;
        font-size: 24px;
        
        
    }

    .transitions-sect .card{
        margin-left: 50%;

    }


    .bundle-sect{
        margin-bottom: 10%;
    }

    .productpage-parent{
        width: 90%;
        min-height: 100vh;
        margin-bottom: 10vh;
        padding-top: 12.5vh;
        margin-left: auto;
        margin-right: auto;
    }

    .fix-product-action{
        position: fixed;
        width: 25%;
        right: 0;
        margin-right: 15%;
        margin-top: 0;
        transition: all 1s ease;
        
    }

    .productpage{
        width: 40%;
        margin-left: 5%;
        margin-top: 10vh !important;
        padding-bottom: 20px !important;
        font-weight: 600;

    }

    .productpage p{
       padding: 0 !important;
       padding-top: 10px !important;
    }

 .productpage video{
        width: 100%;
    }

    .productpage img{
        border-radius: 4px;
        width: 100%;
        margin-bottom:5vh;
        margin-top:0;
    }

    .productpage .line{
        
        height: 2px;
        width: 8% !important;
        background: #fff;

    }

    .accordion{
        min-height: 30vh;
            width: 80%;
            margin: 0;
            display: flex;
            flex-direction: column;
        
            
               
        }
        
        .columns{
            max-width: 700px;
            margin-top: 2rem;
            padding-bottom: 1rem;
            border-bottom: 2px solid #333333;
            cursor: pointer;
            width: 80%;
            
            
        }
        
        .column{
            display: flex;
            justify-content: space-between;
            align-items: center;
            
        }
        
        .column h18{
            font-size: 17px;
            color: #c0c0c0;
            font-weight: 400;
            transition: 0.5s;
            
        }
        
        .column-desc{
            max-height: 0;
            overflow: hidden;
            transition: 0.4s ease;
        }
        
        .column-desc p{
            padding-top: 1rem;
            font-size: 13px;
            color: #c0c0c0;
            line-height: 1.6rem;
            
            
        }
        
        .columns.active .column-desc {
            max-height: 1000px; 
            transition: 1.7s ease;
        }
        
        .column:hover h18{

            color: #fff !important;
            transition: 0.3s;

        }

        .swiper img{
    
            width: 100%;
                border-radius: 4px;
        }
        .swiper {
          width: 100%;
        
        }
        
        
        .swiper .swiper-button-prev{
           color: white;
        }
        
        .swiper .swiper-button-next{
           color: white;  
        }
        
        .swiper .swiper-pagination-bullet-active{
           background: white;  
        
            
        }
        
        .swiper-pagination{
            padding-bottom: 10px;
            
        }

        .swiper-button-prev {
            color: #262626 !important;
        }
        
        .swiper-button-next {
            color: #262626 !important;
        }
        
        .swiper-pagination-bullet-active {
          background-color: #141414 !important;
        }

        .faq{
            position: fixed;
            bottom: 5%;
            right:3%;
            background-color: #fff;
            border-radius: 30px;
            padding: 14px;
            box-shadow: 0 0 15px #000;
            z-index: 1;

        }

        .faq i{
            color: #141414;
            font-size: 20px;
            font-weight: ;
        }
        .popup2 {
            position: fixed;
            bottom: 15%;
            right: 3%;
            width: 0;
            height: 0;
            background-color: white;
            border-radius: 4px;
            z-index: 1;
            box-shadow: 0 0 15px #000;
            transition: width 0.3s ease-in-out, height 0.3s ease-in-out;
            overflow-y: none;
          }
          
          .popup2.displayed {
 
            width: 300px;
            height: 520px;
          }

          .popup-content{
            text-align: center;
          }

          .close{
            font-size: larger;
            cursor: pointer;
          }

          #hidden {
            opacity: 0;
            transition: 0.3s ease-in-out;
          }
          h24{
            color: #000;
            font-weight: 700;
            margin: 10px;
            font-size: 16px;
            top: 20px;
          }

          .popup-title{

          }
          .text-box-popup{
            width: 80%;
            margin-left: 10%;
            margin-right: 10%;
            
            text-align: left;
            padding-bottom: ;
          }
          .bottom-border{
            border-bottom: 1.5px solid #000;
            width: 100%;
            padding-bottom: 3px;
            padding-top: 10px;
            margin-bottom: 3px;
          }

          #expand-popup-text{
            float: right;
            font-size: 14px;
          }

          h25{
            color: #000;
            font-weight: 600;
            padding-bottom: 5px;
            font-size: 12px;
          }


          h26{
            font-size: 13px;
            padding-bottom: 25px;
            position: absolute;
            bottom: 0 ;
            width: 80%;
            display: block;
            margin-left: 10%;
            text-align: center;
            background-color: white;
            box-shadow: 0 -10px 15px white;
          }
          .text-box-answer{
            display: none;
            color: #141414 !important;
            font-size: 11.5px;
            padding: 3px !important;
          }

          .free-trial{
            display: unset;
            width: 20%;
            position: fixed;
            background-color: #fff;
            border-radius: 5px;
            box-shadow: 0 0 15px rgba(0, 0, 0, 0.425);
            height: 12vh;
            top: 17%;
            left: 3%;
          }

          .free-trial img{
            height: 100%;
            float: left;
            border-radius: 5px 0 0 5px;
          }

          .free-trial .x{
 right: 0;
 top: 0;
 padding: 4px;
 position: absolute;
 cursor: pointer;
          }

          .text-trial{
            font-size: 13px;
            color: #141414;
            padding: 5px !important;
            display: inline-block;
          }

          h27{
            font-weight: 500;
            font-size: 16.5px;
            padding-left: 5px;
            padding-top: 6px !important;
            display: inline-block;
          }

          .free-trial a{
            color: #1a0dab !important
          }

        /* IMAGE */
/*-----media-----*//*-----media-----*//*-----media-----*/



@media only screen and (min-width: 100px) and (max-width: 700px) {
    .hidebr{
        display: none;
    }
}








@media only screen and (min-width:900px) and (max-width: 1440px) {

    .img{
        width: 60vh;
        padding: 20px;
    }


.product-page{
        margin-left: 12%;

}



}
@media(max-width: 550px){
    



    .columns.active .column-desc {
        max-height: 1500px; 
        transition: 1.7s ease;
    }

    .about{
        min-height: 110vh;
        width: 80%;
        margin: auto;
        text-align: center;
    
    }
    .about-top{
        width: 100%;
        min-height: 90vh;
        display: flex;
        align-items: center;
        vertical-align: middle;
    
    
    }


    
    
    .top-text{
        text-align: left;
        width: 100%;
        margin-right: 3%;
        display: inline-block;
    }
    
    .about-top i{
        padding: 7px;
        border-radius: 30px;
        background-color: #333333;
    color: white;
        font-size: 20px;
        transition: 0.5s ease;
        margin-left: 10px;
    }
    .about-top i:hover{
    color: #949494;
    transition: 0.5s ease;
    
    }
    
    
    

    .stripe{
        display: none;
        top: 5.5px;
        position: relative;
    
      }
    .about-bottom{
    
        min-height: 10vh;
        margin-bottom: 10vh;
        background-color: #333333;
        border-radius: 30px;
        padding: 0px 10px 50px 10px !important;
    }
    
    .about-bottom p{
    
        font-size: 13px;
    }
    
    .bottom-marker{
        margin-bottom: 8vh;
        height: 5vh;
    }
    
    
    .checkout{
    
    width:65%;
    position: fixed;
    right: 0;
    z-index: 12;
    margin-top: 25%;
    
    
    
}

    

    


.scroll-btn{
    display: none;
}


    .text{
    
        text-align: center;
        
}
    
    .unten{
        
 
    }
    
    .contact{
        
        height: 130vh;
    }

    .oben:after{
  content: "";
  background: #333333;
        position: absolute;
  bottom: auto;
  left: 5%;
  height: 1.5px;
  width: 90%;
        text-align: center;
}
    
    .title{
        
        font-size: 26px;
    }
    
h12{
    font-weight: 600;
    font-size: 16px;
    color: aliceblue;
}
    
    h14{
        font-size: 13px;
        
    }




    
    .text-box-1{
    width: 50%;
    color:white;
    position: absolute;
    top: 40%;
    left: 35%;
    transform: translate(-50%,-50%);
    text-align: left;
    font-size: 28px;
    }
    
    .cart-mobile{
        display: unset;
    }
    .cart-desktop{
        display:none;
    }



    .text-box-2{
    
    width: 90%;
    color: white;
    position: absolute;
    bottom: 0;
        margin-bottom: 20%;
    left: 50%;
    transform: translate(-50%,-50%); text-align: center;      
}
    .hero-btn{
        display: inline-block;
        text-decoration: none;
        color: gainsboro;
        border: 1px solid #fff;
        padding: 8px 12px;
        font-size: 12px;
        background:  transparent;
        position: relative;
        cursor: pointer;

}



/*--test-*/
        nav .fa-solid{
        display: block;
        font-size:18px;
        color: #fff;
        margin: 10px;
        cursor: pointer;
        font-weight: 700; 
            z-index: 1;
    }
    
        .nav-links ul li{
        display: block;
        padding: 15% 0 0 0;
}
            .nav-links ul li a{
            font-size: 16px;
}
    
            .nav-links ul{
        padding: 25% 0 0 7%;
}
    .nav-links{
        position: absolute;
        background: rgba(192,192,192,0.4);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        -moz-backdrop-filter: blur(10px);
        -o-backdrop-filter: blur(10px);
        -ms-backdrop-filter: blur(10px);
        height: 100vh;
        width: 275px;
        top: 0;
        inset: 0 0 0 50%;
        text-align: left;
        z-index: 11 !important;
        transition:1s;
        padding-top: 5%;
        transform: translateX(100%);
        box-shadow: 0 0px 17px black;
        }

    


.menu-background{
    opacity: 0;
  content  : "";
  position : fixed;
  z-index  : 11;
  bottom   : 0;
  left     : 0;
  pointer-events   : none;
  background: rgba(0,0,0,0.7);
  backdrop-filter: blur(4px);
        -webkit-backdrop-filter: blur(4px);
        -moz-backdrop-filter: blur(4px);
        -o-backdrop-filter: blur(4px);
        -ms-backdrop-filter: blur(4px);
  width    : 100%;
  height   : 200vh;
    transition: 1s;
}
 
    
    
    
/*---*/

    .shop .space-sct{
        display: none;
}
   .shop{

    padding-top: 0px; 
} 

.info-text{
    font-size: 10px;
}
    .Products{

    padding-top: 30%;
    
}
    
    .page-end{
        margin-top: 10vh;
        
    }
.shop-text{
    padding-top: 32.5% !important;
    padding: 5%;
  
}
    .contact{
    min-height: 90vh;
        
    }
    
    .hero{
        width: 90%;
        left: 5% !important;
    

    }


}
/*-----mediaend-----*//*-----mediaend-----*//*-----mediaend-----*/